commit 8df9031d27eeb505a0669b23b71e4aa86b8dbed9
Author: David Kruger <david@krugerlabs.us>
Date:   Wed May 28 11:50:03 2025 -0700

    Grabbed dndbeyond's source code
    
    ```
    ~/go/bin/sourcemapper -output ddb -jsurl https://media.dndbeyond.com/character-app/static/js/main.90aa78c5.js
    ```

diff --git a/README.md b/README.md
new file mode 100644
index 0000000..da2dbb1
--- /dev/null
+++ b/README.md
@@ -0,0 +1,8 @@
+This is the main javascript logic from the dndbeyond.com character sheets
+
+The data is downloaded using `sourcemapper` from https://github.com/denandz/sourcemapper
+
+Given the main JS file URL, the source code can be downloaded and mapped using:
+```
+~/go/bin/sourcemapper -output ddb -jsurl https://media.dndbeyond.com/character-app/static/js/main.90aa78c5.js
+```
diff --git a/ddb_main/components/AbilityScoreManager/AbilityScoreManager.tsx b/ddb_main/components/AbilityScoreManager/AbilityScoreManager.tsx
new file mode 100644
index 0000000..cfbd74f
--- /dev/null
+++ b/ddb_main/components/AbilityScoreManager/AbilityScoreManager.tsx
@@ -0,0 +1,270 @@
+import clsx from "clsx";
+import { HTMLAttributes, ReactNode, useState } from "react";
+
+import {
+  AbilityManager,
+  AbilityScoreSupplierData,
+  DataOrigin,
+  DataOriginUtils,
+  HelperUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { useSidebar } from "~/contexts/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { getDataOriginComponentInfo } from "~/subApps/sheet/components/Sidebar/helpers/paneUtils";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+import DataOriginName from "~/tools/js/smartComponents/DataOriginName";
+import { AbilityIcon } from "~/tools/js/smartComponents/Icons";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  ability: AbilityManager;
+  showHeader?: boolean;
+  isReadonly: boolean;
+  isBuilder?: boolean;
+}
+
+export function AbilityScoreManager({
+  ability,
+  isReadonly,
+  showHeader = true,
+  className = "",
+  isBuilder = false,
+  ...props
+}: Props) {
+  const { characterTheme: theme, originRef } = useCharacterEngine();
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+
+  const [overrideScore, setOverrideScore] = useState(
+    ability.getOverrideScore()
+  );
+  const [otherBonus, setOtherBonus] = useState(ability.getOtherBonus());
+
+  const handleOtherBonusBlur = (
+    evt: React.FocusEvent<HTMLInputElement>
+  ): void => {
+    let value: number | null = HelperUtils.parseInputInt(evt.target.value);
+    setOtherBonus(ability.handleOtherBonusChange(value));
+  };
+
+  const handleOverrideScoreBlur = (
+    evt: React.FocusEvent<HTMLInputElement>
+  ): void => {
+    const value: number | null = HelperUtils.parseInputInt(evt.target.value);
+    setOverrideScore(ability.handleOverrideScoreChange(value));
+  };
+
+  const handleOtherBonusChange = (
+    evt: React.ChangeEvent<HTMLInputElement>
+  ): void => {
+    setOtherBonus(HelperUtils.parseInputInt(evt.target.value));
+  };
+
+  const handleOverrideScoreChange = (
+    evt: React.ChangeEvent<HTMLInputElement>
+  ): void => {
+    setOverrideScore(HelperUtils.parseInputInt(evt.target.value));
+  };
+
+  const handleDataOriginClick = (dataOrigin: DataOrigin) => {
+    let component = getDataOriginComponentInfo(dataOrigin);
+    if (component.type !== PaneComponentEnum.ERROR_404) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  const label = ability.getLabel();
+  const modifier = ability.getModifier();
+  const baseScore = ability.getBaseScore();
+  const statId = ability.getId();
+  const totalScore = ability.getTotalScore();
+  const speciesBonus = ability.getRacialBonus();
+  const classBonuses = ability.getClassBonuses();
+  const miscBonus = ability.getMiscBonus();
+  const stackingBonus = ability.getStackingBonus();
+  const setScore = ability.getSetScore();
+
+  const allStatsBonusSuppliers = ability.getAllStatBonusSuppliers();
+  const statSetScoreSuppliers = ability.getStatSetScoreSuppliers();
+  const stackingBonusSuppliers = ability.getStackingBonusSuppliers();
+
+  const getSupplierData = (
+    suppliers: Array<AbilityScoreSupplierData>
+  ): ReactNode => {
+    return (
+      <div className={styles.suppliers}>
+        {suppliers.map((supplier) => {
+          const origin = supplier.dataOrigin;
+          let expandedOrigin: DataOrigin | null = null;
+
+          if (supplier.expandedOriginRef) {
+            const primaryOrigin = DataOriginUtils.getRefPrimary(
+              supplier.expandedOriginRef,
+              originRef
+            );
+
+            if (primaryOrigin && primaryOrigin["componentId"] !== null) {
+              expandedOrigin = primaryOrigin["dataOrigin"];
+            }
+          }
+          return (
+            <div
+              className={clsx(styles.supplier, isBuilder && styles.builder)}
+              key={supplier.key}
+            >
+              <div className={styles.label}>
+                <DataOriginName
+                  className={isBuilder ? styles.builder : ""}
+                  dataOrigin={origin}
+                  tryParent
+                  theme={theme}
+                  onClick={!isBuilder ? handleDataOriginClick : undefined}
+                />
+                {expandedOrigin && (
+                  <span>
+                    {" "}
+                    (
+                    <DataOriginName
+                      className={isBuilder ? styles.builder : ""}
+                      dataOrigin={expandedOrigin}
+                      tryParent
+                      theme={theme}
+                      onClick={!isBuilder ? handleDataOriginClick : undefined}
+                    />
+                    )
+                  </span>
+                )}
+              </div>
+              <div className={styles.value}>
+                (
+                {supplier.type === "set" ? (
+                  supplier.value
+                ) : (
+                  <NumberDisplay
+                    className={styles.number}
+                    type="signed"
+                    number={supplier.value}
+                  />
+                )}
+                )
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    );
+  };
+
+  return (
+    <div {...props}>
+      {showHeader && (
+        <div className={styles.header}>
+          <AbilityIcon
+            statId={statId}
+            themeMode="light"
+            className={styles.icon}
+          />
+          <div className={styles.name}>{label}</div>
+        </div>
+      )}
+      <div className={styles.table}>
+        <div className={clsx([styles.row, isBuilder && styles.highlight])}>
+          <div className={styles.label}>Total Score</div>
+          <div className={styles.value}>
+            {totalScore === null ? "--" : totalScore}
+          </div>
+        </div>
+        <div className={clsx([styles.row, isBuilder && styles.highlight])}>
+          <div className={styles.label}>Modifier</div>
+          <div className={styles.value}>
+            <NumberDisplay type="signed" number={modifier} />
+          </div>
+        </div>
+        <div className={styles.row}>
+          <div className={styles.label}>Base Score</div>
+          <div className={styles.value}>
+            {baseScore === null ? "--" : baseScore}
+          </div>
+        </div>
+        <div
+          className={clsx(
+            styles.row,
+            allStatsBonusSuppliers.length > 0 && styles.hasSuppliers
+          )}
+        >
+          <div className={styles.label}>
+            <div>Bonus</div>
+          </div>
+          <div className={styles.value}>
+            <NumberDisplay
+              type="signed"
+              number={classBonuses + speciesBonus + miscBonus}
+            />
+          </div>
+        </div>
+        {getSupplierData(allStatsBonusSuppliers)}
+
+        <div
+          className={clsx(
+            styles.row,
+            statSetScoreSuppliers.length > 0 && styles.hasSuppliers
+          )}
+        >
+          <div className={styles.label}>
+            <div>Set Score</div>
+          </div>
+          <div className={styles.value}>{setScore}</div>
+        </div>
+        {getSupplierData(statSetScoreSuppliers)}
+
+        <div
+          className={clsx(
+            styles.row,
+            stackingBonusSuppliers.length > 0 && styles.hasSuppliers
+          )}
+        >
+          <div className={styles.label}>
+            <div>Stacking Bonus</div>
+          </div>
+          <div className={styles.value}>
+            <NumberDisplay type="signed" number={stackingBonus} />
+          </div>
+        </div>
+        {getSupplierData(stackingBonusSuppliers)}
+      </div>
+
+      <div className={styles.overrides}>
+        <div className={styles.override}>
+          <div className={styles.label}>Other Modifier</div>
+          <div className={styles.value}>
+            <input
+              type="number"
+              value={otherBonus === null ? "" : otherBonus}
+              placeholder="--"
+              onChange={handleOtherBonusChange}
+              onBlur={handleOtherBonusBlur}
+              readOnly={isReadonly}
+            />
+          </div>
+        </div>
+        <div className={styles.override}>
+          <div className={styles.label}>Override Score</div>
+          <div className={styles.value}>
+            <input
+              type="number"
+              value={overrideScore === null ? "" : overrideScore}
+              placeholder="--"
+              onChange={handleOverrideScoreChange}
+              onBlur={handleOverrideScoreBlur}
+              readOnly={isReadonly}
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/ddb_main/components/Accordion/Accordion.tsx b/ddb_main/components/Accordion/Accordion.tsx
new file mode 100644
index 0000000..9231649
--- /dev/null
+++ b/ddb_main/components/Accordion/Accordion.tsx
@@ -0,0 +1,148 @@
+import clsx from "clsx";
+import {
+  FC,
+  HTMLAttributes,
+  MouseEvent,
+  ReactNode,
+  useEffect,
+  useRef,
+  useState,
+} from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import ChevronDown from "@dndbeyond/fontawesome-cache/svgs/solid/chevron-down.svg";
+
+import styles from "./styles.module.css";
+
+export interface AccordionProps extends HTMLAttributes<HTMLElement> {
+  variant?: "default" | "text" | "paper";
+  summary: ReactNode;
+  description?: ReactNode;
+  size?: "small" | "medium";
+  forceShow?: boolean;
+  useTheme?: boolean;
+  resetOpen?: boolean;
+  override?: boolean | null;
+  handleIsOpen?: (id: string, isOpen: boolean) => void;
+  summaryAction?: ReactNode;
+  summaryImage?: string;
+  summaryImageAlt?: string;
+  summaryImageSize?: number;
+  summaryMetaItems?: Array<ReactNode>;
+  showAlert?: boolean;
+}
+
+export const Accordion: FC<AccordionProps> = ({
+  className,
+  summary,
+  description,
+  size = "medium",
+  variant = "default",
+  children,
+  forceShow = false,
+  // style,
+  useTheme,
+  resetOpen,
+  handleIsOpen,
+  override = null,
+  id = "",
+  summaryAction,
+  summaryImage,
+  summaryImageAlt,
+  summaryImageSize = 32,
+  summaryMetaItems,
+  showAlert,
+  ...props
+}) => {
+  const summaryRef = useRef<HTMLElement>(null);
+  const contentRef = useRef<HTMLDivElement>(null);
+  const loaded = useRef(false);
+  const [isOpen, setIsOpen] = useState<boolean>(forceShow);
+  const [height, setHeight] = useState<number | string>();
+
+  const handleToggle = (e: MouseEvent) => {
+    e.preventDefault();
+    setIsOpen((current) => {
+      if (handleIsOpen && id) handleIsOpen(id, !current);
+      return !current;
+    });
+  };
+
+  useEffect(() => {
+    const summaryHeight = summaryRef.current?.clientHeight;
+    const contentHeight = contentRef.current?.getBoundingClientRect().height;
+
+    if (isOpen) {
+      // If the dialog is open and it's not the first load, set the height to the summary + content
+      if (summaryHeight && contentHeight && loaded.current === true)
+        setHeight(summaryHeight + contentHeight);
+    } else {
+      // If the dialog is closed, set the height to the summary
+      if (summaryHeight) setHeight(summaryHeight);
+    }
+    loaded.current = true;
+  }, [isOpen, resetOpen]);
+
+  useEffect(() => {
+    if (resetOpen && !isOpen) {
+      setIsOpen(true);
+    }
+  }, [resetOpen]);
+
+  useEffect(() => {
+    if (override !== null) {
+      setIsOpen(override);
+    }
+  }, [override]);
+
+  return (
+    <details
+      className={clsx([
+        styles.details,
+        styles[size],
+        styles[variant],
+        useTheme && styles.theme,
+        showAlert && styles.alert,
+        className,
+      ])}
+      open={isOpen}
+      // style={{ height, ...style }} INVESTIGATE THIS LATER
+      {...props}
+    >
+      <summary
+        className={styles.summary}
+        onClick={handleToggle}
+        ref={summaryRef}
+      >
+        {summaryImage && (
+          <img
+            className={styles.image}
+            src={summaryImage}
+            alt={summaryImageAlt}
+            width={summaryImageSize}
+          />
+        )}
+        <div className={styles.heading}>
+          <div>
+            {summary}
+            {summaryMetaItems && (
+              <div className={styles.metaItems}>
+                {summaryMetaItems.map((metaItem, idx) => (
+                  <div key={uuidv4()} className={styles.metaItem}>
+                    {metaItem}
+                  </div>
+                ))}
+              </div>
+            )}
+          </div>
+          <div className={styles.actions}>{summaryAction}</div>
+          <ChevronDown className={styles.icon} />
+        </div>
+        {description && <div className={styles.description}>{description}</div>}
+      </summary>
+      <div className={styles.content} ref={contentRef}>
+        {children}
+      </div>
+    </details>
+  );
+};
diff --git a/ddb_main/components/Button/Button.tsx b/ddb_main/components/Button/Button.tsx
new file mode 100644
index 0000000..d24ca24
--- /dev/null
+++ b/ddb_main/components/Button/Button.tsx
@@ -0,0 +1,59 @@
+import clsx from "clsx";
+import { FC } from "react";
+
+import {
+  Button as TtuiButton,
+  ButtonProps as TtuiButtonProps,
+} from "@dndbeyond/ttui/components/Button";
+
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+import { ThemeMode } from "~/types";
+
+import styles from "./styles.module.css";
+
+export interface ButtonProps
+  extends Omit<TtuiButtonProps, "size" | "variant" | "color"> {
+  size?: "xx-small" | TtuiButtonProps["size"];
+  themed?: boolean;
+  forceThemeMode?: ThemeMode;
+  variant?: "builder" | "builder-text" | TtuiButtonProps["variant"];
+  color?: "builder-green" | TtuiButtonProps["color"];
+}
+
+export const Button: FC<ButtonProps> = ({
+  className,
+  size = "medium",
+  themed,
+  variant = "solid",
+  forceThemeMode,
+  color,
+  ...props
+}) => {
+  // Check if the button has a custom size
+  const isCustomSize = size === "xx-small";
+  const isCustomVariant = variant === "builder" || variant === "builder-text";
+  const isCustomColor = color === "builder-green";
+  const { isDarkMode } = useCharacterTheme();
+
+  return (
+    <TtuiButton
+      // If the button has a custom size, use local styles
+      className={clsx([
+        styles[size],
+        themed && styles.themed,
+        forceThemeMode && styles[forceThemeMode],
+        styles[variant],
+        !forceThemeMode && isDarkMode && styles.dark,
+        isCustomColor && styles[color],
+        className,
+      ])}
+      // If the button has a normal size, pass prop normally
+      size={!isCustomSize ? size : undefined}
+      // If the button is themed, use theme colors
+      variant={!isCustomVariant ? variant : undefined}
+      // Children are included in props
+      color={!isCustomColor ? color : undefined}
+      {...props}
+    />
+  );
+};
diff --git a/ddb_main/components/Checkbox/Checkbox.tsx b/ddb_main/components/Checkbox/Checkbox.tsx
new file mode 100644
index 0000000..555ac17
--- /dev/null
+++ b/ddb_main/components/Checkbox/Checkbox.tsx
@@ -0,0 +1,82 @@
+import clsx from "clsx";
+import { ChangeEvent, FC, useEffect, useState } from "react";
+
+import {
+  Checkbox as TtuiCheckbox,
+  CheckboxProps as TtuiCheckboxProps,
+} from "@dndbeyond/ttui/components/Checkbox";
+
+import styles from "./styles.module.css";
+
+interface CheckboxProps extends TtuiCheckboxProps {
+  themed?: boolean;
+  darkMode?: boolean;
+  variant?: "default" | "builder" | "sidebar";
+  onClick?: (isEnabled: boolean) => void;
+  onChangePromise?: (
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+}
+
+export const Checkbox: FC<CheckboxProps> = ({
+  className,
+  themed,
+  variant = "default",
+  darkMode,
+  checked = false,
+  onChangePromise,
+  onClick,
+  disabled,
+  ...props
+}) => {
+  const [isChecked, setIsChecked] = useState(checked);
+
+  useEffect(() => {
+    setIsChecked(checked);
+  }, [checked]);
+
+  const handleChange = (evt: ChangeEvent<HTMLInputElement>): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    const newCheckedState = !isChecked;
+
+    // promise-based logic
+    if (onChangePromise) {
+      onChangePromise(
+        newCheckedState,
+        () => {
+          // Promise accepted, update the state
+          setIsChecked(newCheckedState);
+        },
+        () => {
+          // Promise rejected, do nothing
+        }
+      );
+    } else {
+      // Update the state immediately if no promise handling - only IF onClick is provided
+      if (onClick) {
+        onClick(newCheckedState);
+        setIsChecked(newCheckedState);
+      }
+    }
+  };
+  return (
+    <TtuiCheckbox
+      className={clsx([
+        themed && styles.themed,
+        darkMode && styles[darkMode ? "darkMode" : "lightMode"],
+        className,
+        variant === "default" && styles.default,
+        variant === "builder" && styles.builder,
+      ])}
+      onChange={handleChange}
+      aria-pressed={isChecked}
+      checked={isChecked}
+      disabled={disabled}
+      {...props}
+    />
+  );
+};
diff --git a/ddb_main/components/CollapsibleContent/CollapsibleContent.tsx b/ddb_main/components/CollapsibleContent/CollapsibleContent.tsx
new file mode 100644
index 0000000..d06b0e7
--- /dev/null
+++ b/ddb_main/components/CollapsibleContent/CollapsibleContent.tsx
@@ -0,0 +1,62 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, ReactNode, useState } from "react";
+
+import { HtmlContent } from "../HtmlContent";
+import styles from "./styles.module.css";
+
+interface Props extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+  children: ReactNode;
+  className?: string;
+  forceShow?: boolean;
+  heading?: ReactNode;
+  maxLength?: number;
+}
+
+/**
+ * A component that will display a "Show More" button if the content is longer
+ * than the maxLength prop. It will also accept a heading prop to display text
+ * above the content.
+ */
+export const CollapsibleContent: FC<Props> = ({
+  forceShow,
+  className,
+  children,
+  heading,
+  maxLength = 600,
+  ...props
+}) => {
+  const [isOpen, setIsOpen] = useState(forceShow);
+
+  const handleToggleClick = (): void => {
+    setIsOpen((prev) => !prev);
+  };
+
+  if (typeof children === "string" && children?.length <= maxLength && !heading)
+    return (
+      <HtmlContent html={children as string} className={className} {...props} />
+    );
+
+  return (
+    <div
+      className={clsx([
+        styles.collapsible,
+        heading && styles.withHeading,
+        isOpen && styles.open,
+        className,
+      ])}
+      {...props}
+    >
+      {heading && <div>{heading}</div>}
+      {typeof children === "string" ? (
+        <HtmlContent className={styles.content} html={children as string} />
+      ) : (
+        <div className={styles.content}>{children}</div>
+      )}
+      {!forceShow && (
+        <button className={styles.button} onClick={handleToggleClick}>
+          {isOpen ? "Show Less" : "Show More"}
+        </button>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/components/ConfirmModal/ConfirmModal.tsx b/ddb_main/components/ConfirmModal/ConfirmModal.tsx
new file mode 100644
index 0000000..98d5f13
--- /dev/null
+++ b/ddb_main/components/ConfirmModal/ConfirmModal.tsx
@@ -0,0 +1,116 @@
+import clsx from "clsx";
+import { FC, useEffect } from "react";
+
+import CloseIcon from "@dndbeyond/fontawesome-cache/svgs/solid/x.svg";
+import { Dialog, DialogProps } from "@dndbeyond/ttui/components/Dialog";
+
+import { Button, ButtonProps } from "../Button";
+import styles from "./styles.module.css";
+
+/**
+ * @heading Text for the title of the modal - defaults to "Confirm"
+ * @onClose Function to call when the Close button is clicked
+ * @onConfirm Function to call when the Confirm button is clicked
+ * @confirmButtonText Provide text to the Confirm button - defaults to "Confirm"
+ * @closeButtonText Provide text to the Close button - defaults to "Cancel"
+ * @variant "default" | "remove" | "confirm-only"
+ * --default: default modal with both Confirm and Close buttons using the "success" button color
+ * --remove: modal with both Confirm and Close buttons using the "secondary" color for the header and Confirm button
+ * --confirm-only: modal with only the Confirm button using the "success" button color
+ * @size "default" | "fit-content"
+ * --default: default modal size
+ * --fit-content: modal size adjusts to the content
+ * @color Passes a ButtonProps color to the confirm button
+ * @useMobileFullScreen Boolean to set the modal to full screen on mobile breakpoint
+ */
+export interface ConfirmModalProps extends DialogProps {
+  heading?: string;
+  onClose: () => void;
+  onConfirm: () => void;
+  confirmButtonText?: string;
+  closeButtonText?: string;
+  variant?: "default" | "remove" | "confirm-only";
+  size?: "default" | "fit-content";
+  color?: ButtonProps["color"];
+  useMobileFullScreen?: boolean;
+}
+
+export const ConfirmModal: FC<ConfirmModalProps> = ({
+  children,
+  className,
+  heading = "Confirm",
+  onClose,
+  onConfirm,
+  confirmButtonText = "Confirm",
+  closeButtonText = "Cancel",
+  open,
+  variant = "default",
+  size = "default",
+  color = "success",
+  useMobileFullScreen,
+  ...props
+}) => {
+  const isConfirmOnly = variant === "confirm-only";
+
+  useEffect(() => {
+    const body = document.querySelector("body");
+    if (!body) return;
+
+    // Prevent scrolling when modal is visible
+    if (open) {
+      body.style.overflow = "hidden";
+    } else {
+      body.style.overflow = "";
+    }
+  }, [open]);
+
+  return (
+    <Dialog
+      className={clsx([
+        styles.confirmModal,
+        useMobileFullScreen && styles.fullScreen,
+        styles[variant],
+        styles[size],
+        className,
+      ])}
+      onClose={onClose}
+      modal
+      open={open}
+      {...props}
+    >
+      <header className={styles.header}>
+        <h2>{heading}</h2>
+        <Button
+          className={styles.closeButton}
+          size="x-small"
+          variant="text"
+          onClick={onClose}
+          aria-label={`Close ${heading} Modal`}
+          forceThemeMode="light"
+        >
+          <CloseIcon className={styles.closeIcon} />
+        </Button>
+      </header>
+      <div className={styles.content}>{children}</div>
+      <footer className={styles.footer}>
+        {!isConfirmOnly && (
+          <Button className={styles.footerButton} onClick={onClose}>
+            {closeButtonText}
+          </Button>
+        )}
+        <Button
+          className={clsx([
+            styles.footerButton,
+            isConfirmOnly && styles.confirmOnly,
+          ])}
+          color={variant === "remove" ? "secondary" : color}
+          onClick={onConfirm}
+          forceThemeMode="light"
+          size={isConfirmOnly ? "x-small" : undefined}
+        >
+          {confirmButtonText}
+        </Button>
+      </footer>
+    </Dialog>
+  );
+};
diff --git a/ddb_main/components/EditableName/EditableName.tsx b/ddb_main/components/EditableName/EditableName.tsx
new file mode 100644
index 0000000..ee0da45
--- /dev/null
+++ b/ddb_main/components/EditableName/EditableName.tsx
@@ -0,0 +1,40 @@
+import clsx from "clsx";
+import { HTMLAttributes } from "react";
+import { useSelector } from "react-redux";
+
+import Pen from "@dndbeyond/fontawesome-cache/svgs/light/pen.svg";
+
+import { appEnvSelectors } from "../../tools/js/Shared/selectors";
+import styles from "./styles.module.css";
+
+interface EditableNameProps extends HTMLAttributes<HTMLDivElement> {
+  onClick: () => void;
+}
+
+/**
+ * Component which displays children with an edit button to the right. It is
+ * used in panes to give custom names to items, etc.
+ */
+export const EditableName = ({
+  children,
+  className,
+  onClick,
+  ...props
+}: EditableNameProps) => {
+  const isReadOnly = useSelector(appEnvSelectors.getIsReadonly);
+
+  return (
+    <div className={clsx([styles.editableName, className])} {...props}>
+      <div>{children}</div>
+      {!isReadOnly && (
+        <button
+          className={styles.button}
+          onClick={onClick}
+          aria-label="Edit name"
+        >
+          <Pen className={styles.icon} />
+        </button>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/components/FeatureChoice/FeatureChoice.tsx b/ddb_main/components/FeatureChoice/FeatureChoice.tsx
new file mode 100644
index 0000000..995a26a
--- /dev/null
+++ b/ddb_main/components/FeatureChoice/FeatureChoice.tsx
@@ -0,0 +1,306 @@
+import { FC, HTMLAttributes } from "react";
+
+import { BuilderChoiceTypeEnum } from "~/constants";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useRuleData } from "~/hooks/useRuleData";
+import { useSource } from "~/hooks/useSource";
+import {
+  DetailChoice,
+  DetailChoiceFeat,
+} from "~/tools/js/Shared/containers/DetailChoice";
+import { TypeScriptUtils } from "~/tools/js/Shared/utils";
+import {
+  CharClass,
+  Choice,
+  ClassDefinitionContract,
+  ClassFeature,
+  Feat,
+  FeatLookup,
+  FeatureChoiceOption,
+  HtmlSelectOptionGroup,
+  SourceData,
+} from "~/types";
+
+export interface FeatureChoiceProps extends HTMLAttributes<HTMLDivElement> {
+  choice: Choice;
+  charClass?: CharClass;
+  feature?: ClassFeature;
+  featsData: Feat[];
+  subclassData?: ClassDefinitionContract[];
+  onChoiceChange: (
+    choiceId: string,
+    type: number,
+    value: any,
+    parentChoiceId: string | null
+  ) => void;
+  collapseDescription?: boolean;
+}
+
+/**
+ * Component for rendering a features choice(s) - for species traits and class features - using DetailChoiceFeat for a selected feat's choices and DetailChoice for all others.
+ It is used in both the builder and character sheet sidebar panes.
+ */
+export const FeatureChoice: FC<FeatureChoiceProps> = ({
+  charClass,
+  choice,
+  feature,
+  featsData,
+  subclassData,
+  onChoiceChange,
+  className,
+  collapseDescription,
+  ...props
+}) => {
+  const {
+    choiceUtils,
+    featUtils,
+    helperUtils,
+    prerequisiteUtils,
+    classUtils,
+    featLookup,
+    preferences,
+    prerequisiteData,
+    choiceInfo,
+    ruleData,
+    entityRestrictionData,
+  } = useCharacterEngine();
+
+  const { ruleDataUtils } = useRuleData();
+
+  const {
+    getGroupedOptionsBySourceCategory,
+    getSimpleSourcedDefinitionContracts,
+  } = useSource();
+
+  const optionValue = choiceUtils.getOptionValue(choice);
+  const options = choiceUtils.getOptions(choice);
+  const type = choiceUtils.getType(choice);
+  const tagConstraints = choiceUtils.getTagConstraints(choice);
+
+  let availableOptions: Array<FeatureChoiceOption> = [];
+  let availableGroupedOptions: HtmlSelectOptionGroup[] = [];
+  let detailChoiceDesc: string | null = null;
+  let subchoicesNode: React.ReactNode;
+
+  const handleChoiceChange = (
+    id: string,
+    type: number,
+    subType: number | null,
+    value: any,
+    parentChoiceId: string | null
+  ): void => {
+    onChoiceChange(id, type, value, parentChoiceId);
+  };
+
+  const getSubclassData = (): ClassDefinitionContract[] => {
+    if (!subclassData || !charClass) {
+      return [];
+    }
+
+    let data: ClassDefinitionContract[] = [...subclassData];
+
+    let existingSubclass = classUtils.getSubclass(charClass);
+    if (
+      existingSubclass !== null &&
+      !data.some(
+        (classDefinition) =>
+          existingSubclass !== null &&
+          classDefinition.id === existingSubclass.id
+      )
+    ) {
+      data.push(existingSubclass);
+    }
+
+    return data;
+  };
+
+  const getAvailableFeatChoices = (
+    existingFeatId: number | null,
+    featData: Feat[],
+    featLookup: FeatLookup
+  ): Feat[] => {
+    let data: Feat[] = [...featData];
+
+    if (existingFeatId !== null) {
+      let existingFeat = helperUtils.lookupDataOrFallback(
+        featLookup,
+        existingFeatId
+      );
+      if (
+        existingFeat !== null &&
+        !data.some((feat) => featUtils.getId(feat) === existingFeatId)
+      ) {
+        data.push(existingFeat);
+      }
+    }
+
+    return data;
+  };
+
+  const getSubclassSources = (
+    subclass: ClassDefinitionContract
+  ): SourceData[] => {
+    if (subclass.sources === null) {
+      return [];
+    }
+
+    return subclass.sources
+      .map((sourceMapping) =>
+        helperUtils.lookupDataOrFallback(
+          ruleDataUtils.getSourceDataLookup(ruleData),
+          sourceMapping.sourceId
+        )
+      )
+      .filter(TypeScriptUtils.isNotNullOrUndefined);
+  };
+
+  switch (type) {
+    case BuilderChoiceTypeEnum.FEAT_CHOICE_OPTION:
+      const availableFeats = getAvailableFeatChoices(
+        optionValue,
+        featsData,
+        featLookup
+      );
+      const repeatableFeatTracker = new Set();
+
+      // Add selected feat to repeatable tracker if repeatable
+      const selectedFeat = optionValue ? featLookup[optionValue] : null;
+      if (selectedFeat && featUtils.isRepeatable(selectedFeat)) {
+        const parentId = featUtils.getRepeatableGroupId(selectedFeat);
+        if (parentId) {
+          repeatableFeatTracker.add(parentId);
+        }
+      }
+
+      const filteredFeats = availableFeats.filter((feat) => {
+        const featId = featUtils.getId(feat);
+        const isRepeatable = featUtils.isRepeatable(feat);
+
+        // If the feat is the currently selected, always include it
+        if (featId === optionValue) {
+          return true;
+        }
+
+        // Always exclude all previous selected feats
+        if (featLookup[featId]) {
+          return false;
+        }
+
+        // If the Feat does not meet the tag constraints, should they exist, exclude it
+        const tagCategories = featUtils.getCategories(feat);
+        if (
+          tagConstraints &&
+          !featUtils.doesSatisfyTagConstraints(tagCategories, tagConstraints)
+        ) {
+          return false;
+        }
+
+        // Handle prerequisites when enforcing feat rules
+        if (
+          preferences.enforceFeatRules &&
+          !prerequisiteUtils.validatePrerequisiteGrouping(
+            featUtils.getPrerequisites(feat),
+            prerequisiteData
+          )
+        ) {
+          return false;
+        }
+
+        // Special handling for repeatable feats, there can be only one
+        if (isRepeatable) {
+          const parentId = featUtils.getRepeatableGroupId(feat);
+
+          // If a feat from this repeatable group exist exclude all others
+          if (repeatableFeatTracker.has(parentId)) {
+            return false;
+          }
+
+          repeatableFeatTracker.add(parentId);
+        }
+
+        // If none of the exclusions above are met, include the feat
+        return true;
+      });
+
+      //Group available feats by source category
+      availableGroupedOptions = getGroupedOptionsBySourceCategory(
+        filteredFeats
+          .map((feat) => featUtils.getDefinition(feat))
+          .filter(TypeScriptUtils.isNotNullOrUndefined)
+      );
+
+      if (selectedFeat && optionValue !== null) {
+        detailChoiceDesc = featUtils.getDescription(selectedFeat);
+        subchoicesNode = <DetailChoiceFeat featId={optionValue} />;
+      }
+      break;
+
+    case BuilderChoiceTypeEnum.SUB_CLASS_OPTION:
+      const subclassData = getSubclassData();
+
+      //Group available subclasses by source category
+      availableGroupedOptions = getGroupedOptionsBySourceCategory(subclassData);
+
+      const chosenSubclass = subclassData.find(
+        (subclass) => subclass.id === optionValue
+      );
+      if (chosenSubclass) {
+        detailChoiceDesc = "";
+        let sources = getSubclassSources(chosenSubclass);
+        sources.forEach((source) => {
+          if (source.sourceCategory && source.sourceCategory.isToggleable) {
+            detailChoiceDesc += source.sourceCategory.description
+              ? source.sourceCategory.description
+              : "";
+          }
+        });
+      }
+      break;
+    case BuilderChoiceTypeEnum.ENTITY_SPELL_OPTION:
+      // Map over the options to mock parts of a SpellDefinitionContract.
+      const spellOptions = getSimpleSourcedDefinitionContracts(options);
+      availableGroupedOptions = getGroupedOptionsBySourceCategory(
+        spellOptions,
+        optionValue,
+        entityRestrictionData
+      );
+
+      // If there is a chosen spell, set detailChoiceDesc to its description.
+      const chosenSpell = spellOptions.find(
+        (spell) => spell.id === optionValue
+      );
+
+      if (chosenSpell) {
+        detailChoiceDesc = chosenSpell.description ?? "";
+      }
+
+      break;
+
+    default:
+      availableOptions = options.map((option) => ({
+        ...option,
+        value: option.id,
+      }));
+  }
+
+  return (
+    <div className={className} {...props}>
+      <DetailChoice
+        {...choice}
+        choice={choice}
+        options={
+          availableGroupedOptions.length > 0
+            ? availableGroupedOptions
+            : availableOptions
+        }
+        onChange={handleChoiceChange}
+        description={detailChoiceDesc || ""}
+        choiceInfo={choiceInfo}
+        classId={charClass && classUtils.getId(charClass)}
+        showBackgroundProficiencyOptions={true}
+        collapseDescription={collapseDescription}
+      />
+      {subchoicesNode}
+    </div>
+  );
+};
diff --git a/ddb_main/components/FilterGroup/FilterGroup.tsx b/ddb_main/components/FilterGroup/FilterGroup.tsx
new file mode 100644
index 0000000..17fc152
--- /dev/null
+++ b/ddb_main/components/FilterGroup/FilterGroup.tsx
@@ -0,0 +1,214 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, ReactNode } from "react";
+
+import { useFeatureFlags } from "~/contexts/FeatureFlag";
+import { Search } from "~/subApps/builder/components/Search";
+import Checkbox from "~/tools/js/smartComponents/Checkbox";
+
+import { Accordion } from "../Accordion";
+import { Button } from "../Button";
+import styles from "./styles.module.css";
+
+export interface FilterButtonData {
+  label: ReactNode;
+  type: number | string;
+  className?: string;
+  sortOrder?: number;
+}
+export interface FilterCheckboxData {
+  label: string;
+  type: string;
+  initiallyEnabled: boolean;
+  onChange: () => void;
+  className?: string;
+}
+export interface FilterGroupProps extends HTMLAttributes<HTMLDivElement> {
+  filterQuery: string;
+  onQueryChange: (value: string) => void;
+  searchPlaceholder?: string;
+  filterButtonData: Array<FilterButtonData>;
+  activeFilterButtonTypes: Array<number | string>;
+  onFilterButtonClick: (filterType: number | string) => void;
+  filterCheckboxData?: Array<FilterCheckboxData>;
+  sourceCategoryButtonData: Array<FilterButtonData>;
+  onSourceCategoryClick: (categoryId: number) => void;
+  activeFilterSourceCategories: Array<number>;
+  themed?: boolean;
+  buttonGroupLabel: string;
+  buttonSize?: "x-small" | "xx-small";
+  filterStyle?: "builder";
+  shouldOpenFilterButtons?: boolean;
+  shouldOpenSourceCategoryButtons?: boolean;
+  onSourceCategoriesCollapse?: () => void;
+  onFilterButtonsCollapse?: () => void;
+}
+
+export const FilterGroup: FC<FilterGroupProps> = ({
+  filterQuery,
+  searchPlaceholder = "Search",
+  filterButtonData,
+  activeFilterButtonTypes,
+  onQueryChange,
+  onFilterButtonClick,
+  filterCheckboxData,
+  sourceCategoryButtonData,
+  onSourceCategoryClick,
+  activeFilterSourceCategories,
+  themed,
+  buttonGroupLabel,
+  buttonSize = "xx-small",
+  filterStyle,
+  shouldOpenFilterButtons,
+  shouldOpenSourceCategoryButtons,
+  onSourceCategoriesCollapse,
+  onFilterButtonsCollapse,
+  className,
+  ...props
+}) => {
+  const handleQueryChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    onQueryChange(event.target.value);
+  };
+
+  const handleSourceCategoryClick = (evt: React.MouseEvent, id: number) => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    onSourceCategoryClick(id);
+  };
+
+  const handleFilterButtonClick = (
+    evt: React.MouseEvent,
+    type: string | number
+  ) => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    onFilterButtonClick(type);
+  };
+
+  return (
+    <div {...props}>
+      <div className={styles.filterGroup}>
+        <label htmlFor="filter-input" className={styles.filterLabel}>
+          Filter
+        </label>
+        <Search
+          id="filter-input"
+          value={filterQuery}
+          onChange={handleQueryChange}
+          placeholder={searchPlaceholder}
+        />
+      </div>
+
+      {/* FILTER BUTTONS */}
+      <div className={styles.filterGroup}>
+        <Accordion
+          variant="text"
+          size="small"
+          summary={<div className={styles.filterLabel}>{buttonGroupLabel}</div>}
+          className={styles.accordion}
+          forceShow={shouldOpenFilterButtons}
+          onClick={onFilterButtonsCollapse}
+        >
+          <div className={styles.buttonGroup}>
+            {filterButtonData.map((button) => {
+              return (
+                <div
+                  className={clsx([button.className, styles.button])}
+                  key={button.type}
+                >
+                  <Button
+                    color={
+                      filterStyle === "builder" ? "builder-green" : undefined
+                    }
+                    themed={themed}
+                    variant={
+                      activeFilterButtonTypes.includes(button.type)
+                        ? "solid"
+                        : "outline"
+                    }
+                    size={buttonSize}
+                    onClick={(evt) => handleFilterButtonClick(evt, button.type)}
+                  >
+                    {button.label}
+                  </Button>
+                </div>
+              );
+            })}
+          </div>
+          {filterCheckboxData && filterCheckboxData.length > 0 && (
+            <div className={styles.checkboxGroup}>
+              {filterCheckboxData.map((checkbox) => {
+                return (
+                  <div
+                    className={clsx([
+                      styles.checkbox,
+                      filterStyle === "builder" && styles.builder,
+                    ])}
+                    key={checkbox.type}
+                  >
+                    <Checkbox
+                      stopPropagation={true}
+                      initiallyEnabled={checkbox.initiallyEnabled}
+                      onChange={checkbox.onChange}
+                      label={checkbox.label}
+                    />
+                  </div>
+                );
+              })}
+            </div>
+          )}
+        </Accordion>
+      </div>
+
+      {/* SOURCE CATEGORY FILTERS */}
+
+      <div className={styles.filterGroup}>
+        <Accordion
+          variant="text"
+          size="small"
+          summary={
+            <div className={styles.filterLabel}>Filter By Source Category</div>
+          }
+          className={styles.accordion}
+          forceShow={shouldOpenSourceCategoryButtons}
+          onClick={onSourceCategoriesCollapse}
+        >
+          <div className={styles.buttonGroup}>
+            {sourceCategoryButtonData.map((button) => {
+              return (
+                <div
+                  className={clsx([
+                    button.className,
+                    styles.button,
+                    styles.sourceCategoryButton,
+                    filterStyle === "builder" && styles.builder,
+                  ])}
+                  key={button.type}
+                >
+                  <Button
+                    color={
+                      filterStyle === "builder" ? "builder-green" : undefined
+                    }
+                    themed={themed}
+                    variant={
+                      activeFilterSourceCategories.includes(
+                        button.type as number
+                      )
+                        ? "solid"
+                        : "outline"
+                    }
+                    size={buttonSize}
+                    onClick={(evt) =>
+                      handleSourceCategoryClick(evt, button.type as number)
+                    }
+                  >
+                    {button.label}
+                  </Button>
+                </div>
+              );
+            })}
+          </div>
+        </Accordion>
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/components/HelperTextAccordion/HelperTextAccordion.tsx b/ddb_main/components/HelperTextAccordion/HelperTextAccordion.tsx
new file mode 100644
index 0000000..90c3000
--- /dev/null
+++ b/ddb_main/components/HelperTextAccordion/HelperTextAccordion.tsx
@@ -0,0 +1,38 @@
+import { FC } from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import { BuilderHelperTextInfoContract } from "@dndbeyond/character-rules-engine";
+
+import { DdbBadgeSvg } from "~/tools/js/smartComponents/Svg";
+
+import { Accordion, AccordionProps } from "../Accordion";
+import { HtmlContent } from "../HtmlContent";
+import styles from "./styles.module.css";
+
+export interface HelperTextAccordionProps
+  extends Omit<AccordionProps, "summary"> {
+  builderHelperText: BuilderHelperTextInfoContract[];
+}
+
+export const HelperTextAccordion: FC<HelperTextAccordionProps> = ({
+  builderHelperText,
+  ...props
+}) => {
+  return (
+    <>
+      {builderHelperText.map((helperText, idx) => (
+        <Accordion
+          {...props}
+          key={uuidv4()}
+          summary={
+            <span className={styles.summary}>
+              <DdbBadgeSvg /> {helperText.label}
+            </span>
+          }
+        >
+          <HtmlContent html={helperText.description} />
+        </Accordion>
+      ))}
+    </>
+  );
+};
diff --git a/ddb_main/components/HtmlContent/HtmlContent.tsx b/ddb_main/components/HtmlContent/HtmlContent.tsx
new file mode 100644
index 0000000..1c2e5a5
--- /dev/null
+++ b/ddb_main/components/HtmlContent/HtmlContent.tsx
@@ -0,0 +1,25 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import { FormatUtils } from "@dndbeyond/character-rules-engine/es";
+
+interface HtmlContentProps extends HTMLAttributes<HTMLDivElement> {
+  html: string;
+  className?: string;
+  withoutTooltips?: boolean;
+}
+
+export const HtmlContent: FC<HtmlContentProps> = ({
+  html,
+  className = "",
+  withoutTooltips,
+  ...props
+}) => (
+  <div
+    className={clsx(["ddbc-html-content", className])}
+    dangerouslySetInnerHTML={{
+      __html: withoutTooltips ? FormatUtils.stripTooltipTags(html) : html,
+    }}
+    {...props}
+  />
+);
diff --git a/ddb_main/components/InfoItem/InfoItem.tsx b/ddb_main/components/InfoItem/InfoItem.tsx
new file mode 100644
index 0000000..e02b782
--- /dev/null
+++ b/ddb_main/components/InfoItem/InfoItem.tsx
@@ -0,0 +1,35 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import { InfoItem as TtuiInfoItem } from "@dndbeyond/ttui/components/InfoItem";
+
+import { useUnpropagatedClick } from "~/hooks/useUnpropagatedClick";
+
+import styles from "./styles.module.css";
+
+interface InfoItemProps extends HTMLAttributes<HTMLElement> {
+  label: string;
+  color?: "primary"; // Not needed here, but fixes ts error
+  inline?: boolean;
+}
+
+/**
+ * This component is an attribute for a given item, spell, or other entity.
+ * The InfoItemList component is a customized version of the InfoItem component from
+ * the @dndbeyond/ttui library.
+ **/
+export const InfoItem: FC<InfoItemProps> = ({
+  className,
+  onClick,
+  ...props
+}) => {
+  const handleClick = useUnpropagatedClick(onClick);
+
+  return (
+    <TtuiInfoItem
+      className={clsx([styles.item, className])}
+      onClick={onClick ? handleClick : undefined}
+      {...props}
+    />
+  );
+};
diff --git a/ddb_main/components/ItemFilter/ItemFilter.tsx b/ddb_main/components/ItemFilter/ItemFilter.tsx
new file mode 100644
index 0000000..dda2a8d
--- /dev/null
+++ b/ddb_main/components/ItemFilter/ItemFilter.tsx
@@ -0,0 +1,152 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import { useFiltersContext } from "~/contexts/Filters";
+import { SimpleSourceCategoryContract } from "~/types";
+
+import { FilterGroup } from "../FilterGroup";
+import {
+  FilterButtonData,
+  FilterCheckboxData,
+} from "../FilterGroup/FilterGroup";
+import styles from "./styles.module.css";
+
+export interface ItemFilterProps extends HTMLAttributes<HTMLDivElement> {
+  filterQuery: string;
+  onQueryChange: (value: string) => void;
+  filterTypes: Array<string>;
+  onFilterButtonClick: (type: string) => void;
+  onCheckboxChange: (type: string) => void;
+  sourceCategories: Array<SimpleSourceCategoryContract>;
+  onSourceCategoryClick: (categoryId: number) => void;
+  filterSourceCategories: Array<number>;
+  filterProficient: boolean;
+  filterBasic: boolean;
+  filterMagic: boolean;
+  filterContainer: boolean;
+  themed?: boolean;
+  buttonSize?: "x-small" | "xx-small";
+  filterStyle?: "builder";
+}
+
+export const ItemFilter: FC<ItemFilterProps> = ({
+  filterQuery,
+  onQueryChange,
+  filterTypes,
+  onFilterButtonClick,
+  onCheckboxChange,
+  sourceCategories,
+  onSourceCategoryClick,
+  filterSourceCategories,
+  filterProficient,
+  filterBasic,
+  filterMagic,
+  filterContainer,
+  themed,
+  buttonSize = "xx-small",
+  filterStyle,
+  className,
+  ...props
+}) => {
+  const {
+    showItemTypes,
+    showItemSourceCategories,
+    setShowItemSourceCategories,
+    setShowItemTypes,
+  } = useFiltersContext();
+
+  const itemTypes: Array<string> = [
+    "Armor",
+    "Potion",
+    "Ring",
+    "Rod",
+    "Scroll",
+    "Staff",
+    "Wand",
+    "Weapon",
+    "Wondrous item",
+    "Other Gear",
+  ];
+
+  const toggleTypes: Array<string> = [
+    "Proficient",
+    "Common",
+    "Magical",
+    "Container",
+  ];
+
+  const isChecked = (type: string): boolean => {
+    switch (type) {
+      case "Proficient":
+        return filterProficient;
+      case "Common":
+        return filterBasic;
+      case "Magical":
+        return filterMagic;
+      case "Container":
+        return filterContainer;
+      default:
+        return false;
+    }
+  };
+
+  const filterCheckboxData: Array<FilterCheckboxData> = toggleTypes.map(
+    (type) => {
+      return {
+        label: type,
+        type: type,
+        onChange: () => onCheckboxChange(type),
+        initiallyEnabled: isChecked(type),
+      };
+    }
+  );
+
+  const filterButtons: Array<FilterButtonData> = itemTypes.map((itemType) => {
+    return {
+      type: itemType,
+      label: itemType === "Wondrous item" ? "Wondrous" : itemType,
+      className: clsx([
+        styles.filterButton,
+        buttonSize === "xx-small" && styles.filterButtonSmall,
+      ]),
+    };
+  });
+
+  const sourcesData: Array<FilterButtonData> = sourceCategories.map(
+    (sourceCategory) => {
+      return {
+        label: sourceCategory.name,
+        type: sourceCategory.id,
+        className: styles.sourceCategoryButton,
+        sortOrder: sourceCategory.sortOrder,
+      };
+    }
+  );
+
+  return (
+    <FilterGroup
+      searchPlaceholder={"Weapon, Longsword, Vorpal Longsword, etc."}
+      filterQuery={filterQuery}
+      filterButtonData={filterButtons}
+      activeFilterButtonTypes={filterTypes}
+      onQueryChange={onQueryChange}
+      themed={themed}
+      onFilterButtonClick={onFilterButtonClick}
+      onSourceCategoryClick={onSourceCategoryClick}
+      activeFilterSourceCategories={filterSourceCategories}
+      sourceCategoryButtonData={sourcesData}
+      buttonGroupLabel={"Filter By Type"}
+      buttonSize={buttonSize}
+      filterStyle={filterStyle}
+      filterCheckboxData={filterCheckboxData}
+      shouldOpenSourceCategoryButtons={showItemSourceCategories}
+      shouldOpenFilterButtons={showItemTypes}
+      onFilterButtonsCollapse={() => setShowItemTypes(!showItemTypes)}
+      onSourceCategoriesCollapse={() =>
+        setShowItemSourceCategories(!showItemSourceCategories)
+      }
+      className={className}
+      {...props}
+    />
+  );
+};
diff --git a/ddb_main/components/ItemName/ItemName.tsx b/ddb_main/components/ItemName/ItemName.tsx
new file mode 100644
index 0000000..885ba1b
--- /dev/null
+++ b/ddb_main/components/ItemName/ItemName.tsx
@@ -0,0 +1,109 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import {
+  Item,
+  Constants,
+  ItemUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { AttunementIcon } from "~/tools/js/smartComponents/Icons";
+
+import { LegacyBadge } from "../LegacyBadge";
+import { Tooltip } from "../Tooltip";
+import styles from "./styles.module.css";
+
+/**
+ * Component to display the name of an item with an attunement icon and a color
+ * to identify the rarity of the object. It is used in the equipment tab on the
+ * character sheet as well as the manage inventory pane.
+ */
+interface ItemNameProps extends HTMLAttributes<HTMLSpanElement> {
+  item: Item;
+  className?: string;
+  onClick?: () => void;
+  showAttunement?: boolean;
+  showLegacy?: boolean;
+  showLegacyBadge?: boolean;
+}
+
+export const ItemName: FC<ItemNameProps> = ({
+  showAttunement = true,
+  showLegacy = false,
+  showLegacyBadge,
+  className,
+  onClick,
+  item,
+  ...props
+}) => {
+  const handleClick = (e: React.MouseEvent): void => {
+    if (onClick) {
+      e.stopPropagation();
+      e.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  const getDisplayName = () => {
+    const name = ItemUtils.getName(item);
+    if (!name) return ItemUtils.getDefinitionName(item);
+    if (!name) return "Item";
+    return name;
+  };
+
+  const getItemRarity = () => {
+    switch (ItemUtils.getRarity(item)) {
+      case Constants.ItemRarityNameEnum.ARTIFACT:
+        return "artifact";
+      case Constants.ItemRarityNameEnum.LEGENDARY:
+        return "legendary";
+      case Constants.ItemRarityNameEnum.VERY_RARE:
+        return "veryrare";
+      case Constants.ItemRarityNameEnum.RARE:
+        return "rare";
+      case Constants.ItemRarityNameEnum.UNCOMMON:
+        return "uncommon";
+      case Constants.ItemRarityNameEnum.COMMON:
+      default:
+        return "common";
+    }
+  };
+
+  const tooltipId = `itemName-${uuidv4()}`;
+
+  return (
+    <>
+      <span
+        className={clsx([styles.itemName, styles[getItemRarity()], className])}
+        onClick={handleClick}
+        {...props}
+      >
+        {getDisplayName()}
+        {item.isCustomized && (
+          <>
+            <span
+              className={styles.asterisk}
+              data-tooltip-id={tooltipId}
+              data-tooltip-content="Item is Customized"
+            >
+              *
+            </span>
+            <Tooltip id={tooltipId} />
+          </>
+        )}
+        {showAttunement && item.isAttuned && (
+          <span className={styles.icon}>
+            <AttunementIcon />
+          </span>
+        )}
+        {showLegacy && ItemUtils.isLegacy(item) && (
+          <span className={styles.legacy}>(Legacy)</span>
+        )}
+      </span>
+      {showLegacyBadge && ItemUtils.isLegacy(item) && (
+        <LegacyBadge variant="margin-left" />
+      )}
+    </>
+  );
+};
diff --git a/ddb_main/components/Layout/Layout.tsx b/ddb_main/components/Layout/Layout.tsx
new file mode 100644
index 0000000..f701ef3
--- /dev/null
+++ b/ddb_main/components/Layout/Layout.tsx
@@ -0,0 +1,42 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+import { useMatch } from "react-router-dom";
+
+import { Footer } from "@dndbeyond/ttui/components/Footer";
+import { MegaMenu } from "@dndbeyond/ttui/components/MegaMenu";
+import { Sitebar } from "@dndbeyond/ttui/components/Sitebar";
+
+import config from "~/config";
+import useUser from "~/hooks/useUser";
+
+import styles from "./styles.module.css";
+
+const BASE_PATHNAME = config.basePathname;
+
+interface LayoutProps extends HTMLAttributes<HTMLDivElement> {}
+
+export const Layout: FC<LayoutProps> = ({ children, ...props }) => {
+  const isDev = process.env.NODE_ENV === "development";
+  const user = useUser();
+  const matchSheet = useMatch(`${BASE_PATHNAME}/:characterId/`);
+
+  // Don't show the navigation in production
+  if (!isDev) return <>{children}</>;
+
+  return (
+    <div {...props}>
+      {/* TODO: fetch navItems */}
+      <div className={styles.siteStyles}>
+        <Sitebar user={user as any} navItems={[]} />
+        {/* TODO: fetch sources */}
+        <MegaMenu sources={[]} />
+      </div>
+      <div className={clsx(["container", styles.devContainer])}>{children}</div>
+      {!matchSheet && (
+        <div className={styles.siteStyles}>
+          <Footer />
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/components/LegacyBadge/LegacyBadge.tsx b/ddb_main/components/LegacyBadge/LegacyBadge.tsx
new file mode 100644
index 0000000..4538ec4
--- /dev/null
+++ b/ddb_main/components/LegacyBadge/LegacyBadge.tsx
@@ -0,0 +1,41 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import { LabelChip } from "@dndbeyond/ttui/components/LabelChip";
+
+import { Link } from "../Link";
+import styles from "./styles.module.css";
+
+interface LegacyBadgeProps extends HTMLAttributes<HTMLDivElement> {
+  variant?: "margin-left";
+}
+
+export const LegacyBadge: FC<LegacyBadgeProps> = ({
+  variant,
+  className,
+  ...props
+}) => (
+  <LabelChip
+    className={clsx([styles.chip, variant && styles[variant], className])}
+    data-tooltip-id={`legacybadge_${uuidv4()}`}
+    tooltipContent={
+      <span>
+        This doesn't reflect the latest rules and lore.{" "}
+        <Link
+          className={styles.tooltipLink}
+          href="https://dndbeyond.com/legacy"
+          target="_blank"
+          rel="noopener noreferrer"
+          onClick={() => {}} //TODO - can fix this after we refactor Link to not stop propgation inside the component
+        >
+          Learn More
+        </Link>
+      </span>
+    }
+    tooltipClickable
+    {...props}
+  >
+    Legacy
+  </LabelChip>
+);
diff --git a/ddb_main/components/Link/Link.tsx b/ddb_main/components/Link/Link.tsx
new file mode 100644
index 0000000..786fef9
--- /dev/null
+++ b/ddb_main/components/Link/Link.tsx
@@ -0,0 +1,52 @@
+import clsx from "clsx";
+import { AnchorHTMLAttributes, FC } from "react";
+import { Link as RouterLink } from "react-router-dom";
+
+interface LinkProps
+  extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "onClick"> {
+  onClick?: Function;
+  useTheme?: boolean;
+  useRouter?: boolean;
+}
+
+export const Link: FC<LinkProps> = ({
+  children,
+  className,
+  href,
+  onClick,
+  useTheme,
+  useRouter,
+  ...props
+}) => {
+  //TODO - refactor to handle stop propagation on the oustide of this component (about 7 or so files to change)
+  const handleClick = (e: React.MouseEvent): void => {
+    if (onClick) {
+      e.stopPropagation();
+      e.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  if (useRouter)
+    return (
+      <RouterLink
+        className={className}
+        onClick={handleClick}
+        to={href || ""}
+        {...props}
+      >
+        {children}
+      </RouterLink>
+    );
+
+  return (
+    <a
+      className={clsx(["ddbc-link", useTheme && "ddbc-theme-link", className])}
+      onClick={handleClick}
+      href={href}
+      {...props}
+    >
+      {children}
+    </a>
+  );
+};
diff --git a/ddb_main/components/MaxCharactersDialog/MaxCharactersDialog.tsx b/ddb_main/components/MaxCharactersDialog/MaxCharactersDialog.tsx
new file mode 100644
index 0000000..4e3a684
--- /dev/null
+++ b/ddb_main/components/MaxCharactersDialog/MaxCharactersDialog.tsx
@@ -0,0 +1,65 @@
+import { HTMLAttributes, useEffect, useRef } from "react";
+
+import { Button } from "@dndbeyond/ttui/components/Button";
+
+import { MaxCharactersMessageText } from "../MaxCharactersMessageText";
+import styles from "./styles.module.css";
+
+interface MaxCharactersDialogProps extends HTMLAttributes<HTMLDialogElement> {
+  open: boolean;
+  onClose: () => void;
+  useMyCharactersLink?: boolean;
+}
+
+export const MaxCharactersDialog: React.FC<MaxCharactersDialogProps> = ({
+  open,
+  onClose,
+  useMyCharactersLink,
+  ...props
+}) => {
+  const dialogRef = useRef<HTMLDialogElement>(null);
+
+  const handleClickBackdrop = (e) => {
+    const rect = dialogRef.current?.getBoundingClientRect();
+    const isClickInDialog =
+      rect &&
+      rect.top <= e.clientY &&
+      e.clientY <= rect.top + rect.height &&
+      rect.left <= e.clientX &&
+      e.clientX <= rect.left + rect.width;
+
+    if (!isClickInDialog) (dialogRef.current as any)?.close();
+  };
+
+  useEffect(() => {
+    if (open) {
+      // Hacky workaround since showModal() isn't
+      // supported by TypeScript <4.8.3
+      (dialogRef.current as any)?.showModal();
+    } else {
+      // Hacky workaround since close() isn't
+      // supported by TypeScript <4.8.3
+      (dialogRef.current as any)?.close();
+    }
+  }, [onClose, open]);
+
+  return (
+    <dialog
+      className={styles.maxCharactersDialog}
+      ref={dialogRef}
+      onClick={handleClickBackdrop}
+      {...props}
+    >
+      <header>
+        <h2 className={styles.dialogTitle}>Your character slots are full</h2>
+      </header>
+      <MaxCharactersMessageText useMyCharactersLink={useMyCharactersLink} />
+      <footer className={styles.dialogFooter}>
+        <Button href="/store/subscribe" variant="outline">
+          Subscribe
+        </Button>
+        <Button onClick={onClose}>Close</Button>
+      </footer>
+    </dialog>
+  );
+};
diff --git a/ddb_main/components/MaxCharactersMessageText/MaxCharactersMessageText.tsx b/ddb_main/components/MaxCharactersMessageText/MaxCharactersMessageText.tsx
new file mode 100644
index 0000000..9258b6a
--- /dev/null
+++ b/ddb_main/components/MaxCharactersMessageText/MaxCharactersMessageText.tsx
@@ -0,0 +1,47 @@
+import { FC, HTMLAttributes } from "react";
+
+import styles from "./styles.module.css";
+
+interface MaxCharactersMessageTextProps extends HTMLAttributes<HTMLDivElement> {
+  includeTitle?: boolean;
+  useLinks?: boolean;
+  useMyCharactersLink?: boolean;
+}
+
+export const MaxCharactersMessageText: FC<MaxCharactersMessageTextProps> = ({
+  includeTitle,
+  useLinks,
+  useMyCharactersLink,
+  ...props
+}) => {
+  const subscribe = useLinks ? (
+    <a className={styles.link} href="/store/subscribe">
+      Subscribe
+    </a>
+  ) : (
+    "Subscribe"
+  );
+
+  const myCharacters =
+    useMyCharactersLink || useLinks ? (
+      <a className={styles.link} href="/characters">
+        My Characters
+      </a>
+    ) : (
+      "My Characters"
+    );
+
+  return (
+    <div {...props}>
+      {includeTitle && (
+        <p className={styles.messageTitle}>
+          Oops! Your character slots are full.
+        </p>
+      )}
+      <p className={styles.messageSubtext}>
+        You&apos;re quite the adventurer! {subscribe} to unlock additional
+        slots, or return to {myCharacters} and delete a character to make room.
+      </p>
+    </div>
+  );
+};
diff --git a/ddb_main/components/NotificationSystem/NotificationSystem.tsx b/ddb_main/components/NotificationSystem/NotificationSystem.tsx
new file mode 100644
index 0000000..11aab20
--- /dev/null
+++ b/ddb_main/components/NotificationSystem/NotificationSystem.tsx
@@ -0,0 +1,117 @@
+import clsx from "clsx";
+import {
+  forwardRef,
+  HTMLAttributes,
+  useEffect,
+  useImperativeHandle,
+  useState,
+} from "react";
+import { createPortal } from "react-dom";
+
+import XMark from "@dndbeyond/fontawesome-cache/svgs/regular/xmark.svg";
+import { Toast } from "@dndbeyond/ttui/components/Toast";
+
+import { Notification } from "~/tools/js/Shared/stores/typings";
+
+import styles from "./styles.module.css";
+
+export interface NotificationSystemHandlers {
+  addNotification: (notification: Notification) => void;
+  removeNotification: (notification: Notification) => void;
+}
+
+const timeoutDuration = 5000;
+
+interface NotificationSystemProps
+  extends Omit<HTMLAttributes<HTMLElement>, "open" | "contentEditable"> {}
+
+/**
+ * NotificationSystem is a component that manages the display of notifications
+ * in toast messages which appear in the character sheet.
+ */
+export const NotificationSystem = forwardRef<
+  HTMLDialogElement,
+  NotificationSystemProps
+>(({ className, ...props }, ref) => {
+  const [isOpen, setIsOpen] = useState(true);
+  const [notifications, setNotifications] = useState<Array<Notification>>([]);
+  const [notificationTimeoutHandle, setNotificationTimeoutHandle] = useState<
+    number | undefined
+  >();
+  const [portal, setPortal] = useState<HTMLDivElement | null>(null);
+
+  const addNotification = (notification) => {
+    if (notifications.filter((n) => n.uid === notification.uid).length === 0) {
+      setNotifications([...notifications, notification]);
+    }
+    clearTimeout(notificationTimeoutHandle);
+    (function openNotification() {
+      if (!isOpen) {
+        setIsOpen(true);
+      } else {
+        setNotificationTimeoutHandle(() => {
+          const handle = window.setTimeout(() => {
+            openNotification();
+          }, timeoutDuration + 100);
+          return handle;
+        });
+      }
+    })();
+  };
+
+  const removeNotification = (notification) => {
+    notifications[0].onRemove?.();
+    setNotifications(notifications.filter((n) => n.uid !== notification.uid));
+  };
+
+  useImperativeHandle<any, NotificationSystemHandlers>(
+    ref,
+    (): NotificationSystemHandlers => ({
+      addNotification,
+      removeNotification,
+    })
+  );
+
+  const handleClose = () => {
+    setIsOpen(false);
+    removeNotification(notifications[0]);
+  };
+
+  useEffect(() => {
+    const portalEl = document.createElement("div");
+    portalEl.classList.add("ct-notification__portal");
+    portalEl.style.zIndex = "100000";
+    portalEl.style.position = "fixed";
+    document.body.appendChild(portalEl);
+    setPortal(portalEl);
+    return () => {
+      document.body.removeChild(portalEl);
+    };
+  }, []);
+
+  return notifications[0] && portal
+    ? createPortal(
+        <Toast
+          className={clsx([
+            styles.toast,
+            notifications[0].level && styles[notifications[0].level],
+          ])}
+          open={isOpen}
+          onClose={handleClose}
+          autoHideDuration={timeoutDuration}
+          {...props}
+        >
+          <button
+            className={styles.closeButton}
+            onClick={handleClose}
+            aria-label="Dismiss notification"
+          >
+            <XMark className={styles.closeIcon} />
+          </button>
+          <p className={styles.title}>{notifications[0].title}</p>
+          <p className={styles.message}>{notifications[0].message}</p>
+        </Toast>,
+        portal
+      )
+    : null;
+});
diff --git a/ddb_main/components/NumberDisplay/NumberDisplay.tsx b/ddb_main/components/NumberDisplay/NumberDisplay.tsx
new file mode 100644
index 0000000..d7751da
--- /dev/null
+++ b/ddb_main/components/NumberDisplay/NumberDisplay.tsx
@@ -0,0 +1,95 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, ReactNode } from "react";
+
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import { NumberDisplayType } from "~/types";
+
+import styles from "./styles.module.css";
+
+const { FEET_IN_MILES } = Constants;
+
+export interface NumberDisplayProps extends HTMLAttributes<HTMLSpanElement> {
+  number: number | null;
+  type: NumberDisplayType;
+  isModified?: boolean;
+  size?: "large";
+  numberFallback?: ReactNode;
+}
+
+export const NumberDisplay: FC<NumberDisplayProps> = ({
+  number,
+  type,
+  isModified = false,
+  size,
+  numberFallback = "--",
+  className,
+  ...props
+}) => {
+  let label = "";
+  let sign = "";
+  switch (type) {
+    case "weightInLb":
+      label = "lb.";
+      number = number && Math.round((number + Number.EPSILON) * 100) / 100;
+      break;
+    case "distanceInFt":
+      if (number && number % FEET_IN_MILES === 0) {
+        number = number / FEET_IN_MILES;
+        label = `mile${Math.abs(number) === 1 ? "" : "s"}`;
+      } else {
+        label = "ft.";
+      }
+      break;
+    case "signed":
+      if (number != null) {
+        sign = number >= 0 ? "+" : "-";
+        number = Math.abs(number);
+      }
+      break;
+    default:
+      break;
+  }
+
+  return (
+    <span
+      className={clsx([
+        styles.numberDisplay,
+        type === "signed" && styles.signed,
+        type === "distanceInFt" && size && styles[size + "Distance"],
+        isModified && styles.modified,
+        size && styles[size],
+        className,
+      ])}
+      {...props}
+    >
+      {type === "signed" && (
+        /* NOTE: aria-label needs to go on an interactable element, not a span.
+          This will need to be refactored onto the containing button.
+        */
+        <span
+          className={clsx([
+            styles.sign,
+            size && styles[size + "Sign"],
+            styles.labelSignColor,
+          ])}
+          aria-label={sign === "+" ? "plus" : "minus"}
+        >
+          {sign}
+        </span>
+      )}
+      <span>{number === null ? numberFallback : number}</span>
+      {type !== "signed" && (
+        <span
+          className={clsx([
+            styles.label,
+            size && styles[size + "Label"],
+            styles.labelSignColor,
+          ])}
+        >
+          {label}
+        </span>
+      )}
+    </span>
+  );
+};
diff --git a/ddb_main/components/Popover/Popover.tsx b/ddb_main/components/Popover/Popover.tsx
new file mode 100644
index 0000000..fcac944
--- /dev/null
+++ b/ddb_main/components/Popover/Popover.tsx
@@ -0,0 +1,121 @@
+import clsx from "clsx";
+import React, {
+  FC,
+  ReactElement,
+  ReactNode,
+  cloneElement,
+  useEffect,
+} from "react";
+
+import { Dialog } from "@dndbeyond/ttui/components/Dialog";
+import { useIsVisible } from "@dndbeyond/ttui/hooks/useIsVisible";
+
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+
+import styles from "./styles.module.css";
+
+/**
+ * This is a popover component to handle dialogs that are dependent on a location from a trigger element.
+ * It uses the useIsVisible hook to handle the visibility of the dialog. The position of the dialog
+ * is determined by the position prop, which can be set to topLeft, topRight, left, right, bottomLeft, or bottomRight.
+ * The maxWidth prop can be used to set the maximum width of the dialog. The trigger prop is the element that will trigger
+ * the dialog to open.The popover component also handles the positioning of the dialog based on the trigger element. The
+ * handleToggle function toggles the visibility of the dialog, and the handleClose function closes the dialog. The popover
+ * component also adds an event listener to the cancel button in the dialog to close the dialog when clicked.
+ *
+ * In order for a cancel button to work, it must have a `data-cancel` attribute.
+ **/
+interface PopoverProps {
+  className?: string;
+  children?: ReactNode;
+  position?:
+    | "topLeft"
+    | "topRight"
+    | "left"
+    | "right"
+    | "bottomLeft"
+    | "bottomRight"
+    | "bottom";
+  trigger: ReactElement;
+  maxWidth?: number;
+  variant?: "default" | "menu";
+  "data-testid"?: string;
+}
+
+export const Popover: FC<PopoverProps> = ({
+  children,
+  className,
+  maxWidth = 250,
+  position = "bottomRight",
+  trigger,
+  variant = "default",
+  ...props
+}) => {
+  const { ref: popoverRef, isVisible, setIsVisible } = useIsVisible(false);
+  const { isDarkMode } = useCharacterTheme();
+
+  const handleToggle = (e: MouseEvent) => {
+    e?.stopPropagation();
+    setIsVisible(!isVisible);
+  };
+
+  const handleClose = (e: MouseEvent) => {
+    e?.stopPropagation();
+    setIsVisible(false);
+  };
+
+  // Make a copy of the trigger element with an added `onClick` event listener
+  const triggerWithHandlers = cloneElement(trigger, {
+    onClick: (e: MouseEvent) => handleToggle(e),
+  });
+
+  useEffect(() => {
+    // Check to see if the popover has a cancel button based on `data-cancel` attribute
+    const cancelButton = popoverRef.current?.querySelector("[data-cancel]");
+
+    // If there is a cancel button, add an event listener to close the popover
+    if (cancelButton) {
+      cancelButton.addEventListener("click", handleClose);
+    }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [popoverRef.current]);
+
+  const mapChildrenWithProps = () => {
+    // Check if children is a ReactElement
+    if (React.isValidElement(children)) {
+      // Create a copy of the ReactElement and attach handleClose function to it
+      return cloneElement(children as ReactElement, {
+        handleClose,
+      });
+    }
+    // If not just return the children - means its a primitive type
+    else {
+      return children;
+    }
+  };
+
+  return (
+    <div
+      className={clsx([styles.popoverContainer, isDarkMode && styles.dark])}
+      ref={popoverRef}
+    >
+      {triggerWithHandlers}
+      <Dialog
+        className={clsx([
+          styles.popover,
+          styles[variant],
+          styles[position],
+          className,
+        ])}
+        style={{ maxWidth }}
+        open={isVisible}
+        onClose={(e) => handleClose(e as any)} //have to do any because of type mismatch for events
+        onClick={(e) => e.stopPropagation()}
+        {...props}
+      >
+        {mapChildrenWithProps()}
+      </Dialog>
+    </div>
+  );
+};
diff --git a/ddb_main/components/PopoverContent/PopoverContent.tsx b/ddb_main/components/PopoverContent/PopoverContent.tsx
new file mode 100644
index 0000000..6925bb7
--- /dev/null
+++ b/ddb_main/components/PopoverContent/PopoverContent.tsx
@@ -0,0 +1,54 @@
+import { FC, ReactNode } from "react";
+
+import { Button } from "../Button";
+import styles from "./styles.module.css";
+
+interface PopoverContentProps {
+  title?: string;
+  content: string;
+  confirmText?: ReactNode;
+  onConfirm?: () => void;
+  withCancel?: boolean;
+  handleClose?: () => void;
+}
+
+export const PopoverContent: FC<PopoverContentProps> = ({
+  title,
+  content,
+  confirmText = "Confirm",
+  onConfirm,
+  withCancel,
+  handleClose,
+}) => (
+  <>
+    {title && <header className={styles.deletePopoverHeader}>{title}</header>}
+    <div className={styles.deletePopoverContent}>{content}</div>
+    <footer className={styles.deletePopoverFooter}>
+      {withCancel && (
+        <Button
+          size="x-small"
+          variant="outline"
+          color="secondary"
+          themed
+          data-cancel
+        >
+          Cancel
+        </Button>
+      )}
+      {onConfirm && (
+        <Button
+          onClick={() => {
+            if (handleClose) handleClose();
+            if (onConfirm) onConfirm();
+          }}
+          size="x-small"
+          variant="outline"
+          color="secondary"
+          themed
+        >
+          {confirmText}
+        </Button>
+      )}
+    </footer>
+  </>
+);
diff --git a/ddb_main/components/PremadeCharacterEditStatus/PremadeCharacterEditStatus.tsx b/ddb_main/components/PremadeCharacterEditStatus/PremadeCharacterEditStatus.tsx
new file mode 100644
index 0000000..b8a0fb9
--- /dev/null
+++ b/ddb_main/components/PremadeCharacterEditStatus/PremadeCharacterEditStatus.tsx
@@ -0,0 +1,32 @@
+import clsx from "clsx";
+
+import { CharacterStatusSlug } from "@dndbeyond/character-rules-engine/es";
+
+import styles from "./styles.module.css";
+
+interface PremadeCharacterEditStatusProps {
+  characterStatus: CharacterStatusSlug | null;
+  isReadonly: boolean;
+  isBuilderView?: boolean;
+}
+
+export const PremadeCharacterEditStatus = ({
+  characterStatus,
+  isReadonly,
+  isBuilderView,
+}: PremadeCharacterEditStatusProps) => {
+  return (
+    <>
+      {characterStatus === CharacterStatusSlug.PREMADE && !isReadonly && (
+        <div
+          className={clsx([
+            styles.editStateIndicator,
+            isBuilderView && styles.editStateIndicatorBuilder,
+          ])}
+        >
+          Premade <strong>EDIT</strong> mode <strong>ENABLED</strong>
+        </div>
+      )}
+    </>
+  );
+};
diff --git a/ddb_main/components/Reference/Reference.tsx b/ddb_main/components/Reference/Reference.tsx
new file mode 100644
index 0000000..055b696
--- /dev/null
+++ b/ddb_main/components/Reference/Reference.tsx
@@ -0,0 +1,56 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import { Tooltip } from "../Tooltip";
+import styles from "./styles.module.css";
+
+export interface ReferenceProps extends HTMLAttributes<HTMLDivElement> {
+  name: string | null;
+  tooltip?: string | null;
+  page?: number | null;
+  chapter?: number | null;
+  isDarkMode?: boolean;
+}
+
+/**
+ * This component acts as a reference to a specific page or chapter in a book
+ * where the information can be found.
+ */
+
+export const Reference: FC<ReferenceProps> = ({
+  chapter,
+  className,
+  isDarkMode,
+  name,
+  page,
+  tooltip,
+  ...props
+}) => {
+  const id = uuidv4();
+  const reference: string[] = [];
+  if (chapter) reference.push(`ch. ${chapter}`);
+  if (page) reference.push(`pg. ${page}`);
+
+  return (
+    <>
+      <p
+        className={clsx([styles.reference, className])}
+        data-tooltip-id={id}
+        data-tooltip-content={tooltip}
+        data-tooltip-delay-show={1500}
+        {...props}
+      >
+        <span className={styles.name}>{name}</span>
+        {reference.length > 0 && (
+          <span className={styles.ref}>, {reference.join(", ")}</span>
+        )}
+      </p>
+      <Tooltip
+        className={styles.tooltip}
+        id={id}
+        variant={isDarkMode ? "light" : "dark"}
+      />
+    </>
+  );
+};
diff --git a/ddb_main/components/SpellFilter/SpellFilter.tsx b/ddb_main/components/SpellFilter/SpellFilter.tsx
new file mode 100644
index 0000000..2a1a10e
--- /dev/null
+++ b/ddb_main/components/SpellFilter/SpellFilter.tsx
@@ -0,0 +1,129 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useEffect, useState } from "react";
+
+import { useFiltersContext } from "~/contexts/Filters";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { SimpleSourceCategoryContract, Spell } from "~/types";
+
+import { FilterGroup } from "../FilterGroup";
+import { FilterButtonData } from "../FilterGroup/FilterGroup";
+import styles from "./styles.module.css";
+
+export interface SpellFilterProps extends HTMLAttributes<HTMLDivElement> {
+  spells: Array<Spell>;
+  filterQuery: string;
+  filterLevels: Array<number>;
+  onQueryChange: (value: string) => void;
+  onLevelFilterClick: (level: number) => void;
+  sourceCategories: Array<SimpleSourceCategoryContract>;
+  onSourceCategoryClick: (categoryId: number) => void;
+  filterSourceCategories: Array<number>;
+  themed?: boolean;
+  buttonSize?: "x-small" | "xx-small";
+  filterStyle?: "builder";
+}
+
+export const SpellFilter: FC<SpellFilterProps> = ({
+  spells,
+  filterQuery,
+  filterLevels,
+  onQueryChange,
+  onLevelFilterClick,
+  sourceCategories,
+  onSourceCategoryClick,
+  filterSourceCategories,
+  themed,
+  buttonSize = "xx-small",
+  filterStyle,
+  className,
+  ...props
+}) => {
+  const { ruleData, spellUtils, ruleDataUtils, formatUtils } =
+    useCharacterEngine();
+  const {
+    showSpellLevels,
+    showSpellSourceCategories,
+    setShowSpellLevels,
+    setShowSpellSourceCategories,
+  } = useFiltersContext();
+
+  const [spellLevels, setSpellLevels] = useState<Array<number>>([]);
+
+  useEffect(() => {
+    const activeSpellLevelCounts: Array<number> = [];
+    const spellsLevels: Array<number> = [];
+    const maxSpellLevel = ruleDataUtils.getMaxSpellLevel(ruleData);
+
+    for (let i = 0; i <= maxSpellLevel; i++) {
+      activeSpellLevelCounts.push(0);
+      spellsLevels.push(i);
+    }
+
+    spells.forEach((spell) => {
+      activeSpellLevelCounts[spellUtils.getLevel(spell)] += 1;
+    });
+
+    setSpellLevels(
+      spellsLevels.filter((level) => activeSpellLevelCounts[level] !== 0)
+    );
+  }, [spells]);
+
+  const filterButtons: Array<FilterButtonData> = spellLevels.map((level) => {
+    let buttonLabel: React.ReactNode;
+    if (level === 0) {
+      buttonLabel = formatUtils.renderSpellLevelAbbreviation(0);
+    } else {
+      buttonLabel = (
+        <div className={styles.buttonText}>
+          <span>{level}</span>
+          <span
+            className={clsx([
+              styles.ordinal,
+              buttonSize === "xx-small" && styles.ordinalSmall,
+            ])}
+          >
+            {formatUtils.getOrdinalSuffix(level)}
+          </span>
+        </div>
+      );
+    }
+    return { type: level, label: buttonLabel, className: styles.filterButton };
+  });
+
+  const sourcesData: Array<FilterButtonData> = sourceCategories.map(
+    (sourceCategory) => {
+      return {
+        label: sourceCategory.name,
+        type: sourceCategory.id,
+        className: styles.sourceCategoryButton,
+        sortOrder: sourceCategory.sortOrder,
+      };
+    }
+  );
+
+  return (
+    <FilterGroup
+      searchPlaceholder={"Enter Spell Name"}
+      filterQuery={filterQuery}
+      filterButtonData={filterButtons}
+      activeFilterButtonTypes={filterLevels}
+      onQueryChange={onQueryChange}
+      onSourceCategoryClick={onSourceCategoryClick}
+      activeFilterSourceCategories={filterSourceCategories}
+      sourceCategoryButtonData={sourcesData}
+      themed={themed}
+      onFilterButtonClick={onLevelFilterClick}
+      buttonGroupLabel={"Filter By Spell Level"}
+      buttonSize={buttonSize}
+      filterStyle={filterStyle}
+      shouldOpenSourceCategoryButtons={showSpellSourceCategories}
+      shouldOpenFilterButtons={showSpellLevels}
+      onFilterButtonsCollapse={() => setShowSpellLevels(!showSpellLevels)}
+      onSourceCategoriesCollapse={() =>
+        setShowSpellSourceCategories(!showSpellSourceCategories)
+      }
+      className={className}
+      {...props}
+    />
+  );
+};
diff --git a/ddb_main/components/SpellName/SpellName.tsx b/ddb_main/components/SpellName/SpellName.tsx
new file mode 100644
index 0000000..93f7755
--- /dev/null
+++ b/ddb_main/components/SpellName/SpellName.tsx
@@ -0,0 +1,126 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useEffect, useState } from "react";
+import { useSelector } from "react-redux";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  SpellUtils,
+  EntityUtils,
+  FormatUtils,
+  BaseSpell,
+  DataOriginRefData,
+  characterEnvSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+import { useUnpropagatedClick } from "~/hooks/useUnpropagatedClick";
+
+import { ConcentrationIcon, RitualIcon } from "../../tools/js/smartComponents/";
+import { LegacyBadge } from "../LegacyBadge";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLSpanElement> {
+  onClick?: () => void;
+  spell: BaseSpell;
+  showSpellLevel?: boolean;
+  showIcons?: boolean;
+  showExpandedType?: boolean;
+  showLegacy?: boolean;
+  showLegacyBadge?: boolean;
+  dataOriginRefData?: DataOriginRefData | null;
+}
+
+export const SpellName: FC<Props> = ({
+  onClick,
+  spell,
+  showSpellLevel = true,
+  showExpandedType = false,
+  showIcons = true,
+  dataOriginRefData = null,
+  showLegacy = false,
+  showLegacyBadge = false,
+  className,
+  ...props
+}) => {
+  const [expandedInfoText, setExpandedInfoText] = useState("");
+  const location = useSelector(characterEnvSelectors.getContext);
+  const { isDarkMode } = useCharacterTheme();
+
+  const getIconTheme = () => {
+    if (location === "BUILDER") return "dark";
+    return isDarkMode ? "gray" : "dark";
+  };
+
+  const handleClick = useUnpropagatedClick(onClick);
+
+  useEffect(() => {
+    if (dataOriginRefData) {
+      let expandedDataOriginRef = SpellUtils.getExpandedDataOriginRef(spell);
+      if (expandedDataOriginRef === null) {
+        setExpandedInfoText("");
+      } else {
+        setExpandedInfoText(
+          EntityUtils.getDataOriginRefName(
+            expandedDataOriginRef,
+            dataOriginRefData
+          )
+        );
+      }
+    }
+  }, []);
+
+  return (
+    <>
+      <span
+        className={styles.spellName}
+        onClick={onClick ? handleClick : undefined}
+        {...props}
+      >
+        {showExpandedType && expandedInfoText !== "" && (
+          <Tooltip
+            title={expandedInfoText}
+            className={styles.expanded}
+            isDarkMode={isDarkMode}
+          >
+            +
+          </Tooltip>
+        )}
+        {SpellUtils.getName(spell)}
+        {SpellUtils.isCustomized(spell) && (
+          <Tooltip
+            title="Spell is Customized"
+            className={styles.customized}
+            isDarkMode={isDarkMode}
+          >
+            *
+          </Tooltip>
+        )}
+        {showIcons && SpellUtils.getConcentration(spell) && (
+          <ConcentrationIcon
+            className={styles.icon}
+            themeMode={getIconTheme()}
+          />
+        )}
+        {showIcons && SpellUtils.isRitual(spell) && (
+          <RitualIcon
+            className={clsx([styles.icon])}
+            themeMode={getIconTheme()}
+          />
+        )}
+
+        {showSpellLevel && (
+          <span className={styles.level}>
+            ({FormatUtils.renderSpellLevelShortName(SpellUtils.getLevel(spell))}
+            )
+          </span>
+        )}
+        {showLegacy && SpellUtils.isLegacy(spell) && (
+          <span className={styles.legacy}> • Legacy</span>
+        )}
+      </span>
+      {showLegacyBadge && SpellUtils.isLegacy(spell) && (
+        <LegacyBadge variant="margin-left" />
+      )}
+    </>
+  );
+};
diff --git a/ddb_main/components/SummaryList/SummaryList.tsx b/ddb_main/components/SummaryList/SummaryList.tsx
new file mode 100644
index 0000000..9dbc552
--- /dev/null
+++ b/ddb_main/components/SummaryList/SummaryList.tsx
@@ -0,0 +1,26 @@
+import { FC, HTMLAttributes } from "react";
+
+import styles from "./styles.module.css";
+
+export interface SummaryListProps extends HTMLAttributes<HTMLDivElement> {
+  title: string;
+  list: Array<string>;
+}
+
+export const SummaryList: FC<SummaryListProps> = ({
+  title,
+  list,
+  ...props
+}) => {
+  if (!list.length) {
+    return null;
+  }
+
+  return (
+    <div {...props}>
+      <p className={styles.title}>
+        {title}: <span className={styles.listItems}>{list.join(", ")}</span>
+      </p>
+    </div>
+  );
+};
diff --git a/ddb_main/components/Swipeable/Swipeable.tsx b/ddb_main/components/Swipeable/Swipeable.tsx
new file mode 100644
index 0000000..65a70e1
--- /dev/null
+++ b/ddb_main/components/Swipeable/Swipeable.tsx
@@ -0,0 +1,11 @@
+import { useSwipeable } from "react-swipeable";
+
+export const Swipeable = ({
+  handlerFunctions,
+  deltaOverride = 75,
+  ...props
+}) => {
+  const handlers = useSwipeable({ ...handlerFunctions, delta: deltaOverride });
+
+  return <div className="swipeable" {...handlers} {...props}></div>;
+};
diff --git a/ddb_main/components/TabFilter/TabFilter.tsx b/ddb_main/components/TabFilter/TabFilter.tsx
new file mode 100644
index 0000000..3367aa5
--- /dev/null
+++ b/ddb_main/components/TabFilter/TabFilter.tsx
@@ -0,0 +1,98 @@
+import clsx from "clsx";
+import { FC, Fragment, HTMLAttributes, ReactNode, useState } from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+
+import styles from "./styles.module.css";
+
+export interface TabFilterProps extends HTMLAttributes<HTMLDivElement> {
+  filters:
+    | {
+        label: ReactNode;
+        content: ReactNode;
+        badge?: ReactNode;
+      }[];
+  showAllTab?: boolean;
+  sharedChildren?: ReactNode;
+}
+
+export const TabFilter: FC<TabFilterProps> = ({
+  children,
+  className,
+  filters,
+  sharedChildren,
+  showAllTab = true,
+  ...props
+}) => {
+  const [activeFilter, setActiveFilter] = useState(0);
+  const { isDarkMode } = useCharacterTheme();
+  const activeIndex = showAllTab ? activeFilter - 1 : activeFilter;
+  const nonEmptyFilters = filters.filter((f) => f.label !== "");
+
+  const getDefaultLabel = (label: ReactNode) => {
+    if (typeof label === "string") return label;
+    return uuidv4();
+  };
+
+  const getAllContent = () => {
+    return (
+      nonEmptyFilters
+        // Remove optional tabs with duplicate content
+        .filter(
+          (f) =>
+            // Don't render tabs with icons such as ritual or concentration spells
+            typeof f.label === "string" &&
+            // Don't render tabs with the same content as the Attack or Limited Use tab
+            !getDefaultLabel(f.label).match(/(Attack|Limited Use)/)
+        )
+        // Return the content of the remaining tabs to be rendered
+        .map((f) => (
+          <Fragment key={getDefaultLabel(f.label)}>{f.content}</Fragment>
+        ))
+    );
+  };
+
+  return (
+    <div
+      className={clsx([styles.tabFilter, isDarkMode && styles.dark, className])}
+      {...props}
+    >
+      <div className={styles.buttons} data-testid="tab-filters">
+        {showAllTab && (
+          <button
+            className={clsx([activeFilter === 0 && styles.active])}
+            onClick={() => setActiveFilter(0)}
+            data-testid="tab-filter-all"
+          >
+            All
+          </button>
+        )}
+        {nonEmptyFilters.map((filter, i) => {
+          const index = showAllTab ? i + 1 : i;
+          return (
+            <button
+              className={clsx([activeFilter === index && styles.active])}
+              onClick={() => setActiveFilter(index)}
+              data-testid={`tab-filter-${getDefaultLabel(filter.label)
+                .toLowerCase()
+                .replace(/\s/g, "-")}`}
+              key={`${index} + ${filter.label as string}`}
+            >
+              {filter.badge && (
+                <span className={styles.badge}>{filter.badge}</span>
+              )}
+              {filter.label}
+            </button>
+          );
+        })}
+      </div>
+      <div className={styles.content}>
+        {sharedChildren}
+        {!showAllTab || activeFilter !== 0
+          ? nonEmptyFilters[activeIndex]?.content
+          : getAllContent()}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/components/TabList/TabList.tsx b/ddb_main/components/TabList/TabList.tsx
new file mode 100644
index 0000000..100f05a
--- /dev/null
+++ b/ddb_main/components/TabList/TabList.tsx
@@ -0,0 +1,107 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, ReactNode, useState } from "react";
+
+import ChevronDown from "@dndbeyond/fontawesome-cache/svgs/solid/chevron-down.svg";
+
+import { Popover } from "../Popover";
+import styles from "./styles.module.css";
+
+interface TabItem {
+  label: ReactNode;
+  content: ReactNode;
+  className?: string;
+  id: string;
+}
+
+interface TabListProps extends HTMLAttributes<HTMLElement> {
+  tabs: Array<TabItem | null>;
+  variant?: "default" | "collapse" | "toggle";
+  defaultActiveId?: string;
+  maxNavItemsShow?: number;
+}
+
+export const TabList: FC<TabListProps> = ({
+  tabs,
+  defaultActiveId,
+  maxNavItemsShow = 7,
+  variant = "default",
+  ...props
+}) => {
+  const [activeTab, setActiveTab] = useState(
+    defaultActiveId ? defaultActiveId : tabs[0]?.id
+  );
+  const [isTabVisible, setIsTabVisible] = useState(activeTab !== "");
+
+  const handleTabClick = (id: string) => {
+    if (id === activeTab && variant === "collapse") {
+      setIsTabVisible(!isTabVisible);
+    }
+
+    if (id === activeTab && variant === "toggle") {
+      setActiveTab("");
+    }
+
+    if (id !== activeTab) {
+      setActiveTab(id);
+      setIsTabVisible(true);
+    }
+  };
+  const tabsWithContent = tabs.filter((tab) => tab);
+  const visibleTabs = tabsWithContent.slice(0, maxNavItemsShow);
+  const hiddenTabs = tabsWithContent.slice(maxNavItemsShow);
+  const selectedTab = tabs.find((tab) => tab?.id === activeTab);
+
+  return (
+    <div {...props}>
+      <menu className={styles.tabs}>
+        {/* List of visible tabs */}
+        {visibleTabs.map((tab: TabItem) => (
+          <li key={tab.id}>
+            <button
+              className={styles.tabButton}
+              role="radio"
+              aria-checked={activeTab === tab.id}
+              onClick={() => handleTabClick(tab.id)}
+            >
+              {tab.label}
+              {variant !== "default" && (
+                <ChevronDown className={!isTabVisible ? styles.closed : ""} />
+              )}
+            </button>
+          </li>
+        ))}
+
+        {/* Toggle and menu for hidden tabs */}
+        {hiddenTabs.length > 0 && (
+          <li>
+            <Popover
+              className={styles.morePopover}
+              variant="menu"
+              trigger={<button className={styles.tabButton}>More</button>}
+            >
+              <menu className={styles.moreMenu}>
+                {hiddenTabs.map((tab: TabItem) => (
+                  <li key={tab.id}>
+                    <button
+                      className={styles.tabButton}
+                      role="radio"
+                      aria-checked={activeTab === tab.id}
+                      onClick={() => handleTabClick(tab.id)}
+                    >
+                      {tab.label}
+                    </button>
+                  </li>
+                ))}
+              </menu>
+            </Popover>
+          </li>
+        )}
+      </menu>
+
+      {/* Content of the active tab */}
+      <div className={clsx([styles.tabContent, selectedTab?.className])}>
+        {isTabVisible && activeTab !== "" && selectedTab?.content}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/components/TagGroup/TagGroup.tsx b/ddb_main/components/TagGroup/TagGroup.tsx
new file mode 100644
index 0000000..e058dde
--- /dev/null
+++ b/ddb_main/components/TagGroup/TagGroup.tsx
@@ -0,0 +1,30 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import styles from "./styles.module.css";
+
+export interface TagGroupProps extends HTMLAttributes<HTMLDivElement> {
+  label: string;
+  tags: Array<string>;
+}
+
+export const TagGroup: FC<TagGroupProps> = ({
+  label,
+  tags,
+  className,
+  ...props
+}) => {
+  if (!tags.length) return null;
+  return (
+    <div className={clsx([styles.tagGroup, className])} {...props}>
+      <div className={styles.label}>{label}:</div>
+      <div className={styles.group}>
+        {tags.map((tag) => (
+          <div className={styles.tag} key={tag}>
+            {tag}
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/components/Textarea/Textarea.tsx b/ddb_main/components/Textarea/Textarea.tsx
new file mode 100644
index 0000000..54d33c8
--- /dev/null
+++ b/ddb_main/components/Textarea/Textarea.tsx
@@ -0,0 +1,75 @@
+import clsx from "clsx";
+import {
+  forwardRef,
+  HTMLAttributes,
+  useEffect,
+  useImperativeHandle,
+  useRef,
+  useState,
+} from "react";
+
+import styles from "./styles.module.css";
+
+export interface TextareaProps
+  extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+  value?: string;
+  onInputBlur: (textValue: string) => void;
+  onInputKeyUp: () => void;
+}
+
+/**
+ * A component to be used as a text area with auto-resizing capabilities. This
+ * is used in the panes for notes and traits and needs to support text entry as
+ * well as programmatic updates.
+ */
+export const Textarea = forwardRef<HTMLDivElement, TextareaProps>(
+  (
+    { className, value, onInputBlur, onInputKeyUp, placeholder, ...props },
+    forwardedRef
+  ) => {
+    const [currentValue, setCurrentValue] = useState(value);
+
+    const ref = useRef<HTMLDivElement>(null);
+    // Combine the local ref with the forwarded ref
+    useImperativeHandle(forwardedRef, () => ref.current as HTMLDivElement);
+
+    const handleChange = (e) => {
+      const dataSet = e.target.parentNode.dataset;
+      dataSet.value = e.target.value;
+      setCurrentValue(e.target.value);
+    };
+
+    const handleBlur = (e) => onInputBlur(e.target.value);
+    const handleKeyUp = () => onInputKeyUp();
+
+    useEffect(() => {
+      if (ref.current) {
+        const wrapper = ref.current as HTMLDivElement;
+        const textarea = wrapper.children[0] as HTMLTextAreaElement;
+        // Set the data-value attribute to the value
+        wrapper.dataset.value = value;
+        // Set the textarea value to the value
+        textarea.value = value || "";
+        setCurrentValue(value);
+      }
+    }, [value]);
+
+    return (
+      <div
+        className={clsx([styles.textarea, className])}
+        ref={ref}
+        data-value={currentValue}
+        {...props}
+      >
+        <textarea
+          rows={1}
+          placeholder={placeholder}
+          onChange={handleChange}
+          onKeyUp={handleKeyUp}
+          onBlur={handleBlur}
+          value={currentValue}
+        />
+      </div>
+    );
+  }
+);
diff --git a/ddb_main/components/Toggle/Toggle.tsx b/ddb_main/components/Toggle/Toggle.tsx
new file mode 100644
index 0000000..62f93dc
--- /dev/null
+++ b/ddb_main/components/Toggle/Toggle.tsx
@@ -0,0 +1,65 @@
+import clsx from "clsx";
+import { useState, type FC, type HTMLAttributes } from "react";
+import styles from "./styles.module.css";
+import { useSelector } from "react-redux";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+
+export interface ToggleProps
+  extends Omit<HTMLAttributes<HTMLButtonElement>, "onClick"> {
+  
+  checked?: boolean;
+  color?: "primary" | "secondary" | "warning" | "error" | "info" | "success" | "themed";
+  onClick?: (isEnabled: boolean) => void;
+  onChangePromise?: (
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  disabled?: boolean;
+}
+
+export const Toggle: FC<ToggleProps> = ({
+  checked,
+  className,
+  color = "primary",
+  onClick,
+  onChangePromise,
+  ...props
+}) => {
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const [enabled, setEnabled] = useState(checked);
+
+  const handleClick = (evt: React.MouseEvent): void => {
+    if (!isReadonly) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+
+      if (onChangePromise) {
+        onChangePromise(
+          !enabled,
+          () => {
+            setEnabled(!enabled);
+          },
+          () => {}
+        );
+      } else if (onClick) {
+        onClick(!enabled);
+        setEnabled(!enabled);
+      }
+    }
+  };
+
+  return (
+    <button
+      className={clsx([
+        styles.toggle,
+        styles[color],
+        checked && styles.checked,
+        className,
+      ])}
+      onClick={handleClick}
+      aria-pressed={checked}
+      {...props}
+    />
+  );
+};
diff --git a/ddb_main/components/Tooltip/Tooltip.tsx b/ddb_main/components/Tooltip/Tooltip.tsx
new file mode 100644
index 0000000..1b060a0
--- /dev/null
+++ b/ddb_main/components/Tooltip/Tooltip.tsx
@@ -0,0 +1,23 @@
+import clsx from "clsx";
+import { FC } from "react";
+
+import {
+  Tooltip as TTUITooltip,
+  TooltipProps as TTUITooltipProps,
+} from "@dndbeyond/ttui/components/Tooltip";
+
+import styles from "./styles.module.css";
+
+interface TooltipProps extends TTUITooltipProps {}
+
+/**
+ * This tooltip component is a wrapper around the TTUI Tooltip component to provide styles which match the existing tooltip styles. It should be used in all new components so we can get rid of the tippy.js implementation. The TTUI component uses [React Tooltip](https://react-tooltip.com/) under the hood, so you can find all options [here](https://react-tooltip.com/docs/options).
+ */
+
+export const Tooltip: FC<TooltipProps> = ({ className, ...props }) => (
+  <TTUITooltip
+    className={clsx([styles.tooltip, className])}
+    delayShow={300}
+    {...props}
+  />
+);
diff --git a/ddb_main/components/XpManager/XpManager.tsx b/ddb_main/components/XpManager/XpManager.tsx
new file mode 100644
index 0000000..1609299
--- /dev/null
+++ b/ddb_main/components/XpManager/XpManager.tsx
@@ -0,0 +1,208 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useEffect, useMemo, useState } from "react";
+
+import {
+  CharacterUtils,
+  FormatUtils,
+  HelperUtils,
+  HtmlSelectOption,
+  RuleDataUtils,
+} from "@dndbeyond/character-rules-engine";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import XpBar from "~/tools/js/smartComponents/XpBar";
+import { Select } from "~/tools/js/smartComponents/legacy";
+
+import { Button } from "../Button";
+import styles from "./styles.module.css";
+
+const XP_CHANGE_TYPE = {
+  ADD: "ADD",
+  REMOVE: "REMOVE",
+};
+
+interface XpManagerProps extends HTMLAttributes<HTMLDivElement> {
+  handleXpUpdates: (newXpTotal: number) => void;
+  shouldReset: boolean;
+}
+
+export const XpManager: FC<XpManagerProps> = ({
+  handleXpUpdates,
+  shouldReset,
+  ...props
+}) => {
+  const { experienceInfo: xpInfo, ruleData } = useCharacterEngine();
+
+  const [xpNew, setXpNew] = useState<number | null>(null);
+  const [xpChange, setXpChange] = useState<number | null>(null);
+  const [levelChosen, setLevelChosen] = useState<number | null>(null);
+  const [changeType, setChangeType] = useState<string>(XP_CHANGE_TYPE.ADD);
+  const [newXpTotal, setNewXpTotal] = useState<number>(xpInfo.currentLevelXp);
+
+  useEffect(() => {
+    let xpDiff: number = xpChange ?? 0;
+    if (changeType === XP_CHANGE_TYPE.REMOVE) {
+      xpDiff *= -1;
+    }
+
+    let newXpTotal: number = xpInfo.currentLevelXp;
+    if (xpDiff) {
+      newXpTotal += xpDiff;
+    } else if (levelChosen !== null) {
+      newXpTotal = CharacterUtils.deriveCurrentLevelXp(levelChosen, ruleData);
+    } else if (xpNew !== null) {
+      newXpTotal = xpNew;
+    }
+
+    newXpTotal = Math.min(
+      Math.max(0, newXpTotal),
+      CharacterUtils.deriveMaxXp(ruleData)
+    );
+
+    setNewXpTotal((prev) => {
+      if (newXpTotal !== prev) {
+        handleXpUpdates(newXpTotal);
+      }
+      return newXpTotal;
+    });
+  }, [
+    xpChange,
+    changeType,
+    levelChosen,
+    xpNew,
+    xpInfo,
+    ruleData,
+    handleXpUpdates,
+  ]);
+
+  useEffect(() => {
+    if (shouldReset) {
+      setXpNew(null);
+      setXpChange(null);
+      setLevelChosen(null);
+      setChangeType(XP_CHANGE_TYPE.ADD);
+      setNewXpTotal(xpInfo.currentLevelXp);
+    }
+  }, [shouldReset, xpInfo]);
+
+  const levelOptions = useMemo(() => {
+    let levelOptions: Array<HtmlSelectOption> = [];
+    for (let i = 1; i <= RuleDataUtils.getMaxCharacterLevel(ruleData); i++) {
+      levelOptions.push({
+        label: `${i}`,
+        value: i,
+      });
+    }
+
+    return levelOptions;
+  }, [ruleData]);
+
+  const displayCurrentLevelXp = useMemo(() => {
+    return xpInfo.currentLevel === ruleData.maxCharacterLevel
+      ? CharacterUtils.deriveCurrentLevelXp(
+          ruleData.maxCharacterLevel - 1,
+          ruleData
+        )
+      : xpInfo.currentLevelXp;
+  }, [xpInfo, ruleData]);
+
+  const handleChooseLevel = (value: string): void => {
+    setXpNew(null);
+    setXpChange(null);
+    setLevelChosen(HelperUtils.parseInputInt(value));
+  };
+
+  const handleXpChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    setXpNew(null);
+    setXpChange(HelperUtils.parseInputInt(evt.target.value));
+    setLevelChosen(null);
+  };
+
+  const handleXpSet = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    setXpNew(HelperUtils.parseInputInt(evt.target.value));
+    setXpChange(null);
+    setLevelChosen(null);
+  };
+
+  return (
+    <div {...props}>
+      <h2 className={styles.levelTotal}>
+        Current XP Total:{" "}
+        {FormatUtils.renderLocaleNumber(xpInfo.currentLevelXp)} (Level{" "}
+        {xpInfo.currentLevel})
+      </h2>
+      <div className={styles.xpBar}>
+        <XpBar
+          xp={xpInfo.currentLevelXp}
+          showCurrentMarker={true}
+          ruleData={ruleData}
+        />
+      </div>
+      <div className={styles.currentLevelAmounts}>
+        <div>{FormatUtils.renderLocaleNumber(displayCurrentLevelXp)}</div>
+        <div>{FormatUtils.renderLocaleNumber(xpInfo.nextLevelXp)}</div>
+      </div>
+      <div className={clsx([styles.controls, styles.withDivider])}>
+        <div className={styles.control}>
+          <label id="set-level" className={styles.label}>
+            Set Level
+          </label>
+          <Select
+            aria-labelledby="set-level"
+            options={levelOptions}
+            onChange={handleChooseLevel}
+            value={levelChosen}
+            placeholder={"--"}
+          />
+        </div>
+        <div className={clsx([styles.control, styles.setXp])}>
+          <label id="set-xp" className={styles.label}>
+            Set XP
+          </label>
+          <input
+            aria-labelledby="set-xp"
+            type="number"
+            value={xpNew === null ? "" : xpNew}
+            onChange={handleXpSet}
+          />
+        </div>
+        <div className={styles.adjustGroup}>
+          <div className={styles.adjustTabs}>
+            <Button
+              variant="text"
+              size="xx-small"
+              className={clsx([
+                styles.tab,
+                changeType === XP_CHANGE_TYPE.ADD && styles.active,
+              ])}
+              onClick={() => setChangeType(XP_CHANGE_TYPE.ADD)}
+            >
+              Add Xp
+            </Button>
+            <Button
+              variant="text"
+              size="xx-small"
+              className={clsx([
+                styles.tab,
+                changeType === XP_CHANGE_TYPE.REMOVE && styles.active,
+              ])}
+              onClick={() => setChangeType(XP_CHANGE_TYPE.REMOVE)}
+            >
+              Remove Xp
+            </Button>
+          </div>
+          <input
+            type="number"
+            value={xpChange === null ? "" : xpChange}
+            onChange={handleXpChange}
+            placeholder="Type XP Value"
+          />
+        </div>
+      </div>
+      <h2 className={clsx([styles.levelTotal, styles.withDivider])}>
+        New XP Total: {FormatUtils.renderLocaleNumber(newXpTotal)} (Level{" "}
+        {CharacterUtils.deriveXpLevel(newXpTotal, ruleData)})
+      </h2>
+    </div>
+  );
+};
diff --git a/ddb_main/config.ts b/ddb_main/config.ts
new file mode 100644
index 0000000..a9917e4
--- /dev/null
+++ b/ddb_main/config.ts
@@ -0,0 +1,191 @@
+const { Constants } = require("@dndbeyond/character-rules-engine/es");
+enum EnvTypeEnum {
+  PRODUCTION = "production",
+  STAGING = "staging",
+  TEST = "test",
+  DRAFT = "draft",
+  REVIEW = "review",
+  DEVELOPMENT = "development",
+  LOCAL_APP_SHELL = "local_app_shell",
+}
+
+const envConfigs = {
+  [EnvTypeEnum.PRODUCTION]: {
+    apiInfo: {
+      [Constants.ApiTypeEnum.WEBSITE]: "https://www.dndbeyond.com",
+      [Constants.ApiTypeEnum.CHARACTER_SERVICE]:
+        "https://character-service.dndbeyond.com",
+      [Constants.ApiTypeEnum.GAME_DATA_SERVICE]:
+        "https://gamedata-service.dndbeyond.com",
+    },
+    gameLogApiEndpoint: "https://www.dndbeyond.com",
+    ddbApiEndpoint: "https://api.dndbeyond.com",
+    diceAssetEndpoint: "https://www.dndbeyond.com/dice",
+    diceApiEndpoint: "https://dice-service.dndbeyond.com",
+    analyticTrackingId: "UA-26524418-48",
+    authEndpoint: "https://auth-service.dndbeyond.com/v1/cobalt-token",
+    env: EnvTypeEnum.PRODUCTION,
+    ddbMediaUrl: "https://www.dndbeyond.com",
+  },
+  [EnvTypeEnum.STAGING]: {
+    apiInfo: {
+      [Constants.ApiTypeEnum.WEBSITE]: "https://stg.dndbeyond.com",
+      [Constants.ApiTypeEnum.CHARACTER_SERVICE]:
+        "https://character-service-stg.dndbeyond.com",
+      [Constants.ApiTypeEnum.GAME_DATA_SERVICE]:
+        "https://gamedata-service-stg.dndbeyond.com",
+    },
+    gameLogApiEndpoint: "https://stg.dndbeyond.com",
+    ddbApiEndpoint: "https://test-api.dndbeyond.com",
+    diceAssetEndpoint: "https://stg.dndbeyond.com/dice",
+    diceApiEndpoint: "https://dice-service-stg.dndbeyond.com",
+    analyticTrackingId: "UA-26524418-48",
+    authEndpoint: "https://auth-service-stg.dndbeyond.com/v1/cobalt-token",
+    env: EnvTypeEnum.STAGING,
+    ddbMediaUrl: "https://www.dndbeyond.com",
+  },
+  [EnvTypeEnum.DRAFT]: {
+    apiInfo: {
+      [Constants.ApiTypeEnum.WEBSITE]: "https://draft.dndbeyond.com",
+      [Constants.ApiTypeEnum.CHARACTER_SERVICE]:
+        "https://character-service-draft.dndbeyond.com",
+      [Constants.ApiTypeEnum.GAME_DATA_SERVICE]:
+        "https://gamedata-service-draft.dndbeyond.com",
+    },
+    gameLogApiEndpoint: "https://stg.dndbeyond.com",
+    ddbApiEndpoint: "https://test-api.dndbeyond.com",
+    diceAssetEndpoint: "https://stg.dndbeyond.com/dice",
+    diceApiEndpoint: "https://dice-service-stg.dndbeyond.com",
+    analyticTrackingId: "UA-26524418-48",
+    authEndpoint: "https://auth-service-stg.dndbeyond.com/v1/cobalt-token",
+    env: EnvTypeEnum.DRAFT,
+    ddbMediaUrl: "https://www.dndbeyond.com",
+  },
+  [EnvTypeEnum.REVIEW]: {
+    apiInfo: {
+      [Constants.ApiTypeEnum.WEBSITE]: "https://review.dndbeyond.com",
+      [Constants.ApiTypeEnum.CHARACTER_SERVICE]:
+        "https://character-service-review.dndbeyond.com",
+      [Constants.ApiTypeEnum.GAME_DATA_SERVICE]:
+        "https://gamedata-service-review.dndbeyond.com",
+    },
+    gameLogApiEndpoint: "https://stg.dndbeyond.com",
+    ddbApiEndpoint: "https://test-api.dndbeyond.com",
+    diceAssetEndpoint: "https://stg.dndbeyond.com/dice",
+    diceApiEndpoint: "https://dice-service-stg.dndbeyond.com",
+    analyticTrackingId: "UA-26524418-48",
+    authEndpoint: "https://auth-service-stg.dndbeyond.com/v1/cobalt-token",
+    env: EnvTypeEnum.REVIEW,
+    ddbMediaUrl: "https://www.dndbeyond.com",
+  },
+  [EnvTypeEnum.DEVELOPMENT]: {
+    analyticTrackingId: "UA-26524418-48",
+    env: EnvTypeEnum.DEVELOPMENT,
+    diceAssetEndpoint: process.env.REACT_APP_DICE_ASSET_URL,
+    diceApiEndpoint: process.env.REACT_APP_DICE_API_URL,
+    gameLogApiEndpoint: process.env.REACT_APP_GAMELOG_API_URL,
+    ddbApiEndpoint: process.env.REACT_APP_DDB_API_URL,
+    authEndpoint: `${process.env.REACT_APP_DDB_AUTH_URL}`,
+    apiInfo: {
+      [Constants.ApiTypeEnum.WEBSITE]: process.env.REACT_APP_DDB_BASE_URL,
+      [Constants.ApiTypeEnum.CHARACTER_SERVICE]:
+        process.env.REACT_APP_CHARACTER_SERVICE_URL,
+      [Constants.ApiTypeEnum.GAME_DATA_SERVICE]:
+        process.env.REACT_APP_GAMEDATA_API_URL,
+    },
+    ddbMediaUrl: "https://www.dndbeyond.com",
+  },
+  [EnvTypeEnum.LOCAL_APP_SHELL]: {
+    apiInfo: {
+      [Constants.ApiTypeEnum.WEBSITE]: "http://dev.dndbeyond.com:8080",
+      [Constants.ApiTypeEnum.CHARACTER_SERVICE]:
+        "https://character-service-stg.dndbeyond.com",
+      [Constants.ApiTypeEnum.GAME_DATA_SERVICE]:
+        "https://gamedata-service-stg.dndbeyond.com",
+    },
+    gameLogApiEndpoint: "https://stg.dndbeyond.com",
+    ddbApiEndpoint: "https://test-api.dndbeyond.com",
+    diceAssetEndpoint: "https://stg.dndbeyond.com/dice",
+    diceApiEndpoint: "https://dice-service-stg.dndbeyond.com",
+    analyticTrackingId: "UA-26524418-48",
+    authEndpoint: "https://auth-service-stg.dndbeyond.com/v1/cobalt-token",
+    env: EnvTypeEnum.LOCAL_APP_SHELL,
+    ddbMediaUrl: "https://www.dndbeyond.com",
+  },
+};
+
+function getWebsite(env: EnvTypeEnum): string {
+  return envConfigs[env].apiInfo[Constants.ApiTypeEnum.WEBSITE];
+}
+
+function getConfig() {
+  let envKey: EnvTypeEnum = EnvTypeEnum.PRODUCTION;
+  switch (window.location.origin) {
+    case getWebsite(EnvTypeEnum.PRODUCTION):
+      envKey = EnvTypeEnum.PRODUCTION;
+      break;
+    case getWebsite(EnvTypeEnum.STAGING):
+      envKey = EnvTypeEnum.STAGING;
+      break;
+    case getWebsite(EnvTypeEnum.DRAFT):
+      envKey = EnvTypeEnum.DRAFT;
+      break;
+    case getWebsite(EnvTypeEnum.REVIEW):
+      envKey = EnvTypeEnum.REVIEW;
+      break;
+    case getWebsite(EnvTypeEnum.DEVELOPMENT):
+      envKey = EnvTypeEnum.DEVELOPMENT;
+      break;
+    case getWebsite(EnvTypeEnum.LOCAL_APP_SHELL):
+      envKey = EnvTypeEnum.LOCAL_APP_SHELL;
+      break;
+    default:
+      envKey = EnvTypeEnum.PRODUCTION;
+      break;
+  }
+  // this is the config for the current environment
+  let config: Record<string, any> = {
+    ...envConfigs[envKey],
+    debug: process.env.NODE_ENV !== "production",
+    launchDarkylyClientId: process.env.REACT_APP_LAUNCH_DARKLY_CLIENT_ID,
+    production: process.env.NODE_ENV === "production",
+    version: process.env.REACT_APP_VERSION,
+    analyticTrackingId: process.env.REACT_APP_TRACKING_ID,
+    env: process.env.NODE_ENV,
+    characterServiceBaseUrl: `${
+      envConfigs[envKey].apiInfo[Constants.ApiTypeEnum.CHARACTER_SERVICE]
+    }/character/v5`,
+    userServiceBaseUrl: `${
+      envConfigs[envKey].apiInfo[Constants.ApiTypeEnum.CHARACTER_SERVICE]
+    }/user/v5`,
+    ddbBaseUrl: envConfigs[envKey].apiInfo[Constants.ApiTypeEnum.WEBSITE],
+    environment: envKey,
+    basePathname: "/characters",
+  };
+  return config;
+}
+
+// Export config items individually
+export const {
+  analyticTrackingId,
+  env,
+  diceAssetEndpoint,
+  diceApiEndpoint,
+  gameLogApiEndpoint,
+  ddbApiEndpoint,
+  authEndpoint,
+  apiInfo,
+  ddbMediaUrl,
+  debug,
+  launchDarkylyClientId,
+  production,
+  version,
+  characterServiceBaseUrl,
+  userServiceBaseUrl,
+  ddbBaseUrl,
+  environment,
+  basePathname,
+} = getConfig();
+
+// Export the entire config object
+export default getConfig();
diff --git a/ddb_main/constants.ts b/ddb_main/constants.ts
new file mode 100644
index 0000000..e23b1bf
--- /dev/null
+++ b/ddb_main/constants.ts
@@ -0,0 +1,315 @@
+import { Constants } from "@dndbeyond/character-rules-engine";
+
+import config from "./config";
+
+export const DDB_MEDIA_URL = config.ddbMediaUrl;
+
+/* Naming convention for GA constants: Session_Category_Action */
+export const SessionTrackingIds = {
+  DDB: config.production
+    ? "UA-26524418-48" // DDB Proper Account
+    : "UA-117447463-5", // Encounter Builder Test Account
+};
+
+export const SessionNames = {
+  DDB: "DnDBeyond", // Session names cannot use spaces or special characters
+};
+
+export const SessionTrackingIdByName = {
+  [SessionNames.DDB]: SessionTrackingIds.DDB,
+};
+
+const CategoryPrefix = "Character Listing";
+
+export const EventCategories = {
+  DDB_Character: `${CategoryPrefix} Character Card`,
+  DDB_ListingFilter: `${CategoryPrefix} Filter`,
+  DDB_ListingSort: `${CategoryPrefix} Sort`,
+  DDB_PlayerAppBanner: `${CategoryPrefix} Player App Banner`,
+  DDB_Unlock: `${CategoryPrefix} Unlock`,
+};
+
+export const EventActions = {
+  DDB_Character_Campaign: "Campaign",
+  DDB_Character_Copy: "Copy",
+  DDB_Character_Delete: "Delete",
+  DDB_Character_Edit: "Edit",
+  DDB_Character_LeaveCampaign: "Leave Campaign",
+  DDB_Character_View: "View",
+
+  DDB_ListingFilter_SearchChanged: "Search Changed",
+  DDB_ListingFilter_SearchCleared: "Search Cleared",
+
+  DDB_ListingSort_Changed: "Changed",
+
+  DDB_PlayerAppBanner_Dismissed: "Dismissed",
+  DDB_PlayerAppBanner_ClickedCta: "Clicked CTA",
+
+  DDB_Unlock_CharacterLocked: "Character Locked",
+  DDB_Unlock_CharacterUnlocked: "Character Unlocked",
+  DDB_Unlock_FinishUnlockingClicked: "Finish Unlocking Clicked",
+  DDB_Unlock_FinishUnlockingCancelled: "Finish Unlocking Cancelled",
+  DDB_Unlock_FinishUnlockingConfirmed: "Finish Unlocking Confirmed",
+  DDB_Unlock_SubscribeClicked: "Subscribe Clicked",
+};
+
+export const EventLabels = {
+  Cancelled: "Cancelled",
+  Clicked: "Clicked",
+  Confirmed: "Confirmed",
+};
+
+export const InputLimits = {
+  characterNameMaxLength: 128,
+};
+
+export const CharacterNameLimitMsg = `The max length for a name is ${InputLimits.characterNameMaxLength} characters.`;
+
+export const SourceCategoryDescription = {
+  official:
+    "The sources below add additional character options beyond the 2024 Core Rules. You will only see character options from the Core Rules and content you own and have enabled here.",
+  homebrew:
+    "Character options designed by other players and uploaded to D&D BEYOND. Talk to your DM before including Homebrew content.",
+  partnered:
+    "Content developed by our partner publishers. You will only see character options for content you have purchased.",
+};
+
+export const ACCEPTED_IMAGE_TYPES = ["image/jpeg", "image/png", "image/gif"];
+export const FILE_SIZE_3MB = 3 * 1024 * 1024;
+
+/**
+ * Export constants from the rules engine to reduce the number of places where
+ * they're being imported.
+ **/
+export const ActionCustomizationAdjustmentTypes =
+  Constants.ACTION_CUSTOMIZATION_ADJUSTMENT_TYPES;
+export const AllArmorList = Constants.ALL_ARMOR_LIST;
+export const AbilityScoreStatTypeEnum = Constants.AbilityScoreStatTypeEnum;
+export const AbilityScoreTypeEnum = Constants.AbilityScoreTypeEnum;
+export const AbilitySkillEnum = Constants.AbilitySkillEnum;
+export const AbilityStatEnum = Constants.AbilityStatEnum;
+export const AbilityStatMentalList = Constants.ABILITY_STAT_MENTAL_LIST;
+export const AbilityStatPhysicalList = Constants.ABILITY_STAT_PHYSICAL_LIST;
+export const AccessTypeEnum = Constants.AccessTypeEnum;
+export const ActionTypeEnum = Constants.ActionTypeEnum;
+export const ActivatableTypeEnum = Constants.ActivatableTypeEnum;
+export const ActivationTypeEnum = Constants.ActivationTypeEnum;
+export const AdditionalTypeEnum = Constants.AdditionalTypeEnum;
+export const AdjustmentConstraintTypeEnum =
+  Constants.AdjustmentConstraintTypeEnum;
+export const AdjustmentDataTypeEnum = Constants.AdjustmentDataTypeEnum;
+export const AdjustmentTypeEnum = Constants.AdjustmentTypeEnum;
+export const ApiTypeEnum = Constants.ApiTypeEnum;
+export const AppContextTypeEnum = Constants.AppContextTypeEnum;
+export const ArmorClassExtraTypeEnum = Constants.ArmorClassExtraTypeEnum;
+export const ArmorClassTypeEnum = Constants.ArmorClassTypeEnum;
+export const ArmorTypeEnum = Constants.ArmorTypeEnum;
+export const AttackSourceTypeEnum = Constants.AttackSourceTypeEnum;
+export const AttackSubtypeEnum = Constants.AttackSubtypeEnum;
+export const AttackTypeRangeEnum = Constants.AttackTypeRangeEnum;
+export const BackgroundModifierTypeEnum = Constants.BackgroundModifierTypeEnum;
+export const BuilderChoiceSubtypeEnum = Constants.BuilderChoiceSubtypeEnum;
+export const BuilderChoiceTypeEnum = Constants.BuilderChoiceTypeEnum;
+export const CharacterServiceVersionKey =
+  Constants.CHARACTER_SERVICE_VERSION_KEY;
+export const CharacterServiceVersionKeyOverride =
+  Constants.CHARACTER_SERVICE_VERSION_KEY_OVERRIDE;
+export const CreatureCustomizationAdjustmentTypes =
+  Constants.CREATURE_CUSTOMIZATION_ADJUSTMENT_TYPES;
+export const CurrencyValue = Constants.CURRENCY_VALUE;
+export const CustomItemDefinitionEntityTypeId =
+  Constants.CUSTOM_ITEM_DEFINITION_ENTITY_TYPE_ID;
+export const CharacterColorEnum = Constants.CharacterColorEnum;
+export const CharacterLoadingStatusEnum = Constants.CharacterLoadingStatusEnum;
+export const CoinNamesEnum = Constants.CoinNamesEnum;
+export const CoinTypeEnum = Constants.CoinTypeEnum;
+export const ComponentAdjustmentEnum = Constants.ComponentAdjustmentEnum;
+export const ComponentCostTypeEnum = Constants.ComponentCostTypeEnum;
+export const ConditionIdEnum = Constants.ConditionIdEnum;
+export const ConditionTypeEnum = Constants.ConditionTypeEnum;
+export const ContainerTypeEnum = Constants.ContainerTypeEnum;
+export const ContentSharingSettingEnum = Constants.ContentSharingSettingEnum;
+export const CreatureGroupFlagEnum = Constants.CreatureGroupFlagEnum;
+export const CreatureSizeEnum = Constants.CreatureSizeEnum;
+export const CreatureSizeNameEnum = Constants.CreatureSizeNameEnum;
+export const CustomProficiencyTypeEnum = Constants.CustomProficiencyTypeEnum;
+export const DamageAdjustmentList = Constants.DAMAGE_ADJUSTMENT_LIST;
+export const DbStringBookOfAncientSecrets =
+  Constants.DB_STRING_BOOK_OF_ANCIENT_SECRETS;
+export const DbStringCarapace = Constants.DB_STRING_CARAPACE;
+export const DbStringDedicatedWeapon = Constants.DB_STRING_DEDICATED_WEAPON;
+export const DbStringEldritchAdept = Constants.DB_STRING_ELDRITCH_ADEPT;
+export const DbStringGroupSidekick = Constants.DB_STRING_GROUP_SIDEKICK;
+export const DbStringImprovedPactWeapon =
+  Constants.DB_STRING_IMPROVED_PACT_WEAPON;
+export const DbStringInfuseItem = Constants.DB_STRING_INFUSE_ITEM;
+export const DbStringIntegratedProtection =
+  Constants.DB_STRING_INTEGRATED_PROTECTION;
+export const DbStringMartialArts = Constants.DB_STRING_MARTIAL_ARTS;
+export const DbStringMediumArmorMaster =
+  Constants.DB_STRING_MEDIUM_ARMOR_MASTER;
+export const DbStringPactMagic = Constants.DB_STRING_PACT_MAGIC;
+export const DbStringRitualCasterBard = Constants.DB_STRING_RITUAL_CASTER_BARD;
+export const DbStringRitualCasterCleric =
+  Constants.DB_STRING_RITUAL_CASTER_CLERIC;
+export const DbStringRitualCasterDruid =
+  Constants.DB_STRING_RITUAL_CASTER_DRUID;
+export const DbStringRitualCasterList = Constants.DB_STRING_RITUAL_CASTER_LIST;
+export const DbStringRitualCasterSorcerer =
+  Constants.DB_STRING_RITUAL_CASTER_SORCERER;
+export const DbStringRitualCasterWarlock =
+  Constants.DB_STRING_RITUAL_CASTER_WARLOCK;
+export const DbStringRitualCasterWizard =
+  Constants.DB_STRING_RITUAL_CASTER_WIZARD;
+export const DbStringSpellcasting = Constants.DB_STRING_SPELLCASTING;
+export const DbStringSpellEldritchBlast =
+  Constants.DB_STRING_SPELL_ELDRITCH_BLAST;
+export const DbStringTagSidekick = Constants.DB_STRING_TAG_SIDEKICK;
+export const DbStringVerdan = Constants.DB_STRING_VERDAN;
+export const DefaultFeatureFlagInfo = Constants.DEFAULT_FEATURE_FLAG_INFO;
+export const DefinitionKeySeparator = Constants.DEFINITION_KEY_SEPARATOR;
+export const DefinitionServiceVersions = Constants.DEFINITION_SERVICE_VERSIONS;
+export const DiceRollKeyConceptSeparator =
+  Constants.DICE_ROLL_KEY_CONCEPT_SEPARATOR;
+export const DiceRollKeyDataSeparator = Constants.DICE_ROLL_KEY_DATA_SEPARATOR;
+export const DamageAdjustmentTypeEnum = Constants.DamageAdjustmentTypeEnum;
+export const DataOriginDataInfoKeyEnum = Constants.DataOriginDataInfoKeyEnum;
+export const DataOriginTypeEnum = Constants.DataOriginTypeEnum;
+export const DeathCauseEnum = Constants.DeathCauseEnum;
+export const DefenseAdjustmentTypeEnum = Constants.DefenseAdjustmentTypeEnum;
+export const DefinitionPoolTypeInfoKeyEnum =
+  Constants.DefinitionPoolTypeInfoKeyEnum;
+export const DefinitionTypeEnum = Constants.DefinitionTypeEnum;
+export const DiceAdjustmentRollTypeEnum = Constants.DiceAdjustmentRollTypeEnum;
+export const DiceAdjustmentTypeEnum = Constants.DiceAdjustmentTypeEnum;
+export const DiceRollExcludeTypeEnum = Constants.DiceRollExcludeTypeEnum;
+export const DisplayConfigurationTypeEnum =
+  Constants.DisplayConfigurationTypeEnum;
+export const DisplayConfigurationValueEnum =
+  Constants.DisplayConfigurationValueEnum;
+export const DisplayIntentionEnum = Constants.DisplayIntentionEnum;
+export const DurationUnitEnum = Constants.DurationUnitEnum;
+export const EntityLimitedUseScaleOperatorEnum =
+  Constants.EntityLimitedUseScaleOperatorEnum;
+export const EntityTypeEnum = Constants.EntityTypeEnum;
+export const ExtraGroupTypeEnum = Constants.ExtraGroupTypeEnum;
+export const ExtraTypeEnum = Constants.ExtraTypeEnum;
+export const FeatureFlagList = Constants.FEATURE_FLAG_LIST;
+export const FeetInMiles = Constants.FEET_IN_MILES;
+export const FutureItemDefinitionType = Constants.FUTURE_ITEM_DEFINITION_TYPE;
+export const FeatureFlagEnum = Constants.FeatureFlagEnum;
+export const FeatureTypeEnum = Constants.FeatureTypeEnum;
+export const HackVehicleGroupId = Constants.HACK_VEHICLE_GROUP_ID;
+export const HeavyArmorList = Constants.HEAVY_ARMOR_LIST;
+export const ItemCustomizationAdjustmentTypes =
+  Constants.ITEM_CUSTOMIZATION_ADJUSTMENT_TYPES;
+export const InfusionItemDataRuleTypeEnum =
+  Constants.InfusionItemDataRuleTypeEnum;
+export const InfusionModifierDataTypeEnum =
+  Constants.InfusionModifierDataTypeEnum;
+export const InfusionTypeEnum = Constants.InfusionTypeEnum;
+export const ItemBaseTypeEnum = Constants.ItemBaseTypeEnum;
+export const ItemBaseTypeIdEnum = Constants.ItemBaseTypeIdEnum;
+export const ItemRarityNameEnum = Constants.ItemRarityNameEnum;
+export const ItemTypeEnum = Constants.ItemTypeEnum;
+export const LightArmorList = Constants.LIGHT_ARMOR_LIST;
+export const LimitedUseResetTypeEnum = Constants.LimitedUseResetTypeEnum;
+export const LimitedUseResetTypeNameEnum =
+  Constants.LimitedUseResetTypeNameEnum;
+export const LogMessageType = Constants.LogMessageType;
+export const MagicItemAttackWithStatList =
+  Constants.MAGIC_ITEM_ATTACK_WITH_STAT_LIST;
+export const MagicItemEntityTypeId = Constants.MAGIC_ITEM_ENTITY_TYPE_ID;
+export const MediumArmorList = Constants.MEDIUM_ARMOR_LIST;
+export const ModifierBonusTypeEnum = Constants.ModifierBonusTypeEnum;
+export const ModifierSubTypeEnum = Constants.ModifierSubTypeEnum;
+export const ModifierTypeEnum = Constants.ModifierTypeEnum;
+export const MovementTypeEnum = Constants.MovementTypeEnum;
+export const MulticlassSpellSlotRoundingEnum =
+  Constants.MulticlassSpellSlotRoundingEnum;
+export const NoteKeyEnum = Constants.NoteKeyEnum;
+export const NoteTypeEnum = Constants.NoteTypeEnum;
+export const NotificationTypeEnum = Constants.NotificationTypeEnum;
+export const PoundsInTon = Constants.POUNDS_IN_TON;
+export const PropertyList = Constants.PROPERTY_LIST;
+export const PartyInventorySharingStateEnum =
+  Constants.PartyInventorySharingStateEnum;
+export const PreferenceAbilityScoreDisplayTypeEnum =
+  Constants.PreferenceAbilityScoreDisplayTypeEnum;
+export const PreferenceEncumbranceTypeEnum =
+  Constants.PreferenceEncumbranceTypeEnum;
+export const PreferenceHitPointTypeEnum = Constants.PreferenceHitPointTypeEnum;
+export const PreferencePrivacyTypeEnum = Constants.PreferencePrivacyTypeEnum;
+export const PreferenceProgressionTypeEnum =
+  Constants.PreferenceProgressionTypeEnum;
+export const PreferenceSharingTypeEnum = Constants.PreferenceSharingTypeEnum;
+export const PrerequisiteSubTypeEnum = Constants.PrerequisiteSubTypeEnum;
+export const PrerequisiteTypeEnum = Constants.PrerequisiteTypeEnum;
+export const ProficiencyAdjustmentTypeEnum =
+  Constants.ProficiencyAdjustmentTypeEnum;
+export const ProficiencyLevelEnum = Constants.ProficiencyLevelEnum;
+export const ProficiencyRoundingEnum = Constants.ProficiencyRoundingEnum;
+export const ProtectionAvailabilityStatusEnum =
+  Constants.ProtectionAvailabilityStatusEnum;
+export const ProtectionSupplierTypeEnum = Constants.ProtectionSupplierTypeEnum;
+export const RaceTypeEnum = Constants.RaceTypeEnum;
+export const RitualCastingTypeEnum = Constants.RitualCastingTypeEnum;
+export const RuleDataTypeEnum = Constants.RuleDataTypeEnum;
+export const RuleKeyEnum = Constants.RuleKeyEnum;
+export const ShieldsList = Constants.SHIELDS_LIST;
+export const Signed32BitIntMaxValue = Constants.SIGNED_32BIT_INT_MAX_VALUE;
+export const Signed32BitIntMinValue = Constants.SIGNED_32BIT_INT_MIN_VALUE;
+export const SizeList = Constants.SIZE_LIST;
+export const SpellCustomizationAdjustmentTypes =
+  Constants.SPELL_CUSTOMIZATION_ADJUSTMENT_TYPES;
+export const StatAbilityCheckList = Constants.STAT_ABILITY_CHECK_LIST;
+export const StatAbilityScoreList = Constants.STAT_ABILITY_SCORE_LIST;
+export const StatSavingThrowList = Constants.STAT_SAVING_THROW_LIST;
+export const SaveTypeEnum = Constants.SaveTypeEnum;
+export const SenseTypeEnum = Constants.SenseTypeEnum;
+export const SituationalBonusSavingThrowTypeEnum =
+  Constants.SituationalBonusSavingThrowTypeEnum;
+export const SnippetAbilityKeyEnum = Constants.SnippetAbilityKeyEnum;
+export const SnippetContentChunkTypeEnum =
+  Constants.SnippetContentChunkTypeEnum;
+export const SnippetMathOperatorEnum = Constants.SnippetMathOperatorEnum;
+export const SnippetPostProcessTypeEnum = Constants.SnippetPostProcessTypeEnum;
+export const SnippetSymbolEnum = Constants.SnippetSymbolEnum;
+export const SnippetTagDataTypeEnum = Constants.SnippetTagDataTypeEnum;
+export const SnippetTagValueTypeEnum = Constants.SnippetTagValueTypeEnum;
+export const SnippetValueModifierTypeEnum =
+  Constants.SnippetValueModifierTypeEnum;
+export const SourceTypeEnum = Constants.SourceTypeEnum;
+export const SpeedMovementKeyEnum = Constants.SpeedMovementKeyEnum;
+export const SpellConditionTypeEnum = Constants.SpellConditionTypeEnum;
+export const SpellDurationTypeEnum = Constants.SpellDurationTypeEnum;
+export const SpellGroupEnum = Constants.SpellGroupEnum;
+export const SpellPrepareTypeEnum = Constants.SpellPrepareTypeEnum;
+export const SpellRangeTypeEnum = Constants.SpellRangeTypeEnum;
+export const SpellRangeTypeNameEnum = Constants.SpellRangeTypeNameEnum;
+export const SpellScaleTypeNameEnum = Constants.SpellScaleTypeNameEnum;
+export const StartingEquipmentRuleTypeEnum =
+  Constants.StartingEquipmentRuleTypeEnum;
+export const StartingEquipmentTypeEnum = Constants.StartingEquipmentTypeEnum;
+export const StatBlockTypeEnum = Constants.StatBlockTypeEnum;
+export const StealthCheckTypeEnum = Constants.StealthCheckTypeEnum;
+export const TraitTypeEnum = Constants.TraitTypeEnum;
+export const UsableDiceAdjustmentTypeEnum =
+  Constants.UsableDiceAdjustmentTypeEnum;
+export const VehicleComponentGroupTypeEnum =
+  Constants.VehicleComponentGroupTypeEnum;
+export const VehicleConfigurationDisplayTypeEnum =
+  Constants.VehicleConfigurationDisplayTypeEnum;
+export const VehicleConfigurationKeyEnum =
+  Constants.VehicleConfigurationKeyEnum;
+export const VehicleConfigurationPrimaryComponentManageTypeEnum =
+  Constants.VehicleConfigurationPrimaryComponentManageTypeEnum;
+export const VehicleConfigurationSizeTypeEnum =
+  Constants.VehicleConfigurationSizeTypeEnum;
+export const WeaponCategoryEnum = Constants.WeaponCategoryEnum;
+export const WeaponPropertyEnum = Constants.WeaponPropertyEnum;
+export const WeaponTypeEnum = Constants.WeaponTypeEnum;
+export const WeightSpeedTypeEnum = Constants.WeightSpeedTypeEnum;
+export const WeightTypeEnum = Constants.WeightTypeEnum;
+
+export const DefaultCharacterName = Constants.DefaultCharacterName;
diff --git a/ddb_main/contexts/Authentication/Authentication.tsx b/ddb_main/contexts/Authentication/Authentication.tsx
new file mode 100644
index 0000000..ee81df5
--- /dev/null
+++ b/ddb_main/contexts/Authentication/Authentication.tsx
@@ -0,0 +1,21 @@
+import { useContext } from "react";
+import { createContext } from "react";
+
+import useUser from "~/hooks/useUser";
+import type { AppUserState } from "~/hooks/useUser";
+
+export let AuthContext = createContext<AppUserState>(undefined);
+
+export const AuthProvider = ({ children }: { children: React.ReactNode }) => {
+  const user = useUser();
+
+  if (user === undefined) {
+    return null;
+  }
+
+  return <AuthContext.Provider value={user}>{children}</AuthContext.Provider>;
+};
+
+export const useAuth = () => {
+  return useContext(AuthContext);
+};
diff --git a/ddb_main/contexts/CharacterTheme/CharacterTheme.tsx b/ddb_main/contexts/CharacterTheme/CharacterTheme.tsx
new file mode 100644
index 0000000..056ff02
--- /dev/null
+++ b/ddb_main/contexts/CharacterTheme/CharacterTheme.tsx
@@ -0,0 +1,85 @@
+import { useContext, useEffect } from "react";
+import { createContext } from "react";
+import { useSelector } from "react-redux";
+
+import {
+  rulesEngineSelectors,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine";
+
+export let CharacterThemeContext = createContext<CharacterTheme>({
+  isDefault: false,
+  themeColorId: 0,
+  name: "",
+  themeColor: "",
+  backgroundColor: "",
+  isDarkMode: false,
+});
+
+export const CharacterThemeProvider = ({ children }) => {
+  const {
+    isDefault,
+    themeColorId,
+    name,
+    themeColor,
+    backgroundColor,
+    isDarkMode,
+  } = useSelector(rulesEngineSelectors.getCharacterTheme);
+
+  const solidBackground =
+    backgroundColor.length > 7 ? backgroundColor.slice(0, -2) : backgroundColor;
+
+  const isThemeColorDark = () => {
+    // Remove #
+    const c = themeColor.substring(1);
+    // convert rrggbb to decimal
+    const rgb = parseInt(c, 16);
+    const r = (rgb >> 16) & 0xff;
+    const g = (rgb >> 8) & 0xff;
+    const b = (rgb >> 0) & 0xff;
+    // Get luma from rgb colors
+    const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;
+    return luma < 40;
+  };
+
+  useEffect(() => {
+    document.body.dataset.theme = isDarkMode ? "dark" : "light";
+  }, [isDarkMode]);
+
+  return (
+    <CharacterThemeContext.Provider
+      value={{
+        isDefault,
+        themeColorId,
+        name,
+        themeColor,
+        backgroundColor,
+        isDarkMode,
+      }}
+    >
+      <style
+        dangerouslySetInnerHTML={{
+          __html: `
+          :root {
+            --theme-color: ${themeColor};
+            --theme-background: ${backgroundColor};
+            --theme-background-solid: ${solidBackground};
+            --theme-contrast: var(--ttui_grey-${isDarkMode ? 50 : 900});
+
+            --theme-transparent: color-mix(in srgb, var(--theme-color), transparent 60%);
+            
+            /* Update the character muted color for readability on dark mode */
+            ${
+              isDarkMode ? "--character-muted-color: var(--ttui_grey-400);" : ""
+            }
+          }`,
+        }}
+      />
+      {children}
+    </CharacterThemeContext.Provider>
+  );
+};
+
+export const useCharacterTheme = () => {
+  return useContext(CharacterThemeContext);
+};
diff --git a/ddb_main/contexts/FeatureFlag/FeatureFlag.tsx b/ddb_main/contexts/FeatureFlag/FeatureFlag.tsx
new file mode 100644
index 0000000..42827a0
--- /dev/null
+++ b/ddb_main/contexts/FeatureFlag/FeatureFlag.tsx
@@ -0,0 +1,84 @@
+import { FC, createContext, useContext, useEffect, useState } from "react";
+
+import { toCamelCase } from "~/helpers/casing";
+import { getFeatureFlagsFromCharacterService } from "~/helpers/characterServiceApi";
+
+const featureFlagsToGet = [
+  "release-gate-ims",
+  "release-gate-gfs-blessings-ui",
+  "release-gate-character-sheet-tour",
+  "release-gate-premade-characters",
+];
+
+export const defaultFlags = {
+  imsFlag: false,
+  gfsBlessingsUiFlag: false,
+  characterSheetTourFlag: false,
+  premadeCharactersFlag: false,
+};
+
+export type FeatureFlags = typeof defaultFlags;
+
+export interface FeatureFlagContextType extends FeatureFlags {
+  featureFlags: FeatureFlags;
+}
+
+export const FeatureFlagContext = createContext<FeatureFlagContextType>(null!);
+
+interface ProviderProps {
+  defaultOverrides?: Partial<FeatureFlags>;
+}
+
+export const FeatureFlagProvider: FC<ProviderProps> = ({
+  children,
+  defaultOverrides,
+}) => {
+  const [featureFlags, setFeatureFlags] = useState({
+    ...defaultFlags,
+    ...defaultOverrides,
+  });
+
+  const convertFlagsToKeys = (flags: Object) => {
+    return Object.keys(flags).reduce((acc, flag) => {
+      // Perform any manipulations to remove unwanted characters
+      const formattedFlag = flag
+        // Remove `character-app` from the flag name
+        .replace(/character-app\./i, "")
+        // Remove `release-gate` from the flag name
+        .replace(/release-gate\W/i, "")
+        // Remove `character-sheet` from flag name if not the tour flag
+        .replace(/character-sheet\W(?!tour)/i, "")
+        // Change `2d` to `tactical` since var can't start with number
+        .replace(/2d/i, "tactical");
+
+      const key = toCamelCase(`${formattedFlag}Flag`);
+      return { ...acc, [key]: flags[flag] };
+    }, {});
+  };
+
+  const getFeatureFlags = async () => {
+    try {
+      const req = await getFeatureFlagsFromCharacterService(featureFlagsToGet);
+      const res = await req.json();
+      const flags = convertFlagsToKeys(res.data) as FeatureFlags;
+      setFeatureFlags(flags);
+    } catch (err) {
+      console.error(err);
+    }
+  };
+
+  useEffect(() => {
+    if (!defaultOverrides) getFeatureFlags();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [defaultOverrides]);
+
+  return (
+    <FeatureFlagContext.Provider value={{ ...featureFlags, featureFlags }}>
+      {children}
+    </FeatureFlagContext.Provider>
+  );
+};
+
+export const useFeatureFlags = () => {
+  return useContext(FeatureFlagContext);
+};
diff --git a/ddb_main/contexts/Filters/Filters.tsx b/ddb_main/contexts/Filters/Filters.tsx
new file mode 100644
index 0000000..da2fa60
--- /dev/null
+++ b/ddb_main/contexts/Filters/Filters.tsx
@@ -0,0 +1,45 @@
+import { createContext, FC, useContext, useState } from "react";
+
+export interface FiltersContextType {
+  showItemTypes: boolean;
+  setShowItemTypes: (show: boolean) => void;
+  showItemSourceCategories: boolean;
+  setShowItemSourceCategories: (show: boolean) => void;
+  showSpellLevels: boolean;
+  setShowSpellLevels: (show: boolean) => void;
+  showSpellSourceCategories: boolean;
+  setShowSpellSourceCategories: (show: boolean) => void;
+}
+
+export const FiltersContext = createContext<FiltersContextType>(null!);
+
+export const FiltersProvider: FC = ({ children }) => {
+  const [showItemTypes, setShowItemTypes] = useState(true);
+  const [showItemSourceCategories, setShowItemSourceCategories] =
+    useState(true);
+
+  const [showSpellLevels, setShowSpellLevels] = useState(true);
+  const [showSpellSourceCategories, setShowSpellSourceCategories] =
+    useState(true);
+
+  return (
+    <FiltersContext.Provider
+      value={{
+        showItemTypes,
+        setShowItemTypes,
+        showItemSourceCategories,
+        setShowItemSourceCategories,
+        showSpellLevels,
+        setShowSpellLevels,
+        showSpellSourceCategories,
+        setShowSpellSourceCategories,
+      }}
+    >
+      {children}
+    </FiltersContext.Provider>
+  );
+};
+
+export const useFiltersContext = () => {
+  return useContext(FiltersContext);
+};
diff --git a/ddb_main/contexts/Head/Head.tsx b/ddb_main/contexts/Head/Head.tsx
new file mode 100644
index 0000000..4256e0c
--- /dev/null
+++ b/ddb_main/contexts/Head/Head.tsx
@@ -0,0 +1,36 @@
+import { createContext, useContext, useState } from "react";
+import { Helmet } from "react-helmet";
+
+interface HeadContextProps {
+  title: string;
+  setTitle: (title: string) => void;
+}
+
+export const HeadContext = createContext<HeadContextProps>(null!);
+
+export const HeadContextProvider = ({ children }) => {
+  const [title, setTitle] = useState("Character App");
+
+  const setNewTitle = (title) => {
+    setTitle(`${title} - D&D Beyond`);
+  };
+
+  return (
+    <HeadContext.Provider value={{ title, setTitle: setNewTitle }}>
+      <Helmet>
+        <title>{title}</title>
+      </Helmet>
+      {children}
+    </HeadContext.Provider>
+  );
+};
+
+export const useHeadContext = () => {
+  const context = useContext(HeadContext);
+
+  if (!context) {
+    throw new Error("useHead must be used within a HeadProvider");
+  }
+
+  return context;
+};
diff --git a/ddb_main/contexts/Sidebar/Sidebar.tsx b/ddb_main/contexts/Sidebar/Sidebar.tsx
new file mode 100644
index 0000000..779fc49
--- /dev/null
+++ b/ddb_main/contexts/Sidebar/Sidebar.tsx
@@ -0,0 +1,174 @@
+import { isEqual } from "lodash";
+import { createContext, FC, useContext, useEffect, useState } from "react";
+import { useSelector } from "react-redux";
+
+import {
+  PaneComponentEnum,
+  PaneComponentInfo,
+  PaneIdentifiers,
+  SidebarAlignmentEnum,
+  SidebarPlacementEnum,
+} from "~/subApps/sheet/components/Sidebar/types";
+import { SIDEBAR_FIXED_POSITION_START_WIDTH } from "~/tools/js/CharacterSheet/config";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+
+export interface SidebarInfo {
+  isVisible: boolean;
+  setIsVisible: (isVisible: boolean) => void;
+  isLocked: boolean;
+  setIsLocked: (isLocked: boolean) => void;
+  placement: SidebarPlacementEnum;
+  setPlacement: (placement: SidebarPlacementEnum) => void;
+  alignment: SidebarAlignmentEnum;
+  setAlignment: (alignment: SidebarAlignmentEnum) => void;
+  width: number;
+}
+
+export interface PaneInfo {
+  activePane: PaneComponentInfo | null;
+  showControls: boolean;
+  isAtStart: boolean;
+  isAtEnd: boolean;
+  paneHistoryStart: (
+    componentType: PaneComponentEnum,
+    componentIdentifiers?: PaneIdentifiers | null
+  ) => void;
+  paneHistoryPush: (
+    componentType: PaneComponentEnum,
+    componentIdentifiers?: PaneIdentifiers | null
+  ) => void;
+  paneHistoryPrevious: () => void;
+  paneHistoryNext: () => void;
+}
+
+export interface SidebarContextType {
+  sidebar: SidebarInfo;
+  pane: PaneInfo;
+}
+
+export const SidebarContext = createContext<SidebarContextType>(null!);
+
+export const SidebarProvider: FC = ({ children }) => {
+  const isMobile = useSelector(appEnvSelectors.getIsMobile);
+  const sheetDimensions = useSelector(appEnvSelectors.getDimensions);
+
+  const [isVisible, setIsVisible] = useState(false);
+  const [isLocked, setIsLocked] = useState(false);
+  const [placement, setPlacement] = useState(SidebarPlacementEnum.OVERLAY);
+  const [alignment, setAlignment] = useState(SidebarAlignmentEnum.RIGHT);
+
+  const [paneIdx, setPaneIdx] = useState<number>(0);
+  const [paneHistory, setPaneHistory] = useState<Array<PaneComponentInfo>>([]);
+
+  const [activePane, setActivePane] = useState<PaneComponentInfo | null>(null);
+
+  const width: number = 340;
+
+  //Create a new pane history
+  const paneHistoryStart = (
+    type: PaneComponentEnum,
+    identifiers: PaneIdentifiers | null = null
+  ) => {
+    setIsVisible(true);
+    setPaneIdx(0);
+    setPaneHistory([
+      {
+        type,
+        identifiers,
+      },
+    ]);
+  };
+
+  //Add a new pane to the history
+  const paneHistoryPush = (
+    type: PaneComponentEnum,
+    identifiers: PaneIdentifiers | null = null
+  ) => {
+    if (paneIdx === null) {
+      paneHistoryStart(type, identifiers);
+    } else {
+      // get current active pane (last in history)
+      const activeHistoryElement = {
+        identifiers: activePane?.identifiers,
+        type: activePane?.type,
+      };
+
+      // create a new node for the history
+      const newHistoryElement = { identifiers, type };
+
+      // compare the current active pane with the new one (last element in history with new one)
+      if (!isEqual(activeHistoryElement, newHistoryElement)) {
+        // Check if new history element is different than current - otherwise skip to avoid duplicates
+        let newHistory = [
+          ...paneHistory.slice(0, paneIdx + 1),
+          newHistoryElement,
+        ];
+        setPaneHistory(newHistory);
+        setPaneIdx(newHistory.length - 1);
+      }
+    }
+    setIsVisible(true);
+  };
+
+  //Go back to the previous pane in the history
+  const paneHistoryPrevious = () => {
+    setPaneIdx(Math.max(0, paneIdx - 1));
+  };
+
+  //Go to the next pane in the history
+  const paneHistoryNext = () => {
+    setPaneIdx(Math.min(paneHistory.length - 1, paneIdx + 1));
+  };
+
+  useEffect(() => {
+    //If the window less than the fixed position start width (1600px), set the placement to overlay
+    if (
+      isMobile ||
+      sheetDimensions.window.width < SIDEBAR_FIXED_POSITION_START_WIDTH
+    ) {
+      setPlacement(SidebarPlacementEnum.OVERLAY);
+    }
+
+    //set Right alignment if mobile
+    setAlignment(isMobile ? SidebarAlignmentEnum.RIGHT : alignment);
+  }, [isMobile, sheetDimensions]);
+
+  useEffect(() => {
+    const activePane = paneHistory[paneIdx];
+    setActivePane(activePane);
+  }, [paneIdx, paneHistory]);
+
+  return (
+    <SidebarContext.Provider
+      value={{
+        sidebar: {
+          isVisible,
+          setIsVisible,
+          isLocked,
+          setIsLocked,
+          placement,
+          setPlacement,
+          alignment,
+          setAlignment,
+          width,
+        },
+        pane: {
+          activePane,
+          showControls: paneHistory.length > 1,
+          isAtStart: paneIdx === 0,
+          isAtEnd: paneIdx === paneHistory.length - 1,
+          paneHistoryStart,
+          paneHistoryPush,
+          paneHistoryPrevious,
+          paneHistoryNext,
+        },
+      }}
+    >
+      {children}
+    </SidebarContext.Provider>
+  );
+};
+
+export const useSidebar = () => {
+  return useContext(SidebarContext);
+};
diff --git a/ddb_main/contexts/ThemeManager/ThemeManager.tsx b/ddb_main/contexts/ThemeManager/ThemeManager.tsx
new file mode 100644
index 0000000..8a6330d
--- /dev/null
+++ b/ddb_main/contexts/ThemeManager/ThemeManager.tsx
@@ -0,0 +1,88 @@
+import createCache from "@emotion/cache";
+import { CacheProvider } from "@emotion/react";
+import { ThemeProvider } from "@mui/material/styles";
+import { useState, createContext, useEffect, useMemo } from "react";
+import { prefixer } from "stylis";
+
+import { getTheme } from "~/theme";
+
+type PaletteOpt = "light" | "dark";
+
+interface Manager {
+  lightOrDark: PaletteOpt;
+  primary?: string;
+}
+
+interface ThemeManagerContext {
+  manager: Manager;
+  setManager: (manager: Manager) => void;
+}
+
+export const ThemeManager = createContext<ThemeManagerContext>(null!);
+export const ThemeManagerProvider = ({
+  children,
+  manager: propsManager,
+}: {
+  children: React.ReactNode;
+  manager?: Manager;
+}) => {
+  const [manager, setManager] = useState<Manager>(
+    propsManager || {
+      lightOrDark: "light",
+    }
+  );
+  useEffect(() => {
+    if (propsManager) {
+      setManager(propsManager);
+    }
+  }, [propsManager]);
+  // HACK
+  /**
+   * We are doing some hacky things to
+   * win is styling conflicts this can
+   * go away once we no longer need
+   * waterdeep styles
+   */
+  function hack__createExtraScopePlugin(...extra) {
+    const scopes = extra.map((scope) => `${scope.trim()} `);
+    return (element) => {
+      if (element.type !== "rule") {
+        return;
+      }
+
+      if (element.root?.type === "@keyframes") {
+        return;
+      }
+
+      element.props = element.props
+        .map((prop) => scopes.map((scope) => scope + prop))
+        .reduce((scopesArray, scope) => scopesArray.concat(scope), []);
+    };
+  }
+
+  const hack__cache = useMemo(
+    () =>
+      createCache({
+        key: "ddb-character-app",
+        container: document.body,
+        prepend: true,
+        stylisPlugins: [
+          hack__createExtraScopePlugin("body"),
+          // has to be included manually when customizing `stylisPlugins` if you want to have vendor prefixes added automatically
+          prefixer,
+        ],
+      }),
+    []
+  );
+  /**
+   * End the hack
+   */
+  const theme = getTheme(manager.lightOrDark, manager.primary);
+  return (
+    <ThemeManager.Provider value={{ manager, setManager }}>
+      <CacheProvider value={hack__cache}>
+        <ThemeProvider theme={theme}>{children}</ThemeProvider>
+      </CacheProvider>
+    </ThemeManager.Provider>
+  );
+};
diff --git a/ddb_main/handlers/commonHandlers.ts b/ddb_main/handlers/commonHandlers.ts
new file mode 100644
index 0000000..3215be2
--- /dev/null
+++ b/ddb_main/handlers/commonHandlers.ts
@@ -0,0 +1,50 @@
+import { Dispatch } from "react";
+
+import {
+  Action,
+  ActionUtils,
+  characterActions,
+  Spell,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+export const handleActionUseSet = (
+  action: Action,
+  uses: number,
+  dispatch: Dispatch<any>
+): void => {
+  const id = ActionUtils.getId(action);
+  const entityTypeId = ActionUtils.getEntityTypeId(action);
+  const dataOriginType = ActionUtils.getDataOriginType(action);
+
+  if (id !== null && entityTypeId !== null) {
+    dispatch(
+      characterActions.actionUseSet(id, entityTypeId, uses, dataOriginType)
+    );
+  }
+};
+
+export const handleSpellUseSet = (
+  spell: Spell,
+  uses: number,
+  dispatch: Dispatch<any>
+): void => {
+  const mappingId = SpellUtils.getMappingId(spell);
+  const mappingEntityTypeId = SpellUtils.getMappingEntityTypeId(spell);
+  const dataOriginType = SpellUtils.getDataOriginType(spell);
+
+  if (
+    mappingId !== null &&
+    mappingEntityTypeId !== null &&
+    dataOriginType !== null
+  ) {
+    dispatch(
+      characterActions.spellUseSet(
+        mappingId,
+        mappingEntityTypeId,
+        uses,
+        dataOriginType
+      )
+    );
+  }
+};
diff --git a/ddb_main/helpers/analytics/analytics.ts b/ddb_main/helpers/analytics/analytics.ts
new file mode 100644
index 0000000..5529d4b
--- /dev/null
+++ b/ddb_main/helpers/analytics/analytics.ts
@@ -0,0 +1,343 @@
+// GA Docs for using multiple accounts on the same page
+// https://developers.google.com/analytics/devguides/collection/analyticsjs/creating-trackers#working_with_multiple_trackers
+import debounce from "debounce";
+
+import config from "../../config";
+import {
+  SessionTrackingIdByName,
+  SessionNames,
+  EventCategories,
+  EventActions,
+  EventLabels,
+} from "../../constants";
+import {
+  getSearchableTerms,
+  getSearchableTermsAnalyticsLabel,
+} from "../../state/selectors/characterUtils";
+import { CharacterData, LogEventOptions } from "../../types";
+
+let { debug } = config;
+
+const tryGa = (...params) => {
+  if (typeof window.ga === "function") {
+    window.ga(...params);
+
+    return true;
+  }
+
+  return false;
+};
+
+// eslint-disable-next-line max-params
+const logGa = (sessionName: string, eventName: string, ...rest: any) =>
+  tryGa(`${sessionName}.send`, eventName, ...rest);
+
+export const logEvent = (
+  sessionName: string,
+  { category, action, label, value }: LogEventOptions
+) => {
+  const success = logGa(sessionName, "event", category, action, label, value);
+
+  if (success && debug) {
+    // eslint-disable-next-line no-console
+    console.log(
+      "Logged analytics event:",
+      "\nsession:",
+      sessionName,
+      "\ncategory:",
+      category,
+      "\naction:",
+      action,
+      "\nlabel:",
+      label,
+      "\nvalue:",
+      value
+    );
+  }
+};
+
+// eslint-disable-next-line max-params
+export const logPageView = (sessionName, pageName, ...rest) => {
+  tryGa(`${sessionName}.set`, "page", pageName, ...rest);
+  const success = tryGa(`${sessionName}.send`, "pageview");
+
+  if (success && debug) {
+    // eslint-disable-next-line no-console
+    console.log(
+      "Logged page view:",
+      "\nsession:",
+      sessionName,
+      "\npage:",
+      pageName,
+      "\nrest:",
+      ...rest
+    );
+  }
+};
+
+export const initAnalytics = (sessionName: string, forceDebug?: boolean) => {
+  /* eslint-disable @typescript-eslint/no-unused-expressions, no-sequences */
+  (function (
+    i: Window,
+    s: Document,
+    o: string,
+    g: string,
+    r: string,
+    a?: HTMLScriptElement,
+    m?: Element
+  ) {
+    i["GoogleAnalyticsObject"] = r;
+    (i[r] =
+      i[r] ||
+      function () {
+        (i[r].q = i[r].q || []).push(arguments);
+      }),
+      (i[r].l = 1 * (new Date() as any));
+    (a = s.createElement(o) as HTMLScriptElement),
+      (m = s.getElementsByTagName(o)[0]);
+    a.async = true;
+    a.src = g;
+    m.parentNode?.insertBefore(a, m);
+  })(
+    window,
+    document,
+    "script",
+    "https://www.google-analytics.com/analytics.js",
+    "ga"
+  );
+  /* eslint-enable */
+
+  tryGa("create", SessionTrackingIdByName[sessionName], "auto", sessionName);
+
+  if (forceDebug) {
+    debug = forceDebug;
+  }
+};
+
+/**
+ * Converts an array to a string that can be used for an event label
+ * @param {array} array The array to convert
+ * @param {object} valueToLabelMap An optional value to label mapping object
+ * @returns {string} A string representation of the array
+ */
+export const arrayToLabel = (array, valueToLabelMap = {}) =>
+  array
+    .sort()
+    .map((value) => valueToLabelMap[value] || value)
+    .join(", ");
+
+/**
+ * Reduces an array of filter options ({ label, value }) to a lookup object of value to label
+ * @param {array} filterOptions The list of options to reduce
+ * @returns {object} A lookup object with filter values as the keys and filter labels as the values
+ */
+export const filterOptionsToLookup = (filterOptions = []) =>
+  filterOptions.reduce((lookup, { label, value }) => {
+    lookup[value] = label;
+
+    return lookup;
+  }, {});
+
+export const logCharacterCampaignClicked = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_Campaign,
+    label: EventLabels.Clicked,
+  });
+};
+
+export const logCharacterCopyCancelled = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_Copy,
+    label: EventLabels.Cancelled,
+  });
+};
+
+export const logCharacterCopyClicked = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_Copy,
+    label: EventLabels.Clicked,
+  });
+};
+
+export const logCharacterCopyConfirmed = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_Copy,
+    label: EventLabels.Confirmed,
+  });
+};
+
+export const logCharacterDeleteCancelled = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_Delete,
+    label: EventLabels.Cancelled,
+  });
+};
+
+export const logCharacterDeleteClicked = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_Delete,
+    label: EventLabels.Clicked,
+  });
+};
+
+export const logCharacterDeleteConfirmed = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_Delete,
+    label: EventLabels.Confirmed,
+  });
+};
+
+export const logCharacterEditClicked = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_Edit,
+    label: EventLabels.Clicked,
+  });
+};
+
+export const logCharacterLeaveCampaignCancelled = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_LeaveCampaign,
+    label: EventLabels.Cancelled,
+  });
+};
+
+export const logCharacterLeaveCampaignClicked = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_LeaveCampaign,
+    label: EventLabels.Clicked,
+  });
+};
+
+export const logCharacterLeaveCampaignConfirmed = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_LeaveCampaign,
+    label: EventLabels.Confirmed,
+  });
+};
+
+export const logCharacterViewClicked = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Character,
+    action: EventActions.DDB_Character_View,
+    label: EventLabels.Clicked,
+  });
+};
+
+export const logListingSearchChanged = debounce(
+  (characters: Array<CharacterData>, matchesSearch: () => any) => {
+    const matchedLabels = characters
+      .map(
+        (character) =>
+          getSearchableTermsAnalyticsLabel(character)[
+            getSearchableTerms(character).findIndex(matchesSearch)
+          ]
+      )
+      .filter(Boolean)
+      .filter(
+        (character, index, characters) =>
+          characters.indexOf(character) === index
+      );
+
+    logEvent(SessionNames.DDB, {
+      category: EventCategories.DDB_ListingFilter,
+      action: EventActions.DDB_ListingFilter_SearchChanged,
+      label: arrayToLabel(matchedLabels) || "no match",
+    });
+  },
+  500
+);
+
+export const logListingSearchCleared = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_ListingFilter,
+    action: EventActions.DDB_ListingFilter_SearchCleared,
+  });
+};
+
+export const logListingSortChanged = (label) => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_ListingSort,
+    action: EventActions.DDB_ListingSort_Changed,
+    label,
+  });
+};
+
+export const logPlayerAppBannerDismissed = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_PlayerAppBanner,
+    action: EventActions.DDB_PlayerAppBanner_Dismissed,
+  });
+};
+
+export const logPlayerAppBannerClickedCta = (label) => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_PlayerAppBanner,
+    action: EventActions.DDB_PlayerAppBanner_ClickedCta,
+    label,
+  });
+};
+
+export const logUnlockCharacterLocked = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Unlock,
+    action: EventActions.DDB_Unlock_CharacterLocked,
+  });
+};
+
+export const logUnlockCharacterUnlocked = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Unlock,
+    action: EventActions.DDB_Unlock_CharacterUnlocked,
+  });
+};
+
+export const logUnlockFinishUnlockingClicked = (
+  unlockedCharacterCount,
+  maxSlots
+) => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Unlock,
+    action: EventActions.DDB_Unlock_FinishUnlockingClicked,
+    label: `Unlocked Characters: ${unlockedCharacterCount} / ${maxSlots}`,
+  });
+};
+
+export const logUnlockFinishUnlockingCancelled = (
+  unlockedCharacterCount,
+  maxSlots
+) => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Unlock,
+    action: EventActions.DDB_Unlock_FinishUnlockingCancelled,
+    label: `Unlocked Characters: ${unlockedCharacterCount} / ${maxSlots}`,
+  });
+};
+
+export const logUnlockFinishUnlockingConfirmed = (
+  unlockedCharacterCount,
+  maxSlots
+) => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Unlock,
+    action: EventActions.DDB_Unlock_FinishUnlockingConfirmed,
+    label: `Unlocked Characters: ${unlockedCharacterCount} / ${maxSlots}`,
+  });
+};
+
+export const logUnlockSubscribeClicked = () => {
+  logEvent(SessionNames.DDB, {
+    category: EventCategories.DDB_Unlock,
+    action: EventActions.DDB_Unlock_SubscribeClicked,
+  });
+};
diff --git a/ddb_main/helpers/casing/casing.ts b/ddb_main/helpers/casing/casing.ts
new file mode 100644
index 0000000..27de4b8
--- /dev/null
+++ b/ddb_main/helpers/casing/casing.ts
@@ -0,0 +1,11 @@
+export const toCamelCase = (str: string) =>
+  str
+    .replace(/(?:^\w|[A-Z]|\b\w)/g, function (word, index) {
+      return index === 0 ? word.toLowerCase() : word.toUpperCase();
+    })
+    .replace(/\W/g, "");
+
+export const toPascalCase = (str: string) =>
+  str
+    .replace(/(?:^\w|[A-Z]|\b\w)/g, (word) => word.toUpperCase())
+    .replace(/\W/g, "");
diff --git a/ddb_main/helpers/characterServiceApi.ts b/ddb_main/helpers/characterServiceApi.ts
new file mode 100644
index 0000000..cb18ba1
--- /dev/null
+++ b/ddb_main/helpers/characterServiceApi.ts
@@ -0,0 +1,189 @@
+import { CharacterData, UserPreferences } from "~/types";
+
+import config, {
+  characterServiceBaseUrl,
+  ddbBaseUrl,
+  userServiceBaseUrl,
+} from "../config";
+import { getId, getCampaignId } from "../state/selectors/characterUtils";
+import { applyQueriesClientSide, queryListToMap } from "./queryUtils";
+import { summon } from "./summon";
+import { getUserId } from "./userApi";
+
+export const getCharacters = async () => {
+  try {
+    const userId = await getUserId();
+    const req = await summon(
+      `${characterServiceBaseUrl}/characters/list?userId=${userId}`
+    );
+    return req.json();
+  } catch {
+    throw new Error("Non-OK response from GET characters");
+  }
+};
+
+export const getItems = async ({ queries }) => {
+  const characters = await getCharacters();
+  applyQueriesClientSide(queryListToMap(queries));
+
+  return new Promise((resolve) =>
+    resolve({
+      json: () => new Promise((resolve2) => resolve2(characters)),
+    })
+  );
+};
+
+export const copyCharacter = (character: CharacterData) => {
+  try {
+    const characterId = getId(character);
+
+    return summon(`${characterServiceBaseUrl}/character/copy`, {
+      method: "POST",
+      body: JSON.stringify({ characterId }),
+    });
+  } catch (err) {
+    throw err;
+  }
+};
+
+export const claimCharacter = (characterId: number, isAssigned: boolean) => {
+  try {
+    return summon(`${characterServiceBaseUrl}/premade/claim`, {
+      method: "POST",
+      body: JSON.stringify({ characterId, isAssigned }),
+    });
+  } catch (err) {
+    throw err;
+  }
+};
+
+export const getCharacterSlots = async () => {
+  try {
+    const req = await summon(`${config.userServiceBaseUrl}/slot-limit`);
+    const res = await req.json();
+    return res.data;
+  } catch (err) {
+    throw err;
+  }
+};
+
+export const deleteCharacter = (character: CharacterData) => {
+  try {
+    const characterId = getId(character);
+
+    return summon(`${characterServiceBaseUrl}/character`, {
+      method: "DELETE",
+      body: JSON.stringify({ characterId }),
+    });
+  } catch (err) {
+    throw err;
+  }
+};
+
+export const leaveCampaign = (character: CharacterData) => {
+  try {
+    const campaignId = getCampaignId(character);
+    const characterId = getId(character);
+
+    return summon(
+      `${ddbBaseUrl}/api/campaign/${campaignId}/character/${characterId}`,
+      {
+        method: "DELETE",
+      }
+    );
+  } catch (err) {
+    throw err;
+  }
+};
+
+export const joinCampaign = (campaignJoinCode: string, characterId: number) => {
+  try {
+    return summon(`${ddbBaseUrl}/api/campaign/join/${campaignJoinCode}`, {
+      method: "POST",
+      body: JSON.stringify({ characterId }),
+    });
+  } catch (err) {
+    throw err;
+  }
+};
+
+export const unlockCharacters = (characterIds: Array<number>) => {
+  try {
+    return summon(`${userServiceBaseUrl}/unlock`, {
+      method: "POST",
+      body: JSON.stringify({ characterIds }),
+    });
+  } catch (err) {
+    throw err;
+  }
+};
+
+export const activateCharacter = (character: CharacterData) => {
+  try {
+    const characterId = getId(character);
+
+    return summon(
+      `${characterServiceBaseUrl}/characters/${characterId}/status/activate`,
+      {
+        method: "PUT",
+      }
+    );
+  } catch (err) {
+    throw err;
+  }
+};
+
+export const getFeatureFlagsFromCharacterService = (flags: Array<string>) => {
+  try {
+    return summon(`${characterServiceBaseUrl}/featureflag`, {
+      method: "POST",
+      body: JSON.stringify({ flags }),
+    });
+  } catch (err) {
+    throw err;
+  }
+};
+
+/**
+ * Get all sources that the user is able to use.
+ */
+export const getAllEntitledSources = (campaignId?: number) => {
+  try {
+    return summon(
+      `${userServiceBaseUrl}/entitled-sources${
+        campaignId ? `?campaignId=${campaignId}` : ""
+      }`
+    );
+  } catch (err) {
+    throw err;
+  }
+};
+
+export const getUserPreferences = () => {
+  try {
+    return summon(`${config.userServiceBaseUrl}/preferences`);
+  } catch (err) {
+    throw err;
+  }
+};
+
+export const updateUserPreferences = (preferences: UserPreferences) => {
+  try {
+    return summon(`${config.userServiceBaseUrl}/preferences`, {
+      method: "POST",
+      body: JSON.stringify(preferences),
+    });
+  } catch (err) {
+    throw err;
+  }
+};
+
+export const getRulesData = () => {
+  try {
+    return summon(`${characterServiceBaseUrl}/rule-data`, {
+      method: "GET",
+    });
+  } catch (err) {
+    throw err;
+  }
+};
diff --git a/ddb_main/helpers/generateCharacterPreferences.ts b/ddb_main/helpers/generateCharacterPreferences.ts
new file mode 100644
index 0000000..3d95227
--- /dev/null
+++ b/ddb_main/helpers/generateCharacterPreferences.ts
@@ -0,0 +1,52 @@
+import {
+  MovementTypeEnum,
+  PreferenceAbilityScoreDisplayTypeEnum as AbilityScoreDisplayType,
+  PreferenceEncumbranceTypeEnum,
+  PreferenceHitPointTypeEnum,
+  PreferencePrivacyTypeEnum,
+  PreferenceProgressionTypeEnum,
+  PreferenceSharingTypeEnum,
+  SenseTypeEnum,
+} from "~/constants";
+import { FeatureFlags } from "~/contexts/FeatureFlag";
+
+/**
+ * This is a copy of the `generateCharacterPreferences` function from the rules
+ * engine package. This is necessary because we have restructured the
+ * featureFlagContext, so the `featureFlagInfo` variable is no longer
+ * available.
+ **/
+export const generateCharacterPreferences = (featureFlags: FeatureFlags) => {
+  // Default values
+  const abilityScoreDisplayType = AbilityScoreDisplayType.MODIFIERS_TOP;
+  const encumbranceType = PreferenceEncumbranceTypeEnum.ENCUMBRANCE;
+  const hitPointType = PreferenceHitPointTypeEnum.FIXED;
+  const primaryMovement = MovementTypeEnum.WALK;
+  const primarySense = SenseTypeEnum.PASSIVE_PERCEPTION;
+  const progressionType = PreferenceProgressionTypeEnum.MILESTONE;
+  const sharingType = PreferenceSharingTypeEnum.LIMITED;
+  const privacyType = PreferencePrivacyTypeEnum.CAMPAIGN_ONLY;
+
+  return {
+    abilityScoreDisplayType,
+    enableContainerCurrency: false,
+    enableDarkMode: false,
+    enableOptionalClassFeatures: false,
+    enableOptionalOrigins: false,
+    encumbranceType,
+    enforceFeatRules: true,
+    enforceMulticlassRules: true,
+    hitPointType,
+    ignoreCoinWeight: true,
+    primaryMovement,
+    primarySense,
+    privacyType,
+    progressionType,
+    sharingType,
+    showCompanions: false,
+    showScaledSpells: true,
+    showUnarmedStrike: true,
+    showWildShape: false,
+    useHomebrewContent: true,
+  };
+};
diff --git a/ddb_main/helpers/localStorageUtils.ts b/ddb_main/helpers/localStorageUtils.ts
new file mode 100644
index 0000000..ae5d933
--- /dev/null
+++ b/ddb_main/helpers/localStorageUtils.ts
@@ -0,0 +1,33 @@
+export const tryGet = (key: string) => {
+  try {
+    return window.localStorage.getItem(key);
+  } catch (exception) {
+    // If 3rd party cookies are turned off even though window.localStorage
+    // is accessible or local storage is full this will error
+    // https://github.com/Modernizr/Modernizr/blob/master/feature-detects/storage/localstorage.js
+    return null;
+  }
+};
+
+export const trySet = (key: string, value: string) => {
+  try {
+    window.localStorage.setItem(key, value);
+
+    return true;
+  } catch (exception) {
+    // Safari can throw an exception when calling localStorage.setItem in a private browsing tab.
+    // https://developer.mozilla.org/en-US/docs/Web/API/Storage/setItem#Exceptions
+    return false;
+  }
+};
+
+export const tryRemove = (key: string) => {
+  try {
+    window.localStorage.removeItem(key);
+
+    return true;
+  } catch (exception) {
+    // Get and trySet can throw exceptions, so this probably can too...
+    return false;
+  }
+};
diff --git a/ddb_main/helpers/reportWebVitals.ts b/ddb_main/helpers/reportWebVitals.ts
new file mode 100644
index 0000000..6d57ab4
--- /dev/null
+++ b/ddb_main/helpers/reportWebVitals.ts
@@ -0,0 +1,13 @@
+import { ReportHandler } from "web-vitals";
+
+export const reportWebVitals = (onPerfEntry?: ReportHandler) => {
+  if (onPerfEntry && onPerfEntry instanceof Function) {
+    import("web-vitals").then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
+      getCLS(onPerfEntry);
+      getFID(onPerfEntry);
+      getFCP(onPerfEntry);
+      getLCP(onPerfEntry);
+      getTTFB(onPerfEntry);
+    });
+  }
+};
diff --git a/ddb_main/helpers/sortUtils.ts b/ddb_main/helpers/sortUtils.ts
new file mode 100644
index 0000000..f7936c4
--- /dev/null
+++ b/ddb_main/helpers/sortUtils.ts
@@ -0,0 +1,141 @@
+import { SortOrderEnum, SortTypeEnum, CharacterData } from "../types";
+
+// Creates a sorting predicate to sort for some property
+export const byProp =
+  (propSelector: Function) =>
+  (a: CharacterData, b: CharacterData): number => {
+    // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort
+    const aProp = propSelector(a);
+    const bProp = propSelector(b);
+
+    if (aProp < bProp) {
+      return -1;
+    }
+
+    if (aProp > bProp) {
+      return 1;
+    }
+
+    return 0;
+  };
+
+// Creates a value to be used for sorting
+export const createSortValue = (
+  sortBy: SortTypeEnum,
+  sortOrder: SortOrderEnum
+): string => {
+  return `${sortBy}-${sortOrder}`;
+};
+
+/**
+ * Sorts an array of objects by a given key. If a drilled-down key is needed,
+ * simply provide the path to the key as a string (ex. "key.subkey") and the
+ * function will handle the rest.
+ **/
+export const orderBy = (
+  arr: Array<any>,
+  key?: string,
+  sort: "asc" | "desc" = "asc"
+) => {
+  const getKey = (obj: any) => {
+    if (key) {
+      if (key.includes(".")) {
+        const arr = key.split(".");
+        return arr.reduce((acc, curr) => {
+          return acc[curr];
+        }, obj);
+      } else {
+        return obj[key];
+      }
+    } else {
+      return;
+    }
+  };
+
+  const handleSort = (valA: object, valB: object) => {
+    // If a key is provided, sort by that
+    if (key) {
+      // Get values to compare
+      const a = getKey(valA);
+      const b = getKey(valB);
+      // If the values are strings, compare them alphabetically
+      if (a < b) return sort === "asc" ? -1 : 1;
+      if (b < a) return sort === "asc" ? 1 : -1;
+    }
+    // Otherwise, sort by the object itself
+    return 0;
+  };
+  // Return a new array with the sorted values
+  return arr.concat().sort(handleSort);
+};
+
+/**
+ * Separates a single array of objects into two separate arrays based on
+ * whether or not they include a query or not. If a key is provided, the
+ * function will look for the query by that key. If the key is nested, it will
+ * handle that as well. The function will return both the items which match and
+ * the ones that don't as separate arrays to be used as needed.
+ **/
+export const sortByMatch = (
+  arr: Array<any>,
+  query: string,
+  key: string = "name",
+  exact: boolean = false
+) => {
+  // If a key is provided, drill down until that key is found
+  const getKey = (obj: any) => {
+    if (key) {
+      if (key.includes(".")) {
+        const arr = key.split(".");
+        return arr.reduce((acc, curr) => {
+          return acc[curr];
+        }, obj);
+      } else {
+        return obj[key];
+      }
+    } else {
+      return;
+    }
+  };
+
+  // Create empty arrays to store the objects
+  let arrA: Array<any> = [];
+  let arrB: Array<any> = [];
+
+  // Loop through the provided array and separate the objects
+  arr.forEach((item) => {
+    if (exact) {
+      if (getKey(item) === query) {
+        arrA.push(item);
+      } else {
+        arrB.push(item);
+      }
+    } else {
+      if (getKey(item).includes(query)) {
+        arrA.push(item);
+      } else {
+        arrB.push(item);
+      }
+    }
+  });
+
+  // Return a new array with the sorted values
+  return [arrA, arrB];
+};
+
+export const sortObjectByKeys = (val: object, dir: "asc" | "desc" = "asc") => {
+  const sortFn = (a, b) => {
+    const numA = parseInt(a);
+    const numB = parseInt(b);
+    return dir === "asc" ? numA - numB : numB - numA;
+  };
+
+  const sorted = Object.keys(val)
+    .sort(sortFn)
+    .reduce((obj, key) => {
+      obj[key] = val[key];
+      return obj;
+    }, {});
+
+  return sorted;
+};
diff --git a/ddb_main/helpers/summon.ts b/ddb_main/helpers/summon.ts
new file mode 100644
index 0000000..cbb3ff3
--- /dev/null
+++ b/ddb_main/helpers/summon.ts
@@ -0,0 +1,39 @@
+import AuthUtils from "@dndbeyond/authentication-lib-js";
+
+import { getStt } from "./tokenUtils";
+
+export const getAuthHeaders = AuthUtils.makeGetAuthorizationHeaders({
+  madeGetShortTermToken: getStt,
+});
+
+/**
+ * A wrapper around fetch that adds the Authorization header and anything else
+ * that may need to be included in every request. If withCookies is true, the
+ * request will add the credentials: "include" option. Otherwise, this function
+ * should work exactly like the native fetch function.
+ *
+ * See https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
+ */
+export const summon = async (
+  input: RequestInfo | URL,
+  init?: RequestInit,
+  withCookies?: boolean
+) => {
+  // Get the Authorization headers from the auth token
+  const authHeaders = await getAuthHeaders();
+  // If withCookies is true, set the credentials to include
+  const credentials = withCookies && { credentials: "include" };
+  // If there is a body, set the Content-Type to application/json
+  const contentType = init?.body && { "Content-Type": "application/json" };
+
+  return window.fetch(input, {
+    ...(credentials as { credentials: RequestCredentials } | undefined),
+    ...init,
+    headers: {
+      ...authHeaders,
+      ...init?.headers,
+      ...contentType,
+      Accept: "application/json",
+    },
+  });
+};
diff --git a/ddb_main/helpers/tokenUtils.ts b/ddb_main/helpers/tokenUtils.ts
new file mode 100644
index 0000000..ad2c20b
--- /dev/null
+++ b/ddb_main/helpers/tokenUtils.ts
@@ -0,0 +1,15 @@
+import jwtDecode from "jwt-decode";
+
+import { AuthUtils } from "@dndbeyond/authentication-lib-js";
+
+import { authEndpoint as authUrl } from "../config";
+
+export const getStt = AuthUtils.makeGetShortTermToken({
+  authUrl,
+  throwOnHttpStatusError: false,
+});
+
+export const getDecodedStt = async () => {
+  const stt = await getStt();
+  return stt ? jwtDecode(stt) : null;
+};
diff --git a/ddb_main/helpers/userApi.ts b/ddb_main/helpers/userApi.ts
new file mode 100644
index 0000000..2027f31
--- /dev/null
+++ b/ddb_main/helpers/userApi.ts
@@ -0,0 +1,36 @@
+import { UserUtils } from "@dndbeyond/authentication-lib-js";
+
+import { getDecodedStt } from "./tokenUtils";
+
+export const getUserToken = async () => {
+  const stt = await getDecodedStt();
+  return stt;
+};
+
+export const getUser = async () => {
+  const token = await getUserToken();
+  return {
+    ...UserUtils.jwtToUser(token),
+    displayName: token.displayName,
+  };
+};
+
+export const getUserDisplayName = async () => {
+  const user = await getUser();
+  return user.displayName;
+};
+
+export const getUserId = async () => {
+  const user = await getUser();
+  return user.id;
+};
+
+export const getSubscriptionTier = async () => {
+  const user = await getUser();
+  return user.subscriptionTier;
+};
+
+export const getRoles = async () => {
+  const user = await getUser();
+  return user.roles;
+};
diff --git a/ddb_main/helpers/validation.ts b/ddb_main/helpers/validation.ts
new file mode 100644
index 0000000..1d3d660
--- /dev/null
+++ b/ddb_main/helpers/validation.ts
@@ -0,0 +1,11 @@
+/**
+ * https://github.com/Microsoft/TypeScript/issues/16069#issuecomment-369374214
+ * Used to get around array filter function that errors because it doesn't recognize the filter
+ * is removing nulls
+ * @param input
+ */
+export const isNotNullOrUndefined = <T extends Object>(
+  input: null | undefined | T
+): input is T => {
+  return input !== null;
+};
diff --git a/ddb_main/hooks/useAbilities.ts b/ddb_main/hooks/useAbilities.ts
new file mode 100644
index 0000000..20c561c
--- /dev/null
+++ b/ddb_main/hooks/useAbilities.ts
@@ -0,0 +1,25 @@
+import { useContext, useEffect, useState } from "react";
+
+import {
+  AbilityManager,
+  FeaturesManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { AttributesManagerContext } from "~/tools/js/Shared/managers/AttributesManagerContext";
+
+export function useAbilities() {
+  const { attributesManager } = useContext(AttributesManagerContext);
+
+  const [abilities, setAbilities] = useState<Array<AbilityManager>>([]);
+
+  useEffect(() => {
+    async function onUpdate() {
+      const abilities = await attributesManager.getAbilities();
+
+      setAbilities(abilities);
+    }
+    return FeaturesManager.subscribeToUpdates({ onUpdate });
+  }, [attributesManager, setAbilities]);
+
+  return abilities;
+}
diff --git a/ddb_main/hooks/useApiCall.ts b/ddb_main/hooks/useApiCall.ts
new file mode 100644
index 0000000..fbe6aae
--- /dev/null
+++ b/ddb_main/hooks/useApiCall.ts
@@ -0,0 +1,48 @@
+import { useCallback, useState } from "react";
+
+const identity = (x) => x;
+
+/**
+ * Hook that encapsulates loading/error state setting when calling an API promise
+ * Usage:
+ * const [
+ *   doThing, // callback to invoke to initiate the API call
+ *   isDoingThing, // boolean indicating if the API call is in progress
+ *   errorDoingThing, // error object indicating if there was an error caught (whatever param is passed to the .catch() callback)
+ * ] = useApiCall(MyApiUtils.doThing);
+ * @param {function} apiFunc The API function to use for setting loading/error state - Must return a promise!
+ * @param {function} [onSuccess] Optional callback invoked if the apiFunc promise succeeds
+ * @returns {[function, boolean, any]} An array containing a callback to initiate the API call, a isLoading boolean, and an error object
+ */
+const useApiCall = (apiFunc, onSuccess = identity) => {
+  const [isLoading, setIsLoading] = useState(false);
+
+  const [error, setError] = useState(null);
+
+  const makeCall = useCallback(
+    (...args) => {
+      setIsLoading(true);
+      setError(null);
+
+      apiFunc(...args)
+        .then(onSuccess)
+        .then(() => {
+          setIsLoading(false);
+        })
+
+        .catch((err) => {
+          setIsLoading(false);
+          setError(err);
+        });
+    },
+    [apiFunc, onSuccess]
+  );
+
+  return [
+    makeCall as (...args: any[]) => void,
+    isLoading as boolean,
+    error as any,
+  ];
+};
+
+export default useApiCall;
diff --git a/ddb_main/hooks/useCharacterEngine.ts b/ddb_main/hooks/useCharacterEngine.ts
new file mode 100644
index 0000000..86e852b
--- /dev/null
+++ b/ddb_main/hooks/useCharacterEngine.ts
@@ -0,0 +1,428 @@
+import { useSelector } from "react-redux";
+
+import {
+  AbilityUtils as abilityUtils,
+  AccessUtils as accessUtils,
+  ActionUtils as actionUtils,
+  ActivationUtils as activationUtils,
+  ApiAdapterUtils as apiAdapterUtils,
+  BackgroundUtils as backgroundUtils,
+  CampaignUtils as campaignUtils,
+  CampaignSettingUtils as campaignSettingUtils,
+  CharacterUtils as characterUtils,
+  ChoiceUtils as choiceUtils,
+  ClassFeatureUtils as classFeatureUtils,
+  ClassUtils as classUtils,
+  ConditionUtils as conditionUtils,
+  ConditionLevelUtils as conditionLevelUtils,
+  ContainerUtils as containerUtils,
+  CoreUtils as coreUtils,
+  CreatureUtils as creatureUtils,
+  CreatureRuleUtils as creatureRuleUtils,
+  DataOriginUtils as dataOriginUtils,
+  DecorationUtils as decorationUtils,
+  DefinitionUtils as definitionUtils,
+  DefinitionPoolUtils as definitionPoolUtils,
+  DiceUtils as diceUtils,
+  DurationUtils as durationUtils,
+  EntityUtils as entityUtils,
+  ExtraUtils as extraUtils,
+  FeatUtils as featUtils,
+  FeatureFlagInfoUtils as featureFlagInfoUtils,
+  FeatureUtils as featureUtils,
+  FormatUtils as formatUtils,
+  HelperUtils as helperUtils,
+  InfusionChoiceUtils as infusionChoiceUtils,
+  InfusionUtils as infusionUtils,
+  ItemUtils as itemUtils,
+  KnownInfusionUtils as knownInfusionUtils,
+  LimitedUseUtils as limitedUseUtils,
+  ModifierUtils as modifierUtils,
+  NoteUtils as noteUtils,
+  OptionalClassFeatureUtils as optionalClassFeatureUtils,
+  OptionalOriginUtils as optionalOriginUtils,
+  OptionUtils as optionUtils,
+  OrganizationUtils as organizationUtils,
+  PdfUtils as pdfUtils,
+  PrerequisiteUtils as prerequisiteUtils,
+  RaceUtils as raceUtils,
+  RacialTraitUtils as racialTraitUtils,
+  RuleDataUtils as ruleDataUtils,
+  RuleDataPoolUtils as ruleDataPoolUtils,
+  SkillUtils as skillUtils,
+  SnippetUtils as snippetUtils,
+  SourceUtils as sourceUtils,
+  SpellUtils as spellUtils,
+  StartingEquipmentUtils as startingEquipmentUtils,
+  ValueUtils as valueUtils,
+  VehicleUtils as vehicleUtils,
+  VehicleComponentUtils as vehicleComponentUtils,
+  apiCreatorSelectors as api,
+  rulesEngineSelectors as s,
+  FeatList,
+  characterSelectors as char,
+  characterActions,
+  serviceDataSelectors as sds,
+  serviceDataActions,
+} from "@dndbeyond/character-rules-engine";
+
+/**
+ * A hook that provides access to the character rules engine state without
+ * having to import rules engine all over the place in your components. This
+ * reduces touchpoints to the rules engine and makes it easier to refactor the
+ * rules engine in the future.
+ */
+export const useCharacterEngine = () => ({
+  // Character Actions
+  characterActions,
+  serviceDataActions,
+  // Character Selectors that aren't passed thru to Rules Engine Selectors
+  characterStatusSlug: useSelector(char.getStatusSlug),
+  // Rules Engine Selector Values
+  abilities: useSelector(s.getAbilities),
+  abilityLookup: useSelector(s.getAbilityLookup),
+  abilityKey: useSelector(s.getAbilityKeyLookup),
+  actionLookup: useSelector(s.getActionLookup),
+  acAdjustments: useSelector(s.getAcAdjustments),
+  acSuppliers: useSelector(s.getArmorClassSuppliers),
+  acTotal: useSelector(s.getAcTotal),
+  actions: useSelector(s.getActions),
+  activatables: useSelector(s.getActivatables),
+  activeCharacterSpells: useSelector(s.getActiveCharacterSpells),
+  activeClassSpells: useSelector(s.getActiveClassSpells),
+  activeConditions: useSelector(s.getActiveConditions),
+  activeGroupedImmunities: useSelector(s.getActiveGroupedImmunities),
+  activeGroupedResistances: useSelector(s.getActiveGroupedResistances),
+  activeGroupedVulnerabilities: useSelector(s.getActiveGroupedVulnerabilities),
+  activeImmunities: useSelector(s.getActiveImmunities),
+  activeResistances: useSelector(s.getActiveResistances),
+  activeVulnerabilities: useSelector(s.getActiveVulnerabilities),
+  activeSource: useSelector(s.getActiveSourceLookup),
+  activeSourceCategories: useSelector(s.getActiveSourceCategories),
+  activeSources: useSelector(s.getActiveSources),
+  activeSpellAttackList: useSelector(s.getActiveSpellAttackList),
+  advantageSavingThrowModifiers: useSelector(
+    s.getAdvantageSavingThrowModifiers
+  ),
+  alignment: useSelector(s.getAlignment),
+  allInventoryItems: useSelector(s.getAllInventoryItems),
+  armorSpeedAdjustmentAmount: useSelector(s.getArmorSpeedAdjustmentAmount),
+  attacks: useSelector(s.getAttacks),
+  attacksPerActionInfo: useSelector(s.getAttacksPerActionInfo),
+  attunedItems: useSelector(s.getAttunedItems),
+  attunedItemCountMax: useSelector(s.getAttunedItemCountMax),
+  attunedSlots: useSelector(s.getAttunedSlots),
+  availableInfusionChoices: useSelector(s.getAvailableInfusionChoices),
+  availablePactMagicSlotLevels: useSelector(s.getAvailablePactMagicSlotLevels),
+  availableSpellSlotLevels: useSelector(s.getAvailableSpellSlotLevels),
+  backgroundChoice: useSelector(s.getBackgroundChoiceLookup),
+  backgroundInfo: useSelector(s.getBackgroundInfo),
+  backgroundModifier: useSelector(s.getBackgroundModifierLookup),
+  backgroundModifiers: useSelector(s.getBackgroundModifiers),
+  baseClass: useSelector(s.getBaseClassLookup),
+  baseFeat: useSelector(s.getBaseFeatLookup),
+  baseFeats: useSelector(s.getBaseFeats),
+  bonusSavingThrowModifiers: useSelector(s.getBonusSavingThrowModifiers),
+  campaign: useSelector(s.getCampaign),
+  campaignSettings: useSelector(sds.getCampaignSettings),
+  carryingCapacity: useSelector(s.getCarryCapacity),
+  castableSpellSlotLevels: useSelector(s.getCastableSpellSlotLevels),
+  castablePactMagicSlotLevels: useSelector(s.getCastablePactMagicSlotLevels),
+  characterConfig: useSelector(s.getCharacterConfiguration),
+  characterGender: useSelector(s.getGender),
+  characterId: useSelector(s.getId),
+  characterInventoryContainers: useSelector(s.getCharacterInventoryContainers),
+  characterName: useSelector(s.getName),
+  characterNotes: useSelector(s.getCharacterNotes),
+  characterSpells: useSelector(s.getCharacterSpells),
+  characterTheme: useSelector(s.getCharacterTheme),
+  characterTraits: useSelector(s.getCharacterTraits),
+  choiceInfo: useSelector(s.getChoiceInfo),
+  classAction: useSelector(s.getClassActionLookup),
+  classAlwaysKnownSpells: useSelector(sds.getClassAlwaysKnownSpells),
+  classAlwaysPreparedSpells: useSelector(sds.getClassAlwaysPreparedSpells),
+  classChoice: useSelector(s.getClassChoiceLookup),
+  classCreatureRules: useSelector(s.getClassCreatureRules),
+  classFeature: useSelector(s.getClassFeatureLookup),
+  classMappingId: useSelector(s.getClassMappingIdLookupByActiveId),
+  classModifier: useSelector(s.getClassModifierLookup),
+  classOption: useSelector(s.getClassOptionLookup),
+  classSpell: useSelector(s.getClassSpellLookup),
+  classSpells: useSelector(s.getClassSpells),
+  classSpellInfo: useSelector(s.getClassSpellInfoLookup),
+  classSpellLists: useSelector(s.getClassSpellLists),
+  classSpellListSpells: useSelector(s.getClassSpellListSpellsLookup),
+  classes: useSelector(s.getClasses),
+  classesModifiers: useSelector(s.getClassesModifiers),
+  combinedMaxSpellSlotLevel: useSelector(s.getCombinedMaxSpellSlotLevel),
+  combinedSpellSlots: useSelector(s.getCombinedSpellSlots),
+  conModifier: useSelector(s.getConModifier),
+  conditionImmunityData: useSelector(s.getConditionImmunityData),
+  conditionModifier: useSelector(s.getConditionModifierLookup),
+  conditionModifiers: useSelector(s.getConditionModifiers),
+  container: useSelector(s.getContainerLookup),
+  containerCoinWeight: useSelector(s.getCointainerCoinWeight),
+  containerItemWeight: useSelector(s.getContainerItemWeight),
+  containerLookup: useSelector(s.getContainerLookup),
+  creature: useSelector(s.getCreatureLookup),
+  creatureGroupRules: useSelector(s.getCreatureGroupRulesLookup),
+  creatureInfusion: useSelector(s.getCreatureInfusionLookup),
+  creatureOwnerData: useSelector(s.getCreatureOwnerData),
+  creatureRules: useSelector(s.getCreatureRules),
+  creatures: useSelector(s.getCreatures),
+  currentCarriedWeightSpeed: useSelector(s.getCurrentCarriedWeightSpeed),
+  currentCarriedWeightType: useSelector(s.getCurrentCarriedWeightType),
+  currentLevel: useSelector(s.getCurrentLevel),
+  currentXp: useSelector(s.getCurrentXp),
+  currentLevelRacialTraits: useSelector(s.getCurrentLevelRacialTraits),
+  customActions: useSelector(s.getCustomActions),
+  customConditionAdjustments: useSelector(s.getCustomConditionAdjustments),
+  customDamageAdjustments: useSelector(s.getCustomDamageAdjustments),
+  customItems: useSelector(s.getCustomItems),
+  customImmunityDamageAdjustments: useSelector(
+    s.getCustomImmunityDamageAdjustments
+  ),
+  customResistanceDamageAdjustments: useSelector(
+    s.getCustomResistanceDamageAdjustments
+  ),
+  customVulnerabilityDamageAdjustments: useSelector(
+    s.getCustomVulnerabilityDamageAdjustments
+  ),
+  customSkills: useSelector(s.getCustomSkills),
+  customSkillProficiencies: useSelector(s.getCustomSkillProficiencies),
+  damageImmunityData: useSelector(s.getDamageImmunityData),
+  deathSaveInfo: useSelector(s.getDeathSaveInfo),
+  deathCause: useSelector(s.getDeathCause),
+  decorationInfo: useSelector(s.getDecorationInfo),
+  dedicatedWeaponEnabled: useSelector(s.getDedicatedWeaponEnabled),
+  definitionPool: useSelector(sds.getDefinitionPool),
+  dexModifier: useSelector(s.getDexModifier),
+  disadvantageSavingThrowModifiers: useSelector(
+    s.getDisadvantageSavingThrowModifiers
+  ),
+  encumberedWeight: useSelector(s.getEncumberedWeight),
+  entityRestrictionData: useSelector(s.getEntityRestrictionData),
+  entityValueLookup: useSelector(s.getCharacterValueLookupByEntity),
+  equippedItems: useSelector(s.getEquippedItems),
+  experienceInfo: useSelector(s.getExperienceInfo),
+  expertiseModifiers: useSelector(s.getExpertiseModifiers),
+  extras: useSelector(s.getExtras),
+  featLookup: useSelector(s.getFeatLookup),
+  feats: useSelector(s.getFeats),
+  featAction: useSelector(s.getFeatActionLookup),
+  featCreatureRules: useSelector(s.getFeatCreatureRules),
+  featModifier: useSelector(s.getFeatModifierLookup),
+  featModifiers: useSelector(s.getFeatModifiers),
+  featOption: useSelector(s.getFeatOptionLookup),
+  featChoice: useSelector(s.getFeatChoiceLookup),
+  gearWeaponItems: useSelector(s.getGearWeaponItems),
+  globalBackgroundSpellListIds: useSelector(s.getGlobalBackgroundSpellListIds),
+  globalRaceSpellListIds: useSelector(s.getGlobalRaceSpellListIds),
+  globalSpellListIds: useSelector(s.getGlobalSpellListIds),
+  hasInitiativeAdvantage: useSelector(s.getHasInitiativeAdvantage),
+  hasMaxAttunedItems: useSelector(s.hasMaxAttunedItems),
+  hasSpells: useSelector(s.hasSpells),
+  heavilyEncumberedWeight: useSelector(s.getHeavilyEncumberedWeight),
+  hexWeaponEnabled: useSelector(s.getHexWeaponEnabled),
+  highestEquippedArmorAC: useSelector(s.getHighestAcEquippedArmor),
+  highestEquippedShieldAC: useSelector(s.getHighestAcEquippedShield),
+  hpInfo: useSelector(s.getHitPointInfo),
+  improvedPactWeaponEnabled: useSelector(s.getImprovedPactWeaponEnabled),
+  infusions: useSelector(s.getInfusions),
+  infusionChoices: useSelector(s.getInfusionChoices),
+  infusionChoiceLookup: useSelector(s.getInfusionChoiceLookup),
+  infusionChoiceInfusion: useSelector(s.getInfusionChoiceInfusionLookup),
+  infusionMappings: useSelector(sds.getInfusionsMappings),
+  innateNaturalActions: useSelector(s.getInnateNaturalActions),
+  inventory: useSelector(s.getInventory),
+  inventoryContainers: useSelector(s.getInventoryContainers),
+  inventoryLookup: useSelector(s.getInventoryLookup),
+  inventoryInfusion: useSelector(s.getInventoryInfusionLookup),
+  isSheetReady: useSelector(s.isCharacterSheetReady),
+  isDead: useSelector(s.isDead),
+  isMulticlassCharacter: useSelector(s.isMulticlassCharacter),
+  itemAttacks: useSelector(s.getItemAttacks),
+  itemModifier: useSelector(s.getItemModifierLookup),
+  itemSpell: useSelector(s.getItemSpellLookup),
+  kenseiModifiers: useSelector(s.getKenseiModifiers),
+  knownInfusion: useSelector(s.getKnownInfusionLookup),
+  knownInfusionByChoice: useSelector(s.getKnownInfusionLookupByChoiceKey),
+  knownInfusions: useSelector(s.getKnownInfusions),
+  knownInfusionMappings: useSelector(sds.getKnownInfusionsMappings),
+  knownReplicatedItems: useSelector(s.getKnownReplicatedItems),
+  languages: useSelector(s.getLanguages),
+  languageModifiers: useSelector(s.getLanguageModifiers),
+  levelSpells: useSelector(s.getLevelSpells),
+  lifestyle: useSelector(s.getLifestyle),
+  loadSpecies: useSelector(api.makeLoadAvailableRaces),
+  maxPactMagicSlotLevel: useSelector(s.getMaxPactMagicSlotLevel),
+  maxSpellSlotLevel: useSelector(s.getMaxSpellSlotLevel),
+  miscModifiers: useSelector(s.getMiscModifiers),
+  modifierData: useSelector(s.getModifierData),
+  optionalClassFeature: useSelector(s.getOptionalClassFeatureLookup),
+  optionalClassFeatures: useSelector(s.getOptionalClassFeatures),
+  optionalOrigin: useSelector(s.getOptionalOriginLookup),
+  optionalOrigins: useSelector(s.getOptionalOrigins),
+  originRef: useSelector(s.getDataOriginRefData),
+  originRefBackground: useSelector(s.getDataOriginRefBackgroundData),
+  originRefClass: useSelector(s.getDataOriginRefClassData),
+  originRefCondition: useSelector(s.getDataOriginRefConditionData),
+  originRefFeat: useSelector(s.getDataOriginRefFeatData),
+  originRefFeatList: useSelector(s.getDataOriginRefFeatListData),
+  originRefItem: useSelector(s.getDataOriginRefItemData),
+  originRefRace: useSelector(s.getDataOriginRefRaceData),
+  originRefVehicle: useSelector(s.getDataOriginRefVehicleData),
+  overallSpellInfo: useSelector(s.getOverallSpellInfo),
+  overridePassiveInsight: useSelector(s.getOverridePassiveInsight),
+  overridePassiveInvestigation: useSelector(s.getOverridePassiveInvestigation),
+  overridePassivePerception: useSelector(s.getOverridePassivePerception),
+  pactMagicConditiones: useSelector(s.getPactMagicClasses),
+  pactMagicSlots: useSelector(s.getPactMagicSlots),
+  pactWeaponEnabled: useSelector(s.getPactWeaponEnabled),
+  partyInfo: useSelector(sds.getPartyInfo),
+  partyInventory: useSelector(s.getPartyInventory),
+  partyInventoryContainers: useSelector(s.getPartyInventoryContainers),
+  partyInventoryItem: useSelector(s.getPartyInventoryLookup),
+  passiveInsight: useSelector(s.getPassiveInsight),
+  passiveInvestigation: useSelector(s.getPassiveInvestigation),
+  passivePerception: useSelector(s.getPassivePerception),
+  pdfBucket1: useSelector(s.getPdfDataBucket1),
+  pdfBucket2: useSelector(s.getPdfDataBucket2),
+  pdfBucket3: useSelector(s.getPdfDataBucket3),
+  pdfBucket4: useSelector(s.getPdfDataBucket4),
+  pdfBucket5: useSelector(s.getPdfDataBucket5),
+  pdfBucket6: useSelector(s.getPdfDataBucket6),
+  pdfExportData: useSelector(s.getPdfExportData),
+  playerId: useSelector(s.getUserId),
+  playerName: useSelector(s.getUsername),
+  preferences: useSelector(s.getCharacterPreferences),
+  prerequisiteData: useSelector(s.getPrerequisiteData),
+  processedInitiative: useSelector(s.getProcessedInitiative),
+  proficiency: useSelector(s.getProficiencyLookup),
+  proficiencyBonus: useSelector(s.getProficiencyBonus),
+  proficiencyGroups: useSelector(s.getProficiencyGroups),
+  proficiencyModifiers: useSelector(s.getProficiencyModifiers),
+  protectionSuppliers: useSelector(s.getProtectionSuppliers),
+  pushDragLiftWeight: useSelector(s.getPushDragLiftWeight),
+  race: useSelector(s.getRace),
+  raceAction: useSelector(s.getRaceActionLookup),
+  raceChoice: useSelector(s.getRaceChoiceLookup),
+  raceCreatureRules: useSelector(s.getRaceCreatureRules),
+  raceModifier: useSelector(s.getRaceModifierLookup),
+  raceModifiers: useSelector(s.getRaceModifiers),
+  raceOption: useSelector(s.getRaceOptionLookup),
+  raceSpell: useSelector(s.getRaceSpellLookup),
+  requiredCharacterServiceParams: useSelector(
+    s.getRequiredCharacterServiceParams
+  ),
+  requiredGameDataServiceParams: useSelector(
+    s.getRequiredGameDataServiceParams
+  ),
+  resistanceData: useSelector(s.getResistanceData),
+  restrictedBonusSavingThrowModifiers: useSelector(
+    s.getRestrictedBonusSavingThrowModifiers
+  ),
+  ritualSpells: useSelector(s.getRitualSpells),
+  ruleData: useSelector(s.getRuleData),
+  ruleDataPool: useSelector(sds.getRuleDataPool),
+  savingThrowDiceAdjustments: useSelector(s.getSavingThrowDiceAdjustments),
+  senseInfo: useSelector(s.getSenseInfo),
+  situationalBonusSavingThrowsLookup: useSelector(
+    s.getSituationalBonusSavingThrowsLookup
+  ),
+  situationalBonusSavingThrows: useSelector(s.getSituationalBonusSavingThrows),
+  size: useSelector(s.getSize),
+  skill: useSelector(s.getSkillLookup),
+  skills: useSelector(s.getSkills),
+  snippetData: useSelector(s.getSnippetData),
+  socialImageData: useSelector(s.getSocialImageData),
+  specialWeaponPropertiesEnabled: useSelector(
+    s.hack__getSpecialWeaponPropertiesEnabled
+  ),
+  speeds: useSelector(s.getSpeeds),
+  spellClasses: useSelector(s.getSpellClasses),
+  spellcasterInfo: useSelector(s.getSpellCasterInfo),
+  spellcastingClasses: useSelector(s.getSpellcastingClasses),
+  spellListDataOrigin: useSelector(s.getSpellListDataOriginLookup),
+  spellSlots: useSelector(s.getSpellSlots),
+  startingClass: useSelector(s.getStartingClass),
+  strScore: useSelector(s.getStrScore),
+  totalCarriedWeight: useSelector(s.getTotalCarriedWeight),
+  totalClassLevel: useSelector(s.getTotalClassLevel),
+  uniqueProficiencyModifiers: useSelector(s.getUniqueProficiencyModifiers),
+  validEquipmentModifiers: useSelector(s.getValidEquipmentModifiers),
+  validGlobalModifiers: useSelector(s.getValidGlobalModifiers),
+  validImmunityModifiers: useSelector(s.getValidImmunityModifiers),
+  validResistanceModifiers: useSelector(s.getValidResistanceModifiers),
+  validVulnerabilityModifiers: useSelector(s.getValidVulnerabilityModifiers),
+  valueLookup: useSelector(s.getCharacterValueLookup),
+  vehicle: useSelector(s.getVehicleLookup),
+  vehicles: useSelector(s.getVehicles),
+  vehicleComponent: useSelector(s.getVehicleComponentLookup),
+  vehicleComponentMappings: useSelector(sds.getVehicleComponentMappings),
+  vehicleMappings: useSelector(sds.getVehicleMappings),
+  vulnerabilityData: useSelector(s.getVulnerabilityData),
+  weaponSpellDamageGroups: useSelector(s.getWeaponSpellDamageGroups),
+  weightSpeeds: useSelector(s.getWeightSpeeds),
+
+  // Utility Functions
+  abilityUtils,
+  accessUtils,
+  actionUtils,
+  activationUtils,
+  apiAdapterUtils,
+  backgroundUtils,
+  campaignUtils,
+  campaignSettingUtils,
+  characterUtils,
+  choiceUtils,
+  classFeatureUtils,
+  classUtils,
+  conditionUtils,
+  conditionLevelUtils,
+  containerUtils,
+  coreUtils,
+  creatureUtils,
+  creatureRuleUtils,
+  dataOriginUtils,
+  decorationUtils,
+  definitionUtils,
+  definitionPoolUtils,
+  diceUtils,
+  durationUtils,
+  entityUtils,
+  extraUtils,
+  featUtils,
+  featureFlagInfoUtils,
+  featureUtils,
+  formatUtils,
+  helperUtils,
+  infusionChoiceUtils,
+  infusionUtils,
+  itemUtils,
+  knownInfusionUtils,
+  limitedUseUtils,
+  modifierUtils,
+  noteUtils,
+  optionalClassFeatureUtils,
+  optionalOriginUtils,
+  optionUtils,
+  organizationUtils,
+  pdfUtils,
+  prerequisiteUtils,
+  raceUtils,
+  racialTraitUtils,
+  ruleDataUtils,
+  ruleDataPoolUtils,
+  skillUtils,
+  snippetUtils,
+  sourceUtils,
+  spellUtils,
+  startingEquipmentUtils,
+  valueUtils,
+  vehicleUtils,
+  vehicleComponentUtils,
+
+  // Misc
+  FeatList,
+});
diff --git a/ddb_main/hooks/useClaimCharacter.ts b/ddb_main/hooks/useClaimCharacter.ts
new file mode 100644
index 0000000..a1915a3
--- /dev/null
+++ b/ddb_main/hooks/useClaimCharacter.ts
@@ -0,0 +1,77 @@
+import { useCallback, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import { characterSelectors } from "@dndbeyond/character-rules-engine/es";
+
+import { toastMessageActions } from "~/tools/js/Shared/actions";
+
+import {
+  claimCharacter as claimCharacterApi,
+  joinCampaign as joinCampaignApi,
+} from "../helpers/characterServiceApi";
+
+interface UseClaimCharacterProps {
+  campaignJoinCode: string | null;
+  isAssigned: boolean;
+}
+
+export const useClaimCharacter = ({
+  campaignJoinCode,
+  isAssigned,
+}: UseClaimCharacterProps) => {
+  const [isFinished, setIsFinished] = useState(false);
+  const [isLoading, setIsLoading] = useState(false);
+
+  const [newCharacterId, setNewCharacterId] = useState<number | null>(null);
+  const [campaignId, setCampaignId] = useState<number | null>(null);
+
+  const characterId = useSelector(characterSelectors.getId);
+
+  const dispatch = useDispatch();
+
+  const claimCharacter = useCallback(async () => {
+    try {
+      setIsLoading(true);
+
+      let clonedId;
+
+      const claimResponse = await claimCharacterApi(characterId, isAssigned);
+      if (claimResponse.ok) {
+        const data = await claimResponse.json();
+        clonedId = data.id;
+        setNewCharacterId(clonedId);
+      } else {
+        throw new Error(`There was an error claiming character ${characterId}`);
+      }
+
+      if (campaignJoinCode) {
+        const joinResponse = await joinCampaignApi(campaignJoinCode, clonedId);
+        if (joinResponse.ok) {
+          const data = await joinResponse.json();
+          setCampaignId(data.campaignId);
+        } else {
+          throw new Error(
+            `There was an error adding character ${clonedId} to campaign join code ${campaignJoinCode}`
+          );
+        }
+      }
+    } catch (error) {
+      console.error(error);
+
+      dispatch(
+        toastMessageActions.toastError("Error", "An unexpected error occurred.")
+      );
+    } finally {
+      setIsLoading(false);
+      setIsFinished(true);
+    }
+  }, [campaignJoinCode, characterId, dispatch, isAssigned]);
+
+  return [
+    claimCharacter,
+    isLoading,
+    isFinished,
+    newCharacterId,
+    campaignId,
+  ] as const;
+};
diff --git a/ddb_main/hooks/useErrorHandling/useErrorHandling.tsx b/ddb_main/hooks/useErrorHandling/useErrorHandling.tsx
new file mode 100644
index 0000000..744da98
--- /dev/null
+++ b/ddb_main/hooks/useErrorHandling/useErrorHandling.tsx
@@ -0,0 +1,33 @@
+import { HTMLAttributes, useState } from "react";
+import styles from '../../styles/errors.module.css';
+
+export interface ErrorHandlerOptions {
+    initialState: boolean;
+    errMsg: string;
+    errorMessageAttributes?: HTMLAttributes<HTMLDivElement>;
+};
+
+export interface ErrorHandler {
+    showError: boolean;
+    setShowError: (value: boolean) => void;
+    ErrorMessage: () => JSX.Element;
+};
+
+export const useErrorHandling = (
+    initialState: boolean,
+    errMsg: string,
+    errorMessageAttributes: HTMLAttributes<HTMLDivElement> | null = null
+): ErrorHandler => {
+    const [showError, setShowError] = useState(initialState);
+    const ErrorMessage = (): JSX.Element => (
+        <div className={styles.inputError} {...errorMessageAttributes}>
+            {errMsg}
+        </div>
+    );
+
+    return {
+        showError,
+        setShowError,
+        ErrorMessage,
+    };
+};
diff --git a/ddb_main/hooks/useErrorHandling/useMaxLengthErrorHandling.tsx b/ddb_main/hooks/useErrorHandling/useMaxLengthErrorHandling.tsx
new file mode 100644
index 0000000..1b0e810
--- /dev/null
+++ b/ddb_main/hooks/useErrorHandling/useMaxLengthErrorHandling.tsx
@@ -0,0 +1,49 @@
+import { HTMLAttributes } from "react";
+import { useErrorHandling } from "./useErrorHandling";
+
+export interface MaxLengthErrorHandler {
+    handleMaxLengthErrorMsg: (value: string) => void;
+    hideError: () => void;
+    MaxLengthErrorMessage: () => JSX.Element;
+};
+
+export const useMaxLengthErrorHandling = (
+    initialState: boolean,
+    maxLength: number | null,
+    errMsg: string = "",
+    errorMessageAttributes?: HTMLAttributes<HTMLDivElement>
+): MaxLengthErrorHandler => {
+    errMsg ||= `The max length is ${maxLength} characters.`;
+
+    const {
+        showError,
+        setShowError,
+        ErrorMessage,
+    } = useErrorHandling(initialState, errMsg, errorMessageAttributes);
+
+    const handleMaxLengthErrorMsg = (value: string): void => {
+        if (!maxLength) {
+            // Skip if maxLength is 0 or not set.
+            return;
+        }
+
+        const isTooLong = (value?.length ?? 0) >= (maxLength ?? 0);
+        if (isTooLong !== showError) {
+            setShowError(isTooLong);
+        }
+    };
+
+    const hideError = () => {
+        setShowError(false);
+    }
+
+    const MaxLengthErrorMessage = (): JSX.Element => showError && errMsg
+        ? (<ErrorMessage />)
+        : <></>;
+
+    return {
+        handleMaxLengthErrorMsg,
+        MaxLengthErrorMessage,
+        hideError
+    };
+}
diff --git a/ddb_main/hooks/useExtras.ts b/ddb_main/hooks/useExtras.ts
new file mode 100644
index 0000000..3cbc0ff
--- /dev/null
+++ b/ddb_main/hooks/useExtras.ts
@@ -0,0 +1,26 @@
+import { useContext, useEffect, useState } from "react";
+
+import {
+  ExtraManager,
+  FeaturesManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ExtrasManagerContext } from "~/tools/js/Shared/managers/ExtrasManagerContext";
+
+//TODO: need to look at subscribeToUpdates for how many times its being called on state updates
+export function useExtras() {
+  const { extrasManager } = useContext(ExtrasManagerContext);
+
+  const [extras, setExtras] = useState<Array<ExtraManager>>(
+    extrasManager.getCharacterExtraManagers()
+  );
+
+  useEffect(() => {
+    const onUpdate = () => {
+      setExtras(extrasManager.getCharacterExtraManagers());
+    };
+    return FeaturesManager.subscribeToUpdates({ onUpdate });
+  }, [extrasManager]);
+
+  return extras;
+}
diff --git a/ddb_main/hooks/useLocalStorage.ts b/ddb_main/hooks/useLocalStorage.ts
new file mode 100644
index 0000000..aba73e3
--- /dev/null
+++ b/ddb_main/hooks/useLocalStorage.ts
@@ -0,0 +1,59 @@
+import {
+  useState,
+  useEffect,
+  useCallback,
+  Dispatch,
+  SetStateAction,
+} from "react";
+
+import { tryGet, tryRemove, trySet } from "../helpers/localStorageUtils";
+
+//got most of the typing for this at https://usehooks-ts.com/react-hook/use-local-storage
+
+type SetValue<T> = Dispatch<SetStateAction<T>>;
+type RemoveValue<T> = Dispatch<SetStateAction<T>>;
+function useLocalStorage<T>(
+  key: string,
+  defaultValue: T
+): [T, SetValue<T>, RemoveValue<T>] {
+  const getValue = useCallback(() => {
+    const savedValue = tryGet(key);
+
+    return savedValue === null
+      ? (defaultValue as T)
+      : (parseJSON(savedValue) as T);
+  }, [key, defaultValue]);
+
+  const [value, setValue] = useState(getValue());
+
+  useEffect(() => {
+    setValue(getValue());
+  }, [getValue]);
+
+  const set = useCallback(
+    (newValue) => {
+      setValue(newValue);
+      trySet(key, newValue);
+    },
+    [key, setValue]
+  );
+
+  const remove = () => {
+    setValue(defaultValue as T);
+    tryRemove(key);
+  };
+
+  return [value, set, remove];
+}
+
+export default useLocalStorage;
+
+// A wrapper for "JSON.parse()"" to support "undefined" value
+function parseJSON<T>(value: any): T | undefined {
+  try {
+    return value === "undefined" ? undefined : JSON.parse(value ?? "");
+  } catch (error) {
+    console.log("parsing error on", { value });
+    return value;
+  }
+}
diff --git a/ddb_main/hooks/usePdfExport.ts b/ddb_main/hooks/usePdfExport.ts
new file mode 100644
index 0000000..92bf2cb
--- /dev/null
+++ b/ddb_main/hooks/usePdfExport.ts
@@ -0,0 +1,58 @@
+import { useCallback, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import {
+  ApiAdapterUtils,
+  ApiRequests,
+  characterActions,
+  rulesEngineSelectors,
+  syncTransactionActions,
+} from "@dndbeyond/character-rules-engine";
+
+import { toastMessageActions } from "~/tools/js/Shared/actions";
+
+export interface ExportPdfData {
+  exportPdf: () => void;
+  pdfUrl: string | null;
+  isLoading: boolean;
+  isFinished: boolean;
+}
+export const usePdfExport = (): ExportPdfData => {
+  const [isFinished, setIsFinished] = useState(false);
+  const [isLoading, setIsLoading] = useState(false);
+  const [pdfUrl, setPdfUrl] = useState<string | null>(null);
+  const pdfData = useSelector(rulesEngineSelectors.getPdfExportData);
+
+  const dispatch = useDispatch();
+
+  const exportPdf = useCallback(async () => {
+    try {
+      setIsLoading(true);
+
+      let syncActivationId: string = "PDF-SYNC";
+      dispatch(syncTransactionActions.activate(syncActivationId));
+
+      //This will update the character's spell data before export is created
+      //(in case a user is in the builder and has not updated their class spells)
+      dispatch(characterActions.loadLazyCharacterData());
+
+      const response = await ApiRequests.postCharacterPdf({
+        exportData: JSON.stringify(pdfData),
+      });
+      const pdfUrl = ApiAdapterUtils.getResponseData(response);
+
+      if (pdfUrl) {
+        setPdfUrl(pdfUrl);
+        dispatch(syncTransactionActions.deactivate());
+      }
+    } catch (error) {
+      dispatch(
+        toastMessageActions.toastError("Error", "An unexpected error occurred.")
+      );
+    } finally {
+      setIsLoading(false);
+      setIsFinished(true);
+    }
+  }, []);
+  return { exportPdf, pdfUrl, isLoading, isFinished };
+};
diff --git a/ddb_main/hooks/usePositioning.ts b/ddb_main/hooks/usePositioning.ts
new file mode 100644
index 0000000..c4d8203
--- /dev/null
+++ b/ddb_main/hooks/usePositioning.ts
@@ -0,0 +1,62 @@
+import { useSelector } from "react-redux";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import {
+  SidebarAlignmentEnum,
+  SidebarPlacementEnum,
+  SidebarPositionInfo,
+} from "~/subApps/sheet/components/Sidebar/types";
+import { SheetPositioningInfo } from "~/tools/js/CharacterSheet/typings";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+
+export const usePositioning = () => {
+  const {
+    sidebar: { isVisible, placement, alignment, width },
+  } = useSidebar();
+
+  const getSheetPositioning = (): SheetPositioningInfo => {
+    let offset: number = 0;
+    if (!isVisible) {
+      return { offset, left: offset };
+    }
+
+    if (placement === SidebarPlacementEnum.FIXED) {
+      offset = width / 2;
+    }
+
+    return {
+      offset,
+      left: alignment === SidebarAlignmentEnum.LEFT ? offset : -1 * offset,
+    };
+  };
+
+  const getSidebarPositioning = (): SidebarPositionInfo => {
+    const sheetDimensions = useSelector(appEnvSelectors.getDimensions);
+    const sheetPosition = getSheetPositioning();
+
+    const { sheet, window } = sheetDimensions;
+
+    let posX: number = 0;
+    let sidebarGutter: number = 15;
+    let screenGutterSize: number = (window.width - sheet.width) / 2;
+
+    if (placement === SidebarPlacementEnum.FIXED) {
+      posX = screenGutterSize + sheetPosition.offset - sidebarGutter - width;
+    } else {
+      screenGutterSize -= sidebarGutter;
+      let overflowOffset: number =
+        width > screenGutterSize ? width - screenGutterSize : 0;
+      posX = screenGutterSize - width + overflowOffset;
+    }
+
+    return {
+      left: alignment === SidebarAlignmentEnum.LEFT ? posX : "auto",
+      right: alignment === SidebarAlignmentEnum.RIGHT ? posX : "auto",
+    };
+  };
+
+  return {
+    getSheetPositioning,
+    getSidebarPositioning,
+  };
+};
diff --git a/ddb_main/hooks/useRuleData.ts b/ddb_main/hooks/useRuleData.ts
new file mode 100644
index 0000000..28808a4
--- /dev/null
+++ b/ddb_main/hooks/useRuleData.ts
@@ -0,0 +1,104 @@
+import { useSelector } from "react-redux";
+
+import {
+  RuleDataUtils as ruleDataUtils,
+  ruleDataSelectors as s,
+} from "@dndbeyond/character-rules-engine";
+
+/**
+ * A hook that provides access to the rule data state without having to
+ * import rules engine all over the place in your components. This reduces
+ * touchpoints to the rules engine and makes it easier to refactor the rules
+ * engine in the future.
+ */
+export const useRuleData = () => ({
+  // Export all data coming from the RuleData selectors
+  allData: useSelector(s.getAllData),
+  abilityScoreDisplayTypes: useSelector(s.getAbilityScoreDisplayTypes),
+  abilitySkills: useSelector(s.getAbilitySkills),
+  activationTypes: useSelector(s.getActivationTypes),
+  additionalLevelTypes: useSelector(s.getAdditionalLevelTypes),
+  adjustmentDataTypes: useSelector(s.getAdjustmentDataTypes),
+  adjustmentTypes: useSelector(s.getAdjustmentTypes),
+  alignments: useSelector(s.getAlignments),
+  aoeTypes: useSelector(s.getAoeTypes),
+  armor: useSelector(s.getArmor),
+  basicActions: useSelector(s.getBasicActions),
+  baseWeaponReach: useSelector(s.getBaseWeaponReach),
+  basicMaxStatScore: useSelector(s.getBasicMaxStatScore),
+  challengeRatings: useSelector(s.getChallengeRatings),
+  conditionTypes: useSelector(s.getConditionTypes),
+  conditions: useSelector(s.getConditions),
+  creatureGroupCategories: useSelector(s.getCreatureGroupCategories),
+  creatureGroupFlags: useSelector(s.getCreatureGroupFlags),
+  creatureGroups: useSelector(s.getCreatureGroups),
+  creatureSizes: useSelector(s.getCreatureSizes),
+  currencyData: useSelector(s.getCurrencyData),
+  damageAdjustments: useSelector(s.getDamageAdjustments),
+  damageTypes: useSelector(s.getDamageTypes),
+  defaultArmorImageUrl: useSelector(s.getDefaultArmorImageUrl),
+  defaultAttunedItemCountMax: useSelector(s.getDefaultAttunedItemCountMax),
+  defaultGearImageUrl: useSelector(s.getDefaultGearImageUrl),
+  defaultRacePortraitUrl: useSelector(s.getDefaultRacePortraitUrl),
+  defaultWeaponImageUrl: useSelector(s.getDefaultWeaponImageUrl),
+  diceValues: useSelector(s.getDiceValues),
+  environments: useSelector(s.getEnvironments),
+  initiativeScore: useSelector(s.getInitiativeScore),
+  languageTypeId: useSelector(s.getLanguageTypeId),
+  languages: useSelector(s.getLanguages),
+  levelExperiencePoints: useSelector(s.getLevelExperiencePoints),
+  levelProficiencyBonuses: useSelector(s.getLevelProficiencyBonuses),
+  lifestyles: useSelector(s.getLifestyles),
+  limitedUseResetTypes: useSelector(s.getLimitedUseResetTypes),
+  longRestMinHitDiceUsedRecovered: useSelector(
+    s.getLongRestMinimumHitDiceUsedRecovered
+  ),
+  maxAttunedItemCountMax: useSelector(s.getMaxAttunedItemCountMax),
+  maxCharacterLevel: useSelector(s.getMaxCharacterLevel),
+  maxDeathsavesFail: useSelector(s.getMaxDeathsavesFail),
+  maxDeathsavesSuccess: useSelector(s.getMaxDeathsavesSuccess),
+  maxSpellLevel: useSelector(s.getMaxSpellLevel),
+  maxStatScore: useSelector(s.getMaxStatScore),
+  minAttunedItemCountMax: useSelector(s.getMinAttunedItemCountMax),
+  minStatScore: useSelector(s.getMinStatScore),
+  minimumHpTotal: useSelector(s.getMinimumHpTotal),
+  minimumLimitedUseMaxUse: useSelector(s.getMinimumLimitedUseMaxUse),
+  monsterSubTypes: useSelector(s.getMonsterSubTypes),
+  monsterTypes: useSelector(s.getMonsterTypes),
+  movements: useSelector(s.getMovements),
+  multiClassSpellSlots: useSelector(s.getMultiClassSpellSlots),
+  naturalActions: useSelector(s.getNaturalActions),
+  noArmorAcAmount: useSelector(s.getNoArmorAcAmount),
+  pactMagicMultiClassSpellSlots: useSelector(
+    s.getPactMagicMultiClassSpellSlots
+  ),
+  privacyTypes: useSelector(s.getPrivacyTypes),
+  proficiencyGroups: useSelector(s.getProficiencyGroups),
+  raceGroups: useSelector(s.getRaceGroups),
+  rangeTypes: useSelector(s.getRangeTypes),
+  ritualCastingTimeMinuteAddition: useSelector(
+    s.getRitualCastingTimeMinuteAddition
+  ),
+  rules: useSelector(s.getRules),
+  senses: useSelector(s.getSenses),
+  sharingTypes: useSelector(s.getSharingTypes),
+  sourceCategories: useSelector(s.getSourceCategories),
+  sources: useSelector(s.getSources),
+  spellComponents: useSelector(s.getSpellComponents),
+  spellConditionTypes: useSelector(s.getSpellConditionTypes),
+  spellRangeTypes: useSelector(s.getSpellRangeTypes),
+  statModifiers: useSelector(s.getStatModifiers),
+  stats: useSelector(s.getStats),
+  stealthCheckTypes: useSelector(s.getStealthCheckTypes),
+  stringMartialArts: useSelector(s.getStringMartialArts),
+  stringPactMagic: useSelector(s.getStringPactMagic),
+  stringSpellCasting: useSelector(s.getStringSpellCasting),
+  stringSpellEldritchBlast: useSelector(s.getStringSpellEldritchBlast),
+  weapons: useSelector(s.getWeapons),
+  weaponCategories: useSelector(s.getWeaponCategories),
+  weaponProperties: useSelector(s.getWeaponProperties),
+  weaponPropertyReachDistance: useSelector(s.getWeaponPropertyReachDistance),
+
+  // Export all utils from RuleDataUtils
+  ruleDataUtils,
+});
diff --git a/ddb_main/hooks/useSource.ts b/ddb_main/hooks/useSource.ts
new file mode 100644
index 0000000..84d2dc5
--- /dev/null
+++ b/ddb_main/hooks/useSource.ts
@@ -0,0 +1,179 @@
+import { orderBy } from "lodash";
+
+import {
+  BuilderChoiceOptionContract,
+  EntityRestrictionData,
+  HelperUtils,
+  HtmlSelectOptionGroup,
+  RuleDataUtils,
+  SimpleSourcedDefinitionContract,
+  SourceMappingContract,
+  SourceUtils,
+} from "@dndbeyond/character-rules-engine";
+
+import { TypeScriptUtils } from "~/tools/js/Shared/utils";
+
+import { useCharacterEngine } from "./useCharacterEngine";
+import { useRuleData } from "./useRuleData";
+
+interface SourceCategoryGroup<T> {
+  name: string;
+  id: number;
+  items: Array<T>;
+  sortOrder: number | undefined;
+}
+
+type SourceCategoryKey =
+  | "avatarUrl"
+  | "description"
+  | "id"
+  | "isEnabledByDefault"
+  | "isHideable"
+  | "isPartneredContent"
+  | "isToggleable"
+  | "name";
+
+export const useSource = () => {
+  const {
+    ruleData,
+    helperUtils: { lookupDataOrFallback },
+    ruleDataUtils: { getSourceCategoryLookup },
+  } = useCharacterEngine();
+  const {
+    ruleDataUtils: { getSourceDataLookup },
+  } = useRuleData();
+  const allSources = getSourceDataLookup(ruleData);
+  const allSourceCategories = getSourceCategoryLookup(ruleData);
+
+  // Returns the source ID from a given source
+  const getSourceId = (source: SourceMappingContract) => source?.sourceId;
+
+  const getSource = (sourceId: number | string) =>
+    lookupDataOrFallback(allSources, sourceId);
+
+  const getSourceName = (sourceId: number | string) =>
+    lookupDataOrFallback(allSources, sourceId)?.name;
+
+  const getSourceDescription = (sourceId: number | string) =>
+    lookupDataOrFallback(allSources, sourceId)?.description;
+
+  // Source Category direct access with category id
+  const getSourceCategory = (sourceCategoryId: number) =>
+    lookupDataOrFallback(allSourceCategories, sourceCategoryId);
+
+  const getSourceCategoryDescription = (sourceCategoryId: number) =>
+    getSourceCategory(sourceCategoryId)?.description;
+
+  // Takes an array of any entity that contains a sources key and returns an array of sorted SourceCategoryGroup representing each Source Category with the category data and an array of the entities that belong to that category.
+  const getSourceCategoryGroups = <
+    T extends {
+      sources: SourceMappingContract[] | null;
+    }
+  >(
+    items: Array<T>
+  ): Array<SourceCategoryGroup<T>> => {
+    let groups: Array<SourceCategoryGroup<T>> = [];
+
+    items.forEach((item) => {
+      const sourceContracts = item.sources ?? [];
+
+      //get the source data for each source contract
+      const sources = sourceContracts
+        .map((source) =>
+          HelperUtils.lookupDataOrFallback(
+            RuleDataUtils.getSourceDataLookup(ruleData),
+            source.sourceId
+          )
+        )
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+
+      //get the source category name for the first source contract or default to Homebrew
+      const sourceCategoryName =
+        sources.length > 0 &&
+        sources[0].sourceCategory &&
+        sources[0].sourceCategory.name
+          ? sources[0].sourceCategory.name
+          : "Homebrew";
+
+      // Search the availableGroupedOptions array for the source category
+      const index = groups.findIndex(
+        (element) => element.name === sourceCategoryName
+      );
+
+      // If the source category wasn't found, add it as a new option group.
+      if (index < 0) {
+        groups.push({
+          name: sourceCategoryName,
+          id: sources[0]?.sourceCategory?.id || 0,
+          sortOrder: sources[0]?.sourceCategory?.sortOrder,
+          items: [item],
+        });
+        // Otherwise, add the option to the existing source category's array of options.
+      } else {
+        groups[index].items.push(item);
+      }
+    });
+
+    return orderBy(groups, "sortOrder");
+  };
+
+  // Takes an array of any entity's DefinitionContract and returns an array of sorted HtmlSelectOptionGroup representing each Source Category and a sorted array of options.
+  const getGroupedOptionsBySourceCategory = <
+    T extends {
+      sources: SourceMappingContract[] | null;
+      name: string | null;
+      id: number;
+      description?: string | null;
+    }
+  >(
+    items: Array<T>,
+    optionValue?: number | null,
+    entityRestrictionData?: EntityRestrictionData,
+    labelFallback?: string
+  ): HtmlSelectOptionGroup[] => {
+    return SourceUtils.getGroupedOptionsBySourceCategory(
+      items,
+      ruleData,
+      optionValue,
+      entityRestrictionData,
+      labelFallback
+    );
+  };
+
+  //Given an array of choiceOptionContracts, return an array of SimpleSourcedDefinitionContracts (these are used to create grouped options in a select dropdown)
+  const getSimpleSourcedDefinitionContracts = (
+    choiceOptionContracts: Array<BuilderChoiceOptionContract>
+  ): Array<SimpleSourcedDefinitionContract> => {
+    return SourceUtils.getSimpleSourcedDefinitionContracts(
+      choiceOptionContracts
+    );
+  };
+
+  // Compares a source's category to a given match and returns a boolean value
+  const matchSourceCategory = (
+    sourceId: number,
+    match: string,
+    key: SourceCategoryKey = "name"
+  ) => {
+    if (!sourceId) return false;
+
+    const source = lookupDataOrFallback(allSources, sourceId);
+    if (!source) return false;
+
+    if (source.sourceCategory?.[key] === match) return true;
+  };
+
+  return {
+    allSources,
+    getSource,
+    getSourceId,
+    getSourceCategory,
+    getSourceCategoryDescription,
+    getSourceDescription,
+    getSourceName,
+    matchSourceCategory,
+    getGroupedOptionsBySourceCategory,
+    getSimpleSourcedDefinitionContracts,
+    getSourceCategoryGroups,
+  };
+};
diff --git a/ddb_main/hooks/useSubscriptionTier.ts b/ddb_main/hooks/useSubscriptionTier.ts
new file mode 100644
index 0000000..1790680
--- /dev/null
+++ b/ddb_main/hooks/useSubscriptionTier.ts
@@ -0,0 +1,26 @@
+import { useState, useEffect } from "react";
+
+import { getSubscriptionTier } from "../helpers/userApi";
+
+export const FREE_TIER = "free";
+export const HERO_TIER = "hero";
+export const MASTER_TIER = "master";
+export const LEGENDARY_TIER = "legendary";
+
+const useSubscriptionTier = (defaultSubscription?: string) => {
+  const [subscriptionTier, setSubscriptionTier] = useState<string | undefined>(
+    defaultSubscription
+  );
+
+  useEffect(() => {
+    getSubscriptionTier().then((tier) => {
+      if (tier) {
+        setSubscriptionTier(tier as unknown as string);
+      }
+    });
+  }, []);
+
+  return (subscriptionTier || FREE_TIER).toLowerCase();
+};
+
+export default useSubscriptionTier;
diff --git a/ddb_main/hooks/useUnpropagatedClick.ts b/ddb_main/hooks/useUnpropagatedClick.ts
new file mode 100644
index 0000000..84ffd69
--- /dev/null
+++ b/ddb_main/hooks/useUnpropagatedClick.ts
@@ -0,0 +1,21 @@
+import { MouseEvent, useCallback } from "react";
+
+/**
+ * Prevents click events from propagating to parent elements.
+ * @param onClick The function to call when the element is clicked.
+ * @returns A function that will prevent the click event from propagating.
+ */
+export const useUnpropagatedClick = (
+  onClick?: (event: MouseEvent, ...args: unknown[]) => void
+) => {
+  const handleClick = useCallback(
+    (event: MouseEvent, ...args: unknown[]) => {
+      event.stopPropagation();
+      event.nativeEvent.stopImmediatePropagation();
+      onClick?.(event, ...args);
+    },
+    [onClick]
+  );
+
+  return handleClick;
+};
diff --git a/ddb_main/hooks/useUser.ts b/ddb_main/hooks/useUser.ts
new file mode 100644
index 0000000..b3f5532
--- /dev/null
+++ b/ddb_main/hooks/useUser.ts
@@ -0,0 +1,42 @@
+import { useState, useEffect } from "react";
+
+import type { User } from "@dndbeyond/authentication-lib-js";
+
+import { getUser } from "../helpers/userApi";
+
+export interface AppUser extends User {
+  displayName: string;
+  id: string;
+  name: string;
+  roles: Array<string>;
+  subscription: string;
+  subscriptionTier: string;
+}
+/**
+ * AppUserState has three states:
+ * - undefined: We currently don't know if the user is authenticated or not. ie loading state
+ * - null: user is not authenticated
+ * - User: user is authenticated and is a registered user
+ */
+const useUserInitialState = undefined;
+type UseUserUnauthenticated = null;
+export type AppUserState =
+  | AppUser
+  | UseUserUnauthenticated
+  | typeof useUserInitialState;
+
+const useUser = () => {
+  const [user, setUser] = useState<AppUserState>(useUserInitialState);
+
+  useEffect(() => {
+    getUser()
+      .then(setUser)
+      .catch(() => {
+        setUser(null);
+      });
+  }, []);
+
+  return user;
+};
+
+export default useUser;
diff --git a/ddb_main/hooks/useUserId.ts b/ddb_main/hooks/useUserId.ts
new file mode 100644
index 0000000..71b0004
--- /dev/null
+++ b/ddb_main/hooks/useUserId.ts
@@ -0,0 +1,17 @@
+import { useState, useEffect } from "react";
+
+import { getUserId } from "../helpers/userApi";
+
+const useUserId = (defaultUserId?: number) => {
+  const [userId, setUserId] = useState<number | undefined>(defaultUserId);
+
+  useEffect(() => {
+    getUserId().then((user) => {
+      setUserId(user as unknown as number);
+    });
+  }, []);
+
+  return userId;
+};
+
+export default useUserId;
diff --git a/ddb_main/hooks/useUserName.ts b/ddb_main/hooks/useUserName.ts
new file mode 100644
index 0000000..953fb9c
--- /dev/null
+++ b/ddb_main/hooks/useUserName.ts
@@ -0,0 +1,19 @@
+import { useState, useEffect } from "react";
+
+import { getUserDisplayName } from "../helpers/userApi";
+
+const useUserName = () => {
+  const [userName, setUserName] = useState<string | null>("");
+
+  useEffect(() => {
+    getUserDisplayName()
+      .then(setUserName)
+      .catch(() => {
+        setUserName(null);
+      });
+  }, []);
+
+  return userName;
+};
+
+export default useUserName;
diff --git a/ddb_main/hooks/useUserRoles.ts b/ddb_main/hooks/useUserRoles.ts
new file mode 100644
index 0000000..8f2ec2b
--- /dev/null
+++ b/ddb_main/hooks/useUserRoles.ts
@@ -0,0 +1,19 @@
+import { useState, useEffect } from "react";
+
+import { getRoles } from "../helpers/userApi";
+
+const useUserRoles = () => {
+  const [userRoles, setUserRoles] = useState<string[]>([]);
+
+  useEffect(() => {
+    getRoles()
+      .then(setUserRoles)
+      .catch(() => {
+        setUserRoles([]);
+      });
+  }, []);
+
+  return userRoles;
+};
+
+export default useUserRoles;
diff --git a/ddb_main/index.tsx b/ddb_main/index.tsx
new file mode 100644
index 0000000..0b46454
--- /dev/null
+++ b/ddb_main/index.tsx
@@ -0,0 +1,69 @@
+import ReactDOM from "react-dom";
+import { QueryClient, QueryClientProvider } from "react-query";
+import { BrowserRouter } from "react-router-dom";
+
+import { FontProvider } from "@dndbeyond/ftui-components";
+import "@dndbeyond/ttui/styles/palette.css";
+import wayOfLight from "@dndbeyond/ttui/themes/wayOfLight";
+
+import { Layout } from "./components/Layout";
+import { AuthProvider } from "./contexts/Authentication";
+import { FeatureFlagProvider } from "./contexts/FeatureFlag";
+import { FiltersProvider } from "./contexts/Filters";
+import { HeadContextProvider } from "./contexts/Head";
+import { ThemeManagerProvider } from "./contexts/ThemeManager";
+import { reportWebVitals } from "./helpers/reportWebVitals";
+import { Routes } from "./routes";
+import "./styles/global.css";
+import "./styles/index.scss";
+import "./styles/reset.css";
+import "./styles/variables.css";
+import "./styles/waterdeep-stat-blocks.css";
+
+const queryClient = new QueryClient({
+  defaultOptions: { queries: { staleTime: 60 * 60 * 1000 } },
+});
+
+const fonts = [
+  {
+    family: "Tiamat Condensed SC",
+    type: "woff2",
+    url: "https://www.dndbeyond.com/fonts/tiamatcondensedsc-regular-webfont.woff2",
+  },
+  {
+    family: "MrsEavesSmallCaps",
+    type: "truetype",
+    url: "https://www.dndbeyond.com/content/skins/waterdeep/fonts/MrsEavesSmallCaps.ttf",
+  },
+];
+
+const App = () => (
+  <>
+    <style>{wayOfLight}</style>
+    <BrowserRouter>
+      <QueryClientProvider client={queryClient}>
+        <ThemeManagerProvider manager={{ lightOrDark: "light" }}>
+          <FontProvider fonts={fonts} />
+          <HeadContextProvider>
+            <AuthProvider>
+              <FeatureFlagProvider>
+                <FiltersProvider>
+                  <Layout>
+                    <Routes />
+                  </Layout>
+                </FiltersProvider>
+              </FeatureFlagProvider>
+            </AuthProvider>
+          </HeadContextProvider>
+        </ThemeManagerProvider>
+      </QueryClientProvider>
+    </BrowserRouter>
+  </>
+);
+
+ReactDOM.render(<App />, document.getElementById("character-tools-target"));
+
+// If you want to start measuring performance in your app, pass a function
+// to log results (for example: reportWebVitals(console.log))
+// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
+reportWebVitals();
diff --git a/ddb_main/node_modules/@babel/polyfill/lib/index.js b/ddb_main/node_modules/@babel/polyfill/lib/index.js
new file mode 100644
index 0000000..b8fa7ec
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/lib/index.js
@@ -0,0 +1,13 @@
+"use strict";
+
+require("./noConflict");
+
+var _global = _interopRequireDefault(require("core-js/library/fn/global"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+if (_global["default"]._babelPolyfill && typeof console !== "undefined" && console.warn) {
+  console.warn("@babel/polyfill is loaded more than once on this page. This is probably not desirable/intended " + "and may have consequences if different versions of the polyfills are applied sequentially. " + "If you do need to load the polyfill more than once, use @babel/polyfill/noConflict " + "instead to bypass the warning.");
+}
+
+_global["default"]._babelPolyfill = true;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/polyfill/lib/noConflict.js b/ddb_main/node_modules/@babel/polyfill/lib/noConflict.js
new file mode 100644
index 0000000..89cf8e6
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/lib/noConflict.js
@@ -0,0 +1,29 @@
+"use strict";
+
+require("core-js/es6");
+
+require("core-js/fn/array/includes");
+
+require("core-js/fn/array/flat-map");
+
+require("core-js/fn/string/pad-start");
+
+require("core-js/fn/string/pad-end");
+
+require("core-js/fn/string/trim-start");
+
+require("core-js/fn/string/trim-end");
+
+require("core-js/fn/symbol/async-iterator");
+
+require("core-js/fn/object/get-own-property-descriptors");
+
+require("core-js/fn/object/values");
+
+require("core-js/fn/object/entries");
+
+require("core-js/fn/promise/finally");
+
+require("core-js/web");
+
+require("regenerator-runtime/runtime");
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/es6/index.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/es6/index.js
new file mode 100644
index 0000000..21fc797
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/es6/index.js
@@ -0,0 +1,139 @@
+require('../modules/es6.symbol');
+require('../modules/es6.object.create');
+require('../modules/es6.object.define-property');
+require('../modules/es6.object.define-properties');
+require('../modules/es6.object.get-own-property-descriptor');
+require('../modules/es6.object.get-prototype-of');
+require('../modules/es6.object.keys');
+require('../modules/es6.object.get-own-property-names');
+require('../modules/es6.object.freeze');
+require('../modules/es6.object.seal');
+require('../modules/es6.object.prevent-extensions');
+require('../modules/es6.object.is-frozen');
+require('../modules/es6.object.is-sealed');
+require('../modules/es6.object.is-extensible');
+require('../modules/es6.object.assign');
+require('../modules/es6.object.is');
+require('../modules/es6.object.set-prototype-of');
+require('../modules/es6.object.to-string');
+require('../modules/es6.function.bind');
+require('../modules/es6.function.name');
+require('../modules/es6.function.has-instance');
+require('../modules/es6.parse-int');
+require('../modules/es6.parse-float');
+require('../modules/es6.number.constructor');
+require('../modules/es6.number.to-fixed');
+require('../modules/es6.number.to-precision');
+require('../modules/es6.number.epsilon');
+require('../modules/es6.number.is-finite');
+require('../modules/es6.number.is-integer');
+require('../modules/es6.number.is-nan');
+require('../modules/es6.number.is-safe-integer');
+require('../modules/es6.number.max-safe-integer');
+require('../modules/es6.number.min-safe-integer');
+require('../modules/es6.number.parse-float');
+require('../modules/es6.number.parse-int');
+require('../modules/es6.math.acosh');
+require('../modules/es6.math.asinh');
+require('../modules/es6.math.atanh');
+require('../modules/es6.math.cbrt');
+require('../modules/es6.math.clz32');
+require('../modules/es6.math.cosh');
+require('../modules/es6.math.expm1');
+require('../modules/es6.math.fround');
+require('../modules/es6.math.hypot');
+require('../modules/es6.math.imul');
+require('../modules/es6.math.log10');
+require('../modules/es6.math.log1p');
+require('../modules/es6.math.log2');
+require('../modules/es6.math.sign');
+require('../modules/es6.math.sinh');
+require('../modules/es6.math.tanh');
+require('../modules/es6.math.trunc');
+require('../modules/es6.string.from-code-point');
+require('../modules/es6.string.raw');
+require('../modules/es6.string.trim');
+require('../modules/es6.string.iterator');
+require('../modules/es6.string.code-point-at');
+require('../modules/es6.string.ends-with');
+require('../modules/es6.string.includes');
+require('../modules/es6.string.repeat');
+require('../modules/es6.string.starts-with');
+require('../modules/es6.string.anchor');
+require('../modules/es6.string.big');
+require('../modules/es6.string.blink');
+require('../modules/es6.string.bold');
+require('../modules/es6.string.fixed');
+require('../modules/es6.string.fontcolor');
+require('../modules/es6.string.fontsize');
+require('../modules/es6.string.italics');
+require('../modules/es6.string.link');
+require('../modules/es6.string.small');
+require('../modules/es6.string.strike');
+require('../modules/es6.string.sub');
+require('../modules/es6.string.sup');
+require('../modules/es6.date.now');
+require('../modules/es6.date.to-json');
+require('../modules/es6.date.to-iso-string');
+require('../modules/es6.date.to-string');
+require('../modules/es6.date.to-primitive');
+require('../modules/es6.array.is-array');
+require('../modules/es6.array.from');
+require('../modules/es6.array.of');
+require('../modules/es6.array.join');
+require('../modules/es6.array.slice');
+require('../modules/es6.array.sort');
+require('../modules/es6.array.for-each');
+require('../modules/es6.array.map');
+require('../modules/es6.array.filter');
+require('../modules/es6.array.some');
+require('../modules/es6.array.every');
+require('../modules/es6.array.reduce');
+require('../modules/es6.array.reduce-right');
+require('../modules/es6.array.index-of');
+require('../modules/es6.array.last-index-of');
+require('../modules/es6.array.copy-within');
+require('../modules/es6.array.fill');
+require('../modules/es6.array.find');
+require('../modules/es6.array.find-index');
+require('../modules/es6.array.species');
+require('../modules/es6.array.iterator');
+require('../modules/es6.regexp.constructor');
+require('../modules/es6.regexp.exec');
+require('../modules/es6.regexp.to-string');
+require('../modules/es6.regexp.flags');
+require('../modules/es6.regexp.match');
+require('../modules/es6.regexp.replace');
+require('../modules/es6.regexp.search');
+require('../modules/es6.regexp.split');
+require('../modules/es6.promise');
+require('../modules/es6.map');
+require('../modules/es6.set');
+require('../modules/es6.weak-map');
+require('../modules/es6.weak-set');
+require('../modules/es6.typed.array-buffer');
+require('../modules/es6.typed.data-view');
+require('../modules/es6.typed.int8-array');
+require('../modules/es6.typed.uint8-array');
+require('../modules/es6.typed.uint8-clamped-array');
+require('../modules/es6.typed.int16-array');
+require('../modules/es6.typed.uint16-array');
+require('../modules/es6.typed.int32-array');
+require('../modules/es6.typed.uint32-array');
+require('../modules/es6.typed.float32-array');
+require('../modules/es6.typed.float64-array');
+require('../modules/es6.reflect.apply');
+require('../modules/es6.reflect.construct');
+require('../modules/es6.reflect.define-property');
+require('../modules/es6.reflect.delete-property');
+require('../modules/es6.reflect.enumerate');
+require('../modules/es6.reflect.get');
+require('../modules/es6.reflect.get-own-property-descriptor');
+require('../modules/es6.reflect.get-prototype-of');
+require('../modules/es6.reflect.has');
+require('../modules/es6.reflect.is-extensible');
+require('../modules/es6.reflect.own-keys');
+require('../modules/es6.reflect.prevent-extensions');
+require('../modules/es6.reflect.set');
+require('../modules/es6.reflect.set-prototype-of');
+module.exports = require('../modules/_core');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/array/flat-map.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/array/flat-map.js
new file mode 100644
index 0000000..f6a7429
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/array/flat-map.js
@@ -0,0 +1,2 @@
+require('../../modules/es7.array.flat-map');
+module.exports = require('../../modules/_core').Array.flatMap;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/array/includes.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/array/includes.js
new file mode 100644
index 0000000..d0e8a4e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/array/includes.js
@@ -0,0 +1,2 @@
+require('../../modules/es7.array.includes');
+module.exports = require('../../modules/_core').Array.includes;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/object/entries.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/object/entries.js
new file mode 100644
index 0000000..197500b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/object/entries.js
@@ -0,0 +1,2 @@
+require('../../modules/es7.object.entries');
+module.exports = require('../../modules/_core').Object.entries;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/object/get-own-property-descriptors.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/object/get-own-property-descriptors.js
new file mode 100644
index 0000000..a502c5e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/object/get-own-property-descriptors.js
@@ -0,0 +1,2 @@
+require('../../modules/es7.object.get-own-property-descriptors');
+module.exports = require('../../modules/_core').Object.getOwnPropertyDescriptors;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/object/values.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/object/values.js
new file mode 100644
index 0000000..4d99b9c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/object/values.js
@@ -0,0 +1,2 @@
+require('../../modules/es7.object.values');
+module.exports = require('../../modules/_core').Object.values;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/promise/finally.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/promise/finally.js
new file mode 100644
index 0000000..4188dae
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/promise/finally.js
@@ -0,0 +1,4 @@
+'use strict';
+require('../../modules/es6.promise');
+require('../../modules/es7.promise.finally');
+module.exports = require('../../modules/_core').Promise['finally'];
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/pad-end.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/pad-end.js
new file mode 100644
index 0000000..23eb9f9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/pad-end.js
@@ -0,0 +1,2 @@
+require('../../modules/es7.string.pad-end');
+module.exports = require('../../modules/_core').String.padEnd;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/pad-start.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/pad-start.js
new file mode 100644
index 0000000..ff12739
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/pad-start.js
@@ -0,0 +1,2 @@
+require('../../modules/es7.string.pad-start');
+module.exports = require('../../modules/_core').String.padStart;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/trim-end.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/trim-end.js
new file mode 100644
index 0000000..ebf9bba
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/trim-end.js
@@ -0,0 +1,2 @@
+require('../../modules/es7.string.trim-right');
+module.exports = require('../../modules/_core').String.trimRight;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/trim-start.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/trim-start.js
new file mode 100644
index 0000000..af1b975
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/string/trim-start.js
@@ -0,0 +1,2 @@
+require('../../modules/es7.string.trim-left');
+module.exports = require('../../modules/_core').String.trimLeft;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/symbol/async-iterator.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/symbol/async-iterator.js
new file mode 100644
index 0000000..951ea8f
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/fn/symbol/async-iterator.js
@@ -0,0 +1,2 @@
+require('../../modules/es7.symbol.async-iterator');
+module.exports = require('../../modules/_wks-ext').f('asyncIterator');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/fn/global.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/fn/global.js
new file mode 100644
index 0000000..430b1e9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/fn/global.js
@@ -0,0 +1,2 @@
+require('../modules/es7.global');
+module.exports = require('../modules/_core').global;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_a-function.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_a-function.js
new file mode 100644
index 0000000..a9a5d84
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_a-function.js
@@ -0,0 +1,4 @@
+module.exports = function (it) {
+  if (typeof it != 'function') throw TypeError(it + ' is not a function!');
+  return it;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_an-object.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_an-object.js
new file mode 100644
index 0000000..b1c316c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_an-object.js
@@ -0,0 +1,5 @@
+var isObject = require('./_is-object');
+module.exports = function (it) {
+  if (!isObject(it)) throw TypeError(it + ' is not an object!');
+  return it;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_core.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_core.js
new file mode 100644
index 0000000..275d561
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_core.js
@@ -0,0 +1,2 @@
+var core = module.exports = { version: '2.6.12' };
+if (typeof __e == 'number') __e = core; // eslint-disable-line no-undef
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_ctx.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_ctx.js
new file mode 100644
index 0000000..0a100ff
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_ctx.js
@@ -0,0 +1,20 @@
+// optional / simple context binding
+var aFunction = require('./_a-function');
+module.exports = function (fn, that, length) {
+  aFunction(fn);
+  if (that === undefined) return fn;
+  switch (length) {
+    case 1: return function (a) {
+      return fn.call(that, a);
+    };
+    case 2: return function (a, b) {
+      return fn.call(that, a, b);
+    };
+    case 3: return function (a, b, c) {
+      return fn.call(that, a, b, c);
+    };
+  }
+  return function (/* ...args */) {
+    return fn.apply(that, arguments);
+  };
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_descriptors.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_descriptors.js
new file mode 100644
index 0000000..0469740
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_descriptors.js
@@ -0,0 +1,4 @@
+// Thank's IE8 for his funny defineProperty
+module.exports = !require('./_fails')(function () {
+  return Object.defineProperty({}, 'a', { get: function () { return 7; } }).a != 7;
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_dom-create.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_dom-create.js
new file mode 100644
index 0000000..39ca256
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_dom-create.js
@@ -0,0 +1,7 @@
+var isObject = require('./_is-object');
+var document = require('./_global').document;
+// typeof document.createElement is 'object' in old IE
+var is = isObject(document) && isObject(document.createElement);
+module.exports = function (it) {
+  return is ? document.createElement(it) : {};
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_export.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_export.js
new file mode 100644
index 0000000..02bddc0
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_export.js
@@ -0,0 +1,62 @@
+var global = require('./_global');
+var core = require('./_core');
+var ctx = require('./_ctx');
+var hide = require('./_hide');
+var has = require('./_has');
+var PROTOTYPE = 'prototype';
+
+var $export = function (type, name, source) {
+  var IS_FORCED = type & $export.F;
+  var IS_GLOBAL = type & $export.G;
+  var IS_STATIC = type & $export.S;
+  var IS_PROTO = type & $export.P;
+  var IS_BIND = type & $export.B;
+  var IS_WRAP = type & $export.W;
+  var exports = IS_GLOBAL ? core : core[name] || (core[name] = {});
+  var expProto = exports[PROTOTYPE];
+  var target = IS_GLOBAL ? global : IS_STATIC ? global[name] : (global[name] || {})[PROTOTYPE];
+  var key, own, out;
+  if (IS_GLOBAL) source = name;
+  for (key in source) {
+    // contains in native
+    own = !IS_FORCED && target && target[key] !== undefined;
+    if (own && has(exports, key)) continue;
+    // export native or passed
+    out = own ? target[key] : source[key];
+    // prevent global pollution for namespaces
+    exports[key] = IS_GLOBAL && typeof target[key] != 'function' ? source[key]
+    // bind timers to global for call from export context
+    : IS_BIND && own ? ctx(out, global)
+    // wrap global constructors for prevent change them in library
+    : IS_WRAP && target[key] == out ? (function (C) {
+      var F = function (a, b, c) {
+        if (this instanceof C) {
+          switch (arguments.length) {
+            case 0: return new C();
+            case 1: return new C(a);
+            case 2: return new C(a, b);
+          } return new C(a, b, c);
+        } return C.apply(this, arguments);
+      };
+      F[PROTOTYPE] = C[PROTOTYPE];
+      return F;
+    // make static versions for prototype methods
+    })(out) : IS_PROTO && typeof out == 'function' ? ctx(Function.call, out) : out;
+    // export proto methods to core.%CONSTRUCTOR%.methods.%NAME%
+    if (IS_PROTO) {
+      (exports.virtual || (exports.virtual = {}))[key] = out;
+      // export proto methods to core.%CONSTRUCTOR%.prototype.%NAME%
+      if (type & $export.R && expProto && !expProto[key]) hide(expProto, key, out);
+    }
+  }
+};
+// type bitmap
+$export.F = 1;   // forced
+$export.G = 2;   // global
+$export.S = 4;   // static
+$export.P = 8;   // proto
+$export.B = 16;  // bind
+$export.W = 32;  // wrap
+$export.U = 64;  // safe
+$export.R = 128; // real proto method for `library`
+module.exports = $export;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_fails.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_fails.js
new file mode 100644
index 0000000..3b4cdf6
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_fails.js
@@ -0,0 +1,7 @@
+module.exports = function (exec) {
+  try {
+    return !!exec();
+  } catch (e) {
+    return true;
+  }
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_global.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_global.js
new file mode 100644
index 0000000..bf85b44
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_global.js
@@ -0,0 +1,6 @@
+// https://github.com/zloirock/core-js/issues/86#issuecomment-115759028
+var global = module.exports = typeof window != 'undefined' && window.Math == Math
+  ? window : typeof self != 'undefined' && self.Math == Math ? self
+  // eslint-disable-next-line no-new-func
+  : Function('return this')();
+if (typeof __g == 'number') __g = global; // eslint-disable-line no-undef
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_has.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_has.js
new file mode 100644
index 0000000..2a37d8b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_has.js
@@ -0,0 +1,4 @@
+var hasOwnProperty = {}.hasOwnProperty;
+module.exports = function (it, key) {
+  return hasOwnProperty.call(it, key);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_hide.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_hide.js
new file mode 100644
index 0000000..cec258a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_hide.js
@@ -0,0 +1,8 @@
+var dP = require('./_object-dp');
+var createDesc = require('./_property-desc');
+module.exports = require('./_descriptors') ? function (object, key, value) {
+  return dP.f(object, key, createDesc(1, value));
+} : function (object, key, value) {
+  object[key] = value;
+  return object;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_ie8-dom-define.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_ie8-dom-define.js
new file mode 100644
index 0000000..a3805cb
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_ie8-dom-define.js
@@ -0,0 +1,3 @@
+module.exports = !require('./_descriptors') && !require('./_fails')(function () {
+  return Object.defineProperty(require('./_dom-create')('div'), 'a', { get: function () { return 7; } }).a != 7;
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_is-object.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_is-object.js
new file mode 100644
index 0000000..dda6e04
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_is-object.js
@@ -0,0 +1,3 @@
+module.exports = function (it) {
+  return typeof it === 'object' ? it !== null : typeof it === 'function';
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_object-dp.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_object-dp.js
new file mode 100644
index 0000000..0340a83
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_object-dp.js
@@ -0,0 +1,16 @@
+var anObject = require('./_an-object');
+var IE8_DOM_DEFINE = require('./_ie8-dom-define');
+var toPrimitive = require('./_to-primitive');
+var dP = Object.defineProperty;
+
+exports.f = require('./_descriptors') ? Object.defineProperty : function defineProperty(O, P, Attributes) {
+  anObject(O);
+  P = toPrimitive(P, true);
+  anObject(Attributes);
+  if (IE8_DOM_DEFINE) try {
+    return dP(O, P, Attributes);
+  } catch (e) { /* empty */ }
+  if ('get' in Attributes || 'set' in Attributes) throw TypeError('Accessors not supported!');
+  if ('value' in Attributes) O[P] = Attributes.value;
+  return O;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_property-desc.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_property-desc.js
new file mode 100644
index 0000000..0905934
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_property-desc.js
@@ -0,0 +1,8 @@
+module.exports = function (bitmap, value) {
+  return {
+    enumerable: !(bitmap & 1),
+    configurable: !(bitmap & 2),
+    writable: !(bitmap & 4),
+    value: value
+  };
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_to-primitive.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_to-primitive.js
new file mode 100644
index 0000000..de3dd6b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/_to-primitive.js
@@ -0,0 +1,12 @@
+// 7.1.1 ToPrimitive(input [, PreferredType])
+var isObject = require('./_is-object');
+// instead of the ES6 spec version, we didn't implement @@toPrimitive case
+// and the second argument - flag - preferred type is a string
+module.exports = function (it, S) {
+  if (!isObject(it)) return it;
+  var fn, val;
+  if (S && typeof (fn = it.toString) == 'function' && !isObject(val = fn.call(it))) return val;
+  if (typeof (fn = it.valueOf) == 'function' && !isObject(val = fn.call(it))) return val;
+  if (!S && typeof (fn = it.toString) == 'function' && !isObject(val = fn.call(it))) return val;
+  throw TypeError("Can't convert object to primitive value");
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/es7.global.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/es7.global.js
new file mode 100644
index 0000000..a315fd4
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/library/modules/es7.global.js
@@ -0,0 +1,4 @@
+// https://github.com/tc39/proposal-global
+var $export = require('./_export');
+
+$export($export.G, { global: require('./_global') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_a-function.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_a-function.js
new file mode 100644
index 0000000..a9a5d84
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_a-function.js
@@ -0,0 +1,4 @@
+module.exports = function (it) {
+  if (typeof it != 'function') throw TypeError(it + ' is not a function!');
+  return it;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_a-number-value.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_a-number-value.js
new file mode 100644
index 0000000..2723de4
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_a-number-value.js
@@ -0,0 +1,5 @@
+var cof = require('./_cof');
+module.exports = function (it, msg) {
+  if (typeof it != 'number' && cof(it) != 'Number') throw TypeError(msg);
+  return +it;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_add-to-unscopables.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_add-to-unscopables.js
new file mode 100644
index 0000000..a2dd97d
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_add-to-unscopables.js
@@ -0,0 +1,7 @@
+// 22.1.3.31 Array.prototype[@@unscopables]
+var UNSCOPABLES = require('./_wks')('unscopables');
+var ArrayProto = Array.prototype;
+if (ArrayProto[UNSCOPABLES] == undefined) require('./_hide')(ArrayProto, UNSCOPABLES, {});
+module.exports = function (key) {
+  ArrayProto[UNSCOPABLES][key] = true;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_advance-string-index.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_advance-string-index.js
new file mode 100644
index 0000000..a4688c1
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_advance-string-index.js
@@ -0,0 +1,8 @@
+'use strict';
+var at = require('./_string-at')(true);
+
+ // `AdvanceStringIndex` abstract operation
+// https://tc39.github.io/ecma262/#sec-advancestringindex
+module.exports = function (S, index, unicode) {
+  return index + (unicode ? at(S, index).length : 1);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_an-instance.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_an-instance.js
new file mode 100644
index 0000000..c0a5f92
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_an-instance.js
@@ -0,0 +1,5 @@
+module.exports = function (it, Constructor, name, forbiddenField) {
+  if (!(it instanceof Constructor) || (forbiddenField !== undefined && forbiddenField in it)) {
+    throw TypeError(name + ': incorrect invocation!');
+  } return it;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_an-object.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_an-object.js
new file mode 100644
index 0000000..b1c316c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_an-object.js
@@ -0,0 +1,5 @@
+var isObject = require('./_is-object');
+module.exports = function (it) {
+  if (!isObject(it)) throw TypeError(it + ' is not an object!');
+  return it;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-copy-within.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-copy-within.js
new file mode 100644
index 0000000..d331576
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-copy-within.js
@@ -0,0 +1,26 @@
+// 22.1.3.3 Array.prototype.copyWithin(target, start, end = this.length)
+'use strict';
+var toObject = require('./_to-object');
+var toAbsoluteIndex = require('./_to-absolute-index');
+var toLength = require('./_to-length');
+
+module.exports = [].copyWithin || function copyWithin(target /* = 0 */, start /* = 0, end = @length */) {
+  var O = toObject(this);
+  var len = toLength(O.length);
+  var to = toAbsoluteIndex(target, len);
+  var from = toAbsoluteIndex(start, len);
+  var end = arguments.length > 2 ? arguments[2] : undefined;
+  var count = Math.min((end === undefined ? len : toAbsoluteIndex(end, len)) - from, len - to);
+  var inc = 1;
+  if (from < to && to < from + count) {
+    inc = -1;
+    from += count - 1;
+    to += count - 1;
+  }
+  while (count-- > 0) {
+    if (from in O) O[to] = O[from];
+    else delete O[to];
+    to += inc;
+    from += inc;
+  } return O;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-fill.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-fill.js
new file mode 100644
index 0000000..0753c36
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-fill.js
@@ -0,0 +1,15 @@
+// 22.1.3.6 Array.prototype.fill(value, start = 0, end = this.length)
+'use strict';
+var toObject = require('./_to-object');
+var toAbsoluteIndex = require('./_to-absolute-index');
+var toLength = require('./_to-length');
+module.exports = function fill(value /* , start = 0, end = @length */) {
+  var O = toObject(this);
+  var length = toLength(O.length);
+  var aLen = arguments.length;
+  var index = toAbsoluteIndex(aLen > 1 ? arguments[1] : undefined, length);
+  var end = aLen > 2 ? arguments[2] : undefined;
+  var endPos = end === undefined ? length : toAbsoluteIndex(end, length);
+  while (endPos > index) O[index++] = value;
+  return O;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-includes.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-includes.js
new file mode 100644
index 0000000..0ef3efe
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-includes.js
@@ -0,0 +1,23 @@
+// false -> Array#indexOf
+// true  -> Array#includes
+var toIObject = require('./_to-iobject');
+var toLength = require('./_to-length');
+var toAbsoluteIndex = require('./_to-absolute-index');
+module.exports = function (IS_INCLUDES) {
+  return function ($this, el, fromIndex) {
+    var O = toIObject($this);
+    var length = toLength(O.length);
+    var index = toAbsoluteIndex(fromIndex, length);
+    var value;
+    // Array#includes uses SameValueZero equality algorithm
+    // eslint-disable-next-line no-self-compare
+    if (IS_INCLUDES && el != el) while (length > index) {
+      value = O[index++];
+      // eslint-disable-next-line no-self-compare
+      if (value != value) return true;
+    // Array#indexOf ignores holes, Array#includes - not
+    } else for (;length > index; index++) if (IS_INCLUDES || index in O) {
+      if (O[index] === el) return IS_INCLUDES || index || 0;
+    } return !IS_INCLUDES && -1;
+  };
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-methods.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-methods.js
new file mode 100644
index 0000000..ae7f447
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-methods.js
@@ -0,0 +1,44 @@
+// 0 -> Array#forEach
+// 1 -> Array#map
+// 2 -> Array#filter
+// 3 -> Array#some
+// 4 -> Array#every
+// 5 -> Array#find
+// 6 -> Array#findIndex
+var ctx = require('./_ctx');
+var IObject = require('./_iobject');
+var toObject = require('./_to-object');
+var toLength = require('./_to-length');
+var asc = require('./_array-species-create');
+module.exports = function (TYPE, $create) {
+  var IS_MAP = TYPE == 1;
+  var IS_FILTER = TYPE == 2;
+  var IS_SOME = TYPE == 3;
+  var IS_EVERY = TYPE == 4;
+  var IS_FIND_INDEX = TYPE == 6;
+  var NO_HOLES = TYPE == 5 || IS_FIND_INDEX;
+  var create = $create || asc;
+  return function ($this, callbackfn, that) {
+    var O = toObject($this);
+    var self = IObject(O);
+    var f = ctx(callbackfn, that, 3);
+    var length = toLength(self.length);
+    var index = 0;
+    var result = IS_MAP ? create($this, length) : IS_FILTER ? create($this, 0) : undefined;
+    var val, res;
+    for (;length > index; index++) if (NO_HOLES || index in self) {
+      val = self[index];
+      res = f(val, index, O);
+      if (TYPE) {
+        if (IS_MAP) result[index] = res;   // map
+        else if (res) switch (TYPE) {
+          case 3: return true;             // some
+          case 5: return val;              // find
+          case 6: return index;            // findIndex
+          case 2: result.push(val);        // filter
+        } else if (IS_EVERY) return false; // every
+      }
+    }
+    return IS_FIND_INDEX ? -1 : IS_SOME || IS_EVERY ? IS_EVERY : result;
+  };
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-reduce.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-reduce.js
new file mode 100644
index 0000000..8596ac7
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-reduce.js
@@ -0,0 +1,28 @@
+var aFunction = require('./_a-function');
+var toObject = require('./_to-object');
+var IObject = require('./_iobject');
+var toLength = require('./_to-length');
+
+module.exports = function (that, callbackfn, aLen, memo, isRight) {
+  aFunction(callbackfn);
+  var O = toObject(that);
+  var self = IObject(O);
+  var length = toLength(O.length);
+  var index = isRight ? length - 1 : 0;
+  var i = isRight ? -1 : 1;
+  if (aLen < 2) for (;;) {
+    if (index in self) {
+      memo = self[index];
+      index += i;
+      break;
+    }
+    index += i;
+    if (isRight ? index < 0 : length <= index) {
+      throw TypeError('Reduce of empty array with no initial value');
+    }
+  }
+  for (;isRight ? index >= 0 : length > index; index += i) if (index in self) {
+    memo = callbackfn(memo, self[index], index, O);
+  }
+  return memo;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-species-constructor.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-species-constructor.js
new file mode 100644
index 0000000..0771c23
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-species-constructor.js
@@ -0,0 +1,16 @@
+var isObject = require('./_is-object');
+var isArray = require('./_is-array');
+var SPECIES = require('./_wks')('species');
+
+module.exports = function (original) {
+  var C;
+  if (isArray(original)) {
+    C = original.constructor;
+    // cross-realm fallback
+    if (typeof C == 'function' && (C === Array || isArray(C.prototype))) C = undefined;
+    if (isObject(C)) {
+      C = C[SPECIES];
+      if (C === null) C = undefined;
+    }
+  } return C === undefined ? Array : C;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-species-create.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-species-create.js
new file mode 100644
index 0000000..36ed58b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_array-species-create.js
@@ -0,0 +1,6 @@
+// 9.4.2.3 ArraySpeciesCreate(originalArray, length)
+var speciesConstructor = require('./_array-species-constructor');
+
+module.exports = function (original, length) {
+  return new (speciesConstructor(original))(length);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_bind.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_bind.js
new file mode 100644
index 0000000..3cf1e5a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_bind.js
@@ -0,0 +1,25 @@
+'use strict';
+var aFunction = require('./_a-function');
+var isObject = require('./_is-object');
+var invoke = require('./_invoke');
+var arraySlice = [].slice;
+var factories = {};
+
+var construct = function (F, len, args) {
+  if (!(len in factories)) {
+    for (var n = [], i = 0; i < len; i++) n[i] = 'a[' + i + ']';
+    // eslint-disable-next-line no-new-func
+    factories[len] = Function('F,a', 'return new F(' + n.join(',') + ')');
+  } return factories[len](F, args);
+};
+
+module.exports = Function.bind || function bind(that /* , ...args */) {
+  var fn = aFunction(this);
+  var partArgs = arraySlice.call(arguments, 1);
+  var bound = function (/* args... */) {
+    var args = partArgs.concat(arraySlice.call(arguments));
+    return this instanceof bound ? construct(fn, args.length, args) : invoke(fn, args, that);
+  };
+  if (isObject(fn.prototype)) bound.prototype = fn.prototype;
+  return bound;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_classof.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_classof.js
new file mode 100644
index 0000000..d106d5b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_classof.js
@@ -0,0 +1,23 @@
+// getting tag from 19.1.3.6 Object.prototype.toString()
+var cof = require('./_cof');
+var TAG = require('./_wks')('toStringTag');
+// ES3 wrong here
+var ARG = cof(function () { return arguments; }()) == 'Arguments';
+
+// fallback for IE11 Script Access Denied error
+var tryGet = function (it, key) {
+  try {
+    return it[key];
+  } catch (e) { /* empty */ }
+};
+
+module.exports = function (it) {
+  var O, T, B;
+  return it === undefined ? 'Undefined' : it === null ? 'Null'
+    // @@toStringTag case
+    : typeof (T = tryGet(O = Object(it), TAG)) == 'string' ? T
+    // builtinTag case
+    : ARG ? cof(O)
+    // ES3 arguments fallback
+    : (B = cof(O)) == 'Object' && typeof O.callee == 'function' ? 'Arguments' : B;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_cof.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_cof.js
new file mode 100644
index 0000000..332c0bc
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_cof.js
@@ -0,0 +1,5 @@
+var toString = {}.toString;
+
+module.exports = function (it) {
+  return toString.call(it).slice(8, -1);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_collection-strong.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_collection-strong.js
new file mode 100644
index 0000000..68ce63f
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_collection-strong.js
@@ -0,0 +1,144 @@
+'use strict';
+var dP = require('./_object-dp').f;
+var create = require('./_object-create');
+var redefineAll = require('./_redefine-all');
+var ctx = require('./_ctx');
+var anInstance = require('./_an-instance');
+var forOf = require('./_for-of');
+var $iterDefine = require('./_iter-define');
+var step = require('./_iter-step');
+var setSpecies = require('./_set-species');
+var DESCRIPTORS = require('./_descriptors');
+var fastKey = require('./_meta').fastKey;
+var validate = require('./_validate-collection');
+var SIZE = DESCRIPTORS ? '_s' : 'size';
+
+var getEntry = function (that, key) {
+  // fast case
+  var index = fastKey(key);
+  var entry;
+  if (index !== 'F') return that._i[index];
+  // frozen object case
+  for (entry = that._f; entry; entry = entry.n) {
+    if (entry.k == key) return entry;
+  }
+};
+
+module.exports = {
+  getConstructor: function (wrapper, NAME, IS_MAP, ADDER) {
+    var C = wrapper(function (that, iterable) {
+      anInstance(that, C, NAME, '_i');
+      that._t = NAME;         // collection type
+      that._i = create(null); // index
+      that._f = undefined;    // first entry
+      that._l = undefined;    // last entry
+      that[SIZE] = 0;         // size
+      if (iterable != undefined) forOf(iterable, IS_MAP, that[ADDER], that);
+    });
+    redefineAll(C.prototype, {
+      // 23.1.3.1 Map.prototype.clear()
+      // 23.2.3.2 Set.prototype.clear()
+      clear: function clear() {
+        for (var that = validate(this, NAME), data = that._i, entry = that._f; entry; entry = entry.n) {
+          entry.r = true;
+          if (entry.p) entry.p = entry.p.n = undefined;
+          delete data[entry.i];
+        }
+        that._f = that._l = undefined;
+        that[SIZE] = 0;
+      },
+      // 23.1.3.3 Map.prototype.delete(key)
+      // 23.2.3.4 Set.prototype.delete(value)
+      'delete': function (key) {
+        var that = validate(this, NAME);
+        var entry = getEntry(that, key);
+        if (entry) {
+          var next = entry.n;
+          var prev = entry.p;
+          delete that._i[entry.i];
+          entry.r = true;
+          if (prev) prev.n = next;
+          if (next) next.p = prev;
+          if (that._f == entry) that._f = next;
+          if (that._l == entry) that._l = prev;
+          that[SIZE]--;
+        } return !!entry;
+      },
+      // 23.2.3.6 Set.prototype.forEach(callbackfn, thisArg = undefined)
+      // 23.1.3.5 Map.prototype.forEach(callbackfn, thisArg = undefined)
+      forEach: function forEach(callbackfn /* , that = undefined */) {
+        validate(this, NAME);
+        var f = ctx(callbackfn, arguments.length > 1 ? arguments[1] : undefined, 3);
+        var entry;
+        while (entry = entry ? entry.n : this._f) {
+          f(entry.v, entry.k, this);
+          // revert to the last existing entry
+          while (entry && entry.r) entry = entry.p;
+        }
+      },
+      // 23.1.3.7 Map.prototype.has(key)
+      // 23.2.3.7 Set.prototype.has(value)
+      has: function has(key) {
+        return !!getEntry(validate(this, NAME), key);
+      }
+    });
+    if (DESCRIPTORS) dP(C.prototype, 'size', {
+      get: function () {
+        return validate(this, NAME)[SIZE];
+      }
+    });
+    return C;
+  },
+  def: function (that, key, value) {
+    var entry = getEntry(that, key);
+    var prev, index;
+    // change existing entry
+    if (entry) {
+      entry.v = value;
+    // create new entry
+    } else {
+      that._l = entry = {
+        i: index = fastKey(key, true), // <- index
+        k: key,                        // <- key
+        v: value,                      // <- value
+        p: prev = that._l,             // <- previous entry
+        n: undefined,                  // <- next entry
+        r: false                       // <- removed
+      };
+      if (!that._f) that._f = entry;
+      if (prev) prev.n = entry;
+      that[SIZE]++;
+      // add to index
+      if (index !== 'F') that._i[index] = entry;
+    } return that;
+  },
+  getEntry: getEntry,
+  setStrong: function (C, NAME, IS_MAP) {
+    // add .keys, .values, .entries, [@@iterator]
+    // 23.1.3.4, 23.1.3.8, 23.1.3.11, 23.1.3.12, 23.2.3.5, 23.2.3.8, 23.2.3.10, 23.2.3.11
+    $iterDefine(C, NAME, function (iterated, kind) {
+      this._t = validate(iterated, NAME); // target
+      this._k = kind;                     // kind
+      this._l = undefined;                // previous
+    }, function () {
+      var that = this;
+      var kind = that._k;
+      var entry = that._l;
+      // revert to the last existing entry
+      while (entry && entry.r) entry = entry.p;
+      // get next entry
+      if (!that._t || !(that._l = entry = entry ? entry.n : that._t._f)) {
+        // or finish the iteration
+        that._t = undefined;
+        return step(1);
+      }
+      // return step by kind
+      if (kind == 'keys') return step(0, entry.k);
+      if (kind == 'values') return step(0, entry.v);
+      return step(0, [entry.k, entry.v]);
+    }, IS_MAP ? 'entries' : 'values', !IS_MAP, true);
+
+    // add [@@species], 23.1.2.2, 23.2.2.2
+    setSpecies(NAME);
+  }
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_collection-weak.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_collection-weak.js
new file mode 100644
index 0000000..04d3af5
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_collection-weak.js
@@ -0,0 +1,85 @@
+'use strict';
+var redefineAll = require('./_redefine-all');
+var getWeak = require('./_meta').getWeak;
+var anObject = require('./_an-object');
+var isObject = require('./_is-object');
+var anInstance = require('./_an-instance');
+var forOf = require('./_for-of');
+var createArrayMethod = require('./_array-methods');
+var $has = require('./_has');
+var validate = require('./_validate-collection');
+var arrayFind = createArrayMethod(5);
+var arrayFindIndex = createArrayMethod(6);
+var id = 0;
+
+// fallback for uncaught frozen keys
+var uncaughtFrozenStore = function (that) {
+  return that._l || (that._l = new UncaughtFrozenStore());
+};
+var UncaughtFrozenStore = function () {
+  this.a = [];
+};
+var findUncaughtFrozen = function (store, key) {
+  return arrayFind(store.a, function (it) {
+    return it[0] === key;
+  });
+};
+UncaughtFrozenStore.prototype = {
+  get: function (key) {
+    var entry = findUncaughtFrozen(this, key);
+    if (entry) return entry[1];
+  },
+  has: function (key) {
+    return !!findUncaughtFrozen(this, key);
+  },
+  set: function (key, value) {
+    var entry = findUncaughtFrozen(this, key);
+    if (entry) entry[1] = value;
+    else this.a.push([key, value]);
+  },
+  'delete': function (key) {
+    var index = arrayFindIndex(this.a, function (it) {
+      return it[0] === key;
+    });
+    if (~index) this.a.splice(index, 1);
+    return !!~index;
+  }
+};
+
+module.exports = {
+  getConstructor: function (wrapper, NAME, IS_MAP, ADDER) {
+    var C = wrapper(function (that, iterable) {
+      anInstance(that, C, NAME, '_i');
+      that._t = NAME;      // collection type
+      that._i = id++;      // collection id
+      that._l = undefined; // leak store for uncaught frozen objects
+      if (iterable != undefined) forOf(iterable, IS_MAP, that[ADDER], that);
+    });
+    redefineAll(C.prototype, {
+      // 23.3.3.2 WeakMap.prototype.delete(key)
+      // 23.4.3.3 WeakSet.prototype.delete(value)
+      'delete': function (key) {
+        if (!isObject(key)) return false;
+        var data = getWeak(key);
+        if (data === true) return uncaughtFrozenStore(validate(this, NAME))['delete'](key);
+        return data && $has(data, this._i) && delete data[this._i];
+      },
+      // 23.3.3.4 WeakMap.prototype.has(key)
+      // 23.4.3.4 WeakSet.prototype.has(value)
+      has: function has(key) {
+        if (!isObject(key)) return false;
+        var data = getWeak(key);
+        if (data === true) return uncaughtFrozenStore(validate(this, NAME)).has(key);
+        return data && $has(data, this._i);
+      }
+    });
+    return C;
+  },
+  def: function (that, key, value) {
+    var data = getWeak(anObject(key), true);
+    if (data === true) uncaughtFrozenStore(that).set(key, value);
+    else data[that._i] = value;
+    return that;
+  },
+  ufstore: uncaughtFrozenStore
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_collection.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_collection.js
new file mode 100644
index 0000000..767dde5
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_collection.js
@@ -0,0 +1,85 @@
+'use strict';
+var global = require('./_global');
+var $export = require('./_export');
+var redefine = require('./_redefine');
+var redefineAll = require('./_redefine-all');
+var meta = require('./_meta');
+var forOf = require('./_for-of');
+var anInstance = require('./_an-instance');
+var isObject = require('./_is-object');
+var fails = require('./_fails');
+var $iterDetect = require('./_iter-detect');
+var setToStringTag = require('./_set-to-string-tag');
+var inheritIfRequired = require('./_inherit-if-required');
+
+module.exports = function (NAME, wrapper, methods, common, IS_MAP, IS_WEAK) {
+  var Base = global[NAME];
+  var C = Base;
+  var ADDER = IS_MAP ? 'set' : 'add';
+  var proto = C && C.prototype;
+  var O = {};
+  var fixMethod = function (KEY) {
+    var fn = proto[KEY];
+    redefine(proto, KEY,
+      KEY == 'delete' ? function (a) {
+        return IS_WEAK && !isObject(a) ? false : fn.call(this, a === 0 ? 0 : a);
+      } : KEY == 'has' ? function has(a) {
+        return IS_WEAK && !isObject(a) ? false : fn.call(this, a === 0 ? 0 : a);
+      } : KEY == 'get' ? function get(a) {
+        return IS_WEAK && !isObject(a) ? undefined : fn.call(this, a === 0 ? 0 : a);
+      } : KEY == 'add' ? function add(a) { fn.call(this, a === 0 ? 0 : a); return this; }
+        : function set(a, b) { fn.call(this, a === 0 ? 0 : a, b); return this; }
+    );
+  };
+  if (typeof C != 'function' || !(IS_WEAK || proto.forEach && !fails(function () {
+    new C().entries().next();
+  }))) {
+    // create collection constructor
+    C = common.getConstructor(wrapper, NAME, IS_MAP, ADDER);
+    redefineAll(C.prototype, methods);
+    meta.NEED = true;
+  } else {
+    var instance = new C();
+    // early implementations not supports chaining
+    var HASNT_CHAINING = instance[ADDER](IS_WEAK ? {} : -0, 1) != instance;
+    // V8 ~  Chromium 40- weak-collections throws on primitives, but should return false
+    var THROWS_ON_PRIMITIVES = fails(function () { instance.has(1); });
+    // most early implementations doesn't supports iterables, most modern - not close it correctly
+    var ACCEPT_ITERABLES = $iterDetect(function (iter) { new C(iter); }); // eslint-disable-line no-new
+    // for early implementations -0 and +0 not the same
+    var BUGGY_ZERO = !IS_WEAK && fails(function () {
+      // V8 ~ Chromium 42- fails only with 5+ elements
+      var $instance = new C();
+      var index = 5;
+      while (index--) $instance[ADDER](index, index);
+      return !$instance.has(-0);
+    });
+    if (!ACCEPT_ITERABLES) {
+      C = wrapper(function (target, iterable) {
+        anInstance(target, C, NAME);
+        var that = inheritIfRequired(new Base(), target, C);
+        if (iterable != undefined) forOf(iterable, IS_MAP, that[ADDER], that);
+        return that;
+      });
+      C.prototype = proto;
+      proto.constructor = C;
+    }
+    if (THROWS_ON_PRIMITIVES || BUGGY_ZERO) {
+      fixMethod('delete');
+      fixMethod('has');
+      IS_MAP && fixMethod('get');
+    }
+    if (BUGGY_ZERO || HASNT_CHAINING) fixMethod(ADDER);
+    // weak collections should not contains .clear method
+    if (IS_WEAK && proto.clear) delete proto.clear;
+  }
+
+  setToStringTag(C, NAME);
+
+  O[NAME] = C;
+  $export($export.G + $export.W + $export.F * (C != Base), O);
+
+  if (!IS_WEAK) common.setStrong(C, NAME, IS_MAP);
+
+  return C;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_core.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_core.js
new file mode 100644
index 0000000..275d561
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_core.js
@@ -0,0 +1,2 @@
+var core = module.exports = { version: '2.6.12' };
+if (typeof __e == 'number') __e = core; // eslint-disable-line no-undef
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_create-property.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_create-property.js
new file mode 100644
index 0000000..fd0ea8c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_create-property.js
@@ -0,0 +1,8 @@
+'use strict';
+var $defineProperty = require('./_object-dp');
+var createDesc = require('./_property-desc');
+
+module.exports = function (object, index, value) {
+  if (index in object) $defineProperty.f(object, index, createDesc(0, value));
+  else object[index] = value;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_ctx.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_ctx.js
new file mode 100644
index 0000000..0a100ff
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_ctx.js
@@ -0,0 +1,20 @@
+// optional / simple context binding
+var aFunction = require('./_a-function');
+module.exports = function (fn, that, length) {
+  aFunction(fn);
+  if (that === undefined) return fn;
+  switch (length) {
+    case 1: return function (a) {
+      return fn.call(that, a);
+    };
+    case 2: return function (a, b) {
+      return fn.call(that, a, b);
+    };
+    case 3: return function (a, b, c) {
+      return fn.call(that, a, b, c);
+    };
+  }
+  return function (/* ...args */) {
+    return fn.apply(that, arguments);
+  };
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_date-to-iso-string.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_date-to-iso-string.js
new file mode 100644
index 0000000..95a02e2
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_date-to-iso-string.js
@@ -0,0 +1,26 @@
+'use strict';
+// 20.3.4.36 / 15.9.5.43 Date.prototype.toISOString()
+var fails = require('./_fails');
+var getTime = Date.prototype.getTime;
+var $toISOString = Date.prototype.toISOString;
+
+var lz = function (num) {
+  return num > 9 ? num : '0' + num;
+};
+
+// PhantomJS / old WebKit has a broken implementations
+module.exports = (fails(function () {
+  return $toISOString.call(new Date(-5e13 - 1)) != '0385-07-25T07:06:39.999Z';
+}) || !fails(function () {
+  $toISOString.call(new Date(NaN));
+})) ? function toISOString() {
+  if (!isFinite(getTime.call(this))) throw RangeError('Invalid time value');
+  var d = this;
+  var y = d.getUTCFullYear();
+  var m = d.getUTCMilliseconds();
+  var s = y < 0 ? '-' : y > 9999 ? '+' : '';
+  return s + ('00000' + Math.abs(y)).slice(s ? -6 : -4) +
+    '-' + lz(d.getUTCMonth() + 1) + '-' + lz(d.getUTCDate()) +
+    'T' + lz(d.getUTCHours()) + ':' + lz(d.getUTCMinutes()) +
+    ':' + lz(d.getUTCSeconds()) + '.' + (m > 99 ? m : '0' + lz(m)) + 'Z';
+} : $toISOString;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_date-to-primitive.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_date-to-primitive.js
new file mode 100644
index 0000000..57c3203
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_date-to-primitive.js
@@ -0,0 +1,9 @@
+'use strict';
+var anObject = require('./_an-object');
+var toPrimitive = require('./_to-primitive');
+var NUMBER = 'number';
+
+module.exports = function (hint) {
+  if (hint !== 'string' && hint !== NUMBER && hint !== 'default') throw TypeError('Incorrect hint');
+  return toPrimitive(anObject(this), hint != NUMBER);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_defined.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_defined.js
new file mode 100644
index 0000000..66c7ed3
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_defined.js
@@ -0,0 +1,5 @@
+// 7.2.1 RequireObjectCoercible(argument)
+module.exports = function (it) {
+  if (it == undefined) throw TypeError("Can't call method on  " + it);
+  return it;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_descriptors.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_descriptors.js
new file mode 100644
index 0000000..0469740
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_descriptors.js
@@ -0,0 +1,4 @@
+// Thank's IE8 for his funny defineProperty
+module.exports = !require('./_fails')(function () {
+  return Object.defineProperty({}, 'a', { get: function () { return 7; } }).a != 7;
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_dom-create.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_dom-create.js
new file mode 100644
index 0000000..39ca256
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_dom-create.js
@@ -0,0 +1,7 @@
+var isObject = require('./_is-object');
+var document = require('./_global').document;
+// typeof document.createElement is 'object' in old IE
+var is = isObject(document) && isObject(document.createElement);
+module.exports = function (it) {
+  return is ? document.createElement(it) : {};
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_enum-bug-keys.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_enum-bug-keys.js
new file mode 100644
index 0000000..d9ad855
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_enum-bug-keys.js
@@ -0,0 +1,4 @@
+// IE 8- don't enum bug keys
+module.exports = (
+  'constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf'
+).split(',');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_enum-keys.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_enum-keys.js
new file mode 100644
index 0000000..3e7053d
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_enum-keys.js
@@ -0,0 +1,15 @@
+// all enumerable object keys, includes symbols
+var getKeys = require('./_object-keys');
+var gOPS = require('./_object-gops');
+var pIE = require('./_object-pie');
+module.exports = function (it) {
+  var result = getKeys(it);
+  var getSymbols = gOPS.f;
+  if (getSymbols) {
+    var symbols = getSymbols(it);
+    var isEnum = pIE.f;
+    var i = 0;
+    var key;
+    while (symbols.length > i) if (isEnum.call(it, key = symbols[i++])) result.push(key);
+  } return result;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_export.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_export.js
new file mode 100644
index 0000000..3c907c6
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_export.js
@@ -0,0 +1,43 @@
+var global = require('./_global');
+var core = require('./_core');
+var hide = require('./_hide');
+var redefine = require('./_redefine');
+var ctx = require('./_ctx');
+var PROTOTYPE = 'prototype';
+
+var $export = function (type, name, source) {
+  var IS_FORCED = type & $export.F;
+  var IS_GLOBAL = type & $export.G;
+  var IS_STATIC = type & $export.S;
+  var IS_PROTO = type & $export.P;
+  var IS_BIND = type & $export.B;
+  var target = IS_GLOBAL ? global : IS_STATIC ? global[name] || (global[name] = {}) : (global[name] || {})[PROTOTYPE];
+  var exports = IS_GLOBAL ? core : core[name] || (core[name] = {});
+  var expProto = exports[PROTOTYPE] || (exports[PROTOTYPE] = {});
+  var key, own, out, exp;
+  if (IS_GLOBAL) source = name;
+  for (key in source) {
+    // contains in native
+    own = !IS_FORCED && target && target[key] !== undefined;
+    // export native or passed
+    out = (own ? target : source)[key];
+    // bind timers to global for call from export context
+    exp = IS_BIND && own ? ctx(out, global) : IS_PROTO && typeof out == 'function' ? ctx(Function.call, out) : out;
+    // extend global
+    if (target) redefine(target, key, out, type & $export.U);
+    // export
+    if (exports[key] != out) hide(exports, key, exp);
+    if (IS_PROTO && expProto[key] != out) expProto[key] = out;
+  }
+};
+global.core = core;
+// type bitmap
+$export.F = 1;   // forced
+$export.G = 2;   // global
+$export.S = 4;   // static
+$export.P = 8;   // proto
+$export.B = 16;  // bind
+$export.W = 32;  // wrap
+$export.U = 64;  // safe
+$export.R = 128; // real proto method for `library`
+module.exports = $export;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_fails-is-regexp.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_fails-is-regexp.js
new file mode 100644
index 0000000..8eec2e4
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_fails-is-regexp.js
@@ -0,0 +1,12 @@
+var MATCH = require('./_wks')('match');
+module.exports = function (KEY) {
+  var re = /./;
+  try {
+    '/./'[KEY](re);
+  } catch (e) {
+    try {
+      re[MATCH] = false;
+      return !'/./'[KEY](re);
+    } catch (f) { /* empty */ }
+  } return true;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_fails.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_fails.js
new file mode 100644
index 0000000..3b4cdf6
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_fails.js
@@ -0,0 +1,7 @@
+module.exports = function (exec) {
+  try {
+    return !!exec();
+  } catch (e) {
+    return true;
+  }
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_fix-re-wks.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_fix-re-wks.js
new file mode 100644
index 0000000..64d00fe
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_fix-re-wks.js
@@ -0,0 +1,96 @@
+'use strict';
+require('./es6.regexp.exec');
+var redefine = require('./_redefine');
+var hide = require('./_hide');
+var fails = require('./_fails');
+var defined = require('./_defined');
+var wks = require('./_wks');
+var regexpExec = require('./_regexp-exec');
+
+var SPECIES = wks('species');
+
+var REPLACE_SUPPORTS_NAMED_GROUPS = !fails(function () {
+  // #replace needs built-in support for named groups.
+  // #match works fine because it just return the exec results, even if it has
+  // a "grops" property.
+  var re = /./;
+  re.exec = function () {
+    var result = [];
+    result.groups = { a: '7' };
+    return result;
+  };
+  return ''.replace(re, '$<a>') !== '7';
+});
+
+var SPLIT_WORKS_WITH_OVERWRITTEN_EXEC = (function () {
+  // Chrome 51 has a buggy "split" implementation when RegExp#exec !== nativeExec
+  var re = /(?:)/;
+  var originalExec = re.exec;
+  re.exec = function () { return originalExec.apply(this, arguments); };
+  var result = 'ab'.split(re);
+  return result.length === 2 && result[0] === 'a' && result[1] === 'b';
+})();
+
+module.exports = function (KEY, length, exec) {
+  var SYMBOL = wks(KEY);
+
+  var DELEGATES_TO_SYMBOL = !fails(function () {
+    // String methods call symbol-named RegEp methods
+    var O = {};
+    O[SYMBOL] = function () { return 7; };
+    return ''[KEY](O) != 7;
+  });
+
+  var DELEGATES_TO_EXEC = DELEGATES_TO_SYMBOL ? !fails(function () {
+    // Symbol-named RegExp methods call .exec
+    var execCalled = false;
+    var re = /a/;
+    re.exec = function () { execCalled = true; return null; };
+    if (KEY === 'split') {
+      // RegExp[@@split] doesn't call the regex's exec method, but first creates
+      // a new one. We need to return the patched regex when creating the new one.
+      re.constructor = {};
+      re.constructor[SPECIES] = function () { return re; };
+    }
+    re[SYMBOL]('');
+    return !execCalled;
+  }) : undefined;
+
+  if (
+    !DELEGATES_TO_SYMBOL ||
+    !DELEGATES_TO_EXEC ||
+    (KEY === 'replace' && !REPLACE_SUPPORTS_NAMED_GROUPS) ||
+    (KEY === 'split' && !SPLIT_WORKS_WITH_OVERWRITTEN_EXEC)
+  ) {
+    var nativeRegExpMethod = /./[SYMBOL];
+    var fns = exec(
+      defined,
+      SYMBOL,
+      ''[KEY],
+      function maybeCallNative(nativeMethod, regexp, str, arg2, forceStringMethod) {
+        if (regexp.exec === regexpExec) {
+          if (DELEGATES_TO_SYMBOL && !forceStringMethod) {
+            // The native String method already delegates to @@method (this
+            // polyfilled function), leasing to infinite recursion.
+            // We avoid it by directly calling the native @@method method.
+            return { done: true, value: nativeRegExpMethod.call(regexp, str, arg2) };
+          }
+          return { done: true, value: nativeMethod.call(str, regexp, arg2) };
+        }
+        return { done: false };
+      }
+    );
+    var strfn = fns[0];
+    var rxfn = fns[1];
+
+    redefine(String.prototype, KEY, strfn);
+    hide(RegExp.prototype, SYMBOL, length == 2
+      // 21.2.5.8 RegExp.prototype[@@replace](string, replaceValue)
+      // 21.2.5.11 RegExp.prototype[@@split](string, limit)
+      ? function (string, arg) { return rxfn.call(string, this, arg); }
+      // 21.2.5.6 RegExp.prototype[@@match](string)
+      // 21.2.5.9 RegExp.prototype[@@search](string)
+      : function (string) { return rxfn.call(string, this); }
+    );
+  }
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_flags.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_flags.js
new file mode 100644
index 0000000..b6fc324
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_flags.js
@@ -0,0 +1,13 @@
+'use strict';
+// 21.2.5.3 get RegExp.prototype.flags
+var anObject = require('./_an-object');
+module.exports = function () {
+  var that = anObject(this);
+  var result = '';
+  if (that.global) result += 'g';
+  if (that.ignoreCase) result += 'i';
+  if (that.multiline) result += 'm';
+  if (that.unicode) result += 'u';
+  if (that.sticky) result += 'y';
+  return result;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_flatten-into-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_flatten-into-array.js
new file mode 100644
index 0000000..1838517
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_flatten-into-array.js
@@ -0,0 +1,39 @@
+'use strict';
+// https://tc39.github.io/proposal-flatMap/#sec-FlattenIntoArray
+var isArray = require('./_is-array');
+var isObject = require('./_is-object');
+var toLength = require('./_to-length');
+var ctx = require('./_ctx');
+var IS_CONCAT_SPREADABLE = require('./_wks')('isConcatSpreadable');
+
+function flattenIntoArray(target, original, source, sourceLen, start, depth, mapper, thisArg) {
+  var targetIndex = start;
+  var sourceIndex = 0;
+  var mapFn = mapper ? ctx(mapper, thisArg, 3) : false;
+  var element, spreadable;
+
+  while (sourceIndex < sourceLen) {
+    if (sourceIndex in source) {
+      element = mapFn ? mapFn(source[sourceIndex], sourceIndex, original) : source[sourceIndex];
+
+      spreadable = false;
+      if (isObject(element)) {
+        spreadable = element[IS_CONCAT_SPREADABLE];
+        spreadable = spreadable !== undefined ? !!spreadable : isArray(element);
+      }
+
+      if (spreadable && depth > 0) {
+        targetIndex = flattenIntoArray(target, original, element, toLength(element.length), targetIndex, depth - 1) - 1;
+      } else {
+        if (targetIndex >= 0x1fffffffffffff) throw TypeError();
+        target[targetIndex] = element;
+      }
+
+      targetIndex++;
+    }
+    sourceIndex++;
+  }
+  return targetIndex;
+}
+
+module.exports = flattenIntoArray;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_for-of.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_for-of.js
new file mode 100644
index 0000000..9ed2281
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_for-of.js
@@ -0,0 +1,25 @@
+var ctx = require('./_ctx');
+var call = require('./_iter-call');
+var isArrayIter = require('./_is-array-iter');
+var anObject = require('./_an-object');
+var toLength = require('./_to-length');
+var getIterFn = require('./core.get-iterator-method');
+var BREAK = {};
+var RETURN = {};
+var exports = module.exports = function (iterable, entries, fn, that, ITERATOR) {
+  var iterFn = ITERATOR ? function () { return iterable; } : getIterFn(iterable);
+  var f = ctx(fn, that, entries ? 2 : 1);
+  var index = 0;
+  var length, step, iterator, result;
+  if (typeof iterFn != 'function') throw TypeError(iterable + ' is not iterable!');
+  // fast case for arrays with default iterator
+  if (isArrayIter(iterFn)) for (length = toLength(iterable.length); length > index; index++) {
+    result = entries ? f(anObject(step = iterable[index])[0], step[1]) : f(iterable[index]);
+    if (result === BREAK || result === RETURN) return result;
+  } else for (iterator = iterFn.call(iterable); !(step = iterator.next()).done;) {
+    result = call(iterator, f, step.value, entries);
+    if (result === BREAK || result === RETURN) return result;
+  }
+};
+exports.BREAK = BREAK;
+exports.RETURN = RETURN;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_function-to-string.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_function-to-string.js
new file mode 100644
index 0000000..d7f5419
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_function-to-string.js
@@ -0,0 +1 @@
+module.exports = require('./_shared')('native-function-to-string', Function.toString);
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_global.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_global.js
new file mode 100644
index 0000000..bf85b44
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_global.js
@@ -0,0 +1,6 @@
+// https://github.com/zloirock/core-js/issues/86#issuecomment-115759028
+var global = module.exports = typeof window != 'undefined' && window.Math == Math
+  ? window : typeof self != 'undefined' && self.Math == Math ? self
+  // eslint-disable-next-line no-new-func
+  : Function('return this')();
+if (typeof __g == 'number') __g = global; // eslint-disable-line no-undef
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_has.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_has.js
new file mode 100644
index 0000000..2a37d8b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_has.js
@@ -0,0 +1,4 @@
+var hasOwnProperty = {}.hasOwnProperty;
+module.exports = function (it, key) {
+  return hasOwnProperty.call(it, key);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_hide.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_hide.js
new file mode 100644
index 0000000..cec258a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_hide.js
@@ -0,0 +1,8 @@
+var dP = require('./_object-dp');
+var createDesc = require('./_property-desc');
+module.exports = require('./_descriptors') ? function (object, key, value) {
+  return dP.f(object, key, createDesc(1, value));
+} : function (object, key, value) {
+  object[key] = value;
+  return object;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_html.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_html.js
new file mode 100644
index 0000000..7daff14
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_html.js
@@ -0,0 +1,2 @@
+var document = require('./_global').document;
+module.exports = document && document.documentElement;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_ie8-dom-define.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_ie8-dom-define.js
new file mode 100644
index 0000000..a3805cb
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_ie8-dom-define.js
@@ -0,0 +1,3 @@
+module.exports = !require('./_descriptors') && !require('./_fails')(function () {
+  return Object.defineProperty(require('./_dom-create')('div'), 'a', { get: function () { return 7; } }).a != 7;
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_inherit-if-required.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_inherit-if-required.js
new file mode 100644
index 0000000..b95fcd9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_inherit-if-required.js
@@ -0,0 +1,9 @@
+var isObject = require('./_is-object');
+var setPrototypeOf = require('./_set-proto').set;
+module.exports = function (that, target, C) {
+  var S = target.constructor;
+  var P;
+  if (S !== C && typeof S == 'function' && (P = S.prototype) !== C.prototype && isObject(P) && setPrototypeOf) {
+    setPrototypeOf(that, P);
+  } return that;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_invoke.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_invoke.js
new file mode 100644
index 0000000..6cccebd
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_invoke.js
@@ -0,0 +1,16 @@
+// fast apply, http://jsperf.lnkit.com/fast-apply/5
+module.exports = function (fn, args, that) {
+  var un = that === undefined;
+  switch (args.length) {
+    case 0: return un ? fn()
+                      : fn.call(that);
+    case 1: return un ? fn(args[0])
+                      : fn.call(that, args[0]);
+    case 2: return un ? fn(args[0], args[1])
+                      : fn.call(that, args[0], args[1]);
+    case 3: return un ? fn(args[0], args[1], args[2])
+                      : fn.call(that, args[0], args[1], args[2]);
+    case 4: return un ? fn(args[0], args[1], args[2], args[3])
+                      : fn.call(that, args[0], args[1], args[2], args[3]);
+  } return fn.apply(that, args);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iobject.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iobject.js
new file mode 100644
index 0000000..2b57c8a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iobject.js
@@ -0,0 +1,6 @@
+// fallback for non-array-like ES3 and non-enumerable old V8 strings
+var cof = require('./_cof');
+// eslint-disable-next-line no-prototype-builtins
+module.exports = Object('z').propertyIsEnumerable(0) ? Object : function (it) {
+  return cof(it) == 'String' ? it.split('') : Object(it);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-array-iter.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-array-iter.js
new file mode 100644
index 0000000..6f67d90
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-array-iter.js
@@ -0,0 +1,8 @@
+// check on default Array iterator
+var Iterators = require('./_iterators');
+var ITERATOR = require('./_wks')('iterator');
+var ArrayProto = Array.prototype;
+
+module.exports = function (it) {
+  return it !== undefined && (Iterators.Array === it || ArrayProto[ITERATOR] === it);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-array.js
new file mode 100644
index 0000000..0581dc2
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-array.js
@@ -0,0 +1,5 @@
+// 7.2.2 IsArray(argument)
+var cof = require('./_cof');
+module.exports = Array.isArray || function isArray(arg) {
+  return cof(arg) == 'Array';
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-integer.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-integer.js
new file mode 100644
index 0000000..0074ae9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-integer.js
@@ -0,0 +1,6 @@
+// 20.1.2.3 Number.isInteger(number)
+var isObject = require('./_is-object');
+var floor = Math.floor;
+module.exports = function isInteger(it) {
+  return !isObject(it) && isFinite(it) && floor(it) === it;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-object.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-object.js
new file mode 100644
index 0000000..dda6e04
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-object.js
@@ -0,0 +1,3 @@
+module.exports = function (it) {
+  return typeof it === 'object' ? it !== null : typeof it === 'function';
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-regexp.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-regexp.js
new file mode 100644
index 0000000..598d159
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_is-regexp.js
@@ -0,0 +1,8 @@
+// 7.2.8 IsRegExp(argument)
+var isObject = require('./_is-object');
+var cof = require('./_cof');
+var MATCH = require('./_wks')('match');
+module.exports = function (it) {
+  var isRegExp;
+  return isObject(it) && ((isRegExp = it[MATCH]) !== undefined ? !!isRegExp : cof(it) == 'RegExp');
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-call.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-call.js
new file mode 100644
index 0000000..a7026e3
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-call.js
@@ -0,0 +1,12 @@
+// call something on iterator step with safe closing on error
+var anObject = require('./_an-object');
+module.exports = function (iterator, fn, value, entries) {
+  try {
+    return entries ? fn(anObject(value)[0], value[1]) : fn(value);
+  // 7.4.6 IteratorClose(iterator, completion)
+  } catch (e) {
+    var ret = iterator['return'];
+    if (ret !== undefined) anObject(ret.call(iterator));
+    throw e;
+  }
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-create.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-create.js
new file mode 100644
index 0000000..04708c8
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-create.js
@@ -0,0 +1,13 @@
+'use strict';
+var create = require('./_object-create');
+var descriptor = require('./_property-desc');
+var setToStringTag = require('./_set-to-string-tag');
+var IteratorPrototype = {};
+
+// 25.1.2.1.1 %IteratorPrototype%[@@iterator]()
+require('./_hide')(IteratorPrototype, require('./_wks')('iterator'), function () { return this; });
+
+module.exports = function (Constructor, NAME, next) {
+  Constructor.prototype = create(IteratorPrototype, { next: descriptor(1, next) });
+  setToStringTag(Constructor, NAME + ' Iterator');
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-define.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-define.js
new file mode 100644
index 0000000..578dfb7
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-define.js
@@ -0,0 +1,69 @@
+'use strict';
+var LIBRARY = require('./_library');
+var $export = require('./_export');
+var redefine = require('./_redefine');
+var hide = require('./_hide');
+var Iterators = require('./_iterators');
+var $iterCreate = require('./_iter-create');
+var setToStringTag = require('./_set-to-string-tag');
+var getPrototypeOf = require('./_object-gpo');
+var ITERATOR = require('./_wks')('iterator');
+var BUGGY = !([].keys && 'next' in [].keys()); // Safari has buggy iterators w/o `next`
+var FF_ITERATOR = '@@iterator';
+var KEYS = 'keys';
+var VALUES = 'values';
+
+var returnThis = function () { return this; };
+
+module.exports = function (Base, NAME, Constructor, next, DEFAULT, IS_SET, FORCED) {
+  $iterCreate(Constructor, NAME, next);
+  var getMethod = function (kind) {
+    if (!BUGGY && kind in proto) return proto[kind];
+    switch (kind) {
+      case KEYS: return function keys() { return new Constructor(this, kind); };
+      case VALUES: return function values() { return new Constructor(this, kind); };
+    } return function entries() { return new Constructor(this, kind); };
+  };
+  var TAG = NAME + ' Iterator';
+  var DEF_VALUES = DEFAULT == VALUES;
+  var VALUES_BUG = false;
+  var proto = Base.prototype;
+  var $native = proto[ITERATOR] || proto[FF_ITERATOR] || DEFAULT && proto[DEFAULT];
+  var $default = $native || getMethod(DEFAULT);
+  var $entries = DEFAULT ? !DEF_VALUES ? $default : getMethod('entries') : undefined;
+  var $anyNative = NAME == 'Array' ? proto.entries || $native : $native;
+  var methods, key, IteratorPrototype;
+  // Fix native
+  if ($anyNative) {
+    IteratorPrototype = getPrototypeOf($anyNative.call(new Base()));
+    if (IteratorPrototype !== Object.prototype && IteratorPrototype.next) {
+      // Set @@toStringTag to native iterators
+      setToStringTag(IteratorPrototype, TAG, true);
+      // fix for some old engines
+      if (!LIBRARY && typeof IteratorPrototype[ITERATOR] != 'function') hide(IteratorPrototype, ITERATOR, returnThis);
+    }
+  }
+  // fix Array#{values, @@iterator}.name in V8 / FF
+  if (DEF_VALUES && $native && $native.name !== VALUES) {
+    VALUES_BUG = true;
+    $default = function values() { return $native.call(this); };
+  }
+  // Define iterator
+  if ((!LIBRARY || FORCED) && (BUGGY || VALUES_BUG || !proto[ITERATOR])) {
+    hide(proto, ITERATOR, $default);
+  }
+  // Plug for library
+  Iterators[NAME] = $default;
+  Iterators[TAG] = returnThis;
+  if (DEFAULT) {
+    methods = {
+      values: DEF_VALUES ? $default : getMethod(VALUES),
+      keys: IS_SET ? $default : getMethod(KEYS),
+      entries: $entries
+    };
+    if (FORCED) for (key in methods) {
+      if (!(key in proto)) redefine(proto, key, methods[key]);
+    } else $export($export.P + $export.F * (BUGGY || VALUES_BUG), NAME, methods);
+  }
+  return methods;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-detect.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-detect.js
new file mode 100644
index 0000000..5cb3497
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-detect.js
@@ -0,0 +1,22 @@
+var ITERATOR = require('./_wks')('iterator');
+var SAFE_CLOSING = false;
+
+try {
+  var riter = [7][ITERATOR]();
+  riter['return'] = function () { SAFE_CLOSING = true; };
+  // eslint-disable-next-line no-throw-literal
+  Array.from(riter, function () { throw 2; });
+} catch (e) { /* empty */ }
+
+module.exports = function (exec, skipClosing) {
+  if (!skipClosing && !SAFE_CLOSING) return false;
+  var safe = false;
+  try {
+    var arr = [7];
+    var iter = arr[ITERATOR]();
+    iter.next = function () { return { done: safe = true }; };
+    arr[ITERATOR] = function () { return iter; };
+    exec(arr);
+  } catch (e) { /* empty */ }
+  return safe;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-step.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-step.js
new file mode 100644
index 0000000..b0691c8
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iter-step.js
@@ -0,0 +1,3 @@
+module.exports = function (done, value) {
+  return { value: value, done: !!done };
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iterators.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iterators.js
new file mode 100644
index 0000000..f053ebf
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_iterators.js
@@ -0,0 +1 @@
+module.exports = {};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_library.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_library.js
new file mode 100644
index 0000000..a5d3020
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_library.js
@@ -0,0 +1 @@
+module.exports = false;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-expm1.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-expm1.js
new file mode 100644
index 0000000..75c6850
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-expm1.js
@@ -0,0 +1,10 @@
+// 20.2.2.14 Math.expm1(x)
+var $expm1 = Math.expm1;
+module.exports = (!$expm1
+  // Old FF bug
+  || $expm1(10) > 22025.465794806719 || $expm1(10) < 22025.4657948067165168
+  // Tor Browser bug
+  || $expm1(-2e-17) != -2e-17
+) ? function expm1(x) {
+  return (x = +x) == 0 ? x : x > -1e-6 && x < 1e-6 ? x + x * x / 2 : Math.exp(x) - 1;
+} : $expm1;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-fround.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-fround.js
new file mode 100644
index 0000000..c85eb4b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-fround.js
@@ -0,0 +1,23 @@
+// 20.2.2.16 Math.fround(x)
+var sign = require('./_math-sign');
+var pow = Math.pow;
+var EPSILON = pow(2, -52);
+var EPSILON32 = pow(2, -23);
+var MAX32 = pow(2, 127) * (2 - EPSILON32);
+var MIN32 = pow(2, -126);
+
+var roundTiesToEven = function (n) {
+  return n + 1 / EPSILON - 1 / EPSILON;
+};
+
+module.exports = Math.fround || function fround(x) {
+  var $abs = Math.abs(x);
+  var $sign = sign(x);
+  var a, result;
+  if ($abs < MIN32) return $sign * roundTiesToEven($abs / MIN32 / EPSILON32) * MIN32 * EPSILON32;
+  a = (1 + EPSILON32 / EPSILON) * $abs;
+  result = a - (a - $abs);
+  // eslint-disable-next-line no-self-compare
+  if (result > MAX32 || result != result) return $sign * Infinity;
+  return $sign * result;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-log1p.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-log1p.js
new file mode 100644
index 0000000..16d5f49
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-log1p.js
@@ -0,0 +1,4 @@
+// 20.2.2.20 Math.log1p(x)
+module.exports = Math.log1p || function log1p(x) {
+  return (x = +x) > -1e-8 && x < 1e-8 ? x - x * x / 2 : Math.log(1 + x);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-sign.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-sign.js
new file mode 100644
index 0000000..7a46b9d
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_math-sign.js
@@ -0,0 +1,5 @@
+// 20.2.2.28 Math.sign(x)
+module.exports = Math.sign || function sign(x) {
+  // eslint-disable-next-line no-self-compare
+  return (x = +x) == 0 || x != x ? x : x < 0 ? -1 : 1;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_meta.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_meta.js
new file mode 100644
index 0000000..2d4b325
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_meta.js
@@ -0,0 +1,53 @@
+var META = require('./_uid')('meta');
+var isObject = require('./_is-object');
+var has = require('./_has');
+var setDesc = require('./_object-dp').f;
+var id = 0;
+var isExtensible = Object.isExtensible || function () {
+  return true;
+};
+var FREEZE = !require('./_fails')(function () {
+  return isExtensible(Object.preventExtensions({}));
+});
+var setMeta = function (it) {
+  setDesc(it, META, { value: {
+    i: 'O' + ++id, // object ID
+    w: {}          // weak collections IDs
+  } });
+};
+var fastKey = function (it, create) {
+  // return primitive with prefix
+  if (!isObject(it)) return typeof it == 'symbol' ? it : (typeof it == 'string' ? 'S' : 'P') + it;
+  if (!has(it, META)) {
+    // can't set metadata to uncaught frozen object
+    if (!isExtensible(it)) return 'F';
+    // not necessary to add metadata
+    if (!create) return 'E';
+    // add missing metadata
+    setMeta(it);
+  // return object ID
+  } return it[META].i;
+};
+var getWeak = function (it, create) {
+  if (!has(it, META)) {
+    // can't set metadata to uncaught frozen object
+    if (!isExtensible(it)) return true;
+    // not necessary to add metadata
+    if (!create) return false;
+    // add missing metadata
+    setMeta(it);
+  // return hash weak collections IDs
+  } return it[META].w;
+};
+// add metadata on freeze-family methods calling
+var onFreeze = function (it) {
+  if (FREEZE && meta.NEED && isExtensible(it) && !has(it, META)) setMeta(it);
+  return it;
+};
+var meta = module.exports = {
+  KEY: META,
+  NEED: false,
+  fastKey: fastKey,
+  getWeak: getWeak,
+  onFreeze: onFreeze
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_microtask.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_microtask.js
new file mode 100644
index 0000000..b321c64
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_microtask.js
@@ -0,0 +1,69 @@
+var global = require('./_global');
+var macrotask = require('./_task').set;
+var Observer = global.MutationObserver || global.WebKitMutationObserver;
+var process = global.process;
+var Promise = global.Promise;
+var isNode = require('./_cof')(process) == 'process';
+
+module.exports = function () {
+  var head, last, notify;
+
+  var flush = function () {
+    var parent, fn;
+    if (isNode && (parent = process.domain)) parent.exit();
+    while (head) {
+      fn = head.fn;
+      head = head.next;
+      try {
+        fn();
+      } catch (e) {
+        if (head) notify();
+        else last = undefined;
+        throw e;
+      }
+    } last = undefined;
+    if (parent) parent.enter();
+  };
+
+  // Node.js
+  if (isNode) {
+    notify = function () {
+      process.nextTick(flush);
+    };
+  // browsers with MutationObserver, except iOS Safari - https://github.com/zloirock/core-js/issues/339
+  } else if (Observer && !(global.navigator && global.navigator.standalone)) {
+    var toggle = true;
+    var node = document.createTextNode('');
+    new Observer(flush).observe(node, { characterData: true }); // eslint-disable-line no-new
+    notify = function () {
+      node.data = toggle = !toggle;
+    };
+  // environments with maybe non-completely correct, but existent Promise
+  } else if (Promise && Promise.resolve) {
+    // Promise.resolve without an argument throws an error in LG WebOS 2
+    var promise = Promise.resolve(undefined);
+    notify = function () {
+      promise.then(flush);
+    };
+  // for other environments - macrotask based on:
+  // - setImmediate
+  // - MessageChannel
+  // - window.postMessag
+  // - onreadystatechange
+  // - setTimeout
+  } else {
+    notify = function () {
+      // strange IE + webpack dev server bug - use .call(global)
+      macrotask.call(global, flush);
+    };
+  }
+
+  return function (fn) {
+    var task = { fn: fn, next: undefined };
+    if (last) last.next = task;
+    if (!head) {
+      head = task;
+      notify();
+    } last = task;
+  };
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_new-promise-capability.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_new-promise-capability.js
new file mode 100644
index 0000000..82b74a3
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_new-promise-capability.js
@@ -0,0 +1,18 @@
+'use strict';
+// 25.4.1.5 NewPromiseCapability(C)
+var aFunction = require('./_a-function');
+
+function PromiseCapability(C) {
+  var resolve, reject;
+  this.promise = new C(function ($$resolve, $$reject) {
+    if (resolve !== undefined || reject !== undefined) throw TypeError('Bad Promise constructor');
+    resolve = $$resolve;
+    reject = $$reject;
+  });
+  this.resolve = aFunction(resolve);
+  this.reject = aFunction(reject);
+}
+
+module.exports.f = function (C) {
+  return new PromiseCapability(C);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-assign.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-assign.js
new file mode 100644
index 0000000..d739c43
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-assign.js
@@ -0,0 +1,38 @@
+'use strict';
+// 19.1.2.1 Object.assign(target, source, ...)
+var DESCRIPTORS = require('./_descriptors');
+var getKeys = require('./_object-keys');
+var gOPS = require('./_object-gops');
+var pIE = require('./_object-pie');
+var toObject = require('./_to-object');
+var IObject = require('./_iobject');
+var $assign = Object.assign;
+
+// should work with symbols and should have deterministic property order (V8 bug)
+module.exports = !$assign || require('./_fails')(function () {
+  var A = {};
+  var B = {};
+  // eslint-disable-next-line no-undef
+  var S = Symbol();
+  var K = 'abcdefghijklmnopqrst';
+  A[S] = 7;
+  K.split('').forEach(function (k) { B[k] = k; });
+  return $assign({}, A)[S] != 7 || Object.keys($assign({}, B)).join('') != K;
+}) ? function assign(target, source) { // eslint-disable-line no-unused-vars
+  var T = toObject(target);
+  var aLen = arguments.length;
+  var index = 1;
+  var getSymbols = gOPS.f;
+  var isEnum = pIE.f;
+  while (aLen > index) {
+    var S = IObject(arguments[index++]);
+    var keys = getSymbols ? getKeys(S).concat(getSymbols(S)) : getKeys(S);
+    var length = keys.length;
+    var j = 0;
+    var key;
+    while (length > j) {
+      key = keys[j++];
+      if (!DESCRIPTORS || isEnum.call(S, key)) T[key] = S[key];
+    }
+  } return T;
+} : $assign;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-create.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-create.js
new file mode 100644
index 0000000..a76808e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-create.js
@@ -0,0 +1,41 @@
+// 19.1.2.2 / 15.2.3.5 Object.create(O [, Properties])
+var anObject = require('./_an-object');
+var dPs = require('./_object-dps');
+var enumBugKeys = require('./_enum-bug-keys');
+var IE_PROTO = require('./_shared-key')('IE_PROTO');
+var Empty = function () { /* empty */ };
+var PROTOTYPE = 'prototype';
+
+// Create object with fake `null` prototype: use iframe Object with cleared prototype
+var createDict = function () {
+  // Thrash, waste and sodomy: IE GC bug
+  var iframe = require('./_dom-create')('iframe');
+  var i = enumBugKeys.length;
+  var lt = '<';
+  var gt = '>';
+  var iframeDocument;
+  iframe.style.display = 'none';
+  require('./_html').appendChild(iframe);
+  iframe.src = 'javascript:'; // eslint-disable-line no-script-url
+  // createDict = iframe.contentWindow.Object;
+  // html.removeChild(iframe);
+  iframeDocument = iframe.contentWindow.document;
+  iframeDocument.open();
+  iframeDocument.write(lt + 'script' + gt + 'document.F=Object' + lt + '/script' + gt);
+  iframeDocument.close();
+  createDict = iframeDocument.F;
+  while (i--) delete createDict[PROTOTYPE][enumBugKeys[i]];
+  return createDict();
+};
+
+module.exports = Object.create || function create(O, Properties) {
+  var result;
+  if (O !== null) {
+    Empty[PROTOTYPE] = anObject(O);
+    result = new Empty();
+    Empty[PROTOTYPE] = null;
+    // add "__proto__" for Object.getPrototypeOf polyfill
+    result[IE_PROTO] = O;
+  } else result = createDict();
+  return Properties === undefined ? result : dPs(result, Properties);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-dp.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-dp.js
new file mode 100644
index 0000000..0340a83
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-dp.js
@@ -0,0 +1,16 @@
+var anObject = require('./_an-object');
+var IE8_DOM_DEFINE = require('./_ie8-dom-define');
+var toPrimitive = require('./_to-primitive');
+var dP = Object.defineProperty;
+
+exports.f = require('./_descriptors') ? Object.defineProperty : function defineProperty(O, P, Attributes) {
+  anObject(O);
+  P = toPrimitive(P, true);
+  anObject(Attributes);
+  if (IE8_DOM_DEFINE) try {
+    return dP(O, P, Attributes);
+  } catch (e) { /* empty */ }
+  if ('get' in Attributes || 'set' in Attributes) throw TypeError('Accessors not supported!');
+  if ('value' in Attributes) O[P] = Attributes.value;
+  return O;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-dps.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-dps.js
new file mode 100644
index 0000000..173c338
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-dps.js
@@ -0,0 +1,13 @@
+var dP = require('./_object-dp');
+var anObject = require('./_an-object');
+var getKeys = require('./_object-keys');
+
+module.exports = require('./_descriptors') ? Object.defineProperties : function defineProperties(O, Properties) {
+  anObject(O);
+  var keys = getKeys(Properties);
+  var length = keys.length;
+  var i = 0;
+  var P;
+  while (length > i) dP.f(O, P = keys[i++], Properties[P]);
+  return O;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gopd.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gopd.js
new file mode 100644
index 0000000..555dd31
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gopd.js
@@ -0,0 +1,16 @@
+var pIE = require('./_object-pie');
+var createDesc = require('./_property-desc');
+var toIObject = require('./_to-iobject');
+var toPrimitive = require('./_to-primitive');
+var has = require('./_has');
+var IE8_DOM_DEFINE = require('./_ie8-dom-define');
+var gOPD = Object.getOwnPropertyDescriptor;
+
+exports.f = require('./_descriptors') ? gOPD : function getOwnPropertyDescriptor(O, P) {
+  O = toIObject(O);
+  P = toPrimitive(P, true);
+  if (IE8_DOM_DEFINE) try {
+    return gOPD(O, P);
+  } catch (e) { /* empty */ }
+  if (has(O, P)) return createDesc(!pIE.f.call(O, P), O[P]);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gopn-ext.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gopn-ext.js
new file mode 100644
index 0000000..4abb6ae
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gopn-ext.js
@@ -0,0 +1,19 @@
+// fallback for IE11 buggy Object.getOwnPropertyNames with iframe and window
+var toIObject = require('./_to-iobject');
+var gOPN = require('./_object-gopn').f;
+var toString = {}.toString;
+
+var windowNames = typeof window == 'object' && window && Object.getOwnPropertyNames
+  ? Object.getOwnPropertyNames(window) : [];
+
+var getWindowNames = function (it) {
+  try {
+    return gOPN(it);
+  } catch (e) {
+    return windowNames.slice();
+  }
+};
+
+module.exports.f = function getOwnPropertyNames(it) {
+  return windowNames && toString.call(it) == '[object Window]' ? getWindowNames(it) : gOPN(toIObject(it));
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gopn.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gopn.js
new file mode 100644
index 0000000..da82333
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gopn.js
@@ -0,0 +1,7 @@
+// 19.1.2.7 / 15.2.3.4 Object.getOwnPropertyNames(O)
+var $keys = require('./_object-keys-internal');
+var hiddenKeys = require('./_enum-bug-keys').concat('length', 'prototype');
+
+exports.f = Object.getOwnPropertyNames || function getOwnPropertyNames(O) {
+  return $keys(O, hiddenKeys);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gops.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gops.js
new file mode 100644
index 0000000..bc06729
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gops.js
@@ -0,0 +1 @@
+exports.f = Object.getOwnPropertySymbols;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gpo.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gpo.js
new file mode 100644
index 0000000..27f2a94
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-gpo.js
@@ -0,0 +1,13 @@
+// 19.1.2.9 / 15.2.3.2 Object.getPrototypeOf(O)
+var has = require('./_has');
+var toObject = require('./_to-object');
+var IE_PROTO = require('./_shared-key')('IE_PROTO');
+var ObjectProto = Object.prototype;
+
+module.exports = Object.getPrototypeOf || function (O) {
+  O = toObject(O);
+  if (has(O, IE_PROTO)) return O[IE_PROTO];
+  if (typeof O.constructor == 'function' && O instanceof O.constructor) {
+    return O.constructor.prototype;
+  } return O instanceof Object ? ObjectProto : null;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-keys-internal.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-keys-internal.js
new file mode 100644
index 0000000..71abdd1
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-keys-internal.js
@@ -0,0 +1,17 @@
+var has = require('./_has');
+var toIObject = require('./_to-iobject');
+var arrayIndexOf = require('./_array-includes')(false);
+var IE_PROTO = require('./_shared-key')('IE_PROTO');
+
+module.exports = function (object, names) {
+  var O = toIObject(object);
+  var i = 0;
+  var result = [];
+  var key;
+  for (key in O) if (key != IE_PROTO) has(O, key) && result.push(key);
+  // Don't enum bug & hidden keys
+  while (names.length > i) if (has(O, key = names[i++])) {
+    ~arrayIndexOf(result, key) || result.push(key);
+  }
+  return result;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-keys.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-keys.js
new file mode 100644
index 0000000..62f73f9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-keys.js
@@ -0,0 +1,7 @@
+// 19.1.2.14 / 15.2.3.14 Object.keys(O)
+var $keys = require('./_object-keys-internal');
+var enumBugKeys = require('./_enum-bug-keys');
+
+module.exports = Object.keys || function keys(O) {
+  return $keys(O, enumBugKeys);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-pie.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-pie.js
new file mode 100644
index 0000000..4cc7107
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-pie.js
@@ -0,0 +1 @@
+exports.f = {}.propertyIsEnumerable;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-sap.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-sap.js
new file mode 100644
index 0000000..643535e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-sap.js
@@ -0,0 +1,10 @@
+// most Object methods by ES6 should accept primitives
+var $export = require('./_export');
+var core = require('./_core');
+var fails = require('./_fails');
+module.exports = function (KEY, exec) {
+  var fn = (core.Object || {})[KEY] || Object[KEY];
+  var exp = {};
+  exp[KEY] = exec(fn);
+  $export($export.S + $export.F * fails(function () { fn(1); }), 'Object', exp);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-to-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-to-array.js
new file mode 100644
index 0000000..288b5fc
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_object-to-array.js
@@ -0,0 +1,21 @@
+var DESCRIPTORS = require('./_descriptors');
+var getKeys = require('./_object-keys');
+var toIObject = require('./_to-iobject');
+var isEnum = require('./_object-pie').f;
+module.exports = function (isEntries) {
+  return function (it) {
+    var O = toIObject(it);
+    var keys = getKeys(O);
+    var length = keys.length;
+    var i = 0;
+    var result = [];
+    var key;
+    while (length > i) {
+      key = keys[i++];
+      if (!DESCRIPTORS || isEnum.call(O, key)) {
+        result.push(isEntries ? [key, O[key]] : O[key]);
+      }
+    }
+    return result;
+  };
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_own-keys.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_own-keys.js
new file mode 100644
index 0000000..84faece
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_own-keys.js
@@ -0,0 +1,10 @@
+// all object keys, includes non-enumerable and symbols
+var gOPN = require('./_object-gopn');
+var gOPS = require('./_object-gops');
+var anObject = require('./_an-object');
+var Reflect = require('./_global').Reflect;
+module.exports = Reflect && Reflect.ownKeys || function ownKeys(it) {
+  var keys = gOPN.f(anObject(it));
+  var getSymbols = gOPS.f;
+  return getSymbols ? keys.concat(getSymbols(it)) : keys;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_parse-float.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_parse-float.js
new file mode 100644
index 0000000..acfb350
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_parse-float.js
@@ -0,0 +1,8 @@
+var $parseFloat = require('./_global').parseFloat;
+var $trim = require('./_string-trim').trim;
+
+module.exports = 1 / $parseFloat(require('./_string-ws') + '-0') !== -Infinity ? function parseFloat(str) {
+  var string = $trim(String(str), 3);
+  var result = $parseFloat(string);
+  return result === 0 && string.charAt(0) == '-' ? -0 : result;
+} : $parseFloat;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_parse-int.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_parse-int.js
new file mode 100644
index 0000000..ddd7172
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_parse-int.js
@@ -0,0 +1,9 @@
+var $parseInt = require('./_global').parseInt;
+var $trim = require('./_string-trim').trim;
+var ws = require('./_string-ws');
+var hex = /^[-+]?0[xX]/;
+
+module.exports = $parseInt(ws + '08') !== 8 || $parseInt(ws + '0x16') !== 22 ? function parseInt(str, radix) {
+  var string = $trim(String(str), 3);
+  return $parseInt(string, (radix >>> 0) || (hex.test(string) ? 16 : 10));
+} : $parseInt;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_perform.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_perform.js
new file mode 100644
index 0000000..bfc7b29
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_perform.js
@@ -0,0 +1,7 @@
+module.exports = function (exec) {
+  try {
+    return { e: false, v: exec() };
+  } catch (e) {
+    return { e: true, v: e };
+  }
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_promise-resolve.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_promise-resolve.js
new file mode 100644
index 0000000..c3cac76
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_promise-resolve.js
@@ -0,0 +1,12 @@
+var anObject = require('./_an-object');
+var isObject = require('./_is-object');
+var newPromiseCapability = require('./_new-promise-capability');
+
+module.exports = function (C, x) {
+  anObject(C);
+  if (isObject(x) && x.constructor === C) return x;
+  var promiseCapability = newPromiseCapability.f(C);
+  var resolve = promiseCapability.resolve;
+  resolve(x);
+  return promiseCapability.promise;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_property-desc.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_property-desc.js
new file mode 100644
index 0000000..0905934
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_property-desc.js
@@ -0,0 +1,8 @@
+module.exports = function (bitmap, value) {
+  return {
+    enumerable: !(bitmap & 1),
+    configurable: !(bitmap & 2),
+    writable: !(bitmap & 4),
+    value: value
+  };
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_redefine-all.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_redefine-all.js
new file mode 100644
index 0000000..dcf7944
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_redefine-all.js
@@ -0,0 +1,5 @@
+var redefine = require('./_redefine');
+module.exports = function (target, src, safe) {
+  for (var key in src) redefine(target, key, src[key], safe);
+  return target;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_redefine.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_redefine.js
new file mode 100644
index 0000000..442ea61
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_redefine.js
@@ -0,0 +1,31 @@
+var global = require('./_global');
+var hide = require('./_hide');
+var has = require('./_has');
+var SRC = require('./_uid')('src');
+var $toString = require('./_function-to-string');
+var TO_STRING = 'toString';
+var TPL = ('' + $toString).split(TO_STRING);
+
+require('./_core').inspectSource = function (it) {
+  return $toString.call(it);
+};
+
+(module.exports = function (O, key, val, safe) {
+  var isFunction = typeof val == 'function';
+  if (isFunction) has(val, 'name') || hide(val, 'name', key);
+  if (O[key] === val) return;
+  if (isFunction) has(val, SRC) || hide(val, SRC, O[key] ? '' + O[key] : TPL.join(String(key)));
+  if (O === global) {
+    O[key] = val;
+  } else if (!safe) {
+    delete O[key];
+    hide(O, key, val);
+  } else if (O[key]) {
+    O[key] = val;
+  } else {
+    hide(O, key, val);
+  }
+// add fake Function#toString for correct work wrapped methods / constructors with methods like LoDash isNative
+})(Function.prototype, TO_STRING, function toString() {
+  return typeof this == 'function' && this[SRC] || $toString.call(this);
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_regexp-exec-abstract.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_regexp-exec-abstract.js
new file mode 100644
index 0000000..b722aad
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_regexp-exec-abstract.js
@@ -0,0 +1,21 @@
+'use strict';
+
+var classof = require('./_classof');
+var builtinExec = RegExp.prototype.exec;
+
+ // `RegExpExec` abstract operation
+// https://tc39.github.io/ecma262/#sec-regexpexec
+module.exports = function (R, S) {
+  var exec = R.exec;
+  if (typeof exec === 'function') {
+    var result = exec.call(R, S);
+    if (typeof result !== 'object') {
+      throw new TypeError('RegExp exec method returned something other than an Object or null');
+    }
+    return result;
+  }
+  if (classof(R) !== 'RegExp') {
+    throw new TypeError('RegExp#exec called on incompatible receiver');
+  }
+  return builtinExec.call(R, S);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_regexp-exec.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_regexp-exec.js
new file mode 100644
index 0000000..f88bfe9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_regexp-exec.js
@@ -0,0 +1,58 @@
+'use strict';
+
+var regexpFlags = require('./_flags');
+
+var nativeExec = RegExp.prototype.exec;
+// This always refers to the native implementation, because the
+// String#replace polyfill uses ./fix-regexp-well-known-symbol-logic.js,
+// which loads this file before patching the method.
+var nativeReplace = String.prototype.replace;
+
+var patchedExec = nativeExec;
+
+var LAST_INDEX = 'lastIndex';
+
+var UPDATES_LAST_INDEX_WRONG = (function () {
+  var re1 = /a/,
+      re2 = /b*/g;
+  nativeExec.call(re1, 'a');
+  nativeExec.call(re2, 'a');
+  return re1[LAST_INDEX] !== 0 || re2[LAST_INDEX] !== 0;
+})();
+
+// nonparticipating capturing group, copied from es5-shim's String#split patch.
+var NPCG_INCLUDED = /()??/.exec('')[1] !== undefined;
+
+var PATCH = UPDATES_LAST_INDEX_WRONG || NPCG_INCLUDED;
+
+if (PATCH) {
+  patchedExec = function exec(str) {
+    var re = this;
+    var lastIndex, reCopy, match, i;
+
+    if (NPCG_INCLUDED) {
+      reCopy = new RegExp('^' + re.source + '$(?!\\s)', regexpFlags.call(re));
+    }
+    if (UPDATES_LAST_INDEX_WRONG) lastIndex = re[LAST_INDEX];
+
+    match = nativeExec.call(re, str);
+
+    if (UPDATES_LAST_INDEX_WRONG && match) {
+      re[LAST_INDEX] = re.global ? match.index + match[0].length : lastIndex;
+    }
+    if (NPCG_INCLUDED && match && match.length > 1) {
+      // Fix browsers whose `exec` methods don't consistently return `undefined`
+      // for NPCG, like IE8. NOTE: This doesn' work for /(.?)?/
+      // eslint-disable-next-line no-loop-func
+      nativeReplace.call(match[0], reCopy, function () {
+        for (i = 1; i < arguments.length - 2; i++) {
+          if (arguments[i] === undefined) match[i] = undefined;
+        }
+      });
+    }
+
+    return match;
+  };
+}
+
+module.exports = patchedExec;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_same-value.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_same-value.js
new file mode 100644
index 0000000..c6d045e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_same-value.js
@@ -0,0 +1,5 @@
+// 7.2.9 SameValue(x, y)
+module.exports = Object.is || function is(x, y) {
+  // eslint-disable-next-line no-self-compare
+  return x === y ? x !== 0 || 1 / x === 1 / y : x != x && y != y;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_set-proto.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_set-proto.js
new file mode 100644
index 0000000..c199062
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_set-proto.js
@@ -0,0 +1,25 @@
+// Works with __proto__ only. Old v8 can't work with null proto objects.
+/* eslint-disable no-proto */
+var isObject = require('./_is-object');
+var anObject = require('./_an-object');
+var check = function (O, proto) {
+  anObject(O);
+  if (!isObject(proto) && proto !== null) throw TypeError(proto + ": can't set as prototype!");
+};
+module.exports = {
+  set: Object.setPrototypeOf || ('__proto__' in {} ? // eslint-disable-line
+    function (test, buggy, set) {
+      try {
+        set = require('./_ctx')(Function.call, require('./_object-gopd').f(Object.prototype, '__proto__').set, 2);
+        set(test, []);
+        buggy = !(test instanceof Array);
+      } catch (e) { buggy = true; }
+      return function setPrototypeOf(O, proto) {
+        check(O, proto);
+        if (buggy) O.__proto__ = proto;
+        else set(O, proto);
+        return O;
+      };
+    }({}, false) : undefined),
+  check: check
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_set-species.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_set-species.js
new file mode 100644
index 0000000..2d505d2
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_set-species.js
@@ -0,0 +1,13 @@
+'use strict';
+var global = require('./_global');
+var dP = require('./_object-dp');
+var DESCRIPTORS = require('./_descriptors');
+var SPECIES = require('./_wks')('species');
+
+module.exports = function (KEY) {
+  var C = global[KEY];
+  if (DESCRIPTORS && C && !C[SPECIES]) dP.f(C, SPECIES, {
+    configurable: true,
+    get: function () { return this; }
+  });
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_set-to-string-tag.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_set-to-string-tag.js
new file mode 100644
index 0000000..5bd6414
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_set-to-string-tag.js
@@ -0,0 +1,7 @@
+var def = require('./_object-dp').f;
+var has = require('./_has');
+var TAG = require('./_wks')('toStringTag');
+
+module.exports = function (it, tag, stat) {
+  if (it && !has(it = stat ? it : it.prototype, TAG)) def(it, TAG, { configurable: true, value: tag });
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_shared-key.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_shared-key.js
new file mode 100644
index 0000000..d47fe7a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_shared-key.js
@@ -0,0 +1,5 @@
+var shared = require('./_shared')('keys');
+var uid = require('./_uid');
+module.exports = function (key) {
+  return shared[key] || (shared[key] = uid(key));
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_shared.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_shared.js
new file mode 100644
index 0000000..49bc187
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_shared.js
@@ -0,0 +1,12 @@
+var core = require('./_core');
+var global = require('./_global');
+var SHARED = '__core-js_shared__';
+var store = global[SHARED] || (global[SHARED] = {});
+
+(module.exports = function (key, value) {
+  return store[key] || (store[key] = value !== undefined ? value : {});
+})('versions', []).push({
+  version: core.version,
+  mode: require('./_library') ? 'pure' : 'global',
+  copyright: '© 2020 Denis Pushkarev (zloirock.ru)'
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_species-constructor.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_species-constructor.js
new file mode 100644
index 0000000..0cb4ffb
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_species-constructor.js
@@ -0,0 +1,9 @@
+// 7.3.20 SpeciesConstructor(O, defaultConstructor)
+var anObject = require('./_an-object');
+var aFunction = require('./_a-function');
+var SPECIES = require('./_wks')('species');
+module.exports = function (O, D) {
+  var C = anObject(O).constructor;
+  var S;
+  return C === undefined || (S = anObject(C)[SPECIES]) == undefined ? D : aFunction(S);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_strict-method.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_strict-method.js
new file mode 100644
index 0000000..e68f41b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_strict-method.js
@@ -0,0 +1,9 @@
+'use strict';
+var fails = require('./_fails');
+
+module.exports = function (method, arg) {
+  return !!method && fails(function () {
+    // eslint-disable-next-line no-useless-call
+    arg ? method.call(null, function () { /* empty */ }, 1) : method.call(null);
+  });
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-at.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-at.js
new file mode 100644
index 0000000..88d66bd
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-at.js
@@ -0,0 +1,17 @@
+var toInteger = require('./_to-integer');
+var defined = require('./_defined');
+// true  -> String#at
+// false -> String#codePointAt
+module.exports = function (TO_STRING) {
+  return function (that, pos) {
+    var s = String(defined(that));
+    var i = toInteger(pos);
+    var l = s.length;
+    var a, b;
+    if (i < 0 || i >= l) return TO_STRING ? '' : undefined;
+    a = s.charCodeAt(i);
+    return a < 0xd800 || a > 0xdbff || i + 1 === l || (b = s.charCodeAt(i + 1)) < 0xdc00 || b > 0xdfff
+      ? TO_STRING ? s.charAt(i) : a
+      : TO_STRING ? s.slice(i, i + 2) : (a - 0xd800 << 10) + (b - 0xdc00) + 0x10000;
+  };
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-context.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-context.js
new file mode 100644
index 0000000..becf3fb
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-context.js
@@ -0,0 +1,8 @@
+// helper for String#{startsWith, endsWith, includes}
+var isRegExp = require('./_is-regexp');
+var defined = require('./_defined');
+
+module.exports = function (that, searchString, NAME) {
+  if (isRegExp(searchString)) throw TypeError('String#' + NAME + " doesn't accept regex!");
+  return String(defined(that));
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-html.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-html.js
new file mode 100644
index 0000000..1dcc95b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-html.js
@@ -0,0 +1,19 @@
+var $export = require('./_export');
+var fails = require('./_fails');
+var defined = require('./_defined');
+var quot = /"/g;
+// B.2.3.2.1 CreateHTML(string, tag, attribute, value)
+var createHTML = function (string, tag, attribute, value) {
+  var S = String(defined(string));
+  var p1 = '<' + tag;
+  if (attribute !== '') p1 += ' ' + attribute + '="' + String(value).replace(quot, '&quot;') + '"';
+  return p1 + '>' + S + '</' + tag + '>';
+};
+module.exports = function (NAME, exec) {
+  var O = {};
+  O[NAME] = exec(createHTML);
+  $export($export.P + $export.F * fails(function () {
+    var test = ''[NAME]('"');
+    return test !== test.toLowerCase() || test.split('"').length > 3;
+  }), 'String', O);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-pad.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-pad.js
new file mode 100644
index 0000000..ceb6077
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-pad.js
@@ -0,0 +1,16 @@
+// https://github.com/tc39/proposal-string-pad-start-end
+var toLength = require('./_to-length');
+var repeat = require('./_string-repeat');
+var defined = require('./_defined');
+
+module.exports = function (that, maxLength, fillString, left) {
+  var S = String(defined(that));
+  var stringLength = S.length;
+  var fillStr = fillString === undefined ? ' ' : String(fillString);
+  var intMaxLength = toLength(maxLength);
+  if (intMaxLength <= stringLength || fillStr == '') return S;
+  var fillLen = intMaxLength - stringLength;
+  var stringFiller = repeat.call(fillStr, Math.ceil(fillLen / fillStr.length));
+  if (stringFiller.length > fillLen) stringFiller = stringFiller.slice(0, fillLen);
+  return left ? stringFiller + S : S + stringFiller;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-repeat.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-repeat.js
new file mode 100644
index 0000000..a69b962
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-repeat.js
@@ -0,0 +1,12 @@
+'use strict';
+var toInteger = require('./_to-integer');
+var defined = require('./_defined');
+
+module.exports = function repeat(count) {
+  var str = String(defined(this));
+  var res = '';
+  var n = toInteger(count);
+  if (n < 0 || n == Infinity) throw RangeError("Count can't be negative");
+  for (;n > 0; (n >>>= 1) && (str += str)) if (n & 1) res += str;
+  return res;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-trim.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-trim.js
new file mode 100644
index 0000000..6b54a81
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-trim.js
@@ -0,0 +1,30 @@
+var $export = require('./_export');
+var defined = require('./_defined');
+var fails = require('./_fails');
+var spaces = require('./_string-ws');
+var space = '[' + spaces + ']';
+var non = '\u200b\u0085';
+var ltrim = RegExp('^' + space + space + '*');
+var rtrim = RegExp(space + space + '*$');
+
+var exporter = function (KEY, exec, ALIAS) {
+  var exp = {};
+  var FORCE = fails(function () {
+    return !!spaces[KEY]() || non[KEY]() != non;
+  });
+  var fn = exp[KEY] = FORCE ? exec(trim) : spaces[KEY];
+  if (ALIAS) exp[ALIAS] = fn;
+  $export($export.P + $export.F * FORCE, 'String', exp);
+};
+
+// 1 -> String#trimLeft
+// 2 -> String#trimRight
+// 3 -> String#trim
+var trim = exporter.trim = function (string, TYPE) {
+  string = String(defined(string));
+  if (TYPE & 1) string = string.replace(ltrim, '');
+  if (TYPE & 2) string = string.replace(rtrim, '');
+  return string;
+};
+
+module.exports = exporter;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-ws.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-ws.js
new file mode 100644
index 0000000..2c68cf9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_string-ws.js
@@ -0,0 +1,2 @@
+module.exports = '\x09\x0A\x0B\x0C\x0D\x20\xA0\u1680\u180E\u2000\u2001\u2002\u2003' +
+  '\u2004\u2005\u2006\u2007\u2008\u2009\u200A\u202F\u205F\u3000\u2028\u2029\uFEFF';
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_task.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_task.js
new file mode 100644
index 0000000..8777a6e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_task.js
@@ -0,0 +1,84 @@
+var ctx = require('./_ctx');
+var invoke = require('./_invoke');
+var html = require('./_html');
+var cel = require('./_dom-create');
+var global = require('./_global');
+var process = global.process;
+var setTask = global.setImmediate;
+var clearTask = global.clearImmediate;
+var MessageChannel = global.MessageChannel;
+var Dispatch = global.Dispatch;
+var counter = 0;
+var queue = {};
+var ONREADYSTATECHANGE = 'onreadystatechange';
+var defer, channel, port;
+var run = function () {
+  var id = +this;
+  // eslint-disable-next-line no-prototype-builtins
+  if (queue.hasOwnProperty(id)) {
+    var fn = queue[id];
+    delete queue[id];
+    fn();
+  }
+};
+var listener = function (event) {
+  run.call(event.data);
+};
+// Node.js 0.9+ & IE10+ has setImmediate, otherwise:
+if (!setTask || !clearTask) {
+  setTask = function setImmediate(fn) {
+    var args = [];
+    var i = 1;
+    while (arguments.length > i) args.push(arguments[i++]);
+    queue[++counter] = function () {
+      // eslint-disable-next-line no-new-func
+      invoke(typeof fn == 'function' ? fn : Function(fn), args);
+    };
+    defer(counter);
+    return counter;
+  };
+  clearTask = function clearImmediate(id) {
+    delete queue[id];
+  };
+  // Node.js 0.8-
+  if (require('./_cof')(process) == 'process') {
+    defer = function (id) {
+      process.nextTick(ctx(run, id, 1));
+    };
+  // Sphere (JS game engine) Dispatch API
+  } else if (Dispatch && Dispatch.now) {
+    defer = function (id) {
+      Dispatch.now(ctx(run, id, 1));
+    };
+  // Browsers with MessageChannel, includes WebWorkers
+  } else if (MessageChannel) {
+    channel = new MessageChannel();
+    port = channel.port2;
+    channel.port1.onmessage = listener;
+    defer = ctx(port.postMessage, port, 1);
+  // Browsers with postMessage, skip WebWorkers
+  // IE8 has postMessage, but it's sync & typeof its postMessage is 'object'
+  } else if (global.addEventListener && typeof postMessage == 'function' && !global.importScripts) {
+    defer = function (id) {
+      global.postMessage(id + '', '*');
+    };
+    global.addEventListener('message', listener, false);
+  // IE8-
+  } else if (ONREADYSTATECHANGE in cel('script')) {
+    defer = function (id) {
+      html.appendChild(cel('script'))[ONREADYSTATECHANGE] = function () {
+        html.removeChild(this);
+        run.call(id);
+      };
+    };
+  // Rest old browsers
+  } else {
+    defer = function (id) {
+      setTimeout(ctx(run, id, 1), 0);
+    };
+  }
+}
+module.exports = {
+  set: setTask,
+  clear: clearTask
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-absolute-index.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-absolute-index.js
new file mode 100644
index 0000000..dfee02e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-absolute-index.js
@@ -0,0 +1,7 @@
+var toInteger = require('./_to-integer');
+var max = Math.max;
+var min = Math.min;
+module.exports = function (index, length) {
+  index = toInteger(index);
+  return index < 0 ? max(index + length, 0) : min(index, length);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-index.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-index.js
new file mode 100644
index 0000000..8f51c32
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-index.js
@@ -0,0 +1,10 @@
+// https://tc39.github.io/ecma262/#sec-toindex
+var toInteger = require('./_to-integer');
+var toLength = require('./_to-length');
+module.exports = function (it) {
+  if (it === undefined) return 0;
+  var number = toInteger(it);
+  var length = toLength(number);
+  if (number !== length) throw RangeError('Wrong length!');
+  return length;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-integer.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-integer.js
new file mode 100644
index 0000000..3d50f97
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-integer.js
@@ -0,0 +1,6 @@
+// 7.1.4 ToInteger
+var ceil = Math.ceil;
+var floor = Math.floor;
+module.exports = function (it) {
+  return isNaN(it = +it) ? 0 : (it > 0 ? floor : ceil)(it);
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-iobject.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-iobject.js
new file mode 100644
index 0000000..7614503
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-iobject.js
@@ -0,0 +1,6 @@
+// to indexed object, toObject with fallback for non-array-like ES3 strings
+var IObject = require('./_iobject');
+var defined = require('./_defined');
+module.exports = function (it) {
+  return IObject(defined(it));
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-length.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-length.js
new file mode 100644
index 0000000..a9db501
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-length.js
@@ -0,0 +1,6 @@
+// 7.1.15 ToLength
+var toInteger = require('./_to-integer');
+var min = Math.min;
+module.exports = function (it) {
+  return it > 0 ? min(toInteger(it), 0x1fffffffffffff) : 0; // pow(2, 53) - 1 == 9007199254740991
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-object.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-object.js
new file mode 100644
index 0000000..0efea4c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-object.js
@@ -0,0 +1,5 @@
+// 7.1.13 ToObject(argument)
+var defined = require('./_defined');
+module.exports = function (it) {
+  return Object(defined(it));
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-primitive.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-primitive.js
new file mode 100644
index 0000000..de3dd6b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_to-primitive.js
@@ -0,0 +1,12 @@
+// 7.1.1 ToPrimitive(input [, PreferredType])
+var isObject = require('./_is-object');
+// instead of the ES6 spec version, we didn't implement @@toPrimitive case
+// and the second argument - flag - preferred type is a string
+module.exports = function (it, S) {
+  if (!isObject(it)) return it;
+  var fn, val;
+  if (S && typeof (fn = it.toString) == 'function' && !isObject(val = fn.call(it))) return val;
+  if (typeof (fn = it.valueOf) == 'function' && !isObject(val = fn.call(it))) return val;
+  if (!S && typeof (fn = it.toString) == 'function' && !isObject(val = fn.call(it))) return val;
+  throw TypeError("Can't convert object to primitive value");
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_typed-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_typed-array.js
new file mode 100644
index 0000000..30d9c0b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_typed-array.js
@@ -0,0 +1,480 @@
+'use strict';
+if (require('./_descriptors')) {
+  var LIBRARY = require('./_library');
+  var global = require('./_global');
+  var fails = require('./_fails');
+  var $export = require('./_export');
+  var $typed = require('./_typed');
+  var $buffer = require('./_typed-buffer');
+  var ctx = require('./_ctx');
+  var anInstance = require('./_an-instance');
+  var propertyDesc = require('./_property-desc');
+  var hide = require('./_hide');
+  var redefineAll = require('./_redefine-all');
+  var toInteger = require('./_to-integer');
+  var toLength = require('./_to-length');
+  var toIndex = require('./_to-index');
+  var toAbsoluteIndex = require('./_to-absolute-index');
+  var toPrimitive = require('./_to-primitive');
+  var has = require('./_has');
+  var classof = require('./_classof');
+  var isObject = require('./_is-object');
+  var toObject = require('./_to-object');
+  var isArrayIter = require('./_is-array-iter');
+  var create = require('./_object-create');
+  var getPrototypeOf = require('./_object-gpo');
+  var gOPN = require('./_object-gopn').f;
+  var getIterFn = require('./core.get-iterator-method');
+  var uid = require('./_uid');
+  var wks = require('./_wks');
+  var createArrayMethod = require('./_array-methods');
+  var createArrayIncludes = require('./_array-includes');
+  var speciesConstructor = require('./_species-constructor');
+  var ArrayIterators = require('./es6.array.iterator');
+  var Iterators = require('./_iterators');
+  var $iterDetect = require('./_iter-detect');
+  var setSpecies = require('./_set-species');
+  var arrayFill = require('./_array-fill');
+  var arrayCopyWithin = require('./_array-copy-within');
+  var $DP = require('./_object-dp');
+  var $GOPD = require('./_object-gopd');
+  var dP = $DP.f;
+  var gOPD = $GOPD.f;
+  var RangeError = global.RangeError;
+  var TypeError = global.TypeError;
+  var Uint8Array = global.Uint8Array;
+  var ARRAY_BUFFER = 'ArrayBuffer';
+  var SHARED_BUFFER = 'Shared' + ARRAY_BUFFER;
+  var BYTES_PER_ELEMENT = 'BYTES_PER_ELEMENT';
+  var PROTOTYPE = 'prototype';
+  var ArrayProto = Array[PROTOTYPE];
+  var $ArrayBuffer = $buffer.ArrayBuffer;
+  var $DataView = $buffer.DataView;
+  var arrayForEach = createArrayMethod(0);
+  var arrayFilter = createArrayMethod(2);
+  var arraySome = createArrayMethod(3);
+  var arrayEvery = createArrayMethod(4);
+  var arrayFind = createArrayMethod(5);
+  var arrayFindIndex = createArrayMethod(6);
+  var arrayIncludes = createArrayIncludes(true);
+  var arrayIndexOf = createArrayIncludes(false);
+  var arrayValues = ArrayIterators.values;
+  var arrayKeys = ArrayIterators.keys;
+  var arrayEntries = ArrayIterators.entries;
+  var arrayLastIndexOf = ArrayProto.lastIndexOf;
+  var arrayReduce = ArrayProto.reduce;
+  var arrayReduceRight = ArrayProto.reduceRight;
+  var arrayJoin = ArrayProto.join;
+  var arraySort = ArrayProto.sort;
+  var arraySlice = ArrayProto.slice;
+  var arrayToString = ArrayProto.toString;
+  var arrayToLocaleString = ArrayProto.toLocaleString;
+  var ITERATOR = wks('iterator');
+  var TAG = wks('toStringTag');
+  var TYPED_CONSTRUCTOR = uid('typed_constructor');
+  var DEF_CONSTRUCTOR = uid('def_constructor');
+  var ALL_CONSTRUCTORS = $typed.CONSTR;
+  var TYPED_ARRAY = $typed.TYPED;
+  var VIEW = $typed.VIEW;
+  var WRONG_LENGTH = 'Wrong length!';
+
+  var $map = createArrayMethod(1, function (O, length) {
+    return allocate(speciesConstructor(O, O[DEF_CONSTRUCTOR]), length);
+  });
+
+  var LITTLE_ENDIAN = fails(function () {
+    // eslint-disable-next-line no-undef
+    return new Uint8Array(new Uint16Array([1]).buffer)[0] === 1;
+  });
+
+  var FORCED_SET = !!Uint8Array && !!Uint8Array[PROTOTYPE].set && fails(function () {
+    new Uint8Array(1).set({});
+  });
+
+  var toOffset = function (it, BYTES) {
+    var offset = toInteger(it);
+    if (offset < 0 || offset % BYTES) throw RangeError('Wrong offset!');
+    return offset;
+  };
+
+  var validate = function (it) {
+    if (isObject(it) && TYPED_ARRAY in it) return it;
+    throw TypeError(it + ' is not a typed array!');
+  };
+
+  var allocate = function (C, length) {
+    if (!(isObject(C) && TYPED_CONSTRUCTOR in C)) {
+      throw TypeError('It is not a typed array constructor!');
+    } return new C(length);
+  };
+
+  var speciesFromList = function (O, list) {
+    return fromList(speciesConstructor(O, O[DEF_CONSTRUCTOR]), list);
+  };
+
+  var fromList = function (C, list) {
+    var index = 0;
+    var length = list.length;
+    var result = allocate(C, length);
+    while (length > index) result[index] = list[index++];
+    return result;
+  };
+
+  var addGetter = function (it, key, internal) {
+    dP(it, key, { get: function () { return this._d[internal]; } });
+  };
+
+  var $from = function from(source /* , mapfn, thisArg */) {
+    var O = toObject(source);
+    var aLen = arguments.length;
+    var mapfn = aLen > 1 ? arguments[1] : undefined;
+    var mapping = mapfn !== undefined;
+    var iterFn = getIterFn(O);
+    var i, length, values, result, step, iterator;
+    if (iterFn != undefined && !isArrayIter(iterFn)) {
+      for (iterator = iterFn.call(O), values = [], i = 0; !(step = iterator.next()).done; i++) {
+        values.push(step.value);
+      } O = values;
+    }
+    if (mapping && aLen > 2) mapfn = ctx(mapfn, arguments[2], 2);
+    for (i = 0, length = toLength(O.length), result = allocate(this, length); length > i; i++) {
+      result[i] = mapping ? mapfn(O[i], i) : O[i];
+    }
+    return result;
+  };
+
+  var $of = function of(/* ...items */) {
+    var index = 0;
+    var length = arguments.length;
+    var result = allocate(this, length);
+    while (length > index) result[index] = arguments[index++];
+    return result;
+  };
+
+  // iOS Safari 6.x fails here
+  var TO_LOCALE_BUG = !!Uint8Array && fails(function () { arrayToLocaleString.call(new Uint8Array(1)); });
+
+  var $toLocaleString = function toLocaleString() {
+    return arrayToLocaleString.apply(TO_LOCALE_BUG ? arraySlice.call(validate(this)) : validate(this), arguments);
+  };
+
+  var proto = {
+    copyWithin: function copyWithin(target, start /* , end */) {
+      return arrayCopyWithin.call(validate(this), target, start, arguments.length > 2 ? arguments[2] : undefined);
+    },
+    every: function every(callbackfn /* , thisArg */) {
+      return arrayEvery(validate(this), callbackfn, arguments.length > 1 ? arguments[1] : undefined);
+    },
+    fill: function fill(value /* , start, end */) { // eslint-disable-line no-unused-vars
+      return arrayFill.apply(validate(this), arguments);
+    },
+    filter: function filter(callbackfn /* , thisArg */) {
+      return speciesFromList(this, arrayFilter(validate(this), callbackfn,
+        arguments.length > 1 ? arguments[1] : undefined));
+    },
+    find: function find(predicate /* , thisArg */) {
+      return arrayFind(validate(this), predicate, arguments.length > 1 ? arguments[1] : undefined);
+    },
+    findIndex: function findIndex(predicate /* , thisArg */) {
+      return arrayFindIndex(validate(this), predicate, arguments.length > 1 ? arguments[1] : undefined);
+    },
+    forEach: function forEach(callbackfn /* , thisArg */) {
+      arrayForEach(validate(this), callbackfn, arguments.length > 1 ? arguments[1] : undefined);
+    },
+    indexOf: function indexOf(searchElement /* , fromIndex */) {
+      return arrayIndexOf(validate(this), searchElement, arguments.length > 1 ? arguments[1] : undefined);
+    },
+    includes: function includes(searchElement /* , fromIndex */) {
+      return arrayIncludes(validate(this), searchElement, arguments.length > 1 ? arguments[1] : undefined);
+    },
+    join: function join(separator) { // eslint-disable-line no-unused-vars
+      return arrayJoin.apply(validate(this), arguments);
+    },
+    lastIndexOf: function lastIndexOf(searchElement /* , fromIndex */) { // eslint-disable-line no-unused-vars
+      return arrayLastIndexOf.apply(validate(this), arguments);
+    },
+    map: function map(mapfn /* , thisArg */) {
+      return $map(validate(this), mapfn, arguments.length > 1 ? arguments[1] : undefined);
+    },
+    reduce: function reduce(callbackfn /* , initialValue */) { // eslint-disable-line no-unused-vars
+      return arrayReduce.apply(validate(this), arguments);
+    },
+    reduceRight: function reduceRight(callbackfn /* , initialValue */) { // eslint-disable-line no-unused-vars
+      return arrayReduceRight.apply(validate(this), arguments);
+    },
+    reverse: function reverse() {
+      var that = this;
+      var length = validate(that).length;
+      var middle = Math.floor(length / 2);
+      var index = 0;
+      var value;
+      while (index < middle) {
+        value = that[index];
+        that[index++] = that[--length];
+        that[length] = value;
+      } return that;
+    },
+    some: function some(callbackfn /* , thisArg */) {
+      return arraySome(validate(this), callbackfn, arguments.length > 1 ? arguments[1] : undefined);
+    },
+    sort: function sort(comparefn) {
+      return arraySort.call(validate(this), comparefn);
+    },
+    subarray: function subarray(begin, end) {
+      var O = validate(this);
+      var length = O.length;
+      var $begin = toAbsoluteIndex(begin, length);
+      return new (speciesConstructor(O, O[DEF_CONSTRUCTOR]))(
+        O.buffer,
+        O.byteOffset + $begin * O.BYTES_PER_ELEMENT,
+        toLength((end === undefined ? length : toAbsoluteIndex(end, length)) - $begin)
+      );
+    }
+  };
+
+  var $slice = function slice(start, end) {
+    return speciesFromList(this, arraySlice.call(validate(this), start, end));
+  };
+
+  var $set = function set(arrayLike /* , offset */) {
+    validate(this);
+    var offset = toOffset(arguments[1], 1);
+    var length = this.length;
+    var src = toObject(arrayLike);
+    var len = toLength(src.length);
+    var index = 0;
+    if (len + offset > length) throw RangeError(WRONG_LENGTH);
+    while (index < len) this[offset + index] = src[index++];
+  };
+
+  var $iterators = {
+    entries: function entries() {
+      return arrayEntries.call(validate(this));
+    },
+    keys: function keys() {
+      return arrayKeys.call(validate(this));
+    },
+    values: function values() {
+      return arrayValues.call(validate(this));
+    }
+  };
+
+  var isTAIndex = function (target, key) {
+    return isObject(target)
+      && target[TYPED_ARRAY]
+      && typeof key != 'symbol'
+      && key in target
+      && String(+key) == String(key);
+  };
+  var $getDesc = function getOwnPropertyDescriptor(target, key) {
+    return isTAIndex(target, key = toPrimitive(key, true))
+      ? propertyDesc(2, target[key])
+      : gOPD(target, key);
+  };
+  var $setDesc = function defineProperty(target, key, desc) {
+    if (isTAIndex(target, key = toPrimitive(key, true))
+      && isObject(desc)
+      && has(desc, 'value')
+      && !has(desc, 'get')
+      && !has(desc, 'set')
+      // TODO: add validation descriptor w/o calling accessors
+      && !desc.configurable
+      && (!has(desc, 'writable') || desc.writable)
+      && (!has(desc, 'enumerable') || desc.enumerable)
+    ) {
+      target[key] = desc.value;
+      return target;
+    } return dP(target, key, desc);
+  };
+
+  if (!ALL_CONSTRUCTORS) {
+    $GOPD.f = $getDesc;
+    $DP.f = $setDesc;
+  }
+
+  $export($export.S + $export.F * !ALL_CONSTRUCTORS, 'Object', {
+    getOwnPropertyDescriptor: $getDesc,
+    defineProperty: $setDesc
+  });
+
+  if (fails(function () { arrayToString.call({}); })) {
+    arrayToString = arrayToLocaleString = function toString() {
+      return arrayJoin.call(this);
+    };
+  }
+
+  var $TypedArrayPrototype$ = redefineAll({}, proto);
+  redefineAll($TypedArrayPrototype$, $iterators);
+  hide($TypedArrayPrototype$, ITERATOR, $iterators.values);
+  redefineAll($TypedArrayPrototype$, {
+    slice: $slice,
+    set: $set,
+    constructor: function () { /* noop */ },
+    toString: arrayToString,
+    toLocaleString: $toLocaleString
+  });
+  addGetter($TypedArrayPrototype$, 'buffer', 'b');
+  addGetter($TypedArrayPrototype$, 'byteOffset', 'o');
+  addGetter($TypedArrayPrototype$, 'byteLength', 'l');
+  addGetter($TypedArrayPrototype$, 'length', 'e');
+  dP($TypedArrayPrototype$, TAG, {
+    get: function () { return this[TYPED_ARRAY]; }
+  });
+
+  // eslint-disable-next-line max-statements
+  module.exports = function (KEY, BYTES, wrapper, CLAMPED) {
+    CLAMPED = !!CLAMPED;
+    var NAME = KEY + (CLAMPED ? 'Clamped' : '') + 'Array';
+    var GETTER = 'get' + KEY;
+    var SETTER = 'set' + KEY;
+    var TypedArray = global[NAME];
+    var Base = TypedArray || {};
+    var TAC = TypedArray && getPrototypeOf(TypedArray);
+    var FORCED = !TypedArray || !$typed.ABV;
+    var O = {};
+    var TypedArrayPrototype = TypedArray && TypedArray[PROTOTYPE];
+    var getter = function (that, index) {
+      var data = that._d;
+      return data.v[GETTER](index * BYTES + data.o, LITTLE_ENDIAN);
+    };
+    var setter = function (that, index, value) {
+      var data = that._d;
+      if (CLAMPED) value = (value = Math.round(value)) < 0 ? 0 : value > 0xff ? 0xff : value & 0xff;
+      data.v[SETTER](index * BYTES + data.o, value, LITTLE_ENDIAN);
+    };
+    var addElement = function (that, index) {
+      dP(that, index, {
+        get: function () {
+          return getter(this, index);
+        },
+        set: function (value) {
+          return setter(this, index, value);
+        },
+        enumerable: true
+      });
+    };
+    if (FORCED) {
+      TypedArray = wrapper(function (that, data, $offset, $length) {
+        anInstance(that, TypedArray, NAME, '_d');
+        var index = 0;
+        var offset = 0;
+        var buffer, byteLength, length, klass;
+        if (!isObject(data)) {
+          length = toIndex(data);
+          byteLength = length * BYTES;
+          buffer = new $ArrayBuffer(byteLength);
+        } else if (data instanceof $ArrayBuffer || (klass = classof(data)) == ARRAY_BUFFER || klass == SHARED_BUFFER) {
+          buffer = data;
+          offset = toOffset($offset, BYTES);
+          var $len = data.byteLength;
+          if ($length === undefined) {
+            if ($len % BYTES) throw RangeError(WRONG_LENGTH);
+            byteLength = $len - offset;
+            if (byteLength < 0) throw RangeError(WRONG_LENGTH);
+          } else {
+            byteLength = toLength($length) * BYTES;
+            if (byteLength + offset > $len) throw RangeError(WRONG_LENGTH);
+          }
+          length = byteLength / BYTES;
+        } else if (TYPED_ARRAY in data) {
+          return fromList(TypedArray, data);
+        } else {
+          return $from.call(TypedArray, data);
+        }
+        hide(that, '_d', {
+          b: buffer,
+          o: offset,
+          l: byteLength,
+          e: length,
+          v: new $DataView(buffer)
+        });
+        while (index < length) addElement(that, index++);
+      });
+      TypedArrayPrototype = TypedArray[PROTOTYPE] = create($TypedArrayPrototype$);
+      hide(TypedArrayPrototype, 'constructor', TypedArray);
+    } else if (!fails(function () {
+      TypedArray(1);
+    }) || !fails(function () {
+      new TypedArray(-1); // eslint-disable-line no-new
+    }) || !$iterDetect(function (iter) {
+      new TypedArray(); // eslint-disable-line no-new
+      new TypedArray(null); // eslint-disable-line no-new
+      new TypedArray(1.5); // eslint-disable-line no-new
+      new TypedArray(iter); // eslint-disable-line no-new
+    }, true)) {
+      TypedArray = wrapper(function (that, data, $offset, $length) {
+        anInstance(that, TypedArray, NAME);
+        var klass;
+        // `ws` module bug, temporarily remove validation length for Uint8Array
+        // https://github.com/websockets/ws/pull/645
+        if (!isObject(data)) return new Base(toIndex(data));
+        if (data instanceof $ArrayBuffer || (klass = classof(data)) == ARRAY_BUFFER || klass == SHARED_BUFFER) {
+          return $length !== undefined
+            ? new Base(data, toOffset($offset, BYTES), $length)
+            : $offset !== undefined
+              ? new Base(data, toOffset($offset, BYTES))
+              : new Base(data);
+        }
+        if (TYPED_ARRAY in data) return fromList(TypedArray, data);
+        return $from.call(TypedArray, data);
+      });
+      arrayForEach(TAC !== Function.prototype ? gOPN(Base).concat(gOPN(TAC)) : gOPN(Base), function (key) {
+        if (!(key in TypedArray)) hide(TypedArray, key, Base[key]);
+      });
+      TypedArray[PROTOTYPE] = TypedArrayPrototype;
+      if (!LIBRARY) TypedArrayPrototype.constructor = TypedArray;
+    }
+    var $nativeIterator = TypedArrayPrototype[ITERATOR];
+    var CORRECT_ITER_NAME = !!$nativeIterator
+      && ($nativeIterator.name == 'values' || $nativeIterator.name == undefined);
+    var $iterator = $iterators.values;
+    hide(TypedArray, TYPED_CONSTRUCTOR, true);
+    hide(TypedArrayPrototype, TYPED_ARRAY, NAME);
+    hide(TypedArrayPrototype, VIEW, true);
+    hide(TypedArrayPrototype, DEF_CONSTRUCTOR, TypedArray);
+
+    if (CLAMPED ? new TypedArray(1)[TAG] != NAME : !(TAG in TypedArrayPrototype)) {
+      dP(TypedArrayPrototype, TAG, {
+        get: function () { return NAME; }
+      });
+    }
+
+    O[NAME] = TypedArray;
+
+    $export($export.G + $export.W + $export.F * (TypedArray != Base), O);
+
+    $export($export.S, NAME, {
+      BYTES_PER_ELEMENT: BYTES
+    });
+
+    $export($export.S + $export.F * fails(function () { Base.of.call(TypedArray, 1); }), NAME, {
+      from: $from,
+      of: $of
+    });
+
+    if (!(BYTES_PER_ELEMENT in TypedArrayPrototype)) hide(TypedArrayPrototype, BYTES_PER_ELEMENT, BYTES);
+
+    $export($export.P, NAME, proto);
+
+    setSpecies(NAME);
+
+    $export($export.P + $export.F * FORCED_SET, NAME, { set: $set });
+
+    $export($export.P + $export.F * !CORRECT_ITER_NAME, NAME, $iterators);
+
+    if (!LIBRARY && TypedArrayPrototype.toString != arrayToString) TypedArrayPrototype.toString = arrayToString;
+
+    $export($export.P + $export.F * fails(function () {
+      new TypedArray(1).slice();
+    }), NAME, { slice: $slice });
+
+    $export($export.P + $export.F * (fails(function () {
+      return [1, 2].toLocaleString() != new TypedArray([1, 2]).toLocaleString();
+    }) || !fails(function () {
+      TypedArrayPrototype.toLocaleString.call([1, 2]);
+    })), NAME, { toLocaleString: $toLocaleString });
+
+    Iterators[NAME] = CORRECT_ITER_NAME ? $nativeIterator : $iterator;
+    if (!LIBRARY && !CORRECT_ITER_NAME) hide(TypedArrayPrototype, ITERATOR, $iterator);
+  };
+} else module.exports = function () { /* empty */ };
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_typed-buffer.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_typed-buffer.js
new file mode 100644
index 0000000..c24cef3
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_typed-buffer.js
@@ -0,0 +1,276 @@
+'use strict';
+var global = require('./_global');
+var DESCRIPTORS = require('./_descriptors');
+var LIBRARY = require('./_library');
+var $typed = require('./_typed');
+var hide = require('./_hide');
+var redefineAll = require('./_redefine-all');
+var fails = require('./_fails');
+var anInstance = require('./_an-instance');
+var toInteger = require('./_to-integer');
+var toLength = require('./_to-length');
+var toIndex = require('./_to-index');
+var gOPN = require('./_object-gopn').f;
+var dP = require('./_object-dp').f;
+var arrayFill = require('./_array-fill');
+var setToStringTag = require('./_set-to-string-tag');
+var ARRAY_BUFFER = 'ArrayBuffer';
+var DATA_VIEW = 'DataView';
+var PROTOTYPE = 'prototype';
+var WRONG_LENGTH = 'Wrong length!';
+var WRONG_INDEX = 'Wrong index!';
+var $ArrayBuffer = global[ARRAY_BUFFER];
+var $DataView = global[DATA_VIEW];
+var Math = global.Math;
+var RangeError = global.RangeError;
+// eslint-disable-next-line no-shadow-restricted-names
+var Infinity = global.Infinity;
+var BaseBuffer = $ArrayBuffer;
+var abs = Math.abs;
+var pow = Math.pow;
+var floor = Math.floor;
+var log = Math.log;
+var LN2 = Math.LN2;
+var BUFFER = 'buffer';
+var BYTE_LENGTH = 'byteLength';
+var BYTE_OFFSET = 'byteOffset';
+var $BUFFER = DESCRIPTORS ? '_b' : BUFFER;
+var $LENGTH = DESCRIPTORS ? '_l' : BYTE_LENGTH;
+var $OFFSET = DESCRIPTORS ? '_o' : BYTE_OFFSET;
+
+// IEEE754 conversions based on https://github.com/feross/ieee754
+function packIEEE754(value, mLen, nBytes) {
+  var buffer = new Array(nBytes);
+  var eLen = nBytes * 8 - mLen - 1;
+  var eMax = (1 << eLen) - 1;
+  var eBias = eMax >> 1;
+  var rt = mLen === 23 ? pow(2, -24) - pow(2, -77) : 0;
+  var i = 0;
+  var s = value < 0 || value === 0 && 1 / value < 0 ? 1 : 0;
+  var e, m, c;
+  value = abs(value);
+  // eslint-disable-next-line no-self-compare
+  if (value != value || value === Infinity) {
+    // eslint-disable-next-line no-self-compare
+    m = value != value ? 1 : 0;
+    e = eMax;
+  } else {
+    e = floor(log(value) / LN2);
+    if (value * (c = pow(2, -e)) < 1) {
+      e--;
+      c *= 2;
+    }
+    if (e + eBias >= 1) {
+      value += rt / c;
+    } else {
+      value += rt * pow(2, 1 - eBias);
+    }
+    if (value * c >= 2) {
+      e++;
+      c /= 2;
+    }
+    if (e + eBias >= eMax) {
+      m = 0;
+      e = eMax;
+    } else if (e + eBias >= 1) {
+      m = (value * c - 1) * pow(2, mLen);
+      e = e + eBias;
+    } else {
+      m = value * pow(2, eBias - 1) * pow(2, mLen);
+      e = 0;
+    }
+  }
+  for (; mLen >= 8; buffer[i++] = m & 255, m /= 256, mLen -= 8);
+  e = e << mLen | m;
+  eLen += mLen;
+  for (; eLen > 0; buffer[i++] = e & 255, e /= 256, eLen -= 8);
+  buffer[--i] |= s * 128;
+  return buffer;
+}
+function unpackIEEE754(buffer, mLen, nBytes) {
+  var eLen = nBytes * 8 - mLen - 1;
+  var eMax = (1 << eLen) - 1;
+  var eBias = eMax >> 1;
+  var nBits = eLen - 7;
+  var i = nBytes - 1;
+  var s = buffer[i--];
+  var e = s & 127;
+  var m;
+  s >>= 7;
+  for (; nBits > 0; e = e * 256 + buffer[i], i--, nBits -= 8);
+  m = e & (1 << -nBits) - 1;
+  e >>= -nBits;
+  nBits += mLen;
+  for (; nBits > 0; m = m * 256 + buffer[i], i--, nBits -= 8);
+  if (e === 0) {
+    e = 1 - eBias;
+  } else if (e === eMax) {
+    return m ? NaN : s ? -Infinity : Infinity;
+  } else {
+    m = m + pow(2, mLen);
+    e = e - eBias;
+  } return (s ? -1 : 1) * m * pow(2, e - mLen);
+}
+
+function unpackI32(bytes) {
+  return bytes[3] << 24 | bytes[2] << 16 | bytes[1] << 8 | bytes[0];
+}
+function packI8(it) {
+  return [it & 0xff];
+}
+function packI16(it) {
+  return [it & 0xff, it >> 8 & 0xff];
+}
+function packI32(it) {
+  return [it & 0xff, it >> 8 & 0xff, it >> 16 & 0xff, it >> 24 & 0xff];
+}
+function packF64(it) {
+  return packIEEE754(it, 52, 8);
+}
+function packF32(it) {
+  return packIEEE754(it, 23, 4);
+}
+
+function addGetter(C, key, internal) {
+  dP(C[PROTOTYPE], key, { get: function () { return this[internal]; } });
+}
+
+function get(view, bytes, index, isLittleEndian) {
+  var numIndex = +index;
+  var intIndex = toIndex(numIndex);
+  if (intIndex + bytes > view[$LENGTH]) throw RangeError(WRONG_INDEX);
+  var store = view[$BUFFER]._b;
+  var start = intIndex + view[$OFFSET];
+  var pack = store.slice(start, start + bytes);
+  return isLittleEndian ? pack : pack.reverse();
+}
+function set(view, bytes, index, conversion, value, isLittleEndian) {
+  var numIndex = +index;
+  var intIndex = toIndex(numIndex);
+  if (intIndex + bytes > view[$LENGTH]) throw RangeError(WRONG_INDEX);
+  var store = view[$BUFFER]._b;
+  var start = intIndex + view[$OFFSET];
+  var pack = conversion(+value);
+  for (var i = 0; i < bytes; i++) store[start + i] = pack[isLittleEndian ? i : bytes - i - 1];
+}
+
+if (!$typed.ABV) {
+  $ArrayBuffer = function ArrayBuffer(length) {
+    anInstance(this, $ArrayBuffer, ARRAY_BUFFER);
+    var byteLength = toIndex(length);
+    this._b = arrayFill.call(new Array(byteLength), 0);
+    this[$LENGTH] = byteLength;
+  };
+
+  $DataView = function DataView(buffer, byteOffset, byteLength) {
+    anInstance(this, $DataView, DATA_VIEW);
+    anInstance(buffer, $ArrayBuffer, DATA_VIEW);
+    var bufferLength = buffer[$LENGTH];
+    var offset = toInteger(byteOffset);
+    if (offset < 0 || offset > bufferLength) throw RangeError('Wrong offset!');
+    byteLength = byteLength === undefined ? bufferLength - offset : toLength(byteLength);
+    if (offset + byteLength > bufferLength) throw RangeError(WRONG_LENGTH);
+    this[$BUFFER] = buffer;
+    this[$OFFSET] = offset;
+    this[$LENGTH] = byteLength;
+  };
+
+  if (DESCRIPTORS) {
+    addGetter($ArrayBuffer, BYTE_LENGTH, '_l');
+    addGetter($DataView, BUFFER, '_b');
+    addGetter($DataView, BYTE_LENGTH, '_l');
+    addGetter($DataView, BYTE_OFFSET, '_o');
+  }
+
+  redefineAll($DataView[PROTOTYPE], {
+    getInt8: function getInt8(byteOffset) {
+      return get(this, 1, byteOffset)[0] << 24 >> 24;
+    },
+    getUint8: function getUint8(byteOffset) {
+      return get(this, 1, byteOffset)[0];
+    },
+    getInt16: function getInt16(byteOffset /* , littleEndian */) {
+      var bytes = get(this, 2, byteOffset, arguments[1]);
+      return (bytes[1] << 8 | bytes[0]) << 16 >> 16;
+    },
+    getUint16: function getUint16(byteOffset /* , littleEndian */) {
+      var bytes = get(this, 2, byteOffset, arguments[1]);
+      return bytes[1] << 8 | bytes[0];
+    },
+    getInt32: function getInt32(byteOffset /* , littleEndian */) {
+      return unpackI32(get(this, 4, byteOffset, arguments[1]));
+    },
+    getUint32: function getUint32(byteOffset /* , littleEndian */) {
+      return unpackI32(get(this, 4, byteOffset, arguments[1])) >>> 0;
+    },
+    getFloat32: function getFloat32(byteOffset /* , littleEndian */) {
+      return unpackIEEE754(get(this, 4, byteOffset, arguments[1]), 23, 4);
+    },
+    getFloat64: function getFloat64(byteOffset /* , littleEndian */) {
+      return unpackIEEE754(get(this, 8, byteOffset, arguments[1]), 52, 8);
+    },
+    setInt8: function setInt8(byteOffset, value) {
+      set(this, 1, byteOffset, packI8, value);
+    },
+    setUint8: function setUint8(byteOffset, value) {
+      set(this, 1, byteOffset, packI8, value);
+    },
+    setInt16: function setInt16(byteOffset, value /* , littleEndian */) {
+      set(this, 2, byteOffset, packI16, value, arguments[2]);
+    },
+    setUint16: function setUint16(byteOffset, value /* , littleEndian */) {
+      set(this, 2, byteOffset, packI16, value, arguments[2]);
+    },
+    setInt32: function setInt32(byteOffset, value /* , littleEndian */) {
+      set(this, 4, byteOffset, packI32, value, arguments[2]);
+    },
+    setUint32: function setUint32(byteOffset, value /* , littleEndian */) {
+      set(this, 4, byteOffset, packI32, value, arguments[2]);
+    },
+    setFloat32: function setFloat32(byteOffset, value /* , littleEndian */) {
+      set(this, 4, byteOffset, packF32, value, arguments[2]);
+    },
+    setFloat64: function setFloat64(byteOffset, value /* , littleEndian */) {
+      set(this, 8, byteOffset, packF64, value, arguments[2]);
+    }
+  });
+} else {
+  if (!fails(function () {
+    $ArrayBuffer(1);
+  }) || !fails(function () {
+    new $ArrayBuffer(-1); // eslint-disable-line no-new
+  }) || fails(function () {
+    new $ArrayBuffer(); // eslint-disable-line no-new
+    new $ArrayBuffer(1.5); // eslint-disable-line no-new
+    new $ArrayBuffer(NaN); // eslint-disable-line no-new
+    return $ArrayBuffer.name != ARRAY_BUFFER;
+  })) {
+    $ArrayBuffer = function ArrayBuffer(length) {
+      anInstance(this, $ArrayBuffer);
+      return new BaseBuffer(toIndex(length));
+    };
+    var ArrayBufferProto = $ArrayBuffer[PROTOTYPE] = BaseBuffer[PROTOTYPE];
+    for (var keys = gOPN(BaseBuffer), j = 0, key; keys.length > j;) {
+      if (!((key = keys[j++]) in $ArrayBuffer)) hide($ArrayBuffer, key, BaseBuffer[key]);
+    }
+    if (!LIBRARY) ArrayBufferProto.constructor = $ArrayBuffer;
+  }
+  // iOS Safari 7.x bug
+  var view = new $DataView(new $ArrayBuffer(2));
+  var $setInt8 = $DataView[PROTOTYPE].setInt8;
+  view.setInt8(0, 2147483648);
+  view.setInt8(1, 2147483649);
+  if (view.getInt8(0) || !view.getInt8(1)) redefineAll($DataView[PROTOTYPE], {
+    setInt8: function setInt8(byteOffset, value) {
+      $setInt8.call(this, byteOffset, value << 24 >> 24);
+    },
+    setUint8: function setUint8(byteOffset, value) {
+      $setInt8.call(this, byteOffset, value << 24 >> 24);
+    }
+  }, true);
+}
+setToStringTag($ArrayBuffer, ARRAY_BUFFER);
+setToStringTag($DataView, DATA_VIEW);
+hide($DataView[PROTOTYPE], $typed.VIEW, true);
+exports[ARRAY_BUFFER] = $ArrayBuffer;
+exports[DATA_VIEW] = $DataView;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_typed.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_typed.js
new file mode 100644
index 0000000..8747ffd
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_typed.js
@@ -0,0 +1,28 @@
+var global = require('./_global');
+var hide = require('./_hide');
+var uid = require('./_uid');
+var TYPED = uid('typed_array');
+var VIEW = uid('view');
+var ABV = !!(global.ArrayBuffer && global.DataView);
+var CONSTR = ABV;
+var i = 0;
+var l = 9;
+var Typed;
+
+var TypedArrayConstructors = (
+  'Int8Array,Uint8Array,Uint8ClampedArray,Int16Array,Uint16Array,Int32Array,Uint32Array,Float32Array,Float64Array'
+).split(',');
+
+while (i < l) {
+  if (Typed = global[TypedArrayConstructors[i++]]) {
+    hide(Typed.prototype, TYPED, true);
+    hide(Typed.prototype, VIEW, true);
+  } else CONSTR = false;
+}
+
+module.exports = {
+  ABV: ABV,
+  CONSTR: CONSTR,
+  TYPED: TYPED,
+  VIEW: VIEW
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_uid.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_uid.js
new file mode 100644
index 0000000..ffbe718
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_uid.js
@@ -0,0 +1,5 @@
+var id = 0;
+var px = Math.random();
+module.exports = function (key) {
+  return 'Symbol('.concat(key === undefined ? '' : key, ')_', (++id + px).toString(36));
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_user-agent.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_user-agent.js
new file mode 100644
index 0000000..363fedc
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_user-agent.js
@@ -0,0 +1,4 @@
+var global = require('./_global');
+var navigator = global.navigator;
+
+module.exports = navigator && navigator.userAgent || '';
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_validate-collection.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_validate-collection.js
new file mode 100644
index 0000000..cec1cef
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_validate-collection.js
@@ -0,0 +1,5 @@
+var isObject = require('./_is-object');
+module.exports = function (it, TYPE) {
+  if (!isObject(it) || it._t !== TYPE) throw TypeError('Incompatible receiver, ' + TYPE + ' required!');
+  return it;
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_wks-define.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_wks-define.js
new file mode 100644
index 0000000..7284d6a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_wks-define.js
@@ -0,0 +1,9 @@
+var global = require('./_global');
+var core = require('./_core');
+var LIBRARY = require('./_library');
+var wksExt = require('./_wks-ext');
+var defineProperty = require('./_object-dp').f;
+module.exports = function (name) {
+  var $Symbol = core.Symbol || (core.Symbol = LIBRARY ? {} : global.Symbol || {});
+  if (name.charAt(0) != '_' && !(name in $Symbol)) defineProperty($Symbol, name, { value: wksExt.f(name) });
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_wks-ext.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_wks-ext.js
new file mode 100644
index 0000000..13bd83b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_wks-ext.js
@@ -0,0 +1 @@
+exports.f = require('./_wks');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_wks.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_wks.js
new file mode 100644
index 0000000..e33f857
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/_wks.js
@@ -0,0 +1,11 @@
+var store = require('./_shared')('wks');
+var uid = require('./_uid');
+var Symbol = require('./_global').Symbol;
+var USE_SYMBOL = typeof Symbol == 'function';
+
+var $exports = module.exports = function (name) {
+  return store[name] || (store[name] =
+    USE_SYMBOL && Symbol[name] || (USE_SYMBOL ? Symbol : uid)('Symbol.' + name));
+};
+
+$exports.store = store;
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/core.get-iterator-method.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/core.get-iterator-method.js
new file mode 100644
index 0000000..9b6fa62
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/core.get-iterator-method.js
@@ -0,0 +1,8 @@
+var classof = require('./_classof');
+var ITERATOR = require('./_wks')('iterator');
+var Iterators = require('./_iterators');
+module.exports = require('./_core').getIteratorMethod = function (it) {
+  if (it != undefined) return it[ITERATOR]
+    || it['@@iterator']
+    || Iterators[classof(it)];
+};
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.copy-within.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.copy-within.js
new file mode 100644
index 0000000..f866a95
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.copy-within.js
@@ -0,0 +1,6 @@
+// 22.1.3.3 Array.prototype.copyWithin(target, start, end = this.length)
+var $export = require('./_export');
+
+$export($export.P, 'Array', { copyWithin: require('./_array-copy-within') });
+
+require('./_add-to-unscopables')('copyWithin');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.every.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.every.js
new file mode 100644
index 0000000..cfd448f
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.every.js
@@ -0,0 +1,10 @@
+'use strict';
+var $export = require('./_export');
+var $every = require('./_array-methods')(4);
+
+$export($export.P + $export.F * !require('./_strict-method')([].every, true), 'Array', {
+  // 22.1.3.5 / 15.4.4.16 Array.prototype.every(callbackfn [, thisArg])
+  every: function every(callbackfn /* , thisArg */) {
+    return $every(this, callbackfn, arguments[1]);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.fill.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.fill.js
new file mode 100644
index 0000000..ac17144
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.fill.js
@@ -0,0 +1,6 @@
+// 22.1.3.6 Array.prototype.fill(value, start = 0, end = this.length)
+var $export = require('./_export');
+
+$export($export.P, 'Array', { fill: require('./_array-fill') });
+
+require('./_add-to-unscopables')('fill');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.filter.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.filter.js
new file mode 100644
index 0000000..447ecf4
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.filter.js
@@ -0,0 +1,10 @@
+'use strict';
+var $export = require('./_export');
+var $filter = require('./_array-methods')(2);
+
+$export($export.P + $export.F * !require('./_strict-method')([].filter, true), 'Array', {
+  // 22.1.3.7 / 15.4.4.20 Array.prototype.filter(callbackfn [, thisArg])
+  filter: function filter(callbackfn /* , thisArg */) {
+    return $filter(this, callbackfn, arguments[1]);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.find-index.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.find-index.js
new file mode 100644
index 0000000..374cadd
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.find-index.js
@@ -0,0 +1,14 @@
+'use strict';
+// 22.1.3.9 Array.prototype.findIndex(predicate, thisArg = undefined)
+var $export = require('./_export');
+var $find = require('./_array-methods')(6);
+var KEY = 'findIndex';
+var forced = true;
+// Shouldn't skip holes
+if (KEY in []) Array(1)[KEY](function () { forced = false; });
+$export($export.P + $export.F * forced, 'Array', {
+  findIndex: function findIndex(callbackfn /* , that = undefined */) {
+    return $find(this, callbackfn, arguments.length > 1 ? arguments[1] : undefined);
+  }
+});
+require('./_add-to-unscopables')(KEY);
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.find.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.find.js
new file mode 100644
index 0000000..4fbe76c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.find.js
@@ -0,0 +1,14 @@
+'use strict';
+// 22.1.3.8 Array.prototype.find(predicate, thisArg = undefined)
+var $export = require('./_export');
+var $find = require('./_array-methods')(5);
+var KEY = 'find';
+var forced = true;
+// Shouldn't skip holes
+if (KEY in []) Array(1)[KEY](function () { forced = false; });
+$export($export.P + $export.F * forced, 'Array', {
+  find: function find(callbackfn /* , that = undefined */) {
+    return $find(this, callbackfn, arguments.length > 1 ? arguments[1] : undefined);
+  }
+});
+require('./_add-to-unscopables')(KEY);
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.for-each.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.for-each.js
new file mode 100644
index 0000000..525ba07
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.for-each.js
@@ -0,0 +1,11 @@
+'use strict';
+var $export = require('./_export');
+var $forEach = require('./_array-methods')(0);
+var STRICT = require('./_strict-method')([].forEach, true);
+
+$export($export.P + $export.F * !STRICT, 'Array', {
+  // 22.1.3.10 / 15.4.4.18 Array.prototype.forEach(callbackfn [, thisArg])
+  forEach: function forEach(callbackfn /* , thisArg */) {
+    return $forEach(this, callbackfn, arguments[1]);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.from.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.from.js
new file mode 100644
index 0000000..4db3801
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.from.js
@@ -0,0 +1,37 @@
+'use strict';
+var ctx = require('./_ctx');
+var $export = require('./_export');
+var toObject = require('./_to-object');
+var call = require('./_iter-call');
+var isArrayIter = require('./_is-array-iter');
+var toLength = require('./_to-length');
+var createProperty = require('./_create-property');
+var getIterFn = require('./core.get-iterator-method');
+
+$export($export.S + $export.F * !require('./_iter-detect')(function (iter) { Array.from(iter); }), 'Array', {
+  // 22.1.2.1 Array.from(arrayLike, mapfn = undefined, thisArg = undefined)
+  from: function from(arrayLike /* , mapfn = undefined, thisArg = undefined */) {
+    var O = toObject(arrayLike);
+    var C = typeof this == 'function' ? this : Array;
+    var aLen = arguments.length;
+    var mapfn = aLen > 1 ? arguments[1] : undefined;
+    var mapping = mapfn !== undefined;
+    var index = 0;
+    var iterFn = getIterFn(O);
+    var length, result, step, iterator;
+    if (mapping) mapfn = ctx(mapfn, aLen > 2 ? arguments[2] : undefined, 2);
+    // if object isn't iterable or it's array with default iterator - use simple case
+    if (iterFn != undefined && !(C == Array && isArrayIter(iterFn))) {
+      for (iterator = iterFn.call(O), result = new C(); !(step = iterator.next()).done; index++) {
+        createProperty(result, index, mapping ? call(iterator, mapfn, [step.value, index], true) : step.value);
+      }
+    } else {
+      length = toLength(O.length);
+      for (result = new C(length); length > index; index++) {
+        createProperty(result, index, mapping ? mapfn(O[index], index) : O[index]);
+      }
+    }
+    result.length = index;
+    return result;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.index-of.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.index-of.js
new file mode 100644
index 0000000..231c92e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.index-of.js
@@ -0,0 +1,15 @@
+'use strict';
+var $export = require('./_export');
+var $indexOf = require('./_array-includes')(false);
+var $native = [].indexOf;
+var NEGATIVE_ZERO = !!$native && 1 / [1].indexOf(1, -0) < 0;
+
+$export($export.P + $export.F * (NEGATIVE_ZERO || !require('./_strict-method')($native)), 'Array', {
+  // 22.1.3.11 / 15.4.4.14 Array.prototype.indexOf(searchElement [, fromIndex])
+  indexOf: function indexOf(searchElement /* , fromIndex = 0 */) {
+    return NEGATIVE_ZERO
+      // convert -0 to +0
+      ? $native.apply(this, arguments) || 0
+      : $indexOf(this, searchElement, arguments[1]);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.is-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.is-array.js
new file mode 100644
index 0000000..27ca6fc
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.is-array.js
@@ -0,0 +1,4 @@
+// 22.1.2.2 / 15.4.3.2 Array.isArray(arg)
+var $export = require('./_export');
+
+$export($export.S, 'Array', { isArray: require('./_is-array') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.iterator.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.iterator.js
new file mode 100644
index 0000000..c64e88b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.iterator.js
@@ -0,0 +1,34 @@
+'use strict';
+var addToUnscopables = require('./_add-to-unscopables');
+var step = require('./_iter-step');
+var Iterators = require('./_iterators');
+var toIObject = require('./_to-iobject');
+
+// 22.1.3.4 Array.prototype.entries()
+// 22.1.3.13 Array.prototype.keys()
+// 22.1.3.29 Array.prototype.values()
+// 22.1.3.30 Array.prototype[@@iterator]()
+module.exports = require('./_iter-define')(Array, 'Array', function (iterated, kind) {
+  this._t = toIObject(iterated); // target
+  this._i = 0;                   // next index
+  this._k = kind;                // kind
+// 22.1.5.2.1 %ArrayIteratorPrototype%.next()
+}, function () {
+  var O = this._t;
+  var kind = this._k;
+  var index = this._i++;
+  if (!O || index >= O.length) {
+    this._t = undefined;
+    return step(1);
+  }
+  if (kind == 'keys') return step(0, index);
+  if (kind == 'values') return step(0, O[index]);
+  return step(0, [index, O[index]]);
+}, 'values');
+
+// argumentsList[@@iterator] is %ArrayProto_values% (9.4.4.6, 9.4.4.7)
+Iterators.Arguments = Iterators.Array;
+
+addToUnscopables('keys');
+addToUnscopables('values');
+addToUnscopables('entries');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.join.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.join.js
new file mode 100644
index 0000000..48e55d2
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.join.js
@@ -0,0 +1,12 @@
+'use strict';
+// 22.1.3.13 Array.prototype.join(separator)
+var $export = require('./_export');
+var toIObject = require('./_to-iobject');
+var arrayJoin = [].join;
+
+// fallback for not array-like strings
+$export($export.P + $export.F * (require('./_iobject') != Object || !require('./_strict-method')(arrayJoin)), 'Array', {
+  join: function join(separator) {
+    return arrayJoin.call(toIObject(this), separator === undefined ? ',' : separator);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.last-index-of.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.last-index-of.js
new file mode 100644
index 0000000..1f70e34
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.last-index-of.js
@@ -0,0 +1,22 @@
+'use strict';
+var $export = require('./_export');
+var toIObject = require('./_to-iobject');
+var toInteger = require('./_to-integer');
+var toLength = require('./_to-length');
+var $native = [].lastIndexOf;
+var NEGATIVE_ZERO = !!$native && 1 / [1].lastIndexOf(1, -0) < 0;
+
+$export($export.P + $export.F * (NEGATIVE_ZERO || !require('./_strict-method')($native)), 'Array', {
+  // 22.1.3.14 / 15.4.4.15 Array.prototype.lastIndexOf(searchElement [, fromIndex])
+  lastIndexOf: function lastIndexOf(searchElement /* , fromIndex = @[*-1] */) {
+    // convert -0 to +0
+    if (NEGATIVE_ZERO) return $native.apply(this, arguments) || 0;
+    var O = toIObject(this);
+    var length = toLength(O.length);
+    var index = length - 1;
+    if (arguments.length > 1) index = Math.min(index, toInteger(arguments[1]));
+    if (index < 0) index = length + index;
+    for (;index >= 0; index--) if (index in O) if (O[index] === searchElement) return index || 0;
+    return -1;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.map.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.map.js
new file mode 100644
index 0000000..1326033
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.map.js
@@ -0,0 +1,10 @@
+'use strict';
+var $export = require('./_export');
+var $map = require('./_array-methods')(1);
+
+$export($export.P + $export.F * !require('./_strict-method')([].map, true), 'Array', {
+  // 22.1.3.15 / 15.4.4.19 Array.prototype.map(callbackfn [, thisArg])
+  map: function map(callbackfn /* , thisArg */) {
+    return $map(this, callbackfn, arguments[1]);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.of.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.of.js
new file mode 100644
index 0000000..b83e058
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.of.js
@@ -0,0 +1,19 @@
+'use strict';
+var $export = require('./_export');
+var createProperty = require('./_create-property');
+
+// WebKit Array.of isn't generic
+$export($export.S + $export.F * require('./_fails')(function () {
+  function F() { /* empty */ }
+  return !(Array.of.call(F) instanceof F);
+}), 'Array', {
+  // 22.1.2.3 Array.of( ...items)
+  of: function of(/* ...args */) {
+    var index = 0;
+    var aLen = arguments.length;
+    var result = new (typeof this == 'function' ? this : Array)(aLen);
+    while (aLen > index) createProperty(result, index, arguments[index++]);
+    result.length = aLen;
+    return result;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.reduce-right.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.reduce-right.js
new file mode 100644
index 0000000..168e421
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.reduce-right.js
@@ -0,0 +1,10 @@
+'use strict';
+var $export = require('./_export');
+var $reduce = require('./_array-reduce');
+
+$export($export.P + $export.F * !require('./_strict-method')([].reduceRight, true), 'Array', {
+  // 22.1.3.19 / 15.4.4.22 Array.prototype.reduceRight(callbackfn [, initialValue])
+  reduceRight: function reduceRight(callbackfn /* , initialValue */) {
+    return $reduce(this, callbackfn, arguments.length, arguments[1], true);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.reduce.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.reduce.js
new file mode 100644
index 0000000..f4e4761
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.reduce.js
@@ -0,0 +1,10 @@
+'use strict';
+var $export = require('./_export');
+var $reduce = require('./_array-reduce');
+
+$export($export.P + $export.F * !require('./_strict-method')([].reduce, true), 'Array', {
+  // 22.1.3.18 / 15.4.4.21 Array.prototype.reduce(callbackfn [, initialValue])
+  reduce: function reduce(callbackfn /* , initialValue */) {
+    return $reduce(this, callbackfn, arguments.length, arguments[1], false);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.slice.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.slice.js
new file mode 100644
index 0000000..bdd496e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.slice.js
@@ -0,0 +1,28 @@
+'use strict';
+var $export = require('./_export');
+var html = require('./_html');
+var cof = require('./_cof');
+var toAbsoluteIndex = require('./_to-absolute-index');
+var toLength = require('./_to-length');
+var arraySlice = [].slice;
+
+// fallback for not array-like ES3 strings and DOM objects
+$export($export.P + $export.F * require('./_fails')(function () {
+  if (html) arraySlice.call(html);
+}), 'Array', {
+  slice: function slice(begin, end) {
+    var len = toLength(this.length);
+    var klass = cof(this);
+    end = end === undefined ? len : end;
+    if (klass == 'Array') return arraySlice.call(this, begin, end);
+    var start = toAbsoluteIndex(begin, len);
+    var upTo = toAbsoluteIndex(end, len);
+    var size = toLength(upTo - start);
+    var cloned = new Array(size);
+    var i = 0;
+    for (; i < size; i++) cloned[i] = klass == 'String'
+      ? this.charAt(start + i)
+      : this[start + i];
+    return cloned;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.some.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.some.js
new file mode 100644
index 0000000..14c5eec
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.some.js
@@ -0,0 +1,10 @@
+'use strict';
+var $export = require('./_export');
+var $some = require('./_array-methods')(3);
+
+$export($export.P + $export.F * !require('./_strict-method')([].some, true), 'Array', {
+  // 22.1.3.23 / 15.4.4.17 Array.prototype.some(callbackfn [, thisArg])
+  some: function some(callbackfn /* , thisArg */) {
+    return $some(this, callbackfn, arguments[1]);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.sort.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.sort.js
new file mode 100644
index 0000000..39817ff
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.sort.js
@@ -0,0 +1,23 @@
+'use strict';
+var $export = require('./_export');
+var aFunction = require('./_a-function');
+var toObject = require('./_to-object');
+var fails = require('./_fails');
+var $sort = [].sort;
+var test = [1, 2, 3];
+
+$export($export.P + $export.F * (fails(function () {
+  // IE8-
+  test.sort(undefined);
+}) || !fails(function () {
+  // V8 bug
+  test.sort(null);
+  // Old WebKit
+}) || !require('./_strict-method')($sort)), 'Array', {
+  // 22.1.3.25 Array.prototype.sort(comparefn)
+  sort: function sort(comparefn) {
+    return comparefn === undefined
+      ? $sort.call(toObject(this))
+      : $sort.call(toObject(this), aFunction(comparefn));
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.species.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.species.js
new file mode 100644
index 0000000..ce0b891
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.array.species.js
@@ -0,0 +1 @@
+require('./_set-species')('Array');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.now.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.now.js
new file mode 100644
index 0000000..65f134e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.now.js
@@ -0,0 +1,4 @@
+// 20.3.3.1 / 15.9.4.4 Date.now()
+var $export = require('./_export');
+
+$export($export.S, 'Date', { now: function () { return new Date().getTime(); } });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-iso-string.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-iso-string.js
new file mode 100644
index 0000000..13b2781
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-iso-string.js
@@ -0,0 +1,8 @@
+// 20.3.4.36 / 15.9.5.43 Date.prototype.toISOString()
+var $export = require('./_export');
+var toISOString = require('./_date-to-iso-string');
+
+// PhantomJS / old WebKit has a broken implementations
+$export($export.P + $export.F * (Date.prototype.toISOString !== toISOString), 'Date', {
+  toISOString: toISOString
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-json.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-json.js
new file mode 100644
index 0000000..1508e04
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-json.js
@@ -0,0 +1,16 @@
+'use strict';
+var $export = require('./_export');
+var toObject = require('./_to-object');
+var toPrimitive = require('./_to-primitive');
+
+$export($export.P + $export.F * require('./_fails')(function () {
+  return new Date(NaN).toJSON() !== null
+    || Date.prototype.toJSON.call({ toISOString: function () { return 1; } }) !== 1;
+}), 'Date', {
+  // eslint-disable-next-line no-unused-vars
+  toJSON: function toJSON(key) {
+    var O = toObject(this);
+    var pv = toPrimitive(O);
+    return typeof pv == 'number' && !isFinite(pv) ? null : O.toISOString();
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-primitive.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-primitive.js
new file mode 100644
index 0000000..41754b9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-primitive.js
@@ -0,0 +1,4 @@
+var TO_PRIMITIVE = require('./_wks')('toPrimitive');
+var proto = Date.prototype;
+
+if (!(TO_PRIMITIVE in proto)) require('./_hide')(proto, TO_PRIMITIVE, require('./_date-to-primitive'));
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-string.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-string.js
new file mode 100644
index 0000000..15ee75a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.date.to-string.js
@@ -0,0 +1,12 @@
+var DateProto = Date.prototype;
+var INVALID_DATE = 'Invalid Date';
+var TO_STRING = 'toString';
+var $toString = DateProto[TO_STRING];
+var getTime = DateProto.getTime;
+if (new Date(NaN) + '' != INVALID_DATE) {
+  require('./_redefine')(DateProto, TO_STRING, function toString() {
+    var value = getTime.call(this);
+    // eslint-disable-next-line no-self-compare
+    return value === value ? $toString.call(this) : INVALID_DATE;
+  });
+}
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.function.bind.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.function.bind.js
new file mode 100644
index 0000000..38e84e1
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.function.bind.js
@@ -0,0 +1,4 @@
+// 19.2.3.2 / 15.3.4.5 Function.prototype.bind(thisArg, args...)
+var $export = require('./_export');
+
+$export($export.P, 'Function', { bind: require('./_bind') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.function.has-instance.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.function.has-instance.js
new file mode 100644
index 0000000..7556ed9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.function.has-instance.js
@@ -0,0 +1,13 @@
+'use strict';
+var isObject = require('./_is-object');
+var getPrototypeOf = require('./_object-gpo');
+var HAS_INSTANCE = require('./_wks')('hasInstance');
+var FunctionProto = Function.prototype;
+// 19.2.3.6 Function.prototype[@@hasInstance](V)
+if (!(HAS_INSTANCE in FunctionProto)) require('./_object-dp').f(FunctionProto, HAS_INSTANCE, { value: function (O) {
+  if (typeof this != 'function' || !isObject(O)) return false;
+  if (!isObject(this.prototype)) return O instanceof this;
+  // for environment w/o native `@@hasInstance` logic enough `instanceof`, but add this:
+  while (O = getPrototypeOf(O)) if (this.prototype === O) return true;
+  return false;
+} });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.function.name.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.function.name.js
new file mode 100644
index 0000000..05dd333
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.function.name.js
@@ -0,0 +1,16 @@
+var dP = require('./_object-dp').f;
+var FProto = Function.prototype;
+var nameRE = /^\s*function ([^ (]*)/;
+var NAME = 'name';
+
+// 19.2.4.2 name
+NAME in FProto || require('./_descriptors') && dP(FProto, NAME, {
+  configurable: true,
+  get: function () {
+    try {
+      return ('' + this).match(nameRE)[1];
+    } catch (e) {
+      return '';
+    }
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.map.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.map.js
new file mode 100644
index 0000000..a282f02
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.map.js
@@ -0,0 +1,19 @@
+'use strict';
+var strong = require('./_collection-strong');
+var validate = require('./_validate-collection');
+var MAP = 'Map';
+
+// 23.1 Map Objects
+module.exports = require('./_collection')(MAP, function (get) {
+  return function Map() { return get(this, arguments.length > 0 ? arguments[0] : undefined); };
+}, {
+  // 23.1.3.6 Map.prototype.get(key)
+  get: function get(key) {
+    var entry = strong.getEntry(validate(this, MAP), key);
+    return entry && entry.v;
+  },
+  // 23.1.3.9 Map.prototype.set(key, value)
+  set: function set(key, value) {
+    return strong.def(validate(this, MAP), key === 0 ? 0 : key, value);
+  }
+}, strong, true);
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.acosh.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.acosh.js
new file mode 100644
index 0000000..8a8989e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.acosh.js
@@ -0,0 +1,18 @@
+// 20.2.2.3 Math.acosh(x)
+var $export = require('./_export');
+var log1p = require('./_math-log1p');
+var sqrt = Math.sqrt;
+var $acosh = Math.acosh;
+
+$export($export.S + $export.F * !($acosh
+  // V8 bug: https://code.google.com/p/v8/issues/detail?id=3509
+  && Math.floor($acosh(Number.MAX_VALUE)) == 710
+  // Tor Browser bug: Math.acosh(Infinity) -> NaN
+  && $acosh(Infinity) == Infinity
+), 'Math', {
+  acosh: function acosh(x) {
+    return (x = +x) < 1 ? NaN : x > 94906265.62425156
+      ? Math.log(x) + Math.LN2
+      : log1p(x - 1 + sqrt(x - 1) * sqrt(x + 1));
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.asinh.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.asinh.js
new file mode 100644
index 0000000..ddf4666
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.asinh.js
@@ -0,0 +1,10 @@
+// 20.2.2.5 Math.asinh(x)
+var $export = require('./_export');
+var $asinh = Math.asinh;
+
+function asinh(x) {
+  return !isFinite(x = +x) || x == 0 ? x : x < 0 ? -asinh(-x) : Math.log(x + Math.sqrt(x * x + 1));
+}
+
+// Tor Browser bug: Math.asinh(0) -> -0
+$export($export.S + $export.F * !($asinh && 1 / $asinh(0) > 0), 'Math', { asinh: asinh });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.atanh.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.atanh.js
new file mode 100644
index 0000000..af3c3e8
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.atanh.js
@@ -0,0 +1,10 @@
+// 20.2.2.7 Math.atanh(x)
+var $export = require('./_export');
+var $atanh = Math.atanh;
+
+// Tor Browser bug: Math.atanh(-0) -> 0
+$export($export.S + $export.F * !($atanh && 1 / $atanh(-0) < 0), 'Math', {
+  atanh: function atanh(x) {
+    return (x = +x) == 0 ? x : Math.log((1 + x) / (1 - x)) / 2;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.cbrt.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.cbrt.js
new file mode 100644
index 0000000..e45ac44
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.cbrt.js
@@ -0,0 +1,9 @@
+// 20.2.2.9 Math.cbrt(x)
+var $export = require('./_export');
+var sign = require('./_math-sign');
+
+$export($export.S, 'Math', {
+  cbrt: function cbrt(x) {
+    return sign(x = +x) * Math.pow(Math.abs(x), 1 / 3);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.clz32.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.clz32.js
new file mode 100644
index 0000000..1e4d7e1
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.clz32.js
@@ -0,0 +1,8 @@
+// 20.2.2.11 Math.clz32(x)
+var $export = require('./_export');
+
+$export($export.S, 'Math', {
+  clz32: function clz32(x) {
+    return (x >>>= 0) ? 31 - Math.floor(Math.log(x + 0.5) * Math.LOG2E) : 32;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.cosh.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.cosh.js
new file mode 100644
index 0000000..1e0cffc
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.cosh.js
@@ -0,0 +1,9 @@
+// 20.2.2.12 Math.cosh(x)
+var $export = require('./_export');
+var exp = Math.exp;
+
+$export($export.S, 'Math', {
+  cosh: function cosh(x) {
+    return (exp(x = +x) + exp(-x)) / 2;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.expm1.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.expm1.js
new file mode 100644
index 0000000..da4c90d
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.expm1.js
@@ -0,0 +1,5 @@
+// 20.2.2.14 Math.expm1(x)
+var $export = require('./_export');
+var $expm1 = require('./_math-expm1');
+
+$export($export.S + $export.F * ($expm1 != Math.expm1), 'Math', { expm1: $expm1 });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.fround.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.fround.js
new file mode 100644
index 0000000..9c262f2
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.fround.js
@@ -0,0 +1,4 @@
+// 20.2.2.16 Math.fround(x)
+var $export = require('./_export');
+
+$export($export.S, 'Math', { fround: require('./_math-fround') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.hypot.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.hypot.js
new file mode 100644
index 0000000..41ffdb2
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.hypot.js
@@ -0,0 +1,25 @@
+// 20.2.2.17 Math.hypot([value1[, value2[, … ]]])
+var $export = require('./_export');
+var abs = Math.abs;
+
+$export($export.S, 'Math', {
+  hypot: function hypot(value1, value2) { // eslint-disable-line no-unused-vars
+    var sum = 0;
+    var i = 0;
+    var aLen = arguments.length;
+    var larg = 0;
+    var arg, div;
+    while (i < aLen) {
+      arg = abs(arguments[i++]);
+      if (larg < arg) {
+        div = larg / arg;
+        sum = sum * div * div + 1;
+        larg = arg;
+      } else if (arg > 0) {
+        div = arg / larg;
+        sum += div * div;
+      } else sum += arg;
+    }
+    return larg === Infinity ? Infinity : larg * Math.sqrt(sum);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.imul.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.imul.js
new file mode 100644
index 0000000..96e683d
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.imul.js
@@ -0,0 +1,17 @@
+// 20.2.2.18 Math.imul(x, y)
+var $export = require('./_export');
+var $imul = Math.imul;
+
+// some WebKit versions fails with big numbers, some has wrong arity
+$export($export.S + $export.F * require('./_fails')(function () {
+  return $imul(0xffffffff, 5) != -5 || $imul.length != 2;
+}), 'Math', {
+  imul: function imul(x, y) {
+    var UINT16 = 0xffff;
+    var xn = +x;
+    var yn = +y;
+    var xl = UINT16 & xn;
+    var yl = UINT16 & yn;
+    return 0 | xl * yl + ((UINT16 & xn >>> 16) * yl + xl * (UINT16 & yn >>> 16) << 16 >>> 0);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.log10.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.log10.js
new file mode 100644
index 0000000..9ee8ae6
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.log10.js
@@ -0,0 +1,8 @@
+// 20.2.2.21 Math.log10(x)
+var $export = require('./_export');
+
+$export($export.S, 'Math', {
+  log10: function log10(x) {
+    return Math.log(x) * Math.LOG10E;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.log1p.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.log1p.js
new file mode 100644
index 0000000..6295980
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.log1p.js
@@ -0,0 +1,4 @@
+// 20.2.2.20 Math.log1p(x)
+var $export = require('./_export');
+
+$export($export.S, 'Math', { log1p: require('./_math-log1p') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.log2.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.log2.js
new file mode 100644
index 0000000..03d127c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.log2.js
@@ -0,0 +1,8 @@
+// 20.2.2.22 Math.log2(x)
+var $export = require('./_export');
+
+$export($export.S, 'Math', {
+  log2: function log2(x) {
+    return Math.log(x) / Math.LN2;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.sign.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.sign.js
new file mode 100644
index 0000000..981f69e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.sign.js
@@ -0,0 +1,4 @@
+// 20.2.2.28 Math.sign(x)
+var $export = require('./_export');
+
+$export($export.S, 'Math', { sign: require('./_math-sign') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.sinh.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.sinh.js
new file mode 100644
index 0000000..5760633
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.sinh.js
@@ -0,0 +1,15 @@
+// 20.2.2.30 Math.sinh(x)
+var $export = require('./_export');
+var expm1 = require('./_math-expm1');
+var exp = Math.exp;
+
+// V8 near Chromium 38 has a problem with very small numbers
+$export($export.S + $export.F * require('./_fails')(function () {
+  return !Math.sinh(-2e-17) != -2e-17;
+}), 'Math', {
+  sinh: function sinh(x) {
+    return Math.abs(x = +x) < 1
+      ? (expm1(x) - expm1(-x)) / 2
+      : (exp(x - 1) - exp(-x - 1)) * (Math.E / 2);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.tanh.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.tanh.js
new file mode 100644
index 0000000..0d3135b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.tanh.js
@@ -0,0 +1,12 @@
+// 20.2.2.33 Math.tanh(x)
+var $export = require('./_export');
+var expm1 = require('./_math-expm1');
+var exp = Math.exp;
+
+$export($export.S, 'Math', {
+  tanh: function tanh(x) {
+    var a = expm1(x = +x);
+    var b = expm1(-x);
+    return a == Infinity ? 1 : b == Infinity ? -1 : (a - b) / (exp(x) + exp(-x));
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.trunc.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.trunc.js
new file mode 100644
index 0000000..35ddb80
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.math.trunc.js
@@ -0,0 +1,8 @@
+// 20.2.2.34 Math.trunc(x)
+var $export = require('./_export');
+
+$export($export.S, 'Math', {
+  trunc: function trunc(it) {
+    return (it > 0 ? Math.floor : Math.ceil)(it);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.constructor.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.constructor.js
new file mode 100644
index 0000000..aee40e9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.constructor.js
@@ -0,0 +1,69 @@
+'use strict';
+var global = require('./_global');
+var has = require('./_has');
+var cof = require('./_cof');
+var inheritIfRequired = require('./_inherit-if-required');
+var toPrimitive = require('./_to-primitive');
+var fails = require('./_fails');
+var gOPN = require('./_object-gopn').f;
+var gOPD = require('./_object-gopd').f;
+var dP = require('./_object-dp').f;
+var $trim = require('./_string-trim').trim;
+var NUMBER = 'Number';
+var $Number = global[NUMBER];
+var Base = $Number;
+var proto = $Number.prototype;
+// Opera ~12 has broken Object#toString
+var BROKEN_COF = cof(require('./_object-create')(proto)) == NUMBER;
+var TRIM = 'trim' in String.prototype;
+
+// 7.1.3 ToNumber(argument)
+var toNumber = function (argument) {
+  var it = toPrimitive(argument, false);
+  if (typeof it == 'string' && it.length > 2) {
+    it = TRIM ? it.trim() : $trim(it, 3);
+    var first = it.charCodeAt(0);
+    var third, radix, maxCode;
+    if (first === 43 || first === 45) {
+      third = it.charCodeAt(2);
+      if (third === 88 || third === 120) return NaN; // Number('+0x1') should be NaN, old V8 fix
+    } else if (first === 48) {
+      switch (it.charCodeAt(1)) {
+        case 66: case 98: radix = 2; maxCode = 49; break; // fast equal /^0b[01]+$/i
+        case 79: case 111: radix = 8; maxCode = 55; break; // fast equal /^0o[0-7]+$/i
+        default: return +it;
+      }
+      for (var digits = it.slice(2), i = 0, l = digits.length, code; i < l; i++) {
+        code = digits.charCodeAt(i);
+        // parseInt parses a string to a first unavailable symbol
+        // but ToNumber should return NaN if a string contains unavailable symbols
+        if (code < 48 || code > maxCode) return NaN;
+      } return parseInt(digits, radix);
+    }
+  } return +it;
+};
+
+if (!$Number(' 0o1') || !$Number('0b1') || $Number('+0x1')) {
+  $Number = function Number(value) {
+    var it = arguments.length < 1 ? 0 : value;
+    var that = this;
+    return that instanceof $Number
+      // check on 1..constructor(foo) case
+      && (BROKEN_COF ? fails(function () { proto.valueOf.call(that); }) : cof(that) != NUMBER)
+        ? inheritIfRequired(new Base(toNumber(it)), that, $Number) : toNumber(it);
+  };
+  for (var keys = require('./_descriptors') ? gOPN(Base) : (
+    // ES3:
+    'MAX_VALUE,MIN_VALUE,NaN,NEGATIVE_INFINITY,POSITIVE_INFINITY,' +
+    // ES6 (in case, if modules with ES6 Number statics required before):
+    'EPSILON,isFinite,isInteger,isNaN,isSafeInteger,MAX_SAFE_INTEGER,' +
+    'MIN_SAFE_INTEGER,parseFloat,parseInt,isInteger'
+  ).split(','), j = 0, key; keys.length > j; j++) {
+    if (has(Base, key = keys[j]) && !has($Number, key)) {
+      dP($Number, key, gOPD(Base, key));
+    }
+  }
+  $Number.prototype = proto;
+  proto.constructor = $Number;
+  require('./_redefine')(global, NUMBER, $Number);
+}
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.epsilon.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.epsilon.js
new file mode 100644
index 0000000..34a2ec5
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.epsilon.js
@@ -0,0 +1,4 @@
+// 20.1.2.1 Number.EPSILON
+var $export = require('./_export');
+
+$export($export.S, 'Number', { EPSILON: Math.pow(2, -52) });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-finite.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-finite.js
new file mode 100644
index 0000000..8719da9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-finite.js
@@ -0,0 +1,9 @@
+// 20.1.2.2 Number.isFinite(number)
+var $export = require('./_export');
+var _isFinite = require('./_global').isFinite;
+
+$export($export.S, 'Number', {
+  isFinite: function isFinite(it) {
+    return typeof it == 'number' && _isFinite(it);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-integer.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-integer.js
new file mode 100644
index 0000000..f1ab5dc
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-integer.js
@@ -0,0 +1,4 @@
+// 20.1.2.3 Number.isInteger(number)
+var $export = require('./_export');
+
+$export($export.S, 'Number', { isInteger: require('./_is-integer') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-nan.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-nan.js
new file mode 100644
index 0000000..01d76ba
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-nan.js
@@ -0,0 +1,9 @@
+// 20.1.2.4 Number.isNaN(number)
+var $export = require('./_export');
+
+$export($export.S, 'Number', {
+  isNaN: function isNaN(number) {
+    // eslint-disable-next-line no-self-compare
+    return number != number;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-safe-integer.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-safe-integer.js
new file mode 100644
index 0000000..004e7d1
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.is-safe-integer.js
@@ -0,0 +1,10 @@
+// 20.1.2.5 Number.isSafeInteger(number)
+var $export = require('./_export');
+var isInteger = require('./_is-integer');
+var abs = Math.abs;
+
+$export($export.S, 'Number', {
+  isSafeInteger: function isSafeInteger(number) {
+    return isInteger(number) && abs(number) <= 0x1fffffffffffff;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.max-safe-integer.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.max-safe-integer.js
new file mode 100644
index 0000000..a4f248f
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.max-safe-integer.js
@@ -0,0 +1,4 @@
+// 20.1.2.6 Number.MAX_SAFE_INTEGER
+var $export = require('./_export');
+
+$export($export.S, 'Number', { MAX_SAFE_INTEGER: 0x1fffffffffffff });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.min-safe-integer.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.min-safe-integer.js
new file mode 100644
index 0000000..34df374
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.min-safe-integer.js
@@ -0,0 +1,4 @@
+// 20.1.2.10 Number.MIN_SAFE_INTEGER
+var $export = require('./_export');
+
+$export($export.S, 'Number', { MIN_SAFE_INTEGER: -0x1fffffffffffff });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.parse-float.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.parse-float.js
new file mode 100644
index 0000000..317c431
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.parse-float.js
@@ -0,0 +1,4 @@
+var $export = require('./_export');
+var $parseFloat = require('./_parse-float');
+// 20.1.2.12 Number.parseFloat(string)
+$export($export.S + $export.F * (Number.parseFloat != $parseFloat), 'Number', { parseFloat: $parseFloat });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.parse-int.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.parse-int.js
new file mode 100644
index 0000000..cb48da2
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.parse-int.js
@@ -0,0 +1,4 @@
+var $export = require('./_export');
+var $parseInt = require('./_parse-int');
+// 20.1.2.13 Number.parseInt(string, radix)
+$export($export.S + $export.F * (Number.parseInt != $parseInt), 'Number', { parseInt: $parseInt });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.to-fixed.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.to-fixed.js
new file mode 100644
index 0000000..2bf78af
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.to-fixed.js
@@ -0,0 +1,114 @@
+'use strict';
+var $export = require('./_export');
+var toInteger = require('./_to-integer');
+var aNumberValue = require('./_a-number-value');
+var repeat = require('./_string-repeat');
+var $toFixed = 1.0.toFixed;
+var floor = Math.floor;
+var data = [0, 0, 0, 0, 0, 0];
+var ERROR = 'Number.toFixed: incorrect invocation!';
+var ZERO = '0';
+
+var multiply = function (n, c) {
+  var i = -1;
+  var c2 = c;
+  while (++i < 6) {
+    c2 += n * data[i];
+    data[i] = c2 % 1e7;
+    c2 = floor(c2 / 1e7);
+  }
+};
+var divide = function (n) {
+  var i = 6;
+  var c = 0;
+  while (--i >= 0) {
+    c += data[i];
+    data[i] = floor(c / n);
+    c = (c % n) * 1e7;
+  }
+};
+var numToString = function () {
+  var i = 6;
+  var s = '';
+  while (--i >= 0) {
+    if (s !== '' || i === 0 || data[i] !== 0) {
+      var t = String(data[i]);
+      s = s === '' ? t : s + repeat.call(ZERO, 7 - t.length) + t;
+    }
+  } return s;
+};
+var pow = function (x, n, acc) {
+  return n === 0 ? acc : n % 2 === 1 ? pow(x, n - 1, acc * x) : pow(x * x, n / 2, acc);
+};
+var log = function (x) {
+  var n = 0;
+  var x2 = x;
+  while (x2 >= 4096) {
+    n += 12;
+    x2 /= 4096;
+  }
+  while (x2 >= 2) {
+    n += 1;
+    x2 /= 2;
+  } return n;
+};
+
+$export($export.P + $export.F * (!!$toFixed && (
+  0.00008.toFixed(3) !== '0.000' ||
+  0.9.toFixed(0) !== '1' ||
+  1.255.toFixed(2) !== '1.25' ||
+  1000000000000000128.0.toFixed(0) !== '1000000000000000128'
+) || !require('./_fails')(function () {
+  // V8 ~ Android 4.3-
+  $toFixed.call({});
+})), 'Number', {
+  toFixed: function toFixed(fractionDigits) {
+    var x = aNumberValue(this, ERROR);
+    var f = toInteger(fractionDigits);
+    var s = '';
+    var m = ZERO;
+    var e, z, j, k;
+    if (f < 0 || f > 20) throw RangeError(ERROR);
+    // eslint-disable-next-line no-self-compare
+    if (x != x) return 'NaN';
+    if (x <= -1e21 || x >= 1e21) return String(x);
+    if (x < 0) {
+      s = '-';
+      x = -x;
+    }
+    if (x > 1e-21) {
+      e = log(x * pow(2, 69, 1)) - 69;
+      z = e < 0 ? x * pow(2, -e, 1) : x / pow(2, e, 1);
+      z *= 0x10000000000000;
+      e = 52 - e;
+      if (e > 0) {
+        multiply(0, z);
+        j = f;
+        while (j >= 7) {
+          multiply(1e7, 0);
+          j -= 7;
+        }
+        multiply(pow(10, j, 1), 0);
+        j = e - 1;
+        while (j >= 23) {
+          divide(1 << 23);
+          j -= 23;
+        }
+        divide(1 << j);
+        multiply(1, 1);
+        divide(2);
+        m = numToString();
+      } else {
+        multiply(0, z);
+        multiply(1 << -e, 0);
+        m = numToString() + repeat.call(ZERO, f);
+      }
+    }
+    if (f > 0) {
+      k = m.length;
+      m = s + (k <= f ? '0.' + repeat.call(ZERO, f - k) + m : m.slice(0, k - f) + '.' + m.slice(k - f));
+    } else {
+      m = s + m;
+    } return m;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.to-precision.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.to-precision.js
new file mode 100644
index 0000000..0d92527
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.number.to-precision.js
@@ -0,0 +1,18 @@
+'use strict';
+var $export = require('./_export');
+var $fails = require('./_fails');
+var aNumberValue = require('./_a-number-value');
+var $toPrecision = 1.0.toPrecision;
+
+$export($export.P + $export.F * ($fails(function () {
+  // IE7-
+  return $toPrecision.call(1, undefined) !== '1';
+}) || !$fails(function () {
+  // V8 ~ Android 4.3-
+  $toPrecision.call({});
+})), 'Number', {
+  toPrecision: function toPrecision(precision) {
+    var that = aNumberValue(this, 'Number#toPrecision: incorrect invocation!');
+    return precision === undefined ? $toPrecision.call(that) : $toPrecision.call(that, precision);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.assign.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.assign.js
new file mode 100644
index 0000000..d28085a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.assign.js
@@ -0,0 +1,4 @@
+// 19.1.3.1 Object.assign(target, source)
+var $export = require('./_export');
+
+$export($export.S + $export.F, 'Object', { assign: require('./_object-assign') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.create.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.create.js
new file mode 100644
index 0000000..70627d6
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.create.js
@@ -0,0 +1,3 @@
+var $export = require('./_export');
+// 19.1.2.2 / 15.2.3.5 Object.create(O [, Properties])
+$export($export.S, 'Object', { create: require('./_object-create') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.define-properties.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.define-properties.js
new file mode 100644
index 0000000..5ec3421
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.define-properties.js
@@ -0,0 +1,3 @@
+var $export = require('./_export');
+// 19.1.2.3 / 15.2.3.7 Object.defineProperties(O, Properties)
+$export($export.S + $export.F * !require('./_descriptors'), 'Object', { defineProperties: require('./_object-dps') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.define-property.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.define-property.js
new file mode 100644
index 0000000..1206858
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.define-property.js
@@ -0,0 +1,3 @@
+var $export = require('./_export');
+// 19.1.2.4 / 15.2.3.6 Object.defineProperty(O, P, Attributes)
+$export($export.S + $export.F * !require('./_descriptors'), 'Object', { defineProperty: require('./_object-dp').f });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.freeze.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.freeze.js
new file mode 100644
index 0000000..0856ce9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.freeze.js
@@ -0,0 +1,9 @@
+// 19.1.2.5 Object.freeze(O)
+var isObject = require('./_is-object');
+var meta = require('./_meta').onFreeze;
+
+require('./_object-sap')('freeze', function ($freeze) {
+  return function freeze(it) {
+    return $freeze && isObject(it) ? $freeze(meta(it)) : it;
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.get-own-property-descriptor.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.get-own-property-descriptor.js
new file mode 100644
index 0000000..9df2141
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.get-own-property-descriptor.js
@@ -0,0 +1,9 @@
+// 19.1.2.6 Object.getOwnPropertyDescriptor(O, P)
+var toIObject = require('./_to-iobject');
+var $getOwnPropertyDescriptor = require('./_object-gopd').f;
+
+require('./_object-sap')('getOwnPropertyDescriptor', function () {
+  return function getOwnPropertyDescriptor(it, key) {
+    return $getOwnPropertyDescriptor(toIObject(it), key);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.get-own-property-names.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.get-own-property-names.js
new file mode 100644
index 0000000..172f51c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.get-own-property-names.js
@@ -0,0 +1,4 @@
+// 19.1.2.7 Object.getOwnPropertyNames(O)
+require('./_object-sap')('getOwnPropertyNames', function () {
+  return require('./_object-gopn-ext').f;
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.get-prototype-of.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.get-prototype-of.js
new file mode 100644
index 0000000..8fe2728
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.get-prototype-of.js
@@ -0,0 +1,9 @@
+// 19.1.2.9 Object.getPrototypeOf(O)
+var toObject = require('./_to-object');
+var $getPrototypeOf = require('./_object-gpo');
+
+require('./_object-sap')('getPrototypeOf', function () {
+  return function getPrototypeOf(it) {
+    return $getPrototypeOf(toObject(it));
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is-extensible.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is-extensible.js
new file mode 100644
index 0000000..5cd4575
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is-extensible.js
@@ -0,0 +1,8 @@
+// 19.1.2.11 Object.isExtensible(O)
+var isObject = require('./_is-object');
+
+require('./_object-sap')('isExtensible', function ($isExtensible) {
+  return function isExtensible(it) {
+    return isObject(it) ? $isExtensible ? $isExtensible(it) : true : false;
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is-frozen.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is-frozen.js
new file mode 100644
index 0000000..0ceeabb
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is-frozen.js
@@ -0,0 +1,8 @@
+// 19.1.2.12 Object.isFrozen(O)
+var isObject = require('./_is-object');
+
+require('./_object-sap')('isFrozen', function ($isFrozen) {
+  return function isFrozen(it) {
+    return isObject(it) ? $isFrozen ? $isFrozen(it) : false : true;
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is-sealed.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is-sealed.js
new file mode 100644
index 0000000..7fa8dde
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is-sealed.js
@@ -0,0 +1,8 @@
+// 19.1.2.13 Object.isSealed(O)
+var isObject = require('./_is-object');
+
+require('./_object-sap')('isSealed', function ($isSealed) {
+  return function isSealed(it) {
+    return isObject(it) ? $isSealed ? $isSealed(it) : false : true;
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is.js
new file mode 100644
index 0000000..204d703
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.is.js
@@ -0,0 +1,3 @@
+// 19.1.3.10 Object.is(value1, value2)
+var $export = require('./_export');
+$export($export.S, 'Object', { is: require('./_same-value') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.keys.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.keys.js
new file mode 100644
index 0000000..e9dade7
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.keys.js
@@ -0,0 +1,9 @@
+// 19.1.2.14 Object.keys(O)
+var toObject = require('./_to-object');
+var $keys = require('./_object-keys');
+
+require('./_object-sap')('keys', function () {
+  return function keys(it) {
+    return $keys(toObject(it));
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.prevent-extensions.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.prevent-extensions.js
new file mode 100644
index 0000000..2f72918
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.prevent-extensions.js
@@ -0,0 +1,9 @@
+// 19.1.2.15 Object.preventExtensions(O)
+var isObject = require('./_is-object');
+var meta = require('./_meta').onFreeze;
+
+require('./_object-sap')('preventExtensions', function ($preventExtensions) {
+  return function preventExtensions(it) {
+    return $preventExtensions && isObject(it) ? $preventExtensions(meta(it)) : it;
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.seal.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.seal.js
new file mode 100644
index 0000000..12c3f6a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.seal.js
@@ -0,0 +1,9 @@
+// 19.1.2.17 Object.seal(O)
+var isObject = require('./_is-object');
+var meta = require('./_meta').onFreeze;
+
+require('./_object-sap')('seal', function ($seal) {
+  return function seal(it) {
+    return $seal && isObject(it) ? $seal(meta(it)) : it;
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.set-prototype-of.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.set-prototype-of.js
new file mode 100644
index 0000000..461dbd2
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.set-prototype-of.js
@@ -0,0 +1,3 @@
+// 19.1.3.19 Object.setPrototypeOf(O, proto)
+var $export = require('./_export');
+$export($export.S, 'Object', { setPrototypeOf: require('./_set-proto').set });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.to-string.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.to-string.js
new file mode 100644
index 0000000..1c7b85f
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.object.to-string.js
@@ -0,0 +1,10 @@
+'use strict';
+// 19.1.3.6 Object.prototype.toString()
+var classof = require('./_classof');
+var test = {};
+test[require('./_wks')('toStringTag')] = 'z';
+if (test + '' != '[object z]') {
+  require('./_redefine')(Object.prototype, 'toString', function toString() {
+    return '[object ' + classof(this) + ']';
+  }, true);
+}
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.parse-float.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.parse-float.js
new file mode 100644
index 0000000..cbf50ea
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.parse-float.js
@@ -0,0 +1,4 @@
+var $export = require('./_export');
+var $parseFloat = require('./_parse-float');
+// 18.2.4 parseFloat(string)
+$export($export.G + $export.F * (parseFloat != $parseFloat), { parseFloat: $parseFloat });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.parse-int.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.parse-int.js
new file mode 100644
index 0000000..7ea358e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.parse-int.js
@@ -0,0 +1,4 @@
+var $export = require('./_export');
+var $parseInt = require('./_parse-int');
+// 18.2.5 parseInt(string, radix)
+$export($export.G + $export.F * (parseInt != $parseInt), { parseInt: $parseInt });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.promise.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.promise.js
new file mode 100644
index 0000000..b0ff3bf
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.promise.js
@@ -0,0 +1,286 @@
+'use strict';
+var LIBRARY = require('./_library');
+var global = require('./_global');
+var ctx = require('./_ctx');
+var classof = require('./_classof');
+var $export = require('./_export');
+var isObject = require('./_is-object');
+var aFunction = require('./_a-function');
+var anInstance = require('./_an-instance');
+var forOf = require('./_for-of');
+var speciesConstructor = require('./_species-constructor');
+var task = require('./_task').set;
+var microtask = require('./_microtask')();
+var newPromiseCapabilityModule = require('./_new-promise-capability');
+var perform = require('./_perform');
+var userAgent = require('./_user-agent');
+var promiseResolve = require('./_promise-resolve');
+var PROMISE = 'Promise';
+var TypeError = global.TypeError;
+var process = global.process;
+var versions = process && process.versions;
+var v8 = versions && versions.v8 || '';
+var $Promise = global[PROMISE];
+var isNode = classof(process) == 'process';
+var empty = function () { /* empty */ };
+var Internal, newGenericPromiseCapability, OwnPromiseCapability, Wrapper;
+var newPromiseCapability = newGenericPromiseCapability = newPromiseCapabilityModule.f;
+
+var USE_NATIVE = !!function () {
+  try {
+    // correct subclassing with @@species support
+    var promise = $Promise.resolve(1);
+    var FakePromise = (promise.constructor = {})[require('./_wks')('species')] = function (exec) {
+      exec(empty, empty);
+    };
+    // unhandled rejections tracking support, NodeJS Promise without it fails @@species test
+    return (isNode || typeof PromiseRejectionEvent == 'function')
+      && promise.then(empty) instanceof FakePromise
+      // v8 6.6 (Node 10 and Chrome 66) have a bug with resolving custom thenables
+      // https://bugs.chromium.org/p/chromium/issues/detail?id=830565
+      // we can't detect it synchronously, so just check versions
+      && v8.indexOf('6.6') !== 0
+      && userAgent.indexOf('Chrome/66') === -1;
+  } catch (e) { /* empty */ }
+}();
+
+// helpers
+var isThenable = function (it) {
+  var then;
+  return isObject(it) && typeof (then = it.then) == 'function' ? then : false;
+};
+var notify = function (promise, isReject) {
+  if (promise._n) return;
+  promise._n = true;
+  var chain = promise._c;
+  microtask(function () {
+    var value = promise._v;
+    var ok = promise._s == 1;
+    var i = 0;
+    var run = function (reaction) {
+      var handler = ok ? reaction.ok : reaction.fail;
+      var resolve = reaction.resolve;
+      var reject = reaction.reject;
+      var domain = reaction.domain;
+      var result, then, exited;
+      try {
+        if (handler) {
+          if (!ok) {
+            if (promise._h == 2) onHandleUnhandled(promise);
+            promise._h = 1;
+          }
+          if (handler === true) result = value;
+          else {
+            if (domain) domain.enter();
+            result = handler(value); // may throw
+            if (domain) {
+              domain.exit();
+              exited = true;
+            }
+          }
+          if (result === reaction.promise) {
+            reject(TypeError('Promise-chain cycle'));
+          } else if (then = isThenable(result)) {
+            then.call(result, resolve, reject);
+          } else resolve(result);
+        } else reject(value);
+      } catch (e) {
+        if (domain && !exited) domain.exit();
+        reject(e);
+      }
+    };
+    while (chain.length > i) run(chain[i++]); // variable length - can't use forEach
+    promise._c = [];
+    promise._n = false;
+    if (isReject && !promise._h) onUnhandled(promise);
+  });
+};
+var onUnhandled = function (promise) {
+  task.call(global, function () {
+    var value = promise._v;
+    var unhandled = isUnhandled(promise);
+    var result, handler, console;
+    if (unhandled) {
+      result = perform(function () {
+        if (isNode) {
+          process.emit('unhandledRejection', value, promise);
+        } else if (handler = global.onunhandledrejection) {
+          handler({ promise: promise, reason: value });
+        } else if ((console = global.console) && console.error) {
+          console.error('Unhandled promise rejection', value);
+        }
+      });
+      // Browsers should not trigger `rejectionHandled` event if it was handled here, NodeJS - should
+      promise._h = isNode || isUnhandled(promise) ? 2 : 1;
+    } promise._a = undefined;
+    if (unhandled && result.e) throw result.v;
+  });
+};
+var isUnhandled = function (promise) {
+  return promise._h !== 1 && (promise._a || promise._c).length === 0;
+};
+var onHandleUnhandled = function (promise) {
+  task.call(global, function () {
+    var handler;
+    if (isNode) {
+      process.emit('rejectionHandled', promise);
+    } else if (handler = global.onrejectionhandled) {
+      handler({ promise: promise, reason: promise._v });
+    }
+  });
+};
+var $reject = function (value) {
+  var promise = this;
+  if (promise._d) return;
+  promise._d = true;
+  promise = promise._w || promise; // unwrap
+  promise._v = value;
+  promise._s = 2;
+  if (!promise._a) promise._a = promise._c.slice();
+  notify(promise, true);
+};
+var $resolve = function (value) {
+  var promise = this;
+  var then;
+  if (promise._d) return;
+  promise._d = true;
+  promise = promise._w || promise; // unwrap
+  try {
+    if (promise === value) throw TypeError("Promise can't be resolved itself");
+    if (then = isThenable(value)) {
+      microtask(function () {
+        var wrapper = { _w: promise, _d: false }; // wrap
+        try {
+          then.call(value, ctx($resolve, wrapper, 1), ctx($reject, wrapper, 1));
+        } catch (e) {
+          $reject.call(wrapper, e);
+        }
+      });
+    } else {
+      promise._v = value;
+      promise._s = 1;
+      notify(promise, false);
+    }
+  } catch (e) {
+    $reject.call({ _w: promise, _d: false }, e); // wrap
+  }
+};
+
+// constructor polyfill
+if (!USE_NATIVE) {
+  // 25.4.3.1 Promise(executor)
+  $Promise = function Promise(executor) {
+    anInstance(this, $Promise, PROMISE, '_h');
+    aFunction(executor);
+    Internal.call(this);
+    try {
+      executor(ctx($resolve, this, 1), ctx($reject, this, 1));
+    } catch (err) {
+      $reject.call(this, err);
+    }
+  };
+  // eslint-disable-next-line no-unused-vars
+  Internal = function Promise(executor) {
+    this._c = [];             // <- awaiting reactions
+    this._a = undefined;      // <- checked in isUnhandled reactions
+    this._s = 0;              // <- state
+    this._d = false;          // <- done
+    this._v = undefined;      // <- value
+    this._h = 0;              // <- rejection state, 0 - default, 1 - handled, 2 - unhandled
+    this._n = false;          // <- notify
+  };
+  Internal.prototype = require('./_redefine-all')($Promise.prototype, {
+    // 25.4.5.3 Promise.prototype.then(onFulfilled, onRejected)
+    then: function then(onFulfilled, onRejected) {
+      var reaction = newPromiseCapability(speciesConstructor(this, $Promise));
+      reaction.ok = typeof onFulfilled == 'function' ? onFulfilled : true;
+      reaction.fail = typeof onRejected == 'function' && onRejected;
+      reaction.domain = isNode ? process.domain : undefined;
+      this._c.push(reaction);
+      if (this._a) this._a.push(reaction);
+      if (this._s) notify(this, false);
+      return reaction.promise;
+    },
+    // 25.4.5.1 Promise.prototype.catch(onRejected)
+    'catch': function (onRejected) {
+      return this.then(undefined, onRejected);
+    }
+  });
+  OwnPromiseCapability = function () {
+    var promise = new Internal();
+    this.promise = promise;
+    this.resolve = ctx($resolve, promise, 1);
+    this.reject = ctx($reject, promise, 1);
+  };
+  newPromiseCapabilityModule.f = newPromiseCapability = function (C) {
+    return C === $Promise || C === Wrapper
+      ? new OwnPromiseCapability(C)
+      : newGenericPromiseCapability(C);
+  };
+}
+
+$export($export.G + $export.W + $export.F * !USE_NATIVE, { Promise: $Promise });
+require('./_set-to-string-tag')($Promise, PROMISE);
+require('./_set-species')(PROMISE);
+Wrapper = require('./_core')[PROMISE];
+
+// statics
+$export($export.S + $export.F * !USE_NATIVE, PROMISE, {
+  // 25.4.4.5 Promise.reject(r)
+  reject: function reject(r) {
+    var capability = newPromiseCapability(this);
+    var $$reject = capability.reject;
+    $$reject(r);
+    return capability.promise;
+  }
+});
+$export($export.S + $export.F * (LIBRARY || !USE_NATIVE), PROMISE, {
+  // 25.4.4.6 Promise.resolve(x)
+  resolve: function resolve(x) {
+    return promiseResolve(LIBRARY && this === Wrapper ? $Promise : this, x);
+  }
+});
+$export($export.S + $export.F * !(USE_NATIVE && require('./_iter-detect')(function (iter) {
+  $Promise.all(iter)['catch'](empty);
+})), PROMISE, {
+  // 25.4.4.1 Promise.all(iterable)
+  all: function all(iterable) {
+    var C = this;
+    var capability = newPromiseCapability(C);
+    var resolve = capability.resolve;
+    var reject = capability.reject;
+    var result = perform(function () {
+      var values = [];
+      var index = 0;
+      var remaining = 1;
+      forOf(iterable, false, function (promise) {
+        var $index = index++;
+        var alreadyCalled = false;
+        values.push(undefined);
+        remaining++;
+        C.resolve(promise).then(function (value) {
+          if (alreadyCalled) return;
+          alreadyCalled = true;
+          values[$index] = value;
+          --remaining || resolve(values);
+        }, reject);
+      });
+      --remaining || resolve(values);
+    });
+    if (result.e) reject(result.v);
+    return capability.promise;
+  },
+  // 25.4.4.4 Promise.race(iterable)
+  race: function race(iterable) {
+    var C = this;
+    var capability = newPromiseCapability(C);
+    var reject = capability.reject;
+    var result = perform(function () {
+      forOf(iterable, false, function (promise) {
+        C.resolve(promise).then(capability.resolve, reject);
+      });
+    });
+    if (result.e) reject(result.v);
+    return capability.promise;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.apply.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.apply.js
new file mode 100644
index 0000000..3b9c03a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.apply.js
@@ -0,0 +1,16 @@
+// 26.1.1 Reflect.apply(target, thisArgument, argumentsList)
+var $export = require('./_export');
+var aFunction = require('./_a-function');
+var anObject = require('./_an-object');
+var rApply = (require('./_global').Reflect || {}).apply;
+var fApply = Function.apply;
+// MS Edge argumentsList argument is optional
+$export($export.S + $export.F * !require('./_fails')(function () {
+  rApply(function () { /* empty */ });
+}), 'Reflect', {
+  apply: function apply(target, thisArgument, argumentsList) {
+    var T = aFunction(target);
+    var L = anObject(argumentsList);
+    return rApply ? rApply(T, thisArgument, L) : fApply.call(T, thisArgument, L);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.construct.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.construct.js
new file mode 100644
index 0000000..380addb
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.construct.js
@@ -0,0 +1,47 @@
+// 26.1.2 Reflect.construct(target, argumentsList [, newTarget])
+var $export = require('./_export');
+var create = require('./_object-create');
+var aFunction = require('./_a-function');
+var anObject = require('./_an-object');
+var isObject = require('./_is-object');
+var fails = require('./_fails');
+var bind = require('./_bind');
+var rConstruct = (require('./_global').Reflect || {}).construct;
+
+// MS Edge supports only 2 arguments and argumentsList argument is optional
+// FF Nightly sets third argument as `new.target`, but does not create `this` from it
+var NEW_TARGET_BUG = fails(function () {
+  function F() { /* empty */ }
+  return !(rConstruct(function () { /* empty */ }, [], F) instanceof F);
+});
+var ARGS_BUG = !fails(function () {
+  rConstruct(function () { /* empty */ });
+});
+
+$export($export.S + $export.F * (NEW_TARGET_BUG || ARGS_BUG), 'Reflect', {
+  construct: function construct(Target, args /* , newTarget */) {
+    aFunction(Target);
+    anObject(args);
+    var newTarget = arguments.length < 3 ? Target : aFunction(arguments[2]);
+    if (ARGS_BUG && !NEW_TARGET_BUG) return rConstruct(Target, args, newTarget);
+    if (Target == newTarget) {
+      // w/o altered newTarget, optimization for 0-4 arguments
+      switch (args.length) {
+        case 0: return new Target();
+        case 1: return new Target(args[0]);
+        case 2: return new Target(args[0], args[1]);
+        case 3: return new Target(args[0], args[1], args[2]);
+        case 4: return new Target(args[0], args[1], args[2], args[3]);
+      }
+      // w/o altered newTarget, lot of arguments case
+      var $args = [null];
+      $args.push.apply($args, args);
+      return new (bind.apply(Target, $args))();
+    }
+    // with altered newTarget, not support built-in constructors
+    var proto = newTarget.prototype;
+    var instance = create(isObject(proto) ? proto : Object.prototype);
+    var result = Function.apply.call(Target, instance, args);
+    return isObject(result) ? result : instance;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.define-property.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.define-property.js
new file mode 100644
index 0000000..be7fbde
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.define-property.js
@@ -0,0 +1,23 @@
+// 26.1.3 Reflect.defineProperty(target, propertyKey, attributes)
+var dP = require('./_object-dp');
+var $export = require('./_export');
+var anObject = require('./_an-object');
+var toPrimitive = require('./_to-primitive');
+
+// MS Edge has broken Reflect.defineProperty - throwing instead of returning false
+$export($export.S + $export.F * require('./_fails')(function () {
+  // eslint-disable-next-line no-undef
+  Reflect.defineProperty(dP.f({}, 1, { value: 1 }), 1, { value: 2 });
+}), 'Reflect', {
+  defineProperty: function defineProperty(target, propertyKey, attributes) {
+    anObject(target);
+    propertyKey = toPrimitive(propertyKey, true);
+    anObject(attributes);
+    try {
+      dP.f(target, propertyKey, attributes);
+      return true;
+    } catch (e) {
+      return false;
+    }
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.delete-property.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.delete-property.js
new file mode 100644
index 0000000..0902b38
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.delete-property.js
@@ -0,0 +1,11 @@
+// 26.1.4 Reflect.deleteProperty(target, propertyKey)
+var $export = require('./_export');
+var gOPD = require('./_object-gopd').f;
+var anObject = require('./_an-object');
+
+$export($export.S, 'Reflect', {
+  deleteProperty: function deleteProperty(target, propertyKey) {
+    var desc = gOPD(anObject(target), propertyKey);
+    return desc && !desc.configurable ? false : delete target[propertyKey];
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.enumerate.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.enumerate.js
new file mode 100644
index 0000000..9e7c76a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.enumerate.js
@@ -0,0 +1,26 @@
+'use strict';
+// 26.1.5 Reflect.enumerate(target)
+var $export = require('./_export');
+var anObject = require('./_an-object');
+var Enumerate = function (iterated) {
+  this._t = anObject(iterated); // target
+  this._i = 0;                  // next index
+  var keys = this._k = [];      // keys
+  var key;
+  for (key in iterated) keys.push(key);
+};
+require('./_iter-create')(Enumerate, 'Object', function () {
+  var that = this;
+  var keys = that._k;
+  var key;
+  do {
+    if (that._i >= keys.length) return { value: undefined, done: true };
+  } while (!((key = keys[that._i++]) in that._t));
+  return { value: key, done: false };
+});
+
+$export($export.S, 'Reflect', {
+  enumerate: function enumerate(target) {
+    return new Enumerate(target);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.get-own-property-descriptor.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.get-own-property-descriptor.js
new file mode 100644
index 0000000..e1299f9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.get-own-property-descriptor.js
@@ -0,0 +1,10 @@
+// 26.1.7 Reflect.getOwnPropertyDescriptor(target, propertyKey)
+var gOPD = require('./_object-gopd');
+var $export = require('./_export');
+var anObject = require('./_an-object');
+
+$export($export.S, 'Reflect', {
+  getOwnPropertyDescriptor: function getOwnPropertyDescriptor(target, propertyKey) {
+    return gOPD.f(anObject(target), propertyKey);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.get-prototype-of.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.get-prototype-of.js
new file mode 100644
index 0000000..28351d4
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.get-prototype-of.js
@@ -0,0 +1,10 @@
+// 26.1.8 Reflect.getPrototypeOf(target)
+var $export = require('./_export');
+var getProto = require('./_object-gpo');
+var anObject = require('./_an-object');
+
+$export($export.S, 'Reflect', {
+  getPrototypeOf: function getPrototypeOf(target) {
+    return getProto(anObject(target));
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.get.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.get.js
new file mode 100644
index 0000000..a7ee766
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.get.js
@@ -0,0 +1,21 @@
+// 26.1.6 Reflect.get(target, propertyKey [, receiver])
+var gOPD = require('./_object-gopd');
+var getPrototypeOf = require('./_object-gpo');
+var has = require('./_has');
+var $export = require('./_export');
+var isObject = require('./_is-object');
+var anObject = require('./_an-object');
+
+function get(target, propertyKey /* , receiver */) {
+  var receiver = arguments.length < 3 ? target : arguments[2];
+  var desc, proto;
+  if (anObject(target) === receiver) return target[propertyKey];
+  if (desc = gOPD.f(target, propertyKey)) return has(desc, 'value')
+    ? desc.value
+    : desc.get !== undefined
+      ? desc.get.call(receiver)
+      : undefined;
+  if (isObject(proto = getPrototypeOf(target))) return get(proto, propertyKey, receiver);
+}
+
+$export($export.S, 'Reflect', { get: get });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.has.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.has.js
new file mode 100644
index 0000000..4f5efa9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.has.js
@@ -0,0 +1,8 @@
+// 26.1.9 Reflect.has(target, propertyKey)
+var $export = require('./_export');
+
+$export($export.S, 'Reflect', {
+  has: function has(target, propertyKey) {
+    return propertyKey in target;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.is-extensible.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.is-extensible.js
new file mode 100644
index 0000000..700f938
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.is-extensible.js
@@ -0,0 +1,11 @@
+// 26.1.10 Reflect.isExtensible(target)
+var $export = require('./_export');
+var anObject = require('./_an-object');
+var $isExtensible = Object.isExtensible;
+
+$export($export.S, 'Reflect', {
+  isExtensible: function isExtensible(target) {
+    anObject(target);
+    return $isExtensible ? $isExtensible(target) : true;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.own-keys.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.own-keys.js
new file mode 100644
index 0000000..9f2424a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.own-keys.js
@@ -0,0 +1,4 @@
+// 26.1.11 Reflect.ownKeys(target)
+var $export = require('./_export');
+
+$export($export.S, 'Reflect', { ownKeys: require('./_own-keys') });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.prevent-extensions.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.prevent-extensions.js
new file mode 100644
index 0000000..e1037fa
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.prevent-extensions.js
@@ -0,0 +1,16 @@
+// 26.1.12 Reflect.preventExtensions(target)
+var $export = require('./_export');
+var anObject = require('./_an-object');
+var $preventExtensions = Object.preventExtensions;
+
+$export($export.S, 'Reflect', {
+  preventExtensions: function preventExtensions(target) {
+    anObject(target);
+    try {
+      if ($preventExtensions) $preventExtensions(target);
+      return true;
+    } catch (e) {
+      return false;
+    }
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.set-prototype-of.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.set-prototype-of.js
new file mode 100644
index 0000000..5dae901
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.set-prototype-of.js
@@ -0,0 +1,15 @@
+// 26.1.14 Reflect.setPrototypeOf(target, proto)
+var $export = require('./_export');
+var setProto = require('./_set-proto');
+
+if (setProto) $export($export.S, 'Reflect', {
+  setPrototypeOf: function setPrototypeOf(target, proto) {
+    setProto.check(target, proto);
+    try {
+      setProto.set(target, proto);
+      return true;
+    } catch (e) {
+      return false;
+    }
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.set.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.set.js
new file mode 100644
index 0000000..d809d7a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.reflect.set.js
@@ -0,0 +1,33 @@
+// 26.1.13 Reflect.set(target, propertyKey, V [, receiver])
+var dP = require('./_object-dp');
+var gOPD = require('./_object-gopd');
+var getPrototypeOf = require('./_object-gpo');
+var has = require('./_has');
+var $export = require('./_export');
+var createDesc = require('./_property-desc');
+var anObject = require('./_an-object');
+var isObject = require('./_is-object');
+
+function set(target, propertyKey, V /* , receiver */) {
+  var receiver = arguments.length < 4 ? target : arguments[3];
+  var ownDesc = gOPD.f(anObject(target), propertyKey);
+  var existingDescriptor, proto;
+  if (!ownDesc) {
+    if (isObject(proto = getPrototypeOf(target))) {
+      return set(proto, propertyKey, V, receiver);
+    }
+    ownDesc = createDesc(0);
+  }
+  if (has(ownDesc, 'value')) {
+    if (ownDesc.writable === false || !isObject(receiver)) return false;
+    if (existingDescriptor = gOPD.f(receiver, propertyKey)) {
+      if (existingDescriptor.get || existingDescriptor.set || existingDescriptor.writable === false) return false;
+      existingDescriptor.value = V;
+      dP.f(receiver, propertyKey, existingDescriptor);
+    } else dP.f(receiver, propertyKey, createDesc(0, V));
+    return true;
+  }
+  return ownDesc.set === undefined ? false : (ownDesc.set.call(receiver, V), true);
+}
+
+$export($export.S, 'Reflect', { set: set });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.constructor.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.constructor.js
new file mode 100644
index 0000000..76247c3
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.constructor.js
@@ -0,0 +1,43 @@
+var global = require('./_global');
+var inheritIfRequired = require('./_inherit-if-required');
+var dP = require('./_object-dp').f;
+var gOPN = require('./_object-gopn').f;
+var isRegExp = require('./_is-regexp');
+var $flags = require('./_flags');
+var $RegExp = global.RegExp;
+var Base = $RegExp;
+var proto = $RegExp.prototype;
+var re1 = /a/g;
+var re2 = /a/g;
+// "new" creates a new object, old webkit buggy here
+var CORRECT_NEW = new $RegExp(re1) !== re1;
+
+if (require('./_descriptors') && (!CORRECT_NEW || require('./_fails')(function () {
+  re2[require('./_wks')('match')] = false;
+  // RegExp constructor can alter flags and IsRegExp works correct with @@match
+  return $RegExp(re1) != re1 || $RegExp(re2) == re2 || $RegExp(re1, 'i') != '/a/i';
+}))) {
+  $RegExp = function RegExp(p, f) {
+    var tiRE = this instanceof $RegExp;
+    var piRE = isRegExp(p);
+    var fiU = f === undefined;
+    return !tiRE && piRE && p.constructor === $RegExp && fiU ? p
+      : inheritIfRequired(CORRECT_NEW
+        ? new Base(piRE && !fiU ? p.source : p, f)
+        : Base((piRE = p instanceof $RegExp) ? p.source : p, piRE && fiU ? $flags.call(p) : f)
+      , tiRE ? this : proto, $RegExp);
+  };
+  var proxy = function (key) {
+    key in $RegExp || dP($RegExp, key, {
+      configurable: true,
+      get: function () { return Base[key]; },
+      set: function (it) { Base[key] = it; }
+    });
+  };
+  for (var keys = gOPN(Base), i = 0; keys.length > i;) proxy(keys[i++]);
+  proto.constructor = $RegExp;
+  $RegExp.prototype = proto;
+  require('./_redefine')(global, 'RegExp', $RegExp);
+}
+
+require('./_set-species')('RegExp');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.exec.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.exec.js
new file mode 100644
index 0000000..a19f1ee
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.exec.js
@@ -0,0 +1,9 @@
+'use strict';
+var regexpExec = require('./_regexp-exec');
+require('./_export')({
+  target: 'RegExp',
+  proto: true,
+  forced: regexpExec !== /./.exec
+}, {
+  exec: regexpExec
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.flags.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.flags.js
new file mode 100644
index 0000000..4700868
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.flags.js
@@ -0,0 +1,5 @@
+// 21.2.5.3 get RegExp.prototype.flags()
+if (require('./_descriptors') && /./g.flags != 'g') require('./_object-dp').f(RegExp.prototype, 'flags', {
+  configurable: true,
+  get: require('./_flags')
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.match.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.match.js
new file mode 100644
index 0000000..6ac294e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.match.js
@@ -0,0 +1,40 @@
+'use strict';
+
+var anObject = require('./_an-object');
+var toLength = require('./_to-length');
+var advanceStringIndex = require('./_advance-string-index');
+var regExpExec = require('./_regexp-exec-abstract');
+
+// @@match logic
+require('./_fix-re-wks')('match', 1, function (defined, MATCH, $match, maybeCallNative) {
+  return [
+    // `String.prototype.match` method
+    // https://tc39.github.io/ecma262/#sec-string.prototype.match
+    function match(regexp) {
+      var O = defined(this);
+      var fn = regexp == undefined ? undefined : regexp[MATCH];
+      return fn !== undefined ? fn.call(regexp, O) : new RegExp(regexp)[MATCH](String(O));
+    },
+    // `RegExp.prototype[@@match]` method
+    // https://tc39.github.io/ecma262/#sec-regexp.prototype-@@match
+    function (regexp) {
+      var res = maybeCallNative($match, regexp, this);
+      if (res.done) return res.value;
+      var rx = anObject(regexp);
+      var S = String(this);
+      if (!rx.global) return regExpExec(rx, S);
+      var fullUnicode = rx.unicode;
+      rx.lastIndex = 0;
+      var A = [];
+      var n = 0;
+      var result;
+      while ((result = regExpExec(rx, S)) !== null) {
+        var matchStr = String(result[0]);
+        A[n] = matchStr;
+        if (matchStr === '') rx.lastIndex = advanceStringIndex(S, toLength(rx.lastIndex), fullUnicode);
+        n++;
+      }
+      return n === 0 ? null : A;
+    }
+  ];
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.replace.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.replace.js
new file mode 100644
index 0000000..abd0f9c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.replace.js
@@ -0,0 +1,118 @@
+'use strict';
+
+var anObject = require('./_an-object');
+var toObject = require('./_to-object');
+var toLength = require('./_to-length');
+var toInteger = require('./_to-integer');
+var advanceStringIndex = require('./_advance-string-index');
+var regExpExec = require('./_regexp-exec-abstract');
+var max = Math.max;
+var min = Math.min;
+var floor = Math.floor;
+var SUBSTITUTION_SYMBOLS = /\$([$&`']|\d\d?|<[^>]*>)/g;
+var SUBSTITUTION_SYMBOLS_NO_NAMED = /\$([$&`']|\d\d?)/g;
+
+var maybeToString = function (it) {
+  return it === undefined ? it : String(it);
+};
+
+// @@replace logic
+require('./_fix-re-wks')('replace', 2, function (defined, REPLACE, $replace, maybeCallNative) {
+  return [
+    // `String.prototype.replace` method
+    // https://tc39.github.io/ecma262/#sec-string.prototype.replace
+    function replace(searchValue, replaceValue) {
+      var O = defined(this);
+      var fn = searchValue == undefined ? undefined : searchValue[REPLACE];
+      return fn !== undefined
+        ? fn.call(searchValue, O, replaceValue)
+        : $replace.call(String(O), searchValue, replaceValue);
+    },
+    // `RegExp.prototype[@@replace]` method
+    // https://tc39.github.io/ecma262/#sec-regexp.prototype-@@replace
+    function (regexp, replaceValue) {
+      var res = maybeCallNative($replace, regexp, this, replaceValue);
+      if (res.done) return res.value;
+
+      var rx = anObject(regexp);
+      var S = String(this);
+      var functionalReplace = typeof replaceValue === 'function';
+      if (!functionalReplace) replaceValue = String(replaceValue);
+      var global = rx.global;
+      if (global) {
+        var fullUnicode = rx.unicode;
+        rx.lastIndex = 0;
+      }
+      var results = [];
+      while (true) {
+        var result = regExpExec(rx, S);
+        if (result === null) break;
+        results.push(result);
+        if (!global) break;
+        var matchStr = String(result[0]);
+        if (matchStr === '') rx.lastIndex = advanceStringIndex(S, toLength(rx.lastIndex), fullUnicode);
+      }
+      var accumulatedResult = '';
+      var nextSourcePosition = 0;
+      for (var i = 0; i < results.length; i++) {
+        result = results[i];
+        var matched = String(result[0]);
+        var position = max(min(toInteger(result.index), S.length), 0);
+        var captures = [];
+        // NOTE: This is equivalent to
+        //   captures = result.slice(1).map(maybeToString)
+        // but for some reason `nativeSlice.call(result, 1, result.length)` (called in
+        // the slice polyfill when slicing native arrays) "doesn't work" in safari 9 and
+        // causes a crash (https://pastebin.com/N21QzeQA) when trying to debug it.
+        for (var j = 1; j < result.length; j++) captures.push(maybeToString(result[j]));
+        var namedCaptures = result.groups;
+        if (functionalReplace) {
+          var replacerArgs = [matched].concat(captures, position, S);
+          if (namedCaptures !== undefined) replacerArgs.push(namedCaptures);
+          var replacement = String(replaceValue.apply(undefined, replacerArgs));
+        } else {
+          replacement = getSubstitution(matched, S, position, captures, namedCaptures, replaceValue);
+        }
+        if (position >= nextSourcePosition) {
+          accumulatedResult += S.slice(nextSourcePosition, position) + replacement;
+          nextSourcePosition = position + matched.length;
+        }
+      }
+      return accumulatedResult + S.slice(nextSourcePosition);
+    }
+  ];
+
+    // https://tc39.github.io/ecma262/#sec-getsubstitution
+  function getSubstitution(matched, str, position, captures, namedCaptures, replacement) {
+    var tailPos = position + matched.length;
+    var m = captures.length;
+    var symbols = SUBSTITUTION_SYMBOLS_NO_NAMED;
+    if (namedCaptures !== undefined) {
+      namedCaptures = toObject(namedCaptures);
+      symbols = SUBSTITUTION_SYMBOLS;
+    }
+    return $replace.call(replacement, symbols, function (match, ch) {
+      var capture;
+      switch (ch.charAt(0)) {
+        case '$': return '$';
+        case '&': return matched;
+        case '`': return str.slice(0, position);
+        case "'": return str.slice(tailPos);
+        case '<':
+          capture = namedCaptures[ch.slice(1, -1)];
+          break;
+        default: // \d\d?
+          var n = +ch;
+          if (n === 0) return match;
+          if (n > m) {
+            var f = floor(n / 10);
+            if (f === 0) return match;
+            if (f <= m) return captures[f - 1] === undefined ? ch.charAt(1) : captures[f - 1] + ch.charAt(1);
+            return match;
+          }
+          capture = captures[n - 1];
+      }
+      return capture === undefined ? '' : capture;
+    });
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.search.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.search.js
new file mode 100644
index 0000000..ecb53bb
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.search.js
@@ -0,0 +1,31 @@
+'use strict';
+
+var anObject = require('./_an-object');
+var sameValue = require('./_same-value');
+var regExpExec = require('./_regexp-exec-abstract');
+
+// @@search logic
+require('./_fix-re-wks')('search', 1, function (defined, SEARCH, $search, maybeCallNative) {
+  return [
+    // `String.prototype.search` method
+    // https://tc39.github.io/ecma262/#sec-string.prototype.search
+    function search(regexp) {
+      var O = defined(this);
+      var fn = regexp == undefined ? undefined : regexp[SEARCH];
+      return fn !== undefined ? fn.call(regexp, O) : new RegExp(regexp)[SEARCH](String(O));
+    },
+    // `RegExp.prototype[@@search]` method
+    // https://tc39.github.io/ecma262/#sec-regexp.prototype-@@search
+    function (regexp) {
+      var res = maybeCallNative($search, regexp, this);
+      if (res.done) return res.value;
+      var rx = anObject(regexp);
+      var S = String(this);
+      var previousLastIndex = rx.lastIndex;
+      if (!sameValue(previousLastIndex, 0)) rx.lastIndex = 0;
+      var result = regExpExec(rx, S);
+      if (!sameValue(rx.lastIndex, previousLastIndex)) rx.lastIndex = previousLastIndex;
+      return result === null ? -1 : result.index;
+    }
+  ];
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.split.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.split.js
new file mode 100644
index 0000000..45f81ce
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.split.js
@@ -0,0 +1,134 @@
+'use strict';
+
+var isRegExp = require('./_is-regexp');
+var anObject = require('./_an-object');
+var speciesConstructor = require('./_species-constructor');
+var advanceStringIndex = require('./_advance-string-index');
+var toLength = require('./_to-length');
+var callRegExpExec = require('./_regexp-exec-abstract');
+var regexpExec = require('./_regexp-exec');
+var fails = require('./_fails');
+var $min = Math.min;
+var $push = [].push;
+var $SPLIT = 'split';
+var LENGTH = 'length';
+var LAST_INDEX = 'lastIndex';
+var MAX_UINT32 = 0xffffffff;
+
+// babel-minify transpiles RegExp('x', 'y') -> /x/y and it causes SyntaxError
+var SUPPORTS_Y = !fails(function () { RegExp(MAX_UINT32, 'y'); });
+
+// @@split logic
+require('./_fix-re-wks')('split', 2, function (defined, SPLIT, $split, maybeCallNative) {
+  var internalSplit;
+  if (
+    'abbc'[$SPLIT](/(b)*/)[1] == 'c' ||
+    'test'[$SPLIT](/(?:)/, -1)[LENGTH] != 4 ||
+    'ab'[$SPLIT](/(?:ab)*/)[LENGTH] != 2 ||
+    '.'[$SPLIT](/(.?)(.?)/)[LENGTH] != 4 ||
+    '.'[$SPLIT](/()()/)[LENGTH] > 1 ||
+    ''[$SPLIT](/.?/)[LENGTH]
+  ) {
+    // based on es5-shim implementation, need to rework it
+    internalSplit = function (separator, limit) {
+      var string = String(this);
+      if (separator === undefined && limit === 0) return [];
+      // If `separator` is not a regex, use native split
+      if (!isRegExp(separator)) return $split.call(string, separator, limit);
+      var output = [];
+      var flags = (separator.ignoreCase ? 'i' : '') +
+                  (separator.multiline ? 'm' : '') +
+                  (separator.unicode ? 'u' : '') +
+                  (separator.sticky ? 'y' : '');
+      var lastLastIndex = 0;
+      var splitLimit = limit === undefined ? MAX_UINT32 : limit >>> 0;
+      // Make `global` and avoid `lastIndex` issues by working with a copy
+      var separatorCopy = new RegExp(separator.source, flags + 'g');
+      var match, lastIndex, lastLength;
+      while (match = regexpExec.call(separatorCopy, string)) {
+        lastIndex = separatorCopy[LAST_INDEX];
+        if (lastIndex > lastLastIndex) {
+          output.push(string.slice(lastLastIndex, match.index));
+          if (match[LENGTH] > 1 && match.index < string[LENGTH]) $push.apply(output, match.slice(1));
+          lastLength = match[0][LENGTH];
+          lastLastIndex = lastIndex;
+          if (output[LENGTH] >= splitLimit) break;
+        }
+        if (separatorCopy[LAST_INDEX] === match.index) separatorCopy[LAST_INDEX]++; // Avoid an infinite loop
+      }
+      if (lastLastIndex === string[LENGTH]) {
+        if (lastLength || !separatorCopy.test('')) output.push('');
+      } else output.push(string.slice(lastLastIndex));
+      return output[LENGTH] > splitLimit ? output.slice(0, splitLimit) : output;
+    };
+  // Chakra, V8
+  } else if ('0'[$SPLIT](undefined, 0)[LENGTH]) {
+    internalSplit = function (separator, limit) {
+      return separator === undefined && limit === 0 ? [] : $split.call(this, separator, limit);
+    };
+  } else {
+    internalSplit = $split;
+  }
+
+  return [
+    // `String.prototype.split` method
+    // https://tc39.github.io/ecma262/#sec-string.prototype.split
+    function split(separator, limit) {
+      var O = defined(this);
+      var splitter = separator == undefined ? undefined : separator[SPLIT];
+      return splitter !== undefined
+        ? splitter.call(separator, O, limit)
+        : internalSplit.call(String(O), separator, limit);
+    },
+    // `RegExp.prototype[@@split]` method
+    // https://tc39.github.io/ecma262/#sec-regexp.prototype-@@split
+    //
+    // NOTE: This cannot be properly polyfilled in engines that don't support
+    // the 'y' flag.
+    function (regexp, limit) {
+      var res = maybeCallNative(internalSplit, regexp, this, limit, internalSplit !== $split);
+      if (res.done) return res.value;
+
+      var rx = anObject(regexp);
+      var S = String(this);
+      var C = speciesConstructor(rx, RegExp);
+
+      var unicodeMatching = rx.unicode;
+      var flags = (rx.ignoreCase ? 'i' : '') +
+                  (rx.multiline ? 'm' : '') +
+                  (rx.unicode ? 'u' : '') +
+                  (SUPPORTS_Y ? 'y' : 'g');
+
+      // ^(? + rx + ) is needed, in combination with some S slicing, to
+      // simulate the 'y' flag.
+      var splitter = new C(SUPPORTS_Y ? rx : '^(?:' + rx.source + ')', flags);
+      var lim = limit === undefined ? MAX_UINT32 : limit >>> 0;
+      if (lim === 0) return [];
+      if (S.length === 0) return callRegExpExec(splitter, S) === null ? [S] : [];
+      var p = 0;
+      var q = 0;
+      var A = [];
+      while (q < S.length) {
+        splitter.lastIndex = SUPPORTS_Y ? q : 0;
+        var z = callRegExpExec(splitter, SUPPORTS_Y ? S : S.slice(q));
+        var e;
+        if (
+          z === null ||
+          (e = $min(toLength(splitter.lastIndex + (SUPPORTS_Y ? 0 : q)), S.length)) === p
+        ) {
+          q = advanceStringIndex(S, q, unicodeMatching);
+        } else {
+          A.push(S.slice(p, q));
+          if (A.length === lim) return A;
+          for (var i = 1; i <= z.length - 1; i++) {
+            A.push(z[i]);
+            if (A.length === lim) return A;
+          }
+          q = p = e;
+        }
+      }
+      A.push(S.slice(p));
+      return A;
+    }
+  ];
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.to-string.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.to-string.js
new file mode 100644
index 0000000..33d6e6f
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.regexp.to-string.js
@@ -0,0 +1,25 @@
+'use strict';
+require('./es6.regexp.flags');
+var anObject = require('./_an-object');
+var $flags = require('./_flags');
+var DESCRIPTORS = require('./_descriptors');
+var TO_STRING = 'toString';
+var $toString = /./[TO_STRING];
+
+var define = function (fn) {
+  require('./_redefine')(RegExp.prototype, TO_STRING, fn, true);
+};
+
+// 21.2.5.14 RegExp.prototype.toString()
+if (require('./_fails')(function () { return $toString.call({ source: 'a', flags: 'b' }) != '/a/b'; })) {
+  define(function toString() {
+    var R = anObject(this);
+    return '/'.concat(R.source, '/',
+      'flags' in R ? R.flags : !DESCRIPTORS && R instanceof RegExp ? $flags.call(R) : undefined);
+  });
+// FF44- RegExp#toString has a wrong name
+} else if ($toString.name != TO_STRING) {
+  define(function toString() {
+    return $toString.call(this);
+  });
+}
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.set.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.set.js
new file mode 100644
index 0000000..55b8bdd
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.set.js
@@ -0,0 +1,14 @@
+'use strict';
+var strong = require('./_collection-strong');
+var validate = require('./_validate-collection');
+var SET = 'Set';
+
+// 23.2 Set Objects
+module.exports = require('./_collection')(SET, function (get) {
+  return function Set() { return get(this, arguments.length > 0 ? arguments[0] : undefined); };
+}, {
+  // 23.2.3.1 Set.prototype.add(value)
+  add: function add(value) {
+    return strong.def(validate(this, SET), value = value === 0 ? 0 : value, value);
+  }
+}, strong);
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.anchor.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.anchor.js
new file mode 100644
index 0000000..3493e54
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.anchor.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.2 String.prototype.anchor(name)
+require('./_string-html')('anchor', function (createHTML) {
+  return function anchor(name) {
+    return createHTML(this, 'a', 'name', name);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.big.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.big.js
new file mode 100644
index 0000000..38aab34
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.big.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.3 String.prototype.big()
+require('./_string-html')('big', function (createHTML) {
+  return function big() {
+    return createHTML(this, 'big', '', '');
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.blink.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.blink.js
new file mode 100644
index 0000000..6188d96
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.blink.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.4 String.prototype.blink()
+require('./_string-html')('blink', function (createHTML) {
+  return function blink() {
+    return createHTML(this, 'blink', '', '');
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.bold.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.bold.js
new file mode 100644
index 0000000..ff3ecb9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.bold.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.5 String.prototype.bold()
+require('./_string-html')('bold', function (createHTML) {
+  return function bold() {
+    return createHTML(this, 'b', '', '');
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.code-point-at.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.code-point-at.js
new file mode 100644
index 0000000..e39b8c5
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.code-point-at.js
@@ -0,0 +1,9 @@
+'use strict';
+var $export = require('./_export');
+var $at = require('./_string-at')(false);
+$export($export.P, 'String', {
+  // 21.1.3.3 String.prototype.codePointAt(pos)
+  codePointAt: function codePointAt(pos) {
+    return $at(this, pos);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.ends-with.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.ends-with.js
new file mode 100644
index 0000000..0656888
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.ends-with.js
@@ -0,0 +1,20 @@
+// 21.1.3.6 String.prototype.endsWith(searchString [, endPosition])
+'use strict';
+var $export = require('./_export');
+var toLength = require('./_to-length');
+var context = require('./_string-context');
+var ENDS_WITH = 'endsWith';
+var $endsWith = ''[ENDS_WITH];
+
+$export($export.P + $export.F * require('./_fails-is-regexp')(ENDS_WITH), 'String', {
+  endsWith: function endsWith(searchString /* , endPosition = @length */) {
+    var that = context(this, searchString, ENDS_WITH);
+    var endPosition = arguments.length > 1 ? arguments[1] : undefined;
+    var len = toLength(that.length);
+    var end = endPosition === undefined ? len : Math.min(toLength(endPosition), len);
+    var search = String(searchString);
+    return $endsWith
+      ? $endsWith.call(that, search, end)
+      : that.slice(end - search.length, end) === search;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.fixed.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.fixed.js
new file mode 100644
index 0000000..d4a60f3
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.fixed.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.6 String.prototype.fixed()
+require('./_string-html')('fixed', function (createHTML) {
+  return function fixed() {
+    return createHTML(this, 'tt', '', '');
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.fontcolor.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.fontcolor.js
new file mode 100644
index 0000000..f7b9595
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.fontcolor.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.7 String.prototype.fontcolor(color)
+require('./_string-html')('fontcolor', function (createHTML) {
+  return function fontcolor(color) {
+    return createHTML(this, 'font', 'color', color);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.fontsize.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.fontsize.js
new file mode 100644
index 0000000..f4cc20a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.fontsize.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.8 String.prototype.fontsize(size)
+require('./_string-html')('fontsize', function (createHTML) {
+  return function fontsize(size) {
+    return createHTML(this, 'font', 'size', size);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.from-code-point.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.from-code-point.js
new file mode 100644
index 0000000..bece66e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.from-code-point.js
@@ -0,0 +1,23 @@
+var $export = require('./_export');
+var toAbsoluteIndex = require('./_to-absolute-index');
+var fromCharCode = String.fromCharCode;
+var $fromCodePoint = String.fromCodePoint;
+
+// length should be 1, old FF problem
+$export($export.S + $export.F * (!!$fromCodePoint && $fromCodePoint.length != 1), 'String', {
+  // 21.1.2.2 String.fromCodePoint(...codePoints)
+  fromCodePoint: function fromCodePoint(x) { // eslint-disable-line no-unused-vars
+    var res = [];
+    var aLen = arguments.length;
+    var i = 0;
+    var code;
+    while (aLen > i) {
+      code = +arguments[i++];
+      if (toAbsoluteIndex(code, 0x10ffff) !== code) throw RangeError(code + ' is not a valid code point');
+      res.push(code < 0x10000
+        ? fromCharCode(code)
+        : fromCharCode(((code -= 0x10000) >> 10) + 0xd800, code % 0x400 + 0xdc00)
+      );
+    } return res.join('');
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.includes.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.includes.js
new file mode 100644
index 0000000..28d1741
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.includes.js
@@ -0,0 +1,12 @@
+// 21.1.3.7 String.prototype.includes(searchString, position = 0)
+'use strict';
+var $export = require('./_export');
+var context = require('./_string-context');
+var INCLUDES = 'includes';
+
+$export($export.P + $export.F * require('./_fails-is-regexp')(INCLUDES), 'String', {
+  includes: function includes(searchString /* , position = 0 */) {
+    return !!~context(this, searchString, INCLUDES)
+      .indexOf(searchString, arguments.length > 1 ? arguments[1] : undefined);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.italics.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.italics.js
new file mode 100644
index 0000000..ed4cc3b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.italics.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.9 String.prototype.italics()
+require('./_string-html')('italics', function (createHTML) {
+  return function italics() {
+    return createHTML(this, 'i', '', '');
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.iterator.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.iterator.js
new file mode 100644
index 0000000..5d84c7f
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.iterator.js
@@ -0,0 +1,17 @@
+'use strict';
+var $at = require('./_string-at')(true);
+
+// 21.1.3.27 String.prototype[@@iterator]()
+require('./_iter-define')(String, 'String', function (iterated) {
+  this._t = String(iterated); // target
+  this._i = 0;                // next index
+// 21.1.5.2.1 %StringIteratorPrototype%.next()
+}, function () {
+  var O = this._t;
+  var index = this._i;
+  var point;
+  if (index >= O.length) return { value: undefined, done: true };
+  point = $at(O, index);
+  this._i += point.length;
+  return { value: point, done: false };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.link.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.link.js
new file mode 100644
index 0000000..d0255ed
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.link.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.10 String.prototype.link(url)
+require('./_string-html')('link', function (createHTML) {
+  return function link(url) {
+    return createHTML(this, 'a', 'href', url);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.raw.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.raw.js
new file mode 100644
index 0000000..aa40ff6
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.raw.js
@@ -0,0 +1,18 @@
+var $export = require('./_export');
+var toIObject = require('./_to-iobject');
+var toLength = require('./_to-length');
+
+$export($export.S, 'String', {
+  // 21.1.2.4 String.raw(callSite, ...substitutions)
+  raw: function raw(callSite) {
+    var tpl = toIObject(callSite.raw);
+    var len = toLength(tpl.length);
+    var aLen = arguments.length;
+    var res = [];
+    var i = 0;
+    while (len > i) {
+      res.push(String(tpl[i++]));
+      if (i < aLen) res.push(String(arguments[i]));
+    } return res.join('');
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.repeat.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.repeat.js
new file mode 100644
index 0000000..08412d9
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.repeat.js
@@ -0,0 +1,6 @@
+var $export = require('./_export');
+
+$export($export.P, 'String', {
+  // 21.1.3.13 String.prototype.repeat(count)
+  repeat: require('./_string-repeat')
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.small.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.small.js
new file mode 100644
index 0000000..941e4a7
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.small.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.11 String.prototype.small()
+require('./_string-html')('small', function (createHTML) {
+  return function small() {
+    return createHTML(this, 'small', '', '');
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.starts-with.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.starts-with.js
new file mode 100644
index 0000000..c172376
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.starts-with.js
@@ -0,0 +1,18 @@
+// 21.1.3.18 String.prototype.startsWith(searchString [, position ])
+'use strict';
+var $export = require('./_export');
+var toLength = require('./_to-length');
+var context = require('./_string-context');
+var STARTS_WITH = 'startsWith';
+var $startsWith = ''[STARTS_WITH];
+
+$export($export.P + $export.F * require('./_fails-is-regexp')(STARTS_WITH), 'String', {
+  startsWith: function startsWith(searchString /* , position = 0 */) {
+    var that = context(this, searchString, STARTS_WITH);
+    var index = toLength(Math.min(arguments.length > 1 ? arguments[1] : undefined, that.length));
+    var search = String(searchString);
+    return $startsWith
+      ? $startsWith.call(that, search, index)
+      : that.slice(index, index + search.length) === search;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.strike.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.strike.js
new file mode 100644
index 0000000..66055bc
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.strike.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.12 String.prototype.strike()
+require('./_string-html')('strike', function (createHTML) {
+  return function strike() {
+    return createHTML(this, 'strike', '', '');
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.sub.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.sub.js
new file mode 100644
index 0000000..e295a27
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.sub.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.13 String.prototype.sub()
+require('./_string-html')('sub', function (createHTML) {
+  return function sub() {
+    return createHTML(this, 'sub', '', '');
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.sup.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.sup.js
new file mode 100644
index 0000000..125a989
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.sup.js
@@ -0,0 +1,7 @@
+'use strict';
+// B.2.3.14 String.prototype.sup()
+require('./_string-html')('sup', function (createHTML) {
+  return function sup() {
+    return createHTML(this, 'sup', '', '');
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.trim.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.trim.js
new file mode 100644
index 0000000..02b8a6c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.string.trim.js
@@ -0,0 +1,7 @@
+'use strict';
+// 21.1.3.25 String.prototype.trim()
+require('./_string-trim')('trim', function ($trim) {
+  return function trim() {
+    return $trim(this, 3);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.symbol.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.symbol.js
new file mode 100644
index 0000000..52dbbc8
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.symbol.js
@@ -0,0 +1,246 @@
+'use strict';
+// ECMAScript 6 symbols shim
+var global = require('./_global');
+var has = require('./_has');
+var DESCRIPTORS = require('./_descriptors');
+var $export = require('./_export');
+var redefine = require('./_redefine');
+var META = require('./_meta').KEY;
+var $fails = require('./_fails');
+var shared = require('./_shared');
+var setToStringTag = require('./_set-to-string-tag');
+var uid = require('./_uid');
+var wks = require('./_wks');
+var wksExt = require('./_wks-ext');
+var wksDefine = require('./_wks-define');
+var enumKeys = require('./_enum-keys');
+var isArray = require('./_is-array');
+var anObject = require('./_an-object');
+var isObject = require('./_is-object');
+var toObject = require('./_to-object');
+var toIObject = require('./_to-iobject');
+var toPrimitive = require('./_to-primitive');
+var createDesc = require('./_property-desc');
+var _create = require('./_object-create');
+var gOPNExt = require('./_object-gopn-ext');
+var $GOPD = require('./_object-gopd');
+var $GOPS = require('./_object-gops');
+var $DP = require('./_object-dp');
+var $keys = require('./_object-keys');
+var gOPD = $GOPD.f;
+var dP = $DP.f;
+var gOPN = gOPNExt.f;
+var $Symbol = global.Symbol;
+var $JSON = global.JSON;
+var _stringify = $JSON && $JSON.stringify;
+var PROTOTYPE = 'prototype';
+var HIDDEN = wks('_hidden');
+var TO_PRIMITIVE = wks('toPrimitive');
+var isEnum = {}.propertyIsEnumerable;
+var SymbolRegistry = shared('symbol-registry');
+var AllSymbols = shared('symbols');
+var OPSymbols = shared('op-symbols');
+var ObjectProto = Object[PROTOTYPE];
+var USE_NATIVE = typeof $Symbol == 'function' && !!$GOPS.f;
+var QObject = global.QObject;
+// Don't use setters in Qt Script, https://github.com/zloirock/core-js/issues/173
+var setter = !QObject || !QObject[PROTOTYPE] || !QObject[PROTOTYPE].findChild;
+
+// fallback for old Android, https://code.google.com/p/v8/issues/detail?id=687
+var setSymbolDesc = DESCRIPTORS && $fails(function () {
+  return _create(dP({}, 'a', {
+    get: function () { return dP(this, 'a', { value: 7 }).a; }
+  })).a != 7;
+}) ? function (it, key, D) {
+  var protoDesc = gOPD(ObjectProto, key);
+  if (protoDesc) delete ObjectProto[key];
+  dP(it, key, D);
+  if (protoDesc && it !== ObjectProto) dP(ObjectProto, key, protoDesc);
+} : dP;
+
+var wrap = function (tag) {
+  var sym = AllSymbols[tag] = _create($Symbol[PROTOTYPE]);
+  sym._k = tag;
+  return sym;
+};
+
+var isSymbol = USE_NATIVE && typeof $Symbol.iterator == 'symbol' ? function (it) {
+  return typeof it == 'symbol';
+} : function (it) {
+  return it instanceof $Symbol;
+};
+
+var $defineProperty = function defineProperty(it, key, D) {
+  if (it === ObjectProto) $defineProperty(OPSymbols, key, D);
+  anObject(it);
+  key = toPrimitive(key, true);
+  anObject(D);
+  if (has(AllSymbols, key)) {
+    if (!D.enumerable) {
+      if (!has(it, HIDDEN)) dP(it, HIDDEN, createDesc(1, {}));
+      it[HIDDEN][key] = true;
+    } else {
+      if (has(it, HIDDEN) && it[HIDDEN][key]) it[HIDDEN][key] = false;
+      D = _create(D, { enumerable: createDesc(0, false) });
+    } return setSymbolDesc(it, key, D);
+  } return dP(it, key, D);
+};
+var $defineProperties = function defineProperties(it, P) {
+  anObject(it);
+  var keys = enumKeys(P = toIObject(P));
+  var i = 0;
+  var l = keys.length;
+  var key;
+  while (l > i) $defineProperty(it, key = keys[i++], P[key]);
+  return it;
+};
+var $create = function create(it, P) {
+  return P === undefined ? _create(it) : $defineProperties(_create(it), P);
+};
+var $propertyIsEnumerable = function propertyIsEnumerable(key) {
+  var E = isEnum.call(this, key = toPrimitive(key, true));
+  if (this === ObjectProto && has(AllSymbols, key) && !has(OPSymbols, key)) return false;
+  return E || !has(this, key) || !has(AllSymbols, key) || has(this, HIDDEN) && this[HIDDEN][key] ? E : true;
+};
+var $getOwnPropertyDescriptor = function getOwnPropertyDescriptor(it, key) {
+  it = toIObject(it);
+  key = toPrimitive(key, true);
+  if (it === ObjectProto && has(AllSymbols, key) && !has(OPSymbols, key)) return;
+  var D = gOPD(it, key);
+  if (D && has(AllSymbols, key) && !(has(it, HIDDEN) && it[HIDDEN][key])) D.enumerable = true;
+  return D;
+};
+var $getOwnPropertyNames = function getOwnPropertyNames(it) {
+  var names = gOPN(toIObject(it));
+  var result = [];
+  var i = 0;
+  var key;
+  while (names.length > i) {
+    if (!has(AllSymbols, key = names[i++]) && key != HIDDEN && key != META) result.push(key);
+  } return result;
+};
+var $getOwnPropertySymbols = function getOwnPropertySymbols(it) {
+  var IS_OP = it === ObjectProto;
+  var names = gOPN(IS_OP ? OPSymbols : toIObject(it));
+  var result = [];
+  var i = 0;
+  var key;
+  while (names.length > i) {
+    if (has(AllSymbols, key = names[i++]) && (IS_OP ? has(ObjectProto, key) : true)) result.push(AllSymbols[key]);
+  } return result;
+};
+
+// 19.4.1.1 Symbol([description])
+if (!USE_NATIVE) {
+  $Symbol = function Symbol() {
+    if (this instanceof $Symbol) throw TypeError('Symbol is not a constructor!');
+    var tag = uid(arguments.length > 0 ? arguments[0] : undefined);
+    var $set = function (value) {
+      if (this === ObjectProto) $set.call(OPSymbols, value);
+      if (has(this, HIDDEN) && has(this[HIDDEN], tag)) this[HIDDEN][tag] = false;
+      setSymbolDesc(this, tag, createDesc(1, value));
+    };
+    if (DESCRIPTORS && setter) setSymbolDesc(ObjectProto, tag, { configurable: true, set: $set });
+    return wrap(tag);
+  };
+  redefine($Symbol[PROTOTYPE], 'toString', function toString() {
+    return this._k;
+  });
+
+  $GOPD.f = $getOwnPropertyDescriptor;
+  $DP.f = $defineProperty;
+  require('./_object-gopn').f = gOPNExt.f = $getOwnPropertyNames;
+  require('./_object-pie').f = $propertyIsEnumerable;
+  $GOPS.f = $getOwnPropertySymbols;
+
+  if (DESCRIPTORS && !require('./_library')) {
+    redefine(ObjectProto, 'propertyIsEnumerable', $propertyIsEnumerable, true);
+  }
+
+  wksExt.f = function (name) {
+    return wrap(wks(name));
+  };
+}
+
+$export($export.G + $export.W + $export.F * !USE_NATIVE, { Symbol: $Symbol });
+
+for (var es6Symbols = (
+  // 19.4.2.2, 19.4.2.3, 19.4.2.4, 19.4.2.6, 19.4.2.8, 19.4.2.9, 19.4.2.10, 19.4.2.11, 19.4.2.12, 19.4.2.13, 19.4.2.14
+  'hasInstance,isConcatSpreadable,iterator,match,replace,search,species,split,toPrimitive,toStringTag,unscopables'
+).split(','), j = 0; es6Symbols.length > j;)wks(es6Symbols[j++]);
+
+for (var wellKnownSymbols = $keys(wks.store), k = 0; wellKnownSymbols.length > k;) wksDefine(wellKnownSymbols[k++]);
+
+$export($export.S + $export.F * !USE_NATIVE, 'Symbol', {
+  // 19.4.2.1 Symbol.for(key)
+  'for': function (key) {
+    return has(SymbolRegistry, key += '')
+      ? SymbolRegistry[key]
+      : SymbolRegistry[key] = $Symbol(key);
+  },
+  // 19.4.2.5 Symbol.keyFor(sym)
+  keyFor: function keyFor(sym) {
+    if (!isSymbol(sym)) throw TypeError(sym + ' is not a symbol!');
+    for (var key in SymbolRegistry) if (SymbolRegistry[key] === sym) return key;
+  },
+  useSetter: function () { setter = true; },
+  useSimple: function () { setter = false; }
+});
+
+$export($export.S + $export.F * !USE_NATIVE, 'Object', {
+  // 19.1.2.2 Object.create(O [, Properties])
+  create: $create,
+  // 19.1.2.4 Object.defineProperty(O, P, Attributes)
+  defineProperty: $defineProperty,
+  // 19.1.2.3 Object.defineProperties(O, Properties)
+  defineProperties: $defineProperties,
+  // 19.1.2.6 Object.getOwnPropertyDescriptor(O, P)
+  getOwnPropertyDescriptor: $getOwnPropertyDescriptor,
+  // 19.1.2.7 Object.getOwnPropertyNames(O)
+  getOwnPropertyNames: $getOwnPropertyNames,
+  // 19.1.2.8 Object.getOwnPropertySymbols(O)
+  getOwnPropertySymbols: $getOwnPropertySymbols
+});
+
+// Chrome 38 and 39 `Object.getOwnPropertySymbols` fails on primitives
+// https://bugs.chromium.org/p/v8/issues/detail?id=3443
+var FAILS_ON_PRIMITIVES = $fails(function () { $GOPS.f(1); });
+
+$export($export.S + $export.F * FAILS_ON_PRIMITIVES, 'Object', {
+  getOwnPropertySymbols: function getOwnPropertySymbols(it) {
+    return $GOPS.f(toObject(it));
+  }
+});
+
+// 24.3.2 JSON.stringify(value [, replacer [, space]])
+$JSON && $export($export.S + $export.F * (!USE_NATIVE || $fails(function () {
+  var S = $Symbol();
+  // MS Edge converts symbol values to JSON as {}
+  // WebKit converts symbol values to JSON as null
+  // V8 throws on boxed symbols
+  return _stringify([S]) != '[null]' || _stringify({ a: S }) != '{}' || _stringify(Object(S)) != '{}';
+})), 'JSON', {
+  stringify: function stringify(it) {
+    var args = [it];
+    var i = 1;
+    var replacer, $replacer;
+    while (arguments.length > i) args.push(arguments[i++]);
+    $replacer = replacer = args[1];
+    if (!isObject(replacer) && it === undefined || isSymbol(it)) return; // IE8 returns string on undefined
+    if (!isArray(replacer)) replacer = function (key, value) {
+      if (typeof $replacer == 'function') value = $replacer.call(this, key, value);
+      if (!isSymbol(value)) return value;
+    };
+    args[1] = replacer;
+    return _stringify.apply($JSON, args);
+  }
+});
+
+// 19.4.3.4 Symbol.prototype[@@toPrimitive](hint)
+$Symbol[PROTOTYPE][TO_PRIMITIVE] || require('./_hide')($Symbol[PROTOTYPE], TO_PRIMITIVE, $Symbol[PROTOTYPE].valueOf);
+// 19.4.3.5 Symbol.prototype[@@toStringTag]
+setToStringTag($Symbol, 'Symbol');
+// 20.2.1.9 Math[@@toStringTag]
+setToStringTag(Math, 'Math', true);
+// 24.3.3 JSON[@@toStringTag]
+setToStringTag(global.JSON, 'JSON', true);
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.array-buffer.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.array-buffer.js
new file mode 100644
index 0000000..b247370
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.array-buffer.js
@@ -0,0 +1,46 @@
+'use strict';
+var $export = require('./_export');
+var $typed = require('./_typed');
+var buffer = require('./_typed-buffer');
+var anObject = require('./_an-object');
+var toAbsoluteIndex = require('./_to-absolute-index');
+var toLength = require('./_to-length');
+var isObject = require('./_is-object');
+var ArrayBuffer = require('./_global').ArrayBuffer;
+var speciesConstructor = require('./_species-constructor');
+var $ArrayBuffer = buffer.ArrayBuffer;
+var $DataView = buffer.DataView;
+var $isView = $typed.ABV && ArrayBuffer.isView;
+var $slice = $ArrayBuffer.prototype.slice;
+var VIEW = $typed.VIEW;
+var ARRAY_BUFFER = 'ArrayBuffer';
+
+$export($export.G + $export.W + $export.F * (ArrayBuffer !== $ArrayBuffer), { ArrayBuffer: $ArrayBuffer });
+
+$export($export.S + $export.F * !$typed.CONSTR, ARRAY_BUFFER, {
+  // 24.1.3.1 ArrayBuffer.isView(arg)
+  isView: function isView(it) {
+    return $isView && $isView(it) || isObject(it) && VIEW in it;
+  }
+});
+
+$export($export.P + $export.U + $export.F * require('./_fails')(function () {
+  return !new $ArrayBuffer(2).slice(1, undefined).byteLength;
+}), ARRAY_BUFFER, {
+  // 24.1.4.3 ArrayBuffer.prototype.slice(start, end)
+  slice: function slice(start, end) {
+    if ($slice !== undefined && end === undefined) return $slice.call(anObject(this), start); // FF fix
+    var len = anObject(this).byteLength;
+    var first = toAbsoluteIndex(start, len);
+    var fin = toAbsoluteIndex(end === undefined ? len : end, len);
+    var result = new (speciesConstructor(this, $ArrayBuffer))(toLength(fin - first));
+    var viewS = new $DataView(this);
+    var viewT = new $DataView(result);
+    var index = 0;
+    while (first < fin) {
+      viewT.setUint8(index++, viewS.getUint8(first++));
+    } return result;
+  }
+});
+
+require('./_set-species')(ARRAY_BUFFER);
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.data-view.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.data-view.js
new file mode 100644
index 0000000..d0e2353
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.data-view.js
@@ -0,0 +1,4 @@
+var $export = require('./_export');
+$export($export.G + $export.W + $export.F * !require('./_typed').ABV, {
+  DataView: require('./_typed-buffer').DataView
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.float32-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.float32-array.js
new file mode 100644
index 0000000..f497006
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.float32-array.js
@@ -0,0 +1,5 @@
+require('./_typed-array')('Float32', 4, function (init) {
+  return function Float32Array(data, byteOffset, length) {
+    return init(this, data, byteOffset, length);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.float64-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.float64-array.js
new file mode 100644
index 0000000..85dedcd
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.float64-array.js
@@ -0,0 +1,5 @@
+require('./_typed-array')('Float64', 8, function (init) {
+  return function Float64Array(data, byteOffset, length) {
+    return init(this, data, byteOffset, length);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.int16-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.int16-array.js
new file mode 100644
index 0000000..b20ed04
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.int16-array.js
@@ -0,0 +1,5 @@
+require('./_typed-array')('Int16', 2, function (init) {
+  return function Int16Array(data, byteOffset, length) {
+    return init(this, data, byteOffset, length);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.int32-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.int32-array.js
new file mode 100644
index 0000000..c7e6ae0
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.int32-array.js
@@ -0,0 +1,5 @@
+require('./_typed-array')('Int32', 4, function (init) {
+  return function Int32Array(data, byteOffset, length) {
+    return init(this, data, byteOffset, length);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.int8-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.int8-array.js
new file mode 100644
index 0000000..58ab9f3
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.int8-array.js
@@ -0,0 +1,5 @@
+require('./_typed-array')('Int8', 1, function (init) {
+  return function Int8Array(data, byteOffset, length) {
+    return init(this, data, byteOffset, length);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint16-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint16-array.js
new file mode 100644
index 0000000..992805d
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint16-array.js
@@ -0,0 +1,5 @@
+require('./_typed-array')('Uint16', 2, function (init) {
+  return function Uint16Array(data, byteOffset, length) {
+    return init(this, data, byteOffset, length);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint32-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint32-array.js
new file mode 100644
index 0000000..5c44424
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint32-array.js
@@ -0,0 +1,5 @@
+require('./_typed-array')('Uint32', 4, function (init) {
+  return function Uint32Array(data, byteOffset, length) {
+    return init(this, data, byteOffset, length);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint8-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint8-array.js
new file mode 100644
index 0000000..465cdc8
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint8-array.js
@@ -0,0 +1,5 @@
+require('./_typed-array')('Uint8', 1, function (init) {
+  return function Uint8Array(data, byteOffset, length) {
+    return init(this, data, byteOffset, length);
+  };
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint8-clamped-array.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint8-clamped-array.js
new file mode 100644
index 0000000..a84a1c1
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.typed.uint8-clamped-array.js
@@ -0,0 +1,5 @@
+require('./_typed-array')('Uint8', 1, function (init) {
+  return function Uint8ClampedArray(data, byteOffset, length) {
+    return init(this, data, byteOffset, length);
+  };
+}, true);
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.weak-map.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.weak-map.js
new file mode 100644
index 0000000..3560521
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.weak-map.js
@@ -0,0 +1,60 @@
+'use strict';
+var global = require('./_global');
+var each = require('./_array-methods')(0);
+var redefine = require('./_redefine');
+var meta = require('./_meta');
+var assign = require('./_object-assign');
+var weak = require('./_collection-weak');
+var isObject = require('./_is-object');
+var validate = require('./_validate-collection');
+var NATIVE_WEAK_MAP = require('./_validate-collection');
+var IS_IE11 = !global.ActiveXObject && 'ActiveXObject' in global;
+var WEAK_MAP = 'WeakMap';
+var getWeak = meta.getWeak;
+var isExtensible = Object.isExtensible;
+var uncaughtFrozenStore = weak.ufstore;
+var InternalMap;
+
+var wrapper = function (get) {
+  return function WeakMap() {
+    return get(this, arguments.length > 0 ? arguments[0] : undefined);
+  };
+};
+
+var methods = {
+  // 23.3.3.3 WeakMap.prototype.get(key)
+  get: function get(key) {
+    if (isObject(key)) {
+      var data = getWeak(key);
+      if (data === true) return uncaughtFrozenStore(validate(this, WEAK_MAP)).get(key);
+      return data ? data[this._i] : undefined;
+    }
+  },
+  // 23.3.3.5 WeakMap.prototype.set(key, value)
+  set: function set(key, value) {
+    return weak.def(validate(this, WEAK_MAP), key, value);
+  }
+};
+
+// 23.3 WeakMap Objects
+var $WeakMap = module.exports = require('./_collection')(WEAK_MAP, wrapper, methods, weak, true, true);
+
+// IE11 WeakMap frozen keys fix
+if (NATIVE_WEAK_MAP && IS_IE11) {
+  InternalMap = weak.getConstructor(wrapper, WEAK_MAP);
+  assign(InternalMap.prototype, methods);
+  meta.NEED = true;
+  each(['delete', 'has', 'get', 'set'], function (key) {
+    var proto = $WeakMap.prototype;
+    var method = proto[key];
+    redefine(proto, key, function (a, b) {
+      // store frozen objects on internal weakmap shim
+      if (isObject(a) && !isExtensible(a)) {
+        if (!this._f) this._f = new InternalMap();
+        var result = this._f[key](a, b);
+        return key == 'set' ? this : result;
+      // store all the rest on native weakmap
+      } return method.call(this, a, b);
+    });
+  });
+}
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.weak-set.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.weak-set.js
new file mode 100644
index 0000000..18a81e5
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es6.weak-set.js
@@ -0,0 +1,14 @@
+'use strict';
+var weak = require('./_collection-weak');
+var validate = require('./_validate-collection');
+var WEAK_SET = 'WeakSet';
+
+// 23.4 WeakSet Objects
+require('./_collection')(WEAK_SET, function (get) {
+  return function WeakSet() { return get(this, arguments.length > 0 ? arguments[0] : undefined); };
+}, {
+  // 23.4.3.1 WeakSet.prototype.add(value)
+  add: function add(value) {
+    return weak.def(validate(this, WEAK_SET), value, true);
+  }
+}, weak, false, true);
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.array.flat-map.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.array.flat-map.js
new file mode 100644
index 0000000..2a210cd
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.array.flat-map.js
@@ -0,0 +1,22 @@
+'use strict';
+// https://tc39.github.io/proposal-flatMap/#sec-Array.prototype.flatMap
+var $export = require('./_export');
+var flattenIntoArray = require('./_flatten-into-array');
+var toObject = require('./_to-object');
+var toLength = require('./_to-length');
+var aFunction = require('./_a-function');
+var arraySpeciesCreate = require('./_array-species-create');
+
+$export($export.P, 'Array', {
+  flatMap: function flatMap(callbackfn /* , thisArg */) {
+    var O = toObject(this);
+    var sourceLen, A;
+    aFunction(callbackfn);
+    sourceLen = toLength(O.length);
+    A = arraySpeciesCreate(O, 0);
+    flattenIntoArray(A, O, O, sourceLen, 0, 1, callbackfn, arguments[1]);
+    return A;
+  }
+});
+
+require('./_add-to-unscopables')('flatMap');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.array.includes.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.array.includes.js
new file mode 100644
index 0000000..1b77f0e
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.array.includes.js
@@ -0,0 +1,12 @@
+'use strict';
+// https://github.com/tc39/Array.prototype.includes
+var $export = require('./_export');
+var $includes = require('./_array-includes')(true);
+
+$export($export.P, 'Array', {
+  includes: function includes(el /* , fromIndex = 0 */) {
+    return $includes(this, el, arguments.length > 1 ? arguments[1] : undefined);
+  }
+});
+
+require('./_add-to-unscopables')('includes');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.object.entries.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.object.entries.js
new file mode 100644
index 0000000..2f83437
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.object.entries.js
@@ -0,0 +1,9 @@
+// https://github.com/tc39/proposal-object-values-entries
+var $export = require('./_export');
+var $entries = require('./_object-to-array')(true);
+
+$export($export.S, 'Object', {
+  entries: function entries(it) {
+    return $entries(it);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.object.get-own-property-descriptors.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.object.get-own-property-descriptors.js
new file mode 100644
index 0000000..b1ab72f
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.object.get-own-property-descriptors.js
@@ -0,0 +1,22 @@
+// https://github.com/tc39/proposal-object-getownpropertydescriptors
+var $export = require('./_export');
+var ownKeys = require('./_own-keys');
+var toIObject = require('./_to-iobject');
+var gOPD = require('./_object-gopd');
+var createProperty = require('./_create-property');
+
+$export($export.S, 'Object', {
+  getOwnPropertyDescriptors: function getOwnPropertyDescriptors(object) {
+    var O = toIObject(object);
+    var getDesc = gOPD.f;
+    var keys = ownKeys(O);
+    var result = {};
+    var i = 0;
+    var key, desc;
+    while (keys.length > i) {
+      desc = getDesc(O, key = keys[i++]);
+      if (desc !== undefined) createProperty(result, key, desc);
+    }
+    return result;
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.object.values.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.object.values.js
new file mode 100644
index 0000000..d6f0952
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.object.values.js
@@ -0,0 +1,9 @@
+// https://github.com/tc39/proposal-object-values-entries
+var $export = require('./_export');
+var $values = require('./_object-to-array')(false);
+
+$export($export.S, 'Object', {
+  values: function values(it) {
+    return $values(it);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.promise.finally.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.promise.finally.js
new file mode 100644
index 0000000..fa04b63
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.promise.finally.js
@@ -0,0 +1,20 @@
+// https://github.com/tc39/proposal-promise-finally
+'use strict';
+var $export = require('./_export');
+var core = require('./_core');
+var global = require('./_global');
+var speciesConstructor = require('./_species-constructor');
+var promiseResolve = require('./_promise-resolve');
+
+$export($export.P + $export.R, 'Promise', { 'finally': function (onFinally) {
+  var C = speciesConstructor(this, core.Promise || global.Promise);
+  var isFunction = typeof onFinally == 'function';
+  return this.then(
+    isFunction ? function (x) {
+      return promiseResolve(C, onFinally()).then(function () { return x; });
+    } : onFinally,
+    isFunction ? function (e) {
+      return promiseResolve(C, onFinally()).then(function () { throw e; });
+    } : onFinally
+  );
+} });
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.pad-end.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.pad-end.js
new file mode 100644
index 0000000..5a531a1
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.pad-end.js
@@ -0,0 +1,14 @@
+'use strict';
+// https://github.com/tc39/proposal-string-pad-start-end
+var $export = require('./_export');
+var $pad = require('./_string-pad');
+var userAgent = require('./_user-agent');
+
+// https://github.com/zloirock/core-js/issues/280
+var WEBKIT_BUG = /Version\/10\.\d+(\.\d+)?( Mobile\/\w+)? Safari\//.test(userAgent);
+
+$export($export.P + $export.F * WEBKIT_BUG, 'String', {
+  padEnd: function padEnd(maxLength /* , fillString = ' ' */) {
+    return $pad(this, maxLength, arguments.length > 1 ? arguments[1] : undefined, false);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.pad-start.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.pad-start.js
new file mode 100644
index 0000000..729ed93
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.pad-start.js
@@ -0,0 +1,14 @@
+'use strict';
+// https://github.com/tc39/proposal-string-pad-start-end
+var $export = require('./_export');
+var $pad = require('./_string-pad');
+var userAgent = require('./_user-agent');
+
+// https://github.com/zloirock/core-js/issues/280
+var WEBKIT_BUG = /Version\/10\.\d+(\.\d+)?( Mobile\/\w+)? Safari\//.test(userAgent);
+
+$export($export.P + $export.F * WEBKIT_BUG, 'String', {
+  padStart: function padStart(maxLength /* , fillString = ' ' */) {
+    return $pad(this, maxLength, arguments.length > 1 ? arguments[1] : undefined, true);
+  }
+});
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.trim-left.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.trim-left.js
new file mode 100644
index 0000000..39a4b47
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.trim-left.js
@@ -0,0 +1,7 @@
+'use strict';
+// https://github.com/sebmarkbage/ecmascript-string-left-right-trim
+require('./_string-trim')('trimLeft', function ($trim) {
+  return function trimLeft() {
+    return $trim(this, 1);
+  };
+}, 'trimStart');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.trim-right.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.trim-right.js
new file mode 100644
index 0000000..7b7c452
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.string.trim-right.js
@@ -0,0 +1,7 @@
+'use strict';
+// https://github.com/sebmarkbage/ecmascript-string-left-right-trim
+require('./_string-trim')('trimRight', function ($trim) {
+  return function trimRight() {
+    return $trim(this, 2);
+  };
+}, 'trimEnd');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.symbol.async-iterator.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.symbol.async-iterator.js
new file mode 100644
index 0000000..f56dc2a
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/es7.symbol.async-iterator.js
@@ -0,0 +1 @@
+require('./_wks-define')('asyncIterator');
diff --git a/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/web.immediate.js b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/web.immediate.js
new file mode 100644
index 0000000..70f3e70
--- /dev/null
+++ b/ddb_main/node_modules/@babel/polyfill/node_modules/core-js/modules/web.immediate.js
@@ -0,0 +1,6 @@
+var $export = require('./_export');
+var $task = require('./_task');
+$export($export.G + $export.B, {
+  setImmediate: $task.set,
+  clearImmediate: $task.clear
+});
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js
new file mode 100644
index 0000000..9ace772
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js
@@ -0,0 +1,6 @@
+function _arrayLikeToArray(r, a) {
+  (null == a || a > r.length) && (a = r.length);
+  for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
+  return n;
+}
+export { _arrayLikeToArray as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/arrayWithoutHoles.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/arrayWithoutHoles.js
new file mode 100644
index 0000000..1ce6f21
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/arrayWithoutHoles.js
@@ -0,0 +1,5 @@
+import arrayLikeToArray from "./arrayLikeToArray.js";
+function _arrayWithoutHoles(r) {
+  if (Array.isArray(r)) return arrayLikeToArray(r);
+}
+export { _arrayWithoutHoles as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js
new file mode 100644
index 0000000..4a41bde
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js
@@ -0,0 +1,5 @@
+function _assertThisInitialized(e) {
+  if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  return e;
+}
+export { _assertThisInitialized as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/createClass.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/createClass.js
new file mode 100644
index 0000000..9b17851
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/createClass.js
@@ -0,0 +1,13 @@
+import toPropertyKey from "./toPropertyKey.js";
+function _defineProperties(e, r) {
+  for (var t = 0; t < r.length; t++) {
+    var o = r[t];
+    o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, toPropertyKey(o.key), o);
+  }
+}
+function _createClass(e, r, t) {
+  return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", {
+    writable: !1
+  }), e;
+}
+export { _createClass as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/defineProperty.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/defineProperty.js
new file mode 100644
index 0000000..05ec32b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/defineProperty.js
@@ -0,0 +1,10 @@
+import toPropertyKey from "./toPropertyKey.js";
+function _defineProperty(e, r, t) {
+  return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+    value: t,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : e[r] = t, e;
+}
+export { _defineProperty as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/extends.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/extends.js
new file mode 100644
index 0000000..53f118c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/extends.js
@@ -0,0 +1,10 @@
+function _extends() {
+  return _extends = Object.assign ? Object.assign.bind() : function (n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+    }
+    return n;
+  }, _extends.apply(null, arguments);
+}
+export { _extends as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/inheritsLoose.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/inheritsLoose.js
new file mode 100644
index 0000000..0bd1330
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/inheritsLoose.js
@@ -0,0 +1,5 @@
+import setPrototypeOf from "./setPrototypeOf.js";
+function _inheritsLoose(t, o) {
+  t.prototype = Object.create(o.prototype), t.prototype.constructor = t, setPrototypeOf(t, o);
+}
+export { _inheritsLoose as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/iterableToArray.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/iterableToArray.js
new file mode 100644
index 0000000..b7de339
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/iterableToArray.js
@@ -0,0 +1,4 @@
+function _iterableToArray(r) {
+  if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r);
+}
+export { _iterableToArray as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/nonIterableSpread.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/nonIterableSpread.js
new file mode 100644
index 0000000..fb03235
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/nonIterableSpread.js
@@ -0,0 +1,4 @@
+function _nonIterableSpread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+export { _nonIterableSpread as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/objectSpread2.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/objectSpread2.js
new file mode 100644
index 0000000..0035bc7
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/objectSpread2.js
@@ -0,0 +1,23 @@
+import defineProperty from "./defineProperty.js";
+function ownKeys(e, r) {
+  var t = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    r && (o = o.filter(function (r) {
+      return Object.getOwnPropertyDescriptor(e, r).enumerable;
+    })), t.push.apply(t, o);
+  }
+  return t;
+}
+function _objectSpread2(e) {
+  for (var r = 1; r < arguments.length; r++) {
+    var t = null != arguments[r] ? arguments[r] : {};
+    r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
+      defineProperty(e, r, t[r]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
+      Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+    });
+  }
+  return e;
+}
+export { _objectSpread2 as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js
new file mode 100644
index 0000000..09a8ef6
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js
@@ -0,0 +1,10 @@
+function _objectWithoutPropertiesLoose(r, e) {
+  if (null == r) return {};
+  var t = {};
+  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
+    if (e.indexOf(n) >= 0) continue;
+    t[n] = r[n];
+  }
+  return t;
+}
+export { _objectWithoutPropertiesLoose as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js
new file mode 100644
index 0000000..c30983c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js
@@ -0,0 +1,6 @@
+function _setPrototypeOf(t, e) {
+  return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) {
+    return t.__proto__ = e, t;
+  }, _setPrototypeOf(t, e);
+}
+export { _setPrototypeOf as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral.js
new file mode 100644
index 0000000..3d842cd
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral.js
@@ -0,0 +1,8 @@
+function _taggedTemplateLiteral(e, t) {
+  return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, {
+    raw: {
+      value: Object.freeze(t)
+    }
+  }));
+}
+export { _taggedTemplateLiteral as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/toConsumableArray.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/toConsumableArray.js
new file mode 100644
index 0000000..f7338e4
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/toConsumableArray.js
@@ -0,0 +1,8 @@
+import arrayWithoutHoles from "./arrayWithoutHoles.js";
+import iterableToArray from "./iterableToArray.js";
+import unsupportedIterableToArray from "./unsupportedIterableToArray.js";
+import nonIterableSpread from "./nonIterableSpread.js";
+function _toConsumableArray(r) {
+  return arrayWithoutHoles(r) || iterableToArray(r) || unsupportedIterableToArray(r) || nonIterableSpread();
+}
+export { _toConsumableArray as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/toPrimitive.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/toPrimitive.js
new file mode 100644
index 0000000..9a3de46
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/toPrimitive.js
@@ -0,0 +1,12 @@
+import _typeof from "./typeof.js";
+function toPrimitive(t, r) {
+  if ("object" != _typeof(t) || !t) return t;
+  var e = t[Symbol.toPrimitive];
+  if (void 0 !== e) {
+    var i = e.call(t, r || "default");
+    if ("object" != _typeof(i)) return i;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return ("string" === r ? String : Number)(t);
+}
+export { toPrimitive as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/toPropertyKey.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/toPropertyKey.js
new file mode 100644
index 0000000..b3274d8
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/toPropertyKey.js
@@ -0,0 +1,7 @@
+import _typeof from "./typeof.js";
+import toPrimitive from "./toPrimitive.js";
+function toPropertyKey(t) {
+  var i = toPrimitive(t, "string");
+  return "symbol" == _typeof(i) ? i : i + "";
+}
+export { toPropertyKey as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/typeof.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/typeof.js
new file mode 100644
index 0000000..5b0bc9b
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/typeof.js
@@ -0,0 +1,10 @@
+function _typeof(o) {
+  "@babel/helpers - typeof";
+
+  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
+    return typeof o;
+  } : function (o) {
+    return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
+  }, _typeof(o);
+}
+export { _typeof as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js b/ddb_main/node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js
new file mode 100644
index 0000000..33adc49
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js
@@ -0,0 +1,9 @@
+import arrayLikeToArray from "./arrayLikeToArray.js";
+function _unsupportedIterableToArray(r, a) {
+  if (r) {
+    if ("string" == typeof r) return arrayLikeToArray(r, a);
+    var t = {}.toString.call(r).slice(8, -1);
+    return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? arrayLikeToArray(r, a) : void 0;
+  }
+}
+export { _unsupportedIterableToArray as default };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/extends.js b/ddb_main/node_modules/@babel/runtime/helpers/extends.js
new file mode 100644
index 0000000..9c0885c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/extends.js
@@ -0,0 +1,10 @@
+function _extends() {
+  return (module.exports = _extends = Object.assign ? Object.assign.bind() : function (n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+    }
+    return n;
+  }, module.exports.__esModule = true, module.exports["default"] = module.exports), _extends.apply(null, arguments);
+}
+module.exports = _extends, module.exports.__esModule = true, module.exports["default"] = module.exports;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/interopRequireDefault.js b/ddb_main/node_modules/@babel/runtime/helpers/interopRequireDefault.js
new file mode 100644
index 0000000..6944715
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/interopRequireDefault.js
@@ -0,0 +1,6 @@
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    "default": e
+  };
+}
+module.exports = _interopRequireDefault, module.exports.__esModule = true, module.exports["default"] = module.exports;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js b/ddb_main/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js
new file mode 100644
index 0000000..21ca98c
--- /dev/null
+++ b/ddb_main/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js
@@ -0,0 +1,10 @@
+function _objectWithoutPropertiesLoose(r, e) {
+  if (null == r) return {};
+  var t = {};
+  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
+    if (e.indexOf(n) >= 0) continue;
+    t[n] = r[n];
+  }
+  return t;
+}
+module.exports = _objectWithoutPropertiesLoose, module.exports.__esModule = true, module.exports["default"] = module.exports;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/authentication-lib-js/dist/AuthUtils.js b/ddb_main/node_modules/@dndbeyond/authentication-lib-js/dist/AuthUtils.js
new file mode 100644
index 0000000..26a316d
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/authentication-lib-js/dist/AuthUtils.js
@@ -0,0 +1,115 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var BaseConfig = {
+  earlyRefresh: 30
+};
+
+var getAuthorizationHeader = function getAuthorizationHeader(token) {
+  return "Bearer ".concat(token);
+};
+/**
+ * Requests a short term token from the DDB Auth API using the Cobalt session cookie to authorize the user
+ * @param {string} authUrl The URL to the cobalt-token auth endpoint
+ * @param {boolean} throwOnHttpStatusError Option to transform error status codes (4xx/5xx) to exceptions
+ * @returns {Promise<object>} A promise that resolves to the JSON object returned by the Auth API
+ */
+
+
+var getShortTermToken = function getShortTermToken(_ref) {
+  var _ref$authUrl = _ref.authUrl,
+      authUrl = _ref$authUrl === void 0 ? 'https://auth-service.dndbeyond.com/v1/cobalt-token' : _ref$authUrl,
+      _ref$throwOnHttpStatu = _ref.throwOnHttpStatusError,
+      throwOnHttpStatusError = _ref$throwOnHttpStatu === void 0 ? true : _ref$throwOnHttpStatu;
+  return fetch(authUrl, {
+    credentials: 'include',
+    method: 'POST'
+  }).then(function (response) {
+    // eslint-disable-next-line no-magic-numbers, `Copied from https://github.com/whatwg/fetch/issues/18#issuecomment-68273579`
+    if (throwOnHttpStatusError && response.status >= 400 && response.status < 600) {
+      throw new Error('Bad response from server');
+    }
+
+    return response.json();
+  });
+};
+/**
+ * Makes a getter function that will return a promise that resolves to a short term token (JWT) if signed in, null otherwise
+ * @param {object} options Options object that is passed on to internally called methods
+ * @returns {function(): (Promise<object>)} A promise that resolves to a short term token (JWT) if signed in, null otherwise
+ */
+
+
+var makeGetShortTermToken = function makeGetShortTermToken(options) {
+  var _options$earlyRefresh = options.earlyRefresh,
+      earlyRefresh = _options$earlyRefresh === void 0 ? BaseConfig.earlyRefresh : _options$earlyRefresh,
+      _options$getShortTerm = options.getShortTermTokenFunc,
+      getShortTermTokenFunc = _options$getShortTerm === void 0 ? getShortTermToken : _options$getShortTerm;
+  var timeOfRequest;
+  var lastSessionToken;
+  var timeToLive = 0;
+  var pendingRequest = null;
+  return function () {
+    var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+        _ref2$ignoreAnonymous = _ref2.ignoreAnonymousTimeToLive,
+        ignoreAnonymousTimeToLive = _ref2$ignoreAnonymous === void 0 ? false : _ref2$ignoreAnonymous;
+
+    if (pendingRequest) {
+      return pendingRequest;
+    }
+
+    var shouldUseTimeToLive = ignoreAnonymousTimeToLive ? lastSessionToken != null : true;
+
+    if (shouldUseTimeToLive && timeToLive && timeOfRequest + timeToLive > Date.now()) {
+      return new Promise(function (resolve) {
+        return resolve(lastSessionToken);
+      });
+    }
+
+    timeOfRequest = Date.now();
+    pendingRequest = getShortTermTokenFunc(options).then(function (data) {
+      lastSessionToken = data.token; // eslint-disable-next-line no-magic-numbers, "multiply by 1000 because TTL is measured in seconds"
+
+      timeToLive = (data.ttl - earlyRefresh) * 1000;
+      pendingRequest = null;
+      return data.token;
+    })["catch"](function (error) {
+      timeToLive = 0;
+      lastSessionToken = null;
+      pendingRequest = null;
+      throw error;
+    });
+    return pendingRequest;
+  };
+};
+/**
+ * Makes a getter function that will return a promise that resolves to auth headers if signed in, an empty object otherwise
+ * @param {object} options Options object that is passed on to internally called methods
+ * @param {function} options.madeGetShortTermToken Optional function to use instead of calling makeGetShortTermToken so the same function instance can be shared
+ * @returns {function(): (Promise<object>)} A promise that resolves to a headers object if signed in, an empty object otherwise
+ */
+
+
+var makeGetAuthorizationHeaders = function makeGetAuthorizationHeaders(options) {
+  var getShortTermTokenFunc = options.madeGetShortTermToken || makeGetShortTermToken(options);
+  return function () {
+    return getShortTermTokenFunc.apply(void 0, arguments).then(function (shortTermToken) {
+      if (!shortTermToken) {
+        return {};
+      }
+
+      return {
+        Authorization: getAuthorizationHeader(shortTermToken)
+      };
+    });
+  };
+};
+
+var _default = {
+  makeGetShortTermToken: makeGetShortTermToken,
+  makeGetAuthorizationHeaders: makeGetAuthorizationHeaders
+};
+exports["default"] = _default;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/authentication-lib-js/dist/UserUtils.js b/ddb_main/node_modules/@dndbeyond/authentication-lib-js/dist/UserUtils.js
new file mode 100644
index 0000000..c9cc7e4
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/authentication-lib-js/dist/UserUtils.js
@@ -0,0 +1,75 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
+
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
+
+function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
+
+// Manually implement reselect/createSelector without memoization so we don't force the dependency,
+//   because this object is simple enough to not need memoization and the interface makes it easier to share null handling logic
+var createSelector = function createSelector(deps, selector) {
+  return function (state) {
+    return selector.apply(void 0, _toConsumableArray(deps.map(function (dep) {
+      return dep(state);
+    })));
+  };
+};
+
+var getUser = function getUser(user) {
+  return user || {};
+};
+
+var getId = createSelector([getUser], function (_ref) {
+  var id = _ref.id;
+  return id;
+});
+var getName = createSelector([getUser], function (_ref2) {
+  var name = _ref2.name;
+  return name;
+});
+var getRoles = createSelector([getUser], function (_ref3) {
+  var roles = _ref3.roles;
+  return roles || [];
+});
+var getSubscriptions = createSelector([getUser], function (_ref4) {
+  var subscriptions = _ref4.subscriptions;
+  return subscriptions || [];
+});
+var getSubscriptionTier = createSelector([getUser], function (_ref5) {
+  var subscriptionTier = _ref5.subscriptionTier;
+  return subscriptionTier;
+});
+/**
+ * Converts a decoded JWT object to a simple user object
+ * @param {object} jwt, A decoded JWT from the Auth API
+ * @returns {object} A user object with simple property names instead of JWT schema links
+ */
+
+var jwtToUser = function jwtToUser(jwt) {
+  return jwt ? {
+    id: jwt['http://schemas.xmlsoap.org/ws/2005/05/identity/claims/nameidentifier'],
+    name: jwt['http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name'],
+    roles: jwt['http://schemas.microsoft.com/ws/2008/06/identity/claims/role'],
+    subscription: jwt['http://schemas.dndbeyond.com/ws/2019/08/identity/claims/subscriber'],
+    subscriptionTier: jwt['http://schemas.dndbeyond.com/ws/2019/08/identity/claims/subscriptiontier'],
+    avatarUrl: jwt.avatarUrl
+  } : null;
+};
+
+var _default = {
+  getId: getId,
+  getName: getName,
+  getRoles: getRoles,
+  getSubscriptions: getSubscriptions,
+  getSubscriptionTier: getSubscriptionTier,
+  jwtToUser: jwtToUser
+};
+exports["default"] = _default;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/authentication-lib-js/dist/index.js b/ddb_main/node_modules/@dndbeyond/authentication-lib-js/dist/index.js
new file mode 100644
index 0000000..c760aa8
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/authentication-lib-js/dist/index.js
@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "AuthUtils", {
+  enumerable: true,
+  get: function get() {
+    return _AuthUtils["default"];
+  }
+});
+Object.defineProperty(exports, "UserUtils", {
+  enumerable: true,
+  get: function get() {
+    return _UserUtils["default"];
+  }
+});
+exports["default"] = void 0;
+
+var _AuthUtils = _interopRequireDefault(require("./AuthUtils"));
+
+var _UserUtils = _interopRequireDefault(require("./UserUtils"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+// Export AuthUtils as default for backwards compatibility
+var _default = _AuthUtils["default"];
+exports["default"] = _default;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/ddb-common-components/dist/__stylesheet-helpers/design-system/_colors-exports.scss b/ddb_main/node_modules/@dndbeyond/ddb-common-components/dist/__stylesheet-helpers/design-system/_colors-exports.scss
new file mode 100644
index 0000000..e9a32bc
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ddb-common-components/dist/__stylesheet-helpers/design-system/_colors-exports.scss
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"$black":"#10161a","$white":"#fff","$gray-dark1":"#182026","$gray-dark2":"#202b33","$gray-dark3":"#293742","$gray-dark4":"#30404d","$gray-dark5":"#394b59","$gray1":"#5c7080","$gray2":"#738694","$gray3":"#8a9ba8","$gray4":"#a7b6c2","$gray5":"#bfccd6","$gray-light1":"#ced9e0","$gray-light2":"#d8e1e8","$gray-light3":"#e1e8ed","$gray-light4":"#ebf1f5","$gray-light5":"#f5f8fa","$blue1":"#1b9af0","$blue2":"#35adff","$blue3":"#5ebeff","$blue4":"#86ceff","$blue5":"#aedeff","$red-brand":"#e40712","$red1":"#bc0f0f","$red2":"#c93f3f","$red3":"#d54f4f","$red4":"#df7b7b","$red5":"#e79c9c","$green1":"#00c797","$green2":"#00daa6","$green3":"#33e1b8","$green4":"#66e9ca","$green5":"#99f0db","$yellow-orange1":"#f5a623","$yellow-orange2":"#f7b84f","$yellow-orange3":"#f9ca7b","$yellow-orange4":"#fbdba7","$yellow-orange5":"#fdedd3","$red-orange1":"#e45a1d","$red-orange2":"#e97b4a","$red-orange3":"#ef9c77","$red-orange4":"#f4bda5","$red-orange5":"#faded2","$alpha":"#e40712","$beta":"#1b9af0","$comingsoon":"#e45a1d","$newrelease":"#66e9ca"};
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/ddb-common-components/dist/__stylesheet-helpers/responsive/_breakpoints-queries-exports.scss b/ddb_main/node_modules/@dndbeyond/ddb-common-components/dist/__stylesheet-helpers/responsive/_breakpoints-queries-exports.scss
new file mode 100644
index 0000000..57a268e
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ddb-common-components/dist/__stylesheet-helpers/responsive/_breakpoints-queries-exports.scss
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"TinyBelow":"(max-width: 640px)","TinyAbove":"(min-width: 641px)","TinyToSmall":"(min-width: 641px) and (max-width: 768px)","TinyToMedium":"(min-width: 641px) and (max-width: 1024px)","TinyToLarge":"(min-width: 641px) and (max-width: 1200px)","SmallBelow":"(max-width: 768px)","SmallAbove":"(min-width: 769px)","SmallToMedium":"(min-width: 769px) and (max-width: 1024px)","SmallToLarge":"(min-width: 769px) and (max-width: 1200px)","MediumBelow":"(max-width: 1024px)","MediumAbove":"(min-width: 1025px)","MediumToLarge":"(min-width: 1025px) and (max-width: 1200px)","LargeBelow":"(max-width: 1200px)","LargeAbove":"(min-width: 1201px)"};
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/ddb-theme/index.esm.js b/ddb_main/node_modules/@dndbeyond/ddb-theme/index.esm.js
new file mode 100644
index 0000000..c5921d6
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ddb-theme/index.esm.js
@@ -0,0 +1,2666 @@
+import { createTheme } from '@mui/material/styles';
+import { createTheme as createTheme$1 } from '@mui/material';
+
+function _extends() {
+  _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends.apply(this, arguments);
+}
+
+function isPlainObject(item) {
+  return item !== null && typeof item === 'object' && item.constructor === Object;
+}
+function deepmerge(target, source, options = {
+  clone: true
+}) {
+  const output = options.clone ? _extends({}, target) : target;
+
+  if (isPlainObject(target) && isPlainObject(source)) {
+    Object.keys(source).forEach(key => {
+      // Avoid prototype pollution
+      if (key === '__proto__') {
+        return;
+      }
+
+      if (isPlainObject(source[key]) && key in target && isPlainObject(target[key])) {
+        // Since `output` is a clone of `target` and we have narrowed `target` in this block we can cast to the same type.
+        output[key] = deepmerge(target[key], source[key], options);
+      } else {
+        output[key] = source[key];
+      }
+    });
+  }
+
+  return output;
+}
+
+var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+const components = {
+  MuiButtonBase: {
+    defaultProps: {
+      disableRipple: true
+    }
+  },
+  MuiDialog: {
+    styleOverrides: {
+      paper: ({
+        theme
+      }) => ({
+        minWidth: 320,
+        '&.MuiPaper-rounded': {
+          borderRadius: '8px'
+        },
+        '&.MuiPaper-outlined': {
+          borderColor: theme.palette.primary.main
+        }
+      })
+    }
+  },
+  MuiGrid: {
+    styleOverrides: {
+      root: {
+        /**
+         * n.b. this is a workaround for bad types on the DialogTitle component,
+         * what I really want there is a Grid, but I don't want to enforce these
+         * styles on any other Grid components that might be passed in, so I add
+         * the className "DdbDialogTitle-root" to target this specific component
+         */
+        '&.DdbDialogTitle-root': {
+          padding: '16px 20px 8px',
+          '& .MuiIconButton-root': {
+            padding: '4px',
+            marginRight: '-8px'
+          }
+        }
+      }
+    }
+  },
+  MuiIconButton: {
+    styleOverrides: {
+      root: {
+        transition: 'none',
+        '&:hover': {
+          transition: 'none',
+          borderRadius: '3px'
+        }
+      }
+    }
+  },
+  MuiDialogContent: {
+    styleOverrides: {
+      root: {
+        padding: '16px 20px 0'
+      }
+    }
+  },
+  MuiDialogContentText: {
+    styleOverrides: {
+      root: ({
+        theme
+      }) => ({
+        color: theme.palette.text.primary,
+        letterSpacing: '0.15px',
+        marginBottom: '12px'
+      })
+    }
+  },
+  MuiButton: {
+    styleOverrides: {
+      root: {
+        fontSize: '15px',
+        lineHeight: 26 / 15,
+        letterSpacing: '0.45px'
+      }
+    }
+  }
+};
+
+const palette$1 = {
+  mode: 'dark',
+  text: {
+    primary: '#ecedeeff',
+    secondary: '#ecedeea3',
+    disabled: '#ecedee5c'
+  },
+  primary: {
+    main: '#dcdfe1ff',
+    dark: '#75838bff',
+    light: '#f9fafaff',
+    contrastText: '#000000ff'
+  },
+  secondary: {
+    main: '#00daa6ff',
+    dark: '#00b674ff',
+    light: '#b3efd9ff',
+    contrastText: '#000000ff'
+  },
+  action: {
+    active: '#dcdfe1a3',
+    hover: '#dcdfe11f',
+    selected: '#dcdfe12e',
+    disabled: '#dcdfe166',
+    disabledBackground: '#dcdfe133',
+    focus: '#dcdfe133'
+  },
+  error: {
+    main: '#ed6c02ff',
+    dark: '#c77700ff',
+    light: '#ffb547ff',
+    contrastText: '#ffffffff'
+  },
+  warning: {
+    main: '#ed6c02ff',
+    dark: '#c77700ff',
+    light: '#ffb547ff',
+    contrastText: '#ffffffff'
+  },
+  info: {
+    main: '#2196f3ff',
+    dark: '#0b79d0ff',
+    light: '#64b6f7ff',
+    contrastText: '#ffffffff'
+  },
+  success: {
+    main: '#4caf50ff',
+    dark: '#3b873eff',
+    light: '#7bc67eff',
+    contrastText: '#ffffffff'
+  },
+  background: {
+    paper: '#12181cff',
+    default: '#232b2fff',
+    pane: '#12181cdb'
+  },
+  common: {
+    white: '#ffffffff',
+    black: '#000000ff'
+  },
+  grey: {
+    '50': '#f4f5f5ff',
+    '100': '#ecedeeff',
+    '200': '#dcdfe1ff',
+    '300': '#c4cbceff',
+    '400': '#a2acb2ff',
+    '500': '#75838bff',
+    '600': '#525c63ff',
+    '700': '#374045ff',
+    '800': '#232b2fff',
+    '900': '#12181cff'
+  },
+  rarity: {
+    uncommon: '#7ebe15ff',
+    rare: '#41a9f2ff',
+    veryRare: '#c364e7ff',
+    legendary: '#ffb62aff',
+    artifact: '#f77558ff',
+    contrastText: '#000000ff'
+  },
+  reference: {
+    magicItem: '#41a9f2ff',
+    monster: '#f77558ff',
+    skill: '#7ebe15ff',
+    spell: '#c364e7ff',
+    contrastText: '#000000ff'
+  },
+  message: {
+    check: '#c364e7ff',
+    custom: '#ecedeea3',
+    damage: '#f77558ff',
+    healSave: '#7ebe15ff',
+    initiative: '#ffb62aff',
+    toHit: '#41a9f2ff'
+  }
+};
+
+const typography = {
+  h1: {
+    fontSize: '64px',
+    fontFamily: 'Tiamat Condensed SC',
+    fontWeight: 400,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 1,
+    lineHeight: '64px'
+  },
+  h2: {
+    fontSize: '48px',
+    fontFamily: 'Tiamat Condensed SC',
+    fontWeight: 400,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 0.8,
+    lineHeight: '52.8px'
+  },
+  h3: {
+    fontSize: '36px',
+    fontFamily: 'Tiamat Condensed SC',
+    fontWeight: 400,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 0.75,
+    lineHeight: '43.2px'
+  },
+  h4: {
+    fontSize: '26px',
+    fontFamily: 'Tiamat Condensed SC',
+    fontWeight: 400,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 0.6,
+    lineHeight: '32.5px'
+  },
+  h5: {
+    fontSize: '20px',
+    fontFamily: 'Roboto',
+    fontWeight: 500,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 0.32,
+    lineHeight: '25px'
+  },
+  h6: {
+    fontSize: '16px',
+    fontFamily: 'Roboto',
+    fontWeight: 500,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 0.25,
+    lineHeight: '22.4px'
+  },
+  body1: {
+    fontSize: '16px',
+    fontFamily: 'Roboto',
+    fontWeight: 400,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 0.15,
+    lineHeight: '24px'
+  },
+  body2: {
+    fontSize: '14px',
+    fontFamily: 'Roboto',
+    fontWeight: 400,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 0.15,
+    lineHeight: '20.02px'
+  },
+  subtitle1: {
+    fontSize: '16px',
+    fontFamily: 'Roboto',
+    fontWeight: 400,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 0.15,
+    lineHeight: '28px'
+  },
+  subtitle2: {
+    fontSize: '14px',
+    fontFamily: 'Roboto',
+    fontWeight: 500,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 0.1,
+    lineHeight: '21.98px'
+  },
+  overline: {
+    fontSize: '12px',
+    fontFamily: 'Roboto',
+    fontWeight: 400,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 1,
+    lineHeight: '31.92px',
+    textTransform: 'uppercase'
+  },
+  caption: {
+    fontSize: '12px',
+    fontFamily: 'Roboto',
+    fontWeight: 400,
+    fontStyle: 'normal',
+    fontStretch: 'normal',
+    letterSpacing: 0.4,
+    lineHeight: '19.92px'
+  }
+};
+
+// This file was generated with generate-themes script.
+const createDarkTheme = (options = {}) => createTheme(deepmerge({
+  components,
+  palette: palette$1,
+  typography
+}, options));
+
+const palette = {
+  mode: 'light',
+  text: {
+    primary: '#12181cff',
+    secondary: '#12181ca3',
+    disabled: '#12181c5c'
+  },
+  primary: {
+    main: '#374045ff',
+    dark: '#12181cff',
+    light: '#75838bff',
+    contrastText: '#ffffffff'
+  },
+  secondary: {
+    main: '#e40712ff',
+    dark: '#9f271dff',
+    light: '#f77558ff',
+    contrastText: '#ffffffff'
+  },
+  action: {
+    active: '#12181ca3',
+    hover: '#12181c14',
+    selected: '#12181c1f',
+    disabled: '#12181c5c',
+    disabledBackground: '#12181c29',
+    focus: '#12181c29'
+  },
+  error: {
+    main: '#ed6c02ff',
+    dark: '#c77700ff',
+    light: '#ffb547ff',
+    contrastText: '#ffffffff'
+  },
+  warning: {
+    main: '#ed6c02ff',
+    dark: '#c77700ff',
+    light: '#ffb547ff',
+    contrastText: '#ffffffff'
+  },
+  info: {
+    main: '#2196f3ff',
+    dark: '#0b79d0ff',
+    light: '#64b6f7ff',
+    contrastText: '#ffffffff'
+  },
+  success: {
+    main: '#4caf50ff',
+    dark: '#3b873eff',
+    light: '#7bc67eff',
+    contrastText: '#ffffffff'
+  },
+  background: {
+    paper: '#ffffffff',
+    default: '#f4f5f5ff',
+    parchment: '#f9f6efff',
+    scroll: '#eee8dbff'
+  },
+  common: {
+    white: '#ffffffff',
+    black: '#000000ff'
+  },
+  grey: {
+    '50': '#f4f5f5ff',
+    '100': '#ecedeeff',
+    '200': '#dcdfe1ff',
+    '300': '#c4cbceff',
+    '400': '#a2acb2ff',
+    '500': '#75838bff',
+    '600': '#525c63ff',
+    '700': '#374045ff',
+    '800': '#232b2fff',
+    '900': '#12181cff'
+  },
+  rarity: {
+    uncommon: '#009158ff',
+    rare: '#077bd0ff',
+    veryRare: '#9605d4ff',
+    legendary: '#ae5e21ff',
+    artifact: '#c81e18ff',
+    contrastText: '#ffffffff'
+  },
+  reference: {
+    character: '#ee8600ff',
+    magicItem: '#077bd0ff',
+    monster: '#c60000ff',
+    skill: '#009158ff',
+    spell: '#9605d4ff',
+    contrastText: '#ffffffff'
+  }
+};
+
+// This file was generated with generate-themes script.
+const createLightTheme = (options = {}) => createTheme$1(deepmerge({
+  components,
+  palette,
+  typography
+}, options));
+
+var check = function (it) {
+  return it && it.Math == Math && it;
+};
+
+// https://github.com/zloirock/core-js/issues/86#issuecomment-115759028
+var global$w =
+  // eslint-disable-next-line es-x/no-global-this -- safe
+  check(typeof globalThis == 'object' && globalThis) ||
+  check(typeof window == 'object' && window) ||
+  // eslint-disable-next-line no-restricted-globals -- safe
+  check(typeof self == 'object' && self) ||
+  check(typeof commonjsGlobal == 'object' && commonjsGlobal) ||
+  // eslint-disable-next-line no-new-func -- fallback
+  (function () { return this; })() || Function('return this')();
+
+var fails$g = function (exec) {
+  try {
+    return !!exec();
+  } catch (error) {
+    return true;
+  }
+};
+
+var fails$f = fails$g;
+
+var functionBindNative = !fails$f(function () {
+  // eslint-disable-next-line es-x/no-function-prototype-bind -- safe
+  var test = (function () { /* empty */ }).bind();
+  // eslint-disable-next-line no-prototype-builtins -- safe
+  return typeof test != 'function' || test.hasOwnProperty('prototype');
+});
+
+var NATIVE_BIND$2 = functionBindNative;
+
+var FunctionPrototype$2 = Function.prototype;
+var bind = FunctionPrototype$2.bind;
+var call$9 = FunctionPrototype$2.call;
+var uncurryThis$f = NATIVE_BIND$2 && bind.bind(call$9, call$9);
+
+var functionUncurryThis = NATIVE_BIND$2 ? function (fn) {
+  return fn && uncurryThis$f(fn);
+} : function (fn) {
+  return fn && function () {
+    return call$9.apply(fn, arguments);
+  };
+};
+
+var uncurryThis$e = functionUncurryThis;
+
+var toString$5 = uncurryThis$e({}.toString);
+var stringSlice$3 = uncurryThis$e(''.slice);
+
+var classofRaw$1 = function (it) {
+  return stringSlice$3(toString$5(it), 8, -1);
+};
+
+var global$v = global$w;
+var uncurryThis$d = functionUncurryThis;
+var fails$e = fails$g;
+var classof$5 = classofRaw$1;
+
+var Object$5 = global$v.Object;
+var split = uncurryThis$d(''.split);
+
+// fallback for non-array-like ES3 and non-enumerable old V8 strings
+var indexedObject = fails$e(function () {
+  // throws an error in rhino, see https://github.com/mozilla/rhino/issues/346
+  // eslint-disable-next-line no-prototype-builtins -- safe
+  return !Object$5('z').propertyIsEnumerable(0);
+}) ? function (it) {
+  return classof$5(it) == 'String' ? split(it, '') : Object$5(it);
+} : Object$5;
+
+var global$u = global$w;
+
+var TypeError$a = global$u.TypeError;
+
+// `RequireObjectCoercible` abstract operation
+// https://tc39.es/ecma262/#sec-requireobjectcoercible
+var requireObjectCoercible$4 = function (it) {
+  if (it == undefined) throw TypeError$a("Can't call method on " + it);
+  return it;
+};
+
+// toObject with fallback for non-array-like ES3 strings
+var IndexedObject = indexedObject;
+var requireObjectCoercible$3 = requireObjectCoercible$4;
+
+var toIndexedObject$5 = function (it) {
+  return IndexedObject(requireObjectCoercible$3(it));
+};
+
+var shared$4 = {exports: {}};
+
+var global$t = global$w;
+
+// eslint-disable-next-line es-x/no-object-defineproperty -- safe
+var defineProperty$3 = Object.defineProperty;
+
+var setGlobal$3 = function (key, value) {
+  try {
+    defineProperty$3(global$t, key, { value: value, configurable: true, writable: true });
+  } catch (error) {
+    global$t[key] = value;
+  } return value;
+};
+
+var global$s = global$w;
+var setGlobal$2 = setGlobal$3;
+
+var SHARED = '__core-js_shared__';
+var store$3 = global$s[SHARED] || setGlobal$2(SHARED, {});
+
+var sharedStore = store$3;
+
+var store$2 = sharedStore;
+
+(shared$4.exports = function (key, value) {
+  return store$2[key] || (store$2[key] = value !== undefined ? value : {});
+})('versions', []).push({
+  version: '3.22.4',
+  mode: 'global',
+  copyright: '© 2014-2022 Denis Pushkarev (zloirock.ru)',
+  license: 'https://github.com/zloirock/core-js/blob/v3.22.4/LICENSE',
+  source: 'https://github.com/zloirock/core-js'
+});
+
+var global$r = global$w;
+var requireObjectCoercible$2 = requireObjectCoercible$4;
+
+var Object$4 = global$r.Object;
+
+// `ToObject` abstract operation
+// https://tc39.es/ecma262/#sec-toobject
+var toObject$2 = function (argument) {
+  return Object$4(requireObjectCoercible$2(argument));
+};
+
+var uncurryThis$c = functionUncurryThis;
+var toObject$1 = toObject$2;
+
+var hasOwnProperty = uncurryThis$c({}.hasOwnProperty);
+
+// `HasOwnProperty` abstract operation
+// https://tc39.es/ecma262/#sec-hasownproperty
+// eslint-disable-next-line es-x/no-object-hasown -- safe
+var hasOwnProperty_1 = Object.hasOwn || function hasOwn(it, key) {
+  return hasOwnProperty(toObject$1(it), key);
+};
+
+var uncurryThis$b = functionUncurryThis;
+
+var id = 0;
+var postfix = Math.random();
+var toString$4 = uncurryThis$b(1.0.toString);
+
+var uid$2 = function (key) {
+  return 'Symbol(' + (key === undefined ? '' : key) + ')_' + toString$4(++id + postfix, 36);
+};
+
+// `IsCallable` abstract operation
+// https://tc39.es/ecma262/#sec-iscallable
+var isCallable$h = function (argument) {
+  return typeof argument == 'function';
+};
+
+var global$q = global$w;
+var isCallable$g = isCallable$h;
+
+var aFunction = function (argument) {
+  return isCallable$g(argument) ? argument : undefined;
+};
+
+var getBuiltIn$5 = function (namespace, method) {
+  return arguments.length < 2 ? aFunction(global$q[namespace]) : global$q[namespace] && global$q[namespace][method];
+};
+
+var getBuiltIn$4 = getBuiltIn$5;
+
+var engineUserAgent = getBuiltIn$4('navigator', 'userAgent') || '';
+
+var global$p = global$w;
+var userAgent = engineUserAgent;
+
+var process = global$p.process;
+var Deno = global$p.Deno;
+var versions = process && process.versions || Deno && Deno.version;
+var v8 = versions && versions.v8;
+var match, version;
+
+if (v8) {
+  match = v8.split('.');
+  // in old Chrome, versions of V8 isn't V8 = Chrome / 10
+  // but their correct versions are not interesting for us
+  version = match[0] > 0 && match[0] < 4 ? 1 : +(match[0] + match[1]);
+}
+
+// BrowserFS NodeJS `process` polyfill incorrectly set `.v8` to `0.0`
+// so check `userAgent` even if `.v8` exists, but 0
+if (!version && userAgent) {
+  match = userAgent.match(/Edge\/(\d+)/);
+  if (!match || match[1] >= 74) {
+    match = userAgent.match(/Chrome\/(\d+)/);
+    if (match) version = +match[1];
+  }
+}
+
+var engineV8Version = version;
+
+/* eslint-disable es-x/no-symbol -- required for testing */
+
+var V8_VERSION = engineV8Version;
+var fails$d = fails$g;
+
+// eslint-disable-next-line es-x/no-object-getownpropertysymbols -- required for testing
+var nativeSymbol = !!Object.getOwnPropertySymbols && !fails$d(function () {
+  var symbol = Symbol();
+  // Chrome 38 Symbol has incorrect toString conversion
+  // `get-own-property-symbols` polyfill symbols converted to object are not Symbol instances
+  return !String(symbol) || !(Object(symbol) instanceof Symbol) ||
+    // Chrome 38-40 symbols are not inherited from DOM collections prototypes to instances
+    !Symbol.sham && V8_VERSION && V8_VERSION < 41;
+});
+
+/* eslint-disable es-x/no-symbol -- required for testing */
+
+var NATIVE_SYMBOL$1 = nativeSymbol;
+
+var useSymbolAsUid = NATIVE_SYMBOL$1
+  && !Symbol.sham
+  && typeof Symbol.iterator == 'symbol';
+
+var global$o = global$w;
+var shared$3 = shared$4.exports;
+var hasOwn$8 = hasOwnProperty_1;
+var uid$1 = uid$2;
+var NATIVE_SYMBOL = nativeSymbol;
+var USE_SYMBOL_AS_UID$1 = useSymbolAsUid;
+
+var WellKnownSymbolsStore = shared$3('wks');
+var Symbol$1 = global$o.Symbol;
+var symbolFor = Symbol$1 && Symbol$1['for'];
+var createWellKnownSymbol = USE_SYMBOL_AS_UID$1 ? Symbol$1 : Symbol$1 && Symbol$1.withoutSetter || uid$1;
+
+var wellKnownSymbol$b = function (name) {
+  if (!hasOwn$8(WellKnownSymbolsStore, name) || !(NATIVE_SYMBOL || typeof WellKnownSymbolsStore[name] == 'string')) {
+    var description = 'Symbol.' + name;
+    if (NATIVE_SYMBOL && hasOwn$8(Symbol$1, name)) {
+      WellKnownSymbolsStore[name] = Symbol$1[name];
+    } else if (USE_SYMBOL_AS_UID$1 && symbolFor) {
+      WellKnownSymbolsStore[name] = symbolFor(description);
+    } else {
+      WellKnownSymbolsStore[name] = createWellKnownSymbol(description);
+    }
+  } return WellKnownSymbolsStore[name];
+};
+
+var isCallable$f = isCallable$h;
+
+var isObject$7 = function (it) {
+  return typeof it == 'object' ? it !== null : isCallable$f(it);
+};
+
+var global$n = global$w;
+var isObject$6 = isObject$7;
+
+var String$4 = global$n.String;
+var TypeError$9 = global$n.TypeError;
+
+// `Assert: Type(argument) is Object`
+var anObject$9 = function (argument) {
+  if (isObject$6(argument)) return argument;
+  throw TypeError$9(String$4(argument) + ' is not an object');
+};
+
+var objectDefineProperties = {};
+
+var fails$c = fails$g;
+
+// Detect IE8's incomplete defineProperty implementation
+var descriptors = !fails$c(function () {
+  // eslint-disable-next-line es-x/no-object-defineproperty -- required for testing
+  return Object.defineProperty({}, 1, { get: function () { return 7; } })[1] != 7;
+});
+
+var DESCRIPTORS$7 = descriptors;
+var fails$b = fails$g;
+
+// V8 ~ Chrome 36-
+// https://bugs.chromium.org/p/v8/issues/detail?id=3334
+var v8PrototypeDefineBug = DESCRIPTORS$7 && fails$b(function () {
+  // eslint-disable-next-line es-x/no-object-defineproperty -- required for testing
+  return Object.defineProperty(function () { /* empty */ }, 'prototype', {
+    value: 42,
+    writable: false
+  }).prototype != 42;
+});
+
+var objectDefineProperty = {};
+
+var global$m = global$w;
+var isObject$5 = isObject$7;
+
+var document$1 = global$m.document;
+// typeof document.createElement is 'object' in old IE
+var EXISTS$1 = isObject$5(document$1) && isObject$5(document$1.createElement);
+
+var documentCreateElement$2 = function (it) {
+  return EXISTS$1 ? document$1.createElement(it) : {};
+};
+
+var DESCRIPTORS$6 = descriptors;
+var fails$a = fails$g;
+var createElement = documentCreateElement$2;
+
+// Thanks to IE8 for its funny defineProperty
+var ie8DomDefine = !DESCRIPTORS$6 && !fails$a(function () {
+  // eslint-disable-next-line es-x/no-object-defineproperty -- required for testing
+  return Object.defineProperty(createElement('div'), 'a', {
+    get: function () { return 7; }
+  }).a != 7;
+});
+
+var NATIVE_BIND$1 = functionBindNative;
+
+var call$8 = Function.prototype.call;
+
+var functionCall = NATIVE_BIND$1 ? call$8.bind(call$8) : function () {
+  return call$8.apply(call$8, arguments);
+};
+
+var uncurryThis$a = functionUncurryThis;
+
+var objectIsPrototypeOf = uncurryThis$a({}.isPrototypeOf);
+
+var global$l = global$w;
+var getBuiltIn$3 = getBuiltIn$5;
+var isCallable$e = isCallable$h;
+var isPrototypeOf = objectIsPrototypeOf;
+var USE_SYMBOL_AS_UID = useSymbolAsUid;
+
+var Object$3 = global$l.Object;
+
+var isSymbol$2 = USE_SYMBOL_AS_UID ? function (it) {
+  return typeof it == 'symbol';
+} : function (it) {
+  var $Symbol = getBuiltIn$3('Symbol');
+  return isCallable$e($Symbol) && isPrototypeOf($Symbol.prototype, Object$3(it));
+};
+
+var global$k = global$w;
+
+var String$3 = global$k.String;
+
+var tryToString$2 = function (argument) {
+  try {
+    return String$3(argument);
+  } catch (error) {
+    return 'Object';
+  }
+};
+
+var global$j = global$w;
+var isCallable$d = isCallable$h;
+var tryToString$1 = tryToString$2;
+
+var TypeError$8 = global$j.TypeError;
+
+// `Assert: IsCallable(argument) is true`
+var aCallable$1 = function (argument) {
+  if (isCallable$d(argument)) return argument;
+  throw TypeError$8(tryToString$1(argument) + ' is not a function');
+};
+
+var aCallable = aCallable$1;
+
+// `GetMethod` abstract operation
+// https://tc39.es/ecma262/#sec-getmethod
+var getMethod$2 = function (V, P) {
+  var func = V[P];
+  return func == null ? undefined : aCallable(func);
+};
+
+var global$i = global$w;
+var call$7 = functionCall;
+var isCallable$c = isCallable$h;
+var isObject$4 = isObject$7;
+
+var TypeError$7 = global$i.TypeError;
+
+// `OrdinaryToPrimitive` abstract operation
+// https://tc39.es/ecma262/#sec-ordinarytoprimitive
+var ordinaryToPrimitive$1 = function (input, pref) {
+  var fn, val;
+  if (pref === 'string' && isCallable$c(fn = input.toString) && !isObject$4(val = call$7(fn, input))) return val;
+  if (isCallable$c(fn = input.valueOf) && !isObject$4(val = call$7(fn, input))) return val;
+  if (pref !== 'string' && isCallable$c(fn = input.toString) && !isObject$4(val = call$7(fn, input))) return val;
+  throw TypeError$7("Can't convert object to primitive value");
+};
+
+var global$h = global$w;
+var call$6 = functionCall;
+var isObject$3 = isObject$7;
+var isSymbol$1 = isSymbol$2;
+var getMethod$1 = getMethod$2;
+var ordinaryToPrimitive = ordinaryToPrimitive$1;
+var wellKnownSymbol$a = wellKnownSymbol$b;
+
+var TypeError$6 = global$h.TypeError;
+var TO_PRIMITIVE = wellKnownSymbol$a('toPrimitive');
+
+// `ToPrimitive` abstract operation
+// https://tc39.es/ecma262/#sec-toprimitive
+var toPrimitive$1 = function (input, pref) {
+  if (!isObject$3(input) || isSymbol$1(input)) return input;
+  var exoticToPrim = getMethod$1(input, TO_PRIMITIVE);
+  var result;
+  if (exoticToPrim) {
+    if (pref === undefined) pref = 'default';
+    result = call$6(exoticToPrim, input, pref);
+    if (!isObject$3(result) || isSymbol$1(result)) return result;
+    throw TypeError$6("Can't convert object to primitive value");
+  }
+  if (pref === undefined) pref = 'number';
+  return ordinaryToPrimitive(input, pref);
+};
+
+var toPrimitive = toPrimitive$1;
+var isSymbol = isSymbol$2;
+
+// `ToPropertyKey` abstract operation
+// https://tc39.es/ecma262/#sec-topropertykey
+var toPropertyKey$3 = function (argument) {
+  var key = toPrimitive(argument, 'string');
+  return isSymbol(key) ? key : key + '';
+};
+
+var global$g = global$w;
+var DESCRIPTORS$5 = descriptors;
+var IE8_DOM_DEFINE$1 = ie8DomDefine;
+var V8_PROTOTYPE_DEFINE_BUG$1 = v8PrototypeDefineBug;
+var anObject$8 = anObject$9;
+var toPropertyKey$2 = toPropertyKey$3;
+
+var TypeError$5 = global$g.TypeError;
+// eslint-disable-next-line es-x/no-object-defineproperty -- safe
+var $defineProperty = Object.defineProperty;
+// eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
+var $getOwnPropertyDescriptor$1 = Object.getOwnPropertyDescriptor;
+var ENUMERABLE = 'enumerable';
+var CONFIGURABLE$1 = 'configurable';
+var WRITABLE = 'writable';
+
+// `Object.defineProperty` method
+// https://tc39.es/ecma262/#sec-object.defineproperty
+objectDefineProperty.f = DESCRIPTORS$5 ? V8_PROTOTYPE_DEFINE_BUG$1 ? function defineProperty(O, P, Attributes) {
+  anObject$8(O);
+  P = toPropertyKey$2(P);
+  anObject$8(Attributes);
+  if (typeof O === 'function' && P === 'prototype' && 'value' in Attributes && WRITABLE in Attributes && !Attributes[WRITABLE]) {
+    var current = $getOwnPropertyDescriptor$1(O, P);
+    if (current && current[WRITABLE]) {
+      O[P] = Attributes.value;
+      Attributes = {
+        configurable: CONFIGURABLE$1 in Attributes ? Attributes[CONFIGURABLE$1] : current[CONFIGURABLE$1],
+        enumerable: ENUMERABLE in Attributes ? Attributes[ENUMERABLE] : current[ENUMERABLE],
+        writable: false
+      };
+    }
+  } return $defineProperty(O, P, Attributes);
+} : $defineProperty : function defineProperty(O, P, Attributes) {
+  anObject$8(O);
+  P = toPropertyKey$2(P);
+  anObject$8(Attributes);
+  if (IE8_DOM_DEFINE$1) try {
+    return $defineProperty(O, P, Attributes);
+  } catch (error) { /* empty */ }
+  if ('get' in Attributes || 'set' in Attributes) throw TypeError$5('Accessors not supported');
+  if ('value' in Attributes) O[P] = Attributes.value;
+  return O;
+};
+
+var ceil = Math.ceil;
+var floor = Math.floor;
+
+// `ToIntegerOrInfinity` abstract operation
+// https://tc39.es/ecma262/#sec-tointegerorinfinity
+var toIntegerOrInfinity$3 = function (argument) {
+  var number = +argument;
+  // eslint-disable-next-line no-self-compare -- safe
+  return number !== number || number === 0 ? 0 : (number > 0 ? floor : ceil)(number);
+};
+
+var toIntegerOrInfinity$2 = toIntegerOrInfinity$3;
+
+var max$1 = Math.max;
+var min$2 = Math.min;
+
+// Helper for a popular repeating case of the spec:
+// Let integer be ? ToInteger(index).
+// If integer < 0, let result be max((length + integer), 0); else let result be min(integer, length).
+var toAbsoluteIndex$2 = function (index, length) {
+  var integer = toIntegerOrInfinity$2(index);
+  return integer < 0 ? max$1(integer + length, 0) : min$2(integer, length);
+};
+
+var toIntegerOrInfinity$1 = toIntegerOrInfinity$3;
+
+var min$1 = Math.min;
+
+// `ToLength` abstract operation
+// https://tc39.es/ecma262/#sec-tolength
+var toLength$2 = function (argument) {
+  return argument > 0 ? min$1(toIntegerOrInfinity$1(argument), 0x1FFFFFFFFFFFFF) : 0; // 2 ** 53 - 1 == 9007199254740991
+};
+
+var toLength$1 = toLength$2;
+
+// `LengthOfArrayLike` abstract operation
+// https://tc39.es/ecma262/#sec-lengthofarraylike
+var lengthOfArrayLike$2 = function (obj) {
+  return toLength$1(obj.length);
+};
+
+var toIndexedObject$4 = toIndexedObject$5;
+var toAbsoluteIndex$1 = toAbsoluteIndex$2;
+var lengthOfArrayLike$1 = lengthOfArrayLike$2;
+
+// `Array.prototype.{ indexOf, includes }` methods implementation
+var createMethod$1 = function (IS_INCLUDES) {
+  return function ($this, el, fromIndex) {
+    var O = toIndexedObject$4($this);
+    var length = lengthOfArrayLike$1(O);
+    var index = toAbsoluteIndex$1(fromIndex, length);
+    var value;
+    // Array#includes uses SameValueZero equality algorithm
+    // eslint-disable-next-line no-self-compare -- NaN check
+    if (IS_INCLUDES && el != el) while (length > index) {
+      value = O[index++];
+      // eslint-disable-next-line no-self-compare -- NaN check
+      if (value != value) return true;
+    // Array#indexOf ignores holes, Array#includes - not
+    } else for (;length > index; index++) {
+      if ((IS_INCLUDES || index in O) && O[index] === el) return IS_INCLUDES || index || 0;
+    } return !IS_INCLUDES && -1;
+  };
+};
+
+var arrayIncludes = {
+  // `Array.prototype.includes` method
+  // https://tc39.es/ecma262/#sec-array.prototype.includes
+  includes: createMethod$1(true),
+  // `Array.prototype.indexOf` method
+  // https://tc39.es/ecma262/#sec-array.prototype.indexof
+  indexOf: createMethod$1(false)
+};
+
+var hiddenKeys$4 = {};
+
+var uncurryThis$9 = functionUncurryThis;
+var hasOwn$7 = hasOwnProperty_1;
+var toIndexedObject$3 = toIndexedObject$5;
+var indexOf$1 = arrayIncludes.indexOf;
+var hiddenKeys$3 = hiddenKeys$4;
+
+var push$1 = uncurryThis$9([].push);
+
+var objectKeysInternal = function (object, names) {
+  var O = toIndexedObject$3(object);
+  var i = 0;
+  var result = [];
+  var key;
+  for (key in O) !hasOwn$7(hiddenKeys$3, key) && hasOwn$7(O, key) && push$1(result, key);
+  // Don't enum bug & hidden keys
+  while (names.length > i) if (hasOwn$7(O, key = names[i++])) {
+    ~indexOf$1(result, key) || push$1(result, key);
+  }
+  return result;
+};
+
+// IE8- don't enum bug keys
+var enumBugKeys$3 = [
+  'constructor',
+  'hasOwnProperty',
+  'isPrototypeOf',
+  'propertyIsEnumerable',
+  'toLocaleString',
+  'toString',
+  'valueOf'
+];
+
+var internalObjectKeys$1 = objectKeysInternal;
+var enumBugKeys$2 = enumBugKeys$3;
+
+// `Object.keys` method
+// https://tc39.es/ecma262/#sec-object.keys
+// eslint-disable-next-line es-x/no-object-keys -- safe
+var objectKeys$1 = Object.keys || function keys(O) {
+  return internalObjectKeys$1(O, enumBugKeys$2);
+};
+
+var DESCRIPTORS$4 = descriptors;
+var V8_PROTOTYPE_DEFINE_BUG = v8PrototypeDefineBug;
+var definePropertyModule$4 = objectDefineProperty;
+var anObject$7 = anObject$9;
+var toIndexedObject$2 = toIndexedObject$5;
+var objectKeys = objectKeys$1;
+
+// `Object.defineProperties` method
+// https://tc39.es/ecma262/#sec-object.defineproperties
+// eslint-disable-next-line es-x/no-object-defineproperties -- safe
+objectDefineProperties.f = DESCRIPTORS$4 && !V8_PROTOTYPE_DEFINE_BUG ? Object.defineProperties : function defineProperties(O, Properties) {
+  anObject$7(O);
+  var props = toIndexedObject$2(Properties);
+  var keys = objectKeys(Properties);
+  var length = keys.length;
+  var index = 0;
+  var key;
+  while (length > index) definePropertyModule$4.f(O, key = keys[index++], props[key]);
+  return O;
+};
+
+var getBuiltIn$2 = getBuiltIn$5;
+
+var html$1 = getBuiltIn$2('document', 'documentElement');
+
+var shared$2 = shared$4.exports;
+var uid = uid$2;
+
+var keys = shared$2('keys');
+
+var sharedKey$3 = function (key) {
+  return keys[key] || (keys[key] = uid(key));
+};
+
+/* global ActiveXObject -- old IE, WSH */
+
+var anObject$6 = anObject$9;
+var definePropertiesModule = objectDefineProperties;
+var enumBugKeys$1 = enumBugKeys$3;
+var hiddenKeys$2 = hiddenKeys$4;
+var html = html$1;
+var documentCreateElement$1 = documentCreateElement$2;
+var sharedKey$2 = sharedKey$3;
+
+var GT = '>';
+var LT = '<';
+var PROTOTYPE = 'prototype';
+var SCRIPT = 'script';
+var IE_PROTO$1 = sharedKey$2('IE_PROTO');
+
+var EmptyConstructor = function () { /* empty */ };
+
+var scriptTag = function (content) {
+  return LT + SCRIPT + GT + content + LT + '/' + SCRIPT + GT;
+};
+
+// Create object with fake `null` prototype: use ActiveX Object with cleared prototype
+var NullProtoObjectViaActiveX = function (activeXDocument) {
+  activeXDocument.write(scriptTag(''));
+  activeXDocument.close();
+  var temp = activeXDocument.parentWindow.Object;
+  activeXDocument = null; // avoid memory leak
+  return temp;
+};
+
+// Create object with fake `null` prototype: use iframe Object with cleared prototype
+var NullProtoObjectViaIFrame = function () {
+  // Thrash, waste and sodomy: IE GC bug
+  var iframe = documentCreateElement$1('iframe');
+  var JS = 'java' + SCRIPT + ':';
+  var iframeDocument;
+  iframe.style.display = 'none';
+  html.appendChild(iframe);
+  // https://github.com/zloirock/core-js/issues/475
+  iframe.src = String(JS);
+  iframeDocument = iframe.contentWindow.document;
+  iframeDocument.open();
+  iframeDocument.write(scriptTag('document.F=Object'));
+  iframeDocument.close();
+  return iframeDocument.F;
+};
+
+// Check for document.domain and active x support
+// No need to use active x approach when document.domain is not set
+// see https://github.com/es-shims/es5-shim/issues/150
+// variation of https://github.com/kitcambridge/es5-shim/commit/4f738ac066346
+// avoid IE GC bug
+var activeXDocument;
+var NullProtoObject = function () {
+  try {
+    activeXDocument = new ActiveXObject('htmlfile');
+  } catch (error) { /* ignore */ }
+  NullProtoObject = typeof document != 'undefined'
+    ? document.domain && activeXDocument
+      ? NullProtoObjectViaActiveX(activeXDocument) // old IE
+      : NullProtoObjectViaIFrame()
+    : NullProtoObjectViaActiveX(activeXDocument); // WSH
+  var length = enumBugKeys$1.length;
+  while (length--) delete NullProtoObject[PROTOTYPE][enumBugKeys$1[length]];
+  return NullProtoObject();
+};
+
+hiddenKeys$2[IE_PROTO$1] = true;
+
+// `Object.create` method
+// https://tc39.es/ecma262/#sec-object.create
+// eslint-disable-next-line es-x/no-object-create -- safe
+var objectCreate = Object.create || function create(O, Properties) {
+  var result;
+  if (O !== null) {
+    EmptyConstructor[PROTOTYPE] = anObject$6(O);
+    result = new EmptyConstructor();
+    EmptyConstructor[PROTOTYPE] = null;
+    // add "__proto__" for Object.getPrototypeOf polyfill
+    result[IE_PROTO$1] = O;
+  } else result = NullProtoObject();
+  return Properties === undefined ? result : definePropertiesModule.f(result, Properties);
+};
+
+var wellKnownSymbol$9 = wellKnownSymbol$b;
+var create$2 = objectCreate;
+var definePropertyModule$3 = objectDefineProperty;
+
+var UNSCOPABLES = wellKnownSymbol$9('unscopables');
+var ArrayPrototype = Array.prototype;
+
+// Array.prototype[@@unscopables]
+// https://tc39.es/ecma262/#sec-array.prototype-@@unscopables
+if (ArrayPrototype[UNSCOPABLES] == undefined) {
+  definePropertyModule$3.f(ArrayPrototype, UNSCOPABLES, {
+    configurable: true,
+    value: create$2(null)
+  });
+}
+
+// add a key to Array.prototype[@@unscopables]
+var addToUnscopables$1 = function (key) {
+  ArrayPrototype[UNSCOPABLES][key] = true;
+};
+
+var iterators = {};
+
+var uncurryThis$8 = functionUncurryThis;
+var isCallable$b = isCallable$h;
+var store$1 = sharedStore;
+
+var functionToString = uncurryThis$8(Function.toString);
+
+// this helper broken in `core-js@3.4.1-3.4.4`, so we can't use `shared` helper
+if (!isCallable$b(store$1.inspectSource)) {
+  store$1.inspectSource = function (it) {
+    return functionToString(it);
+  };
+}
+
+var inspectSource$3 = store$1.inspectSource;
+
+var global$f = global$w;
+var isCallable$a = isCallable$h;
+var inspectSource$2 = inspectSource$3;
+
+var WeakMap$1 = global$f.WeakMap;
+
+var nativeWeakMap = isCallable$a(WeakMap$1) && /native code/.test(inspectSource$2(WeakMap$1));
+
+var createPropertyDescriptor$4 = function (bitmap, value) {
+  return {
+    enumerable: !(bitmap & 1),
+    configurable: !(bitmap & 2),
+    writable: !(bitmap & 4),
+    value: value
+  };
+};
+
+var DESCRIPTORS$3 = descriptors;
+var definePropertyModule$2 = objectDefineProperty;
+var createPropertyDescriptor$3 = createPropertyDescriptor$4;
+
+var createNonEnumerableProperty$6 = DESCRIPTORS$3 ? function (object, key, value) {
+  return definePropertyModule$2.f(object, key, createPropertyDescriptor$3(1, value));
+} : function (object, key, value) {
+  object[key] = value;
+  return object;
+};
+
+var NATIVE_WEAK_MAP = nativeWeakMap;
+var global$e = global$w;
+var uncurryThis$7 = functionUncurryThis;
+var isObject$2 = isObject$7;
+var createNonEnumerableProperty$5 = createNonEnumerableProperty$6;
+var hasOwn$6 = hasOwnProperty_1;
+var shared$1 = sharedStore;
+var sharedKey$1 = sharedKey$3;
+var hiddenKeys$1 = hiddenKeys$4;
+
+var OBJECT_ALREADY_INITIALIZED = 'Object already initialized';
+var TypeError$4 = global$e.TypeError;
+var WeakMap = global$e.WeakMap;
+var set, get, has;
+
+var enforce = function (it) {
+  return has(it) ? get(it) : set(it, {});
+};
+
+var getterFor = function (TYPE) {
+  return function (it) {
+    var state;
+    if (!isObject$2(it) || (state = get(it)).type !== TYPE) {
+      throw TypeError$4('Incompatible receiver, ' + TYPE + ' required');
+    } return state;
+  };
+};
+
+if (NATIVE_WEAK_MAP || shared$1.state) {
+  var store = shared$1.state || (shared$1.state = new WeakMap());
+  var wmget = uncurryThis$7(store.get);
+  var wmhas = uncurryThis$7(store.has);
+  var wmset = uncurryThis$7(store.set);
+  set = function (it, metadata) {
+    if (wmhas(store, it)) throw new TypeError$4(OBJECT_ALREADY_INITIALIZED);
+    metadata.facade = it;
+    wmset(store, it, metadata);
+    return metadata;
+  };
+  get = function (it) {
+    return wmget(store, it) || {};
+  };
+  has = function (it) {
+    return wmhas(store, it);
+  };
+} else {
+  var STATE = sharedKey$1('state');
+  hiddenKeys$1[STATE] = true;
+  set = function (it, metadata) {
+    if (hasOwn$6(it, STATE)) throw new TypeError$4(OBJECT_ALREADY_INITIALIZED);
+    metadata.facade = it;
+    createNonEnumerableProperty$5(it, STATE, metadata);
+    return metadata;
+  };
+  get = function (it) {
+    return hasOwn$6(it, STATE) ? it[STATE] : {};
+  };
+  has = function (it) {
+    return hasOwn$6(it, STATE);
+  };
+}
+
+var internalState = {
+  set: set,
+  get: get,
+  has: has,
+  enforce: enforce,
+  getterFor: getterFor
+};
+
+var objectGetOwnPropertyDescriptor = {};
+
+var objectPropertyIsEnumerable = {};
+
+var $propertyIsEnumerable = {}.propertyIsEnumerable;
+// eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
+var getOwnPropertyDescriptor$1 = Object.getOwnPropertyDescriptor;
+
+// Nashorn ~ JDK8 bug
+var NASHORN_BUG = getOwnPropertyDescriptor$1 && !$propertyIsEnumerable.call({ 1: 2 }, 1);
+
+// `Object.prototype.propertyIsEnumerable` method implementation
+// https://tc39.es/ecma262/#sec-object.prototype.propertyisenumerable
+objectPropertyIsEnumerable.f = NASHORN_BUG ? function propertyIsEnumerable(V) {
+  var descriptor = getOwnPropertyDescriptor$1(this, V);
+  return !!descriptor && descriptor.enumerable;
+} : $propertyIsEnumerable;
+
+var DESCRIPTORS$2 = descriptors;
+var call$5 = functionCall;
+var propertyIsEnumerableModule = objectPropertyIsEnumerable;
+var createPropertyDescriptor$2 = createPropertyDescriptor$4;
+var toIndexedObject$1 = toIndexedObject$5;
+var toPropertyKey$1 = toPropertyKey$3;
+var hasOwn$5 = hasOwnProperty_1;
+var IE8_DOM_DEFINE = ie8DomDefine;
+
+// eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
+var $getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
+
+// `Object.getOwnPropertyDescriptor` method
+// https://tc39.es/ecma262/#sec-object.getownpropertydescriptor
+objectGetOwnPropertyDescriptor.f = DESCRIPTORS$2 ? $getOwnPropertyDescriptor : function getOwnPropertyDescriptor(O, P) {
+  O = toIndexedObject$1(O);
+  P = toPropertyKey$1(P);
+  if (IE8_DOM_DEFINE) try {
+    return $getOwnPropertyDescriptor(O, P);
+  } catch (error) { /* empty */ }
+  if (hasOwn$5(O, P)) return createPropertyDescriptor$2(!call$5(propertyIsEnumerableModule.f, O, P), O[P]);
+};
+
+var makeBuiltIn$2 = {exports: {}};
+
+var DESCRIPTORS$1 = descriptors;
+var hasOwn$4 = hasOwnProperty_1;
+
+var FunctionPrototype$1 = Function.prototype;
+// eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
+var getDescriptor = DESCRIPTORS$1 && Object.getOwnPropertyDescriptor;
+
+var EXISTS = hasOwn$4(FunctionPrototype$1, 'name');
+// additional protection from minified / mangled / dropped function names
+var PROPER = EXISTS && (function something() { /* empty */ }).name === 'something';
+var CONFIGURABLE = EXISTS && (!DESCRIPTORS$1 || (DESCRIPTORS$1 && getDescriptor(FunctionPrototype$1, 'name').configurable));
+
+var functionName = {
+  EXISTS: EXISTS,
+  PROPER: PROPER,
+  CONFIGURABLE: CONFIGURABLE
+};
+
+var fails$9 = fails$g;
+var isCallable$9 = isCallable$h;
+var hasOwn$3 = hasOwnProperty_1;
+var defineProperty$2 = objectDefineProperty.f;
+var CONFIGURABLE_FUNCTION_NAME$1 = functionName.CONFIGURABLE;
+var inspectSource$1 = inspectSource$3;
+var InternalStateModule$1 = internalState;
+
+var enforceInternalState = InternalStateModule$1.enforce;
+var getInternalState$2 = InternalStateModule$1.get;
+
+var CONFIGURABLE_LENGTH = !fails$9(function () {
+  return defineProperty$2(function () { /* empty */ }, 'length', { value: 8 }).length !== 8;
+});
+
+var TEMPLATE = String(String).split('String');
+
+var makeBuiltIn$1 = makeBuiltIn$2.exports = function (value, name, options) {
+  if (String(name).slice(0, 7) === 'Symbol(') {
+    name = '[' + String(name).replace(/^Symbol\(([^)]*)\)/, '$1') + ']';
+  }
+  if (options && options.getter) name = 'get ' + name;
+  if (options && options.setter) name = 'set ' + name;
+  if (!hasOwn$3(value, 'name') || (CONFIGURABLE_FUNCTION_NAME$1 && value.name !== name)) {
+    defineProperty$2(value, 'name', { value: name, configurable: true });
+  }
+  if (CONFIGURABLE_LENGTH && options && hasOwn$3(options, 'arity') && value.length !== options.arity) {
+    defineProperty$2(value, 'length', { value: options.arity });
+  }
+  var state = enforceInternalState(value);
+  if (!hasOwn$3(state, 'source')) {
+    state.source = TEMPLATE.join(typeof name == 'string' ? name : '');
+  } return value;
+};
+
+// add fake Function#toString for correct work wrapped methods / constructors with methods like LoDash isNative
+// eslint-disable-next-line no-extend-native -- required
+Function.prototype.toString = makeBuiltIn$1(function toString() {
+  return isCallable$9(this) && getInternalState$2(this).source || inspectSource$1(this);
+}, 'toString');
+
+var global$d = global$w;
+var isCallable$8 = isCallable$h;
+var createNonEnumerableProperty$4 = createNonEnumerableProperty$6;
+var makeBuiltIn = makeBuiltIn$2.exports;
+var setGlobal$1 = setGlobal$3;
+
+var defineBuiltIn$4 = function (O, key, value, options) {
+  var unsafe = options ? !!options.unsafe : false;
+  var simple = options ? !!options.enumerable : false;
+  var noTargetGet = options ? !!options.noTargetGet : false;
+  var name = options && options.name !== undefined ? options.name : key;
+  if (isCallable$8(value)) makeBuiltIn(value, name, options);
+  if (O === global$d) {
+    if (simple) O[key] = value;
+    else setGlobal$1(key, value);
+    return O;
+  } else if (!unsafe) {
+    delete O[key];
+  } else if (!noTargetGet && O[key]) {
+    simple = true;
+  }
+  if (simple) O[key] = value;
+  else createNonEnumerableProperty$4(O, key, value);
+  return O;
+};
+
+var objectGetOwnPropertyNames = {};
+
+var internalObjectKeys = objectKeysInternal;
+var enumBugKeys = enumBugKeys$3;
+
+var hiddenKeys = enumBugKeys.concat('length', 'prototype');
+
+// `Object.getOwnPropertyNames` method
+// https://tc39.es/ecma262/#sec-object.getownpropertynames
+// eslint-disable-next-line es-x/no-object-getownpropertynames -- safe
+objectGetOwnPropertyNames.f = Object.getOwnPropertyNames || function getOwnPropertyNames(O) {
+  return internalObjectKeys(O, hiddenKeys);
+};
+
+var objectGetOwnPropertySymbols = {};
+
+// eslint-disable-next-line es-x/no-object-getownpropertysymbols -- safe
+objectGetOwnPropertySymbols.f = Object.getOwnPropertySymbols;
+
+var getBuiltIn$1 = getBuiltIn$5;
+var uncurryThis$6 = functionUncurryThis;
+var getOwnPropertyNamesModule = objectGetOwnPropertyNames;
+var getOwnPropertySymbolsModule = objectGetOwnPropertySymbols;
+var anObject$5 = anObject$9;
+
+var concat = uncurryThis$6([].concat);
+
+// all object keys, includes non-enumerable and symbols
+var ownKeys$1 = getBuiltIn$1('Reflect', 'ownKeys') || function ownKeys(it) {
+  var keys = getOwnPropertyNamesModule.f(anObject$5(it));
+  var getOwnPropertySymbols = getOwnPropertySymbolsModule.f;
+  return getOwnPropertySymbols ? concat(keys, getOwnPropertySymbols(it)) : keys;
+};
+
+var hasOwn$2 = hasOwnProperty_1;
+var ownKeys = ownKeys$1;
+var getOwnPropertyDescriptorModule = objectGetOwnPropertyDescriptor;
+var definePropertyModule$1 = objectDefineProperty;
+
+var copyConstructorProperties$1 = function (target, source, exceptions) {
+  var keys = ownKeys(source);
+  var defineProperty = definePropertyModule$1.f;
+  var getOwnPropertyDescriptor = getOwnPropertyDescriptorModule.f;
+  for (var i = 0; i < keys.length; i++) {
+    var key = keys[i];
+    if (!hasOwn$2(target, key) && !(exceptions && hasOwn$2(exceptions, key))) {
+      defineProperty(target, key, getOwnPropertyDescriptor(source, key));
+    }
+  }
+};
+
+var fails$8 = fails$g;
+var isCallable$7 = isCallable$h;
+
+var replacement = /#|\.prototype\./;
+
+var isForced$1 = function (feature, detection) {
+  var value = data[normalize(feature)];
+  return value == POLYFILL ? true
+    : value == NATIVE ? false
+    : isCallable$7(detection) ? fails$8(detection)
+    : !!detection;
+};
+
+var normalize = isForced$1.normalize = function (string) {
+  return String(string).replace(replacement, '.').toLowerCase();
+};
+
+var data = isForced$1.data = {};
+var NATIVE = isForced$1.NATIVE = 'N';
+var POLYFILL = isForced$1.POLYFILL = 'P';
+
+var isForced_1 = isForced$1;
+
+var global$c = global$w;
+var getOwnPropertyDescriptor = objectGetOwnPropertyDescriptor.f;
+var createNonEnumerableProperty$3 = createNonEnumerableProperty$6;
+var defineBuiltIn$3 = defineBuiltIn$4;
+var setGlobal = setGlobal$3;
+var copyConstructorProperties = copyConstructorProperties$1;
+var isForced = isForced_1;
+
+/*
+  options.target      - name of the target object
+  options.global      - target is the global object
+  options.stat        - export as static methods of target
+  options.proto       - export as prototype methods of target
+  options.real        - real prototype method for the `pure` version
+  options.forced      - export even if the native feature is available
+  options.bind        - bind methods to the target, required for the `pure` version
+  options.wrap        - wrap constructors to preventing global pollution, required for the `pure` version
+  options.unsafe      - use the simple assignment of property instead of delete + defineProperty
+  options.sham        - add a flag to not completely full polyfills
+  options.enumerable  - export as enumerable property
+  options.noTargetGet - prevent calling a getter on target
+  options.name        - the .name of the function if it does not match the key
+*/
+var _export = function (options, source) {
+  var TARGET = options.target;
+  var GLOBAL = options.global;
+  var STATIC = options.stat;
+  var FORCED, target, key, targetProperty, sourceProperty, descriptor;
+  if (GLOBAL) {
+    target = global$c;
+  } else if (STATIC) {
+    target = global$c[TARGET] || setGlobal(TARGET, {});
+  } else {
+    target = (global$c[TARGET] || {}).prototype;
+  }
+  if (target) for (key in source) {
+    sourceProperty = source[key];
+    if (options.noTargetGet) {
+      descriptor = getOwnPropertyDescriptor(target, key);
+      targetProperty = descriptor && descriptor.value;
+    } else targetProperty = target[key];
+    FORCED = isForced(GLOBAL ? key : TARGET + (STATIC ? '.' : '#') + key, options.forced);
+    // contained in target
+    if (!FORCED && targetProperty !== undefined) {
+      if (typeof sourceProperty == typeof targetProperty) continue;
+      copyConstructorProperties(sourceProperty, targetProperty);
+    }
+    // add a flag to not completely full polyfills
+    if (options.sham || (targetProperty && targetProperty.sham)) {
+      createNonEnumerableProperty$3(sourceProperty, 'sham', true);
+    }
+    defineBuiltIn$3(target, key, sourceProperty, options);
+  }
+};
+
+var fails$7 = fails$g;
+
+var correctPrototypeGetter = !fails$7(function () {
+  function F() { /* empty */ }
+  F.prototype.constructor = null;
+  // eslint-disable-next-line es-x/no-object-getprototypeof -- required for testing
+  return Object.getPrototypeOf(new F()) !== F.prototype;
+});
+
+var global$b = global$w;
+var hasOwn$1 = hasOwnProperty_1;
+var isCallable$6 = isCallable$h;
+var toObject = toObject$2;
+var sharedKey = sharedKey$3;
+var CORRECT_PROTOTYPE_GETTER = correctPrototypeGetter;
+
+var IE_PROTO = sharedKey('IE_PROTO');
+var Object$2 = global$b.Object;
+var ObjectPrototype = Object$2.prototype;
+
+// `Object.getPrototypeOf` method
+// https://tc39.es/ecma262/#sec-object.getprototypeof
+var objectGetPrototypeOf = CORRECT_PROTOTYPE_GETTER ? Object$2.getPrototypeOf : function (O) {
+  var object = toObject(O);
+  if (hasOwn$1(object, IE_PROTO)) return object[IE_PROTO];
+  var constructor = object.constructor;
+  if (isCallable$6(constructor) && object instanceof constructor) {
+    return constructor.prototype;
+  } return object instanceof Object$2 ? ObjectPrototype : null;
+};
+
+var fails$6 = fails$g;
+var isCallable$5 = isCallable$h;
+var getPrototypeOf$1 = objectGetPrototypeOf;
+var defineBuiltIn$2 = defineBuiltIn$4;
+var wellKnownSymbol$8 = wellKnownSymbol$b;
+
+var ITERATOR$2 = wellKnownSymbol$8('iterator');
+var BUGGY_SAFARI_ITERATORS$1 = false;
+
+// `%IteratorPrototype%` object
+// https://tc39.es/ecma262/#sec-%iteratorprototype%-object
+var IteratorPrototype$2, PrototypeOfArrayIteratorPrototype, arrayIterator;
+
+/* eslint-disable es-x/no-array-prototype-keys -- safe */
+if ([].keys) {
+  arrayIterator = [].keys();
+  // Safari 8 has buggy iterators w/o `next`
+  if (!('next' in arrayIterator)) BUGGY_SAFARI_ITERATORS$1 = true;
+  else {
+    PrototypeOfArrayIteratorPrototype = getPrototypeOf$1(getPrototypeOf$1(arrayIterator));
+    if (PrototypeOfArrayIteratorPrototype !== Object.prototype) IteratorPrototype$2 = PrototypeOfArrayIteratorPrototype;
+  }
+}
+
+var NEW_ITERATOR_PROTOTYPE = IteratorPrototype$2 == undefined || fails$6(function () {
+  var test = {};
+  // FF44- legacy iterators case
+  return IteratorPrototype$2[ITERATOR$2].call(test) !== test;
+});
+
+if (NEW_ITERATOR_PROTOTYPE) IteratorPrototype$2 = {};
+
+// `%IteratorPrototype%[@@iterator]()` method
+// https://tc39.es/ecma262/#sec-%iteratorprototype%-@@iterator
+if (!isCallable$5(IteratorPrototype$2[ITERATOR$2])) {
+  defineBuiltIn$2(IteratorPrototype$2, ITERATOR$2, function () {
+    return this;
+  });
+}
+
+var iteratorsCore = {
+  IteratorPrototype: IteratorPrototype$2,
+  BUGGY_SAFARI_ITERATORS: BUGGY_SAFARI_ITERATORS$1
+};
+
+var defineProperty$1 = objectDefineProperty.f;
+var hasOwn = hasOwnProperty_1;
+var wellKnownSymbol$7 = wellKnownSymbol$b;
+
+var TO_STRING_TAG$3 = wellKnownSymbol$7('toStringTag');
+
+var setToStringTag$2 = function (target, TAG, STATIC) {
+  if (target && !STATIC) target = target.prototype;
+  if (target && !hasOwn(target, TO_STRING_TAG$3)) {
+    defineProperty$1(target, TO_STRING_TAG$3, { configurable: true, value: TAG });
+  }
+};
+
+var IteratorPrototype$1 = iteratorsCore.IteratorPrototype;
+var create$1 = objectCreate;
+var createPropertyDescriptor$1 = createPropertyDescriptor$4;
+var setToStringTag$1 = setToStringTag$2;
+var Iterators$2 = iterators;
+
+var returnThis$1 = function () { return this; };
+
+var createIteratorConstructor$1 = function (IteratorConstructor, NAME, next, ENUMERABLE_NEXT) {
+  var TO_STRING_TAG = NAME + ' Iterator';
+  IteratorConstructor.prototype = create$1(IteratorPrototype$1, { next: createPropertyDescriptor$1(+!ENUMERABLE_NEXT, next) });
+  setToStringTag$1(IteratorConstructor, TO_STRING_TAG, false);
+  Iterators$2[TO_STRING_TAG] = returnThis$1;
+  return IteratorConstructor;
+};
+
+var global$a = global$w;
+var isCallable$4 = isCallable$h;
+
+var String$2 = global$a.String;
+var TypeError$3 = global$a.TypeError;
+
+var aPossiblePrototype$1 = function (argument) {
+  if (typeof argument == 'object' || isCallable$4(argument)) return argument;
+  throw TypeError$3("Can't set " + String$2(argument) + ' as a prototype');
+};
+
+/* eslint-disable no-proto -- safe */
+
+var uncurryThis$5 = functionUncurryThis;
+var anObject$4 = anObject$9;
+var aPossiblePrototype = aPossiblePrototype$1;
+
+// `Object.setPrototypeOf` method
+// https://tc39.es/ecma262/#sec-object.setprototypeof
+// Works with __proto__ only. Old v8 can't work with null proto objects.
+// eslint-disable-next-line es-x/no-object-setprototypeof -- safe
+var objectSetPrototypeOf = Object.setPrototypeOf || ('__proto__' in {} ? function () {
+  var CORRECT_SETTER = false;
+  var test = {};
+  var setter;
+  try {
+    // eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
+    setter = uncurryThis$5(Object.getOwnPropertyDescriptor(Object.prototype, '__proto__').set);
+    setter(test, []);
+    CORRECT_SETTER = test instanceof Array;
+  } catch (error) { /* empty */ }
+  return function setPrototypeOf(O, proto) {
+    anObject$4(O);
+    aPossiblePrototype(proto);
+    if (CORRECT_SETTER) setter(O, proto);
+    else O.__proto__ = proto;
+    return O;
+  };
+}() : undefined);
+
+var $$1 = _export;
+var call$4 = functionCall;
+var FunctionName = functionName;
+var isCallable$3 = isCallable$h;
+var createIteratorConstructor = createIteratorConstructor$1;
+var getPrototypeOf = objectGetPrototypeOf;
+var setPrototypeOf = objectSetPrototypeOf;
+var setToStringTag = setToStringTag$2;
+var createNonEnumerableProperty$2 = createNonEnumerableProperty$6;
+var defineBuiltIn$1 = defineBuiltIn$4;
+var wellKnownSymbol$6 = wellKnownSymbol$b;
+var Iterators$1 = iterators;
+var IteratorsCore = iteratorsCore;
+
+var PROPER_FUNCTION_NAME = FunctionName.PROPER;
+var CONFIGURABLE_FUNCTION_NAME = FunctionName.CONFIGURABLE;
+var IteratorPrototype = IteratorsCore.IteratorPrototype;
+var BUGGY_SAFARI_ITERATORS = IteratorsCore.BUGGY_SAFARI_ITERATORS;
+var ITERATOR$1 = wellKnownSymbol$6('iterator');
+var KEYS = 'keys';
+var VALUES = 'values';
+var ENTRIES = 'entries';
+
+var returnThis = function () { return this; };
+
+var defineIterator$1 = function (Iterable, NAME, IteratorConstructor, next, DEFAULT, IS_SET, FORCED) {
+  createIteratorConstructor(IteratorConstructor, NAME, next);
+
+  var getIterationMethod = function (KIND) {
+    if (KIND === DEFAULT && defaultIterator) return defaultIterator;
+    if (!BUGGY_SAFARI_ITERATORS && KIND in IterablePrototype) return IterablePrototype[KIND];
+    switch (KIND) {
+      case KEYS: return function keys() { return new IteratorConstructor(this, KIND); };
+      case VALUES: return function values() { return new IteratorConstructor(this, KIND); };
+      case ENTRIES: return function entries() { return new IteratorConstructor(this, KIND); };
+    } return function () { return new IteratorConstructor(this); };
+  };
+
+  var TO_STRING_TAG = NAME + ' Iterator';
+  var INCORRECT_VALUES_NAME = false;
+  var IterablePrototype = Iterable.prototype;
+  var nativeIterator = IterablePrototype[ITERATOR$1]
+    || IterablePrototype['@@iterator']
+    || DEFAULT && IterablePrototype[DEFAULT];
+  var defaultIterator = !BUGGY_SAFARI_ITERATORS && nativeIterator || getIterationMethod(DEFAULT);
+  var anyNativeIterator = NAME == 'Array' ? IterablePrototype.entries || nativeIterator : nativeIterator;
+  var CurrentIteratorPrototype, methods, KEY;
+
+  // fix native
+  if (anyNativeIterator) {
+    CurrentIteratorPrototype = getPrototypeOf(anyNativeIterator.call(new Iterable()));
+    if (CurrentIteratorPrototype !== Object.prototype && CurrentIteratorPrototype.next) {
+      if (getPrototypeOf(CurrentIteratorPrototype) !== IteratorPrototype) {
+        if (setPrototypeOf) {
+          setPrototypeOf(CurrentIteratorPrototype, IteratorPrototype);
+        } else if (!isCallable$3(CurrentIteratorPrototype[ITERATOR$1])) {
+          defineBuiltIn$1(CurrentIteratorPrototype, ITERATOR$1, returnThis);
+        }
+      }
+      // Set @@toStringTag to native iterators
+      setToStringTag(CurrentIteratorPrototype, TO_STRING_TAG, true);
+    }
+  }
+
+  // fix Array.prototype.{ values, @@iterator }.name in V8 / FF
+  if (PROPER_FUNCTION_NAME && DEFAULT == VALUES && nativeIterator && nativeIterator.name !== VALUES) {
+    if (CONFIGURABLE_FUNCTION_NAME) {
+      createNonEnumerableProperty$2(IterablePrototype, 'name', VALUES);
+    } else {
+      INCORRECT_VALUES_NAME = true;
+      defaultIterator = function values() { return call$4(nativeIterator, this); };
+    }
+  }
+
+  // export additional methods
+  if (DEFAULT) {
+    methods = {
+      values: getIterationMethod(VALUES),
+      keys: IS_SET ? defaultIterator : getIterationMethod(KEYS),
+      entries: getIterationMethod(ENTRIES)
+    };
+    if (FORCED) for (KEY in methods) {
+      if (BUGGY_SAFARI_ITERATORS || INCORRECT_VALUES_NAME || !(KEY in IterablePrototype)) {
+        defineBuiltIn$1(IterablePrototype, KEY, methods[KEY]);
+      }
+    } else $$1({ target: NAME, proto: true, forced: BUGGY_SAFARI_ITERATORS || INCORRECT_VALUES_NAME }, methods);
+  }
+
+  // define iterator
+  if (IterablePrototype[ITERATOR$1] !== defaultIterator) {
+    defineBuiltIn$1(IterablePrototype, ITERATOR$1, defaultIterator, { name: DEFAULT });
+  }
+  Iterators$1[NAME] = defaultIterator;
+
+  return methods;
+};
+
+var toIndexedObject = toIndexedObject$5;
+var addToUnscopables = addToUnscopables$1;
+var Iterators = iterators;
+var InternalStateModule = internalState;
+var defineProperty = objectDefineProperty.f;
+var defineIterator = defineIterator$1;
+var DESCRIPTORS = descriptors;
+
+var ARRAY_ITERATOR = 'Array Iterator';
+var setInternalState = InternalStateModule.set;
+var getInternalState$1 = InternalStateModule.getterFor(ARRAY_ITERATOR);
+
+// `Array.prototype.entries` method
+// https://tc39.es/ecma262/#sec-array.prototype.entries
+// `Array.prototype.keys` method
+// https://tc39.es/ecma262/#sec-array.prototype.keys
+// `Array.prototype.values` method
+// https://tc39.es/ecma262/#sec-array.prototype.values
+// `Array.prototype[@@iterator]` method
+// https://tc39.es/ecma262/#sec-array.prototype-@@iterator
+// `CreateArrayIterator` internal method
+// https://tc39.es/ecma262/#sec-createarrayiterator
+var es_array_iterator = defineIterator(Array, 'Array', function (iterated, kind) {
+  setInternalState(this, {
+    type: ARRAY_ITERATOR,
+    target: toIndexedObject(iterated), // target
+    index: 0,                          // next index
+    kind: kind                         // kind
+  });
+// `%ArrayIteratorPrototype%.next` method
+// https://tc39.es/ecma262/#sec-%arrayiteratorprototype%.next
+}, function () {
+  var state = getInternalState$1(this);
+  var target = state.target;
+  var kind = state.kind;
+  var index = state.index++;
+  if (!target || index >= target.length) {
+    state.target = undefined;
+    return { value: undefined, done: true };
+  }
+  if (kind == 'keys') return { value: index, done: false };
+  if (kind == 'values') return { value: target[index], done: false };
+  return { value: [index, target[index]], done: false };
+}, 'values');
+
+// argumentsList[@@iterator] is %ArrayProto_values%
+// https://tc39.es/ecma262/#sec-createunmappedargumentsobject
+// https://tc39.es/ecma262/#sec-createmappedargumentsobject
+var values = Iterators.Arguments = Iterators.Array;
+
+// https://tc39.es/ecma262/#sec-array.prototype-@@unscopables
+addToUnscopables('keys');
+addToUnscopables('values');
+addToUnscopables('entries');
+
+// V8 ~ Chrome 45- bug
+if (DESCRIPTORS && values.name !== 'values') try {
+  defineProperty(values, 'name', { value: 'values' });
+} catch (error) { /* empty */ }
+
+// iterable DOM collections
+// flag - `iterable` interface - 'entries', 'keys', 'values', 'forEach' methods
+var domIterables = {
+  CSSRuleList: 0,
+  CSSStyleDeclaration: 0,
+  CSSValueList: 0,
+  ClientRectList: 0,
+  DOMRectList: 0,
+  DOMStringList: 0,
+  DOMTokenList: 1,
+  DataTransferItemList: 0,
+  FileList: 0,
+  HTMLAllCollection: 0,
+  HTMLCollection: 0,
+  HTMLFormElement: 0,
+  HTMLSelectElement: 0,
+  MediaList: 0,
+  MimeTypeArray: 0,
+  NamedNodeMap: 0,
+  NodeList: 1,
+  PaintRequestList: 0,
+  Plugin: 0,
+  PluginArray: 0,
+  SVGLengthList: 0,
+  SVGNumberList: 0,
+  SVGPathSegList: 0,
+  SVGPointList: 0,
+  SVGStringList: 0,
+  SVGTransformList: 0,
+  SourceBufferList: 0,
+  StyleSheetList: 0,
+  TextTrackCueList: 0,
+  TextTrackList: 0,
+  TouchList: 0
+};
+
+// in old WebKit versions, `element.classList` is not an instance of global `DOMTokenList`
+var documentCreateElement = documentCreateElement$2;
+
+var classList = documentCreateElement('span').classList;
+var DOMTokenListPrototype$1 = classList && classList.constructor && classList.constructor.prototype;
+
+var domTokenListPrototype = DOMTokenListPrototype$1 === Object.prototype ? undefined : DOMTokenListPrototype$1;
+
+var global$9 = global$w;
+var DOMIterables = domIterables;
+var DOMTokenListPrototype = domTokenListPrototype;
+var ArrayIteratorMethods = es_array_iterator;
+var createNonEnumerableProperty$1 = createNonEnumerableProperty$6;
+var wellKnownSymbol$5 = wellKnownSymbol$b;
+
+var ITERATOR = wellKnownSymbol$5('iterator');
+var TO_STRING_TAG$2 = wellKnownSymbol$5('toStringTag');
+var ArrayValues = ArrayIteratorMethods.values;
+
+var handlePrototype = function (CollectionPrototype, COLLECTION_NAME) {
+  if (CollectionPrototype) {
+    // some Chrome versions have non-configurable methods on DOMTokenList
+    if (CollectionPrototype[ITERATOR] !== ArrayValues) try {
+      createNonEnumerableProperty$1(CollectionPrototype, ITERATOR, ArrayValues);
+    } catch (error) {
+      CollectionPrototype[ITERATOR] = ArrayValues;
+    }
+    if (!CollectionPrototype[TO_STRING_TAG$2]) {
+      createNonEnumerableProperty$1(CollectionPrototype, TO_STRING_TAG$2, COLLECTION_NAME);
+    }
+    if (DOMIterables[COLLECTION_NAME]) for (var METHOD_NAME in ArrayIteratorMethods) {
+      // some Chrome versions have non-configurable methods on DOMTokenList
+      if (CollectionPrototype[METHOD_NAME] !== ArrayIteratorMethods[METHOD_NAME]) try {
+        createNonEnumerableProperty$1(CollectionPrototype, METHOD_NAME, ArrayIteratorMethods[METHOD_NAME]);
+      } catch (error) {
+        CollectionPrototype[METHOD_NAME] = ArrayIteratorMethods[METHOD_NAME];
+      }
+    }
+  }
+};
+
+for (var COLLECTION_NAME in DOMIterables) {
+  handlePrototype(global$9[COLLECTION_NAME] && global$9[COLLECTION_NAME].prototype, COLLECTION_NAME);
+}
+
+handlePrototype(DOMTokenListPrototype, 'DOMTokenList');
+
+var wellKnownSymbol$4 = wellKnownSymbol$b;
+
+var TO_STRING_TAG$1 = wellKnownSymbol$4('toStringTag');
+var test = {};
+
+test[TO_STRING_TAG$1] = 'z';
+
+var toStringTagSupport = String(test) === '[object z]';
+
+var global$8 = global$w;
+var TO_STRING_TAG_SUPPORT = toStringTagSupport;
+var isCallable$2 = isCallable$h;
+var classofRaw = classofRaw$1;
+var wellKnownSymbol$3 = wellKnownSymbol$b;
+
+var TO_STRING_TAG = wellKnownSymbol$3('toStringTag');
+var Object$1 = global$8.Object;
+
+// ES3 wrong here
+var CORRECT_ARGUMENTS = classofRaw(function () { return arguments; }()) == 'Arguments';
+
+// fallback for IE11 Script Access Denied error
+var tryGet = function (it, key) {
+  try {
+    return it[key];
+  } catch (error) { /* empty */ }
+};
+
+// getting tag from ES6+ `Object.prototype.toString`
+var classof$4 = TO_STRING_TAG_SUPPORT ? classofRaw : function (it) {
+  var O, tag, result;
+  return it === undefined ? 'Undefined' : it === null ? 'Null'
+    // @@toStringTag case
+    : typeof (tag = tryGet(O = Object$1(it), TO_STRING_TAG)) == 'string' ? tag
+    // builtinTag case
+    : CORRECT_ARGUMENTS ? classofRaw(O)
+    // ES3 arguments fallback
+    : (result = classofRaw(O)) == 'Object' && isCallable$2(O.callee) ? 'Arguments' : result;
+};
+
+var global$7 = global$w;
+var classof$3 = classof$4;
+
+var String$1 = global$7.String;
+
+var toString$3 = function (argument) {
+  if (classof$3(argument) === 'Symbol') throw TypeError('Cannot convert a Symbol value to a string');
+  return String$1(argument);
+};
+
+var anObject$3 = anObject$9;
+
+// `RegExp.prototype.flags` getter implementation
+// https://tc39.es/ecma262/#sec-get-regexp.prototype.flags
+var regexpFlags$1 = function () {
+  var that = anObject$3(this);
+  var result = '';
+  if (that.hasIndices) result += 'd';
+  if (that.global) result += 'g';
+  if (that.ignoreCase) result += 'i';
+  if (that.multiline) result += 'm';
+  if (that.dotAll) result += 's';
+  if (that.unicode) result += 'u';
+  if (that.sticky) result += 'y';
+  return result;
+};
+
+var fails$5 = fails$g;
+var global$6 = global$w;
+
+// babel-minify and Closure Compiler transpiles RegExp('a', 'y') -> /a/y and it causes SyntaxError
+var $RegExp$2 = global$6.RegExp;
+
+var UNSUPPORTED_Y$2 = fails$5(function () {
+  var re = $RegExp$2('a', 'y');
+  re.lastIndex = 2;
+  return re.exec('abcd') != null;
+});
+
+// UC Browser bug
+// https://github.com/zloirock/core-js/issues/1008
+var MISSED_STICKY = UNSUPPORTED_Y$2 || fails$5(function () {
+  return !$RegExp$2('a', 'y').sticky;
+});
+
+var BROKEN_CARET = UNSUPPORTED_Y$2 || fails$5(function () {
+  // https://bugzilla.mozilla.org/show_bug.cgi?id=773687
+  var re = $RegExp$2('^r', 'gy');
+  re.lastIndex = 2;
+  return re.exec('str') != null;
+});
+
+var regexpStickyHelpers = {
+  BROKEN_CARET: BROKEN_CARET,
+  MISSED_STICKY: MISSED_STICKY,
+  UNSUPPORTED_Y: UNSUPPORTED_Y$2
+};
+
+var fails$4 = fails$g;
+var global$5 = global$w;
+
+// babel-minify and Closure Compiler transpiles RegExp('.', 's') -> /./s and it causes SyntaxError
+var $RegExp$1 = global$5.RegExp;
+
+var regexpUnsupportedDotAll = fails$4(function () {
+  var re = $RegExp$1('.', 's');
+  return !(re.dotAll && re.exec('\n') && re.flags === 's');
+});
+
+var fails$3 = fails$g;
+var global$4 = global$w;
+
+// babel-minify and Closure Compiler transpiles RegExp('(?<a>b)', 'g') -> /(?<a>b)/g and it causes SyntaxError
+var $RegExp = global$4.RegExp;
+
+var regexpUnsupportedNcg = fails$3(function () {
+  var re = $RegExp('(?<a>b)', 'g');
+  return re.exec('b').groups.a !== 'b' ||
+    'b'.replace(re, '$<a>c') !== 'bc';
+});
+
+/* eslint-disable regexp/no-empty-capturing-group, regexp/no-empty-group, regexp/no-lazy-ends -- testing */
+/* eslint-disable regexp/no-useless-quantifier -- testing */
+var call$3 = functionCall;
+var uncurryThis$4 = functionUncurryThis;
+var toString$2 = toString$3;
+var regexpFlags = regexpFlags$1;
+var stickyHelpers$1 = regexpStickyHelpers;
+var shared = shared$4.exports;
+var create = objectCreate;
+var getInternalState = internalState.get;
+var UNSUPPORTED_DOT_ALL = regexpUnsupportedDotAll;
+var UNSUPPORTED_NCG = regexpUnsupportedNcg;
+
+var nativeReplace = shared('native-string-replace', String.prototype.replace);
+var nativeExec = RegExp.prototype.exec;
+var patchedExec = nativeExec;
+var charAt$2 = uncurryThis$4(''.charAt);
+var indexOf = uncurryThis$4(''.indexOf);
+var replace = uncurryThis$4(''.replace);
+var stringSlice$2 = uncurryThis$4(''.slice);
+
+var UPDATES_LAST_INDEX_WRONG = (function () {
+  var re1 = /a/;
+  var re2 = /b*/g;
+  call$3(nativeExec, re1, 'a');
+  call$3(nativeExec, re2, 'a');
+  return re1.lastIndex !== 0 || re2.lastIndex !== 0;
+})();
+
+var UNSUPPORTED_Y$1 = stickyHelpers$1.BROKEN_CARET;
+
+// nonparticipating capturing group, copied from es5-shim's String#split patch.
+var NPCG_INCLUDED = /()??/.exec('')[1] !== undefined;
+
+var PATCH = UPDATES_LAST_INDEX_WRONG || NPCG_INCLUDED || UNSUPPORTED_Y$1 || UNSUPPORTED_DOT_ALL || UNSUPPORTED_NCG;
+
+if (PATCH) {
+  patchedExec = function exec(string) {
+    var re = this;
+    var state = getInternalState(re);
+    var str = toString$2(string);
+    var raw = state.raw;
+    var result, reCopy, lastIndex, match, i, object, group;
+
+    if (raw) {
+      raw.lastIndex = re.lastIndex;
+      result = call$3(patchedExec, raw, str);
+      re.lastIndex = raw.lastIndex;
+      return result;
+    }
+
+    var groups = state.groups;
+    var sticky = UNSUPPORTED_Y$1 && re.sticky;
+    var flags = call$3(regexpFlags, re);
+    var source = re.source;
+    var charsAdded = 0;
+    var strCopy = str;
+
+    if (sticky) {
+      flags = replace(flags, 'y', '');
+      if (indexOf(flags, 'g') === -1) {
+        flags += 'g';
+      }
+
+      strCopy = stringSlice$2(str, re.lastIndex);
+      // Support anchored sticky behavior.
+      if (re.lastIndex > 0 && (!re.multiline || re.multiline && charAt$2(str, re.lastIndex - 1) !== '\n')) {
+        source = '(?: ' + source + ')';
+        strCopy = ' ' + strCopy;
+        charsAdded++;
+      }
+      // ^(? + rx + ) is needed, in combination with some str slicing, to
+      // simulate the 'y' flag.
+      reCopy = new RegExp('^(?:' + source + ')', flags);
+    }
+
+    if (NPCG_INCLUDED) {
+      reCopy = new RegExp('^' + source + '$(?!\\s)', flags);
+    }
+    if (UPDATES_LAST_INDEX_WRONG) lastIndex = re.lastIndex;
+
+    match = call$3(nativeExec, sticky ? reCopy : re, strCopy);
+
+    if (sticky) {
+      if (match) {
+        match.input = stringSlice$2(match.input, charsAdded);
+        match[0] = stringSlice$2(match[0], charsAdded);
+        match.index = re.lastIndex;
+        re.lastIndex += match[0].length;
+      } else re.lastIndex = 0;
+    } else if (UPDATES_LAST_INDEX_WRONG && match) {
+      re.lastIndex = re.global ? match.index + match[0].length : lastIndex;
+    }
+    if (NPCG_INCLUDED && match && match.length > 1) {
+      // Fix browsers whose `exec` methods don't consistently return `undefined`
+      // for NPCG, like IE8. NOTE: This doesn' work for /(.?)?/
+      call$3(nativeReplace, match[0], reCopy, function () {
+        for (i = 1; i < arguments.length - 2; i++) {
+          if (arguments[i] === undefined) match[i] = undefined;
+        }
+      });
+    }
+
+    if (match && groups) {
+      match.groups = object = create(null);
+      for (i = 0; i < groups.length; i++) {
+        group = groups[i];
+        object[group[0]] = match[group[1]];
+      }
+    }
+
+    return match;
+  };
+}
+
+var regexpExec$3 = patchedExec;
+
+var $ = _export;
+var exec$2 = regexpExec$3;
+
+// `RegExp.prototype.exec` method
+// https://tc39.es/ecma262/#sec-regexp.prototype.exec
+$({ target: 'RegExp', proto: true, forced: /./.exec !== exec$2 }, {
+  exec: exec$2
+});
+
+var NATIVE_BIND = functionBindNative;
+
+var FunctionPrototype = Function.prototype;
+var apply$1 = FunctionPrototype.apply;
+var call$2 = FunctionPrototype.call;
+
+// eslint-disable-next-line es-x/no-reflect -- safe
+var functionApply = typeof Reflect == 'object' && Reflect.apply || (NATIVE_BIND ? call$2.bind(apply$1) : function () {
+  return call$2.apply(apply$1, arguments);
+});
+
+// TODO: Remove from `core-js@4` since it's moved to entry points
+
+var uncurryThis$3 = functionUncurryThis;
+var defineBuiltIn = defineBuiltIn$4;
+var regexpExec$2 = regexpExec$3;
+var fails$2 = fails$g;
+var wellKnownSymbol$2 = wellKnownSymbol$b;
+var createNonEnumerableProperty = createNonEnumerableProperty$6;
+
+var SPECIES$1 = wellKnownSymbol$2('species');
+var RegExpPrototype = RegExp.prototype;
+
+var fixRegexpWellKnownSymbolLogic = function (KEY, exec, FORCED, SHAM) {
+  var SYMBOL = wellKnownSymbol$2(KEY);
+
+  var DELEGATES_TO_SYMBOL = !fails$2(function () {
+    // String methods call symbol-named RegEp methods
+    var O = {};
+    O[SYMBOL] = function () { return 7; };
+    return ''[KEY](O) != 7;
+  });
+
+  var DELEGATES_TO_EXEC = DELEGATES_TO_SYMBOL && !fails$2(function () {
+    // Symbol-named RegExp methods call .exec
+    var execCalled = false;
+    var re = /a/;
+
+    if (KEY === 'split') {
+      // We can't use real regex here since it causes deoptimization
+      // and serious performance degradation in V8
+      // https://github.com/zloirock/core-js/issues/306
+      re = {};
+      // RegExp[@@split] doesn't call the regex's exec method, but first creates
+      // a new one. We need to return the patched regex when creating the new one.
+      re.constructor = {};
+      re.constructor[SPECIES$1] = function () { return re; };
+      re.flags = '';
+      re[SYMBOL] = /./[SYMBOL];
+    }
+
+    re.exec = function () { execCalled = true; return null; };
+
+    re[SYMBOL]('');
+    return !execCalled;
+  });
+
+  if (
+    !DELEGATES_TO_SYMBOL ||
+    !DELEGATES_TO_EXEC ||
+    FORCED
+  ) {
+    var uncurriedNativeRegExpMethod = uncurryThis$3(/./[SYMBOL]);
+    var methods = exec(SYMBOL, ''[KEY], function (nativeMethod, regexp, str, arg2, forceStringMethod) {
+      var uncurriedNativeMethod = uncurryThis$3(nativeMethod);
+      var $exec = regexp.exec;
+      if ($exec === regexpExec$2 || $exec === RegExpPrototype.exec) {
+        if (DELEGATES_TO_SYMBOL && !forceStringMethod) {
+          // The native String method already delegates to @@method (this
+          // polyfilled function), leasing to infinite recursion.
+          // We avoid it by directly calling the native @@method method.
+          return { done: true, value: uncurriedNativeRegExpMethod(regexp, str, arg2) };
+        }
+        return { done: true, value: uncurriedNativeMethod(str, regexp, arg2) };
+      }
+      return { done: false };
+    });
+
+    defineBuiltIn(String.prototype, KEY, methods[0]);
+    defineBuiltIn(RegExpPrototype, SYMBOL, methods[1]);
+  }
+
+  if (SHAM) createNonEnumerableProperty(RegExpPrototype[SYMBOL], 'sham', true);
+};
+
+var isObject$1 = isObject$7;
+var classof$2 = classofRaw$1;
+var wellKnownSymbol$1 = wellKnownSymbol$b;
+
+var MATCH = wellKnownSymbol$1('match');
+
+// `IsRegExp` abstract operation
+// https://tc39.es/ecma262/#sec-isregexp
+var isRegexp = function (it) {
+  var isRegExp;
+  return isObject$1(it) && ((isRegExp = it[MATCH]) !== undefined ? !!isRegExp : classof$2(it) == 'RegExp');
+};
+
+var uncurryThis$2 = functionUncurryThis;
+var fails$1 = fails$g;
+var isCallable$1 = isCallable$h;
+var classof$1 = classof$4;
+var getBuiltIn = getBuiltIn$5;
+var inspectSource = inspectSource$3;
+
+var noop = function () { /* empty */ };
+var empty = [];
+var construct = getBuiltIn('Reflect', 'construct');
+var constructorRegExp = /^\s*(?:class|function)\b/;
+var exec$1 = uncurryThis$2(constructorRegExp.exec);
+var INCORRECT_TO_STRING = !constructorRegExp.exec(noop);
+
+var isConstructorModern = function isConstructor(argument) {
+  if (!isCallable$1(argument)) return false;
+  try {
+    construct(noop, empty, argument);
+    return true;
+  } catch (error) {
+    return false;
+  }
+};
+
+var isConstructorLegacy = function isConstructor(argument) {
+  if (!isCallable$1(argument)) return false;
+  switch (classof$1(argument)) {
+    case 'AsyncFunction':
+    case 'GeneratorFunction':
+    case 'AsyncGeneratorFunction': return false;
+  }
+  try {
+    // we can't check .prototype since constructors produced by .bind haven't it
+    // `Function#toString` throws on some built-it function in some legacy engines
+    // (for example, `DOMQuad` and similar in FF41-)
+    return INCORRECT_TO_STRING || !!exec$1(constructorRegExp, inspectSource(argument));
+  } catch (error) {
+    return true;
+  }
+};
+
+isConstructorLegacy.sham = true;
+
+// `IsConstructor` abstract operation
+// https://tc39.es/ecma262/#sec-isconstructor
+var isConstructor$1 = !construct || fails$1(function () {
+  var called;
+  return isConstructorModern(isConstructorModern.call)
+    || !isConstructorModern(Object)
+    || !isConstructorModern(function () { called = true; })
+    || called;
+}) ? isConstructorLegacy : isConstructorModern;
+
+var global$3 = global$w;
+var isConstructor = isConstructor$1;
+var tryToString = tryToString$2;
+
+var TypeError$2 = global$3.TypeError;
+
+// `Assert: IsConstructor(argument) is true`
+var aConstructor$1 = function (argument) {
+  if (isConstructor(argument)) return argument;
+  throw TypeError$2(tryToString(argument) + ' is not a constructor');
+};
+
+var anObject$2 = anObject$9;
+var aConstructor = aConstructor$1;
+var wellKnownSymbol = wellKnownSymbol$b;
+
+var SPECIES = wellKnownSymbol('species');
+
+// `SpeciesConstructor` abstract operation
+// https://tc39.es/ecma262/#sec-speciesconstructor
+var speciesConstructor$1 = function (O, defaultConstructor) {
+  var C = anObject$2(O).constructor;
+  var S;
+  return C === undefined || (S = anObject$2(C)[SPECIES]) == undefined ? defaultConstructor : aConstructor(S);
+};
+
+var uncurryThis$1 = functionUncurryThis;
+var toIntegerOrInfinity = toIntegerOrInfinity$3;
+var toString$1 = toString$3;
+var requireObjectCoercible$1 = requireObjectCoercible$4;
+
+var charAt$1 = uncurryThis$1(''.charAt);
+var charCodeAt = uncurryThis$1(''.charCodeAt);
+var stringSlice$1 = uncurryThis$1(''.slice);
+
+var createMethod = function (CONVERT_TO_STRING) {
+  return function ($this, pos) {
+    var S = toString$1(requireObjectCoercible$1($this));
+    var position = toIntegerOrInfinity(pos);
+    var size = S.length;
+    var first, second;
+    if (position < 0 || position >= size) return CONVERT_TO_STRING ? '' : undefined;
+    first = charCodeAt(S, position);
+    return first < 0xD800 || first > 0xDBFF || position + 1 === size
+      || (second = charCodeAt(S, position + 1)) < 0xDC00 || second > 0xDFFF
+        ? CONVERT_TO_STRING
+          ? charAt$1(S, position)
+          : first
+        : CONVERT_TO_STRING
+          ? stringSlice$1(S, position, position + 2)
+          : (first - 0xD800 << 10) + (second - 0xDC00) + 0x10000;
+  };
+};
+
+var stringMultibyte = {
+  // `String.prototype.codePointAt` method
+  // https://tc39.es/ecma262/#sec-string.prototype.codepointat
+  codeAt: createMethod(false),
+  // `String.prototype.at` method
+  // https://github.com/mathiasbynens/String.prototype.at
+  charAt: createMethod(true)
+};
+
+var charAt = stringMultibyte.charAt;
+
+// `AdvanceStringIndex` abstract operation
+// https://tc39.es/ecma262/#sec-advancestringindex
+var advanceStringIndex$1 = function (S, index, unicode) {
+  return index + (unicode ? charAt(S, index).length : 1);
+};
+
+var toPropertyKey = toPropertyKey$3;
+var definePropertyModule = objectDefineProperty;
+var createPropertyDescriptor = createPropertyDescriptor$4;
+
+var createProperty$1 = function (object, key, value) {
+  var propertyKey = toPropertyKey(key);
+  if (propertyKey in object) definePropertyModule.f(object, propertyKey, createPropertyDescriptor(0, value));
+  else object[propertyKey] = value;
+};
+
+var global$2 = global$w;
+var toAbsoluteIndex = toAbsoluteIndex$2;
+var lengthOfArrayLike = lengthOfArrayLike$2;
+var createProperty = createProperty$1;
+
+var Array$1 = global$2.Array;
+var max = Math.max;
+
+var arraySliceSimple = function (O, start, end) {
+  var length = lengthOfArrayLike(O);
+  var k = toAbsoluteIndex(start, length);
+  var fin = toAbsoluteIndex(end === undefined ? length : end, length);
+  var result = Array$1(max(fin - k, 0));
+  for (var n = 0; k < fin; k++, n++) createProperty(result, n, O[k]);
+  result.length = n;
+  return result;
+};
+
+var global$1 = global$w;
+var call$1 = functionCall;
+var anObject$1 = anObject$9;
+var isCallable = isCallable$h;
+var classof = classofRaw$1;
+var regexpExec$1 = regexpExec$3;
+
+var TypeError$1 = global$1.TypeError;
+
+// `RegExpExec` abstract operation
+// https://tc39.es/ecma262/#sec-regexpexec
+var regexpExecAbstract = function (R, S) {
+  var exec = R.exec;
+  if (isCallable(exec)) {
+    var result = call$1(exec, R, S);
+    if (result !== null) anObject$1(result);
+    return result;
+  }
+  if (classof(R) === 'RegExp') return call$1(regexpExec$1, R, S);
+  throw TypeError$1('RegExp#exec called on incompatible receiver');
+};
+
+var apply = functionApply;
+var call = functionCall;
+var uncurryThis = functionUncurryThis;
+var fixRegExpWellKnownSymbolLogic = fixRegexpWellKnownSymbolLogic;
+var isRegExp = isRegexp;
+var anObject = anObject$9;
+var requireObjectCoercible = requireObjectCoercible$4;
+var speciesConstructor = speciesConstructor$1;
+var advanceStringIndex = advanceStringIndex$1;
+var toLength = toLength$2;
+var toString = toString$3;
+var getMethod = getMethod$2;
+var arraySlice = arraySliceSimple;
+var callRegExpExec = regexpExecAbstract;
+var regexpExec = regexpExec$3;
+var stickyHelpers = regexpStickyHelpers;
+var fails = fails$g;
+
+var UNSUPPORTED_Y = stickyHelpers.UNSUPPORTED_Y;
+var MAX_UINT32 = 0xFFFFFFFF;
+var min = Math.min;
+var $push = [].push;
+var exec = uncurryThis(/./.exec);
+var push = uncurryThis($push);
+var stringSlice = uncurryThis(''.slice);
+
+// Chrome 51 has a buggy "split" implementation when RegExp#exec !== nativeExec
+// Weex JS has frozen built-in prototypes, so use try / catch wrapper
+var SPLIT_WORKS_WITH_OVERWRITTEN_EXEC = !fails(function () {
+  // eslint-disable-next-line regexp/no-empty-group -- required for testing
+  var re = /(?:)/;
+  var originalExec = re.exec;
+  re.exec = function () { return originalExec.apply(this, arguments); };
+  var result = 'ab'.split(re);
+  return result.length !== 2 || result[0] !== 'a' || result[1] !== 'b';
+});
+
+// @@split logic
+fixRegExpWellKnownSymbolLogic('split', function (SPLIT, nativeSplit, maybeCallNative) {
+  var internalSplit;
+  if (
+    'abbc'.split(/(b)*/)[1] == 'c' ||
+    // eslint-disable-next-line regexp/no-empty-group -- required for testing
+    'test'.split(/(?:)/, -1).length != 4 ||
+    'ab'.split(/(?:ab)*/).length != 2 ||
+    '.'.split(/(.?)(.?)/).length != 4 ||
+    // eslint-disable-next-line regexp/no-empty-capturing-group, regexp/no-empty-group -- required for testing
+    '.'.split(/()()/).length > 1 ||
+    ''.split(/.?/).length
+  ) {
+    // based on es5-shim implementation, need to rework it
+    internalSplit = function (separator, limit) {
+      var string = toString(requireObjectCoercible(this));
+      var lim = limit === undefined ? MAX_UINT32 : limit >>> 0;
+      if (lim === 0) return [];
+      if (separator === undefined) return [string];
+      // If `separator` is not a regex, use native split
+      if (!isRegExp(separator)) {
+        return call(nativeSplit, string, separator, lim);
+      }
+      var output = [];
+      var flags = (separator.ignoreCase ? 'i' : '') +
+                  (separator.multiline ? 'm' : '') +
+                  (separator.unicode ? 'u' : '') +
+                  (separator.sticky ? 'y' : '');
+      var lastLastIndex = 0;
+      // Make `global` and avoid `lastIndex` issues by working with a copy
+      var separatorCopy = new RegExp(separator.source, flags + 'g');
+      var match, lastIndex, lastLength;
+      while (match = call(regexpExec, separatorCopy, string)) {
+        lastIndex = separatorCopy.lastIndex;
+        if (lastIndex > lastLastIndex) {
+          push(output, stringSlice(string, lastLastIndex, match.index));
+          if (match.length > 1 && match.index < string.length) apply($push, output, arraySlice(match, 1));
+          lastLength = match[0].length;
+          lastLastIndex = lastIndex;
+          if (output.length >= lim) break;
+        }
+        if (separatorCopy.lastIndex === match.index) separatorCopy.lastIndex++; // Avoid an infinite loop
+      }
+      if (lastLastIndex === string.length) {
+        if (lastLength || !exec(separatorCopy, '')) push(output, '');
+      } else push(output, stringSlice(string, lastLastIndex));
+      return output.length > lim ? arraySlice(output, 0, lim) : output;
+    };
+  // Chakra, V8
+  } else if ('0'.split(undefined, 0).length) {
+    internalSplit = function (separator, limit) {
+      return separator === undefined && limit === 0 ? [] : call(nativeSplit, this, separator, limit);
+    };
+  } else internalSplit = nativeSplit;
+
+  return [
+    // `String.prototype.split` method
+    // https://tc39.es/ecma262/#sec-string.prototype.split
+    function split(separator, limit) {
+      var O = requireObjectCoercible(this);
+      var splitter = separator == undefined ? undefined : getMethod(separator, SPLIT);
+      return splitter
+        ? call(splitter, separator, O, limit)
+        : call(internalSplit, toString(O), separator, limit);
+    },
+    // `RegExp.prototype[@@split]` method
+    // https://tc39.es/ecma262/#sec-regexp.prototype-@@split
+    //
+    // NOTE: This cannot be properly polyfilled in engines that don't support
+    // the 'y' flag.
+    function (string, limit) {
+      var rx = anObject(this);
+      var S = toString(string);
+      var res = maybeCallNative(internalSplit, rx, S, limit, internalSplit !== nativeSplit);
+
+      if (res.done) return res.value;
+
+      var C = speciesConstructor(rx, RegExp);
+
+      var unicodeMatching = rx.unicode;
+      var flags = (rx.ignoreCase ? 'i' : '') +
+                  (rx.multiline ? 'm' : '') +
+                  (rx.unicode ? 'u' : '') +
+                  (UNSUPPORTED_Y ? 'g' : 'y');
+
+      // ^(? + rx + ) is needed, in combination with some S slicing, to
+      // simulate the 'y' flag.
+      var splitter = new C(UNSUPPORTED_Y ? '^(?:' + rx.source + ')' : rx, flags);
+      var lim = limit === undefined ? MAX_UINT32 : limit >>> 0;
+      if (lim === 0) return [];
+      if (S.length === 0) return callRegExpExec(splitter, S) === null ? [S] : [];
+      var p = 0;
+      var q = 0;
+      var A = [];
+      while (q < S.length) {
+        splitter.lastIndex = UNSUPPORTED_Y ? 0 : q;
+        var z = callRegExpExec(splitter, UNSUPPORTED_Y ? stringSlice(S, q) : S);
+        var e;
+        if (
+          z === null ||
+          (e = min(toLength(splitter.lastIndex + (UNSUPPORTED_Y ? q : 0)), S.length)) === p
+        ) {
+          q = advanceStringIndex(S, q, unicodeMatching);
+        } else {
+          push(A, stringSlice(S, p, q));
+          if (A.length === lim) return A;
+          for (var i = 1; i <= z.length - 1; i++) {
+            push(A, z[i]);
+            if (A.length === lim) return A;
+          }
+          q = p = e;
+        }
+      }
+      push(A, stringSlice(S, p));
+      return A;
+    }
+  ];
+}, !SPLIT_WORKS_WITH_OVERWRITTEN_EXEC, UNSUPPORTED_Y);
+
+const isObject = value => !!(value && typeof value === 'object' && !Array.isArray(value)); // eslint-disable-next-line
+
+
+const getVariable = (object, keyString) => {
+  if (isObject(object)) {
+    // Get keys in given object
+    const entries = Object.entries(object); // Loop through keys for the desired key
+
+    for (let i = 0; i < entries.length; i++) {
+      // Break apart keys and values
+      const [key, value] = entries[i]; // If key is found, return value
+
+      if (keyString === key) {
+        return value;
+      } // If another object exists, search that object
+
+
+      if (isObject(value)) {
+        const child = getVariable(value, keyString); // If child is found, return child
+
+        if (child !== null) {
+          return child;
+        }
+      }
+    }
+  }
+
+  return null;
+};
+
+const getThemeValue = (theme, str) => {
+  if (!str) return; // Split keys separated with '.'
+
+  const keys = str.split('.');
+  let objectToSearch = theme; // Loop over keys
+
+  for (let i = 0; i < keys.length; i++) {
+    // Get the value for the given key
+    const found = getVariable(objectToSearch, keys[i]); // If value isn't an object, return it
+
+    if (!isObject(found)) return found; // If value is an object and has a `main` key, return
+
+    if (i === keys.length - 1 && 'main' in found) return found.main; // If value is an object, update object to search
+
+    objectToSearch = found;
+  }
+};
+
+export { createDarkTheme, createLightTheme, getThemeValue };
diff --git a/ddb_main/node_modules/@dndbeyond/dice-components/dist/diceComponents.js b/ddb_main/node_modules/@dndbeyond/dice-components/dist/diceComponents.js
new file mode 100644
index 0000000..8209cca
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/dice-components/dist/diceComponents.js
@@ -0,0 +1,75 @@
+/*! For license information please see diceComponents.js.LICENSE.txt */
+import*as e from"react";import*as t from"@dndbeyond/dice";import*as n from"react-dom";import*as r from"jss";import*as o from"@mui/material";import*as i from"@mui/icons-material";import*as a from"jss-preset-default";var s={9721:(e,t,n)=>{n.d(t,{Z:()=>re});var r=function(){function e(e){var t=this;this._insertTag=function(e){var n;n=0===t.tags.length?t.insertionPoint?t.insertionPoint.nextSibling:t.prepend?t.container.firstChild:t.before:t.tags[t.tags.length-1].nextSibling,t.container.insertBefore(e,n),t.tags.push(e)},this.isSpeedy=void 0===e.speedy||e.speedy,this.tags=[],this.ctr=0,this.nonce=e.nonce,this.key=e.key,this.container=e.container,this.prepend=e.prepend,this.insertionPoint=e.insertionPoint,this.before=null}var t=e.prototype;return t.hydrate=function(e){e.forEach(this._insertTag)},t.insert=function(e){this.ctr%(this.isSpeedy?65e3:1)==0&&this._insertTag(function(e){var t=document.createElement("style");return t.setAttribute("data-emotion",e.key),void 0!==e.nonce&&t.setAttribute("nonce",e.nonce),t.appendChild(document.createTextNode("")),t.setAttribute("data-s",""),t}(this));var t=this.tags[this.tags.length-1];if(this.isSpeedy){var n=function(e){if(e.sheet)return e.sheet;for(var t=0;t<document.styleSheets.length;t++)if(document.styleSheets[t].ownerNode===e)return document.styleSheets[t]}(t);try{n.insertRule(e,n.cssRules.length)}catch(e){}}else t.appendChild(document.createTextNode(e));this.ctr++},t.flush=function(){this.tags.forEach((function(e){return e.parentNode&&e.parentNode.removeChild(e)})),this.tags=[],this.ctr=0},e}(),o=Math.abs,i=String.fromCharCode,a=Object.assign;function s(e){return e.trim()}function l(e,t,n){return e.replace(t,n)}function c(e,t){return e.indexOf(t)}function u(e,t){return 0|e.charCodeAt(t)}function d(e,t,n){return e.slice(t,n)}function p(e){return e.length}function f(e){return e.length}function h(e,t){return t.push(e),e}var m=1,g=1,b=0,y=0,v=0,x="";function w(e,t,n,r,o,i,a){return{value:e,root:t,parent:n,type:r,props:o,children:i,line:m,column:g,length:a,return:""}}function k(e,t){return a(w("",null,null,"",null,null,0),e,{length:-e.length},t)}function S(){return v=y>0?u(x,--y):0,g--,10===v&&(g=1,m--),v}function Z(){return v=y<b?u(x,y++):0,g++,10===v&&(g=1,m++),v}function O(){return u(x,y)}function C(){return y}function j(e,t){return d(x,e,t)}function E(e){switch(e){case 0:case 9:case 10:case 13:case 32:return 5;case 33:case 43:case 44:case 47:case 62:case 64:case 126:case 59:case 123:case 125:return 4;case 58:return 3;case 34:case 39:case 40:case 91:return 2;case 41:case 93:return 1}return 0}function R(e){return m=g=1,b=p(x=e),y=0,[]}function P(e){return x="",e}function M(e){return s(j(y-1,A(91===e?e+2:40===e?e+1:e)))}function T(e){for(;(v=O())&&v<33;)Z();return E(e)>2||E(v)>3?"":" "}function N(e,t){for(;--t&&Z()&&!(v<48||v>102||v>57&&v<65||v>70&&v<97););return j(e,C()+(t<6&&32==O()&&32==Z()))}function A(e){for(;Z();)switch(v){case e:return y;case 34:case 39:34!==e&&39!==e&&A(v);break;case 40:41===e&&A(e);break;case 92:Z()}return y}function D(e,t){for(;Z()&&e+v!==57&&(e+v!==84||47!==O()););return"/*"+j(t,y-1)+"*"+i(47===e?e:Z())}function $(e){for(;!E(O());)Z();return j(e,y)}var L="-ms-",I="-moz-",z="-webkit-",_="comm",B="rule",F="decl",W="@keyframes";function V(e,t){for(var n="",r=f(e),o=0;o<r;o++)n+=t(e[o],o,e,t)||"";return n}function K(e,t,n,r){switch(e.type){case"@layer":if(e.children.length)break;case"@import":case F:return e.return=e.return||e.value;case _:return"";case W:return e.return=e.value+"{"+V(e.children,r)+"}";case B:e.value=e.props.join(",")}return p(n=V(e.children,r))?e.return=e.value+"{"+n+"}":""}function U(e){return P(H("",null,null,null,[""],e=R(e),0,[0],e))}function H(e,t,n,r,o,a,s,d,f){for(var m=0,g=0,b=s,y=0,v=0,x=0,w=1,k=1,j=1,E=0,R="",P=o,A=a,L=r,I=R;k;)switch(x=E,E=Z()){case 40:if(108!=x&&58==u(I,b-1)){-1!=c(I+=l(M(E),"&","&\f"),"&\f")&&(j=-1);break}case 34:case 39:case 91:I+=M(E);break;case 9:case 10:case 13:case 32:I+=T(x);break;case 92:I+=N(C()-1,7);continue;case 47:switch(O()){case 42:case 47:h(G(D(Z(),C()),t,n),f);break;default:I+="/"}break;case 123*w:d[m++]=p(I)*j;case 125*w:case 59:case 0:switch(E){case 0:case 125:k=0;case 59+g:-1==j&&(I=l(I,/\f/g,"")),v>0&&p(I)-b&&h(v>32?Y(I+";",r,n,b-1):Y(l(I," ","")+";",r,n,b-2),f);break;case 59:I+=";";default:if(h(L=q(I,t,n,m,g,o,d,R,P=[],A=[],b),a),123===E)if(0===g)H(I,t,L,L,P,a,b,d,A);else switch(99===y&&110===u(I,3)?100:y){case 100:case 108:case 109:case 115:H(e,L,L,r&&h(q(e,L,L,0,0,o,d,R,o,P=[],b),A),o,A,b,d,r?P:A);break;default:H(I,L,L,L,[""],A,0,d,A)}}m=g=v=0,w=j=1,R=I="",b=s;break;case 58:b=1+p(I),v=x;default:if(w<1)if(123==E)--w;else if(125==E&&0==w++&&125==S())continue;switch(I+=i(E),E*w){case 38:j=g>0?1:(I+="\f",-1);break;case 44:d[m++]=(p(I)-1)*j,j=1;break;case 64:45===O()&&(I+=M(Z())),y=O(),g=b=p(R=I+=$(C())),E++;break;case 45:45===x&&2==p(I)&&(w=0)}}return a}function q(e,t,n,r,i,a,c,u,p,h,m){for(var g=i-1,b=0===i?a:[""],y=f(b),v=0,x=0,k=0;v<r;++v)for(var S=0,Z=d(e,g+1,g=o(x=c[v])),O=e;S<y;++S)(O=s(x>0?b[S]+" "+Z:l(Z,/&\f/g,b[S])))&&(p[k++]=O);return w(e,t,n,0===i?B:u,p,h,m)}function G(e,t,n){return w(e,t,n,_,i(v),d(e,2,-2),0)}function Y(e,t,n,r){return w(e,t,n,F,d(e,0,r),d(e,r+1,-1),r)}var X=function(e,t,n){for(var r=0,o=0;r=o,o=O(),38===r&&12===o&&(t[n]=1),!E(o);)Z();return j(e,y)},J=new WeakMap,Q=function(e){if("rule"===e.type&&e.parent&&!(e.length<1)){for(var t=e.value,n=e.parent,r=e.column===n.column&&e.line===n.line;"rule"!==n.type;)if(!(n=n.parent))return;if((1!==e.props.length||58===t.charCodeAt(0)||J.get(n))&&!r){J.set(e,!0);for(var o=[],a=function(e,t){return P(function(e,t){var n=-1,r=44;do{switch(E(r)){case 0:38===r&&12===O()&&(t[n]=1),e[n]+=X(y-1,t,n);break;case 2:e[n]+=M(r);break;case 4:if(44===r){e[++n]=58===O()?"&\f":"",t[n]=e[n].length;break}default:e[n]+=i(r)}}while(r=Z());return e}(R(e),t))}(t,o),s=n.props,l=0,c=0;l<a.length;l++)for(var u=0;u<s.length;u++,c++)e.props[c]=o[l]?a[l].replace(/&\f/g,s[u]):s[u]+" "+a[l]}}},ee=function(e){if("decl"===e.type){var t=e.value;108===t.charCodeAt(0)&&98===t.charCodeAt(2)&&(e.return="",e.value="")}};function te(e,t){switch(function(e,t){return 45^u(e,0)?(((t<<2^u(e,0))<<2^u(e,1))<<2^u(e,2))<<2^u(e,3):0}(e,t)){case 5103:return z+"print-"+e+e;case 5737:case 4201:case 3177:case 3433:case 1641:case 4457:case 2921:case 5572:case 6356:case 5844:case 3191:case 6645:case 3005:case 6391:case 5879:case 5623:case 6135:case 4599:case 4855:case 4215:case 6389:case 5109:case 5365:case 5621:case 3829:return z+e+e;case 5349:case 4246:case 4810:case 6968:case 2756:return z+e+I+e+L+e+e;case 6828:case 4268:return z+e+L+e+e;case 6165:return z+e+L+"flex-"+e+e;case 5187:return z+e+l(e,/(\w+).+(:[^]+)/,z+"box-$1$2"+L+"flex-$1$2")+e;case 5443:return z+e+L+"flex-item-"+l(e,/flex-|-self/,"")+e;case 4675:return z+e+L+"flex-line-pack"+l(e,/align-content|flex-|-self/,"")+e;case 5548:return z+e+L+l(e,"shrink","negative")+e;case 5292:return z+e+L+l(e,"basis","preferred-size")+e;case 6060:return z+"box-"+l(e,"-grow","")+z+e+L+l(e,"grow","positive")+e;case 4554:return z+l(e,/([^-])(transform)/g,"$1"+z+"$2")+e;case 6187:return l(l(l(e,/(zoom-|grab)/,z+"$1"),/(image-set)/,z+"$1"),e,"")+e;case 5495:case 3959:return l(e,/(image-set\([^]*)/,z+"$1$`$1");case 4968:return l(l(e,/(.+:)(flex-)?(.*)/,z+"box-pack:$3"+L+"flex-pack:$3"),/s.+-b[^;]+/,"justify")+z+e+e;case 4095:case 3583:case 4068:case 2532:return l(e,/(.+)-inline(.+)/,z+"$1$2")+e;case 8116:case 7059:case 5753:case 5535:case 5445:case 5701:case 4933:case 4677:case 5533:case 5789:case 5021:case 4765:if(p(e)-1-t>6)switch(u(e,t+1)){case 109:if(45!==u(e,t+4))break;case 102:return l(e,/(.+:)(.+)-([^]+)/,"$1"+z+"$2-$3$1"+I+(108==u(e,t+3)?"$3":"$2-$3"))+e;case 115:return~c(e,"stretch")?te(l(e,"stretch","fill-available"),t)+e:e}break;case 4949:if(115!==u(e,t+1))break;case 6444:switch(u(e,p(e)-3-(~c(e,"!important")&&10))){case 107:return l(e,":",":"+z)+e;case 101:return l(e,/(.+:)([^;!]+)(;|!.+)?/,"$1"+z+(45===u(e,14)?"inline-":"")+"box$3$1"+z+"$2$3$1"+L+"$2box$3")+e}break;case 5936:switch(u(e,t+11)){case 114:return z+e+L+l(e,/[svh]\w+-[tblr]{2}/,"tb")+e;case 108:return z+e+L+l(e,/[svh]\w+-[tblr]{2}/,"tb-rl")+e;case 45:return z+e+L+l(e,/[svh]\w+-[tblr]{2}/,"lr")+e}return z+e+L+e+e}return e}var ne=[function(e,t,n,r){if(e.length>-1&&!e.return)switch(e.type){case F:e.return=te(e.value,e.length);break;case W:return V([k(e,{value:l(e.value,"@","@"+z)})],r);case B:if(e.length)return function(e,t){return e.map(t).join("")}(e.props,(function(t){switch(function(e,t){return(e=/(::plac\w+|:read-\w+)/.exec(e))?e[0]:e}(t)){case":read-only":case":read-write":return V([k(e,{props:[l(t,/:(read-\w+)/,":-moz-$1")]})],r);case"::placeholder":return V([k(e,{props:[l(t,/:(plac\w+)/,":"+z+"input-$1")]}),k(e,{props:[l(t,/:(plac\w+)/,":-moz-$1")]}),k(e,{props:[l(t,/:(plac\w+)/,L+"input-$1")]})],r)}return""}))}}],re=function(e){var t=e.key;if("css"===t){var n=document.querySelectorAll("style[data-emotion]:not([data-s])");Array.prototype.forEach.call(n,(function(e){-1!==e.getAttribute("data-emotion").indexOf(" ")&&(document.head.appendChild(e),e.setAttribute("data-s",""))}))}var o,i,a=e.stylisPlugins||ne,s={},l=[];o=e.container||document.head,Array.prototype.forEach.call(document.querySelectorAll('style[data-emotion^="'+t+' "]'),(function(e){for(var t=e.getAttribute("data-emotion").split(" "),n=1;n<t.length;n++)s[t[n]]=!0;l.push(e)}));var c,u,d,p,h=[K,(p=function(e){c.insert(e)},function(e){e.root||(e=e.return)&&p(e)})],m=(u=[Q,ee].concat(a,h),d=f(u),function(e,t,n,r){for(var o="",i=0;i<d;i++)o+=u[i](e,t,n,r)||"";return o});i=function(e,t,n,r){c=n,V(U(e?e+"{"+t.styles+"}":t.styles),m),r&&(g.inserted[t.name]=!0)};var g={key:t,sheet:new r({key:t,container:o,nonce:e.nonce,speedy:e.speedy,prepend:e.prepend,insertionPoint:e.insertionPoint}),nonce:e.nonce,inserted:s,registered:{},insert:i};return g.sheet.hydrate(l),g}},6894:(e,t,n)=>{function r(e){var t=Object.create(null);return function(n){return void 0===t[n]&&(t[n]=e(n)),t[n]}}n.d(t,{Z:()=>r})},9396:(e,t,n)=>{n.d(t,{T:()=>s,w:()=>a});var r=n(810),o=n(9721),i=(n(1245),n(2668),r.createContext("undefined"!=typeof HTMLElement?(0,o.Z)({key:"css"}):null));i.Provider;var a=function(e){return(0,r.forwardRef)((function(t,n){var o=(0,r.useContext)(i);return e(t,o,n)}))},s=r.createContext({})},1245:(e,t,n)=>{n.d(t,{O:()=>h});var r={animationIterationCount:1,aspectRatio:1,borderImageOutset:1,borderImageSlice:1,borderImageWidth:1,boxFlex:1,boxFlexGroup:1,boxOrdinalGroup:1,columnCount:1,columns:1,flex:1,flexGrow:1,flexPositive:1,flexShrink:1,flexNegative:1,flexOrder:1,gridRow:1,gridRowEnd:1,gridRowSpan:1,gridRowStart:1,gridColumn:1,gridColumnEnd:1,gridColumnSpan:1,gridColumnStart:1,msGridRow:1,msGridRowSpan:1,msGridColumn:1,msGridColumnSpan:1,fontWeight:1,lineHeight:1,opacity:1,order:1,orphans:1,tabSize:1,widows:1,zIndex:1,zoom:1,WebkitLineClamp:1,fillOpacity:1,floodOpacity:1,stopOpacity:1,strokeDasharray:1,strokeDashoffset:1,strokeMiterlimit:1,strokeOpacity:1,strokeWidth:1},o=n(6894),i=/[A-Z]|^ms/g,a=/_EMO_([^_]+?)_([^]*?)_EMO_/g,s=function(e){return 45===e.charCodeAt(1)},l=function(e){return null!=e&&"boolean"!=typeof e},c=(0,o.Z)((function(e){return s(e)?e:e.replace(i,"-$&").toLowerCase()})),u=function(e,t){switch(e){case"animation":case"animationName":if("string"==typeof t)return t.replace(a,(function(e,t,n){return p={name:t,styles:n,next:p},t}))}return 1===r[e]||s(e)||"number"!=typeof t||0===t?t:t+"px"};function d(e,t,n){if(null==n)return"";if(void 0!==n.__emotion_styles)return n;switch(typeof n){case"boolean":return"";case"object":if(1===n.anim)return p={name:n.name,styles:n.styles,next:p},n.name;if(void 0!==n.styles){var r=n.next;if(void 0!==r)for(;void 0!==r;)p={name:r.name,styles:r.styles,next:p},r=r.next;return n.styles+";"}return function(e,t,n){var r="";if(Array.isArray(n))for(var o=0;o<n.length;o++)r+=d(e,t,n[o])+";";else for(var i in n){var a=n[i];if("object"!=typeof a)null!=t&&void 0!==t[a]?r+=i+"{"+t[a]+"}":l(a)&&(r+=c(i)+":"+u(i,a)+";");else if(!Array.isArray(a)||"string"!=typeof a[0]||null!=t&&void 0!==t[a[0]]){var s=d(e,t,a);switch(i){case"animation":case"animationName":r+=c(i)+":"+s+";";break;default:r+=i+"{"+s+"}"}}else for(var p=0;p<a.length;p++)l(a[p])&&(r+=c(i)+":"+u(i,a[p])+";")}return r}(e,t,n);case"function":if(void 0!==e){var o=p,i=n(e);return p=o,d(e,t,i)}}if(null==t)return n;var a=t[n];return void 0!==a?a:n}var p,f=/label:\s*([^\s;\n{]+)\s*(;|$)/g,h=function(e,t,n){if(1===e.length&&"object"==typeof e[0]&&null!==e[0]&&void 0!==e[0].styles)return e[0];var r=!0,o="";p=void 0;var i=e[0];null==i||void 0===i.raw?(r=!1,o+=d(n,t,i)):o+=i[0];for(var a=1;a<e.length;a++)o+=d(n,t,e[a]),r&&(o+=i[a]);f.lastIndex=0;for(var s,l="";null!==(s=f.exec(o));)l+="-"+s[1];var c=function(e){for(var t,n=0,r=0,o=e.length;o>=4;++r,o-=4)t=1540483477*(65535&(t=255&e.charCodeAt(r)|(255&e.charCodeAt(++r))<<8|(255&e.charCodeAt(++r))<<16|(255&e.charCodeAt(++r))<<24))+(59797*(t>>>16)<<16),n=1540483477*(65535&(t^=t>>>24))+(59797*(t>>>16)<<16)^1540483477*(65535&n)+(59797*(n>>>16)<<16);switch(o){case 3:n^=(255&e.charCodeAt(r+2))<<16;case 2:n^=(255&e.charCodeAt(r+1))<<8;case 1:n=1540483477*(65535&(n^=255&e.charCodeAt(r)))+(59797*(n>>>16)<<16)}return(((n=1540483477*(65535&(n^=n>>>13))+(59797*(n>>>16)<<16))^n>>>15)>>>0).toString(36)}(o)+l;return{name:c,styles:o,next:p}}},2668:(e,t,n)=>{n.d(t,{L:()=>i});var r=n(810),o=!!r.useInsertionEffect&&r.useInsertionEffect,i=o||function(e){return e()};o||r.useLayoutEffect},3655:(e,t,n)=>{var r=n(1600);t.Z=void 0;var o=r(n(8671)),i=n(2322),a=(0,o.default)((0,i.jsx)("path",{d:"M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"}),"ExpandMore");t.Z=a},8671:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),Object.defineProperty(t,"default",{enumerable:!0,get:function(){return r.createSvgIcon}});var r=n(8757)},4380:(e,t,n)=>{n.d(t,{Z:()=>y});var r=n(7896),o=n(1461),i=n(810),a=n(8523),s=n(9075),l=n(7342),c=n(3995),u=n(7764),d=n(9222),p=n(5672);function f(e){return(0,p.Z)("MuiSvgIcon",e)}(0,d.Z)("MuiSvgIcon",["root","colorPrimary","colorSecondary","colorAction","colorError","colorDisabled","fontSizeInherit","fontSizeSmall","fontSizeMedium","fontSizeLarge"]);var h=n(2322);const m=["children","className","color","component","fontSize","htmlColor","inheritViewBox","titleAccess","viewBox"],g=(0,u.ZP)("svg",{name:"MuiSvgIcon",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.root,"inherit"!==n.color&&t[`color${(0,l.Z)(n.color)}`],t[`fontSize${(0,l.Z)(n.fontSize)}`]]}})((({theme:e,ownerState:t})=>{var n,r,o,i,a,s,l,c,u,d,p,f,h,m,g,b,y;return{userSelect:"none",width:"1em",height:"1em",display:"inline-block",fill:"currentColor",flexShrink:0,transition:null==(n=e.transitions)||null==(r=n.create)?void 0:r.call(n,"fill",{duration:null==(o=e.transitions)||null==(i=o.duration)?void 0:i.shorter}),fontSize:{inherit:"inherit",small:(null==(a=e.typography)||null==(s=a.pxToRem)?void 0:s.call(a,20))||"1.25rem",medium:(null==(l=e.typography)||null==(c=l.pxToRem)?void 0:c.call(l,24))||"1.5rem",large:(null==(u=e.typography)||null==(d=u.pxToRem)?void 0:d.call(u,35))||"2.1875rem"}[t.fontSize],color:null!=(p=null==(f=(e.vars||e).palette)||null==(h=f[t.color])?void 0:h.main)?p:{action:null==(m=(e.vars||e).palette)||null==(g=m.action)?void 0:g.active,disabled:null==(b=(e.vars||e).palette)||null==(y=b.action)?void 0:y.disabled,inherit:void 0}[t.color]}})),b=i.forwardRef((function(e,t){const n=(0,c.Z)({props:e,name:"MuiSvgIcon"}),{children:i,className:u,color:d="inherit",component:p="svg",fontSize:b="medium",htmlColor:y,inheritViewBox:v=!1,titleAccess:x,viewBox:w="0 0 24 24"}=n,k=(0,o.Z)(n,m),S=(0,r.Z)({},n,{color:d,component:p,fontSize:b,instanceFontSize:e.fontSize,inheritViewBox:v,viewBox:w}),Z={};v||(Z.viewBox=w);const O=(e=>{const{color:t,fontSize:n,classes:r}=e,o={root:["root","inherit"!==t&&`color${(0,l.Z)(t)}`,`fontSize${(0,l.Z)(n)}`]};return(0,s.Z)(o,f,r)})(S);return(0,h.jsxs)(g,(0,r.Z)({as:p,className:(0,a.Z)(O.root,u),focusable:"false",color:y,"aria-hidden":!x||void 0,role:x?"img":void 0,ref:t},Z,k,{ownerState:S,children:[i,x?(0,h.jsx)("title",{children:x}):null]}))}));b.muiName="SvgIcon";const y=b},8523:(e,t,n)=>{function r(e){var t,n,o="";if("string"==typeof e||"number"==typeof e)o+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(n=r(e[t]))&&(o&&(o+=" "),o+=n);else for(t in e)e[t]&&(o&&(o+=" "),o+=t);return o}n.d(t,{Z:()=>o});const o=function(){for(var e,t,n=0,o="";n<arguments.length;)(e=arguments[n++])&&(t=r(e))&&(o&&(o+=" "),o+=t);return o}},4707:(e,t,n)=>{n.d(t,{Z:()=>L});var r=n(7896),o=n(1461),i=n(1512),a=n(8970),s=n(9411),l=n(9795),c=n(7450),u=n(7591);const d={black:"#000",white:"#fff"},p={50:"#fafafa",100:"#f5f5f5",200:"#eeeeee",300:"#e0e0e0",400:"#bdbdbd",500:"#9e9e9e",600:"#757575",700:"#616161",800:"#424242",900:"#212121",A100:"#f5f5f5",A200:"#eeeeee",A400:"#bdbdbd",A700:"#616161"},f={50:"#f3e5f5",100:"#e1bee7",200:"#ce93d8",300:"#ba68c8",400:"#ab47bc",500:"#9c27b0",600:"#8e24aa",700:"#7b1fa2",800:"#6a1b9a",900:"#4a148c",A100:"#ea80fc",A200:"#e040fb",A400:"#d500f9",A700:"#aa00ff"},h={50:"#ffebee",100:"#ffcdd2",200:"#ef9a9a",300:"#e57373",400:"#ef5350",500:"#f44336",600:"#e53935",700:"#d32f2f",800:"#c62828",900:"#b71c1c",A100:"#ff8a80",A200:"#ff5252",A400:"#ff1744",A700:"#d50000"},m={50:"#fff3e0",100:"#ffe0b2",200:"#ffcc80",300:"#ffb74d",400:"#ffa726",500:"#ff9800",600:"#fb8c00",700:"#f57c00",800:"#ef6c00",900:"#e65100",A100:"#ffd180",A200:"#ffab40",A400:"#ff9100",A700:"#ff6d00"},g={50:"#e3f2fd",100:"#bbdefb",200:"#90caf9",300:"#64b5f6",400:"#42a5f5",500:"#2196f3",600:"#1e88e5",700:"#1976d2",800:"#1565c0",900:"#0d47a1",A100:"#82b1ff",A200:"#448aff",A400:"#2979ff",A700:"#2962ff"},b={50:"#e1f5fe",100:"#b3e5fc",200:"#81d4fa",300:"#4fc3f7",400:"#29b6f6",500:"#03a9f4",600:"#039be5",700:"#0288d1",800:"#0277bd",900:"#01579b",A100:"#80d8ff",A200:"#40c4ff",A400:"#00b0ff",A700:"#0091ea"},y={50:"#e8f5e9",100:"#c8e6c9",200:"#a5d6a7",300:"#81c784",400:"#66bb6a",500:"#4caf50",600:"#43a047",700:"#388e3c",800:"#2e7d32",900:"#1b5e20",A100:"#b9f6ca",A200:"#69f0ae",A400:"#00e676",A700:"#00c853"},v=["mode","contrastThreshold","tonalOffset"],x={text:{primary:"rgba(0, 0, 0, 0.87)",secondary:"rgba(0, 0, 0, 0.6)",disabled:"rgba(0, 0, 0, 0.38)"},divider:"rgba(0, 0, 0, 0.12)",background:{paper:d.white,default:d.white},action:{active:"rgba(0, 0, 0, 0.54)",hover:"rgba(0, 0, 0, 0.04)",hoverOpacity:.04,selected:"rgba(0, 0, 0, 0.08)",selectedOpacity:.08,disabled:"rgba(0, 0, 0, 0.26)",disabledBackground:"rgba(0, 0, 0, 0.12)",disabledOpacity:.38,focus:"rgba(0, 0, 0, 0.12)",focusOpacity:.12,activatedOpacity:.12}},w={text:{primary:d.white,secondary:"rgba(255, 255, 255, 0.7)",disabled:"rgba(255, 255, 255, 0.5)",icon:"rgba(255, 255, 255, 0.5)"},divider:"rgba(255, 255, 255, 0.12)",background:{paper:"#121212",default:"#121212"},action:{active:d.white,hover:"rgba(255, 255, 255, 0.08)",hoverOpacity:.08,selected:"rgba(255, 255, 255, 0.16)",selectedOpacity:.16,disabled:"rgba(255, 255, 255, 0.3)",disabledBackground:"rgba(255, 255, 255, 0.12)",disabledOpacity:.38,focus:"rgba(255, 255, 255, 0.12)",focusOpacity:.12,activatedOpacity:.24}};function k(e,t,n,r){const o=r.light||r,i=r.dark||1.5*r;e[t]||(e.hasOwnProperty(n)?e[t]=e[n]:"light"===t?e.light=(0,u.$n)(e.main,o):"dark"===t&&(e.dark=(0,u._j)(e.main,i)))}const S=["fontFamily","fontSize","fontWeightLight","fontWeightRegular","fontWeightMedium","fontWeightBold","htmlFontSize","allVariants","pxToRem"],Z={textTransform:"uppercase"},O='"Roboto", "Helvetica", "Arial", sans-serif';function C(e,t){const n="function"==typeof t?t(e):t,{fontFamily:i=O,fontSize:s=14,fontWeightLight:l=300,fontWeightRegular:c=400,fontWeightMedium:u=500,fontWeightBold:d=700,htmlFontSize:p=16,allVariants:f,pxToRem:h}=n,m=(0,o.Z)(n,S),g=s/14,b=h||(e=>e/p*g+"rem"),y=(e,t,n,o,a)=>{return(0,r.Z)({fontFamily:i,fontWeight:e,fontSize:b(t),lineHeight:n},i===O?{letterSpacing:(s=o/t,Math.round(1e5*s)/1e5+"em")}:{},a,f);var s},v={h1:y(l,96,1.167,-1.5),h2:y(l,60,1.2,-.5),h3:y(c,48,1.167,0),h4:y(c,34,1.235,.25),h5:y(c,24,1.334,0),h6:y(u,20,1.6,.15),subtitle1:y(c,16,1.75,.15),subtitle2:y(u,14,1.57,.1),body1:y(c,16,1.5,.15),body2:y(c,14,1.43,.15),button:y(u,14,1.75,.4,Z),caption:y(c,12,1.66,.4),overline:y(c,12,2.66,1,Z),inherit:{fontFamily:"inherit",fontWeight:"inherit",fontSize:"inherit",lineHeight:"inherit",letterSpacing:"inherit"}};return(0,a.Z)((0,r.Z)({htmlFontSize:p,pxToRem:b,fontFamily:i,fontSize:s,fontWeightLight:l,fontWeightRegular:c,fontWeightMedium:u,fontWeightBold:d},v),m,{clone:!1})}function j(...e){return[`${e[0]}px ${e[1]}px ${e[2]}px ${e[3]}px rgba(0,0,0,0.2)`,`${e[4]}px ${e[5]}px ${e[6]}px ${e[7]}px rgba(0,0,0,0.14)`,`${e[8]}px ${e[9]}px ${e[10]}px ${e[11]}px rgba(0,0,0,0.12)`].join(",")}const E=["none",j(0,2,1,-1,0,1,1,0,0,1,3,0),j(0,3,1,-2,0,2,2,0,0,1,5,0),j(0,3,3,-2,0,3,4,0,0,1,8,0),j(0,2,4,-1,0,4,5,0,0,1,10,0),j(0,3,5,-1,0,5,8,0,0,1,14,0),j(0,3,5,-1,0,6,10,0,0,1,18,0),j(0,4,5,-2,0,7,10,1,0,2,16,1),j(0,5,5,-3,0,8,10,1,0,3,14,2),j(0,5,6,-3,0,9,12,1,0,3,16,2),j(0,6,6,-3,0,10,14,1,0,4,18,3),j(0,6,7,-4,0,11,15,1,0,4,20,3),j(0,7,8,-4,0,12,17,2,0,5,22,4),j(0,7,8,-4,0,13,19,2,0,5,24,4),j(0,7,9,-4,0,14,21,2,0,5,26,4),j(0,8,9,-5,0,15,22,2,0,6,28,5),j(0,8,10,-5,0,16,24,2,0,6,30,5),j(0,8,11,-5,0,17,26,2,0,6,32,5),j(0,9,11,-5,0,18,28,2,0,7,34,6),j(0,9,12,-6,0,19,29,2,0,7,36,6),j(0,10,13,-6,0,20,31,3,0,8,38,7),j(0,10,13,-6,0,21,33,3,0,8,40,7),j(0,10,14,-6,0,22,35,3,0,8,42,7),j(0,11,14,-7,0,23,36,3,0,9,44,8),j(0,11,15,-7,0,24,38,3,0,9,46,8)],R=["duration","easing","delay"],P={easeInOut:"cubic-bezier(0.4, 0, 0.2, 1)",easeOut:"cubic-bezier(0.0, 0, 0.2, 1)",easeIn:"cubic-bezier(0.4, 0, 1, 1)",sharp:"cubic-bezier(0.4, 0, 0.6, 1)"},M={shortest:150,shorter:200,short:250,standard:300,complex:375,enteringScreen:225,leavingScreen:195};function T(e){return`${Math.round(e)}ms`}function N(e){if(!e)return 0;const t=e/36;return Math.round(10*(4+15*t**.25+t/5))}function A(e){const t=(0,r.Z)({},P,e.easing),n=(0,r.Z)({},M,e.duration);return(0,r.Z)({getAutoHeightDuration:N,create:(e=["all"],r={})=>{const{duration:i=n.standard,easing:a=t.easeInOut,delay:s=0}=r;return(0,o.Z)(r,R),(Array.isArray(e)?e:[e]).map((e=>`${e} ${"string"==typeof i?i:T(i)} ${a} ${"string"==typeof s?s:T(s)}`)).join(",")}},e,{easing:t,duration:n})}const D={mobileStepper:1e3,fab:1050,speedDial:1050,appBar:1100,drawer:1200,modal:1300,snackbar:1400,tooltip:1500},$=["breakpoints","mixins","spacing","palette","transitions","typography","shape"];const L=function(e={},...t){const{mixins:n={},palette:S={},transitions:Z={},typography:O={}}=e,j=(0,o.Z)(e,$);if(e.vars)throw new Error((0,i.Z)(18));const R=function(e){const{mode:t="light",contrastThreshold:n=3,tonalOffset:s=.2}=e,l=(0,o.Z)(e,v),c=e.primary||function(e="light"){return"dark"===e?{main:g[200],light:g[50],dark:g[400]}:{main:g[700],light:g[400],dark:g[800]}}(t),S=e.secondary||function(e="light"){return"dark"===e?{main:f[200],light:f[50],dark:f[400]}:{main:f[500],light:f[300],dark:f[700]}}(t),Z=e.error||function(e="light"){return"dark"===e?{main:h[500],light:h[300],dark:h[700]}:{main:h[700],light:h[400],dark:h[800]}}(t),O=e.info||function(e="light"){return"dark"===e?{main:b[400],light:b[300],dark:b[700]}:{main:b[700],light:b[500],dark:b[900]}}(t),C=e.success||function(e="light"){return"dark"===e?{main:y[400],light:y[300],dark:y[700]}:{main:y[800],light:y[500],dark:y[900]}}(t),j=e.warning||function(e="light"){return"dark"===e?{main:m[400],light:m[300],dark:m[700]}:{main:"#ed6c02",light:m[500],dark:m[900]}}(t);function E(e){return(0,u.mi)(e,w.text.primary)>=n?w.text.primary:x.text.primary}const R=({color:e,name:t,mainShade:n=500,lightShade:o=300,darkShade:a=700})=>{if(!(e=(0,r.Z)({},e)).main&&e[n]&&(e.main=e[n]),!e.hasOwnProperty("main"))throw new Error((0,i.Z)(11,t?` (${t})`:"",n));if("string"!=typeof e.main)throw new Error((0,i.Z)(12,t?` (${t})`:"",JSON.stringify(e.main)));return k(e,"light",o,s),k(e,"dark",a,s),e.contrastText||(e.contrastText=E(e.main)),e},P={dark:w,light:x};return(0,a.Z)((0,r.Z)({common:(0,r.Z)({},d),mode:t,primary:R({color:c,name:"primary"}),secondary:R({color:S,name:"secondary",mainShade:"A400",lightShade:"A200",darkShade:"A700"}),error:R({color:Z,name:"error"}),warning:R({color:j,name:"warning"}),info:R({color:O,name:"info"}),success:R({color:C,name:"success"}),grey:p,contrastThreshold:n,getContrastText:E,augmentColor:R,tonalOffset:s},P[t]),l)}(S),P=(0,s.Z)(e);let M=(0,a.Z)(P,{mixins:(T=P.breakpoints,N=n,(0,r.Z)({toolbar:{minHeight:56,[T.up("xs")]:{"@media (orientation: landscape)":{minHeight:48}},[T.up("sm")]:{minHeight:64}}},N)),palette:R,shadows:E.slice(),typography:C(R,O),transitions:A(Z),zIndex:(0,r.Z)({},D)});var T,N;return M=(0,a.Z)(M,j),M=t.reduce(((e,t)=>(0,a.Z)(e,t)),M),M.unstable_sxConfig=(0,r.Z)({},l.Z,null==j?void 0:j.unstable_sxConfig),M.unstable_sx=function(e){return(0,c.Z)({sx:e,theme:this})},M}},9957:(e,t,n)=>{n.d(t,{Z:()=>r});const r=(0,n(4707).Z)()},6912:(e,t,n)=>{n.d(t,{Z:()=>r});const r="$$material"},7764:(e,t,n)=>{n.d(t,{ZP:()=>x,FO:()=>y});var r=n(1461),o=n(7896),i=n(9752),a=n(9411),s=n(1290);const l=["variant"];function c(e){return 0===e.length}function u(e){const{variant:t}=e,n=(0,r.Z)(e,l);let o=t||"";return Object.keys(n).sort().forEach((t=>{o+="color"===t?c(o)?e[t]:(0,s.Z)(e[t]):`${c(o)?t:(0,s.Z)(t)}${(0,s.Z)(e[t].toString())}`})),o}var d=n(7450);const p=["name","slot","skipVariantsResolver","skipSx","overridesResolver"];function f(e){return"ownerState"!==e&&"theme"!==e&&"sx"!==e&&"as"!==e}const h=(0,a.Z)();function m({defaultTheme:e,theme:t,themeId:n}){return r=t,0===Object.keys(r).length?e:t[n]||t;var r}var g=n(9957),b=n(6912);const y=e=>f(e)&&"classes"!==e,v=function(e={}){const{themeId:t,defaultTheme:n=h,rootShouldForwardProp:a=f,slotShouldForwardProp:s=f}=e,l=e=>(0,d.Z)((0,o.Z)({},e,{theme:m((0,o.Z)({},e,{defaultTheme:n,themeId:t}))}));return l.__mui_systemSx=!0,(e,c={})=>{(0,i.Co)(e,(e=>e.filter((e=>!(null!=e&&e.__mui_systemSx)))));const{name:d,slot:h,skipVariantsResolver:g,skipSx:b,overridesResolver:y}=c,v=(0,r.Z)(c,p),x=void 0!==g?g:h&&"Root"!==h||!1,w=b||!1;let k=f;"Root"===h?k=a:h?k=s:function(e){return"string"==typeof e&&e.charCodeAt(0)>96}(e)&&(k=void 0);const S=(0,i.ZP)(e,(0,o.Z)({shouldForwardProp:k,label:void 0},v)),Z=(r,...i)=>{const a=i?i.map((e=>"function"==typeof e&&e.__emotion_real!==e?r=>e((0,o.Z)({},r,{theme:m((0,o.Z)({},r,{defaultTheme:n,themeId:t}))})):e)):[];let s=r;d&&y&&a.push((e=>{const r=m((0,o.Z)({},e,{defaultTheme:n,themeId:t})),i=((e,t)=>t.components&&t.components[e]&&t.components[e].styleOverrides?t.components[e].styleOverrides:null)(d,r);if(i){const t={};return Object.entries(i).forEach((([n,i])=>{t[n]="function"==typeof i?i((0,o.Z)({},e,{theme:r})):i})),y(e,t)}return null})),d&&!x&&a.push((e=>{const r=m((0,o.Z)({},e,{defaultTheme:n,themeId:t}));return((e,t,n,r)=>{var o,i;const{ownerState:a={}}=e,s=[],l=null==n||null==(o=n.components)||null==(i=o[r])?void 0:i.variants;return l&&l.forEach((n=>{let r=!0;Object.keys(n.props).forEach((t=>{a[t]!==n.props[t]&&e[t]!==n.props[t]&&(r=!1)})),r&&s.push(t[u(n.props)])})),s})(e,((e,t)=>{let n=[];t&&t.components&&t.components[e]&&t.components[e].variants&&(n=t.components[e].variants);const r={};return n.forEach((e=>{const t=u(e.props);r[t]=e.style})),r})(d,r),r,d)})),w||a.push(l);const c=a.length-i.length;if(Array.isArray(r)&&c>0){const e=new Array(c).fill("");s=[...r,...e],s.raw=[...r.raw,...e]}else"function"==typeof r&&r.__emotion_real!==r&&(s=e=>r((0,o.Z)({},e,{theme:m((0,o.Z)({},e,{defaultTheme:n,themeId:t}))})));const p=S(s,...a);return e.muiName&&(p.muiName=e.muiName),p};return S.withConfig&&(Z.withConfig=S.withConfig),Z}}({themeId:b.Z,defaultTheme:g.Z,rootShouldForwardProp:y}),x=v},3995:(e,t,n)=>{n.d(t,{Z:()=>s});var r=n(3022),o=n(7156);var i=n(9957),a=n(6912);function s({props:e,name:t}){return function({props:e,name:t,defaultTheme:n,themeId:i}){let a=(0,o.Z)(n);i&&(a=a[i]||a);const s=function(e){const{theme:t,name:n,props:o}=e;return t&&t.components&&t.components[n]&&t.components[n].defaultProps?(0,r.Z)(t.components[n].defaultProps,o):o}({theme:a,name:t,props:e});return s}({props:e,name:t,defaultTheme:i.Z,themeId:a.Z})}},7342:(e,t,n)=>{n.d(t,{Z:()=>r});const r=n(1290).Z},3869:(e,t,n)=>{n.d(t,{Z:()=>r});const r=function(e,t=166){let n;function r(...r){clearTimeout(n),n=setTimeout((()=>{e.apply(this,r)}),t)}return r.clear=()=>{clearTimeout(n)},r}},8757:(e,t,n)=>{n.r(t),n.d(t,{capitalize:()=>o.Z,createChainedFunction:()=>i,createSvgIcon:()=>u,debounce:()=>d.Z,deprecatedPropType:()=>p,isMuiElement:()=>f,ownerDocument:()=>h.Z,ownerWindow:()=>m.Z,requirePropFactory:()=>g,setRef:()=>b,unstable_ClassNameGenerator:()=>j,unstable_useEnhancedEffect:()=>y,unstable_useId:()=>w,unsupportedProp:()=>k,useControlled:()=>S,useEventCallback:()=>Z.Z,useForkRef:()=>O.Z,useIsFocusVisible:()=>C.Z});var r=n(8542),o=n(7342);const i=n(8419).Z;var a=n(7896),s=n(810),l=n(4380),c=n(2322);function u(e,t){function n(n,r){return(0,c.jsx)(l.Z,(0,a.Z)({"data-testid":`${t}Icon`,ref:r},n,{children:e}))}return n.muiName=l.Z.muiName,s.memo(s.forwardRef(n))}var d=n(3869);const p=function(e,t){return()=>null},f=function(e,t){return s.isValidElement(e)&&-1!==t.indexOf(e.type.muiName)};var h=n(6425),m=n(8043);const g=function(e,t){return()=>null},b=n(5377).Z,y=n(1399).Z;let v=0;const x=s.useId,w=function(e){if(void 0!==x){const t=x();return null!=e?e:t}return function(e){const[t,n]=s.useState(e),r=e||t;return s.useEffect((()=>{null==t&&(v+=1,n(`mui-${v}`))}),[t]),r}(e)},k=function(e,t,n,r,o){return null},S=function({controlled:e,default:t,name:n,state:r="value"}){const{current:o}=s.useRef(void 0!==e),[i,a]=s.useState(t);return[o?e:i,s.useCallback((e=>{o||a(e)}),[])]};var Z=n(8647),O=n(8659),C=n(8926);const j={configure:e=>{r.Z.configure(e)}}},6425:(e,t,n)=>{n.d(t,{Z:()=>r});const r=n(6855).Z},8043:(e,t,n)=>{n.d(t,{Z:()=>r});const r=n(7270).Z},8647:(e,t,n)=>{n.d(t,{Z:()=>r});const r=n(7817).Z},8659:(e,t,n)=>{n.d(t,{Z:()=>r});const r=n(4501).Z},8926:(e,t,n)=>{n.d(t,{Z:()=>d});var r=n(810);let o,i=!0,a=!1;const s={text:!0,search:!0,url:!0,tel:!0,email:!0,password:!0,number:!0,date:!0,month:!0,week:!0,time:!0,datetime:!0,"datetime-local":!0};function l(e){e.metaKey||e.altKey||e.ctrlKey||(i=!0)}function c(){i=!1}function u(){"hidden"===this.visibilityState&&a&&(i=!0)}const d=function(){const e=r.useCallback((e=>{var t;null!=e&&((t=e.ownerDocument).addEventListener("keydown",l,!0),t.addEventListener("mousedown",c,!0),t.addEventListener("pointerdown",c,!0),t.addEventListener("touchstart",c,!0),t.addEventListener("visibilitychange",u,!0))}),[]),t=r.useRef(!1);return{isFocusVisibleRef:t,onFocus:function(e){return!!function(e){const{target:t}=e;try{return t.matches(":focus-visible")}catch(e){}return i||function(e){const{type:t,tagName:n}=e;return!("INPUT"!==n||!s[t]||e.readOnly)||"TEXTAREA"===n&&!e.readOnly||!!e.isContentEditable}(t)}(e)&&(t.current=!0,!0)},onBlur:function(){return!!t.current&&(a=!0,window.clearTimeout(o),o=window.setTimeout((()=>{a=!1}),100),t.current=!1,!0)},ref:e}}},9752:(e,t,n)=>{n.d(t,{ZP:()=>y,Co:()=>v});var r=n(7896),o=n(810),i=n(6894),a=/^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/,s=(0,i.Z)((function(e){return a.test(e)||111===e.charCodeAt(0)&&110===e.charCodeAt(1)&&e.charCodeAt(2)<91})),l=n(9396),c=function(e,t,n){var r=e.key+"-"+t.name;!1===n&&void 0===e.registered[r]&&(e.registered[r]=t.styles)},u=n(1245),d=n(2668),p=s,f=function(e){return"theme"!==e},h=function(e){return"string"==typeof e&&e.charCodeAt(0)>96?p:f},m=function(e,t,n){var r;if(t){var o=t.shouldForwardProp;r=e.__emotion_forwardProp&&o?function(t){return e.__emotion_forwardProp(t)&&o(t)}:o}return"function"!=typeof r&&n&&(r=e.__emotion_forwardProp),r},g=function(e){var t=e.cache,n=e.serialized,r=e.isStringTag;return c(t,n,r),(0,d.L)((function(){return function(e,t,n){c(e,t,n);var r=e.key+"-"+t.name;if(void 0===e.inserted[t.name]){var o=t;do{e.insert(t===o?"."+r:"",o,e.sheet,!0),o=o.next}while(void 0!==o)}}(t,n,r)})),null},b=function e(t,n){var i,a,s=t.__emotion_real===t,c=s&&t.__emotion_base||t;void 0!==n&&(i=n.label,a=n.target);var d=m(t,n,s),p=d||h(c),f=!p("as");return function(){var b=arguments,y=s&&void 0!==t.__emotion_styles?t.__emotion_styles.slice(0):[];if(void 0!==i&&y.push("label:"+i+";"),null==b[0]||void 0===b[0].raw)y.push.apply(y,b);else{y.push(b[0][0]);for(var v=b.length,x=1;x<v;x++)y.push(b[x],b[0][x])}var w=(0,l.w)((function(e,t,n){var r,i,s,m,b=f&&e.as||c,v="",x=[],w=e;if(null==e.theme){for(var k in w={},e)w[k]=e[k];w.theme=o.useContext(l.T)}"string"==typeof e.className?(r=t.registered,i=x,s=e.className,m="",s.split(" ").forEach((function(e){void 0!==r[e]?i.push(r[e]+";"):m+=e+" "})),v=m):null!=e.className&&(v=e.className+" ");var S=(0,u.O)(y.concat(x),t.registered,w);v+=t.key+"-"+S.name,void 0!==a&&(v+=" "+a);var Z=f&&void 0===d?h(b):p,O={};for(var C in e)f&&"as"===C||Z(C)&&(O[C]=e[C]);return O.className=v,O.ref=n,o.createElement(o.Fragment,null,o.createElement(g,{cache:t,serialized:S,isStringTag:"string"==typeof b}),o.createElement(b,O))}));return w.displayName=void 0!==i?i:"Styled("+("string"==typeof c?c:c.displayName||c.name||"Component")+")",w.defaultProps=t.defaultProps,w.__emotion_real=w,w.__emotion_base=c,w.__emotion_styles=y,w.__emotion_forwardProp=d,Object.defineProperty(w,"toString",{value:function(){return"."+a}}),w.withComponent=function(t,o){return e(t,(0,r.Z)({},n,o,{shouldForwardProp:m(w,o,!0)})).apply(void 0,y)},w}}.bind();function y(e,t){return b(e,t)}["a","abbr","address","area","article","aside","audio","b","base","bdi","bdo","big","blockquote","body","br","button","canvas","caption","cite","code","col","colgroup","data","datalist","dd","del","details","dfn","dialog","div","dl","dt","em","embed","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","i","iframe","img","input","ins","kbd","keygen","label","legend","li","link","main","map","mark","marquee","menu","menuitem","meta","meter","nav","noscript","object","ol","optgroup","option","output","p","param","picture","pre","progress","q","rp","rt","ruby","s","samp","script","section","select","small","source","span","strong","style","sub","summary","sup","table","tbody","td","textarea","tfoot","th","thead","time","title","tr","track","u","ul","var","video","wbr","circle","clipPath","defs","ellipse","foreignObject","g","image","line","linearGradient","mask","path","pattern","polygon","polyline","radialGradient","rect","stop","svg","text","tspan"].forEach((function(e){b[e]=b(e)}));const v=(e,t)=>{Array.isArray(e.__emotion_styles)&&(e.__emotion_styles=t(e.__emotion_styles))}},9929:(e,t,n)=>{n.d(t,{L7:()=>s,VO:()=>r,W8:()=>a,k9:()=>i});const r={xs:0,sm:600,md:900,lg:1200,xl:1536},o={keys:["xs","sm","md","lg","xl"],up:e=>`@media (min-width:${r[e]}px)`};function i(e,t,n){const i=e.theme||{};if(Array.isArray(t)){const e=i.breakpoints||o;return t.reduce(((r,o,i)=>(r[e.up(e.keys[i])]=n(t[i]),r)),{})}if("object"==typeof t){const e=i.breakpoints||o;return Object.keys(t).reduce(((o,i)=>{if(-1!==Object.keys(e.values||r).indexOf(i))o[e.up(i)]=n(t[i],i);else{const e=i;o[e]=t[e]}return o}),{})}return n(t)}function a(e={}){var t;return(null==(t=e.keys)?void 0:t.reduce(((t,n)=>(t[e.up(n)]={},t)),{}))||{}}function s(e,t){return e.reduce(((e,t)=>{const n=e[t];return(!n||0===Object.keys(n).length)&&delete e[t],e}),t)}},7591:(e,t,n)=>{n.d(t,{$n:()=>d,Fq:()=>c,_j:()=>u,mi:()=>l});var r=n(1512);function o(e,t=0,n=1){return Math.min(Math.max(t,e),n)}function i(e){if(e.type)return e;if("#"===e.charAt(0))return i(function(e){e=e.slice(1);const t=new RegExp(`.{1,${e.length>=6?2:1}}`,"g");let n=e.match(t);return n&&1===n[0].length&&(n=n.map((e=>e+e))),n?`rgb${4===n.length?"a":""}(${n.map(((e,t)=>t<3?parseInt(e,16):Math.round(parseInt(e,16)/255*1e3)/1e3)).join(", ")})`:""}(e));const t=e.indexOf("("),n=e.substring(0,t);if(-1===["rgb","rgba","hsl","hsla","color"].indexOf(n))throw new Error((0,r.Z)(9,e));let o,a=e.substring(t+1,e.length-1);if("color"===n){if(a=a.split(" "),o=a.shift(),4===a.length&&"/"===a[3].charAt(0)&&(a[3]=a[3].slice(1)),-1===["srgb","display-p3","a98-rgb","prophoto-rgb","rec-2020"].indexOf(o))throw new Error((0,r.Z)(10,o))}else a=a.split(",");return a=a.map((e=>parseFloat(e))),{type:n,values:a,colorSpace:o}}function a(e){const{type:t,colorSpace:n}=e;let{values:r}=e;return-1!==t.indexOf("rgb")?r=r.map(((e,t)=>t<3?parseInt(e,10):e)):-1!==t.indexOf("hsl")&&(r[1]=`${r[1]}%`,r[2]=`${r[2]}%`),r=-1!==t.indexOf("color")?`${n} ${r.join(" ")}`:`${r.join(", ")}`,`${t}(${r})`}function s(e){let t="hsl"===(e=i(e)).type||"hsla"===e.type?i(function(e){e=i(e);const{values:t}=e,n=t[0],r=t[1]/100,o=t[2]/100,s=r*Math.min(o,1-o),l=(e,t=(e+n/30)%12)=>o-s*Math.max(Math.min(t-3,9-t,1),-1);let c="rgb";const u=[Math.round(255*l(0)),Math.round(255*l(8)),Math.round(255*l(4))];return"hsla"===e.type&&(c+="a",u.push(t[3])),a({type:c,values:u})}(e)).values:e.values;return t=t.map((t=>("color"!==e.type&&(t/=255),t<=.03928?t/12.92:((t+.055)/1.055)**2.4))),Number((.2126*t[0]+.7152*t[1]+.0722*t[2]).toFixed(3))}function l(e,t){const n=s(e),r=s(t);return(Math.max(n,r)+.05)/(Math.min(n,r)+.05)}function c(e,t){return e=i(e),t=o(t),"rgb"!==e.type&&"hsl"!==e.type||(e.type+="a"),"color"===e.type?e.values[3]=`/${t}`:e.values[3]=t,a(e)}function u(e,t){if(e=i(e),t=o(t),-1!==e.type.indexOf("hsl"))e.values[2]*=1-t;else if(-1!==e.type.indexOf("rgb")||-1!==e.type.indexOf("color"))for(let n=0;n<3;n+=1)e.values[n]*=1-t;return a(e)}function d(e,t){if(e=i(e),t=o(t),-1!==e.type.indexOf("hsl"))e.values[2]+=(100-e.values[2])*t;else if(-1!==e.type.indexOf("rgb"))for(let n=0;n<3;n+=1)e.values[n]+=(255-e.values[n])*t;else if(-1!==e.type.indexOf("color"))for(let n=0;n<3;n+=1)e.values[n]+=(1-e.values[n])*t;return a(e)}},9411:(e,t,n)=>{n.d(t,{Z:()=>p});var r=n(7896),o=n(1461),i=n(8970);const a=["values","unit","step"],s={borderRadius:4};var l=n(7649),c=n(7450),u=n(9795);const d=["breakpoints","palette","spacing","shape"],p=function(e={},...t){const{breakpoints:n={},palette:p={},spacing:f,shape:h={}}=e,m=(0,o.Z)(e,d),g=function(e){const{values:t={xs:0,sm:600,md:900,lg:1200,xl:1536},unit:n="px",step:i=5}=e,s=(0,o.Z)(e,a),l=(e=>{const t=Object.keys(e).map((t=>({key:t,val:e[t]})))||[];return t.sort(((e,t)=>e.val-t.val)),t.reduce(((e,t)=>(0,r.Z)({},e,{[t.key]:t.val})),{})})(t),c=Object.keys(l);function u(e){return`@media (min-width:${"number"==typeof t[e]?t[e]:e}${n})`}function d(e){return`@media (max-width:${("number"==typeof t[e]?t[e]:e)-i/100}${n})`}function p(e,r){const o=c.indexOf(r);return`@media (min-width:${"number"==typeof t[e]?t[e]:e}${n}) and (max-width:${(-1!==o&&"number"==typeof t[c[o]]?t[c[o]]:r)-i/100}${n})`}return(0,r.Z)({keys:c,values:l,up:u,down:d,between:p,only:function(e){return c.indexOf(e)+1<c.length?p(e,c[c.indexOf(e)+1]):u(e)},not:function(e){const t=c.indexOf(e);return 0===t?u(c[1]):t===c.length-1?d(c[t]):p(e,c[c.indexOf(e)+1]).replace("@media","@media not all and")},unit:n},s)}(n),b=function(e=8){if(e.mui)return e;const t=(0,l.hB)({spacing:e}),n=(...e)=>(0===e.length?[1]:e).map((e=>{const n=t(e);return"number"==typeof n?`${n}px`:n})).join(" ");return n.mui=!0,n}(f);let y=(0,i.Z)({breakpoints:g,direction:"ltr",components:{},palette:(0,r.Z)({mode:"light"},p),spacing:b,shape:(0,r.Z)({},s,h)},m);return y=t.reduce(((e,t)=>(0,i.Z)(e,t)),y),y.unstable_sxConfig=(0,r.Z)({},u.Z,null==m?void 0:m.unstable_sxConfig),y.unstable_sx=function(e){return(0,c.Z)({sx:e,theme:this})},y}},8329:(e,t,n)=>{n.d(t,{Z:()=>o});var r=n(8970);const o=function(e,t){return t?(0,r.Z)(e,t,{clone:!1}):e}},7649:(e,t,n)=>{n.d(t,{hB:()=>h,eI:()=>f,NA:()=>m,e6:()=>b,o3:()=>y});var r=n(9929),o=n(2818),i=n(8329);const a={m:"margin",p:"padding"},s={t:"Top",r:"Right",b:"Bottom",l:"Left",x:["Left","Right"],y:["Top","Bottom"]},l={marginX:"mx",marginY:"my",paddingX:"px",paddingY:"py"},c=function(e){const t={};return e=>(void 0===t[e]&&(t[e]=(e=>{if(e.length>2){if(!l[e])return[e];e=l[e]}const[t,n]=e.split(""),r=a[t],o=s[n]||"";return Array.isArray(o)?o.map((e=>r+e)):[r+o]})(e)),t[e])}(),u=["m","mt","mr","mb","ml","mx","my","margin","marginTop","marginRight","marginBottom","marginLeft","marginX","marginY","marginInline","marginInlineStart","marginInlineEnd","marginBlock","marginBlockStart","marginBlockEnd"],d=["p","pt","pr","pb","pl","px","py","padding","paddingTop","paddingRight","paddingBottom","paddingLeft","paddingX","paddingY","paddingInline","paddingInlineStart","paddingInlineEnd","paddingBlock","paddingBlockStart","paddingBlockEnd"],p=[...u,...d];function f(e,t,n,r){var i;const a=null!=(i=(0,o.DW)(e,t,!1))?i:n;return"number"==typeof a?e=>"string"==typeof e?e:a*e:Array.isArray(a)?e=>"string"==typeof e?e:a[e]:"function"==typeof a?a:()=>{}}function h(e){return f(e,"spacing",8)}function m(e,t){if("string"==typeof t||null==t)return t;const n=e(Math.abs(t));return t>=0?n:"number"==typeof n?-n:`-${n}`}function g(e,t){const n=h(e.theme);return Object.keys(e).map((o=>function(e,t,n,o){if(-1===t.indexOf(n))return null;const i=function(e,t){return n=>e.reduce(((e,r)=>(e[r]=m(t,n),e)),{})}(c(n),o),a=e[n];return(0,r.k9)(e,a,i)}(e,t,o,n))).reduce(i.Z,{})}function b(e){return g(e,u)}function y(e){return g(e,d)}function v(e){return g(e,p)}b.propTypes={},b.filterProps=u,y.propTypes={},y.filterProps=d,v.propTypes={},v.filterProps=p},2818:(e,t,n)=>{n.d(t,{DW:()=>i,Jq:()=>a,ZP:()=>s});var r=n(1290),o=n(9929);function i(e,t,n=!0){if(!t||"string"!=typeof t)return null;if(e&&e.vars&&n){const n=`vars.${t}`.split(".").reduce(((e,t)=>e&&e[t]?e[t]:null),e);if(null!=n)return n}return t.split(".").reduce(((e,t)=>e&&null!=e[t]?e[t]:null),e)}function a(e,t,n,r=n){let o;return o="function"==typeof e?e(n):Array.isArray(e)?e[n]||r:i(e,n)||r,t&&(o=t(o,r,e)),o}const s=function(e){const{prop:t,cssProperty:n=e.prop,themeKey:s,transform:l}=e,c=e=>{if(null==e[t])return null;const c=e[t],u=i(e.theme,s)||{};return(0,o.k9)(e,c,(e=>{let o=a(u,l,e);return e===o&&"string"==typeof e&&(o=a(u,l,`${t}${"default"===e?"":(0,r.Z)(e)}`,e)),!1===n?o:{[n]:o}}))};return c.propTypes={},c.filterProps=[t],c}},9795:(e,t,n)=>{n.d(t,{Z:()=>M});var r=n(7649),o=n(2818),i=n(8329);const a=function(...e){const t=e.reduce(((e,t)=>(t.filterProps.forEach((n=>{e[n]=t})),e)),{}),n=e=>Object.keys(e).reduce(((n,r)=>t[r]?(0,i.Z)(n,t[r](e)):n),{});return n.propTypes={},n.filterProps=e.reduce(((e,t)=>e.concat(t.filterProps)),[]),n};var s=n(9929);function l(e){return"number"!=typeof e?e:`${e}px solid`}const c=(0,o.ZP)({prop:"border",themeKey:"borders",transform:l}),u=(0,o.ZP)({prop:"borderTop",themeKey:"borders",transform:l}),d=(0,o.ZP)({prop:"borderRight",themeKey:"borders",transform:l}),p=(0,o.ZP)({prop:"borderBottom",themeKey:"borders",transform:l}),f=(0,o.ZP)({prop:"borderLeft",themeKey:"borders",transform:l}),h=(0,o.ZP)({prop:"borderColor",themeKey:"palette"}),m=(0,o.ZP)({prop:"borderTopColor",themeKey:"palette"}),g=(0,o.ZP)({prop:"borderRightColor",themeKey:"palette"}),b=(0,o.ZP)({prop:"borderBottomColor",themeKey:"palette"}),y=(0,o.ZP)({prop:"borderLeftColor",themeKey:"palette"}),v=e=>{if(void 0!==e.borderRadius&&null!==e.borderRadius){const t=(0,r.eI)(e.theme,"shape.borderRadius",4,"borderRadius"),n=e=>({borderRadius:(0,r.NA)(t,e)});return(0,s.k9)(e,e.borderRadius,n)}return null};v.propTypes={},v.filterProps=["borderRadius"],a(c,u,d,p,f,h,m,g,b,y,v);const x=e=>{if(void 0!==e.gap&&null!==e.gap){const t=(0,r.eI)(e.theme,"spacing",8,"gap"),n=e=>({gap:(0,r.NA)(t,e)});return(0,s.k9)(e,e.gap,n)}return null};x.propTypes={},x.filterProps=["gap"];const w=e=>{if(void 0!==e.columnGap&&null!==e.columnGap){const t=(0,r.eI)(e.theme,"spacing",8,"columnGap"),n=e=>({columnGap:(0,r.NA)(t,e)});return(0,s.k9)(e,e.columnGap,n)}return null};w.propTypes={},w.filterProps=["columnGap"];const k=e=>{if(void 0!==e.rowGap&&null!==e.rowGap){const t=(0,r.eI)(e.theme,"spacing",8,"rowGap"),n=e=>({rowGap:(0,r.NA)(t,e)});return(0,s.k9)(e,e.rowGap,n)}return null};function S(e,t){return"grey"===t?t:e}function Z(e){return e<=1&&0!==e?100*e+"%":e}k.propTypes={},k.filterProps=["rowGap"],a(x,w,k,(0,o.ZP)({prop:"gridColumn"}),(0,o.ZP)({prop:"gridRow"}),(0,o.ZP)({prop:"gridAutoFlow"}),(0,o.ZP)({prop:"gridAutoColumns"}),(0,o.ZP)({prop:"gridAutoRows"}),(0,o.ZP)({prop:"gridTemplateColumns"}),(0,o.ZP)({prop:"gridTemplateRows"}),(0,o.ZP)({prop:"gridTemplateAreas"}),(0,o.ZP)({prop:"gridArea"})),a((0,o.ZP)({prop:"color",themeKey:"palette",transform:S}),(0,o.ZP)({prop:"bgcolor",cssProperty:"backgroundColor",themeKey:"palette",transform:S}),(0,o.ZP)({prop:"backgroundColor",themeKey:"palette",transform:S}));const O=(0,o.ZP)({prop:"width",transform:Z}),C=e=>{if(void 0!==e.maxWidth&&null!==e.maxWidth){const t=t=>{var n,r,o;return{maxWidth:(null==(n=e.theme)||null==(r=n.breakpoints)||null==(o=r.values)?void 0:o[t])||s.VO[t]||Z(t)}};return(0,s.k9)(e,e.maxWidth,t)}return null};C.filterProps=["maxWidth"];const j=(0,o.ZP)({prop:"minWidth",transform:Z}),E=(0,o.ZP)({prop:"height",transform:Z}),R=(0,o.ZP)({prop:"maxHeight",transform:Z}),P=(0,o.ZP)({prop:"minHeight",transform:Z}),M=((0,o.ZP)({prop:"size",cssProperty:"width",transform:Z}),(0,o.ZP)({prop:"size",cssProperty:"height",transform:Z}),a(O,C,j,E,R,P,(0,o.ZP)({prop:"boxSizing"})),{border:{themeKey:"borders",transform:l},borderTop:{themeKey:"borders",transform:l},borderRight:{themeKey:"borders",transform:l},borderBottom:{themeKey:"borders",transform:l},borderLeft:{themeKey:"borders",transform:l},borderColor:{themeKey:"palette"},borderTopColor:{themeKey:"palette"},borderRightColor:{themeKey:"palette"},borderBottomColor:{themeKey:"palette"},borderLeftColor:{themeKey:"palette"},borderRadius:{themeKey:"shape.borderRadius",style:v},color:{themeKey:"palette",transform:S},bgcolor:{themeKey:"palette",cssProperty:"backgroundColor",transform:S},backgroundColor:{themeKey:"palette",transform:S},p:{style:r.o3},pt:{style:r.o3},pr:{style:r.o3},pb:{style:r.o3},pl:{style:r.o3},px:{style:r.o3},py:{style:r.o3},padding:{style:r.o3},paddingTop:{style:r.o3},paddingRight:{style:r.o3},paddingBottom:{style:r.o3},paddingLeft:{style:r.o3},paddingX:{style:r.o3},paddingY:{style:r.o3},paddingInline:{style:r.o3},paddingInlineStart:{style:r.o3},paddingInlineEnd:{style:r.o3},paddingBlock:{style:r.o3},paddingBlockStart:{style:r.o3},paddingBlockEnd:{style:r.o3},m:{style:r.e6},mt:{style:r.e6},mr:{style:r.e6},mb:{style:r.e6},ml:{style:r.e6},mx:{style:r.e6},my:{style:r.e6},margin:{style:r.e6},marginTop:{style:r.e6},marginRight:{style:r.e6},marginBottom:{style:r.e6},marginLeft:{style:r.e6},marginX:{style:r.e6},marginY:{style:r.e6},marginInline:{style:r.e6},marginInlineStart:{style:r.e6},marginInlineEnd:{style:r.e6},marginBlock:{style:r.e6},marginBlockStart:{style:r.e6},marginBlockEnd:{style:r.e6},displayPrint:{cssProperty:!1,transform:e=>({"@media print":{display:e}})},display:{},overflow:{},textOverflow:{},visibility:{},whiteSpace:{},flexBasis:{},flexDirection:{},flexWrap:{},justifyContent:{},alignItems:{},alignContent:{},order:{},flex:{},flexGrow:{},flexShrink:{},alignSelf:{},justifyItems:{},justifySelf:{},gap:{style:x},rowGap:{style:k},columnGap:{style:w},gridColumn:{},gridRow:{},gridAutoFlow:{},gridAutoColumns:{},gridAutoRows:{},gridTemplateColumns:{},gridTemplateRows:{},gridTemplateAreas:{},gridArea:{},position:{},zIndex:{themeKey:"zIndex"},top:{},right:{},bottom:{},left:{},boxShadow:{themeKey:"shadows"},width:{transform:Z},maxWidth:{style:C},minWidth:{transform:Z},height:{transform:Z},maxHeight:{transform:Z},minHeight:{transform:Z},boxSizing:{},fontFamily:{themeKey:"typography"},fontSize:{themeKey:"typography"},fontStyle:{themeKey:"typography"},fontWeight:{themeKey:"typography"},letterSpacing:{},textTransform:{},lineHeight:{},textAlign:{},typography:{cssProperty:!1,themeKey:"typography"}})},7450:(e,t,n)=>{n.d(t,{Z:()=>c});var r=n(1290),o=n(8329),i=n(2818),a=n(9929),s=n(9795);const l=function(){function e(e,t,n,o){const s={[e]:t,theme:n},l=o[e];if(!l)return{[e]:t};const{cssProperty:c=e,themeKey:u,transform:d,style:p}=l;if(null==t)return null;if("typography"===u&&"inherit"===t)return{[e]:t};const f=(0,i.DW)(n,u)||{};return p?p(s):(0,a.k9)(s,t,(t=>{let n=(0,i.Jq)(f,d,t);return t===n&&"string"==typeof t&&(n=(0,i.Jq)(f,d,`${e}${"default"===t?"":(0,r.Z)(t)}`,t)),!1===c?n:{[c]:n}}))}return function t(n){var r;const{sx:i,theme:l={}}=n||{};if(!i)return null;const c=null!=(r=l.unstable_sxConfig)?r:s.Z;function u(n){let r=n;if("function"==typeof n)r=n(l);else if("object"!=typeof n)return n;if(!r)return null;const i=(0,a.W8)(l.breakpoints),s=Object.keys(i);let u=i;return Object.keys(r).forEach((n=>{const i="function"==typeof(s=r[n])?s(l):s;var s;if(null!=i)if("object"==typeof i)if(c[n])u=(0,o.Z)(u,e(n,i,l,c));else{const e=(0,a.k9)({theme:l},i,(e=>({[n]:e})));!function(...e){const t=e.reduce(((e,t)=>e.concat(Object.keys(t))),[]),n=new Set(t);return e.every((e=>n.size===Object.keys(e).length))}(e,i)?u=(0,o.Z)(u,e):u[n]=t({sx:i,theme:l})}else u=(0,o.Z)(u,e(n,i,l,c))})),(0,a.L7)(s,u)}return Array.isArray(i)?i.map(u):u(i)}}();l.filterProps=["sx"];const c=l},7156:(e,t,n)=>{n.d(t,{Z:()=>s});var r=n(9411),o=n(810),i=n(9396);const a=(0,r.Z)(),s=function(e=a){return function(e=null){const t=o.useContext(i.T);return t&&(n=t,0!==Object.keys(n).length)?t:e;var n}(e)}},8542:(e,t,n)=>{n.d(t,{Z:()=>o});const r=e=>e,o=(()=>{let e=r;return{configure(t){e=t},generate:t=>e(t),reset(){e=r}}})()},1290:(e,t,n)=>{n.d(t,{Z:()=>o});var r=n(1512);function o(e){if("string"!=typeof e)throw new Error((0,r.Z)(7));return e.charAt(0).toUpperCase()+e.slice(1)}},9075:(e,t,n)=>{function r(e,t,n=void 0){const r={};return Object.keys(e).forEach((o=>{r[o]=e[o].reduce(((e,r)=>{if(r){const o=t(r);""!==o&&e.push(o),n&&n[r]&&e.push(n[r])}return e}),[]).join(" ")})),r}n.d(t,{Z:()=>r})},8419:(e,t,n)=>{function r(...e){return e.reduce(((e,t)=>null==t?e:function(...n){e.apply(this,n),t.apply(this,n)}),(()=>{}))}n.d(t,{Z:()=>r})},8970:(e,t,n)=>{n.d(t,{P:()=>o,Z:()=>a});var r=n(7896);function o(e){return null!==e&&"object"==typeof e&&e.constructor===Object}function i(e){if(!o(e))return e;const t={};return Object.keys(e).forEach((n=>{t[n]=i(e[n])})),t}function a(e,t,n={clone:!0}){const s=n.clone?(0,r.Z)({},e):e;return o(e)&&o(t)&&Object.keys(t).forEach((r=>{"__proto__"!==r&&(o(t[r])&&r in e&&o(e[r])?s[r]=a(e[r],t[r],n):n.clone?s[r]=o(t[r])?i(t[r]):t[r]:s[r]=t[r])})),s}},1512:(e,t,n)=>{function r(e){let t="https://mui.com/production-error/?code="+e;for(let e=1;e<arguments.length;e+=1)t+="&args[]="+encodeURIComponent(arguments[e]);return"Minified MUI error #"+e+"; visit "+t+" for the full message."}n.d(t,{Z:()=>r})},5672:(e,t,n)=>{n.d(t,{Z:()=>i});var r=n(8542);const o={active:"active",checked:"checked",completed:"completed",disabled:"disabled",readOnly:"readOnly",error:"error",expanded:"expanded",focused:"focused",focusVisible:"focusVisible",required:"required",selected:"selected"};function i(e,t,n="Mui"){const i=o[t];return i?`${n}-${i}`:`${r.Z.generate(e)}-${t}`}},9222:(e,t,n)=>{n.d(t,{Z:()=>o});var r=n(5672);function o(e,t,n="Mui"){const o={};return t.forEach((t=>{o[t]=(0,r.Z)(e,t,n)})),o}},6855:(e,t,n)=>{function r(e){return e&&e.ownerDocument||document}n.d(t,{Z:()=>r})},7270:(e,t,n)=>{n.d(t,{Z:()=>o});var r=n(6855);function o(e){return(0,r.Z)(e).defaultView||window}},3022:(e,t,n)=>{n.d(t,{Z:()=>o});var r=n(7896);function o(e,t){const n=(0,r.Z)({},t);return Object.keys(e).forEach((i=>{if(i.toString().match(/^(components|slots)$/))n[i]=(0,r.Z)({},e[i],n[i]);else if(i.toString().match(/^(componentsProps|slotProps)$/)){const a=e[i]||{},s=t[i];n[i]={},s&&Object.keys(s)?a&&Object.keys(a)?(n[i]=(0,r.Z)({},s),Object.keys(a).forEach((e=>{n[i][e]=o(a[e],s[e])}))):n[i]=s:n[i]=a}else void 0===n[i]&&(n[i]=e[i])})),n}},5377:(e,t,n)=>{function r(e,t){"function"==typeof e?e(t):e&&(e.current=t)}n.d(t,{Z:()=>r})},1399:(e,t,n)=>{n.d(t,{Z:()=>o});var r=n(810);const o="undefined"!=typeof window?r.useLayoutEffect:r.useEffect},7817:(e,t,n)=>{n.d(t,{Z:()=>i});var r=n(810),o=n(1399);function i(e){const t=r.useRef(e);return(0,o.Z)((()=>{t.current=e})),r.useCallback(((...e)=>(0,t.current)(...e)),[])}},4501:(e,t,n)=>{n.d(t,{Z:()=>i});var r=n(810),o=n(5377);function i(...e){return r.useMemo((()=>e.every((e=>null==e))?null:t=>{e.forEach((e=>{(0,o.Z)(e,t)}))}),e)}},4959:(e,t,n)=>{const r=n(1103),o={};for(const e of Object.keys(r))o[r[e]]=e;const i={rgb:{channels:3,labels:"rgb"},hsl:{channels:3,labels:"hsl"},hsv:{channels:3,labels:"hsv"},hwb:{channels:3,labels:"hwb"},cmyk:{channels:4,labels:"cmyk"},xyz:{channels:3,labels:"xyz"},lab:{channels:3,labels:"lab"},lch:{channels:3,labels:"lch"},hex:{channels:1,labels:["hex"]},keyword:{channels:1,labels:["keyword"]},ansi16:{channels:1,labels:["ansi16"]},ansi256:{channels:1,labels:["ansi256"]},hcg:{channels:3,labels:["h","c","g"]},apple:{channels:3,labels:["r16","g16","b16"]},gray:{channels:1,labels:["gray"]}};e.exports=i;for(const e of Object.keys(i)){if(!("channels"in i[e]))throw new Error("missing channels property: "+e);if(!("labels"in i[e]))throw new Error("missing channel labels property: "+e);if(i[e].labels.length!==i[e].channels)throw new Error("channel and label counts mismatch: "+e);const{channels:t,labels:n}=i[e];delete i[e].channels,delete i[e].labels,Object.defineProperty(i[e],"channels",{value:t}),Object.defineProperty(i[e],"labels",{value:n})}i.rgb.hsl=function(e){const t=e[0]/255,n=e[1]/255,r=e[2]/255,o=Math.min(t,n,r),i=Math.max(t,n,r),a=i-o;let s,l;i===o?s=0:t===i?s=(n-r)/a:n===i?s=2+(r-t)/a:r===i&&(s=4+(t-n)/a),s=Math.min(60*s,360),s<0&&(s+=360);const c=(o+i)/2;return l=i===o?0:c<=.5?a/(i+o):a/(2-i-o),[s,100*l,100*c]},i.rgb.hsv=function(e){let t,n,r,o,i;const a=e[0]/255,s=e[1]/255,l=e[2]/255,c=Math.max(a,s,l),u=c-Math.min(a,s,l),d=function(e){return(c-e)/6/u+.5};return 0===u?(o=0,i=0):(i=u/c,t=d(a),n=d(s),r=d(l),a===c?o=r-n:s===c?o=1/3+t-r:l===c&&(o=2/3+n-t),o<0?o+=1:o>1&&(o-=1)),[360*o,100*i,100*c]},i.rgb.hwb=function(e){const t=e[0],n=e[1];let r=e[2];const o=i.rgb.hsl(e)[0],a=1/255*Math.min(t,Math.min(n,r));return r=1-1/255*Math.max(t,Math.max(n,r)),[o,100*a,100*r]},i.rgb.cmyk=function(e){const t=e[0]/255,n=e[1]/255,r=e[2]/255,o=Math.min(1-t,1-n,1-r);return[100*((1-t-o)/(1-o)||0),100*((1-n-o)/(1-o)||0),100*((1-r-o)/(1-o)||0),100*o]},i.rgb.keyword=function(e){const t=o[e];if(t)return t;let n,i=1/0;for(const t of Object.keys(r)){const o=(s=r[t],((a=e)[0]-s[0])**2+(a[1]-s[1])**2+(a[2]-s[2])**2);o<i&&(i=o,n=t)}var a,s;return n},i.keyword.rgb=function(e){return r[e]},i.rgb.xyz=function(e){let t=e[0]/255,n=e[1]/255,r=e[2]/255;return t=t>.04045?((t+.055)/1.055)**2.4:t/12.92,n=n>.04045?((n+.055)/1.055)**2.4:n/12.92,r=r>.04045?((r+.055)/1.055)**2.4:r/12.92,[100*(.4124*t+.3576*n+.1805*r),100*(.2126*t+.7152*n+.0722*r),100*(.0193*t+.1192*n+.9505*r)]},i.rgb.lab=function(e){const t=i.rgb.xyz(e);let n=t[0],r=t[1],o=t[2];return n/=95.047,r/=100,o/=108.883,n=n>.008856?n**(1/3):7.787*n+16/116,r=r>.008856?r**(1/3):7.787*r+16/116,o=o>.008856?o**(1/3):7.787*o+16/116,[116*r-16,500*(n-r),200*(r-o)]},i.hsl.rgb=function(e){const t=e[0]/360,n=e[1]/100,r=e[2]/100;let o,i,a;if(0===n)return a=255*r,[a,a,a];o=r<.5?r*(1+n):r+n-r*n;const s=2*r-o,l=[0,0,0];for(let e=0;e<3;e++)i=t+1/3*-(e-1),i<0&&i++,i>1&&i--,a=6*i<1?s+6*(o-s)*i:2*i<1?o:3*i<2?s+(o-s)*(2/3-i)*6:s,l[e]=255*a;return l},i.hsl.hsv=function(e){const t=e[0];let n=e[1]/100,r=e[2]/100,o=n;const i=Math.max(r,.01);return r*=2,n*=r<=1?r:2-r,o*=i<=1?i:2-i,[t,100*(0===r?2*o/(i+o):2*n/(r+n)),(r+n)/2*100]},i.hsv.rgb=function(e){const t=e[0]/60,n=e[1]/100;let r=e[2]/100;const o=Math.floor(t)%6,i=t-Math.floor(t),a=255*r*(1-n),s=255*r*(1-n*i),l=255*r*(1-n*(1-i));switch(r*=255,o){case 0:return[r,l,a];case 1:return[s,r,a];case 2:return[a,r,l];case 3:return[a,s,r];case 4:return[l,a,r];case 5:return[r,a,s]}},i.hsv.hsl=function(e){const t=e[0],n=e[1]/100,r=e[2]/100,o=Math.max(r,.01);let i,a;a=(2-n)*r;const s=(2-n)*o;return i=n*o,i/=s<=1?s:2-s,i=i||0,a/=2,[t,100*i,100*a]},i.hwb.rgb=function(e){const t=e[0]/360;let n=e[1]/100,r=e[2]/100;const o=n+r;let i;o>1&&(n/=o,r/=o);const a=Math.floor(6*t),s=1-r;i=6*t-a,0!=(1&a)&&(i=1-i);const l=n+i*(s-n);let c,u,d;switch(a){default:case 6:case 0:c=s,u=l,d=n;break;case 1:c=l,u=s,d=n;break;case 2:c=n,u=s,d=l;break;case 3:c=n,u=l,d=s;break;case 4:c=l,u=n,d=s;break;case 5:c=s,u=n,d=l}return[255*c,255*u,255*d]},i.cmyk.rgb=function(e){const t=e[0]/100,n=e[1]/100,r=e[2]/100,o=e[3]/100;return[255*(1-Math.min(1,t*(1-o)+o)),255*(1-Math.min(1,n*(1-o)+o)),255*(1-Math.min(1,r*(1-o)+o))]},i.xyz.rgb=function(e){const t=e[0]/100,n=e[1]/100,r=e[2]/100;let o,i,a;return o=3.2406*t+-1.5372*n+-.4986*r,i=-.9689*t+1.8758*n+.0415*r,a=.0557*t+-.204*n+1.057*r,o=o>.0031308?1.055*o**(1/2.4)-.055:12.92*o,i=i>.0031308?1.055*i**(1/2.4)-.055:12.92*i,a=a>.0031308?1.055*a**(1/2.4)-.055:12.92*a,o=Math.min(Math.max(0,o),1),i=Math.min(Math.max(0,i),1),a=Math.min(Math.max(0,a),1),[255*o,255*i,255*a]},i.xyz.lab=function(e){let t=e[0],n=e[1],r=e[2];return t/=95.047,n/=100,r/=108.883,t=t>.008856?t**(1/3):7.787*t+16/116,n=n>.008856?n**(1/3):7.787*n+16/116,r=r>.008856?r**(1/3):7.787*r+16/116,[116*n-16,500*(t-n),200*(n-r)]},i.lab.xyz=function(e){let t,n,r;n=(e[0]+16)/116,t=e[1]/500+n,r=n-e[2]/200;const o=n**3,i=t**3,a=r**3;return n=o>.008856?o:(n-16/116)/7.787,t=i>.008856?i:(t-16/116)/7.787,r=a>.008856?a:(r-16/116)/7.787,t*=95.047,n*=100,r*=108.883,[t,n,r]},i.lab.lch=function(e){const t=e[0],n=e[1],r=e[2];let o;return o=360*Math.atan2(r,n)/2/Math.PI,o<0&&(o+=360),[t,Math.sqrt(n*n+r*r),o]},i.lch.lab=function(e){const t=e[0],n=e[1],r=e[2]/360*2*Math.PI;return[t,n*Math.cos(r),n*Math.sin(r)]},i.rgb.ansi16=function(e,t=null){const[n,r,o]=e;let a=null===t?i.rgb.hsv(e)[2]:t;if(a=Math.round(a/50),0===a)return 30;let s=30+(Math.round(o/255)<<2|Math.round(r/255)<<1|Math.round(n/255));return 2===a&&(s+=60),s},i.hsv.ansi16=function(e){return i.rgb.ansi16(i.hsv.rgb(e),e[2])},i.rgb.ansi256=function(e){const t=e[0],n=e[1],r=e[2];return t===n&&n===r?t<8?16:t>248?231:Math.round((t-8)/247*24)+232:16+36*Math.round(t/255*5)+6*Math.round(n/255*5)+Math.round(r/255*5)},i.ansi16.rgb=function(e){let t=e%10;if(0===t||7===t)return e>50&&(t+=3.5),t=t/10.5*255,[t,t,t];const n=.5*(1+~~(e>50));return[(1&t)*n*255,(t>>1&1)*n*255,(t>>2&1)*n*255]},i.ansi256.rgb=function(e){if(e>=232){const t=10*(e-232)+8;return[t,t,t]}let t;return e-=16,[Math.floor(e/36)/5*255,Math.floor((t=e%36)/6)/5*255,t%6/5*255]},i.rgb.hex=function(e){const t=(((255&Math.round(e[0]))<<16)+((255&Math.round(e[1]))<<8)+(255&Math.round(e[2]))).toString(16).toUpperCase();return"000000".substring(t.length)+t},i.hex.rgb=function(e){const t=e.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i);if(!t)return[0,0,0];let n=t[0];3===t[0].length&&(n=n.split("").map((e=>e+e)).join(""));const r=parseInt(n,16);return[r>>16&255,r>>8&255,255&r]},i.rgb.hcg=function(e){const t=e[0]/255,n=e[1]/255,r=e[2]/255,o=Math.max(Math.max(t,n),r),i=Math.min(Math.min(t,n),r),a=o-i;let s,l;return s=a<1?i/(1-a):0,l=a<=0?0:o===t?(n-r)/a%6:o===n?2+(r-t)/a:4+(t-n)/a,l/=6,l%=1,[360*l,100*a,100*s]},i.hsl.hcg=function(e){const t=e[1]/100,n=e[2]/100,r=n<.5?2*t*n:2*t*(1-n);let o=0;return r<1&&(o=(n-.5*r)/(1-r)),[e[0],100*r,100*o]},i.hsv.hcg=function(e){const t=e[1]/100,n=e[2]/100,r=t*n;let o=0;return r<1&&(o=(n-r)/(1-r)),[e[0],100*r,100*o]},i.hcg.rgb=function(e){const t=e[0]/360,n=e[1]/100,r=e[2]/100;if(0===n)return[255*r,255*r,255*r];const o=[0,0,0],i=t%1*6,a=i%1,s=1-a;let l=0;switch(Math.floor(i)){case 0:o[0]=1,o[1]=a,o[2]=0;break;case 1:o[0]=s,o[1]=1,o[2]=0;break;case 2:o[0]=0,o[1]=1,o[2]=a;break;case 3:o[0]=0,o[1]=s,o[2]=1;break;case 4:o[0]=a,o[1]=0,o[2]=1;break;default:o[0]=1,o[1]=0,o[2]=s}return l=(1-n)*r,[255*(n*o[0]+l),255*(n*o[1]+l),255*(n*o[2]+l)]},i.hcg.hsv=function(e){const t=e[1]/100,n=t+e[2]/100*(1-t);let r=0;return n>0&&(r=t/n),[e[0],100*r,100*n]},i.hcg.hsl=function(e){const t=e[1]/100,n=e[2]/100*(1-t)+.5*t;let r=0;return n>0&&n<.5?r=t/(2*n):n>=.5&&n<1&&(r=t/(2*(1-n))),[e[0],100*r,100*n]},i.hcg.hwb=function(e){const t=e[1]/100,n=t+e[2]/100*(1-t);return[e[0],100*(n-t),100*(1-n)]},i.hwb.hcg=function(e){const t=e[1]/100,n=1-e[2]/100,r=n-t;let o=0;return r<1&&(o=(n-r)/(1-r)),[e[0],100*r,100*o]},i.apple.rgb=function(e){return[e[0]/65535*255,e[1]/65535*255,e[2]/65535*255]},i.rgb.apple=function(e){return[e[0]/255*65535,e[1]/255*65535,e[2]/255*65535]},i.gray.rgb=function(e){return[e[0]/100*255,e[0]/100*255,e[0]/100*255]},i.gray.hsl=function(e){return[0,0,e[0]]},i.gray.hsv=i.gray.hsl,i.gray.hwb=function(e){return[0,100,e[0]]},i.gray.cmyk=function(e){return[0,0,0,e[0]]},i.gray.lab=function(e){return[e[0],0,0]},i.gray.hex=function(e){const t=255&Math.round(e[0]/100*255),n=((t<<16)+(t<<8)+t).toString(16).toUpperCase();return"000000".substring(n.length)+n},i.rgb.gray=function(e){return[(e[0]+e[1]+e[2])/3/255*100]}},841:(e,t,n)=>{const r=n(4959),o=n(9325),i={};Object.keys(r).forEach((e=>{i[e]={},Object.defineProperty(i[e],"channels",{value:r[e].channels}),Object.defineProperty(i[e],"labels",{value:r[e].labels});const t=o(e);Object.keys(t).forEach((n=>{const r=t[n];i[e][n]=function(e){const t=function(...t){const n=t[0];if(null==n)return n;n.length>1&&(t=n);const r=e(t);if("object"==typeof r)for(let e=r.length,t=0;t<e;t++)r[t]=Math.round(r[t]);return r};return"conversion"in e&&(t.conversion=e.conversion),t}(r),i[e][n].raw=function(e){const t=function(...t){const n=t[0];return null==n?n:(n.length>1&&(t=n),e(t))};return"conversion"in e&&(t.conversion=e.conversion),t}(r)}))})),e.exports=i},9325:(e,t,n)=>{const r=n(4959);function o(e,t){return function(n){return t(e(n))}}function i(e,t){const n=[t[e].parent,e];let i=r[t[e].parent][e],a=t[e].parent;for(;t[a].parent;)n.unshift(t[a].parent),i=o(r[t[a].parent][a],i),a=t[a].parent;return i.conversion=n,i}e.exports=function(e){const t=function(e){const t=function(){const e={},t=Object.keys(r);for(let n=t.length,r=0;r<n;r++)e[t[r]]={distance:-1,parent:null};return e}(),n=[e];for(t[e].distance=0;n.length;){const e=n.pop(),o=Object.keys(r[e]);for(let r=o.length,i=0;i<r;i++){const r=o[i],a=t[r];-1===a.distance&&(a.distance=t[e].distance+1,a.parent=e,n.unshift(r))}}return t}(e),n={},o=Object.keys(t);for(let e=o.length,r=0;r<e;r++){const e=o[r];null!==t[e].parent&&(n[e]=i(e,t))}return n}},1103:e=>{e.exports={aliceblue:[240,248,255],antiquewhite:[250,235,215],aqua:[0,255,255],aquamarine:[127,255,212],azure:[240,255,255],beige:[245,245,220],bisque:[255,228,196],black:[0,0,0],blanchedalmond:[255,235,205],blue:[0,0,255],blueviolet:[138,43,226],brown:[165,42,42],burlywood:[222,184,135],cadetblue:[95,158,160],chartreuse:[127,255,0],chocolate:[210,105,30],coral:[255,127,80],cornflowerblue:[100,149,237],cornsilk:[255,248,220],crimson:[220,20,60],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgoldenrod:[184,134,11],darkgray:[169,169,169],darkgreen:[0,100,0],darkgrey:[169,169,169],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkseagreen:[143,188,143],darkslateblue:[72,61,139],darkslategray:[47,79,79],darkslategrey:[47,79,79],darkturquoise:[0,206,209],darkviolet:[148,0,211],deeppink:[255,20,147],deepskyblue:[0,191,255],dimgray:[105,105,105],dimgrey:[105,105,105],dodgerblue:[30,144,255],firebrick:[178,34,34],floralwhite:[255,250,240],forestgreen:[34,139,34],fuchsia:[255,0,255],gainsboro:[220,220,220],ghostwhite:[248,248,255],gold:[255,215,0],goldenrod:[218,165,32],gray:[128,128,128],green:[0,128,0],greenyellow:[173,255,47],grey:[128,128,128],honeydew:[240,255,240],hotpink:[255,105,180],indianred:[205,92,92],indigo:[75,0,130],ivory:[255,255,240],khaki:[240,230,140],lavender:[230,230,250],lavenderblush:[255,240,245],lawngreen:[124,252,0],lemonchiffon:[255,250,205],lightblue:[173,216,230],lightcoral:[240,128,128],lightcyan:[224,255,255],lightgoldenrodyellow:[250,250,210],lightgray:[211,211,211],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightsalmon:[255,160,122],lightseagreen:[32,178,170],lightskyblue:[135,206,250],lightslategray:[119,136,153],lightslategrey:[119,136,153],lightsteelblue:[176,196,222],lightyellow:[255,255,224],lime:[0,255,0],limegreen:[50,205,50],linen:[250,240,230],magenta:[255,0,255],maroon:[128,0,0],mediumaquamarine:[102,205,170],mediumblue:[0,0,205],mediumorchid:[186,85,211],mediumpurple:[147,112,219],mediumseagreen:[60,179,113],mediumslateblue:[123,104,238],mediumspringgreen:[0,250,154],mediumturquoise:[72,209,204],mediumvioletred:[199,21,133],midnightblue:[25,25,112],mintcream:[245,255,250],mistyrose:[255,228,225],moccasin:[255,228,181],navajowhite:[255,222,173],navy:[0,0,128],oldlace:[253,245,230],olive:[128,128,0],olivedrab:[107,142,35],orange:[255,165,0],orangered:[255,69,0],orchid:[218,112,214],palegoldenrod:[238,232,170],palegreen:[152,251,152],paleturquoise:[175,238,238],palevioletred:[219,112,147],papayawhip:[255,239,213],peachpuff:[255,218,185],peru:[205,133,63],pink:[255,192,203],plum:[221,160,221],powderblue:[176,224,230],purple:[128,0,128],rebeccapurple:[102,51,153],red:[255,0,0],rosybrown:[188,143,143],royalblue:[65,105,225],saddlebrown:[139,69,19],salmon:[250,128,114],sandybrown:[244,164,96],seagreen:[46,139,87],seashell:[255,245,238],sienna:[160,82,45],silver:[192,192,192],skyblue:[135,206,235],slateblue:[106,90,205],slategray:[112,128,144],slategrey:[112,128,144],snow:[255,250,250],springgreen:[0,255,127],steelblue:[70,130,180],tan:[210,180,140],teal:[0,128,128],thistle:[216,191,216],tomato:[255,99,71],turquoise:[64,224,208],violet:[238,130,238],wheat:[245,222,179],white:[255,255,255],whitesmoke:[245,245,245],yellow:[255,255,0],yellowgreen:[154,205,50]}},7804:(e,t,n)=>{var r=n(1103),o=n(6047),i=Object.hasOwnProperty,a=Object.create(null);for(var s in r)i.call(r,s)&&(a[r[s]]=s);var l=e.exports={to:{},get:{}};function c(e,t,n){return Math.min(Math.max(t,e),n)}function u(e){var t=Math.round(e).toString(16).toUpperCase();return t.length<2?"0"+t:t}l.get=function(e){var t,n;switch(e.substring(0,3).toLowerCase()){case"hsl":t=l.get.hsl(e),n="hsl";break;case"hwb":t=l.get.hwb(e),n="hwb";break;default:t=l.get.rgb(e),n="rgb"}return t?{model:n,value:t}:null},l.get.rgb=function(e){if(!e)return null;var t,n,o,a=[0,0,0,1];if(t=e.match(/^#([a-f0-9]{6})([a-f0-9]{2})?$/i)){for(o=t[2],t=t[1],n=0;n<3;n++){var s=2*n;a[n]=parseInt(t.slice(s,s+2),16)}o&&(a[3]=parseInt(o,16)/255)}else if(t=e.match(/^#([a-f0-9]{3,4})$/i)){for(o=(t=t[1])[3],n=0;n<3;n++)a[n]=parseInt(t[n]+t[n],16);o&&(a[3]=parseInt(o+o,16)/255)}else if(t=e.match(/^rgba?\(\s*([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/)){for(n=0;n<3;n++)a[n]=parseInt(t[n+1],0);t[4]&&(t[5]?a[3]=.01*parseFloat(t[4]):a[3]=parseFloat(t[4]))}else{if(!(t=e.match(/^rgba?\(\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/)))return(t=e.match(/^(\w+)$/))?"transparent"===t[1]?[0,0,0,0]:i.call(r,t[1])?((a=r[t[1]])[3]=1,a):null:null;for(n=0;n<3;n++)a[n]=Math.round(2.55*parseFloat(t[n+1]));t[4]&&(t[5]?a[3]=.01*parseFloat(t[4]):a[3]=parseFloat(t[4]))}for(n=0;n<3;n++)a[n]=c(a[n],0,255);return a[3]=c(a[3],0,1),a},l.get.hsl=function(e){if(!e)return null;var t=e.match(/^hsla?\(\s*([+-]?(?:\d{0,3}\.)?\d+)(?:deg)?\s*,?\s*([+-]?[\d\.]+)%\s*,?\s*([+-]?[\d\.]+)%\s*(?:[,|\/]\s*([+-]?(?=\.\d|\d)(?:0|[1-9]\d*)?(?:\.\d*)?(?:[eE][+-]?\d+)?)\s*)?\)$/);if(t){var n=parseFloat(t[4]);return[(parseFloat(t[1])%360+360)%360,c(parseFloat(t[2]),0,100),c(parseFloat(t[3]),0,100),c(isNaN(n)?1:n,0,1)]}return null},l.get.hwb=function(e){if(!e)return null;var t=e.match(/^hwb\(\s*([+-]?\d{0,3}(?:\.\d+)?)(?:deg)?\s*,\s*([+-]?[\d\.]+)%\s*,\s*([+-]?[\d\.]+)%\s*(?:,\s*([+-]?(?=\.\d|\d)(?:0|[1-9]\d*)?(?:\.\d*)?(?:[eE][+-]?\d+)?)\s*)?\)$/);if(t){var n=parseFloat(t[4]);return[(parseFloat(t[1])%360+360)%360,c(parseFloat(t[2]),0,100),c(parseFloat(t[3]),0,100),c(isNaN(n)?1:n,0,1)]}return null},l.to.hex=function(){var e=o(arguments);return"#"+u(e[0])+u(e[1])+u(e[2])+(e[3]<1?u(Math.round(255*e[3])):"")},l.to.rgb=function(){var e=o(arguments);return e.length<4||1===e[3]?"rgb("+Math.round(e[0])+", "+Math.round(e[1])+", "+Math.round(e[2])+")":"rgba("+Math.round(e[0])+", "+Math.round(e[1])+", "+Math.round(e[2])+", "+e[3]+")"},l.to.rgb.percent=function(){var e=o(arguments),t=Math.round(e[0]/255*100),n=Math.round(e[1]/255*100),r=Math.round(e[2]/255*100);return e.length<4||1===e[3]?"rgb("+t+"%, "+n+"%, "+r+"%)":"rgba("+t+"%, "+n+"%, "+r+"%, "+e[3]+")"},l.to.hsl=function(){var e=o(arguments);return e.length<4||1===e[3]?"hsl("+e[0]+", "+e[1]+"%, "+e[2]+"%)":"hsla("+e[0]+", "+e[1]+"%, "+e[2]+"%, "+e[3]+")"},l.to.hwb=function(){var e=o(arguments),t="";return e.length>=4&&1!==e[3]&&(t=", "+e[3]),"hwb("+e[0]+", "+e[1]+"%, "+e[2]+"%"+t+")"},l.to.keyword=function(e){return a[e.slice(0,3)]}},1346:(e,t,n)=>{const r=n(7804),o=n(841),i=["keyword","gray","hex"],a={};for(const e of Object.keys(o))a[[...o[e].labels].sort().join("")]=e;const s={};function l(e,t){if(!(this instanceof l))return new l(e,t);if(t&&t in i&&(t=null),t&&!(t in o))throw new Error("Unknown model: "+t);let n,c;if(null==e)this.model="rgb",this.color=[0,0,0],this.valpha=1;else if(e instanceof l)this.model=e.model,this.color=[...e.color],this.valpha=e.valpha;else if("string"==typeof e){const t=r.get(e);if(null===t)throw new Error("Unable to parse color from string: "+e);this.model=t.model,c=o[this.model].channels,this.color=t.value.slice(0,c),this.valpha="number"==typeof t.value[c]?t.value[c]:1}else if(e.length>0){this.model=t||"rgb",c=o[this.model].channels;const n=Array.prototype.slice.call(e,0,c);this.color=p(n,c),this.valpha="number"==typeof e[c]?e[c]:1}else if("number"==typeof e)this.model="rgb",this.color=[e>>16&255,e>>8&255,255&e],this.valpha=1;else{this.valpha=1;const t=Object.keys(e);"alpha"in e&&(t.splice(t.indexOf("alpha"),1),this.valpha="number"==typeof e.alpha?e.alpha:0);const r=t.sort().join("");if(!(r in a))throw new Error("Unable to parse color from object: "+JSON.stringify(e));this.model=a[r];const{labels:i}=o[this.model],s=[];for(n=0;n<i.length;n++)s.push(e[i[n]]);this.color=p(s)}if(s[this.model])for(c=o[this.model].channels,n=0;n<c;n++){const e=s[this.model][n];e&&(this.color[n]=e(this.color[n]))}this.valpha=Math.max(0,Math.min(1,this.valpha)),Object.freeze&&Object.freeze(this)}l.prototype={toString(){return this.string()},toJSON(){return this[this.model]()},string(e){let t=this.model in r.to?this:this.rgb();t=t.round("number"==typeof e?e:1);const n=1===t.valpha?t.color:[...t.color,this.valpha];return r.to[t.model](n)},percentString(e){const t=this.rgb().round("number"==typeof e?e:1),n=1===t.valpha?t.color:[...t.color,this.valpha];return r.to.rgb.percent(n)},array(){return 1===this.valpha?[...this.color]:[...this.color,this.valpha]},object(){const e={},{channels:t}=o[this.model],{labels:n}=o[this.model];for(let r=0;r<t;r++)e[n[r]]=this.color[r];return 1!==this.valpha&&(e.alpha=this.valpha),e},unitArray(){const e=this.rgb().color;return e[0]/=255,e[1]/=255,e[2]/=255,1!==this.valpha&&e.push(this.valpha),e},unitObject(){const e=this.rgb().object();return e.r/=255,e.g/=255,e.b/=255,1!==this.valpha&&(e.alpha=this.valpha),e},round(e){return e=Math.max(e||0,0),new l([...this.color.map(c(e)),this.valpha],this.model)},alpha(e){return void 0!==e?new l([...this.color,Math.max(0,Math.min(1,e))],this.model):this.valpha},red:u("rgb",0,d(255)),green:u("rgb",1,d(255)),blue:u("rgb",2,d(255)),hue:u(["hsl","hsv","hsl","hwb","hcg"],0,(e=>(e%360+360)%360)),saturationl:u("hsl",1,d(100)),lightness:u("hsl",2,d(100)),saturationv:u("hsv",1,d(100)),value:u("hsv",2,d(100)),chroma:u("hcg",1,d(100)),gray:u("hcg",2,d(100)),white:u("hwb",1,d(100)),wblack:u("hwb",2,d(100)),cyan:u("cmyk",0,d(100)),magenta:u("cmyk",1,d(100)),yellow:u("cmyk",2,d(100)),black:u("cmyk",3,d(100)),x:u("xyz",0,d(95.047)),y:u("xyz",1,d(100)),z:u("xyz",2,d(108.833)),l:u("lab",0,d(100)),a:u("lab",1),b:u("lab",2),keyword(e){return void 0!==e?new l(e):o[this.model].keyword(this.color)},hex(e){return void 0!==e?new l(e):r.to.hex(this.rgb().round().color)},hexa(e){if(void 0!==e)return new l(e);const t=this.rgb().round().color;let n=Math.round(255*this.valpha).toString(16).toUpperCase();return 1===n.length&&(n="0"+n),r.to.hex(t)+n},rgbNumber(){const e=this.rgb().color;return(255&e[0])<<16|(255&e[1])<<8|255&e[2]},luminosity(){const e=this.rgb().color,t=[];for(const[n,r]of e.entries()){const e=r/255;t[n]=e<=.04045?e/12.92:((e+.055)/1.055)**2.4}return.2126*t[0]+.7152*t[1]+.0722*t[2]},contrast(e){const t=this.luminosity(),n=e.luminosity();return t>n?(t+.05)/(n+.05):(n+.05)/(t+.05)},level(e){const t=this.contrast(e);return t>=7?"AAA":t>=4.5?"AA":""},isDark(){const e=this.rgb().color;return(2126*e[0]+7152*e[1]+722*e[2])/1e4<128},isLight(){return!this.isDark()},negate(){const e=this.rgb();for(let t=0;t<3;t++)e.color[t]=255-e.color[t];return e},lighten(e){const t=this.hsl();return t.color[2]+=t.color[2]*e,t},darken(e){const t=this.hsl();return t.color[2]-=t.color[2]*e,t},saturate(e){const t=this.hsl();return t.color[1]+=t.color[1]*e,t},desaturate(e){const t=this.hsl();return t.color[1]-=t.color[1]*e,t},whiten(e){const t=this.hwb();return t.color[1]+=t.color[1]*e,t},blacken(e){const t=this.hwb();return t.color[2]+=t.color[2]*e,t},grayscale(){const e=this.rgb().color,t=.3*e[0]+.59*e[1]+.11*e[2];return l.rgb(t,t,t)},fade(e){return this.alpha(this.valpha-this.valpha*e)},opaquer(e){return this.alpha(this.valpha+this.valpha*e)},rotate(e){const t=this.hsl();let n=t.color[0];return n=(n+e)%360,n=n<0?360+n:n,t.color[0]=n,t},mix(e,t){if(!e||!e.rgb)throw new Error('Argument to "mix" was not a Color instance, but rather an instance of '+typeof e);const n=e.rgb(),r=this.rgb(),o=void 0===t?.5:t,i=2*o-1,a=n.alpha()-r.alpha(),s=((i*a==-1?i:(i+a)/(1+i*a))+1)/2,c=1-s;return l.rgb(s*n.red()+c*r.red(),s*n.green()+c*r.green(),s*n.blue()+c*r.blue(),n.alpha()*o+r.alpha()*(1-o))}};for(const e of Object.keys(o)){if(i.includes(e))continue;const{channels:t}=o[e];l.prototype[e]=function(...t){return this.model===e?new l(this):t.length>0?new l(t,e):new l([...(n=o[this.model][e].raw(this.color),Array.isArray(n)?n:[n]),this.valpha],e);var n},l[e]=function(...n){let r=n[0];return"number"==typeof r&&(r=p(n,t)),new l(r,e)}}function c(e){return function(t){return function(e,t){return Number(e.toFixed(t))}(t,e)}}function u(e,t,n){e=Array.isArray(e)?e:[e];for(const r of e)(s[r]||(s[r]=[]))[t]=n;return e=e[0],function(r){let o;return void 0!==r?(n&&(r=n(r)),o=this[e](),o.color[t]=r,o):(o=this[e]().color[t],n&&(o=n(o)),o)}}function d(e){return function(t){return Math.max(0,Math.min(e,t))}}function p(e,t){for(let n=0;n<t;n++)"number"!=typeof e[n]&&(e[n]=0);return e}e.exports=l},3463:(e,t,n)=>{var r=n(3887),o={childContextTypes:!0,contextType:!0,contextTypes:!0,defaultProps:!0,displayName:!0,getDefaultProps:!0,getDerivedStateFromError:!0,getDerivedStateFromProps:!0,mixins:!0,propTypes:!0,type:!0},i={name:!0,length:!0,prototype:!0,caller:!0,callee:!0,arguments:!0,arity:!0},a={$$typeof:!0,compare:!0,defaultProps:!0,displayName:!0,propTypes:!0,type:!0},s={};function l(e){return r.isMemo(e)?a:s[e.$$typeof]||o}s[r.ForwardRef]={$$typeof:!0,render:!0,defaultProps:!0,displayName:!0,propTypes:!0},s[r.Memo]=a;var c=Object.defineProperty,u=Object.getOwnPropertyNames,d=Object.getOwnPropertySymbols,p=Object.getOwnPropertyDescriptor,f=Object.getPrototypeOf,h=Object.prototype;e.exports=function e(t,n,r){if("string"!=typeof n){if(h){var o=f(n);o&&o!==h&&e(t,o,r)}var a=u(n);d&&(a=a.concat(d(n)));for(var s=l(t),m=l(n),g=0;g<a.length;++g){var b=a[g];if(!(i[b]||r&&r[b]||m&&m[b]||s&&s[b])){var y=p(n,b);try{c(t,b,y)}catch(e){}}}}return t}},3459:(e,t)=>{var n="function"==typeof Symbol&&Symbol.for,r=n?Symbol.for("react.element"):60103,o=n?Symbol.for("react.portal"):60106,i=n?Symbol.for("react.fragment"):60107,a=n?Symbol.for("react.strict_mode"):60108,s=n?Symbol.for("react.profiler"):60114,l=n?Symbol.for("react.provider"):60109,c=n?Symbol.for("react.context"):60110,u=n?Symbol.for("react.async_mode"):60111,d=n?Symbol.for("react.concurrent_mode"):60111,p=n?Symbol.for("react.forward_ref"):60112,f=n?Symbol.for("react.suspense"):60113,h=n?Symbol.for("react.suspense_list"):60120,m=n?Symbol.for("react.memo"):60115,g=n?Symbol.for("react.lazy"):60116,b=n?Symbol.for("react.block"):60121,y=n?Symbol.for("react.fundamental"):60117,v=n?Symbol.for("react.responder"):60118,x=n?Symbol.for("react.scope"):60119;function w(e){if("object"==typeof e&&null!==e){var t=e.$$typeof;switch(t){case r:switch(e=e.type){case u:case d:case i:case s:case a:case f:return e;default:switch(e=e&&e.$$typeof){case c:case p:case g:case m:case l:return e;default:return t}}case o:return t}}}function k(e){return w(e)===d}t.AsyncMode=u,t.ConcurrentMode=d,t.ContextConsumer=c,t.ContextProvider=l,t.Element=r,t.ForwardRef=p,t.Fragment=i,t.Lazy=g,t.Memo=m,t.Portal=o,t.Profiler=s,t.StrictMode=a,t.Suspense=f,t.isAsyncMode=function(e){return k(e)||w(e)===u},t.isConcurrentMode=k,t.isContextConsumer=function(e){return w(e)===c},t.isContextProvider=function(e){return w(e)===l},t.isElement=function(e){return"object"==typeof e&&null!==e&&e.$$typeof===r},t.isForwardRef=function(e){return w(e)===p},t.isFragment=function(e){return w(e)===i},t.isLazy=function(e){return w(e)===g},t.isMemo=function(e){return w(e)===m},t.isPortal=function(e){return w(e)===o},t.isProfiler=function(e){return w(e)===s},t.isStrictMode=function(e){return w(e)===a},t.isSuspense=function(e){return w(e)===f},t.isValidElementType=function(e){return"string"==typeof e||"function"==typeof e||e===i||e===d||e===s||e===a||e===f||e===h||"object"==typeof e&&null!==e&&(e.$$typeof===g||e.$$typeof===m||e.$$typeof===l||e.$$typeof===c||e.$$typeof===p||e.$$typeof===y||e.$$typeof===v||e.$$typeof===x||e.$$typeof===b)},t.typeOf=w},3887:(e,t,n)=>{e.exports=n(3459)},7320:e=>{var t=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable;e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;n<10;n++)t["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(t).map((function(e){return t[e]})).join(""))return!1;var r={};return"abcdefghijklmnopqrst".split("").forEach((function(e){r[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},r)).join("")}catch(e){return!1}}()?Object.assign:function(e,o){for(var i,a,s=function(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}(e),l=1;l<arguments.length;l++){for(var c in i=Object(arguments[l]))n.call(i,c)&&(s[c]=i[c]);if(t){a=t(i);for(var u=0;u<a.length;u++)r.call(i,a[u])&&(s[a[u]]=i[a[u]])}}return s}},1837:(e,t,n)=>{n(7320);var r=n(810),o=60103;if(t.Fragment=60107,"function"==typeof Symbol&&Symbol.for){var i=Symbol.for;o=i("react.element"),t.Fragment=i("react.fragment")}var a=r.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,s=Object.prototype.hasOwnProperty,l={key:!0,ref:!0,__self:!0,__source:!0};function c(e,t,n){var r,i={},c=null,u=null;for(r in void 0!==n&&(c=""+n),void 0!==t.key&&(c=""+t.key),void 0!==t.ref&&(u=t.ref),t)s.call(t,r)&&!l.hasOwnProperty(r)&&(i[r]=t[r]);if(e&&e.defaultProps)for(r in t=e.defaultProps)void 0===i[r]&&(i[r]=t[r]);return{$$typeof:o,type:e,key:c,ref:u,props:i,_owner:a.current}}t.jsx=c,t.jsxs=c},2322:(e,t,n)=>{e.exports=n(1837)},6047:(e,t,n)=>{var r=n(905),o=Array.prototype.concat,i=Array.prototype.slice,a=e.exports=function(e){for(var t=[],n=0,a=e.length;n<a;n++){var s=e[n];r(s)?t=o.call(t,i.call(s)):t.push(s)}return t};a.wrap=function(e){return function(){return e(a(arguments))}}},905:e=>{e.exports=function(e){return!(!e||"string"==typeof e)&&(e instanceof Array||Array.isArray(e)||e.length>=0&&(e.splice instanceof Function||Object.getOwnPropertyDescriptor(e,e.length-1)&&"String"!==e.constructor.name))}},810:t=>{t.exports=e},1600:e=>{e.exports=function(e){return e&&e.__esModule?e:{default:e}},e.exports.__esModule=!0,e.exports.default=e.exports},7609:(e,t,n)=>{var r=n(7425).default;function o(){e.exports=o=function(){return t},e.exports.__esModule=!0,e.exports.default=e.exports;var t={},n=Object.prototype,i=n.hasOwnProperty,a=Object.defineProperty||function(e,t,n){e[t]=n.value},s="function"==typeof Symbol?Symbol:{},l=s.iterator||"@@iterator",c=s.asyncIterator||"@@asyncIterator",u=s.toStringTag||"@@toStringTag";function d(e,t,n){return Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}),e[t]}try{d({},"")}catch(e){d=function(e,t,n){return e[t]=n}}function p(e,t,n,r){var o=t&&t.prototype instanceof m?t:m,i=Object.create(o.prototype),s=new E(r||[]);return a(i,"_invoke",{value:Z(e,n,s)}),i}function f(e,t,n){try{return{type:"normal",arg:e.call(t,n)}}catch(e){return{type:"throw",arg:e}}}t.wrap=p;var h={};function m(){}function g(){}function b(){}var y={};d(y,l,(function(){return this}));var v=Object.getPrototypeOf,x=v&&v(v(R([])));x&&x!==n&&i.call(x,l)&&(y=x);var w=b.prototype=m.prototype=Object.create(y);function k(e){["next","throw","return"].forEach((function(t){d(e,t,(function(e){return this._invoke(t,e)}))}))}function S(e,t){function n(o,a,s,l){var c=f(e[o],e,a);if("throw"!==c.type){var u=c.arg,d=u.value;return d&&"object"==r(d)&&i.call(d,"__await")?t.resolve(d.__await).then((function(e){n("next",e,s,l)}),(function(e){n("throw",e,s,l)})):t.resolve(d).then((function(e){u.value=e,s(u)}),(function(e){return n("throw",e,s,l)}))}l(c.arg)}var o;a(this,"_invoke",{value:function(e,r){function i(){return new t((function(t,o){n(e,r,t,o)}))}return o=o?o.then(i,i):i()}})}function Z(e,t,n){var r="suspendedStart";return function(o,i){if("executing"===r)throw new Error("Generator is already running");if("completed"===r){if("throw"===o)throw i;return{value:void 0,done:!0}}for(n.method=o,n.arg=i;;){var a=n.delegate;if(a){var s=O(a,n);if(s){if(s===h)continue;return s}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if("suspendedStart"===r)throw r="completed",n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);r="executing";var l=f(e,t,n);if("normal"===l.type){if(r=n.done?"completed":"suspendedYield",l.arg===h)continue;return{value:l.arg,done:n.done}}"throw"===l.type&&(r="completed",n.method="throw",n.arg=l.arg)}}}function O(e,t){var n=t.method,r=e.iterator[n];if(void 0===r)return t.delegate=null,"throw"===n&&e.iterator.return&&(t.method="return",t.arg=void 0,O(e,t),"throw"===t.method)||"return"!==n&&(t.method="throw",t.arg=new TypeError("The iterator does not provide a '"+n+"' method")),h;var o=f(r,e.iterator,t.arg);if("throw"===o.type)return t.method="throw",t.arg=o.arg,t.delegate=null,h;var i=o.arg;return i?i.done?(t[e.resultName]=i.value,t.next=e.nextLoc,"return"!==t.method&&(t.method="next",t.arg=void 0),t.delegate=null,h):i:(t.method="throw",t.arg=new TypeError("iterator result is not an object"),t.delegate=null,h)}function C(e){var t={tryLoc:e[0]};1 in e&&(t.catchLoc=e[1]),2 in e&&(t.finallyLoc=e[2],t.afterLoc=e[3]),this.tryEntries.push(t)}function j(e){var t=e.completion||{};t.type="normal",delete t.arg,e.completion=t}function E(e){this.tryEntries=[{tryLoc:"root"}],e.forEach(C,this),this.reset(!0)}function R(e){if(e){var t=e[l];if(t)return t.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var n=-1,r=function t(){for(;++n<e.length;)if(i.call(e,n))return t.value=e[n],t.done=!1,t;return t.value=void 0,t.done=!0,t};return r.next=r}}return{next:P}}function P(){return{value:void 0,done:!0}}return g.prototype=b,a(w,"constructor",{value:b,configurable:!0}),a(b,"constructor",{value:g,configurable:!0}),g.displayName=d(b,u,"GeneratorFunction"),t.isGeneratorFunction=function(e){var t="function"==typeof e&&e.constructor;return!!t&&(t===g||"GeneratorFunction"===(t.displayName||t.name))},t.mark=function(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,b):(e.__proto__=b,d(e,u,"GeneratorFunction")),e.prototype=Object.create(w),e},t.awrap=function(e){return{__await:e}},k(S.prototype),d(S.prototype,c,(function(){return this})),t.AsyncIterator=S,t.async=function(e,n,r,o,i){void 0===i&&(i=Promise);var a=new S(p(e,n,r,o),i);return t.isGeneratorFunction(n)?a:a.next().then((function(e){return e.done?e.value:a.next()}))},k(w),d(w,u,"Generator"),d(w,l,(function(){return this})),d(w,"toString",(function(){return"[object Generator]"})),t.keys=function(e){var t=Object(e),n=[];for(var r in t)n.push(r);return n.reverse(),function e(){for(;n.length;){var r=n.pop();if(r in t)return e.value=r,e.done=!1,e}return e.done=!0,e}},t.values=R,E.prototype={constructor:E,reset:function(e){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(j),!e)for(var t in this)"t"===t.charAt(0)&&i.call(this,t)&&!isNaN(+t.slice(1))&&(this[t]=void 0)},stop:function(){this.done=!0;var e=this.tryEntries[0].completion;if("throw"===e.type)throw e.arg;return this.rval},dispatchException:function(e){if(this.done)throw e;var t=this;function n(n,r){return a.type="throw",a.arg=e,t.next=n,r&&(t.method="next",t.arg=void 0),!!r}for(var r=this.tryEntries.length-1;r>=0;--r){var o=this.tryEntries[r],a=o.completion;if("root"===o.tryLoc)return n("end");if(o.tryLoc<=this.prev){var s=i.call(o,"catchLoc"),l=i.call(o,"finallyLoc");if(s&&l){if(this.prev<o.catchLoc)return n(o.catchLoc,!0);if(this.prev<o.finallyLoc)return n(o.finallyLoc)}else if(s){if(this.prev<o.catchLoc)return n(o.catchLoc,!0)}else{if(!l)throw new Error("try statement without catch or finally");if(this.prev<o.finallyLoc)return n(o.finallyLoc)}}}},abrupt:function(e,t){for(var n=this.tryEntries.length-1;n>=0;--n){var r=this.tryEntries[n];if(r.tryLoc<=this.prev&&i.call(r,"finallyLoc")&&this.prev<r.finallyLoc){var o=r;break}}o&&("break"===e||"continue"===e)&&o.tryLoc<=t&&t<=o.finallyLoc&&(o=null);var a=o?o.completion:{};return a.type=e,a.arg=t,o?(this.method="next",this.next=o.finallyLoc,h):this.complete(a)},complete:function(e,t){if("throw"===e.type)throw e.arg;return"break"===e.type||"continue"===e.type?this.next=e.arg:"return"===e.type?(this.rval=this.arg=e.arg,this.method="return",this.next="end"):"normal"===e.type&&t&&(this.next=t),h},finish:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var n=this.tryEntries[t];if(n.finallyLoc===e)return this.complete(n.completion,n.afterLoc),j(n),h}},catch:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var n=this.tryEntries[t];if(n.tryLoc===e){var r=n.completion;if("throw"===r.type){var o=r.arg;j(n)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(e,t,n){return this.delegate={iterator:R(e),resultName:t,nextLoc:n},"next"===this.method&&(this.arg=void 0),h}},t}e.exports=o,e.exports.__esModule=!0,e.exports.default=e.exports},7425:e=>{function t(n){return e.exports=t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e.exports.__esModule=!0,e.exports.default=e.exports,t(n)}e.exports=t,e.exports.__esModule=!0,e.exports.default=e.exports},2841:(e,t,n)=>{var r=n(7609)();e.exports=r;try{regeneratorRuntime=r}catch(e){"object"==typeof globalThis?globalThis.regeneratorRuntime=r:Function("r","regeneratorRuntime = r")(r)}},7896:(e,t,n)=>{function r(){return r=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},r.apply(this,arguments)}n.d(t,{Z:()=>r})},1461:(e,t,n)=>{function r(e,t){if(null==e)return{};var n,r,o={},i=Object.keys(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}n.d(t,{Z:()=>r})}},l={};function c(e){var t=l[e];if(void 0!==t)return t.exports;var n=l[e]={exports:{}};return s[e](n,n.exports,c),n.exports}c.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return c.d(t,{a:t}),t},c.d=(e,t)=>{for(var n in t)c.o(t,n)&&!c.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},c.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),c.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var u={};(()=>{function e(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function s(e){return s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s(e)}function l(e){var t=function(e,t){if("object"!==s(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,"string");if("object"!==s(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"===s(t)?t:String(t)}function d(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,l(r.key),r)}}function p(e,t,n){return t&&d(e.prototype,t),n&&d(e,n),Object.defineProperty(e,"prototype",{writable:!1}),e}function f(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function h(e,t){return h=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},h(e,t)}function m(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&h(e,t)}function g(e,t){if(t&&("object"===s(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return f(e)}function b(e){return b=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},b(e)}function y(e,t,n){return(t=l(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}c.d(u,{bl:()=>Hi,xN:()=>Ai,tV:()=>Wi,Ff:()=>Ui});const v=(x={Analytics:()=>t.Analytics,DefaultDiceUserConfig:()=>t.DefaultDiceUserConfig,Dice:()=>t.Dice,DiceNotation:()=>t.DiceNotation,DiceType:()=>t.DiceType,DiceTypes:()=>t.DiceTypes,EventActions:()=>t.EventActions,EventCategories:()=>t.EventCategories,Logger:()=>t.Logger,RollKind:()=>t.RollKind,RollRequest:()=>t.RollRequest,RollRequestRoll:()=>t.RollRequestRoll,RollType:()=>t.RollType},w={},c.d(w,x),w);var x,w,k=c(810);function S(e,t,n,r,o,i,a){try{var s=e[i](a),l=s.value}catch(e){return void n(e)}s.done?t(l):Promise.resolve(l).then(r,o)}function Z(e){return function(){var t=this,n=arguments;return new Promise((function(r,o){var i=e.apply(t,n);function a(e){S(i,r,o,a,s,"next",e)}function s(e){S(i,r,o,a,s,"throw",e)}a(void 0)}))}}function O(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function C(e,t){if(e){if("string"==typeof e)return O(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?O(e,t):void 0}}function j(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,i,a,s=[],l=!0,c=!1;try{if(i=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;l=!1}else for(;!(l=(r=i.call(n)).done)&&(s.push(r.value),s.length!==t);l=!0);}catch(e){c=!0,o=e}finally{try{if(!l&&null!=n.return&&(a=n.return(),Object(a)!==a))return}finally{if(c)throw o}}return s}}(e,t)||C(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function E(e){return function(e){if(Array.isArray(e))return O(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||C(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var R=c(2841),P=c.n(R),M=c(4380),T=c(2322),N=function(){return(0,T.jsx)(M.Z,{viewBox:"0 0 48 48",children:(0,T.jsxs)("g",{children:[(0,T.jsx)("polygon",{fill:"#fff",points:"33 6 38 36 10 36 16 6"}),(0,T.jsx)("polygon",{fill:"#2C9400",points:"24 14 28 26 20 26 24 14"}),(0,T.jsx)("path",{fill:"#2C9400",d:"M44.39,12.1,23.89.39,3.5,12.29,3.61,35.9l20.5,11.71L44.5,35.71ZM31,36l-2-6H19l-2,6H10L21,8h6L38,36Z"})]})})},A=function(){return(0,T.jsx)(M.Z,{children:(0,T.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M6.00025 16C5.74425 16 5.48825 15.902 5.29325 15.707L0.29325 10.707C-0.09775 10.316 -0.09775 9.68401 0.29325 9.29301C0.68425 8.90201 1.31625 8.90201 1.70725 9.29301L6.00025 13.586L16.2932 3.29301C16.6842 2.90201 17.3162 2.90201 17.7073 3.29301C18.0983 3.68401 18.0983 4.31601 17.7073 4.70701L6.70725 15.707C6.51225 15.902 6.25625 16 6.00025 16Z",fill:"#1B9AF0"})})},D=function(){return(0,T.jsx)(M.Z,{viewBox:"0 0 48 48",children:(0,T.jsxs)("g",{children:[(0,T.jsx)("polygon",{fill:"#fff",points:"35 8 36 39 12 39 14 8"}),(0,T.jsx)("path",{fill:"#b00000",d:"M27.38,17.75a9.362,9.362,0,0,1,1.44,5.68v1.12a9.4423,9.4423,0,0,1-1.44,5.71A5.21983,5.21983,0,0,1,23,32H21V16h2A5.19361,5.19361,0,0,1,27.38,17.75Z"}),(0,T.jsx)("path",{fill:"#b00000",d:"M44.39,12.1,23.89.39,3.5,12.29,3.61,35.9l20.5,11.71L44.5,35.71ZM35.21,24.55a13.50293,13.50293,0,0,1-1.5,6.41,11.09308,11.09308,0,0,1-4.25,4.42A12.00926,12.00926,0,0,1,23.34,37H15V11h8.16a12.35962,12.35962,0,0,1,6.2,1.56,10.97521,10.97521,0,0,1,4.29,4.41,13.31084,13.31084,0,0,1,1.56,6.39Z"})]})})},$=function(){return(0,T.jsx)(M.Z,{children:(0,T.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M3 17V7h4a2 2 0 012 2v6a2 2 0 01-2 2H3zm4-8H5v6h2V9zm4.586-1.414A2 2 0 0113 7h6a2 2 0 012 2v8h-2V9h-2v7h-2V9h-2v8h-2V9a2 2 0 01.586-1.414z",fill:"#A7B6C2"})})},L=function(){return(0,T.jsx)(M.Z,{children:(0,T.jsx)("path",{d:"M9 13.75c-2.34 0-7 1.17-7 3.5V19h14v-1.75c0-2.33-4.66-3.5-7-3.5zM4.34 17c.84-.58 2.87-1.25 4.66-1.25s3.82.67 4.66 1.25H4.34zM9 12c1.93 0 3.5-1.57 3.5-3.5S10.93 5 9 5 5.5 6.57 5.5 8.5 7.07 12 9 12zm0-5c.83 0 1.5.67 1.5 1.5S9.83 10 9 10s-1.5-.67-1.5-1.5S8.17 7 9 7zm7.04 6.81c1.16.84 1.96 1.96 1.96 3.44V19h4v-1.75c0-2.02-3.5-3.17-5.96-3.44zM15 12c1.93 0 3.5-1.57 3.5-3.5S16.93 5 15 5c-.54 0-1.04.13-1.5.35.63.89 1 1.98 1 3.15s-.37 2.26-1 3.15c.46.22.96.35 1.5.35z",fill:"#A7B6C2"})})},I=function(){return(0,T.jsx)(M.Z,{viewBox:"0 0 16 18",children:(0,T.jsx)("path",{d:"M8 0L0 4.28571V12.9714L8 17.2571L15.4286 13.2571L16 12.9143V4.28571L8 0ZM6.85714 4.74286L3.48571 9.77143L1.37143 5.2L6.85714 4.74286ZM4.57143 10.2857L8 5.08571L11.4286 10.2857H4.57143ZM12.4571 9.77143L9.14286 4.74286L14.5714 5.14286L12.4571 9.77143ZM8.57143 1.6L12.8 3.88571L8.57143 3.54286V1.6ZM7.42857 1.6V3.54286L3.2 3.88571L7.42857 1.6ZM1.14286 7.31429L2.68571 10.7429L1.14286 11.6571V7.31429ZM1.71429 12.6286L3.25714 11.7143L5.77143 14.8571L1.71429 12.6286ZM4.57143 11.4286H10.8571L8 15.7143L4.57143 11.4286ZM10.2286 14.8L12.7429 11.6571L14.2857 12.5714L10.2286 14.8ZM13.4286 10.8L13.3143 10.7429L14.8571 7.31429V11.6571L13.4286 10.8Z",fill:"#8A9BA8"})})},z=c(1461);function _(e,t){if(null==e)return{};var n,r,o=(0,z.Z)(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var B=c(7896);function F(e){var t,n,r="";if("string"==typeof e||"number"==typeof e)r+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(n=F(e[t]))&&(r&&(r+=" "),r+=n);else for(t in e)e[t]&&(r&&(r+=" "),r+=t);return r}const W=function(){for(var e,t,n=0,r="";n<arguments.length;)(e=arguments[n++])&&(t=F(e))&&(r&&(r+=" "),r+=t);return r};var V=c(9752),K=c(7450),U=c(8970),H=c(9795);const q=["sx"];function G(e){const{sx:t}=e,n=(0,z.Z)(e,q),{systemProps:r,otherProps:o}=(e=>{var t,n;const r={systemProps:{},otherProps:{}},o=null!=(t=null==e||null==(n=e.theme)?void 0:n.unstable_sxConfig)?t:H.Z;return Object.keys(e).forEach((t=>{o[t]?r.systemProps[t]=e[t]:r.otherProps[t]=e[t]})),r})(n);let i;return i=Array.isArray(t)?[r,...t]:"function"==typeof t?(...e)=>{const n=t(...e);return(0,U.P)(n)?(0,B.Z)({},r,n):r}:(0,B.Z)({},r,t),(0,B.Z)({},o,{sx:i})}var Y=c(7156);const X=["className","component"];var J=c(8542),Q=c(4707),ee=c(6912);const te=(0,Q.Z)(),ne=function(e={}){const{themeId:t,defaultTheme:n,defaultClassName:r="MuiBox-root",generateClassName:o}=e,i=(0,V.ZP)("div",{shouldForwardProp:e=>"theme"!==e&&"sx"!==e&&"as"!==e})(K.Z);return k.forwardRef((function(e,a){const s=(0,Y.Z)(n),l=G(e),{className:c,component:u="div"}=l,d=(0,z.Z)(l,X);return(0,T.jsx)(i,(0,B.Z)({as:u,ref:a,className:W(c,o?o(r):r),theme:t&&s[t]||s},d))}))}({themeId:ee.Z,defaultTheme:te,defaultClassName:"MuiBox-root",generateClassName:J.Z.generate}),re=ne;var oe=c(8523),ie=c(3022),ae=c(9075),se=c(7591),le=c(7764),ce=c(3995),ue=c(8659),de=c(8647),pe=c(8926);function fe(e,t){e.prototype=Object.create(t.prototype),e.prototype.constructor=e,h(e,t)}const he=k.default.createContext(null);function me(e,t){var n=Object.create(null);return e&&k.Children.map(e,(function(e){return e})).forEach((function(e){n[e.key]=function(e){return t&&(0,k.isValidElement)(e)?t(e):e}(e)})),n}function ge(e,t,n){return null!=n[t]?n[t]:e.props[t]}function be(e,t,n){var r=me(e.children),o=function(e,t){function n(n){return n in t?t[n]:e[n]}e=e||{},t=t||{};var r,o=Object.create(null),i=[];for(var a in e)a in t?i.length&&(o[a]=i,i=[]):i.push(a);var s={};for(var l in t){if(o[l])for(r=0;r<o[l].length;r++){var c=o[l][r];s[o[l][r]]=n(c)}s[l]=n(l)}for(r=0;r<i.length;r++)s[i[r]]=n(i[r]);return s}(t,r);return Object.keys(o).forEach((function(i){var a=o[i];if((0,k.isValidElement)(a)){var s=i in t,l=i in r,c=t[i],u=(0,k.isValidElement)(c)&&!c.props.in;!l||s&&!u?l||!s||u?l&&s&&(0,k.isValidElement)(c)&&(o[i]=(0,k.cloneElement)(a,{onExited:n.bind(null,a),in:c.props.in,exit:ge(a,"exit",e),enter:ge(a,"enter",e)})):o[i]=(0,k.cloneElement)(a,{in:!1}):o[i]=(0,k.cloneElement)(a,{onExited:n.bind(null,a),in:!0,exit:ge(a,"exit",e),enter:ge(a,"enter",e)})}})),o}var ye=Object.values||function(e){return Object.keys(e).map((function(t){return e[t]}))},ve=function(e){function t(t,n){var r,o=(r=e.call(this,t,n)||this).handleExited.bind(f(r));return r.state={contextValue:{isMounting:!0},handleExited:o,firstRender:!0},r}fe(t,e);var n=t.prototype;return n.componentDidMount=function(){this.mounted=!0,this.setState({contextValue:{isMounting:!1}})},n.componentWillUnmount=function(){this.mounted=!1},t.getDerivedStateFromProps=function(e,t){var n,r,o=t.children,i=t.handleExited;return{children:t.firstRender?(n=e,r=i,me(n.children,(function(e){return(0,k.cloneElement)(e,{onExited:r.bind(null,e),in:!0,appear:ge(e,"appear",n),enter:ge(e,"enter",n),exit:ge(e,"exit",n)})}))):be(e,o,i),firstRender:!1}},n.handleExited=function(e,t){var n=me(this.props.children);e.key in n||(e.props.onExited&&e.props.onExited(t),this.mounted&&this.setState((function(t){var n=(0,B.Z)({},t.children);return delete n[e.key],{children:n}})))},n.render=function(){var e=this.props,t=e.component,n=e.childFactory,r=(0,z.Z)(e,["component","childFactory"]),o=this.state.contextValue,i=ye(this.state.children).map(n);return delete r.appear,delete r.enter,delete r.exit,null===t?k.default.createElement(he.Provider,{value:o},i):k.default.createElement(he.Provider,{value:o},k.default.createElement(t,r,i))},t}(k.default.Component);ve.propTypes={},ve.defaultProps={component:"div",childFactory:function(e){return e}};const xe=ve;c(2668);var we=c(1245);function ke(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];return(0,we.O)(t)}c(9721),c(3463);var Se=function(){var e=ke.apply(void 0,arguments),t="animation-"+e.name;return{name:t,styles:"@keyframes "+t+"{"+e.styles+"}",anim:1,toString:function(){return"_EMO_"+this.name+"_"+this.styles+"_EMO_"}}};var Ze=c(9222);const Oe=(0,Ze.Z)("MuiTouchRipple",["root","ripple","rippleVisible","ripplePulsate","child","childLeaving","childPulsate"]),Ce=["center","classes","className"];let je,Ee,Re,Pe,Me=e=>e;const Te=Se(je||(je=Me`
+  0% {
+    transform: scale(0);
+    opacity: 0.1;
+  }
+
+  100% {
+    transform: scale(1);
+    opacity: 0.3;
+  }
+`)),Ne=Se(Ee||(Ee=Me`
+  0% {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+  }
+`)),Ae=Se(Re||(Re=Me`
+  0% {
+    transform: scale(1);
+  }
+
+  50% {
+    transform: scale(0.92);
+  }
+
+  100% {
+    transform: scale(1);
+  }
+`)),De=(0,le.ZP)("span",{name:"MuiTouchRipple",slot:"Root"})({overflow:"hidden",pointerEvents:"none",position:"absolute",zIndex:0,top:0,right:0,bottom:0,left:0,borderRadius:"inherit"}),$e=(0,le.ZP)((function(e){const{className:t,classes:n,pulsate:r=!1,rippleX:o,rippleY:i,rippleSize:a,in:s,onExited:l,timeout:c}=e,[u,d]=k.useState(!1),p=(0,oe.Z)(t,n.ripple,n.rippleVisible,r&&n.ripplePulsate),f={width:a,height:a,top:-a/2+i,left:-a/2+o},h=(0,oe.Z)(n.child,u&&n.childLeaving,r&&n.childPulsate);return s||u||d(!0),k.useEffect((()=>{if(!s&&null!=l){const e=setTimeout(l,c);return()=>{clearTimeout(e)}}}),[l,s,c]),(0,T.jsx)("span",{className:p,style:f,children:(0,T.jsx)("span",{className:h})})}),{name:"MuiTouchRipple",slot:"Ripple"})(Pe||(Pe=Me`
+  opacity: 0;
+  position: absolute;
+
+  &.${0} {
+    opacity: 0.3;
+    transform: scale(1);
+    animation-name: ${0};
+    animation-duration: ${0}ms;
+    animation-timing-function: ${0};
+  }
+
+  &.${0} {
+    animation-duration: ${0}ms;
+  }
+
+  & .${0} {
+    opacity: 1;
+    display: block;
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+    background-color: currentColor;
+  }
+
+  & .${0} {
+    opacity: 0;
+    animation-name: ${0};
+    animation-duration: ${0}ms;
+    animation-timing-function: ${0};
+  }
+
+  & .${0} {
+    position: absolute;
+    /* @noflip */
+    left: 0px;
+    top: 0;
+    animation-name: ${0};
+    animation-duration: 2500ms;
+    animation-timing-function: ${0};
+    animation-iteration-count: infinite;
+    animation-delay: 200ms;
+  }
+`),Oe.rippleVisible,Te,550,(({theme:e})=>e.transitions.easing.easeInOut),Oe.ripplePulsate,(({theme:e})=>e.transitions.duration.shorter),Oe.child,Oe.childLeaving,Ne,550,(({theme:e})=>e.transitions.easing.easeInOut),Oe.childPulsate,Ae,(({theme:e})=>e.transitions.easing.easeInOut)),Le=k.forwardRef((function(e,t){const n=(0,ce.Z)({props:e,name:"MuiTouchRipple"}),{center:r=!1,classes:o={},className:i}=n,a=(0,z.Z)(n,Ce),[s,l]=k.useState([]),c=k.useRef(0),u=k.useRef(null);k.useEffect((()=>{u.current&&(u.current(),u.current=null)}),[s]);const d=k.useRef(!1),p=k.useRef(null),f=k.useRef(null),h=k.useRef(null);k.useEffect((()=>()=>{clearTimeout(p.current)}),[]);const m=k.useCallback((e=>{const{pulsate:t,rippleX:n,rippleY:r,rippleSize:i,cb:a}=e;l((e=>[...e,(0,T.jsx)($e,{classes:{ripple:(0,oe.Z)(o.ripple,Oe.ripple),rippleVisible:(0,oe.Z)(o.rippleVisible,Oe.rippleVisible),ripplePulsate:(0,oe.Z)(o.ripplePulsate,Oe.ripplePulsate),child:(0,oe.Z)(o.child,Oe.child),childLeaving:(0,oe.Z)(o.childLeaving,Oe.childLeaving),childPulsate:(0,oe.Z)(o.childPulsate,Oe.childPulsate)},timeout:550,pulsate:t,rippleX:n,rippleY:r,rippleSize:i},c.current)])),c.current+=1,u.current=a}),[o]),g=k.useCallback(((e={},t={},n=(()=>{}))=>{const{pulsate:o=!1,center:i=r||t.pulsate,fakeElement:a=!1}=t;if("mousedown"===(null==e?void 0:e.type)&&d.current)return void(d.current=!1);"touchstart"===(null==e?void 0:e.type)&&(d.current=!0);const s=a?null:h.current,l=s?s.getBoundingClientRect():{width:0,height:0,left:0,top:0};let c,u,g;if(i||void 0===e||0===e.clientX&&0===e.clientY||!e.clientX&&!e.touches)c=Math.round(l.width/2),u=Math.round(l.height/2);else{const{clientX:t,clientY:n}=e.touches&&e.touches.length>0?e.touches[0]:e;c=Math.round(t-l.left),u=Math.round(n-l.top)}if(i)g=Math.sqrt((2*l.width**2+l.height**2)/3),g%2==0&&(g+=1);else{const e=2*Math.max(Math.abs((s?s.clientWidth:0)-c),c)+2,t=2*Math.max(Math.abs((s?s.clientHeight:0)-u),u)+2;g=Math.sqrt(e**2+t**2)}null!=e&&e.touches?null===f.current&&(f.current=()=>{m({pulsate:o,rippleX:c,rippleY:u,rippleSize:g,cb:n})},p.current=setTimeout((()=>{f.current&&(f.current(),f.current=null)}),80)):m({pulsate:o,rippleX:c,rippleY:u,rippleSize:g,cb:n})}),[r,m]),b=k.useCallback((()=>{g({},{pulsate:!0})}),[g]),y=k.useCallback(((e,t)=>{if(clearTimeout(p.current),"touchend"===(null==e?void 0:e.type)&&f.current)return f.current(),f.current=null,void(p.current=setTimeout((()=>{y(e,t)})));f.current=null,l((e=>e.length>0?e.slice(1):e)),u.current=t}),[]);return k.useImperativeHandle(t,(()=>({pulsate:b,start:g,stop:y})),[b,g,y]),(0,T.jsx)(De,(0,B.Z)({className:(0,oe.Z)(Oe.root,o.root,i),ref:h},a,{children:(0,T.jsx)(xe,{component:null,exit:!0,children:s})}))}));var Ie=c(5672);function ze(e){return(0,Ie.Z)("MuiButtonBase",e)}const _e=(0,Ze.Z)("MuiButtonBase",["root","disabled","focusVisible"]),Be=["action","centerRipple","children","className","component","disabled","disableRipple","disableTouchRipple","focusRipple","focusVisibleClassName","LinkComponent","onBlur","onClick","onContextMenu","onDragLeave","onFocus","onFocusVisible","onKeyDown","onKeyUp","onMouseDown","onMouseLeave","onMouseUp","onTouchEnd","onTouchMove","onTouchStart","tabIndex","TouchRippleProps","touchRippleRef","type"],Fe=(0,le.ZP)("button",{name:"MuiButtonBase",slot:"Root",overridesResolver:(e,t)=>t.root})({display:"inline-flex",alignItems:"center",justifyContent:"center",position:"relative",boxSizing:"border-box",WebkitTapHighlightColor:"transparent",backgroundColor:"transparent",outline:0,border:0,margin:0,borderRadius:0,padding:0,cursor:"pointer",userSelect:"none",verticalAlign:"middle",MozAppearance:"none",WebkitAppearance:"none",textDecoration:"none",color:"inherit","&::-moz-focus-inner":{borderStyle:"none"},[`&.${_e.disabled}`]:{pointerEvents:"none",cursor:"default"},"@media print":{colorAdjust:"exact"}}),We=k.forwardRef((function(e,t){const n=(0,ce.Z)({props:e,name:"MuiButtonBase"}),{action:r,centerRipple:o=!1,children:i,className:a,component:s="button",disabled:l=!1,disableRipple:c=!1,disableTouchRipple:u=!1,focusRipple:d=!1,LinkComponent:p="a",onBlur:f,onClick:h,onContextMenu:m,onDragLeave:g,onFocus:b,onFocusVisible:y,onKeyDown:v,onKeyUp:x,onMouseDown:w,onMouseLeave:S,onMouseUp:Z,onTouchEnd:O,onTouchMove:C,onTouchStart:j,tabIndex:E=0,TouchRippleProps:R,touchRippleRef:P,type:M}=n,N=(0,z.Z)(n,Be),A=k.useRef(null),D=k.useRef(null),$=(0,ue.Z)(D,P),{isFocusVisibleRef:L,onFocus:I,onBlur:_,ref:F}=(0,pe.Z)(),[W,V]=k.useState(!1);l&&W&&V(!1),k.useImperativeHandle(r,(()=>({focusVisible:()=>{V(!0),A.current.focus()}})),[]);const[K,U]=k.useState(!1);k.useEffect((()=>{U(!0)}),[]);const H=K&&!c&&!l;function q(e,t,n=u){return(0,de.Z)((r=>(t&&t(r),!n&&D.current&&D.current[e](r),!0)))}k.useEffect((()=>{W&&d&&!c&&K&&D.current.pulsate()}),[c,d,W,K]);const G=q("start",w),Y=q("stop",m),X=q("stop",g),J=q("stop",Z),Q=q("stop",(e=>{W&&e.preventDefault(),S&&S(e)})),ee=q("start",j),te=q("stop",O),ne=q("stop",C),re=q("stop",(e=>{_(e),!1===L.current&&V(!1),f&&f(e)}),!1),ie=(0,de.Z)((e=>{A.current||(A.current=e.currentTarget),I(e),!0===L.current&&(V(!0),y&&y(e)),b&&b(e)})),se=()=>{const e=A.current;return s&&"button"!==s&&!("A"===e.tagName&&e.href)},le=k.useRef(!1),fe=(0,de.Z)((e=>{d&&!le.current&&W&&D.current&&" "===e.key&&(le.current=!0,D.current.stop(e,(()=>{D.current.start(e)}))),e.target===e.currentTarget&&se()&&" "===e.key&&e.preventDefault(),v&&v(e),e.target===e.currentTarget&&se()&&"Enter"===e.key&&!l&&(e.preventDefault(),h&&h(e))})),he=(0,de.Z)((e=>{d&&" "===e.key&&D.current&&W&&!e.defaultPrevented&&(le.current=!1,D.current.stop(e,(()=>{D.current.pulsate(e)}))),x&&x(e),h&&e.target===e.currentTarget&&se()&&" "===e.key&&!e.defaultPrevented&&h(e)}));let me=s;"button"===me&&(N.href||N.to)&&(me=p);const ge={};"button"===me?(ge.type=void 0===M?"button":M,ge.disabled=l):(N.href||N.to||(ge.role="button"),l&&(ge["aria-disabled"]=l));const be=(0,ue.Z)(t,F,A),ye=(0,B.Z)({},n,{centerRipple:o,component:s,disabled:l,disableRipple:c,disableTouchRipple:u,focusRipple:d,tabIndex:E,focusVisible:W}),ve=(e=>{const{disabled:t,focusVisible:n,focusVisibleClassName:r,classes:o}=e,i={root:["root",t&&"disabled",n&&"focusVisible"]},a=(0,ae.Z)(i,ze,o);return n&&r&&(a.root+=` ${r}`),a})(ye);return(0,T.jsxs)(Fe,(0,B.Z)({as:me,className:(0,oe.Z)(ve.root,a),ownerState:ye,onBlur:re,onClick:h,onContextMenu:Y,onFocus:ie,onKeyDown:fe,onKeyUp:he,onMouseDown:G,onMouseLeave:Q,onMouseUp:J,onDragLeave:X,onTouchEnd:te,onTouchMove:ne,onTouchStart:ee,ref:be,tabIndex:l?-1:E,type:M},ge,N,{children:[i,H?(0,T.jsx)(Le,(0,B.Z)({ref:$,center:o},R)):null]}))}));var Ve=c(7342);function Ke(e){return(0,Ie.Z)("MuiButton",e)}const Ue=(0,Ze.Z)("MuiButton",["root","text","textInherit","textPrimary","textSecondary","textSuccess","textError","textInfo","textWarning","outlined","outlinedInherit","outlinedPrimary","outlinedSecondary","outlinedSuccess","outlinedError","outlinedInfo","outlinedWarning","contained","containedInherit","containedPrimary","containedSecondary","containedSuccess","containedError","containedInfo","containedWarning","disableElevation","focusVisible","disabled","colorInherit","textSizeSmall","textSizeMedium","textSizeLarge","outlinedSizeSmall","outlinedSizeMedium","outlinedSizeLarge","containedSizeSmall","containedSizeMedium","containedSizeLarge","sizeMedium","sizeSmall","sizeLarge","fullWidth","startIcon","endIcon","iconSizeSmall","iconSizeMedium","iconSizeLarge"]),He=k.createContext({}),qe=["children","color","component","className","disabled","disableElevation","disableFocusRipple","endIcon","focusVisibleClassName","fullWidth","size","startIcon","type","variant"],Ge=e=>(0,B.Z)({},"small"===e.size&&{"& > *:nth-of-type(1)":{fontSize:18}},"medium"===e.size&&{"& > *:nth-of-type(1)":{fontSize:20}},"large"===e.size&&{"& > *:nth-of-type(1)":{fontSize:22}}),Ye=(0,le.ZP)(We,{shouldForwardProp:e=>(0,le.FO)(e)||"classes"===e,name:"MuiButton",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.root,t[n.variant],t[`${n.variant}${(0,Ve.Z)(n.color)}`],t[`size${(0,Ve.Z)(n.size)}`],t[`${n.variant}Size${(0,Ve.Z)(n.size)}`],"inherit"===n.color&&t.colorInherit,n.disableElevation&&t.disableElevation,n.fullWidth&&t.fullWidth]}})((({theme:e,ownerState:t})=>{var n,r;const o="light"===e.palette.mode?e.palette.grey[300]:e.palette.grey[800],i="light"===e.palette.mode?e.palette.grey.A100:e.palette.grey[700];return(0,B.Z)({},e.typography.button,{minWidth:64,padding:"6px 16px",borderRadius:(e.vars||e).shape.borderRadius,transition:e.transitions.create(["background-color","box-shadow","border-color","color"],{duration:e.transitions.duration.short}),"&:hover":(0,B.Z)({textDecoration:"none",backgroundColor:e.vars?`rgba(${e.vars.palette.text.primaryChannel} / ${e.vars.palette.action.hoverOpacity})`:(0,se.Fq)(e.palette.text.primary,e.palette.action.hoverOpacity),"@media (hover: none)":{backgroundColor:"transparent"}},"text"===t.variant&&"inherit"!==t.color&&{backgroundColor:e.vars?`rgba(${e.vars.palette[t.color].mainChannel} / ${e.vars.palette.action.hoverOpacity})`:(0,se.Fq)(e.palette[t.color].main,e.palette.action.hoverOpacity),"@media (hover: none)":{backgroundColor:"transparent"}},"outlined"===t.variant&&"inherit"!==t.color&&{border:`1px solid ${(e.vars||e).palette[t.color].main}`,backgroundColor:e.vars?`rgba(${e.vars.palette[t.color].mainChannel} / ${e.vars.palette.action.hoverOpacity})`:(0,se.Fq)(e.palette[t.color].main,e.palette.action.hoverOpacity),"@media (hover: none)":{backgroundColor:"transparent"}},"contained"===t.variant&&{backgroundColor:e.vars?e.vars.palette.Button.inheritContainedHoverBg:i,boxShadow:(e.vars||e).shadows[4],"@media (hover: none)":{boxShadow:(e.vars||e).shadows[2],backgroundColor:(e.vars||e).palette.grey[300]}},"contained"===t.variant&&"inherit"!==t.color&&{backgroundColor:(e.vars||e).palette[t.color].dark,"@media (hover: none)":{backgroundColor:(e.vars||e).palette[t.color].main}}),"&:active":(0,B.Z)({},"contained"===t.variant&&{boxShadow:(e.vars||e).shadows[8]}),[`&.${Ue.focusVisible}`]:(0,B.Z)({},"contained"===t.variant&&{boxShadow:(e.vars||e).shadows[6]}),[`&.${Ue.disabled}`]:(0,B.Z)({color:(e.vars||e).palette.action.disabled},"outlined"===t.variant&&{border:`1px solid ${(e.vars||e).palette.action.disabledBackground}`},"contained"===t.variant&&{color:(e.vars||e).palette.action.disabled,boxShadow:(e.vars||e).shadows[0],backgroundColor:(e.vars||e).palette.action.disabledBackground})},"text"===t.variant&&{padding:"6px 8px"},"text"===t.variant&&"inherit"!==t.color&&{color:(e.vars||e).palette[t.color].main},"outlined"===t.variant&&{padding:"5px 15px",border:"1px solid currentColor"},"outlined"===t.variant&&"inherit"!==t.color&&{color:(e.vars||e).palette[t.color].main,border:e.vars?`1px solid rgba(${e.vars.palette[t.color].mainChannel} / 0.5)`:`1px solid ${(0,se.Fq)(e.palette[t.color].main,.5)}`},"contained"===t.variant&&{color:e.vars?e.vars.palette.text.primary:null==(n=(r=e.palette).getContrastText)?void 0:n.call(r,e.palette.grey[300]),backgroundColor:e.vars?e.vars.palette.Button.inheritContainedBg:o,boxShadow:(e.vars||e).shadows[2]},"contained"===t.variant&&"inherit"!==t.color&&{color:(e.vars||e).palette[t.color].contrastText,backgroundColor:(e.vars||e).palette[t.color].main},"inherit"===t.color&&{color:"inherit",borderColor:"currentColor"},"small"===t.size&&"text"===t.variant&&{padding:"4px 5px",fontSize:e.typography.pxToRem(13)},"large"===t.size&&"text"===t.variant&&{padding:"8px 11px",fontSize:e.typography.pxToRem(15)},"small"===t.size&&"outlined"===t.variant&&{padding:"3px 9px",fontSize:e.typography.pxToRem(13)},"large"===t.size&&"outlined"===t.variant&&{padding:"7px 21px",fontSize:e.typography.pxToRem(15)},"small"===t.size&&"contained"===t.variant&&{padding:"4px 10px",fontSize:e.typography.pxToRem(13)},"large"===t.size&&"contained"===t.variant&&{padding:"8px 22px",fontSize:e.typography.pxToRem(15)},t.fullWidth&&{width:"100%"})}),(({ownerState:e})=>e.disableElevation&&{boxShadow:"none","&:hover":{boxShadow:"none"},[`&.${Ue.focusVisible}`]:{boxShadow:"none"},"&:active":{boxShadow:"none"},[`&.${Ue.disabled}`]:{boxShadow:"none"}})),Xe=(0,le.ZP)("span",{name:"MuiButton",slot:"StartIcon",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.startIcon,t[`iconSize${(0,Ve.Z)(n.size)}`]]}})((({ownerState:e})=>(0,B.Z)({display:"inherit",marginRight:8,marginLeft:-4},"small"===e.size&&{marginLeft:-2},Ge(e)))),Je=(0,le.ZP)("span",{name:"MuiButton",slot:"EndIcon",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.endIcon,t[`iconSize${(0,Ve.Z)(n.size)}`]]}})((({ownerState:e})=>(0,B.Z)({display:"inherit",marginRight:-4,marginLeft:8},"small"===e.size&&{marginRight:-2},Ge(e)))),Qe=k.forwardRef((function(e,t){const n=k.useContext(He),r=(0,ie.Z)(n,e),o=(0,ce.Z)({props:r,name:"MuiButton"}),{children:i,color:a="primary",component:s="button",className:l,disabled:c=!1,disableElevation:u=!1,disableFocusRipple:d=!1,endIcon:p,focusVisibleClassName:f,fullWidth:h=!1,size:m="medium",startIcon:g,type:b,variant:y="text"}=o,v=(0,z.Z)(o,qe),x=(0,B.Z)({},o,{color:a,component:s,disabled:c,disableElevation:u,disableFocusRipple:d,fullWidth:h,size:m,type:b,variant:y}),w=(e=>{const{color:t,disableElevation:n,fullWidth:r,size:o,variant:i,classes:a}=e,s={root:["root",i,`${i}${(0,Ve.Z)(t)}`,`size${(0,Ve.Z)(o)}`,`${i}Size${(0,Ve.Z)(o)}`,"inherit"===t&&"colorInherit",n&&"disableElevation",r&&"fullWidth"],label:["label"],startIcon:["startIcon",`iconSize${(0,Ve.Z)(o)}`],endIcon:["endIcon",`iconSize${(0,Ve.Z)(o)}`]},l=(0,ae.Z)(s,Ke,a);return(0,B.Z)({},a,l)})(x),S=g&&(0,T.jsx)(Xe,{className:w.startIcon,ownerState:x,children:g}),Z=p&&(0,T.jsx)(Je,{className:w.endIcon,ownerState:x,children:p});return(0,T.jsxs)(Ye,(0,B.Z)({ownerState:x,className:(0,oe.Z)(n.className,w.root,l),component:s,disabled:c,focusRipple:!d,focusVisibleClassName:(0,oe.Z)(w.focusVisible,f),ref:t,type:b},v,{classes:w,children:[S,i,Z]}))})),et=Qe;function tt(e){return(0,Ie.Z)("MuiDivider",e)}(0,Ze.Z)("MuiDivider",["root","absolute","fullWidth","inset","middle","flexItem","light","vertical","withChildren","withChildrenVertical","textAlignRight","textAlignLeft","wrapper","wrapperVertical"]);const nt=["absolute","children","className","component","flexItem","light","orientation","role","textAlign","variant"],rt=(0,le.ZP)("div",{name:"MuiDivider",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.root,n.absolute&&t.absolute,t[n.variant],n.light&&t.light,"vertical"===n.orientation&&t.vertical,n.flexItem&&t.flexItem,n.children&&t.withChildren,n.children&&"vertical"===n.orientation&&t.withChildrenVertical,"right"===n.textAlign&&"vertical"!==n.orientation&&t.textAlignRight,"left"===n.textAlign&&"vertical"!==n.orientation&&t.textAlignLeft]}})((({theme:e,ownerState:t})=>(0,B.Z)({margin:0,flexShrink:0,borderWidth:0,borderStyle:"solid",borderColor:(e.vars||e).palette.divider,borderBottomWidth:"thin"},t.absolute&&{position:"absolute",bottom:0,left:0,width:"100%"},t.light&&{borderColor:e.vars?`rgba(${e.vars.palette.dividerChannel} / 0.08)`:(0,se.Fq)(e.palette.divider,.08)},"inset"===t.variant&&{marginLeft:72},"middle"===t.variant&&"horizontal"===t.orientation&&{marginLeft:e.spacing(2),marginRight:e.spacing(2)},"middle"===t.variant&&"vertical"===t.orientation&&{marginTop:e.spacing(1),marginBottom:e.spacing(1)},"vertical"===t.orientation&&{height:"100%",borderBottomWidth:0,borderRightWidth:"thin"},t.flexItem&&{alignSelf:"stretch",height:"auto"})),(({ownerState:e})=>(0,B.Z)({},e.children&&{display:"flex",whiteSpace:"nowrap",textAlign:"center",border:0,"&::before, &::after":{content:'""',alignSelf:"center"}})),(({theme:e,ownerState:t})=>(0,B.Z)({},t.children&&"vertical"!==t.orientation&&{"&::before, &::after":{width:"100%",borderTop:`thin solid ${(e.vars||e).palette.divider}`}})),(({theme:e,ownerState:t})=>(0,B.Z)({},t.children&&"vertical"===t.orientation&&{flexDirection:"column","&::before, &::after":{height:"100%",borderLeft:`thin solid ${(e.vars||e).palette.divider}`}})),(({ownerState:e})=>(0,B.Z)({},"right"===e.textAlign&&"vertical"!==e.orientation&&{"&::before":{width:"90%"},"&::after":{width:"10%"}},"left"===e.textAlign&&"vertical"!==e.orientation&&{"&::before":{width:"10%"},"&::after":{width:"90%"}}))),ot=(0,le.ZP)("span",{name:"MuiDivider",slot:"Wrapper",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.wrapper,"vertical"===n.orientation&&t.wrapperVertical]}})((({theme:e,ownerState:t})=>(0,B.Z)({display:"inline-block",paddingLeft:`calc(${e.spacing(1)} * 1.2)`,paddingRight:`calc(${e.spacing(1)} * 1.2)`},"vertical"===t.orientation&&{paddingTop:`calc(${e.spacing(1)} * 1.2)`,paddingBottom:`calc(${e.spacing(1)} * 1.2)`}))),it=k.forwardRef((function(e,t){const n=(0,ce.Z)({props:e,name:"MuiDivider"}),{absolute:r=!1,children:o,className:i,component:a=(o?"div":"hr"),flexItem:s=!1,light:l=!1,orientation:c="horizontal",role:u=("hr"!==a?"separator":void 0),textAlign:d="center",variant:p="fullWidth"}=n,f=(0,z.Z)(n,nt),h=(0,B.Z)({},n,{absolute:r,component:a,flexItem:s,light:l,orientation:c,role:u,textAlign:d,variant:p}),m=(e=>{const{absolute:t,children:n,classes:r,flexItem:o,light:i,orientation:a,textAlign:s,variant:l}=e,c={root:["root",t&&"absolute",l,i&&"light","vertical"===a&&"vertical",o&&"flexItem",n&&"withChildren",n&&"vertical"===a&&"withChildrenVertical","right"===s&&"vertical"!==a&&"textAlignRight","left"===s&&"vertical"!==a&&"textAlignLeft"],wrapper:["wrapper","vertical"===a&&"wrapperVertical"]};return(0,ae.Z)(c,tt,r)})(h);return(0,T.jsx)(rt,(0,B.Z)({as:a,className:(0,oe.Z)(m.root,i),role:u,ref:t,ownerState:h},f,{children:o?(0,T.jsx)(ot,{className:m.wrapper,ownerState:h,children:o}):null}))})),at=k.createContext({});function st(e){return(0,Ie.Z)("MuiList",e)}(0,Ze.Z)("MuiList",["root","padding","dense","subheader"]);const lt=["children","className","component","dense","disablePadding","subheader"],ct=(0,le.ZP)("ul",{name:"MuiList",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.root,!n.disablePadding&&t.padding,n.dense&&t.dense,n.subheader&&t.subheader]}})((({ownerState:e})=>(0,B.Z)({listStyle:"none",margin:0,padding:0,position:"relative"},!e.disablePadding&&{paddingTop:8,paddingBottom:8},e.subheader&&{paddingTop:0}))),ut=k.forwardRef((function(e,t){const n=(0,ce.Z)({props:e,name:"MuiList"}),{children:r,className:o,component:i="ul",dense:a=!1,disablePadding:s=!1,subheader:l}=n,c=(0,z.Z)(n,lt),u=k.useMemo((()=>({dense:a})),[a]),d=(0,B.Z)({},n,{component:i,dense:a,disablePadding:s}),p=(e=>{const{classes:t,disablePadding:n,dense:r,subheader:o}=e,i={root:["root",!n&&"padding",r&&"dense",o&&"subheader"]};return(0,ae.Z)(i,st,t)})(d);return(0,T.jsx)(at.Provider,{value:u,children:(0,T.jsxs)(ct,(0,B.Z)({as:i,className:(0,oe.Z)(p.root,o),ref:t,ownerState:d},c,{children:[l,r]}))})}));function dt(e){return(0,Ie.Z)("MuiListSubheader",e)}(0,Ze.Z)("MuiListSubheader",["root","colorPrimary","colorInherit","gutters","inset","sticky"]);const pt=["className","color","component","disableGutters","disableSticky","inset"],ft=(0,le.ZP)("li",{name:"MuiListSubheader",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.root,"default"!==n.color&&t[`color${(0,Ve.Z)(n.color)}`],!n.disableGutters&&t.gutters,n.inset&&t.inset,!n.disableSticky&&t.sticky]}})((({theme:e,ownerState:t})=>(0,B.Z)({boxSizing:"border-box",lineHeight:"48px",listStyle:"none",color:(e.vars||e).palette.text.secondary,fontFamily:e.typography.fontFamily,fontWeight:e.typography.fontWeightMedium,fontSize:e.typography.pxToRem(14)},"primary"===t.color&&{color:(e.vars||e).palette.primary.main},"inherit"===t.color&&{color:"inherit"},!t.disableGutters&&{paddingLeft:16,paddingRight:16},t.inset&&{paddingLeft:72},!t.disableSticky&&{position:"sticky",top:0,zIndex:1,backgroundColor:(e.vars||e).palette.background.paper}))),ht=k.forwardRef((function(e,t){const n=(0,ce.Z)({props:e,name:"MuiListSubheader"}),{className:r,color:o="default",component:i="li",disableGutters:a=!1,disableSticky:s=!1,inset:l=!1}=n,c=(0,z.Z)(n,pt),u=(0,B.Z)({},n,{color:o,component:i,disableGutters:a,disableSticky:s,inset:l}),d=(e=>{const{classes:t,color:n,disableGutters:r,inset:o,disableSticky:i}=e,a={root:["root","default"!==n&&`color${(0,Ve.Z)(n)}`,!r&&"gutters",o&&"inset",!i&&"sticky"]};return(0,ae.Z)(a,dt,t)})(u);return(0,T.jsx)(ft,(0,B.Z)({as:i,className:(0,oe.Z)(d.root,r),ref:t,ownerState:u},c))}));ht.muiSkipListHighlight=!0;const mt=ht;var gt=c(3869),bt=c(6425),yt=c(8043);const vt=(e=>{var t={};return c.d(t,e),t})({createPortal:()=>n.createPortal,default:()=>n.default,findDOMNode:()=>n.findDOMNode});var xt="unmounted",wt="exited",kt="entering",St="entered",Zt="exiting",Ot=function(e){function t(t,n){var r;r=e.call(this,t,n)||this;var o,i=n&&!n.isMounting?t.enter:t.appear;return r.appearStatus=null,t.in?i?(o=wt,r.appearStatus=kt):o=St:o=t.unmountOnExit||t.mountOnEnter?xt:wt,r.state={status:o},r.nextCallback=null,r}fe(t,e),t.getDerivedStateFromProps=function(e,t){return e.in&&t.status===xt?{status:wt}:null};var n=t.prototype;return n.componentDidMount=function(){this.updateStatus(!0,this.appearStatus)},n.componentDidUpdate=function(e){var t=null;if(e!==this.props){var n=this.state.status;this.props.in?n!==kt&&n!==St&&(t=kt):n!==kt&&n!==St||(t=Zt)}this.updateStatus(!1,t)},n.componentWillUnmount=function(){this.cancelNextCallback()},n.getTimeouts=function(){var e,t,n,r=this.props.timeout;return e=t=n=r,null!=r&&"number"!=typeof r&&(e=r.exit,t=r.enter,n=void 0!==r.appear?r.appear:t),{exit:e,enter:t,appear:n}},n.updateStatus=function(e,t){if(void 0===e&&(e=!1),null!==t)if(this.cancelNextCallback(),t===kt){if(this.props.unmountOnExit||this.props.mountOnEnter){var n=this.props.nodeRef?this.props.nodeRef.current:vt.default.findDOMNode(this);n&&function(e){e.scrollTop}(n)}this.performEnter(e)}else this.performExit();else this.props.unmountOnExit&&this.state.status===wt&&this.setState({status:xt})},n.performEnter=function(e){var t=this,n=this.props.enter,r=this.context?this.context.isMounting:e,o=this.props.nodeRef?[r]:[vt.default.findDOMNode(this),r],i=o[0],a=o[1],s=this.getTimeouts(),l=r?s.appear:s.enter;e||n?(this.props.onEnter(i,a),this.safeSetState({status:kt},(function(){t.props.onEntering(i,a),t.onTransitionEnd(l,(function(){t.safeSetState({status:St},(function(){t.props.onEntered(i,a)}))}))}))):this.safeSetState({status:St},(function(){t.props.onEntered(i)}))},n.performExit=function(){var e=this,t=this.props.exit,n=this.getTimeouts(),r=this.props.nodeRef?void 0:vt.default.findDOMNode(this);t?(this.props.onExit(r),this.safeSetState({status:Zt},(function(){e.props.onExiting(r),e.onTransitionEnd(n.exit,(function(){e.safeSetState({status:wt},(function(){e.props.onExited(r)}))}))}))):this.safeSetState({status:wt},(function(){e.props.onExited(r)}))},n.cancelNextCallback=function(){null!==this.nextCallback&&(this.nextCallback.cancel(),this.nextCallback=null)},n.safeSetState=function(e,t){t=this.setNextCallback(t),this.setState(e,t)},n.setNextCallback=function(e){var t=this,n=!0;return this.nextCallback=function(r){n&&(n=!1,t.nextCallback=null,e(r))},this.nextCallback.cancel=function(){n=!1},this.nextCallback},n.onTransitionEnd=function(e,t){this.setNextCallback(t);var n=this.props.nodeRef?this.props.nodeRef.current:vt.default.findDOMNode(this),r=null==e&&!this.props.addEndListener;if(n&&!r){if(this.props.addEndListener){var o=this.props.nodeRef?[this.nextCallback]:[n,this.nextCallback],i=o[0],a=o[1];this.props.addEndListener(i,a)}null!=e&&setTimeout(this.nextCallback,e)}else setTimeout(this.nextCallback,0)},n.render=function(){var e=this.state.status;if(e===xt)return null;var t=this.props,n=t.children,r=(t.in,t.mountOnEnter,t.unmountOnExit,t.appear,t.enter,t.exit,t.timeout,t.addEndListener,t.onEnter,t.onEntering,t.onEntered,t.onExit,t.onExiting,t.onExited,t.nodeRef,(0,z.Z)(t,["children","in","mountOnEnter","unmountOnExit","appear","enter","exit","timeout","addEndListener","onEnter","onEntering","onEntered","onExit","onExiting","onExited","nodeRef"]));return k.default.createElement(he.Provider,{value:null},"function"==typeof n?n(e,r):k.default.cloneElement(k.default.Children.only(n),r))},t}(k.default.Component);function Ct(){}Ot.contextType=he,Ot.propTypes={},Ot.defaultProps={in:!1,mountOnEnter:!1,unmountOnExit:!1,appear:!1,enter:!0,exit:!0,onEnter:Ct,onEntering:Ct,onEntered:Ct,onExit:Ct,onExiting:Ct,onExited:Ct},Ot.UNMOUNTED=xt,Ot.EXITED=wt,Ot.ENTERING=kt,Ot.ENTERED=St,Ot.EXITING=Zt;const jt=Ot;var Et=c(9957);function Rt(){const e=(0,Y.Z)(Et.Z);return e[ee.Z]||e}const Pt=e=>e.scrollTop;function Mt(e,t){var n,r;const{timeout:o,easing:i,style:a={}}=e;return{duration:null!=(n=a.transitionDuration)?n:"number"==typeof o?o:o[t.mode]||0,easing:null!=(r=a.transitionTimingFunction)?r:"object"==typeof i?i[t.mode]:i,delay:a.transitionDelay}}const Tt=["addEndListener","appear","children","easing","in","onEnter","onEntered","onEntering","onExit","onExited","onExiting","style","timeout","TransitionComponent"];function Nt(e){return`scale(${e}, ${e**2})`}const At={entering:{opacity:1,transform:Nt(1)},entered:{opacity:1,transform:"none"}},Dt="undefined"!=typeof navigator&&/^((?!chrome|android).)*(safari|mobile)/i.test(navigator.userAgent)&&/(os |version\/)15(.|_)4/i.test(navigator.userAgent),$t=k.forwardRef((function(e,t){const{addEndListener:n,appear:r=!0,children:o,easing:i,in:a,onEnter:s,onEntered:l,onEntering:c,onExit:u,onExited:d,onExiting:p,style:f,timeout:h="auto",TransitionComponent:m=jt}=e,g=(0,z.Z)(e,Tt),b=k.useRef(),y=k.useRef(),v=Rt(),x=k.useRef(null),w=(0,ue.Z)(x,o.ref,t),S=e=>t=>{if(e){const n=x.current;void 0===t?e(n):e(n,t)}},Z=S(c),O=S(((e,t)=>{Pt(e);const{duration:n,delay:r,easing:o}=Mt({style:f,timeout:h,easing:i},{mode:"enter"});let a;"auto"===h?(a=v.transitions.getAutoHeightDuration(e.clientHeight),y.current=a):a=n,e.style.transition=[v.transitions.create("opacity",{duration:a,delay:r}),v.transitions.create("transform",{duration:Dt?a:.666*a,delay:r,easing:o})].join(","),s&&s(e,t)})),C=S(l),j=S(p),E=S((e=>{const{duration:t,delay:n,easing:r}=Mt({style:f,timeout:h,easing:i},{mode:"exit"});let o;"auto"===h?(o=v.transitions.getAutoHeightDuration(e.clientHeight),y.current=o):o=t,e.style.transition=[v.transitions.create("opacity",{duration:o,delay:n}),v.transitions.create("transform",{duration:Dt?o:.666*o,delay:Dt?n:n||.333*o,easing:r})].join(","),e.style.opacity=0,e.style.transform=Nt(.75),u&&u(e)})),R=S(d);return k.useEffect((()=>()=>{clearTimeout(b.current)}),[]),(0,T.jsx)(m,(0,B.Z)({appear:r,in:a,nodeRef:x,onEnter:O,onEntered:C,onEntering:Z,onExit:E,onExited:R,onExiting:j,addEndListener:e=>{"auto"===h&&(b.current=setTimeout(e,y.current||0)),n&&n(x.current,e)},timeout:"auto"===h?null:h},g,{children:(e,t)=>k.cloneElement(o,(0,B.Z)({style:(0,B.Z)({opacity:0,transform:Nt(.75),visibility:"exited"!==e||a?void 0:"hidden"},At[e],f,o.props.style),ref:w},t))}))}));$t.muiSupportAuto=!0;const Lt=$t;var It=c(4501),zt=c(6855),_t=c(7817),Bt=c(8419),Ft=c(1399),Wt=c(5377);const Vt=k.forwardRef((function(e,t){const{children:n,container:r,disablePortal:o=!1}=e,[i,a]=k.useState(null),s=(0,It.Z)(k.isValidElement(n)?n.ref:null,t);if((0,Ft.Z)((()=>{o||a(function(e){return"function"==typeof e?e():e}(r)||document.body)}),[r,o]),(0,Ft.Z)((()=>{if(i&&!o)return(0,Wt.Z)(t,i),()=>{(0,Wt.Z)(t,null)}}),[t,i,o]),o){if(k.isValidElement(n)){const e={ref:s};return k.cloneElement(n,e)}return(0,T.jsx)(k.Fragment,{children:n})}return(0,T.jsx)(k.Fragment,{children:i?vt.createPortal(n,i):i})}));var Kt=c(7270);function Ut(e,t){t?e.setAttribute("aria-hidden","true"):e.removeAttribute("aria-hidden")}function Ht(e){return parseInt((0,Kt.Z)(e).getComputedStyle(e).paddingRight,10)||0}function qt(e,t,n,r,o){const i=[t,n,...r];[].forEach.call(e.children,(e=>{const t=-1===i.indexOf(e),n=!function(e){const t=-1!==["TEMPLATE","SCRIPT","STYLE","LINK","MAP","META","NOSCRIPT","PICTURE","COL","COLGROUP","PARAM","SLOT","SOURCE","TRACK"].indexOf(e.tagName),n="INPUT"===e.tagName&&"hidden"===e.getAttribute("type");return t||n}(e);t&&n&&Ut(e,o)}))}function Gt(e,t){let n=-1;return e.some(((e,r)=>!!t(e)&&(n=r,!0))),n}const Yt=["input","select","textarea","a[href]","button","[tabindex]","audio[controls]","video[controls]",'[contenteditable]:not([contenteditable="false"])'].join(",");function Xt(e){const t=[],n=[];return Array.from(e.querySelectorAll(Yt)).forEach(((e,r)=>{const o=function(e){const t=parseInt(e.getAttribute("tabindex")||"",10);return Number.isNaN(t)?"true"===e.contentEditable||("AUDIO"===e.nodeName||"VIDEO"===e.nodeName||"DETAILS"===e.nodeName)&&null===e.getAttribute("tabindex")?0:e.tabIndex:t}(e);-1!==o&&function(e){return!(e.disabled||"INPUT"===e.tagName&&"hidden"===e.type||function(e){if("INPUT"!==e.tagName||"radio"!==e.type)return!1;if(!e.name)return!1;const t=t=>e.ownerDocument.querySelector(`input[type="radio"]${t}`);let n=t(`[name="${e.name}"]:checked`);return n||(n=t(`[name="${e.name}"]`)),n!==e}(e))}(e)&&(0===o?t.push(e):n.push({documentOrder:r,tabIndex:o,node:e}))})),n.sort(((e,t)=>e.tabIndex===t.tabIndex?e.documentOrder-t.documentOrder:e.tabIndex-t.tabIndex)).map((e=>e.node)).concat(t)}function Jt(){return!0}const Qt=function(e){const{children:t,disableAutoFocus:n=!1,disableEnforceFocus:r=!1,disableRestoreFocus:o=!1,getTabbable:i=Xt,isEnabled:a=Jt,open:s}=e,l=k.useRef(!1),c=k.useRef(null),u=k.useRef(null),d=k.useRef(null),p=k.useRef(null),f=k.useRef(!1),h=k.useRef(null),m=(0,It.Z)(t.ref,h),g=k.useRef(null);k.useEffect((()=>{s&&h.current&&(f.current=!n)}),[n,s]),k.useEffect((()=>{if(!s||!h.current)return;const e=(0,zt.Z)(h.current);return h.current.contains(e.activeElement)||(h.current.hasAttribute("tabIndex")||h.current.setAttribute("tabIndex","-1"),f.current&&h.current.focus()),()=>{o||(d.current&&d.current.focus&&(l.current=!0,d.current.focus()),d.current=null)}}),[s]),k.useEffect((()=>{if(!s||!h.current)return;const e=(0,zt.Z)(h.current),t=t=>{const{current:n}=h;if(null!==n)if(e.hasFocus()&&!r&&a()&&!l.current){if(!n.contains(e.activeElement)){if(t&&p.current!==t.target||e.activeElement!==p.current)p.current=null;else if(null!==p.current)return;if(!f.current)return;let r=[];if(e.activeElement!==c.current&&e.activeElement!==u.current||(r=i(h.current)),r.length>0){var o,s;const e=Boolean((null==(o=g.current)?void 0:o.shiftKey)&&"Tab"===(null==(s=g.current)?void 0:s.key)),t=r[0],n=r[r.length-1];"string"!=typeof t&&"string"!=typeof n&&(e?n.focus():t.focus())}else n.focus()}}else l.current=!1},n=t=>{g.current=t,!r&&a()&&"Tab"===t.key&&e.activeElement===h.current&&t.shiftKey&&(l.current=!0,u.current&&u.current.focus())};e.addEventListener("focusin",t),e.addEventListener("keydown",n,!0);const o=setInterval((()=>{e.activeElement&&"BODY"===e.activeElement.tagName&&t(null)}),50);return()=>{clearInterval(o),e.removeEventListener("focusin",t),e.removeEventListener("keydown",n,!0)}}),[n,r,o,a,s,i]);const b=e=>{null===d.current&&(d.current=e.relatedTarget),f.current=!0};return(0,T.jsxs)(k.Fragment,{children:[(0,T.jsx)("div",{tabIndex:s?0:-1,onFocus:b,ref:c,"data-testid":"sentinelStart"}),k.cloneElement(t,{ref:m,onFocus:e=>{null===d.current&&(d.current=e.relatedTarget),f.current=!0,p.current=e.target;const n=t.props.onFocus;n&&n(e)}}),(0,T.jsx)("div",{tabIndex:s?0:-1,onFocus:b,ref:u,"data-testid":"sentinelEnd"})]})};function en(e){return(0,Ie.Z)("MuiModal",e)}function tn(e){return"string"==typeof e}function nn(e){var t,n,r="";if("string"==typeof e||"number"==typeof e)r+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(n=nn(e[t]))&&(r&&(r+=" "),r+=n);else for(t in e)e[t]&&(r&&(r+=" "),r+=t);return r}(0,Ze.Z)("MuiModal",["root","hidden","backdrop"]);const rn=function(){for(var e,t,n=0,r="";n<arguments.length;)(e=arguments[n++])&&(t=nn(e))&&(r&&(r+=" "),r+=t);return r};function on(e){if(void 0===e)return{};const t={};return Object.keys(e).filter((t=>!(t.match(/^on[A-Z]/)&&"function"==typeof e[t]))).forEach((n=>{t[n]=e[n]})),t}function an(e,t){return"function"==typeof e?e(t):e}const sn=["elementType","externalSlotProps","ownerState"];function ln(e){var t;const{elementType:n,externalSlotProps:r,ownerState:o}=e,i=(0,z.Z)(e,sn),a=an(r,o),{props:s,internalRef:l}=function(e){const{getSlotProps:t,additionalProps:n,externalSlotProps:r,externalForwardedProps:o,className:i}=e;if(!t){const e=rn(null==o?void 0:o.className,null==r?void 0:r.className,i,null==n?void 0:n.className),t=(0,B.Z)({},null==n?void 0:n.style,null==o?void 0:o.style,null==r?void 0:r.style),a=(0,B.Z)({},n,o,r);return e.length>0&&(a.className=e),Object.keys(t).length>0&&(a.style=t),{props:a,internalRef:void 0}}const a=function(e,t=[]){if(void 0===e)return{};const n={};return Object.keys(e).filter((n=>n.match(/^on[A-Z]/)&&"function"==typeof e[n]&&!t.includes(n))).forEach((t=>{n[t]=e[t]})),n}((0,B.Z)({},o,r)),s=on(r),l=on(o),c=t(a),u=rn(null==c?void 0:c.className,null==n?void 0:n.className,i,null==o?void 0:o.className,null==r?void 0:r.className),d=(0,B.Z)({},null==c?void 0:c.style,null==n?void 0:n.style,null==o?void 0:o.style,null==r?void 0:r.style),p=(0,B.Z)({},c,n,l,s);return u.length>0&&(p.className=u),Object.keys(d).length>0&&(p.style=d),{props:p,internalRef:c.ref}}((0,B.Z)({},i,{externalSlotProps:a})),c=(0,It.Z)(l,null==a?void 0:a.ref,null==(t=e.additionalProps)?void 0:t.ref),u=function(e,t,n){return void 0===e||tn(e)?t:(0,B.Z)({},t,{ownerState:(0,B.Z)({},t.ownerState,n)})}(n,(0,B.Z)({},s,{ref:c}),o);return u}const cn={disableDefaultClasses:!1},un=k.createContext(cn),dn=["children","closeAfterTransition","container","disableAutoFocus","disableEnforceFocus","disableEscapeKeyDown","disablePortal","disableRestoreFocus","disableScrollLock","hideBackdrop","keepMounted","manager","onBackdropClick","onClose","onKeyDown","open","onTransitionEnter","onTransitionExited","slotProps","slots"],pn=new class{constructor(){this.containers=void 0,this.modals=void 0,this.modals=[],this.containers=[]}add(e,t){let n=this.modals.indexOf(e);if(-1!==n)return n;n=this.modals.length,this.modals.push(e),e.modalRef&&Ut(e.modalRef,!1);const r=function(e){const t=[];return[].forEach.call(e.children,(e=>{"true"===e.getAttribute("aria-hidden")&&t.push(e)})),t}(t);qt(t,e.mount,e.modalRef,r,!0);const o=Gt(this.containers,(e=>e.container===t));return-1!==o?(this.containers[o].modals.push(e),n):(this.containers.push({modals:[e],container:t,restore:null,hiddenSiblings:r}),n)}mount(e,t){const n=Gt(this.containers,(t=>-1!==t.modals.indexOf(e))),r=this.containers[n];r.restore||(r.restore=function(e,t){const n=[],r=e.container;if(!t.disableScrollLock){if(function(e){const t=(0,zt.Z)(e);return t.body===e?(0,Kt.Z)(e).innerWidth>t.documentElement.clientWidth:e.scrollHeight>e.clientHeight}(r)){const e=function(e){const t=e.documentElement.clientWidth;return Math.abs(window.innerWidth-t)}((0,zt.Z)(r));n.push({value:r.style.paddingRight,property:"padding-right",el:r}),r.style.paddingRight=`${Ht(r)+e}px`;const t=(0,zt.Z)(r).querySelectorAll(".mui-fixed");[].forEach.call(t,(t=>{n.push({value:t.style.paddingRight,property:"padding-right",el:t}),t.style.paddingRight=`${Ht(t)+e}px`}))}let e;if(r.parentNode instanceof DocumentFragment)e=(0,zt.Z)(r).body;else{const t=r.parentElement,n=(0,Kt.Z)(r);e="HTML"===(null==t?void 0:t.nodeName)&&"scroll"===n.getComputedStyle(t).overflowY?t:r}n.push({value:e.style.overflow,property:"overflow",el:e},{value:e.style.overflowX,property:"overflow-x",el:e},{value:e.style.overflowY,property:"overflow-y",el:e}),e.style.overflow="hidden"}return()=>{n.forEach((({value:e,el:t,property:n})=>{e?t.style.setProperty(n,e):t.style.removeProperty(n)}))}}(r,t))}remove(e,t=!0){const n=this.modals.indexOf(e);if(-1===n)return n;const r=Gt(this.containers,(t=>-1!==t.modals.indexOf(e))),o=this.containers[r];if(o.modals.splice(o.modals.indexOf(e),1),this.modals.splice(n,1),0===o.modals.length)o.restore&&o.restore(),e.modalRef&&Ut(e.modalRef,t),qt(o.container,e.mount,e.modalRef,o.hiddenSiblings,!1),this.containers.splice(r,1);else{const e=o.modals[o.modals.length-1];e.modalRef&&Ut(e.modalRef,!1)}return n}isTopModal(e){return this.modals.length>0&&this.modals[this.modals.length-1]===e}},fn=k.forwardRef((function(e,t){var n,r;const{children:o,closeAfterTransition:i=!1,container:a,disableAutoFocus:s=!1,disableEnforceFocus:l=!1,disableEscapeKeyDown:c=!1,disablePortal:u=!1,disableRestoreFocus:d=!1,disableScrollLock:p=!1,hideBackdrop:f=!1,keepMounted:h=!1,manager:m=pn,onBackdropClick:g,onClose:b,onKeyDown:y,open:v,onTransitionEnter:x,onTransitionExited:w,slotProps:S={},slots:Z={}}=e,O=(0,z.Z)(e,dn),C=m,[j,E]=k.useState(!v),R=k.useRef({}),P=k.useRef(null),M=k.useRef(null),N=(0,It.Z)(M,t),A=function(e){return!!e&&e.props.hasOwnProperty("in")}(o),D=null==(n=e["aria-hidden"])||n,$=()=>(R.current.modalRef=M.current,R.current.mountNode=P.current,R.current),L=()=>{C.mount($(),{disableScrollLock:p}),M.current&&(M.current.scrollTop=0)},I=(0,_t.Z)((()=>{const e=function(e){return"function"==typeof e?e():e}(a)||(0,zt.Z)(P.current).body;C.add($(),e),M.current&&L()})),_=k.useCallback((()=>C.isTopModal($())),[C]),F=(0,_t.Z)((e=>{P.current=e,e&&M.current&&(v&&_()?L():Ut(M.current,D))})),W=k.useCallback((()=>{C.remove($(),D)}),[C,D]);k.useEffect((()=>()=>{W()}),[W]),k.useEffect((()=>{v?I():A&&i||W()}),[v,W,A,i,I]);const V=(0,B.Z)({},e,{closeAfterTransition:i,disableAutoFocus:s,disableEnforceFocus:l,disableEscapeKeyDown:c,disablePortal:u,disableRestoreFocus:d,disableScrollLock:p,exited:j,hideBackdrop:f,keepMounted:h}),K=(e=>{const{open:t,exited:n}=e,r={root:["root",!t&&n&&"hidden"],backdrop:["backdrop"]};return(0,ae.Z)(r,function(e){const{disableDefaultClasses:t}=k.useContext(un);return n=>t?"":e(n)}(en))})(V),U={};void 0===o.props.tabIndex&&(U.tabIndex="-1"),A&&(U.onEnter=(0,Bt.Z)((()=>{E(!1),x&&x()}),o.props.onEnter),U.onExited=(0,Bt.Z)((()=>{E(!0),w&&w(),i&&W()}),o.props.onExited));const H=null!=(r=Z.root)?r:"div",q=ln({elementType:H,externalSlotProps:S.root,externalForwardedProps:O,additionalProps:{ref:N,role:"presentation",onKeyDown:e=>{y&&y(e),"Escape"===e.key&&_()&&(c||(e.stopPropagation(),b&&b(e,"escapeKeyDown")))}},className:K.root,ownerState:V}),G=Z.backdrop,Y=ln({elementType:G,externalSlotProps:S.backdrop,additionalProps:{"aria-hidden":!0,onClick:e=>{e.target===e.currentTarget&&(g&&g(e),b&&b(e,"backdropClick"))},open:v},className:K.backdrop,ownerState:V});return h||v||A&&!j?(0,T.jsx)(Vt,{ref:F,container:a,disablePortal:u,children:(0,T.jsxs)(H,(0,B.Z)({},q,{children:[!f&&G?(0,T.jsx)(G,(0,B.Z)({},Y)):null,(0,T.jsx)(Qt,{disableEnforceFocus:l,disableAutoFocus:s,disableRestoreFocus:d,isEnabled:_,open:v,children:k.cloneElement(o,U)})]}))}):null})),hn=["addEndListener","appear","children","easing","in","onEnter","onEntered","onEntering","onExit","onExited","onExiting","style","timeout","TransitionComponent"],mn={entering:{opacity:1},entered:{opacity:1}},gn=k.forwardRef((function(e,t){const n=Rt(),r={enter:n.transitions.duration.enteringScreen,exit:n.transitions.duration.leavingScreen},{addEndListener:o,appear:i=!0,children:a,easing:s,in:l,onEnter:c,onEntered:u,onEntering:d,onExit:p,onExited:f,onExiting:h,style:m,timeout:g=r,TransitionComponent:b=jt}=e,y=(0,z.Z)(e,hn),v=k.useRef(null),x=(0,ue.Z)(v,a.ref,t),w=e=>t=>{if(e){const n=v.current;void 0===t?e(n):e(n,t)}},S=w(d),Z=w(((e,t)=>{Pt(e);const r=Mt({style:m,timeout:g,easing:s},{mode:"enter"});e.style.webkitTransition=n.transitions.create("opacity",r),e.style.transition=n.transitions.create("opacity",r),c&&c(e,t)})),O=w(u),C=w(h),j=w((e=>{const t=Mt({style:m,timeout:g,easing:s},{mode:"exit"});e.style.webkitTransition=n.transitions.create("opacity",t),e.style.transition=n.transitions.create("opacity",t),p&&p(e)})),E=w(f);return(0,T.jsx)(b,(0,B.Z)({appear:i,in:l,nodeRef:v,onEnter:Z,onEntered:O,onEntering:S,onExit:j,onExited:E,onExiting:C,addEndListener:e=>{o&&o(v.current,e)},timeout:g},y,{children:(e,t)=>k.cloneElement(a,(0,B.Z)({style:(0,B.Z)({opacity:0,visibility:"exited"!==e||l?void 0:"hidden"},mn[e],m,a.props.style),ref:x},t))}))})),bn=gn;function yn(e){return(0,Ie.Z)("MuiBackdrop",e)}(0,Ze.Z)("MuiBackdrop",["root","invisible"]);const vn=["children","className","component","components","componentsProps","invisible","open","slotProps","slots","TransitionComponent","transitionDuration"],xn=(0,le.ZP)("div",{name:"MuiBackdrop",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.root,n.invisible&&t.invisible]}})((({ownerState:e})=>(0,B.Z)({position:"fixed",display:"flex",alignItems:"center",justifyContent:"center",right:0,bottom:0,top:0,left:0,backgroundColor:"rgba(0, 0, 0, 0.5)",WebkitTapHighlightColor:"transparent"},e.invisible&&{backgroundColor:"transparent"}))),wn=k.forwardRef((function(e,t){var n,r,o;const i=(0,ce.Z)({props:e,name:"MuiBackdrop"}),{children:a,className:s,component:l="div",components:c={},componentsProps:u={},invisible:d=!1,open:p,slotProps:f={},slots:h={},TransitionComponent:m=bn,transitionDuration:g}=i,b=(0,z.Z)(i,vn),y=(0,B.Z)({},i,{component:l,invisible:d}),v=(e=>{const{classes:t,invisible:n}=e,r={root:["root",n&&"invisible"]};return(0,ae.Z)(r,yn,t)})(y),x=null!=(n=f.root)?n:u.root;return(0,T.jsx)(m,(0,B.Z)({in:p,timeout:g},b,{children:(0,T.jsx)(xn,(0,B.Z)({"aria-hidden":!0},x,{as:null!=(r=null!=(o=h.root)?o:c.Root)?r:l,className:(0,oe.Z)(v.root,s,null==x?void 0:x.className),ownerState:(0,B.Z)({},y,null==x?void 0:x.ownerState),classes:v,ref:t,children:a}))}))})),kn=["BackdropComponent","BackdropProps","classes","className","closeAfterTransition","children","container","component","components","componentsProps","disableAutoFocus","disableEnforceFocus","disableEscapeKeyDown","disablePortal","disableRestoreFocus","disableScrollLock","hideBackdrop","keepMounted","onBackdropClick","onClose","open","slotProps","slots","theme"],Sn=(0,le.ZP)("div",{name:"MuiModal",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.root,!n.open&&n.exited&&t.hidden]}})((({theme:e,ownerState:t})=>(0,B.Z)({position:"fixed",zIndex:(e.vars||e).zIndex.modal,right:0,bottom:0,top:0,left:0},!t.open&&t.exited&&{visibility:"hidden"}))),Zn=(0,le.ZP)(wn,{name:"MuiModal",slot:"Backdrop",overridesResolver:(e,t)=>t.backdrop})({zIndex:-1}),On=k.forwardRef((function(e,t){var n,r,o,i,a,s;const l=(0,ce.Z)({name:"MuiModal",props:e}),{BackdropComponent:c=Zn,BackdropProps:u,classes:d,className:p,closeAfterTransition:f=!1,children:h,container:m,component:g,components:b={},componentsProps:y={},disableAutoFocus:v=!1,disableEnforceFocus:x=!1,disableEscapeKeyDown:w=!1,disablePortal:S=!1,disableRestoreFocus:Z=!1,disableScrollLock:O=!1,hideBackdrop:C=!1,keepMounted:j=!1,onBackdropClick:E,onClose:R,open:P,slotProps:M,slots:N,theme:A}=l,D=(0,z.Z)(l,kn),[$,L]=k.useState(!0),I={container:m,closeAfterTransition:f,disableAutoFocus:v,disableEnforceFocus:x,disableEscapeKeyDown:w,disablePortal:S,disableRestoreFocus:Z,disableScrollLock:O,hideBackdrop:C,keepMounted:j,onBackdropClick:E,onClose:R,open:P},_=(0,B.Z)({},l,I,{exited:$}),F=null!=(n=null!=(r=null==N?void 0:N.root)?r:b.Root)?n:Sn,W=null!=(o=null!=(i=null==N?void 0:N.backdrop)?i:b.Backdrop)?o:c,V=null!=(a=null==M?void 0:M.root)?a:y.root,K=null!=(s=null==M?void 0:M.backdrop)?s:y.backdrop;return(0,T.jsx)(fn,(0,B.Z)({slots:{root:F,backdrop:W},slotProps:{root:()=>(0,B.Z)({},an(V,_),!tn(F)&&{as:g,theme:A},{className:(0,oe.Z)(p,null==V?void 0:V.className,null==d?void 0:d.root,!_.open&&_.exited&&(null==d?void 0:d.hidden))}),backdrop:()=>(0,B.Z)({},u,an(K,_),{className:(0,oe.Z)(null==K?void 0:K.className,null==d?void 0:d.backdrop)})},onTransitionEnter:()=>L(!1),onTransitionExited:()=>L(!0),ref:t},D,I,{children:h}))})),Cn=e=>{let t;return t=e<1?5.11916*e**2:4.5*Math.log(e+1)+2,(t/100).toFixed(2)};function jn(e){return(0,Ie.Z)("MuiPaper",e)}(0,Ze.Z)("MuiPaper",["root","rounded","outlined","elevation","elevation0","elevation1","elevation2","elevation3","elevation4","elevation5","elevation6","elevation7","elevation8","elevation9","elevation10","elevation11","elevation12","elevation13","elevation14","elevation15","elevation16","elevation17","elevation18","elevation19","elevation20","elevation21","elevation22","elevation23","elevation24"]);const En=["className","component","elevation","square","variant"],Rn=(0,le.ZP)("div",{name:"MuiPaper",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.root,t[n.variant],!n.square&&t.rounded,"elevation"===n.variant&&t[`elevation${n.elevation}`]]}})((({theme:e,ownerState:t})=>{var n;return(0,B.Z)({backgroundColor:(e.vars||e).palette.background.paper,color:(e.vars||e).palette.text.primary,transition:e.transitions.create("box-shadow")},!t.square&&{borderRadius:e.shape.borderRadius},"outlined"===t.variant&&{border:`1px solid ${(e.vars||e).palette.divider}`},"elevation"===t.variant&&(0,B.Z)({boxShadow:(e.vars||e).shadows[t.elevation]},!e.vars&&"dark"===e.palette.mode&&{backgroundImage:`linear-gradient(${(0,se.Fq)("#fff",Cn(t.elevation))}, ${(0,se.Fq)("#fff",Cn(t.elevation))})`},e.vars&&{backgroundImage:null==(n=e.vars.overlays)?void 0:n[t.elevation]}))})),Pn=k.forwardRef((function(e,t){const n=(0,ce.Z)({props:e,name:"MuiPaper"}),{className:r,component:o="div",elevation:i=1,square:a=!1,variant:s="elevation"}=n,l=(0,z.Z)(n,En),c=(0,B.Z)({},n,{component:o,elevation:i,square:a,variant:s}),u=(e=>{const{square:t,elevation:n,variant:r,classes:o}=e,i={root:["root",r,!t&&"rounded","elevation"===r&&`elevation${n}`]};return(0,ae.Z)(i,jn,o)})(c);return(0,T.jsx)(Rn,(0,B.Z)({as:o,ownerState:c,className:(0,oe.Z)(u.root,r),ref:t},l))}));function Mn(e){return(0,Ie.Z)("MuiPopover",e)}(0,Ze.Z)("MuiPopover",["root","paper"]);const Tn=["onEntering"],Nn=["action","anchorEl","anchorOrigin","anchorPosition","anchorReference","children","className","container","elevation","marginThreshold","open","PaperProps","transformOrigin","TransitionComponent","transitionDuration","TransitionProps"];function An(e,t){let n=0;return"number"==typeof t?n=t:"center"===t?n=e.height/2:"bottom"===t&&(n=e.height),n}function Dn(e,t){let n=0;return"number"==typeof t?n=t:"center"===t?n=e.width/2:"right"===t&&(n=e.width),n}function $n(e){return[e.horizontal,e.vertical].map((e=>"number"==typeof e?`${e}px`:e)).join(" ")}function Ln(e){return"function"==typeof e?e():e}const In=(0,le.ZP)(On,{name:"MuiPopover",slot:"Root",overridesResolver:(e,t)=>t.root})({}),zn=(0,le.ZP)(Pn,{name:"MuiPopover",slot:"Paper",overridesResolver:(e,t)=>t.paper})({position:"absolute",overflowY:"auto",overflowX:"hidden",minWidth:16,minHeight:16,maxWidth:"calc(100% - 32px)",maxHeight:"calc(100% - 32px)",outline:0}),_n=k.forwardRef((function(e,t){const n=(0,ce.Z)({props:e,name:"MuiPopover"}),{action:r,anchorEl:o,anchorOrigin:i={vertical:"top",horizontal:"left"},anchorPosition:a,anchorReference:s="anchorEl",children:l,className:c,container:u,elevation:d=8,marginThreshold:p=16,open:f,PaperProps:h={},transformOrigin:m={vertical:"top",horizontal:"left"},TransitionComponent:g=Lt,transitionDuration:b="auto",TransitionProps:{onEntering:y}={}}=n,v=(0,z.Z)(n.TransitionProps,Tn),x=(0,z.Z)(n,Nn),w=k.useRef(),S=(0,ue.Z)(w,h.ref),Z=(0,B.Z)({},n,{anchorOrigin:i,anchorReference:s,elevation:d,marginThreshold:p,PaperProps:h,transformOrigin:m,TransitionComponent:g,transitionDuration:b,TransitionProps:v}),O=(e=>{const{classes:t}=e;return(0,ae.Z)({root:["root"],paper:["paper"]},Mn,t)})(Z),C=k.useCallback((()=>{if("anchorPosition"===s)return a;const e=Ln(o),t=(e&&1===e.nodeType?e:(0,bt.Z)(w.current).body).getBoundingClientRect();return{top:t.top+An(t,i.vertical),left:t.left+Dn(t,i.horizontal)}}),[o,i.horizontal,i.vertical,a,s]),j=k.useCallback((e=>({vertical:An(e,m.vertical),horizontal:Dn(e,m.horizontal)})),[m.horizontal,m.vertical]),E=k.useCallback((e=>{const t={width:e.offsetWidth,height:e.offsetHeight},n=j(t);if("none"===s)return{top:null,left:null,transformOrigin:$n(n)};const r=C();let i=r.top-n.vertical,a=r.left-n.horizontal;const l=i+t.height,c=a+t.width,u=(0,yt.Z)(Ln(o)),d=u.innerHeight-p,f=u.innerWidth-p;if(i<p){const e=i-p;i-=e,n.vertical+=e}else if(l>d){const e=l-d;i-=e,n.vertical+=e}if(a<p){const e=a-p;a-=e,n.horizontal+=e}else if(c>f){const e=c-f;a-=e,n.horizontal+=e}return{top:`${Math.round(i)}px`,left:`${Math.round(a)}px`,transformOrigin:$n(n)}}),[o,s,C,j,p]),[R,P]=k.useState(f),M=k.useCallback((()=>{const e=w.current;if(!e)return;const t=E(e);null!==t.top&&(e.style.top=t.top),null!==t.left&&(e.style.left=t.left),e.style.transformOrigin=t.transformOrigin,P(!0)}),[E]);k.useEffect((()=>{f&&M()})),k.useImperativeHandle(r,(()=>f?{updatePosition:()=>{M()}}:null),[f,M]),k.useEffect((()=>{if(!f)return;const e=(0,gt.Z)((()=>{M()})),t=(0,yt.Z)(o);return t.addEventListener("resize",e),()=>{e.clear(),t.removeEventListener("resize",e)}}),[o,f,M]);let N=b;"auto"!==b||g.muiSupportAuto||(N=void 0);const A=u||(o?(0,bt.Z)(Ln(o)).body:void 0);return(0,T.jsx)(In,(0,B.Z)({BackdropProps:{invisible:!0},className:(0,oe.Z)(O.root,c),container:A,open:f,ref:t,ownerState:Z},x,{children:(0,T.jsx)(g,(0,B.Z)({appear:!0,in:f,onEntering:(e,t)=>{y&&y(e,t),M()},onExited:()=>{P(!1)},timeout:N},v,{children:(0,T.jsx)(zn,(0,B.Z)({elevation:d},h,{ref:S,className:(0,oe.Z)(O.paper,h.className)},R?void 0:{style:(0,B.Z)({},h.style,{opacity:0})},{ownerState:Z,children:l}))}))}))})),Bn=(e=>{var t={};return c.d(t,e),t})({RuleList:()=>r.RuleList,create:()=>r.create,createRule:()=>r.createRule,default:()=>r.default,getDynamicStyles:()=>r.getDynamicStyles,hasCSSTOMSupport:()=>r.hasCSSTOMSupport,toCssValue:()=>r.toCssValue});function Fn(e={}){const{baseClasses:t,newClasses:n,Component:r}=e;if(!n)return t;const o=(0,B.Z)({},t);return Object.keys(n).forEach((e=>{n[e]&&(o[e]=`${t[e]} ${n[e]}`)})),o}const Wn={set:(e,t,n,r)=>{let o=e.get(t);o||(o=new Map,e.set(t,o)),o.set(n,r)},get:(e,t,n)=>{const r=e.get(t);return r?r.get(n):void 0},delete:(e,t,n)=>{e.get(t).delete(n)}},Vn=Wn,Kn=k.createContext(null);const Un="function"==typeof Symbol&&Symbol.for?Symbol.for("mui.nested"):"__THEME_NESTED__",Hn=["checked","disabled","error","focused","focusVisible","required","expanded","selected"];var qn=Date.now(),Gn="fnValues"+qn,Yn="fnStyle"+ ++qn;var Xn="@global",Jn=function(){function e(e,t,n){for(var r in this.type="global",this.at=Xn,this.isProcessed=!1,this.key=e,this.options=n,this.rules=new Bn.RuleList((0,B.Z)({},n,{parent:this})),t)this.rules.add(r,t[r]);this.rules.process()}var t=e.prototype;return t.getRule=function(e){return this.rules.get(e)},t.addRule=function(e,t,n){var r=this.rules.add(e,t,n);return r&&this.options.jss.plugins.onProcessRule(r),r},t.replaceRule=function(e,t,n){var r=this.rules.replace(e,t,n);return r&&this.options.jss.plugins.onProcessRule(r),r},t.indexOf=function(e){return this.rules.indexOf(e)},t.toString=function(e){return this.rules.toString(e)},e}(),Qn=function(){function e(e,t,n){this.type="global",this.at=Xn,this.isProcessed=!1,this.key=e,this.options=n;var r=e.substr(8);this.rule=n.jss.createRule(r,t,(0,B.Z)({},n,{parent:this}))}return e.prototype.toString=function(e){return this.rule?this.rule.toString(e):""},e}(),er=/\s*,\s*/g;function tr(e,t){for(var n=e.split(er),r="",o=0;o<n.length;o++)r+=t+" "+n[o].trim(),n[o+1]&&(r+=", ");return r}var nr=/\s*,\s*/g,rr=/&/g,or=/\$([\w-]+)/g;var ir=/[A-Z]/g,ar=/^ms-/,sr={};function lr(e){return"-"+e.toLowerCase()}const cr=function(e){if(sr.hasOwnProperty(e))return sr[e];var t=e.replace(ir,lr);return sr[e]=ar.test(t)?"-"+t:t};function ur(e){var t={};for(var n in e)t[0===n.indexOf("--")?n:cr(n)]=e[n];return e.fallbacks&&(Array.isArray(e.fallbacks)?t.fallbacks=e.fallbacks.map(ur):t.fallbacks=ur(e.fallbacks)),t}var dr=Bn.hasCSSTOMSupport&&CSS?CSS.px:"px",pr=Bn.hasCSSTOMSupport&&CSS?CSS.ms:"ms",fr=Bn.hasCSSTOMSupport&&CSS?CSS.percent:"%";function hr(e){var t=/(-[a-z])/g,n=function(e){return e[1].toUpperCase()},r={};for(var o in e)r[o]=e[o],r[o.replace(t,n)]=e[o];return r}var mr=hr({"animation-delay":pr,"animation-duration":pr,"background-position":dr,"background-position-x":dr,"background-position-y":dr,"background-size":dr,border:dr,"border-bottom":dr,"border-bottom-left-radius":dr,"border-bottom-right-radius":dr,"border-bottom-width":dr,"border-left":dr,"border-left-width":dr,"border-radius":dr,"border-right":dr,"border-right-width":dr,"border-top":dr,"border-top-left-radius":dr,"border-top-right-radius":dr,"border-top-width":dr,"border-width":dr,"border-block":dr,"border-block-end":dr,"border-block-end-width":dr,"border-block-start":dr,"border-block-start-width":dr,"border-block-width":dr,"border-inline":dr,"border-inline-end":dr,"border-inline-end-width":dr,"border-inline-start":dr,"border-inline-start-width":dr,"border-inline-width":dr,"border-start-start-radius":dr,"border-start-end-radius":dr,"border-end-start-radius":dr,"border-end-end-radius":dr,margin:dr,"margin-bottom":dr,"margin-left":dr,"margin-right":dr,"margin-top":dr,"margin-block":dr,"margin-block-end":dr,"margin-block-start":dr,"margin-inline":dr,"margin-inline-end":dr,"margin-inline-start":dr,padding:dr,"padding-bottom":dr,"padding-left":dr,"padding-right":dr,"padding-top":dr,"padding-block":dr,"padding-block-end":dr,"padding-block-start":dr,"padding-inline":dr,"padding-inline-end":dr,"padding-inline-start":dr,"mask-position-x":dr,"mask-position-y":dr,"mask-size":dr,height:dr,width:dr,"min-height":dr,"max-height":dr,"min-width":dr,"max-width":dr,bottom:dr,left:dr,top:dr,right:dr,inset:dr,"inset-block":dr,"inset-block-end":dr,"inset-block-start":dr,"inset-inline":dr,"inset-inline-end":dr,"inset-inline-start":dr,"box-shadow":dr,"text-shadow":dr,"column-gap":dr,"column-rule":dr,"column-rule-width":dr,"column-width":dr,"font-size":dr,"font-size-delta":dr,"letter-spacing":dr,"text-decoration-thickness":dr,"text-indent":dr,"text-stroke":dr,"text-stroke-width":dr,"word-spacing":dr,motion:dr,"motion-offset":dr,outline:dr,"outline-offset":dr,"outline-width":dr,perspective:dr,"perspective-origin-x":fr,"perspective-origin-y":fr,"transform-origin":fr,"transform-origin-x":fr,"transform-origin-y":fr,"transform-origin-z":fr,"transition-delay":pr,"transition-duration":pr,"vertical-align":dr,"flex-basis":dr,"shape-margin":dr,size:dr,gap:dr,grid:dr,"grid-gap":dr,"row-gap":dr,"grid-row-gap":dr,"grid-column-gap":dr,"grid-template-rows":dr,"grid-template-columns":dr,"grid-auto-rows":dr,"grid-auto-columns":dr,"box-shadow-x":dr,"box-shadow-y":dr,"box-shadow-blur":dr,"box-shadow-spread":dr,"font-line-height":dr,"text-shadow-x":dr,"text-shadow-y":dr,"text-shadow-blur":dr});function gr(e,t,n){if(null==t)return t;if(Array.isArray(t))for(var r=0;r<t.length;r++)t[r]=gr(e,t[r],n);else if("object"==typeof t)if("fallbacks"===e)for(var o in t)t[o]=gr(o,t[o],n);else for(var i in t)t[i]=gr(e+"-"+i,t[i],n);else if("number"==typeof t&&!1===isNaN(t)){var a=n[e]||mr[e];return!a||0===t&&a===dr?t.toString():"function"==typeof a?a(t).toString():""+t+a}return t}var br="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};const yr="object"===("undefined"==typeof window?"undefined":br(window))&&"object"===("undefined"==typeof document?"undefined":br(document))&&9===document.nodeType;var vr="",xr="",wr="",kr="",Sr=yr&&"ontouchstart"in document.documentElement;if(yr){var Zr={Moz:"-moz-",ms:"-ms-",O:"-o-",Webkit:"-webkit-"},Or=document.createElement("p").style;for(var Cr in Zr)if(Cr+"Transform"in Or){vr=Cr,xr=Zr[Cr];break}"Webkit"===vr&&"msHyphens"in Or&&(vr="ms",xr=Zr.ms,kr="edge"),"Webkit"===vr&&"-apple-trailing-word"in Or&&(wr="apple")}var jr=vr,Er=xr,Rr=wr,Pr=kr,Mr=Sr,Tr={noPrefill:["appearance"],supportedProperty:function(e){return"appearance"===e&&("ms"===jr?"-webkit-"+e:Er+e)}},Nr={noPrefill:["color-adjust"],supportedProperty:function(e){return"color-adjust"===e&&("Webkit"===jr?Er+"print-"+e:e)}},Ar=/[-\s]+(.)?/g;function Dr(e,t){return t?t.toUpperCase():""}function $r(e){return e.replace(Ar,Dr)}function Lr(e){return $r("-"+e)}var Ir,zr={noPrefill:["mask"],supportedProperty:function(e,t){if(!/^mask/.test(e))return!1;if("Webkit"===jr){var n="mask-image";if($r(n)in t)return e;if(jr+Lr(n)in t)return Er+e}return e}},_r={noPrefill:["text-orientation"],supportedProperty:function(e){return"text-orientation"===e&&("apple"!==Rr||Mr?e:Er+e)}},Br={noPrefill:["transform"],supportedProperty:function(e,t,n){return"transform"===e&&(n.transform?e:Er+e)}},Fr={noPrefill:["transition"],supportedProperty:function(e,t,n){return"transition"===e&&(n.transition?e:Er+e)}},Wr={noPrefill:["writing-mode"],supportedProperty:function(e){return"writing-mode"===e&&("Webkit"===jr||"ms"===jr&&"edge"!==Pr?Er+e:e)}},Vr={noPrefill:["user-select"],supportedProperty:function(e){return"user-select"===e&&("Moz"===jr||"ms"===jr||"apple"===Rr?Er+e:e)}},Kr={supportedProperty:function(e,t){return!!/^break-/.test(e)&&("Webkit"===jr?"WebkitColumn"+Lr(e)in t&&Er+"column-"+e:"Moz"===jr&&"page"+Lr(e)in t&&"page-"+e)}},Ur={supportedProperty:function(e,t){if(!/^(border|margin|padding)-inline/.test(e))return!1;if("Moz"===jr)return e;var n=e.replace("-inline","");return jr+Lr(n)in t&&Er+n}},Hr={supportedProperty:function(e,t){return $r(e)in t&&e}},qr={supportedProperty:function(e,t){var n=Lr(e);return"-"===e[0]||"-"===e[0]&&"-"===e[1]?e:jr+n in t?Er+e:"Webkit"!==jr&&"Webkit"+n in t&&"-webkit-"+e}},Gr={supportedProperty:function(e){return"scroll-snap"===e.substring(0,11)&&("ms"===jr?""+Er+e:e)}},Yr={supportedProperty:function(e){return"overscroll-behavior"===e&&("ms"===jr?Er+"scroll-chaining":e)}},Xr={"flex-grow":"flex-positive","flex-shrink":"flex-negative","flex-basis":"flex-preferred-size","justify-content":"flex-pack",order:"flex-order","align-items":"flex-align","align-content":"flex-line-pack"},Jr={supportedProperty:function(e,t){var n=Xr[e];return!!n&&jr+Lr(n)in t&&Er+n}},Qr={flex:"box-flex","flex-grow":"box-flex","flex-direction":["box-orient","box-direction"],order:"box-ordinal-group","align-items":"box-align","flex-flow":["box-orient","box-direction"],"justify-content":"box-pack"},eo=Object.keys(Qr),to=function(e){return Er+e},no={supportedProperty:function(e,t,n){var r=n.multiple;if(eo.indexOf(e)>-1){var o=Qr[e];if(!Array.isArray(o))return jr+Lr(o)in t&&Er+o;if(!r)return!1;for(var i=0;i<o.length;i++)if(!(jr+Lr(o[0])in t))return!1;return o.map(to)}return!1}},ro=[Tr,Nr,zr,_r,Br,Fr,Wr,Vr,Kr,Ur,Hr,qr,Gr,Yr,Jr,no],oo=ro.filter((function(e){return e.supportedProperty})).map((function(e){return e.supportedProperty})),io=ro.filter((function(e){return e.noPrefill})).reduce((function(e,t){return e.push.apply(e,E(t.noPrefill)),e}),[]),ao={};if(yr){Ir=document.createElement("p");var so=window.getComputedStyle(document.documentElement,"");for(var lo in so)isNaN(lo)||(ao[so[lo]]=so[lo]);io.forEach((function(e){return delete ao[e]}))}function co(e,t){if(void 0===t&&(t={}),!Ir)return e;if(null!=ao[e])return ao[e];"transition"!==e&&"transform"!==e||(t[e]=e in Ir.style);for(var n=0;n<oo.length&&(ao[e]=oo[n](e,Ir.style,t),!ao[e]);n++);try{Ir.style[e]=""}catch(e){return!1}return ao[e]}var uo,po={},fo={transition:1,"transition-property":1,"-webkit-transition":1,"-webkit-transition-property":1},ho=/(^\s*[\w-]+)|, (\s*[\w-]+)(?![^()]*\))/g;function mo(e,t,n){return"var"===t?"var":"all"===t?"all":"all"===n?", all":(t?co(t):", "+co(n))||t||n}function go(e,t){var n=t;if(!uo||"content"===e)return t;if("string"!=typeof n||!isNaN(parseInt(n,10)))return n;var r=e+n;if(null!=po[r])return po[r];try{uo.style[e]=n}catch(e){return po[r]=!1,!1}if(fo[e])n=n.replace(ho,mo);else if(""===uo.style[e]&&("-ms-flex"===(n=Er+n)&&(uo.style[e]="-ms-flexbox"),uo.style[e]=n,""===uo.style[e]))return po[r]=!1,!1;return uo.style[e]="",po[r]=n,po[r]}yr&&(uo=document.createElement("p"));const bo=(0,Bn.create)({plugins:[{onCreateRule:function(e,t,n){if("function"!=typeof t)return null;var r=(0,Bn.createRule)(e,{},n);return r[Yn]=t,r},onProcessStyle:function(e,t){if(Gn in t||Yn in t)return e;var n={};for(var r in e){var o=e[r];"function"==typeof o&&(delete e[r],n[r]=o)}return t[Gn]=n,e},onUpdate:function(e,t,n,r){var o=t,i=o[Yn];i&&(o.style=i(e)||{});var a=o[Gn];if(a)for(var s in a)o.prop(s,a[s](e),r)}},{onCreateRule:function(e,t,n){if(!e)return null;if(e===Xn)return new Jn(e,t,n);if("@"===e[0]&&"@global "===e.substr(0,8))return new Qn(e,t,n);var r=n.parent;return r&&("global"===r.type||r.options.parent&&"global"===r.options.parent.type)&&(n.scoped=!1),n.selector||!1!==n.scoped||(n.selector=e),null},onProcessRule:function(e,t){"style"===e.type&&t&&(function(e,t){var n=e.options,r=e.style,o=r?r[Xn]:null;if(o){for(var i in o)t.addRule(i,o[i],(0,B.Z)({},n,{selector:tr(i,e.selector)}));delete r[Xn]}}(e,t),function(e,t){var n=e.options,r=e.style;for(var o in r)if("@"===o[0]&&o.substr(0,7)===Xn){var i=tr(o.substr(7),e.selector);t.addRule(i,r[o],(0,B.Z)({},n,{selector:i})),delete r[o]}}(e,t))}},function(){function e(e,t){return function(n,r){var o=e.getRule(r)||t&&t.getRule(r);return o?o.selector:r}}function t(e,t){for(var n=t.split(nr),r=e.split(nr),o="",i=0;i<n.length;i++)for(var a=n[i],s=0;s<r.length;s++){var l=r[s];o&&(o+=", "),o+=-1!==l.indexOf("&")?l.replace(rr,a):a+" "+l}return o}function n(e,t,n){if(n)return(0,B.Z)({},n,{index:n.index+1});var r=e.options.nestingLevel;r=void 0===r?1:r+1;var o=(0,B.Z)({},e.options,{nestingLevel:r,index:t.indexOf(e)+1});return delete o.name,o}return{onProcessStyle:function(r,o,i){if("style"!==o.type)return r;var a,s,l=o,c=l.options.parent;for(var u in r){var d=-1!==u.indexOf("&"),p="@"===u[0];if(d||p){if(a=n(l,c,a),d){var f=t(u,l.selector);s||(s=e(c,i)),f=f.replace(or,s);var h=l.key+"-"+u;"replaceRule"in c?c.replaceRule(h,r[u],(0,B.Z)({},a,{selector:f})):c.addRule(h,r[u],(0,B.Z)({},a,{selector:f}))}else p&&c.addRule(u,{},a).addRule(l.key,r[u],{selector:l.selector});delete r[u]}}return r}}}(),{onProcessStyle:function(e){if(Array.isArray(e)){for(var t=0;t<e.length;t++)e[t]=ur(e[t]);return e}return ur(e)},onChangeValue:function(e,t,n){if(0===t.indexOf("--"))return e;var r=cr(t);return t===r?e:(n.prop(r,e),null)}},function(e){void 0===e&&(e={});var t=hr(e);return{onProcessStyle:function(e,n){if("style"!==n.type)return e;for(var r in e)e[r]=gr(r,e[r],t);return e},onChangeValue:function(e,n){return gr(n,e,t)}}}(),"undefined"==typeof window?null:function(){function e(t){for(var n in t){var r=t[n];if("fallbacks"===n&&Array.isArray(r))t[n]=r.map(e);else{var o=!1,i=co(n);i&&i!==n&&(o=!0);var a=!1,s=go(i,(0,Bn.toCssValue)(r));s&&s!==r&&(a=!0),(o||a)&&(o&&delete t[n],t[i||n]=s||r)}}return t}return{onProcessRule:function(e){if("keyframes"===e.type){var t=e;t.at=function(e){return"-"===e[1]||"ms"===jr?e:"@"+Er+"keyframes"+e.substr(10)}(t.at)}},onProcessStyle:function(t,n){return"style"!==n.type?t:e(t)},onChangeValue:function(e,t){return go(t,(0,Bn.toCssValue)(e))||e}}}(),(wo=function(e,t){return e.length===t.length?e>t?1:-1:e.length-t.length},{onProcessStyle:function(e,t){if("style"!==t.type)return e;for(var n={},r=Object.keys(e).sort(wo),o=0;o<r.length;o++)n[r[o]]=e[r[o]];return n}})]}),yo=function(e={}){const{disableGlobal:t=!1,productionPrefix:n="jss",seed:r=""}=e,o=""===r?"":`${r}-`;let i=0;const a=()=>(i+=1,i);return(e,i)=>{const s=i.options.name;if(s&&0===s.indexOf("Mui")&&!i.options.link&&!t){if(-1!==Hn.indexOf(e.key))return`Mui-${e.key}`;const t=`${o}${s}-${e.key}`;return i.options.theme[Un]&&""===r?`${t}-${a()}`:t}return`${o}${n}${a()}`}}(),vo={disableGeneration:!1,generateClassName:yo,jss:bo,sheetsCache:null,sheetsManager:new Map,sheetsRegistry:null},xo=k.createContext(vo);var wo;let ko=-1e9;var So=c(1290);const Zo=["variant"];function Oo(e){return 0===e.length}const Co={},jo=["name","classNamePrefix","Component","defaultTheme"];function Eo(e,t={}){const{name:n,classNamePrefix:r,Component:o,defaultTheme:i=Co}=t,a=(0,z.Z)(t,jo),s=function(e){const t="function"==typeof e;return{create:(n,r)=>{let o;try{o=t?e(n):e}catch(e){throw e}if(!r||!n.components||!n.components[r]||!n.components[r].styleOverrides&&!n.components[r].variants)return o;const i=n.components[r].styleOverrides||{},a=n.components[r].variants||[],s=(0,B.Z)({},o);return Object.keys(i).forEach((e=>{s[e]=(0,U.Z)(s[e]||{},i[e])})),a.forEach((e=>{const t=function(e){const{variant:t}=e,n=(0,z.Z)(e,Zo);let r=t||"";return Object.keys(n).sort().forEach((t=>{r+="color"===t?Oo(r)?e[t]:(0,So.Z)(e[t]):`${Oo(r)?t:(0,So.Z)(t)}${(0,So.Z)(e[t].toString())}`})),r}(e.props);s[t]=(0,U.Z)(s[t]||{},e.style)})),s},options:{}}}(e),l=n||r||"makeStyles";return s.options={index:(ko+=1,ko),name:n,meta:l,classNamePrefix:l},(e={})=>{const t=function(){var e;const t=k.useContext(Kn);return null!=(e=null==t?void 0:t.$$material)?e:t}()||i,r=(0,B.Z)({},k.useContext(xo),a),l=k.useRef(),c=k.useRef();!function(o,i){const a=k.useRef([]);let u;const d=k.useMemo((()=>({})),i);a.current!==d&&(a.current=d,u=(()=>{const o={name:n,state:{},stylesCreator:s,stylesOptions:r,theme:t};return function({state:e,theme:t,stylesOptions:n,stylesCreator:r,name:o},i){if(n.disableGeneration)return;let a=Vn.get(n.sheetsManager,r,t);a||(a={refs:0,staticSheet:null,dynamicStyles:null},Vn.set(n.sheetsManager,r,t,a));const s=(0,B.Z)({},r.options,n,{theme:t,flip:"boolean"==typeof n.flip?n.flip:"rtl"===t.direction});s.generateId=s.serverGenerateClassName||s.generateClassName;const l=n.sheetsRegistry;if(0===a.refs){let e;n.sheetsCache&&(e=Vn.get(n.sheetsCache,r,t));const i=r.create(t,o);e||(e=n.jss.createStyleSheet(i,(0,B.Z)({link:!1},s)),e.attach(),n.sheetsCache&&Vn.set(n.sheetsCache,r,t,e)),l&&l.add(e),a.staticSheet=e,a.dynamicStyles=(0,Bn.getDynamicStyles)(i)}if(a.dynamicStyles){const t=n.jss.createStyleSheet(a.dynamicStyles,(0,B.Z)({link:!0},s));t.update(i),t.attach(),e.dynamicSheet=t,e.classes=Fn({baseClasses:a.staticSheet.classes,newClasses:t.classes}),l&&l.add(t)}else e.classes=a.staticSheet.classes;a.refs+=1}(o,e),c.current=!1,l.current=o,()=>{!function({state:e,theme:t,stylesOptions:n,stylesCreator:r}){if(n.disableGeneration)return;const o=Vn.get(n.sheetsManager,r,t);o.refs-=1;const i=n.sheetsRegistry;0===o.refs&&(Vn.delete(n.sheetsManager,r,t),n.jss.removeStyleSheet(o.staticSheet),i&&i.remove(o.staticSheet)),e.dynamicSheet&&(n.jss.removeStyleSheet(e.dynamicSheet),i&&i.remove(e.dynamicSheet))}(o)}})()),k.useEffect((()=>()=>{u&&u()}),[d])}(0,[t,s]),k.useEffect((()=>{c.current&&function({state:e},t){e.dynamicSheet&&e.dynamicSheet.update(t)}(l.current,e),c.current=!0}));const u=function({state:e,stylesOptions:t},n,r){if(t.disableGeneration)return n||{};e.cacheClasses||(e.cacheClasses={value:null,lastProp:null,lastJSS:{}});let o=!1;return e.classes!==e.cacheClasses.lastJSS&&(e.cacheClasses.lastJSS=e.classes,o=!0),n!==e.cacheClasses.lastProp&&(e.cacheClasses.lastProp=n,o=!0),o&&(e.cacheClasses.value=Fn({baseClasses:e.cacheClasses.lastJSS,newClasses:n,Component:r})),e.cacheClasses.value}(l.current,e.classes,o);return u}}function Ro(e){return(0,Ie.Z)("MuiListItemIcon",e)}(0,Ze.Z)("MuiListItemIcon",["root","alignItemsFlexStart"]);const Po=["className"],Mo=(0,le.ZP)("div",{name:"MuiListItemIcon",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.root,"flex-start"===n.alignItems&&t.alignItemsFlexStart]}})((({theme:e,ownerState:t})=>(0,B.Z)({minWidth:56,color:(e.vars||e).palette.action.active,flexShrink:0,display:"inline-flex"},"flex-start"===t.alignItems&&{marginTop:8}))),To=k.forwardRef((function(e,t){const n=(0,ce.Z)({props:e,name:"MuiListItemIcon"}),{className:r}=n,o=(0,z.Z)(n,Po),i=k.useContext(at),a=(0,B.Z)({},n,{alignItems:i.alignItems}),s=(e=>{const{alignItems:t,classes:n}=e,r={root:["root","flex-start"===t&&"alignItemsFlexStart"]};return(0,ae.Z)(r,Ro,n)})(a);return(0,T.jsx)(Mo,(0,B.Z)({className:(0,oe.Z)(s.root,r),ownerState:a,ref:t},o))}));function No(e){return(0,Ie.Z)("MuiTypography",e)}(0,Ze.Z)("MuiTypography",["root","h1","h2","h3","h4","h5","h6","subtitle1","subtitle2","body1","body2","inherit","button","caption","overline","alignLeft","alignRight","alignCenter","alignJustify","noWrap","gutterBottom","paragraph"]);const Ao=["align","className","component","gutterBottom","noWrap","paragraph","variant","variantMapping"],Do=(0,le.ZP)("span",{name:"MuiTypography",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[t.root,n.variant&&t[n.variant],"inherit"!==n.align&&t[`align${(0,Ve.Z)(n.align)}`],n.noWrap&&t.noWrap,n.gutterBottom&&t.gutterBottom,n.paragraph&&t.paragraph]}})((({theme:e,ownerState:t})=>(0,B.Z)({margin:0},t.variant&&e.typography[t.variant],"inherit"!==t.align&&{textAlign:t.align},t.noWrap&&{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},t.gutterBottom&&{marginBottom:"0.35em"},t.paragraph&&{marginBottom:16}))),$o={h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",subtitle1:"h6",subtitle2:"h6",body1:"p",body2:"p",inherit:"p"},Lo={primary:"primary.main",textPrimary:"text.primary",secondary:"secondary.main",textSecondary:"text.secondary",error:"error.main"},Io=k.forwardRef((function(e,t){const n=(0,ce.Z)({props:e,name:"MuiTypography"}),r=(e=>Lo[e]||e)(n.color),o=G((0,B.Z)({},n,{color:r})),{align:i="inherit",className:a,component:s,gutterBottom:l=!1,noWrap:c=!1,paragraph:u=!1,variant:d="body1",variantMapping:p=$o}=o,f=(0,z.Z)(o,Ao),h=(0,B.Z)({},o,{align:i,color:r,className:a,component:s,gutterBottom:l,noWrap:c,paragraph:u,variant:d,variantMapping:p}),m=s||(u?"p":p[d]||$o[d])||"span",g=(e=>{const{align:t,gutterBottom:n,noWrap:r,paragraph:o,variant:i,classes:a}=e,s={root:["root",i,"inherit"!==e.align&&`align${(0,Ve.Z)(t)}`,n&&"gutterBottom",r&&"noWrap",o&&"paragraph"]};return(0,ae.Z)(s,No,a)})(h);return(0,T.jsx)(Do,(0,B.Z)({as:m,ref:t,ownerState:h,className:(0,oe.Z)(g.root,a)},f))})),zo=Io;function _o(e){return(0,Ie.Z)("MuiListItemText",e)}const Bo=(0,Ze.Z)("MuiListItemText",["root","multiline","dense","inset","primary","secondary"]),Fo=["children","className","disableTypography","inset","primary","primaryTypographyProps","secondary","secondaryTypographyProps"],Wo=(0,le.ZP)("div",{name:"MuiListItemText",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[{[`& .${Bo.primary}`]:t.primary},{[`& .${Bo.secondary}`]:t.secondary},t.root,n.inset&&t.inset,n.primary&&n.secondary&&t.multiline,n.dense&&t.dense]}})((({ownerState:e})=>(0,B.Z)({flex:"1 1 auto",minWidth:0,marginTop:4,marginBottom:4},e.primary&&e.secondary&&{marginTop:6,marginBottom:6},e.inset&&{paddingLeft:56}))),Vo=k.forwardRef((function(e,t){const n=(0,ce.Z)({props:e,name:"MuiListItemText"}),{children:r,className:o,disableTypography:i=!1,inset:a=!1,primary:s,primaryTypographyProps:l,secondary:c,secondaryTypographyProps:u}=n,d=(0,z.Z)(n,Fo),{dense:p}=k.useContext(at);let f=null!=s?s:r,h=c;const m=(0,B.Z)({},n,{disableTypography:i,inset:a,primary:!!f,secondary:!!h,dense:p}),g=(e=>{const{classes:t,inset:n,primary:r,secondary:o,dense:i}=e,a={root:["root",n&&"inset",i&&"dense",r&&o&&"multiline"],primary:["primary"],secondary:["secondary"]};return(0,ae.Z)(a,_o,t)})(m);return null==f||f.type===zo||i||(f=(0,T.jsx)(zo,(0,B.Z)({variant:p?"body2":"body1",className:g.primary,component:null!=l&&l.variant?void 0:"span",display:"block"},l,{children:f}))),null==h||h.type===zo||i||(h=(0,T.jsx)(zo,(0,B.Z)({variant:"body2",className:g.secondary,color:"text.secondary",display:"block"},u,{children:h}))),(0,T.jsxs)(Wo,(0,B.Z)({className:(0,oe.Z)(g.root,o),ownerState:m,ref:t},d,{children:[f,h]}))})),Ko=(e=>{var t={};return c.d(t,e),t})({ListItem:()=>o.ListItem,ListItemIcon:()=>o.ListItemIcon,ListItemText:()=>o.ListItemText,ListSubheader:()=>o.ListSubheader,Switch:()=>o.Switch});var Uo=Eo((function(e){return{root:{"&.MuiListItem-root":{"@media (min-width: 1025px)":{paddingTop:2,paddingBottom:2}},"& .MuiTypography-body1":{fontSize:14}},listItemIcon:{minWidth:40}}}));const Ho=function(e){var t=e.groupIndex,n=e.itemIndex,r=e.label,o=e.selected,i=void 0!==o&&o,a=e.icon,s=e.onClick,l=Uo();return(0,T.jsxs)(Ko.ListItem,{button:!0,disableRipple:!0,className:l.root,onClick:function(e){return function(e,t,n){e.stopPropagation(),null==s||s(t,n)}(e,t,n)},children:[(0,T.jsx)(To,{className:l.listItemIcon,children:a}),(0,T.jsx)(Vo,{primary:r}),i&&(0,T.jsx)(A,{})]})};var qo=["optionGroups","onOptionClick","action","children","actionTitle"];function Go(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function Yo(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?Go(Object(n),!0).forEach((function(t){y(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Go(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var Xo=Eo((function(){return{root:{zIndex:"60000 !important","& .MuiPaper-root":{backgroundColor:"#182026",color:"#fff",borderRadius:12,minWidth:215},"& .MuiList-root":{padding:0},"& .MuiDivider-root":{backgroundColor:"#444D5B"},"& .MuiListItem-root:hover":{backgroundColor:"#3D4A58"},"& .MuiListSubheader-root":{backgroundColor:"transparent",color:"#A7B6C2",fontSize:11,textTransform:"uppercase","@media (min-width: 1025px)":{lineHeight:"32px"}},"& .MuiListItemIcon-root":{minWidth:40},"& button":{color:"#1B9AF0",fontWeight:700,padding:16,"@media (min-width: 1025px)":{padding:12}}},list:{paddingBottom:0},ul:{padding:0}}})),Jo=(0,k.forwardRef)((function(e,t){var n=e.optionGroups,r=e.onOptionClick,o=e.action,i=e.children,a=e.actionTitle,s=_(e,qo),l=Xo(),c=(0,k.useMemo)((function(){return a||(0,T.jsx)("span",{children:"Roll"})}),[a]);return(0,T.jsx)(_n,Yo(Yo({ref:t},s),{},{className:l.root,children:(0,T.jsxs)(re,{className:l.root,children:[(0,T.jsx)(ut,{subheader:(0,T.jsx)("li",{className:l.list}),children:n.map((function(e,t){return(0,T.jsxs)(k.Fragment,{children:[(0,T.jsx)("li",{children:(0,T.jsxs)("ul",{className:l.ul,children:[(0,T.jsx)(mt,{children:e.label}),e.options.map((function(e,n){return(0,T.jsx)(Ho,{groupIndex:t,itemIndex:n,label:e.label,icon:e.icon,selected:e.selected,onClick:r},e.label)}))]})}),(0,T.jsx)(it,{})]},e.label)}))}),i,o&&(0,T.jsxs)(T.Fragment,{children:[(0,T.jsx)(it,{}),(0,T.jsx)(et,{disableRipple:!0,fullWidth:!0,onClick:function(e){return function(e){e.stopPropagation(),o()}(e)},children:c})]})]})}))})),Qo=function(){return(0,T.jsx)(M.Z,{children:(0,T.jsx)("path",{d:"M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM7.07 18.28C7.5 17.38 10.12 16.5 12 16.5C13.88 16.5 16.51 17.38 16.93 18.28C15.57 19.36 13.86 20 12 20C10.14 20 8.43 19.36 7.07 18.28ZM18.36 16.83C16.93 15.09 13.46 14.5 12 14.5C10.54 14.5 7.07 15.09 5.64 16.83C4.62 15.49 4 13.82 4 12C4 7.59 7.59 4 12 4C16.41 4 20 7.59 20 12C20 13.82 19.38 15.49 18.36 16.83ZM12 6C10.06 6 8.5 7.56 8.5 9.5C8.5 11.44 10.06 13 12 13C13.94 13 15.5 11.44 15.5 9.5C15.5 7.56 13.94 6 12 6ZM12 11C11.17 11 10.5 10.33 10.5 9.5C10.5 8.67 11.17 8 12 8C12.83 8 13.5 8.67 13.5 9.5C13.5 10.33 12.83 11 12 11Z",fill:"#A7B6C2"})})},ei=function(e){return e.d4="d4",e.d6="d6",e.d8="d8",e.d10="d10",e.d12="d12",e.d20="d20",e.d100="d100",e}({});function ti(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function ni(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?ti(Object(n),!0).forEach((function(t){y(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):ti(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}ei.d20,ei.d12,ei.d10,ei.d100,ei.d8,ei.d6,ei.d4;var ri=function(e,t){var n=e.substring(1);return t?n:parseInt(n)};function oi(e){var t,n,r="";if("string"==typeof e||"number"==typeof e)r+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(n=oi(e[t]))&&(r&&(r+=" "),r+=n)}else for(n in e)e[n]&&(r&&(r+=" "),r+=n);return r}function ii(){for(var e,t,n=0,r="",o=arguments.length;n<o;n++)(e=arguments[n])&&(t=oi(e))&&(r&&(r+=" "),r+=t);return r}const ai=ii,si=(e=>{var t={};return c.d(t,e),t})({ExpandLessRounded:()=>i.ExpandLessRounded,ExpandMoreRounded:()=>i.ExpandMoreRounded,RestartAlt:()=>i.RestartAlt});var li=["diceNotation","onUpdate","className"];function ci(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function ui(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?ci(Object(n),!0).forEach((function(t){y(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):ci(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}const di=function(e){var t,n=e.diceNotation,r=e.onUpdate,o=e.className,i=_(e,li),a=function(){return"string"!=typeof n?n:v.DiceNotation.parseDiceNotation(n)},s=j((0,k.useState)(a()),2),l=s[0],c=s[1],u=l.set,d=j((0,k.useState)(!1),2),p=d[0],f=d[1],h=(0,k.useMemo)((function(){return l.toDiceNotationString()===a().toDiceNotationString()}),[l,n]),m=function(e,t){c((function(n){var o=new v.DiceNotation(n.set,n.constant),i=Math.max(1,o.set[e].count+t);return o.set[e].count=i,null==r||r(o),o}))},g=function(e,t){c((function(n){var o,i,a,s,l,c=new v.DiceNotation(n.set,n.constant);return c.set[e].dieType=(o=t,i=c.set[e].dieType,s=(a=Object.keys(ei)).indexOf(i),l=Math.max(Math.min(a.length-1,s+o),0),ei[Object.keys(ei)[l]]),null==r||r(c),c}))},b=(0,k.useCallback)((function(e){null==e||e.stopPropagation();var t=a();c(t),null==r||r(t)}),[]),y=function(e){return ai(["set-customizer-control-button",e&&"set-customizer-disabled-icon"])},x=function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],t=j((0,k.useState)(1),2),n=t[0],r=t[1];return ni(ni({},(0,k.useMemo)((function(){var t=Object.keys(ei);return{maxDieSize:ri(ei[Object.keys(ei)[t.length-1]],e),minDieSize:ri(ei[Object.keys(ei)[0]],e)}}),[n])),{},{forceUpdate:function(){return r((function(e){return++e}))}})}(!0),w=x.minDieSize,S=x.maxDieSize;return!!u.length&&(0,T.jsxs)("div",ui(ui({className:ai([o,"customizer-container"])},i),{},{children:[(0,T.jsxs)(Ko.ListItem,{className:"customizer-header",children:[(0,T.jsx)(Ko.ListItemIcon,{children:(0,T.jsx)(si.RestartAlt,{className:(t=h,ai([t&&"customizer-disabled-icon","customizer-blue-control"])),onClick:b})}),(0,T.jsx)(Ko.ListItemText,{primary:"Adjust Dice"}),(0,T.jsx)("div",{className:"customizer-active-toggle",children:(0,T.jsx)(Ko.Switch,{onClick:function(e){e.stopPropagation();var t=a();f((function(e){return e||(t=l,b()),c(t),null==r||r(t),!e}))}})})]}),p&&(0,T.jsx)("ul",{className:"customizer-dice-sets",children:u.map((function(e,t){return function(e,t){var n=j(e.toString().split("d"),2),r=n[0],o=n[1],i=o===S,a=o===w,s="1"===r;return(0,T.jsxs)("div",{className:"set-customizer-dice-set",children:[(0,T.jsxs)("div",{className:"set-customizer-control",children:[(0,T.jsx)(si.ExpandLessRounded,{className:y(!1),onClick:function(){return m(t,1)}}),(0,T.jsx)(Ko.ListSubheader,{children:"Quantity"}),(0,T.jsx)(si.ExpandMoreRounded,{className:y(s),onClick:function(){return m(t,-1)}})]}),(0,T.jsx)(Ko.ListItemText,{className:"set-customizer-text",primary:e.toString()}),(0,T.jsxs)("div",{className:"set-customizer-control",children:[(0,T.jsx)(si.ExpandLessRounded,{className:y(i),onClick:function(){return g(t,1)}}),(0,T.jsx)(Ko.ListSubheader,{children:"Die Type"}),(0,T.jsx)(si.ExpandMoreRounded,{className:y(a),onClick:function(){return g(t,-1)}})]})]},"dice-set-".concat(t))}(e,t)}))})]}))};function pi(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function fi(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?pi(Object(n),!0).forEach((function(t){y(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):pi(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var hi={Everyone:(0,T.jsx)(L,{}),Self:(0,T.jsx)(Qo,{}),"Dungeon Master":(0,T.jsx)($,{})},mi=(0,k.forwardRef)((function(e,t){var n=e.useCustomizableDiceNotation,r=e.diceNotation,o=e.rollTargetDefault,i=e.rollTargetOptions,a=e.rollKind,s=e.rollType,l=e.rollContext,c=e.rollAction,u=e.onRollResults,d=e.showDiceNotification,p=e.onClose,f=e.userId,h=e.anchorEl,m=j((0,k.useState)(o),2),g=m[0],b=m[1],y=j((0,k.useState)(null!=a?a:v.RollKind.None),2),x=y[0],w=y[1],S=j((0,k.useState)("string"==typeof r?v.DiceNotation.parseDiceNotation(r):r),2),O=S[0],C=S[1],R=(0,k.useMemo)((function(){return function(e,t,n,r){return[].concat(E((null==e?void 0:e.length)>0?[{label:"Send To:",options:e.map((function(e){var n;return{label:e.displayValue,icon:null!==(n=hi[e.displayValue])&&void 0!==n?n:null,selected:e.id===t.id}}))}]:[]),[n===v.RollType.Damage?{label:"Roll As:",options:[{label:"Crit Damage",icon:null,selected:r===v.RollKind.CriticalHit},{label:"Flat Roll",icon:null,selected:r===v.RollKind.None}]}:{label:"Roll With:",options:[{label:"Advantage",icon:(0,T.jsx)(N,{}),selected:r===v.RollKind.Advantage},{label:"Flat (One Die)",icon:(0,T.jsx)(I,{}),selected:r===v.RollKind.None},{label:"Disadvantage",icon:(0,T.jsx)(D,{}),selected:r===v.RollKind.Disadvantage}]}])}(i,g,s,x)}),[i,g,s,x]),M=(0,k.useCallback)((function(e,t){"Send To:"===R[e].label?b(i[t]):w((function(){switch(R[e].options[t].label){case"Advantage":return v.RollKind.Advantage;case"Disadvantage":return v.RollKind.Disadvantage;case"Crit Damage":return v.RollKind.CriticalHit;default:return v.RollKind.None}}))}),[R,b,i,w]),A=j((0,k.useState)(0),2),$=(A[0],A[1]),L=(0,k.useCallback)((function(e){n&&(C(e),$((function(e){return++e})))}),[n,C,$]),z=function(){p()},_=function(e){v.Analytics.log(v.EventCategories.DICE_Menu,v.EventActions.DICE_Menu_Roll);var t={action:c,rolls:[new v.RollRequestRoll(O,s,x)]};e.roll(t).then((function(e){d&&v.Dice.showDiceNotification(e,f),null==u||u(e)})).catch((function(e){return console.log(e)})),b(o),w(v.RollKind.None),z()},B=(0,k.useCallback)(Z(P().mark((function e(){var t,n,r;return P().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,v.Dice.getRoller(fi(fi({},l),{},{messageScope:null!==(t=null==g?void 0:g.messageScope)&&void 0!==t?t:l.messageScope,messageTarget:null!==(n=null==g?void 0:g.messageTarget)&&void 0!==n?n:l.messageTarget}));case 2:r=e.sent,_(r),z();case 5:case"end":return e.stop()}}),e)}))),[l,g,_,z]),F=(0,k.useMemo)((function(){var e,t=O,n=O.set.length?(0,T.jsx)("div",{className:"dice-icon-box",children:(e=O,e.set.map((function(e){return ii(["final-notation-icon","dice-icon-die","dice-icon-die--".concat(e.dieType)])}))).map((function(e,t){return(0,T.jsx)("div",{className:e},"icon-class-".concat(t))}))}):null;switch(x){case v.RollKind.Advantage:n=(0,T.jsx)(N,{});break;case v.RollKind.Disadvantage:n=(0,T.jsx)(D,{});break;case v.RollKind.CriticalHit:t=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:2,n=v.DiceNotation.parseDiceNotation(e.toDiceNotationString());return n.set.forEach((function(e){e.count*=t})),n}(O);break;case v.RollKind.None:s!==v.RollType.Damage&&(n=(0,T.jsx)(I,{}))}var r=t.toDiceNotationString().replace(/([+-])/g," $1 ");return(0,T.jsxs)("div",{className:"roll-box",children:[n,(0,T.jsx)("span",{className:"roll-label",children:"Roll"}),(0,T.jsx)("span",{className:"roll-notation",children:r})]})}),[O,x]);return(0,T.jsx)(Jo,{ref:t,id:"options-menu",open:!0,onClose:function(e,t){e.stopPropagation(),e.preventDefault(),p()},anchorEl:h,anchorOrigin:{vertical:"center",horizontal:"right"},transformOrigin:{vertical:"center",horizontal:"left"},optionGroups:R,onOptionClick:M,action:B,disableScrollLock:!0,actionTitle:F,children:n&&(0,T.jsx)(di,{diceNotation:r,onUpdate:L})})}));function gi(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function bi(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?gi(Object(n),!0).forEach((function(t){y(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):gi(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function yi(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function vi(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?yi(Object(n),!0).forEach((function(t){y(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):yi(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var xi=c(3655);function wi(e){return(0,Ie.Z)("MuiButtonGroup",e)}const ki=(0,Ze.Z)("MuiButtonGroup",["root","contained","outlined","text","disableElevation","disabled","fullWidth","vertical","grouped","groupedHorizontal","groupedVertical","groupedText","groupedTextHorizontal","groupedTextVertical","groupedTextPrimary","groupedTextSecondary","groupedOutlined","groupedOutlinedHorizontal","groupedOutlinedVertical","groupedOutlinedPrimary","groupedOutlinedSecondary","groupedContained","groupedContainedHorizontal","groupedContainedVertical","groupedContainedPrimary","groupedContainedSecondary"]),Si=["children","className","color","component","disabled","disableElevation","disableFocusRipple","disableRipple","fullWidth","orientation","size","variant"],Zi=(0,le.ZP)("div",{name:"MuiButtonGroup",slot:"Root",overridesResolver:(e,t)=>{const{ownerState:n}=e;return[{[`& .${ki.grouped}`]:t.grouped},{[`& .${ki.grouped}`]:t[`grouped${(0,Ve.Z)(n.orientation)}`]},{[`& .${ki.grouped}`]:t[`grouped${(0,Ve.Z)(n.variant)}`]},{[`& .${ki.grouped}`]:t[`grouped${(0,Ve.Z)(n.variant)}${(0,Ve.Z)(n.orientation)}`]},{[`& .${ki.grouped}`]:t[`grouped${(0,Ve.Z)(n.variant)}${(0,Ve.Z)(n.color)}`]},t.root,t[n.variant],!0===n.disableElevation&&t.disableElevation,n.fullWidth&&t.fullWidth,"vertical"===n.orientation&&t.vertical]}})((({theme:e,ownerState:t})=>(0,B.Z)({display:"inline-flex",borderRadius:(e.vars||e).shape.borderRadius},"contained"===t.variant&&{boxShadow:(e.vars||e).shadows[2]},t.disableElevation&&{boxShadow:"none"},t.fullWidth&&{width:"100%"},"vertical"===t.orientation&&{flexDirection:"column"},{[`& .${ki.grouped}`]:(0,B.Z)({minWidth:40,"&:not(:first-of-type)":(0,B.Z)({},"horizontal"===t.orientation&&{borderTopLeftRadius:0,borderBottomLeftRadius:0},"vertical"===t.orientation&&{borderTopRightRadius:0,borderTopLeftRadius:0},"outlined"===t.variant&&"horizontal"===t.orientation&&{marginLeft:-1},"outlined"===t.variant&&"vertical"===t.orientation&&{marginTop:-1}),"&:not(:last-of-type)":(0,B.Z)({},"horizontal"===t.orientation&&{borderTopRightRadius:0,borderBottomRightRadius:0},"vertical"===t.orientation&&{borderBottomRightRadius:0,borderBottomLeftRadius:0},"text"===t.variant&&"horizontal"===t.orientation&&{borderRight:e.vars?`1px solid rgba(${e.vars.palette.common.onBackgroundChannel} / 0.23)`:"1px solid "+("light"===e.palette.mode?"rgba(0, 0, 0, 0.23)":"rgba(255, 255, 255, 0.23)"),[`&.${ki.disabled}`]:{borderRight:`1px solid ${(e.vars||e).palette.action.disabled}`}},"text"===t.variant&&"vertical"===t.orientation&&{borderBottom:e.vars?`1px solid rgba(${e.vars.palette.common.onBackgroundChannel} / 0.23)`:"1px solid "+("light"===e.palette.mode?"rgba(0, 0, 0, 0.23)":"rgba(255, 255, 255, 0.23)"),[`&.${ki.disabled}`]:{borderBottom:`1px solid ${(e.vars||e).palette.action.disabled}`}},"text"===t.variant&&"inherit"!==t.color&&{borderColor:e.vars?`rgba(${e.vars.palette[t.color].mainChannel} / 0.5)`:(0,se.Fq)(e.palette[t.color].main,.5)},"outlined"===t.variant&&"horizontal"===t.orientation&&{borderRightColor:"transparent"},"outlined"===t.variant&&"vertical"===t.orientation&&{borderBottomColor:"transparent"},"contained"===t.variant&&"horizontal"===t.orientation&&{borderRight:`1px solid ${(e.vars||e).palette.grey[400]}`,[`&.${ki.disabled}`]:{borderRight:`1px solid ${(e.vars||e).palette.action.disabled}`}},"contained"===t.variant&&"vertical"===t.orientation&&{borderBottom:`1px solid ${(e.vars||e).palette.grey[400]}`,[`&.${ki.disabled}`]:{borderBottom:`1px solid ${(e.vars||e).palette.action.disabled}`}},"contained"===t.variant&&"inherit"!==t.color&&{borderColor:(e.vars||e).palette[t.color].dark},{"&:hover":(0,B.Z)({},"outlined"===t.variant&&"horizontal"===t.orientation&&{borderRightColor:"currentColor"},"outlined"===t.variant&&"vertical"===t.orientation&&{borderBottomColor:"currentColor"})}),"&:hover":(0,B.Z)({},"contained"===t.variant&&{boxShadow:"none"})},"contained"===t.variant&&{boxShadow:"none"})}))),Oi=k.forwardRef((function(e,t){const n=(0,ce.Z)({props:e,name:"MuiButtonGroup"}),{children:r,className:o,color:i="primary",component:a="div",disabled:s=!1,disableElevation:l=!1,disableFocusRipple:c=!1,disableRipple:u=!1,fullWidth:d=!1,orientation:p="horizontal",size:f="medium",variant:h="outlined"}=n,m=(0,z.Z)(n,Si),g=(0,B.Z)({},n,{color:i,component:a,disabled:s,disableElevation:l,disableFocusRipple:c,disableRipple:u,fullWidth:d,orientation:p,size:f,variant:h}),b=(e=>{const{classes:t,color:n,disabled:r,disableElevation:o,fullWidth:i,orientation:a,variant:s}=e,l={root:["root",s,"vertical"===a&&"vertical",i&&"fullWidth",o&&"disableElevation"],grouped:["grouped",`grouped${(0,Ve.Z)(a)}`,`grouped${(0,Ve.Z)(s)}`,`grouped${(0,Ve.Z)(s)}${(0,Ve.Z)(a)}`,`grouped${(0,Ve.Z)(s)}${(0,Ve.Z)(n)}`,r&&"disabled"]};return(0,ae.Z)(l,wi,t)})(g),y=k.useMemo((()=>({className:b.grouped,color:i,disabled:s,disableElevation:l,disableFocusRipple:c,disableRipple:u,fullWidth:d,size:f,variant:h})),[i,s,l,c,u,d,f,h,b.grouped]);return(0,T.jsx)(Zi,(0,B.Z)({as:a,role:"group",className:(0,oe.Z)(b.root,o),ref:t,ownerState:g},m,{children:(0,T.jsx)(He.Provider,{value:y,children:r})}))})),Ci=Oi;var ji=c(1346),Ei=c.n(ji);const Ri=(e=>{var t={};return c.d(t,e),t})({default:()=>a.default}),Pi=function(e){var t,n=e.onClick,r=e.onContextMenu,o=e.icon,i=e.count,a=e.selected;return(0,T.jsxs)("div",{className:(t=["dice-die-button"],a&&t.push("dice-die-button--selected"),t.join(" ")),"data-dice":"d".concat(o),onClick:function(){return n()},onContextMenu:function(e){e.preventDefault(),r()},onSelect:function(){},children:[(0,T.jsx)("span",{className:"dice-icon-die dice-icon-die--d".concat(o)}),0!==i?(0,T.jsx)("div",{className:"dice-die-button__count",children:i}):"",(0,T.jsxs)("div",{className:"dice-die-button__tooltip",children:[(0,T.jsx)("div",{className:"dice-die-button__tooltip__pip"}),"d".concat(o)]})]})},Mi=function(e){var t=e.className,n=e.onClick;return(0,T.jsx)("div",{className:"".concat(t," dice-toolbar__dropdown-die"),onClick:function(){return n()},children:(0,T.jsx)("span",{className:"dice-icon-die dice-icon-die--d20"})})};function Ti(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function Ni(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?Ti(Object(n),!0).forEach((function(t){y(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ti(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}const Ai=function(e){var t=e.themeColor,n=e.rollContext,r=e.userId,o=e.rollTargetOptions,i=e.rollTargetDefault,a=j((0,k.useState)(!1),2),s=a[0],l=a[1],c=j((0,k.useState)(!1),2),u=c[0],d=c[1],p=j((0,k.useState)({d20:0,d12:0,d10:0,d100:0,d8:0,d6:0,d4:0}),2),f=p[0],h=p[1],m=j((0,k.useState)(null),2),g=m[0],b=m[1],x=j((0,k.useState)(!1),2),w=x[0],S=x[1],Z=function(e){var t,r,o,a;return v.Dice.getRoller(Ni(Ni({},n),{},{messageScope:null!==(t=null!==(r=null==e?void 0:e.messageScope)&&void 0!==r?r:null==i?void 0:i.messageScope)&&void 0!==t?t:n.messageScope,messageTarget:null!==(o=null!==(a=null==e?void 0:e.messageTarget)&&void 0!==a?a:null==i?void 0:i.messageTarget)&&void 0!==o?o:n.messageTarget}))};(0,k.useEffect)((function(){return P(),function(){return R()}}),[t]);var O,C=new v.Logger({constructor:{name:"DiceToolbar"}}),E=null,R=function(){E&&(Bn.default.removeStyleSheet(E),E=null)},P=function(){var e=null!=t?t:"#E40712",n=new(Ei())(e).darken(.2).rgb().string(),r=(0,Ri.default)(),o=document.getElementById("site");o&&(r=Ni(Ni({},r),{},{insertionPoint:o})),Bn.default.setup(r),(E=Bn.default.createStyleSheet({})).addRules({"@global":{".dice-toolbar":{"--dice-color":e,"--dice-color-hover":n}}}),E.attach()},M=function(){h((function(e){return Object.keys(e).reduce((function(e,t){return Ni(Ni({},e),{},y({},t,0))}),{})}))},N=function(e){v.Analytics.log(v.EventCategories.DICE_Toolbar,v.EventActions.DICE_Roll);var t=Object.keys(f).filter((function(e){return 0!==f[e]})).map((function(e){return f[e]+e})).join("+");if(null!==t&&""!==t){var n={action:"custom",rolls:[new v.RollRequestRoll(t)]};e.roll(n).then((function(e){return function(e){v.Dice.showDiceNotification(e,r)}(e)})).catch((function(e){return C.log(e.message)}))}M(),d(!1)},A=Boolean(g),D=A?"options-menu":void 0,I=function(e){switch(e){case"Everyone":return(0,T.jsx)(L,{});case"Self":return(0,T.jsx)(Qo,{});case"Dungeon Master":return(0,T.jsx)($,{});default:return null}},z=function(){S(!w)};return(0,T.jsxs)("div",{className:["dice-toolbar",Object.keys(f).map((function(e){return f[e]})).reduce((function(e,t){return e+t}))>0?"rollable":"",w?"dice-toolbar--hover":""].join(" "),ref:function(e){O=e},children:[(0,T.jsxs)("div",{className:["dice-toolbar__dropdown",u?"dice-toolbar__dropdown-selected":""].join(" "),children:[(0,T.jsx)(Mi,{className:w?"dice-toolbar--hover":"",onClick:function(){u?v.Analytics.log(v.EventCategories.DICE_Toolbar,v.EventActions.DICE_Toolbar_Close):v.Analytics.log(v.EventCategories.DICE_Toolbar,v.EventActions.DICE_Toolbar_Open),d((function(e){return!e}));var e=(0,vt.findDOMNode)(O).getBoundingClientRect();l(e.bottom+440>window.innerHeight),u&&M()}}),(0,T.jsxs)(Ci,{disableRipple:!0,className:"dice-toolbar__target","aria-label":"roll actions",children:[(0,T.jsx)(et,{onClick:function(){Z().then((function(e){return N(e)}))},onMouseEnter:z,onMouseLeave:z,children:(0,T.jsxs)(re,{display:"flex",flexDirection:"column",alignItems:"start",justifyContent:"start",children:[i&&(0,T.jsxs)(zo,{className:"dice-toolbar__target-user",children:["To: ",i.displayValue]}),(0,T.jsx)(zo,{className:"dice-toolbar__target-roll",children:"Roll"})]})}),(null==o?void 0:o.length)>0&&(0,T.jsx)(et,{size:"small","aria-controls":A?"roll-target-menu":void 0,"aria-expanded":A?"true":void 0,"aria-label":"select roll target","aria-haspopup":"menu",className:"dice-toolbar__target-menu-button",onClick:function(e){b(g?null:e.currentTarget)},children:(0,T.jsx)(xi.Z,{})})]}),(0,T.jsx)("div",{style:{display:u?"block":"none"},className:s?"dice-toolbar__dropdown-top":"",children:Object.entries(f).map((function(e){var t=j(e,2),n=t[0],r=t[1],o=parseInt(n.replace("d",""));return(0,T.jsx)(Pi,{icon:o,onClick:function(){return e=o,v.Analytics.log(v.EventCategories.DICE_Toolbar,v.EventActions["DICE_Custom_D".concat(e,"_Added")]),void h((function(t){return Ni(Ni({},t),{},y({},"d".concat(e),t["d".concat(e)]+1))}));var e},onContextMenu:function(){return e=o,v.Analytics.log(v.EventCategories.DICE_Toolbar,v.EventActions["DICE_Custom_D".concat(e,"_Removed")]),void(0!=f["d".concat(e)]&&h((function(t){return Ni(Ni({},t),{},y({},"d".concat(e),t["d".concat(e)]-1))})));var e},count:r},n)}))})]}),(null==o?void 0:o.length)>0&&(0,T.jsx)(Jo,{id:D,open:A,onClose:function(){b(null)},anchorEl:g,anchorOrigin:{vertical:"top",horizontal:"center"},transformOrigin:{vertical:"bottom",horizontal:"left"},optionGroups:[{label:"Send To:",options:null==o?void 0:o.map((function(e){return{label:e.displayValue,icon:I(e.displayValue),selected:e.id===(null==i?void 0:i.id)}}))}],onOptionClick:function(e,t){Z(o[t]).then((function(e){return N(e)})),b(null)},disableScrollLock:!0})]})},Di=function(e){var t=e.diceTypes,n=e.selectedDie,r=e.onClick;return(0,T.jsx)("div",{className:"dice-buttons",children:t.map((function(e){var t=parseInt(e.replace("d",""));return(0,T.jsx)(Pi,{icon:t,onClick:function(){return r(e)},onContextMenu:function(){},count:0,selected:e===n},e)}))})};var $i=[{eventName:"minRoll",label:"Min Roll"},{eventName:"maxRoll",label:"Max Roll"},{eventName:"collide",label:"Collision"},{eventName:"rollComplete",label:"Roll Complete"},{eventName:"dieRemoved",label:"Die Removed"},{eventName:"rollComplete",label:"1",value:1},{eventName:"rollComplete",label:"2",value:2},{eventName:"rollComplete",label:"3",value:3},{eventName:"rollComplete",label:"4",value:4},{eventName:"rollComplete",label:"20",value:20}];const Li=function(e){var t=e.events,n=void 0===t?$i:t;return(0,T.jsx)("div",{className:"dice-event-bar",children:n.map((function(e){return(0,T.jsx)("button",{className:"dice-event-button",onClick:function(){return v.Dice.previewEvent(e.eventName,e.value)},children:e.label},JSON.stringify(e))}))})};function Ii(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function zi(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?Ii(Object(n),!0).forEach((function(t){y(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Ii(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var _i=function(t){m(s,t);var n,r,o,i,a=(o=s,i=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=b(o);if(i){var n=b(this).constructor;e=Reflect.construct(t,arguments,n)}else e=t.apply(this,arguments);return g(this,e)});function s(t){var n;return e(this,s),y(f(n=a.call(this,t)),"canvas",void 0),n.canvas=(0,k.createRef)(),n}return p(s,[{key:"componentDidMount",value:(r=Z(P().mark((function e(){var t,n,r;return P().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return null===(t=this.canvas.current)||void 0===t||t.addEventListener("wheel",(function(e){return e.preventDefault(),!1}),!1),r=zi(zi({},v.DefaultDiceUserConfig),{},{manifestUrl:null!==(n=this.props.manifestUrl)&&void 0!==n?n:v.Dice.defaultDiceManifestUrl}),e.next=4,v.Dice.init({isDebug:this.props.isDebug,assetBaseLocation:this.props.assetBaseLocation,trackingId:"",sessionName:"",canvas:this.canvas.current,notifier:null,previewMode:!0,diceUserConfig:r});case 4:if(!this.props.manifestUrl){e.next=7;break}return e.next=7,v.Dice.load(this.props.manifestUrl);case 7:return e.next=9,v.Dice.showDicePreview(this.props.selectedDie);case 9:case"end":return e.stop()}}),e,this)}))),function(){return r.apply(this,arguments)})},{key:"componentDidUpdate",value:(n=Z(P().mark((function e(t){var n;return P().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(n=!1,t.manifestUrl===this.props.manifestUrl){e.next=5;break}return e.next=4,v.Dice.load(this.props.manifestUrl);case 4:n=!0;case 5:if(t.selectedDie!==this.props.selectedDie&&(n=!0),!n){e.next=9;break}return e.next=9,v.Dice.showDicePreview(this.props.selectedDie);case 9:case"end":return e.stop()}}),e,this)}))),function(e){return n.apply(this,arguments)})},{key:"render",value:function(){return(0,T.jsx)("div",{className:"dice-preview-panel",children:(0,T.jsx)("canvas",{ref:this.canvas})})}}]),s}(k.Component);function Bi(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function Fi(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?Bi(Object(n),!0).forEach((function(t){y(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Bi(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}var Wi=function(t){m(i,t);var n,r,o=(n=i,r=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=b(n);if(r){var o=b(this).constructor;e=Reflect.construct(t,arguments,o)}else e=t.apply(this,arguments);return g(this,e)});function i(t){var n;return e(this,i),y(f(n=o.call(this,t)),"onClick",(function(e){n.setState({selectedDie:e})})),n.state={selectedDie:v.DiceType.d20},document.addEventListener("dice-setmanifest",(function(e){n.setState({manifestUrl:e.manifestUrl,selectedDie:v.DiceType.d20})})),n}return p(i,[{key:"render",value:function(){return(0,T.jsxs)("div",{className:"dice-preview-app",children:[(0,T.jsx)(_i,Fi(Fi({},this.props),{},{manifestUrl:this.state.manifestUrl?this.state.manifestUrl:this.props.manifestUrl,selectedDie:this.state.selectedDie})),(0,T.jsx)(Di,{diceTypes:v.DiceTypes,selectedDie:this.state.selectedDie,onClick:this.onClick}),(0,T.jsx)(Li,{})]})}}]),i}(k.Component);function Vi(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function Ki(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?Vi(Object(n),!0).forEach((function(t){y(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):Vi(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}const Ui=function(e){var t=e.BaseComponent,n=e.userId,r=e.diceNotation,o=e.rollAction,i=e.rollType,a=e.rollKind,s=e.rollContext,l=e.rollTargetDefault,c=e.rollTargetOptions,u=e.onRollResults,d=e.onClick,p=e.useAdvancedMenu,f=e.useCustomizableDiceNotation,h=e.diceEnabled,m=void 0===h||h,g=e.showDiceNotification,b=void 0===g||g,y=e.themeColor,x=void 0===y?"#666666":y,w=(0,k.useRef)(),S=j((0,k.useState)(!1),2),Z=S[0],O=S[1],C=j((0,k.useState)(!1),2),E=C[0],R=C[1],P=j((0,k.useState)({x:null,y:null}),2),M=P[0],N=P[1],A=j((0,k.useState)(null),2),D=A[0],$=A[1],L=function(e){p&&(e.stopPropagation(),e.preventDefault(),O(!0))},I=function(e){var t=e;clearTimeout(D);var n=M.x,r=M.y,o=Math.abs(n-t.touches[0].clientX),i=Math.abs(r-t.touches[0].clientY);E&&(o>30||i>30)&&R(!1)},z=function e(t){clearTimeout(D),document.body.style["-webkit-user-select"]="inherit",E&&(Z||(document.dispatchEvent(new Event("contextmenu")),L(t))),R(!1),document.removeEventListener("touchend",e),document.removeEventListener("touchmove",I)},_={diceNotation:r,rollAction:o,rollType:i,rollKind:a,themeColor:x,rollContext:s,userId:n,showDiceNotification:b,onRollResults:u,rollTargetOptions:c,rollTargetDefault:l,onClose:function(){O(!1)},anchorEl:w.current,useCustomizableDiceNotation:f},B={onContextMenu:L,onTouchStart:function(e){1==e.touches.length&&(e.preventDefault(),document.body.style["-webkit-user-select"]="none",N((function(t){return Ki(Ki({},t),{},{y:e.touches[0].clientY})})),$(setTimeout((function(){R(!0)}),650)),document.addEventListener("touchend",z),document.addEventListener("touchmove",I))},onTouchEnd:z,onKeyUp:function(e){var t=e.code,n=e.keyCode;switch(t||n){case"ArrowDown":case 40:case"ArrowUp":case 38:L(e)}},className:"integrated-dice__container",onClick:function(e){var t,c;if(d&&d(e),e.ctrlKey)e.preventDefault();else{e.stopPropagation();var p=new v.RollRequest(o);p.rolls.push(new v.RollRequestRoll(r,i,a)),v.Dice.getRoller(Ki(Ki({},s),{},{messageScope:null!==(t=null==l?void 0:l.messageScope)&&void 0!==t?t:s.messageScope,messageTarget:null!==(c=null==l?void 0:l.messageTarget)&&void 0!==c?c:s.messageTarget})).then((function(t){return t.roll(p,e.clientX,e.clientY).then((function(e){b&&v.Dice.showDiceNotification(e,n),u&&u(e)})).catch((function(e){return console.log(e)}))}))}},ref:w};return m?(0,T.jsxs)(T.Fragment,{children:[Z&&(0,T.jsx)(mi,Ki({},_)),(0,T.jsx)("button",Ki(Ki({"aria-haspopup":"menu"},B),{},{children:t}))]}):t};var Hi={withDiceRoll:function(t){var n;return n=function(n){m(a,n);var r,o,i=(r=a,o=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=b(r);if(o){var n=b(this).constructor;e=Reflect.construct(t,arguments,n)}else e=t.apply(this,arguments);return g(this,e)});function a(t){var n;return e(this,a),y(f(n=i.call(this,t)),"timerLongTouch",void 0),y(f(n),"touchStartX",void 0),y(f(n),"touchStartY",void 0),y(f(n),"element",(0,k.createRef)()),y(f(n),"state",void 0),y(f(n),"onContextMenu",(function(e){n.props.advMenu&&(e.stopPropagation(),e.preventDefault(),n.setState({menuOpen:!0}))})),y(f(n),"handleButtonKeyUp",(function(e){var t=e.code,r=e.keyCode;switch(t||r){case"ArrowDown":case 40:case"ArrowUp":case 38:n.onContextMenu(e)}})),y(f(n),"clickRoller",(function(e){var t,r,o=n.props,i=o.rollAction,a=o.rollType,s=o.rollKind,l=o.diceNotation,c=o.showDiceNotification,u=o.onRollResults,d=o.rollContext,p=o.rollTargetDefault,f=o.userId,h=o.onClick;if(h&&h(e),e.ctrlKey)e.preventDefault();else{e.stopPropagation();var m=new v.RollRequest(i);m.rolls.push(new v.RollRequestRoll(l,a,s)),v.Dice.getRoller(bi(bi({},d),{},{messageScope:null!==(t=null==p?void 0:p.messageScope)&&void 0!==t?t:d.messageScope,messageTarget:null!==(r=null==p?void 0:p.messageTarget)&&void 0!==r?r:d.messageTarget})).then((function(t){return t.roll(m,e.clientX,e.clientY).then((function(e){c&&v.Dice.showDiceNotification(e,f),u&&u(e)})).catch((function(e){return console.log(e)}))}))}})),y(f(n),"touchstart",(function(e){1==e.touches.length&&(e.preventDefault(),document.body.style["-webkit-user-select"]="none",n.touchStartY=e.touches[0].clientY,n.timerLongTouch=setTimeout((function(){n.setState({longTouch:!0})}),650),document.addEventListener("touchend",n.touchend),document.addEventListener("touchmove",n.touchmove))})),y(f(n),"touchmove",(function(e){clearTimeout(n.timerLongTouch);var t=Math.abs(n.touchStartX-e.touches[0].clientX),r=Math.abs(n.touchStartY-e.touches[0].clientY);n.state.longTouch&&(t>30||r>30)&&(n.state.longTouch=!1)})),y(f(n),"touchend",(function(e){clearTimeout(n.timerLongTouch),document.body.style["-webkit-user-select"]="inherit",n.state.longTouch&&(n.state.menuOpen||(document.dispatchEvent(new Event("contextmenu")),n.onContextMenu(e))),n.setState({longTouch:!1}),document.removeEventListener("touchend",n.touchend),document.removeEventListener("touchmove",n.touchmove)})),y(f(n),"handleMenuClose",(function(){n.setState({menuOpen:!1})})),n.state={menuOpen:!1,left:0,bottom:0,longTouch:!1},n}return p(a,[{key:"render",value:function(){var e=this.props,n=e.diceNotation,r=e.rollAction,o=e.diceEnabled,i=e.rollType,a=e.onRollResults,s=e.showDiceNotification,l=e.themeColor,c=e.rollContext,u=e.rollTargetOptions,d=e.rollTargetDefault,p=e.userId,f=e.rollKind;return o?(0,T.jsxs)(T.Fragment,{children:[this.state.menuOpen&&(0,T.jsx)(mi,{diceNotation:n,rollAction:r,rollType:i,rollKind:f,themeColor:l,rollContext:c,userId:p,showDiceNotification:s,onRollResults:a,rollTargetOptions:u,rollTargetDefault:d,onClose:this.handleMenuClose,anchorEl:this.element.current}),(0,T.jsx)("button",{"aria-haspopup":"menu",onContextMenu:this.onContextMenu,onTouchStart:this.touchstart,onTouchEnd:this.touchend,onKeyUp:this.handleButtonKeyUp,className:"integrated-dice__container",onClick:this.clickRoller,ref:this.element,children:(0,T.jsx)(t,bi({},this.props))})]}):(0,T.jsx)(t,bi({},this.props))}}]),a}(k.Component),y(n,"defaultProps",bi({diceEnabled:!0,advMenu:!1,themeColor:"#666666",showDiceNotification:!0},t.defaultProps)),n},withMultiRoll:function(t){var n;return n=function(n){m(a,n);var r,o,i=(r=a,o=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,t=b(r);if(o){var n=b(this).constructor;e=Reflect.construct(t,arguments,n)}else e=t.apply(this,arguments);return g(this,e)});function a(t){var n;return e(this,a),y(f(n=i.call(this,t)),"clickRoller",(function(e){var t=n.props,r=t.rollAction,o=t.rolls,i=t.showDiceNotification,a=t.onRollResults,s=t.rollContext,l=t.userId;e.stopPropagation();var c={action:r,rolls:o};v.Dice.getRoller(s).then((function(t){return t.roll(c,e.clientX,e.clientY).then((function(e){i&&v.Dice.showDiceNotification(e,l),a&&a(e)})).catch((function(e){return console.log(e)}))}))})),n}return p(a,[{key:"render",value:function(){return this.props.diceEnabled?(0,T.jsx)("div",{className:"integrated-dice__container",onClick:this.clickRoller,children:(0,T.jsx)(t,vi({},this.props))}):(0,T.jsx)(t,vi({},this.props))}}]),a}(k.Component),y(n,"defaultProps",vi({diceEnabled:!0,showDiceNotification:!0},t.defaultProps)),n}}})();var d=u.bl,p=u.xN,f=u.tV,h=u.Ff;export{d as DiceComponents,p as DiceToolbar,f as PreviewApp,h as WithDiceRollv2};
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/dice/dist/dice.js b/ddb_main/node_modules/@dndbeyond/dice/dist/dice.js
new file mode 100644
index 0000000..59f7b98
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/dice/dist/dice.js
@@ -0,0 +1,2 @@
+/*! For license information please see dice.js.LICENSE.txt */
+var e,t,i,n,s={8401:e=>{e.exports=function e(t,i,n){function s(o,a){if(!i[o]){if(!t[o]){if(r)return r(o,!0);throw new Error("Cannot find module '"+o+"'")}var l=i[o]={exports:{}};t[o][0].call(l.exports,(function(e){return s(t[o][1][e]||e)}),l,l.exports,e,t,i,n)}return i[o].exports}for(var r=void 0,o=0;o<n.length;o++)s(n[o]);return s}({1:[function(e,t,i){t.exports={name:"cannon",version:"0.6.2",description:"A lightweight 3D physics engine written in JavaScript.",homepage:"https://github.com/schteppe/cannon.js",author:"Stefan Hedman <schteppe@gmail.com> (http://steffe.se)",keywords:["cannon.js","cannon","physics","engine","3d"],main:"./build/cannon.js",engines:{node:"*"},repository:{type:"git",url:"https://github.com/schteppe/cannon.js.git"},bugs:{url:"https://github.com/schteppe/cannon.js/issues"},licenses:[{type:"MIT"}],devDependencies:{jshint:"latest","uglify-js":"latest",nodeunit:"^0.9.0",grunt:"~0.4.0","grunt-contrib-jshint":"~0.1.1","grunt-contrib-nodeunit":"^0.4.1","grunt-contrib-concat":"~0.1.3","grunt-contrib-uglify":"^0.5.1","grunt-browserify":"^2.1.4","grunt-contrib-yuidoc":"^0.5.2",browserify:"*"},dependencies:{}}},{}],2:[function(e,t,i){t.exports={version:e("../package.json").version,AABB:e("./collision/AABB"),ArrayCollisionMatrix:e("./collision/ArrayCollisionMatrix"),Body:e("./objects/Body"),Box:e("./shapes/Box"),Broadphase:e("./collision/Broadphase"),Constraint:e("./constraints/Constraint"),ContactEquation:e("./equations/ContactEquation"),Narrowphase:e("./world/Narrowphase"),ConeTwistConstraint:e("./constraints/ConeTwistConstraint"),ContactMaterial:e("./material/ContactMaterial"),ConvexPolyhedron:e("./shapes/ConvexPolyhedron"),Cylinder:e("./shapes/Cylinder"),DistanceConstraint:e("./constraints/DistanceConstraint"),Equation:e("./equations/Equation"),EventTarget:e("./utils/EventTarget"),FrictionEquation:e("./equations/FrictionEquation"),GSSolver:e("./solver/GSSolver"),GridBroadphase:e("./collision/GridBroadphase"),Heightfield:e("./shapes/Heightfield"),HingeConstraint:e("./constraints/HingeConstraint"),LockConstraint:e("./constraints/LockConstraint"),Mat3:e("./math/Mat3"),Material:e("./material/Material"),NaiveBroadphase:e("./collision/NaiveBroadphase"),ObjectCollisionMatrix:e("./collision/ObjectCollisionMatrix"),Pool:e("./utils/Pool"),Particle:e("./shapes/Particle"),Plane:e("./shapes/Plane"),PointToPointConstraint:e("./constraints/PointToPointConstraint"),Quaternion:e("./math/Quaternion"),Ray:e("./collision/Ray"),RaycastVehicle:e("./objects/RaycastVehicle"),RaycastResult:e("./collision/RaycastResult"),RigidVehicle:e("./objects/RigidVehicle"),RotationalEquation:e("./equations/RotationalEquation"),RotationalMotorEquation:e("./equations/RotationalMotorEquation"),SAPBroadphase:e("./collision/SAPBroadphase"),SPHSystem:e("./objects/SPHSystem"),Shape:e("./shapes/Shape"),Solver:e("./solver/Solver"),Sphere:e("./shapes/Sphere"),SplitSolver:e("./solver/SplitSolver"),Spring:e("./objects/Spring"),Trimesh:e("./shapes/Trimesh"),Vec3:e("./math/Vec3"),Vec3Pool:e("./utils/Vec3Pool"),World:e("./world/World")}},{"../package.json":1,"./collision/AABB":3,"./collision/ArrayCollisionMatrix":4,"./collision/Broadphase":5,"./collision/GridBroadphase":6,"./collision/NaiveBroadphase":7,"./collision/ObjectCollisionMatrix":8,"./collision/Ray":9,"./collision/RaycastResult":10,"./collision/SAPBroadphase":11,"./constraints/ConeTwistConstraint":12,"./constraints/Constraint":13,"./constraints/DistanceConstraint":14,"./constraints/HingeConstraint":15,"./constraints/LockConstraint":16,"./constraints/PointToPointConstraint":17,"./equations/ContactEquation":19,"./equations/Equation":20,"./equations/FrictionEquation":21,"./equations/RotationalEquation":22,"./equations/RotationalMotorEquation":23,"./material/ContactMaterial":24,"./material/Material":25,"./math/Mat3":27,"./math/Quaternion":28,"./math/Vec3":30,"./objects/Body":31,"./objects/RaycastVehicle":32,"./objects/RigidVehicle":33,"./objects/SPHSystem":34,"./objects/Spring":35,"./shapes/Box":37,"./shapes/ConvexPolyhedron":38,"./shapes/Cylinder":39,"./shapes/Heightfield":40,"./shapes/Particle":41,"./shapes/Plane":42,"./shapes/Shape":43,"./shapes/Sphere":44,"./shapes/Trimesh":45,"./solver/GSSolver":46,"./solver/Solver":47,"./solver/SplitSolver":48,"./utils/EventTarget":49,"./utils/Pool":51,"./utils/Vec3Pool":54,"./world/Narrowphase":55,"./world/World":56}],3:[function(e,t,i){var n=e("../math/Vec3");function s(e){e=e||{},this.lowerBound=new n,e.lowerBound&&this.lowerBound.copy(e.lowerBound),this.upperBound=new n,e.upperBound&&this.upperBound.copy(e.upperBound)}e("../utils/Utils"),t.exports=s;var r=new n;s.prototype.setFromPoints=function(e,t,i,n){var s=this.lowerBound,o=this.upperBound,a=i;s.copy(e[0]),a&&a.vmult(s,s),o.copy(s);for(var l=1;l<e.length;l++){var h=e[l];a&&(a.vmult(h,r),h=r),h.x>o.x&&(o.x=h.x),h.x<s.x&&(s.x=h.x),h.y>o.y&&(o.y=h.y),h.y<s.y&&(s.y=h.y),h.z>o.z&&(o.z=h.z),h.z<s.z&&(s.z=h.z)}return t&&(t.vadd(s,s),t.vadd(o,o)),n&&(s.x-=n,s.y-=n,s.z-=n,o.x+=n,o.y+=n,o.z+=n),this},s.prototype.copy=function(e){return this.lowerBound.copy(e.lowerBound),this.upperBound.copy(e.upperBound),this},s.prototype.clone=function(){return(new s).copy(this)},s.prototype.extend=function(e){var t=e.lowerBound.x;this.lowerBound.x>t&&(this.lowerBound.x=t);var i=e.upperBound.x;this.upperBound.x<i&&(this.upperBound.x=i),t=e.lowerBound.y,this.lowerBound.y>t&&(this.lowerBound.y=t),i=e.upperBound.y,this.upperBound.y<i&&(this.upperBound.y=i),t=e.lowerBound.z,this.lowerBound.z>t&&(this.lowerBound.z=t),i=e.upperBound.z,this.upperBound.z<i&&(this.upperBound.z=i)},s.prototype.overlaps=function(e){var t=this.lowerBound,i=this.upperBound,n=e.lowerBound,s=e.upperBound;return(n.x<=i.x&&i.x<=s.x||t.x<=s.x&&s.x<=i.x)&&(n.y<=i.y&&i.y<=s.y||t.y<=s.y&&s.y<=i.y)&&(n.z<=i.z&&i.z<=s.z||t.z<=s.z&&s.z<=i.z)},s.prototype.contains=function(e){var t=this.lowerBound,i=this.upperBound,n=e.lowerBound,s=e.upperBound;return t.x<=n.x&&i.x>=s.x&&t.y<=n.y&&i.y>=s.y&&t.z<=n.z&&i.z>=s.z},s.prototype.getCorners=function(e,t,i,n,s,r,o,a){var l=this.lowerBound,h=this.upperBound;e.copy(l),t.set(h.x,l.y,l.z),i.set(h.x,h.y,l.z),n.set(l.x,h.y,h.z),s.set(h.x,l.y,l.z),r.set(l.x,h.y,l.z),o.set(l.x,l.y,h.z),a.copy(h)};var o=[new n,new n,new n,new n,new n,new n,new n,new n];s.prototype.toLocalFrame=function(e,t){var i=o,n=i[0],s=i[1],r=i[2],a=i[3],l=i[4],h=i[5],c=i[6],u=i[7];this.getCorners(n,s,r,a,l,h,c,u);for(var d=0;8!==d;d++){var p=i[d];e.pointToLocal(p,p)}return t.setFromPoints(i)},s.prototype.toWorldFrame=function(e,t){var i=o,n=i[0],s=i[1],r=i[2],a=i[3],l=i[4],h=i[5],c=i[6],u=i[7];this.getCorners(n,s,r,a,l,h,c,u);for(var d=0;8!==d;d++){var p=i[d];e.pointToWorld(p,p)}return t.setFromPoints(i)}},{"../math/Vec3":30,"../utils/Utils":53}],4:[function(e,t,i){function n(){this.matrix=[]}t.exports=n,n.prototype.get=function(e,t){if(e=e.index,(t=t.index)>e){var i=t;t=e,e=i}return this.matrix[(e*(e+1)>>1)+t-1]},n.prototype.set=function(e,t,i){if(e=e.index,(t=t.index)>e){var n=t;t=e,e=n}this.matrix[(e*(e+1)>>1)+t-1]=i?1:0},n.prototype.reset=function(){for(var e=0,t=this.matrix.length;e!==t;e++)this.matrix[e]=0},n.prototype.setNumObjects=function(e){this.matrix.length=e*(e-1)>>1}},{}],5:[function(e,t,i){var n=e("../objects/Body"),s=e("../math/Vec3"),r=e("../math/Quaternion");function o(){this.world=null,this.useBoundingBoxes=!1,this.dirty=!0}e("../shapes/Shape"),e("../shapes/Plane"),t.exports=o,o.prototype.collisionPairs=function(e,t,i){throw new Error("collisionPairs not implemented for this BroadPhase class!")};var a=n.STATIC|n.KINEMATIC;o.prototype.needBroadphaseCollision=function(e,t){return 0!=(e.collisionFilterGroup&t.collisionFilterMask)&&0!=(t.collisionFilterGroup&e.collisionFilterMask)&&(0==(e.type&a)&&e.sleepState!==n.SLEEPING||0==(t.type&a)&&t.sleepState!==n.SLEEPING)},o.prototype.intersectionTest=function(e,t,i,n){this.useBoundingBoxes?this.doBoundingBoxBroadphase(e,t,i,n):this.doBoundingSphereBroadphase(e,t,i,n)};var l=new s;new s,new r,new s,o.prototype.doBoundingSphereBroadphase=function(e,t,i,n){var s=l;t.position.vsub(e.position,s);var r=Math.pow(e.boundingRadius+t.boundingRadius,2);s.norm2()<r&&(i.push(e),n.push(t))},o.prototype.doBoundingBoxBroadphase=function(e,t,i,n){e.aabbNeedsUpdate&&e.computeAABB(),t.aabbNeedsUpdate&&t.computeAABB(),e.aabb.overlaps(t.aabb)&&(i.push(e),n.push(t))};var h={keys:[]},c=[],u=[];o.prototype.makePairsUnique=function(e,t){for(var i=h,n=c,s=u,r=e.length,o=0;o!==r;o++)n[o]=e[o],s[o]=t[o];for(e.length=0,t.length=0,o=0;o!==r;o++){var a=n[o].id,l=s[o].id;i[d=a<l?a+","+l:l+","+a]=o,i.keys.push(d)}for(o=0;o!==i.keys.length;o++){var d=i.keys.pop(),p=i[d];e.push(n[p]),t.push(s[p]),delete i[d]}},o.prototype.setWorld=function(e){};var d=new s;o.boundingSphereCheck=function(e,t){var i=d;return e.position.vsub(t.position,i),Math.pow(e.shape.boundingSphereRadius+t.shape.boundingSphereRadius,2)>i.norm2()},o.prototype.aabbQuery=function(e,t,i){return console.warn(".aabbQuery is not implemented in this Broadphase subclass."),[]}},{"../math/Quaternion":28,"../math/Vec3":30,"../objects/Body":31,"../shapes/Plane":42,"../shapes/Shape":43}],6:[function(e,t,i){t.exports=o;var n=e("./Broadphase"),s=e("../math/Vec3"),r=e("../shapes/Shape");function o(e,t,i,r,o){n.apply(this),this.nx=i||10,this.ny=r||10,this.nz=o||10,this.aabbMin=e||new s(100,100,100),this.aabbMax=t||new s(-100,-100,-100);var a=this.nx*this.ny*this.nz;if(a<=0)throw"GridBroadphase: Each dimension's n must be >0";this.bins=[],this.binLengths=[],this.bins.length=a,this.binLengths.length=a;for(var l=0;l<a;l++)this.bins[l]=[],this.binLengths[l]=0}o.prototype=new n,o.prototype.constructor=o;var a=new s;new s,o.prototype.collisionPairs=function(e,t,i){for(var n=e.numObjects(),s=e.bodies,o=this.aabbMax,l=this.aabbMin,h=this.nx,c=this.ny,u=this.nz,d=c*u,p=u,f=o.x,_=o.y,m=o.z,g=l.x,v=l.y,y=l.z,x=h/(f-g),b=c/(_-v),T=u/(m-y),S=(f-g)/h,E=(_-v)/c,C=(m-y)/u,A=.5*Math.sqrt(S*S+E*E+C*C),P=r.types,R=P.SPHERE,M=P.PLANE,I=(P.BOX,P.COMPOUND,P.CONVEXPOLYHEDRON,this.bins),D=this.binLengths,O=this.bins.length,w=0;w!==O;w++)D[w]=0;var N=Math.ceil;function F(e,t,i,n,s,r,o){var a=(e-g)*x|0,l=(t-v)*b|0,f=(i-y)*T|0,_=N((n-g)*x),m=N((s-v)*b),S=N((r-y)*T);a<0?a=0:a>=h&&(a=h-1),l<0?l=0:l>=c&&(l=c-1),f<0?f=0:f>=u&&(f=u-1),_<0?_=0:_>=h&&(_=h-1),m<0?m=0:m>=c&&(m=c-1),S<0?S=0:S>=u&&(S=u-1),l*=p,f*=1,_*=d,m*=p,S*=1;for(var E=a*=d;E<=_;E+=d)for(var C=l;C<=m;C+=p)for(var A=f;A<=S;A+=1){var P=E+C+A;I[P][D[P]++]=o}}for(l=Math.min,o=Math.max,w=0;w!==n;w++){var L=(te=s[w]).shape;switch(L.type){case R:var B=te.position.x,U=te.position.y,V=te.position.z,k=L.radius;F(B-k,U-k,V-k,B+k,U+k,V+k,te);break;case M:L.worldNormalNeedsUpdate&&L.computeWorldNormal(te.quaternion);var G=L.worldNormal,z=g+.5*S-te.position.x,W=v+.5*E-te.position.y,H=y+.5*C-te.position.z,X=a;X.set(z,W,H);for(var j=0,Y=0;j!==h;j++,Y+=d,X.y=W,X.x+=S)for(var q=0,K=0;q!==c;q++,K+=p,X.z=H,X.y+=E)for(var $=0,Q=0;$!==u;$++,Q+=1,X.z+=C)if(X.dot(G)<A){var Z=Y+K+Q;I[Z][D[Z]++]=te}break;default:te.aabbNeedsUpdate&&te.computeAABB(),F(te.aabb.lowerBound.x,te.aabb.lowerBound.y,te.aabb.lowerBound.z,te.aabb.upperBound.x,te.aabb.upperBound.y,te.aabb.upperBound.z,te)}}for(w=0;w!==O;w++){var J=D[w];if(J>1){var ee=I[w];for(j=0;j!==J;j++){var te=ee[j];for(q=0;q!==j;q++){var ie=ee[q];this.needBroadphaseCollision(te,ie)&&this.intersectionTest(te,ie,t,i)}}}}this.makePairsUnique(t,i)}},{"../math/Vec3":30,"../shapes/Shape":43,"./Broadphase":5}],7:[function(e,t,i){t.exports=r;var n=e("./Broadphase"),s=e("./AABB");function r(){n.apply(this)}r.prototype=new n,r.prototype.constructor=r,r.prototype.collisionPairs=function(e,t,i){var n,s,r,o,a=e.bodies,l=a.length;for(n=0;n!==l;n++)for(s=0;s!==n;s++)r=a[n],o=a[s],this.needBroadphaseCollision(r,o)&&this.intersectionTest(r,o,t,i)},new s,r.prototype.aabbQuery=function(e,t,i){i=i||[];for(var n=0;n<e.bodies.length;n++){var s=e.bodies[n];s.aabbNeedsUpdate&&s.computeAABB(),s.aabb.overlaps(t)&&i.push(s)}return i}},{"./AABB":3,"./Broadphase":5}],8:[function(e,t,i){function n(){this.matrix={}}t.exports=n,n.prototype.get=function(e,t){if(e=e.id,(t=t.id)>e){var i=t;t=e,e=i}return e+"-"+t in this.matrix},n.prototype.set=function(e,t,i){if(e=e.id,(t=t.id)>e){var n=t;t=e,e=n}i?this.matrix[e+"-"+t]=!0:delete this.matrix[e+"-"+t]},n.prototype.reset=function(){this.matrix={}},n.prototype.setNumObjects=function(e){}},{}],9:[function(e,t,i){t.exports=h;var n=e("../math/Vec3"),s=e("../math/Quaternion"),r=e("../math/Transform"),o=(e("../shapes/ConvexPolyhedron"),e("../shapes/Box"),e("../collision/RaycastResult")),a=e("../shapes/Shape"),l=e("../collision/AABB");function h(e,t){this.from=e?e.clone():new n,this.to=t?t.clone():new n,this._direction=new n,this.precision=1e-4,this.checkCollisionResponse=!0,this.skipBackfaces=!1,this.collisionFilterMask=-1,this.collisionFilterGroup=-1,this.mode=h.ANY,this.result=new o,this.hasHit=!1,this.callback=function(e){}}h.prototype.constructor=h,h.CLOSEST=1,h.ANY=2,h.ALL=4;var c=new l,u=[];h.prototype.intersectWorld=function(e,t){return this.mode=t.mode||h.ANY,this.result=t.result||new o,this.skipBackfaces=!!t.skipBackfaces,this.collisionFilterMask=void 0!==t.collisionFilterMask?t.collisionFilterMask:-1,this.collisionFilterGroup=void 0!==t.collisionFilterGroup?t.collisionFilterGroup:-1,t.from&&this.from.copy(t.from),t.to&&this.to.copy(t.to),this.callback=t.callback||function(){},this.hasHit=!1,this.result.reset(),this._updateDirection(),this.getAABB(c),u.length=0,e.broadphase.aabbQuery(e,c,u),this.intersectBodies(u),this.hasHit};var d=new n,p=new n;function f(e,t,i,n){n.vsub(t,N),i.vsub(t,d),e.vsub(t,p);var s,r,o=N.dot(N),a=N.dot(d),l=N.dot(p),h=d.dot(d),c=d.dot(p);return(s=h*l-a*c)>=0&&(r=o*c-a*l)>=0&&s+r<o*h-a*a}h.pointInTriangle=f;var _=new n,m=new s;h.prototype.intersectBody=function(e,t){t&&(this.result=t,this._updateDirection());var i=this.checkCollisionResponse;if((!i||e.collisionResponse)&&0!=(this.collisionFilterGroup&e.collisionFilterMask)&&0!=(e.collisionFilterGroup&this.collisionFilterMask))for(var n=_,s=m,r=0,o=e.shapes.length;r<o;r++){var a=e.shapes[r];if((!i||a.collisionResponse)&&(e.quaternion.mult(e.shapeOrientations[r],s),e.quaternion.vmult(e.shapeOffsets[r],n),n.vadd(e.position,n),this.intersectShape(a,s,n,e),this.result._shouldStop))break}},h.prototype.intersectBodies=function(e,t){t&&(this.result=t,this._updateDirection());for(var i=0,n=e.length;!this.result._shouldStop&&i<n;i++)this.intersectBody(e[i])},h.prototype._updateDirection=function(){this.to.vsub(this.from,this._direction),this._direction.normalize()},h.prototype.intersectShape=function(e,t,i,n){if(!(function(e,t,i){i.vsub(e,N);var n=N.dot(t);return t.mult(n,F),F.vadd(e,F),i.distanceTo(F)}(this.from,this._direction,i)>e.boundingSphereRadius)){var s=this[e.type];s&&s.call(this,e,t,i,n)}},new n,new n;var g=new n,v=new n,y=new n,x=new n;new n,new o,h.prototype.intersectBox=function(e,t,i,n){return this.intersectConvex(e.convexPolyhedronRepresentation,t,i,n)},h.prototype[a.types.BOX]=h.prototype.intersectBox,h.prototype.intersectPlane=function(e,t,i,s){var r=this.from,o=this.to,a=this._direction,l=new n(0,0,1);t.vmult(l,l);var h=new n;r.vsub(i,h);var c=h.dot(l);if(o.vsub(i,h),!(c*h.dot(l)>0||r.distanceTo(o)<c)){var u=l.dot(a);if(!(Math.abs(u)<this.precision)){var d=new n,p=new n,f=new n;r.vsub(i,d);var _=-l.dot(d)/u;a.scale(_,p),r.vadd(p,f),this.reportIntersection(l,f,e,s,-1)}}},h.prototype[a.types.PLANE]=h.prototype.intersectPlane,h.prototype.getAABB=function(e){var t=this.to,i=this.from;e.lowerBound.x=Math.min(t.x,i.x),e.lowerBound.y=Math.min(t.y,i.y),e.lowerBound.z=Math.min(t.z,i.z),e.upperBound.x=Math.max(t.x,i.x),e.upperBound.y=Math.max(t.y,i.y),e.upperBound.z=Math.max(t.z,i.z)};var b={faceList:[0]};h.prototype.intersectHeightfield=function(e,t,i,s){e.data,e.elementSize;var o=new n,a=new h(this.from,this.to);r.pointToLocalFrame(i,t,a.from,a.from),r.pointToLocalFrame(i,t,a.to,a.to);var l=[],c=null,u=null,d=null,p=null,f=e.getIndexOfPosition(a.from.x,a.from.y,l,!1);if(f&&(c=l[0],u=l[1],d=l[0],p=l[1]),(f=e.getIndexOfPosition(a.to.x,a.to.y,l,!1))&&((null===c||l[0]<c)&&(c=l[0]),(null===d||l[0]>d)&&(d=l[0]),(null===u||l[1]<u)&&(u=l[1]),(null===p||l[1]>p)&&(p=l[1])),null!==c){var _=[];e.getRectMinMax(c,u,d,p,_);for(var m=c;m<=d;m++)for(var g=u;g<=p;g++){if(this.result._shouldStop)return;if(e.getConvexTrianglePillar(m,g,!1),r.pointToWorldFrame(i,t,e.pillarOffset,o),this.intersectConvex(e.pillarConvex,t,o,s,b),this.result._shouldStop)return;e.getConvexTrianglePillar(m,g,!0),r.pointToWorldFrame(i,t,e.pillarOffset,o),this.intersectConvex(e.pillarConvex,t,o,s,b)}}},h.prototype[a.types.HEIGHTFIELD]=h.prototype.intersectHeightfield;var T=new n,S=new n;h.prototype.intersectSphere=function(e,t,i,n){var s=this.from,r=this.to,o=e.radius,a=Math.pow(r.x-s.x,2)+Math.pow(r.y-s.y,2)+Math.pow(r.z-s.z,2),l=2*((r.x-s.x)*(s.x-i.x)+(r.y-s.y)*(s.y-i.y)+(r.z-s.z)*(s.z-i.z)),h=Math.pow(s.x-i.x,2)+Math.pow(s.y-i.y,2)+Math.pow(s.z-i.z,2)-Math.pow(o,2),c=Math.pow(l,2)-4*a*h,u=T,d=S;if(!(c<0))if(0===c)s.lerp(r,c,u),u.vsub(i,d),d.normalize(),this.reportIntersection(d,u,e,n,-1);else{var p=(-l-Math.sqrt(c))/(2*a),f=(-l+Math.sqrt(c))/(2*a);if(p>=0&&p<=1&&(s.lerp(r,p,u),u.vsub(i,d),d.normalize(),this.reportIntersection(d,u,e,n,-1)),this.result._shouldStop)return;f>=0&&f<=1&&(s.lerp(r,f,u),u.vsub(i,d),d.normalize(),this.reportIntersection(d,u,e,n,-1))}},h.prototype[a.types.SPHERE]=h.prototype.intersectSphere;var E=new n,C=(new n,new n,new n);h.prototype.intersectConvex=function(e,t,i,n,s){for(var r=E,o=C,a=s&&s.faceList||null,l=e.faces,h=e.vertices,c=e.faceNormals,u=this._direction,d=this.from,p=this.to,_=d.distanceTo(p),m=a?a.length:l.length,b=this.result,T=0;!b._shouldStop&&T<m;T++){var S=a?a[T]:T,A=l[S],P=c[S],R=t,M=i;o.copy(h[A[0]]),R.vmult(o,o),o.vadd(M,o),o.vsub(d,o),R.vmult(P,r);var I=u.dot(r);if(!(Math.abs(I)<this.precision)){var D=r.dot(o)/I;if(!(D<0)){u.mult(D,g),g.vadd(d,g),v.copy(h[A[0]]),R.vmult(v,v),M.vadd(v,v);for(var O=1;!b._shouldStop&&O<A.length-1;O++){y.copy(h[A[O]]),x.copy(h[A[O+1]]),R.vmult(y,y),R.vmult(x,x),M.vadd(y,y),M.vadd(x,x);var w=g.distanceTo(d);!f(g,v,y,x)&&!f(g,y,v,x)||w>_||this.reportIntersection(r,g,e,n,S)}}}}},h.prototype[a.types.CONVEXPOLYHEDRON]=h.prototype.intersectConvex;var A=new n,P=new n,R=new n,M=new n,I=new n,D=new n,O=(new l,[]),w=new r;h.prototype.intersectTrimesh=function(e,t,i,n,s){var o=A,a=O,l=w,h=C,c=P,u=R,d=M,p=D,_=I,m=(s&&s.faceList,e.indices),b=(e.vertices,e.faceNormals,this.from),T=this.to,S=this._direction;l.position.copy(i),l.quaternion.copy(t),r.vectorToLocalFrame(i,t,S,c),r.pointToLocalFrame(i,t,b,u),r.pointToLocalFrame(i,t,T,d);var E=u.distanceSquared(d);e.tree.rayQuery(this,l,a);for(var N=0,F=a.length;!this.result._shouldStop&&N!==F;N++){var L=a[N];e.getNormal(L,o),e.getVertex(m[3*L],v),v.vsub(u,h);var B=c.dot(o),U=o.dot(h)/B;if(!(U<0)){c.scale(U,g),g.vadd(u,g),e.getVertex(m[3*L+1],y),e.getVertex(m[3*L+2],x);var V=g.distanceSquared(u);!f(g,y,v,x)&&!f(g,v,y,x)||V>E||(r.vectorToWorldFrame(t,o,_),r.pointToWorldFrame(i,t,g,p),this.reportIntersection(_,p,e,n,L))}}a.length=0},h.prototype[a.types.TRIMESH]=h.prototype.intersectTrimesh,h.prototype.reportIntersection=function(e,t,i,n,s){var r=this.from,o=this.to,a=r.distanceTo(t),l=this.result;if(!(this.skipBackfaces&&e.dot(this._direction)>0))switch(l.hitFaceIndex=void 0!==s?s:-1,this.mode){case h.ALL:this.hasHit=!0,l.set(r,o,e,t,i,n,a),l.hasHit=!0,this.callback(l);break;case h.CLOSEST:(a<l.distance||!l.hasHit)&&(this.hasHit=!0,l.hasHit=!0,l.set(r,o,e,t,i,n,a));break;case h.ANY:this.hasHit=!0,l.hasHit=!0,l.set(r,o,e,t,i,n,a),l._shouldStop=!0}};var N=new n,F=new n},{"../collision/AABB":3,"../collision/RaycastResult":10,"../math/Quaternion":28,"../math/Transform":29,"../math/Vec3":30,"../shapes/Box":37,"../shapes/ConvexPolyhedron":38,"../shapes/Shape":43}],10:[function(e,t,i){var n=e("../math/Vec3");function s(){this.rayFromWorld=new n,this.rayToWorld=new n,this.hitNormalWorld=new n,this.hitPointWorld=new n,this.hasHit=!1,this.shape=null,this.body=null,this.hitFaceIndex=-1,this.distance=-1,this._shouldStop=!1}t.exports=s,s.prototype.reset=function(){this.rayFromWorld.setZero(),this.rayToWorld.setZero(),this.hitNormalWorld.setZero(),this.hitPointWorld.setZero(),this.hasHit=!1,this.shape=null,this.body=null,this.hitFaceIndex=-1,this.distance=-1,this._shouldStop=!1},s.prototype.abort=function(){this._shouldStop=!0},s.prototype.set=function(e,t,i,n,s,r,o){this.rayFromWorld.copy(e),this.rayToWorld.copy(t),this.hitNormalWorld.copy(i),this.hitPointWorld.copy(n),this.shape=s,this.body=r,this.distance=o}},{"../math/Vec3":30}],11:[function(e,t,i){e("../shapes/Shape");var n=e("../collision/Broadphase");function s(e){n.apply(this),this.axisList=[],this.world=null,this.axisIndex=0;var t=this.axisList;this._addBodyHandler=function(e){t.push(e.body)},this._removeBodyHandler=function(e){var i=t.indexOf(e.body);-1!==i&&t.splice(i,1)},e&&this.setWorld(e)}t.exports=s,s.prototype=new n,s.prototype.setWorld=function(e){this.axisList.length=0;for(var t=0;t<e.bodies.length;t++)this.axisList.push(e.bodies[t]);e.removeEventListener("addBody",this._addBodyHandler),e.removeEventListener("removeBody",this._removeBodyHandler),e.addEventListener("addBody",this._addBodyHandler),e.addEventListener("removeBody",this._removeBodyHandler),this.world=e,this.dirty=!0},s.insertionSortX=function(e){for(var t=1,i=e.length;t<i;t++){for(var n=e[t],s=t-1;s>=0&&!(e[s].aabb.lowerBound.x<=n.aabb.lowerBound.x);s--)e[s+1]=e[s];e[s+1]=n}return e},s.insertionSortY=function(e){for(var t=1,i=e.length;t<i;t++){for(var n=e[t],s=t-1;s>=0&&!(e[s].aabb.lowerBound.y<=n.aabb.lowerBound.y);s--)e[s+1]=e[s];e[s+1]=n}return e},s.insertionSortZ=function(e){for(var t=1,i=e.length;t<i;t++){for(var n=e[t],s=t-1;s>=0&&!(e[s].aabb.lowerBound.z<=n.aabb.lowerBound.z);s--)e[s+1]=e[s];e[s+1]=n}return e},s.prototype.collisionPairs=function(e,t,i){var n,r,o=this.axisList,a=o.length,l=this.axisIndex;for(this.dirty&&(this.sortList(),this.dirty=!1),n=0;n!==a;n++){var h=o[n];for(r=n+1;r<a;r++){var c=o[r];if(this.needBroadphaseCollision(h,c)){if(!s.checkBounds(h,c,l))break;this.intersectionTest(h,c,t,i)}}}},s.prototype.sortList=function(){for(var e=this.axisList,t=this.axisIndex,i=e.length,n=0;n!==i;n++){var r=e[n];r.aabbNeedsUpdate&&r.computeAABB()}0===t?s.insertionSortX(e):1===t?s.insertionSortY(e):2===t&&s.insertionSortZ(e)},s.checkBounds=function(e,t,i){var n,s;0===i?(n=e.position.x,s=t.position.x):1===i?(n=e.position.y,s=t.position.y):2===i&&(n=e.position.z,s=t.position.z);var r=e.boundingRadius;return s-t.boundingRadius<n+r},s.prototype.autoDetectAxis=function(){for(var e=0,t=0,i=0,n=0,s=0,r=0,o=this.axisList,a=o.length,l=1/a,h=0;h!==a;h++){var c=o[h],u=c.position.x;e+=u,t+=u*u;var d=c.position.y;i+=d,n+=d*d;var p=c.position.z;s+=p,r+=p*p}var f=t-e*e*l,_=n-i*i*l,m=r-s*s*l;this.axisIndex=f>_?f>m?0:2:_>m?1:2},s.prototype.aabbQuery=function(e,t,i){i=i||[],this.dirty&&(this.sortList(),this.dirty=!1);var n=this.axisIndex,s="x";1===n&&(s="y"),2===n&&(s="z");for(var r=this.axisList,o=(t.lowerBound[s],t.upperBound[s],0);o<r.length;o++){var a=r[o];a.aabbNeedsUpdate&&a.computeAABB(),a.aabb.overlaps(t)&&i.push(a)}return i}},{"../collision/Broadphase":5,"../shapes/Shape":43}],12:[function(e,t,i){t.exports=a,e("./Constraint");var n=e("./PointToPointConstraint"),s=e("../equations/ConeEquation"),r=e("../equations/RotationalEquation"),o=(e("../equations/ContactEquation"),e("../math/Vec3"));function a(e,t,i){var a=void 0!==(i=i||{}).maxForce?i.maxForce:1e6,l=i.pivotA?i.pivotA.clone():new o,h=i.pivotB?i.pivotB.clone():new o;this.axisA=i.axisA?i.axisA.clone():new o,this.axisB=i.axisB?i.axisB.clone():new o,n.call(this,e,l,t,h,a),this.collideConnected=!!i.collideConnected,this.angle=void 0!==i.angle?i.angle:0;var c=this.coneEquation=new s(e,t,i),u=this.twistEquation=new r(e,t,i);this.twistAngle=void 0!==i.twistAngle?i.twistAngle:0,c.maxForce=0,c.minForce=-a,u.maxForce=0,u.minForce=-a,this.equations.push(c,u)}a.prototype=new n,a.constructor=a,new o,new o,a.prototype.update=function(){var e=this.bodyA,t=this.bodyB,i=this.coneEquation,s=this.twistEquation;n.prototype.update.call(this),e.vectorToWorldFrame(this.axisA,i.axisA),t.vectorToWorldFrame(this.axisB,i.axisB),this.axisA.tangents(s.axisA,s.axisA),e.vectorToWorldFrame(s.axisA,s.axisA),this.axisB.tangents(s.axisB,s.axisB),t.vectorToWorldFrame(s.axisB,s.axisB),i.angle=this.angle,s.maxAngle=this.twistAngle}},{"../equations/ConeEquation":18,"../equations/ContactEquation":19,"../equations/RotationalEquation":22,"../math/Vec3":30,"./Constraint":13,"./PointToPointConstraint":17}],13:[function(e,t,i){t.exports=s;var n=e("../utils/Utils");function s(e,t,i){i=n.defaults(i,{collideConnected:!0,wakeUpBodies:!0}),this.equations=[],this.bodyA=e,this.bodyB=t,this.id=s.idCounter++,this.collideConnected=i.collideConnected,i.wakeUpBodies&&(e&&e.wakeUp(),t&&t.wakeUp())}s.prototype.update=function(){throw new Error("method update() not implmemented in this Constraint subclass!")},s.prototype.enable=function(){for(var e=this.equations,t=0;t<e.length;t++)e[t].enabled=!0},s.prototype.disable=function(){for(var e=this.equations,t=0;t<e.length;t++)e[t].enabled=!1},s.idCounter=0},{"../utils/Utils":53}],14:[function(e,t,i){t.exports=r;var n=e("./Constraint"),s=e("../equations/ContactEquation");function r(e,t,i,r){n.call(this,e,t),void 0===i&&(i=e.position.distanceTo(t.position)),void 0===r&&(r=1e6),this.distance=i;var o=this.distanceEquation=new s(e,t);this.equations.push(o),o.minForce=-r,o.maxForce=r}r.prototype=new n,r.prototype.update=function(){var e=this.bodyA,t=this.bodyB,i=this.distanceEquation,n=.5*this.distance,s=i.ni;t.position.vsub(e.position,s),s.normalize(),s.mult(n,i.ri),s.mult(-n,i.rj)}},{"../equations/ContactEquation":19,"./Constraint":13}],15:[function(e,t,i){t.exports=a,e("./Constraint");var n=e("./PointToPointConstraint"),s=e("../equations/RotationalEquation"),r=e("../equations/RotationalMotorEquation"),o=(e("../equations/ContactEquation"),e("../math/Vec3"));function a(e,t,i){var a=void 0!==(i=i||{}).maxForce?i.maxForce:1e6,l=i.pivotA?i.pivotA.clone():new o,h=i.pivotB?i.pivotB.clone():new o;n.call(this,e,l,t,h,a),(this.axisA=i.axisA?i.axisA.clone():new o(1,0,0)).normalize(),(this.axisB=i.axisB?i.axisB.clone():new o(1,0,0)).normalize();var c=this.rotationalEquation1=new s(e,t,i),u=this.rotationalEquation2=new s(e,t,i),d=this.motorEquation=new r(e,t,a);d.enabled=!1,this.equations.push(c,u,d)}a.prototype=new n,a.constructor=a,a.prototype.enableMotor=function(){this.motorEquation.enabled=!0},a.prototype.disableMotor=function(){this.motorEquation.enabled=!1},a.prototype.setMotorSpeed=function(e){this.motorEquation.targetVelocity=e},a.prototype.setMotorMaxForce=function(e){this.motorEquation.maxForce=e,this.motorEquation.minForce=-e};var l=new o,h=new o;a.prototype.update=function(){var e=this.bodyA,t=this.bodyB,i=this.motorEquation,s=this.rotationalEquation1,r=this.rotationalEquation2,o=l,a=h,c=this.axisA,u=this.axisB;n.prototype.update.call(this),e.quaternion.vmult(c,o),t.quaternion.vmult(u,a),o.tangents(s.axisA,r.axisA),s.axisB.copy(a),r.axisB.copy(a),this.motorEquation.enabled&&(e.quaternion.vmult(this.axisA,i.axisA),t.quaternion.vmult(this.axisB,i.axisB))}},{"../equations/ContactEquation":19,"../equations/RotationalEquation":22,"../equations/RotationalMotorEquation":23,"../math/Vec3":30,"./Constraint":13,"./PointToPointConstraint":17}],16:[function(e,t,i){t.exports=o,e("./Constraint");var n=e("./PointToPointConstraint"),s=e("../equations/RotationalEquation"),r=(e("../equations/RotationalMotorEquation"),e("../equations/ContactEquation"),e("../math/Vec3"));function o(e,t,i){var o=void 0!==(i=i||{}).maxForce?i.maxForce:1e6,a=new r,l=new r,h=new r;e.position.vadd(t.position,h),h.scale(.5,h),t.pointToLocalFrame(h,l),e.pointToLocalFrame(h,a),n.call(this,e,a,t,l,o);var c=this.rotationalEquation1=new s(e,t,i),u=this.rotationalEquation2=new s(e,t,i),d=this.rotationalEquation3=new s(e,t,i);this.equations.push(c,u,d)}o.prototype=new n,o.constructor=o,new r,new r,o.prototype.update=function(){var e=this.bodyA,t=this.bodyB,i=(this.motorEquation,this.rotationalEquation1),s=this.rotationalEquation2,o=this.rotationalEquation3;n.prototype.update.call(this),e.vectorToWorldFrame(r.UNIT_X,i.axisA),t.vectorToWorldFrame(r.UNIT_Y,i.axisB),e.vectorToWorldFrame(r.UNIT_Y,s.axisA),t.vectorToWorldFrame(r.UNIT_Z,s.axisB),e.vectorToWorldFrame(r.UNIT_Z,o.axisA),t.vectorToWorldFrame(r.UNIT_X,o.axisB)}},{"../equations/ContactEquation":19,"../equations/RotationalEquation":22,"../equations/RotationalMotorEquation":23,"../math/Vec3":30,"./Constraint":13,"./PointToPointConstraint":17}],17:[function(e,t,i){t.exports=o;var n=e("./Constraint"),s=e("../equations/ContactEquation"),r=e("../math/Vec3");function o(e,t,i,o,a){n.call(this,e,i),a=void 0!==a?a:1e6,this.pivotA=t?t.clone():new r,this.pivotB=o?o.clone():new r;var l=this.equationX=new s(e,i),h=this.equationY=new s(e,i),c=this.equationZ=new s(e,i);this.equations.push(l,h,c),l.minForce=h.minForce=c.minForce=-a,l.maxForce=h.maxForce=c.maxForce=a,l.ni.set(1,0,0),h.ni.set(0,1,0),c.ni.set(0,0,1)}o.prototype=new n,o.prototype.update=function(){var e=this.bodyA,t=this.bodyB,i=this.equationX,n=this.equationY,s=this.equationZ;e.quaternion.vmult(this.pivotA,i.ri),t.quaternion.vmult(this.pivotB,i.rj),n.ri.copy(i.ri),n.rj.copy(i.rj),s.ri.copy(i.ri),s.rj.copy(i.rj)}},{"../equations/ContactEquation":19,"../math/Vec3":30,"./Constraint":13}],18:[function(e,t,i){t.exports=r;var n=e("../math/Vec3"),s=(e("../math/Mat3"),e("./Equation"));function r(e,t,i){var r=void 0!==(i=i||{}).maxForce?i.maxForce:1e6;s.call(this,e,t,-r,r),this.axisA=i.axisA?i.axisA.clone():new n(1,0,0),this.axisB=i.axisB?i.axisB.clone():new n(0,1,0),this.angle=void 0!==i.angle?i.angle:0}r.prototype=new s,r.prototype.constructor=r;var o=new n,a=new n;r.prototype.computeB=function(e){var t=this.a,i=this.b,n=this.axisA,s=this.axisB,r=o,l=a,h=this.jacobianElementA,c=this.jacobianElementB;return n.cross(s,r),s.cross(n,l),h.rotational.copy(l),c.rotational.copy(r),-(Math.cos(this.angle)-n.dot(s))*t-this.computeGW()*i-e*this.computeGiMf()}},{"../math/Mat3":27,"../math/Vec3":30,"./Equation":20}],19:[function(e,t,i){t.exports=r;var n=e("./Equation"),s=e("../math/Vec3");function r(e,t,i){i=void 0!==i?i:1e6,n.call(this,e,t,0,i),this.restitution=0,this.ri=new s,this.rj=new s,this.ni=new s}e("../math/Mat3"),r.prototype=new n,r.prototype.constructor=r;var o=new s,a=new s,l=new s;r.prototype.computeB=function(e){var t=this.a,i=this.b,n=this.bi,s=this.bj,r=this.ri,h=this.rj,c=o,u=a,d=n.velocity,p=n.angularVelocity,f=(n.force,n.torque,s.velocity),_=s.angularVelocity,m=(s.force,s.torque,l),g=this.jacobianElementA,v=this.jacobianElementB,y=this.ni;r.cross(y,c),h.cross(y,u),y.negate(g.spatial),c.negate(g.rotational),v.spatial.copy(y),v.rotational.copy(u),m.copy(s.position),m.vadd(h,m),m.vsub(n.position,m),m.vsub(r,m);var x=y.dot(m),b=this.restitution+1;return-x*t-(b*f.dot(y)-b*d.dot(y)+_.dot(u)-p.dot(c))*i-e*this.computeGiMf()};var h=new s,c=new s,u=new s,d=new s,p=new s;r.prototype.getImpactVelocityAlongNormal=function(){var e=h,t=c,i=u,n=d,s=p;return this.bi.position.vadd(this.ri,i),this.bj.position.vadd(this.rj,n),this.bi.getVelocityAtWorldPoint(i,e),this.bj.getVelocityAtWorldPoint(n,t),e.vsub(t,s),this.ni.dot(s)}},{"../math/Mat3":27,"../math/Vec3":30,"./Equation":20}],20:[function(e,t,i){t.exports=r;var n=e("../math/JacobianElement"),s=e("../math/Vec3");function r(e,t,i,s){this.id=r.id++,this.minForce=void 0===i?-1e6:i,this.maxForce=void 0===s?1e6:s,this.bi=e,this.bj=t,this.a=0,this.b=0,this.eps=0,this.jacobianElementA=new n,this.jacobianElementB=new n,this.enabled=!0,this.setSpookParams(1e7,4,1/60)}r.prototype.constructor=r,r.id=0,r.prototype.setSpookParams=function(e,t,i){var n=t,s=e,r=i;this.a=4/(r*(1+4*n)),this.b=4*n/(1+4*n),this.eps=4/(r*r*s*(1+4*n))},r.prototype.computeB=function(e,t,i){var n=this.computeGW();return-this.computeGq()*e-n*t-this.computeGiMf()*i},r.prototype.computeGq=function(){var e=this.jacobianElementA,t=this.jacobianElementB,i=this.bi,n=this.bj,s=i.position,r=n.position;return e.spatial.dot(s)+t.spatial.dot(r)};var o=new s;r.prototype.computeGW=function(){var e=this.jacobianElementA,t=this.jacobianElementB,i=this.bi,n=this.bj,s=i.velocity,r=n.velocity,a=i.angularVelocity||o,l=n.angularVelocity||o;return e.multiplyVectors(s,a)+t.multiplyVectors(r,l)},r.prototype.computeGWlambda=function(){var e=this.jacobianElementA,t=this.jacobianElementB,i=this.bi,n=this.bj,s=i.vlambda,r=n.vlambda,a=i.wlambda||o,l=n.wlambda||o;return e.multiplyVectors(s,a)+t.multiplyVectors(r,l)};var a=new s,l=new s,h=new s,c=new s;r.prototype.computeGiMf=function(){var e=this.jacobianElementA,t=this.jacobianElementB,i=this.bi,n=this.bj,s=i.force,r=i.torque,o=n.force,u=n.torque,d=i.invMassSolve,p=n.invMassSolve;return i.invInertiaWorldSolve?i.invInertiaWorldSolve.vmult(r,h):h.set(0,0,0),n.invInertiaWorldSolve?n.invInertiaWorldSolve.vmult(u,c):c.set(0,0,0),s.mult(d,a),o.mult(p,l),e.multiplyVectors(a,h)+t.multiplyVectors(l,c)};var u=new s;r.prototype.computeGiMGt=function(){var e=this.jacobianElementA,t=this.jacobianElementB,i=this.bi,n=this.bj,s=i.invMassSolve,r=n.invMassSolve,o=i.invInertiaWorldSolve,a=n.invInertiaWorldSolve,l=s+r;return o&&(o.vmult(e.rotational,u),l+=u.dot(e.rotational)),a&&(a.vmult(t.rotational,u),l+=u.dot(t.rotational)),l};var d=new s;new s,new s,new s,new s,new s,r.prototype.addToWlambda=function(e){var t=this.jacobianElementA,i=this.jacobianElementB,n=this.bi,s=this.bj,r=d;t.spatial.mult(n.invMassSolve*e,r),n.vlambda.vadd(r,n.vlambda),i.spatial.mult(s.invMassSolve*e,r),s.vlambda.vadd(r,s.vlambda),n.invInertiaWorldSolve&&(n.invInertiaWorldSolve.vmult(t.rotational,r),r.mult(e,r),n.wlambda.vadd(r,n.wlambda)),s.invInertiaWorldSolve&&(s.invInertiaWorldSolve.vmult(i.rotational,r),r.mult(e,r),s.wlambda.vadd(r,s.wlambda))},r.prototype.computeC=function(){return this.computeGiMGt()+this.eps}},{"../math/JacobianElement":26,"../math/Vec3":30}],21:[function(e,t,i){t.exports=r;var n=e("./Equation"),s=e("../math/Vec3");function r(e,t,i){n.call(this,e,t,-i,i),this.ri=new s,this.rj=new s,this.t=new s}e("../math/Mat3"),r.prototype=new n,r.prototype.constructor=r;var o=new s,a=new s;r.prototype.computeB=function(e){this.a;var t=this.b,i=(this.bi,this.bj,this.ri),n=this.rj,s=o,r=a,l=this.t;i.cross(l,s),n.cross(l,r);var h=this.jacobianElementA,c=this.jacobianElementB;return l.negate(h.spatial),s.negate(h.rotational),c.spatial.copy(l),c.rotational.copy(r),-this.computeGW()*t-e*this.computeGiMf()}},{"../math/Mat3":27,"../math/Vec3":30,"./Equation":20}],22:[function(e,t,i){t.exports=r;var n=e("../math/Vec3"),s=(e("../math/Mat3"),e("./Equation"));function r(e,t,i){var r=void 0!==(i=i||{}).maxForce?i.maxForce:1e6;s.call(this,e,t,-r,r),this.axisA=i.axisA?i.axisA.clone():new n(1,0,0),this.axisB=i.axisB?i.axisB.clone():new n(0,1,0),this.maxAngle=Math.PI/2}r.prototype=new s,r.prototype.constructor=r;var o=new n,a=new n;r.prototype.computeB=function(e){var t=this.a,i=this.b,n=this.axisA,s=this.axisB,r=o,l=a,h=this.jacobianElementA,c=this.jacobianElementB;return n.cross(s,r),s.cross(n,l),h.rotational.copy(l),c.rotational.copy(r),-(Math.cos(this.maxAngle)-n.dot(s))*t-this.computeGW()*i-e*this.computeGiMf()}},{"../math/Mat3":27,"../math/Vec3":30,"./Equation":20}],23:[function(e,t,i){t.exports=r;var n=e("../math/Vec3"),s=(e("../math/Mat3"),e("./Equation"));function r(e,t,i){i=void 0!==i?i:1e6,s.call(this,e,t,-i,i),this.axisA=new n,this.axisB=new n,this.targetVelocity=0}r.prototype=new s,r.prototype.constructor=r,r.prototype.computeB=function(e){this.a;var t=this.b,i=(this.bi,this.bj,this.axisA),n=this.axisB,s=this.jacobianElementA,r=this.jacobianElementB;return s.rotational.copy(i),n.negate(r.rotational),-(this.computeGW()-this.targetVelocity)*t-e*this.computeGiMf()}},{"../math/Mat3":27,"../math/Vec3":30,"./Equation":20}],24:[function(e,t,i){var n=e("../utils/Utils");function s(e,t,i){i=n.defaults(i,{friction:.3,restitution:.3,contactEquationStiffness:1e7,contactEquationRelaxation:3,frictionEquationStiffness:1e7,frictionEquationRelaxation:3}),this.id=s.idCounter++,this.materials=[e,t],this.friction=i.friction,this.restitution=i.restitution,this.contactEquationStiffness=i.contactEquationStiffness,this.contactEquationRelaxation=i.contactEquationRelaxation,this.frictionEquationStiffness=i.frictionEquationStiffness,this.frictionEquationRelaxation=i.frictionEquationRelaxation}t.exports=s,s.idCounter=0},{"../utils/Utils":53}],25:[function(e,t,i){function n(e){var t="";"string"==typeof(e=e||{})?(t=e,e={}):"object"==typeof e&&(t=""),this.name=t,this.id=n.idCounter++,this.friction=void 0!==e.friction?e.friction:-1,this.restitution=void 0!==e.restitution?e.restitution:-1}t.exports=n,n.idCounter=0},{}],26:[function(e,t,i){t.exports=s;var n=e("./Vec3");function s(){this.spatial=new n,this.rotational=new n}s.prototype.multiplyElement=function(e){return e.spatial.dot(this.spatial)+e.rotational.dot(this.rotational)},s.prototype.multiplyVectors=function(e,t){return e.dot(this.spatial)+t.dot(this.rotational)}},{"./Vec3":30}],27:[function(e,t,i){t.exports=s;var n=e("./Vec3");function s(e){this.elements=e||[0,0,0,0,0,0,0,0,0]}s.prototype.identity=function(){var e=this.elements;e[0]=1,e[1]=0,e[2]=0,e[3]=0,e[4]=1,e[5]=0,e[6]=0,e[7]=0,e[8]=1},s.prototype.setZero=function(){var e=this.elements;e[0]=0,e[1]=0,e[2]=0,e[3]=0,e[4]=0,e[5]=0,e[6]=0,e[7]=0,e[8]=0},s.prototype.setTrace=function(e){var t=this.elements;t[0]=e.x,t[4]=e.y,t[8]=e.z},s.prototype.getTrace=function(e){e=e||new n;var t=this.elements;e.x=t[0],e.y=t[4],e.z=t[8]},s.prototype.vmult=function(e,t){t=t||new n;var i=this.elements,s=e.x,r=e.y,o=e.z;return t.x=i[0]*s+i[1]*r+i[2]*o,t.y=i[3]*s+i[4]*r+i[5]*o,t.z=i[6]*s+i[7]*r+i[8]*o,t},s.prototype.smult=function(e){for(var t=0;t<this.elements.length;t++)this.elements[t]*=e},s.prototype.mmult=function(e,t){for(var i=t||new s,n=0;n<3;n++)for(var r=0;r<3;r++){for(var o=0,a=0;a<3;a++)o+=e.elements[n+3*a]*this.elements[a+3*r];i.elements[n+3*r]=o}return i},s.prototype.scale=function(e,t){t=t||new s;for(var i=this.elements,n=t.elements,r=0;3!==r;r++)n[3*r+0]=e.x*i[3*r+0],n[3*r+1]=e.y*i[3*r+1],n[3*r+2]=e.z*i[3*r+2];return t},s.prototype.solve=function(e,t){t=t||new n;for(var i,s=[],r=0;r<12;r++)s.push(0);for(r=0;r<3;r++)for(i=0;i<3;i++)s[r+4*i]=this.elements[r+3*i];s[3]=e.x,s[7]=e.y,s[11]=e.z;var o,a,l=3,h=l;do{if(0===s[(r=h-l)+4*r])for(i=r+1;i<h;i++)if(0!==s[r+4*i]){o=4;do{s[(a=4-o)+4*r]+=s[a+4*i]}while(--o);break}if(0!==s[r+4*r])for(i=r+1;i<h;i++){var c=s[r+4*i]/s[r+4*r];o=4;do{s[(a=4-o)+4*i]=a<=r?0:s[a+4*i]-s[a+4*r]*c}while(--o)}}while(--l);if(t.z=s[11]/s[10],t.y=(s[7]-s[6]*t.z)/s[5],t.x=(s[3]-s[2]*t.z-s[1]*t.y)/s[0],isNaN(t.x)||isNaN(t.y)||isNaN(t.z)||t.x===1/0||t.y===1/0||t.z===1/0)throw"Could not solve equation! Got x=["+t.toString()+"], b=["+e.toString()+"], A=["+this.toString()+"]";return t},s.prototype.e=function(e,t,i){if(void 0===i)return this.elements[t+3*e];this.elements[t+3*e]=i},s.prototype.copy=function(e){for(var t=0;t<e.elements.length;t++)this.elements[t]=e.elements[t];return this},s.prototype.toString=function(){for(var e="",t=0;t<9;t++)e+=this.elements[t]+",";return e},s.prototype.reverse=function(e){e=e||new s;for(var t,i=[],n=0;n<18;n++)i.push(0);for(n=0;n<3;n++)for(t=0;t<3;t++)i[n+6*t]=this.elements[n+3*t];i[3]=1,i[9]=0,i[15]=0,i[4]=0,i[10]=1,i[16]=0,i[5]=0,i[11]=0,i[17]=1;var r,o,a=3,l=a;do{if(0===i[(n=l-a)+6*n])for(t=n+1;t<l;t++)if(0!==i[n+6*t]){r=6;do{i[(o=6-r)+6*n]+=i[o+6*t]}while(--r);break}if(0!==i[n+6*n])for(t=n+1;t<l;t++){var h=i[n+6*t]/i[n+6*n];r=6;do{i[(o=6-r)+6*t]=o<=n?0:i[o+6*t]-i[o+6*n]*h}while(--r)}}while(--a);n=2;do{t=n-1;do{h=i[n+6*t]/i[n+6*n],r=6;do{i[(o=6-r)+6*t]=i[o+6*t]-i[o+6*n]*h}while(--r)}while(t--)}while(--n);n=2;do{h=1/i[n+6*n],r=6;do{i[(o=6-r)+6*n]=i[o+6*n]*h}while(--r)}while(n--);n=2;do{t=2;do{if(o=i[3+t+6*n],isNaN(o)||o===1/0)throw"Could not reverse! A=["+this.toString()+"]";e.e(n,t,o)}while(t--)}while(n--);return e},s.prototype.setRotationFromQuaternion=function(e){var t=e.x,i=e.y,n=e.z,s=e.w,r=t+t,o=i+i,a=n+n,l=t*r,h=t*o,c=t*a,u=i*o,d=i*a,p=n*a,f=s*r,_=s*o,m=s*a,g=this.elements;return g[0]=1-(u+p),g[1]=h-m,g[2]=c+_,g[3]=h+m,g[4]=1-(l+p),g[5]=d-f,g[6]=c-_,g[7]=d+f,g[8]=1-(l+u),this},s.prototype.transpose=function(e){for(var t=(e=e||new s).elements,i=this.elements,n=0;3!==n;n++)for(var r=0;3!==r;r++)t[3*n+r]=i[3*r+n];return e}},{"./Vec3":30}],28:[function(e,t,i){t.exports=s;var n=e("./Vec3");function s(e,t,i,n){this.x=void 0!==e?e:0,this.y=void 0!==t?t:0,this.z=void 0!==i?i:0,this.w=void 0!==n?n:1}s.prototype.set=function(e,t,i,n){this.x=e,this.y=t,this.z=i,this.w=n},s.prototype.toString=function(){return this.x+","+this.y+","+this.z+","+this.w},s.prototype.toArray=function(){return[this.x,this.y,this.z,this.w]},s.prototype.setFromAxisAngle=function(e,t){var i=Math.sin(.5*t);this.x=e.x*i,this.y=e.y*i,this.z=e.z*i,this.w=Math.cos(.5*t)},s.prototype.toAxisAngle=function(e){e=e||new n,this.normalize();var t=2*Math.acos(this.w),i=Math.sqrt(1-this.w*this.w);return i<.001?(e.x=this.x,e.y=this.y,e.z=this.z):(e.x=this.x/i,e.y=this.y/i,e.z=this.z/i),[e,t]};var r=new n,o=new n;s.prototype.setFromVectors=function(e,t){if(e.isAntiparallelTo(t)){var i=r,n=o;e.tangents(i,n),this.setFromAxisAngle(i,Math.PI)}else{var s=e.cross(t);this.x=s.x,this.y=s.y,this.z=s.z,this.w=Math.sqrt(Math.pow(e.norm(),2)*Math.pow(t.norm(),2))+e.dot(t),this.normalize()}};var a=new n,l=new n,h=new n;s.prototype.mult=function(e,t){t=t||new s;var i=this.w,n=a,r=l,o=h;return n.set(this.x,this.y,this.z),r.set(e.x,e.y,e.z),t.w=i*e.w-n.dot(r),n.cross(r,o),t.x=i*r.x+e.w*n.x+o.x,t.y=i*r.y+e.w*n.y+o.y,t.z=i*r.z+e.w*n.z+o.z,t},s.prototype.inverse=function(e){var t=this.x,i=this.y,n=this.z,r=this.w;e=e||new s,this.conjugate(e);var o=1/(t*t+i*i+n*n+r*r);return e.x*=o,e.y*=o,e.z*=o,e.w*=o,e},s.prototype.conjugate=function(e){return(e=e||new s).x=-this.x,e.y=-this.y,e.z=-this.z,e.w=this.w,e},s.prototype.normalize=function(){var e=Math.sqrt(this.x*this.x+this.y*this.y+this.z*this.z+this.w*this.w);0===e?(this.x=0,this.y=0,this.z=0,this.w=0):(e=1/e,this.x*=e,this.y*=e,this.z*=e,this.w*=e)},s.prototype.normalizeFast=function(){var e=(3-(this.x*this.x+this.y*this.y+this.z*this.z+this.w*this.w))/2;0===e?(this.x=0,this.y=0,this.z=0,this.w=0):(this.x*=e,this.y*=e,this.z*=e,this.w*=e)},s.prototype.vmult=function(e,t){t=t||new n;var i=e.x,s=e.y,r=e.z,o=this.x,a=this.y,l=this.z,h=this.w,c=h*i+a*r-l*s,u=h*s+l*i-o*r,d=h*r+o*s-a*i,p=-o*i-a*s-l*r;return t.x=c*h+p*-o+u*-l-d*-a,t.y=u*h+p*-a+d*-o-c*-l,t.z=d*h+p*-l+c*-a-u*-o,t},s.prototype.copy=function(e){return this.x=e.x,this.y=e.y,this.z=e.z,this.w=e.w,this},s.prototype.toEuler=function(e,t){var i,n,s;t=t||"YZX";var r=this.x,o=this.y,a=this.z,l=this.w;if("YZX"!==t)throw new Error("Euler order "+t+" not supported yet.");var h=r*o+a*l;if(h>.499&&(i=2*Math.atan2(r,l),n=Math.PI/2,s=0),h<-.499&&(i=-2*Math.atan2(r,l),n=-Math.PI/2,s=0),isNaN(i)){var c=r*r,u=o*o,d=a*a;i=Math.atan2(2*o*l-2*r*a,1-2*u-2*d),n=Math.asin(2*h),s=Math.atan2(2*r*l-2*o*a,1-2*c-2*d)}e.y=i,e.z=n,e.x=s},s.prototype.setFromEuler=function(e,t,i,n){n=n||"XYZ";var s=Math.cos(e/2),r=Math.cos(t/2),o=Math.cos(i/2),a=Math.sin(e/2),l=Math.sin(t/2),h=Math.sin(i/2);return"XYZ"===n?(this.x=a*r*o+s*l*h,this.y=s*l*o-a*r*h,this.z=s*r*h+a*l*o,this.w=s*r*o-a*l*h):"YXZ"===n?(this.x=a*r*o+s*l*h,this.y=s*l*o-a*r*h,this.z=s*r*h-a*l*o,this.w=s*r*o+a*l*h):"ZXY"===n?(this.x=a*r*o-s*l*h,this.y=s*l*o+a*r*h,this.z=s*r*h+a*l*o,this.w=s*r*o-a*l*h):"ZYX"===n?(this.x=a*r*o-s*l*h,this.y=s*l*o+a*r*h,this.z=s*r*h-a*l*o,this.w=s*r*o+a*l*h):"YZX"===n?(this.x=a*r*o+s*l*h,this.y=s*l*o+a*r*h,this.z=s*r*h-a*l*o,this.w=s*r*o-a*l*h):"XZY"===n&&(this.x=a*r*o-s*l*h,this.y=s*l*o-a*r*h,this.z=s*r*h+a*l*o,this.w=s*r*o+a*l*h),this},s.prototype.clone=function(){return new s(this.x,this.y,this.z,this.w)}},{"./Vec3":30}],29:[function(e,t,i){var n=e("./Vec3"),s=e("./Quaternion");function r(e){e=e||{},this.position=new n,e.position&&this.position.copy(e.position),this.quaternion=new s,e.quaternion&&this.quaternion.copy(e.quaternion)}t.exports=r;var o=new s;r.pointToLocalFrame=function(e,t,i,s){return s=s||new n,i.vsub(e,s),t.conjugate(o),o.vmult(s,s),s},r.prototype.pointToLocal=function(e,t){return r.pointToLocalFrame(this.position,this.quaternion,e,t)},r.pointToWorldFrame=function(e,t,i,s){return s=s||new n,t.vmult(i,s),s.vadd(e,s),s},r.prototype.pointToWorld=function(e,t){return r.pointToWorldFrame(this.position,this.quaternion,e,t)},r.prototype.vectorToWorldFrame=function(e,t){return t=t||new n,this.quaternion.vmult(e,t),t},r.vectorToWorldFrame=function(e,t,i){return e.vmult(t,i),i},r.vectorToLocalFrame=function(e,t,i,s){return s=s||new n,t.w*=-1,t.vmult(i,s),t.w*=-1,s}},{"./Quaternion":28,"./Vec3":30}],30:[function(e,t,i){t.exports=s;var n=e("./Mat3");function s(e,t,i){this.x=e||0,this.y=t||0,this.z=i||0}s.ZERO=new s(0,0,0),s.UNIT_X=new s(1,0,0),s.UNIT_Y=new s(0,1,0),s.UNIT_Z=new s(0,0,1),s.prototype.cross=function(e,t){var i=e.x,n=e.y,r=e.z,o=this.x,a=this.y,l=this.z;return(t=t||new s).x=a*r-l*n,t.y=l*i-o*r,t.z=o*n-a*i,t},s.prototype.set=function(e,t,i){return this.x=e,this.y=t,this.z=i,this},s.prototype.setZero=function(){this.x=this.y=this.z=0},s.prototype.vadd=function(e,t){if(!t)return new s(this.x+e.x,this.y+e.y,this.z+e.z);t.x=e.x+this.x,t.y=e.y+this.y,t.z=e.z+this.z},s.prototype.vsub=function(e,t){if(!t)return new s(this.x-e.x,this.y-e.y,this.z-e.z);t.x=this.x-e.x,t.y=this.y-e.y,t.z=this.z-e.z},s.prototype.crossmat=function(){return new n([0,-this.z,this.y,this.z,0,-this.x,-this.y,this.x,0])},s.prototype.normalize=function(){var e=this.x,t=this.y,i=this.z,n=Math.sqrt(e*e+t*t+i*i);if(n>0){var s=1/n;this.x*=s,this.y*=s,this.z*=s}else this.x=0,this.y=0,this.z=0;return n},s.prototype.unit=function(e){e=e||new s;var t=this.x,i=this.y,n=this.z,r=Math.sqrt(t*t+i*i+n*n);return r>0?(r=1/r,e.x=t*r,e.y=i*r,e.z=n*r):(e.x=1,e.y=0,e.z=0),e},s.prototype.norm=function(){var e=this.x,t=this.y,i=this.z;return Math.sqrt(e*e+t*t+i*i)},s.prototype.length=s.prototype.norm,s.prototype.norm2=function(){return this.dot(this)},s.prototype.lengthSquared=s.prototype.norm2,s.prototype.distanceTo=function(e){var t=this.x,i=this.y,n=this.z,s=e.x,r=e.y,o=e.z;return Math.sqrt((s-t)*(s-t)+(r-i)*(r-i)+(o-n)*(o-n))},s.prototype.distanceSquared=function(e){var t=this.x,i=this.y,n=this.z,s=e.x,r=e.y,o=e.z;return(s-t)*(s-t)+(r-i)*(r-i)+(o-n)*(o-n)},s.prototype.mult=function(e,t){t=t||new s;var i=this.x,n=this.y,r=this.z;return t.x=e*i,t.y=e*n,t.z=e*r,t},s.prototype.scale=s.prototype.mult,s.prototype.dot=function(e){return this.x*e.x+this.y*e.y+this.z*e.z},s.prototype.isZero=function(){return 0===this.x&&0===this.y&&0===this.z},s.prototype.negate=function(e){return(e=e||new s).x=-this.x,e.y=-this.y,e.z=-this.z,e};var r=new s,o=new s;s.prototype.tangents=function(e,t){var i=this.norm();if(i>0){var n=r,s=1/i;n.set(this.x*s,this.y*s,this.z*s);var a=o;Math.abs(n.x)<.9?(a.set(1,0,0),n.cross(a,e)):(a.set(0,1,0),n.cross(a,e)),n.cross(e,t)}else e.set(1,0,0),t.set(0,1,0)},s.prototype.toString=function(){return this.x+","+this.y+","+this.z},s.prototype.toArray=function(){return[this.x,this.y,this.z]},s.prototype.copy=function(e){return this.x=e.x,this.y=e.y,this.z=e.z,this},s.prototype.lerp=function(e,t,i){var n=this.x,s=this.y,r=this.z;i.x=n+(e.x-n)*t,i.y=s+(e.y-s)*t,i.z=r+(e.z-r)*t},s.prototype.almostEquals=function(e,t){return void 0===t&&(t=1e-6),!(Math.abs(this.x-e.x)>t||Math.abs(this.y-e.y)>t||Math.abs(this.z-e.z)>t)},s.prototype.almostZero=function(e){return void 0===e&&(e=1e-6),!(Math.abs(this.x)>e||Math.abs(this.y)>e||Math.abs(this.z)>e)};var a=new s;s.prototype.isAntiparallelTo=function(e,t){return this.negate(a),a.almostEquals(e,t)},s.prototype.clone=function(){return new s(this.x,this.y,this.z)}},{"./Mat3":27}],31:[function(e,t,i){t.exports=h;var n=e("../utils/EventTarget"),s=(e("../shapes/Shape"),e("../math/Vec3")),r=e("../math/Mat3"),o=e("../math/Quaternion"),a=(e("../material/Material"),e("../collision/AABB")),l=e("../shapes/Box");function h(e){e=e||{},n.apply(this),this.id=h.idCounter++,this.world=null,this.preStep=null,this.postStep=null,this.vlambda=new s,this.collisionFilterGroup="number"==typeof e.collisionFilterGroup?e.collisionFilterGroup:1,this.collisionFilterMask="number"==typeof e.collisionFilterMask?e.collisionFilterMask:1,this.collisionResponse=!0,this.position=new s,e.position&&this.position.copy(e.position),this.previousPosition=new s,this.initPosition=new s,this.velocity=new s,e.velocity&&this.velocity.copy(e.velocity),this.initVelocity=new s,this.force=new s;var t="number"==typeof e.mass?e.mass:0;this.mass=t,this.invMass=t>0?1/t:0,this.material=e.material||null,this.linearDamping="number"==typeof e.linearDamping?e.linearDamping:.01,this.type=t<=0?h.STATIC:h.DYNAMIC,typeof e.type==typeof h.STATIC&&(this.type=e.type),this.allowSleep=void 0===e.allowSleep||e.allowSleep,this.sleepState=0,this.sleepSpeedLimit=void 0!==e.sleepSpeedLimit?e.sleepSpeedLimit:.1,this.sleepTimeLimit=void 0!==e.sleepTimeLimit?e.sleepTimeLimit:1,this.timeLastSleepy=0,this._wakeUpAfterNarrowphase=!1,this.torque=new s,this.quaternion=new o,e.quaternion&&this.quaternion.copy(e.quaternion),this.initQuaternion=new o,this.angularVelocity=new s,e.angularVelocity&&this.angularVelocity.copy(e.angularVelocity),this.initAngularVelocity=new s,this.interpolatedPosition=new s,this.interpolatedQuaternion=new o,this.shapes=[],this.shapeOffsets=[],this.shapeOrientations=[],this.inertia=new s,this.invInertia=new s,this.invInertiaWorld=new r,this.invMassSolve=0,this.invInertiaSolve=new s,this.invInertiaWorldSolve=new r,this.fixedRotation=void 0!==e.fixedRotation&&e.fixedRotation,this.angularDamping=void 0!==e.angularDamping?e.angularDamping:.01,this.aabb=new a,this.aabbNeedsUpdate=!0,this.wlambda=new s,e.shape&&this.addShape(e.shape),this.updateMassProperties()}h.prototype=new n,h.prototype.constructor=h,h.DYNAMIC=1,h.STATIC=2,h.KINEMATIC=4,h.AWAKE=0,h.SLEEPY=1,h.SLEEPING=2,h.idCounter=0,h.prototype.wakeUp=function(){var e=this.sleepState;this.sleepState=0,e===h.SLEEPING&&this.dispatchEvent({type:"wakeup"})},h.prototype.sleep=function(){this.sleepState=h.SLEEPING,this.velocity.set(0,0,0),this.angularVelocity.set(0,0,0)},h.sleepyEvent={type:"sleepy"},h.sleepEvent={type:"sleep"},h.prototype.sleepTick=function(e){if(this.allowSleep){var t=this.sleepState,i=this.velocity.norm2()+this.angularVelocity.norm2(),n=Math.pow(this.sleepSpeedLimit,2);t===h.AWAKE&&i<n?(this.sleepState=h.SLEEPY,this.timeLastSleepy=e,this.dispatchEvent(h.sleepyEvent)):t===h.SLEEPY&&i>n?this.wakeUp():t===h.SLEEPY&&e-this.timeLastSleepy>this.sleepTimeLimit&&(this.sleep(),this.dispatchEvent(h.sleepEvent))}},h.prototype.updateSolveMassProperties=function(){this.sleepState===h.SLEEPING||this.type===h.KINEMATIC?(this.invMassSolve=0,this.invInertiaSolve.setZero(),this.invInertiaWorldSolve.setZero()):(this.invMassSolve=this.invMass,this.invInertiaSolve.copy(this.invInertia),this.invInertiaWorldSolve.copy(this.invInertiaWorld))},h.prototype.pointToLocalFrame=function(e,t){return t=t||new s,e.vsub(this.position,t),this.quaternion.conjugate().vmult(t,t),t},h.prototype.vectorToLocalFrame=function(e,t){return t=t||new s,this.quaternion.conjugate().vmult(e,t),t},h.prototype.pointToWorldFrame=function(e,t){return t=t||new s,this.quaternion.vmult(e,t),t.vadd(this.position,t),t},h.prototype.vectorToWorldFrame=function(e,t){return t=t||new s,this.quaternion.vmult(e,t),t};var c=new s,u=new o;h.prototype.addShape=function(e,t,i){var n=new s,r=new o;return t&&n.copy(t),i&&r.copy(i),this.shapes.push(e),this.shapeOffsets.push(n),this.shapeOrientations.push(r),this.updateMassProperties(),this.updateBoundingRadius(),this.aabbNeedsUpdate=!0,this},h.prototype.updateBoundingRadius=function(){for(var e=this.shapes,t=this.shapeOffsets,i=e.length,n=0,s=0;s!==i;s++){var r=e[s];r.updateBoundingSphereRadius();var o=t[s].norm(),a=r.boundingSphereRadius;o+a>n&&(n=o+a)}this.boundingRadius=n};var d=new a;h.prototype.computeAABB=function(){for(var e=this.shapes,t=this.shapeOffsets,i=this.shapeOrientations,n=e.length,s=c,r=u,o=this.quaternion,a=this.aabb,l=d,h=0;h!==n;h++){var p=e[h];i[h].mult(o,r),r.vmult(t[h],s),s.vadd(this.position,s),p.calculateWorldAABB(s,r,l.lowerBound,l.upperBound),0===h?a.copy(l):a.extend(l)}this.aabbNeedsUpdate=!1};var p=new r,f=new r;new r,h.prototype.updateInertiaWorld=function(e){var t=this.invInertia;if(t.x!==t.y||t.y!==t.z||e){var i=p,n=f;i.setRotationFromQuaternion(this.quaternion),i.transpose(n),i.scale(t,i),i.mmult(n,this.invInertiaWorld)}};var _=new s,m=new s;h.prototype.applyForce=function(e,t){if(this.type===h.DYNAMIC){var i=_;t.vsub(this.position,i);var n=m;i.cross(e,n),this.force.vadd(e,this.force),this.torque.vadd(n,this.torque)}};var g=new s,v=new s;h.prototype.applyLocalForce=function(e,t){if(this.type===h.DYNAMIC){var i=g,n=v;this.vectorToWorldFrame(e,i),this.pointToWorldFrame(t,n),this.applyForce(i,n)}};var y=new s,x=new s,b=new s;h.prototype.applyImpulse=function(e,t){if(this.type===h.DYNAMIC){var i=y;t.vsub(this.position,i);var n=x;n.copy(e),n.mult(this.invMass,n),this.velocity.vadd(n,this.velocity);var s=b;i.cross(e,s),this.invInertiaWorld.vmult(s,s),this.angularVelocity.vadd(s,this.angularVelocity)}};var T=new s,S=new s;h.prototype.applyLocalImpulse=function(e,t){if(this.type===h.DYNAMIC){var i=T,n=S;this.vectorToWorldFrame(e,i),this.pointToWorldFrame(t,n),this.applyImpulse(i,n)}};var E=new s;h.prototype.updateMassProperties=function(){var e=E;this.invMass=this.mass>0?1/this.mass:0;var t=this.inertia,i=this.fixedRotation;this.computeAABB(),e.set((this.aabb.upperBound.x-this.aabb.lowerBound.x)/2,(this.aabb.upperBound.y-this.aabb.lowerBound.y)/2,(this.aabb.upperBound.z-this.aabb.lowerBound.z)/2),l.calculateInertia(e,this.mass,t),this.invInertia.set(t.x>0&&!i?1/t.x:0,t.y>0&&!i?1/t.y:0,t.z>0&&!i?1/t.z:0),this.updateInertiaWorld(!0)},h.prototype.getVelocityAtWorldPoint=function(e,t){var i=new s;return e.vsub(this.position,i),this.angularVelocity.cross(i,t),this.velocity.vadd(t,t),t}},{"../collision/AABB":3,"../material/Material":25,"../math/Mat3":27,"../math/Quaternion":28,"../math/Vec3":30,"../shapes/Box":37,"../shapes/Shape":43,"../utils/EventTarget":49}],32:[function(e,t,i){e("./Body");var n=e("../math/Vec3"),s=e("../math/Quaternion"),r=(e("../collision/RaycastResult"),e("../collision/Ray")),o=e("../objects/WheelInfo");function a(e){this.chassisBody=e.chassisBody,this.wheelInfos=[],this.sliding=!1,this.world=null,this.indexRightAxis=void 0!==e.indexRightAxis?e.indexRightAxis:1,this.indexForwardAxis=void 0!==e.indexForwardAxis?e.indexForwardAxis:0,this.indexUpAxis=void 0!==e.indexUpAxis?e.indexUpAxis:2}t.exports=a,new n,new n,new n;var l=new n,h=new n,c=new n;new r,a.prototype.addWheel=function(e){var t=new o(e=e||{}),i=this.wheelInfos.length;return this.wheelInfos.push(t),i},a.prototype.setSteeringValue=function(e,t){this.wheelInfos[t].steering=e},new n,a.prototype.applyEngineForce=function(e,t){this.wheelInfos[t].engineForce=e},a.prototype.setBrake=function(e,t){this.wheelInfos[t].brake=e},a.prototype.addToWorld=function(e){this.constraints,e.add(this.chassisBody);var t=this;this.preStepCallback=function(){t.updateVehicle(e.dt)},e.addEventListener("preStep",this.preStepCallback),this.world=e},a.prototype.getVehicleAxisWorld=function(e,t){t.set(0===e?1:0,1===e?1:0,2===e?1:0),this.chassisBody.vectorToWorldFrame(t,t)},a.prototype.updateVehicle=function(e){for(var t=this.wheelInfos,i=t.length,s=this.chassisBody,r=0;r<i;r++)this.updateWheelTransform(r);this.currentVehicleSpeedKmHour=3.6*s.velocity.norm();var o=new n;for(this.getVehicleAxisWorld(this.indexForwardAxis,o),o.dot(s.velocity)<0&&(this.currentVehicleSpeedKmHour*=-1),r=0;r<i;r++)this.castRay(t[r]);this.updateSuspension(e);var a=new n,l=new n;for(r=0;r<i;r++){var h=(p=t[r]).suspensionForce;h>p.maxSuspensionForce&&(h=p.maxSuspensionForce),p.raycastResult.hitNormalWorld.scale(h*e,a),p.raycastResult.hitPointWorld.vsub(s.position,l),s.applyImpulse(a,p.raycastResult.hitPointWorld)}this.updateFriction(e);var c=new n,u=new n,d=new n;for(r=0;r<i;r++){var p=t[r];s.getVelocityAtWorldPoint(p.chassisConnectionPointWorld,d);var f=1;if(1===this.indexUpAxis&&(f=-1),p.isInContact){this.getVehicleAxisWorld(this.indexForwardAxis,u);var _=u.dot(p.raycastResult.hitNormalWorld);p.raycastResult.hitNormalWorld.scale(_,c),u.vsub(c,u);var m=u.dot(d);p.deltaRotation=f*m*e/p.radius}!p.sliding&&p.isInContact||0===p.engineForce||!p.useCustomSlidingRotationalSpeed||(p.deltaRotation=(p.engineForce>0?1:-1)*p.customSlidingRotationalSpeed*e),Math.abs(p.brake)>Math.abs(p.engineForce)&&(p.deltaRotation=0),p.rotation+=p.deltaRotation,p.deltaRotation*=.99}},a.prototype.updateSuspension=function(e){for(var t=this.chassisBody.mass,i=this.wheelInfos,n=i.length,s=0;s<n;s++){var r=i[s];if(r.isInContact){var o,a=r.suspensionRestLength-r.suspensionLength;o=r.suspensionStiffness*a*r.clippedInvContactDotSuspension;var l=r.suspensionRelativeVelocity;o-=(l<0?r.dampingCompression:r.dampingRelaxation)*l,r.suspensionForce=o*t,r.suspensionForce<0&&(r.suspensionForce=0)}else r.suspensionForce=0}},a.prototype.removeFromWorld=function(e){this.constraints,e.remove(this.chassisBody),e.removeEventListener("preStep",this.preStepCallback),this.world=null};var u=new n,d=new n;a.prototype.castRay=function(e){var t=u,i=d;this.updateWheelTransformWorld(e);var s=this.chassisBody,r=-1,o=e.suspensionRestLength+e.radius;e.directionWorld.scale(o,t);var a=e.chassisConnectionPointWorld;a.vadd(t,i);var l=e.raycastResult;l.reset();var h=s.collisionResponse;s.collisionResponse=!1,this.world.rayTest(a,i,l),s.collisionResponse=h;var c=l.body;if(e.raycastResult.groundObject=0,c){r=l.distance,e.raycastResult.hitNormalWorld=l.hitNormalWorld,e.isInContact=!0;var p=l.distance;e.suspensionLength=p-e.radius;var f=e.suspensionRestLength-e.maxSuspensionTravel,_=e.suspensionRestLength+e.maxSuspensionTravel;e.suspensionLength<f&&(e.suspensionLength=f),e.suspensionLength>_&&(e.suspensionLength=_,e.raycastResult.reset());var m=e.raycastResult.hitNormalWorld.dot(e.directionWorld),g=new n;s.getVelocityAtWorldPoint(e.raycastResult.hitPointWorld,g);var v=e.raycastResult.hitNormalWorld.dot(g);if(m>=-.1)e.suspensionRelativeVelocity=0,e.clippedInvContactDotSuspension=10;else{var y=-1/m;e.suspensionRelativeVelocity=v*y,e.clippedInvContactDotSuspension=y}}else e.suspensionLength=e.suspensionRestLength+0*e.maxSuspensionTravel,e.suspensionRelativeVelocity=0,e.directionWorld.scale(-1,e.raycastResult.hitNormalWorld),e.clippedInvContactDotSuspension=1;return r},a.prototype.updateWheelTransformWorld=function(e){e.isInContact=!1;var t=this.chassisBody;t.pointToWorldFrame(e.chassisConnectionPointLocal,e.chassisConnectionPointWorld),t.vectorToWorldFrame(e.directionLocal,e.directionWorld),t.vectorToWorldFrame(e.axleLocal,e.axleWorld)},a.prototype.updateWheelTransform=function(e){var t=l,i=h,n=c,r=this.wheelInfos[e];this.updateWheelTransformWorld(r),r.directionLocal.scale(-1,t),i.copy(r.axleLocal),t.cross(i,n),n.normalize(),i.normalize();var o=r.steering,a=new s;a.setFromAxisAngle(t,o);var u=new s;u.setFromAxisAngle(i,r.rotation);var d=r.worldTransform.quaternion;this.chassisBody.quaternion.mult(a,d),d.mult(u,d),d.normalize();var p=r.worldTransform.position;p.copy(r.directionWorld),p.scale(r.suspensionLength,p),p.vadd(r.chassisConnectionPointWorld,p)};var p=[new n(1,0,0),new n(0,1,0),new n(0,0,1)];a.prototype.getWheelTransformWorld=function(e){return this.wheelInfos[e].worldTransform};var f=new n,_=[],m=[];a.prototype.updateFriction=function(e){for(var t=f,i=this.wheelInfos,s=i.length,r=this.chassisBody,o=m,a=_,l=0;l<s;l++)d=(A=i[l]).raycastResult.body,A.sideImpulse=0,A.forwardImpulse=0,o[l]||(o[l]=new n),a[l]||(a[l]=new n);for(l=0;l<s;l++)if(d=(A=i[l]).raycastResult.body){var h=a[l];this.getWheelTransformWorld(l).vectorToWorldFrame(p[this.indexRightAxis],h);var c=A.raycastResult.hitNormalWorld,u=h.dot(c);c.scale(u,t),h.vsub(t,h),h.normalize(),c.cross(h,o[l]),o[l].normalize(),A.sideImpulse=M(r,A.raycastResult.hitPointWorld,d,A.raycastResult.hitPointWorld,h),A.sideImpulse*=1}for(this.sliding=!1,l=0;l<s;l++){var d=(A=i[l]).raycastResult.body,g=0;if(A.slipInfo=1,d){var v=A.brake?A.brake:0;g=x(r,d,A.raycastResult.hitPointWorld,o[l],v);var y=v/(g+=A.engineForce*e);A.slipInfo*=y}if(A.forwardImpulse=0,A.skidInfo=1,d){A.skidInfo=1;var b=A.suspensionForce*e*A.frictionSlip,T=b*b;A.forwardImpulse=g;var S=.5*A.forwardImpulse,E=1*A.sideImpulse,C=S*S+E*E;A.sliding=!1,C>T&&(this.sliding=!0,A.sliding=!0,y=b/Math.sqrt(C),A.skidInfo*=y)}}if(this.sliding)for(l=0;l<s;l++)0!==(A=i[l]).sideImpulse&&A.skidInfo<1&&(A.forwardImpulse*=A.skidInfo,A.sideImpulse*=A.skidInfo);for(l=0;l<s;l++){var A=i[l],P=new n;if(P.copy(A.raycastResult.hitPointWorld),0!==A.forwardImpulse){var R=new n;o[l].scale(A.forwardImpulse,R),r.applyImpulse(R,P)}if(0!==A.sideImpulse){d=A.raycastResult.body;var I=new n;I.copy(A.raycastResult.hitPointWorld);var D=new n;a[l].scale(A.sideImpulse,D),r.pointToLocalFrame(P,P),P["xyz"[this.indexUpAxis]]*=A.rollInfluence,r.pointToWorldFrame(P,P),r.applyImpulse(D,P),D.scale(-1,D),d.applyImpulse(D,I)}}};var g=new n,v=new n,y=new n;function x(e,t,i,n,s){var r=0,o=i,a=g,l=v,h=y;return e.getVelocityAtWorldPoint(o,a),t.getVelocityAtWorldPoint(o,l),a.vsub(l,h),s<(r=-n.dot(h)*(1/(C(e,i,n)+C(t,i,n))))&&(r=s),r<-s&&(r=-s),r}var b=new n,T=new n,S=new n,E=new n;function C(e,t,i){var n=b,s=T,r=S,o=E;return t.vsub(e.position,n),n.cross(i,s),e.invInertiaWorld.vmult(s,o),o.cross(n,r),e.invMass+i.dot(r)}var A=new n,P=new n,R=new n;function M(e,t,i,n,s,r){if(s.norm2()>1.1)return 0;var o=A,a=P,l=R;return e.getVelocityAtWorldPoint(t,o),i.getVelocityAtWorldPoint(n,a),o.vsub(a,l),-.2*s.dot(l)*(1/(e.invMass+i.invMass))}},{"../collision/Ray":9,"../collision/RaycastResult":10,"../math/Quaternion":28,"../math/Vec3":30,"../objects/WheelInfo":36,"./Body":31}],33:[function(e,t,i){var n=e("./Body"),s=e("../shapes/Sphere"),r=e("../shapes/Box"),o=e("../math/Vec3"),a=e("../constraints/HingeConstraint");function l(e){if(this.wheelBodies=[],this.coordinateSystem=void 0===e.coordinateSystem?new o(1,2,3):e.coordinateSystem.clone(),this.chassisBody=e.chassisBody,!this.chassisBody){var t=new r(new o(5,2,.5));this.chassisBody=new n(1,t)}this.constraints=[],this.wheelAxes=[],this.wheelForces=[]}t.exports=l,l.prototype.addWheel=function(e){var t=(e=e||{}).body;t||(t=new n(1,new s(1.2))),this.wheelBodies.push(t),this.wheelForces.push(0),new o;var i=void 0!==e.position?e.position.clone():new o,r=new o;this.chassisBody.pointToWorldFrame(i,r),t.position.set(r.x,r.y,r.z);var l=void 0!==e.axis?e.axis.clone():new o(0,1,0);this.wheelAxes.push(l);var h=new a(this.chassisBody,t,{pivotA:i,axisA:l,pivotB:o.ZERO,axisB:l,collideConnected:!1});return this.constraints.push(h),this.wheelBodies.length-1},l.prototype.setSteeringValue=function(e,t){var i=this.wheelAxes[t],n=Math.cos(e),s=Math.sin(e),r=i.x,o=i.y;this.constraints[t].axisA.set(n*r-s*o,s*r+n*o,0)},l.prototype.setMotorSpeed=function(e,t){var i=this.constraints[t];i.enableMotor(),i.motorTargetVelocity=e},l.prototype.disableMotor=function(e){this.constraints[e].disableMotor()};var h=new o;l.prototype.setWheelForce=function(e,t){this.wheelForces[t]=e},l.prototype.applyWheelForce=function(e,t){var i=this.wheelAxes[t],n=this.wheelBodies[t],s=n.torque;i.scale(e,h),n.vectorToWorldFrame(h,h),s.vadd(h,s)},l.prototype.addToWorld=function(e){for(var t=this.constraints,i=this.wheelBodies.concat([this.chassisBody]),n=0;n<i.length;n++)e.add(i[n]);for(n=0;n<t.length;n++)e.addConstraint(t[n]);e.addEventListener("preStep",this._update.bind(this))},l.prototype._update=function(){for(var e=this.wheelForces,t=0;t<e.length;t++)this.applyWheelForce(e[t],t)},l.prototype.removeFromWorld=function(e){for(var t=this.constraints,i=this.wheelBodies.concat([this.chassisBody]),n=0;n<i.length;n++)e.remove(i[n]);for(n=0;n<t.length;n++)e.removeConstraint(t[n])};var c=new o;l.prototype.getWheelSpeed=function(e){var t=this.wheelAxes[e],i=this.wheelBodies[e].angularVelocity;return this.chassisBody.vectorToWorldFrame(t,c),i.dot(c)}},{"../constraints/HingeConstraint":15,"../math/Vec3":30,"../shapes/Box":37,"../shapes/Sphere":44,"./Body":31}],34:[function(e,t,i){t.exports=s,e("../shapes/Shape");var n=e("../math/Vec3");function s(){this.particles=[],this.density=1,this.smoothingRadius=1,this.speedOfSound=1,this.viscosity=.01,this.eps=1e-6,this.pressures=[],this.densities=[],this.neighbors=[]}e("../math/Quaternion"),e("../shapes/Particle"),e("../objects/Body"),e("../material/Material"),s.prototype.add=function(e){this.particles.push(e),this.neighbors.length<this.particles.length&&this.neighbors.push([])},s.prototype.remove=function(e){var t=this.particles.indexOf(e);-1!==t&&(this.particles.splice(t,1),this.neighbors.length>this.particles.length&&this.neighbors.pop())};var r=new n;s.prototype.getNeighbors=function(e,t){for(var i=this.particles.length,n=e.id,s=this.smoothingRadius*this.smoothingRadius,o=r,a=0;a!==i;a++){var l=this.particles[a];l.position.vsub(e.position,o),n!==l.id&&o.norm2()<s&&t.push(l)}};var o=new n,a=new n,l=new n,h=new n,c=new n,u=new n;s.prototype.update=function(){for(var e=this.particles.length,t=o,i=this.speedOfSound,n=this.eps,s=0;s!==e;s++){var r=this.particles[s];(E=this.neighbors[s]).length=0,this.getNeighbors(r,E),E.push(this.particles[s]);for(var d=E.length,p=0,f=0;f!==d;f++){r.position.vsub(E[f].position,t);var _=t.norm(),m=this.w(_);p+=E[f].mass*m}this.densities[s]=p,this.pressures[s]=i*i*(this.densities[s]-this.density)}var g=a,v=l,y=h,x=c,b=u;for(s=0;s!==e;s++){var T,S,E,C=this.particles[s];for(g.set(0,0,0),v.set(0,0,0),d=(E=this.neighbors[s]).length,f=0;f!==d;f++){var A=E[f];C.position.vsub(A.position,x);var P=x.norm();T=-A.mass*(this.pressures[s]/(this.densities[s]*this.densities[s]+n)+this.pressures[f]/(this.densities[f]*this.densities[f]+n)),this.gradw(x,y),y.mult(T,y),g.vadd(y,g),A.velocity.vsub(C.velocity,b),b.mult(1/(1e-4+this.densities[s]*this.densities[f])*this.viscosity*A.mass,b),S=this.nablaw(P),b.mult(S,b),v.vadd(b,v)}v.mult(C.mass,v),g.mult(C.mass,g),C.force.vadd(v,C.force),C.force.vadd(g,C.force)}},s.prototype.w=function(e){var t=this.smoothingRadius;return 315/(64*Math.PI*Math.pow(t,9))*Math.pow(t*t-e*e,3)},s.prototype.gradw=function(e,t){var i=e.norm(),n=this.smoothingRadius;e.mult(945/(32*Math.PI*Math.pow(n,9))*Math.pow(n*n-i*i,2),t)},s.prototype.nablaw=function(e){var t=this.smoothingRadius;return 945/(32*Math.PI*Math.pow(t,9))*(t*t-e*e)*(7*e*e-3*t*t)}},{"../material/Material":25,"../math/Quaternion":28,"../math/Vec3":30,"../objects/Body":31,"../shapes/Particle":41,"../shapes/Shape":43}],35:[function(e,t,i){var n=e("../math/Vec3");function s(e,t,i){i=i||{},this.restLength="number"==typeof i.restLength?i.restLength:1,this.stiffness=i.stiffness||100,this.damping=i.damping||1,this.bodyA=e,this.bodyB=t,this.localAnchorA=new n,this.localAnchorB=new n,i.localAnchorA&&this.localAnchorA.copy(i.localAnchorA),i.localAnchorB&&this.localAnchorB.copy(i.localAnchorB),i.worldAnchorA&&this.setWorldAnchorA(i.worldAnchorA),i.worldAnchorB&&this.setWorldAnchorB(i.worldAnchorB)}t.exports=s,s.prototype.setWorldAnchorA=function(e){this.bodyA.pointToLocalFrame(e,this.localAnchorA)},s.prototype.setWorldAnchorB=function(e){this.bodyB.pointToLocalFrame(e,this.localAnchorB)},s.prototype.getWorldAnchorA=function(e){this.bodyA.pointToWorldFrame(this.localAnchorA,e)},s.prototype.getWorldAnchorB=function(e){this.bodyB.pointToWorldFrame(this.localAnchorB,e)};var r=new n,o=new n,a=new n,l=new n,h=new n,c=new n,u=new n,d=new n,p=new n,f=new n,_=new n;s.prototype.applyForce=function(){var e=this.stiffness,t=this.damping,i=this.restLength,n=this.bodyA,s=this.bodyB,m=r,g=o,v=a,y=l,x=_,b=h,T=c,S=u,E=d,C=p,A=f;this.getWorldAnchorA(b),this.getWorldAnchorB(T),b.vsub(n.position,S),T.vsub(s.position,E),T.vsub(b,m);var P=m.norm();g.copy(m),g.normalize(),s.velocity.vsub(n.velocity,v),s.angularVelocity.cross(E,x),v.vadd(x,v),n.angularVelocity.cross(S,x),v.vsub(x,v),g.mult(-e*(P-i)-t*v.dot(g),y),n.force.vsub(y,n.force),s.force.vadd(y,s.force),S.cross(y,C),E.cross(y,A),n.torque.vsub(C,n.torque),s.torque.vadd(A,s.torque)}},{"../math/Vec3":30}],36:[function(e,t,i){var n=e("../math/Vec3"),s=e("../math/Transform"),r=e("../collision/RaycastResult"),o=e("../utils/Utils");function a(e){e=o.defaults(e,{chassisConnectionPointLocal:new n,chassisConnectionPointWorld:new n,directionLocal:new n,directionWorld:new n,axleLocal:new n,axleWorld:new n,suspensionRestLength:1,suspensionMaxLength:2,radius:1,suspensionStiffness:100,dampingCompression:10,dampingRelaxation:10,frictionSlip:1e4,steering:0,rotation:0,deltaRotation:0,rollInfluence:.01,maxSuspensionForce:Number.MAX_VALUE,isFrontWheel:!0,clippedInvContactDotSuspension:1,suspensionRelativeVelocity:0,suspensionForce:0,skidInfo:0,suspensionLength:0,maxSuspensionTravel:1,useCustomSlidingRotationalSpeed:!1,customSlidingRotationalSpeed:-.1}),this.maxSuspensionTravel=e.maxSuspensionTravel,this.customSlidingRotationalSpeed=e.customSlidingRotationalSpeed,this.useCustomSlidingRotationalSpeed=e.useCustomSlidingRotationalSpeed,this.sliding=!1,this.chassisConnectionPointLocal=e.chassisConnectionPointLocal.clone(),this.chassisConnectionPointWorld=e.chassisConnectionPointWorld.clone(),this.directionLocal=e.directionLocal.clone(),this.directionWorld=e.directionWorld.clone(),this.axleLocal=e.axleLocal.clone(),this.axleWorld=e.axleWorld.clone(),this.suspensionRestLength=e.suspensionRestLength,this.suspensionMaxLength=e.suspensionMaxLength,this.radius=e.radius,this.suspensionStiffness=e.suspensionStiffness,this.dampingCompression=e.dampingCompression,this.dampingRelaxation=e.dampingRelaxation,this.frictionSlip=e.frictionSlip,this.steering=0,this.rotation=0,this.deltaRotation=0,this.rollInfluence=e.rollInfluence,this.maxSuspensionForce=e.maxSuspensionForce,this.engineForce=0,this.brake=0,this.isFrontWheel=e.isFrontWheel,this.clippedInvContactDotSuspension=1,this.suspensionRelativeVelocity=0,this.suspensionForce=0,this.skidInfo=0,this.suspensionLength=0,this.sideImpulse=0,this.forwardImpulse=0,this.raycastResult=new r,this.worldTransform=new s,this.isInContact=!1}t.exports=a;var l=new n,h=new n;l=new n,a.prototype.updateWheel=function(e){var t=this.raycastResult;if(this.isInContact){var i=t.hitNormalWorld.dot(t.directionWorld);t.hitPointWorld.vsub(e.position,h),e.getVelocityAtWorldPoint(h,l);var n=t.hitNormalWorld.dot(l);if(i>=-.1)this.suspensionRelativeVelocity=0,this.clippedInvContactDotSuspension=10;else{var s=-1/i;this.suspensionRelativeVelocity=n*s,this.clippedInvContactDotSuspension=s}}else t.suspensionLength=this.suspensionRestLength,this.suspensionRelativeVelocity=0,t.directionWorld.scale(-1,t.hitNormalWorld),this.clippedInvContactDotSuspension=1}},{"../collision/RaycastResult":10,"../math/Transform":29,"../math/Vec3":30,"../utils/Utils":53}],37:[function(e,t,i){t.exports=o;var n=e("./Shape"),s=e("../math/Vec3"),r=e("./ConvexPolyhedron");function o(e){n.call(this),this.type=n.types.BOX,this.halfExtents=e,this.convexPolyhedronRepresentation=null,this.updateConvexPolyhedronRepresentation(),this.updateBoundingSphereRadius()}o.prototype=new n,o.prototype.constructor=o,o.prototype.updateConvexPolyhedronRepresentation=function(){var e=this.halfExtents.x,t=this.halfExtents.y,i=this.halfExtents.z,n=s,o=[new n(-e,-t,-i),new n(e,-t,-i),new n(e,t,-i),new n(-e,t,-i),new n(-e,-t,i),new n(e,-t,i),new n(e,t,i),new n(-e,t,i)],a=(new n(0,0,1),new n(0,1,0),new n(1,0,0),new r(o,[[3,2,1,0],[4,5,6,7],[5,4,0,1],[2,3,7,6],[0,4,7,3],[1,2,6,5]]));this.convexPolyhedronRepresentation=a,a.material=this.material},o.prototype.calculateLocalInertia=function(e,t){return t=t||new s,o.calculateInertia(this.halfExtents,e,t),t},o.calculateInertia=function(e,t,i){var n=e;i.x=1/12*t*(2*n.y*2*n.y+2*n.z*2*n.z),i.y=1/12*t*(2*n.x*2*n.x+2*n.z*2*n.z),i.z=1/12*t*(2*n.y*2*n.y+2*n.x*2*n.x)},o.prototype.getSideNormals=function(e,t){var i=e,n=this.halfExtents;if(i[0].set(n.x,0,0),i[1].set(0,n.y,0),i[2].set(0,0,n.z),i[3].set(-n.x,0,0),i[4].set(0,-n.y,0),i[5].set(0,0,-n.z),void 0!==t)for(var s=0;s!==i.length;s++)t.vmult(i[s],i[s]);return i},o.prototype.volume=function(){return 8*this.halfExtents.x*this.halfExtents.y*this.halfExtents.z},o.prototype.updateBoundingSphereRadius=function(){this.boundingSphereRadius=this.halfExtents.norm()};var a=new s;new s,o.prototype.forEachWorldCorner=function(e,t,i){for(var n=this.halfExtents,s=[[n.x,n.y,n.z],[-n.x,n.y,n.z],[-n.x,-n.y,n.z],[-n.x,-n.y,-n.z],[n.x,-n.y,-n.z],[n.x,n.y,-n.z],[-n.x,n.y,-n.z],[n.x,-n.y,n.z]],r=0;r<s.length;r++)a.set(s[r][0],s[r][1],s[r][2]),t.vmult(a,a),e.vadd(a,a),i(a.x,a.y,a.z)};var l=[new s,new s,new s,new s,new s,new s,new s,new s];o.prototype.calculateWorldAABB=function(e,t,i,n){var s=this.halfExtents;l[0].set(s.x,s.y,s.z),l[1].set(-s.x,s.y,s.z),l[2].set(-s.x,-s.y,s.z),l[3].set(-s.x,-s.y,-s.z),l[4].set(s.x,-s.y,-s.z),l[5].set(s.x,s.y,-s.z),l[6].set(-s.x,s.y,-s.z),l[7].set(s.x,-s.y,s.z);var r=l[0];t.vmult(r,r),e.vadd(r,r),n.copy(r),i.copy(r);for(var o=1;o<8;o++){r=l[o],t.vmult(r,r),e.vadd(r,r);var a=r.x,h=r.y,c=r.z;a>n.x&&(n.x=a),h>n.y&&(n.y=h),c>n.z&&(n.z=c),a<i.x&&(i.x=a),h<i.y&&(i.y=h),c<i.z&&(i.z=c)}}},{"../math/Vec3":30,"./ConvexPolyhedron":38,"./Shape":43}],38:[function(e,t,i){t.exports=o;var n=e("./Shape"),s=e("../math/Vec3"),r=(e("../math/Quaternion"),e("../math/Transform"));function o(e,t,i){n.call(this),this.type=n.types.CONVEXPOLYHEDRON,this.vertices=e||[],this.worldVertices=[],this.worldVerticesNeedsUpdate=!0,this.faces=t||[],this.faceNormals=[],this.computeNormals(),this.worldFaceNormalsNeedsUpdate=!0,this.worldFaceNormals=[],this.uniqueEdges=[],this.uniqueAxes=i?i.slice():null,this.computeEdges(),this.updateBoundingSphereRadius()}o.prototype=new n,o.prototype.constructor=o;var a=new s;o.prototype.computeEdges=function(){var e=this.faces,t=this.vertices,i=(t.length,this.uniqueEdges);i.length=0;for(var n=a,s=0;s!==e.length;s++)for(var r=e[s],o=r.length,l=0;l!==o;l++){var h=(l+1)%o;t[r[l]].vsub(t[r[h]],n),n.normalize();for(var c=!1,u=0;u!==i.length;u++)if(i[u].almostEquals(n)||i[u].almostEquals(n)){c=!0;break}c||i.push(n.clone())}},o.prototype.computeNormals=function(){this.faceNormals.length=this.faces.length;for(var e=0;e<this.faces.length;e++){for(var t=0;t<this.faces[e].length;t++)if(!this.vertices[this.faces[e][t]])throw new Error("Vertex "+this.faces[e][t]+" not found!");var i=this.faceNormals[e]||new s;this.getFaceNormal(e,i),i.negate(i),this.faceNormals[e]=i;var n=this.vertices[this.faces[e][0]];if(i.dot(n)<0)for(console.error(".faceNormals["+e+"] = Vec3("+i.toString()+") looks like it points into the shape? The vertices follow. Make sure they are ordered CCW around the normal, using the right hand rule."),t=0;t<this.faces[e].length;t++)console.warn(".vertices["+this.faces[e][t]+"] = Vec3("+this.vertices[this.faces[e][t]].toString()+")")}};var l=new s,h=new s;o.computeNormal=function(e,t,i,n){t.vsub(e,h),i.vsub(t,l),l.cross(h,n),n.isZero()||n.normalize()},o.prototype.getFaceNormal=function(e,t){var i=this.faces[e],n=this.vertices[i[0]],s=this.vertices[i[1]],r=this.vertices[i[2]];return o.computeNormal(n,s,r,t)};var c=new s;o.prototype.clipAgainstHull=function(e,t,i,n,r,o,a,l,h){for(var u=c,d=-1,p=-Number.MAX_VALUE,f=0;f<i.faces.length;f++){u.copy(i.faceNormals[f]),r.vmult(u,u);var _=u.dot(o);_>p&&(p=_,d=f)}for(var m=[],g=i.faces[d],v=g.length,y=0;y<v;y++){var x=i.vertices[g[y]],b=new s;b.copy(x),r.vmult(b,b),n.vadd(b,b),m.push(b)}d>=0&&this.clipFaceAgainstHull(o,e,t,m,a,l,h)};var u=new s,d=new s,p=new s,f=new s,_=new s,m=new s;o.prototype.findSeparatingAxis=function(e,t,i,n,s,r,o,a){var l=u,h=d,c=p,g=f,v=_,y=m,x=Number.MAX_VALUE,b=this;if(b.uniqueAxes)for(S=0;S!==b.uniqueAxes.length;S++){if(i.vmult(b.uniqueAxes[S],l),!1===(A=b.testSepAxis(l,e,t,i,n,s)))return!1;A<x&&(x=A,r.copy(l))}else for(var T=o?o.length:b.faces.length,S=0;S<T;S++){var E=o?o[S]:S;if(l.copy(b.faceNormals[E]),i.vmult(l,l),!1===(A=b.testSepAxis(l,e,t,i,n,s)))return!1;A<x&&(x=A,r.copy(l))}if(e.uniqueAxes)for(S=0;S!==e.uniqueAxes.length;S++){if(s.vmult(e.uniqueAxes[S],h),!1===(A=b.testSepAxis(h,e,t,i,n,s)))return!1;A<x&&(x=A,r.copy(h))}else{var C=a?a.length:e.faces.length;for(S=0;S<C;S++){var A;if(E=a?a[S]:S,h.copy(e.faceNormals[E]),s.vmult(h,h),!1===(A=b.testSepAxis(h,e,t,i,n,s)))return!1;A<x&&(x=A,r.copy(h))}}for(var P=0;P!==b.uniqueEdges.length;P++){i.vmult(b.uniqueEdges[P],g);for(var R=0;R!==e.uniqueEdges.length;R++)if(s.vmult(e.uniqueEdges[R],v),g.cross(v,y),!y.almostZero()){y.normalize();var M=b.testSepAxis(y,e,t,i,n,s);if(!1===M)return!1;M<x&&(x=M,r.copy(y))}}return n.vsub(t,c),c.dot(r)>0&&r.negate(r),!0};var g=[],v=[];o.prototype.testSepAxis=function(e,t,i,n,s,r){o.project(this,e,i,n,g),o.project(t,e,s,r,v);var a=g[0],l=g[1],h=v[0],c=v[1];if(a<c||h<l)return!1;var u=a-c,d=h-l;return u<d?u:d};var y=new s,x=new s;o.prototype.calculateLocalInertia=function(e,t){this.computeLocalAABB(y,x);var i=x.x-y.x,n=x.y-y.y,s=x.z-y.z;t.x=1/12*e*(2*n*2*n+2*s*2*s),t.y=1/12*e*(2*i*2*i+2*s*2*s),t.z=1/12*e*(2*n*2*n+2*i*2*i)},o.prototype.getPlaneConstantOfFace=function(e){var t=this.faces[e],i=this.faceNormals[e],n=this.vertices[t[0]];return-i.dot(n)};var b=new s,T=new s,S=new s,E=new s,C=new s,A=new s,P=new s,R=new s;o.prototype.clipFaceAgainstHull=function(e,t,i,n,s,r,o){for(var a=b,l=T,h=S,c=E,u=C,d=A,p=P,f=R,_=this,m=n,g=[],v=-1,y=Number.MAX_VALUE,x=0;x<_.faces.length;x++){a.copy(_.faceNormals[x]),i.vmult(a,a);var M=a.dot(e);M<y&&(y=M,v=x)}if(!(v<0)){var I=_.faces[v];I.connectedFaces=[];for(var D=0;D<_.faces.length;D++)for(var O=0;O<_.faces[D].length;O++)-1!==I.indexOf(_.faces[D][O])&&D!==v&&-1===I.connectedFaces.indexOf(D)&&I.connectedFaces.push(D);m.length;for(var w=I.length,N=0;N<w;N++){var F=_.vertices[I[N]],L=_.vertices[I[(N+1)%w]];F.vsub(L,l),h.copy(l),i.vmult(h,h),t.vadd(h,h),c.copy(this.faceNormals[v]),i.vmult(c,c),t.vadd(c,c),h.cross(c,u),u.negate(u),d.copy(F),i.vmult(d,d),t.vadd(d,d),d.dot(u);var B=I.connectedFaces[N];p.copy(this.faceNormals[B]);var U=this.getPlaneConstantOfFace(B);f.copy(p),i.vmult(f,f);var V=U-f.dot(t);for(this.clipFaceAgainstPlane(m,g,f,V);m.length;)m.shift();for(;g.length;)m.push(g.shift())}for(p.copy(this.faceNormals[v]),U=this.getPlaneConstantOfFace(v),f.copy(p),i.vmult(f,f),V=U-f.dot(t),D=0;D<m.length;D++){var k=f.dot(m[D])+V;if(k<=s&&(console.log("clamped: depth="+k+" to minDist="+s),k=s),k<=r){var G=m[D];if(k<=0){var z={point:G,normal:f,depth:k};o.push(z)}}}}},o.prototype.clipFaceAgainstPlane=function(e,t,i,n){var r,o,a=e.length;if(a<2)return t;var l=e[e.length-1],h=e[0];r=i.dot(l)+n;for(var c=0;c<a;c++){if(h=e[c],o=i.dot(h)+n,r<0)if(o<0)(u=new s).copy(h),t.push(u);else{var u=new s;l.lerp(h,r/(r-o),u),t.push(u)}else o<0&&(u=new s,l.lerp(h,r/(r-o),u),t.push(u),t.push(h));l=h,r=o}return t},o.prototype.computeWorldVertices=function(e,t){for(var i=this.vertices.length;this.worldVertices.length<i;)this.worldVertices.push(new s);for(var n=this.vertices,r=this.worldVertices,o=0;o!==i;o++)t.vmult(n[o],r[o]),e.vadd(r[o],r[o]);this.worldVerticesNeedsUpdate=!1},new s,o.prototype.computeLocalAABB=function(e,t){var i=this.vertices.length,n=this.vertices;e.set(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),t.set(-Number.MAX_VALUE,-Number.MAX_VALUE,-Number.MAX_VALUE);for(var s=0;s<i;s++){var r=n[s];r.x<e.x?e.x=r.x:r.x>t.x&&(t.x=r.x),r.y<e.y?e.y=r.y:r.y>t.y&&(t.y=r.y),r.z<e.z?e.z=r.z:r.z>t.z&&(t.z=r.z)}},o.prototype.computeWorldFaceNormals=function(e){for(var t=this.faceNormals.length;this.worldFaceNormals.length<t;)this.worldFaceNormals.push(new s);for(var i=this.faceNormals,n=this.worldFaceNormals,r=0;r!==t;r++)e.vmult(i[r],n[r]);this.worldFaceNormalsNeedsUpdate=!1},o.prototype.updateBoundingSphereRadius=function(){for(var e=0,t=this.vertices,i=0,n=t.length;i!==n;i++){var s=t[i].norm2();s>e&&(e=s)}this.boundingSphereRadius=Math.sqrt(e)};var M=new s;o.prototype.calculateWorldAABB=function(e,t,i,n){for(var s,r,o,a,l,h,c=this.vertices.length,u=this.vertices,d=0;d<c;d++){M.copy(u[d]),t.vmult(M,M),e.vadd(M,M);var p=M;p.x<s||void 0===s?s=p.x:(p.x>a||void 0===a)&&(a=p.x),p.y<r||void 0===r?r=p.y:(p.y>l||void 0===l)&&(l=p.y),p.z<o||void 0===o?o=p.z:(p.z>h||void 0===h)&&(h=p.z)}i.set(s,r,o),n.set(a,l,h)},o.prototype.volume=function(){return 4*Math.PI*this.boundingSphereRadius/3},o.prototype.getAveragePointLocal=function(e){e=e||new s;for(var t=this.vertices.length,i=this.vertices,n=0;n<t;n++)e.vadd(i[n],e);return e.mult(1/t,e),e},o.prototype.transformAllPoints=function(e,t){var i=this.vertices.length,n=this.vertices;if(t){for(var s=0;s<i;s++){var r=n[s];t.vmult(r,r)}for(s=0;s<this.faceNormals.length;s++)r=this.faceNormals[s],t.vmult(r,r)}if(e)for(s=0;s<i;s++)(r=n[s]).vadd(e,r)};var I=new s,D=new s,O=new s;o.prototype.pointIsInside=function(e){var t=this.vertices.length,i=this.vertices,n=this.faces,s=this.faceNormals,r=this.faces.length,o=I;this.getAveragePointLocal(o);for(var a=0;a<r;a++){this.faces[a].length,t=s[a];var l=i[n[a][0]],h=D;e.vsub(l,h);var c=t.dot(h),u=O;o.vsub(l,u);var d=t.dot(u);if(c<0&&d>0||c>0&&d<0)return!1}return-1},new s;var w=new s,N=new s;o.project=function(e,t,i,n,s){var o=e.vertices.length,a=w,l=0,h=0,c=N,u=e.vertices;c.setZero(),r.vectorToLocalFrame(i,n,t,a),r.pointToLocalFrame(i,n,c,c);var d=c.dot(a);h=l=u[0].dot(a);for(var p=1;p<o;p++){var f=u[p].dot(a);f>l&&(l=f),f<h&&(h=f)}if((h-=d)>(l-=d)){var _=h;h=l,l=_}s[0]=l,s[1]=h}},{"../math/Quaternion":28,"../math/Transform":29,"../math/Vec3":30,"./Shape":43}],39:[function(e,t,i){t.exports=o;var n=e("./Shape"),s=e("../math/Vec3"),r=(e("../math/Quaternion"),e("./ConvexPolyhedron"));function o(e,t,i,o){var a=o,l=[],h=[],c=[],u=[],d=[],p=Math.cos,f=Math.sin;l.push(new s(t*p(0),t*f(0),.5*-i)),u.push(0),l.push(new s(e*p(0),e*f(0),.5*i)),d.push(1);for(var _=0;_<a;_++){var m=2*Math.PI/a*(_+1),g=2*Math.PI/a*(_+.5);_<a-1?(l.push(new s(t*p(m),t*f(m),.5*-i)),u.push(2*_+2),l.push(new s(e*p(m),e*f(m),.5*i)),d.push(2*_+3),c.push([2*_+2,2*_+3,2*_+1,2*_])):c.push([0,1,2*_+1,2*_]),(a%2==1||_<a/2)&&h.push(new s(p(g),f(g),0))}c.push(d),h.push(new s(0,0,1));var v=[];for(_=0;_<u.length;_++)v.push(u[u.length-_-1]);c.push(v),this.type=n.types.CONVEXPOLYHEDRON,r.call(this,l,c,h)}o.prototype=new r},{"../math/Quaternion":28,"../math/Vec3":30,"./ConvexPolyhedron":38,"./Shape":43}],40:[function(e,t,i){var n=e("./Shape"),s=e("./ConvexPolyhedron"),r=e("../math/Vec3"),o=e("../utils/Utils");function a(e,t){t=o.defaults(t,{maxValue:null,minValue:null,elementSize:1}),this.data=e,this.maxValue=t.maxValue,this.minValue=t.minValue,this.elementSize=t.elementSize,null===t.minValue&&this.updateMinValue(),null===t.maxValue&&this.updateMaxValue(),this.cacheEnabled=!0,n.call(this),this.pillarConvex=new s,this.pillarOffset=new r,this.type=n.types.HEIGHTFIELD,this.updateBoundingSphereRadius(),this._cachedPillars={}}t.exports=a,a.prototype=new n,a.prototype.update=function(){this._cachedPillars={}},a.prototype.updateMinValue=function(){for(var e=this.data,t=e[0][0],i=0;i!==e.length;i++)for(var n=0;n!==e[i].length;n++){var s=e[i][n];s<t&&(t=s)}this.minValue=t},a.prototype.updateMaxValue=function(){for(var e=this.data,t=e[0][0],i=0;i!==e.length;i++)for(var n=0;n!==e[i].length;n++){var s=e[i][n];s>t&&(t=s)}this.maxValue=t},a.prototype.setHeightValueAtIndex=function(e,t,i){this.data[e][t]=i,this.clearCachedConvexTrianglePillar(e,t,!1),e>0&&(this.clearCachedConvexTrianglePillar(e-1,t,!0),this.clearCachedConvexTrianglePillar(e-1,t,!1)),t>0&&(this.clearCachedConvexTrianglePillar(e,t-1,!0),this.clearCachedConvexTrianglePillar(e,t-1,!1)),t>0&&e>0&&this.clearCachedConvexTrianglePillar(e-1,t-1,!0)},a.prototype.getRectMinMax=function(e,t,i,n,s){s=s||[];for(var r=this.data,o=this.minValue,a=e;a<=i;a++)for(var l=t;l<=n;l++){var h=r[a][l];h>o&&(o=h)}s[0]=this.minValue,s[1]=o},a.prototype.getIndexOfPosition=function(e,t,i,n){var s=this.elementSize,r=this.data,o=Math.floor(e/s),a=Math.floor(t/s);return i[0]=o,i[1]=a,n&&(o<0&&(o=0),a<0&&(a=0),o>=r.length-1&&(o=r.length-1),a>=r[0].length-1&&(a=r[0].length-1)),!(o<0||a<0||o>=r.length-1||a>=r[0].length-1)},a.prototype.getHeightAt=function(e,t,i){var n=[];this.getIndexOfPosition(e,t,n,i);var s=[];return this.getRectMinMax(n[0],n[1]+1,n[0],n[1]+1,s),(s[0]+s[1])/2},a.prototype.getCacheConvexTrianglePillarKey=function(e,t,i){return e+"_"+t+"_"+(i?1:0)},a.prototype.getCachedConvexTrianglePillar=function(e,t,i){return this._cachedPillars[this.getCacheConvexTrianglePillarKey(e,t,i)]},a.prototype.setCachedConvexTrianglePillar=function(e,t,i,n,s){this._cachedPillars[this.getCacheConvexTrianglePillarKey(e,t,i)]={convex:n,offset:s}},a.prototype.clearCachedConvexTrianglePillar=function(e,t,i){delete this._cachedPillars[this.getCacheConvexTrianglePillarKey(e,t,i)]},a.prototype.getConvexTrianglePillar=function(e,t,i){var n=this.pillarConvex,o=this.pillarOffset;if(this.cacheEnabled){if(a=this.getCachedConvexTrianglePillar(e,t,i))return this.pillarConvex=a.convex,void(this.pillarOffset=a.offset);n=new s,o=new r,this.pillarConvex=n,this.pillarOffset=o}var a=this.data,l=this.elementSize,h=n.faces;n.vertices.length=6;for(var c=0;c<6;c++)n.vertices[c]||(n.vertices[c]=new r);for(h.length=5,c=0;c<5;c++)h[c]||(h[c]=[]);var u=n.vertices,d=(Math.min(a[e][t],a[e+1][t],a[e][t+1],a[e+1][t+1])-this.minValue)/2+this.minValue;i?(o.set((e+.75)*l,(t+.75)*l,d),u[0].set(.25*l,.25*l,a[e+1][t+1]-d),u[1].set(-.75*l,.25*l,a[e][t+1]-d),u[2].set(.25*l,-.75*l,a[e+1][t]-d),u[3].set(.25*l,.25*l,-d-1),u[4].set(-.75*l,.25*l,-d-1),u[5].set(.25*l,-.75*l,-d-1),h[0][0]=0,h[0][1]=1,h[0][2]=2,h[1][0]=5,h[1][1]=4,h[1][2]=3,h[2][0]=2,h[2][1]=5,h[2][2]=3,h[2][3]=0,h[3][0]=3,h[3][1]=4,h[3][2]=1,h[3][3]=0,h[4][0]=1,h[4][1]=4,h[4][2]=5,h[4][3]=2):(o.set((e+.25)*l,(t+.25)*l,d),u[0].set(-.25*l,-.25*l,a[e][t]-d),u[1].set(.75*l,-.25*l,a[e+1][t]-d),u[2].set(-.25*l,.75*l,a[e][t+1]-d),u[3].set(-.25*l,-.25*l,-d-1),u[4].set(.75*l,-.25*l,-d-1),u[5].set(-.25*l,.75*l,-d-1),h[0][0]=0,h[0][1]=1,h[0][2]=2,h[1][0]=5,h[1][1]=4,h[1][2]=3,h[2][0]=0,h[2][1]=2,h[2][2]=5,h[2][3]=3,h[3][0]=1,h[3][1]=0,h[3][2]=3,h[3][3]=4,h[4][0]=4,h[4][1]=5,h[4][2]=2,h[4][3]=1),n.computeNormals(),n.computeEdges(),n.updateBoundingSphereRadius(),this.setCachedConvexTrianglePillar(e,t,i,n,o)},a.prototype.calculateLocalInertia=function(e,t){return(t=t||new r).set(0,0,0),t},a.prototype.volume=function(){return Number.MAX_VALUE},a.prototype.calculateWorldAABB=function(e,t,i,n){i.set(-Number.MAX_VALUE,-Number.MAX_VALUE,-Number.MAX_VALUE),n.set(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE)},a.prototype.updateBoundingSphereRadius=function(){var e=this.data,t=this.elementSize;this.boundingSphereRadius=new r(e.length*t,e[0].length*t,Math.max(Math.abs(this.maxValue),Math.abs(this.minValue))).norm()}},{"../math/Vec3":30,"../utils/Utils":53,"./ConvexPolyhedron":38,"./Shape":43}],41:[function(e,t,i){t.exports=r;var n=e("./Shape"),s=e("../math/Vec3");function r(){n.call(this),this.type=n.types.PARTICLE}r.prototype=new n,r.prototype.constructor=r,r.prototype.calculateLocalInertia=function(e,t){return(t=t||new s).set(0,0,0),t},r.prototype.volume=function(){return 0},r.prototype.updateBoundingSphereRadius=function(){this.boundingSphereRadius=0},r.prototype.calculateWorldAABB=function(e,t,i,n){i.copy(e),n.copy(e)}},{"../math/Vec3":30,"./Shape":43}],42:[function(e,t,i){t.exports=r;var n=e("./Shape"),s=e("../math/Vec3");function r(){n.call(this),this.type=n.types.PLANE,this.worldNormal=new s,this.worldNormalNeedsUpdate=!0,this.boundingSphereRadius=Number.MAX_VALUE}r.prototype=new n,r.prototype.constructor=r,r.prototype.computeWorldNormal=function(e){var t=this.worldNormal;t.set(0,0,1),e.vmult(t,t),this.worldNormalNeedsUpdate=!1},r.prototype.calculateLocalInertia=function(e,t){return t||new s},r.prototype.volume=function(){return Number.MAX_VALUE};var o=new s;r.prototype.calculateWorldAABB=function(e,t,i,n){o.set(0,0,1),t.vmult(o,o);var s=Number.MAX_VALUE;i.set(-s,-s,-s),n.set(s,s,s),1===o.x&&(n.x=e.x),1===o.y&&(n.y=e.y),1===o.z&&(n.z=e.z),-1===o.x&&(i.x=e.x),-1===o.y&&(i.y=e.y),-1===o.z&&(i.z=e.z)},r.prototype.updateBoundingSphereRadius=function(){this.boundingSphereRadius=Number.MAX_VALUE}},{"../math/Vec3":30,"./Shape":43}],43:[function(e,t,i){t.exports=n;var n=e("./Shape");function n(){this.id=n.idCounter++,this.type=0,this.boundingSphereRadius=0,this.collisionResponse=!0,this.material=null}e("../math/Vec3"),e("../math/Quaternion"),e("../material/Material"),n.prototype.constructor=n,n.prototype.updateBoundingSphereRadius=function(){throw"computeBoundingSphereRadius() not implemented for shape type "+this.type},n.prototype.volume=function(){throw"volume() not implemented for shape type "+this.type},n.prototype.calculateLocalInertia=function(e,t){throw"calculateLocalInertia() not implemented for shape type "+this.type},n.idCounter=0,n.types={SPHERE:1,PLANE:2,BOX:4,COMPOUND:8,CONVEXPOLYHEDRON:16,HEIGHTFIELD:32,PARTICLE:64,CYLINDER:128,TRIMESH:256}},{"../material/Material":25,"../math/Quaternion":28,"../math/Vec3":30,"./Shape":43}],44:[function(e,t,i){t.exports=r;var n=e("./Shape"),s=e("../math/Vec3");function r(e){if(n.call(this),this.radius=void 0!==e?Number(e):1,this.type=n.types.SPHERE,this.radius<0)throw new Error("The sphere radius cannot be negative.");this.updateBoundingSphereRadius()}r.prototype=new n,r.prototype.constructor=r,r.prototype.calculateLocalInertia=function(e,t){t=t||new s;var i=2*e*this.radius*this.radius/5;return t.x=i,t.y=i,t.z=i,t},r.prototype.volume=function(){return 4*Math.PI*this.radius/3},r.prototype.updateBoundingSphereRadius=function(){this.boundingSphereRadius=this.radius},r.prototype.calculateWorldAABB=function(e,t,i,n){for(var s=this.radius,r=["x","y","z"],o=0;o<r.length;o++){var a=r[o];i[a]=e[a]-s,n[a]=e[a]+s}}},{"../math/Vec3":30,"./Shape":43}],45:[function(e,t,i){t.exports=l;var n=e("./Shape"),s=e("../math/Vec3"),r=(e("../math/Quaternion"),e("../math/Transform")),o=e("../collision/AABB"),a=e("../utils/Octree");function l(e,t){n.call(this),this.type=n.types.TRIMESH,this.vertices=new Float32Array(e),this.indices=new Int16Array(t),this.normals=new Float32Array(t.length),this.aabb=new o,this.edges=null,this.scale=new s(1,1,1),this.tree=new a,this.updateEdges(),this.updateNormals(),this.updateAABB(),this.updateBoundingSphereRadius(),this.updateTree()}l.prototype=new n,l.prototype.constructor=l;var h=new s;l.prototype.updateTree=function(){var e=this.tree;e.reset(),e.aabb.copy(this.aabb);var t=this.scale;e.aabb.lowerBound.x*=1/t.x,e.aabb.lowerBound.y*=1/t.y,e.aabb.lowerBound.z*=1/t.z,e.aabb.upperBound.x*=1/t.x,e.aabb.upperBound.y*=1/t.y,e.aabb.upperBound.z*=1/t.z;for(var i=new o,n=new s,r=new s,a=new s,l=[n,r,a],h=0;h<this.indices.length/3;h++){var c=3*h;this._getUnscaledVertex(this.indices[c],n),this._getUnscaledVertex(this.indices[c+1],r),this._getUnscaledVertex(this.indices[c+2],a),i.setFromPoints(l),e.insert(i,h)}e.removeEmptyNodes()};var c=new o;l.prototype.getTrianglesInAABB=function(e,t){c.copy(e);var i=this.scale,n=i.x,s=i.y,r=i.z,o=c.lowerBound,a=c.upperBound;return o.x/=n,o.y/=s,o.z/=r,a.x/=n,a.y/=s,a.z/=r,this.tree.aabbQuery(c,t)},l.prototype.setScale=function(e){var t=this.scale.x===this.scale.y===this.scale.z,i=e.x===e.y===e.z;t&&i||this.updateNormals(),this.scale.copy(e),this.updateAABB(),this.updateBoundingSphereRadius()},l.prototype.updateNormals=function(){for(var e=h,t=this.normals,i=0;i<this.indices.length/3;i++){var n=3*i,s=this.indices[n],r=this.indices[n+1],o=this.indices[n+2];this.getVertex(s,_),this.getVertex(r,m),this.getVertex(o,g),l.computeNormal(m,_,g,e),t[n]=e.x,t[n+1]=e.y,t[n+2]=e.z}},l.prototype.updateEdges=function(){for(var e={},t=function(t,i){e[s<r?s+"_"+r:r+"_"+s]=!0},i=0;i<this.indices.length/3;i++){var n=3*i,s=this.indices[n],r=this.indices[n+1];this.indices[n+2];t(),t(),t()}var o=Object.keys(e);for(this.edges=new Int16Array(2*o.length),i=0;i<o.length;i++){var a=o[i].split("_");this.edges[2*i]=parseInt(a[0],10),this.edges[2*i+1]=parseInt(a[1],10)}},l.prototype.getEdgeVertex=function(e,t,i){var n=this.edges[2*e+(t?1:0)];this.getVertex(n,i)};var u=new s,d=new s;l.prototype.getEdgeVector=function(e,t){var i=u,n=d;this.getEdgeVertex(e,0,i),this.getEdgeVertex(e,1,n),n.vsub(i,t)};var p=new s,f=new s;l.computeNormal=function(e,t,i,n){t.vsub(e,f),i.vsub(t,p),p.cross(f,n),n.isZero()||n.normalize()};var _=new s,m=new s,g=new s;l.prototype.getVertex=function(e,t){var i=this.scale;return this._getUnscaledVertex(e,t),t.x*=i.x,t.y*=i.y,t.z*=i.z,t},l.prototype._getUnscaledVertex=function(e,t){var i=3*e,n=this.vertices;return t.set(n[i],n[i+1],n[i+2])},l.prototype.getWorldVertex=function(e,t,i,n){return this.getVertex(e,n),r.pointToWorldFrame(t,i,n,n),n},l.prototype.getTriangleVertices=function(e,t,i,n){var s=3*e;this.getVertex(this.indices[s],t),this.getVertex(this.indices[s+1],i),this.getVertex(this.indices[s+2],n)},l.prototype.getNormal=function(e,t){var i=3*e;return t.set(this.normals[i],this.normals[i+1],this.normals[i+2])};var v=new o;l.prototype.calculateLocalInertia=function(e,t){this.computeLocalAABB(v);var i=v.upperBound.x-v.lowerBound.x,n=v.upperBound.y-v.lowerBound.y,s=v.upperBound.z-v.lowerBound.z;return t.set(1/12*e*(2*n*2*n+2*s*2*s),1/12*e*(2*i*2*i+2*s*2*s),1/12*e*(2*n*2*n+2*i*2*i))};var y=new s;l.prototype.computeLocalAABB=function(e){var t=e.lowerBound,i=e.upperBound,n=this.vertices.length,s=(this.vertices,y);this.getVertex(0,s),t.copy(s),i.copy(s);for(var r=0;r!==n;r++)this.getVertex(r,s),s.x<t.x?t.x=s.x:s.x>i.x&&(i.x=s.x),s.y<t.y?t.y=s.y:s.y>i.y&&(i.y=s.y),s.z<t.z?t.z=s.z:s.z>i.z&&(i.z=s.z)},l.prototype.updateAABB=function(){this.computeLocalAABB(this.aabb)},l.prototype.updateBoundingSphereRadius=function(){for(var e=0,t=this.vertices,i=new s,n=0,r=t.length/3;n!==r;n++){this.getVertex(n,i);var o=i.norm2();o>e&&(e=o)}this.boundingSphereRadius=Math.sqrt(e)},new s;var x=new r,b=new o;l.prototype.calculateWorldAABB=function(e,t,i,n){var s=x,r=b;s.position=e,s.quaternion=t,this.aabb.toWorldFrame(s,r),i.copy(r.lowerBound),n.copy(r.upperBound)},l.prototype.volume=function(){return 4*Math.PI*this.boundingSphereRadius/3},l.createTorus=function(e,t,i,n,s){e=e||1,t=t||.5,i=i||8,n=n||6,s=s||2*Math.PI;for(var r=[],o=[],a=0;a<=i;a++)for(var h=0;h<=n;h++){var c=h/n*s,u=a/i*Math.PI*2,d=(e+t*Math.cos(u))*Math.cos(c),p=(e+t*Math.cos(u))*Math.sin(c),f=t*Math.sin(u);r.push(d,p,f)}for(a=1;a<=i;a++)for(h=1;h<=n;h++){var _=(n+1)*a+h-1,m=(n+1)*(a-1)+h-1,g=(n+1)*(a-1)+h,v=(n+1)*a+h;o.push(_,m,v),o.push(m,g,v)}return new l(r,o)}},{"../collision/AABB":3,"../math/Quaternion":28,"../math/Transform":29,"../math/Vec3":30,"../utils/Octree":50,"./Shape":43}],46:[function(e,t,i){t.exports=s,e("../math/Vec3"),e("../math/Quaternion");var n=e("./Solver");function s(){n.call(this),this.iterations=10,this.tolerance=1e-7}s.prototype=new n;var r=[],o=[],a=[];s.prototype.solve=function(e,t){var i,n,s,l,h,c=0,u=this.iterations,d=this.tolerance*this.tolerance,p=this.equations,f=p.length,_=t.bodies,m=_.length,g=e;if(0!==f)for(var v=0;v!==m;v++)_[v].updateSolveMassProperties();var y=o,x=a,b=r;for(y.length=f,x.length=f,b.length=f,v=0;v!==f;v++){var T=p[v];b[v]=0,x[v]=T.computeB(g),y[v]=1/T.computeC()}if(0!==f){for(v=0;v!==m;v++){var S=(A=_[v]).vlambda,E=A.wlambda;S.set(0,0,0),E&&E.set(0,0,0)}for(c=0;c!==u;c++){l=0;for(var C=0;C!==f;C++)T=p[C],i=x[C],n=y[C],(h=b[C])+(s=n*(i-T.computeGWlambda()-T.eps*h))<T.minForce?s=T.minForce-h:h+s>T.maxForce&&(s=T.maxForce-h),b[C]+=s,l+=s>0?s:-s,T.addToWlambda(s);if(l*l<d)break}for(v=0;v!==m;v++){var A,P=(A=_[v]).velocity,R=A.angularVelocity;P.vadd(A.vlambda,P),R&&R.vadd(A.wlambda,R)}}return c}},{"../math/Quaternion":28,"../math/Vec3":30,"./Solver":47}],47:[function(e,t,i){function n(){this.equations=[]}t.exports=n,n.prototype.solve=function(e,t){return 0},n.prototype.addEquation=function(e){e.enabled&&this.equations.push(e)},n.prototype.removeEquation=function(e){var t=this.equations,i=t.indexOf(e);-1!==i&&t.splice(i,1)},n.prototype.removeAllEquations=function(){this.equations.length=0}},{}],48:[function(e,t,i){t.exports=r,e("../math/Vec3"),e("../math/Quaternion");var n=e("./Solver"),s=e("../objects/Body");function r(e){for(n.call(this),this.iterations=10,this.tolerance=1e-7,this.subsolver=e,this.nodes=[],this.nodePool=[];this.nodePool.length<128;)this.nodePool.push(this.createNode())}r.prototype=new n;var o=[],a=[],l={bodies:[]},h=s.STATIC;function c(e){for(var t=e.length,i=0;i!==t;i++){var n=e[i];if(!(n.visited||n.body.type&h))return n}return!1}var u=[];function d(e,t,i,n){for(u.push(e),e.visited=!0,t(e,i,n);u.length;)for(var s,r=u.pop();s=c(r.children);)s.visited=!0,t(s,i,n),u.push(s)}function p(e,t,i){t.push(e.body);for(var n=e.eqs.length,s=0;s!==n;s++){var r=e.eqs[s];-1===i.indexOf(r)&&i.push(r)}}function f(e,t){return t.id-e.id}r.prototype.createNode=function(){return{body:null,children:[],eqs:[],visited:!1}},r.prototype.solve=function(e,t){for(var i=o,n=this.nodePool,s=t.bodies,r=this.equations,h=r.length,u=s.length,_=this.subsolver;n.length<u;)n.push(this.createNode());i.length=u;for(var m=0;m<u;m++)i[m]=n[m];for(m=0;m!==u;m++){var g=i[m];g.body=s[m],g.children.length=0,g.eqs.length=0,g.visited=!1}for(var v=0;v!==h;v++){var y=r[v],x=(m=s.indexOf(y.bi),s.indexOf(y.bj)),b=i[m],T=i[x];b.children.push(T),b.eqs.push(y),T.children.push(b),T.eqs.push(y)}var S,E=0,C=a;_.tolerance=this.tolerance,_.iterations=this.iterations;for(var A=l;S=c(i);){C.length=0,A.bodies.length=0,d(S,p,A.bodies,C);var P=C.length;for(C=C.sort(f),m=0;m!==P;m++)_.addEquation(C[m]);_.solve(e,A),_.removeAllEquations(),E++}return E}},{"../math/Quaternion":28,"../math/Vec3":30,"../objects/Body":31,"./Solver":47}],49:[function(e,t,i){var n=function(){};t.exports=n,n.prototype={constructor:n,addEventListener:function(e,t){void 0===this._listeners&&(this._listeners={});var i=this._listeners;return void 0===i[e]&&(i[e]=[]),-1===i[e].indexOf(t)&&i[e].push(t),this},hasEventListener:function(e,t){if(void 0===this._listeners)return!1;var i=this._listeners;return void 0!==i[e]&&-1!==i[e].indexOf(t)},removeEventListener:function(e,t){if(void 0===this._listeners)return this;var i=this._listeners;if(void 0===i[e])return this;var n=i[e].indexOf(t);return-1!==n&&i[e].splice(n,1),this},dispatchEvent:function(e){if(void 0===this._listeners)return this;var t=this._listeners[e.type];if(void 0!==t){e.target=this;for(var i=0,n=t.length;i<n;i++)t[i].call(this,e)}return this}}},{}],50:[function(e,t,i){var n=e("../collision/AABB"),s=e("../math/Vec3");function r(e){e=e||{},this.root=e.root||null,this.aabb=e.aabb?e.aabb.clone():new n,this.data=[],this.children=[]}function o(e,t){(t=t||{}).root=null,t.aabb=e,r.call(this,t),this.maxDepth=void 0!==t.maxDepth?t.maxDepth:8}t.exports=o,o.prototype=new r,r.prototype.reset=function(e,t){this.children.length=this.data.length=0},r.prototype.insert=function(e,t,i){var n=this.data;if(i=i||0,!this.aabb.contains(e))return!1;var s=this.children;if(i<(this.maxDepth||this.root.maxDepth)){var r=!1;s.length||(this.subdivide(),r=!0);for(var o=0;8!==o;o++)if(s[o].insert(e,t,i+1))return!0;r&&(s.length=0)}return n.push(t),!0};var a=new s;r.prototype.subdivide=function(){var e=this.aabb,t=e.lowerBound,i=e.upperBound,o=this.children;o.push(new r({aabb:new n({lowerBound:new s(0,0,0)})}),new r({aabb:new n({lowerBound:new s(1,0,0)})}),new r({aabb:new n({lowerBound:new s(1,1,0)})}),new r({aabb:new n({lowerBound:new s(1,1,1)})}),new r({aabb:new n({lowerBound:new s(0,1,1)})}),new r({aabb:new n({lowerBound:new s(0,0,1)})}),new r({aabb:new n({lowerBound:new s(1,0,1)})}),new r({aabb:new n({lowerBound:new s(0,1,0)})})),i.vsub(t,a),a.scale(.5,a);for(var l=this.root||this,h=0;8!==h;h++){var c=o[h];c.root=l;var u=c.aabb.lowerBound;u.x*=a.x,u.y*=a.y,u.z*=a.z,u.vadd(t,u),u.vadd(a,c.aabb.upperBound)}},r.prototype.aabbQuery=function(e,t){this.data,this.children;for(var i=[this];i.length;){var n=i.pop();n.aabb.overlaps(e)&&Array.prototype.push.apply(t,n.data),Array.prototype.push.apply(i,n.children)}return t};var l=new n;r.prototype.rayQuery=function(e,t,i){return e.getAABB(l),l.toLocalFrame(t,l),this.aabbQuery(l,i),i},r.prototype.removeEmptyNodes=function(){for(var e=[this];e.length;){for(var t=e.pop(),i=t.children.length-1;i>=0;i--)t.children[i].data.length||t.children.splice(i,1);Array.prototype.push.apply(e,t.children)}}},{"../collision/AABB":3,"../math/Vec3":30}],51:[function(e,t,i){function n(){this.objects=[],this.type=Object}t.exports=n,n.prototype.release=function(){for(var e=arguments.length,t=0;t!==e;t++)this.objects.push(arguments[t])},n.prototype.get=function(){return 0===this.objects.length?this.constructObject():this.objects.pop()},n.prototype.constructObject=function(){throw new Error("constructObject() not implemented in this Pool subclass yet!")}},{}],52:[function(e,t,i){function n(){this.data={keys:[]}}t.exports=n,n.prototype.get=function(e,t){if(e>t){var i=t;t=e,e=i}return this.data[e+"-"+t]},n.prototype.set=function(e,t,i){if(e>t){var n=t;t=e,e=n}var s=e+"-"+t;this.get(e,t)||this.data.keys.push(s),this.data[s]=i},n.prototype.reset=function(){for(var e=this.data,t=e.keys;t.length>0;)delete e[t.pop()]}},{}],53:[function(e,t,i){function n(){}t.exports=n,n.defaults=function(e,t){for(var i in e=e||{},t)i in e||(e[i]=t[i]);return e}},{}],54:[function(e,t,i){t.exports=r;var n=e("../math/Vec3"),s=e("./Pool");function r(){s.call(this),this.type=n}r.prototype=new s,r.prototype.constructObject=function(){return new n}},{"../math/Vec3":30,"./Pool":51}],55:[function(e,t,i){t.exports=d;var n=e("../collision/AABB"),s=e("../shapes/Shape"),r=e("../collision/Ray"),o=e("../math/Vec3"),a=e("../math/Transform"),l=(e("../shapes/ConvexPolyhedron"),e("../math/Quaternion")),h=(e("../solver/Solver"),e("../utils/Vec3Pool")),c=e("../equations/ContactEquation"),u=e("../equations/FrictionEquation");function d(e){this.contactPointPool=[],this.frictionEquationPool=[],this.result=[],this.frictionResult=[],this.v3pool=new h,this.world=e,this.currentContactMaterial=null,this.enableFrictionReduction=!1}d.prototype.createContactEquation=function(e,t,i,n,s,r){var o;this.contactPointPool.length?((o=this.contactPointPool.pop()).bi=e,o.bj=t):o=new c(e,t),o.enabled=e.collisionResponse&&t.collisionResponse&&i.collisionResponse&&n.collisionResponse;var a=this.currentContactMaterial;o.restitution=a.restitution,o.setSpookParams(a.contactEquationStiffness,a.contactEquationRelaxation,this.world.dt);var l=i.material||e.material,h=n.material||t.material;return l&&h&&l.restitution>=0&&h.restitution>=0&&(o.restitution=l.restitution*h.restitution),o.si=s||i,o.sj=r||n,o},d.prototype.createFrictionEquationsFromContact=function(e,t){var i=e.bi,n=e.bj,s=e.si,r=e.sj,o=this.world,a=this.currentContactMaterial,l=a.friction,h=s.material||i.material,c=r.material||n.material;if(h&&c&&h.friction>=0&&c.friction>=0&&(l=h.friction*c.friction),l>0){var d=l*o.gravity.length(),p=i.invMass+n.invMass;p>0&&(p=1/p);var f=this.frictionEquationPool,_=f.length?f.pop():new u(i,n,d*p),m=f.length?f.pop():new u(i,n,d*p);return _.bi=m.bi=i,_.bj=m.bj=n,_.minForce=m.minForce=-d*p,_.maxForce=m.maxForce=d*p,_.ri.copy(e.ri),_.rj.copy(e.rj),m.ri.copy(e.ri),m.rj.copy(e.rj),e.ni.tangents(_.t,m.t),_.setSpookParams(a.frictionEquationStiffness,a.frictionEquationRelaxation,o.dt),m.setSpookParams(a.frictionEquationStiffness,a.frictionEquationRelaxation,o.dt),_.enabled=m.enabled=e.enabled,t.push(_,m),!0}return!1};var p=new o,f=new o,_=new o;d.prototype.createFrictionFromAverage=function(e){var t=this.result[this.result.length-1];if(this.createFrictionEquationsFromContact(t,this.frictionResult)&&1!==e){var i=this.frictionResult[this.frictionResult.length-2],n=this.frictionResult[this.frictionResult.length-1];p.setZero(),f.setZero(),_.setZero();for(var s=t.bi,r=(t.bj,0);r!==e;r++)(t=this.result[this.result.length-1-r]).bodyA!==s?(p.vadd(t.ni,p),f.vadd(t.ri,f),_.vadd(t.rj,_)):(p.vsub(t.ni,p),f.vadd(t.rj,f),_.vadd(t.ri,_));var o=1/e;f.scale(o,i.ri),_.scale(o,i.rj),n.ri.copy(i.ri),n.rj.copy(i.rj),p.normalize(),p.tangents(i.t,n.t)}};var m=new o,g=new o,v=new l,y=new l;d.prototype.getContacts=function(e,t,i,n,s,r,o){this.contactPointPool=s,this.frictionEquationPool=o,this.result=n,this.frictionResult=r;for(var a=v,l=y,h=m,c=g,u=0,d=e.length;u!==d;u++){var p=e[u],f=t[u],_=null;p.material&&f.material&&(_=i.getContactMaterial(p.material,f.material)||null);for(var x=0;x<p.shapes.length;x++){p.quaternion.mult(p.shapeOrientations[x],a),p.quaternion.vmult(p.shapeOffsets[x],h),h.vadd(p.position,h);for(var b=p.shapes[x],T=0;T<f.shapes.length;T++){f.quaternion.mult(f.shapeOrientations[T],l),f.quaternion.vmult(f.shapeOffsets[T],c),c.vadd(f.position,c);var S=f.shapes[T];if(!(h.distanceTo(c)>b.boundingSphereRadius+S.boundingSphereRadius)){var E=null;b.material&&S.material&&(E=i.getContactMaterial(b.material,S.material)||null),this.currentContactMaterial=E||_||i.defaultContactMaterial;var C=this[b.type|S.type];C&&(b.type<S.type?C.call(this,b,S,h,c,a,l,p,f,b,S):C.call(this,S,b,c,h,l,a,f,p,b,S))}}}}},d.prototype[s.types.BOX|s.types.BOX]=d.prototype.boxBox=function(e,t,i,n,s,r,o,a){e.convexPolyhedronRepresentation.material=e.material,t.convexPolyhedronRepresentation.material=t.material,e.convexPolyhedronRepresentation.collisionResponse=e.collisionResponse,t.convexPolyhedronRepresentation.collisionResponse=t.collisionResponse,this.convexConvex(e.convexPolyhedronRepresentation,t.convexPolyhedronRepresentation,i,n,s,r,o,a,e,t)},d.prototype[s.types.BOX|s.types.CONVEXPOLYHEDRON]=d.prototype.boxConvex=function(e,t,i,n,s,r,o,a){e.convexPolyhedronRepresentation.material=e.material,e.convexPolyhedronRepresentation.collisionResponse=e.collisionResponse,this.convexConvex(e.convexPolyhedronRepresentation,t,i,n,s,r,o,a,e,t)},d.prototype[s.types.BOX|s.types.PARTICLE]=d.prototype.boxParticle=function(e,t,i,n,s,r,o,a){e.convexPolyhedronRepresentation.material=e.material,e.convexPolyhedronRepresentation.collisionResponse=e.collisionResponse,this.convexParticle(e.convexPolyhedronRepresentation,t,i,n,s,r,o,a,e,t)},d.prototype[s.types.SPHERE]=d.prototype.sphereSphere=function(e,t,i,n,s,r,o,a){var l=this.createContactEquation(o,a,e,t);n.vsub(i,l.ni),l.ni.normalize(),l.ri.copy(l.ni),l.rj.copy(l.ni),l.ri.mult(e.radius,l.ri),l.rj.mult(-t.radius,l.rj),l.ri.vadd(i,l.ri),l.ri.vsub(o.position,l.ri),l.rj.vadd(n,l.rj),l.rj.vsub(a.position,l.rj),this.result.push(l),this.createFrictionEquationsFromContact(l,this.frictionResult)};var x=new o,b=new o,T=new o;d.prototype[s.types.PLANE|s.types.TRIMESH]=d.prototype.planeTrimesh=function(e,t,i,n,s,r,l,h){var c=new o,u=x;u.set(0,0,1),s.vmult(u,u);for(var d=0;d<t.vertices.length/3;d++){t.getVertex(d,c);var p=new o;p.copy(c),a.pointToWorldFrame(n,r,p,c);var f=b;if(c.vsub(i,f),u.dot(f)<=0){var _=this.createContactEquation(l,h,e,t);_.ni.copy(u);var m=T;u.scale(f.dot(u),m),c.vsub(m,m),_.ri.copy(m),_.ri.vsub(l.position,_.ri),_.rj.copy(c),_.rj.vsub(h.position,_.rj),this.result.push(_),this.createFrictionEquationsFromContact(_,this.frictionResult)}}};var S=new o,E=new o,C=(new o,new o),A=new o,P=new o,R=new o,M=new o,I=new o,D=new o,O=new o,w=new o,N=new o,F=new o,L=new n,B=[];d.prototype[s.types.SPHERE|s.types.TRIMESH]=d.prototype.sphereTrimesh=function(e,t,i,n,s,o,l,h){var c=P,u=R,d=M,p=I,f=D,_=O,m=L,g=A,v=E,y=B;a.pointToLocalFrame(n,o,i,f);var x=e.radius;m.lowerBound.set(f.x-x,f.y-x,f.z-x),m.upperBound.set(f.x+x,f.y+x,f.z+x),t.getTrianglesInAABB(m,y);for(var b=C,T=e.radius*e.radius,U=0;U<y.length;U++)for(var V=0;V<3;V++)t.getVertex(t.indices[3*y[U]+V],b),b.vsub(f,v),v.norm2()<=T&&(g.copy(b),a.pointToWorldFrame(n,o,g,b),b.vsub(i,v),(z=this.createContactEquation(l,h,e,t)).ni.copy(v),z.ni.normalize(),z.ri.copy(z.ni),z.ri.scale(e.radius,z.ri),z.ri.vadd(i,z.ri),z.ri.vsub(l.position,z.ri),z.rj.copy(b),z.rj.vsub(h.position,z.rj),this.result.push(z),this.createFrictionEquationsFromContact(z,this.frictionResult));for(U=0;U<y.length;U++)for(V=0;V<3;V++){t.getVertex(t.indices[3*y[U]+V],c),t.getVertex(t.indices[3*y[U]+(V+1)%3],u),u.vsub(c,d),f.vsub(u,_);var k=_.dot(d);f.vsub(c,_);var G=_.dot(d);if(G>0&&k<0&&(f.vsub(c,_),p.copy(d),p.normalize(),G=_.dot(p),p.scale(G,_),_.vadd(c,_),(q=_.distanceTo(f))<e.radius)){var z=this.createContactEquation(l,h,e,t);_.vsub(f,z.ni),z.ni.normalize(),z.ni.scale(e.radius,z.ri),a.pointToWorldFrame(n,o,_,_),_.vsub(h.position,z.rj),a.vectorToWorldFrame(o,z.ni,z.ni),a.vectorToWorldFrame(o,z.ri,z.ri),this.result.push(z),this.createFrictionEquationsFromContact(z,this.frictionResult)}}for(var W=w,H=N,X=F,j=S,Y=(U=0,y.length);U!==Y;U++){t.getTriangleVertices(y[U],W,H,X),t.getNormal(y[U],j),f.vsub(W,_);var q=_.dot(j);j.scale(q,_),f.vsub(_,_),q=_.distanceTo(f),r.pointInTriangle(_,W,H,X)&&q<e.radius&&(z=this.createContactEquation(l,h,e,t),_.vsub(f,z.ni),z.ni.normalize(),z.ni.scale(e.radius,z.ri),a.pointToWorldFrame(n,o,_,_),_.vsub(h.position,z.rj),a.vectorToWorldFrame(o,z.ni,z.ni),a.vectorToWorldFrame(o,z.ri,z.ri),this.result.push(z),this.createFrictionEquationsFromContact(z,this.frictionResult))}y.length=0};var U=new o,V=new o;d.prototype[s.types.SPHERE|s.types.PLANE]=d.prototype.spherePlane=function(e,t,i,n,s,r,o,a){var l=this.createContactEquation(o,a,e,t);if(l.ni.set(0,0,1),r.vmult(l.ni,l.ni),l.ni.negate(l.ni),l.ni.normalize(),l.ni.mult(e.radius,l.ri),i.vsub(n,U),l.ni.mult(l.ni.dot(U),V),U.vsub(V,l.rj),-U.dot(l.ni)<=e.radius){var h=l.ri,c=l.rj;h.vadd(i,h),h.vsub(o.position,h),c.vadd(n,c),c.vsub(a.position,c),this.result.push(l),this.createFrictionEquationsFromContact(l,this.frictionResult)}};var k=new o,G=new o,z=new o;function W(e,t,i){for(var n=null,s=e.length,r=0;r!==s;r++){var o=e[r],a=k;e[(r+1)%s].vsub(o,a);var l=G;a.cross(t,l);var h=z;i.vsub(o,h);var c=l.dot(h);if(!(null===n||c>0&&!0===n||c<=0&&!1===n))return!1;null===n&&(n=c>0)}return!0}var H=new o,X=new o,j=new o,Y=new o,q=[new o,new o,new o,new o,new o,new o],K=new o,$=new o,Q=new o,Z=new o;d.prototype[s.types.SPHERE|s.types.BOX]=d.prototype.sphereBox=function(e,t,i,n,s,r,o,a){var l=this.v3pool,h=q;i.vsub(n,H),t.getSideNormals(h,r);for(var c=e.radius,u=!1,d=$,p=Q,f=Z,_=null,m=0,g=0,v=0,y=null,x=0,b=h.length;x!==b&&!1===u;x++){var T=X;T.copy(h[x]);var S=T.norm();T.normalize();var E=H.dot(T);if(E<S+c&&E>0){var C=j,A=Y;C.copy(h[(x+1)%3]),A.copy(h[(x+2)%3]);var P=C.norm(),R=A.norm();C.normalize(),A.normalize();var M=H.dot(C),I=H.dot(A);if(M<P&&M>-P&&I<R&&I>-R){var D=Math.abs(E-S-c);(null===y||D<y)&&(y=D,g=M,v=I,_=S,d.copy(T),p.copy(C),f.copy(A),m++)}}}if(m){u=!0;var O=this.createContactEquation(o,a,e,t);d.mult(-c,O.ri),O.ni.copy(d),O.ni.negate(O.ni),d.mult(_,d),p.mult(g,p),d.vadd(p,d),f.mult(v,f),d.vadd(f,O.rj),O.ri.vadd(i,O.ri),O.ri.vsub(o.position,O.ri),O.rj.vadd(n,O.rj),O.rj.vsub(a.position,O.rj),this.result.push(O),this.createFrictionEquationsFromContact(O,this.frictionResult)}for(var w=l.get(),N=K,F=0;2!==F&&!u;F++)for(var L=0;2!==L&&!u;L++)for(var B=0;2!==B&&!u;B++)w.set(0,0,0),F?w.vadd(h[0],w):w.vsub(h[0],w),L?w.vadd(h[1],w):w.vsub(h[1],w),B?w.vadd(h[2],w):w.vsub(h[2],w),n.vadd(w,N),N.vsub(i,N),N.norm2()<c*c&&(u=!0,(O=this.createContactEquation(o,a,e,t)).ri.copy(N),O.ri.normalize(),O.ni.copy(O.ri),O.ri.mult(c,O.ri),O.rj.copy(w),O.ri.vadd(i,O.ri),O.ri.vsub(o.position,O.ri),O.rj.vadd(n,O.rj),O.rj.vsub(a.position,O.rj),this.result.push(O),this.createFrictionEquationsFromContact(O,this.frictionResult));l.release(w),w=null;var U=l.get(),V=l.get(),k=(O=l.get(),l.get()),G=(D=l.get(),h.length);for(F=0;F!==G&&!u;F++)for(L=0;L!==G&&!u;L++)if(F%3!=L%3){h[L].cross(h[F],U),U.normalize(),h[F].vadd(h[L],V),O.copy(i),O.vsub(V,O),O.vsub(n,O);var z=O.dot(U);for(U.mult(z,k),B=0;B===F%3||B===L%3;)B++;D.copy(i),D.vsub(k,D),D.vsub(V,D),D.vsub(n,D);var W=Math.abs(z),J=D.norm();if(W<h[B].norm()&&J<c){u=!0;var ee=this.createContactEquation(o,a,e,t);V.vadd(k,ee.rj),ee.rj.copy(ee.rj),D.negate(ee.ni),ee.ni.normalize(),ee.ri.copy(ee.rj),ee.ri.vadd(n,ee.ri),ee.ri.vsub(i,ee.ri),ee.ri.normalize(),ee.ri.mult(c,ee.ri),ee.ri.vadd(i,ee.ri),ee.ri.vsub(o.position,ee.ri),ee.rj.vadd(n,ee.rj),ee.rj.vsub(a.position,ee.rj),this.result.push(ee),this.createFrictionEquationsFromContact(ee,this.frictionResult)}}l.release(U,V,O,k,D)};var J=new o,ee=new o,te=new o,ie=new o,ne=new o,se=new o,re=new o,oe=new o,ae=new o,le=new o;d.prototype[s.types.SPHERE|s.types.CONVEXPOLYHEDRON]=d.prototype.sphereConvex=function(e,t,i,n,s,r,o,a){var l=this.v3pool;i.vsub(n,J);for(var h=t.faceNormals,c=t.faces,u=t.vertices,d=e.radius,p=0;p!==u.length;p++){var f=u[p],_=ne;r.vmult(f,_),n.vadd(_,_);var m=ie;if(_.vsub(i,m),m.norm2()<d*d)return g=!0,(D=this.createContactEquation(o,a,e,t)).ri.copy(m),D.ri.normalize(),D.ni.copy(D.ri),D.ri.mult(d,D.ri),_.vsub(n,D.rj),D.ri.vadd(i,D.ri),D.ri.vsub(o.position,D.ri),D.rj.vadd(n,D.rj),D.rj.vsub(a.position,D.rj),this.result.push(D),void this.createFrictionEquationsFromContact(D,this.frictionResult)}for(var g=!1,v=(p=0,c.length);p!==v&&!1===g;p++){var y=h[p],x=c[p],b=se;r.vmult(y,b);var T=re;r.vmult(u[x[0]],T),T.vadd(n,T);var S=oe;b.mult(-d,S),i.vadd(S,S);var E=ae;S.vsub(T,E);var C=E.dot(b),A=le;if(i.vsub(T,A),C<0&&A.dot(b)>0){for(var P=[],R=0,M=x.length;R!==M;R++){var I=l.get();r.vmult(u[x[R]],I),n.vadd(I,I),P.push(I)}if(W(P,b,i)){g=!0;var D=this.createContactEquation(o,a,e,t);b.mult(-d,D.ri),b.negate(D.ni);var O=l.get();b.mult(-C,O);var w=l.get();b.mult(-d,w),i.vsub(n,D.rj),D.rj.vadd(w,D.rj),D.rj.vadd(O,D.rj),D.rj.vadd(n,D.rj),D.rj.vsub(a.position,D.rj),D.ri.vadd(i,D.ri),D.ri.vsub(o.position,D.ri),l.release(O),l.release(w),this.result.push(D),this.createFrictionEquationsFromContact(D,this.frictionResult),R=0;for(var N=P.length;R!==N;R++)l.release(P[R]);return}for(R=0;R!==x.length;R++){var F=l.get(),L=l.get();r.vmult(u[x[(R+1)%x.length]],F),r.vmult(u[x[(R+2)%x.length]],L),n.vadd(F,F),n.vadd(L,L);var B=ee;L.vsub(F,B);var U=te;B.unit(U);var V=l.get(),k=l.get();i.vsub(F,k);var G=k.dot(U);U.mult(G,V),V.vadd(F,V);var z=l.get();if(V.vsub(i,z),G>0&&G*G<B.norm2()&&z.norm2()<d*d){for(D=this.createContactEquation(o,a,e,t),V.vsub(n,D.rj),V.vsub(i,D.ni),D.ni.normalize(),D.ni.mult(d,D.ri),D.rj.vadd(n,D.rj),D.rj.vsub(a.position,D.rj),D.ri.vadd(i,D.ri),D.ri.vsub(o.position,D.ri),this.result.push(D),this.createFrictionEquationsFromContact(D,this.frictionResult),R=0,N=P.length;R!==N;R++)l.release(P[R]);return l.release(F),l.release(L),l.release(V),l.release(z),void l.release(k)}l.release(F),l.release(L),l.release(V),l.release(z),l.release(k)}for(R=0,N=P.length;R!==N;R++)l.release(P[R])}}},new o,new o,d.prototype[s.types.PLANE|s.types.BOX]=d.prototype.planeBox=function(e,t,i,n,s,r,o,a){t.convexPolyhedronRepresentation.material=t.material,t.convexPolyhedronRepresentation.collisionResponse=t.collisionResponse,this.planeConvex(e,t.convexPolyhedronRepresentation,i,n,s,r,o,a)};var he=new o,ce=new o,ue=new o,de=new o;d.prototype[s.types.PLANE|s.types.CONVEXPOLYHEDRON]=d.prototype.planeConvex=function(e,t,i,n,s,r,o,a){var l=he,h=ce;h.set(0,0,1),s.vmult(h,h);for(var c=0,u=ue,d=0;d!==t.vertices.length;d++)if(l.copy(t.vertices[d]),r.vmult(l,l),n.vadd(l,l),l.vsub(i,u),h.dot(u)<=0){var p=this.createContactEquation(o,a,e,t),f=de;h.mult(h.dot(u),f),l.vsub(f,f),f.vsub(i,p.ri),p.ni.copy(h),l.vsub(n,p.rj),p.ri.vadd(i,p.ri),p.ri.vsub(o.position,p.ri),p.rj.vadd(n,p.rj),p.rj.vsub(a.position,p.rj),this.result.push(p),c++,this.enableFrictionReduction||this.createFrictionEquationsFromContact(p,this.frictionResult)}this.enableFrictionReduction&&c&&this.createFrictionFromAverage(c)};var pe=new o,fe=new o;d.prototype[s.types.CONVEXPOLYHEDRON]=d.prototype.convexConvex=function(e,t,i,n,s,r,o,a,l,h,c,u){var d=pe;if(!(i.distanceTo(n)>e.boundingSphereRadius+t.boundingSphereRadius)&&e.findSeparatingAxis(t,i,s,n,r,d,c,u)){var p=[],f=fe;e.clipAgainstHull(i,s,t,n,r,d,-100,100,p);for(var _=0,m=0;m!==p.length;m++){var g=this.createContactEquation(o,a,e,t,l,h),v=g.ri,y=g.rj;d.negate(g.ni),p[m].normal.negate(f),f.mult(p[m].depth,f),p[m].point.vadd(f,v),y.copy(p[m].point),v.vsub(i,v),y.vsub(n,y),v.vadd(i,v),v.vsub(o.position,v),y.vadd(n,y),y.vsub(a.position,y),this.result.push(g),_++,this.enableFrictionReduction||this.createFrictionEquationsFromContact(g,this.frictionResult)}this.enableFrictionReduction&&_&&this.createFrictionFromAverage(_)}};var _e=new o,me=new o,ge=new o;d.prototype[s.types.PLANE|s.types.PARTICLE]=d.prototype.planeParticle=function(e,t,i,n,s,r,o,a){var l=_e;l.set(0,0,1),o.quaternion.vmult(l,l);var h=me;if(n.vsub(o.position,h),l.dot(h)<=0){var c=this.createContactEquation(a,o,t,e);c.ni.copy(l),c.ni.negate(c.ni),c.ri.set(0,0,0);var u=ge;l.mult(l.dot(n),u),n.vsub(u,u),c.rj.copy(u),this.result.push(c),this.createFrictionEquationsFromContact(c,this.frictionResult)}};var ve=new o;d.prototype[s.types.PARTICLE|s.types.SPHERE]=d.prototype.sphereParticle=function(e,t,i,n,s,r,o,a){var l=ve;if(l.set(0,0,1),n.vsub(i,l),l.norm2()<=e.radius*e.radius){var h=this.createContactEquation(a,o,t,e);l.normalize(),h.rj.copy(l),h.rj.mult(e.radius,h.rj),h.ni.copy(l),h.ni.negate(h.ni),h.ri.set(0,0,0),this.result.push(h),this.createFrictionEquationsFromContact(h,this.frictionResult)}};var ye=new l,xe=new o,be=(new o,new o),Te=new o,Se=new o;d.prototype[s.types.PARTICLE|s.types.CONVEXPOLYHEDRON]=d.prototype.convexParticle=function(e,t,i,n,s,r,o,a){var l=-1,h=be,c=Se,u=null,d=xe;if(d.copy(n),d.vsub(i,d),s.conjugate(ye),ye.vmult(d,d),e.pointIsInside(d)){e.worldVerticesNeedsUpdate&&e.computeWorldVertices(i,s),e.worldFaceNormalsNeedsUpdate&&e.computeWorldFaceNormals(s);for(var p=0,f=e.faces.length;p!==f;p++){var _=[e.worldVertices[e.faces[p][0]]],m=e.worldFaceNormals[p];n.vsub(_[0],Te);var g=-m.dot(Te);(null===u||Math.abs(g)<Math.abs(u))&&(u=g,l=p,h.copy(m))}if(-1!==l){var v=this.createContactEquation(a,o,t,e);h.mult(u,c),c.vadd(n,c),c.vsub(i,c),v.rj.copy(c),h.negate(v.ni),v.ri.set(0,0,0);var y=v.ri,x=v.rj;y.vadd(n,y),y.vsub(a.position,y),x.vadd(i,x),x.vsub(o.position,x),this.result.push(v),this.createFrictionEquationsFromContact(v,this.frictionResult)}else console.warn("Point found inside convex, but did not find penetrating face!")}},d.prototype[s.types.BOX|s.types.HEIGHTFIELD]=d.prototype.boxHeightfield=function(e,t,i,n,s,r,o,a){e.convexPolyhedronRepresentation.material=e.material,e.convexPolyhedronRepresentation.collisionResponse=e.collisionResponse,this.convexHeightfield(e.convexPolyhedronRepresentation,t,i,n,s,r,o,a)};var Ee=new o,Ce=new o,Ae=[0];d.prototype[s.types.CONVEXPOLYHEDRON|s.types.HEIGHTFIELD]=d.prototype.convexHeightfield=function(e,t,i,n,s,r,o,l){var h=t.data,c=t.elementSize,u=e.boundingSphereRadius,d=Ce,p=Ae,f=Ee;a.pointToLocalFrame(n,r,i,f);var _=Math.floor((f.x-u)/c)-1,m=Math.ceil((f.x+u)/c)+1,g=Math.floor((f.y-u)/c)-1,v=Math.ceil((f.y+u)/c)+1;if(!(m<0||v<0||_>h.length||g>h[0].length)){_<0&&(_=0),m<0&&(m=0),g<0&&(g=0),v<0&&(v=0),_>=h.length&&(_=h.length-1),m>=h.length&&(m=h.length-1),v>=h[0].length&&(v=h[0].length-1),g>=h[0].length&&(g=h[0].length-1);var y=[];t.getRectMinMax(_,g,m,v,y);var x=y[0],b=y[1];if(!(f.z-u>b||f.z+u<x))for(var T=_;T<m;T++)for(var S=g;S<v;S++)t.getConvexTrianglePillar(T,S,!1),a.pointToWorldFrame(n,r,t.pillarOffset,d),i.distanceTo(d)<t.pillarConvex.boundingSphereRadius+e.boundingSphereRadius&&this.convexConvex(e,t.pillarConvex,i,d,s,r,o,l,null,null,p,null),t.getConvexTrianglePillar(T,S,!0),a.pointToWorldFrame(n,r,t.pillarOffset,d),i.distanceTo(d)<t.pillarConvex.boundingSphereRadius+e.boundingSphereRadius&&this.convexConvex(e,t.pillarConvex,i,d,s,r,o,l,null,null,p,null)}};var Pe=new o,Re=new o;d.prototype[s.types.SPHERE|s.types.HEIGHTFIELD]=d.prototype.sphereHeightfield=function(e,t,i,n,s,r,o,l){var h=t.data,c=e.radius,u=t.elementSize,d=Re,p=Pe;a.pointToLocalFrame(n,r,i,p);var f=Math.floor((p.x-c)/u)-1,_=Math.ceil((p.x+c)/u)+1,m=Math.floor((p.y-c)/u)-1,g=Math.ceil((p.y+c)/u)+1;if(!(_<0||g<0||f>h.length||g>h[0].length)){f<0&&(f=0),_<0&&(_=0),m<0&&(m=0),g<0&&(g=0),f>=h.length&&(f=h.length-1),_>=h.length&&(_=h.length-1),g>=h[0].length&&(g=h[0].length-1),m>=h[0].length&&(m=h[0].length-1);var v=[];t.getRectMinMax(f,m,_,g,v);var y=v[0],x=v[1];if(!(p.z-c>x||p.z+c<y))for(var b=this.result,T=f;T<_;T++)for(var S=m;S<g;S++){var E=b.length;if(t.getConvexTrianglePillar(T,S,!1),a.pointToWorldFrame(n,r,t.pillarOffset,d),i.distanceTo(d)<t.pillarConvex.boundingSphereRadius+e.boundingSphereRadius&&this.sphereConvex(e,t.pillarConvex,i,d,s,r,o,l),t.getConvexTrianglePillar(T,S,!0),a.pointToWorldFrame(n,r,t.pillarOffset,d),i.distanceTo(d)<t.pillarConvex.boundingSphereRadius+e.boundingSphereRadius&&this.sphereConvex(e,t.pillarConvex,i,d,s,r,o,l),b.length-E>2)return}}}},{"../collision/AABB":3,"../collision/Ray":9,"../equations/ContactEquation":19,"../equations/FrictionEquation":21,"../math/Quaternion":28,"../math/Transform":29,"../math/Vec3":30,"../shapes/ConvexPolyhedron":38,"../shapes/Shape":43,"../solver/Solver":47,"../utils/Vec3Pool":54}],56:[function(e,t,i){t.exports=v;var n=e("../shapes/Shape"),s=e("../math/Vec3"),r=e("../math/Quaternion"),o=e("../solver/GSSolver"),a=(e("../utils/Vec3Pool"),e("../equations/ContactEquation"),e("../equations/FrictionEquation"),e("./Narrowphase")),l=e("../utils/EventTarget"),h=e("../collision/ArrayCollisionMatrix"),c=e("../material/Material"),u=e("../material/ContactMaterial"),d=e("../objects/Body"),p=e("../utils/TupleDictionary"),f=e("../collision/RaycastResult"),_=e("../collision/AABB"),m=e("../collision/Ray"),g=e("../collision/NaiveBroadphase");function v(){l.apply(this),this.dt=-1,this.allowSleep=!1,this.contacts=[],this.frictionEquations=[],this.quatNormalizeSkip=0,this.quatNormalizeFast=!1,this.time=0,this.stepnumber=0,this.default_dt=1/60,this.nextId=0,this.gravity=new s,this.broadphase=new g,this.bodies=[],this.solver=new o,this.constraints=[],this.narrowphase=new a(this),this.collisionMatrix=new h,this.collisionMatrixPrevious=new h,this.materials=[],this.contactmaterials=[],this.contactMaterialTable=new p,this.defaultMaterial=new c("default"),this.defaultContactMaterial=new u(this.defaultMaterial,this.defaultMaterial,{friction:.3,restitution:0}),this.doProfiling=!1,this.profile={solve:0,makeContactConstraints:0,broadphase:0,integrate:0,narrowphase:0},this.subsystems=[],this.addBodyEvent={type:"addBody",body:null},this.removeBodyEvent={type:"removeBody",body:null}}v.prototype=new l,new _;var y=new m;if(v.prototype.getContactMaterial=function(e,t){return this.contactMaterialTable.get(e.id,t.id)},v.prototype.numObjects=function(){return this.bodies.length},v.prototype.collisionMatrixTick=function(){var e=this.collisionMatrixPrevious;this.collisionMatrixPrevious=this.collisionMatrix,this.collisionMatrix=e,this.collisionMatrix.reset()},v.prototype.add=v.prototype.addBody=function(e){-1===this.bodies.indexOf(e)&&(e.index=this.bodies.length,this.bodies.push(e),e.world=this,e.initPosition.copy(e.position),e.initVelocity.copy(e.velocity),e.timeLastSleepy=this.time,e instanceof d&&(e.initAngularVelocity.copy(e.angularVelocity),e.initQuaternion.copy(e.quaternion)),this.collisionMatrix.setNumObjects(this.bodies.length),this.addBodyEvent.body=e,this.dispatchEvent(this.addBodyEvent))},v.prototype.addConstraint=function(e){this.constraints.push(e)},v.prototype.removeConstraint=function(e){var t=this.constraints.indexOf(e);-1!==t&&this.constraints.splice(t,1)},v.prototype.rayTest=function(e,t,i){i instanceof f?this.raycastClosest(e,t,{skipBackfaces:!0},i):this.raycastAll(e,t,{skipBackfaces:!0},i)},v.prototype.raycastAll=function(e,t,i,n){return i.mode=m.ALL,i.from=e,i.to=t,i.callback=n,y.intersectWorld(this,i)},v.prototype.raycastAny=function(e,t,i,n){return i.mode=m.ANY,i.from=e,i.to=t,i.result=n,y.intersectWorld(this,i)},v.prototype.raycastClosest=function(e,t,i,n){return i.mode=m.CLOSEST,i.from=e,i.to=t,i.result=n,y.intersectWorld(this,i)},v.prototype.remove=function(e){e.world=null;var t=this.bodies.length-1,i=this.bodies,n=i.indexOf(e);if(-1!==n){i.splice(n,1);for(var s=0;s!==i.length;s++)i[s].index=s;this.collisionMatrix.setNumObjects(t),this.removeBodyEvent.body=e,this.dispatchEvent(this.removeBodyEvent)}},v.prototype.removeBody=v.prototype.remove,v.prototype.addMaterial=function(e){this.materials.push(e)},v.prototype.addContactMaterial=function(e){this.contactmaterials.push(e),this.contactMaterialTable.set(e.materials[0].id,e.materials[1].id,e)},"undefined"==typeof performance&&(performance={}),!performance.now){var x=Date.now();performance.timing&&performance.timing.navigationStart&&(x=performance.timing.navigationStart),performance.now=function(){return Date.now()-x}}var b=new s;v.prototype.step=function(e,t,i){if(i=i||10,0===(t=t||0))this.internalStep(e),this.time+=e;else{var n=Math.floor((this.time+t)/e)-Math.floor(this.time/e);n=Math.min(n,i);for(var s=performance.now(),r=0;r!==n&&(this.internalStep(e),!(performance.now()-s>1e3*e));r++);this.time+=t;for(var o=this.time%e/e,a=b,l=this.bodies,h=0;h!==l.length;h++){var c=l[h];c.type!==d.STATIC&&c.sleepState!==d.SLEEPING?(c.position.vsub(c.previousPosition,a),a.scale(o,a),c.position.vadd(a,c.interpolatedPosition)):(c.interpolatedPosition.copy(c.position),c.interpolatedQuaternion.copy(c.quaternion))}}};var T={type:"postStep"},S={type:"preStep"},E={type:"collide",body:null,contact:null},C=[],A=[],P=[],R=[],M=(new s,new s,new s,new s,new s,new s,new s,new s,new s,new r,new r),I=new r,D=new s;v.prototype.internalStep=function(e){this.dt=e;var t,i=this.contacts,s=P,r=R,o=this.numObjects(),a=this.bodies,l=this.solver,h=this.gravity,c=this.doProfiling,u=this.profile,p=d.DYNAMIC,f=this.constraints,_=A,m=(h.norm(),h.x),g=h.y,v=h.z,y=0;for(c&&(t=performance.now()),y=0;y!==o;y++)if((k=a[y]).type&p){var x=k.force,b=k.mass;x.x+=b*m,x.y+=b*g,x.z+=b*v}y=0;for(var O=this.subsystems.length;y!==O;y++)this.subsystems[y].update();c&&(t=performance.now()),s.length=0,r.length=0,this.broadphase.collisionPairs(this,s,r),c&&(u.broadphase=performance.now()-t);var w=f.length;for(y=0;y!==w;y++)if(!(z=f[y]).collideConnected)for(var N=s.length-1;N>=0;N-=1)(z.bodyA===s[N]&&z.bodyB===r[N]||z.bodyB===s[N]&&z.bodyA===r[N])&&(s.splice(N,1),r.splice(N,1));this.collisionMatrixTick(),c&&(t=performance.now());var F=C,L=i.length;for(y=0;y!==L;y++)F.push(i[y]);i.length=0;var B=this.frictionEquations.length;for(y=0;y!==B;y++)_.push(this.frictionEquations[y]);for(this.frictionEquations.length=0,this.narrowphase.getContacts(s,r,this,i,F,this.frictionEquations,_),c&&(u.narrowphase=performance.now()-t),c&&(t=performance.now()),y=0;y<this.frictionEquations.length;y++)l.addEquation(this.frictionEquations[y]);for(var U=i.length,V=0;V!==U;V++){var k=(z=i[V]).bi,G=z.bj;z.si,z.sj,(k.material&&G.material&&this.getContactMaterial(k.material,G.material)||this.defaultContactMaterial).friction,k.material&&G.material&&(k.material.friction>=0&&G.material.friction>=0&&(k.material.friction,G.material.friction),k.material.restitution>=0&&G.material.restitution>=0&&(z.restitution=k.material.restitution*G.material.restitution)),l.addEquation(z),k.allowSleep&&k.type===d.DYNAMIC&&k.sleepState===d.SLEEPING&&G.sleepState===d.AWAKE&&G.type!==d.STATIC&&G.velocity.norm2()+G.angularVelocity.norm2()>=2*Math.pow(G.sleepSpeedLimit,2)&&(k._wakeUpAfterNarrowphase=!0),G.allowSleep&&G.type===d.DYNAMIC&&G.sleepState===d.SLEEPING&&k.sleepState===d.AWAKE&&k.type!==d.STATIC&&k.velocity.norm2()+k.angularVelocity.norm2()>=2*Math.pow(k.sleepSpeedLimit,2)&&(G._wakeUpAfterNarrowphase=!0),this.collisionMatrix.set(k,G,!0),this.collisionMatrixPrevious.get(k,G)||(E.body=G,E.contact=z,k.dispatchEvent(E),E.body=k,G.dispatchEvent(E))}for(c&&(u.makeContactConstraints=performance.now()-t,t=performance.now()),y=0;y!==o;y++)(k=a[y])._wakeUpAfterNarrowphase&&(k.wakeUp(),k._wakeUpAfterNarrowphase=!1);for(w=f.length,y=0;y!==w;y++){var z;(z=f[y]).update(),N=0;for(var W=z.equations.length;N!==W;N++){var H=z.equations[N];l.addEquation(H)}}l.solve(e,this),c&&(u.solve=performance.now()-t),l.removeAllEquations();var X=Math.pow;for(y=0;y!==o;y++)if((k=a[y]).type&p){var j=X(1-k.linearDamping,e),Y=k.velocity;Y.mult(j,Y);var q=k.angularVelocity;if(q){var K=X(1-k.angularDamping,e);q.mult(K,q)}}for(this.dispatchEvent(S),y=0;y!==o;y++)(k=a[y]).preStep&&k.preStep.call(k);c&&(t=performance.now());var $=M,Q=I,Z=this.stepnumber,J=d.DYNAMIC|d.KINEMATIC,ee=Z%(this.quatNormalizeSkip+1)==0,te=this.quatNormalizeFast,ie=.5*e;for(n.types.PLANE,n.types.CONVEXPOLYHEDRON,y=0;y!==o;y++){var ne=a[y],se=ne.force,re=ne.torque;if(ne.type&J&&ne.sleepState!==d.SLEEPING){var oe=ne.velocity,ae=ne.angularVelocity,le=ne.position,he=ne.quaternion,ce=ne.invMass,ue=ne.invInertiaWorld;oe.x+=se.x*ce*e,oe.y+=se.y*ce*e,oe.z+=se.z*ce*e,ne.angularVelocity&&(ue.vmult(re,D),D.mult(e,D),D.vadd(ae,ae)),le.x+=oe.x*e,le.y+=oe.y*e,le.z+=oe.z*e,ne.angularVelocity&&($.set(ae.x,ae.y,ae.z,0),$.mult(he,Q),he.x+=ie*Q.x,he.y+=ie*Q.y,he.z+=ie*Q.z,he.w+=ie*Q.w,ee&&(te?he.normalizeFast():he.normalize())),ne.aabb&&(ne.aabbNeedsUpdate=!0),ne.updateInertiaWorld&&ne.updateInertiaWorld()}}for(this.clearForces(),this.broadphase.dirty=!0,c&&(u.integrate=performance.now()-t),this.time+=e,this.stepnumber+=1,this.dispatchEvent(T),y=0;y!==o;y++){var de=(k=a[y]).postStep;de&&de.call(k)}if(this.allowSleep)for(y=0;y!==o;y++)a[y].sleepTick(this.time)},v.prototype.clearForces=function(){for(var e=this.bodies,t=e.length,i=0;i!==t;i++){var n=e[i];n.force,n.torque,n.force.set(0,0,0),n.torque.set(0,0,0)}}},{"../collision/AABB":3,"../collision/ArrayCollisionMatrix":4,"../collision/NaiveBroadphase":7,"../collision/Ray":9,"../collision/RaycastResult":10,"../equations/ContactEquation":19,"../equations/FrictionEquation":21,"../material/ContactMaterial":24,"../material/Material":25,"../math/Quaternion":28,"../math/Vec3":30,"../objects/Body":31,"../shapes/Shape":43,"../solver/GSSolver":46,"../utils/EventTarget":49,"../utils/TupleDictionary":52,"../utils/Vec3Pool":54,"./Narrowphase":55}]},{},[2])(2)},3706:function(e,t,i){var n=this&&this.__assign||function(){return n=Object.assign||function(e){for(var t,i=1,n=arguments.length;i<n;i++)for(var s in t=arguments[i])Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s]);return e},n.apply(this,arguments)},s=this&&this.__values||function(e){var t="function"==typeof Symbol&&Symbol.iterator,i=t&&e[t],n=0;if(i)return i.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&n>=e.length&&(e=void 0),{value:e&&e[n++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")};t.__esModule=!0,t.Ctx=void 0;var r=i(3876),o=i(9589),a=i(2329),l=i(5016),h=i(343),c=i(4019),u=i(2896),d=i(8810),p=function(){function e(){this.lazyEvtAttach=new h.LazyEvt,this.lazyEvtDetach=new h.LazyEvt,this.lazyEvtDoneOrAborted=new h.LazyEvt,this.handlers=new r.Polyfill,this.evtByHandler=new o.Polyfill}return e.prototype.onDoneOrAborted=function(e){this.lazyEvtDoneOrAborted.post(e)},e.prototype.waitFor=function(e){var t=this;return this.evtDoneOrAborted.waitFor(e).then((function(e){if("ABORTED"===e.type)throw e.error;return e.result}),(function(e){throw t.abort(e),e}))},e.prototype.abort=function(e){return this.__done(e)},e.prototype.done=function(e){return this.__done(void 0,e)},e.prototype.__done=function(e,t){var i,r,o=[];try{for(var a=s(this.handlers.values()),l=a.next();!l.done;l=a.next()){var h=l.value,c=this.evtByHandler.get(h);h.detach()&&o.push({handler:h,evt:c})}}catch(e){i={error:e}}finally{try{l&&!l.done&&(r=a.return)&&r.call(a)}finally{if(i)throw i.error}}return this.onDoneOrAborted(n(n({},e?{type:"ABORTED",error:e}:{type:"DONE",result:t}),{handlers:o})),o},e.prototype.getHandlers=function(){var e=this;return Array.from(this.handlers.values()).map((function(t){return{handler:t,evt:e.evtByHandler.get(t)}}))},e.prototype.zz__addHandler=function(e,t){a.assert(e.ctx===this),a.assert(l.typeGuard(e)),this.handlers.add(e),this.evtByHandler.set(e,t),this.lazyEvtAttach.post({handler:e,evt:t})},e.prototype.zz__removeHandler=function(e){a.assert(e.ctx===this),a.assert(l.typeGuard(e)),this.lazyEvtDetach.post({handler:e,evt:this.evtByHandler.get(e)}),this.handlers.delete(e)},e.__1=(u.defineAccessors(e.prototype,"evtDoneOrAborted",{get:function(){return this.lazyEvtDoneOrAborted.evt}}),u.defineAccessors(e.prototype,"evtAttach",{get:function(){return this.lazyEvtAttach.evt}}),void u.defineAccessors(e.prototype,"evtDetach",{get:function(){return this.lazyEvtDetach.evt}})),e}();t.Ctx=p;try{d.overwriteReadonlyProp(t.Ctx,"name","Ctx")}catch(e){}c.importProxy.Ctx=t.Ctx},4888:(e,t)=>{t.__esModule=!0,t.asNonPostable=void 0,t.asNonPostable=function(e){return e}},6558:(e,t)=>{t.__esModule=!0,t.asPostable=void 0,t.asPostable=function(e){return e}},1462:function(e,t,i){var n=this&&this.__awaiter||function(e,t,i,n){return new(i||(i=Promise))((function(s,r){function o(e){try{l(n.next(e))}catch(e){r(e)}}function a(e){try{l(n.throw(e))}catch(e){r(e)}}function l(e){var t;e.done?s(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(o,a)}l((n=n.apply(e,t||[])).next())}))},s=this&&this.__generator||function(e,t){var i,n,s,r,o={label:0,sent:function(){if(1&s[0])throw s[1];return s[1]},trys:[],ops:[]};return r={next:a(0),throw:a(1),return:a(2)},"function"==typeof Symbol&&(r[Symbol.iterator]=function(){return this}),r;function a(r){return function(a){return function(r){if(i)throw new TypeError("Generator is already executing.");for(;o;)try{if(i=1,n&&(s=2&r[0]?n.return:r[0]?n.throw||((s=n.return)&&s.call(n),0):n.next)&&!(s=s.call(n,r[1])).done)return s;switch(n=0,s&&(r=[2&r[0],s.value]),r[0]){case 0:case 1:s=r;break;case 4:return o.label++,{value:r[1],done:!1};case 5:o.label++,n=r[1],r=[0];continue;case 7:r=o.ops.pop(),o.trys.pop();continue;default:if(!((s=(s=o.trys).length>0&&s[s.length-1])||6!==r[0]&&2!==r[0])){o=0;continue}if(3===r[0]&&(!s||r[1]>s[0]&&r[1]<s[3])){o.label=r[1];break}if(6===r[0]&&o.label<s[1]){o.label=s[1],s=r;break}if(s&&o.label<s[2]){o.label=s[2],o.ops.push(r);break}s[2]&&o.ops.pop(),o.trys.pop();continue}r=t.call(e,o)}catch(e){r=[6,e],n=0}finally{i=s=0}if(5&r[0])throw r[1];return{value:r[0]?r[1]:void 0,done:!0}}([r,a])}}};t.__esModule=!0,t.asyncPipe=void 0;var r=i(9068);t.asyncPipe=function(e,t){var i=this,o="state"in e?r.Evt.create(void 0):r.Evt.create(),a=0,l=function(r){return n(i,void 0,void 0,(function(){var i,n,l;return s(this,(function(s){switch(s.label){case 0:return a++,i=a,null!==(n=t(r))&&"then"in n?[4,n]:[3,2];case 1:return l=s.sent(),"state"in e&&i!==a?[2]:[3,3];case 2:l=n,s.label=3;case 3:return null===l||o.post(l[0]),[2]}}))}))};return e.attach(l),"state"in e&&l(e.state),o}},8408:(e,t,i)=>{t.__esModule=!0,t.create=void 0;var n=i(4019);t.create=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return 0===e.length?new n.importProxy.Evt:new n.importProxy.StatefulEvt(e[0])}},7528:(e,t)=>{t.__esModule=!0,t.factorize=void 0,t.factorize=function(e){return e}},8649:(e,t,i)=>{t.__esModule=!0,t.from=void 0;var n=i(5374),s=i(2329),r=i(5016),o=i(7058),a=i(4019),l=i(8197);function h(e,t,i,r){var c,u,d,p;if(d=t,!l.z_2.canBe(d)){if("then"in t){var f=new a.importProxy.Evt,_=(u=(c=function(){return null==e?void 0:e.evtDoneOrAborted.postCount})(),function(){return u!==c()});return t.then((function(e){_()||f.post(e)})),f}return o.mergeImpl(e,Array.from(t).map((function(t){return h(e,t,i,r)})))}if(l.z_2.NodeStyleEventEmitter_match(t))p={on:function(e,i){return t.addListener(i,e)},off:function(e,i){return t.removeListener(i,e)}};else if(l.z_2.JQueryStyleEventEmitter_match(t))p={on:function(e,i){return t.on(i,e)},off:function(e,i){return t.off(i,e)}};else if(l.z_2.HasEventTargetAddRemove_match(t))p={on:function(e,i,n){return t.addEventListener(i,e,n)},off:function(e,i,n){return t.removeEventListener(i,e,n)}};else if(l.z_2.RxJSSubject_match(t)){var m;p={on:function(e){return m=t.subscribe((function(t){return e(t)}))},off:function(){return m.unsubscribe()}}}else n.id(t),s.assert(!1);var g=new a.importProxy.Evt,v=function(e){return g.post(e)};return null==e||e.evtDoneOrAborted.attachOnce((function(){return p.off(v,i,r)})),p.on(v,i,r),g}t.from=function(e,t,i,n){return"evtDoneOrAborted"in e?(s.assert(r.typeGuard(t)&&r.typeGuard(i)&&r.typeGuard(n)),h(e,t,i,n)):(s.assert(r.typeGuard(t)&&r.typeGuard(i)),h(void 0,e,t,i))}},2878:(e,t,i)=>{t.__esModule=!0,t.getCtxFactory=void 0;var n=i(9589),s=i(4019);t.getCtxFactory=function(){var e=new n.Polyfill;return function(t){var i=e.get(t);return void 0===i&&(i=new s.importProxy.Ctx,e.set(t,i)),i}}},9068:function(e,t,i){var n=this&&this.__assign||function(){return n=Object.assign||function(e){for(var t,i=1,n=arguments.length;i<n;i++)for(var s in t=arguments[i])Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s]);return e},n.apply(this,arguments)},s=this&&this.__read||function(e,t){var i="function"==typeof Symbol&&e[Symbol.iterator];if(!i)return e;var n,s,r=i.call(e),o=[];try{for(;(void 0===t||t-- >0)&&!(n=r.next()).done;)o.push(n.value)}catch(e){s={error:e}}finally{try{n&&!n.done&&(i=r.return)&&i.call(r)}finally{if(s)throw s.error}}return o},r=this&&this.__spread||function(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(s(arguments[t]));return e},o=this&&this.__values||function(e){var t="function"==typeof Symbol&&Symbol.iterator,i=t&&e[t],n=0;if(i)return i.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&n>=e.length&&(e=void 0),{value:e&&e[n++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")};t.__esModule=!0,t.Evt=t.doDetachIfNeeded=void 0,i(6184);var a=i(4019),l=i(8408),h=i(2878),c=i(7528),u=i(7058),d=i(8649),p=i(9752),f=i(6558),_=i(1462),m=i(4888),g=i(8136),v=i(7642),y=i(343),x=i(2896),b=i(808),T=i(6068),S=i(9589),E=i(14),C=i(8810),A=i(5016),P=i(176),R=i(2162),M=i(5614),I=i(4260),D=i(2753),O=i(1562),w=i(7219),N=i(6939),F=function(){function e(){this.lazyEvtAttach=new y.LazyEvt,this.lazyEvtDetach=new y.LazyEvt,this.__maxHandlers=void 0,this.postCount=0,this.traceId=null,this.handlers=[],this.handlerTriggers=new T.Polyfill,this.__currentChronologyMark=0,this.asyncHandlerCount=0}return e.setDefaultMaxHandlers=function(e){this.__defaultMaxHandlers=isFinite(e)?e:0},e.prototype.toStateful=function(e,t){var i=N.z_3.match(e),n=i?void 0:e,s=t||(i?e:void 0),r=new a.importProxy.StatefulEvt(n),o=function(e){return r.post(e)};return s?this.attach(s,o):this.attach(o),r},e.prototype.setMaxHandlers=function(e){return this.__maxHandlers=isFinite(e)?e:0,this},e.prototype.enableTrace=function(e){var t=e.id,i=e.formatter,n=e.log;this.traceId=t,this.traceFormatter=i||function(e){try{return JSON.stringify(e,null,2)}catch(t){return""+e}},this.log=void 0===n?function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return console.log.apply(console,r(e))}:!1===n?void 0:n},e.prototype.disableTrace=function(){return this.traceId=null,this},e.prototype.getChronologyMark=function(){return this.__currentChronologyMark++},e.prototype.detachHandler=function(e,t,i){var n=this.handlers.indexOf(e);return!(n<0||(A.typeGuard(e,!!e.ctx)&&e.ctx.zz__removeHandler(e),this.handlers.splice(n,1),e.async&&this.asyncHandlerCount--,this.handlerTriggers.delete(e),void 0!==t[0]&&(I.safeClearTimeout(t[0]),i(new w.EvtError.Detached)),this.lazyEvtDetach.post(e),0))},e.prototype.triggerHandler=function(e,t,i,n){var r=e.callback,o=e.once;void 0!==t[0]&&(I.safeClearTimeout(t[0]),t[0]=void 0),L(e,n,o);var a=s(n,1)[0],l=null==r?void 0:r.call(this,a);return null==i||i(a),D.isPromiseLike(l)?l:void 0},e.prototype.addHandler=function(e,t){var i=this;O.z_f1.fλ_Stateful_match(e.op)&&this.statelessByStatefulOp.set(e.op,P.encapsulateOpState(e.op));var s=new R.Deferred,r=[void 0],o=n(n(n({},e),t),{detach:function(){return i.detachHandler(o,r,s.reject)},promise:s.pr});if("number"==typeof o.timeout&&(r[0]=I.safeSetTimeout((function(){r[0]=void 0,o.detach(),s.reject(new w.EvtError.Timeout(o.timeout))}),o.timeout)),this.handlerTriggers.set(o,(function(e){return i.triggerHandler(o,r,s.isPending?s.resolve:void 0,e)})),o.async&&this.asyncHandlerChronologyMark.set(o,this.getChronologyMark()),o.prepend){var a=void 0;for(a=0;a<this.handlers.length&&this.handlers[a].extract;a++);this.handlers.splice(a,0,o)}else this.handlers.push(o);return o.async&&this.asyncHandlerCount++,this.checkForPotentialMemoryLeak(),A.typeGuard(o,!!o.ctx)&&o.ctx.zz__addHandler(o,this),this.lazyEvtAttach.post(o),o},e.prototype.checkForPotentialMemoryLeak=function(){var t=void 0!==this.__maxHandlers?this.__maxHandlers:e.__defaultMaxHandlers;if(0!==t&&this.handlers.length%(t+1)==0){var i=["MaxHandlersExceededWarning: Possible Evt memory leak detected.",this.handlers.length+" handlers attached"+(this.traceId?' to "'+this.traceId+'"':"")+".\n","Use Evt.prototype.setMaxHandlers(n) to increase limit on a specific Evt.\n","Use Evt.setDefaultMaxHandlers(n) to change the default limit currently set to "+e.__defaultMaxHandlers+".\n"].join(""),s=new T.Polyfill;this.getHandlers().map((function(e){var t=e.ctx,i=e.async,s=e.once,r=e.prepend,o=e.extract,a=e.op,l=e.callback;return n(n({hasCtx:!!t,once:s,prepend:r,extract:o,isWaitFor:i},a===g.matchAll?{}:{op:a.toString()}),l?{callback:l.toString()}:{})})).map((function(e){return"{\n"+Object.keys(e).map((function(t){return"  "+t+": "+e[t]})).join(",\n")+"\n}"})).forEach((function(e){return s.set(e,(s.has(e)?s.get(e):0)+1)})),i+="\n"+Array.from(s.keys()).map((function(e){return s.get(e)+" handler"+(1===s.get(e)?"":"s")+" like:\n"+e})).join("\n")+"\n",null===this.traceId&&(i+="\n"+["To validate the identify of the Evt instance that is triggering this warning you can call",'Evt.prototype.enableTrace({ "id": "My evt id", "log": false }) on the Evt that you suspect.\n'].join(" "));try{console.warn(i)}catch(e){}}},e.prototype.getStatelessOp=function(e){return O.z_f1.fλ_Stateful_match(e)?this.statelessByStatefulOp.get(e):e},e.prototype.trace=function(e){var t,i=this;if(null!==this.traceId){var n="("+this.traceId+") ",s=!!this.handlers.find((function(t){var n=t.extract,s=t.op;return n&&!!i.getStatelessOp(s)(e)}));if(s)n+="extracted ";else{var r=this.handlers.filter((function(t){var n=t.extract,s=t.op;return!n&&!!i.getStatelessOp(s)(e)})).length;n+=r+" handler"+(r>1?"s":"")+", "}null===(t=this.log)||void 0===t||t.call(this,n+this.traceFormatter(e))}},e.prototype.postSync=function(e){var t,i,n=[],s=function(e){return[e,Promise.all(n).then((function(){}))]};try{for(var a=o(r(this.handlers)),l=a.next();!l.done;l=a.next()){var h=l.value,c=h.async,u=h.op,d=h.extract;if(!c){var p=b.invokeOperator(this.getStatelessOp(u),e,!0);if(O.z_f1.fλ_Result_NotMatched_match(p))L(h,p);else{var f=this.handlerTriggers.get(h);if(f){var _=f(p);if(void 0!==_&&n.push(_),d)return s(!0)}}}}}catch(e){t={error:e}}finally{try{l&&!l.done&&(i=a.return)&&i.call(a)}finally{if(t)throw t.error}}return s(!1)},e.prototype.postAsyncFactory=function(){var e=this;return E.buildMethodCb((function(t,i,n){var s,a;if(0!==e.asyncHandlerCount){var l,h=[];Promise.resolve().then((function(){return l=e.getChronologyMark()}));var c=function(n){if(!n.async)return"continue";var s=b.invokeOperator(e.getStatelessOp(n.op),t,!0);if(O.z_f1.fλ_Result_NotMatched_match(s))return L(n,s),"continue";var r=e.handlerTriggers.get(n);return r&&function(){var t=e.asyncHandlerChronologyMark.get(n);if(i>t)return!0;var s=e.asyncHandlerChronologyExceptionRange.get(n);return void 0!==s&&s.lowerMark<i&&i<s.upperMark&&t>s.upperMark}()?(h.push(new Promise((function(e){return n.promise.then((function(){return e()})).catch((function(){return e()}))}))),void r(s)):"continue"};try{for(var u=o(r(e.handlers)),d=u.next();!d.done;d=u.next())c(d.value)}catch(e){s={error:e}}finally{try{d&&!d.done&&(a=u.return)&&a.call(u)}finally{if(s)throw s.error}}if(0!==h.length){var p=r(e.handlers);Promise.all(h).then((function(){var t,s;try{for(var r=o(e.handlers),a=r.next();!a.done;a=r.next()){var h=a.value;h.async&&(p.indexOf(h)>=0||e.asyncHandlerChronologyExceptionRange.set(h,{lowerMark:i,upperMark:l}))}}catch(e){t={error:e}}finally{try{a&&!a.done&&(s=r.return)&&s.call(r)}finally{if(t)throw t.error}}n()}))}else n()}else n()}))},e.prototype.isHandled=function(e){var t=this;return!!this.getHandlers().find((function(i){var n=i.op;return!!t.getStatelessOp(n)(e)}))},e.prototype.getHandlers=function(){return r(this.handlers)},e.prototype.detach=function(e){var t,i,n=[];try{for(var s=o(this.getHandlers()),r=s.next();!r.done;r=s.next()){var a=r.value;void 0!==e&&a.ctx!==e||a.detach()&&n.push(a)}}catch(e){t={error:e}}finally{try{r&&!r.done&&(i=s.return)&&i.call(s)}finally{if(t)throw t.error}}return n},e.prototype.pipe=function(){for(var t=[],i=0;i<arguments.length;i++)t[i]=arguments[i];var s=new e;return this.addHandler(n(n({},g.parsePropsFromArgs(t,"pipe")),{callback:function(e){return s.post(e)}}),e.propsFormMethodNames.attach),s},e.prototype.waitFor=function(){for(var t=[],i=0;i<arguments.length;i++)t[i]=arguments[i];return this.addHandler(g.parsePropsFromArgs(t,"waitFor"),e.propsFormMethodNames.waitFor).promise},e.prototype.$attach=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.attach.apply(this,r(e))},e.prototype.attach=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.__attachX(e,"attach")},e.prototype.$attachOnce=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.attachOnce.apply(this,r(e))},e.prototype.attachOnce=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.__attachX(e,"attachOnce")},e.prototype.$attachExtract=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.attachExtract.apply(this,r(e))},e.prototype.attachExtract=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.__attachX(e,"attachExtract")},e.prototype.$attachPrepend=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.attachPrepend.apply(this,r(e))},e.prototype.attachPrepend=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.__attachX(e,"attachPrepend")},e.prototype.$attachOncePrepend=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.attachOncePrepend.apply(this,r(e))},e.prototype.attachOncePrepend=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.__attachX(e,"attachOncePrepend")},e.prototype.$attachOnceExtract=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.attachOnceExtract.apply(this,r(e))},e.prototype.attachOnceExtract=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return this.__attachX(e,"attachOnceExtract")},e.prototype.__attachX=function(t,i){var n=g.parsePropsFromArgs(t,"attach*"),s=this.addHandler(n,e.propsFormMethodNames[i]);return void 0===n.timeout?this:s.promise},e.prototype.postAsyncOnceHandled=function(e){var t=this;if(this.isHandled(e))return this.post(e);var i=new R.Deferred;return this.evtAttach.attachOnce((function(i){var n=i.op;return!!b.invokeOperator(t.getStatelessOp(n),e)}),(function(){return Promise.resolve().then((function(){return i.resolve(t.post(e))}))})),i.pr},e.prototype.postOrPostAndWait=function(e,t){var i=this;this.trace(e),C.overwriteReadonlyProp(this,"postCount",this.postCount+1);var n=this.getChronologyMark(),r=s(this.postSync(e),2),o=r[0],a=r[1],l=t?function(){return a}:function(){return i.postCount};if(o)return l();if(void 0===this.postAsync){if(0===this.asyncHandlerCount)return l();this.postAsync=this.postAsyncFactory()}return this.postAsync(e,n),l()},e.prototype.post=function(e){return this.postOrPostAndWait(e,!1)},e.prototype.postAndWait=function(e){return this.postOrPostAndWait(e,!0)},e.create=l.create,e.newCtx=v.newCtx,e.merge=u.merge,e.from=d.from,e.useEffect=p.useEffect,e.getCtx=h.getCtxFactory(),e.loosenType=M.loosenType,e.factorize=c.factorize,e.asPostable=f.asPostable,e.asyncPipe=_.asyncPipe,e.asNonPostable=m.asNonPostable,e.__defaultMaxHandlers=25,e.__1=(x.defineAccessors(e.prototype,"evtAttach",{get:function(){return this.lazyEvtAttach.evt}}),void x.defineAccessors(e.prototype,"evtDetach",{get:function(){return this.lazyEvtDetach.evt}})),e.__2=void Object.defineProperties(e.prototype,["__asyncHandlerChronologyMark","__asyncHandlerChronologyExceptionRange","__statelessByStatefulOp"].map((function(e){return[e.substr(2),{get:function(){return void 0===this[e]&&(this[e]=new S.Polyfill),this[e]}}]})).reduce((function(e,t){var i,r=s(t,2),o=r[0],a=r[1];return n(n({},e),((i={})[o]=a,i))}),{})),e.propsFormMethodNames={waitFor:{async:!0,extract:!1,once:!0,prepend:!1},attach:{async:!1,extract:!1,once:!1,prepend:!1},attachExtract:{async:!1,extract:!0,once:!1,prepend:!0},attachPrepend:{async:!1,extract:!1,once:!1,prepend:!0},attachOnce:{async:!1,extract:!1,once:!0,prepend:!1},attachOncePrepend:{async:!1,extract:!1,once:!0,prepend:!0},attachOnceExtract:{async:!1,extract:!0,once:!0,prepend:!0}},e}();function L(e,t,i){var n=O.z_f1.fλ_Result_getDetachArg(t);if("boolean"!=typeof n){var r=s(n,3),o=r[0],a=r[1],l=r[2];a?o.abort(a):o.done(l)}else(n||i)&&e.detach()}t.doDetachIfNeeded=L,t.Evt=F;try{C.overwriteReadonlyProp(t.Evt,"name","Evt")}catch(e){}a.importProxy.Evt=t.Evt},5614:(e,t)=>{t.__esModule=!0,t.loosenType=void 0,t.loosenType=function(e){return e}},7058:(e,t,i)=>{t.__esModule=!0,t.merge=t.mergeImpl=void 0;var n=i(4019);function s(e,t){var i=new n.importProxy.Evt,s=function(e){return i.post(e)};return t.forEach((function(t){void 0===e?t.attach(s):t.attach(e,s)})),i}t.mergeImpl=s,t.merge=function(e,t){return"length"in e?s(void 0,e):s(e,t)}},7642:(e,t,i)=>{t.__esModule=!0,t.newCtx=void 0;var n=i(4019);t.newCtx=function(){return new n.importProxy.Ctx}},8136:function(e,t,i){var n=this&&this.__assign||function(){return n=Object.assign||function(e){for(var t,i=1,n=arguments.length;i<n;i++)for(var s in t=arguments[i])Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s]);return e},n.apply(this,arguments)},s=this&&this.__read||function(e,t){var i="function"==typeof Symbol&&e[Symbol.iterator];if(!i)return e;var n,s,r=i.call(e),o=[];try{for(;(void 0===t||t-- >0)&&!(n=r.next()).done;)o.push(n.value)}catch(e){s={error:e}}finally{try{n&&!n.done&&(i=r.return)&&i.call(r)}finally{if(s)throw s.error}}return o},r=this&&this.__spread||function(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(s(arguments[t]));return e};t.__esModule=!0,t.parsePropsFromArgs=t.matchAll=void 0;var o=i(5374),a=i(9291),l=i(5016);function h(){return!0}t.matchAll=h;var c=function(e){return void 0!==e&&l.typeGuard(e)&&("function"==typeof e||"function"==typeof e[0])},u={op:h,ctx:void 0,timeout:void 0,callback:void 0};t.parsePropsFromArgs=function e(t,i){switch(l.typeGuard(u),i){case"pipe":var h=function(e){return 0===e.length?{}:{op:1===e.length?e[0]:a.compose.apply(void 0,r(e))}};if(c(t[0]))return o.id(n(n({},u),h(t)));var d=s(t),p=d[0],f=d.slice(1);return o.id(n(n(n({},u),void 0!==p?{ctx:p}:{}),h(f)));case"waitFor":return e(r(t.filter((function(e,i){return!(i===t.length-1&&void 0===e)})),[u.callback]),"attach*");case"attach*":switch(t.length){case 4:var _=s(t,4),m=_[0],g=_[1],v=_[2],y=_[3];return o.id(n(n({},u),{op:m,ctx:g,timeout:v,callback:y}));case 3:var x=s(t,3);if(m=x[0],g=x[1],v=x[2],"number"==typeof g){var b=g,T=v;return c(m)?o.id(n(n({},u),{timeout:b,callback:T,op:m})):o.id(n(n({},u),{timeout:b,callback:T,ctx:m}))}return o.id(n(n({},u),{op:m,ctx:g,callback:v}));case 2:var S=s(t,2);return m=S[0],g=S[1],"number"==typeof m?o.id(n(n({},u),{timeout:m,callback:g})):(T=g,c(m)?o.id(n(n({},u),{callback:T,op:m})):o.id(n(n({},u),{callback:T,ctx:m})));case 1:var E=s(t,1)[0];return o.id(n(n({},u),{callback:E}));case 0:return o.id(n({},u))}}}},9752:(e,t)=>{t.__esModule=!0,t.useEffect=void 0,t.useEffect=function(e,t,i){var n=0;("state"in t?t.evtChange:t).attach((function(t){return e(t,{isFirst:!1,data:t},n++)})),e("state"in t?t.state:null==i?void 0:i[0],{isFirst:!0},n++)}},343:(e,t,i)=>{t.__esModule=!0,t.LazyEvt=void 0;var n=i(8810),s=i(4019),r=i(2896),o=function(){function e(){this.initialPostCount=0}return e.prototype.post=function(e){return void 0===this.__evt?++this.initialPostCount:this.__evt.post(e)},e.__1=void r.defineAccessors(e.prototype,"evt",{get:function(){return void 0===this.__evt&&(this.__evt=new s.importProxy.Evt,n.overwriteReadonlyProp(this.__evt,"postCount",this.initialPostCount)),this.__evt}}),e}();t.LazyEvt=o},8802:(e,t,i)=>{t.__esModule=!0,t.LazyStatefulEvt=void 0;var n=i(8810),s=i(4019),r=i(2896),o=function(){function e(e){this.initialPostCount=0,this.initialState=e}return e.prototype.post=function(e){return void 0===this.__evt?(this.initialState=e,++this.initialPostCount):this.__evt.post(e)},e.__1=void r.defineAccessors(e.prototype,"evt",{get:function(){return void 0===this.__evt&&(this.__evt=new s.importProxy.StatefulEvt(this.initialState),delete this.initialState,n.overwriteReadonlyProp(this.__evt,"postCount",this.initialPostCount)),this.__evt}}),e}();t.LazyStatefulEvt=o},8920:function(e,t,i){var n,s=this&&this.__extends||(n=function(e,t){return n=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)t.hasOwnProperty(i)&&(e[i]=t[i])},n(e,t)},function(e,t){function i(){this.constructor=e}n(e,t),e.prototype=null===t?Object.create(t):(i.prototype=t.prototype,new i)}),r=this&&this.__read||function(e,t){var i="function"==typeof Symbol&&e[Symbol.iterator];if(!i)return e;var n,s,r=i.call(e),o=[];try{for(;(void 0===t||t-- >0)&&!(n=r.next()).done;)o.push(n.value)}catch(e){s={error:e}}finally{try{n&&!n.done&&(i=r.return)&&i.call(r)}finally{if(s)throw s.error}}return o},o=this&&this.__spread||function(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(r(arguments[t]));return e};t.__esModule=!0,t.StatefulEvt=void 0,i(7244);var a=i(2896),l=i(343),h=i(8802),c=i(4019),u=i(808),d=i(8136),p=i(9068),f=i(1562),_=function(e){function t(t){var i=e.call(this)||this;return i.lazyEvtDiff=new l.LazyEvt,i.lazyEvtChangeDiff=new l.LazyEvt,i.__state=t,i.lazyEvtChange=new h.LazyStatefulEvt(i.__state),i}return s(t,e),t.prototype.post=function(e){return this.__post(e,!1)},t.prototype.postForceChange=function(e){return this.__post(e?e[0]:this.state,!0)},t.prototype.__post=function(t,i){var n=this.state;this.__state=t;var s={prevState:n,newState:this.state};return this.lazyEvtDiff.post(s),!i&&Object.is(n,this.state)||(this.lazyEvtChange.post(this.state),this.lazyEvtChangeDiff.post(s)),e.prototype.post.call(this,t)},t.prototype.pipe=function(){for(var t=[],i=0;i<arguments.length;i++)t[i]=arguments[i];var n=e.prototype.pipe.apply(this,o(t)),s=u.invokeOperator(this.getStatelessOp(d.parsePropsFromArgs(t,"pipe").op),this.state);if(f.z_f1.fλ_Result_NotMatched_match(s))throw new Error(["Cannot pipe StatefulEvt because the operator does not match","it's current state.","Use evt.toStateless([ctx]).pipe(op).toStatic(initialState)","to be sure the StatefulEvt is correctly initialized"].join(" "));return n.toStateful(s[0])},t.prototype.toStateless=function(t){return t?e.prototype.pipe.call(this,t):e.prototype.pipe.call(this)},t.__4=(a.defineAccessors(t.prototype,"state",{get:function(){return this.__state},set:function(e){this.post(e)}}),a.defineAccessors(t.prototype,"evtDiff",{get:function(){return this.lazyEvtDiff.evt}}),a.defineAccessors(t.prototype,"evtChange",{get:function(){return this.lazyEvtChange.evt}}),void a.defineAccessors(t.prototype,"evtChangeDiff",{get:function(){return this.lazyEvtChangeDiff.evt}})),t}(p.Evt);t.StatefulEvt=_,c.importProxy.StatefulEvt=t.StatefulEvt},4019:(e,t)=>{t.__esModule=!0,t.importProxy=void 0,t.importProxy={}},1932:function(e,t,i){var n=this&&this.__createBinding||(Object.create?function(e,t,i,n){void 0===n&&(n=i),Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[i]}})}:function(e,t,i,n){void 0===n&&(n=i),e[n]=t[i]}),s=this&&this.__exportStar||function(e,t){for(var i in e)"default"===i||t.hasOwnProperty(i)||n(t,e,i)};t.__esModule=!0,s(i(8862),t),s(i(8570),t);var r=i(3706);n(t,r,"Ctx");var o=i(9068);n(t,o,"Evt");var a=i(8920);n(t,a,"StatefulEvt");var l=i(1278);n(t,l,"matchVoid")},8197:(e,t,i)=>{t.__esModule=!0,t.EventTargetLike=t.z_2=void 0;var n,s=i(8630);t.z_2={RxJSSubject_match:function(e){return s.typeGuard(e)&&e instanceof Object&&"function"==typeof e.subscribe},NodeStyleEventEmitter_match:function(e){return s.typeGuard(e)&&e instanceof Object&&"function"==typeof e.addListener&&"function"==typeof e.removeListener},JQueryStyleEventEmitter_match:function(e){return s.typeGuard(e)&&e instanceof Object&&"function"==typeof e.on&&"function"==typeof e.off},HasEventTargetAddRemove_match:function(e){return s.typeGuard(e)&&e instanceof Object&&"function"==typeof e.addEventListener&&"function"==typeof e.removeEventListener},canBe:function(e){try{return t.z_2.HasEventTargetAddRemove_match(e)||t.z_2.NodeStyleEventEmitter_match(e)||t.z_2.JQueryStyleEventEmitter_match(e)||t.z_2.RxJSSubject_match(e)}catch(e){return!1}}},((n=t.EventTargetLike||(t.EventTargetLike={})).RxJSSubject||(n.RxJSSubject={})).match=t.z_2.RxJSSubject_match,(n.NodeStyleEventEmitter||(n.NodeStyleEventEmitter={})).match=t.z_2.NodeStyleEventEmitter_match,(n.JQueryStyleEventEmitter||(n.JQueryStyleEventEmitter={})).match=t.z_2.JQueryStyleEventEmitter_match,(n.HasEventTargetAddRemove||(n.HasEventTargetAddRemove={})).match=t.z_2.HasEventTargetAddRemove_match,n.canBe=t.z_2.canBe},380:function(e,t){var i,n=this&&this.__extends||(i=function(e,t){return i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)t.hasOwnProperty(i)&&(e[i]=t[i])},i(e,t)},function(e,t){function n(){this.constructor=e}i(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)});t.__esModule=!0,t.Detached=void 0;var s=function(e){function t(){var t=this.constructor,i=e.call(this,"Evt handler detached")||this;return Object.setPrototypeOf(i,t.prototype),i}return n(t,e),t}(Error);t.Detached=s},3883:function(e,t){var i,n=this&&this.__extends||(i=function(e,t){return i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)t.hasOwnProperty(i)&&(e[i]=t[i])},i(e,t)},function(e,t){function n(){this.constructor=e}i(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)});t.__esModule=!0,t.Timeout=void 0;var s=function(e){function t(t){var i=this.constructor,n=e.call(this,"Evt timeout after "+t+"ms")||this;return n.timeout=t,Object.setPrototypeOf(n,i.prototype),n}return n(t,e),t}(Error);t.Timeout=s},7219:(e,t,i)=>{t.__esModule=!0,t.EvtError=void 0;var n,s=i(3883),r=i(380);(n=t.EvtError||(t.EvtError={})).Timeout=s.Timeout,n.Detached=r.Detached},5415:(e,t)=>{t.__esModule=!0},1562:(e,t,i)=>{t.__esModule=!0,t.Operator=t.z_f1=void 0;var n,s,r,o,a=i(8630);t.z_f1={fλ_Stateful_match:function(e){return"function"!=typeof e},fλ_Result_match:function(e){return t.z_f1.fλ_Result_Matched_match(e)||t.z_f1.fλ_Result_NotMatched_match(e)},fλ_Result_getDetachArg:function(e){var i=t.z_f1.fλ_Result_Matched_match(e)?e[1]:e;return!!t.z_f1.fλ_Result_Detach_FromEvt_match(i)||!!t.z_f1.fλ_Result_Detach_WithCtxArg_match(i)&&[i.DETACH,i.err,i.res]},fλ_Result_NotMatched_match:function(e){return null===e||t.z_f1.fλ_Result_Detach_match(e)},fλ_Result_Matched_match:function(e){return a.typeGuard(e)&&e instanceof Object&&!("input"in e)&&(1===e.length||2===e.length&&(null===e[1]||t.z_f1.fλ_Result_Detach_match(e[1])))},fλ_Result_Detach_FromEvt_match:function(e){return"DETACH"===e},fλ_Result_Detach_WithCtxArg_match:function(e){return a.typeGuard(e)&&e instanceof Object&&e.DETACH instanceof Object},fλ_Result_Detach_match:function(e){return t.z_f1.fλ_Result_Detach_FromEvt_match(e)||t.z_f1.fλ_Result_Detach_WithCtxArg_match(e)}},n=t.Operator||(t.Operator={}),((s=n.fλ||(n.fλ={})).Stateful||(s.Stateful={})).match=t.z_f1.fλ_Stateful_match,(r=s.Result||(s.Result={})).match=t.z_f1.fλ_Result_match,r.getDetachArg=t.z_f1.fλ_Result_getDetachArg,(r.NotMatched||(r.NotMatched={})).match=t.z_f1.fλ_Result_NotMatched_match,(r.Matched||(r.Matched={})).match=t.z_f1.fλ_Result_Matched_match,((o=r.Detach||(r.Detach={})).FromEvt||(o.FromEvt={})).match=t.z_f1.fλ_Result_Detach_FromEvt_match,(o.WithCtxArg||(o.WithCtxArg={})).match=t.z_f1.fλ_Result_Detach_WithCtxArg_match,o.match=t.z_f1.fλ_Result_Detach_match},8381:(e,t)=>{t.__esModule=!0},8862:function(e,t,i){var n=this&&this.__createBinding||(Object.create?function(e,t,i,n){void 0===n&&(n=i),Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[i]}})}:function(e,t,i,n){void 0===n&&(n=i),e[n]=t[i]}),s=this&&this.__exportStar||function(e,t){for(var i in e)"default"===i||t.hasOwnProperty(i)||n(t,e,i)};t.__esModule=!0,t.dom=void 0,s(i(8381),t),s(i(9730),t),s(i(8197),t),s(i(7219),t),s(i(5415),t);var r=i(7163);t.dom=r,s(i(1562),t)},3135:(e,t)=>{t.__esModule=!0},6939:(e,t,i)=>{t.__esModule=!0,t.CtxLike=t.z_3=void 0;var n=i(5016);t.z_3={match:function(e){return n.typeGuard(e)&&e instanceof Object&&"function"==typeof e.done&&"function"==typeof e.abort&&"function"==typeof e.zz__addHandler&&"function"==typeof e.zz__removeHandler}},(t.CtxLike||(t.CtxLike={})).match=t.z_3.match},4597:(e,t)=>{t.__esModule=!0},774:(e,t)=>{t.__esModule=!0},8456:(e,t)=>{t.__esModule=!0},2690:(e,t)=>{t.__esModule=!0},2751:(e,t)=>{t.__esModule=!0},1784:(e,t)=>{t.__esModule=!0},9730:function(e,t,i){var n=this&&this.__createBinding||(Object.create?function(e,t,i,n){void 0===n&&(n=i),Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[i]}})}:function(e,t,i,n){void 0===n&&(n=i),e[n]=t[i]}),s=this&&this.__exportStar||function(e,t){for(var i in e)"default"===i||t.hasOwnProperty(i)||n(t,e,i)};t.__esModule=!0,s(i(3135),t),s(i(6939),t),s(i(4597),t),s(i(774),t),s(i(8456),t),s(i(2690),t),s(i(2751),t),s(i(1784),t)},7163:(e,t)=>{t.__esModule=!0,t.__hack=void 0,t.__hack="NOT TYPE ONLY"},9291:function(e,t,i){var n=this&&this.__read||function(e,t){var i="function"==typeof Symbol&&e[Symbol.iterator];if(!i)return e;var n,s,r=i.call(e),o=[];try{for(;(void 0===t||t-- >0)&&!(n=r.next()).done;)o.push(n.value)}catch(e){s={error:e}}finally{try{n&&!n.done&&(i=r.return)&&i.call(r)}finally{if(s)throw s.error}}return o},s=this&&this.__spread||function(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(n(arguments[t]));return e};t.__esModule=!0,t.compose=void 0;var r=i(176),o=i(808),a=i(5374),l=i(2329),h=i(5016),c=i(1562);t.compose=function e(){for(var t=[],i=0;i<arguments.length;i++)t[i]=arguments[i];if(1===t.length){var u=n(t,1)[0];return c.z_f1.fλ_Stateful_match(u)?r.encapsulateOpState(u):u}var d=n(t),p=d[0],f=d[1],_=d.slice(2),m=function(e,t){var i=c.z_f1.fλ_Stateful_match(e)?r.encapsulateOpState(e):a.id(e),s=c.z_f1.fλ_Stateful_match(t)?r.encapsulateOpState(t):a.id(t);return a.id((function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];var r=n(e,3),u=r[0],d=r[2],p=o.invokeOperator(i,u,d);if(c.z_f1.fλ_Result_NotMatched_match(p))return l.assert(h.typeGuard(p)),p;var f=p[1]?p[1]:null;l.assert(h.typeGuard(f));var _=n(p,1)[0],m=o.invokeOperator(s,_,d);return c.Operator.fλ.Result.NotMatched.match(m)?(l.assert(h.typeGuard(m)),null!==f?f:m):a.id([m[0],f||(m[1]?m[1]:null)])}))}(p,f);return 0===_.length?m:e.apply(void 0,s([m],_))}},176:function(e,t,i){var n=this&&this.__read||function(e,t){var i="function"==typeof Symbol&&e[Symbol.iterator];if(!i)return e;var n,s,r=i.call(e),o=[];try{for(;(void 0===t||t-- >0)&&!(n=r.next()).done;)o.push(n.value)}catch(e){s={error:e}}finally{try{n&&!n.done&&(i=r.return)&&i.call(r)}finally{if(s)throw s.error}}return o};t.__esModule=!0,t.encapsulateOpState=void 0;var s=i(5374),r=i(1562);t.encapsulateOpState=function(e){var t=e[1];return s.id((function(){for(var i=[],s=0;s<arguments.length;s++)i[s]=arguments[s];var o=n(i,3),a=o[0],l=o[2],h=e[0](a,t,l);return l&&r.z_f1.fλ_Result_Matched_match(h)&&(t=h[0]),h}))}},5957:function(e,t,i){var n=this&&this.__createBinding||(Object.create?function(e,t,i,n){void 0===n&&(n=i),Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[i]}})}:function(e,t,i,n){void 0===n&&(n=i),e[n]=t[i]});t.__esModule=!0,n(t,i(7016),"throttleTime"),n(t,i(8055),"to"),n(t,i(4205),"nonNullable")},4205:(e,t)=>{t.__esModule=!0,t.nonNullable=void 0,t.nonNullable=function(e){return null==e?null:[e]}},7016:(e,t,i)=>{t.__esModule=!0,t.throttleTime=void 0;var n=i(9291);t.throttleTime=function(e){return n.compose([function(t,i){var n=i.lastClick,s=Date.now();return s-n<e?null:[{data:t,lastClick:s}]},{lastClick:0,data:null}],(function(e){return[e.data]}))}},8055:(e,t)=>{t.__esModule=!0,t.to=void 0;var i=new Map;t.to=function(e){var n;return null!==(n=i.get(e))&&void 0!==n?n:(i.set(e,(function(t){return t[0]!==e?null:[t[1]]})),t.to(e))}},8570:function(e,t,i){var n=this&&this.__createBinding||(Object.create?function(e,t,i,n){void 0===n&&(n=i),Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[i]}})}:function(e,t,i,n){void 0===n&&(n=i),e[n]=t[i]}),s=this&&this.__exportStar||function(e,t){for(var i in e)"default"===i||t.hasOwnProperty(i)||n(t,e,i)};t.__esModule=!0,s(i(5957),t);var r=i(9291);n(t,r,"compose");var o=i(808);n(t,o,"invokeOperator")},808:(e,t,i)=>{t.__esModule=!0,t.invokeOperator=void 0;var n=i(1562);t.invokeOperator=function(e,t,i){var s=e(t,void 0,i);return n.z_f1.fλ_Result_match(s)?s:s?[t]:null}},2162:function(e,t,i){var n,s=this&&this.__extends||(n=function(e,t){return n=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)t.hasOwnProperty(i)&&(e[i]=t[i])},n(e,t)},function(e,t){function i(){this.constructor=e}n(e,t),e.prototype=null===t?Object.create(t):(i.prototype=t.prototype,new i)});t.__esModule=!0,t.VoidDeferred=t.Deferred=void 0;var r=i(8810),o=function(){var e,t,i=this;this.isPending=!0,this.pr=new Promise((function(n,s){e=function(e){r.overwriteReadonlyProp(i,"isPending",!1),n(e)},t=function(e){r.overwriteReadonlyProp(i,"isPending",!1),s(e)}})),this.resolve=e,this.reject=t};t.Deferred=o;var a=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return s(t,e),t}(o);t.VoidDeferred=a},4260:(e,t)=>{t.__esModule=!0,t.safeClearTimeout=t.safeSetTimeout=void 0,t.safeSetTimeout=function(e,t){return setTimeout(e,t)},t.safeClearTimeout=function(e){return clearTimeout(e)}},2329:function(e,t,i){var n,s=this&&this.__extends||(n=function(e,t){return n=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)t.hasOwnProperty(i)&&(e[i]=t[i])},n(e,t)},function(e,t){function i(){this.constructor=e}n(e,t),e.prototype=null===t?Object.create(t):(i.prototype=t.prototype,new i)}),r=this&&this.__read||function(e,t){var i="function"==typeof Symbol&&e[Symbol.iterator];if(!i)return e;var n,s,r=i.call(e),o=[];try{for(;(void 0===t||t-- >0)&&!(n=r.next()).done;)o.push(n.value)}catch(e){s={error:e}}finally{try{n&&!n.done&&(i=r.return)&&i.call(r)}finally{if(s)throw s.error}}return o};t.__esModule=!0,t.assert=t.AssertionError=void 0;var o=i(8810),a=function(e){function t(t){var i=this.constructor,n=e.call(this,"Wrong assertion encountered"+(t?': "'+t+'"':""))||this;if(Object.setPrototypeOf(n,i.prototype),!n.stack)return n;try{o.overwriteReadonlyProp(n,"stack",n.stack.split("\n").filter((function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];var i=r(e,2)[1];return 1!==i&&2!==i})).join("\n"))}catch(e){}return n}return s(t,e),t}(Error);t.AssertionError=a,t.assert=function(e,t){if(!e)throw new a(t)}},2896:function(e,t){var i=this&&this.__assign||function(){return i=Object.assign||function(e){for(var t,i=1,n=arguments.length;i<n;i++)for(var s in t=arguments[i])Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s]);return e},i.apply(this,arguments)};t.__esModule=!0,t.defineAccessors=void 0,t.defineAccessors=function(e,t,n){var s=n.get,r=n.set;Object.defineProperty(e,t,i(i(i({},Object.getOwnPropertyDescriptor(e,t)||{enumerable:!0,configurable:!0}),void 0!==s?{get:function(){return s.call(this)}}:{}),void 0!==r?{set:function(e){r.call(this,e)}}:{}))}},5288:(e,t)=>{t.__esModule=!0,t.exclude=void 0,t.exclude=function(e){var t=e instanceof Object?function(t){return e.indexOf(t)<0}:function(t){return t!==e};return function(e){return t(e)}}},5374:(e,t)=>{t.__esModule=!0,t.id=void 0,t.id=function(e){return e}},8630:function(e,t,i){var n=this&&this.__createBinding||(Object.create?function(e,t,i,n){void 0===n&&(n=i),Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[i]}})}:function(e,t,i,n){void 0===n&&(n=i),e[n]=t[i]});t.__esModule=!0,n(t,i(2329),"assert"),n(t,i(5288),"exclude"),n(t,i(5374),"id"),n(t,i(1278),"matchVoid"),n(t,i(5192),"objectKeys"),n(t,i(5016),"typeGuard")},2753:(e,t)=>{t.__esModule=!0,t.isPromiseLike=void 0,t.isPromiseLike=function(e){return"function"==typeof(null==e?void 0:e.then)}},1278:(e,t)=>{t.__esModule=!0,t.matchVoid=void 0,t.matchVoid=function(e){return void 0===e}},5192:(e,t)=>{t.__esModule=!0,t.objectKeys=void 0,t.objectKeys=function(e){return Object.keys(e)}},8810:function(e,t){var i=this&&this.__assign||function(){return i=Object.assign||function(e){for(var t,i=1,n=arguments.length;i<n;i++)for(var s in t=arguments[i])Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s]);return e},i.apply(this,arguments)};t.__esModule=!0,t.overwriteReadonlyProp=void 0,t.overwriteReadonlyProp=function(e,t,n){try{e[t]=n}catch(e){}if(e[t]===n)return n;var s=void 0,r=Object.getOwnPropertyDescriptor(e,t)||{enumerable:!0,configurable:!0};if(r.get)throw new Error("Probably a wrong ides to overwrite "+t+" getter");try{Object.defineProperty(e,t,i(i({},r),{value:n}))}catch(e){s=e}if(e[t]!==n)throw s||new Error("Can't assign");return n}},5016:(e,t)=>{t.__esModule=!0,t.typeGuard=void 0,t.typeGuard=function(e,t){return void 0===t&&(t=!0),t}},1297:(e,t,i)=>{e.exports=function e(t,i,n){function s(o,a){if(!i[o]){if(!t[o]){if(r)return r(o,!0);var l=new Error("Cannot find module '"+o+"'");throw l.code="MODULE_NOT_FOUND",l}var h=i[o]={exports:{}};t[o][0].call(h.exports,(function(e){return s(t[o][1][e]||e)}),h,h.exports,e,t,i,n)}return i[o].exports}for(var r=void 0,o=0;o<n.length;o++)s(n[o]);return s}({1:[function(e,t,i){var n=e("./utils"),s=e("./support"),r="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";i.encode=function(e){for(var t,i,s,o,a,l,h,c=[],u=0,d=e.length,p=d,f="string"!==n.getTypeOf(e);u<e.length;)p=d-u,s=f?(t=e[u++],i=u<d?e[u++]:0,u<d?e[u++]:0):(t=e.charCodeAt(u++),i=u<d?e.charCodeAt(u++):0,u<d?e.charCodeAt(u++):0),o=t>>2,a=(3&t)<<4|i>>4,l=1<p?(15&i)<<2|s>>6:64,h=2<p?63&s:64,c.push(r.charAt(o)+r.charAt(a)+r.charAt(l)+r.charAt(h));return c.join("")},i.decode=function(e){var t,i,n,o,a,l,h=0,c=0,u="data:";if(e.substr(0,5)===u)throw new Error("Invalid base64 input, it looks like a data url.");var d,p=3*(e=e.replace(/[^A-Za-z0-9+/=]/g,"")).length/4;if(e.charAt(e.length-1)===r.charAt(64)&&p--,e.charAt(e.length-2)===r.charAt(64)&&p--,p%1!=0)throw new Error("Invalid base64 input, bad content length.");for(d=s.uint8array?new Uint8Array(0|p):new Array(0|p);h<e.length;)t=r.indexOf(e.charAt(h++))<<2|(o=r.indexOf(e.charAt(h++)))>>4,i=(15&o)<<4|(a=r.indexOf(e.charAt(h++)))>>2,n=(3&a)<<6|(l=r.indexOf(e.charAt(h++))),d[c++]=t,64!==a&&(d[c++]=i),64!==l&&(d[c++]=n);return d}},{"./support":30,"./utils":32}],2:[function(e,t,i){var n=e("./external"),s=e("./stream/DataWorker"),r=e("./stream/Crc32Probe"),o=e("./stream/DataLengthProbe");function a(e,t,i,n,s){this.compressedSize=e,this.uncompressedSize=t,this.crc32=i,this.compression=n,this.compressedContent=s}a.prototype={getContentWorker:function(){var e=new s(n.Promise.resolve(this.compressedContent)).pipe(this.compression.uncompressWorker()).pipe(new o("data_length")),t=this;return e.on("end",(function(){if(this.streamInfo.data_length!==t.uncompressedSize)throw new Error("Bug : uncompressed data size mismatch")})),e},getCompressedWorker:function(){return new s(n.Promise.resolve(this.compressedContent)).withStreamInfo("compressedSize",this.compressedSize).withStreamInfo("uncompressedSize",this.uncompressedSize).withStreamInfo("crc32",this.crc32).withStreamInfo("compression",this.compression)}},a.createWorkerFrom=function(e,t,i){return e.pipe(new r).pipe(new o("uncompressedSize")).pipe(t.compressWorker(i)).pipe(new o("compressedSize")).withStreamInfo("compression",t)},t.exports=a},{"./external":6,"./stream/Crc32Probe":25,"./stream/DataLengthProbe":26,"./stream/DataWorker":27}],3:[function(e,t,i){var n=e("./stream/GenericWorker");i.STORE={magic:"\0\0",compressWorker:function(){return new n("STORE compression")},uncompressWorker:function(){return new n("STORE decompression")}},i.DEFLATE=e("./flate")},{"./flate":7,"./stream/GenericWorker":28}],4:[function(e,t,i){var n=e("./utils"),s=function(){for(var e,t=[],i=0;i<256;i++){e=i;for(var n=0;n<8;n++)e=1&e?3988292384^e>>>1:e>>>1;t[i]=e}return t}();t.exports=function(e,t){return void 0!==e&&e.length?"string"!==n.getTypeOf(e)?function(e,t,i,n){var r=s,o=0+i;e^=-1;for(var a=0;a<o;a++)e=e>>>8^r[255&(e^t[a])];return-1^e}(0|t,e,e.length):function(e,t,i,n){var r=s,o=0+i;e^=-1;for(var a=0;a<o;a++)e=e>>>8^r[255&(e^t.charCodeAt(a))];return-1^e}(0|t,e,e.length):0}},{"./utils":32}],5:[function(e,t,i){i.base64=!1,i.binary=!1,i.dir=!1,i.createFolders=!0,i.date=null,i.compression=null,i.compressionOptions=null,i.comment=null,i.unixPermissions=null,i.dosPermissions=null},{}],6:[function(e,t,i){var n;n="undefined"!=typeof Promise?Promise:e("lie"),t.exports={Promise:n}},{lie:37}],7:[function(e,t,i){var n="undefined"!=typeof Uint8Array&&"undefined"!=typeof Uint16Array&&"undefined"!=typeof Uint32Array,s=e("pako"),r=e("./utils"),o=e("./stream/GenericWorker"),a=n?"uint8array":"array";function l(e,t){o.call(this,"FlateWorker/"+e),this._pako=null,this._pakoAction=e,this._pakoOptions=t,this.meta={}}i.magic="\b\0",r.inherits(l,o),l.prototype.processChunk=function(e){this.meta=e.meta,null===this._pako&&this._createPako(),this._pako.push(r.transformTo(a,e.data),!1)},l.prototype.flush=function(){o.prototype.flush.call(this),null===this._pako&&this._createPako(),this._pako.push([],!0)},l.prototype.cleanUp=function(){o.prototype.cleanUp.call(this),this._pako=null},l.prototype._createPako=function(){this._pako=new s[this._pakoAction]({raw:!0,level:this._pakoOptions.level||-1});var e=this;this._pako.onData=function(t){e.push({data:t,meta:e.meta})}},i.compressWorker=function(e){return new l("Deflate",e)},i.uncompressWorker=function(){return new l("Inflate",{})}},{"./stream/GenericWorker":28,"./utils":32,pako:38}],8:[function(e,t,i){function n(e,t){var i,n="";for(i=0;i<t;i++)n+=String.fromCharCode(255&e),e>>>=8;return n}function s(e,t,i,s,o,c){var u,d,p=e.file,f=e.compression,_=c!==a.utf8encode,m=r.transformTo("string",c(p.name)),g=r.transformTo("string",a.utf8encode(p.name)),v=p.comment,y=r.transformTo("string",c(v)),x=r.transformTo("string",a.utf8encode(v)),b=g.length!==p.name.length,T=x.length!==v.length,S="",E="",C="",A=p.dir,P=p.date,R={crc32:0,compressedSize:0,uncompressedSize:0};t&&!i||(R.crc32=e.crc32,R.compressedSize=e.compressedSize,R.uncompressedSize=e.uncompressedSize);var M=0;t&&(M|=8),_||!b&&!T||(M|=2048);var I=0,D=0;A&&(I|=16),"UNIX"===o?(D=798,I|=function(e,t){var i=e;return e||(i=t?16893:33204),(65535&i)<<16}(p.unixPermissions,A)):(D=20,I|=function(e){return 63&(e||0)}(p.dosPermissions)),u=P.getUTCHours(),u<<=6,u|=P.getUTCMinutes(),u<<=5,u|=P.getUTCSeconds()/2,d=P.getUTCFullYear()-1980,d<<=4,d|=P.getUTCMonth()+1,d<<=5,d|=P.getUTCDate(),b&&(E=n(1,1)+n(l(m),4)+g,S+="up"+n(E.length,2)+E),T&&(C=n(1,1)+n(l(y),4)+x,S+="uc"+n(C.length,2)+C);var O="";return O+="\n\0",O+=n(M,2),O+=f.magic,O+=n(u,2),O+=n(d,2),O+=n(R.crc32,4),O+=n(R.compressedSize,4),O+=n(R.uncompressedSize,4),O+=n(m.length,2),O+=n(S.length,2),{fileRecord:h.LOCAL_FILE_HEADER+O+m+S,dirRecord:h.CENTRAL_FILE_HEADER+n(D,2)+O+n(y.length,2)+"\0\0\0\0"+n(I,4)+n(s,4)+m+S+y}}var r=e("../utils"),o=e("../stream/GenericWorker"),a=e("../utf8"),l=e("../crc32"),h=e("../signature");function c(e,t,i,n){o.call(this,"ZipFileWorker"),this.bytesWritten=0,this.zipComment=t,this.zipPlatform=i,this.encodeFileName=n,this.streamFiles=e,this.accumulate=!1,this.contentBuffer=[],this.dirRecords=[],this.currentSourceOffset=0,this.entriesCount=0,this.currentFile=null,this._sources=[]}r.inherits(c,o),c.prototype.push=function(e){var t=e.meta.percent||0,i=this.entriesCount,n=this._sources.length;this.accumulate?this.contentBuffer.push(e):(this.bytesWritten+=e.data.length,o.prototype.push.call(this,{data:e.data,meta:{currentFile:this.currentFile,percent:i?(t+100*(i-n-1))/i:100}}))},c.prototype.openedSource=function(e){this.currentSourceOffset=this.bytesWritten,this.currentFile=e.file.name;var t=this.streamFiles&&!e.file.dir;if(t){var i=s(e,t,!1,this.currentSourceOffset,this.zipPlatform,this.encodeFileName);this.push({data:i.fileRecord,meta:{percent:0}})}else this.accumulate=!0},c.prototype.closedSource=function(e){this.accumulate=!1;var t=this.streamFiles&&!e.file.dir,i=s(e,t,!0,this.currentSourceOffset,this.zipPlatform,this.encodeFileName);if(this.dirRecords.push(i.dirRecord),t)this.push({data:function(e){return h.DATA_DESCRIPTOR+n(e.crc32,4)+n(e.compressedSize,4)+n(e.uncompressedSize,4)}(e),meta:{percent:100}});else for(this.push({data:i.fileRecord,meta:{percent:0}});this.contentBuffer.length;)this.push(this.contentBuffer.shift());this.currentFile=null},c.prototype.flush=function(){for(var e=this.bytesWritten,t=0;t<this.dirRecords.length;t++)this.push({data:this.dirRecords[t],meta:{percent:100}});var i=this.bytesWritten-e,s=function(e,t,i,s,o){var a=r.transformTo("string",o(s));return h.CENTRAL_DIRECTORY_END+"\0\0\0\0"+n(e,2)+n(e,2)+n(t,4)+n(i,4)+n(a.length,2)+a}(this.dirRecords.length,i,e,this.zipComment,this.encodeFileName);this.push({data:s,meta:{percent:100}})},c.prototype.prepareNextSource=function(){this.previous=this._sources.shift(),this.openedSource(this.previous.streamInfo),this.isPaused?this.previous.pause():this.previous.resume()},c.prototype.registerPrevious=function(e){this._sources.push(e);var t=this;return e.on("data",(function(e){t.processChunk(e)})),e.on("end",(function(){t.closedSource(t.previous.streamInfo),t._sources.length?t.prepareNextSource():t.end()})),e.on("error",(function(e){t.error(e)})),this},c.prototype.resume=function(){return!!o.prototype.resume.call(this)&&(!this.previous&&this._sources.length?(this.prepareNextSource(),!0):this.previous||this._sources.length||this.generatedError?void 0:(this.end(),!0))},c.prototype.error=function(e){var t=this._sources;if(!o.prototype.error.call(this,e))return!1;for(var i=0;i<t.length;i++)try{t[i].error(e)}catch(e){}return!0},c.prototype.lock=function(){o.prototype.lock.call(this);for(var e=this._sources,t=0;t<e.length;t++)e[t].lock()},t.exports=c},{"../crc32":4,"../signature":23,"../stream/GenericWorker":28,"../utf8":31,"../utils":32}],9:[function(e,t,i){var n=e("../compressions"),s=e("./ZipFileWorker");i.generateWorker=function(e,t,i){var r=new s(t.streamFiles,i,t.platform,t.encodeFileName),o=0;try{e.forEach((function(e,i){o++;var s=function(e,t){var i=e||t,s=n[i];if(!s)throw new Error(i+" is not a valid compression method !");return s}(i.options.compression,t.compression),a=i.options.compressionOptions||t.compressionOptions||{},l=i.dir,h=i.date;i._compressWorker(s,a).withStreamInfo("file",{name:e,dir:l,date:h,comment:i.comment||"",unixPermissions:i.unixPermissions,dosPermissions:i.dosPermissions}).pipe(r)})),r.entriesCount=o}catch(e){r.error(e)}return r}},{"../compressions":3,"./ZipFileWorker":8}],10:[function(e,t,i){function n(){if(!(this instanceof n))return new n;if(arguments.length)throw new Error("The constructor with parameters has been removed in JSZip 3.0, please check the upgrade guide.");this.files=Object.create(null),this.comment=null,this.root="",this.clone=function(){var e=new n;for(var t in this)"function"!=typeof this[t]&&(e[t]=this[t]);return e}}(n.prototype=e("./object")).loadAsync=e("./load"),n.support=e("./support"),n.defaults=e("./defaults"),n.version="3.10.1",n.loadAsync=function(e,t){return(new n).loadAsync(e,t)},n.external=e("./external"),t.exports=n},{"./defaults":5,"./external":6,"./load":11,"./object":15,"./support":30}],11:[function(e,t,i){var n=e("./utils"),s=e("./external"),r=e("./utf8"),o=e("./zipEntries"),a=e("./stream/Crc32Probe"),l=e("./nodejsUtils");function h(e){return new s.Promise((function(t,i){var n=e.decompressed.getContentWorker().pipe(new a);n.on("error",(function(e){i(e)})).on("end",(function(){n.streamInfo.crc32!==e.decompressed.crc32?i(new Error("Corrupted zip : CRC32 mismatch")):t()})).resume()}))}t.exports=function(e,t){var i=this;return t=n.extend(t||{},{base64:!1,checkCRC32:!1,optimizedBinaryString:!1,createFolders:!1,decodeFileName:r.utf8decode}),l.isNode&&l.isStream(e)?s.Promise.reject(new Error("JSZip can't accept a stream when loading a zip file.")):n.prepareContent("the loaded zip file",e,!0,t.optimizedBinaryString,t.base64).then((function(e){var i=new o(t);return i.load(e),i})).then((function(e){var i=[s.Promise.resolve(e)],n=e.files;if(t.checkCRC32)for(var r=0;r<n.length;r++)i.push(h(n[r]));return s.Promise.all(i)})).then((function(e){for(var s=e.shift(),r=s.files,o=0;o<r.length;o++){var a=r[o],l=a.fileNameStr,h=n.resolve(a.fileNameStr);i.file(h,a.decompressed,{binary:!0,optimizedBinaryString:!0,date:a.date,dir:a.dir,comment:a.fileCommentStr.length?a.fileCommentStr:null,unixPermissions:a.unixPermissions,dosPermissions:a.dosPermissions,createFolders:t.createFolders}),a.dir||(i.file(h).unsafeOriginalName=l)}return s.zipComment.length&&(i.comment=s.zipComment),i}))}},{"./external":6,"./nodejsUtils":14,"./stream/Crc32Probe":25,"./utf8":31,"./utils":32,"./zipEntries":33}],12:[function(e,t,i){var n=e("../utils"),s=e("../stream/GenericWorker");function r(e,t){s.call(this,"Nodejs stream input adapter for "+e),this._upstreamEnded=!1,this._bindStream(t)}n.inherits(r,s),r.prototype._bindStream=function(e){var t=this;(this._stream=e).pause(),e.on("data",(function(e){t.push({data:e,meta:{percent:0}})})).on("error",(function(e){t.isPaused?this.generatedError=e:t.error(e)})).on("end",(function(){t.isPaused?t._upstreamEnded=!0:t.end()}))},r.prototype.pause=function(){return!!s.prototype.pause.call(this)&&(this._stream.pause(),!0)},r.prototype.resume=function(){return!!s.prototype.resume.call(this)&&(this._upstreamEnded?this.end():this._stream.resume(),!0)},t.exports=r},{"../stream/GenericWorker":28,"../utils":32}],13:[function(e,t,i){var n=e("readable-stream").Readable;function s(e,t,i){n.call(this,t),this._helper=e;var s=this;e.on("data",(function(e,t){s.push(e)||s._helper.pause(),i&&i(t)})).on("error",(function(e){s.emit("error",e)})).on("end",(function(){s.push(null)}))}e("../utils").inherits(s,n),s.prototype._read=function(){this._helper.resume()},t.exports=s},{"../utils":32,"readable-stream":16}],14:[function(e,t,i){t.exports={isNode:"undefined"!=typeof Buffer,newBufferFrom:function(e,t){if(Buffer.from&&Buffer.from!==Uint8Array.from)return Buffer.from(e,t);if("number"==typeof e)throw new Error('The "data" argument must not be a number');return new Buffer(e,t)},allocBuffer:function(e){if(Buffer.alloc)return Buffer.alloc(e);var t=new Buffer(e);return t.fill(0),t},isBuffer:function(e){return Buffer.isBuffer(e)},isStream:function(e){return e&&"function"==typeof e.on&&"function"==typeof e.pause&&"function"==typeof e.resume}}},{}],15:[function(e,t,i){function n(e,t,i){var n,s=r.getTypeOf(t),a=r.extend(i||{},l);a.date=a.date||new Date,null!==a.compression&&(a.compression=a.compression.toUpperCase()),"string"==typeof a.unixPermissions&&(a.unixPermissions=parseInt(a.unixPermissions,8)),a.unixPermissions&&16384&a.unixPermissions&&(a.dir=!0),a.dosPermissions&&16&a.dosPermissions&&(a.dir=!0),a.dir&&(e=_(e)),a.createFolders&&(n=f(e))&&m.call(this,n,!0);var u="string"===s&&!1===a.binary&&!1===a.base64;i&&void 0!==i.binary||(a.binary=!u),(t instanceof h&&0===t.uncompressedSize||a.dir||!t||0===t.length)&&(a.base64=!1,a.binary=!0,t="",a.compression="STORE",s="string");var g;g=t instanceof h||t instanceof o?t:d.isNode&&d.isStream(t)?new p(e,t):r.prepareContent(e,t,a.binary,a.optimizedBinaryString,a.base64);var v=new c(e,g,a);this.files[e]=v}var s=e("./utf8"),r=e("./utils"),o=e("./stream/GenericWorker"),a=e("./stream/StreamHelper"),l=e("./defaults"),h=e("./compressedObject"),c=e("./zipObject"),u=e("./generate"),d=e("./nodejsUtils"),p=e("./nodejs/NodejsStreamInputAdapter"),f=function(e){"/"===e.slice(-1)&&(e=e.substring(0,e.length-1));var t=e.lastIndexOf("/");return 0<t?e.substring(0,t):""},_=function(e){return"/"!==e.slice(-1)&&(e+="/"),e},m=function(e,t){return t=void 0!==t?t:l.createFolders,e=_(e),this.files[e]||n.call(this,e,null,{dir:!0,createFolders:t}),this.files[e]};function g(e){return"[object RegExp]"===Object.prototype.toString.call(e)}var v={load:function(){throw new Error("This method has been removed in JSZip 3.0, please check the upgrade guide.")},forEach:function(e){var t,i,n;for(t in this.files)n=this.files[t],(i=t.slice(this.root.length,t.length))&&t.slice(0,this.root.length)===this.root&&e(i,n)},filter:function(e){var t=[];return this.forEach((function(i,n){e(i,n)&&t.push(n)})),t},file:function(e,t,i){if(1!==arguments.length)return e=this.root+e,n.call(this,e,t,i),this;if(g(e)){var s=e;return this.filter((function(e,t){return!t.dir&&s.test(e)}))}var r=this.files[this.root+e];return r&&!r.dir?r:null},folder:function(e){if(!e)return this;if(g(e))return this.filter((function(t,i){return i.dir&&e.test(t)}));var t=this.root+e,i=m.call(this,t),n=this.clone();return n.root=i.name,n},remove:function(e){e=this.root+e;var t=this.files[e];if(t||("/"!==e.slice(-1)&&(e+="/"),t=this.files[e]),t&&!t.dir)delete this.files[e];else for(var i=this.filter((function(t,i){return i.name.slice(0,e.length)===e})),n=0;n<i.length;n++)delete this.files[i[n].name];return this},generate:function(){throw new Error("This method has been removed in JSZip 3.0, please check the upgrade guide.")},generateInternalStream:function(e){var t,i={};try{if((i=r.extend(e||{},{streamFiles:!1,compression:"STORE",compressionOptions:null,type:"",platform:"DOS",comment:null,mimeType:"application/zip",encodeFileName:s.utf8encode})).type=i.type.toLowerCase(),i.compression=i.compression.toUpperCase(),"binarystring"===i.type&&(i.type="string"),!i.type)throw new Error("No output type specified.");r.checkSupport(i.type),"darwin"!==i.platform&&"freebsd"!==i.platform&&"linux"!==i.platform&&"sunos"!==i.platform||(i.platform="UNIX"),"win32"===i.platform&&(i.platform="DOS");var n=i.comment||this.comment||"";t=u.generateWorker(this,i,n)}catch(e){(t=new o("error")).error(e)}return new a(t,i.type||"string",i.mimeType)},generateAsync:function(e,t){return this.generateInternalStream(e).accumulate(t)},generateNodeStream:function(e,t){return(e=e||{}).type||(e.type="nodebuffer"),this.generateInternalStream(e).toNodejsStream(t)}};t.exports=v},{"./compressedObject":2,"./defaults":5,"./generate":9,"./nodejs/NodejsStreamInputAdapter":12,"./nodejsUtils":14,"./stream/GenericWorker":28,"./stream/StreamHelper":29,"./utf8":31,"./utils":32,"./zipObject":35}],16:[function(e,t,i){t.exports=e("stream")},{stream:void 0}],17:[function(e,t,i){var n=e("./DataReader");function s(e){n.call(this,e);for(var t=0;t<this.data.length;t++)e[t]=255&e[t]}e("../utils").inherits(s,n),s.prototype.byteAt=function(e){return this.data[this.zero+e]},s.prototype.lastIndexOfSignature=function(e){for(var t=e.charCodeAt(0),i=e.charCodeAt(1),n=e.charCodeAt(2),s=e.charCodeAt(3),r=this.length-4;0<=r;--r)if(this.data[r]===t&&this.data[r+1]===i&&this.data[r+2]===n&&this.data[r+3]===s)return r-this.zero;return-1},s.prototype.readAndCheckSignature=function(e){var t=e.charCodeAt(0),i=e.charCodeAt(1),n=e.charCodeAt(2),s=e.charCodeAt(3),r=this.readData(4);return t===r[0]&&i===r[1]&&n===r[2]&&s===r[3]},s.prototype.readData=function(e){if(this.checkOffset(e),0===e)return[];var t=this.data.slice(this.zero+this.index,this.zero+this.index+e);return this.index+=e,t},t.exports=s},{"../utils":32,"./DataReader":18}],18:[function(e,t,i){var n=e("../utils");function s(e){this.data=e,this.length=e.length,this.index=0,this.zero=0}s.prototype={checkOffset:function(e){this.checkIndex(this.index+e)},checkIndex:function(e){if(this.length<this.zero+e||e<0)throw new Error("End of data reached (data length = "+this.length+", asked index = "+e+"). Corrupted zip ?")},setIndex:function(e){this.checkIndex(e),this.index=e},skip:function(e){this.setIndex(this.index+e)},byteAt:function(){},readInt:function(e){var t,i=0;for(this.checkOffset(e),t=this.index+e-1;t>=this.index;t--)i=(i<<8)+this.byteAt(t);return this.index+=e,i},readString:function(e){return n.transformTo("string",this.readData(e))},readData:function(){},lastIndexOfSignature:function(){},readAndCheckSignature:function(){},readDate:function(){var e=this.readInt(4);return new Date(Date.UTC(1980+(e>>25&127),(e>>21&15)-1,e>>16&31,e>>11&31,e>>5&63,(31&e)<<1))}},t.exports=s},{"../utils":32}],19:[function(e,t,i){var n=e("./Uint8ArrayReader");function s(e){n.call(this,e)}e("../utils").inherits(s,n),s.prototype.readData=function(e){this.checkOffset(e);var t=this.data.slice(this.zero+this.index,this.zero+this.index+e);return this.index+=e,t},t.exports=s},{"../utils":32,"./Uint8ArrayReader":21}],20:[function(e,t,i){var n=e("./DataReader");function s(e){n.call(this,e)}e("../utils").inherits(s,n),s.prototype.byteAt=function(e){return this.data.charCodeAt(this.zero+e)},s.prototype.lastIndexOfSignature=function(e){return this.data.lastIndexOf(e)-this.zero},s.prototype.readAndCheckSignature=function(e){return e===this.readData(4)},s.prototype.readData=function(e){this.checkOffset(e);var t=this.data.slice(this.zero+this.index,this.zero+this.index+e);return this.index+=e,t},t.exports=s},{"../utils":32,"./DataReader":18}],21:[function(e,t,i){var n=e("./ArrayReader");function s(e){n.call(this,e)}e("../utils").inherits(s,n),s.prototype.readData=function(e){if(this.checkOffset(e),0===e)return new Uint8Array(0);var t=this.data.subarray(this.zero+this.index,this.zero+this.index+e);return this.index+=e,t},t.exports=s},{"../utils":32,"./ArrayReader":17}],22:[function(e,t,i){var n=e("../utils"),s=e("../support"),r=e("./ArrayReader"),o=e("./StringReader"),a=e("./NodeBufferReader"),l=e("./Uint8ArrayReader");t.exports=function(e){var t=n.getTypeOf(e);return n.checkSupport(t),"string"!==t||s.uint8array?"nodebuffer"===t?new a(e):s.uint8array?new l(n.transformTo("uint8array",e)):new r(n.transformTo("array",e)):new o(e)}},{"../support":30,"../utils":32,"./ArrayReader":17,"./NodeBufferReader":19,"./StringReader":20,"./Uint8ArrayReader":21}],23:[function(e,t,i){i.LOCAL_FILE_HEADER="PK",i.CENTRAL_FILE_HEADER="PK
",i.CENTRAL_DIRECTORY_END="PK",i.ZIP64_CENTRAL_DIRECTORY_LOCATOR="PK",i.ZIP64_CENTRAL_DIRECTORY_END="PK",i.DATA_DESCRIPTOR="PK\b"},{}],24:[function(e,t,i){var n=e("./GenericWorker"),s=e("../utils");function r(e){n.call(this,"ConvertWorker to "+e),this.destType=e}s.inherits(r,n),r.prototype.processChunk=function(e){this.push({data:s.transformTo(this.destType,e.data),meta:e.meta})},t.exports=r},{"../utils":32,"./GenericWorker":28}],25:[function(e,t,i){var n=e("./GenericWorker"),s=e("../crc32");function r(){n.call(this,"Crc32Probe"),this.withStreamInfo("crc32",0)}e("../utils").inherits(r,n),r.prototype.processChunk=function(e){this.streamInfo.crc32=s(e.data,this.streamInfo.crc32||0),this.push(e)},t.exports=r},{"../crc32":4,"../utils":32,"./GenericWorker":28}],26:[function(e,t,i){var n=e("../utils"),s=e("./GenericWorker");function r(e){s.call(this,"DataLengthProbe for "+e),this.propName=e,this.withStreamInfo(e,0)}n.inherits(r,s),r.prototype.processChunk=function(e){if(e){var t=this.streamInfo[this.propName]||0;this.streamInfo[this.propName]=t+e.data.length}s.prototype.processChunk.call(this,e)},t.exports=r},{"../utils":32,"./GenericWorker":28}],27:[function(e,t,i){var n=e("../utils"),s=e("./GenericWorker");function r(e){s.call(this,"DataWorker");var t=this;this.dataIsReady=!1,this.index=0,this.max=0,this.data=null,this.type="",this._tickScheduled=!1,e.then((function(e){t.dataIsReady=!0,t.data=e,t.max=e&&e.length||0,t.type=n.getTypeOf(e),t.isPaused||t._tickAndRepeat()}),(function(e){t.error(e)}))}n.inherits(r,s),r.prototype.cleanUp=function(){s.prototype.cleanUp.call(this),this.data=null},r.prototype.resume=function(){return!!s.prototype.resume.call(this)&&(!this._tickScheduled&&this.dataIsReady&&(this._tickScheduled=!0,n.delay(this._tickAndRepeat,[],this)),!0)},r.prototype._tickAndRepeat=function(){this._tickScheduled=!1,this.isPaused||this.isFinished||(this._tick(),this.isFinished||(n.delay(this._tickAndRepeat,[],this),this._tickScheduled=!0))},r.prototype._tick=function(){if(this.isPaused||this.isFinished)return!1;var e=null,t=Math.min(this.max,this.index+16384);if(this.index>=this.max)return this.end();switch(this.type){case"string":e=this.data.substring(this.index,t);break;case"uint8array":e=this.data.subarray(this.index,t);break;case"array":case"nodebuffer":e=this.data.slice(this.index,t)}return this.index=t,this.push({data:e,meta:{percent:this.max?this.index/this.max*100:0}})},t.exports=r},{"../utils":32,"./GenericWorker":28}],28:[function(e,t,i){function n(e){this.name=e||"default",this.streamInfo={},this.generatedError=null,this.extraStreamInfo={},this.isPaused=!0,this.isFinished=!1,this.isLocked=!1,this._listeners={data:[],end:[],error:[]},this.previous=null}n.prototype={push:function(e){this.emit("data",e)},end:function(){if(this.isFinished)return!1;this.flush();try{this.emit("end"),this.cleanUp(),this.isFinished=!0}catch(e){this.emit("error",e)}return!0},error:function(e){return!this.isFinished&&(this.isPaused?this.generatedError=e:(this.isFinished=!0,this.emit("error",e),this.previous&&this.previous.error(e),this.cleanUp()),!0)},on:function(e,t){return this._listeners[e].push(t),this},cleanUp:function(){this.streamInfo=this.generatedError=this.extraStreamInfo=null,this._listeners=[]},emit:function(e,t){if(this._listeners[e])for(var i=0;i<this._listeners[e].length;i++)this._listeners[e][i].call(this,t)},pipe:function(e){return e.registerPrevious(this)},registerPrevious:function(e){if(this.isLocked)throw new Error("The stream '"+this+"' has already been used.");this.streamInfo=e.streamInfo,this.mergeStreamInfo(),this.previous=e;var t=this;return e.on("data",(function(e){t.processChunk(e)})),e.on("end",(function(){t.end()})),e.on("error",(function(e){t.error(e)})),this},pause:function(){return!this.isPaused&&!this.isFinished&&(this.isPaused=!0,this.previous&&this.previous.pause(),!0)},resume:function(){if(!this.isPaused||this.isFinished)return!1;var e=this.isPaused=!1;return this.generatedError&&(this.error(this.generatedError),e=!0),this.previous&&this.previous.resume(),!e},flush:function(){},processChunk:function(e){this.push(e)},withStreamInfo:function(e,t){return this.extraStreamInfo[e]=t,this.mergeStreamInfo(),this},mergeStreamInfo:function(){for(var e in this.extraStreamInfo)Object.prototype.hasOwnProperty.call(this.extraStreamInfo,e)&&(this.streamInfo[e]=this.extraStreamInfo[e])},lock:function(){if(this.isLocked)throw new Error("The stream '"+this+"' has already been used.");this.isLocked=!0,this.previous&&this.previous.lock()},toString:function(){var e="Worker "+this.name;return this.previous?this.previous+" -> "+e:e}},t.exports=n},{}],29:[function(e,t,i){var n=e("../utils"),s=e("./ConvertWorker"),r=e("./GenericWorker"),o=e("../base64"),a=e("../support"),l=e("../external"),h=null;if(a.nodestream)try{h=e("../nodejs/NodejsStreamOutputAdapter")}catch(e){}function c(e,t,i){var o=t;switch(t){case"blob":case"arraybuffer":o="uint8array";break;case"base64":o="string"}try{this._internalType=o,this._outputType=t,this._mimeType=i,n.checkSupport(o),this._worker=e.pipe(new s(o)),e.lock()}catch(e){this._worker=new r("error"),this._worker.error(e)}}c.prototype={accumulate:function(e){return function(e,t){return new l.Promise((function(i,s){var r=[],a=e._internalType,l=e._outputType,h=e._mimeType;e.on("data",(function(e,i){r.push(e),t&&t(i)})).on("error",(function(e){r=[],s(e)})).on("end",(function(){try{var e=function(e,t,i){switch(e){case"blob":return n.newBlob(n.transformTo("arraybuffer",t),i);case"base64":return o.encode(t);default:return n.transformTo(e,t)}}(l,function(e,t){var i,n=0,s=null,r=0;for(i=0;i<t.length;i++)r+=t[i].length;switch(e){case"string":return t.join("");case"array":return Array.prototype.concat.apply([],t);case"uint8array":for(s=new Uint8Array(r),i=0;i<t.length;i++)s.set(t[i],n),n+=t[i].length;return s;case"nodebuffer":return Buffer.concat(t);default:throw new Error("concat : unsupported type '"+e+"'")}}(a,r),h);i(e)}catch(e){s(e)}r=[]})).resume()}))}(this,e)},on:function(e,t){var i=this;return"data"===e?this._worker.on(e,(function(e){t.call(i,e.data,e.meta)})):this._worker.on(e,(function(){n.delay(t,arguments,i)})),this},resume:function(){return n.delay(this._worker.resume,[],this._worker),this},pause:function(){return this._worker.pause(),this},toNodejsStream:function(e){if(n.checkSupport("nodestream"),"nodebuffer"!==this._outputType)throw new Error(this._outputType+" is not supported by this method");return new h(this,{objectMode:"nodebuffer"!==this._outputType},e)}},t.exports=c},{"../base64":1,"../external":6,"../nodejs/NodejsStreamOutputAdapter":13,"../support":30,"../utils":32,"./ConvertWorker":24,"./GenericWorker":28}],30:[function(e,t,i){if(i.base64=!0,i.array=!0,i.string=!0,i.arraybuffer="undefined"!=typeof ArrayBuffer&&"undefined"!=typeof Uint8Array,i.nodebuffer="undefined"!=typeof Buffer,i.uint8array="undefined"!=typeof Uint8Array,"undefined"==typeof ArrayBuffer)i.blob=!1;else{var n=new ArrayBuffer(0);try{i.blob=0===new Blob([n],{type:"application/zip"}).size}catch(e){try{var s=new(self.BlobBuilder||self.WebKitBlobBuilder||self.MozBlobBuilder||self.MSBlobBuilder);s.append(n),i.blob=0===s.getBlob("application/zip").size}catch(e){i.blob=!1}}}try{i.nodestream=!!e("readable-stream").Readable}catch(e){i.nodestream=!1}},{"readable-stream":16}],31:[function(e,t,i){for(var n=e("./utils"),s=e("./support"),r=e("./nodejsUtils"),o=e("./stream/GenericWorker"),a=new Array(256),l=0;l<256;l++)a[l]=252<=l?6:248<=l?5:240<=l?4:224<=l?3:192<=l?2:1;function h(){o.call(this,"utf-8 decode"),this.leftOver=null}function c(){o.call(this,"utf-8 encode")}a[254]=a[254]=1,i.utf8encode=function(e){return s.nodebuffer?r.newBufferFrom(e,"utf-8"):function(e){var t,i,n,r,o,a=e.length,l=0;for(r=0;r<a;r++)55296==(64512&(i=e.charCodeAt(r)))&&r+1<a&&56320==(64512&(n=e.charCodeAt(r+1)))&&(i=65536+(i-55296<<10)+(n-56320),r++),l+=i<128?1:i<2048?2:i<65536?3:4;for(t=s.uint8array?new Uint8Array(l):new Array(l),r=o=0;o<l;r++)55296==(64512&(i=e.charCodeAt(r)))&&r+1<a&&56320==(64512&(n=e.charCodeAt(r+1)))&&(i=65536+(i-55296<<10)+(n-56320),r++),i<128?t[o++]=i:(i<2048?t[o++]=192|i>>>6:(i<65536?t[o++]=224|i>>>12:(t[o++]=240|i>>>18,t[o++]=128|i>>>12&63),t[o++]=128|i>>>6&63),t[o++]=128|63&i);return t}(e)},i.utf8decode=function(e){return s.nodebuffer?n.transformTo("nodebuffer",e).toString("utf-8"):function(e){var t,i,s,r,o=e.length,l=new Array(2*o);for(t=i=0;t<o;)if((s=e[t++])<128)l[i++]=s;else if(4<(r=a[s]))l[i++]=65533,t+=r-1;else{for(s&=2===r?31:3===r?15:7;1<r&&t<o;)s=s<<6|63&e[t++],r--;1<r?l[i++]=65533:s<65536?l[i++]=s:(s-=65536,l[i++]=55296|s>>10&1023,l[i++]=56320|1023&s)}return l.length!==i&&(l.subarray?l=l.subarray(0,i):l.length=i),n.applyFromCharCode(l)}(e=n.transformTo(s.uint8array?"uint8array":"array",e))},n.inherits(h,o),h.prototype.processChunk=function(e){var t=n.transformTo(s.uint8array?"uint8array":"array",e.data);if(this.leftOver&&this.leftOver.length){if(s.uint8array){var r=t;(t=new Uint8Array(r.length+this.leftOver.length)).set(this.leftOver,0),t.set(r,this.leftOver.length)}else t=this.leftOver.concat(t);this.leftOver=null}var o=function(e,t){var i;for((t=t||e.length)>e.length&&(t=e.length),i=t-1;0<=i&&128==(192&e[i]);)i--;return i<0||0===i?t:i+a[e[i]]>t?i:t}(t),l=t;o!==t.length&&(s.uint8array?(l=t.subarray(0,o),this.leftOver=t.subarray(o,t.length)):(l=t.slice(0,o),this.leftOver=t.slice(o,t.length))),this.push({data:i.utf8decode(l),meta:e.meta})},h.prototype.flush=function(){this.leftOver&&this.leftOver.length&&(this.push({data:i.utf8decode(this.leftOver),meta:{}}),this.leftOver=null)},i.Utf8DecodeWorker=h,n.inherits(c,o),c.prototype.processChunk=function(e){this.push({data:i.utf8encode(e.data),meta:e.meta})},i.Utf8EncodeWorker=c},{"./nodejsUtils":14,"./stream/GenericWorker":28,"./support":30,"./utils":32}],32:[function(e,t,i){var n=e("./support"),s=e("./base64"),r=e("./nodejsUtils"),o=e("./external");function a(e){return e}function l(e,t){for(var i=0;i<e.length;++i)t[i]=255&e.charCodeAt(i);return t}e("setimmediate"),i.newBlob=function(e,t){i.checkSupport("blob");try{return new Blob([e],{type:t})}catch(i){try{var n=new(self.BlobBuilder||self.WebKitBlobBuilder||self.MozBlobBuilder||self.MSBlobBuilder);return n.append(e),n.getBlob(t)}catch(e){throw new Error("Bug : can't construct the Blob.")}}};var h={stringifyByChunk:function(e,t,i){var n=[],s=0,r=e.length;if(r<=i)return String.fromCharCode.apply(null,e);for(;s<r;)"array"===t||"nodebuffer"===t?n.push(String.fromCharCode.apply(null,e.slice(s,Math.min(s+i,r)))):n.push(String.fromCharCode.apply(null,e.subarray(s,Math.min(s+i,r)))),s+=i;return n.join("")},stringifyByChar:function(e){for(var t="",i=0;i<e.length;i++)t+=String.fromCharCode(e[i]);return t},applyCanBeUsed:{uint8array:function(){try{return n.uint8array&&1===String.fromCharCode.apply(null,new Uint8Array(1)).length}catch(e){return!1}}(),nodebuffer:function(){try{return n.nodebuffer&&1===String.fromCharCode.apply(null,r.allocBuffer(1)).length}catch(e){return!1}}()}};function c(e){var t=65536,n=i.getTypeOf(e),s=!0;if("uint8array"===n?s=h.applyCanBeUsed.uint8array:"nodebuffer"===n&&(s=h.applyCanBeUsed.nodebuffer),s)for(;1<t;)try{return h.stringifyByChunk(e,n,t)}catch(e){t=Math.floor(t/2)}return h.stringifyByChar(e)}function u(e,t){for(var i=0;i<e.length;i++)t[i]=e[i];return t}i.applyFromCharCode=c;var d={};d.string={string:a,array:function(e){return l(e,new Array(e.length))},arraybuffer:function(e){return d.string.uint8array(e).buffer},uint8array:function(e){return l(e,new Uint8Array(e.length))},nodebuffer:function(e){return l(e,r.allocBuffer(e.length))}},d.array={string:c,array:a,arraybuffer:function(e){return new Uint8Array(e).buffer},uint8array:function(e){return new Uint8Array(e)},nodebuffer:function(e){return r.newBufferFrom(e)}},d.arraybuffer={string:function(e){return c(new Uint8Array(e))},array:function(e){return u(new Uint8Array(e),new Array(e.byteLength))},arraybuffer:a,uint8array:function(e){return new Uint8Array(e)},nodebuffer:function(e){return r.newBufferFrom(new Uint8Array(e))}},d.uint8array={string:c,array:function(e){return u(e,new Array(e.length))},arraybuffer:function(e){return e.buffer},uint8array:a,nodebuffer:function(e){return r.newBufferFrom(e)}},d.nodebuffer={string:c,array:function(e){return u(e,new Array(e.length))},arraybuffer:function(e){return d.nodebuffer.uint8array(e).buffer},uint8array:function(e){return u(e,new Uint8Array(e.length))},nodebuffer:a},i.transformTo=function(e,t){if(t=t||"",!e)return t;i.checkSupport(e);var n=i.getTypeOf(t);return d[n][e](t)},i.resolve=function(e){for(var t=e.split("/"),i=[],n=0;n<t.length;n++){var s=t[n];"."===s||""===s&&0!==n&&n!==t.length-1||(".."===s?i.pop():i.push(s))}return i.join("/")},i.getTypeOf=function(e){return"string"==typeof e?"string":"[object Array]"===Object.prototype.toString.call(e)?"array":n.nodebuffer&&r.isBuffer(e)?"nodebuffer":n.uint8array&&e instanceof Uint8Array?"uint8array":n.arraybuffer&&e instanceof ArrayBuffer?"arraybuffer":void 0},i.checkSupport=function(e){if(!n[e.toLowerCase()])throw new Error(e+" is not supported by this platform")},i.MAX_VALUE_16BITS=65535,i.MAX_VALUE_32BITS=-1,i.pretty=function(e){var t,i,n="";for(i=0;i<(e||"").length;i++)n+="\\x"+((t=e.charCodeAt(i))<16?"0":"")+t.toString(16).toUpperCase();return n},i.delay=function(e,t,i){setImmediate((function(){e.apply(i||null,t||[])}))},i.inherits=function(e,t){function i(){}i.prototype=t.prototype,e.prototype=new i},i.extend=function(){var e,t,i={};for(e=0;e<arguments.length;e++)for(t in arguments[e])Object.prototype.hasOwnProperty.call(arguments[e],t)&&void 0===i[t]&&(i[t]=arguments[e][t]);return i},i.prepareContent=function(e,t,r,a,h){return o.Promise.resolve(t).then((function(e){return n.blob&&(e instanceof Blob||-1!==["[object File]","[object Blob]"].indexOf(Object.prototype.toString.call(e)))&&"undefined"!=typeof FileReader?new o.Promise((function(t,i){var n=new FileReader;n.onload=function(e){t(e.target.result)},n.onerror=function(e){i(e.target.error)},n.readAsArrayBuffer(e)})):e})).then((function(t){var c=i.getTypeOf(t);return c?("arraybuffer"===c?t=i.transformTo("uint8array",t):"string"===c&&(h?t=s.decode(t):r&&!0!==a&&(t=function(e){return l(e,n.uint8array?new Uint8Array(e.length):new Array(e.length))}(t))),t):o.Promise.reject(new Error("Can't read the data of '"+e+"'. Is it in a supported JavaScript type (String, Blob, ArrayBuffer, etc) ?"))}))}},{"./base64":1,"./external":6,"./nodejsUtils":14,"./support":30,setimmediate:54}],33:[function(e,t,i){var n=e("./reader/readerFor"),s=e("./utils"),r=e("./signature"),o=e("./zipEntry"),a=e("./support");function l(e){this.files=[],this.loadOptions=e}l.prototype={checkSignature:function(e){if(!this.reader.readAndCheckSignature(e)){this.reader.index-=4;var t=this.reader.readString(4);throw new Error("Corrupted zip or bug: unexpected signature ("+s.pretty(t)+", expected "+s.pretty(e)+")")}},isSignature:function(e,t){var i=this.reader.index;this.reader.setIndex(e);var n=this.reader.readString(4)===t;return this.reader.setIndex(i),n},readBlockEndOfCentral:function(){this.diskNumber=this.reader.readInt(2),this.diskWithCentralDirStart=this.reader.readInt(2),this.centralDirRecordsOnThisDisk=this.reader.readInt(2),this.centralDirRecords=this.reader.readInt(2),this.centralDirSize=this.reader.readInt(4),this.centralDirOffset=this.reader.readInt(4),this.zipCommentLength=this.reader.readInt(2);var e=this.reader.readData(this.zipCommentLength),t=a.uint8array?"uint8array":"array",i=s.transformTo(t,e);this.zipComment=this.loadOptions.decodeFileName(i)},readBlockZip64EndOfCentral:function(){this.zip64EndOfCentralSize=this.reader.readInt(8),this.reader.skip(4),this.diskNumber=this.reader.readInt(4),this.diskWithCentralDirStart=this.reader.readInt(4),this.centralDirRecordsOnThisDisk=this.reader.readInt(8),this.centralDirRecords=this.reader.readInt(8),this.centralDirSize=this.reader.readInt(8),this.centralDirOffset=this.reader.readInt(8),this.zip64ExtensibleData={};for(var e,t,i,n=this.zip64EndOfCentralSize-44;0<n;)e=this.reader.readInt(2),t=this.reader.readInt(4),i=this.reader.readData(t),this.zip64ExtensibleData[e]={id:e,length:t,value:i}},readBlockZip64EndOfCentralLocator:function(){if(this.diskWithZip64CentralDirStart=this.reader.readInt(4),this.relativeOffsetEndOfZip64CentralDir=this.reader.readInt(8),this.disksCount=this.reader.readInt(4),1<this.disksCount)throw new Error("Multi-volumes zip are not supported")},readLocalFiles:function(){var e,t;for(e=0;e<this.files.length;e++)t=this.files[e],this.reader.setIndex(t.localHeaderOffset),this.checkSignature(r.LOCAL_FILE_HEADER),t.readLocalPart(this.reader),t.handleUTF8(),t.processAttributes()},readCentralDir:function(){var e;for(this.reader.setIndex(this.centralDirOffset);this.reader.readAndCheckSignature(r.CENTRAL_FILE_HEADER);)(e=new o({zip64:this.zip64},this.loadOptions)).readCentralPart(this.reader),this.files.push(e);if(this.centralDirRecords!==this.files.length&&0!==this.centralDirRecords&&0===this.files.length)throw new Error("Corrupted zip or bug: expected "+this.centralDirRecords+" records in central dir, got "+this.files.length)},readEndOfCentral:function(){var e=this.reader.lastIndexOfSignature(r.CENTRAL_DIRECTORY_END);if(e<0)throw this.isSignature(0,r.LOCAL_FILE_HEADER)?new Error("Corrupted zip: can't find end of central directory"):new Error("Can't find end of central directory : is this a zip file ? If it is, see https://stuk.github.io/jszip/documentation/howto/read_zip.html");this.reader.setIndex(e);var t=e;if(this.checkSignature(r.CENTRAL_DIRECTORY_END),this.readBlockEndOfCentral(),this.diskNumber===s.MAX_VALUE_16BITS||this.diskWithCentralDirStart===s.MAX_VALUE_16BITS||this.centralDirRecordsOnThisDisk===s.MAX_VALUE_16BITS||this.centralDirRecords===s.MAX_VALUE_16BITS||this.centralDirSize===s.MAX_VALUE_32BITS||this.centralDirOffset===s.MAX_VALUE_32BITS){if(this.zip64=!0,(e=this.reader.lastIndexOfSignature(r.ZIP64_CENTRAL_DIRECTORY_LOCATOR))<0)throw new Error("Corrupted zip: can't find the ZIP64 end of central directory locator");if(this.reader.setIndex(e),this.checkSignature(r.ZIP64_CENTRAL_DIRECTORY_LOCATOR),this.readBlockZip64EndOfCentralLocator(),!this.isSignature(this.relativeOffsetEndOfZip64CentralDir,r.ZIP64_CENTRAL_DIRECTORY_END)&&(this.relativeOffsetEndOfZip64CentralDir=this.reader.lastIndexOfSignature(r.ZIP64_CENTRAL_DIRECTORY_END),this.relativeOffsetEndOfZip64CentralDir<0))throw new Error("Corrupted zip: can't find the ZIP64 end of central directory");this.reader.setIndex(this.relativeOffsetEndOfZip64CentralDir),this.checkSignature(r.ZIP64_CENTRAL_DIRECTORY_END),this.readBlockZip64EndOfCentral()}var i=this.centralDirOffset+this.centralDirSize;this.zip64&&(i+=20,i+=12+this.zip64EndOfCentralSize);var n=t-i;if(0<n)this.isSignature(t,r.CENTRAL_FILE_HEADER)||(this.reader.zero=n);else if(n<0)throw new Error("Corrupted zip: missing "+Math.abs(n)+" bytes.")},prepareReader:function(e){this.reader=n(e)},load:function(e){this.prepareReader(e),this.readEndOfCentral(),this.readCentralDir(),this.readLocalFiles()}},t.exports=l},{"./reader/readerFor":22,"./signature":23,"./support":30,"./utils":32,"./zipEntry":34}],34:[function(e,t,i){var n=e("./reader/readerFor"),s=e("./utils"),r=e("./compressedObject"),o=e("./crc32"),a=e("./utf8"),l=e("./compressions"),h=e("./support");function c(e,t){this.options=e,this.loadOptions=t}c.prototype={isEncrypted:function(){return 1==(1&this.bitFlag)},useUTF8:function(){return 2048==(2048&this.bitFlag)},readLocalPart:function(e){var t,i;if(e.skip(22),this.fileNameLength=e.readInt(2),i=e.readInt(2),this.fileName=e.readData(this.fileNameLength),e.skip(i),-1===this.compressedSize||-1===this.uncompressedSize)throw new Error("Bug or corrupted zip : didn't get enough information from the central directory (compressedSize === -1 || uncompressedSize === -1)");if(null===(t=function(e){for(var t in l)if(Object.prototype.hasOwnProperty.call(l,t)&&l[t].magic===e)return l[t];return null}(this.compressionMethod)))throw new Error("Corrupted zip : compression "+s.pretty(this.compressionMethod)+" unknown (inner file : "+s.transformTo("string",this.fileName)+")");this.decompressed=new r(this.compressedSize,this.uncompressedSize,this.crc32,t,e.readData(this.compressedSize))},readCentralPart:function(e){this.versionMadeBy=e.readInt(2),e.skip(2),this.bitFlag=e.readInt(2),this.compressionMethod=e.readString(2),this.date=e.readDate(),this.crc32=e.readInt(4),this.compressedSize=e.readInt(4),this.uncompressedSize=e.readInt(4);var t=e.readInt(2);if(this.extraFieldsLength=e.readInt(2),this.fileCommentLength=e.readInt(2),this.diskNumberStart=e.readInt(2),this.internalFileAttributes=e.readInt(2),this.externalFileAttributes=e.readInt(4),this.localHeaderOffset=e.readInt(4),this.isEncrypted())throw new Error("Encrypted zip are not supported");e.skip(t),this.readExtraFields(e),this.parseZIP64ExtraField(e),this.fileComment=e.readData(this.fileCommentLength)},processAttributes:function(){this.unixPermissions=null,this.dosPermissions=null;var e=this.versionMadeBy>>8;this.dir=!!(16&this.externalFileAttributes),0==e&&(this.dosPermissions=63&this.externalFileAttributes),3==e&&(this.unixPermissions=this.externalFileAttributes>>16&65535),this.dir||"/"!==this.fileNameStr.slice(-1)||(this.dir=!0)},parseZIP64ExtraField:function(){if(this.extraFields[1]){var e=n(this.extraFields[1].value);this.uncompressedSize===s.MAX_VALUE_32BITS&&(this.uncompressedSize=e.readInt(8)),this.compressedSize===s.MAX_VALUE_32BITS&&(this.compressedSize=e.readInt(8)),this.localHeaderOffset===s.MAX_VALUE_32BITS&&(this.localHeaderOffset=e.readInt(8)),this.diskNumberStart===s.MAX_VALUE_32BITS&&(this.diskNumberStart=e.readInt(4))}},readExtraFields:function(e){var t,i,n,s=e.index+this.extraFieldsLength;for(this.extraFields||(this.extraFields={});e.index+4<s;)t=e.readInt(2),i=e.readInt(2),n=e.readData(i),this.extraFields[t]={id:t,length:i,value:n};e.setIndex(s)},handleUTF8:function(){var e=h.uint8array?"uint8array":"array";if(this.useUTF8())this.fileNameStr=a.utf8decode(this.fileName),this.fileCommentStr=a.utf8decode(this.fileComment);else{var t=this.findExtraFieldUnicodePath();if(null!==t)this.fileNameStr=t;else{var i=s.transformTo(e,this.fileName);this.fileNameStr=this.loadOptions.decodeFileName(i)}var n=this.findExtraFieldUnicodeComment();if(null!==n)this.fileCommentStr=n;else{var r=s.transformTo(e,this.fileComment);this.fileCommentStr=this.loadOptions.decodeFileName(r)}}},findExtraFieldUnicodePath:function(){var e=this.extraFields[28789];if(e){var t=n(e.value);return 1!==t.readInt(1)||o(this.fileName)!==t.readInt(4)?null:a.utf8decode(t.readData(e.length-5))}return null},findExtraFieldUnicodeComment:function(){var e=this.extraFields[25461];if(e){var t=n(e.value);return 1!==t.readInt(1)||o(this.fileComment)!==t.readInt(4)?null:a.utf8decode(t.readData(e.length-5))}return null}},t.exports=c},{"./compressedObject":2,"./compressions":3,"./crc32":4,"./reader/readerFor":22,"./support":30,"./utf8":31,"./utils":32}],35:[function(e,t,i){function n(e,t,i){this.name=e,this.dir=i.dir,this.date=i.date,this.comment=i.comment,this.unixPermissions=i.unixPermissions,this.dosPermissions=i.dosPermissions,this._data=t,this._dataBinary=i.binary,this.options={compression:i.compression,compressionOptions:i.compressionOptions}}var s=e("./stream/StreamHelper"),r=e("./stream/DataWorker"),o=e("./utf8"),a=e("./compressedObject"),l=e("./stream/GenericWorker");n.prototype={internalStream:function(e){var t=null,i="string";try{if(!e)throw new Error("No output type specified.");var n="string"===(i=e.toLowerCase())||"text"===i;"binarystring"!==i&&"text"!==i||(i="string"),t=this._decompressWorker();var r=!this._dataBinary;r&&!n&&(t=t.pipe(new o.Utf8EncodeWorker)),!r&&n&&(t=t.pipe(new o.Utf8DecodeWorker))}catch(e){(t=new l("error")).error(e)}return new s(t,i,"")},async:function(e,t){return this.internalStream(e).accumulate(t)},nodeStream:function(e,t){return this.internalStream(e||"nodebuffer").toNodejsStream(t)},_compressWorker:function(e,t){if(this._data instanceof a&&this._data.compression.magic===e.magic)return this._data.getCompressedWorker();var i=this._decompressWorker();return this._dataBinary||(i=i.pipe(new o.Utf8EncodeWorker)),a.createWorkerFrom(i,e,t)},_decompressWorker:function(){return this._data instanceof a?this._data.getContentWorker():this._data instanceof l?this._data:new r(this._data)}};for(var h=["asText","asBinary","asNodeBuffer","asUint8Array","asArrayBuffer"],c=function(){throw new Error("This method has been removed in JSZip 3.0, please check the upgrade guide.")},u=0;u<h.length;u++)n.prototype[h[u]]=c;t.exports=n},{"./compressedObject":2,"./stream/DataWorker":27,"./stream/GenericWorker":28,"./stream/StreamHelper":29,"./utf8":31}],36:[function(e,t,n){(function(e){var i,n,s=e.MutationObserver||e.WebKitMutationObserver;if(s){var r=0,o=new s(c),a=e.document.createTextNode("");o.observe(a,{characterData:!0}),i=function(){a.data=r=++r%2}}else if(e.setImmediate||void 0===e.MessageChannel)i="document"in e&&"onreadystatechange"in e.document.createElement("script")?function(){var t=e.document.createElement("script");t.onreadystatechange=function(){c(),t.onreadystatechange=null,t.parentNode.removeChild(t),t=null},e.document.documentElement.appendChild(t)}:function(){setTimeout(c,0)};else{var l=new e.MessageChannel;l.port1.onmessage=c,i=function(){l.port2.postMessage(0)}}var h=[];function c(){var e,t;n=!0;for(var i=h.length;i;){for(t=h,h=[],e=-1;++e<i;)t[e]();i=h.length}n=!1}t.exports=function(e){1!==h.push(e)||n||i()}}).call(this,void 0!==i.g?i.g:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}],37:[function(e,t,i){var n=e("immediate");function s(){}var r={},o=["REJECTED"],a=["FULFILLED"],l=["PENDING"];function h(e){if("function"!=typeof e)throw new TypeError("resolver must be a function");this.state=l,this.queue=[],this.outcome=void 0,e!==s&&p(this,e)}function c(e,t,i){this.promise=e,"function"==typeof t&&(this.onFulfilled=t,this.callFulfilled=this.otherCallFulfilled),"function"==typeof i&&(this.onRejected=i,this.callRejected=this.otherCallRejected)}function u(e,t,i){n((function(){var n;try{n=t(i)}catch(n){return r.reject(e,n)}n===e?r.reject(e,new TypeError("Cannot resolve promise with itself")):r.resolve(e,n)}))}function d(e){var t=e&&e.then;if(e&&("object"==typeof e||"function"==typeof e)&&"function"==typeof t)return function(){t.apply(e,arguments)}}function p(e,t){var i=!1;function n(t){i||(i=!0,r.reject(e,t))}function s(t){i||(i=!0,r.resolve(e,t))}var o=f((function(){t(s,n)}));"error"===o.status&&n(o.value)}function f(e,t){var i={};try{i.value=e(t),i.status="success"}catch(e){i.status="error",i.value=e}return i}(t.exports=h).prototype.finally=function(e){if("function"!=typeof e)return this;var t=this.constructor;return this.then((function(i){return t.resolve(e()).then((function(){return i}))}),(function(i){return t.resolve(e()).then((function(){throw i}))}))},h.prototype.catch=function(e){return this.then(null,e)},h.prototype.then=function(e,t){if("function"!=typeof e&&this.state===a||"function"!=typeof t&&this.state===o)return this;var i=new this.constructor(s);return this.state!==l?u(i,this.state===a?e:t,this.outcome):this.queue.push(new c(i,e,t)),i},c.prototype.callFulfilled=function(e){r.resolve(this.promise,e)},c.prototype.otherCallFulfilled=function(e){u(this.promise,this.onFulfilled,e)},c.prototype.callRejected=function(e){r.reject(this.promise,e)},c.prototype.otherCallRejected=function(e){u(this.promise,this.onRejected,e)},r.resolve=function(e,t){var i=f(d,t);if("error"===i.status)return r.reject(e,i.value);var n=i.value;if(n)p(e,n);else{e.state=a,e.outcome=t;for(var s=-1,o=e.queue.length;++s<o;)e.queue[s].callFulfilled(t)}return e},r.reject=function(e,t){e.state=o,e.outcome=t;for(var i=-1,n=e.queue.length;++i<n;)e.queue[i].callRejected(t);return e},h.resolve=function(e){return e instanceof this?e:r.resolve(new this(s),e)},h.reject=function(e){var t=new this(s);return r.reject(t,e)},h.all=function(e){var t=this;if("[object Array]"!==Object.prototype.toString.call(e))return this.reject(new TypeError("must be an array"));var i=e.length,n=!1;if(!i)return this.resolve([]);for(var o=new Array(i),a=0,l=-1,h=new this(s);++l<i;)c(e[l],l);return h;function c(e,s){t.resolve(e).then((function(e){o[s]=e,++a!==i||n||(n=!0,r.resolve(h,o))}),(function(e){n||(n=!0,r.reject(h,e))}))}},h.race=function(e){if("[object Array]"!==Object.prototype.toString.call(e))return this.reject(new TypeError("must be an array"));var t=e.length,i=!1;if(!t)return this.resolve([]);for(var n,o=-1,a=new this(s);++o<t;)n=e[o],this.resolve(n).then((function(e){i||(i=!0,r.resolve(a,e))}),(function(e){i||(i=!0,r.reject(a,e))}));return a}},{immediate:36}],38:[function(e,t,i){var n={};(0,e("./lib/utils/common").assign)(n,e("./lib/deflate"),e("./lib/inflate"),e("./lib/zlib/constants")),t.exports=n},{"./lib/deflate":39,"./lib/inflate":40,"./lib/utils/common":41,"./lib/zlib/constants":44}],39:[function(e,t,i){var n=e("./zlib/deflate"),s=e("./utils/common"),r=e("./utils/strings"),o=e("./zlib/messages"),a=e("./zlib/zstream"),l=Object.prototype.toString,h=0,c=-1,u=0,d=8;function p(e){if(!(this instanceof p))return new p(e);this.options=s.assign({level:c,method:d,chunkSize:16384,windowBits:15,memLevel:8,strategy:u,to:""},e||{});var t=this.options;t.raw&&0<t.windowBits?t.windowBits=-t.windowBits:t.gzip&&0<t.windowBits&&t.windowBits<16&&(t.windowBits+=16),this.err=0,this.msg="",this.ended=!1,this.chunks=[],this.strm=new a,this.strm.avail_out=0;var i=n.deflateInit2(this.strm,t.level,t.method,t.windowBits,t.memLevel,t.strategy);if(i!==h)throw new Error(o[i]);if(t.header&&n.deflateSetHeader(this.strm,t.header),t.dictionary){var f;if(f="string"==typeof t.dictionary?r.string2buf(t.dictionary):"[object ArrayBuffer]"===l.call(t.dictionary)?new Uint8Array(t.dictionary):t.dictionary,(i=n.deflateSetDictionary(this.strm,f))!==h)throw new Error(o[i]);this._dict_set=!0}}function f(e,t){var i=new p(t);if(i.push(e,!0),i.err)throw i.msg||o[i.err];return i.result}p.prototype.push=function(e,t){var i,o,a=this.strm,c=this.options.chunkSize;if(this.ended)return!1;o=t===~~t?t:!0===t?4:0,"string"==typeof e?a.input=r.string2buf(e):"[object ArrayBuffer]"===l.call(e)?a.input=new Uint8Array(e):a.input=e,a.next_in=0,a.avail_in=a.input.length;do{if(0===a.avail_out&&(a.output=new s.Buf8(c),a.next_out=0,a.avail_out=c),1!==(i=n.deflate(a,o))&&i!==h)return this.onEnd(i),!(this.ended=!0);0!==a.avail_out&&(0!==a.avail_in||4!==o&&2!==o)||("string"===this.options.to?this.onData(r.buf2binstring(s.shrinkBuf(a.output,a.next_out))):this.onData(s.shrinkBuf(a.output,a.next_out)))}while((0<a.avail_in||0===a.avail_out)&&1!==i);return 4===o?(i=n.deflateEnd(this.strm),this.onEnd(i),this.ended=!0,i===h):2!==o||(this.onEnd(h),!(a.avail_out=0))},p.prototype.onData=function(e){this.chunks.push(e)},p.prototype.onEnd=function(e){e===h&&("string"===this.options.to?this.result=this.chunks.join(""):this.result=s.flattenChunks(this.chunks)),this.chunks=[],this.err=e,this.msg=this.strm.msg},i.Deflate=p,i.deflate=f,i.deflateRaw=function(e,t){return(t=t||{}).raw=!0,f(e,t)},i.gzip=function(e,t){return(t=t||{}).gzip=!0,f(e,t)}},{"./utils/common":41,"./utils/strings":42,"./zlib/deflate":46,"./zlib/messages":51,"./zlib/zstream":53}],40:[function(e,t,i){var n=e("./zlib/inflate"),s=e("./utils/common"),r=e("./utils/strings"),o=e("./zlib/constants"),a=e("./zlib/messages"),l=e("./zlib/zstream"),h=e("./zlib/gzheader"),c=Object.prototype.toString;function u(e){if(!(this instanceof u))return new u(e);this.options=s.assign({chunkSize:16384,windowBits:0,to:""},e||{});var t=this.options;t.raw&&0<=t.windowBits&&t.windowBits<16&&(t.windowBits=-t.windowBits,0===t.windowBits&&(t.windowBits=-15)),!(0<=t.windowBits&&t.windowBits<16)||e&&e.windowBits||(t.windowBits+=32),15<t.windowBits&&t.windowBits<48&&0==(15&t.windowBits)&&(t.windowBits|=15),this.err=0,this.msg="",this.ended=!1,this.chunks=[],this.strm=new l,this.strm.avail_out=0;var i=n.inflateInit2(this.strm,t.windowBits);if(i!==o.Z_OK)throw new Error(a[i]);this.header=new h,n.inflateGetHeader(this.strm,this.header)}function d(e,t){var i=new u(t);if(i.push(e,!0),i.err)throw i.msg||a[i.err];return i.result}u.prototype.push=function(e,t){var i,a,l,h,u,d,p=this.strm,f=this.options.chunkSize,_=this.options.dictionary,m=!1;if(this.ended)return!1;a=t===~~t?t:!0===t?o.Z_FINISH:o.Z_NO_FLUSH,"string"==typeof e?p.input=r.binstring2buf(e):"[object ArrayBuffer]"===c.call(e)?p.input=new Uint8Array(e):p.input=e,p.next_in=0,p.avail_in=p.input.length;do{if(0===p.avail_out&&(p.output=new s.Buf8(f),p.next_out=0,p.avail_out=f),(i=n.inflate(p,o.Z_NO_FLUSH))===o.Z_NEED_DICT&&_&&(d="string"==typeof _?r.string2buf(_):"[object ArrayBuffer]"===c.call(_)?new Uint8Array(_):_,i=n.inflateSetDictionary(this.strm,d)),i===o.Z_BUF_ERROR&&!0===m&&(i=o.Z_OK,m=!1),i!==o.Z_STREAM_END&&i!==o.Z_OK)return this.onEnd(i),!(this.ended=!0);p.next_out&&(0!==p.avail_out&&i!==o.Z_STREAM_END&&(0!==p.avail_in||a!==o.Z_FINISH&&a!==o.Z_SYNC_FLUSH)||("string"===this.options.to?(l=r.utf8border(p.output,p.next_out),h=p.next_out-l,u=r.buf2string(p.output,l),p.next_out=h,p.avail_out=f-h,h&&s.arraySet(p.output,p.output,l,h,0),this.onData(u)):this.onData(s.shrinkBuf(p.output,p.next_out)))),0===p.avail_in&&0===p.avail_out&&(m=!0)}while((0<p.avail_in||0===p.avail_out)&&i!==o.Z_STREAM_END);return i===o.Z_STREAM_END&&(a=o.Z_FINISH),a===o.Z_FINISH?(i=n.inflateEnd(this.strm),this.onEnd(i),this.ended=!0,i===o.Z_OK):a!==o.Z_SYNC_FLUSH||(this.onEnd(o.Z_OK),!(p.avail_out=0))},u.prototype.onData=function(e){this.chunks.push(e)},u.prototype.onEnd=function(e){e===o.Z_OK&&("string"===this.options.to?this.result=this.chunks.join(""):this.result=s.flattenChunks(this.chunks)),this.chunks=[],this.err=e,this.msg=this.strm.msg},i.Inflate=u,i.inflate=d,i.inflateRaw=function(e,t){return(t=t||{}).raw=!0,d(e,t)},i.ungzip=d},{"./utils/common":41,"./utils/strings":42,"./zlib/constants":44,"./zlib/gzheader":47,"./zlib/inflate":49,"./zlib/messages":51,"./zlib/zstream":53}],41:[function(e,t,i){var n="undefined"!=typeof Uint8Array&&"undefined"!=typeof Uint16Array&&"undefined"!=typeof Int32Array;i.assign=function(e){for(var t=Array.prototype.slice.call(arguments,1);t.length;){var i=t.shift();if(i){if("object"!=typeof i)throw new TypeError(i+"must be non-object");for(var n in i)i.hasOwnProperty(n)&&(e[n]=i[n])}}return e},i.shrinkBuf=function(e,t){return e.length===t?e:e.subarray?e.subarray(0,t):(e.length=t,e)};var s={arraySet:function(e,t,i,n,s){if(t.subarray&&e.subarray)e.set(t.subarray(i,i+n),s);else for(var r=0;r<n;r++)e[s+r]=t[i+r]},flattenChunks:function(e){var t,i,n,s,r,o;for(t=n=0,i=e.length;t<i;t++)n+=e[t].length;for(o=new Uint8Array(n),t=s=0,i=e.length;t<i;t++)r=e[t],o.set(r,s),s+=r.length;return o}},r={arraySet:function(e,t,i,n,s){for(var r=0;r<n;r++)e[s+r]=t[i+r]},flattenChunks:function(e){return[].concat.apply([],e)}};i.setTyped=function(e){e?(i.Buf8=Uint8Array,i.Buf16=Uint16Array,i.Buf32=Int32Array,i.assign(i,s)):(i.Buf8=Array,i.Buf16=Array,i.Buf32=Array,i.assign(i,r))},i.setTyped(n)},{}],42:[function(e,t,i){var n=e("./common"),s=!0,r=!0;try{String.fromCharCode.apply(null,[0])}catch(e){s=!1}try{String.fromCharCode.apply(null,new Uint8Array(1))}catch(e){r=!1}for(var o=new n.Buf8(256),a=0;a<256;a++)o[a]=252<=a?6:248<=a?5:240<=a?4:224<=a?3:192<=a?2:1;function l(e,t){if(t<65537&&(e.subarray&&r||!e.subarray&&s))return String.fromCharCode.apply(null,n.shrinkBuf(e,t));for(var i="",o=0;o<t;o++)i+=String.fromCharCode(e[o]);return i}o[254]=o[254]=1,i.string2buf=function(e){var t,i,s,r,o,a=e.length,l=0;for(r=0;r<a;r++)55296==(64512&(i=e.charCodeAt(r)))&&r+1<a&&56320==(64512&(s=e.charCodeAt(r+1)))&&(i=65536+(i-55296<<10)+(s-56320),r++),l+=i<128?1:i<2048?2:i<65536?3:4;for(t=new n.Buf8(l),r=o=0;o<l;r++)55296==(64512&(i=e.charCodeAt(r)))&&r+1<a&&56320==(64512&(s=e.charCodeAt(r+1)))&&(i=65536+(i-55296<<10)+(s-56320),r++),i<128?t[o++]=i:(i<2048?t[o++]=192|i>>>6:(i<65536?t[o++]=224|i>>>12:(t[o++]=240|i>>>18,t[o++]=128|i>>>12&63),t[o++]=128|i>>>6&63),t[o++]=128|63&i);return t},i.buf2binstring=function(e){return l(e,e.length)},i.binstring2buf=function(e){for(var t=new n.Buf8(e.length),i=0,s=t.length;i<s;i++)t[i]=e.charCodeAt(i);return t},i.buf2string=function(e,t){var i,n,s,r,a=t||e.length,h=new Array(2*a);for(i=n=0;i<a;)if((s=e[i++])<128)h[n++]=s;else if(4<(r=o[s]))h[n++]=65533,i+=r-1;else{for(s&=2===r?31:3===r?15:7;1<r&&i<a;)s=s<<6|63&e[i++],r--;1<r?h[n++]=65533:s<65536?h[n++]=s:(s-=65536,h[n++]=55296|s>>10&1023,h[n++]=56320|1023&s)}return l(h,n)},i.utf8border=function(e,t){var i;for((t=t||e.length)>e.length&&(t=e.length),i=t-1;0<=i&&128==(192&e[i]);)i--;return i<0||0===i?t:i+o[e[i]]>t?i:t}},{"./common":41}],43:[function(e,t,i){t.exports=function(e,t,i,n){for(var s=65535&e|0,r=e>>>16&65535|0,o=0;0!==i;){for(i-=o=2e3<i?2e3:i;r=r+(s=s+t[n++]|0)|0,--o;);s%=65521,r%=65521}return s|r<<16|0}},{}],44:[function(e,t,i){t.exports={Z_NO_FLUSH:0,Z_PARTIAL_FLUSH:1,Z_SYNC_FLUSH:2,Z_FULL_FLUSH:3,Z_FINISH:4,Z_BLOCK:5,Z_TREES:6,Z_OK:0,Z_STREAM_END:1,Z_NEED_DICT:2,Z_ERRNO:-1,Z_STREAM_ERROR:-2,Z_DATA_ERROR:-3,Z_BUF_ERROR:-5,Z_NO_COMPRESSION:0,Z_BEST_SPEED:1,Z_BEST_COMPRESSION:9,Z_DEFAULT_COMPRESSION:-1,Z_FILTERED:1,Z_HUFFMAN_ONLY:2,Z_RLE:3,Z_FIXED:4,Z_DEFAULT_STRATEGY:0,Z_BINARY:0,Z_TEXT:1,Z_UNKNOWN:2,Z_DEFLATED:8}},{}],45:[function(e,t,i){var n=function(){for(var e,t=[],i=0;i<256;i++){e=i;for(var n=0;n<8;n++)e=1&e?3988292384^e>>>1:e>>>1;t[i]=e}return t}();t.exports=function(e,t,i,s){var r=n,o=s+i;e^=-1;for(var a=s;a<o;a++)e=e>>>8^r[255&(e^t[a])];return-1^e}},{}],46:[function(e,t,i){var n,s=e("../utils/common"),r=e("./trees"),o=e("./adler32"),a=e("./crc32"),l=e("./messages"),h=0,c=0,u=-2,d=2,p=8,f=286,_=30,m=19,g=2*f+1,v=15,y=3,x=258,b=x+y+1,T=42,S=113;function E(e,t){return e.msg=l[t],t}function C(e){return(e<<1)-(4<e?9:0)}function A(e){for(var t=e.length;0<=--t;)e[t]=0}function P(e){var t=e.state,i=t.pending;i>e.avail_out&&(i=e.avail_out),0!==i&&(s.arraySet(e.output,t.pending_buf,t.pending_out,i,e.next_out),e.next_out+=i,t.pending_out+=i,e.total_out+=i,e.avail_out-=i,t.pending-=i,0===t.pending&&(t.pending_out=0))}function R(e,t){r._tr_flush_block(e,0<=e.block_start?e.block_start:-1,e.strstart-e.block_start,t),e.block_start=e.strstart,P(e.strm)}function M(e,t){e.pending_buf[e.pending++]=t}function I(e,t){e.pending_buf[e.pending++]=t>>>8&255,e.pending_buf[e.pending++]=255&t}function D(e,t){var i,n,s=e.max_chain_length,r=e.strstart,o=e.prev_length,a=e.nice_match,l=e.strstart>e.w_size-b?e.strstart-(e.w_size-b):0,h=e.window,c=e.w_mask,u=e.prev,d=e.strstart+x,p=h[r+o-1],f=h[r+o];e.prev_length>=e.good_match&&(s>>=2),a>e.lookahead&&(a=e.lookahead);do{if(h[(i=t)+o]===f&&h[i+o-1]===p&&h[i]===h[r]&&h[++i]===h[r+1]){r+=2,i++;do{}while(h[++r]===h[++i]&&h[++r]===h[++i]&&h[++r]===h[++i]&&h[++r]===h[++i]&&h[++r]===h[++i]&&h[++r]===h[++i]&&h[++r]===h[++i]&&h[++r]===h[++i]&&r<d);if(n=x-(d-r),r=d-x,o<n){if(e.match_start=t,a<=(o=n))break;p=h[r+o-1],f=h[r+o]}}}while((t=u[t&c])>l&&0!=--s);return o<=e.lookahead?o:e.lookahead}function O(e){var t,i,n,r,l,h,c,u,d,p,f=e.w_size;do{if(r=e.window_size-e.lookahead-e.strstart,e.strstart>=f+(f-b)){for(s.arraySet(e.window,e.window,f,f,0),e.match_start-=f,e.strstart-=f,e.block_start-=f,t=i=e.hash_size;n=e.head[--t],e.head[t]=f<=n?n-f:0,--i;);for(t=i=f;n=e.prev[--t],e.prev[t]=f<=n?n-f:0,--i;);r+=f}if(0===e.strm.avail_in)break;if(h=e.strm,c=e.window,u=e.strstart+e.lookahead,p=void 0,(d=r)<(p=h.avail_in)&&(p=d),i=0===p?0:(h.avail_in-=p,s.arraySet(c,h.input,h.next_in,p,u),1===h.state.wrap?h.adler=o(h.adler,c,p,u):2===h.state.wrap&&(h.adler=a(h.adler,c,p,u)),h.next_in+=p,h.total_in+=p,p),e.lookahead+=i,e.lookahead+e.insert>=y)for(l=e.strstart-e.insert,e.ins_h=e.window[l],e.ins_h=(e.ins_h<<e.hash_shift^e.window[l+1])&e.hash_mask;e.insert&&(e.ins_h=(e.ins_h<<e.hash_shift^e.window[l+y-1])&e.hash_mask,e.prev[l&e.w_mask]=e.head[e.ins_h],e.head[e.ins_h]=l,l++,e.insert--,!(e.lookahead+e.insert<y)););}while(e.lookahead<b&&0!==e.strm.avail_in)}function w(e,t){for(var i,n;;){if(e.lookahead<b){if(O(e),e.lookahead<b&&t===h)return 1;if(0===e.lookahead)break}if(i=0,e.lookahead>=y&&(e.ins_h=(e.ins_h<<e.hash_shift^e.window[e.strstart+y-1])&e.hash_mask,i=e.prev[e.strstart&e.w_mask]=e.head[e.ins_h],e.head[e.ins_h]=e.strstart),0!==i&&e.strstart-i<=e.w_size-b&&(e.match_length=D(e,i)),e.match_length>=y)if(n=r._tr_tally(e,e.strstart-e.match_start,e.match_length-y),e.lookahead-=e.match_length,e.match_length<=e.max_lazy_match&&e.lookahead>=y){for(e.match_length--;e.strstart++,e.ins_h=(e.ins_h<<e.hash_shift^e.window[e.strstart+y-1])&e.hash_mask,i=e.prev[e.strstart&e.w_mask]=e.head[e.ins_h],e.head[e.ins_h]=e.strstart,0!=--e.match_length;);e.strstart++}else e.strstart+=e.match_length,e.match_length=0,e.ins_h=e.window[e.strstart],e.ins_h=(e.ins_h<<e.hash_shift^e.window[e.strstart+1])&e.hash_mask;else n=r._tr_tally(e,0,e.window[e.strstart]),e.lookahead--,e.strstart++;if(n&&(R(e,!1),0===e.strm.avail_out))return 1}return e.insert=e.strstart<y-1?e.strstart:y-1,4===t?(R(e,!0),0===e.strm.avail_out?3:4):e.last_lit&&(R(e,!1),0===e.strm.avail_out)?1:2}function N(e,t){for(var i,n,s;;){if(e.lookahead<b){if(O(e),e.lookahead<b&&t===h)return 1;if(0===e.lookahead)break}if(i=0,e.lookahead>=y&&(e.ins_h=(e.ins_h<<e.hash_shift^e.window[e.strstart+y-1])&e.hash_mask,i=e.prev[e.strstart&e.w_mask]=e.head[e.ins_h],e.head[e.ins_h]=e.strstart),e.prev_length=e.match_length,e.prev_match=e.match_start,e.match_length=y-1,0!==i&&e.prev_length<e.max_lazy_match&&e.strstart-i<=e.w_size-b&&(e.match_length=D(e,i),e.match_length<=5&&(1===e.strategy||e.match_length===y&&4096<e.strstart-e.match_start)&&(e.match_length=y-1)),e.prev_length>=y&&e.match_length<=e.prev_length){for(s=e.strstart+e.lookahead-y,n=r._tr_tally(e,e.strstart-1-e.prev_match,e.prev_length-y),e.lookahead-=e.prev_length-1,e.prev_length-=2;++e.strstart<=s&&(e.ins_h=(e.ins_h<<e.hash_shift^e.window[e.strstart+y-1])&e.hash_mask,i=e.prev[e.strstart&e.w_mask]=e.head[e.ins_h],e.head[e.ins_h]=e.strstart),0!=--e.prev_length;);if(e.match_available=0,e.match_length=y-1,e.strstart++,n&&(R(e,!1),0===e.strm.avail_out))return 1}else if(e.match_available){if((n=r._tr_tally(e,0,e.window[e.strstart-1]))&&R(e,!1),e.strstart++,e.lookahead--,0===e.strm.avail_out)return 1}else e.match_available=1,e.strstart++,e.lookahead--}return e.match_available&&(n=r._tr_tally(e,0,e.window[e.strstart-1]),e.match_available=0),e.insert=e.strstart<y-1?e.strstart:y-1,4===t?(R(e,!0),0===e.strm.avail_out?3:4):e.last_lit&&(R(e,!1),0===e.strm.avail_out)?1:2}function F(e,t,i,n,s){this.good_length=e,this.max_lazy=t,this.nice_length=i,this.max_chain=n,this.func=s}function L(){this.strm=null,this.status=0,this.pending_buf=null,this.pending_buf_size=0,this.pending_out=0,this.pending=0,this.wrap=0,this.gzhead=null,this.gzindex=0,this.method=p,this.last_flush=-1,this.w_size=0,this.w_bits=0,this.w_mask=0,this.window=null,this.window_size=0,this.prev=null,this.head=null,this.ins_h=0,this.hash_size=0,this.hash_bits=0,this.hash_mask=0,this.hash_shift=0,this.block_start=0,this.match_length=0,this.prev_match=0,this.match_available=0,this.strstart=0,this.match_start=0,this.lookahead=0,this.prev_length=0,this.max_chain_length=0,this.max_lazy_match=0,this.level=0,this.strategy=0,this.good_match=0,this.nice_match=0,this.dyn_ltree=new s.Buf16(2*g),this.dyn_dtree=new s.Buf16(2*(2*_+1)),this.bl_tree=new s.Buf16(2*(2*m+1)),A(this.dyn_ltree),A(this.dyn_dtree),A(this.bl_tree),this.l_desc=null,this.d_desc=null,this.bl_desc=null,this.bl_count=new s.Buf16(v+1),this.heap=new s.Buf16(2*f+1),A(this.heap),this.heap_len=0,this.heap_max=0,this.depth=new s.Buf16(2*f+1),A(this.depth),this.l_buf=0,this.lit_bufsize=0,this.last_lit=0,this.d_buf=0,this.opt_len=0,this.static_len=0,this.matches=0,this.insert=0,this.bi_buf=0,this.bi_valid=0}function B(e){var t;return e&&e.state?(e.total_in=e.total_out=0,e.data_type=d,(t=e.state).pending=0,t.pending_out=0,t.wrap<0&&(t.wrap=-t.wrap),t.status=t.wrap?T:S,e.adler=2===t.wrap?0:1,t.last_flush=h,r._tr_init(t),c):E(e,u)}function U(e){var t=B(e);return t===c&&function(e){e.window_size=2*e.w_size,A(e.head),e.max_lazy_match=n[e.level].max_lazy,e.good_match=n[e.level].good_length,e.nice_match=n[e.level].nice_length,e.max_chain_length=n[e.level].max_chain,e.strstart=0,e.block_start=0,e.lookahead=0,e.insert=0,e.match_length=e.prev_length=y-1,e.match_available=0,e.ins_h=0}(e.state),t}function V(e,t,i,n,r,o){if(!e)return u;var a=1;if(-1===t&&(t=6),n<0?(a=0,n=-n):15<n&&(a=2,n-=16),r<1||9<r||i!==p||n<8||15<n||t<0||9<t||o<0||4<o)return E(e,u);8===n&&(n=9);var l=new L;return(e.state=l).strm=e,l.wrap=a,l.gzhead=null,l.w_bits=n,l.w_size=1<<l.w_bits,l.w_mask=l.w_size-1,l.hash_bits=r+7,l.hash_size=1<<l.hash_bits,l.hash_mask=l.hash_size-1,l.hash_shift=~~((l.hash_bits+y-1)/y),l.window=new s.Buf8(2*l.w_size),l.head=new s.Buf16(l.hash_size),l.prev=new s.Buf16(l.w_size),l.lit_bufsize=1<<r+6,l.pending_buf_size=4*l.lit_bufsize,l.pending_buf=new s.Buf8(l.pending_buf_size),l.d_buf=1*l.lit_bufsize,l.l_buf=3*l.lit_bufsize,l.level=t,l.strategy=o,l.method=i,U(e)}n=[new F(0,0,0,0,(function(e,t){var i=65535;for(i>e.pending_buf_size-5&&(i=e.pending_buf_size-5);;){if(e.lookahead<=1){if(O(e),0===e.lookahead&&t===h)return 1;if(0===e.lookahead)break}e.strstart+=e.lookahead,e.lookahead=0;var n=e.block_start+i;if((0===e.strstart||e.strstart>=n)&&(e.lookahead=e.strstart-n,e.strstart=n,R(e,!1),0===e.strm.avail_out))return 1;if(e.strstart-e.block_start>=e.w_size-b&&(R(e,!1),0===e.strm.avail_out))return 1}return e.insert=0,4===t?(R(e,!0),0===e.strm.avail_out?3:4):(e.strstart>e.block_start&&(R(e,!1),e.strm.avail_out),1)})),new F(4,4,8,4,w),new F(4,5,16,8,w),new F(4,6,32,32,w),new F(4,4,16,16,N),new F(8,16,32,32,N),new F(8,16,128,128,N),new F(8,32,128,256,N),new F(32,128,258,1024,N),new F(32,258,258,4096,N)],i.deflateInit=function(e,t){return V(e,t,p,15,8,0)},i.deflateInit2=V,i.deflateReset=U,i.deflateResetKeep=B,i.deflateSetHeader=function(e,t){return e&&e.state?2!==e.state.wrap?u:(e.state.gzhead=t,c):u},i.deflate=function(e,t){var i,s,o,l;if(!e||!e.state||5<t||t<0)return e?E(e,u):u;if(s=e.state,!e.output||!e.input&&0!==e.avail_in||666===s.status&&4!==t)return E(e,0===e.avail_out?-5:u);if(s.strm=e,i=s.last_flush,s.last_flush=t,s.status===T)if(2===s.wrap)e.adler=0,M(s,31),M(s,139),M(s,8),s.gzhead?(M(s,(s.gzhead.text?1:0)+(s.gzhead.hcrc?2:0)+(s.gzhead.extra?4:0)+(s.gzhead.name?8:0)+(s.gzhead.comment?16:0)),M(s,255&s.gzhead.time),M(s,s.gzhead.time>>8&255),M(s,s.gzhead.time>>16&255),M(s,s.gzhead.time>>24&255),M(s,9===s.level?2:2<=s.strategy||s.level<2?4:0),M(s,255&s.gzhead.os),s.gzhead.extra&&s.gzhead.extra.length&&(M(s,255&s.gzhead.extra.length),M(s,s.gzhead.extra.length>>8&255)),s.gzhead.hcrc&&(e.adler=a(e.adler,s.pending_buf,s.pending,0)),s.gzindex=0,s.status=69):(M(s,0),M(s,0),M(s,0),M(s,0),M(s,0),M(s,9===s.level?2:2<=s.strategy||s.level<2?4:0),M(s,3),s.status=S);else{var d=p+(s.w_bits-8<<4)<<8;d|=(2<=s.strategy||s.level<2?0:s.level<6?1:6===s.level?2:3)<<6,0!==s.strstart&&(d|=32),d+=31-d%31,s.status=S,I(s,d),0!==s.strstart&&(I(s,e.adler>>>16),I(s,65535&e.adler)),e.adler=1}if(69===s.status)if(s.gzhead.extra){for(o=s.pending;s.gzindex<(65535&s.gzhead.extra.length)&&(s.pending!==s.pending_buf_size||(s.gzhead.hcrc&&s.pending>o&&(e.adler=a(e.adler,s.pending_buf,s.pending-o,o)),P(e),o=s.pending,s.pending!==s.pending_buf_size));)M(s,255&s.gzhead.extra[s.gzindex]),s.gzindex++;s.gzhead.hcrc&&s.pending>o&&(e.adler=a(e.adler,s.pending_buf,s.pending-o,o)),s.gzindex===s.gzhead.extra.length&&(s.gzindex=0,s.status=73)}else s.status=73;if(73===s.status)if(s.gzhead.name){o=s.pending;do{if(s.pending===s.pending_buf_size&&(s.gzhead.hcrc&&s.pending>o&&(e.adler=a(e.adler,s.pending_buf,s.pending-o,o)),P(e),o=s.pending,s.pending===s.pending_buf_size)){l=1;break}l=s.gzindex<s.gzhead.name.length?255&s.gzhead.name.charCodeAt(s.gzindex++):0,M(s,l)}while(0!==l);s.gzhead.hcrc&&s.pending>o&&(e.adler=a(e.adler,s.pending_buf,s.pending-o,o)),0===l&&(s.gzindex=0,s.status=91)}else s.status=91;if(91===s.status)if(s.gzhead.comment){o=s.pending;do{if(s.pending===s.pending_buf_size&&(s.gzhead.hcrc&&s.pending>o&&(e.adler=a(e.adler,s.pending_buf,s.pending-o,o)),P(e),o=s.pending,s.pending===s.pending_buf_size)){l=1;break}l=s.gzindex<s.gzhead.comment.length?255&s.gzhead.comment.charCodeAt(s.gzindex++):0,M(s,l)}while(0!==l);s.gzhead.hcrc&&s.pending>o&&(e.adler=a(e.adler,s.pending_buf,s.pending-o,o)),0===l&&(s.status=103)}else s.status=103;if(103===s.status&&(s.gzhead.hcrc?(s.pending+2>s.pending_buf_size&&P(e),s.pending+2<=s.pending_buf_size&&(M(s,255&e.adler),M(s,e.adler>>8&255),e.adler=0,s.status=S)):s.status=S),0!==s.pending){if(P(e),0===e.avail_out)return s.last_flush=-1,c}else if(0===e.avail_in&&C(t)<=C(i)&&4!==t)return E(e,-5);if(666===s.status&&0!==e.avail_in)return E(e,-5);if(0!==e.avail_in||0!==s.lookahead||t!==h&&666!==s.status){var f=2===s.strategy?function(e,t){for(var i;;){if(0===e.lookahead&&(O(e),0===e.lookahead)){if(t===h)return 1;break}if(e.match_length=0,i=r._tr_tally(e,0,e.window[e.strstart]),e.lookahead--,e.strstart++,i&&(R(e,!1),0===e.strm.avail_out))return 1}return e.insert=0,4===t?(R(e,!0),0===e.strm.avail_out?3:4):e.last_lit&&(R(e,!1),0===e.strm.avail_out)?1:2}(s,t):3===s.strategy?function(e,t){for(var i,n,s,o,a=e.window;;){if(e.lookahead<=x){if(O(e),e.lookahead<=x&&t===h)return 1;if(0===e.lookahead)break}if(e.match_length=0,e.lookahead>=y&&0<e.strstart&&(n=a[s=e.strstart-1])===a[++s]&&n===a[++s]&&n===a[++s]){o=e.strstart+x;do{}while(n===a[++s]&&n===a[++s]&&n===a[++s]&&n===a[++s]&&n===a[++s]&&n===a[++s]&&n===a[++s]&&n===a[++s]&&s<o);e.match_length=x-(o-s),e.match_length>e.lookahead&&(e.match_length=e.lookahead)}if(e.match_length>=y?(i=r._tr_tally(e,1,e.match_length-y),e.lookahead-=e.match_length,e.strstart+=e.match_length,e.match_length=0):(i=r._tr_tally(e,0,e.window[e.strstart]),e.lookahead--,e.strstart++),i&&(R(e,!1),0===e.strm.avail_out))return 1}return e.insert=0,4===t?(R(e,!0),0===e.strm.avail_out?3:4):e.last_lit&&(R(e,!1),0===e.strm.avail_out)?1:2}(s,t):n[s.level].func(s,t);if(3!==f&&4!==f||(s.status=666),1===f||3===f)return 0===e.avail_out&&(s.last_flush=-1),c;if(2===f&&(1===t?r._tr_align(s):5!==t&&(r._tr_stored_block(s,0,0,!1),3===t&&(A(s.head),0===s.lookahead&&(s.strstart=0,s.block_start=0,s.insert=0))),P(e),0===e.avail_out))return s.last_flush=-1,c}return 4!==t?c:s.wrap<=0?1:(2===s.wrap?(M(s,255&e.adler),M(s,e.adler>>8&255),M(s,e.adler>>16&255),M(s,e.adler>>24&255),M(s,255&e.total_in),M(s,e.total_in>>8&255),M(s,e.total_in>>16&255),M(s,e.total_in>>24&255)):(I(s,e.adler>>>16),I(s,65535&e.adler)),P(e),0<s.wrap&&(s.wrap=-s.wrap),0!==s.pending?c:1)},i.deflateEnd=function(e){var t;return e&&e.state?(t=e.state.status)!==T&&69!==t&&73!==t&&91!==t&&103!==t&&t!==S&&666!==t?E(e,u):(e.state=null,t===S?E(e,-3):c):u},i.deflateSetDictionary=function(e,t){var i,n,r,a,l,h,d,p,f=t.length;if(!e||!e.state)return u;if(2===(a=(i=e.state).wrap)||1===a&&i.status!==T||i.lookahead)return u;for(1===a&&(e.adler=o(e.adler,t,f,0)),i.wrap=0,f>=i.w_size&&(0===a&&(A(i.head),i.strstart=0,i.block_start=0,i.insert=0),p=new s.Buf8(i.w_size),s.arraySet(p,t,f-i.w_size,i.w_size,0),t=p,f=i.w_size),l=e.avail_in,h=e.next_in,d=e.input,e.avail_in=f,e.next_in=0,e.input=t,O(i);i.lookahead>=y;){for(n=i.strstart,r=i.lookahead-(y-1);i.ins_h=(i.ins_h<<i.hash_shift^i.window[n+y-1])&i.hash_mask,i.prev[n&i.w_mask]=i.head[i.ins_h],i.head[i.ins_h]=n,n++,--r;);i.strstart=n,i.lookahead=y-1,O(i)}return i.strstart+=i.lookahead,i.block_start=i.strstart,i.insert=i.lookahead,i.lookahead=0,i.match_length=i.prev_length=y-1,i.match_available=0,e.next_in=h,e.input=d,e.avail_in=l,i.wrap=a,c},i.deflateInfo="pako deflate (from Nodeca project)"},{"../utils/common":41,"./adler32":43,"./crc32":45,"./messages":51,"./trees":52}],47:[function(e,t,i){t.exports=function(){this.text=0,this.time=0,this.xflags=0,this.os=0,this.extra=null,this.extra_len=0,this.name="",this.comment="",this.hcrc=0,this.done=!1}},{}],48:[function(e,t,i){t.exports=function(e,t){var i,n,s,r,o,a,l,h,c,u,d,p,f,_,m,g,v,y,x,b,T,S,E,C,A;i=e.state,n=e.next_in,C=e.input,s=n+(e.avail_in-5),r=e.next_out,A=e.output,o=r-(t-e.avail_out),a=r+(e.avail_out-257),l=i.dmax,h=i.wsize,c=i.whave,u=i.wnext,d=i.window,p=i.hold,f=i.bits,_=i.lencode,m=i.distcode,g=(1<<i.lenbits)-1,v=(1<<i.distbits)-1;e:do{f<15&&(p+=C[n++]<<f,f+=8,p+=C[n++]<<f,f+=8),y=_[p&g];t:for(;;){if(p>>>=x=y>>>24,f-=x,0==(x=y>>>16&255))A[r++]=65535&y;else{if(!(16&x)){if(0==(64&x)){y=_[(65535&y)+(p&(1<<x)-1)];continue t}if(32&x){i.mode=12;break e}e.msg="invalid literal/length code",i.mode=30;break e}b=65535&y,(x&=15)&&(f<x&&(p+=C[n++]<<f,f+=8),b+=p&(1<<x)-1,p>>>=x,f-=x),f<15&&(p+=C[n++]<<f,f+=8,p+=C[n++]<<f,f+=8),y=m[p&v];i:for(;;){if(p>>>=x=y>>>24,f-=x,!(16&(x=y>>>16&255))){if(0==(64&x)){y=m[(65535&y)+(p&(1<<x)-1)];continue i}e.msg="invalid distance code",i.mode=30;break e}if(T=65535&y,f<(x&=15)&&(p+=C[n++]<<f,(f+=8)<x&&(p+=C[n++]<<f,f+=8)),l<(T+=p&(1<<x)-1)){e.msg="invalid distance too far back",i.mode=30;break e}if(p>>>=x,f-=x,(x=r-o)<T){if(c<(x=T-x)&&i.sane){e.msg="invalid distance too far back",i.mode=30;break e}if(E=d,(S=0)===u){if(S+=h-x,x<b){for(b-=x;A[r++]=d[S++],--x;);S=r-T,E=A}}else if(u<x){if(S+=h+u-x,(x-=u)<b){for(b-=x;A[r++]=d[S++],--x;);if(S=0,u<b){for(b-=x=u;A[r++]=d[S++],--x;);S=r-T,E=A}}}else if(S+=u-x,x<b){for(b-=x;A[r++]=d[S++],--x;);S=r-T,E=A}for(;2<b;)A[r++]=E[S++],A[r++]=E[S++],A[r++]=E[S++],b-=3;b&&(A[r++]=E[S++],1<b&&(A[r++]=E[S++]))}else{for(S=r-T;A[r++]=A[S++],A[r++]=A[S++],A[r++]=A[S++],2<(b-=3););b&&(A[r++]=A[S++],1<b&&(A[r++]=A[S++]))}break}}break}}while(n<s&&r<a);n-=b=f>>3,p&=(1<<(f-=b<<3))-1,e.next_in=n,e.next_out=r,e.avail_in=n<s?s-n+5:5-(n-s),e.avail_out=r<a?a-r+257:257-(r-a),i.hold=p,i.bits=f}},{}],49:[function(e,t,i){var n=e("../utils/common"),s=e("./adler32"),r=e("./crc32"),o=e("./inffast"),a=e("./inftrees"),l=0,h=-2,c=1,u=852,d=592;function p(e){return(e>>>24&255)+(e>>>8&65280)+((65280&e)<<8)+((255&e)<<24)}function f(){this.mode=0,this.last=!1,this.wrap=0,this.havedict=!1,this.flags=0,this.dmax=0,this.check=0,this.total=0,this.head=null,this.wbits=0,this.wsize=0,this.whave=0,this.wnext=0,this.window=null,this.hold=0,this.bits=0,this.length=0,this.offset=0,this.extra=0,this.lencode=null,this.distcode=null,this.lenbits=0,this.distbits=0,this.ncode=0,this.nlen=0,this.ndist=0,this.have=0,this.next=null,this.lens=new n.Buf16(320),this.work=new n.Buf16(288),this.lendyn=null,this.distdyn=null,this.sane=0,this.back=0,this.was=0}function _(e){var t;return e&&e.state?(t=e.state,e.total_in=e.total_out=t.total=0,e.msg="",t.wrap&&(e.adler=1&t.wrap),t.mode=c,t.last=0,t.havedict=0,t.dmax=32768,t.head=null,t.hold=0,t.bits=0,t.lencode=t.lendyn=new n.Buf32(u),t.distcode=t.distdyn=new n.Buf32(d),t.sane=1,t.back=-1,l):h}function m(e){var t;return e&&e.state?((t=e.state).wsize=0,t.whave=0,t.wnext=0,_(e)):h}function g(e,t){var i,n;return e&&e.state?(n=e.state,t<0?(i=0,t=-t):(i=1+(t>>4),t<48&&(t&=15)),t&&(t<8||15<t)?h:(null!==n.window&&n.wbits!==t&&(n.window=null),n.wrap=i,n.wbits=t,m(e))):h}function v(e,t){var i,n;return e?(n=new f,(e.state=n).window=null,(i=g(e,t))!==l&&(e.state=null),i):h}var y,x,b=!0;function T(e){if(b){var t;for(y=new n.Buf32(512),x=new n.Buf32(32),t=0;t<144;)e.lens[t++]=8;for(;t<256;)e.lens[t++]=9;for(;t<280;)e.lens[t++]=7;for(;t<288;)e.lens[t++]=8;for(a(1,e.lens,0,288,y,0,e.work,{bits:9}),t=0;t<32;)e.lens[t++]=5;a(2,e.lens,0,32,x,0,e.work,{bits:5}),b=!1}e.lencode=y,e.lenbits=9,e.distcode=x,e.distbits=5}function S(e,t,i,s){var r,o=e.state;return null===o.window&&(o.wsize=1<<o.wbits,o.wnext=0,o.whave=0,o.window=new n.Buf8(o.wsize)),s>=o.wsize?(n.arraySet(o.window,t,i-o.wsize,o.wsize,0),o.wnext=0,o.whave=o.wsize):(s<(r=o.wsize-o.wnext)&&(r=s),n.arraySet(o.window,t,i-s,r,o.wnext),(s-=r)?(n.arraySet(o.window,t,i-s,s,0),o.wnext=s,o.whave=o.wsize):(o.wnext+=r,o.wnext===o.wsize&&(o.wnext=0),o.whave<o.wsize&&(o.whave+=r))),0}i.inflateReset=m,i.inflateReset2=g,i.inflateResetKeep=_,i.inflateInit=function(e){return v(e,15)},i.inflateInit2=v,i.inflate=function(e,t){var i,u,d,f,_,m,g,v,y,x,b,E,C,A,P,R,M,I,D,O,w,N,F,L,B=0,U=new n.Buf8(4),V=[16,17,18,0,8,7,9,6,10,5,11,4,12,3,13,2,14,1,15];if(!e||!e.state||!e.output||!e.input&&0!==e.avail_in)return h;12===(i=e.state).mode&&(i.mode=13),_=e.next_out,d=e.output,g=e.avail_out,f=e.next_in,u=e.input,m=e.avail_in,v=i.hold,y=i.bits,x=m,b=g,N=l;e:for(;;)switch(i.mode){case c:if(0===i.wrap){i.mode=13;break}for(;y<16;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}if(2&i.wrap&&35615===v){U[i.check=0]=255&v,U[1]=v>>>8&255,i.check=r(i.check,U,2,0),y=v=0,i.mode=2;break}if(i.flags=0,i.head&&(i.head.done=!1),!(1&i.wrap)||(((255&v)<<8)+(v>>8))%31){e.msg="incorrect header check",i.mode=30;break}if(8!=(15&v)){e.msg="unknown compression method",i.mode=30;break}if(y-=4,w=8+(15&(v>>>=4)),0===i.wbits)i.wbits=w;else if(w>i.wbits){e.msg="invalid window size",i.mode=30;break}i.dmax=1<<w,e.adler=i.check=1,i.mode=512&v?10:12,y=v=0;break;case 2:for(;y<16;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}if(i.flags=v,8!=(255&i.flags)){e.msg="unknown compression method",i.mode=30;break}if(57344&i.flags){e.msg="unknown header flags set",i.mode=30;break}i.head&&(i.head.text=v>>8&1),512&i.flags&&(U[0]=255&v,U[1]=v>>>8&255,i.check=r(i.check,U,2,0)),y=v=0,i.mode=3;case 3:for(;y<32;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}i.head&&(i.head.time=v),512&i.flags&&(U[0]=255&v,U[1]=v>>>8&255,U[2]=v>>>16&255,U[3]=v>>>24&255,i.check=r(i.check,U,4,0)),y=v=0,i.mode=4;case 4:for(;y<16;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}i.head&&(i.head.xflags=255&v,i.head.os=v>>8),512&i.flags&&(U[0]=255&v,U[1]=v>>>8&255,i.check=r(i.check,U,2,0)),y=v=0,i.mode=5;case 5:if(1024&i.flags){for(;y<16;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}i.length=v,i.head&&(i.head.extra_len=v),512&i.flags&&(U[0]=255&v,U[1]=v>>>8&255,i.check=r(i.check,U,2,0)),y=v=0}else i.head&&(i.head.extra=null);i.mode=6;case 6:if(1024&i.flags&&(m<(E=i.length)&&(E=m),E&&(i.head&&(w=i.head.extra_len-i.length,i.head.extra||(i.head.extra=new Array(i.head.extra_len)),n.arraySet(i.head.extra,u,f,E,w)),512&i.flags&&(i.check=r(i.check,u,E,f)),m-=E,f+=E,i.length-=E),i.length))break e;i.length=0,i.mode=7;case 7:if(2048&i.flags){if(0===m)break e;for(E=0;w=u[f+E++],i.head&&w&&i.length<65536&&(i.head.name+=String.fromCharCode(w)),w&&E<m;);if(512&i.flags&&(i.check=r(i.check,u,E,f)),m-=E,f+=E,w)break e}else i.head&&(i.head.name=null);i.length=0,i.mode=8;case 8:if(4096&i.flags){if(0===m)break e;for(E=0;w=u[f+E++],i.head&&w&&i.length<65536&&(i.head.comment+=String.fromCharCode(w)),w&&E<m;);if(512&i.flags&&(i.check=r(i.check,u,E,f)),m-=E,f+=E,w)break e}else i.head&&(i.head.comment=null);i.mode=9;case 9:if(512&i.flags){for(;y<16;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}if(v!==(65535&i.check)){e.msg="header crc mismatch",i.mode=30;break}y=v=0}i.head&&(i.head.hcrc=i.flags>>9&1,i.head.done=!0),e.adler=i.check=0,i.mode=12;break;case 10:for(;y<32;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}e.adler=i.check=p(v),y=v=0,i.mode=11;case 11:if(0===i.havedict)return e.next_out=_,e.avail_out=g,e.next_in=f,e.avail_in=m,i.hold=v,i.bits=y,2;e.adler=i.check=1,i.mode=12;case 12:if(5===t||6===t)break e;case 13:if(i.last){v>>>=7&y,y-=7&y,i.mode=27;break}for(;y<3;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}switch(i.last=1&v,y-=1,3&(v>>>=1)){case 0:i.mode=14;break;case 1:if(T(i),i.mode=20,6!==t)break;v>>>=2,y-=2;break e;case 2:i.mode=17;break;case 3:e.msg="invalid block type",i.mode=30}v>>>=2,y-=2;break;case 14:for(v>>>=7&y,y-=7&y;y<32;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}if((65535&v)!=(v>>>16^65535)){e.msg="invalid stored block lengths",i.mode=30;break}if(i.length=65535&v,y=v=0,i.mode=15,6===t)break e;case 15:i.mode=16;case 16:if(E=i.length){if(m<E&&(E=m),g<E&&(E=g),0===E)break e;n.arraySet(d,u,f,E,_),m-=E,f+=E,g-=E,_+=E,i.length-=E;break}i.mode=12;break;case 17:for(;y<14;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}if(i.nlen=257+(31&v),v>>>=5,y-=5,i.ndist=1+(31&v),v>>>=5,y-=5,i.ncode=4+(15&v),v>>>=4,y-=4,286<i.nlen||30<i.ndist){e.msg="too many length or distance symbols",i.mode=30;break}i.have=0,i.mode=18;case 18:for(;i.have<i.ncode;){for(;y<3;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}i.lens[V[i.have++]]=7&v,v>>>=3,y-=3}for(;i.have<19;)i.lens[V[i.have++]]=0;if(i.lencode=i.lendyn,i.lenbits=7,F={bits:i.lenbits},N=a(0,i.lens,0,19,i.lencode,0,i.work,F),i.lenbits=F.bits,N){e.msg="invalid code lengths set",i.mode=30;break}i.have=0,i.mode=19;case 19:for(;i.have<i.nlen+i.ndist;){for(;R=(B=i.lencode[v&(1<<i.lenbits)-1])>>>16&255,M=65535&B,!((P=B>>>24)<=y);){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}if(M<16)v>>>=P,y-=P,i.lens[i.have++]=M;else{if(16===M){for(L=P+2;y<L;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}if(v>>>=P,y-=P,0===i.have){e.msg="invalid bit length repeat",i.mode=30;break}w=i.lens[i.have-1],E=3+(3&v),v>>>=2,y-=2}else if(17===M){for(L=P+3;y<L;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}y-=P,w=0,E=3+(7&(v>>>=P)),v>>>=3,y-=3}else{for(L=P+7;y<L;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}y-=P,w=0,E=11+(127&(v>>>=P)),v>>>=7,y-=7}if(i.have+E>i.nlen+i.ndist){e.msg="invalid bit length repeat",i.mode=30;break}for(;E--;)i.lens[i.have++]=w}}if(30===i.mode)break;if(0===i.lens[256]){e.msg="invalid code -- missing end-of-block",i.mode=30;break}if(i.lenbits=9,F={bits:i.lenbits},N=a(1,i.lens,0,i.nlen,i.lencode,0,i.work,F),i.lenbits=F.bits,N){e.msg="invalid literal/lengths set",i.mode=30;break}if(i.distbits=6,i.distcode=i.distdyn,F={bits:i.distbits},N=a(2,i.lens,i.nlen,i.ndist,i.distcode,0,i.work,F),i.distbits=F.bits,N){e.msg="invalid distances set",i.mode=30;break}if(i.mode=20,6===t)break e;case 20:i.mode=21;case 21:if(6<=m&&258<=g){e.next_out=_,e.avail_out=g,e.next_in=f,e.avail_in=m,i.hold=v,i.bits=y,o(e,b),_=e.next_out,d=e.output,g=e.avail_out,f=e.next_in,u=e.input,m=e.avail_in,v=i.hold,y=i.bits,12===i.mode&&(i.back=-1);break}for(i.back=0;R=(B=i.lencode[v&(1<<i.lenbits)-1])>>>16&255,M=65535&B,!((P=B>>>24)<=y);){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}if(R&&0==(240&R)){for(I=P,D=R,O=M;R=(B=i.lencode[O+((v&(1<<I+D)-1)>>I)])>>>16&255,M=65535&B,!(I+(P=B>>>24)<=y);){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}v>>>=I,y-=I,i.back+=I}if(v>>>=P,y-=P,i.back+=P,i.length=M,0===R){i.mode=26;break}if(32&R){i.back=-1,i.mode=12;break}if(64&R){e.msg="invalid literal/length code",i.mode=30;break}i.extra=15&R,i.mode=22;case 22:if(i.extra){for(L=i.extra;y<L;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}i.length+=v&(1<<i.extra)-1,v>>>=i.extra,y-=i.extra,i.back+=i.extra}i.was=i.length,i.mode=23;case 23:for(;R=(B=i.distcode[v&(1<<i.distbits)-1])>>>16&255,M=65535&B,!((P=B>>>24)<=y);){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}if(0==(240&R)){for(I=P,D=R,O=M;R=(B=i.distcode[O+((v&(1<<I+D)-1)>>I)])>>>16&255,M=65535&B,!(I+(P=B>>>24)<=y);){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}v>>>=I,y-=I,i.back+=I}if(v>>>=P,y-=P,i.back+=P,64&R){e.msg="invalid distance code",i.mode=30;break}i.offset=M,i.extra=15&R,i.mode=24;case 24:if(i.extra){for(L=i.extra;y<L;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}i.offset+=v&(1<<i.extra)-1,v>>>=i.extra,y-=i.extra,i.back+=i.extra}if(i.offset>i.dmax){e.msg="invalid distance too far back",i.mode=30;break}i.mode=25;case 25:if(0===g)break e;if(E=b-g,i.offset>E){if((E=i.offset-E)>i.whave&&i.sane){e.msg="invalid distance too far back",i.mode=30;break}C=E>i.wnext?(E-=i.wnext,i.wsize-E):i.wnext-E,E>i.length&&(E=i.length),A=i.window}else A=d,C=_-i.offset,E=i.length;for(g<E&&(E=g),g-=E,i.length-=E;d[_++]=A[C++],--E;);0===i.length&&(i.mode=21);break;case 26:if(0===g)break e;d[_++]=i.length,g--,i.mode=21;break;case 27:if(i.wrap){for(;y<32;){if(0===m)break e;m--,v|=u[f++]<<y,y+=8}if(b-=g,e.total_out+=b,i.total+=b,b&&(e.adler=i.check=i.flags?r(i.check,d,b,_-b):s(i.check,d,b,_-b)),b=g,(i.flags?v:p(v))!==i.check){e.msg="incorrect data check",i.mode=30;break}y=v=0}i.mode=28;case 28:if(i.wrap&&i.flags){for(;y<32;){if(0===m)break e;m--,v+=u[f++]<<y,y+=8}if(v!==(4294967295&i.total)){e.msg="incorrect length check",i.mode=30;break}y=v=0}i.mode=29;case 29:N=1;break e;case 30:N=-3;break e;case 31:return-4;default:return h}return e.next_out=_,e.avail_out=g,e.next_in=f,e.avail_in=m,i.hold=v,i.bits=y,(i.wsize||b!==e.avail_out&&i.mode<30&&(i.mode<27||4!==t))&&S(e,e.output,e.next_out,b-e.avail_out)?(i.mode=31,-4):(x-=e.avail_in,b-=e.avail_out,e.total_in+=x,e.total_out+=b,i.total+=b,i.wrap&&b&&(e.adler=i.check=i.flags?r(i.check,d,b,e.next_out-b):s(i.check,d,b,e.next_out-b)),e.data_type=i.bits+(i.last?64:0)+(12===i.mode?128:0)+(20===i.mode||15===i.mode?256:0),(0==x&&0===b||4===t)&&N===l&&(N=-5),N)},i.inflateEnd=function(e){if(!e||!e.state)return h;var t=e.state;return t.window&&(t.window=null),e.state=null,l},i.inflateGetHeader=function(e,t){var i;return e&&e.state?0==(2&(i=e.state).wrap)?h:((i.head=t).done=!1,l):h},i.inflateSetDictionary=function(e,t){var i,n=t.length;return e&&e.state?0!==(i=e.state).wrap&&11!==i.mode?h:11===i.mode&&s(1,t,n,0)!==i.check?-3:S(e,t,n,n)?(i.mode=31,-4):(i.havedict=1,l):h},i.inflateInfo="pako inflate (from Nodeca project)"},{"../utils/common":41,"./adler32":43,"./crc32":45,"./inffast":48,"./inftrees":50}],50:[function(e,t,i){var n=e("../utils/common"),s=[3,4,5,6,7,8,9,10,11,13,15,17,19,23,27,31,35,43,51,59,67,83,99,115,131,163,195,227,258,0,0],r=[16,16,16,16,16,16,16,16,17,17,17,17,18,18,18,18,19,19,19,19,20,20,20,20,21,21,21,21,16,72,78],o=[1,2,3,4,5,7,9,13,17,25,33,49,65,97,129,193,257,385,513,769,1025,1537,2049,3073,4097,6145,8193,12289,16385,24577,0,0],a=[16,16,16,16,17,17,18,18,19,19,20,20,21,21,22,22,23,23,24,24,25,25,26,26,27,27,28,28,29,29,64,64];t.exports=function(e,t,i,l,h,c,u,d){var p,f,_,m,g,v,y,x,b,T=d.bits,S=0,E=0,C=0,A=0,P=0,R=0,M=0,I=0,D=0,O=0,w=null,N=0,F=new n.Buf16(16),L=new n.Buf16(16),B=null,U=0;for(S=0;S<=15;S++)F[S]=0;for(E=0;E<l;E++)F[t[i+E]]++;for(P=T,A=15;1<=A&&0===F[A];A--);if(A<P&&(P=A),0===A)return h[c++]=20971520,h[c++]=20971520,d.bits=1,0;for(C=1;C<A&&0===F[C];C++);for(P<C&&(P=C),S=I=1;S<=15;S++)if(I<<=1,(I-=F[S])<0)return-1;if(0<I&&(0===e||1!==A))return-1;for(L[1]=0,S=1;S<15;S++)L[S+1]=L[S]+F[S];for(E=0;E<l;E++)0!==t[i+E]&&(u[L[t[i+E]]++]=E);if(v=0===e?(w=B=u,19):1===e?(w=s,N-=257,B=r,U-=257,256):(w=o,B=a,-1),S=C,g=c,M=E=O=0,_=-1,m=(D=1<<(R=P))-1,1===e&&852<D||2===e&&592<D)return 1;for(;;){for(y=S-M,b=u[E]<v?(x=0,u[E]):u[E]>v?(x=B[U+u[E]],w[N+u[E]]):(x=96,0),p=1<<S-M,C=f=1<<R;h[g+(O>>M)+(f-=p)]=y<<24|x<<16|b|0,0!==f;);for(p=1<<S-1;O&p;)p>>=1;if(0!==p?(O&=p-1,O+=p):O=0,E++,0==--F[S]){if(S===A)break;S=t[i+u[E]]}if(P<S&&(O&m)!==_){for(0===M&&(M=P),g+=C,I=1<<(R=S-M);R+M<A&&!((I-=F[R+M])<=0);)R++,I<<=1;if(D+=1<<R,1===e&&852<D||2===e&&592<D)return 1;h[_=O&m]=P<<24|R<<16|g-c|0}}return 0!==O&&(h[g+O]=S-M<<24|64<<16|0),d.bits=P,0}},{"../utils/common":41}],51:[function(e,t,i){t.exports={2:"need dictionary",1:"stream end",0:"","-1":"file error","-2":"stream error","-3":"data error","-4":"insufficient memory","-5":"buffer error","-6":"incompatible version"}},{}],52:[function(e,t,i){var n=e("../utils/common");function s(e){for(var t=e.length;0<=--t;)e[t]=0}var r=256,o=286,a=30,l=15,h=16,c=[0,0,0,0,0,0,0,0,1,1,1,1,2,2,2,2,3,3,3,3,4,4,4,4,5,5,5,5,0],u=[0,0,0,0,1,1,2,2,3,3,4,4,5,5,6,6,7,7,8,8,9,9,10,10,11,11,12,12,13,13],d=[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2,3,7],p=[16,17,18,0,8,7,9,6,10,5,11,4,12,3,13,2,14,1,15],f=new Array(576);s(f);var _=new Array(60);s(_);var m=new Array(512);s(m);var g=new Array(256);s(g);var v=new Array(29);s(v);var y,x,b,T=new Array(a);function S(e,t,i,n,s){this.static_tree=e,this.extra_bits=t,this.extra_base=i,this.elems=n,this.max_length=s,this.has_stree=e&&e.length}function E(e,t){this.dyn_tree=e,this.max_code=0,this.stat_desc=t}function C(e){return e<256?m[e]:m[256+(e>>>7)]}function A(e,t){e.pending_buf[e.pending++]=255&t,e.pending_buf[e.pending++]=t>>>8&255}function P(e,t,i){e.bi_valid>h-i?(e.bi_buf|=t<<e.bi_valid&65535,A(e,e.bi_buf),e.bi_buf=t>>h-e.bi_valid,e.bi_valid+=i-h):(e.bi_buf|=t<<e.bi_valid&65535,e.bi_valid+=i)}function R(e,t,i){P(e,i[2*t],i[2*t+1])}function M(e,t){for(var i=0;i|=1&e,e>>>=1,i<<=1,0<--t;);return i>>>1}function I(e,t,i){var n,s,r=new Array(l+1),o=0;for(n=1;n<=l;n++)r[n]=o=o+i[n-1]<<1;for(s=0;s<=t;s++){var a=e[2*s+1];0!==a&&(e[2*s]=M(r[a]++,a))}}function D(e){var t;for(t=0;t<o;t++)e.dyn_ltree[2*t]=0;for(t=0;t<a;t++)e.dyn_dtree[2*t]=0;for(t=0;t<19;t++)e.bl_tree[2*t]=0;e.dyn_ltree[512]=1,e.opt_len=e.static_len=0,e.last_lit=e.matches=0}function O(e){8<e.bi_valid?A(e,e.bi_buf):0<e.bi_valid&&(e.pending_buf[e.pending++]=e.bi_buf),e.bi_buf=0,e.bi_valid=0}function w(e,t,i,n){var s=2*t,r=2*i;return e[s]<e[r]||e[s]===e[r]&&n[t]<=n[i]}function N(e,t,i){for(var n=e.heap[i],s=i<<1;s<=e.heap_len&&(s<e.heap_len&&w(t,e.heap[s+1],e.heap[s],e.depth)&&s++,!w(t,n,e.heap[s],e.depth));)e.heap[i]=e.heap[s],i=s,s<<=1;e.heap[i]=n}function F(e,t,i){var n,s,o,a,l=0;if(0!==e.last_lit)for(;n=e.pending_buf[e.d_buf+2*l]<<8|e.pending_buf[e.d_buf+2*l+1],s=e.pending_buf[e.l_buf+l],l++,0===n?R(e,s,t):(R(e,(o=g[s])+r+1,t),0!==(a=c[o])&&P(e,s-=v[o],a),R(e,o=C(--n),i),0!==(a=u[o])&&P(e,n-=T[o],a)),l<e.last_lit;);R(e,256,t)}function L(e,t){var i,n,s,r=t.dyn_tree,o=t.stat_desc.static_tree,a=t.stat_desc.has_stree,h=t.stat_desc.elems,c=-1;for(e.heap_len=0,e.heap_max=573,i=0;i<h;i++)0!==r[2*i]?(e.heap[++e.heap_len]=c=i,e.depth[i]=0):r[2*i+1]=0;for(;e.heap_len<2;)r[2*(s=e.heap[++e.heap_len]=c<2?++c:0)]=1,e.depth[s]=0,e.opt_len--,a&&(e.static_len-=o[2*s+1]);for(t.max_code=c,i=e.heap_len>>1;1<=i;i--)N(e,r,i);for(s=h;i=e.heap[1],e.heap[1]=e.heap[e.heap_len--],N(e,r,1),n=e.heap[1],e.heap[--e.heap_max]=i,e.heap[--e.heap_max]=n,r[2*s]=r[2*i]+r[2*n],e.depth[s]=(e.depth[i]>=e.depth[n]?e.depth[i]:e.depth[n])+1,r[2*i+1]=r[2*n+1]=s,e.heap[1]=s++,N(e,r,1),2<=e.heap_len;);e.heap[--e.heap_max]=e.heap[1],function(e,t){var i,n,s,r,o,a,h=t.dyn_tree,c=t.max_code,u=t.stat_desc.static_tree,d=t.stat_desc.has_stree,p=t.stat_desc.extra_bits,f=t.stat_desc.extra_base,_=t.stat_desc.max_length,m=0;for(r=0;r<=l;r++)e.bl_count[r]=0;for(h[2*e.heap[e.heap_max]+1]=0,i=e.heap_max+1;i<573;i++)_<(r=h[2*h[2*(n=e.heap[i])+1]+1]+1)&&(r=_,m++),h[2*n+1]=r,c<n||(e.bl_count[r]++,o=0,f<=n&&(o=p[n-f]),a=h[2*n],e.opt_len+=a*(r+o),d&&(e.static_len+=a*(u[2*n+1]+o)));if(0!==m){do{for(r=_-1;0===e.bl_count[r];)r--;e.bl_count[r]--,e.bl_count[r+1]+=2,e.bl_count[_]--,m-=2}while(0<m);for(r=_;0!==r;r--)for(n=e.bl_count[r];0!==n;)c<(s=e.heap[--i])||(h[2*s+1]!==r&&(e.opt_len+=(r-h[2*s+1])*h[2*s],h[2*s+1]=r),n--)}}(e,t),I(r,c,e.bl_count)}function B(e,t,i){var n,s,r=-1,o=t[1],a=0,l=7,h=4;for(0===o&&(l=138,h=3),t[2*(i+1)+1]=65535,n=0;n<=i;n++)s=o,o=t[2*(n+1)+1],++a<l&&s===o||(a<h?e.bl_tree[2*s]+=a:0!==s?(s!==r&&e.bl_tree[2*s]++,e.bl_tree[32]++):a<=10?e.bl_tree[34]++:e.bl_tree[36]++,r=s,h=(a=0)===o?(l=138,3):s===o?(l=6,3):(l=7,4))}function U(e,t,i){var n,s,r=-1,o=t[1],a=0,l=7,h=4;for(0===o&&(l=138,h=3),n=0;n<=i;n++)if(s=o,o=t[2*(n+1)+1],!(++a<l&&s===o)){if(a<h)for(;R(e,s,e.bl_tree),0!=--a;);else 0!==s?(s!==r&&(R(e,s,e.bl_tree),a--),R(e,16,e.bl_tree),P(e,a-3,2)):a<=10?(R(e,17,e.bl_tree),P(e,a-3,3)):(R(e,18,e.bl_tree),P(e,a-11,7));r=s,h=(a=0)===o?(l=138,3):s===o?(l=6,3):(l=7,4)}}s(T);var V=!1;function k(e,t,i,s){P(e,0+(s?1:0),3),function(e,t,i,s){O(e),A(e,i),A(e,~i),n.arraySet(e.pending_buf,e.window,t,i,e.pending),e.pending+=i}(e,t,i)}i._tr_init=function(e){V||(function(){var e,t,i,n,s,r=new Array(l+1);for(n=i=0;n<28;n++)for(v[n]=i,e=0;e<1<<c[n];e++)g[i++]=n;for(g[i-1]=n,n=s=0;n<16;n++)for(T[n]=s,e=0;e<1<<u[n];e++)m[s++]=n;for(s>>=7;n<a;n++)for(T[n]=s<<7,e=0;e<1<<u[n]-7;e++)m[256+s++]=n;for(t=0;t<=l;t++)r[t]=0;for(e=0;e<=143;)f[2*e+1]=8,e++,r[8]++;for(;e<=255;)f[2*e+1]=9,e++,r[9]++;for(;e<=279;)f[2*e+1]=7,e++,r[7]++;for(;e<=287;)f[2*e+1]=8,e++,r[8]++;for(I(f,287,r),e=0;e<a;e++)_[2*e+1]=5,_[2*e]=M(e,5);y=new S(f,c,257,o,l),x=new S(_,u,0,a,l),b=new S(new Array(0),d,0,19,7)}(),V=!0),e.l_desc=new E(e.dyn_ltree,y),e.d_desc=new E(e.dyn_dtree,x),e.bl_desc=new E(e.bl_tree,b),e.bi_buf=0,e.bi_valid=0,D(e)},i._tr_stored_block=k,i._tr_flush_block=function(e,t,i,n){var s,o,a=0;0<e.level?(2===e.strm.data_type&&(e.strm.data_type=function(e){var t,i=4093624447;for(t=0;t<=31;t++,i>>>=1)if(1&i&&0!==e.dyn_ltree[2*t])return 0;if(0!==e.dyn_ltree[18]||0!==e.dyn_ltree[20]||0!==e.dyn_ltree[26])return 1;for(t=32;t<r;t++)if(0!==e.dyn_ltree[2*t])return 1;return 0}(e)),L(e,e.l_desc),L(e,e.d_desc),a=function(e){var t;for(B(e,e.dyn_ltree,e.l_desc.max_code),B(e,e.dyn_dtree,e.d_desc.max_code),L(e,e.bl_desc),t=18;3<=t&&0===e.bl_tree[2*p[t]+1];t--);return e.opt_len+=3*(t+1)+5+5+4,t}(e),s=e.opt_len+3+7>>>3,(o=e.static_len+3+7>>>3)<=s&&(s=o)):s=o=i+5,i+4<=s&&-1!==t?k(e,t,i,n):4===e.strategy||o===s?(P(e,2+(n?1:0),3),F(e,f,_)):(P(e,4+(n?1:0),3),function(e,t,i,n){var s;for(P(e,t-257,5),P(e,i-1,5),P(e,n-4,4),s=0;s<n;s++)P(e,e.bl_tree[2*p[s]+1],3);U(e,e.dyn_ltree,t-1),U(e,e.dyn_dtree,i-1)}(e,e.l_desc.max_code+1,e.d_desc.max_code+1,a+1),F(e,e.dyn_ltree,e.dyn_dtree)),D(e),n&&O(e)},i._tr_tally=function(e,t,i){return e.pending_buf[e.d_buf+2*e.last_lit]=t>>>8&255,e.pending_buf[e.d_buf+2*e.last_lit+1]=255&t,e.pending_buf[e.l_buf+e.last_lit]=255&i,e.last_lit++,0===t?e.dyn_ltree[2*i]++:(e.matches++,t--,e.dyn_ltree[2*(g[i]+r+1)]++,e.dyn_dtree[2*C(t)]++),e.last_lit===e.lit_bufsize-1},i._tr_align=function(e){P(e,2,3),R(e,256,f),function(e){16===e.bi_valid?(A(e,e.bi_buf),e.bi_buf=0,e.bi_valid=0):8<=e.bi_valid&&(e.pending_buf[e.pending++]=255&e.bi_buf,e.bi_buf>>=8,e.bi_valid-=8)}(e)}},{"../utils/common":41}],53:[function(e,t,i){t.exports=function(){this.input=null,this.next_in=0,this.avail_in=0,this.total_in=0,this.output=null,this.next_out=0,this.avail_out=0,this.total_out=0,this.msg="",this.state=null,this.data_type=2,this.adler=0}},{}],54:[function(e,t,n){(function(e){!function(e,t){if(!e.setImmediate){var i,n,s,r,o=1,a={},l=!1,h=e.document,c=Object.getPrototypeOf&&Object.getPrototypeOf(e);c=c&&c.setTimeout?c:e,i="[object process]"==={}.toString.call(e.process)?function(e){process.nextTick((function(){d(e)}))}:function(){if(e.postMessage&&!e.importScripts){var t=!0,i=e.onmessage;return e.onmessage=function(){t=!1},e.postMessage("","*"),e.onmessage=i,t}}()?(r="setImmediate$"+Math.random()+"$",e.addEventListener?e.addEventListener("message",p,!1):e.attachEvent("onmessage",p),function(t){e.postMessage(r+t,"*")}):e.MessageChannel?((s=new MessageChannel).port1.onmessage=function(e){d(e.data)},function(e){s.port2.postMessage(e)}):h&&"onreadystatechange"in h.createElement("script")?(n=h.documentElement,function(e){var t=h.createElement("script");t.onreadystatechange=function(){d(e),t.onreadystatechange=null,n.removeChild(t),t=null},n.appendChild(t)}):function(e){setTimeout(d,0,e)},c.setImmediate=function(e){"function"!=typeof e&&(e=new Function(""+e));for(var t=new Array(arguments.length-1),n=0;n<t.length;n++)t[n]=arguments[n+1];var s={callback:e,args:t};return a[o]=s,i(o),o++},c.clearImmediate=u}function u(e){delete a[e]}function d(e){if(l)setTimeout(d,0,e);else{var i=a[e];if(i){l=!0;try{!function(e){var i=e.callback,n=e.args;switch(n.length){case 0:i();break;case 1:i(n[0]);break;case 2:i(n[0],n[1]);break;case 3:i(n[0],n[1],n[2]);break;default:i.apply(t,n)}}(i)}finally{u(e),l=!1}}}}function p(t){t.source===e&&"string"==typeof t.data&&0===t.data.indexOf(r)&&d(+t.data.slice(r.length))}}("undefined"==typeof self?void 0===e?this:e:self)}).call(this,void 0!==i.g?i.g:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}]},{},[10])(10)},6184:(e,t)=>{t.__esModule=!0,Array.prototype.find||Object.defineProperty(Array.prototype,"find",{value:function(e){if(null==this)throw new TypeError('"this" is null or not defined');var t=Object(this),i=t.length>>>0;if("function"!=typeof e)throw new TypeError("predicate must be a function");for(var n=arguments[1],s=0;s<i;){var r=t[s];if(e.call(n,r,s,t))return r;s++}},configurable:!0,writable:!0})},6068:(e,t)=>{t.__esModule=!0,t.Polyfill=t.LightMapImpl=void 0;var i=function(){function e(){this.record=[]}return e.prototype.has=function(e){return this.record.map((function(e){return e[0]})).indexOf(e)>=0},e.prototype.get=function(e){var t=this.record.filter((function(t){return t[0]===e}))[0];if(void 0!==t)return t[1]},e.prototype.set=function(e,t){var i=this.record.filter((function(t){return t[0]===e}))[0];return void 0===i?this.record.push([e,t]):i[1]=t,this},e.prototype.delete=function(e){var t=this.record.map((function(e){return e[0]})).indexOf(e);return!(t<0||(this.record.splice(t,1),0))},e.prototype.keys=function(){return this.record.map((function(e){return e[0]}))},e}();t.LightMapImpl=i,t.Polyfill="undefined"!=typeof Map?Map:i},7244:(e,t)=>{t.__esModule=!0,Object.is||(Object.is=function(e,t){return e===t?0!==e||1/e==1/t:e!=e&&t!=t})},3876:(e,t,i)=>{t.__esModule=!0,t.Polyfill=t.LightSetImpl=void 0;var n=i(6068),s=function(){function e(e){if(this.map=new n.Polyfill,void 0!==e)for(var t=0,i=e;t<i.length;t++){var s=i[t];this.add(s)}}return e.prototype.has=function(e){return this.map.has(e)},e.prototype.add=function(e){return this.map.set(e,!0),this},e.prototype.values=function(){return this.map.keys()},e.prototype.delete=function(e){return this.map.delete(e)},e}();t.LightSetImpl=s,t.Polyfill="undefined"!=typeof Set?Set:s},9589:(e,t,i)=>{t.__esModule=!0,t.Polyfill=void 0;var n=i(6068);t.Polyfill="undefined"!=typeof WeakMap?WeakMap:n.Polyfill},7126:function(e){var t;t=function(){return function(e){var t={};function i(n){if(t[n])return t[n].exports;var s=t[n]={i:n,l:!1,exports:{}};return e[n].call(s.exports,s,s.exports,i),s.l=!0,s.exports}return i.m=e,i.c=t,i.i=function(e){return e},i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:n})},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=6)}([function(e,t,i){Object.defineProperty(t,"__esModule",{value:!0}),t.css=t.deepExtend=t.animationEndEvents=void 0;var n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};t.inArray=function(e,t,i){var n=void 0;if(i){for(n in t)if(t.hasOwnProperty(n)&&t[n]===e)return!0}else for(n in t)if(t.hasOwnProperty(n)&&t[n]===e)return!0;return!1},t.stopPropagation=function(e){void 0!==(e=e||window.event).stopPropagation?e.stopPropagation():e.cancelBubble=!0},t.generateID=function(){return"noty_"+(arguments.length>0&&void 0!==arguments[0]?arguments[0]:"")+"_"+"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,(function(e){var t=16*Math.random()|0;return("x"===e?t:3&t|8).toString(16)}))},t.outerHeight=function(e){var t=e.offsetHeight,i=window.getComputedStyle(e);return t+(parseInt(i.marginTop)+parseInt(i.marginBottom))},t.addListener=r,t.hasClass=o,t.addClass=function(e,t){var i=l(e),n=i+t;o(i,t)||(e.className=n.substring(1))},t.removeClass=function(e,t){var i=l(e),n=void 0;o(e,t)&&(n=i.replace(" "+t+" "," "),e.className=n.substring(1,n.length-1))},t.remove=a,t.classList=l,t.visibilityChangeFlow=function(){var e=void 0,t=void 0;function i(){s.PageHidden?setTimeout((function(){Object.keys(s.Store).forEach((function(e){s.Store.hasOwnProperty(e)&&s.Store[e].options.visibilityControl&&s.Store[e].stop()}))}),100):setTimeout((function(){Object.keys(s.Store).forEach((function(e){s.Store.hasOwnProperty(e)&&s.Store[e].options.visibilityControl&&s.Store[e].resume()})),s.queueRenderAll()}),100)}void 0!==document.hidden?(e="hidden",t="visibilitychange"):void 0!==document.msHidden?(e="msHidden",t="msvisibilitychange"):void 0!==document.webkitHidden&&(e="webkitHidden",t="webkitvisibilitychange"),t&&r(document,t,(function(){s.PageHidden=document[e],i()})),r(window,"blur",(function(){s.PageHidden=!0,i()})),r(window,"focus",(function(){s.PageHidden=!1,i()}))},t.createAudioElements=function(e){if(e.hasSound){var t=document.createElement("audio");e.options.sounds.sources.forEach((function(e){var i=document.createElement("source");i.src=e,i.type="audio/"+e.match(/\.([^.]+)$/)[1],t.appendChild(i)})),e.barDom?e.barDom.appendChild(t):document.querySelector("body").appendChild(t),t.volume=e.options.sounds.volume,e.soundPlayed||(t.play(),e.soundPlayed=!0),t.onended=function(){a(t)}}};var s=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t.default=e,t}(i(1));function r(e,t,i){var n=arguments.length>3&&void 0!==arguments[3]&&arguments[3];t=t.split(" ");for(var s=0;s<t.length;s++)document.addEventListener?e.addEventListener(t[s],i,n):document.attachEvent&&e.attachEvent("on"+t[s],i)}function o(e,t){return("string"==typeof e?e:l(e)).indexOf(" "+t+" ")>=0}function a(e){e.parentNode&&e.parentNode.removeChild(e)}function l(e){return(" "+(e&&e.className||"")+" ").replace(/\s+/gi," ")}t.animationEndEvents="webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend",t.deepExtend=function e(t){t=t||{};for(var i=1;i<arguments.length;i++){var s=arguments[i];if(s)for(var r in s)s.hasOwnProperty(r)&&(Array.isArray(s[r])?t[r]=s[r]:"object"===n(s[r])&&null!==s[r]?t[r]=e(t[r],s[r]):t[r]=s[r])}return t},t.css=function(){var e=["Webkit","O","Moz","ms"],t={};function i(i,n,s){n=function(i){return i=i.replace(/^-ms-/,"ms-").replace(/-([\da-z])/gi,(function(e,t){return t.toUpperCase()})),t[i]||(t[i]=function(t){var i=document.body.style;if(t in i)return t;for(var n=e.length,s=t.charAt(0).toUpperCase()+t.slice(1),r=void 0;n--;)if((r=e[n]+s)in i)return r;return t}(i))}(n),i.style[n]=s}return function(e,t){var n=arguments,s=void 0,r=void 0;if(2===n.length)for(s in t)t.hasOwnProperty(s)&&void 0!==(r=t[s])&&t.hasOwnProperty(s)&&i(e,s,r);else i(e,n[1],n[2])}}()},function(e,t,i){Object.defineProperty(t,"__esModule",{value:!0}),t.Defaults=t.Store=t.Queues=t.DefaultMaxVisible=t.docTitle=t.DocModalCount=t.PageHidden=void 0,t.getQueueCounts=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"global",t=0,i=a;return l.hasOwnProperty(e)&&(i=l[e].maxVisible,Object.keys(h).forEach((function(i){h[i].options.queue!==e||h[i].closed||t++}))),{current:t,maxVisible:i}},t.addToQueue=function(e){l.hasOwnProperty(e.options.queue)||(l[e.options.queue]={maxVisible:a,queue:[]}),l[e.options.queue].queue.push(e)},t.removeFromQueue=function(e){if(l.hasOwnProperty(e.options.queue)){var t=[];Object.keys(l[e.options.queue].queue).forEach((function(i){l[e.options.queue].queue[i].id!==e.id&&t.push(l[e.options.queue].queue[i])})),l[e.options.queue].queue=t}},t.queueRender=c,t.queueRenderAll=function(){Object.keys(l).forEach((function(e){c(e)}))},t.ghostFix=function(e){var t=n.generateID("ghost"),i=document.createElement("div");i.setAttribute("id",t),n.css(i,{height:n.outerHeight(e.barDom)+"px"}),e.barDom.insertAdjacentHTML("afterend",i.outerHTML),n.remove(e.barDom),i=document.getElementById(t),n.addClass(i,"noty_fix_effects_height"),n.addListener(i,n.animationEndEvents,(function(){n.remove(i)}))},t.build=function(e){!function(e){if(e.options.container)e.layoutDom=document.querySelector(e.options.container);else{var t="noty_layout__"+e.options.layout;e.layoutDom=document.querySelector("div#"+t),e.layoutDom||(e.layoutDom=document.createElement("div"),e.layoutDom.setAttribute("id",t),e.layoutDom.setAttribute("role","alert"),e.layoutDom.setAttribute("aria-live","polite"),n.addClass(e.layoutDom,"noty_layout"),document.querySelector("body").appendChild(e.layoutDom))}}(e);var t='<div class="noty_body">'+e.options.text+"</div>"+function(e){if(u(e)){var t=document.createElement("div");return n.addClass(t,"noty_buttons"),Object.keys(e.options.buttons).forEach((function(i){t.appendChild(e.options.buttons[i].dom)})),e.options.buttons.forEach((function(e){t.appendChild(e.dom)})),t.outerHTML}return""}(e)+'<div class="noty_progressbar"></div>';e.barDom=document.createElement("div"),e.barDom.setAttribute("id",e.id),n.addClass(e.barDom,"noty_bar noty_type__"+e.options.type+" noty_theme__"+e.options.theme),e.barDom.innerHTML=t,f(e,"onTemplate")},t.hasButtons=u,t.handleModal=function(e){var i,r;e.options.modal&&(0===s&&(i=document.querySelector("body"),r=document.createElement("div"),n.addClass(r,"noty_modal"),i.insertBefore(r,i.firstChild),n.addClass(r,"noty_modal_open"),n.addListener(r,n.animationEndEvents,(function(){n.removeClass(r,"noty_modal_open")}))),t.DocModalCount=s+=1)},t.handleModalClose=function(e){if(e.options.modal&&s>0&&(t.DocModalCount=s-=1,s<=0)){var i=document.querySelector(".noty_modal");i&&(n.removeClass(i,"noty_modal_open"),n.addClass(i,"noty_modal_close"),n.addListener(i,n.animationEndEvents,(function(){n.remove(i)})))}},t.queueClose=d,t.dequeueClose=p,t.fire=f,t.openFlow=function(e){f(e,"afterShow"),d(e),n.addListener(e.barDom,"mouseenter",(function(){p(e)})),n.addListener(e.barDom,"mouseleave",(function(){d(e)}))},t.closeFlow=function(e){delete h[e.id],e.closing=!1,f(e,"afterClose"),n.remove(e.barDom),0!==e.layoutDom.querySelectorAll(".noty_bar").length||e.options.container||n.remove(e.layoutDom),(n.inArray("docVisible",e.options.titleCount.conditions)||n.inArray("docHidden",e.options.titleCount.conditions))&&o.decrement(),c(e.options.queue)};var n=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t.default=e,t}(i(0));t.PageHidden=!1;var s=t.DocModalCount=0,r={originalTitle:null,count:0,changed:!1,timer:-1},o=t.docTitle={increment:function(){r.count++,o._update()},decrement:function(){r.count--,r.count<=0?o._clear():o._update()},_update:function(){var e=document.title;r.changed?document.title="("+r.count+") "+r.originalTitle:(r.originalTitle=e,document.title="("+r.count+") "+e,r.changed=!0)},_clear:function(){r.changed&&(r.count=0,document.title=r.originalTitle,r.changed=!1)}},a=t.DefaultMaxVisible=5,l=t.Queues={global:{maxVisible:a,queue:[]}},h=t.Store={};function c(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"global";if(l.hasOwnProperty(e)){var t=l[e].queue.shift();t&&t.show()}}function u(e){return!(!e.options.buttons||!Object.keys(e.options.buttons).length)}function d(e){e.options.timeout&&(e.options.progressBar&&e.progressDom&&n.css(e.progressDom,{transition:"width "+e.options.timeout+"ms linear",width:"0%"}),clearTimeout(e.closeTimer),e.closeTimer=setTimeout((function(){e.close()}),e.options.timeout))}function p(e){e.options.timeout&&e.closeTimer&&(clearTimeout(e.closeTimer),e.closeTimer=-1,e.options.progressBar&&e.progressDom&&n.css(e.progressDom,{transition:"width 0ms linear",width:"100%"}))}function f(e,t){e.listeners.hasOwnProperty(t)&&e.listeners[t].forEach((function(t){"function"==typeof t&&t.apply(e)}))}t.Defaults={type:"alert",layout:"topRight",theme:"mint",text:"",timeout:!1,progressBar:!0,closeWith:["click"],animation:{open:"noty_effects_open",close:"noty_effects_close"},id:!1,force:!1,killer:!1,queue:"global",container:!1,buttons:[],callbacks:{beforeShow:null,onShow:null,afterShow:null,onClose:null,afterClose:null,onClick:null,onHover:null,onTemplate:null},sounds:{sources:[],volume:1,conditions:[]},titleCount:{conditions:[]},modal:!1,visibilityControl:!1}},function(e,t,i){Object.defineProperty(t,"__esModule",{value:!0}),t.NotyButton=void 0;var n=function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t.default=e,t}(i(0));t.NotyButton=function e(t,i,s){var r=this,o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.dom=document.createElement("button"),this.dom.innerHTML=t,this.id=o.id=o.id||n.generateID("button"),this.cb=s,Object.keys(o).forEach((function(e){r.dom.setAttribute(e,o[e])})),n.addClass(this.dom,i||"noty_btn"),this}},function(e,t,i){Object.defineProperty(t,"__esModule",{value:!0});var n=function(){function e(e,t){for(var i=0;i<t.length;i++){var n=t[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,i,n){return i&&e(t.prototype,i),n&&e(t,n),t}}();t.Push=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"/service-worker.js";return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.subData={},this.workerPath=t,this.listeners={onPermissionGranted:[],onPermissionDenied:[],onSubscriptionSuccess:[],onSubscriptionCancel:[],onWorkerError:[],onWorkerSuccess:[],onWorkerNotSupported:[]},this}return n(e,[{key:"on",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:function(){};return"function"==typeof t&&this.listeners.hasOwnProperty(e)&&this.listeners[e].push(t),this}},{key:"fire",value:function(e){var t=this,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[];this.listeners.hasOwnProperty(e)&&this.listeners[e].forEach((function(e){"function"==typeof e&&e.apply(t,i)}))}},{key:"create",value:function(){console.log("NOT IMPLEMENTED YET")}},{key:"isSupported",value:function(){var e=!1;try{e=window.Notification||window.webkitNotifications||navigator.mozNotification||window.external&&void 0!==window.external.msIsSiteMode()}catch(e){}return e}},{key:"getPermissionStatus",value:function(){var e="default";if(window.Notification&&window.Notification.permissionLevel)e=window.Notification.permissionLevel;else if(window.webkitNotifications&&window.webkitNotifications.checkPermission)switch(window.webkitNotifications.checkPermission()){case 1:e="default";break;case 0:e="granted";break;default:e="denied"}else window.Notification&&window.Notification.permission?e=window.Notification.permission:navigator.mozNotification?e="granted":window.external&&void 0!==window.external.msIsSiteMode()&&(e=window.external.msIsSiteMode()?"granted":"default");return e.toString().toLowerCase()}},{key:"getEndpoint",value:function(e){var t=e.endpoint,i=e.subscriptionId;return i&&-1===t.indexOf(i)&&(t+="/"+i),t}},{key:"isSWRegistered",value:function(){try{return"activated"===navigator.serviceWorker.controller.state}catch(e){return!1}}},{key:"unregisterWorker",value:function(){var e=this;"serviceWorker"in navigator&&navigator.serviceWorker.getRegistrations().then((function(t){var i=!0,n=!1,s=void 0;try{for(var r,o=t[Symbol.iterator]();!(i=(r=o.next()).done);i=!0)r.value.unregister(),e.fire("onSubscriptionCancel")}catch(e){n=!0,s=e}finally{try{!i&&o.return&&o.return()}finally{if(n)throw s}}}))}},{key:"requestSubscription",value:function(){var e=this,t=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],i=this,n=this.getPermissionStatus(),s=function(n){"granted"===n?(e.fire("onPermissionGranted"),"serviceWorker"in navigator?navigator.serviceWorker.register(e.workerPath).then((function(){navigator.serviceWorker.ready.then((function(e){i.fire("onWorkerSuccess"),e.pushManager.subscribe({userVisibleOnly:t}).then((function(e){var t=e.getKey("p256dh"),n=e.getKey("auth");i.subData={endpoint:i.getEndpoint(e),p256dh:t?window.btoa(String.fromCharCode.apply(null,new Uint8Array(t))):null,auth:n?window.btoa(String.fromCharCode.apply(null,new Uint8Array(n))):null},i.fire("onSubscriptionSuccess",[i.subData])})).catch((function(e){i.fire("onWorkerError",[e])}))}))})):i.fire("onWorkerNotSupported")):"denied"===n&&(e.fire("onPermissionDenied"),e.unregisterWorker())};"default"===n?window.Notification&&window.Notification.requestPermission?window.Notification.requestPermission(s):window.webkitNotifications&&window.webkitNotifications.checkPermission&&window.webkitNotifications.requestPermission(s):s(n)}}]),e}()},function(e,t,i){(function(t,n){var s;s=function(){function e(e){return"function"==typeof e}var s=Array.isArray?Array.isArray:function(e){return"[object Array]"===Object.prototype.toString.call(e)},r=0,o=void 0,a=void 0,l=function(e,t){_[r]=e,_[r+1]=t,2===(r+=2)&&(a?a(m):b())},h="undefined"!=typeof window?window:void 0,c=h||{},u=c.MutationObserver||c.WebKitMutationObserver,d="undefined"==typeof self&&void 0!==t&&"[object process]"==={}.toString.call(t),p="undefined"!=typeof Uint8ClampedArray&&"undefined"!=typeof importScripts&&"undefined"!=typeof MessageChannel;function f(){var e=setTimeout;return function(){return e(m,1)}}var _=new Array(1e3);function m(){for(var e=0;e<r;e+=2)(0,_[e])(_[e+1]),_[e]=void 0,_[e+1]=void 0;r=0}var g,v,y,x,b=void 0;function T(e,t){var i=arguments,n=this,s=new this.constructor(C);void 0===s[E]&&z(s);var r,o=n._state;return o?(r=i[o-1],l((function(){return k(o,s,r,n._result)}))):L(n,s,e,t),s}function S(e){if(e&&"object"==typeof e&&e.constructor===this)return e;var t=new this(C);return O(t,e),t}d?b=function(){return t.nextTick(m)}:u?(v=0,y=new u(m),x=document.createTextNode(""),y.observe(x,{characterData:!0}),b=function(){x.data=v=++v%2}):p?((g=new MessageChannel).port1.onmessage=m,b=function(){return g.port2.postMessage(0)}):b=void 0===h?function(){try{var e=i(9);return void 0!==(o=e.runOnLoop||e.runOnContext)?function(){o(m)}:f()}catch(e){return f()}}():f();var E=Math.random().toString(36).substring(16);function C(){}var A=void 0,P=1,R=2,M=new U;function I(e){try{return e.then}catch(e){return M.error=e,M}}function D(t,i,n){i.constructor===t.constructor&&n===T&&i.constructor.resolve===S?function(e,t){t._state===P?N(e,t._result):t._state===R?F(e,t._result):L(t,void 0,(function(t){return O(e,t)}),(function(t){return F(e,t)}))}(t,i):n===M?(F(t,M.error),M.error=null):void 0===n?N(t,i):e(n)?function(e,t,i){l((function(e){var n=!1,s=function(i,s,r,o){try{i.call(s,(function(i){n||(n=!0,t!==i?O(e,i):N(e,i))}),(function(t){n||(n=!0,F(e,t))}))}catch(e){return e}}(i,t,0,0,e._label);!n&&s&&(n=!0,F(e,s))}),e)}(t,i,n):N(t,i)}function O(e,t){var i,n;e===t?F(e,new TypeError("You cannot resolve a promise with itself")):(n=typeof(i=t),null===i||"object"!==n&&"function"!==n?N(e,t):D(e,t,I(t)))}function w(e){e._onerror&&e._onerror(e._result),B(e)}function N(e,t){e._state===A&&(e._result=t,e._state=P,0!==e._subscribers.length&&l(B,e))}function F(e,t){e._state===A&&(e._state=R,e._result=t,l(w,e))}function L(e,t,i,n){var s=e._subscribers,r=s.length;e._onerror=null,s[r]=t,s[r+P]=i,s[r+R]=n,0===r&&e._state&&l(B,e)}function B(e){var t=e._subscribers,i=e._state;if(0!==t.length){for(var n=void 0,s=void 0,r=e._result,o=0;o<t.length;o+=3)n=t[o],s=t[o+i],n?k(i,n,s,r):s(r);e._subscribers.length=0}}function U(){this.error=null}var V=new U;function k(t,i,n,s){var r=e(n),o=void 0,a=void 0,l=void 0,h=void 0;if(r){if(o=function(e,t){try{return e(t)}catch(e){return V.error=e,V}}(n,s),o===V?(h=!0,a=o.error,o.error=null):l=!0,i===o)return void F(i,new TypeError("A promises callback cannot return that same promise."))}else o=s,l=!0;i._state!==A||(r&&l?O(i,o):h?F(i,a):t===P?N(i,o):t===R&&F(i,o))}var G=0;function z(e){e[E]=G++,e._state=void 0,e._result=void 0,e._subscribers=[]}function W(e,t){this._instanceConstructor=e,this.promise=new e(C),this.promise[E]||z(this.promise),s(t)?(this.length=t.length,this._remaining=t.length,this._result=new Array(this.length),0===this.length?N(this.promise,this._result):(this.length=this.length||0,this._enumerate(t),0===this._remaining&&N(this.promise,this._result))):F(this.promise,new Error("Array Methods must be provided an Array"))}function H(e){this[E]=G++,this._result=this._state=void 0,this._subscribers=[],C!==e&&("function"!=typeof e&&function(){throw new TypeError("You must pass a resolver function as the first argument to the promise constructor")}(),this instanceof H?function(e,t){try{t((function(t){O(e,t)}),(function(t){F(e,t)}))}catch(t){F(e,t)}}(this,e):function(){throw new TypeError("Failed to construct 'Promise': Please use the 'new' operator, this object constructor cannot be called as a function.")}())}return W.prototype._enumerate=function(e){for(var t=0;this._state===A&&t<e.length;t++)this._eachEntry(e[t],t)},W.prototype._eachEntry=function(e,t){var i=this._instanceConstructor,n=i.resolve;if(n===S){var s=I(e);if(s===T&&e._state!==A)this._settledAt(e._state,t,e._result);else if("function"!=typeof s)this._remaining--,this._result[t]=e;else if(i===H){var r=new i(C);D(r,e,s),this._willSettleAt(r,t)}else this._willSettleAt(new i((function(t){return t(e)})),t)}else this._willSettleAt(n(e),t)},W.prototype._settledAt=function(e,t,i){var n=this.promise;n._state===A&&(this._remaining--,e===R?F(n,i):this._result[t]=i),0===this._remaining&&N(n,this._result)},W.prototype._willSettleAt=function(e,t){var i=this;L(e,void 0,(function(e){return i._settledAt(P,t,e)}),(function(e){return i._settledAt(R,t,e)}))},H.all=function(e){return new W(this,e).promise},H.race=function(e){var t=this;return s(e)?new t((function(i,n){for(var s=e.length,r=0;r<s;r++)t.resolve(e[r]).then(i,n)})):new t((function(e,t){return t(new TypeError("You must pass an array to race."))}))},H.resolve=S,H.reject=function(e){var t=new this(C);return F(t,e),t},H._setScheduler=function(e){a=e},H._setAsap=function(e){l=e},H._asap=l,H.prototype={constructor:H,then:T,catch:function(e){return this.then(null,e)}},H.polyfill=function(){var e=void 0;if(void 0!==n)e=n;else if("undefined"!=typeof self)e=self;else try{e=Function("return this")()}catch(e){throw new Error("polyfill failed because global object is unavailable in this environment")}var t=e.Promise;if(t){var i=null;try{i=Object.prototype.toString.call(t.resolve())}catch(e){}if("[object Promise]"===i&&!t.cast)return}e.Promise=H},H.Promise=H,H},e.exports=s()}).call(t,i(7),i(8))},function(e,t){},function(e,t,i){Object.defineProperty(t,"__esModule",{value:!0});var n=function(){function e(e,t){for(var i=0;i<t.length;i++){var n=t[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,i,n){return i&&e(t.prototype,i),n&&e(t,n),t}}();i(5);var s,r=(s=i(4))&&s.__esModule?s:{default:s},o=c(i(0)),a=c(i(1)),l=i(2),h=i(3);function c(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t.default=e,t}var u=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.options=o.deepExtend({},a.Defaults,t),a.Store[this.options.id]?a.Store[this.options.id]:(this.id=this.options.id||o.generateID("bar"),this.closeTimer=-1,this.barDom=null,this.layoutDom=null,this.progressDom=null,this.showing=!1,this.shown=!1,this.closed=!1,this.closing=!1,this.killable=this.options.timeout||this.options.closeWith.length>0,this.hasSound=this.options.sounds.sources.length>0,this.soundPlayed=!1,this.listeners={beforeShow:[],onShow:[],afterShow:[],onClose:[],afterClose:[],onClick:[],onHover:[],onTemplate:[]},this.promises={show:null,close:null},this.on("beforeShow",this.options.callbacks.beforeShow),this.on("onShow",this.options.callbacks.onShow),this.on("afterShow",this.options.callbacks.afterShow),this.on("onClose",this.options.callbacks.onClose),this.on("afterClose",this.options.callbacks.afterClose),this.on("onClick",this.options.callbacks.onClick),this.on("onHover",this.options.callbacks.onHover),this.on("onTemplate",this.options.callbacks.onTemplate),this)}return n(e,[{key:"on",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:function(){};return"function"==typeof t&&this.listeners.hasOwnProperty(e)&&this.listeners[e].push(t),this}},{key:"show",value:function(){var t=this;if(this.showing||this.shown)return this;!0===this.options.killer?e.closeAll():"string"==typeof this.options.killer&&e.closeAll(this.options.killer);var i=a.getQueueCounts(this.options.queue);if(i.current>=i.maxVisible||a.PageHidden&&this.options.visibilityControl)return a.addToQueue(this),a.PageHidden&&this.hasSound&&o.inArray("docHidden",this.options.sounds.conditions)&&o.createAudioElements(this),a.PageHidden&&o.inArray("docHidden",this.options.titleCount.conditions)&&a.docTitle.increment(),this;if(a.Store[this.id]=this,a.fire(this,"beforeShow"),this.showing=!0,this.closing)return this.showing=!1,this;if(a.build(this),a.handleModal(this),this.options.force?this.layoutDom.insertBefore(this.barDom,this.layoutDom.firstChild):this.layoutDom.appendChild(this.barDom),this.hasSound&&!this.soundPlayed&&o.inArray("docVisible",this.options.sounds.conditions)&&o.createAudioElements(this),o.inArray("docVisible",this.options.titleCount.conditions)&&a.docTitle.increment(),this.shown=!0,this.closed=!1,a.hasButtons(this)&&Object.keys(this.options.buttons).forEach((function(e){var i=t.barDom.querySelector("#"+t.options.buttons[e].id);o.addListener(i,"click",(function(i){o.stopPropagation(i),t.options.buttons[e].cb(t)}))})),this.progressDom=this.barDom.querySelector(".noty_progressbar"),o.inArray("click",this.options.closeWith)&&(o.addClass(this.barDom,"noty_close_with_click"),o.addListener(this.barDom,"click",(function(e){o.stopPropagation(e),a.fire(t,"onClick"),t.close()}),!1)),o.addListener(this.barDom,"mouseenter",(function(){a.fire(t,"onHover")}),!1),this.options.timeout&&o.addClass(this.barDom,"noty_has_timeout"),this.options.progressBar&&o.addClass(this.barDom,"noty_has_progressbar"),o.inArray("button",this.options.closeWith)){o.addClass(this.barDom,"noty_close_with_button");var n=document.createElement("div");o.addClass(n,"noty_close_button"),n.innerHTML="×",this.barDom.appendChild(n),o.addListener(n,"click",(function(e){o.stopPropagation(e),t.close()}),!1)}return a.fire(this,"onShow"),null===this.options.animation.open?this.promises.show=new r.default((function(e){e()})):"function"==typeof this.options.animation.open?this.promises.show=new r.default(this.options.animation.open.bind(this)):(o.addClass(this.barDom,this.options.animation.open),this.promises.show=new r.default((function(e){o.addListener(t.barDom,o.animationEndEvents,(function(){o.removeClass(t.barDom,t.options.animation.open),e()}))}))),this.promises.show.then((function(){var e=t;setTimeout((function(){a.openFlow(e)}),100)})),this}},{key:"stop",value:function(){return a.dequeueClose(this),this}},{key:"resume",value:function(){return a.queueClose(this),this}},{key:"setTimeout",value:function(e){function t(t){return e.apply(this,arguments)}return t.toString=function(){return e.toString()},t}((function(e){if(this.stop(),this.options.timeout=e,this.barDom){this.options.timeout?o.addClass(this.barDom,"noty_has_timeout"):o.removeClass(this.barDom,"noty_has_timeout");var t=this;setTimeout((function(){t.resume()}),100)}return this}))},{key:"setText",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return this.barDom&&(this.barDom.querySelector(".noty_body").innerHTML=e),t&&(this.options.text=e),this}},{key:"setType",value:function(e){var t=this,i=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return this.barDom&&(o.classList(this.barDom).split(" ").forEach((function(e){"noty_type__"===e.substring(0,11)&&o.removeClass(t.barDom,e)})),o.addClass(this.barDom,"noty_type__"+e)),i&&(this.options.type=e),this}},{key:"setTheme",value:function(e){var t=this,i=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return this.barDom&&(o.classList(this.barDom).split(" ").forEach((function(e){"noty_theme__"===e.substring(0,12)&&o.removeClass(t.barDom,e)})),o.addClass(this.barDom,"noty_theme__"+e)),i&&(this.options.theme=e),this}},{key:"close",value:function(){var e=this;return this.closed?this:this.shown?(a.fire(this,"onClose"),this.closing=!0,null===this.options.animation.close||!1===this.options.animation.close?this.promises.close=new r.default((function(e){e()})):"function"==typeof this.options.animation.close?this.promises.close=new r.default(this.options.animation.close.bind(this)):(o.addClass(this.barDom,this.options.animation.close),this.promises.close=new r.default((function(t){o.addListener(e.barDom,o.animationEndEvents,(function(){e.options.force?o.remove(e.barDom):a.ghostFix(e),t()}))}))),this.promises.close.then((function(){a.closeFlow(e),a.handleModalClose(e)})),this.closed=!0,this):(a.removeFromQueue(this),this)}}],[{key:"closeAll",value:function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return Object.keys(a.Store).forEach((function(t){e?a.Store[t].options.queue===e&&a.Store[t].killable&&a.Store[t].close():a.Store[t].killable&&a.Store[t].close()})),this}},{key:"clearQueue",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"global";return a.Queues.hasOwnProperty(e)&&(a.Queues[e].queue=[]),this}},{key:"overrideDefaults",value:function(e){return a.Defaults=o.deepExtend({},a.Defaults,e),this}},{key:"setMaxVisible",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:a.DefaultMaxVisible,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"global";return a.Queues.hasOwnProperty(t)||(a.Queues[t]={maxVisible:e,queue:[]}),a.Queues[t].maxVisible=e,this}},{key:"button",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,i=arguments[2],n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};return new l.NotyButton(e,t,i,n)}},{key:"version",value:function(){return"3.2.0-beta"}},{key:"Push",value:function(e){return new h.Push(e)}},{key:"Queues",get:function(){return a.Queues}},{key:"PageHidden",get:function(){return a.PageHidden}}]),e}();t.default=u,"undefined"!=typeof window&&o.visibilityChangeFlow(),e.exports=t.default},function(e,t){var i,n,s=e.exports={};function r(){throw new Error("setTimeout has not been defined")}function o(){throw new Error("clearTimeout has not been defined")}function a(e){if(i===setTimeout)return setTimeout(e,0);if((i===r||!i)&&setTimeout)return i=setTimeout,setTimeout(e,0);try{return i(e,0)}catch(t){try{return i.call(null,e,0)}catch(t){return i.call(this,e,0)}}}!function(){try{i="function"==typeof setTimeout?setTimeout:r}catch(e){i=r}try{n="function"==typeof clearTimeout?clearTimeout:o}catch(e){n=o}}();var l,h=[],c=!1,u=-1;function d(){c&&l&&(c=!1,l.length?h=l.concat(h):u=-1,h.length&&p())}function p(){if(!c){var e=a(d);c=!0;for(var t=h.length;t;){for(l=h,h=[];++u<t;)l&&l[u].run();u=-1,t=h.length}l=null,c=!1,function(e){if(n===clearTimeout)return clearTimeout(e);if((n===o||!n)&&clearTimeout)return n=clearTimeout,clearTimeout(e);try{return n(e)}catch(t){try{return n.call(null,e)}catch(t){return n.call(this,e)}}}(e)}}function f(e,t){this.fun=e,this.array=t}function _(){}s.nextTick=function(e){var t=new Array(arguments.length-1);if(arguments.length>1)for(var i=1;i<arguments.length;i++)t[i-1]=arguments[i];h.push(new f(e,t)),1!==h.length||c||a(p)},f.prototype.run=function(){this.fun.apply(null,this.array)},s.title="browser",s.browser=!0,s.env={},s.argv=[],s.version="",s.versions={},s.on=_,s.addListener=_,s.once=_,s.off=_,s.removeListener=_,s.removeAllListeners=_,s.emit=_,s.prependListener=_,s.prependOnceListener=_,s.listeners=function(e){return[]},s.binding=function(e){throw new Error("process.binding is not supported")},s.cwd=function(){return"/"},s.chdir=function(e){throw new Error("process.chdir is not supported")},s.umask=function(){return 0}},function(e,t){var i;i=function(){return this}();try{i=i||Function("return this")()||(0,eval)("this")}catch(e){"object"==typeof window&&(i=window)}e.exports=i},function(e,t){}])},e.exports=t()},14:function(e,t,i){var n=this&&this.__spreadArrays||function(){for(var e=0,t=0,i=arguments.length;t<i;t++)e+=arguments[t].length;var n=Array(e),s=0;for(t=0;t<i;t++)for(var r=arguments[t],o=0,a=r.length;o<a;o++,s++)n[s]=r[o];return n};t.__esModule=!0,t.buildMethodCb=t.buildCb=t.getPrComplete=t.isRunning=t.cancelAllQueuedCalls=t.getQueuedCallCount=t.buildMethod=t.build=t.createGroupRef=void 0;var s=i(9589),r=function(){function e(){this.queuedCalls=[],this.isRunning=!1,this.prComplete=Promise.resolve()}return e.prototype.cancelAllQueuedCalls=function(){var e;return this.queuedCalls.splice(0,e=this.queuedCalls.length),e},e}(),o={},a=new s.Polyfill;function l(e,t){var i=a.get(e);i||(i=new s.Polyfill,a.set(e,i));var n=i.get(t);return n||(n=new r,i.set(t,n)),n}function h(){return new Array(0)}t.createGroupRef=h,t.build=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];switch(e.length){case 1:return d(!0,h(),e[0]);case 2:return d(!0,e[0],e[1])}},t.buildMethod=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];switch(e.length){case 1:return d(!1,h(),e[0]);case 2:return d(!1,e[0],e[1])}},t.getQueuedCallCount=function(e,t){var i=u(e,t);return i?i.queuedCalls.length:0},t.cancelAllQueuedCalls=function(e,t){var i=u(e,t);return i?i.cancelAllQueuedCalls():0},t.isRunning=function(e,t){var i=u(e,t);return!!i&&i.isRunning},t.getPrComplete=function(e,t){var i=u(e,t);return i?i.prComplete:Promise.resolve()};var c=new s.Polyfill;function u(e,t){void 0===t&&(t=o);var i=c.get(e);if(!i)throw Error("Not a run exclusiveFunction");var n=a.get(t);if(n)return n.get(i)}function d(e,t,i){var n,s=function(){for(var s=this,r=[],o=0;o<arguments.length;o++)r[o]=arguments[o];if(!e){if(!(this instanceof Object))throw new Error("Run exclusive, <this> should be an object");n=l(this,t)}return new Promise((function(e,t){var o;n.prComplete=new Promise((function(e){return o=function(){return e()}}));var a=function(i){o(),n.isRunning=!1,n.queuedCalls.length&&n.queuedCalls.shift()(),"data"in i?e(i.data):t(i.reason)};(function e(){for(var t=this,s=[],r=0;r<arguments.length;r++)s[r]=arguments[r];if(n.isRunning)n.queuedCalls.push((function(){return e.apply(t,s)}));else{n.isRunning=!0;try{i.apply(this,s).then((function(e){return a({data:e})})).catch((function(e){return a({reason:e})}))}catch(e){a({reason:e})}}}).apply(s,r)}))};return e&&(n=l(o,t)),c.set(s,t),s}function p(e,t,i){var s,r=function(){for(var r=this,o=[],a=0;a<arguments.length;a++)o[a]=arguments[a];if(!e){if(!(this instanceof Object))throw new Error("Run exclusive, <this> should be an object");s=l(this,t)}var h,c=void 0;o.length&&"function"==typeof o[o.length-1]&&(c=o.pop()),s.prComplete=new Promise((function(e){return h=function(){return e()}}));var u=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];h(),s.isRunning=!1,s.queuedCalls.length&&s.queuedCalls.shift()(),c&&c.apply(r,e)};u.hasCallback=!!c,function e(){for(var t=this,r=[],o=0;o<arguments.length;o++)r[o]=arguments[o];if(s.isRunning)s.queuedCalls.push((function(){return e.apply(t,r)}));else{s.isRunning=!0;try{i.apply(this,n(r,[u]))}catch(e){throw e.message+=" ( This exception should not have been thrown, miss use of run-exclusive buildCb )",e}}}.apply(this,o)};return e&&(s=l(o,t)),c.set(r,t),r}t.buildCb=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];switch(e.length){case 1:return p(!0,h(),e[0]);case 2:return p(!0,e[0],e[1])}},t.buildMethodCb=function(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];switch(e.length){case 1:return p(!1,h(),e[0]);case 2:return p(!1,e[0],e[1])}}},7609:(e,t,i)=>{var n=i(7425).default;function s(){e.exports=s=function(){return t},e.exports.__esModule=!0,e.exports.default=e.exports;var t={},i=Object.prototype,r=i.hasOwnProperty,o=Object.defineProperty||function(e,t,i){e[t]=i.value},a="function"==typeof Symbol?Symbol:{},l=a.iterator||"@@iterator",h=a.asyncIterator||"@@asyncIterator",c=a.toStringTag||"@@toStringTag";function u(e,t,i){return Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}),e[t]}try{u({},"")}catch(e){u=function(e,t,i){return e[t]=i}}function d(e,t,i,n){var s=t&&t.prototype instanceof _?t:_,r=Object.create(s.prototype),a=new R(n||[]);return o(r,"_invoke",{value:E(e,i,a)}),r}function p(e,t,i){try{return{type:"normal",arg:e.call(t,i)}}catch(e){return{type:"throw",arg:e}}}t.wrap=d;var f={};function _(){}function m(){}function g(){}var v={};u(v,l,(function(){return this}));var y=Object.getPrototypeOf,x=y&&y(y(M([])));x&&x!==i&&r.call(x,l)&&(v=x);var b=g.prototype=_.prototype=Object.create(v);function T(e){["next","throw","return"].forEach((function(t){u(e,t,(function(e){return this._invoke(t,e)}))}))}function S(e,t){function i(s,o,a,l){var h=p(e[s],e,o);if("throw"!==h.type){var c=h.arg,u=c.value;return u&&"object"==n(u)&&r.call(u,"__await")?t.resolve(u.__await).then((function(e){i("next",e,a,l)}),(function(e){i("throw",e,a,l)})):t.resolve(u).then((function(e){c.value=e,a(c)}),(function(e){return i("throw",e,a,l)}))}l(h.arg)}var s;o(this,"_invoke",{value:function(e,n){function r(){return new t((function(t,s){i(e,n,t,s)}))}return s=s?s.then(r,r):r()}})}function E(e,t,i){var n="suspendedStart";return function(s,r){if("executing"===n)throw new Error("Generator is already running");if("completed"===n){if("throw"===s)throw r;return{value:void 0,done:!0}}for(i.method=s,i.arg=r;;){var o=i.delegate;if(o){var a=C(o,i);if(a){if(a===f)continue;return a}}if("next"===i.method)i.sent=i._sent=i.arg;else if("throw"===i.method){if("suspendedStart"===n)throw n="completed",i.arg;i.dispatchException(i.arg)}else"return"===i.method&&i.abrupt("return",i.arg);n="executing";var l=p(e,t,i);if("normal"===l.type){if(n=i.done?"completed":"suspendedYield",l.arg===f)continue;return{value:l.arg,done:i.done}}"throw"===l.type&&(n="completed",i.method="throw",i.arg=l.arg)}}}function C(e,t){var i=t.method,n=e.iterator[i];if(void 0===n)return t.delegate=null,"throw"===i&&e.iterator.return&&(t.method="return",t.arg=void 0,C(e,t),"throw"===t.method)||"return"!==i&&(t.method="throw",t.arg=new TypeError("The iterator does not provide a '"+i+"' method")),f;var s=p(n,e.iterator,t.arg);if("throw"===s.type)return t.method="throw",t.arg=s.arg,t.delegate=null,f;var r=s.arg;return r?r.done?(t[e.resultName]=r.value,t.next=e.nextLoc,"return"!==t.method&&(t.method="next",t.arg=void 0),t.delegate=null,f):r:(t.method="throw",t.arg=new TypeError("iterator result is not an object"),t.delegate=null,f)}function A(e){var t={tryLoc:e[0]};1 in e&&(t.catchLoc=e[1]),2 in e&&(t.finallyLoc=e[2],t.afterLoc=e[3]),this.tryEntries.push(t)}function P(e){var t=e.completion||{};t.type="normal",delete t.arg,e.completion=t}function R(e){this.tryEntries=[{tryLoc:"root"}],e.forEach(A,this),this.reset(!0)}function M(e){if(e){var t=e[l];if(t)return t.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var i=-1,n=function t(){for(;++i<e.length;)if(r.call(e,i))return t.value=e[i],t.done=!1,t;return t.value=void 0,t.done=!0,t};return n.next=n}}return{next:I}}function I(){return{value:void 0,done:!0}}return m.prototype=g,o(b,"constructor",{value:g,configurable:!0}),o(g,"constructor",{value:m,configurable:!0}),m.displayName=u(g,c,"GeneratorFunction"),t.isGeneratorFunction=function(e){var t="function"==typeof e&&e.constructor;return!!t&&(t===m||"GeneratorFunction"===(t.displayName||t.name))},t.mark=function(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,g):(e.__proto__=g,u(e,c,"GeneratorFunction")),e.prototype=Object.create(b),e},t.awrap=function(e){return{__await:e}},T(S.prototype),u(S.prototype,h,(function(){return this})),t.AsyncIterator=S,t.async=function(e,i,n,s,r){void 0===r&&(r=Promise);var o=new S(d(e,i,n,s),r);return t.isGeneratorFunction(i)?o:o.next().then((function(e){return e.done?e.value:o.next()}))},T(b),u(b,c,"Generator"),u(b,l,(function(){return this})),u(b,"toString",(function(){return"[object Generator]"})),t.keys=function(e){var t=Object(e),i=[];for(var n in t)i.push(n);return i.reverse(),function e(){for(;i.length;){var n=i.pop();if(n in t)return e.value=n,e.done=!1,e}return e.done=!0,e}},t.values=M,R.prototype={constructor:R,reset:function(e){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(P),!e)for(var t in this)"t"===t.charAt(0)&&r.call(this,t)&&!isNaN(+t.slice(1))&&(this[t]=void 0)},stop:function(){this.done=!0;var e=this.tryEntries[0].completion;if("throw"===e.type)throw e.arg;return this.rval},dispatchException:function(e){if(this.done)throw e;var t=this;function i(i,n){return o.type="throw",o.arg=e,t.next=i,n&&(t.method="next",t.arg=void 0),!!n}for(var n=this.tryEntries.length-1;n>=0;--n){var s=this.tryEntries[n],o=s.completion;if("root"===s.tryLoc)return i("end");if(s.tryLoc<=this.prev){var a=r.call(s,"catchLoc"),l=r.call(s,"finallyLoc");if(a&&l){if(this.prev<s.catchLoc)return i(s.catchLoc,!0);if(this.prev<s.finallyLoc)return i(s.finallyLoc)}else if(a){if(this.prev<s.catchLoc)return i(s.catchLoc,!0)}else{if(!l)throw new Error("try statement without catch or finally");if(this.prev<s.finallyLoc)return i(s.finallyLoc)}}}},abrupt:function(e,t){for(var i=this.tryEntries.length-1;i>=0;--i){var n=this.tryEntries[i];if(n.tryLoc<=this.prev&&r.call(n,"finallyLoc")&&this.prev<n.finallyLoc){var s=n;break}}s&&("break"===e||"continue"===e)&&s.tryLoc<=t&&t<=s.finallyLoc&&(s=null);var o=s?s.completion:{};return o.type=e,o.arg=t,s?(this.method="next",this.next=s.finallyLoc,f):this.complete(o)},complete:function(e,t){if("throw"===e.type)throw e.arg;return"break"===e.type||"continue"===e.type?this.next=e.arg:"return"===e.type?(this.rval=this.arg=e.arg,this.method="return",this.next="end"):"normal"===e.type&&t&&(this.next=t),f},finish:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var i=this.tryEntries[t];if(i.finallyLoc===e)return this.complete(i.completion,i.afterLoc),P(i),f}},catch:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var i=this.tryEntries[t];if(i.tryLoc===e){var n=i.completion;if("throw"===n.type){var s=n.arg;P(i)}return s}}throw new Error("illegal catch attempt")},delegateYield:function(e,t,i){return this.delegate={iterator:M(e),resultName:t,nextLoc:i},"next"===this.method&&(this.arg=void 0),f}},t}e.exports=s,e.exports.__esModule=!0,e.exports.default=e.exports},7425:e=>{function t(i){return e.exports=t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e.exports.__esModule=!0,e.exports.default=e.exports,t(i)}e.exports=t,e.exports.__esModule=!0,e.exports.default=e.exports},2841:(e,t,i)=>{var n=i(7609)();e.exports=n;try{regeneratorRuntime=n}catch(e){"object"==typeof globalThis?globalThis.regeneratorRuntime=n:Function("r","regeneratorRuntime = r")(n)}},1803:(e,t,i)=>{i.d(t,{O:()=>n});class n{constructor(){this.hoverCursor="",this.actions=new Array,this.isRecursive=!1}static get HasTriggers(){for(const e in n.Triggers)if(Object.prototype.hasOwnProperty.call(n.Triggers,e))return!0;return!1}static get HasPickTriggers(){for(const e in n.Triggers)if(Object.prototype.hasOwnProperty.call(n.Triggers,e)){const t=parseInt(e);if(t>=1&&t<=7)return!0}return!1}static HasSpecificTrigger(e){for(const t in n.Triggers)if(Object.prototype.hasOwnProperty.call(n.Triggers,t)&&parseInt(t)===e)return!0;return!1}}n.Triggers={}},2633:(e,t,i)=>{i.d(t,{V:()=>n});class n{constructor(e,t,i,n,s,r){this.source=e,this.pointerX=t,this.pointerY=i,this.meshUnderPointer=n,this.sourceEvent=s,this.additionalData=r}static CreateNew(e,t,i){const s=e.getScene();return new n(e,s.pointerX,s.pointerY,s.meshUnderPointer||e,t,i)}static CreateNewFromSprite(e,t,i,s){return new n(e,t.pointerX,t.pointerY,t.meshUnderPointer,i,s)}static CreateNewFromScene(e,t){return new n(null,e.pointerX,e.pointerY,e.meshUnderPointer,t)}static CreateNewFromPrimitive(e,t,i,s){return new n(e,t.x,t.y,null,i,s)}}},4676:(e,t,i)=>{i.d(t,{f:()=>f,u:()=>p});var n=i(4141),s=i(4649),r=i(1128),o=i(3956),a=i(2208),l=i(4173),h=i(2695),c=i(9257),u=i(9697),d=i(6662);class p{}class f{static _PrepareAnimation(e,t,i,r,o,a,l,h){let c;if(!isNaN(parseFloat(o))&&isFinite(o)?c=f.ANIMATIONTYPE_FLOAT:o instanceof n._f?c=f.ANIMATIONTYPE_QUATERNION:o instanceof n.P?c=f.ANIMATIONTYPE_VECTOR3:o instanceof n.FM?c=f.ANIMATIONTYPE_VECTOR2:o instanceof s.Wo?c=f.ANIMATIONTYPE_COLOR3:o instanceof s.HE?c=f.ANIMATIONTYPE_COLOR4:o instanceof u.$&&(c=f.ANIMATIONTYPE_SIZE),null==c)return null;const d=new f(e,t,i,c,l),p=[{frame:0,value:o},{frame:r,value:a}];return d.setKeys(p),void 0!==h&&d.setEasingFunction(h),d}static CreateAnimation(e,t,i,n){const s=new f(e+"Animation",e,i,t,f.ANIMATIONLOOPMODE_CONSTANT);return s.setEasingFunction(n),s}static CreateAndStartAnimation(e,t,i,n,s,r,o,a,l,h,c){const u=f._PrepareAnimation(e,i,n,s,r,o,a,l);return u?(t.getScene&&(c=t.getScene()),c?c.beginDirectAnimation(t,[u],0,s,1===u.loopMode,1,h):null):null}static CreateAndStartHierarchyAnimation(e,t,i,n,s,r,o,a,l,h,c){const u=f._PrepareAnimation(e,n,s,r,o,a,l,h);return u?t.getScene().beginDirectHierarchyAnimation(t,i,[u],0,r,1===u.loopMode,1,c):null}static CreateMergeAndStartAnimation(e,t,i,n,s,r,o,a,l,h){const c=f._PrepareAnimation(e,i,n,s,r,o,a,l);return c?(t.animations.push(c),t.getScene().beginAnimation(t,0,s,1===c.loopMode,1,h)):null}static MakeAnimationAdditive(e,t=0,i,s=!1,r){let o=e;if(s&&(o=e.clone(),o.name=r||o.name),!o._keys.length)return o;t=t>=0?t:0;let a=0;const l=o._keys[0];let h=o._keys.length-1;const c=o._keys[h],u={referenceValue:l.value,referencePosition:n.jp.Vector3[0],referenceQuaternion:n.jp.Quaternion[0],referenceScaling:n.jp.Vector3[1],keyPosition:n.jp.Vector3[2],keyQuaternion:n.jp.Quaternion[1],keyScaling:n.jp.Vector3[3]};let d=!1,p=l.frame,_=c.frame;if(i){const e=o.getRange(i);e&&(p=e.from,_=e.to)}let m=l.frame===p,g=c.frame===_;if(1===o._keys.length){const e=o._getKeyValue(o._keys[0]);u.referenceValue=e.clone?e.clone():e,d=!0}else if(t<=l.frame){const e=o._getKeyValue(l.value);u.referenceValue=e.clone?e.clone():e,d=!0}else if(t>=c.frame){const e=o._getKeyValue(c.value);u.referenceValue=e.clone?e.clone():e,d=!0}let v=0;for(;!d||!m||!g&&v<o._keys.length-1;){const e=o._keys[v],i=o._keys[v+1];if(!d&&t>=e.frame&&t<=i.frame){let n;if(t===e.frame)n=o._getKeyValue(e.value);else if(t===i.frame)n=o._getKeyValue(i.value);else{const e={key:v,repeatCount:0,loopMode:this.ANIMATIONLOOPMODE_CONSTANT};n=o._interpolate(t,e)}u.referenceValue=n.clone?n.clone():n,d=!0}if(!m&&p>=e.frame&&p<=i.frame){if(p===e.frame)a=v;else if(p===i.frame)a=v+1;else{const e={key:v,repeatCount:0,loopMode:this.ANIMATIONLOOPMODE_CONSTANT},t=o._interpolate(p,e),i={frame:p,value:t.clone?t.clone():t};o._keys.splice(v+1,0,i),a=v+1}m=!0}if(!g&&_>=e.frame&&_<=i.frame){if(_===e.frame)h=v;else if(_===i.frame)h=v+1;else{const e={key:v,repeatCount:0,loopMode:this.ANIMATIONLOOPMODE_CONSTANT},t=o._interpolate(_,e),i={frame:_,value:t.clone?t.clone():t};o._keys.splice(v+1,0,i),h=v+1}g=!0}v++}for(o.dataType===f.ANIMATIONTYPE_QUATERNION?u.referenceValue.normalize().conjugateInPlace():o.dataType===f.ANIMATIONTYPE_MATRIX&&(u.referenceValue.decompose(u.referenceScaling,u.referenceQuaternion,u.referencePosition),u.referenceQuaternion.normalize().conjugateInPlace()),v=a;v<=h;v++){const e=o._keys[v];if(!v||o.dataType===f.ANIMATIONTYPE_FLOAT||e.value!==l.value)switch(o.dataType){case f.ANIMATIONTYPE_MATRIX:e.value.decompose(u.keyScaling,u.keyQuaternion,u.keyPosition),u.keyPosition.subtractInPlace(u.referencePosition),u.keyScaling.divideInPlace(u.referenceScaling),u.referenceQuaternion.multiplyToRef(u.keyQuaternion,u.keyQuaternion),n.y3.ComposeToRef(u.keyScaling,u.keyQuaternion,u.keyPosition,e.value);break;case f.ANIMATIONTYPE_QUATERNION:u.referenceValue.multiplyToRef(e.value,e.value);break;case f.ANIMATIONTYPE_VECTOR2:case f.ANIMATIONTYPE_VECTOR3:case f.ANIMATIONTYPE_COLOR3:case f.ANIMATIONTYPE_COLOR4:e.value.subtractToRef(u.referenceValue,e.value);break;case f.ANIMATIONTYPE_SIZE:e.value.width-=u.referenceValue.width,e.value.height-=u.referenceValue.height;break;default:e.value-=u.referenceValue}}return o}static TransitionTo(e,t,i,n,s,r,o,a=null){if(o<=0)return i[e]=t,a&&a(),null;const l=s*(o/1e3);r.setKeys([{frame:0,value:i[e].clone?i[e].clone():i[e]},{frame:l,value:t}]),i.animations||(i.animations=[]),i.animations.push(r);const h=n.beginAnimation(i,0,l,!1);return h.onAnimationEnd=a,h}get runtimeAnimations(){return this._runtimeAnimations}get hasRunningRuntimeAnimations(){for(const e of this._runtimeAnimations)if(!e.isStopped())return!0;return!1}constructor(e,t,i,n,s,r){this.name=e,this.targetProperty=t,this.framePerSecond=i,this.dataType=n,this.loopMode=s,this.enableBlending=r,this._easingFunction=null,this._runtimeAnimations=new Array,this._events=new Array,this.blendingSpeed=.01,this._ranges={},this.targetPropertyPath=t.split("."),this.dataType=n,this.loopMode=void 0===s?f.ANIMATIONLOOPMODE_CYCLE:s,this.uniqueId=f._UniqueIdGenerator++}toString(e){let t="Name: "+this.name+", property: "+this.targetProperty;if(t+=", datatype: "+["Float","Vector3","Quaternion","Matrix","Color3","Vector2"][this.dataType],t+=", nKeys: "+(this._keys?this._keys.length:"none"),t+=", nRanges: "+(this._ranges?Object.keys(this._ranges).length:"none"),e){t+=", Ranges: {";let e=!0;for(const i in this._ranges)e&&(t+=", ",e=!1),t+=i;t+="}"}return t}addEvent(e){this._events.push(e),this._events.sort(((e,t)=>e.frame-t.frame))}removeEvents(e){for(let t=0;t<this._events.length;t++)this._events[t].frame===e&&(this._events.splice(t,1),t--)}getEvents(){return this._events}createRange(e,t,i){this._ranges[e]||(this._ranges[e]=new h.X(e,t,i))}deleteRange(e,t=!0){const i=this._ranges[e];if(i){if(t){const e=i.from,t=i.to;for(let i=this._keys.length-1;i>=0;i--)this._keys[i].frame>=e&&this._keys[i].frame<=t&&this._keys.splice(i,1)}this._ranges[e]=null}}getRange(e){return this._ranges[e]}getKeys(){return this._keys}getHighestFrame(){let e=0;for(let t=0,i=this._keys.length;t<i;t++)e<this._keys[t].frame&&(e=this._keys[t].frame);return e}getEasingFunction(){return this._easingFunction}setEasingFunction(e){this._easingFunction=e}floatInterpolateFunction(e,t,i){return r.R.Lerp(e,t,i)}floatInterpolateFunctionWithTangents(e,t,i,n,s){return r.R.Hermite(e,t,i,n,s)}quaternionInterpolateFunction(e,t,i){return n._f.Slerp(e,t,i)}quaternionInterpolateFunctionWithTangents(e,t,i,s,r){return n._f.Hermite(e,t,i,s,r).normalize()}vector3InterpolateFunction(e,t,i){return n.P.Lerp(e,t,i)}vector3InterpolateFunctionWithTangents(e,t,i,s,r){return n.P.Hermite(e,t,i,s,r)}vector2InterpolateFunction(e,t,i){return n.FM.Lerp(e,t,i)}vector2InterpolateFunctionWithTangents(e,t,i,s,r){return n.FM.Hermite(e,t,i,s,r)}sizeInterpolateFunction(e,t,i){return u.$.Lerp(e,t,i)}color3InterpolateFunction(e,t,i){return s.Wo.Lerp(e,t,i)}color3InterpolateFunctionWithTangents(e,t,i,n,r){return s.Wo.Hermite(e,t,i,n,r)}color4InterpolateFunction(e,t,i){return s.HE.Lerp(e,t,i)}color4InterpolateFunctionWithTangents(e,t,i,n,r){return s.HE.Hermite(e,t,i,n,r)}_getKeyValue(e){return"function"==typeof e?e():e}evaluate(e){return this._interpolate(e,{key:0,repeatCount:0,loopMode:f.ANIMATIONLOOPMODE_CONSTANT})}_interpolate(e,t){if(t.loopMode===f.ANIMATIONLOOPMODE_CONSTANT&&t.repeatCount>0)return t.highLimitValue.clone?t.highLimitValue.clone():t.highLimitValue;const i=this._keys,n=i.length;let s=t.key;for(;s>=0&&e<i[s].frame;)--s;for(;s+1<=n-1&&e>=i[s+1].frame;)++s;if(t.key=s,s<0)return this._getKeyValue(i[0].value);if(s+1>n-1)return this._getKeyValue(i[n-1].value);const r=i[s],o=i[s+1],a=this._getKeyValue(r.value),h=this._getKeyValue(o.value);if(r.interpolation===l.N.STEP)return o.frame>e?a:h;const c=void 0!==r.outTangent&&void 0!==o.inTangent,u=o.frame-r.frame;let d=(e-r.frame)/u;const p=this.getEasingFunction();switch(null!==p&&(d=p.ease(d)),this.dataType){case f.ANIMATIONTYPE_FLOAT:{const e=c?this.floatInterpolateFunctionWithTangents(a,r.outTangent*u,h,o.inTangent*u,d):this.floatInterpolateFunction(a,h,d);switch(t.loopMode){case f.ANIMATIONLOOPMODE_CYCLE:case f.ANIMATIONLOOPMODE_CONSTANT:return e;case f.ANIMATIONLOOPMODE_RELATIVE:return t.offsetValue*t.repeatCount+e}break}case f.ANIMATIONTYPE_QUATERNION:{const e=c?this.quaternionInterpolateFunctionWithTangents(a,r.outTangent.scale(u),h,o.inTangent.scale(u),d):this.quaternionInterpolateFunction(a,h,d);switch(t.loopMode){case f.ANIMATIONLOOPMODE_CYCLE:case f.ANIMATIONLOOPMODE_CONSTANT:return e;case f.ANIMATIONLOOPMODE_RELATIVE:return e.addInPlace(t.offsetValue.scale(t.repeatCount))}return e}case f.ANIMATIONTYPE_VECTOR3:{const e=c?this.vector3InterpolateFunctionWithTangents(a,r.outTangent.scale(u),h,o.inTangent.scale(u),d):this.vector3InterpolateFunction(a,h,d);switch(t.loopMode){case f.ANIMATIONLOOPMODE_CYCLE:case f.ANIMATIONLOOPMODE_CONSTANT:return e;case f.ANIMATIONLOOPMODE_RELATIVE:return e.add(t.offsetValue.scale(t.repeatCount))}break}case f.ANIMATIONTYPE_VECTOR2:{const e=c?this.vector2InterpolateFunctionWithTangents(a,r.outTangent.scale(u),h,o.inTangent.scale(u),d):this.vector2InterpolateFunction(a,h,d);switch(t.loopMode){case f.ANIMATIONLOOPMODE_CYCLE:case f.ANIMATIONLOOPMODE_CONSTANT:return e;case f.ANIMATIONLOOPMODE_RELATIVE:return e.add(t.offsetValue.scale(t.repeatCount))}break}case f.ANIMATIONTYPE_SIZE:switch(t.loopMode){case f.ANIMATIONLOOPMODE_CYCLE:case f.ANIMATIONLOOPMODE_CONSTANT:return this.sizeInterpolateFunction(a,h,d);case f.ANIMATIONLOOPMODE_RELATIVE:return this.sizeInterpolateFunction(a,h,d).add(t.offsetValue.scale(t.repeatCount))}break;case f.ANIMATIONTYPE_COLOR3:{const e=c?this.color3InterpolateFunctionWithTangents(a,r.outTangent.scale(u),h,o.inTangent.scale(u),d):this.color3InterpolateFunction(a,h,d);switch(t.loopMode){case f.ANIMATIONLOOPMODE_CYCLE:case f.ANIMATIONLOOPMODE_CONSTANT:return e;case f.ANIMATIONLOOPMODE_RELATIVE:return e.add(t.offsetValue.scale(t.repeatCount))}break}case f.ANIMATIONTYPE_COLOR4:{const e=c?this.color4InterpolateFunctionWithTangents(a,r.outTangent.scale(u),h,o.inTangent.scale(u),d):this.color4InterpolateFunction(a,h,d);switch(t.loopMode){case f.ANIMATIONLOOPMODE_CYCLE:case f.ANIMATIONLOOPMODE_CONSTANT:return e;case f.ANIMATIONLOOPMODE_RELATIVE:return e.add(t.offsetValue.scale(t.repeatCount))}break}case f.ANIMATIONTYPE_MATRIX:switch(t.loopMode){case f.ANIMATIONLOOPMODE_CYCLE:case f.ANIMATIONLOOPMODE_CONSTANT:return f.AllowMatricesInterpolation?this.matrixInterpolateFunction(a,h,d,t.workValue):a;case f.ANIMATIONLOOPMODE_RELATIVE:return a}}return 0}matrixInterpolateFunction(e,t,i,s){return f.AllowMatrixDecomposeForInterpolation?s?(n.y3.DecomposeLerpToRef(e,t,i,s),s):n.y3.DecomposeLerp(e,t,i):s?(n.y3.LerpToRef(e,t,i,s),s):n.y3.Lerp(e,t,i)}clone(){const e=new f(this.name,this.targetPropertyPath.join("."),this.framePerSecond,this.dataType,this.loopMode);if(e.enableBlending=this.enableBlending,e.blendingSpeed=this.blendingSpeed,this._keys&&e.setKeys(this._keys),this._ranges){e._ranges={};for(const t in this._ranges){const i=this._ranges[t];i&&(e._ranges[t]=i.clone())}}return e}setKeys(e){this._keys=e.slice(0)}serialize(){const e={};e.name=this.name,e.property=this.targetProperty,e.framePerSecond=this.framePerSecond,e.dataType=this.dataType,e.loopBehavior=this.loopMode,e.enableBlending=this.enableBlending,e.blendingSpeed=this.blendingSpeed;const t=this.dataType;e.keys=[];const i=this.getKeys();for(let n=0;n<i.length;n++){const s=i[n],r={};switch(r.frame=s.frame,t){case f.ANIMATIONTYPE_FLOAT:r.values=[s.value],void 0!==s.inTangent&&r.values.push(s.inTangent),void 0!==s.outTangent&&(void 0===s.inTangent&&r.values.push(void 0),r.values.push(s.outTangent)),void 0!==s.interpolation&&(void 0===s.inTangent&&r.values.push(void 0),void 0===s.outTangent&&r.values.push(void 0),r.values.push(s.interpolation));break;case f.ANIMATIONTYPE_QUATERNION:case f.ANIMATIONTYPE_MATRIX:case f.ANIMATIONTYPE_VECTOR3:case f.ANIMATIONTYPE_COLOR3:case f.ANIMATIONTYPE_COLOR4:r.values=s.value.asArray(),null!=s.inTangent&&r.values.push(s.inTangent.asArray()),null!=s.outTangent&&(void 0===s.inTangent&&r.values.push(void 0),r.values.push(s.outTangent.asArray())),void 0!==s.interpolation&&(void 0===s.inTangent&&r.values.push(void 0),void 0===s.outTangent&&r.values.push(void 0),r.values.push(s.interpolation))}e.keys.push(r)}e.ranges=[];for(const t in this._ranges){const i=this._ranges[t];if(!i)continue;const n={};n.name=t,n.from=i.from,n.to=i.to,e.ranges.push(n)}return e}static _UniversalLerp(e,t,i){const n=e.constructor;return n.Lerp?n.Lerp(e,t,i):n.Slerp?n.Slerp(e,t,i):e.toFixed?e*(1-i)+i*t:t}static Parse(e){const t=new f(e.name,e.property,e.framePerSecond,e.dataType,e.loopBehavior),i=e.dataType,r=[];let o,a;for(e.enableBlending&&(t.enableBlending=e.enableBlending),e.blendingSpeed&&(t.blendingSpeed=e.blendingSpeed),a=0;a<e.keys.length;a++){const t=e.keys[a];let l,h,c;switch(i){case f.ANIMATIONTYPE_FLOAT:o=t.values[0],t.values.length>=2&&(l=t.values[1]),t.values.length>=3&&(h=t.values[2]),t.values.length>=4&&(c=t.values[3]);break;case f.ANIMATIONTYPE_QUATERNION:if(o=n._f.FromArray(t.values),t.values.length>=8){const e=n._f.FromArray(t.values.slice(4,8));e.equals(n._f.Zero())||(l=e)}if(t.values.length>=12){const e=n._f.FromArray(t.values.slice(8,12));e.equals(n._f.Zero())||(h=e)}t.values.length>=13&&(c=t.values[12]);break;case f.ANIMATIONTYPE_MATRIX:o=n.y3.FromArray(t.values),t.values.length>=17&&(c=t.values[16]);break;case f.ANIMATIONTYPE_COLOR3:o=s.Wo.FromArray(t.values),t.values[3]&&(l=s.Wo.FromArray(t.values[3])),t.values[4]&&(h=s.Wo.FromArray(t.values[4])),t.values[5]&&(c=t.values[5]);break;case f.ANIMATIONTYPE_COLOR4:o=s.HE.FromArray(t.values),t.values[4]&&(l=s.HE.FromArray(t.values[4])),t.values[5]&&(h=s.HE.FromArray(t.values[5])),t.values[6]&&(c=s.HE.FromArray(t.values[6]));break;case f.ANIMATIONTYPE_VECTOR3:default:o=n.P.FromArray(t.values),t.values[3]&&(l=n.P.FromArray(t.values[3])),t.values[4]&&(h=n.P.FromArray(t.values[4])),t.values[5]&&(c=t.values[5])}const u={};u.frame=t.frame,u.value=o,null!=l&&(u.inTangent=l),null!=h&&(u.outTangent=h),null!=c&&(u.interpolation=c),r.push(u)}if(t.setKeys(r),e.ranges)for(a=0;a<e.ranges.length;a++)o=e.ranges[a],t.createRange(o.name,o.from,o.to);return t}static AppendSerializedAnimations(e,t){o.p4.AppendSerializedAnimations(e,t)}static ParseFromFileAsync(e,t){return new Promise(((i,n)=>{const s=new d.g;s.addEventListener("readystatechange",(()=>{if(4==s.readyState)if(200==s.status){let t=JSON.parse(s.responseText);if(t.animations&&(t=t.animations),t.length){const e=new Array;for(const i of t)e.push(this.Parse(i));i(e)}else{const n=this.Parse(t);e&&(n.name=e),i(n)}}else n("Unable to load the animation")})),s.open("GET",t),s.send()}))}static ParseFromSnippetAsync(e){return new Promise(((t,i)=>{const n=new d.g;n.addEventListener("readystatechange",(()=>{if(4==n.readyState)if(200==n.status){const i=JSON.parse(JSON.parse(n.responseText).jsonPayload);if(i.animations){const n=JSON.parse(i.animations),s=new Array;for(const t of n.animations){const i=this.Parse(t);i.snippetId=e,s.push(i)}t(s)}else{const n=JSON.parse(i.animation),s=this.Parse(n);s.snippetId=e,t(s)}}else i("Unable to load the snippet "+e)})),n.open("GET",this.SnippetUrl+"/"+e.replace(/#/g,"/")),n.send()}))}}f._UniqueIdGenerator=0,f.AllowMatricesInterpolation=!1,f.AllowMatrixDecomposeForInterpolation=!0,f.SnippetUrl="https://snippet.babylonjs.com",f.ANIMATIONTYPE_FLOAT=0,f.ANIMATIONTYPE_VECTOR3=1,f.ANIMATIONTYPE_QUATERNION=2,f.ANIMATIONTYPE_MATRIX=3,f.ANIMATIONTYPE_COLOR3=4,f.ANIMATIONTYPE_COLOR4=7,f.ANIMATIONTYPE_VECTOR2=5,f.ANIMATIONTYPE_SIZE=6,f.ANIMATIONLOOPMODE_RELATIVE=0,f.ANIMATIONLOOPMODE_CYCLE=1,f.ANIMATIONLOOPMODE_CONSTANT=2,f.CreateFromSnippetAsync=f.ParseFromSnippetAsync,(0,a.H)("BABYLON.Animation",f),c.N._AnimationRangeFactory=(e,t,i)=>new h.X(e,t,i)},8117:(e,t,i)=>{i.d(t,{O:()=>n});class n{constructor(e,t,i){this.frame=e,this.action=t,this.onlyOnce=i,this.isDone=!1}_clone(){return new n(this.frame,this.action,this.onlyOnce)}}},2323:(e,t,i)=>{i.d(t,{O:()=>l,U:()=>a});var n=i(4676),s=i(5757),r=i(1431),o=i(4875);class a{getClassName(){return"TargetedAnimation"}serialize(){const e={};return e.animation=this.animation.serialize(),e.targetId=this.target.id,e}}class l{get from(){return this._from}get to(){return this._to}get isStarted(){return this._isStarted}get isPlaying(){return this._isStarted&&!this._isPaused}get speedRatio(){return this._speedRatio}set speedRatio(e){if(this._speedRatio!==e){this._speedRatio=e;for(let e=0;e<this._animatables.length;e++)this._animatables[e].speedRatio=this._speedRatio}}get loopAnimation(){return this._loopAnimation}set loopAnimation(e){if(this._loopAnimation!==e){this._loopAnimation=e;for(let e=0;e<this._animatables.length;e++)this._animatables[e].loopAnimation=this._loopAnimation}}get isAdditive(){return this._isAdditive}set isAdditive(e){if(this._isAdditive!==e){this._isAdditive=e;for(let e=0;e<this._animatables.length;e++)this._animatables[e].isAdditive=this._isAdditive}}get targetedAnimations(){return this._targetedAnimations}get animatables(){return this._animatables}get children(){return this._targetedAnimations}constructor(e,t=null){this.name=e,this._targetedAnimations=new Array,this._animatables=new Array,this._from=Number.MAX_VALUE,this._to=-Number.MAX_VALUE,this._speedRatio=1,this._loopAnimation=!1,this._isAdditive=!1,this._parentContainer=null,this.onAnimationEndObservable=new s.y$,this.onAnimationLoopObservable=new s.y$,this.onAnimationGroupLoopObservable=new s.y$,this.onAnimationGroupEndObservable=new s.y$,this.onAnimationGroupPauseObservable=new s.y$,this.onAnimationGroupPlayObservable=new s.y$,this.metadata=null,this._animationLoopFlags=[],this._scene=t||r.l.LastCreatedScene,this.uniqueId=this._scene.getUniqueId(),this._scene.addAnimationGroup(this)}addTargetedAnimation(e,t){const i=new a;i.animation=e,i.target=t;const n=e.getKeys();return this._from>n[0].frame&&(this._from=n[0].frame),this._to<n[n.length-1].frame&&(this._to=n[n.length-1].frame),this._targetedAnimations.push(i),i}normalize(e=null,t=null){null==e&&(e=this._from),null==t&&(t=this._to);for(let i=0;i<this._targetedAnimations.length;i++){const n=this._targetedAnimations[i].animation.getKeys(),s=n[0],r=n[n.length-1];if(s.frame>e){const t={frame:e,value:s.value,inTangent:s.inTangent,outTangent:s.outTangent,interpolation:s.interpolation};n.splice(0,0,t)}if(r.frame<t){const e={frame:t,value:r.value,inTangent:r.inTangent,outTangent:r.outTangent,interpolation:r.interpolation};n.push(e)}}return this._from=e,this._to=t,this}_processLoop(e,t,i){e.onAnimationLoop=()=>{this.onAnimationLoopObservable.notifyObservers(t),this._animationLoopFlags[i]||(this._animationLoopFlags[i]=!0,this._animationLoopCount++,this._animationLoopCount===this._targetedAnimations.length&&(this.onAnimationGroupLoopObservable.notifyObservers(this),this._animationLoopCount=0,this._animationLoopFlags.length=0))}}start(e=!1,t=1,i,n,s){if(this._isStarted||0===this._targetedAnimations.length)return this;this._loopAnimation=e,this._animationLoopCount=0,this._animationLoopFlags.length=0;for(let r=0;r<this._targetedAnimations.length;r++){const o=this._targetedAnimations[r],a=this._scene.beginDirectAnimation(o.target,[o.animation],void 0!==i?i:this._from,void 0!==n?n:this._to,e,t,void 0,void 0,void 0!==s?s:this._isAdditive);a.onAnimationEnd=()=>{this.onAnimationEndObservable.notifyObservers(o),this._checkAnimationGroupEnded(a)},this._processLoop(a,o,r),this._animatables.push(a)}return this._speedRatio=t,this._isStarted=!0,this._isPaused=!1,this.onAnimationGroupPlayObservable.notifyObservers(this),this}pause(){if(!this._isStarted)return this;this._isPaused=!0;for(let e=0;e<this._animatables.length;e++)this._animatables[e].pause();return this.onAnimationGroupPauseObservable.notifyObservers(this),this}play(e){return this.isStarted&&this._animatables.length===this._targetedAnimations.length?(void 0!==e&&(this.loopAnimation=e),this.restart()):(this.stop(),this.start(e,this._speedRatio)),this._isPaused=!1,this}reset(){if(!this._isStarted)return this.play(),this.goToFrame(0),this.stop(),this;for(let e=0;e<this._animatables.length;e++)this._animatables[e].reset();return this}restart(){if(!this._isStarted)return this;for(let e=0;e<this._animatables.length;e++)this._animatables[e].restart();return this.onAnimationGroupPlayObservable.notifyObservers(this),this}stop(){if(!this._isStarted)return this;const e=this._animatables.slice();for(let t=0;t<e.length;t++)e[t].stop(void 0,void 0,!0);let t=0;for(let e=0;e<this._scene._activeAnimatables.length;e++){const i=this._scene._activeAnimatables[e];i._runtimeAnimations.length>0&&(this._scene._activeAnimatables[t++]=i)}return this._scene._activeAnimatables.length=t,this._isStarted=!1,this}setWeightForAllAnimatables(e){for(let t=0;t<this._animatables.length;t++)this._animatables[t].weight=e;return this}syncAllAnimationsWith(e){for(let t=0;t<this._animatables.length;t++)this._animatables[t].syncWith(e);return this}goToFrame(e){if(!this._isStarted)return this;for(let t=0;t<this._animatables.length;t++)this._animatables[t].goToFrame(e);return this}dispose(){this._targetedAnimations.length=0,this._animatables.length=0;const e=this._scene.animationGroups.indexOf(this);if(e>-1&&this._scene.animationGroups.splice(e,1),this._parentContainer){const e=this._parentContainer.animationGroups.indexOf(this);e>-1&&this._parentContainer.animationGroups.splice(e,1),this._parentContainer=null}this.onAnimationEndObservable.clear(),this.onAnimationGroupEndObservable.clear(),this.onAnimationGroupPauseObservable.clear(),this.onAnimationGroupPlayObservable.clear(),this.onAnimationLoopObservable.clear(),this.onAnimationGroupLoopObservable.clear()}_checkAnimationGroupEnded(e){const t=this._animatables.indexOf(e);t>-1&&this._animatables.splice(t,1),0===this._animatables.length&&(this._isStarted=!1,this.onAnimationGroupEndObservable.notifyObservers(this))}clone(e,t,i=!1){const n=new l(e||this.name,this._scene);for(const e of this._targetedAnimations)n.addTargetedAnimation(i?e.animation.clone():e.animation,t?t(e.target):e.target);return n}serialize(){const e={};e.name=this.name,e.from=this.from,e.to=this.to,e.targetedAnimations=[];for(let t=0;t<this.targetedAnimations.length;t++){const i=this.targetedAnimations[t];e.targetedAnimations[t]=i.serialize()}return o.$&&o.$.HasTags(this)&&(e.tags=o.$.GetTags(this)),this.metadata&&(e.metadata=this.metadata),e}static Parse(e,t){const i=new l(e.name,t);for(let s=0;s<e.targetedAnimations.length;s++){const r=e.targetedAnimations[s],o=n.f.Parse(r.animation),a=r.targetId;if("influence"===r.animation.property){const e=t.getMorphTargetById(a);e&&i.addTargetedAnimation(o,e)}else{const e=t.getNodeById(a);null!=e&&i.addTargetedAnimation(o,e)}}return null!==e.from&&null!==e.to&&i.normalize(e.from,e.to),o.$&&o.$.AddTagsTo(i,e.tags),void 0!==e.metadata&&(i.metadata=e.metadata),i}static MakeAnimationAdditive(e,t=0,i,s=!1,r){let o=e;s&&(o=e.clone(r||o.name));const a=o.targetedAnimations;for(let e=0;e<a.length;e++){const s=a[e];n.f.MakeAnimationAdditive(s.animation,t,i)}return o.isAdditive=!0,o}getClassName(){return"AnimationGroup"}toString(e){let t="Name: "+this.name;return t+=", type: "+this.getClassName(),e&&(t+=", from: "+this._from,t+=", to: "+this._to,t+=", isStarted: "+this._isStarted,t+=", speedRatio: "+this._speedRatio,t+=", targetedAnimations length: "+this._targetedAnimations.length,t+=", animatables length: "+this._animatables),t}}},4173:(e,t,i)=>{var n;i.d(t,{N:()=>n}),function(e){e[e.NONE=0]="NONE",e[e.STEP=1]="STEP"}(n||(n={}))},2695:(e,t,i)=>{i.d(t,{X:()=>n});class n{constructor(e,t,i){this.name=e,this.from=t,this.to=i}clone(){return new n(this.name,this.from,this.to)}}},3642:(e,t,i)=>{i.d(t,{$:()=>c});var n=i(7257),s=i(5757),r=i(4141),o=i(7814),a=i(2722),l=i(4934),h=i(1431);class c{get loop(){return this._loop}set loop(e){e!==this._loop&&(this._loop=e,this.updateOptions({loop:e}))}get currentTime(){var e;if(this._htmlAudioElement)return this._htmlAudioElement.currentTime;if((null===(e=o.D.audioEngine)||void 0===e?void 0:e.audioContext)&&(this.isPlaying||this.isPaused)){const e=this.isPaused?0:o.D.audioEngine.audioContext.currentTime-this._startTime;return this._currentTime+e}return 0}get spatialSound(){return this._spatialSound}set spatialSound(e){var t;this._spatialSound=e,this._spatialSound&&(null===(t=o.D.audioEngine)||void 0===t?void 0:t.canUseWebAudio)&&o.D.audioEngine.audioContext&&this._createSpatialParameters()}constructor(e,t,i,l=null,u){var d,p,f,_,m;if(this.autoplay=!1,this._loop=!1,this.useCustomAttenuation=!1,this.isPlaying=!1,this.isPaused=!1,this.refDistance=1,this.rolloffFactor=1,this.maxDistance=100,this.distanceModel="linear",this.metadata=null,this.onEndedObservable=new s.y$,this._spatialSound=!1,this._panningModel="equalpower",this._playbackRate=1,this._streaming=!1,this._startTime=0,this._currentTime=0,this._position=r.P.Zero(),this._localDirection=new r.P(1,0,0),this._volume=1,this._isReadyToPlay=!1,this._isDirectional=!1,this._coneInnerAngle=360,this._coneOuterAngle=360,this._coneOuterGain=0,this._isOutputConnected=!1,this._urlType="Unknown",this.name=e,i=i||h.l.LastCreatedScene)if(this._scene=i,c._SceneComponentInitialization(i),this._readyToPlayCallback=l,this._customAttenuationFunction=(e,t,i,n,s)=>t<i?e*(1-t/i):0,u&&(this.autoplay=u.autoplay||!1,this._loop=u.loop||!1,void 0!==u.volume&&(this._volume=u.volume),this._spatialSound=null!==(d=u.spatialSound)&&void 0!==d&&d,this.maxDistance=null!==(p=u.maxDistance)&&void 0!==p?p:100,this.useCustomAttenuation=null!==(f=u.useCustomAttenuation)&&void 0!==f&&f,this.rolloffFactor=u.rolloffFactor||1,this.refDistance=u.refDistance||1,this.distanceModel=u.distanceModel||"linear",this._playbackRate=u.playbackRate||1,this._streaming=null!==(_=u.streaming)&&void 0!==_&&_,this._length=u.length,this._offset=u.offset),(null===(m=o.D.audioEngine)||void 0===m?void 0:m.canUseWebAudio)&&o.D.audioEngine.audioContext){this._soundGain=o.D.audioEngine.audioContext.createGain(),this._soundGain.gain.value=this._volume,this._inputAudioNode=this._soundGain,this._outputAudioNode=this._soundGain,this._spatialSound&&this._createSpatialParameters(),this._scene.mainSoundTrack.addSound(this);let e=!0;if(t)try{"string"==typeof t?this._urlType="String":t instanceof ArrayBuffer?this._urlType="ArrayBuffer":t instanceof HTMLMediaElement?this._urlType="MediaElement":t instanceof MediaStream?this._urlType="MediaStream":t instanceof AudioBuffer?this._urlType="AudioBuffer":Array.isArray(t)&&(this._urlType="Array");let i=[],s=!1;switch(this._urlType){case"MediaElement":this._streaming=!0,this._isReadyToPlay=!0,this._streamingSource=o.D.audioEngine.audioContext.createMediaElementSource(t),this.autoplay&&this.play(0,this._offset,this._length),this._readyToPlayCallback&&this._readyToPlayCallback();break;case"MediaStream":this._streaming=!0,this._isReadyToPlay=!0,this._streamingSource=o.D.audioEngine.audioContext.createMediaStreamSource(t),this.autoplay&&this.play(0,this._offset,this._length),this._readyToPlayCallback&&this._readyToPlayCallback();break;case"ArrayBuffer":t.byteLength>0&&(s=!0,this._soundLoaded(t));break;case"AudioBuffer":this._audioBufferLoaded(t);break;case"String":i.push(t);case"Array":0===i.length&&(i=t);for(let e=0;e<i.length;e++){const t=i[e];if(s=u&&u.skipCodecCheck||-1!==t.indexOf(".mp3",t.length-4)&&o.D.audioEngine.isMP3supported||-1!==t.indexOf(".ogg",t.length-4)&&o.D.audioEngine.isOGGsupported||-1!==t.indexOf(".wav",t.length-4)||-1!==t.indexOf(".m4a",t.length-4)||-1!==t.indexOf(".mp4",t.length-4)||-1!==t.indexOf("blob:"),s){this._streaming?(this._htmlAudioElement=new Audio(t),this._htmlAudioElement.controls=!1,this._htmlAudioElement.loop=this.loop,n.w1.SetCorsBehavior(t,this._htmlAudioElement),this._htmlAudioElement.preload="auto",this._htmlAudioElement.addEventListener("canplaythrough",(()=>{this._isReadyToPlay=!0,this.autoplay&&this.play(0,this._offset,this._length),this._readyToPlayCallback&&this._readyToPlayCallback()})),document.body.appendChild(this._htmlAudioElement),this._htmlAudioElement.load()):this._scene._loadFile(t,(e=>{this._soundLoaded(e)}),void 0,!0,!0,(e=>{e&&a.Y.Error("XHR "+e.status+" error on: "+t+"."),a.Y.Error("Sound creation aborted."),this._scene.mainSoundTrack.removeSound(this)}));break}}break;default:e=!1}e?s||(this._isReadyToPlay=!0,this._readyToPlayCallback&&setTimeout((()=>{this._readyToPlayCallback&&this._readyToPlayCallback()}),1e3)):a.Y.Error("Parameter must be a URL to the sound, an Array of URLs (.mp3 & .ogg) or an ArrayBuffer of the sound.")}catch(e){a.Y.Error("Unexpected error. Sound creation aborted."),this._scene.mainSoundTrack.removeSound(this)}}else this._scene.mainSoundTrack.addSound(this),o.D.audioEngine&&!o.D.audioEngine.WarnedWebAudioUnsupported&&(a.Y.Error("Web Audio is not supported by your browser."),o.D.audioEngine.WarnedWebAudioUnsupported=!0),this._readyToPlayCallback&&setTimeout((()=>{this._readyToPlayCallback&&this._readyToPlayCallback()}),1e3)}dispose(){var e;(null===(e=o.D.audioEngine)||void 0===e?void 0:e.canUseWebAudio)&&(this.isPlaying&&this.stop(),this._isReadyToPlay=!1,-1===this.soundTrackId?this._scene.mainSoundTrack.removeSound(this):this._scene.soundTracks&&this._scene.soundTracks[this.soundTrackId].removeSound(this),this._soundGain&&(this._soundGain.disconnect(),this._soundGain=null),this._soundPanner&&(this._soundPanner.disconnect(),this._soundPanner=null),this._soundSource&&(this._soundSource.disconnect(),this._soundSource=null),this._audioBuffer=null,this._htmlAudioElement&&(this._htmlAudioElement.pause(),this._htmlAudioElement.src="",document.body.removeChild(this._htmlAudioElement)),this._streamingSource&&this._streamingSource.disconnect(),this._connectedTransformNode&&this._registerFunc&&(this._connectedTransformNode.unregisterAfterWorldMatrixUpdate(this._registerFunc),this._connectedTransformNode=null))}isReady(){return this._isReadyToPlay}getClassName(){return"Sound"}_audioBufferLoaded(e){var t;(null===(t=o.D.audioEngine)||void 0===t?void 0:t.audioContext)&&(this._audioBuffer=e,this._isReadyToPlay=!0,this.autoplay&&this.play(0,this._offset,this._length),this._readyToPlayCallback&&this._readyToPlayCallback())}_soundLoaded(e){var t;(null===(t=o.D.audioEngine)||void 0===t?void 0:t.audioContext)&&o.D.audioEngine.audioContext.decodeAudioData(e,(e=>{this._audioBufferLoaded(e)}),(e=>{a.Y.Error("Error while decoding audio data for: "+this.name+" / Error: "+e)}))}setAudioBuffer(e){var t;(null===(t=o.D.audioEngine)||void 0===t?void 0:t.canUseWebAudio)&&(this._audioBuffer=e,this._isReadyToPlay=!0)}updateOptions(e){var t,i,n,s,r,o,a,l,h,c;e&&(this.loop=null!==(t=e.loop)&&void 0!==t?t:this.loop,this.maxDistance=null!==(i=e.maxDistance)&&void 0!==i?i:this.maxDistance,this.useCustomAttenuation=null!==(n=e.useCustomAttenuation)&&void 0!==n?n:this.useCustomAttenuation,this.rolloffFactor=null!==(s=e.rolloffFactor)&&void 0!==s?s:this.rolloffFactor,this.refDistance=null!==(r=e.refDistance)&&void 0!==r?r:this.refDistance,this.distanceModel=null!==(o=e.distanceModel)&&void 0!==o?o:this.distanceModel,this._playbackRate=null!==(a=e.playbackRate)&&void 0!==a?a:this._playbackRate,this._length=null!==(l=e.length)&&void 0!==l?l:void 0,this._setOffset(null!==(h=e.offset)&&void 0!==h?h:void 0),this.setVolume(null!==(c=e.volume)&&void 0!==c?c:this._volume),this._updateSpatialParameters(),this.isPlaying&&(this._streaming&&this._htmlAudioElement?(this._htmlAudioElement.playbackRate=this._playbackRate,this._htmlAudioElement.loop!==this.loop&&(this._htmlAudioElement.loop=this.loop)):this._soundSource&&(this._soundSource.playbackRate.value=this._playbackRate,this._soundSource.loop!==this.loop&&(this._soundSource.loop=this.loop),void 0!==this._offset&&this._soundSource.loopStart!==this._offset&&(this._soundSource.loopStart=this._offset),void 0!==this._length&&this._length!==this._soundSource.loopEnd&&(this._soundSource.loopEnd=(0|this._offset)+this._length))))}_createSpatialParameters(){var e,t;(null===(e=o.D.audioEngine)||void 0===e?void 0:e.canUseWebAudio)&&o.D.audioEngine.audioContext&&(this._scene.headphone&&(this._panningModel="HRTF"),this._soundPanner=null!==(t=this._soundPanner)&&void 0!==t?t:o.D.audioEngine.audioContext.createPanner(),this._soundPanner&&this._outputAudioNode&&(this._updateSpatialParameters(),this._soundPanner.connect(this._outputAudioNode),this._inputAudioNode=this._soundPanner))}_updateSpatialParameters(){this._spatialSound&&this._soundPanner&&(this.useCustomAttenuation?(this._soundPanner.distanceModel="linear",this._soundPanner.maxDistance=Number.MAX_VALUE,this._soundPanner.refDistance=1,this._soundPanner.rolloffFactor=1,this._soundPanner.panningModel=this._panningModel):(this._soundPanner.distanceModel=this.distanceModel,this._soundPanner.maxDistance=this.maxDistance,this._soundPanner.refDistance=this.refDistance,this._soundPanner.rolloffFactor=this.rolloffFactor,this._soundPanner.panningModel=this._panningModel))}switchPanningModelToHRTF(){this._panningModel="HRTF",this._switchPanningModel()}switchPanningModelToEqualPower(){this._panningModel="equalpower",this._switchPanningModel()}_switchPanningModel(){var e;(null===(e=o.D.audioEngine)||void 0===e?void 0:e.canUseWebAudio)&&this._spatialSound&&this._soundPanner&&(this._soundPanner.panningModel=this._panningModel)}connectToSoundTrackAudioNode(e){var t;(null===(t=o.D.audioEngine)||void 0===t?void 0:t.canUseWebAudio)&&this._outputAudioNode&&(this._isOutputConnected&&this._outputAudioNode.disconnect(),this._outputAudioNode.connect(e),this._isOutputConnected=!0)}setDirectionalCone(e,t,i){t<e?a.Y.Error("setDirectionalCone(): outer angle of the cone must be superior or equal to the inner angle."):(this._coneInnerAngle=e,this._coneOuterAngle=t,this._coneOuterGain=i,this._isDirectional=!0,this.isPlaying&&this.loop&&(this.stop(),this.play(0,this._offset,this._length)))}get directionalConeInnerAngle(){return this._coneInnerAngle}set directionalConeInnerAngle(e){var t;if(e!=this._coneInnerAngle){if(this._coneOuterAngle<e)return void a.Y.Error("directionalConeInnerAngle: outer angle of the cone must be superior or equal to the inner angle.");this._coneInnerAngle=e,(null===(t=o.D.audioEngine)||void 0===t?void 0:t.canUseWebAudio)&&this._spatialSound&&this._soundPanner&&(this._soundPanner.coneInnerAngle=this._coneInnerAngle)}}get directionalConeOuterAngle(){return this._coneOuterAngle}set directionalConeOuterAngle(e){var t;if(e!=this._coneOuterAngle){if(e<this._coneInnerAngle)return void a.Y.Error("directionalConeOuterAngle: outer angle of the cone must be superior or equal to the inner angle.");this._coneOuterAngle=e,(null===(t=o.D.audioEngine)||void 0===t?void 0:t.canUseWebAudio)&&this._spatialSound&&this._soundPanner&&(this._soundPanner.coneOuterAngle=this._coneOuterAngle)}}setPosition(e){var t;e.equals(this._position)||(this._position.copyFrom(e),(null===(t=o.D.audioEngine)||void 0===t?void 0:t.canUseWebAudio)&&this._spatialSound&&this._soundPanner&&!isNaN(this._position.x)&&!isNaN(this._position.y)&&!isNaN(this._position.z)&&(this._soundPanner.positionX.value=this._position.x,this._soundPanner.positionY.value=this._position.y,this._soundPanner.positionZ.value=this._position.z))}setLocalDirectionToMesh(e){var t;this._localDirection=e,(null===(t=o.D.audioEngine)||void 0===t?void 0:t.canUseWebAudio)&&this._connectedTransformNode&&this.isPlaying&&this._updateDirection()}_updateDirection(){if(!this._connectedTransformNode||!this._soundPanner)return;const e=this._connectedTransformNode.getWorldMatrix(),t=r.P.TransformNormal(this._localDirection,e);t.normalize(),this._soundPanner.orientationX.value=t.x,this._soundPanner.orientationY.value=t.y,this._soundPanner.orientationZ.value=t.z}updateDistanceFromListener(){var e;if((null===(e=o.D.audioEngine)||void 0===e?void 0:e.canUseWebAudio)&&this._connectedTransformNode&&this.useCustomAttenuation&&this._soundGain&&this._scene.activeCamera){const e=this._connectedTransformNode.getDistanceToCamera(this._scene.activeCamera);this._soundGain.gain.value=this._customAttenuationFunction(this._volume,e,this.maxDistance,this.refDistance,this.rolloffFactor)}}setAttenuationFunction(e){this._customAttenuationFunction=e}play(e,t,i){var n,s,r,l;if(this._isReadyToPlay&&this._scene.audioEnabled&&(null===(n=o.D.audioEngine)||void 0===n?void 0:n.audioContext))try{let n=e?(null===(s=o.D.audioEngine)||void 0===s?void 0:s.audioContext.currentTime)+e:null===(r=o.D.audioEngine)||void 0===r?void 0:r.audioContext.currentTime;if(this._soundSource&&this._streamingSource||this._spatialSound&&this._soundPanner&&(isNaN(this._position.x)||isNaN(this._position.y)||isNaN(this._position.z)||(this._soundPanner.positionX.value=this._position.x,this._soundPanner.positionY.value=this._position.y,this._soundPanner.positionZ.value=this._position.z),this._isDirectional&&(this._soundPanner.coneInnerAngle=this._coneInnerAngle,this._soundPanner.coneOuterAngle=this._coneOuterAngle,this._soundPanner.coneOuterGain=this._coneOuterGain,this._connectedTransformNode?this._updateDirection():this._soundPanner.setOrientation(this._localDirection.x,this._localDirection.y,this._localDirection.z))),this._streaming){if(this._streamingSource||(this._streamingSource=o.D.audioEngine.audioContext.createMediaElementSource(this._htmlAudioElement),this._htmlAudioElement.onended=()=>{this._onended()},this._htmlAudioElement.playbackRate=this._playbackRate),this._streamingSource.disconnect(),this._inputAudioNode&&this._streamingSource.connect(this._inputAudioNode),this._htmlAudioElement){const e=()=>{var t,i;if(null===(t=o.D.audioEngine)||void 0===t?void 0:t.unlocked){const t=this._htmlAudioElement.play();void 0!==t&&t.catch((()=>{var t,i;null===(t=o.D.audioEngine)||void 0===t||t.lock(),(this.loop||this.autoplay)&&(null===(i=o.D.audioEngine)||void 0===i||i.onAudioUnlockedObservable.addOnce((()=>{e()})))}))}else(this.loop||this.autoplay)&&(null===(i=o.D.audioEngine)||void 0===i||i.onAudioUnlockedObservable.addOnce((()=>{e()})))};e()}}else{const s=()=>{var s,r,a,l;if(null===(s=o.D.audioEngine)||void 0===s?void 0:s.audioContext){if(i=i||this._length,void 0!==t&&this._setOffset(t),this._soundSource){const e=this._soundSource;e.onended=()=>{e.disconnect()}}if(this._soundSource=null===(r=o.D.audioEngine)||void 0===r?void 0:r.audioContext.createBufferSource(),this._soundSource&&this._inputAudioNode){this._soundSource.buffer=this._audioBuffer,this._soundSource.connect(this._inputAudioNode),this._soundSource.loop=this.loop,void 0!==t&&(this._soundSource.loopStart=t),void 0!==i&&(this._soundSource.loopEnd=(0|t)+i),this._soundSource.playbackRate.value=this._playbackRate,this._soundSource.onended=()=>{this._onended()},n=e?(null===(a=o.D.audioEngine)||void 0===a?void 0:a.audioContext.currentTime)+e:o.D.audioEngine.audioContext.currentTime;const s=((this.isPaused?this.currentTime:0)+(null!==(l=this._offset)&&void 0!==l?l:0))%this._soundSource.buffer.duration;this._soundSource.start(n,s,this.loop?void 0:i)}}};"suspended"===(null===(l=o.D.audioEngine)||void 0===l?void 0:l.audioContext.state)?setTimeout((()=>{var e;"suspended"===(null===(e=o.D.audioEngine)||void 0===e?void 0:e.audioContext.state)?(o.D.audioEngine.lock(),(this.loop||this.autoplay)&&o.D.audioEngine.onAudioUnlockedObservable.addOnce((()=>{s()}))):s()}),500):s()}this._startTime=n,this.isPlaying=!0,this.isPaused=!1}catch(e){a.Y.Error("Error while trying to play audio: "+this.name+", "+e.message)}}_onended(){this.isPlaying=!1,this._startTime=0,this._currentTime=0,this.onended&&this.onended(),this.onEndedObservable.notifyObservers(this)}stop(e){var t;if(this.isPlaying){if(this._streaming)this._htmlAudioElement?(this._htmlAudioElement.pause(),this._htmlAudioElement.currentTime>0&&(this._htmlAudioElement.currentTime=0)):this._streamingSource.disconnect(),this.isPlaying=!1;else if((null===(t=o.D.audioEngine)||void 0===t?void 0:t.audioContext)&&this._soundSource){const t=e?o.D.audioEngine.audioContext.currentTime+e:void 0;this._soundSource.onended=()=>{this.isPlaying=!1,this.isPaused=!1,this._startTime=0,this._currentTime=0,this._soundSource&&(this._soundSource.onended=()=>{}),this._onended()},this._soundSource.stop(t)}}else this.isPaused&&(this.isPaused=!1,this._startTime=0,this._currentTime=0)}pause(){var e;this.isPlaying&&(this._streaming?(this._htmlAudioElement?this._htmlAudioElement.pause():this._streamingSource.disconnect(),this.isPlaying=!1,this.isPaused=!0):(null===(e=o.D.audioEngine)||void 0===e?void 0:e.audioContext)&&this._soundSource&&(this._soundSource.onended=()=>{},this._soundSource.stop(),this.isPlaying=!1,this.isPaused=!0,this._currentTime+=o.D.audioEngine.audioContext.currentTime-this._startTime))}setVolume(e,t){var i;(null===(i=o.D.audioEngine)||void 0===i?void 0:i.canUseWebAudio)&&this._soundGain&&(t&&o.D.audioEngine.audioContext?(this._soundGain.gain.cancelScheduledValues(o.D.audioEngine.audioContext.currentTime),this._soundGain.gain.setValueAtTime(this._soundGain.gain.value,o.D.audioEngine.audioContext.currentTime),this._soundGain.gain.linearRampToValueAtTime(e,o.D.audioEngine.audioContext.currentTime+t)):this._soundGain.gain.value=e),this._volume=e}setPlaybackRate(e){this._playbackRate=e,this.isPlaying&&(this._streaming&&this._htmlAudioElement?this._htmlAudioElement.playbackRate=this._playbackRate:this._soundSource&&(this._soundSource.playbackRate.value=this._playbackRate))}getPlaybackRate(){return this._playbackRate}getVolume(){return this._volume}attachToMesh(e){this._connectedTransformNode&&this._registerFunc&&(this._connectedTransformNode.unregisterAfterWorldMatrixUpdate(this._registerFunc),this._registerFunc=null),this._connectedTransformNode=e,this._spatialSound||(this._spatialSound=!0,this._createSpatialParameters(),this.isPlaying&&this.loop&&(this.stop(),this.play(0,this._offset,this._length))),this._onRegisterAfterWorldMatrixUpdate(this._connectedTransformNode),this._registerFunc=e=>this._onRegisterAfterWorldMatrixUpdate(e),this._connectedTransformNode.registerAfterWorldMatrixUpdate(this._registerFunc)}detachFromMesh(){this._connectedTransformNode&&this._registerFunc&&(this._connectedTransformNode.unregisterAfterWorldMatrixUpdate(this._registerFunc),this._registerFunc=null,this._connectedTransformNode=null)}_onRegisterAfterWorldMatrixUpdate(e){var t;if(e.getBoundingInfo){const t=e.getBoundingInfo();this.setPosition(t.boundingSphere.centerWorld)}else this.setPosition(e.absolutePosition);(null===(t=o.D.audioEngine)||void 0===t?void 0:t.canUseWebAudio)&&this._isDirectional&&this.isPlaying&&this._updateDirection()}clone(){if(this._streaming)return null;{const e=()=>{this._isReadyToPlay?(i._audioBuffer=this.getAudioBuffer(),i._isReadyToPlay=!0,i.autoplay&&i.play(0,this._offset,this._length)):setTimeout(e,300)},t={autoplay:this.autoplay,loop:this.loop,volume:this._volume,spatialSound:this._spatialSound,maxDistance:this.maxDistance,useCustomAttenuation:this.useCustomAttenuation,rolloffFactor:this.rolloffFactor,refDistance:this.refDistance,distanceModel:this.distanceModel},i=new c(this.name+"_cloned",new ArrayBuffer(0),this._scene,null,t);return this.useCustomAttenuation&&i.setAttenuationFunction(this._customAttenuationFunction),i.setPosition(this._position),i.setPlaybackRate(this._playbackRate),e(),i}}getAudioBuffer(){return this._audioBuffer}getSoundSource(){return this._soundSource}getSoundGain(){return this._soundGain}serialize(){const e={name:this.name,url:this.name,autoplay:this.autoplay,loop:this.loop,volume:this._volume,spatialSound:this._spatialSound,maxDistance:this.maxDistance,rolloffFactor:this.rolloffFactor,refDistance:this.refDistance,distanceModel:this.distanceModel,playbackRate:this._playbackRate,panningModel:this._panningModel,soundTrackId:this.soundTrackId,metadata:this.metadata};return this._spatialSound&&(this._connectedTransformNode&&(e.connectedMeshId=this._connectedTransformNode.id),e.position=this._position.asArray(),e.refDistance=this.refDistance,e.distanceModel=this.distanceModel,e.isDirectional=this._isDirectional,e.localDirectionToMesh=this._localDirection.asArray(),e.coneInnerAngle=this._coneInnerAngle,e.coneOuterAngle=this._coneOuterAngle,e.coneOuterGain=this._coneOuterGain),e}static Parse(e,t,i,n){const s=e.name;let o;o=e.url?i+e.url:i+s;const a={autoplay:e.autoplay,loop:e.loop,volume:e.volume,spatialSound:e.spatialSound,maxDistance:e.maxDistance,rolloffFactor:e.rolloffFactor,refDistance:e.refDistance,distanceModel:e.distanceModel,playbackRate:e.playbackRate};let l;if(n){const e=()=>{n._isReadyToPlay?(l._audioBuffer=n.getAudioBuffer(),l._isReadyToPlay=!0,l.autoplay&&l.play(0,l._offset,l._length)):setTimeout(e,300)};l=new c(s,new ArrayBuffer(0),t,null,a),e()}else l=new c(s,o,t,(()=>{t.removePendingData(l)}),a),t.addPendingData(l);if(e.position){const t=r.P.FromArray(e.position);l.setPosition(t)}if(e.isDirectional&&(l.setDirectionalCone(e.coneInnerAngle||360,e.coneOuterAngle||360,e.coneOuterGain||0),e.localDirectionToMesh)){const t=r.P.FromArray(e.localDirectionToMesh);l.setLocalDirectionToMesh(t)}if(e.connectedMeshId){const i=t.getMeshById(e.connectedMeshId);i&&l.attachToMesh(i)}return e.metadata&&(l.metadata=e.metadata),l}_setOffset(e){this._offset!==e&&(this.isPaused&&(this.stop(),this.isPaused=!1),this._offset=e)}}c._SceneComponentInitialization=e=>{throw(0,l.S)("AudioSceneComponent")}},710:(e,t,i)=>{i.d(t,{s:()=>s});var n=i(2722);class s{constructor(e,t,i){if(this.loop=!1,this._coneInnerAngle=360,this._coneOuterAngle=360,this._volume=1,this.isPlaying=!1,this.isPaused=!1,this._sounds=[],this._weights=[],t.length!==i.length)throw new Error("Sounds length does not equal weights length");this.loop=e,this._weights=i;let n=0;for(const e of i)n+=e;const s=n>0?1/n:0;for(let e=0;e<this._weights.length;e++)this._weights[e]*=s;this._sounds=t;for(const e of this._sounds)e.onEndedObservable.add((()=>{this._onended()}))}get directionalConeInnerAngle(){return this._coneInnerAngle}set directionalConeInnerAngle(e){if(e!==this._coneInnerAngle){if(this._coneOuterAngle<e)return void n.Y.Error("directionalConeInnerAngle: outer angle of the cone must be superior or equal to the inner angle.");this._coneInnerAngle=e;for(const t of this._sounds)t.directionalConeInnerAngle=e}}get directionalConeOuterAngle(){return this._coneOuterAngle}set directionalConeOuterAngle(e){if(e!==this._coneOuterAngle){if(e<this._coneInnerAngle)return void n.Y.Error("directionalConeOuterAngle: outer angle of the cone must be superior or equal to the inner angle.");this._coneOuterAngle=e;for(const t of this._sounds)t.directionalConeOuterAngle=e}}get volume(){return this._volume}set volume(e){if(e!==this._volume)for(const t of this._sounds)t.setVolume(e)}_onended(){void 0!==this._currentIndex&&(this._sounds[this._currentIndex].autoplay=!1),this.loop&&this.isPlaying?this.play():this.isPlaying=!1}pause(){this.isPaused=!0,void 0!==this._currentIndex&&this._sounds[this._currentIndex].pause()}stop(){this.isPlaying=!1,void 0!==this._currentIndex&&this._sounds[this._currentIndex].stop()}play(e){if(!this.isPaused){this.stop();const e=Math.random();let t=0;for(let i=0;i<this._weights.length;i++)if(t+=this._weights[i],e<=t){this._currentIndex=i;break}}const t=this._sounds[this._currentIndex];t.isReady()?t.play(0,this.isPaused?void 0:e):t.autoplay=!0,this.isPlaying=!0,this.isPaused=!1}}},6981:(e,t,i)=>{i.d(t,{N:()=>h});var n=i(1795),s=i(1057),r=i(1903),o=i(4141),a=i(5757),l=i(2704);class h{constructor(){this._attachedToElement=!1,this._virtualMeshesInfo={},this._tmpVector=new o.P,this._tmpQuaternion=new o._f,this._dragType={NONE:0,DRAG:1,DRAG_WITH_CONTROLLER:2,NEAR_DRAG:3},this._moving=!1,this._dragging=this._dragType.NONE,this.draggableMeshes=null,this.zDragFactor=3,this.currentDraggingPointerIds=[],this.detachCameraControls=!0,this.onDragStartObservable=new a.y$,this.onDragObservable=new a.y$,this.onDragEndObservable=new a.y$,this.allowMultiPointer=!0}get currentDraggingPointerId(){return void 0!==this.currentDraggingPointerIds[0]?this.currentDraggingPointerIds[0]:-1}set currentDraggingPointerId(e){this.currentDraggingPointerIds[0]=e}get currentDraggingPointerID(){return this.currentDraggingPointerId}set currentDraggingPointerID(e){this.currentDraggingPointerId=e}get name(){return"BaseSixDofDrag"}get isMoving(){return this._moving}init(){}get _pointerCamera(){return this._scene.cameraToUseForPointers?this._scene.cameraToUseForPointers:this._scene.activeCamera}_createVirtualMeshInfo(){const e=new n.x("",h._virtualScene);e.rotationQuaternion=new o._f;const t=new n.x("",h._virtualScene);t.rotationQuaternion=new o._f;const i=new n.x("",h._virtualScene);return i.rotationQuaternion=new o._f,{dragging:!1,moving:!1,dragMesh:e,originMesh:t,pivotMesh:i,startingPivotPosition:new o.P,startingPivotOrientation:new o._f,startingPosition:new o.P,startingOrientation:new o._f,lastOriginPosition:new o.P,lastDragPosition:new o.P}}_resetVirtualMeshesPosition(){for(let e=0;e<this.currentDraggingPointerIds.length;e++)this._virtualMeshesInfo[this.currentDraggingPointerIds[e]].pivotMesh.position.copyFrom(this._ownerNode.getAbsolutePivotPoint()),this._virtualMeshesInfo[this.currentDraggingPointerIds[e]].pivotMesh.rotationQuaternion.copyFrom(this._ownerNode.rotationQuaternion),this._virtualMeshesInfo[this.currentDraggingPointerIds[e]].startingPivotPosition.copyFrom(this._virtualMeshesInfo[this.currentDraggingPointerIds[e]].pivotMesh.position),this._virtualMeshesInfo[this.currentDraggingPointerIds[e]].startingPivotOrientation.copyFrom(this._virtualMeshesInfo[this.currentDraggingPointerIds[e]].pivotMesh.rotationQuaternion),this._virtualMeshesInfo[this.currentDraggingPointerIds[e]].startingPosition.copyFrom(this._virtualMeshesInfo[this.currentDraggingPointerIds[e]].dragMesh.position),this._virtualMeshesInfo[this.currentDraggingPointerIds[e]].startingOrientation.copyFrom(this._virtualMeshesInfo[this.currentDraggingPointerIds[e]].dragMesh.rotationQuaternion)}_pointerUpdate2D(e,t,i){!this._pointerCamera||this._pointerCamera.cameraRigMode!=l.V.RIG_MODE_NONE||this._pointerCamera._isLeftCamera||this._pointerCamera._isRightCamera||(e.origin.copyFrom(this._pointerCamera.globalPosition),i=0);const n=this._virtualMeshesInfo[t],s=o.jp.Vector3[0];e.origin.subtractToRef(n.lastOriginPosition,s),n.lastOriginPosition.copyFrom(e.origin);const r=-o.P.Dot(s,e.direction);n.originMesh.addChild(n.dragMesh),n.originMesh.addChild(n.pivotMesh),this._applyZOffset(n.dragMesh,r,i),this._applyZOffset(n.pivotMesh,r,i),n.originMesh.position.copyFrom(e.origin);const a=o.jp.Vector3[0];e.origin.addToRef(e.direction,a),n.originMesh.lookAt(a),n.originMesh.removeChild(n.dragMesh),n.originMesh.removeChild(n.pivotMesh)}_pointerUpdateXR(e,t,i,n){const s=this._virtualMeshesInfo[i];if(s.originMesh.position.copyFrom(e.position),this._dragging===this._dragType.NEAR_DRAG&&t?s.originMesh.rotationQuaternion.copyFrom(t.rotationQuaternion):s.originMesh.rotationQuaternion.copyFrom(e.rotationQuaternion),s.pivotMesh.computeWorldMatrix(!0),s.dragMesh.computeWorldMatrix(!0),0!==n){const e=o.jp.Vector3[0],t=o.jp.Vector3[1];e.copyFrom(this._pointerCamera.getForwardRay().direction),s.originMesh.position.subtractToRef(s.lastOriginPosition,t),s.lastOriginPosition.copyFrom(s.originMesh.position);const i=t.length();t.normalize();const r=o.jp.Vector3[2],a=o.jp.Vector3[3];s.dragMesh.absolutePosition.subtractToRef(this._pointerCamera.globalPosition,r),s.dragMesh.absolutePosition.subtractToRef(s.originMesh.position,a);const l=a.length();r.normalize(),a.normalize();let h=Math.abs(o.P.Dot(t,a))*o.P.Dot(t,e)*n*i*l;const c=.01;h<0&&c-l>h&&(h=Math.min(c-l,0)),a.scaleInPlace(h),a.addToRef(s.pivotMesh.absolutePosition,this._tmpVector),s.pivotMesh.setAbsolutePosition(this._tmpVector),a.addToRef(s.dragMesh.absolutePosition,this._tmpVector),s.dragMesh.setAbsolutePosition(this._tmpVector)}}attach(e){this._ownerNode=e,this._scene=this._ownerNode.getScene(),h._virtualScene||(h._virtualScene=new s.x(this._scene.getEngine(),{virtual:!0}),h._virtualScene.detachControl());const t=e=>this._ownerNode===e||e.isDescendantOf(this._ownerNode)&&(!this.draggableMeshes||-1!==this.draggableMeshes.indexOf(e));this._pointerObserver=this._scene.onPointerObservable.add((e=>{const i=e.event.pointerId;this._virtualMeshesInfo[i]||(this._virtualMeshesInfo[i]=this._createVirtualMeshInfo());const n=this._virtualMeshesInfo[i],s="xr-near"===e.event.pointerType;if(e.type==r.kD.POINTERDOWN){if(!n.dragging&&e.pickInfo&&e.pickInfo.hit&&e.pickInfo.pickedMesh&&e.pickInfo.pickedPoint&&e.pickInfo.ray&&(!s||e.pickInfo.aimTransform)&&t(e.pickInfo.pickedMesh)){if(!this.allowMultiPointer&&this.currentDraggingPointerIds.length>0)return;!this._pointerCamera||this._pointerCamera.cameraRigMode!==l.V.RIG_MODE_NONE||this._pointerCamera._isLeftCamera||this._pointerCamera._isRightCamera||e.pickInfo.ray.origin.copyFrom(this._pointerCamera.globalPosition),this._ownerNode.computeWorldMatrix(!0);const t=this._virtualMeshesInfo[i];s?(this._dragging=e.pickInfo.originMesh?this._dragType.NEAR_DRAG:this._dragType.DRAG_WITH_CONTROLLER,t.originMesh.position.copyFrom(e.pickInfo.aimTransform.position),this._dragging===this._dragType.NEAR_DRAG&&e.pickInfo.gripTransform?t.originMesh.rotationQuaternion.copyFrom(e.pickInfo.gripTransform.rotationQuaternion):t.originMesh.rotationQuaternion.copyFrom(e.pickInfo.aimTransform.rotationQuaternion)):(this._dragging=this._dragType.DRAG,t.originMesh.position.copyFrom(e.pickInfo.ray.origin)),t.lastOriginPosition.copyFrom(t.originMesh.position),t.dragMesh.position.copyFrom(e.pickInfo.pickedPoint),t.lastDragPosition.copyFrom(e.pickInfo.pickedPoint),t.pivotMesh.position.copyFrom(this._ownerNode.getAbsolutePivotPoint()),t.pivotMesh.rotationQuaternion.copyFrom(this._ownerNode.absoluteRotationQuaternion),t.startingPosition.copyFrom(t.dragMesh.position),t.startingPivotPosition.copyFrom(t.pivotMesh.position),t.startingOrientation.copyFrom(t.dragMesh.rotationQuaternion),t.startingPivotOrientation.copyFrom(t.pivotMesh.rotationQuaternion),s?(t.originMesh.addChild(t.dragMesh),t.originMesh.addChild(t.pivotMesh)):t.originMesh.lookAt(t.dragMesh.position),t.dragging=!0,-1===this.currentDraggingPointerIds.indexOf(i)&&this.currentDraggingPointerIds.push(i),this.detachCameraControls&&this._pointerCamera&&!this._pointerCamera.leftCamera&&(this._pointerCamera.inputs&&this._pointerCamera.inputs.attachedToElement?(this._pointerCamera.detachControl(),this._attachedToElement=!0):this._attachedToElement=!1),this._targetDragStart(t.pivotMesh.position,t.pivotMesh.rotationQuaternion,i),this.onDragStartObservable.notifyObservers({position:t.pivotMesh.position})}}else if(e.type==r.kD.POINTERUP||e.type==r.kD.POINTERDOUBLETAP){const e=this.currentDraggingPointerIds.indexOf(i);n.dragging=!1,-1!==e&&(this.currentDraggingPointerIds.splice(e,1),0===this.currentDraggingPointerIds.length&&(this._moving=!1,this._dragging=this._dragType.NONE,this.detachCameraControls&&this._attachedToElement&&this._pointerCamera&&!this._pointerCamera.leftCamera&&(this._reattachCameraControls(),this._attachedToElement=!1)),n.originMesh.removeChild(n.dragMesh),n.originMesh.removeChild(n.pivotMesh),this._targetDragEnd(i),this.onDragEndObservable.notifyObservers({}))}else if(e.type==r.kD.POINTERMOVE&&-1!==this.currentDraggingPointerIds.indexOf(i)&&n.dragging&&e.pickInfo&&(e.pickInfo.ray||e.pickInfo.aimTransform)){let t=this.zDragFactor;(this.currentDraggingPointerIds.length>1||e.pickInfo.originMesh)&&(t=0),this._ownerNode.computeWorldMatrix(!0),s?this._pointerUpdateXR(e.pickInfo.aimTransform,e.pickInfo.gripTransform,i,t):this._pointerUpdate2D(e.pickInfo.ray,i,t),this._tmpQuaternion.copyFrom(n.startingPivotOrientation),this._tmpQuaternion.x=-this._tmpQuaternion.x,this._tmpQuaternion.y=-this._tmpQuaternion.y,this._tmpQuaternion.z=-this._tmpQuaternion.z,n.pivotMesh.absoluteRotationQuaternion.multiplyToRef(this._tmpQuaternion,this._tmpQuaternion),n.pivotMesh.absolutePosition.subtractToRef(n.startingPivotPosition,this._tmpVector),this.onDragObservable.notifyObservers({delta:this._tmpVector,position:n.pivotMesh.position,pickInfo:e.pickInfo}),this._targetDrag(this._tmpVector,this._tmpQuaternion,i),n.lastDragPosition.copyFrom(n.dragMesh.absolutePosition),this._moving=!0}}))}_applyZOffset(e,t,i){e.position.z-=e.position.z<1?t*i:t*i*e.position.z,e.position.z<0&&(e.position.z=0)}_targetDragStart(e,t,i){}_targetDrag(e,t,i){}_targetDragEnd(e){}_reattachCameraControls(){if(this._pointerCamera)if("ArcRotateCamera"===this._pointerCamera.getClassName()){const e=this._pointerCamera;e.attachControl(!e.inputs||e.inputs.noPreventDefault,e._useCtrlForPanning,e._panningMouseButton)}else this._pointerCamera.attachControl(!this._pointerCamera.inputs||this._pointerCamera.inputs.noPreventDefault)}detach(){this._scene&&(this.detachCameraControls&&this._attachedToElement&&this._pointerCamera&&!this._pointerCamera.leftCamera&&(this._reattachCameraControls(),this._attachedToElement=!1),this._scene.onPointerObservable.remove(this._pointerObserver));for(const e in this._virtualMeshesInfo)this._virtualMeshesInfo[e].originMesh.dispose(),this._virtualMeshesInfo[e].dragMesh.dispose();this.onDragEndObservable.clear(),this.onDragObservable.clear(),this.onDragStartObservable.clear()}}},1809:(e,t,i)=>{i.d(t,{Y:()=>n});class n{get delay(){return this.fadeInDelay}set delay(e){this.fadeInDelay=e,this.fadeOutDelay=e}constructor(){this.fadeInDelay=0,this.fadeOutDelay=0,this.fadeInTime=300,this.fadeOutTime=300,this._millisecondsPerFrame=1e3/60,this._hovered=!1,this._hoverValue=0,this._ownerNode=null,this._delay=0,this._time=300,this._update=()=>{if(this._ownerNode){if(this._hoverValue+=this._hovered?this._millisecondsPerFrame:-this._millisecondsPerFrame,this._setAllVisibility(this._ownerNode,(this._hoverValue-this._delay)/this._time),this._ownerNode.visibility>1){if(this._setAllVisibility(this._ownerNode,1),this._hoverValue>this._time)return this._hoverValue=this._time,void this._detachObserver()}else if(this._ownerNode.visibility<0&&(this._setAllVisibility(this._ownerNode,0),this._hoverValue<0))return this._hoverValue=0,void this._detachObserver();this._attachObserver()}}}get name(){return"FadeInOut"}init(){}attach(e){this._ownerNode=e,this._setAllVisibility(this._ownerNode,0)}detach(){this._ownerNode=null}fadeIn(e=!0){this._delay=e?this.fadeInDelay:this.fadeOutDelay,this._time=e?this.fadeInTime:this.fadeOutTime,this._detachObserver(),this._ownerNode&&(e&&this._ownerNode.visibility>=1||!e&&this._ownerNode.visibility<=0)||(this._hovered=e,this._hovered||(this._delay*=-1),this._ownerNode.visibility>=1?this._hoverValue=this._time:this._ownerNode.visibility<=0&&(this._hoverValue=0),this._update())}fadeOut(){this.fadeIn(!1)}_setAllVisibility(e,t){e.visibility=t,e.getChildMeshes().forEach((e=>{this._setAllVisibility(e,t)}))}_attachObserver(){var e;this._onBeforeRenderObserver||(this._onBeforeRenderObserver=null===(e=this._ownerNode)||void 0===e?void 0:e.getScene().onBeforeRenderObservable.add(this._update))}_detachObserver(){var e;this._onBeforeRenderObserver&&(null===(e=this._ownerNode)||void 0===e||e.getScene().onBeforeRenderObservable.remove(this._onBeforeRenderObserver),this._onBeforeRenderObserver=null)}}},4095:(e,t,i)=>{i.d(t,{j:()=>o});var n=i(4141),s=i(1128),r=i(1341);class o{constructor(){this._tmpQuaternion=new n._f,this._tmpVectors=[new n.P,new n.P,new n.P,new n.P,new n.P,new n.P,new n.P],this._tmpMatrix=new n.y3,this._tmpInvertView=new n.y3,this._tmpForward=new n.P,this._tmpNodeForward=new n.P,this._tmpPosition=new n.P,this._workingPosition=new n.P,this._workingQuaternion=new n._f,this._lastTick=-1,this._recenterNextUpdate=!0,this.interpolatePose=!0,this.lerpTime=500,this.ignoreCameraPitchAndRoll=!1,this.pitchOffset=15,this.maxViewVerticalDegrees=30,this.maxViewHorizontalDegrees=30,this.orientToCameraDeadzoneDegrees=60,this.ignoreDistanceClamp=!1,this.ignoreAngleClamp=!1,this.verticalMaxDistance=0,this.defaultDistance=.8,this.maximumDistance=2,this.minimumDistance=.3,this.useFixedVerticalOffset=!1,this.fixedVerticalOffset=0,this._enabled=!0}get followedCamera(){return this._followedCamera||this._scene.activeCamera}set followedCamera(e){this._followedCamera=e}get name(){return"Follow"}init(){}attach(e,t){this._scene=e.getScene(),this.attachedNode=e,t&&(this.followedCamera=t),this._addObservables()}detach(){this.attachedNode=null,this._removeObservables()}recenter(){this._recenterNextUpdate=!0}_angleBetweenVectorAndPlane(e,t){return this._tmpVectors[0].copyFrom(e),e=this._tmpVectors[0],this._tmpVectors[1].copyFrom(t),t=this._tmpVectors[1],e.normalize(),t.normalize(),Math.PI/2-Math.acos(n.P.Dot(e,t))}_length2D(e){return Math.sqrt(e.x*e.x+e.z*e.z)}_distanceClamp(e,t=!1){let i=this.minimumDistance,n=this.maximumDistance;const r=this.defaultDistance,o=this._tmpVectors[0];o.copyFrom(e);let a=o.length();if(o.normalizeFromLength(a),this.ignoreCameraPitchAndRoll){i=this._length2D(o)*i,n=this._length2D(o)*n;const t=this._length2D(e);o.scaleInPlace(a/t),a=t}let l=a;return l=t?r:s.R.Clamp(a,i,n),e.copyFrom(o).scaleInPlace(l),a!==l}_applyVerticalClamp(e){0!==this.verticalMaxDistance&&(e.y=s.R.Clamp(e.y,-this.verticalMaxDistance,this.verticalMaxDistance))}_toOrientationQuatToRef(e,t){n._f.RotationYawPitchRollToRef(Math.atan2(e.x,e.z),Math.atan2(e.y,Math.sqrt(e.z*e.z+e.x*e.x)),0,t)}_applyPitchOffset(e){const t=this._tmpVectors[0],i=this._tmpVectors[1];t.copyFromFloats(0,0,this._scene.useRightHandedSystem?-1:1),i.copyFromFloats(1,0,0),n.P.TransformNormalToRef(t,e,t),t.y=0,t.normalize(),n.P.TransformNormalToRef(i,e,i),n._f.RotationAxisToRef(i,this.pitchOffset*Math.PI/180,this._tmpQuaternion),t.rotateByQuaternionToRef(this._tmpQuaternion,t),this._toOrientationQuatToRef(t,this._tmpQuaternion),this._tmpQuaternion.toRotationMatrix(this._tmpMatrix),e.copyFrom(this._tmpMatrix)}_angularClamp(e,t){const i=this._tmpVectors[5];i.copyFromFloats(0,0,this._scene.useRightHandedSystem?-1:1);const s=this._tmpVectors[6];s.copyFromFloats(1,0,0),n.P.TransformNormalToRef(i,e,i),n.P.TransformNormalToRef(s,e,s);const o=n.P.UpReadOnly;if(t.length()<r.kn)return!1;let a=!1;const l=this._tmpQuaternion;if(this.ignoreCameraPitchAndRoll){const e=n.P.GetAngleBetweenVectorsOnPlane(t,i,s);n._f.RotationAxisToRef(s,e,l),t.rotateByQuaternionToRef(l,t)}else{const e=-n.P.GetAngleBetweenVectorsOnPlane(t,i,s),r=this.maxViewVerticalDegrees*Math.PI/180*.5;e<-r?(n._f.RotationAxisToRef(s,-e-r,l),t.rotateByQuaternionToRef(l,t),a=!0):e>r&&(n._f.RotationAxisToRef(s,-e+r,l),t.rotateByQuaternionToRef(l,t),a=!0)}const h=this._angleBetweenVectorAndPlane(t,s)*(this._scene.useRightHandedSystem?-1:1),c=this.maxViewHorizontalDegrees*Math.PI/180*.5;return h<-c?(n._f.RotationAxisToRef(o,-h-c,l),t.rotateByQuaternionToRef(l,t),a=!0):h>c&&(n._f.RotationAxisToRef(o,-h+c,l),t.rotateByQuaternionToRef(l,t),a=!0),a}_orientationClamp(e,t){var i;const s=this._tmpVectors[0];s.copyFrom(e).scaleInPlace(-1).normalize();const o=this._tmpVectors[1],a=this._tmpVectors[2];o.copyFromFloats(0,1,0),n.P.CrossToRef(s,o,a);const l=a.length();l<r.kn||(a.normalizeFromLength(l),n.P.CrossToRef(a,s,o),(null===(i=this.attachedNode)||void 0===i?void 0:i.getScene().useRightHandedSystem)?n._f.FromLookDirectionRHToRef(s,o,t):n._f.FromLookDirectionLHToRef(s,o,t))}_passedOrientationDeadzone(e,t){const i=this._tmpVectors[5];return i.copyFrom(e),i.normalize(),180*Math.abs(n.P.GetAngleBetweenVectorsOnPlane(t,i,n.P.UpReadOnly))/Math.PI>this.orientToCameraDeadzoneDegrees}_updateLeashing(e){if(this.attachedNode&&this._enabled){const t=this.attachedNode.parent;this.attachedNode.setParent(null);const i=this.attachedNode.getWorldMatrix(),s=this._workingPosition,r=this._workingQuaternion,o=this.attachedNode.getPivotPoint(),a=this._tmpInvertView;a.copyFrom(e.getViewMatrix()),a.invert(),n.P.TransformCoordinatesToRef(o,i,s);const l=this._tmpPosition;l.copyFromFloats(0,0,0),n.P.TransformCoordinatesToRef(l,i,l),l.scaleInPlace(-1).subtractInPlace(o),s.subtractInPlace(e.globalPosition),this.ignoreCameraPitchAndRoll&&this._applyPitchOffset(a);let h=!1;const c=this._tmpForward;c.copyFromFloats(0,0,this._scene.useRightHandedSystem?-1:1),n.P.TransformNormalToRef(c,a,c);const u=this._tmpNodeForward;if(u.copyFromFloats(0,0,this._scene.useRightHandedSystem?-1:1),n.P.TransformNormalToRef(u,i,u),this._recenterNextUpdate)s.copyFrom(c).scaleInPlace(this.defaultDistance);else if(this.ignoreAngleClamp){const e=s.length();s.copyFrom(c).scaleInPlace(e)}else h=this._angularClamp(a,s);let d=!1;this.ignoreDistanceClamp||(d=this._distanceClamp(s,h),this._applyVerticalClamp(s)),this.useFixedVerticalOffset&&(s.y=l.y-e.globalPosition.y+this.fixedVerticalOffset),(h||d||this._passedOrientationDeadzone(s,u)||this._recenterNextUpdate)&&this._orientationClamp(s,r),this._workingPosition.subtractInPlace(o),this._recenterNextUpdate=!1,this.attachedNode.setParent(t)}}_updateTransformToGoal(e){if(!this.attachedNode||!this.followedCamera||!this._enabled)return;this.attachedNode.rotationQuaternion||(this.attachedNode.rotationQuaternion=n._f.Identity());const t=this.attachedNode.parent;if(this.attachedNode.setParent(null),!this.interpolatePose)return this.attachedNode.position.copyFrom(this.followedCamera.globalPosition).addInPlace(this._workingPosition),void this.attachedNode.rotationQuaternion.copyFrom(this._workingQuaternion);const i=new n.P;i.copyFrom(this.attachedNode.position).subtractInPlace(this.followedCamera.globalPosition),n.P.SmoothToRef(i,this._workingPosition,e,this.lerpTime,i),i.addInPlace(this.followedCamera.globalPosition),this.attachedNode.position.copyFrom(i);const s=new n._f;s.copyFrom(this.attachedNode.rotationQuaternion),n._f.SmoothToRef(s,this._workingQuaternion,e,this.lerpTime,this.attachedNode.rotationQuaternion),this.attachedNode.setParent(t)}_addObservables(){this._lastTick=Date.now(),this._onBeforeRender=this._scene.onBeforeRenderObservable.add((()=>{if(!this.followedCamera)return;const e=Date.now();this._updateLeashing(this.followedCamera),this._updateTransformToGoal(e-this._lastTick),this._lastTick=e}))}_removeObservables(){this._onBeforeRender&&this._scene.onBeforeRenderObservable.remove(this._onBeforeRender)}}},4184:(e,t,i)=>{i.d(t,{$6:()=>n,bH:()=>r,q_:()=>c,rX:()=>s});var n,s,r,o=i(4370),a=i(9596),l=i(4141),h=i(7257);!function(e){e[e.ABOVE_FINGER_TIPS=0]="ABOVE_FINGER_TIPS",e[e.RADIAL_SIDE=1]="RADIAL_SIDE",e[e.ULNAR_SIDE=2]="ULNAR_SIDE",e[e.BELOW_WRIST=3]="BELOW_WRIST"}(n||(n={})),function(e){e[e.LOOK_AT_CAMERA=0]="LOOK_AT_CAMERA",e[e.HAND_ROTATION=1]="HAND_ROTATION"}(s||(s={})),function(e){e[e.ALWAYS_VISIBLE=0]="ALWAYS_VISIBLE",e[e.PALM_UP=1]="PALM_UP",e[e.GAZE_FOCUS=2]="GAZE_FOCUS",e[e.PALM_AND_GAZE=3]="PALM_AND_GAZE"}(r||(r={}));class c{constructor(){this._sceneRenderObserver=null,this._zoneAxis={},this.handConstraintVisibility=r.PALM_AND_GAZE,this.palmUpStrictness=.95,this.gazeProximityRadius=.15,this.targetOffset=.1,this.targetZone=n.ULNAR_SIDE,this.zoneOrientationMode=s.HAND_ROTATION,this.nodeOrientationMode=s.HAND_ROTATION,this.handedness="none",this.lerpTime=100,this._zoneAxis[n.ABOVE_FINGER_TIPS]=new l.P(0,1,0),this._zoneAxis[n.RADIAL_SIDE]=new l.P(-1,0,0),this._zoneAxis[n.ULNAR_SIDE]=new l.P(1,0,0),this._zoneAxis[n.BELOW_WRIST]=new l.P(0,-1,0)}get name(){return"HandConstraint"}enable(){this._node.setEnabled(!0)}disable(){this._node.setEnabled(!1)}_getHandPose(){if(!this._handTracking)return null;let e;if(e="none"===this.handedness?this._handTracking.getHandByHandedness("left")||this._handTracking.getHandByHandedness("right"):this._handTracking.getHandByHandedness(this.handedness),e){const t=e.getJointMesh(a.fL.PINKY_FINGER_METACARPAL),i=e.getJointMesh(a.fL.MIDDLE_FINGER_METACARPAL),n=e.getJointMesh(a.fL.WRIST);if(n&&i&&t){const s={position:i.absolutePosition,quaternion:new l._f,id:e.xrController.uniqueId},r=l.jp.Vector3[0],o=l.jp.Vector3[1],a=l.jp.Vector3[2];return r.copyFrom(i.absolutePosition).subtractInPlace(n.absolutePosition).normalize(),o.copyFrom(t.absolutePosition).subtractInPlace(i.absolutePosition).normalize(),l.P.CrossToRef(r,o,o),l.P.CrossToRef(o,r,a),l._f.FromLookDirectionLHToRef(o,r,s.quaternion),s}}return null}init(){}attach(e){this._node=e,this._scene=e.getScene(),this._node.rotationQuaternion||(this._node.rotationQuaternion=l._f.RotationYawPitchRoll(this._node.rotation.y,this._node.rotation.x,this._node.rotation.z));let t=Date.now();this._sceneRenderObserver=this._scene.onBeforeRenderObservable.add((()=>{const e=this._getHandPose();if(this._node.reservedDataStore=this._node.reservedDataStore||{},this._node.reservedDataStore.nearInteraction=this._node.reservedDataStore.nearInteraction||{},this._node.reservedDataStore.nearInteraction.excludedControllerId=null,e){const i=l.jp.Vector3[0],n=this._scene.activeCamera;i.copyFrom(this._zoneAxis[this.targetZone]);const r=l.jp.Quaternion[0];if(n&&(this.zoneOrientationMode===s.LOOK_AT_CAMERA||this.nodeOrientationMode===s.LOOK_AT_CAMERA)){const t=l.jp.Vector3[1];t.copyFrom(n.position).subtractInPlace(e.position).normalize(),this._scene.useRightHandedSystem?l._f.FromLookDirectionRHToRef(t,l.P.UpReadOnly,r):l._f.FromLookDirectionLHToRef(t,l.P.UpReadOnly,r)}this.zoneOrientationMode===s.HAND_ROTATION?e.quaternion.toRotationMatrix(l.jp.Matrix[0]):r.toRotationMatrix(l.jp.Matrix[0]),l.P.TransformNormalToRef(i,l.jp.Matrix[0],i),i.scaleInPlace(this.targetOffset);const o=l.jp.Vector3[2],a=l.jp.Quaternion[1];o.copyFrom(e.position).addInPlace(i),this.nodeOrientationMode===s.HAND_ROTATION?a.copyFrom(e.quaternion):a.copyFrom(r);const h=Date.now()-t;l.P.SmoothToRef(this._node.position,o,h,this.lerpTime,this._node.position),l._f.SmoothToRef(this._node.rotationQuaternion,a,h,this.lerpTime,this._node.rotationQuaternion),this._node.reservedDataStore.nearInteraction.excludedControllerId=e.id}this._setVisibility(e),t=Date.now()}))}_setVisibility(e){let t=!0,i=!0;const n=this._scene.activeCamera;if(n){const s=n.getForwardRay();if(this.handConstraintVisibility===r.GAZE_FOCUS||this.handConstraintVisibility===r.PALM_AND_GAZE){let t;i=!1,this._eyeTracking&&(t=this._eyeTracking.getEyeGaze()),t=t||s;const n=l.jp.Vector3[0];e?e.position.subtractToRef(t.origin,n):this._node.getAbsolutePosition().subtractToRef(t.origin,n);const r=l.P.Dot(n,t.direction),o=r*r;r>0&&n.lengthSquared()-o<this.gazeProximityRadius*this.gazeProximityRadius&&(i=!0)}if((this.handConstraintVisibility===r.PALM_UP||this.handConstraintVisibility===r.PALM_AND_GAZE)&&(t=!1,e)){const i=l.jp.Vector3[0];l.P.LeftHandedForwardReadOnly.rotateByQuaternionToRef(e.quaternion,i),l.P.Dot(i,s.direction)>2*this.palmUpStrictness-1&&(t=!0)}}this._node.setEnabled(t&&i)}detach(){this._scene.onBeforeRenderObservable.remove(this._sceneRenderObserver)}linkToXRExperience(e){const t=e.featuresManager?e.featuresManager:e;if(t){try{this._eyeTracking=t.getEnabledFeature(o.b.EYE_TRACKING)}catch(e){}try{this._handTracking=t.getEnabledFeature(o.b.HAND_TRACKING)}catch(e){h.w1.Error("Hand tracking must be enabled for the Hand Menu to work")}}else h.w1.Error("XR features manager must be available or provided directly for the Hand Menu to work")}}},9778:(e,t,i)=>{i.d(t,{M:()=>u});var n=i(4496),s=i(1057),r=i(5757),o=i(4141),a=i(1903),l=i(450),h=i(6746),c=i(3615);class u{get currentDraggingPointerID(){return this.currentDraggingPointerId}set currentDraggingPointerID(e){this.currentDraggingPointerId=e}set enabled(e){e!=this._enabled&&this.onEnabledObservable.notifyObservers(e),this._enabled=e}get enabled(){return this._enabled}get options(){return this._options}set options(e){this._options=e}constructor(e){this._useAlternatePickedPointAboveMaxDragAngleDragSpeed=-1.1,this._activeDragButton=-1,this.maxDragAngle=0,this.dragButtons=[0,1,2],this._useAlternatePickedPointAboveMaxDragAngle=!1,this.currentDraggingPointerId=-1,this.dragging=!1,this.dragDeltaRatio=.2,this.updateDragPlane=!0,this._debugMode=!1,this._moving=!1,this.onDragObservable=new r.y$,this.onDragStartObservable=new r.y$,this.onDragEndObservable=new r.y$,this.onEnabledObservable=new r.y$,this.moveAttached=!0,this._enabled=!0,this.startAndReleaseDragOnPointerEvents=!0,this.detachCameraControls=!0,this.useObjectOrientationForDragging=!0,this.validateDrag=e=>!0,this._tmpVector=new o.P(0,0,0),this._alternatePickedPoint=new o.P(0,0,0),this._worldDragAxis=new o.P(0,0,0),this._targetPosition=new o.P(0,0,0),this._attachedToElement=!1,this._startDragRay=new l.z(new o.P,new o.P),this._lastPointerRay={},this._dragDelta=new o.P,this._pointA=new o.P(0,0,0),this._pointC=new o.P(0,0,0),this._localAxis=new o.P(0,0,0),this._lookAt=new o.P(0,0,0),this._options=e||{};let t=0;if(this._options.dragAxis&&t++,this._options.dragPlaneNormal&&t++,t>1)throw"Multiple drag modes specified in dragBehavior options. Only one expected"}get name(){return"PointerDrag"}init(){}attach(e,t){this._scene=e.getScene(),e.isNearGrabbable=!0,this.attachedNode=e,u._PlaneScene||(this._debugMode?u._PlaneScene=this._scene:(u._PlaneScene=new s.x(this._scene.getEngine(),{virtual:!0}),u._PlaneScene.detachControl(),this._scene.onDisposeObservable.addOnce((()=>{u._PlaneScene.dispose(),u._PlaneScene=null})))),this._dragPlane=(0,c.pT)("pointerDragPlane",{size:this._debugMode?1:1e4,updatable:!1,sideOrientation:n.Kj.DOUBLESIDE},u._PlaneScene),this.lastDragPosition=new o.P(0,0,0);const i=t||(e=>this.attachedNode==e||e.isDescendantOf(this.attachedNode));this._pointerObserver=this._scene.onPointerObservable.add((e=>{if(this.enabled){if(e.type==a.kD.POINTERDOWN)this.startAndReleaseDragOnPointerEvents&&!this.dragging&&e.pickInfo&&e.pickInfo.hit&&e.pickInfo.pickedMesh&&e.pickInfo.pickedPoint&&e.pickInfo.ray&&i(e.pickInfo.pickedMesh)&&-1===this._activeDragButton&&-1!==this.dragButtons.indexOf(e.event.button)&&(this._activeDragButton=e.event.button,this._activePointerInfo=e,this._startDrag(e.event.pointerId,e.pickInfo.ray,e.pickInfo.pickedPoint));else if(e.type==a.kD.POINTERUP)!this.startAndReleaseDragOnPointerEvents||this.currentDraggingPointerId!=e.event.pointerId||this._activeDragButton!==e.event.button&&-1!==this._activeDragButton||this.releaseDrag();else if(e.type==a.kD.POINTERMOVE){const t=e.event.pointerId;if(this.currentDraggingPointerId===u._AnyMouseId&&t!==u._AnyMouseId){const i=e.event;("mouse"===i.pointerType||!this._scene.getEngine().hostInformation.isMobile&&i instanceof MouseEvent)&&(this._lastPointerRay[this.currentDraggingPointerId]&&(this._lastPointerRay[t]=this._lastPointerRay[this.currentDraggingPointerId],delete this._lastPointerRay[this.currentDraggingPointerId]),this.currentDraggingPointerId=t)}this._lastPointerRay[t]||(this._lastPointerRay[t]=new l.z(new o.P,new o.P)),e.pickInfo&&e.pickInfo.ray&&(this._lastPointerRay[t].origin.copyFrom(e.pickInfo.ray.origin),this._lastPointerRay[t].direction.copyFrom(e.pickInfo.ray.direction),this.currentDraggingPointerId==t&&this.dragging&&this._moveDrag(e.pickInfo.ray))}}else this._attachedToElement&&this.releaseDrag()})),this._beforeRenderObserver=this._scene.onBeforeRenderObservable.add((()=>{if(this._moving&&this.moveAttached){let e=!1;h.m._RemoveAndStorePivotPoint(this.attachedNode),this._targetPosition.subtractToRef(this.attachedNode.absolutePosition,this._tmpVector),this._tmpVector.scaleInPlace(this.dragDeltaRatio),this.attachedNode.getAbsolutePosition().addToRef(this._tmpVector,this._tmpVector),this.validateDrag(this._tmpVector)&&(this.attachedNode.setAbsolutePosition(this._tmpVector),e=!0),h.m._RestorePivotPoint(this.attachedNode),e&&this.attachedNode.computeWorldMatrix()}}))}releaseDrag(){if(this.dragging&&(this.dragging=!1,this.onDragEndObservable.notifyObservers({dragPlanePoint:this.lastDragPosition,pointerId:this.currentDraggingPointerId,pointerInfo:this._activePointerInfo})),this.currentDraggingPointerId=-1,this._activeDragButton=-1,this._activePointerInfo=null,this._moving=!1,this.detachCameraControls&&this._attachedToElement&&this._scene.activeCamera&&!this._scene.activeCamera.leftCamera){if("ArcRotateCamera"===this._scene.activeCamera.getClassName()){const e=this._scene.activeCamera;e.attachControl(!e.inputs||e.inputs.noPreventDefault,e._useCtrlForPanning,e._panningMouseButton)}else this._scene.activeCamera.attachControl(!this._scene.activeCamera.inputs||this._scene.activeCamera.inputs.noPreventDefault);this._attachedToElement=!1}}startDrag(e=u._AnyMouseId,t,i){this._startDrag(e,t,i);let n=this._lastPointerRay[e];e===u._AnyMouseId&&(n=this._lastPointerRay[Object.keys(this._lastPointerRay)[0]]),n&&this._moveDrag(n)}_startDrag(e,t,i){if(!this._scene.activeCamera||this.dragging||!this.attachedNode)return;h.m._RemoveAndStorePivotPoint(this.attachedNode),t?(this._startDragRay.direction.copyFrom(t.direction),this._startDragRay.origin.copyFrom(t.origin)):(this._startDragRay.origin.copyFrom(this._scene.activeCamera.position),this.attachedNode.getWorldMatrix().getTranslationToRef(this._tmpVector),this._tmpVector.subtractToRef(this._scene.activeCamera.position,this._startDragRay.direction)),this._updateDragPlanePosition(this._startDragRay,i||this._tmpVector);const n=this._pickWithRayOnDragPlane(this._startDragRay);n?(this.dragging=!0,this.currentDraggingPointerId=e,this.lastDragPosition.copyFrom(n),this.onDragStartObservable.notifyObservers({dragPlanePoint:n,pointerId:this.currentDraggingPointerId,pointerInfo:this._activePointerInfo}),this._targetPosition.copyFrom(this.attachedNode.getAbsolutePosition()),this.detachCameraControls&&this._scene.activeCamera&&this._scene.activeCamera.inputs&&!this._scene.activeCamera.leftCamera&&(this._scene.activeCamera.inputs.attachedToElement?(this._scene.activeCamera.detachControl(),this._attachedToElement=!0):this._attachedToElement=!1)):this.releaseDrag(),h.m._RestorePivotPoint(this.attachedNode)}_moveDrag(e){this._moving=!0;const t=this._pickWithRayOnDragPlane(e);if(t){h.m._RemoveAndStorePivotPoint(this.attachedNode),this.updateDragPlane&&this._updateDragPlanePosition(e,t);let i=0;this._options.dragAxis?(this.useObjectOrientationForDragging?o.P.TransformCoordinatesToRef(this._options.dragAxis,this.attachedNode.getWorldMatrix().getRotationMatrix(),this._worldDragAxis):this._worldDragAxis.copyFrom(this._options.dragAxis),t.subtractToRef(this.lastDragPosition,this._tmpVector),i=o.P.Dot(this._tmpVector,this._worldDragAxis),this._worldDragAxis.scaleToRef(i,this._dragDelta)):(i=this._dragDelta.length(),t.subtractToRef(this.lastDragPosition,this._dragDelta)),this._targetPosition.addInPlace(this._dragDelta),this.onDragObservable.notifyObservers({dragDistance:i,delta:this._dragDelta,dragPlanePoint:t,dragPlaneNormal:this._dragPlane.forward,pointerId:this.currentDraggingPointerId,pointerInfo:this._activePointerInfo}),this.lastDragPosition.copyFrom(t),h.m._RestorePivotPoint(this.attachedNode)}}_pickWithRayOnDragPlane(e){if(!e)return null;let t=Math.acos(o.P.Dot(this._dragPlane.forward,e.direction));if(t>Math.PI/2&&(t=Math.PI-t),this.maxDragAngle>0&&t>this.maxDragAngle){if(this._useAlternatePickedPointAboveMaxDragAngle){this._tmpVector.copyFrom(e.direction),this.attachedNode.absolutePosition.subtractToRef(e.origin,this._alternatePickedPoint),this._alternatePickedPoint.normalize(),this._alternatePickedPoint.scaleInPlace(this._useAlternatePickedPointAboveMaxDragAngleDragSpeed*o.P.Dot(this._alternatePickedPoint,this._tmpVector)),this._tmpVector.addInPlace(this._alternatePickedPoint);const t=o.P.Dot(this._dragPlane.forward,this._tmpVector);return this._dragPlane.forward.scaleToRef(-t,this._alternatePickedPoint),this._alternatePickedPoint.addInPlace(this._tmpVector),this._alternatePickedPoint.addInPlace(this.attachedNode.absolutePosition),this._alternatePickedPoint}return null}const i=u._PlaneScene.pickWithRay(e,(e=>e==this._dragPlane));return i&&i.hit&&i.pickedMesh&&i.pickedPoint?i.pickedPoint:null}_updateDragPlanePosition(e,t){this._pointA.copyFrom(t),this._options.dragAxis?(this.useObjectOrientationForDragging?o.P.TransformCoordinatesToRef(this._options.dragAxis,this.attachedNode.getWorldMatrix().getRotationMatrix(),this._localAxis):this._localAxis.copyFrom(this._options.dragAxis),e.origin.subtractToRef(this._pointA,this._pointC),this._pointC.normalize(),Math.abs(o.P.Dot(this._localAxis,this._pointC))>.999?Math.abs(o.P.Dot(o.P.UpReadOnly,this._pointC))>.999?this._lookAt.copyFrom(o.P.Right()):this._lookAt.copyFrom(o.P.UpReadOnly):(o.P.CrossToRef(this._localAxis,this._pointC,this._lookAt),o.P.CrossToRef(this._localAxis,this._lookAt,this._lookAt),this._lookAt.normalize()),this._dragPlane.position.copyFrom(this._pointA),this._pointA.addToRef(this._lookAt,this._lookAt),this._dragPlane.lookAt(this._lookAt)):this._options.dragPlaneNormal?(this.useObjectOrientationForDragging?o.P.TransformCoordinatesToRef(this._options.dragPlaneNormal,this.attachedNode.getWorldMatrix().getRotationMatrix(),this._localAxis):this._localAxis.copyFrom(this._options.dragPlaneNormal),this._dragPlane.position.copyFrom(this._pointA),this._pointA.addToRef(this._localAxis,this._lookAt),this._dragPlane.lookAt(this._lookAt)):(this._dragPlane.position.copyFrom(this._pointA),this._dragPlane.lookAt(e.origin)),this._dragPlane.position.copyFrom(this.attachedNode.getAbsolutePosition()),this._dragPlane.computeWorldMatrix(!0)}detach(){this._lastPointerRay={},this.attachedNode&&(this.attachedNode.isNearGrabbable=!1),this._pointerObserver&&this._scene.onPointerObservable.remove(this._pointerObserver),this._beforeRenderObserver&&this._scene.onBeforeRenderObservable.remove(this._beforeRenderObserver),this._dragPlane&&this._dragPlane.dispose(),this.releaseDrag()}}u._AnyMouseId=-2},498:(e,t,i)=>{i.d(t,{K:()=>l});var n=i(4141),s=i(5757),r=i(6981),o=i(4674),a=i(5203);class l extends r.N{constructor(){super(...arguments),this._sceneRenderObserver=null,this._targetPosition=new n.P(0,0,0),this._targetOrientation=new n._f,this._targetScaling=new n.P(1,1,1),this._startingPosition=new n.P(0,0,0),this._startingOrientation=new n._f,this._startingScaling=new n.P(1,1,1),this.onPositionChangedObservable=new s.y$,this.dragDeltaRatio=.2,this.rotateDraggedObject=!0,this.rotateAroundYOnly=!1,this.rotateWithMotionController=!0,this.disableMovement=!1,this.faceCameraOnDragStart=!1}get name(){return"SixDofDrag"}attach(e){super.attach(e),e.isNearGrabbable=!0,this._virtualTransformNode=new o.Y("virtual_sixDof",r.N._virtualScene),this._virtualTransformNode.rotationQuaternion=n._f.Identity(),this._sceneRenderObserver=e.getScene().onBeforeRenderObservable.add((()=>{if(1===this.currentDraggingPointerIds.length&&this._moving&&!this.disableMovement){const t=e.parent;e.setParent(null),e.position.addInPlace(this._targetPosition.subtract(e.position).scale(this.dragDeltaRatio)),this.onPositionChangedObservable.notifyObservers({position:e.absolutePosition}),(!t||t.scaling&&!t.scaling.isNonUniformWithinEpsilon(.001))&&n._f.SlerpToRef(e.rotationQuaternion,this._targetOrientation,this.dragDeltaRatio,e.rotationQuaternion),e.setParent(t)}}))}_getPositionOffsetAround(e,t,i){const s=n.jp.Matrix[0],r=n.jp.Matrix[1],o=n.jp.Matrix[2],a=n.jp.Matrix[3],l=n.jp.Matrix[4];return n.y3.TranslationToRef(e.x,e.y,e.z,s),n.y3.TranslationToRef(-e.x,-e.y,-e.z,r),n.y3.FromQuaternionToRef(i,o),n.y3.ScalingToRef(t,t,t,a),r.multiplyToRef(o,l),l.multiplyToRef(a,l),l.multiplyToRef(s,l),l.getTranslation()}_onePointerPositionUpdated(e,t){n.jp.Vector3[0].setAll(0),this._dragging===this._dragType.DRAG?this.rotateDraggedObject&&(this.rotateAroundYOnly?n._f.RotationYawPitchRollToRef(t.toEulerAngles().y,0,0,n.jp.Quaternion[0]):n.jp.Quaternion[0].copyFrom(t),n.jp.Quaternion[0].multiplyToRef(this._startingOrientation,this._targetOrientation)):(this._dragging===this._dragType.NEAR_DRAG||this._dragging===this._dragType.DRAG_WITH_CONTROLLER&&this.rotateWithMotionController)&&t.multiplyToRef(this._startingOrientation,this._targetOrientation),this._targetPosition.copyFrom(this._startingPosition).addInPlace(e)}_twoPointersPositionUpdated(){const e=this._virtualMeshesInfo[this.currentDraggingPointerIds[0]].startingPosition,t=this._virtualMeshesInfo[this.currentDraggingPointerIds[1]].startingPosition,i=n.jp.Vector3[0];e.addToRef(t,i),i.scaleInPlace(.5);const s=n.jp.Vector3[1];t.subtractToRef(e,s);const r=this._virtualMeshesInfo[this.currentDraggingPointerIds[0]].dragMesh.absolutePosition,o=this._virtualMeshesInfo[this.currentDraggingPointerIds[1]].dragMesh.absolutePosition,a=n.jp.Vector3[2];r.addToRef(o,a),a.scaleInPlace(.5);const l=n.jp.Vector3[3];o.subtractToRef(r,l);const h=l.length()/s.length(),c=a.subtract(i),u=n._f.FromEulerAngles(0,n.P.GetAngleBetweenVectorsOnPlane(s.normalize(),l.normalize(),n.P.UpReadOnly),0),d=this._ownerNode.parent;this._ownerNode.setParent(null);const p=this._getPositionOffsetAround(i.subtract(this._virtualTransformNode.getAbsolutePivotPoint()),h,u);this._virtualTransformNode.rotationQuaternion.multiplyToRef(u,this._ownerNode.rotationQuaternion),this._virtualTransformNode.scaling.scaleToRef(h,this._ownerNode.scaling),this._virtualTransformNode.position.addToRef(c.addInPlace(p),this._ownerNode.position),this.onPositionChangedObservable.notifyObservers({position:this._ownerNode.position}),this._ownerNode.setParent(d)}_targetDragStart(){const e=this.currentDraggingPointerIds.length,t=this._ownerNode.parent;this._ownerNode.rotationQuaternion||(this._ownerNode.rotationQuaternion=n._f.RotationYawPitchRoll(this._ownerNode.rotation.y,this._ownerNode.rotation.x,this._ownerNode.rotation.z));const i=this._ownerNode.getAbsolutePivotPoint();if(this._ownerNode.setParent(null),1===e){if(this._targetPosition.copyFrom(this._ownerNode.position),this._targetOrientation.copyFrom(this._ownerNode.rotationQuaternion),this._targetScaling.copyFrom(this._ownerNode.scaling),this.faceCameraOnDragStart&&this._scene.activeCamera){const e=n.jp.Vector3[0];this._scene.activeCamera.position.subtractToRef(i,e),e.normalize();const t=n.jp.Quaternion[0];this._scene.useRightHandedSystem?n._f.FromLookDirectionRHToRef(e,new n.P(0,1,0),t):n._f.FromLookDirectionLHToRef(e,new n.P(0,1,0),t),t.normalize(),n._f.RotationYawPitchRollToRef(t.toEulerAngles().y,0,0,n.jp.Quaternion[0]),this._targetOrientation.copyFrom(n.jp.Quaternion[0])}this._startingPosition.copyFrom(this._targetPosition),this._startingOrientation.copyFrom(this._targetOrientation),this._startingScaling.copyFrom(this._targetScaling)}else 2===e&&(this._virtualTransformNode.setPivotPoint(new n.P(0,0,0),a.T.LOCAL),this._virtualTransformNode.position.copyFrom(this._ownerNode.position),this._virtualTransformNode.scaling.copyFrom(this._ownerNode.scaling),this._virtualTransformNode.rotationQuaternion.copyFrom(this._ownerNode.rotationQuaternion),this._virtualTransformNode.setPivotPoint(i,a.T.WORLD),this._resetVirtualMeshesPosition());this._ownerNode.setParent(t)}_targetDrag(e,t){1===this.currentDraggingPointerIds.length?this._onePointerPositionUpdated(e,t):2===this.currentDraggingPointerIds.length&&this._twoPointersPositionUpdated()}_targetDragEnd(){if(1===this.currentDraggingPointerIds.length){this._resetVirtualMeshesPosition();const e=this.faceCameraOnDragStart;this.faceCameraOnDragStart=!1,this._targetDragStart(),this.faceCameraOnDragStart=e}}detach(){super.detach(),this._ownerNode&&(this._ownerNode.isNearGrabbable=!1,this._ownerNode.getScene().onBeforeRenderObservable.remove(this._sceneRenderObserver)),this._virtualTransformNode&&this._virtualTransformNode.dispose()}}},120:(e,t,i)=>{i.d(t,{p:()=>r});var n=i(1903),s=i(4141);class r{constructor(){this._attachPointLocalOffset=new s.P,this._workingPosition=new s.P,this._workingQuaternion=new s._f,this._lastTick=-1,this._hit=!1,this.hitNormalOffset=.05,this.meshes=[],this.interpolatePose=!0,this.lerpTime=250,this.keepOrientationVertical=!0,this.enabled=!0,this.maxStickingDistance=.8}get name(){return"SurfaceMagnetism"}init(){}attach(e,t){this._attachedMesh=e,this._scene=t||e.getScene(),this._attachedMesh.rotationQuaternion||(this._attachedMesh.rotationQuaternion=s._f.RotationYawPitchRoll(this._attachedMesh.rotation.y,this._attachedMesh.rotation.x,this._attachedMesh.rotation.z)),this.updateAttachPoint(),this._workingPosition.copyFrom(this._attachedMesh.position),this._workingQuaternion.copyFrom(this._attachedMesh.rotationQuaternion),this._addObservables()}detach(){this._attachedMesh=null,this._removeObservables()}_getTargetPose(e){if(!this._attachedMesh)return null;if(e&&e.hit){const t=e.getNormal(!0,!0),i=e.pickedPoint;if(!t||!i)return null;t.normalize();const n=s.jp.Vector3[0];return n.copyFrom(t),n.scaleInPlace(this.hitNormalOffset),n.addInPlace(i),this._attachedMesh.parent&&(s.jp.Matrix[0].copyFrom(this._attachedMesh.parent.getWorldMatrix()).invert(),s.P.TransformNormalToRef(n,s.jp.Matrix[0],n)),{position:n,quaternion:s._f.RotationYawPitchRoll(-Math.atan2(t.x,-t.z),this.keepOrientationVertical?0:Math.atan2(t.y,Math.sqrt(t.z*t.z+t.x*t.x)),0)}}return null}updateAttachPoint(){this._getAttachPointOffsetToRef(this._attachPointLocalOffset)}findAndUpdateTarget(e){if(this._hit=!1,!e.ray)return!1;const t=e.ray.intersectsMeshes(this.meshes)[0];if(this._attachedMesh&&t&&t.hit&&t.pickedMesh){const e=this._getTargetPose(t);e&&s.P.Distance(this._attachedMesh.position,e.position)<this.maxStickingDistance&&(this._workingPosition.copyFrom(e.position),this._workingQuaternion.copyFrom(e.quaternion),this._hit=!0)}return this._hit}_getAttachPointOffsetToRef(e){if(!this._attachedMesh)return void e.setAll(0);const t=s.jp.Quaternion[0];t.copyFrom(this._attachedMesh.rotationQuaternion),this._attachedMesh.rotationQuaternion.copyFromFloats(0,0,0,1),this._attachedMesh.computeWorldMatrix();const i=this._attachedMesh.getHierarchyBoundingVectors(),n=s.jp.Vector3[0];i.max.addToRef(i.min,n),n.scaleInPlace(.5),n.z=i.max.z;const r=s.jp.Matrix[0];this._attachedMesh.getWorldMatrix().invertToRef(r),s.P.TransformCoordinatesToRef(n,r,e),this._attachedMesh.rotationQuaternion.copyFrom(t)}_updateTransformToGoal(e){if(!this._attachedMesh||!this._hit)return;const t=this._attachedMesh.parent;this._attachedMesh.setParent(null);const i=s.jp.Vector3[0];if(s.P.TransformNormalToRef(this._attachPointLocalOffset,this._attachedMesh.getWorldMatrix(),i),!this.interpolatePose)return this._attachedMesh.position.copyFrom(this._workingPosition).subtractInPlace(i),void this._attachedMesh.rotationQuaternion.copyFrom(this._workingQuaternion);const n=new s.P;s.P.SmoothToRef(this._attachedMesh.position,this._workingPosition,e,this.lerpTime,n),this._attachedMesh.position.copyFrom(n);const r=new s._f;r.copyFrom(this._attachedMesh.rotationQuaternion),s._f.SmoothToRef(r,this._workingQuaternion,e,this.lerpTime,this._attachedMesh.rotationQuaternion),this._attachedMesh.setParent(t)}_addObservables(){this._pointerObserver=this._scene.onPointerObservable.add((e=>{this.enabled&&e.type==n.kD.POINTERMOVE&&e.pickInfo&&this.findAndUpdateTarget(e.pickInfo)})),this._lastTick=Date.now(),this._onBeforeRender=this._scene.onBeforeRenderObservable.add((()=>{const e=Date.now();this._updateTransformToGoal(e-this._lastTick),this._lastTick=e}))}_removeObservables(){this._scene.onPointerObservable.remove(this._pointerObserver),this._scene.onBeforeRenderObservable.remove(this._onBeforeRender),this._pointerObserver=null,this._onBeforeRender=null}}},4026:(e,t,i)=>{i.d(t,{N:()=>a});var n=i(4141),s=i(5860),r=i(9257),o=i(5203);class a extends r.N{get _matrix(){return this._compose(),this._localMatrix}set _matrix(e){this._needToCompose=!1,e.updateFlag!==this._localMatrix.updateFlag&&(this._localMatrix.copyFrom(e),this._markAsDirtyAndDecompose())}constructor(e,t,i=null,s=null,r=null,o=null,a=null){super(e,t.getScene()),this.name=e,this.children=new Array,this.animations=new Array,this._index=null,this._absoluteTransform=new n.y3,this._invertedAbsoluteTransform=new n.y3,this._scalingDeterminant=1,this._worldTransform=new n.y3,this._needToDecompose=!0,this._needToCompose=!1,this._linkedTransformNode=null,this._waitingTransformNodeId=null,this._skeleton=t,this._localMatrix=s?s.clone():n.y3.Identity(),this._restPose=r||this._localMatrix.clone(),this._baseMatrix=o||this._localMatrix.clone(),this._index=a,t.bones.push(this),this.setParent(i,!1),(o||s)&&this._updateDifferenceMatrix()}getClassName(){return"Bone"}getSkeleton(){return this._skeleton}get parent(){return this._parentNode}getParent(){return this.parent}getChildren(){return this.children}getIndex(){return null===this._index?this.getSkeleton().bones.indexOf(this):this._index}set parent(e){this.setParent(e)}setParent(e,t=!0){if(this.parent!==e){if(this.parent){const e=this.parent.children.indexOf(this);-1!==e&&this.parent.children.splice(e,1)}this._parentNode=e,this.parent&&this.parent.children.push(this),t&&this._updateDifferenceMatrix(),this.markAsDirty()}}getLocalMatrix(){return this._compose(),this._localMatrix}getBaseMatrix(){return this._baseMatrix}getRestPose(){return this._restPose}setRestPose(e){this._restPose.copyFrom(e)}getBindPose(){return this._baseMatrix}setBindPose(e){this.updateMatrix(e)}getWorldMatrix(){return this._worldTransform}returnToRest(){var e;if(this._linkedTransformNode){const t=n.jp.Vector3[0],i=n.jp.Quaternion[0],s=n.jp.Vector3[1];this.getRestPose().decompose(t,i,s),this._linkedTransformNode.position.copyFrom(s),this._linkedTransformNode.rotationQuaternion=null!==(e=this._linkedTransformNode.rotationQuaternion)&&void 0!==e?e:n._f.Identity(),this._linkedTransformNode.rotationQuaternion.copyFrom(i),this._linkedTransformNode.scaling.copyFrom(t)}else this._matrix=this._restPose}getInvertedAbsoluteTransform(){return this._invertedAbsoluteTransform}getAbsoluteTransform(){return this._absoluteTransform}linkTransformNode(e){this._linkedTransformNode&&this._skeleton._numBonesWithLinkedTransformNode--,this._linkedTransformNode=e,this._linkedTransformNode&&this._skeleton._numBonesWithLinkedTransformNode++}getTransformNode(){return this._linkedTransformNode}get position(){return this._decompose(),this._localPosition}set position(e){this._decompose(),this._localPosition.copyFrom(e),this._markAsDirtyAndCompose()}get rotation(){return this.getRotation()}set rotation(e){this.setRotation(e)}get rotationQuaternion(){return this._decompose(),this._localRotation}set rotationQuaternion(e){this.setRotationQuaternion(e)}get scaling(){return this.getScale()}set scaling(e){this.setScale(e)}get animationPropertiesOverride(){return this._skeleton.animationPropertiesOverride}_decompose(){this._needToDecompose&&(this._needToDecompose=!1,this._localScaling||(this._localScaling=n.P.Zero(),this._localRotation=n._f.Zero(),this._localPosition=n.P.Zero()),this._localMatrix.decompose(this._localScaling,this._localRotation,this._localPosition))}_compose(){this._needToCompose&&(this._localScaling?(this._needToCompose=!1,n.y3.ComposeToRef(this._localScaling,this._localRotation,this._localPosition,this._localMatrix)):this._needToCompose=!1)}updateMatrix(e,t=!0,i=!0){this._baseMatrix.copyFrom(e),t&&this._updateDifferenceMatrix(),i?this._matrix=e:this.markAsDirty()}_updateDifferenceMatrix(e,t=!0){if(e||(e=this._baseMatrix),this.parent?e.multiplyToRef(this.parent._absoluteTransform,this._absoluteTransform):this._absoluteTransform.copyFrom(e),this._absoluteTransform.invertToRef(this._invertedAbsoluteTransform),t)for(let e=0;e<this.children.length;e++)this.children[e]._updateDifferenceMatrix();this._scalingDeterminant=this._absoluteTransform.determinant()<0?-1:1}markAsDirty(){return this._currentRenderId++,this._childUpdateId++,this._skeleton._markAsDirty(),this}_markAsDirtyAndCompose(){this.markAsDirty(),this._needToCompose=!0}_markAsDirtyAndDecompose(){this.markAsDirty(),this._needToDecompose=!0}translate(e,t=o.T.LOCAL,i){const s=this.getLocalMatrix();if(t==o.T.LOCAL)s.addAtIndex(12,e.x),s.addAtIndex(13,e.y),s.addAtIndex(14,e.z);else{let t=null;i&&(t=i.getWorldMatrix()),this._skeleton.computeAbsoluteTransforms();const r=a._TmpMats[0],o=a._TmpVecs[0];this.parent?i&&t?(r.copyFrom(this.parent.getAbsoluteTransform()),r.multiplyToRef(t,r)):r.copyFrom(this.parent.getAbsoluteTransform()):n.y3.IdentityToRef(r),r.setTranslationFromFloats(0,0,0),r.invert(),n.P.TransformCoordinatesToRef(e,r,o),s.addAtIndex(12,o.x),s.addAtIndex(13,o.y),s.addAtIndex(14,o.z)}this._markAsDirtyAndDecompose()}setPosition(e,t=o.T.LOCAL,i){const s=this.getLocalMatrix();if(t==o.T.LOCAL)s.setTranslationFromFloats(e.x,e.y,e.z);else{let t=null;i&&(t=i.getWorldMatrix()),this._skeleton.computeAbsoluteTransforms();const r=a._TmpMats[0],o=a._TmpVecs[0];this.parent?(i&&t?(r.copyFrom(this.parent.getAbsoluteTransform()),r.multiplyToRef(t,r)):r.copyFrom(this.parent.getAbsoluteTransform()),r.invert()):n.y3.IdentityToRef(r),n.P.TransformCoordinatesToRef(e,r,o),s.setTranslationFromFloats(o.x,o.y,o.z)}this._markAsDirtyAndDecompose()}setAbsolutePosition(e,t){this.setPosition(e,o.T.WORLD,t)}scale(e,t,i,s=!1){const r=this.getLocalMatrix(),o=a._TmpMats[0];n.y3.ScalingToRef(e,t,i,o),o.multiplyToRef(r,r),o.invert();for(const n of this.children){const s=n.getLocalMatrix();s.multiplyToRef(o,s),s.multiplyAtIndex(12,e),s.multiplyAtIndex(13,t),s.multiplyAtIndex(14,i),n._markAsDirtyAndDecompose()}if(this._markAsDirtyAndDecompose(),s)for(const n of this.children)n.scale(e,t,i,s)}setScale(e){this._decompose(),this._localScaling.copyFrom(e),this._markAsDirtyAndCompose()}getScale(){return this._decompose(),this._localScaling}getScaleToRef(e){this._decompose(),e.copyFrom(this._localScaling)}setYawPitchRoll(e,t,i,s=o.T.LOCAL,r){if(s===o.T.LOCAL){const o=a._TmpQuat;return n._f.RotationYawPitchRollToRef(e,t,i,o),void this.setRotationQuaternion(o,s,r)}const l=a._TmpMats[0];if(!this._getNegativeRotationToRef(l,r))return;const h=a._TmpMats[1];n.y3.RotationYawPitchRollToRef(e,t,i,h),l.multiplyToRef(h,h),this._rotateWithMatrix(h,s,r)}rotate(e,t,i=o.T.LOCAL,s){const r=a._TmpMats[0];r.setTranslationFromFloats(0,0,0),n.y3.RotationAxisToRef(e,t,r),this._rotateWithMatrix(r,i,s)}setAxisAngle(e,t,i=o.T.LOCAL,s){if(i===o.T.LOCAL){const r=a._TmpQuat;return n._f.RotationAxisToRef(e,t,r),void this.setRotationQuaternion(r,i,s)}const r=a._TmpMats[0];if(!this._getNegativeRotationToRef(r,s))return;const l=a._TmpMats[1];n.y3.RotationAxisToRef(e,t,l),r.multiplyToRef(l,l),this._rotateWithMatrix(l,i,s)}setRotation(e,t=o.T.LOCAL,i){this.setYawPitchRoll(e.y,e.x,e.z,t,i)}setRotationQuaternion(e,t=o.T.LOCAL,i){if(t===o.T.LOCAL)return this._decompose(),this._localRotation.copyFrom(e),void this._markAsDirtyAndCompose();const s=a._TmpMats[0];if(!this._getNegativeRotationToRef(s,i))return;const r=a._TmpMats[1];n.y3.FromQuaternionToRef(e,r),s.multiplyToRef(r,r),this._rotateWithMatrix(r,t,i)}setRotationMatrix(e,t=o.T.LOCAL,i){if(t===o.T.LOCAL){const s=a._TmpQuat;return n._f.FromRotationMatrixToRef(e,s),void this.setRotationQuaternion(s,t,i)}const s=a._TmpMats[0];if(!this._getNegativeRotationToRef(s,i))return;const r=a._TmpMats[1];r.copyFrom(e),s.multiplyToRef(e,r),this._rotateWithMatrix(r,t,i)}_rotateWithMatrix(e,t=o.T.LOCAL,i){const n=this.getLocalMatrix(),s=n.m[12],r=n.m[13],l=n.m[14],h=this.getParent(),c=a._TmpMats[3],u=a._TmpMats[4];h&&t==o.T.WORLD?(i?(c.copyFrom(i.getWorldMatrix()),h.getAbsoluteTransform().multiplyToRef(c,c)):c.copyFrom(h.getAbsoluteTransform()),u.copyFrom(c),u.invert(),n.multiplyToRef(c,n),n.multiplyToRef(e,n),n.multiplyToRef(u,n)):t==o.T.WORLD&&i?(c.copyFrom(i.getWorldMatrix()),u.copyFrom(c),u.invert(),n.multiplyToRef(c,n),n.multiplyToRef(e,n),n.multiplyToRef(u,n)):n.multiplyToRef(e,n),n.setTranslationFromFloats(s,r,l),this.computeAbsoluteTransforms(),this._markAsDirtyAndDecompose()}_getNegativeRotationToRef(e,t){const i=a._TmpMats[2];return e.copyFrom(this.getAbsoluteTransform()),t?(e.multiplyToRef(t.getWorldMatrix(),e),n.y3.ScalingToRef(t.scaling.x,t.scaling.y,t.scaling.z,i)):n.y3.IdentityToRef(i),e.invert(),!isNaN(e.m[0])&&(i.multiplyAtIndex(0,this._scalingDeterminant),e.multiplyToRef(i,e),!0)}getPosition(e=o.T.LOCAL,t=null){const i=n.P.Zero();return this.getPositionToRef(e,t,i),i}getPositionToRef(e=o.T.LOCAL,t,i){if(e==o.T.LOCAL){const e=this.getLocalMatrix();i.x=e.m[12],i.y=e.m[13],i.z=e.m[14]}else{let e=null;t&&(e=t.getWorldMatrix()),this._skeleton.computeAbsoluteTransforms();let n=a._TmpMats[0];t&&e?(n.copyFrom(this.getAbsoluteTransform()),n.multiplyToRef(e,n)):n=this.getAbsoluteTransform(),i.x=n.m[12],i.y=n.m[13],i.z=n.m[14]}}getAbsolutePosition(e=null){const t=n.P.Zero();return this.getPositionToRef(o.T.WORLD,e,t),t}getAbsolutePositionToRef(e,t){this.getPositionToRef(o.T.WORLD,e,t)}computeAbsoluteTransforms(){if(this._compose(),this.parent)this._localMatrix.multiplyToRef(this.parent._absoluteTransform,this._absoluteTransform);else{this._absoluteTransform.copyFrom(this._localMatrix);const e=this._skeleton.getPoseMatrix();e&&this._absoluteTransform.multiplyToRef(e,this._absoluteTransform)}const e=this.children,t=e.length;for(let i=0;i<t;i++)e[i].computeAbsoluteTransforms()}getDirection(e,t=null){const i=n.P.Zero();return this.getDirectionToRef(e,t,i),i}getDirectionToRef(e,t=null,i){let s=null;t&&(s=t.getWorldMatrix()),this._skeleton.computeAbsoluteTransforms();const r=a._TmpMats[0];r.copyFrom(this.getAbsoluteTransform()),t&&s&&r.multiplyToRef(s,r),n.P.TransformNormalToRef(e,r,i),i.normalize()}getRotation(e=o.T.LOCAL,t=null){const i=n.P.Zero();return this.getRotationToRef(e,t,i),i}getRotationToRef(e=o.T.LOCAL,t=null,i){const n=a._TmpQuat;this.getRotationQuaternionToRef(e,t,n),n.toEulerAnglesToRef(i)}getRotationQuaternion(e=o.T.LOCAL,t=null){const i=n._f.Identity();return this.getRotationQuaternionToRef(e,t,i),i}getRotationQuaternionToRef(e=o.T.LOCAL,t=null,i){if(e==o.T.LOCAL)this._decompose(),i.copyFrom(this._localRotation);else{const e=a._TmpMats[0],n=this.getAbsoluteTransform();t?n.multiplyToRef(t.getWorldMatrix(),e):e.copyFrom(n),e.multiplyAtIndex(0,this._scalingDeterminant),e.multiplyAtIndex(1,this._scalingDeterminant),e.multiplyAtIndex(2,this._scalingDeterminant),e.decompose(void 0,i,void 0)}}getRotationMatrix(e=o.T.LOCAL,t){const i=n.y3.Identity();return this.getRotationMatrixToRef(e,t,i),i}getRotationMatrixToRef(e=o.T.LOCAL,t,i){if(e==o.T.LOCAL)this.getLocalMatrix().getRotationMatrixToRef(i);else{const e=a._TmpMats[0],n=this.getAbsoluteTransform();t?n.multiplyToRef(t.getWorldMatrix(),e):e.copyFrom(n),e.multiplyAtIndex(0,this._scalingDeterminant),e.multiplyAtIndex(1,this._scalingDeterminant),e.multiplyAtIndex(2,this._scalingDeterminant),e.getRotationMatrixToRef(i)}}getAbsolutePositionFromLocal(e,t=null){const i=n.P.Zero();return this.getAbsolutePositionFromLocalToRef(e,t,i),i}getAbsolutePositionFromLocalToRef(e,t=null,i){let s=null;t&&(s=t.getWorldMatrix()),this._skeleton.computeAbsoluteTransforms();let r=a._TmpMats[0];t&&s?(r.copyFrom(this.getAbsoluteTransform()),r.multiplyToRef(s,r)):r=this.getAbsoluteTransform(),n.P.TransformCoordinatesToRef(e,r,i)}getLocalPositionFromAbsolute(e,t=null){const i=n.P.Zero();return this.getLocalPositionFromAbsoluteToRef(e,t,i),i}getLocalPositionFromAbsoluteToRef(e,t=null,i){let s=null;t&&(s=t.getWorldMatrix()),this._skeleton.computeAbsoluteTransforms();const r=a._TmpMats[0];r.copyFrom(this.getAbsoluteTransform()),t&&s&&r.multiplyToRef(s,r),r.invert(),n.P.TransformCoordinatesToRef(e,r,i)}setCurrentPoseAsRest(){this.setRestPose(this.getLocalMatrix())}}a._TmpVecs=s.B.BuildArray(2,n.P.Zero),a._TmpQuat=n._f.Identity(),a._TmpMats=s.B.BuildArray(5,n.y3.Identity)},5047:(e,t,i)=>{i.d(t,{O:()=>d});var n=i(4026),s=i(5757),r=i(4141),o=i(7647),a=i(4676),l=i(2695),h=i(1431),c=i(2722),u=i(6387);class d{get useTextureToStoreBoneMatrices(){return this._useTextureToStoreBoneMatrices}set useTextureToStoreBoneMatrices(e){this._useTextureToStoreBoneMatrices=e,this._markAsDirty()}get animationPropertiesOverride(){return this._animationPropertiesOverride?this._animationPropertiesOverride:this._scene.animationPropertiesOverride}set animationPropertiesOverride(e){this._animationPropertiesOverride=e}get isUsingTextureForMatrices(){return this.useTextureToStoreBoneMatrices&&this._canUseTextureForBones}get uniqueId(){return this._uniqueId}constructor(e,t,i){this.name=e,this.id=t,this.bones=new Array,this.needInitialSkinMatrix=!1,this._isDirty=!0,this._meshesWithPoseMatrix=new Array,this._identity=r.y3.Identity(),this._ranges={},this._absoluteTransformIsDirty=!0,this._canUseTextureForBones=!1,this._uniqueId=0,this._numBonesWithLinkedTransformNode=0,this._hasWaitingData=null,this._parentContainer=null,this.doNotSerialize=!1,this._useTextureToStoreBoneMatrices=!0,this._animationPropertiesOverride=null,this.onBeforeComputeObservable=new s.y$,this.bones=[],this._scene=i||h.l.LastCreatedScene,this._uniqueId=this._scene.getUniqueId(),this._scene.addSkeleton(this),this._isDirty=!0;const n=this._scene.getEngine().getCaps();this._canUseTextureForBones=n.textureFloat&&n.maxVertexTextureImageUnits>0}getClassName(){return"Skeleton"}getChildren(){return this.bones.filter((e=>!e.getParent()))}getTransformMatrices(e){return this.needInitialSkinMatrix?(e._bonesTransformMatrices||this.prepare(),e._bonesTransformMatrices):(this._transformMatrices&&!this._isDirty||this.prepare(),this._transformMatrices)}getTransformMatrixTexture(e){return this.needInitialSkinMatrix&&e._transformMatrixTexture?e._transformMatrixTexture:this._transformMatrixTexture}getScene(){return this._scene}toString(e){let t=`Name: ${this.name}, nBones: ${this.bones.length}`;if(t+=`, nAnimationRanges: ${this._ranges?Object.keys(this._ranges).length:"none"}`,e){t+=", Ranges: {";let e=!0;for(const i in this._ranges)e&&(t+=", ",e=!1),t+=i;t+="}"}return t}getBoneIndexByName(e){for(let t=0,i=this.bones.length;t<i;t++)if(this.bones[t].name===e)return t;return-1}createAnimationRange(e,t,i){if(!this._ranges[e]){this._ranges[e]=new l.X(e,t,i);for(let n=0,s=this.bones.length;n<s;n++)this.bones[n].animations[0]&&this.bones[n].animations[0].createRange(e,t,i)}}deleteAnimationRange(e,t=!0){for(let i=0,n=this.bones.length;i<n;i++)this.bones[i].animations[0]&&this.bones[i].animations[0].deleteRange(e,t);this._ranges[e]=null}getAnimationRange(e){return this._ranges[e]||null}getAnimationRanges(){const e=[];let t;for(t in this._ranges)e.push(this._ranges[t]);return e}copyAnimationRange(e,t,i=!1){if(this._ranges[t]||!e.getAnimationRange(t))return!1;let n=!0;const s=this._getHighestAnimationFrame()+1,r={},o=e.bones;let a,h;for(h=0,a=o.length;h<a;h++)r[o[h].name]=o[h];this.bones.length!==o.length&&(c.Y.Warn(`copyAnimationRange: this rig has ${this.bones.length} bones, while source as ${o.length}`),n=!1);const u=i&&this.dimensionsAtRest&&e.dimensionsAtRest?this.dimensionsAtRest.divide(e.dimensionsAtRest):null;for(h=0,a=this.bones.length;h<a;h++){const e=this.bones[h].name,o=r[e];o?n=n&&this.bones[h].copyAnimationRange(o,t,s,i,u):(c.Y.Warn("copyAnimationRange: not same rig, missing source bone "+e),n=!1)}const d=e.getAnimationRange(t);return d&&(this._ranges[t]=new l.X(t,d.from+s,d.to+s)),n}returnToRest(){for(const e of this.bones)-1!==e._index&&e.returnToRest()}_getHighestAnimationFrame(){let e=0;for(let t=0,i=this.bones.length;t<i;t++)if(this.bones[t].animations[0]){const i=this.bones[t].animations[0].getHighestFrame();e<i&&(e=i)}return e}beginAnimation(e,t,i,n){const s=this.getAnimationRange(e);return s?this._scene.beginAnimation(this,s.from,s.to,t,i,n):null}static MakeAnimationAdditive(e,t=0,i){const n=e.getAnimationRange(i);if(!n)return null;const s=e._scene.getAllAnimatablesByTarget(e);let r=null;for(let e=0;e<s.length;e++){const t=s[e];if(t.fromFrame===(null==n?void 0:n.from)&&t.toFrame===(null==n?void 0:n.to)){r=t;break}}const o=e.getAnimatables();for(let e=0;e<o.length;e++){const n=o[e].animations;if(n)for(let e=0;e<n.length;e++)a.f.MakeAnimationAdditive(n[e],t,i)}return r&&(r.isAdditive=!0),e}_markAsDirty(){this._isDirty=!0,this._absoluteTransformIsDirty=!0}_registerMeshWithPoseMatrix(e){this._meshesWithPoseMatrix.push(e)}_unregisterMeshWithPoseMatrix(e){const t=this._meshesWithPoseMatrix.indexOf(e);t>-1&&this._meshesWithPoseMatrix.splice(t,1)}_computeTransformMatrices(e,t){this.onBeforeComputeObservable.notifyObservers(this);for(let i=0;i<this.bones.length;i++){const n=this.bones[i];n._childUpdateId++;const s=n.getParent();if(s?n.getLocalMatrix().multiplyToRef(s.getWorldMatrix(),n.getWorldMatrix()):t?n.getLocalMatrix().multiplyToRef(t,n.getWorldMatrix()):n.getWorldMatrix().copyFrom(n.getLocalMatrix()),-1!==n._index){const t=null===n._index?i:n._index;n.getInvertedAbsoluteTransform().multiplyToArray(n.getWorldMatrix(),e,16*t)}}this._identity.copyToArray(e,16*this.bones.length)}prepare(){if(this._numBonesWithLinkedTransformNode>0)for(const e of this.bones)if(e._linkedTransformNode){const t=e._linkedTransformNode;e.position=t.position,t.rotationQuaternion?e.rotationQuaternion=t.rotationQuaternion:e.rotation=t.rotation,e.scaling=t.scaling}if(this.needInitialSkinMatrix)for(const e of this._meshesWithPoseMatrix){const t=e.getPoseMatrix();let i=this._isDirty;if(e._bonesTransformMatrices&&e._bonesTransformMatrices.length===16*(this.bones.length+1)||(e._bonesTransformMatrices=new Float32Array(16*(this.bones.length+1)),i=!0),i){if(this._synchronizedWithMesh!==e){this._synchronizedWithMesh=e;for(const e of this.bones)e.getParent()||(e.getBaseMatrix().multiplyToRef(t,r.jp.Matrix[1]),e._updateDifferenceMatrix(r.jp.Matrix[1]));if(this.isUsingTextureForMatrices){const t=4*(this.bones.length+1);e._transformMatrixTexture&&e._transformMatrixTexture.getSize().width===t||(e._transformMatrixTexture&&e._transformMatrixTexture.dispose(),e._transformMatrixTexture=o.l.CreateRGBATexture(e._bonesTransformMatrices,4*(this.bones.length+1),1,this._scene,!1,!1,1,1))}}this._computeTransformMatrices(e._bonesTransformMatrices,t),this.isUsingTextureForMatrices&&e._transformMatrixTexture&&e._transformMatrixTexture.update(e._bonesTransformMatrices)}}else{if(!this._isDirty)return;this._transformMatrices&&this._transformMatrices.length===16*(this.bones.length+1)||(this._transformMatrices=new Float32Array(16*(this.bones.length+1)),this.isUsingTextureForMatrices&&(this._transformMatrixTexture&&this._transformMatrixTexture.dispose(),this._transformMatrixTexture=o.l.CreateRGBATexture(this._transformMatrices,4*(this.bones.length+1),1,this._scene,!1,!1,1,1))),this._computeTransformMatrices(this._transformMatrices,null),this.isUsingTextureForMatrices&&this._transformMatrixTexture&&this._transformMatrixTexture.update(this._transformMatrices)}this._isDirty=!1}getAnimatables(){if(!this._animatables||this._animatables.length!==this.bones.length){this._animatables=[];for(let e=0;e<this.bones.length;e++)this._animatables.push(this.bones[e])}return this._animatables}clone(e,t){const i=new d(e,t||e,this._scene);i.needInitialSkinMatrix=this.needInitialSkinMatrix;for(let e=0;e<this.bones.length;e++){const t=this.bones[e];let s=null;const r=t.getParent();if(r){const e=this.bones.indexOf(r);s=i.bones[e]}const o=new n.N(t.name,i,s,t.getBaseMatrix().clone(),t.getRestPose().clone());o._index=t._index,t._linkedTransformNode&&o.linkTransformNode(t._linkedTransformNode),u.j.DeepCopy(t.animations,o.animations)}if(this._ranges){i._ranges={};for(const e in this._ranges){const t=this._ranges[e];t&&(i._ranges[e]=t.clone())}}return this._isDirty=!0,i}enableBlending(e=.01){this.bones.forEach((t=>{t.animations.forEach((t=>{t.enableBlending=!0,t.blendingSpeed=e}))}))}dispose(){if(this._meshesWithPoseMatrix.length=0,this.getScene().stopAnimation(this),this.getScene().removeSkeleton(this),this._parentContainer){const e=this._parentContainer.skeletons.indexOf(this);e>-1&&this._parentContainer.skeletons.splice(e,1),this._parentContainer=null}this._transformMatrixTexture&&(this._transformMatrixTexture.dispose(),this._transformMatrixTexture=null)}serialize(){var e;const t={};t.name=this.name,t.id=this.id,this.dimensionsAtRest&&(t.dimensionsAtRest=this.dimensionsAtRest.asArray()),t.bones=[],t.needInitialSkinMatrix=this.needInitialSkinMatrix;for(let i=0;i<this.bones.length;i++){const n=this.bones[i],s=n.getParent(),r={parentBoneIndex:s?this.bones.indexOf(s):-1,index:n.getIndex(),name:n.name,id:n.id,matrix:n.getBaseMatrix().toArray(),rest:n.getRestPose().toArray(),linkedTransformNodeId:null===(e=n.getTransformNode())||void 0===e?void 0:e.id};t.bones.push(r),n.length&&(r.length=n.length),n.metadata&&(r.metadata=n.metadata),n.animations&&n.animations.length>0&&(r.animation=n.animations[0].serialize()),t.ranges=[];for(const e in this._ranges){const i=this._ranges[e];if(!i)continue;const n={};n.name=e,n.from=i.from,n.to=i.to,t.ranges.push(n)}}return t}static Parse(e,t){const i=new d(e.name,e.id,t);let s;for(e.dimensionsAtRest&&(i.dimensionsAtRest=r.P.FromArray(e.dimensionsAtRest)),i.needInitialSkinMatrix=e.needInitialSkinMatrix,s=0;s<e.bones.length;s++){const t=e.bones[s],o=e.bones[s].index;let l=null;t.parentBoneIndex>-1&&(l=i.bones[t.parentBoneIndex]);const h=t.rest?r.y3.FromArray(t.rest):null,c=new n.N(t.name,i,l,r.y3.FromArray(t.matrix),h,null,o);void 0!==t.id&&null!==t.id&&(c.id=t.id),t.length&&(c.length=t.length),t.metadata&&(c.metadata=t.metadata),t.animation&&c.animations.push(a.f.Parse(t.animation)),void 0!==t.linkedTransformNodeId&&null!==t.linkedTransformNodeId&&(i._hasWaitingData=!0,c._waitingTransformNodeId=t.linkedTransformNodeId)}if(e.ranges)for(s=0;s<e.ranges.length;s++){const t=e.ranges[s];i.createAnimationRange(t.name,t.from,t.to)}return i}computeAbsoluteTransforms(e=!1){(this._absoluteTransformIsDirty||e)&&(this.bones[0].computeAbsoluteTransforms(),this._absoluteTransformIsDirty=!1)}getPoseMatrix(){let e=null;return this._meshesWithPoseMatrix.length>0&&(e=this._meshesWithPoseMatrix[0].getPoseMatrix()),e}sortBones(){const e=new Array,t=new Array(this.bones.length);for(let i=0;i<this.bones.length;i++)this._sortBones(i,e,t);this.bones=e}_sortBones(e,t,i){if(i[e])return;i[e]=!0;const n=this.bones[e];if(!n)return;void 0===n._index&&(n._index=e);const s=n.getParent();s&&this._sortBones(this.bones.indexOf(s),t,i),t.push(n)}setCurrentPoseAsRest(){this.bones.forEach((e=>{e.setCurrentPoseAsRest()}))}}},708:(e,t,i)=>{i.d(t,{l:()=>s,o:()=>r});var n=i(7698);class s{constructor(e,t,i,s=0,r=!1,o=!1,a=!1,l){this._isAlreadyOwned=!1,e.getScene?this._engine=e.getScene().getEngine():this._engine=e,this._updatable=i,this._instanced=o,this._divisor=l||1,t instanceof n.h?(this._data=null,this._buffer=t):(this._data=t,this._buffer=null),this.byteStride=a?s:s*Float32Array.BYTES_PER_ELEMENT,r||this.create()}createVertexBuffer(e,t,i,n,s,o=!1,a){const l=o?t:t*Float32Array.BYTES_PER_ELEMENT,h=n?o?n:n*Float32Array.BYTES_PER_ELEMENT:this.byteStride;return new r(this._engine,this,e,this._updatable,!0,h,void 0===s?this._instanced:s,l,i,void 0,void 0,!0,this._divisor||a)}isUpdatable(){return this._updatable}getData(){return this._data}getBuffer(){return this._buffer}getStrideSize(){return this.byteStride/Float32Array.BYTES_PER_ELEMENT}create(e=null){!e&&this._buffer||(e=e||this._data)&&(this._buffer?this._updatable&&(this._engine.updateDynamicVertexBuffer(this._buffer,e),this._data=e):this._updatable?(this._buffer=this._engine.createDynamicVertexBuffer(e),this._data=e):this._buffer=this._engine.createVertexBuffer(e))}_rebuild(){this._buffer=null,this.create(this._data)}update(e){this.create(e)}updateDirectly(e,t,i,n=!1){this._buffer&&this._updatable&&(this._engine.updateDynamicVertexBuffer(this._buffer,e,n?t:t*Float32Array.BYTES_PER_ELEMENT,i?i*this.byteStride:void 0),this._data=0===t&&void 0===i?e:null)}_increaseReferences(){this._buffer&&(this._isAlreadyOwned?this._buffer.references++:this._isAlreadyOwned=!0)}dispose(){this._buffer&&this._engine._releaseBuffer(this._buffer)&&(this._buffer=null,this._data=null)}}class r{get instanceDivisor(){return this._instanceDivisor}set instanceDivisor(e){const t=0!=e;this._instanceDivisor=e,t!==this._instanced&&(this._instanced=t,this._computeHashCode())}constructor(e,t,i,n,o,a,l,h,c,u,d=!1,p=!1,f=1,_=!1){if(t instanceof s?(this._buffer=t,this._ownsBuffer=_):(this._buffer=new s(e,t,n,a,o,l,p),this._ownsBuffer=!0),this.uniqueId=r._Counter++,this._kind=i,null==u){const e=this.getData();this.type=r.FLOAT,e instanceof Int8Array?this.type=r.BYTE:e instanceof Uint8Array?this.type=r.UNSIGNED_BYTE:e instanceof Int16Array?this.type=r.SHORT:e instanceof Uint16Array?this.type=r.UNSIGNED_SHORT:e instanceof Int32Array?this.type=r.INT:e instanceof Uint32Array&&(this.type=r.UNSIGNED_INT)}else this.type=u;const m=r.GetTypeByteLength(this.type);p?(this._size=c||(a?a/m:r.DeduceStride(i)),this.byteStride=a||this._buffer.byteStride||this._size*m,this.byteOffset=h||0):(this._size=c||a||r.DeduceStride(i),this.byteStride=a?a*m:this._buffer.byteStride||this._size*m,this.byteOffset=(h||0)*m),this.normalized=d,this._instanced=void 0!==l&&l,this._instanceDivisor=l?f:0,this._computeHashCode()}_computeHashCode(){this.hashCode=(this.type-5120<<0)+((this.normalized?1:0)<<3)+(this._size<<4)+((this._instanced?1:0)<<6)+(this.byteStride<<12)}_rebuild(){this._buffer&&this._buffer._rebuild()}getKind(){return this._kind}isUpdatable(){return this._buffer.isUpdatable()}getData(){return this._buffer.getData()}getFloatData(e,t){const i=this.getData();if(!i)return null;const n=this.getSize()*r.GetTypeByteLength(this.type),s=e*this.getSize();if(this.type!==r.FLOAT||this.byteStride!==n){const e=new Float32Array(s);return this.forEach(s,((t,i)=>e[i]=t)),e}if(!(i instanceof Array||i instanceof Float32Array)||0!==this.byteOffset||i.length!==s){if(i instanceof Array){const e=this.byteOffset/4;return i.slice(e,e+s)}if(i instanceof ArrayBuffer)return new Float32Array(i,this.byteOffset,s);{let e=i.byteOffset+this.byteOffset;if(t){const t=new Float32Array(s),n=new Float32Array(i.buffer,e,s);return t.set(n),t}const n=e%4;return n&&(e=Math.max(0,e-n)),new Float32Array(i.buffer,e,s)}}return t?i.slice():i}getBuffer(){return this._buffer.getBuffer()}getStrideSize(){return this.byteStride/r.GetTypeByteLength(this.type)}getOffset(){return this.byteOffset/r.GetTypeByteLength(this.type)}getSize(e=!1){return e?this._size*r.GetTypeByteLength(this.type):this._size}getIsInstanced(){return this._instanced}getInstanceDivisor(){return this._instanceDivisor}create(e){this._buffer.create(e)}update(e){this._buffer.update(e)}updateDirectly(e,t,i=!1){this._buffer.updateDirectly(e,t,void 0,i)}dispose(){this._ownsBuffer&&this._buffer.dispose()}forEach(e,t){r.ForEach(this._buffer.getData(),this.byteOffset,this.byteStride,this._size,this.type,e,this.normalized,t)}static DeduceStride(e){switch(e){case r.UVKind:case r.UV2Kind:case r.UV3Kind:case r.UV4Kind:case r.UV5Kind:case r.UV6Kind:return 2;case r.NormalKind:case r.PositionKind:return 3;case r.ColorKind:case r.MatricesIndicesKind:case r.MatricesIndicesExtraKind:case r.MatricesWeightsKind:case r.MatricesWeightsExtraKind:case r.TangentKind:return 4;default:throw new Error("Invalid kind '"+e+"'")}}static GetTypeByteLength(e){switch(e){case r.BYTE:case r.UNSIGNED_BYTE:return 1;case r.SHORT:case r.UNSIGNED_SHORT:return 2;case r.INT:case r.UNSIGNED_INT:case r.FLOAT:return 4;default:throw new Error(`Invalid type '${e}'`)}}static ForEach(e,t,i,n,s,o,a,l){if(e instanceof Array){let s=t/4;const r=i/4;for(let t=0;t<o;t+=n){for(let i=0;i<n;i++)l(e[s+i],t+i);s+=r}}else{const h=e instanceof ArrayBuffer?new DataView(e):new DataView(e.buffer,e.byteOffset,e.byteLength),c=r.GetTypeByteLength(s);for(let e=0;e<o;e+=n){let o=t;for(let t=0;t<n;t++)l(r._GetFloatValue(h,s,o,a),e+t),o+=c;t+=i}}}static _GetFloatValue(e,t,i,n){switch(t){case r.BYTE:{let t=e.getInt8(i);return n&&(t=Math.max(t/127,-1)),t}case r.UNSIGNED_BYTE:{let t=e.getUint8(i);return n&&(t/=255),t}case r.SHORT:{let t=e.getInt16(i,!0);return n&&(t=Math.max(t/32767,-1)),t}case r.UNSIGNED_SHORT:{let t=e.getUint16(i,!0);return n&&(t/=65535),t}case r.INT:return e.getInt32(i,!0);case r.UNSIGNED_INT:return e.getUint32(i,!0);case r.FLOAT:return e.getFloat32(i,!0);default:throw new Error(`Invalid component type ${t}`)}}}r._Counter=0,r.BYTE=5120,r.UNSIGNED_BYTE=5121,r.SHORT=5122,r.UNSIGNED_SHORT=5123,r.INT=5124,r.UNSIGNED_INT=5125,r.FLOAT=5126,r.PositionKind="position",r.NormalKind="normal",r.TangentKind="tangent",r.UVKind="uv",r.UV2Kind="uv2",r.UV3Kind="uv3",r.UV4Kind="uv4",r.UV5Kind="uv5",r.UV6Kind="uv6",r.ColorKind="color",r.ColorInstanceKind="instanceColor",r.MatricesIndicesKind="matricesIndices",r.MatricesWeightsKind="matricesWeights",r.MatricesIndicesExtraKind="matricesIndicesExtra",r.MatricesWeightsExtraKind="matricesWeightsExtra"},7698:(e,t,i)=>{i.d(t,{h:()=>n});class n{get underlyingResource(){return null}constructor(){this.references=0,this.capacity=0,this.is32Bits=!1,this.uniqueId=n._Counter++}}n._Counter=0},9563:(e,t,i)=>{i.d(t,{Y:()=>h});var n=i(9472),s=i(3956),r=i(5757),o=i(1903),a=i(2272),l=i(7257);class h{constructor(){this.wheelPrecisionX=3,this.wheelPrecisionY=3,this.wheelPrecisionZ=3,this.onChangedObservable=new r.y$,this._wheelDeltaX=0,this._wheelDeltaY=0,this._wheelDeltaZ=0,this._ffMultiplier=12,this._normalize=120}attachControl(e){e=l.w1.BackCompatCameraNoPreventDefault(arguments),this._wheel=t=>{if(t.type!==o.kD.POINTERWHEEL)return;const i=t.event,n=i.deltaMode===a.G.DOM_DELTA_LINE?this._ffMultiplier:1;this._wheelDeltaX+=this.wheelPrecisionX*n*i.deltaX/this._normalize,this._wheelDeltaY-=this.wheelPrecisionY*n*i.deltaY/this._normalize,this._wheelDeltaZ+=this.wheelPrecisionZ*n*i.deltaZ/this._normalize,i.preventDefault&&(e||i.preventDefault())},this._observer=this.camera.getScene()._inputManager._addCameraPointerObserver(this._wheel,o.kD.POINTERWHEEL)}detachControl(){this._observer&&(this.camera.getScene()._inputManager._removeCameraPointerObserver(this._observer),this._observer=null,this._wheel=null),this.onChangedObservable&&this.onChangedObservable.clear()}checkInputs(){this.onChangedObservable.notifyObservers({wheelDeltaX:this._wheelDeltaX,wheelDeltaY:this._wheelDeltaY,wheelDeltaZ:this._wheelDeltaZ}),this._wheelDeltaX=0,this._wheelDeltaY=0,this._wheelDeltaZ=0}getClassName(){return"BaseCameraMouseWheelInput"}getSimpleName(){return"mousewheel"}}(0,n.gn)([(0,s.qC)()],h.prototype,"wheelPrecisionX",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"wheelPrecisionY",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"wheelPrecisionZ",void 0)},1399:(e,t,i)=>{i.d(t,{Y:()=>h});var n=i(9472),s=i(3956),r=i(1181),o=i(2925),a=i(4141),l=i(7257);class h{constructor(){this.keysUp=[38],this.keysUpward=[33],this.keysDown=[40],this.keysDownward=[34],this.keysLeft=[37],this.keysRight=[39],this.rotationSpeed=.5,this.keysRotateLeft=[],this.keysRotateRight=[],this.keysRotateUp=[],this.keysRotateDown=[],this._keys=new Array}attachControl(e){e=l.w1.BackCompatCameraNoPreventDefault(arguments),this._onCanvasBlurObserver||(this._scene=this.camera.getScene(),this._engine=this._scene.getEngine(),this._onCanvasBlurObserver=this._engine.onCanvasBlurObservable.add((()=>{this._keys.length=0})),this._onKeyboardObserver=this._scene.onKeyboardObservable.add((t=>{const i=t.event;if(!i.metaKey)if(t.type===o.OG.KEYDOWN)-1===this.keysUp.indexOf(i.keyCode)&&-1===this.keysDown.indexOf(i.keyCode)&&-1===this.keysLeft.indexOf(i.keyCode)&&-1===this.keysRight.indexOf(i.keyCode)&&-1===this.keysUpward.indexOf(i.keyCode)&&-1===this.keysDownward.indexOf(i.keyCode)&&-1===this.keysRotateLeft.indexOf(i.keyCode)&&-1===this.keysRotateRight.indexOf(i.keyCode)&&-1===this.keysRotateUp.indexOf(i.keyCode)&&-1===this.keysRotateDown.indexOf(i.keyCode)||(-1===this._keys.indexOf(i.keyCode)&&this._keys.push(i.keyCode),e||i.preventDefault());else if(-1!==this.keysUp.indexOf(i.keyCode)||-1!==this.keysDown.indexOf(i.keyCode)||-1!==this.keysLeft.indexOf(i.keyCode)||-1!==this.keysRight.indexOf(i.keyCode)||-1!==this.keysUpward.indexOf(i.keyCode)||-1!==this.keysDownward.indexOf(i.keyCode)||-1!==this.keysRotateLeft.indexOf(i.keyCode)||-1!==this.keysRotateRight.indexOf(i.keyCode)||-1!==this.keysRotateUp.indexOf(i.keyCode)||-1!==this.keysRotateDown.indexOf(i.keyCode)){const t=this._keys.indexOf(i.keyCode);t>=0&&this._keys.splice(t,1),e||i.preventDefault()}})))}detachControl(){this._scene&&(this._onKeyboardObserver&&this._scene.onKeyboardObservable.remove(this._onKeyboardObserver),this._onCanvasBlurObserver&&this._engine.onCanvasBlurObservable.remove(this._onCanvasBlurObserver),this._onKeyboardObserver=null,this._onCanvasBlurObserver=null),this._keys.length=0}checkInputs(){if(this._onKeyboardObserver){const e=this.camera;for(let t=0;t<this._keys.length;t++){const i=this._keys[t],n=e._computeLocalCameraSpeed();-1!==this.keysLeft.indexOf(i)?e._localDirection.copyFromFloats(-n,0,0):-1!==this.keysUp.indexOf(i)?e._localDirection.copyFromFloats(0,0,n):-1!==this.keysRight.indexOf(i)?e._localDirection.copyFromFloats(n,0,0):-1!==this.keysDown.indexOf(i)?e._localDirection.copyFromFloats(0,0,-n):-1!==this.keysUpward.indexOf(i)?e._localDirection.copyFromFloats(0,n,0):-1!==this.keysDownward.indexOf(i)?e._localDirection.copyFromFloats(0,-n,0):-1!==this.keysRotateLeft.indexOf(i)?(e._localDirection.copyFromFloats(0,0,0),e.cameraRotation.y-=this._getLocalRotation()):-1!==this.keysRotateRight.indexOf(i)?(e._localDirection.copyFromFloats(0,0,0),e.cameraRotation.y+=this._getLocalRotation()):-1!==this.keysRotateUp.indexOf(i)?(e._localDirection.copyFromFloats(0,0,0),e.cameraRotation.x-=this._getLocalRotation()):-1!==this.keysRotateDown.indexOf(i)&&(e._localDirection.copyFromFloats(0,0,0),e.cameraRotation.x+=this._getLocalRotation()),e.getScene().useRightHandedSystem&&(e._localDirection.z*=-1),e.getViewMatrix().invertToRef(e._cameraTransformMatrix),a.P.TransformNormalToRef(e._localDirection,e._cameraTransformMatrix,e._transformedDirection),e.cameraDirection.addInPlace(e._transformedDirection)}}}getClassName(){return"FreeCameraKeyboardMoveInput"}_onLostFocus(){this._keys.length=0}getSimpleName(){return"keyboard"}_getLocalRotation(){let e=this.rotationSpeed*this._engine.getDeltaTime()/1e3;return this.camera.getScene().useRightHandedSystem&&(e*=-1),this.camera.parent&&this.camera.parent._getWorldMatrixDeterminant()<0&&(e*=-1),e}}(0,n.gn)([(0,s.qC)()],h.prototype,"keysUp",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"keysUpward",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"keysDown",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"keysDownward",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"keysLeft",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"keysRight",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"rotationSpeed",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"keysRotateLeft",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"keysRotateRight",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"keysRotateUp",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"keysRotateDown",void 0),r.u.FreeCameraKeyboardMoveInput=h},3516:(e,t,i)=>{i.d(t,{A:()=>h});var n=i(9472),s=i(5757),r=i(3956),o=i(1181),a=i(1903),l=i(7257);class h{constructor(e=!0){this.touchEnabled=e,this.buttons=[0,1,2],this.angularSensibility=2e3,this._previousPosition=null,this.onPointerMovedObservable=new s.y$,this._allowCameraRotation=!0,this._currentActiveButton=-1,this._activePointerId=-1}attachControl(e){e=l.w1.BackCompatCameraNoPreventDefault(arguments);const t=this.camera.getEngine(),i=t.getInputElement();this._pointerInput||(this._pointerInput=n=>{const s=n.event,r="touch"===s.pointerType;if(t.isInVRExclusivePointerMode)return;if(!this.touchEnabled&&r)return;if(n.type!==a.kD.POINTERMOVE&&-1===this.buttons.indexOf(s.button))return;const o=s.target;if(n.type===a.kD.POINTERDOWN){if(r&&-1!==this._activePointerId||!r&&-1!==this._currentActiveButton)return;this._activePointerId=s.pointerId;try{null==o||o.setPointerCapture(s.pointerId)}catch(e){}-1===this._currentActiveButton&&(this._currentActiveButton=s.button),this._previousPosition={x:s.clientX,y:s.clientY},e||(s.preventDefault(),i&&i.focus()),t.isPointerLock&&this._onMouseMove&&this._onMouseMove(n.event)}else if(n.type===a.kD.POINTERUP){if(r&&this._activePointerId!==s.pointerId||!r&&this._currentActiveButton!==s.button)return;try{null==o||o.releasePointerCapture(s.pointerId)}catch(e){}this._currentActiveButton=-1,this._previousPosition=null,e||s.preventDefault(),this._activePointerId=-1}else if(n.type===a.kD.POINTERMOVE&&(this._activePointerId===s.pointerId||!r))if(t.isPointerLock&&this._onMouseMove)this._onMouseMove(n.event);else if(this._previousPosition){let t=s.clientX-this._previousPosition.x;const i=s.clientY-this._previousPosition.y;this.camera.getScene().useRightHandedSystem&&(t*=-1),this.camera.parent&&this.camera.parent._getWorldMatrixDeterminant()<0&&(t*=-1),this._allowCameraRotation&&(this.camera.cameraRotation.y+=t/this.angularSensibility,this.camera.cameraRotation.x+=i/this.angularSensibility),this.onPointerMovedObservable.notifyObservers({offsetX:t,offsetY:i}),this._previousPosition={x:s.clientX,y:s.clientY},e||s.preventDefault()}}),this._onMouseMove=i=>{if(!t.isPointerLock)return;if(t.isInVRExclusivePointerMode)return;let n=i.movementX;this.camera.getScene().useRightHandedSystem&&(n*=-1),this.camera.parent&&this.camera.parent._getWorldMatrixDeterminant()<0&&(n*=-1),this.camera.cameraRotation.y+=n/this.angularSensibility;const s=i.movementY;this.camera.cameraRotation.x+=s/this.angularSensibility,this._previousPosition=null,e||i.preventDefault()},this._observer=this.camera.getScene()._inputManager._addCameraPointerObserver(this._pointerInput,a.kD.POINTERDOWN|a.kD.POINTERUP|a.kD.POINTERMOVE),i&&(this._contextMenuBind=this.onContextMenu.bind(this),i.addEventListener("contextmenu",this._contextMenuBind,!1))}onContextMenu(e){e.preventDefault()}detachControl(){if(this._observer){if(this.camera.getScene()._inputManager._removeCameraPointerObserver(this._observer),this._contextMenuBind){const e=this.camera.getEngine().getInputElement();e&&e.removeEventListener("contextmenu",this._contextMenuBind)}this.onPointerMovedObservable&&this.onPointerMovedObservable.clear(),this._observer=null,this._onMouseMove=null,this._previousPosition=null}this._currentActiveButton=-1}getClassName(){return"FreeCameraMouseInput"}getSimpleName(){return"mouse"}}(0,n.gn)([(0,r.qC)()],h.prototype,"buttons",void 0),(0,n.gn)([(0,r.qC)()],h.prototype,"angularSensibility",void 0),o.u.FreeCameraMouseInput=h},9891:(e,t,i)=>{i.d(t,{A:()=>c});var n,s=i(9472),r=i(3956),o=i(1181),a=i(9563),l=i(4141),h=i(5203);!function(e){e[e.MoveRelative=0]="MoveRelative",e[e.RotateRelative=1]="RotateRelative",e[e.MoveScene=2]="MoveScene"}(n||(n={}));class c extends a.Y{constructor(){super(...arguments),this._moveRelative=l.P.Zero(),this._rotateRelative=l.P.Zero(),this._moveScene=l.P.Zero(),this._wheelXAction=n.MoveRelative,this._wheelXActionCoordinate=h.c7.X,this._wheelYAction=n.MoveRelative,this._wheelYActionCoordinate=h.c7.Z,this._wheelZAction=null,this._wheelZActionCoordinate=null}getClassName(){return"FreeCameraMouseWheelInput"}set wheelXMoveRelative(e){null===e&&this._wheelXAction!==n.MoveRelative||(this._wheelXAction=n.MoveRelative,this._wheelXActionCoordinate=e)}get wheelXMoveRelative(){return this._wheelXAction!==n.MoveRelative?null:this._wheelXActionCoordinate}set wheelYMoveRelative(e){null===e&&this._wheelYAction!==n.MoveRelative||(this._wheelYAction=n.MoveRelative,this._wheelYActionCoordinate=e)}get wheelYMoveRelative(){return this._wheelYAction!==n.MoveRelative?null:this._wheelYActionCoordinate}set wheelZMoveRelative(e){null===e&&this._wheelZAction!==n.MoveRelative||(this._wheelZAction=n.MoveRelative,this._wheelZActionCoordinate=e)}get wheelZMoveRelative(){return this._wheelZAction!==n.MoveRelative?null:this._wheelZActionCoordinate}set wheelXRotateRelative(e){null===e&&this._wheelXAction!==n.RotateRelative||(this._wheelXAction=n.RotateRelative,this._wheelXActionCoordinate=e)}get wheelXRotateRelative(){return this._wheelXAction!==n.RotateRelative?null:this._wheelXActionCoordinate}set wheelYRotateRelative(e){null===e&&this._wheelYAction!==n.RotateRelative||(this._wheelYAction=n.RotateRelative,this._wheelYActionCoordinate=e)}get wheelYRotateRelative(){return this._wheelYAction!==n.RotateRelative?null:this._wheelYActionCoordinate}set wheelZRotateRelative(e){null===e&&this._wheelZAction!==n.RotateRelative||(this._wheelZAction=n.RotateRelative,this._wheelZActionCoordinate=e)}get wheelZRotateRelative(){return this._wheelZAction!==n.RotateRelative?null:this._wheelZActionCoordinate}set wheelXMoveScene(e){null===e&&this._wheelXAction!==n.MoveScene||(this._wheelXAction=n.MoveScene,this._wheelXActionCoordinate=e)}get wheelXMoveScene(){return this._wheelXAction!==n.MoveScene?null:this._wheelXActionCoordinate}set wheelYMoveScene(e){null===e&&this._wheelYAction!==n.MoveScene||(this._wheelYAction=n.MoveScene,this._wheelYActionCoordinate=e)}get wheelYMoveScene(){return this._wheelYAction!==n.MoveScene?null:this._wheelYActionCoordinate}set wheelZMoveScene(e){null===e&&this._wheelZAction!==n.MoveScene||(this._wheelZAction=n.MoveScene,this._wheelZActionCoordinate=e)}get wheelZMoveScene(){return this._wheelZAction!==n.MoveScene?null:this._wheelZActionCoordinate}checkInputs(){if(0===this._wheelDeltaX&&0===this._wheelDeltaY&&0==this._wheelDeltaZ)return;this._moveRelative.setAll(0),this._rotateRelative.setAll(0),this._moveScene.setAll(0),this._updateCamera(),this.camera.getScene().useRightHandedSystem&&(this._moveRelative.z*=-1);const e=l.y3.Zero();this.camera.getViewMatrix().invertToRef(e);const t=l.P.Zero();l.P.TransformNormalToRef(this._moveRelative,e,t),this.camera.cameraRotation.x+=this._rotateRelative.x/200,this.camera.cameraRotation.y+=this._rotateRelative.y/200,this.camera.cameraDirection.addInPlace(t),this.camera.cameraDirection.addInPlace(this._moveScene),super.checkInputs()}_updateCamera(){this._updateCameraProperty(this._wheelDeltaX,this._wheelXAction,this._wheelXActionCoordinate),this._updateCameraProperty(this._wheelDeltaY,this._wheelYAction,this._wheelYActionCoordinate),this._updateCameraProperty(this._wheelDeltaZ,this._wheelZAction,this._wheelZActionCoordinate)}_updateCameraProperty(e,t,i){if(0===e)return;if(null===t||null===i)return;let s=null;switch(t){case n.MoveRelative:s=this._moveRelative;break;case n.RotateRelative:s=this._rotateRelative;break;case n.MoveScene:s=this._moveScene}switch(i){case h.c7.X:s.set(e,0,0);break;case h.c7.Y:s.set(0,e,0);break;case h.c7.Z:s.set(0,0,e)}}}(0,s.gn)([(0,r.qC)()],c.prototype,"wheelXMoveRelative",null),(0,s.gn)([(0,r.qC)()],c.prototype,"wheelYMoveRelative",null),(0,s.gn)([(0,r.qC)()],c.prototype,"wheelZMoveRelative",null),(0,s.gn)([(0,r.qC)()],c.prototype,"wheelXRotateRelative",null),(0,s.gn)([(0,r.qC)()],c.prototype,"wheelYRotateRelative",null),(0,s.gn)([(0,r.qC)()],c.prototype,"wheelZRotateRelative",null),(0,s.gn)([(0,r.qC)()],c.prototype,"wheelXMoveScene",null),(0,s.gn)([(0,r.qC)()],c.prototype,"wheelYMoveScene",null),(0,s.gn)([(0,r.qC)()],c.prototype,"wheelZMoveScene",null),o.u.FreeCameraMouseWheelInput=c},7932:(e,t,i)=>{i.d(t,{y:()=>h});var n=i(9472),s=i(3956),r=i(1181),o=i(1903),a=i(4141),l=i(7257);class h{constructor(e=!1){this.allowMouse=e,this.touchAngularSensibility=2e5,this.touchMoveSensibility=250,this.singleFingerRotate=!1,this._offsetX=null,this._offsetY=null,this._pointerPressed=new Array,this._isSafari=l.w1.IsSafari()}attachControl(e){e=l.w1.BackCompatCameraNoPreventDefault(arguments);let t=null;if(void 0===this._pointerInput&&(this._onLostFocus=()=>{this._offsetX=null,this._offsetY=null},this._pointerInput=i=>{const n=i.event,s="mouse"===n.pointerType||this._isSafari&&void 0===n.pointerType;if(this.allowMouse||!s)if(i.type===o.kD.POINTERDOWN){if(e||n.preventDefault(),this._pointerPressed.push(n.pointerId),1!==this._pointerPressed.length)return;t={x:n.clientX,y:n.clientY}}else if(i.type===o.kD.POINTERUP){e||n.preventDefault();const i=this._pointerPressed.indexOf(n.pointerId);if(-1===i)return;if(this._pointerPressed.splice(i,1),0!=i)return;t=null,this._offsetX=null,this._offsetY=null}else if(i.type===o.kD.POINTERMOVE){if(e||n.preventDefault(),!t)return;if(0!=this._pointerPressed.indexOf(n.pointerId))return;this._offsetX=n.clientX-t.x,this._offsetY=-(n.clientY-t.y)}}),this._observer=this.camera.getScene()._inputManager._addCameraPointerObserver(this._pointerInput,o.kD.POINTERDOWN|o.kD.POINTERUP|o.kD.POINTERMOVE),this._onLostFocus){const e=this.camera.getEngine().getInputElement();e&&e.addEventListener("blur",this._onLostFocus)}}detachControl(){if(this._pointerInput){if(this._observer&&(this.camera.getScene()._inputManager._removeCameraPointerObserver(this._observer),this._observer=null),this._onLostFocus){const e=this.camera.getEngine().getInputElement();e&&e.removeEventListener("blur",this._onLostFocus),this._onLostFocus=null}this._pointerPressed.length=0,this._offsetX=null,this._offsetY=null}}checkInputs(){if(null===this._offsetX||null===this._offsetY)return;if(0===this._offsetX&&0===this._offsetY)return;const e=this.camera;if(e.cameraRotation.y=this._offsetX/this.touchAngularSensibility,this.singleFingerRotate&&1===this._pointerPressed.length||!this.singleFingerRotate&&this._pointerPressed.length>1)e.cameraRotation.x=-this._offsetY/this.touchAngularSensibility;else{const t=e._computeLocalCameraSpeed(),i=new a.P(0,0,0!==this.touchMoveSensibility?t*this._offsetY/this.touchMoveSensibility:0);a.y3.RotationYawPitchRollToRef(e.rotation.y,e.rotation.x,0,e._cameraRotationMatrix),e.cameraDirection.addInPlace(a.P.TransformCoordinates(i,e._cameraRotationMatrix))}}getClassName(){return"FreeCameraTouchInput"}getSimpleName(){return"touch"}}(0,n.gn)([(0,s.qC)()],h.prototype,"touchAngularSensibility",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"touchMoveSensibility",void 0),r.u.FreeCameraTouchInput=h},2704:(e,t,i)=>{i.d(t,{V:()=>_});var n=i(9472),s=i(3956),r=i(5363),o=i(7257),a=i(5757),l=i(4141),h=i(9257),c=i(2722),u=i(2208),d=i(4934),p=i(4538),f=i(1560);class _ extends h.N{get position(){return this._position}set position(e){this._position=e}set upVector(e){this._upVector=e}get upVector(){return this._upVector}get screenArea(){var e,t,i,n;let s=0,r=0;if(this.mode===_.PERSPECTIVE_CAMERA)this.fovMode===_.FOVMODE_VERTICAL_FIXED?(r=2*this.minZ*Math.tan(this.fov/2),s=this.getEngine().getAspectRatio(this)*r):(s=2*this.minZ*Math.tan(this.fov/2),r=s/this.getEngine().getAspectRatio(this));else{const o=this.getEngine().getRenderWidth()/2,a=this.getEngine().getRenderHeight()/2;s=(null!==(e=this.orthoRight)&&void 0!==e?e:o)-(null!==(t=this.orthoLeft)&&void 0!==t?t:-o),r=(null!==(i=this.orthoTop)&&void 0!==i?i:a)-(null!==(n=this.orthoBottom)&&void 0!==n?n:-a)}return s*r}set orthoLeft(e){this._orthoLeft=e;for(const t of this._rigCameras)t.orthoLeft=e}get orthoLeft(){return this._orthoLeft}set orthoRight(e){this._orthoRight=e;for(const t of this._rigCameras)t.orthoRight=e}get orthoRight(){return this._orthoRight}set orthoBottom(e){this._orthoBottom=e;for(const t of this._rigCameras)t.orthoBottom=e}get orthoBottom(){return this._orthoBottom}set orthoTop(e){this._orthoTop=e;for(const t of this._rigCameras)t.orthoTop=e}get orthoTop(){return this._orthoTop}set mode(e){this._mode=e;for(const t of this._rigCameras)t.mode=e}get mode(){return this._mode}constructor(e,t,i,n=!0){super(e,i),this._position=l.P.Zero(),this._upVector=l.P.Up(),this._orthoLeft=null,this._orthoRight=null,this._orthoBottom=null,this._orthoTop=null,this.fov=.8,this.projectionPlaneTilt=0,this.minZ=1,this.maxZ=1e4,this.inertia=.9,this._mode=_.PERSPECTIVE_CAMERA,this.isIntermediate=!1,this.viewport=new p.l(0,0,1,1),this.layerMask=268435455,this.fovMode=_.FOVMODE_VERTICAL_FIXED,this.cameraRigMode=_.RIG_MODE_NONE,this.customRenderTargets=new Array,this.outputRenderTarget=null,this.onViewMatrixChangedObservable=new a.y$,this.onProjectionMatrixChangedObservable=new a.y$,this.onAfterCheckInputsObservable=new a.y$,this.onRestoreStateObservable=new a.y$,this.isRigCamera=!1,this._rigCameras=new Array,this._webvrViewMatrix=l.y3.Identity(),this._skipRendering=!1,this._projectionMatrix=new l.y3,this._postProcesses=new Array,this._activeMeshes=new r.t(256),this._globalPosition=l.P.Zero(),this._computedViewMatrix=l.y3.Identity(),this._doNotComputeProjectionMatrix=!1,this._transformMatrix=l.y3.Zero(),this._refreshFrustumPlanes=!0,this._absoluteRotation=l._f.Identity(),this._isCamera=!0,this._isLeftCamera=!1,this._isRightCamera=!1,this.getScene().addCamera(this),n&&!this.getScene().activeCamera&&(this.getScene().activeCamera=this),this.position=t,this.renderPassId=this.getScene().getEngine().createRenderPassId(`Camera ${e}`)}storeState(){return this._stateStored=!0,this._storedFov=this.fov,this}_restoreStateValues(){return!!this._stateStored&&(this.fov=this._storedFov,!0)}restoreState(){return!!this._restoreStateValues()&&(this.onRestoreStateObservable.notifyObservers(this),!0)}getClassName(){return"Camera"}toString(e){let t="Name: "+this.name;if(t+=", type: "+this.getClassName(),this.animations)for(let i=0;i<this.animations.length;i++)t+=", animation[0]: "+this.animations[i].toString(e);return t}applyVerticalCorrection(){const e=this.absoluteRotation.toEulerAngles();this.projectionPlaneTilt=this._scene.useRightHandedSystem?-e.x:e.x}get globalPosition(){return this._globalPosition}getActiveMeshes(){return this._activeMeshes}isActiveMesh(e){return-1!==this._activeMeshes.indexOf(e)}isReady(e=!1){if(e)for(const e of this._postProcesses)if(e&&!e.isReady())return!1;return super.isReady(e)}_initCache(){super._initCache(),this._cache.position=new l.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),this._cache.upVector=new l.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),this._cache.mode=void 0,this._cache.minZ=void 0,this._cache.maxZ=void 0,this._cache.fov=void 0,this._cache.fovMode=void 0,this._cache.aspectRatio=void 0,this._cache.orthoLeft=void 0,this._cache.orthoRight=void 0,this._cache.orthoBottom=void 0,this._cache.orthoTop=void 0,this._cache.renderWidth=void 0,this._cache.renderHeight=void 0}_updateCache(e){e||super._updateCache(),this._cache.position.copyFrom(this.position),this._cache.upVector.copyFrom(this.upVector)}_isSynchronized(){return this._isSynchronizedViewMatrix()&&this._isSynchronizedProjectionMatrix()}_isSynchronizedViewMatrix(){return!!super._isSynchronized()&&this._cache.position.equals(this.position)&&this._cache.upVector.equals(this.upVector)&&this.isSynchronizedWithParent()}_isSynchronizedProjectionMatrix(){let e=this._cache.mode===this.mode&&this._cache.minZ===this.minZ&&this._cache.maxZ===this.maxZ;if(!e)return!1;const t=this.getEngine();return e=this.mode===_.PERSPECTIVE_CAMERA?this._cache.fov===this.fov&&this._cache.fovMode===this.fovMode&&this._cache.aspectRatio===t.getAspectRatio(this)&&this._cache.projectionPlaneTilt===this.projectionPlaneTilt:this._cache.orthoLeft===this.orthoLeft&&this._cache.orthoRight===this.orthoRight&&this._cache.orthoBottom===this.orthoBottom&&this._cache.orthoTop===this.orthoTop&&this._cache.renderWidth===t.getRenderWidth()&&this._cache.renderHeight===t.getRenderHeight(),e}attachControl(e,t){}detachControl(e){}update(){this._checkInputs(),this.cameraRigMode!==_.RIG_MODE_NONE&&this._updateRigCameras(),this.getViewMatrix(),this.getProjectionMatrix()}_checkInputs(){this.onAfterCheckInputsObservable.notifyObservers(this)}get rigCameras(){return this._rigCameras}get rigPostProcess(){return this._rigPostProcess}_getFirstPostProcess(){for(let e=0;e<this._postProcesses.length;e++)if(null!==this._postProcesses[e])return this._postProcesses[e];return null}_cascadePostProcessesToRigCams(){const e=this._getFirstPostProcess();e&&e.markTextureDirty();for(let e=0,t=this._rigCameras.length;e<t;e++){const t=this._rigCameras[e],i=t._rigPostProcess;i?("pass"===i.getEffectName()&&(t.isIntermediate=0===this._postProcesses.length),t._postProcesses=this._postProcesses.slice(0).concat(i),i.markTextureDirty()):t._postProcesses=this._postProcesses.slice(0)}}attachPostProcess(e,t=null){return!e.isReusable()&&this._postProcesses.indexOf(e)>-1?(c.Y.Error("You're trying to reuse a post process not defined as reusable."),0):(null==t||t<0?this._postProcesses.push(e):null===this._postProcesses[t]?this._postProcesses[t]=e:this._postProcesses.splice(t,0,e),this._cascadePostProcessesToRigCams(),this._scene.prePassRenderer&&this._scene.prePassRenderer.markAsDirty(),this._postProcesses.indexOf(e))}detachPostProcess(e){const t=this._postProcesses.indexOf(e);-1!==t&&(this._postProcesses[t]=null),this._scene.prePassRenderer&&this._scene.prePassRenderer.markAsDirty(),this._cascadePostProcessesToRigCams()}getWorldMatrix(){return this._isSynchronizedViewMatrix()||this.getViewMatrix(),this._worldMatrix}_getViewMatrix(){return l.y3.Identity()}getViewMatrix(e){return!e&&this._isSynchronizedViewMatrix()||(this.updateCache(),this._computedViewMatrix=this._getViewMatrix(),this._currentRenderId=this.getScene().getRenderId(),this._childUpdateId++,this._refreshFrustumPlanes=!0,this._cameraRigParams&&this._cameraRigParams.vrPreViewMatrix&&this._computedViewMatrix.multiplyToRef(this._cameraRigParams.vrPreViewMatrix,this._computedViewMatrix),this.parent&&this.parent.onViewMatrixChangedObservable&&this.parent.onViewMatrixChangedObservable.notifyObservers(this.parent),this.onViewMatrixChangedObservable.notifyObservers(this),this._computedViewMatrix.invertToRef(this._worldMatrix)),this._computedViewMatrix}freezeProjectionMatrix(e){this._doNotComputeProjectionMatrix=!0,void 0!==e&&(this._projectionMatrix=e)}unfreezeProjectionMatrix(){this._doNotComputeProjectionMatrix=!1}getProjectionMatrix(e){var t,i,n,s,r,o,a,h;if(this._doNotComputeProjectionMatrix||!e&&this._isSynchronizedProjectionMatrix())return this._projectionMatrix;this._cache.mode=this.mode,this._cache.minZ=this.minZ,this._cache.maxZ=this.maxZ,this._refreshFrustumPlanes=!0;const c=this.getEngine(),u=this.getScene(),d=c.useReverseDepthBuffer;if(this.mode===_.PERSPECTIVE_CAMERA){let e;this._cache.fov=this.fov,this._cache.fovMode=this.fovMode,this._cache.aspectRatio=c.getAspectRatio(this),this._cache.projectionPlaneTilt=this.projectionPlaneTilt,this.minZ<=0&&(this.minZ=.1),e=u.useRightHandedSystem?l.y3.PerspectiveFovRHToRef:l.y3.PerspectiveFovLHToRef,e(this.fov,c.getAspectRatio(this),d?this.maxZ:this.minZ,d?this.minZ:this.maxZ,this._projectionMatrix,this.fovMode===_.FOVMODE_VERTICAL_FIXED,c.isNDCHalfZRange,this.projectionPlaneTilt,d)}else{const e=c.getRenderWidth()/2,p=c.getRenderHeight()/2;u.useRightHandedSystem?l.y3.OrthoOffCenterRHToRef(null!==(t=this.orthoLeft)&&void 0!==t?t:-e,null!==(i=this.orthoRight)&&void 0!==i?i:e,null!==(n=this.orthoBottom)&&void 0!==n?n:-p,null!==(s=this.orthoTop)&&void 0!==s?s:p,d?this.maxZ:this.minZ,d?this.minZ:this.maxZ,this._projectionMatrix,c.isNDCHalfZRange):l.y3.OrthoOffCenterLHToRef(null!==(r=this.orthoLeft)&&void 0!==r?r:-e,null!==(o=this.orthoRight)&&void 0!==o?o:e,null!==(a=this.orthoBottom)&&void 0!==a?a:-p,null!==(h=this.orthoTop)&&void 0!==h?h:p,d?this.maxZ:this.minZ,d?this.minZ:this.maxZ,this._projectionMatrix,c.isNDCHalfZRange),this._cache.orthoLeft=this.orthoLeft,this._cache.orthoRight=this.orthoRight,this._cache.orthoBottom=this.orthoBottom,this._cache.orthoTop=this.orthoTop,this._cache.renderWidth=c.getRenderWidth(),this._cache.renderHeight=c.getRenderHeight()}return this.onProjectionMatrixChangedObservable.notifyObservers(this),this._projectionMatrix}getTransformationMatrix(){return this._computedViewMatrix.multiplyToRef(this._projectionMatrix,this._transformMatrix),this._transformMatrix}_updateFrustumPlanes(){this._refreshFrustumPlanes&&(this.getTransformationMatrix(),this._frustumPlanes?f.i.GetPlanesToRef(this._transformMatrix,this._frustumPlanes):this._frustumPlanes=f.i.GetPlanes(this._transformMatrix),this._refreshFrustumPlanes=!1)}isInFrustum(e,t=!1){if(this._updateFrustumPlanes(),t&&this.rigCameras.length>0){let t=!1;return this.rigCameras.forEach((i=>{i._updateFrustumPlanes(),t=t||e.isInFrustum(i._frustumPlanes)})),t}return e.isInFrustum(this._frustumPlanes)}isCompletelyInFrustum(e){return this._updateFrustumPlanes(),e.isCompletelyInFrustum(this._frustumPlanes)}getForwardRay(e=100,t,i){throw(0,d.S)("Ray")}getForwardRayToRef(e,t=100,i,n){throw(0,d.S)("Ray")}dispose(e,t=!1){for(this.onViewMatrixChangedObservable.clear(),this.onProjectionMatrixChangedObservable.clear(),this.onAfterCheckInputsObservable.clear(),this.onRestoreStateObservable.clear(),this.inputs&&this.inputs.clear(),this.getScene().stopAnimation(this),this.getScene().removeCamera(this);this._rigCameras.length>0;){const e=this._rigCameras.pop();e&&e.dispose()}if(this._parentContainer){const e=this._parentContainer.cameras.indexOf(this);e>-1&&this._parentContainer.cameras.splice(e,1),this._parentContainer=null}if(this._rigPostProcess)this._rigPostProcess.dispose(this),this._rigPostProcess=null,this._postProcesses.length=0;else if(this.cameraRigMode!==_.RIG_MODE_NONE)this._rigPostProcess=null,this._postProcesses.length=0;else{let e=this._postProcesses.length;for(;--e>=0;){const t=this._postProcesses[e];t&&t.dispose(this)}}let i=this.customRenderTargets.length;for(;--i>=0;)this.customRenderTargets[i].dispose();this.customRenderTargets.length=0,this._activeMeshes.dispose(),this.getScene().getEngine().releaseRenderPassId(this.renderPassId),super.dispose(e,t)}get isLeftCamera(){return this._isLeftCamera}get isRightCamera(){return this._isRightCamera}get leftCamera(){return this._rigCameras.length<1?null:this._rigCameras[0]}get rightCamera(){return this._rigCameras.length<2?null:this._rigCameras[1]}getLeftTarget(){return this._rigCameras.length<1?null:this._rigCameras[0].getTarget()}getRightTarget(){return this._rigCameras.length<2?null:this._rigCameras[1].getTarget()}setCameraRigMode(e,t){if(this.cameraRigMode!==e){for(;this._rigCameras.length>0;){const e=this._rigCameras.pop();e&&e.dispose()}if(this.cameraRigMode=e,this._cameraRigParams={},this._cameraRigParams.interaxialDistance=t.interaxialDistance||.0637,this._cameraRigParams.stereoHalfAngle=o.w1.ToRadians(this._cameraRigParams.interaxialDistance/.0637),this.cameraRigMode!==_.RIG_MODE_NONE){const e=this.createRigCamera(this.name+"_L",0);e&&(e._isLeftCamera=!0);const t=this.createRigCamera(this.name+"_R",1);t&&(t._isRightCamera=!0),e&&t&&(this._rigCameras.push(e),this._rigCameras.push(t))}this._setRigMode(t),this._cascadePostProcessesToRigCams(),this.update()}}_setRigMode(e){}_getVRProjectionMatrix(){return l.y3.PerspectiveFovLHToRef(this._cameraRigParams.vrMetrics.aspectRatioFov,this._cameraRigParams.vrMetrics.aspectRatio,this.minZ,this.maxZ,this._cameraRigParams.vrWorkMatrix,!0,this.getEngine().isNDCHalfZRange),this._cameraRigParams.vrWorkMatrix.multiplyToRef(this._cameraRigParams.vrHMatrix,this._projectionMatrix),this._projectionMatrix}_updateCameraRotationMatrix(){}_updateWebVRCameraRotationMatrix(){}_getWebVRProjectionMatrix(){return l.y3.Identity()}_getWebVRViewMatrix(){return l.y3.Identity()}setCameraRigParameter(e,t){this._cameraRigParams||(this._cameraRigParams={}),this._cameraRigParams[e]=t,"interaxialDistance"===e&&(this._cameraRigParams.stereoHalfAngle=o.w1.ToRadians(t/.0637))}createRigCamera(e,t){return null}_updateRigCameras(){for(let e=0;e<this._rigCameras.length;e++)this._rigCameras[e].minZ=this.minZ,this._rigCameras[e].maxZ=this.maxZ,this._rigCameras[e].fov=this.fov,this._rigCameras[e].upVector.copyFrom(this.upVector);this.cameraRigMode===_.RIG_MODE_STEREOSCOPIC_ANAGLYPH&&(this._rigCameras[0].viewport=this._rigCameras[1].viewport=this.viewport)}_setupInputs(){}serialize(){const e=s.p4.Serialize(this);return e.uniqueId=this.uniqueId,e.type=this.getClassName(),this.parent&&this.parent._serializeAsParent(e),this.inputs&&this.inputs.serialize(e),s.p4.AppendSerializedAnimations(this,e),e.ranges=this.serializeAnimationRanges(),e.isEnabled=this.isEnabled(),e}clone(e,t=null){const i=s.p4.Clone(_.GetConstructorFromName(this.getClassName(),e,this.getScene(),this.interaxialDistance,this.isStereoscopicSideBySide),this);return i.name=e,i.parent=t,this.onClonedObservable.notifyObservers(i),i}getDirection(e){const t=l.P.Zero();return this.getDirectionToRef(e,t),t}get absoluteRotation(){return this.getWorldMatrix().decompose(void 0,this._absoluteRotation),this._absoluteRotation}getDirectionToRef(e,t){l.P.TransformNormalToRef(e,this.getWorldMatrix(),t)}static GetConstructorFromName(e,t,i,n=0,s=!0){return h.N.Construct(e,t,i,{interaxial_distance:n,isStereoscopicSideBySide:s})||(()=>_._CreateDefaultParsedCamera(t,i))}computeWorldMatrix(){return this.getWorldMatrix()}static Parse(e,t){const i=e.type,n=_.GetConstructorFromName(i,e.name,t,e.interaxial_distance,e.isStereoscopicSideBySide),r=s.p4.Parse(n,e,t);if(void 0!==e.parentId&&(r._waitingParentId=e.parentId),void 0!==e.parentInstanceIndex&&(r._waitingParentInstanceIndex=e.parentInstanceIndex),r.inputs&&(r.inputs.parse(e),r._setupInputs()),e.upVector&&(r.upVector=l.P.FromArray(e.upVector)),r.setPosition&&(r.position.copyFromFloats(0,0,0),r.setPosition(l.P.FromArray(e.position))),e.target&&r.setTarget&&r.setTarget(l.P.FromArray(e.target)),e.cameraRigMode){const t=e.interaxial_distance?{interaxialDistance:e.interaxial_distance}:{};r.setCameraRigMode(e.cameraRigMode,t)}if(e.animations){for(let t=0;t<e.animations.length;t++){const i=e.animations[t],n=(0,u.q)("BABYLON.Animation");n&&r.animations.push(n.Parse(i))}h.N.ParseAnimationRanges(r,e,t)}return e.autoAnimate&&t.beginAnimation(r,e.autoAnimateFrom,e.autoAnimateTo,e.autoAnimateLoop,e.autoAnimateSpeed||1),void 0!==e.isEnabled&&r.setEnabled(e.isEnabled),r}}_._CreateDefaultParsedCamera=(e,t)=>{throw(0,d.S)("UniversalCamera")},_.PERSPECTIVE_CAMERA=0,_.ORTHOGRAPHIC_CAMERA=1,_.FOVMODE_VERTICAL_FIXED=0,_.FOVMODE_HORIZONTAL_FIXED=1,_.RIG_MODE_NONE=0,_.RIG_MODE_STEREOSCOPIC_ANAGLYPH=10,_.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL=11,_.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_CROSSEYED=12,_.RIG_MODE_STEREOSCOPIC_OVERUNDER=13,_.RIG_MODE_STEREOSCOPIC_INTERLACED=14,_.RIG_MODE_VR=20,_.RIG_MODE_WEBVR=21,_.RIG_MODE_CUSTOM=22,_.ForceAttachControlToAlwaysPreventDefault=!1,(0,n.gn)([(0,s.hd)("position")],_.prototype,"_position",void 0),(0,n.gn)([(0,s.hd)("upVector")],_.prototype,"_upVector",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"orthoLeft",null),(0,n.gn)([(0,s.qC)()],_.prototype,"orthoRight",null),(0,n.gn)([(0,s.qC)()],_.prototype,"orthoBottom",null),(0,n.gn)([(0,s.qC)()],_.prototype,"orthoTop",null),(0,n.gn)([(0,s.qC)()],_.prototype,"fov",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"projectionPlaneTilt",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"minZ",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"maxZ",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"inertia",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"mode",null),(0,n.gn)([(0,s.qC)()],_.prototype,"layerMask",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"fovMode",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"cameraRigMode",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"interaxialDistance",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"isStereoscopicSideBySide",void 0)},1181:(e,t,i)=>{i.d(t,{p:()=>a,u:()=>o});var n=i(2722),s=i(3956),r=i(2704),o={};class a{constructor(e){this.attachedToElement=!1,this.attached={},this.camera=e,this.checkInputs=()=>{}}add(e){const t=e.getSimpleName();this.attached[t]?n.Y.Warn("camera input of type "+t+" already exists on camera"):(this.attached[t]=e,e.camera=this.camera,e.checkInputs&&(this.checkInputs=this._addCheckInputs(e.checkInputs.bind(e))),this.attachedToElement&&e.attachControl(this.noPreventDefault))}remove(e){for(const t in this.attached){const i=this.attached[t];if(i===e)return i.detachControl(),i.camera=null,delete this.attached[t],void this.rebuildInputCheck()}}removeByType(e){for(const t in this.attached){const i=this.attached[t];i.getClassName()===e&&(i.detachControl(),i.camera=null,delete this.attached[t],this.rebuildInputCheck())}}_addCheckInputs(e){const t=this.checkInputs;return()=>{t(),e()}}attachInput(e){this.attachedToElement&&e.attachControl(this.noPreventDefault)}attachElement(e=!1){if(!this.attachedToElement){e=!r.V.ForceAttachControlToAlwaysPreventDefault&&e,this.attachedToElement=!0,this.noPreventDefault=e;for(const t in this.attached)this.attached[t].attachControl(e)}}detachElement(e=!1){for(const t in this.attached)this.attached[t].detachControl(),e&&(this.attached[t].camera=null);this.attachedToElement=!1}rebuildInputCheck(){this.checkInputs=()=>{};for(const e in this.attached){const t=this.attached[e];t.checkInputs&&(this.checkInputs=this._addCheckInputs(t.checkInputs.bind(t)))}}clear(){this.attachedToElement&&this.detachElement(!0),this.attached={},this.attachedToElement=!1,this.checkInputs=()=>{}}serialize(e){const t={};for(const e in this.attached){const i=this.attached[e],n=s.p4.Serialize(i);t[i.getClassName()]=n}e.inputsmgr=t}parse(e){const t=e.inputsmgr;if(t){this.clear();for(const e in t){const i=o[e];if(i){const n=t[e],r=s.p4.Parse((()=>new i),n,null);this.add(r)}}}else for(const t in this.attached){const i=o[this.attached[t].getClassName()];if(i){const n=s.p4.Parse((()=>new i),e,null);this.remove(this.attached[t]),this.add(n)}}}}},8482:(e,t,i)=>{i.d(t,{c:()=>c});var n=i(9472),s=i(3956),r=i(4141),o=i(7814),a=i(3835),l=i(189),h=i(7257);class c extends a.C{get angularSensibility(){const e=this.inputs.attached.mouse;return e?e.angularSensibility:0}set angularSensibility(e){const t=this.inputs.attached.mouse;t&&(t.angularSensibility=e)}get keysUp(){const e=this.inputs.attached.keyboard;return e?e.keysUp:[]}set keysUp(e){const t=this.inputs.attached.keyboard;t&&(t.keysUp=e)}get keysUpward(){const e=this.inputs.attached.keyboard;return e?e.keysUpward:[]}set keysUpward(e){const t=this.inputs.attached.keyboard;t&&(t.keysUpward=e)}get keysDown(){const e=this.inputs.attached.keyboard;return e?e.keysDown:[]}set keysDown(e){const t=this.inputs.attached.keyboard;t&&(t.keysDown=e)}get keysDownward(){const e=this.inputs.attached.keyboard;return e?e.keysDownward:[]}set keysDownward(e){const t=this.inputs.attached.keyboard;t&&(t.keysDownward=e)}get keysLeft(){const e=this.inputs.attached.keyboard;return e?e.keysLeft:[]}set keysLeft(e){const t=this.inputs.attached.keyboard;t&&(t.keysLeft=e)}get keysRight(){const e=this.inputs.attached.keyboard;return e?e.keysRight:[]}set keysRight(e){const t=this.inputs.attached.keyboard;t&&(t.keysRight=e)}get keysRotateLeft(){const e=this.inputs.attached.keyboard;return e?e.keysRotateLeft:[]}set keysRotateLeft(e){const t=this.inputs.attached.keyboard;t&&(t.keysRotateLeft=e)}get keysRotateRight(){const e=this.inputs.attached.keyboard;return e?e.keysRotateRight:[]}set keysRotateRight(e){const t=this.inputs.attached.keyboard;t&&(t.keysRotateRight=e)}get keysRotateUp(){const e=this.inputs.attached.keyboard;return e?e.keysRotateUp:[]}set keysRotateUp(e){const t=this.inputs.attached.keyboard;t&&(t.keysRotateUp=e)}get keysRotateDown(){const e=this.inputs.attached.keyboard;return e?e.keysRotateDown:[]}set keysRotateDown(e){const t=this.inputs.attached.keyboard;t&&(t.keysRotateDown=e)}constructor(e,t,i,n=!0){super(e,t,i,n),this.ellipsoid=new r.P(.5,1,.5),this.ellipsoidOffset=new r.P(0,0,0),this.checkCollisions=!1,this.applyGravity=!1,this._needMoveForGravity=!1,this._oldPosition=r.P.Zero(),this._diffPosition=r.P.Zero(),this._newPosition=r.P.Zero(),this._collisionMask=-1,this._onCollisionPositionChange=(e,t,i=null)=>{(e=>{this._newPosition.copyFrom(e),this._newPosition.subtractToRef(this._oldPosition,this._diffPosition),this._diffPosition.length()>o.D.CollisionsEpsilon&&(this.position.addInPlace(this._diffPosition),this.onCollide&&i&&this.onCollide(i))})(t)},this.inputs=new l.a(this),this.inputs.addKeyboard().addMouse()}attachControl(e,t){t=h.w1.BackCompatCameraNoPreventDefault(arguments),this.inputs.attachElement(t)}detachControl(){this.inputs.detachElement(),this.cameraDirection=new r.P(0,0,0),this.cameraRotation=new r.FM(0,0)}get collisionMask(){return this._collisionMask}set collisionMask(e){this._collisionMask=isNaN(e)?-1:e}_collideWithWorld(e){let t;t=this.parent?r.P.TransformCoordinates(this.position,this.parent.getWorldMatrix()):this.position,t.subtractFromFloatsToRef(0,this.ellipsoid.y,0,this._oldPosition),this._oldPosition.addInPlace(this.ellipsoidOffset);const i=this.getScene().collisionCoordinator;this._collider||(this._collider=i.createCollider()),this._collider._radius=this.ellipsoid,this._collider.collisionMask=this._collisionMask;let n=e;this.applyGravity&&(n=e.add(this.getScene().gravity)),i.getNewPosition(this._oldPosition,n,this._collider,3,null,this._onCollisionPositionChange,this.uniqueId)}_checkInputs(){this._localDirection||(this._localDirection=r.P.Zero(),this._transformedDirection=r.P.Zero()),this.inputs.checkInputs(),super._checkInputs()}_decideIfNeedsToMove(){return this._needMoveForGravity||Math.abs(this.cameraDirection.x)>0||Math.abs(this.cameraDirection.y)>0||Math.abs(this.cameraDirection.z)>0}_updatePosition(){this.checkCollisions&&this.getScene().collisionsEnabled?this._collideWithWorld(this.cameraDirection):super._updatePosition()}dispose(){this.inputs.clear(),super.dispose()}getClassName(){return"FreeCamera"}}(0,n.gn)([(0,s.hd)()],c.prototype,"ellipsoid",void 0),(0,n.gn)([(0,s.hd)()],c.prototype,"ellipsoidOffset",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"checkCollisions",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"applyGravity",void 0)},189:(e,t,i)=>{i.d(t,{a:()=>l});var n=i(1181),s=i(1399),r=i(3516),o=i(9891),a=i(7932);class l extends n.p{constructor(e){super(e),this._mouseInput=null,this._mouseWheelInput=null}addKeyboard(){return this.add(new s.Y),this}addMouse(e=!0){return this._mouseInput||(this._mouseInput=new r.A(e),this.add(this._mouseInput)),this}removeMouse(){return this._mouseInput&&this.remove(this._mouseInput),this}addMouseWheel(){return this._mouseWheelInput||(this._mouseWheelInput=new o.A,this.add(this._mouseWheelInput)),this}removeMouseWheel(){return this._mouseWheelInput&&this.remove(this._mouseWheelInput),this}addTouch(){return this.add(new a.y),this}clear(){super.clear(),this._mouseInput=null}}},3835:(e,t,i)=>{i.d(t,{C:()=>h});var n=i(9472),s=i(3956),r=i(2704),o=i(4141),a=i(1341),l=i(5203);class h extends r.V{constructor(e,t,i,n=!0){super(e,t,i,n),this._tmpUpVector=o.P.Zero(),this._tmpTargetVector=o.P.Zero(),this.cameraDirection=new o.P(0,0,0),this.cameraRotation=new o.FM(0,0),this.ignoreParentScaling=!1,this.updateUpVectorFromRotation=!1,this._tmpQuaternion=new o._f,this.rotation=new o.P(0,0,0),this.speed=2,this.noRotationConstraint=!1,this.invertRotation=!1,this.inverseRotationSpeed=.2,this.lockedTarget=null,this._currentTarget=o.P.Zero(),this._initialFocalDistance=1,this._viewMatrix=o.y3.Zero(),this._camMatrix=o.y3.Zero(),this._cameraTransformMatrix=o.y3.Zero(),this._cameraRotationMatrix=o.y3.Zero(),this._referencePoint=new o.P(0,0,1),this._transformedReferencePoint=o.P.Zero(),this._defaultUp=o.P.Up(),this._cachedRotationZ=0,this._cachedQuaternionRotationZ=0}getFrontPosition(e){this.getWorldMatrix();const t=this.getTarget().subtract(this.position);return t.normalize(),t.scaleInPlace(e),this.globalPosition.add(t)}_getLockedTargetPosition(){if(!this.lockedTarget)return null;if(this.lockedTarget.absolutePosition){const e=this.lockedTarget;e.computeWorldMatrix().getTranslationToRef(e.absolutePosition)}return this.lockedTarget.absolutePosition||this.lockedTarget}storeState(){return this._storedPosition=this.position.clone(),this._storedRotation=this.rotation.clone(),this.rotationQuaternion&&(this._storedRotationQuaternion=this.rotationQuaternion.clone()),super.storeState()}_restoreStateValues(){return!!super._restoreStateValues()&&(this.position=this._storedPosition.clone(),this.rotation=this._storedRotation.clone(),this.rotationQuaternion&&(this.rotationQuaternion=this._storedRotationQuaternion.clone()),this.cameraDirection.copyFromFloats(0,0,0),this.cameraRotation.copyFromFloats(0,0),!0)}_initCache(){super._initCache(),this._cache.lockedTarget=new o.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),this._cache.rotation=new o.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),this._cache.rotationQuaternion=new o._f(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE)}_updateCache(e){e||super._updateCache();const t=this._getLockedTargetPosition();t?this._cache.lockedTarget?this._cache.lockedTarget.copyFrom(t):this._cache.lockedTarget=t.clone():this._cache.lockedTarget=null,this._cache.rotation.copyFrom(this.rotation),this.rotationQuaternion&&this._cache.rotationQuaternion.copyFrom(this.rotationQuaternion)}_isSynchronizedViewMatrix(){if(!super._isSynchronizedViewMatrix())return!1;const e=this._getLockedTargetPosition();return(this._cache.lockedTarget?this._cache.lockedTarget.equals(e):!e)&&(this.rotationQuaternion?this.rotationQuaternion.equals(this._cache.rotationQuaternion):this._cache.rotation.equals(this.rotation))}_computeLocalCameraSpeed(){const e=this.getEngine();return this.speed*Math.sqrt(e.getDeltaTime()/(100*e.getFps()))}setTarget(e){this.upVector.normalize(),this._initialFocalDistance=e.subtract(this.position).length(),this.position.z===e.z&&(this.position.z+=a.kn),this._referencePoint.normalize().scaleInPlace(this._initialFocalDistance),o.y3.LookAtLHToRef(this.position,e,this._defaultUp,this._camMatrix),this._camMatrix.invert(),this.rotation.x=Math.atan(this._camMatrix.m[6]/this._camMatrix.m[10]);const t=e.subtract(this.position);t.x>=0?this.rotation.y=-Math.atan(t.z/t.x)+Math.PI/2:this.rotation.y=-Math.atan(t.z/t.x)-Math.PI/2,this.rotation.z=0,isNaN(this.rotation.x)&&(this.rotation.x=0),isNaN(this.rotation.y)&&(this.rotation.y=0),isNaN(this.rotation.z)&&(this.rotation.z=0),this.rotationQuaternion&&o._f.RotationYawPitchRollToRef(this.rotation.y,this.rotation.x,this.rotation.z,this.rotationQuaternion)}get target(){return this.getTarget()}set target(e){this.setTarget(e)}getTarget(){return this._currentTarget}_decideIfNeedsToMove(){return Math.abs(this.cameraDirection.x)>0||Math.abs(this.cameraDirection.y)>0||Math.abs(this.cameraDirection.z)>0}_updatePosition(){if(this.parent)return this.parent.getWorldMatrix().invertToRef(o.jp.Matrix[0]),o.P.TransformNormalToRef(this.cameraDirection,o.jp.Matrix[0],o.jp.Vector3[0]),void this.position.addInPlace(o.jp.Vector3[0]);this.position.addInPlace(this.cameraDirection)}_checkInputs(){const e=this.invertRotation?-this.inverseRotationSpeed:1,t=this._decideIfNeedsToMove(),i=Math.abs(this.cameraRotation.x)>0||Math.abs(this.cameraRotation.y)>0;if(t&&this._updatePosition(),i){if(this.rotationQuaternion&&this.rotationQuaternion.toEulerAnglesToRef(this.rotation),this.rotation.x+=this.cameraRotation.x*e,this.rotation.y+=this.cameraRotation.y*e,!this.noRotationConstraint){const e=1.570796;this.rotation.x>e&&(this.rotation.x=e),this.rotation.x<-e&&(this.rotation.x=-e)}this.rotationQuaternion&&this.rotation.lengthSquared()&&o._f.RotationYawPitchRollToRef(this.rotation.y,this.rotation.x,this.rotation.z,this.rotationQuaternion)}t&&(Math.abs(this.cameraDirection.x)<this.speed*a.kn&&(this.cameraDirection.x=0),Math.abs(this.cameraDirection.y)<this.speed*a.kn&&(this.cameraDirection.y=0),Math.abs(this.cameraDirection.z)<this.speed*a.kn&&(this.cameraDirection.z=0),this.cameraDirection.scaleInPlace(this.inertia)),i&&(Math.abs(this.cameraRotation.x)<this.speed*a.kn&&(this.cameraRotation.x=0),Math.abs(this.cameraRotation.y)<this.speed*a.kn&&(this.cameraRotation.y=0),this.cameraRotation.scaleInPlace(this.inertia)),super._checkInputs()}_updateCameraRotationMatrix(){this.rotationQuaternion?this.rotationQuaternion.toRotationMatrix(this._cameraRotationMatrix):o.y3.RotationYawPitchRollToRef(this.rotation.y,this.rotation.x,this.rotation.z,this._cameraRotationMatrix)}_rotateUpVectorWithCameraRotationMatrix(){return o.P.TransformNormalToRef(this._defaultUp,this._cameraRotationMatrix,this.upVector),this}_getViewMatrix(){return this.lockedTarget&&this.setTarget(this._getLockedTargetPosition()),this._updateCameraRotationMatrix(),this.rotationQuaternion&&this._cachedQuaternionRotationZ!=this.rotationQuaternion.z?(this._rotateUpVectorWithCameraRotationMatrix(),this._cachedQuaternionRotationZ=this.rotationQuaternion.z):this._cachedRotationZ!==this.rotation.z&&(this._rotateUpVectorWithCameraRotationMatrix(),this._cachedRotationZ=this.rotation.z),o.P.TransformCoordinatesToRef(this._referencePoint,this._cameraRotationMatrix,this._transformedReferencePoint),this.position.addToRef(this._transformedReferencePoint,this._currentTarget),this.updateUpVectorFromRotation&&(this.rotationQuaternion?l.RD.Y.rotateByQuaternionToRef(this.rotationQuaternion,this.upVector):(o._f.FromEulerVectorToRef(this.rotation,this._tmpQuaternion),l.RD.Y.rotateByQuaternionToRef(this._tmpQuaternion,this.upVector))),this._computeViewMatrix(this.position,this._currentTarget,this.upVector),this._viewMatrix}_computeViewMatrix(e,t,i){if(this.ignoreParentScaling){if(this.parent){const n=this.parent.getWorldMatrix();o.P.TransformCoordinatesToRef(e,n,this._globalPosition),o.P.TransformCoordinatesToRef(t,n,this._tmpTargetVector),o.P.TransformNormalToRef(i,n,this._tmpUpVector),this._markSyncedWithParent()}else this._globalPosition.copyFrom(e),this._tmpTargetVector.copyFrom(t),this._tmpUpVector.copyFrom(i);this.getScene().useRightHandedSystem?o.y3.LookAtRHToRef(this._globalPosition,this._tmpTargetVector,this._tmpUpVector,this._viewMatrix):o.y3.LookAtLHToRef(this._globalPosition,this._tmpTargetVector,this._tmpUpVector,this._viewMatrix)}else if(this.getScene().useRightHandedSystem?o.y3.LookAtRHToRef(e,t,i,this._viewMatrix):o.y3.LookAtLHToRef(e,t,i,this._viewMatrix),this.parent){const e=this.parent.getWorldMatrix();this._viewMatrix.invert(),this._viewMatrix.multiplyToRef(e,this._viewMatrix),this._viewMatrix.getTranslationToRef(this._globalPosition),this._viewMatrix.invert(),this._markSyncedWithParent()}else this._globalPosition.copyFrom(e)}createRigCamera(e,t){if(this.cameraRigMode!==r.V.RIG_MODE_NONE){const t=new h(e,this.position.clone(),this.getScene());return t.isRigCamera=!0,t.rigParent=this,this.cameraRigMode!==r.V.RIG_MODE_VR&&this.cameraRigMode!==r.V.RIG_MODE_WEBVR||(this.rotationQuaternion||(this.rotationQuaternion=new o._f),t._cameraRigParams={},t.rotationQuaternion=new o._f),t.mode=this.mode,t.orthoLeft=this.orthoLeft,t.orthoRight=this.orthoRight,t.orthoTop=this.orthoTop,t.orthoBottom=this.orthoBottom,t}return null}_updateRigCameras(){const e=this._rigCameras[0],t=this._rigCameras[1];switch(this.computeWorldMatrix(),this.cameraRigMode){case r.V.RIG_MODE_STEREOSCOPIC_ANAGLYPH:case r.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL:case r.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_CROSSEYED:case r.V.RIG_MODE_STEREOSCOPIC_OVERUNDER:case r.V.RIG_MODE_STEREOSCOPIC_INTERLACED:{const i=this.cameraRigMode===r.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_CROSSEYED?1:-1,n=this.cameraRigMode===r.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_CROSSEYED?-1:1;this._getRigCamPositionAndTarget(this._cameraRigParams.stereoHalfAngle*i,e),this._getRigCamPositionAndTarget(this._cameraRigParams.stereoHalfAngle*n,t);break}case r.V.RIG_MODE_VR:e.rotationQuaternion?(e.rotationQuaternion.copyFrom(this.rotationQuaternion),t.rotationQuaternion.copyFrom(this.rotationQuaternion)):(e.rotation.copyFrom(this.rotation),t.rotation.copyFrom(this.rotation)),e.position.copyFrom(this.position),t.position.copyFrom(this.position)}super._updateRigCameras()}_getRigCamPositionAndTarget(e,t){this.getTarget().subtractToRef(this.position,h._TargetFocalPoint),h._TargetFocalPoint.normalize().scaleInPlace(this._initialFocalDistance);const i=h._TargetFocalPoint.addInPlace(this.position);o.y3.TranslationToRef(-i.x,-i.y,-i.z,h._TargetTransformMatrix),h._TargetTransformMatrix.multiplyToRef(o.y3.RotationAxis(t.upVector,e),h._RigCamTransformMatrix),o.y3.TranslationToRef(i.x,i.y,i.z,h._TargetTransformMatrix),h._RigCamTransformMatrix.multiplyToRef(h._TargetTransformMatrix,h._RigCamTransformMatrix),o.P.TransformCoordinatesToRef(this.position,h._RigCamTransformMatrix,t.position),t.setTarget(i)}getClassName(){return"TargetCamera"}}h._RigCamTransformMatrix=new o.y3,h._TargetTransformMatrix=new o.y3,h._TargetFocalPoint=new o.P,(0,n.gn)([(0,s.hd)()],h.prototype,"rotation",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"speed",void 0),(0,n.gn)([(0,s.RR)("lockedTargetId")],h.prototype,"lockedTarget",void 0)},2312:(e,t,i)=>{i.d(t,{c:()=>n});class n{constructor(e,t,i){this.bu=e,this.bv=t,this.distance=i,this.faceId=0,this.subMeshId=0}}},9356:(e,t,i)=>{i.d(t,{a:()=>s});var n=i(4141);class s{constructor(){this._checkCollisions=!1,this._collisionMask=-1,this._collisionGroup=-1,this._surroundingMeshes=null,this._collider=null,this._oldPositionForCollisions=new n.P(0,0,0),this._diffPositionForCollisions=new n.P(0,0,0),this._collisionResponse=!0}}},5670:(e,t,i)=>{i.d(t,{p:()=>r});var n=i(4141),s=i(708);class r{constructor(){this.hit=!1,this.distance=0,this.pickedPoint=null,this.pickedMesh=null,this.bu=0,this.bv=0,this.faceId=-1,this.subMeshFaceId=-1,this.subMeshId=0,this.pickedSprite=null,this.thinInstanceIndex=-1,this.ray=null,this.originMesh=null,this.aimTransform=null,this.gripTransform=null}getNormal(e=!1,t=!0){if(!this.pickedMesh||t&&!this.pickedMesh.isVerticesDataPresent(s.o.NormalKind))return null;let i,r=this.pickedMesh.getIndices();0===(null==r?void 0:r.length)&&(r=null);const o=n.jp.Vector3[0],a=n.jp.Vector3[1],l=n.jp.Vector3[2];if(t){const e=this.pickedMesh.getVerticesData(s.o.NormalKind);let t=r?n.P.FromArrayToRef(e,3*r[3*this.faceId],o):o.copyFromFloats(e[3*this.faceId*3],e[3*this.faceId*3+1],e[3*this.faceId*3+2]),h=r?n.P.FromArrayToRef(e,3*r[3*this.faceId+1],a):a.copyFromFloats(e[3*(3*this.faceId+1)],e[3*(3*this.faceId+1)+1],e[3*(3*this.faceId+1)+2]),c=r?n.P.FromArrayToRef(e,3*r[3*this.faceId+2],l):l.copyFromFloats(e[3*(3*this.faceId+2)],e[3*(3*this.faceId+2)+1],e[3*(3*this.faceId+2)+2]);t=t.scale(this.bu),h=h.scale(this.bv),c=c.scale(1-this.bu-this.bv),i=new n.P(t.x+h.x+c.x,t.y+h.y+c.y,t.z+h.z+c.z)}else{const e=this.pickedMesh.getVerticesData(s.o.PositionKind),t=r?n.P.FromArrayToRef(e,3*r[3*this.faceId],o):o.copyFromFloats(e[3*this.faceId*3],e[3*this.faceId*3+1],e[3*this.faceId*3+2]),h=r?n.P.FromArrayToRef(e,3*r[3*this.faceId+1],a):a.copyFromFloats(e[3*(3*this.faceId+1)],e[3*(3*this.faceId+1)+1],e[3*(3*this.faceId+1)+2]),c=r?n.P.FromArrayToRef(e,3*r[3*this.faceId+2],l):l.copyFromFloats(e[3*(3*this.faceId+2)],e[3*(3*this.faceId+2)+1],e[3*(3*this.faceId+2)+2]),u=t.subtract(h),d=c.subtract(h);i=n.P.Cross(u,d)}const h=(e,t)=>{let i=e.getWorldMatrix();e.nonUniformScaling&&(n.jp.Matrix[0].copyFrom(i),i=n.jp.Matrix[0],i.setTranslationFromFloats(0,0,0),i.invert(),i.transposeToRef(n.jp.Matrix[1]),i=n.jp.Matrix[1]),n.P.TransformNormalToRef(t,i,t)};if(e&&h(this.pickedMesh,i),this.ray){const t=n.jp.Vector3[0].copyFrom(i);e||h(this.pickedMesh,t),n.P.Dot(t,this.ray.direction)>0&&i.negateInPlace()}return i.normalize(),i}getTextureCoordinates(e=s.o.UVKind){if(!this.pickedMesh||!this.pickedMesh.isVerticesDataPresent(e))return null;const t=this.pickedMesh.getIndices();if(!t)return null;const i=this.pickedMesh.getVerticesData(e);if(!i)return null;let r=n.FM.FromArray(i,2*t[3*this.faceId]),o=n.FM.FromArray(i,2*t[3*this.faceId+1]),a=n.FM.FromArray(i,2*t[3*this.faceId+2]);return r=r.scale(this.bu),o=o.scale(this.bv),a=a.scale(1-this.bu-this.bv),new n.FM(r.x+o.x+a.x,r.y+o.y+a.y)}}},4892:(e,t,i)=>{i.d(t,{e:()=>n});class n{}n.UseOpenGLOrientationForUV=!1},5237:(e,t,i)=>{i.d(t,{k:()=>o});var n=i(5860),s=i(4141),r=i(1341);class o{constructor(e,t,i){this.vectors=n.B.BuildArray(8,s.P.Zero),this.center=s.P.Zero(),this.centerWorld=s.P.Zero(),this.extendSize=s.P.Zero(),this.extendSizeWorld=s.P.Zero(),this.directions=n.B.BuildArray(3,s.P.Zero),this.vectorsWorld=n.B.BuildArray(8,s.P.Zero),this.minimumWorld=s.P.Zero(),this.maximumWorld=s.P.Zero(),this.minimum=s.P.Zero(),this.maximum=s.P.Zero(),this._drawWrapperFront=null,this._drawWrapperBack=null,this.reConstruct(e,t,i)}reConstruct(e,t,i){const n=e.x,r=e.y,o=e.z,a=t.x,l=t.y,h=t.z,c=this.vectors;this.minimum.copyFromFloats(n,r,o),this.maximum.copyFromFloats(a,l,h),c[0].copyFromFloats(n,r,o),c[1].copyFromFloats(a,l,h),c[2].copyFromFloats(a,r,o),c[3].copyFromFloats(n,l,o),c[4].copyFromFloats(n,r,h),c[5].copyFromFloats(a,l,o),c[6].copyFromFloats(n,l,h),c[7].copyFromFloats(a,r,h),t.addToRef(e,this.center).scaleInPlace(.5),t.subtractToRef(e,this.extendSize).scaleInPlace(.5),this._worldMatrix=i||s.y3.IdentityReadOnly,this._update(this._worldMatrix)}scale(e){const t=o._TmpVector3,i=this.maximum.subtractToRef(this.minimum,t[0]),n=i.length();i.normalizeFromLength(n);const s=n*e,r=i.scaleInPlace(.5*s),a=this.center.subtractToRef(r,t[1]),l=this.center.addToRef(r,t[2]);return this.reConstruct(a,l,this._worldMatrix),this}getWorldMatrix(){return this._worldMatrix}_update(e){const t=this.minimumWorld,i=this.maximumWorld,n=this.directions,r=this.vectorsWorld,o=this.vectors;if(e.isIdentity()){t.copyFrom(this.minimum),i.copyFrom(this.maximum);for(let e=0;e<8;++e)r[e].copyFrom(o[e]);this.extendSizeWorld.copyFrom(this.extendSize),this.centerWorld.copyFrom(this.center)}else{t.setAll(Number.MAX_VALUE),i.setAll(-Number.MAX_VALUE);for(let n=0;n<8;++n){const a=r[n];s.P.TransformCoordinatesToRef(o[n],e,a),t.minimizeInPlace(a),i.maximizeInPlace(a)}i.subtractToRef(t,this.extendSizeWorld).scaleInPlace(.5),i.addToRef(t,this.centerWorld).scaleInPlace(.5)}s.P.FromArrayToRef(e.m,0,n[0]),s.P.FromArrayToRef(e.m,4,n[1]),s.P.FromArrayToRef(e.m,8,n[2]),this._worldMatrix=e}isInFrustum(e){return o.IsInFrustum(this.vectorsWorld,e)}isCompletelyInFrustum(e){return o.IsCompletelyInFrustum(this.vectorsWorld,e)}intersectsPoint(e){const t=this.minimumWorld,i=this.maximumWorld,n=t.x,s=t.y,o=t.z,a=i.x,l=i.y,h=i.z,c=e.x,u=e.y,d=e.z,p=-r.kn;return!(a-c<p||p>c-n||l-u<p||p>u-s||h-d<p||p>d-o)}intersectsSphere(e){return o.IntersectsSphere(this.minimumWorld,this.maximumWorld,e.centerWorld,e.radiusWorld)}intersectsMinMax(e,t){const i=this.minimumWorld,n=this.maximumWorld,s=i.x,r=i.y,o=i.z,a=n.x,l=n.y,h=n.z,c=e.x,u=e.y,d=e.z,p=t.x,f=t.y,_=t.z;return!(a<c||s>p||l<u||r>f||h<d||o>_)}dispose(){var e,t;null===(e=this._drawWrapperFront)||void 0===e||e.dispose(),null===(t=this._drawWrapperBack)||void 0===t||t.dispose()}static Intersects(e,t){return e.intersectsMinMax(t.minimumWorld,t.maximumWorld)}static IntersectsSphere(e,t,i,n){const r=o._TmpVector3[0];return s.P.ClampToRef(i,e,t,r),s.P.DistanceSquared(i,r)<=n*n}static IsCompletelyInFrustum(e,t){for(let i=0;i<6;++i){const n=t[i];for(let t=0;t<8;++t)if(n.dotCoordinate(e[t])<0)return!1}return!0}static IsInFrustum(e,t){for(let i=0;i<6;++i){let n=!0;const s=t[i];for(let t=0;t<8;++t)if(s.dotCoordinate(e[t])>=0){n=!1;break}if(n)return!1}return!0}}o._TmpVector3=n.B.BuildArray(3,s.P.Zero)},3722:(e,t,i)=>{i.d(t,{j:()=>u});var n=i(5860),s=i(4141),r=i(5237),o=i(6667);const a={min:0,max:0},l={min:0,max:0},h=(e,t,i)=>{const n=s.P.Dot(t.centerWorld,e),r=Math.abs(s.P.Dot(t.directions[0],e))*t.extendSize.x+Math.abs(s.P.Dot(t.directions[1],e))*t.extendSize.y+Math.abs(s.P.Dot(t.directions[2],e))*t.extendSize.z;i.min=n-r,i.max=n+r},c=(e,t,i)=>(h(e,t,a),h(e,i,l),!(a.min>l.max||l.min>a.max));class u{constructor(e,t,i){this._isLocked=!1,this.boundingBox=new r.k(e,t,i),this.boundingSphere=new o.K(e,t,i)}reConstruct(e,t,i){this.boundingBox.reConstruct(e,t,i),this.boundingSphere.reConstruct(e,t,i)}get minimum(){return this.boundingBox.minimum}get maximum(){return this.boundingBox.maximum}get isLocked(){return this._isLocked}set isLocked(e){this._isLocked=e}update(e){this._isLocked||(this.boundingBox._update(e),this.boundingSphere._update(e))}centerOn(e,t){const i=u._TmpVector3[0].copyFrom(e).subtractInPlace(t),n=u._TmpVector3[1].copyFrom(e).addInPlace(t);return this.boundingBox.reConstruct(i,n,this.boundingBox.getWorldMatrix()),this.boundingSphere.reConstruct(i,n,this.boundingBox.getWorldMatrix()),this}encapsulate(e){const t=s.P.Minimize(this.minimum,e),i=s.P.Maximize(this.maximum,e);return this.reConstruct(t,i,this.boundingBox.getWorldMatrix()),this}encapsulateBoundingInfo(e){const t=s.jp.Matrix[0];this.boundingBox.getWorldMatrix().invertToRef(t);const i=s.jp.Vector3[0];return s.P.TransformCoordinatesToRef(e.boundingBox.minimumWorld,t,i),this.encapsulate(i),s.P.TransformCoordinatesToRef(e.boundingBox.maximumWorld,t,i),this.encapsulate(i),this}scale(e){return this.boundingBox.scale(e),this.boundingSphere.scale(e),this}isInFrustum(e,t=0){return!(2!==t&&3!==t||!this.boundingSphere.isCenterInFrustum(e))||!!this.boundingSphere.isInFrustum(e)&&(!(1!==t&&3!==t)||this.boundingBox.isInFrustum(e))}get diagonalLength(){const e=this.boundingBox;return e.maximumWorld.subtractToRef(e.minimumWorld,u._TmpVector3[0]).length()}isCompletelyInFrustum(e){return this.boundingBox.isCompletelyInFrustum(e)}_checkCollision(e){return e._canDoCollision(this.boundingSphere.centerWorld,this.boundingSphere.radiusWorld,this.boundingBox.minimumWorld,this.boundingBox.maximumWorld)}intersectsPoint(e){return!!this.boundingSphere.centerWorld&&!!this.boundingSphere.intersectsPoint(e)&&!!this.boundingBox.intersectsPoint(e)}intersects(e,t){if(!o.K.Intersects(this.boundingSphere,e.boundingSphere))return!1;if(!r.k.Intersects(this.boundingBox,e.boundingBox))return!1;if(!t)return!0;const i=this.boundingBox,n=e.boundingBox;return!!(c(i.directions[0],i,n)&&c(i.directions[1],i,n)&&c(i.directions[2],i,n)&&c(n.directions[0],i,n)&&c(n.directions[1],i,n)&&c(n.directions[2],i,n)&&c(s.P.Cross(i.directions[0],n.directions[0]),i,n)&&c(s.P.Cross(i.directions[0],n.directions[1]),i,n)&&c(s.P.Cross(i.directions[0],n.directions[2]),i,n)&&c(s.P.Cross(i.directions[1],n.directions[0]),i,n)&&c(s.P.Cross(i.directions[1],n.directions[1]),i,n)&&c(s.P.Cross(i.directions[1],n.directions[2]),i,n)&&c(s.P.Cross(i.directions[2],n.directions[0]),i,n)&&c(s.P.Cross(i.directions[2],n.directions[1]),i,n)&&c(s.P.Cross(i.directions[2],n.directions[2]),i,n))}}u._TmpVector3=n.B.BuildArray(2,s.P.Zero)},6667:(e,t,i)=>{i.d(t,{K:()=>r});var n=i(5860),s=i(4141);class r{constructor(e,t,i){this.center=s.P.Zero(),this.centerWorld=s.P.Zero(),this.minimum=s.P.Zero(),this.maximum=s.P.Zero(),this.reConstruct(e,t,i)}reConstruct(e,t,i){this.minimum.copyFrom(e),this.maximum.copyFrom(t);const n=s.P.Distance(e,t);t.addToRef(e,this.center).scaleInPlace(.5),this.radius=.5*n,this._update(i||s.y3.IdentityReadOnly)}scale(e){const t=this.radius*e,i=r._TmpVector3,n=i[0].setAll(t),s=this.center.subtractToRef(n,i[1]),o=this.center.addToRef(n,i[2]);return this.reConstruct(s,o,this._worldMatrix),this}getWorldMatrix(){return this._worldMatrix}_update(e){if(e.isIdentity())this.centerWorld.copyFrom(this.center),this.radiusWorld=this.radius;else{s.P.TransformCoordinatesToRef(this.center,e,this.centerWorld);const t=r._TmpVector3[0];s.P.TransformNormalFromFloatsToRef(1,1,1,e,t),this.radiusWorld=Math.max(Math.abs(t.x),Math.abs(t.y),Math.abs(t.z))*this.radius}}isInFrustum(e){const t=this.centerWorld,i=this.radiusWorld;for(let n=0;n<6;n++)if(e[n].dotCoordinate(t)<=-i)return!1;return!0}isCenterInFrustum(e){const t=this.centerWorld;for(let i=0;i<6;i++)if(e[i].dotCoordinate(t)<0)return!1;return!0}intersectsPoint(e){const t=s.P.DistanceSquared(this.centerWorld,e);return!(this.radiusWorld*this.radiusWorld<t)}static Intersects(e,t){const i=s.P.DistanceSquared(e.centerWorld,t.centerWorld),n=e.radiusWorld+t.radiusWorld;return!(n*n<i)}static CreateFromCenterAndRadius(e,t,i){this._TmpVector3[0].copyFrom(e),this._TmpVector3[1].copyFromFloats(0,0,t),this._TmpVector3[2].copyFrom(e),this._TmpVector3[0].addInPlace(this._TmpVector3[1]),this._TmpVector3[2].subtractInPlace(this._TmpVector3[1]);const n=new r(this._TmpVector3[0],this._TmpVector3[2]);return n._worldMatrix=i||s.y3.Identity(),n}}r._TmpVector3=n.B.BuildArray(3,s.P.Zero)},450:(e,t,i)=>{i.d(t,{z:()=>c});var n=i(5860),s=i(4141),r=i(5670),o=i(2312),a=i(1057),l=i(2704),h=i(1431);class c{constructor(e,t,i=Number.MAX_VALUE){this.origin=e,this.direction=t,this.length=i}clone(){return new c(this.origin.clone(),this.direction.clone(),this.length)}intersectsBoxMinMax(e,t,i=0){const n=c._TmpVector3[0].copyFromFloats(e.x-i,e.y-i,e.z-i),s=c._TmpVector3[1].copyFromFloats(t.x+i,t.y+i,t.z+i);let r,o,a,l,h=0,u=Number.MAX_VALUE;if(Math.abs(this.direction.x)<1e-7){if(this.origin.x<n.x||this.origin.x>s.x)return!1}else if(r=1/this.direction.x,o=(n.x-this.origin.x)*r,a=(s.x-this.origin.x)*r,a===-1/0&&(a=1/0),o>a&&(l=o,o=a,a=l),h=Math.max(o,h),u=Math.min(a,u),h>u)return!1;if(Math.abs(this.direction.y)<1e-7){if(this.origin.y<n.y||this.origin.y>s.y)return!1}else if(r=1/this.direction.y,o=(n.y-this.origin.y)*r,a=(s.y-this.origin.y)*r,a===-1/0&&(a=1/0),o>a&&(l=o,o=a,a=l),h=Math.max(o,h),u=Math.min(a,u),h>u)return!1;if(Math.abs(this.direction.z)<1e-7){if(this.origin.z<n.z||this.origin.z>s.z)return!1}else if(r=1/this.direction.z,o=(n.z-this.origin.z)*r,a=(s.z-this.origin.z)*r,a===-1/0&&(a=1/0),o>a&&(l=o,o=a,a=l),h=Math.max(o,h),u=Math.min(a,u),h>u)return!1;return!0}intersectsBox(e,t=0){return this.intersectsBoxMinMax(e.minimum,e.maximum,t)}intersectsSphere(e,t=0){const i=e.center.x-this.origin.x,n=e.center.y-this.origin.y,s=e.center.z-this.origin.z,r=i*i+n*n+s*s,o=e.radius+t,a=o*o;if(r<=a)return!0;const l=i*this.direction.x+n*this.direction.y+s*this.direction.z;return!(l<0)&&r-l*l<=a}intersectsTriangle(e,t,i){const n=c._TmpVector3[0],r=c._TmpVector3[1],a=c._TmpVector3[2],l=c._TmpVector3[3],h=c._TmpVector3[4];t.subtractToRef(e,n),i.subtractToRef(e,r),s.P.CrossToRef(this.direction,r,a);const u=s.P.Dot(n,a);if(0===u)return null;const d=1/u;this.origin.subtractToRef(e,l);const p=s.P.Dot(l,a)*d;if(p<0||p>1)return null;s.P.CrossToRef(l,n,h);const f=s.P.Dot(this.direction,h)*d;if(f<0||p+f>1)return null;const _=s.P.Dot(r,h)*d;return _>this.length?null:new o.c(1-p-f,p,_)}intersectsPlane(e){let t;const i=s.P.Dot(e.normal,this.direction);if(Math.abs(i)<9.99999997475243e-7)return null;{const n=s.P.Dot(e.normal,this.origin);return t=(-e.d-n)/i,t<0?t<-9.99999997475243e-7?null:0:t}}intersectsAxis(e,t=0){switch(e){case"y":{const e=(this.origin.y-t)/this.direction.y;return e>0?null:new s.P(this.origin.x+this.direction.x*-e,t,this.origin.z+this.direction.z*-e)}case"x":{const e=(this.origin.x-t)/this.direction.x;return e>0?null:new s.P(t,this.origin.y+this.direction.y*-e,this.origin.z+this.direction.z*-e)}case"z":{const e=(this.origin.z-t)/this.direction.z;return e>0?null:new s.P(this.origin.x+this.direction.x*-e,this.origin.y+this.direction.y*-e,t)}default:return null}}intersectsMesh(e,t){const i=s.jp.Matrix[0];return e.getWorldMatrix().invertToRef(i),this._tmpRay?c.TransformToRef(this,i,this._tmpRay):this._tmpRay=c.Transform(this,i),e.intersects(this._tmpRay,t)}intersectsMeshes(e,t,i){i?i.length=0:i=[];for(let n=0;n<e.length;n++){const s=this.intersectsMesh(e[n],t);s.hit&&i.push(s)}return i.sort(this._comparePickingInfo),i}_comparePickingInfo(e,t){return e.distance<t.distance?-1:e.distance>t.distance?1:0}intersectionSegment(e,t,i){const n=this.origin,r=s.jp.Vector3[0],o=s.jp.Vector3[1],a=s.jp.Vector3[2],l=s.jp.Vector3[3];t.subtractToRef(e,r),this.direction.scaleToRef(c._Rayl,a),n.addToRef(a,o),e.subtractToRef(n,l);const h=s.P.Dot(r,r),u=s.P.Dot(r,a),d=s.P.Dot(a,a),p=s.P.Dot(r,l),f=s.P.Dot(a,l),_=h*d-u*u;let m,g,v=_,y=_;_<c._Smallnum?(m=0,v=1,g=f,y=d):(m=u*f-d*p,g=h*f-u*p,m<0?(m=0,g=f,y=d):m>v&&(m=v,g=f+u,y=d)),g<0?(g=0,-p<0?m=0:-p>h?m=v:(m=-p,v=h)):g>y&&(g=y,-p+u<0?m=0:-p+u>h?m=v:(m=-p+u,v=h));const x=Math.abs(m)<c._Smallnum?0:m/v,b=Math.abs(g)<c._Smallnum?0:g/y,T=s.jp.Vector3[4];a.scaleToRef(b,T);const S=s.jp.Vector3[5];r.scaleToRef(x,S),S.addInPlace(l);const E=s.jp.Vector3[6];return S.subtractToRef(T,E),b>0&&b<=this.length&&E.lengthSquared()<i*i?S.length():-1}update(e,t,i,n,r,o,a,l=!1){if(l){c._RayDistant||(c._RayDistant=c.Zero()),c._RayDistant.unprojectRayToRef(e,t,i,n,s.y3.IdentityReadOnly,o,a);const l=s.jp.Matrix[0];r.invertToRef(l),c.TransformToRef(c._RayDistant,l,this)}else this.unprojectRayToRef(e,t,i,n,r,o,a);return this}static Zero(){return new c(s.P.Zero(),s.P.Zero())}static CreateNew(e,t,i,n,s,r,o){return c.Zero().update(e,t,i,n,s,r,o)}static CreateNewFromTo(e,t,i=s.y3.IdentityReadOnly){const n=t.subtract(e),r=Math.sqrt(n.x*n.x+n.y*n.y+n.z*n.z);return n.normalize(),c.Transform(new c(e,n,r),i)}static Transform(e,t){const i=new c(new s.P(0,0,0),new s.P(0,0,0));return c.TransformToRef(e,t,i),i}static TransformToRef(e,t,i){s.P.TransformCoordinatesToRef(e.origin,t,i.origin),s.P.TransformNormalToRef(e.direction,t,i.direction),i.length=e.length;const n=i.direction,r=n.length();if(0!==r&&1!==r){const e=1/r;n.x*=e,n.y*=e,n.z*=e,i.length*=r}}unprojectRayToRef(e,t,i,n,r,o,a){var l;const c=s.jp.Matrix[0];r.multiplyToRef(o,c),c.multiplyToRef(a,c),c.invert();const u=s.jp.Vector3[0];u.x=e/i*2-1,u.y=-(t/n*2-1),u.z=(null===(l=h.l.LastCreatedEngine)||void 0===l?void 0:l.isNDCHalfZRange)?0:-1;const d=s.jp.Vector3[1].copyFromFloats(u.x,u.y,1-1e-8),p=s.jp.Vector3[2],f=s.jp.Vector3[3];s.P._UnprojectFromInvertedMatrixToRef(u,c,p),s.P._UnprojectFromInvertedMatrixToRef(d,c,f),this.origin.copyFrom(p),f.subtractToRef(p,this.direction),this.direction.normalize()}}c._TmpVector3=n.B.BuildArray(6,s.P.Zero),c._RayDistant=c.Zero(),c._Smallnum=1e-8,c._Rayl=1e9,a.x.prototype.createPickingRay=function(e,t,i,n,s=!1){const r=c.Zero();return this.createPickingRayToRef(e,t,i,r,n,s),r},a.x.prototype.createPickingRayToRef=function(e,t,i,n,r,o=!1,a=!1){const l=this.getEngine();if(!r){if(!this.activeCamera)return this;r=this.activeCamera}const h=r.viewport.toGlobal(l.getRenderWidth(),l.getRenderHeight());return e=e/l.getHardwareScalingLevel()-h.x,t=t/l.getHardwareScalingLevel()-(l.getRenderHeight()-h.y-h.height),n.update(e,t,h.width,h.height,i||s.y3.IdentityReadOnly,o?s.y3.IdentityReadOnly:r.getViewMatrix(),r.getProjectionMatrix(),a),this},a.x.prototype.createPickingRayInCameraSpace=function(e,t,i){const n=c.Zero();return this.createPickingRayInCameraSpaceToRef(e,t,n,i),n},a.x.prototype.createPickingRayInCameraSpaceToRef=function(e,t,i,n){if(!r.p)return this;const o=this.getEngine();if(!n){if(!this.activeCamera)throw new Error("Active camera not set");n=this.activeCamera}const a=n.viewport.toGlobal(o.getRenderWidth(),o.getRenderHeight()),l=s.y3.Identity();return e=e/o.getHardwareScalingLevel()-a.x,t=t/o.getHardwareScalingLevel()-(o.getRenderHeight()-a.y-a.height),i.update(e,t,a.width,a.height,l,l,n.getProjectionMatrix()),this},a.x.prototype._internalPickForMesh=function(e,t,i,n,s,r,o,a){const l=t(n,i.enableDistantPicking),h=i.intersects(l,s,o,r,n,a);return h&&h.hit?!s&&null!=e&&h.distance>=e.distance?null:h:null},a.x.prototype._internalPick=function(e,t,i,n,o){let a=null;const l=!!(this.activeCameras&&this.activeCameras.length>1&&this.cameraToUseForPointers!==this.activeCamera),h=this.cameraToUseForPointers||this.activeCamera;for(let r=0;r<this.meshes.length;r++){const c=this.meshes[r];if(t){if(!t(c))continue}else if(!c.isEnabled()||!c.isVisible||!c.isPickable)continue;const u=l&&c.isWorldMatrixCameraDependent(),d=c.computeWorldMatrix(u,h);if(c.hasThinInstances&&c.thinInstanceEnablePicking){const t=this._internalPickForMesh(a,e,c,d,!0,!0,o);if(t){if(n)return t;const r=s.jp.Matrix[1],l=c.thinInstanceGetWorldMatrices();for(let t=0;t<l.length;t++){l[t].multiplyToRef(d,r);const s=this._internalPickForMesh(a,e,c,r,i,n,o,!0);if(s&&(a=s,a.thinInstanceIndex=t,i))return a}}}else{const t=this._internalPickForMesh(a,e,c,d,i,n,o);if(t&&(a=t,i))return a}}return a||new r.p},a.x.prototype._internalMultiPick=function(e,t,i){if(!r.p)return null;const n=new Array,o=!!(this.activeCameras&&this.activeCameras.length>1&&this.cameraToUseForPointers!==this.activeCamera),a=this.cameraToUseForPointers||this.activeCamera;for(let r=0;r<this.meshes.length;r++){const l=this.meshes[r];if(t){if(!t(l))continue}else if(!l.isEnabled()||!l.isVisible||!l.isPickable)continue;const h=o&&l.isWorldMatrixCameraDependent(),c=l.computeWorldMatrix(h,a);if(l.hasThinInstances&&l.thinInstanceEnablePicking){if(this._internalPickForMesh(null,e,l,c,!0,!0,i)){const t=s.jp.Matrix[1],r=l.thinInstanceGetWorldMatrices();for(let s=0;s<r.length;s++){r[s].multiplyToRef(c,t);const o=this._internalPickForMesh(null,e,l,t,!1,!1,i,!0);o&&(o.thinInstanceIndex=s,n.push(o))}}}else{const t=this._internalPickForMesh(null,e,l,c,!1,!1,i);t&&n.push(t)}}return n},a.x.prototype.pickWithBoundingInfo=function(e,t,i,n,o){if(!r.p)return null;const a=this._internalPick((i=>(this._tempPickingRay||(this._tempPickingRay=c.Zero()),this.createPickingRayToRef(e,t,i,this._tempPickingRay,o||null),this._tempPickingRay)),i,n,!0);return a&&(a.ray=this.createPickingRay(e,t,s.y3.Identity(),o||null)),a},Object.defineProperty(a.x.prototype,"_pickingAvailable",{get:()=>!0,enumerable:!1,configurable:!1}),a.x.prototype.pick=function(e,t,i,n,r,o,a=!1){const l=this._internalPick(((i,n)=>(this._tempPickingRay||(this._tempPickingRay=c.Zero()),this.createPickingRayToRef(e,t,i,this._tempPickingRay,r||null,!1,n),this._tempPickingRay)),i,n,!1,o);return l&&(l.ray=this.createPickingRay(e,t,s.y3.Identity(),r||null)),l},a.x.prototype.pickWithRay=function(e,t,i,n){const r=this._internalPick((t=>(this._pickWithRayInverseMatrix||(this._pickWithRayInverseMatrix=s.y3.Identity()),t.invertToRef(this._pickWithRayInverseMatrix),this._cachedRayForTransform||(this._cachedRayForTransform=c.Zero()),c.TransformToRef(e,this._pickWithRayInverseMatrix,this._cachedRayForTransform),this._cachedRayForTransform)),t,i,!1,n);return r&&(r.ray=e),r},a.x.prototype.multiPick=function(e,t,i,n,s){return this._internalMultiPick((i=>this.createPickingRay(e,t,i,n||null)),i,s)},a.x.prototype.multiPickWithRay=function(e,t,i){return this._internalMultiPick((t=>(this._pickWithRayInverseMatrix||(this._pickWithRayInverseMatrix=s.y3.Identity()),t.invertToRef(this._pickWithRayInverseMatrix),this._cachedRayForTransform||(this._cachedRayForTransform=c.Zero()),c.TransformToRef(e,this._pickWithRayInverseMatrix,this._cachedRayForTransform),this._cachedRayForTransform)),t,i)},l.V.prototype.getForwardRay=function(e=100,t,i){return this.getForwardRayToRef(new c(s.P.Zero(),s.P.Zero(),e),e,t,i)},l.V.prototype.getForwardRayToRef=function(e,t=100,i,n){return i||(i=this.getWorldMatrix()),e.length=t,n?e.origin.copyFrom(n):e.origin.copyFrom(this.position),s.jp.Vector3[2].set(0,0,this._scene.useRightHandedSystem?-1:1),s.P.TransformNormalToRef(s.jp.Vector3[2],i,s.jp.Vector3[3]),s.P.NormalizeToRef(s.jp.Vector3[3],e.direction),e}},3255:(e,t,i)=>{var n,s,r,o,a,l,h;i.d(t,{$i:()=>l,D_:()=>h,FP:()=>r,Fz:()=>s,V7:()=>o,Yi:()=>n,s2:()=>a}),function(e){e[e.Generic=0]="Generic",e[e.Keyboard=1]="Keyboard",e[e.Mouse=2]="Mouse",e[e.Touch=3]="Touch",e[e.DualShock=4]="DualShock",e[e.Xbox=5]="Xbox",e[e.Switch=6]="Switch",e[e.DualSense=7]="DualSense"}(n||(n={})),function(e){e[e.Horizontal=0]="Horizontal",e[e.Vertical=1]="Vertical",e[e.LeftClick=2]="LeftClick",e[e.MiddleClick=3]="MiddleClick",e[e.RightClick=4]="RightClick",e[e.BrowserBack=5]="BrowserBack",e[e.BrowserForward=6]="BrowserForward",e[e.MouseWheelX=7]="MouseWheelX",e[e.MouseWheelY=8]="MouseWheelY",e[e.MouseWheelZ=9]="MouseWheelZ",e[e.Move=12]="Move"}(s||(s={})),function(e){e[e.Horizontal=0]="Horizontal",e[e.Vertical=1]="Vertical",e[e.LeftClick=2]="LeftClick",e[e.MiddleClick=3]="MiddleClick",e[e.RightClick=4]="RightClick",e[e.BrowserBack=5]="BrowserBack",e[e.BrowserForward=6]="BrowserForward",e[e.MouseWheelX=7]="MouseWheelX",e[e.MouseWheelY=8]="MouseWheelY",e[e.MouseWheelZ=9]="MouseWheelZ",e[e.DeltaHorizontal=10]="DeltaHorizontal",e[e.DeltaVertical=11]="DeltaVertical"}(r||(r={})),function(e){e[e.Cross=0]="Cross",e[e.Circle=1]="Circle",e[e.Square=2]="Square",e[e.Triangle=3]="Triangle",e[e.L1=4]="L1",e[e.R1=5]="R1",e[e.L2=6]="L2",e[e.R2=7]="R2",e[e.Share=8]="Share",e[e.Options=9]="Options",e[e.L3=10]="L3",e[e.R3=11]="R3",e[e.DPadUp=12]="DPadUp",e[e.DPadDown=13]="DPadDown",e[e.DPadLeft=14]="DPadLeft",e[e.DPadRight=15]="DPadRight",e[e.Home=16]="Home",e[e.TouchPad=17]="TouchPad",e[e.LStickXAxis=18]="LStickXAxis",e[e.LStickYAxis=19]="LStickYAxis",e[e.RStickXAxis=20]="RStickXAxis",e[e.RStickYAxis=21]="RStickYAxis"}(o||(o={})),function(e){e[e.Cross=0]="Cross",e[e.Circle=1]="Circle",e[e.Square=2]="Square",e[e.Triangle=3]="Triangle",e[e.L1=4]="L1",e[e.R1=5]="R1",e[e.L2=6]="L2",e[e.R2=7]="R2",e[e.Create=8]="Create",e[e.Options=9]="Options",e[e.L3=10]="L3",e[e.R3=11]="R3",e[e.DPadUp=12]="DPadUp",e[e.DPadDown=13]="DPadDown",e[e.DPadLeft=14]="DPadLeft",e[e.DPadRight=15]="DPadRight",e[e.Home=16]="Home",e[e.TouchPad=17]="TouchPad",e[e.LStickXAxis=18]="LStickXAxis",e[e.LStickYAxis=19]="LStickYAxis",e[e.RStickXAxis=20]="RStickXAxis",e[e.RStickYAxis=21]="RStickYAxis"}(a||(a={})),function(e){e[e.A=0]="A",e[e.B=1]="B",e[e.X=2]="X",e[e.Y=3]="Y",e[e.LB=4]="LB",e[e.RB=5]="RB",e[e.LT=6]="LT",e[e.RT=7]="RT",e[e.Back=8]="Back",e[e.Start=9]="Start",e[e.LS=10]="LS",e[e.RS=11]="RS",e[e.DPadUp=12]="DPadUp",e[e.DPadDown=13]="DPadDown",e[e.DPadLeft=14]="DPadLeft",e[e.DPadRight=15]="DPadRight",e[e.Home=16]="Home",e[e.LStickXAxis=17]="LStickXAxis",e[e.LStickYAxis=18]="LStickYAxis",e[e.RStickXAxis=19]="RStickXAxis",e[e.RStickYAxis=20]="RStickYAxis"}(l||(l={})),function(e){e[e.B=0]="B",e[e.A=1]="A",e[e.Y=2]="Y",e[e.X=3]="X",e[e.L=4]="L",e[e.R=5]="R",e[e.ZL=6]="ZL",e[e.ZR=7]="ZR",e[e.Minus=8]="Minus",e[e.Plus=9]="Plus",e[e.LS=10]="LS",e[e.RS=11]="RS",e[e.DPadUp=12]="DPadUp",e[e.DPadDown=13]="DPadDown",e[e.DPadLeft=14]="DPadLeft",e[e.DPadRight=15]="DPadRight",e[e.Home=16]="Home",e[e.Capture=17]="Capture",e[e.LStickXAxis=18]="LStickXAxis",e[e.LStickYAxis=19]="LStickYAxis",e[e.RStickXAxis=20]="RStickXAxis",e[e.RStickYAxis=21]="RStickYAxis"}(h||(h={}))},7967:(e,t,i)=>{i.d(t,{p:()=>s});var n=i(5757);class s{constructor(e,t,i=0){this.deviceType=t,this.deviceSlot=i,this.onInputChangedObservable=new n.y$,this._deviceInputSystem=e}getInput(e){return this._deviceInputSystem.pollInput(this.deviceType,this.deviceSlot,e)}}},3739:(e,t,i)=>{i.d(t,{U:()=>f});var n=i(3255),s=i(5757),r=i(2272);class o{static CreateDeviceEvent(e,t,i,s,r,o,a){switch(e){case n.Yi.Keyboard:return this._CreateKeyboardEvent(i,s,r,o);case n.Yi.Mouse:if(i===n.Fz.MouseWheelX||i===n.Fz.MouseWheelY||i===n.Fz.MouseWheelZ)return this._CreateWheelEvent(e,t,i,s,r,o);case n.Yi.Touch:return this._CreatePointerEvent(e,t,i,s,r,o,a);default:throw`Unable to generate event for device ${n.Yi[e]}`}}static _CreatePointerEvent(e,t,i,s,r,o,a){const l=this._CreateMouseEvent(e,t,i,s,r,o);return e===n.Yi.Mouse?(l.deviceType=n.Yi.Mouse,l.pointerId=1,l.pointerType="mouse"):(l.deviceType=n.Yi.Touch,l.pointerId=null!=a?a:t,l.pointerType="touch"),i===n.Fz.Move?l.type="pointermove":i>=n.Fz.LeftClick&&i<=n.Fz.RightClick&&(l.type=1===s?"pointerdown":"pointerup",l.button=i-2),l}static _CreateWheelEvent(e,t,i,s,o,a){const l=this._CreateMouseEvent(e,t,i,s,o,a);switch(l.pointerId=1,l.type="wheel",l.deltaMode=r.G.DOM_DELTA_PIXEL,l.deltaX=0,l.deltaY=0,l.deltaZ=0,i){case n.Fz.MouseWheelX:l.deltaX=s;break;case n.Fz.MouseWheelY:l.deltaY=s;break;case n.Fz.MouseWheelZ:l.deltaZ=s}return l}static _CreateMouseEvent(e,t,i,s,r,o){const a=this._CreateEvent(o),l=r.pollInput(e,t,n.Fz.Horizontal),h=r.pollInput(e,t,n.Fz.Vertical);return o?(a.movementX=0,a.movementY=0,a.offsetX=a.movementX-o.getBoundingClientRect().x,a.offsetY=a.movementY-o.getBoundingClientRect().y):(a.movementX=r.pollInput(e,t,n.FP.DeltaHorizontal),a.movementY=r.pollInput(e,t,n.FP.DeltaVertical),a.offsetX=0,a.offsetY=0),this._CheckNonCharacterKeys(a,r),a.clientX=l,a.clientY=h,a.x=l,a.y=h,a.deviceType=e,a.deviceSlot=t,a.inputIndex=i,a}static _CreateKeyboardEvent(e,t,i,s){const r=this._CreateEvent(s);return this._CheckNonCharacterKeys(r,i),r.deviceType=n.Yi.Keyboard,r.deviceSlot=0,r.inputIndex=e,r.type=1===t?"keydown":"keyup",r.key=String.fromCharCode(e),r.keyCode=e,r}static _CheckNonCharacterKeys(e,t){const i=t.isDeviceAvailable(n.Yi.Keyboard),s=i&&1===t.pollInput(n.Yi.Keyboard,0,18),r=i&&1===t.pollInput(n.Yi.Keyboard,0,17),o=i&&(1===t.pollInput(n.Yi.Keyboard,0,91)||1===t.pollInput(n.Yi.Keyboard,0,92)||1===t.pollInput(n.Yi.Keyboard,0,93)),a=i&&1===t.pollInput(n.Yi.Keyboard,0,16);e.altKey=s,e.ctrlKey=r,e.metaKey=o,e.shiftKey=a}static _CreateEvent(e){const t={preventDefault:()=>{}};return t.target=e,t}}class a{constructor(e,t,i){this._nativeInput=_native.DeviceInputSystem?new _native.DeviceInputSystem(e,t,((e,t,n,s)=>{const r=o.CreateDeviceEvent(e,t,n,s,this);i(e,t,r)})):this._createDummyNativeInput()}pollInput(e,t,i){return this._nativeInput.pollInput(e,t,i)}isDeviceAvailable(e){return e===n.Yi.Mouse||e===n.Yi.Touch}dispose(){this._nativeInput.dispose()}_createDummyNativeInput(){return{pollInput:()=>0,isDeviceAvailable:()=>!1,dispose:()=>{}}}}var l=i(6797),h=i(7257);const c=Object.keys(n.Fz).length/2;class u{constructor(e,t,i,n){this._inputs=[],this._keyboardActive=!1,this._pointerActive=!1,this._usingSafari=h.w1.IsSafari(),this._usingMacOS=(0,l.up)()&&/(Mac|iPhone|iPod|iPad)/i.test(navigator.platform),this._keyboardDownEvent=e=>{},this._keyboardUpEvent=e=>{},this._keyboardBlurEvent=e=>{},this._pointerMoveEvent=e=>{},this._pointerDownEvent=e=>{},this._pointerUpEvent=e=>{},this._pointerCancelEvent=e=>{},this._pointerWheelEvent=e=>{},this._pointerBlurEvent=e=>{},this._eventsAttached=!1,this._mouseId=-1,this._isUsingFirefox=l.MZ.IsNavigatorAvailable()&&navigator.userAgent&&-1!==navigator.userAgent.indexOf("Firefox"),this._maxTouchPoints=0,this._pointerInputClearObserver=null,this._gamepadConnectedEvent=e=>{},this._gamepadDisconnectedEvent=e=>{},this._eventPrefix=h.w1.GetPointerPrefix(e),this._engine=e,this._onDeviceConnected=t,this._onDeviceDisconnected=i,this._onInputChanged=n,this._mouseId=this._isUsingFirefox?0:1,this._enableEvents(),this._usingMacOS&&(this._metaKeys=[]),this._engine._onEngineViewChanged||(this._engine._onEngineViewChanged=()=>{this._enableEvents()})}pollInput(e,t,i){const s=this._inputs[e][t];if(!s)throw`Unable to find device ${n.Yi[e]}`;e>=n.Yi.DualShock&&e<=n.Yi.DualSense&&this._updateDevice(e,t,i);const r=s[i];if(void 0===r)throw`Unable to find input ${i} for device ${n.Yi[e]} in slot ${t}`;return i===n.Fz.Move&&h.w1.Warn("Unable to provide information for PointerInput.Move.  Try using PointerInput.Horizontal or PointerInput.Vertical for move data."),r}isDeviceAvailable(e){return void 0!==this._inputs[e]}dispose(){this._onDeviceConnected=()=>{},this._onDeviceDisconnected=()=>{},this._onInputChanged=()=>{},delete this._engine._onEngineViewChanged,this._elementToAttachTo&&this._disableEvents()}_enableEvents(){const e=null==this?void 0:this._engine.getInputElement();if(e&&(!this._eventsAttached||this._elementToAttachTo!==e)){if(this._disableEvents(),this._inputs)for(const e of this._inputs)if(e)for(const t in e){const i=e[+t];if(i)for(let e=0;e<i.length;e++)i[e]=0}this._elementToAttachTo=e,this._elementToAttachTo.tabIndex=-1!==this._elementToAttachTo.tabIndex?this._elementToAttachTo.tabIndex:this._engine.canvasTabIndex,this._handleKeyActions(),this._handlePointerActions(),this._handleGamepadActions(),this._eventsAttached=!0,this._checkForConnectedDevices()}}_disableEvents(){this._elementToAttachTo&&(this._elementToAttachTo.removeEventListener("blur",this._keyboardBlurEvent),this._elementToAttachTo.removeEventListener("blur",this._pointerBlurEvent),this._elementToAttachTo.removeEventListener("keydown",this._keyboardDownEvent),this._elementToAttachTo.removeEventListener("keyup",this._keyboardUpEvent),this._elementToAttachTo.removeEventListener(this._eventPrefix+"move",this._pointerMoveEvent),this._elementToAttachTo.removeEventListener(this._eventPrefix+"down",this._pointerDownEvent),this._elementToAttachTo.removeEventListener(this._eventPrefix+"up",this._pointerUpEvent),this._elementToAttachTo.removeEventListener(this._eventPrefix+"cancel",this._pointerCancelEvent),this._elementToAttachTo.removeEventListener(this._wheelEventName,this._pointerWheelEvent),window.removeEventListener("gamepadconnected",this._gamepadConnectedEvent),window.removeEventListener("gamepaddisconnected",this._gamepadDisconnectedEvent)),this._pointerInputClearObserver&&this._engine.onEndFrameObservable.remove(this._pointerInputClearObserver),this._eventsAttached=!1}_checkForConnectedDevices(){if(navigator.getGamepads){const e=navigator.getGamepads();for(const t of e)t&&this._addGamePad(t)}"function"==typeof matchMedia&&matchMedia("(pointer:fine)").matches&&this._addPointerDevice(n.Yi.Mouse,0,0,0)}_addGamePad(e){const t=this._getGamepadDeviceType(e.id),i=e.index;this._gamepads=this._gamepads||new Array(e.index+1),this._registerDevice(t,i,e.buttons.length+e.axes.length),this._gamepads[i]=t}_addPointerDevice(e,t,i,n){this._pointerActive||(this._pointerActive=!0),this._registerDevice(e,t,c);const s=this._inputs[e][t];s[0]=i,s[1]=n}_registerDevice(e,t,i){if(void 0===t)throw`Unable to register device ${n.Yi[e]} to undefined slot.`;if(this._inputs[e]||(this._inputs[e]={}),!this._inputs[e][t]){const n=new Array(i);n.fill(0),this._inputs[e][t]=n,this._onDeviceConnected(e,t)}}_unregisterDevice(e,t){this._inputs[e][t]&&(delete this._inputs[e][t],this._onDeviceDisconnected(e,t))}_handleKeyActions(){this._keyboardDownEvent=e=>{this._keyboardActive||(this._keyboardActive=!0,this._registerDevice(n.Yi.Keyboard,0,255));const t=this._inputs[n.Yi.Keyboard][0];if(t){t[e.keyCode]=1;const i=e;i.inputIndex=e.keyCode,this._usingMacOS&&e.metaKey&&"Meta"!==e.key&&(this._metaKeys.includes(e.keyCode)||this._metaKeys.push(e.keyCode)),this._onInputChanged(n.Yi.Keyboard,0,i)}},this._keyboardUpEvent=e=>{this._keyboardActive||(this._keyboardActive=!0,this._registerDevice(n.Yi.Keyboard,0,255));const t=this._inputs[n.Yi.Keyboard][0];if(t){t[e.keyCode]=0;const i=e;if(i.inputIndex=e.keyCode,this._usingMacOS&&"Meta"===e.key&&this._metaKeys.length>0){for(const e of this._metaKeys){const i=o.CreateDeviceEvent(n.Yi.Keyboard,0,e,0,this,this._elementToAttachTo);t[e]=0,this._onInputChanged(n.Yi.Keyboard,0,i)}this._metaKeys.splice(0,this._metaKeys.length)}this._onInputChanged(n.Yi.Keyboard,0,i)}},this._keyboardBlurEvent=()=>{if(this._keyboardActive){const e=this._inputs[n.Yi.Keyboard][0];for(let t=0;t<e.length;t++)if(0!==e[t]){e[t]=0;const i=o.CreateDeviceEvent(n.Yi.Keyboard,0,t,0,this,this._elementToAttachTo);this._onInputChanged(n.Yi.Keyboard,0,i)}this._usingMacOS&&this._metaKeys.splice(0,this._metaKeys.length)}},this._elementToAttachTo.addEventListener("keydown",this._keyboardDownEvent),this._elementToAttachTo.addEventListener("keyup",this._keyboardUpEvent),this._elementToAttachTo.addEventListener("blur",this._keyboardBlurEvent)}_handlePointerActions(){this._maxTouchPoints=l.MZ.IsNavigatorAvailable()&&navigator.maxTouchPoints||2,this._activeTouchIds||(this._activeTouchIds=new Array(this._maxTouchPoints));for(let e=0;e<this._maxTouchPoints;e++)this._activeTouchIds[e]=-1;this._pointerMoveEvent=e=>{const t=this._getPointerType(e),i=t===n.Yi.Mouse?0:this._activeTouchIds.indexOf(e.pointerId);this._inputs[t]||(this._inputs[t]={}),this._inputs[t][i]||this._addPointerDevice(t,i,e.clientX,e.clientY);const s=this._inputs[t][i];if(s){const r=e;r.inputIndex=n.Fz.Move,s[n.Fz.Horizontal]=e.clientX,s[n.Fz.Vertical]=e.clientY,void 0===e.pointerId&&(e.pointerId=this._mouseId),this._onInputChanged(t,i,r),this._usingSafari||-1===e.button||(r.inputIndex=e.button+2,s[e.button+2]=s[e.button+2]?0:1,this._onInputChanged(t,i,r))}},this._pointerDownEvent=e=>{const t=this._getPointerType(e);let i=t===n.Yi.Mouse?0:e.pointerId;if(t===n.Yi.Touch){const t=this._activeTouchIds.indexOf(-1);if(!(t>=0))return void h.w1.Warn(`Max number of touches exceeded.  Ignoring touches in excess of ${this._maxTouchPoints}`);i=t,this._activeTouchIds[t]=e.pointerId}this._inputs[t]||(this._inputs[t]={}),this._inputs[t][i]?t===n.Yi.Touch&&this._onDeviceConnected(t,i):this._addPointerDevice(t,i,e.clientX,e.clientY);const s=this._inputs[t][i];if(s){const r=s[n.Fz.Horizontal],o=s[n.Fz.Vertical];if(t===n.Yi.Mouse){if(void 0===e.pointerId&&(e.pointerId=this._mouseId),!document.pointerLockElement)try{this._elementToAttachTo.setPointerCapture(this._mouseId)}catch(e){}}else if(e.pointerId&&!document.pointerLockElement)try{this._elementToAttachTo.setPointerCapture(e.pointerId)}catch(e){}s[n.Fz.Horizontal]=e.clientX,s[n.Fz.Vertical]=e.clientY,s[e.button+2]=1;const a=e;a.inputIndex=e.button+2,this._onInputChanged(t,i,a),r===e.clientX&&o===e.clientY||(a.inputIndex=n.Fz.Move,this._onInputChanged(t,i,a))}},this._pointerUpEvent=e=>{var t,i,s,r,o;const a=this._getPointerType(e),l=a===n.Yi.Mouse?0:this._activeTouchIds.indexOf(e.pointerId);if(a===n.Yi.Touch){if(-1===l)return;this._activeTouchIds[l]=-1}const h=null===(t=this._inputs[a])||void 0===t?void 0:t[l];if(h&&0!==h[e.button+2]){const t=h[n.Fz.Horizontal],c=h[n.Fz.Vertical];h[n.Fz.Horizontal]=e.clientX,h[n.Fz.Vertical]=e.clientY,h[e.button+2]=0;const u=e;void 0===e.pointerId&&(e.pointerId=this._mouseId),t===e.clientX&&c===e.clientY||(u.inputIndex=n.Fz.Move,this._onInputChanged(a,l,u)),u.inputIndex=e.button+2,a===n.Yi.Mouse&&this._mouseId>=0&&(null===(s=(i=this._elementToAttachTo).hasPointerCapture)||void 0===s?void 0:s.call(i,this._mouseId))?this._elementToAttachTo.releasePointerCapture(this._mouseId):e.pointerId&&(null===(o=(r=this._elementToAttachTo).hasPointerCapture)||void 0===o?void 0:o.call(r,e.pointerId))&&this._elementToAttachTo.releasePointerCapture(e.pointerId),this._onInputChanged(a,l,u),a===n.Yi.Touch&&this._onDeviceDisconnected(a,l)}},this._pointerCancelEvent=e=>{var t,i,s,r;if("mouse"===e.pointerType){const e=this._inputs[n.Yi.Mouse][0];this._mouseId>=0&&(null===(i=(t=this._elementToAttachTo).hasPointerCapture)||void 0===i?void 0:i.call(t,this._mouseId))&&this._elementToAttachTo.releasePointerCapture(this._mouseId);for(let t=n.Fz.LeftClick;t<=n.Fz.BrowserForward;t++)if(1===e[t]){e[t]=0;const i=o.CreateDeviceEvent(n.Yi.Mouse,0,t,0,this,this._elementToAttachTo);this._onInputChanged(n.Yi.Mouse,0,i)}}else{const t=this._activeTouchIds.indexOf(e.pointerId);(null===(r=(s=this._elementToAttachTo).hasPointerCapture)||void 0===r?void 0:r.call(s,e.pointerId))&&this._elementToAttachTo.releasePointerCapture(e.pointerId),this._inputs[n.Yi.Touch][t][n.Fz.LeftClick]=0;const i=o.CreateDeviceEvent(n.Yi.Touch,t,n.Fz.LeftClick,0,this,this._elementToAttachTo,e.pointerId);this._onInputChanged(n.Yi.Touch,t,i),this._activeTouchIds[t]=-1,this._onDeviceDisconnected(n.Yi.Touch,t)}},this._wheelEventName="onwheel"in document.createElement("div")?"wheel":void 0!==document.onmousewheel?"mousewheel":"DOMMouseScroll";let e=!1;const t=function(){};try{const i=Object.defineProperty({},"passive",{get:function(){e=!0}});this._elementToAttachTo.addEventListener("test",t,i),this._elementToAttachTo.removeEventListener("test",t,i)}catch(e){}this._pointerBlurEvent=()=>{var e,t,i,s,r;if(this.isDeviceAvailable(n.Yi.Mouse)){const i=this._inputs[n.Yi.Mouse][0];this._mouseId>=0&&(null===(t=(e=this._elementToAttachTo).hasPointerCapture)||void 0===t?void 0:t.call(e,this._mouseId))&&this._elementToAttachTo.releasePointerCapture(this._mouseId);for(let e=n.Fz.LeftClick;e<=n.Fz.BrowserForward;e++)if(1===i[e]){i[e]=0;const t=o.CreateDeviceEvent(n.Yi.Mouse,0,e,0,this,this._elementToAttachTo);this._onInputChanged(n.Yi.Mouse,0,t)}}if(this.isDeviceAvailable(n.Yi.Touch)){const e=this._inputs[n.Yi.Touch];for(let t=0;t<this._activeTouchIds.length;t++){const a=this._activeTouchIds[t];if((null===(s=(i=this._elementToAttachTo).hasPointerCapture)||void 0===s?void 0:s.call(i,a))&&this._elementToAttachTo.releasePointerCapture(a),-1!==a&&1===(null===(r=e[t])||void 0===r?void 0:r[n.Fz.LeftClick])){e[t][n.Fz.LeftClick]=0;const i=o.CreateDeviceEvent(n.Yi.Touch,t,n.Fz.LeftClick,0,this,this._elementToAttachTo,a);this._onInputChanged(n.Yi.Touch,t,i),this._activeTouchIds[t]=-1,this._onDeviceDisconnected(n.Yi.Touch,t)}}}},this._pointerWheelEvent=e=>{const t=n.Yi.Mouse;this._inputs[t]||(this._inputs[t]=[]),this._inputs[t][0]||(this._pointerActive=!0,this._registerDevice(t,0,c));const i=this._inputs[t][0];if(i){i[n.Fz.MouseWheelX]=e.deltaX||0,i[n.Fz.MouseWheelY]=e.deltaY||e.wheelDelta||0,i[n.Fz.MouseWheelZ]=e.deltaZ||0;const s=e;void 0===e.pointerId&&(e.pointerId=this._mouseId),0!==i[n.Fz.MouseWheelX]&&(s.inputIndex=n.Fz.MouseWheelX,this._onInputChanged(t,0,s)),0!==i[n.Fz.MouseWheelY]&&(s.inputIndex=n.Fz.MouseWheelY,this._onInputChanged(t,0,s)),0!==i[n.Fz.MouseWheelZ]&&(s.inputIndex=n.Fz.MouseWheelZ,this._onInputChanged(t,0,s))}},this._elementToAttachTo.addEventListener(this._eventPrefix+"move",this._pointerMoveEvent),this._elementToAttachTo.addEventListener(this._eventPrefix+"down",this._pointerDownEvent),this._elementToAttachTo.addEventListener(this._eventPrefix+"up",this._pointerUpEvent),this._elementToAttachTo.addEventListener(this._eventPrefix+"cancel",this._pointerCancelEvent),this._elementToAttachTo.addEventListener("blur",this._pointerBlurEvent),this._elementToAttachTo.addEventListener(this._wheelEventName,this._pointerWheelEvent,!!e&&{passive:!1}),this._pointerInputClearObserver=this._engine.onEndFrameObservable.add((()=>{if(this.isDeviceAvailable(n.Yi.Mouse)){const e=this._inputs[n.Yi.Mouse][0];e[n.Fz.MouseWheelX]=0,e[n.Fz.MouseWheelY]=0,e[n.Fz.MouseWheelZ]=0}}))}_handleGamepadActions(){this._gamepadConnectedEvent=e=>{this._addGamePad(e.gamepad)},this._gamepadDisconnectedEvent=e=>{if(this._gamepads){const t=this._getGamepadDeviceType(e.gamepad.id),i=e.gamepad.index;this._unregisterDevice(t,i),delete this._gamepads[i]}},window.addEventListener("gamepadconnected",this._gamepadConnectedEvent),window.addEventListener("gamepaddisconnected",this._gamepadDisconnectedEvent)}_updateDevice(e,t,i){const n=navigator.getGamepads()[t];if(n&&e===this._gamepads[t]){const s=this._inputs[e][t];i>=n.buttons.length?s[i]=n.axes[i-n.buttons.length].valueOf():s[i]=n.buttons[i].value}}_getGamepadDeviceType(e){return-1!==e.indexOf("054c")?-1!==e.indexOf("0ce6")?n.Yi.DualSense:n.Yi.DualShock:-1!==e.indexOf("Xbox One")||-1!==e.search("Xbox 360")||-1!==e.search("xinput")?n.Yi.Xbox:-1!==e.indexOf("057e")?n.Yi.Switch:n.Yi.Generic}_getPointerType(e){let t=n.Yi.Mouse;return("touch"===e.pointerType||"pen"===e.pointerType||e.touches)&&(t=n.Yi.Touch),t}}var d=i(7967);class p{constructor(e){this._registeredManagers=new Array,this._refCount=0,this.registerManager=e=>{for(let t=0;t<this._devices.length;t++){const i=this._devices[t];for(const n in i){const i=+n;e._addDevice(new d.p(this._deviceInputSystem,t,i))}}this._registeredManagers.push(e)},this.unregisterManager=e=>{const t=this._registeredManagers.indexOf(e);t>-1&&this._registeredManagers.splice(t,1)};const t=Object.keys(n.Yi).length/2;this._devices=new Array(t);const i=(e,t)=>{this._devices[e]||(this._devices[e]=new Array),this._devices[e][t]||(this._devices[e][t]=t);for(const i of this._registeredManagers){const n=new d.p(this._deviceInputSystem,e,t);i._addDevice(n)}},s=(e,t)=>{var i;(null===(i=this._devices[e])||void 0===i?void 0:i[t])&&delete this._devices[e][t];for(const i of this._registeredManagers)i._removeDevice(e,t)},r=(e,t,i)=>{if(i)for(const n of this._registeredManagers)n._onInputChanged(e,t,i)};"undefined"!=typeof _native?this._deviceInputSystem=new a(i,s,r):this._deviceInputSystem=new u(e,i,s,r)}dispose(){this._deviceInputSystem.dispose()}}class f{getDeviceSource(e,t){if(void 0===t){if(void 0===this._firstDevice[e])return null;t=this._firstDevice[e]}return this._devices[e]&&void 0!==this._devices[e][t]?this._devices[e][t]:null}getDeviceSources(e){return this._devices[e]?this._devices[e].filter((e=>!!e)):[]}constructor(e){const t=Object.keys(n.Yi).length/2;this._devices=new Array(t),this._firstDevice=new Array(t),this._engine=e,this._engine._deviceSourceManager||(this._engine._deviceSourceManager=new p(e)),this._engine._deviceSourceManager._refCount++,this.onDeviceConnectedObservable=new s.y$((e=>{for(const t of this._devices)if(t)for(const i of t)i&&this.onDeviceConnectedObservable.notifyObserver(e,i)})),this.onDeviceDisconnectedObservable=new s.y$,this._engine._deviceSourceManager.registerManager(this),this._onDisposeObserver=e.onDisposeObservable.add((()=>{this.dispose()}))}dispose(){this.onDeviceConnectedObservable.clear(),this.onDeviceDisconnectedObservable.clear(),this._engine._deviceSourceManager&&(this._engine._deviceSourceManager.unregisterManager(this),--this._engine._deviceSourceManager._refCount<1&&(this._engine._deviceSourceManager.dispose(),delete this._engine._deviceSourceManager)),this._engine.onDisposeObservable.remove(this._onDisposeObserver)}_addDevice(e){this._devices[e.deviceType]||(this._devices[e.deviceType]=new Array),this._devices[e.deviceType][e.deviceSlot]||(this._devices[e.deviceType][e.deviceSlot]=e,this._updateFirstDevices(e.deviceType)),this.onDeviceConnectedObservable.notifyObservers(e)}_removeDevice(e,t){var i,n;const s=null===(i=this._devices[e])||void 0===i?void 0:i[t];this.onDeviceDisconnectedObservable.notifyObservers(s),(null===(n=this._devices[e])||void 0===n?void 0:n[t])&&delete this._devices[e][t],this._updateFirstDevices(e)}_onInputChanged(e,t,i){var n,s;null===(s=null===(n=this._devices[e])||void 0===n?void 0:n[t])||void 0===s||s.onInputChangedObservable.notifyObservers(i)}_updateFirstDevices(e){switch(e){case n.Yi.Keyboard:case n.Yi.Mouse:this._firstDevice[e]=0;break;case n.Yi.Touch:case n.Yi.DualSense:case n.Yi.DualShock:case n.Yi.Xbox:case n.Yi.Switch:case n.Yi.Generic:{delete this._firstDevice[e];const t=this._devices[e];if(t)for(let i=0;i<t.length;i++)if(t[i]){this._firstDevice[e]=i;break}break}}}}},9347:(e,t,i)=>{var n=i(3230);n.B.prototype.setAlphaConstants=function(e,t,i,n){this._alphaState.setAlphaBlendConstants(e,t,i,n)},n.B.prototype.setAlphaMode=function(e,t=!1){if(this._alphaMode!==e){switch(e){case 0:this._alphaState.alphaBlend=!1;break;case 7:this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE,this._gl.ONE_MINUS_SRC_ALPHA,this._gl.ONE,this._gl.ONE),this._alphaState.alphaBlend=!0;break;case 8:case 14:this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE,this._gl.ONE_MINUS_SRC_ALPHA,this._gl.ONE,this._gl.ONE_MINUS_SRC_ALPHA),this._alphaState.alphaBlend=!0;break;case 2:this._alphaState.setAlphaBlendFunctionParameters(this._gl.SRC_ALPHA,this._gl.ONE_MINUS_SRC_ALPHA,this._gl.ONE,this._gl.ONE),this._alphaState.alphaBlend=!0;break;case 6:this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE,this._gl.ONE,this._gl.ZERO,this._gl.ONE),this._alphaState.alphaBlend=!0;break;case 1:this._alphaState.setAlphaBlendFunctionParameters(this._gl.SRC_ALPHA,this._gl.ONE,this._gl.ZERO,this._gl.ONE),this._alphaState.alphaBlend=!0;break;case 3:this._alphaState.setAlphaBlendFunctionParameters(this._gl.ZERO,this._gl.ONE_MINUS_SRC_COLOR,this._gl.ONE,this._gl.ONE),this._alphaState.alphaBlend=!0;break;case 4:this._alphaState.setAlphaBlendFunctionParameters(this._gl.DST_COLOR,this._gl.ZERO,this._gl.ONE,this._gl.ONE),this._alphaState.alphaBlend=!0;break;case 5:this._alphaState.setAlphaBlendFunctionParameters(this._gl.SRC_ALPHA,this._gl.ONE_MINUS_SRC_COLOR,this._gl.ONE,this._gl.ONE),this._alphaState.alphaBlend=!0;break;case 9:this._alphaState.setAlphaBlendFunctionParameters(this._gl.CONSTANT_COLOR,this._gl.ONE_MINUS_CONSTANT_COLOR,this._gl.CONSTANT_ALPHA,this._gl.ONE_MINUS_CONSTANT_ALPHA),this._alphaState.alphaBlend=!0;break;case 10:this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE,this._gl.ONE_MINUS_SRC_COLOR,this._gl.ONE,this._gl.ONE_MINUS_SRC_ALPHA),this._alphaState.alphaBlend=!0;break;case 11:this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE,this._gl.ONE,this._gl.ONE,this._gl.ONE),this._alphaState.alphaBlend=!0;break;case 12:this._alphaState.setAlphaBlendFunctionParameters(this._gl.DST_ALPHA,this._gl.ONE,this._gl.ZERO,this._gl.ZERO),this._alphaState.alphaBlend=!0;break;case 13:this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE_MINUS_DST_COLOR,this._gl.ONE_MINUS_SRC_COLOR,this._gl.ONE_MINUS_DST_ALPHA,this._gl.ONE_MINUS_SRC_ALPHA),this._alphaState.alphaBlend=!0;break;case 15:this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE,this._gl.ONE,this._gl.ONE,this._gl.ZERO),this._alphaState.alphaBlend=!0;break;case 16:this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE_MINUS_DST_COLOR,this._gl.ONE_MINUS_SRC_COLOR,this._gl.ZERO,this._gl.ONE),this._alphaState.alphaBlend=!0;break;case 17:this._alphaState.setAlphaBlendFunctionParameters(this._gl.SRC_ALPHA,this._gl.ONE_MINUS_SRC_ALPHA,this._gl.ONE,this._gl.ONE_MINUS_SRC_ALPHA),this._alphaState.alphaBlend=!0}t||(this.depthCullingState.depthMask=0===e),this._alphaMode=e}else if(!t){const t=0===e;this.depthCullingState.depthMask!==t&&(this.depthCullingState.depthMask=t)}},n.B.prototype.getAlphaMode=function(){return this._alphaMode},n.B.prototype.setAlphaEquation=function(e){if(this._alphaEquation!==e){switch(e){case 0:this._alphaState.setAlphaEquationParameters(32774,32774);break;case 1:this._alphaState.setAlphaEquationParameters(32778,32778);break;case 2:this._alphaState.setAlphaEquationParameters(32779,32779);break;case 3:this._alphaState.setAlphaEquationParameters(32776,32776);break;case 4:this._alphaState.setAlphaEquationParameters(32775,32775);break;case 5:this._alphaState.setAlphaEquationParameters(32775,32774)}this._alphaEquation=e}},n.B.prototype.getAlphaEquation=function(){return this._alphaEquation}},2477:(e,t,i)=>{var n=i(3230),s=i(6202),r=i(2722),o=i(5661),a=i(1983);n.B.prototype._createDepthStencilCubeTexture=function(e,t,i){const n=new s.l(this,s.S.DepthStencil);if(n.isCube=!0,1===this.webGLVersion)return r.Y.Error("Depth cube texture is not supported by WebGL 1."),n;const o={bilinearFiltering:!1,comparisonFunction:0,generateStencil:!1,...t},a=this._gl;this._bindTextureDirectly(a.TEXTURE_CUBE_MAP,n,!0),this._setupDepthStencilTexture(n,e,o.generateStencil,o.bilinearFiltering,o.comparisonFunction),i._depthStencilTexture=n,i._depthStencilTextureWithStencil=o.generateStencil;for(let t=0;t<6;t++)o.generateStencil?a.texImage2D(a.TEXTURE_CUBE_MAP_POSITIVE_X+t,0,a.DEPTH24_STENCIL8,e,e,0,a.DEPTH_STENCIL,a.UNSIGNED_INT_24_8,null):a.texImage2D(a.TEXTURE_CUBE_MAP_POSITIVE_X+t,0,a.DEPTH_COMPONENT24,e,e,0,a.DEPTH_COMPONENT,a.UNSIGNED_INT,null);return this._bindTextureDirectly(a.TEXTURE_CUBE_MAP,null),this._internalTexturesCache.push(n),n},n.B.prototype._partialLoadFile=function(e,t,i,n,s=null){this._loadFile(e,(e=>{i[t]=e,i._internalCount++,6===i._internalCount&&n(i)}),void 0,void 0,!0,((e,t)=>{s&&e&&s(e.status+" "+e.statusText,t)}))},n.B.prototype._cascadeLoadFiles=function(e,t,i,n=null){const s=[];s._internalCount=0;for(let e=0;e<6;e++)this._partialLoadFile(i[e],e,s,t,n)},n.B.prototype._cascadeLoadImgs=function(e,t,i,n,s=null,r){const o=[];o._internalCount=0;for(let a=0;a<6;a++)this._partialLoadImg(n[a],a,o,e,t,i,s,r)},n.B.prototype._partialLoadImg=function(e,t,i,n,s,r,l=null,h){const c=(0,a.f)();(0,o.r6)(e,(e=>{i[t]=e,i._internalCount++,n&&n.removePendingData(c),6===i._internalCount&&r&&r(s,i)}),((e,t)=>{n&&n.removePendingData(c),l&&l(e,t)}),n?n.offlineProvider:null,h),n&&n.addPendingData(c)},n.B.prototype._setCubeMapTextureParams=function(e,t,i){const n=this._gl;n.texParameteri(n.TEXTURE_CUBE_MAP,n.TEXTURE_MAG_FILTER,n.LINEAR),n.texParameteri(n.TEXTURE_CUBE_MAP,n.TEXTURE_MIN_FILTER,t?n.LINEAR_MIPMAP_LINEAR:n.LINEAR),n.texParameteri(n.TEXTURE_CUBE_MAP,n.TEXTURE_WRAP_S,n.CLAMP_TO_EDGE),n.texParameteri(n.TEXTURE_CUBE_MAP,n.TEXTURE_WRAP_T,n.CLAMP_TO_EDGE),e.samplingMode=t?3:2,t&&this.getCaps().textureMaxLevel&&void 0!==i&&i>0&&(n.texParameteri(n.TEXTURE_CUBE_MAP,n.TEXTURE_MAX_LEVEL,i),e._maxLodLevel=i),this._bindTextureDirectly(n.TEXTURE_CUBE_MAP,null)},n.B.prototype.createCubeTextureBase=function(e,t,i,o,a=null,l=null,h,c=null,u=!1,d=0,p=0,f=null,_=null,m=null,g=!1){const v=f||new s.l(this,s.S.Cube);v.isCube=!0,v.url=e,v.generateMipMaps=!o,v._lodGenerationScale=d,v._lodGenerationOffset=p,v._useSRGBBuffer=!!g&&this._caps.supportSRGBBuffers&&(this.webGLVersion>1||this.isWebGPU||!!o),v!==f&&(v.label=e.substring(0,60)),this._doNotHandleContextLost||(v._extension=c,v._files=i);const y=e;this._transformTextureUrl&&!f&&(e=this._transformTextureUrl(e));const x=e.split("?")[0],b=x.lastIndexOf("."),T=c||(b>-1?x.substring(b).toLowerCase():"");let S=null;for(const e of n.B._TextureLoaders)if(e.canLoad(T)){S=e;break}const E=(n,s)=>{e===y?l&&n&&l(n.status+" "+n.statusText,s):(r.Y.Warn(`Failed to load ${e}, falling back to the ${y}`),this.createCubeTextureBase(y,t,i,!!o,a,l,h,c,u,d,p,v,_,m,g))};if(S){const n=e=>{_&&_(v,e),S.loadCubeData(e,v,u,a,l)};i&&6===i.length?S.supportCascades?this._cascadeLoadFiles(t,(e=>n(e.map((e=>new Uint8Array(e))))),i,l):l?l("Textures type does not support cascades."):r.Y.Warn("Texture loader does not support cascades."):this._loadFile(e,(e=>n(new Uint8Array(e))),void 0,void 0,!0,E)}else{if(!i)throw new Error("Cannot load cubemap because files were not defined");this._cascadeLoadImgs(t,v,((e,t)=>{m&&m(e,t)}),i,l)}return this._internalTexturesCache.push(v),v},n.B.prototype.createCubeTexture=function(e,t,i,s,o=null,a=null,l,h=null,c=!1,u=0,d=0,p=null,f,_=!1){const m=this._gl;return this.createCubeTextureBase(e,t,i,!!s,o,a,l,h,c,u,d,p,(e=>this._bindTextureDirectly(m.TEXTURE_CUBE_MAP,e,!0)),((e,t)=>{const i=this.needPOTTextures?n.B.GetExponentOfTwo(t[0].width,this._caps.maxCubemapTextureSize):t[0].width,a=i,h=[m.TEXTURE_CUBE_MAP_POSITIVE_X,m.TEXTURE_CUBE_MAP_POSITIVE_Y,m.TEXTURE_CUBE_MAP_POSITIVE_Z,m.TEXTURE_CUBE_MAP_NEGATIVE_X,m.TEXTURE_CUBE_MAP_NEGATIVE_Y,m.TEXTURE_CUBE_MAP_NEGATIVE_Z];this._bindTextureDirectly(m.TEXTURE_CUBE_MAP,e,!0),this._unpackFlipY(!1);const c=l?this._getInternalFormat(l,e._useSRGBBuffer):e._useSRGBBuffer?this._glSRGBExtensionValues.SRGB8_ALPHA8:m.RGBA;let u=l?this._getInternalFormat(l):m.RGBA;e._useSRGBBuffer&&1===this.webGLVersion&&(u=c);for(let e=0;e<h.length;e++)if(t[e].width!==i||t[e].height!==a){if(this._prepareWorkingCanvas(),!this._workingCanvas||!this._workingContext)return void r.Y.Warn("Cannot create canvas to resize texture.");this._workingCanvas.width=i,this._workingCanvas.height=a,this._workingContext.drawImage(t[e],0,0,t[e].width,t[e].height,0,0,i,a),m.texImage2D(h[e],0,c,u,m.UNSIGNED_BYTE,this._workingCanvas)}else m.texImage2D(h[e],0,c,u,m.UNSIGNED_BYTE,t[e]);s||m.generateMipmap(m.TEXTURE_CUBE_MAP),this._setCubeMapTextureParams(e,!s),e.width=i,e.height=a,e.isReady=!0,l&&(e.format=l),e.onLoadedObservable.notifyObservers(e),e.onLoadedObservable.clear(),o&&o()}),!!_)}},3742:(e,t,i)=>{var n=i(3230);n.B.prototype.updateDynamicIndexBuffer=function(e,t,i=0){let n;this._currentBoundBuffer[this._gl.ELEMENT_ARRAY_BUFFER]=null,this.bindIndexBuffer(e),n=e.is32Bits?t instanceof Uint32Array?t:new Uint32Array(t):t instanceof Uint16Array?t:new Uint16Array(t),this._gl.bufferData(this._gl.ELEMENT_ARRAY_BUFFER,n,this._gl.DYNAMIC_DRAW),this._resetIndexBufferBinding()},n.B.prototype.updateDynamicVertexBuffer=function(e,t,i,n){this.bindArrayBuffer(e),void 0===i&&(i=0);const s=t.byteLength||t.length;void 0===n||n>=s&&0===i?t instanceof Array?this._gl.bufferSubData(this._gl.ARRAY_BUFFER,i,new Float32Array(t)):this._gl.bufferSubData(this._gl.ARRAY_BUFFER,i,t):t instanceof Array?this._gl.bufferSubData(this._gl.ARRAY_BUFFER,0,new Float32Array(t).subarray(i,i+n)):(t=t instanceof ArrayBuffer?new Uint8Array(t,i,n):new Uint8Array(t.buffer,t.byteOffset+i,n),this._gl.bufferSubData(this._gl.ARRAY_BUFFER,0,t)),this._resetVertexBufferBinding()}},6914:(e,t,i)=>{var n=i(3230),s=i(6202);n.B.prototype.createDynamicTexture=function(e,t,i,r){const o=new s.l(this,s.S.Dynamic);return o.baseWidth=e,o.baseHeight=t,i&&(e=this.needPOTTextures?n.B.GetExponentOfTwo(e,this._caps.maxTextureSize):e,t=this.needPOTTextures?n.B.GetExponentOfTwo(t,this._caps.maxTextureSize):t),o.width=e,o.height=t,o.isReady=!1,o.generateMipMaps=i,o.samplingMode=r,this.updateTextureSamplingMode(r,o),this._internalTexturesCache.push(o),o},n.B.prototype.updateDynamicTexture=function(e,t,i,n=!1,s,r=!1,o=!1){if(!e)return;const a=this._gl,l=a.TEXTURE_2D,h=this._bindTextureDirectly(l,e,!0,r);this._unpackFlipY(void 0===i?e.invertY:i),n&&a.pixelStorei(a.UNPACK_PREMULTIPLY_ALPHA_WEBGL,1);const c=this._getWebGLTextureType(e.type),u=this._getInternalFormat(s||e.format),d=this._getRGBABufferInternalSizedFormat(e.type,u);a.texImage2D(l,0,d,u,c,t),e.generateMipMaps&&a.generateMipmap(l),h||this._bindTextureDirectly(l,null),n&&a.pixelStorei(a.UNPACK_PREMULTIPLY_ALPHA_WEBGL,0),e.isReady=!0}},6599:(e,t,i)=>{var n=i(6202),s=i(2722),r=i(7257),o=i(3230);function a(e,t,i,n){let s,r=1;1===n?s=new Float32Array(t*i*4):2===n?(s=new Uint16Array(t*i*4),r=15360):s=7===n?new Uint32Array(t*i*4):new Uint8Array(t*i*4);for(let n=0;n<t;n++)for(let o=0;o<i;o++){const i=3*(o*t+n),a=4*(o*t+n);s[a+0]=e[i+0],s[a+1]=e[i+1],s[a+2]=e[i+2],s[a+3]=r}return s}function l(e){return function(t,i,s,r,o,a,l,h,c=null,u=0){const d=e?this._gl.TEXTURE_3D:this._gl.TEXTURE_2D_ARRAY,p=e?n.S.Raw3D:n.S.Raw2DArray,f=new n.l(this,p);f.baseWidth=i,f.baseHeight=s,f.baseDepth=r,f.width=i,f.height=s,f.depth=r,f.format=o,f.type=u,f.generateMipMaps=a,f.samplingMode=h,e?f.is3D=!0:f.is2DArray=!0,this._doNotHandleContextLost||(f._bufferView=t),e?this.updateRawTexture3D(f,t,o,l,c,u):this.updateRawTexture2DArray(f,t,o,l,c,u),this._bindTextureDirectly(d,f,!0);const _=this._getSamplingParameters(h,a);return this._gl.texParameteri(d,this._gl.TEXTURE_MAG_FILTER,_.mag),this._gl.texParameteri(d,this._gl.TEXTURE_MIN_FILTER,_.min),a&&this._gl.generateMipmap(d),this._bindTextureDirectly(d,null),this._internalTexturesCache.push(f),f}}function h(e){return function(t,i,n,s,r=null,o=0){const a=e?this._gl.TEXTURE_3D:this._gl.TEXTURE_2D_ARRAY,l=this._getWebGLTextureType(o),h=this._getInternalFormat(n),c=this._getRGBABufferInternalSizedFormat(o,n);this._bindTextureDirectly(a,t,!0),this._unpackFlipY(void 0===s||!!s),this._doNotHandleContextLost||(t._bufferView=i,t.format=n,t.invertY=s,t._compression=r),t.width%4!=0&&this._gl.pixelStorei(this._gl.UNPACK_ALIGNMENT,1),r&&i?this._gl.compressedTexImage3D(a,0,this.getCaps().s3tc[r],t.width,t.height,t.depth,0,i):this._gl.texImage3D(a,0,c,t.width,t.height,t.depth,0,h,l,i),t.generateMipMaps&&this._gl.generateMipmap(a),this._bindTextureDirectly(a,null),t.isReady=!0}}o.B.prototype.updateRawTexture=function(e,t,i,n,s=null,r=0,o=!1){if(!e)return;const a=this._getRGBABufferInternalSizedFormat(r,i,o),l=this._getInternalFormat(i),h=this._getWebGLTextureType(r);this._bindTextureDirectly(this._gl.TEXTURE_2D,e,!0),this._unpackFlipY(void 0===n||!!n),this._doNotHandleContextLost||(e._bufferView=t,e.format=i,e.type=r,e.invertY=n,e._compression=s),e.width%4!=0&&this._gl.pixelStorei(this._gl.UNPACK_ALIGNMENT,1),s&&t?this._gl.compressedTexImage2D(this._gl.TEXTURE_2D,0,this.getCaps().s3tc[s],e.width,e.height,0,t):this._gl.texImage2D(this._gl.TEXTURE_2D,0,a,e.width,e.height,0,l,h,t),e.generateMipMaps&&this._gl.generateMipmap(this._gl.TEXTURE_2D),this._bindTextureDirectly(this._gl.TEXTURE_2D,null),e.isReady=!0},o.B.prototype.createRawTexture=function(e,t,i,s,r,o,a,l=null,h=0,c=0,u=!1){const d=new n.l(this,n.S.Raw);d.baseWidth=t,d.baseHeight=i,d.width=t,d.height=i,d.format=s,d.generateMipMaps=r,d.samplingMode=a,d.invertY=o,d._compression=l,d.type=h,d._useSRGBBuffer=this._getUseSRGBBuffer(u,!r),this._doNotHandleContextLost||(d._bufferView=e),this.updateRawTexture(d,e,s,o,l,h,d._useSRGBBuffer),this._bindTextureDirectly(this._gl.TEXTURE_2D,d,!0);const p=this._getSamplingParameters(a,r);return this._gl.texParameteri(this._gl.TEXTURE_2D,this._gl.TEXTURE_MAG_FILTER,p.mag),this._gl.texParameteri(this._gl.TEXTURE_2D,this._gl.TEXTURE_MIN_FILTER,p.min),r&&this._gl.generateMipmap(this._gl.TEXTURE_2D),this._bindTextureDirectly(this._gl.TEXTURE_2D,null),this._internalTexturesCache.push(d),d},o.B.prototype.createRawCubeTexture=function(e,t,i,o,a,l,h,c=null){const u=this._gl,d=new n.l(this,n.S.CubeRaw);d.isCube=!0,d.format=i,d.type=o,this._doNotHandleContextLost||(d._bufferViewArray=e);const p=this._getWebGLTextureType(o);let f=this._getInternalFormat(i);f===u.RGB&&(f=u.RGBA),p!==u.FLOAT||this._caps.textureFloatLinearFiltering?p!==this._gl.HALF_FLOAT_OES||this._caps.textureHalfFloatLinearFiltering?p!==u.FLOAT||this._caps.textureFloatRender?p!==u.HALF_FLOAT||this._caps.colorBufferFloat||(a=!1,s.Y.Warn("Render to half float textures is not supported. Mipmap generation forced to false.")):(a=!1,s.Y.Warn("Render to float textures is not supported. Mipmap generation forced to false.")):(a=!1,h=1,s.Y.Warn("Half float texture filtering is not supported. Mipmap generation and sampling mode are forced to false and TEXTURE_NEAREST_SAMPLINGMODE, respectively.")):(a=!1,h=1,s.Y.Warn("Float texture filtering is not supported. Mipmap generation and sampling mode are forced to false and TEXTURE_NEAREST_SAMPLINGMODE, respectively."));const _=t,m=_;if(d.width=_,d.height=m,d.invertY=l,d._compression=c,!this.needPOTTextures||r.w1.IsExponentOfTwo(d.width)&&r.w1.IsExponentOfTwo(d.height)||(a=!1),e)this.updateRawCubeTexture(d,e,i,o,l,c);else{const e=this._getRGBABufferInternalSizedFormat(o),t=0;this._bindTextureDirectly(u.TEXTURE_CUBE_MAP,d,!0);for(let i=0;i<6;i++)c?u.compressedTexImage2D(u.TEXTURE_CUBE_MAP_POSITIVE_X+i,t,this.getCaps().s3tc[c],d.width,d.height,0,void 0):u.texImage2D(u.TEXTURE_CUBE_MAP_POSITIVE_X+i,t,e,d.width,d.height,0,f,p,null);this._bindTextureDirectly(this._gl.TEXTURE_CUBE_MAP,null)}this._bindTextureDirectly(this._gl.TEXTURE_CUBE_MAP,d,!0),e&&a&&this._gl.generateMipmap(this._gl.TEXTURE_CUBE_MAP);const g=this._getSamplingParameters(h,a);return u.texParameteri(u.TEXTURE_CUBE_MAP,u.TEXTURE_MAG_FILTER,g.mag),u.texParameteri(u.TEXTURE_CUBE_MAP,u.TEXTURE_MIN_FILTER,g.min),u.texParameteri(u.TEXTURE_CUBE_MAP,u.TEXTURE_WRAP_S,u.CLAMP_TO_EDGE),u.texParameteri(u.TEXTURE_CUBE_MAP,u.TEXTURE_WRAP_T,u.CLAMP_TO_EDGE),this._bindTextureDirectly(u.TEXTURE_CUBE_MAP,null),d.generateMipMaps=a,d.samplingMode=h,d.isReady=!0,d},o.B.prototype.updateRawCubeTexture=function(e,t,i,n,s,o=null,l=0){e._bufferViewArray=t,e.format=i,e.type=n,e.invertY=s,e._compression=o;const h=this._gl,c=this._getWebGLTextureType(n);let u=this._getInternalFormat(i);const d=this._getRGBABufferInternalSizedFormat(n);let p=!1;u===h.RGB&&(u=h.RGBA,p=!0),this._bindTextureDirectly(h.TEXTURE_CUBE_MAP,e,!0),this._unpackFlipY(void 0===s||!!s),e.width%4!=0&&h.pixelStorei(h.UNPACK_ALIGNMENT,1);for(let i=0;i<6;i++){let s=t[i];o?h.compressedTexImage2D(h.TEXTURE_CUBE_MAP_POSITIVE_X+i,l,this.getCaps().s3tc[o],e.width,e.height,0,s):(p&&(s=a(s,e.width,e.height,n)),h.texImage2D(h.TEXTURE_CUBE_MAP_POSITIVE_X+i,l,d,e.width,e.height,0,u,c,s))}(!this.needPOTTextures||r.w1.IsExponentOfTwo(e.width)&&r.w1.IsExponentOfTwo(e.height))&&e.generateMipMaps&&0===l&&this._gl.generateMipmap(this._gl.TEXTURE_CUBE_MAP),this._bindTextureDirectly(this._gl.TEXTURE_CUBE_MAP,null),e.isReady=!0},o.B.prototype.createRawCubeTextureFromUrl=function(e,t,i,n,s,r,o,l,h=null,c=null,u=3,d=!1){const p=this._gl,f=this.createRawCubeTexture(null,i,n,s,!r,d,u,null);null==t||t.addPendingData(f),f.url=e,f.isReady=!1,this._internalTexturesCache.push(f);const _=e=>{const i=f.width,r=o(e);if(r){if(l){const e=this._getWebGLTextureType(s);let t=this._getInternalFormat(n);const o=this._getRGBABufferInternalSizedFormat(s);let h=!1;t===p.RGB&&(t=p.RGBA,h=!0),this._bindTextureDirectly(p.TEXTURE_CUBE_MAP,f,!0),this._unpackFlipY(!1);const c=l(r);for(let n=0;n<c.length;n++){const r=i>>n;for(let i=0;i<6;i++){let l=c[n][i];h&&(l=a(l,r,r,s)),p.texImage2D(i,n,o,r,r,0,t,e,l)}}this._bindTextureDirectly(p.TEXTURE_CUBE_MAP,null)}else this.updateRawCubeTexture(f,r,n,s,d);f.isReady=!0,null==t||t.removePendingData(f),f.onLoadedObservable.notifyObservers(f),f.onLoadedObservable.clear(),h&&h()}};return this._loadFile(e,(e=>{_(e)}),void 0,null==t?void 0:t.offlineProvider,!0,((e,i)=>{null==t||t.removePendingData(f),c&&e&&c(e.status+" "+e.statusText,i)})),f},o.B.prototype.createRawTexture2DArray=l(!1),o.B.prototype.createRawTexture3D=l(!0),o.B.prototype.updateRawTexture2DArray=h(!1),o.B.prototype.updateRawTexture3D=h(!0)},9075:(e,t,i)=>{i.d(t,{A:()=>s});var n=i(3230);function s(e,t,i=!1,n){switch(e){case 3:{const e=(ArrayBuffer,new Int8Array(t));return n&&e.set(new Int8Array(n)),e}case 0:{const e=(ArrayBuffer,new Uint8Array(t));return n&&e.set(new Uint8Array(n)),e}case 4:{const e=t instanceof ArrayBuffer?new Int16Array(t):new Int16Array(i?t/2:t);return n&&e.set(new Int16Array(n)),e}case 5:case 8:case 9:case 10:case 2:{const e=t instanceof ArrayBuffer?new Uint16Array(t):new Uint16Array(i?t/2:t);return n&&e.set(new Uint16Array(n)),e}case 6:{const e=t instanceof ArrayBuffer?new Int32Array(t):new Int32Array(i?t/4:t);return n&&e.set(new Int32Array(n)),e}case 7:case 11:case 12:case 13:case 14:case 15:{const e=t instanceof ArrayBuffer?new Uint32Array(t):new Uint32Array(i?t/4:t);return n&&e.set(new Uint32Array(n)),e}case 1:{const e=t instanceof ArrayBuffer?new Float32Array(t):new Float32Array(i?t/4:t);return n&&e.set(new Float32Array(n)),e}}const s=(ArrayBuffer,new Uint8Array(t));return n&&s.set(new Uint8Array(n)),s}n.B.prototype._readTexturePixelsSync=function(e,t,i,n=-1,r=0,o=null,a=!0,l=!1,h=0,c=0){var u,d;const p=this._gl;if(!p)throw new Error("Engine does not have gl rendering context.");if(!this._dummyFramebuffer){const e=p.createFramebuffer();if(!e)throw new Error("Unable to create dummy framebuffer");this._dummyFramebuffer=e}p.bindFramebuffer(p.FRAMEBUFFER,this._dummyFramebuffer),n>-1?p.framebufferTexture2D(p.FRAMEBUFFER,p.COLOR_ATTACHMENT0,p.TEXTURE_CUBE_MAP_POSITIVE_X+n,null===(u=e._hardwareTexture)||void 0===u?void 0:u.underlyingResource,r):p.framebufferTexture2D(p.FRAMEBUFFER,p.COLOR_ATTACHMENT0,p.TEXTURE_2D,null===(d=e._hardwareTexture)||void 0===d?void 0:d.underlyingResource,r);let f=void 0!==e.type?this._getWebGLTextureType(e.type):p.UNSIGNED_BYTE;return l?o||(o=s(e.type,4*t*i)):f===p.UNSIGNED_BYTE?(o||(o=new Uint8Array(4*t*i)),f=p.UNSIGNED_BYTE):(o||(o=new Float32Array(4*t*i)),f=p.FLOAT),a&&this.flushFramebuffer(),p.readPixels(h,c,t,i,p.RGBA,f,o),p.bindFramebuffer(p.FRAMEBUFFER,this._currentFramebuffer),o},n.B.prototype._readTexturePixels=function(e,t,i,n=-1,s=0,r=null,o=!0,a=!1,l=0,h=0){return Promise.resolve(this._readTexturePixelsSync(e,t,i,n,s,r,o,a,l,h))}},7246:(e,t,i)=>{var n=i(6202),s=i(2722),r=i(3230),o=i(7374);class a extends o.r{constructor(e,t,i,n,s){super(e,t,i,n),this._framebuffer=null,this._depthStencilBuffer=null,this._MSAAFramebuffer=null,this._colorTextureArray=null,this._depthStencilTextureArray=null,this._context=s}_cloneRenderTargetWrapper(){let e=null;return this._colorTextureArray&&this._depthStencilTextureArray?(e=this._engine.createMultiviewRenderTargetTexture(this.width,this.height),e.texture.isReady=!0):e=super._cloneRenderTargetWrapper(),e}_swapRenderTargetWrapper(e){super._swapRenderTargetWrapper(e),e._framebuffer=this._framebuffer,e._depthStencilBuffer=this._depthStencilBuffer,e._MSAAFramebuffer=this._MSAAFramebuffer,e._colorTextureArray=this._colorTextureArray,e._depthStencilTextureArray=this._depthStencilTextureArray,this._framebuffer=this._depthStencilBuffer=this._MSAAFramebuffer=this._colorTextureArray=this._depthStencilTextureArray=null}_shareDepth(e){super._shareDepth(e);const t=this._context,i=this._depthStencilBuffer,n=e._MSAAFramebuffer||e._framebuffer;e._depthStencilBuffer&&t.deleteRenderbuffer(e._depthStencilBuffer),e._depthStencilBuffer=this._depthStencilBuffer,this._engine._bindUnboundFramebuffer(n),t.framebufferRenderbuffer(t.FRAMEBUFFER,t.DEPTH_ATTACHMENT,t.RENDERBUFFER,i),this._engine._bindUnboundFramebuffer(null)}_bindTextureRenderTarget(e,t=0,i,n=0){var s,r,o,a;if(!e._hardwareTexture)return;const l=this._framebuffer,h=this._engine._currentFramebuffer;if(this._engine._bindUnboundFramebuffer(l),this._engine.webGLVersion>1){const l=this._context,h=l["COLOR_ATTACHMENT"+t];e.is2DArray||e.is3D?(i=null!==(r=null!=i?i:null===(s=this.layerIndices)||void 0===s?void 0:s[t])&&void 0!==r?r:0,l.framebufferTextureLayer(l.FRAMEBUFFER,h,e._hardwareTexture.underlyingResource,n,i)):e.isCube?(i=null!==(a=null!=i?i:null===(o=this.faceIndices)||void 0===o?void 0:o[t])&&void 0!==a?a:0,l.framebufferTexture2D(l.FRAMEBUFFER,h,l.TEXTURE_CUBE_MAP_POSITIVE_X+i,e._hardwareTexture.underlyingResource,n)):l.framebufferTexture2D(l.FRAMEBUFFER,h,l.TEXTURE_2D,e._hardwareTexture.underlyingResource,n)}else{const s=this._context,r=s["COLOR_ATTACHMENT"+t+"_WEBGL"],o=void 0!==i?s.TEXTURE_CUBE_MAP_POSITIVE_X+i:s.TEXTURE_2D;s.framebufferTexture2D(s.FRAMEBUFFER,r,o,e._hardwareTexture.underlyingResource,n)}this._engine._bindUnboundFramebuffer(h)}setTexture(e,t=0,i=!0){super.setTexture(e,t,i),this._bindTextureRenderTarget(e,t)}setLayerAndFaceIndices(e,t){var i,n;if(super.setLayerAndFaceIndices(e,t),!this.textures||!this.layerIndices||!this.faceIndices)return;const s=null!==(n=null===(i=this._attachments)||void 0===i?void 0:i.length)&&void 0!==n?n:this.textures.length;for(let e=0;e<s;e++){const t=this.textures[e];t&&(t.is2DArray||t.is3D?this._bindTextureRenderTarget(t,e,this.layerIndices[e]):t.isCube?this._bindTextureRenderTarget(t,e,this.faceIndices[e]):this._bindTextureRenderTarget(t,e))}}setLayerAndFaceIndex(e=0,t,i){if(super.setLayerAndFaceIndex(e,t,i),!this.textures||!this.layerIndices||!this.faceIndices)return;const n=this.textures[e];n.is2DArray||n.is3D?this._bindTextureRenderTarget(this.textures[e],e,this.layerIndices[e]):n.isCube&&this._bindTextureRenderTarget(this.textures[e],e,this.faceIndices[e])}dispose(e=!1){const t=this._context;e||(this._colorTextureArray&&(this._context.deleteTexture(this._colorTextureArray),this._colorTextureArray=null),this._depthStencilTextureArray&&(this._context.deleteTexture(this._depthStencilTextureArray),this._depthStencilTextureArray=null)),this._framebuffer&&(t.deleteFramebuffer(this._framebuffer),this._framebuffer=null),this._depthStencilBuffer&&(t.deleteRenderbuffer(this._depthStencilBuffer),this._depthStencilBuffer=null),this._MSAAFramebuffer&&(t.deleteFramebuffer(this._MSAAFramebuffer),this._MSAAFramebuffer=null),super.dispose(e)}}r.B.prototype._createHardwareRenderTargetWrapper=function(e,t,i){const n=new a(e,t,i,this,this._gl);return this._renderTargetWrapperCache.push(n),n},r.B.prototype.createRenderTargetTexture=function(e,t){var i,s;const r=this._createHardwareRenderTargetWrapper(!1,!1,e);let o,a=!0,l=!1,h=!1,c=1;void 0!==t&&"object"==typeof t&&(a=null===(i=t.generateDepthBuffer)||void 0===i||i,l=!!t.generateStencilBuffer,h=!!t.noColorAttachment,o=t.colorAttachment,c=null!==(s=t.samples)&&void 0!==s?s:1);const u=o||(h?null:this._createInternalTexture(e,t,!0,n.S.RenderTarget)),d=e.width||e,p=e.height||e,f=this._currentFramebuffer,_=this._gl,m=_.createFramebuffer();return this._bindUnboundFramebuffer(m),r._depthStencilBuffer=this._setupFramebufferDepthAttachments(l,a,d,p),u&&!u.is2DArray&&_.framebufferTexture2D(_.FRAMEBUFFER,_.COLOR_ATTACHMENT0,_.TEXTURE_2D,u._hardwareTexture.underlyingResource,0),this._bindUnboundFramebuffer(f),r._framebuffer=m,r._generateDepthBuffer=a,r._generateStencilBuffer=l,r.setTextures(u),this.updateRenderTargetTextureSampleCount(r,c),r},r.B.prototype.createDepthStencilTexture=function(e,t,i){if(t.isCube){const n=e.width||e;return this._createDepthStencilCubeTexture(n,t,i)}return this._createDepthStencilTexture(e,t,i)},r.B.prototype._createDepthStencilTexture=function(e,t,i){const r=this._gl,o=e.layers||0,a=0!==o?r.TEXTURE_2D_ARRAY:r.TEXTURE_2D,l=new n.l(this,n.S.DepthStencil);if(!this._caps.depthTextureExtension)return s.Y.Error("Depth texture is not supported by your browser or hardware."),l;const h={bilinearFiltering:!1,comparisonFunction:0,generateStencil:!1,...t};if(this._bindTextureDirectly(a,l,!0),this._setupDepthStencilTexture(l,e,h.generateStencil,0!==h.comparisonFunction&&h.bilinearFiltering,h.comparisonFunction,h.samples),void 0!==h.depthTextureFormat){if(15!==h.depthTextureFormat&&16!==h.depthTextureFormat&&17!==h.depthTextureFormat&&13!==h.depthTextureFormat&&14!==h.depthTextureFormat&&18!==h.depthTextureFormat)return s.Y.Error("Depth texture format is not supported."),l;l.format=h.depthTextureFormat}else l.format=h.generateStencil?13:16;const c=17===l.format||13===l.format||18===l.format;i._depthStencilTexture=l,i._depthStencilTextureWithStencil=c;let u=r.UNSIGNED_INT;15===l.format?u=r.UNSIGNED_SHORT:17===l.format||13===l.format?u=r.UNSIGNED_INT_24_8:14===l.format?u=r.FLOAT:18===l.format&&(u=r.FLOAT_32_UNSIGNED_INT_24_8_REV);const d=c?r.DEPTH_STENCIL:r.DEPTH_COMPONENT;let p=d;this.webGLVersion>1&&(15===l.format?p=r.DEPTH_COMPONENT16:16===l.format?p=r.DEPTH_COMPONENT24:17===l.format||13===l.format?p=r.DEPTH24_STENCIL8:14===l.format?p=r.DEPTH_COMPONENT32F:18===l.format&&(p=r.DEPTH32F_STENCIL8)),l.is2DArray?r.texImage3D(a,0,p,l.width,l.height,o,0,d,u,null):r.texImage2D(a,0,p,l.width,l.height,0,d,u,null),this._bindTextureDirectly(a,null),this._internalTexturesCache.push(l);const f=i;if(f._depthStencilBuffer){const e=this._currentFramebuffer;this._bindUnboundFramebuffer(f._framebuffer),r.framebufferRenderbuffer(r.FRAMEBUFFER,r.DEPTH_STENCIL_ATTACHMENT,r.RENDERBUFFER,null),r.framebufferRenderbuffer(r.FRAMEBUFFER,r.DEPTH_ATTACHMENT,r.RENDERBUFFER,null),r.framebufferRenderbuffer(r.FRAMEBUFFER,r.STENCIL_ATTACHMENT,r.RENDERBUFFER,null),this._bindUnboundFramebuffer(e),r.deleteRenderbuffer(f._depthStencilBuffer),f._depthStencilBuffer=null}return l},r.B.prototype.updateRenderTargetTextureSampleCount=function(e,t){if(this.webGLVersion<2||!e||!e.texture)return 1;if(e.samples===t)return t;const i=this._gl;t=Math.min(t,this.getCaps().maxMSAASamples),e._depthStencilBuffer&&(i.deleteRenderbuffer(e._depthStencilBuffer),e._depthStencilBuffer=null),e._MSAAFramebuffer&&(i.deleteFramebuffer(e._MSAAFramebuffer),e._MSAAFramebuffer=null);const n=e.texture._hardwareTexture;if(n.releaseMSAARenderBuffers(),t>1&&"function"==typeof i.renderbufferStorageMultisample){const s=i.createFramebuffer();if(!s)throw new Error("Unable to create multi sampled framebuffer");e._MSAAFramebuffer=s,this._bindUnboundFramebuffer(e._MSAAFramebuffer);const r=this._createRenderBuffer(e.texture.width,e.texture.height,t,-1,this._getRGBAMultiSampleBufferFormat(e.texture.type),i.COLOR_ATTACHMENT0,!1);if(!r)throw new Error("Unable to create multi sampled framebuffer");n.addMSAARenderBuffer(r)}else this._bindUnboundFramebuffer(e._framebuffer);return e.texture.samples=t,e._samples=t,e._depthStencilBuffer=this._setupFramebufferDepthAttachments(e._generateStencilBuffer,e._generateDepthBuffer,e.texture.width,e.texture.height,t),this._bindUnboundFramebuffer(null),t}},6697:(e,t,i)=>{var n=i(6202),s=i(2722);i(3230).B.prototype.createRenderTargetCubeTexture=function(e,t){const i=this._createHardwareRenderTargetWrapper(!1,!0,e),r={generateMipMaps:!0,generateDepthBuffer:!0,generateStencilBuffer:!1,type:0,samplingMode:3,format:5,...t};r.generateStencilBuffer=r.generateDepthBuffer&&r.generateStencilBuffer,(1!==r.type||this._caps.textureFloatLinearFiltering)&&(2!==r.type||this._caps.textureHalfFloatLinearFiltering)||(r.samplingMode=1);const o=this._gl,a=new n.l(this,n.S.RenderTarget);this._bindTextureDirectly(o.TEXTURE_CUBE_MAP,a,!0);const l=this._getSamplingParameters(r.samplingMode,r.generateMipMaps);1!==r.type||this._caps.textureFloat||(r.type=0,s.Y.Warn("Float textures are not supported. Cube render target forced to TEXTURETYPE_UNESIGNED_BYTE type")),o.texParameteri(o.TEXTURE_CUBE_MAP,o.TEXTURE_MAG_FILTER,l.mag),o.texParameteri(o.TEXTURE_CUBE_MAP,o.TEXTURE_MIN_FILTER,l.min),o.texParameteri(o.TEXTURE_CUBE_MAP,o.TEXTURE_WRAP_S,o.CLAMP_TO_EDGE),o.texParameteri(o.TEXTURE_CUBE_MAP,o.TEXTURE_WRAP_T,o.CLAMP_TO_EDGE);for(let t=0;t<6;t++)o.texImage2D(o.TEXTURE_CUBE_MAP_POSITIVE_X+t,0,this._getRGBABufferInternalSizedFormat(r.type,r.format),e,e,0,this._getInternalFormat(r.format),this._getWebGLTextureType(r.type),null);const h=o.createFramebuffer();return this._bindUnboundFramebuffer(h),i._depthStencilBuffer=this._setupFramebufferDepthAttachments(r.generateStencilBuffer,r.generateDepthBuffer,e,e),r.generateMipMaps&&o.generateMipmap(o.TEXTURE_CUBE_MAP),this._bindTextureDirectly(o.TEXTURE_CUBE_MAP,null),this._bindUnboundFramebuffer(null),i._framebuffer=h,i._generateDepthBuffer=r.generateDepthBuffer,i._generateStencilBuffer=r.generateStencilBuffer,a.width=e,a.height=e,a.isReady=!0,a.isCube=!0,a.samples=1,a.generateMipMaps=r.generateMipMaps,a.samplingMode=r.samplingMode,a.type=r.type,a.format=r.format,this._internalTexturesCache.push(a),i.setTextures(a),i}},4901:(e,t,i)=>{var n=i(3230),s=i(8261);n.B.prototype.createUniformBuffer=function(e){const t=this._gl.createBuffer();if(!t)throw new Error("Unable to create uniform buffer");const i=new s.M(t);return this.bindUniformBuffer(i),e instanceof Float32Array?this._gl.bufferData(this._gl.UNIFORM_BUFFER,e,this._gl.STATIC_DRAW):this._gl.bufferData(this._gl.UNIFORM_BUFFER,new Float32Array(e),this._gl.STATIC_DRAW),this.bindUniformBuffer(null),i.references=1,i},n.B.prototype.createDynamicUniformBuffer=function(e){const t=this._gl.createBuffer();if(!t)throw new Error("Unable to create dynamic uniform buffer");const i=new s.M(t);return this.bindUniformBuffer(i),e instanceof Float32Array?this._gl.bufferData(this._gl.UNIFORM_BUFFER,e,this._gl.DYNAMIC_DRAW):this._gl.bufferData(this._gl.UNIFORM_BUFFER,new Float32Array(e),this._gl.DYNAMIC_DRAW),this.bindUniformBuffer(null),i.references=1,i},n.B.prototype.updateUniformBuffer=function(e,t,i,n){this.bindUniformBuffer(e),void 0===i&&(i=0),void 0===n?t instanceof Float32Array?this._gl.bufferSubData(this._gl.UNIFORM_BUFFER,i,t):this._gl.bufferSubData(this._gl.UNIFORM_BUFFER,i,new Float32Array(t)):t instanceof Float32Array?this._gl.bufferSubData(this._gl.UNIFORM_BUFFER,0,t.subarray(i,i+n)):this._gl.bufferSubData(this._gl.UNIFORM_BUFFER,0,new Float32Array(t).subarray(i,i+n)),this.bindUniformBuffer(null)},n.B.prototype.bindUniformBuffer=function(e){this._gl.bindBuffer(this._gl.UNIFORM_BUFFER,e?e.underlyingResource:null)},n.B.prototype.bindUniformBufferBase=function(e,t,i){this._gl.bindBufferBase(this._gl.UNIFORM_BUFFER,t,e?e.underlyingResource:null)},n.B.prototype.bindUniformBlock=function(e,t,i){const n=e.program,s=this._gl.getUniformBlockIndex(n,t);4294967295!==s&&this._gl.uniformBlockBinding(n,s,i)}},6430:(e,t,i)=>{i.d(t,{Z:()=>s});var n=i(8985);class s{get code(){return this._sourceCode}constructor(e,t=20){this.debug=!1,this._sourceCode=e,this._numMaxIterations=t,this._functionDescr=[],this.inlineToken="#define inline"}processCode(){this.debug&&console.log(`Start inlining process (code size=${this._sourceCode.length})...`),this._collectFunctions(),this._processInlining(this._numMaxIterations),this.debug&&console.log("End of inlining process.")}_collectFunctions(){let e=0;for(;e<this._sourceCode.length;){const t=this._sourceCode.indexOf(this.inlineToken,e);if(t<0)break;const i=this._sourceCode.indexOf("(",t+this.inlineToken.length);if(i<0){this.debug&&console.warn(`Could not find the opening parenthesis after the token. startIndex=${e}`),e=t+this.inlineToken.length;continue}const r=s._RegexpFindFunctionNameAndType.exec(this._sourceCode.substring(t+this.inlineToken.length,i));if(!r){this.debug&&console.warn(`Could not extract the name/type of the function from: ${this._sourceCode.substring(t+this.inlineToken.length,i)}`),e=t+this.inlineToken.length;continue}const[o,a]=[r[3],r[4]],l=(0,n.vt)("(",")",this._sourceCode,i);if(l<0){this.debug&&console.warn(`Could not extract the parameters the function '${a}' (type=${o}). funcParamsStartIndex=${i}`),e=t+this.inlineToken.length;continue}const h=this._sourceCode.substring(i+1,l),c=(0,n.Pm)(this._sourceCode,l+1);if(c===this._sourceCode.length){this.debug&&console.warn(`Could not extract the body of the function '${a}' (type=${o}). funcParamsEndIndex=${l}`),e=t+this.inlineToken.length;continue}const u=(0,n.vt)("{","}",this._sourceCode,c);if(u<0){this.debug&&console.warn(`Could not extract the body of the function '${a}' (type=${o}). funcBodyStartIndex=${c}`),e=t+this.inlineToken.length;continue}const d=this._sourceCode.substring(c,u+1),p=(0,n.Kt)(h).split(","),f=[];for(let e=0;e<p.length;++e){const t=p[e].trim(),i=t.lastIndexOf(" ");i>=0&&f.push(t.substring(i+1))}"void"!==o&&f.push("return"),this._functionDescr.push({name:a,type:o,parameters:f,body:d,callIndex:0}),e=u+1;const _=t>0?this._sourceCode.substring(0,t):"",m=u+1<this._sourceCode.length-1?this._sourceCode.substring(u+1):"";this._sourceCode=_+m,e-=u+1-t}this.debug&&console.log(`Collect functions: ${this._functionDescr.length} functions found. functionDescr=`,this._functionDescr)}_processInlining(e=20){for(;e-- >=0&&this._replaceFunctionCallsByCode(););return this.debug&&console.log(`numMaxIterations is ${e} after inlining process`),e>=0}_replaceFunctionCallsByCode(){let e=!1;for(const t of this._functionDescr){const{name:i,type:s,parameters:r,body:o}=t;let a=0;for(;a<this._sourceCode.length;){const l=this._sourceCode.indexOf(i,a);if(l<0)break;if(0===l||(0,n.uA)(this._sourceCode.charAt(l-1))){a=l+i.length;continue}const h=(0,n.Pm)(this._sourceCode,l+i.length);if(h===this._sourceCode.length||"("!==this._sourceCode.charAt(h)){a=l+i.length;continue}const c=(0,n.vt)("(",")",this._sourceCode,h);if(c<0){this.debug&&console.warn(`Could not extract the parameters of the function call. Function '${i}' (type=${s}). callParamsStartIndex=${h}`),a=l+i.length;continue}const u=this._sourceCode.substring(h+1,c),d=e=>{const t=[];let i=0,s=0;for(;i<e.length;){if("("===e.charAt(i)){const t=(0,n.vt)("(",")",e,i);if(t<0)return null;i=t}else","===e.charAt(i)&&(t.push(e.substring(s,i)),s=i+1);i++}return s<i&&t.push(e.substring(s,i)),t},p=d((0,n.Kt)(u));if(null===p){this.debug&&console.warn(`Invalid function call: can't extract the parameters of the function call. Function '${i}' (type=${s}). callParamsStartIndex=${h}, callParams=`+u),a=l+i.length;continue}const f=[];for(let e=0;e<p.length;++e){const t=p[e].trim();f.push(t)}const _="void"!==s?i+"_"+t.callIndex++:null;if(_&&f.push(_+" ="),f.length!==r.length){this.debug&&console.warn(`Invalid function call: not the same number of parameters for the call than the number expected by the function. Function '${i}' (type=${s}). function parameters=${r}, call parameters=${f}`),a=l+i.length;continue}a=c+1;const m=this._replaceNames(o,r,f);let g=l>0?this._sourceCode.substring(0,l):"";const v=c+1<this._sourceCode.length-1?this._sourceCode.substring(c+1):"";if(_){const e=(0,n.wm)(this._sourceCode,l-1,"\n");g=this._sourceCode.substring(0,e+1);const t=this._sourceCode.substring(e+1,l);this._sourceCode=g+s+" "+_+";\n"+m+"\n"+t+_+v,this.debug&&console.log(`Replace function call by code. Function '${i}' (type=${s}). injectDeclarationIndex=${e}, call parameters=${f}`)}else this._sourceCode=g+m+v,a+=m.length-(c+1-l),this.debug&&console.log(`Replace function call by code. Function '${i}' (type=${s}). functionCallIndex=${l}, call parameters=${f}`);e=!0}}return e}_replaceNames(e,t,i){for(let s=0;s<t.length;++s){const r=new RegExp((0,n.AW)(t[s]),"g"),o=t[s].length,a=i[s];e=e.replace(r,((i,...r)=>{const l=r[0];return(0,n.uA)(e.charAt(l-1))||(0,n.uA)(e.charAt(l+o))?t[s]:a}))}return e}}s._RegexpFindFunctionNameAndType=/((\s+?)(\w+)\s+(\w+)\s*?)$/},8198:(e,t,i)=>{i.d(t,{L:()=>g});class n{constructor(){this.children=[]}isValid(e){return!0}process(e,t){var i,n,s,r,o,a;let l="";if(this.line){let h=this.line;const c=t.processor;if(c){c.lineProcessor&&(h=c.lineProcessor(h,t.isFragment,t.processingContext));const l=null!==(n=null===(i=t.processor)||void 0===i?void 0:i.attributeKeywordName)&&void 0!==n?n:"attribute",u=t.isFragment&&(null===(s=t.processor)||void 0===s?void 0:s.varyingFragmentKeywordName)?null===(r=t.processor)||void 0===r?void 0:r.varyingFragmentKeywordName:!t.isFragment&&(null===(o=t.processor)||void 0===o?void 0:o.varyingVertexKeywordName)?null===(a=t.processor)||void 0===a?void 0:a.varyingVertexKeywordName:"varying";!t.isFragment&&c.attributeProcessor&&this.line.startsWith(l)?h=c.attributeProcessor(this.line,e,t.processingContext):c.varyingProcessor&&this.line.startsWith(u)?h=c.varyingProcessor(this.line,t.isFragment,e,t.processingContext):c.uniformProcessor&&c.uniformRegexp&&c.uniformRegexp.test(this.line)?t.lookForClosingBracketForUniformBuffer||(h=c.uniformProcessor(this.line,t.isFragment,e,t.processingContext)):c.uniformBufferProcessor&&c.uniformBufferRegexp&&c.uniformBufferRegexp.test(this.line)?t.lookForClosingBracketForUniformBuffer||(h=c.uniformBufferProcessor(this.line,t.isFragment,t.processingContext),t.lookForClosingBracketForUniformBuffer=!0):c.textureProcessor&&c.textureRegexp&&c.textureRegexp.test(this.line)?h=c.textureProcessor(this.line,t.isFragment,e,t.processingContext):(c.uniformProcessor||c.uniformBufferProcessor)&&this.line.startsWith("uniform")&&!t.lookForClosingBracketForUniformBuffer&&(/uniform\s+(?:(?:highp)?|(?:lowp)?)\s*(\S+)\s+(\S+)\s*;/.test(this.line)?c.uniformProcessor&&(h=c.uniformProcessor(this.line,t.isFragment,e,t.processingContext)):c.uniformBufferProcessor&&(h=c.uniformBufferProcessor(this.line,t.isFragment,t.processingContext),t.lookForClosingBracketForUniformBuffer=!0)),t.lookForClosingBracketForUniformBuffer&&-1!==this.line.indexOf("}")&&(t.lookForClosingBracketForUniformBuffer=!1,c.endOfUniformBufferProcessor&&(h=c.endOfUniformBufferProcessor(this.line,t.isFragment,t.processingContext)))}l+=h+"\r\n"}return this.children.forEach((i=>{l+=i.process(e,t)})),this.additionalDefineKey&&(e[this.additionalDefineKey]=this.additionalDefineValue||"true"),l}}class s{constructor(){this._lines=[]}get currentLine(){return this._lines[this.lineIndex]}get canRead(){return this.lineIndex<this._lines.length-1}set lines(e){this._lines.length=0;for(const t of e){if("#"===t[0]){this._lines.push(t);continue}if(t.trim().startsWith("//")){this._lines.push(t);continue}const e=t.split(";");for(let t=0;t<e.length;t++){let i=e[t];i=i.trim(),i&&this._lines.push(i+(t!==e.length-1?";":""))}}}}class r extends n{process(e,t){for(let i=0;i<this.children.length;i++){const n=this.children[i];if(n.isValid(e))return n.process(e,t)}return""}}class o extends n{isValid(e){return this.testExpression.isTrue(e)}}class a{isTrue(e){return!0}static postfixToInfix(e){const t=[];for(const i of e)if(void 0===a._OperatorPriority[i])t.push(i);else{const e=t[t.length-1],n=t[t.length-2];t.length-=2,t.push(`(${n}${i}${e})`)}return t[t.length-1]}static infixToPostfix(e){const t=[];let i=-1;const n=()=>{h=h.trim(),""!==h&&(t.push(h),h="")},s=e=>{i<a._Stack.length-1&&(a._Stack[++i]=e)},r=()=>a._Stack[i],o=()=>-1===i?"!!INVALID EXPRESSION!!":a._Stack[i--];let l=0,h="";for(;l<e.length;){const c=e.charAt(l),u=l<e.length-1?e.substr(l,2):"";if("("===c)h="",s(c);else if(")"===c){for(n();-1!==i&&"("!==r();)t.push(o());o()}else if(a._OperatorPriority[u]>1){for(n();-1!==i&&a._OperatorPriority[r()]>=a._OperatorPriority[u];)t.push(o());s(u),l++}else h+=c;l++}for(n();-1!==i;)"("===r()?o():t.push(o());return t}}a._OperatorPriority={")":0,"(":1,"||":2,"&&":3},a._Stack=["","","","","","","","","","","","","","","","","","","",""];class l extends a{constructor(e,t=!1){super(),this.define=e,this.not=t}isTrue(e){let t=void 0!==e[this.define];return this.not&&(t=!t),t}}class h extends a{isTrue(e){return this.leftOperand.isTrue(e)||this.rightOperand.isTrue(e)}}class c extends a{isTrue(e){return this.leftOperand.isTrue(e)&&this.rightOperand.isTrue(e)}}class u extends a{constructor(e,t,i){super(),this.define=e,this.operand=t,this.testValue=i}isTrue(e){let t=e[this.define];void 0===t&&(t=this.define);let i=!1;const n=parseInt(t),s=parseInt(this.testValue);switch(this.operand){case">":i=n>s;break;case"<":i=n<s;break;case"<=":i=n<=s;break;case">=":i=n>=s;break;case"==":i=n===s}return i}}var d=i(4934),p=i(9131);const f=/defined\s*?\((.+?)\)/g,_=/defined\s*?\[(.+?)\]/g,m=/#include\s?<(.+)>(\((.*)\))*(\[(.*)\])*/g;class g{static Initialize(e){e.processor&&e.processor.initializeShaders&&e.processor.initializeShaders(e.processingContext)}static Process(e,t,i,n){var s;(null===(s=t.processor)||void 0===s?void 0:s.preProcessShaderCode)&&(e=t.processor.preProcessShaderCode(e,t.isFragment)),this._ProcessIncludes(e,t,(e=>{t.processCodeAfterIncludes&&(e=t.processCodeAfterIncludes(t.isFragment?"fragment":"vertex",e));const s=this._ProcessShaderConversion(e,t,n);i(s,e)}))}static PreProcess(e,t,i,n){var s;(null===(s=t.processor)||void 0===s?void 0:s.preProcessShaderCode)&&(e=t.processor.preProcessShaderCode(e,t.isFragment)),this._ProcessIncludes(e,t,(e=>{t.processCodeAfterIncludes&&(e=t.processCodeAfterIncludes(t.isFragment?"fragment":"vertex",e));const s=this._ApplyPreProcessing(e,t,n);i(s,e)}))}static Finalize(e,t,i){return i.processor&&i.processor.finalizeShaders?i.processor.finalizeShaders(e,t,i.processingContext):{vertexCode:e,fragmentCode:t}}static _ProcessPrecision(e,t){var i;if(null===(i=t.processor)||void 0===i?void 0:i.noPrecision)return e;const n=t.shouldUseHighPrecisionShader;return-1===e.indexOf("precision highp float")?e=n?"precision highp float;\n"+e:"precision mediump float;\n"+e:n||(e=e.replace("precision highp float","precision mediump float")),e}static _ExtractOperation(e){const t=/defined\((.+)\)/.exec(e);if(t&&t.length)return new l(t[1].trim(),"!"===e[0]);const i=["==",">=","<=","<",">"];let n="",s=0;for(n of i)if(s=e.indexOf(n),s>-1)break;if(-1===s)return new l(e);const r=e.substring(0,s).trim(),o=e.substring(s+n.length).trim();return new u(r,n,o)}static _BuildSubExpression(e){e=e.replace(f,"defined[$1]");const t=a.infixToPostfix(e),i=[];for(const e of t)if("||"!==e&&"&&"!==e)i.push(e);else if(i.length>=2){let t=i[i.length-1],n=i[i.length-2];i.length-=2;const s="&&"==e?new c:new h;"string"==typeof t&&(t=t.replace(_,"defined($1)")),"string"==typeof n&&(n=n.replace(_,"defined($1)")),s.leftOperand="string"==typeof n?this._ExtractOperation(n):n,s.rightOperand="string"==typeof t?this._ExtractOperation(t):t,i.push(s)}let n=i[i.length-1];return"string"==typeof n&&(n=n.replace(_,"defined($1)")),"string"==typeof n?this._ExtractOperation(n):n}static _BuildExpression(e,t){const i=new o,n=e.substring(0,t);let s=e.substring(t);return s=s.substring(0,(s.indexOf("//")+1||s.length+1)-1).trim(),i.testExpression="#ifdef"===n?new l(s):"#ifndef"===n?new l(s,!0):this._BuildSubExpression(s),i}static _MoveCursorWithinIf(e,t,i){let s=e.currentLine;for(;this._MoveCursor(e,i);){s=e.currentLine;const r=s.substring(0,5).toLowerCase();if("#else"===r){const i=new n;return t.children.push(i),void this._MoveCursor(e,i)}if("#elif"===r){const e=this._BuildExpression(s,5);t.children.push(e),i=e}}}static _MoveCursor(e,t){for(;e.canRead;){e.lineIndex++;const i=e.currentLine,s=/(#ifdef)|(#else)|(#elif)|(#endif)|(#ifndef)|(#if)/.exec(i);if(s&&s.length)switch(s[0]){case"#ifdef":{const n=new r;t.children.push(n);const s=this._BuildExpression(i,6);n.children.push(s),this._MoveCursorWithinIf(e,n,s);break}case"#else":case"#elif":return!0;case"#endif":return!1;case"#ifndef":{const n=new r;t.children.push(n);const s=this._BuildExpression(i,7);n.children.push(s),this._MoveCursorWithinIf(e,n,s);break}case"#if":{const n=new r,s=this._BuildExpression(i,3);t.children.push(n),n.children.push(s),this._MoveCursorWithinIf(e,n,s);break}}else{const e=new n;if(e.line=i,t.children.push(e),"#"===i[0]&&"d"===i[1]){const t=i.replace(";","").split(" ");e.additionalDefineKey=t[1],3===t.length&&(e.additionalDefineValue=t[2])}}}return!1}static _EvaluatePreProcessors(e,t,i){const r=new n,o=new s;return o.lineIndex=-1,o.lines=e.split("\n"),this._MoveCursor(o,r),r.process(t,i)}static _PreparePreProcessors(e,t){var i;const n=e.defines,s={};for(const e of n){const t=e.replace("#define","").replace(";","").trim().split(" ");s[t[0]]=t.length>1?t[1]:""}return(null===(i=e.processor)||void 0===i?void 0:i.shaderLanguage)===p.x.GLSL&&(s.GL_ES="true"),s.__VERSION__=e.version,s[e.platformName]="true",t._getGlobalDefines(s),s}static _ProcessShaderConversion(e,t,i){let n=this._ProcessPrecision(e,t);if(!t.processor)return n;if(t.processor.shaderLanguage===p.x.GLSL&&-1!==n.indexOf("#version 3")&&(n=n.replace("#version 300 es",""),!t.processor.parseGLES3))return n;const s=t.defines,r=this._PreparePreProcessors(t,i);return t.processor.preProcessor&&(n=t.processor.preProcessor(n,s,t.isFragment,t.processingContext)),n=this._EvaluatePreProcessors(n,r,t),t.processor.postProcessor&&(n=t.processor.postProcessor(n,s,t.isFragment,t.processingContext,i)),i._features.needShaderCodeInlining&&(n=i.inlineShaderCode(n)),n}static _ApplyPreProcessing(e,t,i){var n,s;let r=e;const o=t.defines,a=this._PreparePreProcessors(t,i);return(null===(n=t.processor)||void 0===n?void 0:n.preProcessor)&&(r=t.processor.preProcessor(r,o,t.isFragment,t.processingContext)),r=this._EvaluatePreProcessors(r,a,t),(null===(s=t.processor)||void 0===s?void 0:s.postProcessor)&&(r=t.processor.postProcessor(r,o,t.isFragment,t.processingContext,i)),i._features.needShaderCodeInlining&&(r=i.inlineShaderCode(r)),r}static _ProcessIncludes(e,t,i){let n=m.exec(e),s=new String(e),r=!1;for(;null!=n;){let o=n[1];if(-1!==o.indexOf("__decl__")&&(o=o.replace(/__decl__/,""),t.supportsUniformBuffers&&(o=o.replace(/Vertex/,"Ubo"),o=o.replace(/Fragment/,"Ubo")),o+="Declaration"),!t.includesShadersStore[o]){const e=t.shadersRepository+"ShadersInclude/"+o+".fx";return void g._FileToolsLoadFile(e,(e=>{t.includesShadersStore[o]=e,this._ProcessIncludes(s,t,i)}))}{let e=t.includesShadersStore[o];if(n[2]){const t=n[3].split(",");for(let i=0;i<t.length;i+=2){const n=new RegExp(t[i],"g"),s=t[i+1];e=e.replace(n,s)}}if(n[4]){const i=n[5];if(-1!==i.indexOf("..")){const n=i.split(".."),s=parseInt(n[0]);let r=parseInt(n[1]),o=e.slice(0);e="",isNaN(r)&&(r=t.indexParameters[n[1]]);for(let i=s;i<r;i++)t.supportsUniformBuffers||(o=o.replace(/light\{X\}.(\w*)/g,((e,t)=>t+"{X}"))),e+=o.replace(/\{X\}/g,i.toString())+"\n"}else t.supportsUniformBuffers||(e=e.replace(/light\{X\}.(\w*)/g,((e,t)=>t+"{X}"))),e=e.replace(/\{X\}/g,i)}s=s.replace(n[0],e),r=r||e.indexOf("#include<")>=0||e.indexOf("#include <")>=0}n=m.exec(e)}r?this._ProcessIncludes(s.toString(),t,i):i(s)}static _FileToolsLoadFile(e,t,i,n,s,r){throw(0,d.S)("FileTools")}}},4001:(e,t,i)=>{i.d(t,{C:()=>s});var n=i(9131);class s{constructor(){this.shaderLanguage=n.x.GLSL}attributeProcessor(e){return e.replace("attribute","in")}varyingProcessor(e,t){return e.replace("varying",t?"in":"out")}postProcessor(e,t,i){const n=-1!==e.search(/#extension.+GL_EXT_draw_buffers.+require/);if(e=(e=e.replace(/#extension.+(GL_OVR_multiview2|GL_OES_standard_derivatives|GL_EXT_shader_texture_lod|GL_EXT_frag_depth|GL_EXT_draw_buffers).+(enable|require)/g,"")).replace(/texture2D\s*\(/g,"texture("),i)e=(e=(e=(e=(e=(e=(e=e.replace(/texture2DLodEXT\s*\(/g,"textureLod(")).replace(/textureCubeLodEXT\s*\(/g,"textureLod(")).replace(/textureCube\s*\(/g,"texture(")).replace(/gl_FragDepthEXT/g,"gl_FragDepth")).replace(/gl_FragColor/g,"glFragColor")).replace(/gl_FragData/g,"glFragData")).replace(/void\s+?main\s*\(/g,(n?"":"layout(location = 0) out vec4 glFragColor;\n")+"void main(");else if(-1!==t.indexOf("#define MULTIVIEW"))return"#extension GL_OVR_multiview2 : require\nlayout (num_views = 2) in;\n"+e;return e}}},2200:(e,t,i)=>{i.d(t,{B:()=>n});class n{get underlyingResource(){return this._webGLTexture}constructor(e=null,t){if(this._MSAARenderBuffers=null,this._context=t,!e&&!(e=t.createTexture()))throw new Error("Unable to create webGL texture");this.set(e)}setUsage(){}set(e){this._webGLTexture=e}reset(){this._webGLTexture=null,this._MSAARenderBuffers=null}addMSAARenderBuffer(e){this._MSAARenderBuffers||(this._MSAARenderBuffers=[]),this._MSAARenderBuffers.push(e)}releaseMSAARenderBuffers(){if(this._MSAARenderBuffers){for(const e of this._MSAARenderBuffers)this._context.deleteRenderbuffer(e);this._MSAARenderBuffers=null}}release(){this.releaseMSAARenderBuffers(),this._webGLTexture&&this._context.deleteTexture(this._webGLTexture),this.reset()}}},4238:(e,t,i)=>{i.d(t,{y:()=>n});class n{constructor(){this._valueCache={},this.vertexCompilationError=null,this.fragmentCompilationError=null,this.programLinkError=null,this.programValidationError=null}get isAsync(){return this.isParallelCompiled}get isReady(){return!!this.program&&(!this.isParallelCompiled||this.engine._isRenderingStateCompiled(this))}_handlesSpectorRebuildCallback(e){e&&this.program&&e(this.program)}_fillEffectInformation(e,t,i,n,s,r,o,a){const l=this.engine;if(l.supportsUniformBuffers)for(const i in t)e.bindUniformBlock(i,t[i]);let h;for(this.engine.getUniforms(this,i).forEach(((e,t)=>{n[i[t]]=e})),this._uniforms=n,h=0;h<s.length;h++)null==e.getUniform(s[h])&&(s.splice(h,1),h--);s.forEach(((e,t)=>{r[e]=t}));for(const e of l.getAttributes(this,o))a.push(e)}dispose(){this._uniforms={}}_cacheMatrix(e,t){const i=this._valueCache[e],n=t.updateFlag;return(void 0===i||i!==n)&&(this._valueCache[e]=n,!0)}_cacheFloat2(e,t,i){let n=this._valueCache[e];if(!n||2!==n.length)return n=[t,i],this._valueCache[e]=n,!0;let s=!1;return n[0]!==t&&(n[0]=t,s=!0),n[1]!==i&&(n[1]=i,s=!0),s}_cacheFloat3(e,t,i,n){let s=this._valueCache[e];if(!s||3!==s.length)return s=[t,i,n],this._valueCache[e]=s,!0;let r=!1;return s[0]!==t&&(s[0]=t,r=!0),s[1]!==i&&(s[1]=i,r=!0),s[2]!==n&&(s[2]=n,r=!0),r}_cacheFloat4(e,t,i,n,s){let r=this._valueCache[e];if(!r||4!==r.length)return r=[t,i,n,s],this._valueCache[e]=r,!0;let o=!1;return r[0]!==t&&(r[0]=t,o=!0),r[1]!==i&&(r[1]=i,o=!0),r[2]!==n&&(r[2]=n,o=!0),r[3]!==s&&(r[3]=s,o=!0),o}setInt(e,t){const i=this._valueCache[e];void 0!==i&&i===t||this.engine.setInt(this._uniforms[e],t)&&(this._valueCache[e]=t)}setInt2(e,t,i){this._cacheFloat2(e,t,i)&&(this.engine.setInt2(this._uniforms[e],t,i)||(this._valueCache[e]=null))}setInt3(e,t,i,n){this._cacheFloat3(e,t,i,n)&&(this.engine.setInt3(this._uniforms[e],t,i,n)||(this._valueCache[e]=null))}setInt4(e,t,i,n,s){this._cacheFloat4(e,t,i,n,s)&&(this.engine.setInt4(this._uniforms[e],t,i,n,s)||(this._valueCache[e]=null))}setIntArray(e,t){this._valueCache[e]=null,this.engine.setIntArray(this._uniforms[e],t)}setIntArray2(e,t){this._valueCache[e]=null,this.engine.setIntArray2(this._uniforms[e],t)}setIntArray3(e,t){this._valueCache[e]=null,this.engine.setIntArray3(this._uniforms[e],t)}setIntArray4(e,t){this._valueCache[e]=null,this.engine.setIntArray4(this._uniforms[e],t)}setUInt(e,t){const i=this._valueCache[e];void 0!==i&&i===t||this.engine.setUInt(this._uniforms[e],t)&&(this._valueCache[e]=t)}setUInt2(e,t,i){this._cacheFloat2(e,t,i)&&(this.engine.setUInt2(this._uniforms[e],t,i)||(this._valueCache[e]=null))}setUInt3(e,t,i,n){this._cacheFloat3(e,t,i,n)&&(this.engine.setUInt3(this._uniforms[e],t,i,n)||(this._valueCache[e]=null))}setUInt4(e,t,i,n,s){this._cacheFloat4(e,t,i,n,s)&&(this.engine.setUInt4(this._uniforms[e],t,i,n,s)||(this._valueCache[e]=null))}setUIntArray(e,t){this._valueCache[e]=null,this.engine.setUIntArray(this._uniforms[e],t)}setUIntArray2(e,t){this._valueCache[e]=null,this.engine.setUIntArray2(this._uniforms[e],t)}setUIntArray3(e,t){this._valueCache[e]=null,this.engine.setUIntArray3(this._uniforms[e],t)}setUIntArray4(e,t){this._valueCache[e]=null,this.engine.setUIntArray4(this._uniforms[e],t)}setArray(e,t){this._valueCache[e]=null,this.engine.setArray(this._uniforms[e],t)}setArray2(e,t){this._valueCache[e]=null,this.engine.setArray2(this._uniforms[e],t)}setArray3(e,t){this._valueCache[e]=null,this.engine.setArray3(this._uniforms[e],t)}setArray4(e,t){this._valueCache[e]=null,this.engine.setArray4(this._uniforms[e],t)}setMatrices(e,t){t&&(this._valueCache[e]=null,this.engine.setMatrices(this._uniforms[e],t))}setMatrix(e,t){this._cacheMatrix(e,t)&&(this.engine.setMatrices(this._uniforms[e],t.toArray())||(this._valueCache[e]=null))}setMatrix3x3(e,t){this._valueCache[e]=null,this.engine.setMatrix3x3(this._uniforms[e],t)}setMatrix2x2(e,t){this._valueCache[e]=null,this.engine.setMatrix2x2(this._uniforms[e],t)}setFloat(e,t){const i=this._valueCache[e];void 0!==i&&i===t||this.engine.setFloat(this._uniforms[e],t)&&(this._valueCache[e]=t)}setVector2(e,t){this._cacheFloat2(e,t.x,t.y)&&(this.engine.setFloat2(this._uniforms[e],t.x,t.y)||(this._valueCache[e]=null))}setFloat2(e,t,i){this._cacheFloat2(e,t,i)&&(this.engine.setFloat2(this._uniforms[e],t,i)||(this._valueCache[e]=null))}setVector3(e,t){this._cacheFloat3(e,t.x,t.y,t.z)&&(this.engine.setFloat3(this._uniforms[e],t.x,t.y,t.z)||(this._valueCache[e]=null))}setFloat3(e,t,i,n){this._cacheFloat3(e,t,i,n)&&(this.engine.setFloat3(this._uniforms[e],t,i,n)||(this._valueCache[e]=null))}setVector4(e,t){this._cacheFloat4(e,t.x,t.y,t.z,t.w)&&(this.engine.setFloat4(this._uniforms[e],t.x,t.y,t.z,t.w)||(this._valueCache[e]=null))}setQuaternion(e,t){this._cacheFloat4(e,t.x,t.y,t.z,t.w)&&(this.engine.setFloat4(this._uniforms[e],t.x,t.y,t.z,t.w)||(this._valueCache[e]=null))}setFloat4(e,t,i,n,s){this._cacheFloat4(e,t,i,n,s)&&(this.engine.setFloat4(this._uniforms[e],t,i,n,s)||(this._valueCache[e]=null))}setColor3(e,t){this._cacheFloat3(e,t.r,t.g,t.b)&&(this.engine.setFloat3(this._uniforms[e],t.r,t.g,t.b)||(this._valueCache[e]=null))}setColor4(e,t,i){this._cacheFloat4(e,t.r,t.g,t.b,i)&&(this.engine.setFloat4(this._uniforms[e],t.r,t.g,t.b,i)||(this._valueCache[e]=null))}setDirectColor4(e,t){this._cacheFloat4(e,t.r,t.g,t.b,t.a)&&(this.engine.setFloat4(this._uniforms[e],t.r,t.g,t.b,t.a)||(this._valueCache[e]=null))}_getVertexShaderCode(){return this.vertexShader?this.engine._getShaderSource(this.vertexShader):null}_getFragmentShaderCode(){return this.fragmentShader?this.engine._getShaderSource(this.fragmentShader):null}}},7458:(e,t,i)=>{i.d(t,{g:()=>n});class n{}n.ALPHA_DISABLE=0,n.ALPHA_ADD=1,n.ALPHA_COMBINE=2,n.ALPHA_SUBTRACT=3,n.ALPHA_MULTIPLY=4,n.ALPHA_MAXIMIZED=5,n.ALPHA_ONEONE=6,n.ALPHA_PREMULTIPLIED=7,n.ALPHA_PREMULTIPLIED_PORTERDUFF=8,n.ALPHA_INTERPOLATE=9,n.ALPHA_SCREENMODE=10,n.ALPHA_ONEONE_ONEONE=11,n.ALPHA_ALPHATOCOLOR=12,n.ALPHA_REVERSEONEMINUS=13,n.ALPHA_SRC_DSTONEMINUSSRCALPHA=14,n.ALPHA_ONEONE_ONEZERO=15,n.ALPHA_EXCLUSION=16,n.ALPHA_LAYER_ACCUMULATE=17,n.ALPHA_EQUATION_ADD=0,n.ALPHA_EQUATION_SUBSTRACT=1,n.ALPHA_EQUATION_REVERSE_SUBTRACT=2,n.ALPHA_EQUATION_MAX=3,n.ALPHA_EQUATION_MIN=4,n.ALPHA_EQUATION_DARKEN=5,n.DELAYLOADSTATE_NONE=0,n.DELAYLOADSTATE_LOADED=1,n.DELAYLOADSTATE_LOADING=2,n.DELAYLOADSTATE_NOTLOADED=4,n.NEVER=512,n.ALWAYS=519,n.LESS=513,n.EQUAL=514,n.LEQUAL=515,n.GREATER=516,n.GEQUAL=518,n.NOTEQUAL=517,n.KEEP=7680,n.ZERO=0,n.REPLACE=7681,n.INCR=7682,n.DECR=7683,n.INVERT=5386,n.INCR_WRAP=34055,n.DECR_WRAP=34056,n.TEXTURE_CLAMP_ADDRESSMODE=0,n.TEXTURE_WRAP_ADDRESSMODE=1,n.TEXTURE_MIRROR_ADDRESSMODE=2,n.TEXTURE_CREATIONFLAG_STORAGE=1,n.TEXTUREFORMAT_ALPHA=0,n.TEXTUREFORMAT_LUMINANCE=1,n.TEXTUREFORMAT_LUMINANCE_ALPHA=2,n.TEXTUREFORMAT_RGB=4,n.TEXTUREFORMAT_RGBA=5,n.TEXTUREFORMAT_RED=6,n.TEXTUREFORMAT_R=6,n.TEXTUREFORMAT_RG=7,n.TEXTUREFORMAT_RED_INTEGER=8,n.TEXTUREFORMAT_R_INTEGER=8,n.TEXTUREFORMAT_RG_INTEGER=9,n.TEXTUREFORMAT_RGB_INTEGER=10,n.TEXTUREFORMAT_RGBA_INTEGER=11,n.TEXTUREFORMAT_BGRA=12,n.TEXTUREFORMAT_DEPTH24_STENCIL8=13,n.TEXTUREFORMAT_DEPTH32_FLOAT=14,n.TEXTUREFORMAT_DEPTH16=15,n.TEXTUREFORMAT_DEPTH24=16,n.TEXTUREFORMAT_DEPTH24UNORM_STENCIL8=17,n.TEXTUREFORMAT_DEPTH32FLOAT_STENCIL8=18,n.TEXTUREFORMAT_STENCIL8=19,n.TEXTUREFORMAT_COMPRESSED_RGBA_BPTC_UNORM=36492,n.TEXTUREFORMAT_COMPRESSED_SRGB_ALPHA_BPTC_UNORM=36493,n.TEXTUREFORMAT_COMPRESSED_RGB_BPTC_UNSIGNED_FLOAT=36495,n.TEXTUREFORMAT_COMPRESSED_RGB_BPTC_SIGNED_FLOAT=36494,n.TEXTUREFORMAT_COMPRESSED_RGBA_S3TC_DXT5=33779,n.TEXTUREFORMAT_COMPRESSED_SRGB_ALPHA_S3TC_DXT5_EXT=35919,n.TEXTUREFORMAT_COMPRESSED_RGBA_S3TC_DXT3=33778,n.TEXTUREFORMAT_COMPRESSED_SRGB_ALPHA_S3TC_DXT3_EXT=35918,n.TEXTUREFORMAT_COMPRESSED_RGBA_S3TC_DXT1=33777,n.TEXTUREFORMAT_COMPRESSED_RGB_S3TC_DXT1=33776,n.TEXTUREFORMAT_COMPRESSED_SRGB_ALPHA_S3TC_DXT1_EXT=35917,n.TEXTUREFORMAT_COMPRESSED_SRGB_S3TC_DXT1_EXT=35916,n.TEXTUREFORMAT_COMPRESSED_RGBA_ASTC_4x4=37808,n.TEXTUREFORMAT_COMPRESSED_SRGB8_ALPHA8_ASTC_4x4_KHR=37840,n.TEXTUREFORMAT_COMPRESSED_RGB_ETC1_WEBGL=36196,n.TEXTUREFORMAT_COMPRESSED_RGB8_ETC2=37492,n.TEXTUREFORMAT_COMPRESSED_SRGB8_ETC2=37493,n.TEXTUREFORMAT_COMPRESSED_RGB8_PUNCHTHROUGH_ALPHA1_ETC2=37494,n.TEXTUREFORMAT_COMPRESSED_SRGB8_PUNCHTHROUGH_ALPHA1_ETC2=37495,n.TEXTUREFORMAT_COMPRESSED_RGBA8_ETC2_EAC=37496,n.TEXTUREFORMAT_COMPRESSED_SRGB8_ALPHA8_ETC2_EAC=37497,n.TEXTURETYPE_UNSIGNED_BYTE=0,n.TEXTURETYPE_UNSIGNED_INT=0,n.TEXTURETYPE_FLOAT=1,n.TEXTURETYPE_HALF_FLOAT=2,n.TEXTURETYPE_BYTE=3,n.TEXTURETYPE_SHORT=4,n.TEXTURETYPE_UNSIGNED_SHORT=5,n.TEXTURETYPE_INT=6,n.TEXTURETYPE_UNSIGNED_INTEGER=7,n.TEXTURETYPE_UNSIGNED_SHORT_4_4_4_4=8,n.TEXTURETYPE_UNSIGNED_SHORT_5_5_5_1=9,n.TEXTURETYPE_UNSIGNED_SHORT_5_6_5=10,n.TEXTURETYPE_UNSIGNED_INT_2_10_10_10_REV=11,n.TEXTURETYPE_UNSIGNED_INT_24_8=12,n.TEXTURETYPE_UNSIGNED_INT_10F_11F_11F_REV=13,n.TEXTURETYPE_UNSIGNED_INT_5_9_9_9_REV=14,n.TEXTURETYPE_FLOAT_32_UNSIGNED_INT_24_8_REV=15,n.TEXTURETYPE_UNDEFINED=16,n.TEXTURE_2D=3553,n.TEXTURE_2D_ARRAY=35866,n.TEXTURE_CUBE_MAP=34067,n.TEXTURE_CUBE_MAP_ARRAY=3735928559,n.TEXTURE_3D=32879,n.TEXTURE_NEAREST_SAMPLINGMODE=1,n.TEXTURE_NEAREST_NEAREST=1,n.TEXTURE_BILINEAR_SAMPLINGMODE=2,n.TEXTURE_LINEAR_LINEAR=2,n.TEXTURE_TRILINEAR_SAMPLINGMODE=3,n.TEXTURE_LINEAR_LINEAR_MIPLINEAR=3,n.TEXTURE_NEAREST_NEAREST_MIPNEAREST=4,n.TEXTURE_NEAREST_LINEAR_MIPNEAREST=5,n.TEXTURE_NEAREST_LINEAR_MIPLINEAR=6,n.TEXTURE_NEAREST_LINEAR=7,n.TEXTURE_NEAREST_NEAREST_MIPLINEAR=8,n.TEXTURE_LINEAR_NEAREST_MIPNEAREST=9,n.TEXTURE_LINEAR_NEAREST_MIPLINEAR=10,n.TEXTURE_LINEAR_LINEAR_MIPNEAREST=11,n.TEXTURE_LINEAR_NEAREST=12,n.TEXTURE_EXPLICIT_MODE=0,n.TEXTURE_SPHERICAL_MODE=1,n.TEXTURE_PLANAR_MODE=2,n.TEXTURE_CUBIC_MODE=3,n.TEXTURE_PROJECTION_MODE=4,n.TEXTURE_SKYBOX_MODE=5,n.TEXTURE_INVCUBIC_MODE=6,n.TEXTURE_EQUIRECTANGULAR_MODE=7,n.TEXTURE_FIXED_EQUIRECTANGULAR_MODE=8,n.TEXTURE_FIXED_EQUIRECTANGULAR_MIRRORED_MODE=9,n.TEXTURE_FILTERING_QUALITY_OFFLINE=4096,n.TEXTURE_FILTERING_QUALITY_HIGH=64,n.TEXTURE_FILTERING_QUALITY_MEDIUM=16,n.TEXTURE_FILTERING_QUALITY_LOW=8,n.SCALEMODE_FLOOR=1,n.SCALEMODE_NEAREST=2,n.SCALEMODE_CEILING=3,n.MATERIAL_TextureDirtyFlag=1,n.MATERIAL_LightDirtyFlag=2,n.MATERIAL_FresnelDirtyFlag=4,n.MATERIAL_AttributesDirtyFlag=8,n.MATERIAL_MiscDirtyFlag=16,n.MATERIAL_PrePassDirtyFlag=32,n.MATERIAL_AllDirtyFlag=63,n.MATERIAL_TriangleFillMode=0,n.MATERIAL_WireFrameFillMode=1,n.MATERIAL_PointFillMode=2,n.MATERIAL_PointListDrawMode=3,n.MATERIAL_LineListDrawMode=4,n.MATERIAL_LineLoopDrawMode=5,n.MATERIAL_LineStripDrawMode=6,n.MATERIAL_TriangleStripDrawMode=7,n.MATERIAL_TriangleFanDrawMode=8,n.MATERIAL_ClockWiseSideOrientation=0,n.MATERIAL_CounterClockWiseSideOrientation=1,n.ACTION_NothingTrigger=0,n.ACTION_OnPickTrigger=1,n.ACTION_OnLeftPickTrigger=2,n.ACTION_OnRightPickTrigger=3,n.ACTION_OnCenterPickTrigger=4,n.ACTION_OnPickDownTrigger=5,n.ACTION_OnDoublePickTrigger=6,n.ACTION_OnPickUpTrigger=7,n.ACTION_OnPickOutTrigger=16,n.ACTION_OnLongPressTrigger=8,n.ACTION_OnPointerOverTrigger=9,n.ACTION_OnPointerOutTrigger=10,n.ACTION_OnEveryFrameTrigger=11,n.ACTION_OnIntersectionEnterTrigger=12,n.ACTION_OnIntersectionExitTrigger=13,n.ACTION_OnKeyDownTrigger=14,n.ACTION_OnKeyUpTrigger=15,n.PARTICLES_BILLBOARDMODE_Y=2,n.PARTICLES_BILLBOARDMODE_ALL=7,n.PARTICLES_BILLBOARDMODE_STRETCHED=8,n.PARTICLES_BILLBOARDMODE_STRETCHED_LOCAL=9,n.MESHES_CULLINGSTRATEGY_STANDARD=0,n.MESHES_CULLINGSTRATEGY_BOUNDINGSPHERE_ONLY=1,n.MESHES_CULLINGSTRATEGY_OPTIMISTIC_INCLUSION=2,n.MESHES_CULLINGSTRATEGY_OPTIMISTIC_INCLUSION_THEN_BSPHERE_ONLY=3,n.SCENELOADER_NO_LOGGING=0,n.SCENELOADER_MINIMAL_LOGGING=1,n.SCENELOADER_SUMMARY_LOGGING=2,n.SCENELOADER_DETAILED_LOGGING=3,n.PREPASS_IRRADIANCE_TEXTURE_TYPE=0,n.PREPASS_POSITION_TEXTURE_TYPE=1,n.PREPASS_VELOCITY_TEXTURE_TYPE=2,n.PREPASS_REFLECTIVITY_TEXTURE_TYPE=3,n.PREPASS_COLOR_TEXTURE_TYPE=4,n.PREPASS_DEPTH_TEXTURE_TYPE=5,n.PREPASS_NORMAL_TEXTURE_TYPE=6,n.PREPASS_ALBEDO_SQRT_TEXTURE_TYPE=7,n.BUFFER_CREATIONFLAG_READ=1,n.BUFFER_CREATIONFLAG_WRITE=2,n.BUFFER_CREATIONFLAG_READWRITE=3,n.BUFFER_CREATIONFLAG_UNIFORM=4,n.BUFFER_CREATIONFLAG_VERTEX=8,n.BUFFER_CREATIONFLAG_INDEX=16,n.BUFFER_CREATIONFLAG_STORAGE=32,n.RENDERPASS_MAIN=0,n.INPUT_ALT_KEY=18,n.INPUT_CTRL_KEY=17,n.INPUT_META_KEY1=91,n.INPUT_META_KEY2=92,n.INPUT_META_KEY3=93,n.INPUT_SHIFT_KEY=16,n.SNAPSHOTRENDERING_STANDARD=0,n.SNAPSHOTRENDERING_FAST=1,n.PERSPECTIVE_CAMERA=0,n.ORTHOGRAPHIC_CAMERA=1,n.FOVMODE_VERTICAL_FIXED=0,n.FOVMODE_HORIZONTAL_FIXED=1,n.RIG_MODE_NONE=0,n.RIG_MODE_STEREOSCOPIC_ANAGLYPH=10,n.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL=11,n.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_CROSSEYED=12,n.RIG_MODE_STEREOSCOPIC_OVERUNDER=13,n.RIG_MODE_STEREOSCOPIC_INTERLACED=14,n.RIG_MODE_VR=20,n.RIG_MODE_WEBVR=21,n.RIG_MODE_CUSTOM=22,n.MAX_SUPPORTED_UV_SETS=6,n.GL_ALPHA_EQUATION_ADD=32774,n.GL_ALPHA_EQUATION_MIN=32775,n.GL_ALPHA_EQUATION_MAX=32776,n.GL_ALPHA_EQUATION_SUBTRACT=32778,n.GL_ALPHA_EQUATION_REVERSE_SUBTRACT=32779,n.GL_ALPHA_FUNCTION_SRC=768,n.GL_ALPHA_FUNCTION_ONE_MINUS_SRC_COLOR=769,n.GL_ALPHA_FUNCTION_SRC_ALPHA=770,n.GL_ALPHA_FUNCTION_ONE_MINUS_SRC_ALPHA=771,n.GL_ALPHA_FUNCTION_DST_ALPHA=772,n.GL_ALPHA_FUNCTION_ONE_MINUS_DST_ALPHA=773,n.GL_ALPHA_FUNCTION_DST_COLOR=774,n.GL_ALPHA_FUNCTION_ONE_MINUS_DST_COLOR=775,n.GL_ALPHA_FUNCTION_SRC_ALPHA_SATURATED=776,n.GL_ALPHA_FUNCTION_CONSTANT_COLOR=32769,n.GL_ALPHA_FUNCTION_ONE_MINUS_CONSTANT_COLOR=32770,n.GL_ALPHA_FUNCTION_CONSTANT_ALPHA=32771,n.GL_ALPHA_FUNCTION_ONE_MINUS_CONSTANT_ALPHA=32772,n.SnippetUrl="https://snippet.babylonjs.com"},7814:(e,t,i)=>{i.d(t,{D:()=>f});var n=i(5757),s=i(6202),r=i(6797),o=i(1431),a=i(4934),l=i(3230),h=i(4757),c=i(8215),u=i(8261),d=i(2722),p=i(2200);i(9347),i(9075),i(3742);class f extends l.B{static get NpmPackage(){return l.B.NpmPackage}static get Version(){return l.B.Version}static get Instances(){return o.l.Instances}static get LastCreatedEngine(){return o.l.LastCreatedEngine}static get LastCreatedScene(){return o.l.LastCreatedScene}_createImageBitmapFromSource(e,t){return new Promise(((i,n)=>{const s=new Image;s.onload=()=>{s.decode().then((()=>{this.createImageBitmap(s,t).then((e=>{i(e)}))}))},s.onerror=()=>{n(`Error loading image ${s.src}`)},s.src=e}))}createImageBitmap(e,t){return createImageBitmap(e,t)}resizeImageBitmap(e,t,i){const n=this.createCanvas(t,i).getContext("2d");if(!n)throw new Error("Unable to get 2d context for resizeImageBitmap");return n.drawImage(e,0,0),n.getImageData(0,0,t,i).data}static MarkAllMaterialsAsDirty(e,t){for(let i=0;i<f.Instances.length;i++){const n=f.Instances[i];for(let i=0;i<n.scenes.length;i++)n.scenes[i].markAllMaterialsAsDirty(e,t)}}static DefaultLoadingScreenFactory(e){throw(0,a.S)("LoadingScreen")}get _supportsHardwareTextureRescaling(){return!!f._RescalePostProcessFactory}get performanceMonitor(){return this._performanceMonitor}get compatibilityMode(){return this._compatibilityMode}set compatibilityMode(e){this._compatibilityMode=!0}getInputElement(){return this._renderingCanvas}constructor(e,t,i,s=!1){if(super(e,t,i,s),this.enableOfflineSupport=!1,this.disableManifestCheck=!1,this.disableContextMenu=!0,this.scenes=new Array,this._virtualScenes=new Array,this.onNewSceneAddedObservable=new n.y$,this.postProcesses=new Array,this.isPointerLock=!1,this.onResizeObservable=new n.y$,this.onCanvasBlurObservable=new n.y$,this.onCanvasFocusObservable=new n.y$,this.onCanvasPointerOutObservable=new n.y$,this.onBeginFrameObservable=new n.y$,this.customAnimationFrameRequester=null,this.onEndFrameObservable=new n.y$,this.onBeforeShaderCompilationObservable=new n.y$,this.onAfterShaderCompilationObservable=new n.y$,this._deterministicLockstep=!1,this._lockstepMaxSteps=4,this._timeStep=1/60,this._fps=60,this._deltaTime=0,this._drawCalls=new c.z,this.canvasTabIndex=1,this.disablePerformanceMonitorInBackground=!1,this._performanceMonitor=new h.A,this._compatibilityMode=!0,this.currentRenderPassId=0,this._renderPassNames=["main"],f.Instances.push(this),e){if(this._features.supportRenderPasses=!0,i=this._creationOptions,e.getContext){const t=e;this._sharedInit(t),this._connectVREvents()}this._prepareVRComponent(),i.autoEnableWebVR&&this.initWebVR()}}_initGLContext(){super._initGLContext(),this._rescalePostProcess=null}_sharedInit(e){super._sharedInit(e),this._onCanvasFocus=()=>{this.onCanvasFocusObservable.notifyObservers(this)},this._onCanvasBlur=()=>{this.onCanvasBlurObservable.notifyObservers(this)},this._onCanvasContextMenu=e=>{this.disableContextMenu&&e.preventDefault()},e.addEventListener("focus",this._onCanvasFocus),e.addEventListener("blur",this._onCanvasBlur),e.addEventListener("contextmenu",this._onCanvasContextMenu),this._onBlur=()=>{this.disablePerformanceMonitorInBackground&&this._performanceMonitor.disable(),this._windowIsBackground=!0},this._onFocus=()=>{this.disablePerformanceMonitorInBackground&&this._performanceMonitor.enable(),this._windowIsBackground=!1},this._onCanvasPointerOut=t=>{document.elementFromPoint(t.clientX,t.clientY)!==e&&this.onCanvasPointerOutObservable.notifyObservers(t)};const t=this.getHostWindow();t&&"function"==typeof t.addEventListener&&(t.addEventListener("blur",this._onBlur),t.addEventListener("focus",this._onFocus)),e.addEventListener("pointerout",this._onCanvasPointerOut),this._creationOptions.doNotHandleTouchAction||this._disableTouchAction(),!f.audioEngine&&this._creationOptions.audioEngine&&f.AudioEngineFactory&&(f.audioEngine=f.AudioEngineFactory(this.getRenderingCanvas(),this.getAudioContext(),this.getAudioDestination())),(0,r.n5)()&&(this._onFullscreenChange=()=>{this.isFullscreen=!!document.fullscreenElement,this.isFullscreen&&this._pointerLockRequested&&e&&f._RequestPointerlock(e)},document.addEventListener("fullscreenchange",this._onFullscreenChange,!1),document.addEventListener("webkitfullscreenchange",this._onFullscreenChange,!1),this._onPointerLockChange=()=>{this.isPointerLock=document.pointerLockElement===e},document.addEventListener("pointerlockchange",this._onPointerLockChange,!1),document.addEventListener("webkitpointerlockchange",this._onPointerLockChange,!1)),this.enableOfflineSupport=void 0!==f.OfflineProviderFactory,this._deterministicLockstep=!!this._creationOptions.deterministicLockstep,this._lockstepMaxSteps=this._creationOptions.lockstepMaxSteps||0,this._timeStep=this._creationOptions.timeStep||1/60}_verifyPointerLock(){var e;null===(e=this._onPointerLockChange)||void 0===e||e.call(this)}getAspectRatio(e,t=!1){const i=e.viewport;return this.getRenderWidth(t)*i.width/(this.getRenderHeight(t)*i.height)}getScreenAspectRatio(){return this.getRenderWidth(!0)/this.getRenderHeight(!0)}getRenderingCanvasClientRect(){return this._renderingCanvas?this._renderingCanvas.getBoundingClientRect():null}getInputElementClientRect(){return this._renderingCanvas?this.getInputElement().getBoundingClientRect():null}isDeterministicLockStep(){return this._deterministicLockstep}getLockstepMaxSteps(){return this._lockstepMaxSteps}getTimeStep(){return 1e3*this._timeStep}generateMipMapsForCubemap(e,t=!0){if(e.generateMipMaps){const i=this._gl;this._bindTextureDirectly(i.TEXTURE_CUBE_MAP,e,!0),i.generateMipmap(i.TEXTURE_CUBE_MAP),t&&this._bindTextureDirectly(i.TEXTURE_CUBE_MAP,null)}}getDepthWrite(){return this._depthCullingState.depthMask}setDepthWrite(e){this._depthCullingState.depthMask=e}getStencilBuffer(){return this._stencilState.stencilTest}setStencilBuffer(e){this._stencilState.stencilTest=e}getStencilMask(){return this._stencilState.stencilMask}setStencilMask(e){this._stencilState.stencilMask=e}getStencilFunction(){return this._stencilState.stencilFunc}getStencilFunctionReference(){return this._stencilState.stencilFuncRef}getStencilFunctionMask(){return this._stencilState.stencilFuncMask}setStencilFunction(e){this._stencilState.stencilFunc=e}setStencilFunctionReference(e){this._stencilState.stencilFuncRef=e}setStencilFunctionMask(e){this._stencilState.stencilFuncMask=e}getStencilOperationFail(){return this._stencilState.stencilOpStencilFail}getStencilOperationDepthFail(){return this._stencilState.stencilOpDepthFail}getStencilOperationPass(){return this._stencilState.stencilOpStencilDepthPass}setStencilOperationFail(e){this._stencilState.stencilOpStencilFail=e}setStencilOperationDepthFail(e){this._stencilState.stencilOpDepthFail=e}setStencilOperationPass(e){this._stencilState.stencilOpStencilDepthPass=e}setDitheringState(e){e?this._gl.enable(this._gl.DITHER):this._gl.disable(this._gl.DITHER)}setRasterizerState(e){e?this._gl.disable(this._gl.RASTERIZER_DISCARD):this._gl.enable(this._gl.RASTERIZER_DISCARD)}getDepthFunction(){return this._depthCullingState.depthFunc}setDepthFunction(e){this._depthCullingState.depthFunc=e}setDepthFunctionToGreater(){this.setDepthFunction(516)}setDepthFunctionToGreaterOrEqual(){this.setDepthFunction(518)}setDepthFunctionToLess(){this.setDepthFunction(513)}setDepthFunctionToLessOrEqual(){this.setDepthFunction(515)}cacheStencilState(){this._cachedStencilBuffer=this.getStencilBuffer(),this._cachedStencilFunction=this.getStencilFunction(),this._cachedStencilMask=this.getStencilMask(),this._cachedStencilOperationPass=this.getStencilOperationPass(),this._cachedStencilOperationFail=this.getStencilOperationFail(),this._cachedStencilOperationDepthFail=this.getStencilOperationDepthFail(),this._cachedStencilReference=this.getStencilFunctionReference()}restoreStencilState(){this.setStencilFunction(this._cachedStencilFunction),this.setStencilMask(this._cachedStencilMask),this.setStencilBuffer(this._cachedStencilBuffer),this.setStencilOperationPass(this._cachedStencilOperationPass),this.setStencilOperationFail(this._cachedStencilOperationFail),this.setStencilOperationDepthFail(this._cachedStencilOperationDepthFail),this.setStencilFunctionReference(this._cachedStencilReference)}setDirectViewport(e,t,i,n){const s=this._cachedViewport;return this._cachedViewport=null,this._viewport(e,t,i,n),s}scissorClear(e,t,i,n,s){this.enableScissor(e,t,i,n),this.clear(s,!0,!0,!0),this.disableScissor()}enableScissor(e,t,i,n){const s=this._gl;s.enable(s.SCISSOR_TEST),s.scissor(e,t,i,n)}disableScissor(){const e=this._gl;e.disable(e.SCISSOR_TEST)}_reportDrawCall(e=1){this._drawCalls.addCount(e,!1)}initWebVR(){throw(0,a.S)("WebVRCamera")}_prepareVRComponent(){}_connectVREvents(e,t){}_submitVRFrame(){}disableVR(){}isVRPresenting(){return!1}_requestVRFrame(){}_loadFileAsync(e,t,i){return new Promise(((n,s)=>{this._loadFile(e,(e=>{n(e)}),void 0,t,i,((e,t)=>{s(t)}))}))}getVertexShaderSource(e){const t=this._gl.getAttachedShaders(e);return t?this._gl.getShaderSource(t[0]):null}getFragmentShaderSource(e){const t=this._gl.getAttachedShaders(e);return t?this._gl.getShaderSource(t[1]):null}setDepthStencilTexture(e,t,i,n){void 0!==e&&(t&&(this._boundUniforms[e]=t),i&&i.depthStencilTexture?this._setTexture(e,i,!1,!0,n):this._setTexture(e,null,void 0,void 0,n))}setTextureFromPostProcess(e,t,i){var n;let s=null;t&&(t._textures.data[t._currentRenderTextureInd]?s=t._textures.data[t._currentRenderTextureInd]:t._forcedOutputTexture&&(s=t._forcedOutputTexture)),this._bindTexture(e,null!==(n=null==s?void 0:s.texture)&&void 0!==n?n:null,i)}setTextureFromPostProcessOutput(e,t,i){var n,s;this._bindTexture(e,null!==(s=null===(n=null==t?void 0:t._outputTexture)||void 0===n?void 0:n.texture)&&void 0!==s?s:null,i)}_rebuildBuffers(){for(const e of this.scenes)e.resetCachedMaterial(),e._rebuildGeometries(),e._rebuildTextures();for(const e of this._virtualScenes)e.resetCachedMaterial(),e._rebuildGeometries(),e._rebuildTextures();super._rebuildBuffers()}_renderFrame(){for(let e=0;e<this._activeRenderLoops.length;e++)(0,this._activeRenderLoops[e])()}_renderLoop(){if(!this._contextWasLost){let e=!0;(this.isDisposed||!this.renderEvenInBackground&&this._windowIsBackground)&&(e=!1),e&&(this.beginFrame(),this._renderViews()||this._renderFrame(),this.endFrame())}this._activeRenderLoops.length>0?this.customAnimationFrameRequester?(this.customAnimationFrameRequester.requestID=this._queueNewFrame(this.customAnimationFrameRequester.renderFunction||this._boundRenderFunction,this.customAnimationFrameRequester),this._frameHandler=this.customAnimationFrameRequester.requestID):this.isVRPresenting()?this._requestVRFrame():this._frameHandler=this._queueNewFrame(this._boundRenderFunction,this.getHostWindow()):this._renderingQueueLaunched=!1}_renderViews(){return!1}switchFullscreen(e){this.isFullscreen?this.exitFullscreen():this.enterFullscreen(e)}enterFullscreen(e){this.isFullscreen||(this._pointerLockRequested=e,this._renderingCanvas&&f._RequestFullscreen(this._renderingCanvas))}exitFullscreen(){this.isFullscreen&&f._ExitFullscreen()}enterPointerlock(){this._renderingCanvas&&f._RequestPointerlock(this._renderingCanvas)}exitPointerlock(){f._ExitPointerlock()}beginFrame(){this._measureFps(),this.onBeginFrameObservable.notifyObservers(this),super.beginFrame()}endFrame(){super.endFrame(),this._submitVRFrame(),this.onEndFrameObservable.notifyObservers(this)}resize(e=!1){this.isVRPresenting()||super.resize(e)}setSize(e,t,i=!1){if(!this._renderingCanvas)return!1;if(!super.setSize(e,t,i))return!1;if(this.scenes){for(let e=0;e<this.scenes.length;e++){const t=this.scenes[e];for(let e=0;e<t.cameras.length;e++)t.cameras[e]._currentRenderId=0}this.onResizeObservable.hasObservers()&&this.onResizeObservable.notifyObservers(this)}return!0}_deletePipelineContext(e){const t=e;t&&t.program&&t.transformFeedback&&(this.deleteTransformFeedback(t.transformFeedback),t.transformFeedback=null),super._deletePipelineContext(e)}createShaderProgram(e,t,i,n,s,r=null){s=s||this._gl,this.onBeforeShaderCompilationObservable.notifyObservers(this);const o=super.createShaderProgram(e,t,i,n,s,r);return this.onAfterShaderCompilationObservable.notifyObservers(this),o}_createShaderProgram(e,t,i,n,s=null){const r=n.createProgram();if(e.program=r,!r)throw new Error("Unable to create program");if(n.attachShader(r,t),n.attachShader(r,i),this.webGLVersion>1&&s){const t=this.createTransformFeedback();this.bindTransformFeedback(t),this.setTranformFeedbackVaryings(r,s),e.transformFeedback=t}return n.linkProgram(r),this.webGLVersion>1&&s&&this.bindTransformFeedback(null),e.context=n,e.vertexShader=t,e.fragmentShader=i,e.isParallelCompiled||this._finalizePipelineContext(e),r}_releaseTexture(e){super._releaseTexture(e)}_releaseRenderTargetWrapper(e){super._releaseRenderTargetWrapper(e),this.scenes.forEach((t=>{t.postProcesses.forEach((t=>{t._outputTexture===e&&(t._outputTexture=null)})),t.cameras.forEach((t=>{t._postProcesses.forEach((t=>{t&&t._outputTexture===e&&(t._outputTexture=null)}))}))}))}getRenderPassNames(){return this._renderPassNames}getCurrentRenderPassName(){return this._renderPassNames[this.currentRenderPassId]}createRenderPassId(e){const t=++f._RenderPassIdCounter;return this._renderPassNames[t]=null!=e?e:"NONAME",t}releaseRenderPassId(e){this._renderPassNames[e]=void 0;for(let t=0;t<this.scenes.length;++t){const i=this.scenes[t];for(let t=0;t<i.meshes.length;++t){const n=i.meshes[t];if(n.subMeshes)for(let t=0;t<n.subMeshes.length;++t)n.subMeshes[t]._removeDrawWrapper(e)}}}_rescaleTexture(e,t,i,n,s){this._gl.texParameteri(this._gl.TEXTURE_2D,this._gl.TEXTURE_MAG_FILTER,this._gl.LINEAR),this._gl.texParameteri(this._gl.TEXTURE_2D,this._gl.TEXTURE_MIN_FILTER,this._gl.LINEAR),this._gl.texParameteri(this._gl.TEXTURE_2D,this._gl.TEXTURE_WRAP_S,this._gl.CLAMP_TO_EDGE),this._gl.texParameteri(this._gl.TEXTURE_2D,this._gl.TEXTURE_WRAP_T,this._gl.CLAMP_TO_EDGE);const r=this.createRenderTargetTexture({width:t.width,height:t.height},{generateMipMaps:!1,type:0,samplingMode:2,generateDepthBuffer:!1,generateStencilBuffer:!1});!this._rescalePostProcess&&f._RescalePostProcessFactory&&(this._rescalePostProcess=f._RescalePostProcessFactory(this)),this._rescalePostProcess&&(this._rescalePostProcess.externalTextureSamplerBinding=!0,this._rescalePostProcess.getEffect().executeWhenCompiled((()=>{this._rescalePostProcess.onApply=function(t){t._bindTexture("textureSampler",e)};let o=i;o||(o=this.scenes[this.scenes.length-1]),o.postProcessManager.directRender([this._rescalePostProcess],r,!0),this._bindTextureDirectly(this._gl.TEXTURE_2D,t,!0),this._gl.copyTexImage2D(this._gl.TEXTURE_2D,0,n,0,0,t.width,t.height,0),this.unBindFramebuffer(r),r.dispose(),s&&s()})))}getFps(){return this._fps}getDeltaTime(){return this._deltaTime}_measureFps(){this._performanceMonitor.sampleFrame(),this._fps=this._performanceMonitor.averageFPS,this._deltaTime=this._performanceMonitor.instantaneousFrameTime||0}wrapWebGLTexture(e,t=!1,i=3){const n=new p.B(e,this._gl),r=new s.l(this,s.S.Unknown,!0);return r._hardwareTexture=n,r.isReady=!0,r.useMipMaps=t,this.updateTextureSamplingMode(i,r),r}_uploadImageToTexture(e,t,i=0,n=0){const s=this._gl,r=this._getWebGLTextureType(e.type),o=this._getInternalFormat(e.format),a=this._getRGBABufferInternalSizedFormat(e.type,o),l=e.isCube?s.TEXTURE_CUBE_MAP:s.TEXTURE_2D;this._bindTextureDirectly(l,e,!0),this._unpackFlipY(e.invertY);let h=s.TEXTURE_2D;e.isCube&&(h=s.TEXTURE_CUBE_MAP_POSITIVE_X+i),s.texImage2D(h,n,a,o,r,t),this._bindTextureDirectly(l,null,!0)}updateTextureComparisonFunction(e,t){if(1===this.webGLVersion)return void d.Y.Error("WebGL 1 does not support texture comparison.");const i=this._gl;e.isCube?(this._bindTextureDirectly(this._gl.TEXTURE_CUBE_MAP,e,!0),0===t?(i.texParameteri(i.TEXTURE_CUBE_MAP,i.TEXTURE_COMPARE_FUNC,515),i.texParameteri(i.TEXTURE_CUBE_MAP,i.TEXTURE_COMPARE_MODE,i.NONE)):(i.texParameteri(i.TEXTURE_CUBE_MAP,i.TEXTURE_COMPARE_FUNC,t),i.texParameteri(i.TEXTURE_CUBE_MAP,i.TEXTURE_COMPARE_MODE,i.COMPARE_REF_TO_TEXTURE)),this._bindTextureDirectly(this._gl.TEXTURE_CUBE_MAP,null)):(this._bindTextureDirectly(this._gl.TEXTURE_2D,e,!0),0===t?(i.texParameteri(i.TEXTURE_2D,i.TEXTURE_COMPARE_FUNC,515),i.texParameteri(i.TEXTURE_2D,i.TEXTURE_COMPARE_MODE,i.NONE)):(i.texParameteri(i.TEXTURE_2D,i.TEXTURE_COMPARE_FUNC,t),i.texParameteri(i.TEXTURE_2D,i.TEXTURE_COMPARE_MODE,i.COMPARE_REF_TO_TEXTURE)),this._bindTextureDirectly(this._gl.TEXTURE_2D,null)),e._comparisonFunction=t}createInstancesBuffer(e){const t=this._gl.createBuffer();if(!t)throw new Error("Unable to create instance buffer");const i=new u.M(t);return i.capacity=e,this.bindArrayBuffer(i),this._gl.bufferData(this._gl.ARRAY_BUFFER,e,this._gl.DYNAMIC_DRAW),i.references=1,i}deleteInstancesBuffer(e){this._gl.deleteBuffer(e)}_clientWaitAsync(e,t=0,i=10){const n=this._gl;return new Promise(((s,r)=>{const o=()=>{const a=n.clientWaitSync(e,t,0);a!=n.WAIT_FAILED?a!=n.TIMEOUT_EXPIRED?s():setTimeout(o,i):r()};o()}))}_readPixelsAsync(e,t,i,n,s,r,o){if(this._webGLVersion<2)throw new Error("_readPixelsAsync only work on WebGL2+");const a=this._gl,l=a.createBuffer();a.bindBuffer(a.PIXEL_PACK_BUFFER,l),a.bufferData(a.PIXEL_PACK_BUFFER,o.byteLength,a.STREAM_READ),a.readPixels(e,t,i,n,s,r,0),a.bindBuffer(a.PIXEL_PACK_BUFFER,null);const h=a.fenceSync(a.SYNC_GPU_COMMANDS_COMPLETE,0);return h?(a.flush(),this._clientWaitAsync(h,0,10).then((()=>(a.deleteSync(h),a.bindBuffer(a.PIXEL_PACK_BUFFER,l),a.getBufferSubData(a.PIXEL_PACK_BUFFER,0,o),a.bindBuffer(a.PIXEL_PACK_BUFFER,null),a.deleteBuffer(l),o)))):null}dispose(){for(this.hideLoadingUI(),this.onNewSceneAddedObservable.clear();this.postProcesses.length;)this.postProcesses[0].dispose();for(this._rescalePostProcess&&this._rescalePostProcess.dispose();this.scenes.length;)this.scenes[0].dispose();for(;this._virtualScenes.length;)this._virtualScenes[0].dispose();1===o.l.Instances.length&&f.audioEngine&&(f.audioEngine.dispose(),f.audioEngine=null),this.disableVR();const e=this.getHostWindow();e&&"function"==typeof e.removeEventListener&&(e.removeEventListener("blur",this._onBlur),e.removeEventListener("focus",this._onFocus)),this._renderingCanvas&&(this._renderingCanvas.removeEventListener("focus",this._onCanvasFocus),this._renderingCanvas.removeEventListener("blur",this._onCanvasBlur),this._renderingCanvas.removeEventListener("pointerout",this._onCanvasPointerOut),this._renderingCanvas.removeEventListener("contextmenu",this._onCanvasContextMenu)),(0,r.n5)()&&(document.removeEventListener("fullscreenchange",this._onFullscreenChange),document.removeEventListener("mozfullscreenchange",this._onFullscreenChange),document.removeEventListener("webkitfullscreenchange",this._onFullscreenChange),document.removeEventListener("msfullscreenchange",this._onFullscreenChange),document.removeEventListener("pointerlockchange",this._onPointerLockChange),document.removeEventListener("mspointerlockchange",this._onPointerLockChange),document.removeEventListener("mozpointerlockchange",this._onPointerLockChange),document.removeEventListener("webkitpointerlockchange",this._onPointerLockChange)),super.dispose();const t=o.l.Instances.indexOf(this);t>=0&&o.l.Instances.splice(t,1),f.Instances.length||(o.l.OnEnginesDisposedObservable.notifyObservers(this),o.l.OnEnginesDisposedObservable.clear()),this.onResizeObservable.clear(),this.onCanvasBlurObservable.clear(),this.onCanvasFocusObservable.clear(),this.onCanvasPointerOutObservable.clear(),this.onBeginFrameObservable.clear(),this.onEndFrameObservable.clear()}_disableTouchAction(){this._renderingCanvas&&this._renderingCanvas.setAttribute&&(this._renderingCanvas.setAttribute("touch-action","none"),this._renderingCanvas.style.touchAction="none",this._renderingCanvas.style.webkitTapHighlightColor="transparent")}displayLoadingUI(){if(!(0,r.CG)())return;const e=this.loadingScreen;e&&e.displayLoadingUI()}hideLoadingUI(){if(!(0,r.CG)())return;const e=this._loadingScreen;e&&e.hideLoadingUI()}get loadingScreen(){return!this._loadingScreen&&this._renderingCanvas&&(this._loadingScreen=f.DefaultLoadingScreenFactory(this._renderingCanvas)),this._loadingScreen}set loadingScreen(e){this._loadingScreen=e}set loadingUIText(e){this.loadingScreen.loadingUIText=e}set loadingUIBackgroundColor(e){this.loadingScreen.loadingUIBackgroundColor=e}createVideoElement(e){return document.createElement("video")}static _RequestPointerlock(e){if(e.requestPointerLock){const t=e.requestPointerLock();t instanceof Promise?t.then((()=>{e.focus()})).catch((()=>{})):e.focus()}}static _ExitPointerlock(){document.exitPointerLock&&document.exitPointerLock()}static _RequestFullscreen(e){const t=e.requestFullscreen||e.webkitRequestFullscreen;t&&t.call(e)}static _ExitFullscreen(){const e=document;document.exitFullscreen?document.exitFullscreen():e.webkitCancelFullScreen&&e.webkitCancelFullScreen()}getFontOffset(e){const t=document.createElement("span");t.innerHTML="Hg",t.setAttribute("style",`font: ${e} !important`);const i=document.createElement("div");i.style.display="inline-block",i.style.width="1px",i.style.height="0px",i.style.verticalAlign="bottom";const n=document.createElement("div");n.style.whiteSpace="nowrap",n.appendChild(t),n.appendChild(i),document.body.appendChild(n);let s=0,r=0;try{r=i.getBoundingClientRect().top-t.getBoundingClientRect().top,i.style.verticalAlign="baseline",s=i.getBoundingClientRect().top-t.getBoundingClientRect().top}finally{document.body.removeChild(n)}return{ascent:s,height:r,descent:r-s}}}f.ALPHA_DISABLE=0,f.ALPHA_ADD=1,f.ALPHA_COMBINE=2,f.ALPHA_SUBTRACT=3,f.ALPHA_MULTIPLY=4,f.ALPHA_MAXIMIZED=5,f.ALPHA_ONEONE=6,f.ALPHA_PREMULTIPLIED=7,f.ALPHA_PREMULTIPLIED_PORTERDUFF=8,f.ALPHA_INTERPOLATE=9,f.ALPHA_SCREENMODE=10,f.DELAYLOADSTATE_NONE=0,f.DELAYLOADSTATE_LOADED=1,f.DELAYLOADSTATE_LOADING=2,f.DELAYLOADSTATE_NOTLOADED=4,f.NEVER=512,f.ALWAYS=519,f.LESS=513,f.EQUAL=514,f.LEQUAL=515,f.GREATER=516,f.GEQUAL=518,f.NOTEQUAL=517,f.KEEP=7680,f.REPLACE=7681,f.INCR=7682,f.DECR=7683,f.INVERT=5386,f.INCR_WRAP=34055,f.DECR_WRAP=34056,f.TEXTURE_CLAMP_ADDRESSMODE=0,f.TEXTURE_WRAP_ADDRESSMODE=1,f.TEXTURE_MIRROR_ADDRESSMODE=2,f.TEXTUREFORMAT_ALPHA=0,f.TEXTUREFORMAT_LUMINANCE=1,f.TEXTUREFORMAT_LUMINANCE_ALPHA=2,f.TEXTUREFORMAT_RGB=4,f.TEXTUREFORMAT_RGBA=5,f.TEXTUREFORMAT_RED=6,f.TEXTUREFORMAT_R=6,f.TEXTUREFORMAT_RG=7,f.TEXTUREFORMAT_RED_INTEGER=8,f.TEXTUREFORMAT_R_INTEGER=8,f.TEXTUREFORMAT_RG_INTEGER=9,f.TEXTUREFORMAT_RGB_INTEGER=10,f.TEXTUREFORMAT_RGBA_INTEGER=11,f.TEXTURETYPE_UNSIGNED_BYTE=0,f.TEXTURETYPE_UNSIGNED_INT=0,f.TEXTURETYPE_FLOAT=1,f.TEXTURETYPE_HALF_FLOAT=2,f.TEXTURETYPE_BYTE=3,f.TEXTURETYPE_SHORT=4,f.TEXTURETYPE_UNSIGNED_SHORT=5,f.TEXTURETYPE_INT=6,f.TEXTURETYPE_UNSIGNED_INTEGER=7,f.TEXTURETYPE_UNSIGNED_SHORT_4_4_4_4=8,f.TEXTURETYPE_UNSIGNED_SHORT_5_5_5_1=9,f.TEXTURETYPE_UNSIGNED_SHORT_5_6_5=10,f.TEXTURETYPE_UNSIGNED_INT_2_10_10_10_REV=11,f.TEXTURETYPE_UNSIGNED_INT_24_8=12,f.TEXTURETYPE_UNSIGNED_INT_10F_11F_11F_REV=13,f.TEXTURETYPE_UNSIGNED_INT_5_9_9_9_REV=14,f.TEXTURETYPE_FLOAT_32_UNSIGNED_INT_24_8_REV=15,f.TEXTURE_NEAREST_SAMPLINGMODE=1,f.TEXTURE_BILINEAR_SAMPLINGMODE=2,f.TEXTURE_TRILINEAR_SAMPLINGMODE=3,f.TEXTURE_NEAREST_NEAREST_MIPLINEAR=8,f.TEXTURE_LINEAR_LINEAR_MIPNEAREST=11,f.TEXTURE_LINEAR_LINEAR_MIPLINEAR=3,f.TEXTURE_NEAREST_NEAREST_MIPNEAREST=4,f.TEXTURE_NEAREST_LINEAR_MIPNEAREST=5,f.TEXTURE_NEAREST_LINEAR_MIPLINEAR=6,f.TEXTURE_NEAREST_LINEAR=7,f.TEXTURE_NEAREST_NEAREST=1,f.TEXTURE_LINEAR_NEAREST_MIPNEAREST=9,f.TEXTURE_LINEAR_NEAREST_MIPLINEAR=10,f.TEXTURE_LINEAR_LINEAR=2,f.TEXTURE_LINEAR_NEAREST=12,f.TEXTURE_EXPLICIT_MODE=0,f.TEXTURE_SPHERICAL_MODE=1,f.TEXTURE_PLANAR_MODE=2,f.TEXTURE_CUBIC_MODE=3,f.TEXTURE_PROJECTION_MODE=4,f.TEXTURE_SKYBOX_MODE=5,f.TEXTURE_INVCUBIC_MODE=6,f.TEXTURE_EQUIRECTANGULAR_MODE=7,f.TEXTURE_FIXED_EQUIRECTANGULAR_MODE=8,f.TEXTURE_FIXED_EQUIRECTANGULAR_MIRRORED_MODE=9,f.SCALEMODE_FLOOR=1,f.SCALEMODE_NEAREST=2,f.SCALEMODE_CEILING=3,f._RescalePostProcessFactory=null,f._RenderPassIdCounter=0},1431:(e,t,i)=>{i.d(t,{l:()=>s});var n=i(5757);class s{static get LastCreatedEngine(){return 0===this.Instances.length?null:this.Instances[this.Instances.length-1]}static get LastCreatedScene(){return this._LastCreatedScene}}s.Instances=new Array,s.OnEnginesDisposedObservable=new n.y$,s._LastCreatedScene=null,s.UseFallbackTexture=!0,s.FallbackTexture=""},771:(e,t,i)=>{i.d(t,{Z:()=>n});class n{static SetMatrixPrecision(e){if(n.MatrixTrackPrecisionChange=!1,e&&!n.MatrixUse64Bits&&n.MatrixTrackedMatrices)for(let e=0;e<n.MatrixTrackedMatrices.length;++e){const t=n.MatrixTrackedMatrices[e],i=t._m;t._m=new Array(16);for(let e=0;e<16;++e)t._m[e]=i[e]}n.MatrixUse64Bits=e,n.MatrixCurrentType=n.MatrixUse64Bits?Array:Float32Array,n.MatrixTrackedMatrices=null}}n.MatrixUse64Bits=!1,n.MatrixTrackPrecisionChange=!0,n.MatrixCurrentType=Float32Array,n.MatrixTrackedMatrices=[]},7374:(e,t,i)=>{i.d(t,{r:()=>s});var n=i(6202);class s{get depthStencilTexture(){return this._depthStencilTexture}get depthStencilTextureWithStencil(){return this._depthStencilTextureWithStencil}get isCube(){return this._isCube}get isMulti(){return this._isMulti}get is2DArray(){return this.layers>0}get size(){return this.width}get width(){return this._size.width||this._size}get height(){return this._size.height||this._size}get layers(){return this._size.layers||0}get texture(){var e,t;return null!==(t=null===(e=this._textures)||void 0===e?void 0:e[0])&&void 0!==t?t:null}get textures(){return this._textures}get faceIndices(){return this._faceIndices}get layerIndices(){return this._layerIndices}get samples(){return this._samples}setSamples(e,t=!0,i=!1){if(this.samples===e&&!i)return e;const n=this._isMulti?this._engine.updateMultipleRenderTargetTextureSampleCount(this,e,t):this._engine.updateRenderTargetTextureSampleCount(this,e);return this._samples=e,n}constructor(e,t,i,n){this._textures=null,this._faceIndices=null,this._layerIndices=null,this._samples=1,this._attachments=null,this._generateStencilBuffer=!1,this._generateDepthBuffer=!1,this._depthStencilTextureWithStencil=!1,this._isMulti=e,this._isCube=t,this._size=i,this._engine=n,this._depthStencilTexture=null}setTextures(e){Array.isArray(e)?this._textures=e:this._textures=e?[e]:null}setTexture(e,t=0,i=!0){this._textures||(this._textures=[]),this._textures[t]&&i&&this._textures[t].dispose(),this._textures[t]=e}setLayerAndFaceIndices(e,t){this._layerIndices=e,this._faceIndices=t}setLayerAndFaceIndex(e=0,t,i){this._layerIndices||(this._layerIndices=[]),this._faceIndices||(this._faceIndices=[]),void 0!==t&&t>=0&&(this._layerIndices[e]=t),void 0!==i&&i>=0&&(this._faceIndices[e]=i)}createDepthStencilTexture(e=0,t=!0,i=!1,n=1,s=14,r){var o;return null===(o=this._depthStencilTexture)||void 0===o||o.dispose(),this._depthStencilTextureWithStencil=i,this._depthStencilTexture=this._engine.createDepthStencilTexture(this._size,{bilinearFiltering:t,comparisonFunction:e,generateStencil:i,isCube:this._isCube,samples:n,depthTextureFormat:s,label:r},this),this._depthStencilTexture}_shareDepth(e){this._depthStencilTexture&&(e._depthStencilTexture&&e._depthStencilTexture.dispose(),e._depthStencilTexture=this._depthStencilTexture,this._depthStencilTexture.incrementReferences())}_swapAndDie(e){this.texture&&this.texture._swapAndDie(e),this._textures=null,this.dispose(!0)}_cloneRenderTargetWrapper(){var e,t,i,s,r,o,a,l;let h=null;if(this._isMulti){const i=this.textures;if(i&&i.length>0){let s=!1,r=i.length;const o=i[i.length-1]._source;o!==n.S.Depth&&o!==n.S.DepthStencil||(s=!0,r--);const a=[],l=[],c=[],u=[],d=[],p=[],f=[],_={};for(let n=0;n<r;++n){const s=i[n];a.push(s.samplingMode),l.push(s.type),c.push(s.format),void 0!==_[s.uniqueId]?(u.push(-1),f.push(0)):(_[s.uniqueId]=n,s.is2DArray?(u.push(35866),f.push(s.depth)):s.isCube?(u.push(34067),f.push(0)):s.is3D?(u.push(32879),f.push(s.depth)):(u.push(3553),f.push(0))),this._faceIndices&&d.push(null!==(e=this._faceIndices[n])&&void 0!==e?e:0),this._layerIndices&&p.push(null!==(t=this._layerIndices[n])&&void 0!==t?t:0)}const m={samplingModes:a,generateMipMaps:i[0].generateMipMaps,generateDepthBuffer:this._generateDepthBuffer,generateStencilBuffer:this._generateStencilBuffer,generateDepthTexture:s,types:l,formats:c,textureCount:r,targetTypes:u,faceIndex:d,layerIndex:p,layerCounts:f},g={width:this.width,height:this.height};h=this._engine.createMultipleRenderTarget(g,m);for(let e=0;e<r;++e){if(-1!==u[e])continue;const t=_[i[e].uniqueId];h.setTexture(h.textures[t],e)}}}else{const e={};if(e.generateDepthBuffer=this._generateDepthBuffer,e.generateMipMaps=null!==(s=null===(i=this.texture)||void 0===i?void 0:i.generateMipMaps)&&void 0!==s&&s,e.generateStencilBuffer=this._generateStencilBuffer,e.samplingMode=null===(r=this.texture)||void 0===r?void 0:r.samplingMode,e.type=null===(o=this.texture)||void 0===o?void 0:o.type,e.format=null===(a=this.texture)||void 0===a?void 0:a.format,this.isCube)h=this._engine.createRenderTargetCubeTexture(this.width,e);else{const t={width:this.width,height:this.height,layers:this.is2DArray?null===(l=this.texture)||void 0===l?void 0:l.depth:void 0};h=this._engine.createRenderTargetTexture(t,e)}h.texture.isReady=!0}return h}_swapRenderTargetWrapper(e){if(this._textures&&e._textures)for(let t=0;t<this._textures.length;++t)this._textures[t]._swapAndDie(e._textures[t],!1),e._textures[t].isReady=!0;this._depthStencilTexture&&e._depthStencilTexture&&(this._depthStencilTexture._swapAndDie(e._depthStencilTexture),e._depthStencilTexture.isReady=!0),this._textures=null,this._depthStencilTexture=null}_rebuild(){const e=this._cloneRenderTargetWrapper();if(e){if(this._depthStencilTexture){const t=this._depthStencilTexture.samplingMode,i=2===t||3===t||11===t;e.createDepthStencilTexture(this._depthStencilTexture._comparisonFunction,i,this._depthStencilTextureWithStencil,this._depthStencilTexture.samples)}this.samples>1&&e.setSamples(this.samples),e._swapRenderTargetWrapper(this),e.dispose()}}releaseTextures(){var e,t;if(this._textures)for(let i=0;null!==(t=i<(null===(e=this._textures)||void 0===e?void 0:e.length))&&void 0!==t&&t;++i)this._textures[i].dispose();this._textures=null}dispose(e=!1){var t;e||(null===(t=this._depthStencilTexture)||void 0===t||t.dispose(),this._depthStencilTexture=null,this.releaseTextures()),this._engine._releaseRenderTargetWrapper(this)}}},8104:(e,t,i)=>{i.d(t,{v:()=>s});var n=i(9131);class s{static GetShadersRepository(e=n.x.GLSL){return e===n.x.GLSL?s.ShadersRepository:s.ShadersRepositoryWGSL}static GetShadersStore(e=n.x.GLSL){return e===n.x.GLSL?s.ShadersStore:s.ShadersStoreWGSL}static GetIncludesShadersStore(e=n.x.GLSL){return e===n.x.GLSL?s.IncludesShadersStore:s.IncludesShadersStoreWGSL}}s.ShadersRepository="src/Shaders/",s.ShadersStore={},s.IncludesShadersStore={},s.ShadersRepositoryWGSL="src/ShadersWGSL/",s.ShadersStoreWGSL={},s.IncludesShadersStoreWGSL={}},3230:(e,t,i)=>{i.d(t,{B:()=>E});var n=i(1431),s=i(1979),r=i(4934),o=i(5757),a=i(6533),l=i(8657),h=i(4710),c=i(6202),u=i(2722),d=i(6797),p=i(9131);class f{constructor(){this.shaderLanguage=p.x.GLSL}postProcessor(e,t,i,n,s){if(!s.getCaps().drawBuffersExtension){const t=/#extension.+GL_EXT_draw_buffers.+(enable|require)/g;e=e.replace(t,"")}return e}}var _=i(4001),m=i(8261),g=i(4238),v=i(771),y=i(2200),x=i(1345),b=i(9468),T=i(8108);class S{}class E{static get NpmPackage(){return"babylonjs@6.3.0"}static get Version(){return"6.3.0"}get description(){let e=this.name+this.webGLVersion;return this._caps.parallelShaderCompile&&(e+=" - Parallel shader compilation"),e}get name(){return this._name}set name(e){this._name=e}get version(){return this._webGLVersion}get isDisposed(){return this._isDisposed}static get ShadersRepository(){return s.Q.ShadersRepository}static set ShadersRepository(e){s.Q.ShadersRepository=e}_getShaderProcessor(e){return this._shaderProcessor}get useReverseDepthBuffer(){return this._useReverseDepthBuffer}set useReverseDepthBuffer(e){e!==this._useReverseDepthBuffer&&(this._useReverseDepthBuffer=e,this._depthCullingState.depthFunc=e?518:515)}get frameId(){return this._frameId}get supportsUniformBuffers(){return this.webGLVersion>1&&!this.disableUniformBuffers}getCreationOptions(){return this._creationOptions}get _shouldUseHighPrecisionShader(){return!(!this._caps.highPrecisionShaderSupported||!this._highPrecisionShadersAllowed)}get needPOTTextures(){return this._webGLVersion<2||this.forcePOTTextures}get activeRenderLoops(){return this._activeRenderLoops}get doNotHandleContextLost(){return this._doNotHandleContextLost}set doNotHandleContextLost(e){this._doNotHandleContextLost=e}get _supportsHardwareTextureRescaling(){return!1}set framebufferDimensionsObject(e){this._framebufferDimensionsObject=e}get currentViewport(){return this._cachedViewport}get emptyTexture(){return this._emptyTexture||(this._emptyTexture=this.createRawTexture(new Uint8Array(4),1,1,5,!1,!1,1)),this._emptyTexture}get emptyTexture3D(){return this._emptyTexture3D||(this._emptyTexture3D=this.createRawTexture3D(new Uint8Array(4),1,1,1,5,!1,!1,1)),this._emptyTexture3D}get emptyTexture2DArray(){return this._emptyTexture2DArray||(this._emptyTexture2DArray=this.createRawTexture2DArray(new Uint8Array(4),1,1,1,5,!1,!1,1)),this._emptyTexture2DArray}get emptyCubeTexture(){if(!this._emptyCubeTexture){const e=new Uint8Array(4),t=[e,e,e,e,e,e];this._emptyCubeTexture=this.createRawCubeTexture(t,1,5,0,!1,!1,1)}return this._emptyCubeTexture}get isWebGPU(){return this._isWebGPU}get shaderPlatformName(){return this._shaderPlatformName}get snapshotRendering(){return!1}set snapshotRendering(e){}get snapshotRenderingMode(){return this._snapshotRenderingMode}set snapshotRenderingMode(e){this._snapshotRenderingMode=e}snapshotRenderingReset(){this.snapshotRendering=!1}static _CreateCanvas(e,t){if("undefined"==typeof document)return new OffscreenCanvas(e,t);const i=document.createElement("canvas");return i.width=e,i.height=t,i}createCanvas(e,t){return E._CreateCanvas(e,t)}createCanvasImage(){return document.createElement("img")}constructor(e,t,i,n){var s,r,c,p,m,g,y,x,C,A,P;this._name="WebGL",this._isDisposed=!1,this.forcePOTTextures=!1,this.isFullscreen=!1,this.cullBackFaces=null,this.renderEvenInBackground=!0,this.preventCacheWipeBetweenFrames=!1,this.validateShaderPrograms=!1,this._useReverseDepthBuffer=!1,this.isNDCHalfZRange=!1,this.hasOriginBottomLeft=!0,this.disableUniformBuffers=!1,this.onDisposeObservable=new o.y$,this._frameId=0,this._uniformBuffers=new Array,this._storageBuffers=new Array,this._webGLVersion=1,this._windowIsBackground=!1,this._highPrecisionShadersAllowed=!0,this._badOS=!1,this._badDesktopOS=!1,this._renderingQueueLaunched=!1,this._activeRenderLoops=new Array,this.onContextLostObservable=new o.y$,this.onContextRestoredObservable=new o.y$,this._contextWasLost=!1,this._doNotHandleContextLost=!1,this.disableVertexArrayObjects=!1,this._colorWrite=!0,this._colorWriteChanged=!0,this._depthCullingState=new a.k,this._stencilStateComposer=new b.C,this._stencilState=new l.s,this._alphaState=new h.Q,this._alphaMode=1,this._alphaEquation=0,this._internalTexturesCache=new Array,this._renderTargetWrapperCache=new Array,this._activeChannel=0,this._currentTextureChannel=-1,this._boundTexturesCache={},this._compiledEffects={},this._vertexAttribArraysEnabled=[],this._uintIndicesCurrentlySet=!1,this._currentBoundBuffer=new Array,this._currentFramebuffer=null,this._dummyFramebuffer=null,this._currentBufferPointers=new Array,this._currentInstanceLocations=new Array,this._currentInstanceBuffers=new Array,this._vaoRecordInProgress=!1,this._mustWipeVertexAttributes=!1,this._nextFreeTextureSlots=new Array,this._maxSimultaneousTextures=0,this._maxMSAASamplesOverride=null,this._activeRequests=new Array,this.adaptToDeviceRatio=!1,this._lastDevicePixelRatio=1,this._transformTextureUrl=null,this.hostInformation={isMobile:!1},this.premultipliedAlpha=!0,this.onBeforeTextureInitObservable=new o.y$,this._isWebGPU=!1,this._snapshotRenderingMode=0,this._viewportCached={x:0,y:0,z:0,w:0},this._unpackFlipYCached=null,this.enableUnpackFlipYCached=!0,this._boundUniforms={},this.startTime=T.F.Now;let R=null;i=i||{},this._creationOptions=i,this.adaptToDeviceRatio=null!=n&&n,this._stencilStateComposer.stencilGlobal=this._stencilState,v.Z.SetMatrixPrecision(!!i.useHighPrecisionMatrix),i.antialias=null!=t?t:i.antialias,i.deterministicLockstep=null!==(s=i.deterministicLockstep)&&void 0!==s&&s,i.lockstepMaxSteps=null!==(r=i.lockstepMaxSteps)&&void 0!==r?r:4,i.timeStep=null!==(c=i.timeStep)&&void 0!==c?c:1/60,i.audioEngine=null===(p=i.audioEngine)||void 0===p||p,i.stencil=null===(m=i.stencil)||void 0===m||m,this._audioContext=null!==(y=null===(g=i.audioEngineOptions)||void 0===g?void 0:g.audioContext)&&void 0!==y?y:null,this._audioDestination=null!==(C=null===(x=i.audioEngineOptions)||void 0===x?void 0:x.audioDestination)&&void 0!==C?C:null,this.premultipliedAlpha=null===(A=i.premultipliedAlpha)||void 0===A||A,this.useExactSrgbConversions=null!==(P=i.useExactSrgbConversions)&&void 0!==P&&P,this._doNotHandleContextLost=!!i.doNotHandleContextLost,this._isStencilEnable=!!i.stencil,n=n||i.adaptToDeviceRatio||!1;const M=(0,d.CG)()&&window.devicePixelRatio||1,I=i.limitDeviceRatio||M;if(this._hardwareScalingLevel=n?1/Math.min(I,M):1,this._lastDevicePixelRatio=M,!e)return;if(e.getContext){if(R=e,this._renderingCanvas=R,void 0===i.preserveDrawingBuffer&&(i.preserveDrawingBuffer=!1),void 0===i.xrCompatible&&(i.xrCompatible=!0),navigator&&navigator.userAgent){this._setupMobileChecks();const e=navigator.userAgent;for(const t of E.ExceptionList){const n=t.key,s=t.targets;if(new RegExp(n).test(e)){if(t.capture&&t.captureConstraint){const i=t.capture,n=t.captureConstraint,s=new RegExp(i).exec(e);if(s&&s.length>0&&parseInt(s[s.length-1])>=n)continue}for(const e of s)switch(e){case"uniformBuffer":this.disableUniformBuffers=!0;break;case"vao":this.disableVertexArrayObjects=!0;break;case"antialias":i.antialias=!1;break;case"maxMSAASamples":this._maxMSAASamplesOverride=1}}}}if(this._doNotHandleContextLost||(this._onContextLost=e=>{e.preventDefault(),this._contextWasLost=!0,u.Y.Warn("WebGL context lost."),this.onContextLostObservable.notifyObservers(this)},this._onContextRestored=()=>{this._restoreEngineAfterContextLost(this._initGLContext.bind(this))},R.addEventListener("webglcontextlost",this._onContextLost,!1),R.addEventListener("webglcontextrestored",this._onContextRestored,!1),i.powerPreference=i.powerPreference||"high-performance"),this._badDesktopOS=/^((?!chrome|android).)*safari/i.test(navigator.userAgent),this._badDesktopOS&&(i.xrCompatible=!1),!i.disableWebGL2Support)try{this._gl=R.getContext("webgl2",i)||R.getContext("experimental-webgl2",i),this._gl&&(this._webGLVersion=2,this._shaderPlatformName="WEBGL2",this._gl.deleteQuery||(this._webGLVersion=1,this._shaderPlatformName="WEBGL1"))}catch(e){}if(!this._gl){if(!R)throw new Error("The provided canvas is null or undefined.");try{this._gl=R.getContext("webgl",i)||R.getContext("experimental-webgl",i)}catch(e){throw new Error("WebGL not supported")}}if(!this._gl)throw new Error("WebGL not supported")}else{this._gl=e,this._renderingCanvas=this._gl.canvas,this._gl.renderbufferStorageMultisample?(this._webGLVersion=2,this._shaderPlatformName="WEBGL2"):this._shaderPlatformName="WEBGL1";const t=this._gl.getContextAttributes();t&&(i.stencil=t.stencil)}this._gl.pixelStorei(this._gl.UNPACK_COLORSPACE_CONVERSION_WEBGL,this._gl.NONE),void 0!==i.useHighPrecisionFloats&&(this._highPrecisionShadersAllowed=i.useHighPrecisionFloats),this.resize(),this._initGLContext(),this._initFeatures();for(let e=0;e<this._caps.maxVertexAttribs;e++)this._currentBufferPointers[e]=new S;this._shaderProcessor=this.webGLVersion>1?new _.C:new f,this._badOS=/iPad/i.test(navigator.userAgent)||/iPhone/i.test(navigator.userAgent);const D=`Babylon.js v${E.Version}`;console.log(D+` - ${this.description}`),this._renderingCanvas&&this._renderingCanvas.setAttribute&&this._renderingCanvas.setAttribute("data-engine",D)}_setupMobileChecks(){navigator&&navigator.userAgent&&(this._checkForMobile=()=>{const e=navigator.userAgent;this.hostInformation.isMobile=-1!==e.indexOf("Mobile")||-1!==e.indexOf("Mac")&&(0,d.n5)()&&"ontouchend"in document},this._checkForMobile(),(0,d.CG)()&&window.addEventListener("resize",this._checkForMobile))}_restoreEngineAfterContextLost(e){setTimeout((async()=>{var t;this._dummyFramebuffer=null;const i=this._depthCullingState.depthTest,n=this._depthCullingState.depthFunc,s=this._depthCullingState.depthMask,r=this._stencilState.stencilTest;await e(),this.wipeCaches(!0),this._rebuildEffects(),null===(t=this._rebuildComputeEffects)||void 0===t||t.call(this),this._rebuildBuffers(),this._rebuildInternalTextures(),this._rebuildRenderTargetWrappers(),this.wipeCaches(!0),this._depthCullingState.depthTest=i,this._depthCullingState.depthFunc=n,this._depthCullingState.depthMask=s,this._stencilState.stencilTest=r,u.Y.Warn(this.name+" context successfully restored."),this.onContextRestoredObservable.notifyObservers(this),this._contextWasLost=!1}),0)}_sharedInit(e){this._renderingCanvas=e}_getShaderProcessingContext(e){return null}_rebuildInternalTextures(){const e=this._internalTexturesCache.slice();for(const t of e)t._rebuild()}_rebuildRenderTargetWrappers(){const e=this._renderTargetWrapperCache.slice();for(const t of e)t._rebuild()}_rebuildEffects(){for(const e in this._compiledEffects){const t=this._compiledEffects[e];t._pipelineContext=null,t._wasPreviouslyReady=!1,t._prepareEffect()}s.Q.ResetCache()}areAllEffectsReady(){for(const e in this._compiledEffects)if(!this._compiledEffects[e].isReady())return!1;return!0}_rebuildBuffers(){for(const e of this._uniformBuffers)e._rebuild();for(const e of this._storageBuffers)e._rebuild()}_initGLContext(){var e;this._caps={maxTexturesImageUnits:this._gl.getParameter(this._gl.MAX_TEXTURE_IMAGE_UNITS),maxCombinedTexturesImageUnits:this._gl.getParameter(this._gl.MAX_COMBINED_TEXTURE_IMAGE_UNITS),maxVertexTextureImageUnits:this._gl.getParameter(this._gl.MAX_VERTEX_TEXTURE_IMAGE_UNITS),maxTextureSize:this._gl.getParameter(this._gl.MAX_TEXTURE_SIZE),maxSamples:this._webGLVersion>1?this._gl.getParameter(this._gl.MAX_SAMPLES):1,maxCubemapTextureSize:this._gl.getParameter(this._gl.MAX_CUBE_MAP_TEXTURE_SIZE),maxRenderTextureSize:this._gl.getParameter(this._gl.MAX_RENDERBUFFER_SIZE),maxVertexAttribs:this._gl.getParameter(this._gl.MAX_VERTEX_ATTRIBS),maxVaryingVectors:this._gl.getParameter(this._gl.MAX_VARYING_VECTORS),maxFragmentUniformVectors:this._gl.getParameter(this._gl.MAX_FRAGMENT_UNIFORM_VECTORS),maxVertexUniformVectors:this._gl.getParameter(this._gl.MAX_VERTEX_UNIFORM_VECTORS),parallelShaderCompile:this._gl.getExtension("KHR_parallel_shader_compile")||void 0,standardDerivatives:this._webGLVersion>1||null!==this._gl.getExtension("OES_standard_derivatives"),maxAnisotropy:1,astc:this._gl.getExtension("WEBGL_compressed_texture_astc")||this._gl.getExtension("WEBKIT_WEBGL_compressed_texture_astc"),bptc:this._gl.getExtension("EXT_texture_compression_bptc")||this._gl.getExtension("WEBKIT_EXT_texture_compression_bptc"),s3tc:this._gl.getExtension("WEBGL_compressed_texture_s3tc")||this._gl.getExtension("WEBKIT_WEBGL_compressed_texture_s3tc"),s3tc_srgb:this._gl.getExtension("WEBGL_compressed_texture_s3tc_srgb")||this._gl.getExtension("WEBKIT_WEBGL_compressed_texture_s3tc_srgb"),pvrtc:this._gl.getExtension("WEBGL_compressed_texture_pvrtc")||this._gl.getExtension("WEBKIT_WEBGL_compressed_texture_pvrtc"),etc1:this._gl.getExtension("WEBGL_compressed_texture_etc1")||this._gl.getExtension("WEBKIT_WEBGL_compressed_texture_etc1"),etc2:this._gl.getExtension("WEBGL_compressed_texture_etc")||this._gl.getExtension("WEBKIT_WEBGL_compressed_texture_etc")||this._gl.getExtension("WEBGL_compressed_texture_es3_0"),textureAnisotropicFilterExtension:this._gl.getExtension("EXT_texture_filter_anisotropic")||this._gl.getExtension("WEBKIT_EXT_texture_filter_anisotropic")||this._gl.getExtension("MOZ_EXT_texture_filter_anisotropic"),uintIndices:this._webGLVersion>1||null!==this._gl.getExtension("OES_element_index_uint"),fragmentDepthSupported:this._webGLVersion>1||null!==this._gl.getExtension("EXT_frag_depth"),highPrecisionShaderSupported:!1,timerQuery:this._gl.getExtension("EXT_disjoint_timer_query_webgl2")||this._gl.getExtension("EXT_disjoint_timer_query"),supportOcclusionQuery:this._webGLVersion>1,canUseTimestampForTimerQuery:!1,drawBuffersExtension:!1,maxMSAASamples:1,colorBufferFloat:!!(this._webGLVersion>1&&this._gl.getExtension("EXT_color_buffer_float")),textureFloat:!!(this._webGLVersion>1||this._gl.getExtension("OES_texture_float")),textureHalfFloat:!!(this._webGLVersion>1||this._gl.getExtension("OES_texture_half_float")),textureHalfFloatRender:!1,textureFloatLinearFiltering:!1,textureFloatRender:!1,textureHalfFloatLinearFiltering:!1,vertexArrayObject:!1,instancedArrays:!1,textureLOD:!!(this._webGLVersion>1||this._gl.getExtension("EXT_shader_texture_lod")),texelFetch:1!==this._webGLVersion,blendMinMax:!1,multiview:this._gl.getExtension("OVR_multiview2"),oculusMultiview:this._gl.getExtension("OCULUS_multiview"),depthTextureExtension:!1,canUseGLInstanceID:this._webGLVersion>1,canUseGLVertexID:this._webGLVersion>1,supportComputeShaders:!1,supportSRGBBuffers:!1,supportTransformFeedbacks:this._webGLVersion>1,textureMaxLevel:this._webGLVersion>1,texture2DArrayMaxLayerCount:this._webGLVersion>1?this._gl.getParameter(this._gl.MAX_ARRAY_TEXTURE_LAYERS):128,disableMorphTargetTexture:!1},this._glVersion=this._gl.getParameter(this._gl.VERSION);const t=this._gl.getExtension("WEBGL_debug_renderer_info");if(null!=t&&(this._glRenderer=this._gl.getParameter(t.UNMASKED_RENDERER_WEBGL),this._glVendor=this._gl.getParameter(t.UNMASKED_VENDOR_WEBGL)),this._glVendor||(this._glVendor=this._gl.getParameter(this._gl.VENDOR)||"Unknown vendor"),this._glRenderer||(this._glRenderer=this._gl.getParameter(this._gl.RENDERER)||"Unknown renderer"),36193!==this._gl.HALF_FLOAT_OES&&(this._gl.HALF_FLOAT_OES=36193),34842!==this._gl.RGBA16F&&(this._gl.RGBA16F=34842),34836!==this._gl.RGBA32F&&(this._gl.RGBA32F=34836),35056!==this._gl.DEPTH24_STENCIL8&&(this._gl.DEPTH24_STENCIL8=35056),this._caps.timerQuery&&(1===this._webGLVersion&&(this._gl.getQuery=this._caps.timerQuery.getQueryEXT.bind(this._caps.timerQuery)),this._caps.canUseTimestampForTimerQuery=(null!==(e=this._gl.getQuery(this._caps.timerQuery.TIMESTAMP_EXT,this._caps.timerQuery.QUERY_COUNTER_BITS_EXT))&&void 0!==e?e:0)>0),this._caps.maxAnisotropy=this._caps.textureAnisotropicFilterExtension?this._gl.getParameter(this._caps.textureAnisotropicFilterExtension.MAX_TEXTURE_MAX_ANISOTROPY_EXT):0,this._caps.textureFloatLinearFiltering=!(!this._caps.textureFloat||!this._gl.getExtension("OES_texture_float_linear")),this._caps.textureFloatRender=!(!this._caps.textureFloat||!this._canRenderToFloatFramebuffer()),this._caps.textureHalfFloatLinearFiltering=!!(this._webGLVersion>1||this._caps.textureHalfFloat&&this._gl.getExtension("OES_texture_half_float_linear")),this._caps.astc&&(this._gl.COMPRESSED_SRGB8_ALPHA8_ASTC_4x4_KHR=this._caps.astc.COMPRESSED_SRGB8_ALPHA8_ASTC_4x4_KHR),this._caps.bptc&&(this._gl.COMPRESSED_SRGB_ALPHA_BPTC_UNORM_EXT=this._caps.bptc.COMPRESSED_SRGB_ALPHA_BPTC_UNORM_EXT),this._caps.s3tc_srgb&&(this._gl.COMPRESSED_SRGB_S3TC_DXT1_EXT=this._caps.s3tc_srgb.COMPRESSED_SRGB_S3TC_DXT1_EXT,this._gl.COMPRESSED_SRGB_ALPHA_S3TC_DXT1_EXT=this._caps.s3tc_srgb.COMPRESSED_SRGB_ALPHA_S3TC_DXT1_EXT,this._gl.COMPRESSED_SRGB_ALPHA_S3TC_DXT5_EXT=this._caps.s3tc_srgb.COMPRESSED_SRGB_ALPHA_S3TC_DXT5_EXT),this._caps.etc2&&(this._gl.COMPRESSED_SRGB8_ETC2=this._caps.etc2.COMPRESSED_SRGB8_ETC2,this._gl.COMPRESSED_SRGB8_ALPHA8_ETC2_EAC=this._caps.etc2.COMPRESSED_SRGB8_ALPHA8_ETC2_EAC),this._webGLVersion>1&&5131!==this._gl.HALF_FLOAT_OES&&(this._gl.HALF_FLOAT_OES=5131),this._caps.textureHalfFloatRender=this._caps.textureHalfFloat&&this._canRenderToHalfFloatFramebuffer(),this._webGLVersion>1)this._caps.drawBuffersExtension=!0,this._caps.maxMSAASamples=null!==this._maxMSAASamplesOverride?this._maxMSAASamplesOverride:this._gl.getParameter(this._gl.MAX_SAMPLES);else{const e=this._gl.getExtension("WEBGL_draw_buffers");if(null!==e){this._caps.drawBuffersExtension=!0,this._gl.drawBuffers=e.drawBuffersWEBGL.bind(e),this._gl.DRAW_FRAMEBUFFER=this._gl.FRAMEBUFFER;for(let t=0;t<16;t++)this._gl["COLOR_ATTACHMENT"+t+"_WEBGL"]=e["COLOR_ATTACHMENT"+t+"_WEBGL"]}}if(this._webGLVersion>1)this._caps.depthTextureExtension=!0;else{const e=this._gl.getExtension("WEBGL_depth_texture");null!=e&&(this._caps.depthTextureExtension=!0,this._gl.UNSIGNED_INT_24_8=e.UNSIGNED_INT_24_8_WEBGL)}if(this.disableVertexArrayObjects)this._caps.vertexArrayObject=!1;else if(this._webGLVersion>1)this._caps.vertexArrayObject=!0;else{const e=this._gl.getExtension("OES_vertex_array_object");null!=e&&(this._caps.vertexArrayObject=!0,this._gl.createVertexArray=e.createVertexArrayOES.bind(e),this._gl.bindVertexArray=e.bindVertexArrayOES.bind(e),this._gl.deleteVertexArray=e.deleteVertexArrayOES.bind(e))}if(this._webGLVersion>1)this._caps.instancedArrays=!0;else{const e=this._gl.getExtension("ANGLE_instanced_arrays");null!=e?(this._caps.instancedArrays=!0,this._gl.drawArraysInstanced=e.drawArraysInstancedANGLE.bind(e),this._gl.drawElementsInstanced=e.drawElementsInstancedANGLE.bind(e),this._gl.vertexAttribDivisor=e.vertexAttribDivisorANGLE.bind(e)):this._caps.instancedArrays=!1}if(this._gl.getShaderPrecisionFormat){const e=this._gl.getShaderPrecisionFormat(this._gl.VERTEX_SHADER,this._gl.HIGH_FLOAT),t=this._gl.getShaderPrecisionFormat(this._gl.FRAGMENT_SHADER,this._gl.HIGH_FLOAT);e&&t&&(this._caps.highPrecisionShaderSupported=0!==e.precision&&0!==t.precision)}if(this._webGLVersion>1)this._caps.blendMinMax=!0;else{const e=this._gl.getExtension("EXT_blend_minmax");null!=e&&(this._caps.blendMinMax=!0,this._gl.MAX=e.MAX_EXT,this._gl.MIN=e.MIN_EXT)}if(!this._caps.supportSRGBBuffers){if(this._webGLVersion>1)this._caps.supportSRGBBuffers=!0,this._glSRGBExtensionValues={SRGB:WebGL2RenderingContext.SRGB,SRGB8:WebGL2RenderingContext.SRGB8,SRGB8_ALPHA8:WebGL2RenderingContext.SRGB8_ALPHA8};else{const e=this._gl.getExtension("EXT_sRGB");null!=e&&(this._caps.supportSRGBBuffers=!0,this._glSRGBExtensionValues={SRGB:e.SRGB_EXT,SRGB8:e.SRGB_ALPHA_EXT,SRGB8_ALPHA8:e.SRGB_ALPHA_EXT})}this._caps.supportSRGBBuffers=this._caps.supportSRGBBuffers&&!(!this._creationOptions||!this._creationOptions.forceSRGBBufferSupportState)}this._depthCullingState.depthTest=!0,this._depthCullingState.depthFunc=this._gl.LEQUAL,this._depthCullingState.depthMask=!0,this._maxSimultaneousTextures=this._caps.maxCombinedTexturesImageUnits;for(let e=0;e<this._maxSimultaneousTextures;e++)this._nextFreeTextureSlots.push(e);"Mali-G72"===this._glRenderer&&(this._caps.disableMorphTargetTexture=!0)}_initFeatures(){this._features={forceBitmapOverHTMLImageElement:!1,supportRenderAndCopyToLodForFloatTextures:1!==this._webGLVersion,supportDepthStencilTexture:1!==this._webGLVersion,supportShadowSamplers:1!==this._webGLVersion,uniformBufferHardCheckMatrix:!1,allowTexturePrefiltering:1!==this._webGLVersion,trackUbosInFrame:!1,checkUbosContentBeforeUpload:!1,supportCSM:1!==this._webGLVersion,basisNeedsPOT:1===this._webGLVersion,support3DTextures:1!==this._webGLVersion,needTypeSuffixInShaderConstants:1!==this._webGLVersion,supportMSAA:1!==this._webGLVersion,supportSSAO2:1!==this._webGLVersion,supportExtendedTextureFormats:1!==this._webGLVersion,supportSwitchCaseInShader:1!==this._webGLVersion,supportSyncTextureRead:!0,needsInvertingBitmap:!0,useUBOBindingCache:!0,needShaderCodeInlining:!1,needToAlwaysBindUniformBuffers:!1,supportRenderPasses:!1,supportSpriteInstancing:!0,_collectUbosUpdatedInFrame:!1}}get webGLVersion(){return this._webGLVersion}getClassName(){return"ThinEngine"}get isStencilEnable(){return this._isStencilEnable}_prepareWorkingCanvas(){if(this._workingCanvas)return;this._workingCanvas=this.createCanvas(1,1);const e=this._workingCanvas.getContext("2d");e&&(this._workingContext=e)}resetTextureCache(){for(const e in this._boundTexturesCache)Object.prototype.hasOwnProperty.call(this._boundTexturesCache,e)&&(this._boundTexturesCache[e]=null);this._currentTextureChannel=-1}getInfo(){return this.getGlInfo()}getGlInfo(){return{vendor:this._glVendor,renderer:this._glRenderer,version:this._glVersion}}setHardwareScalingLevel(e){this._hardwareScalingLevel=e,this.resize()}getHardwareScalingLevel(){return this._hardwareScalingLevel}getLoadedTexturesCache(){return this._internalTexturesCache}getCaps(){return this._caps}stopRenderLoop(e){if(!e)return void(this._activeRenderLoops.length=0);const t=this._activeRenderLoops.indexOf(e);t>=0&&this._activeRenderLoops.splice(t,1)}_renderLoop(){if(!this._contextWasLost){let e=!0;if((this._isDisposed||!this.renderEvenInBackground&&this._windowIsBackground)&&(e=!1),e){this.beginFrame();for(let e=0;e<this._activeRenderLoops.length;e++)(0,this._activeRenderLoops[e])();this.endFrame()}}this._activeRenderLoops.length>0?this._frameHandler=this._queueNewFrame(this._boundRenderFunction,this.getHostWindow()):this._renderingQueueLaunched=!1}getRenderingCanvas(){return this._renderingCanvas}getAudioContext(){return this._audioContext}getAudioDestination(){return this._audioDestination}getHostWindow(){return(0,d.CG)()?this._renderingCanvas&&this._renderingCanvas.ownerDocument&&this._renderingCanvas.ownerDocument.defaultView?this._renderingCanvas.ownerDocument.defaultView:window:null}getRenderWidth(e=!1){return!e&&this._currentRenderTarget?this._currentRenderTarget.width:this._framebufferDimensionsObject?this._framebufferDimensionsObject.framebufferWidth:this._gl.drawingBufferWidth}getRenderHeight(e=!1){return!e&&this._currentRenderTarget?this._currentRenderTarget.height:this._framebufferDimensionsObject?this._framebufferDimensionsObject.framebufferHeight:this._gl.drawingBufferHeight}_queueNewFrame(e,t){return E.QueueNewFrame(e,t)}runRenderLoop(e){-1===this._activeRenderLoops.indexOf(e)&&(this._activeRenderLoops.push(e),this._renderingQueueLaunched||(this._renderingQueueLaunched=!0,this._boundRenderFunction=this._renderLoop.bind(this),this._frameHandler=this._queueNewFrame(this._boundRenderFunction,this.getHostWindow())))}clear(e,t,i,n=!1){const s=this.stencilStateComposer.useStencilGlobalOnly;this.stencilStateComposer.useStencilGlobalOnly=!0,this.applyStates(),this.stencilStateComposer.useStencilGlobalOnly=s;let r=0;t&&e&&(this._gl.clearColor(e.r,e.g,e.b,void 0!==e.a?e.a:1),r|=this._gl.COLOR_BUFFER_BIT),i&&(this.useReverseDepthBuffer?(this._depthCullingState.depthFunc=this._gl.GEQUAL,this._gl.clearDepth(0)):this._gl.clearDepth(1),r|=this._gl.DEPTH_BUFFER_BIT),n&&(this._gl.clearStencil(0),r|=this._gl.STENCIL_BUFFER_BIT),this._gl.clear(r)}_viewport(e,t,i,n){e===this._viewportCached.x&&t===this._viewportCached.y&&i===this._viewportCached.z&&n===this._viewportCached.w||(this._viewportCached.x=e,this._viewportCached.y=t,this._viewportCached.z=i,this._viewportCached.w=n,this._gl.viewport(e,t,i,n))}setViewport(e,t,i){const n=t||this.getRenderWidth(),s=i||this.getRenderHeight(),r=e.x||0,o=e.y||0;this._cachedViewport=e,this._viewport(r*n,o*s,n*e.width,s*e.height)}beginFrame(){}endFrame(){this._badOS&&this.flushFramebuffer(),this._frameId++}resize(e=!1){let t,i;if(this.adaptToDeviceRatio){const e=(0,d.CG)()&&window.devicePixelRatio||1,t=this._lastDevicePixelRatio/e;this._lastDevicePixelRatio=e,this._hardwareScalingLevel*=t}if((0,d.CG)())if(this._renderingCanvas){const e=this._renderingCanvas.getBoundingClientRect?this._renderingCanvas.getBoundingClientRect():{width:this._renderingCanvas.width*this._hardwareScalingLevel,height:this._renderingCanvas.height*this._hardwareScalingLevel};t=this._renderingCanvas.clientWidth||e.width,i=this._renderingCanvas.clientHeight||e.height}else t=window.innerWidth,i=window.innerHeight;else t=this._renderingCanvas?this._renderingCanvas.width:100,i=this._renderingCanvas?this._renderingCanvas.height:100;this.setSize(t/this._hardwareScalingLevel,i/this._hardwareScalingLevel,e)}setSize(e,t,i=!1){return!(!this._renderingCanvas||(e|=0,t|=0,!i&&this._renderingCanvas.width===e&&this._renderingCanvas.height===t||(this._renderingCanvas.width=e,this._renderingCanvas.height=t,0)))}bindFramebuffer(e,t=0,i,n,s,r=0,o=0){var a,l,h,c,u;const d=e;this._currentRenderTarget&&this.unBindFramebuffer(this._currentRenderTarget),this._currentRenderTarget=e,this._bindUnboundFramebuffer(d._MSAAFramebuffer?d._MSAAFramebuffer:d._framebuffer);const p=this._gl;e.isMulti||(e.is2DArray?p.framebufferTextureLayer(p.FRAMEBUFFER,p.COLOR_ATTACHMENT0,null===(a=e.texture._hardwareTexture)||void 0===a?void 0:a.underlyingResource,r,o):e.isCube&&p.framebufferTexture2D(p.FRAMEBUFFER,p.COLOR_ATTACHMENT0,p.TEXTURE_CUBE_MAP_POSITIVE_X+t,null===(l=e.texture._hardwareTexture)||void 0===l?void 0:l.underlyingResource,r));const f=e._depthStencilTexture;if(f){const i=e._depthStencilTextureWithStencil?p.DEPTH_STENCIL_ATTACHMENT:p.DEPTH_ATTACHMENT;e.is2DArray?p.framebufferTextureLayer(p.FRAMEBUFFER,i,null===(h=f._hardwareTexture)||void 0===h?void 0:h.underlyingResource,r,o):e.isCube?p.framebufferTexture2D(p.FRAMEBUFFER,i,p.TEXTURE_CUBE_MAP_POSITIVE_X+t,null===(c=f._hardwareTexture)||void 0===c?void 0:c.underlyingResource,r):p.framebufferTexture2D(p.FRAMEBUFFER,i,p.TEXTURE_2D,null===(u=f._hardwareTexture)||void 0===u?void 0:u.underlyingResource,r)}this._cachedViewport&&!s?this.setViewport(this._cachedViewport,i,n):(i||(i=e.width,r&&(i/=Math.pow(2,r))),n||(n=e.height,r&&(n/=Math.pow(2,r))),this._viewport(0,0,i,n)),this.wipeCaches()}setState(e,t=0,i,n=!1,s,r,o=0){var a,l;(this._depthCullingState.cull!==e||i)&&(this._depthCullingState.cull=e);const h=null===(l=null!==(a=this.cullBackFaces)&&void 0!==a?a:s)||void 0===l||l?this._gl.BACK:this._gl.FRONT;(this._depthCullingState.cullFace!==h||i)&&(this._depthCullingState.cullFace=h),this.setZOffset(t),this.setZOffsetUnits(o);const c=n?this._gl.CW:this._gl.CCW;(this._depthCullingState.frontFace!==c||i)&&(this._depthCullingState.frontFace=c),this._stencilStateComposer.stencilMaterial=r}getDepthBuffer(){return this._depthCullingState.depthTest}setDepthBuffer(e){this._depthCullingState.depthTest=e}setZOffset(e){this._depthCullingState.zOffset=this.useReverseDepthBuffer?-e:e}getZOffset(){const e=this._depthCullingState.zOffset;return this.useReverseDepthBuffer?-e:e}setZOffsetUnits(e){this._depthCullingState.zOffsetUnits=this.useReverseDepthBuffer?-e:e}getZOffsetUnits(){const e=this._depthCullingState.zOffsetUnits;return this.useReverseDepthBuffer?-e:e}_bindUnboundFramebuffer(e){this._currentFramebuffer!==e&&(this._gl.bindFramebuffer(this._gl.FRAMEBUFFER,e),this._currentFramebuffer=e)}_currentFrameBufferIsDefaultFrameBuffer(){return null===this._currentFramebuffer}generateMipmaps(e){this._bindTextureDirectly(this._gl.TEXTURE_2D,e,!0),this._gl.generateMipmap(this._gl.TEXTURE_2D),this._bindTextureDirectly(this._gl.TEXTURE_2D,null)}unBindFramebuffer(e,t=!1,i){var n;const s=e;this._currentRenderTarget=null;const r=this._gl;if(s._MSAAFramebuffer){if(e.isMulti)return void this.unBindMultiColorAttachmentFramebuffer(e,t,i);r.bindFramebuffer(r.READ_FRAMEBUFFER,s._MSAAFramebuffer),r.bindFramebuffer(r.DRAW_FRAMEBUFFER,s._framebuffer),r.blitFramebuffer(0,0,e.width,e.height,0,0,e.width,e.height,r.COLOR_BUFFER_BIT,r.NEAREST)}!(null===(n=e.texture)||void 0===n?void 0:n.generateMipMaps)||t||e.isCube||this.generateMipmaps(e.texture),i&&(s._MSAAFramebuffer&&this._bindUnboundFramebuffer(s._framebuffer),i()),this._bindUnboundFramebuffer(null)}flushFramebuffer(){this._gl.flush()}restoreDefaultFramebuffer(){this._currentRenderTarget?this.unBindFramebuffer(this._currentRenderTarget):this._bindUnboundFramebuffer(null),this._cachedViewport&&this.setViewport(this._cachedViewport),this.wipeCaches()}_resetVertexBufferBinding(){this.bindArrayBuffer(null),this._cachedVertexBuffers=null}createVertexBuffer(e){return this._createVertexBuffer(e,this._gl.STATIC_DRAW)}_createVertexBuffer(e,t){const i=this._gl.createBuffer();if(!i)throw new Error("Unable to create vertex buffer");const n=new m.M(i);return this.bindArrayBuffer(n),e instanceof Array?this._gl.bufferData(this._gl.ARRAY_BUFFER,new Float32Array(e),t):this._gl.bufferData(this._gl.ARRAY_BUFFER,e,t),this._resetVertexBufferBinding(),n.references=1,n}createDynamicVertexBuffer(e){return this._createVertexBuffer(e,this._gl.DYNAMIC_DRAW)}_resetIndexBufferBinding(){this.bindIndexBuffer(null),this._cachedIndexBuffer=null}createIndexBuffer(e,t){const i=this._gl.createBuffer(),n=new m.M(i);if(!i)throw new Error("Unable to create index buffer");this.bindIndexBuffer(n);const s=this._normalizeIndexData(e);return this._gl.bufferData(this._gl.ELEMENT_ARRAY_BUFFER,s,t?this._gl.DYNAMIC_DRAW:this._gl.STATIC_DRAW),this._resetIndexBufferBinding(),n.references=1,n.is32Bits=4===s.BYTES_PER_ELEMENT,n}_normalizeIndexData(e){if(2===e.BYTES_PER_ELEMENT)return e;if(this._caps.uintIndices){if(e instanceof Uint32Array)return e;for(let t=0;t<e.length;t++)if(e[t]>=65535)return new Uint32Array(e);return new Uint16Array(e)}return new Uint16Array(e)}bindArrayBuffer(e){this._vaoRecordInProgress||this._unbindVertexArrayObject(),this._bindBuffer(e,this._gl.ARRAY_BUFFER)}bindUniformBlock(e,t,i){const n=e.program,s=this._gl.getUniformBlockIndex(n,t);this._gl.uniformBlockBinding(n,s,i)}bindIndexBuffer(e){this._vaoRecordInProgress||this._unbindVertexArrayObject(),this._bindBuffer(e,this._gl.ELEMENT_ARRAY_BUFFER)}_bindBuffer(e,t){(this._vaoRecordInProgress||this._currentBoundBuffer[t]!==e)&&(this._gl.bindBuffer(t,e?e.underlyingResource:null),this._currentBoundBuffer[t]=e)}updateArrayBuffer(e){this._gl.bufferSubData(this._gl.ARRAY_BUFFER,0,e)}_vertexAttribPointer(e,t,i,n,s,r,o){const a=this._currentBufferPointers[t];if(!a)return;let l=!1;a.active?(a.buffer!==e&&(a.buffer=e,l=!0),a.size!==i&&(a.size=i,l=!0),a.type!==n&&(a.type=n,l=!0),a.normalized!==s&&(a.normalized=s,l=!0),a.stride!==r&&(a.stride=r,l=!0),a.offset!==o&&(a.offset=o,l=!0)):(l=!0,a.active=!0,a.index=t,a.size=i,a.type=n,a.normalized=s,a.stride=r,a.offset=o,a.buffer=e),(l||this._vaoRecordInProgress)&&(this.bindArrayBuffer(e),n===this._gl.UNSIGNED_INT||n===this._gl.INT?this._gl.vertexAttribIPointer(t,i,n,r,o):this._gl.vertexAttribPointer(t,i,n,s,r,o))}_bindIndexBufferWithCache(e){null!=e&&this._cachedIndexBuffer!==e&&(this._cachedIndexBuffer=e,this.bindIndexBuffer(e),this._uintIndicesCurrentlySet=e.is32Bits)}_bindVertexBuffersAttributes(e,t,i){const n=t.getAttributesNames();this._vaoRecordInProgress||this._unbindVertexArrayObject(),this.unbindAllAttributes();for(let s=0;s<n.length;s++){const r=t.getAttributeLocation(s);if(r>=0){const t=n[s];let o=null;if(i&&(o=i[t]),o||(o=e[t]),!o)continue;this._gl.enableVertexAttribArray(r),this._vaoRecordInProgress||(this._vertexAttribArraysEnabled[r]=!0);const a=o.getBuffer();a&&(this._vertexAttribPointer(a,r,o.getSize(),o.type,o.normalized,o.byteStride,o.byteOffset),o.getIsInstanced()&&(this._gl.vertexAttribDivisor(r,o.getInstanceDivisor()),this._vaoRecordInProgress||(this._currentInstanceLocations.push(r),this._currentInstanceBuffers.push(a))))}}}recordVertexArrayObject(e,t,i,n){const s=this._gl.createVertexArray();if(!s)throw new Error("Unable to create VAO");return this._vaoRecordInProgress=!0,this._gl.bindVertexArray(s),this._mustWipeVertexAttributes=!0,this._bindVertexBuffersAttributes(e,i,n),this.bindIndexBuffer(t),this._vaoRecordInProgress=!1,this._gl.bindVertexArray(null),s}bindVertexArrayObject(e,t){this._cachedVertexArrayObject!==e&&(this._cachedVertexArrayObject=e,this._gl.bindVertexArray(e),this._cachedVertexBuffers=null,this._cachedIndexBuffer=null,this._uintIndicesCurrentlySet=null!=t&&t.is32Bits,this._mustWipeVertexAttributes=!0)}bindBuffersDirectly(e,t,i,n,s){if(this._cachedVertexBuffers!==e||this._cachedEffectForVertexBuffers!==s){this._cachedVertexBuffers=e,this._cachedEffectForVertexBuffers=s;const t=s.getAttributesCount();this._unbindVertexArrayObject(),this.unbindAllAttributes();let r=0;for(let o=0;o<t;o++)if(o<i.length){const t=s.getAttributeLocation(o);t>=0&&(this._gl.enableVertexAttribArray(t),this._vertexAttribArraysEnabled[t]=!0,this._vertexAttribPointer(e,t,i[o],this._gl.FLOAT,!1,n,r)),r+=4*i[o]}}this._bindIndexBufferWithCache(t)}_unbindVertexArrayObject(){this._cachedVertexArrayObject&&(this._cachedVertexArrayObject=null,this._gl.bindVertexArray(null))}bindBuffers(e,t,i,n){this._cachedVertexBuffers===e&&this._cachedEffectForVertexBuffers===i||(this._cachedVertexBuffers=e,this._cachedEffectForVertexBuffers=i,this._bindVertexBuffersAttributes(e,i,n)),this._bindIndexBufferWithCache(t)}unbindInstanceAttributes(){let e;for(let t=0,i=this._currentInstanceLocations.length;t<i;t++){const i=this._currentInstanceBuffers[t];e!=i&&i.references&&(e=i,this.bindArrayBuffer(i));const n=this._currentInstanceLocations[t];this._gl.vertexAttribDivisor(n,0)}this._currentInstanceBuffers.length=0,this._currentInstanceLocations.length=0}releaseVertexArrayObject(e){this._gl.deleteVertexArray(e)}_releaseBuffer(e){return e.references--,0===e.references&&(this._deleteBuffer(e),!0)}_deleteBuffer(e){this._gl.deleteBuffer(e.underlyingResource)}updateAndBindInstancesBuffer(e,t,i){if(this.bindArrayBuffer(e),t&&this._gl.bufferSubData(this._gl.ARRAY_BUFFER,0,t),void 0!==i[0].index)this.bindInstancesBuffer(e,i,!0);else for(let t=0;t<4;t++){const n=i[t];this._vertexAttribArraysEnabled[n]||(this._gl.enableVertexAttribArray(n),this._vertexAttribArraysEnabled[n]=!0),this._vertexAttribPointer(e,n,4,this._gl.FLOAT,!1,64,16*t),this._gl.vertexAttribDivisor(n,1),this._currentInstanceLocations.push(n),this._currentInstanceBuffers.push(e)}}bindInstancesBuffer(e,t,i=!0){this.bindArrayBuffer(e);let n=0;if(i)for(let e=0;e<t.length;e++)n+=4*t[e].attributeSize;for(let i=0;i<t.length;i++){const s=t[i];void 0===s.index&&(s.index=this._currentEffect.getAttributeLocationByName(s.attributeName)),s.index<0||(this._vertexAttribArraysEnabled[s.index]||(this._gl.enableVertexAttribArray(s.index),this._vertexAttribArraysEnabled[s.index]=!0),this._vertexAttribPointer(e,s.index,s.attributeSize,s.attributeType||this._gl.FLOAT,s.normalized||!1,n,s.offset),this._gl.vertexAttribDivisor(s.index,void 0===s.divisor?1:s.divisor),this._currentInstanceLocations.push(s.index),this._currentInstanceBuffers.push(e))}}disableInstanceAttributeByName(e){if(!this._currentEffect)return;const t=this._currentEffect.getAttributeLocationByName(e);this.disableInstanceAttribute(t)}disableInstanceAttribute(e){let t,i=!1;for(;-1!==(t=this._currentInstanceLocations.indexOf(e));)this._currentInstanceLocations.splice(t,1),this._currentInstanceBuffers.splice(t,1),i=!0,t=this._currentInstanceLocations.indexOf(e);i&&(this._gl.vertexAttribDivisor(e,0),this.disableAttributeByIndex(e))}disableAttributeByIndex(e){this._gl.disableVertexAttribArray(e),this._vertexAttribArraysEnabled[e]=!1,this._currentBufferPointers[e].active=!1}draw(e,t,i,n){this.drawElementsType(e?0:1,t,i,n)}drawPointClouds(e,t,i){this.drawArraysType(2,e,t,i)}drawUnIndexed(e,t,i,n){this.drawArraysType(e?0:1,t,i,n)}drawElementsType(e,t,i,n){this.applyStates(),this._reportDrawCall();const s=this._drawMode(e),r=this._uintIndicesCurrentlySet?this._gl.UNSIGNED_INT:this._gl.UNSIGNED_SHORT,o=this._uintIndicesCurrentlySet?4:2;n?this._gl.drawElementsInstanced(s,i,r,t*o,n):this._gl.drawElements(s,i,r,t*o)}drawArraysType(e,t,i,n){this.applyStates(),this._reportDrawCall();const s=this._drawMode(e);n?this._gl.drawArraysInstanced(s,t,i,n):this._gl.drawArrays(s,t,i)}_drawMode(e){switch(e){case 0:default:return this._gl.TRIANGLES;case 2:case 3:return this._gl.POINTS;case 1:case 4:return this._gl.LINES;case 5:return this._gl.LINE_LOOP;case 6:return this._gl.LINE_STRIP;case 7:return this._gl.TRIANGLE_STRIP;case 8:return this._gl.TRIANGLE_FAN}}_reportDrawCall(){}_releaseEffect(e){this._compiledEffects[e._key]&&delete this._compiledEffects[e._key];const t=e.getPipelineContext();t&&this._deletePipelineContext(t)}_deletePipelineContext(e){const t=e;t&&t.program&&(t.program.__SPECTOR_rebuildProgram=null,this._gl.deleteProgram(t.program))}_getGlobalDefines(e){if(e)return this.isNDCHalfZRange?e.IS_NDC_HALF_ZRANGE="":delete e.IS_NDC_HALF_ZRANGE,this.useReverseDepthBuffer?e.USE_REVERSE_DEPTHBUFFER="":delete e.USE_REVERSE_DEPTHBUFFER,void(this.useExactSrgbConversions?e.USE_EXACT_SRGB_CONVERSIONS="":delete e.USE_EXACT_SRGB_CONVERSIONS);{let e="";return this.isNDCHalfZRange&&(e+="#define IS_NDC_HALF_ZRANGE"),this.useReverseDepthBuffer&&(e&&(e+="\n"),e+="#define USE_REVERSE_DEPTHBUFFER"),this.useExactSrgbConversions&&(e&&(e+="\n"),e+="#define USE_EXACT_SRGB_CONVERSIONS"),e}}createEffect(e,t,i,n,r,o,a,l,h,c=p.x.GLSL){var u;const d=e.vertexElement||e.vertex||e.vertexToken||e.vertexSource||e,f=e.fragmentElement||e.fragment||e.fragmentToken||e.fragmentSource||e,_=this._getGlobalDefines();let m=null!==(u=null!=r?r:t.defines)&&void 0!==u?u:"";_&&(m+=_);const g=d+"+"+f+"@"+m;if(this._compiledEffects[g]){const e=this._compiledEffects[g];return a&&e.isReady()&&a(e),e}const v=new s.Q(e,t,i,n,this,r,o,a,l,h,g,c);return this._compiledEffects[g]=v,v}static _ConcatenateShader(e,t,i=""){return i+(t?t+"\n":"")+e}_compileShader(e,t,i,n){return this._compileRawShader(E._ConcatenateShader(e,i,n),t)}_compileRawShader(e,t){const i=this._gl,n=i.createShader("vertex"===t?i.VERTEX_SHADER:i.FRAGMENT_SHADER);if(!n){let e=i.NO_ERROR,n=i.NO_ERROR;for(;(n=i.getError())!==i.NO_ERROR;)e=n;throw new Error(`Something went wrong while creating a gl ${t} shader object. gl error=${e}, gl isContextLost=${i.isContextLost()}, _contextWasLost=${this._contextWasLost}`)}return i.shaderSource(n,e),i.compileShader(n),n}_getShaderSource(e){return this._gl.getShaderSource(e)}createRawShaderProgram(e,t,i,n,s=null){n=n||this._gl;const r=this._compileRawShader(t,"vertex"),o=this._compileRawShader(i,"fragment");return this._createShaderProgram(e,r,o,n,s)}createShaderProgram(e,t,i,n,s,r=null){s=s||this._gl;const o=this._webGLVersion>1?"#version 300 es\n#define WEBGL2 \n":"",a=this._compileShader(t,"vertex",n,o),l=this._compileShader(i,"fragment",n,o);return this._createShaderProgram(e,a,l,s,r)}inlineShaderCode(e){return e}createPipelineContext(e){const t=new g.y;return t.engine=this,this._caps.parallelShaderCompile&&(t.isParallelCompiled=!0),t}createMaterialContext(){}createDrawContext(){}_createShaderProgram(e,t,i,n,s=null){const r=n.createProgram();if(e.program=r,!r)throw new Error("Unable to create program");return n.attachShader(r,t),n.attachShader(r,i),n.linkProgram(r),e.context=n,e.vertexShader=t,e.fragmentShader=i,e.isParallelCompiled||this._finalizePipelineContext(e),r}_finalizePipelineContext(e){const t=e.context,i=e.vertexShader,n=e.fragmentShader,s=e.program;if(!t.getProgramParameter(s,t.LINK_STATUS)){if(!this._gl.getShaderParameter(i,this._gl.COMPILE_STATUS)){const t=this._gl.getShaderInfoLog(i);if(t)throw e.vertexCompilationError=t,new Error("VERTEX SHADER "+t)}if(!this._gl.getShaderParameter(n,this._gl.COMPILE_STATUS)){const t=this._gl.getShaderInfoLog(n);if(t)throw e.fragmentCompilationError=t,new Error("FRAGMENT SHADER "+t)}const r=t.getProgramInfoLog(s);if(r)throw e.programLinkError=r,new Error(r)}if(this.validateShaderPrograms&&(t.validateProgram(s),!t.getProgramParameter(s,t.VALIDATE_STATUS))){const i=t.getProgramInfoLog(s);if(i)throw e.programValidationError=i,new Error(i)}t.deleteShader(i),t.deleteShader(n),e.vertexShader=void 0,e.fragmentShader=void 0,e.onCompiled&&(e.onCompiled(),e.onCompiled=void 0)}_preparePipelineContext(e,t,i,n,s,r,o,a,l,h){const c=e;c.program=n?this.createRawShaderProgram(c,t,i,void 0,l):this.createShaderProgram(c,t,i,a,void 0,l),c.program.__SPECTOR_rebuildProgram=o}_isRenderingStateCompiled(e){const t=e;return!!this._gl.getProgramParameter(t.program,this._caps.parallelShaderCompile.COMPLETION_STATUS_KHR)&&(this._finalizePipelineContext(t),!0)}_executeWhenRenderingStateIsCompiled(e,t){const i=e;if(!i.isParallelCompiled)return void t();const n=i.onCompiled;i.onCompiled=n?()=>{n(),t()}:t}getUniforms(e,t){const i=new Array,n=e;for(let e=0;e<t.length;e++)i.push(this._gl.getUniformLocation(n.program,t[e]));return i}getAttributes(e,t){const i=[],n=e;for(let e=0;e<t.length;e++)try{i.push(this._gl.getAttribLocation(n.program,t[e]))}catch(e){i.push(-1)}return i}enableEffect(e){(e=null!==e&&x.q.IsWrapper(e)?e.effect:e)&&e!==this._currentEffect&&(this._stencilStateComposer.stencilMaterial=void 0,this.bindSamplers(e),this._currentEffect=e,e.onBind&&e.onBind(e),e._onBindObservable&&e._onBindObservable.notifyObservers(e))}setInt(e,t){return!!e&&(this._gl.uniform1i(e,t),!0)}setInt2(e,t,i){return!!e&&(this._gl.uniform2i(e,t,i),!0)}setInt3(e,t,i,n){return!!e&&(this._gl.uniform3i(e,t,i,n),!0)}setInt4(e,t,i,n,s){return!!e&&(this._gl.uniform4i(e,t,i,n,s),!0)}setIntArray(e,t){return!!e&&(this._gl.uniform1iv(e,t),!0)}setIntArray2(e,t){return!(!e||t.length%2!=0||(this._gl.uniform2iv(e,t),0))}setIntArray3(e,t){return!(!e||t.length%3!=0||(this._gl.uniform3iv(e,t),0))}setIntArray4(e,t){return!(!e||t.length%4!=0||(this._gl.uniform4iv(e,t),0))}setUInt(e,t){return!!e&&(this._gl.uniform1ui(e,t),!0)}setUInt2(e,t,i){return!!e&&(this._gl.uniform2ui(e,t,i),!0)}setUInt3(e,t,i,n){return!!e&&(this._gl.uniform3ui(e,t,i,n),!0)}setUInt4(e,t,i,n,s){return!!e&&(this._gl.uniform4ui(e,t,i,n,s),!0)}setUIntArray(e,t){return!!e&&(this._gl.uniform1uiv(e,t),!0)}setUIntArray2(e,t){return!(!e||t.length%2!=0||(this._gl.uniform2uiv(e,t),0))}setUIntArray3(e,t){return!(!e||t.length%3!=0||(this._gl.uniform3uiv(e,t),0))}setUIntArray4(e,t){return!(!e||t.length%4!=0||(this._gl.uniform4uiv(e,t),0))}setArray(e,t){return!(!e||t.length<1||(this._gl.uniform1fv(e,t),0))}setArray2(e,t){return!(!e||t.length%2!=0||(this._gl.uniform2fv(e,t),0))}setArray3(e,t){return!(!e||t.length%3!=0||(this._gl.uniform3fv(e,t),0))}setArray4(e,t){return!(!e||t.length%4!=0||(this._gl.uniform4fv(e,t),0))}setMatrices(e,t){return!!e&&(this._gl.uniformMatrix4fv(e,!1,t),!0)}setMatrix3x3(e,t){return!!e&&(this._gl.uniformMatrix3fv(e,!1,t),!0)}setMatrix2x2(e,t){return!!e&&(this._gl.uniformMatrix2fv(e,!1,t),!0)}setFloat(e,t){return!!e&&(this._gl.uniform1f(e,t),!0)}setFloat2(e,t,i){return!!e&&(this._gl.uniform2f(e,t,i),!0)}setFloat3(e,t,i,n){return!!e&&(this._gl.uniform3f(e,t,i,n),!0)}setFloat4(e,t,i,n,s){return!!e&&(this._gl.uniform4f(e,t,i,n,s),!0)}applyStates(){if(this._depthCullingState.apply(this._gl),this._stencilStateComposer.apply(this._gl),this._alphaState.apply(this._gl),this._colorWriteChanged){this._colorWriteChanged=!1;const e=this._colorWrite;this._gl.colorMask(e,e,e,e)}}setColorWrite(e){e!==this._colorWrite&&(this._colorWriteChanged=!0,this._colorWrite=e)}getColorWrite(){return this._colorWrite}get depthCullingState(){return this._depthCullingState}get alphaState(){return this._alphaState}get stencilState(){return this._stencilState}get stencilStateComposer(){return this._stencilStateComposer}clearInternalTexturesCache(){this._internalTexturesCache.length=0}wipeCaches(e){this.preventCacheWipeBetweenFrames&&!e||(this._currentEffect=null,this._viewportCached.x=0,this._viewportCached.y=0,this._viewportCached.z=0,this._viewportCached.w=0,this._unbindVertexArrayObject(),e&&(this._currentProgram=null,this.resetTextureCache(),this._stencilStateComposer.reset(),this._depthCullingState.reset(),this._depthCullingState.depthFunc=this._gl.LEQUAL,this._alphaState.reset(),this._alphaMode=1,this._alphaEquation=0,this._colorWrite=!0,this._colorWriteChanged=!0,this._unpackFlipYCached=null,this._gl.pixelStorei(this._gl.UNPACK_COLORSPACE_CONVERSION_WEBGL,this._gl.NONE),this._gl.pixelStorei(this._gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL,0),this._mustWipeVertexAttributes=!0,this.unbindAllAttributes()),this._resetVertexBufferBinding(),this._cachedIndexBuffer=null,this._cachedEffectForVertexBuffers=null,this.bindIndexBuffer(null))}_getSamplingParameters(e,t){const i=this._gl;let n=i.NEAREST,s=i.NEAREST;switch(e){case 11:n=i.LINEAR,s=t?i.LINEAR_MIPMAP_NEAREST:i.LINEAR;break;case 3:n=i.LINEAR,s=t?i.LINEAR_MIPMAP_LINEAR:i.LINEAR;break;case 8:n=i.NEAREST,s=t?i.NEAREST_MIPMAP_LINEAR:i.NEAREST;break;case 4:n=i.NEAREST,s=t?i.NEAREST_MIPMAP_NEAREST:i.NEAREST;break;case 5:n=i.NEAREST,s=t?i.LINEAR_MIPMAP_NEAREST:i.LINEAR;break;case 6:n=i.NEAREST,s=t?i.LINEAR_MIPMAP_LINEAR:i.LINEAR;break;case 7:n=i.NEAREST,s=i.LINEAR;break;case 1:n=i.NEAREST,s=i.NEAREST;break;case 9:n=i.LINEAR,s=t?i.NEAREST_MIPMAP_NEAREST:i.NEAREST;break;case 10:n=i.LINEAR,s=t?i.NEAREST_MIPMAP_LINEAR:i.NEAREST;break;case 2:n=i.LINEAR,s=i.LINEAR;break;case 12:n=i.LINEAR,s=i.NEAREST}return{min:s,mag:n}}_createTexture(){const e=this._gl.createTexture();if(!e)throw new Error("Unable to create texture");return e}_createHardwareTexture(){return new y.B(this._createTexture(),this._gl)}_createInternalTexture(e,t,i=!0,n=c.S.Unknown){var s;let r,o=!1,a=0,l=3,h=5,d=!1,p=1;void 0!==t&&"object"==typeof t?(o=!!t.generateMipMaps,a=void 0===t.type?0:t.type,l=void 0===t.samplingMode?3:t.samplingMode,h=void 0===t.format?5:t.format,d=void 0!==t.useSRGBBuffer&&t.useSRGBBuffer,p=null!==(s=t.samples)&&void 0!==s?s:1,r=t.label):o=!!t,d&&(d=this._caps.supportSRGBBuffers&&(this.webGLVersion>1||this.isWebGPU)),(1!==a||this._caps.textureFloatLinearFiltering)&&(2!==a||this._caps.textureHalfFloatLinearFiltering)||(l=1),1!==a||this._caps.textureFloat||(a=0,u.Y.Warn("Float textures are not supported. Type forced to TEXTURETYPE_UNSIGNED_BYTE"));const f=this._gl,_=new c.l(this,n),m=e.width||e,g=e.height||e,v=e.layers||0,y=this._getSamplingParameters(l,o),x=0!==v?f.TEXTURE_2D_ARRAY:f.TEXTURE_2D,b=this._getRGBABufferInternalSizedFormat(a,h,d),T=this._getInternalFormat(h),S=this._getWebGLTextureType(a);return this._bindTextureDirectly(x,_),0!==v?(_.is2DArray=!0,f.texImage3D(x,0,b,m,g,v,0,T,S,null)):f.texImage2D(x,0,b,m,g,0,T,S,null),f.texParameteri(x,f.TEXTURE_MAG_FILTER,y.mag),f.texParameteri(x,f.TEXTURE_MIN_FILTER,y.min),f.texParameteri(x,f.TEXTURE_WRAP_S,f.CLAMP_TO_EDGE),f.texParameteri(x,f.TEXTURE_WRAP_T,f.CLAMP_TO_EDGE),o&&this._gl.generateMipmap(x),this._bindTextureDirectly(x,null),_._useSRGBBuffer=d,_.baseWidth=m,_.baseHeight=g,_.width=m,_.height=g,_.depth=v,_.isReady=!0,_.samples=p,_.generateMipMaps=o,_.samplingMode=l,_.type=a,_.format=h,_.label=r,this._internalTexturesCache.push(_),_}_getUseSRGBBuffer(e,t){return e&&this._caps.supportSRGBBuffers&&(this.webGLVersion>1||this.isWebGPU||t)}_createTextureBase(e,t,i,s,r=3,o=null,a=null,l,h,d=null,p=null,f=null,_=null,m,g,v){const y="data:"===(e=e||"").substr(0,5),x="blob:"===e.substr(0,5),b=y&&-1!==e.indexOf(";base64,"),T=p||new c.l(this,c.S.Url);T!==p&&(T.label=e.substring(0,60));const S=e;!this._transformTextureUrl||b||p||d||(e=this._transformTextureUrl(e)),S!==e&&(T._originalUrl=S);const C=e.lastIndexOf(".");let A=_||(C>-1?e.substring(C).toLowerCase():""),P=null;A.indexOf("?")>-1&&(A=A.split("?")[0]);for(const e of E._TextureLoaders)if(e.canLoad(A,m)){P=e;break}s&&s.addPendingData(T),T.url=e,T.generateMipMaps=!t,T.samplingMode=r,T.invertY=i,T._useSRGBBuffer=this._getUseSRGBBuffer(!!v,t),this._doNotHandleContextLost||(T._buffer=d);let R=null;o&&!p&&(R=T.onLoadedObservable.add(o)),p||this._internalTexturesCache.push(T);const M=(i,c)=>{s&&s.removePendingData(T),e===S?(R&&T.onLoadedObservable.remove(R),n.l.UseFallbackTexture&&this._createTextureBase(n.l.FallbackTexture,t,T.invertY,s,r,null,a,l,h,d,T),i=(i||"Unknown error")+(n.l.UseFallbackTexture?" - Fallback texture was used":""),T.onErrorObservable.notifyObservers({message:i,exception:c}),a&&a(i,c)):(u.Y.Warn(`Failed to load ${e}, falling back to ${S}`),this._createTextureBase(S,t,T.invertY,s,r,o,a,l,h,d,T,f,_,m,g,v))};if(P){const t=e=>{P.loadData(e,T,((e,t,i,n,o,a)=>{a?M("TextureLoader failed to load data"):l(T,A,s,{width:e,height:t},T.invertY,!i,n,(()=>(o(),!1)),r)}),g)};d?d instanceof ArrayBuffer?t(new Uint8Array(d)):ArrayBuffer.isView(d)?t(d):a&&a("Unable to load: only ArrayBuffer or ArrayBufferView is supported",null):this._loadFile(e,(e=>t(new Uint8Array(e))),void 0,s?s.offlineProvider:void 0,!0,((e,t)=>{M("Unable to load "+(e&&e.responseURL,t))}))}else{const i=e=>{x&&!this._doNotHandleContextLost&&(T._buffer=e),l(T,A,s,e,T.invertY,t,!1,h,r)};!y||b?d&&("string"==typeof d.decoding||d.close)?i(d):E._FileToolsLoadImage(e,i,M,s?s.offlineProvider:null,m,T.invertY&&this._features.needsInvertingBitmap?{imageOrientation:"flipY"}:void 0):"string"==typeof d||d instanceof ArrayBuffer||ArrayBuffer.isView(d)||d instanceof Blob?E._FileToolsLoadImage(d,i,M,s?s.offlineProvider:null,m,T.invertY&&this._features.needsInvertingBitmap?{imageOrientation:"flipY"}:void 0):d&&i(d)}return T}createTexture(e,t,i,n,s=3,r=null,o=null,a=null,l=null,h=null,u=null,d,p,f,_){return this._createTextureBase(e,t,i,n,s,r,o,this._prepareWebGLTexture.bind(this),((e,t,i,s,r,o)=>{const a=this._gl,l=i.width===e&&i.height===t,u=h?this._getInternalFormat(h,r._useSRGBBuffer):".jpg"!==s||r._useSRGBBuffer?r._useSRGBBuffer?this._glSRGBExtensionValues.SRGB8_ALPHA8:a.RGBA:a.RGB;let d=h?this._getInternalFormat(h):".jpg"!==s||r._useSRGBBuffer?a.RGBA:a.RGB;if(r._useSRGBBuffer&&1===this.webGLVersion&&(d=u),l)return a.texImage2D(a.TEXTURE_2D,0,u,d,a.UNSIGNED_BYTE,i),!1;const p=this._caps.maxTextureSize;if(i.width>p||i.height>p||!this._supportsHardwareTextureRescaling)return this._prepareWorkingCanvas(),!(!this._workingCanvas||!this._workingContext||(this._workingCanvas.width=e,this._workingCanvas.height=t,this._workingContext.drawImage(i,0,0,i.width,i.height,0,0,e,t),a.texImage2D(a.TEXTURE_2D,0,u,d,a.UNSIGNED_BYTE,this._workingCanvas),r.width=e,r.height=t,1));{const e=new c.l(this,c.S.Temp);this._bindTextureDirectly(a.TEXTURE_2D,e,!0),a.texImage2D(a.TEXTURE_2D,0,u,d,a.UNSIGNED_BYTE,i),this._rescaleTexture(e,r,n,u,(()=>{this._releaseTexture(e),this._bindTextureDirectly(a.TEXTURE_2D,r,!0),o()}))}return!0}),a,l,h,u,d,p,_)}static _FileToolsLoadImage(e,t,i,n,s,o){throw(0,r.S)("FileTools")}_rescaleTexture(e,t,i,n,s){}createRawTexture(e,t,i,n,s,o,a,l=null,h=0,c=0,u=!1){throw(0,r.S)("Engine.RawTexture")}createRawCubeTexture(e,t,i,n,s,o,a,l=null){throw(0,r.S)("Engine.RawTexture")}createRawTexture3D(e,t,i,n,s,o,a,l,h=null,c=0){throw(0,r.S)("Engine.RawTexture")}createRawTexture2DArray(e,t,i,n,s,o,a,l,h=null,c=0){throw(0,r.S)("Engine.RawTexture")}_unpackFlipY(e){this._unpackFlipYCached!==e&&(this._gl.pixelStorei(this._gl.UNPACK_FLIP_Y_WEBGL,e?1:0),this.enableUnpackFlipYCached&&(this._unpackFlipYCached=e))}_getUnpackAlignement(){return this._gl.getParameter(this._gl.UNPACK_ALIGNMENT)}_getTextureTarget(e){return e.isCube?this._gl.TEXTURE_CUBE_MAP:e.is3D?this._gl.TEXTURE_3D:e.is2DArray||e.isMultiview?this._gl.TEXTURE_2D_ARRAY:this._gl.TEXTURE_2D}updateTextureSamplingMode(e,t,i=!1){const n=this._getTextureTarget(t),s=this._getSamplingParameters(e,t.useMipMaps||i);this._setTextureParameterInteger(n,this._gl.TEXTURE_MAG_FILTER,s.mag,t),this._setTextureParameterInteger(n,this._gl.TEXTURE_MIN_FILTER,s.min),i&&(t.generateMipMaps=!0,this._gl.generateMipmap(n)),this._bindTextureDirectly(n,null),t.samplingMode=e}updateTextureDimensions(e,t,i,n=1){}updateTextureWrappingMode(e,t,i=null,n=null){const s=this._getTextureTarget(e);null!==t&&(this._setTextureParameterInteger(s,this._gl.TEXTURE_WRAP_S,this._getTextureWrapMode(t),e),e._cachedWrapU=t),null!==i&&(this._setTextureParameterInteger(s,this._gl.TEXTURE_WRAP_T,this._getTextureWrapMode(i),e),e._cachedWrapV=i),(e.is2DArray||e.is3D)&&null!==n&&(this._setTextureParameterInteger(s,this._gl.TEXTURE_WRAP_R,this._getTextureWrapMode(n),e),e._cachedWrapR=n),this._bindTextureDirectly(s,null)}_setupDepthStencilTexture(e,t,i,n,s,r=1){const o=t.width||t,a=t.height||t,l=t.layers||0;e.baseWidth=o,e.baseHeight=a,e.width=o,e.height=a,e.is2DArray=l>0,e.depth=l,e.isReady=!0,e.samples=r,e.generateMipMaps=!1,e.samplingMode=n?2:1,e.type=0,e._comparisonFunction=s;const h=this._gl,c=this._getTextureTarget(e),u=this._getSamplingParameters(e.samplingMode,!1);h.texParameteri(c,h.TEXTURE_MAG_FILTER,u.mag),h.texParameteri(c,h.TEXTURE_MIN_FILTER,u.min),h.texParameteri(c,h.TEXTURE_WRAP_S,h.CLAMP_TO_EDGE),h.texParameteri(c,h.TEXTURE_WRAP_T,h.CLAMP_TO_EDGE),this.webGLVersion>1&&(0===s?(h.texParameteri(c,h.TEXTURE_COMPARE_FUNC,515),h.texParameteri(c,h.TEXTURE_COMPARE_MODE,h.NONE)):(h.texParameteri(c,h.TEXTURE_COMPARE_FUNC,s),h.texParameteri(c,h.TEXTURE_COMPARE_MODE,h.COMPARE_REF_TO_TEXTURE)))}_uploadCompressedDataToTextureDirectly(e,t,i,n,s,r=0,o=0){const a=this._gl;let l=a.TEXTURE_2D;if(e.isCube&&(l=a.TEXTURE_CUBE_MAP_POSITIVE_X+r),e._useSRGBBuffer)switch(t){case 37492:case 36196:this._caps.etc2?t=a.COMPRESSED_SRGB8_ETC2:e._useSRGBBuffer=!1;break;case 37496:this._caps.etc2?t=a.COMPRESSED_SRGB8_ALPHA8_ETC2_EAC:e._useSRGBBuffer=!1;break;case 36492:t=a.COMPRESSED_SRGB_ALPHA_BPTC_UNORM_EXT;break;case 37808:t=a.COMPRESSED_SRGB8_ALPHA8_ASTC_4x4_KHR;break;case 33776:this._caps.s3tc_srgb?t=a.COMPRESSED_SRGB_S3TC_DXT1_EXT:e._useSRGBBuffer=!1;break;case 33777:this._caps.s3tc_srgb?t=a.COMPRESSED_SRGB_ALPHA_S3TC_DXT1_EXT:e._useSRGBBuffer=!1;break;case 33779:this._caps.s3tc_srgb?t=a.COMPRESSED_SRGB_ALPHA_S3TC_DXT5_EXT:e._useSRGBBuffer=!1;break;default:e._useSRGBBuffer=!1}this._gl.compressedTexImage2D(l,o,t,i,n,0,s)}_uploadDataToTextureDirectly(e,t,i=0,n=0,s,r=!1){const o=this._gl,a=this._getWebGLTextureType(e.type),l=this._getInternalFormat(e.format),h=void 0===s?this._getRGBABufferInternalSizedFormat(e.type,e.format,e._useSRGBBuffer):this._getInternalFormat(s,e._useSRGBBuffer);this._unpackFlipY(e.invertY);let c=o.TEXTURE_2D;e.isCube&&(c=o.TEXTURE_CUBE_MAP_POSITIVE_X+i);const u=Math.round(Math.log(e.width)*Math.LOG2E),d=Math.round(Math.log(e.height)*Math.LOG2E),p=r?e.width:Math.pow(2,Math.max(u-n,0)),f=r?e.height:Math.pow(2,Math.max(d-n,0));o.texImage2D(c,n,h,p,f,0,l,a,t)}updateTextureData(e,t,i,n,s,r,o=0,a=0,l=!1){const h=this._gl,c=this._getWebGLTextureType(e.type),u=this._getInternalFormat(e.format);this._unpackFlipY(e.invertY);let d=h.TEXTURE_2D,p=h.TEXTURE_2D;e.isCube&&(p=h.TEXTURE_CUBE_MAP_POSITIVE_X+o,d=h.TEXTURE_CUBE_MAP),this._bindTextureDirectly(d,e,!0),h.texSubImage2D(p,a,i,n,s,r,u,c,t),l&&this._gl.generateMipmap(p),this._bindTextureDirectly(d,null)}_uploadArrayBufferViewToTexture(e,t,i=0,n=0){const s=this._gl,r=e.isCube?s.TEXTURE_CUBE_MAP:s.TEXTURE_2D;this._bindTextureDirectly(r,e,!0),this._uploadDataToTextureDirectly(e,t,i,n),this._bindTextureDirectly(r,null,!0)}_prepareWebGLTextureContinuation(e,t,i,n,s){const r=this._gl;if(!r)return;const o=this._getSamplingParameters(s,!i);r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MAG_FILTER,o.mag),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MIN_FILTER,o.min),i||n||r.generateMipmap(r.TEXTURE_2D),this._bindTextureDirectly(r.TEXTURE_2D,null),t&&t.removePendingData(e),e.onLoadedObservable.notifyObservers(e),e.onLoadedObservable.clear()}_prepareWebGLTexture(e,t,i,n,s,r,o,a,l=3){const h=this.getCaps().maxTextureSize,c=Math.min(h,this.needPOTTextures?E.GetExponentOfTwo(n.width,h):n.width),u=Math.min(h,this.needPOTTextures?E.GetExponentOfTwo(n.height,h):n.height),d=this._gl;d&&(e._hardwareTexture?(this._bindTextureDirectly(d.TEXTURE_2D,e,!0),this._unpackFlipY(void 0===s||!!s),e.baseWidth=n.width,e.baseHeight=n.height,e.width=c,e.height=u,e.isReady=!0,a(c,u,n,t,e,(()=>{this._prepareWebGLTextureContinuation(e,i,r,o,l)}))||this._prepareWebGLTextureContinuation(e,i,r,o,l)):i&&i.removePendingData(e))}_setupFramebufferDepthAttachments(e,t,i,n,s=1){const r=this._gl;if(e&&t)return this._createRenderBuffer(i,n,s,r.DEPTH_STENCIL,r.DEPTH24_STENCIL8,r.DEPTH_STENCIL_ATTACHMENT);if(t){let e=r.DEPTH_COMPONENT16;return this._webGLVersion>1&&(e=r.DEPTH_COMPONENT32F),this._createRenderBuffer(i,n,s,e,e,r.DEPTH_ATTACHMENT)}return e?this._createRenderBuffer(i,n,s,r.STENCIL_INDEX8,r.STENCIL_INDEX8,r.STENCIL_ATTACHMENT):null}_createRenderBuffer(e,t,i,n,s,r,o=!0){const a=this._gl.createRenderbuffer();return this._updateRenderBuffer(a,e,t,i,n,s,r,o)}_updateRenderBuffer(e,t,i,n,s,r,o,a=!0){const l=this._gl;return l.bindRenderbuffer(l.RENDERBUFFER,e),n>1&&l.renderbufferStorageMultisample?l.renderbufferStorageMultisample(l.RENDERBUFFER,n,r,t,i):l.renderbufferStorage(l.RENDERBUFFER,s,t,i),l.framebufferRenderbuffer(l.FRAMEBUFFER,o,l.RENDERBUFFER,e),a&&l.bindRenderbuffer(l.RENDERBUFFER,null),e}_releaseTexture(e){var t;this._deleteTexture(null===(t=e._hardwareTexture)||void 0===t?void 0:t.underlyingResource),this.unbindAllTextures();const i=this._internalTexturesCache.indexOf(e);-1!==i&&this._internalTexturesCache.splice(i,1),e._lodTextureHigh&&e._lodTextureHigh.dispose(),e._lodTextureMid&&e._lodTextureMid.dispose(),e._lodTextureLow&&e._lodTextureLow.dispose(),e._irradianceTexture&&e._irradianceTexture.dispose()}_releaseRenderTargetWrapper(e){const t=this._renderTargetWrapperCache.indexOf(e);-1!==t&&this._renderTargetWrapperCache.splice(t,1)}_deleteTexture(e){e&&this._gl.deleteTexture(e)}_setProgram(e){this._currentProgram!==e&&(this._gl.useProgram(e),this._currentProgram=e)}bindSamplers(e){const t=e.getPipelineContext();this._setProgram(t.program);const i=e.getSamplers();for(let t=0;t<i.length;t++){const n=e.getUniform(i[t]);n&&(this._boundUniforms[t]=n)}this._currentEffect=null}_activateCurrentTexture(){this._currentTextureChannel!==this._activeChannel&&(this._gl.activeTexture(this._gl.TEXTURE0+this._activeChannel),this._currentTextureChannel=this._activeChannel)}_bindTextureDirectly(e,t,i=!1,n=!1){var s,r;let o=!1;const a=t&&t._associatedChannel>-1;if(i&&a&&(this._activeChannel=t._associatedChannel),this._boundTexturesCache[this._activeChannel]!==t||n){if(this._activateCurrentTexture(),t&&t.isMultiview)throw console.error(e,t),"_bindTextureDirectly called with a multiview texture!";this._gl.bindTexture(e,null!==(r=null===(s=null==t?void 0:t._hardwareTexture)||void 0===s?void 0:s.underlyingResource)&&void 0!==r?r:null),this._boundTexturesCache[this._activeChannel]=t,t&&(t._associatedChannel=this._activeChannel)}else i&&(o=!0,this._activateCurrentTexture());return a&&!i&&this._bindSamplerUniformToChannel(t._associatedChannel,this._activeChannel),o}_bindTexture(e,t,i){if(void 0===e)return;t&&(t._associatedChannel=e),this._activeChannel=e;const n=t?this._getTextureTarget(t):this._gl.TEXTURE_2D;this._bindTextureDirectly(n,t)}unbindAllTextures(){for(let e=0;e<this._maxSimultaneousTextures;e++)this._activeChannel=e,this._bindTextureDirectly(this._gl.TEXTURE_2D,null),this._bindTextureDirectly(this._gl.TEXTURE_CUBE_MAP,null),this.webGLVersion>1&&(this._bindTextureDirectly(this._gl.TEXTURE_3D,null),this._bindTextureDirectly(this._gl.TEXTURE_2D_ARRAY,null))}setTexture(e,t,i,n){void 0!==e&&(t&&(this._boundUniforms[e]=t),this._setTexture(e,i))}_bindSamplerUniformToChannel(e,t){const i=this._boundUniforms[e];i&&i._currentState!==t&&(this._gl.uniform1i(i,t),i._currentState=t)}_getTextureWrapMode(e){switch(e){case 1:return this._gl.REPEAT;case 0:return this._gl.CLAMP_TO_EDGE;case 2:return this._gl.MIRRORED_REPEAT}return this._gl.REPEAT}_setTexture(e,t,i=!1,n=!1,s=""){if(!t)return null!=this._boundTexturesCache[e]&&(this._activeChannel=e,this._bindTextureDirectly(this._gl.TEXTURE_2D,null),this._bindTextureDirectly(this._gl.TEXTURE_CUBE_MAP,null),this.webGLVersion>1&&(this._bindTextureDirectly(this._gl.TEXTURE_3D,null),this._bindTextureDirectly(this._gl.TEXTURE_2D_ARRAY,null))),!1;if(t.video){this._activeChannel=e;const i=t.getInternalTexture();i&&(i._associatedChannel=e),t.update()}else if(4===t.delayLoadState)return t.delayLoad(),!1;let r;r=n?t.depthStencilTexture:t.isReady()?t.getInternalTexture():t.isCube?this.emptyCubeTexture:t.is3D?this.emptyTexture3D:t.is2DArray?this.emptyTexture2DArray:this.emptyTexture,!i&&r&&(r._associatedChannel=e);let o=!0;this._boundTexturesCache[e]===r&&(i||this._bindSamplerUniformToChannel(r._associatedChannel,e),o=!1),this._activeChannel=e;const a=this._getTextureTarget(r);if(o&&this._bindTextureDirectly(a,r,i),r&&!r.isMultiview){if(r.isCube&&r._cachedCoordinatesMode!==t.coordinatesMode){r._cachedCoordinatesMode=t.coordinatesMode;const e=3!==t.coordinatesMode&&5!==t.coordinatesMode?1:0;t.wrapU=e,t.wrapV=e}r._cachedWrapU!==t.wrapU&&(r._cachedWrapU=t.wrapU,this._setTextureParameterInteger(a,this._gl.TEXTURE_WRAP_S,this._getTextureWrapMode(t.wrapU),r)),r._cachedWrapV!==t.wrapV&&(r._cachedWrapV=t.wrapV,this._setTextureParameterInteger(a,this._gl.TEXTURE_WRAP_T,this._getTextureWrapMode(t.wrapV),r)),r.is3D&&r._cachedWrapR!==t.wrapR&&(r._cachedWrapR=t.wrapR,this._setTextureParameterInteger(a,this._gl.TEXTURE_WRAP_R,this._getTextureWrapMode(t.wrapR),r)),this._setAnisotropicLevel(a,r,t.anisotropicFilteringLevel)}return!0}setTextureArray(e,t,i,n){if(void 0!==e&&t){this._textureUnits&&this._textureUnits.length===i.length||(this._textureUnits=new Int32Array(i.length));for(let t=0;t<i.length;t++){const n=i[t].getInternalTexture();n?(this._textureUnits[t]=e+t,n._associatedChannel=e+t):this._textureUnits[t]=-1}this._gl.uniform1iv(t,this._textureUnits);for(let e=0;e<i.length;e++)this._setTexture(this._textureUnits[e],i[e],!0)}}_setAnisotropicLevel(e,t,i){const n=this._caps.textureAnisotropicFilterExtension;11!==t.samplingMode&&3!==t.samplingMode&&2!==t.samplingMode&&(i=1),n&&t._cachedAnisotropicFilteringLevel!==i&&(this._setTextureParameterFloat(e,n.TEXTURE_MAX_ANISOTROPY_EXT,Math.min(i,this._caps.maxAnisotropy),t),t._cachedAnisotropicFilteringLevel=i)}_setTextureParameterFloat(e,t,i,n){this._bindTextureDirectly(e,n,!0,!0),this._gl.texParameterf(e,t,i)}_setTextureParameterInteger(e,t,i,n){n&&this._bindTextureDirectly(e,n,!0,!0),this._gl.texParameteri(e,t,i)}unbindAllAttributes(){if(this._mustWipeVertexAttributes){this._mustWipeVertexAttributes=!1;for(let e=0;e<this._caps.maxVertexAttribs;e++)this.disableAttributeByIndex(e)}else for(let e=0,t=this._vertexAttribArraysEnabled.length;e<t;e++)e>=this._caps.maxVertexAttribs||!this._vertexAttribArraysEnabled[e]||this.disableAttributeByIndex(e)}releaseEffects(){for(const e in this._compiledEffects){const t=this._compiledEffects[e].getPipelineContext();this._deletePipelineContext(t)}this._compiledEffects={}}dispose(){var e;this._isDisposed=!0,this.stopRenderLoop(),this.onBeforeTextureInitObservable&&this.onBeforeTextureInitObservable.clear(),this._emptyTexture&&(this._releaseTexture(this._emptyTexture),this._emptyTexture=null),this._emptyCubeTexture&&(this._releaseTexture(this._emptyCubeTexture),this._emptyCubeTexture=null),this._dummyFramebuffer&&this._gl.deleteFramebuffer(this._dummyFramebuffer),this.releaseEffects(),null===(e=this.releaseComputeEffects)||void 0===e||e.call(this),this.unbindAllAttributes(),this._boundUniforms={},(0,d.CG)()&&this._renderingCanvas&&(this._doNotHandleContextLost||(this._renderingCanvas.removeEventListener("webglcontextlost",this._onContextLost),this._renderingCanvas.removeEventListener("webglcontextrestored",this._onContextRestored)),window.removeEventListener("resize",this._checkForMobile)),this._workingCanvas=null,this._workingContext=null,this._currentBufferPointers.length=0,this._renderingCanvas=null,this._currentProgram=null,this._boundRenderFunction=null,s.Q.ResetCache();for(const e of this._activeRequests)e.abort();this.onDisposeObservable.notifyObservers(this),this.onDisposeObservable.clear()}attachContextLostEvent(e){this._renderingCanvas&&this._renderingCanvas.addEventListener("webglcontextlost",e,!1)}attachContextRestoredEvent(e){this._renderingCanvas&&this._renderingCanvas.addEventListener("webglcontextrestored",e,!1)}getError(){return this._gl.getError()}_canRenderToFloatFramebuffer(){return this._webGLVersion>1?this._caps.colorBufferFloat:this._canRenderToFramebuffer(1)}_canRenderToHalfFloatFramebuffer(){return this._webGLVersion>1?this._caps.colorBufferFloat:this._canRenderToFramebuffer(2)}_canRenderToFramebuffer(e){const t=this._gl;for(;t.getError()!==t.NO_ERROR;);let i=!0;const n=t.createTexture();t.bindTexture(t.TEXTURE_2D,n),t.texImage2D(t.TEXTURE_2D,0,this._getRGBABufferInternalSizedFormat(e),1,1,0,t.RGBA,this._getWebGLTextureType(e),null),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_MIN_FILTER,t.NEAREST),t.texParameteri(t.TEXTURE_2D,t.TEXTURE_MAG_FILTER,t.NEAREST);const s=t.createFramebuffer();t.bindFramebuffer(t.FRAMEBUFFER,s),t.framebufferTexture2D(t.FRAMEBUFFER,t.COLOR_ATTACHMENT0,t.TEXTURE_2D,n,0);const r=t.checkFramebufferStatus(t.FRAMEBUFFER);if(i=i&&r===t.FRAMEBUFFER_COMPLETE,i=i&&t.getError()===t.NO_ERROR,i&&(t.clear(t.COLOR_BUFFER_BIT),i=i&&t.getError()===t.NO_ERROR),i){t.bindFramebuffer(t.FRAMEBUFFER,null);const e=t.RGBA,n=t.UNSIGNED_BYTE,s=new Uint8Array(4);t.readPixels(0,0,1,1,e,n,s),i=i&&t.getError()===t.NO_ERROR}for(t.deleteTexture(n),t.deleteFramebuffer(s),t.bindFramebuffer(t.FRAMEBUFFER,null);!i&&t.getError()!==t.NO_ERROR;);return i}_getWebGLTextureType(e){if(1===this._webGLVersion){switch(e){case 1:return this._gl.FLOAT;case 2:return this._gl.HALF_FLOAT_OES;case 0:return this._gl.UNSIGNED_BYTE;case 8:return this._gl.UNSIGNED_SHORT_4_4_4_4;case 9:return this._gl.UNSIGNED_SHORT_5_5_5_1;case 10:return this._gl.UNSIGNED_SHORT_5_6_5}return this._gl.UNSIGNED_BYTE}switch(e){case 3:return this._gl.BYTE;case 0:return this._gl.UNSIGNED_BYTE;case 4:return this._gl.SHORT;case 5:return this._gl.UNSIGNED_SHORT;case 6:return this._gl.INT;case 7:return this._gl.UNSIGNED_INT;case 1:return this._gl.FLOAT;case 2:return this._gl.HALF_FLOAT;case 8:return this._gl.UNSIGNED_SHORT_4_4_4_4;case 9:return this._gl.UNSIGNED_SHORT_5_5_5_1;case 10:return this._gl.UNSIGNED_SHORT_5_6_5;case 11:return this._gl.UNSIGNED_INT_2_10_10_10_REV;case 12:return this._gl.UNSIGNED_INT_24_8;case 13:return this._gl.UNSIGNED_INT_10F_11F_11F_REV;case 14:return this._gl.UNSIGNED_INT_5_9_9_9_REV;case 15:return this._gl.FLOAT_32_UNSIGNED_INT_24_8_REV}return this._gl.UNSIGNED_BYTE}_getInternalFormat(e,t=!1){let i=t?this._glSRGBExtensionValues.SRGB8_ALPHA8:this._gl.RGBA;switch(e){case 0:i=this._gl.ALPHA;break;case 1:i=this._gl.LUMINANCE;break;case 2:i=this._gl.LUMINANCE_ALPHA;break;case 6:i=this._gl.RED;break;case 7:i=this._gl.RG;break;case 4:i=t?this._glSRGBExtensionValues.SRGB:this._gl.RGB;break;case 5:i=t?this._glSRGBExtensionValues.SRGB8_ALPHA8:this._gl.RGBA}if(this._webGLVersion>1)switch(e){case 8:i=this._gl.RED_INTEGER;break;case 9:i=this._gl.RG_INTEGER;break;case 10:i=this._gl.RGB_INTEGER;break;case 11:i=this._gl.RGBA_INTEGER}return i}_getRGBABufferInternalSizedFormat(e,t,i=!1){if(1===this._webGLVersion){if(void 0!==t)switch(t){case 0:return this._gl.ALPHA;case 1:return this._gl.LUMINANCE;case 2:return this._gl.LUMINANCE_ALPHA;case 4:return i?this._glSRGBExtensionValues.SRGB:this._gl.RGB}return this._gl.RGBA}switch(e){case 3:switch(t){case 6:return this._gl.R8_SNORM;case 7:return this._gl.RG8_SNORM;case 4:return this._gl.RGB8_SNORM;case 8:return this._gl.R8I;case 9:return this._gl.RG8I;case 10:return this._gl.RGB8I;case 11:return this._gl.RGBA8I;default:return this._gl.RGBA8_SNORM}case 0:switch(t){case 6:return this._gl.R8;case 7:return this._gl.RG8;case 4:return i?this._glSRGBExtensionValues.SRGB8:this._gl.RGB8;case 5:return i?this._glSRGBExtensionValues.SRGB8_ALPHA8:this._gl.RGBA8;case 8:return this._gl.R8UI;case 9:return this._gl.RG8UI;case 10:return this._gl.RGB8UI;case 11:return this._gl.RGBA8UI;case 0:return this._gl.ALPHA;case 1:return this._gl.LUMINANCE;case 2:return this._gl.LUMINANCE_ALPHA;default:return this._gl.RGBA8}case 4:switch(t){case 8:return this._gl.R16I;case 9:return this._gl.RG16I;case 10:return this._gl.RGB16I;default:return this._gl.RGBA16I}case 5:switch(t){case 8:return this._gl.R16UI;case 9:return this._gl.RG16UI;case 10:return this._gl.RGB16UI;default:return this._gl.RGBA16UI}case 6:switch(t){case 8:return this._gl.R32I;case 9:return this._gl.RG32I;case 10:return this._gl.RGB32I;default:return this._gl.RGBA32I}case 7:switch(t){case 8:return this._gl.R32UI;case 9:return this._gl.RG32UI;case 10:return this._gl.RGB32UI;default:return this._gl.RGBA32UI}case 1:switch(t){case 6:return this._gl.R32F;case 7:return this._gl.RG32F;case 4:return this._gl.RGB32F;default:return this._gl.RGBA32F}case 2:switch(t){case 6:return this._gl.R16F;case 7:return this._gl.RG16F;case 4:return this._gl.RGB16F;default:return this._gl.RGBA16F}case 10:return this._gl.RGB565;case 13:return this._gl.R11F_G11F_B10F;case 14:return this._gl.RGB9_E5;case 8:return this._gl.RGBA4;case 9:return this._gl.RGB5_A1;case 11:switch(t){case 5:default:return this._gl.RGB10_A2;case 11:return this._gl.RGB10_A2UI}}return i?this._glSRGBExtensionValues.SRGB8_ALPHA8:this._gl.RGBA8}_getRGBAMultiSampleBufferFormat(e,t=5){switch(e){case 1:return 6===t?this._gl.R32F:this._gl.RGBA32F;case 2:return 6===t?this._gl.R16F:this._gl.RGBA16F}return this._gl.RGBA8}_loadFile(e,t,i,n,s,r){const o=E._FileToolsLoadFile(e,t,i,n,s,r);return this._activeRequests.push(o),o.onCompleteObservable.add((e=>{this._activeRequests.splice(this._activeRequests.indexOf(e),1)})),o}static _FileToolsLoadFile(e,t,i,n,s,o){throw(0,r.S)("FileTools")}readPixels(e,t,i,n,s=!0,r=!0){const o=s?4:3,a=s?this._gl.RGBA:this._gl.RGB,l=new Uint8Array(n*i*o);return r&&this.flushFramebuffer(),this._gl.readPixels(e,t,i,n,a,this._gl.UNSIGNED_BYTE,l),Promise.resolve(l)}static get IsSupportedAsync(){return Promise.resolve(this.isSupported())}static get IsSupported(){return this.isSupported()}static isSupported(){if(null!==this._HasMajorPerformanceCaveat)return!this._HasMajorPerformanceCaveat;if(null===this._IsSupported)try{const e=this._CreateCanvas(1,1),t=e.getContext("webgl")||e.getContext("experimental-webgl");this._IsSupported=null!=t&&!!window.WebGLRenderingContext}catch(e){this._IsSupported=!1}return this._IsSupported}static get HasMajorPerformanceCaveat(){if(null===this._HasMajorPerformanceCaveat)try{const e=this._CreateCanvas(1,1),t=e.getContext("webgl",{failIfMajorPerformanceCaveat:!0})||e.getContext("experimental-webgl",{failIfMajorPerformanceCaveat:!0});this._HasMajorPerformanceCaveat=!t}catch(e){this._HasMajorPerformanceCaveat=!1}return this._HasMajorPerformanceCaveat}static CeilingPOT(e){return e--,e|=e>>1,e|=e>>2,e|=e>>4,e|=e>>8,e|=e>>16,++e}static FloorPOT(e){return e|=e>>1,e|=e>>2,e|=e>>4,e|=e>>8,(e|=e>>16)-(e>>1)}static NearestPOT(e){const t=E.CeilingPOT(e),i=E.FloorPOT(e);return t-e>e-i?i:t}static GetExponentOfTwo(e,t,i=2){let n;switch(i){case 1:n=E.FloorPOT(e);break;case 2:n=E.NearestPOT(e);break;default:n=E.CeilingPOT(e)}return Math.min(n,t)}static QueueNewFrame(e,t){if((0,d.CG)()){const{requestPostAnimationFrame:i,requestAnimationFrame:n}=t||window;if("function"==typeof i)return i(e);if("function"==typeof n)return n(e)}else if("function"==typeof requestAnimationFrame)return requestAnimationFrame(e);return setTimeout(e,16)}getHostDocument(){return this._renderingCanvas&&this._renderingCanvas.ownerDocument?this._renderingCanvas.ownerDocument:(0,d.n5)()?document:null}}E.ExceptionList=[{key:"Chrome/63.0",capture:"63\\.0\\.3239\\.(\\d+)",captureConstraint:108,targets:["uniformBuffer"]},{key:"Firefox/58",capture:null,captureConstraint:null,targets:["uniformBuffer"]},{key:"Firefox/59",capture:null,captureConstraint:null,targets:["uniformBuffer"]},{key:"Chrome/72.+?Mobile",capture:null,captureConstraint:null,targets:["vao"]},{key:"Chrome/73.+?Mobile",capture:null,captureConstraint:null,targets:["vao"]},{key:"Chrome/74.+?Mobile",capture:null,captureConstraint:null,targets:["vao"]},{key:"Mac OS.+Chrome/71",capture:null,captureConstraint:null,targets:["vao"]},{key:"Mac OS.+Chrome/72",capture:null,captureConstraint:null,targets:["vao"]},{key:"Mac OS.+Chrome",capture:null,captureConstraint:null,targets:["uniformBuffer"]},{key:".*AppleWebKit.*(15.4).*Safari",capture:null,captureConstraint:null,targets:["antialias","maxMSAASamples"]},{key:".*(15.4).*AppleWebKit.*Safari",capture:null,captureConstraint:null,targets:["antialias","maxMSAASamples"]}],E._TextureLoaders=[],E.CollisionsEpsilon=.001,E._IsSupported=null,E._HasMajorPerformanceCaveat=null},9884:(e,t,i)=>{i.d(t,{o:()=>s,p:()=>n});class n{}n.COPY=1,n.CUT=2,n.PASTE=3;class s{constructor(e,t){this.type=e,this.event=t}static GetTypeFromCharacter(e){switch(e){case 67:return n.COPY;case 86:return n.PASTE;case 88:return n.CUT;default:return-1}}}},2272:(e,t,i)=>{var n;i.d(t,{G:()=>s,g:()=>n}),function(e){e[e.PointerMove=0]="PointerMove",e[e.PointerDown=1]="PointerDown",e[e.PointerUp=2]="PointerUp"}(n||(n={}));class s{}s.DOM_DELTA_PIXEL=0,s.DOM_DELTA_LINE=1,s.DOM_DELTA_PAGE=2},2925:(e,t,i)=>{i.d(t,{NG:()=>s,OG:()=>n,WZ:()=>r});class n{}n.KEYDOWN=1,n.KEYUP=2;class s{constructor(e,t){this.type=e,this.event=t}}class r extends s{get skipOnPointerObservable(){return this.skipOnKeyboardObservable}set skipOnPointerObservable(e){this.skipOnKeyboardObservable=e}constructor(e,t){super(e,t),this.type=e,this.event=t,this.skipOnKeyboardObservable=!1}}},1903:(e,t,i)=>{i.d(t,{CU:()=>r,FV:()=>o,R5:()=>a,kD:()=>s});var n=i(4141);class s{}s.POINTERDOWN=1,s.POINTERUP=2,s.POINTERMOVE=4,s.POINTERWHEEL=8,s.POINTERPICK=16,s.POINTERTAP=32,s.POINTERDOUBLETAP=64;class r{constructor(e,t){this.type=e,this.event=t}}class o extends r{constructor(e,t,i,s){super(e,t),this.ray=null,this.originalPickingInfo=null,this.skipOnPointerObservable=!1,this.localPosition=new n.FM(i,s)}}class a extends r{get pickInfo(){return this._pickInfo||this._generatePickInfo(),this._pickInfo}constructor(e,t,i,n=null){super(e,t),this._pickInfo=i,this._inputManager=n}_generatePickInfo(){this._inputManager&&(this._pickInfo=this._inputManager._pickMove(this.event),this._inputManager._setRayOnPointerInfo(this._pickInfo,this.event),this._inputManager=null)}}},3322:(e,t,i)=>{i.d(t,{t:()=>h});var n=i(4141),s=i(4496),r=i(2704),o=i(9803),a=i(1903),l=i(9311);class h{set scaleRatio(e){this._scaleRatio=e}get scaleRatio(){return this._scaleRatio}get isHovered(){return this._isHovered}get attachedMesh(){return this._attachedMesh}set attachedMesh(e){this._attachedMesh=e,e&&(this._attachedNode=e),this._rootMesh.setEnabled(!!e),this._attachedNodeChanged(e)}get attachedNode(){return this._attachedNode}set attachedNode(e){this._attachedNode=e,this._attachedMesh=null,this._rootMesh.setEnabled(!!e),this._attachedNodeChanged(e)}setCustomMesh(e){if(e.getScene()!=this.gizmoLayer.utilityLayerScene)throw"When setting a custom mesh on a gizmo, the custom meshes scene must be the same as the gizmos (eg. gizmo.gizmoLayer.utilityLayerScene)";this._rootMesh.getChildMeshes().forEach((e=>{e.dispose()})),e.parent=this._rootMesh,this._customMeshSet=!0}set updateGizmoRotationToMatchAttachedMesh(e){this._updateGizmoRotationToMatchAttachedMesh=e}get updateGizmoRotationToMatchAttachedMesh(){return this._updateGizmoRotationToMatchAttachedMesh}set updateGizmoPositionToMatchAttachedMesh(e){this._updateGizmoPositionToMatchAttachedMesh=e}get updateGizmoPositionToMatchAttachedMesh(){return this._updateGizmoPositionToMatchAttachedMesh}set updateScale(e){this._updateScale=e}get updateScale(){return this._updateScale}_attachedNodeChanged(e){}constructor(e=o.x.DefaultUtilityLayer){this.gizmoLayer=e,this._attachedMesh=null,this._attachedNode=null,this._customRotationQuaternion=null,this._scaleRatio=1,this._isHovered=!1,this._customMeshSet=!1,this._updateGizmoRotationToMatchAttachedMesh=!0,this._updateGizmoPositionToMatchAttachedMesh=!0,this._updateScale=!0,this._interactionsEnabled=!0,this._rightHandtoLeftHandMatrix=n.y3.RotationY(Math.PI),this._rootMesh=new s.Kj("gizmoRootNode",e.utilityLayerScene),this._rootMesh.rotationQuaternion=n._f.Identity(),this._beforeRenderObserver=this.gizmoLayer.utilityLayerScene.onBeforeRenderObservable.add((()=>{this._update()}))}get customRotationQuaternion(){return this._customRotationQuaternion}set customRotationQuaternion(e){this._customRotationQuaternion=e}_update(){if(this.attachedNode){let e=this.attachedNode;if(this.attachedMesh&&(e=this.attachedMesh||this.attachedNode),this.updateGizmoPositionToMatchAttachedMesh){const t=e.getWorldMatrix().getRow(3),i=t?t.toVector3():new n.P(0,0,0);this._rootMesh.position.copyFrom(i)}if(this.updateGizmoRotationToMatchAttachedMesh){const t=e._isMesh||"AbstractMesh"===e.getClassName()||"TransformNode"===e.getClassName()||"InstancedMesh"===e.getClassName()?e:void 0;e.getWorldMatrix().decompose(void 0,this._rootMesh.rotationQuaternion,void 0,h.PreserveScaling?t:void 0)}else this._customRotationQuaternion?this._rootMesh.rotationQuaternion.copyFrom(this._customRotationQuaternion):this._rootMesh.rotationQuaternion.set(0,0,0,1);if(this.updateScale){const t=this.gizmoLayer.utilityLayerScene.activeCamera;let i=t.globalPosition;t.devicePosition&&(i=t.devicePosition),this._rootMesh.position.subtractToRef(i,n.jp.Vector3[0]);let s=this.scaleRatio;if(t.mode==r.V.ORTHOGRAPHIC_CAMERA)t.orthoTop&&t.orthoBottom&&(s*=t.orthoTop-t.orthoBottom);else{const e=t.getScene().useRightHandedSystem?n.P.RightHandedForwardReadOnly:n.P.LeftHandedForwardReadOnly,i=t.getDirection(e);s*=n.P.Dot(n.jp.Vector3[0],i)}this._rootMesh.scaling.setAll(s),e._getWorldMatrixDeterminant()<0&&!h.PreserveScaling&&(this._rootMesh.scaling.y*=-1)}else this._rootMesh.scaling.setAll(this.scaleRatio)}}_handlePivot(){const e=this._attachedNode;e.isUsingPivotMatrix&&e.isUsingPivotMatrix()&&e.position&&e.getWorldMatrix().setTranslation(e.position)}_matrixChanged(){if(this._attachedNode)if(this._attachedNode._isCamera){const e=this._attachedNode;let t,i;if(e.parent){const i=n.jp.Matrix[1];e.parent._worldMatrix.invertToRef(i),this._attachedNode._worldMatrix.multiplyToRef(i,n.jp.Matrix[0]),t=n.jp.Matrix[0]}else t=this._attachedNode._worldMatrix;if(e.getScene().useRightHandedSystem?(this._rightHandtoLeftHandMatrix.multiplyToRef(t,n.jp.Matrix[1]),i=n.jp.Matrix[1]):i=t,i.decompose(n.jp.Vector3[1],n.jp.Quaternion[0],n.jp.Vector3[0]),"FreeCamera"===this._attachedNode.getClassName()||"FlyCamera"===this._attachedNode.getClassName()||"ArcFollowCamera"===this._attachedNode.getClassName()||"TargetCamera"===this._attachedNode.getClassName()||"TouchCamera"===this._attachedNode.getClassName()||"UniversalCamera"===this._attachedNode.getClassName()){const e=this._attachedNode;e.rotation=n.jp.Quaternion[0].toEulerAngles(),e.rotationQuaternion&&(e.rotationQuaternion.copyFrom(n.jp.Quaternion[0]),e.rotationQuaternion.normalize())}e.position.copyFrom(n.jp.Vector3[0])}else if(this._attachedNode._isMesh||"AbstractMesh"===this._attachedNode.getClassName()||"TransformNode"===this._attachedNode.getClassName()||"InstancedMesh"===this._attachedNode.getClassName()){const e=this._attachedNode;if(e.parent){const t=n.jp.Matrix[0],i=n.jp.Matrix[1];e.parent.getWorldMatrix().invertToRef(t),this._attachedNode.getWorldMatrix().multiplyToRef(t,i),i.decompose(n.jp.Vector3[0],n.jp.Quaternion[0],e.position,h.PreserveScaling?e:void 0)}else this._attachedNode._worldMatrix.decompose(n.jp.Vector3[0],n.jp.Quaternion[0],e.position,h.PreserveScaling?e:void 0);n.jp.Vector3[0].scaleInPlace(1/e.scalingDeterminant),e.scaling.copyFrom(n.jp.Vector3[0]),e.billboardMode||(e.rotationQuaternion?(e.rotationQuaternion.copyFrom(n.jp.Quaternion[0]),e.rotationQuaternion.normalize()):e.rotation=n.jp.Quaternion[0].toEulerAngles())}else if("Bone"===this._attachedNode.getClassName()){const e=this._attachedNode,t=e.getParent();if(t){const i=n.jp.Matrix[0],s=n.jp.Matrix[1];t.getWorldMatrix().invertToRef(i),e.getWorldMatrix().multiplyToRef(i,s),e.getLocalMatrix().copyFrom(s)}else e.getLocalMatrix().copyFrom(e.getWorldMatrix());e.markAsDirty()}else{const e=this._attachedNode;if(e.getTypeID){const t=e.getTypeID();if(t===l._.LIGHTTYPEID_DIRECTIONALLIGHT||t===l._.LIGHTTYPEID_SPOTLIGHT||t===l._.LIGHTTYPEID_POINTLIGHT){const t=e.parent;if(t){const i=n.jp.Matrix[0],s=n.jp.Matrix[1];t.getWorldMatrix().invertToRef(i),e.getWorldMatrix().multiplyToRef(i,s),s.decompose(void 0,n.jp.Quaternion[0],n.jp.Vector3[0])}else this._attachedNode._worldMatrix.decompose(void 0,n.jp.Quaternion[0],n.jp.Vector3[0]);e.position=new n.P(n.jp.Vector3[0].x,n.jp.Vector3[0].y,n.jp.Vector3[0].z),e.direction&&(e.direction=new n.P(e.direction.x,e.direction.y,e.direction.z))}}}}_setGizmoMeshMaterial(e,t){e&&e.forEach((e=>{e.material=t,e.color&&(e.color=t.diffuseColor)}))}static GizmoAxisPointerObserver(e,t){let i=!1;return e.utilityLayerScene.onPointerObservable.add((e=>{var n,s;if(e.pickInfo){if(e.type===a.kD.POINTERMOVE){if(i)return;t.forEach((t=>{var i,n;if(t.colliderMeshes&&t.gizmoMeshes){const s=-1!=(null===(i=t.colliderMeshes)||void 0===i?void 0:i.indexOf(null===(n=null==e?void 0:e.pickInfo)||void 0===n?void 0:n.pickedMesh)),r=t.dragBehavior.enabled?s||t.active?t.hoverMaterial:t.material:t.disableMaterial;t.gizmoMeshes.forEach((e=>{e.material=r,e.color&&(e.color=r.diffuseColor)}))}}))}e.type===a.kD.POINTERDOWN&&t.has(null===(n=e.pickInfo.pickedMesh)||void 0===n?void 0:n.parent)&&(i=!0,t.get(null===(s=e.pickInfo.pickedMesh)||void 0===s?void 0:s.parent).active=!0,t.forEach((t=>{var i,n;const s=(-1!=(null===(i=t.colliderMeshes)||void 0===i?void 0:i.indexOf(null===(n=null==e?void 0:e.pickInfo)||void 0===n?void 0:n.pickedMesh))||t.active)&&t.dragBehavior.enabled?t.hoverMaterial:t.disableMaterial;t.gizmoMeshes.forEach((e=>{e.material=s,e.color&&(e.color=s.diffuseColor)}))}))),e.type===a.kD.POINTERUP&&t.forEach((e=>{e.active=!1,i=!1,e.gizmoMeshes.forEach((t=>{t.material=e.dragBehavior.enabled?e.material:e.disableMaterial,t.color&&(t.color=e.material.diffuseColor)}))}))}}))}dispose(){this._rootMesh.dispose(),this._beforeRenderObserver&&this.gizmoLayer.utilityLayerScene.onBeforeRenderObservable.remove(this._beforeRenderObserver)}}h.PreserveScaling=!1},4380:(e,t,i)=>{i.d(t,{m:()=>f});var n=i(5757),s=i(4141),r=i(4649),o=i(1431),a=i(708),l=i(7104),h=i(2262),c=i(2333),u=i(8513),d=i(1345),p=i(8104);i(1423);p.v.ShadersStore.layerPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform vec4 color;\n#include<helperFunctions>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\nvec4 baseColor=texture2D(textureSampler,vUV);\n#ifdef LINEAR\nbaseColor.rgb=toGammaSpace(baseColor.rgb);\n#endif\n#ifdef ALPHATEST\nif (baseColor.a<0.4)\ndiscard;\n#endif\ngl_FragColor=baseColor*color;\n#define CUSTOM_FRAGMENT_MAIN_END\n}";p.v.ShadersStore.layerVertexShader="attribute vec2 position;\nuniform vec2 scale;\nuniform vec2 offset;\nuniform mat4 textureMatrix;\nvarying vec2 vUV;\nconst vec2 madd=vec2(0.5,0.5);\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nvec2 shiftedPosition=position*scale+offset;\nvUV=vec2(textureMatrix*vec4(shiftedPosition*madd+madd,1.0,0.0));\ngl_Position=vec4(shiftedPosition,0.0,1.0);\n#define CUSTOM_VERTEX_MAIN_END\n}";class f{set applyPostProcess(e){this._applyPostProcess=e}get applyPostProcess(){return this.isBackground||this._applyPostProcess}set onDispose(e){this._onDisposeObserver&&this.onDisposeObservable.remove(this._onDisposeObserver),this._onDisposeObserver=this.onDisposeObservable.add(e)}set onBeforeRender(e){this._onBeforeRenderObserver&&this.onBeforeRenderObservable.remove(this._onBeforeRenderObserver),this._onBeforeRenderObserver=this.onBeforeRenderObservable.add(e)}set onAfterRender(e){this._onAfterRenderObserver&&this.onAfterRenderObservable.remove(this._onAfterRenderObserver),this._onAfterRenderObserver=this.onAfterRenderObservable.add(e)}constructor(e,t,i,l,p){this.name=e,this._applyPostProcess=!0,this.scale=new s.FM(1,1),this.offset=new s.FM(0,0),this.alphaBlendingMode=2,this.layerMask=268435455,this.renderTargetTextures=[],this.renderOnlyInRenderTargetTextures=!1,this.isEnabled=!0,this._vertexBuffers={},this.onDisposeObservable=new n.y$,this.onBeforeRenderObservable=new n.y$,this.onAfterRenderObservable=new n.y$,this.texture=t?new h.x(t,i,!0):null,this.isBackground=void 0===l||l,this.color=void 0===p?new r.HE(1,1,1,1):p,this._scene=i||o.l.LastCreatedScene;let f=this._scene._getComponent(c.l.NAME_LAYER);f||(f=new u.N(this._scene),this._scene._addComponent(f)),this._scene.layers.push(this);const _=this._scene.getEngine();this._drawWrapper=new d.q(_);const m=[];m.push(1,1),m.push(-1,1),m.push(-1,-1),m.push(1,-1);const g=new a.o(_,m,a.o.PositionKind,!1,!1,2);this._vertexBuffers[a.o.PositionKind]=g,this._createIndexBuffer()}_createIndexBuffer(){const e=this._scene.getEngine(),t=[];t.push(0),t.push(1),t.push(2),t.push(0),t.push(2),t.push(3),this._indexBuffer=e.createIndexBuffer(t)}_rebuild(){const e=this._vertexBuffers[a.o.PositionKind];e&&e._rebuild(),this._createIndexBuffer()}render(){if(!this.isEnabled)return;const e=this._scene.getEngine();let t="";this.alphaTest&&(t="#define ALPHATEST"),this.texture&&!this.texture.gammaSpace&&(t+="\r\n#define LINEAR"),this._previousDefines!==t&&(this._previousDefines=t,this._drawWrapper.effect=e.createEffect("layer",[a.o.PositionKind],["textureMatrix","color","scale","offset"],["textureSampler"],t));const i=this._drawWrapper.effect;i&&i.isReady()&&this.texture&&this.texture.isReady()&&(this.onBeforeRenderObservable.notifyObservers(this),e.enableEffect(this._drawWrapper),e.setState(!1),i.setTexture("textureSampler",this.texture),i.setMatrix("textureMatrix",this.texture.getTextureMatrix()),i.setFloat4("color",this.color.r,this.color.g,this.color.b,this.color.a),i.setVector2("offset",this.offset),i.setVector2("scale",this.scale),e.bindBuffers(this._vertexBuffers,this._indexBuffer,i),this.alphaTest?e.drawElementsType(l.F.TriangleFillMode,0,6):(e.setAlphaMode(this.alphaBlendingMode),e.drawElementsType(l.F.TriangleFillMode,0,6),e.setAlphaMode(0)),this.onAfterRenderObservable.notifyObservers(this))}dispose(){const e=this._vertexBuffers[a.o.PositionKind];e&&(e.dispose(),this._vertexBuffers[a.o.PositionKind]=null),this._indexBuffer&&(this._scene.getEngine()._releaseBuffer(this._indexBuffer),this._indexBuffer=null),this.texture&&(this.texture.dispose(),this.texture=null),this.renderTargetTextures=[];const t=this._scene.layers.indexOf(this);this._scene.layers.splice(t,1),this.onDisposeObservable.notifyObservers(this),this.onDisposeObservable.clear(),this.onAfterRenderObservable.clear(),this.onBeforeRenderObservable.clear()}}},8513:(e,t,i)=>{i.d(t,{N:()=>r});var n=i(2333),s=i(1431);class r{constructor(e){this.name=n.l.NAME_LAYER,this.scene=e||s.l.LastCreatedScene,this.scene&&(this._engine=this.scene.getEngine(),this.scene.layers=new Array)}register(){this.scene._beforeCameraDrawStage.registerStep(n.l.STEP_BEFORECAMERADRAW_LAYER,this,this._drawCameraBackground),this.scene._afterCameraDrawStage.registerStep(n.l.STEP_AFTERCAMERADRAW_LAYER,this,this._drawCameraForegroundWithPostProcessing),this.scene._afterCameraPostProcessStage.registerStep(n.l.STEP_AFTERCAMERAPOSTPROCESS_LAYER,this,this._drawCameraForegroundWithoutPostProcessing),this.scene._beforeRenderTargetDrawStage.registerStep(n.l.STEP_BEFORERENDERTARGETDRAW_LAYER,this,this._drawRenderTargetBackground),this.scene._afterRenderTargetDrawStage.registerStep(n.l.STEP_AFTERRENDERTARGETDRAW_LAYER,this,this._drawRenderTargetForegroundWithPostProcessing),this.scene._afterRenderTargetPostProcessStage.registerStep(n.l.STEP_AFTERRENDERTARGETPOSTPROCESS_LAYER,this,this._drawRenderTargetForegroundWithoutPostProcessing)}rebuild(){const e=this.scene.layers;for(const t of e)t._rebuild()}dispose(){const e=this.scene.layers;for(;e.length;)e[0].dispose()}_draw(e){const t=this.scene.layers;if(t.length){this._engine.setDepthBuffer(!1);for(const i of t)e(i)&&i.render();this._engine.setDepthBuffer(!0)}}_drawCameraPredicate(e,t,i,n){return!e.renderOnlyInRenderTargetTextures&&e.isBackground===t&&e.applyPostProcess===i&&0!=(e.layerMask&n)}_drawCameraBackground(e){this._draw((t=>this._drawCameraPredicate(t,!0,!0,e.layerMask)))}_drawCameraForegroundWithPostProcessing(e){this._draw((t=>this._drawCameraPredicate(t,!1,!0,e.layerMask)))}_drawCameraForegroundWithoutPostProcessing(e){this._draw((t=>this._drawCameraPredicate(t,!1,!1,e.layerMask)))}_drawRenderTargetPredicate(e,t,i,n,s){return e.renderTargetTextures.length>0&&e.isBackground===t&&e.applyPostProcess===i&&e.renderTargetTextures.indexOf(s)>-1&&0!=(e.layerMask&n)}_drawRenderTargetBackground(e){this._draw((t=>this._drawRenderTargetPredicate(t,!0,!0,this.scene.activeCamera.layerMask,e)))}_drawRenderTargetForegroundWithPostProcessing(e){this._draw((t=>this._drawRenderTargetPredicate(t,!1,!0,this.scene.activeCamera.layerMask,e)))}_drawRenderTargetForegroundWithoutPostProcessing(e){this._draw((t=>this._drawRenderTargetPredicate(t,!1,!1,this.scene.activeCamera.layerMask,e)))}addFromContainer(e){e.layers&&e.layers.forEach((e=>{this.scene.layers.push(e)}))}removeFromContainer(e,t=!1){e.layers&&e.layers.forEach((e=>{const i=this.scene.layers.indexOf(e);-1!==i&&this.scene.layers.splice(i,1),t&&e.dispose()}))}}},7951:(e,t,i)=>{i.d(t,{O:()=>h});var n=i(9472),s=i(3956),r=i(4141),o=i(9257),a=i(9311),l=i(6792);o.N.AddNodeConstructor("Light_Type_1",((e,t)=>()=>new h(e,r.P.Zero(),t)));class h extends l.O{get shadowFrustumSize(){return this._shadowFrustumSize}set shadowFrustumSize(e){this._shadowFrustumSize=e,this.forceProjectionMatrixCompute()}get shadowOrthoScale(){return this._shadowOrthoScale}set shadowOrthoScale(e){this._shadowOrthoScale=e,this.forceProjectionMatrixCompute()}get orthoLeft(){return this._orthoLeft}set orthoLeft(e){this._orthoLeft=e}get orthoRight(){return this._orthoRight}set orthoRight(e){this._orthoRight=e}get orthoTop(){return this._orthoTop}set orthoTop(e){this._orthoTop=e}get orthoBottom(){return this._orthoBottom}set orthoBottom(e){this._orthoBottom=e}constructor(e,t,i){super(e,i),this._shadowFrustumSize=0,this._shadowOrthoScale=.1,this.autoUpdateExtends=!0,this.autoCalcShadowZBounds=!1,this._orthoLeft=Number.MAX_VALUE,this._orthoRight=Number.MIN_VALUE,this._orthoTop=Number.MIN_VALUE,this._orthoBottom=Number.MAX_VALUE,this.position=t.scale(-1),this.direction=t}getClassName(){return"DirectionalLight"}getTypeID(){return a._.LIGHTTYPEID_DIRECTIONALLIGHT}_setDefaultShadowProjectionMatrix(e,t,i){this.shadowFrustumSize>0?this._setDefaultFixedFrustumShadowProjectionMatrix(e):this._setDefaultAutoExtendShadowProjectionMatrix(e,t,i)}_setDefaultFixedFrustumShadowProjectionMatrix(e){const t=this.getScene().activeCamera;t&&r.y3.OrthoLHToRef(this.shadowFrustumSize,this.shadowFrustumSize,void 0!==this.shadowMinZ?this.shadowMinZ:t.minZ,void 0!==this.shadowMaxZ?this.shadowMaxZ:t.maxZ,e,this.getScene().getEngine().isNDCHalfZRange)}_setDefaultAutoExtendShadowProjectionMatrix(e,t,i){const n=this.getScene().activeCamera;if(!n)return;if(this.autoUpdateExtends||this._orthoLeft===Number.MAX_VALUE){const e=r.P.Zero();this._orthoLeft=Number.MAX_VALUE,this._orthoRight=Number.MIN_VALUE,this._orthoTop=Number.MIN_VALUE,this._orthoBottom=Number.MAX_VALUE;let n=Number.MAX_VALUE,s=Number.MIN_VALUE;for(let o=0;o<i.length;o++){const a=i[o];if(!a)continue;const l=a.getBoundingInfo().boundingBox;for(let i=0;i<l.vectorsWorld.length;i++)r.P.TransformCoordinatesToRef(l.vectorsWorld[i],t,e),e.x<this._orthoLeft&&(this._orthoLeft=e.x),e.y<this._orthoBottom&&(this._orthoBottom=e.y),e.x>this._orthoRight&&(this._orthoRight=e.x),e.y>this._orthoTop&&(this._orthoTop=e.y),this.autoCalcShadowZBounds&&(e.z<n&&(n=e.z),e.z>s&&(s=e.z))}this.autoCalcShadowZBounds&&(this._shadowMinZ=n,this._shadowMaxZ=s)}const s=this._orthoRight-this._orthoLeft,o=this._orthoTop-this._orthoBottom,a=void 0!==this.shadowMinZ?this.shadowMinZ:n.minZ,l=void 0!==this.shadowMaxZ?this.shadowMaxZ:n.maxZ,h=this.getScene().getEngine().useReverseDepthBuffer;r.y3.OrthoOffCenterLHToRef(this._orthoLeft-s*this.shadowOrthoScale,this._orthoRight+s*this.shadowOrthoScale,this._orthoBottom-o*this.shadowOrthoScale,this._orthoTop+o*this.shadowOrthoScale,h?l:a,h?a:l,e,this.getScene().getEngine().isNDCHalfZRange)}_buildUniformLayout(){this._uniformBuffer.addUniform("vLightData",4),this._uniformBuffer.addUniform("vLightDiffuse",4),this._uniformBuffer.addUniform("vLightSpecular",4),this._uniformBuffer.addUniform("shadowsInfo",3),this._uniformBuffer.addUniform("depthValues",2),this._uniformBuffer.create()}transferToEffect(e,t){return this.computeTransformedInformation()?(this._uniformBuffer.updateFloat4("vLightData",this.transformedDirection.x,this.transformedDirection.y,this.transformedDirection.z,1,t),this):(this._uniformBuffer.updateFloat4("vLightData",this.direction.x,this.direction.y,this.direction.z,1,t),this)}transferToNodeMaterialEffect(e,t){return this.computeTransformedInformation()?(e.setFloat3(t,this.transformedDirection.x,this.transformedDirection.y,this.transformedDirection.z),this):(e.setFloat3(t,this.direction.x,this.direction.y,this.direction.z),this)}getDepthMinZ(e){const t=this._scene.getEngine();return!t.useReverseDepthBuffer&&t.isNDCHalfZRange?0:1}getDepthMaxZ(e){const t=this._scene.getEngine();return t.useReverseDepthBuffer&&t.isNDCHalfZRange?0:1}prepareLightSpecificDefines(e,t){e["DIRLIGHT"+t]=!0}}(0,n.gn)([(0,s.qC)()],h.prototype,"shadowFrustumSize",null),(0,n.gn)([(0,s.qC)()],h.prototype,"shadowOrthoScale",null),(0,n.gn)([(0,s.qC)()],h.prototype,"autoUpdateExtends",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"autoCalcShadowZBounds",void 0),(0,n.gn)([(0,s.qC)("orthoLeft")],h.prototype,"_orthoLeft",void 0),(0,n.gn)([(0,s.qC)("orthoRight")],h.prototype,"_orthoRight",void 0),(0,n.gn)([(0,s.qC)("orthoTop")],h.prototype,"_orthoTop",void 0),(0,n.gn)([(0,s.qC)("orthoBottom")],h.prototype,"_orthoBottom",void 0)},7616:(e,t,i)=>{i.d(t,{e:()=>h});var n=i(9472),s=i(3956),r=i(4141),o=i(4649),a=i(9257),l=i(9311);a.N.AddNodeConstructor("Light_Type_3",((e,t)=>()=>new h(e,r.P.Zero(),t)));class h extends l._{constructor(e,t,i){super(e,i),this.groundColor=new o.Wo(0,0,0),this.direction=t||r.P.Up()}_buildUniformLayout(){this._uniformBuffer.addUniform("vLightData",4),this._uniformBuffer.addUniform("vLightDiffuse",4),this._uniformBuffer.addUniform("vLightSpecular",4),this._uniformBuffer.addUniform("vLightGround",3),this._uniformBuffer.addUniform("shadowsInfo",3),this._uniformBuffer.addUniform("depthValues",2),this._uniformBuffer.create()}getClassName(){return"HemisphericLight"}setDirectionToTarget(e){return this.direction=r.P.Normalize(e.subtract(r.P.Zero())),this.direction}getShadowGenerator(){return null}transferToEffect(e,t){const i=r.P.Normalize(this.direction);return this._uniformBuffer.updateFloat4("vLightData",i.x,i.y,i.z,0,t),this._uniformBuffer.updateColor3("vLightGround",this.groundColor.scale(this.intensity),t),this}transferToNodeMaterialEffect(e,t){const i=r.P.Normalize(this.direction);return e.setFloat3(t,i.x,i.y,i.z),this}computeWorldMatrix(){return this._worldMatrix||(this._worldMatrix=r.y3.Identity()),this._worldMatrix}getTypeID(){return l._.LIGHTTYPEID_HEMISPHERICLIGHT}prepareLightSpecificDefines(e,t){e["HEMILIGHT"+t]=!0}}(0,n.gn)([(0,s.n9)()],h.prototype,"groundColor",void 0),(0,n.gn)([(0,s.hd)()],h.prototype,"direction",void 0)},9311:(e,t,i)=>{i.d(t,{_:()=>u});var n=i(9472),s=i(3956),r=i(4141),o=i(4649),a=i(9257),l=i(3743),h=i(2208),c=i(4185);class u extends a.N{get range(){return this._range}set range(e){this._range=e,this._inverseSquaredRange=1/(this.range*this.range)}get intensityMode(){return this._intensityMode}set intensityMode(e){this._intensityMode=e,this._computePhotometricScale()}get radius(){return this._radius}set radius(e){this._radius=e,this._computePhotometricScale()}get shadowEnabled(){return this._shadowEnabled}set shadowEnabled(e){this._shadowEnabled!==e&&(this._shadowEnabled=e,this._markMeshesAsLightDirty())}get includedOnlyMeshes(){return this._includedOnlyMeshes}set includedOnlyMeshes(e){this._includedOnlyMeshes=e,this._hookArrayForIncludedOnly(e)}get excludedMeshes(){return this._excludedMeshes}set excludedMeshes(e){this._excludedMeshes=e,this._hookArrayForExcluded(e)}get excludeWithLayerMask(){return this._excludeWithLayerMask}set excludeWithLayerMask(e){this._excludeWithLayerMask=e,this._resyncMeshes()}get includeOnlyWithLayerMask(){return this._includeOnlyWithLayerMask}set includeOnlyWithLayerMask(e){this._includeOnlyWithLayerMask=e,this._resyncMeshes()}get lightmapMode(){return this._lightmapMode}set lightmapMode(e){this._lightmapMode!==e&&(this._lightmapMode=e,this._markMeshesAsLightDirty())}constructor(e,t){super(e,t),this.diffuse=new o.Wo(1,1,1),this.specular=new o.Wo(1,1,1),this.falloffType=u.FALLOFF_DEFAULT,this.intensity=1,this._range=Number.MAX_VALUE,this._inverseSquaredRange=0,this._photometricScale=1,this._intensityMode=u.INTENSITYMODE_AUTOMATIC,this._radius=1e-5,this.renderPriority=0,this._shadowEnabled=!0,this._excludeWithLayerMask=0,this._includeOnlyWithLayerMask=0,this._lightmapMode=0,this._shadowGenerators=null,this._excludedMeshesIds=new Array,this._includedOnlyMeshesIds=new Array,this._isLight=!0,this.getScene().addLight(this),this._uniformBuffer=new l.M(this.getScene().getEngine(),void 0,void 0,e),this._buildUniformLayout(),this.includedOnlyMeshes=new Array,this.excludedMeshes=new Array,this._resyncMeshes()}transferTexturesToEffect(e,t){return this}_bindLight(e,t,i,n,s=!0){var r;const a=e.toString();let l=!1;if(this._uniformBuffer.bindToEffect(i,"Light"+a),this._renderId!==t.getRenderId()||this._lastUseSpecular!==n||!this._uniformBuffer.useUbo){this._renderId=t.getRenderId(),this._lastUseSpecular=n;const e=this.getScaledIntensity();this.transferToEffect(i,a),this.diffuse.scaleToRef(e,o.zZ.Color3[0]),this._uniformBuffer.updateColor4("vLightDiffuse",o.zZ.Color3[0],this.range,a),n&&(this.specular.scaleToRef(e,o.zZ.Color3[1]),this._uniformBuffer.updateColor4("vLightSpecular",o.zZ.Color3[1],this.radius,a)),l=!0}if(this.transferTexturesToEffect(i,a),t.shadowsEnabled&&this.shadowEnabled&&s){const e=null!==(r=this.getShadowGenerator(t.activeCamera))&&void 0!==r?r:this.getShadowGenerator();e&&(e.bindShadowLight(a,i),l=!0)}l?this._uniformBuffer.update():this._uniformBuffer.bindUniformBuffer()}getClassName(){return"Light"}toString(e){let t="Name: "+this.name;if(t+=", type: "+["Point","Directional","Spot","Hemispheric"][this.getTypeID()],this.animations)for(let i=0;i<this.animations.length;i++)t+=", animation[0]: "+this.animations[i].toString(e);return t}_syncParentEnabledState(){super._syncParentEnabledState(),this.isDisposed()||this._resyncMeshes()}setEnabled(e){super.setEnabled(e),this._resyncMeshes()}getShadowGenerator(e=null){var t;return null===this._shadowGenerators?null:null!==(t=this._shadowGenerators.get(e))&&void 0!==t?t:null}getShadowGenerators(){return this._shadowGenerators}getAbsolutePosition(){return r.P.Zero()}canAffectMesh(e){return!(e&&(this.includedOnlyMeshes&&this.includedOnlyMeshes.length>0&&-1===this.includedOnlyMeshes.indexOf(e)||this.excludedMeshes&&this.excludedMeshes.length>0&&-1!==this.excludedMeshes.indexOf(e)||0!==this.includeOnlyWithLayerMask&&0==(this.includeOnlyWithLayerMask&e.layerMask)||0!==this.excludeWithLayerMask&&this.excludeWithLayerMask&e.layerMask))}dispose(e,t=!1){if(this._shadowGenerators){const e=this._shadowGenerators.values();for(let t=e.next();!0!==t.done;t=e.next())t.value.dispose();this._shadowGenerators=null}if(this.getScene().stopAnimation(this),this._parentContainer){const e=this._parentContainer.lights.indexOf(this);e>-1&&this._parentContainer.lights.splice(e,1),this._parentContainer=null}for(const e of this.getScene().meshes)e._removeLightSource(this,!0);this._uniformBuffer.dispose(),this.getScene().removeLight(this),super.dispose(e,t)}getTypeID(){return 0}getScaledIntensity(){return this._photometricScale*this.intensity}clone(e,t=null){const i=u.GetConstructorFromName(this.getTypeID(),e,this.getScene());if(!i)return null;const n=s.p4.Clone(i,this);return e&&(n.name=e),t&&(n.parent=t),n.setEnabled(this.isEnabled()),this.onClonedObservable.notifyObservers(n),n}serialize(){const e=s.p4.Serialize(this);return e.uniqueId=this.uniqueId,e.type=this.getTypeID(),this.parent&&this.parent._serializeAsParent(e),this.excludedMeshes.length>0&&(e.excludedMeshesIds=[],this.excludedMeshes.forEach((t=>{e.excludedMeshesIds.push(t.id)}))),this.includedOnlyMeshes.length>0&&(e.includedOnlyMeshesIds=[],this.includedOnlyMeshes.forEach((t=>{e.includedOnlyMeshesIds.push(t.id)}))),s.p4.AppendSerializedAnimations(this,e),e.ranges=this.serializeAnimationRanges(),e.isEnabled=this.isEnabled(),e}static GetConstructorFromName(e,t,i){return a.N.Construct("Light_Type_"+e,t,i)||null}static Parse(e,t){const i=u.GetConstructorFromName(e.type,e.name,t);if(!i)return null;const n=s.p4.Parse(i,e,t);if(e.excludedMeshesIds&&(n._excludedMeshesIds=e.excludedMeshesIds),e.includedOnlyMeshesIds&&(n._includedOnlyMeshesIds=e.includedOnlyMeshesIds),void 0!==e.parentId&&(n._waitingParentId=e.parentId),void 0!==e.parentInstanceIndex&&(n._waitingParentInstanceIndex=e.parentInstanceIndex),void 0!==e.falloffType&&(n.falloffType=e.falloffType),void 0!==e.lightmapMode&&(n.lightmapMode=e.lightmapMode),e.animations){for(let t=0;t<e.animations.length;t++){const i=e.animations[t],s=(0,h.q)("BABYLON.Animation");s&&n.animations.push(s.Parse(i))}a.N.ParseAnimationRanges(n,e,t)}return e.autoAnimate&&t.beginAnimation(n,e.autoAnimateFrom,e.autoAnimateTo,e.autoAnimateLoop,e.autoAnimateSpeed||1),void 0!==e.isEnabled&&n.setEnabled(e.isEnabled),n}_hookArrayForExcluded(e){const t=e.push;e.push=(...i)=>{const n=t.apply(e,i);for(const e of i)e._resyncLightSource(this);return n};const i=e.splice;e.splice=(t,n)=>{const s=i.apply(e,[t,n]);for(const e of s)e._resyncLightSource(this);return s};for(const t of e)t._resyncLightSource(this)}_hookArrayForIncludedOnly(e){const t=e.push;e.push=(...i)=>{const n=t.apply(e,i);return this._resyncMeshes(),n};const i=e.splice;e.splice=(t,n)=>{const s=i.apply(e,[t,n]);return this._resyncMeshes(),s},this._resyncMeshes()}_resyncMeshes(){for(const e of this.getScene().meshes)e._resyncLightSource(this)}_markMeshesAsLightDirty(){for(const e of this.getScene().meshes)-1!==e.lightSources.indexOf(this)&&e._markSubMeshesAsLightDirty()}_computePhotometricScale(){this._photometricScale=this._getPhotometricScale(),this.getScene().resetCachedMaterial()}_getPhotometricScale(){let e=0;const t=this.getTypeID();let i=this.intensityMode;switch(i===u.INTENSITYMODE_AUTOMATIC&&(i=t===u.LIGHTTYPEID_DIRECTIONALLIGHT?u.INTENSITYMODE_ILLUMINANCE:u.INTENSITYMODE_LUMINOUSINTENSITY),t){case u.LIGHTTYPEID_POINTLIGHT:case u.LIGHTTYPEID_SPOTLIGHT:switch(i){case u.INTENSITYMODE_LUMINOUSPOWER:e=1/(4*Math.PI);break;case u.INTENSITYMODE_LUMINOUSINTENSITY:e=1;break;case u.INTENSITYMODE_LUMINANCE:e=this.radius*this.radius}break;case u.LIGHTTYPEID_DIRECTIONALLIGHT:switch(i){case u.INTENSITYMODE_ILLUMINANCE:e=1;break;case u.INTENSITYMODE_LUMINANCE:{let t=this.radius;t=Math.max(t,.001),e=2*Math.PI*(1-Math.cos(t));break}}break;case u.LIGHTTYPEID_HEMISPHERICLIGHT:e=1}return e}_reorderLightsInScene(){const e=this.getScene();0!=this._renderPriority&&(e.requireLightSorting=!0),this.getScene().sortLightsByPriority()}}u.FALLOFF_DEFAULT=c.m.FALLOFF_DEFAULT,u.FALLOFF_PHYSICAL=c.m.FALLOFF_PHYSICAL,u.FALLOFF_GLTF=c.m.FALLOFF_GLTF,u.FALLOFF_STANDARD=c.m.FALLOFF_STANDARD,u.LIGHTMAP_DEFAULT=c.m.LIGHTMAP_DEFAULT,u.LIGHTMAP_SPECULAR=c.m.LIGHTMAP_SPECULAR,u.LIGHTMAP_SHADOWSONLY=c.m.LIGHTMAP_SHADOWSONLY,u.INTENSITYMODE_AUTOMATIC=c.m.INTENSITYMODE_AUTOMATIC,u.INTENSITYMODE_LUMINOUSPOWER=c.m.INTENSITYMODE_LUMINOUSPOWER,u.INTENSITYMODE_LUMINOUSINTENSITY=c.m.INTENSITYMODE_LUMINOUSINTENSITY,u.INTENSITYMODE_ILLUMINANCE=c.m.INTENSITYMODE_ILLUMINANCE,u.INTENSITYMODE_LUMINANCE=c.m.INTENSITYMODE_LUMINANCE,u.LIGHTTYPEID_POINTLIGHT=c.m.LIGHTTYPEID_POINTLIGHT,u.LIGHTTYPEID_DIRECTIONALLIGHT=c.m.LIGHTTYPEID_DIRECTIONALLIGHT,u.LIGHTTYPEID_SPOTLIGHT=c.m.LIGHTTYPEID_SPOTLIGHT,u.LIGHTTYPEID_HEMISPHERICLIGHT=c.m.LIGHTTYPEID_HEMISPHERICLIGHT,(0,n.gn)([(0,s.n9)()],u.prototype,"diffuse",void 0),(0,n.gn)([(0,s.n9)()],u.prototype,"specular",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"falloffType",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"intensity",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"range",null),(0,n.gn)([(0,s.qC)()],u.prototype,"intensityMode",null),(0,n.gn)([(0,s.qC)()],u.prototype,"radius",null),(0,n.gn)([(0,s.qC)()],u.prototype,"_renderPriority",void 0),(0,n.gn)([(0,s.wz)("_reorderLightsInScene")],u.prototype,"renderPriority",void 0),(0,n.gn)([(0,s.qC)("shadowEnabled")],u.prototype,"_shadowEnabled",void 0),(0,n.gn)([(0,s.qC)("excludeWithLayerMask")],u.prototype,"_excludeWithLayerMask",void 0),(0,n.gn)([(0,s.qC)("includeOnlyWithLayerMask")],u.prototype,"_includeOnlyWithLayerMask",void 0),(0,n.gn)([(0,s.qC)("lightmapMode")],u.prototype,"_lightmapMode",void 0)},4185:(e,t,i)=>{i.d(t,{m:()=>n});class n{static CompareLightsPriority(e,t){return e.shadowEnabled!==t.shadowEnabled?(t.shadowEnabled?1:0)-(e.shadowEnabled?1:0):t.renderPriority-e.renderPriority}}n.FALLOFF_DEFAULT=0,n.FALLOFF_PHYSICAL=1,n.FALLOFF_GLTF=2,n.FALLOFF_STANDARD=3,n.LIGHTMAP_DEFAULT=0,n.LIGHTMAP_SPECULAR=1,n.LIGHTMAP_SHADOWSONLY=2,n.INTENSITYMODE_AUTOMATIC=0,n.INTENSITYMODE_LUMINOUSPOWER=1,n.INTENSITYMODE_LUMINOUSINTENSITY=2,n.INTENSITYMODE_ILLUMINANCE=3,n.INTENSITYMODE_LUMINANCE=4,n.LIGHTTYPEID_POINTLIGHT=0,n.LIGHTTYPEID_DIRECTIONALLIGHT=1,n.LIGHTTYPEID_SPOTLIGHT=2,n.LIGHTTYPEID_HEMISPHERICLIGHT=3},5520:(e,t,i)=>{i.d(t,{c:()=>h});var n=i(9472),s=i(3956),r=i(4141),o=i(9257),a=i(9311),l=i(6792);o.N.AddNodeConstructor("Light_Type_0",((e,t)=>()=>new h(e,r.P.Zero(),t)));class h extends l.O{get shadowAngle(){return this._shadowAngle}set shadowAngle(e){this._shadowAngle=e,this.forceProjectionMatrixCompute()}get direction(){return this._direction}set direction(e){const t=this.needCube();if(this._direction=e,this.needCube()!==t&&this._shadowGenerators){const e=this._shadowGenerators.values();for(let t=e.next();!0!==t.done;t=e.next())t.value.recreateShadowMap()}}constructor(e,t,i){super(e,i),this._shadowAngle=Math.PI/2,this.position=t}getClassName(){return"PointLight"}getTypeID(){return a._.LIGHTTYPEID_POINTLIGHT}needCube(){return!this.direction}getShadowDirection(e){if(this.direction)return super.getShadowDirection(e);switch(e){case 0:return new r.P(1,0,0);case 1:return new r.P(-1,0,0);case 2:return new r.P(0,-1,0);case 3:return new r.P(0,1,0);case 4:return new r.P(0,0,1);case 5:return new r.P(0,0,-1)}return r.P.Zero()}_setDefaultShadowProjectionMatrix(e,t,i){const n=this.getScene().activeCamera;if(!n)return;const s=void 0!==this.shadowMinZ?this.shadowMinZ:n.minZ,o=void 0!==this.shadowMaxZ?this.shadowMaxZ:n.maxZ,a=this.getScene().getEngine().useReverseDepthBuffer;r.y3.PerspectiveFovLHToRef(this.shadowAngle,1,a?o:s,a?s:o,e,!0,this._scene.getEngine().isNDCHalfZRange,void 0,a)}_buildUniformLayout(){this._uniformBuffer.addUniform("vLightData",4),this._uniformBuffer.addUniform("vLightDiffuse",4),this._uniformBuffer.addUniform("vLightSpecular",4),this._uniformBuffer.addUniform("vLightFalloff",4),this._uniformBuffer.addUniform("shadowsInfo",3),this._uniformBuffer.addUniform("depthValues",2),this._uniformBuffer.create()}transferToEffect(e,t){return this.computeTransformedInformation()?this._uniformBuffer.updateFloat4("vLightData",this.transformedPosition.x,this.transformedPosition.y,this.transformedPosition.z,0,t):this._uniformBuffer.updateFloat4("vLightData",this.position.x,this.position.y,this.position.z,0,t),this._uniformBuffer.updateFloat4("vLightFalloff",this.range,this._inverseSquaredRange,0,0,t),this}transferToNodeMaterialEffect(e,t){return this.computeTransformedInformation()?e.setFloat3(t,this.transformedPosition.x,this.transformedPosition.y,this.transformedPosition.z):e.setFloat3(t,this.position.x,this.position.y,this.position.z),this}prepareLightSpecificDefines(e,t){e["POINTLIGHT"+t]=!0}}(0,n.gn)([(0,s.qC)()],h.prototype,"shadowAngle",null)},6792:(e,t,i)=>{i.d(t,{O:()=>l});var n=i(9472),s=i(3956),r=i(4141),o=i(9311),a=i(5203);class l extends o._{constructor(){super(...arguments),this._needProjectionMatrixCompute=!0}_setPosition(e){this._position=e}get position(){return this._position}set position(e){this._setPosition(e)}_setDirection(e){this._direction=e}get direction(){return this._direction}set direction(e){this._setDirection(e)}get shadowMinZ(){return this._shadowMinZ}set shadowMinZ(e){this._shadowMinZ=e,this.forceProjectionMatrixCompute()}get shadowMaxZ(){return this._shadowMaxZ}set shadowMaxZ(e){this._shadowMaxZ=e,this.forceProjectionMatrixCompute()}computeTransformedInformation(){return!(!this.parent||!this.parent.getWorldMatrix||(this.transformedPosition||(this.transformedPosition=r.P.Zero()),r.P.TransformCoordinatesToRef(this.position,this.parent.getWorldMatrix(),this.transformedPosition),this.direction&&(this.transformedDirection||(this.transformedDirection=r.P.Zero()),r.P.TransformNormalToRef(this.direction,this.parent.getWorldMatrix(),this.transformedDirection)),0))}getDepthScale(){return 50}getShadowDirection(e){return this.transformedDirection?this.transformedDirection:this.direction}getAbsolutePosition(){return this.transformedPosition?this.transformedPosition:this.position}setDirectionToTarget(e){return this.direction=r.P.Normalize(e.subtract(this.position)),this.direction}getRotation(){this.direction.normalize();const e=r.P.Cross(this.direction,a.RD.Y),t=r.P.Cross(e,this.direction);return r.P.RotationFromAxis(e,t,this.direction)}needCube(){return!1}needProjectionMatrixCompute(){return this._needProjectionMatrixCompute}forceProjectionMatrixCompute(){this._needProjectionMatrixCompute=!0}_initCache(){super._initCache(),this._cache.position=r.P.Zero()}_isSynchronized(){return!!this._cache.position.equals(this.position)}computeWorldMatrix(e){return!e&&this.isSynchronized()?(this._currentRenderId=this.getScene().getRenderId(),this._worldMatrix):(this._updateCache(),this._cache.position.copyFrom(this.position),this._worldMatrix||(this._worldMatrix=r.y3.Identity()),r.y3.TranslationToRef(this.position.x,this.position.y,this.position.z,this._worldMatrix),this.parent&&this.parent.getWorldMatrix&&(this._worldMatrix.multiplyToRef(this.parent.getWorldMatrix(),this._worldMatrix),this._markSyncedWithParent()),this._worldMatrixDeterminantIsDirty=!0,this._worldMatrix)}getDepthMinZ(e){return void 0!==this.shadowMinZ?this.shadowMinZ:e.minZ}getDepthMaxZ(e){return void 0!==this.shadowMaxZ?this.shadowMaxZ:e.maxZ}setShadowProjectionMatrix(e,t,i){return this.customProjectionMatrixBuilder?this.customProjectionMatrixBuilder(t,i,e):this._setDefaultShadowProjectionMatrix(e,t,i),this}_syncParentEnabledState(){super._syncParentEnabledState(),this.parent&&this.parent.getWorldMatrix||(this.transformedPosition=null,this.transformedDirection=null)}}(0,n.gn)([(0,s.hd)()],l.prototype,"position",null),(0,n.gn)([(0,s.hd)()],l.prototype,"direction",null),(0,n.gn)([(0,s.qC)()],l.prototype,"shadowMinZ",null),(0,n.gn)([(0,s.qC)()],l.prototype,"shadowMaxZ",null)},6317:(e,t,i)=>{i.d(t,{P:()=>c});var n=i(9472),s=i(3956),r=i(4141),o=i(9257),a=i(9311),l=i(6792),h=i(2262);o.N.AddNodeConstructor("Light_Type_2",((e,t)=>()=>new c(e,r.P.Zero(),r.P.Zero(),0,0,t)));class c extends l.O{get angle(){return this._angle}set angle(e){this._angle=e,this._cosHalfAngle=Math.cos(.5*e),this._projectionTextureProjectionLightDirty=!0,this.forceProjectionMatrixCompute(),this._computeAngleValues()}get innerAngle(){return this._innerAngle}set innerAngle(e){this._innerAngle=e,this._computeAngleValues()}get shadowAngleScale(){return this._shadowAngleScale}set shadowAngleScale(e){this._shadowAngleScale=e,this.forceProjectionMatrixCompute()}get projectionTextureMatrix(){return this._projectionTextureMatrix}get projectionTextureLightNear(){return this._projectionTextureLightNear}set projectionTextureLightNear(e){this._projectionTextureLightNear=e,this._projectionTextureProjectionLightDirty=!0}get projectionTextureLightFar(){return this._projectionTextureLightFar}set projectionTextureLightFar(e){this._projectionTextureLightFar=e,this._projectionTextureProjectionLightDirty=!0}get projectionTextureUpDirection(){return this._projectionTextureUpDirection}set projectionTextureUpDirection(e){this._projectionTextureUpDirection=e,this._projectionTextureProjectionLightDirty=!0}get projectionTexture(){return this._projectionTexture}set projectionTexture(e){this._projectionTexture!==e&&(this._projectionTexture=e,this._projectionTextureDirty=!0,this._projectionTexture&&!this._projectionTexture.isReady()&&(c._IsProceduralTexture(this._projectionTexture)?this._projectionTexture.getEffect().executeWhenCompiled((()=>{this._markMeshesAsLightDirty()})):c._IsTexture(this._projectionTexture)&&this._projectionTexture.onLoadObservable.addOnce((()=>{this._markMeshesAsLightDirty()}))))}static _IsProceduralTexture(e){return void 0!==e.onGeneratedObservable}static _IsTexture(e){return void 0!==e.onLoadObservable}get projectionTextureProjectionLightMatrix(){return this._projectionTextureProjectionLightMatrix}set projectionTextureProjectionLightMatrix(e){this._projectionTextureProjectionLightMatrix=e,this._projectionTextureProjectionLightDirty=!1,this._projectionTextureDirty=!0}constructor(e,t,i,n,s,o){super(e,o),this._innerAngle=0,this._projectionTextureMatrix=r.y3.Zero(),this._projectionTextureLightNear=1e-6,this._projectionTextureLightFar=1e3,this._projectionTextureUpDirection=r.P.Up(),this._projectionTextureViewLightDirty=!0,this._projectionTextureProjectionLightDirty=!0,this._projectionTextureDirty=!0,this._projectionTextureViewTargetVector=r.P.Zero(),this._projectionTextureViewLightMatrix=r.y3.Zero(),this._projectionTextureProjectionLightMatrix=r.y3.Zero(),this._projectionTextureScalingMatrix=r.y3.FromValues(.5,0,0,0,0,.5,0,0,0,0,.5,0,.5,.5,.5,1),this.position=t,this.direction=i,this.angle=n,this.exponent=s}getClassName(){return"SpotLight"}getTypeID(){return a._.LIGHTTYPEID_SPOTLIGHT}_setDirection(e){super._setDirection(e),this._projectionTextureViewLightDirty=!0}_setPosition(e){super._setPosition(e),this._projectionTextureViewLightDirty=!0}_setDefaultShadowProjectionMatrix(e,t,i){const n=this.getScene().activeCamera;if(!n)return;this._shadowAngleScale=this._shadowAngleScale||1;const s=this._shadowAngleScale*this._angle,o=void 0!==this.shadowMinZ?this.shadowMinZ:n.minZ,a=void 0!==this.shadowMaxZ?this.shadowMaxZ:n.maxZ,l=this.getScene().getEngine().useReverseDepthBuffer;r.y3.PerspectiveFovLHToRef(s,1,l?a:o,l?o:a,e,!0,this._scene.getEngine().isNDCHalfZRange,void 0,l)}_computeProjectionTextureViewLightMatrix(){this._projectionTextureViewLightDirty=!1,this._projectionTextureDirty=!0,this.position.addToRef(this.direction,this._projectionTextureViewTargetVector),r.y3.LookAtLHToRef(this.position,this._projectionTextureViewTargetVector,this._projectionTextureUpDirection,this._projectionTextureViewLightMatrix)}_computeProjectionTextureProjectionLightMatrix(){this._projectionTextureProjectionLightDirty=!1,this._projectionTextureDirty=!0;const e=this.projectionTextureLightFar,t=this.projectionTextureLightNear,i=e/(e-t),n=-i*t,s=1/Math.tan(this._angle/2);r.y3.FromValuesToRef(s/1,0,0,0,0,s,0,0,0,0,i,1,0,0,n,0,this._projectionTextureProjectionLightMatrix)}_computeProjectionTextureMatrix(){if(this._projectionTextureDirty=!1,this._projectionTextureViewLightMatrix.multiplyToRef(this._projectionTextureProjectionLightMatrix,this._projectionTextureMatrix),this._projectionTexture instanceof h.x){const e=this._projectionTexture.uScale/2,t=this._projectionTexture.vScale/2;r.y3.FromValuesToRef(e,0,0,0,0,t,0,0,0,0,.5,0,.5,.5,.5,1,this._projectionTextureScalingMatrix)}this._projectionTextureMatrix.multiplyToRef(this._projectionTextureScalingMatrix,this._projectionTextureMatrix)}_buildUniformLayout(){this._uniformBuffer.addUniform("vLightData",4),this._uniformBuffer.addUniform("vLightDiffuse",4),this._uniformBuffer.addUniform("vLightSpecular",4),this._uniformBuffer.addUniform("vLightDirection",3),this._uniformBuffer.addUniform("vLightFalloff",4),this._uniformBuffer.addUniform("shadowsInfo",3),this._uniformBuffer.addUniform("depthValues",2),this._uniformBuffer.create()}_computeAngleValues(){this._lightAngleScale=1/Math.max(.001,Math.cos(.5*this._innerAngle)-this._cosHalfAngle),this._lightAngleOffset=-this._cosHalfAngle*this._lightAngleScale}transferTexturesToEffect(e,t){return this.projectionTexture&&this.projectionTexture.isReady()&&(this._projectionTextureViewLightDirty&&this._computeProjectionTextureViewLightMatrix(),this._projectionTextureProjectionLightDirty&&this._computeProjectionTextureProjectionLightMatrix(),this._projectionTextureDirty&&this._computeProjectionTextureMatrix(),e.setMatrix("textureProjectionMatrix"+t,this._projectionTextureMatrix),e.setTexture("projectionLightSampler"+t,this.projectionTexture)),this}transferToEffect(e,t){let i;return this.computeTransformedInformation()?(this._uniformBuffer.updateFloat4("vLightData",this.transformedPosition.x,this.transformedPosition.y,this.transformedPosition.z,this.exponent,t),i=r.P.Normalize(this.transformedDirection)):(this._uniformBuffer.updateFloat4("vLightData",this.position.x,this.position.y,this.position.z,this.exponent,t),i=r.P.Normalize(this.direction)),this._uniformBuffer.updateFloat4("vLightDirection",i.x,i.y,i.z,this._cosHalfAngle,t),this._uniformBuffer.updateFloat4("vLightFalloff",this.range,this._inverseSquaredRange,this._lightAngleScale,this._lightAngleOffset,t),this}transferToNodeMaterialEffect(e,t){let i;return i=this.computeTransformedInformation()?r.P.Normalize(this.transformedDirection):r.P.Normalize(this.direction),this.getScene().useRightHandedSystem?e.setFloat3(t,-i.x,-i.y,-i.z):e.setFloat3(t,i.x,i.y,i.z),this}dispose(){super.dispose(),this._projectionTexture&&this._projectionTexture.dispose()}getDepthMinZ(e){const t=this._scene.getEngine(),i=void 0!==this.shadowMinZ?this.shadowMinZ:e.minZ;return t.useReverseDepthBuffer&&t.isNDCHalfZRange?i:this._scene.getEngine().isNDCHalfZRange?0:i}getDepthMaxZ(e){const t=this._scene.getEngine(),i=void 0!==this.shadowMaxZ?this.shadowMaxZ:e.maxZ;return t.useReverseDepthBuffer&&t.isNDCHalfZRange?0:i}prepareLightSpecificDefines(e,t){e["SPOTLIGHT"+t]=!0,e["PROJECTEDLIGHTTEXTURE"+t]=!(!this.projectionTexture||!this.projectionTexture.isReady())}}(0,n.gn)([(0,s.qC)()],c.prototype,"angle",null),(0,n.gn)([(0,s.qC)()],c.prototype,"innerAngle",null),(0,n.gn)([(0,s.qC)()],c.prototype,"shadowAngleScale",null),(0,n.gn)([(0,s.qC)()],c.prototype,"exponent",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"projectionTextureLightNear",null),(0,n.gn)([(0,s.qC)()],c.prototype,"projectionTextureLightFar",null),(0,n.gn)([(0,s.qC)()],c.prototype,"projectionTextureUpDirection",null),(0,n.gn)([(0,s.oU)("projectedLightTexture")],c.prototype,"_projectionTexture",void 0)},9953:(e,t,i)=>{i.d(t,{O:()=>n,n:()=>p});var n,s=i(7257),r=i(5757),o=i(1057),a=i(7814),l=i(1431),h=i(2722),c=i(1376),u=i(5661),d=i(1722);!function(e){e[e.Clean=0]="Clean",e[e.Stop=1]="Stop",e[e.Sync=2]="Sync",e[e.NoSync=3]="NoSync"}(n||(n={}));class p{static get ForceFullSceneLoadingForIncremental(){return c.Z.ForceFullSceneLoadingForIncremental}static set ForceFullSceneLoadingForIncremental(e){c.Z.ForceFullSceneLoadingForIncremental=e}static get ShowLoadingScreen(){return c.Z.ShowLoadingScreen}static set ShowLoadingScreen(e){c.Z.ShowLoadingScreen=e}static get loggingLevel(){return c.Z.loggingLevel}static set loggingLevel(e){c.Z.loggingLevel=e}static get CleanBoneMatrixWeights(){return c.Z.CleanBoneMatrixWeights}static set CleanBoneMatrixWeights(e){c.Z.CleanBoneMatrixWeights=e}static GetDefaultPlugin(){return p._RegisteredPlugins[".babylon"]}static _GetPluginForExtension(e){return p._RegisteredPlugins[e]||(h.Y.Warn("Unable to find a plugin to load "+e+" files. Trying to use .babylon default plugin. To load from a specific filetype (eg. gltf) see: https://doc.babylonjs.com/features/featuresDeepDive/importers/loadingFileTypes"),p.GetDefaultPlugin())}static _GetPluginForDirectLoad(e){for(const t in p._RegisteredPlugins){const i=p._RegisteredPlugins[t].plugin;if(i.canDirectLoad&&i.canDirectLoad(e))return p._RegisteredPlugins[t]}return p.GetDefaultPlugin()}static _GetPluginForFilename(e){const t=e.indexOf("?");-1!==t&&(e=e.substring(0,t));const i=e.lastIndexOf("."),n=e.substring(i,e.length).toLowerCase();return p._GetPluginForExtension(n)}static _GetDirectLoad(e){return"data:"===e.substr(0,5)?e.substr(5):null}static _FormatErrorMessage(e,t,i){let n="Unable to load from "+e.url;return t?n+=`: ${t}`:i&&(n+=`: ${i}`),n}static _LoadData(e,t,i,n,s,r,o){const l=p._GetDirectLoad(e.url),h=o?p._GetPluginForExtension(o):l?p._GetPluginForDirectLoad(e.url):p._GetPluginForFilename(e.url);let c;if(c=void 0!==h.plugin.createPlugin?h.plugin.createPlugin():h.plugin,!c)throw"The loader plugin corresponding to the file type you are trying to load has not been found. If using es6, please import the plugin you wish to use before.";if(p.OnPluginActivatedObservable.notifyObservers(c),l&&(c.canDirectLoad&&c.canDirectLoad(e.url)||!(0,u.VL)(e.url))){if(c.directLoad){const e=c.directLoad(t,l);e.then?e.then((e=>{i(c,e)})).catch((e=>{s("Error in directLoad of _loadData: "+e,e)})):i(c,e)}else i(c,l);return c}const d=h.isBinary,f=(e,n)=>{t.isDisposed?s("Scene has been disposed"):i(c,e,n)};let _=null,m=!1;const g=c.onDisposeObservable;g&&g.add((()=>{m=!0,_&&(_.abort(),_=null),r()}));const v=()=>{if(m)return;const i=(e,t)=>{s(null==e?void 0:e.statusText,t)},r=e.file||e.url;_=c.loadFile?c.loadFile(t,r,f,n,d,i):t._loadFile(r,f,n,!0,d,i)},y=t.getEngine();let x=y.enableOfflineSupport;if(x){let i=!1;for(const n of t.disableOfflineSupportExceptionRules)if(n.test(e.url)){i=!0;break}x=!i}return x&&a.D.OfflineProviderFactory?t.offlineProvider=a.D.OfflineProviderFactory(e.url,v,y.disableManifestCheck):v(),c}static _GetFileInfo(e,t){let i,n,r=null;if(t)if(t.name){const e=t;i=`file:${e.name}`,n=e.name,r=e}else if("string"==typeof t&&t.startsWith("data:"))i=t,n="";else{const r=t;if("/"===r.substr(0,1))return s.w1.Error("Wrong sceneFilename parameter"),null;i=e+r,n=r}else i=e,n=s.w1.GetFilename(e),e=s.w1.GetFolderPath(e);return{url:i,rootUrl:e,name:n,file:r}}static GetPluginForExtension(e){return p._GetPluginForExtension(e).plugin}static IsPluginForExtensionAvailable(e){return!!p._RegisteredPlugins[e]}static RegisterPlugin(e){if("string"==typeof e.extensions){const t=e.extensions;p._RegisteredPlugins[t.toLowerCase()]={plugin:e,isBinary:!1}}else{const t=e.extensions;Object.keys(t).forEach((i=>{p._RegisteredPlugins[i.toLowerCase()]={plugin:e,isBinary:t[i].isBinary}}))}}static ImportMesh(e,t,i="",n=l.l.LastCreatedScene,s=null,r=null,o=null,a=null){if(!n)return h.Y.Error("No scene available to import mesh to"),null;const c=p._GetFileInfo(t,i);if(!c)return null;const u={};n.addPendingData(u);const f=()=>{n.removePendingData(u)},_=(e,t)=>{const i=p._FormatErrorMessage(c,e,t);o?o(n,i,new d.LH(i,d.SM.SceneLoaderError,t)):h.Y.Error(i),f()},m=r?e=>{try{r(e)}catch(e){_("Error in onProgress callback: "+e,e)}}:void 0,g=(e,t,i,r,o,a,l)=>{if(n.importedMeshesFiles.push(c.url),s)try{s(e,t,i,r,o,a,l)}catch(e){_("Error in onSuccess callback: "+e,e)}n.removePendingData(u)};return p._LoadData(c,n,((t,i,s)=>{if(t.rewriteRootURL&&(c.rootUrl=t.rewriteRootURL(c.rootUrl,s)),t.importMesh){const s=t,r=new Array,o=new Array,a=new Array;if(!s.importMesh(e,n,i,c.rootUrl,r,o,a,_))return;n.loadingPluginName=t.name,g(r,o,a,[],[],[],[])}else t.importMeshAsync(e,n,i,c.rootUrl,m,c.name).then((e=>{n.loadingPluginName=t.name,g(e.meshes,e.particleSystems,e.skeletons,e.animationGroups,e.transformNodes,e.geometries,e.lights)})).catch((e=>{_(e.message,e)}))}),m,_,f,a)}static ImportMeshAsync(e,t,i="",n=l.l.LastCreatedScene,s=null,r=null){return new Promise(((o,a)=>{p.ImportMesh(e,t,i,n,((e,t,i,n,s,r,a)=>{o({meshes:e,particleSystems:t,skeletons:i,animationGroups:n,transformNodes:s,geometries:r,lights:a})}),s,((e,t,i)=>{a(i||new Error(t))}),r)}))}static Load(e,t="",i=l.l.LastCreatedEngine,n=null,r=null,a=null,h=null){return i?p.Append(e,t,new o.x(i),n,r,a,h):(s.w1.Error("No engine available"),null)}static LoadAsync(e,t="",i=l.l.LastCreatedEngine,n=null,s=null){return new Promise(((r,o)=>{p.Load(e,t,i,(e=>{r(e)}),n,((e,t,i)=>{o(i||new Error(t))}),s)}))}static Append(e,t="",i=l.l.LastCreatedScene,n=null,s=null,r=null,o=null){if(!i)return h.Y.Error("No scene available to append to"),null;const a=p._GetFileInfo(e,t);if(!a)return null;const c={};i.addPendingData(c);const u=()=>{i.removePendingData(c)};p.ShowLoadingScreen&&!this._ShowingLoadingScreen&&(this._ShowingLoadingScreen=!0,i.getEngine().displayLoadingUI(),i.executeWhenReady((()=>{i.getEngine().hideLoadingUI(),this._ShowingLoadingScreen=!1})));const f=(e,t)=>{const n=p._FormatErrorMessage(a,e,t);r?r(i,n,new d.LH(n,d.SM.SceneLoaderError,t)):h.Y.Error(n),u()},_=s?e=>{try{s(e)}catch(e){f("Error in onProgress callback",e)}}:void 0,m=()=>{if(n)try{n(i)}catch(e){f("Error in onSuccess callback",e)}i.removePendingData(c)};return p._LoadData(a,i,((e,t)=>{if(e.load){if(!e.load(i,t,a.rootUrl,f))return;i.loadingPluginName=e.name,m()}else e.loadAsync(i,t,a.rootUrl,_,a.name).then((()=>{i.loadingPluginName=e.name,m()})).catch((e=>{f(e.message,e)}))}),_,f,u,o)}static AppendAsync(e,t="",i=l.l.LastCreatedScene,n=null,s=null){return new Promise(((r,o)=>{p.Append(e,t,i,(e=>{r(e)}),n,((e,t,i)=>{o(i||new Error(t))}),s)}))}static LoadAssetContainer(e,t="",i=l.l.LastCreatedScene,n=null,s=null,r=null,o=null){if(!i)return h.Y.Error("No scene available to load asset container to"),null;const a=p._GetFileInfo(e,t);if(!a)return null;const c={};i.addPendingData(c);const u=()=>{i.removePendingData(c)},f=(e,t)=>{const n=p._FormatErrorMessage(a,e,t);r?r(i,n,new d.LH(n,d.SM.SceneLoaderError,t)):h.Y.Error(n),u()},_=s?e=>{try{s(e)}catch(e){f("Error in onProgress callback",e)}}:void 0,m=e=>{if(n)try{n(e)}catch(e){f("Error in onSuccess callback",e)}i.removePendingData(c)};return p._LoadData(a,i,((e,t)=>{if(e.loadAssetContainer){const n=e.loadAssetContainer(i,t,a.rootUrl,f);if(!n)return;i.loadingPluginName=e.name,m(n)}else e.loadAssetContainerAsync?e.loadAssetContainerAsync(i,t,a.rootUrl,_,a.name).then((t=>{i.loadingPluginName=e.name,m(t)})).catch((e=>{f(e.message,e)})):f("LoadAssetContainer is not supported by this plugin. Plugin did not provide a loadAssetContainer or loadAssetContainerAsync method.")}),_,f,u,o)}static LoadAssetContainerAsync(e,t="",i=l.l.LastCreatedScene,n=null,s=null){return new Promise(((r,o)=>{p.LoadAssetContainer(e,t,i,(e=>{r(e)}),n,((e,t,i)=>{o(i||new Error(t))}),s)}))}static ImportAnimations(e,t="",i=l.l.LastCreatedScene,s=!0,r=n.Clean,o=null,a=null,c=null,u=null,d=null){if(!i)return void h.Y.Error("No scene available to load animations to");if(s){for(const e of i.animatables)e.reset();i.stopAllAnimations(),i.animationGroups.slice().forEach((e=>{e.dispose()})),i.getNodes().forEach((e=>{e.animations&&(e.animations=[])}))}else switch(r){case n.Clean:i.animationGroups.slice().forEach((e=>{e.dispose()}));break;case n.Stop:i.animationGroups.forEach((e=>{e.stop()}));break;case n.Sync:i.animationGroups.forEach((e=>{e.reset(),e.restart()}));break;case n.NoSync:break;default:return void h.Y.Error("Unknown animation group loading mode value '"+r+"'")}const p=i.animatables.length;this.LoadAssetContainer(e,t,i,(e=>{e.mergeAnimationsTo(i,i.animatables.slice(p),o),e.dispose(),i.onAnimationFileImportedObservable.notifyObservers(i),a&&a(i)}),c,u,d)}static ImportAnimationsAsync(e,t="",i=l.l.LastCreatedScene,s=!0,r=n.Clean,o=null,a=null,h=null,c=null,u=null){return new Promise(((n,a)=>{p.ImportAnimations(e,t,i,s,r,o,(e=>{n(e)}),h,((e,t,i)=>{a(i||new Error(t))}),u)}))}}p.NO_LOGGING=0,p.MINIMAL_LOGGING=1,p.SUMMARY_LOGGING=2,p.DETAILED_LOGGING=3,p.OnPluginActivatedObservable=new r.y$,p._RegisteredPlugins={},p._ShowingLoadingScreen=!1},1376:(e,t,i)=>{i.d(t,{Z:()=>n});class n{static get ForceFullSceneLoadingForIncremental(){return n._ForceFullSceneLoadingForIncremental}static set ForceFullSceneLoadingForIncremental(e){n._ForceFullSceneLoadingForIncremental=e}static get ShowLoadingScreen(){return n._ShowLoadingScreen}static set ShowLoadingScreen(e){n._ShowLoadingScreen=e}static get loggingLevel(){return n._LoggingLevel}static set loggingLevel(e){n._LoggingLevel=e}static get CleanBoneMatrixWeights(){return n._CleanBoneMatrixWeights}static set CleanBoneMatrixWeights(e){n._CleanBoneMatrixWeights=e}}n._ForceFullSceneLoadingForIncremental=!1,n._ShowLoadingScreen=!0,n._CleanBoneMatrixWeights=!1,n._LoggingLevel=0},6653:(e,t,i)=>{i.d(t,{K:()=>l});var n=i(468),s=i(3837),r=i(4767),o=i(2208),a=i(2262);class l extends n.k{constructor(e){super(e,r.u.VertexAndFragment),this._samplerName="textureSampler",this.convertToGammaSpace=!1,this.convertToLinearSpace=!1,this._isUnique=!1,this.registerInput("uv",s.E.AutoDetect,!1,r.u.VertexAndFragment),this.registerOutput("rgba",s.E.Color4,r.u.Neutral),this.registerOutput("rgb",s.E.Color3,r.u.Neutral),this.registerOutput("r",s.E.Float,r.u.Neutral),this.registerOutput("g",s.E.Float,r.u.Neutral),this.registerOutput("b",s.E.Float,r.u.Neutral),this.registerOutput("a",s.E.Float,r.u.Neutral),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(s.E.Vector2|s.E.Vector3|s.E.Vector4),this._inputs[0]._prioritizeVertex=!1}getClassName(){return"CurrentScreenBlock"}get uv(){return this._inputs[0]}get rgba(){return this._outputs[0]}get rgb(){return this._outputs[1]}get r(){return this._outputs[2]}get g(){return this._outputs[3]}get b(){return this._outputs[4]}get a(){return this._outputs[5]}initialize(e){e._excludeVariableName("textureSampler")}get target(){return this.uv.isConnected?this.uv.sourceBlock.isInput?r.u.VertexAndFragment:r.u.Fragment:r.u.VertexAndFragment}prepareDefines(e,t,i){i.setValue(this._linearDefineName,this.convertToGammaSpace,!0),i.setValue(this._gammaDefineName,this.convertToLinearSpace,!0)}isReady(){return!(this.texture&&!this.texture.isReadyOrNotBlocking())}_injectVertexCode(e){const t=this.uv;if(t.connectedPoint.ownerBlock.isInput&&(t.connectedPoint.ownerBlock.isAttribute||e._emitUniformFromString(t.associatedVariableName,"vec2")),this._mainUVName="vMain"+t.associatedVariableName,e._emitVaryingFromString(this._mainUVName,"vec2"),e.compilationString+=`${this._mainUVName} = ${t.associatedVariableName}.xy;\r\n`,this._outputs.some((e=>e.isConnectedInVertexShader))){this._writeTextureRead(e,!0);for(const t of this._outputs)t.hasEndpoints&&this._writeOutput(e,t,t.name,!0)}}_writeTextureRead(e,t=!1){const i=this.uv;if(t){if(e.target===r.u.Fragment)return;e.compilationString+=`vec4 ${this._tempTextureRead} = texture2D(${this._samplerName}, ${i.associatedVariableName});\r\n`}else this.uv.ownerBlock.target!==r.u.Fragment?e.compilationString+=`vec4 ${this._tempTextureRead} = texture2D(${this._samplerName}, ${this._mainUVName});\r\n`:e.compilationString+=`vec4 ${this._tempTextureRead} = texture2D(${this._samplerName}, ${i.associatedVariableName});\r\n`}_writeOutput(e,t,i,n=!1){if(n){if(e.target===r.u.Fragment)return;e.compilationString+=`${this._declareOutput(t,e)} = ${this._tempTextureRead}.${i};\r\n`}else this.uv.ownerBlock.target!==r.u.Fragment?(e.compilationString+=`${this._declareOutput(t,e)} = ${this._tempTextureRead}.${i};\r\n`,e.compilationString+=`#ifdef ${this._linearDefineName}\r\n`,e.compilationString+=`${t.associatedVariableName} = toGammaSpace(${t.associatedVariableName});\r\n`,e.compilationString+="#endif\r\n",e.compilationString+=`#ifdef ${this._gammaDefineName}\r\n`,e.compilationString+=`${t.associatedVariableName} = toLinearSpace(${t.associatedVariableName});\r\n`,e.compilationString+="#endif\r\n"):e.compilationString+=`${this._declareOutput(t,e)} = ${this._tempTextureRead}.${i};\r\n`}_buildBlock(e){if(super._buildBlock(e),this._tempTextureRead=e._getFreeVariableName("tempTextureRead"),e.sharedData.blockingBlocks.indexOf(this)<0&&e.sharedData.blockingBlocks.push(this),e.sharedData.textureBlocks.indexOf(this)<0&&e.sharedData.textureBlocks.push(this),e.sharedData.blocksWithDefines.indexOf(this)<0&&e.sharedData.blocksWithDefines.push(this),e.target!==r.u.Fragment)return e._emit2DSampler(this._samplerName),void this._injectVertexCode(e);if(!this._outputs.some((e=>e.isConnectedInFragmentShader)))return;e._emit2DSampler(this._samplerName),this._linearDefineName=e._getFreeDefineName("ISLINEAR"),this._gammaDefineName=e._getFreeDefineName("ISGAMMA");const t=`//${this.name}`;e._emitFunctionFromInclude("helperFunctions",t),this._writeTextureRead(e);for(const t of this._outputs)t.hasEndpoints&&this._writeOutput(e,t,t.name);return this}serialize(){const e=super.serialize();return e.convertToGammaSpace=this.convertToGammaSpace,e.convertToLinearSpace=this.convertToLinearSpace,this.texture&&!this.texture.isRenderTarget&&(e.texture=this.texture.serialize()),e}_deserialize(e,t,i){super._deserialize(e,t,i),this.convertToGammaSpace=e.convertToGammaSpace,this.convertToLinearSpace=!!e.convertToLinearSpace,e.texture&&(i=0===e.texture.url.indexOf("data:")?"":i,this.texture=a.x.Parse(e.texture,t,i))}}(0,o.H)("BABYLON.CurrentScreenBlock",l)},9709:(e,t,i)=>{i.d(t,{g:()=>c});var n=i(9472),s=i(468),r=i(3837),o=i(4767),a=i(2208),l=i(9749),h=i(5346);class c extends s.k{constructor(e){super(e,o.u.Fragment,!0),this.convertToGammaSpace=!1,this.convertToLinearSpace=!1,this.useLogarithmicDepth=!1,this.registerInput("rgba",r.E.Color4,!0),this.registerInput("rgb",r.E.AutoDetect,!0),this.registerInput("a",r.E.Float,!0),this.rgb.addExcludedConnectionPointFromAllowedTypes(r.E.Color3|r.E.Vector3|r.E.Float)}getClassName(){return"FragmentOutputBlock"}initialize(e){e._excludeVariableName("logarithmicDepthConstant"),e._excludeVariableName("vFragmentDepth")}get rgba(){return this._inputs[0]}get rgb(){return this._inputs[1]}get a(){return this._inputs[2]}prepareDefines(e,t,i){i.setValue(this._linearDefineName,this.convertToLinearSpace,!0),i.setValue(this._gammaDefineName,this.convertToGammaSpace,!0)}bind(e,t,i){this.useLogarithmicDepth&&i&&h.G.BindLogDepth(void 0,e,i.getScene())}_buildBlock(e){super._buildBlock(e);const t=this.rgba,i=this.rgb,n=this.a;e.sharedData.hints.needAlphaBlending=t.isConnected||n.isConnected,e.sharedData.blocksWithDefines.push(this),this.useLogarithmicDepth&&(e._emitUniformFromString("logarithmicDepthConstant","float"),e._emitVaryingFromString("vFragmentDepth","float"),e.sharedData.bindableBlocks.push(this)),this._linearDefineName=e._getFreeDefineName("CONVERTTOLINEAR"),this._gammaDefineName=e._getFreeDefineName("CONVERTTOGAMMA");const s=`//${this.name}`;if(e._emitFunctionFromInclude("helperFunctions",s),t.connectedPoint)n.isConnected?e.compilationString+=`gl_FragColor = vec4(${t.associatedVariableName}.rgb, ${n.associatedVariableName});\r\n`:e.compilationString+=`gl_FragColor = ${t.associatedVariableName};\r\n`;else if(i.connectedPoint){let t="1.0";n.connectedPoint&&(t=n.associatedVariableName),i.connectedPoint.type===r.E.Float?e.compilationString+=`gl_FragColor = vec4(${i.associatedVariableName}, ${i.associatedVariableName}, ${i.associatedVariableName}, ${t});\r\n`:e.compilationString+=`gl_FragColor = vec4(${i.associatedVariableName}, ${t});\r\n`}else e.sharedData.checks.notConnectedNonOptionalInputs.push(t);return e.compilationString+=`#ifdef ${this._linearDefineName}\r\n`,e.compilationString+="gl_FragColor = toLinearSpace(gl_FragColor);\r\n",e.compilationString+="#endif\r\n",e.compilationString+=`#ifdef ${this._gammaDefineName}\r\n`,e.compilationString+="gl_FragColor = toGammaSpace(gl_FragColor);\r\n",e.compilationString+="#endif\r\n",this.useLogarithmicDepth&&(e.compilationString+="gl_FragDepthEXT = log2(vFragmentDepth) * logarithmicDepthConstant * 0.5;\r\n"),this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.convertToGammaSpace = ${this.convertToGammaSpace};\r\n`,e+=`${this._codeVariableName}.convertToLinearSpace = ${this.convertToLinearSpace};\r\n`,e+=`${this._codeVariableName}.useLogarithmicDepth = ${this.useLogarithmicDepth};\r\n`,e}serialize(){const e=super.serialize();return e.convertToGammaSpace=this.convertToGammaSpace,e.convertToLinearSpace=this.convertToLinearSpace,e.useLogarithmicDepth=this.useLogarithmicDepth,e}_deserialize(e,t,i){var n;super._deserialize(e,t,i),this.convertToGammaSpace=e.convertToGammaSpace,this.convertToLinearSpace=e.convertToLinearSpace,this.useLogarithmicDepth=null!==(n=e.useLogarithmicDepth)&&void 0!==n&&n}}(0,n.gn)([(0,l.p)("Convert to gamma space",l.U.Boolean,"PROPERTIES",{notifiers:{update:!0}})],c.prototype,"convertToGammaSpace",void 0),(0,n.gn)([(0,l.p)("Convert to linear space",l.U.Boolean,"PROPERTIES",{notifiers:{update:!0}})],c.prototype,"convertToLinearSpace",void 0),(0,n.gn)([(0,l.p)("Use logarithmic depth",l.U.Boolean,"PROPERTIES")],c.prototype,"useLogarithmicDepth",void 0),(0,a.H)("BABYLON.FragmentOutputBlock",c)},3426:(e,t,i)=>{var n;i.d(t,{c:()=>n}),function(e){e[e.None=0]="None",e[e.Time=1]="Time",e[e.RealTime=2]="RealTime"}(n||(n={}))},363:(e,t,i)=>{i.d(t,{S:()=>g});var n=i(468),s=i(3837),r=i(8832),o=i(9135),a=i(4141),l=i(4767),h=i(2208),c=i(6913),u=i(3426),d=i(5757),p=i(8108);const f={position2d:"position",particle_uv:"vUV",particle_color:"vColor",particle_texturemask:"textureMask",particle_positionw:"vPositionW"},_={particle_uv:!0,particle_color:!0,particle_texturemask:!0,particle_positionw:!0},m={particle_texturemask:!0};class g extends n.k{get type(){if(this._type===s.E.AutoDetect){if(this.isUniform&&null!=this.value){if(!isNaN(this.value))return this._type=s.E.Float,this._type;switch(this.value.getClassName()){case"Vector2":return this._type=s.E.Vector2,this._type;case"Vector3":return this._type=s.E.Vector3,this._type;case"Vector4":return this._type=s.E.Vector4,this._type;case"Color3":return this._type=s.E.Color3,this._type;case"Color4":return this._type=s.E.Color4,this._type;case"Matrix":return this._type=s.E.Matrix,this._type}}if(this.isAttribute)switch(this.name){case"position":case"normal":case"particle_positionw":return this._type=s.E.Vector3,this._type;case"uv":case"uv2":case"uv3":case"uv4":case"uv5":case"uv6":case"position2d":case"particle_uv":return this._type=s.E.Vector2,this._type;case"matricesIndices":case"matricesWeights":case"matricesIndicesExtra":case"matricesWeightsExtra":case"world0":case"world1":case"world2":case"world3":case"tangent":return this._type=s.E.Vector4,this._type;case"color":case"instanceColor":case"particle_color":case"particle_texturemask":return this._type=s.E.Color4,this._type}if(this.isSystemValue)switch(this._systemValue){case o.$.World:case o.$.WorldView:case o.$.WorldViewProjection:case o.$.View:case o.$.ViewProjection:case o.$.Projection:return this._type=s.E.Matrix,this._type;case o.$.CameraPosition:return this._type=s.E.Vector3,this._type;case o.$.FogColor:return this._type=s.E.Color3,this._type;case o.$.DeltaTime:case o.$.MaterialAlpha:return this._type=s.E.Float,this._type;case o.$.CameraParameters:return this._type=s.E.Vector4,this._type}}return this._type}constructor(e,t=l.u.Vertex,i=s.E.AutoDetect){super(e,t,!1,!0),this._mode=r.M.Undefined,this._animationType=u.c.None,this.min=0,this.max=0,this.isBoolean=!1,this.matrixMode=0,this._systemValue=null,this.isConstant=!1,this.groupInInspector="",this.onValueChangedObservable=new d.y$,this.convertToGammaSpace=!1,this.convertToLinearSpace=!1,this._type=i,this.setDefaultValue(),this.registerOutput("output",i)}validateBlockName(e){return!!this.isAttribute||super.validateBlockName(e)}get output(){return this._outputs[0]}setAsAttribute(e){return this._mode=r.M.Attribute,e&&(this.name=e),this}setAsSystemValue(e){return this.systemValue=e,this}get value(){return this._storedValue}set value(e){this.type===s.E.Float&&(this.isBoolean?e=e?1:0:this.min!==this.max&&(e=Math.max(this.min,e),e=Math.min(this.max,e))),this._storedValue=e,this._mode=r.M.Uniform,this.onValueChangedObservable.notifyObservers(this)}get valueCallback(){return this._valueCallback}set valueCallback(e){this._valueCallback=e,this._mode=r.M.Uniform}get associatedVariableName(){return this._associatedVariableName}set associatedVariableName(e){this._associatedVariableName=e}get animationType(){return this._animationType}set animationType(e){this._animationType=e}get isUndefined(){return this._mode===r.M.Undefined}get isUniform(){return this._mode===r.M.Uniform}set isUniform(e){this._mode=e?r.M.Uniform:r.M.Undefined,this.associatedVariableName=""}get isAttribute(){return this._mode===r.M.Attribute}set isAttribute(e){this._mode=e?r.M.Attribute:r.M.Undefined,this.associatedVariableName=""}get isVarying(){return this._mode===r.M.Varying}set isVarying(e){this._mode=e?r.M.Varying:r.M.Undefined,this.associatedVariableName=""}get isSystemValue(){return null!=this._systemValue}get systemValue(){return this._systemValue}set systemValue(e){this._mode=r.M.Uniform,this.associatedVariableName="",this._systemValue=e}getClassName(){return"InputBlock"}animate(e){switch(this._animationType){case u.c.Time:this.type===s.E.Float&&(this.value+=.01*e.getAnimationRatio());break;case u.c.RealTime:this.type===s.E.Float&&(this.value=(p.F.Now-e.getEngine().startTime)/1e3)}}_emitDefine(e){return"!"===e[0]?`#ifndef ${e.substring(1)}\r\n`:`#ifdef ${e}\r\n`}initialize(){this.associatedVariableName=""}setDefaultValue(){switch(this.type){case s.E.Float:this.value=0;break;case s.E.Vector2:this.value=a.FM.Zero();break;case s.E.Vector3:this.value=a.P.Zero();break;case s.E.Vector4:this.value=a.Lt.Zero();break;case s.E.Color3:this.value=c.Wo.White();break;case s.E.Color4:this.value=new c.HE(1,1,1,1);break;case s.E.Matrix:this.value=a.y3.Identity()}}_emitConstant(e){switch(this.type){case s.E.Float:return`${e._emitFloat(this.value)}`;case s.E.Vector2:return`vec2(${this.value.x}, ${this.value.y})`;case s.E.Vector3:return`vec3(${this.value.x}, ${this.value.y}, ${this.value.z})`;case s.E.Vector4:return`vec4(${this.value.x}, ${this.value.y}, ${this.value.z}, ${this.value.w})`;case s.E.Color3:return c.zZ.Color3[0].set(this.value.r,this.value.g,this.value.b),this.convertToGammaSpace&&c.zZ.Color3[0].toGammaSpaceToRef(c.zZ.Color3[0],e.sharedData.scene.getEngine().useExactSrgbConversions),this.convertToLinearSpace&&c.zZ.Color3[0].toLinearSpaceToRef(c.zZ.Color3[0],e.sharedData.scene.getEngine().useExactSrgbConversions),`vec3(${c.zZ.Color3[0].r}, ${c.zZ.Color3[0].g}, ${c.zZ.Color3[0].b})`;case s.E.Color4:return c.zZ.Color4[0].set(this.value.r,this.value.g,this.value.b,this.value.a),this.convertToGammaSpace&&c.zZ.Color4[0].toGammaSpaceToRef(c.zZ.Color4[0],e.sharedData.scene.getEngine().useExactSrgbConversions),this.convertToLinearSpace&&c.zZ.Color4[0].toLinearSpaceToRef(c.zZ.Color4[0],e.sharedData.scene.getEngine().useExactSrgbConversions),`vec4(${c.zZ.Color4[0].r}, ${c.zZ.Color4[0].g}, ${c.zZ.Color4[0].b}, ${c.zZ.Color4[0].a})`}return""}get _noContextSwitch(){return _[this.name]}_emit(e,t){var i;if(this.isUniform){if(this.associatedVariableName||(this.associatedVariableName=e._getFreeVariableName("u_"+this.name)),this.isConstant){if(-1!==e.constants.indexOf(this.associatedVariableName))return;return e.constants.push(this.associatedVariableName),void(e._constantDeclaration+=this._declareOutput(this.output,e)+` = ${this._emitConstant(e)};\r\n`)}if(-1!==e.uniforms.indexOf(this.associatedVariableName))return;e.uniforms.push(this.associatedVariableName),t&&(e._uniformDeclaration+=this._emitDefine(t)),e._uniformDeclaration+=`uniform ${e._getGLType(this.type)} ${this.associatedVariableName};\r\n`,t&&(e._uniformDeclaration+="#endif\r\n");const i=e.sharedData.hints;if(null!==this._systemValue&&void 0!==this._systemValue)switch(this._systemValue){case o.$.WorldView:i.needWorldViewMatrix=!0;break;case o.$.WorldViewProjection:i.needWorldViewProjectionMatrix=!0}else this._animationType!==u.c.None&&e.sharedData.animatedInputs.push(this)}else if(this.isAttribute){if(this.associatedVariableName=null!==(i=f[this.name])&&void 0!==i?i:this.name,this.target===l.u.Vertex&&e._vertexState)return void(_[this.name]?m[this.name]?e._emitUniformFromString(this.associatedVariableName,e._getGLType(this.type),t):e._emitVaryingFromString(this.associatedVariableName,e._getGLType(this.type),t):this._emit(e._vertexState,t));if(-1!==e.attributes.indexOf(this.associatedVariableName))return;e.attributes.push(this.associatedVariableName),_[this.name]?m[this.name]?e._emitUniformFromString(this.associatedVariableName,e._getGLType(this.type),t):e._emitVaryingFromString(this.associatedVariableName,e._getGLType(this.type),t):(t&&(e._attributeDeclaration+=this._emitDefine(t)),e._attributeDeclaration+=`attribute ${e._getGLType(this.type)} ${this.associatedVariableName};\r\n`,t&&(e._attributeDeclaration+="#endif\r\n"))}}_transmitWorld(e,t,i,n){if(!this._systemValue)return;const s=this.associatedVariableName;switch(this._systemValue){case o.$.World:e.setMatrix(s,t);break;case o.$.WorldView:e.setMatrix(s,i);break;case o.$.WorldViewProjection:e.setMatrix(s,n)}}_transmit(e,t,i){if(this.isAttribute)return;const n=this.associatedVariableName;if(this._systemValue){switch(this._systemValue){case o.$.World:case o.$.WorldView:case o.$.WorldViewProjection:return;case o.$.View:e.setMatrix(n,t.getViewMatrix());break;case o.$.Projection:e.setMatrix(n,t.getProjectionMatrix());break;case o.$.ViewProjection:e.setMatrix(n,t.getTransformMatrix());break;case o.$.CameraPosition:t.bindEyePosition(e,n,!0);break;case o.$.FogColor:e.setColor3(n,t.fogColor);break;case o.$.DeltaTime:e.setFloat(n,t.deltaTime/1e3);break;case o.$.CameraParameters:t.activeCamera&&e.setFloat4(n,t.getEngine().hasOriginBottomLeft?-1:1,t.activeCamera.minZ,t.activeCamera.maxZ,1/t.activeCamera.maxZ);break;case o.$.MaterialAlpha:e.setFloat(n,i.alpha)}return}const r=this._valueCallback?this._valueCallback():this._storedValue;if(null!==r)switch(this.type){case s.E.Float:e.setFloat(n,r);break;case s.E.Int:e.setInt(n,r);break;case s.E.Color3:c.zZ.Color3[0].set(this.value.r,this.value.g,this.value.b),this.convertToGammaSpace&&c.zZ.Color3[0].toGammaSpaceToRef(c.zZ.Color3[0],t.getEngine().useExactSrgbConversions),this.convertToLinearSpace&&c.zZ.Color3[0].toLinearSpaceToRef(c.zZ.Color3[0],t.getEngine().useExactSrgbConversions),e.setColor3(n,c.zZ.Color3[0]);break;case s.E.Color4:c.zZ.Color4[0].set(this.value.r,this.value.g,this.value.b,this.value.a),this.convertToGammaSpace&&c.zZ.Color4[0].toGammaSpaceToRef(c.zZ.Color4[0],t.getEngine().useExactSrgbConversions),this.convertToLinearSpace&&c.zZ.Color4[0].toLinearSpaceToRef(c.zZ.Color4[0],t.getEngine().useExactSrgbConversions),e.setDirectColor4(n,c.zZ.Color4[0]);break;case s.E.Vector2:e.setVector2(n,r);break;case s.E.Vector3:e.setVector3(n,r);break;case s.E.Vector4:e.setVector4(n,r);break;case s.E.Matrix:e.setMatrix(n,r)}}_buildBlock(e){super._buildBlock(e),(this.isUniform||this.isSystemValue)&&e.sharedData.inputBlocks.push(this),this._emit(e)}_dumpPropertiesCode(){const e=this._codeVariableName;if(this.isAttribute)return super._dumpPropertiesCode()+`${e}.setAsAttribute("${this.name}");\r\n`;if(this.isSystemValue)return super._dumpPropertiesCode()+`${e}.setAsSystemValue(BABYLON.NodeMaterialSystemValues.${o.$[this._systemValue]});\r\n`;if(this.isUniform){const t=[];let i="";switch(this.type){case s.E.Float:i=`${this.value}`;break;case s.E.Vector2:i=`new BABYLON.Vector2(${this.value.x}, ${this.value.y})`;break;case s.E.Vector3:i=`new BABYLON.Vector3(${this.value.x}, ${this.value.y}, ${this.value.z})`;break;case s.E.Vector4:i=`new BABYLON.Vector4(${this.value.x}, ${this.value.y}, ${this.value.z}, ${this.value.w})`;break;case s.E.Color3:i=`new BABYLON.Color3(${this.value.r}, ${this.value.g}, ${this.value.b})`,this.convertToGammaSpace&&(i+=".toGammaSpace()"),this.convertToLinearSpace&&(i+=".toLinearSpace()");break;case s.E.Color4:i=`new BABYLON.Color4(${this.value.r}, ${this.value.g}, ${this.value.b}, ${this.value.a})`,this.convertToGammaSpace&&(i+=".toGammaSpace()"),this.convertToLinearSpace&&(i+=".toLinearSpace()");break;case s.E.Matrix:i=`BABYLON.Matrix.FromArray([${this.value.m}])`}return t.push(`${e}.value = ${i}`),this.type===s.E.Float&&t.push(`${e}.min = ${this.min}`,`${e}.max = ${this.max}`,`${e}.isBoolean = ${this.isBoolean}`,`${e}.matrixMode = ${this.matrixMode}`,`${e}.animationType = BABYLON.AnimatedInputBlockTypes.${u.c[this.animationType]}`),t.push(`${e}.isConstant = ${this.isConstant}`),t.push(""),super._dumpPropertiesCode()+t.join(";\r\n")}return super._dumpPropertiesCode()}dispose(){this.onValueChangedObservable.clear(),super.dispose()}serialize(){const e=super.serialize();return e.type=this.type,e.mode=this._mode,e.systemValue=this._systemValue,e.animationType=this._animationType,e.min=this.min,e.max=this.max,e.isBoolean=this.isBoolean,e.matrixMode=this.matrixMode,e.isConstant=this.isConstant,e.groupInInspector=this.groupInInspector,e.convertToGammaSpace=this.convertToGammaSpace,e.convertToLinearSpace=this.convertToLinearSpace,null!=this._storedValue&&this._mode===r.M.Uniform&&(this._storedValue.asArray?(e.valueType="BABYLON."+this._storedValue.getClassName(),e.value=this._storedValue.asArray()):(e.valueType="number",e.value=this._storedValue)),e}_deserialize(e,t,i){if(this._mode=e.mode,super._deserialize(e,t,i),this._type=e.type,this._systemValue=e.systemValue||e.wellKnownValue,this._animationType=e.animationType,this.min=e.min||0,this.max=e.max||0,this.isBoolean=!!e.isBoolean,this.matrixMode=e.matrixMode||0,this.isConstant=!!e.isConstant,this.groupInInspector=e.groupInInspector||"",this.convertToGammaSpace=!!e.convertToGammaSpace,this.convertToLinearSpace=!!e.convertToLinearSpace,"tangent"===e.name&&e.mode===r.M.Attribute&&e.type===s.E.Vector3&&(this._type=s.E.Vector4),e.valueType)if("number"===e.valueType)this._storedValue=e.value;else{const t=(0,h.q)(e.valueType);t&&(this._storedValue=t.FromArray(e.value))}}}(0,h.H)("BABYLON.InputBlock",g)},1320:(e,t,i)=>{i.d(t,{D:()=>a});var n=i(468),s=i(3837),r=i(4767),o=i(2208);class a extends n.k{constructor(e){super(e,r.u.Fragment),this._isUnique=!0,this.registerInput("color",s.E.Color4,!1,r.u.Fragment),this.registerInput("alphaTexture",s.E.Float,!1,r.u.Fragment),this.registerInput("alphaColor",s.E.Float,!1,r.u.Fragment),this.registerOutput("blendColor",s.E.Color4,r.u.Fragment)}getClassName(){return"ParticleBlendMultiplyBlock"}get color(){return this._inputs[0]}get alphaTexture(){return this._inputs[1]}get alphaColor(){return this._inputs[2]}get blendColor(){return this._outputs[0]}initialize(e){e._excludeVariableName("sourceAlpha")}_buildBlock(e){if(super._buildBlock(e),e.target!==r.u.Vertex)return e.compilationString+=`\n            #ifdef BLENDMULTIPLYMODE\n                ${this._declareOutput(this.blendColor,e)};\n                float sourceAlpha = ${this.alphaColor.associatedVariableName} * ${this.alphaTexture.associatedVariableName};\n                ${this.blendColor.associatedVariableName}.rgb = ${this.color.associatedVariableName}.rgb * sourceAlpha + vec3(1.0) * (1.0 - sourceAlpha);\n                ${this.blendColor.associatedVariableName}.a = ${this.color.associatedVariableName}.a;\n            #else\n                ${this._declareOutput(this.blendColor,e)} = ${this.color.associatedVariableName};\n            #endif\n        `,this}}(0,o.H)("BABYLON.ParticleBlendMultiplyBlock",a)},8560:(e,t,i)=>{i.d(t,{p:()=>a});var n=i(468),s=i(3837),r=i(4767),o=i(2208);class a extends n.k{constructor(e){super(e,r.u.Fragment),this._isUnique=!0,this.registerInput("color",s.E.Color4,!1,r.u.Fragment),this.registerOutput("rampColor",s.E.Color4,r.u.Fragment)}getClassName(){return"ParticleRampGradientBlock"}get color(){return this._inputs[0]}get rampColor(){return this._outputs[0]}initialize(e){e._excludeVariableName("remapRanges"),e._excludeVariableName("rampSampler"),e._excludeVariableName("baseColor"),e._excludeVariableName("alpha"),e._excludeVariableName("remappedColorIndex"),e._excludeVariableName("rampColor"),e._excludeVariableName("finalAlpha")}_buildBlock(e){if(super._buildBlock(e),e.target!==r.u.Vertex)return e._emit2DSampler("rampSampler"),e._emitVaryingFromString("remapRanges","vec4","RAMPGRADIENT"),e.compilationString+=`\n            #ifdef RAMPGRADIENT\n                vec4 baseColor = ${this.color.associatedVariableName};\n                float alpha = ${this.color.associatedVariableName}.a;\n\n                float remappedColorIndex = clamp((alpha - remapRanges.x) / remapRanges.y, 0.0, 1.0);\n\n                vec4 rampColor = texture2D(rampSampler, vec2(1.0 - remappedColorIndex, 0.));\n                baseColor.rgb *= rampColor.rgb;\n\n                // Remapped alpha\n                float finalAlpha = baseColor.a;\n                baseColor.a = clamp((alpha * rampColor.a - remapRanges.z) / remapRanges.w, 0.0, 1.0);\n\n                ${this._declareOutput(this.rampColor,e)} = baseColor;\n            #else\n                ${this._declareOutput(this.rampColor,e)} = ${this.color.associatedVariableName};\n            #endif\n        `,this}}(0,o.H)("BABYLON.ParticleRampGradientBlock",a)},7010:(e,t,i)=>{i.d(t,{P:()=>h});var n=i(468),s=i(3837),r=i(4767),o=i(363),a=i(2208),l=i(2262);class h extends n.k{constructor(e){super(e,r.u.Fragment),this._samplerName="diffuseSampler",this.convertToGammaSpace=!1,this.convertToLinearSpace=!1,this._isUnique=!1,this.registerInput("uv",s.E.AutoDetect,!1,r.u.VertexAndFragment),this.registerOutput("rgba",s.E.Color4,r.u.Neutral),this.registerOutput("rgb",s.E.Color3,r.u.Neutral),this.registerOutput("r",s.E.Float,r.u.Neutral),this.registerOutput("g",s.E.Float,r.u.Neutral),this.registerOutput("b",s.E.Float,r.u.Neutral),this.registerOutput("a",s.E.Float,r.u.Neutral),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(s.E.Vector2|s.E.Vector3|s.E.Vector4)}getClassName(){return"ParticleTextureBlock"}get uv(){return this._inputs[0]}get rgba(){return this._outputs[0]}get rgb(){return this._outputs[1]}get r(){return this._outputs[2]}get g(){return this._outputs[3]}get b(){return this._outputs[4]}get a(){return this._outputs[5]}initialize(e){e._excludeVariableName("diffuseSampler")}autoConfigure(e){if(!this.uv.isConnected){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"particle_uv"===e.name));t||(t=new o.S("uv"),t.setAsAttribute("particle_uv")),t.output.connectTo(this.uv)}}prepareDefines(e,t,i){i.setValue(this._linearDefineName,this.convertToGammaSpace,!0),i.setValue(this._gammaDefineName,this.convertToLinearSpace,!0)}isReady(){return!(this.texture&&!this.texture.isReadyOrNotBlocking())}_writeOutput(e,t,i){e.compilationString+=`${this._declareOutput(t,e)} = ${this._tempTextureRead}.${i};\r\n`,e.compilationString+=`#ifdef ${this._linearDefineName}\r\n`,e.compilationString+=`${t.associatedVariableName} = toGammaSpace(${t.associatedVariableName});\r\n`,e.compilationString+="#endif\r\n",e.compilationString+=`#ifdef ${this._gammaDefineName}\r\n`,e.compilationString+=`${t.associatedVariableName} = toLinearSpace(${t.associatedVariableName});\r\n`,e.compilationString+="#endif\r\n"}_buildBlock(e){if(super._buildBlock(e),e.target===r.u.Vertex)return;this._tempTextureRead=e._getFreeVariableName("tempTextureRead"),e._emit2DSampler(this._samplerName),e.sharedData.blockingBlocks.push(this),e.sharedData.textureBlocks.push(this),e.sharedData.blocksWithDefines.push(this),this._linearDefineName=e._getFreeDefineName("ISLINEAR"),this._gammaDefineName=e._getFreeDefineName("ISGAMMA");const t=`//${this.name}`;e._emitFunctionFromInclude("helperFunctions",t),e.compilationString+=`vec4 ${this._tempTextureRead} = texture2D(${this._samplerName}, ${this.uv.associatedVariableName});\r\n`;for(const t of this._outputs)t.hasEndpoints&&this._writeOutput(e,t,t.name);return this}serialize(){const e=super.serialize();return e.convertToGammaSpace=this.convertToGammaSpace,e.convertToLinearSpace=this.convertToLinearSpace,this.texture&&!this.texture.isRenderTarget&&(e.texture=this.texture.serialize()),e}_deserialize(e,t,i){super._deserialize(e,t,i),this.convertToGammaSpace=e.convertToGammaSpace,this.convertToLinearSpace=!!e.convertToLinearSpace,e.texture&&(i=0===e.texture.url.indexOf("data:")?"":i,this.texture=l.x.Parse(e.texture,t,i))}}(0,a.H)("BABYLON.ParticleTextureBlock",h)},7123:(e,t,i)=>{i.d(t,{t:()=>a});var n=i(468),s=i(3837),r=i(4767),o=i(2208);class a extends n.k{constructor(e){super(e,r.u.Vertex,!0),this.registerInput("vector",s.E.Vector4)}getClassName(){return"VertexOutputBlock"}get vector(){return this._inputs[0]}_isLogarithmicDepthEnabled(e){for(const t of e)if(t.useLogarithmicDepth)return!0;return!1}_buildBlock(e){super._buildBlock(e);const t=this.vector;return e.compilationString+=`gl_Position = ${t.associatedVariableName};\r\n`,this._isLogarithmicDepthEnabled(e.sharedData.fragmentOutputNodes)&&(e._emitUniformFromString("logarithmicDepthConstant","float"),e._emitVaryingFromString("vFragmentDepth","float"),e.compilationString+="vFragmentDepth = 1.0 + gl_Position.w;\r\n",e.compilationString+="gl_Position.z = log2(max(0.000001, vFragmentDepth)) * logarithmicDepthConstant;\r\n"),this}}(0,o.H)("BABYLON.VertexOutputBlock",a)},8022:(e,t,i)=>{i.d(t,{v:()=>a});var n=i(468),s=i(3837),r=i(4767),o=i(2208);class a extends n.k{constructor(e){super(e,r.u.Neutral),this.registerInput("rgba",s.E.Color4,!0),this.registerInput("rgb ",s.E.Color3,!0),this.registerOutput("rgb",s.E.Color3),this.registerOutput("r",s.E.Float),this.registerOutput("g",s.E.Float),this.registerOutput("b",s.E.Float),this.registerOutput("a",s.E.Float),this.inputsAreExclusive=!0}getClassName(){return"ColorSplitterBlock"}get rgba(){return this._inputs[0]}get rgbIn(){return this._inputs[1]}get rgbOut(){return this._outputs[0]}get r(){return this._outputs[1]}get g(){return this._outputs[2]}get b(){return this._outputs[3]}get a(){return this._outputs[4]}_inputRename(e){return"rgb "===e?"rgbIn":e}_outputRename(e){return"rgb"===e?"rgbOut":e}_buildBlock(e){super._buildBlock(e);const t=this.rgba.isConnected?this.rgba:this.rgbIn;if(!t.isConnected)return;const i=this._outputs[0],n=this._outputs[1],s=this._outputs[2],r=this._outputs[3],o=this._outputs[4];return i.hasEndpoints&&(e.compilationString+=this._declareOutput(i,e)+` = ${t.associatedVariableName}.rgb;\r\n`),n.hasEndpoints&&(e.compilationString+=this._declareOutput(n,e)+` = ${t.associatedVariableName}.r;\r\n`),s.hasEndpoints&&(e.compilationString+=this._declareOutput(s,e)+` = ${t.associatedVariableName}.g;\r\n`),r.hasEndpoints&&(e.compilationString+=this._declareOutput(r,e)+` = ${t.associatedVariableName}.b;\r\n`),o.hasEndpoints&&(e.compilationString+=this._declareOutput(o,e)+` = ${t.associatedVariableName}.a;\r\n`),this}}(0,o.H)("BABYLON.ColorSplitterBlock",a)},3841:(e,t,i)=>{i.d(t,{U:()=>a});var n=i(468),s=i(3837),r=i(4767),o=i(2208);class a extends n.k{constructor(e){super(e,r.u.Neutral),this.registerInput("left",s.E.AutoDetect),this.registerInput("right",s.E.AutoDetect),this.registerOutput("output",s.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1)}getClassName(){return"MultiplyBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = ${this.left.associatedVariableName} * ${this.right.associatedVariableName};\r\n`,this}}(0,o.H)("BABYLON.MultiplyBlock",a)},2864:(e,t,i)=>{i.d(t,{w:()=>c});var n=i(9472),s=i(468),r=i(3837),o=i(4767),a=i(2208),l=i(4141),h=i(9749);class c extends s.k{constructor(e){super(e,o.u.Neutral),this.sourceRange=new l.FM(-1,1),this.targetRange=new l.FM(0,1),this.registerInput("input",r.E.AutoDetect),this.registerInput("sourceMin",r.E.Float,!0),this.registerInput("sourceMax",r.E.Float,!0),this.registerInput("targetMin",r.E.Float,!0),this.registerInput("targetMax",r.E.Float,!0),this.registerOutput("output",r.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0]}getClassName(){return"RemapBlock"}get input(){return this._inputs[0]}get sourceMin(){return this._inputs[1]}get sourceMax(){return this._inputs[2]}get targetMin(){return this._inputs[3]}get targetMax(){return this._inputs[4]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0],i=this.sourceMin.isConnected?this.sourceMin.associatedVariableName:this._writeFloat(this.sourceRange.x),n=this.sourceMax.isConnected?this.sourceMax.associatedVariableName:this._writeFloat(this.sourceRange.y),s=this.targetMin.isConnected?this.targetMin.associatedVariableName:this._writeFloat(this.targetRange.x),r=this.targetMax.isConnected?this.targetMax.associatedVariableName:this._writeFloat(this.targetRange.y);return e.compilationString+=this._declareOutput(t,e)+` = ${s} + (${this._inputs[0].associatedVariableName} - ${i}) * (${r} - ${s}) / (${n} - ${i});\r\n`,this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode()+`${this._codeVariableName}.sourceRange = new BABYLON.Vector2(${this.sourceRange.x}, ${this.sourceRange.y});\r\n`;return e+=`${this._codeVariableName}.targetRange = new BABYLON.Vector2(${this.targetRange.x}, ${this.targetRange.y});\r\n`,e}serialize(){const e=super.serialize();return e.sourceRange=this.sourceRange.asArray(),e.targetRange=this.targetRange.asArray(),e}_deserialize(e,t,i){super._deserialize(e,t,i),this.sourceRange=l.FM.FromArray(e.sourceRange),this.targetRange=l.FM.FromArray(e.targetRange)}}(0,n.gn)([(0,h.p)("From",h.U.Vector2)],c.prototype,"sourceRange",void 0),(0,n.gn)([(0,h.p)("To",h.U.Vector2)],c.prototype,"targetRange",void 0),(0,a.H)("BABYLON.RemapBlock",c)},7238:(e,t,i)=>{i.d(t,{m:()=>a});var n=i(468),s=i(3837),r=i(4767),o=i(2208);class a extends n.k{constructor(e){super(e,r.u.Neutral),this.complementW=1,this.complementZ=0,this.target=r.u.Vertex,this.registerInput("vector",s.E.AutoDetect),this.registerInput("transform",s.E.Matrix),this.registerOutput("output",s.E.Vector4),this.registerOutput("xyz",s.E.Vector3),this._inputs[0].onConnectionObservable.add((e=>{if(e.ownerBlock.isInput){const t=e.ownerBlock;"normal"!==t.name&&"tangent"!==t.name||(this.complementW=0)}}))}getClassName(){return"TransformBlock"}get vector(){return this._inputs[0]}get output(){return this._outputs[0]}get xyz(){return this._outputs[1]}get transform(){return this._inputs[1]}_buildBlock(e){super._buildBlock(e);const t=this.vector,i=this.transform;if(t.connectedPoint){if(0===this.complementW){const n=`//${this.name}`;e._emitFunctionFromInclude("helperFunctions",n),e.sharedData.blocksWithDefines.push(this);const r=e._getFreeVariableName(`${i.associatedVariableName}_NUS`);switch(e.compilationString+=`mat3 ${r} = mat3(${i.associatedVariableName});\r\n`,e.compilationString+="#ifdef NONUNIFORMSCALING\r\n",e.compilationString+=`${r} = transposeMat3(inverseMat3(${r}));\r\n`,e.compilationString+="#endif\r\n",t.connectedPoint.type){case s.E.Vector2:e.compilationString+=this._declareOutput(this.output,e)+` = vec4(${r} * vec3(${t.associatedVariableName}, ${this._writeFloat(this.complementZ)}), ${this._writeFloat(this.complementW)});\r\n`;break;case s.E.Vector3:case s.E.Color3:e.compilationString+=this._declareOutput(this.output,e)+` = vec4(${r} * ${t.associatedVariableName}, ${this._writeFloat(this.complementW)});\r\n`;break;default:e.compilationString+=this._declareOutput(this.output,e)+` = vec4(${r} * ${t.associatedVariableName}.xyz, ${this._writeFloat(this.complementW)});\r\n`}}else{const n=i.associatedVariableName;switch(t.connectedPoint.type){case s.E.Vector2:e.compilationString+=this._declareOutput(this.output,e)+` = ${n} * vec4(${t.associatedVariableName}, ${this._writeFloat(this.complementZ)}, ${this._writeFloat(this.complementW)});\r\n`;break;case s.E.Vector3:case s.E.Color3:e.compilationString+=this._declareOutput(this.output,e)+` = ${n} * vec4(${t.associatedVariableName}, ${this._writeFloat(this.complementW)});\r\n`;break;default:e.compilationString+=this._declareOutput(this.output,e)+` = ${n} * ${t.associatedVariableName};\r\n`}}this.xyz.hasEndpoints&&(e.compilationString+=this._declareOutput(this.xyz,e)+` = ${this.output.associatedVariableName}.xyz;\r\n`)}return this}prepareDefines(e,t,i){e.nonUniformScaling&&i.setValue("NONUNIFORMSCALING",!0)}serialize(){const e=super.serialize();return e.complementZ=this.complementZ,e.complementW=this.complementW,e}_deserialize(e,t,i){super._deserialize(e,t,i),this.complementZ=void 0!==e.complementZ?e.complementZ:0,this.complementW=void 0!==e.complementW?e.complementW:1}_dumpPropertiesCode(){let e=super._dumpPropertiesCode()+`${this._codeVariableName}.complementZ = ${this.complementZ};\r\n`;return e+=`${this._codeVariableName}.complementW = ${this.complementW};\r\n`,e}}(0,o.H)("BABYLON.TransformBlock",a)},3069:(e,t,i)=>{i.d(t,{S:()=>l,p:()=>n});var n,s=i(468),r=i(3837),o=i(4767),a=i(2208);!function(e){e[e.Cos=0]="Cos",e[e.Sin=1]="Sin",e[e.Abs=2]="Abs",e[e.Exp=3]="Exp",e[e.Exp2=4]="Exp2",e[e.Round=5]="Round",e[e.Floor=6]="Floor",e[e.Ceiling=7]="Ceiling",e[e.Sqrt=8]="Sqrt",e[e.Log=9]="Log",e[e.Tan=10]="Tan",e[e.ArcTan=11]="ArcTan",e[e.ArcCos=12]="ArcCos",e[e.ArcSin=13]="ArcSin",e[e.Fract=14]="Fract",e[e.Sign=15]="Sign",e[e.Radians=16]="Radians",e[e.Degrees=17]="Degrees"}(n||(n={}));class l extends s.k{constructor(e){super(e,o.u.Neutral),this.operation=n.Cos,this.registerInput("input",r.E.AutoDetect),this.registerOutput("output",r.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0]}getClassName(){return"TrigonometryBlock"}get input(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];let i="";switch(this.operation){case n.Cos:i="cos";break;case n.Sin:i="sin";break;case n.Abs:i="abs";break;case n.Exp:i="exp";break;case n.Exp2:i="exp2";break;case n.Round:i="round";break;case n.Floor:i="floor";break;case n.Ceiling:i="ceil";break;case n.Sqrt:i="sqrt";break;case n.Log:i="log";break;case n.Tan:i="tan";break;case n.ArcTan:i="atan";break;case n.ArcCos:i="acos";break;case n.ArcSin:i="asin";break;case n.Fract:i="fract";break;case n.Sign:i="sign";break;case n.Radians:i="radians";break;case n.Degrees:i="degrees"}return e.compilationString+=this._declareOutput(t,e)+` = ${i}(${this.input.associatedVariableName});\r\n`,this}serialize(){const e=super.serialize();return e.operation=this.operation,e}_deserialize(e,t,i){super._deserialize(e,t,i),this.operation=e.operation}_dumpPropertiesCode(){return super._dumpPropertiesCode()+`${this._codeVariableName}.operation = BABYLON.TrigonometryBlockOperations.${n[this.operation]};\r\n`}}(0,a.H)("BABYLON.TrigonometryBlock",l)},8982:(e,t,i)=>{i.d(t,{t:()=>a});var n=i(468),s=i(3837),r=i(4767),o=i(2208);class a extends n.k{constructor(e){super(e,r.u.Neutral),this.xSwizzle="x",this.ySwizzle="y",this.zSwizzle="z",this.wSwizzle="w",this.registerInput("xyzw ",s.E.Vector4,!0),this.registerInput("xyz ",s.E.Vector3,!0),this.registerInput("xy ",s.E.Vector2,!0),this.registerInput("zw ",s.E.Vector2,!0),this.registerInput("x",s.E.Float,!0),this.registerInput("y",s.E.Float,!0),this.registerInput("z",s.E.Float,!0),this.registerInput("w",s.E.Float,!0),this.registerOutput("xyzw",s.E.Vector4),this.registerOutput("xyz",s.E.Vector3),this.registerOutput("xy",s.E.Vector2),this.registerOutput("zw",s.E.Vector2)}getClassName(){return"VectorMergerBlock"}get xyzwIn(){return this._inputs[0]}get xyzIn(){return this._inputs[1]}get xyIn(){return this._inputs[2]}get zwIn(){return this._inputs[3]}get x(){return this._inputs[4]}get y(){return this._inputs[5]}get z(){return this._inputs[6]}get w(){return this._inputs[7]}get xyzw(){return this._outputs[0]}get xyzOut(){return this._outputs[1]}get xyOut(){return this._outputs[2]}get zwOut(){return this._outputs[3]}get xy(){return this.xyOut}get xyz(){return this.xyzOut}_inputRename(e){return"xyzw "===e?"xyzwIn":"xyz "===e?"xyzIn":"xy "===e?"xyIn":"zw "===e?"zwIn":e}_buildSwizzle(e){return"."+(this.xSwizzle+this.ySwizzle+this.zSwizzle+this.wSwizzle).substr(0,e)}_buildBlock(e){super._buildBlock(e);const t=this.x,i=this.y,n=this.z,s=this.w,r=this.xyIn,o=this.zwIn,a=this.xyzIn,l=this.xyzwIn,h=this._outputs[0],c=this._outputs[1],u=this._outputs[2],d=this._outputs[3];return l.isConnected?(h.hasEndpoints&&(e.compilationString+=this._declareOutput(h,e)+` = ${l.associatedVariableName}${this._buildSwizzle(4)};\r\n`),c.hasEndpoints&&(e.compilationString+=this._declareOutput(c,e)+` = ${l.associatedVariableName}${this._buildSwizzle(3)};\r\n`),u.hasEndpoints&&(e.compilationString+=this._declareOutput(u,e)+` = ${l.associatedVariableName}${this._buildSwizzle(2)};\r\n`)):a.isConnected?(h.hasEndpoints&&(e.compilationString+=this._declareOutput(h,e)+` = vec4(${a.associatedVariableName}, ${s.isConnected?this._writeVariable(s):"0.0"})${this._buildSwizzle(4)};\r\n`),c.hasEndpoints&&(e.compilationString+=this._declareOutput(c,e)+` = ${a.associatedVariableName}${this._buildSwizzle(3)};\r\n`),u.hasEndpoints&&(e.compilationString+=this._declareOutput(u,e)+` = ${a.associatedVariableName}${this._buildSwizzle(2)};\r\n`)):r.isConnected?(h.hasEndpoints&&(o.isConnected?e.compilationString+=this._declareOutput(h,e)+` = vec4(${r.associatedVariableName}, ${o.associatedVariableName})${this._buildSwizzle(4)};\r\n`:e.compilationString+=this._declareOutput(h,e)+` = vec4(${r.associatedVariableName}, ${n.isConnected?this._writeVariable(n):"0.0"}, ${s.isConnected?this._writeVariable(s):"0.0"})${this._buildSwizzle(4)};\r\n`),c.hasEndpoints&&(e.compilationString+=this._declareOutput(c,e)+` = vec3(${r.associatedVariableName}, ${n.isConnected?this._writeVariable(n):"0.0"})${this._buildSwizzle(3)};\r\n`),u.hasEndpoints&&(e.compilationString+=this._declareOutput(u,e)+` = ${r.associatedVariableName}${this._buildSwizzle(2)};\r\n`),d.hasEndpoints&&(o.isConnected?e.compilationString+=this._declareOutput(d,e)+` = ${o.associatedVariableName}${this._buildSwizzle(2)};\r\n`:e.compilationString+=this._declareOutput(d,e)+` = vec2(${n.isConnected?this._writeVariable(n):"0.0"}, ${s.isConnected?this._writeVariable(s):"0.0"})${this._buildSwizzle(2)};\r\n`)):(h.hasEndpoints&&(o.isConnected?e.compilationString+=this._declareOutput(h,e)+` = vec4(${t.isConnected?this._writeVariable(t):"0.0"}, ${i.isConnected?this._writeVariable(i):"0.0"}, ${o.associatedVariableName})${this._buildSwizzle(4)};\r\n`:e.compilationString+=this._declareOutput(h,e)+` = vec4(${t.isConnected?this._writeVariable(t):"0.0"}, ${i.isConnected?this._writeVariable(i):"0.0"}, ${n.isConnected?this._writeVariable(n):"0.0"}, ${s.isConnected?this._writeVariable(s):"0.0"})${this._buildSwizzle(4)};\r\n`),c.hasEndpoints&&(e.compilationString+=this._declareOutput(c,e)+` = vec3(${t.isConnected?this._writeVariable(t):"0.0"}, ${i.isConnected?this._writeVariable(i):"0.0"}, ${n.isConnected?this._writeVariable(n):"0.0"})${this._buildSwizzle(3)};\r\n`),u.hasEndpoints&&(e.compilationString+=this._declareOutput(u,e)+` = vec2(${t.isConnected?this._writeVariable(t):"0.0"}, ${i.isConnected?this._writeVariable(i):"0.0"})${this._buildSwizzle(2)};\r\n`),d.hasEndpoints&&(o.isConnected?e.compilationString+=this._declareOutput(d,e)+` = ${o.associatedVariableName}${this._buildSwizzle(2)};\r\n`:e.compilationString+=this._declareOutput(d,e)+` = vec2(${n.isConnected?this._writeVariable(n):"0.0"}, ${s.isConnected?this._writeVariable(s):"0.0"})${this._buildSwizzle(2)};\r\n`)),this}serialize(){const e=super.serialize();return e.xSwizzle=this.xSwizzle,e.ySwizzle=this.ySwizzle,e.zSwizzle=this.zSwizzle,e.wSwizzle=this.wSwizzle,e}_deserialize(e,t,i){var n,s,r,o;super._deserialize(e,t,i),this.xSwizzle=null!==(n=e.xSwizzle)&&void 0!==n?n:"x",this.ySwizzle=null!==(s=e.ySwizzle)&&void 0!==s?s:"y",this.zSwizzle=null!==(r=e.zSwizzle)&&void 0!==r?r:"z",this.wSwizzle=null!==(o=e.wSwizzle)&&void 0!==o?o:"w"}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.xSwizzle = "${this.xSwizzle}";\r\n`,e+=`${this._codeVariableName}.ySwizzle = "${this.ySwizzle}";\r\n`,e+=`${this._codeVariableName}.zSwizzle = "${this.zSwizzle}";\r\n`,e+=`${this._codeVariableName}.wSwizzle = "${this.wSwizzle}";\r\n`,e}}(0,o.H)("BABYLON.VectorMergerBlock",a)},8832:(e,t,i)=>{var n;i.d(t,{M:()=>n}),function(e){e[e.Uniform=0]="Uniform",e[e.Attribute=1]="Attribute",e[e.Varying=2]="Varying",e[e.Undefined=3]="Undefined"}(n||(n={}))},3837:(e,t,i)=>{var n;i.d(t,{E:()=>n}),function(e){e[e.Float=1]="Float",e[e.Int=2]="Int",e[e.Vector2=4]="Vector2",e[e.Vector3=8]="Vector3",e[e.Vector4=16]="Vector4",e[e.Color3=32]="Color3",e[e.Color4=64]="Color4",e[e.Matrix=128]="Matrix",e[e.Object=256]="Object",e[e.AutoDetect=1024]="AutoDetect",e[e.BasedOnInput=2048]="BasedOnInput",e[e.All=4095]="All"}(n||(n={}))},4767:(e,t,i)=>{var n;i.d(t,{u:()=>n}),function(e){e[e.Vertex=1]="Vertex",e[e.Fragment=2]="Fragment",e[e.Neutral=4]="Neutral",e[e.VertexAndFragment=3]="VertexAndFragment"}(n||(n={}))},2904:(e,t,i)=>{var n;i.d(t,{a:()=>n}),function(e){e[e.Material=0]="Material",e[e.PostProcess=1]="PostProcess",e[e.Particle=2]="Particle",e[e.ProceduralTexture=3]="ProceduralTexture"}(n||(n={}))},9135:(e,t,i)=>{var n;i.d(t,{$:()=>n}),function(e){e[e.World=1]="World",e[e.View=2]="View",e[e.Projection=3]="Projection",e[e.ViewProjection=4]="ViewProjection",e[e.WorldView=5]="WorldView",e[e.WorldViewProjection=6]="WorldViewProjection",e[e.CameraPosition=7]="CameraPosition",e[e.FogColor=8]="FogColor",e[e.DeltaTime=9]="DeltaTime",e[e.CameraParameters=10]="CameraParameters",e[e.MaterialAlpha=11]="MaterialAlpha"}(n||(n={}))},4834:(e,t,i)=>{i.d(t,{O:()=>Y,n:()=>j});var n=i(9472),s=i(580),r=i(1795),o=i(4141),a=i(4649),l=i(7814),h=i(3837),c=i(4767),u=i(1979);class d{constructor(){this.supportUniformBuffers=!1,this.attributes=new Array,this.uniforms=new Array,this.constants=new Array,this.samplers=new Array,this.functions={},this.extensions={},this.counters={},this._attributeDeclaration="",this._uniformDeclaration="",this._constantDeclaration="",this._samplerDeclaration="",this._varyingTransfer="",this._injectAtEnd="",this._repeatableContentAnchorIndex=0,this._builtCompilationString="",this.compilationString=""}finalize(e){const t=e.sharedData.emitComments,i=this.target===c.u.Fragment;this.compilationString=`\r\n${t?"//Entry point\r\n":""}void main(void) {\r\n${this.compilationString}`,this._constantDeclaration&&(this.compilationString=`\r\n${t?"//Constants\r\n":""}${this._constantDeclaration}\r\n${this.compilationString}`);let n="";for(const e in this.functions)n+=this.functions[e]+"\r\n";this.compilationString=`\r\n${n}\r\n${this.compilationString}`,!i&&this._varyingTransfer&&(this.compilationString=`${this.compilationString}\r\n${this._varyingTransfer}`),this._injectAtEnd&&(this.compilationString=`${this.compilationString}\r\n${this._injectAtEnd}`),this.compilationString=`${this.compilationString}\r\n}`,this.sharedData.varyingDeclaration&&(this.compilationString=`\r\n${t?"//Varyings\r\n":""}${this.sharedData.varyingDeclaration}\r\n${this.compilationString}`),this._samplerDeclaration&&(this.compilationString=`\r\n${t?"//Samplers\r\n":""}${this._samplerDeclaration}\r\n${this.compilationString}`),this._uniformDeclaration&&(this.compilationString=`\r\n${t?"//Uniforms\r\n":""}${this._uniformDeclaration}\r\n${this.compilationString}`),this._attributeDeclaration&&!i&&(this.compilationString=`\r\n${t?"//Attributes\r\n":""}${this._attributeDeclaration}\r\n${this.compilationString}`),this.compilationString="precision highp float;\r\n"+this.compilationString,this.compilationString="#if defined(WEBGL2) || defines(WEBGPU)\r\nprecision highp sampler2DArray;\r\n#endif\r\n"+this.compilationString;for(const e in this.extensions){const t=this.extensions[e];this.compilationString=`\r\n${t}\r\n${this.compilationString}`}this._builtCompilationString=this.compilationString}get _repeatableContentAnchor(){return`###___ANCHOR${this._repeatableContentAnchorIndex++}___###`}_getFreeVariableName(e){return e=e.replace(/[^a-zA-Z_]+/g,""),void 0===this.sharedData.variableNames[e]?(this.sharedData.variableNames[e]=0,"output"===e||"texture"===e?e+this.sharedData.variableNames[e]:e):(this.sharedData.variableNames[e]++,e+this.sharedData.variableNames[e])}_getFreeDefineName(e){return void 0===this.sharedData.defineNames[e]?this.sharedData.defineNames[e]=0:this.sharedData.defineNames[e]++,e+this.sharedData.defineNames[e]}_excludeVariableName(e){this.sharedData.variableNames[e]=0}_emit2DSampler(e){this.samplers.indexOf(e)<0&&(this._samplerDeclaration+=`uniform sampler2D ${e};\r\n`,this.samplers.push(e))}_emit2DArraySampler(e){this.samplers.indexOf(e)<0&&(this._samplerDeclaration+=`uniform sampler2DArray ${e};\r\n`,this.samplers.push(e))}_getGLType(e){switch(e){case h.E.Float:return"float";case h.E.Int:return"int";case h.E.Vector2:return"vec2";case h.E.Color3:case h.E.Vector3:return"vec3";case h.E.Color4:case h.E.Vector4:return"vec4";case h.E.Matrix:return"mat4"}return""}_emitExtension(e,t,i=""){this.extensions[e]||(i&&(t=`#if ${i}\r\n${t}\r\n#endif`),this.extensions[e]=t)}_emitFunction(e,t,i){this.functions[e]||(this.sharedData.emitComments&&(t=i+"\r\n"+t),this.functions[e]=t)}_emitCodeFromInclude(e,t,i){if(i&&i.repeatKey)return`#include<${e}>${i.substitutionVars?"("+i.substitutionVars+")":""}[0..${i.repeatKey}]\r\n`;let n=u.Q.IncludesShadersStore[e]+"\r\n";if(this.sharedData.emitComments&&(n=t+"\r\n"+n),!i)return n;if(i.replaceStrings)for(let e=0;e<i.replaceStrings.length;e++){const t=i.replaceStrings[e];n=n.replace(t.search,t.replace)}return n}_emitFunctionFromInclude(e,t,i,n=""){const s=e+n;if(!this.functions[s]){if(!i||!(i.removeAttributes||i.removeUniforms||i.removeVaryings||i.removeIfDef||i.replaceStrings))return i&&i.repeatKey?this.functions[s]=`#include<${e}>${i.substitutionVars?"("+i.substitutionVars+")":""}[0..${i.repeatKey}]\r\n`:this.functions[s]=`#include<${e}>${(null==i?void 0:i.substitutionVars)?"("+(null==i?void 0:i.substitutionVars)+")":""}\r\n`,void(this.sharedData.emitComments&&(this.functions[s]=t+"\r\n"+this.functions[s]));if(this.functions[s]=u.Q.IncludesShadersStore[e],this.sharedData.emitComments&&(this.functions[s]=t+"\r\n"+this.functions[s]),i.removeIfDef&&(this.functions[s]=this.functions[s].replace(/^\s*?#ifdef.+$/gm,""),this.functions[s]=this.functions[s].replace(/^\s*?#endif.*$/gm,""),this.functions[s]=this.functions[s].replace(/^\s*?#else.*$/gm,""),this.functions[s]=this.functions[s].replace(/^\s*?#elif.*$/gm,"")),i.removeAttributes&&(this.functions[s]=this.functions[s].replace(/^\s*?attribute.+$/gm,"")),i.removeUniforms&&(this.functions[s]=this.functions[s].replace(/^\s*?uniform.+$/gm,"")),i.removeVaryings&&(this.functions[s]=this.functions[s].replace(/^\s*?varying.+$/gm,"")),i.replaceStrings)for(let e=0;e<i.replaceStrings.length;e++){const t=i.replaceStrings[e];this.functions[s]=this.functions[s].replace(t.search,t.replace)}}}_registerTempVariable(e){return-1===this.sharedData.temps.indexOf(e)&&(this.sharedData.temps.push(e),!0)}_emitVaryingFromString(e,t,i="",n=!1){return-1===this.sharedData.varyings.indexOf(e)&&(this.sharedData.varyings.push(e),i&&(i.startsWith("defined(")?this.sharedData.varyingDeclaration+=`#if ${i}\r\n`:this.sharedData.varyingDeclaration+=`${n?"#ifndef":"#ifdef"} ${i}\r\n`),this.sharedData.varyingDeclaration+=`varying ${t} ${e};\r\n`,i&&(this.sharedData.varyingDeclaration+="#endif\r\n"),!0)}_emitUniformFromString(e,t,i="",n=!1){-1===this.uniforms.indexOf(e)&&(this.uniforms.push(e),i&&(i.startsWith("defined(")?this._uniformDeclaration+=`#if ${i}\r\n`:this._uniformDeclaration+=`${n?"#ifndef":"#ifdef"} ${i}\r\n`),this._uniformDeclaration+=`uniform ${t} ${e};\r\n`,i&&(this._uniformDeclaration+="#endif\r\n"))}_emitFloat(e){return e.toString()===e.toFixed(0)?`${e}.0`:e.toString()}}var p=i(5757);class f{constructor(){this.temps=new Array,this.varyings=new Array,this.varyingDeclaration="",this.inputBlocks=new Array,this.textureBlocks=new Array,this.bindableBlocks=new Array,this.forcedBindableBlocks=new Array,this.blocksWithFallbacks=new Array,this.blocksWithDefines=new Array,this.repeatableContentBlocks=new Array,this.dynamicUniformBlocks=new Array,this.blockingBlocks=new Array,this.animatedInputs=new Array,this.variableNames={},this.defineNames={},this.hints={needWorldViewMatrix:!1,needWorldViewProjectionMatrix:!1,needAlphaBlending:!1,needAlphaTesting:!1},this.checks={emitVertex:!1,emitFragment:!1,notConnectedNonOptionalInputs:new Array},this.allowEmptyVertexProgram=!1,this.variableNames.position=0,this.variableNames.normal=0,this.variableNames.tangent=0,this.variableNames.uv=0,this.variableNames.uv2=0,this.variableNames.uv3=0,this.variableNames.uv4=0,this.variableNames.uv5=0,this.variableNames.uv6=0,this.variableNames.color=0,this.variableNames.matricesIndices=0,this.variableNames.matricesWeights=0,this.variableNames.matricesIndicesExtra=0,this.variableNames.matricesWeightsExtra=0,this.variableNames.diffuseBase=0,this.variableNames.specularBase=0,this.variableNames.worldPos=0,this.variableNames.shadow=0,this.variableNames.view=0,this.variableNames.vTBN=0,this.defineNames.MAINUV0=0,this.defineNames.MAINUV1=0,this.defineNames.MAINUV2=0,this.defineNames.MAINUV3=0,this.defineNames.MAINUV4=0,this.defineNames.MAINUV5=0,this.defineNames.MAINUV6=0,this.defineNames.MAINUV7=0}emitErrors(){let e="";this.checks.emitVertex||this.allowEmptyVertexProgram||(e+="NodeMaterial does not have a vertex output. You need to at least add a block that generates a glPosition value.\r\n"),this.checks.emitFragment||(e+="NodeMaterial does not have a fragment output. You need to at least add a block that generates a glFragColor value.\r\n");for(const t of this.checks.notConnectedNonOptionalInputs)e+=`input ${t.name} from block ${t.ownerBlock.name}[${t.ownerBlock.getClassName()}] is not connected and is not optional.\r\n`;if(e)throw"Build of NodeMaterial failed:\r\n"+e}}var _=i(1917),m=i(708),g=i(7257),v=i(7238),y=i(7123),x=i(9709),b=i(363),T=i(2208),S=i(3956),E=i(6653),C=i(7010),A=i(8560),P=i(1320),R=i(1434),M=i(6662),I=i(392),D=i(8982),O=i(2864),w=i(3841),N=i(2904),F=i(2262),L=i(5753),B=i(8022),U=i(6290),V=i(7902),k=i(3426),G=i(3069),z=i(9135),W=i(1431),H=i(5346);const X={effect:null,subMesh:null};class j extends _.H{constructor(){super(),this.NORMAL=!1,this.TANGENT=!1,this.VERTEXCOLOR_NME=!1,this.UV1=!1,this.UV2=!1,this.UV3=!1,this.UV4=!1,this.UV5=!1,this.UV6=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.BONETEXTURE=!1,this.MORPHTARGETS=!1,this.MORPHTARGETS_NORMAL=!1,this.MORPHTARGETS_TANGENT=!1,this.MORPHTARGETS_UV=!1,this.NUM_MORPH_INFLUENCERS=0,this.MORPHTARGETS_TEXTURE=!1,this.IMAGEPROCESSING=!1,this.VIGNETTE=!1,this.VIGNETTEBLENDMODEMULTIPLY=!1,this.VIGNETTEBLENDMODEOPAQUE=!1,this.TONEMAPPING=!1,this.TONEMAPPING_ACES=!1,this.CONTRAST=!1,this.EXPOSURE=!1,this.COLORCURVES=!1,this.COLORGRADING=!1,this.COLORGRADING3D=!1,this.SAMPLER3DGREENDEPTH=!1,this.SAMPLER3DBGRMAP=!1,this.DITHER=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.BUMPDIRECTUV=0,this.CAMERA_ORTHOGRAPHIC=!1,this.CAMERA_PERSPECTIVE=!1,this.rebuild()}setValue(e,t,i=!1){void 0===this[e]&&this._keys.push(e),i&&this[e]!==t&&this.markAsUnprocessed(),this[e]=t}}class Y extends s.a{static _BlockIsTextureBlock(e){return"TextureBlock"===e.getClassName()||"ReflectionTextureBaseBlock"===e.getClassName()||"RefractionBlock"===e.getClassName()||"CurrentScreenBlock"===e.getClassName()||"ParticleTextureBlock"===e.getClassName()||"ImageSourceBlock"===e.getClassName()||"TriPlanarBlock"===e.getClassName()||"BiPlanarBlock"===e.getClassName()}_getGlobalNodeMaterialEditor(){return"undefined"!=typeof NODEEDITOR?NODEEDITOR:"undefined"!=typeof BABYLON&&void 0!==BABYLON.NodeEditor?BABYLON:void 0}get options(){return this._options}set options(e){this._options=e}get imageProcessingConfiguration(){return this._imageProcessingConfiguration}set imageProcessingConfiguration(e){this._attachImageProcessingConfiguration(e),this._markAllSubMeshesAsTexturesDirty()}get mode(){return this._mode}set mode(e){this._mode=e}get buildId(){return this._buildId}set buildId(e){this._buildId=e}constructor(e,t,i={}){super(e,t||W.l.LastCreatedScene),this._buildId=Y._BuildIdGenerator++,this._buildWasSuccessful=!1,this._cachedWorldViewMatrix=new o.y3,this._cachedWorldViewProjectionMatrix=new o.y3,this._optimizers=new Array,this._animationFrame=-1,this.BJSNODEMATERIALEDITOR=this._getGlobalNodeMaterialEditor(),this.editorData=null,this.ignoreAlpha=!1,this.maxSimultaneousLights=4,this.onBuildObservable=new p.y$,this._vertexOutputNodes=new Array,this._fragmentOutputNodes=new Array,this.attachedBlocks=new Array,this._mode=N.a.Material,this.forceAlphaBlending=!1,this._options={emitComments:!1,...i},this._attachImageProcessingConfiguration(null)}getClassName(){return"NodeMaterial"}_attachImageProcessingConfiguration(e){e!==this._imageProcessingConfiguration&&(this._imageProcessingConfiguration&&this._imageProcessingObserver&&this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver),this._imageProcessingConfiguration=e||this.getScene().imageProcessingConfiguration,this._imageProcessingConfiguration&&(this._imageProcessingObserver=this._imageProcessingConfiguration.onUpdateParameters.add((()=>{this._markAllSubMeshesAsImageProcessingDirty()}))))}getBlockByName(e){let t=null;for(const i of this.attachedBlocks)if(i.name===e){if(t)return g.w1.Warn("More than one block was found with the name `"+e+"`"),t;t=i}return t}getBlockByPredicate(e){for(const t of this.attachedBlocks)if(e(t))return t;return null}getInputBlockByPredicate(e){for(const t of this.attachedBlocks)if(t.isInput&&e(t))return t;return null}getInputBlocks(){const e=[];for(const t of this.attachedBlocks)t.isInput&&e.push(t);return e}registerOptimizer(e){if(!(this._optimizers.indexOf(e)>-1))return this._optimizers.push(e),this}unregisterOptimizer(e){const t=this._optimizers.indexOf(e);if(-1!==t)return this._optimizers.splice(t,1),this}addOutputNode(e){if(null===e.target)throw"This node is not meant to be an output node. You may want to explicitly set its target value.";return 0!=(e.target&c.u.Vertex)&&this._addVertexOutputNode(e),0!=(e.target&c.u.Fragment)&&this._addFragmentOutputNode(e),this}removeOutputNode(e){return null===e.target||(0!=(e.target&c.u.Vertex)&&this._removeVertexOutputNode(e),0!=(e.target&c.u.Fragment)&&this._removeFragmentOutputNode(e)),this}_addVertexOutputNode(e){if(-1===this._vertexOutputNodes.indexOf(e))return e.target=c.u.Vertex,this._vertexOutputNodes.push(e),this}_removeVertexOutputNode(e){const t=this._vertexOutputNodes.indexOf(e);if(-1!==t)return this._vertexOutputNodes.splice(t,1),this}_addFragmentOutputNode(e){if(-1===this._fragmentOutputNodes.indexOf(e))return e.target=c.u.Fragment,this._fragmentOutputNodes.push(e),this}_removeFragmentOutputNode(e){const t=this._fragmentOutputNodes.indexOf(e);if(-1!==t)return this._fragmentOutputNodes.splice(t,1),this}needAlphaBlending(){return!this.ignoreAlpha&&(this.forceAlphaBlending||this.alpha<1||this._sharedData&&this._sharedData.hints.needAlphaBlending)}needAlphaTesting(){return this._sharedData&&this._sharedData.hints.needAlphaTesting}_initializeBlock(e,t,i,n=!0){if(e.initialize(t),n&&e.autoConfigure(this),e._preparationId=this._buildId,-1===this.attachedBlocks.indexOf(e)){if(e.isUnique){const t=e.getClassName();for(const e of this.attachedBlocks)if(e.getClassName()===t)throw`Cannot have multiple blocks of type ${t} in the same NodeMaterial`}this.attachedBlocks.push(e)}for(const s of e.inputs){s.associatedVariableName="";const r=s.connectedPoint;if(r){const s=r.ownerBlock;s!==e&&((s.target===c.u.VertexAndFragment||t.target===c.u.Fragment&&s.target===c.u.Vertex&&s._preparationId!==this._buildId)&&i.push(s),this._initializeBlock(s,t,i,n))}}for(const t of e.outputs)t.associatedVariableName=""}_resetDualBlocks(e,t){e.target===c.u.VertexAndFragment&&(e.buildId=t);for(const i of e.inputs){const n=i.connectedPoint;if(n){const i=n.ownerBlock;i!==e&&this._resetDualBlocks(i,t)}}}removeBlock(e){const t=this.attachedBlocks.indexOf(e);t>-1&&this.attachedBlocks.splice(t,1),e.isFinalMerger&&this.removeOutputNode(e)}build(e=!1,t=!0,i=!0){this._buildWasSuccessful=!1;const n=this.getScene().getEngine(),s=this._mode===N.a.Particle;if(0===this._vertexOutputNodes.length&&!s)throw"You must define at least one vertexOutputNode";if(0===this._fragmentOutputNodes.length)throw"You must define at least one fragmentOutputNode";this._vertexCompilationState=new d,this._vertexCompilationState.supportUniformBuffers=n.supportsUniformBuffers,this._vertexCompilationState.target=c.u.Vertex,this._fragmentCompilationState=new d,this._fragmentCompilationState.supportUniformBuffers=n.supportsUniformBuffers,this._fragmentCompilationState.target=c.u.Fragment,this._sharedData=new f,this._sharedData.fragmentOutputNodes=this._fragmentOutputNodes,this._vertexCompilationState.sharedData=this._sharedData,this._fragmentCompilationState.sharedData=this._sharedData,this._sharedData.buildId=this._buildId,this._sharedData.emitComments=this._options.emitComments,this._sharedData.verbose=e,this._sharedData.scene=this.getScene(),this._sharedData.allowEmptyVertexProgram=s;const r=[],o=[];for(const e of this._vertexOutputNodes)r.push(e),this._initializeBlock(e,this._vertexCompilationState,o,i);for(const e of this._fragmentOutputNodes)o.push(e),this._initializeBlock(e,this._fragmentCompilationState,r,i);this.optimize();for(const e of r)e.build(this._vertexCompilationState,r);this._fragmentCompilationState.uniforms=this._vertexCompilationState.uniforms.slice(0),this._fragmentCompilationState._uniformDeclaration=this._vertexCompilationState._uniformDeclaration,this._fragmentCompilationState._constantDeclaration=this._vertexCompilationState._constantDeclaration,this._fragmentCompilationState._vertexState=this._vertexCompilationState;for(const e of o)this._resetDualBlocks(e,this._buildId-1);for(const e of o)e.build(this._fragmentCompilationState,o);this._vertexCompilationState.finalize(this._vertexCompilationState),this._fragmentCompilationState.finalize(this._fragmentCompilationState),t&&(this._buildId=Y._BuildIdGenerator++),this._sharedData.emitErrors(),e&&(console.log("Vertex shader:"),console.log(this._vertexCompilationState.compilationString),console.log("Fragment shader:"),console.log(this._fragmentCompilationState.compilationString)),this._buildWasSuccessful=!0,this.onBuildObservable.notifyObservers(this);const a=this.getScene().meshes;for(const e of a)if(e.subMeshes)for(const t of e.subMeshes){if(t.getMaterial()!==this)continue;if(!t.materialDefines)continue;const e=t.materialDefines;e.markAllAsDirty(),e.reset()}}optimize(){for(const e of this._optimizers)e.optimize(this._vertexOutputNodes,this._fragmentOutputNodes)}_prepareDefinesForAttributes(e,t){const i=t.NORMAL,n=t.TANGENT,s=t.VERTEXCOLOR_NME;t.NORMAL=e.isVerticesDataPresent(m.o.NormalKind),t.TANGENT=e.isVerticesDataPresent(m.o.TangentKind);const r=e.useVertexColors&&e.isVerticesDataPresent(m.o.ColorKind);t.VERTEXCOLOR_NME=r;let o=!1;for(let i=1;i<=6;++i){const n=t["UV"+i];t["UV"+i]=e.isVerticesDataPresent(`uv${1===i?"":i}`),o=o||t["UV"+i]!==n}(i!==t.NORMAL||n!==t.TANGENT||s!==t.VERTEXCOLOR_NME||o)&&t.markAsAttributesDirty()}createPostProcess(e,t=1,i=1,n,s,r=0,o=5){return this.mode!==N.a.PostProcess?(console.log("Incompatible material mode"),null):this._createEffectForPostProcess(null,e,t,i,n,s,r,o)}createEffectForPostProcess(e){this._createEffectForPostProcess(e)}_createEffectForPostProcess(e,t,i=1,n=1,s,o,a=0,l=5){let h=this.name+this._buildId;const c=new j,d=new r.x(h+"PostProcess",this.getScene());let p=this._buildId;return this._processDefines(d,c),u.Q.RegisterShader(h,this._fragmentCompilationState._builtCompilationString,this._vertexCompilationState._builtCompilationString),e?e.updateEffect(c.toString(),this._fragmentCompilationState.uniforms,this._fragmentCompilationState.samplers,{maxSimultaneousLights:this.maxSimultaneousLights},void 0,void 0,h,h):e=new I.D(this.name+"PostProcess",h,this._fragmentCompilationState.uniforms,this._fragmentCompilationState.samplers,i,t,n,s,o,c.toString(),a,h,{maxSimultaneousLights:this.maxSimultaneousLights},!1,l),e.nodeMaterialSource=this,e.onApplyObservable.add((t=>{p!==this._buildId&&(delete u.Q.ShadersStore[h+"VertexShader"],delete u.Q.ShadersStore[h+"PixelShader"],h=this.name+this._buildId,c.markAllAsDirty(),p=this._buildId),this._processDefines(d,c)&&(u.Q.RegisterShader(h,this._fragmentCompilationState._builtCompilationString,this._vertexCompilationState._builtCompilationString),U.Q.SetImmediate((()=>e.updateEffect(c.toString(),this._fragmentCompilationState.uniforms,this._fragmentCompilationState.samplers,{maxSimultaneousLights:this.maxSimultaneousLights},void 0,void 0,h,h)))),this._checkInternals(t)})),e}createProceduralTexture(e,t){if(this.mode!==N.a.ProceduralTexture)return console.log("Incompatible material mode"),null;let i=this.name+this._buildId;const n=new V.g(i,e,null,t),s=new r.x(i+"Procedural",this.getScene());s.reservedDataStore={hidden:!0};const o=new j,a=this._processDefines(s,o);u.Q.RegisterShader(i,this._fragmentCompilationState._builtCompilationString,this._vertexCompilationState._builtCompilationString);let l=this.getScene().getEngine().createEffect({vertexElement:i,fragmentElement:i},[m.o.PositionKind],this._fragmentCompilationState.uniforms,this._fragmentCompilationState.samplers,o.toString(),null==a?void 0:a.fallbacks,void 0);n.nodeMaterialSource=this,n._setEffect(l);let h=this._buildId;return n.onBeforeGenerationObservable.add((()=>{h!==this._buildId&&(delete u.Q.ShadersStore[i+"VertexShader"],delete u.Q.ShadersStore[i+"PixelShader"],i=this.name+this._buildId,o.markAllAsDirty(),h=this._buildId);const e=this._processDefines(s,o);e&&(u.Q.RegisterShader(i,this._fragmentCompilationState._builtCompilationString,this._vertexCompilationState._builtCompilationString),U.Q.SetImmediate((()=>{l=this.getScene().getEngine().createEffect({vertexElement:i,fragmentElement:i},[m.o.PositionKind],this._fragmentCompilationState.uniforms,this._fragmentCompilationState.samplers,o.toString(),null==e?void 0:e.fallbacks,void 0),n._setEffect(l)}))),this._checkInternals(l)})),n}_createEffectForParticles(e,t,i,n,s,o,a,l=""){let h=this.name+this._buildId+"_"+t;o||(o=new j),a||(a=this.getScene().getMeshByName(this.name+"Particle"))||((a=new r.x(this.name+"Particle",this.getScene())).reservedDataStore={hidden:!0});let c=this._buildId;const d=[];let p=l;if(!s){const r=this._processDefines(a,o);u.Q.RegisterShader(h,this._fragmentCompilationState._builtCompilationString),e.fillDefines(d,t),p=d.join("\n"),s=this.getScene().getEngine().createEffectForParticles(h,this._fragmentCompilationState.uniforms,this._fragmentCompilationState.samplers,o.toString()+"\n"+p,null==r?void 0:r.fallbacks,i,n,e),e.setCustomEffect(s,t)}s.onBindObservable.add((s=>{c!==this._buildId&&(delete u.Q.ShadersStore[h+"PixelShader"],h=this.name+this._buildId+"_"+t,o.markAllAsDirty(),c=this._buildId),d.length=0,e.fillDefines(d,t);const r=d.join("\n");r!==p&&(o.markAllAsDirty(),p=r);const f=this._processDefines(a,o);if(f)return u.Q.RegisterShader(h,this._fragmentCompilationState._builtCompilationString),s=this.getScene().getEngine().createEffectForParticles(h,this._fragmentCompilationState.uniforms,this._fragmentCompilationState.samplers,o.toString()+"\n"+p,null==f?void 0:f.fallbacks,i,n,e),e.setCustomEffect(s,t),void this._createEffectForParticles(e,t,i,n,s,o,a,l);this._checkInternals(s)}))}_checkInternals(e){if(this._sharedData.animatedInputs){const e=this.getScene(),t=e.getFrameId();if(this._animationFrame!==t){for(const t of this._sharedData.animatedInputs)t.animate(e);this._animationFrame=t}}for(const t of this._sharedData.bindableBlocks)t.bind(e,this);for(const t of this._sharedData.inputBlocks)t._transmit(e,this.getScene(),this)}createEffectForParticles(e,t,i){this.mode===N.a.Particle?(this._createEffectForParticles(e,L.U.BLENDMODE_ONEONE,t,i),this._createEffectForParticles(e,L.U.BLENDMODE_MULTIPLY,t,i)):console.log("Incompatible material mode")}createAsShadowDepthWrapper(e){this.mode===N.a.Material?e.shadowDepthWrapper=new BABYLON.ShadowDepthWrapper(this,this.getScene()):console.log("Incompatible material mode")}_processDefines(e,t,i=!1,n){let s=null;const r=this.getScene();if(H.G.PrepareDefinesForCamera(r,t)&&t.markAsMiscDirty(),this._sharedData.blocksWithDefines.forEach((n=>{n.initializeDefines(e,this,t,i)})),this._sharedData.blocksWithDefines.forEach((s=>{s.prepareDefines(e,this,t,i,n)})),t.isDirty){const i=t._areLightsDisposed;t.markAsProcessed(),this._vertexCompilationState.compilationString=this._vertexCompilationState._builtCompilationString,this._fragmentCompilationState.compilationString=this._fragmentCompilationState._builtCompilationString,this._sharedData.repeatableContentBlocks.forEach((i=>{i.replaceRepeatableContent(this._vertexCompilationState,this._fragmentCompilationState,e,t)}));const n=[];this._sharedData.dynamicUniformBlocks.forEach((e=>{e.updateUniformsAndSamples(this._vertexCompilationState,this,t,n)}));const r=this._vertexCompilationState.uniforms;this._fragmentCompilationState.uniforms.forEach((e=>{-1===r.indexOf(e)&&r.push(e)}));const o=this._vertexCompilationState.samplers;this._fragmentCompilationState.samplers.forEach((e=>{-1===o.indexOf(e)&&o.push(e)}));const a=new R.L;this._sharedData.blocksWithFallbacks.forEach((t=>{t.provideFallbacks(e,a)})),s={lightDisposed:i,uniformBuffers:n,mergedUniforms:r,mergedSamplers:o,fallbacks:a}}return s}isReadyForSubMesh(e,t,i=!1){if(!this._buildWasSuccessful)return!1;const n=this.getScene();if(this._sharedData.animatedInputs){const e=n.getFrameId();if(this._animationFrame!==e){for(const e of this._sharedData.animatedInputs)e.animate(n);this._animationFrame=e}}if(t.effect&&this.isFrozen&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new j);const s=t.materialDefines;if(this._isReadyForSubMesh(t))return!0;const r=n.getEngine();if(this._prepareDefinesForAttributes(e,s),this._sharedData.blockingBlocks.some((t=>!t.isReady(e,this,s,i))))return!1;const o=this._processDefines(e,s,i,t);if(o){const e=t.effect,i=s.toString();let a=r.createEffect({vertex:"nodeMaterial"+this._buildId,fragment:"nodeMaterial"+this._buildId,vertexSource:this._vertexCompilationState.compilationString,fragmentSource:this._fragmentCompilationState.compilationString},{attributes:this._vertexCompilationState.attributes,uniformsNames:o.mergedUniforms,uniformBuffersNames:o.uniformBuffers,samplers:o.mergedSamplers,defines:i,fallbacks:o.fallbacks,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:this.maxSimultaneousLights,maxSimultaneousMorphTargets:s.NUM_MORPH_INFLUENCERS}},r);if(a)if(this._onEffectCreatedObservable&&(X.effect=a,X.subMesh=t,this._onEffectCreatedObservable.notifyObservers(X)),this.allowShaderHotSwapping&&e&&!a.isReady()){if(a=e,s.markAsUnprocessed(),o.lightDisposed)return s._areLightsDisposed=!0,!1}else n.resetCachedMaterial(),t.setEffect(a,s,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(s._renderId=n.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=i,this._checkScenePerformancePriority(),0))}get compiledShaders(){return`// Vertex shader\r\n${this._vertexCompilationState.compilationString}\r\n\r\n// Fragment shader\r\n${this._fragmentCompilationState.compilationString}`}bindOnlyWorldMatrix(e){const t=this.getScene();if(!this._activeEffect)return;const i=this._sharedData.hints;i.needWorldViewMatrix&&e.multiplyToRef(t.getViewMatrix(),this._cachedWorldViewMatrix),i.needWorldViewProjectionMatrix&&e.multiplyToRef(t.getTransformMatrix(),this._cachedWorldViewProjectionMatrix);for(const t of this._sharedData.inputBlocks)t._transmitWorld(this._activeEffect,e,this._cachedWorldViewMatrix,this._cachedWorldViewProjectionMatrix)}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.effect;if(!s)return;this._activeEffect=s,this.bindOnlyWorldMatrix(e);const r=this._mustRebind(n,s,t.visibility),o=this._sharedData;if(r){for(const e of o.bindableBlocks)e.bind(s,this,t,i);for(const e of o.forcedBindableBlocks)e.bind(s,this,t,i);for(const e of o.inputBlocks)e._transmit(s,n,this)}else if(!this.isFrozen)for(const e of o.forcedBindableBlocks)e.bind(s,this,t,i);this._afterBind(t,this._activeEffect)}getActiveTextures(){const e=super.getActiveTextures();return this._sharedData&&e.push(...this._sharedData.textureBlocks.filter((e=>e.texture)).map((e=>e.texture))),e}getTextureBlocks(){return this._sharedData?this._sharedData.textureBlocks:[]}getAllTextureBlocks(){const e=[];for(const t of this.attachedBlocks)Y._BlockIsTextureBlock(t)&&e.push(t);return e}hasTexture(e){if(super.hasTexture(e))return!0;if(!this._sharedData)return!1;for(const t of this._sharedData.textureBlocks)if(t.texture===e)return!0;return!1}dispose(e,t,i){if(t)for(const e of this.getTextureBlocks().filter((e=>e.texture)).map((e=>e.texture)))e.dispose();for(const e of this.attachedBlocks)e.dispose();this.attachedBlocks.length=0,this._sharedData=null,this._vertexCompilationState=null,this._fragmentCompilationState=null,this.onBuildObservable.clear(),this._imageProcessingObserver&&(this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver),this._imageProcessingObserver=null),super.dispose(e,t,i)}_createNodeEditor(){this.BJSNODEMATERIALEDITOR.NodeEditor.Show({nodeMaterial:this})}edit(e){return new Promise((t=>{if(this.BJSNODEMATERIALEDITOR=this.BJSNODEMATERIALEDITOR||this._getGlobalNodeMaterialEditor(),void 0===this.BJSNODEMATERIALEDITOR){const i=e&&e.editorURL?e.editorURL:Y.EditorURL;g.w1.LoadScript(i,(()=>{this.BJSNODEMATERIALEDITOR=this.BJSNODEMATERIALEDITOR||this._getGlobalNodeMaterialEditor(),this._createNodeEditor(),t()}))}else this._createNodeEditor(),t()}))}clear(){this._vertexOutputNodes.length=0,this._fragmentOutputNodes.length=0,this.attachedBlocks.length=0}setToDefault(){this.clear(),this.editorData=null;const e=new b.S("Position");e.setAsAttribute("position");const t=new b.S("World");t.setAsSystemValue(z.$.World);const i=new v.m("WorldPos");e.connectTo(i),t.connectTo(i);const n=new b.S("ViewProjection");n.setAsSystemValue(z.$.ViewProjection);const s=new v.m("WorldPos * ViewProjectionTransform");i.connectTo(s),n.connectTo(s);const r=new y.t("VertexOutput");s.connectTo(r);const o=new b.S("color");o.value=new a.HE(.8,.8,.8,1);const l=new x.g("FragmentOutput");o.connectTo(l),this.addOutputNode(r),this.addOutputNode(l),this._mode=N.a.Material}setToDefaultPostProcess(){this.clear(),this.editorData=null;const e=new b.S("Position");e.setAsAttribute("position2d");const t=new b.S("Constant1");t.isConstant=!0,t.value=1;const i=new D.t("Position3D");e.connectTo(i),t.connectTo(i,{input:"w"});const n=new y.t("VertexOutput");i.connectTo(n);const s=new b.S("Scale");s.visibleInInspector=!0,s.value=new o.FM(1,1);const r=new O.w("uv0");e.connectTo(r);const a=new w.U("UV scale");r.connectTo(a),s.connectTo(a);const l=new E.K("CurrentScreen");a.connectTo(l),l.texture=new F.x("https://assets.babylonjs.com/nme/currentScreenPostProcess.png",this.getScene());const h=new x.g("FragmentOutput");l.connectTo(h,{output:"rgba"}),this.addOutputNode(n),this.addOutputNode(h),this._mode=N.a.PostProcess}setToDefaultProceduralTexture(){this.clear(),this.editorData=null;const e=new b.S("Position");e.setAsAttribute("position2d");const t=new b.S("Constant1");t.isConstant=!0,t.value=1;const i=new D.t("Position3D");e.connectTo(i),t.connectTo(i,{input:"w"});const n=new y.t("VertexOutput");i.connectTo(n);const s=new b.S("Time");s.value=0,s.min=0,s.max=0,s.isBoolean=!1,s.matrixMode=0,s.animationType=k.c.Time,s.isConstant=!1;const r=new b.S("Color3");r.value=new a.Wo(1,1,1),r.isConstant=!1;const o=new x.g("FragmentOutput"),l=new D.t("VectorMerger");l.visibleInInspector=!1;const h=new G.S("Cos");h.operation=G.p.Cos,e.connectTo(l),s.output.connectTo(h.input),h.output.connectTo(l.z),l.xyzOut.connectTo(o.rgb),this.addOutputNode(n),this.addOutputNode(o),this._mode=N.a.ProceduralTexture}setToDefaultParticle(){this.clear(),this.editorData=null;const e=new b.S("uv");e.setAsAttribute("particle_uv");const t=new C.P("ParticleTexture");e.connectTo(t);const i=new b.S("Color");i.setAsAttribute("particle_color");const n=new w.U("Texture * Color");t.connectTo(n),i.connectTo(n);const s=new A.p("ParticleRampGradient");n.connectTo(s);const r=new B.v("ColorSplitter");i.connectTo(r);const o=new P.D("ParticleBlendMultiply");s.connectTo(o),t.connectTo(o,{output:"a"}),r.connectTo(o,{output:"a"});const a=new x.g("FragmentOutput");o.connectTo(a),this.addOutputNode(a),this._mode=N.a.Particle}async loadAsync(e,t=""){return Y.ParseFromFileAsync("",e,this.getScene(),t,!0,this)}_gatherBlocks(e,t){if(-1===t.indexOf(e)){t.push(e);for(const i of e.inputs){const n=i.connectedPoint;if(n){const i=n.ownerBlock;i!==e&&this._gatherBlocks(i,t)}}}}generateCode(){let e=[];const t=[],i=["const","var","let"];for(const e of this._vertexOutputNodes)this._gatherBlocks(e,t);const n=[];for(const e of this._fragmentOutputNodes)this._gatherBlocks(e,n);let s=`var nodeMaterial = new BABYLON.NodeMaterial("${this.name||"node material"}");\r\n`;for(const n of t)n.isInput&&-1===e.indexOf(n)&&(s+=n._dumpCode(i,e));for(const t of n)t.isInput&&-1===e.indexOf(t)&&(s+=t._dumpCode(i,e));e=[],s+="\r\n// Connections\r\n";for(const t of this._vertexOutputNodes)s+=t._dumpCodeForOutputConnections(e);for(const t of this._fragmentOutputNodes)s+=t._dumpCodeForOutputConnections(e);s+="\r\n// Output nodes\r\n";for(const e of this._vertexOutputNodes)s+=`nodeMaterial.addOutputNode(${e._codeVariableName});\r\n`;for(const e of this._fragmentOutputNodes)s+=`nodeMaterial.addOutputNode(${e._codeVariableName});\r\n`;return s+="nodeMaterial.build();\r\n",s}serialize(e){const t=e?{}:S.p4.Serialize(this);t.editorData=JSON.parse(JSON.stringify(this.editorData));let i=[];if(e)i=e;else{t.customType="BABYLON.NodeMaterial",t.outputNodes=[];for(const e of this._vertexOutputNodes)this._gatherBlocks(e,i),t.outputNodes.push(e.uniqueId);for(const e of this._fragmentOutputNodes)this._gatherBlocks(e,i),-1===t.outputNodes.indexOf(e.uniqueId)&&t.outputNodes.push(e.uniqueId)}t.blocks=[];for(const e of i)t.blocks.push(e.serialize());if(!e)for(const e of this.attachedBlocks)-1===i.indexOf(e)&&t.blocks.push(e.serialize());return t}_restoreConnections(e,t,i){for(const n of e.outputs)for(const s of t.blocks){const r=i[s.id];if(r)for(const o of s.inputs)if(i[o.targetBlockId]!==e||o.targetConnectionName!==n.name);else{const e=r.getInputByName(o.inputName);if(!e||e.isConnected)continue;n.connectTo(e,!0),this._restoreConnections(r,t,i)}}}parseSerializedObject(e,t="",i=!1){var n;i||this.clear();const s={};for(const i of e.blocks){const e=(0,T.q)(i.customType);if(e){const n=new e;n._deserialize(i,this.getScene(),t),s[i.id]=n,this.attachedBlocks.push(n)}}for(let t=0;t<e.blocks.length;t++){const n=s[e.blocks[t].id];n&&(n.inputs.length&&!i||this._restoreConnections(n,e,s))}if(e.outputNodes)for(const t of e.outputNodes)this.addOutputNode(s[t]);if(e.locations||e.editorData&&e.editorData.locations){const t=e.locations||e.editorData.locations;for(const e of t)s[e.blockId]&&(e.blockId=s[e.blockId].uniqueId);i&&this.editorData&&this.editorData.locations&&t.concat(this.editorData.locations),e.locations?this.editorData={locations:t}:(this.editorData=e.editorData,this.editorData.locations=t);const n=[];for(const e in s)n[e]=s[e].uniqueId;this.editorData.map=n}this.comment=e.comment,void 0!==e.forceAlphaBlending&&(this.forceAlphaBlending=e.forceAlphaBlending),i||(this._mode=null!==(n=e.mode)&&void 0!==n?n:N.a.Material)}loadFromSerialization(e,t="",i=!1){this.parseSerializedObject(e,t,i)}clone(e,t=!1){const i=this.serialize(),n=S.p4.Clone((()=>new Y(e,this.getScene(),this.options)),this);return n.id=e,n.name=e,n.parseSerializedObject(i),n._buildId=this._buildId,n.build(!1,!t),n}static Parse(e,t,i=""){const n=S.p4.Parse((()=>new Y(e.name,t)),e,t,i);return n.parseSerializedObject(e,i),n.build(),n}static async ParseFromFileAsync(e,t,i,n="",s=!1,r){const o=null!=r?r:new Y(e,i),a=await i._loadFileAsync(t),l=JSON.parse(a);return o.parseSerializedObject(l,n),s||o.build(),o}static ParseFromSnippetAsync(e,t=W.l.LastCreatedScene,i="",n,s=!1){return"_BLANK"===e?Promise.resolve(Y.CreateDefault("blank",t)):new Promise(((r,o)=>{const a=new M.g;a.addEventListener("readystatechange",(()=>{if(4==a.readyState)if(200==a.status){const l=JSON.parse(JSON.parse(a.responseText).jsonPayload),h=JSON.parse(l.nodeMaterial);n||((n=S.p4.Parse((()=>new Y(e,t)),h,t,i)).uniqueId=t.getUniqueId()),n.parseSerializedObject(h),n.snippetId=e;try{s||n.build(),r(n)}catch(e){o(e)}}else o("Unable to load the snippet "+e)})),a.open("GET",this.SnippetUrl+"/"+e.replace(/#/g,"/")),a.send()}))}static CreateDefault(e,t){const i=new Y(e,t);return i.setToDefault(),i.build(),i}}Y._BuildIdGenerator=0,Y.EditorURL=`https://unpkg.com/babylonjs-node-editor@${l.D.Version}/babylon.nodeEditor.js`,Y.SnippetUrl="https://snippet.babylonjs.com",Y.IgnoreTexturesAtLoadTime=!1,(0,n.gn)([(0,S.qC)()],Y.prototype,"ignoreAlpha",void 0),(0,n.gn)([(0,S.qC)()],Y.prototype,"maxSimultaneousLights",void 0),(0,n.gn)([(0,S.qC)("mode")],Y.prototype,"_mode",void 0),(0,n.gn)([(0,S.qC)("comment")],Y.prototype,"comment",void 0),(0,n.gn)([(0,S.qC)()],Y.prototype,"forceAlphaBlending",void 0),(0,T.H)("BABYLON.NodeMaterial",Y)},468:(e,t,i)=>{i.d(t,{k:()=>l});var n=i(3837),s=i(8660),r=i(4767),o=i(8718),a=i(2208);class l{get name(){return this._name}set name(e){this.validateBlockName(e)&&(this._name=e)}get isUnique(){return this._isUnique}get isFinalMerger(){return this._isFinalMerger}get isInput(){return this._isInput}get buildId(){return this._buildId}set buildId(e){this._buildId=e}get target(){return this._target}set target(e){0==(this._target&e)&&(this._target=e)}get inputs(){return this._inputs}get outputs(){return this._outputs}getInputByName(e){const t=this._inputs.filter((t=>t.name===e));return t.length?t[0]:null}getOutputByName(e){const t=this._outputs.filter((t=>t.name===e));return t.length?t[0]:null}constructor(e,t=r.u.Vertex,i=!1,n=!1){this._isFinalMerger=!1,this._isInput=!1,this._name="",this._isUnique=!1,this.inputsAreExclusive=!1,this._codeVariableName="",this._inputs=new Array,this._outputs=new Array,this.comments="",this.visibleInInspector=!1,this.visibleOnFrame=!1,this._target=t,this._originalTargetIsNeutral=t===r.u.Neutral,this._isFinalMerger=i,this._isInput=n,this._name=e,this.uniqueId=o.K.UniqueId}_setInitialTarget(e){this._target=e,this._originalTargetIsNeutral=e===r.u.Neutral}initialize(e){}bind(e,t,i,n){}_declareOutput(e,t){return`${t._getGLType(e.type)} ${e.associatedVariableName}`}_writeVariable(e){return e.connectedPoint?`${e.associatedVariableName}`:"0."}_writeFloat(e){let t=e.toString();return-1===t.indexOf(".")&&(t+=".0"),`${t}`}getClassName(){return"NodeMaterialBlock"}registerInput(e,t,i=!1,n,r){return(r=null!=r?r:new s.VT(e,this,s.Ab.Input)).type=t,r.isOptional=i,n&&(r.target=n),this._inputs.push(r),this}registerOutput(e,t,i,n){return(n=null!=n?n:new s.VT(e,this,s.Ab.Output)).type=t,i&&(n.target=i),this._outputs.push(n),this}getFirstAvailableInput(e=null){for(const t of this._inputs)if(!(t.connectedPoint||e&&e.type!==t.type&&t.type!==n.E.AutoDetect))return t;return null}getFirstAvailableOutput(e=null){for(const t of this._outputs)if(!e||!e.target||e.target===r.u.Neutral||0!=(e.target&t.target))return t;return null}getSiblingOutput(e){const t=this._outputs.indexOf(e);return-1===t||t>=this._outputs.length?null:this._outputs[t+1]}isAnAncestorOf(e){for(const t of this._outputs)if(t.hasEndpoints)for(const i of t.endpoints){if(i.ownerBlock===e)return!0;if(i.ownerBlock.isAnAncestorOf(e))return!0}return!1}connectTo(e,t){if(0===this._outputs.length)return;let i=t&&t.output?this.getOutputByName(t.output):this.getFirstAvailableOutput(e),n=!0;for(;n;){const s=t&&t.input?e.getInputByName(t.input):e.getFirstAvailableInput(i);if(i&&s&&i.canConnectTo(s))i.connectTo(s),n=!1;else{if(!i)throw"Unable to find a compatible match";i=this.getSiblingOutput(i)}}return this}_buildBlock(e){}updateUniformsAndSamples(e,t,i,n){}provideFallbacks(e,t){}initializeDefines(e,t,i,n=!1){}prepareDefines(e,t,i,n=!1,s){}autoConfigure(e){}replaceRepeatableContent(e,t,i,n){}get willBeGeneratedIntoVertexShaderFromFragmentShader(){return!(this.isInput||this.isFinalMerger||this._outputs.some((e=>e.isDirectlyConnectedToVertexOutput))||this.target===r.u.Vertex||this.target!==r.u.VertexAndFragment&&this.target!==r.u.Neutral||!this._outputs.some((e=>e.isConnectedInVertexShader)))}isReady(e,t,i,n=!1){return!0}_linkConnectionTypes(e,t,i=!1){i?this._inputs[t]._acceptedConnectionPointType=this._inputs[e]:this._inputs[e]._linkedConnectionSource=this._inputs[t],this._inputs[t]._linkedConnectionSource=this._inputs[e]}_processBuild(e,t,i,n){e.build(t,n);const s=null!=t._vertexState,o=e._buildTarget===r.u.Vertex&&e.target!==r.u.VertexAndFragment;if(s&&(0==(e.target&e._buildTarget)||0==(e.target&i.target)||this.target!==r.u.VertexAndFragment&&o)&&(!e.isInput&&t.target!==e._buildTarget||e.isInput&&e.isAttribute&&!e._noContextSwitch)){const e=i.connectedPoint;t._vertexState._emitVaryingFromString("v_"+e.associatedVariableName,t._getGLType(e.type))&&(t._vertexState.compilationString+=`${"v_"+e.associatedVariableName} = ${e.associatedVariableName};\r\n`),i.associatedVariableName="v_"+e.associatedVariableName,i._enforceAssociatedVariableName=!0}}validateBlockName(e){const t=["position","normal","tangent","particle_positionw","uv","uv2","uv3","uv4","uv5","uv6","position2d","particle_uv","matricesIndices","matricesWeights","world0","world1","world2","world3","particle_color","particle_texturemask"];for(const i of t)if(e===i)return!1;return!0}build(e,t){if(this._buildId===e.sharedData.buildId)return!0;if(!this.isInput)for(const t of this._outputs)t.associatedVariableName||(t.associatedVariableName=e._getFreeVariableName(t.name));for(const i of this._inputs){if(!i.connectedPoint){i.isOptional||e.sharedData.checks.notConnectedNonOptionalInputs.push(i);continue}if(this.target!==r.u.Neutral){if(0==(i.target&this.target))continue;if(0==(i.target&e.target))continue}const n=i.connectedPoint.ownerBlock;n&&n!==this&&this._processBuild(n,e,i,t)}if(this._buildId===e.sharedData.buildId)return!0;if(e.sharedData.verbose&&console.log(`${e.target===r.u.Vertex?"Vertex shader":"Fragment shader"}: Building ${this.name} [${this.getClassName()}]`),this.isFinalMerger)switch(e.target){case r.u.Vertex:e.sharedData.checks.emitVertex=!0;break;case r.u.Fragment:e.sharedData.checks.emitFragment=!0}!this.isInput&&e.sharedData.emitComments&&(e.compilationString+=`\r\n//${this.name}\r\n`),this._buildBlock(e),this._buildId=e.sharedData.buildId,this._buildTarget=e.target;for(const i of this._outputs)if(0!=(i.target&e.target))for(const n of i.endpoints){const i=n.ownerBlock;i&&0!=(i.target&e.target)&&-1!==t.indexOf(i)&&this._processBuild(i,e,n,t)}return!1}_inputRename(e){return e}_outputRename(e){return e}_dumpPropertiesCode(){const e=this._codeVariableName;return`${e}.visibleInInspector = ${this.visibleInInspector};\r\n${e}.visibleOnFrame = ${this.visibleOnFrame};\r\n${e}.target = ${this.target};\r\n`}_dumpCode(e,t){let i;t.push(this);const n=this.name.replace(/[^A-Za-z_]+/g,"");if(this._codeVariableName=n||`${this.getClassName()}_${this.uniqueId}`,-1!==e.indexOf(this._codeVariableName)){let t=0;do{t++,this._codeVariableName=n+t}while(-1!==e.indexOf(this._codeVariableName))}e.push(this._codeVariableName),i=`\r\n// ${this.getClassName()}\r\n`,this.comments&&(i+=`// ${this.comments}\r\n`),i+=`var ${this._codeVariableName} = new BABYLON.${this.getClassName()}("${this.name}");\r\n`,i+=this._dumpPropertiesCode();for(const n of this.inputs){if(!n.isConnected)continue;const s=n.connectedPoint.ownerBlock;-1===t.indexOf(s)&&(i+=s._dumpCode(e,t))}for(const n of this.outputs)if(n.hasEndpoints)for(const s of n.endpoints){const n=s.ownerBlock;n&&-1===t.indexOf(n)&&(i+=n._dumpCode(e,t))}return i}_dumpCodeForOutputConnections(e){let t="";if(-1!==e.indexOf(this))return t;e.push(this);for(const i of this.inputs){if(!i.isConnected)continue;const n=i.connectedPoint,s=n.ownerBlock;t+=s._dumpCodeForOutputConnections(e),t+=`${s._codeVariableName}.${s._outputRename(n.name)}.connectTo(${this._codeVariableName}.${this._inputRename(i.name)});\r\n`}return t}clone(e,t=""){const i=this.serialize(),n=(0,a.q)(i.customType);if(n){const s=new n;return s._deserialize(i,e,t),s}return null}serialize(){const e={};e.customType="BABYLON."+this.getClassName(),e.id=this.uniqueId,e.name=this.name,e.comments=this.comments,e.visibleInInspector=this.visibleInInspector,e.visibleOnFrame=this.visibleOnFrame,e.target=this.target,e.inputs=[],e.outputs=[];for(const t of this.inputs)e.inputs.push(t.serialize());for(const t of this.outputs)e.outputs.push(t.serialize(!1));return e}_deserialize(e,t,i){var n;this.name=e.name,this.comments=e.comments,this.visibleInInspector=!!e.visibleInInspector,this.visibleOnFrame=!!e.visibleOnFrame,this._target=null!==(n=e.target)&&void 0!==n?n:this.target,this._deserializePortDisplayNamesAndExposedOnFrame(e)}_deserializePortDisplayNamesAndExposedOnFrame(e){const t=e.inputs,i=e.outputs;t&&t.forEach(((e,t)=>{e.displayName&&(this.inputs[t].displayName=e.displayName),e.isExposedOnFrame&&(this.inputs[t].isExposedOnFrame=e.isExposedOnFrame,this.inputs[t].exposedPortPosition=e.exposedPortPosition)})),i&&i.forEach(((e,t)=>{e.displayName&&(this.outputs[t].displayName=e.displayName),e.isExposedOnFrame&&(this.outputs[t].isExposedOnFrame=e.isExposedOnFrame,this.outputs[t].exposedPortPosition=e.exposedPortPosition)}))}dispose(){for(const e of this.inputs)e.dispose();for(const e of this.outputs)e.dispose()}}},8660:(e,t,i)=>{i.d(t,{Ab:()=>s,VT:()=>l,WS:()=>n});var n,s,r=i(3837),o=i(4767),a=i(5757);!function(e){e[e.Compatible=0]="Compatible",e[e.TypeIncompatible=1]="TypeIncompatible",e[e.TargetIncompatible=2]="TargetIncompatible",e[e.HierarchyIssue=3]="HierarchyIssue"}(n||(n={})),function(e){e[e.Input=0]="Input",e[e.Output=1]="Output"}(s||(s={}));class l{static AreEquivalentTypes(e,t){switch(e){case r.E.Vector3:if(t===r.E.Color3)return!0;break;case r.E.Vector4:if(t===r.E.Color4)return!0;break;case r.E.Color3:if(t===r.E.Vector3)return!0;break;case r.E.Color4:if(t===r.E.Vector4)return!0}return!1}get direction(){return this._direction}get associatedVariableName(){return this._ownerBlock.isInput?this._ownerBlock.associatedVariableName:this._enforceAssociatedVariableName&&this._associatedVariableName||!this._connectedPoint?this._associatedVariableName:this._connectedPoint.associatedVariableName}set associatedVariableName(e){this._associatedVariableName=e}get innerType(){return this._linkedConnectionSource&&this._linkedConnectionSource.isConnected?this.type:this._type}get type(){if(this._type===r.E.AutoDetect){if(this._ownerBlock.isInput)return this._ownerBlock.type;if(this._connectedPoint)return this._connectedPoint.type;if(this._linkedConnectionSource&&this._linkedConnectionSource.isConnected)return this._linkedConnectionSource.type}if(this._type===r.E.BasedOnInput){if(this._typeConnectionSource)return!this._typeConnectionSource.isConnected&&this._defaultConnectionPointType?this._defaultConnectionPointType:this._typeConnectionSource.type;if(this._defaultConnectionPointType)return this._defaultConnectionPointType}return this._type}set type(e){this._type=e}get target(){return this._prioritizeVertex&&this._ownerBlock?this._target!==o.u.VertexAndFragment?this._target:this._ownerBlock.target===o.u.Fragment?o.u.Fragment:o.u.Vertex:this._target}set target(e){this._target=e}get isConnected(){return null!==this.connectedPoint||this.hasEndpoints}get isConnectedToInputBlock(){return null!==this.connectedPoint&&this.connectedPoint.ownerBlock.isInput}get connectInputBlock(){return this.isConnectedToInputBlock?this.connectedPoint.ownerBlock:null}get connectedPoint(){return this._connectedPoint}get ownerBlock(){return this._ownerBlock}get sourceBlock(){return this._connectedPoint?this._connectedPoint.ownerBlock:null}get connectedBlocks(){return 0===this._endpoints.length?[]:this._endpoints.map((e=>e.ownerBlock))}get endpoints(){return this._endpoints}get hasEndpoints(){return this._endpoints&&this._endpoints.length>0}get isDirectlyConnectedToVertexOutput(){if(!this.hasEndpoints)return!1;for(const e of this._endpoints){if(e.ownerBlock.target===o.u.Vertex)return!0;if((e.ownerBlock.target===o.u.Neutral||e.ownerBlock.target===o.u.VertexAndFragment)&&e.ownerBlock.outputs.some((e=>e.isDirectlyConnectedToVertexOutput)))return!0}return!1}get isConnectedInVertexShader(){if(this.target===o.u.Vertex)return!0;if(!this.hasEndpoints)return!1;for(const e of this._endpoints){if(e.ownerBlock.target===o.u.Vertex)return!0;if(e.target===o.u.Vertex)return!0;if((e.ownerBlock.target===o.u.Neutral||e.ownerBlock.target===o.u.VertexAndFragment)&&e.ownerBlock.outputs.some((e=>e.isConnectedInVertexShader)))return!0}return!1}get isConnectedInFragmentShader(){if(this.target===o.u.Fragment)return!0;if(!this.hasEndpoints)return!1;for(const e of this._endpoints){if(e.ownerBlock.target===o.u.Fragment)return!0;if((e.ownerBlock.target===o.u.Neutral||e.ownerBlock.target===o.u.VertexAndFragment)&&e.ownerBlock.outputs.some((e=>e.isConnectedInFragmentShader)))return!0}return!1}createCustomInputBlock(){return null}constructor(e,t,i){this._connectedPoint=null,this._endpoints=new Array,this._typeConnectionSource=null,this._defaultConnectionPointType=null,this._linkedConnectionSource=null,this._acceptedConnectionPointType=null,this._type=r.E.Float,this._enforceAssociatedVariableName=!1,this.needDualDirectionValidation=!1,this.acceptedConnectionPointTypes=new Array,this.excludedConnectionPointTypes=new Array,this.onConnectionObservable=new a.y$,this.isExposedOnFrame=!1,this.exposedPortPosition=-1,this._prioritizeVertex=!1,this._target=o.u.VertexAndFragment,this._ownerBlock=t,this.name=e,this._direction=i}getClassName(){return"NodeMaterialConnectionPoint"}canConnectTo(e){return this.checkCompatibilityState(e)===n.Compatible}checkCompatibilityState(e){const t=this._ownerBlock,i=e.ownerBlock;if(t.target===o.u.Fragment){if(i.target===o.u.Vertex)return n.TargetIncompatible;for(const e of i.outputs)if(e.ownerBlock.target!=o.u.Neutral&&e.isConnectedInVertexShader)return n.TargetIncompatible}if(this.type!==e.type&&e.innerType!==r.E.AutoDetect)return l.AreEquivalentTypes(this.type,e.type)||e.acceptedConnectionPointTypes&&-1!==e.acceptedConnectionPointTypes.indexOf(this.type)||e._acceptedConnectionPointType&&l.AreEquivalentTypes(e._acceptedConnectionPointType.type,this.type)?n.Compatible:n.TypeIncompatible;if(e.excludedConnectionPointTypes&&-1!==e.excludedConnectionPointTypes.indexOf(this.type))return n.TypeIncompatible;let a=i,h=t;return this.direction===s.Input&&(a=t,h=i),a.isAnAncestorOf(h)?n.HierarchyIssue:n.Compatible}connectTo(e,t=!1){if(!t&&!this.canConnectTo(e))throw"Cannot connect these two connectors.";return this._endpoints.push(e),e._connectedPoint=this,this._enforceAssociatedVariableName=!1,this.onConnectionObservable.notifyObservers(e),e.onConnectionObservable.notifyObservers(this),this}disconnectFrom(e){const t=this._endpoints.indexOf(e);return-1===t||(this._endpoints.splice(t,1),e._connectedPoint=null,this._enforceAssociatedVariableName=!1,e._enforceAssociatedVariableName=!1),this}addExcludedConnectionPointFromAllowedTypes(e){let t=1;for(;t<r.E.All;)e&t||this.excludedConnectionPointTypes.push(t),t<<=1}serialize(e=!0){const t={};return t.name=this.name,t.displayName=this.displayName,e&&this.connectedPoint&&(t.inputName=this.name,t.targetBlockId=this.connectedPoint.ownerBlock.uniqueId,t.targetConnectionName=this.connectedPoint.name,t.isExposedOnFrame=!0,t.exposedPortPosition=this.exposedPortPosition),(this.isExposedOnFrame||this.exposedPortPosition>=0)&&(t.isExposedOnFrame=!0,t.exposedPortPosition=this.exposedPortPosition),t}dispose(){this.onConnectionObservable.clear()}}},9749:(e,t,i)=>{var n;function s(e,t=n.Boolean,i="PROPERTIES",s){return(n,r)=>{let o=n._propStore;o||(o=[],n._propStore=o),o.push({propertyName:r,displayName:e,type:t,groupName:i,options:null!=s?s:{}})}}i.d(t,{U:()=>n,p:()=>s}),function(e){e[e.Boolean=0]="Boolean",e[e.Float=1]="Float",e[e.Int=2]="Int",e[e.Vector2=3]="Vector2",e[e.List=4]="List"}(n||(n={}))},9482:(e,t,i)=>{i.d(t,{i:()=>u,u:()=>d});var n=i(9472),s=i(3956),r=i(708),o=i(4141),a=i(85),l=i(5346),h=i(8449),c=i(1917);class u extends c.H{constructor(){super(...arguments),this.ANISOTROPIC=!1,this.ANISOTROPIC_TEXTURE=!1,this.ANISOTROPIC_TEXTUREDIRECTUV=0,this.MAINUV1=!1}}class d extends h.n{_markAllSubMeshesAsTexturesDirty(){this._enable(this._isEnabled),this._internalMarkAllSubMeshesAsTexturesDirty()}constructor(e,t=!0){super(e,"PBRAnisotropic",110,new u,t),this._isEnabled=!1,this.isEnabled=!1,this.intensity=1,this.direction=new o.FM(1,0),this._texture=null,this.texture=null,this._internalMarkAllSubMeshesAsTexturesDirty=e._dirtyCallbacks[1]}isReadyForSubMesh(e,t){return!this._isEnabled||!(e._areTexturesDirty&&t.texturesEnabled&&this._texture&&a.k.AnisotropicTextureEnabled&&!this._texture.isReadyOrNotBlocking())}prepareDefinesBeforeAttributes(e,t,i){this._isEnabled?(e.ANISOTROPIC=this._isEnabled,this._isEnabled&&!i.isVerticesDataPresent(r.o.TangentKind)&&(e._needUVs=!0,e.MAINUV1=!0),e._areTexturesDirty&&t.texturesEnabled&&(this._texture&&a.k.AnisotropicTextureEnabled?l.G.PrepareDefinesForMergedUV(this._texture,e,"ANISOTROPIC_TEXTURE"):e.ANISOTROPIC_TEXTURE=!1)):(e.ANISOTROPIC=!1,e.ANISOTROPIC_TEXTURE=!1,e.ANISOTROPIC_TEXTUREDIRECTUV=0)}bindForSubMesh(e,t){if(!this._isEnabled)return;const i=this._material.isFrozen;e.useUbo&&i&&e.isSync||(this._texture&&a.k.AnisotropicTextureEnabled&&(e.updateFloat2("vAnisotropyInfos",this._texture.coordinatesIndex,this._texture.level),l.G.BindTextureMatrix(this._texture,e,"anisotropy")),e.updateFloat3("vAnisotropy",this.direction.x,this.direction.y,this.intensity)),t.texturesEnabled&&this._texture&&a.k.AnisotropicTextureEnabled&&e.setTexture("anisotropySampler",this._texture)}hasTexture(e){return this._texture===e}getActiveTextures(e){this._texture&&e.push(this._texture)}getAnimatables(e){this._texture&&this._texture.animations&&this._texture.animations.length>0&&e.push(this._texture)}dispose(e){e&&this._texture&&this._texture.dispose()}getClassName(){return"PBRAnisotropicConfiguration"}addFallbacks(e,t,i){return e.ANISOTROPIC&&t.addFallback(i++,"ANISOTROPIC"),i}getSamplers(e){e.push("anisotropySampler")}getUniforms(){return{ubo:[{name:"vAnisotropy",size:3,type:"vec3"},{name:"vAnisotropyInfos",size:2,type:"vec2"},{name:"anisotropyMatrix",size:16,type:"mat4"}]}}}(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],d.prototype,"isEnabled",void 0),(0,n.gn)([(0,s.qC)()],d.prototype,"intensity",void 0),(0,n.gn)([(0,s.QC)()],d.prototype,"direction",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],d.prototype,"texture",void 0)},1444:(e,t,i)=>{i.d(t,{d:()=>l});var n=i(9472),s=i(3956),r=i(1917),o=i(8449);class a extends r.H{constructor(){super(...arguments),this.BRDF_V_HEIGHT_CORRELATED=!1,this.MS_BRDF_ENERGY_CONSERVATION=!1,this.SPHERICAL_HARMONICS=!1,this.SPECULAR_GLOSSINESS_ENERGY_CONSERVATION=!1}}class l extends o.n{_markAllSubMeshesAsMiscDirty(){this._internalMarkAllSubMeshesAsMiscDirty()}constructor(e,t=!0){super(e,"PBRBRDF",90,new a,t),this._useEnergyConservation=l.DEFAULT_USE_ENERGY_CONSERVATION,this.useEnergyConservation=l.DEFAULT_USE_ENERGY_CONSERVATION,this._useSmithVisibilityHeightCorrelated=l.DEFAULT_USE_SMITH_VISIBILITY_HEIGHT_CORRELATED,this.useSmithVisibilityHeightCorrelated=l.DEFAULT_USE_SMITH_VISIBILITY_HEIGHT_CORRELATED,this._useSphericalHarmonics=l.DEFAULT_USE_SPHERICAL_HARMONICS,this.useSphericalHarmonics=l.DEFAULT_USE_SPHERICAL_HARMONICS,this._useSpecularGlossinessInputEnergyConservation=l.DEFAULT_USE_SPECULAR_GLOSSINESS_INPUT_ENERGY_CONSERVATION,this.useSpecularGlossinessInputEnergyConservation=l.DEFAULT_USE_SPECULAR_GLOSSINESS_INPUT_ENERGY_CONSERVATION,this._internalMarkAllSubMeshesAsMiscDirty=e._dirtyCallbacks[16],this._enable(!0)}prepareDefines(e){e.BRDF_V_HEIGHT_CORRELATED=this._useSmithVisibilityHeightCorrelated,e.MS_BRDF_ENERGY_CONSERVATION=this._useEnergyConservation&&this._useSmithVisibilityHeightCorrelated,e.SPHERICAL_HARMONICS=this._useSphericalHarmonics,e.SPECULAR_GLOSSINESS_ENERGY_CONSERVATION=this._useSpecularGlossinessInputEnergyConservation}getClassName(){return"PBRBRDFConfiguration"}}l.DEFAULT_USE_ENERGY_CONSERVATION=!0,l.DEFAULT_USE_SMITH_VISIBILITY_HEIGHT_CORRELATED=!0,l.DEFAULT_USE_SPHERICAL_HARMONICS=!0,l.DEFAULT_USE_SPECULAR_GLOSSINESS_INPUT_ENERGY_CONSERVATION=!0,(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsMiscDirty")],l.prototype,"useEnergyConservation",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsMiscDirty")],l.prototype,"useSmithVisibilityHeightCorrelated",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsMiscDirty")],l.prototype,"useSphericalHarmonics",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsMiscDirty")],l.prototype,"useSpecularGlossinessInputEnergyConservation",void 0)},5843:(e,t,i)=>{i.d(t,{m:()=>N,r:()=>w});var n=i(9472),s=i(3956),r=i(2722),o=i(5363),a=i(6344),l=i(1057),h=i(4141),c=i(708),u=i(1444),d=i(178),p=i(4649),f=i(1128),_=i(4475),m=i(7104),g=i(1698),v=i(1917),y=i(580),x=i(5346),b=i(2262),T=i(85),S=(i(452),i(8104));i(8190),i(1868),i(3055);S.v.IncludesShadersStore.pbrFragmentDeclaration="uniform vec4 vEyePosition;\nuniform vec3 vReflectionColor;\nuniform vec4 vAlbedoColor;\nuniform vec4 vLightingIntensity;\nuniform vec4 vReflectivityColor;\nuniform vec4 vMetallicReflectanceFactors;\nuniform vec3 vEmissiveColor;\nuniform float visibility;\nuniform vec3 vAmbientColor;\n#ifdef ALBEDO\nuniform vec2 vAlbedoInfos;\n#endif\n#ifdef AMBIENT\nuniform vec4 vAmbientInfos;\n#endif\n#ifdef BUMP\nuniform vec3 vBumpInfos;\nuniform vec2 vTangentSpaceParams;\n#endif\n#ifdef OPACITY\nuniform vec2 vOpacityInfos;\n#endif\n#ifdef EMISSIVE\nuniform vec2 vEmissiveInfos;\n#endif\n#ifdef LIGHTMAP\nuniform vec2 vLightmapInfos;\n#endif\n#ifdef REFLECTIVITY\nuniform vec3 vReflectivityInfos;\n#endif\n#ifdef MICROSURFACEMAP\nuniform vec2 vMicroSurfaceSamplerInfos;\n#endif\n#if defined(REFLECTIONMAP_SPHERICAL) || defined(REFLECTIONMAP_PROJECTION) || defined(SS_REFRACTION) || defined(PREPASS)\nuniform mat4 view;\n#endif\n#ifdef REFLECTION\nuniform vec2 vReflectionInfos;\n#ifdef REALTIME_FILTERING\nuniform vec2 vReflectionFilteringInfo;\n#endif\nuniform mat4 reflectionMatrix;\nuniform vec3 vReflectionMicrosurfaceInfos;\n#if defined(USE_LOCAL_REFLECTIONMAP_CUBIC) && defined(REFLECTIONMAP_CUBIC)\nuniform vec3 vReflectionPosition;\nuniform vec3 vReflectionSize; \n#endif\n#endif\n#if defined(SS_REFRACTION) && defined(SS_USE_LOCAL_REFRACTIONMAP_CUBIC)\nuniform vec3 vRefractionPosition;\nuniform vec3 vRefractionSize; \n#endif\n#ifdef CLEARCOAT\nuniform vec2 vClearCoatParams;\nuniform vec4 vClearCoatRefractionParams;\n#if defined(CLEARCOAT_TEXTURE) || defined(CLEARCOAT_TEXTURE_ROUGHNESS)\nuniform vec4 vClearCoatInfos;\n#endif\n#ifdef CLEARCOAT_TEXTURE\nuniform mat4 clearCoatMatrix;\n#endif\n#ifdef CLEARCOAT_TEXTURE_ROUGHNESS\nuniform mat4 clearCoatRoughnessMatrix;\n#endif\n#ifdef CLEARCOAT_BUMP\nuniform vec2 vClearCoatBumpInfos;\nuniform vec2 vClearCoatTangentSpaceParams;\nuniform mat4 clearCoatBumpMatrix;\n#endif\n#ifdef CLEARCOAT_TINT\nuniform vec4 vClearCoatTintParams;\nuniform float clearCoatColorAtDistance;\n#ifdef CLEARCOAT_TINT_TEXTURE\nuniform vec2 vClearCoatTintInfos;\nuniform mat4 clearCoatTintMatrix;\n#endif\n#endif\n#endif\n#ifdef IRIDESCENCE\nuniform vec4 vIridescenceParams;\n#if defined(IRIDESCENCE_TEXTURE) || defined(IRIDESCENCE_THICKNESS_TEXTURE)\nuniform vec4 vIridescenceInfos;\n#endif\n#ifdef IRIDESCENCE_TEXTURE\nuniform mat4 iridescenceMatrix;\n#endif\n#ifdef IRIDESCENCE_THICKNESS_TEXTURE\nuniform mat4 iridescenceThicknessMatrix;\n#endif\n#endif\n#ifdef ANISOTROPIC\nuniform vec3 vAnisotropy;\n#ifdef ANISOTROPIC_TEXTURE\nuniform vec2 vAnisotropyInfos;\nuniform mat4 anisotropyMatrix;\n#endif\n#endif\n#ifdef SHEEN\nuniform vec4 vSheenColor;\n#ifdef SHEEN_ROUGHNESS\nuniform float vSheenRoughness;\n#endif\n#if defined(SHEEN_TEXTURE) || defined(SHEEN_TEXTURE_ROUGHNESS)\nuniform vec4 vSheenInfos;\n#endif\n#ifdef SHEEN_TEXTURE\nuniform mat4 sheenMatrix;\n#endif\n#ifdef SHEEN_TEXTURE_ROUGHNESS\nuniform mat4 sheenRoughnessMatrix;\n#endif\n#endif\n#ifdef SUBSURFACE\n#ifdef SS_REFRACTION\nuniform vec4 vRefractionMicrosurfaceInfos;\nuniform vec4 vRefractionInfos;\nuniform mat4 refractionMatrix;\n#ifdef REALTIME_FILTERING\nuniform vec2 vRefractionFilteringInfo;\n#endif\n#endif\n#ifdef SS_THICKNESSANDMASK_TEXTURE\nuniform vec2 vThicknessInfos;\nuniform mat4 thicknessMatrix;\n#endif\n#ifdef SS_REFRACTIONINTENSITY_TEXTURE\nuniform vec2 vRefractionIntensityInfos;\nuniform mat4 refractionIntensityMatrix;\n#endif\n#ifdef SS_TRANSLUCENCYINTENSITY_TEXTURE\nuniform vec2 vTranslucencyIntensityInfos;\nuniform mat4 translucencyIntensityMatrix;\n#endif\nuniform vec2 vThicknessParam;\nuniform vec3 vDiffusionDistance;\nuniform vec4 vTintColor;\nuniform vec3 vSubSurfaceIntensity;\n#endif\n#ifdef PREPASS\n#ifdef SS_SCATTERING\nuniform float scatteringDiffusionProfile;\n#endif\n#endif\n#if DEBUGMODE>0\nuniform vec2 vDebugMode;\n#endif\n#ifdef DETAIL\nuniform vec4 vDetailInfos;\n#endif\n#include<decalFragmentDeclaration>\n#ifdef USESPHERICALFROMREFLECTIONMAP\n#ifdef SPHERICAL_HARMONICS\nuniform vec3 vSphericalL00;\nuniform vec3 vSphericalL1_1;\nuniform vec3 vSphericalL10;\nuniform vec3 vSphericalL11;\nuniform vec3 vSphericalL2_2;\nuniform vec3 vSphericalL2_1;\nuniform vec3 vSphericalL20;\nuniform vec3 vSphericalL21;\nuniform vec3 vSphericalL22;\n#else\nuniform vec3 vSphericalX;\nuniform vec3 vSphericalY;\nuniform vec3 vSphericalZ;\nuniform vec3 vSphericalXX_ZZ;\nuniform vec3 vSphericalYY_ZZ;\nuniform vec3 vSphericalZZ;\nuniform vec3 vSphericalXY;\nuniform vec3 vSphericalYZ;\nuniform vec3 vSphericalZX;\n#endif\n#endif\n#define ADDITIONAL_FRAGMENT_DECLARATION\n",i(2963),i(4804);S.v.IncludesShadersStore.pbrUboDeclaration="layout(std140,column_major) uniform;\nuniform Material {\nvec2 vAlbedoInfos;\nvec4 vAmbientInfos;\nvec2 vOpacityInfos;\nvec2 vEmissiveInfos;\nvec2 vLightmapInfos;\nvec3 vReflectivityInfos;\nvec2 vMicroSurfaceSamplerInfos;\nvec2 vReflectionInfos;\nvec2 vReflectionFilteringInfo;\nvec3 vReflectionPosition;\nvec3 vReflectionSize;\nvec3 vBumpInfos;\nmat4 albedoMatrix;\nmat4 ambientMatrix;\nmat4 opacityMatrix;\nmat4 emissiveMatrix;\nmat4 lightmapMatrix;\nmat4 reflectivityMatrix;\nmat4 microSurfaceSamplerMatrix;\nmat4 bumpMatrix;\nvec2 vTangentSpaceParams;\nmat4 reflectionMatrix;\nvec3 vReflectionColor;\nvec4 vAlbedoColor;\nvec4 vLightingIntensity;\nvec3 vReflectionMicrosurfaceInfos;\nfloat pointSize;\nvec4 vReflectivityColor;\nvec3 vEmissiveColor;\nvec3 vAmbientColor;\nvec2 vDebugMode;\nvec4 vMetallicReflectanceFactors;\nvec2 vMetallicReflectanceInfos;\nmat4 metallicReflectanceMatrix;\nvec2 vReflectanceInfos;\nmat4 reflectanceMatrix;\nvec3 vSphericalL00;\nvec3 vSphericalL1_1;\nvec3 vSphericalL10;\nvec3 vSphericalL11;\nvec3 vSphericalL2_2;\nvec3 vSphericalL2_1;\nvec3 vSphericalL20;\nvec3 vSphericalL21;\nvec3 vSphericalL22;\nvec3 vSphericalX;\nvec3 vSphericalY;\nvec3 vSphericalZ;\nvec3 vSphericalXX_ZZ;\nvec3 vSphericalYY_ZZ;\nvec3 vSphericalZZ;\nvec3 vSphericalXY;\nvec3 vSphericalYZ;\nvec3 vSphericalZX;\n#define ADDITIONAL_UBO_DECLARATION\n};\n#include<sceneUboDeclaration>\n#include<meshUboDeclaration>\n",i(6637);S.v.IncludesShadersStore.pbrFragmentExtraDeclaration="varying vec3 vPositionW;\n#if DEBUGMODE>0\nvarying vec4 vClipSpacePosition;\n#endif\n#include<mainUVVaryingDeclaration>[1..7]\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#if defined(USESPHERICALFROMREFLECTIONMAP) && defined(USESPHERICALINVERTEX)\nvarying vec3 vEnvironmentIrradiance;\n#endif\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n",i(2557),i(3756),i(1015);S.v.IncludesShadersStore.samplerFragmentAlternateDeclaration="#ifdef _DEFINENAME_\n#if _DEFINENAME_DIRECTUV==1\n#define v_VARYINGNAME_UV vMainUV1\n#elif _DEFINENAME_DIRECTUV==2\n#define v_VARYINGNAME_UV vMainUV2\n#elif _DEFINENAME_DIRECTUV==3\n#define v_VARYINGNAME_UV vMainUV3\n#elif _DEFINENAME_DIRECTUV==4\n#define v_VARYINGNAME_UV vMainUV4\n#elif _DEFINENAME_DIRECTUV==5\n#define v_VARYINGNAME_UV vMainUV5\n#elif _DEFINENAME_DIRECTUV==6\n#define v_VARYINGNAME_UV vMainUV6\n#else\nvarying vec2 v_VARYINGNAME_UV;\n#endif\n#endif\n";S.v.IncludesShadersStore.pbrFragmentSamplersDeclaration="#include<samplerFragmentDeclaration>(_DEFINENAME_,ALBEDO,_VARYINGNAME_,Albedo,_SAMPLERNAME_,albedo)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,AMBIENT,_VARYINGNAME_,Ambient,_SAMPLERNAME_,ambient)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,OPACITY,_VARYINGNAME_,Opacity,_SAMPLERNAME_,opacity)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,EMISSIVE,_VARYINGNAME_,Emissive,_SAMPLERNAME_,emissive)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,LIGHTMAP,_VARYINGNAME_,Lightmap,_SAMPLERNAME_,lightmap)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,REFLECTIVITY,_VARYINGNAME_,Reflectivity,_SAMPLERNAME_,reflectivity)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,MICROSURFACEMAP,_VARYINGNAME_,MicroSurfaceSampler,_SAMPLERNAME_,microSurface)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,METALLIC_REFLECTANCE,_VARYINGNAME_,MetallicReflectance,_SAMPLERNAME_,metallicReflectance)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,REFLECTANCE,_VARYINGNAME_,Reflectance,_SAMPLERNAME_,reflectance)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,DECAL,_VARYINGNAME_,Decal,_SAMPLERNAME_,decal)\n#ifdef CLEARCOAT\n#include<samplerFragmentDeclaration>(_DEFINENAME_,CLEARCOAT_TEXTURE,_VARYINGNAME_,ClearCoat,_SAMPLERNAME_,clearCoat)\n#include<samplerFragmentAlternateDeclaration>(_DEFINENAME_,CLEARCOAT_TEXTURE_ROUGHNESS,_VARYINGNAME_,ClearCoatRoughness)\n#if defined(CLEARCOAT_TEXTURE_ROUGHNESS) && !defined(CLEARCOAT_TEXTURE_ROUGHNESS_IDENTICAL)\nuniform sampler2D clearCoatRoughnessSampler;\n#endif\n#include<samplerFragmentDeclaration>(_DEFINENAME_,CLEARCOAT_BUMP,_VARYINGNAME_,ClearCoatBump,_SAMPLERNAME_,clearCoatBump)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,CLEARCOAT_TINT_TEXTURE,_VARYINGNAME_,ClearCoatTint,_SAMPLERNAME_,clearCoatTint)\n#endif\n#ifdef IRIDESCENCE\n#include<samplerFragmentDeclaration>(_DEFINENAME_,IRIDESCENCE_TEXTURE,_VARYINGNAME_,Iridescence,_SAMPLERNAME_,iridescence)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,IRIDESCENCE_THICKNESS_TEXTURE,_VARYINGNAME_,IridescenceThickness,_SAMPLERNAME_,iridescenceThickness)\n#endif\n#ifdef SHEEN\n#include<samplerFragmentDeclaration>(_DEFINENAME_,SHEEN_TEXTURE,_VARYINGNAME_,Sheen,_SAMPLERNAME_,sheen)\n#include<samplerFragmentAlternateDeclaration>(_DEFINENAME_,SHEEN_TEXTURE_ROUGHNESS,_VARYINGNAME_,SheenRoughness)\n#if defined(SHEEN_ROUGHNESS) && defined(SHEEN_TEXTURE_ROUGHNESS) && !defined(SHEEN_TEXTURE_ROUGHNESS_IDENTICAL)\nuniform sampler2D sheenRoughnessSampler;\n#endif\n#endif\n#ifdef ANISOTROPIC\n#include<samplerFragmentDeclaration>(_DEFINENAME_,ANISOTROPIC_TEXTURE,_VARYINGNAME_,Anisotropy,_SAMPLERNAME_,anisotropy)\n#endif\n#ifdef REFLECTION\n#ifdef REFLECTIONMAP_3D\n#define sampleReflection(s,c) textureCube(s,c)\nuniform samplerCube reflectionSampler;\n#ifdef LODBASEDMICROSFURACE\n#define sampleReflectionLod(s,c,l) textureCubeLodEXT(s,c,l)\n#else\nuniform samplerCube reflectionSamplerLow;\nuniform samplerCube reflectionSamplerHigh;\n#endif\n#ifdef USEIRRADIANCEMAP\nuniform samplerCube irradianceSampler;\n#endif\n#else\n#define sampleReflection(s,c) texture2D(s,c)\nuniform sampler2D reflectionSampler;\n#ifdef LODBASEDMICROSFURACE\n#define sampleReflectionLod(s,c,l) texture2DLodEXT(s,c,l)\n#else\nuniform sampler2D reflectionSamplerLow;\nuniform sampler2D reflectionSamplerHigh;\n#endif\n#ifdef USEIRRADIANCEMAP\nuniform sampler2D irradianceSampler;\n#endif\n#endif\n#ifdef REFLECTIONMAP_SKYBOX\nvarying vec3 vPositionUVW;\n#else\n#if defined(REFLECTIONMAP_EQUIRECTANGULAR_FIXED) || defined(REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED)\nvarying vec3 vDirectionW;\n#endif\n#endif\n#endif\n#ifdef ENVIRONMENTBRDF\nuniform sampler2D environmentBrdfSampler;\n#endif\n#ifdef SUBSURFACE\n#ifdef SS_REFRACTION\n#ifdef SS_REFRACTIONMAP_3D\n#define sampleRefraction(s,c) textureCube(s,c)\nuniform samplerCube refractionSampler;\n#ifdef LODBASEDMICROSFURACE\n#define sampleRefractionLod(s,c,l) textureCubeLodEXT(s,c,l)\n#else\nuniform samplerCube refractionSamplerLow;\nuniform samplerCube refractionSamplerHigh;\n#endif\n#else\n#define sampleRefraction(s,c) texture2D(s,c)\nuniform sampler2D refractionSampler;\n#ifdef LODBASEDMICROSFURACE\n#define sampleRefractionLod(s,c,l) texture2DLodEXT(s,c,l)\n#else\nuniform sampler2D refractionSamplerLow;\nuniform sampler2D refractionSamplerHigh;\n#endif\n#endif\n#endif\n#include<samplerFragmentDeclaration>(_DEFINENAME_,SS_THICKNESSANDMASK_TEXTURE,_VARYINGNAME_,Thickness,_SAMPLERNAME_,thickness)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,SS_REFRACTIONINTENSITY_TEXTURE,_VARYINGNAME_,RefractionIntensity,_SAMPLERNAME_,refractionIntensity)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,SS_TRANSLUCENCYINTENSITY_TEXTURE,_VARYINGNAME_,TranslucencyIntensity,_SAMPLERNAME_,translucencyIntensity)\n#endif\n",i(5141),i(6390),i(1030),i(9519),i(1423),i(4022),i(3897);S.v.IncludesShadersStore.pbrHelperFunctions="#define RECIPROCAL_PI2 0.15915494\n#define RECIPROCAL_PI 0.31830988618\n#define MINIMUMVARIANCE 0.0005\nfloat convertRoughnessToAverageSlope(float roughness)\n{\nreturn square(roughness)+MINIMUMVARIANCE;\n}\nfloat fresnelGrazingReflectance(float reflectance0) {\nfloat reflectance90=saturate(reflectance0*25.0);\nreturn reflectance90;\n}\nvec2 getAARoughnessFactors(vec3 normalVector) {\n#ifdef SPECULARAA\nvec3 nDfdx=dFdx(normalVector.xyz);\nvec3 nDfdy=dFdy(normalVector.xyz);\nfloat slopeSquare=max(dot(nDfdx,nDfdx),dot(nDfdy,nDfdy));\nfloat geometricRoughnessFactor=pow(saturate(slopeSquare),0.333);\nfloat geometricAlphaGFactor=sqrt(slopeSquare);\ngeometricAlphaGFactor*=0.75;\nreturn vec2(geometricRoughnessFactor,geometricAlphaGFactor);\n#else\nreturn vec2(0.);\n#endif\n}\n#ifdef ANISOTROPIC\nvec2 getAnisotropicRoughness(float alphaG,float anisotropy) {\nfloat alphaT=max(alphaG*(1.0+anisotropy),MINIMUMVARIANCE);\nfloat alphaB=max(alphaG*(1.0-anisotropy),MINIMUMVARIANCE);\nreturn vec2(alphaT,alphaB);\n}\nvec3 getAnisotropicBentNormals(const vec3 T,const vec3 B,const vec3 N,const vec3 V,float anisotropy) {\nvec3 anisotropicFrameDirection=anisotropy>=0.0 ? B : T;\nvec3 anisotropicFrameTangent=cross(normalize(anisotropicFrameDirection),V);\nvec3 anisotropicFrameNormal=cross(anisotropicFrameTangent,anisotropicFrameDirection);\nvec3 anisotropicNormal=normalize(mix(N,anisotropicFrameNormal,abs(anisotropy)));\nreturn anisotropicNormal;\n}\n#endif\n#if defined(CLEARCOAT) || defined(SS_REFRACTION)\nvec3 cocaLambert(vec3 alpha,float distance) {\nreturn exp(-alpha*distance);\n}\nvec3 cocaLambert(float NdotVRefract,float NdotLRefract,vec3 alpha,float thickness) {\nreturn cocaLambert(alpha,(thickness*((NdotLRefract+NdotVRefract)/(NdotLRefract*NdotVRefract))));\n}\nvec3 computeColorAtDistanceInMedia(vec3 color,float distance) {\nreturn -log(color)/distance;\n}\nvec3 computeClearCoatAbsorption(float NdotVRefract,float NdotLRefract,vec3 clearCoatColor,float clearCoatThickness,float clearCoatIntensity) {\nvec3 clearCoatAbsorption=mix(vec3(1.0),\ncocaLambert(NdotVRefract,NdotLRefract,clearCoatColor,clearCoatThickness),\nclearCoatIntensity);\nreturn clearCoatAbsorption;\n}\n#endif\n#ifdef MICROSURFACEAUTOMATIC\nfloat computeDefaultMicroSurface(float microSurface,vec3 reflectivityColor)\n{\nconst float kReflectivityNoAlphaWorkflow_SmoothnessMax=0.95;\nfloat reflectivityLuminance=getLuminance(reflectivityColor);\nfloat reflectivityLuma=sqrt(reflectivityLuminance);\nmicroSurface=reflectivityLuma*kReflectivityNoAlphaWorkflow_SmoothnessMax;\nreturn microSurface;\n}\n#endif\n",i(3660),i(3996);S.v.IncludesShadersStore.harmonicsFunctions="#ifdef USESPHERICALFROMREFLECTIONMAP\n#ifdef SPHERICAL_HARMONICS\nvec3 computeEnvironmentIrradiance(vec3 normal) {\nreturn vSphericalL00\n+ vSphericalL1_1*(normal.y)\n+ vSphericalL10*(normal.z)\n+ vSphericalL11*(normal.x)\n+ vSphericalL2_2*(normal.y*normal.x)\n+ vSphericalL2_1*(normal.y*normal.z)\n+ vSphericalL20*((3.0*normal.z*normal.z)-1.0)\n+ vSphericalL21*(normal.z*normal.x)\n+ vSphericalL22*(normal.x*normal.x-(normal.y*normal.y));\n}\n#else\nvec3 computeEnvironmentIrradiance(vec3 normal) {\nfloat Nx=normal.x;\nfloat Ny=normal.y;\nfloat Nz=normal.z;\nvec3 C1=vSphericalZZ.rgb;\nvec3 Cx=vSphericalX.rgb;\nvec3 Cy=vSphericalY.rgb;\nvec3 Cz=vSphericalZ.rgb;\nvec3 Cxx_zz=vSphericalXX_ZZ.rgb;\nvec3 Cyy_zz=vSphericalYY_ZZ.rgb;\nvec3 Cxy=vSphericalXY.rgb;\nvec3 Cyz=vSphericalYZ.rgb;\nvec3 Czx=vSphericalZX.rgb;\nvec3 a1=Cyy_zz*Ny+Cy;\nvec3 a2=Cyz*Nz+a1;\nvec3 b1=Czx*Nz+Cx;\nvec3 b2=Cxy*Ny+b1;\nvec3 b3=Cxx_zz*Nx+b2;\nvec3 t1=Cz *Nz+C1;\nvec3 t2=a2 *Ny+t1;\nvec3 t3=b3 *Nx+t2;\nreturn t3;\n}\n#endif\n#endif\n";S.v.IncludesShadersStore.pbrDirectLightingSetupFunctions="struct preLightingInfo\n{\nvec3 lightOffset;\nfloat lightDistanceSquared;\nfloat lightDistance;\nfloat attenuation;\nvec3 L;\nvec3 H;\nfloat NdotV;\nfloat NdotLUnclamped;\nfloat NdotL;\nfloat VdotH;\nfloat roughness;\n#ifdef IRIDESCENCE\nfloat iridescenceIntensity;\n#endif\n};\npreLightingInfo computePointAndSpotPreLightingInfo(vec4 lightData,vec3 V,vec3 N) {\npreLightingInfo result;\nresult.lightOffset=lightData.xyz-vPositionW;\nresult.lightDistanceSquared=dot(result.lightOffset,result.lightOffset);\nresult.lightDistance=sqrt(result.lightDistanceSquared);\nresult.L=normalize(result.lightOffset);\nresult.H=normalize(V+result.L);\nresult.VdotH=saturate(dot(V,result.H));\nresult.NdotLUnclamped=dot(N,result.L);\nresult.NdotL=saturateEps(result.NdotLUnclamped);\nreturn result;\n}\npreLightingInfo computeDirectionalPreLightingInfo(vec4 lightData,vec3 V,vec3 N) {\npreLightingInfo result;\nresult.lightDistance=length(-lightData.xyz);\nresult.L=normalize(-lightData.xyz);\nresult.H=normalize(V+result.L);\nresult.VdotH=saturate(dot(V,result.H));\nresult.NdotLUnclamped=dot(N,result.L);\nresult.NdotL=saturateEps(result.NdotLUnclamped);\nreturn result;\n}\npreLightingInfo computeHemisphericPreLightingInfo(vec4 lightData,vec3 V,vec3 N) {\npreLightingInfo result;\nresult.NdotL=dot(N,lightData.xyz)*0.5+0.5;\nresult.NdotL=saturateEps(result.NdotL);\nresult.NdotLUnclamped=result.NdotL;\n#ifdef SPECULARTERM\nresult.L=normalize(lightData.xyz);\nresult.H=normalize(V+result.L);\nresult.VdotH=saturate(dot(V,result.H));\n#endif\nreturn result;\n}";S.v.IncludesShadersStore.pbrDirectLightingFalloffFunctions="float computeDistanceLightFalloff_Standard(vec3 lightOffset,float range)\n{\nreturn max(0.,1.0-length(lightOffset)/range);\n}\nfloat computeDistanceLightFalloff_Physical(float lightDistanceSquared)\n{\nreturn 1.0/maxEps(lightDistanceSquared);\n}\nfloat computeDistanceLightFalloff_GLTF(float lightDistanceSquared,float inverseSquaredRange)\n{\nfloat lightDistanceFalloff=1.0/maxEps(lightDistanceSquared);\nfloat factor=lightDistanceSquared*inverseSquaredRange;\nfloat attenuation=saturate(1.0-factor*factor);\nattenuation*=attenuation;\nlightDistanceFalloff*=attenuation;\nreturn lightDistanceFalloff;\n}\nfloat computeDistanceLightFalloff(vec3 lightOffset,float lightDistanceSquared,float range,float inverseSquaredRange)\n{\n#ifdef USEPHYSICALLIGHTFALLOFF\nreturn computeDistanceLightFalloff_Physical(lightDistanceSquared);\n#elif defined(USEGLTFLIGHTFALLOFF)\nreturn computeDistanceLightFalloff_GLTF(lightDistanceSquared,inverseSquaredRange);\n#else\nreturn computeDistanceLightFalloff_Standard(lightOffset,range);\n#endif\n}\nfloat computeDirectionalLightFalloff_Standard(vec3 lightDirection,vec3 directionToLightCenterW,float cosHalfAngle,float exponent)\n{\nfloat falloff=0.0;\nfloat cosAngle=maxEps(dot(-lightDirection,directionToLightCenterW));\nif (cosAngle>=cosHalfAngle)\n{\nfalloff=max(0.,pow(cosAngle,exponent));\n}\nreturn falloff;\n}\nfloat computeDirectionalLightFalloff_Physical(vec3 lightDirection,vec3 directionToLightCenterW,float cosHalfAngle)\n{\nconst float kMinusLog2ConeAngleIntensityRatio=6.64385618977; \nfloat concentrationKappa=kMinusLog2ConeAngleIntensityRatio/(1.0-cosHalfAngle);\nvec4 lightDirectionSpreadSG=vec4(-lightDirection*concentrationKappa,-concentrationKappa);\nfloat falloff=exp2(dot(vec4(directionToLightCenterW,1.0),lightDirectionSpreadSG));\nreturn falloff;\n}\nfloat computeDirectionalLightFalloff_GLTF(vec3 lightDirection,vec3 directionToLightCenterW,float lightAngleScale,float lightAngleOffset)\n{\nfloat cd=dot(-lightDirection,directionToLightCenterW);\nfloat falloff=saturate(cd*lightAngleScale+lightAngleOffset);\nfalloff*=falloff;\nreturn falloff;\n}\nfloat computeDirectionalLightFalloff(vec3 lightDirection,vec3 directionToLightCenterW,float cosHalfAngle,float exponent,float lightAngleScale,float lightAngleOffset)\n{\n#ifdef USEPHYSICALLIGHTFALLOFF\nreturn computeDirectionalLightFalloff_Physical(lightDirection,directionToLightCenterW,cosHalfAngle);\n#elif defined(USEGLTFLIGHTFALLOFF)\nreturn computeDirectionalLightFalloff_GLTF(lightDirection,directionToLightCenterW,lightAngleScale,lightAngleOffset);\n#else\nreturn computeDirectionalLightFalloff_Standard(lightDirection,directionToLightCenterW,cosHalfAngle,exponent);\n#endif\n}",i(3154),i(4115);S.v.IncludesShadersStore.pbrDirectLightingFunctions="#define CLEARCOATREFLECTANCE90 1.0\nstruct lightingInfo\n{\nvec3 diffuse;\n#ifdef SPECULARTERM\nvec3 specular;\n#endif\n#ifdef CLEARCOAT\nvec4 clearCoat;\n#endif\n#ifdef SHEEN\nvec3 sheen;\n#endif\n};\nfloat adjustRoughnessFromLightProperties(float roughness,float lightRadius,float lightDistance) {\n#if defined(USEPHYSICALLIGHTFALLOFF) || defined(USEGLTFLIGHTFALLOFF)\nfloat lightRoughness=lightRadius/lightDistance;\nfloat totalRoughness=saturate(lightRoughness+roughness);\nreturn totalRoughness;\n#else\nreturn roughness;\n#endif\n}\nvec3 computeHemisphericDiffuseLighting(preLightingInfo info,vec3 lightColor,vec3 groundColor) {\nreturn mix(groundColor,lightColor,info.NdotL);\n}\nvec3 computeDiffuseLighting(preLightingInfo info,vec3 lightColor) {\nfloat diffuseTerm=diffuseBRDF_Burley(info.NdotL,info.NdotV,info.VdotH,info.roughness);\nreturn diffuseTerm*info.attenuation*info.NdotL*lightColor;\n}\n#define inline\nvec3 computeProjectionTextureDiffuseLighting(sampler2D projectionLightSampler,mat4 textureProjectionMatrix){\nvec4 strq=textureProjectionMatrix*vec4(vPositionW,1.0);\nstrq/=strq.w;\nvec3 textureColor=texture2D(projectionLightSampler,strq.xy).rgb;\nreturn toLinearSpace(textureColor);\n}\n#ifdef SS_TRANSLUCENCY\nvec3 computeDiffuseAndTransmittedLighting(preLightingInfo info,vec3 lightColor,vec3 transmittance) {\nfloat NdotL=absEps(info.NdotLUnclamped);\nfloat wrapNdotL=computeWrappedDiffuseNdotL(NdotL,0.02);\nfloat trAdapt=step(0.,info.NdotLUnclamped);\nvec3 transmittanceNdotL=mix(transmittance*wrapNdotL,vec3(wrapNdotL),trAdapt);\nfloat diffuseTerm=diffuseBRDF_Burley(NdotL,info.NdotV,info.VdotH,info.roughness);\nreturn diffuseTerm*transmittanceNdotL*info.attenuation*lightColor;\n}\n#endif\n#ifdef SPECULARTERM\nvec3 computeSpecularLighting(preLightingInfo info,vec3 N,vec3 reflectance0,vec3 reflectance90,float geometricRoughnessFactor,vec3 lightColor) {\nfloat NdotH=saturateEps(dot(N,info.H));\nfloat roughness=max(info.roughness,geometricRoughnessFactor);\nfloat alphaG=convertRoughnessToAverageSlope(roughness);\nvec3 fresnel=fresnelSchlickGGX(info.VdotH,reflectance0,reflectance90);\n#ifdef IRIDESCENCE\nfresnel=mix(fresnel,reflectance0,info.iridescenceIntensity);\n#endif\nfloat distribution=normalDistributionFunction_TrowbridgeReitzGGX(NdotH,alphaG);\n#ifdef BRDF_V_HEIGHT_CORRELATED\nfloat smithVisibility=smithVisibility_GGXCorrelated(info.NdotL,info.NdotV,alphaG);\n#else\nfloat smithVisibility=smithVisibility_TrowbridgeReitzGGXFast(info.NdotL,info.NdotV,alphaG);\n#endif\nvec3 specTerm=fresnel*distribution*smithVisibility;\nreturn specTerm*info.attenuation*info.NdotL*lightColor;\n}\n#endif\n#ifdef ANISOTROPIC\nvec3 computeAnisotropicSpecularLighting(preLightingInfo info,vec3 V,vec3 N,vec3 T,vec3 B,float anisotropy,vec3 reflectance0,vec3 reflectance90,float geometricRoughnessFactor,vec3 lightColor) {\nfloat NdotH=saturateEps(dot(N,info.H));\nfloat TdotH=dot(T,info.H);\nfloat BdotH=dot(B,info.H);\nfloat TdotV=dot(T,V);\nfloat BdotV=dot(B,V);\nfloat TdotL=dot(T,info.L);\nfloat BdotL=dot(B,info.L);\nfloat alphaG=convertRoughnessToAverageSlope(info.roughness);\nvec2 alphaTB=getAnisotropicRoughness(alphaG,anisotropy);\nalphaTB=max(alphaTB,square(geometricRoughnessFactor));\nvec3 fresnel=fresnelSchlickGGX(info.VdotH,reflectance0,reflectance90);\n#ifdef IRIDESCENCE\nfresnel=mix(fresnel,reflectance0,info.iridescenceIntensity);\n#endif\nfloat distribution=normalDistributionFunction_BurleyGGX_Anisotropic(NdotH,TdotH,BdotH,alphaTB);\nfloat smithVisibility=smithVisibility_GGXCorrelated_Anisotropic(info.NdotL,info.NdotV,TdotV,BdotV,TdotL,BdotL,alphaTB);\nvec3 specTerm=fresnel*distribution*smithVisibility;\nreturn specTerm*info.attenuation*info.NdotL*lightColor;\n}\n#endif\n#ifdef CLEARCOAT\nvec4 computeClearCoatLighting(preLightingInfo info,vec3 Ncc,float geometricRoughnessFactor,float clearCoatIntensity,vec3 lightColor) {\nfloat NccdotL=saturateEps(dot(Ncc,info.L));\nfloat NccdotH=saturateEps(dot(Ncc,info.H));\nfloat clearCoatRoughness=max(info.roughness,geometricRoughnessFactor);\nfloat alphaG=convertRoughnessToAverageSlope(clearCoatRoughness);\nfloat fresnel=fresnelSchlickGGX(info.VdotH,vClearCoatRefractionParams.x,CLEARCOATREFLECTANCE90);\nfresnel*=clearCoatIntensity;\nfloat distribution=normalDistributionFunction_TrowbridgeReitzGGX(NccdotH,alphaG);\nfloat kelemenVisibility=visibility_Kelemen(info.VdotH);\nfloat clearCoatTerm=fresnel*distribution*kelemenVisibility;\nreturn vec4(\nclearCoatTerm*info.attenuation*NccdotL*lightColor,\n1.0-fresnel\n);\n}\nvec3 computeClearCoatLightingAbsorption(float NdotVRefract,vec3 L,vec3 Ncc,vec3 clearCoatColor,float clearCoatThickness,float clearCoatIntensity) {\nvec3 LRefract=-refract(L,Ncc,vClearCoatRefractionParams.y);\nfloat NdotLRefract=saturateEps(dot(Ncc,LRefract));\nvec3 absorption=computeClearCoatAbsorption(NdotVRefract,NdotLRefract,clearCoatColor,clearCoatThickness,clearCoatIntensity);\nreturn absorption;\n}\n#endif\n#ifdef SHEEN\nvec3 computeSheenLighting(preLightingInfo info,vec3 N,vec3 reflectance0,vec3 reflectance90,float geometricRoughnessFactor,vec3 lightColor) {\nfloat NdotH=saturateEps(dot(N,info.H));\nfloat roughness=max(info.roughness,geometricRoughnessFactor);\nfloat alphaG=convertRoughnessToAverageSlope(roughness);\nfloat fresnel=1.;\nfloat distribution=normalDistributionFunction_CharlieSheen(NdotH,alphaG);\n/*#ifdef SHEEN_SOFTER\nfloat visibility=visibility_CharlieSheen(info.NdotL,info.NdotV,alphaG);\n#else */\nfloat visibility=visibility_Ashikhmin(info.NdotL,info.NdotV);\n/* #endif */\nfloat sheenTerm=fresnel*distribution*visibility;\nreturn sheenTerm*info.attenuation*info.NdotL*lightColor;\n}\n#endif\n";S.v.IncludesShadersStore.pbrIBLFunctions="#if defined(REFLECTION) || defined(SS_REFRACTION)\nfloat getLodFromAlphaG(float cubeMapDimensionPixels,float microsurfaceAverageSlope) {\nfloat microsurfaceAverageSlopeTexels=cubeMapDimensionPixels*microsurfaceAverageSlope;\nfloat lod=log2(microsurfaceAverageSlopeTexels);\nreturn lod;\n}\nfloat getLinearLodFromRoughness(float cubeMapDimensionPixels,float roughness) {\nfloat lod=log2(cubeMapDimensionPixels)*roughness;\nreturn lod;\n}\n#endif\n#if defined(ENVIRONMENTBRDF) && defined(RADIANCEOCCLUSION)\nfloat environmentRadianceOcclusion(float ambientOcclusion,float NdotVUnclamped) {\nfloat temp=NdotVUnclamped+ambientOcclusion;\nreturn saturate(square(temp)-1.0+ambientOcclusion);\n}\n#endif\n#if defined(ENVIRONMENTBRDF) && defined(HORIZONOCCLUSION)\nfloat environmentHorizonOcclusion(vec3 view,vec3 normal,vec3 geometricNormal) {\nvec3 reflection=reflect(view,normal);\nfloat temp=saturate(1.0+1.1*dot(reflection,geometricNormal));\nreturn square(temp);\n}\n#endif\n#if defined(LODINREFLECTIONALPHA) || defined(SS_LODINREFRACTIONALPHA)\n#define UNPACK_LOD(x) (1.0-x)*255.0\nfloat getLodFromAlphaG(float cubeMapDimensionPixels,float alphaG,float NdotV) {\nfloat microsurfaceAverageSlope=alphaG;\nmicrosurfaceAverageSlope*=sqrt(abs(NdotV));\nreturn getLodFromAlphaG(cubeMapDimensionPixels,microsurfaceAverageSlope);\n}\n#endif\n",i(8882),i(7441),i(2132),i(8074);S.v.IncludesShadersStore.pbrBlockAlbedoOpacity="struct albedoOpacityOutParams\n{\nvec3 surfaceAlbedo;\nfloat alpha;\n};\n#define pbr_inline\nvoid albedoOpacityBlock(\nin vec4 vAlbedoColor,\n#ifdef ALBEDO\nin vec4 albedoTexture,\nin vec2 albedoInfos,\n#endif\n#ifdef OPACITY\nin vec4 opacityMap,\nin vec2 vOpacityInfos,\n#endif\n#ifdef DETAIL\nin vec4 detailColor,\nin vec4 vDetailInfos,\n#endif\n#ifdef DECAL\nin vec4 decalColor,\nin vec4 vDecalInfos,\n#endif\nout albedoOpacityOutParams outParams\n)\n{\nvec3 surfaceAlbedo=vAlbedoColor.rgb;\nfloat alpha=vAlbedoColor.a;\n#ifdef ALBEDO\n#if defined(ALPHAFROMALBEDO) || defined(ALPHATEST)\nalpha*=albedoTexture.a;\n#endif\n#ifdef GAMMAALBEDO\nsurfaceAlbedo*=toLinearSpace(albedoTexture.rgb);\n#else\nsurfaceAlbedo*=albedoTexture.rgb;\n#endif\nsurfaceAlbedo*=albedoInfos.y;\n#endif\n#include<decalFragment>\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nsurfaceAlbedo*=vColor.rgb;\n#endif\n#ifdef DETAIL\nfloat detailAlbedo=2.0*mix(0.5,detailColor.r,vDetailInfos.y);\nsurfaceAlbedo.rgb=surfaceAlbedo.rgb*detailAlbedo*detailAlbedo; \n#endif\n#define CUSTOM_FRAGMENT_UPDATE_ALBEDO\n#ifdef OPACITY\n#ifdef OPACITYRGB\nalpha=getLuminance(opacityMap.rgb);\n#else\nalpha*=opacityMap.a;\n#endif\nalpha*=vOpacityInfos.y;\n#endif\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\n#if !defined(SS_LINKREFRACTIONTOTRANSPARENCY) && !defined(ALPHAFRESNEL)\n#ifdef ALPHATEST\nif (alpha<ALPHATESTVALUE)\ndiscard;\n#ifndef ALPHABLEND\nalpha=1.0;\n#endif\n#endif\n#endif\noutParams.surfaceAlbedo=surfaceAlbedo;\noutParams.alpha=alpha;\n}\n";S.v.IncludesShadersStore.pbrBlockReflectivity="struct reflectivityOutParams\n{\nfloat microSurface;\nfloat roughness;\nvec3 surfaceReflectivityColor;\n#ifdef METALLICWORKFLOW\nvec3 surfaceAlbedo;\n#endif\n#if defined(METALLICWORKFLOW) && defined(REFLECTIVITY) && defined(AOSTOREINMETALMAPRED)\nvec3 ambientOcclusionColor;\n#endif\n#if DEBUGMODE>0\nvec4 surfaceMetallicColorMap;\nvec4 surfaceReflectivityColorMap;\nvec2 metallicRoughness;\nvec3 metallicF0;\n#endif\n};\n#define pbr_inline\nvoid reflectivityBlock(\nin vec4 vReflectivityColor,\n#ifdef METALLICWORKFLOW\nin vec3 surfaceAlbedo,\nin vec4 metallicReflectanceFactors,\n#endif\n#ifdef REFLECTIVITY\nin vec3 reflectivityInfos,\nin vec4 surfaceMetallicOrReflectivityColorMap,\n#endif\n#if defined(METALLICWORKFLOW) && defined(REFLECTIVITY) && defined(AOSTOREINMETALMAPRED)\nin vec3 ambientOcclusionColorIn,\n#endif\n#ifdef MICROSURFACEMAP\nin vec4 microSurfaceTexel,\n#endif\n#ifdef DETAIL\nin vec4 detailColor,\nin vec4 vDetailInfos,\n#endif\nout reflectivityOutParams outParams\n)\n{\nfloat microSurface=vReflectivityColor.a;\nvec3 surfaceReflectivityColor=vReflectivityColor.rgb;\n#ifdef METALLICWORKFLOW\nvec2 metallicRoughness=surfaceReflectivityColor.rg;\n#ifdef REFLECTIVITY\n#if DEBUGMODE>0\noutParams.surfaceMetallicColorMap=surfaceMetallicOrReflectivityColorMap;\n#endif\n#ifdef AOSTOREINMETALMAPRED\nvec3 aoStoreInMetalMap=vec3(surfaceMetallicOrReflectivityColorMap.r,surfaceMetallicOrReflectivityColorMap.r,surfaceMetallicOrReflectivityColorMap.r);\noutParams.ambientOcclusionColor=mix(ambientOcclusionColorIn,aoStoreInMetalMap,reflectivityInfos.z);\n#endif\n#ifdef METALLNESSSTOREINMETALMAPBLUE\nmetallicRoughness.r*=surfaceMetallicOrReflectivityColorMap.b;\n#else\nmetallicRoughness.r*=surfaceMetallicOrReflectivityColorMap.r;\n#endif\n#ifdef ROUGHNESSSTOREINMETALMAPALPHA\nmetallicRoughness.g*=surfaceMetallicOrReflectivityColorMap.a;\n#else\n#ifdef ROUGHNESSSTOREINMETALMAPGREEN\nmetallicRoughness.g*=surfaceMetallicOrReflectivityColorMap.g;\n#endif\n#endif\n#endif\n#ifdef DETAIL\nfloat detailRoughness=mix(0.5,detailColor.b,vDetailInfos.w);\nfloat loLerp=mix(0.,metallicRoughness.g,detailRoughness*2.);\nfloat hiLerp=mix(metallicRoughness.g,1.,(detailRoughness-0.5)*2.);\nmetallicRoughness.g=mix(loLerp,hiLerp,step(detailRoughness,0.5));\n#endif\n#ifdef MICROSURFACEMAP\nmetallicRoughness.g*=microSurfaceTexel.r;\n#endif\n#if DEBUGMODE>0\noutParams.metallicRoughness=metallicRoughness;\n#endif\n#define CUSTOM_FRAGMENT_UPDATE_METALLICROUGHNESS\nmicroSurface=1.0-metallicRoughness.g;\nvec3 baseColor=surfaceAlbedo;\n#ifdef FROSTBITE_REFLECTANCE\noutParams.surfaceAlbedo=baseColor.rgb*(1.0-metallicRoughness.r);\nsurfaceReflectivityColor=mix(0.16*reflectance*reflectance,baseColor,metallicRoughness.r);\n#else\nvec3 metallicF0=metallicReflectanceFactors.rgb;\n#if DEBUGMODE>0\noutParams.metallicF0=metallicF0;\n#endif\noutParams.surfaceAlbedo=mix(baseColor.rgb*(1.0-metallicF0),vec3(0.,0.,0.),metallicRoughness.r);\nsurfaceReflectivityColor=mix(metallicF0,baseColor,metallicRoughness.r);\n#endif\n#else\n#ifdef REFLECTIVITY\nsurfaceReflectivityColor*=surfaceMetallicOrReflectivityColorMap.rgb;\n#if DEBUGMODE>0\noutParams.surfaceReflectivityColorMap=surfaceMetallicOrReflectivityColorMap;\n#endif\n#ifdef MICROSURFACEFROMREFLECTIVITYMAP\nmicroSurface*=surfaceMetallicOrReflectivityColorMap.a;\nmicroSurface*=reflectivityInfos.z;\n#else\n#ifdef MICROSURFACEAUTOMATIC\nmicroSurface*=computeDefaultMicroSurface(microSurface,surfaceReflectivityColor);\n#endif\n#ifdef MICROSURFACEMAP\nmicroSurface*=microSurfaceTexel.r;\n#endif\n#define CUSTOM_FRAGMENT_UPDATE_MICROSURFACE\n#endif\n#endif\n#endif\nmicroSurface=saturate(microSurface);\nfloat roughness=1.-microSurface;\noutParams.microSurface=microSurface;\noutParams.roughness=roughness;\noutParams.surfaceReflectivityColor=surfaceReflectivityColor;\n}\n";S.v.IncludesShadersStore.pbrBlockAmbientOcclusion="struct ambientOcclusionOutParams\n{\nvec3 ambientOcclusionColor;\n#if DEBUGMODE>0\nvec3 ambientOcclusionColorMap;\n#endif\n};\n#define pbr_inline\nvoid ambientOcclusionBlock(\n#ifdef AMBIENT\nin vec3 ambientOcclusionColorMap_,\nin vec4 vAmbientInfos,\n#endif\nout ambientOcclusionOutParams outParams\n)\n{\nvec3 ambientOcclusionColor=vec3(1.,1.,1.);\n#ifdef AMBIENT\nvec3 ambientOcclusionColorMap=ambientOcclusionColorMap_*vAmbientInfos.y;\n#ifdef AMBIENTINGRAYSCALE\nambientOcclusionColorMap=vec3(ambientOcclusionColorMap.r,ambientOcclusionColorMap.r,ambientOcclusionColorMap.r);\n#endif\nambientOcclusionColor=mix(ambientOcclusionColor,ambientOcclusionColorMap,vAmbientInfos.z);\n#if DEBUGMODE>0\noutParams.ambientOcclusionColorMap=ambientOcclusionColorMap;\n#endif\n#endif\noutParams.ambientOcclusionColor=ambientOcclusionColor;\n}\n";S.v.IncludesShadersStore.pbrBlockAlphaFresnel="#ifdef ALPHAFRESNEL\n#if defined(ALPHATEST) || defined(ALPHABLEND)\nstruct alphaFresnelOutParams\n{\nfloat alpha;\n};\n#define pbr_inline\nvoid alphaFresnelBlock(\nin vec3 normalW,\nin vec3 viewDirectionW,\nin float alpha,\nin float microSurface,\nout alphaFresnelOutParams outParams\n)\n{\nfloat opacityPerceptual=alpha;\n#ifdef LINEARALPHAFRESNEL\nfloat opacity0=opacityPerceptual;\n#else\nfloat opacity0=opacityPerceptual*opacityPerceptual;\n#endif\nfloat opacity90=fresnelGrazingReflectance(opacity0);\nvec3 normalForward=faceforward(normalW,-viewDirectionW,normalW);\noutParams.alpha=getReflectanceFromAnalyticalBRDFLookup_Jones(saturate(dot(viewDirectionW,normalForward)),vec3(opacity0),vec3(opacity90),sqrt(microSurface)).x;\n#ifdef ALPHATEST\nif (outParams.alpha<ALPHATESTVALUE)\ndiscard;\n#ifndef ALPHABLEND\noutParams.alpha=1.0;\n#endif\n#endif\n}\n#endif\n#endif\n";S.v.IncludesShadersStore.pbrBlockAnisotropic="#ifdef ANISOTROPIC\nstruct anisotropicOutParams\n{\nfloat anisotropy;\nvec3 anisotropicTangent;\nvec3 anisotropicBitangent;\nvec3 anisotropicNormal;\n#if DEBUGMODE>0\nvec3 anisotropyMapData;\n#endif\n};\n#define pbr_inline\nvoid anisotropicBlock(\nin vec3 vAnisotropy,\n#ifdef ANISOTROPIC_TEXTURE\nin vec3 anisotropyMapData,\n#endif\nin mat3 TBN,\nin vec3 normalW,\nin vec3 viewDirectionW,\nout anisotropicOutParams outParams\n)\n{\nfloat anisotropy=vAnisotropy.b;\nvec3 anisotropyDirection=vec3(vAnisotropy.xy,0.);\n#ifdef ANISOTROPIC_TEXTURE\nanisotropy*=anisotropyMapData.b;\nanisotropyDirection.rg*=anisotropyMapData.rg*2.0-1.0;\n#if DEBUGMODE>0\noutParams.anisotropyMapData=anisotropyMapData;\n#endif\n#endif\nmat3 anisoTBN=mat3(normalize(TBN[0]),normalize(TBN[1]),normalize(TBN[2]));\nvec3 anisotropicTangent=normalize(anisoTBN*anisotropyDirection);\nvec3 anisotropicBitangent=normalize(cross(anisoTBN[2],anisotropicTangent));\noutParams.anisotropy=anisotropy;\noutParams.anisotropicTangent=anisotropicTangent;\noutParams.anisotropicBitangent=anisotropicBitangent;\noutParams.anisotropicNormal=getAnisotropicBentNormals(anisotropicTangent,anisotropicBitangent,normalW,viewDirectionW,anisotropy);\n}\n#endif\n";S.v.IncludesShadersStore.pbrBlockReflection="#ifdef REFLECTION\nstruct reflectionOutParams\n{\nvec4 environmentRadiance;\nvec3 environmentIrradiance;\n#ifdef REFLECTIONMAP_3D\nvec3 reflectionCoords;\n#else\nvec2 reflectionCoords;\n#endif\n#ifdef SS_TRANSLUCENCY\n#ifdef USESPHERICALFROMREFLECTIONMAP\n#if !defined(NORMAL) || !defined(USESPHERICALINVERTEX)\nvec3 irradianceVector;\n#endif\n#endif\n#endif\n};\n#define pbr_inline\nvoid createReflectionCoords(\nin vec3 vPositionW,\nin vec3 normalW,\n#ifdef ANISOTROPIC\nin anisotropicOutParams anisotropicOut,\n#endif\n#ifdef REFLECTIONMAP_3D\nout vec3 reflectionCoords\n#else\nout vec2 reflectionCoords\n#endif\n)\n{\n#ifdef ANISOTROPIC\nvec3 reflectionVector=computeReflectionCoords(vec4(vPositionW,1.0),anisotropicOut.anisotropicNormal);\n#else\nvec3 reflectionVector=computeReflectionCoords(vec4(vPositionW,1.0),normalW);\n#endif\n#ifdef REFLECTIONMAP_OPPOSITEZ\nreflectionVector.z*=-1.0;\n#endif\n#ifdef REFLECTIONMAP_3D\nreflectionCoords=reflectionVector;\n#else\nreflectionCoords=reflectionVector.xy;\n#ifdef REFLECTIONMAP_PROJECTION\nreflectionCoords/=reflectionVector.z;\n#endif\nreflectionCoords.y=1.0-reflectionCoords.y;\n#endif\n}\n#define pbr_inline\n#define inline\nvoid sampleReflectionTexture(\nin float alphaG,\nin vec3 vReflectionMicrosurfaceInfos,\nin vec2 vReflectionInfos,\nin vec3 vReflectionColor,\n#if defined(LODINREFLECTIONALPHA) && !defined(REFLECTIONMAP_SKYBOX)\nin float NdotVUnclamped,\n#endif\n#ifdef LINEARSPECULARREFLECTION\nin float roughness,\n#endif\n#ifdef REFLECTIONMAP_3D\nin samplerCube reflectionSampler,\nconst vec3 reflectionCoords,\n#else\nin sampler2D reflectionSampler,\nconst vec2 reflectionCoords,\n#endif\n#ifndef LODBASEDMICROSFURACE\n#ifdef REFLECTIONMAP_3D\nin samplerCube reflectionSamplerLow,\nin samplerCube reflectionSamplerHigh,\n#else\nin sampler2D reflectionSamplerLow,\nin sampler2D reflectionSamplerHigh,\n#endif\n#endif\n#ifdef REALTIME_FILTERING\nin vec2 vReflectionFilteringInfo,\n#endif\nout vec4 environmentRadiance\n)\n{\n#if defined(LODINREFLECTIONALPHA) && !defined(REFLECTIONMAP_SKYBOX)\nfloat reflectionLOD=getLodFromAlphaG(vReflectionMicrosurfaceInfos.x,alphaG,NdotVUnclamped);\n#elif defined(LINEARSPECULARREFLECTION)\nfloat reflectionLOD=getLinearLodFromRoughness(vReflectionMicrosurfaceInfos.x,roughness);\n#else\nfloat reflectionLOD=getLodFromAlphaG(vReflectionMicrosurfaceInfos.x,alphaG);\n#endif\n#ifdef LODBASEDMICROSFURACE\nreflectionLOD=reflectionLOD*vReflectionMicrosurfaceInfos.y+vReflectionMicrosurfaceInfos.z;\n#ifdef LODINREFLECTIONALPHA\nfloat automaticReflectionLOD=UNPACK_LOD(sampleReflection(reflectionSampler,reflectionCoords).a);\nfloat requestedReflectionLOD=max(automaticReflectionLOD,reflectionLOD);\n#else\nfloat requestedReflectionLOD=reflectionLOD;\n#endif\n#ifdef REALTIME_FILTERING\nenvironmentRadiance=vec4(radiance(alphaG,reflectionSampler,reflectionCoords,vReflectionFilteringInfo),1.0);\n#else\nenvironmentRadiance=sampleReflectionLod(reflectionSampler,reflectionCoords,reflectionLOD);\n#endif\n#else\nfloat lodReflectionNormalized=saturate(reflectionLOD/log2(vReflectionMicrosurfaceInfos.x));\nfloat lodReflectionNormalizedDoubled=lodReflectionNormalized*2.0;\nvec4 environmentMid=sampleReflection(reflectionSampler,reflectionCoords);\nif (lodReflectionNormalizedDoubled<1.0){\nenvironmentRadiance=mix(\nsampleReflection(reflectionSamplerHigh,reflectionCoords),\nenvironmentMid,\nlodReflectionNormalizedDoubled\n);\n} else {\nenvironmentRadiance=mix(\nenvironmentMid,\nsampleReflection(reflectionSamplerLow,reflectionCoords),\nlodReflectionNormalizedDoubled-1.0\n);\n}\n#endif\n#ifdef RGBDREFLECTION\nenvironmentRadiance.rgb=fromRGBD(environmentRadiance);\n#endif\n#ifdef GAMMAREFLECTION\nenvironmentRadiance.rgb=toLinearSpace(environmentRadiance.rgb);\n#endif\nenvironmentRadiance.rgb*=vReflectionInfos.x;\nenvironmentRadiance.rgb*=vReflectionColor.rgb;\n}\n#define pbr_inline\n#define inline\nvoid reflectionBlock(\nin vec3 vPositionW,\nin vec3 normalW,\nin float alphaG,\nin vec3 vReflectionMicrosurfaceInfos,\nin vec2 vReflectionInfos,\nin vec3 vReflectionColor,\n#ifdef ANISOTROPIC\nin anisotropicOutParams anisotropicOut,\n#endif\n#if defined(LODINREFLECTIONALPHA) && !defined(REFLECTIONMAP_SKYBOX)\nin float NdotVUnclamped,\n#endif\n#ifdef LINEARSPECULARREFLECTION\nin float roughness,\n#endif\n#ifdef REFLECTIONMAP_3D\nin samplerCube reflectionSampler,\n#else\nin sampler2D reflectionSampler,\n#endif\n#if defined(NORMAL) && defined(USESPHERICALINVERTEX)\nin vec3 vEnvironmentIrradiance,\n#endif\n#ifdef USESPHERICALFROMREFLECTIONMAP\n#if !defined(NORMAL) || !defined(USESPHERICALINVERTEX)\nin mat4 reflectionMatrix,\n#endif\n#endif\n#ifdef USEIRRADIANCEMAP\n#ifdef REFLECTIONMAP_3D\nin samplerCube irradianceSampler,\n#else\nin sampler2D irradianceSampler,\n#endif\n#endif\n#ifndef LODBASEDMICROSFURACE\n#ifdef REFLECTIONMAP_3D\nin samplerCube reflectionSamplerLow,\nin samplerCube reflectionSamplerHigh,\n#else\nin sampler2D reflectionSamplerLow,\nin sampler2D reflectionSamplerHigh,\n#endif\n#endif\n#ifdef REALTIME_FILTERING\nin vec2 vReflectionFilteringInfo,\n#endif\nout reflectionOutParams outParams\n)\n{\nvec4 environmentRadiance=vec4(0.,0.,0.,0.);\n#ifdef REFLECTIONMAP_3D\nvec3 reflectionCoords=vec3(0.);\n#else\nvec2 reflectionCoords=vec2(0.);\n#endif\ncreateReflectionCoords(\nvPositionW,\nnormalW,\n#ifdef ANISOTROPIC\nanisotropicOut,\n#endif\nreflectionCoords\n);\nsampleReflectionTexture(\nalphaG,\nvReflectionMicrosurfaceInfos,\nvReflectionInfos,\nvReflectionColor,\n#if defined(LODINREFLECTIONALPHA) && !defined(REFLECTIONMAP_SKYBOX)\nNdotVUnclamped,\n#endif\n#ifdef LINEARSPECULARREFLECTION\nroughness,\n#endif\n#ifdef REFLECTIONMAP_3D\nreflectionSampler,\nreflectionCoords,\n#else\nreflectionSampler,\nreflectionCoords,\n#endif\n#ifndef LODBASEDMICROSFURACE\nreflectionSamplerLow,\nreflectionSamplerHigh,\n#endif\n#ifdef REALTIME_FILTERING\nvReflectionFilteringInfo,\n#endif\nenvironmentRadiance\n);\nvec3 environmentIrradiance=vec3(0.,0.,0.);\n#ifdef USESPHERICALFROMREFLECTIONMAP\n#if defined(NORMAL) && defined(USESPHERICALINVERTEX)\nenvironmentIrradiance=vEnvironmentIrradiance;\n#else\n#ifdef ANISOTROPIC\nvec3 irradianceVector=vec3(reflectionMatrix*vec4(anisotropicOut.anisotropicNormal,0)).xyz;\n#else\nvec3 irradianceVector=vec3(reflectionMatrix*vec4(normalW,0)).xyz;\n#endif\n#ifdef REFLECTIONMAP_OPPOSITEZ\nirradianceVector.z*=-1.0;\n#endif\n#ifdef INVERTCUBICMAP\nirradianceVector.y*=-1.0;\n#endif\n#if defined(REALTIME_FILTERING)\nenvironmentIrradiance=irradiance(reflectionSampler,irradianceVector,vReflectionFilteringInfo);\n#else\nenvironmentIrradiance=computeEnvironmentIrradiance(irradianceVector);\n#endif\n#ifdef SS_TRANSLUCENCY\noutParams.irradianceVector=irradianceVector;\n#endif\n#endif\n#elif defined(USEIRRADIANCEMAP)\nvec4 environmentIrradiance4=sampleReflection(irradianceSampler,reflectionCoords);\nenvironmentIrradiance=environmentIrradiance4.rgb;\n#ifdef RGBDREFLECTION\nenvironmentIrradiance.rgb=fromRGBD(environmentIrradiance4);\n#endif\n#ifdef GAMMAREFLECTION\nenvironmentIrradiance.rgb=toLinearSpace(environmentIrradiance.rgb);\n#endif\n#endif\nenvironmentIrradiance*=vReflectionColor.rgb;\noutParams.environmentRadiance=environmentRadiance;\noutParams.environmentIrradiance=environmentIrradiance;\noutParams.reflectionCoords=reflectionCoords;\n}\n#endif\n";S.v.IncludesShadersStore.pbrBlockSheen="#ifdef SHEEN\nstruct sheenOutParams\n{\nfloat sheenIntensity;\nvec3 sheenColor;\nfloat sheenRoughness;\n#ifdef SHEEN_LINKWITHALBEDO\nvec3 surfaceAlbedo;\n#endif\n#if defined(ENVIRONMENTBRDF) && defined(SHEEN_ALBEDOSCALING)\nfloat sheenAlbedoScaling;\n#endif\n#if defined(REFLECTION) && defined(ENVIRONMENTBRDF)\nvec3 finalSheenRadianceScaled;\n#endif\n#if DEBUGMODE>0\nvec4 sheenMapData;\nvec3 sheenEnvironmentReflectance;\n#endif\n};\n#define pbr_inline\n#define inline\nvoid sheenBlock(\nin vec4 vSheenColor,\n#ifdef SHEEN_ROUGHNESS\nin float vSheenRoughness,\n#if defined(SHEEN_TEXTURE_ROUGHNESS) && !defined(SHEEN_TEXTURE_ROUGHNESS_IDENTICAL) && !defined(SHEEN_USE_ROUGHNESS_FROM_MAINTEXTURE)\nin vec4 sheenMapRoughnessData,\n#endif\n#endif\nin float roughness,\n#ifdef SHEEN_TEXTURE\nin vec4 sheenMapData,\nin float sheenMapLevel,\n#endif\nin float reflectance,\n#ifdef SHEEN_LINKWITHALBEDO\nin vec3 baseColor,\nin vec3 surfaceAlbedo,\n#endif\n#ifdef ENVIRONMENTBRDF\nin float NdotV,\nin vec3 environmentBrdf,\n#endif\n#if defined(REFLECTION) && defined(ENVIRONMENTBRDF)\nin vec2 AARoughnessFactors,\nin vec3 vReflectionMicrosurfaceInfos,\nin vec2 vReflectionInfos,\nin vec3 vReflectionColor,\nin vec4 vLightingIntensity,\n#ifdef REFLECTIONMAP_3D\nin samplerCube reflectionSampler,\nin vec3 reflectionCoords,\n#else\nin sampler2D reflectionSampler,\nin vec2 reflectionCoords,\n#endif\nin float NdotVUnclamped,\n#ifndef LODBASEDMICROSFURACE\n#ifdef REFLECTIONMAP_3D\nin samplerCube reflectionSamplerLow,\nin samplerCube reflectionSamplerHigh,\n#else\nin sampler2D reflectionSamplerLow,\nin sampler2D reflectionSamplerHigh,\n#endif\n#endif\n#ifdef REALTIME_FILTERING\nin vec2 vReflectionFilteringInfo,\n#endif\n#if !defined(REFLECTIONMAP_SKYBOX) && defined(RADIANCEOCCLUSION)\nin float seo,\n#endif\n#if !defined(REFLECTIONMAP_SKYBOX) && defined(HORIZONOCCLUSION) && defined(BUMP) && defined(REFLECTIONMAP_3D)\nin float eho,\n#endif\n#endif\nout sheenOutParams outParams\n)\n{\nfloat sheenIntensity=vSheenColor.a;\n#ifdef SHEEN_TEXTURE\n#if DEBUGMODE>0\noutParams.sheenMapData=sheenMapData;\n#endif\n#endif\n#ifdef SHEEN_LINKWITHALBEDO\nfloat sheenFactor=pow5(1.0-sheenIntensity);\nvec3 sheenColor=baseColor.rgb*(1.0-sheenFactor);\nfloat sheenRoughness=sheenIntensity;\noutParams.surfaceAlbedo=surfaceAlbedo*sheenFactor;\n#ifdef SHEEN_TEXTURE\nsheenIntensity*=sheenMapData.a;\n#endif\n#else\nvec3 sheenColor=vSheenColor.rgb;\n#ifdef SHEEN_TEXTURE\n#ifdef SHEEN_GAMMATEXTURE\nsheenColor.rgb*=toLinearSpace(sheenMapData.rgb);\n#else\nsheenColor.rgb*=sheenMapData.rgb;\n#endif\nsheenColor.rgb*=sheenMapLevel;\n#endif\n#ifdef SHEEN_ROUGHNESS\nfloat sheenRoughness=vSheenRoughness;\n#ifdef SHEEN_USE_ROUGHNESS_FROM_MAINTEXTURE\n#if defined(SHEEN_TEXTURE)\nsheenRoughness*=sheenMapData.a;\n#endif\n#elif defined(SHEEN_TEXTURE_ROUGHNESS)\n#ifdef SHEEN_TEXTURE_ROUGHNESS_IDENTICAL\nsheenRoughness*=sheenMapData.a;\n#else\nsheenRoughness*=sheenMapRoughnessData.a;\n#endif\n#endif\n#else\nfloat sheenRoughness=roughness;\n#ifdef SHEEN_TEXTURE\nsheenIntensity*=sheenMapData.a;\n#endif\n#endif\n#if !defined(SHEEN_ALBEDOSCALING)\nsheenIntensity*=(1.-reflectance);\n#endif\nsheenColor*=sheenIntensity;\n#endif\n#ifdef ENVIRONMENTBRDF\n/*#ifdef SHEEN_SOFTER\nvec3 environmentSheenBrdf=vec3(0.,0.,getBRDFLookupCharlieSheen(NdotV,sheenRoughness));\n#else*/\n#ifdef SHEEN_ROUGHNESS\nvec3 environmentSheenBrdf=getBRDFLookup(NdotV,sheenRoughness);\n#else\nvec3 environmentSheenBrdf=environmentBrdf;\n#endif\n/*#endif*/\n#endif\n#if defined(REFLECTION) && defined(ENVIRONMENTBRDF)\nfloat sheenAlphaG=convertRoughnessToAverageSlope(sheenRoughness);\n#ifdef SPECULARAA\nsheenAlphaG+=AARoughnessFactors.y;\n#endif\nvec4 environmentSheenRadiance=vec4(0.,0.,0.,0.);\nsampleReflectionTexture(\nsheenAlphaG,\nvReflectionMicrosurfaceInfos,\nvReflectionInfos,\nvReflectionColor,\n#if defined(LODINREFLECTIONALPHA) && !defined(REFLECTIONMAP_SKYBOX)\nNdotVUnclamped,\n#endif\n#ifdef LINEARSPECULARREFLECTION\nsheenRoughness,\n#endif\nreflectionSampler,\nreflectionCoords,\n#ifndef LODBASEDMICROSFURACE\nreflectionSamplerLow,\nreflectionSamplerHigh,\n#endif\n#ifdef REALTIME_FILTERING\nvReflectionFilteringInfo,\n#endif\nenvironmentSheenRadiance\n);\nvec3 sheenEnvironmentReflectance=getSheenReflectanceFromBRDFLookup(sheenColor,environmentSheenBrdf);\n#if !defined(REFLECTIONMAP_SKYBOX) && defined(RADIANCEOCCLUSION)\nsheenEnvironmentReflectance*=seo;\n#endif\n#if !defined(REFLECTIONMAP_SKYBOX) && defined(HORIZONOCCLUSION) && defined(BUMP) && defined(REFLECTIONMAP_3D)\nsheenEnvironmentReflectance*=eho;\n#endif\n#if DEBUGMODE>0\noutParams.sheenEnvironmentReflectance=sheenEnvironmentReflectance;\n#endif\noutParams.finalSheenRadianceScaled=\nenvironmentSheenRadiance.rgb *\nsheenEnvironmentReflectance *\nvLightingIntensity.z;\n#endif\n#if defined(ENVIRONMENTBRDF) && defined(SHEEN_ALBEDOSCALING)\noutParams.sheenAlbedoScaling=1.0-sheenIntensity*max(max(sheenColor.r,sheenColor.g),sheenColor.b)*environmentSheenBrdf.b;\n#endif\noutParams.sheenIntensity=sheenIntensity;\noutParams.sheenColor=sheenColor;\noutParams.sheenRoughness=sheenRoughness;\n}\n#endif\n";S.v.IncludesShadersStore.pbrBlockClearcoat="struct clearcoatOutParams\n{\nvec3 specularEnvironmentR0;\nfloat conservationFactor;\nvec3 clearCoatNormalW;\nvec2 clearCoatAARoughnessFactors;\nfloat clearCoatIntensity;\nfloat clearCoatRoughness;\n#ifdef REFLECTION\nvec3 finalClearCoatRadianceScaled;\n#endif\n#ifdef CLEARCOAT_TINT\nvec3 absorption;\nfloat clearCoatNdotVRefract;\nvec3 clearCoatColor;\nfloat clearCoatThickness;\n#endif\n#if defined(ENVIRONMENTBRDF) && defined(MS_BRDF_ENERGY_CONSERVATION)\nvec3 energyConservationFactorClearCoat;\n#endif\n#if DEBUGMODE>0\nmat3 TBNClearCoat;\nvec2 clearCoatMapData;\nvec4 clearCoatTintMapData;\nvec4 environmentClearCoatRadiance;\nfloat clearCoatNdotV;\nvec3 clearCoatEnvironmentReflectance;\n#endif\n};\n#ifdef CLEARCOAT\n#define pbr_inline\n#define inline\nvoid clearcoatBlock(\nin vec3 vPositionW,\nin vec3 geometricNormalW,\nin vec3 viewDirectionW,\nin vec2 vClearCoatParams,\n#if defined(CLEARCOAT_TEXTURE_ROUGHNESS) && !defined(CLEARCOAT_TEXTURE_ROUGHNESS_IDENTICAL) && !defined(CLEARCOAT_USE_ROUGHNESS_FROM_MAINTEXTURE)\nin vec4 clearCoatMapRoughnessData,\n#endif\nin vec3 specularEnvironmentR0,\n#ifdef CLEARCOAT_TEXTURE\nin vec2 clearCoatMapData,\n#endif\n#ifdef CLEARCOAT_TINT\nin vec4 vClearCoatTintParams,\nin float clearCoatColorAtDistance,\nin vec4 vClearCoatRefractionParams,\n#ifdef CLEARCOAT_TINT_TEXTURE\nin vec4 clearCoatTintMapData,\n#endif\n#endif\n#ifdef CLEARCOAT_BUMP\nin vec2 vClearCoatBumpInfos,\nin vec4 clearCoatBumpMapData,\nin vec2 vClearCoatBumpUV,\n#if defined(TANGENT) && defined(NORMAL)\nin mat3 vTBN,\n#else\nin vec2 vClearCoatTangentSpaceParams,\n#endif\n#ifdef OBJECTSPACE_NORMALMAP\nin mat4 normalMatrix,\n#endif\n#endif\n#if defined(FORCENORMALFORWARD) && defined(NORMAL)\nin vec3 faceNormal,\n#endif\n#ifdef REFLECTION\nin vec3 vReflectionMicrosurfaceInfos,\nin vec2 vReflectionInfos,\nin vec3 vReflectionColor,\nin vec4 vLightingIntensity,\n#ifdef REFLECTIONMAP_3D\nin samplerCube reflectionSampler,\n#else\nin sampler2D reflectionSampler,\n#endif\n#ifndef LODBASEDMICROSFURACE\n#ifdef REFLECTIONMAP_3D\nin samplerCube reflectionSamplerLow,\nin samplerCube reflectionSamplerHigh,\n#else\nin sampler2D reflectionSamplerLow,\nin sampler2D reflectionSamplerHigh,\n#endif\n#endif\n#ifdef REALTIME_FILTERING\nin vec2 vReflectionFilteringInfo,\n#endif\n#endif\n#if defined(ENVIRONMENTBRDF) && !defined(REFLECTIONMAP_SKYBOX)\n#ifdef RADIANCEOCCLUSION\nin float ambientMonochrome,\n#endif\n#endif\n#if defined(CLEARCOAT_BUMP) || defined(TWOSIDEDLIGHTING)\nin float frontFacingMultiplier,\n#endif\nout clearcoatOutParams outParams\n)\n{\nfloat clearCoatIntensity=vClearCoatParams.x;\nfloat clearCoatRoughness=vClearCoatParams.y;\n#ifdef CLEARCOAT_TEXTURE\nclearCoatIntensity*=clearCoatMapData.x;\n#ifdef CLEARCOAT_USE_ROUGHNESS_FROM_MAINTEXTURE\nclearCoatRoughness*=clearCoatMapData.y;\n#endif\n#if DEBUGMODE>0\noutParams.clearCoatMapData=clearCoatMapData;\n#endif\n#endif\n#if defined(CLEARCOAT_TEXTURE_ROUGHNESS) && !defined(CLEARCOAT_USE_ROUGHNESS_FROM_MAINTEXTURE)\n#ifdef CLEARCOAT_TEXTURE_ROUGHNESS_IDENTICAL\nclearCoatRoughness*=clearCoatMapData.y;\n#else\nclearCoatRoughness*=clearCoatMapRoughnessData.y;\n#endif\n#endif\noutParams.clearCoatIntensity=clearCoatIntensity;\noutParams.clearCoatRoughness=clearCoatRoughness;\n#ifdef CLEARCOAT_TINT\nvec3 clearCoatColor=vClearCoatTintParams.rgb;\nfloat clearCoatThickness=vClearCoatTintParams.a;\n#ifdef CLEARCOAT_TINT_TEXTURE\n#ifdef CLEARCOAT_TINT_GAMMATEXTURE\nclearCoatColor*=toLinearSpace(clearCoatTintMapData.rgb);\n#else\nclearCoatColor*=clearCoatTintMapData.rgb;\n#endif\nclearCoatThickness*=clearCoatTintMapData.a;\n#if DEBUGMODE>0\noutParams.clearCoatTintMapData=clearCoatTintMapData;\n#endif\n#endif\noutParams.clearCoatColor=computeColorAtDistanceInMedia(clearCoatColor,clearCoatColorAtDistance);\noutParams.clearCoatThickness=clearCoatThickness;\n#endif\n#ifdef CLEARCOAT_REMAP_F0\nvec3 specularEnvironmentR0Updated=getR0RemappedForClearCoat(specularEnvironmentR0);\n#else\nvec3 specularEnvironmentR0Updated=specularEnvironmentR0;\n#endif\noutParams.specularEnvironmentR0=mix(specularEnvironmentR0,specularEnvironmentR0Updated,clearCoatIntensity);\nvec3 clearCoatNormalW=geometricNormalW;\n#ifdef CLEARCOAT_BUMP\n#ifdef NORMALXYSCALE\nfloat clearCoatNormalScale=1.0;\n#else\nfloat clearCoatNormalScale=vClearCoatBumpInfos.y;\n#endif\n#if defined(TANGENT) && defined(NORMAL)\nmat3 TBNClearCoat=vTBN;\n#else\nvec2 TBNClearCoatUV=vClearCoatBumpUV*frontFacingMultiplier;\nmat3 TBNClearCoat=cotangent_frame(clearCoatNormalW*clearCoatNormalScale,vPositionW,TBNClearCoatUV,vClearCoatTangentSpaceParams);\n#endif\n#if DEBUGMODE>0\noutParams.TBNClearCoat=TBNClearCoat;\n#endif\n#ifdef OBJECTSPACE_NORMALMAP\nclearCoatNormalW=normalize(clearCoatBumpMapData.xyz *2.0-1.0);\nclearCoatNormalW=normalize(mat3(normalMatrix)*clearCoatNormalW);\n#else\nclearCoatNormalW=perturbNormal(TBNClearCoat,clearCoatBumpMapData.xyz,vClearCoatBumpInfos.y);\n#endif\n#endif\n#if defined(FORCENORMALFORWARD) && defined(NORMAL)\nclearCoatNormalW*=sign(dot(clearCoatNormalW,faceNormal));\n#endif\n#if defined(TWOSIDEDLIGHTING) && defined(NORMAL)\nclearCoatNormalW=clearCoatNormalW*frontFacingMultiplier;\n#endif\noutParams.clearCoatNormalW=clearCoatNormalW;\noutParams.clearCoatAARoughnessFactors=getAARoughnessFactors(clearCoatNormalW.xyz);\nfloat clearCoatNdotVUnclamped=dot(clearCoatNormalW,viewDirectionW);\nfloat clearCoatNdotV=absEps(clearCoatNdotVUnclamped);\n#if DEBUGMODE>0\noutParams.clearCoatNdotV=clearCoatNdotV;\n#endif\n#ifdef CLEARCOAT_TINT\nvec3 clearCoatVRefract=refract(-viewDirectionW,clearCoatNormalW,vClearCoatRefractionParams.y);\noutParams.clearCoatNdotVRefract=absEps(dot(clearCoatNormalW,clearCoatVRefract));\n#endif\n#if defined(ENVIRONMENTBRDF) && (!defined(REFLECTIONMAP_SKYBOX) || defined(MS_BRDF_ENERGY_CONSERVATION))\nvec3 environmentClearCoatBrdf=getBRDFLookup(clearCoatNdotV,clearCoatRoughness);\n#endif\n#if defined(REFLECTION)\nfloat clearCoatAlphaG=convertRoughnessToAverageSlope(clearCoatRoughness);\n#ifdef SPECULARAA\nclearCoatAlphaG+=outParams.clearCoatAARoughnessFactors.y;\n#endif\nvec4 environmentClearCoatRadiance=vec4(0.,0.,0.,0.);\nvec3 clearCoatReflectionVector=computeReflectionCoords(vec4(vPositionW,1.0),clearCoatNormalW);\n#ifdef REFLECTIONMAP_OPPOSITEZ\nclearCoatReflectionVector.z*=-1.0;\n#endif\n#ifdef REFLECTIONMAP_3D\nvec3 clearCoatReflectionCoords=clearCoatReflectionVector;\n#else\nvec2 clearCoatReflectionCoords=clearCoatReflectionVector.xy;\n#ifdef REFLECTIONMAP_PROJECTION\nclearCoatReflectionCoords/=clearCoatReflectionVector.z;\n#endif\nclearCoatReflectionCoords.y=1.0-clearCoatReflectionCoords.y;\n#endif\nsampleReflectionTexture(\nclearCoatAlphaG,\nvReflectionMicrosurfaceInfos,\nvReflectionInfos,\nvReflectionColor,\n#if defined(LODINREFLECTIONALPHA) && !defined(REFLECTIONMAP_SKYBOX)\nclearCoatNdotVUnclamped,\n#endif\n#ifdef LINEARSPECULARREFLECTION\nclearCoatRoughness,\n#endif\nreflectionSampler,\nclearCoatReflectionCoords,\n#ifndef LODBASEDMICROSFURACE\nreflectionSamplerLow,\nreflectionSamplerHigh,\n#endif\n#ifdef REALTIME_FILTERING\nvReflectionFilteringInfo,\n#endif\nenvironmentClearCoatRadiance\n);\n#if DEBUGMODE>0\noutParams.environmentClearCoatRadiance=environmentClearCoatRadiance;\n#endif\n#if defined(ENVIRONMENTBRDF) && !defined(REFLECTIONMAP_SKYBOX)\nvec3 clearCoatEnvironmentReflectance=getReflectanceFromBRDFLookup(vec3(vClearCoatRefractionParams.x),environmentClearCoatBrdf);\n#ifdef HORIZONOCCLUSION\n#ifdef BUMP\n#ifdef REFLECTIONMAP_3D\nfloat clearCoatEho=environmentHorizonOcclusion(-viewDirectionW,clearCoatNormalW,geometricNormalW);\nclearCoatEnvironmentReflectance*=clearCoatEho;\n#endif\n#endif\n#endif\n#else\nvec3 clearCoatEnvironmentReflectance=getReflectanceFromAnalyticalBRDFLookup_Jones(clearCoatNdotV,vec3(1.),vec3(1.),sqrt(1.-clearCoatRoughness));\n#endif\nclearCoatEnvironmentReflectance*=clearCoatIntensity;\n#if DEBUGMODE>0\noutParams.clearCoatEnvironmentReflectance=clearCoatEnvironmentReflectance;\n#endif\noutParams.finalClearCoatRadianceScaled=\nenvironmentClearCoatRadiance.rgb *\nclearCoatEnvironmentReflectance *\nvLightingIntensity.z;\n#endif\n#if defined(CLEARCOAT_TINT)\noutParams.absorption=computeClearCoatAbsorption(outParams.clearCoatNdotVRefract,outParams.clearCoatNdotVRefract,outParams.clearCoatColor,clearCoatThickness,clearCoatIntensity);\n#endif\nfloat fresnelIBLClearCoat=fresnelSchlickGGX(clearCoatNdotV,vClearCoatRefractionParams.x,CLEARCOATREFLECTANCE90);\nfresnelIBLClearCoat*=clearCoatIntensity;\noutParams.conservationFactor=(1.-fresnelIBLClearCoat);\n#if defined(ENVIRONMENTBRDF) && defined(MS_BRDF_ENERGY_CONSERVATION)\noutParams.energyConservationFactorClearCoat=getEnergyConservationFactor(outParams.specularEnvironmentR0,environmentClearCoatBrdf);\n#endif\n}\n#endif\n";S.v.IncludesShadersStore.pbrBlockIridescence="struct iridescenceOutParams\n{\nfloat iridescenceIntensity;\nfloat iridescenceIOR;\nfloat iridescenceThickness;\nvec3 specularEnvironmentR0;\n};\n#ifdef IRIDESCENCE\n#define pbr_inline\n#define inline\nvoid iridescenceBlock(\nin vec4 vIridescenceParams,\nin float viewAngle,\nin vec3 specularEnvironmentR0,\n#ifdef IRIDESCENCE_TEXTURE\nin vec2 iridescenceMapData,\n#endif\n#ifdef IRIDESCENCE_THICKNESS_TEXTURE\nin vec2 iridescenceThicknessMapData,\n#endif\n#ifdef CLEARCOAT\nin float NdotVUnclamped,\n#ifdef CLEARCOAT_TEXTURE\nin vec2 clearCoatMapData,\n#endif\n#endif\nout iridescenceOutParams outParams\n)\n{\nfloat iridescenceIntensity=vIridescenceParams.x;\nfloat iridescenceIOR=vIridescenceParams.y;\nfloat iridescenceThicknessMin=vIridescenceParams.z;\nfloat iridescenceThicknessMax=vIridescenceParams.w;\nfloat iridescenceThicknessWeight=1.;\n#ifdef IRIDESCENCE_TEXTURE\niridescenceIntensity*=iridescenceMapData.x;\n#ifdef IRIDESCENCE_USE_THICKNESS_FROM_MAINTEXTURE\niridescenceThicknessWeight=iridescenceMapData.g;\n#endif\n#endif\n#if defined(IRIDESCENCE_THICKNESS_TEXTURE)\niridescenceThicknessWeight=iridescenceThicknessMapData.g;\n#endif\nfloat iridescenceThickness=mix(iridescenceThicknessMin,iridescenceThicknessMax,iridescenceThicknessWeight);\nfloat topIor=1.; \n#ifdef CLEARCOAT\nfloat clearCoatIntensity=vClearCoatParams.x;\n#ifdef CLEARCOAT_TEXTURE\nclearCoatIntensity*=clearCoatMapData.x;\n#endif\ntopIor=mix(1.0,vClearCoatRefractionParams.w-1.,clearCoatIntensity);\nviewAngle=sqrt(1.0+square(1.0/topIor)*(square(NdotVUnclamped)-1.0));\n#endif\nvec3 iridescenceFresnel=evalIridescence(topIor,iridescenceIOR,viewAngle,iridescenceThickness,specularEnvironmentR0);\noutParams.specularEnvironmentR0=mix(specularEnvironmentR0,iridescenceFresnel,iridescenceIntensity);\noutParams.iridescenceIntensity=iridescenceIntensity;\noutParams.iridescenceThickness=iridescenceThickness;\noutParams.iridescenceIOR=iridescenceIOR;\n}\n#endif\n";S.v.IncludesShadersStore.pbrBlockSubSurface="struct subSurfaceOutParams\n{\nvec3 specularEnvironmentReflectance;\n#ifdef SS_REFRACTION\nvec3 finalRefraction;\nvec3 surfaceAlbedo;\n#ifdef SS_LINKREFRACTIONTOTRANSPARENCY\nfloat alpha;\n#endif\n#ifdef REFLECTION\nfloat refractionFactorForIrradiance;\n#endif\n#endif\n#ifdef SS_TRANSLUCENCY\nvec3 transmittance;\nfloat translucencyIntensity;\n#ifdef REFLECTION\nvec3 refractionIrradiance;\n#endif\n#endif\n#if DEBUGMODE>0\nvec4 thicknessMap;\nvec4 environmentRefraction;\nvec3 refractionTransmittance;\n#endif\n};\n#ifdef SUBSURFACE\n#define pbr_inline\n#define inline\nvoid subSurfaceBlock(\nin vec3 vSubSurfaceIntensity,\nin vec2 vThicknessParam,\nin vec4 vTintColor,\nin vec3 normalW,\nin vec3 specularEnvironmentReflectance,\n#ifdef SS_THICKNESSANDMASK_TEXTURE\nin vec4 thicknessMap,\n#endif\n#ifdef SS_REFRACTIONINTENSITY_TEXTURE\nin vec4 refractionIntensityMap,\n#endif\n#ifdef SS_TRANSLUCENCYINTENSITY_TEXTURE\nin vec4 translucencyIntensityMap,\n#endif\n#ifdef REFLECTION\n#ifdef SS_TRANSLUCENCY\nin mat4 reflectionMatrix,\n#ifdef USESPHERICALFROMREFLECTIONMAP\n#if !defined(NORMAL) || !defined(USESPHERICALINVERTEX)\nin vec3 irradianceVector_,\n#endif\n#if defined(REALTIME_FILTERING)\nin samplerCube reflectionSampler,\nin vec2 vReflectionFilteringInfo,\n#endif\n#endif\n#ifdef USEIRRADIANCEMAP\n#ifdef REFLECTIONMAP_3D\nin samplerCube irradianceSampler,\n#else\nin sampler2D irradianceSampler,\n#endif\n#endif\n#endif\n#endif\n#if defined(SS_REFRACTION) || defined(SS_TRANSLUCENCY)\nin vec3 surfaceAlbedo,\n#endif\n#ifdef SS_REFRACTION\nin vec3 vPositionW,\nin vec3 viewDirectionW,\nin mat4 view,\nin vec4 vRefractionInfos,\nin mat4 refractionMatrix,\nin vec4 vRefractionMicrosurfaceInfos,\nin vec4 vLightingIntensity,\n#ifdef SS_LINKREFRACTIONTOTRANSPARENCY\nin float alpha,\n#endif\n#ifdef SS_LODINREFRACTIONALPHA\nin float NdotVUnclamped,\n#endif\n#ifdef SS_LINEARSPECULARREFRACTION\nin float roughness,\n#endif\nin float alphaG,\n#ifdef SS_REFRACTIONMAP_3D\nin samplerCube refractionSampler,\n#ifndef LODBASEDMICROSFURACE\nin samplerCube refractionSamplerLow,\nin samplerCube refractionSamplerHigh,\n#endif\n#else\nin sampler2D refractionSampler,\n#ifndef LODBASEDMICROSFURACE\nin sampler2D refractionSamplerLow,\nin sampler2D refractionSamplerHigh,\n#endif\n#endif\n#ifdef ANISOTROPIC\nin anisotropicOutParams anisotropicOut,\n#endif\n#ifdef REALTIME_FILTERING\nin vec2 vRefractionFilteringInfo,\n#endif\n#ifdef SS_USE_LOCAL_REFRACTIONMAP_CUBIC\nin vec3 refractionPosition,\nin vec3 refractionSize,\n#endif\n#endif\n#ifdef SS_TRANSLUCENCY\nin vec3 vDiffusionDistance,\n#endif\nout subSurfaceOutParams outParams\n)\n{\noutParams.specularEnvironmentReflectance=specularEnvironmentReflectance;\n#ifdef SS_REFRACTION\nfloat refractionIntensity=vSubSurfaceIntensity.x;\n#ifdef SS_LINKREFRACTIONTOTRANSPARENCY\nrefractionIntensity*=(1.0-alpha);\noutParams.alpha=1.0;\n#endif\n#endif\n#ifdef SS_TRANSLUCENCY\nfloat translucencyIntensity=vSubSurfaceIntensity.y;\n#endif\n#ifdef SS_THICKNESSANDMASK_TEXTURE\n#if defined(SS_USE_GLTF_TEXTURES)\nfloat thickness=thicknessMap.g*vThicknessParam.y+vThicknessParam.x;\n#else\nfloat thickness=thicknessMap.r*vThicknessParam.y+vThicknessParam.x;\n#endif\n#if DEBUGMODE>0\noutParams.thicknessMap=thicknessMap;\n#endif\n#ifdef SS_MASK_FROM_THICKNESS_TEXTURE\n#if defined(SS_REFRACTION) && defined(SS_REFRACTION_USE_INTENSITY_FROM_TEXTURE)\n#if defined(SS_USE_GLTF_TEXTURES)\nrefractionIntensity*=thicknessMap.r;\n#else\nrefractionIntensity*=thicknessMap.g;\n#endif\n#endif\n#if defined(SS_TRANSLUCENCY) && defined(SS_TRANSLUCENCY_USE_INTENSITY_FROM_TEXTURE)\ntranslucencyIntensity*=thicknessMap.b;\n#endif\n#endif\n#else\nfloat thickness=vThicknessParam.y;\n#endif\n#ifdef SS_REFRACTIONINTENSITY_TEXTURE\n#ifdef SS_USE_GLTF_TEXTURES\nrefractionIntensity*=refractionIntensityMap.r;\n#else\nrefractionIntensity*=refractionIntensityMap.g;\n#endif\n#endif\n#ifdef SS_TRANSLUCENCYINTENSITY_TEXTURE\ntranslucencyIntensity*=translucencyIntensityMap.b;\n#endif\n#ifdef SS_TRANSLUCENCY\nthickness=maxEps(thickness);\nvec3 transmittance=transmittanceBRDF_Burley(vTintColor.rgb,vDiffusionDistance,thickness);\ntransmittance*=translucencyIntensity;\noutParams.transmittance=transmittance;\noutParams.translucencyIntensity=translucencyIntensity;\n#endif\n#ifdef SS_REFRACTION\nvec4 environmentRefraction=vec4(0.,0.,0.,0.);\n#ifdef ANISOTROPIC\nvec3 refractionVector=refract(-viewDirectionW,anisotropicOut.anisotropicNormal,vRefractionInfos.y);\n#else\nvec3 refractionVector=refract(-viewDirectionW,normalW,vRefractionInfos.y);\n#endif\n#ifdef SS_REFRACTIONMAP_OPPOSITEZ\nrefractionVector.z*=-1.0;\n#endif\n#ifdef SS_REFRACTIONMAP_3D\n#ifdef SS_USE_LOCAL_REFRACTIONMAP_CUBIC\nrefractionVector=parallaxCorrectNormal(vPositionW,refractionVector,refractionSize,refractionPosition);\n#endif\nrefractionVector.y=refractionVector.y*vRefractionInfos.w;\nvec3 refractionCoords=refractionVector;\nrefractionCoords=vec3(refractionMatrix*vec4(refractionCoords,0));\n#else\n#ifdef SS_USE_THICKNESS_AS_DEPTH\nvec3 vRefractionUVW=vec3(refractionMatrix*(view*vec4(vPositionW+refractionVector*thickness,1.0)));\n#else\nvec3 vRefractionUVW=vec3(refractionMatrix*(view*vec4(vPositionW+refractionVector*vRefractionInfos.z,1.0)));\n#endif\nvec2 refractionCoords=vRefractionUVW.xy/vRefractionUVW.z;\nrefractionCoords.y=1.0-refractionCoords.y;\n#endif\n#ifdef SS_HAS_THICKNESS\nfloat ior=vRefractionInfos.y;\n#else\nfloat ior=vRefractionMicrosurfaceInfos.w;\n#endif\n#ifdef SS_LODINREFRACTIONALPHA\nfloat refractionAlphaG=alphaG;\nrefractionAlphaG=mix(alphaG,0.0,clamp(ior*3.0-2.0,0.0,1.0));\nfloat refractionLOD=getLodFromAlphaG(vRefractionMicrosurfaceInfos.x,refractionAlphaG,NdotVUnclamped);\n#elif defined(SS_LINEARSPECULARREFRACTION)\nfloat refractionRoughness=alphaG;\nrefractionRoughness=mix(alphaG,0.0,clamp(ior*3.0-2.0,0.0,1.0));\nfloat refractionLOD=getLinearLodFromRoughness(vRefractionMicrosurfaceInfos.x,refractionRoughness);\n#else\nfloat refractionAlphaG=alphaG;\nrefractionAlphaG=mix(alphaG,0.0,clamp(ior*3.0-2.0,0.0,1.0));\nfloat refractionLOD=getLodFromAlphaG(vRefractionMicrosurfaceInfos.x,refractionAlphaG);\n#endif\n#ifdef LODBASEDMICROSFURACE\nrefractionLOD=refractionLOD*vRefractionMicrosurfaceInfos.y+vRefractionMicrosurfaceInfos.z;\n#ifdef SS_LODINREFRACTIONALPHA\nfloat automaticRefractionLOD=UNPACK_LOD(sampleRefraction(refractionSampler,refractionCoords).a);\nfloat requestedRefractionLOD=max(automaticRefractionLOD,refractionLOD);\n#else\nfloat requestedRefractionLOD=refractionLOD;\n#endif\n#if defined(REALTIME_FILTERING) && defined(SS_REFRACTIONMAP_3D)\nenvironmentRefraction=vec4(radiance(alphaG,refractionSampler,refractionCoords,vRefractionFilteringInfo),1.0);\n#else\nenvironmentRefraction=sampleRefractionLod(refractionSampler,refractionCoords,requestedRefractionLOD);\n#endif\n#else\nfloat lodRefractionNormalized=saturate(refractionLOD/log2(vRefractionMicrosurfaceInfos.x));\nfloat lodRefractionNormalizedDoubled=lodRefractionNormalized*2.0;\nvec4 environmentRefractionMid=sampleRefraction(refractionSampler,refractionCoords);\nif (lodRefractionNormalizedDoubled<1.0){\nenvironmentRefraction=mix(\nsampleRefraction(refractionSamplerHigh,refractionCoords),\nenvironmentRefractionMid,\nlodRefractionNormalizedDoubled\n);\n} else {\nenvironmentRefraction=mix(\nenvironmentRefractionMid,\nsampleRefraction(refractionSamplerLow,refractionCoords),\nlodRefractionNormalizedDoubled-1.0\n);\n}\n#endif\n#ifdef SS_RGBDREFRACTION\nenvironmentRefraction.rgb=fromRGBD(environmentRefraction);\n#endif\n#ifdef SS_GAMMAREFRACTION\nenvironmentRefraction.rgb=toLinearSpace(environmentRefraction.rgb);\n#endif\nenvironmentRefraction.rgb*=vRefractionInfos.x;\n#endif\n#ifdef SS_REFRACTION\nvec3 refractionTransmittance=vec3(refractionIntensity);\n#ifdef SS_THICKNESSANDMASK_TEXTURE\nvec3 volumeAlbedo=computeColorAtDistanceInMedia(vTintColor.rgb,vTintColor.w);\nrefractionTransmittance*=cocaLambert(volumeAlbedo,thickness);\n#elif defined(SS_LINKREFRACTIONTOTRANSPARENCY)\nfloat maxChannel=max(max(surfaceAlbedo.r,surfaceAlbedo.g),surfaceAlbedo.b);\nvec3 volumeAlbedo=saturate(maxChannel*surfaceAlbedo);\nenvironmentRefraction.rgb*=volumeAlbedo;\n#else\nvec3 volumeAlbedo=computeColorAtDistanceInMedia(vTintColor.rgb,vTintColor.w);\nrefractionTransmittance*=cocaLambert(volumeAlbedo,vThicknessParam.y);\n#endif\n#ifdef SS_ALBEDOFORREFRACTIONTINT\nenvironmentRefraction.rgb*=surfaceAlbedo.rgb;\n#endif\noutParams.surfaceAlbedo=surfaceAlbedo*(1.-refractionIntensity);\n#ifdef REFLECTION\noutParams.refractionFactorForIrradiance=(1.-refractionIntensity);\n#endif\n#ifdef UNUSED_MULTIPLEBOUNCES\nvec3 bounceSpecularEnvironmentReflectance=(2.0*specularEnvironmentReflectance)/(1.0+specularEnvironmentReflectance);\noutParams.specularEnvironmentReflectance=mix(bounceSpecularEnvironmentReflectance,specularEnvironmentReflectance,refractionIntensity);\n#endif\nrefractionTransmittance*=1.0-outParams.specularEnvironmentReflectance;\n#if DEBUGMODE>0\noutParams.refractionTransmittance=refractionTransmittance;\n#endif\noutParams.finalRefraction=environmentRefraction.rgb*refractionTransmittance*vLightingIntensity.z;\n#if DEBUGMODE>0\noutParams.environmentRefraction=environmentRefraction;\n#endif\n#endif\n#if defined(REFLECTION) && defined(SS_TRANSLUCENCY)\n#if defined(NORMAL) && defined(USESPHERICALINVERTEX) || !defined(USESPHERICALFROMREFLECTIONMAP)\nvec3 irradianceVector=vec3(reflectionMatrix*vec4(normalW,0)).xyz;\n#ifdef REFLECTIONMAP_OPPOSITEZ\nirradianceVector.z*=-1.0;\n#endif\n#ifdef INVERTCUBICMAP\nirradianceVector.y*=-1.0;\n#endif\n#else\nvec3 irradianceVector=irradianceVector_;\n#endif\n#if defined(USESPHERICALFROMREFLECTIONMAP)\n#if defined(REALTIME_FILTERING)\nvec3 refractionIrradiance=irradiance(reflectionSampler,-irradianceVector,vReflectionFilteringInfo);\n#else\nvec3 refractionIrradiance=computeEnvironmentIrradiance(-irradianceVector);\n#endif\n#elif defined(USEIRRADIANCEMAP)\n#ifdef REFLECTIONMAP_3D\nvec3 irradianceCoords=irradianceVector;\n#else\nvec2 irradianceCoords=irradianceVector.xy;\n#ifdef REFLECTIONMAP_PROJECTION\nirradianceCoords/=irradianceVector.z;\n#endif\nirradianceCoords.y=1.0-irradianceCoords.y;\n#endif\nvec4 refractionIrradiance=sampleReflection(irradianceSampler,-irradianceCoords);\n#ifdef RGBDREFLECTION\nrefractionIrradiance.rgb=fromRGBD(refractionIrradiance);\n#endif\n#ifdef GAMMAREFLECTION\nrefractionIrradiance.rgb=toLinearSpace(refractionIrradiance.rgb);\n#endif\n#else\nvec4 refractionIrradiance=vec4(0.);\n#endif\nrefractionIrradiance.rgb*=transmittance;\n#ifdef SS_ALBEDOFORTRANSLUCENCYTINT\nrefractionIrradiance.rgb*=surfaceAlbedo.rgb;\n#endif\noutParams.refractionIrradiance=refractionIrradiance.rgb;\n#endif\n}\n#endif\n",i(5791);S.v.IncludesShadersStore.pbrBlockNormalGeometric="vec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=normalize(cross(dFdx(vPositionW),dFdy(vPositionW)))*vEyePosition.w;\n#endif\nvec3 geometricNormalW=normalW;\n#if defined(TWOSIDEDLIGHTING) && defined(NORMAL)\ngeometricNormalW=gl_FrontFacing ? geometricNormalW : -geometricNormalW;\n#endif\n",i(2321);S.v.IncludesShadersStore.pbrBlockNormalFinal="#if defined(FORCENORMALFORWARD) && defined(NORMAL)\nvec3 faceNormal=normalize(cross(dFdx(vPositionW),dFdy(vPositionW)))*vEyePosition.w;\n#if defined(TWOSIDEDLIGHTING)\nfaceNormal=gl_FrontFacing ? faceNormal : -faceNormal;\n#endif\nnormalW*=sign(dot(normalW,faceNormal));\n#endif\n#if defined(TWOSIDEDLIGHTING) && defined(NORMAL)\nnormalW=gl_FrontFacing ? normalW : -normalW;\n#endif\n",i(783);S.v.IncludesShadersStore.pbrBlockLightmapInit="#ifdef LIGHTMAP\nvec4 lightmapColor=texture2D(lightmapSampler,vLightmapUV+uvOffset);\n#ifdef RGBDLIGHTMAP\nlightmapColor.rgb=fromRGBD(lightmapColor);\n#endif\n#ifdef GAMMALIGHTMAP\nlightmapColor.rgb=toLinearSpace(lightmapColor.rgb);\n#endif\nlightmapColor.rgb*=vLightmapInfos.y;\n#endif\n";S.v.IncludesShadersStore.pbrBlockGeometryInfo="float NdotVUnclamped=dot(normalW,viewDirectionW);\nfloat NdotV=absEps(NdotVUnclamped);\nfloat alphaG=convertRoughnessToAverageSlope(roughness);\nvec2 AARoughnessFactors=getAARoughnessFactors(normalW.xyz);\n#ifdef SPECULARAA\nalphaG+=AARoughnessFactors.y;\n#endif\n#if defined(ENVIRONMENTBRDF)\nvec3 environmentBrdf=getBRDFLookup(NdotV,roughness);\n#endif\n#if defined(ENVIRONMENTBRDF) && !defined(REFLECTIONMAP_SKYBOX)\n#ifdef RADIANCEOCCLUSION\n#ifdef AMBIENTINGRAYSCALE\nfloat ambientMonochrome=aoOut.ambientOcclusionColor.r;\n#else\nfloat ambientMonochrome=getLuminance(aoOut.ambientOcclusionColor);\n#endif\nfloat seo=environmentRadianceOcclusion(ambientMonochrome,NdotVUnclamped);\n#endif\n#ifdef HORIZONOCCLUSION\n#ifdef BUMP\n#ifdef REFLECTIONMAP_3D\nfloat eho=environmentHorizonOcclusion(-viewDirectionW,normalW,geometricNormalW);\n#endif\n#endif\n#endif\n#endif\n";S.v.IncludesShadersStore.pbrBlockReflectance0="float reflectance=max(max(reflectivityOut.surfaceReflectivityColor.r,reflectivityOut.surfaceReflectivityColor.g),reflectivityOut.surfaceReflectivityColor.b);\nvec3 specularEnvironmentR0=reflectivityOut.surfaceReflectivityColor.rgb;\n#ifdef METALLICWORKFLOW\nvec3 specularEnvironmentR90=vec3(metallicReflectanceFactors.a);\n#else \nvec3 specularEnvironmentR90=vec3(1.0,1.0,1.0);\n#endif\n#ifdef ALPHAFRESNEL\nfloat reflectance90=fresnelGrazingReflectance(reflectance);\nspecularEnvironmentR90=specularEnvironmentR90*reflectance90;\n#endif\n";S.v.IncludesShadersStore.pbrBlockReflectance="#if defined(ENVIRONMENTBRDF) && !defined(REFLECTIONMAP_SKYBOX)\nvec3 specularEnvironmentReflectance=getReflectanceFromBRDFLookup(clearcoatOut.specularEnvironmentR0,specularEnvironmentR90,environmentBrdf);\n#ifdef RADIANCEOCCLUSION\nspecularEnvironmentReflectance*=seo;\n#endif\n#ifdef HORIZONOCCLUSION\n#ifdef BUMP\n#ifdef REFLECTIONMAP_3D\nspecularEnvironmentReflectance*=eho;\n#endif\n#endif\n#endif\n#else\nvec3 specularEnvironmentReflectance=getReflectanceFromAnalyticalBRDFLookup_Jones(NdotV,clearcoatOut.specularEnvironmentR0,specularEnvironmentR90,sqrt(microSurface));\n#endif\n#ifdef CLEARCOAT\nspecularEnvironmentReflectance*=clearcoatOut.conservationFactor;\n#if defined(CLEARCOAT_TINT)\nspecularEnvironmentReflectance*=clearcoatOut.absorption;\n#endif\n#endif\n";S.v.IncludesShadersStore.pbrBlockDirectLighting="vec3 diffuseBase=vec3(0.,0.,0.);\n#ifdef SPECULARTERM\nvec3 specularBase=vec3(0.,0.,0.);\n#endif\n#ifdef CLEARCOAT\nvec3 clearCoatBase=vec3(0.,0.,0.);\n#endif\n#ifdef SHEEN\nvec3 sheenBase=vec3(0.,0.,0.);\n#endif\npreLightingInfo preInfo;\nlightingInfo info;\nfloat shadow=1.; \n#if defined(CLEARCOAT) && defined(CLEARCOAT_TINT)\nvec3 absorption=vec3(0.);\n#endif\n",i(9490);S.v.IncludesShadersStore.pbrBlockFinalLitComponents="#if defined(ENVIRONMENTBRDF)\n#ifdef MS_BRDF_ENERGY_CONSERVATION\nvec3 energyConservationFactor=getEnergyConservationFactor(clearcoatOut.specularEnvironmentR0,environmentBrdf);\n#endif\n#endif\n#ifndef METALLICWORKFLOW\n#ifdef SPECULAR_GLOSSINESS_ENERGY_CONSERVATION\nsurfaceAlbedo.rgb=(1.-reflectance)*surfaceAlbedo.rgb;\n#endif\n#endif\n#if defined(SHEEN) && defined(SHEEN_ALBEDOSCALING) && defined(ENVIRONMENTBRDF)\nsurfaceAlbedo.rgb=sheenOut.sheenAlbedoScaling*surfaceAlbedo.rgb;\n#endif\n#ifdef REFLECTION\nvec3 finalIrradiance=reflectionOut.environmentIrradiance;\n#if defined(CLEARCOAT)\nfinalIrradiance*=clearcoatOut.conservationFactor;\n#if defined(CLEARCOAT_TINT)\nfinalIrradiance*=clearcoatOut.absorption;\n#endif\n#endif\n#if defined(SS_REFRACTION)\nfinalIrradiance*=subSurfaceOut.refractionFactorForIrradiance;\n#endif\n#if defined(SS_TRANSLUCENCY)\nfinalIrradiance*=(1.0-subSurfaceOut.translucencyIntensity);\nfinalIrradiance+=subSurfaceOut.refractionIrradiance;\n#endif\nfinalIrradiance*=surfaceAlbedo.rgb;\nfinalIrradiance*=vLightingIntensity.z;\nfinalIrradiance*=aoOut.ambientOcclusionColor;\n#endif\n#ifdef SPECULARTERM\nvec3 finalSpecular=specularBase;\nfinalSpecular=max(finalSpecular,0.0);\nvec3 finalSpecularScaled=finalSpecular*vLightingIntensity.x*vLightingIntensity.w;\n#if defined(ENVIRONMENTBRDF) && defined(MS_BRDF_ENERGY_CONSERVATION)\nfinalSpecularScaled*=energyConservationFactor;\n#endif\n#if defined(SHEEN) && defined(ENVIRONMENTBRDF) && defined(SHEEN_ALBEDOSCALING)\nfinalSpecularScaled*=sheenOut.sheenAlbedoScaling;\n#endif\n#endif\n#ifdef REFLECTION\nvec3 finalRadiance=reflectionOut.environmentRadiance.rgb;\nfinalRadiance*=subSurfaceOut.specularEnvironmentReflectance;\nvec3 finalRadianceScaled=finalRadiance*vLightingIntensity.z;\n#if defined(ENVIRONMENTBRDF) && defined(MS_BRDF_ENERGY_CONSERVATION)\nfinalRadianceScaled*=energyConservationFactor;\n#endif\n#if defined(SHEEN) && defined(ENVIRONMENTBRDF) && defined(SHEEN_ALBEDOSCALING)\nfinalRadianceScaled*=sheenOut.sheenAlbedoScaling;\n#endif\n#endif\n#ifdef SHEEN\nvec3 finalSheen=sheenBase*sheenOut.sheenColor;\nfinalSheen=max(finalSheen,0.0);\nvec3 finalSheenScaled=finalSheen*vLightingIntensity.x*vLightingIntensity.w;\n#if defined(CLEARCOAT) && defined(REFLECTION) && defined(ENVIRONMENTBRDF)\nsheenOut.finalSheenRadianceScaled*=clearcoatOut.conservationFactor;\n#if defined(CLEARCOAT_TINT)\nsheenOut.finalSheenRadianceScaled*=clearcoatOut.absorption;\n#endif\n#endif\n#endif\n#ifdef CLEARCOAT\nvec3 finalClearCoat=clearCoatBase;\nfinalClearCoat=max(finalClearCoat,0.0);\nvec3 finalClearCoatScaled=finalClearCoat*vLightingIntensity.x*vLightingIntensity.w;\n#if defined(ENVIRONMENTBRDF) && defined(MS_BRDF_ENERGY_CONSERVATION)\nfinalClearCoatScaled*=clearcoatOut.energyConservationFactorClearCoat;\n#endif\n#ifdef SS_REFRACTION\nsubSurfaceOut.finalRefraction*=clearcoatOut.conservationFactor;\n#ifdef CLEARCOAT_TINT\nsubSurfaceOut.finalRefraction*=clearcoatOut.absorption;\n#endif\n#endif\n#endif\n#ifdef ALPHABLEND\nfloat luminanceOverAlpha=0.0;\n#if defined(REFLECTION) && defined(RADIANCEOVERALPHA)\nluminanceOverAlpha+=getLuminance(finalRadianceScaled);\n#if defined(CLEARCOAT)\nluminanceOverAlpha+=getLuminance(clearcoatOut.finalClearCoatRadianceScaled);\n#endif\n#endif\n#if defined(SPECULARTERM) && defined(SPECULAROVERALPHA)\nluminanceOverAlpha+=getLuminance(finalSpecularScaled);\n#endif\n#if defined(CLEARCOAT) && defined(CLEARCOATOVERALPHA)\nluminanceOverAlpha+=getLuminance(finalClearCoatScaled);\n#endif\n#if defined(RADIANCEOVERALPHA) || defined(SPECULAROVERALPHA) || defined(CLEARCOATOVERALPHA)\nalpha=saturate(alpha+luminanceOverAlpha*luminanceOverAlpha);\n#endif\n#endif\n";S.v.IncludesShadersStore.pbrBlockFinalUnlitComponents="vec3 finalDiffuse=diffuseBase;\nfinalDiffuse*=surfaceAlbedo.rgb;\nfinalDiffuse=max(finalDiffuse,0.0);\nfinalDiffuse*=vLightingIntensity.x;\nvec3 finalAmbient=vAmbientColor;\nfinalAmbient*=surfaceAlbedo.rgb;\nvec3 finalEmissive=vEmissiveColor;\n#ifdef EMISSIVE\nvec3 emissiveColorTex=texture2D(emissiveSampler,vEmissiveUV+uvOffset).rgb;\n#ifdef GAMMAEMISSIVE\nfinalEmissive*=toLinearSpace(emissiveColorTex.rgb);\n#else\nfinalEmissive*=emissiveColorTex.rgb;\n#endif\nfinalEmissive*= vEmissiveInfos.y;\n#endif\nfinalEmissive*=vLightingIntensity.y;\n#ifdef AMBIENT\nvec3 ambientOcclusionForDirectDiffuse=mix(vec3(1.),aoOut.ambientOcclusionColor,vAmbientInfos.w);\n#else\nvec3 ambientOcclusionForDirectDiffuse=aoOut.ambientOcclusionColor;\n#endif\nfinalAmbient*=aoOut.ambientOcclusionColor;\nfinalDiffuse*=ambientOcclusionForDirectDiffuse;\n";S.v.IncludesShadersStore.pbrBlockFinalColorComposition="vec4 finalColor=vec4(\n#ifndef UNLIT\n#ifdef REFLECTION\nfinalIrradiance +\n#endif\n#ifdef SPECULARTERM\nfinalSpecularScaled +\n#endif\n#ifdef SHEEN\nfinalSheenScaled +\n#endif\n#ifdef CLEARCOAT\nfinalClearCoatScaled +\n#endif\n#ifdef REFLECTION\nfinalRadianceScaled +\n#if defined(SHEEN) && defined(ENVIRONMENTBRDF)\nsheenOut.finalSheenRadianceScaled +\n#endif\n#ifdef CLEARCOAT\nclearcoatOut.finalClearCoatRadianceScaled +\n#endif\n#endif\n#ifdef SS_REFRACTION\nsubSurfaceOut.finalRefraction +\n#endif\n#endif\nfinalAmbient +\nfinalDiffuse,\nalpha);\n#ifdef LIGHTMAP\n#ifndef LIGHTMAPEXCLUDED\n#ifdef USELIGHTMAPASSHADOWMAP\nfinalColor.rgb*=lightmapColor.rgb;\n#else\nfinalColor.rgb+=lightmapColor.rgb;\n#endif\n#endif\n#endif\nfinalColor.rgb+=finalEmissive;\n#define CUSTOM_FRAGMENT_BEFORE_FOG\nfinalColor=max(finalColor,0.0);\n",i(8773),i(6043);S.v.IncludesShadersStore.pbrBlockImageProcessing="#if defined(IMAGEPROCESSINGPOSTPROCESS) || defined(SS_SCATTERING)\n#if !defined(SKIPFINALCOLORCLAMP)\nfinalColor.rgb=clamp(finalColor.rgb,0.,30.0);\n#endif\n#else\nfinalColor=applyImageProcessing(finalColor);\n#endif\nfinalColor.a*=visibility;\n#ifdef PREMULTIPLYALPHA\nfinalColor.rgb*=finalColor.a;\n#endif\n",i(4643);S.v.IncludesShadersStore.pbrDebug="#if DEBUGMODE>0\nif (vClipSpacePosition.x/vClipSpacePosition.w>=vDebugMode.x) {\n#if DEBUGMODE==1\ngl_FragColor.rgb=vPositionW.rgb;\n#define DEBUGMODE_NORMALIZE\n#elif DEBUGMODE==2 && defined(NORMAL)\ngl_FragColor.rgb=vNormalW.rgb;\n#define DEBUGMODE_NORMALIZE\n#elif DEBUGMODE==3 && defined(BUMP) || DEBUGMODE==3 && defined(PARALLAX) || DEBUGMODE==3 && defined(ANISOTROPIC)\ngl_FragColor.rgb=TBN[0];\n#define DEBUGMODE_NORMALIZE\n#elif DEBUGMODE==4 && defined(BUMP) || DEBUGMODE==4 && defined(PARALLAX) || DEBUGMODE==4 && defined(ANISOTROPIC)\ngl_FragColor.rgb=TBN[1];\n#define DEBUGMODE_NORMALIZE\n#elif DEBUGMODE==5\ngl_FragColor.rgb=normalW;\n#define DEBUGMODE_NORMALIZE\n#elif DEBUGMODE==6 && defined(MAINUV1)\ngl_FragColor.rgb=vec3(vMainUV1,0.0);\n#elif DEBUGMODE==7 && defined(MAINUV2)\ngl_FragColor.rgb=vec3(vMainUV2,0.0);\n#elif DEBUGMODE==8 && defined(CLEARCOAT) && defined(CLEARCOAT_BUMP)\ngl_FragColor.rgb=clearcoatOut.TBNClearCoat[0];\n#define DEBUGMODE_NORMALIZE\n#elif DEBUGMODE==9 && defined(CLEARCOAT) && defined(CLEARCOAT_BUMP)\ngl_FragColor.rgb=clearcoatOut.TBNClearCoat[1];\n#define DEBUGMODE_NORMALIZE\n#elif DEBUGMODE==10 && defined(CLEARCOAT)\ngl_FragColor.rgb=clearcoatOut.clearCoatNormalW;\n#define DEBUGMODE_NORMALIZE\n#elif DEBUGMODE==11 && defined(ANISOTROPIC)\ngl_FragColor.rgb=anisotropicOut.anisotropicNormal;\n#define DEBUGMODE_NORMALIZE\n#elif DEBUGMODE==12 && defined(ANISOTROPIC)\ngl_FragColor.rgb=anisotropicOut.anisotropicTangent;\n#define DEBUGMODE_NORMALIZE\n#elif DEBUGMODE==13 && defined(ANISOTROPIC)\ngl_FragColor.rgb=anisotropicOut.anisotropicBitangent;\n#define DEBUGMODE_NORMALIZE\n#elif DEBUGMODE==20 && defined(ALBEDO)\ngl_FragColor.rgb=albedoTexture.rgb;\n#elif DEBUGMODE==21 && defined(AMBIENT)\ngl_FragColor.rgb=aoOut.ambientOcclusionColorMap.rgb;\n#elif DEBUGMODE==22 && defined(OPACITY)\ngl_FragColor.rgb=opacityMap.rgb;\n#elif DEBUGMODE==23 && defined(EMISSIVE)\ngl_FragColor.rgb=emissiveColorTex.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==24 && defined(LIGHTMAP)\ngl_FragColor.rgb=lightmapColor.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==25 && defined(REFLECTIVITY) && defined(METALLICWORKFLOW)\ngl_FragColor.rgb=reflectivityOut.surfaceMetallicColorMap.rgb;\n#elif DEBUGMODE==26 && defined(REFLECTIVITY) && !defined(METALLICWORKFLOW)\ngl_FragColor.rgb=reflectivityOut.surfaceReflectivityColorMap.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==27 && defined(CLEARCOAT) && defined(CLEARCOAT_TEXTURE)\ngl_FragColor.rgb=vec3(clearcoatOut.clearCoatMapData.rg,0.0);\n#elif DEBUGMODE==28 && defined(CLEARCOAT) && defined(CLEARCOAT_TINT) && defined(CLEARCOAT_TINT_TEXTURE)\ngl_FragColor.rgb=clearcoatOut.clearCoatTintMapData.rgb;\n#elif DEBUGMODE==29 && defined(SHEEN) && defined(SHEEN_TEXTURE)\ngl_FragColor.rgb=sheenOut.sheenMapData.rgb;\n#elif DEBUGMODE==30 && defined(ANISOTROPIC) && defined(ANISOTROPIC_TEXTURE)\ngl_FragColor.rgb=anisotropicOut.anisotropyMapData.rgb;\n#elif DEBUGMODE==31 && defined(SUBSURFACE) && defined(SS_THICKNESSANDMASK_TEXTURE)\ngl_FragColor.rgb=subSurfaceOut.thicknessMap.rgb;\n#elif DEBUGMODE==40 && defined(SS_REFRACTION)\ngl_FragColor.rgb=subSurfaceOut.environmentRefraction.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==41 && defined(REFLECTION)\ngl_FragColor.rgb=reflectionOut.environmentRadiance.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==42 && defined(CLEARCOAT) && defined(REFLECTION)\ngl_FragColor.rgb=clearcoatOut.environmentClearCoatRadiance.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==50\ngl_FragColor.rgb=diffuseBase.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==51 && defined(SPECULARTERM)\ngl_FragColor.rgb=specularBase.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==52 && defined(CLEARCOAT)\ngl_FragColor.rgb=clearCoatBase.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==53 && defined(SHEEN)\ngl_FragColor.rgb=sheenBase.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==54 && defined(REFLECTION)\ngl_FragColor.rgb=reflectionOut.environmentIrradiance.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==60\ngl_FragColor.rgb=surfaceAlbedo.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==61\ngl_FragColor.rgb=clearcoatOut.specularEnvironmentR0;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==62 && defined(METALLICWORKFLOW)\ngl_FragColor.rgb=vec3(reflectivityOut.metallicRoughness.r);\n#elif DEBUGMODE==71 && defined(METALLICWORKFLOW)\ngl_FragColor.rgb=reflectivityOut.metallicF0;\n#elif DEBUGMODE==63\ngl_FragColor.rgb=vec3(roughness);\n#elif DEBUGMODE==64\ngl_FragColor.rgb=vec3(alphaG);\n#elif DEBUGMODE==65\ngl_FragColor.rgb=vec3(NdotV);\n#elif DEBUGMODE==66 && defined(CLEARCOAT) && defined(CLEARCOAT_TINT)\ngl_FragColor.rgb=clearcoatOut.clearCoatColor.rgb;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==67 && defined(CLEARCOAT)\ngl_FragColor.rgb=vec3(clearcoatOut.clearCoatRoughness);\n#elif DEBUGMODE==68 && defined(CLEARCOAT)\ngl_FragColor.rgb=vec3(clearcoatOut.clearCoatNdotV);\n#elif DEBUGMODE==69 && defined(SUBSURFACE) && defined(SS_TRANSLUCENCY)\ngl_FragColor.rgb=subSurfaceOut.transmittance;\n#elif DEBUGMODE==70 && defined(SUBSURFACE) && defined(SS_REFRACTION)\ngl_FragColor.rgb=subSurfaceOut.refractionTransmittance;\n#elif DEBUGMODE==80 && defined(RADIANCEOCCLUSION)\ngl_FragColor.rgb=vec3(seo);\n#elif DEBUGMODE==81 && defined(HORIZONOCCLUSION)\ngl_FragColor.rgb=vec3(eho);\n#elif DEBUGMODE==82 && defined(MS_BRDF_ENERGY_CONSERVATION)\ngl_FragColor.rgb=vec3(energyConservationFactor);\n#elif DEBUGMODE==83 && defined(ENVIRONMENTBRDF) && !defined(REFLECTIONMAP_SKYBOX)\ngl_FragColor.rgb=specularEnvironmentReflectance;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==84 && defined(CLEARCOAT) && defined(ENVIRONMENTBRDF) && !defined(REFLECTIONMAP_SKYBOX)\ngl_FragColor.rgb=clearcoatOut.clearCoatEnvironmentReflectance;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==85 && defined(SHEEN) && defined(REFLECTION)\ngl_FragColor.rgb=sheenOut.sheenEnvironmentReflectance;\n#define DEBUGMODE_GAMMA\n#elif DEBUGMODE==86 && defined(ALPHABLEND)\ngl_FragColor.rgb=vec3(luminanceOverAlpha);\n#elif DEBUGMODE==87\ngl_FragColor.rgb=vec3(alpha);\n#endif\ngl_FragColor.rgb*=vDebugMode.y;\n#ifdef DEBUGMODE_NORMALIZE\ngl_FragColor.rgb=normalize(gl_FragColor.rgb)*0.5+0.5;\n#endif\n#ifdef DEBUGMODE_GAMMA\ngl_FragColor.rgb=toGammaSpace(gl_FragColor.rgb);\n#endif\ngl_FragColor.a=1.0;\n#ifdef PREPASS\ngl_FragData[0]=toLinearSpace(gl_FragColor); \ngl_FragData[1]=vec4(0.,0.,0.,0.); \n#endif\nreturn;\n}\n#endif\n";S.v.ShadersStore.pbrPixelShader="#if defined(BUMP) || !defined(NORMAL) || defined(FORCENORMALFORWARD) || defined(SPECULARAA) || defined(CLEARCOAT_BUMP) || defined(ANISOTROPIC)\n#extension GL_OES_standard_derivatives : enable\n#endif\n#ifdef LODBASEDMICROSFURACE\n#extension GL_EXT_shader_texture_lod : enable\n#endif\n#define CUSTOM_FRAGMENT_BEGIN\n#ifdef LOGARITHMICDEPTH\n#extension GL_EXT_frag_depth : enable\n#endif\n#include<prePassDeclaration>[SCENE_MRT_COUNT]\nprecision highp float;\n#include<oitDeclaration>\n#ifndef FROMLINEARSPACE\n#define FROMLINEARSPACE\n#endif\n#include<__decl__pbrFragment>\n#include<pbrFragmentExtraDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#include<pbrFragmentSamplersDeclaration>\n#include<imageProcessingDeclaration>\n#include<clipPlaneFragmentDeclaration>\n#include<logDepthDeclaration>\n#include<fogFragmentDeclaration>\n#include<helperFunctions>\n#include<subSurfaceScatteringFunctions>\n#include<importanceSampling>\n#include<pbrHelperFunctions>\n#include<imageProcessingFunctions>\n#include<shadowsFragmentFunctions>\n#include<harmonicsFunctions>\n#include<pbrDirectLightingSetupFunctions>\n#include<pbrDirectLightingFalloffFunctions>\n#include<pbrBRDFFunctions>\n#include<hdrFilteringFunctions>\n#include<pbrDirectLightingFunctions>\n#include<pbrIBLFunctions>\n#include<bumpFragmentMainFunctions>\n#include<bumpFragmentFunctions>\n#ifdef REFLECTION\n#include<reflectionFunction>\n#endif\n#define CUSTOM_FRAGMENT_DEFINITIONS\n#include<pbrBlockAlbedoOpacity>\n#include<pbrBlockReflectivity>\n#include<pbrBlockAmbientOcclusion>\n#include<pbrBlockAlphaFresnel>\n#include<pbrBlockAnisotropic>\n#include<pbrBlockReflection>\n#include<pbrBlockSheen>\n#include<pbrBlockClearcoat>\n#include<pbrBlockIridescence>\n#include<pbrBlockSubSurface>\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\n#include<pbrBlockNormalGeometric>\n#include<bumpFragment>\n#include<pbrBlockNormalFinal>\nalbedoOpacityOutParams albedoOpacityOut;\n#ifdef ALBEDO\nvec4 albedoTexture=texture2D(albedoSampler,vAlbedoUV+uvOffset);\n#endif\n#ifdef OPACITY\nvec4 opacityMap=texture2D(opacitySampler,vOpacityUV+uvOffset);\n#endif\n#ifdef DECAL\nvec4 decalColor=texture2D(decalSampler,vDecalUV+uvOffset);\n#endif\nalbedoOpacityBlock(\nvAlbedoColor,\n#ifdef ALBEDO\nalbedoTexture,\nvAlbedoInfos,\n#endif\n#ifdef OPACITY\nopacityMap,\nvOpacityInfos,\n#endif\n#ifdef DETAIL\ndetailColor,\nvDetailInfos,\n#endif\n#ifdef DECAL\ndecalColor,\nvDecalInfos,\n#endif\nalbedoOpacityOut\n);\nvec3 surfaceAlbedo=albedoOpacityOut.surfaceAlbedo;\nfloat alpha=albedoOpacityOut.alpha;\n#define CUSTOM_FRAGMENT_UPDATE_ALPHA\n#include<depthPrePass>\n#define CUSTOM_FRAGMENT_BEFORE_LIGHTS\nambientOcclusionOutParams aoOut;\n#ifdef AMBIENT\nvec3 ambientOcclusionColorMap=texture2D(ambientSampler,vAmbientUV+uvOffset).rgb;\n#endif\nambientOcclusionBlock(\n#ifdef AMBIENT\nambientOcclusionColorMap,\nvAmbientInfos,\n#endif\naoOut\n);\n#include<pbrBlockLightmapInit>\n#ifdef UNLIT\nvec3 diffuseBase=vec3(1.,1.,1.);\n#else\nvec3 baseColor=surfaceAlbedo;\nreflectivityOutParams reflectivityOut;\n#if defined(REFLECTIVITY)\nvec4 surfaceMetallicOrReflectivityColorMap=texture2D(reflectivitySampler,vReflectivityUV+uvOffset);\nvec4 baseReflectivity=surfaceMetallicOrReflectivityColorMap;\n#ifndef METALLICWORKFLOW\n#ifdef REFLECTIVITY_GAMMA\nsurfaceMetallicOrReflectivityColorMap=toLinearSpace(surfaceMetallicOrReflectivityColorMap);\n#endif\nsurfaceMetallicOrReflectivityColorMap.rgb*=vReflectivityInfos.y;\n#endif\n#endif\n#if defined(MICROSURFACEMAP)\nvec4 microSurfaceTexel=texture2D(microSurfaceSampler,vMicroSurfaceSamplerUV+uvOffset)*vMicroSurfaceSamplerInfos.y;\n#endif\n#ifdef METALLICWORKFLOW\nvec4 metallicReflectanceFactors=vMetallicReflectanceFactors;\n#ifdef REFLECTANCE\nvec4 reflectanceFactorsMap=texture2D(reflectanceSampler,vReflectanceUV+uvOffset);\n#ifdef REFLECTANCE_GAMMA\nreflectanceFactorsMap=toLinearSpace(reflectanceFactorsMap);\n#endif\nmetallicReflectanceFactors.rgb*=reflectanceFactorsMap.rgb;\n#endif\n#ifdef METALLIC_REFLECTANCE\nvec4 metallicReflectanceFactorsMap=texture2D(metallicReflectanceSampler,vMetallicReflectanceUV+uvOffset);\n#ifdef METALLIC_REFLECTANCE_GAMMA\nmetallicReflectanceFactorsMap=toLinearSpace(metallicReflectanceFactorsMap);\n#endif\n#ifndef METALLIC_REFLECTANCE_USE_ALPHA_ONLY\nmetallicReflectanceFactors.rgb*=metallicReflectanceFactorsMap.rgb;\n#endif\nmetallicReflectanceFactors*=metallicReflectanceFactorsMap.a;\n#endif\n#endif\nreflectivityBlock(\nvReflectivityColor,\n#ifdef METALLICWORKFLOW\nsurfaceAlbedo,\nmetallicReflectanceFactors,\n#endif\n#ifdef REFLECTIVITY\nvReflectivityInfos,\nsurfaceMetallicOrReflectivityColorMap,\n#endif\n#if defined(METALLICWORKFLOW) && defined(REFLECTIVITY) && defined(AOSTOREINMETALMAPRED)\naoOut.ambientOcclusionColor,\n#endif\n#ifdef MICROSURFACEMAP\nmicroSurfaceTexel,\n#endif\n#ifdef DETAIL\ndetailColor,\nvDetailInfos,\n#endif\nreflectivityOut\n);\nfloat microSurface=reflectivityOut.microSurface;\nfloat roughness=reflectivityOut.roughness;\n#ifdef METALLICWORKFLOW\nsurfaceAlbedo=reflectivityOut.surfaceAlbedo;\n#endif\n#if defined(METALLICWORKFLOW) && defined(REFLECTIVITY) && defined(AOSTOREINMETALMAPRED)\naoOut.ambientOcclusionColor=reflectivityOut.ambientOcclusionColor;\n#endif\n#ifdef ALPHAFRESNEL\n#if defined(ALPHATEST) || defined(ALPHABLEND)\nalphaFresnelOutParams alphaFresnelOut;\nalphaFresnelBlock(\nnormalW,\nviewDirectionW,\nalpha,\nmicroSurface,\nalphaFresnelOut\n);\nalpha=alphaFresnelOut.alpha;\n#endif\n#endif\n#include<pbrBlockGeometryInfo>\n#ifdef ANISOTROPIC\nanisotropicOutParams anisotropicOut;\n#ifdef ANISOTROPIC_TEXTURE\nvec3 anisotropyMapData=texture2D(anisotropySampler,vAnisotropyUV+uvOffset).rgb*vAnisotropyInfos.y;\n#endif\nanisotropicBlock(\nvAnisotropy,\n#ifdef ANISOTROPIC_TEXTURE\nanisotropyMapData,\n#endif\nTBN,\nnormalW,\nviewDirectionW,\nanisotropicOut\n);\n#endif\n#ifdef REFLECTION\nreflectionOutParams reflectionOut;\n#ifndef USE_CUSTOM_REFLECTION\nreflectionBlock(\nvPositionW,\nnormalW,\nalphaG,\nvReflectionMicrosurfaceInfos,\nvReflectionInfos,\nvReflectionColor,\n#ifdef ANISOTROPIC\nanisotropicOut,\n#endif\n#if defined(LODINREFLECTIONALPHA) && !defined(REFLECTIONMAP_SKYBOX)\nNdotVUnclamped,\n#endif\n#ifdef LINEARSPECULARREFLECTION\nroughness,\n#endif\nreflectionSampler,\n#if defined(NORMAL) && defined(USESPHERICALINVERTEX)\nvEnvironmentIrradiance,\n#endif\n#ifdef USESPHERICALFROMREFLECTIONMAP\n#if !defined(NORMAL) || !defined(USESPHERICALINVERTEX)\nreflectionMatrix,\n#endif\n#endif\n#ifdef USEIRRADIANCEMAP\nirradianceSampler,\n#endif\n#ifndef LODBASEDMICROSFURACE\nreflectionSamplerLow,\nreflectionSamplerHigh,\n#endif\n#ifdef REALTIME_FILTERING\nvReflectionFilteringInfo,\n#endif\nreflectionOut\n);\n#else\n#define CUSTOM_REFLECTION\n#endif\n#endif\n#include<pbrBlockReflectance0>\n#ifdef SHEEN\nsheenOutParams sheenOut;\n#ifdef SHEEN_TEXTURE\nvec4 sheenMapData=texture2D(sheenSampler,vSheenUV+uvOffset);\n#endif\n#if defined(SHEEN_ROUGHNESS) && defined(SHEEN_TEXTURE_ROUGHNESS) && !defined(SHEEN_TEXTURE_ROUGHNESS_IDENTICAL) && !defined(SHEEN_USE_ROUGHNESS_FROM_MAINTEXTURE)\nvec4 sheenMapRoughnessData=texture2D(sheenRoughnessSampler,vSheenRoughnessUV+uvOffset)*vSheenInfos.w;\n#endif\nsheenBlock(\nvSheenColor,\n#ifdef SHEEN_ROUGHNESS\nvSheenRoughness,\n#if defined(SHEEN_TEXTURE_ROUGHNESS) && !defined(SHEEN_TEXTURE_ROUGHNESS_IDENTICAL) && !defined(SHEEN_USE_ROUGHNESS_FROM_MAINTEXTURE)\nsheenMapRoughnessData,\n#endif\n#endif\nroughness,\n#ifdef SHEEN_TEXTURE\nsheenMapData,\nvSheenInfos.y,\n#endif\nreflectance,\n#ifdef SHEEN_LINKWITHALBEDO\nbaseColor,\nsurfaceAlbedo,\n#endif\n#ifdef ENVIRONMENTBRDF\nNdotV,\nenvironmentBrdf,\n#endif\n#if defined(REFLECTION) && defined(ENVIRONMENTBRDF)\nAARoughnessFactors,\nvReflectionMicrosurfaceInfos,\nvReflectionInfos,\nvReflectionColor,\nvLightingIntensity,\nreflectionSampler,\nreflectionOut.reflectionCoords,\nNdotVUnclamped,\n#ifndef LODBASEDMICROSFURACE\nreflectionSamplerLow,\nreflectionSamplerHigh,\n#endif\n#ifdef REALTIME_FILTERING\nvReflectionFilteringInfo,\n#endif\n#if !defined(REFLECTIONMAP_SKYBOX) && defined(RADIANCEOCCLUSION)\nseo,\n#endif\n#if !defined(REFLECTIONMAP_SKYBOX) && defined(HORIZONOCCLUSION) && defined(BUMP) && defined(REFLECTIONMAP_3D)\neho,\n#endif\n#endif\nsheenOut\n);\n#ifdef SHEEN_LINKWITHALBEDO\nsurfaceAlbedo=sheenOut.surfaceAlbedo;\n#endif\n#endif\n#ifdef CLEARCOAT\n#ifdef CLEARCOAT_TEXTURE\nvec2 clearCoatMapData=texture2D(clearCoatSampler,vClearCoatUV+uvOffset).rg*vClearCoatInfos.y;\n#endif\n#endif\n#ifdef IRIDESCENCE\niridescenceOutParams iridescenceOut;\n#ifdef IRIDESCENCE_TEXTURE\nvec2 iridescenceMapData=texture2D(iridescenceSampler,vIridescenceUV+uvOffset).rg*vIridescenceInfos.y;\n#endif\n#ifdef IRIDESCENCE_THICKNESS_TEXTURE\nvec2 iridescenceThicknessMapData=texture2D(iridescenceThicknessSampler,vIridescenceThicknessUV+uvOffset).rg*vIridescenceInfos.w;\n#endif\niridescenceBlock(\nvIridescenceParams,\nNdotV,\nspecularEnvironmentR0,\n#ifdef IRIDESCENCE_TEXTURE\niridescenceMapData,\n#endif\n#ifdef IRIDESCENCE_THICKNESS_TEXTURE\niridescenceThicknessMapData,\n#endif\n#ifdef CLEARCOAT\nNdotVUnclamped,\n#ifdef CLEARCOAT_TEXTURE\nclearCoatMapData,\n#endif\n#endif\niridescenceOut\n);\nfloat iridescenceIntensity=iridescenceOut.iridescenceIntensity;\nspecularEnvironmentR0=iridescenceOut.specularEnvironmentR0;\n#endif\nclearcoatOutParams clearcoatOut;\n#ifdef CLEARCOAT\n#if defined(CLEARCOAT_TEXTURE_ROUGHNESS) && !defined(CLEARCOAT_TEXTURE_ROUGHNESS_IDENTICAL) && !defined(CLEARCOAT_USE_ROUGHNESS_FROM_MAINTEXTURE)\nvec4 clearCoatMapRoughnessData=texture2D(clearCoatRoughnessSampler,vClearCoatRoughnessUV+uvOffset)*vClearCoatInfos.w;\n#endif\n#if defined(CLEARCOAT_TINT) && defined(CLEARCOAT_TINT_TEXTURE)\nvec4 clearCoatTintMapData=texture2D(clearCoatTintSampler,vClearCoatTintUV+uvOffset);\n#endif\n#ifdef CLEARCOAT_BUMP\nvec4 clearCoatBumpMapData=texture2D(clearCoatBumpSampler,vClearCoatBumpUV+uvOffset);\n#endif\nclearcoatBlock(\nvPositionW,\ngeometricNormalW,\nviewDirectionW,\nvClearCoatParams,\n#if defined(CLEARCOAT_TEXTURE_ROUGHNESS) && !defined(CLEARCOAT_TEXTURE_ROUGHNESS_IDENTICAL) && !defined(CLEARCOAT_USE_ROUGHNESS_FROM_MAINTEXTURE)\nclearCoatMapRoughnessData,\n#endif\nspecularEnvironmentR0,\n#ifdef CLEARCOAT_TEXTURE\nclearCoatMapData,\n#endif\n#ifdef CLEARCOAT_TINT\nvClearCoatTintParams,\nclearCoatColorAtDistance,\nvClearCoatRefractionParams,\n#ifdef CLEARCOAT_TINT_TEXTURE\nclearCoatTintMapData,\n#endif\n#endif\n#ifdef CLEARCOAT_BUMP\nvClearCoatBumpInfos,\nclearCoatBumpMapData,\nvClearCoatBumpUV,\n#if defined(TANGENT) && defined(NORMAL)\nvTBN,\n#else\nvClearCoatTangentSpaceParams,\n#endif\n#ifdef OBJECTSPACE_NORMALMAP\nnormalMatrix,\n#endif\n#endif\n#if defined(FORCENORMALFORWARD) && defined(NORMAL)\nfaceNormal,\n#endif\n#ifdef REFLECTION\nvReflectionMicrosurfaceInfos,\nvReflectionInfos,\nvReflectionColor,\nvLightingIntensity,\nreflectionSampler,\n#ifndef LODBASEDMICROSFURACE\nreflectionSamplerLow,\nreflectionSamplerHigh,\n#endif\n#ifdef REALTIME_FILTERING\nvReflectionFilteringInfo,\n#endif\n#endif\n#if defined(ENVIRONMENTBRDF) && !defined(REFLECTIONMAP_SKYBOX)\n#ifdef RADIANCEOCCLUSION\nambientMonochrome,\n#endif\n#endif\n#if defined(CLEARCOAT_BUMP) || defined(TWOSIDEDLIGHTING)\n(gl_FrontFacing ? 1. : -1.),\n#endif\nclearcoatOut\n);\n#else\nclearcoatOut.specularEnvironmentR0=specularEnvironmentR0;\n#endif\n#include<pbrBlockReflectance>\nsubSurfaceOutParams subSurfaceOut;\n#ifdef SUBSURFACE\n#ifdef SS_THICKNESSANDMASK_TEXTURE\nvec4 thicknessMap=texture2D(thicknessSampler,vThicknessUV+uvOffset);\n#endif\n#ifdef SS_REFRACTIONINTENSITY_TEXTURE\nvec4 refractionIntensityMap=texture2D(refractionIntensitySampler,vRefractionIntensityUV+uvOffset);\n#endif\n#ifdef SS_TRANSLUCENCYINTENSITY_TEXTURE\nvec4 translucencyIntensityMap=texture2D(translucencyIntensitySampler,vTranslucencyIntensityUV+uvOffset);\n#endif\nsubSurfaceBlock(\nvSubSurfaceIntensity,\nvThicknessParam,\nvTintColor,\nnormalW,\nspecularEnvironmentReflectance,\n#ifdef SS_THICKNESSANDMASK_TEXTURE\nthicknessMap,\n#endif\n#ifdef SS_REFRACTIONINTENSITY_TEXTURE\nrefractionIntensityMap,\n#endif\n#ifdef SS_TRANSLUCENCYINTENSITY_TEXTURE\ntranslucencyIntensityMap,\n#endif\n#ifdef REFLECTION\n#ifdef SS_TRANSLUCENCY\nreflectionMatrix,\n#ifdef USESPHERICALFROMREFLECTIONMAP\n#if !defined(NORMAL) || !defined(USESPHERICALINVERTEX)\nreflectionOut.irradianceVector,\n#endif\n#if defined(REALTIME_FILTERING)\nreflectionSampler,\nvReflectionFilteringInfo,\n#endif\n#endif\n#ifdef USEIRRADIANCEMAP\nirradianceSampler,\n#endif\n#endif\n#endif\n#if defined(SS_REFRACTION) || defined(SS_TRANSLUCENCY)\nsurfaceAlbedo,\n#endif\n#ifdef SS_REFRACTION\nvPositionW,\nviewDirectionW,\nview,\nvRefractionInfos,\nrefractionMatrix,\nvRefractionMicrosurfaceInfos,\nvLightingIntensity,\n#ifdef SS_LINKREFRACTIONTOTRANSPARENCY\nalpha,\n#endif\n#ifdef SS_LODINREFRACTIONALPHA\nNdotVUnclamped,\n#endif\n#ifdef SS_LINEARSPECULARREFRACTION\nroughness,\n#endif\nalphaG,\nrefractionSampler,\n#ifndef LODBASEDMICROSFURACE\nrefractionSamplerLow,\nrefractionSamplerHigh,\n#endif\n#ifdef ANISOTROPIC\nanisotropicOut,\n#endif\n#ifdef REALTIME_FILTERING\nvRefractionFilteringInfo,\n#endif\n#ifdef SS_USE_LOCAL_REFRACTIONMAP_CUBIC\nvRefractionPosition,\nvRefractionSize,\n#endif\n#endif\n#ifdef SS_TRANSLUCENCY\nvDiffusionDistance,\n#endif\nsubSurfaceOut\n);\n#ifdef SS_REFRACTION\nsurfaceAlbedo=subSurfaceOut.surfaceAlbedo;\n#ifdef SS_LINKREFRACTIONTOTRANSPARENCY\nalpha=subSurfaceOut.alpha;\n#endif\n#endif\n#else\nsubSurfaceOut.specularEnvironmentReflectance=specularEnvironmentReflectance;\n#endif\n#include<pbrBlockDirectLighting>\n#include<lightFragment>[0..maxSimultaneousLights]\n#include<pbrBlockFinalLitComponents>\n#endif \n#include<pbrBlockFinalUnlitComponents>\n#define CUSTOM_FRAGMENT_BEFORE_FINALCOLORCOMPOSITION\n#include<pbrBlockFinalColorComposition>\n#include<logDepthFragment>\n#include<fogFragment>(color,finalColor)\n#include<pbrBlockImageProcessing>\n#define CUSTOM_FRAGMENT_BEFORE_FRAGCOLOR\n#ifdef PREPASS\nfloat writeGeometryInfo=finalColor.a>0.4 ? 1.0 : 0.0;\n#ifdef PREPASS_POSITION\ngl_FragData[PREPASS_POSITION_INDEX]=vec4(vPositionW,writeGeometryInfo);\n#endif\n#ifdef PREPASS_VELOCITY\nvec2 a=(vCurrentPosition.xy/vCurrentPosition.w)*0.5+0.5;\nvec2 b=(vPreviousPosition.xy/vPreviousPosition.w)*0.5+0.5;\nvec2 velocity=abs(a-b);\nvelocity=vec2(pow(velocity.x,1.0/3.0),pow(velocity.y,1.0/3.0))*sign(a-b)*0.5+0.5;\ngl_FragData[PREPASS_VELOCITY_INDEX]=vec4(velocity,0.0,writeGeometryInfo);\n#endif\n#ifdef PREPASS_ALBEDO_SQRT\nvec3 sqAlbedo=sqrt(surfaceAlbedo); \n#endif\n#ifdef PREPASS_IRRADIANCE\nvec3 irradiance=finalDiffuse;\n#ifndef UNLIT\n#ifdef REFLECTION\nirradiance+=finalIrradiance;\n#endif\n#endif\n#ifdef SS_SCATTERING\ngl_FragData[0]=vec4(finalColor.rgb-irradiance,finalColor.a); \nirradiance/=sqAlbedo;\n#else\ngl_FragData[0]=finalColor; \nfloat scatteringDiffusionProfile=255.;\n#endif\ngl_FragData[PREPASS_IRRADIANCE_INDEX]=vec4(clamp(irradiance,vec3(0.),vec3(1.)),writeGeometryInfo*scatteringDiffusionProfile/255.); \n#else\ngl_FragData[0]=vec4(finalColor.rgb,finalColor.a);\n#endif\n#ifdef PREPASS_DEPTH\ngl_FragData[PREPASS_DEPTH_INDEX]=vec4(vViewPos.z,0.0,0.0,writeGeometryInfo); \n#endif\n#ifdef PREPASS_NORMAL\ngl_FragData[PREPASS_NORMAL_INDEX]=vec4(normalize((view*vec4(normalW,0.0)).rgb),writeGeometryInfo); \n#endif\n#ifdef PREPASS_ALBEDO_SQRT\ngl_FragData[PREPASS_ALBEDO_SQRT_INDEX]=vec4(sqAlbedo,writeGeometryInfo); \n#endif\n#ifdef PREPASS_REFLECTIVITY\n#ifndef UNLIT\ngl_FragData[PREPASS_REFLECTIVITY_INDEX]=vec4(specularEnvironmentR0,microSurface)*writeGeometryInfo;\n#else\ngl_FragData[PREPASS_REFLECTIVITY_INDEX]=vec4( 0.0,0.0,0.0,1.0 )*writeGeometryInfo;\n#endif\n#endif\n#endif\n#if !defined(PREPASS) || defined(WEBGL2)\ngl_FragColor=finalColor;\n#endif\n#include<oitFragment>\n#if ORDER_INDEPENDENT_TRANSPARENCY\nif (fragDepth==nearestDepth) {\nfrontColor.rgb+=finalColor.rgb*finalColor.a*alphaMultiplier;\nfrontColor.a=1.0-alphaMultiplier*(1.0-finalColor.a);\n} else {\nbackColor+=finalColor;\n}\n#endif\n#include<pbrDebug>\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n",i(5613);S.v.IncludesShadersStore.pbrVertexDeclaration="uniform mat4 view;\nuniform mat4 viewProjection;\n#ifdef ALBEDO\nuniform mat4 albedoMatrix;\nuniform vec2 vAlbedoInfos;\n#endif\n#ifdef AMBIENT\nuniform mat4 ambientMatrix;\nuniform vec4 vAmbientInfos;\n#endif\n#ifdef OPACITY\nuniform mat4 opacityMatrix;\nuniform vec2 vOpacityInfos;\n#endif\n#ifdef EMISSIVE\nuniform vec2 vEmissiveInfos;\nuniform mat4 emissiveMatrix;\n#endif\n#ifdef LIGHTMAP\nuniform vec2 vLightmapInfos;\nuniform mat4 lightmapMatrix;\n#endif\n#ifdef REFLECTIVITY \nuniform vec3 vReflectivityInfos;\nuniform mat4 reflectivityMatrix;\n#endif\n#ifdef METALLIC_REFLECTANCE\nuniform vec2 vMetallicReflectanceInfos;\nuniform mat4 metallicReflectanceMatrix;\n#endif\n#ifdef REFLECTANCE\nuniform vec2 vReflectanceInfos;\nuniform mat4 reflectanceMatrix;\n#endif\n#ifdef MICROSURFACEMAP\nuniform vec2 vMicroSurfaceSamplerInfos;\nuniform mat4 microSurfaceSamplerMatrix;\n#endif\n#ifdef BUMP\nuniform vec3 vBumpInfos;\nuniform mat4 bumpMatrix;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\n#ifdef REFLECTION\nuniform vec2 vReflectionInfos;\nuniform mat4 reflectionMatrix;\n#endif\n#ifdef CLEARCOAT\n#if defined(CLEARCOAT_TEXTURE) || defined(CLEARCOAT_TEXTURE_ROUGHNESS)\nuniform vec4 vClearCoatInfos;\n#endif\n#ifdef CLEARCOAT_TEXTURE\nuniform mat4 clearCoatMatrix;\n#endif\n#ifdef CLEARCOAT_TEXTURE_ROUGHNESS\nuniform mat4 clearCoatRoughnessMatrix;\n#endif\n#ifdef CLEARCOAT_BUMP\nuniform vec2 vClearCoatBumpInfos;\nuniform mat4 clearCoatBumpMatrix;\n#endif\n#ifdef CLEARCOAT_TINT_TEXTURE\nuniform vec2 vClearCoatTintInfos;\nuniform mat4 clearCoatTintMatrix;\n#endif\n#endif\n#ifdef IRIDESCENCE\n#if defined(IRIDESCENCE_TEXTURE) || defined(IRIDESCENCE_THICKNESS_TEXTURE)\nuniform vec4 vIridescenceInfos;\n#endif\n#ifdef IRIDESCENCE_TEXTURE\nuniform mat4 iridescenceMatrix;\n#endif\n#ifdef IRIDESCENCE_THICKNESS_TEXTURE\nuniform mat4 iridescenceThicknessMatrix;\n#endif\n#endif\n#ifdef ANISOTROPIC\n#ifdef ANISOTROPIC_TEXTURE\nuniform vec2 vAnisotropyInfos;\nuniform mat4 anisotropyMatrix;\n#endif\n#endif\n#ifdef SHEEN\n#if defined(SHEEN_TEXTURE) || defined(SHEEN_TEXTURE_ROUGHNESS)\nuniform vec4 vSheenInfos;\n#endif\n#ifdef SHEEN_TEXTURE\nuniform mat4 sheenMatrix;\n#endif\n#ifdef SHEEN_TEXTURE_ROUGHNESS\nuniform mat4 sheenRoughnessMatrix;\n#endif\n#endif\n#ifdef SUBSURFACE\n#ifdef SS_REFRACTION\nuniform vec4 vRefractionInfos;\nuniform mat4 refractionMatrix;\n#endif\n#ifdef SS_THICKNESSANDMASK_TEXTURE\nuniform vec2 vThicknessInfos;\nuniform mat4 thicknessMatrix;\n#endif\n#ifdef SS_REFRACTIONINTENSITY_TEXTURE\nuniform vec2 vRefractionIntensityInfos;\nuniform mat4 refractionIntensityMatrix;\n#endif\n#ifdef SS_TRANSLUCENCYINTENSITY_TEXTURE\nuniform vec2 vTranslucencyIntensityInfos;\nuniform mat4 translucencyIntensityMatrix;\n#endif\n#endif\n#ifdef NORMAL\n#if defined(USESPHERICALFROMREFLECTIONMAP) && defined(USESPHERICALINVERTEX)\n#ifdef USESPHERICALFROMREFLECTIONMAP\n#ifdef SPHERICAL_HARMONICS\nuniform vec3 vSphericalL00;\nuniform vec3 vSphericalL1_1;\nuniform vec3 vSphericalL10;\nuniform vec3 vSphericalL11;\nuniform vec3 vSphericalL2_2;\nuniform vec3 vSphericalL2_1;\nuniform vec3 vSphericalL20;\nuniform vec3 vSphericalL21;\nuniform vec3 vSphericalL22;\n#else\nuniform vec3 vSphericalX;\nuniform vec3 vSphericalY;\nuniform vec3 vSphericalZ;\nuniform vec3 vSphericalXX_ZZ;\nuniform vec3 vSphericalYY_ZZ;\nuniform vec3 vSphericalZZ;\nuniform vec3 vSphericalXY;\nuniform vec3 vSphericalYZ;\nuniform vec3 vSphericalZX;\n#endif\n#endif\n#endif\n#endif\n#ifdef DETAIL\nuniform vec4 vDetailInfos;\nuniform mat4 detailMatrix;\n#endif\n#include<decalVertexDeclaration>\n#define ADDITIONAL_VERTEX_DECLARATION\n",i(6467),i(7520),i(493),i(1063),i(7019),i(9478),i(2838),i(6343),i(9042),i(1542),i(9935),i(9901),i(8073),i(6757),i(9085),i(6883),i(6655),i(3206),i(8741),i(3088),i(2508),i(6255),i(5215),i(962),i(1101),i(9025),i(5501);S.v.ShadersStore.pbrVertexShader="precision highp float;\n#include<__decl__pbrVertex>\n#define CUSTOM_VERTEX_BEGIN\nattribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#ifdef TANGENT\nattribute vec4 tangent;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#include<uvAttributeDeclaration>[2..7]\n#include<mainUVVaryingDeclaration>[1..7]\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<helperFunctions>\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\n#include<prePassVertexDeclaration>\n#include<samplerVertexDeclaration>(_DEFINENAME_,ALBEDO,_VARYINGNAME_,Albedo)\n#include<samplerVertexDeclaration>(_DEFINENAME_,DETAIL,_VARYINGNAME_,Detail)\n#include<samplerVertexDeclaration>(_DEFINENAME_,AMBIENT,_VARYINGNAME_,Ambient)\n#include<samplerVertexDeclaration>(_DEFINENAME_,OPACITY,_VARYINGNAME_,Opacity)\n#include<samplerVertexDeclaration>(_DEFINENAME_,EMISSIVE,_VARYINGNAME_,Emissive)\n#include<samplerVertexDeclaration>(_DEFINENAME_,LIGHTMAP,_VARYINGNAME_,Lightmap)\n#include<samplerVertexDeclaration>(_DEFINENAME_,REFLECTIVITY,_VARYINGNAME_,Reflectivity)\n#include<samplerVertexDeclaration>(_DEFINENAME_,MICROSURFACEMAP,_VARYINGNAME_,MicroSurfaceSampler)\n#include<samplerVertexDeclaration>(_DEFINENAME_,METALLIC_REFLECTANCE,_VARYINGNAME_,MetallicReflectance)\n#include<samplerVertexDeclaration>(_DEFINENAME_,REFLECTANCE,_VARYINGNAME_,Reflectance)\n#include<samplerVertexDeclaration>(_DEFINENAME_,BUMP,_VARYINGNAME_,Bump)\n#include<samplerVertexDeclaration>(_DEFINENAME_,DECAL,_VARYINGNAME_,Decal)\n#ifdef CLEARCOAT\n#include<samplerVertexDeclaration>(_DEFINENAME_,CLEARCOAT_TEXTURE,_VARYINGNAME_,ClearCoat)\n#include<samplerVertexDeclaration>(_DEFINENAME_,CLEARCOAT_TEXTURE_ROUGHNESS,_VARYINGNAME_,ClearCoatRoughness)\n#include<samplerVertexDeclaration>(_DEFINENAME_,CLEARCOAT_BUMP,_VARYINGNAME_,ClearCoatBump)\n#include<samplerVertexDeclaration>(_DEFINENAME_,CLEARCOAT_TINT_TEXTURE,_VARYINGNAME_,ClearCoatTint)\n#endif\n#ifdef IRIDESCENCE\n#include<samplerVertexDeclaration>(_DEFINENAME_,IRIDESCENCE_TEXTURE,_VARYINGNAME_,Iridescence)\n#include<samplerVertexDeclaration>(_DEFINENAME_,IRIDESCENCE_THICKNESS_TEXTURE,_VARYINGNAME_,IridescenceThickness)\n#endif\n#ifdef SHEEN\n#include<samplerVertexDeclaration>(_DEFINENAME_,SHEEN_TEXTURE,_VARYINGNAME_,Sheen)\n#include<samplerVertexDeclaration>(_DEFINENAME_,SHEEN_TEXTURE_ROUGHNESS,_VARYINGNAME_,SheenRoughness)\n#endif\n#ifdef ANISOTROPIC\n#include<samplerVertexDeclaration>(_DEFINENAME_,ANISOTROPIC_TEXTURE,_VARYINGNAME_,Anisotropy)\n#endif\n#ifdef SUBSURFACE\n#include<samplerVertexDeclaration>(_DEFINENAME_,SS_THICKNESSANDMASK_TEXTURE,_VARYINGNAME_,Thickness)\n#include<samplerVertexDeclaration>(_DEFINENAME_,SS_REFRACTIONINTENSITY_TEXTURE,_VARYINGNAME_,RefractionIntensity)\n#include<samplerVertexDeclaration>(_DEFINENAME_,SS_TRANSLUCENCYINTENSITY_TEXTURE,_VARYINGNAME_,TranslucencyIntensity)\n#endif\nvarying vec3 vPositionW;\n#if DEBUGMODE>0\nvarying vec4 vClipSpacePosition;\n#endif\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#if defined(USESPHERICALFROMREFLECTIONMAP) && defined(USESPHERICALINVERTEX)\nvarying vec3 vEnvironmentIrradiance;\n#include<harmonicsFunctions>\n#endif\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#include<bumpVertexDeclaration>\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightVxFragment>[0..maxSimultaneousLights]\n#include<morphTargetsVertexGlobalDeclaration>\n#include<morphTargetsVertexDeclaration>[0..maxSimultaneousMorphTargets]\n#ifdef REFLECTIONMAP_SKYBOX\nvarying vec3 vPositionUVW;\n#endif\n#if defined(REFLECTIONMAP_EQUIRECTANGULAR_FIXED) || defined(REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED)\nvarying vec3 vDirectionW;\n#endif\n#include<logDepthDeclaration>\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nvec3 positionUpdated=position;\n#ifdef NORMAL\nvec3 normalUpdated=normal;\n#endif\n#ifdef TANGENT\nvec4 tangentUpdated=tangent;\n#endif\n#ifdef UV1\nvec2 uvUpdated=uv;\n#endif\n#include<morphTargetsVertexGlobal>\n#include<morphTargetsVertex>[0..maxSimultaneousMorphTargets]\n#ifdef REFLECTIONMAP_SKYBOX\nvPositionUVW=positionUpdated;\n#endif\n#define CUSTOM_VERTEX_UPDATE_POSITION\n#define CUSTOM_VERTEX_UPDATE_NORMAL\n#include<instancesVertex>\n#if defined(PREPASS) && defined(PREPASS_VELOCITY) && !defined(BONES_VELOCITY_ENABLED)\nvCurrentPosition=viewProjection*finalWorld*vec4(positionUpdated,1.0);\nvPreviousPosition=previousViewProjection*finalPreviousWorld*vec4(positionUpdated,1.0);\n#endif\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(positionUpdated,1.0);\nvPositionW=vec3(worldPos);\n#include<prePassVertex>\n#ifdef NORMAL\nmat3 normalWorld=mat3(finalWorld);\n#if defined(INSTANCES) && defined(THIN_INSTANCES)\nvNormalW=normalUpdated/vec3(dot(normalWorld[0],normalWorld[0]),dot(normalWorld[1],normalWorld[1]),dot(normalWorld[2],normalWorld[2]));\nvNormalW=normalize(normalWorld*vNormalW);\n#else\n#ifdef NONUNIFORMSCALING\nnormalWorld=transposeMat3(inverseMat3(normalWorld));\n#endif\nvNormalW=normalize(normalWorld*normalUpdated);\n#endif\n#if defined(USESPHERICALFROMREFLECTIONMAP) && defined(USESPHERICALINVERTEX)\nvec3 reflectionVector=vec3(reflectionMatrix*vec4(vNormalW,0)).xyz;\n#ifdef REFLECTIONMAP_OPPOSITEZ\nreflectionVector.z*=-1.0;\n#endif\nvEnvironmentIrradiance=computeEnvironmentIrradiance(reflectionVector);\n#endif\n#endif\n#define CUSTOM_VERTEX_UPDATE_WORLDPOS\n#ifdef MULTIVIEW\nif (gl_ViewID_OVR==0u) {\ngl_Position=viewProjection*worldPos;\n} else {\ngl_Position=viewProjectionR*worldPos;\n}\n#else\ngl_Position=viewProjection*worldPos;\n#endif\n#if DEBUGMODE>0\nvClipSpacePosition=gl_Position;\n#endif\n#if defined(REFLECTIONMAP_EQUIRECTANGULAR_FIXED) || defined(REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED)\nvDirectionW=normalize(vec3(finalWorld*vec4(positionUpdated,0.0)));\n#endif\n#ifndef UV1\nvec2 uvUpdated=vec2(0.,0.);\n#endif\n#ifdef MAINUV1\nvMainUV1=uvUpdated;\n#endif\n#include<uvVariableDeclaration>[2..7]\n#include<samplerVertexImplementation>(_DEFINENAME_,ALBEDO,_VARYINGNAME_,Albedo,_MATRIXNAME_,albedo,_INFONAME_,AlbedoInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,DETAIL,_VARYINGNAME_,Detail,_MATRIXNAME_,detail,_INFONAME_,DetailInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,AMBIENT,_VARYINGNAME_,Ambient,_MATRIXNAME_,ambient,_INFONAME_,AmbientInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,OPACITY,_VARYINGNAME_,Opacity,_MATRIXNAME_,opacity,_INFONAME_,OpacityInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,EMISSIVE,_VARYINGNAME_,Emissive,_MATRIXNAME_,emissive,_INFONAME_,EmissiveInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,LIGHTMAP,_VARYINGNAME_,Lightmap,_MATRIXNAME_,lightmap,_INFONAME_,LightmapInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,REFLECTIVITY,_VARYINGNAME_,Reflectivity,_MATRIXNAME_,reflectivity,_INFONAME_,ReflectivityInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,MICROSURFACEMAP,_VARYINGNAME_,MicroSurfaceSampler,_MATRIXNAME_,microSurfaceSampler,_INFONAME_,MicroSurfaceSamplerInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,METALLIC_REFLECTANCE,_VARYINGNAME_,MetallicReflectance,_MATRIXNAME_,metallicReflectance,_INFONAME_,MetallicReflectanceInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,REFLECTANCE,_VARYINGNAME_,Reflectance,_MATRIXNAME_,reflectance,_INFONAME_,ReflectanceInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,BUMP,_VARYINGNAME_,Bump,_MATRIXNAME_,bump,_INFONAME_,BumpInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,DECAL,_VARYINGNAME_,Decal,_MATRIXNAME_,decal,_INFONAME_,DecalInfos.x)\n#ifdef CLEARCOAT\n#include<samplerVertexImplementation>(_DEFINENAME_,CLEARCOAT_TEXTURE,_VARYINGNAME_,ClearCoat,_MATRIXNAME_,clearCoat,_INFONAME_,ClearCoatInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,CLEARCOAT_TEXTURE_ROUGHNESS,_VARYINGNAME_,ClearCoatRoughness,_MATRIXNAME_,clearCoatRoughness,_INFONAME_,ClearCoatInfos.z)\n#include<samplerVertexImplementation>(_DEFINENAME_,CLEARCOAT_BUMP,_VARYINGNAME_,ClearCoatBump,_MATRIXNAME_,clearCoatBump,_INFONAME_,ClearCoatBumpInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,CLEARCOAT_TINT_TEXTURE,_VARYINGNAME_,ClearCoatTint,_MATRIXNAME_,clearCoatTint,_INFONAME_,ClearCoatTintInfos.x)\n#endif\n#ifdef IRIDESCENCE\n#include<samplerVertexImplementation>(_DEFINENAME_,IRIDESCENCE_TEXTURE,_VARYINGNAME_,Iridescence,_MATRIXNAME_,iridescence,_INFONAME_,IridescenceInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,IRIDESCENCE_THICKNESS_TEXTURE,_VARYINGNAME_,IridescenceThickness,_MATRIXNAME_,iridescenceThickness,_INFONAME_,IridescenceInfos.z)\n#endif\n#ifdef SHEEN\n#include<samplerVertexImplementation>(_DEFINENAME_,SHEEN_TEXTURE,_VARYINGNAME_,Sheen,_MATRIXNAME_,sheen,_INFONAME_,SheenInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,SHEEN_TEXTURE_ROUGHNESS,_VARYINGNAME_,SheenRoughness,_MATRIXNAME_,sheen,_INFONAME_,SheenInfos.z)\n#endif\n#ifdef ANISOTROPIC\n#include<samplerVertexImplementation>(_DEFINENAME_,ANISOTROPIC_TEXTURE,_VARYINGNAME_,Anisotropy,_MATRIXNAME_,anisotropy,_INFONAME_,AnisotropyInfos.x)\n#endif\n#ifdef SUBSURFACE\n#include<samplerVertexImplementation>(_DEFINENAME_,SS_THICKNESSANDMASK_TEXTURE,_VARYINGNAME_,Thickness,_MATRIXNAME_,thickness,_INFONAME_,ThicknessInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,SS_REFRACTIONINTENSITY_TEXTURE,_VARYINGNAME_,RefractionIntensity,_MATRIXNAME_,refractionIntensity,_INFONAME_,RefractionIntensityInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,SS_TRANSLUCENCYINTENSITY_TEXTURE,_VARYINGNAME_,TranslucencyIntensity,_MATRIXNAME_,translucencyIntensity,_INFONAME_,TranslucencyIntensityInfos.x)\n#endif\n#include<bumpVertex>\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#include<vertexColorMixing>\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#include<logDepthVertex>\n#define CUSTOM_VERTEX_MAIN_END\n}";var E=i(1434),C=i(3077),A=i(3949),P=i(9482),R=i(4783),M=i(3808),I=i(6150),D=i(99);const O={effect:null,subMesh:null};class w extends v.H{constructor(e){super(e),this.PBR=!0,this.NUM_SAMPLES="0",this.REALTIME_FILTERING=!1,this.MAINUV1=!1,this.MAINUV2=!1,this.MAINUV3=!1,this.MAINUV4=!1,this.MAINUV5=!1,this.MAINUV6=!1,this.UV1=!1,this.UV2=!1,this.UV3=!1,this.UV4=!1,this.UV5=!1,this.UV6=!1,this.ALBEDO=!1,this.GAMMAALBEDO=!1,this.ALBEDODIRECTUV=0,this.VERTEXCOLOR=!1,this.BAKED_VERTEX_ANIMATION_TEXTURE=!1,this.AMBIENT=!1,this.AMBIENTDIRECTUV=0,this.AMBIENTINGRAYSCALE=!1,this.OPACITY=!1,this.VERTEXALPHA=!1,this.OPACITYDIRECTUV=0,this.OPACITYRGB=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.ALPHABLEND=!1,this.ALPHAFROMALBEDO=!1,this.ALPHATESTVALUE="0.5",this.SPECULAROVERALPHA=!1,this.RADIANCEOVERALPHA=!1,this.ALPHAFRESNEL=!1,this.LINEARALPHAFRESNEL=!1,this.PREMULTIPLYALPHA=!1,this.EMISSIVE=!1,this.EMISSIVEDIRECTUV=0,this.GAMMAEMISSIVE=!1,this.REFLECTIVITY=!1,this.REFLECTIVITY_GAMMA=!1,this.REFLECTIVITYDIRECTUV=0,this.SPECULARTERM=!1,this.MICROSURFACEFROMREFLECTIVITYMAP=!1,this.MICROSURFACEAUTOMATIC=!1,this.LODBASEDMICROSFURACE=!1,this.MICROSURFACEMAP=!1,this.MICROSURFACEMAPDIRECTUV=0,this.METALLICWORKFLOW=!1,this.ROUGHNESSSTOREINMETALMAPALPHA=!1,this.ROUGHNESSSTOREINMETALMAPGREEN=!1,this.METALLNESSSTOREINMETALMAPBLUE=!1,this.AOSTOREINMETALMAPRED=!1,this.METALLIC_REFLECTANCE=!1,this.METALLIC_REFLECTANCE_GAMMA=!1,this.METALLIC_REFLECTANCEDIRECTUV=0,this.METALLIC_REFLECTANCE_USE_ALPHA_ONLY=!1,this.REFLECTANCE=!1,this.REFLECTANCE_GAMMA=!1,this.REFLECTANCEDIRECTUV=0,this.ENVIRONMENTBRDF=!1,this.ENVIRONMENTBRDF_RGBD=!1,this.NORMAL=!1,this.TANGENT=!1,this.BUMP=!1,this.BUMPDIRECTUV=0,this.OBJECTSPACE_NORMALMAP=!1,this.PARALLAX=!1,this.PARALLAXOCCLUSION=!1,this.NORMALXYSCALE=!0,this.LIGHTMAP=!1,this.LIGHTMAPDIRECTUV=0,this.USELIGHTMAPASSHADOWMAP=!1,this.GAMMALIGHTMAP=!1,this.RGBDLIGHTMAP=!1,this.REFLECTION=!1,this.REFLECTIONMAP_3D=!1,this.REFLECTIONMAP_SPHERICAL=!1,this.REFLECTIONMAP_PLANAR=!1,this.REFLECTIONMAP_CUBIC=!1,this.USE_LOCAL_REFLECTIONMAP_CUBIC=!1,this.REFLECTIONMAP_PROJECTION=!1,this.REFLECTIONMAP_SKYBOX=!1,this.REFLECTIONMAP_EXPLICIT=!1,this.REFLECTIONMAP_EQUIRECTANGULAR=!1,this.REFLECTIONMAP_EQUIRECTANGULAR_FIXED=!1,this.REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED=!1,this.INVERTCUBICMAP=!1,this.USESPHERICALFROMREFLECTIONMAP=!1,this.USEIRRADIANCEMAP=!1,this.USESPHERICALINVERTEX=!1,this.REFLECTIONMAP_OPPOSITEZ=!1,this.LODINREFLECTIONALPHA=!1,this.GAMMAREFLECTION=!1,this.RGBDREFLECTION=!1,this.LINEARSPECULARREFLECTION=!1,this.RADIANCEOCCLUSION=!1,this.HORIZONOCCLUSION=!1,this.INSTANCES=!1,this.THIN_INSTANCES=!1,this.INSTANCESCOLOR=!1,this.PREPASS=!1,this.PREPASS_IRRADIANCE=!1,this.PREPASS_IRRADIANCE_INDEX=-1,this.PREPASS_ALBEDO_SQRT=!1,this.PREPASS_ALBEDO_SQRT_INDEX=-1,this.PREPASS_DEPTH=!1,this.PREPASS_DEPTH_INDEX=-1,this.PREPASS_NORMAL=!1,this.PREPASS_NORMAL_INDEX=-1,this.PREPASS_POSITION=!1,this.PREPASS_POSITION_INDEX=-1,this.PREPASS_VELOCITY=!1,this.PREPASS_VELOCITY_INDEX=-1,this.PREPASS_REFLECTIVITY=!1,this.PREPASS_REFLECTIVITY_INDEX=-1,this.SCENE_MRT_COUNT=0,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.BONETEXTURE=!1,this.BONES_VELOCITY_ENABLED=!1,this.NONUNIFORMSCALING=!1,this.MORPHTARGETS=!1,this.MORPHTARGETS_NORMAL=!1,this.MORPHTARGETS_TANGENT=!1,this.MORPHTARGETS_UV=!1,this.NUM_MORPH_INFLUENCERS=0,this.MORPHTARGETS_TEXTURE=!1,this.IMAGEPROCESSING=!1,this.VIGNETTE=!1,this.VIGNETTEBLENDMODEMULTIPLY=!1,this.VIGNETTEBLENDMODEOPAQUE=!1,this.TONEMAPPING=!1,this.TONEMAPPING_ACES=!1,this.CONTRAST=!1,this.COLORCURVES=!1,this.COLORGRADING=!1,this.COLORGRADING3D=!1,this.SAMPLER3DGREENDEPTH=!1,this.SAMPLER3DBGRMAP=!1,this.DITHER=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.EXPOSURE=!1,this.MULTIVIEW=!1,this.ORDER_INDEPENDENT_TRANSPARENCY=!1,this.ORDER_INDEPENDENT_TRANSPARENCY_16BITS=!1,this.USEPHYSICALLIGHTFALLOFF=!1,this.USEGLTFLIGHTFALLOFF=!1,this.TWOSIDEDLIGHTING=!1,this.SHADOWFLOAT=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.POINTSIZE=!1,this.FOG=!1,this.LOGARITHMICDEPTH=!1,this.CAMERA_ORTHOGRAPHIC=!1,this.CAMERA_PERSPECTIVE=!1,this.FORCENORMALFORWARD=!1,this.SPECULARAA=!1,this.UNLIT=!1,this.DEBUGMODE=0,this.rebuild()}reset(){super.reset(),this.ALPHATESTVALUE="0.5",this.PBR=!0,this.NORMALXYSCALE=!0}}class N extends y.a{get realTimeFiltering(){return this._realTimeFiltering}set realTimeFiltering(e){this._realTimeFiltering=e,this.markAsDirty(1)}get realTimeFilteringQuality(){return this._realTimeFilteringQuality}set realTimeFilteringQuality(e){this._realTimeFilteringQuality=e,this.markAsDirty(1)}get canRenderToMRT(){return!0}_attachImageProcessingConfiguration(e){e!==this._imageProcessingConfiguration&&(this._imageProcessingConfiguration&&this._imageProcessingObserver&&this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver),this._imageProcessingConfiguration=e||this.getScene().imageProcessingConfiguration,this._imageProcessingConfiguration&&(this._imageProcessingObserver=this._imageProcessingConfiguration.onUpdateParameters.add((()=>{this._markAllSubMeshesAsImageProcessingDirty()}))))}constructor(e,t){super(e,t),this._directIntensity=1,this._emissiveIntensity=1,this._environmentIntensity=1,this._specularIntensity=1,this._lightingInfos=new h.Lt(this._directIntensity,this._emissiveIntensity,this._environmentIntensity,this._specularIntensity),this._disableBumpMap=!1,this._albedoTexture=null,this._ambientTexture=null,this._ambientTextureStrength=1,this._ambientTextureImpactOnAnalyticalLights=N.DEFAULT_AO_ON_ANALYTICAL_LIGHTS,this._opacityTexture=null,this._reflectionTexture=null,this._emissiveTexture=null,this._reflectivityTexture=null,this._metallicTexture=null,this._metallic=null,this._roughness=null,this._metallicF0Factor=1,this._metallicReflectanceColor=p.Wo.White(),this._useOnlyMetallicFromMetallicReflectanceTexture=!1,this._metallicReflectanceTexture=null,this._reflectanceTexture=null,this._microSurfaceTexture=null,this._bumpTexture=null,this._lightmapTexture=null,this._ambientColor=new p.Wo(0,0,0),this._albedoColor=new p.Wo(1,1,1),this._reflectivityColor=new p.Wo(1,1,1),this._reflectionColor=new p.Wo(1,1,1),this._emissiveColor=new p.Wo(0,0,0),this._microSurface=.9,this._useLightmapAsShadowmap=!1,this._useHorizonOcclusion=!0,this._useRadianceOcclusion=!0,this._useAlphaFromAlbedoTexture=!1,this._useSpecularOverAlpha=!0,this._useMicroSurfaceFromReflectivityMapAlpha=!1,this._useRoughnessFromMetallicTextureAlpha=!0,this._useRoughnessFromMetallicTextureGreen=!1,this._useMetallnessFromMetallicTextureBlue=!1,this._useAmbientOcclusionFromMetallicTextureRed=!1,this._useAmbientInGrayScale=!1,this._useAutoMicroSurfaceFromReflectivityMap=!1,this._lightFalloff=N.LIGHTFALLOFF_PHYSICAL,this._useRadianceOverAlpha=!0,this._useObjectSpaceNormalMap=!1,this._useParallax=!1,this._useParallaxOcclusion=!1,this._parallaxScaleBias=.05,this._disableLighting=!1,this._maxSimultaneousLights=4,this._invertNormalMapX=!1,this._invertNormalMapY=!1,this._twoSidedLighting=!1,this._alphaCutOff=.4,this._forceAlphaTest=!1,this._useAlphaFresnel=!1,this._useLinearAlphaFresnel=!1,this._environmentBRDFTexture=null,this._forceIrradianceInFragment=!1,this._realTimeFiltering=!1,this._realTimeFilteringQuality=8,this._forceNormalForward=!1,this._enableSpecularAntiAliasing=!1,this._imageProcessingObserver=null,this._renderTargets=new o.t(16),this._globalAmbientColor=new p.Wo(0,0,0),this._useLogarithmicDepth=!1,this._unlit=!1,this._debugMode=0,this.debugMode=0,this.debugLimit=-1,this.debugFactor=1,this._cacheHasRenderTargetTextures=!1,this.brdf=new u.d(this),this.clearCoat=new C.Y(this),this.iridescence=new A.B(this),this.anisotropy=new P.u(this),this.sheen=new R.B(this),this.subSurface=new M.u(this),this.detailMap=new I.p(this),this._attachImageProcessingConfiguration(null),this.getRenderTargetTextures=()=>(this._renderTargets.reset(),T.k.ReflectionTextureEnabled&&this._reflectionTexture&&this._reflectionTexture.isRenderTarget&&this._renderTargets.push(this._reflectionTexture),this._eventInfo.renderTargets=this._renderTargets,this._callbackPluginEventFillRenderTargetTextures(this._eventInfo),this._renderTargets),this._environmentBRDFTexture=(0,a.$)(this.getScene()),this.prePassConfiguration=new d.o}get hasRenderTargetTextures(){return!!(T.k.ReflectionTextureEnabled&&this._reflectionTexture&&this._reflectionTexture.isRenderTarget)||this._cacheHasRenderTargetTextures}get isPrePassCapable(){return!this.disableDepthWrite}getClassName(){return"PBRBaseMaterial"}get useLogarithmicDepth(){return this._useLogarithmicDepth}set useLogarithmicDepth(e){this._useLogarithmicDepth=e&&this.getScene().getEngine().getCaps().fragmentDepthSupported}get _disableAlphaBlending(){var e;return this._transparencyMode===N.PBRMATERIAL_OPAQUE||this._transparencyMode===N.PBRMATERIAL_ALPHATEST||(null===(e=this.subSurface)||void 0===e?void 0:e.disableAlphaBlending)}needAlphaBlending(){return!this._disableAlphaBlending&&(this.alpha<1||null!=this._opacityTexture||this._shouldUseAlphaFromAlbedoTexture())}needAlphaTesting(){var e;return!!this._forceAlphaTest||!(null===(e=this.subSurface)||void 0===e?void 0:e.disableAlphaBlending)&&this._hasAlphaChannel()&&(null==this._transparencyMode||this._transparencyMode===N.PBRMATERIAL_ALPHATEST)}_shouldUseAlphaFromAlbedoTexture(){return null!=this._albedoTexture&&this._albedoTexture.hasAlpha&&this._useAlphaFromAlbedoTexture&&this._transparencyMode!==N.PBRMATERIAL_OPAQUE}_hasAlphaChannel(){return null!=this._albedoTexture&&this._albedoTexture.hasAlpha||null!=this._opacityTexture}getAlphaTestTexture(){return this._albedoTexture}isReadyForSubMesh(e,t,i){if(this._uniformBufferLayoutBuilt||this.buildUniformLayout(),t.effect&&this.isFrozen&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(this._callbackPluginEventGeneric(g.S.GetDefineNames,this._eventInfo),t.materialDefines=new w(this._eventInfo.defineNames));const n=t.materialDefines;if(this._isReadyForSubMesh(t))return!0;const s=this.getScene(),o=s.getEngine();if(n._areTexturesDirty&&(this._eventInfo.hasRenderTargetTextures=!1,this._callbackPluginEventHasRenderTargetTextures(this._eventInfo),this._cacheHasRenderTargetTextures=this._eventInfo.hasRenderTargetTextures,s.texturesEnabled)){if(this._albedoTexture&&T.k.DiffuseTextureEnabled&&!this._albedoTexture.isReadyOrNotBlocking())return!1;if(this._ambientTexture&&T.k.AmbientTextureEnabled&&!this._ambientTexture.isReadyOrNotBlocking())return!1;if(this._opacityTexture&&T.k.OpacityTextureEnabled&&!this._opacityTexture.isReadyOrNotBlocking())return!1;const e=this._getReflectionTexture();if(e&&T.k.ReflectionTextureEnabled){if(!e.isReadyOrNotBlocking())return!1;if(e.irradianceTexture&&!e.irradianceTexture.isReadyOrNotBlocking())return!1}if(this._lightmapTexture&&T.k.LightmapTextureEnabled&&!this._lightmapTexture.isReadyOrNotBlocking())return!1;if(this._emissiveTexture&&T.k.EmissiveTextureEnabled&&!this._emissiveTexture.isReadyOrNotBlocking())return!1;if(T.k.SpecularTextureEnabled){if(this._metallicTexture){if(!this._metallicTexture.isReadyOrNotBlocking())return!1}else if(this._reflectivityTexture&&!this._reflectivityTexture.isReadyOrNotBlocking())return!1;if(this._metallicReflectanceTexture&&!this._metallicReflectanceTexture.isReadyOrNotBlocking())return!1;if(this._reflectanceTexture&&!this._reflectanceTexture.isReadyOrNotBlocking())return!1;if(this._microSurfaceTexture&&!this._microSurfaceTexture.isReadyOrNotBlocking())return!1}if(o.getCaps().standardDerivatives&&this._bumpTexture&&T.k.BumpTextureEnabled&&!this._disableBumpMap&&!this._bumpTexture.isReady())return!1;if(this._environmentBRDFTexture&&T.k.ReflectionTextureEnabled&&!this._environmentBRDFTexture.isReady())return!1}if(this._eventInfo.isReadyForSubMesh=!0,this._eventInfo.defines=n,this._eventInfo.subMesh=t,this._callbackPluginEventIsReadyForSubMesh(this._eventInfo),!this._eventInfo.isReadyForSubMesh)return!1;if(n._areImageProcessingDirty&&this._imageProcessingConfiguration&&!this._imageProcessingConfiguration.isReady())return!1;o.getCaps().standardDerivatives||e.isVerticesDataPresent(c.o.NormalKind)||(e.createNormals(!0),r.Y.Warn("PBRMaterial: Normals have been created for the mesh: "+e.name));const a=t.effect,l=n._areLightsDisposed;let h=this._prepareEffect(e,n,this.onCompiled,this.onError,i,null,t.getRenderingMesh().hasThinInstances),u=!1;if(h)if(this._onEffectCreatedObservable&&(O.effect=h,O.subMesh=t,this._onEffectCreatedObservable.notifyObservers(O)),this.allowShaderHotSwapping&&a&&!h.isReady()){if(h=a,n.markAsUnprocessed(),u=this.isFrozen,l)return n._areLightsDisposed=!0,!1}else s.resetCachedMaterial(),t.setEffect(h,n,this._materialContext);return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!u,t.effect._wasPreviouslyUsingInstances=!!i,this._checkScenePerformancePriority(),0))}isMetallicWorkflow(){return!(null==this._metallic&&null==this._roughness&&!this._metallicTexture)}_prepareEffect(e,t,i=null,n=null,s=null,r=null,o){if(this._prepareDefines(e,t,s,r,o),!t.isDirty)return null;t.markAsProcessed();const a=this.getScene().getEngine(),l=new E.L;let h=0;t.USESPHERICALINVERTEX&&l.addFallback(h++,"USESPHERICALINVERTEX"),t.FOG&&l.addFallback(h,"FOG"),t.SPECULARAA&&l.addFallback(h,"SPECULARAA"),t.POINTSIZE&&l.addFallback(h,"POINTSIZE"),t.LOGARITHMICDEPTH&&l.addFallback(h,"LOGARITHMICDEPTH"),t.PARALLAX&&l.addFallback(h,"PARALLAX"),t.PARALLAXOCCLUSION&&l.addFallback(h++,"PARALLAXOCCLUSION"),t.ENVIRONMENTBRDF&&l.addFallback(h++,"ENVIRONMENTBRDF"),t.TANGENT&&l.addFallback(h++,"TANGENT"),t.BUMP&&l.addFallback(h++,"BUMP"),h=x.G.HandleFallbacksForShadows(t,l,this._maxSimultaneousLights,h++),t.SPECULARTERM&&l.addFallback(h++,"SPECULARTERM"),t.USESPHERICALFROMREFLECTIONMAP&&l.addFallback(h++,"USESPHERICALFROMREFLECTIONMAP"),t.USEIRRADIANCEMAP&&l.addFallback(h++,"USEIRRADIANCEMAP"),t.LIGHTMAP&&l.addFallback(h++,"LIGHTMAP"),t.NORMAL&&l.addFallback(h++,"NORMAL"),t.AMBIENT&&l.addFallback(h++,"AMBIENT"),t.EMISSIVE&&l.addFallback(h++,"EMISSIVE"),t.VERTEXCOLOR&&l.addFallback(h++,"VERTEXCOLOR"),t.MORPHTARGETS&&l.addFallback(h++,"MORPHTARGETS"),t.MULTIVIEW&&l.addFallback(0,"MULTIVIEW");const u=[c.o.PositionKind];t.NORMAL&&u.push(c.o.NormalKind),t.TANGENT&&u.push(c.o.TangentKind);for(let e=1;e<=6;++e)t["UV"+e]&&u.push(`uv${1===e?"":e}`);t.VERTEXCOLOR&&u.push(c.o.ColorKind),t.INSTANCESCOLOR&&u.push(c.o.ColorInstanceKind),x.G.PrepareAttributesForBones(u,e,t,l),x.G.PrepareAttributesForInstances(u,t),x.G.PrepareAttributesForMorphTargets(u,e,t),x.G.PrepareAttributesForBakedVertexAnimation(u,e,t);let p="pbr";const f=["world","view","viewProjection","vEyePosition","vLightsType","vAmbientColor","vAlbedoColor","vReflectivityColor","vMetallicReflectanceFactors","vEmissiveColor","visibility","vReflectionColor","vFogInfos","vFogColor","pointSize","vAlbedoInfos","vAmbientInfos","vOpacityInfos","vReflectionInfos","vReflectionPosition","vReflectionSize","vEmissiveInfos","vReflectivityInfos","vReflectionFilteringInfo","vMetallicReflectanceInfos","vReflectanceInfos","vMicroSurfaceSamplerInfos","vBumpInfos","vLightmapInfos","mBones","albedoMatrix","ambientMatrix","opacityMatrix","reflectionMatrix","emissiveMatrix","reflectivityMatrix","normalMatrix","microSurfaceSamplerMatrix","bumpMatrix","lightmapMatrix","metallicReflectanceMatrix","reflectanceMatrix","vLightingIntensity","logarithmicDepthConstant","vSphericalX","vSphericalY","vSphericalZ","vSphericalXX_ZZ","vSphericalYY_ZZ","vSphericalZZ","vSphericalXY","vSphericalYZ","vSphericalZX","vSphericalL00","vSphericalL1_1","vSphericalL10","vSphericalL11","vSphericalL2_2","vSphericalL2_1","vSphericalL20","vSphericalL21","vSphericalL22","vReflectionMicrosurfaceInfos","vTangentSpaceParams","boneTextureWidth","vDebugMode","morphTargetTextureInfo","morphTargetTextureIndices"],m=["albedoSampler","reflectivitySampler","ambientSampler","emissiveSampler","bumpSampler","lightmapSampler","opacitySampler","reflectionSampler","reflectionSamplerLow","reflectionSamplerHigh","irradianceSampler","microSurfaceSampler","environmentBrdfSampler","boneSampler","metallicReflectanceSampler","reflectanceSampler","morphTargets","oitDepthSampler","oitFrontColorSampler"],v=["Material","Scene","Mesh"];this._eventInfo.fallbacks=l,this._eventInfo.fallbackRank=h,this._eventInfo.defines=t,this._eventInfo.uniforms=f,this._eventInfo.attributes=u,this._eventInfo.samplers=m,this._eventInfo.uniformBuffersNames=v,this._eventInfo.customCode=void 0,this._eventInfo.mesh=e,this._callbackPluginEventGeneric(g.S.PrepareEffect,this._eventInfo),d.o.AddUniforms(f),d.o.AddSamplers(m),(0,D.qx)(f),_.$&&(_.$.PrepareUniforms(f,t),_.$.PrepareSamplers(m,t)),x.G.PrepareUniformsAndSamplersList({uniformsNames:f,uniformBuffersNames:v,samplers:m,defines:t,maxSimultaneousLights:this._maxSimultaneousLights});const y={};this.customShaderNameResolve&&(p=this.customShaderNameResolve(p,f,v,m,t,u,y));const b=t.toString(),T=a.createEffect(p,{attributes:u,uniformsNames:f,uniformBuffersNames:v,samplers:m,defines:b,fallbacks:l,onCompiled:i,onError:n,indexParameters:{maxSimultaneousLights:this._maxSimultaneousLights,maxSimultaneousMorphTargets:t.NUM_MORPH_INFLUENCERS},processFinalCode:y.processFinalCode,processCodeAfterIncludes:this._eventInfo.customCode,multiTarget:t.PREPASS},a);return this._eventInfo.customCode=void 0,T}_prepareDefines(e,t,i=null,n=null,s=!1){var r;const o=this.getScene(),a=o.getEngine();x.G.PrepareDefinesForLights(o,e,t,!0,this._maxSimultaneousLights,this._disableLighting),t._needNormals=!0,x.G.PrepareDefinesForMultiview(o,t);const l=this.needAlphaBlendingForMesh(e)&&this.getScene().useOrderIndependentTransparency;if(x.G.PrepareDefinesForPrePass(o,t,this.canRenderToMRT&&!l),x.G.PrepareDefinesForOIT(o,t,l),t.METALLICWORKFLOW=this.isMetallicWorkflow(),t._areTexturesDirty){t._needUVs=!1;for(let e=1;e<=6;++e)t["MAINUV"+e]=!1;if(o.texturesEnabled){t.ALBEDODIRECTUV=0,t.AMBIENTDIRECTUV=0,t.OPACITYDIRECTUV=0,t.EMISSIVEDIRECTUV=0,t.REFLECTIVITYDIRECTUV=0,t.MICROSURFACEMAPDIRECTUV=0,t.METALLIC_REFLECTANCEDIRECTUV=0,t.REFLECTANCEDIRECTUV=0,t.BUMPDIRECTUV=0,t.LIGHTMAPDIRECTUV=0,a.getCaps().textureLOD&&(t.LODBASEDMICROSFURACE=!0),this._albedoTexture&&T.k.DiffuseTextureEnabled?(x.G.PrepareDefinesForMergedUV(this._albedoTexture,t,"ALBEDO"),t.GAMMAALBEDO=this._albedoTexture.gammaSpace):t.ALBEDO=!1,this._ambientTexture&&T.k.AmbientTextureEnabled?(x.G.PrepareDefinesForMergedUV(this._ambientTexture,t,"AMBIENT"),t.AMBIENTINGRAYSCALE=this._useAmbientInGrayScale):t.AMBIENT=!1,this._opacityTexture&&T.k.OpacityTextureEnabled?(x.G.PrepareDefinesForMergedUV(this._opacityTexture,t,"OPACITY"),t.OPACITYRGB=this._opacityTexture.getAlphaFromRGB):t.OPACITY=!1;const e=this._getReflectionTexture();if(e&&T.k.ReflectionTextureEnabled){switch(t.REFLECTION=!0,t.GAMMAREFLECTION=e.gammaSpace,t.RGBDREFLECTION=e.isRGBD,t.LODINREFLECTIONALPHA=e.lodLevelInAlpha,t.LINEARSPECULARREFLECTION=e.linearSpecularLOD,this.realTimeFiltering&&this.realTimeFilteringQuality>0?(t.NUM_SAMPLES=""+this.realTimeFilteringQuality,a._features.needTypeSuffixInShaderConstants&&(t.NUM_SAMPLES=t.NUM_SAMPLES+"u"),t.REALTIME_FILTERING=!0):t.REALTIME_FILTERING=!1,t.INVERTCUBICMAP=e.coordinatesMode===b.x.INVCUBIC_MODE,t.REFLECTIONMAP_3D=e.isCube,t.REFLECTIONMAP_OPPOSITEZ=t.REFLECTIONMAP_3D&&this.getScene().useRightHandedSystem?!e.invertZ:e.invertZ,t.REFLECTIONMAP_CUBIC=!1,t.REFLECTIONMAP_EXPLICIT=!1,t.REFLECTIONMAP_PLANAR=!1,t.REFLECTIONMAP_PROJECTION=!1,t.REFLECTIONMAP_SKYBOX=!1,t.REFLECTIONMAP_SPHERICAL=!1,t.REFLECTIONMAP_EQUIRECTANGULAR=!1,t.REFLECTIONMAP_EQUIRECTANGULAR_FIXED=!1,t.REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED=!1,e.coordinatesMode){case b.x.EXPLICIT_MODE:t.REFLECTIONMAP_EXPLICIT=!0;break;case b.x.PLANAR_MODE:t.REFLECTIONMAP_PLANAR=!0;break;case b.x.PROJECTION_MODE:t.REFLECTIONMAP_PROJECTION=!0;break;case b.x.SKYBOX_MODE:t.REFLECTIONMAP_SKYBOX=!0;break;case b.x.SPHERICAL_MODE:t.REFLECTIONMAP_SPHERICAL=!0;break;case b.x.EQUIRECTANGULAR_MODE:t.REFLECTIONMAP_EQUIRECTANGULAR=!0;break;case b.x.FIXED_EQUIRECTANGULAR_MODE:t.REFLECTIONMAP_EQUIRECTANGULAR_FIXED=!0;break;case b.x.FIXED_EQUIRECTANGULAR_MIRRORED_MODE:t.REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED=!0;break;case b.x.CUBIC_MODE:case b.x.INVCUBIC_MODE:default:t.REFLECTIONMAP_CUBIC=!0,t.USE_LOCAL_REFLECTIONMAP_CUBIC=!!e.boundingBoxSize}e.coordinatesMode!==b.x.SKYBOX_MODE&&(e.irradianceTexture?(t.USEIRRADIANCEMAP=!0,t.USESPHERICALFROMREFLECTIONMAP=!1):e.isCube&&(t.USESPHERICALFROMREFLECTIONMAP=!0,t.USEIRRADIANCEMAP=!1,this._forceIrradianceInFragment||this.realTimeFiltering||a.getCaps().maxVaryingVectors<=8?t.USESPHERICALINVERTEX=!1:t.USESPHERICALINVERTEX=!0))}else t.REFLECTION=!1,t.REFLECTIONMAP_3D=!1,t.REFLECTIONMAP_SPHERICAL=!1,t.REFLECTIONMAP_PLANAR=!1,t.REFLECTIONMAP_CUBIC=!1,t.USE_LOCAL_REFLECTIONMAP_CUBIC=!1,t.REFLECTIONMAP_PROJECTION=!1,t.REFLECTIONMAP_SKYBOX=!1,t.REFLECTIONMAP_EXPLICIT=!1,t.REFLECTIONMAP_EQUIRECTANGULAR=!1,t.REFLECTIONMAP_EQUIRECTANGULAR_FIXED=!1,t.REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED=!1,t.INVERTCUBICMAP=!1,t.USESPHERICALFROMREFLECTIONMAP=!1,t.USEIRRADIANCEMAP=!1,t.USESPHERICALINVERTEX=!1,t.REFLECTIONMAP_OPPOSITEZ=!1,t.LODINREFLECTIONALPHA=!1,t.GAMMAREFLECTION=!1,t.RGBDREFLECTION=!1,t.LINEARSPECULARREFLECTION=!1;if(this._lightmapTexture&&T.k.LightmapTextureEnabled?(x.G.PrepareDefinesForMergedUV(this._lightmapTexture,t,"LIGHTMAP"),t.USELIGHTMAPASSHADOWMAP=this._useLightmapAsShadowmap,t.GAMMALIGHTMAP=this._lightmapTexture.gammaSpace,t.RGBDLIGHTMAP=this._lightmapTexture.isRGBD):t.LIGHTMAP=!1,this._emissiveTexture&&T.k.EmissiveTextureEnabled?(x.G.PrepareDefinesForMergedUV(this._emissiveTexture,t,"EMISSIVE"),t.GAMMAEMISSIVE=this._emissiveTexture.gammaSpace):t.EMISSIVE=!1,T.k.SpecularTextureEnabled){if(this._metallicTexture?(x.G.PrepareDefinesForMergedUV(this._metallicTexture,t,"REFLECTIVITY"),t.ROUGHNESSSTOREINMETALMAPALPHA=this._useRoughnessFromMetallicTextureAlpha,t.ROUGHNESSSTOREINMETALMAPGREEN=!this._useRoughnessFromMetallicTextureAlpha&&this._useRoughnessFromMetallicTextureGreen,t.METALLNESSSTOREINMETALMAPBLUE=this._useMetallnessFromMetallicTextureBlue,t.AOSTOREINMETALMAPRED=this._useAmbientOcclusionFromMetallicTextureRed,t.REFLECTIVITY_GAMMA=!1):this._reflectivityTexture?(x.G.PrepareDefinesForMergedUV(this._reflectivityTexture,t,"REFLECTIVITY"),t.MICROSURFACEFROMREFLECTIVITYMAP=this._useMicroSurfaceFromReflectivityMapAlpha,t.MICROSURFACEAUTOMATIC=this._useAutoMicroSurfaceFromReflectivityMap,t.REFLECTIVITY_GAMMA=this._reflectivityTexture.gammaSpace):t.REFLECTIVITY=!1,this._metallicReflectanceTexture||this._reflectanceTexture){const e=null!==this._metallicReflectanceTexture&&this._metallicReflectanceTexture._texture===(null===(r=this._reflectanceTexture)||void 0===r?void 0:r._texture)&&this._metallicReflectanceTexture.checkTransformsAreIdentical(this._reflectanceTexture);t.METALLIC_REFLECTANCE_USE_ALPHA_ONLY=this._useOnlyMetallicFromMetallicReflectanceTexture&&!e,this._metallicReflectanceTexture?(x.G.PrepareDefinesForMergedUV(this._metallicReflectanceTexture,t,"METALLIC_REFLECTANCE"),t.METALLIC_REFLECTANCE_GAMMA=this._metallicReflectanceTexture.gammaSpace):t.METALLIC_REFLECTANCE=!1,this._reflectanceTexture&&!e&&(!this._metallicReflectanceTexture||this._metallicReflectanceTexture&&this._useOnlyMetallicFromMetallicReflectanceTexture)?(x.G.PrepareDefinesForMergedUV(this._reflectanceTexture,t,"REFLECTANCE"),t.REFLECTANCE_GAMMA=this._reflectanceTexture.gammaSpace):t.REFLECTANCE=!1}else t.METALLIC_REFLECTANCE=!1,t.REFLECTANCE=!1;this._microSurfaceTexture?x.G.PrepareDefinesForMergedUV(this._microSurfaceTexture,t,"MICROSURFACEMAP"):t.MICROSURFACEMAP=!1}else t.REFLECTIVITY=!1,t.MICROSURFACEMAP=!1;a.getCaps().standardDerivatives&&this._bumpTexture&&T.k.BumpTextureEnabled&&!this._disableBumpMap?(x.G.PrepareDefinesForMergedUV(this._bumpTexture,t,"BUMP"),this._useParallax&&this._albedoTexture&&T.k.DiffuseTextureEnabled?(t.PARALLAX=!0,t.PARALLAXOCCLUSION=!!this._useParallaxOcclusion):t.PARALLAX=!1,t.OBJECTSPACE_NORMALMAP=this._useObjectSpaceNormalMap):(t.BUMP=!1,t.PARALLAX=!1,t.PARALLAXOCCLUSION=!1,t.OBJECTSPACE_NORMALMAP=!1),this._environmentBRDFTexture&&T.k.ReflectionTextureEnabled?(t.ENVIRONMENTBRDF=!0,t.ENVIRONMENTBRDF_RGBD=this._environmentBRDFTexture.isRGBD):(t.ENVIRONMENTBRDF=!1,t.ENVIRONMENTBRDF_RGBD=!1),this._shouldUseAlphaFromAlbedoTexture()?t.ALPHAFROMALBEDO=!0:t.ALPHAFROMALBEDO=!1}t.SPECULAROVERALPHA=this._useSpecularOverAlpha,this._lightFalloff===N.LIGHTFALLOFF_STANDARD?(t.USEPHYSICALLIGHTFALLOFF=!1,t.USEGLTFLIGHTFALLOFF=!1):this._lightFalloff===N.LIGHTFALLOFF_GLTF?(t.USEPHYSICALLIGHTFALLOFF=!1,t.USEGLTFLIGHTFALLOFF=!0):(t.USEPHYSICALLIGHTFALLOFF=!0,t.USEGLTFLIGHTFALLOFF=!1),t.RADIANCEOVERALPHA=this._useRadianceOverAlpha,!this.backFaceCulling&&this._twoSidedLighting?t.TWOSIDEDLIGHTING=!0:t.TWOSIDEDLIGHTING=!1,t.SPECULARAA=a.getCaps().standardDerivatives&&this._enableSpecularAntiAliasing}(t._areTexturesDirty||t._areMiscDirty)&&(t.ALPHATESTVALUE=`${this._alphaCutOff}${this._alphaCutOff%1==0?".":""}`,t.PREMULTIPLYALPHA=7===this.alphaMode||8===this.alphaMode,t.ALPHABLEND=this.needAlphaBlendingForMesh(e),t.ALPHAFRESNEL=this._useAlphaFresnel||this._useLinearAlphaFresnel,t.LINEARALPHAFRESNEL=this._useLinearAlphaFresnel),t._areImageProcessingDirty&&this._imageProcessingConfiguration&&this._imageProcessingConfiguration.prepareDefines(t),t.FORCENORMALFORWARD=this._forceNormalForward,t.RADIANCEOCCLUSION=this._useRadianceOcclusion,t.HORIZONOCCLUSION=this._useHorizonOcclusion,t._areMiscDirty&&(x.G.PrepareDefinesForMisc(e,o,this._useLogarithmicDepth,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e)||this._forceAlphaTest,t),t.UNLIT=this._unlit||(this.pointsCloud||this.wireframe)&&!e.isVerticesDataPresent(c.o.NormalKind),t.DEBUGMODE=this._debugMode),x.G.PrepareDefinesForFrameBoundValues(o,a,this,t,!!i,n,s),this._eventInfo.defines=t,this._eventInfo.mesh=e,this._callbackPluginEventPrepareDefinesBeforeAttributes(this._eventInfo),x.G.PrepareDefinesForAttributes(e,t,!0,!0,!0,this._transparencyMode!==N.PBRMATERIAL_OPAQUE),this._callbackPluginEventPrepareDefines(this._eventInfo)}forceCompilation(e,t,i){const n={clipPlane:!1,useInstances:!1,...i};this._uniformBufferLayoutBuilt||this.buildUniformLayout(),this._callbackPluginEventGeneric(g.S.GetDefineNames,this._eventInfo);const s=new w(this._eventInfo.defineNames),r=this._prepareEffect(e,s,void 0,void 0,n.useInstances,n.clipPlane,e.hasThinInstances);this._onEffectCreatedObservable&&(O.effect=r,O.subMesh=null,this._onEffectCreatedObservable.notifyObservers(O)),r.isReady()?t&&t(this):r.onCompileObservable.add((()=>{t&&t(this)}))}buildUniformLayout(){const e=this._uniformBuffer;e.addUniform("vAlbedoInfos",2),e.addUniform("vAmbientInfos",4),e.addUniform("vOpacityInfos",2),e.addUniform("vEmissiveInfos",2),e.addUniform("vLightmapInfos",2),e.addUniform("vReflectivityInfos",3),e.addUniform("vMicroSurfaceSamplerInfos",2),e.addUniform("vReflectionInfos",2),e.addUniform("vReflectionFilteringInfo",2),e.addUniform("vReflectionPosition",3),e.addUniform("vReflectionSize",3),e.addUniform("vBumpInfos",3),e.addUniform("albedoMatrix",16),e.addUniform("ambientMatrix",16),e.addUniform("opacityMatrix",16),e.addUniform("emissiveMatrix",16),e.addUniform("lightmapMatrix",16),e.addUniform("reflectivityMatrix",16),e.addUniform("microSurfaceSamplerMatrix",16),e.addUniform("bumpMatrix",16),e.addUniform("vTangentSpaceParams",2),e.addUniform("reflectionMatrix",16),e.addUniform("vReflectionColor",3),e.addUniform("vAlbedoColor",4),e.addUniform("vLightingIntensity",4),e.addUniform("vReflectionMicrosurfaceInfos",3),e.addUniform("pointSize",1),e.addUniform("vReflectivityColor",4),e.addUniform("vEmissiveColor",3),e.addUniform("vAmbientColor",3),e.addUniform("vDebugMode",2),e.addUniform("vMetallicReflectanceFactors",4),e.addUniform("vMetallicReflectanceInfos",2),e.addUniform("metallicReflectanceMatrix",16),e.addUniform("vReflectanceInfos",2),e.addUniform("reflectanceMatrix",16),e.addUniform("vSphericalL00",3),e.addUniform("vSphericalL1_1",3),e.addUniform("vSphericalL10",3),e.addUniform("vSphericalL11",3),e.addUniform("vSphericalL2_2",3),e.addUniform("vSphericalL2_1",3),e.addUniform("vSphericalL20",3),e.addUniform("vSphericalL21",3),e.addUniform("vSphericalL22",3),e.addUniform("vSphericalX",3),e.addUniform("vSphericalY",3),e.addUniform("vSphericalZ",3),e.addUniform("vSphericalXX_ZZ",3),e.addUniform("vSphericalYY_ZZ",3),e.addUniform("vSphericalZZ",3),e.addUniform("vSphericalXY",3),e.addUniform("vSphericalYZ",3),e.addUniform("vSphericalZX",3),super.buildUniformLayout()}bindForSubMesh(e,t,i){var n,s,r,o;const a=this.getScene(),h=i.materialDefines;if(!h)return;const c=i.effect;if(!c)return;this._activeEffect=c,t.getMeshUniformBuffer().bindToEffect(c,"Mesh"),t.transferToEffect(e);const u=a.getEngine();this._uniformBuffer.bindToEffect(c,"Material"),this.prePassConfiguration.bindForSubMesh(this._activeEffect,a,t,e,this.isFrozen),this._eventInfo.subMesh=i,this._callbackPluginEventHardBindForSubMesh(this._eventInfo),h.OBJECTSPACE_NORMALMAP&&(e.toNormalMatrix(this._normalMatrix),this.bindOnlyNormalMatrix(this._normalMatrix));const d=c._forceRebindOnNextCall||this._mustRebind(a,c,t.visibility);x.G.BindBonesParameters(t,this._activeEffect,this.prePassConfiguration);let _=null;const m=this._uniformBuffer;if(d){if(this.bindViewProjection(c),_=this._getReflectionTexture(),!m.useUbo||!this.isFrozen||!m.isSync||c._forceRebindOnNextCall){if(a.texturesEnabled){if(this._albedoTexture&&T.k.DiffuseTextureEnabled&&(m.updateFloat2("vAlbedoInfos",this._albedoTexture.coordinatesIndex,this._albedoTexture.level),x.G.BindTextureMatrix(this._albedoTexture,m,"albedo")),this._ambientTexture&&T.k.AmbientTextureEnabled&&(m.updateFloat4("vAmbientInfos",this._ambientTexture.coordinatesIndex,this._ambientTexture.level,this._ambientTextureStrength,this._ambientTextureImpactOnAnalyticalLights),x.G.BindTextureMatrix(this._ambientTexture,m,"ambient")),this._opacityTexture&&T.k.OpacityTextureEnabled&&(m.updateFloat2("vOpacityInfos",this._opacityTexture.coordinatesIndex,this._opacityTexture.level),x.G.BindTextureMatrix(this._opacityTexture,m,"opacity")),_&&T.k.ReflectionTextureEnabled){if(m.updateMatrix("reflectionMatrix",_.getReflectionTextureMatrix()),m.updateFloat2("vReflectionInfos",_.level,0),_.boundingBoxSize){const e=_;m.updateVector3("vReflectionPosition",e.boundingBoxPosition),m.updateVector3("vReflectionSize",e.boundingBoxSize)}if(this.realTimeFiltering){const e=_.getSize().width;m.updateFloat2("vReflectionFilteringInfo",e,f.R.Log2(e))}if(!h.USEIRRADIANCEMAP){const e=_.sphericalPolynomial;if(h.USESPHERICALFROMREFLECTIONMAP&&e)if(h.SPHERICAL_HARMONICS){const t=e.preScaledHarmonics;m.updateVector3("vSphericalL00",t.l00),m.updateVector3("vSphericalL1_1",t.l1_1),m.updateVector3("vSphericalL10",t.l10),m.updateVector3("vSphericalL11",t.l11),m.updateVector3("vSphericalL2_2",t.l2_2),m.updateVector3("vSphericalL2_1",t.l2_1),m.updateVector3("vSphericalL20",t.l20),m.updateVector3("vSphericalL21",t.l21),m.updateVector3("vSphericalL22",t.l22)}else m.updateFloat3("vSphericalX",e.x.x,e.x.y,e.x.z),m.updateFloat3("vSphericalY",e.y.x,e.y.y,e.y.z),m.updateFloat3("vSphericalZ",e.z.x,e.z.y,e.z.z),m.updateFloat3("vSphericalXX_ZZ",e.xx.x-e.zz.x,e.xx.y-e.zz.y,e.xx.z-e.zz.z),m.updateFloat3("vSphericalYY_ZZ",e.yy.x-e.zz.x,e.yy.y-e.zz.y,e.yy.z-e.zz.z),m.updateFloat3("vSphericalZZ",e.zz.x,e.zz.y,e.zz.z),m.updateFloat3("vSphericalXY",e.xy.x,e.xy.y,e.xy.z),m.updateFloat3("vSphericalYZ",e.yz.x,e.yz.y,e.yz.z),m.updateFloat3("vSphericalZX",e.zx.x,e.zx.y,e.zx.z)}m.updateFloat3("vReflectionMicrosurfaceInfos",_.getSize().width,_.lodGenerationScale,_.lodGenerationOffset)}this._emissiveTexture&&T.k.EmissiveTextureEnabled&&(m.updateFloat2("vEmissiveInfos",this._emissiveTexture.coordinatesIndex,this._emissiveTexture.level),x.G.BindTextureMatrix(this._emissiveTexture,m,"emissive")),this._lightmapTexture&&T.k.LightmapTextureEnabled&&(m.updateFloat2("vLightmapInfos",this._lightmapTexture.coordinatesIndex,this._lightmapTexture.level),x.G.BindTextureMatrix(this._lightmapTexture,m,"lightmap")),T.k.SpecularTextureEnabled&&(this._metallicTexture?(m.updateFloat3("vReflectivityInfos",this._metallicTexture.coordinatesIndex,this._metallicTexture.level,this._ambientTextureStrength),x.G.BindTextureMatrix(this._metallicTexture,m,"reflectivity")):this._reflectivityTexture&&(m.updateFloat3("vReflectivityInfos",this._reflectivityTexture.coordinatesIndex,this._reflectivityTexture.level,1),x.G.BindTextureMatrix(this._reflectivityTexture,m,"reflectivity")),this._metallicReflectanceTexture&&(m.updateFloat2("vMetallicReflectanceInfos",this._metallicReflectanceTexture.coordinatesIndex,this._metallicReflectanceTexture.level),x.G.BindTextureMatrix(this._metallicReflectanceTexture,m,"metallicReflectance")),this._reflectanceTexture&&h.REFLECTANCE&&(m.updateFloat2("vReflectanceInfos",this._reflectanceTexture.coordinatesIndex,this._reflectanceTexture.level),x.G.BindTextureMatrix(this._reflectanceTexture,m,"reflectance")),this._microSurfaceTexture&&(m.updateFloat2("vMicroSurfaceSamplerInfos",this._microSurfaceTexture.coordinatesIndex,this._microSurfaceTexture.level),x.G.BindTextureMatrix(this._microSurfaceTexture,m,"microSurfaceSampler"))),this._bumpTexture&&u.getCaps().standardDerivatives&&T.k.BumpTextureEnabled&&!this._disableBumpMap&&(m.updateFloat3("vBumpInfos",this._bumpTexture.coordinatesIndex,this._bumpTexture.level,this._parallaxScaleBias),x.G.BindTextureMatrix(this._bumpTexture,m,"bump"),a._mirroredCameraPosition?m.updateFloat2("vTangentSpaceParams",this._invertNormalMapX?1:-1,this._invertNormalMapY?1:-1):m.updateFloat2("vTangentSpaceParams",this._invertNormalMapX?-1:1,this._invertNormalMapY?-1:1))}if(this.pointsCloud&&m.updateFloat("pointSize",this.pointSize),h.METALLICWORKFLOW){p.zZ.Color3[0].r=void 0===this._metallic||null===this._metallic?1:this._metallic,p.zZ.Color3[0].g=void 0===this._roughness||null===this._roughness?1:this._roughness,m.updateColor4("vReflectivityColor",p.zZ.Color3[0],1);const e=null!==(s=null===(n=this.subSurface)||void 0===n?void 0:n._indexOfRefraction)&&void 0!==s?s:1.5,t=1,i=Math.pow((e-t)/(e+t),2);this._metallicReflectanceColor.scaleToRef(i*this._metallicF0Factor,p.zZ.Color3[0]);const r=this._metallicF0Factor;m.updateColor4("vMetallicReflectanceFactors",p.zZ.Color3[0],r)}else m.updateColor4("vReflectivityColor",this._reflectivityColor,this._microSurface);m.updateColor3("vEmissiveColor",T.k.EmissiveTextureEnabled?this._emissiveColor:p.Wo.BlackReadOnly),m.updateColor3("vReflectionColor",this._reflectionColor),!h.SS_REFRACTION&&(null===(r=this.subSurface)||void 0===r?void 0:r._linkRefractionWithTransparency)?m.updateColor4("vAlbedoColor",this._albedoColor,1):m.updateColor4("vAlbedoColor",this._albedoColor,this.alpha),this._lightingInfos.x=this._directIntensity,this._lightingInfos.y=this._emissiveIntensity,this._lightingInfos.z=this._environmentIntensity*a.environmentIntensity,this._lightingInfos.w=this._specularIntensity,m.updateVector4("vLightingIntensity",this._lightingInfos),a.ambientColor.multiplyToRef(this._ambientColor,this._globalAmbientColor),m.updateColor3("vAmbientColor",this._globalAmbientColor),m.updateFloat2("vDebugMode",this.debugLimit,this.debugFactor)}a.texturesEnabled&&(this._albedoTexture&&T.k.DiffuseTextureEnabled&&m.setTexture("albedoSampler",this._albedoTexture),this._ambientTexture&&T.k.AmbientTextureEnabled&&m.setTexture("ambientSampler",this._ambientTexture),this._opacityTexture&&T.k.OpacityTextureEnabled&&m.setTexture("opacitySampler",this._opacityTexture),_&&T.k.ReflectionTextureEnabled&&(h.LODBASEDMICROSFURACE?m.setTexture("reflectionSampler",_):(m.setTexture("reflectionSampler",_._lodTextureMid||_),m.setTexture("reflectionSamplerLow",_._lodTextureLow||_),m.setTexture("reflectionSamplerHigh",_._lodTextureHigh||_)),h.USEIRRADIANCEMAP&&m.setTexture("irradianceSampler",_.irradianceTexture)),h.ENVIRONMENTBRDF&&m.setTexture("environmentBrdfSampler",this._environmentBRDFTexture),this._emissiveTexture&&T.k.EmissiveTextureEnabled&&m.setTexture("emissiveSampler",this._emissiveTexture),this._lightmapTexture&&T.k.LightmapTextureEnabled&&m.setTexture("lightmapSampler",this._lightmapTexture),T.k.SpecularTextureEnabled&&(this._metallicTexture?m.setTexture("reflectivitySampler",this._metallicTexture):this._reflectivityTexture&&m.setTexture("reflectivitySampler",this._reflectivityTexture),this._metallicReflectanceTexture&&m.setTexture("metallicReflectanceSampler",this._metallicReflectanceTexture),this._reflectanceTexture&&h.REFLECTANCE&&m.setTexture("reflectanceSampler",this._reflectanceTexture),this._microSurfaceTexture&&m.setTexture("microSurfaceSampler",this._microSurfaceTexture)),this._bumpTexture&&u.getCaps().standardDerivatives&&T.k.BumpTextureEnabled&&!this._disableBumpMap&&m.setTexture("bumpSampler",this._bumpTexture)),this.getScene().useOrderIndependentTransparency&&this.needAlphaBlendingForMesh(t)&&this.getScene().depthPeelingRenderer.bind(c),this._eventInfo.subMesh=i,this._callbackPluginEventBindForSubMesh(this._eventInfo),(0,D.an)(this._activeEffect,this,a),this.bindEyePosition(c)}else a.getEngine()._features.needToAlwaysBindUniformBuffers&&(this._needToBindSceneUbo=!0);!d&&this.isFrozen||(a.lightsEnabled&&!this._disableLighting&&x.G.BindLights(a,t,this._activeEffect,h,this._maxSimultaneousLights),(a.fogEnabled&&t.applyFog&&a.fogMode!==l.x.FOGMODE_NONE||_||t.receiveShadows||h.PREPASS)&&this.bindView(c),x.G.BindFogParameters(a,t,this._activeEffect,!0),h.NUM_MORPH_INFLUENCERS&&x.G.BindMorphTargetParameters(t,this._activeEffect),h.BAKED_VERTEX_ANIMATION_TEXTURE&&(null===(o=t.bakedVertexAnimationManager)||void 0===o||o.bind(c,h.INSTANCES)),this._imageProcessingConfiguration.bind(this._activeEffect),x.G.BindLogDepth(h,this._activeEffect,a)),this._afterBind(t,this._activeEffect),m.update()}getAnimatables(){const e=super.getAnimatables();return this._albedoTexture&&this._albedoTexture.animations&&this._albedoTexture.animations.length>0&&e.push(this._albedoTexture),this._ambientTexture&&this._ambientTexture.animations&&this._ambientTexture.animations.length>0&&e.push(this._ambientTexture),this._opacityTexture&&this._opacityTexture.animations&&this._opacityTexture.animations.length>0&&e.push(this._opacityTexture),this._reflectionTexture&&this._reflectionTexture.animations&&this._reflectionTexture.animations.length>0&&e.push(this._reflectionTexture),this._emissiveTexture&&this._emissiveTexture.animations&&this._emissiveTexture.animations.length>0&&e.push(this._emissiveTexture),this._metallicTexture&&this._metallicTexture.animations&&this._metallicTexture.animations.length>0?e.push(this._metallicTexture):this._reflectivityTexture&&this._reflectivityTexture.animations&&this._reflectivityTexture.animations.length>0&&e.push(this._reflectivityTexture),this._bumpTexture&&this._bumpTexture.animations&&this._bumpTexture.animations.length>0&&e.push(this._bumpTexture),this._lightmapTexture&&this._lightmapTexture.animations&&this._lightmapTexture.animations.length>0&&e.push(this._lightmapTexture),this._metallicReflectanceTexture&&this._metallicReflectanceTexture.animations&&this._metallicReflectanceTexture.animations.length>0&&e.push(this._metallicReflectanceTexture),this._reflectanceTexture&&this._reflectanceTexture.animations&&this._reflectanceTexture.animations.length>0&&e.push(this._reflectanceTexture),this._microSurfaceTexture&&this._microSurfaceTexture.animations&&this._microSurfaceTexture.animations.length>0&&e.push(this._microSurfaceTexture),e}_getReflectionTexture(){return this._reflectionTexture?this._reflectionTexture:this.getScene().environmentTexture}getActiveTextures(){const e=super.getActiveTextures();return this._albedoTexture&&e.push(this._albedoTexture),this._ambientTexture&&e.push(this._ambientTexture),this._opacityTexture&&e.push(this._opacityTexture),this._reflectionTexture&&e.push(this._reflectionTexture),this._emissiveTexture&&e.push(this._emissiveTexture),this._reflectivityTexture&&e.push(this._reflectivityTexture),this._metallicTexture&&e.push(this._metallicTexture),this._metallicReflectanceTexture&&e.push(this._metallicReflectanceTexture),this._reflectanceTexture&&e.push(this._reflectanceTexture),this._microSurfaceTexture&&e.push(this._microSurfaceTexture),this._bumpTexture&&e.push(this._bumpTexture),this._lightmapTexture&&e.push(this._lightmapTexture),e}hasTexture(e){return!!super.hasTexture(e)||this._albedoTexture===e||this._ambientTexture===e||this._opacityTexture===e||this._reflectionTexture===e||this._emissiveTexture===e||this._reflectivityTexture===e||this._metallicTexture===e||this._metallicReflectanceTexture===e||this._reflectanceTexture===e||this._microSurfaceTexture===e||this._bumpTexture===e||this._lightmapTexture===e}setPrePassRenderer(){var e;if(!(null===(e=this.subSurface)||void 0===e?void 0:e.isScatteringEnabled))return!1;const t=this.getScene().enableSubSurfaceForPrePass();return t&&(t.enabled=!0),!0}dispose(e,t){var i,n,s,r,o,a,l,h,c,u,d,p;t&&(this._environmentBRDFTexture&&this.getScene().environmentBRDFTexture!==this._environmentBRDFTexture&&this._environmentBRDFTexture.dispose(),null===(i=this._albedoTexture)||void 0===i||i.dispose(),null===(n=this._ambientTexture)||void 0===n||n.dispose(),null===(s=this._opacityTexture)||void 0===s||s.dispose(),null===(r=this._reflectionTexture)||void 0===r||r.dispose(),null===(o=this._emissiveTexture)||void 0===o||o.dispose(),null===(a=this._metallicTexture)||void 0===a||a.dispose(),null===(l=this._reflectivityTexture)||void 0===l||l.dispose(),null===(h=this._bumpTexture)||void 0===h||h.dispose(),null===(c=this._lightmapTexture)||void 0===c||c.dispose(),null===(u=this._metallicReflectanceTexture)||void 0===u||u.dispose(),null===(d=this._reflectanceTexture)||void 0===d||d.dispose(),null===(p=this._microSurfaceTexture)||void 0===p||p.dispose()),this._renderTargets.dispose(),this._imageProcessingConfiguration&&this._imageProcessingObserver&&this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver),super.dispose(e,t)}}N.PBRMATERIAL_OPAQUE=m.F.MATERIAL_OPAQUE,N.PBRMATERIAL_ALPHATEST=m.F.MATERIAL_ALPHATEST,N.PBRMATERIAL_ALPHABLEND=m.F.MATERIAL_ALPHABLEND,N.PBRMATERIAL_ALPHATESTANDBLEND=m.F.MATERIAL_ALPHATESTANDBLEND,N.DEFAULT_AO_ON_ANALYTICAL_LIGHTS=0,N.LIGHTFALLOFF_PHYSICAL=0,N.LIGHTFALLOFF_GLTF=1,N.LIGHTFALLOFF_STANDARD=2,(0,n.gn)([(0,s.rX)()],N.prototype,"_imageProcessingConfiguration",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsMiscDirty")],N.prototype,"debugMode",void 0),(0,n.gn)([(0,s.qC)()],N.prototype,"useLogarithmicDepth",null)},3077:(e,t,i)=>{i.d(t,{Y:()=>u,d:()=>c});var n=i(9472),s=i(3956),r=i(4649),o=i(85),a=i(5346),l=i(8449),h=i(1917);class c extends h.H{constructor(){super(...arguments),this.CLEARCOAT=!1,this.CLEARCOAT_DEFAULTIOR=!1,this.CLEARCOAT_TEXTURE=!1,this.CLEARCOAT_TEXTURE_ROUGHNESS=!1,this.CLEARCOAT_TEXTUREDIRECTUV=0,this.CLEARCOAT_TEXTURE_ROUGHNESSDIRECTUV=0,this.CLEARCOAT_BUMP=!1,this.CLEARCOAT_BUMPDIRECTUV=0,this.CLEARCOAT_USE_ROUGHNESS_FROM_MAINTEXTURE=!1,this.CLEARCOAT_TEXTURE_ROUGHNESS_IDENTICAL=!1,this.CLEARCOAT_REMAP_F0=!1,this.CLEARCOAT_TINT=!1,this.CLEARCOAT_TINT_TEXTURE=!1,this.CLEARCOAT_TINT_TEXTUREDIRECTUV=0,this.CLEARCOAT_TINT_GAMMATEXTURE=!1}}class u extends l.n{_markAllSubMeshesAsTexturesDirty(){this._enable(this._isEnabled),this._internalMarkAllSubMeshesAsTexturesDirty()}constructor(e,t=!0){super(e,"PBRClearCoat",100,new c,t),this._isEnabled=!1,this.isEnabled=!1,this.intensity=1,this.roughness=0,this._indexOfRefraction=u._DefaultIndexOfRefraction,this.indexOfRefraction=u._DefaultIndexOfRefraction,this._texture=null,this.texture=null,this._useRoughnessFromMainTexture=!0,this.useRoughnessFromMainTexture=!0,this._textureRoughness=null,this.textureRoughness=null,this._remapF0OnInterfaceChange=!0,this.remapF0OnInterfaceChange=!0,this._bumpTexture=null,this.bumpTexture=null,this._isTintEnabled=!1,this.isTintEnabled=!1,this.tintColor=r.Wo.White(),this.tintColorAtDistance=1,this.tintThickness=1,this._tintTexture=null,this.tintTexture=null,this._internalMarkAllSubMeshesAsTexturesDirty=e._dirtyCallbacks[1]}isReadyForSubMesh(e,t,i){if(!this._isEnabled)return!0;const n=this._material._disableBumpMap;if(e._areTexturesDirty&&t.texturesEnabled){if(this._texture&&o.k.ClearCoatTextureEnabled&&!this._texture.isReadyOrNotBlocking())return!1;if(this._textureRoughness&&o.k.ClearCoatTextureEnabled&&!this._textureRoughness.isReadyOrNotBlocking())return!1;if(i.getCaps().standardDerivatives&&this._bumpTexture&&o.k.ClearCoatBumpTextureEnabled&&!n&&!this._bumpTexture.isReady())return!1;if(this._isTintEnabled&&this._tintTexture&&o.k.ClearCoatTintTextureEnabled&&!this._tintTexture.isReadyOrNotBlocking())return!1}return!0}prepareDefinesBeforeAttributes(e,t){var i;this._isEnabled?(e.CLEARCOAT=!0,e.CLEARCOAT_USE_ROUGHNESS_FROM_MAINTEXTURE=this._useRoughnessFromMainTexture,e.CLEARCOAT_TEXTURE_ROUGHNESS_IDENTICAL=null!==this._texture&&this._texture._texture===(null===(i=this._textureRoughness)||void 0===i?void 0:i._texture)&&this._texture.checkTransformsAreIdentical(this._textureRoughness),e.CLEARCOAT_REMAP_F0=this._remapF0OnInterfaceChange,e._areTexturesDirty&&t.texturesEnabled&&(this._texture&&o.k.ClearCoatTextureEnabled?a.G.PrepareDefinesForMergedUV(this._texture,e,"CLEARCOAT_TEXTURE"):e.CLEARCOAT_TEXTURE=!1,this._textureRoughness&&o.k.ClearCoatTextureEnabled?a.G.PrepareDefinesForMergedUV(this._textureRoughness,e,"CLEARCOAT_TEXTURE_ROUGHNESS"):e.CLEARCOAT_TEXTURE_ROUGHNESS=!1,this._bumpTexture&&o.k.ClearCoatBumpTextureEnabled?a.G.PrepareDefinesForMergedUV(this._bumpTexture,e,"CLEARCOAT_BUMP"):e.CLEARCOAT_BUMP=!1,e.CLEARCOAT_DEFAULTIOR=this._indexOfRefraction===u._DefaultIndexOfRefraction,this._isTintEnabled?(e.CLEARCOAT_TINT=!0,this._tintTexture&&o.k.ClearCoatTintTextureEnabled?(a.G.PrepareDefinesForMergedUV(this._tintTexture,e,"CLEARCOAT_TINT_TEXTURE"),e.CLEARCOAT_TINT_GAMMATEXTURE=this._tintTexture.gammaSpace):e.CLEARCOAT_TINT_TEXTURE=!1):(e.CLEARCOAT_TINT=!1,e.CLEARCOAT_TINT_TEXTURE=!1))):(e.CLEARCOAT=!1,e.CLEARCOAT_TEXTURE=!1,e.CLEARCOAT_TEXTURE_ROUGHNESS=!1,e.CLEARCOAT_BUMP=!1,e.CLEARCOAT_TINT=!1,e.CLEARCOAT_TINT_TEXTURE=!1,e.CLEARCOAT_USE_ROUGHNESS_FROM_MAINTEXTURE=!1,e.CLEARCOAT_TEXTURE_ROUGHNESS_IDENTICAL=!1,e.CLEARCOAT_DEFAULTIOR=!1,e.CLEARCOAT_TEXTUREDIRECTUV=0,e.CLEARCOAT_TEXTURE_ROUGHNESSDIRECTUV=0,e.CLEARCOAT_BUMPDIRECTUV=0,e.CLEARCOAT_REMAP_F0=!1,e.CLEARCOAT_TINT_TEXTUREDIRECTUV=0,e.CLEARCOAT_TINT_GAMMATEXTURE=!1)}bindForSubMesh(e,t,i,n){var s,r,l,h,c,u,d,p;if(!this._isEnabled)return;const f=n.materialDefines,_=this._material.isFrozen,m=this._material._disableBumpMap,g=this._material._invertNormalMapX,v=this._material._invertNormalMapY,y=f.CLEARCOAT_TEXTURE_ROUGHNESS_IDENTICAL;if(!e.useUbo||!_||!e.isSync){y&&o.k.ClearCoatTextureEnabled?(e.updateFloat4("vClearCoatInfos",this._texture.coordinatesIndex,this._texture.level,-1,-1),a.G.BindTextureMatrix(this._texture,e,"clearCoat")):(this._texture||this._textureRoughness)&&o.k.ClearCoatTextureEnabled&&(e.updateFloat4("vClearCoatInfos",null!==(r=null===(s=this._texture)||void 0===s?void 0:s.coordinatesIndex)&&void 0!==r?r:0,null!==(h=null===(l=this._texture)||void 0===l?void 0:l.level)&&void 0!==h?h:0,null!==(u=null===(c=this._textureRoughness)||void 0===c?void 0:c.coordinatesIndex)&&void 0!==u?u:0,null!==(p=null===(d=this._textureRoughness)||void 0===d?void 0:d.level)&&void 0!==p?p:0),this._texture&&a.G.BindTextureMatrix(this._texture,e,"clearCoat"),!this._textureRoughness||y||f.CLEARCOAT_USE_ROUGHNESS_FROM_MAINTEXTURE||a.G.BindTextureMatrix(this._textureRoughness,e,"clearCoatRoughness")),this._bumpTexture&&i.getCaps().standardDerivatives&&o.k.ClearCoatTextureEnabled&&!m&&(e.updateFloat2("vClearCoatBumpInfos",this._bumpTexture.coordinatesIndex,this._bumpTexture.level),a.G.BindTextureMatrix(this._bumpTexture,e,"clearCoatBump"),t._mirroredCameraPosition?e.updateFloat2("vClearCoatTangentSpaceParams",g?1:-1,v?1:-1):e.updateFloat2("vClearCoatTangentSpaceParams",g?-1:1,v?-1:1)),this._tintTexture&&o.k.ClearCoatTintTextureEnabled&&(e.updateFloat2("vClearCoatTintInfos",this._tintTexture.coordinatesIndex,this._tintTexture.level),a.G.BindTextureMatrix(this._tintTexture,e,"clearCoatTint")),e.updateFloat2("vClearCoatParams",this.intensity,this.roughness);const n=1-this._indexOfRefraction,_=1+this._indexOfRefraction,x=Math.pow(-n/_,2),b=1/this._indexOfRefraction;e.updateFloat4("vClearCoatRefractionParams",x,b,n,_),this._isTintEnabled&&(e.updateFloat4("vClearCoatTintParams",this.tintColor.r,this.tintColor.g,this.tintColor.b,Math.max(1e-5,this.tintThickness)),e.updateFloat("clearCoatColorAtDistance",Math.max(1e-5,this.tintColorAtDistance)))}t.texturesEnabled&&(this._texture&&o.k.ClearCoatTextureEnabled&&e.setTexture("clearCoatSampler",this._texture),this._textureRoughness&&!y&&!f.CLEARCOAT_USE_ROUGHNESS_FROM_MAINTEXTURE&&o.k.ClearCoatTextureEnabled&&e.setTexture("clearCoatRoughnessSampler",this._textureRoughness),this._bumpTexture&&i.getCaps().standardDerivatives&&o.k.ClearCoatBumpTextureEnabled&&!m&&e.setTexture("clearCoatBumpSampler",this._bumpTexture),this._isTintEnabled&&this._tintTexture&&o.k.ClearCoatTintTextureEnabled&&e.setTexture("clearCoatTintSampler",this._tintTexture))}hasTexture(e){return this._texture===e||this._textureRoughness===e||this._bumpTexture===e||this._tintTexture===e}getActiveTextures(e){this._texture&&e.push(this._texture),this._textureRoughness&&e.push(this._textureRoughness),this._bumpTexture&&e.push(this._bumpTexture),this._tintTexture&&e.push(this._tintTexture)}getAnimatables(e){this._texture&&this._texture.animations&&this._texture.animations.length>0&&e.push(this._texture),this._textureRoughness&&this._textureRoughness.animations&&this._textureRoughness.animations.length>0&&e.push(this._textureRoughness),this._bumpTexture&&this._bumpTexture.animations&&this._bumpTexture.animations.length>0&&e.push(this._bumpTexture),this._tintTexture&&this._tintTexture.animations&&this._tintTexture.animations.length>0&&e.push(this._tintTexture)}dispose(e){var t,i,n,s;e&&(null===(t=this._texture)||void 0===t||t.dispose(),null===(i=this._textureRoughness)||void 0===i||i.dispose(),null===(n=this._bumpTexture)||void 0===n||n.dispose(),null===(s=this._tintTexture)||void 0===s||s.dispose())}getClassName(){return"PBRClearCoatConfiguration"}addFallbacks(e,t,i){return e.CLEARCOAT_BUMP&&t.addFallback(i++,"CLEARCOAT_BUMP"),e.CLEARCOAT_TINT&&t.addFallback(i++,"CLEARCOAT_TINT"),e.CLEARCOAT&&t.addFallback(i++,"CLEARCOAT"),i}getSamplers(e){e.push("clearCoatSampler","clearCoatRoughnessSampler","clearCoatBumpSampler","clearCoatTintSampler")}getUniforms(){return{ubo:[{name:"vClearCoatParams",size:2,type:"vec2"},{name:"vClearCoatRefractionParams",size:4,type:"vec4"},{name:"vClearCoatInfos",size:4,type:"vec4"},{name:"clearCoatMatrix",size:16,type:"mat4"},{name:"clearCoatRoughnessMatrix",size:16,type:"mat4"},{name:"vClearCoatBumpInfos",size:2,type:"vec2"},{name:"vClearCoatTangentSpaceParams",size:2,type:"vec2"},{name:"clearCoatBumpMatrix",size:16,type:"mat4"},{name:"vClearCoatTintParams",size:4,type:"vec4"},{name:"clearCoatColorAtDistance",size:1,type:"float"},{name:"vClearCoatTintInfos",size:2,type:"vec2"},{name:"clearCoatTintMatrix",size:16,type:"mat4"}]}}}u._DefaultIndexOfRefraction=1.5,(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"isEnabled",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"intensity",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"roughness",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"indexOfRefraction",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"texture",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"useRoughnessFromMainTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"textureRoughness",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"remapF0OnInterfaceChange",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"bumpTexture",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"isTintEnabled",void 0),(0,n.gn)([(0,s.n9)()],u.prototype,"tintColor",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"tintColorAtDistance",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"tintThickness",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"tintTexture",void 0)},3949:(e,t,i)=>{i.d(t,{B:()=>c,f:()=>h});var n=i(9472),s=i(3956),r=i(85),o=i(5346),a=i(8449),l=i(1917);class h extends l.H{constructor(){super(...arguments),this.IRIDESCENCE=!1,this.IRIDESCENCE_TEXTURE=!1,this.IRIDESCENCE_TEXTUREDIRECTUV=0,this.IRIDESCENCE_THICKNESS_TEXTURE=!1,this.IRIDESCENCE_THICKNESS_TEXTUREDIRECTUV=0,this.IRIDESCENCE_USE_THICKNESS_FROM_MAINTEXTURE=!1}}class c extends a.n{_markAllSubMeshesAsTexturesDirty(){this._enable(this._isEnabled),this._internalMarkAllSubMeshesAsTexturesDirty()}constructor(e,t=!0){super(e,"PBRIridescence",110,new h,t),this._isEnabled=!1,this.isEnabled=!1,this.intensity=1,this.minimumThickness=c._DefaultMinimumThickness,this.maximumThickness=c._DefaultMaximumThickness,this.indexOfRefraction=c._DefaultIndexOfRefraction,this._texture=null,this.texture=null,this._thicknessTexture=null,this.thicknessTexture=null,this._internalMarkAllSubMeshesAsTexturesDirty=e._dirtyCallbacks[1]}isReadyForSubMesh(e,t){if(!this._isEnabled)return!0;if(e._areTexturesDirty&&t.texturesEnabled){if(this._texture&&r.k.IridescenceTextureEnabled&&!this._texture.isReadyOrNotBlocking())return!1;if(this._thicknessTexture&&r.k.IridescenceTextureEnabled&&!this._thicknessTexture.isReadyOrNotBlocking())return!1}return!0}prepareDefinesBeforeAttributes(e,t){var i;this._isEnabled?(e.IRIDESCENCE=!0,e.IRIDESCENCE_USE_THICKNESS_FROM_MAINTEXTURE=null!==this._texture&&this._texture._texture===(null===(i=this._thicknessTexture)||void 0===i?void 0:i._texture)&&this._texture.checkTransformsAreIdentical(this._thicknessTexture),e._areTexturesDirty&&t.texturesEnabled&&(this._texture&&r.k.IridescenceTextureEnabled?o.G.PrepareDefinesForMergedUV(this._texture,e,"IRIDESCENCE_TEXTURE"):e.IRIDESCENCE_TEXTURE=!1,!e.IRIDESCENCE_USE_THICKNESS_FROM_MAINTEXTURE&&this._thicknessTexture&&r.k.IridescenceTextureEnabled?o.G.PrepareDefinesForMergedUV(this._thicknessTexture,e,"IRIDESCENCE_THICKNESS_TEXTURE"):e.IRIDESCENCE_THICKNESS_TEXTURE=!1)):(e.IRIDESCENCE=!1,e.IRIDESCENCE_TEXTURE=!1,e.IRIDESCENCE_THICKNESS_TEXTURE=!1,e.IRIDESCENCE_USE_THICKNESS_FROM_MAINTEXTURE=!1,e.IRIDESCENCE_TEXTUREDIRECTUV=0,e.IRIDESCENCE_THICKNESS_TEXTUREDIRECTUV=0)}bindForSubMesh(e,t,i,n){var s,a,l,h,c,u,d,p;if(!this._isEnabled)return;const f=n.materialDefines,_=this._material.isFrozen,m=f.IRIDESCENCE_USE_THICKNESS_FROM_MAINTEXTURE;e.useUbo&&_&&e.isSync||(m&&r.k.IridescenceTextureEnabled?(e.updateFloat4("vIridescenceInfos",this._texture.coordinatesIndex,this._texture.level,-1,-1),o.G.BindTextureMatrix(this._texture,e,"iridescence")):(this._texture||this._thicknessTexture)&&r.k.IridescenceTextureEnabled&&(e.updateFloat4("vIridescenceInfos",null!==(a=null===(s=this._texture)||void 0===s?void 0:s.coordinatesIndex)&&void 0!==a?a:0,null!==(h=null===(l=this._texture)||void 0===l?void 0:l.level)&&void 0!==h?h:0,null!==(u=null===(c=this._thicknessTexture)||void 0===c?void 0:c.coordinatesIndex)&&void 0!==u?u:0,null!==(p=null===(d=this._thicknessTexture)||void 0===d?void 0:d.level)&&void 0!==p?p:0),this._texture&&o.G.BindTextureMatrix(this._texture,e,"iridescence"),!this._thicknessTexture||m||f.IRIDESCENCE_USE_THICKNESS_FROM_MAINTEXTURE||o.G.BindTextureMatrix(this._thicknessTexture,e,"iridescenceThickness")),e.updateFloat4("vIridescenceParams",this.intensity,this.indexOfRefraction,this.minimumThickness,this.maximumThickness)),t.texturesEnabled&&(this._texture&&r.k.IridescenceTextureEnabled&&e.setTexture("iridescenceSampler",this._texture),this._thicknessTexture&&!m&&!f.IRIDESCENCE_USE_THICKNESS_FROM_MAINTEXTURE&&r.k.IridescenceTextureEnabled&&e.setTexture("iridescenceThicknessSampler",this._thicknessTexture))}hasTexture(e){return this._texture===e||this._thicknessTexture===e}getActiveTextures(e){this._texture&&e.push(this._texture),this._thicknessTexture&&e.push(this._thicknessTexture)}getAnimatables(e){this._texture&&this._texture.animations&&this._texture.animations.length>0&&e.push(this._texture),this._thicknessTexture&&this._thicknessTexture.animations&&this._thicknessTexture.animations.length>0&&e.push(this._thicknessTexture)}dispose(e){var t,i;e&&(null===(t=this._texture)||void 0===t||t.dispose(),null===(i=this._thicknessTexture)||void 0===i||i.dispose())}getClassName(){return"PBRIridescenceConfiguration"}addFallbacks(e,t,i){return e.IRIDESCENCE&&t.addFallback(i++,"IRIDESCENCE"),i}getSamplers(e){e.push("iridescenceSampler","iridescenceThicknessSampler")}getUniforms(){return{ubo:[{name:"vIridescenceParams",size:4,type:"vec4"},{name:"vIridescenceInfos",size:4,type:"vec4"},{name:"iridescenceMatrix",size:16,type:"mat4"},{name:"iridescenceThicknessMatrix",size:16,type:"mat4"}]}}}c._DefaultMinimumThickness=100,c._DefaultMaximumThickness=400,c._DefaultIndexOfRefraction=1.3,(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],c.prototype,"isEnabled",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"intensity",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"minimumThickness",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"maximumThickness",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"indexOfRefraction",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],c.prototype,"texture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],c.prototype,"thicknessTexture",void 0)},9500:(e,t,i)=>{i.d(t,{Y:()=>h});var n=i(9472),s=i(3956),r=i(6344),o=i(4649),a=i(5843),l=i(2208);class h extends a.m{get refractionTexture(){return this.subSurface.refractionTexture}set refractionTexture(e){this.subSurface.refractionTexture=e,e?this.subSurface.isRefractionEnabled=!0:this.subSurface.linkRefractionWithTransparency||(this.subSurface.isRefractionEnabled=!1)}get indexOfRefraction(){return this.subSurface.indexOfRefraction}set indexOfRefraction(e){this.subSurface.indexOfRefraction=e}get invertRefractionY(){return this.subSurface.invertRefractionY}set invertRefractionY(e){this.subSurface.invertRefractionY=e}get linkRefractionWithTransparency(){return this.subSurface.linkRefractionWithTransparency}set linkRefractionWithTransparency(e){this.subSurface.linkRefractionWithTransparency=e,e&&(this.subSurface.isRefractionEnabled=!0)}get usePhysicalLightFalloff(){return this._lightFalloff===a.m.LIGHTFALLOFF_PHYSICAL}set usePhysicalLightFalloff(e){e!==this.usePhysicalLightFalloff&&(this._markAllSubMeshesAsTexturesDirty(),this._lightFalloff=e?a.m.LIGHTFALLOFF_PHYSICAL:a.m.LIGHTFALLOFF_STANDARD)}get useGLTFLightFalloff(){return this._lightFalloff===a.m.LIGHTFALLOFF_GLTF}set useGLTFLightFalloff(e){e!==this.useGLTFLightFalloff&&(this._markAllSubMeshesAsTexturesDirty(),this._lightFalloff=e?a.m.LIGHTFALLOFF_GLTF:a.m.LIGHTFALLOFF_STANDARD)}get imageProcessingConfiguration(){return this._imageProcessingConfiguration}set imageProcessingConfiguration(e){this._attachImageProcessingConfiguration(e),this._markAllSubMeshesAsTexturesDirty()}get cameraColorCurvesEnabled(){return this.imageProcessingConfiguration.colorCurvesEnabled}set cameraColorCurvesEnabled(e){this.imageProcessingConfiguration.colorCurvesEnabled=e}get cameraColorGradingEnabled(){return this.imageProcessingConfiguration.colorGradingEnabled}set cameraColorGradingEnabled(e){this.imageProcessingConfiguration.colorGradingEnabled=e}get cameraToneMappingEnabled(){return this._imageProcessingConfiguration.toneMappingEnabled}set cameraToneMappingEnabled(e){this._imageProcessingConfiguration.toneMappingEnabled=e}get cameraExposure(){return this._imageProcessingConfiguration.exposure}set cameraExposure(e){this._imageProcessingConfiguration.exposure=e}get cameraContrast(){return this._imageProcessingConfiguration.contrast}set cameraContrast(e){this._imageProcessingConfiguration.contrast=e}get cameraColorGradingTexture(){return this._imageProcessingConfiguration.colorGradingTexture}set cameraColorGradingTexture(e){this._imageProcessingConfiguration.colorGradingTexture=e}get cameraColorCurves(){return this._imageProcessingConfiguration.colorCurves}set cameraColorCurves(e){this._imageProcessingConfiguration.colorCurves=e}constructor(e,t){super(e,t),this.directIntensity=1,this.emissiveIntensity=1,this.environmentIntensity=1,this.specularIntensity=1,this.disableBumpMap=!1,this.ambientTextureStrength=1,this.ambientTextureImpactOnAnalyticalLights=h.DEFAULT_AO_ON_ANALYTICAL_LIGHTS,this.metallicF0Factor=1,this.metallicReflectanceColor=o.Wo.White(),this.useOnlyMetallicFromMetallicReflectanceTexture=!1,this.ambientColor=new o.Wo(0,0,0),this.albedoColor=new o.Wo(1,1,1),this.reflectivityColor=new o.Wo(1,1,1),this.reflectionColor=new o.Wo(1,1,1),this.emissiveColor=new o.Wo(0,0,0),this.microSurface=1,this.useLightmapAsShadowmap=!1,this.useAlphaFromAlbedoTexture=!1,this.forceAlphaTest=!1,this.alphaCutOff=.4,this.useSpecularOverAlpha=!0,this.useMicroSurfaceFromReflectivityMapAlpha=!1,this.useRoughnessFromMetallicTextureAlpha=!0,this.useRoughnessFromMetallicTextureGreen=!1,this.useMetallnessFromMetallicTextureBlue=!1,this.useAmbientOcclusionFromMetallicTextureRed=!1,this.useAmbientInGrayScale=!1,this.useAutoMicroSurfaceFromReflectivityMap=!1,this.useRadianceOverAlpha=!0,this.useObjectSpaceNormalMap=!1,this.useParallax=!1,this.useParallaxOcclusion=!1,this.parallaxScaleBias=.05,this.disableLighting=!1,this.forceIrradianceInFragment=!1,this.maxSimultaneousLights=4,this.invertNormalMapX=!1,this.invertNormalMapY=!1,this.twoSidedLighting=!1,this.useAlphaFresnel=!1,this.useLinearAlphaFresnel=!1,this.environmentBRDFTexture=null,this.forceNormalForward=!1,this.enableSpecularAntiAliasing=!1,this.useHorizonOcclusion=!0,this.useRadianceOcclusion=!0,this.unlit=!1,this._environmentBRDFTexture=(0,r.$)(this.getScene())}getClassName(){return"PBRMaterial"}clone(e,t=!0){const i=s.p4.Clone((()=>new h(e,this.getScene())),this,{cloneTexturesOnlyOnce:t});return i.id=e,i.name=e,this.stencil.copyTo(i.stencil),this.clearCoat.copyTo(i.clearCoat),this.anisotropy.copyTo(i.anisotropy),this.brdf.copyTo(i.brdf),this.sheen.copyTo(i.sheen),this.subSurface.copyTo(i.subSurface),this.iridescence.copyTo(i.iridescence),i}serialize(){const e=super.serialize();return e.customType="BABYLON.PBRMaterial",e.clearCoat=this.clearCoat.serialize(),e.anisotropy=this.anisotropy.serialize(),e.brdf=this.brdf.serialize(),e.sheen=this.sheen.serialize(),e.subSurface=this.subSurface.serialize(),e.iridescence=this.iridescence.serialize(),e}static Parse(e,t,i){const n=s.p4.Parse((()=>new h(e.name,t)),e,t,i);return e.stencil&&n.stencil.parse(e.stencil,t,i),e.clearCoat&&n.clearCoat.parse(e.clearCoat,t,i),e.anisotropy&&n.anisotropy.parse(e.anisotropy,t,i),e.brdf&&n.brdf.parse(e.brdf,t,i),e.sheen&&n.sheen.parse(e.sheen,t,i),e.subSurface&&n.subSurface.parse(e.subSurface,t,i),e.iridescence&&n.iridescence.parse(e.iridescence,t,i),n}}h.PBRMATERIAL_OPAQUE=a.m.PBRMATERIAL_OPAQUE,h.PBRMATERIAL_ALPHATEST=a.m.PBRMATERIAL_ALPHATEST,h.PBRMATERIAL_ALPHABLEND=a.m.PBRMATERIAL_ALPHABLEND,h.PBRMATERIAL_ALPHATESTANDBLEND=a.m.PBRMATERIAL_ALPHATESTANDBLEND,h.DEFAULT_AO_ON_ANALYTICAL_LIGHTS=a.m.DEFAULT_AO_ON_ANALYTICAL_LIGHTS,(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"directIntensity",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"emissiveIntensity",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"environmentIntensity",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"specularIntensity",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"disableBumpMap",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"albedoTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"ambientTexture",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"ambientTextureStrength",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"ambientTextureImpactOnAnalyticalLights",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesAndMiscDirty")],h.prototype,"opacityTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"reflectionTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"emissiveTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"reflectivityTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"metallicTexture",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"metallic",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"roughness",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"metallicF0Factor",void 0),(0,n.gn)([(0,s.n9)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"metallicReflectanceColor",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useOnlyMetallicFromMetallicReflectanceTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"metallicReflectanceTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"reflectanceTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"microSurfaceTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"bumpTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty",null)],h.prototype,"lightmapTexture",void 0),(0,n.gn)([(0,s.n9)("ambient"),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"ambientColor",void 0),(0,n.gn)([(0,s.n9)("albedo"),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"albedoColor",void 0),(0,n.gn)([(0,s.n9)("reflectivity"),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"reflectivityColor",void 0),(0,n.gn)([(0,s.n9)("reflection"),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"reflectionColor",void 0),(0,n.gn)([(0,s.n9)("emissive"),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"emissiveColor",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"microSurface",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useLightmapAsShadowmap",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesAndMiscDirty")],h.prototype,"useAlphaFromAlbedoTexture",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesAndMiscDirty")],h.prototype,"forceAlphaTest",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesAndMiscDirty")],h.prototype,"alphaCutOff",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useSpecularOverAlpha",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useMicroSurfaceFromReflectivityMapAlpha",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useRoughnessFromMetallicTextureAlpha",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useRoughnessFromMetallicTextureGreen",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useMetallnessFromMetallicTextureBlue",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useAmbientOcclusionFromMetallicTextureRed",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useAmbientInGrayScale",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useAutoMicroSurfaceFromReflectivityMap",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"usePhysicalLightFalloff",null),(0,n.gn)([(0,s.qC)()],h.prototype,"useGLTFLightFalloff",null),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useRadianceOverAlpha",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useObjectSpaceNormalMap",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useParallax",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useParallaxOcclusion",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"parallaxScaleBias",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsLightsDirty")],h.prototype,"disableLighting",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"forceIrradianceInFragment",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsLightsDirty")],h.prototype,"maxSimultaneousLights",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"invertNormalMapX",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"invertNormalMapY",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"twoSidedLighting",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useAlphaFresnel",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useLinearAlphaFresnel",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"environmentBRDFTexture",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"forceNormalForward",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"enableSpecularAntiAliasing",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useHorizonOcclusion",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],h.prototype,"useRadianceOcclusion",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsMiscDirty")],h.prototype,"unlit",void 0),(0,l.H)("BABYLON.PBRMaterial",h)},4783:(e,t,i)=>{i.d(t,{A:()=>c,B:()=>u});var n=i(9472),s=i(3956),r=i(4649),o=i(85),a=i(5346),l=i(8449),h=i(1917);class c extends h.H{constructor(){super(...arguments),this.SHEEN=!1,this.SHEEN_TEXTURE=!1,this.SHEEN_GAMMATEXTURE=!1,this.SHEEN_TEXTURE_ROUGHNESS=!1,this.SHEEN_TEXTUREDIRECTUV=0,this.SHEEN_TEXTURE_ROUGHNESSDIRECTUV=0,this.SHEEN_LINKWITHALBEDO=!1,this.SHEEN_ROUGHNESS=!1,this.SHEEN_ALBEDOSCALING=!1,this.SHEEN_USE_ROUGHNESS_FROM_MAINTEXTURE=!1,this.SHEEN_TEXTURE_ROUGHNESS_IDENTICAL=!1}}class u extends l.n{_markAllSubMeshesAsTexturesDirty(){this._enable(this._isEnabled),this._internalMarkAllSubMeshesAsTexturesDirty()}constructor(e,t=!0){super(e,"Sheen",120,new c,t),this._isEnabled=!1,this.isEnabled=!1,this._linkSheenWithAlbedo=!1,this.linkSheenWithAlbedo=!1,this.intensity=1,this.color=r.Wo.White(),this._texture=null,this.texture=null,this._useRoughnessFromMainTexture=!0,this.useRoughnessFromMainTexture=!0,this._roughness=null,this.roughness=null,this._textureRoughness=null,this.textureRoughness=null,this._albedoScaling=!1,this.albedoScaling=!1,this._internalMarkAllSubMeshesAsTexturesDirty=e._dirtyCallbacks[1]}isReadyForSubMesh(e,t){if(!this._isEnabled)return!0;if(e._areTexturesDirty&&t.texturesEnabled){if(this._texture&&o.k.SheenTextureEnabled&&!this._texture.isReadyOrNotBlocking())return!1;if(this._textureRoughness&&o.k.SheenTextureEnabled&&!this._textureRoughness.isReadyOrNotBlocking())return!1}return!0}prepareDefinesBeforeAttributes(e,t){var i;this._isEnabled?(e.SHEEN=!0,e.SHEEN_LINKWITHALBEDO=this._linkSheenWithAlbedo,e.SHEEN_ROUGHNESS=null!==this._roughness,e.SHEEN_ALBEDOSCALING=this._albedoScaling,e.SHEEN_USE_ROUGHNESS_FROM_MAINTEXTURE=this._useRoughnessFromMainTexture,e.SHEEN_TEXTURE_ROUGHNESS_IDENTICAL=null!==this._texture&&this._texture._texture===(null===(i=this._textureRoughness)||void 0===i?void 0:i._texture)&&this._texture.checkTransformsAreIdentical(this._textureRoughness),e._areTexturesDirty&&t.texturesEnabled&&(this._texture&&o.k.SheenTextureEnabled?(a.G.PrepareDefinesForMergedUV(this._texture,e,"SHEEN_TEXTURE"),e.SHEEN_GAMMATEXTURE=this._texture.gammaSpace):e.SHEEN_TEXTURE=!1,this._textureRoughness&&o.k.SheenTextureEnabled?a.G.PrepareDefinesForMergedUV(this._textureRoughness,e,"SHEEN_TEXTURE_ROUGHNESS"):e.SHEEN_TEXTURE_ROUGHNESS=!1)):(e.SHEEN=!1,e.SHEEN_TEXTURE=!1,e.SHEEN_TEXTURE_ROUGHNESS=!1,e.SHEEN_LINKWITHALBEDO=!1,e.SHEEN_ROUGHNESS=!1,e.SHEEN_ALBEDOSCALING=!1,e.SHEEN_USE_ROUGHNESS_FROM_MAINTEXTURE=!1,e.SHEEN_TEXTURE_ROUGHNESS_IDENTICAL=!1,e.SHEEN_GAMMATEXTURE=!1,e.SHEEN_TEXTUREDIRECTUV=0,e.SHEEN_TEXTURE_ROUGHNESSDIRECTUV=0)}bindForSubMesh(e,t,i,n){var s,r,l,h,c,u,d,p;if(!this._isEnabled)return;const f=n.materialDefines,_=this._material.isFrozen,m=f.SHEEN_TEXTURE_ROUGHNESS_IDENTICAL;e.useUbo&&_&&e.isSync||(m&&o.k.SheenTextureEnabled?(e.updateFloat4("vSheenInfos",this._texture.coordinatesIndex,this._texture.level,-1,-1),a.G.BindTextureMatrix(this._texture,e,"sheen")):(this._texture||this._textureRoughness)&&o.k.SheenTextureEnabled&&(e.updateFloat4("vSheenInfos",null!==(r=null===(s=this._texture)||void 0===s?void 0:s.coordinatesIndex)&&void 0!==r?r:0,null!==(h=null===(l=this._texture)||void 0===l?void 0:l.level)&&void 0!==h?h:0,null!==(u=null===(c=this._textureRoughness)||void 0===c?void 0:c.coordinatesIndex)&&void 0!==u?u:0,null!==(p=null===(d=this._textureRoughness)||void 0===d?void 0:d.level)&&void 0!==p?p:0),this._texture&&a.G.BindTextureMatrix(this._texture,e,"sheen"),!this._textureRoughness||m||f.SHEEN_USE_ROUGHNESS_FROM_MAINTEXTURE||a.G.BindTextureMatrix(this._textureRoughness,e,"sheenRoughness")),e.updateFloat4("vSheenColor",this.color.r,this.color.g,this.color.b,this.intensity),null!==this._roughness&&e.updateFloat("vSheenRoughness",this._roughness)),t.texturesEnabled&&(this._texture&&o.k.SheenTextureEnabled&&e.setTexture("sheenSampler",this._texture),this._textureRoughness&&!m&&!f.SHEEN_USE_ROUGHNESS_FROM_MAINTEXTURE&&o.k.SheenTextureEnabled&&e.setTexture("sheenRoughnessSampler",this._textureRoughness))}hasTexture(e){return this._texture===e||this._textureRoughness===e}getActiveTextures(e){this._texture&&e.push(this._texture),this._textureRoughness&&e.push(this._textureRoughness)}getAnimatables(e){this._texture&&this._texture.animations&&this._texture.animations.length>0&&e.push(this._texture),this._textureRoughness&&this._textureRoughness.animations&&this._textureRoughness.animations.length>0&&e.push(this._textureRoughness)}dispose(e){var t,i;e&&(null===(t=this._texture)||void 0===t||t.dispose(),null===(i=this._textureRoughness)||void 0===i||i.dispose())}getClassName(){return"PBRSheenConfiguration"}addFallbacks(e,t,i){return e.SHEEN&&t.addFallback(i++,"SHEEN"),i}getSamplers(e){e.push("sheenSampler","sheenRoughnessSampler")}getUniforms(){return{ubo:[{name:"vSheenColor",size:4,type:"vec4"},{name:"vSheenRoughness",size:1,type:"float"},{name:"vSheenInfos",size:4,type:"vec4"},{name:"sheenMatrix",size:16,type:"mat4"},{name:"sheenRoughnessMatrix",size:16,type:"mat4"}]}}}(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"isEnabled",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"linkSheenWithAlbedo",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"intensity",void 0),(0,n.gn)([(0,s.n9)()],u.prototype,"color",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"texture",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"useRoughnessFromMainTexture",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"roughness",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"textureRoughness",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"albedoScaling",void 0)},3808:(e,t,i)=>{i.d(t,{H:()=>d,u:()=>p});var n=i(9472),s=i(3956),r=i(4649),o=i(85),a=i(5346),l=i(1128),h=i(4141),c=i(8449),u=i(1917);class d extends u.H{constructor(){super(...arguments),this.SUBSURFACE=!1,this.SS_REFRACTION=!1,this.SS_REFRACTION_USE_INTENSITY_FROM_TEXTURE=!1,this.SS_TRANSLUCENCY=!1,this.SS_TRANSLUCENCY_USE_INTENSITY_FROM_TEXTURE=!1,this.SS_SCATTERING=!1,this.SS_THICKNESSANDMASK_TEXTURE=!1,this.SS_THICKNESSANDMASK_TEXTUREDIRECTUV=0,this.SS_HAS_THICKNESS=!1,this.SS_REFRACTIONINTENSITY_TEXTURE=!1,this.SS_REFRACTIONINTENSITY_TEXTUREDIRECTUV=0,this.SS_TRANSLUCENCYINTENSITY_TEXTURE=!1,this.SS_TRANSLUCENCYINTENSITY_TEXTUREDIRECTUV=0,this.SS_REFRACTIONMAP_3D=!1,this.SS_REFRACTIONMAP_OPPOSITEZ=!1,this.SS_LODINREFRACTIONALPHA=!1,this.SS_GAMMAREFRACTION=!1,this.SS_RGBDREFRACTION=!1,this.SS_LINEARSPECULARREFRACTION=!1,this.SS_LINKREFRACTIONTOTRANSPARENCY=!1,this.SS_ALBEDOFORREFRACTIONTINT=!1,this.SS_ALBEDOFORTRANSLUCENCYTINT=!1,this.SS_USE_LOCAL_REFRACTIONMAP_CUBIC=!1,this.SS_USE_THICKNESS_AS_DEPTH=!1,this.SS_MASK_FROM_THICKNESS_TEXTURE=!1,this.SS_USE_GLTF_TEXTURES=!1}}class p extends c.n{get scatteringDiffusionProfile(){return this._scene.subSurfaceConfiguration?this._scene.subSurfaceConfiguration.ssDiffusionProfileColors[this._scatteringDiffusionProfileIndex]:null}set scatteringDiffusionProfile(e){this._scene.enableSubSurfaceForPrePass()&&e&&(this._scatteringDiffusionProfileIndex=this._scene.subSurfaceConfiguration.addDiffusionProfile(e))}get volumeIndexOfRefraction(){return this._volumeIndexOfRefraction>=1?this._volumeIndexOfRefraction:this._indexOfRefraction}set volumeIndexOfRefraction(e){this._volumeIndexOfRefraction=e>=1?e:-1}_markAllSubMeshesAsTexturesDirty(){this._enable(this._isRefractionEnabled||this._isTranslucencyEnabled||this._isScatteringEnabled),this._internalMarkAllSubMeshesAsTexturesDirty()}_markScenePrePassDirty(){this._internalMarkAllSubMeshesAsTexturesDirty(),this._internalMarkScenePrePassDirty()}constructor(e,t=!0){super(e,"PBRSubSurface",130,new d,t),this._isRefractionEnabled=!1,this.isRefractionEnabled=!1,this._isTranslucencyEnabled=!1,this.isTranslucencyEnabled=!1,this._isScatteringEnabled=!1,this.isScatteringEnabled=!1,this._scatteringDiffusionProfileIndex=0,this.refractionIntensity=1,this.translucencyIntensity=1,this.useAlbedoToTintRefraction=!1,this.useAlbedoToTintTranslucency=!1,this._thicknessTexture=null,this.thicknessTexture=null,this._refractionTexture=null,this.refractionTexture=null,this._indexOfRefraction=1.5,this.indexOfRefraction=1.5,this._volumeIndexOfRefraction=-1,this._invertRefractionY=!1,this.invertRefractionY=!1,this._linkRefractionWithTransparency=!1,this.linkRefractionWithTransparency=!1,this.minimumThickness=0,this.maximumThickness=1,this.useThicknessAsDepth=!1,this.tintColor=r.Wo.White(),this.tintColorAtDistance=1,this.diffusionDistance=r.Wo.White(),this._useMaskFromThicknessTexture=!1,this.useMaskFromThicknessTexture=!1,this._refractionIntensityTexture=null,this.refractionIntensityTexture=null,this._translucencyIntensityTexture=null,this.translucencyIntensityTexture=null,this._useGltfStyleTextures=!1,this.useGltfStyleTextures=!1,this._scene=e.getScene(),this.registerForExtraEvents=!0,this._internalMarkAllSubMeshesAsTexturesDirty=e._dirtyCallbacks[1],this._internalMarkScenePrePassDirty=e._dirtyCallbacks[32]}isReadyForSubMesh(e,t){if(!this._isRefractionEnabled&&!this._isTranslucencyEnabled&&!this._isScatteringEnabled)return!0;if(e._areTexturesDirty&&t.texturesEnabled){if(this._thicknessTexture&&o.k.ThicknessTextureEnabled&&!this._thicknessTexture.isReadyOrNotBlocking())return!1;const e=this._getRefractionTexture(t);if(e&&o.k.RefractionTextureEnabled&&!e.isReadyOrNotBlocking())return!1}return!0}prepareDefinesBeforeAttributes(e,t){if(!this._isRefractionEnabled&&!this._isTranslucencyEnabled&&!this._isScatteringEnabled)return e.SUBSURFACE=!1,e.SS_TRANSLUCENCY=!1,e.SS_SCATTERING=!1,e.SS_REFRACTION=!1,e.SS_REFRACTION_USE_INTENSITY_FROM_TEXTURE=!1,e.SS_TRANSLUCENCY_USE_INTENSITY_FROM_TEXTURE=!1,e.SS_THICKNESSANDMASK_TEXTURE=!1,e.SS_THICKNESSANDMASK_TEXTUREDIRECTUV=0,e.SS_HAS_THICKNESS=!1,e.SS_REFRACTIONINTENSITY_TEXTURE=!1,e.SS_REFRACTIONINTENSITY_TEXTUREDIRECTUV=0,e.SS_TRANSLUCENCYINTENSITY_TEXTURE=!1,e.SS_TRANSLUCENCYINTENSITY_TEXTUREDIRECTUV=0,e.SS_REFRACTIONMAP_3D=!1,e.SS_REFRACTIONMAP_OPPOSITEZ=!1,e.SS_LODINREFRACTIONALPHA=!1,e.SS_GAMMAREFRACTION=!1,e.SS_RGBDREFRACTION=!1,e.SS_LINEARSPECULARREFRACTION=!1,e.SS_LINKREFRACTIONTOTRANSPARENCY=!1,e.SS_ALBEDOFORREFRACTIONTINT=!1,e.SS_ALBEDOFORTRANSLUCENCYTINT=!1,e.SS_USE_LOCAL_REFRACTIONMAP_CUBIC=!1,e.SS_USE_THICKNESS_AS_DEPTH=!1,e.SS_MASK_FROM_THICKNESS_TEXTURE=!1,void(e.SS_USE_GLTF_TEXTURES=!1);if(e._areTexturesDirty){e.SUBSURFACE=!0,e.SS_TRANSLUCENCY=this._isTranslucencyEnabled,e.SS_TRANSLUCENCY_USE_INTENSITY_FROM_TEXTURE=!1,e.SS_SCATTERING=this._isScatteringEnabled,e.SS_THICKNESSANDMASK_TEXTURE=!1,e.SS_REFRACTIONINTENSITY_TEXTURE=!1,e.SS_TRANSLUCENCYINTENSITY_TEXTURE=!1,e.SS_HAS_THICKNESS=!1,e.SS_MASK_FROM_THICKNESS_TEXTURE=!1,e.SS_USE_GLTF_TEXTURES=!1,e.SS_REFRACTION=!1,e.SS_REFRACTION_USE_INTENSITY_FROM_TEXTURE=!1,e.SS_REFRACTIONMAP_3D=!1,e.SS_GAMMAREFRACTION=!1,e.SS_RGBDREFRACTION=!1,e.SS_LINEARSPECULARREFRACTION=!1,e.SS_REFRACTIONMAP_OPPOSITEZ=!1,e.SS_LODINREFRACTIONALPHA=!1,e.SS_LINKREFRACTIONTOTRANSPARENCY=!1,e.SS_ALBEDOFORREFRACTIONTINT=!1,e.SS_ALBEDOFORTRANSLUCENCYTINT=!1,e.SS_USE_LOCAL_REFRACTIONMAP_CUBIC=!1,e.SS_USE_THICKNESS_AS_DEPTH=!1;const i=!!this._thicknessTexture&&!!this._refractionIntensityTexture&&this._refractionIntensityTexture.checkTransformsAreIdentical(this._thicknessTexture)&&this._refractionIntensityTexture._texture===this._thicknessTexture._texture,n=!!this._thicknessTexture&&!!this._translucencyIntensityTexture&&this._translucencyIntensityTexture.checkTransformsAreIdentical(this._thicknessTexture)&&this._translucencyIntensityTexture._texture===this._thicknessTexture._texture,s=(i||!this._refractionIntensityTexture)&&(n||!this._translucencyIntensityTexture);if(e._areTexturesDirty&&t.texturesEnabled&&(this._thicknessTexture&&o.k.ThicknessTextureEnabled&&a.G.PrepareDefinesForMergedUV(this._thicknessTexture,e,"SS_THICKNESSANDMASK_TEXTURE"),this._refractionIntensityTexture&&o.k.RefractionIntensityTextureEnabled&&!s&&a.G.PrepareDefinesForMergedUV(this._refractionIntensityTexture,e,"SS_REFRACTIONINTENSITY_TEXTURE"),this._translucencyIntensityTexture&&o.k.TranslucencyIntensityTextureEnabled&&!s&&a.G.PrepareDefinesForMergedUV(this._translucencyIntensityTexture,e,"SS_TRANSLUCENCYINTENSITY_TEXTURE")),e.SS_HAS_THICKNESS=this.maximumThickness-this.minimumThickness!=0,e.SS_MASK_FROM_THICKNESS_TEXTURE=(this._useMaskFromThicknessTexture||!!this._refractionIntensityTexture||!!this._translucencyIntensityTexture)&&s,e.SS_USE_GLTF_TEXTURES=this._useGltfStyleTextures,e.SS_REFRACTION_USE_INTENSITY_FROM_TEXTURE=(this._useMaskFromThicknessTexture||!!this._refractionIntensityTexture)&&s,e.SS_TRANSLUCENCY_USE_INTENSITY_FROM_TEXTURE=(this._useMaskFromThicknessTexture||!!this._translucencyIntensityTexture)&&s,this._isRefractionEnabled&&t.texturesEnabled){const i=this._getRefractionTexture(t);i&&o.k.RefractionTextureEnabled&&(e.SS_REFRACTION=!0,e.SS_REFRACTIONMAP_3D=i.isCube,e.SS_GAMMAREFRACTION=i.gammaSpace,e.SS_RGBDREFRACTION=i.isRGBD,e.SS_LINEARSPECULARREFRACTION=i.linearSpecularLOD,e.SS_REFRACTIONMAP_OPPOSITEZ=this._scene.useRightHandedSystem&&i.isCube?!i.invertZ:i.invertZ,e.SS_LODINREFRACTIONALPHA=i.lodLevelInAlpha,e.SS_LINKREFRACTIONTOTRANSPARENCY=this._linkRefractionWithTransparency,e.SS_ALBEDOFORREFRACTIONTINT=this.useAlbedoToTintRefraction,e.SS_USE_LOCAL_REFRACTIONMAP_CUBIC=i.isCube&&i.boundingBoxSize,e.SS_USE_THICKNESS_AS_DEPTH=this.useThicknessAsDepth)}this._isTranslucencyEnabled&&(e.SS_ALBEDOFORTRANSLUCENCYTINT=this.useAlbedoToTintTranslucency)}}hardBindForSubMesh(e,t,i,n){if(!this._isRefractionEnabled&&!this._isTranslucencyEnabled&&!this._isScatteringEnabled)return;n.getRenderingMesh().getWorldMatrix().decompose(h.jp.Vector3[0]);const s=Math.max(Math.abs(h.jp.Vector3[0].x),Math.abs(h.jp.Vector3[0].y),Math.abs(h.jp.Vector3[0].z));e.updateFloat2("vThicknessParam",this.minimumThickness*s,(this.maximumThickness-this.minimumThickness)*s)}bindForSubMesh(e,t,i,n){if(!this._isRefractionEnabled&&!this._isTranslucencyEnabled&&!this._isScatteringEnabled)return;const s=n.materialDefines,r=this._material.isFrozen,h=this._material.realTimeFiltering,c=s.LODBASEDMICROSFURACE,u=this._getRefractionTexture(t);if(!e.useUbo||!r||!e.isSync){if(this._thicknessTexture&&o.k.ThicknessTextureEnabled&&(e.updateFloat2("vThicknessInfos",this._thicknessTexture.coordinatesIndex,this._thicknessTexture.level),a.G.BindTextureMatrix(this._thicknessTexture,e,"thickness")),this._refractionIntensityTexture&&o.k.RefractionIntensityTextureEnabled&&s.SS_REFRACTIONINTENSITY_TEXTURE&&(e.updateFloat2("vRefractionIntensityInfos",this._refractionIntensityTexture.coordinatesIndex,this._refractionIntensityTexture.level),a.G.BindTextureMatrix(this._refractionIntensityTexture,e,"refractionIntensity")),this._translucencyIntensityTexture&&o.k.TranslucencyIntensityTextureEnabled&&s.SS_TRANSLUCENCYINTENSITY_TEXTURE&&(e.updateFloat2("vTranslucencyIntensityInfos",this._translucencyIntensityTexture.coordinatesIndex,this._translucencyIntensityTexture.level),a.G.BindTextureMatrix(this._translucencyIntensityTexture,e,"translucencyIntensity")),u&&o.k.RefractionTextureEnabled){e.updateMatrix("refractionMatrix",u.getRefractionTextureMatrix());let t=1;u.isCube||u.depth&&(t=u.depth);const i=u.getSize().width,n=this.volumeIndexOfRefraction;if(e.updateFloat4("vRefractionInfos",u.level,1/n,t,this._invertRefractionY?-1:1),e.updateFloat4("vRefractionMicrosurfaceInfos",i,u.lodGenerationScale,u.lodGenerationOffset,1/this.indexOfRefraction),h&&e.updateFloat2("vRefractionFilteringInfo",i,l.R.Log2(i)),u.boundingBoxSize){const t=u;e.updateVector3("vRefractionPosition",t.boundingBoxPosition),e.updateVector3("vRefractionSize",t.boundingBoxSize)}}this._isScatteringEnabled&&e.updateFloat("scatteringDiffusionProfile",this._scatteringDiffusionProfileIndex),e.updateColor3("vDiffusionDistance",this.diffusionDistance),e.updateFloat4("vTintColor",this.tintColor.r,this.tintColor.g,this.tintColor.b,Math.max(1e-5,this.tintColorAtDistance)),e.updateFloat3("vSubSurfaceIntensity",this.refractionIntensity,this.translucencyIntensity,0)}t.texturesEnabled&&(this._thicknessTexture&&o.k.ThicknessTextureEnabled&&e.setTexture("thicknessSampler",this._thicknessTexture),this._refractionIntensityTexture&&o.k.RefractionIntensityTextureEnabled&&s.SS_REFRACTIONINTENSITY_TEXTURE&&e.setTexture("refractionIntensitySampler",this._refractionIntensityTexture),this._translucencyIntensityTexture&&o.k.TranslucencyIntensityTextureEnabled&&s.SS_TRANSLUCENCYINTENSITY_TEXTURE&&e.setTexture("translucencyIntensitySampler",this._translucencyIntensityTexture),u&&o.k.RefractionTextureEnabled&&(c?e.setTexture("refractionSampler",u):(e.setTexture("refractionSampler",u._lodTextureMid||u),e.setTexture("refractionSamplerLow",u._lodTextureLow||u),e.setTexture("refractionSamplerHigh",u._lodTextureHigh||u))))}_getRefractionTexture(e){return this._refractionTexture?this._refractionTexture:this._isRefractionEnabled?e.environmentTexture:null}get disableAlphaBlending(){return this._isRefractionEnabled&&this._linkRefractionWithTransparency}fillRenderTargetTextures(e){o.k.RefractionTextureEnabled&&this._refractionTexture&&this._refractionTexture.isRenderTarget&&e.push(this._refractionTexture)}hasTexture(e){return this._thicknessTexture===e||this._refractionTexture===e}hasRenderTargetTextures(){return!!(o.k.RefractionTextureEnabled&&this._refractionTexture&&this._refractionTexture.isRenderTarget)}getActiveTextures(e){this._thicknessTexture&&e.push(this._thicknessTexture),this._refractionTexture&&e.push(this._refractionTexture)}getAnimatables(e){this._thicknessTexture&&this._thicknessTexture.animations&&this._thicknessTexture.animations.length>0&&e.push(this._thicknessTexture),this._refractionTexture&&this._refractionTexture.animations&&this._refractionTexture.animations.length>0&&e.push(this._refractionTexture)}dispose(e){e&&(this._thicknessTexture&&this._thicknessTexture.dispose(),this._refractionTexture&&this._refractionTexture.dispose())}getClassName(){return"PBRSubSurfaceConfiguration"}addFallbacks(e,t,i){return e.SS_SCATTERING&&t.addFallback(i++,"SS_SCATTERING"),e.SS_TRANSLUCENCY&&t.addFallback(i++,"SS_TRANSLUCENCY"),i}getSamplers(e){e.push("thicknessSampler","refractionIntensitySampler","translucencyIntensitySampler","refractionSampler","refractionSamplerLow","refractionSamplerHigh")}getUniforms(){return{ubo:[{name:"vRefractionMicrosurfaceInfos",size:4,type:"vec4"},{name:"vRefractionFilteringInfo",size:2,type:"vec2"},{name:"vTranslucencyIntensityInfos",size:2,type:"vec2"},{name:"vRefractionInfos",size:4,type:"vec4"},{name:"refractionMatrix",size:16,type:"mat4"},{name:"vThicknessInfos",size:2,type:"vec2"},{name:"vRefractionIntensityInfos",size:2,type:"vec2"},{name:"thicknessMatrix",size:16,type:"mat4"},{name:"refractionIntensityMatrix",size:16,type:"mat4"},{name:"translucencyIntensityMatrix",size:16,type:"mat4"},{name:"vThicknessParam",size:2,type:"vec2"},{name:"vDiffusionDistance",size:3,type:"vec3"},{name:"vTintColor",size:4,type:"vec4"},{name:"vSubSurfaceIntensity",size:3,type:"vec3"},{name:"vRefractionPosition",size:3,type:"vec3"},{name:"vRefractionSize",size:3,type:"vec3"},{name:"scatteringDiffusionProfile",size:1,type:"float"}]}}}(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"isRefractionEnabled",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"isTranslucencyEnabled",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markScenePrePassDirty")],p.prototype,"isScatteringEnabled",void 0),(0,n.gn)([(0,s.qC)()],p.prototype,"_scatteringDiffusionProfileIndex",void 0),(0,n.gn)([(0,s.qC)()],p.prototype,"refractionIntensity",void 0),(0,n.gn)([(0,s.qC)()],p.prototype,"translucencyIntensity",void 0),(0,n.gn)([(0,s.qC)()],p.prototype,"useAlbedoToTintRefraction",void 0),(0,n.gn)([(0,s.qC)()],p.prototype,"useAlbedoToTintTranslucency",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"thicknessTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"refractionTexture",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"indexOfRefraction",void 0),(0,n.gn)([(0,s.qC)()],p.prototype,"_volumeIndexOfRefraction",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"volumeIndexOfRefraction",null),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"invertRefractionY",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"linkRefractionWithTransparency",void 0),(0,n.gn)([(0,s.qC)()],p.prototype,"minimumThickness",void 0),(0,n.gn)([(0,s.qC)()],p.prototype,"maximumThickness",void 0),(0,n.gn)([(0,s.qC)()],p.prototype,"useThicknessAsDepth",void 0),(0,n.gn)([(0,s.n9)()],p.prototype,"tintColor",void 0),(0,n.gn)([(0,s.qC)()],p.prototype,"tintColorAtDistance",void 0),(0,n.gn)([(0,s.n9)()],p.prototype,"diffusionDistance",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"useMaskFromThicknessTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"refractionIntensityTexture",void 0),(0,n.gn)([(0,s.oU)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"translucencyIntensityTexture",void 0),(0,n.gn)([(0,s.qC)(),(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],p.prototype,"useGltfStyleTextures",void 0)},7902:(e,t,i)=>{i.d(t,{g:()=>_});var n=i(9472),s=i(3956),r=i(5757),o=i(708),a=i(2333),l=i(7104),h=i(2262),c=i(4246),u=i(8517);i(7246),i(6697);i(8104).v.ShadersStore.proceduralVertexShader="attribute vec2 position;\nvarying vec2 vPosition;\nvarying vec2 vUV;\nconst vec2 madd=vec2(0.5,0.5);\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nvPosition=position;\nvUV=position*madd+madd;\ngl_Position=vec4(position,0.0,1.0);\n#define CUSTOM_VERTEX_MAIN_END\n}";var d=i(2208),p=i(1431),f=i(1345);class _ extends h.x{constructor(e,t,i,n,s=null,l=!0,h=!1,c=0){super(null,n,!l),this.isEnabled=!0,this.autoClear=!0,this.onGeneratedObservable=new r.y$,this.onBeforeGenerationObservable=new r.y$,this.nodeMaterialSource=null,this._textures={},this._currentRefreshId=-1,this._frameId=-1,this._refreshRate=1,this._vertexBuffers={},this._uniforms=new Array,this._samplers=new Array,this._floats={},this._ints={},this._floatsArrays={},this._colors3={},this._colors4={},this._vectors2={},this._vectors3={},this._matrices={},this._fallbackTextureUsed=!1,this._cachedDefines=null,this._contentUpdateId=-1,this._rtWrapper=null;let d=(n=this.getScene()||p.l.LastCreatedScene)._getComponent(a.l.NAME_PROCEDURALTEXTURE);d||(d=new u.O(n),n._addComponent(d)),n.proceduralTextures.push(this),this._fullEngine=n.getEngine(),this.name=e,this.isRenderTarget=!0,this._size=t,this._textureType=c,this._generateMipMaps=l,this._drawWrapper=new f.q(this._fullEngine),this.setFragment(i),this._fallbackTexture=s;const _=this._createRtWrapper(h,t,l,c);this._texture=_.texture;const m=[];m.push(1,1),m.push(-1,1),m.push(-1,-1),m.push(1,-1),this._vertexBuffers[o.o.PositionKind]=new o.o(this._fullEngine,m,o.o.PositionKind,!1,!1,2),this._createIndexBuffer()}_createRtWrapper(e,t,i,n){return e?(this._rtWrapper=this._fullEngine.createRenderTargetCubeTexture(t,{generateMipMaps:i,generateDepthBuffer:!1,generateStencilBuffer:!1,type:n}),this.setFloat("face",0)):this._rtWrapper=this._fullEngine.createRenderTargetTexture(t,{generateMipMaps:i,generateDepthBuffer:!1,generateStencilBuffer:!1,type:n}),this._rtWrapper}getEffect(){return this._drawWrapper.effect}_setEffect(e){this._drawWrapper.effect=e}getContent(){return this._contentData&&this._frameId===this._contentUpdateId||(this._contentData?this._contentData.then((e=>{this._contentData=this.readPixels(0,0,e),this._contentUpdateId=this._frameId})):(this._contentData=this.readPixels(0,0),this._contentUpdateId=this._frameId)),this._contentData}_createIndexBuffer(){const e=this._fullEngine,t=[];t.push(0),t.push(1),t.push(2),t.push(0),t.push(2),t.push(3),this._indexBuffer=e.createIndexBuffer(t)}_rebuild(){const e=this._vertexBuffers[o.o.PositionKind];e&&e._rebuild(),this._createIndexBuffer(),this.refreshRate===c._.REFRESHRATE_RENDER_ONCE&&(this.refreshRate=c._.REFRESHRATE_RENDER_ONCE)}reset(){var e;null===(e=this._drawWrapper.effect)||void 0===e||e.dispose()}_getDefines(){return""}isReady(){const e=this._fullEngine;let t;if(this.nodeMaterialSource)return this._drawWrapper.effect.isReady();if(!this._fragment)return!1;if(this._fallbackTextureUsed)return!0;if(!this._texture)return!1;const i=this._getDefines();return!(!this._drawWrapper.effect||i!==this._cachedDefines||!this._drawWrapper.effect.isReady())||(t=void 0!==this._fragment.fragmentElement?{vertex:"procedural",fragmentElement:this._fragment.fragmentElement}:{vertex:"procedural",fragment:this._fragment},this._cachedDefines!==i&&(this._cachedDefines=i,this._drawWrapper.effect=e.createEffect(t,[o.o.PositionKind],this._uniforms,this._samplers,i,void 0,void 0,(()=>{var e;null===(e=this._rtWrapper)||void 0===e||e.dispose(),this._rtWrapper=this._texture=null,this._fallbackTexture&&(this._texture=this._fallbackTexture._texture,this._texture&&this._texture.incrementReferences()),this._fallbackTextureUsed=!0}))),this._drawWrapper.effect.isReady())}resetRefreshCounter(){this._currentRefreshId=-1}setFragment(e){this._fragment=e}get refreshRate(){return this._refreshRate}set refreshRate(e){this._refreshRate=e,this.resetRefreshCounter()}_shouldRender(){return this.isEnabled&&this.isReady()&&this._texture?!this._fallbackTextureUsed&&(-1===this._currentRefreshId||this.refreshRate===this._currentRefreshId?(this._currentRefreshId=1,this._frameId++,!0):(this._currentRefreshId++,!1)):(this._texture&&(this._texture.isReady=!1),!1)}getRenderSize(){return this._size}resize(e,t){if(this._fallbackTextureUsed||!this._rtWrapper||!this._texture)return;const i=this._texture.isCube;this._rtWrapper.dispose();const n=this._createRtWrapper(i,e,t,this._textureType);this._texture=n.texture,this._size=e,this._generateMipMaps=t}_checkUniform(e){-1===this._uniforms.indexOf(e)&&this._uniforms.push(e)}setTexture(e,t){return-1===this._samplers.indexOf(e)&&this._samplers.push(e),this._textures[e]=t,this}setFloat(e,t){return this._checkUniform(e),this._floats[e]=t,this}setInt(e,t){return this._checkUniform(e),this._ints[e]=t,this}setFloats(e,t){return this._checkUniform(e),this._floatsArrays[e]=t,this}setColor3(e,t){return this._checkUniform(e),this._colors3[e]=t,this}setColor4(e,t){return this._checkUniform(e),this._colors4[e]=t,this}setVector2(e,t){return this._checkUniform(e),this._vectors2[e]=t,this}setVector3(e,t){return this._checkUniform(e),this._vectors3[e]=t,this}setMatrix(e,t){return this._checkUniform(e),this._matrices[e]=t,this}render(e){var t,i;const n=this.getScene();if(!n)return;const s=this._fullEngine;if(s.enableEffect(this._drawWrapper),this.onBeforeGenerationObservable.notifyObservers(this),s.setState(!1),!this.nodeMaterialSource){for(const e in this._textures)this._drawWrapper.effect.setTexture(e,this._textures[e]);for(const e in this._ints)this._drawWrapper.effect.setInt(e,this._ints[e]);for(const e in this._floats)this._drawWrapper.effect.setFloat(e,this._floats[e]);for(const e in this._floatsArrays)this._drawWrapper.effect.setArray(e,this._floatsArrays[e]);for(const e in this._colors3)this._drawWrapper.effect.setColor3(e,this._colors3[e]);for(const e in this._colors4){const t=this._colors4[e];this._drawWrapper.effect.setFloat4(e,t.r,t.g,t.b,t.a)}for(const e in this._vectors2)this._drawWrapper.effect.setVector2(e,this._vectors2[e]);for(const e in this._vectors3)this._drawWrapper.effect.setVector3(e,this._vectors3[e]);for(const e in this._matrices)this._drawWrapper.effect.setMatrix(e,this._matrices[e])}if(!this._texture||!this._rtWrapper)return;null===(t=s._debugPushGroup)||void 0===t||t.call(s,`procedural texture generation for ${this.name}`,1);const r=s.currentViewport;if(this.isCube)for(let e=0;e<6;e++)s.bindFramebuffer(this._rtWrapper,e,void 0,void 0,!0),s.bindBuffers(this._vertexBuffers,this._indexBuffer,this._drawWrapper.effect),this._drawWrapper.effect.setFloat("face",e),this.autoClear&&s.clear(n.clearColor,!0,!1,!1),s.drawElementsType(l.F.TriangleFillMode,0,6);else s.bindFramebuffer(this._rtWrapper,0,void 0,void 0,!0),s.bindBuffers(this._vertexBuffers,this._indexBuffer,this._drawWrapper.effect),this.autoClear&&s.clear(n.clearColor,!0,!1,!1),s.drawElementsType(l.F.TriangleFillMode,0,6);s.unBindFramebuffer(this._rtWrapper,this.isCube),r&&s.setViewport(r),this.isCube&&s.generateMipMapsForCubemap(this._texture),null===(i=s._debugPopGroup)||void 0===i||i.call(s,1),this.onGenerated&&this.onGenerated(),this.onGeneratedObservable.notifyObservers(this)}clone(){const e=this.getSize(),t=new _(this.name,e.width,this._fragment,this.getScene(),this._fallbackTexture,this._generateMipMaps);return t.hasAlpha=this.hasAlpha,t.level=this.level,t.coordinatesMode=this.coordinatesMode,t}dispose(){const e=this.getScene();if(!e)return;const t=e.proceduralTextures.indexOf(this);t>=0&&e.proceduralTextures.splice(t,1);const i=this._vertexBuffers[o.o.PositionKind];i&&(i.dispose(),this._vertexBuffers[o.o.PositionKind]=null),this._indexBuffer&&this._fullEngine._releaseBuffer(this._indexBuffer)&&(this._indexBuffer=null),this.onGeneratedObservable.clear(),this.onBeforeGenerationObservable.clear(),super.dispose()}}(0,n.gn)([(0,s.qC)()],_.prototype,"isEnabled",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"autoClear",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"_generateMipMaps",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"_size",void 0),(0,n.gn)([(0,s.qC)()],_.prototype,"refreshRate",null),(0,d.H)("BABYLON.ProceduralTexture",_)},8517:(e,t,i)=>{i.d(t,{O:()=>r});var n=i(7257),s=i(2333);class r{constructor(e){this.name=s.l.NAME_PROCEDURALTEXTURE,this.scene=e,this.scene.proceduralTextures=new Array}register(){this.scene._beforeClearStage.registerStep(s.l.STEP_BEFORECLEAR_PROCEDURALTEXTURE,this,this._beforeClear)}rebuild(){}dispose(){}_beforeClear(){if(this.scene.proceduralTexturesEnabled){n.w1.StartPerformanceCounter("Procedural textures",this.scene.proceduralTextures.length>0);for(let e=0;e<this.scene.proceduralTextures.length;e++){const t=this.scene.proceduralTextures[e];t._shouldRender()&&t.render()}n.w1.EndPerformanceCounter("Procedural textures",this.scene.proceduralTextures.length>0)}}}},6702:(e,t,i)=>{i.d(t,{V:()=>c});var n=i(9472),s=i(3956),r=i(5757),o=i(4141),a=i(1431),l=i(1983),h=(i(5661),i(2035));class c extends h.g{set hasAlpha(e){this._hasAlpha!==e&&(this._hasAlpha=e,this._scene&&this._scene.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this))))}get hasAlpha(){return this._hasAlpha}set getAlphaFromRGB(e){this._getAlphaFromRGB!==e&&(this._getAlphaFromRGB=e,this._scene&&this._scene.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this))))}get getAlphaFromRGB(){return this._getAlphaFromRGB}set coordinatesIndex(e){this._coordinatesIndex!==e&&(this._coordinatesIndex=e,this._scene&&this._scene.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this))))}get coordinatesIndex(){return this._coordinatesIndex}set coordinatesMode(e){this._coordinatesMode!==e&&(this._coordinatesMode=e,this._scene&&this._scene.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this))))}get coordinatesMode(){return this._coordinatesMode}get wrapU(){return this._wrapU}set wrapU(e){this._wrapU=e}get wrapV(){return this._wrapV}set wrapV(e){this._wrapV=e}get isCube(){return this._texture?this._texture.isCube:this._isCube}set isCube(e){this._texture?this._texture.isCube=e:this._isCube=e}get is3D(){return!!this._texture&&this._texture.is3D}set is3D(e){this._texture&&(this._texture.is3D=e)}get is2DArray(){return!!this._texture&&this._texture.is2DArray}set is2DArray(e){this._texture&&(this._texture.is2DArray=e)}get gammaSpace(){return this._texture?(null===this._texture._gammaSpace&&(this._texture._gammaSpace=this._gammaSpace),this._texture._gammaSpace&&!this._texture._useSRGBBuffer):this._gammaSpace}set gammaSpace(e){if(this._texture){if(this._texture._gammaSpace===e)return;this._texture._gammaSpace=e}else{if(this._gammaSpace===e)return;this._gammaSpace=e}this._markAllSubMeshesAsTexturesDirty()}get isRGBD(){return null!=this._texture&&this._texture._isRGBD}set isRGBD(e){this._texture&&(this._texture._isRGBD=e)}get noMipmap(){return!1}get lodGenerationOffset(){return this._texture?this._texture._lodGenerationOffset:0}set lodGenerationOffset(e){this._texture&&(this._texture._lodGenerationOffset=e)}get lodGenerationScale(){return this._texture?this._texture._lodGenerationScale:0}set lodGenerationScale(e){this._texture&&(this._texture._lodGenerationScale=e)}get linearSpecularLOD(){return!!this._texture&&this._texture._linearSpecularLOD}set linearSpecularLOD(e){this._texture&&(this._texture._linearSpecularLOD=e)}get irradianceTexture(){return this._texture?this._texture._irradianceTexture:null}set irradianceTexture(e){this._texture&&(this._texture._irradianceTexture=e)}get uid(){return this._uid||(this._uid=(0,l.f)()),this._uid}toString(){return this.name}getClassName(){return"BaseTexture"}set onDispose(e){this._onDisposeObserver&&this.onDisposeObservable.remove(this._onDisposeObserver),this._onDisposeObserver=this.onDisposeObservable.add(e)}get isBlocking(){return!0}get loadingError(){return this._loadingError}get errorObject(){return this._errorObject}constructor(e,t=null){super(null),this.metadata=null,this.reservedDataStore=null,this._hasAlpha=!1,this._getAlphaFromRGB=!1,this.level=1,this._coordinatesIndex=0,this.optimizeUVAllocation=!0,this._coordinatesMode=0,this.wrapR=1,this.anisotropicFilteringLevel=c.DEFAULT_ANISOTROPIC_FILTERING_LEVEL,this._isCube=!1,this._gammaSpace=!0,this.invertZ=!1,this.lodLevelInAlpha=!1,this.isRenderTarget=!1,this._prefiltered=!1,this._forceSerialize=!1,this.animations=new Array,this.onDisposeObservable=new r.y$,this._onDisposeObserver=null,this._scene=null,this._uid=null,this._parentContainer=null,this._loadingError=!1,e?c._IsScene(e)?this._scene=e:this._engine=e:this._scene=a.l.LastCreatedScene,this._scene&&(this.uniqueId=this._scene.getUniqueId(),this._scene.addTexture(this),this._engine=this._scene.getEngine()),this._texture=t,this._uid=null}getScene(){return this._scene}_getEngine(){return this._engine}checkTransformsAreIdentical(e){return null!==e}getTextureMatrix(){return o.y3.IdentityReadOnly}getReflectionTextureMatrix(){return o.y3.IdentityReadOnly}getRefractionTextureMatrix(){return this.getReflectionTextureMatrix()}isReadyOrNotBlocking(){return!this.isBlocking||this.isReady()||this.loadingError}scale(e){}get canRescale(){return!1}_getFromCache(e,t,i,n,s,r){const o=this._getEngine();if(!o)return null;const a=o._getUseSRGBBuffer(!!s,t),l=o.getLoadedTexturesCache();for(let o=0;o<l.length;o++){const h=l[o];if(!(void 0!==s&&a!==h._useSRGBBuffer||void 0!==n&&n!==h.invertY||h.url!==e||h.generateMipMaps!==!t||i&&i!==h.samplingMode||void 0!==r&&r!==h.isCube))return h.incrementReferences(),h}return null}_rebuild(){}clone(){return null}get textureType(){return this._texture&&void 0!==this._texture.type?this._texture.type:0}get textureFormat(){return this._texture&&void 0!==this._texture.format?this._texture.format:5}_markAllSubMeshesAsTexturesDirty(){const e=this.getScene();e&&e.markAllMaterialsAsDirty(1)}readPixels(e=0,t=0,i=null,n=!0,s=!1,r=0,o=0,a=Number.MAX_VALUE,l=Number.MAX_VALUE){if(!this._texture)return null;const h=this._getEngine();if(!h)return null;const c=this.getSize();let u=c.width,d=c.height;0!==t&&(u/=Math.pow(2,t),d/=Math.pow(2,t),u=Math.round(u),d=Math.round(d)),a=Math.min(u,a),l=Math.min(d,l);try{return this._texture.isCube?h._readTexturePixels(this._texture,a,l,e,t,i,n,s,r,o):h._readTexturePixels(this._texture,a,l,-1,t,i,n,s,r,o)}catch(e){return null}}_readPixelsSync(e=0,t=0,i=null,n=!0,s=!1){if(!this._texture)return null;const r=this.getSize();let o=r.width,a=r.height;const l=this._getEngine();if(!l)return null;0!=t&&(o/=Math.pow(2,t),a/=Math.pow(2,t),o=Math.round(o),a=Math.round(a));try{return this._texture.isCube?l._readTexturePixelsSync(this._texture,o,a,e,t,i,n,s):l._readTexturePixelsSync(this._texture,o,a,-1,t,i,n,s)}catch(e){return null}}get _lodTextureHigh(){return this._texture?this._texture._lodTextureHigh:null}get _lodTextureMid(){return this._texture?this._texture._lodTextureMid:null}get _lodTextureLow(){return this._texture?this._texture._lodTextureLow:null}dispose(){if(this._scene){this._scene.stopAnimation&&this._scene.stopAnimation(this),this._scene.removePendingData(this);const e=this._scene.textures.indexOf(this);if(e>=0&&this._scene.textures.splice(e,1),this._scene.onTextureRemovedObservable.notifyObservers(this),this._scene=null,this._parentContainer){const e=this._parentContainer.textures.indexOf(this);e>-1&&this._parentContainer.textures.splice(e,1),this._parentContainer=null}}this.onDisposeObservable.notifyObservers(this),this.onDisposeObservable.clear(),this.metadata=null,super.dispose()}serialize(e=!1){if(!this.name&&!e)return null;const t=s.p4.Serialize(this);return s.p4.AppendSerializedAnimations(this,t),t}static WhenAllReady(e,t){let i=e.length;if(0!==i)for(let n=0;n<e.length;n++){const s=e[n];if(s.isReady())0==--i&&t();else{const e=s.onLoadObservable;e?e.addOnce((()=>{0==--i&&t()})):0==--i&&t()}}else t()}static _IsScene(e){return"Scene"===e.getClassName()}}c.DEFAULT_ANISOTROPIC_FILTERING_LEVEL=4,(0,n.gn)([(0,s.qC)()],c.prototype,"uniqueId",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"name",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"metadata",void 0),(0,n.gn)([(0,s.qC)("hasAlpha")],c.prototype,"_hasAlpha",void 0),(0,n.gn)([(0,s.qC)("getAlphaFromRGB")],c.prototype,"_getAlphaFromRGB",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"level",void 0),(0,n.gn)([(0,s.qC)("coordinatesIndex")],c.prototype,"_coordinatesIndex",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"optimizeUVAllocation",void 0),(0,n.gn)([(0,s.qC)("coordinatesMode")],c.prototype,"_coordinatesMode",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"wrapU",null),(0,n.gn)([(0,s.qC)()],c.prototype,"wrapV",null),(0,n.gn)([(0,s.qC)()],c.prototype,"wrapR",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"anisotropicFilteringLevel",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"isCube",null),(0,n.gn)([(0,s.qC)()],c.prototype,"is3D",null),(0,n.gn)([(0,s.qC)()],c.prototype,"is2DArray",null),(0,n.gn)([(0,s.qC)()],c.prototype,"gammaSpace",null),(0,n.gn)([(0,s.qC)()],c.prototype,"invertZ",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"lodLevelInAlpha",void 0),(0,n.gn)([(0,s.qC)()],c.prototype,"lodGenerationOffset",null),(0,n.gn)([(0,s.qC)()],c.prototype,"lodGenerationScale",null),(0,n.gn)([(0,s.qC)()],c.prototype,"linearSpecularLOD",null),(0,n.gn)([(0,s.oU)()],c.prototype,"irradianceTexture",null),(0,n.gn)([(0,s.qC)()],c.prototype,"isRenderTarget",void 0)},452:(e,t,i)=>{var n=i(123),s=i(6702);s.V.prototype.forceSphericalPolynomialsRecompute=function(){this._texture&&(this._texture._sphericalPolynomial=null,this._texture._sphericalPolynomialPromise=null,this._texture._sphericalPolynomialComputed=!1)},Object.defineProperty(s.V.prototype,"sphericalPolynomial",{get:function(){if(this._texture){if(this._texture._sphericalPolynomial||this._texture._sphericalPolynomialComputed)return this._texture._sphericalPolynomial;if(this._texture.isReady)return this._texture._sphericalPolynomialPromise||(this._texture._sphericalPolynomialPromise=n.$.ConvertCubeMapTextureToSphericalPolynomial(this),null===this._texture._sphericalPolynomialPromise?this._texture._sphericalPolynomialComputed=!0:this._texture._sphericalPolynomialPromise.then((e=>{this._texture._sphericalPolynomial=e,this._texture._sphericalPolynomialComputed=!0}))),null}return null},set:function(e){this._texture&&(this._texture._sphericalPolynomial=e)},enumerable:!0,configurable:!0})},4051:(e,t,i)=>{i.d(t,{B:()=>u});var n=i(9472),s=i(3956),r=i(7257),o=i(4141),a=i(6702),l=i(2262),h=i(2208),c=(i(2477),i(5757));class u extends a.V{set boundingBoxSize(e){if(this._boundingBoxSize&&this._boundingBoxSize.equals(e))return;this._boundingBoxSize=e;const t=this.getScene();t&&t.markAllMaterialsAsDirty(1)}get boundingBoxSize(){return this._boundingBoxSize}set rotationY(e){this._rotationY=e,this.setReflectionTextureMatrix(o.y3.RotationY(this._rotationY))}get rotationY(){return this._rotationY}get noMipmap(){return this._noMipmap}get forcedExtension(){return this._forcedExtension}static CreateFromImages(e,t,i){let n="";return e.forEach((e=>n+=e)),new u(n,t,null,i,e)}static CreateFromPrefilteredData(e,t,i=null,n=!0){const s=t.useDelayedTextureLoading;t.useDelayedTextureLoading=!1;const r=new u(e,t,null,!1,null,null,null,void 0,!0,i,n);return t.useDelayedTextureLoading=s,r}constructor(e,t,i=null,n=!1,s=null,r=null,a=null,h=5,u=!1,d=null,p=!1,f=.8,_=0,m,g){var v;super(t),this._lodScale=.8,this._lodOffset=0,this.onLoadObservable=new c.y$,this.boundingBoxPosition=o.P.Zero(),this._rotationY=0,this._files=null,this._forcedExtension=null,this._extensions=null,this._textureMatrixRefraction=new o.y3,this.name=e,this.url=e,this._noMipmap=n,this.hasAlpha=!1,this._format=h,this.isCube=!0,this._textureMatrix=o.y3.Identity(),this._createPolynomials=p,this.coordinatesMode=l.x.CUBIC_MODE,this._extensions=i,this._files=s,this._forcedExtension=d,this._loaderOptions=m,this._useSRGBBuffer=g,this._lodScale=f,this._lodOffset=_,(e||s)&&this.updateURL(e,d,r,u,a,i,null===(v=this.getScene())||void 0===v?void 0:v.useDelayedTextureLoading,s)}getClassName(){return"CubeTexture"}updateURL(e,t,i=null,n=!1,s=null,r=null,o=!1,a=null){this.name&&!this.name.startsWith("data:")||(this.name=e),this.url=e,t&&(this._forcedExtension=t);const l=e.lastIndexOf("."),h=t||(l>-1?e.substring(l).toLowerCase():""),c=0===h.indexOf(".dds"),u=0===h.indexOf(".env"),d=0===h.indexOf(".basis");if(u?(this.gammaSpace=!1,this._prefiltered=!1,this.anisotropicFilteringLevel=1):(this._prefiltered=n,n&&(this.gammaSpace=!1,this.anisotropicFilteringLevel=1)),a)this._files=a;else if(d||u||c||r||(r=["_px.jpg","_py.jpg","_pz.jpg","_nx.jpg","_ny.jpg","_nz.jpg"]),this._files=this._files||[],this._files.length=0,r){for(let t=0;t<r.length;t++)this._files.push(e+r[t]);this._extensions=r}o?(this.delayLoadState=4,this._delayedOnLoad=i,this._delayedOnError=s):this._loadTexture(i,s)}delayLoad(e){4===this.delayLoadState&&(e&&(this._forcedExtension=e),this.delayLoadState=1,this._loadTexture(this._delayedOnLoad,this._delayedOnError))}getReflectionTextureMatrix(){return this._textureMatrix}setReflectionTextureMatrix(e){var t,i;if(e.updateFlag===this._textureMatrix.updateFlag)return;if(e.isIdentity()!==this._textureMatrix.isIdentity()&&(null===(t=this.getScene())||void 0===t||t.markAllMaterialsAsDirty(1,(e=>-1!==e.getActiveTextures().indexOf(this)))),this._textureMatrix=e,!(null===(i=this.getScene())||void 0===i?void 0:i.useRightHandedSystem))return;const n=o.jp.Vector3[0],s=o.jp.Quaternion[0],r=o.jp.Vector3[1];this._textureMatrix.decompose(n,s,r),s.z*=-1,s.w*=-1,o.y3.ComposeToRef(n,s,r,this._textureMatrixRefraction)}getRefractionTextureMatrix(){var e;return(null===(e=this.getScene())||void 0===e?void 0:e.useRightHandedSystem)?this._textureMatrixRefraction:this._textureMatrix}_loadTexture(e=null,t=null){var i;const n=this.getScene(),s=this._texture;this._texture=this._getFromCache(this.url,this._noMipmap,void 0,void 0,this._useSRGBBuffer,this.isCube);const o=()=>{var t;this.onLoadObservable.notifyObservers(this),s&&(s.dispose(),null===(t=this.getScene())||void 0===t||t.markAllMaterialsAsDirty(1)),e&&e()},a=(e,i)=>{this._loadingError=!0,this._errorObject={message:e,exception:i},t&&t(e,i),l.x.OnTextureLoadErrorObservable.notifyObservers(this)};this._texture?this._texture.isReady?r.w1.SetImmediate((()=>o())):this._texture.onLoadedObservable.add((()=>o())):(this._prefiltered?this._texture=this._getEngine().createPrefilteredCubeTexture(this.url,n,this._lodScale,this._lodOffset,e,a,this._format,this._forcedExtension,this._createPolynomials):this._texture=this._getEngine().createCubeTexture(this.url,n,this._files,this._noMipmap,e,a,this._format,this._forcedExtension,!1,this._lodScale,this._lodOffset,null,this._loaderOptions,!!this._useSRGBBuffer),null===(i=this._texture)||void 0===i||i.onLoadedObservable.add((()=>this.onLoadObservable.notifyObservers(this))))}static Parse(e,t,i){const n=s.p4.Parse((()=>{let n=!1;return e.prefiltered&&(n=e.prefiltered),new u(i+e.name,t,e.extensions,!1,e.files||null,null,null,void 0,n,e.forcedExtension)}),e,t);if(e.boundingBoxPosition&&(n.boundingBoxPosition=o.P.FromArray(e.boundingBoxPosition)),e.boundingBoxSize&&(n.boundingBoxSize=o.P.FromArray(e.boundingBoxSize)),e.animations)for(let t=0;t<e.animations.length;t++){const i=e.animations[t],s=(0,h.q)("BABYLON.Animation");s&&n.animations.push(s.Parse(i))}return n}clone(){let e=0;const t=s.p4.Clone((()=>{const t=new u(this.url,this.getScene()||this._getEngine(),this._extensions,this._noMipmap,this._files);return e=t.uniqueId,t}),this);return t.uniqueId=e,t}}(0,n.gn)([(0,s.qC)()],u.prototype,"url",void 0),(0,n.gn)([(0,s.hd)()],u.prototype,"boundingBoxPosition",void 0),(0,n.gn)([(0,s.hd)()],u.prototype,"boundingBoxSize",null),(0,n.gn)([(0,s.qC)("rotationY")],u.prototype,"rotationY",null),(0,n.gn)([(0,s.qC)("files")],u.prototype,"_files",void 0),(0,n.gn)([(0,s.qC)("forcedExtension")],u.prototype,"_forcedExtension",void 0),(0,n.gn)([(0,s.qC)("extensions")],u.prototype,"_extensions",void 0),(0,n.gn)([(0,s.oQ)("textureMatrix")],u.prototype,"_textureMatrix",void 0),(0,n.gn)([(0,s.oQ)("textureMatrixRefraction")],u.prototype,"_textureMatrixRefraction",void 0),l.x._CubeTextureParser=u.Parse,(0,h.H)("BABYLON.CubeTexture",u)},4160:(e,t,i)=>{i.d(t,{c:()=>r});var n=i(2722),s=i(2262);i(6914);class r extends s.x{constructor(e,t,i=null,n=!1,r=3,o=5,a){super(null,i,!n,a,r,void 0,void 0,void 0,void 0,o),this.name=e,this.wrapU=s.x.CLAMP_ADDRESSMODE,this.wrapV=s.x.CLAMP_ADDRESSMODE,this._generateMipMaps=n;const l=this._getEngine();if(!l)return;t.getContext?(this._canvas=t,this._texture=l.createDynamicTexture(t.width,t.height,n,r)):(this._canvas=l.createCanvas(1,1),t.width||0===t.width?this._texture=l.createDynamicTexture(t.width,t.height,n,r):this._texture=l.createDynamicTexture(t,t,n,r));const h=this.getSize();this._canvas.width!==h.width&&(this._canvas.width=h.width),this._canvas.height!==h.height&&(this._canvas.height=h.height),this._context=this._canvas.getContext("2d")}getClassName(){return"DynamicTexture"}get canRescale(){return!0}_recreate(e){this._canvas.width=e.width,this._canvas.height=e.height,this.releaseInternalTexture(),this._texture=this._getEngine().createDynamicTexture(e.width,e.height,this._generateMipMaps,this.samplingMode)}scale(e){const t=this.getSize();t.width*=e,t.height*=e,this._recreate(t)}scaleTo(e,t){const i=this.getSize();i.width=e,i.height=t,this._recreate(i)}getContext(){return this._context}clear(){const e=this.getSize();this._context.fillRect(0,0,e.width,e.height)}update(e,t=!1,i=!1){this._getEngine().updateDynamicTexture(this._texture,this._canvas,void 0===e||e,t,this._format||void 0,void 0,i)}drawText(e,t,i,n,s,r,o,a=!0){const l=this.getSize();if(r&&(this._context.fillStyle=r,this._context.fillRect(0,0,l.width,l.height)),this._context.font=n,null==t){const i=this._context.measureText(e);t=(l.width-i.width)/2}if(null==i){const e=parseInt(n.replace(/\D/g,""));i=l.height/2+e/3.65}this._context.fillStyle=s||"",this._context.fillText(e,t,i),a&&this.update(o)}clone(){const e=this.getScene();if(!e)return this;const t=this.getSize(),i=new r(this.name,t,e,this._generateMipMaps);return i.hasAlpha=this.hasAlpha,i.level=this.level,i.wrapU=this.wrapU,i.wrapV=this.wrapV,i}serialize(){const e=this.getScene();e&&!e.isReady()&&n.Y.Warn("The scene must be ready before serializing the dynamic texture");const t=super.serialize();return r._IsCanvasElement(this._canvas)&&(t.base64String=this._canvas.toDataURL()),t.invertY=this._invertY,t.samplingMode=this.samplingMode,t}static _IsCanvasElement(e){return void 0!==e.toDataURL}_rebuild(){this.update()}}},6202:(e,t,i)=>{i.d(t,{S:()=>n,l:()=>o});var n,s=i(5757),r=i(3297);!function(e){e[e.Unknown=0]="Unknown",e[e.Url=1]="Url",e[e.Temp=2]="Temp",e[e.Raw=3]="Raw",e[e.Dynamic=4]="Dynamic",e[e.RenderTarget=5]="RenderTarget",e[e.MultiRenderTarget=6]="MultiRenderTarget",e[e.Cube=7]="Cube",e[e.CubeRaw=8]="CubeRaw",e[e.CubePrefiltered=9]="CubePrefiltered",e[e.Raw3D=10]="Raw3D",e[e.Raw2DArray=11]="Raw2DArray",e[e.DepthStencil=12]="DepthStencil",e[e.CubeRawRGBD=13]="CubeRawRGBD",e[e.Depth=14]="Depth"}(n||(n={}));class o extends r.a{get useMipMaps(){return this.generateMipMaps}set useMipMaps(e){this.generateMipMaps=e}get uniqueId(){return this._uniqueId}_setUniqueId(e){this._uniqueId=e}getEngine(){return this._engine}get source(){return this._source}constructor(e,t,i=!1){super(),this.isReady=!1,this.isCube=!1,this.is3D=!1,this.is2DArray=!1,this.isMultiview=!1,this.url="",this.generateMipMaps=!1,this.samples=0,this.type=-1,this.format=-1,this.onLoadedObservable=new s.y$,this.onErrorObservable=new s.y$,this.onRebuildCallback=null,this.width=0,this.height=0,this.depth=0,this.baseWidth=0,this.baseHeight=0,this.baseDepth=0,this.invertY=!1,this._invertVScale=!1,this._associatedChannel=-1,this._source=n.Unknown,this._buffer=null,this._bufferView=null,this._bufferViewArray=null,this._bufferViewArrayArray=null,this._size=0,this._extension="",this._files=null,this._workingCanvas=null,this._workingContext=null,this._cachedCoordinatesMode=null,this._isDisabled=!1,this._compression=null,this._sphericalPolynomial=null,this._sphericalPolynomialPromise=null,this._sphericalPolynomialComputed=!1,this._lodGenerationScale=0,this._lodGenerationOffset=0,this._useSRGBBuffer=!1,this._lodTextureHigh=null,this._lodTextureMid=null,this._lodTextureLow=null,this._isRGBD=!1,this._linearSpecularLOD=!1,this._irradianceTexture=null,this._hardwareTexture=null,this._maxLodLevel=null,this._references=1,this._gammaSpace=null,this._engine=e,this._source=t,this._uniqueId=o._Counter++,i||(this._hardwareTexture=e._createHardwareTexture())}incrementReferences(){this._references++}updateSize(e,t,i=1){this._engine.updateTextureDimensions(this,e,t,i),this.width=e,this.height=t,this.depth=i,this.baseWidth=e,this.baseHeight=t,this.baseDepth=i,this._size=e*t*i}_rebuild(){var e;if(this.isReady=!1,this._cachedCoordinatesMode=null,this._cachedWrapU=null,this._cachedWrapV=null,this._cachedWrapR=null,this._cachedAnisotropicFilteringLevel=null,this.onRebuildCallback){const e=this.onRebuildCallback(this),t=t=>{t._swapAndDie(this,!1),this.isReady=e.isReady};return void(e.isAsync?e.proxy.then(t):t(e.proxy))}let t;switch(this.source){case n.Temp:break;case n.Url:return void(t=this._engine.createTexture(null!==(e=this._originalUrl)&&void 0!==e?e:this.url,!this.generateMipMaps,this.invertY,null,this.samplingMode,(e=>{e._swapAndDie(this,!1),this.isReady=!0}),null,this._buffer,void 0,this.format,this._extension,void 0,void 0,void 0,this._useSRGBBuffer));case n.Raw:t=this._engine.createRawTexture(this._bufferView,this.baseWidth,this.baseHeight,this.format,this.generateMipMaps,this.invertY,this.samplingMode,this._compression,this.type,void 0,this._useSRGBBuffer),t._swapAndDie(this,!1),this.isReady=!0;break;case n.Raw3D:t=this._engine.createRawTexture3D(this._bufferView,this.baseWidth,this.baseHeight,this.baseDepth,this.format,this.generateMipMaps,this.invertY,this.samplingMode,this._compression,this.type),t._swapAndDie(this,!1),this.isReady=!0;break;case n.Raw2DArray:t=this._engine.createRawTexture2DArray(this._bufferView,this.baseWidth,this.baseHeight,this.baseDepth,this.format,this.generateMipMaps,this.invertY,this.samplingMode,this._compression,this.type),t._swapAndDie(this,!1),this.isReady=!0;break;case n.Dynamic:t=this._engine.createDynamicTexture(this.baseWidth,this.baseHeight,this.generateMipMaps,this.samplingMode),t._swapAndDie(this,!1),this._engine.updateDynamicTexture(this,this._engine.getRenderingCanvas(),this.invertY,void 0,void 0,!0);break;case n.Cube:return void(t=this._engine.createCubeTexture(this.url,null,this._files,!this.generateMipMaps,(()=>{t._swapAndDie(this,!1),this.isReady=!0}),null,this.format,this._extension,!1,0,0,null,void 0,this._useSRGBBuffer));case n.CubeRaw:t=this._engine.createRawCubeTexture(this._bufferViewArray,this.width,this.format,this.type,this.generateMipMaps,this.invertY,this.samplingMode,this._compression),t._swapAndDie(this,!1),this.isReady=!0;break;case n.CubeRawRGBD:return;case n.CubePrefiltered:return t=this._engine.createPrefilteredCubeTexture(this.url,null,this._lodGenerationScale,this._lodGenerationOffset,(e=>{e&&e._swapAndDie(this,!1),this.isReady=!0}),null,this.format,this._extension),void(t._sphericalPolynomial=this._sphericalPolynomial)}}_swapAndDie(e,t=!0){var i;null===(i=this._hardwareTexture)||void 0===i||i.setUsage(e._source,this.generateMipMaps,this.isCube,this.width,this.height),e._hardwareTexture=this._hardwareTexture,t&&(e._isRGBD=this._isRGBD),this._lodTextureHigh&&(e._lodTextureHigh&&e._lodTextureHigh.dispose(),e._lodTextureHigh=this._lodTextureHigh),this._lodTextureMid&&(e._lodTextureMid&&e._lodTextureMid.dispose(),e._lodTextureMid=this._lodTextureMid),this._lodTextureLow&&(e._lodTextureLow&&e._lodTextureLow.dispose(),e._lodTextureLow=this._lodTextureLow),this._irradianceTexture&&(e._irradianceTexture&&e._irradianceTexture.dispose(),e._irradianceTexture=this._irradianceTexture);const n=this._engine.getLoadedTexturesCache();let s=n.indexOf(this);-1!==s&&n.splice(s,1),s=n.indexOf(e),-1===s&&n.push(e)}dispose(){this._references--,this.onLoadedObservable.clear(),this.onErrorObservable.clear(),0===this._references&&(this._engine._releaseTexture(this),this._hardwareTexture=null)}}o._Counter=0},9630:(e,t,i)=>{i.d(t,{N:()=>a});var n=i(3956),s=i(4277),r=i(6202),o=i(4051);i(6599);class a extends o.B{constructor(e,t,i,n=5,s=0,r=!1,o=!1,a=3,l=null){super("",e),this._texture=e.getEngine().createRawCubeTexture(t,i,n,s,r,o,a,l)}update(e,t,i,n,s=null){this._texture.getEngine().updateRawCubeTexture(this._texture,e,t,i,n,s)}updateRGBDAsync(e,t=null,i=.8,n=0){return(0,s.Lf)(this._texture,e,t,i,n).then((()=>{}))}clone(){return n.p4.Clone((()=>{const e=this.getScene(),t=this._texture,i=new a(e,t._bufferViewArray,t.width,t.format,t.type,t.generateMipMaps,t.invertY,t.samplingMode,t._compression);return t.source===r.S.CubeRawRGBD&&i.updateRGBDAsync(t._bufferViewArrayArray,t._sphericalPolynomial,t._lodGenerationScale,t._lodGenerationOffset),i}),this)}}},7647:(e,t,i)=>{i.d(t,{l:()=>s});var n=i(2262);i(6599);class s extends n.x{constructor(e,t,i,s,r,o=!0,a=!1,l=3,h=0,c,u){super(null,r,!o,a,void 0,void 0,void 0,void 0,void 0,void 0,void 0,void 0,c),this.format=s,this._engine&&(this._engine._caps.textureFloatLinearFiltering||1!==h||(l=1),this._engine._caps.textureHalfFloatLinearFiltering||2!==h||(l=1),this._texture=this._engine.createRawTexture(e,t,i,s,o,a,l,null,h,null!=c?c:0,null!=u&&u),this.wrapU=n.x.CLAMP_ADDRESSMODE,this.wrapV=n.x.CLAMP_ADDRESSMODE)}update(e){this._getEngine().updateRawTexture(this._texture,e,this._texture.format,this._texture.invertY,null,this._texture.type,this._texture._useSRGBBuffer)}static CreateLuminanceTexture(e,t,i,n,r=!0,o=!1,a=3){return new s(e,t,i,1,n,r,o,a)}static CreateLuminanceAlphaTexture(e,t,i,n,r=!0,o=!1,a=3){return new s(e,t,i,2,n,r,o,a)}static CreateAlphaTexture(e,t,i,n,r=!0,o=!1,a=3){return new s(e,t,i,0,n,r,o,a)}static CreateRGBTexture(e,t,i,n,r=!0,o=!1,a=3,l=0,h=0,c=!1){return new s(e,t,i,4,n,r,o,a,l,h,c)}static CreateRGBATexture(e,t,i,n,r=!0,o=!1,a=3,l=0,h=0,c=!1){return new s(e,t,i,5,n,r,o,a,l,h,c)}static CreateRGBAStorageTexture(e,t,i,n,r=!0,o=!1,a=3,l=0,h=!1){return new s(e,t,i,5,n,r,o,a,l,1,h)}static CreateRTexture(e,t,i,r,o=!0,a=!1,l=n.x.TRILINEAR_SAMPLINGMODE,h=1){return new s(e,t,i,6,r,o,a,l,h)}static CreateRStorageTexture(e,t,i,r,o=!0,a=!1,l=n.x.TRILINEAR_SAMPLINGMODE,h=1){return new s(e,t,i,6,r,o,a,l,h,1)}}},3324:(e,t,i)=>{i.d(t,{e:()=>s});var n=i(2262);i(6599);class s extends n.x{get depth(){return this._depth}constructor(e,t,i,s,r,o,a=!0,l=!1,h=n.x.TRILINEAR_SAMPLINGMODE,c=0){super(null,o,!a,l),this.format=r,this._texture=o.getEngine().createRawTexture2DArray(e,t,i,s,r,a,l,h,null,c),this._depth=s,this.is2DArray=!0}update(e){this._texture&&this._getEngine().updateRawTexture2DArray(this._texture,e,this._texture.format,this._texture.invertY,null,this._texture.type)}static CreateRGBATexture(e,t,i,n,r,o=!0,a=!1,l=3,h=0){return new s(e,t,i,n,5,r,o,a,l,h)}}},4246:(e,t,i)=>{i.d(t,{_:()=>u});var n=i(5757),s=i(4141),r=i(2262),o=i(727),a=i(4221),l=(i(7246),i(6697),i(7814)),h=i(5860),c=i(2286);class u extends r.x{get renderList(){return this._renderList}set renderList(e){this._unObserveRenderList&&(this._unObserveRenderList(),this._unObserveRenderList=null),e&&(this._unObserveRenderList=(0,h.M)(e,this._renderListHasChanged)),this._renderList=e}get postProcesses(){return this._postProcesses}get _prePassEnabled(){return!!this._prePassRenderTarget&&this._prePassRenderTarget.enabled}set onAfterUnbind(e){this._onAfterUnbindObserver&&this.onAfterUnbindObservable.remove(this._onAfterUnbindObserver),this._onAfterUnbindObserver=this.onAfterUnbindObservable.add(e)}set onBeforeRender(e){this._onBeforeRenderObserver&&this.onBeforeRenderObservable.remove(this._onBeforeRenderObserver),this._onBeforeRenderObserver=this.onBeforeRenderObservable.add(e)}set onAfterRender(e){this._onAfterRenderObserver&&this.onAfterRenderObservable.remove(this._onAfterRenderObserver),this._onAfterRenderObserver=this.onAfterRenderObservable.add(e)}set onClear(e){this._onClearObserver&&this.onClearObservable.remove(this._onClearObserver),this._onClearObserver=this.onClearObservable.add(e)}get renderPassIds(){return this._renderPassIds}get currentRefreshId(){return this._currentRefreshId}setMaterialForRendering(e,t){let i;i=Array.isArray(e)?e:[e];for(let e=0;e<i.length;++e)for(let n=0;n<this._renderPassIds.length;++n)i[e].setMaterialForRenderPass(this._renderPassIds[n],void 0!==t?Array.isArray(t)?t[n]:t:void 0)}get isMulti(){var e,t;return null!==(t=null===(e=this._renderTarget)||void 0===e?void 0:e.isMulti)&&void 0!==t&&t}get renderTargetOptions(){return this._renderTargetOptions}get renderTarget(){return this._renderTarget}_onRatioRescale(){this._sizeRatio&&this.resize(this._initialSizeParameter)}set boundingBoxSize(e){if(this._boundingBoxSize&&this._boundingBoxSize.equals(e))return;this._boundingBoxSize=e;const t=this.getScene();t&&t.markAllMaterialsAsDirty(1)}get boundingBoxSize(){return this._boundingBoxSize}get depthStencilTexture(){var e,t;return null!==(t=null===(e=this._renderTarget)||void 0===e?void 0:e._depthStencilTexture)&&void 0!==t?t:null}constructor(e,t,i,o=!1,l=!0,h=0,c=!1,u=r.x.TRILINEAR_SAMPLINGMODE,d=!0,p=!1,f=!1,_=5,m=!1,g,v,y=!1,x=!1){var b,T,S,E,C,A;let P;if("object"==typeof o){const e=o;o=!!e.generateMipMaps,l=null===(b=e.doNotChangeAspectRatio)||void 0===b||b,h=null!==(T=e.type)&&void 0!==T?T:0,c=!!e.isCube,u=null!==(S=e.samplingMode)&&void 0!==S?S:r.x.TRILINEAR_SAMPLINGMODE,d=null===(E=e.generateDepthBuffer)||void 0===E||E,p=!!e.generateStencilBuffer,f=!!e.isMulti,_=null!==(C=e.format)&&void 0!==C?C:5,m=!!e.delayAllocation,g=e.samples,v=e.creationFlags,y=!!e.noColorAttachment,x=!!e.useSRGBBuffer,P=e.colorAttachment}if(super(null,i,!o,void 0,u,void 0,void 0,void 0,void 0,_),this._unObserveRenderList=null,this._renderListHasChanged=(e,t)=>{var i;const n=this._renderList?this._renderList.length:0;(0===t&&n>0||0===n)&&(null===(i=this.getScene())||void 0===i||i.meshes.forEach((e=>{e._markSubMeshesAsLightDirty()})))},this.renderParticles=!0,this.renderSprites=!1,this.forceLayerMaskCheck=!1,this.ignoreCameraViewport=!1,this.onBeforeBindObservable=new n.y$,this.onAfterUnbindObservable=new n.y$,this.onBeforeRenderObservable=new n.y$,this.onAfterRenderObservable=new n.y$,this.onClearObservable=new n.y$,this.onResizeObservable=new n.y$,this._cleared=!1,this.skipInitialClear=!1,this._currentRefreshId=-1,this._refreshRate=1,this._samples=1,this._canRescale=!0,this._renderTarget=null,this.boundingBoxPosition=s.P.Zero(),!(i=this.getScene()))return;const R=this.getScene().getEngine();this._coordinatesMode=r.x.PROJECTION_MODE,this.renderList=new Array,this.name=e,this.isRenderTarget=!0,this._initialSizeParameter=t,this._renderPassIds=[],this._isCubeData=c,this._processSizeParameter(t),this.renderPassId=this._renderPassIds[0],this._resizeObserver=R.onResizeObservable.add((()=>{})),this._generateMipMaps=!!o,this._doNotChangeAspectRatio=l,this._renderingManager=new a.$(i),this._renderingManager._useSceneAutoClearSetup=!0,f||(this._renderTargetOptions={generateMipMaps:o,type:h,format:null!==(A=this._format)&&void 0!==A?A:void 0,samplingMode:this.samplingMode,generateDepthBuffer:d,generateStencilBuffer:p,samples:g,creationFlags:v,noColorAttachment:y,useSRGBBuffer:x,colorAttachment:P,label:this.name},this.samplingMode===r.x.NEAREST_SAMPLINGMODE&&(this.wrapU=r.x.CLAMP_ADDRESSMODE,this.wrapV=r.x.CLAMP_ADDRESSMODE),m||(c?(this._renderTarget=i.getEngine().createRenderTargetCubeTexture(this.getRenderSize(),this._renderTargetOptions),this.coordinatesMode=r.x.INVCUBIC_MODE,this._textureMatrix=s.y3.Identity()):this._renderTarget=i.getEngine().createRenderTargetTexture(this._size,this._renderTargetOptions),this._texture=this._renderTarget.texture,void 0!==g&&(this.samples=g)))}createDepthStencilTexture(e=0,t=!0,i=!1,n=1,s=14){var r;null===(r=this._renderTarget)||void 0===r||r.createDepthStencilTexture(e,t,i,n,s)}_releaseRenderPassId(){if(this._scene){const e=this._scene.getEngine();for(let t=0;t<this._renderPassIds.length;++t)e.releaseRenderPassId(this._renderPassIds[t])}this._renderPassIds=[]}_createRenderPassId(){this._releaseRenderPassId();const e=this._scene.getEngine(),t=this._isCubeData?6:this.getRenderLayers()||1;for(let i=0;i<t;++i)this._renderPassIds[i]=e.createRenderPassId(`RenderTargetTexture - ${this.name}#${i}`)}_processSizeParameter(e){if(e.ratio){this._sizeRatio=e.ratio;const t=this._getEngine();this._size={width:this._bestReflectionRenderTargetDimension(t.getRenderWidth(),this._sizeRatio),height:this._bestReflectionRenderTargetDimension(t.getRenderHeight(),this._sizeRatio)}}else this._size=e;this._createRenderPassId()}get samples(){var e,t;return null!==(t=null===(e=this._renderTarget)||void 0===e?void 0:e.samples)&&void 0!==t?t:this._samples}set samples(e){this._renderTarget&&(this._samples=this._renderTarget.setSamples(e))}resetRefreshCounter(){this._currentRefreshId=-1}get refreshRate(){return this._refreshRate}set refreshRate(e){this._refreshRate=e,this.resetRefreshCounter()}addPostProcess(e){if(!this._postProcessManager){const e=this.getScene();if(!e)return;this._postProcessManager=new o.O(e),this._postProcesses=new Array}this._postProcesses.push(e),this._postProcesses[0].autoClear=!1}clearPostProcesses(e=!1){if(this._postProcesses){if(e)for(const e of this._postProcesses)e.dispose();this._postProcesses=[]}}removePostProcess(e){if(!this._postProcesses)return;const t=this._postProcesses.indexOf(e);-1!==t&&(this._postProcesses.splice(t,1),this._postProcesses.length>0&&(this._postProcesses[0].autoClear=!1))}_shouldRender(){return-1===this._currentRefreshId||this.refreshRate===this._currentRefreshId?(this._currentRefreshId=1,!0):(this._currentRefreshId++,!1)}getRenderSize(){return this.getRenderWidth()}getRenderWidth(){return this._size.width?this._size.width:this._size}getRenderHeight(){return this._size.width?this._size.height:this._size}getRenderLayers(){return this._size.layers||0}disableRescaling(){this._canRescale=!1}get canRescale(){return this._canRescale}scale(e){const t=Math.max(1,this.getRenderSize()*e);this.resize(t)}getReflectionTextureMatrix(){return this.isCube?this._textureMatrix:super.getReflectionTextureMatrix()}resize(e){var t;const i=this.isCube;null===(t=this._renderTarget)||void 0===t||t.dispose(),this._renderTarget=null;const n=this.getScene();n&&(this._processSizeParameter(e),this._renderTarget=i?n.getEngine().createRenderTargetCubeTexture(this.getRenderSize(),this._renderTargetOptions):n.getEngine().createRenderTargetTexture(this._size,this._renderTargetOptions),this._texture=this._renderTarget.texture,void 0!==this._renderTargetOptions.samples&&(this.samples=this._renderTargetOptions.samples),this.onResizeObservable.hasObservers()&&this.onResizeObservable.notifyObservers(this))}render(e=!1,t=!1){this._render(e,t)}isReadyForRendering(){return this._render(!1,!1,!0)}_render(e=!1,t=!1,i=!1){var n;const s=this.getScene();if(!s)return i;const r=s.getEngine();if(void 0!==this.useCameraPostProcesses&&(e=this.useCameraPostProcesses),this._waitingRenderList){this.renderList=[];for(let e=0;e<this._waitingRenderList.length;e++){const t=this._waitingRenderList[e],i=s.getMeshById(t);i&&this.renderList.push(i)}this._waitingRenderList=void 0}if(this.renderListPredicate){this.renderList?this.renderList.length=0:this.renderList=[];const e=this.getScene();if(!e)return i;const t=e.meshes;for(let e=0;e<t.length;e++){const i=t[e];this.renderListPredicate(i)&&this.renderList.push(i)}}const o=r.currentRenderPassId;this.onBeforeBindObservable.notifyObservers(this);const a=null!==(n=this.activeCamera)&&void 0!==n?n:s.activeCamera,l=s.activeCamera;a&&(a!==s.activeCamera&&(s.setTransformMatrix(a.getViewMatrix(),a.getProjectionMatrix(!0)),s.activeCamera=a),r.setViewport(a.rigParent?a.rigParent.viewport:a.viewport,this.getRenderWidth(),this.getRenderHeight())),this._defaultRenderListPrepared=!1;let h=i;if(i){s.getViewMatrix()||s.updateTransformMatrix();const e=this.is2DArray?this.getRenderLayers():this.isCube?6:1;for(let t=0;t<e&&h;t++){let e=null;const n=this.renderList?this.renderList:s.getActiveMeshes().data,o=this.renderList?this.renderList.length:s.getActiveMeshes().length;r.currentRenderPassId=this._renderPassIds[t],this.onBeforeRenderObservable.notifyObservers(t),this.getCustomRenderList&&(e=this.getCustomRenderList(t,n,o)),e||(e=n),this._doNotChangeAspectRatio||s.updateTransformMatrix(!0);for(let t=0;t<e.length&&h;++t){const n=e[t];if(n.isEnabled()&&!n.isBlocked&&n.isVisible&&n.subMeshes)if(this.customIsReadyFunction){if(!this.customIsReadyFunction(n,this.refreshRate,i)){h=!1;continue}}else if(!n.isReady(!0)){h=!1;continue}}this.onAfterRenderObservable.notifyObservers(t),(this.is2DArray||this.isCube)&&(s.incrementRenderId(),s.resetCachedMaterial())}}else if(this.is2DArray&&!this.isMulti)for(let i=0;i<this.getRenderLayers();i++)this._renderToTarget(0,e,t,i,a),s.incrementRenderId(),s.resetCachedMaterial();else if(this.isCube&&!this.isMulti)for(let i=0;i<6;i++)this._renderToTarget(i,e,t,void 0,a),s.incrementRenderId(),s.resetCachedMaterial();else this._renderToTarget(0,e,t,void 0,a);return this.onAfterUnbindObservable.notifyObservers(this),r.currentRenderPassId=o,l&&(s.activeCamera=l,(s.getEngine().scenes.length>1||this.activeCamera&&this.activeCamera!==s.activeCamera)&&s.setTransformMatrix(s.activeCamera.getViewMatrix(),s.activeCamera.getProjectionMatrix(!0)),r.setViewport(s.activeCamera.viewport)),s.resetCachedMaterial(),h}_bestReflectionRenderTargetDimension(e,t){const i=e*t,n=l.D.NearestPOT(i+16384/(128+i));return Math.min(l.D.FloorPOT(e),n)}_prepareRenderingManager(e,t,i,n){const s=this.getScene();if(!s)return;this._renderingManager.reset();const r=s.getRenderId();for(let o=0;o<t;o++){const t=e[o];if(t&&!t.isBlocked){if(this.customIsReadyFunction){if(!this.customIsReadyFunction(t,this.refreshRate,!1)){this.resetRefreshCounter();continue}}else if(!t.isReady(0===this.refreshRate)){this.resetRefreshCounter();continue}if(!t._internalAbstractMeshDataInfo._currentLODIsUpToDate&&s.activeCamera&&(t._internalAbstractMeshDataInfo._currentLOD=s.customLODSelector?s.customLODSelector(t,this.activeCamera||s.activeCamera):t.getLOD(this.activeCamera||s.activeCamera),t._internalAbstractMeshDataInfo._currentLODIsUpToDate=!0),!t._internalAbstractMeshDataInfo._currentLOD)continue;let e,o=t._internalAbstractMeshDataInfo._currentLOD;if(o._preActivateForIntermediateRendering(r),e=!(!n||!i)&&0==(t.layerMask&i.layerMask),t.isEnabled()&&t.isVisible&&t.subMeshes&&!e&&(o!==t&&o._activate(r,!0),t._activate(r,!0)&&t.subMeshes.length)){t.isAnInstance?t._internalAbstractMeshDataInfo._actAsRegularMesh&&(o=t):o._internalAbstractMeshDataInfo._onlyForInstancesIntermediate=!1,o._internalAbstractMeshDataInfo._isActiveIntermediate=!0;for(let e=0;e<o.subMeshes.length;e++){const t=o.subMeshes[e];this._renderingManager.dispatch(t,o)}}}}for(let e=0;e<s.particleSystems.length;e++){const t=s.particleSystems[e],i=t.emitter;t.isStarted()&&i&&(!i.position||i.isEnabled())&&this._renderingManager.dispatchParticles(t)}}_bindFrameBuffer(e=0,t=0){const i=this.getScene();if(!i)return;const n=i.getEngine();this._renderTarget&&n.bindFramebuffer(this._renderTarget,this.isCube?e:void 0,void 0,void 0,this.ignoreCameraViewport,0,t)}_unbindFrameBuffer(e,t){this._renderTarget&&e.unBindFramebuffer(this._renderTarget,this.isCube,(()=>{this.onAfterRenderObservable.notifyObservers(t)}))}_prepareFrame(e,t,i,n){this._postProcessManager?this._prePassEnabled||this._postProcessManager._prepareFrame(this._texture,this._postProcesses):n&&e.postProcessManager._prepareFrame(this._texture)||this._bindFrameBuffer(t,i)}_renderToTarget(e,t,i,n=0,s=null){var r,o,a,l,h,u;const d=this.getScene();if(!d)return;const p=d.getEngine();if(null===(r=p._debugPushGroup)||void 0===r||r.call(p,`render to face #${e} layer #${n}`,1),this._prepareFrame(d,e,n,t),this.is2DArray?(p.currentRenderPassId=this._renderPassIds[n],this.onBeforeRenderObservable.notifyObservers(n)):(p.currentRenderPassId=this._renderPassIds[e],this.onBeforeRenderObservable.notifyObservers(e)),p.snapshotRendering&&1===p.snapshotRenderingMode)this.onClearObservable.hasObservers()?this.onClearObservable.notifyObservers(p):this.skipInitialClear||p.clear(this.clearColor||d.clearColor,!0,!0,!0);else{let r=null;const u=this.renderList?this.renderList:d.getActiveMeshes().data,f=this.renderList?this.renderList.length:d.getActiveMeshes().length;this.getCustomRenderList&&(r=this.getCustomRenderList(this.is2DArray?n:e,u,f)),r?this._prepareRenderingManager(r,r.length,s,this.forceLayerMaskCheck):(this._defaultRenderListPrepared||(this._prepareRenderingManager(u,f,s,!this.renderList||this.forceLayerMaskCheck),this._defaultRenderListPrepared=!0),r=u);for(const t of d._beforeRenderTargetClearStage)t.action(this,e,n);this.onClearObservable.hasObservers()?this.onClearObservable.notifyObservers(p):this.skipInitialClear||p.clear(this.clearColor||d.clearColor,!0,!0,!0),this._doNotChangeAspectRatio||d.updateTransformMatrix(!0);for(const t of d._beforeRenderTargetDrawStage)t.action(this,e,n);this._renderingManager.render(this.customRenderFunction,r,this.renderParticles,this.renderSprites);for(const t of d._afterRenderTargetDrawStage)t.action(this,e,n);const _=null!==(a=null===(o=this._texture)||void 0===o?void 0:o.generateMipMaps)&&void 0!==a&&a;this._texture&&(this._texture.generateMipMaps=!1),this._postProcessManager?this._postProcessManager._finalizeFrame(!1,null!==(l=this._renderTarget)&&void 0!==l?l:void 0,e,this._postProcesses,this.ignoreCameraViewport):t&&d.postProcessManager._finalizeFrame(!1,null!==(h=this._renderTarget)&&void 0!==h?h:void 0,e);for(const t of d._afterRenderTargetPostProcessStage)t.action(this,e,n);this._texture&&(this._texture.generateMipMaps=_),this._doNotChangeAspectRatio||d.updateTransformMatrix(!0),i&&c.B.DumpFramebuffer(this.getRenderWidth(),this.getRenderHeight(),p)}this._unbindFrameBuffer(p,e),this._texture&&this.isCube&&5===e&&p.generateMipMapsForCubemap(this._texture),null===(u=p._debugPopGroup)||void 0===u||u.call(p,1)}setRenderingOrder(e,t=null,i=null,n=null){this._renderingManager.setRenderingOrder(e,t,i,n)}setRenderingAutoClearDepthStencil(e,t){this._renderingManager.setRenderingAutoClearDepthStencil(e,t),this._renderingManager._useSceneAutoClearSetup=!1}clone(){const e=this.getSize(),t=new u(this.name,e,this.getScene(),this._renderTargetOptions.generateMipMaps,this._doNotChangeAspectRatio,this._renderTargetOptions.type,this.isCube,this._renderTargetOptions.samplingMode,this._renderTargetOptions.generateDepthBuffer,this._renderTargetOptions.generateStencilBuffer,void 0,this._renderTargetOptions.format,void 0,this._renderTargetOptions.samples);return t.hasAlpha=this.hasAlpha,t.level=this.level,t.coordinatesMode=this.coordinatesMode,this.renderList&&(t.renderList=this.renderList.slice(0)),t}serialize(){if(!this.name)return null;const e=super.serialize();if(e.renderTargetSize=this.getRenderSize(),e.renderList=[],this.renderList)for(let t=0;t<this.renderList.length;t++)e.renderList.push(this.renderList[t].id);return e}disposeFramebufferObjects(){var e;null===(e=this._renderTarget)||void 0===e||e.dispose(!0)}releaseInternalTexture(){var e;null===(e=this._renderTarget)||void 0===e||e.releaseTextures(),this._texture=null}dispose(){var e;this.onResizeObservable.clear(),this.onClearObservable.clear(),this.onAfterRenderObservable.clear(),this.onAfterUnbindObservable.clear(),this.onBeforeBindObservable.clear(),this.onBeforeRenderObservable.clear(),this._postProcessManager&&(this._postProcessManager.dispose(),this._postProcessManager=null),this._prePassRenderTarget&&this._prePassRenderTarget.dispose(),this._releaseRenderPassId(),this.clearPostProcesses(!0),this._resizeObserver&&(this.getScene().getEngine().onResizeObservable.remove(this._resizeObserver),this._resizeObserver=null),this.renderList=null;const t=this.getScene();if(!t)return;let i=t.customRenderTargets.indexOf(this);i>=0&&t.customRenderTargets.splice(i,1);for(const e of t.cameras)i=e.customRenderTargets.indexOf(this),i>=0&&e.customRenderTargets.splice(i,1);null===(e=this._renderTarget)||void 0===e||e.dispose(),this._renderTarget=null,this._texture=null,super.dispose()}_rebuild(){this.refreshRate===u.REFRESHRATE_RENDER_ONCE&&(this.refreshRate=u.REFRESHRATE_RENDER_ONCE),this._postProcessManager&&this._postProcessManager._rebuild()}freeRenderingGroups(){this._renderingManager&&this._renderingManager.freeRenderingGroups()}getViewCount(){return 1}}u.REFRESHRATE_RENDER_ONCE=0,u.REFRESHRATE_RENDER_ONEVERYFRAME=1,u.REFRESHRATE_RENDER_ONEVERYTWOFRAMES=2,r.x._CreateRenderTargetTexture=(e,t,i,n,s)=>new u(e,t,i,n)},2262:(e,t,i)=>{i.d(t,{x:()=>m});var n=i(9472),s=i(3956),r=i(5757),o=i(4141),a=i(6702),l=i(2208),h=i(4934),c=i(6290),u=i(8126),d=i(142),p=i(2655),f=i(9703),_=i(4892);class m extends a.V{get noMipmap(){return this._noMipmap}get mimeType(){return this._mimeType}set isBlocking(e){this._isBlocking=e}get isBlocking(){return this._isBlocking}get invertY(){return this._invertY}constructor(e,t,i,n,s=m.TRILINEAR_SAMPLINGMODE,o=null,a=null,l=null,h=!1,u,d,p,f,g){var v,y,x,b,T,S,E,C,A;let P;super(t),this.url=null,this.uOffset=0,this.vOffset=0,this.uScale=1,this.vScale=1,this.uAng=0,this.vAng=0,this.wAng=0,this.uRotationCenter=.5,this.vRotationCenter=.5,this.wRotationCenter=.5,this.homogeneousRotationInUVTransform=!1,this.inspectableCustomProperties=null,this._noMipmap=!1,this._invertY=!1,this._rowGenerationMatrix=null,this._cachedTextureMatrix=null,this._projectionModeMatrix=null,this._t0=null,this._t1=null,this._t2=null,this._cachedUOffset=-1,this._cachedVOffset=-1,this._cachedUScale=0,this._cachedVScale=0,this._cachedUAng=-1,this._cachedVAng=-1,this._cachedWAng=-1,this._cachedReflectionProjectionMatrixId=-1,this._cachedURotationCenter=-1,this._cachedVRotationCenter=-1,this._cachedWRotationCenter=-1,this._cachedHomogeneousRotationInUVTransform=!1,this._cachedReflectionTextureMatrix=null,this._cachedReflectionUOffset=-1,this._cachedReflectionVOffset=-1,this._cachedReflectionUScale=0,this._cachedReflectionVScale=0,this._cachedReflectionCoordinatesMode=-1,this._buffer=null,this._deleteBuffer=!1,this._format=null,this._delayedOnLoad=null,this._delayedOnError=null,this.onLoadObservable=new r.y$,this._isBlocking=!0,this.name=e||"",this.url=e;let R=!1,M=null;"object"==typeof i&&null!==i?(P=null!==(v=i.noMipmap)&&void 0!==v&&v,n=null!==(y=i.invertY)&&void 0!==y?y:!_.e.UseOpenGLOrientationForUV,s=null!==(x=i.samplingMode)&&void 0!==x?x:m.TRILINEAR_SAMPLINGMODE,o=null!==(b=i.onLoad)&&void 0!==b?b:null,a=null!==(T=i.onError)&&void 0!==T?T:null,l=null!==(S=i.buffer)&&void 0!==S?S:null,h=null!==(E=i.deleteBuffer)&&void 0!==E&&E,u=i.format,d=i.mimeType,p=i.loaderOptions,f=i.creationFlags,R=null!==(C=i.useSRGBBuffer)&&void 0!==C&&C,M=null!==(A=i.internalTexture)&&void 0!==A?A:null):P=!!i,this._noMipmap=P,this._invertY=void 0===n?!_.e.UseOpenGLOrientationForUV:n,this._initialSamplingMode=s,this._buffer=l,this._deleteBuffer=h,this._mimeType=d,this._loaderOptions=p,this._creationFlags=f,this._useSRGBBuffer=R,this._forcedExtension=g,u&&(this._format=u);const I=this.getScene(),D=this._getEngine();if(!D)return;D.onBeforeTextureInitObservable.notifyObservers(this);const O=()=>{this._texture&&(this._texture._invertVScale&&(this.vScale*=-1,this.vOffset+=1),null!==this._texture._cachedWrapU&&(this.wrapU=this._texture._cachedWrapU,this._texture._cachedWrapU=null),null!==this._texture._cachedWrapV&&(this.wrapV=this._texture._cachedWrapV,this._texture._cachedWrapV=null),null!==this._texture._cachedWrapR&&(this.wrapR=this._texture._cachedWrapR,this._texture._cachedWrapR=null)),this.onLoadObservable.hasObservers()&&this.onLoadObservable.notifyObservers(this),o&&o(),!this.isBlocking&&I&&I.resetCachedMaterial()},w=(e,t)=>{this._loadingError=!0,this._errorObject={message:e,exception:t},a&&a(e,t),m.OnTextureLoadErrorObservable.notifyObservers(this)};if(!this.url&&!M)return this._delayedOnLoad=O,void(this._delayedOnError=w);if(this._texture=null!=M?M:this._getFromCache(this.url,P,s,this._invertY,R),this._texture)if(this._texture.isReady)c.Q.SetImmediate((()=>O()));else{const e=this._texture.onLoadedObservable.add(O);this._texture.onErrorObservable.add((t=>{var i;w(t.message,t.exception),null===(i=this._texture)||void 0===i||i.onLoadedObservable.remove(e)}))}else if(I&&I.useDelayedTextureLoading)this.delayLoadState=4,this._delayedOnLoad=O,this._delayedOnError=w;else{try{this._texture=D.createTexture(this.url,P,this._invertY,I,s,O,w,this._buffer,void 0,this._format,this._forcedExtension,d,p,f,R)}catch(e){throw w("error loading",e),e}h&&(this._buffer=null)}}updateURL(e,t=null,i,n){this.url&&(this.releaseInternalTexture(),this.getScene().markAllMaterialsAsDirty(1)),this.name&&!this.name.startsWith("data:")||(this.name=e),this.url=e,this._buffer=t,this._forcedExtension=n,this.delayLoadState=4,i&&(this._delayedOnLoad=i),this.delayLoad()}delayLoad(){if(4!==this.delayLoadState)return;const e=this.getScene();e&&(this.delayLoadState=1,this._texture=this._getFromCache(this.url,this._noMipmap,this.samplingMode,this._invertY,this._useSRGBBuffer),this._texture?this._delayedOnLoad&&(this._texture.isReady?c.Q.SetImmediate(this._delayedOnLoad):this._texture.onLoadedObservable.add(this._delayedOnLoad)):(this._texture=e.getEngine().createTexture(this.url,this._noMipmap,this._invertY,e,this.samplingMode,this._delayedOnLoad,this._delayedOnError,this._buffer,null,this._format,this._forcedExtension,this._mimeType,this._loaderOptions,this._creationFlags,this._useSRGBBuffer),this._deleteBuffer&&(this._buffer=null)),this._delayedOnLoad=null,this._delayedOnError=null)}_prepareRowForTextureGeneration(e,t,i,n){e*=this._cachedUScale,t*=this._cachedVScale,e-=this.uRotationCenter*this._cachedUScale,t-=this.vRotationCenter*this._cachedVScale,i-=this.wRotationCenter,o.P.TransformCoordinatesFromFloatsToRef(e,t,i,this._rowGenerationMatrix,n),n.x+=this.uRotationCenter*this._cachedUScale+this._cachedUOffset,n.y+=this.vRotationCenter*this._cachedVScale+this._cachedVOffset,n.z+=this.wRotationCenter}checkTransformsAreIdentical(e){return null!==e&&this.uOffset===e.uOffset&&this.vOffset===e.vOffset&&this.uScale===e.uScale&&this.vScale===e.vScale&&this.uAng===e.uAng&&this.vAng===e.vAng&&this.wAng===e.wAng}getTextureMatrix(e=1){if(this.uOffset===this._cachedUOffset&&this.vOffset===this._cachedVOffset&&this.uScale*e===this._cachedUScale&&this.vScale===this._cachedVScale&&this.uAng===this._cachedUAng&&this.vAng===this._cachedVAng&&this.wAng===this._cachedWAng&&this.uRotationCenter===this._cachedURotationCenter&&this.vRotationCenter===this._cachedVRotationCenter&&this.wRotationCenter===this._cachedWRotationCenter&&this.homogeneousRotationInUVTransform===this._cachedHomogeneousRotationInUVTransform)return this._cachedTextureMatrix;this._cachedUOffset=this.uOffset,this._cachedVOffset=this.vOffset,this._cachedUScale=this.uScale*e,this._cachedVScale=this.vScale,this._cachedUAng=this.uAng,this._cachedVAng=this.vAng,this._cachedWAng=this.wAng,this._cachedURotationCenter=this.uRotationCenter,this._cachedVRotationCenter=this.vRotationCenter,this._cachedWRotationCenter=this.wRotationCenter,this._cachedHomogeneousRotationInUVTransform=this.homogeneousRotationInUVTransform,this._cachedTextureMatrix&&this._rowGenerationMatrix||(this._cachedTextureMatrix=o.y3.Zero(),this._rowGenerationMatrix=new o.y3,this._t0=o.P.Zero(),this._t1=o.P.Zero(),this._t2=o.P.Zero()),o.y3.RotationYawPitchRollToRef(this.vAng,this.uAng,this.wAng,this._rowGenerationMatrix),this.homogeneousRotationInUVTransform?(o.y3.TranslationToRef(-this._cachedURotationCenter,-this._cachedVRotationCenter,-this._cachedWRotationCenter,o.jp.Matrix[0]),o.y3.TranslationToRef(this._cachedURotationCenter,this._cachedVRotationCenter,this._cachedWRotationCenter,o.jp.Matrix[1]),o.y3.ScalingToRef(this._cachedUScale,this._cachedVScale,0,o.jp.Matrix[2]),o.y3.TranslationToRef(this._cachedUOffset,this._cachedVOffset,0,o.jp.Matrix[3]),o.jp.Matrix[0].multiplyToRef(this._rowGenerationMatrix,this._cachedTextureMatrix),this._cachedTextureMatrix.multiplyToRef(o.jp.Matrix[1],this._cachedTextureMatrix),this._cachedTextureMatrix.multiplyToRef(o.jp.Matrix[2],this._cachedTextureMatrix),this._cachedTextureMatrix.multiplyToRef(o.jp.Matrix[3],this._cachedTextureMatrix),this._cachedTextureMatrix.setRowFromFloats(2,this._cachedTextureMatrix.m[12],this._cachedTextureMatrix.m[13],this._cachedTextureMatrix.m[14],1)):(this._prepareRowForTextureGeneration(0,0,0,this._t0),this._prepareRowForTextureGeneration(1,0,0,this._t1),this._prepareRowForTextureGeneration(0,1,0,this._t2),this._t1.subtractInPlace(this._t0),this._t2.subtractInPlace(this._t0),o.y3.FromValuesToRef(this._t1.x,this._t1.y,this._t1.z,0,this._t2.x,this._t2.y,this._t2.z,0,this._t0.x,this._t0.y,this._t0.z,0,0,0,0,1,this._cachedTextureMatrix));const t=this.getScene();return t?(this.optimizeUVAllocation&&t.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this))),this._cachedTextureMatrix):this._cachedTextureMatrix}getReflectionTextureMatrix(){const e=this.getScene();if(!e)return this._cachedReflectionTextureMatrix;if(this.uOffset===this._cachedReflectionUOffset&&this.vOffset===this._cachedReflectionVOffset&&this.uScale===this._cachedReflectionUScale&&this.vScale===this._cachedReflectionVScale&&this.coordinatesMode===this._cachedReflectionCoordinatesMode){if(this.coordinatesMode!==m.PROJECTION_MODE)return this._cachedReflectionTextureMatrix;if(this._cachedReflectionProjectionMatrixId===e.getProjectionMatrix().updateFlag)return this._cachedReflectionTextureMatrix}this._cachedReflectionTextureMatrix||(this._cachedReflectionTextureMatrix=o.y3.Zero()),this._projectionModeMatrix||(this._projectionModeMatrix=o.y3.Zero());const t=this._cachedReflectionCoordinatesMode!==this.coordinatesMode;switch(this._cachedReflectionUOffset=this.uOffset,this._cachedReflectionVOffset=this.vOffset,this._cachedReflectionUScale=this.uScale,this._cachedReflectionVScale=this.vScale,this._cachedReflectionCoordinatesMode=this.coordinatesMode,this.coordinatesMode){case m.PLANAR_MODE:o.y3.IdentityToRef(this._cachedReflectionTextureMatrix),this._cachedReflectionTextureMatrix[0]=this.uScale,this._cachedReflectionTextureMatrix[5]=this.vScale,this._cachedReflectionTextureMatrix[12]=this.uOffset,this._cachedReflectionTextureMatrix[13]=this.vOffset;break;case m.PROJECTION_MODE:{o.y3.FromValuesToRef(.5,0,0,0,0,-.5,0,0,0,0,0,0,.5,.5,1,1,this._projectionModeMatrix);const t=e.getProjectionMatrix();this._cachedReflectionProjectionMatrixId=t.updateFlag,t.multiplyToRef(this._projectionModeMatrix,this._cachedReflectionTextureMatrix);break}default:o.y3.IdentityToRef(this._cachedReflectionTextureMatrix)}return t&&e.markAllMaterialsAsDirty(1,(e=>-1!==e.getActiveTextures().indexOf(this))),this._cachedReflectionTextureMatrix}clone(){const e={noMipmap:this._noMipmap,invertY:this._invertY,samplingMode:this.samplingMode,onLoad:void 0,onError:void 0,buffer:this._texture?this._texture._buffer:void 0,deleteBuffer:this._deleteBuffer,format:this.textureFormat,mimeType:this.mimeType,loaderOptions:this._loaderOptions,creationFlags:this._creationFlags,useSRGBBuffer:this._useSRGBBuffer};return s.p4.Clone((()=>new m(this._texture?this._texture.url:null,this.getScene(),e)),this)}serialize(){var e,t;const i=this.name;m.SerializeBuffers||this.name.startsWith("data:")&&(this.name=""),this.name.startsWith("data:")&&this.url===this.name&&(this.url="");const n=super.serialize(m._SerializeInternalTextureUniqueId);return n?((m.SerializeBuffers||m.ForceSerializeBuffers)&&("string"==typeof this._buffer&&"data:"===this._buffer.substr(0,5)?(n.base64String=this._buffer,n.name=n.name.replace("data:","")):this.url&&this.url.startsWith("data:")&&this._buffer instanceof Uint8Array?n.base64String="data:image/png;base64,"+(0,p.Gh)(this._buffer):(m.ForceSerializeBuffers||this.url&&this.url.startsWith("blob:")||this._forceSerialize)&&(n.base64String=!this._engine||this._engine._features.supportSyncTextureRead?(0,f._u)(this):(0,f.Jj)(this))),n.invertY=this._invertY,n.samplingMode=this.samplingMode,n._creationFlags=this._creationFlags,n._useSRGBBuffer=this._useSRGBBuffer,m._SerializeInternalTextureUniqueId&&(n.internalTextureUniqueId=null!==(t=null===(e=this._texture)||void 0===e?void 0:e.uniqueId)&&void 0!==t?t:void 0),this.name=i,n):null}getClassName(){return"Texture"}dispose(){super.dispose(),this.onLoadObservable.clear(),this._delayedOnLoad=null,this._delayedOnError=null,this._buffer=null}static Parse(e,t,i){if(e.customType){const n=u.K.Instantiate(e.customType).Parse(e,t,i);return e.samplingMode&&n.updateSamplingMode&&n._samplingMode&&n._samplingMode!==e.samplingMode&&n.updateSamplingMode(e.samplingMode),n}if(e.isCube&&!e.isRenderTarget)return m._CubeTextureParser(e,t,i);const n=void 0!==e.internalTextureUniqueId;if(!e.name&&!e.isRenderTarget&&!n)return null;let r;if(n){const i=t.getEngine().getLoadedTexturesCache();for(const t of i)if(t.uniqueId===e.internalTextureUniqueId){r=t;break}}const o=t=>{var i;if(t&&t._texture&&(t._texture._cachedWrapU=null,t._texture._cachedWrapV=null,t._texture._cachedWrapR=null),e.samplingMode){const i=e.samplingMode;t&&t.samplingMode!==i&&t.updateSamplingMode(i)}if(t&&e.animations)for(let i=0;i<e.animations.length;i++){const n=e.animations[i],s=(0,l.q)("BABYLON.Animation");s&&t.animations.push(s.Parse(n))}n&&!r&&(null===(i=null==t?void 0:t._texture)||void 0===i||i._setUniqueId(e.internalTextureUniqueId))};return s.p4.Parse((()=>{var n,s,a;let l=!0;if(e.noMipmap&&(l=!1),e.mirrorPlane){const i=m._CreateMirror(e.name,e.renderTargetSize,t,l);return i._waitingRenderList=e.renderList,i.mirrorPlane=d.J.FromArray(e.mirrorPlane),o(i),i}if(e.isRenderTarget){let i=null;if(e.isCube){if(t.reflectionProbes)for(let i=0;i<t.reflectionProbes.length;i++){const n=t.reflectionProbes[i];if(n.name===e.name)return n.cubeTexture}}else i=m._CreateRenderTargetTexture(e.name,e.renderTargetSize,t,l,null!==(n=e._creationFlags)&&void 0!==n?n:0),i._waitingRenderList=e.renderList;return o(i),i}{let n;if(e.base64String&&!r)n=m.CreateFromBase64String(e.base64String,e.base64String,t,!l,e.invertY,e.samplingMode,(()=>{o(n)}),null!==(s=e._creationFlags)&&void 0!==s?s:0,null!==(a=e._useSRGBBuffer)&&void 0!==a&&a),n.name=e.name;else{let s;s=e.name&&e.name.indexOf("://")>0?e.name:i+e.name,e.url&&(e.url.startsWith("data:")||m.UseSerializedUrlIfAny)&&(s=e.url);const a={noMipmap:!l,invertY:e.invertY,samplingMode:e.samplingMode,onLoad:()=>{o(n)},internalTexture:r};n=new m(s,t,a)}return n}}),e,t)}static CreateFromBase64String(e,t,i,n,s,r=m.TRILINEAR_SAMPLINGMODE,o=null,a=null,l=5,h){return new m("data:"+t,i,n,s,r,o,a,e,!1,l,void 0,void 0,h)}static LoadFromDataString(e,t,i,n=!1,s,r=!0,o=m.TRILINEAR_SAMPLINGMODE,a=null,l=null,h=5,c){return"data:"!==e.substr(0,5)&&(e="data:"+e),new m(e,i,s,r,o,a,l,t,n,h,void 0,void 0,c)}}m.SerializeBuffers=!0,m.ForceSerializeBuffers=!1,m.OnTextureLoadErrorObservable=new r.y$,m._SerializeInternalTextureUniqueId=!1,m._CubeTextureParser=(e,t,i)=>{throw(0,h.S)("CubeTexture")},m._CreateMirror=(e,t,i,n)=>{throw(0,h.S)("MirrorTexture")},m._CreateRenderTargetTexture=(e,t,i,n,s)=>{throw(0,h.S)("RenderTargetTexture")},m.NEAREST_SAMPLINGMODE=1,m.NEAREST_NEAREST_MIPLINEAR=8,m.BILINEAR_SAMPLINGMODE=2,m.LINEAR_LINEAR_MIPNEAREST=11,m.TRILINEAR_SAMPLINGMODE=3,m.LINEAR_LINEAR_MIPLINEAR=3,m.NEAREST_NEAREST_MIPNEAREST=4,m.NEAREST_LINEAR_MIPNEAREST=5,m.NEAREST_LINEAR_MIPLINEAR=6,m.NEAREST_LINEAR=7,m.NEAREST_NEAREST=1,m.LINEAR_NEAREST_MIPNEAREST=9,m.LINEAR_NEAREST_MIPLINEAR=10,m.LINEAR_LINEAR=2,m.LINEAR_NEAREST=12,m.EXPLICIT_MODE=0,m.SPHERICAL_MODE=1,m.PLANAR_MODE=2,m.CUBIC_MODE=3,m.PROJECTION_MODE=4,m.SKYBOX_MODE=5,m.INVCUBIC_MODE=6,m.EQUIRECTANGULAR_MODE=7,m.FIXED_EQUIRECTANGULAR_MODE=8,m.FIXED_EQUIRECTANGULAR_MIRRORED_MODE=9,m.CLAMP_ADDRESSMODE=0,m.WRAP_ADDRESSMODE=1,m.MIRROR_ADDRESSMODE=2,m.UseSerializedUrlIfAny=!1,(0,n.gn)([(0,s.qC)()],m.prototype,"url",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"uOffset",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"vOffset",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"uScale",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"vScale",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"uAng",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"vAng",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"wAng",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"uRotationCenter",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"vRotationCenter",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"wRotationCenter",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"homogeneousRotationInUVTransform",void 0),(0,n.gn)([(0,s.qC)()],m.prototype,"isBlocking",null),(0,l.H)("BABYLON.Texture",m),s.p4._TextureParser=m.Parse},3297:(e,t,i)=>{i.d(t,{a:()=>n});class n{get wrapU(){return this._cachedWrapU}set wrapU(e){this._cachedWrapU=e}get wrapV(){return this._cachedWrapV}set wrapV(e){this._cachedWrapV=e}get wrapR(){return this._cachedWrapR}set wrapR(e){this._cachedWrapR=e}get anisotropicFilteringLevel(){return this._cachedAnisotropicFilteringLevel}set anisotropicFilteringLevel(e){this._cachedAnisotropicFilteringLevel=e}get comparisonFunction(){return this._comparisonFunction}set comparisonFunction(e){this._comparisonFunction=e}get useMipMaps(){return this._useMipMaps}set useMipMaps(e){this._useMipMaps=e}constructor(){this.samplingMode=-1,this._useMipMaps=!0,this._cachedWrapU=null,this._cachedWrapV=null,this._cachedWrapR=null,this._cachedAnisotropicFilteringLevel=null,this._comparisonFunction=0}setParameters(e=1,t=1,i=1,n=1,s=2,r=0){return this._cachedWrapU=e,this._cachedWrapV=t,this._cachedWrapR=i,this._cachedAnisotropicFilteringLevel=n,this.samplingMode=s,this._comparisonFunction=r,this}compareSampler(e){return this._cachedWrapU===e._cachedWrapU&&this._cachedWrapV===e._cachedWrapV&&this._cachedWrapR===e._cachedWrapR&&this._cachedAnisotropicFilteringLevel===e._cachedAnisotropicFilteringLevel&&this.samplingMode===e.samplingMode&&this._comparisonFunction===e._comparisonFunction&&this._useMipMaps===e._useMipMaps}}},2035:(e,t,i)=>{i.d(t,{g:()=>s});var n=i(9697);class s{get wrapU(){return this._wrapU}set wrapU(e){this._wrapU=e}get wrapV(){return this._wrapV}set wrapV(e){this._wrapV=e}get coordinatesMode(){return 0}get isCube(){return!!this._texture&&this._texture.isCube}set isCube(e){this._texture&&(this._texture.isCube=e)}get is3D(){return!!this._texture&&this._texture.is3D}set is3D(e){this._texture&&(this._texture.is3D=e)}get is2DArray(){return!!this._texture&&this._texture.is2DArray}set is2DArray(e){this._texture&&(this._texture.is2DArray=e)}getClassName(){return"ThinTexture"}static _IsRenderTargetWrapper(e){return void 0!==(null==e?void 0:e._shareDepth)}constructor(e){this._wrapU=1,this._wrapV=1,this.wrapR=1,this.anisotropicFilteringLevel=4,this.delayLoadState=0,this._texture=null,this._engine=null,this._cachedSize=n.$.Zero(),this._cachedBaseSize=n.$.Zero(),this._initialSamplingMode=2,this._texture=s._IsRenderTargetWrapper(e)?e.texture:e,this._texture&&(this._engine=this._texture.getEngine())}isReady(){return 4===this.delayLoadState?(this.delayLoad(),!1):!!this._texture&&this._texture.isReady}delayLoad(){}getInternalTexture(){return this._texture}getSize(){if(this._texture){if(this._texture.width)return this._cachedSize.width=this._texture.width,this._cachedSize.height=this._texture.height,this._cachedSize;if(this._texture._size)return this._cachedSize.width=this._texture._size,this._cachedSize.height=this._texture._size,this._cachedSize}return this._cachedSize}getBaseSize(){return this.isReady()&&this._texture?this._texture._size?(this._cachedBaseSize.width=this._texture._size,this._cachedBaseSize.height=this._texture._size,this._cachedBaseSize):(this._cachedBaseSize.width=this._texture.baseWidth,this._cachedBaseSize.height=this._texture.baseHeight,this._cachedBaseSize):(this._cachedBaseSize.width=0,this._cachedBaseSize.height=0,this._cachedBaseSize)}get samplingMode(){return this._texture?this._texture.samplingMode:this._initialSamplingMode}updateSamplingMode(e){this._texture&&this._engine&&this._engine.updateTextureSamplingMode(e,this._texture)}releaseInternalTexture(){this._texture&&(this._texture.dispose(),this._texture=null)}dispose(){this._texture&&(this.releaseInternalTexture(),this._engine=null)}}},99:(e,t,i)=>{function n(e){-1===e.indexOf("vClipPlane")&&e.push("vClipPlane"),-1===e.indexOf("vClipPlane2")&&e.push("vClipPlane2"),-1===e.indexOf("vClipPlane3")&&e.push("vClipPlane3"),-1===e.indexOf("vClipPlane4")&&e.push("vClipPlane4"),-1===e.indexOf("vClipPlane5")&&e.push("vClipPlane5"),-1===e.indexOf("vClipPlane6")&&e.push("vClipPlane6")}function s(e,t,i){var n,s,r,o,a,l;const h=!!(null!==(n=e.clipPlane)&&void 0!==n?n:t.clipPlane),c=!!(null!==(s=e.clipPlane2)&&void 0!==s?s:t.clipPlane2),u=!!(null!==(r=e.clipPlane3)&&void 0!==r?r:t.clipPlane3),d=!!(null!==(o=e.clipPlane4)&&void 0!==o?o:t.clipPlane4),p=!!(null!==(a=e.clipPlane5)&&void 0!==a?a:t.clipPlane5),f=!!(null!==(l=e.clipPlane6)&&void 0!==l?l:t.clipPlane6);h&&i.push("#define CLIPPLANE"),c&&i.push("#define CLIPPLANE2"),u&&i.push("#define CLIPPLANE3"),d&&i.push("#define CLIPPLANE4"),p&&i.push("#define CLIPPLANE5"),f&&i.push("#define CLIPPLANE6")}function r(e,t,i){var n,s,r,o,a,l;let h=!1;const c=!!(null!==(n=e.clipPlane)&&void 0!==n?n:t.clipPlane),u=!!(null!==(s=e.clipPlane2)&&void 0!==s?s:t.clipPlane2),d=!!(null!==(r=e.clipPlane3)&&void 0!==r?r:t.clipPlane3),p=!!(null!==(o=e.clipPlane4)&&void 0!==o?o:t.clipPlane4),f=!!(null!==(a=e.clipPlane5)&&void 0!==a?a:t.clipPlane5),_=!!(null!==(l=e.clipPlane6)&&void 0!==l?l:t.clipPlane6);return i.CLIPPLANE!==c&&(i.CLIPPLANE=c,h=!0),i.CLIPPLANE2!==u&&(i.CLIPPLANE2=u,h=!0),i.CLIPPLANE3!==d&&(i.CLIPPLANE3=d,h=!0),i.CLIPPLANE4!==p&&(i.CLIPPLANE4=p,h=!0),i.CLIPPLANE5!==f&&(i.CLIPPLANE5=f,h=!0),i.CLIPPLANE6!==_&&(i.CLIPPLANE6=_,h=!0),h}function o(e,t,i){var n,s,r,o,l,h;let c=null!==(n=t.clipPlane)&&void 0!==n?n:i.clipPlane;a(e,"vClipPlane",c),c=null!==(s=t.clipPlane2)&&void 0!==s?s:i.clipPlane2,a(e,"vClipPlane2",c),c=null!==(r=t.clipPlane3)&&void 0!==r?r:i.clipPlane3,a(e,"vClipPlane3",c),c=null!==(o=t.clipPlane4)&&void 0!==o?o:i.clipPlane4,a(e,"vClipPlane4",c),c=null!==(l=t.clipPlane5)&&void 0!==l?l:i.clipPlane5,a(e,"vClipPlane5",c),c=null!==(h=t.clipPlane6)&&void 0!==h?h:i.clipPlane6,a(e,"vClipPlane6",c)}function a(e,t,i){i&&e.setFloat4(t,i.normal.x,i.normal.y,i.normal.z,i.d)}i.d(t,{AN:()=>r,an:()=>o,lK:()=>s,qx:()=>n})},8237:(e,t,i)=>{i.d(t,{U:()=>o});var n=i(9472),s=i(3956),r=i(4649);class o{constructor(){this._dirty=!0,this._tempColor=new r.HE(0,0,0,0),this._globalCurve=new r.HE(0,0,0,0),this._highlightsCurve=new r.HE(0,0,0,0),this._midtonesCurve=new r.HE(0,0,0,0),this._shadowsCurve=new r.HE(0,0,0,0),this._positiveCurve=new r.HE(0,0,0,0),this._negativeCurve=new r.HE(0,0,0,0),this._globalHue=30,this._globalDensity=0,this._globalSaturation=0,this._globalExposure=0,this._highlightsHue=30,this._highlightsDensity=0,this._highlightsSaturation=0,this._highlightsExposure=0,this._midtonesHue=30,this._midtonesDensity=0,this._midtonesSaturation=0,this._midtonesExposure=0,this._shadowsHue=30,this._shadowsDensity=0,this._shadowsSaturation=0,this._shadowsExposure=0}get globalHue(){return this._globalHue}set globalHue(e){this._globalHue=e,this._dirty=!0}get globalDensity(){return this._globalDensity}set globalDensity(e){this._globalDensity=e,this._dirty=!0}get globalSaturation(){return this._globalSaturation}set globalSaturation(e){this._globalSaturation=e,this._dirty=!0}get globalExposure(){return this._globalExposure}set globalExposure(e){this._globalExposure=e,this._dirty=!0}get highlightsHue(){return this._highlightsHue}set highlightsHue(e){this._highlightsHue=e,this._dirty=!0}get highlightsDensity(){return this._highlightsDensity}set highlightsDensity(e){this._highlightsDensity=e,this._dirty=!0}get highlightsSaturation(){return this._highlightsSaturation}set highlightsSaturation(e){this._highlightsSaturation=e,this._dirty=!0}get highlightsExposure(){return this._highlightsExposure}set highlightsExposure(e){this._highlightsExposure=e,this._dirty=!0}get midtonesHue(){return this._midtonesHue}set midtonesHue(e){this._midtonesHue=e,this._dirty=!0}get midtonesDensity(){return this._midtonesDensity}set midtonesDensity(e){this._midtonesDensity=e,this._dirty=!0}get midtonesSaturation(){return this._midtonesSaturation}set midtonesSaturation(e){this._midtonesSaturation=e,this._dirty=!0}get midtonesExposure(){return this._midtonesExposure}set midtonesExposure(e){this._midtonesExposure=e,this._dirty=!0}get shadowsHue(){return this._shadowsHue}set shadowsHue(e){this._shadowsHue=e,this._dirty=!0}get shadowsDensity(){return this._shadowsDensity}set shadowsDensity(e){this._shadowsDensity=e,this._dirty=!0}get shadowsSaturation(){return this._shadowsSaturation}set shadowsSaturation(e){this._shadowsSaturation=e,this._dirty=!0}get shadowsExposure(){return this._shadowsExposure}set shadowsExposure(e){this._shadowsExposure=e,this._dirty=!0}getClassName(){return"ColorCurves"}static Bind(e,t,i="vCameraColorCurvePositive",n="vCameraColorCurveNeutral",s="vCameraColorCurveNegative"){e._dirty&&(e._dirty=!1,e._getColorGradingDataToRef(e._globalHue,e._globalDensity,e._globalSaturation,e._globalExposure,e._globalCurve),e._getColorGradingDataToRef(e._highlightsHue,e._highlightsDensity,e._highlightsSaturation,e._highlightsExposure,e._tempColor),e._tempColor.multiplyToRef(e._globalCurve,e._highlightsCurve),e._getColorGradingDataToRef(e._midtonesHue,e._midtonesDensity,e._midtonesSaturation,e._midtonesExposure,e._tempColor),e._tempColor.multiplyToRef(e._globalCurve,e._midtonesCurve),e._getColorGradingDataToRef(e._shadowsHue,e._shadowsDensity,e._shadowsSaturation,e._shadowsExposure,e._tempColor),e._tempColor.multiplyToRef(e._globalCurve,e._shadowsCurve),e._highlightsCurve.subtractToRef(e._midtonesCurve,e._positiveCurve),e._midtonesCurve.subtractToRef(e._shadowsCurve,e._negativeCurve)),t&&(t.setFloat4(i,e._positiveCurve.r,e._positiveCurve.g,e._positiveCurve.b,e._positiveCurve.a),t.setFloat4(n,e._midtonesCurve.r,e._midtonesCurve.g,e._midtonesCurve.b,e._midtonesCurve.a),t.setFloat4(s,e._negativeCurve.r,e._negativeCurve.g,e._negativeCurve.b,e._negativeCurve.a))}static PrepareUniforms(e){e.push("vCameraColorCurveNeutral","vCameraColorCurvePositive","vCameraColorCurveNegative")}_getColorGradingDataToRef(e,t,i,n,s){null!=e&&(e=o._Clamp(e,0,360),t=o._Clamp(t,-100,100),i=o._Clamp(i,-100,100),n=o._Clamp(n,-100,100),t=o._ApplyColorGradingSliderNonlinear(t),t*=.5,n=o._ApplyColorGradingSliderNonlinear(n),t<0&&(t*=-1,e=(e+180)%360),o._FromHSBToRef(e,t,50+.25*n,s),s.scaleToRef(2,s),s.a=1+.01*i)}static _ApplyColorGradingSliderNonlinear(e){e/=100;let t=Math.abs(e);return t=Math.pow(t,2),e<0&&(t*=-1),t*=100,t}static _FromHSBToRef(e,t,i,n){let s=o._Clamp(e,0,360);const r=o._Clamp(t/100,0,1),a=o._Clamp(i/100,0,1);if(0===r)n.r=a,n.g=a,n.b=a;else{s/=60;const e=Math.floor(s),t=s-e,i=a*(1-r),o=a*(1-r*t),l=a*(1-r*(1-t));switch(e){case 0:n.r=a,n.g=l,n.b=i;break;case 1:n.r=o,n.g=a,n.b=i;break;case 2:n.r=i,n.g=a,n.b=l;break;case 3:n.r=i,n.g=o,n.b=a;break;case 4:n.r=l,n.g=i,n.b=a;break;default:n.r=a,n.g=i,n.b=o}}n.a=1}static _Clamp(e,t,i){return Math.min(Math.max(e,t),i)}clone(){return s.p4.Clone((()=>new o),this)}serialize(){return s.p4.Serialize(this)}static Parse(e){return s.p4.Parse((()=>new o),e,null,null)}}(0,n.gn)([(0,s.qC)()],o.prototype,"_globalHue",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"_globalDensity",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"_globalSaturation",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"_globalExposure",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"_highlightsHue",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"_highlightsDensity",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"_highlightsSaturation",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"_highlightsExposure",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"_midtonesHue",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"_midtonesDensity",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"_midtonesSaturation",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"_midtonesExposure",void 0),s.p4._ColorCurvesParser=o.Parse},1345:(e,t,i)=>{i.d(t,{q:()=>n});class n{static IsWrapper(e){return void 0===e.getPipelineContext}static GetEffect(e){return void 0===e.getPipelineContext?e.effect:e}constructor(e,t=!0){this.effect=null,this.defines=null,this.drawContext=e.createDrawContext(),t&&(this.materialContext=e.createMaterialContext())}setEffect(e,t,i=!0){var n;this.effect=e,void 0!==t&&(this.defines=t),i&&(null===(n=this.drawContext)||void 0===n||n.reset())}dispose(){var e;null===(e=this.drawContext)||void 0===e||e.dispose()}}},1979:(e,t,i)=>{i.d(t,{Q:()=>h});var n=i(5757),s=i(6797),r=i(2722),o=i(8198),a=i(8104),l=i(9131);class h{static get ShadersRepository(){return a.v.ShadersRepository}static set ShadersRepository(e){a.v.ShadersRepository=e}get onBindObservable(){return this._onBindObservable||(this._onBindObservable=new n.y$),this._onBindObservable}constructor(e,t,i,r=null,c,u=null,d=null,p=null,f=null,_,m="",g=l.x.GLSL){var v,y,x;let b;this.name=null,this.defines="",this.onCompiled=null,this.onError=null,this.onBind=null,this.uniqueId=0,this.onCompileObservable=new n.y$,this.onErrorObservable=new n.y$,this._onBindObservable=null,this._wasPreviouslyReady=!1,this._forceRebindOnNextCall=!1,this._wasPreviouslyUsingInstances=null,this._isDisposed=!1,this._bonesComputationForcedToCPU=!1,this._uniformBuffersNames={},this._multiTarget=!1,this._samplers={},this._isReady=!1,this._compilationError="",this._allFallbacksProcessed=!1,this._uniforms={},this._key="",this._fallbacks=null,this._vertexSourceCodeOverride="",this._fragmentSourceCodeOverride="",this._transformFeedbackVaryings=null,this._pipelineContext=null,this._vertexSourceCode="",this._fragmentSourceCode="",this._vertexSourceCodeBeforeMigration="",this._fragmentSourceCodeBeforeMigration="",this._rawVertexSourceCode="",this._rawFragmentSourceCode="",this.name=e,this._key=m;let T,S,E=null;if(t.attributes){const e=t;if(this._engine=i,this._attributesNames=e.attributes,this._uniformsNames=e.uniformsNames.concat(e.samplers),this._samplerList=e.samplers.slice(),this.defines=e.defines,this.onError=e.onError,this.onCompiled=e.onCompiled,this._fallbacks=e.fallbacks,this._indexParameters=e.indexParameters,this._transformFeedbackVaryings=e.transformFeedbackVaryings||null,this._multiTarget=!!e.multiTarget,this._shaderLanguage=null!==(v=e.shaderLanguage)&&void 0!==v?v:l.x.GLSL,e.uniformBuffersNames){this._uniformBuffersNamesList=e.uniformBuffersNames.slice();for(let t=0;t<e.uniformBuffersNames.length;t++)this._uniformBuffersNames[e.uniformBuffersNames[t]]=t}E=null!==(y=e.processFinalCode)&&void 0!==y?y:null,b=null!==(x=e.processCodeAfterIncludes)&&void 0!==x?x:void 0}else this._engine=c,this.defines=null==u?"":u,this._uniformsNames=i.concat(r),this._samplerList=r?r.slice():[],this._attributesNames=t,this._uniformBuffersNamesList=[],this._shaderLanguage=g,this.onError=f,this.onCompiled=p,this._indexParameters=_,this._fallbacks=d;this._attributeLocationByName={},this.uniqueId=h._UniqueIdSeed++;const C=(0,s.CG)()?this._engine.getHostDocument():null;e.vertexSource?T="source:"+e.vertexSource:e.vertexElement?(T=C?C.getElementById(e.vertexElement):null,T||(T=e.vertexElement)):T=e.vertex||e,e.fragmentSource?S="source:"+e.fragmentSource:e.fragmentElement?(S=C?C.getElementById(e.fragmentElement):null,S||(S=e.fragmentElement)):S=e.fragment||e,this._processingContext=this._engine._getShaderProcessingContext(this._shaderLanguage);let A={defines:this.defines.split("\n"),indexParameters:this._indexParameters,isFragment:!1,shouldUseHighPrecisionShader:this._engine._shouldUseHighPrecisionShader,processor:this._engine._getShaderProcessor(this._shaderLanguage),supportsUniformBuffers:this._engine.supportsUniformBuffers,shadersRepository:a.v.GetShadersRepository(this._shaderLanguage),includesShadersStore:a.v.GetIncludesShadersStore(this._shaderLanguage),version:(100*this._engine.version).toString(),platformName:this._engine.shaderPlatformName,processingContext:this._processingContext,isNDCHalfZRange:this._engine.isNDCHalfZRange,useReverseDepthBuffer:this._engine.useReverseDepthBuffer,processCodeAfterIncludes:b};const P=[void 0,void 0],R=()=>{if(P[0]&&P[1]){A.isFragment=!0;const[t,i]=P;o.L.Process(i,A,((i,n)=>{this._fragmentSourceCodeBeforeMigration=n,E&&(i=E("fragment",i));const s=o.L.Finalize(t,i,A);A=null,this._useFinalCode(s.vertexCode,s.fragmentCode,e)}),this._engine)}};this._loadShader(T,"Vertex","",(e=>{o.L.Initialize(A),o.L.Process(e,A,((t,i)=>{this._rawVertexSourceCode=e,this._vertexSourceCodeBeforeMigration=i,E&&(t=E("vertex",t)),P[0]=t,R()}),this._engine)})),this._loadShader(S,"Fragment","Pixel",(e=>{this._rawFragmentSourceCode=e,P[1]=e,R()}))}_useFinalCode(e,t,i){if(i){const n=i.vertexElement||i.vertex||i.spectorName||i,s=i.fragmentElement||i.fragment||i.spectorName||i;this._vertexSourceCode=(this._shaderLanguage===l.x.WGSL?"//":"")+"#define SHADER_NAME vertex:"+n+"\n"+e,this._fragmentSourceCode=(this._shaderLanguage===l.x.WGSL?"//":"")+"#define SHADER_NAME fragment:"+s+"\n"+t}else this._vertexSourceCode=e,this._fragmentSourceCode=t;this._prepareEffect()}get key(){return this._key}isReady(){try{return this._isReadyInternal()}catch(e){return!1}}_isReadyInternal(){return!!this._isReady||!!this._pipelineContext&&this._pipelineContext.isReady}getEngine(){return this._engine}getPipelineContext(){return this._pipelineContext}getAttributesNames(){return this._attributesNames}getAttributeLocation(e){return this._attributes[e]}getAttributeLocationByName(e){return this._attributeLocationByName[e]}getAttributesCount(){return this._attributes.length}getUniformIndex(e){return this._uniformsNames.indexOf(e)}getUniform(e){return this._uniforms[e]}getSamplers(){return this._samplerList}getUniformNames(){return this._uniformsNames}getUniformBuffersNames(){return this._uniformBuffersNamesList}getIndexParameters(){return this._indexParameters}getCompilationError(){return this._compilationError}allFallbacksProcessed(){return this._allFallbacksProcessed}executeWhenCompiled(e){this.isReady()?e(this):(this.onCompileObservable.add((t=>{e(t)})),this._pipelineContext&&!this._pipelineContext.isAsync||setTimeout((()=>{this._checkIsReady(null)}),16))}_checkIsReady(e){try{if(this._isReadyInternal())return}catch(t){return void this._processCompilationErrors(t,e)}this._isDisposed||setTimeout((()=>{this._checkIsReady(e)}),16)}_loadShader(e,t,i,n){if("undefined"!=typeof HTMLElement&&e instanceof HTMLElement)return void n((0,s.v)(e));if("source:"===e.substr(0,7))return void n(e.substr(7));if("base64:"===e.substr(0,7))return void n(window.atob(e.substr(7)));const r=a.v.GetShadersStore(this._shaderLanguage);if(r[e+t+"Shader"])return void n(r[e+t+"Shader"]);if(i&&r[e+i+"Shader"])return void n(r[e+i+"Shader"]);let o;o="."===e[0]||"/"===e[0]||e.indexOf("http")>-1?e:a.v.GetShadersRepository(this._shaderLanguage)+e,this._engine._loadFile(o+"."+t.toLowerCase()+".fx",n)}get vertexSourceCode(){var e,t;return this._vertexSourceCodeOverride&&this._fragmentSourceCodeOverride?this._vertexSourceCodeOverride:null!==(t=null===(e=this._pipelineContext)||void 0===e?void 0:e._getVertexShaderCode())&&void 0!==t?t:this._vertexSourceCode}get fragmentSourceCode(){var e,t;return this._vertexSourceCodeOverride&&this._fragmentSourceCodeOverride?this._fragmentSourceCodeOverride:null!==(t=null===(e=this._pipelineContext)||void 0===e?void 0:e._getFragmentShaderCode())&&void 0!==t?t:this._fragmentSourceCode}get vertexSourceCodeBeforeMigration(){return this._vertexSourceCodeBeforeMigration}get fragmentSourceCodeBeforeMigration(){return this._fragmentSourceCodeBeforeMigration}get rawVertexSourceCode(){return this._rawVertexSourceCode}get rawFragmentSourceCode(){return this._rawFragmentSourceCode}_rebuildProgram(e,t,i,n){this._isReady=!1,this._vertexSourceCodeOverride=e,this._fragmentSourceCodeOverride=t,this.onError=(e,t)=>{n&&n(t)},this.onCompiled=()=>{const e=this.getEngine().scenes;if(e)for(let t=0;t<e.length;t++)e[t].markAllMaterialsAsDirty(63);this._pipelineContext._handlesSpectorRebuildCallback(i)},this._fallbacks=null,this._prepareEffect()}_prepareEffect(){const e=this._attributesNames,t=this.defines,i=this._pipelineContext;this._isReady=!1;try{const n=this._engine;this._pipelineContext=n.createPipelineContext(this._processingContext),this._pipelineContext._name=this._key;const s=this._rebuildProgram.bind(this);this._vertexSourceCodeOverride&&this._fragmentSourceCodeOverride?n._preparePipelineContext(this._pipelineContext,this._vertexSourceCodeOverride,this._fragmentSourceCodeOverride,!0,this._rawVertexSourceCode,this._rawFragmentSourceCode,s,null,this._transformFeedbackVaryings,this._key):n._preparePipelineContext(this._pipelineContext,this._vertexSourceCode,this._fragmentSourceCode,!1,this._rawVertexSourceCode,this._rawFragmentSourceCode,s,t,this._transformFeedbackVaryings,this._key),n._executeWhenRenderingStateIsCompiled(this._pipelineContext,(()=>{if(this._attributes=[],this._pipelineContext._fillEffectInformation(this,this._uniformBuffersNames,this._uniformsNames,this._uniforms,this._samplerList,this._samplers,e,this._attributes),e)for(let t=0;t<e.length;t++){const i=e[t];this._attributeLocationByName[i]=this._attributes[t]}n.bindSamplers(this),this._compilationError="",this._isReady=!0,this.onCompiled&&this.onCompiled(this),this.onCompileObservable.notifyObservers(this),this.onCompileObservable.clear(),this._fallbacks&&this._fallbacks.unBindMesh(),i&&this.getEngine()._deletePipelineContext(i)})),this._pipelineContext.isAsync&&this._checkIsReady(i)}catch(e){this._processCompilationErrors(e,i)}}_getShaderCodeAndErrorLine(e,t,i){const n=i?/FRAGMENT SHADER ERROR: 0:(\d+?):/:/VERTEX SHADER ERROR: 0:(\d+?):/;let s=null;if(t&&e){const r=t.match(n);if(r&&2===r.length){const t=parseInt(r[1]),n=e.split("\n",-1);n.length>=t&&(s=`Offending line [${t}] in ${i?"fragment":"vertex"} code: ${n[t-1]}`)}}return[e,s]}_processCompilationErrors(e,t=null){var i,n,s;this._compilationError=e.message;const o=this._attributesNames,a=this._fallbacks;if(r.Y.Error("Unable to compile effect:"),r.Y.Error("Uniforms: "+this._uniformsNames.map((function(e){return" "+e}))),r.Y.Error("Attributes: "+o.map((function(e){return" "+e}))),r.Y.Error("Defines:\r\n"+this.defines),h.LogShaderCodeOnCompilationError){let e=null,t=null,o=null;(null===(i=this._pipelineContext)||void 0===i?void 0:i._getVertexShaderCode())&&([o,e]=this._getShaderCodeAndErrorLine(this._pipelineContext._getVertexShaderCode(),this._compilationError,!1),o&&(r.Y.Error("Vertex code:"),r.Y.Error(o))),(null===(n=this._pipelineContext)||void 0===n?void 0:n._getFragmentShaderCode())&&([o,t]=this._getShaderCodeAndErrorLine(null===(s=this._pipelineContext)||void 0===s?void 0:s._getFragmentShaderCode(),this._compilationError,!0),o&&(r.Y.Error("Fragment code:"),r.Y.Error(o))),e&&r.Y.Error(e),t&&r.Y.Error(t)}r.Y.Error("Error: "+this._compilationError);const l=()=>{this.onError&&this.onError(this,this._compilationError),this.onErrorObservable.notifyObservers(this)};t&&(this._pipelineContext=t,this._isReady=!0,l()),a?(this._pipelineContext=null,a.hasMoreFallbacks?(this._allFallbacksProcessed=!1,r.Y.Error("Trying next fallback."),this.defines=a.reduce(this.defines,this),this._prepareEffect()):(this._allFallbacksProcessed=!0,l(),this.onErrorObservable.clear(),this._fallbacks&&this._fallbacks.unBindMesh())):(this._allFallbacksProcessed=!0,t||l())}get isSupported(){return""===this._compilationError}_bindTexture(e,t){this._engine._bindTexture(this._samplers[e],t,e)}setTexture(e,t){this._engine.setTexture(this._samplers[e],this._uniforms[e],t,e)}setDepthStencilTexture(e,t){this._engine.setDepthStencilTexture(this._samplers[e],this._uniforms[e],t,e)}setTextureArray(e,t){const i=e+"Ex";if(-1===this._samplerList.indexOf(i+"0")){const n=this._samplerList.indexOf(e);for(let e=1;e<t.length;e++){const t=i+(e-1).toString();this._samplerList.splice(n+e,0,t)}let s=0;for(const e of this._samplerList)this._samplers[e]=s,s+=1}this._engine.setTextureArray(this._samplers[e],this._uniforms[e],t,e)}setTextureFromPostProcess(e,t){this._engine.setTextureFromPostProcess(this._samplers[e],t,e)}setTextureFromPostProcessOutput(e,t){this._engine.setTextureFromPostProcessOutput(this._samplers[e],t,e)}bindUniformBuffer(e,t){const i=this._uniformBuffersNames[t];void 0===i||h._BaseCache[i]===e&&this._engine._features.useUBOBindingCache||(h._BaseCache[i]=e,this._engine.bindUniformBufferBase(e,i,t))}bindUniformBlock(e,t){this._engine.bindUniformBlock(this._pipelineContext,e,t)}setInt(e,t){return this._pipelineContext.setInt(e,t),this}setInt2(e,t,i){return this._pipelineContext.setInt2(e,t,i),this}setInt3(e,t,i,n){return this._pipelineContext.setInt3(e,t,i,n),this}setInt4(e,t,i,n,s){return this._pipelineContext.setInt4(e,t,i,n,s),this}setIntArray(e,t){return this._pipelineContext.setIntArray(e,t),this}setIntArray2(e,t){return this._pipelineContext.setIntArray2(e,t),this}setIntArray3(e,t){return this._pipelineContext.setIntArray3(e,t),this}setIntArray4(e,t){return this._pipelineContext.setIntArray4(e,t),this}setUInt(e,t){return this._pipelineContext.setInt(e,t),this}setUInt2(e,t,i){return this._pipelineContext.setInt2(e,t,i),this}setUInt3(e,t,i,n){return this._pipelineContext.setInt3(e,t,i,n),this}setUInt4(e,t,i,n,s){return this._pipelineContext.setInt4(e,t,i,n,s),this}setUIntArray(e,t){return this._pipelineContext.setUIntArray(e,t),this}setUIntArray2(e,t){return this._pipelineContext.setUIntArray2(e,t),this}setUIntArray3(e,t){return this._pipelineContext.setUIntArray3(e,t),this}setUIntArray4(e,t){return this._pipelineContext.setUIntArray4(e,t),this}setFloatArray(e,t){return this._pipelineContext.setArray(e,t),this}setFloatArray2(e,t){return this._pipelineContext.setArray2(e,t),this}setFloatArray3(e,t){return this._pipelineContext.setArray3(e,t),this}setFloatArray4(e,t){return this._pipelineContext.setArray4(e,t),this}setArray(e,t){return this._pipelineContext.setArray(e,t),this}setArray2(e,t){return this._pipelineContext.setArray2(e,t),this}setArray3(e,t){return this._pipelineContext.setArray3(e,t),this}setArray4(e,t){return this._pipelineContext.setArray4(e,t),this}setMatrices(e,t){return this._pipelineContext.setMatrices(e,t),this}setMatrix(e,t){return this._pipelineContext.setMatrix(e,t),this}setMatrix3x3(e,t){return this._pipelineContext.setMatrix3x3(e,t),this}setMatrix2x2(e,t){return this._pipelineContext.setMatrix2x2(e,t),this}setFloat(e,t){return this._pipelineContext.setFloat(e,t),this}setBool(e,t){return this._pipelineContext.setInt(e,t?1:0),this}setVector2(e,t){return this._pipelineContext.setVector2(e,t),this}setFloat2(e,t,i){return this._pipelineContext.setFloat2(e,t,i),this}setVector3(e,t){return this._pipelineContext.setVector3(e,t),this}setFloat3(e,t,i,n){return this._pipelineContext.setFloat3(e,t,i,n),this}setVector4(e,t){return this._pipelineContext.setVector4(e,t),this}setQuaternion(e,t){return this._pipelineContext.setQuaternion(e,t),this}setFloat4(e,t,i,n,s){return this._pipelineContext.setFloat4(e,t,i,n,s),this}setColor3(e,t){return this._pipelineContext.setColor3(e,t),this}setColor4(e,t,i){return this._pipelineContext.setColor4(e,t,i),this}setDirectColor4(e,t){return this._pipelineContext.setDirectColor4(e,t),this}dispose(){this._pipelineContext&&this._pipelineContext.dispose(),this._engine._releaseEffect(this),this._isDisposed=!0}static RegisterShader(e,t,i,n=l.x.GLSL){t&&(a.v.GetShadersStore(n)[`${e}PixelShader`]=t),i&&(a.v.GetShadersStore(n)[`${e}VertexShader`]=i)}static ResetCache(){h._BaseCache={}}}h.LogShaderCodeOnCompilationError=!0,h._UniqueIdSeed=0,h._BaseCache={},h.ShadersStore=a.v.ShadersStore,h.IncludesShadersStore=a.v.IncludesShadersStore},1434:(e,t,i)=>{i.d(t,{L:()=>n});class n{constructor(){this._defines={},this._currentRank=32,this._maxRank=-1,this._mesh=null}unBindMesh(){this._mesh=null}addFallback(e,t){this._defines[e]||(e<this._currentRank&&(this._currentRank=e),e>this._maxRank&&(this._maxRank=e),this._defines[e]=new Array),this._defines[e].push(t)}addCPUSkinningFallback(e,t){this._mesh=t,e<this._currentRank&&(this._currentRank=e),e>this._maxRank&&(this._maxRank=e)}get hasMoreFallbacks(){return this._currentRank<=this._maxRank}reduce(e,t){if(this._mesh&&this._mesh.computeBonesUsingShaders&&this._mesh.numBoneInfluencers>0){this._mesh.computeBonesUsingShaders=!1,e=e.replace("#define NUM_BONE_INFLUENCERS "+this._mesh.numBoneInfluencers,"#define NUM_BONE_INFLUENCERS 0"),t._bonesComputationForcedToCPU=!0;const i=this._mesh.getScene();for(let e=0;e<i.meshes.length;e++){const n=i.meshes[e];if(n.material){if(n.computeBonesUsingShaders&&0!==n.numBoneInfluencers)if(n.material.getEffect()===t)n.computeBonesUsingShaders=!1;else if(n.subMeshes)for(const e of n.subMeshes)if(e.effect===t){n.computeBonesUsingShaders=!1;break}}else!this._mesh.material&&n.computeBonesUsingShaders&&n.numBoneInfluencers>0&&(n.computeBonesUsingShaders=!1)}}else{const t=this._defines[this._currentRank];if(t)for(let i=0;i<t.length;i++)e=e.replace("#define "+t[i],"");this._currentRank++}return e}}},7218:(e,t,i)=>{i.d(t,{H:()=>c,I:()=>h});var n=i(708),s=i(4538),r=i(5757),o=i(1979),a=i(1345);i(8793);const l={positions:[1,1,-1,1,-1,-1,1,-1],indices:[0,1,2,0,2,3]};class h{constructor(e,t=l){var i,r;this._fullscreenViewport=new s.l(0,0,1,1);const o=null!==(i=t.positions)&&void 0!==i?i:l.positions,a=null!==(r=t.indices)&&void 0!==r?r:l.indices;this.engine=e,this._vertexBuffers={[n.o.PositionKind]:new n.o(e,o,n.o.PositionKind,!1,!1,2)},this._indexBuffer=e.createIndexBuffer(a),this._onContextRestoredObserver=e.onContextRestoredObservable.add((()=>{this._indexBuffer=e.createIndexBuffer(a);for(const e in this._vertexBuffers)this._vertexBuffers[e]._rebuild()}))}setViewport(e=this._fullscreenViewport){this.engine.setViewport(e)}bindBuffers(e){this.engine.bindBuffers(this._vertexBuffers,this._indexBuffer,e)}applyEffectWrapper(e){this.engine.setState(!0),this.engine.depthCullingState.depthTest=!1,this.engine.stencilState.stencilTest=!1,this.engine.enableEffect(e._drawWrapper),this.bindBuffers(e.effect),e.onApplyObservable.notifyObservers({})}restoreStates(){this.engine.depthCullingState.depthTest=!0,this.engine.stencilState.stencilTest=!0}draw(){this.engine.drawElementsType(0,0,6)}_isRenderTargetTexture(e){return void 0!==e.renderTarget}render(e,t=null){if(!e.effect.isReady())return;this.setViewport();const i=null===t?null:this._isRenderTargetTexture(t)?t.renderTarget:t;i&&this.engine.bindFramebuffer(i),this.applyEffectWrapper(e),this.draw(),i&&this.engine.unBindFramebuffer(i),this.restoreStates()}dispose(){const e=this._vertexBuffers[n.o.PositionKind];e&&(e.dispose(),delete this._vertexBuffers[n.o.PositionKind]),this._indexBuffer&&this.engine._releaseBuffer(this._indexBuffer),this._onContextRestoredObserver&&(this.engine.onContextRestoredObservable.remove(this._onContextRestoredObserver),this._onContextRestoredObserver=null)}}class c{get effect(){return this._drawWrapper.effect}set effect(e){this._drawWrapper.effect=e}constructor(e){let t;this.onApplyObservable=new r.y$;const i=e.uniformNames||[];e.vertexShader?t={fragmentSource:e.fragmentShader,vertexSource:e.vertexShader,spectorName:e.name||"effectWrapper"}:(i.push("scale"),t={fragmentSource:e.fragmentShader,vertex:"postprocess",spectorName:e.name||"effectWrapper"},this.onApplyObservable.add((()=>{this.effect.setFloat2("scale",1,1)})));const n=e.defines?e.defines.join("\n"):"";this._drawWrapper=new a.q(e.engine),e.useShaderStore?(t.fragment=t.fragmentSource,t.vertex||(t.vertex=t.vertexSource),delete t.fragmentSource,delete t.vertexSource,this.effect=e.engine.createEffect(t,e.attributeNames||["position"],i,e.samplerNames,n,void 0,e.onCompiled,void 0,void 0,e.shaderLanguage)):(this.effect=new o.Q(t,e.attributeNames||["position"],i,e.samplerNames,e.engine,n,void 0,e.onCompiled,void 0,void 0,void 0,e.shaderLanguage),this._onContextRestoredObserver=e.engine.onContextRestoredObservable.add((()=>{this.effect._pipelineContext=null,this.effect._wasPreviouslyReady=!1,this.effect._prepareEffect()})))}dispose(){this._onContextRestoredObserver&&(this.effect.getEngine().onContextRestoredObservable.remove(this._onContextRestoredObserver),this._onContextRestoredObserver=null),this.effect.dispose()}}},4475:(e,t,i)=>{i.d(t,{$:()=>u,b:()=>c});var n=i(9472),s=i(3956),r=i(5757),o=i(7257),a=i(4649),l=i(1917),h=i(8237);class c extends l.H{constructor(){super(),this.IMAGEPROCESSING=!1,this.VIGNETTE=!1,this.VIGNETTEBLENDMODEMULTIPLY=!1,this.VIGNETTEBLENDMODEOPAQUE=!1,this.TONEMAPPING=!1,this.TONEMAPPING_ACES=!1,this.CONTRAST=!1,this.COLORCURVES=!1,this.COLORGRADING=!1,this.COLORGRADING3D=!1,this.SAMPLER3DGREENDEPTH=!1,this.SAMPLER3DBGRMAP=!1,this.DITHER=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.EXPOSURE=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class u{constructor(){this.colorCurves=new h.U,this._colorCurvesEnabled=!1,this._colorGradingEnabled=!1,this._colorGradingWithGreenDepth=!0,this._colorGradingBGR=!0,this._exposure=1,this._toneMappingEnabled=!1,this._toneMappingType=u.TONEMAPPING_STANDARD,this._contrast=1,this.vignetteStretch=0,this.vignetteCenterX=0,this.vignetteCenterY=0,this.vignetteWeight=1.5,this.vignetteColor=new a.HE(0,0,0,0),this.vignetteCameraFov=.5,this._vignetteBlendMode=u.VIGNETTEMODE_MULTIPLY,this._vignetteEnabled=!1,this._ditheringEnabled=!1,this._ditheringIntensity=1/255,this._skipFinalColorClamp=!1,this._applyByPostProcess=!1,this._isEnabled=!0,this.onUpdateParameters=new r.y$}get colorCurvesEnabled(){return this._colorCurvesEnabled}set colorCurvesEnabled(e){this._colorCurvesEnabled!==e&&(this._colorCurvesEnabled=e,this._updateParameters())}get colorGradingTexture(){return this._colorGradingTexture}set colorGradingTexture(e){this._colorGradingTexture!==e&&(this._colorGradingTexture=e,this._updateParameters())}get colorGradingEnabled(){return this._colorGradingEnabled}set colorGradingEnabled(e){this._colorGradingEnabled!==e&&(this._colorGradingEnabled=e,this._updateParameters())}get colorGradingWithGreenDepth(){return this._colorGradingWithGreenDepth}set colorGradingWithGreenDepth(e){this._colorGradingWithGreenDepth!==e&&(this._colorGradingWithGreenDepth=e,this._updateParameters())}get colorGradingBGR(){return this._colorGradingBGR}set colorGradingBGR(e){this._colorGradingBGR!==e&&(this._colorGradingBGR=e,this._updateParameters())}get exposure(){return this._exposure}set exposure(e){this._exposure!==e&&(this._exposure=e,this._updateParameters())}get toneMappingEnabled(){return this._toneMappingEnabled}set toneMappingEnabled(e){this._toneMappingEnabled!==e&&(this._toneMappingEnabled=e,this._updateParameters())}get toneMappingType(){return this._toneMappingType}set toneMappingType(e){this._toneMappingType!==e&&(this._toneMappingType=e,this._updateParameters())}get contrast(){return this._contrast}set contrast(e){this._contrast!==e&&(this._contrast=e,this._updateParameters())}get vignetteCentreY(){return this.vignetteCenterY}set vignetteCentreY(e){this.vignetteCenterY=e}get vignetteCentreX(){return this.vignetteCenterX}set vignetteCentreX(e){this.vignetteCenterX=e}get vignetteBlendMode(){return this._vignetteBlendMode}set vignetteBlendMode(e){this._vignetteBlendMode!==e&&(this._vignetteBlendMode=e,this._updateParameters())}get vignetteEnabled(){return this._vignetteEnabled}set vignetteEnabled(e){this._vignetteEnabled!==e&&(this._vignetteEnabled=e,this._updateParameters())}get ditheringEnabled(){return this._ditheringEnabled}set ditheringEnabled(e){this._ditheringEnabled!==e&&(this._ditheringEnabled=e,this._updateParameters())}get ditheringIntensity(){return this._ditheringIntensity}set ditheringIntensity(e){this._ditheringIntensity!==e&&(this._ditheringIntensity=e,this._updateParameters())}get skipFinalColorClamp(){return this._skipFinalColorClamp}set skipFinalColorClamp(e){this._skipFinalColorClamp!==e&&(this._skipFinalColorClamp=e,this._updateParameters())}get applyByPostProcess(){return this._applyByPostProcess}set applyByPostProcess(e){this._applyByPostProcess!==e&&(this._applyByPostProcess=e,this._updateParameters())}get isEnabled(){return this._isEnabled}set isEnabled(e){this._isEnabled!==e&&(this._isEnabled=e,this._updateParameters())}_updateParameters(){this.onUpdateParameters.notifyObservers(this)}getClassName(){return"ImageProcessingConfiguration"}static PrepareUniforms(e,t){t.EXPOSURE&&e.push("exposureLinear"),t.CONTRAST&&e.push("contrast"),t.COLORGRADING&&e.push("colorTransformSettings"),(t.VIGNETTE||t.DITHER)&&e.push("vInverseScreenSize"),t.VIGNETTE&&(e.push("vignetteSettings1"),e.push("vignetteSettings2")),t.COLORCURVES&&h.U.PrepareUniforms(e),t.DITHER&&e.push("ditherIntensity")}static PrepareSamplers(e,t){t.COLORGRADING&&e.push("txColorTransform")}prepareDefines(e,t=!1){if(t!==this.applyByPostProcess||!this._isEnabled)return e.VIGNETTE=!1,e.TONEMAPPING=!1,e.TONEMAPPING_ACES=!1,e.CONTRAST=!1,e.EXPOSURE=!1,e.COLORCURVES=!1,e.COLORGRADING=!1,e.COLORGRADING3D=!1,e.DITHER=!1,e.IMAGEPROCESSING=!1,e.SKIPFINALCOLORCLAMP=this.skipFinalColorClamp,void(e.IMAGEPROCESSINGPOSTPROCESS=this.applyByPostProcess&&this._isEnabled);e.VIGNETTE=this.vignetteEnabled,e.VIGNETTEBLENDMODEMULTIPLY=this.vignetteBlendMode===u._VIGNETTEMODE_MULTIPLY,e.VIGNETTEBLENDMODEOPAQUE=!e.VIGNETTEBLENDMODEMULTIPLY,e.TONEMAPPING=this.toneMappingEnabled,this._toneMappingType===u.TONEMAPPING_ACES?e.TONEMAPPING_ACES=!0:e.TONEMAPPING_ACES=!1,e.CONTRAST=1!==this.contrast,e.EXPOSURE=1!==this.exposure,e.COLORCURVES=this.colorCurvesEnabled&&!!this.colorCurves,e.COLORGRADING=this.colorGradingEnabled&&!!this.colorGradingTexture,e.COLORGRADING?e.COLORGRADING3D=this.colorGradingTexture.is3D:e.COLORGRADING3D=!1,e.SAMPLER3DGREENDEPTH=this.colorGradingWithGreenDepth,e.SAMPLER3DBGRMAP=this.colorGradingBGR,e.DITHER=this._ditheringEnabled,e.IMAGEPROCESSINGPOSTPROCESS=this.applyByPostProcess,e.SKIPFINALCOLORCLAMP=this.skipFinalColorClamp,e.IMAGEPROCESSING=e.VIGNETTE||e.TONEMAPPING||e.CONTRAST||e.EXPOSURE||e.COLORCURVES||e.COLORGRADING||e.DITHER}isReady(){return!this.colorGradingEnabled||!this.colorGradingTexture||this.colorGradingTexture.isReady()}bind(e,t){if(this._colorCurvesEnabled&&this.colorCurves&&h.U.Bind(this.colorCurves,e),this._vignetteEnabled||this._ditheringEnabled){const i=1/e.getEngine().getRenderWidth(),n=1/e.getEngine().getRenderHeight();if(e.setFloat2("vInverseScreenSize",i,n),this._ditheringEnabled&&e.setFloat("ditherIntensity",.5*this._ditheringIntensity),this._vignetteEnabled){const s=null!=t?t:n/i;let r=Math.tan(.5*this.vignetteCameraFov),a=r*s;const l=Math.sqrt(a*r);a=o.w1.Mix(a,l,this.vignetteStretch),r=o.w1.Mix(r,l,this.vignetteStretch),e.setFloat4("vignetteSettings1",a,r,-a*this.vignetteCenterX,-r*this.vignetteCenterY);const h=-2*this.vignetteWeight;e.setFloat4("vignetteSettings2",this.vignetteColor.r,this.vignetteColor.g,this.vignetteColor.b,h)}}if(e.setFloat("exposureLinear",this.exposure),e.setFloat("contrast",this.contrast),this.colorGradingTexture){e.setTexture("txColorTransform",this.colorGradingTexture);const t=this.colorGradingTexture.getSize().height;e.setFloat4("colorTransformSettings",(t-1)/t,.5/t,t,this.colorGradingTexture.level)}}clone(){return s.p4.Clone((()=>new u),this)}serialize(){return s.p4.Serialize(this)}static Parse(e){const t=s.p4.Parse((()=>new u),e,null,null);return void 0!==e.vignetteCentreX&&(t.vignetteCenterX=e.vignetteCentreX),void 0!==e.vignetteCentreY&&(t.vignetteCenterY=e.vignetteCentreY),t}static get VIGNETTEMODE_MULTIPLY(){return this._VIGNETTEMODE_MULTIPLY}static get VIGNETTEMODE_OPAQUE(){return this._VIGNETTEMODE_OPAQUE}}u.TONEMAPPING_STANDARD=0,u.TONEMAPPING_ACES=1,u._VIGNETTEMODE_MULTIPLY=0,u._VIGNETTEMODE_OPAQUE=1,(0,n.gn)([(0,s.N$)()],u.prototype,"colorCurves",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_colorCurvesEnabled",void 0),(0,n.gn)([(0,s.oU)("colorGradingTexture")],u.prototype,"_colorGradingTexture",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_colorGradingEnabled",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_colorGradingWithGreenDepth",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_colorGradingBGR",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_exposure",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_toneMappingEnabled",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_toneMappingType",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_contrast",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"vignetteStretch",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"vignetteCenterX",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"vignetteCenterY",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"vignetteWeight",void 0),(0,n.gn)([(0,s.XX)()],u.prototype,"vignetteColor",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"vignetteCameraFov",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_vignetteBlendMode",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_vignetteEnabled",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_ditheringEnabled",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_ditheringIntensity",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_skipFinalColorClamp",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_applyByPostProcess",void 0),(0,n.gn)([(0,s.qC)()],u.prototype,"_isEnabled",void 0),s.p4._ImageProcessingConfigurationParser=u.Parse},6150:(e,t,i)=>{i.d(t,{G:()=>c,p:()=>u});var n=i(9472),s=i(7104),r=i(3956),o=i(85),a=i(5346),l=i(1917),h=i(8449);class c extends l.H{constructor(){super(...arguments),this.DETAIL=!1,this.DETAILDIRECTUV=0,this.DETAIL_NORMALBLENDMETHOD=0}}class u extends h.n{_markAllSubMeshesAsTexturesDirty(){this._enable(this._isEnabled),this._internalMarkAllSubMeshesAsTexturesDirty()}constructor(e,t=!0){super(e,"DetailMap",140,new c,t),this._texture=null,this.diffuseBlendLevel=1,this.roughnessBlendLevel=1,this.bumpLevel=1,this._normalBlendMethod=s.F.MATERIAL_NORMALBLENDMETHOD_WHITEOUT,this._isEnabled=!1,this.isEnabled=!1,this._internalMarkAllSubMeshesAsTexturesDirty=e._dirtyCallbacks[1]}isReadyForSubMesh(e,t,i){return!this._isEnabled||!(e._areTexturesDirty&&t.texturesEnabled&&i.getCaps().standardDerivatives&&this._texture&&o.k.DetailTextureEnabled&&!this._texture.isReady())}prepareDefines(e,t){if(this._isEnabled){e.DETAIL_NORMALBLENDMETHOD=this._normalBlendMethod;const i=t.getEngine();e._areTexturesDirty&&(i.getCaps().standardDerivatives&&this._texture&&o.k.DetailTextureEnabled&&this._isEnabled?(a.G.PrepareDefinesForMergedUV(this._texture,e,"DETAIL"),e.DETAIL_NORMALBLENDMETHOD=this._normalBlendMethod):e.DETAIL=!1)}else e.DETAIL=!1}bindForSubMesh(e,t){if(!this._isEnabled)return;const i=this._material.isFrozen;e.useUbo&&i&&e.isSync||this._texture&&o.k.DetailTextureEnabled&&(e.updateFloat4("vDetailInfos",this._texture.coordinatesIndex,this.diffuseBlendLevel,this.bumpLevel,this.roughnessBlendLevel),a.G.BindTextureMatrix(this._texture,e,"detail")),t.texturesEnabled&&this._texture&&o.k.DetailTextureEnabled&&e.setTexture("detailSampler",this._texture)}hasTexture(e){return this._texture===e}getActiveTextures(e){this._texture&&e.push(this._texture)}getAnimatables(e){this._texture&&this._texture.animations&&this._texture.animations.length>0&&e.push(this._texture)}dispose(e){var t;e&&(null===(t=this._texture)||void 0===t||t.dispose())}getClassName(){return"DetailMapConfiguration"}getSamplers(e){e.push("detailSampler")}getUniforms(){return{ubo:[{name:"vDetailInfos",size:4,type:"vec4"},{name:"detailMatrix",size:16,type:"mat4"}]}}}(0,n.gn)([(0,r.oU)("detailTexture"),(0,r.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"texture",void 0),(0,n.gn)([(0,r.qC)()],u.prototype,"diffuseBlendLevel",void 0),(0,n.gn)([(0,r.qC)()],u.prototype,"roughnessBlendLevel",void 0),(0,n.gn)([(0,r.qC)()],u.prototype,"bumpLevel",void 0),(0,n.gn)([(0,r.qC)(),(0,r.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"normalBlendMethod",void 0),(0,n.gn)([(0,r.qC)(),(0,r.wz)("_markAllSubMeshesAsTexturesDirty")],u.prototype,"isEnabled",void 0)},7104:(e,t,i)=>{i.d(t,{F:()=>g});var n=i(9472),s=i(3956),r=i(7257),o=i(5757),a=i(1431),l=i(9401),h=i(3743),c=i(2722),u=i(142),d=i(5346),p=i(1345);class f{constructor(){this.reset()}reset(){this.enabled=!1,this.mask=255,this.func=519,this.funcRef=1,this.funcMask=255,this.opStencilFail=7680,this.opDepthFail=7680,this.opStencilDepthPass=7681}get func(){return this._func}set func(e){this._func=e}get funcRef(){return this._funcRef}set funcRef(e){this._funcRef=e}get funcMask(){return this._funcMask}set funcMask(e){this._funcMask=e}get opStencilFail(){return this._opStencilFail}set opStencilFail(e){this._opStencilFail=e}get opDepthFail(){return this._opDepthFail}set opDepthFail(e){this._opDepthFail=e}get opStencilDepthPass(){return this._opStencilDepthPass}set opStencilDepthPass(e){this._opStencilDepthPass=e}get mask(){return this._mask}set mask(e){this._mask=e}get enabled(){return this._enabled}set enabled(e){this._enabled=e}getClassName(){return"MaterialStencilState"}copyTo(e){s.p4.Clone((()=>e),this)}serialize(){return s.p4.Serialize(this)}parse(e,t,i){s.p4.Parse((()=>this),e,t,i)}}(0,n.gn)([(0,s.qC)()],f.prototype,"func",null),(0,n.gn)([(0,s.qC)()],f.prototype,"funcRef",null),(0,n.gn)([(0,s.qC)()],f.prototype,"funcMask",null),(0,n.gn)([(0,s.qC)()],f.prototype,"opStencilFail",null),(0,n.gn)([(0,s.qC)()],f.prototype,"opDepthFail",null),(0,n.gn)([(0,s.qC)()],f.prototype,"opStencilDepthPass",null),(0,n.gn)([(0,s.qC)()],f.prototype,"mask",null),(0,n.gn)([(0,s.qC)()],f.prototype,"enabled",null);var _=i(1057),m=i(1698);class g{get canRenderToMRT(){return!1}set alpha(e){if(this._alpha===e)return;const t=this._alpha;this._alpha=e,1!==t&&1!==e||this.markAsDirty(g.MiscDirtyFlag+g.PrePassDirtyFlag)}get alpha(){return this._alpha}set backFaceCulling(e){this._backFaceCulling!==e&&(this._backFaceCulling=e,this.markAsDirty(g.TextureDirtyFlag))}get backFaceCulling(){return this._backFaceCulling}set cullBackFaces(e){this._cullBackFaces!==e&&(this._cullBackFaces=e,this.markAsDirty(g.TextureDirtyFlag))}get cullBackFaces(){return this._cullBackFaces}get blockDirtyMechanism(){return this._blockDirtyMechanism}set blockDirtyMechanism(e){this._blockDirtyMechanism!==e&&(this._blockDirtyMechanism=e,e||this.markDirty())}atomicMaterialsUpdate(e){this.blockDirtyMechanism=!0;try{e(this)}finally{this.blockDirtyMechanism=!1}}get hasRenderTargetTextures(){return this._eventInfo.hasRenderTargetTextures=!1,this._callbackPluginEventHasRenderTargetTextures(this._eventInfo),this._eventInfo.hasRenderTargetTextures}set onDispose(e){this._onDisposeObserver&&this.onDisposeObservable.remove(this._onDisposeObserver),this._onDisposeObserver=this.onDisposeObservable.add(e)}get onBindObservable(){return this._onBindObservable||(this._onBindObservable=new o.y$),this._onBindObservable}set onBind(e){this._onBindObserver&&this.onBindObservable.remove(this._onBindObserver),this._onBindObserver=this.onBindObservable.add(e)}get onUnBindObservable(){return this._onUnBindObservable||(this._onUnBindObservable=new o.y$),this._onUnBindObservable}get onEffectCreatedObservable(){return this._onEffectCreatedObservable||(this._onEffectCreatedObservable=new o.y$),this._onEffectCreatedObservable}set alphaMode(e){this._alphaMode!==e&&(this._alphaMode=e,this.markAsDirty(g.TextureDirtyFlag))}get alphaMode(){return this._alphaMode}set needDepthPrePass(e){this._needDepthPrePass!==e&&(this._needDepthPrePass=e,this._needDepthPrePass&&(this.checkReadyOnEveryCall=!0))}get needDepthPrePass(){return this._needDepthPrePass}get isPrePassCapable(){return!1}set fogEnabled(e){this._fogEnabled!==e&&(this._fogEnabled=e,this.markAsDirty(g.MiscDirtyFlag))}get fogEnabled(){return this._fogEnabled}get wireframe(){switch(this._fillMode){case g.WireFrameFillMode:case g.LineListDrawMode:case g.LineLoopDrawMode:case g.LineStripDrawMode:return!0}return this._scene.forceWireframe}set wireframe(e){this.fillMode=e?g.WireFrameFillMode:g.TriangleFillMode}get pointsCloud(){switch(this._fillMode){case g.PointFillMode:case g.PointListDrawMode:return!0}return this._scene.forcePointsCloud}set pointsCloud(e){this.fillMode=e?g.PointFillMode:g.TriangleFillMode}get fillMode(){return this._fillMode}set fillMode(e){this._fillMode!==e&&(this._fillMode=e,this.markAsDirty(g.MiscDirtyFlag))}_getDrawWrapper(){return this._drawWrapper}_setDrawWrapper(e){this._drawWrapper=e}constructor(e,t,i){this.shadowDepthWrapper=null,this.allowShaderHotSwapping=!0,this.metadata=null,this.reservedDataStore=null,this.checkReadyOnEveryCall=!1,this.checkReadyOnlyOnce=!1,this.state="",this._alpha=1,this._backFaceCulling=!0,this._cullBackFaces=!0,this._blockDirtyMechanism=!1,this.onCompiled=null,this.onError=null,this.getRenderTargetTextures=null,this.doNotSerialize=!1,this._storeEffectOnSubMeshes=!1,this.animations=null,this.onDisposeObservable=new o.y$,this._onDisposeObserver=null,this._onUnBindObservable=null,this._onBindObserver=null,this._alphaMode=2,this._needDepthPrePass=!1,this.disableDepthWrite=!1,this.disableColorWrite=!1,this.forceDepthWrite=!1,this.depthFunction=0,this.separateCullingPass=!1,this._fogEnabled=!0,this.pointSize=1,this.zOffset=0,this.zOffsetUnits=0,this.stencil=new f,this._useUBO=!1,this._fillMode=g.TriangleFillMode,this._cachedDepthWriteState=!1,this._cachedColorWriteState=!1,this._cachedDepthFunctionState=0,this._indexInSceneMaterialArray=-1,this.meshMap=null,this._parentContainer=null,this._uniformBufferLayoutBuilt=!1,this._eventInfo={},this._callbackPluginEventGeneric=()=>{},this._callbackPluginEventIsReadyForSubMesh=()=>{},this._callbackPluginEventPrepareDefines=()=>{},this._callbackPluginEventPrepareDefinesBeforeAttributes=()=>{},this._callbackPluginEventHardBindForSubMesh=()=>{},this._callbackPluginEventBindForSubMesh=()=>{},this._callbackPluginEventHasRenderTargetTextures=()=>{},this._callbackPluginEventFillRenderTargetTextures=()=>{},this._forceAlphaTest=!1,this._transparencyMode=null,this.name=e;const n=t||a.l.LastCreatedScene;n&&(this._scene=n,this._dirtyCallbacks={},this._dirtyCallbacks[1]=this._markAllSubMeshesAsTexturesDirty.bind(this),this._dirtyCallbacks[2]=this._markAllSubMeshesAsLightsDirty.bind(this),this._dirtyCallbacks[4]=this._markAllSubMeshesAsFresnelDirty.bind(this),this._dirtyCallbacks[8]=this._markAllSubMeshesAsAttributesDirty.bind(this),this._dirtyCallbacks[16]=this._markAllSubMeshesAsMiscDirty.bind(this),this._dirtyCallbacks[32]=this._markAllSubMeshesAsPrePassDirty.bind(this),this._dirtyCallbacks[63]=this._markAllSubMeshesAsAllDirty.bind(this),this.id=e||r.w1.RandomId(),this.uniqueId=this._scene.getUniqueId(),this._materialContext=this._scene.getEngine().createMaterialContext(),this._drawWrapper=new p.q(this._scene.getEngine(),!1),this._drawWrapper.materialContext=this._materialContext,this._scene.useRightHandedSystem?this.sideOrientation=g.ClockWiseSideOrientation:this.sideOrientation=g.CounterClockWiseSideOrientation,this._uniformBuffer=new h.M(this._scene.getEngine(),void 0,void 0,e),this._useUBO=this.getScene().getEngine().supportsUniformBuffers,i||this._scene.addMaterial(this),this._scene.useMaterialMeshMap&&(this.meshMap={}),g.OnEventObservable.notifyObservers(this,m.S.Created))}toString(e){return"Name: "+this.name}getClassName(){return"Material"}get _isMaterial(){return!0}get isFrozen(){return this.checkReadyOnlyOnce}freeze(){this.markDirty(),this.checkReadyOnlyOnce=!0}unfreeze(){this.markDirty(),this.checkReadyOnlyOnce=!1}isReady(e,t){return!0}isReadyForSubMesh(e,t,i){const n=t.materialDefines;return!!n&&(this._eventInfo.isReadyForSubMesh=!0,this._eventInfo.defines=n,this._callbackPluginEventIsReadyForSubMesh(this._eventInfo),this._eventInfo.isReadyForSubMesh)}getEffect(){return this._drawWrapper.effect}getScene(){return this._scene}get transparencyMode(){return this._transparencyMode}set transparencyMode(e){this._transparencyMode!==e&&(this._transparencyMode=e,this._forceAlphaTest=e===g.MATERIAL_ALPHATESTANDBLEND,this._markAllSubMeshesAsTexturesAndMiscDirty())}get _disableAlphaBlending(){return this._transparencyMode===g.MATERIAL_OPAQUE||this._transparencyMode===g.MATERIAL_ALPHATEST}needAlphaBlending(){return!this._disableAlphaBlending&&this.alpha<1}needAlphaBlendingForMesh(e){return e.visibility<1||!this._disableAlphaBlending&&(e.hasVertexAlpha||this.needAlphaBlending())}needAlphaTesting(){return!!this._forceAlphaTest}_shouldTurnAlphaTestOn(e){return!this.needAlphaBlendingForMesh(e)&&this.needAlphaTesting()}getAlphaTestTexture(){return null}markDirty(e=!1){const t=this.getScene().meshes;for(const i of t)if(i.subMeshes)for(const t of i.subMeshes)t.getMaterial()===this&&t.effect&&(t.effect._wasPreviouslyReady=!1,t.effect._wasPreviouslyUsingInstances=null,t.effect._forceRebindOnNextCall=e);e&&this.markAsDirty(g.AllDirtyFlag)}_preBind(e,t=null){const i=this._scene.getEngine(),n=(null==t?this.sideOrientation:t)===g.ClockWiseSideOrientation;return i.enableEffect(e||this._getDrawWrapper()),i.setState(this.backFaceCulling,this.zOffset,!1,n,this._scene._mirroredCameraPosition?!this.cullBackFaces:this.cullBackFaces,this.stencil,this.zOffsetUnits),n}bind(e,t){}buildUniformLayout(){const e=this._uniformBuffer;this._eventInfo.ubo=e,this._callbackPluginEventGeneric(m.S.PrepareUniformBuffer,this._eventInfo),e.create(),this._uniformBufferLayoutBuilt=!0}bindForSubMesh(e,t,i){const n=i.effect;n&&(this._eventInfo.subMesh=i,this._callbackPluginEventBindForSubMesh(this._eventInfo),n._forceRebindOnNextCall=!1)}bindOnlyWorldMatrix(e){}bindView(e){this._useUBO?this._needToBindSceneUbo=!0:e.setMatrix("view",this.getScene().getViewMatrix())}bindViewProjection(e){this._useUBO?this._needToBindSceneUbo=!0:(e.setMatrix("viewProjection",this.getScene().getTransformMatrix()),e.setMatrix("projection",this.getScene().getProjectionMatrix()))}bindEyePosition(e,t){this._useUBO?this._needToBindSceneUbo=!0:this._scene.bindEyePosition(e,t)}_afterBind(e,t=null){if(this._scene._cachedMaterial=this,this._needToBindSceneUbo&&t&&(this._needToBindSceneUbo=!1,d.G.BindSceneUniformBuffer(t,this.getScene().getSceneUniformBuffer()),this._scene.finalizeSceneUbo()),this._scene._cachedVisibility=e?e.visibility:1,this._onBindObservable&&e&&this._onBindObservable.notifyObservers(e),this.disableDepthWrite){const e=this._scene.getEngine();this._cachedDepthWriteState=e.getDepthWrite(),e.setDepthWrite(!1)}if(this.disableColorWrite){const e=this._scene.getEngine();this._cachedColorWriteState=e.getColorWrite(),e.setColorWrite(!1)}if(0!==this.depthFunction){const e=this._scene.getEngine();this._cachedDepthFunctionState=e.getDepthFunction()||0,e.setDepthFunction(this.depthFunction)}}unbind(){this._onUnBindObservable&&this._onUnBindObservable.notifyObservers(this),0!==this.depthFunction&&this._scene.getEngine().setDepthFunction(this._cachedDepthFunctionState),this.disableDepthWrite&&this._scene.getEngine().setDepthWrite(this._cachedDepthWriteState),this.disableColorWrite&&this._scene.getEngine().setColorWrite(this._cachedColorWriteState)}getAnimatables(){return this._eventInfo.animatables=[],this._callbackPluginEventGeneric(m.S.GetAnimatables,this._eventInfo),this._eventInfo.animatables}getActiveTextures(){return this._eventInfo.activeTextures=[],this._callbackPluginEventGeneric(m.S.GetActiveTextures,this._eventInfo),this._eventInfo.activeTextures}hasTexture(e){return this._eventInfo.hasTexture=!1,this._eventInfo.texture=e,this._callbackPluginEventGeneric(m.S.HasTexture,this._eventInfo),this._eventInfo.hasTexture}clone(e){return null}getBindedMeshes(){if(this.meshMap){const e=new Array;for(const t in this.meshMap){const i=this.meshMap[t];i&&e.push(i)}return e}return this._scene.meshes.filter((e=>e.material===this))}forceCompilation(e,t,i,n){const s={clipPlane:!1,useInstances:!1,...i},r=this.getScene(),o=this.allowShaderHotSwapping;this.allowShaderHotSwapping=!1;const a=()=>{if(!this._scene||!this._scene.getEngine())return;const i=r.clipPlane;if(s.clipPlane&&(r.clipPlane=new u.J(0,0,0,1)),this._storeEffectOnSubMeshes){let i=!0,r=null;if(e.subMeshes){const t=new l.P(0,0,0,0,0,e,void 0,!1,!1);t.materialDefines&&(t.materialDefines._renderId=-1),this.isReadyForSubMesh(e,t,s.useInstances)||(t.effect&&t.effect.getCompilationError()&&t.effect.allFallbacksProcessed()?r=t.effect.getCompilationError():(i=!1,setTimeout(a,16)))}i&&(this.allowShaderHotSwapping=o,r&&n&&n(r),t&&t(this))}else this.isReady()?(this.allowShaderHotSwapping=o,t&&t(this)):setTimeout(a,16);s.clipPlane&&(r.clipPlane=i)};a()}forceCompilationAsync(e,t){return new Promise(((i,n)=>{this.forceCompilation(e,(()=>{i()}),t,(e=>{n(e)}))}))}markAsDirty(e){this.getScene().blockMaterialDirtyMechanism||this._blockDirtyMechanism||(g._DirtyCallbackArray.length=0,e&g.TextureDirtyFlag&&g._DirtyCallbackArray.push(g._TextureDirtyCallBack),e&g.LightDirtyFlag&&g._DirtyCallbackArray.push(g._LightsDirtyCallBack),e&g.FresnelDirtyFlag&&g._DirtyCallbackArray.push(g._FresnelDirtyCallBack),e&g.AttributesDirtyFlag&&g._DirtyCallbackArray.push(g._AttributeDirtyCallBack),e&g.MiscDirtyFlag&&g._DirtyCallbackArray.push(g._MiscDirtyCallBack),e&g.PrePassDirtyFlag&&g._DirtyCallbackArray.push(g._PrePassDirtyCallBack),g._DirtyCallbackArray.length&&this._markAllSubMeshesAsDirty(g._RunDirtyCallBacks),this.getScene().resetCachedMaterial())}resetDrawCache(){const e=this.getScene().meshes;for(const t of e)if(t.subMeshes)for(const e of t.subMeshes)e.getMaterial()===this&&e.resetDrawCache()}_markAllSubMeshesAsDirty(e){if(this.getScene().blockMaterialDirtyMechanism||this._blockDirtyMechanism)return;const t=this.getScene().meshes;for(const i of t)if(i.subMeshes)for(const t of i.subMeshes)if(t.getMaterial(!1)===this)for(const i of t._drawWrappers)i&&i.defines&&i.defines.markAllAsDirty&&this._materialContext===i.materialContext&&e(i.defines)}_markScenePrePassDirty(){if(this.getScene().blockMaterialDirtyMechanism||this._blockDirtyMechanism)return;const e=this.getScene().enablePrePassRenderer();e&&e.markAsDirty()}_markAllSubMeshesAsAllDirty(){this._markAllSubMeshesAsDirty(g._AllDirtyCallBack)}_markAllSubMeshesAsImageProcessingDirty(){this._markAllSubMeshesAsDirty(g._ImageProcessingDirtyCallBack)}_markAllSubMeshesAsTexturesDirty(){this._markAllSubMeshesAsDirty(g._TextureDirtyCallBack)}_markAllSubMeshesAsFresnelDirty(){this._markAllSubMeshesAsDirty(g._FresnelDirtyCallBack)}_markAllSubMeshesAsFresnelAndMiscDirty(){this._markAllSubMeshesAsDirty(g._FresnelAndMiscDirtyCallBack)}_markAllSubMeshesAsLightsDirty(){this._markAllSubMeshesAsDirty(g._LightsDirtyCallBack)}_markAllSubMeshesAsAttributesDirty(){this._markAllSubMeshesAsDirty(g._AttributeDirtyCallBack)}_markAllSubMeshesAsMiscDirty(){this._markAllSubMeshesAsDirty(g._MiscDirtyCallBack)}_markAllSubMeshesAsPrePassDirty(){this._markAllSubMeshesAsDirty(g._MiscDirtyCallBack)}_markAllSubMeshesAsTexturesAndMiscDirty(){this._markAllSubMeshesAsDirty(g._TextureAndMiscDirtyCallBack)}_checkScenePerformancePriority(){if(this._scene.performancePriority!==_.a.BackwardCompatible){this.checkReadyOnlyOnce=!0;const e=this._scene.onScenePerformancePriorityChangedObservable.addOnce((()=>{this.checkReadyOnlyOnce=!1}));this.onDisposeObservable.add((()=>{this._scene.onScenePerformancePriorityChangedObservable.remove(e)}))}}setPrePassRenderer(e){return!1}dispose(e,t,i){const n=this.getScene();if(n.stopAnimation(this),n.freeProcessedMaterials(),n.removeMaterial(this),this._eventInfo.forceDisposeTextures=t,this._callbackPluginEventGeneric(m.S.Disposed,this._eventInfo),this._parentContainer){const e=this._parentContainer.materials.indexOf(this);e>-1&&this._parentContainer.materials.splice(e,1),this._parentContainer=null}if(!0!==i)if(this.meshMap)for(const t in this.meshMap){const i=this.meshMap[t];i&&(i.material=null,this.releaseVertexArrayObject(i,e))}else{const t=n.meshes;for(const i of t)i.material!==this||i.sourceMesh||(i.material=null,this.releaseVertexArrayObject(i,e))}this._uniformBuffer.dispose(),e&&this._drawWrapper.effect&&(this._storeEffectOnSubMeshes||this._drawWrapper.effect.dispose(),this._drawWrapper.effect=null),this.metadata=null,this.onDisposeObservable.notifyObservers(this),this.onDisposeObservable.clear(),this._onBindObservable&&this._onBindObservable.clear(),this._onUnBindObservable&&this._onUnBindObservable.clear(),this._onEffectCreatedObservable&&this._onEffectCreatedObservable.clear(),this._eventInfo&&(this._eventInfo={})}releaseVertexArrayObject(e,t){if(e.geometry){const i=e.geometry;if(this._storeEffectOnSubMeshes)for(const n of e.subMeshes)i._releaseVertexArrayObject(n.effect),t&&n.effect&&n.effect.dispose();else i._releaseVertexArrayObject(this._drawWrapper.effect)}}serialize(){const e=s.p4.Serialize(this);return e.stencil=this.stencil.serialize(),e.uniqueId=this.uniqueId,e}static Parse(e,t,i){if(e.customType){if("BABYLON.PBRMaterial"===e.customType&&e.overloadedAlbedo&&(e.customType="BABYLON.LegacyPBRMaterial",!BABYLON.LegacyPBRMaterial))return c.Y.Error("Your scene is trying to load a legacy version of the PBRMaterial, please, include it from the materials library."),null}else e.customType="BABYLON.StandardMaterial";const n=r.w1.Instantiate(e.customType).Parse(e,t,i);return n._loadedUniqueId=e.uniqueId,n}}g.TriangleFillMode=0,g.WireFrameFillMode=1,g.PointFillMode=2,g.PointListDrawMode=3,g.LineListDrawMode=4,g.LineLoopDrawMode=5,g.LineStripDrawMode=6,g.TriangleStripDrawMode=7,g.TriangleFanDrawMode=8,g.ClockWiseSideOrientation=0,g.CounterClockWiseSideOrientation=1,g.TextureDirtyFlag=1,g.LightDirtyFlag=2,g.FresnelDirtyFlag=4,g.AttributesDirtyFlag=8,g.MiscDirtyFlag=16,g.PrePassDirtyFlag=32,g.AllDirtyFlag=63,g.MATERIAL_OPAQUE=0,g.MATERIAL_ALPHATEST=1,g.MATERIAL_ALPHABLEND=2,g.MATERIAL_ALPHATESTANDBLEND=3,g.MATERIAL_NORMALBLENDMETHOD_WHITEOUT=0,g.MATERIAL_NORMALBLENDMETHOD_RNM=1,g.OnEventObservable=new o.y$,a.l.OnEnginesDisposedObservable.addOnce((()=>{g.OnEventObservable.clear()})),g._AllDirtyCallBack=e=>e.markAllAsDirty(),g._ImageProcessingDirtyCallBack=e=>e.markAsImageProcessingDirty(),g._TextureDirtyCallBack=e=>e.markAsTexturesDirty(),g._FresnelDirtyCallBack=e=>e.markAsFresnelDirty(),g._MiscDirtyCallBack=e=>e.markAsMiscDirty(),g._PrePassDirtyCallBack=e=>e.markAsPrePassDirty(),g._LightsDirtyCallBack=e=>e.markAsLightDirty(),g._AttributeDirtyCallBack=e=>e.markAsAttributesDirty(),g._FresnelAndMiscDirtyCallBack=e=>{g._FresnelDirtyCallBack(e),g._MiscDirtyCallBack(e)},g._TextureAndMiscDirtyCallBack=e=>{g._TextureDirtyCallBack(e),g._MiscDirtyCallBack(e)},g._DirtyCallbackArray=[],g._RunDirtyCallBacks=e=>{for(const t of g._DirtyCallbackArray)t(e)},(0,n.gn)([(0,s.qC)()],g.prototype,"id",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"uniqueId",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"name",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"metadata",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"checkReadyOnEveryCall",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"checkReadyOnlyOnce",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"state",void 0),(0,n.gn)([(0,s.qC)("alpha")],g.prototype,"_alpha",void 0),(0,n.gn)([(0,s.qC)("backFaceCulling")],g.prototype,"_backFaceCulling",void 0),(0,n.gn)([(0,s.qC)("cullBackFaces")],g.prototype,"_cullBackFaces",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"sideOrientation",void 0),(0,n.gn)([(0,s.qC)("alphaMode")],g.prototype,"_alphaMode",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"_needDepthPrePass",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"disableDepthWrite",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"disableColorWrite",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"forceDepthWrite",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"depthFunction",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"separateCullingPass",void 0),(0,n.gn)([(0,s.qC)("fogEnabled")],g.prototype,"_fogEnabled",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"pointSize",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"zOffset",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"zOffsetUnits",void 0),(0,n.gn)([(0,s.qC)()],g.prototype,"pointsCloud",null),(0,n.gn)([(0,s.qC)()],g.prototype,"fillMode",null),(0,n.gn)([(0,s.qC)()],g.prototype,"transparencyMode",null)},1917:(e,t,i)=>{i.d(t,{H:()=>n});class n{constructor(e){if(this._keys=[],this._isDirty=!0,this._areLightsDirty=!0,this._areLightsDisposed=!1,this._areAttributesDirty=!0,this._areTexturesDirty=!0,this._areFresnelDirty=!0,this._areMiscDirty=!0,this._arePrePassDirty=!0,this._areImageProcessingDirty=!0,this._normals=!1,this._uvs=!1,this._needNormals=!1,this._needUVs=!1,this._externalProperties=e,e)for(const t in e)Object.prototype.hasOwnProperty.call(e,t)&&this._setDefaultValue(t)}get isDirty(){return this._isDirty}markAsProcessed(){this._isDirty=!1,this._areAttributesDirty=!1,this._areTexturesDirty=!1,this._areFresnelDirty=!1,this._areLightsDirty=!1,this._areLightsDisposed=!1,this._areMiscDirty=!1,this._arePrePassDirty=!1,this._areImageProcessingDirty=!1}markAsUnprocessed(){this._isDirty=!0}markAllAsDirty(){this._areTexturesDirty=!0,this._areAttributesDirty=!0,this._areLightsDirty=!0,this._areFresnelDirty=!0,this._areMiscDirty=!0,this._areImageProcessingDirty=!0,this._isDirty=!0}markAsImageProcessingDirty(){this._areImageProcessingDirty=!0,this._isDirty=!0}markAsLightDirty(e=!1){this._areLightsDirty=!0,this._areLightsDisposed=this._areLightsDisposed||e,this._isDirty=!0}markAsAttributesDirty(){this._areAttributesDirty=!0,this._isDirty=!0}markAsTexturesDirty(){this._areTexturesDirty=!0,this._isDirty=!0}markAsFresnelDirty(){this._areFresnelDirty=!0,this._isDirty=!0}markAsMiscDirty(){this._areMiscDirty=!0,this._isDirty=!0}markAsPrePassDirty(){this._arePrePassDirty=!0,this._isDirty=!0}rebuild(){this._keys.length=0;for(const e of Object.keys(this))"_"!==e[0]&&this._keys.push(e);if(this._externalProperties)for(const e in this._externalProperties)-1===this._keys.indexOf(e)&&this._keys.push(e)}isEqual(e){if(this._keys.length!==e._keys.length)return!1;for(let t=0;t<this._keys.length;t++){const i=this._keys[t];if(this[i]!==e[i])return!1}return!0}cloneTo(e){this._keys.length!==e._keys.length&&(e._keys=this._keys.slice(0));for(let t=0;t<this._keys.length;t++){const i=this._keys[t];e[i]=this[i]}}reset(){this._keys.forEach((e=>this._setDefaultValue(e)))}_setDefaultValue(e){var t,i,n,s,r;const o=null!==(n=null===(i=null===(t=this._externalProperties)||void 0===t?void 0:t[e])||void 0===i?void 0:i.type)&&void 0!==n?n:typeof this[e],a=null===(r=null===(s=this._externalProperties)||void 0===s?void 0:s[e])||void 0===r?void 0:r.default;switch(o){case"number":this[e]=null!=a?a:0;break;case"string":this[e]=null!=a?a:"";break;default:this[e]=null!=a&&a}}toString(){let e="";for(let t=0;t<this._keys.length;t++){const i=this._keys[t],n=this[i];switch(typeof n){case"number":case"string":e+="#define "+i+" "+n+"\n";break;default:n&&(e+="#define "+i+"\n")}}return e}}},85:(e,t,i)=>{i.d(t,{k:()=>s});var n=i(7814);class s{static get DiffuseTextureEnabled(){return this._DiffuseTextureEnabled}static set DiffuseTextureEnabled(e){this._DiffuseTextureEnabled!==e&&(this._DiffuseTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get DetailTextureEnabled(){return this._DetailTextureEnabled}static set DetailTextureEnabled(e){this._DetailTextureEnabled!==e&&(this._DetailTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get DecalMapEnabled(){return this._DecalMapEnabled}static set DecalMapEnabled(e){this._DecalMapEnabled!==e&&(this._DecalMapEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get AmbientTextureEnabled(){return this._AmbientTextureEnabled}static set AmbientTextureEnabled(e){this._AmbientTextureEnabled!==e&&(this._AmbientTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get OpacityTextureEnabled(){return this._OpacityTextureEnabled}static set OpacityTextureEnabled(e){this._OpacityTextureEnabled!==e&&(this._OpacityTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get ReflectionTextureEnabled(){return this._ReflectionTextureEnabled}static set ReflectionTextureEnabled(e){this._ReflectionTextureEnabled!==e&&(this._ReflectionTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get EmissiveTextureEnabled(){return this._EmissiveTextureEnabled}static set EmissiveTextureEnabled(e){this._EmissiveTextureEnabled!==e&&(this._EmissiveTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get SpecularTextureEnabled(){return this._SpecularTextureEnabled}static set SpecularTextureEnabled(e){this._SpecularTextureEnabled!==e&&(this._SpecularTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get BumpTextureEnabled(){return this._BumpTextureEnabled}static set BumpTextureEnabled(e){this._BumpTextureEnabled!==e&&(this._BumpTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get LightmapTextureEnabled(){return this._LightmapTextureEnabled}static set LightmapTextureEnabled(e){this._LightmapTextureEnabled!==e&&(this._LightmapTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get RefractionTextureEnabled(){return this._RefractionTextureEnabled}static set RefractionTextureEnabled(e){this._RefractionTextureEnabled!==e&&(this._RefractionTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get ColorGradingTextureEnabled(){return this._ColorGradingTextureEnabled}static set ColorGradingTextureEnabled(e){this._ColorGradingTextureEnabled!==e&&(this._ColorGradingTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get FresnelEnabled(){return this._FresnelEnabled}static set FresnelEnabled(e){this._FresnelEnabled!==e&&(this._FresnelEnabled=e,n.D.MarkAllMaterialsAsDirty(4))}static get ClearCoatTextureEnabled(){return this._ClearCoatTextureEnabled}static set ClearCoatTextureEnabled(e){this._ClearCoatTextureEnabled!==e&&(this._ClearCoatTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get ClearCoatBumpTextureEnabled(){return this._ClearCoatBumpTextureEnabled}static set ClearCoatBumpTextureEnabled(e){this._ClearCoatBumpTextureEnabled!==e&&(this._ClearCoatBumpTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get ClearCoatTintTextureEnabled(){return this._ClearCoatTintTextureEnabled}static set ClearCoatTintTextureEnabled(e){this._ClearCoatTintTextureEnabled!==e&&(this._ClearCoatTintTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get SheenTextureEnabled(){return this._SheenTextureEnabled}static set SheenTextureEnabled(e){this._SheenTextureEnabled!==e&&(this._SheenTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get AnisotropicTextureEnabled(){return this._AnisotropicTextureEnabled}static set AnisotropicTextureEnabled(e){this._AnisotropicTextureEnabled!==e&&(this._AnisotropicTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get ThicknessTextureEnabled(){return this._ThicknessTextureEnabled}static set ThicknessTextureEnabled(e){this._ThicknessTextureEnabled!==e&&(this._ThicknessTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get RefractionIntensityTextureEnabled(){return this._ThicknessTextureEnabled}static set RefractionIntensityTextureEnabled(e){this._RefractionIntensityTextureEnabled!==e&&(this._RefractionIntensityTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get TranslucencyIntensityTextureEnabled(){return this._ThicknessTextureEnabled}static set TranslucencyIntensityTextureEnabled(e){this._TranslucencyIntensityTextureEnabled!==e&&(this._TranslucencyIntensityTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}static get IridescenceTextureEnabled(){return this._IridescenceTextureEnabled}static set IridescenceTextureEnabled(e){this._IridescenceTextureEnabled!==e&&(this._IridescenceTextureEnabled=e,n.D.MarkAllMaterialsAsDirty(1))}}s._DiffuseTextureEnabled=!0,s._DetailTextureEnabled=!0,s._DecalMapEnabled=!0,s._AmbientTextureEnabled=!0,s._OpacityTextureEnabled=!0,s._ReflectionTextureEnabled=!0,s._EmissiveTextureEnabled=!0,s._SpecularTextureEnabled=!0,s._BumpTextureEnabled=!0,s._LightmapTextureEnabled=!0,s._RefractionTextureEnabled=!0,s._ColorGradingTextureEnabled=!0,s._FresnelEnabled=!0,s._ClearCoatTextureEnabled=!0,s._ClearCoatBumpTextureEnabled=!0,s._ClearCoatTintTextureEnabled=!0,s._SheenTextureEnabled=!0,s._AnisotropicTextureEnabled=!0,s._ThicknessTextureEnabled=!0,s._RefractionIntensityTextureEnabled=!0,s._TranslucencyIntensityTextureEnabled=!0,s._IridescenceTextureEnabled=!0},5346:(e,t,i)=>{i.d(t,{G:()=>u});var n=i(2722),s=i(2704),r=i(1057),o=i(1431),a=i(708),l=i(4185),h=i(4649),c=i(99);class u{static BindSceneUniformBuffer(e,t){t.bindToEffect(e,"Scene")}static PrepareDefinesForMergedUV(e,t,i){t._needUVs=!0,t[i]=!0,e.optimizeUVAllocation&&e.getTextureMatrix().isIdentityAs3x2()?(t[i+"DIRECTUV"]=e.coordinatesIndex+1,t["MAINUV"+(e.coordinatesIndex+1)]=!0):t[i+"DIRECTUV"]=0}static BindTextureMatrix(e,t,i){const n=e.getTextureMatrix();t.updateMatrix(i+"Matrix",n)}static GetFogState(e,t){return t.fogEnabled&&e.applyFog&&t.fogMode!==r.x.FOGMODE_NONE}static PrepareDefinesForMisc(e,t,i,n,s,r,o){o._areMiscDirty&&(o.LOGARITHMICDEPTH=i,o.POINTSIZE=n,o.FOG=s&&this.GetFogState(e,t),o.NONUNIFORMSCALING=e.nonUniformScaling,o.ALPHATEST=r)}static PrepareDefinesForCamera(e,t){let i=!1;if(e.activeCamera){const n=t.CAMERA_ORTHOGRAPHIC?1:0,r=t.CAMERA_PERSPECTIVE?1:0,o=e.activeCamera.mode===s.V.ORTHOGRAPHIC_CAMERA?1:0,a=e.activeCamera.mode===s.V.PERSPECTIVE_CAMERA?1:0;(n^o||r^a)&&(t.CAMERA_ORTHOGRAPHIC=1===o,t.CAMERA_PERSPECTIVE=1===a,i=!0)}return i}static PrepareDefinesForFrameBoundValues(e,t,i,n,s,r=null,o=!1){let a=u.PrepareDefinesForCamera(e,n);!1!==r&&(a=(0,c.AN)(i,e,n)),n.DEPTHPREPASS!==!t.getColorWrite()&&(n.DEPTHPREPASS=!n.DEPTHPREPASS,a=!0),n.INSTANCES!==s&&(n.INSTANCES=s,a=!0),n.THIN_INSTANCES!==o&&(n.THIN_INSTANCES=o,a=!0),a&&n.markAsUnprocessed()}static PrepareDefinesForBones(e,t){if(e.useBones&&e.computeBonesUsingShaders&&e.skeleton){t.NUM_BONE_INFLUENCERS=e.numBoneInfluencers;const i=void 0!==t.BONETEXTURE;if(e.skeleton.isUsingTextureForMatrices&&i)t.BONETEXTURE=!0;else{t.BonesPerMesh=e.skeleton.bones.length+1,t.BONETEXTURE=!i&&void 0;const n=e.getScene().prePassRenderer;if(n&&n.enabled){const i=-1===n.excludedSkinnedMesh.indexOf(e);t.BONES_VELOCITY_ENABLED=i}}}else t.NUM_BONE_INFLUENCERS=0,t.BonesPerMesh=0,void 0!==t.BONETEXTURE&&(t.BONETEXTURE=!1)}static PrepareDefinesForMorphTargets(e,t){const i=e.morphTargetManager;i?(t.MORPHTARGETS_UV=i.supportsUVs&&t.UV1,t.MORPHTARGETS_TANGENT=i.supportsTangents&&t.TANGENT,t.MORPHTARGETS_NORMAL=i.supportsNormals&&t.NORMAL,t.MORPHTARGETS=i.numInfluencers>0,t.NUM_MORPH_INFLUENCERS=i.numInfluencers,t.MORPHTARGETS_TEXTURE=i.isUsingTextureForTargets):(t.MORPHTARGETS_UV=!1,t.MORPHTARGETS_TANGENT=!1,t.MORPHTARGETS_NORMAL=!1,t.MORPHTARGETS=!1,t.NUM_MORPH_INFLUENCERS=0)}static PrepareDefinesForBakedVertexAnimation(e,t){const i=e.bakedVertexAnimationManager;t.BAKED_VERTEX_ANIMATION_TEXTURE=!(!i||!i.isEnabled)}static PrepareDefinesForAttributes(e,t,i,n,s=!1,r=!0,o=!0){if(!t._areAttributesDirty&&t._needNormals===t._normals&&t._needUVs===t._uvs)return!1;t._normals=t._needNormals,t._uvs=t._needUVs,t.NORMAL=t._needNormals&&e.isVerticesDataPresent(a.o.NormalKind),t._needNormals&&e.isVerticesDataPresent(a.o.TangentKind)&&(t.TANGENT=!0);for(let i=1;i<=6;++i)t["UV"+i]=!!t._needUVs&&e.isVerticesDataPresent(`uv${1===i?"":i}`);if(i){const i=e.useVertexColors&&e.isVerticesDataPresent(a.o.ColorKind);t.VERTEXCOLOR=i,t.VERTEXALPHA=e.hasVertexAlpha&&i&&r}return e.isVerticesDataPresent(a.o.ColorInstanceKind)&&(e.hasInstances||e.hasThinInstances)&&(t.INSTANCESCOLOR=!0),n&&this.PrepareDefinesForBones(e,t),s&&this.PrepareDefinesForMorphTargets(e,t),o&&this.PrepareDefinesForBakedVertexAnimation(e,t),!0}static PrepareDefinesForMultiview(e,t){if(e.activeCamera){const i=t.MULTIVIEW;t.MULTIVIEW=null!==e.activeCamera.outputRenderTarget&&e.activeCamera.outputRenderTarget.getViewCount()>1,t.MULTIVIEW!=i&&t.markAsUnprocessed()}}static PrepareDefinesForOIT(e,t,i){const n=t.ORDER_INDEPENDENT_TRANSPARENCY,s=t.ORDER_INDEPENDENT_TRANSPARENCY_16BITS;t.ORDER_INDEPENDENT_TRANSPARENCY=e.useOrderIndependentTransparency&&i,t.ORDER_INDEPENDENT_TRANSPARENCY_16BITS=!e.getEngine().getCaps().textureFloatLinearFiltering,n===t.ORDER_INDEPENDENT_TRANSPARENCY&&s===t.ORDER_INDEPENDENT_TRANSPARENCY_16BITS||t.markAsUnprocessed()}static PrepareDefinesForPrePass(e,t,i){const n=t.PREPASS;if(!t._arePrePassDirty)return;const s=[{type:1,define:"PREPASS_POSITION",index:"PREPASS_POSITION_INDEX"},{type:2,define:"PREPASS_VELOCITY",index:"PREPASS_VELOCITY_INDEX"},{type:3,define:"PREPASS_REFLECTIVITY",index:"PREPASS_REFLECTIVITY_INDEX"},{type:0,define:"PREPASS_IRRADIANCE",index:"PREPASS_IRRADIANCE_INDEX"},{type:7,define:"PREPASS_ALBEDO_SQRT",index:"PREPASS_ALBEDO_SQRT_INDEX"},{type:5,define:"PREPASS_DEPTH",index:"PREPASS_DEPTH_INDEX"},{type:6,define:"PREPASS_NORMAL",index:"PREPASS_NORMAL_INDEX"}];if(e.prePassRenderer&&e.prePassRenderer.enabled&&i){t.PREPASS=!0,t.SCENE_MRT_COUNT=e.prePassRenderer.mrtCount;for(let i=0;i<s.length;i++){const n=e.prePassRenderer.getIndex(s[i].type);-1!==n?(t[s[i].define]=!0,t[s[i].index]=n):t[s[i].define]=!1}}else{t.PREPASS=!1;for(let e=0;e<s.length;e++)t[s[e].define]=!1}t.PREPASS!=n&&(t.markAsUnprocessed(),t.markAsImageProcessingDirty())}static PrepareDefinesForLight(e,t,i,n,s,r,o){var a;switch(o.needNormals=!0,void 0===s["LIGHT"+n]&&(o.needRebuild=!0),s["LIGHT"+n]=!0,s["SPOTLIGHT"+n]=!1,s["HEMILIGHT"+n]=!1,s["POINTLIGHT"+n]=!1,s["DIRLIGHT"+n]=!1,i.prepareLightSpecificDefines(s,n),s["LIGHT_FALLOFF_PHYSICAL"+n]=!1,s["LIGHT_FALLOFF_GLTF"+n]=!1,s["LIGHT_FALLOFF_STANDARD"+n]=!1,i.falloffType){case l.m.FALLOFF_GLTF:s["LIGHT_FALLOFF_GLTF"+n]=!0;break;case l.m.FALLOFF_PHYSICAL:s["LIGHT_FALLOFF_PHYSICAL"+n]=!0;break;case l.m.FALLOFF_STANDARD:s["LIGHT_FALLOFF_STANDARD"+n]=!0}if(r&&!i.specular.equalsFloats(0,0,0)&&(o.specularEnabled=!0),s["SHADOW"+n]=!1,s["SHADOWCSM"+n]=!1,s["SHADOWCSMDEBUG"+n]=!1,s["SHADOWCSMNUM_CASCADES"+n]=!1,s["SHADOWCSMUSESHADOWMAXZ"+n]=!1,s["SHADOWCSMNOBLEND"+n]=!1,s["SHADOWCSM_RIGHTHANDED"+n]=!1,s["SHADOWPCF"+n]=!1,s["SHADOWPCSS"+n]=!1,s["SHADOWPOISSON"+n]=!1,s["SHADOWESM"+n]=!1,s["SHADOWCLOSEESM"+n]=!1,s["SHADOWCUBE"+n]=!1,s["SHADOWLOWQUALITY"+n]=!1,s["SHADOWMEDIUMQUALITY"+n]=!1,t&&t.receiveShadows&&e.shadowsEnabled&&i.shadowEnabled){const t=null!==(a=i.getShadowGenerator(e.activeCamera))&&void 0!==a?a:i.getShadowGenerator();if(t){const e=t.getShadowMap();e&&e.renderList&&e.renderList.length>0&&(o.shadowEnabled=!0,t.prepareDefines(s,n))}}i.lightmapMode!=l.m.LIGHTMAP_DEFAULT?(o.lightmapMode=!0,s["LIGHTMAPEXCLUDED"+n]=!0,s["LIGHTMAPNOSPECULAR"+n]=i.lightmapMode==l.m.LIGHTMAP_SHADOWSONLY):(s["LIGHTMAPEXCLUDED"+n]=!1,s["LIGHTMAPNOSPECULAR"+n]=!1)}static PrepareDefinesForLights(e,t,i,n,s=4,r=!1){if(!i._areLightsDirty)return i._needNormals;let o=0;const a={needNormals:i._needNormals,needRebuild:!1,lightmapMode:!1,shadowEnabled:!1,specularEnabled:!1};if(e.lightsEnabled&&!r)for(const r of t.lightSources)if(this.PrepareDefinesForLight(e,t,r,o,i,n,a),o++,o===s)break;i.SPECULARTERM=a.specularEnabled,i.SHADOWS=a.shadowEnabled;for(let e=o;e<s;e++)void 0!==i["LIGHT"+e]&&(i["LIGHT"+e]=!1,i["HEMILIGHT"+e]=!1,i["POINTLIGHT"+e]=!1,i["DIRLIGHT"+e]=!1,i["SPOTLIGHT"+e]=!1,i["SHADOW"+e]=!1,i["SHADOWCSM"+e]=!1,i["SHADOWCSMDEBUG"+e]=!1,i["SHADOWCSMNUM_CASCADES"+e]=!1,i["SHADOWCSMUSESHADOWMAXZ"+e]=!1,i["SHADOWCSMNOBLEND"+e]=!1,i["SHADOWCSM_RIGHTHANDED"+e]=!1,i["SHADOWPCF"+e]=!1,i["SHADOWPCSS"+e]=!1,i["SHADOWPOISSON"+e]=!1,i["SHADOWESM"+e]=!1,i["SHADOWCLOSEESM"+e]=!1,i["SHADOWCUBE"+e]=!1,i["SHADOWLOWQUALITY"+e]=!1,i["SHADOWMEDIUMQUALITY"+e]=!1);const l=e.getEngine().getCaps();return void 0===i.SHADOWFLOAT&&(a.needRebuild=!0),i.SHADOWFLOAT=a.shadowEnabled&&(l.textureFloatRender&&l.textureFloatLinearFiltering||l.textureHalfFloatRender&&l.textureHalfFloatLinearFiltering),i.LIGHTMAPEXCLUDED=a.lightmapMode,a.needRebuild&&i.rebuild(),a.needNormals}static PrepareUniformsAndSamplersForLight(e,t,i,n,s=null,r=!1){s&&s.push("Light"+e),r||(t.push("vLightData"+e,"vLightDiffuse"+e,"vLightSpecular"+e,"vLightDirection"+e,"vLightFalloff"+e,"vLightGround"+e,"lightMatrix"+e,"shadowsInfo"+e,"depthValues"+e),i.push("shadowSampler"+e),i.push("depthSampler"+e),t.push("viewFrustumZ"+e,"cascadeBlendFactor"+e,"lightSizeUVCorrection"+e,"depthCorrection"+e,"penumbraDarkness"+e,"frustumLengths"+e),n&&(i.push("projectionLightSampler"+e),t.push("textureProjectionMatrix"+e)))}static PrepareUniformsAndSamplersList(e,t,i,n=4){let s,r=null;if(e.uniformsNames){const o=e;s=o.uniformsNames,r=o.uniformBuffersNames,t=o.samplers,i=o.defines,n=o.maxSimultaneousLights||0}else s=e,t||(t=[]);for(let e=0;e<n&&i["LIGHT"+e];e++)this.PrepareUniformsAndSamplersForLight(e,s,t,i["PROJECTEDLIGHTTEXTURE"+e],r);i.NUM_MORPH_INFLUENCERS&&s.push("morphTargetInfluences"),i.BAKED_VERTEX_ANIMATION_TEXTURE&&(s.push("bakedVertexAnimationSettings"),s.push("bakedVertexAnimationTextureSizeInverted"),s.push("bakedVertexAnimationTime"),t.push("bakedVertexAnimationTexture"))}static HandleFallbacksForShadows(e,t,i=4,n=0){let s=0;for(let r=0;r<i&&e["LIGHT"+r];r++)r>0&&(s=n+r,t.addFallback(s,"LIGHT"+r)),e.SHADOWS||(e["SHADOW"+r]&&t.addFallback(n,"SHADOW"+r),e["SHADOWPCF"+r]&&t.addFallback(n,"SHADOWPCF"+r),e["SHADOWPCSS"+r]&&t.addFallback(n,"SHADOWPCSS"+r),e["SHADOWPOISSON"+r]&&t.addFallback(n,"SHADOWPOISSON"+r),e["SHADOWESM"+r]&&t.addFallback(n,"SHADOWESM"+r),e["SHADOWCLOSEESM"+r]&&t.addFallback(n,"SHADOWCLOSEESM"+r));return s++}static PrepareAttributesForMorphTargetsInfluencers(e,t,i){this._TmpMorphInfluencers.NUM_MORPH_INFLUENCERS=i,this.PrepareAttributesForMorphTargets(e,t,this._TmpMorphInfluencers)}static PrepareAttributesForMorphTargets(e,t,i){const s=i.NUM_MORPH_INFLUENCERS;if(s>0&&o.l.LastCreatedEngine){const r=o.l.LastCreatedEngine.getCaps().maxVertexAttribs,l=t.morphTargetManager;if(null==l?void 0:l.isUsingTextureForTargets)return;const h=l&&l.supportsNormals&&i.NORMAL,c=l&&l.supportsTangents&&i.TANGENT,u=l&&l.supportsUVs&&i.UV1;for(let i=0;i<s;i++)e.push(a.o.PositionKind+i),h&&e.push(a.o.NormalKind+i),c&&e.push(a.o.TangentKind+i),u&&e.push(a.o.UVKind+"_"+i),e.length>r&&n.Y.Error("Cannot add more vertex attributes for mesh "+t.name)}}static PrepareAttributesForBakedVertexAnimation(e,t,i){i.BAKED_VERTEX_ANIMATION_TEXTURE&&i.INSTANCES&&e.push("bakedVertexAnimationSettingsInstanced")}static PrepareAttributesForBones(e,t,i,n){i.NUM_BONE_INFLUENCERS>0&&(n.addCPUSkinningFallback(0,t),e.push(a.o.MatricesIndicesKind),e.push(a.o.MatricesWeightsKind),i.NUM_BONE_INFLUENCERS>4&&(e.push(a.o.MatricesIndicesExtraKind),e.push(a.o.MatricesWeightsExtraKind)))}static PrepareAttributesForInstances(e,t){(t.INSTANCES||t.THIN_INSTANCES)&&this.PushAttributesForInstances(e,!!t.PREPASS_VELOCITY),t.INSTANCESCOLOR&&e.push(a.o.ColorInstanceKind)}static PushAttributesForInstances(e,t=!1){e.push("world0"),e.push("world1"),e.push("world2"),e.push("world3"),t&&(e.push("previousWorld0"),e.push("previousWorld1"),e.push("previousWorld2"),e.push("previousWorld3"))}static BindLightProperties(e,t,i){e.transferToEffect(t,i+"")}static BindLight(e,t,i,n,s,r=!0){e._bindLight(t,i,n,s,r)}static BindLights(e,t,i,n,s=4){const r=Math.min(t.lightSources.length,s);for(let s=0;s<r;s++){const r=t.lightSources[s];this.BindLight(r,s,e,i,"boolean"==typeof n?n:n.SPECULARTERM,t.receiveShadows)}}static BindFogParameters(e,t,i,n=!1){e.fogEnabled&&t.applyFog&&e.fogMode!==r.x.FOGMODE_NONE&&(i.setFloat4("vFogInfos",e.fogMode,e.fogStart,e.fogEnd,e.fogDensity),n?(e.fogColor.toLinearSpaceToRef(this._TempFogColor,e.getEngine().useExactSrgbConversions),i.setColor3("vFogColor",this._TempFogColor)):i.setColor3("vFogColor",e.fogColor))}static BindBonesParameters(e,t,i){if(t&&e&&(e.computeBonesUsingShaders&&t._bonesComputationForcedToCPU&&(e.computeBonesUsingShaders=!1),e.useBones&&e.computeBonesUsingShaders&&e.skeleton)){const n=e.skeleton;if(n.isUsingTextureForMatrices&&t.getUniformIndex("boneTextureWidth")>-1){const i=n.getTransformMatrixTexture(e);t.setTexture("boneSampler",i),t.setFloat("boneTextureWidth",4*(n.bones.length+1))}else{const s=n.getTransformMatrices(e);s&&(t.setMatrices("mBones",s),i&&e.getScene().prePassRenderer&&e.getScene().prePassRenderer.getIndex(2)&&(i.previousBones[e.uniqueId]||(i.previousBones[e.uniqueId]=s.slice()),t.setMatrices("mPreviousBones",i.previousBones[e.uniqueId]),u._CopyBonesTransformationMatrices(s,i.previousBones[e.uniqueId])))}}}static _CopyBonesTransformationMatrices(e,t){return t.set(e),t}static BindMorphTargetParameters(e,t){const i=e.morphTargetManager;e&&i&&t.setFloatArray("morphTargetInfluences",i.influences)}static BindLogDepth(e,t,i){if(!e||e.LOGARITHMICDEPTH||e.indexOf&&e.indexOf("LOGARITHMICDEPTH")>=0){const e=i.activeCamera;e.mode===s.V.ORTHOGRAPHIC_CAMERA&&n.Y.Error("Logarithmic depth is not compatible with orthographic cameras!",20),t.setFloat("logarithmicDepthConstant",2/(Math.log(e.maxZ+1)/Math.LN2))}}}u._TmpMorphInfluencers={NUM_MORPH_INFLUENCERS:0},u._TempFogColor=h.Wo.Black()},8449:(e,t,i)=>{i.d(t,{n:()=>o});var n=i(9472),s=i(3956),r=i(9249);class o{_enable(e){e&&this._pluginManager._activatePlugin(this)}constructor(e,t,i,n,s=!0,o=!1){this.priority=500,this.registerForExtraEvents=!1,this._material=e,this.name=t,this.priority=i,e.pluginManager||(e.pluginManager=new r.BK(e),e.onDisposeObservable.add((()=>{e.pluginManager=void 0}))),this._pluginDefineNames=n,this._pluginManager=e.pluginManager,s&&this._pluginManager._addPlugin(this),o&&this._enable(!0),this.markAllDefinesAsDirty=e._dirtyCallbacks[63]}getClassName(){return"MaterialPluginBase"}isReadyForSubMesh(e,t,i,n){return!0}hardBindForSubMesh(e,t,i,n){}bindForSubMesh(e,t,i,n){}dispose(e){}getCustomCode(e){return null}collectDefines(e){if(this._pluginDefineNames)for(const t of Object.keys(this._pluginDefineNames)){if("_"===t[0])continue;const i=typeof this._pluginDefineNames[t];e[t]={type:"number"===i?"number":"string"===i?"string":"boolean"===i?"boolean":"object",default:this._pluginDefineNames[t]}}}prepareDefinesBeforeAttributes(e,t,i){}prepareDefines(e,t,i){}hasTexture(e){return!1}hasRenderTargetTextures(){return!1}fillRenderTargetTextures(e){}getActiveTextures(e){}getAnimatables(e){}addFallbacks(e,t,i){return i}getSamplers(e){}getAttributes(e,t,i){}getUniformBuffersNames(e){}getUniforms(){return{}}copyTo(e){s.p4.Clone((()=>e),this)}serialize(){return s.p4.Serialize(this)}parse(e,t,i){s.p4.Parse((()=>this),e,t,i)}}(0,n.gn)([(0,s.qC)()],o.prototype,"name",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"priority",void 0),(0,n.gn)([(0,s.qC)()],o.prototype,"registerForExtraEvents",void 0)},1698:(e,t,i)=>{var n;i.d(t,{S:()=>n}),function(e){e[e.Created=1]="Created",e[e.Disposed=2]="Disposed",e[e.GetDefineNames=4]="GetDefineNames",e[e.PrepareUniformBuffer=8]="PrepareUniformBuffer",e[e.IsReadyForSubMesh=16]="IsReadyForSubMesh",e[e.PrepareDefines=32]="PrepareDefines",e[e.BindForSubMesh=64]="BindForSubMesh",e[e.PrepareEffect=128]="PrepareEffect",e[e.GetAnimatables=256]="GetAnimatables",e[e.GetActiveTextures=512]="GetActiveTextures",e[e.HasTexture=1024]="HasTexture",e[e.FillRenderTargetTextures=2048]="FillRenderTargetTextures",e[e.HasRenderTargetTextures=4096]="HasRenderTargetTextures",e[e.HardBindForSubMesh=8192]="HardBindForSubMesh"}(n||(n={}))},9249:(e,t,i)=>{i.d(t,{BK:()=>o,Dh:()=>d,jD:()=>u,rs:()=>c});var n=i(7104),s=i(1698);const r=new RegExp("^([gimus]+)!");class o{constructor(e){this._plugins=[],this._activePlugins=[],this._activePluginsForExtraEvents=[],this._material=e,this._scene=e.getScene(),this._engine=this._scene.getEngine()}_addPlugin(e){for(let t=0;t<this._plugins.length;++t)if(this._plugins[t].name===e.name)throw`Plugin "${e.name}" already added to the material "${this._material.name}"!`;if(this._material._uniformBufferLayoutBuilt)throw`The plugin "${e.name}" can't be added to the material "${this._material.name}" because this material has already been used for rendering! Please add plugins to materials before any rendering with this material occurs.`;const t=e.getClassName();o._MaterialPluginClassToMainDefine[t]||(o._MaterialPluginClassToMainDefine[t]="MATERIALPLUGIN_"+ ++o._MaterialPluginCounter),this._material._callbackPluginEventGeneric=this._handlePluginEvent.bind(this),this._plugins.push(e),this._plugins.sort(((e,t)=>e.priority-t.priority)),this._codeInjectionPoints={};const i={};i[o._MaterialPluginClassToMainDefine[t]]={type:"boolean",default:!0};for(const e of this._plugins)e.collectDefines(i),this._collectPointNames("vertex",e.getCustomCode("vertex")),this._collectPointNames("fragment",e.getCustomCode("fragment"));this._defineNamesFromPlugins=i}_activatePlugin(e){-1===this._activePlugins.indexOf(e)&&(this._activePlugins.push(e),this._activePlugins.sort(((e,t)=>e.priority-t.priority)),this._material._callbackPluginEventIsReadyForSubMesh=this._handlePluginEventIsReadyForSubMesh.bind(this),this._material._callbackPluginEventPrepareDefinesBeforeAttributes=this._handlePluginEventPrepareDefinesBeforeAttributes.bind(this),this._material._callbackPluginEventPrepareDefines=this._handlePluginEventPrepareDefines.bind(this),this._material._callbackPluginEventBindForSubMesh=this._handlePluginEventBindForSubMesh.bind(this),e.registerForExtraEvents&&(this._activePluginsForExtraEvents.push(e),this._activePluginsForExtraEvents.sort(((e,t)=>e.priority-t.priority)),this._material._callbackPluginEventHasRenderTargetTextures=this._handlePluginEventHasRenderTargetTextures.bind(this),this._material._callbackPluginEventFillRenderTargetTextures=this._handlePluginEventFillRenderTargetTextures.bind(this),this._material._callbackPluginEventHardBindForSubMesh=this._handlePluginEventHardBindForSubMesh.bind(this)))}getPlugin(e){for(let t=0;t<this._plugins.length;++t)if(this._plugins[t].name===e)return this._plugins[t];return null}_handlePluginEventIsReadyForSubMesh(e){let t=!0;for(const i of this._activePlugins)t=t&&i.isReadyForSubMesh(e.defines,this._scene,this._engine,e.subMesh);e.isReadyForSubMesh=t}_handlePluginEventPrepareDefinesBeforeAttributes(e){for(const t of this._activePlugins)t.prepareDefinesBeforeAttributes(e.defines,this._scene,e.mesh)}_handlePluginEventPrepareDefines(e){for(const t of this._activePlugins)t.prepareDefines(e.defines,this._scene,e.mesh)}_handlePluginEventHardBindForSubMesh(e){for(const t of this._activePluginsForExtraEvents)t.hardBindForSubMesh(this._material._uniformBuffer,this._scene,this._engine,e.subMesh)}_handlePluginEventBindForSubMesh(e){for(const t of this._activePlugins)t.bindForSubMesh(this._material._uniformBuffer,this._scene,this._engine,e.subMesh)}_handlePluginEventHasRenderTargetTextures(e){let t=!1;for(const e of this._activePluginsForExtraEvents)if(t=e.hasRenderTargetTextures(),t)break;e.hasRenderTargetTextures=t}_handlePluginEventFillRenderTargetTextures(e){for(const t of this._activePluginsForExtraEvents)t.fillRenderTargetTextures(e.renderTargets)}_handlePluginEvent(e,t){var i;switch(e){case s.S.GetActiveTextures:{const e=t;for(const t of this._activePlugins)t.getActiveTextures(e.activeTextures);break}case s.S.GetAnimatables:{const e=t;for(const t of this._activePlugins)t.getAnimatables(e.animatables);break}case s.S.HasTexture:{const e=t;let i=!1;for(const t of this._activePlugins)if(i=t.hasTexture(e.texture),i)break;e.hasTexture=i;break}case s.S.Disposed:{const e=t;for(const t of this._plugins)t.dispose(e.forceDisposeTextures);break}case s.S.GetDefineNames:t.defineNames=this._defineNamesFromPlugins;break;case s.S.PrepareEffect:{const e=t;for(const t of this._activePlugins)e.fallbackRank=t.addFallbacks(e.defines,e.fallbacks,e.fallbackRank),t.getAttributes(e.attributes,this._scene,e.mesh);this._uniformList.length>0&&e.uniforms.push(...this._uniformList),this._samplerList.length>0&&e.samplers.push(...this._samplerList),this._uboList.length>0&&e.uniformBuffersNames.push(...this._uboList),e.customCode=this._injectCustomCode(e.customCode);break}case s.S.PrepareUniformBuffer:{const e=t;this._uboDeclaration="",this._vertexDeclaration="",this._fragmentDeclaration="",this._uniformList=[],this._samplerList=[],this._uboList=[];for(const t of this._plugins){const n=t.getUniforms();if(n){if(n.ubo)for(const t of n.ubo){if(t.size&&t.type){const n=null!==(i=t.arraySize)&&void 0!==i?i:0;e.ubo.addUniform(t.name,t.size,n),this._uboDeclaration+=`${t.type} ${t.name}${n>0?`[${n}]`:""};\r\n`}this._uniformList.push(t.name)}n.vertex&&(this._vertexDeclaration+=n.vertex+"\r\n"),n.fragment&&(this._fragmentDeclaration+=n.fragment+"\r\n")}t.getSamplers(this._samplerList),t.getUniformBuffersNames(this._uboList)}break}}}_collectPointNames(e,t){if(t)for(const i in t)this._codeInjectionPoints[e]||(this._codeInjectionPoints[e]={}),this._codeInjectionPoints[e][i]=!0}_injectCustomCode(e){return(t,i)=>{var n;e&&(i=e(t,i)),this._uboDeclaration&&(i=i.replace("#define ADDITIONAL_UBO_DECLARATION",this._uboDeclaration)),this._vertexDeclaration&&(i=i.replace("#define ADDITIONAL_VERTEX_DECLARATION",this._vertexDeclaration)),this._fragmentDeclaration&&(i=i.replace("#define ADDITIONAL_FRAGMENT_DECLARATION",this._fragmentDeclaration));const s=null===(n=this._codeInjectionPoints)||void 0===n?void 0:n[t];if(!s)return i;for(let e in s){let n="";for(const i of this._activePlugins){const s=i.getCustomCode(t);(null==s?void 0:s[e])&&(n+=s[e]+"\r\n")}if(n.length>0)if("!"===e.charAt(0)){e=e.substring(1);let t="g";if("!"===e.charAt(0))t="",e=e.substring(1);else{const i=r.exec(e);i&&i.length>=2&&(t=i[1],e=e.substring(t.length+1))}t.indexOf("g")<0&&(t+="g");const s=i,o=new RegExp(e,t);let a=o.exec(s);for(;null!==a;){let e=n;for(let t=0;t<a.length;++t)e=e.replace("$"+t,a[t]);i=i.replace(a[0],e),a=o.exec(s)}}else{const t="#define "+e;i=i.replace(t,"\r\n"+n+"\r\n"+t)}}return i}}}o._MaterialPluginClassToMainDefine={},o._MaterialPluginCounter=0;const a=[];let l=!1,h=null;function c(e,t){l||(h=n.F.OnEventObservable.add((e=>{for(const[,t]of a)t(e)}),s.S.Created),l=!0);const i=a.filter((([t,i])=>t===e));i.length>0?i[0][1]=t:a.push([e,t])}function u(e){for(let t=0;t<a.length;++t)if(a[t][0]===e)return a.splice(t,1),0===a.length&&d(),!0;return!1}function d(){a.length=0,l=!1,n.F.OnEventObservable.remove(h)}},9828:(e,t,i)=>{i.d(t,{G:()=>o});var n=i(7104),s=i(4875),r=i(2208);class o extends n.F{get subMaterials(){return this._subMaterials}set subMaterials(e){this._subMaterials=e,this._hookArray(e)}getChildren(){return this.subMaterials}constructor(e,t){super(e,t,!0),this._waitingSubMaterialsUniqueIds=[],this.getScene().multiMaterials.push(this),this.subMaterials=new Array,this._storeEffectOnSubMeshes=!0}_hookArray(e){const t=e.push;e.push=(...i)=>{const n=t.apply(e,i);return this._markAllSubMeshesAsTexturesDirty(),n};const i=e.splice;e.splice=(t,n)=>{const s=i.apply(e,[t,n]);return this._markAllSubMeshesAsTexturesDirty(),s}}getSubMaterial(e){return e<0||e>=this.subMaterials.length?this.getScene().defaultMaterial:this.subMaterials[e]}getActiveTextures(){return super.getActiveTextures().concat(...this.subMaterials.map((e=>e?e.getActiveTextures():[])))}hasTexture(e){var t;if(super.hasTexture(e))return!0;for(let i=0;i<this.subMaterials.length;i++)if(null===(t=this.subMaterials[i])||void 0===t?void 0:t.hasTexture(e))return!0;return!1}getClassName(){return"MultiMaterial"}isReadyForSubMesh(e,t,i){for(let n=0;n<this.subMaterials.length;n++){const s=this.subMaterials[n];if(s){if(s._storeEffectOnSubMeshes){if(!s.isReadyForSubMesh(e,t,i))return!1;continue}if(!s.isReady(e))return!1}}return!0}clone(e,t){const i=new o(e,this.getScene());for(let n=0;n<this.subMaterials.length;n++){let s=null;const r=this.subMaterials[n];s=t&&r?r.clone(e+"-"+r.name):this.subMaterials[n],i.subMaterials.push(s)}return i}serialize(){const e={};e.name=this.name,e.id=this.id,e.uniqueId=this.uniqueId,s.$&&(e.tags=s.$.GetTags(this)),e.materialsUniqueIds=[],e.materials=[];for(let t=0;t<this.subMaterials.length;t++){const i=this.subMaterials[t];i?(e.materialsUniqueIds.push(i.uniqueId),e.materials.push(i.id)):(e.materialsUniqueIds.push(null),e.materials.push(null))}return e}dispose(e,t,i){const n=this.getScene();if(!n)return;if(i)for(let i=0;i<this.subMaterials.length;i++){const n=this.subMaterials[i];n&&n.dispose(e,t)}const s=n.multiMaterials.indexOf(this);s>=0&&n.multiMaterials.splice(s,1),super.dispose(e,t)}static ParseMultiMaterial(e,t){const i=new o(e.name,t);return i.id=e.id,i._loadedUniqueId=e.uniqueId,s.$&&s.$.AddTagsTo(i,e.tags),e.materialsUniqueIds?i._waitingSubMaterialsUniqueIds=e.materialsUniqueIds:e.materials.forEach((e=>i.subMaterials.push(t.getLastMaterialById(e)))),i}}(0,r.H)("BABYLON.MultiMaterial",o)},178:(e,t,i)=>{i.d(t,{o:()=>n});class n{constructor(){this.previousWorldMatrices={},this.previousBones={}}static AddUniforms(e){e.push("previousWorld","previousViewProjection","mPreviousBones")}static AddSamplers(e){}bindForSubMesh(e,t,i,n,s){if(t.prePassRenderer&&t.prePassRenderer.enabled&&t.prePassRenderer.currentRTisSceneRT&&-1!==t.prePassRenderer.getIndex(2)){this.previousWorldMatrices[i.uniqueId]||(this.previousWorldMatrices[i.uniqueId]=n.clone()),this.previousViewProjection||(this.previousViewProjection=t.getTransformMatrix().clone(),this.currentViewProjection=t.getTransformMatrix().clone());const s=t.getEngine();this.currentViewProjection.updateFlag!==t.getTransformMatrix().updateFlag?(this._lastUpdateFrameId=s.frameId,this.previousViewProjection.copyFrom(this.currentViewProjection),this.currentViewProjection.copyFrom(t.getTransformMatrix())):this._lastUpdateFrameId!==s.frameId&&(this._lastUpdateFrameId=s.frameId,this.previousViewProjection.copyFrom(this.currentViewProjection)),e.setMatrix("previousWorld",this.previousWorldMatrices[i.uniqueId]),e.setMatrix("previousViewProjection",this.previousViewProjection),this.previousWorldMatrices[i.uniqueId]=n.clone()}}}},580:(e,t,i)=>{i.d(t,{a:()=>r});var n=i(4141),s=i(7104);class r extends s.F{constructor(e,t,i=!0){super(e,t),this._normalMatrix=new n.y3,this._storeEffectOnSubMeshes=i}getEffect(){return this._storeEffectOnSubMeshes?this._activeEffect:super.getEffect()}isReady(e,t){return!!e&&(!this._storeEffectOnSubMeshes||!e.subMeshes||0===e.subMeshes.length||this.isReadyForSubMesh(e,e.subMeshes[0],t))}_isReadyForSubMesh(e){const t=e.materialDefines;return!(this.checkReadyOnEveryCall||!e.effect||!t||t._renderId!==this.getScene().getRenderId())}bindOnlyWorldMatrix(e){this._activeEffect.setMatrix("world",e)}bindOnlyNormalMatrix(e){this._activeEffect.setMatrix("normalMatrix",e)}bind(e,t){t&&this.bindForSubMesh(e,t,t.subMeshes[0])}_afterBind(e,t=null){super._afterBind(e,t),this.getScene()._cachedEffect=t,t&&(t._forceRebindOnNextCall=!1)}_mustRebind(e,t,i=1){return e.isCachedMaterialInvalid(this,t,i)}dispose(e,t,i){this._activeEffect=void 0,super.dispose(e,t,i)}}},9131:(e,t,i)=>{var n;i.d(t,{x:()=>n}),function(e){e[e.GLSL=0]="GLSL",e[e.WGSL=1]="WGSL"}(n||(n={}))},8097:(e,t,i)=>{i.d(t,{j:()=>m});var n=i(3956),s=i(4141),r=i(708),o=i(2262),a=i(5346),l=i(2208),h=i(4649),c=i(1434),u=i(6662),d=i(580),p=i(1431),f=i(99);const _={effect:null,subMesh:null};class m extends d.a{constructor(e,t,i,n={},r=!0){super(e,t,r),this._textures={},this._textureArrays={},this._externalTextures={},this._floats={},this._ints={},this._uints={},this._floatsArrays={},this._colors3={},this._colors3Arrays={},this._colors4={},this._colors4Arrays={},this._vectors2={},this._vectors3={},this._vectors4={},this._quaternions={},this._quaternionsArrays={},this._matrices={},this._matrixArrays={},this._matrices3x3={},this._matrices2x2={},this._vectors2Arrays={},this._vectors3Arrays={},this._vectors4Arrays={},this._uniformBuffers={},this._textureSamplers={},this._storageBuffers={},this._cachedWorldViewMatrix=new s.y3,this._cachedWorldViewProjectionMatrix=new s.y3,this._multiview=!1,this._shaderPath=i,this._options={needAlphaBlending:!1,needAlphaTesting:!1,attributes:["position","normal","uv"],uniforms:["worldViewProjection"],uniformBuffers:[],samplers:[],externalTextures:[],samplerObjects:[],storageBuffers:[],defines:[],useClipPlane:!1,...n}}get shaderPath(){return this._shaderPath}set shaderPath(e){this._shaderPath=e}get options(){return this._options}getClassName(){return"ShaderMaterial"}needAlphaBlending(){return this.alpha<1||this._options.needAlphaBlending}needAlphaTesting(){return this._options.needAlphaTesting}_checkUniform(e){-1===this._options.uniforms.indexOf(e)&&this._options.uniforms.push(e)}setTexture(e,t){return-1===this._options.samplers.indexOf(e)&&this._options.samplers.push(e),this._textures[e]=t,this}setTextureArray(e,t){return-1===this._options.samplers.indexOf(e)&&this._options.samplers.push(e),this._checkUniform(e),this._textureArrays[e]=t,this}setExternalTexture(e,t){return-1===this._options.externalTextures.indexOf(e)&&this._options.externalTextures.push(e),this._externalTextures[e]=t,this}setFloat(e,t){return this._checkUniform(e),this._floats[e]=t,this}setInt(e,t){return this._checkUniform(e),this._ints[e]=t,this}setUInt(e,t){return this._checkUniform(e),this._uints[e]=t,this}setFloats(e,t){return this._checkUniform(e),this._floatsArrays[e]=t,this}setColor3(e,t){return this._checkUniform(e),this._colors3[e]=t,this}setColor3Array(e,t){return this._checkUniform(e),this._colors3Arrays[e]=t.reduce(((e,t)=>(t.toArray(e,e.length),e)),[]),this}setColor4(e,t){return this._checkUniform(e),this._colors4[e]=t,this}setColor4Array(e,t){return this._checkUniform(e),this._colors4Arrays[e]=t.reduce(((e,t)=>(t.toArray(e,e.length),e)),[]),this}setVector2(e,t){return this._checkUniform(e),this._vectors2[e]=t,this}setVector3(e,t){return this._checkUniform(e),this._vectors3[e]=t,this}setVector4(e,t){return this._checkUniform(e),this._vectors4[e]=t,this}setQuaternion(e,t){return this._checkUniform(e),this._quaternions[e]=t,this}setQuaternionArray(e,t){return this._checkUniform(e),this._quaternionsArrays[e]=t.reduce(((e,t)=>(t.toArray(e,e.length),e)),[]),this}setMatrix(e,t){return this._checkUniform(e),this._matrices[e]=t,this}setMatrices(e,t){this._checkUniform(e);const i=new Float32Array(16*t.length);for(let e=0;e<t.length;e++)t[e].copyToArray(i,16*e);return this._matrixArrays[e]=i,this}setMatrix3x3(e,t){return this._checkUniform(e),this._matrices3x3[e]=t,this}setMatrix2x2(e,t){return this._checkUniform(e),this._matrices2x2[e]=t,this}setArray2(e,t){return this._checkUniform(e),this._vectors2Arrays[e]=t,this}setArray3(e,t){return this._checkUniform(e),this._vectors3Arrays[e]=t,this}setArray4(e,t){return this._checkUniform(e),this._vectors4Arrays[e]=t,this}setUniformBuffer(e,t){return-1===this._options.uniformBuffers.indexOf(e)&&this._options.uniformBuffers.push(e),this._uniformBuffers[e]=t,this}setTextureSampler(e,t){return-1===this._options.samplerObjects.indexOf(e)&&this._options.samplerObjects.push(e),this._textureSamplers[e]=t,this}setStorageBuffer(e,t){return-1===this._options.storageBuffers.indexOf(e)&&this._options.storageBuffers.push(e),this._storageBuffers[e]=t,this}isReadyForSubMesh(e,t,i){return this.isReady(e,i,t)}isReady(e,t,i){var n,s,o,l;const h=i&&this._storeEffectOnSubMeshes;if(this.isFrozen)if(h){if(i.effect&&i.effect._wasPreviouslyReady)return!0}else{const e=this._drawWrapper.effect;if(e&&e._wasPreviouslyReady&&e._wasPreviouslyUsingInstances===t)return!0}const u=this.getScene(),d=u.getEngine(),p=[],m=[],g=new c.L;let v=this._shaderPath,y=this._options.uniforms,x=this._options.uniformBuffers,b=this._options.samplers;d.getCaps().multiview&&u.activeCamera&&u.activeCamera.outputRenderTarget&&u.activeCamera.outputRenderTarget.getViewCount()>1&&(this._multiview=!0,p.push("#define MULTIVIEW"),-1!==this._options.uniforms.indexOf("viewProjection")&&-1===this._options.uniforms.indexOf("viewProjectionR")&&this._options.uniforms.push("viewProjectionR"));for(let e=0;e<this._options.defines.length;e++){const t=0===this._options.defines[e].indexOf("#define")?this._options.defines[e]:`#define ${this._options.defines[e]}`;p.push(t)}for(let e=0;e<this._options.attributes.length;e++)m.push(this._options.attributes[e]);if(e&&e.isVerticesDataPresent(r.o.ColorKind)&&(m.push(r.o.ColorKind),p.push("#define VERTEXCOLOR")),t&&(p.push("#define INSTANCES"),a.G.PushAttributesForInstances(m),(null==e?void 0:e.hasThinInstances)&&(p.push("#define THIN_INSTANCES"),e&&e.isVerticesDataPresent(r.o.ColorInstanceKind)&&(m.push(r.o.ColorInstanceKind),p.push("#define INSTANCESCOLOR")))),e&&e.useBones&&e.computeBonesUsingShaders&&e.skeleton){m.push(r.o.MatricesIndicesKind),m.push(r.o.MatricesWeightsKind),e.numBoneInfluencers>4&&(m.push(r.o.MatricesIndicesExtraKind),m.push(r.o.MatricesWeightsExtraKind));const t=e.skeleton;p.push("#define NUM_BONE_INFLUENCERS "+e.numBoneInfluencers),g.addCPUSkinningFallback(0,e),t.isUsingTextureForMatrices?(p.push("#define BONETEXTURE"),-1===this._options.uniforms.indexOf("boneTextureWidth")&&this._options.uniforms.push("boneTextureWidth"),-1===this._options.samplers.indexOf("boneSampler")&&this._options.samplers.push("boneSampler")):(p.push("#define BonesPerMesh "+(t.bones.length+1)),-1===this._options.uniforms.indexOf("mBones")&&this._options.uniforms.push("mBones"))}else p.push("#define NUM_BONE_INFLUENCERS 0");let T=0;const S=e?e.morphTargetManager:null;if(S){const e=S.supportsUVs&&-1!==p.indexOf("#define UV1"),t=S.supportsTangents&&-1!==p.indexOf("#define TANGENT"),i=S.supportsNormals&&-1!==p.indexOf("#define NORMAL");T=S.numInfluencers,e&&p.push("#define MORPHTARGETS_UV"),t&&p.push("#define MORPHTARGETS_TANGENT"),i&&p.push("#define MORPHTARGETS_NORMAL"),T>0&&p.push("#define MORPHTARGETS"),S.isUsingTextureForTargets&&(p.push("#define MORPHTARGETS_TEXTURE"),-1===this._options.uniforms.indexOf("morphTargetTextureIndices")&&this._options.uniforms.push("morphTargetTextureIndices"),-1===this._options.samplers.indexOf("morphTargets")&&this._options.samplers.push("morphTargets")),p.push("#define NUM_MORPH_INFLUENCERS "+T);for(let n=0;n<T;n++)m.push(r.o.PositionKind+n),i&&m.push(r.o.NormalKind+n),t&&m.push(r.o.TangentKind+n),e&&m.push(r.o.UVKind+"_"+n);T>0&&(y=y.slice(),y.push("morphTargetInfluences"),y.push("morphTargetTextureInfo"),y.push("morphTargetTextureIndices"))}else p.push("#define NUM_MORPH_INFLUENCERS 0");if(e){const t=e.bakedVertexAnimationManager;t&&t.isEnabled&&(p.push("#define BAKED_VERTEX_ANIMATION_TEXTURE"),-1===this._options.uniforms.indexOf("bakedVertexAnimationSettings")&&this._options.uniforms.push("bakedVertexAnimationSettings"),-1===this._options.uniforms.indexOf("bakedVertexAnimationTextureSizeInverted")&&this._options.uniforms.push("bakedVertexAnimationTextureSizeInverted"),-1===this._options.uniforms.indexOf("bakedVertexAnimationTime")&&this._options.uniforms.push("bakedVertexAnimationTime"),-1===this._options.samplers.indexOf("bakedVertexAnimationTexture")&&this._options.samplers.push("bakedVertexAnimationTexture")),a.G.PrepareAttributesForBakedVertexAnimation(m,e,p)}for(const e in this._textures)if(!this._textures[e].isReady())return!1;e&&this._shouldTurnAlphaTestOn(e)&&p.push("#define ALPHATEST"),!1!==this._options.useClipPlane&&((0,f.qx)(y),(0,f.lK)(this,u,p)),this.customShaderNameResolve&&(y=y.slice(),x=x.slice(),b=b.slice(),v=this.customShaderNameResolve(v,y,x,b,p,m));const E=h?i._getDrawWrapper():this._drawWrapper,C=null!==(n=null==E?void 0:E.effect)&&void 0!==n?n:null,A=null!==(s=null==E?void 0:E.defines)&&void 0!==s?s:null,P=p.join("\n");let R=C;return A!==P&&(R=d.createEffect(v,{attributes:m,uniformsNames:y,uniformBuffersNames:x,samplers:b,defines:P,fallbacks:g,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousMorphTargets:T},shaderLanguage:this._options.shaderLanguage},d),h?i.setEffect(R,P,this._materialContext):E&&E.setEffect(R,P),this._onEffectCreatedObservable&&(_.effect=R,_.subMesh=null!==(o=null!=i?i:null==e?void 0:e.subMeshes[0])&&void 0!==o?o:null,this._onEffectCreatedObservable.notifyObservers(_))),R._wasPreviouslyUsingInstances=!!t,null!==(l=!(null==R?void 0:R.isReady()))&&void 0!==l&&!l&&(C!==R&&u.resetCachedMaterial(),R._wasPreviouslyReady=!0,!0)}bindOnlyWorldMatrix(e,t){const i=this.getScene(),n=null!=t?t:this.getEffect();n&&(-1!==this._options.uniforms.indexOf("world")&&n.setMatrix("world",e),-1!==this._options.uniforms.indexOf("worldView")&&(e.multiplyToRef(i.getViewMatrix(),this._cachedWorldViewMatrix),n.setMatrix("worldView",this._cachedWorldViewMatrix)),-1!==this._options.uniforms.indexOf("worldViewProjection")&&(e.multiplyToRef(i.getTransformMatrix(),this._cachedWorldViewProjectionMatrix),n.setMatrix("worldViewProjection",this._cachedWorldViewProjectionMatrix)))}bindForSubMesh(e,t,i){var n;this.bind(e,t,null===(n=i._drawWrapperOverride)||void 0===n?void 0:n.effect,i)}bind(e,t,i,n){var s;const r=n&&this._storeEffectOnSubMeshes,o=null!=i?i:r?n.effect:this.getEffect();if(!o)return;this._activeEffect=o,this.bindOnlyWorldMatrix(e,i);const l=this._options.uniformBuffers;let h=!1;if(o&&l&&l.length>0&&this.getScene().getEngine().supportsUniformBuffers)for(let i=0;i<l.length;++i)switch(l[i]){case"Mesh":t&&(t.getMeshUniformBuffer().bindToEffect(o,"Mesh"),t.transferToEffect(e));break;case"Scene":a.G.BindSceneUniformBuffer(o,this.getScene().getSceneUniformBuffer()),this.getScene().finalizeSceneUbo(),h=!0}const c=t&&r?this._mustRebind(this.getScene(),o,t.visibility):this.getScene().getCachedMaterial()!==this;if(o&&c){let e;for(e in h||-1===this._options.uniforms.indexOf("view")||o.setMatrix("view",this.getScene().getViewMatrix()),h||-1===this._options.uniforms.indexOf("projection")||o.setMatrix("projection",this.getScene().getProjectionMatrix()),h||-1===this._options.uniforms.indexOf("viewProjection")||(o.setMatrix("viewProjection",this.getScene().getTransformMatrix()),this._multiview&&o.setMatrix("viewProjectionR",this.getScene()._transformMatrixR)),this.getScene().activeCamera&&-1!==this._options.uniforms.indexOf("cameraPosition")&&o.setVector3("cameraPosition",this.getScene().activeCamera.globalPosition),a.G.BindBonesParameters(t,o),(0,f.an)(o,this,this.getScene()),this._textures)o.setTexture(e,this._textures[e]);for(e in this._textureArrays)o.setTextureArray(e,this._textureArrays[e]);for(e in this._externalTextures)o.setExternalTexture(e,this._externalTextures[e]);for(e in this._ints)o.setInt(e,this._ints[e]);for(e in this._uints)o.setUInt(e,this._uints[e]);for(e in this._floats)o.setFloat(e,this._floats[e]);for(e in this._floatsArrays)o.setArray(e,this._floatsArrays[e]);for(e in this._colors3)o.setColor3(e,this._colors3[e]);for(e in this._colors3Arrays)o.setArray3(e,this._colors3Arrays[e]);for(e in this._colors4){const t=this._colors4[e];o.setFloat4(e,t.r,t.g,t.b,t.a)}for(e in this._colors4Arrays)o.setArray4(e,this._colors4Arrays[e]);for(e in this._vectors2)o.setVector2(e,this._vectors2[e]);for(e in this._vectors3)o.setVector3(e,this._vectors3[e]);for(e in this._vectors4)o.setVector4(e,this._vectors4[e]);for(e in this._quaternions)o.setQuaternion(e,this._quaternions[e]);for(e in this._matrices)o.setMatrix(e,this._matrices[e]);for(e in this._matrixArrays)o.setMatrices(e,this._matrixArrays[e]);for(e in this._matrices3x3)o.setMatrix3x3(e,this._matrices3x3[e]);for(e in this._matrices2x2)o.setMatrix2x2(e,this._matrices2x2[e]);for(e in this._vectors2Arrays)o.setArray2(e,this._vectors2Arrays[e]);for(e in this._vectors3Arrays)o.setArray3(e,this._vectors3Arrays[e]);for(e in this._vectors4Arrays)o.setArray4(e,this._vectors4Arrays[e]);for(e in this._quaternionsArrays)o.setArray4(e,this._quaternionsArrays[e]);for(e in this._uniformBuffers){const t=this._uniformBuffers[e].getBuffer();t&&o.bindUniformBuffer(t,e)}for(e in this._textureSamplers)o.setTextureSampler(e,this._textureSamplers[e]);for(e in this._storageBuffers)o.setStorageBuffer(e,this._storageBuffers[e])}if(o&&t&&(c||!this.isFrozen)){const e=t.morphTargetManager;e&&e.numInfluencers>0&&a.G.BindMorphTargetParameters(t,o);const i=t.bakedVertexAnimationManager;i&&i.isEnabled&&(null===(s=t.bakedVertexAnimationManager)||void 0===s||s.bind(o,!!o._wasPreviouslyUsingInstances))}this._afterBind(t,o)}getActiveTextures(){const e=super.getActiveTextures();for(const t in this._textures)e.push(this._textures[t]);for(const t in this._textureArrays){const i=this._textureArrays[t];for(let t=0;t<i.length;t++)e.push(i[t])}return e}hasTexture(e){if(super.hasTexture(e))return!0;for(const t in this._textures)if(this._textures[t]===e)return!0;for(const t in this._textureArrays){const i=this._textureArrays[t];for(let t=0;t<i.length;t++)if(i[t]===e)return!0}return!1}clone(e){const t=n.p4.Clone((()=>new m(e,this.getScene(),this._shaderPath,this._options,this._storeEffectOnSubMeshes)),this);t.name=e,t.id=e,"object"==typeof t._shaderPath&&(t._shaderPath={...t._shaderPath}),this._options={...this._options},Object.keys(this._options).forEach((e=>{const t=this._options[e];Array.isArray(t)&&(this._options[e]=t.slice(0))})),this.stencil.copyTo(t.stencil);for(const e in this._textures)t.setTexture(e,this._textures[e]);for(const e in this._textureArrays)t.setTextureArray(e,this._textureArrays[e]);for(const e in this._externalTextures)t.setExternalTexture(e,this._externalTextures[e]);for(const e in this._ints)t.setInt(e,this._ints[e]);for(const e in this._uints)t.setUInt(e,this._uints[e]);for(const e in this._floats)t.setFloat(e,this._floats[e]);for(const e in this._floatsArrays)t.setFloats(e,this._floatsArrays[e]);for(const e in this._colors3)t.setColor3(e,this._colors3[e]);for(const e in this._colors3Arrays)t._colors3Arrays[e]=this._colors3Arrays[e];for(const e in this._colors4)t.setColor4(e,this._colors4[e]);for(const e in this._colors4Arrays)t._colors4Arrays[e]=this._colors4Arrays[e];for(const e in this._vectors2)t.setVector2(e,this._vectors2[e]);for(const e in this._vectors3)t.setVector3(e,this._vectors3[e]);for(const e in this._vectors4)t.setVector4(e,this._vectors4[e]);for(const e in this._quaternions)t.setQuaternion(e,this._quaternions[e]);for(const e in this._quaternionsArrays)t._quaternionsArrays[e]=this._quaternionsArrays[e];for(const e in this._matrices)t.setMatrix(e,this._matrices[e]);for(const e in this._matrixArrays)t._matrixArrays[e]=this._matrixArrays[e].slice();for(const e in this._matrices3x3)t.setMatrix3x3(e,this._matrices3x3[e]);for(const e in this._matrices2x2)t.setMatrix2x2(e,this._matrices2x2[e]);for(const e in this._vectors2Arrays)t.setArray2(e,this._vectors2Arrays[e]);for(const e in this._vectors3Arrays)t.setArray3(e,this._vectors3Arrays[e]);for(const e in this._vectors4Arrays)t.setArray4(e,this._vectors4Arrays[e]);for(const e in this._uniformBuffers)t.setUniformBuffer(e,this._uniformBuffers[e]);for(const e in this._textureSamplers)t.setTextureSampler(e,this._textureSamplers[e]);for(const e in this._storageBuffers)t.setStorageBuffer(e,this._storageBuffers[e]);return t}dispose(e,t,i){if(t){let e;for(e in this._textures)this._textures[e].dispose();for(e in this._textureArrays){const t=this._textureArrays[e];for(let e=0;e<t.length;e++)t[e].dispose()}}this._textures={},super.dispose(e,t,i)}serialize(){const e=n.p4.Serialize(this);let t;for(t in e.customType="BABYLON.ShaderMaterial",e.uniqueId=this.uniqueId,e.options=this._options,e.shaderPath=this._shaderPath,e.storeEffectOnSubMeshes=this._storeEffectOnSubMeshes,e.stencil=this.stencil.serialize(),e.textures={},this._textures)e.textures[t]=this._textures[t].serialize();for(t in e.textureArrays={},this._textureArrays){e.textureArrays[t]=[];const i=this._textureArrays[t];for(let n=0;n<i.length;n++)e.textureArrays[t].push(i[n].serialize())}for(t in e.ints={},this._ints)e.ints[t]=this._ints[t];for(t in e.uints={},this._uints)e.uints[t]=this._uints[t];for(t in e.floats={},this._floats)e.floats[t]=this._floats[t];for(t in e.FloatArrays={},this._floatsArrays)e.FloatArrays[t]=this._floatsArrays[t];for(t in e.colors3={},this._colors3)e.colors3[t]=this._colors3[t].asArray();for(t in e.colors3Arrays={},this._colors3Arrays)e.colors3Arrays[t]=this._colors3Arrays[t];for(t in e.colors4={},this._colors4)e.colors4[t]=this._colors4[t].asArray();for(t in e.colors4Arrays={},this._colors4Arrays)e.colors4Arrays[t]=this._colors4Arrays[t];for(t in e.vectors2={},this._vectors2)e.vectors2[t]=this._vectors2[t].asArray();for(t in e.vectors3={},this._vectors3)e.vectors3[t]=this._vectors3[t].asArray();for(t in e.vectors4={},this._vectors4)e.vectors4[t]=this._vectors4[t].asArray();for(t in e.quaternions={},this._quaternions)e.quaternions[t]=this._quaternions[t].asArray();for(t in e.matrices={},this._matrices)e.matrices[t]=this._matrices[t].asArray();for(t in e.matrixArray={},this._matrixArrays)e.matrixArray[t]=this._matrixArrays[t];for(t in e.matrices3x3={},this._matrices3x3)e.matrices3x3[t]=this._matrices3x3[t];for(t in e.matrices2x2={},this._matrices2x2)e.matrices2x2[t]=this._matrices2x2[t];for(t in e.vectors2Arrays={},this._vectors2Arrays)e.vectors2Arrays[t]=this._vectors2Arrays[t];for(t in e.vectors3Arrays={},this._vectors3Arrays)e.vectors3Arrays[t]=this._vectors3Arrays[t];for(t in e.vectors4Arrays={},this._vectors4Arrays)e.vectors4Arrays[t]=this._vectors4Arrays[t];for(t in e.quaternionsArrays={},this._quaternionsArrays)e.quaternionsArrays[t]=this._quaternionsArrays[t];return e}static Parse(e,t,i){const r=n.p4.Parse((()=>new m(e.name,t,e.shaderPath,e.options,e.storeEffectOnSubMeshes)),e,t,i);let a;for(a in e.stencil&&r.stencil.parse(e.stencil,t,i),e.textures)r.setTexture(a,o.x.Parse(e.textures[a],t,i));for(a in e.textureArrays){const n=e.textureArrays[a],s=new Array;for(let e=0;e<n.length;e++)s.push(o.x.Parse(n[e],t,i));r.setTextureArray(a,s)}for(a in e.ints)r.setInt(a,e.ints[a]);for(a in e.uints)r.setUInt(a,e.uints[a]);for(a in e.floats)r.setFloat(a,e.floats[a]);for(a in e.floatsArrays)r.setFloats(a,e.floatsArrays[a]);for(a in e.colors3)r.setColor3(a,h.Wo.FromArray(e.colors3[a]));for(a in e.colors3Arrays){const t=e.colors3Arrays[a].reduce(((e,t,i)=>(i%3==0?e.push([t]):e[e.length-1].push(t),e)),[]).map((e=>h.Wo.FromArray(e)));r.setColor3Array(a,t)}for(a in e.colors4)r.setColor4(a,h.HE.FromArray(e.colors4[a]));for(a in e.colors4Arrays){const t=e.colors4Arrays[a].reduce(((e,t,i)=>(i%4==0?e.push([t]):e[e.length-1].push(t),e)),[]).map((e=>h.HE.FromArray(e)));r.setColor4Array(a,t)}for(a in e.vectors2)r.setVector2(a,s.FM.FromArray(e.vectors2[a]));for(a in e.vectors3)r.setVector3(a,s.P.FromArray(e.vectors3[a]));for(a in e.vectors4)r.setVector4(a,s.Lt.FromArray(e.vectors4[a]));for(a in e.quaternions)r.setQuaternion(a,s._f.FromArray(e.quaternions[a]));for(a in e.matrices)r.setMatrix(a,s.y3.FromArray(e.matrices[a]));for(a in e.matrixArray)r._matrixArrays[a]=new Float32Array(e.matrixArray[a]);for(a in e.matrices3x3)r.setMatrix3x3(a,e.matrices3x3[a]);for(a in e.matrices2x2)r.setMatrix2x2(a,e.matrices2x2[a]);for(a in e.vectors2Arrays)r.setArray2(a,e.vectors2Arrays[a]);for(a in e.vectors3Arrays)r.setArray3(a,e.vectors3Arrays[a]);for(a in e.vectors4Arrays)r.setArray4(a,e.vectors4Arrays[a]);for(a in e.quaternionsArrays)r.setArray4(a,e.quaternionsArrays[a]);return r}static ParseFromFileAsync(e,t,i,n=""){return new Promise(((s,r)=>{const o=new u.g;o.addEventListener("readystatechange",(()=>{if(4==o.readyState)if(200==o.status){const t=JSON.parse(o.responseText),r=this.Parse(t,i||p.l.LastCreatedScene,n);e&&(r.name=e),s(r)}else r("Unable to load the ShaderMaterial")})),o.open("GET",t),o.send()}))}static ParseFromSnippetAsync(e,t,i=""){return new Promise(((n,s)=>{const r=new u.g;r.addEventListener("readystatechange",(()=>{if(4==r.readyState)if(200==r.status){const s=JSON.parse(JSON.parse(r.responseText).jsonPayload),o=JSON.parse(s.shaderMaterial),a=this.Parse(o,t||p.l.LastCreatedScene,i);a.snippetId=e,n(a)}else s("Unable to load the snippet "+e)})),r.open("GET",this.SnippetUrl+"/"+e.replace(/#/g,"/")),r.send()}))}}m.SnippetUrl="https://snippet.babylonjs.com",m.CreateFromSnippetAsync=m.ParseFromSnippetAsync,(0,l.H)("BABYLON.ShaderMaterial",m)},252:(e,t,i)=>{i.d(t,{K:()=>A,R:()=>C});var n=i(9472),s=i(3956),r=i(5363),o=i(1057),a=i(4141),l=i(4649),h=i(708),c=i(178),u=i(4475),d=i(7104),p=i(1698),f=i(1917),_=i(580),m=i(5346),g=i(2262),v=i(2208),y=i(85),x=i(8104);i(3055);x.v.IncludesShadersStore.defaultFragmentDeclaration="uniform vec4 vEyePosition;\nuniform vec4 vDiffuseColor;\n#ifdef SPECULARTERM\nuniform vec4 vSpecularColor;\n#endif\nuniform vec3 vEmissiveColor;\nuniform vec3 vAmbientColor;\nuniform float visibility;\n#ifdef DIFFUSE\nuniform vec2 vDiffuseInfos;\n#endif\n#ifdef AMBIENT\nuniform vec2 vAmbientInfos;\n#endif\n#ifdef OPACITY \nuniform vec2 vOpacityInfos;\n#endif\n#ifdef EMISSIVE\nuniform vec2 vEmissiveInfos;\n#endif\n#ifdef LIGHTMAP\nuniform vec2 vLightmapInfos;\n#endif\n#ifdef BUMP\nuniform vec3 vBumpInfos;\nuniform vec2 vTangentSpaceParams;\n#endif\n#ifdef ALPHATEST\nuniform float alphaCutOff;\n#endif\n#if defined(REFLECTIONMAP_SPHERICAL) || defined(REFLECTIONMAP_PROJECTION) || defined(REFRACTION) || defined(PREPASS)\nuniform mat4 view;\n#endif\n#ifdef REFRACTION\nuniform vec4 vRefractionInfos;\n#ifndef REFRACTIONMAP_3D\nuniform mat4 refractionMatrix;\n#endif\n#ifdef REFRACTIONFRESNEL\nuniform vec4 refractionLeftColor;\nuniform vec4 refractionRightColor;\n#endif\n#if defined(USE_LOCAL_REFRACTIONMAP_CUBIC) && defined(REFRACTIONMAP_3D)\nuniform vec3 vRefractionPosition;\nuniform vec3 vRefractionSize; \n#endif\n#endif\n#if defined(SPECULAR) && defined(SPECULARTERM)\nuniform vec2 vSpecularInfos;\n#endif\n#ifdef DIFFUSEFRESNEL\nuniform vec4 diffuseLeftColor;\nuniform vec4 diffuseRightColor;\n#endif\n#ifdef OPACITYFRESNEL\nuniform vec4 opacityParts;\n#endif\n#ifdef EMISSIVEFRESNEL\nuniform vec4 emissiveLeftColor;\nuniform vec4 emissiveRightColor;\n#endif\n#ifdef REFLECTION\nuniform vec2 vReflectionInfos;\n#if defined(REFLECTIONMAP_PLANAR) || defined(REFLECTIONMAP_CUBIC) || defined(REFLECTIONMAP_PROJECTION) || defined(REFLECTIONMAP_EQUIRECTANGULAR) || defined(REFLECTIONMAP_SPHERICAL) || defined(REFLECTIONMAP_SKYBOX)\nuniform mat4 reflectionMatrix;\n#endif\n#ifndef REFLECTIONMAP_SKYBOX\n#if defined(USE_LOCAL_REFLECTIONMAP_CUBIC) && defined(REFLECTIONMAP_CUBIC)\nuniform vec3 vReflectionPosition;\nuniform vec3 vReflectionSize; \n#endif\n#endif\n#ifdef REFLECTIONFRESNEL\nuniform vec4 reflectionLeftColor;\nuniform vec4 reflectionRightColor;\n#endif\n#endif\n#ifdef DETAIL\nuniform vec4 vDetailInfos;\n#endif\n#include<decalFragmentDeclaration>\n#define ADDITIONAL_FRAGMENT_DECLARATION\n",i(2963),i(4804);x.v.IncludesShadersStore.defaultUboDeclaration="layout(std140,column_major) uniform;\nuniform Material\n{\nvec4 diffuseLeftColor;\nvec4 diffuseRightColor;\nvec4 opacityParts;\nvec4 reflectionLeftColor;\nvec4 reflectionRightColor;\nvec4 refractionLeftColor;\nvec4 refractionRightColor;\nvec4 emissiveLeftColor;\nvec4 emissiveRightColor;\nvec2 vDiffuseInfos;\nvec2 vAmbientInfos;\nvec2 vOpacityInfos;\nvec2 vReflectionInfos;\nvec3 vReflectionPosition;\nvec3 vReflectionSize;\nvec2 vEmissiveInfos;\nvec2 vLightmapInfos;\nvec2 vSpecularInfos;\nvec3 vBumpInfos;\nmat4 diffuseMatrix;\nmat4 ambientMatrix;\nmat4 opacityMatrix;\nmat4 reflectionMatrix;\nmat4 emissiveMatrix;\nmat4 lightmapMatrix;\nmat4 specularMatrix;\nmat4 bumpMatrix;\nvec2 vTangentSpaceParams;\nfloat pointSize;\nfloat alphaCutOff;\nmat4 refractionMatrix;\nvec4 vRefractionInfos;\nvec3 vRefractionPosition;\nvec3 vRefractionSize;\nvec4 vSpecularColor;\nvec3 vEmissiveColor;\nvec4 vDiffuseColor;\nvec3 vAmbientColor;\n#define ADDITIONAL_UBO_DECLARATION\n};\n#include<sceneUboDeclaration>\n#include<meshUboDeclaration>\n",i(8190),i(1868),i(6637),i(1423),i(2557),i(3756),i(6568),i(3996),i(1015),i(8491),i(2132),i(5141),i(3660),i(8882),i(7441),i(6390),i(1030),i(9519),i(5791),i(2321),i(8074),i(783),i(9490),i(8773),i(6043),i(4643);x.v.ShadersStore.defaultPixelShader="#include<__decl__defaultFragment>\n#if defined(BUMP) || !defined(NORMAL)\n#extension GL_OES_standard_derivatives : enable\n#endif\n#include<prePassDeclaration>[SCENE_MRT_COUNT]\n#include<oitDeclaration>\n#define CUSTOM_FRAGMENT_BEGIN\n#ifdef LOGARITHMICDEPTH\n#extension GL_EXT_frag_depth : enable\n#endif\n#define RECIPROCAL_PI2 0.15915494\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#include<mainUVVaryingDeclaration>[1..7]\n#include<helperFunctions>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#include<samplerFragmentDeclaration>(_DEFINENAME_,DIFFUSE,_VARYINGNAME_,Diffuse,_SAMPLERNAME_,diffuse)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,AMBIENT,_VARYINGNAME_,Ambient,_SAMPLERNAME_,ambient)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,OPACITY,_VARYINGNAME_,Opacity,_SAMPLERNAME_,opacity)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,EMISSIVE,_VARYINGNAME_,Emissive,_SAMPLERNAME_,emissive)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,LIGHTMAP,_VARYINGNAME_,Lightmap,_SAMPLERNAME_,lightmap)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,DECAL,_VARYINGNAME_,Decal,_SAMPLERNAME_,decal)\n#ifdef REFRACTION\n#ifdef REFRACTIONMAP_3D\nuniform samplerCube refractionCubeSampler;\n#else\nuniform sampler2D refraction2DSampler;\n#endif\n#endif\n#if defined(SPECULARTERM)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,SPECULAR,_VARYINGNAME_,Specular,_SAMPLERNAME_,specular)\n#endif\n#include<fresnelFunction>\n#ifdef REFLECTION\n#ifdef REFLECTIONMAP_3D\nuniform samplerCube reflectionCubeSampler;\n#else\nuniform sampler2D reflection2DSampler;\n#endif\n#ifdef REFLECTIONMAP_SKYBOX\nvarying vec3 vPositionUVW;\n#else\n#if defined(REFLECTIONMAP_EQUIRECTANGULAR_FIXED) || defined(REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED)\nvarying vec3 vDirectionW;\n#endif\n#endif\n#include<reflectionFunction>\n#endif\n#include<imageProcessingDeclaration>\n#include<imageProcessingFunctions>\n#include<bumpFragmentMainFunctions>\n#include<bumpFragmentFunctions>\n#include<clipPlaneFragmentDeclaration>\n#include<logDepthDeclaration>\n#include<fogFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\nvec4 baseColor=vec4(1.,1.,1.,1.);\nvec3 diffuseColor=vDiffuseColor.rgb;\nfloat alpha=vDiffuseColor.a;\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=normalize(-cross(dFdx(vPositionW),dFdy(vPositionW)));\n#endif\n#include<bumpFragment>\n#ifdef TWOSIDEDLIGHTING\nnormalW=gl_FrontFacing ? normalW : -normalW;\n#endif\n#ifdef DIFFUSE\nbaseColor=texture2D(diffuseSampler,vDiffuseUV+uvOffset);\n#if defined(ALPHATEST) && !defined(ALPHATEST_AFTERALLALPHACOMPUTATIONS)\nif (baseColor.a<alphaCutOff)\ndiscard;\n#endif\n#ifdef ALPHAFROMDIFFUSE\nalpha*=baseColor.a;\n#endif\n#define CUSTOM_FRAGMENT_UPDATE_ALPHA\nbaseColor.rgb*=vDiffuseInfos.y;\n#endif\n#ifdef DECAL\nvec4 decalColor=texture2D(decalSampler,vDecalUV+uvOffset);\n#include<decalFragment>(surfaceAlbedo,baseColor,GAMMADECAL,_GAMMADECAL_NOTUSED_)\n#endif\n#include<depthPrePass>\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nbaseColor.rgb*=vColor.rgb;\n#endif\n#ifdef DETAIL\nbaseColor.rgb=baseColor.rgb*2.0*mix(0.5,detailColor.r,vDetailInfos.y);\n#endif\n#define CUSTOM_FRAGMENT_UPDATE_DIFFUSE\nvec3 baseAmbientColor=vec3(1.,1.,1.);\n#ifdef AMBIENT\nbaseAmbientColor=texture2D(ambientSampler,vAmbientUV+uvOffset).rgb*vAmbientInfos.y;\n#endif\n#define CUSTOM_FRAGMENT_BEFORE_LIGHTS\n#ifdef SPECULARTERM\nfloat glossiness=vSpecularColor.a;\nvec3 specularColor=vSpecularColor.rgb;\n#ifdef SPECULAR\nvec4 specularMapColor=texture2D(specularSampler,vSpecularUV+uvOffset);\nspecularColor=specularMapColor.rgb;\n#ifdef GLOSSINESS\nglossiness=glossiness*specularMapColor.a;\n#endif\n#endif\n#else\nfloat glossiness=0.;\n#endif\nvec3 diffuseBase=vec3(0.,0.,0.);\nlightingInfo info;\n#ifdef SPECULARTERM\nvec3 specularBase=vec3(0.,0.,0.);\n#endif\nfloat shadow=1.;\n#ifdef LIGHTMAP\nvec4 lightmapColor=texture2D(lightmapSampler,vLightmapUV+uvOffset);\n#ifdef RGBDLIGHTMAP\nlightmapColor.rgb=fromRGBD(lightmapColor);\n#endif\nlightmapColor.rgb*=vLightmapInfos.y;\n#endif\n#include<lightFragment>[0..maxSimultaneousLights]\nvec4 refractionColor=vec4(0.,0.,0.,1.);\n#ifdef REFRACTION\nvec3 refractionVector=normalize(refract(-viewDirectionW,normalW,vRefractionInfos.y));\n#ifdef REFRACTIONMAP_3D\n#ifdef USE_LOCAL_REFRACTIONMAP_CUBIC\nrefractionVector=parallaxCorrectNormal(vPositionW,refractionVector,vRefractionSize,vRefractionPosition);\n#endif\nrefractionVector.y=refractionVector.y*vRefractionInfos.w;\nvec4 refractionLookup=textureCube(refractionCubeSampler,refractionVector);\nif (dot(refractionVector,viewDirectionW)<1.0) {\nrefractionColor=refractionLookup;\n}\n#else\nvec3 vRefractionUVW=vec3(refractionMatrix*(view*vec4(vPositionW+refractionVector*vRefractionInfos.z,1.0)));\nvec2 refractionCoords=vRefractionUVW.xy/vRefractionUVW.z;\nrefractionCoords.y=1.0-refractionCoords.y;\nrefractionColor=texture2D(refraction2DSampler,refractionCoords);\n#endif\n#ifdef RGBDREFRACTION\nrefractionColor.rgb=fromRGBD(refractionColor);\n#endif\n#ifdef IS_REFRACTION_LINEAR\nrefractionColor.rgb=toGammaSpace(refractionColor.rgb);\n#endif\nrefractionColor.rgb*=vRefractionInfos.x;\n#endif\nvec4 reflectionColor=vec4(0.,0.,0.,1.);\n#ifdef REFLECTION\nvec3 vReflectionUVW=computeReflectionCoords(vec4(vPositionW,1.0),normalW);\n#ifdef REFLECTIONMAP_OPPOSITEZ\nvReflectionUVW.z*=-1.0;\n#endif\n#ifdef REFLECTIONMAP_3D\n#ifdef ROUGHNESS\nfloat bias=vReflectionInfos.y;\n#ifdef SPECULARTERM\n#ifdef SPECULAR\n#ifdef GLOSSINESS\nbias*=(1.0-specularMapColor.a);\n#endif\n#endif\n#endif\nreflectionColor=textureCube(reflectionCubeSampler,vReflectionUVW,bias);\n#else\nreflectionColor=textureCube(reflectionCubeSampler,vReflectionUVW);\n#endif\n#else\nvec2 coords=vReflectionUVW.xy;\n#ifdef REFLECTIONMAP_PROJECTION\ncoords/=vReflectionUVW.z;\n#endif\ncoords.y=1.0-coords.y;\nreflectionColor=texture2D(reflection2DSampler,coords);\n#endif\n#ifdef RGBDREFLECTION\nreflectionColor.rgb=fromRGBD(reflectionColor);\n#endif\n#ifdef IS_REFLECTION_LINEAR\nreflectionColor.rgb=toGammaSpace(reflectionColor.rgb);\n#endif\nreflectionColor.rgb*=vReflectionInfos.x;\n#ifdef REFLECTIONFRESNEL\nfloat reflectionFresnelTerm=computeFresnelTerm(viewDirectionW,normalW,reflectionRightColor.a,reflectionLeftColor.a);\n#ifdef REFLECTIONFRESNELFROMSPECULAR\n#ifdef SPECULARTERM\nreflectionColor.rgb*=specularColor.rgb*(1.0-reflectionFresnelTerm)+reflectionFresnelTerm*reflectionRightColor.rgb;\n#else\nreflectionColor.rgb*=reflectionLeftColor.rgb*(1.0-reflectionFresnelTerm)+reflectionFresnelTerm*reflectionRightColor.rgb;\n#endif\n#else\nreflectionColor.rgb*=reflectionLeftColor.rgb*(1.0-reflectionFresnelTerm)+reflectionFresnelTerm*reflectionRightColor.rgb;\n#endif\n#endif\n#endif\n#ifdef REFRACTIONFRESNEL\nfloat refractionFresnelTerm=computeFresnelTerm(viewDirectionW,normalW,refractionRightColor.a,refractionLeftColor.a);\nrefractionColor.rgb*=refractionLeftColor.rgb*(1.0-refractionFresnelTerm)+refractionFresnelTerm*refractionRightColor.rgb;\n#endif\n#ifdef OPACITY\nvec4 opacityMap=texture2D(opacitySampler,vOpacityUV+uvOffset);\n#ifdef OPACITYRGB\nopacityMap.rgb=opacityMap.rgb*vec3(0.3,0.59,0.11);\nalpha*=(opacityMap.x+opacityMap.y+opacityMap.z)* vOpacityInfos.y;\n#else\nalpha*=opacityMap.a*vOpacityInfos.y;\n#endif\n#endif\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\n#ifdef OPACITYFRESNEL\nfloat opacityFresnelTerm=computeFresnelTerm(viewDirectionW,normalW,opacityParts.z,opacityParts.w);\nalpha+=opacityParts.x*(1.0-opacityFresnelTerm)+opacityFresnelTerm*opacityParts.y;\n#endif\n#ifdef ALPHATEST\n#ifdef ALPHATEST_AFTERALLALPHACOMPUTATIONS\nif (alpha<alphaCutOff)\ndiscard;\n#endif\n#ifndef ALPHABLEND\nalpha=1.0;\n#endif\n#endif\nvec3 emissiveColor=vEmissiveColor;\n#ifdef EMISSIVE\nemissiveColor+=texture2D(emissiveSampler,vEmissiveUV+uvOffset).rgb*vEmissiveInfos.y;\n#endif\n#ifdef EMISSIVEFRESNEL\nfloat emissiveFresnelTerm=computeFresnelTerm(viewDirectionW,normalW,emissiveRightColor.a,emissiveLeftColor.a);\nemissiveColor*=emissiveLeftColor.rgb*(1.0-emissiveFresnelTerm)+emissiveFresnelTerm*emissiveRightColor.rgb;\n#endif\n#ifdef DIFFUSEFRESNEL\nfloat diffuseFresnelTerm=computeFresnelTerm(viewDirectionW,normalW,diffuseRightColor.a,diffuseLeftColor.a);\ndiffuseBase*=diffuseLeftColor.rgb*(1.0-diffuseFresnelTerm)+diffuseFresnelTerm*diffuseRightColor.rgb;\n#endif\n#ifdef EMISSIVEASILLUMINATION\nvec3 finalDiffuse=clamp(diffuseBase*diffuseColor+vAmbientColor,0.0,1.0)*baseColor.rgb;\n#else\n#ifdef LINKEMISSIVEWITHDIFFUSE\nvec3 finalDiffuse=clamp((diffuseBase+emissiveColor)*diffuseColor+vAmbientColor,0.0,1.0)*baseColor.rgb;\n#else\nvec3 finalDiffuse=clamp(diffuseBase*diffuseColor+emissiveColor+vAmbientColor,0.0,1.0)*baseColor.rgb;\n#endif\n#endif\n#ifdef SPECULARTERM\nvec3 finalSpecular=specularBase*specularColor;\n#ifdef SPECULAROVERALPHA\nalpha=clamp(alpha+dot(finalSpecular,vec3(0.3,0.59,0.11)),0.,1.);\n#endif\n#else\nvec3 finalSpecular=vec3(0.0);\n#endif\n#ifdef REFLECTIONOVERALPHA\nalpha=clamp(alpha+dot(reflectionColor.rgb,vec3(0.3,0.59,0.11)),0.,1.);\n#endif\n#ifdef EMISSIVEASILLUMINATION\nvec4 color=vec4(clamp(finalDiffuse*baseAmbientColor+finalSpecular+reflectionColor.rgb+emissiveColor+refractionColor.rgb,0.0,1.0),alpha);\n#else\nvec4 color=vec4(finalDiffuse*baseAmbientColor+finalSpecular+reflectionColor.rgb+refractionColor.rgb,alpha);\n#endif\n#ifdef LIGHTMAP\n#ifndef LIGHTMAPEXCLUDED\n#ifdef USELIGHTMAPASSHADOWMAP\ncolor.rgb*=lightmapColor.rgb;\n#else\ncolor.rgb+=lightmapColor.rgb;\n#endif\n#endif\n#endif\n#define CUSTOM_FRAGMENT_BEFORE_FOG\ncolor.rgb=max(color.rgb,0.);\n#include<logDepthFragment>\n#include<fogFragment>\n#ifdef IMAGEPROCESSINGPOSTPROCESS\ncolor.rgb=toLinearSpace(color.rgb);\n#else\n#ifdef IMAGEPROCESSING\ncolor.rgb=toLinearSpace(color.rgb);\ncolor=applyImageProcessing(color);\n#endif\n#endif\ncolor.a*=visibility;\n#ifdef PREMULTIPLYALPHA\ncolor.rgb*=color.a;\n#endif\n#define CUSTOM_FRAGMENT_BEFORE_FRAGCOLOR\n#ifdef PREPASS\nfloat writeGeometryInfo=color.a>0.4 ? 1.0 : 0.0;\ngl_FragData[0]=color; \n#ifdef PREPASS_POSITION\ngl_FragData[PREPASS_POSITION_INDEX]=vec4(vPositionW,writeGeometryInfo);\n#endif\n#ifdef PREPASS_VELOCITY\nvec2 a=(vCurrentPosition.xy/vCurrentPosition.w)*0.5+0.5;\nvec2 b=(vPreviousPosition.xy/vPreviousPosition.w)*0.5+0.5;\nvec2 velocity=abs(a-b);\nvelocity=vec2(pow(velocity.x,1.0/3.0),pow(velocity.y,1.0/3.0))*sign(a-b)*0.5+0.5;\ngl_FragData[PREPASS_VELOCITY_INDEX]=vec4(velocity,0.0,writeGeometryInfo);\n#endif\n#ifdef PREPASS_IRRADIANCE\ngl_FragData[PREPASS_IRRADIANCE_INDEX]=vec4(0.0,0.0,0.0,writeGeometryInfo); \n#endif\n#ifdef PREPASS_DEPTH\ngl_FragData[PREPASS_DEPTH_INDEX]=vec4(vViewPos.z,0.0,0.0,writeGeometryInfo); \n#endif\n#ifdef PREPASS_NORMAL\ngl_FragData[PREPASS_NORMAL_INDEX]=vec4(normalize((view*vec4(normalW,0.0)).rgb),writeGeometryInfo); \n#endif\n#ifdef PREPASS_ALBEDO_SQRT\ngl_FragData[PREPASS_ALBEDO_SQRT_INDEX]=vec4(0.0,0.0,0.0,writeGeometryInfo); \n#endif\n#ifdef PREPASS_REFLECTIVITY\n#if defined(SPECULARTERM)\n#if defined(SPECULAR)\ngl_FragData[PREPASS_REFLECTIVITY_INDEX]=vec4(toLinearSpace(specularMapColor))*writeGeometryInfo; \n#else\ngl_FragData[PREPASS_REFLECTIVITY_INDEX]=vec4(toLinearSpace(specularColor),1.0)*writeGeometryInfo;\n#endif\n#else\ngl_FragData[PREPASS_REFLECTIVITY_INDEX]=vec4(0.0,0.0,0.0,1.0)*writeGeometryInfo;\n#endif\n#endif\n#endif\n#if !defined(PREPASS) || defined(WEBGL2)\ngl_FragColor=color;\n#endif\n#include<oitFragment>\n#if ORDER_INDEPENDENT_TRANSPARENCY\nif (fragDepth==nearestDepth) {\nfrontColor.rgb+=color.rgb*color.a*alphaMultiplier;\nfrontColor.a=1.0-alphaMultiplier*(1.0-color.a);\n} else {\nbackColor+=color;\n}\n#endif\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n",i(5613);x.v.IncludesShadersStore.defaultVertexDeclaration="uniform mat4 viewProjection;\nuniform mat4 view;\n#ifdef DIFFUSE\nuniform mat4 diffuseMatrix;\nuniform vec2 vDiffuseInfos;\n#endif\n#ifdef AMBIENT\nuniform mat4 ambientMatrix;\nuniform vec2 vAmbientInfos;\n#endif\n#ifdef OPACITY\nuniform mat4 opacityMatrix;\nuniform vec2 vOpacityInfos;\n#endif\n#ifdef EMISSIVE\nuniform vec2 vEmissiveInfos;\nuniform mat4 emissiveMatrix;\n#endif\n#ifdef LIGHTMAP\nuniform vec2 vLightmapInfos;\nuniform mat4 lightmapMatrix;\n#endif\n#if defined(SPECULAR) && defined(SPECULARTERM)\nuniform vec2 vSpecularInfos;\nuniform mat4 specularMatrix;\n#endif\n#ifdef BUMP\nuniform vec3 vBumpInfos;\nuniform mat4 bumpMatrix;\n#endif\n#ifdef REFLECTION\nuniform mat4 reflectionMatrix;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\n#ifdef DETAIL\nuniform vec4 vDetailInfos;\nuniform mat4 detailMatrix;\n#endif\n#include<decalVertexDeclaration>\n#define ADDITIONAL_VERTEX_DECLARATION\n",i(6467),i(7520),i(493),i(1063),i(7019),i(9478),i(2838),i(6343),i(9042),i(1542),i(9935),i(9901),i(8073),i(6757),i(9085),i(6883),i(6655),i(3206),i(8741),i(3088),i(2508),i(6255),i(5215),i(962),i(1101),i(9025);x.v.IncludesShadersStore.pointCloudVertex="#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n",i(5501);x.v.ShadersStore.defaultVertexShader="#include<__decl__defaultVertex>\n#define CUSTOM_VERTEX_BEGIN\nattribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#ifdef TANGENT\nattribute vec4 tangent;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#include<uvAttributeDeclaration>[2..7]\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<helperFunctions>\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\n#include<prePassVertexDeclaration>\n#include<mainUVVaryingDeclaration>[1..7]\n#include<samplerVertexDeclaration>(_DEFINENAME_,DIFFUSE,_VARYINGNAME_,Diffuse)\n#include<samplerVertexDeclaration>(_DEFINENAME_,DETAIL,_VARYINGNAME_,Detail)\n#include<samplerVertexDeclaration>(_DEFINENAME_,AMBIENT,_VARYINGNAME_,Ambient)\n#include<samplerVertexDeclaration>(_DEFINENAME_,OPACITY,_VARYINGNAME_,Opacity)\n#include<samplerVertexDeclaration>(_DEFINENAME_,EMISSIVE,_VARYINGNAME_,Emissive)\n#include<samplerVertexDeclaration>(_DEFINENAME_,LIGHTMAP,_VARYINGNAME_,Lightmap)\n#if defined(SPECULARTERM)\n#include<samplerVertexDeclaration>(_DEFINENAME_,SPECULAR,_VARYINGNAME_,Specular)\n#endif\n#include<samplerVertexDeclaration>(_DEFINENAME_,BUMP,_VARYINGNAME_,Bump)\n#include<samplerVertexDeclaration>(_DEFINENAME_,DECAL,_VARYINGNAME_,Decal)\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#include<bumpVertexDeclaration>\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightVxFragment>[0..maxSimultaneousLights]\n#include<morphTargetsVertexGlobalDeclaration>\n#include<morphTargetsVertexDeclaration>[0..maxSimultaneousMorphTargets]\n#ifdef REFLECTIONMAP_SKYBOX\nvarying vec3 vPositionUVW;\n#endif\n#if defined(REFLECTIONMAP_EQUIRECTANGULAR_FIXED) || defined(REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED)\nvarying vec3 vDirectionW;\n#endif\n#include<logDepthDeclaration>\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nvec3 positionUpdated=position;\n#ifdef NORMAL\nvec3 normalUpdated=normal;\n#endif\n#ifdef TANGENT\nvec4 tangentUpdated=tangent;\n#endif\n#ifdef UV1\nvec2 uvUpdated=uv;\n#endif\n#include<morphTargetsVertexGlobal>\n#include<morphTargetsVertex>[0..maxSimultaneousMorphTargets]\n#ifdef REFLECTIONMAP_SKYBOX\nvPositionUVW=positionUpdated;\n#endif\n#define CUSTOM_VERTEX_UPDATE_POSITION\n#define CUSTOM_VERTEX_UPDATE_NORMAL\n#include<instancesVertex>\n#if defined(PREPASS) && defined(PREPASS_VELOCITY) && !defined(BONES_VELOCITY_ENABLED)\nvCurrentPosition=viewProjection*finalWorld*vec4(positionUpdated,1.0);\nvPreviousPosition=previousViewProjection*finalPreviousWorld*vec4(positionUpdated,1.0);\n#endif\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(positionUpdated,1.0);\n#ifdef NORMAL\nmat3 normalWorld=mat3(finalWorld);\n#if defined(INSTANCES) && defined(THIN_INSTANCES)\nvNormalW=normalUpdated/vec3(dot(normalWorld[0],normalWorld[0]),dot(normalWorld[1],normalWorld[1]),dot(normalWorld[2],normalWorld[2]));\nvNormalW=normalize(normalWorld*vNormalW);\n#else\n#ifdef NONUNIFORMSCALING\nnormalWorld=transposeMat3(inverseMat3(normalWorld));\n#endif\nvNormalW=normalize(normalWorld*normalUpdated);\n#endif\n#endif\n#define CUSTOM_VERTEX_UPDATE_WORLDPOS\n#ifdef MULTIVIEW\nif (gl_ViewID_OVR==0u) {\ngl_Position=viewProjection*worldPos;\n} else {\ngl_Position=viewProjectionR*worldPos;\n}\n#else\ngl_Position=viewProjection*worldPos;\n#endif\nvPositionW=vec3(worldPos);\n#include<prePassVertex>\n#if defined(REFLECTIONMAP_EQUIRECTANGULAR_FIXED) || defined(REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED)\nvDirectionW=normalize(vec3(finalWorld*vec4(positionUpdated,0.0)));\n#endif\n#ifndef UV1\nvec2 uvUpdated=vec2(0.,0.);\n#endif\n#ifdef MAINUV1\nvMainUV1=uvUpdated;\n#endif\n#include<uvVariableDeclaration>[2..7]\n#include<samplerVertexImplementation>(_DEFINENAME_,DIFFUSE,_VARYINGNAME_,Diffuse,_MATRIXNAME_,diffuse,_INFONAME_,DiffuseInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,DETAIL,_VARYINGNAME_,Detail,_MATRIXNAME_,detail,_INFONAME_,DetailInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,AMBIENT,_VARYINGNAME_,Ambient,_MATRIXNAME_,ambient,_INFONAME_,AmbientInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,OPACITY,_VARYINGNAME_,Opacity,_MATRIXNAME_,opacity,_INFONAME_,OpacityInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,EMISSIVE,_VARYINGNAME_,Emissive,_MATRIXNAME_,emissive,_INFONAME_,EmissiveInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,LIGHTMAP,_VARYINGNAME_,Lightmap,_MATRIXNAME_,lightmap,_INFONAME_,LightmapInfos.x)\n#if defined(SPECULARTERM)\n#include<samplerVertexImplementation>(_DEFINENAME_,SPECULAR,_VARYINGNAME_,Specular,_MATRIXNAME_,specular,_INFONAME_,SpecularInfos.x)\n#endif\n#include<samplerVertexImplementation>(_DEFINENAME_,BUMP,_VARYINGNAME_,Bump,_MATRIXNAME_,bump,_INFONAME_,BumpInfos.x)\n#include<samplerVertexImplementation>(_DEFINENAME_,DECAL,_VARYINGNAME_,Decal,_MATRIXNAME_,decal,_INFONAME_,DecalInfos.x)\n#include<bumpVertex>\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#include<vertexColorMixing>\n#include<pointCloudVertex>\n#include<logDepthVertex>\n#define CUSTOM_VERTEX_MAIN_END\n}\n";var b=i(1434),T=i(6150),S=i(99);const E={effect:null,subMesh:null};class C extends f.H{constructor(e){super(e),this.MAINUV1=!1,this.MAINUV2=!1,this.MAINUV3=!1,this.MAINUV4=!1,this.MAINUV5=!1,this.MAINUV6=!1,this.DIFFUSE=!1,this.DIFFUSEDIRECTUV=0,this.BAKED_VERTEX_ANIMATION_TEXTURE=!1,this.AMBIENT=!1,this.AMBIENTDIRECTUV=0,this.OPACITY=!1,this.OPACITYDIRECTUV=0,this.OPACITYRGB=!1,this.REFLECTION=!1,this.EMISSIVE=!1,this.EMISSIVEDIRECTUV=0,this.SPECULAR=!1,this.SPECULARDIRECTUV=0,this.BUMP=!1,this.BUMPDIRECTUV=0,this.PARALLAX=!1,this.PARALLAXOCCLUSION=!1,this.SPECULAROVERALPHA=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.ALPHAFROMDIFFUSE=!1,this.POINTSIZE=!1,this.FOG=!1,this.SPECULARTERM=!1,this.DIFFUSEFRESNEL=!1,this.OPACITYFRESNEL=!1,this.REFLECTIONFRESNEL=!1,this.REFRACTIONFRESNEL=!1,this.EMISSIVEFRESNEL=!1,this.FRESNEL=!1,this.NORMAL=!1,this.TANGENT=!1,this.UV1=!1,this.UV2=!1,this.UV3=!1,this.UV4=!1,this.UV5=!1,this.UV6=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.BONETEXTURE=!1,this.BONES_VELOCITY_ENABLED=!1,this.INSTANCES=!1,this.THIN_INSTANCES=!1,this.INSTANCESCOLOR=!1,this.GLOSSINESS=!1,this.ROUGHNESS=!1,this.EMISSIVEASILLUMINATION=!1,this.LINKEMISSIVEWITHDIFFUSE=!1,this.REFLECTIONFRESNELFROMSPECULAR=!1,this.LIGHTMAP=!1,this.LIGHTMAPDIRECTUV=0,this.OBJECTSPACE_NORMALMAP=!1,this.USELIGHTMAPASSHADOWMAP=!1,this.REFLECTIONMAP_3D=!1,this.REFLECTIONMAP_SPHERICAL=!1,this.REFLECTIONMAP_PLANAR=!1,this.REFLECTIONMAP_CUBIC=!1,this.USE_LOCAL_REFLECTIONMAP_CUBIC=!1,this.USE_LOCAL_REFRACTIONMAP_CUBIC=!1,this.REFLECTIONMAP_PROJECTION=!1,this.REFLECTIONMAP_SKYBOX=!1,this.REFLECTIONMAP_EXPLICIT=!1,this.REFLECTIONMAP_EQUIRECTANGULAR=!1,this.REFLECTIONMAP_EQUIRECTANGULAR_FIXED=!1,this.REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED=!1,this.REFLECTIONMAP_OPPOSITEZ=!1,this.INVERTCUBICMAP=!1,this.LOGARITHMICDEPTH=!1,this.REFRACTION=!1,this.REFRACTIONMAP_3D=!1,this.REFLECTIONOVERALPHA=!1,this.TWOSIDEDLIGHTING=!1,this.SHADOWFLOAT=!1,this.MORPHTARGETS=!1,this.MORPHTARGETS_NORMAL=!1,this.MORPHTARGETS_TANGENT=!1,this.MORPHTARGETS_UV=!1,this.NUM_MORPH_INFLUENCERS=0,this.MORPHTARGETS_TEXTURE=!1,this.NONUNIFORMSCALING=!1,this.PREMULTIPLYALPHA=!1,this.ALPHATEST_AFTERALLALPHACOMPUTATIONS=!1,this.ALPHABLEND=!0,this.PREPASS=!1,this.PREPASS_IRRADIANCE=!1,this.PREPASS_IRRADIANCE_INDEX=-1,this.PREPASS_ALBEDO_SQRT=!1,this.PREPASS_ALBEDO_SQRT_INDEX=-1,this.PREPASS_DEPTH=!1,this.PREPASS_DEPTH_INDEX=-1,this.PREPASS_NORMAL=!1,this.PREPASS_NORMAL_INDEX=-1,this.PREPASS_POSITION=!1,this.PREPASS_POSITION_INDEX=-1,this.PREPASS_VELOCITY=!1,this.PREPASS_VELOCITY_INDEX=-1,this.PREPASS_REFLECTIVITY=!1,this.PREPASS_REFLECTIVITY_INDEX=-1,this.SCENE_MRT_COUNT=0,this.RGBDLIGHTMAP=!1,this.RGBDREFLECTION=!1,this.RGBDREFRACTION=!1,this.IMAGEPROCESSING=!1,this.VIGNETTE=!1,this.VIGNETTEBLENDMODEMULTIPLY=!1,this.VIGNETTEBLENDMODEOPAQUE=!1,this.TONEMAPPING=!1,this.TONEMAPPING_ACES=!1,this.CONTRAST=!1,this.COLORCURVES=!1,this.COLORGRADING=!1,this.COLORGRADING3D=!1,this.SAMPLER3DGREENDEPTH=!1,this.SAMPLER3DBGRMAP=!1,this.DITHER=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.MULTIVIEW=!1,this.ORDER_INDEPENDENT_TRANSPARENCY=!1,this.ORDER_INDEPENDENT_TRANSPARENCY_16BITS=!1,this.CAMERA_ORTHOGRAPHIC=!1,this.CAMERA_PERSPECTIVE=!1,this.IS_REFLECTION_LINEAR=!1,this.IS_REFRACTION_LINEAR=!1,this.EXPOSURE=!1,this.rebuild()}setReflectionMode(e){const t=["REFLECTIONMAP_CUBIC","REFLECTIONMAP_EXPLICIT","REFLECTIONMAP_PLANAR","REFLECTIONMAP_PROJECTION","REFLECTIONMAP_PROJECTION","REFLECTIONMAP_SKYBOX","REFLECTIONMAP_SPHERICAL","REFLECTIONMAP_EQUIRECTANGULAR","REFLECTIONMAP_EQUIRECTANGULAR_FIXED","REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED"];for(const i of t)this[i]=i===e}}class A extends _.a{get imageProcessingConfiguration(){return this._imageProcessingConfiguration}set imageProcessingConfiguration(e){this._attachImageProcessingConfiguration(e),this._markAllSubMeshesAsTexturesDirty()}_attachImageProcessingConfiguration(e){e!==this._imageProcessingConfiguration&&(this._imageProcessingConfiguration&&this._imageProcessingObserver&&this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver),this._imageProcessingConfiguration=e||this.getScene().imageProcessingConfiguration,this._imageProcessingConfiguration&&(this._imageProcessingObserver=this._imageProcessingConfiguration.onUpdateParameters.add((()=>{this._markAllSubMeshesAsImageProcessingDirty()}))))}get isPrePassCapable(){return!this.disableDepthWrite}get cameraColorCurvesEnabled(){return this.imageProcessingConfiguration.colorCurvesEnabled}set cameraColorCurvesEnabled(e){this.imageProcessingConfiguration.colorCurvesEnabled=e}get cameraColorGradingEnabled(){return this.imageProcessingConfiguration.colorGradingEnabled}set cameraColorGradingEnabled(e){this.imageProcessingConfiguration.colorGradingEnabled=e}get cameraToneMappingEnabled(){return this._imageProcessingConfiguration.toneMappingEnabled}set cameraToneMappingEnabled(e){this._imageProcessingConfiguration.toneMappingEnabled=e}get cameraExposure(){return this._imageProcessingConfiguration.exposure}set cameraExposure(e){this._imageProcessingConfiguration.exposure=e}get cameraContrast(){return this._imageProcessingConfiguration.contrast}set cameraContrast(e){this._imageProcessingConfiguration.contrast=e}get cameraColorGradingTexture(){return this._imageProcessingConfiguration.colorGradingTexture}set cameraColorGradingTexture(e){this._imageProcessingConfiguration.colorGradingTexture=e}get cameraColorCurves(){return this._imageProcessingConfiguration.colorCurves}set cameraColorCurves(e){this._imageProcessingConfiguration.colorCurves=e}get canRenderToMRT(){return!0}constructor(e,t){super(e,t),this._diffuseTexture=null,this._ambientTexture=null,this._opacityTexture=null,this._reflectionTexture=null,this._emissiveTexture=null,this._specularTexture=null,this._bumpTexture=null,this._lightmapTexture=null,this._refractionTexture=null,this.ambientColor=new l.Wo(0,0,0),this.diffuseColor=new l.Wo(1,1,1),this.specularColor=new l.Wo(1,1,1),this.emissiveColor=new l.Wo(0,0,0),this.specularPower=64,this._useAlphaFromDiffuseTexture=!1,this._useEmissiveAsIllumination=!1,this._linkEmissiveWithDiffuse=!1,this._useSpecularOverAlpha=!1,this._useReflectionOverAlpha=!1,this._disableLighting=!1,this._useObjectSpaceNormalMap=!1,this._useParallax=!1,this._useParallaxOcclusion=!1,this.parallaxScaleBias=.05,this._roughness=0,this.indexOfRefraction=.98,this.invertRefractionY=!0,this.alphaCutOff=.4,this._useLightmapAsShadowmap=!1,this._useReflectionFresnelFromSpecular=!1,this._useGlossinessFromSpecularMapAlpha=!1,this._maxSimultaneousLights=4,this._invertNormalMapX=!1,this._invertNormalMapY=!1,this._twoSidedLighting=!1,this._renderTargets=new r.t(16),this._worldViewProjectionMatrix=a.y3.Zero(),this._globalAmbientColor=new l.Wo(0,0,0),this._cacheHasRenderTargetTextures=!1,this.detailMap=new T.p(this),this._attachImageProcessingConfiguration(null),this.prePassConfiguration=new c.o,this.getRenderTargetTextures=()=>(this._renderTargets.reset(),A.ReflectionTextureEnabled&&this._reflectionTexture&&this._reflectionTexture.isRenderTarget&&this._renderTargets.push(this._reflectionTexture),A.RefractionTextureEnabled&&this._refractionTexture&&this._refractionTexture.isRenderTarget&&this._renderTargets.push(this._refractionTexture),this._eventInfo.renderTargets=this._renderTargets,this._callbackPluginEventFillRenderTargetTextures(this._eventInfo),this._renderTargets)}get hasRenderTargetTextures(){return!!(A.ReflectionTextureEnabled&&this._reflectionTexture&&this._reflectionTexture.isRenderTarget)||!!(A.RefractionTextureEnabled&&this._refractionTexture&&this._refractionTexture.isRenderTarget)||this._cacheHasRenderTargetTextures}getClassName(){return"StandardMaterial"}get useLogarithmicDepth(){return this._useLogarithmicDepth}set useLogarithmicDepth(e){this._useLogarithmicDepth=e&&this.getScene().getEngine().getCaps().fragmentDepthSupported,this._markAllSubMeshesAsMiscDirty()}needAlphaBlending(){return!this._disableAlphaBlending&&(this.alpha<1||null!=this._opacityTexture||this._shouldUseAlphaFromDiffuseTexture()||this._opacityFresnelParameters&&this._opacityFresnelParameters.isEnabled)}needAlphaTesting(){return!!this._forceAlphaTest||this._hasAlphaChannel()&&(null==this._transparencyMode||this._transparencyMode===d.F.MATERIAL_ALPHATEST)}_shouldUseAlphaFromDiffuseTexture(){return null!=this._diffuseTexture&&this._diffuseTexture.hasAlpha&&this._useAlphaFromDiffuseTexture&&this._transparencyMode!==d.F.MATERIAL_OPAQUE}_hasAlphaChannel(){return null!=this._diffuseTexture&&this._diffuseTexture.hasAlpha||null!=this._opacityTexture}getAlphaTestTexture(){return this._diffuseTexture}isReadyForSubMesh(e,t,i=!1){if(this._uniformBufferLayoutBuilt||this.buildUniformLayout(),t.effect&&this.isFrozen&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(this._callbackPluginEventGeneric(p.S.GetDefineNames,this._eventInfo),t.materialDefines=new C(this._eventInfo.defineNames));const n=this.getScene(),s=t.materialDefines;if(this._isReadyForSubMesh(t))return!0;const r=n.getEngine();s._needNormals=m.G.PrepareDefinesForLights(n,e,s,!0,this._maxSimultaneousLights,this._disableLighting),m.G.PrepareDefinesForMultiview(n,s);const o=this.needAlphaBlendingForMesh(e)&&this.getScene().useOrderIndependentTransparency;if(m.G.PrepareDefinesForPrePass(n,s,this.canRenderToMRT&&!o),m.G.PrepareDefinesForOIT(n,s,o),s._areTexturesDirty){this._eventInfo.hasRenderTargetTextures=!1,this._callbackPluginEventHasRenderTargetTextures(this._eventInfo),this._cacheHasRenderTargetTextures=this._eventInfo.hasRenderTargetTextures,s._needUVs=!1;for(let e=1;e<=6;++e)s["MAINUV"+e]=!1;if(n.texturesEnabled){if(s.DIFFUSEDIRECTUV=0,s.BUMPDIRECTUV=0,s.AMBIENTDIRECTUV=0,s.OPACITYDIRECTUV=0,s.EMISSIVEDIRECTUV=0,s.SPECULARDIRECTUV=0,s.LIGHTMAPDIRECTUV=0,this._diffuseTexture&&A.DiffuseTextureEnabled){if(!this._diffuseTexture.isReadyOrNotBlocking())return!1;m.G.PrepareDefinesForMergedUV(this._diffuseTexture,s,"DIFFUSE")}else s.DIFFUSE=!1;if(this._ambientTexture&&A.AmbientTextureEnabled){if(!this._ambientTexture.isReadyOrNotBlocking())return!1;m.G.PrepareDefinesForMergedUV(this._ambientTexture,s,"AMBIENT")}else s.AMBIENT=!1;if(this._opacityTexture&&A.OpacityTextureEnabled){if(!this._opacityTexture.isReadyOrNotBlocking())return!1;m.G.PrepareDefinesForMergedUV(this._opacityTexture,s,"OPACITY"),s.OPACITYRGB=this._opacityTexture.getAlphaFromRGB}else s.OPACITY=!1;if(this._reflectionTexture&&A.ReflectionTextureEnabled){if(!this._reflectionTexture.isReadyOrNotBlocking())return!1;switch(s._needNormals=!0,s.REFLECTION=!0,s.ROUGHNESS=this._roughness>0,s.REFLECTIONOVERALPHA=this._useReflectionOverAlpha,s.INVERTCUBICMAP=this._reflectionTexture.coordinatesMode===g.x.INVCUBIC_MODE,s.REFLECTIONMAP_3D=this._reflectionTexture.isCube,s.REFLECTIONMAP_OPPOSITEZ=s.REFLECTIONMAP_3D&&this.getScene().useRightHandedSystem?!this._reflectionTexture.invertZ:this._reflectionTexture.invertZ,s.RGBDREFLECTION=this._reflectionTexture.isRGBD,this._reflectionTexture.coordinatesMode){case g.x.EXPLICIT_MODE:s.setReflectionMode("REFLECTIONMAP_EXPLICIT");break;case g.x.PLANAR_MODE:s.setReflectionMode("REFLECTIONMAP_PLANAR");break;case g.x.PROJECTION_MODE:s.setReflectionMode("REFLECTIONMAP_PROJECTION");break;case g.x.SKYBOX_MODE:s.setReflectionMode("REFLECTIONMAP_SKYBOX");break;case g.x.SPHERICAL_MODE:s.setReflectionMode("REFLECTIONMAP_SPHERICAL");break;case g.x.EQUIRECTANGULAR_MODE:s.setReflectionMode("REFLECTIONMAP_EQUIRECTANGULAR");break;case g.x.FIXED_EQUIRECTANGULAR_MODE:s.setReflectionMode("REFLECTIONMAP_EQUIRECTANGULAR_FIXED");break;case g.x.FIXED_EQUIRECTANGULAR_MIRRORED_MODE:s.setReflectionMode("REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED");break;case g.x.CUBIC_MODE:case g.x.INVCUBIC_MODE:default:s.setReflectionMode("REFLECTIONMAP_CUBIC")}s.USE_LOCAL_REFLECTIONMAP_CUBIC=!!this._reflectionTexture.boundingBoxSize}else s.REFLECTION=!1,s.REFLECTIONMAP_OPPOSITEZ=!1;if(this._emissiveTexture&&A.EmissiveTextureEnabled){if(!this._emissiveTexture.isReadyOrNotBlocking())return!1;m.G.PrepareDefinesForMergedUV(this._emissiveTexture,s,"EMISSIVE")}else s.EMISSIVE=!1;if(this._lightmapTexture&&A.LightmapTextureEnabled){if(!this._lightmapTexture.isReadyOrNotBlocking())return!1;m.G.PrepareDefinesForMergedUV(this._lightmapTexture,s,"LIGHTMAP"),s.USELIGHTMAPASSHADOWMAP=this._useLightmapAsShadowmap,s.RGBDLIGHTMAP=this._lightmapTexture.isRGBD}else s.LIGHTMAP=!1;if(this._specularTexture&&A.SpecularTextureEnabled){if(!this._specularTexture.isReadyOrNotBlocking())return!1;m.G.PrepareDefinesForMergedUV(this._specularTexture,s,"SPECULAR"),s.GLOSSINESS=this._useGlossinessFromSpecularMapAlpha}else s.SPECULAR=!1;if(n.getEngine().getCaps().standardDerivatives&&this._bumpTexture&&A.BumpTextureEnabled){if(!this._bumpTexture.isReady())return!1;m.G.PrepareDefinesForMergedUV(this._bumpTexture,s,"BUMP"),s.PARALLAX=this._useParallax,s.PARALLAXOCCLUSION=this._useParallaxOcclusion,s.OBJECTSPACE_NORMALMAP=this._useObjectSpaceNormalMap}else s.BUMP=!1,s.PARALLAX=!1,s.PARALLAXOCCLUSION=!1;if(this._refractionTexture&&A.RefractionTextureEnabled){if(!this._refractionTexture.isReadyOrNotBlocking())return!1;s._needUVs=!0,s.REFRACTION=!0,s.REFRACTIONMAP_3D=this._refractionTexture.isCube,s.RGBDREFRACTION=this._refractionTexture.isRGBD,s.USE_LOCAL_REFRACTIONMAP_CUBIC=!!this._refractionTexture.boundingBoxSize}else s.REFRACTION=!1;s.TWOSIDEDLIGHTING=!this._backFaceCulling&&this._twoSidedLighting}else s.DIFFUSE=!1,s.AMBIENT=!1,s.OPACITY=!1,s.REFLECTION=!1,s.EMISSIVE=!1,s.LIGHTMAP=!1,s.BUMP=!1,s.REFRACTION=!1;s.ALPHAFROMDIFFUSE=this._shouldUseAlphaFromDiffuseTexture(),s.EMISSIVEASILLUMINATION=this._useEmissiveAsIllumination,s.LINKEMISSIVEWITHDIFFUSE=this._linkEmissiveWithDiffuse,s.SPECULAROVERALPHA=this._useSpecularOverAlpha,s.PREMULTIPLYALPHA=7===this.alphaMode||8===this.alphaMode,s.ALPHATEST_AFTERALLALPHACOMPUTATIONS=null!==this.transparencyMode,s.ALPHABLEND=null===this.transparencyMode||this.needAlphaBlendingForMesh(e)}if(this._eventInfo.isReadyForSubMesh=!0,this._eventInfo.defines=s,this._eventInfo.subMesh=t,this._callbackPluginEventIsReadyForSubMesh(this._eventInfo),!this._eventInfo.isReadyForSubMesh)return!1;if(s._areImageProcessingDirty&&this._imageProcessingConfiguration){if(!this._imageProcessingConfiguration.isReady())return!1;this._imageProcessingConfiguration.prepareDefines(s),s.IS_REFLECTION_LINEAR=null!=this.reflectionTexture&&!this.reflectionTexture.gammaSpace,s.IS_REFRACTION_LINEAR=null!=this.refractionTexture&&!this.refractionTexture.gammaSpace}s._areFresnelDirty&&(A.FresnelEnabled?(this._diffuseFresnelParameters||this._opacityFresnelParameters||this._emissiveFresnelParameters||this._refractionFresnelParameters||this._reflectionFresnelParameters)&&(s.DIFFUSEFRESNEL=this._diffuseFresnelParameters&&this._diffuseFresnelParameters.isEnabled,s.OPACITYFRESNEL=this._opacityFresnelParameters&&this._opacityFresnelParameters.isEnabled,s.REFLECTIONFRESNEL=this._reflectionFresnelParameters&&this._reflectionFresnelParameters.isEnabled,s.REFLECTIONFRESNELFROMSPECULAR=this._useReflectionFresnelFromSpecular,s.REFRACTIONFRESNEL=this._refractionFresnelParameters&&this._refractionFresnelParameters.isEnabled,s.EMISSIVEFRESNEL=this._emissiveFresnelParameters&&this._emissiveFresnelParameters.isEnabled,s._needNormals=!0,s.FRESNEL=!0):s.FRESNEL=!1),m.G.PrepareDefinesForMisc(e,n,this._useLogarithmicDepth,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e)||this._forceAlphaTest,s),m.G.PrepareDefinesForFrameBoundValues(n,r,this,s,i,null,t.getRenderingMesh().hasThinInstances),this._eventInfo.defines=s,this._eventInfo.mesh=e,this._callbackPluginEventPrepareDefinesBeforeAttributes(this._eventInfo),m.G.PrepareDefinesForAttributes(e,s,!0,!0,!0),this._callbackPluginEventPrepareDefines(this._eventInfo);let a=!1;if(s.isDirty){const i=s._areLightsDisposed;s.markAsProcessed();const o=new b.L;s.REFLECTION&&o.addFallback(0,"REFLECTION"),s.SPECULAR&&o.addFallback(0,"SPECULAR"),s.BUMP&&o.addFallback(0,"BUMP"),s.PARALLAX&&o.addFallback(1,"PARALLAX"),s.PARALLAXOCCLUSION&&o.addFallback(0,"PARALLAXOCCLUSION"),s.SPECULAROVERALPHA&&o.addFallback(0,"SPECULAROVERALPHA"),s.FOG&&o.addFallback(1,"FOG"),s.POINTSIZE&&o.addFallback(0,"POINTSIZE"),s.LOGARITHMICDEPTH&&o.addFallback(0,"LOGARITHMICDEPTH"),m.G.HandleFallbacksForShadows(s,o,this._maxSimultaneousLights),s.SPECULARTERM&&o.addFallback(0,"SPECULARTERM"),s.DIFFUSEFRESNEL&&o.addFallback(1,"DIFFUSEFRESNEL"),s.OPACITYFRESNEL&&o.addFallback(2,"OPACITYFRESNEL"),s.REFLECTIONFRESNEL&&o.addFallback(3,"REFLECTIONFRESNEL"),s.EMISSIVEFRESNEL&&o.addFallback(4,"EMISSIVEFRESNEL"),s.FRESNEL&&o.addFallback(4,"FRESNEL"),s.MULTIVIEW&&o.addFallback(0,"MULTIVIEW");const l=[h.o.PositionKind];s.NORMAL&&l.push(h.o.NormalKind),s.TANGENT&&l.push(h.o.TangentKind);for(let e=1;e<=6;++e)s["UV"+e]&&l.push(`uv${1===e?"":e}`);s.VERTEXCOLOR&&l.push(h.o.ColorKind),m.G.PrepareAttributesForBones(l,e,s,o),m.G.PrepareAttributesForInstances(l,s),m.G.PrepareAttributesForMorphTargets(l,e,s),m.G.PrepareAttributesForBakedVertexAnimation(l,e,s);let d="default";const f=["world","view","viewProjection","vEyePosition","vLightsType","vAmbientColor","vDiffuseColor","vSpecularColor","vEmissiveColor","visibility","vFogInfos","vFogColor","pointSize","vDiffuseInfos","vAmbientInfos","vOpacityInfos","vReflectionInfos","vEmissiveInfos","vSpecularInfos","vBumpInfos","vLightmapInfos","vRefractionInfos","mBones","diffuseMatrix","ambientMatrix","opacityMatrix","reflectionMatrix","emissiveMatrix","specularMatrix","bumpMatrix","normalMatrix","lightmapMatrix","refractionMatrix","diffuseLeftColor","diffuseRightColor","opacityParts","reflectionLeftColor","reflectionRightColor","emissiveLeftColor","emissiveRightColor","refractionLeftColor","refractionRightColor","vReflectionPosition","vReflectionSize","vRefractionPosition","vRefractionSize","logarithmicDepthConstant","vTangentSpaceParams","alphaCutOff","boneTextureWidth","morphTargetTextureInfo","morphTargetTextureIndices"],_=["diffuseSampler","ambientSampler","opacitySampler","reflectionCubeSampler","reflection2DSampler","emissiveSampler","specularSampler","bumpSampler","lightmapSampler","refractionCubeSampler","refraction2DSampler","boneSampler","morphTargets","oitDepthSampler","oitFrontColorSampler"],g=["Material","Scene","Mesh"];this._eventInfo.fallbacks=o,this._eventInfo.fallbackRank=0,this._eventInfo.defines=s,this._eventInfo.uniforms=f,this._eventInfo.attributes=l,this._eventInfo.samplers=_,this._eventInfo.uniformBuffersNames=g,this._eventInfo.customCode=void 0,this._eventInfo.mesh=e,this._callbackPluginEventGeneric(p.S.PrepareEffect,this._eventInfo),c.o.AddUniforms(f),c.o.AddSamplers(_),u.$&&(u.$.PrepareUniforms(f,s),u.$.PrepareSamplers(_,s)),m.G.PrepareUniformsAndSamplersList({uniformsNames:f,uniformBuffersNames:g,samplers:_,defines:s,maxSimultaneousLights:this._maxSimultaneousLights}),(0,S.qx)(f);const v={};this.customShaderNameResolve&&(d=this.customShaderNameResolve(d,f,g,_,s,l,v));const y=s.toString(),x=t.effect;let T=n.getEngine().createEffect(d,{attributes:l,uniformsNames:f,uniformBuffersNames:g,samplers:_,defines:y,fallbacks:o,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:this._maxSimultaneousLights,maxSimultaneousMorphTargets:s.NUM_MORPH_INFLUENCERS},processFinalCode:v.processFinalCode,processCodeAfterIncludes:this._eventInfo.customCode,multiTarget:s.PREPASS},r);if(this._eventInfo.customCode=void 0,T)if(this._onEffectCreatedObservable&&(E.effect=T,E.subMesh=t,this._onEffectCreatedObservable.notifyObservers(E)),this.allowShaderHotSwapping&&x&&!T.isReady()){if(T=x,s.markAsUnprocessed(),a=this.isFrozen,i)return s._areLightsDisposed=!0,!1}else n.resetCachedMaterial(),t.setEffect(T,s,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(s._renderId=n.getRenderId(),t.effect._wasPreviouslyReady=!a,t.effect._wasPreviouslyUsingInstances=i,this._checkScenePerformancePriority(),0))}buildUniformLayout(){const e=this._uniformBuffer;e.addUniform("diffuseLeftColor",4),e.addUniform("diffuseRightColor",4),e.addUniform("opacityParts",4),e.addUniform("reflectionLeftColor",4),e.addUniform("reflectionRightColor",4),e.addUniform("refractionLeftColor",4),e.addUniform("refractionRightColor",4),e.addUniform("emissiveLeftColor",4),e.addUniform("emissiveRightColor",4),e.addUniform("vDiffuseInfos",2),e.addUniform("vAmbientInfos",2),e.addUniform("vOpacityInfos",2),e.addUniform("vReflectionInfos",2),e.addUniform("vReflectionPosition",3),e.addUniform("vReflectionSize",3),e.addUniform("vEmissiveInfos",2),e.addUniform("vLightmapInfos",2),e.addUniform("vSpecularInfos",2),e.addUniform("vBumpInfos",3),e.addUniform("diffuseMatrix",16),e.addUniform("ambientMatrix",16),e.addUniform("opacityMatrix",16),e.addUniform("reflectionMatrix",16),e.addUniform("emissiveMatrix",16),e.addUniform("lightmapMatrix",16),e.addUniform("specularMatrix",16),e.addUniform("bumpMatrix",16),e.addUniform("vTangentSpaceParams",2),e.addUniform("pointSize",1),e.addUniform("alphaCutOff",1),e.addUniform("refractionMatrix",16),e.addUniform("vRefractionInfos",4),e.addUniform("vRefractionPosition",3),e.addUniform("vRefractionSize",3),e.addUniform("vSpecularColor",4),e.addUniform("vEmissiveColor",3),e.addUniform("vDiffuseColor",4),e.addUniform("vAmbientColor",3),super.buildUniformLayout()}bindForSubMesh(e,t,i){var n;const s=this.getScene(),r=i.materialDefines;if(!r)return;const a=i.effect;if(!a)return;this._activeEffect=a,t.getMeshUniformBuffer().bindToEffect(a,"Mesh"),t.transferToEffect(e),this._uniformBuffer.bindToEffect(a,"Material"),this.prePassConfiguration.bindForSubMesh(this._activeEffect,s,t,e,this.isFrozen),this._eventInfo.subMesh=i,this._callbackPluginEventHardBindForSubMesh(this._eventInfo),r.OBJECTSPACE_NORMALMAP&&(e.toNormalMatrix(this._normalMatrix),this.bindOnlyNormalMatrix(this._normalMatrix));const h=a._forceRebindOnNextCall||this._mustRebind(s,a,t.visibility);m.G.BindBonesParameters(t,a);const c=this._uniformBuffer;if(h){if(this.bindViewProjection(a),!c.useUbo||!this.isFrozen||!c.isSync||a._forceRebindOnNextCall){if(A.FresnelEnabled&&r.FRESNEL&&(this.diffuseFresnelParameters&&this.diffuseFresnelParameters.isEnabled&&(c.updateColor4("diffuseLeftColor",this.diffuseFresnelParameters.leftColor,this.diffuseFresnelParameters.power),c.updateColor4("diffuseRightColor",this.diffuseFresnelParameters.rightColor,this.diffuseFresnelParameters.bias)),this.opacityFresnelParameters&&this.opacityFresnelParameters.isEnabled&&c.updateColor4("opacityParts",new l.Wo(this.opacityFresnelParameters.leftColor.toLuminance(),this.opacityFresnelParameters.rightColor.toLuminance(),this.opacityFresnelParameters.bias),this.opacityFresnelParameters.power),this.reflectionFresnelParameters&&this.reflectionFresnelParameters.isEnabled&&(c.updateColor4("reflectionLeftColor",this.reflectionFresnelParameters.leftColor,this.reflectionFresnelParameters.power),c.updateColor4("reflectionRightColor",this.reflectionFresnelParameters.rightColor,this.reflectionFresnelParameters.bias)),this.refractionFresnelParameters&&this.refractionFresnelParameters.isEnabled&&(c.updateColor4("refractionLeftColor",this.refractionFresnelParameters.leftColor,this.refractionFresnelParameters.power),c.updateColor4("refractionRightColor",this.refractionFresnelParameters.rightColor,this.refractionFresnelParameters.bias)),this.emissiveFresnelParameters&&this.emissiveFresnelParameters.isEnabled&&(c.updateColor4("emissiveLeftColor",this.emissiveFresnelParameters.leftColor,this.emissiveFresnelParameters.power),c.updateColor4("emissiveRightColor",this.emissiveFresnelParameters.rightColor,this.emissiveFresnelParameters.bias))),s.texturesEnabled){if(this._diffuseTexture&&A.DiffuseTextureEnabled&&(c.updateFloat2("vDiffuseInfos",this._diffuseTexture.coordinatesIndex,this._diffuseTexture.level),m.G.BindTextureMatrix(this._diffuseTexture,c,"diffuse")),this._ambientTexture&&A.AmbientTextureEnabled&&(c.updateFloat2("vAmbientInfos",this._ambientTexture.coordinatesIndex,this._ambientTexture.level),m.G.BindTextureMatrix(this._ambientTexture,c,"ambient")),this._opacityTexture&&A.OpacityTextureEnabled&&(c.updateFloat2("vOpacityInfos",this._opacityTexture.coordinatesIndex,this._opacityTexture.level),m.G.BindTextureMatrix(this._opacityTexture,c,"opacity")),this._hasAlphaChannel()&&c.updateFloat("alphaCutOff",this.alphaCutOff),this._reflectionTexture&&A.ReflectionTextureEnabled&&(c.updateFloat2("vReflectionInfos",this._reflectionTexture.level,this.roughness),c.updateMatrix("reflectionMatrix",this._reflectionTexture.getReflectionTextureMatrix()),this._reflectionTexture.boundingBoxSize)){const e=this._reflectionTexture;c.updateVector3("vReflectionPosition",e.boundingBoxPosition),c.updateVector3("vReflectionSize",e.boundingBoxSize)}if(this._emissiveTexture&&A.EmissiveTextureEnabled&&(c.updateFloat2("vEmissiveInfos",this._emissiveTexture.coordinatesIndex,this._emissiveTexture.level),m.G.BindTextureMatrix(this._emissiveTexture,c,"emissive")),this._lightmapTexture&&A.LightmapTextureEnabled&&(c.updateFloat2("vLightmapInfos",this._lightmapTexture.coordinatesIndex,this._lightmapTexture.level),m.G.BindTextureMatrix(this._lightmapTexture,c,"lightmap")),this._specularTexture&&A.SpecularTextureEnabled&&(c.updateFloat2("vSpecularInfos",this._specularTexture.coordinatesIndex,this._specularTexture.level),m.G.BindTextureMatrix(this._specularTexture,c,"specular")),this._bumpTexture&&s.getEngine().getCaps().standardDerivatives&&A.BumpTextureEnabled&&(c.updateFloat3("vBumpInfos",this._bumpTexture.coordinatesIndex,1/this._bumpTexture.level,this.parallaxScaleBias),m.G.BindTextureMatrix(this._bumpTexture,c,"bump"),s._mirroredCameraPosition?c.updateFloat2("vTangentSpaceParams",this._invertNormalMapX?1:-1,this._invertNormalMapY?1:-1):c.updateFloat2("vTangentSpaceParams",this._invertNormalMapX?-1:1,this._invertNormalMapY?-1:1)),this._refractionTexture&&A.RefractionTextureEnabled){let e=1;if(this._refractionTexture.isCube||(c.updateMatrix("refractionMatrix",this._refractionTexture.getReflectionTextureMatrix()),this._refractionTexture.depth&&(e=this._refractionTexture.depth)),c.updateFloat4("vRefractionInfos",this._refractionTexture.level,this.indexOfRefraction,e,this.invertRefractionY?-1:1),this._refractionTexture.boundingBoxSize){const e=this._refractionTexture;c.updateVector3("vRefractionPosition",e.boundingBoxPosition),c.updateVector3("vRefractionSize",e.boundingBoxSize)}}}this.pointsCloud&&c.updateFloat("pointSize",this.pointSize),r.SPECULARTERM&&c.updateColor4("vSpecularColor",this.specularColor,this.specularPower),c.updateColor3("vEmissiveColor",A.EmissiveTextureEnabled?this.emissiveColor:l.Wo.BlackReadOnly),c.updateColor4("vDiffuseColor",this.diffuseColor,this.alpha),s.ambientColor.multiplyToRef(this.ambientColor,this._globalAmbientColor),c.updateColor3("vAmbientColor",this._globalAmbientColor)}s.texturesEnabled&&(this._diffuseTexture&&A.DiffuseTextureEnabled&&a.setTexture("diffuseSampler",this._diffuseTexture),this._ambientTexture&&A.AmbientTextureEnabled&&a.setTexture("ambientSampler",this._ambientTexture),this._opacityTexture&&A.OpacityTextureEnabled&&a.setTexture("opacitySampler",this._opacityTexture),this._reflectionTexture&&A.ReflectionTextureEnabled&&(this._reflectionTexture.isCube?a.setTexture("reflectionCubeSampler",this._reflectionTexture):a.setTexture("reflection2DSampler",this._reflectionTexture)),this._emissiveTexture&&A.EmissiveTextureEnabled&&a.setTexture("emissiveSampler",this._emissiveTexture),this._lightmapTexture&&A.LightmapTextureEnabled&&a.setTexture("lightmapSampler",this._lightmapTexture),this._specularTexture&&A.SpecularTextureEnabled&&a.setTexture("specularSampler",this._specularTexture),this._bumpTexture&&s.getEngine().getCaps().standardDerivatives&&A.BumpTextureEnabled&&a.setTexture("bumpSampler",this._bumpTexture),this._refractionTexture&&A.RefractionTextureEnabled&&(this._refractionTexture.isCube?a.setTexture("refractionCubeSampler",this._refractionTexture):a.setTexture("refraction2DSampler",this._refractionTexture))),this.getScene().useOrderIndependentTransparency&&this.needAlphaBlendingForMesh(t)&&this.getScene().depthPeelingRenderer.bind(a),this._eventInfo.subMesh=i,this._callbackPluginEventBindForSubMesh(this._eventInfo),(0,S.an)(a,this,s),this.bindEyePosition(a)}else s.getEngine()._features.needToAlwaysBindUniformBuffers&&(this._needToBindSceneUbo=!0);!h&&this.isFrozen||(s.lightsEnabled&&!this._disableLighting&&m.G.BindLights(s,t,a,r,this._maxSimultaneousLights),(s.fogEnabled&&t.applyFog&&s.fogMode!==o.x.FOGMODE_NONE||this._reflectionTexture||this._refractionTexture||t.receiveShadows||r.PREPASS)&&this.bindView(a),m.G.BindFogParameters(s,t,a),r.NUM_MORPH_INFLUENCERS&&m.G.BindMorphTargetParameters(t,a),r.BAKED_VERTEX_ANIMATION_TEXTURE&&(null===(n=t.bakedVertexAnimationManager)||void 0===n||n.bind(a,r.INSTANCES)),this.useLogarithmicDepth&&m.G.BindLogDepth(r,a,s),this._imageProcessingConfiguration&&!this._imageProcessingConfiguration.applyByPostProcess&&this._imageProcessingConfiguration.bind(this._activeEffect)),this._afterBind(t,this._activeEffect),c.update()}getAnimatables(){const e=super.getAnimatables();return this._diffuseTexture&&this._diffuseTexture.animations&&this._diffuseTexture.animations.length>0&&e.push(this._diffuseTexture),this._ambientTexture&&this._ambientTexture.animations&&this._ambientTexture.animations.length>0&&e.push(this._ambientTexture),this._opacityTexture&&this._opacityTexture.animations&&this._opacityTexture.animations.length>0&&e.push(this._opacityTexture),this._reflectionTexture&&this._reflectionTexture.animations&&this._reflectionTexture.animations.length>0&&e.push(this._reflectionTexture),this._emissiveTexture&&this._emissiveTexture.animations&&this._emissiveTexture.animations.length>0&&e.push(this._emissiveTexture),this._specularTexture&&this._specularTexture.animations&&this._specularTexture.animations.length>0&&e.push(this._specularTexture),this._bumpTexture&&this._bumpTexture.animations&&this._bumpTexture.animations.length>0&&e.push(this._bumpTexture),this._lightmapTexture&&this._lightmapTexture.animations&&this._lightmapTexture.animations.length>0&&e.push(this._lightmapTexture),this._refractionTexture&&this._refractionTexture.animations&&this._refractionTexture.animations.length>0&&e.push(this._refractionTexture),e}getActiveTextures(){const e=super.getActiveTextures();return this._diffuseTexture&&e.push(this._diffuseTexture),this._ambientTexture&&e.push(this._ambientTexture),this._opacityTexture&&e.push(this._opacityTexture),this._reflectionTexture&&e.push(this._reflectionTexture),this._emissiveTexture&&e.push(this._emissiveTexture),this._specularTexture&&e.push(this._specularTexture),this._bumpTexture&&e.push(this._bumpTexture),this._lightmapTexture&&e.push(this._lightmapTexture),this._refractionTexture&&e.push(this._refractionTexture),e}hasTexture(e){return!!super.hasTexture(e)||this._diffuseTexture===e||this._ambientTexture===e||this._opacityTexture===e||this._reflectionTexture===e||this._emissiveTexture===e||this._specularTexture===e||this._bumpTexture===e||this._lightmapTexture===e||this._refractionTexture===e}dispose(e,t){var i,n,s,r,o,a,l,h,c;t&&(null===(i=this._diffuseTexture)||void 0===i||i.dispose(),null===(n=this._ambientTexture)||void 0===n||n.dispose(),null===(s=this._opacityTexture)||void 0===s||s.dispose(),null===(r=this._reflectionTexture)||void 0===r||r.dispose(),null===(o=this._emissiveTexture)||void 0===o||o.dispose(),null===(a=this._specularTexture)||void 0===a||a.dispose(),null===(l=this._bumpTexture)||void 0===l||l.dispose(),null===(h=this._lightmapTexture)||void 0===h||h.dispose(),null===(c=this._refractionTexture)||void 0===c||c.dispose()),this._imageProcessingConfiguration&&this._imageProcessingObserver&&this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver),super.dispose(e,t)}clone(e,t=!0){const i=s.p4.Clone((()=>new A(e,this.getScene())),this,{cloneTexturesOnlyOnce:t});return i.name=e,i.id=e,this.stencil.copyTo(i.stencil),i}static Parse(e,t,i){const n=s.p4.Parse((()=>new A(e.name,t)),e,t,i);return e.stencil&&n.stencil.parse(e.stencil,t,i),n}static get DiffuseTextureEnabled(){return y.k.DiffuseTextureEnabled}static set DiffuseTextureEnabled(e){y.k.DiffuseTextureEnabled=e}static get DetailTextureEnabled(){return y.k.DetailTextureEnabled}static set DetailTextureEnabled(e){y.k.DetailTextureEnabled=e}static get AmbientTextureEnabled(){return y.k.AmbientTextureEnabled}static set AmbientTextureEnabled(e){y.k.AmbientTextureEnabled=e}static get OpacityTextureEnabled(){return y.k.OpacityTextureEnabled}static set OpacityTextureEnabled(e){y.k.OpacityTextureEnabled=e}static get ReflectionTextureEnabled(){return y.k.ReflectionTextureEnabled}static set ReflectionTextureEnabled(e){y.k.ReflectionTextureEnabled=e}static get EmissiveTextureEnabled(){return y.k.EmissiveTextureEnabled}static set EmissiveTextureEnabled(e){y.k.EmissiveTextureEnabled=e}static get SpecularTextureEnabled(){return y.k.SpecularTextureEnabled}static set SpecularTextureEnabled(e){y.k.SpecularTextureEnabled=e}static get BumpTextureEnabled(){return y.k.BumpTextureEnabled}static set BumpTextureEnabled(e){y.k.BumpTextureEnabled=e}static get LightmapTextureEnabled(){return y.k.LightmapTextureEnabled}static set LightmapTextureEnabled(e){y.k.LightmapTextureEnabled=e}static get RefractionTextureEnabled(){return y.k.RefractionTextureEnabled}static set RefractionTextureEnabled(e){y.k.RefractionTextureEnabled=e}static get ColorGradingTextureEnabled(){return y.k.ColorGradingTextureEnabled}static set ColorGradingTextureEnabled(e){y.k.ColorGradingTextureEnabled=e}static get FresnelEnabled(){return y.k.FresnelEnabled}static set FresnelEnabled(e){y.k.FresnelEnabled=e}}(0,n.gn)([(0,s.oU)("diffuseTexture")],A.prototype,"_diffuseTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesAndMiscDirty")],A.prototype,"diffuseTexture",void 0),(0,n.gn)([(0,s.oU)("ambientTexture")],A.prototype,"_ambientTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"ambientTexture",void 0),(0,n.gn)([(0,s.oU)("opacityTexture")],A.prototype,"_opacityTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesAndMiscDirty")],A.prototype,"opacityTexture",void 0),(0,n.gn)([(0,s.oU)("reflectionTexture")],A.prototype,"_reflectionTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"reflectionTexture",void 0),(0,n.gn)([(0,s.oU)("emissiveTexture")],A.prototype,"_emissiveTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"emissiveTexture",void 0),(0,n.gn)([(0,s.oU)("specularTexture")],A.prototype,"_specularTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"specularTexture",void 0),(0,n.gn)([(0,s.oU)("bumpTexture")],A.prototype,"_bumpTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"bumpTexture",void 0),(0,n.gn)([(0,s.oU)("lightmapTexture")],A.prototype,"_lightmapTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"lightmapTexture",void 0),(0,n.gn)([(0,s.oU)("refractionTexture")],A.prototype,"_refractionTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"refractionTexture",void 0),(0,n.gn)([(0,s.n9)("ambient")],A.prototype,"ambientColor",void 0),(0,n.gn)([(0,s.n9)("diffuse")],A.prototype,"diffuseColor",void 0),(0,n.gn)([(0,s.n9)("specular")],A.prototype,"specularColor",void 0),(0,n.gn)([(0,s.n9)("emissive")],A.prototype,"emissiveColor",void 0),(0,n.gn)([(0,s.qC)()],A.prototype,"specularPower",void 0),(0,n.gn)([(0,s.qC)("useAlphaFromDiffuseTexture")],A.prototype,"_useAlphaFromDiffuseTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesAndMiscDirty")],A.prototype,"useAlphaFromDiffuseTexture",void 0),(0,n.gn)([(0,s.qC)("useEmissiveAsIllumination")],A.prototype,"_useEmissiveAsIllumination",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"useEmissiveAsIllumination",void 0),(0,n.gn)([(0,s.qC)("linkEmissiveWithDiffuse")],A.prototype,"_linkEmissiveWithDiffuse",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"linkEmissiveWithDiffuse",void 0),(0,n.gn)([(0,s.qC)("useSpecularOverAlpha")],A.prototype,"_useSpecularOverAlpha",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"useSpecularOverAlpha",void 0),(0,n.gn)([(0,s.qC)("useReflectionOverAlpha")],A.prototype,"_useReflectionOverAlpha",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"useReflectionOverAlpha",void 0),(0,n.gn)([(0,s.qC)("disableLighting")],A.prototype,"_disableLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],A.prototype,"disableLighting",void 0),(0,n.gn)([(0,s.qC)("useObjectSpaceNormalMap")],A.prototype,"_useObjectSpaceNormalMap",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"useObjectSpaceNormalMap",void 0),(0,n.gn)([(0,s.qC)("useParallax")],A.prototype,"_useParallax",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"useParallax",void 0),(0,n.gn)([(0,s.qC)("useParallaxOcclusion")],A.prototype,"_useParallaxOcclusion",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"useParallaxOcclusion",void 0),(0,n.gn)([(0,s.qC)()],A.prototype,"parallaxScaleBias",void 0),(0,n.gn)([(0,s.qC)("roughness")],A.prototype,"_roughness",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"roughness",void 0),(0,n.gn)([(0,s.qC)()],A.prototype,"indexOfRefraction",void 0),(0,n.gn)([(0,s.qC)()],A.prototype,"invertRefractionY",void 0),(0,n.gn)([(0,s.qC)()],A.prototype,"alphaCutOff",void 0),(0,n.gn)([(0,s.qC)("useLightmapAsShadowmap")],A.prototype,"_useLightmapAsShadowmap",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"useLightmapAsShadowmap",void 0),(0,n.gn)([(0,s.qQ)("diffuseFresnelParameters")],A.prototype,"_diffuseFresnelParameters",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsFresnelDirty")],A.prototype,"diffuseFresnelParameters",void 0),(0,n.gn)([(0,s.qQ)("opacityFresnelParameters")],A.prototype,"_opacityFresnelParameters",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsFresnelAndMiscDirty")],A.prototype,"opacityFresnelParameters",void 0),(0,n.gn)([(0,s.qQ)("reflectionFresnelParameters")],A.prototype,"_reflectionFresnelParameters",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsFresnelDirty")],A.prototype,"reflectionFresnelParameters",void 0),(0,n.gn)([(0,s.qQ)("refractionFresnelParameters")],A.prototype,"_refractionFresnelParameters",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsFresnelDirty")],A.prototype,"refractionFresnelParameters",void 0),(0,n.gn)([(0,s.qQ)("emissiveFresnelParameters")],A.prototype,"_emissiveFresnelParameters",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsFresnelDirty")],A.prototype,"emissiveFresnelParameters",void 0),(0,n.gn)([(0,s.qC)("useReflectionFresnelFromSpecular")],A.prototype,"_useReflectionFresnelFromSpecular",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsFresnelDirty")],A.prototype,"useReflectionFresnelFromSpecular",void 0),(0,n.gn)([(0,s.qC)("useGlossinessFromSpecularMapAlpha")],A.prototype,"_useGlossinessFromSpecularMapAlpha",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"useGlossinessFromSpecularMapAlpha",void 0),(0,n.gn)([(0,s.qC)("maxSimultaneousLights")],A.prototype,"_maxSimultaneousLights",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],A.prototype,"maxSimultaneousLights",void 0),(0,n.gn)([(0,s.qC)("invertNormalMapX")],A.prototype,"_invertNormalMapX",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"invertNormalMapX",void 0),(0,n.gn)([(0,s.qC)("invertNormalMapY")],A.prototype,"_invertNormalMapY",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"invertNormalMapY",void 0),(0,n.gn)([(0,s.qC)("twoSidedLighting")],A.prototype,"_twoSidedLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],A.prototype,"twoSidedLighting",void 0),(0,n.gn)([(0,s.qC)()],A.prototype,"useLogarithmicDepth",null),(0,v.H)("BABYLON.StandardMaterial",A),o.x.DefaultMaterialFactory=e=>new A("default material",e)},3743:(e,t,i)=>{i.d(t,{M:()=>r});var n=i(2722),s=i(7257);i(4901);class r{constructor(e,t,i,n,s=!1){this._valueCache={},this._engine=e,this._noUBO=!e.supportsUniformBuffers||s,this._dynamic=i,this._name=null!=n?n:"no-name",this._data=t||[],this._uniformLocations={},this._uniformSizes={},this._uniformArraySizes={},this._uniformLocationPointer=0,this._needSync=!1,this._engine._features.trackUbosInFrame&&(this._buffers=[],this._bufferIndex=-1,this._createBufferOnWrite=!1,this._currentFrameId=0),this._noUBO?(this.updateMatrix3x3=this._updateMatrix3x3ForEffect,this.updateMatrix2x2=this._updateMatrix2x2ForEffect,this.updateFloat=this._updateFloatForEffect,this.updateFloat2=this._updateFloat2ForEffect,this.updateFloat3=this._updateFloat3ForEffect,this.updateFloat4=this._updateFloat4ForEffect,this.updateFloatArray=this._updateFloatArrayForEffect,this.updateArray=this._updateArrayForEffect,this.updateIntArray=this._updateIntArrayForEffect,this.updateUIntArray=this._updateUIntArrayForEffect,this.updateMatrix=this._updateMatrixForEffect,this.updateMatrices=this._updateMatricesForEffect,this.updateVector3=this._updateVector3ForEffect,this.updateVector4=this._updateVector4ForEffect,this.updateColor3=this._updateColor3ForEffect,this.updateColor4=this._updateColor4ForEffect,this.updateDirectColor4=this._updateDirectColor4ForEffect,this.updateInt=this._updateIntForEffect,this.updateInt2=this._updateInt2ForEffect,this.updateInt3=this._updateInt3ForEffect,this.updateInt4=this._updateInt4ForEffect,this.updateUInt=this._updateUIntForEffect,this.updateUInt2=this._updateUInt2ForEffect,this.updateUInt3=this._updateUInt3ForEffect,this.updateUInt4=this._updateUInt4ForEffect):(this._engine._uniformBuffers.push(this),this.updateMatrix3x3=this._updateMatrix3x3ForUniform,this.updateMatrix2x2=this._updateMatrix2x2ForUniform,this.updateFloat=this._updateFloatForUniform,this.updateFloat2=this._updateFloat2ForUniform,this.updateFloat3=this._updateFloat3ForUniform,this.updateFloat4=this._updateFloat4ForUniform,this.updateFloatArray=this._updateFloatArrayForUniform,this.updateArray=this._updateArrayForUniform,this.updateIntArray=this._updateIntArrayForUniform,this.updateUIntArray=this._updateUIntArrayForUniform,this.updateMatrix=this._updateMatrixForUniform,this.updateMatrices=this._updateMatricesForUniform,this.updateVector3=this._updateVector3ForUniform,this.updateVector4=this._updateVector4ForUniform,this.updateColor3=this._updateColor3ForUniform,this.updateColor4=this._updateColor4ForUniform,this.updateDirectColor4=this._updateDirectColor4ForUniform,this.updateInt=this._updateIntForUniform,this.updateInt2=this._updateInt2ForUniform,this.updateInt3=this._updateInt3ForUniform,this.updateInt4=this._updateInt4ForUniform,this.updateUInt=this._updateUIntForUniform,this.updateUInt2=this._updateUInt2ForUniform,this.updateUInt3=this._updateUInt3ForUniform,this.updateUInt4=this._updateUInt4ForUniform)}get useUbo(){return!this._noUBO}get isSync(){return!this._needSync}isDynamic(){return void 0!==this._dynamic}getData(){return this._bufferData}getBuffer(){return this._buffer}_fillAlignment(e){let t;if(t=e<=2?e:4,this._uniformLocationPointer%t!=0){const e=this._uniformLocationPointer;this._uniformLocationPointer+=t-this._uniformLocationPointer%t;const i=this._uniformLocationPointer-e;for(let e=0;e<i;e++)this._data.push(0)}}addUniform(e,t,i=0){if(this._noUBO)return;if(void 0!==this._uniformLocations[e])return;let n;if(i>0){if(t instanceof Array)throw"addUniform should not be use with Array in UBO: "+e;this._fillAlignment(4),this._uniformArraySizes[e]={strideSize:t,arraySize:i},16==t?t*=i:t=t*i+(4-t)*i,n=[];for(let e=0;e<t;e++)n.push(0)}else{if(t instanceof Array)n=t,t=n.length;else{n=[];for(let e=0;e<t;e++)n.push(0)}this._fillAlignment(t)}this._uniformSizes[e]=t,this._uniformLocations[e]=this._uniformLocationPointer,this._uniformLocationPointer+=t;for(let e=0;e<t;e++)this._data.push(n[e]);this._needSync=!0}addMatrix(e,t){this.addUniform(e,Array.prototype.slice.call(t.toArray()))}addFloat2(e,t,i){const n=[t,i];this.addUniform(e,n)}addFloat3(e,t,i,n){const s=[t,i,n];this.addUniform(e,s)}addColor3(e,t){const i=[t.r,t.g,t.b];this.addUniform(e,i)}addColor4(e,t,i){const n=[t.r,t.g,t.b,i];this.addUniform(e,n)}addVector3(e,t){const i=[t.x,t.y,t.z];this.addUniform(e,i)}addMatrix3x3(e){this.addUniform(e,12)}addMatrix2x2(e){this.addUniform(e,8)}create(){this._noUBO||this._buffer||(this._fillAlignment(4),this._bufferData=new Float32Array(this._data),this._rebuild(),this._needSync=!0)}_rebuild(){!this._noUBO&&this._bufferData&&(this._dynamic?this._buffer=this._engine.createDynamicUniformBuffer(this._bufferData):this._buffer=this._engine.createUniformBuffer(this._bufferData),this._engine._features.trackUbosInFrame&&(this._buffers.push([this._buffer,this._engine._features.checkUbosContentBeforeUpload?this._bufferData.slice():void 0]),this._bufferIndex=this._buffers.length-1,this._createBufferOnWrite=!1))}get _numBuffers(){return this._buffers.length}get _indexBuffer(){return this._bufferIndex}get name(){return this._name}get currentEffect(){return this._currentEffect}_buffersEqual(e,t){for(let i=0;i<e.length;++i)if(e[i]!==t[i])return!1;return!0}_copyBuffer(e,t){for(let i=0;i<e.length;++i)t[i]=e[i]}update(){if(!this._noUBO)if(this.bindUniformBuffer(),this._buffer)if(this._dynamic||this._needSync){if(this._buffers&&this._buffers.length>1&&this._buffers[this._bufferIndex][1]){if(this._buffersEqual(this._bufferData,this._buffers[this._bufferIndex][1]))return this._needSync=!1,void(this._createBufferOnWrite=this._engine._features.trackUbosInFrame);this._copyBuffer(this._bufferData,this._buffers[this._bufferIndex][1])}this._engine.updateUniformBuffer(this._buffer,this._bufferData),this._engine._features._collectUbosUpdatedInFrame&&(r._UpdatedUbosInFrame[this._name]||(r._UpdatedUbosInFrame[this._name]=0),r._UpdatedUbosInFrame[this._name]++),this._needSync=!1,this._createBufferOnWrite=this._engine._features.trackUbosInFrame}else this._createBufferOnWrite=this._engine._features.trackUbosInFrame;else this.create()}_createNewBuffer(){this._bufferIndex+1<this._buffers.length?(this._bufferIndex++,this._buffer=this._buffers[this._bufferIndex][0],this._createBufferOnWrite=!1,this._needSync=!0):this._rebuild()}_checkNewFrame(){this._engine._features.trackUbosInFrame&&this._currentFrameId!==this._engine.frameId&&(this._currentFrameId=this._engine.frameId,this._createBufferOnWrite=!1,this._buffers&&this._buffers.length>0?(this._needSync=0!==this._bufferIndex,this._bufferIndex=0,this._buffer=this._buffers[this._bufferIndex][0]):this._bufferIndex=-1)}updateUniform(e,t,i){this._checkNewFrame();let r=this._uniformLocations[e];if(void 0===r){if(this._buffer)return void n.Y.Error("Cannot add an uniform after UBO has been created.");this.addUniform(e,i),r=this._uniformLocations[e]}if(this._buffer||this.create(),this._dynamic)for(let e=0;e<i;e++)this._bufferData[r+e]=t[e];else{let e=!1;for(let n=0;n<i;n++)(16===i&&!this._engine._features.uniformBufferHardCheckMatrix||this._bufferData[r+n]!==s.w1.FloatRound(t[n]))&&(e=!0,this._createBufferOnWrite&&this._createNewBuffer(),this._bufferData[r+n]=t[n]);this._needSync=this._needSync||e}}updateUniformArray(e,t,i){this._checkNewFrame();const r=this._uniformLocations[e];if(void 0===r)return void n.Y.Error("Cannot add an uniform Array dynamically. Please, add it using addUniform and make sure that uniform buffers are supported by the current engine.");this._buffer||this.create();const o=this._uniformArraySizes[e];if(this._dynamic)for(let e=0;e<i;e++)this._bufferData[r+e]=t[e];else{let e=!1,n=0,a=0;for(let l=0;l<i;l++)if(this._bufferData[r+4*a+n]!==s.w1.FloatRound(t[l])&&(e=!0,this._createBufferOnWrite&&this._createNewBuffer(),this._bufferData[r+4*a+n]=t[l]),n++,n===o.strideSize){for(;n<4;n++)this._bufferData[r+4*a+n]=0;n=0,a++}this._needSync=this._needSync||e}}_cacheMatrix(e,t){this._checkNewFrame();const i=this._valueCache[e],n=t.updateFlag;return(void 0===i||i!==n)&&(this._valueCache[e]=n,!0)}_updateMatrix3x3ForUniform(e,t){for(let e=0;e<3;e++)r._TempBuffer[4*e]=t[3*e],r._TempBuffer[4*e+1]=t[3*e+1],r._TempBuffer[4*e+2]=t[3*e+2],r._TempBuffer[4*e+3]=0;this.updateUniform(e,r._TempBuffer,12)}_updateMatrix3x3ForEffect(e,t){this._currentEffect.setMatrix3x3(e,t)}_updateMatrix2x2ForEffect(e,t){this._currentEffect.setMatrix2x2(e,t)}_updateMatrix2x2ForUniform(e,t){for(let e=0;e<2;e++)r._TempBuffer[4*e]=t[2*e],r._TempBuffer[4*e+1]=t[2*e+1],r._TempBuffer[4*e+2]=0,r._TempBuffer[4*e+3]=0;this.updateUniform(e,r._TempBuffer,8)}_updateFloatForEffect(e,t){this._currentEffect.setFloat(e,t)}_updateFloatForUniform(e,t){r._TempBuffer[0]=t,this.updateUniform(e,r._TempBuffer,1)}_updateFloat2ForEffect(e,t,i,n=""){this._currentEffect.setFloat2(e+n,t,i)}_updateFloat2ForUniform(e,t,i){r._TempBuffer[0]=t,r._TempBuffer[1]=i,this.updateUniform(e,r._TempBuffer,2)}_updateFloat3ForEffect(e,t,i,n,s=""){this._currentEffect.setFloat3(e+s,t,i,n)}_updateFloat3ForUniform(e,t,i,n){r._TempBuffer[0]=t,r._TempBuffer[1]=i,r._TempBuffer[2]=n,this.updateUniform(e,r._TempBuffer,3)}_updateFloat4ForEffect(e,t,i,n,s,r=""){this._currentEffect.setFloat4(e+r,t,i,n,s)}_updateFloat4ForUniform(e,t,i,n,s){r._TempBuffer[0]=t,r._TempBuffer[1]=i,r._TempBuffer[2]=n,r._TempBuffer[3]=s,this.updateUniform(e,r._TempBuffer,4)}_updateFloatArrayForEffect(e,t){this._currentEffect.setFloatArray(e,t)}_updateFloatArrayForUniform(e,t){this.updateUniformArray(e,t,t.length)}_updateArrayForEffect(e,t){this._currentEffect.setArray(e,t)}_updateArrayForUniform(e,t){this.updateUniformArray(e,t,t.length)}_updateIntArrayForEffect(e,t){this._currentEffect.setIntArray(e,t)}_updateIntArrayForUniform(e,t){r._TempBufferInt32View.set(t),this.updateUniformArray(e,r._TempBuffer,t.length)}_updateUIntArrayForEffect(e,t){this._currentEffect.setUIntArray(e,t)}_updateUIntArrayForUniform(e,t){r._TempBufferUInt32View.set(t),this.updateUniformArray(e,r._TempBuffer,t.length)}_updateMatrixForEffect(e,t){this._currentEffect.setMatrix(e,t)}_updateMatrixForUniform(e,t){this._cacheMatrix(e,t)&&this.updateUniform(e,t.toArray(),16)}_updateMatricesForEffect(e,t){this._currentEffect.setMatrices(e,t)}_updateMatricesForUniform(e,t){this.updateUniform(e,t,t.length)}_updateVector3ForEffect(e,t){this._currentEffect.setVector3(e,t)}_updateVector3ForUniform(e,t){r._TempBuffer[0]=t.x,r._TempBuffer[1]=t.y,r._TempBuffer[2]=t.z,this.updateUniform(e,r._TempBuffer,3)}_updateVector4ForEffect(e,t){this._currentEffect.setVector4(e,t)}_updateVector4ForUniform(e,t){r._TempBuffer[0]=t.x,r._TempBuffer[1]=t.y,r._TempBuffer[2]=t.z,r._TempBuffer[3]=t.w,this.updateUniform(e,r._TempBuffer,4)}_updateColor3ForEffect(e,t,i=""){this._currentEffect.setColor3(e+i,t)}_updateColor3ForUniform(e,t){r._TempBuffer[0]=t.r,r._TempBuffer[1]=t.g,r._TempBuffer[2]=t.b,this.updateUniform(e,r._TempBuffer,3)}_updateColor4ForEffect(e,t,i,n=""){this._currentEffect.setColor4(e+n,t,i)}_updateDirectColor4ForEffect(e,t,i=""){this._currentEffect.setDirectColor4(e+i,t)}_updateColor4ForUniform(e,t,i){r._TempBuffer[0]=t.r,r._TempBuffer[1]=t.g,r._TempBuffer[2]=t.b,r._TempBuffer[3]=i,this.updateUniform(e,r._TempBuffer,4)}_updateDirectColor4ForUniform(e,t){r._TempBuffer[0]=t.r,r._TempBuffer[1]=t.g,r._TempBuffer[2]=t.b,r._TempBuffer[3]=t.a,this.updateUniform(e,r._TempBuffer,4)}_updateIntForEffect(e,t,i=""){this._currentEffect.setInt(e+i,t)}_updateIntForUniform(e,t){r._TempBufferInt32View[0]=t,this.updateUniform(e,r._TempBuffer,1)}_updateInt2ForEffect(e,t,i,n=""){this._currentEffect.setInt2(e+n,t,i)}_updateInt2ForUniform(e,t,i){r._TempBufferInt32View[0]=t,r._TempBufferInt32View[1]=i,this.updateUniform(e,r._TempBuffer,2)}_updateInt3ForEffect(e,t,i,n,s=""){this._currentEffect.setInt3(e+s,t,i,n)}_updateInt3ForUniform(e,t,i,n){r._TempBufferInt32View[0]=t,r._TempBufferInt32View[1]=i,r._TempBufferInt32View[2]=n,this.updateUniform(e,r._TempBuffer,3)}_updateInt4ForEffect(e,t,i,n,s,r=""){this._currentEffect.setInt4(e+r,t,i,n,s)}_updateInt4ForUniform(e,t,i,n,s){r._TempBufferInt32View[0]=t,r._TempBufferInt32View[1]=i,r._TempBufferInt32View[2]=n,r._TempBufferInt32View[3]=s,this.updateUniform(e,r._TempBuffer,4)}_updateUIntForEffect(e,t,i=""){this._currentEffect.setUInt(e+i,t)}_updateUIntForUniform(e,t){r._TempBufferUInt32View[0]=t,this.updateUniform(e,r._TempBuffer,1)}_updateUInt2ForEffect(e,t,i,n=""){this._currentEffect.setUInt2(e+n,t,i)}_updateUInt2ForUniform(e,t,i){r._TempBufferUInt32View[0]=t,r._TempBufferUInt32View[1]=i,this.updateUniform(e,r._TempBuffer,2)}_updateUInt3ForEffect(e,t,i,n,s=""){this._currentEffect.setUInt3(e+s,t,i,n)}_updateUInt3ForUniform(e,t,i,n){r._TempBufferUInt32View[0]=t,r._TempBufferUInt32View[1]=i,r._TempBufferUInt32View[2]=n,this.updateUniform(e,r._TempBuffer,3)}_updateUInt4ForEffect(e,t,i,n,s,r=""){this._currentEffect.setUInt4(e+r,t,i,n,s)}_updateUInt4ForUniform(e,t,i,n,s){r._TempBufferUInt32View[0]=t,r._TempBufferUInt32View[1]=i,r._TempBufferUInt32View[2]=n,r._TempBufferUInt32View[3]=s,this.updateUniform(e,r._TempBuffer,4)}setTexture(e,t){this._currentEffect.setTexture(e,t)}updateUniformDirectly(e,t){this.updateUniform(e,t,t.length),this.update()}bindToEffect(e,t){this._currentEffect=e,this._currentEffectName=t}bindUniformBuffer(){!this._noUBO&&this._buffer&&this._currentEffect&&this._currentEffect.bindUniformBuffer(this._buffer,this._currentEffectName)}unbindEffect(){this._currentEffect=void 0,this._currentEffectName=void 0}setDataBuffer(e){if(!this._buffers)return this._buffer===e;for(let t=0;t<this._buffers.length;++t)if(this._buffers[t][0]===e)return this._bufferIndex=t,this._buffer=e,this._createBufferOnWrite=!1,this._currentEffect=void 0,!0;return!1}dispose(){if(this._noUBO)return;const e=this._engine._uniformBuffers,t=e.indexOf(this);if(-1!==t&&(e[t]=e[e.length-1],e.pop()),this._engine._features.trackUbosInFrame&&this._buffers)for(let e=0;e<this._buffers.length;++e){const t=this._buffers[e][0];this._engine._releaseBuffer(t)}else this._buffer&&this._engine._releaseBuffer(this._buffer)&&(this._buffer=null)}}r._UpdatedUbosInFrame={},r._MAX_UNIFORM_SIZE=256,r._TempBuffer=new Float32Array(r._MAX_UNIFORM_SIZE),r._TempBufferInt32View=new Int32Array(r._TempBuffer.buffer),r._TempBufferUInt32View=new Uint32Array(r._TempBuffer.buffer)},5203:(e,t,i)=>{i.d(t,{RD:()=>o,T:()=>n,c7:()=>s});var n,s,r=i(4141);!function(e){e[e.LOCAL=0]="LOCAL",e[e.WORLD=1]="WORLD",e[e.BONE=2]="BONE"}(n||(n={}));class o{}o.X=new r.P(1,0,0),o.Y=new r.P(0,1,0),o.Z=new r.P(0,0,1),function(e){e[e.X=0]="X",e[e.Y=1]="Y",e[e.Z=2]="Z"}(s||(s={}))},4649:(e,t,i)=>{i.d(t,{HE:()=>d,Wo:()=>u,zZ:()=>p});var n=i(1128),s=i(1341),r=i(5860),o=i(2208);function a(e){return Math.pow(e,s.Nn)}function l(e){return e<=.04045?.0773993808*e:Math.pow(.947867299*(e+.055),2.4)}function h(e){return Math.pow(e,s.zp)}function c(e){return e<=.0031308?12.92*e:1.055*Math.pow(e,.41666)-.055}class u{constructor(e=0,t=0,i=0){this.r=e,this.g=t,this.b=i}toString(){return"{R: "+this.r+" G:"+this.g+" B:"+this.b+"}"}getClassName(){return"Color3"}getHashCode(){let e=255*this.r|0;return e=397*e^(255*this.g|0),e=397*e^(255*this.b|0),e}toArray(e,t=0){return e[t]=this.r,e[t+1]=this.g,e[t+2]=this.b,this}fromArray(e,t=0){return u.FromArrayToRef(e,t,this),this}toColor4(e=1){return new d(this.r,this.g,this.b,e)}asArray(){return[this.r,this.g,this.b]}toLuminance(){return.3*this.r+.59*this.g+.11*this.b}multiply(e){return new u(this.r*e.r,this.g*e.g,this.b*e.b)}multiplyToRef(e,t){return t.r=this.r*e.r,t.g=this.g*e.g,t.b=this.b*e.b,this}equals(e){return e&&this.r===e.r&&this.g===e.g&&this.b===e.b}equalsFloats(e,t,i){return this.r===e&&this.g===t&&this.b===i}scale(e){return new u(this.r*e,this.g*e,this.b*e)}scaleInPlace(e){return this.r*=e,this.g*=e,this.b*=e,this}scaleToRef(e,t){return t.r=this.r*e,t.g=this.g*e,t.b=this.b*e,this}scaleAndAddToRef(e,t){return t.r+=this.r*e,t.g+=this.g*e,t.b+=this.b*e,this}clampToRef(e=0,t=1,i){return i.r=n.R.Clamp(this.r,e,t),i.g=n.R.Clamp(this.g,e,t),i.b=n.R.Clamp(this.b,e,t),this}add(e){return new u(this.r+e.r,this.g+e.g,this.b+e.b)}addToRef(e,t){return t.r=this.r+e.r,t.g=this.g+e.g,t.b=this.b+e.b,this}subtract(e){return new u(this.r-e.r,this.g-e.g,this.b-e.b)}subtractToRef(e,t){return t.r=this.r-e.r,t.g=this.g-e.g,t.b=this.b-e.b,this}clone(){return new u(this.r,this.g,this.b)}copyFrom(e){return this.r=e.r,this.g=e.g,this.b=e.b,this}copyFromFloats(e,t,i){return this.r=e,this.g=t,this.b=i,this}set(e,t,i){return this.copyFromFloats(e,t,i)}toHexString(){const e=Math.round(255*this.r),t=Math.round(255*this.g),i=Math.round(255*this.b);return"#"+n.R.ToHex(e)+n.R.ToHex(t)+n.R.ToHex(i)}toHSV(){const e=new u;return this.toHSVToRef(e),e}toHSVToRef(e){const t=this.r,i=this.g,n=this.b,s=Math.max(t,i,n),r=Math.min(t,i,n);let o=0,a=0;const l=s,h=s-r;0!==s&&(a=h/s),s!=r&&(s==t?(o=(i-n)/h,i<n&&(o+=6)):s==i?o=(n-t)/h+2:s==n&&(o=(t-i)/h+4),o*=60),e.r=o,e.g=a,e.b=l}toLinearSpace(e=!1){const t=new u;return this.toLinearSpaceToRef(t,e),t}toLinearSpaceToRef(e,t=!1){return t?(e.r=l(this.r),e.g=l(this.g),e.b=l(this.b)):(e.r=a(this.r),e.g=a(this.g),e.b=a(this.b)),this}toGammaSpace(e=!1){const t=new u;return this.toGammaSpaceToRef(t,e),t}toGammaSpaceToRef(e,t=!1){return t?(e.r=c(this.r),e.g=c(this.g),e.b=c(this.b)):(e.r=h(this.r),e.g=h(this.g),e.b=h(this.b)),this}static HSVtoRGBToRef(e,t,i,n){const s=i*t,r=e/60,o=s*(1-Math.abs(r%2-1));let a=0,l=0,h=0;r>=0&&r<=1?(a=s,l=o):r>=1&&r<=2?(a=o,l=s):r>=2&&r<=3?(l=s,h=o):r>=3&&r<=4?(l=o,h=s):r>=4&&r<=5?(a=o,h=s):r>=5&&r<=6&&(a=s,h=o);const c=i-s;n.set(a+c,l+c,h+c)}static FromHSV(e,t,i){const n=new u(0,0,0);return u.HSVtoRGBToRef(e,t,i,n),n}static FromHexString(e){if("#"!==e.substring(0,1)||7!==e.length)return new u(0,0,0);const t=parseInt(e.substring(1,3),16),i=parseInt(e.substring(3,5),16),n=parseInt(e.substring(5,7),16);return u.FromInts(t,i,n)}static FromArray(e,t=0){return new u(e[t],e[t+1],e[t+2])}static FromArrayToRef(e,t=0,i){i.r=e[t],i.g=e[t+1],i.b=e[t+2]}static FromInts(e,t,i){return new u(e/255,t/255,i/255)}static Lerp(e,t,i){const n=new u(0,0,0);return u.LerpToRef(e,t,i,n),n}static LerpToRef(e,t,i,n){n.r=e.r+(t.r-e.r)*i,n.g=e.g+(t.g-e.g)*i,n.b=e.b+(t.b-e.b)*i}static Hermite(e,t,i,n,s){const r=s*s,o=s*r,a=2*o-3*r+1,l=-2*o+3*r,h=o-2*r+s,c=o-r,d=e.r*a+i.r*l+t.r*h+n.r*c,p=e.g*a+i.g*l+t.g*h+n.g*c,f=e.b*a+i.b*l+t.b*h+n.b*c;return new u(d,p,f)}static Hermite1stDerivative(e,t,i,n,s){const r=u.Black();return this.Hermite1stDerivativeToRef(e,t,i,n,s,r),r}static Hermite1stDerivativeToRef(e,t,i,n,s,r){const o=s*s;r.r=6*(o-s)*e.r+(3*o-4*s+1)*t.r+6*(-o+s)*i.r+(3*o-2*s)*n.r,r.g=6*(o-s)*e.g+(3*o-4*s+1)*t.g+6*(-o+s)*i.g+(3*o-2*s)*n.g,r.b=6*(o-s)*e.b+(3*o-4*s+1)*t.b+6*(-o+s)*i.b+(3*o-2*s)*n.b}static Red(){return new u(1,0,0)}static Green(){return new u(0,1,0)}static Blue(){return new u(0,0,1)}static Black(){return new u(0,0,0)}static get BlackReadOnly(){return u._BlackReadOnly}static White(){return new u(1,1,1)}static Purple(){return new u(.5,0,.5)}static Magenta(){return new u(1,0,1)}static Yellow(){return new u(1,1,0)}static Gray(){return new u(.5,.5,.5)}static Teal(){return new u(0,1,1)}static Random(){return new u(Math.random(),Math.random(),Math.random())}}u._BlackReadOnly=u.Black();class d{constructor(e=0,t=0,i=0,n=1){this.r=e,this.g=t,this.b=i,this.a=n}addInPlace(e){return this.r+=e.r,this.g+=e.g,this.b+=e.b,this.a+=e.a,this}asArray(){return[this.r,this.g,this.b,this.a]}toArray(e,t=0){return e[t]=this.r,e[t+1]=this.g,e[t+2]=this.b,e[t+3]=this.a,this}fromArray(e,t=0){return d.FromArrayToRef(e,t,this),this}equals(e){return e&&this.r===e.r&&this.g===e.g&&this.b===e.b&&this.a===e.a}add(e){return new d(this.r+e.r,this.g+e.g,this.b+e.b,this.a+e.a)}subtract(e){return new d(this.r-e.r,this.g-e.g,this.b-e.b,this.a-e.a)}subtractToRef(e,t){return t.r=this.r-e.r,t.g=this.g-e.g,t.b=this.b-e.b,t.a=this.a-e.a,this}scale(e){return new d(this.r*e,this.g*e,this.b*e,this.a*e)}scaleInPlace(e){return this.r*=e,this.g*=e,this.b*=e,this.a*=e,this}scaleToRef(e,t){return t.r=this.r*e,t.g=this.g*e,t.b=this.b*e,t.a=this.a*e,this}scaleAndAddToRef(e,t){return t.r+=this.r*e,t.g+=this.g*e,t.b+=this.b*e,t.a+=this.a*e,this}clampToRef(e=0,t=1,i){return i.r=n.R.Clamp(this.r,e,t),i.g=n.R.Clamp(this.g,e,t),i.b=n.R.Clamp(this.b,e,t),i.a=n.R.Clamp(this.a,e,t),this}multiply(e){return new d(this.r*e.r,this.g*e.g,this.b*e.b,this.a*e.a)}multiplyToRef(e,t){return t.r=this.r*e.r,t.g=this.g*e.g,t.b=this.b*e.b,t.a=this.a*e.a,t}toString(){return"{R: "+this.r+" G:"+this.g+" B:"+this.b+" A:"+this.a+"}"}getClassName(){return"Color4"}getHashCode(){let e=255*this.r|0;return e=397*e^(255*this.g|0),e=397*e^(255*this.b|0),e=397*e^(255*this.a|0),e}clone(){return new d(this.r,this.g,this.b,this.a)}copyFrom(e){return this.r=e.r,this.g=e.g,this.b=e.b,this.a=e.a,this}copyFromFloats(e,t,i,n){return this.r=e,this.g=t,this.b=i,this.a=n,this}set(e,t,i,n){return this.copyFromFloats(e,t,i,n)}toHexString(e=!1){const t=Math.round(255*this.r),i=Math.round(255*this.g),s=Math.round(255*this.b);if(e)return"#"+n.R.ToHex(t)+n.R.ToHex(i)+n.R.ToHex(s);const r=Math.round(255*this.a);return"#"+n.R.ToHex(t)+n.R.ToHex(i)+n.R.ToHex(s)+n.R.ToHex(r)}toLinearSpace(e=!1){const t=new d;return this.toLinearSpaceToRef(t,e),t}toLinearSpaceToRef(e,t=!1){return t?(e.r=l(this.r),e.g=l(this.g),e.b=l(this.b)):(e.r=a(this.r),e.g=a(this.g),e.b=a(this.b)),e.a=this.a,this}toGammaSpace(e=!1){const t=new d;return this.toGammaSpaceToRef(t,e),t}toGammaSpaceToRef(e,t=!1){return t?(e.r=c(this.r),e.g=c(this.g),e.b=c(this.b)):(e.r=h(this.r),e.g=h(this.g),e.b=h(this.b)),e.a=this.a,this}static FromHexString(e){if("#"!==e.substring(0,1)||9!==e.length&&7!==e.length)return new d(0,0,0,0);const t=parseInt(e.substring(1,3),16),i=parseInt(e.substring(3,5),16),n=parseInt(e.substring(5,7),16),s=9===e.length?parseInt(e.substring(7,9),16):255;return d.FromInts(t,i,n,s)}static Lerp(e,t,i){const n=new d(0,0,0,0);return d.LerpToRef(e,t,i,n),n}static LerpToRef(e,t,i,n){n.r=e.r+(t.r-e.r)*i,n.g=e.g+(t.g-e.g)*i,n.b=e.b+(t.b-e.b)*i,n.a=e.a+(t.a-e.a)*i}static Hermite(e,t,i,n,s){const r=s*s,o=s*r,a=2*o-3*r+1,l=-2*o+3*r,h=o-2*r+s,c=o-r,u=e.r*a+i.r*l+t.r*h+n.r*c,p=e.g*a+i.g*l+t.g*h+n.g*c,f=e.b*a+i.b*l+t.b*h+n.b*c,_=e.a*a+i.a*l+t.a*h+n.a*c;return new d(u,p,f,_)}static Hermite1stDerivative(e,t,i,n,s){const r=new d;return this.Hermite1stDerivativeToRef(e,t,i,n,s,r),r}static Hermite1stDerivativeToRef(e,t,i,n,s,r){const o=s*s;r.r=6*(o-s)*e.r+(3*o-4*s+1)*t.r+6*(-o+s)*i.r+(3*o-2*s)*n.r,r.g=6*(o-s)*e.g+(3*o-4*s+1)*t.g+6*(-o+s)*i.g+(3*o-2*s)*n.g,r.b=6*(o-s)*e.b+(3*o-4*s+1)*t.b+6*(-o+s)*i.b+(3*o-2*s)*n.b,r.a=6*(o-s)*e.a+(3*o-4*s+1)*t.a+6*(-o+s)*i.a+(3*o-2*s)*n.a}static FromColor3(e,t=1){return new d(e.r,e.g,e.b,t)}static FromArray(e,t=0){return new d(e[t],e[t+1],e[t+2],e[t+3])}static FromArrayToRef(e,t=0,i){i.r=e[t],i.g=e[t+1],i.b=e[t+2],i.a=e[t+3]}static FromInts(e,t,i,n){return new d(e/255,t/255,i/255,n/255)}static CheckColors4(e,t){if(e.length===3*t){const t=[];for(let i=0;i<e.length;i+=3){const n=i/3*4;t[n]=e[i],t[n+1]=e[i+1],t[n+2]=e[i+2],t[n+3]=1}return t}return e}}class p{}p.Color3=r.B.BuildArray(3,u.Black),p.Color4=r.B.BuildArray(3,(()=>new d(0,0,0,0))),(0,o.H)("BABYLON.Color3",u),(0,o.H)("BABYLON.Color4",d)},1341:(e,t,i)=>{i.d(t,{Nn:()=>s,Q_:()=>r,kn:()=>o,zp:()=>n});const n=1/2.2,s=2.2,r=(1+Math.sqrt(5))/2,o=.001},1560:(e,t,i)=>{i.d(t,{i:()=>s});var n=i(142);class s{static GetPlanes(e){const t=[];for(let e=0;e<6;e++)t.push(new n.J(0,0,0,0));return s.GetPlanesToRef(e,t),t}static GetNearPlaneToRef(e,t){const i=e.m;t.normal.x=i[3]+i[2],t.normal.y=i[7]+i[6],t.normal.z=i[11]+i[10],t.d=i[15]+i[14],t.normalize()}static GetFarPlaneToRef(e,t){const i=e.m;t.normal.x=i[3]-i[2],t.normal.y=i[7]-i[6],t.normal.z=i[11]-i[10],t.d=i[15]-i[14],t.normalize()}static GetLeftPlaneToRef(e,t){const i=e.m;t.normal.x=i[3]+i[0],t.normal.y=i[7]+i[4],t.normal.z=i[11]+i[8],t.d=i[15]+i[12],t.normalize()}static GetRightPlaneToRef(e,t){const i=e.m;t.normal.x=i[3]-i[0],t.normal.y=i[7]-i[4],t.normal.z=i[11]-i[8],t.d=i[15]-i[12],t.normalize()}static GetTopPlaneToRef(e,t){const i=e.m;t.normal.x=i[3]-i[1],t.normal.y=i[7]-i[5],t.normal.z=i[11]-i[9],t.d=i[15]-i[13],t.normalize()}static GetBottomPlaneToRef(e,t){const i=e.m;t.normal.x=i[3]+i[1],t.normal.y=i[7]+i[5],t.normal.z=i[11]+i[9],t.d=i[15]+i[13],t.normalize()}static GetPlanesToRef(e,t){s.GetNearPlaneToRef(e,t[0]),s.GetFarPlaneToRef(e,t[1]),s.GetLeftPlaneToRef(e,t[2]),s.GetRightPlaneToRef(e,t[3]),s.GetTopPlaneToRef(e,t[4]),s.GetBottomPlaneToRef(e,t[5])}static IsPointInFrustum(e,t){for(let i=0;i<6;i++)if(t[i].dotCoordinate(e)<0)return!1;return!0}}},1372:(e,t,i)=>{i.d(t,{k:()=>l,y:()=>a});var n=i(9472),s=i(4141),r=i(3956);class o{static extractMinAndMaxIndexed(e,t,i,n,s,r){for(let o=i;o<i+n;o++){const i=3*t[o],n=e[i],a=e[i+1],l=e[i+2];s.minimizeInPlaceFromFloats(n,a,l),r.maximizeInPlaceFromFloats(n,a,l)}}static extractMinAndMax(e,t,i,n,s,r){for(let o=t,a=t*n;o<t+i;o++,a+=n){const t=e[a],i=e[a+1],n=e[a+2];s.minimizeInPlaceFromFloats(t,i,n),r.maximizeInPlaceFromFloats(t,i,n)}}}function a(e,t,i,n,r=null){const a=new s.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),l=new s.P(-Number.MAX_VALUE,-Number.MAX_VALUE,-Number.MAX_VALUE);return o.extractMinAndMaxIndexed(e,t,i,n,a,l),r&&(a.x-=a.x*r.x+r.y,a.y-=a.y*r.x+r.y,a.z-=a.z*r.x+r.y,l.x+=l.x*r.x+r.y,l.y+=l.y*r.x+r.y,l.z+=l.z*r.x+r.y),{minimum:a,maximum:l}}function l(e,t,i,n=null,r){const a=new s.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),l=new s.P(-Number.MAX_VALUE,-Number.MAX_VALUE,-Number.MAX_VALUE);return r||(r=3),o.extractMinAndMax(e,t,i,r,a,l),n&&(a.x-=a.x*n.x+n.y,a.y-=a.y*n.x+n.y,a.z-=a.z*n.x+n.y,l.x+=l.x*n.x+n.y,l.y+=l.y*n.x+n.y,l.z+=l.z*n.x+n.y),{minimum:a,maximum:l}}(0,n.gn)([r.G6.filter(((...[e,t])=>!Array.isArray(e)&&!Array.isArray(t)))],o,"extractMinAndMaxIndexed",null),(0,n.gn)([r.G6.filter(((...[e])=>!Array.isArray(e)))],o,"extractMinAndMax",null)},6913:(e,t,i)=>{i.d(t,{RZ:()=>a.RZ,Q:()=>a.Q,RD:()=>n.RD,hr:()=>a.hr,Wo:()=>s.Wo,HE:()=>s.HE,c7:()=>n.c7,j_:()=>a.j_,kn:()=>r.kn,iW:()=>o.i,y3:()=>c.y3,i5:()=>a.i5,Q_:()=>r.Q_,ZZ:()=>a.ZZ,$B:()=>a.$B,JO:()=>l.J,eN:()=>d,$S:()=>u,_f:()=>c._f,$u:()=>h.$,T:()=>n.T,zZ:()=>s.zZ,jp:()=>c.jp,zp:()=>r.zp,Nn:()=>r.Nn,FM:()=>c.FM,P:()=>c.P,Lt:()=>c.Lt,l_:()=>p.l});var n=i(5203),s=i(4649),r=i(1341),o=i(1560),a=i(1277),l=i(142),h=i(9697),c=i(4141);class u{constructor(e=c.P.Zero(),t=c.P.Up()){this.position=e,this.normal=t}clone(){return new u(this.position.clone(),this.normal.clone())}}class d{constructor(e=c.P.Zero(),t=c.P.Up(),i=c.FM.Zero()){this.position=e,this.normal=t,this.uv=i}clone(){return new d(this.position.clone(),this.normal.clone(),this.uv.clone())}}var p=i(4538)},1277:(e,t,i)=>{i.d(t,{$B:()=>u,Q:()=>h,RZ:()=>l,ZZ:()=>c,hr:()=>a,i5:()=>n,j_:()=>d});var n,s=i(1128),r=i(4141),o=i(1341);!function(e){e[e.CW=0]="CW",e[e.CCW=1]="CCW"}(n||(n={}));class a{static Interpolate(e,t,i,n,s){const r=1-3*n+3*t,o=3*n-6*t,a=3*t;let l=e;for(let t=0;t<5;t++){const t=l*l;l-=1/(3*r*t+2*o*l+a)*(r*(t*l)+o*t+a*l-e),l=Math.min(1,Math.max(0,l))}return 3*Math.pow(1-l,2)*l*i+3*(1-l)*Math.pow(l,2)*s+Math.pow(l,3)}}class l{constructor(e){this._radians=e,this._radians<0&&(this._radians+=2*Math.PI)}degrees(){return 180*this._radians/Math.PI}radians(){return this._radians}static BetweenTwoPoints(e,t){const i=t.subtract(e),n=Math.atan2(i.y,i.x);return new l(n)}static FromRadians(e){return new l(e)}static FromDegrees(e){return new l(e*Math.PI/180)}}class h{constructor(e,t,i){this.startPoint=e,this.midPoint=t,this.endPoint=i;const s=Math.pow(t.x,2)+Math.pow(t.y,2),o=(Math.pow(e.x,2)+Math.pow(e.y,2)-s)/2,a=(s-Math.pow(i.x,2)-Math.pow(i.y,2))/2,h=(e.x-t.x)*(t.y-i.y)-(t.x-i.x)*(e.y-t.y);this.centerPoint=new r.FM((o*(t.y-i.y)-a*(e.y-t.y))/h,((e.x-t.x)*a-(t.x-i.x)*o)/h),this.radius=this.centerPoint.subtract(this.startPoint).length(),this.startAngle=l.BetweenTwoPoints(this.centerPoint,this.startPoint);const c=this.startAngle.degrees();let u=l.BetweenTwoPoints(this.centerPoint,this.midPoint).degrees(),d=l.BetweenTwoPoints(this.centerPoint,this.endPoint).degrees();u-c>180&&(u-=360),u-c<-180&&(u+=360),d-u>180&&(d-=360),d-u<-180&&(d+=360),this.orientation=u-c<0?n.CW:n.CCW,this.angle=l.FromDegrees(this.orientation===n.CW?c-d:d-c)}}class c{constructor(e,t){this._points=new Array,this._length=0,this.closed=!1,this._points.push(new r.FM(e,t))}addLineTo(e,t){if(this.closed)return this;const i=new r.FM(e,t),n=this._points[this._points.length-1];return this._points.push(i),this._length+=i.subtract(n).length(),this}addArcTo(e,t,i,s,o=36){if(this.closed)return this;const a=this._points[this._points.length-1],l=new r.FM(e,t),c=new r.FM(i,s),u=new h(a,l,c);let d=u.angle.radians()/o;u.orientation===n.CW&&(d*=-1);let p=u.startAngle.radians()+d;for(let e=0;e<o;e++){const e=Math.cos(p)*u.radius+u.centerPoint.x,t=Math.sin(p)*u.radius+u.centerPoint.y;this.addLineTo(e,t),p+=d}return this}close(){return this.closed=!0,this}length(){let e=this._length;if(this.closed){const t=this._points[this._points.length-1];e+=this._points[0].subtract(t).length()}return e}getPoints(){return this._points}getPointAtLengthPosition(e){if(e<0||e>1)return r.FM.Zero();const t=e*this.length();let i=0;for(let e=0;e<this._points.length;e++){const n=(e+1)%this._points.length,s=this._points[e],o=this._points[n].subtract(s),a=o.length()+i;if(t>=i&&t<=a){const e=o.normalize(),n=t-i;return new r.FM(s.x+e.x*n,s.y+e.y*n)}i=a}return r.FM.Zero()}static StartingAt(e,t){return new c(e,t)}}class u{constructor(e,t=null,i,n=!1){this.path=e,this._curve=new Array,this._distances=new Array,this._tangents=new Array,this._normals=new Array,this._binormals=new Array,this._pointAtData={id:0,point:r.P.Zero(),previousPointArrayIndex:0,position:0,subPosition:0,interpolateReady:!1,interpolationMatrix:r.y3.Identity()};for(let t=0;t<e.length;t++)this._curve[t]=e[t].clone();this._raw=i||!1,this._alignTangentsWithPath=n,this._compute(t,n)}getCurve(){return this._curve}getPoints(){return this._curve}length(){return this._distances[this._distances.length-1]}getTangents(){return this._tangents}getNormals(){return this._normals}getBinormals(){return this._binormals}getDistances(){return this._distances}getPointAt(e){return this._updatePointAtData(e).point}getTangentAt(e,t=!1){return this._updatePointAtData(e,t),t?r.P.TransformCoordinates(r.P.Forward(),this._pointAtData.interpolationMatrix):this._tangents[this._pointAtData.previousPointArrayIndex]}getNormalAt(e,t=!1){return this._updatePointAtData(e,t),t?r.P.TransformCoordinates(r.P.Right(),this._pointAtData.interpolationMatrix):this._normals[this._pointAtData.previousPointArrayIndex]}getBinormalAt(e,t=!1){return this._updatePointAtData(e,t),t?r.P.TransformCoordinates(r.P.UpReadOnly,this._pointAtData.interpolationMatrix):this._binormals[this._pointAtData.previousPointArrayIndex]}getDistanceAt(e){return this.length()*e}getPreviousPointIndexAt(e){return this._updatePointAtData(e),this._pointAtData.previousPointArrayIndex}getSubPositionAt(e){return this._updatePointAtData(e),this._pointAtData.subPosition}getClosestPositionTo(e){let t=Number.MAX_VALUE,i=0;for(let n=0;n<this._curve.length-1;n++){const s=this._curve[n+0],o=this._curve[n+1].subtract(s).normalize(),a=this._distances[n+1]-this._distances[n+0],l=Math.min(Math.max(r.P.Dot(o,e.subtract(s).normalize()),0)*r.P.Distance(s,e)/a,1),h=r.P.Distance(s.add(o.scale(l*a)),e);h<t&&(t=h,i=(this._distances[n+0]+a*l)/this.length())}return i}slice(e=0,t=1){if(e<0&&(e=1- -1*e%1),t<0&&(t=1- -1*t%1),e>t){const i=e;e=t,t=i}const i=this.getCurve(),n=this.getPointAt(e);let s=this.getPreviousPointIndexAt(e);const r=this.getPointAt(t),o=this.getPreviousPointIndexAt(t)+1,a=[];return 0!==e&&(s++,a.push(n)),a.push(...i.slice(s,o)),1===t&&1!==e||a.push(r),new u(a,this.getNormalAt(e),this._raw,this._alignTangentsWithPath)}update(e,t=null,i=!1){for(let t=0;t<e.length;t++)this._curve[t].x=e[t].x,this._curve[t].y=e[t].y,this._curve[t].z=e[t].z;return this._compute(t,i),this}_compute(e,t=!1){const i=this._curve.length;if(i<2)return;this._tangents[0]=this._getFirstNonNullVector(0),this._raw||this._tangents[0].normalize(),this._tangents[i-1]=this._curve[i-1].subtract(this._curve[i-2]),this._raw||this._tangents[i-1].normalize();const n=this._tangents[0],s=this._normalVector(n,e);let o,a,l,h,c;this._normals[0]=s,this._raw||this._normals[0].normalize(),this._binormals[0]=r.P.Cross(n,this._normals[0]),this._raw||this._binormals[0].normalize(),this._distances[0]=0;for(let e=1;e<i;e++)o=this._getLastNonNullVector(e),e<i-1&&(a=this._getFirstNonNullVector(e),this._tangents[e]=t?a:o.add(a),this._tangents[e].normalize()),this._distances[e]=this._distances[e-1]+this._curve[e].subtract(this._curve[e-1]).length(),l=this._tangents[e],c=this._binormals[e-1],this._normals[e]=r.P.Cross(c,l),this._raw||(0===this._normals[e].length()?(h=this._normals[e-1],this._normals[e]=h.clone()):this._normals[e].normalize()),this._binormals[e]=r.P.Cross(l,this._normals[e]),this._raw||this._binormals[e].normalize();this._pointAtData.id=NaN}_getFirstNonNullVector(e){let t=1,i=this._curve[e+t].subtract(this._curve[e]);for(;0===i.length()&&e+t+1<this._curve.length;)t++,i=this._curve[e+t].subtract(this._curve[e]);return i}_getLastNonNullVector(e){let t=1,i=this._curve[e].subtract(this._curve[e-t]);for(;0===i.length()&&e>t+1;)t++,i=this._curve[e].subtract(this._curve[e-t]);return i}_normalVector(e,t){let i,n=e.length();if(0===n&&(n=1),null==t){let t;t=s.R.WithinEpsilon(Math.abs(e.y)/n,1,o.kn)?s.R.WithinEpsilon(Math.abs(e.x)/n,1,o.kn)?s.R.WithinEpsilon(Math.abs(e.z)/n,1,o.kn)?r.P.Zero():new r.P(0,0,1):new r.P(1,0,0):new r.P(0,-1,0),i=r.P.Cross(e,t)}else i=r.P.Cross(e,t),r.P.CrossToRef(i,e,i);return i.normalize(),i}_updatePointAtData(e,t=!1){if(this._pointAtData.id===e)return this._pointAtData.interpolateReady||this._updateInterpolationMatrix(),this._pointAtData;this._pointAtData.id=e;const i=this.getPoints();if(e<=0)return this._setPointAtData(0,0,i[0],0,t);if(e>=1)return this._setPointAtData(1,1,i[i.length-1],i.length-1,t);let n,s=i[0],o=0;const a=e*this.length();for(let l=1;l<i.length;l++){n=i[l];const h=r.P.Distance(s,n);if(o+=h,o===a)return this._setPointAtData(e,1,n,l,t);if(o>a){const i=(o-a)/h,r=s.subtract(n),c=n.add(r.scaleInPlace(i));return this._setPointAtData(e,1-i,c,l-1,t)}s=n}return this._pointAtData}_setPointAtData(e,t,i,n,s){return this._pointAtData.point=i,this._pointAtData.position=e,this._pointAtData.subPosition=t,this._pointAtData.previousPointArrayIndex=n,this._pointAtData.interpolateReady=s,s&&this._updateInterpolationMatrix(),this._pointAtData}_updateInterpolationMatrix(){this._pointAtData.interpolationMatrix=r.y3.Identity();const e=this._pointAtData.previousPointArrayIndex;if(e!==this._tangents.length-1){const t=e+1,i=this._tangents[e].clone(),n=this._normals[e].clone(),s=this._binormals[e].clone(),o=this._tangents[t].clone(),a=this._normals[t].clone(),l=this._binormals[t].clone(),h=r._f.RotationQuaternionFromAxis(n,s,i),c=r._f.RotationQuaternionFromAxis(a,l,o);r._f.Slerp(h,c,this._pointAtData.subPosition).toRotationMatrix(this._pointAtData.interpolationMatrix)}}}class d{static CreateQuadraticBezier(e,t,i,n){n=n>2?n:3;const s=new Array,o=(e,t,i,n)=>(1-e)*(1-e)*t+2*e*(1-e)*i+e*e*n;for(let a=0;a<=n;a++)s.push(new r.P(o(a/n,e.x,t.x,i.x),o(a/n,e.y,t.y,i.y),o(a/n,e.z,t.z,i.z)));return new d(s)}static CreateCubicBezier(e,t,i,n,s){s=s>3?s:4;const o=new Array,a=(e,t,i,n,s)=>(1-e)*(1-e)*(1-e)*t+3*e*(1-e)*(1-e)*i+3*e*e*(1-e)*n+e*e*e*s;for(let l=0;l<=s;l++)o.push(new r.P(a(l/s,e.x,t.x,i.x,n.x),a(l/s,e.y,t.y,i.y,n.y),a(l/s,e.z,t.z,i.z,n.z)));return new d(o)}static CreateHermiteSpline(e,t,i,n,s){const o=new Array,a=1/s;for(let l=0;l<=s;l++)o.push(r.P.Hermite(e,t,i,n,l*a));return new d(o)}static CreateCatmullRomSpline(e,t,i){const n=new Array,s=1/t;let o=0;if(i){const i=e.length;for(let a=0;a<i;a++){o=0;for(let l=0;l<t;l++)n.push(r.P.CatmullRom(e[a%i],e[(a+1)%i],e[(a+2)%i],e[(a+3)%i],o)),o+=s}n.push(n[0])}else{const i=new Array;i.push(e[0].clone()),Array.prototype.push.apply(i,e),i.push(e[e.length-1].clone());let a=0;for(;a<i.length-3;a++){o=0;for(let e=0;e<t;e++)n.push(r.P.CatmullRom(i[a],i[a+1],i[a+2],i[a+3],o)),o+=s}a--,n.push(r.P.CatmullRom(i[a],i[a+1],i[a+2],i[a+3],o))}return new d(n)}static ArcThru3Points(e,t,i,n=32,s=!1,o=!1){const a=new Array,l=t.subtract(e),h=i.subtract(t),c=e.subtract(i),u=r.P.Cross(l,h),p=u.length();if(p<Math.pow(10,-8))return new d(a);const f=l.lengthSquared(),_=h.lengthSquared(),m=c.lengthSquared(),g=u.lengthSquared(),v=.5*l.length()*h.length()*c.length()/p,y=-.5*_*r.P.Dot(l,c)/g,x=-.5*m*r.P.Dot(l,h)/g,b=-.5*f*r.P.Dot(h,c)/g,T=e.scale(y).add(t.scale(x)).add(i.scale(b)),S=e.subtract(T).normalize(),E=r.P.Cross(u,S).normalize();if(o){const t=2*Math.PI/n;for(let e=0;e<=2*Math.PI;e+=t)a.push(T.add(S.scale(v*Math.cos(e)).add(E.scale(v*Math.sin(e)))));a.push(e)}else{const t=1/n;let o=0,l=r.P.Zero();do{l=T.add(S.scale(v*Math.cos(o)).add(E.scale(v*Math.sin(o)))),a.push(l),o+=t}while(!l.equalsWithEpsilon(i,v*t*1.1));a.push(i),s&&a.push(e)}return new d(a)}constructor(e){this._length=0,this._points=e,this._length=this._computeLength(e)}getPoints(){return this._points}length(){return this._length}continue(e){const t=this._points[this._points.length-1],i=this._points.slice(),n=e.getPoints();for(let e=1;e<n.length;e++)i.push(n[e].subtract(n[0]).add(t));return new d(i)}_computeLength(e){let t=0;for(let i=1;i<e.length;i++)t+=e[i].subtract(e[i-1]).length();return t}}},142:(e,t,i)=>{i.d(t,{J:()=>s});var n=i(4141);class s{constructor(e,t,i,s){this.normal=new n.P(e,t,i),this.d=s}asArray(){return[this.normal.x,this.normal.y,this.normal.z,this.d]}clone(){return new s(this.normal.x,this.normal.y,this.normal.z,this.d)}getClassName(){return"Plane"}getHashCode(){let e=this.normal.getHashCode();return e=397*e^(0|this.d),e}normalize(){const e=Math.sqrt(this.normal.x*this.normal.x+this.normal.y*this.normal.y+this.normal.z*this.normal.z);let t=0;return 0!==e&&(t=1/e),this.normal.x*=t,this.normal.y*=t,this.normal.z*=t,this.d*=t,this}transform(e){const t=s._TmpMatrix;e.invertToRef(t);const i=t.m,n=this.normal.x,r=this.normal.y,o=this.normal.z,a=this.d,l=n*i[0]+r*i[1]+o*i[2]+a*i[3],h=n*i[4]+r*i[5]+o*i[6]+a*i[7],c=n*i[8]+r*i[9]+o*i[10]+a*i[11],u=n*i[12]+r*i[13]+o*i[14]+a*i[15];return new s(l,h,c,u)}dotCoordinate(e){return this.normal.x*e.x+this.normal.y*e.y+this.normal.z*e.z+this.d}copyFromPoints(e,t,i){const n=t.x-e.x,s=t.y-e.y,r=t.z-e.z,o=i.x-e.x,a=i.y-e.y,l=i.z-e.z,h=s*l-r*a,c=r*o-n*l,u=n*a-s*o,d=Math.sqrt(h*h+c*c+u*u);let p;return p=0!==d?1/d:0,this.normal.x=h*p,this.normal.y=c*p,this.normal.z=u*p,this.d=-(this.normal.x*e.x+this.normal.y*e.y+this.normal.z*e.z),this}isFrontFacingTo(e,t){return n.P.Dot(this.normal,e)<=t}signedDistanceTo(e){return n.P.Dot(e,this.normal)+this.d}static FromArray(e){return new s(e[0],e[1],e[2],e[3])}static FromPoints(e,t,i){const n=new s(0,0,0,0);return n.copyFromPoints(e,t,i),n}static FromPositionAndNormal(e,t){const i=new s(0,0,0,0);return t.normalize(),i.normal=t,i.d=-(t.x*e.x+t.y*e.y+t.z*e.z),i}static SignedDistanceToPlaneFromPositionAndNormal(e,t,i){const s=-(t.x*e.x+t.y*e.y+t.z*e.z);return n.P.Dot(i,t)+s}}s._TmpMatrix=n.y3.Identity()},1128:(e,t,i)=>{i.d(t,{R:()=>n});class n{static WithinEpsilon(e,t,i=1401298e-51){return Math.abs(e-t)<=i}static ToHex(e){const t=e.toString(16);return e<=15?("0"+t).toUpperCase():t.toUpperCase()}static Sign(e){return 0==(e=+e)||isNaN(e)?e:e>0?1:-1}static Clamp(e,t=0,i=1){return Math.min(i,Math.max(t,e))}static Log2(e){return Math.log(e)*Math.LOG2E}static ILog2(e){if(Math.log2)return Math.floor(Math.log2(e));if(e<0)return NaN;if(0===e)return-1/0;let t=0;if(e<1){for(;e<1;)t++,e*=2;t=-t}else if(e>1)for(;e>1;)t++,e=Math.floor(e/2);return t}static Repeat(e,t){return e-Math.floor(e/t)*t}static Normalize(e,t,i){return(e-t)/(i-t)}static Denormalize(e,t,i){return e*(i-t)+t}static DeltaAngle(e,t){let i=n.Repeat(t-e,360);return i>180&&(i-=360),i}static PingPong(e,t){const i=n.Repeat(e,2*t);return t-Math.abs(i-t)}static SmoothStep(e,t,i){let s=n.Clamp(i);return s=-2*s*s*s+3*s*s,t*s+e*(1-s)}static MoveTowards(e,t,i){let s=0;return s=Math.abs(t-e)<=i?t:e+n.Sign(t-e)*i,s}static MoveTowardsAngle(e,t,i){const s=n.DeltaAngle(e,t);let r=0;return-i<s&&s<i?r=t:(t=e+s,r=n.MoveTowards(e,t,i)),r}static Lerp(e,t,i){return e+(t-e)*i}static LerpAngle(e,t,i){let s=n.Repeat(t-e,360);return s>180&&(s-=360),e+s*n.Clamp(i)}static InverseLerp(e,t,i){let s=0;return s=e!=t?n.Clamp((i-e)/(t-e)):0,s}static Hermite(e,t,i,n,s){const r=s*s,o=s*r;return e*(2*o-3*r+1)+i*(-2*o+3*r)+t*(o-2*r+s)+n*(o-r)}static Hermite1stDerivative(e,t,i,n,s){const r=s*s;return 6*(r-s)*e+(3*r-4*s+1)*t+6*(-r+s)*i+(3*r-2*s)*n}static RandomRange(e,t){return e===t?e:Math.random()*(t-e)+e}static RangeToPercent(e,t,i){return(e-t)/(i-t)}static PercentToRange(e,t,i){return(i-t)*e+t}static NormalizeRadians(e){return e-n.TwoPi*Math.floor((e+Math.PI)/n.TwoPi)}static HCF(e,t){const i=e%t;return 0===i?t:n.HCF(t,i)}}n.TwoPi=2*Math.PI},9697:(e,t,i)=>{i.d(t,{$:()=>n});class n{constructor(e,t){this.width=e,this.height=t}toString(){return`{W: ${this.width}, H: ${this.height}}`}getClassName(){return"Size"}getHashCode(){let e=0|this.width;return e=397*e^(0|this.height),e}copyFrom(e){this.width=e.width,this.height=e.height}copyFromFloats(e,t){return this.width=e,this.height=t,this}set(e,t){return this.copyFromFloats(e,t)}multiplyByFloats(e,t){return new n(this.width*e,this.height*t)}clone(){return new n(this.width,this.height)}equals(e){return!!e&&this.width===e.width&&this.height===e.height}get surface(){return this.width*this.height}static Zero(){return new n(0,0)}add(e){return new n(this.width+e.width,this.height+e.height)}subtract(e){return new n(this.width-e.width,this.height-e.height)}static Lerp(e,t,i){const s=e.width+(t.width-e.width)*i,r=e.height+(t.height-e.height)*i;return new n(s,r)}}},4141:(e,t,i)=>{i.d(t,{FM:()=>c,Lt:()=>d,P:()=>u,_f:()=>p,jp:()=>m,y3:()=>f});var n=i(1128),s=i(1341),r=i(5860),o=i(2208),a=i(771),l=i(1431);const h=e=>parseInt(e.toString().replace(/\W/g,""));class c{constructor(e=0,t=0){this.x=e,this.y=t}toString(){return`{X: ${this.x} Y: ${this.y}}`}getClassName(){return"Vector2"}getHashCode(){let e=h(this.x);return e=397*e^h(this.y),e}toArray(e,t=0){return e[t]=this.x,e[t+1]=this.y,this}fromArray(e,t=0){return c.FromArrayToRef(e,t,this),this}asArray(){const e=new Array;return this.toArray(e,0),e}copyFrom(e){return this.x=e.x,this.y=e.y,this}copyFromFloats(e,t){return this.x=e,this.y=t,this}set(e,t){return this.copyFromFloats(e,t)}add(e){return new this.constructor(this.x+e.x,this.y+e.y)}addToRef(e,t){return t.x=this.x+e.x,t.y=this.y+e.y,t}addInPlace(e){return this.x+=e.x,this.y+=e.y,this}addVector3(e){return new this.constructor(this.x+e.x,this.y+e.y)}subtract(e){return new this.constructor(this.x-e.x,this.y-e.y)}subtractToRef(e,t){return t.x=this.x-e.x,t.y=this.y-e.y,t}subtractInPlace(e){return this.x-=e.x,this.y-=e.y,this}multiplyInPlace(e){return this.x*=e.x,this.y*=e.y,this}multiply(e){return new this.constructor(this.x*e.x,this.y*e.y)}multiplyToRef(e,t){return t.x=this.x*e.x,t.y=this.y*e.y,t}multiplyByFloats(e,t){return new this.constructor(this.x*e,this.y*t)}divide(e){return new this.constructor(this.x/e.x,this.y/e.y)}divideToRef(e,t){return t.x=this.x/e.x,t.y=this.y/e.y,t}divideInPlace(e){return this.divideToRef(e,this)}negate(){return new this.constructor(-this.x,-this.y)}negateInPlace(){return this.x*=-1,this.y*=-1,this}negateToRef(e){return e.copyFromFloats(-1*this.x,-1*this.y)}scaleInPlace(e){return this.x*=e,this.y*=e,this}scale(e){const t=new this.constructor(0,0);return this.scaleToRef(e,t),t}scaleToRef(e,t){return t.x=this.x*e,t.y=this.y*e,t}scaleAndAddToRef(e,t){return t.x+=this.x*e,t.y+=this.y*e,t}equals(e){return e&&this.x===e.x&&this.y===e.y}equalsWithEpsilon(e,t=s.kn){return e&&n.R.WithinEpsilon(this.x,e.x,t)&&n.R.WithinEpsilon(this.y,e.y,t)}floor(){return new this.constructor(Math.floor(this.x),Math.floor(this.y))}fract(){return new this.constructor(this.x-Math.floor(this.x),this.y-Math.floor(this.y))}rotateToRef(e,t){const i=Math.cos(e),n=Math.sin(e),s=i*this.x-n*this.y,r=n*this.x+i*this.y;return t.x=s,t.y=r,t}length(){return Math.sqrt(this.x*this.x+this.y*this.y)}lengthSquared(){return this.x*this.x+this.y*this.y}normalize(){return c.NormalizeToRef(this,this),this}clone(){return new this.constructor(this.x,this.y)}static Zero(){return new c(0,0)}static One(){return new c(1,1)}static Random(e=0,t=1){return new c(n.R.RandomRange(e,t),n.R.RandomRange(e,t))}static get ZeroReadOnly(){return c._ZeroReadOnly}static FromArray(e,t=0){return new c(e[t],e[t+1])}static FromArrayToRef(e,t,i){return i.x=e[t],i.y=e[t+1],i}static CatmullRom(e,t,i,n,s){const r=s*s,o=s*r,a=.5*(2*t.x+(-e.x+i.x)*s+(2*e.x-5*t.x+4*i.x-n.x)*r+(-e.x+3*t.x-3*i.x+n.x)*o),l=.5*(2*t.y+(-e.y+i.y)*s+(2*e.y-5*t.y+4*i.y-n.y)*r+(-e.y+3*t.y-3*i.y+n.y)*o);return new e.constructor(a,l)}static Clamp(e,t,i){let n=e.x;n=n>i.x?i.x:n,n=n<t.x?t.x:n;let s=e.y;return s=s>i.y?i.y:s,s=s<t.y?t.y:s,new e.constructor(n,s)}static Hermite(e,t,i,n,s){const r=s*s,o=s*r,a=2*o-3*r+1,l=-2*o+3*r,h=o-2*r+s,c=o-r,u=e.x*a+i.x*l+t.x*h+n.x*c,d=e.y*a+i.y*l+t.y*h+n.y*c;return new e.constructor(u,d)}static Hermite1stDerivative(e,t,i,n,s){const r=new e.constructor;return this.Hermite1stDerivativeToRef(e,t,i,n,s,r),r}static Hermite1stDerivativeToRef(e,t,i,n,s,r){const o=s*s;return r.x=6*(o-s)*e.x+(3*o-4*s+1)*t.x+6*(-o+s)*i.x+(3*o-2*s)*n.x,r.y=6*(o-s)*e.y+(3*o-4*s+1)*t.y+6*(-o+s)*i.y+(3*o-2*s)*n.y,r}static Lerp(e,t,i){const n=e.x+(t.x-e.x)*i,s=e.y+(t.y-e.y)*i;return new e.constructor(n,s)}static Dot(e,t){return e.x*t.x+e.y*t.y}static Normalize(e){const t=new e.constructor;return this.NormalizeToRef(e,t),t}static NormalizeToRef(e,t){const i=e.length();return 0===i||(t.x=e.x/i,t.y=e.y/i),t}static Minimize(e,t){const i=e.x<t.x?e.x:t.x,n=e.y<t.y?e.y:t.y;return new e.constructor(i,n)}static Maximize(e,t){const i=e.x>t.x?e.x:t.x,n=e.y>t.y?e.y:t.y;return new e.constructor(i,n)}static Transform(e,t){const i=new e.constructor;return c.TransformToRef(e,t,i),i}static TransformToRef(e,t,i){const n=t.m,s=e.x*n[0]+e.y*n[4]+n[12],r=e.x*n[1]+e.y*n[5]+n[13];return i.x=s,i.y=r,i}static PointInTriangle(e,t,i,n){const s=.5*(-i.y*n.x+t.y*(-i.x+n.x)+t.x*(i.y-n.y)+i.x*n.y),r=s<0?-1:1,o=(t.y*n.x-t.x*n.y+(n.y-t.y)*e.x+(t.x-n.x)*e.y)*r,a=(t.x*i.y-t.y*i.x+(t.y-i.y)*e.x+(i.x-t.x)*e.y)*r;return o>0&&a>0&&o+a<2*s*r}static Distance(e,t){return Math.sqrt(c.DistanceSquared(e,t))}static DistanceSquared(e,t){const i=e.x-t.x,n=e.y-t.y;return i*i+n*n}static Center(e,t){const i=new e.constructor;return c.CenterToRef(e,t,i)}static CenterToRef(e,t,i){return i.copyFromFloats((e.x+t.x)/2,(e.y+t.y)/2)}static DistanceOfPointFromSegment(e,t,i){const n=c.DistanceSquared(t,i);if(0===n)return c.Distance(e,t);const s=i.subtract(t),r=Math.max(0,Math.min(1,c.Dot(e.subtract(t),s)/n)),o=t.add(s.multiplyByFloats(r,r));return c.Distance(e,o)}}c._ZeroReadOnly=c.Zero();class u{get x(){return this._x}set x(e){this._x=e,this._isDirty=!0}get y(){return this._y}set y(e){this._y=e,this._isDirty=!0}get z(){return this._z}set z(e){this._z=e,this._isDirty=!0}constructor(e=0,t=0,i=0){this._isDirty=!0,this._x=e,this._y=t,this._z=i}toString(){return`{X: ${this._x} Y: ${this._y} Z: ${this._z}}`}getClassName(){return"Vector3"}getHashCode(){let e=h(this._x);return e=397*e^h(this._y),e=397*e^h(this._z),e}asArray(){const e=[];return this.toArray(e,0),e}toArray(e,t=0){return e[t]=this._x,e[t+1]=this._y,e[t+2]=this._z,this}fromArray(e,t=0){return u.FromArrayToRef(e,t,this),this}toQuaternion(){return p.RotationYawPitchRoll(this._y,this._x,this._z)}addInPlace(e){return this.addInPlaceFromFloats(e._x,e._y,e._z)}addInPlaceFromFloats(e,t,i){return this._x+=e,this._y+=t,this._z+=i,this._isDirty=!0,this}add(e){return new this.constructor(this._x+e._x,this._y+e._y,this._z+e._z)}addToRef(e,t){return t.copyFromFloats(this._x+e._x,this._y+e._y,this._z+e._z)}subtractInPlace(e){return this._x-=e._x,this._y-=e._y,this._z-=e._z,this._isDirty=!0,this}subtract(e){return new this.constructor(this._x-e._x,this._y-e._y,this._z-e._z)}subtractToRef(e,t){return this.subtractFromFloatsToRef(e._x,e._y,e._z,t)}subtractFromFloats(e,t,i){return new this.constructor(this._x-e,this._y-t,this._z-i)}subtractFromFloatsToRef(e,t,i,n){return n.copyFromFloats(this._x-e,this._y-t,this._z-i)}negate(){return new this.constructor(-this._x,-this._y,-this._z)}negateInPlace(){return this._x*=-1,this._y*=-1,this._z*=-1,this._isDirty=!0,this}negateToRef(e){return e.copyFromFloats(-1*this._x,-1*this._y,-1*this._z)}scaleInPlace(e){return this._x*=e,this._y*=e,this._z*=e,this._isDirty=!0,this}scale(e){return new this.constructor(this._x*e,this._y*e,this._z*e)}scaleToRef(e,t){return t.copyFromFloats(this._x*e,this._y*e,this._z*e)}getNormalToRef(e){const t=this.length();let i=Math.acos(this.y/t);const n=Math.atan2(this.z,this.x);i>Math.PI/2?i-=Math.PI/2:i+=Math.PI/2;const s=t*Math.sin(i)*Math.cos(n),r=t*Math.cos(i),o=t*Math.sin(i)*Math.sin(n);return e.set(s,r,o),e}applyRotationQuaternionToRef(e,t){const i=e._w*this._x+e._y*this._z-e._z*this._y,n=e._w*this._y+e._z*this._x-e._x*this._z,s=e._w*this._z+e._x*this._y-e._y*this._x,r=-e._x*this._x-e._y*this._y-e._z*this._z;return t._x=i*e._w+r*-e._x+n*-e._z-s*-e._y,t._y=n*e._w+r*-e._y+s*-e._x-i*-e._z,t._z=s*e._w+r*-e._z+i*-e._y-n*-e._x,t._isDirty=!0,t}applyRotationQuaternionInPlace(e){return this.applyRotationQuaternionToRef(e,this)}applyRotationQuaternion(e){return this.applyRotationQuaternionToRef(e,new this.constructor)}scaleAndAddToRef(e,t){return t.addInPlaceFromFloats(this._x*e,this._y*e,this._z*e)}projectOnPlane(e,t){const i=new this.constructor;return this.projectOnPlaneToRef(e,t,i),i}projectOnPlaneToRef(e,t,i){const n=e.normal,s=e.d,r=_.Vector3[0];this.subtractToRef(t,r),r.normalize();const o=u.Dot(r,n);if(Math.abs(o)<Math.pow(10,-10))i.setAll(1/0);else{const e=-(u.Dot(t,n)+s)/o,a=r.scaleInPlace(e);t.addToRef(a,i)}return i}equals(e){return e&&this._x===e._x&&this._y===e._y&&this._z===e._z}equalsWithEpsilon(e,t=s.kn){return e&&n.R.WithinEpsilon(this._x,e._x,t)&&n.R.WithinEpsilon(this._y,e._y,t)&&n.R.WithinEpsilon(this._z,e._z,t)}equalsToFloats(e,t,i){return this._x===e&&this._y===t&&this._z===i}multiplyInPlace(e){return this._x*=e._x,this._y*=e._y,this._z*=e._z,this._isDirty=!0,this}multiply(e){return this.multiplyByFloats(e._x,e._y,e._z)}multiplyToRef(e,t){return t.copyFromFloats(this._x*e._x,this._y*e._y,this._z*e._z)}multiplyByFloats(e,t,i){return new this.constructor(this._x*e,this._y*t,this._z*i)}divide(e){return new this.constructor(this._x/e._x,this._y/e._y,this._z/e._z)}divideToRef(e,t){return t.copyFromFloats(this._x/e._x,this._y/e._y,this._z/e._z)}divideInPlace(e){return this.divideToRef(e,this)}minimizeInPlace(e){return this.minimizeInPlaceFromFloats(e._x,e._y,e._z)}maximizeInPlace(e){return this.maximizeInPlaceFromFloats(e._x,e._y,e._z)}minimizeInPlaceFromFloats(e,t,i){return e<this._x&&(this.x=e),t<this._y&&(this.y=t),i<this._z&&(this.z=i),this}maximizeInPlaceFromFloats(e,t,i){return e>this._x&&(this.x=e),t>this._y&&(this.y=t),i>this._z&&(this.z=i),this}isNonUniformWithinEpsilon(e){const t=Math.abs(this._x),i=Math.abs(this._y);if(!n.R.WithinEpsilon(t,i,e))return!0;const s=Math.abs(this._z);return!n.R.WithinEpsilon(t,s,e)||!n.R.WithinEpsilon(i,s,e)}get isNonUniform(){const e=Math.abs(this._x);return e!==Math.abs(this._y)||e!==Math.abs(this._z)}floor(){return new this.constructor(Math.floor(this._x),Math.floor(this._y),Math.floor(this._z))}fract(){return new this.constructor(this._x-Math.floor(this._x),this._y-Math.floor(this._y),this._z-Math.floor(this._z))}length(){return Math.sqrt(this._x*this._x+this._y*this._y+this._z*this._z)}lengthSquared(){return this._x*this._x+this._y*this._y+this._z*this._z}get hasAZeroComponent(){return this._x*this._y*this._z==0}normalize(){return this.normalizeFromLength(this.length())}reorderInPlace(e){return"xyz"===(e=e.toLowerCase())||(_.Vector3[0].copyFrom(this),["x","y","z"].forEach(((t,i)=>{this[t]=_.Vector3[0][e[i]]}))),this}rotateByQuaternionToRef(e,t){return e.toRotationMatrix(_.Matrix[0]),u.TransformCoordinatesToRef(this,_.Matrix[0],t),t}rotateByQuaternionAroundPointToRef(e,t,i){return this.subtractToRef(t,_.Vector3[0]),_.Vector3[0].rotateByQuaternionToRef(e,_.Vector3[0]),t.addToRef(_.Vector3[0],i),i}cross(e){const t=new this.constructor;return u.CrossToRef(this,e,t)}normalizeFromLength(e){return 0===e||1===e?this:this.scaleInPlace(1/e)}normalizeToNew(){const e=new this.constructor(0,0,0);return this.normalizeToRef(e),e}normalizeToRef(e){const t=this.length();return 0===t||1===t?e.copyFromFloats(this._x,this._y,this._z):this.scaleToRef(1/t,e)}clone(){return new this.constructor(this._x,this._y,this._z)}copyFrom(e){return this.copyFromFloats(e._x,e._y,e._z)}copyFromFloats(e,t,i){return this._x=e,this._y=t,this._z=i,this._isDirty=!0,this}set(e,t,i){return this.copyFromFloats(e,t,i)}setAll(e){return this._x=this._y=this._z=e,this._isDirty=!0,this}static GetClipFactor(e,t,i,n){const s=u.Dot(e,i)-n;return s/(s-(u.Dot(t,i)-n))}static GetAngleBetweenVectors(e,t,i){const s=e.normalizeToRef(_.Vector3[1]),r=t.normalizeToRef(_.Vector3[2]);let o=u.Dot(s,r);o=n.R.Clamp(o,-1,1);const a=Math.acos(o),l=_.Vector3[3];return u.CrossToRef(s,r,l),u.Dot(l,i)>0?isNaN(a)?0:a:isNaN(a)?-Math.PI:-Math.acos(o)}static GetAngleBetweenVectorsOnPlane(e,t,i){_.Vector3[0].copyFrom(e);const s=_.Vector3[0];_.Vector3[1].copyFrom(t);const r=_.Vector3[1];_.Vector3[2].copyFrom(i);const o=_.Vector3[2],a=_.Vector3[3],l=_.Vector3[4];s.normalize(),r.normalize(),o.normalize(),u.CrossToRef(o,s,a),u.CrossToRef(a,o,l);const h=Math.atan2(u.Dot(r,a),u.Dot(r,l));return n.R.NormalizeRadians(h)}static PitchYawRollToMoveBetweenPointsToRef(e,t,i){const n=m.Vector3[0];return t.subtractToRef(e,n),i._y=Math.atan2(n.x,n.z)||0,i._x=Math.atan2(Math.sqrt(n.x**2+n.z**2),n.y)||0,i._z=0,i._isDirty=!0,i}static PitchYawRollToMoveBetweenPoints(e,t){const i=u.Zero();return u.PitchYawRollToMoveBetweenPointsToRef(e,t,i)}static SlerpToRef(e,t,i,r){i=n.R.Clamp(i,0,1);const o=_.Vector3[0],a=_.Vector3[1];o.copyFrom(e);const l=o.length();o.normalizeFromLength(l),a.copyFrom(t);const h=a.length();a.normalizeFromLength(h);const c=u.Dot(o,a);let d,p;if(c<1-s.kn){const e=Math.acos(c),t=1/Math.sin(e);d=Math.sin((1-i)*e)*t,p=Math.sin(i*e)*t}else d=1-i,p=i;return o.scaleInPlace(d),a.scaleInPlace(p),r.copyFrom(o).addInPlace(a),r.scaleInPlace(n.R.Lerp(l,h,i)),r}static SmoothToRef(e,t,i,n,s){return u.SlerpToRef(e,t,0===n?1:i/n,s),s}static FromArray(e,t=0){return new u(e[t],e[t+1],e[t+2])}static FromFloatArray(e,t){return u.FromArray(e,t)}static FromArrayToRef(e,t,i){return i._x=e[t],i._y=e[t+1],i._z=e[t+2],i._isDirty=!0,i}static FromFloatArrayToRef(e,t,i){return u.FromArrayToRef(e,t,i)}static FromFloatsToRef(e,t,i,n){return n.copyFromFloats(e,t,i),n}static Zero(){return new u(0,0,0)}static One(){return new u(1,1,1)}static Up(){return new u(0,1,0)}static get UpReadOnly(){return u._UpReadOnly}static get DownReadOnly(){return u._DownReadOnly}static get RightReadOnly(){return u._RightReadOnly}static get LeftReadOnly(){return u._LeftReadOnly}static get LeftHandedForwardReadOnly(){return u._LeftHandedForwardReadOnly}static get RightHandedForwardReadOnly(){return u._RightHandedForwardReadOnly}static get LeftHandedBackwardReadOnly(){return u._LeftHandedBackwardReadOnly}static get RightHandedBackwardReadOnly(){return u._RightHandedBackwardReadOnly}static get ZeroReadOnly(){return u._ZeroReadOnly}static Down(){return new u(0,-1,0)}static Forward(e=!1){return new u(0,0,e?-1:1)}static Backward(e=!1){return new u(0,0,e?1:-1)}static Right(){return new u(1,0,0)}static Left(){return new u(-1,0,0)}static Random(e=0,t=1){return new u(n.R.RandomRange(e,t),n.R.RandomRange(e,t),n.R.RandomRange(e,t))}static TransformCoordinates(e,t){const i=u.Zero();return u.TransformCoordinatesToRef(e,t,i),i}static TransformCoordinatesToRef(e,t,i){return u.TransformCoordinatesFromFloatsToRef(e._x,e._y,e._z,t,i),i}static TransformCoordinatesFromFloatsToRef(e,t,i,n,s){const r=n.m,o=e*r[0]+t*r[4]+i*r[8]+r[12],a=e*r[1]+t*r[5]+i*r[9]+r[13],l=e*r[2]+t*r[6]+i*r[10]+r[14],h=1/(e*r[3]+t*r[7]+i*r[11]+r[15]);return s._x=o*h,s._y=a*h,s._z=l*h,s._isDirty=!0,s}static TransformNormal(e,t){const i=u.Zero();return u.TransformNormalToRef(e,t,i),i}static TransformNormalToRef(e,t,i){return this.TransformNormalFromFloatsToRef(e._x,e._y,e._z,t,i),i}static TransformNormalFromFloatsToRef(e,t,i,n,s){const r=n.m;return s._x=e*r[0]+t*r[4]+i*r[8],s._y=e*r[1]+t*r[5]+i*r[9],s._z=e*r[2]+t*r[6]+i*r[10],s._isDirty=!0,s}static CatmullRom(e,t,i,n,s){const r=s*s,o=s*r,a=.5*(2*t._x+(-e._x+i._x)*s+(2*e._x-5*t._x+4*i._x-n._x)*r+(-e._x+3*t._x-3*i._x+n._x)*o),l=.5*(2*t._y+(-e._y+i._y)*s+(2*e._y-5*t._y+4*i._y-n._y)*r+(-e._y+3*t._y-3*i._y+n._y)*o),h=.5*(2*t._z+(-e._z+i._z)*s+(2*e._z-5*t._z+4*i._z-n._z)*r+(-e._z+3*t._z-3*i._z+n._z)*o);return new e.constructor(a,l,h)}static Clamp(e,t,i){const n=new e.constructor;return u.ClampToRef(e,t,i,n),n}static ClampToRef(e,t,i,n){let s=e._x;s=s>i._x?i._x:s,s=s<t._x?t._x:s;let r=e._y;r=r>i._y?i._y:r,r=r<t._y?t._y:r;let o=e._z;return o=o>i._z?i._z:o,o=o<t._z?t._z:o,n.copyFromFloats(s,r,o),n}static CheckExtends(e,t,i){t.minimizeInPlace(e),i.maximizeInPlace(e)}static Hermite(e,t,i,n,s){const r=s*s,o=s*r,a=2*o-3*r+1,l=-2*o+3*r,h=o-2*r+s,c=o-r,u=e._x*a+i._x*l+t._x*h+n._x*c,d=e._y*a+i._y*l+t._y*h+n._y*c,p=e._z*a+i._z*l+t._z*h+n._z*c;return new e.constructor(u,d,p)}static Hermite1stDerivative(e,t,i,n,s){const r=new e.constructor;return this.Hermite1stDerivativeToRef(e,t,i,n,s,r),r}static Hermite1stDerivativeToRef(e,t,i,n,s,r){const o=s*s;return r._x=6*(o-s)*e._x+(3*o-4*s+1)*t._x+6*(-o+s)*i._x+(3*o-2*s)*n._x,r._y=6*(o-s)*e._y+(3*o-4*s+1)*t._y+6*(-o+s)*i._y+(3*o-2*s)*n._y,r._z=6*(o-s)*e._z+(3*o-4*s+1)*t._z+6*(-o+s)*i._z+(3*o-2*s)*n._z,r._isDirty=!0,r}static Lerp(e,t,i){const n=new e.constructor(0,0,0);return u.LerpToRef(e,t,i,n),n}static LerpToRef(e,t,i,n){return n._x=e._x+(t._x-e._x)*i,n._y=e._y+(t._y-e._y)*i,n._z=e._z+(t._z-e._z)*i,n._isDirty=!0,n}static Dot(e,t){return e._x*t._x+e._y*t._y+e._z*t._z}static Cross(e,t){const i=new e.constructor;return u.CrossToRef(e,t,i),i}static CrossToRef(e,t,i){const n=e._y*t._z-e._z*t._y,s=e._z*t._x-e._x*t._z,r=e._x*t._y-e._y*t._x;return i.copyFromFloats(n,s,r),i}static Normalize(e){const t=u.Zero();return u.NormalizeToRef(e,t),t}static NormalizeToRef(e,t){return e.normalizeToRef(t),t}static Project(e,t,i,n){const s=new e.constructor;return u.ProjectToRef(e,t,i,n,s),s}static ProjectToRef(e,t,i,n,s){const r=n.width,o=n.height,a=n.x,l=n.y,h=_.Matrix[1];f.FromValuesToRef(r/2,0,0,0,0,-o/2,0,0,0,0,.5,0,a+r/2,o/2+l,.5,1,h);const c=_.Matrix[0];return t.multiplyToRef(i,c),c.multiplyToRef(h,c),u.TransformCoordinatesToRef(e,c,s),s}static Reflect(e,t){return this.ReflectToRef(e,t,new u)}static ReflectToRef(e,t,i){const n=m.Vector3[0];return n.copyFrom(t).scaleInPlace(2*u.Dot(e,t)),i.copyFrom(e).subtractInPlace(n)}static _UnprojectFromInvertedMatrixToRef(e,t,i){u.TransformCoordinatesToRef(e,t,i);const s=t.m,r=e._x*s[3]+e._y*s[7]+e._z*s[11]+s[15];return n.R.WithinEpsilon(r,1)&&i.scaleInPlace(1/r),i}static UnprojectFromTransform(e,t,i,n,s){return this.Unproject(e,t,i,n,s,f.IdentityReadOnly)}static Unproject(e,t,i,n,s,r){const o=new e.constructor;return u.UnprojectToRef(e,t,i,n,s,r,o),o}static UnprojectToRef(e,t,i,n,s,r,o){return u.UnprojectFloatsToRef(e._x,e._y,e._z,t,i,n,s,r,o),o}static UnprojectFloatsToRef(e,t,i,n,s,r,o,a,h){var c;const d=_.Matrix[0];r.multiplyToRef(o,d),d.multiplyToRef(a,d),d.invert();const p=_.Vector3[0];return p.x=e/n*2-1,p.y=-(t/s*2-1),(null===(c=l.l.LastCreatedEngine)||void 0===c?void 0:c.isNDCHalfZRange)?p.z=i:p.z=2*i-1,u._UnprojectFromInvertedMatrixToRef(p,d,h),h}static Minimize(e,t){const i=new e.constructor;return i.copyFrom(e),i.minimizeInPlace(t),i}static Maximize(e,t){const i=new e.constructor;return i.copyFrom(e),i.maximizeInPlace(t),i}static Distance(e,t){return Math.sqrt(u.DistanceSquared(e,t))}static DistanceSquared(e,t){const i=e._x-t._x,n=e._y-t._y,s=e._z-t._z;return i*i+n*n+s*s}static ProjectOnTriangleToRef(e,t,i,r,o){const a=_.Vector3[0],l=_.Vector3[1],h=_.Vector3[2],c=_.Vector3[3],d=_.Vector3[4];i.subtractToRef(t,a),r.subtractToRef(t,l),r.subtractToRef(i,h);const p=a.length(),f=l.length(),m=h.length();if(p<s.kn||f<s.kn||m<s.kn)return o.copyFrom(t),u.Distance(e,t);e.subtractToRef(t,d),u.CrossToRef(a,l,c);const g=c.length();if(g<s.kn)return o.copyFrom(t),u.Distance(e,t);c.normalizeFromLength(g);let v=d.length();if(v<s.kn)return o.copyFrom(t),0;d.normalizeFromLength(v);const y=u.Dot(c,d),x=_.Vector3[5],b=_.Vector3[6];x.copyFrom(c).scaleInPlace(-v*y),b.copyFrom(e).addInPlace(x);const T=_.Vector3[4],S=_.Vector3[5],E=_.Vector3[7],C=_.Vector3[8];T.copyFrom(a).scaleInPlace(1/p),C.copyFrom(l).scaleInPlace(1/f),T.addInPlace(C).scaleInPlace(-1),S.copyFrom(a).scaleInPlace(-1/p),C.copyFrom(h).scaleInPlace(1/m),S.addInPlace(C).scaleInPlace(-1),E.copyFrom(h).scaleInPlace(-1/m),C.copyFrom(l).scaleInPlace(-1/f),E.addInPlace(C).scaleInPlace(-1);const A=_.Vector3[9];let P;A.copyFrom(b).subtractInPlace(t),u.CrossToRef(T,A,C),P=u.Dot(C,c);const R=P;A.copyFrom(b).subtractInPlace(i),u.CrossToRef(S,A,C),P=u.Dot(C,c);const M=P;A.copyFrom(b).subtractInPlace(r),u.CrossToRef(E,A,C),P=u.Dot(C,c);const I=P,D=_.Vector3[10];let O,w;R>0&&M<0?(D.copyFrom(a),O=t,w=i):M>0&&I<0?(D.copyFrom(h),O=i,w=r):(D.copyFrom(l).scaleInPlace(-1),O=r,w=t);const N=_.Vector3[9],F=_.Vector3[4];if(O.subtractToRef(b,C),w.subtractToRef(b,N),u.CrossToRef(C,N,F),!(u.Dot(F,c)<0))return o.copyFrom(b),Math.abs(v*y);const L=_.Vector3[5];u.CrossToRef(D,F,L),L.normalize();const B=_.Vector3[9];B.copyFrom(O).subtractInPlace(b);const U=B.length();if(U<s.kn)return o.copyFrom(O),u.Distance(e,O);B.normalizeFromLength(U);const V=u.Dot(L,B),k=_.Vector3[7];k.copyFrom(b).addInPlace(L.scaleInPlace(U*V)),C.copyFrom(k).subtractInPlace(O),v=D.length(),D.normalizeFromLength(v);let G=u.Dot(C,D)/Math.max(v,s.kn);return G=n.R.Clamp(G,0,1),k.copyFrom(O).addInPlace(D.scaleInPlace(G*v)),o.copyFrom(k),u.Distance(e,k)}static Center(e,t){return u.CenterToRef(e,t,u.Zero())}static CenterToRef(e,t,i){return i.copyFromFloats((e._x+t._x)/2,(e._y+t._y)/2,(e._z+t._z)/2)}static RotationFromAxis(e,t,i){const n=new e.constructor;return u.RotationFromAxisToRef(e,t,i,n),n}static RotationFromAxisToRef(e,t,i,n){const s=_.Quaternion[0];return p.RotationQuaternionFromAxisToRef(e,t,i,s),s.toEulerAnglesToRef(n),n}}u._UpReadOnly=u.Up(),u._DownReadOnly=u.Down(),u._LeftHandedForwardReadOnly=u.Forward(!1),u._RightHandedForwardReadOnly=u.Forward(!0),u._LeftHandedBackwardReadOnly=u.Backward(!1),u._RightHandedBackwardReadOnly=u.Backward(!0),u._RightReadOnly=u.Right(),u._LeftReadOnly=u.Left(),u._ZeroReadOnly=u.Zero();class d{constructor(e=0,t=0,i=0,n=0){this.x=e,this.y=t,this.z=i,this.w=n}toString(){return`{X: ${this.x} Y: ${this.y} Z: ${this.z} W: ${this.w}}`}getClassName(){return"Vector4"}getHashCode(){let e=h(this.x);return e=397*e^h(this.y),e=397*e^h(this.z),e=397*e^h(this.w),e}asArray(){const e=new Array;return this.toArray(e,0),e}toArray(e,t){return void 0===t&&(t=0),e[t]=this.x,e[t+1]=this.y,e[t+2]=this.z,e[t+3]=this.w,this}fromArray(e,t=0){return d.FromArrayToRef(e,t,this),this}addInPlace(e){return this.x+=e.x,this.y+=e.y,this.z+=e.z,this.w+=e.w,this}add(e){return new this.constructor(this.x+e.x,this.y+e.y,this.z+e.z,this.w+e.w)}addToRef(e,t){return t.x=this.x+e.x,t.y=this.y+e.y,t.z=this.z+e.z,t.w=this.w+e.w,t}subtractInPlace(e){return this.x-=e.x,this.y-=e.y,this.z-=e.z,this.w-=e.w,this}subtract(e){return new this.constructor(this.x-e.x,this.y-e.y,this.z-e.z,this.w-e.w)}subtractToRef(e,t){return t.x=this.x-e.x,t.y=this.y-e.y,t.z=this.z-e.z,t.w=this.w-e.w,t}subtractFromFloats(e,t,i,n){return new this.constructor(this.x-e,this.y-t,this.z-i,this.w-n)}subtractFromFloatsToRef(e,t,i,n,s){return s.x=this.x-e,s.y=this.y-t,s.z=this.z-i,s.w=this.w-n,s}negate(){return new this.constructor(-this.x,-this.y,-this.z,-this.w)}negateInPlace(){return this.x*=-1,this.y*=-1,this.z*=-1,this.w*=-1,this}negateToRef(e){return e.copyFromFloats(-1*this.x,-1*this.y,-1*this.z,-1*this.w)}scaleInPlace(e){return this.x*=e,this.y*=e,this.z*=e,this.w*=e,this}scale(e){return new this.constructor(this.x*e,this.y*e,this.z*e,this.w*e)}scaleToRef(e,t){return t.x=this.x*e,t.y=this.y*e,t.z=this.z*e,t.w=this.w*e,t}scaleAndAddToRef(e,t){return t.x+=this.x*e,t.y+=this.y*e,t.z+=this.z*e,t.w+=this.w*e,t}equals(e){return e&&this.x===e.x&&this.y===e.y&&this.z===e.z&&this.w===e.w}equalsWithEpsilon(e,t=s.kn){return e&&n.R.WithinEpsilon(this.x,e.x,t)&&n.R.WithinEpsilon(this.y,e.y,t)&&n.R.WithinEpsilon(this.z,e.z,t)&&n.R.WithinEpsilon(this.w,e.w,t)}equalsToFloats(e,t,i,n){return this.x===e&&this.y===t&&this.z===i&&this.w===n}multiplyInPlace(e){return this.x*=e.x,this.y*=e.y,this.z*=e.z,this.w*=e.w,this}multiply(e){return new this.constructor(this.x*e.x,this.y*e.y,this.z*e.z,this.w*e.w)}multiplyToRef(e,t){return t.x=this.x*e.x,t.y=this.y*e.y,t.z=this.z*e.z,t.w=this.w*e.w,t}multiplyByFloats(e,t,i,n){return new this.constructor(this.x*e,this.y*t,this.z*i,this.w*n)}divide(e){return new this.constructor(this.x/e.x,this.y/e.y,this.z/e.z,this.w/e.w)}divideToRef(e,t){return t.x=this.x/e.x,t.y=this.y/e.y,t.z=this.z/e.z,t.w=this.w/e.w,t}divideInPlace(e){return this.divideToRef(e,this)}minimizeInPlace(e){return e.x<this.x&&(this.x=e.x),e.y<this.y&&(this.y=e.y),e.z<this.z&&(this.z=e.z),e.w<this.w&&(this.w=e.w),this}maximizeInPlace(e){return e.x>this.x&&(this.x=e.x),e.y>this.y&&(this.y=e.y),e.z>this.z&&(this.z=e.z),e.w>this.w&&(this.w=e.w),this}floor(){return new this.constructor(Math.floor(this.x),Math.floor(this.y),Math.floor(this.z),Math.floor(this.w))}fract(){return new this.constructor(this.x-Math.floor(this.x),this.y-Math.floor(this.y),this.z-Math.floor(this.z),this.w-Math.floor(this.w))}length(){return Math.sqrt(this.x*this.x+this.y*this.y+this.z*this.z+this.w*this.w)}lengthSquared(){return this.x*this.x+this.y*this.y+this.z*this.z+this.w*this.w}normalize(){const e=this.length();return 0===e?this:this.scaleInPlace(1/e)}toVector3(){return new u(this.x,this.y,this.z)}clone(){return new this.constructor(this.x,this.y,this.z,this.w)}copyFrom(e){return this.x=e.x,this.y=e.y,this.z=e.z,this.w=e.w,this}copyFromFloats(e,t,i,n){return this.x=e,this.y=t,this.z=i,this.w=n,this}set(e,t,i,n){return this.copyFromFloats(e,t,i,n)}setAll(e){return this.x=this.y=this.z=this.w=e,this}static FromArray(e,t){return t||(t=0),new d(e[t],e[t+1],e[t+2],e[t+3])}static FromArrayToRef(e,t,i){return i.x=e[t],i.y=e[t+1],i.z=e[t+2],i.w=e[t+3],i}static FromFloatArrayToRef(e,t,i){return d.FromArrayToRef(e,t,i),i}static FromFloatsToRef(e,t,i,n,s){return s.x=e,s.y=t,s.z=i,s.w=n,s}static Zero(){return new d(0,0,0,0)}static One(){return new d(1,1,1,1)}static Random(e=0,t=1){return new d(n.R.RandomRange(e,t),n.R.RandomRange(e,t),n.R.RandomRange(e,t),n.R.RandomRange(e,t))}static get ZeroReadOnly(){return d._ZeroReadOnly}static Normalize(e){const t=d.Zero();return d.NormalizeToRef(e,t),t}static NormalizeToRef(e,t){return t.copyFrom(e),t.normalize(),t}static Minimize(e,t){const i=new e.constructor;return i.copyFrom(e),i.minimizeInPlace(t),i}static Maximize(e,t){const i=new e.constructor;return i.copyFrom(e),i.maximizeInPlace(t),i}static Distance(e,t){return Math.sqrt(d.DistanceSquared(e,t))}static DistanceSquared(e,t){const i=e.x-t.x,n=e.y-t.y,s=e.z-t.z,r=e.w-t.w;return i*i+n*n+s*s+r*r}static Center(e,t){return d.CenterToRef(e,t,d.Zero())}static CenterToRef(e,t,i){return i.copyFromFloats((e.x+t.x)/2,(e.y+t.y)/2,(e.z+t.z)/2,(e.w+t.w)/2)}static TransformCoordinates(e,t){const i=d.Zero();return d.TransformCoordinatesToRef(e,t,i),i}static TransformCoordinatesToRef(e,t,i){return d.TransformCoordinatesFromFloatsToRef(e._x,e._y,e._z,t,i),i}static TransformCoordinatesFromFloatsToRef(e,t,i,n,s){const r=n.m,o=e*r[0]+t*r[4]+i*r[8]+r[12],a=e*r[1]+t*r[5]+i*r[9]+r[13],l=e*r[2]+t*r[6]+i*r[10]+r[14],h=e*r[3]+t*r[7]+i*r[11]+r[15];return s.x=o,s.y=a,s.z=l,s.w=h,s}static TransformNormal(e,t){const i=new e.constructor;return d.TransformNormalToRef(e,t,i),i}static TransformNormalToRef(e,t,i){const n=t.m,s=e.x*n[0]+e.y*n[4]+e.z*n[8],r=e.x*n[1]+e.y*n[5]+e.z*n[9],o=e.x*n[2]+e.y*n[6]+e.z*n[10];return i.x=s,i.y=r,i.z=o,i.w=e.w,i}static TransformNormalFromFloatsToRef(e,t,i,n,s,r){const o=s.m;return r.x=e*o[0]+t*o[4]+i*o[8],r.y=e*o[1]+t*o[5]+i*o[9],r.z=e*o[2]+t*o[6]+i*o[10],r.w=n,r}static FromVector3(e,t=0){return new d(e._x,e._y,e._z,t)}}d._ZeroReadOnly=d.Zero();class p{get x(){return this._x}set x(e){this._x=e,this._isDirty=!0}get y(){return this._y}set y(e){this._y=e,this._isDirty=!0}get z(){return this._z}set z(e){this._z=e,this._isDirty=!0}get w(){return this._w}set w(e){this._w=e,this._isDirty=!0}constructor(e=0,t=0,i=0,n=1){this._isDirty=!0,this._x=e,this._y=t,this._z=i,this._w=n}toString(){return`{X: ${this._x} Y: ${this._y} Z: ${this._z} W: ${this._w}}`}getClassName(){return"Quaternion"}getHashCode(){let e=h(this._x);return e=397*e^h(this._y),e=397*e^h(this._z),e=397*e^h(this._w),e}asArray(){return[this._x,this._y,this._z,this._w]}toArray(e,t=0){return e[t]=this._x,e[t+1]=this._y,e[t+2]=this._z,e[t+3]=this._w,this}equals(e){return e&&this._x===e._x&&this._y===e._y&&this._z===e._z&&this._w===e._w}equalsWithEpsilon(e,t=s.kn){return e&&n.R.WithinEpsilon(this._x,e._x,t)&&n.R.WithinEpsilon(this._y,e._y,t)&&n.R.WithinEpsilon(this._z,e._z,t)&&n.R.WithinEpsilon(this._w,e._w,t)}clone(){return new this.constructor(this._x,this._y,this._z,this._w)}copyFrom(e){return this._x=e._x,this._y=e._y,this._z=e._z,this._w=e._w,this._isDirty=!0,this}copyFromFloats(e,t,i,n){return this._x=e,this._y=t,this._z=i,this._w=n,this._isDirty=!0,this}set(e,t,i,n){return this.copyFromFloats(e,t,i,n)}add(e){return new this.constructor(this._x+e._x,this._y+e._y,this._z+e._z,this._w+e._w)}addInPlace(e){return this._x+=e._x,this._y+=e._y,this._z+=e._z,this._w+=e._w,this._isDirty=!0,this}subtract(e){return new this.constructor(this._x-e._x,this._y-e._y,this._z-e._z,this._w-e._w)}subtractInPlace(e){return this._x-=e._x,this._y-=e._y,this._z-=e._z,this._w-=e._w,this._isDirty=!0,this}scale(e){return new this.constructor(this._x*e,this._y*e,this._z*e,this._w*e)}scaleToRef(e,t){return t._x=this._x*e,t._y=this._y*e,t._z=this._z*e,t._w=this._w*e,t._isDirty=!0,t}scaleInPlace(e){return this._x*=e,this._y*=e,this._z*=e,this._w*=e,this._isDirty=!0,this}scaleAndAddToRef(e,t){return t._x+=this._x*e,t._y+=this._y*e,t._z+=this._z*e,t._w+=this._w*e,t._isDirty=!0,t}multiply(e){const t=new this.constructor(0,0,0,1);return this.multiplyToRef(e,t),t}multiplyToRef(e,t){const i=this._x*e._w+this._y*e._z-this._z*e._y+this._w*e._x,n=-this._x*e._z+this._y*e._w+this._z*e._x+this._w*e._y,s=this._x*e._y-this._y*e._x+this._z*e._w+this._w*e._z,r=-this._x*e._x-this._y*e._y-this._z*e._z+this._w*e._w;return t.copyFromFloats(i,n,s,r),t}multiplyInPlace(e){return this.multiplyToRef(e,this),this}conjugateToRef(e){return e.copyFromFloats(-this._x,-this._y,-this._z,this._w),e}conjugateInPlace(){return this._x*=-1,this._y*=-1,this._z*=-1,this._isDirty=!0,this}conjugate(){return new this.constructor(-this._x,-this._y,-this._z,this._w)}invert(){const e=this.conjugate(),t=this.lengthSquared();return 0==t||1==t||e.scaleInPlace(1/t),e}invertInPlace(){this.conjugateInPlace();const e=this.lengthSquared();return 0==e||1==e||this.scaleInPlace(1/e),this}lengthSquared(){return this._x*this._x+this._y*this._y+this._z*this._z+this._w*this._w}length(){return Math.sqrt(this.lengthSquared())}normalize(){const e=this.length();if(0===e)return this;const t=1/e;return this.scaleInPlace(t),this}normalizeToNew(){const e=this.length();if(0===e)return this.clone();const t=1/e;return this.scale(t)}toEulerAngles(){const e=u.Zero();return this.toEulerAnglesToRef(e),e}toEulerAnglesToRef(e){const t=this._z,i=this._x,n=this._y,s=this._w,r=n*t-i*s,o=.4999999;if(r<-o)e._y=2*Math.atan2(n,s),e._x=Math.PI/2,e._z=0,e._isDirty=!0;else if(r>o)e._y=2*Math.atan2(n,s),e._x=-Math.PI/2,e._z=0,e._isDirty=!0;else{const o=s*s,a=t*t,l=i*i,h=n*n;e._z=Math.atan2(2*(i*n+t*s),-a-l+h+o),e._x=Math.asin(-2*r),e._y=Math.atan2(2*(t*i+n*s),a-l-h+o),e._isDirty=!0}return e}toRotationMatrix(e){return f.FromQuaternionToRef(this,e),e}fromRotationMatrix(e){return p.FromRotationMatrixToRef(e,this),this}static FromRotationMatrix(e){const t=new p;return p.FromRotationMatrixToRef(e,t),t}static FromRotationMatrixToRef(e,t){const i=e.m,n=i[0],s=i[4],r=i[8],o=i[1],a=i[5],l=i[9],h=i[2],c=i[6],u=i[10],d=n+a+u;let p;return d>0?(p=.5/Math.sqrt(d+1),t._w=.25/p,t._x=(c-l)*p,t._y=(r-h)*p,t._z=(o-s)*p,t._isDirty=!0):n>a&&n>u?(p=2*Math.sqrt(1+n-a-u),t._w=(c-l)/p,t._x=.25*p,t._y=(s+o)/p,t._z=(r+h)/p,t._isDirty=!0):a>u?(p=2*Math.sqrt(1+a-n-u),t._w=(r-h)/p,t._x=(s+o)/p,t._y=.25*p,t._z=(l+c)/p,t._isDirty=!0):(p=2*Math.sqrt(1+u-n-a),t._w=(o-s)/p,t._x=(r+h)/p,t._y=(l+c)/p,t._z=.25*p,t._isDirty=!0),t}static Dot(e,t){return e._x*t._x+e._y*t._y+e._z*t._z+e._w*t._w}static AreClose(e,t,i=.1){const n=p.Dot(e,t);return 1-n*n<=i}static SmoothToRef(e,t,i,s,r){let o=0===s?1:i/s;return o=n.R.Clamp(o,0,1),p.SlerpToRef(e,t,o,r),r}static Zero(){return new p(0,0,0,0)}static Inverse(e){return new e.constructor(-e._x,-e._y,-e._z,e._w)}static InverseToRef(e,t){return t.set(-e._x,-e._y,-e._z,e._w),t}static Identity(){return new p(0,0,0,1)}static IsIdentity(e){return e&&0===e._x&&0===e._y&&0===e._z&&1===e._w}static RotationAxis(e,t){return p.RotationAxisToRef(e,t,new p)}static RotationAxisToRef(e,t,i){const n=Math.sin(t/2);return e.normalize(),i._w=Math.cos(t/2),i._x=e._x*n,i._y=e._y*n,i._z=e._z*n,i._isDirty=!0,i}static FromArray(e,t){return t||(t=0),new p(e[t],e[t+1],e[t+2],e[t+3])}static FromArrayToRef(e,t,i){return i._x=e[t],i._y=e[t+1],i._z=e[t+2],i._w=e[t+3],i._isDirty=!0,i}static FromEulerAngles(e,t,i){const n=new p;return p.RotationYawPitchRollToRef(t,e,i,n),n}static FromEulerAnglesToRef(e,t,i,n){return p.RotationYawPitchRollToRef(t,e,i,n),n}static FromEulerVector(e){const t=new p;return p.RotationYawPitchRollToRef(e._y,e._x,e._z,t),t}static FromEulerVectorToRef(e,t){return p.RotationYawPitchRollToRef(e._y,e._x,e._z,t),t}static FromUnitVectorsToRef(e,t,i){const n=u.Dot(e,t)+1;return n<s.kn?Math.abs(e.x)>Math.abs(e.z)?i.set(-e.y,e.x,0,0):i.set(0,-e.z,e.y,0):(u.CrossToRef(e,t,m.Vector3[0]),i.set(m.Vector3[0].x,m.Vector3[0].y,m.Vector3[0].z,n)),i.normalize()}static RotationYawPitchRoll(e,t,i){const n=new p;return p.RotationYawPitchRollToRef(e,t,i,n),n}static RotationYawPitchRollToRef(e,t,i,n){const s=.5*i,r=.5*t,o=.5*e,a=Math.sin(s),l=Math.cos(s),h=Math.sin(r),c=Math.cos(r),u=Math.sin(o),d=Math.cos(o);return n._x=d*h*l+u*c*a,n._y=u*c*l-d*h*a,n._z=d*c*a-u*h*l,n._w=d*c*l+u*h*a,n._isDirty=!0,n}static RotationAlphaBetaGamma(e,t,i){const n=new p;return p.RotationAlphaBetaGammaToRef(e,t,i,n),n}static RotationAlphaBetaGammaToRef(e,t,i,n){const s=.5*(i+e),r=.5*(i-e),o=.5*t;return n._x=Math.cos(r)*Math.sin(o),n._y=Math.sin(r)*Math.sin(o),n._z=Math.sin(s)*Math.cos(o),n._w=Math.cos(s)*Math.cos(o),n._isDirty=!0,n}static RotationQuaternionFromAxis(e,t,i){const n=new p(0,0,0,0);return p.RotationQuaternionFromAxisToRef(e,t,i,n),n}static RotationQuaternionFromAxisToRef(e,t,i,n){const s=_.Matrix[0];return f.FromXYZAxesToRef(e.normalize(),t.normalize(),i.normalize(),s),p.FromRotationMatrixToRef(s,n),n}static FromLookDirectionLH(e,t){const i=new p;return p.FromLookDirectionLHToRef(e,t,i),i}static FromLookDirectionLHToRef(e,t,i){const n=_.Matrix[0];return f.LookDirectionLHToRef(e,t,n),p.FromRotationMatrixToRef(n,i),i}static FromLookDirectionRH(e,t){const i=new p;return p.FromLookDirectionRHToRef(e,t,i),i}static FromLookDirectionRHToRef(e,t,i){const n=_.Matrix[0];return f.LookDirectionRHToRef(e,t,n),p.FromRotationMatrixToRef(n,i)}static Slerp(e,t,i){const n=p.Identity();return p.SlerpToRef(e,t,i,n),n}static SlerpToRef(e,t,i,n){let s,r,o=e._x*t._x+e._y*t._y+e._z*t._z+e._w*t._w,a=!1;if(o<0&&(a=!0,o=-o),o>.999999)r=1-i,s=a?-i:i;else{const e=Math.acos(o),t=1/Math.sin(e);r=Math.sin((1-i)*e)*t,s=a?-Math.sin(i*e)*t:Math.sin(i*e)*t}return n._x=r*e._x+s*t._x,n._y=r*e._y+s*t._y,n._z=r*e._z+s*t._z,n._w=r*e._w+s*t._w,n._isDirty=!0,n}static Hermite(e,t,i,n,s){const r=s*s,o=s*r,a=2*o-3*r+1,l=-2*o+3*r,h=o-2*r+s,c=o-r,u=e._x*a+i._x*l+t._x*h+n._x*c,d=e._y*a+i._y*l+t._y*h+n._y*c,p=e._z*a+i._z*l+t._z*h+n._z*c,f=e._w*a+i._w*l+t._w*h+n._w*c;return new e.constructor(u,d,p,f)}static Hermite1stDerivative(e,t,i,n,s){const r=new e.constructor;return this.Hermite1stDerivativeToRef(e,t,i,n,s,r),r}static Hermite1stDerivativeToRef(e,t,i,n,s,r){const o=s*s;return r._x=6*(o-s)*e._x+(3*o-4*s+1)*t._x+6*(-o+s)*i._x+(3*o-2*s)*n._x,r._y=6*(o-s)*e._y+(3*o-4*s+1)*t._y+6*(-o+s)*i._y+(3*o-2*s)*n._y,r._z=6*(o-s)*e._z+(3*o-4*s+1)*t._z+6*(-o+s)*i._z+(3*o-2*s)*n._z,r._w=6*(o-s)*e._w+(3*o-4*s+1)*t._w+6*(-o+s)*i._w+(3*o-2*s)*n._w,r._isDirty=!0,r}}class f{static get Use64Bits(){return a.Z.MatrixUse64Bits}get m(){return this._m}markAsUpdated(){this.updateFlag=f._UpdateFlagSeed++,this._isIdentity=!1,this._isIdentity3x2=!1,this._isIdentityDirty=!0,this._isIdentity3x2Dirty=!0}_updateIdentityStatus(e,t=!1,i=!1,n=!0){this._isIdentity=e,this._isIdentity3x2=e||i,this._isIdentityDirty=!this._isIdentity&&t,this._isIdentity3x2Dirty=!this._isIdentity3x2&&n}constructor(){this._isIdentity=!1,this._isIdentityDirty=!0,this._isIdentity3x2=!0,this._isIdentity3x2Dirty=!0,this.updateFlag=-1,a.Z.MatrixTrackPrecisionChange&&a.Z.MatrixTrackedMatrices.push(this),this._m=new a.Z.MatrixCurrentType(16),this.markAsUpdated()}isIdentity(){if(this._isIdentityDirty){this._isIdentityDirty=!1;const e=this._m;this._isIdentity=1===e[0]&&0===e[1]&&0===e[2]&&0===e[3]&&0===e[4]&&1===e[5]&&0===e[6]&&0===e[7]&&0===e[8]&&0===e[9]&&1===e[10]&&0===e[11]&&0===e[12]&&0===e[13]&&0===e[14]&&1===e[15]}return this._isIdentity}isIdentityAs3x2(){return this._isIdentity3x2Dirty&&(this._isIdentity3x2Dirty=!1,1!==this._m[0]||1!==this._m[5]||1!==this._m[15]||0!==this._m[1]||0!==this._m[2]||0!==this._m[3]||0!==this._m[4]||0!==this._m[6]||0!==this._m[7]||0!==this._m[8]||0!==this._m[9]||0!==this._m[10]||0!==this._m[11]||0!==this._m[12]||0!==this._m[13]||0!==this._m[14]?this._isIdentity3x2=!1:this._isIdentity3x2=!0),this._isIdentity3x2}determinant(){if(!0===this._isIdentity)return 1;const e=this._m,t=e[0],i=e[1],n=e[2],s=e[3],r=e[4],o=e[5],a=e[6],l=e[7],h=e[8],c=e[9],u=e[10],d=e[11],p=e[12],f=e[13],_=e[14],m=e[15],g=u*m-_*d,v=c*m-f*d,y=c*_-f*u,x=h*m-p*d,b=h*_-u*p,T=h*f-p*c;return t*+(o*g-a*v+l*y)+i*-(r*g-a*x+l*b)+n*+(r*v-o*x+l*T)+s*-(r*y-o*b+a*T)}toArray(){return this._m}asArray(){return this._m}invert(){return this.invertToRef(this),this}reset(){return f.FromValuesToRef(0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,this),this._updateIdentityStatus(!1),this}add(e){const t=new this.constructor;return this.addToRef(e,t),t}addToRef(e,t){const i=this._m,n=t._m,s=e.m;for(let e=0;e<16;e++)n[e]=i[e]+s[e];return t.markAsUpdated(),t}addToSelf(e){const t=this._m,i=e.m;for(let e=0;e<16;e++)t[e]+=i[e];return this.markAsUpdated(),this}invertToRef(e){if(!0===this._isIdentity)return f.IdentityToRef(e),e;const t=this._m,i=t[0],n=t[1],s=t[2],r=t[3],o=t[4],a=t[5],l=t[6],h=t[7],c=t[8],u=t[9],d=t[10],p=t[11],_=t[12],m=t[13],g=t[14],v=t[15],y=d*v-g*p,x=u*v-m*p,b=u*g-m*d,T=c*v-_*p,S=c*g-d*_,E=c*m-_*u,C=+(a*y-l*x+h*b),A=-(o*y-l*T+h*S),P=+(o*x-a*T+h*E),R=-(o*b-a*S+l*E),M=i*C+n*A+s*P+r*R;if(0===M)return e.copyFrom(this),e;const I=1/M,D=l*v-g*h,O=a*v-m*h,w=a*g-m*l,N=o*v-_*h,F=o*g-_*l,L=o*m-_*a,B=l*p-d*h,U=a*p-u*h,V=a*d-u*l,k=o*p-c*h,G=o*d-c*l,z=o*u-c*a,W=-(n*y-s*x+r*b),H=+(i*y-s*T+r*S),X=-(i*x-n*T+r*E),j=+(i*b-n*S+s*E),Y=+(n*D-s*O+r*w),q=-(i*D-s*N+r*F),K=+(i*O-n*N+r*L),$=-(i*w-n*F+s*L),Q=-(n*B-s*U+r*V),Z=+(i*B-s*k+r*G),J=-(i*U-n*k+r*z),ee=+(i*V-n*G+s*z);return f.FromValuesToRef(C*I,W*I,Y*I,Q*I,A*I,H*I,q*I,Z*I,P*I,X*I,K*I,J*I,R*I,j*I,$*I,ee*I,e),e}addAtIndex(e,t){return this._m[e]+=t,this.markAsUpdated(),this}multiplyAtIndex(e,t){return this._m[e]*=t,this.markAsUpdated(),this}setTranslationFromFloats(e,t,i){return this._m[12]=e,this._m[13]=t,this._m[14]=i,this.markAsUpdated(),this}addTranslationFromFloats(e,t,i){return this._m[12]+=e,this._m[13]+=t,this._m[14]+=i,this.markAsUpdated(),this}setTranslation(e){return this.setTranslationFromFloats(e._x,e._y,e._z)}getTranslation(){return new u(this._m[12],this._m[13],this._m[14])}getTranslationToRef(e){return e.x=this._m[12],e.y=this._m[13],e.z=this._m[14],e}removeRotationAndScaling(){const e=this.m;return f.FromValuesToRef(1,0,0,0,0,1,0,0,0,0,1,0,e[12],e[13],e[14],e[15],this),this._updateIdentityStatus(0===e[12]&&0===e[13]&&0===e[14]&&1===e[15]),this}multiply(e){const t=new this.constructor;return this.multiplyToRef(e,t),t}copyFrom(e){e.copyToArray(this._m);const t=e;return this.updateFlag=t.updateFlag,this._updateIdentityStatus(t._isIdentity,t._isIdentityDirty,t._isIdentity3x2,t._isIdentity3x2Dirty),this}copyToArray(e,t=0){const i=this._m;return e[t]=i[0],e[t+1]=i[1],e[t+2]=i[2],e[t+3]=i[3],e[t+4]=i[4],e[t+5]=i[5],e[t+6]=i[6],e[t+7]=i[7],e[t+8]=i[8],e[t+9]=i[9],e[t+10]=i[10],e[t+11]=i[11],e[t+12]=i[12],e[t+13]=i[13],e[t+14]=i[14],e[t+15]=i[15],this}multiplyToRef(e,t){return this._isIdentity?(t.copyFrom(e),t):e._isIdentity?(t.copyFrom(this),t):(this.multiplyToArray(e,t._m,0),t.markAsUpdated(),t)}multiplyToArray(e,t,i){const n=this._m,s=e.m,r=n[0],o=n[1],a=n[2],l=n[3],h=n[4],c=n[5],u=n[6],d=n[7],p=n[8],f=n[9],_=n[10],m=n[11],g=n[12],v=n[13],y=n[14],x=n[15],b=s[0],T=s[1],S=s[2],E=s[3],C=s[4],A=s[5],P=s[6],R=s[7],M=s[8],I=s[9],D=s[10],O=s[11],w=s[12],N=s[13],F=s[14],L=s[15];return t[i]=r*b+o*C+a*M+l*w,t[i+1]=r*T+o*A+a*I+l*N,t[i+2]=r*S+o*P+a*D+l*F,t[i+3]=r*E+o*R+a*O+l*L,t[i+4]=h*b+c*C+u*M+d*w,t[i+5]=h*T+c*A+u*I+d*N,t[i+6]=h*S+c*P+u*D+d*F,t[i+7]=h*E+c*R+u*O+d*L,t[i+8]=p*b+f*C+_*M+m*w,t[i+9]=p*T+f*A+_*I+m*N,t[i+10]=p*S+f*P+_*D+m*F,t[i+11]=p*E+f*R+_*O+m*L,t[i+12]=g*b+v*C+y*M+x*w,t[i+13]=g*T+v*A+y*I+x*N,t[i+14]=g*S+v*P+y*D+x*F,t[i+15]=g*E+v*R+y*O+x*L,this}equals(e){const t=e;if(!t)return!1;if((this._isIdentity||t._isIdentity)&&!this._isIdentityDirty&&!t._isIdentityDirty)return this._isIdentity&&t._isIdentity;const i=this.m,n=t.m;return i[0]===n[0]&&i[1]===n[1]&&i[2]===n[2]&&i[3]===n[3]&&i[4]===n[4]&&i[5]===n[5]&&i[6]===n[6]&&i[7]===n[7]&&i[8]===n[8]&&i[9]===n[9]&&i[10]===n[10]&&i[11]===n[11]&&i[12]===n[12]&&i[13]===n[13]&&i[14]===n[14]&&i[15]===n[15]}clone(){const e=new this.constructor;return e.copyFrom(this),e}getClassName(){return"Matrix"}getHashCode(){let e=h(this._m[0]);for(let t=1;t<16;t++)e=397*e^h(this._m[t]);return e}decomposeToTransformNode(e){return e.rotationQuaternion=e.rotationQuaternion||new p,this.decompose(e.scaling,e.rotationQuaternion,e.position)}decompose(e,t,i,n){if(this._isIdentity)return i&&i.setAll(0),e&&e.setAll(1),t&&t.copyFromFloats(0,0,0,1),!0;const s=this._m;if(i&&i.copyFromFloats(s[12],s[13],s[14]),(e=e||_.Vector3[0]).x=Math.sqrt(s[0]*s[0]+s[1]*s[1]+s[2]*s[2]),e.y=Math.sqrt(s[4]*s[4]+s[5]*s[5]+s[6]*s[6]),e.z=Math.sqrt(s[8]*s[8]+s[9]*s[9]+s[10]*s[10]),n){const t=n.scaling.x<0?-1:1,i=n.scaling.y<0?-1:1,s=n.scaling.z<0?-1:1;e.x*=t,e.y*=i,e.z*=s}else this.determinant()<=0&&(e.y*=-1);if(0===e._x||0===e._y||0===e._z)return t&&t.copyFromFloats(0,0,0,1),!1;if(t){const i=1/e._x,n=1/e._y,r=1/e._z;f.FromValuesToRef(s[0]*i,s[1]*i,s[2]*i,0,s[4]*n,s[5]*n,s[6]*n,0,s[8]*r,s[9]*r,s[10]*r,0,0,0,0,1,_.Matrix[0]),p.FromRotationMatrixToRef(_.Matrix[0],t)}return!0}getRow(e){if(e<0||e>3)return null;const t=4*e;return new d(this._m[t+0],this._m[t+1],this._m[t+2],this._m[t+3])}getRowToRef(e,t){if(e>=0&&e<3){const i=4*e;t.x=this._m[i+0],t.y=this._m[i+1],t.z=this._m[i+2],t.w=this._m[i+3]}return t}setRow(e,t){return this.setRowFromFloats(e,t.x,t.y,t.z,t.w)}transpose(){const e=new this.constructor;return f.TransposeToRef(this,e),e}transposeToRef(e){return f.TransposeToRef(this,e),e}setRowFromFloats(e,t,i,n,s){if(e<0||e>3)return this;const r=4*e;return this._m[r+0]=t,this._m[r+1]=i,this._m[r+2]=n,this._m[r+3]=s,this.markAsUpdated(),this}scale(e){const t=new this.constructor;return this.scaleToRef(e,t),t}scaleToRef(e,t){for(let i=0;i<16;i++)t._m[i]=this._m[i]*e;return t.markAsUpdated(),t}scaleAndAddToRef(e,t){for(let i=0;i<16;i++)t._m[i]+=this._m[i]*e;return t.markAsUpdated(),t}toNormalMatrix(e){const t=_.Matrix[0];this.invertToRef(t),t.transposeToRef(e);const i=e._m;return f.FromValuesToRef(i[0],i[1],i[2],0,i[4],i[5],i[6],0,i[8],i[9],i[10],0,0,0,0,1,e),e}getRotationMatrix(){const e=new this.constructor;return this.getRotationMatrixToRef(e),e}getRotationMatrixToRef(e){const t=_.Vector3[0];if(!this.decompose(t))return f.IdentityToRef(e),e;const i=this._m,n=1/t._x,s=1/t._y,r=1/t._z;return f.FromValuesToRef(i[0]*n,i[1]*n,i[2]*n,0,i[4]*s,i[5]*s,i[6]*s,0,i[8]*r,i[9]*r,i[10]*r,0,0,0,0,1,e),e}toggleModelMatrixHandInPlace(){const e=this._m;return e[2]*=-1,e[6]*=-1,e[8]*=-1,e[9]*=-1,e[14]*=-1,this.markAsUpdated(),this}toggleProjectionMatrixHandInPlace(){const e=this._m;return e[8]*=-1,e[9]*=-1,e[10]*=-1,e[11]*=-1,this.markAsUpdated(),this}static FromArray(e,t=0){const i=new f;return f.FromArrayToRef(e,t,i),i}static FromArrayToRef(e,t,i){for(let n=0;n<16;n++)i._m[n]=e[n+t];return i.markAsUpdated(),i}static FromFloat32ArrayToRefScaled(e,t,i,n){for(let s=0;s<16;s++)n._m[s]=e[s+t]*i;return n.markAsUpdated(),n}static get IdentityReadOnly(){return f._IdentityReadOnly}static FromValuesToRef(e,t,i,n,s,r,o,a,l,h,c,u,d,p,f,_,m){const g=m._m;g[0]=e,g[1]=t,g[2]=i,g[3]=n,g[4]=s,g[5]=r,g[6]=o,g[7]=a,g[8]=l,g[9]=h,g[10]=c,g[11]=u,g[12]=d,g[13]=p,g[14]=f,g[15]=_,m.markAsUpdated()}static FromValues(e,t,i,n,s,r,o,a,l,h,c,u,d,p,_,m){const g=new f,v=g._m;return v[0]=e,v[1]=t,v[2]=i,v[3]=n,v[4]=s,v[5]=r,v[6]=o,v[7]=a,v[8]=l,v[9]=h,v[10]=c,v[11]=u,v[12]=d,v[13]=p,v[14]=_,v[15]=m,g.markAsUpdated(),g}static Compose(e,t,i){const n=new f;return f.ComposeToRef(e,t,i,n),n}static ComposeToRef(e,t,i,n){const s=n._m,r=t._x,o=t._y,a=t._z,l=t._w,h=r+r,c=o+o,u=a+a,d=r*h,p=r*c,f=r*u,_=o*c,m=o*u,g=a*u,v=l*h,y=l*c,x=l*u,b=e._x,T=e._y,S=e._z;return s[0]=(1-(_+g))*b,s[1]=(p+x)*b,s[2]=(f-y)*b,s[3]=0,s[4]=(p-x)*T,s[5]=(1-(d+g))*T,s[6]=(m+v)*T,s[7]=0,s[8]=(f+y)*S,s[9]=(m-v)*S,s[10]=(1-(d+_))*S,s[11]=0,s[12]=i._x,s[13]=i._y,s[14]=i._z,s[15]=1,n.markAsUpdated(),n}static Identity(){const e=f.FromValues(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1);return e._updateIdentityStatus(!0),e}static IdentityToRef(e){return f.FromValuesToRef(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1,e),e._updateIdentityStatus(!0),e}static Zero(){const e=f.FromValues(0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0);return e._updateIdentityStatus(!1),e}static RotationX(e){const t=new f;return f.RotationXToRef(e,t),t}static Invert(e){const t=new e.constructor;return e.invertToRef(t),t}static RotationXToRef(e,t){const i=Math.sin(e),n=Math.cos(e);return f.FromValuesToRef(1,0,0,0,0,n,i,0,0,-i,n,0,0,0,0,1,t),t._updateIdentityStatus(1===n&&0===i),t}static RotationY(e){const t=new f;return f.RotationYToRef(e,t),t}static RotationYToRef(e,t){const i=Math.sin(e),n=Math.cos(e);return f.FromValuesToRef(n,0,-i,0,0,1,0,0,i,0,n,0,0,0,0,1,t),t._updateIdentityStatus(1===n&&0===i),t}static RotationZ(e){const t=new f;return f.RotationZToRef(e,t),t}static RotationZToRef(e,t){const i=Math.sin(e),n=Math.cos(e);return f.FromValuesToRef(n,i,0,0,-i,n,0,0,0,0,1,0,0,0,0,1,t),t._updateIdentityStatus(1===n&&0===i),t}static RotationAxis(e,t){const i=new f;return f.RotationAxisToRef(e,t,i),i}static RotationAxisToRef(e,t,i){const n=Math.sin(-t),s=Math.cos(-t),r=1-s;e.normalize();const o=i._m;return o[0]=e._x*e._x*r+s,o[1]=e._x*e._y*r-e._z*n,o[2]=e._x*e._z*r+e._y*n,o[3]=0,o[4]=e._y*e._x*r+e._z*n,o[5]=e._y*e._y*r+s,o[6]=e._y*e._z*r-e._x*n,o[7]=0,o[8]=e._z*e._x*r-e._y*n,o[9]=e._z*e._y*r+e._x*n,o[10]=e._z*e._z*r+s,o[11]=0,o[12]=0,o[13]=0,o[14]=0,o[15]=1,i.markAsUpdated(),i}static RotationAlignToRef(e,t,i){const n=u.Dot(t,e),r=i._m;if(n<-1+s.kn)r[0]=-1,r[1]=0,r[2]=0,r[3]=0,r[4]=0,r[5]=-1,r[6]=0,r[7]=0,r[8]=0,r[9]=0,r[10]=1,r[11]=0;else{const i=u.Cross(t,e),s=1/(1+n);r[0]=i._x*i._x*s+n,r[1]=i._y*i._x*s-i._z,r[2]=i._z*i._x*s+i._y,r[3]=0,r[4]=i._x*i._y*s+i._z,r[5]=i._y*i._y*s+n,r[6]=i._z*i._y*s-i._x,r[7]=0,r[8]=i._x*i._z*s-i._y,r[9]=i._y*i._z*s+i._x,r[10]=i._z*i._z*s+n,r[11]=0}return r[12]=0,r[13]=0,r[14]=0,r[15]=1,i.markAsUpdated(),i}static RotationYawPitchRoll(e,t,i){const n=new f;return f.RotationYawPitchRollToRef(e,t,i,n),n}static RotationYawPitchRollToRef(e,t,i,n){return p.RotationYawPitchRollToRef(e,t,i,_.Quaternion[0]),_.Quaternion[0].toRotationMatrix(n),n}static Scaling(e,t,i){const n=new f;return f.ScalingToRef(e,t,i,n),n}static ScalingToRef(e,t,i,n){return f.FromValuesToRef(e,0,0,0,0,t,0,0,0,0,i,0,0,0,0,1,n),n._updateIdentityStatus(1===e&&1===t&&1===i),n}static Translation(e,t,i){const n=new f;return f.TranslationToRef(e,t,i,n),n}static TranslationToRef(e,t,i,n){return f.FromValuesToRef(1,0,0,0,0,1,0,0,0,0,1,0,e,t,i,1,n),n._updateIdentityStatus(0===e&&0===t&&0===i),n}static Lerp(e,t,i){const n=new e.constructor;return f.LerpToRef(e,t,i,n),n}static LerpToRef(e,t,i,n){const s=n._m,r=e.m,o=t.m;for(let e=0;e<16;e++)s[e]=r[e]*(1-i)+o[e]*i;return n.markAsUpdated(),n}static DecomposeLerp(e,t,i){const n=new e.constructor;return f.DecomposeLerpToRef(e,t,i,n),n}static DecomposeLerpToRef(e,t,i,n){const s=_.Vector3[0],r=_.Quaternion[0],o=_.Vector3[1];e.decompose(s,r,o);const a=_.Vector3[2],l=_.Quaternion[1],h=_.Vector3[3];t.decompose(a,l,h);const c=_.Vector3[4];u.LerpToRef(s,a,i,c);const d=_.Quaternion[2];p.SlerpToRef(r,l,i,d);const m=_.Vector3[5];return u.LerpToRef(o,h,i,m),f.ComposeToRef(c,d,m,n),n}static LookAtLH(e,t,i){const n=new f;return f.LookAtLHToRef(e,t,i,n),n}static LookAtLHToRef(e,t,i,n){const s=_.Vector3[0],r=_.Vector3[1],o=_.Vector3[2];t.subtractToRef(e,o),o.normalize(),u.CrossToRef(i,o,s);const a=s.lengthSquared();0===a?s.x=1:s.normalizeFromLength(Math.sqrt(a)),u.CrossToRef(o,s,r),r.normalize();const l=-u.Dot(s,e),h=-u.Dot(r,e),c=-u.Dot(o,e);f.FromValuesToRef(s._x,r._x,o._x,0,s._y,r._y,o._y,0,s._z,r._z,o._z,0,l,h,c,1,n)}static LookAtRH(e,t,i){const n=new f;return f.LookAtRHToRef(e,t,i,n),n}static LookAtRHToRef(e,t,i,n){const s=_.Vector3[0],r=_.Vector3[1],o=_.Vector3[2];e.subtractToRef(t,o),o.normalize(),u.CrossToRef(i,o,s);const a=s.lengthSquared();0===a?s.x=1:s.normalizeFromLength(Math.sqrt(a)),u.CrossToRef(o,s,r),r.normalize();const l=-u.Dot(s,e),h=-u.Dot(r,e),c=-u.Dot(o,e);return f.FromValuesToRef(s._x,r._x,o._x,0,s._y,r._y,o._y,0,s._z,r._z,o._z,0,l,h,c,1,n),n}static LookDirectionLH(e,t){const i=new f;return f.LookDirectionLHToRef(e,t,i),i}static LookDirectionLHToRef(e,t,i){const n=_.Vector3[0];n.copyFrom(e),n.scaleInPlace(-1);const s=_.Vector3[1];return u.CrossToRef(t,n,s),f.FromValuesToRef(s._x,s._y,s._z,0,t._x,t._y,t._z,0,n._x,n._y,n._z,0,0,0,0,1,i),i}static LookDirectionRH(e,t){const i=new f;return f.LookDirectionRHToRef(e,t,i),i}static LookDirectionRHToRef(e,t,i){const n=_.Vector3[2];return u.CrossToRef(t,e,n),f.FromValuesToRef(n._x,n._y,n._z,0,t._x,t._y,t._z,0,e._x,e._y,e._z,0,0,0,0,1,i),i}static OrthoLH(e,t,i,n,s){const r=new f;return f.OrthoLHToRef(e,t,i,n,r,s),r}static OrthoLHToRef(e,t,i,n,s,r){const o=2/e,a=2/t,l=2/(n-i),h=-(n+i)/(n-i);return f.FromValuesToRef(o,0,0,0,0,a,0,0,0,0,l,0,0,0,h,1,s),r&&s.multiplyToRef(g,s),s._updateIdentityStatus(1===o&&1===a&&1===l&&0===h),s}static OrthoOffCenterLH(e,t,i,n,s,r,o){const a=new f;return f.OrthoOffCenterLHToRef(e,t,i,n,s,r,a,o),a}static OrthoOffCenterLHToRef(e,t,i,n,s,r,o,a){const l=2/(t-e),h=2/(n-i),c=2/(r-s),u=-(r+s)/(r-s),d=(e+t)/(e-t),p=(n+i)/(i-n);return f.FromValuesToRef(l,0,0,0,0,h,0,0,0,0,c,0,d,p,u,1,o),a&&o.multiplyToRef(g,o),o.markAsUpdated(),o}static OrthoOffCenterRH(e,t,i,n,s,r,o){const a=new f;return f.OrthoOffCenterRHToRef(e,t,i,n,s,r,a,o),a}static OrthoOffCenterRHToRef(e,t,i,n,s,r,o,a){return f.OrthoOffCenterLHToRef(e,t,i,n,s,r,o,a),o._m[10]*=-1,o}static PerspectiveLH(e,t,i,n,s,r=0){const o=new f,a=2*i/e,l=2*i/t,h=(n+i)/(n-i),c=-2*n*i/(n-i),u=Math.tan(r);return f.FromValuesToRef(a,0,0,0,0,l,0,u,0,0,h,1,0,0,c,0,o),s&&o.multiplyToRef(g,o),o._updateIdentityStatus(!1),o}static PerspectiveFovLH(e,t,i,n,s,r=0,o=!1){const a=new f;return f.PerspectiveFovLHToRef(e,t,i,n,a,!0,s,r,o),a}static PerspectiveFovLHToRef(e,t,i,n,s,r=!0,o,a=0,l=!1){const h=i,c=n,u=1/Math.tan(.5*e),d=r?u/t:u,p=r?u:u*t,_=l&&0===h?-1:0!==c?(c+h)/(c-h):1,m=l&&0===h?2*c:0!==c?-2*c*h/(c-h):-2*h,v=Math.tan(a);return f.FromValuesToRef(d,0,0,0,0,p,0,v,0,0,_,1,0,0,m,0,s),o&&s.multiplyToRef(g,s),s._updateIdentityStatus(!1),s}static PerspectiveFovReverseLHToRef(e,t,i,n,s,r=!0,o,a=0){const l=1/Math.tan(.5*e),h=r?l/t:l,c=r?l:l*t,u=Math.tan(a);return f.FromValuesToRef(h,0,0,0,0,c,0,u,0,0,-i,1,0,0,1,0,s),o&&s.multiplyToRef(g,s),s._updateIdentityStatus(!1),s}static PerspectiveFovRH(e,t,i,n,s,r=0,o=!1){const a=new f;return f.PerspectiveFovRHToRef(e,t,i,n,a,!0,s,r,o),a}static PerspectiveFovRHToRef(e,t,i,n,s,r=!0,o,a=0,l=!1){const h=i,c=n,u=1/Math.tan(.5*e),d=r?u/t:u,p=r?u:u*t,_=l&&0===h?1:0!==c?-(c+h)/(c-h):-1,m=l&&0===h?2*c:0!==c?-2*c*h/(c-h):-2*h,v=Math.tan(a);return f.FromValuesToRef(d,0,0,0,0,p,0,v,0,0,_,-1,0,0,m,0,s),o&&s.multiplyToRef(g,s),s._updateIdentityStatus(!1),s}static PerspectiveFovReverseRHToRef(e,t,i,n,s,r=!0,o,a=0){const l=1/Math.tan(.5*e),h=r?l/t:l,c=r?l:l*t,u=Math.tan(a);return f.FromValuesToRef(h,0,0,0,0,c,0,u,0,0,-i,-1,0,0,-1,0,s),o&&s.multiplyToRef(g,s),s._updateIdentityStatus(!1),s}static PerspectiveFovWebVRToRef(e,t,i,n,s=!1,r,o=0){const a=s?-1:1,l=Math.tan(e.upDegrees*Math.PI/180),h=Math.tan(e.downDegrees*Math.PI/180),c=Math.tan(e.leftDegrees*Math.PI/180),u=Math.tan(e.rightDegrees*Math.PI/180),d=2/(c+u),p=2/(l+h),f=Math.tan(o),_=n._m;return _[0]=d,_[1]=_[2]=_[3]=_[4]=0,_[5]=p,_[6]=0,_[7]=f,_[8]=(c-u)*d*.5,_[9]=-(l-h)*p*.5,_[10]=-i/(t-i),_[11]=1*a,_[12]=_[13]=_[15]=0,_[14]=-2*i*t/(i-t),r&&n.multiplyToRef(g,n),n.markAsUpdated(),n}static GetFinalMatrix(e,t,i,n,s,r){const o=e.width,a=e.height,l=e.x,h=e.y,c=f.FromValues(o/2,0,0,0,0,-a/2,0,0,0,0,r-s,0,l+o/2,a/2+h,s,1),u=new t.constructor;return t.multiplyToRef(i,u),u.multiplyToRef(n,u),u.multiplyToRef(c,u)}static GetAsMatrix2x2(e){const t=e.m,i=[t[0],t[1],t[4],t[5]];return a.Z.MatrixUse64Bits?i:new Float32Array(i)}static GetAsMatrix3x3(e){const t=e.m,i=[t[0],t[1],t[2],t[4],t[5],t[6],t[8],t[9],t[10]];return a.Z.MatrixUse64Bits?i:new Float32Array(i)}static Transpose(e){const t=new e.constructor;return f.TransposeToRef(e,t),t}static TransposeToRef(e,t){const i=t._m,n=e.m;return i[0]=n[0],i[1]=n[4],i[2]=n[8],i[3]=n[12],i[4]=n[1],i[5]=n[5],i[6]=n[9],i[7]=n[13],i[8]=n[2],i[9]=n[6],i[10]=n[10],i[11]=n[14],i[12]=n[3],i[13]=n[7],i[14]=n[11],i[15]=n[15],t.markAsUpdated(),t._updateIdentityStatus(e._isIdentity,e._isIdentityDirty),t}static Reflection(e){const t=new f;return f.ReflectionToRef(e,t),t}static ReflectionToRef(e,t){e.normalize();const i=e.normal.x,n=e.normal.y,s=e.normal.z,r=-2*i,o=-2*n,a=-2*s;return f.FromValuesToRef(r*i+1,o*i,a*i,0,r*n,o*n+1,a*n,0,r*s,o*s,a*s+1,0,r*e.d,o*e.d,a*e.d,1,t),t}static FromXYZAxesToRef(e,t,i,n){return f.FromValuesToRef(e._x,e._y,e._z,0,t._x,t._y,t._z,0,i._x,i._y,i._z,0,0,0,0,1,n),n}static FromQuaternionToRef(e,t){const i=e._x*e._x,n=e._y*e._y,s=e._z*e._z,r=e._x*e._y,o=e._z*e._w,a=e._z*e._x,l=e._y*e._w,h=e._y*e._z,c=e._x*e._w;return t._m[0]=1-2*(n+s),t._m[1]=2*(r+o),t._m[2]=2*(a-l),t._m[3]=0,t._m[4]=2*(r-o),t._m[5]=1-2*(s+i),t._m[6]=2*(h+c),t._m[7]=0,t._m[8]=2*(a+l),t._m[9]=2*(h-c),t._m[10]=1-2*(n+i),t._m[11]=0,t._m[12]=0,t._m[13]=0,t._m[14]=0,t._m[15]=1,t.markAsUpdated(),t}}f._UpdateFlagSeed=0,f._IdentityReadOnly=f.Identity();class _{}_.Vector3=r.B.BuildTuple(11,u.Zero),_.Matrix=r.B.BuildTuple(2,f.Identity),_.Quaternion=r.B.BuildTuple(3,p.Zero);class m{}m.Vector2=r.B.BuildTuple(3,c.Zero),m.Vector3=r.B.BuildTuple(13,u.Zero),m.Vector4=r.B.BuildTuple(3,d.Zero),m.Quaternion=r.B.BuildTuple(2,p.Zero),m.Matrix=r.B.BuildTuple(8,f.Identity),(0,o.H)("BABYLON.Vector2",c),(0,o.H)("BABYLON.Vector3",u),(0,o.H)("BABYLON.Vector4",d),(0,o.H)("BABYLON.Matrix",f);const g=f.FromValues(1,0,0,0,0,1,0,0,0,0,.5,0,0,0,.5,1)},4538:(e,t,i)=>{i.d(t,{l:()=>n});class n{constructor(e,t,i,n){this.x=e,this.y=t,this.width=i,this.height=n}toGlobal(e,t){return new n(this.x*e,this.y*t,this.width*e,this.height*t)}toGlobalToRef(e,t,i){return i.x=this.x*e,i.y=this.y*t,i.width=this.width*e,i.height=this.height*t,this}clone(){return new n(this.x,this.y,this.width,this.height)}}},6113:(e,t,i)=>{i.d(t,{_:()=>h,i:()=>c});var n=i(4141),s=i(6913);const r=[Math.sqrt(1/(4*Math.PI)),-Math.sqrt(3/(4*Math.PI)),Math.sqrt(3/(4*Math.PI)),-Math.sqrt(3/(4*Math.PI)),Math.sqrt(15/(4*Math.PI)),-Math.sqrt(15/(4*Math.PI)),Math.sqrt(5/(16*Math.PI)),-Math.sqrt(15/(4*Math.PI)),Math.sqrt(15/(16*Math.PI))],o=[()=>1,e=>e.y,e=>e.z,e=>e.x,e=>e.x*e.y,e=>e.y*e.z,e=>3*e.z*e.z-1,e=>e.x*e.z,e=>e.x*e.x-e.y*e.y],a=(e,t)=>r[e]*o[e](t),l=[Math.PI,2*Math.PI/3,2*Math.PI/3,2*Math.PI/3,Math.PI/4,Math.PI/4,Math.PI/4,Math.PI/4,Math.PI/4];class h{constructor(){this.preScaled=!1,this.l00=n.P.Zero(),this.l1_1=n.P.Zero(),this.l10=n.P.Zero(),this.l11=n.P.Zero(),this.l2_2=n.P.Zero(),this.l2_1=n.P.Zero(),this.l20=n.P.Zero(),this.l21=n.P.Zero(),this.l22=n.P.Zero()}addLight(e,t,i){s.jp.Vector3[0].set(t.r,t.g,t.b);const n=s.jp.Vector3[0],r=s.jp.Vector3[1];n.scaleToRef(i,r),r.scaleToRef(a(0,e),s.jp.Vector3[2]),this.l00.addInPlace(s.jp.Vector3[2]),r.scaleToRef(a(1,e),s.jp.Vector3[2]),this.l1_1.addInPlace(s.jp.Vector3[2]),r.scaleToRef(a(2,e),s.jp.Vector3[2]),this.l10.addInPlace(s.jp.Vector3[2]),r.scaleToRef(a(3,e),s.jp.Vector3[2]),this.l11.addInPlace(s.jp.Vector3[2]),r.scaleToRef(a(4,e),s.jp.Vector3[2]),this.l2_2.addInPlace(s.jp.Vector3[2]),r.scaleToRef(a(5,e),s.jp.Vector3[2]),this.l2_1.addInPlace(s.jp.Vector3[2]),r.scaleToRef(a(6,e),s.jp.Vector3[2]),this.l20.addInPlace(s.jp.Vector3[2]),r.scaleToRef(a(7,e),s.jp.Vector3[2]),this.l21.addInPlace(s.jp.Vector3[2]),r.scaleToRef(a(8,e),s.jp.Vector3[2]),this.l22.addInPlace(s.jp.Vector3[2])}scaleInPlace(e){this.l00.scaleInPlace(e),this.l1_1.scaleInPlace(e),this.l10.scaleInPlace(e),this.l11.scaleInPlace(e),this.l2_2.scaleInPlace(e),this.l2_1.scaleInPlace(e),this.l20.scaleInPlace(e),this.l21.scaleInPlace(e),this.l22.scaleInPlace(e)}convertIncidentRadianceToIrradiance(){this.l00.scaleInPlace(l[0]),this.l1_1.scaleInPlace(l[1]),this.l10.scaleInPlace(l[2]),this.l11.scaleInPlace(l[3]),this.l2_2.scaleInPlace(l[4]),this.l2_1.scaleInPlace(l[5]),this.l20.scaleInPlace(l[6]),this.l21.scaleInPlace(l[7]),this.l22.scaleInPlace(l[8])}convertIrradianceToLambertianRadiance(){this.scaleInPlace(1/Math.PI)}preScaleForRendering(){this.preScaled=!0,this.l00.scaleInPlace(r[0]),this.l1_1.scaleInPlace(r[1]),this.l10.scaleInPlace(r[2]),this.l11.scaleInPlace(r[3]),this.l2_2.scaleInPlace(r[4]),this.l2_1.scaleInPlace(r[5]),this.l20.scaleInPlace(r[6]),this.l21.scaleInPlace(r[7]),this.l22.scaleInPlace(r[8])}updateFromArray(e){return n.P.FromArrayToRef(e[0],0,this.l00),n.P.FromArrayToRef(e[1],0,this.l1_1),n.P.FromArrayToRef(e[2],0,this.l10),n.P.FromArrayToRef(e[3],0,this.l11),n.P.FromArrayToRef(e[4],0,this.l2_2),n.P.FromArrayToRef(e[5],0,this.l2_1),n.P.FromArrayToRef(e[6],0,this.l20),n.P.FromArrayToRef(e[7],0,this.l21),n.P.FromArrayToRef(e[8],0,this.l22),this}updateFromFloatsArray(e){return n.P.FromFloatsToRef(e[0],e[1],e[2],this.l00),n.P.FromFloatsToRef(e[3],e[4],e[5],this.l1_1),n.P.FromFloatsToRef(e[6],e[7],e[8],this.l10),n.P.FromFloatsToRef(e[9],e[10],e[11],this.l11),n.P.FromFloatsToRef(e[12],e[13],e[14],this.l2_2),n.P.FromFloatsToRef(e[15],e[16],e[17],this.l2_1),n.P.FromFloatsToRef(e[18],e[19],e[20],this.l20),n.P.FromFloatsToRef(e[21],e[22],e[23],this.l21),n.P.FromFloatsToRef(e[24],e[25],e[26],this.l22),this}static FromArray(e){return(new h).updateFromArray(e)}static FromPolynomial(e){const t=new h;return t.l00=e.xx.scale(.376127).add(e.yy.scale(.376127)).add(e.zz.scale(.376126)),t.l1_1=e.y.scale(.977204),t.l10=e.z.scale(.977204),t.l11=e.x.scale(.977204),t.l2_2=e.xy.scale(1.16538),t.l2_1=e.yz.scale(1.16538),t.l20=e.zz.scale(1.34567).subtract(e.xx.scale(.672834)).subtract(e.yy.scale(.672834)),t.l21=e.zx.scale(1.16538),t.l22=e.xx.scale(1.16538).subtract(e.yy.scale(1.16538)),t.l1_1.scaleInPlace(-1),t.l11.scaleInPlace(-1),t.l2_1.scaleInPlace(-1),t.l21.scaleInPlace(-1),t.scaleInPlace(Math.PI),t}}class c{constructor(){this.x=n.P.Zero(),this.y=n.P.Zero(),this.z=n.P.Zero(),this.xx=n.P.Zero(),this.yy=n.P.Zero(),this.zz=n.P.Zero(),this.xy=n.P.Zero(),this.yz=n.P.Zero(),this.zx=n.P.Zero()}get preScaledHarmonics(){return this._harmonics||(this._harmonics=h.FromPolynomial(this)),this._harmonics.preScaled||this._harmonics.preScaleForRendering(),this._harmonics}addAmbient(e){s.jp.Vector3[0].copyFromFloats(e.r,e.g,e.b);const t=s.jp.Vector3[0];this.xx.addInPlace(t),this.yy.addInPlace(t),this.zz.addInPlace(t)}scaleInPlace(e){this.x.scaleInPlace(e),this.y.scaleInPlace(e),this.z.scaleInPlace(e),this.xx.scaleInPlace(e),this.yy.scaleInPlace(e),this.zz.scaleInPlace(e),this.yz.scaleInPlace(e),this.zx.scaleInPlace(e),this.xy.scaleInPlace(e)}updateFromHarmonics(e){return this._harmonics=e,this.x.copyFrom(e.l11),this.x.scaleInPlace(1.02333).scaleInPlace(-1),this.y.copyFrom(e.l1_1),this.y.scaleInPlace(1.02333).scaleInPlace(-1),this.z.copyFrom(e.l10),this.z.scaleInPlace(1.02333),this.xx.copyFrom(e.l00),s.jp.Vector3[0].copyFrom(e.l20).scaleInPlace(.247708),s.jp.Vector3[1].copyFrom(e.l22).scaleInPlace(.429043),this.xx.scaleInPlace(.886277).subtractInPlace(s.jp.Vector3[0]).addInPlace(s.jp.Vector3[1]),this.yy.copyFrom(e.l00),this.yy.scaleInPlace(.886277).subtractInPlace(s.jp.Vector3[0]).subtractInPlace(s.jp.Vector3[1]),this.zz.copyFrom(e.l00),s.jp.Vector3[0].copyFrom(e.l20).scaleInPlace(.495417),this.zz.scaleInPlace(.886277).addInPlace(s.jp.Vector3[0]),this.yz.copyFrom(e.l2_1),this.yz.scaleInPlace(.858086).scaleInPlace(-1),this.zx.copyFrom(e.l21),this.zx.scaleInPlace(.858086).scaleInPlace(-1),this.xy.copyFrom(e.l2_2),this.xy.scaleInPlace(.858086),this.scaleInPlace(1/Math.PI),this}static FromHarmonics(e){return(new c).updateFromHarmonics(e)}static FromArray(e){const t=new c;return n.P.FromArrayToRef(e[0],0,t.x),n.P.FromArrayToRef(e[1],0,t.y),n.P.FromArrayToRef(e[2],0,t.z),n.P.FromArrayToRef(e[3],0,t.xx),n.P.FromArrayToRef(e[4],0,t.yy),n.P.FromArrayToRef(e[5],0,t.zz),n.P.FromArrayToRef(e[6],0,t.yz),n.P.FromArrayToRef(e[7],0,t.zx),n.P.FromArrayToRef(e[8],0,t.xy),t}}},7422:(e,t,i)=>{i.d(t,{NR:()=>h,aR:()=>l,kg:()=>c});var n=i(4141),s=i(4649),r=i(4496),o=i(2101),a=i(4892);function l(e){let t=[0,1,2,0,2,3,4,5,6,4,6,7,8,9,10,8,10,11,12,13,14,12,14,15,16,17,18,16,18,19,20,21,22,20,22,23];const i=[0,0,1,0,0,1,0,0,1,0,0,1,0,0,-1,0,0,-1,0,0,-1,0,0,-1,1,0,0,1,0,0,1,0,0,1,0,0,-1,0,0,-1,0,0,-1,0,0,-1,0,0,0,1,0,0,1,0,0,1,0,0,1,0,0,-1,0,0,-1,0,0,-1,0,0,-1,0],r=[];let l=[];const h=e.width||e.size||1,c=e.height||e.size||1,u=e.depth||e.size||1,d=e.wrap||!1;let p=void 0===e.topBaseAt?1:e.topBaseAt,f=void 0===e.bottomBaseAt?0:e.bottomBaseAt;p=(p+4)%4,f=(f+4)%4;let _=[2,0,3,1][p],m=[2,0,1,3][f],g=[1,-1,1,-1,-1,1,-1,1,1,1,1,1,1,1,-1,-1,1,-1,-1,-1,-1,1,-1,-1,1,1,-1,1,-1,-1,1,-1,1,1,1,1,-1,1,1,-1,-1,1,-1,-1,-1,-1,1,-1,-1,1,1,-1,1,-1,1,1,-1,1,1,1,1,-1,1,1,-1,-1,-1,-1,-1,-1,-1,1];if(d){t=[2,3,0,2,0,1,4,5,6,4,6,7,9,10,11,9,11,8,12,14,15,12,13,14],g=[-1,1,1,1,1,1,1,-1,1,-1,-1,1,1,1,-1,-1,1,-1,-1,-1,-1,1,-1,-1,1,1,1,1,1,-1,1,-1,-1,1,-1,1,-1,1,-1,-1,1,1,-1,-1,1,-1,-1,-1];let e=[[1,1,1],[-1,1,1],[-1,1,-1],[1,1,-1]],i=[[-1,-1,1],[1,-1,1],[1,-1,-1],[-1,-1,-1]];const n=[17,18,19,16],s=[22,23,20,21];for(;_>0;)e.unshift(e.pop()),n.unshift(n.pop()),_--;for(;m>0;)i.unshift(i.pop()),s.unshift(s.pop()),m--;e=e.flat(),i=i.flat(),g=g.concat(e).concat(i),t.push(n[0],n[2],n[3],n[0],n[1],n[2]),t.push(s[0],s[2],s[3],s[0],s[1],s[2])}const v=[h/2,c/2,u/2];l=g.reduce(((e,t,i)=>e.concat(t*v[i%3])),[]);const y=0===e.sideOrientation?0:e.sideOrientation||o.x.DEFAULTSIDE,x=e.faceUV||new Array(6),b=e.faceColors,T=[];for(let e=0;e<6;e++)void 0===x[e]&&(x[e]=new n.Lt(0,0,1,1)),b&&void 0===b[e]&&(b[e]=new s.HE(1,1,1,1));for(let e=0;e<6;e++)if(r.push(x[e].z,a.e.UseOpenGLOrientationForUV?1-x[e].w:x[e].w),r.push(x[e].x,a.e.UseOpenGLOrientationForUV?1-x[e].w:x[e].w),r.push(x[e].x,a.e.UseOpenGLOrientationForUV?1-x[e].y:x[e].y),r.push(x[e].z,a.e.UseOpenGLOrientationForUV?1-x[e].y:x[e].y),b)for(let t=0;t<4;t++)T.push(b[e].r,b[e].g,b[e].b,b[e].a);o.x._ComputeSides(y,l,t,i,r,e.frontUVs,e.backUVs);const S=new o.x;if(S.indices=t,S.positions=l,S.normals=i,S.uvs=r,b){const e=y===o.x.DOUBLESIDE?T.concat(T):T;S.colors=e}return S}function h(e,t={},i=null){const n=new r.Kj(e,i);return t.sideOrientation=r.Kj._GetDefaultSideOrientation(t.sideOrientation),n._originalBuilderSideOrientation=t.sideOrientation,l(t).applyToMesh(n,t.updatable),n}const c={CreateBox:h};o.x.CreateBox=l,r.Kj.CreateBox=(e,t,i=null,n,s)=>h(e,{size:t,sideOrientation:s,updatable:n},i)},8027:(e,t,i)=>{i.d(t,{$6:()=>_,DG:()=>m,Es:()=>p,Qq:()=>f,W:()=>g,kt:()=>d,vU:()=>v});var n=i(4141),s=i(4649),r=i(4496),o=i(2101),a=i(8475),l=i(7257),h=i(1431),c=i(1341),u=i(4892);function d(e){const t=[],i=[],s=[],r=[];let a,l;const h=e.width||1,c=e.height||1,d=e.subdivisionsX||e.subdivisions||1,p=e.subdivisionsY||e.subdivisions||1;for(a=0;a<=p;a++)for(l=0;l<=d;l++){const e=new n.P(l*h/d-h/2,0,(p-a)*c/p-c/2),t=new n.P(0,1,0);i.push(e.x,e.y,e.z),s.push(t.x,t.y,t.z),r.push(l/d,u.e.UseOpenGLOrientationForUV?a/p:1-a/p)}for(a=0;a<p;a++)for(l=0;l<d;l++)t.push(l+1+(a+1)*(d+1)),t.push(l+1+a*(d+1)),t.push(l+a*(d+1)),t.push(l+(a+1)*(d+1)),t.push(l+1+(a+1)*(d+1)),t.push(l+a*(d+1));const f=new o.x;return f.indices=t,f.positions=i,f.normals=s,f.uvs=r,f}function p(e){const t=void 0!==e.xmin&&null!==e.xmin?e.xmin:-1,i=void 0!==e.zmin&&null!==e.zmin?e.zmin:-1,s=void 0!==e.xmax&&null!==e.xmax?e.xmax:1,r=void 0!==e.zmax&&null!==e.zmax?e.zmax:1,a=e.subdivisions||{w:1,h:1},l=e.precision||{w:1,h:1},h=new Array,c=new Array,u=new Array,d=new Array;let p,f,_,m;a.h=a.h<1?1:a.h,a.w=a.w<1?1:a.w,l.w=l.w<1?1:l.w,l.h=l.h<1?1:l.h;const g=(s-t)/a.w,v=(r-i)/a.h;function y(e,t,i,s){const r=c.length/3,o=l.w+1;for(p=0;p<l.h;p++)for(f=0;f<l.w;f++){const e=[r+f+p*o,r+(f+1)+p*o,r+(f+1)+(p+1)*o,r+f+(p+1)*o];h.push(e[1]),h.push(e[2]),h.push(e[3]),h.push(e[0]),h.push(e[1]),h.push(e[3])}const a=n.P.Zero(),_=new n.P(0,1,0);for(p=0;p<=l.h;p++)for(a.z=p*(s-t)/l.h+t,f=0;f<=l.w;f++)a.x=f*(i-e)/l.w+e,a.y=0,c.push(a.x,a.y,a.z),u.push(_.x,_.y,_.z),d.push(f/l.w,p/l.h)}for(_=0;_<a.h;_++)for(m=0;m<a.w;m++)y(t+m*g,i+_*v,t+(m+1)*g,i+(_+1)*v);const x=new o.x;return x.indices=h,x.positions=c,x.normals=u,x.uvs=d,x}function f(e){const t=[],i=[],r=[],a=[];let l,h;const u=e.colorFilter||new s.Wo(.3,.59,.11),d=e.alphaFilter||0;let p=!1;if(e.minHeight>e.maxHeight){p=!0;const t=e.maxHeight;e.maxHeight=e.minHeight,e.minHeight=t}for(l=0;l<=e.subdivisions;l++)for(h=0;h<=e.subdivisions;h++){const t=new n.P(h*e.width/e.subdivisions-e.width/2,0,(e.subdivisions-l)*e.height/e.subdivisions-e.height/2),s=4*(((t.x+e.width/2)/e.width*(e.bufferWidth-1)|0)+((1-(t.z+e.height/2)/e.height)*(e.bufferHeight-1)|0)*e.bufferWidth);let o=e.buffer[s]/255,f=e.buffer[s+1]/255,_=e.buffer[s+2]/255;const m=e.buffer[s+3]/255;p&&(o=1-o,f=1-f,_=1-_);const g=o*u.r+f*u.g+_*u.b;t.y=m>=d?e.minHeight+(e.maxHeight-e.minHeight)*g:e.minHeight-c.kn,i.push(t.x,t.y,t.z),r.push(0,0,0),a.push(h/e.subdivisions,1-l/e.subdivisions)}for(l=0;l<e.subdivisions;l++)for(h=0;h<e.subdivisions;h++){const n=h+1+(l+1)*(e.subdivisions+1),s=h+1+l*(e.subdivisions+1),r=h+l*(e.subdivisions+1),o=h+(l+1)*(e.subdivisions+1),a=i[3*n+1]>=e.minHeight,c=i[3*s+1]>=e.minHeight,u=i[3*r+1]>=e.minHeight;a&&c&&u&&(t.push(n),t.push(s),t.push(r)),i[3*o+1]>=e.minHeight&&a&&u&&(t.push(o),t.push(n),t.push(r))}o.x.ComputeNormals(i,t,r);const f=new o.x;return f.indices=t,f.positions=i,f.normals=r,f.uvs=a,f}function _(e,t={},i){const n=new a.E(e,i);return n._setReady(!1),n._subdivisionsX=t.subdivisionsX||t.subdivisions||1,n._subdivisionsY=t.subdivisionsY||t.subdivisions||1,n._width=t.width||1,n._height=t.height||1,n._maxX=n._width/2,n._maxZ=n._height/2,n._minX=-n._maxX,n._minZ=-n._maxZ,d(t).applyToMesh(n,t.updatable),n._setReady(!0),n}function m(e,t,i=null){const n=new r.Kj(e,i);return p(t).applyToMesh(n,t.updatable),n}function g(e,t,i={},n=null){const r=i.width||10,o=i.height||10,c=i.subdivisions||1,u=i.minHeight||0,d=i.maxHeight||1,p=i.colorFilter||new s.Wo(.3,.59,.11),_=i.alphaFilter||0,m=i.updatable,g=i.onReady;n=n||h.l.LastCreatedScene;const v=new a.E(e,n);return v._subdivisionsX=c,v._subdivisionsY=c,v._width=r,v._height=o,v._maxX=v._width/2,v._maxZ=v._height/2,v._minX=-v._maxX,v._minZ=-v._maxZ,v._setReady(!1),l.w1.LoadImage(t,(e=>{const t=e.width,i=e.height;if(n.isDisposed)return;const s=null==n?void 0:n.getEngine().resizeImageBitmap(e,t,i);f({width:r,height:o,subdivisions:c,minHeight:u,maxHeight:d,colorFilter:p,buffer:s,bufferWidth:t,bufferHeight:i,alphaFilter:_}).applyToMesh(v,m),g&&g(v),v._setReady(!0)}),(()=>{}),n.offlineProvider),v}const v={CreateGround:_,CreateGroundFromHeightMap:g,CreateTiledGround:m};o.x.CreateGround=d,o.x.CreateTiledGround=p,o.x.CreateGroundFromHeightMap=f,r.Kj.CreateGround=(e,t,i,n,s,r)=>_(e,{width:t,height:i,subdivisions:n,updatable:r},s),r.Kj.CreateTiledGround=(e,t,i,n,s,r,o,a,l)=>m(e,{xmin:t,zmin:i,xmax:n,zmax:s,subdivisions:r,precision:o,updatable:l},a),r.Kj.CreateGroundFromHeightMap=(e,t,i,n,s,r,o,a,l,h,c)=>g(e,t,{width:i,height:n,subdivisions:s,minHeight:r,maxHeight:o,updatable:l,onReady:h,alphaFilter:c},a)},6272:(e,t,i)=>{i.d(t,{Au:()=>l,GM:()=>h,GQ:()=>a});var n=i(4141),s=i(4496),r=i(2101),o=i(4892);function a(e){const t=e.sideOrientation||r.x.DEFAULTSIDE,i=e.radius||1,s=void 0===e.flat||e.flat,a=e.subdivisions||4,l=e.radiusX||i,h=e.radiusY||i,c=e.radiusZ||i,u=(1+Math.sqrt(5))/2,d=[-1,u,-0,1,u,0,-1,-u,0,1,-u,0,0,-1,-u,0,1,-u,0,-1,u,0,1,u,u,0,1,u,0,-1,-u,0,1,-u,0,-1],p=[0,11,5,0,5,1,0,1,7,0,7,10,12,22,23,1,5,20,5,11,4,23,22,13,22,18,6,7,1,8,14,21,4,14,4,2,16,13,6,15,6,19,3,8,9,4,21,5,13,17,23,6,13,22,19,6,18,9,8,1],f=[0,1,2,3,4,5,6,7,8,9,10,11,0,2,3,3,3,4,7,8,9,9,10,11],_=[5,1,3,1,6,4,0,0,5,3,4,2,2,2,4,0,2,0,1,1,6,0,6,2,0,4,3,3,4,4,3,1,4,2,4,4,0,2,1,1,2,2,3,3,1,3,2,4],m=[0,0,0,0,1,0,0,1,1,0,0,0,1,1,0,0,1,1,1,0],g=new Array,v=new Array,y=new Array,x=new Array;let b=0;const T=new Array(3),S=new Array(3);let E;for(E=0;E<3;E++)T[E]=n.P.Zero(),S[E]=n.FM.Zero();for(let e=0;e<20;e++){for(E=0;E<3;E++){const t=p[3*e+E];T[E].copyFromFloats(d[3*f[t]],d[3*f[t]+1],d[3*f[t]+2]),T[E].normalize(),S[E].copyFromFloats(.134765625*_[2*t]+.05859375+-.0390625*m[e],.2333984375*_[2*t+1]+.025390625+.01953125*m[e])}const t=(e,t,i,r)=>{const u=n.P.Lerp(T[0],T[2],t/a),d=n.P.Lerp(T[1],T[2],t/a),p=a===t?T[2]:n.P.Lerp(u,d,e/(a-t));let f;if(p.normalize(),s){const e=n.P.Lerp(T[0],T[2],r/a),t=n.P.Lerp(T[1],T[2],r/a);f=n.P.Lerp(e,t,i/(a-r))}else f=new n.P(p.x,p.y,p.z);f.x/=l,f.y/=h,f.z/=c,f.normalize();const _=n.FM.Lerp(S[0],S[2],t/a),m=n.FM.Lerp(S[1],S[2],t/a),E=a===t?S[2]:n.FM.Lerp(_,m,e/(a-t));v.push(p.x*l,p.y*h,p.z*c),y.push(f.x,f.y,f.z),x.push(E.x,o.e.UseOpenGLOrientationForUV?1-E.y:E.y),g.push(b),b++};for(let e=0;e<a;e++)for(let i=0;i+e<a;i++)t(i,e,i+1/3,e+1/3),t(i+1,e,i+1/3,e+1/3),t(i,e+1,i+1/3,e+1/3),i+e+1<a&&(t(i+1,e,i+2/3,e+2/3),t(i+1,e+1,i+2/3,e+2/3),t(i,e+1,i+2/3,e+2/3))}r.x._ComputeSides(t,v,g,y,x,e.frontUVs,e.backUVs);const C=new r.x;return C.indices=g,C.positions=v,C.normals=y,C.uvs=x,C}function l(e,t={},i=null){const n=new s.Kj(e,i);return t.sideOrientation=s.Kj._GetDefaultSideOrientation(t.sideOrientation),n._originalBuilderSideOrientation=t.sideOrientation,a(t).applyToMesh(n,t.updatable),n}const h={CreateIcoSphere:l};r.x.CreateIcoSphere=a,s.Kj.CreateIcoSphere=(e,t,i)=>l(e,t,i)},3615:(e,t,i)=>{i.d(t,{Hq:()=>o,mx:()=>l,pT:()=>a});var n=i(4496),s=i(2101),r=i(4892);function o(e){const t=[],i=[],n=[],o=[],a=e.width||e.size||1,l=e.height||e.size||1,h=0===e.sideOrientation?0:e.sideOrientation||s.x.DEFAULTSIDE,c=a/2,u=l/2;i.push(-c,-u,0),n.push(0,0,-1),o.push(0,r.e.UseOpenGLOrientationForUV?1:0),i.push(c,-u,0),n.push(0,0,-1),o.push(1,r.e.UseOpenGLOrientationForUV?1:0),i.push(c,u,0),n.push(0,0,-1),o.push(1,r.e.UseOpenGLOrientationForUV?0:1),i.push(-c,u,0),n.push(0,0,-1),o.push(0,r.e.UseOpenGLOrientationForUV?0:1),t.push(0),t.push(1),t.push(2),t.push(0),t.push(2),t.push(3),s.x._ComputeSides(h,i,t,n,o,e.frontUVs,e.backUVs);const d=new s.x;return d.indices=t,d.positions=i,d.normals=n,d.uvs=o,d}function a(e,t={},i=null){const s=new n.Kj(e,i);return t.sideOrientation=n.Kj._GetDefaultSideOrientation(t.sideOrientation),s._originalBuilderSideOrientation=t.sideOrientation,o(t).applyToMesh(s,t.updatable),t.sourcePlane&&(s.translate(t.sourcePlane.normal,-t.sourcePlane.d),s.setDirection(t.sourcePlane.normal.scale(-1))),s}const l={CreatePlane:a};s.x.CreatePlane=o,n.Kj.CreatePlane=(e,t,i,n,s)=>a(e,{size:t,width:t,height:t,sideOrientation:s,updatable:n},i)},1500:(e,t,i)=>{i.d(t,{J:()=>l});var n=i(7257),s=i(6250),r=i(2101);function o(e,t,i,n,s,r){const o=new e.DecoderBuffer;o.Init(t,t.byteLength);const a=new e.Decoder;let l,h;try{const t=a.GetEncodedGeometryType(o);switch(t){case e.TRIANGULAR_MESH:l=new e.Mesh,h=a.DecodeBufferToMesh(o,l);break;case e.POINT_CLOUD:l=new e.PointCloud,h=a.DecodeBufferToPointCloud(o,l);break;default:throw new Error(`Invalid geometry type ${t}`)}if(!h.ok()||!l.ptr)throw new Error(h.error_msg());if(t===e.TRIANGULAR_MESH){const t=3*l.num_faces(),i=4*t,s=e._malloc(i);try{a.GetTrianglesUInt32Array(l,i,s);const r=new Uint32Array(t);r.set(new Uint32Array(e.HEAPF32.buffer,s,t)),n(r)}finally{e._free(s)}}const c=(t,i,n=1)=>{const r=i.num_components(),o=l.num_points(),h=o*r,c=h*Float32Array.BYTES_PER_ELEMENT,u=e._malloc(c);try{a.GetAttributeDataArrayForAllPoints(l,i,e.DT_FLOAT32,c,u);const d=new Float32Array(e.HEAPF32.buffer,u,h);if("color"===t&&3===r){const e=new Float32Array(4*o);for(let t=0,i=0;t<e.length;t+=4,i+=r)e[t+0]=d[i+0],e[t+1]=d[i+1],e[t+2]=d[i+2],e[t+3]=1;s(t,e)}else{const i=new Float32Array(h);if(i.set(new Float32Array(e.HEAPF32.buffer,u,h)),1!==n)for(let e=0;e<i.length;e++)i[e]=i[e]/n;s(t,i)}}finally{e._free(u)}};if(i)for(const e in i){const t=i[e];c(e,a.GetAttributeByUniqueId(l,t),r&&r[e]||1)}else{const t={position:"POSITION",normal:"NORMAL",color:"COLOR",uv:"TEX_COORD"};for(const i in t){const n=a.GetAttributeId(l,e[t[i]]);-1!==n&&c(i,a.GetAttribute(l,n))}}}finally{l&&e.destroy(l),e.destroy(a),e.destroy(o)}}function a(){let e;onmessage=t=>{const i=t.data;switch(i.id){case"init":{const t=i.decoder;t.url&&(importScripts(t.url),e=DracoDecoderModule({wasmBinary:t.wasmBinary})),postMessage("done");break}case"decodeMesh":if(!e)throw new Error("Draco decoder module is not available");e.then((e=>{o(e,i.dataView,i.attributes,(e=>{postMessage({id:"indices",value:e},[e.buffer])}),((e,t)=>{postMessage({id:e,value:t},[t.buffer])})),postMessage("done")}))}}}class l{static get DecoderAvailable(){const e=l.Configuration.decoder;return!!(e.wasmUrl&&e.wasmBinaryUrl&&"object"==typeof WebAssembly||e.fallbackUrl)}static GetDefaultNumWorkers(){return"object"==typeof navigator&&navigator.hardwareConcurrency?Math.min(Math.floor(.5*navigator.hardwareConcurrency),4):1}static get Default(){return l._Default||(l._Default=new l),l._Default}constructor(e=l.DefaultNumWorkers){const t=l.Configuration.decoder,i=t.wasmUrl&&t.wasmBinaryUrl&&"object"==typeof WebAssembly?{url:n.w1.GetAbsoluteUrl(t.wasmUrl),wasmBinaryPromise:n.w1.LoadFileAsync(n.w1.GetAbsoluteUrl(t.wasmBinaryUrl))}:{url:n.w1.GetAbsoluteUrl(t.fallbackUrl),wasmBinaryPromise:Promise.resolve(void 0)};e&&"function"==typeof Worker&&"function"==typeof URL?this._workerPoolPromise=i.wasmBinaryPromise.then((t=>{const n=`${o}(${a})()`,r=URL.createObjectURL(new Blob([n],{type:"application/javascript"}));return new s.v(e,(()=>new Promise(((e,n)=>{const s=new Worker(r),o=e=>{s.removeEventListener("error",o),s.removeEventListener("message",a),n(e)},a=t=>{"done"===t.data&&(s.removeEventListener("error",o),s.removeEventListener("message",a),e(s))};s.addEventListener("error",o),s.addEventListener("message",a),s.postMessage({id:"init",decoder:{url:i.url,wasmBinary:t}})}))))})):this._decoderModulePromise=i.wasmBinaryPromise.then((e=>{if(!i.url)throw new Error("Draco decoder module is not available");return n.w1.LoadScriptAsync(i.url).then((()=>{return t=e,new Promise((e=>{DracoDecoderModule({wasmBinary:t}).then((t=>{e({module:t})}))}));var t}))}))}dispose(){this._workerPoolPromise&&this._workerPoolPromise.then((e=>{e.dispose()})),delete this._workerPoolPromise,delete this._decoderModulePromise}whenReadyAsync(){return this._workerPoolPromise?this._workerPoolPromise.then((()=>{})):this._decoderModulePromise?this._decoderModulePromise.then((()=>{})):Promise.resolve()}decodeMeshAsync(e,t,i){const n=e instanceof ArrayBuffer?new Uint8Array(e):e;if(this._workerPoolPromise)return this._workerPoolPromise.then((e=>new Promise(((s,o)=>{e.push(((e,a)=>{const l=new r.x,h=t=>{e.removeEventListener("error",h),e.removeEventListener("message",c),o(t),a()},c=t=>{if("done"===t.data)e.removeEventListener("error",h),e.removeEventListener("message",c),s(l),a();else if("indices"===t.data.id)l.indices=t.data.value;else{const e=i&&i[t.data.id]?i[t.data.id]:1;if(1!==e)for(let i=0;i<t.data.value.length;i++)t.data.value[i]=t.data.value[i]/e;l.set(t.data.value,t.data.id)}};e.addEventListener("error",h),e.addEventListener("message",c);const u=new Uint8Array(n.byteLength);u.set(new Uint8Array(n.buffer,n.byteOffset,n.byteLength)),e.postMessage({id:"decodeMesh",dataView:u,attributes:t},[u.buffer])}))}))));if(this._decoderModulePromise)return this._decoderModulePromise.then((e=>{const s=new r.x;return o(e.module,n,t,(e=>{s.indices=e}),((e,t)=>{s.set(t,e)}),i),s}));throw new Error("Draco decoder module is not available")}}l.Configuration={decoder:{wasmUrl:"https://preview.babylonjs.com/draco_wasm_wrapper_gltf.js",wasmBinaryUrl:"https://preview.babylonjs.com/draco_decoder_gltf.wasm",fallbackUrl:"https://preview.babylonjs.com/draco_decoder_gltf.js"}},l.DefaultNumWorkers=l.GetDefaultNumWorkers(),l._Default=null},9481:(e,t,i)=>{i.d(t,{K:()=>s});var n=i(7257);class s{static get Default(){return s._Default||(s._Default=new s),s._Default}constructor(){const e=s.Configuration.decoder;this._decoderModulePromise=n.w1.LoadScriptAsync(n.w1.GetAbsoluteUrl(e.url)).then((()=>MeshoptDecoder.ready))}dispose(){delete this._decoderModulePromise}decodeGltfBufferAsync(e,t,i,n,s){return this._decoderModulePromise.then((()=>{const r=new Uint8Array(t*i);return MeshoptDecoder.decodeGltfBuffer(r,t,i,e,n,s),r}))}}s.Configuration={decoder:{url:"https://preview.babylonjs.com/meshopt_decoder.js"}},s._Default=null},8261:(e,t,i)=>{i.d(t,{M:()=>s});var n=i(7698);class s extends n.h{constructor(e){super(),this._buffer=e}get underlyingResource(){return this._buffer}}},1795:(e,t,i)=>{i.d(t,{x:()=>T});var n=i(5757),s=i(1057),r=i(4141),o=i(7814),a=i(708),l=i(2101),h=i(4674),c=i(5670),u=i(3722),d=i(3743),p=i(9356),f=i(4934),_=i(1372),m=i(4649),g=i(1341),v=i(5203),y=i(2208);class x{constructor(){this.facetNb=0,this.partitioningSubdivisions=10,this.partitioningBBoxRatio=1.01,this.facetDataEnabled=!1,this.facetParameters={},this.bbSize=r.P.Zero(),this.subDiv={max:1,X:1,Y:1,Z:1},this.facetDepthSort=!1,this.facetDepthSortEnabled=!1}}class b{constructor(){this._hasVertexAlpha=!1,this._useVertexColors=!0,this._numBoneInfluencers=4,this._applyFog=!0,this._receiveShadows=!1,this._facetData=new x,this._visibility=1,this._skeleton=null,this._layerMask=268435455,this._computeBonesUsingShaders=!0,this._isActive=!1,this._onlyForInstances=!1,this._isActiveIntermediate=!1,this._onlyForInstancesIntermediate=!1,this._actAsRegularMesh=!1,this._currentLOD=null,this._currentLODIsUpToDate=!1,this._collisionRetryCount=3,this._morphTargetManager=null,this._renderingGroupId=0,this._bakedVertexAnimationManager=null,this._material=null,this._positions=null,this._pointerOverDisableMeshTesting=!1,this._meshCollisionData=new p.a,this._enableDistantPicking=!1,this._rawBoundingInfo=null}}class T extends h.Y{static get BILLBOARDMODE_NONE(){return h.Y.BILLBOARDMODE_NONE}static get BILLBOARDMODE_X(){return h.Y.BILLBOARDMODE_X}static get BILLBOARDMODE_Y(){return h.Y.BILLBOARDMODE_Y}static get BILLBOARDMODE_Z(){return h.Y.BILLBOARDMODE_Z}static get BILLBOARDMODE_ALL(){return h.Y.BILLBOARDMODE_ALL}static get BILLBOARDMODE_USE_POSITION(){return h.Y.BILLBOARDMODE_USE_POSITION}get facetNb(){return this._internalAbstractMeshDataInfo._facetData.facetNb}get partitioningSubdivisions(){return this._internalAbstractMeshDataInfo._facetData.partitioningSubdivisions}set partitioningSubdivisions(e){this._internalAbstractMeshDataInfo._facetData.partitioningSubdivisions=e}get partitioningBBoxRatio(){return this._internalAbstractMeshDataInfo._facetData.partitioningBBoxRatio}set partitioningBBoxRatio(e){this._internalAbstractMeshDataInfo._facetData.partitioningBBoxRatio=e}get mustDepthSortFacets(){return this._internalAbstractMeshDataInfo._facetData.facetDepthSort}set mustDepthSortFacets(e){this._internalAbstractMeshDataInfo._facetData.facetDepthSort=e}get facetDepthSortFrom(){return this._internalAbstractMeshDataInfo._facetData.facetDepthSortFrom}set facetDepthSortFrom(e){this._internalAbstractMeshDataInfo._facetData.facetDepthSortFrom=e}get collisionRetryCount(){return this._internalAbstractMeshDataInfo._collisionRetryCount}set collisionRetryCount(e){this._internalAbstractMeshDataInfo._collisionRetryCount=e}get isFacetDataEnabled(){return this._internalAbstractMeshDataInfo._facetData.facetDataEnabled}get morphTargetManager(){return this._internalAbstractMeshDataInfo._morphTargetManager}set morphTargetManager(e){this._internalAbstractMeshDataInfo._morphTargetManager!==e&&(this._internalAbstractMeshDataInfo._morphTargetManager=e,this._syncGeometryWithMorphTargetManager())}get bakedVertexAnimationManager(){return this._internalAbstractMeshDataInfo._bakedVertexAnimationManager}set bakedVertexAnimationManager(e){this._internalAbstractMeshDataInfo._bakedVertexAnimationManager!==e&&(this._internalAbstractMeshDataInfo._bakedVertexAnimationManager=e,this._markSubMeshesAsAttributesDirty())}_syncGeometryWithMorphTargetManager(){}_updateNonUniformScalingState(e){return!!super._updateNonUniformScalingState(e)&&(this._markSubMeshesAsMiscDirty(),!0)}get rawBoundingInfo(){return this._internalAbstractMeshDataInfo._rawBoundingInfo}set rawBoundingInfo(e){this._internalAbstractMeshDataInfo._rawBoundingInfo=e}set onCollide(e){this._internalAbstractMeshDataInfo._meshCollisionData._onCollideObserver&&this.onCollideObservable.remove(this._internalAbstractMeshDataInfo._meshCollisionData._onCollideObserver),this._internalAbstractMeshDataInfo._meshCollisionData._onCollideObserver=this.onCollideObservable.add(e)}set onCollisionPositionChange(e){this._internalAbstractMeshDataInfo._meshCollisionData._onCollisionPositionChangeObserver&&this.onCollisionPositionChangeObservable.remove(this._internalAbstractMeshDataInfo._meshCollisionData._onCollisionPositionChangeObserver),this._internalAbstractMeshDataInfo._meshCollisionData._onCollisionPositionChangeObserver=this.onCollisionPositionChangeObservable.add(e)}get visibility(){return this._internalAbstractMeshDataInfo._visibility}set visibility(e){if(this._internalAbstractMeshDataInfo._visibility===e)return;const t=this._internalAbstractMeshDataInfo._visibility;this._internalAbstractMeshDataInfo._visibility=e,(1===t&&1!==e||1!==t&&1===e)&&this._markSubMeshesAsDirty((e=>{e.markAsMiscDirty(),e.markAsPrePassDirty()}))}get pointerOverDisableMeshTesting(){return this._internalAbstractMeshDataInfo._pointerOverDisableMeshTesting}set pointerOverDisableMeshTesting(e){this._internalAbstractMeshDataInfo._pointerOverDisableMeshTesting=e}get renderingGroupId(){return this._internalAbstractMeshDataInfo._renderingGroupId}set renderingGroupId(e){this._internalAbstractMeshDataInfo._renderingGroupId=e}get material(){return this._internalAbstractMeshDataInfo._material}set material(e){this._internalAbstractMeshDataInfo._material!==e&&(this._internalAbstractMeshDataInfo._material&&this._internalAbstractMeshDataInfo._material.meshMap&&(this._internalAbstractMeshDataInfo._material.meshMap[this.uniqueId]=void 0),this._internalAbstractMeshDataInfo._material=e,e&&e.meshMap&&(e.meshMap[this.uniqueId]=this),this.onMaterialChangedObservable.hasObservers()&&this.onMaterialChangedObservable.notifyObservers(this),this.subMeshes&&(this.resetDrawCache(),this._unBindEffect()))}getMaterialForRenderPass(e){var t;return null===(t=this._internalAbstractMeshDataInfo._materialForRenderPass)||void 0===t?void 0:t[e]}setMaterialForRenderPass(e,t){this.resetDrawCache(e),this._internalAbstractMeshDataInfo._materialForRenderPass||(this._internalAbstractMeshDataInfo._materialForRenderPass=[]),this._internalAbstractMeshDataInfo._materialForRenderPass[e]=t}get receiveShadows(){return this._internalAbstractMeshDataInfo._receiveShadows}set receiveShadows(e){this._internalAbstractMeshDataInfo._receiveShadows!==e&&(this._internalAbstractMeshDataInfo._receiveShadows=e,this._markSubMeshesAsLightDirty())}get hasVertexAlpha(){return this._internalAbstractMeshDataInfo._hasVertexAlpha}set hasVertexAlpha(e){this._internalAbstractMeshDataInfo._hasVertexAlpha!==e&&(this._internalAbstractMeshDataInfo._hasVertexAlpha=e,this._markSubMeshesAsAttributesDirty(),this._markSubMeshesAsMiscDirty())}get useVertexColors(){return this._internalAbstractMeshDataInfo._useVertexColors}set useVertexColors(e){this._internalAbstractMeshDataInfo._useVertexColors!==e&&(this._internalAbstractMeshDataInfo._useVertexColors=e,this._markSubMeshesAsAttributesDirty())}get computeBonesUsingShaders(){return this._internalAbstractMeshDataInfo._computeBonesUsingShaders}set computeBonesUsingShaders(e){this._internalAbstractMeshDataInfo._computeBonesUsingShaders!==e&&(this._internalAbstractMeshDataInfo._computeBonesUsingShaders=e,this._markSubMeshesAsAttributesDirty())}get numBoneInfluencers(){return this._internalAbstractMeshDataInfo._numBoneInfluencers}set numBoneInfluencers(e){this._internalAbstractMeshDataInfo._numBoneInfluencers!==e&&(this._internalAbstractMeshDataInfo._numBoneInfluencers=e,this._markSubMeshesAsAttributesDirty())}get applyFog(){return this._internalAbstractMeshDataInfo._applyFog}set applyFog(e){this._internalAbstractMeshDataInfo._applyFog!==e&&(this._internalAbstractMeshDataInfo._applyFog=e,this._markSubMeshesAsMiscDirty())}get enableDistantPicking(){return this._internalAbstractMeshDataInfo._enableDistantPicking}set enableDistantPicking(e){this._internalAbstractMeshDataInfo._enableDistantPicking=e}get layerMask(){return this._internalAbstractMeshDataInfo._layerMask}set layerMask(e){e!==this._internalAbstractMeshDataInfo._layerMask&&(this._internalAbstractMeshDataInfo._layerMask=e,this._resyncLightSources())}get collisionMask(){return this._internalAbstractMeshDataInfo._meshCollisionData._collisionMask}set collisionMask(e){this._internalAbstractMeshDataInfo._meshCollisionData._collisionMask=isNaN(e)?-1:e}get collisionResponse(){return this._internalAbstractMeshDataInfo._meshCollisionData._collisionResponse}set collisionResponse(e){this._internalAbstractMeshDataInfo._meshCollisionData._collisionResponse=e}get collisionGroup(){return this._internalAbstractMeshDataInfo._meshCollisionData._collisionGroup}set collisionGroup(e){this._internalAbstractMeshDataInfo._meshCollisionData._collisionGroup=isNaN(e)?-1:e}get surroundingMeshes(){return this._internalAbstractMeshDataInfo._meshCollisionData._surroundingMeshes}set surroundingMeshes(e){this._internalAbstractMeshDataInfo._meshCollisionData._surroundingMeshes=e}get lightSources(){return this._lightSources}get _positions(){return null}set skeleton(e){const t=this._internalAbstractMeshDataInfo._skeleton;t&&t.needInitialSkinMatrix&&t._unregisterMeshWithPoseMatrix(this),e&&e.needInitialSkinMatrix&&e._registerMeshWithPoseMatrix(this),this._internalAbstractMeshDataInfo._skeleton=e,this._internalAbstractMeshDataInfo._skeleton||(this._bonesTransformMatrices=null),this._markSubMeshesAsAttributesDirty()}get skeleton(){return this._internalAbstractMeshDataInfo._skeleton}constructor(e,t=null){switch(super(e,t,!1),this._internalAbstractMeshDataInfo=new b,this._waitingMaterialId=null,this.cullingStrategy=T.CULLINGSTRATEGY_BOUNDINGSPHERE_ONLY,this.onCollideObservable=new n.y$,this.onCollisionPositionChangeObservable=new n.y$,this.onMaterialChangedObservable=new n.y$,this.definedFacingForward=!0,this._occlusionQuery=null,this._renderingGroup=null,this.alphaIndex=Number.MAX_VALUE,this.isVisible=!0,this.isPickable=!0,this.isNearPickable=!1,this.isNearGrabbable=!1,this.showSubMeshesBoundingBox=!1,this.isBlocker=!1,this.enablePointerMoveEvents=!1,this.outlineColor=m.Wo.Red(),this.outlineWidth=.02,this.overlayColor=m.Wo.Red(),this.overlayAlpha=.5,this.useOctreeForRenderingSelection=!0,this.useOctreeForPicking=!0,this.useOctreeForCollisions=!0,this.alwaysSelectAsActiveMesh=!1,this.doNotSyncBoundingInfo=!1,this.actionManager=null,this.ellipsoid=new r.P(.5,1,.5),this.ellipsoidOffset=new r.P(0,0,0),this.edgesWidth=1,this.edgesColor=new m.HE(1,0,0,1),this._edgesRenderer=null,this._masterMesh=null,this._boundingInfo=null,this._boundingInfoIsDirty=!0,this._renderId=0,this._intersectionsInProgress=new Array,this._unIndexed=!1,this._lightSources=new Array,this._waitingData={lods:null,actions:null,freezeWorldMatrix:null},this._bonesTransformMatrices=null,this._transformMatrixTexture=null,this.onRebuildObservable=new n.y$,this._onCollisionPositionChange=(e,t,i=null)=>{t.subtractToRef(this._internalAbstractMeshDataInfo._meshCollisionData._oldPositionForCollisions,this._internalAbstractMeshDataInfo._meshCollisionData._diffPositionForCollisions),this._internalAbstractMeshDataInfo._meshCollisionData._diffPositionForCollisions.length()>o.D.CollisionsEpsilon&&this.position.addInPlace(this._internalAbstractMeshDataInfo._meshCollisionData._diffPositionForCollisions),i&&this.onCollideObservable.notifyObservers(i),this.onCollisionPositionChangeObservable.notifyObservers(this.position)},(t=this.getScene()).addMesh(this),this._resyncLightSources(),this._uniformBuffer=new d.M(this.getScene().getEngine(),void 0,void 0,e,!this.getScene().getEngine().isWebGPU),this._buildUniformLayout(),t.performancePriority){case s.a.Aggressive:this.doNotSyncBoundingInfo=!0;case s.a.Intermediate:this.alwaysSelectAsActiveMesh=!0,this.isPickable=!1}}_buildUniformLayout(){this._uniformBuffer.addUniform("world",16),this._uniformBuffer.addUniform("visibility",1),this._uniformBuffer.create()}transferToEffect(e){const t=this._uniformBuffer;t.updateMatrix("world",e),t.updateFloat("visibility",this._internalAbstractMeshDataInfo._visibility),t.update()}getMeshUniformBuffer(){return this._uniformBuffer}getClassName(){return"AbstractMesh"}toString(e){let t="Name: "+this.name+", isInstance: "+("InstancedMesh"!==this.getClassName()?"YES":"NO");t+=", # of submeshes: "+(this.subMeshes?this.subMeshes.length:0);const i=this._internalAbstractMeshDataInfo._skeleton;return i&&(t+=", skeleton: "+i.name),e&&(t+=", billboard mode: "+["NONE","X","Y",null,"Z",null,null,"ALL"][this.billboardMode],t+=", freeze wrld mat: "+(this._isWorldMatrixFrozen||this._waitingData.freezeWorldMatrix?"YES":"NO")),t}_getEffectiveParent(){return this._masterMesh&&this.billboardMode!==h.Y.BILLBOARDMODE_NONE?this._masterMesh:super._getEffectiveParent()}_getActionManagerForTrigger(e,t=!0){if(this.actionManager&&(t||this.actionManager.isRecursive)){if(!e)return this.actionManager;if(this.actionManager.hasSpecificTrigger(e))return this.actionManager}return this.parent?this.parent._getActionManagerForTrigger(e,!1):null}_rebuild(e=!1){if(this.onRebuildObservable.notifyObservers(this),null!==this._occlusionQuery&&(this._occlusionQuery=null),this.subMeshes)for(const e of this.subMeshes)e._rebuild()}_resyncLightSources(){this._lightSources.length=0;for(const e of this.getScene().lights)e.isEnabled()&&e.canAffectMesh(this)&&this._lightSources.push(e);this._markSubMeshesAsLightDirty()}_resyncLightSource(e){const t=e.isEnabled()&&e.canAffectMesh(this),i=this._lightSources.indexOf(e);let n=!1;if(-1===i){if(!t)return;this._lightSources.push(e)}else{if(t)return;n=!0,this._lightSources.splice(i,1)}this._markSubMeshesAsLightDirty(n)}_unBindEffect(){for(const e of this.subMeshes)e.setEffect(null)}_removeLightSource(e,t){const i=this._lightSources.indexOf(e);-1!==i&&(this._lightSources.splice(i,1),this._markSubMeshesAsLightDirty(t))}_markSubMeshesAsDirty(e){if(this.subMeshes)for(const t of this.subMeshes)for(let i=0;i<t._drawWrappers.length;++i){const n=t._drawWrappers[i];n&&n.defines&&n.defines.markAllAsDirty&&e(n.defines)}}_markSubMeshesAsLightDirty(e=!1){this._markSubMeshesAsDirty((t=>t.markAsLightDirty(e)))}_markSubMeshesAsAttributesDirty(){this._markSubMeshesAsDirty((e=>e.markAsAttributesDirty()))}_markSubMeshesAsMiscDirty(){this._markSubMeshesAsDirty((e=>e.markAsMiscDirty()))}markAsDirty(e){return this._currentRenderId=Number.MAX_VALUE,this._isDirty=!0,this}resetDrawCache(e){if(this.subMeshes)for(const t of this.subMeshes)t.resetDrawCache(e)}get isBlocked(){return!1}getLOD(e){return this}getTotalVertices(){return 0}getTotalIndices(){return 0}getIndices(){return null}getVerticesData(e){return null}setVerticesData(e,t,i,n){return this}updateVerticesData(e,t,i,n){return this}setIndices(e,t){return this}isVerticesDataPresent(e){return!1}getBoundingInfo(){return this._masterMesh?this._masterMesh.getBoundingInfo():(this._boundingInfoIsDirty&&(this._boundingInfoIsDirty=!1,this._updateBoundingInfo()),this._boundingInfo)}getRawBoundingInfo(){var e;return null!==(e=this.rawBoundingInfo)&&void 0!==e?e:this.getBoundingInfo()}setBoundingInfo(e){return this._boundingInfo=e,this}get hasBoundingInfo(){return null!==this._boundingInfo}buildBoundingInfo(e,t,i){return this._boundingInfo=new u.j(e,t,i),this._boundingInfo}normalizeToUnitCube(e=!0,t=!1,i){return super.normalizeToUnitCube(e,t,i)}get useBones(){return this.skeleton&&this.getScene().skeletonsEnabled&&this.isVerticesDataPresent(a.o.MatricesIndicesKind)&&this.isVerticesDataPresent(a.o.MatricesWeightsKind)}_preActivate(){}_preActivateForIntermediateRendering(e){}_activate(e,t){return this._renderId=e,!0}_postActivate(){}_freeze(){}_unFreeze(){}getWorldMatrix(){return this._masterMesh&&this.billboardMode===h.Y.BILLBOARDMODE_NONE?this._masterMesh.getWorldMatrix():super.getWorldMatrix()}_getWorldMatrixDeterminant(){return this._masterMesh?this._masterMesh._getWorldMatrixDeterminant():super._getWorldMatrixDeterminant()}get isAnInstance(){return!1}get hasInstances(){return!1}get hasThinInstances(){return!1}movePOV(e,t,i){return this.position.addInPlace(this.calcMovePOV(e,t,i)),this}calcMovePOV(e,t,i){const n=new r.y3;(this.rotationQuaternion?this.rotationQuaternion:r._f.RotationYawPitchRoll(this.rotation.y,this.rotation.x,this.rotation.z)).toRotationMatrix(n);const s=r.P.Zero(),o=this.definedFacingForward?-1:1;return r.P.TransformCoordinatesFromFloatsToRef(e*o,t,i*o,n,s),s}rotatePOV(e,t,i){return this.rotation.addInPlace(this.calcRotatePOV(e,t,i)),this}calcRotatePOV(e,t,i){const n=this.definedFacingForward?1:-1;return new r.P(e*n,t,i*n)}refreshBoundingInfo(e=!1,t=!1){return this._boundingInfo&&this._boundingInfo.isLocked||this._refreshBoundingInfo(this._getPositionData(e,t),null),this}_refreshBoundingInfo(e,t){if(e){const i=(0,_.k)(e,0,this.getTotalVertices(),t);this._boundingInfo?this._boundingInfo.reConstruct(i.minimum,i.maximum):this._boundingInfo=new u.j(i.minimum,i.maximum)}if(this.subMeshes)for(let t=0;t<this.subMeshes.length;t++)this.subMeshes[t].refreshBoundingInfo(e);this._updateBoundingInfo()}_getData(e=!1,t=!1,i,n=a.o.PositionKind){if((i=null!=i?i:this.getVerticesData(n).slice())&&t&&this.morphTargetManager){let e=0,t=0;for(let s=0;s<i.length;s++){for(let e=0;e<this.morphTargetManager.numTargets;e++){const t=this.morphTargetManager.getTarget(e),n=t.influence;if(n>0){const e=t.getPositions();e&&(i[s]+=(e[s]-i[s])*n)}}if(e++,n===a.o.PositionKind&&this._positions&&3===e){e=0;const n=3*t;this._positions[t++].copyFromFloats(i[n],i[n+1],i[n+2])}}}if(i&&e&&this.skeleton){const e=this.getVerticesData(a.o.MatricesIndicesKind),t=this.getVerticesData(a.o.MatricesWeightsKind);if(t&&e){const s=this.numBoneInfluencers>4,o=s?this.getVerticesData(a.o.MatricesIndicesExtraKind):null,l=s?this.getVerticesData(a.o.MatricesWeightsExtraKind):null,h=this.skeleton.getTransformMatrices(this),c=r.jp.Vector3[0],u=r.jp.Matrix[0],d=r.jp.Matrix[1];let p=0;for(let f=0;f<i.length;f+=3,p+=4){let _,m;for(u.reset(),_=0;_<4;_++)m=t[p+_],m>0&&(r.y3.FromFloat32ArrayToRefScaled(h,Math.floor(16*e[p+_]),m,d),u.addToSelf(d));if(s)for(_=0;_<4;_++)m=l[p+_],m>0&&(r.y3.FromFloat32ArrayToRefScaled(h,Math.floor(16*o[p+_]),m,d),u.addToSelf(d));n===a.o.NormalKind?r.P.TransformNormalFromFloatsToRef(i[f],i[f+1],i[f+2],u,c):r.P.TransformCoordinatesFromFloatsToRef(i[f],i[f+1],i[f+2],u,c),c.toArray(i,f),n===a.o.PositionKind&&this._positions&&this._positions[f/3].copyFrom(c)}}}return i}getNormalsData(e=!1,t=!1){return this._getData(e,t,null,a.o.NormalKind)}getPositionData(e=!1,t=!1,i){return this._getData(e,t,i,a.o.PositionKind)}_getPositionData(e,t){var i;let n=this.getVerticesData(a.o.PositionKind);if(this._internalAbstractMeshDataInfo._positions&&(this._internalAbstractMeshDataInfo._positions=null),n&&(e&&this.skeleton||t&&this.morphTargetManager)){if(n=n.slice(),this._generatePointsArray(),this._positions){const e=this._positions;this._internalAbstractMeshDataInfo._positions=new Array(e.length);for(let t=0;t<e.length;t++)this._internalAbstractMeshDataInfo._positions[t]=(null===(i=e[t])||void 0===i?void 0:i.clone())||new r.P}return this.getPositionData(e,t,n)}return n}_updateBoundingInfo(){return this._boundingInfo?this._boundingInfo.update(this.worldMatrixFromCache):this._boundingInfo=new u.j(r.P.Zero(),r.P.Zero(),this.worldMatrixFromCache),this._updateSubMeshesBoundingInfo(this.worldMatrixFromCache),this}_updateSubMeshesBoundingInfo(e){if(!this.subMeshes)return this;const t=this.subMeshes.length;for(let i=0;i<t;i++){const n=this.subMeshes[i];(t>1||!n.IsGlobal)&&n.updateBoundingInfo(e)}return this}_afterComputeWorldMatrix(){this.doNotSyncBoundingInfo||(this._boundingInfoIsDirty=!0)}isInFrustum(e){return this.getBoundingInfo().isInFrustum(e,this.cullingStrategy)}isCompletelyInFrustum(e){return this.getBoundingInfo().isCompletelyInFrustum(e)}intersectsMesh(e,t=!1,i){const n=this.getBoundingInfo(),s=e.getBoundingInfo();if(n.intersects(s,t))return!0;if(i)for(const i of this.getChildMeshes())if(i.intersectsMesh(e,t,!0))return!0;return!1}intersectsPoint(e){return this.getBoundingInfo().intersectsPoint(e)}get checkCollisions(){return this._internalAbstractMeshDataInfo._meshCollisionData._checkCollisions}set checkCollisions(e){this._internalAbstractMeshDataInfo._meshCollisionData._checkCollisions=e}get collider(){return this._internalAbstractMeshDataInfo._meshCollisionData._collider}moveWithCollisions(e){this.getAbsolutePosition().addToRef(this.ellipsoidOffset,this._internalAbstractMeshDataInfo._meshCollisionData._oldPositionForCollisions);const t=this.getScene().collisionCoordinator;return this._internalAbstractMeshDataInfo._meshCollisionData._collider||(this._internalAbstractMeshDataInfo._meshCollisionData._collider=t.createCollider()),this._internalAbstractMeshDataInfo._meshCollisionData._collider._radius=this.ellipsoid,t.getNewPosition(this._internalAbstractMeshDataInfo._meshCollisionData._oldPositionForCollisions,e,this._internalAbstractMeshDataInfo._meshCollisionData._collider,this.collisionRetryCount,this,this._onCollisionPositionChange,this.uniqueId),this}_collideForSubMesh(e,t,i){var n;if(this._generatePointsArray(),!this._positions)return this;if(!e._lastColliderWorldVertices||!e._lastColliderTransformMatrix.equals(t)){e._lastColliderTransformMatrix=t.clone(),e._lastColliderWorldVertices=[],e._trianglePlanes=[];const i=e.verticesStart,n=e.verticesStart+e.verticesCount;for(let s=i;s<n;s++)e._lastColliderWorldVertices.push(r.P.TransformCoordinates(this._positions[s],t))}return i._collide(e._trianglePlanes,e._lastColliderWorldVertices,this.getIndices(),e.indexStart,e.indexStart+e.indexCount,e.verticesStart,!!e.getMaterial(),this,this._shouldConvertRHS(),7===(null===(n=e.getMaterial())||void 0===n?void 0:n.fillMode)),this}_processCollisionsForSubMeshes(e,t){const i=this._scene.getCollidingSubMeshCandidates(this,e),n=i.length;for(let s=0;s<n;s++){const r=i.data[s];n>1&&!r._checkCollision(e)||this._collideForSubMesh(r,t,e)}return this}_shouldConvertRHS(){return!1}_checkCollision(e){if(!this.getBoundingInfo()._checkCollision(e))return this;const t=r.jp.Matrix[0],i=r.jp.Matrix[1];return r.y3.ScalingToRef(1/e._radius.x,1/e._radius.y,1/e._radius.z,t),this.worldMatrixFromCache.multiplyToRef(t,i),this._processCollisionsForSubMeshes(e,i),this}_generatePointsArray(){return!1}intersects(e,t,i,n=!1,s,o=!1){const a=new c.p,l="InstancedLinesMesh"===this.getClassName()||"LinesMesh"===this.getClassName()?this.intersectionThreshold:0,h=this.getBoundingInfo();if(!this.subMeshes)return a;if(!(o||e.intersectsSphere(h.boundingSphere,l)&&e.intersectsBox(h.boundingBox,l)))return a;if(n)return a.hit=!o,a.pickedMesh=o?null:this,a.distance=o?0:r.P.Distance(e.origin,h.boundingSphere.center),a.subMeshId=0,a;if(!this._generatePointsArray())return a;let u=null;const d=this._scene.getIntersectingSubMeshCandidates(this,e),p=d.length;let f=!1;for(let e=0;e<p;e++){const t=d.data[e].getMaterial();if(t&&(7==t.fillMode||0==t.fillMode||1==t.fillMode||2==t.fillMode||4==t.fillMode)){f=!0;break}}if(!f)return a.hit=!0,a.pickedMesh=this,a.distance=r.P.Distance(e.origin,h.boundingSphere.center),a.subMeshId=-1,a;for(let n=0;n<p;n++){const s=d.data[n];if(p>1&&!s.canIntersects(e))continue;const r=s.intersects(e,this._positions,this.getIndices(),t,i);if(r&&(t||!u||r.distance<u.distance)&&(u=r,u.subMeshId=n,t))break}if(u){const t=null!=s?s:this.getWorldMatrix(),i=r.jp.Vector3[0],n=r.jp.Vector3[1];r.P.TransformCoordinatesToRef(e.origin,t,i),e.direction.scaleToRef(u.distance,n);const o=r.P.TransformNormal(n,t).addInPlace(i);return a.hit=!0,a.distance=r.P.Distance(i,o),a.pickedPoint=o,a.pickedMesh=this,a.bu=u.bu||0,a.bv=u.bv||0,a.subMeshFaceId=u.faceId,a.faceId=u.faceId+d.data[u.subMeshId].indexStart/(-1!==this.getClassName().indexOf("LinesMesh")?2:3),a.subMeshId=u.subMeshId,a}return a}clone(e,t,i){return null}releaseSubMeshes(){if(this.subMeshes)for(;this.subMeshes.length;)this.subMeshes[0].dispose();else this.subMeshes=new Array;return this}dispose(e,t=!1){let i;for(this._scene.useMaterialMeshMap&&this._internalAbstractMeshDataInfo._material&&this._internalAbstractMeshDataInfo._material.meshMap&&(this._internalAbstractMeshDataInfo._material.meshMap[this.uniqueId]=void 0),this.getScene().freeActiveMeshes(),this.getScene().freeRenderingGroups(),void 0!==this.actionManager&&null!==this.actionManager&&(this.actionManager.dispose(),this.actionManager=null),this._internalAbstractMeshDataInfo._skeleton=null,this._transformMatrixTexture&&(this._transformMatrixTexture.dispose(),this._transformMatrixTexture=null),i=0;i<this._intersectionsInProgress.length;i++){const e=this._intersectionsInProgress[i],t=e._intersectionsInProgress.indexOf(this);e._intersectionsInProgress.splice(t,1)}this._intersectionsInProgress.length=0,this.getScene().lights.forEach((e=>{let t=e.includedOnlyMeshes.indexOf(this);-1!==t&&e.includedOnlyMeshes.splice(t,1),t=e.excludedMeshes.indexOf(this),-1!==t&&e.excludedMeshes.splice(t,1);const i=e.getShadowGenerators();if(i){const e=i.values();for(let i=e.next();!0!==i.done;i=e.next()){const e=i.value.getShadowMap();e&&e.renderList&&(t=e.renderList.indexOf(this),-1!==t&&e.renderList.splice(t,1))}}})),"InstancedMesh"===this.getClassName()&&"InstancedLinesMesh"===this.getClassName()||this.releaseSubMeshes();const n=this.getScene().getEngine();if(null!==this._occlusionQuery&&(this.isOcclusionQueryInProgress=!1,n.deleteQuery(this._occlusionQuery),this._occlusionQuery=null),n.wipeCaches(),this.getScene().removeMesh(this),this._parentContainer){const e=this._parentContainer.meshes.indexOf(this);e>-1&&this._parentContainer.meshes.splice(e,1),this._parentContainer=null}if(t&&this.material&&("MultiMaterial"===this.material.getClassName()?this.material.dispose(!1,!0,!0):this.material.dispose(!1,!0)),!e)for(i=0;i<this.getScene().particleSystems.length;i++)this.getScene().particleSystems[i].emitter===this&&(this.getScene().particleSystems[i].dispose(),i--);this._internalAbstractMeshDataInfo._facetData.facetDataEnabled&&this.disableFacetData(),this._uniformBuffer.dispose(),this.onAfterWorldMatrixUpdateObservable.clear(),this.onCollideObservable.clear(),this.onCollisionPositionChangeObservable.clear(),this.onRebuildObservable.clear(),super.dispose(e,t)}addChild(e,t=!1){return e.setParent(this,t),this}removeChild(e,t=!1){return e.setParent(null,t),this}_initFacetData(){const e=this._internalAbstractMeshDataInfo._facetData;e.facetNormals||(e.facetNormals=new Array),e.facetPositions||(e.facetPositions=new Array),e.facetPartitioning||(e.facetPartitioning=new Array),e.facetNb=this.getIndices().length/3|0,e.partitioningSubdivisions=e.partitioningSubdivisions?e.partitioningSubdivisions:10,e.partitioningBBoxRatio=e.partitioningBBoxRatio?e.partitioningBBoxRatio:1.01;for(let t=0;t<e.facetNb;t++)e.facetNormals[t]=r.P.Zero(),e.facetPositions[t]=r.P.Zero();return e.facetDataEnabled=!0,this}updateFacetData(){const e=this._internalAbstractMeshDataInfo._facetData;e.facetDataEnabled||this._initFacetData();const t=this.getVerticesData(a.o.PositionKind),i=this.getIndices(),n=this.getVerticesData(a.o.NormalKind),s=this.getBoundingInfo();if(e.facetDepthSort&&!e.facetDepthSortEnabled){if(e.facetDepthSortEnabled=!0,i instanceof Uint16Array)e.depthSortedIndices=new Uint16Array(i);else if(i instanceof Uint32Array)e.depthSortedIndices=new Uint32Array(i);else{let t=!1;for(let e=0;e<i.length;e++)if(i[e]>65535){t=!0;break}e.depthSortedIndices=t?new Uint32Array(i):new Uint16Array(i)}if(e.facetDepthSortFunction=function(e,t){return t.sqDistance-e.sqDistance},!e.facetDepthSortFrom){const t=this.getScene().activeCamera;e.facetDepthSortFrom=t?t.position:r.P.Zero()}e.depthSortedFacets=[];for(let t=0;t<e.facetNb;t++){const i={ind:3*t,sqDistance:0};e.depthSortedFacets.push(i)}e.invertedMatrix=r.y3.Identity(),e.facetDepthSortOrigin=r.P.Zero()}e.bbSize.x=s.maximum.x-s.minimum.x>g.kn?s.maximum.x-s.minimum.x:g.kn,e.bbSize.y=s.maximum.y-s.minimum.y>g.kn?s.maximum.y-s.minimum.y:g.kn,e.bbSize.z=s.maximum.z-s.minimum.z>g.kn?s.maximum.z-s.minimum.z:g.kn;let o=e.bbSize.x>e.bbSize.y?e.bbSize.x:e.bbSize.y;if(o=o>e.bbSize.z?o:e.bbSize.z,e.subDiv.max=e.partitioningSubdivisions,e.subDiv.X=Math.floor(e.subDiv.max*e.bbSize.x/o),e.subDiv.Y=Math.floor(e.subDiv.max*e.bbSize.y/o),e.subDiv.Z=Math.floor(e.subDiv.max*e.bbSize.z/o),e.subDiv.X=e.subDiv.X<1?1:e.subDiv.X,e.subDiv.Y=e.subDiv.Y<1?1:e.subDiv.Y,e.subDiv.Z=e.subDiv.Z<1?1:e.subDiv.Z,e.facetParameters.facetNormals=this.getFacetLocalNormals(),e.facetParameters.facetPositions=this.getFacetLocalPositions(),e.facetParameters.facetPartitioning=this.getFacetLocalPartitioning(),e.facetParameters.bInfo=s,e.facetParameters.bbSize=e.bbSize,e.facetParameters.subDiv=e.subDiv,e.facetParameters.ratio=this.partitioningBBoxRatio,e.facetParameters.depthSort=e.facetDepthSort,e.facetDepthSort&&e.facetDepthSortEnabled&&(this.computeWorldMatrix(!0),this._worldMatrix.invertToRef(e.invertedMatrix),r.P.TransformCoordinatesToRef(e.facetDepthSortFrom,e.invertedMatrix,e.facetDepthSortOrigin),e.facetParameters.distanceTo=e.facetDepthSortOrigin),e.facetParameters.depthSortedFacets=e.depthSortedFacets,n&&l.x.ComputeNormals(t,i,n,e.facetParameters),e.facetDepthSort&&e.facetDepthSortEnabled){e.depthSortedFacets.sort(e.facetDepthSortFunction);const t=e.depthSortedIndices.length/3|0;for(let n=0;n<t;n++){const t=e.depthSortedFacets[n].ind;e.depthSortedIndices[3*n]=i[t],e.depthSortedIndices[3*n+1]=i[t+1],e.depthSortedIndices[3*n+2]=i[t+2]}this.updateIndices(e.depthSortedIndices,void 0,!0)}return this}getFacetLocalNormals(){const e=this._internalAbstractMeshDataInfo._facetData;return e.facetNormals||this.updateFacetData(),e.facetNormals}getFacetLocalPositions(){const e=this._internalAbstractMeshDataInfo._facetData;return e.facetPositions||this.updateFacetData(),e.facetPositions}getFacetLocalPartitioning(){const e=this._internalAbstractMeshDataInfo._facetData;return e.facetPartitioning||this.updateFacetData(),e.facetPartitioning}getFacetPosition(e){const t=r.P.Zero();return this.getFacetPositionToRef(e,t),t}getFacetPositionToRef(e,t){const i=this.getFacetLocalPositions()[e],n=this.getWorldMatrix();return r.P.TransformCoordinatesToRef(i,n,t),this}getFacetNormal(e){const t=r.P.Zero();return this.getFacetNormalToRef(e,t),t}getFacetNormalToRef(e,t){const i=this.getFacetLocalNormals()[e];return r.P.TransformNormalToRef(i,this.getWorldMatrix(),t),this}getFacetsAtLocalCoordinates(e,t,i){const n=this.getBoundingInfo(),s=this._internalAbstractMeshDataInfo._facetData,r=Math.floor((e-n.minimum.x*s.partitioningBBoxRatio)*s.subDiv.X*s.partitioningBBoxRatio/s.bbSize.x),o=Math.floor((t-n.minimum.y*s.partitioningBBoxRatio)*s.subDiv.Y*s.partitioningBBoxRatio/s.bbSize.y),a=Math.floor((i-n.minimum.z*s.partitioningBBoxRatio)*s.subDiv.Z*s.partitioningBBoxRatio/s.bbSize.z);return r<0||r>s.subDiv.max||o<0||o>s.subDiv.max||a<0||a>s.subDiv.max?null:s.facetPartitioning[r+s.subDiv.max*o+s.subDiv.max*s.subDiv.max*a]}getClosestFacetAtCoordinates(e,t,i,n,s=!1,o=!0){const a=this.getWorldMatrix(),l=r.jp.Matrix[5];a.invertToRef(l);const h=r.jp.Vector3[8];r.P.TransformCoordinatesFromFloatsToRef(e,t,i,l,h);const c=this.getClosestFacetAtLocalCoordinates(h.x,h.y,h.z,n,s,o);return n&&r.P.TransformCoordinatesFromFloatsToRef(n.x,n.y,n.z,a,n),c}getClosestFacetAtLocalCoordinates(e,t,i,n,s=!1,r=!0){let o=null,a=0,l=0,h=0,c=0,u=0,d=0,p=0,f=0;const _=this.getFacetLocalPositions(),m=this.getFacetLocalNormals(),g=this.getFacetsAtLocalCoordinates(e,t,i);if(!g)return null;let v,y,x,b=Number.MAX_VALUE,T=b;for(let S=0;S<g.length;S++)v=g[S],y=m[v],x=_[v],c=(e-x.x)*y.x+(t-x.y)*y.y+(i-x.z)*y.z,(!s||s&&r&&c>=0||s&&!r&&c<=0)&&(c=y.x*x.x+y.y*x.y+y.z*x.z,u=-(y.x*e+y.y*t+y.z*i-c)/(y.x*y.x+y.y*y.y+y.z*y.z),d=e+y.x*u,p=t+y.y*u,f=i+y.z*u,a=d-e,l=p-t,h=f-i,T=a*a+l*l+h*h,T<b&&(b=T,o=v,n&&(n.x=d,n.y=p,n.z=f)));return o}getFacetDataParameters(){return this._internalAbstractMeshDataInfo._facetData.facetParameters}disableFacetData(){const e=this._internalAbstractMeshDataInfo._facetData;return e.facetDataEnabled&&(e.facetDataEnabled=!1,e.facetPositions=new Array,e.facetNormals=new Array,e.facetPartitioning=new Array,e.facetParameters=null,e.depthSortedIndices=new Uint32Array(0)),this}updateIndices(e,t,i=!1){return this}createNormals(e){const t=this.getVerticesData(a.o.PositionKind),i=this.getIndices();let n;return n=this.isVerticesDataPresent(a.o.NormalKind)?this.getVerticesData(a.o.NormalKind):[],l.x.ComputeNormals(t,i,n,{useRightHandedSystem:this.getScene().useRightHandedSystem}),this.setVerticesData(a.o.NormalKind,n,e),this}alignWithNormal(e,t){t||(t=v.RD.Y);const i=r.jp.Vector3[0],n=r.jp.Vector3[1];return r.P.CrossToRef(t,e,n),r.P.CrossToRef(e,n,i),this.rotationQuaternion?r._f.RotationQuaternionFromAxisToRef(i,e,n,this.rotationQuaternion):r.P.RotationFromAxisToRef(i,e,n,this.rotation),this}_checkOcclusionQuery(){return!1}disableEdgesRendering(){throw(0,f.S)("EdgesRenderer")}enableEdgesRendering(e,t,i){throw(0,f.S)("EdgesRenderer")}getConnectedParticleSystems(){return this._scene.particleSystems.filter((e=>e.emitter===this))}}T.OCCLUSION_TYPE_NONE=0,T.OCCLUSION_TYPE_OPTIMISTIC=1,T.OCCLUSION_TYPE_STRICT=2,T.OCCLUSION_ALGORITHM_TYPE_ACCURATE=0,T.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE=1,T.CULLINGSTRATEGY_STANDARD=0,T.CULLINGSTRATEGY_BOUNDINGSPHERE_ONLY=1,T.CULLINGSTRATEGY_OPTIMISTIC_INCLUSION=2,T.CULLINGSTRATEGY_OPTIMISTIC_INCLUSION_THEN_BSPHERE_ONLY=3,(0,y.H)("BABYLON.AbstractMesh",T)},7321:(e,t,i)=>{i.d(t,{Z:()=>_});var n=i(4141),s=i(4649),r=i(2101),o=i(708),a=i(9401),l=i(1376),h=i(3722),c=i(7257),u=i(4875),d=i(1372),p=i(1431),f=i(4892);class _{get boundingBias(){return this._boundingBias}set boundingBias(e){this._boundingBias?this._boundingBias.copyFrom(e):this._boundingBias=e.clone(),this._updateBoundingInfo(!0,null)}static CreateGeometryForMesh(e){const t=new _(_.RandomId(),e.getScene());return t.applyToMesh(e),t}get meshes(){return this._meshes}constructor(e,t,i,n=!1,s=null){this.delayLoadState=0,this._totalVertices=0,this._isDisposed=!1,this._indexBufferIsUpdatable=!1,this._positionsCache=[],this._parentContainer=null,this.useBoundingInfoFromGeometry=!1,this._scene=t||p.l.LastCreatedScene,this._scene&&(this.id=e,this.uniqueId=this._scene.getUniqueId(),this._engine=this._scene.getEngine(),this._meshes=[],this._vertexBuffers={},this._indices=[],this._updatable=n,i?this.setAllVerticesData(i,n):this._totalVertices=0,this._engine.getCaps().vertexArrayObject&&(this._vertexArrayObjects={}),s&&(this.applyToMesh(s),s.computeWorldMatrix(!0)))}get extend(){return this._extend}getScene(){return this._scene}getEngine(){return this._engine}isReady(){return 1===this.delayLoadState||0===this.delayLoadState}get doNotSerialize(){for(let e=0;e<this._meshes.length;e++)if(!this._meshes[e].doNotSerialize)return!1;return!0}_rebuild(){this._vertexArrayObjects&&(this._vertexArrayObjects={}),0!==this._meshes.length&&this._indices&&(this._indexBuffer=this._engine.createIndexBuffer(this._indices,this._updatable));for(const e in this._vertexBuffers)this._vertexBuffers[e]._rebuild()}setAllVerticesData(e,t){e.applyToGeometry(this,t),this._notifyUpdate()}setVerticesData(e,t,i=!1,n){i&&Array.isArray(t)&&(t=new Float32Array(t));const s=new o.o(this._engine,t,e,i,0===this._meshes.length,n);this.setVerticesBuffer(s)}removeVerticesData(e){this._vertexBuffers[e]&&(this._vertexBuffers[e].dispose(),delete this._vertexBuffers[e]),this._vertexArrayObjects&&this._disposeVertexArrayObjects()}setVerticesBuffer(e,t=null,i=!0){const n=e.getKind();this._vertexBuffers[n]&&i&&this._vertexBuffers[n].dispose(),e._buffer&&e._buffer._increaseReferences(),this._vertexBuffers[n]=e;const s=this._meshes,r=s.length;if(n===o.o.PositionKind){const i=e.getData();null!=t?this._totalVertices=t:null!=i&&(this._totalVertices=i.length/(e.type===o.o.BYTE?e.byteStride:e.byteStride/4)),this._updateExtend(i),this._resetPointsArrayCache();for(let e=0;e<r;e++){const t=s[e];t.buildBoundingInfo(this._extend.minimum,this._extend.maximum),t._createGlobalSubMesh(t.isUnIndexed),t.computeWorldMatrix(!0),t.synchronizeInstances()}}this._notifyUpdate(n)}updateVerticesDataDirectly(e,t,i,n=!1){const s=this.getVertexBuffer(e);s&&(s.updateDirectly(t,i,n),this._notifyUpdate(e))}updateVerticesData(e,t,i=!1){const n=this.getVertexBuffer(e);n&&(n.update(t),e===o.o.PositionKind&&this._updateBoundingInfo(i,t),this._notifyUpdate(e))}_updateBoundingInfo(e,t){if(e&&this._updateExtend(t),this._resetPointsArrayCache(),e){const e=this._meshes;for(const t of e){t.hasBoundingInfo?t.getBoundingInfo().reConstruct(this._extend.minimum,this._extend.maximum):t.buildBoundingInfo(this._extend.minimum,this._extend.maximum);const e=t.subMeshes;for(const t of e)t.refreshBoundingInfo()}}}_bind(e,t,i,n){if(!e)return;void 0===t&&(t=this._indexBuffer);const s=this.getVertexBuffers();if(!s)return;if(t!=this._indexBuffer||!this._vertexArrayObjects&&!n)return void this._engine.bindBuffers(s,t,e,i);const r=n||this._vertexArrayObjects;r[e.key]||(r[e.key]=this._engine.recordVertexArrayObject(s,t,e,i)),this._engine.bindVertexArrayObject(r[e.key],t)}getTotalVertices(){return this.isReady()?this._totalVertices:0}getVerticesData(e,t,i){const n=this.getVertexBuffer(e);return n?n.getFloatData(this._totalVertices,i||t&&1!==this._meshes.length):null}isVertexBufferUpdatable(e){const t=this._vertexBuffers[e];return!!t&&t.isUpdatable()}getVertexBuffer(e){return this.isReady()?this._vertexBuffers[e]:null}getVertexBuffers(){return this.isReady()?this._vertexBuffers:null}isVerticesDataPresent(e){return this._vertexBuffers?void 0!==this._vertexBuffers[e]:!!this._delayInfo&&-1!==this._delayInfo.indexOf(e)}getVerticesDataKinds(){const e=[];let t;if(!this._vertexBuffers&&this._delayInfo)for(t in this._delayInfo)e.push(t);else for(t in this._vertexBuffers)e.push(t);return e}updateIndices(e,t,i=!1){if(this._indexBuffer)if(this._indexBufferIsUpdatable){const n=e.length!==this._indices.length;if(i||(this._indices=e.slice()),this._engine.updateDynamicIndexBuffer(this._indexBuffer,e,t),n)for(const e of this._meshes)e._createGlobalSubMesh(!0)}else this.setIndices(e,null,!0)}setIndices(e,t=null,i=!1){this._indexBuffer&&this._engine._releaseBuffer(this._indexBuffer),this._indices=e,this._indexBufferIsUpdatable=i,0!==this._meshes.length&&this._indices&&(this._indexBuffer=this._engine.createIndexBuffer(this._indices,i)),null!=t&&(this._totalVertices=t);for(const e of this._meshes)e._createGlobalSubMesh(!0),e.synchronizeInstances();this._notifyUpdate()}getTotalIndices(){return this.isReady()?this._indices.length:0}getIndices(e,t){if(!this.isReady())return null;const i=this._indices;return t||e&&1!==this._meshes.length?i.slice():i}getIndexBuffer(){return this.isReady()?this._indexBuffer:null}_releaseVertexArrayObject(e=null){e&&this._vertexArrayObjects&&this._vertexArrayObjects[e.key]&&(this._engine.releaseVertexArrayObject(this._vertexArrayObjects[e.key]),delete this._vertexArrayObjects[e.key])}releaseForMesh(e,t){const i=this._meshes,n=i.indexOf(e);-1!==n&&(i.splice(n,1),this._vertexArrayObjects&&e._invalidateInstanceVertexArrayObject(),e._geometry=null,0===i.length&&t&&this.dispose())}applyToMesh(e){if(e._geometry===this)return;const t=e._geometry;t&&t.releaseForMesh(e),this._vertexArrayObjects&&e._invalidateInstanceVertexArrayObject();const i=this._meshes;e._geometry=this,e._internalAbstractMeshDataInfo._positions=null,this._scene.pushGeometry(this),i.push(e),this.isReady()?this._applyToMesh(e):this._boundingInfo&&e.setBoundingInfo(this._boundingInfo)}_updateExtend(e=null){if(this.useBoundingInfoFromGeometry&&this._boundingInfo)this._extend={minimum:this._boundingInfo.minimum.clone(),maximum:this._boundingInfo.maximum.clone()};else{if(!e&&!(e=this.getVerticesData(o.o.PositionKind)))return;this._extend=(0,d.k)(e,0,this._totalVertices,this.boundingBias,3)}}_applyToMesh(e){const t=this._meshes.length;for(const i in this._vertexBuffers)1===t&&this._vertexBuffers[i].create(),i===o.o.PositionKind&&(this._extend||this._updateExtend(),e.buildBoundingInfo(this._extend.minimum,this._extend.maximum),e._createGlobalSubMesh(e.isUnIndexed),e._updateBoundingInfo());1===t&&this._indices&&this._indices.length>0&&(this._indexBuffer=this._engine.createIndexBuffer(this._indices,this._updatable)),e._syncGeometryWithMorphTargetManager(),e.synchronizeInstances()}_notifyUpdate(e){this.onGeometryUpdated&&this.onGeometryUpdated(this,e),this._vertexArrayObjects&&this._disposeVertexArrayObjects();for(const e of this._meshes)e._markSubMeshesAsAttributesDirty()}load(e,t){2!==this.delayLoadState&&(this.isReady()?t&&t():(this.delayLoadState=2,this._queueLoad(e,t)))}_queueLoad(e,t){this.delayLoadingFile&&(e.addPendingData(this),e._loadFile(this.delayLoadingFile,(i=>{if(!this._delayLoadingFunction)return;this._delayLoadingFunction(JSON.parse(i),this),this.delayLoadState=1,this._delayInfo=[],e.removePendingData(this);const n=this._meshes,s=n.length;for(let e=0;e<s;e++)this._applyToMesh(n[e]);t&&t()}),void 0,!0))}toLeftHanded(){const e=this.getIndices(!1);if(null!=e&&e.length>0){for(let t=0;t<e.length;t+=3){const i=e[t+0];e[t+0]=e[t+2],e[t+2]=i}this.setIndices(e)}const t=this.getVerticesData(o.o.PositionKind,!1);if(null!=t&&t.length>0){for(let e=0;e<t.length;e+=3)t[e+2]=-t[e+2];this.setVerticesData(o.o.PositionKind,t,!1)}const i=this.getVerticesData(o.o.NormalKind,!1);if(null!=i&&i.length>0){for(let e=0;e<i.length;e+=3)i[e+2]=-i[e+2];this.setVerticesData(o.o.NormalKind,i,!1)}}_resetPointsArrayCache(){this._positions=null}_generatePointsArray(){if(this._positions)return!0;const e=this.getVerticesData(o.o.PositionKind);if(!e||0===e.length)return!1;for(let t=3*this._positionsCache.length,i=this._positionsCache.length;t<e.length;t+=3,++i)this._positionsCache[i]=n.P.FromArray(e,t);for(let t=0,i=0;t<e.length;t+=3,++i)this._positionsCache[i].set(e[0+t],e[1+t],e[2+t]);return this._positionsCache.length=e.length/3,this._positions=this._positionsCache,!0}isDisposed(){return this._isDisposed}_disposeVertexArrayObjects(){if(this._vertexArrayObjects){for(const e in this._vertexArrayObjects)this._engine.releaseVertexArrayObject(this._vertexArrayObjects[e]);this._vertexArrayObjects={};const e=this._meshes,t=e.length;for(let i=0;i<t;i++)e[i]._invalidateInstanceVertexArrayObject()}}dispose(){const e=this._meshes,t=e.length;let i;for(i=0;i<t;i++)this.releaseForMesh(e[i]);this._meshes.length=0,this._disposeVertexArrayObjects();for(const e in this._vertexBuffers)this._vertexBuffers[e].dispose();if(this._vertexBuffers={},this._totalVertices=0,this._indexBuffer&&this._engine._releaseBuffer(this._indexBuffer),this._indexBuffer=null,this._indices=[],this.delayLoadState=0,this.delayLoadingFile=null,this._delayLoadingFunction=null,this._delayInfo=[],this._boundingInfo=null,this._scene.removeGeometry(this),this._parentContainer){const e=this._parentContainer.geometries.indexOf(this);e>-1&&this._parentContainer.geometries.splice(e,1),this._parentContainer=null}this._isDisposed=!0}copy(e){const t=new r.x;t.indices=[];const i=this.getIndices();if(i)for(let e=0;e<i.length;e++)t.indices.push(i[e]);let n,s=!1,o=!1;for(n in this._vertexBuffers){const e=this.getVerticesData(n);if(e&&(e instanceof Float32Array?t.set(new Float32Array(e),n):t.set(e.slice(0),n),!o)){const e=this.getVertexBuffer(n);e&&(s=e.isUpdatable(),o=!s)}}const a=new _(e,this._scene,t,s);for(n in a.delayLoadState=this.delayLoadState,a.delayLoadingFile=this.delayLoadingFile,a._delayLoadingFunction=this._delayLoadingFunction,this._delayInfo)a._delayInfo=a._delayInfo||[],a._delayInfo.push(n);return a._boundingInfo=new h.j(this._extend.minimum,this._extend.maximum),a}serialize(){const e={};return e.id=this.id,e.uniqueId=this.uniqueId,e.updatable=this._updatable,u.$&&u.$.HasTags(this)&&(e.tags=u.$.GetTags(this)),e}_toNumberArray(e){return Array.isArray(e)?e:Array.prototype.slice.call(e)}clearCachedData(){this._indices=[],this._resetPointsArrayCache();for(const e in this._vertexBuffers)Object.prototype.hasOwnProperty.call(this._vertexBuffers,e)&&(this._vertexBuffers[e]._buffer._data=null)}serializeVerticeData(){const e=this.serialize();return this.isVerticesDataPresent(o.o.PositionKind)&&(e.positions=this._toNumberArray(this.getVerticesData(o.o.PositionKind)),this.isVertexBufferUpdatable(o.o.PositionKind)&&(e.positions._updatable=!0)),this.isVerticesDataPresent(o.o.NormalKind)&&(e.normals=this._toNumberArray(this.getVerticesData(o.o.NormalKind)),this.isVertexBufferUpdatable(o.o.NormalKind)&&(e.normals._updatable=!0)),this.isVerticesDataPresent(o.o.TangentKind)&&(e.tangents=this._toNumberArray(this.getVerticesData(o.o.TangentKind)),this.isVertexBufferUpdatable(o.o.TangentKind)&&(e.tangents._updatable=!0)),this.isVerticesDataPresent(o.o.UVKind)&&(e.uvs=this._toNumberArray(this.getVerticesData(o.o.UVKind)),this.isVertexBufferUpdatable(o.o.UVKind)&&(e.uvs._updatable=!0)),this.isVerticesDataPresent(o.o.UV2Kind)&&(e.uv2s=this._toNumberArray(this.getVerticesData(o.o.UV2Kind)),this.isVertexBufferUpdatable(o.o.UV2Kind)&&(e.uv2s._updatable=!0)),this.isVerticesDataPresent(o.o.UV3Kind)&&(e.uv3s=this._toNumberArray(this.getVerticesData(o.o.UV3Kind)),this.isVertexBufferUpdatable(o.o.UV3Kind)&&(e.uv3s._updatable=!0)),this.isVerticesDataPresent(o.o.UV4Kind)&&(e.uv4s=this._toNumberArray(this.getVerticesData(o.o.UV4Kind)),this.isVertexBufferUpdatable(o.o.UV4Kind)&&(e.uv4s._updatable=!0)),this.isVerticesDataPresent(o.o.UV5Kind)&&(e.uv5s=this._toNumberArray(this.getVerticesData(o.o.UV5Kind)),this.isVertexBufferUpdatable(o.o.UV5Kind)&&(e.uv5s._updatable=!0)),this.isVerticesDataPresent(o.o.UV6Kind)&&(e.uv6s=this._toNumberArray(this.getVerticesData(o.o.UV6Kind)),this.isVertexBufferUpdatable(o.o.UV6Kind)&&(e.uv6s._updatable=!0)),this.isVerticesDataPresent(o.o.ColorKind)&&(e.colors=this._toNumberArray(this.getVerticesData(o.o.ColorKind)),this.isVertexBufferUpdatable(o.o.ColorKind)&&(e.colors._updatable=!0)),this.isVerticesDataPresent(o.o.MatricesIndicesKind)&&(e.matricesIndices=this._toNumberArray(this.getVerticesData(o.o.MatricesIndicesKind)),e.matricesIndices._isExpanded=!0,this.isVertexBufferUpdatable(o.o.MatricesIndicesKind)&&(e.matricesIndices._updatable=!0)),this.isVerticesDataPresent(o.o.MatricesWeightsKind)&&(e.matricesWeights=this._toNumberArray(this.getVerticesData(o.o.MatricesWeightsKind)),this.isVertexBufferUpdatable(o.o.MatricesWeightsKind)&&(e.matricesWeights._updatable=!0)),e.indices=this._toNumberArray(this.getIndices()),e}static ExtractFromMesh(e,t){const i=e._geometry;return i?i.copy(t):null}static RandomId(){return c.w1.RandomId()}static _GetGeometryByLoadedUniqueId(e,t){for(let i=0;i<t.geometries.length;i++)if(t.geometries[i]._loadedUniqueId===e)return t.geometries[i];return null}static _ImportGeometry(e,t){const i=t.getScene(),n=e.geometryUniqueId,r=e.geometryId;if(n||r){const e=n?this._GetGeometryByLoadedUniqueId(n,i):i.getGeometryById(r);e&&e.applyToMesh(t)}else if(e instanceof ArrayBuffer){const i=t._binaryInfo;if(i.positionsAttrDesc&&i.positionsAttrDesc.count>0){const n=new Float32Array(e,i.positionsAttrDesc.offset,i.positionsAttrDesc.count);t.setVerticesData(o.o.PositionKind,n,!1)}if(i.normalsAttrDesc&&i.normalsAttrDesc.count>0){const n=new Float32Array(e,i.normalsAttrDesc.offset,i.normalsAttrDesc.count);t.setVerticesData(o.o.NormalKind,n,!1)}if(i.tangetsAttrDesc&&i.tangetsAttrDesc.count>0){const n=new Float32Array(e,i.tangetsAttrDesc.offset,i.tangetsAttrDesc.count);t.setVerticesData(o.o.TangentKind,n,!1)}if(i.uvsAttrDesc&&i.uvsAttrDesc.count>0){const n=new Float32Array(e,i.uvsAttrDesc.offset,i.uvsAttrDesc.count);if(f.e.UseOpenGLOrientationForUV)for(let e=1;e<n.length;e+=2)n[e]=1-n[e];t.setVerticesData(o.o.UVKind,n,!1)}if(i.uvs2AttrDesc&&i.uvs2AttrDesc.count>0){const n=new Float32Array(e,i.uvs2AttrDesc.offset,i.uvs2AttrDesc.count);if(f.e.UseOpenGLOrientationForUV)for(let e=1;e<n.length;e+=2)n[e]=1-n[e];t.setVerticesData(o.o.UV2Kind,n,!1)}if(i.uvs3AttrDesc&&i.uvs3AttrDesc.count>0){const n=new Float32Array(e,i.uvs3AttrDesc.offset,i.uvs3AttrDesc.count);if(f.e.UseOpenGLOrientationForUV)for(let e=1;e<n.length;e+=2)n[e]=1-n[e];t.setVerticesData(o.o.UV3Kind,n,!1)}if(i.uvs4AttrDesc&&i.uvs4AttrDesc.count>0){const n=new Float32Array(e,i.uvs4AttrDesc.offset,i.uvs4AttrDesc.count);if(f.e.UseOpenGLOrientationForUV)for(let e=1;e<n.length;e+=2)n[e]=1-n[e];t.setVerticesData(o.o.UV4Kind,n,!1)}if(i.uvs5AttrDesc&&i.uvs5AttrDesc.count>0){const n=new Float32Array(e,i.uvs5AttrDesc.offset,i.uvs5AttrDesc.count);if(f.e.UseOpenGLOrientationForUV)for(let e=1;e<n.length;e+=2)n[e]=1-n[e];t.setVerticesData(o.o.UV5Kind,n,!1)}if(i.uvs6AttrDesc&&i.uvs6AttrDesc.count>0){const n=new Float32Array(e,i.uvs6AttrDesc.offset,i.uvs6AttrDesc.count);if(f.e.UseOpenGLOrientationForUV)for(let e=1;e<n.length;e+=2)n[e]=1-n[e];t.setVerticesData(o.o.UV6Kind,n,!1)}if(i.colorsAttrDesc&&i.colorsAttrDesc.count>0){const n=new Float32Array(e,i.colorsAttrDesc.offset,i.colorsAttrDesc.count);t.setVerticesData(o.o.ColorKind,n,!1,i.colorsAttrDesc.stride)}if(i.matricesIndicesAttrDesc&&i.matricesIndicesAttrDesc.count>0){const n=new Int32Array(e,i.matricesIndicesAttrDesc.offset,i.matricesIndicesAttrDesc.count),s=[];for(let e=0;e<n.length;e++){const t=n[e];s.push(255&t),s.push((65280&t)>>8),s.push((16711680&t)>>16),s.push(t>>24&255)}t.setVerticesData(o.o.MatricesIndicesKind,s,!1)}if(i.matricesIndicesExtraAttrDesc&&i.matricesIndicesExtraAttrDesc.count>0){const n=new Int32Array(e,i.matricesIndicesExtraAttrDesc.offset,i.matricesIndicesExtraAttrDesc.count),s=[];for(let e=0;e<n.length;e++){const t=n[e];s.push(255&t),s.push((65280&t)>>8),s.push((16711680&t)>>16),s.push(t>>24&255)}t.setVerticesData(o.o.MatricesIndicesExtraKind,s,!1)}if(i.matricesWeightsAttrDesc&&i.matricesWeightsAttrDesc.count>0){const n=new Float32Array(e,i.matricesWeightsAttrDesc.offset,i.matricesWeightsAttrDesc.count);t.setVerticesData(o.o.MatricesWeightsKind,n,!1)}if(i.indicesAttrDesc&&i.indicesAttrDesc.count>0){const n=new Int32Array(e,i.indicesAttrDesc.offset,i.indicesAttrDesc.count);t.setIndices(n,null)}if(i.subMeshesAttrDesc&&i.subMeshesAttrDesc.count>0){const n=new Int32Array(e,i.subMeshesAttrDesc.offset,5*i.subMeshesAttrDesc.count);t.subMeshes=[];for(let e=0;e<i.subMeshesAttrDesc.count;e++){const i=n[5*e+0],s=n[5*e+1],r=n[5*e+2],o=n[5*e+3],l=n[5*e+4];a.P.AddToMesh(i,s,r,o,l,t)}}}else if(e.positions&&e.normals&&e.indices){if(t.setVerticesData(o.o.PositionKind,e.positions,e.positions._updatable),t.setVerticesData(o.o.NormalKind,e.normals,e.normals._updatable),e.tangents&&t.setVerticesData(o.o.TangentKind,e.tangents,e.tangents._updatable),e.uvs&&t.setVerticesData(o.o.UVKind,e.uvs,e.uvs._updatable),e.uvs2&&t.setVerticesData(o.o.UV2Kind,e.uvs2,e.uvs2._updatable),e.uvs3&&t.setVerticesData(o.o.UV3Kind,e.uvs3,e.uvs3._updatable),e.uvs4&&t.setVerticesData(o.o.UV4Kind,e.uvs4,e.uvs4._updatable),e.uvs5&&t.setVerticesData(o.o.UV5Kind,e.uvs5,e.uvs5._updatable),e.uvs6&&t.setVerticesData(o.o.UV6Kind,e.uvs6,e.uvs6._updatable),e.colors&&t.setVerticesData(o.o.ColorKind,s.HE.CheckColors4(e.colors,e.positions.length/3),e.colors._updatable),e.matricesIndices)if(e.matricesIndices._isExpanded)delete e.matricesIndices._isExpanded,t.setVerticesData(o.o.MatricesIndicesKind,e.matricesIndices,e.matricesIndices._updatable);else{const i=[];for(let t=0;t<e.matricesIndices.length;t++){const n=e.matricesIndices[t];i.push(255&n),i.push((65280&n)>>8),i.push((16711680&n)>>16),i.push(n>>24&255)}t.setVerticesData(o.o.MatricesIndicesKind,i,e.matricesIndices._updatable)}if(e.matricesIndicesExtra)if(e.matricesIndicesExtra._isExpanded)delete e.matricesIndices._isExpanded,t.setVerticesData(o.o.MatricesIndicesExtraKind,e.matricesIndicesExtra,e.matricesIndicesExtra._updatable);else{const i=[];for(let t=0;t<e.matricesIndicesExtra.length;t++){const n=e.matricesIndicesExtra[t];i.push(255&n),i.push((65280&n)>>8),i.push((16711680&n)>>16),i.push(n>>24&255)}t.setVerticesData(o.o.MatricesIndicesExtraKind,i,e.matricesIndicesExtra._updatable)}e.matricesWeights&&(_._CleanMatricesWeights(e,t),t.setVerticesData(o.o.MatricesWeightsKind,e.matricesWeights,e.matricesWeights._updatable)),e.matricesWeightsExtra&&t.setVerticesData(o.o.MatricesWeightsExtraKind,e.matricesWeightsExtra,e.matricesWeights._updatable),t.setIndices(e.indices,null)}if(e.subMeshes){t.subMeshes=[];for(let i=0;i<e.subMeshes.length;i++){const n=e.subMeshes[i];a.P.AddToMesh(n.materialIndex,n.verticesStart,n.verticesCount,n.indexStart,n.indexCount,t)}}t._shouldGenerateFlatShading&&(t.convertToFlatShadedMesh(),t._shouldGenerateFlatShading=!1),t.computeWorldMatrix(!0),i.onMeshImportedObservable.notifyObservers(t)}static _CleanMatricesWeights(e,t){const i=.001;if(!l.Z.CleanBoneMatrixWeights)return;let n=0;if(!(e.skeletonId>-1))return;{const i=t.getScene().getLastSkeletonById(e.skeletonId);if(!i)return;n=i.bones.length}const s=t.getVerticesData(o.o.MatricesIndicesKind),r=t.getVerticesData(o.o.MatricesIndicesExtraKind),a=e.matricesWeights,h=e.matricesWeightsExtra,c=e.numBoneInfluencer,u=a.length;for(let e=0;e<u;e+=4){let t=0,o=-1;for(let n=0;n<4;n++){const s=a[e+n];t+=s,s<i&&o<0&&(o=n)}if(h)for(let n=0;n<4;n++){const s=h[e+n];t+=s,s<i&&o<0&&(o=n+4)}if((o<0||o>c-1)&&(o=c-1),t>i){const i=1/t;for(let t=0;t<4;t++)a[e+t]*=i;if(h)for(let t=0;t<4;t++)h[e+t]*=i}else o>=4?(h[e+o-4]=1-t,r[e+o-4]=n):(a[e+o]=1-t,s[e+o]=n)}t.setVerticesData(o.o.MatricesIndicesKind,s),e.matricesWeightsExtra&&t.setVerticesData(o.o.MatricesIndicesExtraKind,r)}static Parse(e,t,i){const s=new _(e.id,t,void 0,e.updatable);return s._loadedUniqueId=e.uniqueId,u.$&&u.$.AddTagsTo(s,e.tags),e.delayLoadingFile?(s.delayLoadState=4,s.delayLoadingFile=i+e.delayLoadingFile,s._boundingInfo=new h.j(n.P.FromArray(e.boundingBoxMinimum),n.P.FromArray(e.boundingBoxMaximum)),s._delayInfo=[],e.hasUVs&&s._delayInfo.push(o.o.UVKind),e.hasUVs2&&s._delayInfo.push(o.o.UV2Kind),e.hasUVs3&&s._delayInfo.push(o.o.UV3Kind),e.hasUVs4&&s._delayInfo.push(o.o.UV4Kind),e.hasUVs5&&s._delayInfo.push(o.o.UV5Kind),e.hasUVs6&&s._delayInfo.push(o.o.UV6Kind),e.hasColors&&s._delayInfo.push(o.o.ColorKind),e.hasMatricesIndices&&s._delayInfo.push(o.o.MatricesIndicesKind),e.hasMatricesWeights&&s._delayInfo.push(o.o.MatricesWeightsKind),s._delayLoadingFunction=r.x.ImportVertexData):r.x.ImportVertexData(e,s),t.pushGeometry(s,!0),s}}},8475:(e,t,i)=>{i.d(t,{E:()=>o});var n=i(4141),s=i(708),r=i(4496);r.Kj._GroundMeshParser=(e,t)=>o.Parse(e,t);class o extends r.Kj{constructor(e,t){super(e,t),this.generateOctree=!1}getClassName(){return"GroundMesh"}get subdivisions(){return Math.min(this._subdivisionsX,this._subdivisionsY)}get subdivisionsX(){return this._subdivisionsX}get subdivisionsY(){return this._subdivisionsY}optimize(e,t=32){this._subdivisionsX=e,this._subdivisionsY=e,this.subdivide(e);this.createOrUpdateSubmeshesOctree&&this.createOrUpdateSubmeshesOctree(t)}getHeightAtCoordinates(e,t){const i=this.getWorldMatrix(),s=n.jp.Matrix[5];i.invertToRef(s);const r=n.jp.Vector3[8];if(n.P.TransformCoordinatesFromFloatsToRef(e,0,t,s,r),e=r.x,t=r.z,e<this._minX||e>=this._maxX||t<=this._minZ||t>this._maxZ)return this.position.y;this._heightQuads&&0!=this._heightQuads.length||(this._initHeightQuads(),this._computeHeightQuads());const o=this._getFacetAt(e,t),a=-(o.x*e+o.z*t+o.w)/o.y;return n.P.TransformCoordinatesFromFloatsToRef(0,a,0,i,r),r.y}getNormalAtCoordinates(e,t){const i=new n.P(0,1,0);return this.getNormalAtCoordinatesToRef(e,t,i),i}getNormalAtCoordinatesToRef(e,t,i){const s=this.getWorldMatrix(),r=n.jp.Matrix[5];s.invertToRef(r);const o=n.jp.Vector3[8];if(n.P.TransformCoordinatesFromFloatsToRef(e,0,t,r,o),e=o.x,t=o.z,e<this._minX||e>this._maxX||t<this._minZ||t>this._maxZ)return this;this._heightQuads&&0!=this._heightQuads.length||(this._initHeightQuads(),this._computeHeightQuads());const a=this._getFacetAt(e,t);return n.P.TransformNormalFromFloatsToRef(a.x,a.y,a.z,s,i),this}updateCoordinateHeights(){return this._heightQuads&&0!=this._heightQuads.length||this._initHeightQuads(),this._computeHeightQuads(),this}_getFacetAt(e,t){const i=Math.floor((e+this._maxX)*this._subdivisionsX/this._width),n=Math.floor(-(t+this._maxZ)*this._subdivisionsY/this._height+this._subdivisionsY),s=this._heightQuads[n*this._subdivisionsX+i];let r;return r=t<s.slope.x*e+s.slope.y?s.facet1:s.facet2,r}_initHeightQuads(){const e=this._subdivisionsX,t=this._subdivisionsY;this._heightQuads=new Array;for(let i=0;i<t;i++)for(let t=0;t<e;t++){const s={slope:n.FM.Zero(),facet1:new n.Lt(0,0,0,0),facet2:new n.Lt(0,0,0,0)};this._heightQuads[i*e+t]=s}return this}_computeHeightQuads(){const e=this.getVerticesData(s.o.PositionKind);if(!e)return this;const t=n.jp.Vector3[3],i=n.jp.Vector3[2],r=n.jp.Vector3[1],o=n.jp.Vector3[0],a=n.jp.Vector3[4],l=n.jp.Vector3[5],h=n.jp.Vector3[6],c=n.jp.Vector3[7],u=n.jp.Vector3[8];let d=0,p=0,f=0,_=0,m=0,g=0,v=0;const y=this._subdivisionsX,x=this._subdivisionsY;for(let s=0;s<x;s++)for(let x=0;x<y;x++){d=3*x,p=s*(y+1)*3,f=(s+1)*(y+1)*3,t.x=e[p+d],t.y=e[p+d+1],t.z=e[p+d+2],i.x=e[p+d+3],i.y=e[p+d+4],i.z=e[p+d+5],r.x=e[f+d],r.y=e[f+d+1],r.z=e[f+d+2],o.x=e[f+d+3],o.y=e[f+d+4],o.z=e[f+d+5],_=(o.z-t.z)/(o.x-t.x),m=t.z-_*t.x,i.subtractToRef(t,a),r.subtractToRef(t,l),o.subtractToRef(t,h),n.P.CrossToRef(h,l,c),n.P.CrossToRef(a,h,u),c.normalize(),u.normalize(),g=-(c.x*t.x+c.y*t.y+c.z*t.z),v=-(u.x*i.x+u.y*i.y+u.z*i.z);const b=this._heightQuads[s*y+x];b.slope.copyFromFloats(_,m),b.facet1.copyFromFloats(c.x,c.y,c.z,g),b.facet2.copyFromFloats(u.x,u.y,u.z,v)}return this}serialize(e){super.serialize(e),e.subdivisionsX=this._subdivisionsX,e.subdivisionsY=this._subdivisionsY,e.minX=this._minX,e.maxX=this._maxX,e.minZ=this._minZ,e.maxZ=this._maxZ,e.width=this._width,e.height=this._height}static Parse(e,t){const i=new o(e.name,t);return i._subdivisionsX=e.subdivisionsX||1,i._subdivisionsY=e.subdivisionsY||1,i._minX=e.minX,i._maxX=e.maxX,i._minZ=e.minZ,i._maxZ=e.maxZ,i._width=e.width,i._height=e.height,i}}},7338:(e,t,i)=>{i.d(t,{S:()=>u});var n=i(4141),s=i(2722),r=i(1795),o=i(4496),a=i(6387),l=i(4674),h=i(708),c=i(7257);o.Kj._instancedMeshFactory=(e,t)=>{const i=new u(e,t);if(t.instancedBuffers){i.instancedBuffers={};for(const e in t.instancedBuffers)i.instancedBuffers[e]=t.instancedBuffers[e]}return i};class u extends r.x{constructor(e,t){super(e,t.getScene()),this._indexInSourceMeshInstanceArray=-1,this._distanceToCamera=0,t.addInstance(this),this._sourceMesh=t,this._unIndexed=t._unIndexed,this.position.copyFrom(t.position),this.rotation.copyFrom(t.rotation),this.scaling.copyFrom(t.scaling),t.rotationQuaternion&&(this.rotationQuaternion=t.rotationQuaternion.clone()),this.animations=t.animations.slice();for(const e of t.getAnimationRanges())null!=e&&this.createAnimationRange(e.name,e.from,e.to);this.infiniteDistance=t.infiniteDistance,this.setPivotMatrix(t.getPivotMatrix()),this.refreshBoundingInfo(!0,!0),this._syncSubMeshes()}getClassName(){return"InstancedMesh"}get lightSources(){return this._sourceMesh._lightSources}_resyncLightSources(){}_resyncLightSource(){}_removeLightSource(){}get receiveShadows(){return this._sourceMesh.receiveShadows}set receiveShadows(e){var t;(null===(t=this._sourceMesh)||void 0===t?void 0:t.receiveShadows)!==e&&c.w1.Warn("Setting receiveShadows on an instanced mesh has no effect")}get material(){return this._sourceMesh.material}set material(e){var t;(null===(t=this._sourceMesh)||void 0===t?void 0:t.material)!==e&&c.w1.Warn("Setting material on an instanced mesh has no effect")}get visibility(){return this._sourceMesh.visibility}set visibility(e){var t;(null===(t=this._sourceMesh)||void 0===t?void 0:t.visibility)!==e&&c.w1.Warn("Setting visibility on an instanced mesh has no effect")}get skeleton(){return this._sourceMesh.skeleton}set skeleton(e){var t;(null===(t=this._sourceMesh)||void 0===t?void 0:t.skeleton)!==e&&c.w1.Warn("Setting skeleton on an instanced mesh has no effect")}get renderingGroupId(){return this._sourceMesh.renderingGroupId}set renderingGroupId(e){this._sourceMesh&&e!==this._sourceMesh.renderingGroupId&&s.Y.Warn("Note - setting renderingGroupId of an instanced mesh has no effect on the scene")}getTotalVertices(){return this._sourceMesh?this._sourceMesh.getTotalVertices():0}getTotalIndices(){return this._sourceMesh.getTotalIndices()}get sourceMesh(){return this._sourceMesh}createInstance(e){return this._sourceMesh.createInstance(e)}isReady(e=!1){return this._sourceMesh.isReady(e,!0)}getVerticesData(e,t,i){return this._sourceMesh.getVerticesData(e,t,i)}setVerticesData(e,t,i,n){return this.sourceMesh&&this.sourceMesh.setVerticesData(e,t,i,n),this.sourceMesh}updateVerticesData(e,t,i,n){return this.sourceMesh&&this.sourceMesh.updateVerticesData(e,t,i,n),this.sourceMesh}setIndices(e,t=null){return this.sourceMesh&&this.sourceMesh.setIndices(e,t),this.sourceMesh}isVerticesDataPresent(e){return this._sourceMesh.isVerticesDataPresent(e)}getIndices(){return this._sourceMesh.getIndices()}get _positions(){return this._sourceMesh._positions}refreshBoundingInfo(e=!1,t=!1){if(this.hasBoundingInfo&&this.getBoundingInfo().isLocked)return this;const i=this._sourceMesh.geometry?this._sourceMesh.geometry.boundingBias:null;return this._refreshBoundingInfo(this._sourceMesh._getPositionData(e,t),i),this}_preActivate(){return this._currentLOD&&this._currentLOD._preActivate(),this}_activate(e,t){if(super._activate(e,t),this._sourceMesh.subMeshes||s.Y.Warn("Instances should only be created for meshes with geometry."),this._currentLOD){if(this._currentLOD._getWorldMatrixDeterminant()>=0!=this._getWorldMatrixDeterminant()>=0)return this._internalAbstractMeshDataInfo._actAsRegularMesh=!0,!0;if(this._internalAbstractMeshDataInfo._actAsRegularMesh=!1,this._currentLOD._registerInstanceForRenderId(this,e),t){if(!this._currentLOD._internalAbstractMeshDataInfo._isActiveIntermediate)return this._currentLOD._internalAbstractMeshDataInfo._onlyForInstancesIntermediate=!0,!0}else if(!this._currentLOD._internalAbstractMeshDataInfo._isActive)return this._currentLOD._internalAbstractMeshDataInfo._onlyForInstances=!0,!0}return!1}_postActivate(){this._sourceMesh.edgesShareWithInstances&&this._sourceMesh._edgesRenderer&&this._sourceMesh._edgesRenderer.isEnabled&&this._sourceMesh._renderingGroup?(this._sourceMesh._renderingGroup._edgesRenderers.pushNoDuplicate(this._sourceMesh._edgesRenderer),this._sourceMesh._edgesRenderer.customInstances.push(this.getWorldMatrix())):this._edgesRenderer&&this._edgesRenderer.isEnabled&&this._sourceMesh._renderingGroup&&this._sourceMesh._renderingGroup._edgesRenderers.push(this._edgesRenderer)}getWorldMatrix(){if(this._currentLOD&&this._currentLOD.billboardMode!==l.Y.BILLBOARDMODE_NONE&&this._currentLOD._masterMesh!==this){this._billboardWorldMatrix||(this._billboardWorldMatrix=new n.y3);const e=this._currentLOD._masterMesh;return this._currentLOD._masterMesh=this,n.jp.Vector3[7].copyFrom(this._currentLOD.position),this._currentLOD.position.set(0,0,0),this._billboardWorldMatrix.copyFrom(this._currentLOD.computeWorldMatrix(!0)),this._currentLOD.position.copyFrom(n.jp.Vector3[7]),this._currentLOD._masterMesh=e,this._billboardWorldMatrix}return super.getWorldMatrix()}get isAnInstance(){return!0}getLOD(e){if(!e)return this;const t=this.sourceMesh.getLODLevels();if(t&&0!==t.length){const t=this.getBoundingInfo();this._currentLOD=this.sourceMesh.getLOD(e,t.boundingSphere)}else this._currentLOD=this.sourceMesh;return this._currentLOD}_preActivateForIntermediateRendering(e){return this.sourceMesh._preActivateForIntermediateRendering(e)}_syncSubMeshes(){if(this.releaseSubMeshes(),this._sourceMesh.subMeshes)for(let e=0;e<this._sourceMesh.subMeshes.length;e++)this._sourceMesh.subMeshes[e].clone(this,this._sourceMesh);return this}_generatePointsArray(){return this._sourceMesh._generatePointsArray()}_updateBoundingInfo(){return this.hasBoundingInfo?this.getBoundingInfo().update(this.worldMatrixFromCache):this.buildBoundingInfo(this.absolutePosition,this.absolutePosition,this.worldMatrixFromCache),this._updateSubMeshesBoundingInfo(this.worldMatrixFromCache),this}clone(e,t=null,i,n){const s=(n||this._sourceMesh).createInstance(e);if(a.j.DeepCopy(this,s,["name","subMeshes","uniqueId","parent","lightSources","receiveShadows","material","visibility","skeleton","sourceMesh","isAnInstance","facetNb","isFacetDataEnabled","isBlocked","useBones","hasInstances","collider","edgesRenderer","forward","up","right","absolutePosition","absoluteScaling","absoluteRotationQuaternion","isWorldMatrixFrozen","nonUniformScaling","behaviors","worldMatrixFromCache","hasThinInstances","hasBoundingInfo"],[]),this.refreshBoundingInfo(),t&&(s.parent=t),!i)for(let e=0;e<this.getScene().meshes.length;e++){const t=this.getScene().meshes[e];t.parent===this&&t.clone(t.name,s)}return s.computeWorldMatrix(!0),this.onClonedObservable.notifyObservers(s),s}dispose(e,t=!1){this._sourceMesh.removeInstance(this),super.dispose(e,t)}_serializeAsParent(e){super._serializeAsParent(e),e.parentId=this._sourceMesh.uniqueId,e.parentInstanceIndex=this._indexInSourceMeshInstanceArray}instantiateHierarchy(e=null,t,i){const n=this.clone("Clone of "+(this.name||this.id),e||this.parent,!0,t&&t.newSourcedMesh);n&&i&&i(this,n);for(const e of this.getChildTransformNodes(!0))e.instantiateHierarchy(n,t,i);return n}}o.Kj.prototype.registerInstancedBuffer=function(e,t){var i,n;if(null===(n=null===(i=this._userInstancedBuffersStorage)||void 0===i?void 0:i.vertexBuffers[e])||void 0===n||n.dispose(),!this.instancedBuffers){this.instancedBuffers={};for(const e of this.instances)e.instancedBuffers={};this._userInstancedBuffersStorage||(this._userInstancedBuffersStorage={data:{},vertexBuffers:{},strides:{},sizes:{},vertexArrayObjects:this.getEngine().getCaps().vertexArrayObject?{}:void 0})}this.instancedBuffers[e]=null,this._userInstancedBuffersStorage.strides[e]=t,this._userInstancedBuffersStorage.sizes[e]=32*t,this._userInstancedBuffersStorage.data[e]=new Float32Array(this._userInstancedBuffersStorage.sizes[e]),this._userInstancedBuffersStorage.vertexBuffers[e]=new h.o(this.getEngine(),this._userInstancedBuffersStorage.data[e],e,!0,!1,t,!0);for(const t of this.instances)t.instancedBuffers[e]=null;this._invalidateInstanceVertexArrayObject(),this._markSubMeshesAsAttributesDirty()},o.Kj.prototype._processInstancedBuffers=function(e,t){const i=e?e.length:0;for(const n in this.instancedBuffers){let s=this._userInstancedBuffersStorage.sizes[n];const r=this._userInstancedBuffersStorage.strides[n],o=(i+1)*r;for(;s<o;)s*=2;this._userInstancedBuffersStorage.data[n].length!=s&&(this._userInstancedBuffersStorage.data[n]=new Float32Array(s),this._userInstancedBuffersStorage.sizes[n]=s,this._userInstancedBuffersStorage.vertexBuffers[n]&&(this._userInstancedBuffersStorage.vertexBuffers[n].dispose(),this._userInstancedBuffersStorage.vertexBuffers[n]=null));const a=this._userInstancedBuffersStorage.data[n];let l=0;if(t){const e=this.instancedBuffers[n];e.toArray?e.toArray(a,l):e.copyToArray?e.copyToArray(a,l):a[l]=e,l+=r}for(let t=0;t<i;t++){const i=e[t].instancedBuffers[n];i.toArray?i.toArray(a,l):i.copyToArray?i.copyToArray(a,l):a[l]=i,l+=r}this._userInstancedBuffersStorage.vertexBuffers[n]?this._userInstancedBuffersStorage.vertexBuffers[n].updateDirectly(a,0):(this._userInstancedBuffersStorage.vertexBuffers[n]=new h.o(this.getEngine(),this._userInstancedBuffersStorage.data[n],n,!0,!1,r,!0),this._invalidateInstanceVertexArrayObject())}},o.Kj.prototype._invalidateInstanceVertexArrayObject=function(){if(this._userInstancedBuffersStorage&&void 0!==this._userInstancedBuffersStorage.vertexArrayObjects){for(const e in this._userInstancedBuffersStorage.vertexArrayObjects)this.getEngine().releaseVertexArrayObject(this._userInstancedBuffersStorage.vertexArrayObjects[e]);this._userInstancedBuffersStorage.vertexArrayObjects={}}},o.Kj.prototype._disposeInstanceSpecificData=function(){for(this._instanceDataStorage.instancesBuffer&&(this._instanceDataStorage.instancesBuffer.dispose(),this._instanceDataStorage.instancesBuffer=null);this.instances.length;)this.instances[0].dispose();for(const e in this.instancedBuffers)this._userInstancedBuffersStorage.vertexBuffers[e]&&this._userInstancedBuffersStorage.vertexBuffers[e].dispose();this._invalidateInstanceVertexArrayObject(),this.instancedBuffers={}}},8591:(e,t,i)=>{i.d(t,{E:()=>c,_:()=>h});var n=i(4649),s=i(708),r=i(4496),o=i(7338),a=i(7104),l=i(8097);i(6980),i(9753),r.Kj._LinesMeshParser=(e,t)=>h.Parse(e,t);class h extends r.Kj{_isShaderMaterial(e){return"ShaderMaterial"===e.getClassName()}constructor(e,t=null,i=null,r=null,o,a,h,c){super(e,t,i,r,o),this.useVertexColor=a,this.useVertexAlpha=h,this.color=new n.Wo(1,1,1),this.alpha=1,r&&(this.color=r.color.clone(),this.alpha=r.alpha,this.useVertexColor=r.useVertexColor,this.useVertexAlpha=r.useVertexAlpha),this.intersectionThreshold=.1;const u={attributes:[s.o.PositionKind],uniforms:["world","viewProjection"],needAlphaBlending:!0,defines:[],useClipPlane:null};!1===h?u.needAlphaBlending=!1:u.defines.push("#define VERTEXALPHA"),a?(u.defines.push("#define VERTEXCOLOR"),u.attributes.push(s.o.ColorKind)):(u.uniforms.push("color"),this._color4=new n.HE),c?this.material=c:(this.material=new l.j("colorShader",this.getScene(),"color",u,!1),this.material.doNotSerialize=!0)}isReady(){return!!this._lineMaterial.isReady(this,!!this._userInstancedBuffersStorage)&&super.isReady()}getClassName(){return"LinesMesh"}get material(){return this._lineMaterial}set material(e){this._lineMaterial=e,this._lineMaterial.fillMode=a.F.LineListDrawMode}get checkCollisions(){return!1}set checkCollisions(e){}_bind(e,t){if(!this._geometry)return this;const i=this.isUnIndexed?null:this._geometry.getIndexBuffer();if(this._userInstancedBuffersStorage?this._geometry._bind(t,i,this._userInstancedBuffersStorage.vertexBuffers,this._userInstancedBuffersStorage.vertexArrayObjects):this._geometry._bind(t,i),!this.useVertexColor&&this._isShaderMaterial(this._lineMaterial)){const{r:e,g:t,b:i}=this.color;this._color4.set(e,t,i,this.alpha),this._lineMaterial.setColor4("color",this._color4)}return this}_draw(e,t,i){if(!this._geometry||!this._geometry.getVertexBuffers()||!this._unIndexed&&!this._geometry.getIndexBuffer())return this;const n=this.getScene().getEngine();return this._unIndexed?n.drawArraysType(a.F.LineListDrawMode,e.verticesStart,e.verticesCount,i):n.drawElementsType(a.F.LineListDrawMode,e.indexStart,e.indexCount,i),this}dispose(e,t=!1,i){i||this._lineMaterial.dispose(!1,!1,!0),super.dispose(e)}clone(e,t=null,i){return new h(e,this.getScene(),t,this,i)}createInstance(e){const t=new c(e,this);if(this.instancedBuffers){t.instancedBuffers={};for(const e in this.instancedBuffers)t.instancedBuffers[e]=this.instancedBuffers[e]}return t}serialize(e){super.serialize(e),e.color=this.color.asArray(),e.alpha=this.alpha}static Parse(e,t){const i=new h(e.name,t);return i.color=n.Wo.FromArray(e.color),i.alpha=e.alpha,i}}class c extends o.S{constructor(e,t){super(e,t),this.intersectionThreshold=t.intersectionThreshold}getClassName(){return"InstancedLinesMesh"}}},4496:(e,t,i)=>{i.d(t,{Kj:()=>O,Wv:()=>M,gW:()=>P});var n=i(5757),s=i(7257),r=i(6387),o=i(4875),a=i(2697),l=i(2704),h=i(1057),c=i(4141),u=i(4649),d=i(9257),p=i(708),f=i(2101),_=i(7321),m=i(1795),g=i(9401),v=i(7104),y=i(9828),x=i(1376),b=i(3956),T=i(2722),S=i(2208),E=i(4934),C=i(2333),A=i(447);class P{}class R{constructor(){this.visibleInstances={},this.batchCache=new M,this.batchCacheReplacementModeInFrozenMode=new M,this.instancesBufferSize=2048}}class M{constructor(){this.mustReturn=!1,this.visibleInstances=new Array,this.renderSelf=new Array,this.hardwareInstancedRendering=new Array}}class I{constructor(){this.instancesCount=0,this.matrixBuffer=null,this.previousMatrixBuffer=null,this.matrixBufferSize=512,this.matrixData=null,this.boundingVectors=[],this.worldMatrices=null}}class D{constructor(){this._areNormalsFrozen=!1,this._source=null,this.meshMap=null,this._preActivateId=-1,this._LODLevels=new Array,this._useLODScreenCoverage=!1,this._effectiveMaterial=null,this._forcedInstanceCount=0,this._overrideRenderingFillMode=null}}class O extends m.x{static _GetDefaultSideOrientation(e){return e||O.FRONTSIDE}get useLODScreenCoverage(){return this._internalMeshDataInfo._useLODScreenCoverage}set useLODScreenCoverage(e){this._internalMeshDataInfo._useLODScreenCoverage=e,this._sortLODLevels()}get computeBonesUsingShaders(){return this._internalAbstractMeshDataInfo._computeBonesUsingShaders}set computeBonesUsingShaders(e){this._internalAbstractMeshDataInfo._computeBonesUsingShaders!==e&&(e&&this._internalMeshDataInfo._sourcePositions&&(this.setVerticesData(p.o.PositionKind,this._internalMeshDataInfo._sourcePositions,!0),this._internalMeshDataInfo._sourceNormals&&this.setVerticesData(p.o.NormalKind,this._internalMeshDataInfo._sourceNormals,!0),this._internalMeshDataInfo._sourcePositions=null,this._internalMeshDataInfo._sourceNormals=null),this._internalAbstractMeshDataInfo._computeBonesUsingShaders=e,this._markSubMeshesAsAttributesDirty())}get onBeforeRenderObservable(){return this._internalMeshDataInfo._onBeforeRenderObservable||(this._internalMeshDataInfo._onBeforeRenderObservable=new n.y$),this._internalMeshDataInfo._onBeforeRenderObservable}get onBeforeBindObservable(){return this._internalMeshDataInfo._onBeforeBindObservable||(this._internalMeshDataInfo._onBeforeBindObservable=new n.y$),this._internalMeshDataInfo._onBeforeBindObservable}get onAfterRenderObservable(){return this._internalMeshDataInfo._onAfterRenderObservable||(this._internalMeshDataInfo._onAfterRenderObservable=new n.y$),this._internalMeshDataInfo._onAfterRenderObservable}get onBetweenPassObservable(){return this._internalMeshDataInfo._onBetweenPassObservable||(this._internalMeshDataInfo._onBetweenPassObservable=new n.y$),this._internalMeshDataInfo._onBetweenPassObservable}get onBeforeDrawObservable(){return this._internalMeshDataInfo._onBeforeDrawObservable||(this._internalMeshDataInfo._onBeforeDrawObservable=new n.y$),this._internalMeshDataInfo._onBeforeDrawObservable}set onBeforeDraw(e){this._onBeforeDrawObserver&&this.onBeforeDrawObservable.remove(this._onBeforeDrawObserver),this._onBeforeDrawObserver=this.onBeforeDrawObservable.add(e)}get hasInstances(){return this.instances.length>0}get hasThinInstances(){var e;return(null!==(e=this._thinInstanceDataStorage.instancesCount)&&void 0!==e?e:0)>0}get forcedInstanceCount(){return this._internalMeshDataInfo._forcedInstanceCount}set forcedInstanceCount(e){this._internalMeshDataInfo._forcedInstanceCount=e}get overrideRenderingFillMode(){return this._internalMeshDataInfo._overrideRenderingFillMode}set overrideRenderingFillMode(e){this._internalMeshDataInfo._overrideRenderingFillMode=e}get source(){return this._internalMeshDataInfo._source}get cloneMeshMap(){return this._internalMeshDataInfo.meshMap}get isUnIndexed(){return this._unIndexed}set isUnIndexed(e){this._unIndexed!==e&&(this._unIndexed=e,this._markSubMeshesAsAttributesDirty())}get worldMatrixInstancedBuffer(){return this._instanceDataStorage.instancesData}get previousWorldMatrixInstancedBuffer(){return this._instanceDataStorage.instancesPreviousData}get manualUpdateOfWorldMatrixInstancedBuffer(){return this._instanceDataStorage.manualUpdate}set manualUpdateOfWorldMatrixInstancedBuffer(e){this._instanceDataStorage.manualUpdate=e}get manualUpdateOfPreviousWorldMatrixInstancedBuffer(){return this._instanceDataStorage.previousManualUpdate}set manualUpdateOfPreviousWorldMatrixInstancedBuffer(e){this._instanceDataStorage.previousManualUpdate=e}get forceWorldMatrixInstancedBufferUpdate(){return this._instanceDataStorage.forceMatrixUpdates}set forceWorldMatrixInstancedBufferUpdate(e){this._instanceDataStorage.forceMatrixUpdates=e}constructor(e,t=null,i=null,s=null,a,l=!0){if(super(e,t),this._internalMeshDataInfo=new D,this.delayLoadState=0,this.instances=new Array,this._creationDataStorage=null,this._geometry=null,this._instanceDataStorage=new R,this._thinInstanceDataStorage=new I,this._shouldGenerateFlatShading=!1,this._originalBuilderSideOrientation=O.DEFAULTSIDE,this.overrideMaterialSideOrientation=null,this.ignoreCameraMaxZ=!1,t=this.getScene(),this._onBeforeDraw=(e,t,i)=>{e&&i&&(this._uniformBuffer?this.transferToEffect(t):i.bindOnlyWorldMatrix(t))},s){if(s._geometry&&s._geometry.applyToMesh(this),r.j.DeepCopy(s,this,["name","material","skeleton","instances","parent","uniqueId","source","metadata","morphTargetManager","hasInstances","worldMatrixInstancedBuffer","previousWorldMatrixInstancedBuffer","hasLODLevels","geometry","isBlocked","areNormalsFrozen","facetNb","isFacetDataEnabled","lightSources","useBones","isAnInstance","collider","edgesRenderer","forward","up","right","absolutePosition","absoluteScaling","absoluteRotationQuaternion","isWorldMatrixFrozen","nonUniformScaling","behaviors","worldMatrixFromCache","hasThinInstances","cloneMeshMap","hasBoundingInfo"],["_poseMatrix"]),this._internalMeshDataInfo._source=s,t.useClonedMeshMap&&(s._internalMeshDataInfo.meshMap||(s._internalMeshDataInfo.meshMap={}),s._internalMeshDataInfo.meshMap[this.uniqueId]=this),this._originalBuilderSideOrientation=s._originalBuilderSideOrientation,this._creationDataStorage=s._creationDataStorage,s._ranges){const e=s._ranges;for(const t in e)Object.prototype.hasOwnProperty.call(e,t)&&e[t]&&this.createAnimationRange(t,e[t].from,e[t].to)}if(s.metadata&&s.metadata.clone?this.metadata=s.metadata.clone():this.metadata=s.metadata,this._internalMetadata=s._internalMetadata,o.$&&o.$.HasTags(s)&&o.$.AddTagsTo(this,o.$.GetTags(s,!0)),this.setEnabled(s.isEnabled(!1)),this.parent=s.parent,this.setPivotMatrix(s.getPivotMatrix()),this.id=e+"."+s.id,this.material=s.material,!a){const t=s.getDescendants(!0);for(let i=0;i<t.length;i++){const n=t[i];n.clone&&n.clone(e+"."+n.name,this)}}if(s.morphTargetManager&&(this.morphTargetManager=s.morphTargetManager),t.getPhysicsEngine){const e=t.getPhysicsEngine();if(l&&e)if(1===e.getPluginVersion()){const t=e.getImpostorForPhysicsObject(s);t&&(this.physicsImpostor=t.clone(this))}else 2===e.getPluginVersion()&&s.physicsBody&&s.physicsBody.clone(this)}for(let e=0;e<t.particleSystems.length;e++){const i=t.particleSystems[e];i.emitter===s&&i.clone(i.name,this)}this.skeleton=s.skeleton,this.refreshBoundingInfo(!0,!0),this.computeWorldMatrix(!0)}null!==i&&(this.parent=i),this._instanceDataStorage.hardwareInstancedRendering=this.getEngine().getCaps().instancedArrays,this._internalMeshDataInfo._onMeshReadyObserverAdded=e=>{e.unregisterOnNextCall=!0,this.isReady(!0)?this.onMeshReadyObservable.notifyObservers(this):this._internalMeshDataInfo._checkReadinessObserver||(this._internalMeshDataInfo._checkReadinessObserver=this._scene.onBeforeRenderObservable.add((()=>{this.isReady(!0)&&(this._scene.onBeforeRenderObservable.remove(this._internalMeshDataInfo._checkReadinessObserver),this._internalMeshDataInfo._checkReadinessObserver=null,this.onMeshReadyObservable.notifyObservers(this))})))},this.onMeshReadyObservable=new n.y$(this._internalMeshDataInfo._onMeshReadyObserverAdded),s&&s.onClonedObservable.notifyObservers(this)}instantiateHierarchy(e=null,t,i){const n=0===this.getTotalVertices()||t&&t.doNotInstantiate&&(!0===t.doNotInstantiate||t.doNotInstantiate(this))?this.clone("Clone of "+(this.name||this.id),e||this.parent,!0):this.createInstance("instance of "+(this.name||this.id));n.parent=e||this.parent,n.position=this.position.clone(),n.scaling=this.scaling.clone(),this.rotationQuaternion?n.rotationQuaternion=this.rotationQuaternion.clone():n.rotation=this.rotation.clone(),i&&i(this,n);for(const e of this.getChildTransformNodes(!0))"InstancedMesh"===e.getClassName()&&"Mesh"===n.getClassName()&&e.sourceMesh===this?e.instantiateHierarchy(n,{doNotInstantiate:t&&t.doNotInstantiate||!1,newSourcedMesh:n},i):e.instantiateHierarchy(n,t,i);return n}getClassName(){return"Mesh"}get _isMesh(){return!0}toString(e){let t=super.toString(e);if(t+=", n vertices: "+this.getTotalVertices(),t+=", parent: "+(this._waitingParentId?this._waitingParentId:this.parent?this.parent.name:"NONE"),this.animations)for(let i=0;i<this.animations.length;i++)t+=", animation[0]: "+this.animations[i].toString(e);if(e)if(this._geometry){const e=this.getIndices(),i=this.getVerticesData(p.o.PositionKind);i&&e&&(t+=", flat shading: "+(i.length/3===e.length?"YES":"NO"))}else t+=", flat shading: UNKNOWN";return t}_unBindEffect(){super._unBindEffect();for(const e of this.instances)e._unBindEffect()}get hasLODLevels(){return this._internalMeshDataInfo._LODLevels.length>0}getLODLevels(){return this._internalMeshDataInfo._LODLevels}_sortLODLevels(){const e=this._internalMeshDataInfo._useLODScreenCoverage?-1:1;this._internalMeshDataInfo._LODLevels.sort(((t,i)=>t.distanceOrScreenCoverage<i.distanceOrScreenCoverage?e:t.distanceOrScreenCoverage>i.distanceOrScreenCoverage?-e:0))}addLODLevel(e,t){if(t&&t._masterMesh)return T.Y.Warn("You cannot use a mesh as LOD level twice"),this;const i=new A.g(e,t);return this._internalMeshDataInfo._LODLevels.push(i),t&&(t._masterMesh=this),this._sortLODLevels(),this}getLODLevelAtDistance(e){const t=this._internalMeshDataInfo;for(let i=0;i<t._LODLevels.length;i++){const n=t._LODLevels[i];if(n.distanceOrScreenCoverage===e)return n.mesh}return null}removeLODLevel(e){const t=this._internalMeshDataInfo;for(let i=0;i<t._LODLevels.length;i++)t._LODLevels[i].mesh===e&&(t._LODLevels.splice(i,1),e&&(e._masterMesh=null));return this._sortLODLevels(),this}getLOD(e,t){const i=this._internalMeshDataInfo;if(!i._LODLevels||0===i._LODLevels.length)return this;const n=t||this.getBoundingInfo().boundingSphere,s=e.mode===l.V.ORTHOGRAPHIC_CAMERA?e.minZ:n.centerWorld.subtract(e.globalPosition).length();let r=s,o=1;if(i._useLODScreenCoverage){const t=e.screenArea;let i=n.radiusWorld*e.minZ/s;i=i*i*Math.PI,r=i/t,o=-1}if(o*i._LODLevels[i._LODLevels.length-1].distanceOrScreenCoverage>o*r)return this.onLODLevelSelection&&this.onLODLevelSelection(r,this,this),this;for(let e=0;e<i._LODLevels.length;e++){const t=i._LODLevels[e];if(o*t.distanceOrScreenCoverage<o*r){if(t.mesh){if(4===t.mesh.delayLoadState)return t.mesh._checkDelayState(),this;if(2===t.mesh.delayLoadState)return this;t.mesh._preActivate(),t.mesh._updateSubMeshesBoundingInfo(this.worldMatrixFromCache)}return this.onLODLevelSelection&&this.onLODLevelSelection(r,this,t.mesh),t.mesh}}return this.onLODLevelSelection&&this.onLODLevelSelection(r,this,this),this}get geometry(){return this._geometry}getTotalVertices(){return null===this._geometry||void 0===this._geometry?0:this._geometry.getTotalVertices()}getVerticesData(e,t,i,n){var s,r;if(!this._geometry)return null;let o=n||null===(r=null===(s=this._userInstancedBuffersStorage)||void 0===s?void 0:s.vertexBuffers[e])||void 0===r?void 0:r.getFloatData(this.instances.length+1,i||t&&1!==this._geometry.meshes.length);return o||(o=this._geometry.getVerticesData(e,t,i)),o}getVertexBuffer(e,t){var i,n;return this._geometry?null!==(n=t||null===(i=this._userInstancedBuffersStorage)||void 0===i?void 0:i.vertexBuffers[e])&&void 0!==n?n:this._geometry.getVertexBuffer(e):null}isVerticesDataPresent(e,t){var i;return this._geometry?!t&&void 0!==(null===(i=this._userInstancedBuffersStorage)||void 0===i?void 0:i.vertexBuffers[e])||this._geometry.isVerticesDataPresent(e):!!this._delayInfo&&-1!==this._delayInfo.indexOf(e)}isVertexBufferUpdatable(e,t){var i;if(!this._geometry)return!!this._delayInfo&&-1!==this._delayInfo.indexOf(e);if(!t){const t=null===(i=this._userInstancedBuffersStorage)||void 0===i?void 0:i.vertexBuffers[e];if(t)return t.isUpdatable()}return this._geometry.isVertexBufferUpdatable(e)}getVerticesDataKinds(e){if(!this._geometry){const e=new Array;return this._delayInfo&&this._delayInfo.forEach((function(t){e.push(t)})),e}const t=this._geometry.getVerticesDataKinds();if(!e&&this._userInstancedBuffersStorage)for(const e in this._userInstancedBuffersStorage.vertexBuffers)-1===t.indexOf(e)&&t.push(e);return t}getTotalIndices(){return this._geometry?this._geometry.getTotalIndices():0}getIndices(e,t){return this._geometry?this._geometry.getIndices(e,t):[]}get isBlocked(){return null!==this._masterMesh&&void 0!==this._masterMesh}isReady(e=!1,t=!1){var i,n,s,r,o,a;if(2===this.delayLoadState)return!1;if(!super.isReady(e))return!1;if(!this.subMeshes||0===this.subMeshes.length)return!0;if(!e)return!0;const l=this.getEngine(),h=this.getScene(),c=t||l.getCaps().instancedArrays&&(this.instances.length>0||this.hasThinInstances);this.computeWorldMatrix();const u=this.material||h.defaultMaterial;if(u)if(u._storeEffectOnSubMeshes)for(const e of this.subMeshes){const t=e.getMaterial();if(t)if(t._storeEffectOnSubMeshes){if(!t.isReadyForSubMesh(this,e,c))return!1}else if(!t.isReady(this,c))return!1}else if(!u.isReady(this,c))return!1;const d=l.currentRenderPassId;for(const e of this.lightSources){const t=e.getShadowGenerators();if(!t)continue;const h=t.values();for(let e=h.next();!0!==e.done;e=h.next()){const t=e.value;if(t&&(!(null===(i=t.getShadowMap())||void 0===i?void 0:i.renderList)||(null===(n=t.getShadowMap())||void 0===n?void 0:n.renderList)&&-1!==(null===(r=null===(s=t.getShadowMap())||void 0===s?void 0:s.renderList)||void 0===r?void 0:r.indexOf(this)))){t.getShadowMap()&&(l.currentRenderPassId=t.getShadowMap().renderPassId);for(const e of this.subMeshes)if(!t.isReady(e,c,null!==(a=null===(o=e.getMaterial())||void 0===o?void 0:o.needAlphaBlendingForMesh(this))&&void 0!==a&&a))return l.currentRenderPassId=d,!1;l.currentRenderPassId=d}}}for(const e of this._internalMeshDataInfo._LODLevels)if(e.mesh&&!e.mesh.isReady(c))return!1;return!0}get areNormalsFrozen(){return this._internalMeshDataInfo._areNormalsFrozen}freezeNormals(){return this._internalMeshDataInfo._areNormalsFrozen=!0,this}unfreezeNormals(){return this._internalMeshDataInfo._areNormalsFrozen=!1,this}set overridenInstanceCount(e){this._instanceDataStorage.overridenInstanceCount=e}_preActivate(){const e=this._internalMeshDataInfo,t=this.getScene().getRenderId();return e._preActivateId===t||(e._preActivateId=t,this._instanceDataStorage.visibleInstances=null),this}_preActivateForIntermediateRendering(e){return this._instanceDataStorage.visibleInstances&&(this._instanceDataStorage.visibleInstances.intermediateDefaultRenderId=e),this}_registerInstanceForRenderId(e,t){return this._instanceDataStorage.visibleInstances||(this._instanceDataStorage.visibleInstances={defaultRenderId:t,selfDefaultRenderId:this._renderId}),this._instanceDataStorage.visibleInstances[t]||(void 0!==this._instanceDataStorage.previousRenderId&&this._instanceDataStorage.isFrozen&&(this._instanceDataStorage.visibleInstances[this._instanceDataStorage.previousRenderId]=null),this._instanceDataStorage.previousRenderId=t,this._instanceDataStorage.visibleInstances[t]=new Array),this._instanceDataStorage.visibleInstances[t].push(e),this}_afterComputeWorldMatrix(){super._afterComputeWorldMatrix(),this.hasThinInstances&&(this.doNotSyncBoundingInfo||this.thinInstanceRefreshBoundingInfo(!1))}_postActivate(){this.edgesShareWithInstances&&this.edgesRenderer&&this.edgesRenderer.isEnabled&&this._renderingGroup&&(this._renderingGroup._edgesRenderers.pushNoDuplicate(this.edgesRenderer),this.edgesRenderer.customInstances.push(this.getWorldMatrix()))}refreshBoundingInfo(e=!1,t=!1){if(this.hasBoundingInfo&&this.getBoundingInfo().isLocked)return this;const i=this.geometry?this.geometry.boundingBias:null;return this._refreshBoundingInfo(this._getPositionData(e,t),i),this}_createGlobalSubMesh(e){const t=this.getTotalVertices();if(!t||!this.getIndices())return null;if(this.subMeshes&&this.subMeshes.length>0){const i=this.getIndices();if(!i)return null;const n=i.length;let s=!1;if(e)s=!0;else for(const e of this.subMeshes){if(e.indexStart+e.indexCount>n){s=!0;break}if(e.verticesStart+e.verticesCount>t){s=!0;break}}if(!s)return this.subMeshes[0]}return this.releaseSubMeshes(),new g.P(0,0,t,0,this.getTotalIndices(),this)}subdivide(e){if(e<1)return;const t=this.getTotalIndices();let i=t/e|0,n=0;for(;i%3!=0;)i++;this.releaseSubMeshes();for(let s=0;s<e&&!(n>=t);s++)g.P.CreateFromIndices(0,n,s===e-1?t-n:i,this),n+=i;this.synchronizeInstances()}setVerticesData(e,t,i=!1,n){if(this._geometry)this._geometry.setVerticesData(e,t,i,n);else{const n=new f.x;n.set(t,e);const s=this.getScene();new _.Z(_.Z.RandomId(),s,n,i,this)}return this}removeVerticesData(e){this._geometry&&this._geometry.removeVerticesData(e)}markVerticesDataAsUpdatable(e,t=!0){const i=this.getVertexBuffer(e);i&&i.isUpdatable()!==t&&this.setVerticesData(e,this.getVerticesData(e),t)}setVerticesBuffer(e,t=!0){return this._geometry||(this._geometry=_.Z.CreateGeometryForMesh(this)),this._geometry.setVerticesBuffer(e,null,t),this}updateVerticesData(e,t,i,n){return this._geometry?(n?(this.makeGeometryUnique(),this.updateVerticesData(e,t,i,!1)):this._geometry.updateVerticesData(e,t,i),this):this}updateMeshPositions(e,t=!0){const i=this.getVerticesData(p.o.PositionKind);if(!i)return this;if(e(i),this.updateVerticesData(p.o.PositionKind,i,!1,!1),t){const e=this.getIndices(),t=this.getVerticesData(p.o.NormalKind);if(!t)return this;f.x.ComputeNormals(i,e,t),this.updateVerticesData(p.o.NormalKind,t,!1,!1)}return this}makeGeometryUnique(){if(!this._geometry)return this;if(1===this._geometry.meshes.length)return this;const e=this._geometry,t=this._geometry.copy(_.Z.RandomId());return e.releaseForMesh(this,!0),t.applyToMesh(this),this}setIndices(e,t=null,i=!1){if(this._geometry)this._geometry.setIndices(e,t,i);else{const t=new f.x;t.indices=e;const n=this.getScene();new _.Z(_.Z.RandomId(),n,t,i,this)}return this}updateIndices(e,t,i=!1){return this._geometry?(this._geometry.updateIndices(e,t,i),this):this}toLeftHanded(){return this._geometry?(this._geometry.toLeftHanded(),this):this}_bind(e,t,i,n=!0){if(!this._geometry)return this;const s=this.getScene().getEngine();let r;if(this.morphTargetManager&&this.morphTargetManager.isUsingTextureForTargets&&this.morphTargetManager._bind(t),this._unIndexed)r=null;else switch(this._getRenderingFillMode(i)){case v.F.PointFillMode:r=null;break;case v.F.WireFrameFillMode:r=e._getLinesIndexBuffer(this.getIndices(),s);break;default:case v.F.TriangleFillMode:r=this._geometry.getIndexBuffer()}return n&&this._userInstancedBuffersStorage&&!this.hasThinInstances?this._geometry._bind(t,r,this._userInstancedBuffersStorage.vertexBuffers,this._userInstancedBuffersStorage.vertexArrayObjects):this._geometry._bind(t,r),this}_draw(e,t,i){if(!this._geometry||!this._geometry.getVertexBuffers()||!this._unIndexed&&!this._geometry.getIndexBuffer())return this;this._internalMeshDataInfo._onBeforeDrawObservable&&this._internalMeshDataInfo._onBeforeDrawObservable.notifyObservers(this);const n=this.getScene().getEngine();return this._unIndexed||t==v.F.PointFillMode?n.drawArraysType(t,e.verticesStart,e.verticesCount,this.forcedInstanceCount||i):t==v.F.WireFrameFillMode?n.drawElementsType(t,0,e._linesIndexCount,this.forcedInstanceCount||i):n.drawElementsType(t,e.indexStart,e.indexCount,this.forcedInstanceCount||i),this}registerBeforeRender(e){return this.onBeforeRenderObservable.add(e),this}unregisterBeforeRender(e){return this.onBeforeRenderObservable.removeCallback(e),this}registerAfterRender(e){return this.onAfterRenderObservable.add(e),this}unregisterAfterRender(e){return this.onAfterRenderObservable.removeCallback(e),this}_getInstancesRenderList(e,t=!1){if(this._instanceDataStorage.isFrozen){if(t)return this._instanceDataStorage.batchCacheReplacementModeInFrozenMode.hardwareInstancedRendering[e]=!1,this._instanceDataStorage.batchCacheReplacementModeInFrozenMode.renderSelf[e]=!0,this._instanceDataStorage.batchCacheReplacementModeInFrozenMode;if(this._instanceDataStorage.previousBatch)return this._instanceDataStorage.previousBatch}const i=this.getScene(),n=i._isInIntermediateRendering(),s=n?this._internalAbstractMeshDataInfo._onlyForInstancesIntermediate:this._internalAbstractMeshDataInfo._onlyForInstances,r=this._instanceDataStorage.batchCache;if(r.mustReturn=!1,r.renderSelf[e]=t||!s&&this.isEnabled()&&this.isVisible,r.visibleInstances[e]=null,this._instanceDataStorage.visibleInstances&&!t){const t=this._instanceDataStorage.visibleInstances,s=i.getRenderId(),o=n?t.intermediateDefaultRenderId:t.defaultRenderId;r.visibleInstances[e]=t[s],!r.visibleInstances[e]&&o&&(r.visibleInstances[e]=t[o])}return r.hardwareInstancedRendering[e]=!t&&this._instanceDataStorage.hardwareInstancedRendering&&null!==r.visibleInstances[e]&&void 0!==r.visibleInstances[e],this._instanceDataStorage.previousBatch=r,r}_renderWithInstances(e,t,i,n,s){var r;const o=i.visibleInstances[e._id],a=o?o.length:0,l=this._instanceDataStorage,h=l.instancesBufferSize;let u=l.instancesBuffer,d=l.instancesPreviousBuffer;const f=16*(a+1)*4;for(;l.instancesBufferSize<f;)l.instancesBufferSize*=2;l.instancesData&&h==l.instancesBufferSize||(l.instancesData=new Float32Array(l.instancesBufferSize/4)),(this._scene.needsPreviousWorldMatrices&&!l.instancesPreviousData||h!=l.instancesBufferSize)&&(l.instancesPreviousData=new Float32Array(l.instancesBufferSize/4));let _=0,m=0;const g=i.renderSelf[e._id],v=!u||h!==l.instancesBufferSize||this._scene.needsPreviousWorldMatrices&&!l.instancesPreviousBuffer;if(this._instanceDataStorage.manualUpdate||l.isFrozen&&!v)m=(g?1:0)+a;else{const t=this.getWorldMatrix();if(g&&(this._scene.needsPreviousWorldMatrices&&(l.masterMeshPreviousWorldMatrix?(l.masterMeshPreviousWorldMatrix.copyToArray(l.instancesPreviousData,_),l.masterMeshPreviousWorldMatrix.copyFrom(t)):(l.masterMeshPreviousWorldMatrix=t.clone(),l.masterMeshPreviousWorldMatrix.copyToArray(l.instancesPreviousData,_))),t.copyToArray(l.instancesData,_),_+=16,m++),o){if(O.INSTANCEDMESH_SORT_TRANSPARENT&&this._scene.activeCamera&&(null===(r=e.getMaterial())||void 0===r?void 0:r.needAlphaBlendingForMesh(e.getRenderingMesh()))){const e=this._scene.activeCamera.globalPosition;for(let t=0;t<o.length;t++){const i=o[t];i._distanceToCamera=c.P.Distance(i.getBoundingInfo().boundingSphere.centerWorld,e)}o.sort(((e,t)=>e._distanceToCamera>t._distanceToCamera?-1:e._distanceToCamera<t._distanceToCamera?1:0))}for(let e=0;e<o.length;e++){const t=o[e],i=t.getWorldMatrix();i.copyToArray(l.instancesData,_),this._scene.needsPreviousWorldMatrices&&(t._previousWorldMatrix?(t._previousWorldMatrix.copyToArray(l.instancesPreviousData,_),t._previousWorldMatrix.copyFrom(i)):(t._previousWorldMatrix=i.clone(),t._previousWorldMatrix.copyToArray(l.instancesPreviousData,_))),_+=16,m++}}}return v?(u&&u.dispose(),d&&d.dispose(),u=new p.l(s,l.instancesData,!0,16,!1,!0),l.instancesBuffer=u,this._userInstancedBuffersStorage||(this._userInstancedBuffersStorage={data:{},vertexBuffers:{},strides:{},sizes:{},vertexArrayObjects:this.getEngine().getCaps().vertexArrayObject?{}:void 0}),this._userInstancedBuffersStorage.vertexBuffers.world0=u.createVertexBuffer("world0",0,4),this._userInstancedBuffersStorage.vertexBuffers.world1=u.createVertexBuffer("world1",4,4),this._userInstancedBuffersStorage.vertexBuffers.world2=u.createVertexBuffer("world2",8,4),this._userInstancedBuffersStorage.vertexBuffers.world3=u.createVertexBuffer("world3",12,4),this._scene.needsPreviousWorldMatrices&&(d=new p.l(s,l.instancesPreviousData,!0,16,!1,!0),l.instancesPreviousBuffer=d,this._userInstancedBuffersStorage.vertexBuffers.previousWorld0=d.createVertexBuffer("previousWorld0",0,4),this._userInstancedBuffersStorage.vertexBuffers.previousWorld1=d.createVertexBuffer("previousWorld1",4,4),this._userInstancedBuffersStorage.vertexBuffers.previousWorld2=d.createVertexBuffer("previousWorld2",8,4),this._userInstancedBuffersStorage.vertexBuffers.previousWorld3=d.createVertexBuffer("previousWorld3",12,4)),this._invalidateInstanceVertexArrayObject()):this._instanceDataStorage.isFrozen&&!this._instanceDataStorage.forceMatrixUpdates||(u.updateDirectly(l.instancesData,0,m),!this._scene.needsPreviousWorldMatrices||this._instanceDataStorage.manualUpdate&&!this._instanceDataStorage.previousManualUpdate||d.updateDirectly(l.instancesPreviousData,0,m)),this._processInstancedBuffers(o,g),this.getScene()._activeIndices.addCount(e.indexCount*m,!1),s._currentDrawContext&&(s._currentDrawContext.useInstancing=!0),this._bind(e,n,t),this._draw(e,t,m),!this._scene.needsPreviousWorldMatrices||v||!this._instanceDataStorage.manualUpdate||this._instanceDataStorage.isFrozen&&!this._instanceDataStorage.forceMatrixUpdates||this._instanceDataStorage.previousManualUpdate||d.updateDirectly(l.instancesData,0,m),s.unbindInstanceAttributes(),this}_renderWithThinInstances(e,t,i,n){var s,r;const o=null!==(r=null===(s=this._thinInstanceDataStorage)||void 0===s?void 0:s.instancesCount)&&void 0!==r?r:0;this.getScene()._activeIndices.addCount(e.indexCount*o,!1),n._currentDrawContext&&(n._currentDrawContext.useInstancing=!0),this._bind(e,i,t),this._draw(e,t,o),this._scene.needsPreviousWorldMatrices&&!this._thinInstanceDataStorage.previousMatrixData&&this._thinInstanceDataStorage.matrixData&&(this._thinInstanceDataStorage.previousMatrixBuffer?this._thinInstanceDataStorage.previousMatrixBuffer.updateDirectly(this._thinInstanceDataStorage.matrixData,0,o):this._thinInstanceDataStorage.previousMatrixBuffer=this._thinInstanceCreateMatrixBuffer("previousWorld",this._thinInstanceDataStorage.matrixData,!1)),n.unbindInstanceAttributes()}_processInstancedBuffers(e,t){}_processRendering(e,t,i,n,s,r,o,a){const l=this.getScene(),h=l.getEngine();if(n=this._getRenderingFillMode(n),r&&t.getRenderingMesh().hasThinInstances)return this._renderWithThinInstances(t,n,i,h),this;if(r)this._renderWithInstances(t,n,s,i,h);else{h._currentDrawContext&&(h._currentDrawContext.useInstancing=!1);let i=0;s.renderSelf[t._id]&&(o&&o(!1,e.getWorldMatrix(),a),i++,this._draw(t,n,this._instanceDataStorage.overridenInstanceCount));const r=s.visibleInstances[t._id];if(r){const e=r.length;i+=e;for(let i=0;i<e;i++){const e=r[i].getWorldMatrix();o&&o(!0,e,a),this._draw(t,n)}}l._activeIndices.addCount(t.indexCount*i,!1)}return this}_rebuild(e=!1){if(this._instanceDataStorage.instancesBuffer&&(e&&this._instanceDataStorage.instancesBuffer.dispose(),this._instanceDataStorage.instancesBuffer=null),this._userInstancedBuffersStorage){for(const t in this._userInstancedBuffersStorage.vertexBuffers){const i=this._userInstancedBuffersStorage.vertexBuffers[t];i&&(e&&i.dispose(),this._userInstancedBuffersStorage.vertexBuffers[t]=null)}this._userInstancedBuffersStorage.vertexArrayObjects&&(this._userInstancedBuffersStorage.vertexArrayObjects={})}this._internalMeshDataInfo._effectiveMaterial=null,super._rebuild(e)}_freeze(){if(this.subMeshes){for(let e=0;e<this.subMeshes.length;e++)this._getInstancesRenderList(e);this._internalMeshDataInfo._effectiveMaterial=null,this._instanceDataStorage.isFrozen=!0}}_unFreeze(){this._instanceDataStorage.isFrozen=!1,this._instanceDataStorage.previousBatch=null}render(e,t,i){var n,s,r;const o=this.getScene();if(this._internalAbstractMeshDataInfo._isActiveIntermediate?this._internalAbstractMeshDataInfo._isActiveIntermediate=!1:this._internalAbstractMeshDataInfo._isActive=!1,this._checkOcclusionQuery()&&!this._occlusionDataStorage.forceRenderingWhenOccluded)return this;const a=this._getInstancesRenderList(e._id,!!i);if(a.mustReturn)return this;if(!this._geometry||!this._geometry.getVertexBuffers()||!this._unIndexed&&!this._geometry.getIndexBuffer())return this;const l=o.getEngine();let c=0,u=null;this.ignoreCameraMaxZ&&o.activeCamera&&!o._isInIntermediateRendering()&&(c=o.activeCamera.maxZ,u=o.activeCamera,o.activeCamera.maxZ=0,o.updateTransformMatrix(!0)),this._internalMeshDataInfo._onBeforeRenderObservable&&this._internalMeshDataInfo._onBeforeRenderObservable.notifyObservers(this);const d=e.getRenderingMesh(),p=a.hardwareInstancedRendering[e._id]||d.hasThinInstances||!!this._userInstancedBuffersStorage&&!e.getMesh()._internalAbstractMeshDataInfo._actAsRegularMesh,f=this._instanceDataStorage,_=e.getMaterial();if(!_)return u&&(u.maxZ=c,o.updateTransformMatrix(!0)),this;if(f.isFrozen&&this._internalMeshDataInfo._effectiveMaterial&&this._internalMeshDataInfo._effectiveMaterial===_){if(_._storeEffectOnSubMeshes&&!(null===(n=e.effect)||void 0===n?void 0:n._wasPreviouslyReady)||!_._storeEffectOnSubMeshes&&!(null===(s=_.getEffect())||void 0===s?void 0:s._wasPreviouslyReady))return u&&(u.maxZ=c,o.updateTransformMatrix(!0)),this}else{if(_._storeEffectOnSubMeshes){if(!_.isReadyForSubMesh(this,e,p))return u&&(u.maxZ=c,o.updateTransformMatrix(!0)),this}else if(!_.isReady(this,p))return u&&(u.maxZ=c,o.updateTransformMatrix(!0)),this;this._internalMeshDataInfo._effectiveMaterial=_}let m;t&&l.setAlphaMode(this._internalMeshDataInfo._effectiveMaterial.alphaMode),m=this._internalMeshDataInfo._effectiveMaterial._storeEffectOnSubMeshes?e._drawWrapper:this._internalMeshDataInfo._effectiveMaterial._getDrawWrapper();const g=null!==(r=null==m?void 0:m.effect)&&void 0!==r?r:null;for(const t of o._beforeRenderingMeshStage)t.action(this,e,a,g);if(!m||!g)return u&&(u.maxZ=c,o.updateTransformMatrix(!0)),this;const y=i||this;let x;if(f.isFrozen||!this._internalMeshDataInfo._effectiveMaterial.backFaceCulling&&null===this.overrideMaterialSideOrientation)x=f.sideOrientation;else{const e=y._getWorldMatrixDeterminant();x=this.overrideMaterialSideOrientation,null==x&&(x=this._internalMeshDataInfo._effectiveMaterial.sideOrientation),e<0&&(x=x===v.F.ClockWiseSideOrientation?v.F.CounterClockWiseSideOrientation:v.F.ClockWiseSideOrientation),f.sideOrientation=x}const b=this._internalMeshDataInfo._effectiveMaterial._preBind(m,x);this._internalMeshDataInfo._effectiveMaterial.forceDepthWrite&&l.setDepthWrite(!0);const T=this._internalMeshDataInfo._effectiveMaterial,S=T.fillMode;this._internalMeshDataInfo._onBeforeBindObservable&&this._internalMeshDataInfo._onBeforeBindObservable.notifyObservers(this),p||this._bind(e,g,S,!1);const E=y.getWorldMatrix();T._storeEffectOnSubMeshes?T.bindForSubMesh(E,this,e):T.bind(E,this),!T.backFaceCulling&&T.separateCullingPass&&(l.setState(!0,T.zOffset,!1,!b,T.cullBackFaces,T.stencil,T.zOffsetUnits),this._processRendering(this,e,g,S,a,p,this._onBeforeDraw,this._internalMeshDataInfo._effectiveMaterial),l.setState(!0,T.zOffset,!1,b,T.cullBackFaces,T.stencil,T.zOffsetUnits),this._internalMeshDataInfo._onBetweenPassObservable&&this._internalMeshDataInfo._onBetweenPassObservable.notifyObservers(e)),this._processRendering(this,e,g,S,a,p,this._onBeforeDraw,this._internalMeshDataInfo._effectiveMaterial),this._internalMeshDataInfo._effectiveMaterial.unbind();for(const t of o._afterRenderingMeshStage)t.action(this,e,a,g);return this._internalMeshDataInfo._onAfterRenderObservable&&this._internalMeshDataInfo._onAfterRenderObservable.notifyObservers(this),u&&(u.maxZ=c,o.updateTransformMatrix(!0)),o.performancePriority!==h.a.Aggressive||f.isFrozen||this._freeze(),this}cleanMatrixWeights(){this.isVerticesDataPresent(p.o.MatricesWeightsKind)&&(this.isVerticesDataPresent(p.o.MatricesWeightsExtraKind)?this._normalizeSkinWeightsAndExtra():this._normalizeSkinFourWeights())}_normalizeSkinFourWeights(){const e=this.getVerticesData(p.o.MatricesWeightsKind),t=e.length;for(let i=0;i<t;i+=4){const t=e[i]+e[i+1]+e[i+2]+e[i+3];if(0===t)e[i]=1;else{const n=1/t;e[i]*=n,e[i+1]*=n,e[i+2]*=n,e[i+3]*=n}}this.setVerticesData(p.o.MatricesWeightsKind,e)}_normalizeSkinWeightsAndExtra(){const e=this.getVerticesData(p.o.MatricesWeightsExtraKind),t=this.getVerticesData(p.o.MatricesWeightsKind),i=t.length;for(let n=0;n<i;n+=4){let i=t[n]+t[n+1]+t[n+2]+t[n+3];if(i+=e[n]+e[n+1]+e[n+2]+e[n+3],0===i)t[n]=1;else{const s=1/i;t[n]*=s,t[n+1]*=s,t[n+2]*=s,t[n+3]*=s,e[n]*=s,e[n+1]*=s,e[n+2]*=s,e[n+3]*=s}}this.setVerticesData(p.o.MatricesWeightsKind,t),this.setVerticesData(p.o.MatricesWeightsKind,e)}validateSkinning(){const e=this.getVerticesData(p.o.MatricesWeightsExtraKind),t=this.getVerticesData(p.o.MatricesWeightsKind);if(null===t||null==this.skeleton)return{skinned:!1,valid:!0,report:"not skinned"};const i=t.length;let n=0,s=0,r=0,o=0;const a=null===e?4:8,l=new Array;for(let e=0;e<=a;e++)l[e]=0;for(let h=0;h<i;h+=4){let i=t[h],c=i,u=0===c?0:1;for(let s=1;s<a;s++){const r=s<4?t[h+s]:e[h+s-4];r>i&&n++,0!==r&&u++,c+=r,i=r}if(l[u]++,u>r&&(r=u),0===c)s++;else{const i=1/c;let n=0;for(let s=0;s<a;s++)n+=s<4?Math.abs(t[h+s]-t[h+s]*i):Math.abs(e[h+s-4]-e[h+s-4]*i);n>.001&&o++}}const h=this.skeleton.bones.length,c=this.getVerticesData(p.o.MatricesIndicesKind),u=this.getVerticesData(p.o.MatricesIndicesExtraKind);let d=0;for(let e=0;e<i;e+=4)for(let t=0;t<a;t++){const i=t<4?c[e+t]:u[e+t-4];(i>=h||i<0)&&d++}return{skinned:!0,valid:0===s&&0===o&&0===d,report:"Number of Weights = "+i/4+"\nMaximum influences = "+r+"\nMissing Weights = "+s+"\nNot Sorted = "+n+"\nNot Normalized = "+o+"\nWeightCounts = ["+l+"]\nNumber of bones = "+h+"\nBad Bone Indices = "+d}}_checkDelayState(){const e=this.getScene();return this._geometry?this._geometry.load(e):4===this.delayLoadState&&(this.delayLoadState=2,this._queueLoad(e)),this}_queueLoad(e){e.addPendingData(this);const t=-1!==this.delayLoadingFile.indexOf(".babylonbinarymeshdata");return s.w1.LoadFile(this.delayLoadingFile,(t=>{t instanceof ArrayBuffer?this._delayLoadingFunction(t,this):this._delayLoadingFunction(JSON.parse(t),this),this.instances.forEach((e=>{e.refreshBoundingInfo(),e._syncSubMeshes()})),this.delayLoadState=1,e.removePendingData(this)}),(()=>{}),e.offlineProvider,t),this}isInFrustum(e){return 2!==this.delayLoadState&&!!super.isInFrustum(e)&&(this._checkDelayState(),!0)}setMaterialById(e){const t=this.getScene().materials;let i;for(i=t.length-1;i>-1;i--)if(t[i].id===e)return this.material=t[i],this;const n=this.getScene().multiMaterials;for(i=n.length-1;i>-1;i--)if(n[i].id===e)return this.material=n[i],this;return this}getAnimatables(){const e=new Array;return this.material&&e.push(this.material),this.skeleton&&e.push(this.skeleton),e}bakeTransformIntoVertices(e){if(!this.isVerticesDataPresent(p.o.PositionKind))return this;const t=this.subMeshes.splice(0);this._resetPointsArrayCache();let i=this.getVerticesData(p.o.PositionKind);const n=c.P.Zero();let s;for(s=0;s<i.length;s+=3)c.P.TransformCoordinatesFromFloatsToRef(i[s],i[s+1],i[s+2],e,n).toArray(i,s);if(this.setVerticesData(p.o.PositionKind,i,this.getVertexBuffer(p.o.PositionKind).isUpdatable()),this.isVerticesDataPresent(p.o.NormalKind)){for(i=this.getVerticesData(p.o.NormalKind),s=0;s<i.length;s+=3)c.P.TransformNormalFromFloatsToRef(i[s],i[s+1],i[s+2],e,n).normalize().toArray(i,s);this.setVerticesData(p.o.NormalKind,i,this.getVertexBuffer(p.o.NormalKind).isUpdatable())}return e.determinant()<0&&this.flipFaces(),this.releaseSubMeshes(),this.subMeshes=t,this}bakeCurrentTransformIntoVertices(e=!0){return this.bakeTransformIntoVertices(this.computeWorldMatrix(!0)),this.resetLocalMatrix(e),this}get _positions(){return this._internalAbstractMeshDataInfo._positions?this._internalAbstractMeshDataInfo._positions:this._geometry?this._geometry._positions:null}_resetPointsArrayCache(){return this._geometry&&this._geometry._resetPointsArrayCache(),this}_generatePointsArray(){return!!this._geometry&&this._geometry._generatePointsArray()}clone(e="",t=null,i,n=!0){return new O(e,this.getScene(),t,this,i,n)}dispose(e,t=!1){this.morphTargetManager=null,this._geometry&&this._geometry.releaseForMesh(this,!0);const i=this._internalMeshDataInfo;if(i._onBeforeDrawObservable&&i._onBeforeDrawObservable.clear(),i._onBeforeBindObservable&&i._onBeforeBindObservable.clear(),i._onBeforeRenderObservable&&i._onBeforeRenderObservable.clear(),i._onAfterRenderObservable&&i._onAfterRenderObservable.clear(),i._onBetweenPassObservable&&i._onBetweenPassObservable.clear(),this._scene.useClonedMeshMap){if(i.meshMap)for(const e in i.meshMap){const t=i.meshMap[e];t&&(t._internalMeshDataInfo._source=null,i.meshMap[e]=void 0)}i._source&&i._source._internalMeshDataInfo.meshMap&&(i._source._internalMeshDataInfo.meshMap[this.uniqueId]=void 0)}else{const e=this.getScene().meshes;for(const t of e){const e=t;e._internalMeshDataInfo&&e._internalMeshDataInfo._source&&e._internalMeshDataInfo._source===this&&(e._internalMeshDataInfo._source=null)}}i._source=null,this._instanceDataStorage.visibleInstances={},this._disposeInstanceSpecificData(),this._disposeThinInstanceSpecificData(),this._internalMeshDataInfo._checkReadinessObserver&&this._scene.onBeforeRenderObservable.remove(this._internalMeshDataInfo._checkReadinessObserver),super.dispose(e,t)}_disposeInstanceSpecificData(){}_disposeThinInstanceSpecificData(){}_invalidateInstanceVertexArrayObject(){}applyDisplacementMap(e,t,i,n,r,o,a=!1){const l=this.getScene();return s.w1.LoadImage(e,(e=>{const s=e.width,l=e.height,h=this.getEngine().createCanvas(s,l).getContext("2d");h.drawImage(e,0,0);const c=h.getImageData(0,0,s,l).data;this.applyDisplacementMapFromBuffer(c,s,l,t,i,r,o,a),n&&n(this)}),(()=>{}),l.offlineProvider),this}applyDisplacementMapFromBuffer(e,t,i,n,s,r,o,a=!1){if(!this.isVerticesDataPresent(p.o.PositionKind)||!this.isVerticesDataPresent(p.o.NormalKind)||!this.isVerticesDataPresent(p.o.UVKind))return T.Y.Warn("Cannot call applyDisplacementMap: Given mesh is not complete. Position, Normal or UV are missing"),this;const l=this.getVerticesData(p.o.PositionKind,!0,!0),h=this.getVerticesData(p.o.NormalKind),u=this.getVerticesData(p.o.UVKind);let d=c.P.Zero();const _=c.P.Zero(),m=c.FM.Zero();r=r||c.FM.Zero(),o=o||new c.FM(1,1);for(let a=0;a<l.length;a+=3){c.P.FromArrayToRef(l,a,d),c.P.FromArrayToRef(h,a,_),c.FM.FromArrayToRef(u,a/3*2,m);const p=4*((Math.abs(m.x*o.x+r.x%1)*(t-1)%t|0)+(Math.abs(m.y*o.y+r.y%1)*(i-1)%i|0)*t),f=e[p]/255*.3+e[p+1]/255*.59+e[p+2]/255*.11;_.normalize(),_.scaleInPlace(n+(s-n)*f),d=d.add(_),d.toArray(l,a)}return f.x.ComputeNormals(l,this.getIndices(),h),a?(this.setVerticesData(p.o.PositionKind,l),this.setVerticesData(p.o.NormalKind,h),this.setVerticesData(p.o.UVKind,u)):(this.updateVerticesData(p.o.PositionKind,l),this.updateVerticesData(p.o.NormalKind,h)),this}convertToFlatShadedMesh(){const e=this.getVerticesDataKinds(),t={},i={},n={};let s,r,o=!1;for(s=0;s<e.length;s++){r=e[s];const a=this.getVertexBuffer(r),l=a.getData();(l instanceof Array||l instanceof Float32Array)&&0===l.length||(r!==p.o.NormalKind?(t[r]=a,i[r]=this.getVerticesData(r),n[r]=[]):(o=a.isUpdatable(),e.splice(s,1),s--))}const a=this.subMeshes.slice(0),l=this.getIndices(),h=this.getTotalIndices();let u;for(u=0;u<h;u++){const o=l[u];for(s=0;s<e.length;s++){if(r=e[s],!t[r])continue;const a=t[r].getStrideSize();for(let e=0;e<a;e++)n[r].push(i[r][o*a+e])}}const d=[],f=n[p.o.PositionKind];let _;for(_=this.getScene().useRightHandedSystem?1===this.overrideMaterialSideOrientation:0===this.overrideMaterialSideOrientation,u=0;u<h;u+=3){l[u]=u,l[u+1]=u+1,l[u+2]=u+2;const e=c.P.FromArray(f,3*u),t=c.P.FromArray(f,3*(u+1)),i=c.P.FromArray(f,3*(u+2)),n=e.subtract(t),s=i.subtract(t),r=c.P.Normalize(c.P.Cross(n,s));_&&r.scaleInPlace(-1);for(let e=0;e<3;e++)d.push(r.x),d.push(r.y),d.push(r.z)}for(this.setIndices(l),this.setVerticesData(p.o.NormalKind,d,o),s=0;s<e.length;s++)r=e[s],n[r]&&this.setVerticesData(r,n[r],t[r].isUpdatable());this.releaseSubMeshes();for(let e=0;e<a.length;e++){const t=a[e];g.P.AddToMesh(t.materialIndex,t.indexStart,t.indexCount,t.indexStart,t.indexCount,this)}return this.synchronizeInstances(),this}convertToUnIndexedMesh(){const e=this.getVerticesDataKinds(),t={},i={},n={};let s,r;for(s=0;s<e.length;s++){r=e[s];const o=this.getVertexBuffer(r);t[r]=o,i[r]=t[r].getData(),n[r]=[]}const o=this.subMeshes.slice(0),a=this.getIndices(),l=this.getTotalIndices();let h;for(h=0;h<l;h++){const o=a[h];for(s=0;s<e.length;s++){r=e[s];const a=t[r].getStrideSize();for(let e=0;e<a;e++)n[r].push(i[r][o*a+e])}}for(h=0;h<l;h+=3)a[h]=h,a[h+1]=h+1,a[h+2]=h+2;for(this.setIndices(a),s=0;s<e.length;s++)r=e[s],this.setVerticesData(r,n[r],t[r].isUpdatable(),t[r].getStrideSize());this.releaseSubMeshes();for(let e=0;e<o.length;e++){const t=o[e];g.P.AddToMesh(t.materialIndex,t.indexStart,t.indexCount,t.indexStart,t.indexCount,this)}return this._unIndexed=!0,this.synchronizeInstances(),this}flipFaces(e=!1){const t=f.x.ExtractFromMesh(this);let i;if(e&&this.isVerticesDataPresent(p.o.NormalKind)&&t.normals)for(i=0;i<t.normals.length;i++)t.normals[i]*=-1;if(t.indices){let e;for(i=0;i<t.indices.length;i+=3)e=t.indices[i+1],t.indices[i+1]=t.indices[i+2],t.indices[i+2]=e}return t.applyToMesh(this,this.isVertexBufferUpdatable(p.o.PositionKind)),this}increaseVertices(e=1){const t=f.x.ExtractFromMesh(this),i=t.indices&&!Array.isArray(t.indices)&&Array.from?Array.from(t.indices):t.indices,n=t.positions&&!Array.isArray(t.positions)&&Array.from?Array.from(t.positions):t.positions,s=t.uvs&&!Array.isArray(t.uvs)&&Array.from?Array.from(t.uvs):t.uvs,r=t.normals&&!Array.isArray(t.normals)&&Array.from?Array.from(t.normals):t.normals;if(i&&n){t.indices=i,t.positions=n,s&&(t.uvs=s),r&&(t.normals=r);const o=e+1,a=new Array;for(let e=0;e<o+1;e++)a[e]=new Array;let l,h;const u=new c.P(0,0,0),d=new c.P(0,0,0),f=new c.FM(0,0),_=new Array,m=new Array,g=new Array;let v,y,x,b=n.length;s&&(y=s.length),r&&(x=r.length);for(let e=0;e<i.length;e+=3){m[0]=i[e],m[1]=i[e+1],m[2]=i[e+2];for(let e=0;e<3;e++)if(l=m[e],h=m[(e+1)%3],void 0===g[l]&&void 0===g[h]?(g[l]=new Array,g[h]=new Array):(void 0===g[l]&&(g[l]=new Array),void 0===g[h]&&(g[h]=new Array)),void 0===g[l][h]&&void 0===g[h][l]){g[l][h]=[],u.x=(n[3*h]-n[3*l])/o,u.y=(n[3*h+1]-n[3*l+1])/o,u.z=(n[3*h+2]-n[3*l+2])/o,r&&(d.x=(r[3*h]-r[3*l])/o,d.y=(r[3*h+1]-r[3*l+1])/o,d.z=(r[3*h+2]-r[3*l+2])/o),s&&(f.x=(s[2*h]-s[2*l])/o,f.y=(s[2*h+1]-s[2*l+1])/o),g[l][h].push(l);for(let e=1;e<o;e++)g[l][h].push(n.length/3),n[b++]=n[3*l]+e*u.x,n[b++]=n[3*l+1]+e*u.y,n[b++]=n[3*l+2]+e*u.z,r&&(r[x++]=r[3*l]+e*d.x,r[x++]=r[3*l+1]+e*d.y,r[x++]=r[3*l+2]+e*d.z),s&&(s[y++]=s[2*l]+e*f.x,s[y++]=s[2*l+1]+e*f.y);g[l][h].push(h),g[h][l]=new Array,v=g[l][h].length;for(let e=0;e<v;e++)g[h][l][e]=g[l][h][v-1-e]}a[0][0]=i[e],a[1][0]=g[i[e]][i[e+1]][1],a[1][1]=g[i[e]][i[e+2]][1];for(let t=2;t<o;t++){a[t][0]=g[i[e]][i[e+1]][t],a[t][t]=g[i[e]][i[e+2]][t],u.x=(n[3*a[t][t]]-n[3*a[t][0]])/t,u.y=(n[3*a[t][t]+1]-n[3*a[t][0]+1])/t,u.z=(n[3*a[t][t]+2]-n[3*a[t][0]+2])/t,r&&(d.x=(r[3*a[t][t]]-r[3*a[t][0]])/t,d.y=(r[3*a[t][t]+1]-r[3*a[t][0]+1])/t,d.z=(r[3*a[t][t]+2]-r[3*a[t][0]+2])/t),s&&(f.x=(s[2*a[t][t]]-s[2*a[t][0]])/t,f.y=(s[2*a[t][t]+1]-s[2*a[t][0]+1])/t);for(let e=1;e<t;e++)a[t][e]=n.length/3,n[b++]=n[3*a[t][0]]+e*u.x,n[b++]=n[3*a[t][0]+1]+e*u.y,n[b++]=n[3*a[t][0]+2]+e*u.z,r&&(r[x++]=r[3*a[t][0]]+e*d.x,r[x++]=r[3*a[t][0]+1]+e*d.y,r[x++]=r[3*a[t][0]+2]+e*d.z),s&&(s[y++]=s[2*a[t][0]]+e*f.x,s[y++]=s[2*a[t][0]+1]+e*f.y)}a[o]=g[i[e+1]][i[e+2]],_.push(a[0][0],a[1][0],a[1][1]);for(let e=1;e<o;e++){let t;for(t=0;t<e;t++)_.push(a[e][t],a[e+1][t],a[e+1][t+1]),_.push(a[e][t],a[e+1][t+1],a[e][t+1]);_.push(a[e][t],a[e+1][t],a[e+1][t+1])}}t.indices=_,t.applyToMesh(this,this.isVertexBufferUpdatable(p.o.PositionKind))}else T.Y.Warn("Couldn't increase number of vertices : VertexData must contain at least indices and positions")}forceSharedVertices(){const e=f.x.ExtractFromMesh(this),t=e.uvs,i=e.indices,n=e.positions,s=e.colors,r=e.matricesIndices,o=e.matricesWeights,a=e.matricesIndicesExtra,l=e.matricesWeightsExtra;if(void 0===i||void 0===n||null===i||null===n)T.Y.Warn("VertexData contains empty entries");else{const h=new Array,c=new Array,u=new Array,d=new Array,_=new Array,m=new Array,g=new Array,v=new Array;let y=new Array,x=0;const b={};let T,S;for(let e=0;e<i.length;e+=3){S=[i[e],i[e+1],i[e+2]],y=new Array;for(let e=0;e<3;e++){y[e]="";for(let t=0;t<3;t++)Math.abs(n[3*S[e]+t])<1e-8&&(n[3*S[e]+t]=0),y[e]+=n[3*S[e]+t]+"|"}if(y[0]!=y[1]&&y[0]!=y[2]&&y[1]!=y[2])for(let e=0;e<3;e++){if(T=b[y[e]],void 0===T){b[y[e]]=x,T=x++;for(let t=0;t<3;t++)h.push(n[3*S[e]+t]);if(null!=s)for(let t=0;t<4;t++)d.push(s[4*S[e]+t]);if(null!=t)for(let i=0;i<2;i++)u.push(t[2*S[e]+i]);if(null!=r)for(let t=0;t<4;t++)_.push(r[4*S[e]+t]);if(null!=o)for(let t=0;t<4;t++)m.push(o[4*S[e]+t]);if(null!=a)for(let t=0;t<4;t++)g.push(a[4*S[e]+t]);if(null!=l)for(let t=0;t<4;t++)v.push(l[4*S[e]+t])}c.push(T)}}const E=new Array;f.x.ComputeNormals(h,c,E),e.positions=h,e.indices=c,e.normals=E,null!=t&&(e.uvs=u),null!=s&&(e.colors=d),null!=r&&(e.matricesIndices=_),null!=o&&(e.matricesWeights=m),null!=a&&(e.matricesIndicesExtra=g),null!=o&&(e.matricesWeightsExtra=v),e.applyToMesh(this,this.isVertexBufferUpdatable(p.o.PositionKind))}}static _instancedMeshFactory(e,t){throw(0,E.S)("InstancedMesh")}static _PhysicsImpostorParser(e,t,i){throw(0,E.S)("PhysicsImpostor")}createInstance(e){return O._instancedMeshFactory(e,this)}synchronizeInstances(){for(let e=0;e<this.instances.length;e++)this.instances[e]._syncSubMeshes();return this}optimizeIndices(e){const t=this.getIndices(),i=this.getVerticesData(p.o.PositionKind);if(!i||!t)return this;const n=new Array;for(let e=0;e<i.length;e+=3)n.push(c.P.FromArray(i,e));const r=new Array;return s.$g.SyncAsyncForLoop(n.length,40,(e=>{const t=n.length-1-e,i=n[t];for(let e=0;e<t;++e){const s=n[e];if(i.equals(s)){r[t]=e;break}}}),(()=>{for(let e=0;e<t.length;++e)t[e]=r[t[e]]||t[e];const i=this.subMeshes.slice(0);this.setIndices(t),this.subMeshes=i,e&&e(this)})),this}serialize(e={}){e.name=this.name,e.id=this.id,e.uniqueId=this.uniqueId,e.type=this.getClassName(),o.$&&o.$.HasTags(this)&&(e.tags=o.$.GetTags(this)),e.position=this.position.asArray(),this.rotationQuaternion?e.rotationQuaternion=this.rotationQuaternion.asArray():this.rotation&&(e.rotation=this.rotation.asArray()),e.scaling=this.scaling.asArray(),this._postMultiplyPivotMatrix?e.pivotMatrix=this.getPivotMatrix().asArray():e.localMatrix=this.getPivotMatrix().asArray(),e.isEnabled=this.isEnabled(!1),e.isVisible=this.isVisible,e.infiniteDistance=this.infiniteDistance,e.pickable=this.isPickable,e.receiveShadows=this.receiveShadows,e.billboardMode=this.billboardMode,e.visibility=this.visibility,e.checkCollisions=this.checkCollisions,e.isBlocker=this.isBlocker,e.overrideMaterialSideOrientation=this.overrideMaterialSideOrientation,this.parent&&this.parent._serializeAsParent(e),e.isUnIndexed=this.isUnIndexed;const t=this._geometry;if(t&&this.subMeshes){e.geometryUniqueId=t.uniqueId,e.geometryId=t.id,e.subMeshes=[];for(let t=0;t<this.subMeshes.length;t++){const i=this.subMeshes[t];e.subMeshes.push({materialIndex:i.materialIndex,verticesStart:i.verticesStart,verticesCount:i.verticesCount,indexStart:i.indexStart,indexCount:i.indexCount})}}if(this.material?this.material.doNotSerialize||(e.materialUniqueId=this.material.uniqueId,e.materialId=this.material.id):(this.material=null,e.materialUniqueId=this._scene.defaultMaterial.uniqueId,e.materialId=this._scene.defaultMaterial.id),this.morphTargetManager&&(e.morphTargetManagerId=this.morphTargetManager.uniqueId),this.skeleton&&(e.skeletonId=this.skeleton.id,e.numBoneInfluencers=this.numBoneInfluencers),this.getScene()._getComponent(C.l.NAME_PHYSICSENGINE)){const t=this.getPhysicsImpostor();t&&(e.physicsMass=t.getParam("mass"),e.physicsFriction=t.getParam("friction"),e.physicsRestitution=t.getParam("mass"),e.physicsImpostor=t.type)}this.metadata&&(e.metadata=this.metadata),e.instances=[];for(let t=0;t<this.instances.length;t++){const i=this.instances[t];if(i.doNotSerialize)continue;const n={name:i.name,id:i.id,isEnabled:i.isEnabled(!1),isVisible:i.isVisible,isPickable:i.isPickable,checkCollisions:i.checkCollisions,position:i.position.asArray(),scaling:i.scaling.asArray()};if(i.parent&&i.parent._serializeAsParent(n),i.rotationQuaternion?n.rotationQuaternion=i.rotationQuaternion.asArray():i.rotation&&(n.rotation=i.rotation.asArray()),this.getScene()._getComponent(C.l.NAME_PHYSICSENGINE)){const e=i.getPhysicsImpostor();e&&(n.physicsMass=e.getParam("mass"),n.physicsFriction=e.getParam("friction"),n.physicsRestitution=e.getParam("mass"),n.physicsImpostor=e.type)}i.metadata&&(n.metadata=i.metadata),i.actionManager&&(n.actions=i.actionManager.serialize(i.name)),e.instances.push(n),b.p4.AppendSerializedAnimations(i,n),n.ranges=i.serializeAnimationRanges()}if(this._thinInstanceDataStorage.instancesCount&&this._thinInstanceDataStorage.matrixData&&(e.thinInstances={instancesCount:this._thinInstanceDataStorage.instancesCount,matrixData:Array.from(this._thinInstanceDataStorage.matrixData),matrixBufferSize:this._thinInstanceDataStorage.matrixBufferSize,enablePicking:this.thinInstanceEnablePicking},this._userThinInstanceBuffersStorage)){const t={data:{},sizes:{},strides:{}};for(const e in this._userThinInstanceBuffersStorage.data)t.data[e]=Array.from(this._userThinInstanceBuffersStorage.data[e]),t.sizes[e]=this._userThinInstanceBuffersStorage.sizes[e],t.strides[e]=this._userThinInstanceBuffersStorage.strides[e];e.thinInstances.userThinInstance=t}return b.p4.AppendSerializedAnimations(this,e),e.ranges=this.serializeAnimationRanges(),e.layerMask=this.layerMask,e.alphaIndex=this.alphaIndex,e.hasVertexAlpha=this.hasVertexAlpha,e.overlayAlpha=this.overlayAlpha,e.overlayColor=this.overlayColor.asArray(),e.renderOverlay=this.renderOverlay,e.applyFog=this.applyFog,this.actionManager&&(e.actions=this.actionManager.serialize(this.name)),e}_syncGeometryWithMorphTargetManager(){if(!this.geometry)return;this._markSubMeshesAsAttributesDirty();const e=this._internalAbstractMeshDataInfo._morphTargetManager;if(e&&e.vertexCount){if(e.vertexCount!==this.getTotalVertices())return T.Y.Error("Mesh is incompatible with morph targets. Targets and mesh must all have the same vertices count."),void(this.morphTargetManager=null);if(e.isUsingTextureForTargets)return;for(let t=0;t<e.numInfluencers;t++){const i=e.getActiveTarget(t),n=i.getPositions();if(!n)return void T.Y.Error("Invalid morph target. Target must have positions.");this.geometry.setVerticesData(p.o.PositionKind+t,n,!1,3);const s=i.getNormals();s&&this.geometry.setVerticesData(p.o.NormalKind+t,s,!1,3);const r=i.getTangents();r&&this.geometry.setVerticesData(p.o.TangentKind+t,r,!1,3);const o=i.getUVs();o&&this.geometry.setVerticesData(p.o.UVKind+"_"+t,o,!1,2)}}else{let e=0;for(;this.geometry.isVerticesDataPresent(p.o.PositionKind+e);)this.geometry.removeVerticesData(p.o.PositionKind+e),this.geometry.isVerticesDataPresent(p.o.NormalKind+e)&&this.geometry.removeVerticesData(p.o.NormalKind+e),this.geometry.isVerticesDataPresent(p.o.TangentKind+e)&&this.geometry.removeVerticesData(p.o.TangentKind+e),this.geometry.isVerticesDataPresent(p.o.UVKind+e)&&this.geometry.removeVerticesData(p.o.UVKind+"_"+e),e++}}static Parse(e,t,i){let n;if(n=e.type&&"LinesMesh"===e.type?O._LinesMeshParser(e,t):e.type&&"GroundMesh"===e.type?O._GroundMeshParser(e,t):e.type&&"GoldbergMesh"===e.type?O._GoldbergMeshParser(e,t):new O(e.name,t),n.id=e.id,n._waitingParsedUniqueId=e.uniqueId,o.$&&o.$.AddTagsTo(n,e.tags),n.position=c.P.FromArray(e.position),void 0!==e.metadata&&(n.metadata=e.metadata),e.rotationQuaternion?n.rotationQuaternion=c._f.FromArray(e.rotationQuaternion):e.rotation&&(n.rotation=c.P.FromArray(e.rotation)),n.scaling=c.P.FromArray(e.scaling),e.localMatrix?n.setPreTransformMatrix(c.y3.FromArray(e.localMatrix)):e.pivotMatrix&&n.setPivotMatrix(c.y3.FromArray(e.pivotMatrix)),n.setEnabled(e.isEnabled),n.isVisible=e.isVisible,n.infiniteDistance=e.infiniteDistance,n.showBoundingBox=e.showBoundingBox,n.showSubMeshesBoundingBox=e.showSubMeshesBoundingBox,void 0!==e.applyFog&&(n.applyFog=e.applyFog),void 0!==e.pickable&&(n.isPickable=e.pickable),void 0!==e.alphaIndex&&(n.alphaIndex=e.alphaIndex),n.receiveShadows=e.receiveShadows,void 0!==e.billboardMode&&(n.billboardMode=e.billboardMode),void 0!==e.visibility&&(n.visibility=e.visibility),n.checkCollisions=e.checkCollisions,n.overrideMaterialSideOrientation=e.overrideMaterialSideOrientation,void 0!==e.isBlocker&&(n.isBlocker=e.isBlocker),n._shouldGenerateFlatShading=e.useFlatShading,e.freezeWorldMatrix&&(n._waitingData.freezeWorldMatrix=e.freezeWorldMatrix),void 0!==e.parentId&&(n._waitingParentId=e.parentId),void 0!==e.parentInstanceIndex&&(n._waitingParentInstanceIndex=e.parentInstanceIndex),void 0!==e.actions&&(n._waitingData.actions=e.actions),void 0!==e.overlayAlpha&&(n.overlayAlpha=e.overlayAlpha),void 0!==e.overlayColor&&(n.overlayColor=u.Wo.FromArray(e.overlayColor)),void 0!==e.renderOverlay&&(n.renderOverlay=e.renderOverlay),n.isUnIndexed=!!e.isUnIndexed,n.hasVertexAlpha=e.hasVertexAlpha,e.delayLoadingFile?(n.delayLoadState=4,n.delayLoadingFile=i+e.delayLoadingFile,n.buildBoundingInfo(c.P.FromArray(e.boundingBoxMinimum),c.P.FromArray(e.boundingBoxMaximum)),e._binaryInfo&&(n._binaryInfo=e._binaryInfo),n._delayInfo=[],e.hasUVs&&n._delayInfo.push(p.o.UVKind),e.hasUVs2&&n._delayInfo.push(p.o.UV2Kind),e.hasUVs3&&n._delayInfo.push(p.o.UV3Kind),e.hasUVs4&&n._delayInfo.push(p.o.UV4Kind),e.hasUVs5&&n._delayInfo.push(p.o.UV5Kind),e.hasUVs6&&n._delayInfo.push(p.o.UV6Kind),e.hasColors&&n._delayInfo.push(p.o.ColorKind),e.hasMatricesIndices&&n._delayInfo.push(p.o.MatricesIndicesKind),e.hasMatricesWeights&&n._delayInfo.push(p.o.MatricesWeightsKind),n._delayLoadingFunction=_.Z._ImportGeometry,x.Z.ForceFullSceneLoadingForIncremental&&n._checkDelayState()):_.Z._ImportGeometry(e,n),e.materialUniqueId?n._waitingMaterialId=e.materialUniqueId:e.materialId&&(n._waitingMaterialId=e.materialId),e.morphTargetManagerId>-1&&(n.morphTargetManager=t.getMorphTargetManagerById(e.morphTargetManagerId)),void 0!==e.skeletonId&&null!==e.skeletonId&&(n.skeleton=t.getLastSkeletonById(e.skeletonId),e.numBoneInfluencers&&(n.numBoneInfluencers=e.numBoneInfluencers)),e.animations){for(let t=0;t<e.animations.length;t++){const i=e.animations[t],s=(0,S.q)("BABYLON.Animation");s&&n.animations.push(s.Parse(i))}d.N.ParseAnimationRanges(n,e,t)}if(e.autoAnimate&&t.beginAnimation(n,e.autoAnimateFrom,e.autoAnimateTo,e.autoAnimateLoop,e.autoAnimateSpeed||1),e.layerMask&&!isNaN(e.layerMask)?n.layerMask=Math.abs(parseInt(e.layerMask)):n.layerMask=268435455,e.physicsImpostor&&O._PhysicsImpostorParser(t,n,e),e.lodMeshIds&&(n._waitingData.lods={ids:e.lodMeshIds,distances:e.lodDistances?e.lodDistances:null,coverages:e.lodCoverages?e.lodCoverages:null}),e.instances)for(let i=0;i<e.instances.length;i++){const s=e.instances[i],r=n.createInstance(s.name);if(s.id&&(r.id=s.id),o.$&&(s.tags?o.$.AddTagsTo(r,s.tags):o.$.AddTagsTo(r,e.tags)),r.position=c.P.FromArray(s.position),void 0!==s.metadata&&(r.metadata=s.metadata),void 0!==s.parentId&&(r._waitingParentId=s.parentId),void 0!==s.parentInstanceIndex&&(r._waitingParentInstanceIndex=s.parentInstanceIndex),void 0!==s.isEnabled&&null!==s.isEnabled&&r.setEnabled(s.isEnabled),void 0!==s.isVisible&&null!==s.isVisible&&(r.isVisible=s.isVisible),void 0!==s.isPickable&&null!==s.isPickable&&(r.isPickable=s.isPickable),s.rotationQuaternion?r.rotationQuaternion=c._f.FromArray(s.rotationQuaternion):s.rotation&&(r.rotation=c.P.FromArray(s.rotation)),r.scaling=c.P.FromArray(s.scaling),null!=s.checkCollisions&&null!=s.checkCollisions&&(r.checkCollisions=s.checkCollisions),null!=s.pickable&&null!=s.pickable&&(r.isPickable=s.pickable),null!=s.showBoundingBox&&null!=s.showBoundingBox&&(r.showBoundingBox=s.showBoundingBox),null!=s.showSubMeshesBoundingBox&&null!=s.showSubMeshesBoundingBox&&(r.showSubMeshesBoundingBox=s.showSubMeshesBoundingBox),null!=s.alphaIndex&&null!=s.showSubMeshesBoundingBox&&(r.alphaIndex=s.alphaIndex),s.physicsImpostor&&O._PhysicsImpostorParser(t,r,s),void 0!==s.actions&&(r._waitingData.actions=s.actions),s.animations){for(let e=0;e<s.animations.length;e++){const t=s.animations[e],i=(0,S.q)("BABYLON.Animation");i&&r.animations.push(i.Parse(t))}d.N.ParseAnimationRanges(r,s,t),s.autoAnimate&&t.beginAnimation(r,s.autoAnimateFrom,s.autoAnimateTo,s.autoAnimateLoop,s.autoAnimateSpeed||1)}}if(e.thinInstances){const t=e.thinInstances;if(n.thinInstanceEnablePicking=!!t.enablePicking,t.matrixData?(n.thinInstanceSetBuffer("matrix",new Float32Array(t.matrixData),16,!1),n._thinInstanceDataStorage.matrixBufferSize=t.matrixBufferSize,n._thinInstanceDataStorage.instancesCount=t.instancesCount):n._thinInstanceDataStorage.matrixBufferSize=t.matrixBufferSize,e.thinInstances.userThinInstance){const t=e.thinInstances.userThinInstance;for(const e in t.data)n.thinInstanceSetBuffer(e,new Float32Array(t.data[e]),t.strides[e],!1),n._userThinInstanceBuffersStorage.sizes[e]=t.sizes[e]}}return n}setPositionsForCPUSkinning(){const e=this._internalMeshDataInfo;if(!e._sourcePositions){const t=this.getVerticesData(p.o.PositionKind);if(!t)return e._sourcePositions;e._sourcePositions=new Float32Array(t),this.isVertexBufferUpdatable(p.o.PositionKind)||this.setVerticesData(p.o.PositionKind,t,!0)}return e._sourcePositions}setNormalsForCPUSkinning(){const e=this._internalMeshDataInfo;if(!e._sourceNormals){const t=this.getVerticesData(p.o.NormalKind);if(!t)return e._sourceNormals;e._sourceNormals=new Float32Array(t),this.isVertexBufferUpdatable(p.o.NormalKind)||this.setVerticesData(p.o.NormalKind,t,!0)}return e._sourceNormals}applySkeleton(e){if(!this.geometry)return this;if(this.geometry._softwareSkinningFrameId==this.getScene().getFrameId())return this;if(this.geometry._softwareSkinningFrameId=this.getScene().getFrameId(),!this.isVerticesDataPresent(p.o.PositionKind))return this;if(!this.isVerticesDataPresent(p.o.MatricesIndicesKind))return this;if(!this.isVerticesDataPresent(p.o.MatricesWeightsKind))return this;const t=this.isVerticesDataPresent(p.o.NormalKind),i=this._internalMeshDataInfo;if(!i._sourcePositions){const e=this.subMeshes.slice();this.setPositionsForCPUSkinning(),this.subMeshes=e}t&&!i._sourceNormals&&this.setNormalsForCPUSkinning();let n=this.getVerticesData(p.o.PositionKind);if(!n)return this;n instanceof Float32Array||(n=new Float32Array(n));let s=this.getVerticesData(p.o.NormalKind);if(t){if(!s)return this;s instanceof Float32Array||(s=new Float32Array(s))}const r=this.getVerticesData(p.o.MatricesIndicesKind),o=this.getVerticesData(p.o.MatricesWeightsKind);if(!o||!r)return this;const a=this.numBoneInfluencers>4,l=a?this.getVerticesData(p.o.MatricesIndicesExtraKind):null,h=a?this.getVerticesData(p.o.MatricesWeightsExtraKind):null,u=e.getTransformMatrices(this),d=c.P.Zero(),f=new c.y3,_=new c.y3;let m,g=0;for(let e=0;e<n.length;e+=3,g+=4){let p;for(m=0;m<4;m++)p=o[g+m],p>0&&(c.y3.FromFloat32ArrayToRefScaled(u,Math.floor(16*r[g+m]),p,_),f.addToSelf(_));if(a)for(m=0;m<4;m++)p=h[g+m],p>0&&(c.y3.FromFloat32ArrayToRefScaled(u,Math.floor(16*l[g+m]),p,_),f.addToSelf(_));c.P.TransformCoordinatesFromFloatsToRef(i._sourcePositions[e],i._sourcePositions[e+1],i._sourcePositions[e+2],f,d),d.toArray(n,e),t&&(c.P.TransformNormalFromFloatsToRef(i._sourceNormals[e],i._sourceNormals[e+1],i._sourceNormals[e+2],f,d),d.toArray(s,e)),f.reset()}return this.updateVerticesData(p.o.PositionKind,n),t&&this.updateVerticesData(p.o.NormalKind,s),this}static MinMax(e){let t=null,i=null;return e.forEach((function(e){const n=e.getBoundingInfo().boundingBox;t&&i?(t.minimizeInPlace(n.minimumWorld),i.maximizeInPlace(n.maximumWorld)):(t=n.minimumWorld,i=n.maximumWorld)})),t&&i?{min:t,max:i}:{min:c.P.Zero(),max:c.P.Zero()}}static Center(e){const t=e instanceof Array?O.MinMax(e):e;return c.P.Center(t.min,t.max)}static MergeMeshes(e,t=!0,i,n,s,r){return(0,a.s3)(O._MergeMeshesCoroutine(e,t,i,n,s,r,!1))}static MergeMeshesAsync(e,t=!0,i,n,s,r){return(0,a.sM)(O._MergeMeshesCoroutine(e,t,i,n,s,r,!0),(0,a.KO)())}static*_MergeMeshesCoroutine(e,t=!0,i,n,s,r,o){if(0===(e=e.filter(Boolean)).length)return null;let a;if(!i){let t=0;for(a=0;a<e.length;a++)if(t+=e[a].getTotalVertices(),t>=65536)return T.Y.Warn("Cannot merge meshes because resulting mesh will have more than 65536 vertices. Please use allow32BitsIndices = true to use 32 bits indices"),null}r&&(s=!1);const l=new Array,h=new Array,c=new Array,u=e[0].overrideMaterialSideOrientation;for(a=0;a<e.length;a++){const t=e[a];if(t.isAnInstance)return T.Y.Warn("Cannot merge instance meshes."),null;if(u!==t.overrideMaterialSideOrientation)return T.Y.Warn("Cannot merge meshes with different overrideMaterialSideOrientation values."),null;if(s&&c.push(t.getTotalIndices()),r)if(t.material){const e=t.material;if(e instanceof y.G){for(let t=0;t<e.subMaterials.length;t++)l.indexOf(e.subMaterials[t])<0&&l.push(e.subMaterials[t]);for(let i=0;i<t.subMeshes.length;i++)h.push(l.indexOf(e.subMaterials[t.subMeshes[i].materialIndex])),c.push(t.subMeshes[i].indexCount)}else{l.indexOf(e)<0&&l.push(e);for(let i=0;i<t.subMeshes.length;i++)h.push(l.indexOf(e)),c.push(t.subMeshes[i].indexCount)}}else for(let e=0;e<t.subMeshes.length;e++)h.push(0),c.push(t.subMeshes[e].indexCount)}const d=e[0],p=e=>{const t=e.computeWorldMatrix(!0);return{vertexData:f.x.ExtractFromMesh(e,!1,!1),transform:t}},{vertexData:_,transform:m}=p(d);o&&(yield);const v=new Array(e.length-1);for(let t=1;t<e.length;t++)v[t-1]=p(e[t]),o&&(yield);const x=_._mergeCoroutine(m,v,i,o,!t);let b=x.next();for(;!b.done;)o&&(yield),b=x.next();const S=b.value;n||(n=new O(d.name+"_merged",d.getScene()));const E=S._applyToCoroutine(n,void 0,o);let C=E.next();for(;!C.done;)o&&(yield),C=E.next();if(n.checkCollisions=d.checkCollisions,n.overrideMaterialSideOrientation=d.overrideMaterialSideOrientation,t)for(a=0;a<e.length;a++)e[a].dispose();if(s||r){n.releaseSubMeshes(),a=0;let e=0;for(;a<c.length;)g.P.CreateFromIndices(0,e,c[a],n,void 0,!1),e+=c[a],a++;for(const e of n.subMeshes)e.refreshBoundingInfo();n.computeWorldMatrix(!0)}if(r){const e=new y.G(d.name+"_merged",d.getScene());e.subMaterials=l;for(let e=0;e<n.subMeshes.length;e++)n.subMeshes[e].materialIndex=h[e];n.material=e}else n.material=d.material;return n}addInstance(e){e._indexInSourceMeshInstanceArray=this.instances.length,this.instances.push(e)}removeInstance(e){const t=e._indexInSourceMeshInstanceArray;if(-1!=t){if(t!==this.instances.length-1){const e=this.instances[this.instances.length-1];this.instances[t]=e,e._indexInSourceMeshInstanceArray=t}e._indexInSourceMeshInstanceArray=-1,this.instances.pop()}}_shouldConvertRHS(){return this.overrideMaterialSideOrientation===v.F.CounterClockWiseSideOrientation}_getRenderingFillMode(e){var t;const i=this.getScene();return i.forcePointsCloud?v.F.PointFillMode:i.forceWireframe?v.F.WireFrameFillMode:null!==(t=this.overrideRenderingFillMode)&&void 0!==t?t:e}}O.FRONTSIDE=f.x.FRONTSIDE,O.BACKSIDE=f.x.BACKSIDE,O.DOUBLESIDE=f.x.DOUBLESIDE,O.DEFAULTSIDE=f.x.DEFAULTSIDE,O.NO_CAP=0,O.CAP_START=1,O.CAP_END=2,O.CAP_ALL=3,O.NO_FLIP=0,O.FLIP_TILE=1,O.ROTATE_TILE=2,O.FLIP_ROW=3,O.ROTATE_ROW=4,O.FLIP_N_ROTATE_TILE=5,O.FLIP_N_ROTATE_ROW=6,O.CENTER=0,O.LEFT=1,O.RIGHT=2,O.TOP=3,O.BOTTOM=4,O.INSTANCEDMESH_SORT_TRANSPARENT=!1,O._GroundMeshParser=(e,t)=>{throw(0,E.S)("GroundMesh")},O._GoldbergMeshParser=(e,t)=>{throw(0,E.S)("GoldbergMesh")},O._LinesMeshParser=(e,t)=>{throw(0,E.S)("LinesMesh")},(0,S.H)("BABYLON.Mesh",O),O.prototype.setMaterialByID=function(e){return this.setMaterialById(e)},O.CreateDisc=O.CreateDisc||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateBox=O.CreateBox||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateSphere=O.CreateSphere||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateCylinder=O.CreateCylinder||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateTorusKnot=O.CreateTorusKnot||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateTorus=O.CreateTorus||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreatePlane=O.CreatePlane||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateGround=O.CreateGround||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateTiledGround=O.CreateTiledGround||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateGroundFromHeightMap=O.CreateGroundFromHeightMap||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateTube=O.CreateTube||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreatePolyhedron=O.CreatePolyhedron||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateIcoSphere=O.CreateIcoSphere||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateDecal=O.CreateDecal||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.CreateCapsule=O.CreateCapsule||(()=>{throw new Error("Import MeshBuilder to populate this function")}),O.ExtendToGoldberg=O.ExtendToGoldberg||(()=>{throw new Error("Import MeshBuilder to populate this function")})},2101:(e,t,i)=>{i.d(t,{x:()=>d});var n=i(9472),s=i(4141),r=i(708),o=i(4934),a=i(4649),l=i(2722),h=i(3956),c=i(2697),u=i(1722);class d{constructor(){this._applyTo=(0,c.vp)(this._applyToCoroutine.bind(this))}set(e,t){switch(e.length||l.Y.Warn(`Setting vertex data kind '${t}' with an empty array`),t){case r.o.PositionKind:this.positions=e;break;case r.o.NormalKind:this.normals=e;break;case r.o.TangentKind:this.tangents=e;break;case r.o.UVKind:this.uvs=e;break;case r.o.UV2Kind:this.uvs2=e;break;case r.o.UV3Kind:this.uvs3=e;break;case r.o.UV4Kind:this.uvs4=e;break;case r.o.UV5Kind:this.uvs5=e;break;case r.o.UV6Kind:this.uvs6=e;break;case r.o.ColorKind:this.colors=e;break;case r.o.MatricesIndicesKind:this.matricesIndices=e;break;case r.o.MatricesWeightsKind:this.matricesWeights=e;break;case r.o.MatricesIndicesExtraKind:this.matricesIndicesExtra=e;break;case r.o.MatricesWeightsExtraKind:this.matricesWeightsExtra=e}}applyToMesh(e,t){return this._applyTo(e,t,!1),this}applyToGeometry(e,t){return this._applyTo(e,t,!1),this}updateMesh(e){return this._update(e),this}updateGeometry(e){return this._update(e),this}*_applyToCoroutine(e,t=!1,i){return this.positions&&(e.setVerticesData(r.o.PositionKind,this.positions,t),i&&(yield)),this.normals&&(e.setVerticesData(r.o.NormalKind,this.normals,t),i&&(yield)),this.tangents&&(e.setVerticesData(r.o.TangentKind,this.tangents,t),i&&(yield)),this.uvs&&(e.setVerticesData(r.o.UVKind,this.uvs,t),i&&(yield)),this.uvs2&&(e.setVerticesData(r.o.UV2Kind,this.uvs2,t),i&&(yield)),this.uvs3&&(e.setVerticesData(r.o.UV3Kind,this.uvs3,t),i&&(yield)),this.uvs4&&(e.setVerticesData(r.o.UV4Kind,this.uvs4,t),i&&(yield)),this.uvs5&&(e.setVerticesData(r.o.UV5Kind,this.uvs5,t),i&&(yield)),this.uvs6&&(e.setVerticesData(r.o.UV6Kind,this.uvs6,t),i&&(yield)),this.colors&&(e.setVerticesData(r.o.ColorKind,this.colors,t),i&&(yield)),this.matricesIndices&&(e.setVerticesData(r.o.MatricesIndicesKind,this.matricesIndices,t),i&&(yield)),this.matricesWeights&&(e.setVerticesData(r.o.MatricesWeightsKind,this.matricesWeights,t),i&&(yield)),this.matricesIndicesExtra&&(e.setVerticesData(r.o.MatricesIndicesExtraKind,this.matricesIndicesExtra,t),i&&(yield)),this.matricesWeightsExtra&&(e.setVerticesData(r.o.MatricesWeightsExtraKind,this.matricesWeightsExtra,t),i&&(yield)),this.indices?(e.setIndices(this.indices,null,t),i&&(yield)):e.setIndices([],null),this}_update(e,t,i){return this.positions&&e.updateVerticesData(r.o.PositionKind,this.positions,t,i),this.normals&&e.updateVerticesData(r.o.NormalKind,this.normals,t,i),this.tangents&&e.updateVerticesData(r.o.TangentKind,this.tangents,t,i),this.uvs&&e.updateVerticesData(r.o.UVKind,this.uvs,t,i),this.uvs2&&e.updateVerticesData(r.o.UV2Kind,this.uvs2,t,i),this.uvs3&&e.updateVerticesData(r.o.UV3Kind,this.uvs3,t,i),this.uvs4&&e.updateVerticesData(r.o.UV4Kind,this.uvs4,t,i),this.uvs5&&e.updateVerticesData(r.o.UV5Kind,this.uvs5,t,i),this.uvs6&&e.updateVerticesData(r.o.UV6Kind,this.uvs6,t,i),this.colors&&e.updateVerticesData(r.o.ColorKind,this.colors,t,i),this.matricesIndices&&e.updateVerticesData(r.o.MatricesIndicesKind,this.matricesIndices,t,i),this.matricesWeights&&e.updateVerticesData(r.o.MatricesWeightsKind,this.matricesWeights,t,i),this.matricesIndicesExtra&&e.updateVerticesData(r.o.MatricesIndicesExtraKind,this.matricesIndicesExtra,t,i),this.matricesWeightsExtra&&e.updateVerticesData(r.o.MatricesWeightsExtraKind,this.matricesWeightsExtra,t,i),this.indices&&e.setIndices(this.indices,null),this}static _TransformVector3Coordinates(e,t,i=0,n=e.length){const r=s.jp.Vector3[0],o=s.jp.Vector3[1];for(let a=i;a<i+n;a+=3)s.P.FromArrayToRef(e,a,r),s.P.TransformCoordinatesToRef(r,t,o),e[a]=o.x,e[a+1]=o.y,e[a+2]=o.z}static _TransformVector3Normals(e,t,i=0,n=e.length){const r=s.jp.Vector3[0],o=s.jp.Vector3[1];for(let a=i;a<i+n;a+=3)s.P.FromArrayToRef(e,a,r),s.P.TransformNormalToRef(r,t,o),e[a]=o.x,e[a+1]=o.y,e[a+2]=o.z}static _TransformVector4Normals(e,t,i=0,n=e.length){const r=s.jp.Vector4[0],o=s.jp.Vector4[1];for(let a=i;a<i+n;a+=4)s.Lt.FromArrayToRef(e,a,r),s.Lt.TransformNormalToRef(r,t,o),e[a]=o.x,e[a+1]=o.y,e[a+2]=o.z,e[a+3]=o.w}static _FlipFaces(e,t=0,i=e.length){for(let n=t;n<t+i;n+=3){const t=e[n+1];e[n+1]=e[n+2],e[n+2]=t}}transform(e){const t=e.determinant()<0;return this.positions&&d._TransformVector3Coordinates(this.positions,e),this.normals&&d._TransformVector3Normals(this.normals,e),this.tangents&&d._TransformVector4Normals(this.tangents,e),t&&this.indices&&d._FlipFaces(this.indices),this}merge(e,t=!1,i=!1){const n=Array.isArray(e)?e.map((e=>({vertexData:e}))):[{vertexData:e}];return(0,c.s3)(this._mergeCoroutine(void 0,n,t,!1,i))}*_mergeCoroutine(e,t,i=!1,n,s){var o,a,l,h;this._validate();const c=t.map((e=>e.vertexData));for(const e of c)if(e._validate(),!this.normals!=!e.normals||!this.tangents!=!e.tangents||!this.uvs!=!e.uvs||!this.uvs2!=!e.uvs2||!this.uvs3!=!e.uvs3||!this.uvs4!=!e.uvs4||!this.uvs5!=!e.uvs5||!this.uvs6!=!e.uvs6||!this.colors!=!e.colors||!this.matricesIndices!=!e.matricesIndices||!this.matricesWeights!=!e.matricesWeights||!this.matricesIndicesExtra!=!e.matricesIndicesExtra||!this.matricesWeightsExtra!=!e.matricesWeightsExtra)throw new Error("Cannot merge vertex data that do not have the same set of attributes");const u=c.reduce(((e,t)=>{var i,n;return e+(null!==(n=null===(i=t.indices)||void 0===i?void 0:i.length)&&void 0!==n?n:0)}),null!==(a=null===(o=this.indices)||void 0===o?void 0:o.length)&&void 0!==a?a:0);let p=s||c.some((e=>e.indices===this.indices))?null===(l=this.indices)||void 0===l?void 0:l.slice():this.indices;if(u>0){let s=null!==(h=null==p?void 0:p.length)&&void 0!==h?h:0;if(p||(p=new Array(u)),p.length!==u){if(Array.isArray(p))p.length=u;else{const e=i||p instanceof Uint32Array?new Uint32Array(u):new Uint16Array(u);e.set(p),p=e}e&&e.determinant()<0&&d._FlipFaces(p,0,s)}let r=this.positions?this.positions.length/3:0;for(const{vertexData:e,transform:i}of t)if(e.indices){for(let t=0;t<e.indices.length;t++)p[s+t]=e.indices[t]+r;i&&i.determinant()<0&&d._FlipFaces(p,s,e.indices.length),r+=e.positions.length/3,s+=e.indices.length,n&&(yield)}}return this.indices=p,this.positions=d._MergeElement(r.o.PositionKind,this.positions,e,t.map((e=>[e.vertexData.positions,e.transform]))),n&&(yield),this.normals=d._MergeElement(r.o.NormalKind,this.normals,e,t.map((e=>[e.vertexData.normals,e.transform]))),n&&(yield),this.tangents=d._MergeElement(r.o.TangentKind,this.tangents,e,t.map((e=>[e.vertexData.tangents,e.transform]))),n&&(yield),this.uvs=d._MergeElement(r.o.UVKind,this.uvs,e,t.map((e=>[e.vertexData.uvs,e.transform]))),n&&(yield),this.uvs2=d._MergeElement(r.o.UV2Kind,this.uvs2,e,t.map((e=>[e.vertexData.uvs2,e.transform]))),n&&(yield),this.uvs3=d._MergeElement(r.o.UV3Kind,this.uvs3,e,t.map((e=>[e.vertexData.uvs3,e.transform]))),n&&(yield),this.uvs4=d._MergeElement(r.o.UV4Kind,this.uvs4,e,t.map((e=>[e.vertexData.uvs4,e.transform]))),n&&(yield),this.uvs5=d._MergeElement(r.o.UV5Kind,this.uvs5,e,t.map((e=>[e.vertexData.uvs5,e.transform]))),n&&(yield),this.uvs6=d._MergeElement(r.o.UV6Kind,this.uvs6,e,t.map((e=>[e.vertexData.uvs6,e.transform]))),n&&(yield),this.colors=d._MergeElement(r.o.ColorKind,this.colors,e,t.map((e=>[e.vertexData.colors,e.transform]))),n&&(yield),this.matricesIndices=d._MergeElement(r.o.MatricesIndicesKind,this.matricesIndices,e,t.map((e=>[e.vertexData.matricesIndices,e.transform]))),n&&(yield),this.matricesWeights=d._MergeElement(r.o.MatricesWeightsKind,this.matricesWeights,e,t.map((e=>[e.vertexData.matricesWeights,e.transform]))),n&&(yield),this.matricesIndicesExtra=d._MergeElement(r.o.MatricesIndicesExtraKind,this.matricesIndicesExtra,e,t.map((e=>[e.vertexData.matricesIndicesExtra,e.transform]))),n&&(yield),this.matricesWeightsExtra=d._MergeElement(r.o.MatricesWeightsExtraKind,this.matricesWeightsExtra,e,t.map((e=>[e.vertexData.matricesWeightsExtra,e.transform]))),this}static _MergeElement(e,t,i,n){const s=n.filter((e=>null!==e[0]&&void 0!==e[0]));if(!t&&0==s.length)return t;if(!t)return this._MergeElement(e,s[0][0],s[0][1],s.slice(1));const o=s.reduce(((e,t)=>e+t[0].length),t.length),a=e===r.o.PositionKind?d._TransformVector3Coordinates:e===r.o.NormalKind?d._TransformVector3Normals:e===r.o.TangentKind?d._TransformVector4Normals:()=>{};if(t instanceof Float32Array){const e=new Float32Array(o);e.set(t),i&&a(e,i,0,t.length);let n=t.length;for(const[t,i]of s)e.set(t,n),i&&a(e,i,n,t.length),n+=t.length;return e}{const e=new Array(o);for(let i=0;i<t.length;i++)e[i]=t[i];i&&a(e,i,0,t.length);let n=t.length;for(const[t,i]of s){for(let i=0;i<t.length;i++)e[n+i]=t[i];i&&a(e,i,n,t.length),n+=t.length}return e}}_validate(){if(!this.positions)throw new u.LH("Positions are required",u.SM.MeshInvalidPositionsError);const e=(e,t)=>{const i=r.o.DeduceStride(e);if(t.length%i!=0)throw new Error("The "+e+"s array count must be a multiple of "+i);return t.length/i},t=e(r.o.PositionKind,this.positions),i=(i,n)=>{const s=e(i,n);if(s!==t)throw new Error("The "+i+"s element count ("+s+") does not match the positions count ("+t+")")};this.normals&&i(r.o.NormalKind,this.normals),this.tangents&&i(r.o.TangentKind,this.tangents),this.uvs&&i(r.o.UVKind,this.uvs),this.uvs2&&i(r.o.UV2Kind,this.uvs2),this.uvs3&&i(r.o.UV3Kind,this.uvs3),this.uvs4&&i(r.o.UV4Kind,this.uvs4),this.uvs5&&i(r.o.UV5Kind,this.uvs5),this.uvs6&&i(r.o.UV6Kind,this.uvs6),this.colors&&i(r.o.ColorKind,this.colors),this.matricesIndices&&i(r.o.MatricesIndicesKind,this.matricesIndices),this.matricesWeights&&i(r.o.MatricesWeightsKind,this.matricesWeights),this.matricesIndicesExtra&&i(r.o.MatricesIndicesExtraKind,this.matricesIndicesExtra),this.matricesWeightsExtra&&i(r.o.MatricesWeightsExtraKind,this.matricesWeightsExtra)}serialize(){const e={};return this.positions&&(e.positions=this.positions),this.normals&&(e.normals=this.normals),this.tangents&&(e.tangents=this.tangents),this.uvs&&(e.uvs=this.uvs),this.uvs2&&(e.uvs2=this.uvs2),this.uvs3&&(e.uvs3=this.uvs3),this.uvs4&&(e.uvs4=this.uvs4),this.uvs5&&(e.uvs5=this.uvs5),this.uvs6&&(e.uvs6=this.uvs6),this.colors&&(e.colors=this.colors),this.matricesIndices&&(e.matricesIndices=this.matricesIndices,e.matricesIndices._isExpanded=!0),this.matricesWeights&&(e.matricesWeights=this.matricesWeights),this.matricesIndicesExtra&&(e.matricesIndicesExtra=this.matricesIndicesExtra,e.matricesIndicesExtra._isExpanded=!0),this.matricesWeightsExtra&&(e.matricesWeightsExtra=this.matricesWeightsExtra),e.indices=this.indices,e}static ExtractFromMesh(e,t,i){return d._ExtractFrom(e,t,i)}static ExtractFromGeometry(e,t,i){return d._ExtractFrom(e,t,i)}static _ExtractFrom(e,t,i){const n=new d;return e.isVerticesDataPresent(r.o.PositionKind)&&(n.positions=e.getVerticesData(r.o.PositionKind,t,i)),e.isVerticesDataPresent(r.o.NormalKind)&&(n.normals=e.getVerticesData(r.o.NormalKind,t,i)),e.isVerticesDataPresent(r.o.TangentKind)&&(n.tangents=e.getVerticesData(r.o.TangentKind,t,i)),e.isVerticesDataPresent(r.o.UVKind)&&(n.uvs=e.getVerticesData(r.o.UVKind,t,i)),e.isVerticesDataPresent(r.o.UV2Kind)&&(n.uvs2=e.getVerticesData(r.o.UV2Kind,t,i)),e.isVerticesDataPresent(r.o.UV3Kind)&&(n.uvs3=e.getVerticesData(r.o.UV3Kind,t,i)),e.isVerticesDataPresent(r.o.UV4Kind)&&(n.uvs4=e.getVerticesData(r.o.UV4Kind,t,i)),e.isVerticesDataPresent(r.o.UV5Kind)&&(n.uvs5=e.getVerticesData(r.o.UV5Kind,t,i)),e.isVerticesDataPresent(r.o.UV6Kind)&&(n.uvs6=e.getVerticesData(r.o.UV6Kind,t,i)),e.isVerticesDataPresent(r.o.ColorKind)&&(n.colors=e.getVerticesData(r.o.ColorKind,t,i)),e.isVerticesDataPresent(r.o.MatricesIndicesKind)&&(n.matricesIndices=e.getVerticesData(r.o.MatricesIndicesKind,t,i)),e.isVerticesDataPresent(r.o.MatricesWeightsKind)&&(n.matricesWeights=e.getVerticesData(r.o.MatricesWeightsKind,t,i)),e.isVerticesDataPresent(r.o.MatricesIndicesExtraKind)&&(n.matricesIndicesExtra=e.getVerticesData(r.o.MatricesIndicesExtraKind,t,i)),e.isVerticesDataPresent(r.o.MatricesWeightsExtraKind)&&(n.matricesWeightsExtra=e.getVerticesData(r.o.MatricesWeightsExtraKind,t,i)),n.indices=e.getIndices(t,i),n}static CreateRibbon(e){throw(0,o.S)("ribbonBuilder")}static CreateBox(e){throw(0,o.S)("boxBuilder")}static CreateTiledBox(e){throw(0,o.S)("tiledBoxBuilder")}static CreateTiledPlane(e){throw(0,o.S)("tiledPlaneBuilder")}static CreateSphere(e){throw(0,o.S)("sphereBuilder")}static CreateCylinder(e){throw(0,o.S)("cylinderBuilder")}static CreateTorus(e){throw(0,o.S)("torusBuilder")}static CreateLineSystem(e){throw(0,o.S)("linesBuilder")}static CreateDashedLines(e){throw(0,o.S)("linesBuilder")}static CreateGround(e){throw(0,o.S)("groundBuilder")}static CreateTiledGround(e){throw(0,o.S)("groundBuilder")}static CreateGroundFromHeightMap(e){throw(0,o.S)("groundBuilder")}static CreatePlane(e){throw(0,o.S)("planeBuilder")}static CreateDisc(e){throw(0,o.S)("discBuilder")}static CreatePolygon(e,t,i,n,s,r,a){throw(0,o.S)("polygonBuilder")}static CreateIcoSphere(e){throw(0,o.S)("icoSphereBuilder")}static CreatePolyhedron(e){throw(0,o.S)("polyhedronBuilder")}static CreateCapsule(e={orientation:s.P.Up(),subdivisions:2,tessellation:16,height:1,radius:.25,capSubdivisions:6}){throw(0,o.S)("capsuleBuilder")}static CreateTorusKnot(e){throw(0,o.S)("torusKnotBuilder")}static ComputeNormals(e,t,i,n){let r=0,o=0,a=0,l=0,h=0,c=0,u=0,d=0,p=0,f=0,_=0,m=0,g=0,v=0,y=0,x=0,b=0,T=0,S=0,E=0,C=!1,A=!1,P=!1,R=!1,M=1,I=0,D=null;n&&(C=!!n.facetNormals,A=!!n.facetPositions,P=!!n.facetPartitioning,M=!0===n.useRightHandedSystem?-1:1,I=n.ratio||0,R=!!n.depthSort,D=n.distanceTo,R&&void 0===D&&(D=s.P.Zero()));let O=0,w=0,N=0,F=0;for(P&&n&&n.bbSize&&(O=n.subDiv.X*I/n.bbSize.x,w=n.subDiv.Y*I/n.bbSize.y,N=n.subDiv.Z*I/n.bbSize.z,F=n.subDiv.max*n.subDiv.max,n.facetPartitioning.length=0),r=0;r<e.length;r++)i[r]=0;const L=t.length/3|0;for(r=0;r<L;r++){if(m=3*t[3*r],g=m+1,v=m+2,y=3*t[3*r+1],x=y+1,b=y+2,T=3*t[3*r+2],S=T+1,E=T+2,o=e[m]-e[y],a=e[g]-e[x],l=e[v]-e[b],h=e[T]-e[y],c=e[S]-e[x],u=e[E]-e[b],d=M*(a*u-l*c),p=M*(l*h-o*u),f=M*(o*c-a*h),_=Math.sqrt(d*d+p*p+f*f),_=0===_?1:_,d/=_,p/=_,f/=_,C&&n&&(n.facetNormals[r].x=d,n.facetNormals[r].y=p,n.facetNormals[r].z=f),A&&n&&(n.facetPositions[r].x=(e[m]+e[y]+e[T])/3,n.facetPositions[r].y=(e[g]+e[x]+e[S])/3,n.facetPositions[r].z=(e[v]+e[b]+e[E])/3),P&&n){const t=Math.floor((n.facetPositions[r].x-n.bInfo.minimum.x*I)*O),i=Math.floor((n.facetPositions[r].y-n.bInfo.minimum.y*I)*w),s=Math.floor((n.facetPositions[r].z-n.bInfo.minimum.z*I)*N),o=Math.floor((e[m]-n.bInfo.minimum.x*I)*O),a=Math.floor((e[g]-n.bInfo.minimum.y*I)*w),l=Math.floor((e[v]-n.bInfo.minimum.z*I)*N),h=Math.floor((e[y]-n.bInfo.minimum.x*I)*O),c=Math.floor((e[x]-n.bInfo.minimum.y*I)*w),u=Math.floor((e[b]-n.bInfo.minimum.z*I)*N),d=Math.floor((e[T]-n.bInfo.minimum.x*I)*O),p=Math.floor((e[S]-n.bInfo.minimum.y*I)*w),f=Math.floor((e[E]-n.bInfo.minimum.z*I)*N),_=o+n.subDiv.max*a+F*l,C=h+n.subDiv.max*c+F*u,A=d+n.subDiv.max*p+F*f,P=t+n.subDiv.max*i+F*s;n.facetPartitioning[P]=n.facetPartitioning[P]?n.facetPartitioning[P]:new Array,n.facetPartitioning[_]=n.facetPartitioning[_]?n.facetPartitioning[_]:new Array,n.facetPartitioning[C]=n.facetPartitioning[C]?n.facetPartitioning[C]:new Array,n.facetPartitioning[A]=n.facetPartitioning[A]?n.facetPartitioning[A]:new Array,n.facetPartitioning[_].push(r),C!=_&&n.facetPartitioning[C].push(r),A!=C&&A!=_&&n.facetPartitioning[A].push(r),P!=_&&P!=C&&P!=A&&n.facetPartitioning[P].push(r)}if(R&&n&&n.facetPositions){const e=n.depthSortedFacets[r];e.ind=3*r,e.sqDistance=s.P.DistanceSquared(n.facetPositions[r],D)}i[m]+=d,i[g]+=p,i[v]+=f,i[y]+=d,i[x]+=p,i[b]+=f,i[T]+=d,i[S]+=p,i[E]+=f}for(r=0;r<i.length/3;r++)d=i[3*r],p=i[3*r+1],f=i[3*r+2],_=Math.sqrt(d*d+p*p+f*f),_=0===_?1:_,d/=_,p/=_,f/=_,i[3*r]=d,i[3*r+1]=p,i[3*r+2]=f}static _ComputeSides(e,t,i,n,r,o,a){const l=i.length,h=n.length;let c,u;switch(e=e||d.DEFAULTSIDE){case d.FRONTSIDE:break;case d.BACKSIDE:for(c=0;c<l;c+=3){const e=i[c];i[c]=i[c+2],i[c+2]=e}for(u=0;u<h;u++)n[u]=-n[u];break;case d.DOUBLESIDE:{const e=t.length,d=e/3;for(let i=0;i<e;i++)t[e+i]=t[i];for(c=0;c<l;c+=3)i[c+l]=i[c+2]+d,i[c+1+l]=i[c+1]+d,i[c+2+l]=i[c]+d;for(u=0;u<h;u++)n[h+u]=-n[u];const p=r.length;let f=0;for(f=0;f<p;f++)r[f+p]=r[f];for(o=o||new s.Lt(0,0,1,1),a=a||new s.Lt(0,0,1,1),f=0,c=0;c<p/2;c++)r[f]=o.x+(o.z-o.x)*r[f],r[f+1]=o.y+(o.w-o.y)*r[f+1],r[f+p]=a.x+(a.z-a.x)*r[f+p],r[f+p+1]=a.y+(a.w-a.y)*r[f+p+1],f+=2;break}}}static ImportVertexData(e,t){const i=new d,n=e.positions;n&&i.set(n,r.o.PositionKind);const s=e.normals;s&&i.set(s,r.o.NormalKind);const o=e.tangents;o&&i.set(o,r.o.TangentKind);const l=e.uvs;l&&i.set(l,r.o.UVKind);const h=e.uv2s;h&&i.set(h,r.o.UV2Kind);const c=e.uv3s;c&&i.set(c,r.o.UV3Kind);const u=e.uv4s;u&&i.set(u,r.o.UV4Kind);const p=e.uv5s;p&&i.set(p,r.o.UV5Kind);const f=e.uv6s;f&&i.set(f,r.o.UV6Kind);const _=e.colors;_&&i.set(a.HE.CheckColors4(_,n.length/3),r.o.ColorKind);const m=e.matricesIndices;m&&i.set(m,r.o.MatricesIndicesKind);const g=e.matricesWeights;g&&i.set(g,r.o.MatricesWeightsKind);const v=e.indices;v&&(i.indices=v),t.setAllVerticesData(i,e.updatable)}}d.FRONTSIDE=0,d.BACKSIDE=1,d.DOUBLESIDE=2,d.DEFAULTSIDE=0,(0,n.gn)([h.G6.filter(((...[e])=>!Array.isArray(e)))],d,"_TransformVector3Coordinates",null),(0,n.gn)([h.G6.filter(((...[e])=>!Array.isArray(e)))],d,"_TransformVector3Normals",null),(0,n.gn)([h.G6.filter(((...[e])=>!Array.isArray(e)))],d,"_TransformVector4Normals",null),(0,n.gn)([h.G6.filter(((...[e])=>!Array.isArray(e)))],d,"_FlipFaces",null)},447:(e,t,i)=>{i.d(t,{g:()=>n});class n{constructor(e,t){this.distanceOrScreenCoverage=e,this.mesh=t}}},9401:(e,t,i)=>{i.d(t,{P:()=>l});var n=i(708),s=i(2312),r=i(3722),o=i(1372),a=i(1345);class l{get materialDefines(){var e;return this._mainDrawWrapperOverride?this._mainDrawWrapperOverride.defines:null===(e=this._getDrawWrapper())||void 0===e?void 0:e.defines}set materialDefines(e){var t;(null!==(t=this._mainDrawWrapperOverride)&&void 0!==t?t:this._getDrawWrapper(void 0,!0)).defines=e}_getDrawWrapper(e,t=!1){e=null!=e?e:this._engine.currentRenderPassId;let i=this._drawWrappers[e];return!i&&t&&(this._drawWrappers[e]=i=new a.q(this._mesh.getScene().getEngine())),i}_removeDrawWrapper(e,t=!0){var i;t&&(null===(i=this._drawWrappers[e])||void 0===i||i.dispose()),this._drawWrappers[e]=void 0}get effect(){var e,t;return this._mainDrawWrapperOverride?this._mainDrawWrapperOverride.effect:null!==(t=null===(e=this._getDrawWrapper())||void 0===e?void 0:e.effect)&&void 0!==t?t:null}get _drawWrapper(){var e;return null!==(e=this._mainDrawWrapperOverride)&&void 0!==e?e:this._getDrawWrapper(void 0,!0)}get _drawWrapperOverride(){return this._mainDrawWrapperOverride}_setMainDrawWrapperOverride(e){this._mainDrawWrapperOverride=e}setEffect(e,t=null,i,n=!0){const s=this._drawWrapper;s.setEffect(e,t,n),void 0!==i&&(s.materialContext=i),e||(s.defines=null,s.materialContext=void 0)}resetDrawCache(e){if(this._drawWrappers){if(void 0!==e)return void this._removeDrawWrapper(e);for(const e of this._drawWrappers)null==e||e.dispose()}this._drawWrappers=[]}static AddToMesh(e,t,i,n,s,r,o,a=!0){return new l(e,t,i,n,s,r,o,a)}constructor(e,t,i,n,s,r,o,a=!0,l=!0){this.materialIndex=e,this.verticesStart=t,this.verticesCount=i,this.indexStart=n,this.indexCount=s,this._mainDrawWrapperOverride=null,this._linesIndexCount=0,this._linesIndexBuffer=null,this._lastColliderWorldVertices=null,this._lastColliderTransformMatrix=null,this._wasDispatched=!1,this._renderId=0,this._alphaIndex=0,this._distanceToCamera=0,this._currentMaterial=null,this._mesh=r,this._renderingMesh=o||r,l&&r.subMeshes.push(this),this._engine=this._mesh.getScene().getEngine(),this.resetDrawCache(),this._trianglePlanes=[],this._id=r.subMeshes.length-1,a&&(this.refreshBoundingInfo(),r.computeWorldMatrix(!0))}get IsGlobal(){return 0===this.verticesStart&&this.verticesCount===this._mesh.getTotalVertices()&&0===this.indexStart&&this.indexCount===this._mesh.getTotalIndices()}getBoundingInfo(){return this.IsGlobal?this._mesh.getBoundingInfo():this._boundingInfo}setBoundingInfo(e){return this._boundingInfo=e,this}getMesh(){return this._mesh}getRenderingMesh(){return this._renderingMesh}getReplacementMesh(){return this._mesh._internalAbstractMeshDataInfo._actAsRegularMesh?this._mesh:null}getEffectiveMesh(){return(this._mesh._internalAbstractMeshDataInfo._actAsRegularMesh?this._mesh:null)||this._renderingMesh}getMaterial(e=!0){var t;const i=null!==(t=this._renderingMesh.getMaterialForRenderPass(this._engine.currentRenderPassId))&&void 0!==t?t:this._renderingMesh.material;if(!i)return e?this._mesh.getScene().defaultMaterial:null;if(this._isMultiMaterial(i)){const e=i.getSubMaterial(this.materialIndex);return this._currentMaterial!==e&&(this._currentMaterial=e,this.resetDrawCache()),e}return i}_isMultiMaterial(e){return void 0!==e.getSubMaterial}refreshBoundingInfo(e=null){if(this._lastColliderWorldVertices=null,this.IsGlobal||!this._renderingMesh||!this._renderingMesh.geometry)return this;if(e||(e=this._renderingMesh.getVerticesData(n.o.PositionKind)),!e)return this._boundingInfo=this._mesh.getBoundingInfo(),this;const t=this._renderingMesh.getIndices();let i;if(0===this.indexStart&&this.indexCount===t.length){const e=this._renderingMesh.getBoundingInfo();i={minimum:e.minimum.clone(),maximum:e.maximum.clone()}}else i=(0,o.y)(e,t,this.indexStart,this.indexCount,this._renderingMesh.geometry.boundingBias);return this._boundingInfo?this._boundingInfo.reConstruct(i.minimum,i.maximum):this._boundingInfo=new r.j(i.minimum,i.maximum),this}_checkCollision(e){return this.getBoundingInfo()._checkCollision(e)}updateBoundingInfo(e){let t=this.getBoundingInfo();return t||(this.refreshBoundingInfo(),t=this.getBoundingInfo()),t&&t.update(e),this}isInFrustum(e){const t=this.getBoundingInfo();return!!t&&t.isInFrustum(e,this._mesh.cullingStrategy)}isCompletelyInFrustum(e){const t=this.getBoundingInfo();return!!t&&t.isCompletelyInFrustum(e)}render(e){return this._renderingMesh.render(this,e,this._mesh._internalAbstractMeshDataInfo._actAsRegularMesh?this._mesh:void 0),this}_getLinesIndexBuffer(e,t){if(!this._linesIndexBuffer){const i=[];for(let t=this.indexStart;t<this.indexStart+this.indexCount;t+=3)i.push(e[t],e[t+1],e[t+1],e[t+2],e[t+2],e[t]);this._linesIndexBuffer=t.createIndexBuffer(i),this._linesIndexCount=i.length}return this._linesIndexBuffer}canIntersects(e){const t=this.getBoundingInfo();return!!t&&e.intersectsBox(t.boundingBox)}intersects(e,t,i,n,s){const r=this.getMaterial();if(!r)return null;let o=3,a=!1;switch(r.fillMode){case 3:case 5:case 6:case 8:return null;case 7:o=1,a=!0}return 4===r.fillMode?i.length?this._intersectLines(e,t,i,this._mesh.intersectionThreshold,n):this._intersectUnIndexedLines(e,t,i,this._mesh.intersectionThreshold,n):!i.length&&this._mesh._unIndexed?this._intersectUnIndexedTriangles(e,t,i,n,s):this._intersectTriangles(e,t,i,o,a,n,s)}_intersectLines(e,t,i,n,r){let o=null;for(let a=this.indexStart;a<this.indexStart+this.indexCount;a+=2){const l=t[i[a]],h=t[i[a+1]],c=e.intersectionSegment(l,h,n);if(!(c<0)&&(r||!o||c<o.distance)&&(o=new s.c(null,null,c),o.faceId=a/2,r))break}return o}_intersectUnIndexedLines(e,t,i,n,r){let o=null;for(let i=this.verticesStart;i<this.verticesStart+this.verticesCount;i+=2){const a=t[i],l=t[i+1],h=e.intersectionSegment(a,l,n);if(!(h<0)&&(r||!o||h<o.distance)&&(o=new s.c(null,null,h),o.faceId=i/2,r))break}return o}_intersectTriangles(e,t,i,n,s,r,o){let a=null,l=-1;for(let h=this.indexStart;h<this.indexStart+this.indexCount-(3-n);h+=n){l++;const n=i[h],c=i[h+1],u=i[h+2];if(s&&4294967295===u){h+=2;continue}const d=t[n],p=t[c],f=t[u];if(!d||!p||!f)continue;if(o&&!o(d,p,f,e,n,c,u))continue;const _=e.intersectsTriangle(d,p,f);if(_){if(_.distance<0)continue;if((r||!a||_.distance<a.distance)&&(a=_,a.faceId=l,r))break}}return a}_intersectUnIndexedTriangles(e,t,i,n,s){let r=null;for(let i=this.verticesStart;i<this.verticesStart+this.verticesCount;i+=3){const o=t[i],a=t[i+1],l=t[i+2];if(s&&!s(o,a,l,e,-1,-1,-1))continue;const h=e.intersectsTriangle(o,a,l);if(h){if(h.distance<0)continue;if((n||!r||h.distance<r.distance)&&(r=h,r.faceId=i/3,n))break}}return r}_rebuild(){this._linesIndexBuffer&&(this._linesIndexBuffer=null)}clone(e,t){const i=new l(this.materialIndex,this.verticesStart,this.verticesCount,this.indexStart,this.indexCount,e,t,!1);if(!this.IsGlobal){const e=this.getBoundingInfo();if(!e)return i;i._boundingInfo=new r.j(e.minimum,e.maximum)}return i}dispose(){this._linesIndexBuffer&&(this._mesh.getScene().getEngine()._releaseBuffer(this._linesIndexBuffer),this._linesIndexBuffer=null);const e=this._mesh.subMeshes.indexOf(this);this._mesh.subMeshes.splice(e,1),this.resetDrawCache()}getClassName(){return"SubMesh"}static CreateFromIndices(e,t,i,n,s,r=!0){let o=Number.MAX_VALUE,a=-Number.MAX_VALUE;const h=(s||n).getIndices();for(let e=t;e<t+i;e++){const t=h[e];t<o&&(o=t),t>a&&(a=t)}return new l(e,o,a-o+1,t,i,n,s,r)}}},2708:(e,t,i)=>{var n=i(4496),s=i(708),r=i(4141),o=i(2722),a=i(3722);n.Kj.prototype.thinInstanceAdd=function(e,t=!0){if(!this.getScene().getEngine().getCaps().instancedArrays)return o.Y.Error("Thin Instances are not supported on this device as Instanced Array extension not supported"),-1;this._thinInstanceUpdateBufferSize("matrix",Array.isArray(e)?e.length:1);const i=this._thinInstanceDataStorage.instancesCount;if(Array.isArray(e))for(let i=0;i<e.length;++i)this.thinInstanceSetMatrixAt(this._thinInstanceDataStorage.instancesCount++,e[i],i===e.length-1&&t);else this.thinInstanceSetMatrixAt(this._thinInstanceDataStorage.instancesCount++,e,t);return i},n.Kj.prototype.thinInstanceAddSelf=function(e=!0){return this.thinInstanceAdd(r.y3.IdentityReadOnly,e)},n.Kj.prototype.thinInstanceRegisterAttribute=function(e,t){e===s.o.ColorKind&&(e=s.o.ColorInstanceKind),this.removeVerticesData(e),this._thinInstanceInitializeUserStorage(),this._userThinInstanceBuffersStorage.strides[e]=t,this._userThinInstanceBuffersStorage.sizes[e]=t*Math.max(32,this._thinInstanceDataStorage.instancesCount),this._userThinInstanceBuffersStorage.data[e]=new Float32Array(this._userThinInstanceBuffersStorage.sizes[e]),this._userThinInstanceBuffersStorage.vertexBuffers[e]=new s.o(this.getEngine(),this._userThinInstanceBuffersStorage.data[e],e,!0,!1,t,!0),this.setVerticesBuffer(this._userThinInstanceBuffersStorage.vertexBuffers[e])},n.Kj.prototype.thinInstanceSetMatrixAt=function(e,t,i=!0){if(!this._thinInstanceDataStorage.matrixData||e>=this._thinInstanceDataStorage.instancesCount)return!1;const n=this._thinInstanceDataStorage.matrixData;return t.copyToArray(n,16*e),this._thinInstanceDataStorage.worldMatrices&&(this._thinInstanceDataStorage.worldMatrices[e]=t),i&&(this.thinInstanceBufferUpdated("matrix"),this.doNotSyncBoundingInfo||this.thinInstanceRefreshBoundingInfo(!1)),!0},n.Kj.prototype.thinInstanceSetAttributeAt=function(e,t,i,n=!0){return e===s.o.ColorKind&&(e=s.o.ColorInstanceKind),!(!this._userThinInstanceBuffersStorage||!this._userThinInstanceBuffersStorage.data[e]||t>=this._thinInstanceDataStorage.instancesCount||(this._thinInstanceUpdateBufferSize(e,0),this._userThinInstanceBuffersStorage.data[e].set(i,t*this._userThinInstanceBuffersStorage.strides[e]),n&&this.thinInstanceBufferUpdated(e),0))},Object.defineProperty(n.Kj.prototype,"thinInstanceCount",{get:function(){return this._thinInstanceDataStorage.instancesCount},set:function(e){var t,i;const n=null!==(t=this._thinInstanceDataStorage.matrixData)&&void 0!==t?t:null===(i=this.source)||void 0===i?void 0:i._thinInstanceDataStorage.matrixData;e<=(n?n.length/16:0)&&(this._thinInstanceDataStorage.instancesCount=e)},enumerable:!0,configurable:!0}),n.Kj.prototype._thinInstanceCreateMatrixBuffer=function(e,t,i=!1){e===s.o.ColorKind&&(e=s.o.ColorInstanceKind);const n=new s.l(this.getEngine(),t,!i,16,!1,!0);for(let t=0;t<4;t++)this.setVerticesBuffer(n.createVertexBuffer(e+t,4*t,4));return n},n.Kj.prototype.thinInstanceSetBuffer=function(e,t,i=0,n=!1){var r,o,a;i=i||16,"matrix"===e?(null===(r=this._thinInstanceDataStorage.matrixBuffer)||void 0===r||r.dispose(),this._thinInstanceDataStorage.matrixBuffer=null,this._thinInstanceDataStorage.matrixBufferSize=t?t.length:32*i,this._thinInstanceDataStorage.matrixData=t,this._thinInstanceDataStorage.worldMatrices=null,null!==t?(this._thinInstanceDataStorage.instancesCount=t.length/i,this._thinInstanceDataStorage.matrixBuffer=this._thinInstanceCreateMatrixBuffer("world",t,n),this.doNotSyncBoundingInfo||this.thinInstanceRefreshBoundingInfo(!1)):(this._thinInstanceDataStorage.instancesCount=0,this.doNotSyncBoundingInfo||this.refreshBoundingInfo())):"previousMatrix"===e?(null===(o=this._thinInstanceDataStorage.previousMatrixBuffer)||void 0===o||o.dispose(),this._thinInstanceDataStorage.previousMatrixBuffer=null,this._thinInstanceDataStorage.previousMatrixData=t,null!==t&&(this._thinInstanceDataStorage.previousMatrixBuffer=this._thinInstanceCreateMatrixBuffer("previousWorld",t,n))):(e===s.o.ColorKind&&(e=s.o.ColorInstanceKind),null===t?(null===(a=this._userThinInstanceBuffersStorage)||void 0===a?void 0:a.data[e])&&(this.removeVerticesData(e),delete this._userThinInstanceBuffersStorage.data[e],delete this._userThinInstanceBuffersStorage.strides[e],delete this._userThinInstanceBuffersStorage.sizes[e],delete this._userThinInstanceBuffersStorage.vertexBuffers[e]):(this._thinInstanceInitializeUserStorage(),this._userThinInstanceBuffersStorage.data[e]=t,this._userThinInstanceBuffersStorage.strides[e]=i,this._userThinInstanceBuffersStorage.sizes[e]=t.length,this._userThinInstanceBuffersStorage.vertexBuffers[e]=new s.o(this.getEngine(),t,e,!n,!1,i,!0),this.setVerticesBuffer(this._userThinInstanceBuffersStorage.vertexBuffers[e])))},n.Kj.prototype.thinInstanceBufferUpdated=function(e){var t,i,n;"matrix"===e?null===(t=this._thinInstanceDataStorage.matrixBuffer)||void 0===t||t.updateDirectly(this._thinInstanceDataStorage.matrixData,0,this._thinInstanceDataStorage.instancesCount):"previousMatrix"===e?null===(i=this._thinInstanceDataStorage.previousMatrixBuffer)||void 0===i||i.updateDirectly(this._thinInstanceDataStorage.previousMatrixData,0,this._thinInstanceDataStorage.instancesCount):(e===s.o.ColorKind&&(e=s.o.ColorInstanceKind),(null===(n=this._userThinInstanceBuffersStorage)||void 0===n?void 0:n.vertexBuffers[e])&&this._userThinInstanceBuffersStorage.vertexBuffers[e].updateDirectly(this._userThinInstanceBuffersStorage.data[e],0))},n.Kj.prototype.thinInstancePartialBufferUpdate=function(e,t,i){var n;"matrix"===e?this._thinInstanceDataStorage.matrixBuffer&&this._thinInstanceDataStorage.matrixBuffer.updateDirectly(t,i):(e===s.o.ColorKind&&(e=s.o.ColorInstanceKind),(null===(n=this._userThinInstanceBuffersStorage)||void 0===n?void 0:n.vertexBuffers[e])&&this._userThinInstanceBuffersStorage.vertexBuffers[e].updateDirectly(t,i))},n.Kj.prototype.thinInstanceGetWorldMatrices=function(){if(!this._thinInstanceDataStorage.matrixData||!this._thinInstanceDataStorage.matrixBuffer)return[];const e=this._thinInstanceDataStorage.matrixData;if(!this._thinInstanceDataStorage.worldMatrices){this._thinInstanceDataStorage.worldMatrices=new Array;for(let t=0;t<this._thinInstanceDataStorage.instancesCount;++t)this._thinInstanceDataStorage.worldMatrices[t]=r.y3.FromArray(e,16*t)}return this._thinInstanceDataStorage.worldMatrices},n.Kj.prototype.thinInstanceRefreshBoundingInfo=function(e=!1,t=!1,i=!1){if(!this._thinInstanceDataStorage.matrixData||!this._thinInstanceDataStorage.matrixBuffer)return;const n=this._thinInstanceDataStorage.boundingVectors;if(e||!this.rawBoundingInfo){n.length=0,this.refreshBoundingInfo(t,i);const e=this.getBoundingInfo();this.rawBoundingInfo=new a.j(e.minimum,e.maximum)}const s=this.getBoundingInfo(),o=this._thinInstanceDataStorage.matrixData;if(0===n.length)for(let e=0;e<s.boundingBox.vectors.length;++e)n.push(s.boundingBox.vectors[e].clone());r.jp.Vector3[0].setAll(Number.POSITIVE_INFINITY),r.jp.Vector3[1].setAll(Number.NEGATIVE_INFINITY);for(let e=0;e<this._thinInstanceDataStorage.instancesCount;++e){r.y3.FromArrayToRef(o,16*e,r.jp.Matrix[0]);for(let e=0;e<n.length;++e)r.P.TransformCoordinatesToRef(n[e],r.jp.Matrix[0],r.jp.Vector3[2]),r.jp.Vector3[0].minimizeInPlace(r.jp.Vector3[2]),r.jp.Vector3[1].maximizeInPlace(r.jp.Vector3[2])}s.reConstruct(r.jp.Vector3[0],r.jp.Vector3[1]),this._updateBoundingInfo()},n.Kj.prototype._thinInstanceUpdateBufferSize=function(e,t=1){var i,n,r;e===s.o.ColorKind&&(e=s.o.ColorInstanceKind);const o="matrix"===e;if(!(o||this._userThinInstanceBuffersStorage&&this._userThinInstanceBuffersStorage.strides[e]))return;const a=o?16:this._userThinInstanceBuffersStorage.strides[e],l=o?this._thinInstanceDataStorage.matrixBufferSize:this._userThinInstanceBuffersStorage.sizes[e];let h=o?this._thinInstanceDataStorage.matrixData:this._userThinInstanceBuffersStorage.data[e];const c=(this._thinInstanceDataStorage.instancesCount+t)*a;let u=l;for(;u<c;)u*=2;if(!h||l!=u){if(h){const e=new Float32Array(u);e.set(h,0),h=e}else h=new Float32Array(u);o?(null===(i=this._thinInstanceDataStorage.matrixBuffer)||void 0===i||i.dispose(),this._thinInstanceDataStorage.matrixBuffer=this._thinInstanceCreateMatrixBuffer("world",h,!1),this._thinInstanceDataStorage.matrixData=h,this._thinInstanceDataStorage.matrixBufferSize=u,this._scene.needsPreviousWorldMatrices&&!this._thinInstanceDataStorage.previousMatrixData&&(null===(n=this._thinInstanceDataStorage.previousMatrixBuffer)||void 0===n||n.dispose(),this._thinInstanceDataStorage.previousMatrixBuffer=this._thinInstanceCreateMatrixBuffer("previousWorld",h,!1))):(null===(r=this._userThinInstanceBuffersStorage.vertexBuffers[e])||void 0===r||r.dispose(),this._userThinInstanceBuffersStorage.data[e]=h,this._userThinInstanceBuffersStorage.sizes[e]=u,this._userThinInstanceBuffersStorage.vertexBuffers[e]=new s.o(this.getEngine(),h,e,!0,!1,a,!0),this.setVerticesBuffer(this._userThinInstanceBuffersStorage.vertexBuffers[e]))}},n.Kj.prototype._thinInstanceInitializeUserStorage=function(){this._userThinInstanceBuffersStorage||(this._userThinInstanceBuffersStorage={data:{},sizes:{},vertexBuffers:{},strides:{}})},n.Kj.prototype._disposeThinInstanceSpecificData=function(){var e;(null===(e=this._thinInstanceDataStorage)||void 0===e?void 0:e.matrixBuffer)&&(this._thinInstanceDataStorage.matrixBuffer.dispose(),this._thinInstanceDataStorage.matrixBuffer=null)}},4674:(e,t,i)=>{i.d(t,{Y:()=>h});var n=i(9472),s=i(3956),r=i(5757),o=i(4141),a=i(9257),l=i(5203);class h extends a.N{get billboardMode(){return this._billboardMode}set billboardMode(e){this._billboardMode!==e&&(this._billboardMode=e,this._cache.useBillboardPosition=0!=(this._billboardMode&h.BILLBOARDMODE_USE_POSITION),this._computeUseBillboardPath())}get preserveParentRotationForBillboard(){return this._preserveParentRotationForBillboard}set preserveParentRotationForBillboard(e){e!==this._preserveParentRotationForBillboard&&(this._preserveParentRotationForBillboard=e,this._computeUseBillboardPath())}_computeUseBillboardPath(){this._cache.useBillboardPath=this._billboardMode!==h.BILLBOARDMODE_NONE&&!this.preserveParentRotationForBillboard}get infiniteDistance(){return this._infiniteDistance}set infiniteDistance(e){this._infiniteDistance!==e&&(this._infiniteDistance=e)}constructor(e,t=null,i=!0){super(e,t),this._forward=new o.P(0,0,1),this._up=new o.P(0,1,0),this._right=new o.P(1,0,0),this._position=o.P.Zero(),this._rotation=o.P.Zero(),this._rotationQuaternion=null,this._scaling=o.P.One(),this._transformToBoneReferal=null,this._isAbsoluteSynced=!1,this._billboardMode=h.BILLBOARDMODE_NONE,this._preserveParentRotationForBillboard=!1,this.scalingDeterminant=1,this._infiniteDistance=!1,this.ignoreNonUniformScaling=!1,this.reIntegrateRotationIntoRotationQuaternion=!1,this._poseMatrix=null,this._localMatrix=o.y3.Zero(),this._usePivotMatrix=!1,this._absolutePosition=o.P.Zero(),this._absoluteScaling=o.P.Zero(),this._absoluteRotationQuaternion=o._f.Identity(),this._pivotMatrix=o.y3.Identity(),this._postMultiplyPivotMatrix=!1,this._isWorldMatrixFrozen=!1,this._indexInSceneTransformNodesArray=-1,this.onAfterWorldMatrixUpdateObservable=new r.y$,this._nonUniformScaling=!1,i&&this.getScene().addTransformNode(this)}getClassName(){return"TransformNode"}get position(){return this._position}set position(e){this._position=e,this._isDirty=!0}isUsingPivotMatrix(){return this._usePivotMatrix}get rotation(){return this._rotation}set rotation(e){this._rotation=e,this._rotationQuaternion=null,this._isDirty=!0}get scaling(){return this._scaling}set scaling(e){this._scaling=e,this._isDirty=!0}get rotationQuaternion(){return this._rotationQuaternion}set rotationQuaternion(e){this._rotationQuaternion=e,e&&this._rotation.setAll(0),this._isDirty=!0}get forward(){return o.P.TransformNormalFromFloatsToRef(0,0,this.getScene().useRightHandedSystem?-1:1,this.getWorldMatrix(),this._forward),this._forward.normalize()}get up(){return o.P.TransformNormalFromFloatsToRef(0,1,0,this.getWorldMatrix(),this._up),this._up.normalize()}get right(){return o.P.TransformNormalFromFloatsToRef(this.getScene().useRightHandedSystem?-1:1,0,0,this.getWorldMatrix(),this._right),this._right.normalize()}updatePoseMatrix(e){return this._poseMatrix?(this._poseMatrix.copyFrom(e),this):(this._poseMatrix=e.clone(),this)}getPoseMatrix(){return this._poseMatrix||(this._poseMatrix=o.y3.Identity()),this._poseMatrix}_isSynchronized(){const e=this._cache;return!(this._billboardMode!==e.billboardMode||this._billboardMode!==h.BILLBOARDMODE_NONE||e.pivotMatrixUpdated||this._infiniteDistance||this._position._isDirty||this._scaling._isDirty||this._rotationQuaternion&&this._rotationQuaternion._isDirty||this._rotation._isDirty)}_initCache(){super._initCache();const e=this._cache;e.localMatrixUpdated=!1,e.billboardMode=-1,e.infiniteDistance=!1,e.useBillboardPosition=!1,e.useBillboardPath=!1}get absolutePosition(){return this.getAbsolutePosition()}get absoluteScaling(){return this._syncAbsoluteScalingAndRotation(),this._absoluteScaling}get absoluteRotationQuaternion(){return this._syncAbsoluteScalingAndRotation(),this._absoluteRotationQuaternion}setPreTransformMatrix(e){return this.setPivotMatrix(e,!1)}setPivotMatrix(e,t=!0){return this._pivotMatrix.copyFrom(e),this._usePivotMatrix=!this._pivotMatrix.isIdentity(),this._cache.pivotMatrixUpdated=!0,this._postMultiplyPivotMatrix=t,this._postMultiplyPivotMatrix&&(this._pivotMatrixInverse?this._pivotMatrix.invertToRef(this._pivotMatrixInverse):this._pivotMatrixInverse=o.y3.Invert(this._pivotMatrix)),this}getPivotMatrix(){return this._pivotMatrix}instantiateHierarchy(e=null,t,i){const n=this.clone("Clone of "+(this.name||this.id),e||this.parent,!0);n&&i&&i(this,n);for(const e of this.getChildTransformNodes(!0))e.instantiateHierarchy(n,t,i);return n}freezeWorldMatrix(e=null,t=!1){return e?t?(this._rotation.setAll(0),this._rotationQuaternion=this._rotationQuaternion||o._f.Identity(),e.decompose(this._scaling,this._rotationQuaternion,this._position),this.computeWorldMatrix(!0)):(this._worldMatrix=e,this._absolutePosition.copyFromFloats(this._worldMatrix.m[12],this._worldMatrix.m[13],this._worldMatrix.m[14]),this._afterComputeWorldMatrix()):(this._isWorldMatrixFrozen=!1,this.computeWorldMatrix(!0)),this._isDirty=!1,this._isWorldMatrixFrozen=!0,this}unfreezeWorldMatrix(){return this._isWorldMatrixFrozen=!1,this.computeWorldMatrix(!0),this}get isWorldMatrixFrozen(){return this._isWorldMatrixFrozen}getAbsolutePosition(){return this.computeWorldMatrix(),this._absolutePosition}setAbsolutePosition(e){if(!e)return this;let t,i,n;if(void 0===e.x){if(arguments.length<3)return this;t=arguments[0],i=arguments[1],n=arguments[2]}else t=e.x,i=e.y,n=e.z;if(this.parent){const e=o.jp.Matrix[0];this.parent.getWorldMatrix().invertToRef(e),o.P.TransformCoordinatesFromFloatsToRef(t,i,n,e,this.position)}else this.position.x=t,this.position.y=i,this.position.z=n;return this._absolutePosition.copyFrom(e),this}setPositionWithLocalVector(e){return this.computeWorldMatrix(),this.position=o.P.TransformNormal(e,this._localMatrix),this}getPositionExpressedInLocalSpace(){this.computeWorldMatrix();const e=o.jp.Matrix[0];return this._localMatrix.invertToRef(e),o.P.TransformNormal(this.position,e)}locallyTranslate(e){return this.computeWorldMatrix(!0),this.position=o.P.TransformCoordinates(e,this._localMatrix),this}lookAt(e,t=0,i=0,n=0,s=l.T.LOCAL){const r=h._LookAtVectorCache,a=s===l.T.LOCAL?this.position:this.getAbsolutePosition();if(e.subtractToRef(a,r),this.setDirection(r,t,i,n),s===l.T.WORLD&&this.parent)if(this.rotationQuaternion){const e=o.jp.Matrix[0];this.rotationQuaternion.toRotationMatrix(e);const t=o.jp.Matrix[1];this.parent.getWorldMatrix().getRotationMatrixToRef(t),t.invert(),e.multiplyToRef(t,e),this.rotationQuaternion.fromRotationMatrix(e)}else{const e=o.jp.Quaternion[0];o._f.FromEulerVectorToRef(this.rotation,e);const t=o.jp.Matrix[0];e.toRotationMatrix(t);const i=o.jp.Matrix[1];this.parent.getWorldMatrix().getRotationMatrixToRef(i),i.invert(),t.multiplyToRef(i,t),e.fromRotationMatrix(t),e.toEulerAnglesToRef(this.rotation)}return this}getDirection(e){const t=o.P.Zero();return this.getDirectionToRef(e,t),t}getDirectionToRef(e,t){return o.P.TransformNormalToRef(e,this.getWorldMatrix(),t),this}setDirection(e,t=0,i=0,n=0){const s=-Math.atan2(e.z,e.x)+Math.PI/2,r=Math.sqrt(e.x*e.x+e.z*e.z),a=-Math.atan2(e.y,r);return this.rotationQuaternion?o._f.RotationYawPitchRollToRef(s+t,a+i,n,this.rotationQuaternion):(this.rotation.x=a+i,this.rotation.y=s+t,this.rotation.z=n),this}setPivotPoint(e,t=l.T.LOCAL){0==this.getScene().getRenderId()&&this.computeWorldMatrix(!0);const i=this.getWorldMatrix();if(t==l.T.WORLD){const t=o.jp.Matrix[0];i.invertToRef(t),e=o.P.TransformCoordinates(e,t)}return this.setPivotMatrix(o.y3.Translation(-e.x,-e.y,-e.z),!0)}getPivotPoint(){const e=o.P.Zero();return this.getPivotPointToRef(e),e}getPivotPointToRef(e){return e.x=-this._pivotMatrix.m[12],e.y=-this._pivotMatrix.m[13],e.z=-this._pivotMatrix.m[14],this}getAbsolutePivotPoint(){const e=o.P.Zero();return this.getAbsolutePivotPointToRef(e),e}getAbsolutePivotPointToRef(e){return this.getPivotPointToRef(e),o.P.TransformCoordinatesToRef(e,this.getWorldMatrix(),e),this}markAsDirty(e){if(this._isDirty)return this;if(this._children)for(const t of this._children)t.markAsDirty(e);return super.markAsDirty(e)}setParent(e,t=!1,i=!1){if(!e&&!this.parent)return this;const n=o.jp.Quaternion[0],s=o.jp.Vector3[0],r=o.jp.Vector3[1],a=o.jp.Matrix[1];o.y3.IdentityToRef(a);const l=o.jp.Matrix[0];this.computeWorldMatrix(!0);let c=this.rotationQuaternion;return c||(c=h._TmpRotation,o._f.RotationYawPitchRollToRef(this._rotation.y,this._rotation.x,this._rotation.z,c)),o.y3.ComposeToRef(this.scaling,c,this.position,l),this.parent&&l.multiplyToRef(this.parent.computeWorldMatrix(!0),l),e&&(e.computeWorldMatrix(!0).invertToRef(a),l.multiplyToRef(a,l)),l.decompose(r,n,s,t?this:void 0),this.rotationQuaternion?this.rotationQuaternion.copyFrom(n):n.toEulerAnglesToRef(this.rotation),this.scaling.copyFrom(r),this.position.copyFrom(s),this.parent=e,i&&this.setPivotMatrix(o.y3.Identity()),this}get nonUniformScaling(){return this._nonUniformScaling}_updateNonUniformScalingState(e){return this._nonUniformScaling!==e&&(this._nonUniformScaling=e,!0)}attachToBone(e,t){return this._currentParentWhenAttachingToBone=this.parent,this._transformToBoneReferal=t,this.parent=e,e.getSkeleton().prepare(),e.getWorldMatrix().determinant()<0&&(this.scalingDeterminant*=-1),this}detachFromBone(e=!1){return this.parent?(this.parent.getWorldMatrix().determinant()<0&&(this.scalingDeterminant*=-1),this._transformToBoneReferal=null,this.parent=e?this._currentParentWhenAttachingToBone:null,this):(e&&(this.parent=this._currentParentWhenAttachingToBone),this)}rotate(e,t,i){let n;if(e.normalize(),this.rotationQuaternion||(this.rotationQuaternion=this.rotation.toQuaternion(),this.rotation.setAll(0)),i&&i!==l.T.LOCAL){if(this.parent){const t=o.jp.Matrix[0];this.parent.getWorldMatrix().invertToRef(t),e=o.P.TransformNormal(e,t)}n=o._f.RotationAxisToRef(e,t,h._RotationAxisCache),n.multiplyToRef(this.rotationQuaternion,this.rotationQuaternion)}else n=o._f.RotationAxisToRef(e,t,h._RotationAxisCache),this.rotationQuaternion.multiplyToRef(n,this.rotationQuaternion);return this}rotateAround(e,t,i){t.normalize(),this.rotationQuaternion||(this.rotationQuaternion=o._f.RotationYawPitchRoll(this.rotation.y,this.rotation.x,this.rotation.z),this.rotation.setAll(0));const n=o.jp.Vector3[0],s=o.jp.Vector3[1],r=o.jp.Vector3[2],a=o.jp.Quaternion[0],l=o.jp.Matrix[0],h=o.jp.Matrix[1],c=o.jp.Matrix[2],u=o.jp.Matrix[3];return e.subtractToRef(this.position,n),o.y3.TranslationToRef(n.x,n.y,n.z,l),o.y3.TranslationToRef(-n.x,-n.y,-n.z,h),o.y3.RotationAxisToRef(t,i,c),h.multiplyToRef(c,u),u.multiplyToRef(l,u),u.decompose(s,a,r),this.position.addInPlace(r),a.multiplyToRef(this.rotationQuaternion,this.rotationQuaternion),this}translate(e,t,i){const n=e.scale(t);if(i&&i!==l.T.LOCAL)this.setAbsolutePosition(this.getAbsolutePosition().add(n));else{const e=this.getPositionExpressedInLocalSpace().add(n);this.setPositionWithLocalVector(e)}return this}addRotation(e,t,i){let n;this.rotationQuaternion?n=this.rotationQuaternion:(n=o.jp.Quaternion[1],o._f.RotationYawPitchRollToRef(this.rotation.y,this.rotation.x,this.rotation.z,n));const s=o.jp.Quaternion[0];return o._f.RotationYawPitchRollToRef(t,e,i,s),n.multiplyInPlace(s),this.rotationQuaternion||n.toEulerAnglesToRef(this.rotation),this}_getEffectiveParent(){return this.parent}isWorldMatrixCameraDependent(){return this._infiniteDistance&&!this.parent||this._billboardMode!==h.BILLBOARDMODE_NONE&&!this.preserveParentRotationForBillboard}computeWorldMatrix(e=!1,t=null){if(this._isWorldMatrixFrozen&&!this._isDirty)return this._worldMatrix;const i=this.getScene().getRenderId();if(!this._isDirty&&!e&&(this._currentRenderId===i||this.isSynchronized()))return this._currentRenderId=i,this._worldMatrix;t=t||this.getScene().activeCamera,this._updateCache();const n=this._cache;n.pivotMatrixUpdated=!1,n.billboardMode=this.billboardMode,n.infiniteDistance=this.infiniteDistance,n.parent=this._parentNode,this._currentRenderId=i,this._childUpdateId+=1,this._isDirty=!1,this._position._isDirty=!1,this._rotation._isDirty=!1,this._scaling._isDirty=!1;const s=this._getEffectiveParent(),r=h._TmpScaling;let a,l=this._position;if(this._infiniteDistance&&!this.parent&&t){const e=t.getWorldMatrix(),i=new o.P(e.m[12],e.m[13],e.m[14]);l=h._TmpTranslation,l.copyFromFloats(this._position.x+i.x,this._position.y+i.y,this._position.z+i.z)}if(r.copyFromFloats(this._scaling.x*this.scalingDeterminant,this._scaling.y*this.scalingDeterminant,this._scaling.z*this.scalingDeterminant),this._rotationQuaternion?(this._rotationQuaternion._isDirty=!1,a=this._rotationQuaternion,this.reIntegrateRotationIntoRotationQuaternion&&this.rotation.lengthSquared()&&(this._rotationQuaternion.multiplyInPlace(o._f.RotationYawPitchRoll(this._rotation.y,this._rotation.x,this._rotation.z)),this._rotation.copyFromFloats(0,0,0))):(a=h._TmpRotation,o._f.RotationYawPitchRollToRef(this._rotation.y,this._rotation.x,this._rotation.z,a)),this._usePivotMatrix){const e=o.jp.Matrix[1];o.y3.ScalingToRef(r.x,r.y,r.z,e);const t=o.jp.Matrix[0];a.toRotationMatrix(t),this._pivotMatrix.multiplyToRef(e,o.jp.Matrix[4]),o.jp.Matrix[4].multiplyToRef(t,this._localMatrix),this._postMultiplyPivotMatrix&&this._localMatrix.multiplyToRef(this._pivotMatrixInverse,this._localMatrix),this._localMatrix.addTranslationFromFloats(l.x,l.y,l.z)}else o.y3.ComposeToRef(r,a,l,this._localMatrix);if(s&&s.getWorldMatrix){if(e&&s.computeWorldMatrix(e),n.useBillboardPath){this._transformToBoneReferal?s.getWorldMatrix().multiplyToRef(this._transformToBoneReferal.getWorldMatrix(),o.jp.Matrix[7]):o.jp.Matrix[7].copyFrom(s.getWorldMatrix());const e=o.jp.Vector3[5],t=o.jp.Vector3[6],i=o.jp.Quaternion[0];o.jp.Matrix[7].decompose(t,i,e),o.y3.ScalingToRef(t.x,t.y,t.z,o.jp.Matrix[7]),o.jp.Matrix[7].setTranslation(e),h.BillboardUseParentOrientation&&(this._position.applyRotationQuaternionToRef(i,e),this._localMatrix.setTranslation(e)),this._localMatrix.multiplyToRef(o.jp.Matrix[7],this._worldMatrix)}else this._transformToBoneReferal?(this._localMatrix.multiplyToRef(s.getWorldMatrix(),o.jp.Matrix[6]),o.jp.Matrix[6].multiplyToRef(this._transformToBoneReferal.getWorldMatrix(),this._worldMatrix)):this._localMatrix.multiplyToRef(s.getWorldMatrix(),this._worldMatrix);this._markSyncedWithParent()}else this._worldMatrix.copyFrom(this._localMatrix);if(n.useBillboardPath&&t&&this.billboardMode&&!n.useBillboardPosition){const e=o.jp.Vector3[0];if(this._worldMatrix.getTranslationToRef(e),o.jp.Matrix[1].copyFrom(t.getViewMatrix()),o.jp.Matrix[1].setTranslationFromFloats(0,0,0),o.jp.Matrix[1].invertToRef(o.jp.Matrix[0]),(this.billboardMode&h.BILLBOARDMODE_ALL)!==h.BILLBOARDMODE_ALL){o.jp.Matrix[0].decompose(void 0,o.jp.Quaternion[0],void 0);const e=o.jp.Vector3[1];o.jp.Quaternion[0].toEulerAnglesToRef(e),(this.billboardMode&h.BILLBOARDMODE_X)!==h.BILLBOARDMODE_X&&(e.x=0),(this.billboardMode&h.BILLBOARDMODE_Y)!==h.BILLBOARDMODE_Y&&(e.y=0),(this.billboardMode&h.BILLBOARDMODE_Z)!==h.BILLBOARDMODE_Z&&(e.z=0),o.y3.RotationYawPitchRollToRef(e.y,e.x,e.z,o.jp.Matrix[0])}this._worldMatrix.setTranslationFromFloats(0,0,0),this._worldMatrix.multiplyToRef(o.jp.Matrix[0],this._worldMatrix),this._worldMatrix.setTranslation(o.jp.Vector3[0])}else if(n.useBillboardPath&&t&&n.useBillboardPosition){const e=o.jp.Vector3[0];this._worldMatrix.getTranslationToRef(e);const i=t.globalPosition;this._worldMatrix.invertToRef(o.jp.Matrix[1]);const n=o.jp.Vector3[1];o.P.TransformCoordinatesToRef(i,o.jp.Matrix[1],n),n.normalize();const s=-Math.atan2(n.z,n.x)+Math.PI/2,r=Math.sqrt(n.x*n.x+n.z*n.z),a=-Math.atan2(n.y,r);if(o._f.RotationYawPitchRollToRef(s,a,0,o.jp.Quaternion[0]),(this.billboardMode&h.BILLBOARDMODE_ALL)!==h.BILLBOARDMODE_ALL){const e=o.jp.Vector3[1];o.jp.Quaternion[0].toEulerAnglesToRef(e),(this.billboardMode&h.BILLBOARDMODE_X)!==h.BILLBOARDMODE_X&&(e.x=0),(this.billboardMode&h.BILLBOARDMODE_Y)!==h.BILLBOARDMODE_Y&&(e.y=0),(this.billboardMode&h.BILLBOARDMODE_Z)!==h.BILLBOARDMODE_Z&&(e.z=0),o.y3.RotationYawPitchRollToRef(e.y,e.x,e.z,o.jp.Matrix[0])}else o.y3.FromQuaternionToRef(o.jp.Quaternion[0],o.jp.Matrix[0]);this._worldMatrix.setTranslationFromFloats(0,0,0),this._worldMatrix.multiplyToRef(o.jp.Matrix[0],this._worldMatrix),this._worldMatrix.setTranslation(o.jp.Vector3[0])}return this.ignoreNonUniformScaling?this._updateNonUniformScalingState(!1):this._scaling.isNonUniformWithinEpsilon(1e-6)?this._updateNonUniformScalingState(!0):s&&s._nonUniformScaling?this._updateNonUniformScalingState(s._nonUniformScaling):this._updateNonUniformScalingState(!1),this._afterComputeWorldMatrix(),this._absolutePosition.copyFromFloats(this._worldMatrix.m[12],this._worldMatrix.m[13],this._worldMatrix.m[14]),this._isAbsoluteSynced=!1,this.onAfterWorldMatrixUpdateObservable.notifyObservers(this),this._poseMatrix||(this._poseMatrix=o.y3.Invert(this._worldMatrix)),this._worldMatrixDeterminantIsDirty=!0,this._worldMatrix}resetLocalMatrix(e=!0){if(this.computeWorldMatrix(),e){const e=this.getChildren();for(let t=0;t<e.length;++t){const i=e[t];if(i){i.computeWorldMatrix();const e=o.jp.Matrix[0];i._localMatrix.multiplyToRef(this._localMatrix,e);const t=o.jp.Quaternion[0];e.decompose(i.scaling,t,i.position),i.rotationQuaternion?i.rotationQuaternion.copyFrom(t):t.toEulerAnglesToRef(i.rotation)}}}this.scaling.copyFromFloats(1,1,1),this.position.copyFromFloats(0,0,0),this.rotation.copyFromFloats(0,0,0),this.rotationQuaternion&&(this.rotationQuaternion=o._f.Identity()),this._worldMatrix=o.y3.Identity()}_afterComputeWorldMatrix(){}registerAfterWorldMatrixUpdate(e){return this.onAfterWorldMatrixUpdateObservable.add(e),this}unregisterAfterWorldMatrixUpdate(e){return this.onAfterWorldMatrixUpdateObservable.removeCallback(e),this}getPositionInCameraSpace(e=null){return e||(e=this.getScene().activeCamera),o.P.TransformCoordinates(this.getAbsolutePosition(),e.getViewMatrix())}getDistanceToCamera(e=null){return e||(e=this.getScene().activeCamera),this.getAbsolutePosition().subtract(e.globalPosition).length()}clone(e,t,i){const n=s.p4.Clone((()=>new h(e,this.getScene())),this);if(n.name=e,n.id=e,t&&(n.parent=t),!i){const t=this.getDescendants(!0);for(let i=0;i<t.length;i++){const s=t[i];s.clone&&s.clone(e+"."+s.name,n)}}return n}serialize(e){const t=s.p4.Serialize(this,e);return t.type=this.getClassName(),t.uniqueId=this.uniqueId,this.parent&&this.parent._serializeAsParent(t),t.localMatrix=this.getPivotMatrix().asArray(),t.isEnabled=this.isEnabled(),t}static Parse(e,t,i){const n=s.p4.Parse((()=>new h(e.name,t)),e,t,i);return e.localMatrix?n.setPreTransformMatrix(o.y3.FromArray(e.localMatrix)):e.pivotMatrix&&n.setPivotMatrix(o.y3.FromArray(e.pivotMatrix)),n.setEnabled(e.isEnabled),n._waitingParsedUniqueId=e.uniqueId,void 0!==e.parentId&&(n._waitingParentId=e.parentId),void 0!==e.parentInstanceIndex&&(n._waitingParentInstanceIndex=e.parentInstanceIndex),n}getChildTransformNodes(e,t){const i=[];return this._getDescendants(i,e,(e=>(!t||t(e))&&e instanceof h)),i}dispose(e,t=!1){if(this.getScene().stopAnimation(this),this.getScene().removeTransformNode(this),this._parentContainer){const e=this._parentContainer.transformNodes.indexOf(this);e>-1&&this._parentContainer.transformNodes.splice(e,1),this._parentContainer=null}if(this.onAfterWorldMatrixUpdateObservable.clear(),e){const e=this.getChildTransformNodes(!0);for(const t of e)t.parent=null,t.computeWorldMatrix(!0)}super.dispose(e,t)}normalizeToUnitCube(e=!0,t=!1,i){let n=null,s=null;t&&(this.rotationQuaternion?(s=this.rotationQuaternion.clone(),this.rotationQuaternion.copyFromFloats(0,0,0,1)):this.rotation&&(n=this.rotation.clone(),this.rotation.copyFromFloats(0,0,0)));const r=this.getHierarchyBoundingVectors(e,i),o=r.max.subtract(r.min),a=Math.max(o.x,o.y,o.z);if(0===a)return this;const l=1/a;return this.scaling.scaleInPlace(l),t&&(this.rotationQuaternion&&s?this.rotationQuaternion.copyFrom(s):this.rotation&&n&&this.rotation.copyFrom(n)),this}_syncAbsoluteScalingAndRotation(){this._isAbsoluteSynced||(this._worldMatrix.decompose(this._absoluteScaling,this._absoluteRotationQuaternion),this._isAbsoluteSynced=!0)}}h.BILLBOARDMODE_NONE=0,h.BILLBOARDMODE_X=1,h.BILLBOARDMODE_Y=2,h.BILLBOARDMODE_Z=4,h.BILLBOARDMODE_ALL=7,h.BILLBOARDMODE_USE_POSITION=128,h.BillboardUseParentOrientation=!1,h._TmpRotation=o._f.Zero(),h._TmpScaling=o.P.Zero(),h._TmpTranslation=o.P.Zero(),h._LookAtVectorCache=new o.P(0,0,0),h._RotationAxisCache=new o._f,(0,n.gn)([(0,s.hd)("position")],h.prototype,"_position",void 0),(0,n.gn)([(0,s.hd)("rotation")],h.prototype,"_rotation",void 0),(0,n.gn)([(0,s.mv)("rotationQuaternion")],h.prototype,"_rotationQuaternion",void 0),(0,n.gn)([(0,s.hd)("scaling")],h.prototype,"_scaling",void 0),(0,n.gn)([(0,s.qC)("billboardMode")],h.prototype,"_billboardMode",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"scalingDeterminant",void 0),(0,n.gn)([(0,s.qC)("infiniteDistance")],h.prototype,"_infiniteDistance",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"ignoreNonUniformScaling",void 0),(0,n.gn)([(0,s.qC)()],h.prototype,"reIntegrateRotationIntoRotationQuaternion",void 0)},123:(e,t,i)=>{i.d(t,{$:()=>h});var n=i(4141),s=i(1128),r=i(6113),o=i(1341),a=i(4649);class l{constructor(e,t,i,n){this.name=e,this.worldAxisForNormal=t,this.worldAxisForFileX=i,this.worldAxisForFileY=n}}class h{static ConvertCubeMapTextureToSphericalPolynomial(e){var t;if(!e.isCube)return null;null===(t=e.getScene())||void 0===t||t.getEngine().flushFramebuffer();const i=e.getSize().width,n=e.readPixels(0,void 0,void 0,!1),s=e.readPixels(1,void 0,void 0,!1);let r,o;e.isRenderTarget?(r=e.readPixels(3,void 0,void 0,!1),o=e.readPixels(2,void 0,void 0,!1)):(r=e.readPixels(2,void 0,void 0,!1),o=e.readPixels(3,void 0,void 0,!1));const a=e.readPixels(4,void 0,void 0,!1),l=e.readPixels(5,void 0,void 0,!1),h=e.gammaSpace;let c=0;return 1!=e.textureType&&2!=e.textureType||(c=1),new Promise((e=>{Promise.all([s,n,r,o,a,l]).then((([t,n,s,r,o,a])=>{const l={size:i,right:n,left:t,up:s,down:r,front:o,back:a,format:5,type:c,gammaSpace:h};e(this.ConvertCubeMapToSphericalPolynomial(l))}))}))}static _AreaElement(e,t){return Math.atan2(e*t,Math.sqrt(e*e+t*t+1))}static ConvertCubeMapToSphericalPolynomial(e){const t=new r._;let i=0;const n=2/e.size,l=n,h=.5*n,c=h-1;for(let r=0;r<6;r++){const u=this._FileFaces[r],d=e[u.name];let p=c;const f=5===e.format?4:3;for(let r=0;r<e.size;r++){let _=c;for(let l=0;l<e.size;l++){const c=u.worldAxisForFileX.scale(_).add(u.worldAxisForFileY.scale(p)).add(u.worldAxisForNormal);c.normalize();const m=this._AreaElement(_-h,p-h)-this._AreaElement(_-h,p+h)-this._AreaElement(_+h,p-h)+this._AreaElement(_+h,p+h);let g=d[r*e.size*f+l*f+0],v=d[r*e.size*f+l*f+1],y=d[r*e.size*f+l*f+2];isNaN(g)&&(g=0),isNaN(v)&&(v=0),isNaN(y)&&(y=0),0===e.type&&(g/=255,v/=255,y/=255),e.gammaSpace&&(g=Math.pow(s.R.Clamp(g),o.Nn),v=Math.pow(s.R.Clamp(v),o.Nn),y=Math.pow(s.R.Clamp(y),o.Nn));const x=this.MAX_HDRI_VALUE;if(this.PRESERVE_CLAMPED_COLORS){const e=Math.max(g,v,y);if(e>x){const t=x/e;g*=t,v*=t,y*=t}}else g=s.R.Clamp(g,0,x),v=s.R.Clamp(v,0,x),y=s.R.Clamp(y,0,x);const b=new a.Wo(g,v,y);t.addLight(c,b,m),i+=m,_+=n}p+=l}}const u=4*Math.PI*6/6/i;return t.scaleInPlace(u),t.convertIncidentRadianceToIrradiance(),t.convertIrradianceToLambertianRadiance(),r.i.FromHarmonics(t)}}h._FileFaces=[new l("right",new n.P(1,0,0),new n.P(0,0,-1),new n.P(0,-1,0)),new l("left",new n.P(-1,0,0),new n.P(0,0,1),new n.P(0,-1,0)),new l("up",new n.P(0,1,0),new n.P(1,0,0),new n.P(0,0,1)),new l("down",new n.P(0,-1,0),new n.P(1,0,0),new n.P(0,0,-1)),new l("front",new n.P(0,0,1),new n.P(1,0,0),new n.P(0,-1,0)),new l("back",new n.P(0,0,-1),new n.P(-1,0,0),new n.P(0,-1,0))],h.MAX_HDRI_VALUE=4096,h.PRESERVE_CLAMPED_COLORS=!1},5559:(e,t,i)=>{i.d(t,{q:()=>n});class n{static Eval(e,t){return"true"===(e=e.match(/\([^()]*\)/g)?e.replace(/\([^()]*\)/g,(e=>(e=e.slice(1,e.length-1),n._HandleParenthesisContent(e,t)))):n._HandleParenthesisContent(e,t))||"false"!==e&&n.Eval(e,t)}static _HandleParenthesisContent(e,t){let i;t=t||(e=>"true"===e);const s=e.split("||");for(const e in s)if(Object.prototype.hasOwnProperty.call(s,e)){let r=n._SimplifyNegation(s[e].trim());const o=r.split("&&");if(o.length>1)for(let e=0;e<o.length;++e){const s=n._SimplifyNegation(o[e].trim());if(i="true"!==s&&"false"!==s?"!"===s[0]?!t(s.substring(1)):t(s):"true"===s,!i){r="false";break}}if(i||"true"===r){i=!0;break}i="true"!==r&&"false"!==r?"!"===r[0]?!t(r.substring(1)):t(r):"true"===r}return i?"true":"false"}static _SimplifyNegation(e){return"!true"===(e=(e=e.replace(/^[\s!]+/,(e=>(e=e.replace(/[\s]/g,(()=>""))).length%2?"!":""))).trim())?e="false":"!false"===e&&(e="true"),e}}},5860:(e,t,i)=>{i.d(t,{B:()=>n,M:()=>r});class n{static BuildArray(e,t){const i=[];for(let n=0;n<e;++n)i.push(t());return i}static BuildTuple(e,t){return n.BuildArray(e,t)}}const s=["push","splice","pop","shift","unshift"];function r(e,t){const i=s.map((i=>function(e,t,i){const n=e[t];if("function"!=typeof n)return null;const s=function(){const n=e.length,r=s.previous.apply(e,arguments);return i(t,n),r};return n.next=s,s.previous=n,e[t]=s,()=>{const i=s.previous;if(!i)return;const n=s.next;n?(i.next=n,n.previous=i):(i.next=void 0,e[t]=i),s.next=void 0,s.previous=void 0}}(e,i,t)));return()=>{i.forEach((e=>{null==e||e()}))}}},6344:(e,t,i)=>{i.d(t,{$:()=>a,D:()=>l});var n=i(2262),s=i(8121),r=i(7257);let o=0;const a=e=>{if(!e.environmentBRDFTexture){const t=e.useDelayedTextureLoading;e.useDelayedTextureLoading=!1;const i=e._blockEntityCollection;e._blockEntityCollection=!1;const a=n.x.CreateFromBase64String("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAYAAABccqhmAAAgAElEQVR42u29yY5tWXIlZnbuiSaTbZFUkZRKrCKhElASQA0EoQABgn6hJvoXzfUP+gP9hWb6Bg00IgRoQJaKqUxmZmTEe8/v0uB2u7Fm2T7HIyIrnz88uPvt3f2a2WrMbOvf/u3PvvzP/sUf/N6//i8vf/lv/3v5H//d//Sb//Uq/5u8yf8hV/m/5Cp/L1f5hVzlG7nKJ7mKyJuIXN/hPwqXI/g++zq6rPI5u8z+WqfLre+zy7PrVv9L8brsMiGvk8XLmM/sdfHXal4e3ad6GXPdyu2ij8u/+uv/5cuf/OSLfdtEfvUr+dnf/d0X//t3H/7bf/hP//N/928h/0Yg/4VA/kogfyGQP5Wr/IFAvhbIlwK5CGQTPP+9z5uPeePJSW+yo2+s/GtN30Rnv1E+f5zxof9R/lSXv/nr//mrr3+i+5dfyX7ZZQP07Tffys//8R/l/9TtX7790T/7r/8G8pdy+/8XAvnnAvkzgfwzgfyxQP5AIL8vkJ8K5KsmMVzu1U7p5PA5AXxOAJ8TwPf7sX/51ZeXfcemqnp9w/W77/S7X/6T/vzf/7383RWCX3/z05/9i3/13/0PX//eX/2FyP8tIv+PiPy9iPy/IvIzEfm5iPxCRH4lIt/c/393//9BRD6KyKf7f488fP74/PH544dJAF9cLl98IZfLBZtuqterXr/7Dt9982v95S9+Lv+gF/3i7Spv/8lf/vnf/vGf/dF/JfKnIvLnIvLvReQ/NEngn0TklyLy6/v/34jIt00iGJOBlxAsdvv54/PH5493SQCXy9t2ueh2ueimKorrFbjq9eNH+fDtb+TXv/ol/vHyhX4Fxfbx7euPf/Lnf/PfiPyeiPyhiPxxkwB+fk8AvxzQgJcIrGTwFsiAEXH4/PH54/PHUgLY7whgu2C7bLqpQgHB2xvePn6SDx8+6G9+84384vKF/IPu8iVU9Y/+7C/+jWxffiHytYj8VER+X0T+oEEBvxqQwCMJeIngo5EI3goIwVMIPn98/vj8ESaAbbtu2ybbvl8u2ybbdtluSECA65u8ffqIDx8+6G++/VZ/efkV/sO261dQXP7wT/7kX8vl8qXIFyLylbySwe/dE0CLAr65B/9vGn0gQwRMMqgmhM/J4fPH548eAezbZd/lsm3YtssNAYiqiogAAkCvb5/k46cP8u2HD/rrb7+R/2/b9Wu9yJe//8d/9Ney6S5yEZFdRL68/38khG/uKOCnAwoYkcCoEXwkEgGDDq7CeQfyOTl8/vhd1QCum26ybZtu2yabbrKpQvXue1yvuF6v+vbpTT5+/CDffviAX1++1V9sO77WXb/66R/+4V/dgkbllQi+aBLBV/dE8LWRALwkYCWCNyMZXElkwLTMeMkga/P4/PH547ccAVwuctkvdxSw6bbdtYDbTfSZBN7e8PHTR/3u4wf55vKd/nL7DX6mu3791U9//5+/gkNFZGuSgZUQvnKowKgLWLTAQgRtEniTuEfwaELw0MJvf3LQzynud+53uG+X6y3gN9kul+2y6XVT1U27JCDAFVc8ksAn/e7jR/nN5YP+avtWfq6Xy9f7Vz/9w1dgRYngiyYhfNkkgzYBWHTg44AEMmqQUYQKOmDaiCIa8TmsfmzB+DnZDQjgcpGLbti2y3bZHjRAdRMVvb/dcYU8kcDbPQlsH/CrbddfbF98+RPZfvLFnAQeieCRDC5DMvju/vmD4JkEvjRQgKULeGggowdHkAHTYxihg89vu88I5UeGAPSOAFTlrgPopiqbKPSmCKreUoAAkCcSePukHz590m8vH+WbD9/JP335k6/+tA86KxFchv8jMvhiogE4JQm8XhfKqOAqx5qRPyeGzx8/cgSwbXcUoLJtim27C4Oi93+4v6VxQwKAvl2v+Hj9pB8+fZJvt4/yzfbF9lPdv/wJnsE2BogmyeCRED40tGFvksIXiSbgiYSRRpDNDZ6BDI6ghM+J4fPHeyKAO+zX7cb9t4tedMMNAQju5V+f1uAtBSiu1zsduMrHy5t8ePsk3376KN98sX/xE5FPAnm7/782o0DiUINXMkCXCB7/P94/e87AWUmARQWVvgMuKej9t1RLBp+Tw+ePgwngsutFFdu26WXbbl+rSvdfbnqAiuA23QcBgCugV1zl7e1NPm5v+LC96XfbJ/1W9y++fgXjA3bDYXV+MuhRwSPwL3JLMFYC+HS/LU8HYrGwIhwyNOF12SvgM4SgztdifP85MXz+KGsA2C6X7aJ6bXSAOwrY5OYIqGy3d5uq4P5GhABXuV6veLvRAf10fZMPb2/y3b7vX7+g+9v98/WOBq7GG7RNAlYy+Dgkhhb+Xxp0sE8IAC4SGAP/TbgVJK/PoJPBnAiwPKxsXfbbnRg+i3s/JAK4Q/4b9NfLtomBAqCickMBjy7BuywAUVyv8na94tMjCVzf9KNcLl/0SeA6oAEYb1i9g+FtSALb/bKL8/+t+wxXFMyswqiHoK4ToIgKqslgpg1qUC0QoYbvJZg/B/q5v4szHmPX7YEAsD0CX25OwEUVm9xag1+agKg+nxQArnKjAtDr9U0+Xd/k4/UqH7bL5YsewrcBBiMJZPRAp6TwQgWfjM9vgRbgUYGL8AvLWH2gqhesCokeUmCSwPsnhs8fP2YNYMO2XeSmAWxy2VQaXeDmDIhApf33rD4PTUCuV+DtCn27XuXT5ir8VmCJ2G5BpBM8/r/dEcJb8/0lEQMtJHA5TAlqNuLRhJChhEpSqFabH3di+G1AGj+W1/dyAR4IYJNNnuLf6+tWC9CHHiAtFhAIFLjK2/Uqn65X+SS67aK+3QeTDoy/IG2ogQ7fb/dAtz5vBgrYGqrwNtCHsVfgIvwK07OTQBURVNCBFpKCOjqCHn5L/67TgTN+fpySAC56nwSUi256kXsSuFGAVyLoUIDo8/Pz7fdoErr/v17lk162HbgHvFpIYDfoAJJfW4sGPjkU4VNAF8ZEcLmLhdc7kljdY1y1Dq9yLiI4IiRqcLujb138KIPn80ejATwRwIbtBvn1cqv+2J78/5EI5N4cJA8qIPcmwRsKAHDF9WYP6mV7VmrgLuTpxYTcMEW0LAmoQxFsuvAI8tv/a/C5fV2ZMMiKg++FCM7RDPRu8ebWY7VG6VJi+Bzk35MI2LsAckMAgwvQ0gC5DQjd3ABg2HQLAPpEAlZ1Bu7VV7MGHDFRAbo3VKsTbAY9sPWC/uvx86gBbDK3D1eEQS8pbAeSgSwmhepnJb6uBv/o/PzHLzxWA/X7TH77De5j6AGQi6o0CUGfCOD2X7cXAlCFQABtEsGLDtxuOyQB2UTQBKZe5GUPXgkUYCUAbZJRhBDeuq8xBf+bgwbehDm+BFQi2IJksOocvA8ysIMfxluVcRsY/eB3JzH8GFDAXQO48X/dcIf9jyDHptIigDsFkEe066tBSETQUYF7ElDdYEBytN4+rk9UcBPfrKaZqFHWcw3i4J8/X4ev2//bSXqAhwTay6OEIPLD2Ipt8OtAGzxkwLw9WVFRjTc/qC6H3+YK/b1oAA0KuOizHfieCLaHHiAb5NYTIC9EMEbZrVEQt1xwhVy1UfBh8PUOquMizwaap3tQXfY5B//tea/NZdfhsvbz+PURQTDSGWB87VX/7WSd4KxjUqrIgE0IUkoKGnhIvwvawpGf6eECXJ7tv4qbA7DJgwpsKthEmmYgfaAAffYF3HLxo0vwNjJ0SwRWMG4db4eh1gPNm18vQ+us/0eGmxDemu/fnM/X4evq/8342ksGHgLY5LyT/zg0wM8lcMjgGFXwqIOVFJBQw99eCvF9oZL9Mfl3QwAvIXDsBRC9R+fz8x0FPBLB0xJEpwUobrfAkARgIAF41h3wQgP6QAmX5E/7eI43IxGwwf/moIkRyWRJQIPgt9CA9b39nzt4bYUWjAlCjWDPgv8IEjgLJfzuaAsrv9VdVG4OwOXW/fdoA35qAdL0BDwvf6AAUVHd8LIEu94A3K+Q+2YxaB84MOH62P//qoo38fCRDERE2zf0JfmDa+MieElAjcDPKz+mRKCOtdgGtXaBjgNJ4H2owSpNeAW/rRH4CaHSpMwnBYYycjgSJwfie9CR6mPu20Uv8kABF206AvXlBMiIBPSlB9wjBW1fwEuSb94296VCqgMaGCt/G1BbExi3IG+r3a3J6P48Gv/J0YmEYoiGY7V/SxwFCwGoE/xa0AJ0CEiV9QPCJb1OJ5F1VTjEY2/MO9AEJvj1BJTQpqLfTlGwjABuzT962e4IoKnyrdh3+/6mzDVJ4PHOxj0JqGKoy20+wBMN6D1gLWi9NQHfVP5MEEPzjGYy8BMAOnTAJgEr8HUIejRo5xrA5xkR5AngmiSHs+zDDAmMgWzTg55GSJEmHE8IvWPAoYTfhWak/Wn/bQ0CGLSAjv83SUEfKp5q24LXuQICpzrjrgWoza8xVE00CQCORdhMJuTUT/rjuls0gO4Iby8BIEgK6gS7BsGuTtDrScH/fR68biUHNVGBnxjeNyHEvQe/ve3LZQqgG3rof6cEclsNflG9J4KtaQ8WHcVBHS1BtHE4QP9OBMS98mpbKTeDW7dJwRsnHpMBTFJpV4I+b0kY/NqInVFSyBLANbnMSgBM8F+Fqfxq/h657/Up+GaBnwV9hRqc9bZ/vA6vu+T9E8KPJWns94UfTeCj2QXwCHS9dNL8Xf3Ho/rfewSeFODGDV69AU0y6NFAE1DP3qK++rdB7/1HRxf86gT376zOr99T/h/ioBiXWQkgQgVeIrCC/WomhDmQK+hASI2ARQZKooHMLdCJwGEBBXC3+uERwg+VOHZ9ioAt9H80AI06wGgJ3nQA3BoCut6AhxYwgcPOFnxuFnrphk+NIKIGrWPQtgz3b0i7Y6D5rs1GKqTop0nQX52vmQC4BkjA+r4a7Kx9WLENGeegkhSETBCrNXIMdi/444Rw1n6E96ry7OPuj8UfLxtQ78NA2iSBbg7gIiIbdDLsb5agPhLC3RkYKv8NDbS2YGsatNRAG2oQwf9ZIOydgy1MAzBkAw8UwEEIDzSAqdPQ6za0PkeJAMH3Z0wXniUSZoHvBXU2mcjQgv56TedIKglCpIoQfgwCIjOytd8WgN0bfxoR8Fn9Gx0Aj5Zgq0lIZbsH/ibSJoFnS+C98g9ooHEELI3gliy25yONIiE6pb0NfBlyNEYyENoodkKwgl6I6s8kARgJ4ZoEfuYWHLEJa0LhSBXm7kImGeSfVdoJ1DO2G7WXsehAptupSOoyrCSF904k+6vt98X/ZcM98Hsd4JYIXhQAIg3/f9AAUYhsLQKAtkHVBnzjCKhOoYl2ym+iBtvzDzQ2DLXJ4PUmbJHAVnBQX4jkxfvHhNDqAdHXGQJgv0aSDGItgOseHIU+K9hXnIJzkoGlEKzNHagTdJ6VWEUH4iCKH4fd2AwDPaYBm4Wgng4gQ9V/CoGiuNmD04AQtNGMGzSAAQ2I2pzfogY9LRh7BrbOh4+D30sAencljFu2CUFrwY8UAWRfWwGvVOVfbx2uIILM0pwDv082dUTw8hYs8L+uIWiHGpWgClnAa1lMPJogovvvbePPs/q3Xr++kgCsfgB5oQF9WYKPJqEn6G+OE3i5AqouF59FQOmahQC8rlPLj38kg1c2f30vw+XaoIX24/pMGIgSBoZqoH3wo0sIIGlA9PWcCPrAtpPB8eBf6x1o6cHra+2+tpIFP4PgBfxZtZUJfo4qxELT948D9ucK8Mt9+ccjIQw6QJcEbrD/1g340ATuDgDkFfx6twSf1f9xvuBECYxq/7ythQQGm+5JDx6Brw4CkMGT3wgscCUoQ4sU2t6DR2ciBjTgtcpenQoZVX9NuL4Owc+dVaDursYVkVALX+shjSBKBuvCYDUZjE5BdNkxdHAUBexyHwB6NP7Iyw7sxUDViwge1t+mz8B/LAvVx/c3PeBBCToB8IUGOgqA3iV4yUg6UAOxaUFHDx6CYS8SorMOue0CCJGAf5YfRhoAI+A1CvwxqNkAY5yAIx2EQmkFfeWOXi+nEdSQQA0ZHMEItiagJArQxDXIrj8nCfQi4HZPAttrIahso9oPQ/2/JwV5JQU8zw+7I4D7/sBn4EO6rjw0FR+i3Z9fHtahzsFvJgM0X+tmVH5vaYiNDGAigewAz+gyNLThnjCURQFR1b9d3lZvnVqmj9mEPDKIUIC4KCCjBXywS4N+otp/Hk3QVthOkwEKlV9PQwXjT7s/zwF4Qf9toAAzFdjuaEB6S7D1//U5FIQu2MevO0rQQH8ZmoXE6B/IkgE60XCjVoq8gt2iCG0S8L5GdxkM1cGsfsCMArSCAnrr7dzAZxCEEpepvB8tqHJ/q+bmJGGts/AcAXFOMMeTwC7Pw0B6CtCtA2vWgonqBQJFSwH0JQK29OB2kvgj2HHXAoyeAIsCQO0kMNECAhFMqCBf8mElAkyBbX1tJQP2RJ/ha0gpAfS9l+/5n00CkrQpq0MZbOdAuxmMvHswog62jZj7BnYQe19b14kxNq2D/ehX/p68HEcF+x3yP7z/V/A/q/5DA3i5A/dzA5pdgbKp3v3/wQF4Bb70WkCTHGRAA6+KL0bFl6FJaFw0ImZwm6igSwbbwPn9RMBWf3sN2JgA/BVh/Rg0kQBgePf6HglAHLFQwqQQOwDjbdVxNZjR4iM6Qa3WxwvNxh0JFb3g/WzFQQS8b/ttKcDWoABtUMAd8j9hf0MB2uDXhzX4CHj03L9DBU3Qjz0C0l4mLSLQPicOOwZoVCB6P6dA7nDbGkVuxcNr8PU2JQO4wX5trEqmccZaHU4q8oCDFOpzAnOwqyMIMktNNNAHouDGxO37DgArQZzlmp/14W1QlqHTMaIIx7SCx0+5yza7AKJ3IXBrNAHVDcMZAU/BT/vgv/ULPOA+XiLggAREDF2g0ci6xNDRglegd7P7TWWH5oJfayliEg7bScQRBVgI4Ookg/F6rvpLWP29swREqA3CaG8/FpKqS8DTAV4TiBqIqtxfzaQRLys5I0XEFIFrPbZRQb+16Fgi2LvJv8EFUPW1gGfQv1T/F/d/HBnccP7rAwnIIyHI4ArgWeGbU4eHy6Tx/EeTZIb5bo/BsMBjmjBE08f/RB0PHYBd9eVRAGY7cHRwiBf8WeCPHY1bgBTa9xKTELzEkQX9CPtl0gJiqsAmCT7I8xbjivh3JGFI+D2nBcSJQJ8agDX+O9iBL7UfG4bzAkcaICrbtYHz1ycSmGmAjJfL3CMgT3tQpmrfB7gxSzC1DnvdhQMieG47u75+kTouKNkM8c/+vq/Q7ZYjO/hhVvRq8F/9gGfhP8aqE9EIdR6LTwJ1h0BItyDqB8iFwuNqASscRnYioxOg9ApvnYA35f8e9Ohbfe8J4rknoFkO0lmA2gmAG0YK0DkB4ieEjiLoMD8wBzom27ANZkzIoU8EMHk/uo1mzeVoEoRWKn8L/62EYAX/lsB7D/LXg74uAMr9oGivJ0CNJCGD6i9DhZdQF+gtOp4S+NODRzsDVbhdgv4BqTMNyIL9SCKwL9/FGPp5oQKxIf8A/UX6r231H7YIqLML0Ae2GtrADOvRQH5b/MPE9dt9BGLNG8jVTAQvIaK5TtvvvWQgDvyXIClUA78S9Nfg7VtIBlO7cbsEYkQDMot+ygQ7QwmOawTHnAM2XUSnJvPIYRYMmYPS+sv3J+cfP3d04JYIXsF/EwMbBKB9Q9AY+BiSwFj9mzrSXmcJhFPVHySTbgHJCPvRQ/z7G/SVUETsg0ZF+i3CRoCjhf7y1A9mOiDD7TwdwEoEXjLwAv+avLE2B7Jnb+OqDpBoAchoQJskxKnss0vu7Q2YhcDv4ySeLOg9GsCKiUIihP7yfW7zbTsBh0TQfN0iAWn9f72Z56/Ax9P7j5OAH/Qvv3/QxKfk0DgDuP+R3USg3bzBC7bO/QT9Eeh9QvDPG7glBQzJwK740lAFFgFk8P88CqDGAa223YckWYhr+c0BPdwetl2ocnsfzePAWcVnnAIp6gDVhDLyfV4nqFEDPxHsbWD3k4BDkN+pARqKMLYBPzYEvxp9xmCHQQdgWH/9EtH2TIFpu3AH/cdGydv1j0TQbRrq+D/mLcX3ZACZ15bF378CG0My6Kq/zoGOQwhASDFwFbxyNGBuSxbCEhQ/uEPe/6gAERWQObCVVfjPpQX+rexxYhYFxIkgpgX7Y/vPs+Pvxf9vwt8kAs7i32t3QCP+3SPaTwIytQXP38u0PESm+YER+o9B3vr8mETAUfDrEkPI80ck0FZ0dXh9U+HRbhey0cAc2H7A4y4egoD6y8JfkBiigLdFP8v2W00E8deT2IeAKujZ/QAVKpAtKI20gLWksHedfgPcb+0+NEHefd9vB9rayi8h7J91gBbaw20MsnWAF5xHkyDUCOoXp+yrOwwxcKj0aL6fFppaaKDv6OpHR5sgx5BAlK/+fYhuP1D196o8e7lFBaKqv5YIMnFQpd0FGVR35RJCnCDaABaXBtgbiSwtICMtalKC+1JQ6bx/PLcDPQL91QFodQNKpwOgF/9eqcBxBBqRcKAAVk+ArQOMx1RYGgB6naDhlK+uQQwJYx4meQbxtNnYQwMjt/d4f3M9ZE4UOld1LAh99fbfzOxiEkKFCkTJIUIMUeVnJ/9sDt8/e1NEJOi9oVHDGYhgnSLss9DX2IAqw1zALUncKcDr0FB5NP+0cBQNrEezDiyiADPkt9qGpwoPdL0AGPx/NOKeyf3b9WJNdfcFv6bKd2cLMJVfJ6Y3B6wB9WFUfWWEwKMfGiQL+3bz9XGQz2EHKhF41GCtZyDi/gUCsNhYoAr3UNJ58YidHKqnMb/6AB5J4N73/4L+t7mAkeeP3P+1LNSB/l0SkMEd8DcEuUlguEw6t2AU/PCE/q++Akw6QFf1u6SBrj1ZnnhG50AfkoGIdf7gJv1KcSfgzWWkQ9U33Z3tHXYASKJ9e/YhU90rvD+q9Ej69/wxYJVs506Eg/r3DkMDzEdDBRGgcZay49XihLA30P+l8N+hf1f57/0AoxbQbwYaan/rBMirE9Dk+sBzTkC8JNDEUlv5McB8PP19Y01Gayep+hC/2zvQ/2HGLAurowsNGlA1cnqGGzeH5weiYLZm7h3QQC4O2tXdhvMMk1ZS5ebpgI8eMrPvPGkwaxayk8Yc6PMOBPEdC1XZ+2UfbfOPtxLMQQAG9BcZFoF0gp/RKjxe7+oAw9T7ZPWhgedodgz0gf5KBtrtIZhQAZpAV1Bi36w6t98qVfH7hqGI318lLCjLCUFlxRHwqYEH9a2qb4XjWvDT7kBwfbZA5P0+PNuRuW1yf4yNQH3zzwv6b70QOJ0G9OT/dhoYRUGT15uQH/71MjQLtQlxfDuiCXrtM+SkA+icQdH6sU/xz7Ze7FlubV4TpoTQ2osdpaEjtqADmEU7OkBEFoLeC3IWFFeswJXKXzkboNL+wzcFHU8hTGKIboO7CLi1/P+5F+gydQhuvRbwEgxvtACmANikhLTbj0gCYk8KdlYgmj+4Ymaod7TwahwadICuX0Cm2fE5iNHPK0x/CDV66Kyg1MnqjNFBnhBoLQCgUULfaVe5nq/6EQWY67bXCszUb+7232fVPz51iGB12owK9peyP1T4raMFF/OEYJP792mgXYfZ04GHMAhBkCSmSj+dKqRPgVFGHbpLEGMiGFeQWfSgrY52VxaeDUPSNJI0P7NoisG729HHl78z6hxfs9rV3m4JjgM/lsui2qmThjCfDFSb+I9vwUqG5wwL55U7C+6ot8B+7N2o6r3q37T9trfpjgmTvv7PSQATLLeRAOZhIJHBQfDQQJPBdUwEbVW3+L08EcEE/9G4ANrCeWcnPKRHDupbNynMx5AA9IRYLmrc/YLSiD5EaEBS/s/TgnU9ILcH19n+CpHwegLejx7Mn/d25fdN+e9U/1vgb7bqf08MOtf8EXxaoh+GY8L6gDfhvs4i6HQ7seYI2sv1GchdMsBIG3xlvxcCRzdgCPTn+6q/TW00VE8Q9FaFv+R2VlOM1vm/hhjhDCdgNflVKME5B47I9xT8z0YgPAJ8myb/LqHy36j/Mwqw9AALxuO1JVjiuQAYLcFzIhiEPe05fk8tRjGw7yWQbsfuLAT2VqOId1osnr0F49VM8INACPHDoBz4B5mqqSnUgyh3ArjXxfQH5BbgUS8gP7aU+w0zHD9GGD0CGHf+P1p/DeivlhU4BbxR9a2kYFR58YaDZCUR2P0DMmgED2eg77puegy6PgDphEB0CwlG/i9d+/Hs34pBEQrBn0W51mqGnJAk3ACCHeiqkQ1XFQA5AlKH7Lk8yJKWY3/nym14h2C3JvxeMwD9ZVMz0BPMi1n1RbKl1cYhIVblF3G0ATsRiCMUvoK9//OgcwYMoe+ZKOLlC6/Xk50br9NFz9fanqA8UIYSpCwlBO4kHc4WLLBfBHVaKwKgLQjmP4Un61Vq+3s7Bsyi0WztmLjJwJwFeE0I2vD/1Q6MVwefxfUf32skCPbCnxQqf+QMPEUDHZ7vGeyj020JgkPXXwsldA7SYR1RE3h94NvNtugswcgxXEkIcBPCGZ1rmrgDC0A4K88nm2fn/eTnpQtWyZfybRoK8Dro4zYDIMGsf7saTBzvX0SMbkAD6o9CYbsfMK38cJKD9l2FJt9/VGs0h5Gib33pxMKWNsigFUh3G2un+/N1WUglI/EEx8fq27vUNnwsiOoKecL7kQS8VnWAGCFUgn6dBtQhv40CmIYggwK0uwDHRGAuBXVdfwzHUjZzATLMAoyJ4FmBhzaWBlrHld9CCWpPHRqofBqMReMGTJ78q9rDes1Tv7/0m0v0AFHXNR6P6g30SHivin7V1BOhh3iWPwvps/yE836L2XiwnUT8x2iHgfqhnwn667QHEE8oLQjEvtEW7GYBZDrDVkwNIO4G5GiBDf9fGoFM6n+vbEtzXwP6u9AduaWnGYSLAlVdl/AU+ikrSeEIKgwdaZ4AACAASURBVKj4/wtgHcHtdO2nWKcBkPfxcvnNQvsj2Me9f02r76T8q0IBn9OLKfz1HX8yVXQYGoAB/2UeBQ5/5kCL6+H/OGGoRnLSwdd3oH8r7KkGTbgIxEwVWvnF8KOpHnyzfF9Jod5Px+IF1h8owyitDw/XEgRb5bPqbt1uvn7qBIQ16vtS/u+DP3cR7CH0WWJgd5mTJKYgNzoGjQrfvu99NDBC+bnyW1x/qhTatv2OaMKgJWPvv5kwnMgxHYGFRtJW8VMl3uP+MgoqSZyWFKr7+KIDw1d6+IiOgZI4+d5iYL3imzbgyO+tph9t2oSBxOM3ugHtPoFZ1LM0hF4kXNEBssvVgPdjdXZWK7uKvyS3q1Xb1WQwtVDqSUggq+Vw3t56JA2cz7PXOwGNW1ecwxPhfe3QEUsDsFaAz8jg0nf+iZMAHNg/XSazDuC18Iq1HBRrOsAQ8NLB+16g614jmuSgs3bROxE55D+WDDQNA4ivdMJ9M1b309UqknaDU8ObV9/PwmMPATvTMAxpABLBzugUtV9bLdhNDQA+7B9tQJ06/7QNDHGSwtgZOCIA47InIoDdROQGtt0U1HI3GaoUnCnC/rzBMQJteN17+VaAzYNA7e+PFqHQUyXPUYB7iQYa5ZFjq1Zqpx8Uqu/XT7+6BWC1Xaj0GlBIwMoHu7UzcI/6/Acb8KIq+hzmGWmAYnADrIpvKP7TZeLaf0LAeQkGgebbq9FToI44p654F47tekKkI0L5PQNZPsDwPBpy/ni+wKMN76Vav4+2cFZFf8+JwAraMt0DFB7beA/u4Zz/a+RXx0M/ct4/jwaNAS8G17eSwmta0Fhx0VRxJkHMivso+onMXr+YwdWKbgioy1jp4x4AzIKg5lEA7wvHEYCRmdx11TAuT6lDLVl4KvXkAET9P4RT8H2u+lg9EPQIpw+/NpJ7RwE8HaDv/Mu4f3OdNkq/EfAiEiOANjEALvcWL9gfFV4NZbgbQc6qPky4Pm35QZxtH1f4j+P/jXuaYPcWwIEH/fmEPBoAO4m4LGxV3txOQqDU+dXgey+UwSzuqP++uImO/u/6ogCb7wTc1n61sL+vZi87rxnrNas+giTg6QLzaUCjIp6JfhwtGI7AjBBB9JjDY4ePYVR6ZPgN4owVv6Q2N5hhVHwNeYrM+w6dN6K1sMHZm/Ce7bHe3dzKr1xw1w4JrSQMZtgnoQHlr18fzunAszD4qurNUg/TDqzx/lfCaO6t4tACMUQ6P6htWjDPC1hCoZ8kpODzJ70MUR9AODcgwyqyPhmE+wfHYB/hvSqt6qeXUShhXH+d9SR8DzrDaZZdpSp/HxqLMQuATgDU/qDPRgOIeT8cvz/h/XC6BtE7ACLOWPE0KIS4UUjmZaJ2grBphiWgT41BUVWZfP3AnEIT6OrfoF122l2rMycBoU5i/OXoUZ4/aglsXwLzHNU++FVF3qikOj5HXm2PBitT1WuvJRAB+6O//W0/PY8vQH5IrAsMs/WuVmAdHBrQgrbOxJShXwRSsu08h8JMBpo0+aDTALwV4tbswgzHrftG/dJKIAQb5h9KCssWIMeto+GYqG12/HWGjx8kzqNJaa0noMWOr2KwW01AMwJoNvhMQda2/RKQP/3ecABM3g9uD6BY68Ntz9+nDOMb5iV+hIE+dP/Zs/wwJhJ9mgBnohBuStABUXjugF3hkXF9ZZJAjefKdHZCc389LoStKvIl7QIEb1d9RyciQgFDI9Cjyccc/23Aam7/PZJBhgDgin5CtQvbCzX8ip9YgIFtOAt+w0owp/hOiCWgEGbVHuYjRigPGR/YOnEoqPDoV5z5YqB3mRq2ox5ICmSSgAP1Ne+XV2NE+/vuFbCTRADxtS70VRBCjgBk2OyDUQiUgfl77b7DwaHm2rAZ7osRSOOUoHgKfNBSLI767+oDYrfwZvqChSpGfj3pFwZFsCJg2jeIQQBUiyI4WgD68ww4qO8khuWkkIuDrxWv2nv+UTBpJYiPd0KemTA8qqFiuUF1jWS3BoG6pADJq751JqBI0wvAVPyMQvjcX1zbELltKK+zBiXRFiRxG+b7q3M9xuLdzR8g0gCGNzSM5gNYfqGO9CBT8OHct6oB3KsSDBisUnwsFuISQaRHxDSv0vptt2oeLHMERfRn/FG/Cx01EpgIQG8LP+/i37PKw53xn6sYCM4/JwSRrCnIeB1ZkLsawDhaPKv/njU3wnZ/dBdGE8+YTHSG8+ofGgIjsC19YnwdM/KAnTSsqj6ig7uGgIPw3nYFzhhIIvriAxFP9CQd4HSlnzgxONIdrE7A8ZDPx9fjib8ifgegNIliRgdx95+E1T7+3nQVNNhEzDgGA3T2rEDLduwtPpuuouPcs8swwXFjdTaMKt+jA5gUAQPcf95KJQxYU0cYxEDvsBSmYuukp7AwnqniC9Afa5z8vboI68ImT0t26CvwBzSggkj447r9IojvCn7U92J/Hw0QSdwZKNNjxPCfSxRqnATkdwpOwh88oc4J8KTSm/wdbZjrc+4iFP8YO0/5JJDCfaijK5xVXevqfg6zGRrQf83chvX4aRfAE//6vv5+6490U4ADdO7QgM/5bcHP/n4OtCQhBEFeDWSvos8DPq8/IwzLzjpa8/U6MMSkBklDm8e0mn3QIY7XG1Om8wzN48y7HwhOK3P0/ZwUQHHv4psbdoVeb9VlAjChBCdtDDpOKTh9ZfcagOYq31RFjN4/gwBYzp8lAwYNwBELhZoxECeZxMlAzWGdCRV0fQWGHo8+8Kx+AAxnCIzowAxy9KvNepWfsfp4RR9kUrD88CPVTuXRybhqqTHcnxEGndsgub1Gdug8yz9fHt3Hpl57x/mfCOC29FOSQ7/noAZR5W3Ob24UMpuPYAYiQrQgk1gnFoUIKr4vKFpV15pHUJO3Y5rfH3UFHU4bGkU+NKJ9f2hJyOMxDBDpjAgwiYqvk5TqNl9EH2Arb6fA3yaA4cBtPWewhkEcIQJBlGzYp6zRmr1v+e3Fv27xpzvyI44NGDkCIi7CGNV9Dw0M8NtHC2vUwHINumCGNG8erxOwtQINsW88Tlwdoc+F85nI559ngEDpt2F/Uu3hiXYrkN/pBFS26hYDAkFgErMK67y9mGBA3L5ore5izf8b3n805MOq/t7XU4WHv1DUF/5gugCSOAIW/59uMwl6CHWAib8bvfxWl9/rBGEMTTwDfG+ezEYG4yk6FvRPuPwE+wvc39IRjENWM+/cm5b0W4Pf4WuKUnw/vD6eDbB1ETs5vl77Dhnm/51g6wPWwQAqxnivgQaeS3gy/u/1H4hpTPrIgHAN0mSgXUX13YP5PMIuQAfBr/f70cdeE+QoCX3i8nFMLcAjInBoAIYqt1LhC1WdtvmSab28AYffaeivCB+ohdYQgfUa/WS4ToMsNLHLc9nnvPZLwn1/EefPVf+U/xvnCVSEQEkEQEnEQJO7S7RvYDxNeNYKrG7DKMhtsQ8cMmhgPKKKj+F7CiHYFR5KIIPxOmg5IVAtu3ACQSPh7CzUQOgAej5CWEkIe3vgxz0ROGO//qYfz/dnLT+ZxDr4QW0eNCJBorCFOVC312Ec2TiY5Bk0cAaQmiA1VH1MOwDHQ0kHdEDDf+2UTWhS4Z8diQMicLx8MLBfverLcP/jQzF0P8EJj5+NGK9RCz755S6F/f1+X/gxeP+Wsedv+vF8/54aSPJYFjIQd624MDz/UDLQnr8HU3ztKHRf8Qeno1vyAQJBaLcMtTV3cvgP56COCqd/QP9xLgBkH4BxO13n4hNUDtACC6G1S3zqooZ6Ba4lp/zcAFb7iERKQwQcF39IFJjdXECGADw0IE4gg674pYAnk4HoHPx54tD5daO5vxrugSkMjgiiqc7TVKAT6AT8R4ckbHEQCYR/IZBxJgA+XZjsR7vaoRpIxWqeqfXuGC2CxwudicwePEB1kNkaZCuwyF0DuKv/4sz9mzP/Qxdg3BDkBTMC8Q+loD6UGBzx0Kz6eAX/KArOQTlPHFoI4vVtf4rNuLrca9edRn4xBP7k8w+9AgZCgBfEUZWfEs8iFNZ3UO7TqmkjCO/rWdgco/yIqHcQWaC2EGTzgz5y/iXQAvyx3riyxxV/JeBriaGB9OrTA5g9/eokM+37GszqfA/UZk9iW5UnCtBqBl3XoNN6Ag/+zy6A5evPAp+TIFDn15gQw9rjrOzFX0s2JBVAxa/nP1a6AsNWYGjPNGPLTQgBsNUFvOA3Ht9o/rGDN0tWOCcxJGp+f7++kkP7PxcGv1+GjkaLt/fawpwwerQxBJNW4b+PJsYEgiAYYdEAGIlDNaAbRkIgK3ut0jKByp+8yz23X6GttmBmjwDvChgiYLP5V/zhH6/110sGcKo5CkggCngxnIPoPja0j2B+1BRkiYJiviaLJqghDI63G2nAgAxMCuDdnoD0wIQm+urMB3VuAwbBrFGgGgnhAFqg9+ujKsLxB3qGCQNEEtPinIQlAj4WgIw7/iXc9V/x/yUWFs2KH504bAh4aYWf4TrTLGTy9YbftyLeVOWNfYNyt/ji29mQnqMAltU3ioTtbX343yv/1u0YPUBz6zB702tQucnX0gWaFh6DgPdmhXaapGotw0SFz1qDiTMdd8h45HfcqCPRUhA3+NmKz1l9teCPaMd4urGaewRitNBDdahR5c3AfQmDCFT9vmtQEwqAYXX4XI2n23Z9B/Yb1FL+LWox6wHGbZSo6FR1LzyG+3hriSZvWT6jfXhl2cmQZJDrAbuYAqAHo1GA/EOgD8eGcU7A8eDvH4fQBuAhBL/Zp/vamPTrRENDGLTV/7E1WEPLDlP/PwzU4YhusIMUgfIPAr6Dhv5R4y2r8ldFwiFoYHnmr8TAHbhRQSZOctH598ZYhqt6wP7q/ouqe77RJxvzFYaji/z4vna4v5cUMDXqDAJ5ytktqtBDckyjvJg04hl16LB0xFfyMfD77PZjErGQRRjYIfSvoAXntks0ok8MsUC4KARWnYPlJBeIgLeFrUgDOHYCag0/XNAbWgRwQuLAsaQwIhC1g7+jCNKuT38JfnYSyTi+QQEwwHeT4/dWHYxJPxfOj5oAnRQqgU3YgGZSOaDyK3n/qkDYBKptzR3oD6B4fyRKjp2AzSl80YR/3P+/1vBjX18Jbu+YsrMRgbqPP8zrDLTAaupphfeZtyPs9BPztpLSBZjowF3woYRwBwOWaqbev15b7X4RWsiqYiY6ZkFEIoUwUA2OrkeEQE8HYNyD/rl3m88jCGgO/nPW3xy8x4Q/HBcM1dYg5q8N+B/SBSYhtD0EY1PRGLDoKIBHF3yLz4H/gSYQJRETgqeB2d4vC8L2NVnQn4PoVJJAcP0inahAfdXVI8CFszjRagCTtRdV7Sr895NBpRKXIT64RMFw/iw5eChhEvmmyUIH+k+Qu3cLzOAN6ILlFvgWnx3YWFDz0f38ze9GlfP6UQ3ojEY0gtqRIEbA5/WgQFhsEuIeL75uTzvqHktAWfj/OD6sQXssROcGiRgFn0QVkld7OznMDT7CJKzhMIqxW9B+LCOQdH4uyxIcE49VTSeLj0wKjzcp2oDXQA8YoDEGBLMW0BJw+eAxXejPV/IXd59/tp5rVyYXDw5BlRetSpQAcvgfOwVM8ObzBq/AQ2wX4lwkQV3vNhYFfn2LFgaoDU1ogqsfqGkJYmrj9Tr22KQwBLzbLuzDeA9yzyJjVRfwegWq0H+FThDPA6ZhZwX2M2Kh4waovCzAWJTzD/qY00c+6PM8coz08VNqglzx54LfHuTJK7z2rwX35ABLg1DzsZ7Qv7l/f2yXDlbf4C/irg0MJ0aCuD0wP74MrxfdFlX7tq+vtRdCpvt599EG9Yz3V+P+Oj/n4zLruZHcJ7oMt/MNp9eD6HEeFb6/TMfbWo85Pb79HJo8t3371/PuIAZqMvjPC34nVV6ZB4hEuA7AzA5cfU0y2n6ux89D/35/n2/vWY5Bf0qwf3tPLISO1Tap9qzFB6eap/beqI94NCCbGwgqOItY3CGl446CaQ8i2Q9g0AvmgJOnBoAA0gu17tsKtKS7D4udgCYERy2QIceCX/P7mBW+g/7D9S6Mn50CS0eAoQPDcBjopIA5+EcxEjLweRjXq0UbLIjcBxsGx2IZvlf0ATjz/6qypAmY7bhrk4ahsIis6ccXKHdueAfUgk+RWPCLh42c6zEeKyJpRTdRAOqBbl/Wq/uT+q+Fx3FoTIuCzc6+hN8j4veGjuAnhSE5gKnco3A3XwYlq2sq+lmP4yEOpqEoG0M+mGDYuYT0pKCFHgLHKt3T7T9p8GcWH+n1UwGa8X6kQt2x4CeqPexegT6o/Z4Cr313PHdgrsS2ZReLfpKIf+IMFnmVmwxQ9AhithYT73+p2s+JIVfrjwiHnpAZrSsr9CMstQXP1+1+510N/q8E/YoekMN9OMFvi5LvkRDsy9rgFCOoPdpgaQIWBZjf5KCSQszZJ1ivTvLokpen6tsJAVND0NFqb6GUGg2Im4Dyx9Pn7/0dm4pADAslJzTv+dKNrAPQ0wyySm7bj1RQgbAXsRa4R+mBJzpaQmHLmy0BLoL+Nh2ZRca8uUc6P37k97n451fvTieAE8BdZ2ItqFEK6oOJIYPsiU4woo140Oh+H/UC++gatHYcOFT+2y3AYvD1rM/fpxdUcsAi70c0OxAEP45X/hymE9XeoC0zfYhbcqfbhs09HpwnKMDR6g0mmYyKth/UcLl9ITGQ8N1S6s+gA1HvQCc2pluPvN2Br8SyZyfyxPP/VhCi1L1HWX2CQCuAE8TIq/sBYdANZmTIwqq0sb0HIzhhugBeUpBZLFyA8y+EErsBUYDZHYN9QAAooQwOws+uQlhdESSSqk5Qsh8LSYI6LDS1AbmOvLlRBqQIeITvM36+TP63VfE5hFClCTr9zEyVFwS3STQBy66DMHB+PJWIrfgGnYBx2dTboPa2X49GaBVlePA7CFx4iaGi4ns0aLVjMGvtPTDtmO4XEE8E5Kb/8qYai+NHl60LgAICcUCoJPVeiYG6Pxw/X9VFNVbFn9FNPzXoIRDTyzcpREYB5Fm1EQQn3KRi9wKApR8Tz48SwxnV3qM0q7ZhpdKvr0zfY+gO4oQf+EGPFYW/Xf5hwWsUgxiBbShGoGIx+D2eH1h2EeR3UQMH4zMaUKr4033nzkSkfQADelFbLOQCalxdxvN8mInhPas9bxtGJw29Fx3Y8429MAS0fL33Oeo7qFZeiToCC3B/VSNYuU0fgDnkhxGgMFdxiYEY7MYel+OHPH30IMeVFK1C79l+QdXVpFqHlMAXEf3EYDyfkkGdNvJ8f3RAXU0jpgM7jMNA5yCrtfzOicKG/M9bgEkEjqqPPDEcDfqVwGZv6zcO9avDfOhf4OmLFd9OLBHHdxp51HvOBlnAoQksYjASA1xnIhPsapTCPjbsGB2YevpPpgM73EYeSYIftgPgte6CWesVBB9QEgfnWYMgoeC8ql69bWoRIqYHvSIv/u26bj/jdqZ9KSGk74JRo6QS9PuTiSHm6Z62kLUGH0UO4rwWrhtRETkR4iKRdI8giJ2D2nUCMjsA0TXiVDb98NAf/rCMlajA9wesWHZrAe1dlwRyVI2jx4KkyUHSx7YDe6YD4tOC6XW01puEdAJwaEJzf1uATHi6ZlSCpBQscsh6C1xRcWEG4bCFeKcAVhVlDu54JQIkTT21hptIT/Afk0kMcS9BKfjBJozcDXCrtgbWXxbMAw3INQIxtQJPAGwXmYaBbYh4SCsuKwLOAQ5awKskCMmRg8P3xwlBfbosQaDqyZqBkyQe1CLQACoTgN4qbyHsPwkTiF2pYaj6MAXBmUosQHnUEYCsBL3MW39SNKMJ5PfoBsT33DVJCEbFnBCMOkHfvj6Xq8uw+dgRIhGgAiUqf5QgKDFyhe8nnYrlqn9sG1GoAfirubygX4H+8IM1CmQrMFAJ5ExzKIp54nPoVU2Auh6eBShDlTV4u5c4HE/fVvjFrsII0Ik6QX+Iq68jB19ziLoKC27FYe0gC+j1RSS+BgB7AvAM3m8HLdy5fV60C8RMVuhD1ieQB32MCCq0QPJuvuw5IHF/geMKwOPdpmsxBwVEfGEOgeincJqNmuSFIPhPq/xM81CWIIi+gCFBqDX3QPYd2OcCRo6GZBoA3AM+00aesAOQ7/2Pe/vBCXoguD4OBD1WfPwClzcui12AuH+gC0gEwW72KfjBCQRBr05D0IQc7N8PzOCMehPWK384MPVDJQim7yDdoiRTItzzFV/ZOX9sYFetP0fsQzb6O7wOoFjxk89YoQXv+BmSN+yYHYO+BsDRAXHhuJXsEFbdIEGZQWUkNVNzGA9NZUVBIQL7jASR0AclE4Pb7JN3BO72mG92+o8UG3nybj+mASh0FsLKn9GPxDrEcS2Au35BzHO1BksriIJdpqWjKR1wlpR4fN977rZqI+XbYjYDgVDpcYQalOYKMiuQbB3G6Pu/HlMbi9a0EMkksXtjvvXTfgMKAEZRN/i/O7yD8Da2S2Bdh3ICWfp8yuMkYl5a4df4vVWt4UF0yyqEnaT6swYyWB8/j111Y1ERS9oB0SLMtBGDEBD1PEHwtdjUEAHnqmoHU4wCDAoAS+lHwtu9eQLUAgmxVvAuMB9cELMV3m8EUtcBYYI9nkNIEEJYrQeUHfnzzRyC39j8CgSkir/E0P2odnAmAqDnDIhqrtV9BDNS2POjv/0pwKr6z1h/PMz3uf9ykFYq9TtoAXSwpz0HljdvBCVAPY6t7osv6gFhMpkX13rcfXQMIpuTsfTibkfOPRAC2meLRipI4mDPwMD5x+v3+Ey+qEfACwoUEkKQSMZxYJDz9R68PyP43yvo2aYf881rNQbZgRU/jp80QnW/hdXqJxMvCFxXQSNHpE8QiF4XI+wFfQcw7VL2Md7RRajsKgh2D+6SLAKPF356+/7yXYBTUgFy/38StUjFHweD+iiHh8/LV/i/TSvGk4L5x7F6AsIKbgb4C0YjgdGRIToGUx7cgS3JKP8pRcgak95BJGQbjaJdBYQ1qHYnYHL8F45QgHx2gLMQ2cDxBD/4SeR0LSDi5XzPQNjM4ySE/HGG6g+ugltLNSARn281BPtNO72eJLjdX4ITSEgpQvJYFEUg24f1qAYQNQdxx6Q/RcB85j9f+03zf2QV33IDPHegNgPABTfqFR8cZK9TA7/ll0EQbUUHW8Gr1d+MSadia+LRHwhunv87yWoJ3h/pRDwJAbDNQQFd2P2mH4kP/wDT/ZeN3CK3+ZjvgVpw4r20AMafb58j4N1UMknuj6iCx883PU9g2VHVH5JX2eEcPghSgRBCKPzK0Q3fknwPN0Hk0CyC0zBkz//7duEetgFjVtypASDI4CsknYJgYDhqsBxxy29+eyxrAZX75EEf8f+CkOcijMDDHx4ASYGGu8WHgPwpHJc0qOG8FgFTuVk0cRZVePFwHEIUEu8xSHoL5qWg4I7/HgOKXe2dcnu2SSdCGIDTA+AcxY1zYL6Q6AAFu+/1GvjKPSeEoJV3NiM4Dz9C6oWkEav+NWjPWXNOIkKgNTi2I8LeBgaZHJxqrC4oNXoB9pzzMws/OW3ghSyQJgjbygOVEDhoj4nHLld8HPD6UUMFVLIgKrTL7cFoBRLQgEdXIseZ2/HhFPKbk4d5tYWwwR0nIFQSD2P5gQhs6meVfB+Bkyz2fOIvX/zxqsSODuAGIOLtPNnmIPCrv6Kqvgz3q4tCwNl9lWYfnsdHj2HTgQw5IBHwULmfSu1jEV3gDFSxTBmqSEVqiYK2IkWcRiAkwV/cyW9YhqHXDw9dkNQAcO6HFNJT7oChfrPUYc3KY17zAd+evAwF2w5SCKLV4EuCEKsKfjBVWHu9Q9Arh4CoBqEMWYBsNX7YgKP/69uC3M7/mOOz232QT+ox4iCyJGEFP4oBHd+GVvXBwX35nqp7qeIbV6L6tdZub3ueJ+gBIKgC6S5gOQFxDoGr+Bv2nzqbknd7ph/EmXzO0o+kZdc/wqvQkAOUffVMzKtYgx5Vob1/+HAfCdzHSiXHenX35/2JTr3KZ9Ruj2lYiMhLIFoNyMq9hFroeYMTE0bSLbhb4l3YlFPa6hMd2jk8dmrDgdQCnC4/+ANFlYTB6ATlx2GDGXP1rvL+SnWHw+cJes5/rRWt4H2pw9GklD4uSMpwasIQiaYR92gIyFX5S8dtRZt/nCAH48VXW3hRE/HKOsGquj8EM85Q9cfeAV4XwNGAlmIFIwPYrfLKuxV476RRetzcdeAsRSZhiHizCKEIOHn3EMOWy5X4uIJnXX6sFiBFLaBm/THOQAkVJK9j6TKwiSDTBWpwHkSPQJX7U959uAkoaTUuug6oQCBz1Zlxm0OJSIoIw04M+7zCGuYiznCfHww9AN6Ir+HXA7lfn2oBSJ2FOOh8SzINfmcAyITq8JX/sOMPx6A9LeYtVfwgCBZhdu25OB9/XmWWNPUEPD5dUuJ68wd1AqD2+w1PI9KxE9BW5t3z/igdYGWiL7L+wPv9jgVY8f0ZcbCKCuLAHN+c5wa69Zpr0J9t2KnpAGzyiAIPiFalJ8/xXrrA6Y+/8NoDnWCPNwFJzf5DpVkHte8hx76P+HU1+HEytEeSEIzAsu5r6wPJGu6oLz8VrKofXLce+ywIHhNa/Dmw8LrptWXZ4NKZm4pr/QQ7Qk8ehMrPtAF7PQCD309QgRgRZMKgAbFREAfBBXNalbHA9cEHMo4IgIUuPjjBWEUFEQpYTkhVO43eRiynJw9Jjj8TOUIlJExK+0wA4gWgQvcFBHAc7P4/u78/Ff4CC5ATB3P3oUwFClYgcALcxzp/B9Ez4DUV8RjBbsCBrMH4dLNwIDaCGhA6o3pXksdBvYBsktrXDgNJKAFy1Z+ZGIy5NXgXoBT8a3ZgVSPIUAMV6DjLxhsV8wX4n4ibbONObHNyCr8Z4FinNFjg8ziiF5zSV8A99u7Zdf5OisvVaAAAG3VJREFU/kIPAJLWX3hUIFD6o7MD4WkHIMXBk4IftSrPNBJVk0OoC7ice8HGS8XBKDoz/YFBLaQi392lGpCMJfhD9xVkx5Xbj73P9V4m1j0v73x9FjDDPlYvATkgFAVWcdNvJBamliOjAwRV0EpeRymAe717kMYRyy/j5FwFBX0fP7Dyx8gq8wn2ZXi8GfGYR+lFcGJSxa3Y84WgzBHetlU4cvKY44Ps4iP9fsgsPGEhQTAcHqwwGCj61SoPexKwasXFqtxq8qhD9SixoBBYcJEDNzmIoi3J7QkoJActVHocTVpPBCDhElAvMDK1PT/Sq3DwB/ygmyB9GNhYDH4so4Foy48kkPtZfZEv1PQTxYpyX0EI3Bu+/5krcN8fgwVdwWu2JNVNWAk+PcOOPMNdGFyAZ5Aj6gicgzNfwuHZg0HrLxBWfjSRl88fVCo/apX/IBrIvf65ZxtEoK9Bec4KZIPLe76osQns46NwW0pUPCPAyMc4A/KXOwZzFLGbAqD5xhhbgBcWfoJBAlarcCSQgdQJ+Movnih4gjZQTw51rz588y/ZgxVUEAQ8soCfX8OR26JwujCLGFAMsOjnwGrlPuQw9D/PPv8BYVR7pG/eeFtQpsLzR2KFI8SwKj9KlX++HeLOPuSBKrKeHBi7L4b+Kx184+ptAp4Trcscv69oARVYzWgaK01H1X0K3zNSmARKtxXYHvwJuT+8gLGGWgpHcWOmBeljFB2Ckg6wiAYOqfxEK3GMCAj6kIiTWdCBCXhkjUKMgJcLk271N9uLSbtvvK0S69OXAvoA5z94VsFubbmZvx4QAnXgBnJxENyQjy38wef81uPhxMpPJIQzr5ckuUTKe0wZyN57iFTWga8GvCwlh5UqvYgmaNV9XSxEVWs40kkosFwA70RgNOu8mLZfR6wDiwRa35y7j08NksqPQhcfkRBK/J8R75Iz+9C8gJpqzwiIeZII3QnYOkJWbVEI5jNuA+o2BwK82ifwnpSgHwaC+GNAdmW2VXfC+vPu6wR6lBj84C9WfvivZyUhZMJlJhjSukDlFJ3g4AvGJfC1iEpQJ/CaEd7G9wds7p71+odruKrHip/C7RdsxeVjzIxhoNkFGOW/+sk/YVAGtltfzZAIfzix8gcHhZCXpcGN2u69qWqD9OlRFAy7x2fQBhHUiETB+DocqvArYt98f+AEAXApsEmEcNLC0t2uPHCqPQIXwHYDfI4/9+8LMpchqr5HK39MJSrBXwnutNqjovjHFdq+fcHLp7YLR4mGgduW5hFpAXUoL4cTTuW5HJSkB5PC0S7A+8c+837DyoM1J9iv/po/o3BunlDqPjOSO/YbLFd+FGy9sxKFeT8b+nLNPrkAyD53FtT27yUS32yqUaEGTMBiASGcZ0FmK8nWxbvjC1q6WQC4VdWdAcBY8eFoAzIrC0b7Wt8wlPcIdE1FhUWeKU1Igv8Q/0dl4k/NnYSxdlDon8diUDeuQB4c8XVzcahRgyyZmNC+LAgeCfSVALde8/t1DCYawNoePGT83wlOpFUdOZKwxn89OsMEf0X8CxJCBN/dwKbFwkSMgx0ACJJDJD4iC1JEYh6XcEqVHpx4+J4I4UiAl26r5x64sttvSlAn3LBuQCz6edU8C+J5epBrC4YP52EFDgHrCw1B0eU9bOaTgh3wmYvQV3Oqqcf53XnVNXUBELX1xtSgFrirlII5d3HFulxBCNEfZx0h7K2f34XwdHpuYQcguN189Ow/nPXclaUcqMH5leCXjKOjbv3F0a7i2ZaRHmBe5zwnhA9S736ZC8AH8LHkg/T5znYgmES1dtuzGo92qwHIquiWX+4KgVLd8utv9Ml1BQNhEJW/FOgweiTguCUoQHkEwYhjfQIgm8eAzPKzHqAG5xGiiPyxeGRRaYetUpDVpHVC1T9bHGyaknb/TQTnuG7rDYwYCUT7/cMjtILzA+Go/FPw581F/mWeTkDuBsBCAK8ki+A29nMzPn4Rzjv6QV7xWW4fzQFUxb9jQQ1qc28kMi4mDl1NBr4usIsz5ltZqNm7AeJXfuTHd7nioLEyPBISU+8/tP1AC4Il/n+YGmjg2NiBRdl6yCw//zG5ph7bqaBuz8B4VMU/TqSsNPbwCeZA1cdxyG9SgKzRZPL+GXFOiH1/SFZ9wX8M3zUgvH8a4rMBjZj/h1W9MrwTiN6MlsCKiI4gycBzgV/xUaQGjGDHwHiYi0VIzeEAasCpNuL76AC7BIEl7i4AIxnAfoMxk35eJbZ68wWEUChs8IPz/EEE9BkUoNA4RCWSLJkY1h0Y/dG9bVCtUVPe7QRhtStXG4nOECDfUxc4Uw/Ik8JkA9o9+a83IrfHH11EdFUWc4phNgVFWkPsIHBnCvCCYBSgqEN9qtoXuwHhByYoJJA7BxIkkRwpDGgAHo+vQ3ZGOwCFJCJKUAx4MBpFZWvReeLgtBBkDDQu2OJxXa7SE/P4ZiUPHABjY1DsFIhPAaygWewiXK72hHjow/k8gCL6gKES8qcDZ7A+EhYlWCPGCX1wXIwzkQEKt8cP6iqkC0FEhFj/ZYtvXCtwuBLcDT5wXN+9H6ZEIkTwV/x/s78fXFX3siWHEKrC3tw7EFZ31Ll7ttknQyEMGgAqCaVe1bGk8r8nFWCQQR0h7CY0dsU/mIeIuA1AGCo02Q0YVXxub36sG1Qgfo0CBBUXxap+ECFEycQVyViBEBFPt14TK9rZHB9EwMG7DPXOv0OVHkdtx7OSCXfb3av4CFZGTwQBwT7/hKPHE4PzpJ4L4+FM9r1n8B+B+9R9I4Fu9brYUZgCunZWNxdQgIs8mASBQ4F8hJpEiaf4GPihk8FdAxin/kybjZjTj+mAQy6ihZ9whDvHAWB6BKrBXQr+5SBfqPaINwiz12UIwoTmbPACZY/fshBBBKNlW8ZCHwH/cVKSOZMm4Mxk4OwE9JeB+EFkn1IzcPQoiSB4vGgNeJSoik1A7m0TCmE/HrggB+/1M12C1Z18ACGoIeH1pH2IhAqFWgBq+kDFEWAvA3X8tpW0cnSD5WAOriOHhnYraF1eLTkS8P/QsHUBdtMPnOrMaANJE9AZiaKWII5Ue/8PTHn/UcCSTgIF2xN4zdmAQYIAKeBFl6FiO0aKfq5jcImHfPwTxcEdRmD3LcFoAva1Hdjm9UgGggI9YOoPkOBYLsT8HlG3nucMDGkOOJ8CkNOELdSO7D5qqAeJYBb2GpABgRi2gxLITgrOQ9C937HgB+0i7MeRx3gfPWCXLtgbLJAu/gCFBPzRX8eADJqCvA3FViC/BlOQC4LZyrBq8BdQAOUKoKjqR7v7EFfVFMojPgEoSlJesNIePyLHwW9NRgq7E6HvUN8A0yj0wyWDHRZ3J2A1jHdMyu3hCGwSDwdRir7h9VP7AKLgPoMCgKziOFLtrUm8aIFHlgxYfz8WBYUU55iAXauo+evJaIK/NTgRJM9sUcZRzcCnMdNKMJc7usnAyrpxHYkTRHK+n1HxS01LheAHqRWwKIDqLvQC0+PupHZgBawfVGsiniTVHwZHRqbUI/D4Cd+ftgyLAR1ehkIiqaKFw7MJEwUIuK5zsu4svoFYCFKgBJZACBuppOId2RDkPZas8H9kULcA9a0KTCQDGtpnzT+RMJiOGseHl4BQ1C29AWUXIIf/OIwwqoNEK3SCuA7FRiBrE9B4/PcrGJ1OQNj83F4Xbol/TgVHfMiIZLAdcaVkgh8sLrd+liNQH/FqsNTfj15m1J0X+ffZuq/gTY7QnvIfJz6UzBJLs83ItQpt3RfZz5iuGfNPajpngUm0R8DoA5jDlzsOTAwZjzsC3Jjxg7H914PjlcskGdghgx9HG4OOQH34uwQyzz61/0qiYNQjXxECuWYbGM/DrjtPH/Mw/K+gBLLSA+cEfPr4MroArzcDuybbr8Zc72i2UnzeHnTgzD4Ug78SzIvCoARVOQxaFFR3TzWnkkHUVFShEuqKxZnKz4p4YYcf8ZhYhuu8wFgSHcuuwCJagI4bgchJQK/qe9c/RT6nGcg6KGREJpb+MI0EY/b0jcsni3AJBeCQNsBOFVYoApcM2Aom4VFgIRdHpeIG8D3YaxBD+qCiQ+rBOSVnci8hzkAG1t/pgHA4uwDzmu8xFKkkkIqCfkIRs204r/hiDgutoAAcowBMZ9+KS0CcXVBOHCvJw2jMQSJyeoeExF2DuTuRcuWAo9sefyUQ6/oBaIjPtiRH1KvQKvygAHb171d+vc4GRMDPoxN/kL5pwlVh1mBQ1quQJAJ5j0TgOAis+h8d3mnC8xTKE34+8sDNjyVXE6nFMN+H39TQDmocHScENvN74LoGScGU4f7g6IG3n3C3qnG6JBS+Z5tHOOzRYQx+u7MZmAl0OSsRLAS/VIKfRAWU92+12aaVPksGDBWQuCMvgNy2M2Mt8EwqbjosZAec5xLEAmXmcFTHiOWARWglpNpjdEtBQRxJJU5VL5/7F1X86XntXgUK4q+KggsUoIIK8oA+kgy4+zLaACqQGTVOX6MBWdehL6BxHn+tlyBMDGAqufd7WOX5WTJwKYDfXJJP2GXDPk7Tj5Ed7BOG7DMFaBRAJgI/+H2Ngeb2SKb0zkoGlQBHkefDr7xMA5HZeJPtKIzyApI9gmnPgf1c3mulfhe0gFekDCdNFnrOwi4Gs6eTACNjB+Uegcgojog4V25P8bctRYY6RL8AJklE9ACFAGZdBEahd4d4CmghFhbzcwaXYH5qTlS6DY+KfNH5Avzjo2JJ0poDkSCMxLn73H/eB+ifvgvyIFCWAji7BWC8hd0qj0FziMdrS70BlVbgamIgcmotGZDNPwm0L9l5iHv7WRoAFx57ScFS2r2iwot8oKu8l+TOCOg2mZ2nFdjTgOFQENzKkJ8OjEnsE8f6AzyXwT6MNF3RDRnuj0Lwo6wTlBMDIyqaz6G+RiLJMg/KUrQV/rh9uH0tWduwoxmky0kSMQ+rnXxZsGadgnxfgk1pCnsIsGYltvfdzTOBIclIsN8MLAGcz5gBwj94AE8DuC9Molip/JGwB57nRyJiyD3pyk6q5ij+3TzRLohcqyqCEQBTepF15+WVmW8SEr5jMUUkx3oMIsrH3ndwAQganKzyMpOJNxMQooGBYwcByw7axIhgPRGEr6GSGJhkAELoQ1YRg+dPeD5IIRDIqq5PA2Jh0Rq0YcS8XBi0ghGRFpCtWTdum5+yLOsQf2EuYY8AfnbQZDgCjHxBSKwTGpt8QCIDVH3/4H5OwEvldhliINwAFLsEyyIfGKV+vm3eEehVqKTdNxtDiPoLHCRiuwTJxCECxMDqDjTvZ63KaPKvRgV2i/F3ohm88V8LN8hgJcXD5pVGIPPNn9EBqSQC0I4AMxBUcQNCkarkFgSn/oCs9GCVep4eUG5BRAOcQOCWlGSc3If0IFqRfURQGRrKewPKEJ9sLnIowKCcw+f48N6UHjqYtgInaCCkBbPSj8VEkCr2g8U43wY1xX/BNkwreQrzg+oaJghOCGTU8RBxuIp6VFOGoEXgEsBLIgV6gBgxoLSI5CgiYNT+GBHsU01GthrceiMUtv9KgAYktgVNeGrBbtiOQVi9x8WjiAW7UNUnm4Vet7WtsFgDCDYEwQ/EVL1PnQf/xCDLTowTh4c4HPRDoQaiwhKIAae4B7xgCBydI/CDPOrevK0FR4p6w3VfoXgQiB3T1N8Y1PCD0X19JqcHGfzB5WkQE4p/kdeXBcEVUXEIFqSij82lMyrWq/7c+LFHA7z5/dwOHHg8s/Y8C2CmhbmALtare+4UWLfb25BmXABKABTniC8gRAP2yvDAiUAsElnrxFzITQa/sAFecAOY7zPV/8jMQHSbWAiUPGkQNABhw85xrSCv+mMSzFR8+7mjw01A8f4F8S/td4jnDHYxpT8/OEyV3gz2+GTfdAeAszswfJNGlQhEIjB0Bls0BKn4Iw7WKu9f1gmSagmvqleEwJwnZwjO7npz1HdCJ1hS/mlBcRXyF3i/M7NxqJFoeH27z7nnJaBmpUZKHsTbGUc1ALEoIGsGYl9ixS50gjAT/VhB8IzvGTrBVfWEz1MzAkRFTtecW731VdjNQPukVdhdn0Y8d/a7WYH6i/TBPBzUFwAlHwtGHOQISrgb1AMUgDETTA3+THAdeRJhg59V/Ektofa9I8wxVICkC7QQSAd2O3cftzPzdMK6aA4iZI4ILfYRbb9RgqICt2AxVnYZ4kkBvHOBxT/zN9ybHx/f5Ql2fkGCX6ANm6F8WCfqAS+Eq5AGcHJd2IFHagTMHAAj+mWBnDXuc81CjhsAi5dL2K8QCYI1aJ/PJtSSxEFXASv7C2I3ZB9/a0j/7nDn/j1pHsz9Jr8fNpxPBUAUUYD4wz5GBlmyAiORjtAIGDFwzSUwqiNZ1d1tPiB7/Q9VeI9KeJU16/knkEeQJEALjY4rkp74fCZiMDSA/PgvT/aT2gYgp5E/P29AKBQAo6TRth5T4VesQFb0i4K7RA2MZpgyFXCEQHCOixuYMPgy2L7+45ezSSKt2oUkURlpXkEMOLSiXPuDQZjk63N5bmzOSxQdLHX7AhwUEA0BAeQPJIQzkAuFlOK/GtyLdiGDKEBdllQ7YouxV2Xdwza9So4Kp5Z0yAgUhTlJgFzSFrznIHYIwKcCu2/L3LsCg6UI1b1/CA+ApIV5/32HqOIjdQusE4azip5Wc1b0q/QGIAlaWEJbXP3r/L+AEipw/+BtkQVY9fIM2i/ZhgVEgJO6DZ1ksVtlYdoQAPhVO0oKmYBmnAYco4DRCRB3TwCziptaE0auER9/VzRqKNOEYINOQg2m1l9GpGNQAhh1v6UmxNQh2M4+LmlUzll0OTjYQOaGlZAEMCrdhmBphaMBwBADrSQQc3//He8KgFETT7p6BHnjj2X9EXsDjrgBS6ihoAmcSQVYmE4JgYWFpp1waAQRoqDzxDhU+HxSnZHz/9JEY6Y5MJA+cwoWrt99+U3Mc/9g/NQTFaigAEtwB1yBzwzucZSX7RZEILhR1d5GDCsBLVUdIQvsldZfEJt5i/MHx2hGJZFkVVyK242iFeh58oBUFqIQbkfp2DV2X0CkAYgv1sU+P+I/HmBu8nErugdRnUWhfp+A/ddlbEH3uQlBsNobUEMHasK1HOYn8BEEvCUaiuigXRIKj+sGOPA4KAWz9/s7WxcgB4+a6/fI2osEwv4yOENAiPf+wQhbc/5f0gGisWuQaRFmGoIqguARWsBQgTTocDLMT5OJUQnhqdCEig+/EShKSEgTVV0MBMnz04BcshPnLk/+OaV0/dwKzB4QUt1NB6uTDfGOP+cNm9mEsBAFiM7AQh9AKVEU75vy68jeOxrUC4mDEuYO0oLqoSdHaEF2eXYYSm0V+oEOwpLmYFOF3Z4CmAeBTIGueiIw2xoKPzDBJVBXQ5g5O8/twwA+QguIjJt3+g0NQEcDfUXgO5gsqlTBLkQLdl86K3CWneitQ8sg/5oWAUJP2C3V3RoEyji5n4b9lB4t9pz2CA+cAFn1Z9I/uzYsU/ELtEBOCHYQQqGcFejV+yeuRJX31zsKV5IGjway9z6PLDxKwNEPsBuOEiqw57jGgOtZ1Y++T50AuMFl7hPIbhskiOwsATtRoc7rS7dXrpcgrMCGJca6ELJo+Y0be0BW5ZKGcFz4y8W9BduwcDnK9iO5fagsKpp9ANnvDPxeP8THNyIVFo1AMas8Qk5v2Ytm0LCCYAXqn+wQsPTBh/5Bcnne14Os3uCQt28vsK1WUESJFviBgAW//3u9PLxusXchcCR2WsNzv/ImvgZzzkUByDUAIrjTvmSHAowpJBQE4SUlxMxnARlQbIqkArVAJ6pBBvELCCKlkyCDAP45BYfEPfcUpfMch3Vn4bheYK4E66BxAxHSVd5INgEPgU/NBCDfNQ8Ho1CoINAPQAW/QT8OCIZlNFCB84XhoDChFByHGjx35v9BLgyhmojqHYb5QYXnuAecvua0hZe6BV9f7v4ibvgvamrmAc1TmaEir0LQ9h97eYAYVoM/nWA60i8Q3Ifezha9BqaaL3zvqd6IAuwwLSCCuCLuJWch4h30giPtyiAphKEBcCu9BV5wwzkMxID8rhMwdwMhcSFgrBT3RUTQboAUg3+p+Qe1IGarOioVnazmefV3lHpwA0AcLWCahUiXwePHWJsP+GH1gnp/we5KfOhJAbsj0H/BIEb04TbrTPsAyb2LLu93KwfCvn5PLAwrOXAa72eEQRo1CNdw5IprsAZ3hApy9zlcITG2vpCihsRSYxNS+J4vdBZ6B52eqRcQ/QXmSjAWSfa/5GA5qEg4iJFtm624AqXLrSA2gx8p1Mdqcghv41S0lSp/xAYs9gakQc4Ie2RTUYwYgt748mV+FU1Xgp14eW3XYZ6cdqGTNHwHICTwEeTPl0jEZwIgP9gDEaogeg5IHWCF+1eoAhvEKPB/EAeTRsM/pSAP5wjWEUMM1/NJRhwJbpJSgK7S7zF3EOsI5jBQBK9DV80Z8Y0COzvmWzJXgDl40KEC6cqvqgi4OB5cpgLFYK/1CvDiItXqC6/S87wfAUfPtxqfGNzlYaOjlf1IsHPPvffHgDAoEeEST4ZLZUd/RSo91/BjXY5ggWgQ4In3fyj4mUqPrInHOCLKO3wUwRsfyXpt1nEIRLrqcWeTuk7bigsbid1zD4iDRQtnIdQsyIXnFCn1I9D7ADgxEhOvR5AJosoUbu1FkJyYCi9OhQERoIx+4AX/YqUXQhtYEwKN4Cy1HntLMmtaAQpqfrT/UCoLSxeswjA5UWPPi0mjajUWxMTdVusNvt/ChMdmILK5IRMFu90BMEzFYHdg2GAgeYVHMMJIBTA7EFTx/5fpgTFXz9w/en0ZjD8kCDoKPNGwlB01BmoWQbh+AxR689mBponGJOr9OwmMu3dtJ/ylW1Tik4ElUPmR9RqII+pVhD9ychABMQ51gOIZg+/G+5mGIzLB1JJC5WhzYjhJ7IWmLDpA8jzsAafUPkB2WnFBF4iSxkq1ty7f25rv/+EQLOxs2oUdTSA9HIR9swdBlCcFe9owPC3XWDDC0ISVzsEVbSCF/sWdA5Fu4HJqankp2SeQCYYrImNalfmhpVxYrGkUS4LeSUjg8dD7+D7w/ybIfy7vlB9/HJ978zr7/45Qgajzj+4EjIK/ULHPRAOlKr/aG0AFcqCyu0GcW45Igh6JMJmhA49/U+cEssHNJhtXDC1MOya3j/sAiAGcrEtqtgjBD6wEzSDc7D8o6C8rIqAZyPk+NQoNLAZ1hR64Yl1FBY648smUYKnSg1Xwk/0DyRyArByMUobyByhCcPnOaPyoegREFS4jNfYAw+IHCjdC1J2WDZBke/OyN85J24WiXwDYPoJyYuCD238ulvuzwt6KgHf0shWKsqCFFGjB/w8HU8eeTED9wAAAAABJRU5ErkJggg==","EnvironmentBRDFTexture"+o++,e,!0,!1,n.x.BILINEAR_SAMPLINGMODE);e._blockEntityCollection=i;const l=e.getEngine().getLoadedTexturesCache(),h=l.indexOf(a.getInternalTexture());-1!==h&&l.splice(h,1),a.isRGBD=!0,a.wrapU=n.x.CLAMP_ADDRESSMODE,a.wrapV=n.x.CLAMP_ADDRESSMODE,e.environmentBRDFTexture=a,e.useDelayedTextureLoading=t,s.r.ExpandRGBDTexture(a);const c=e.getEngine().onContextRestoredObservable.add((()=>{a.isRGBD=!0;const e=()=>{a.isReady()?s.r.ExpandRGBDTexture(a):r.w1.SetImmediate(e)};e()}));e.onDisposeObservable.add((()=>{e.getEngine().onContextRestoredObservable.remove(c)}))}return e.environmentBRDFTexture},l={GetEnvironmentBRDFTexture:a}},8985:(e,t,i)=>{function n(e,t,i,n){let s=n,r=0,o="";for(;s<i.length;){const n=i.charAt(s);if(o)n===o?'"'===o||"'"===o?"\\"!==i.charAt(s-1)&&(o=""):o="":"*/"===o&&"*"===n&&s+1<i.length&&("/"===i.charAt(s+1)&&(o=""),""===o&&s++);else switch(n){case e:r++;break;case t:r--;break;case'"':case"'":case"`":o=n;break;case"/":if(s+1<i.length){const e=i.charAt(s+1);"/"===e?o="\n":"*"===e&&(o="*/")}}if(s++,0===r)break}return 0===r?s-1:-1}function s(e,t){for(;t<e.length;){const i=e[t];if(" "!==i&&"\n"!==i&&"\r"!==i&&"\t"!==i&&"\n"!==i&&" "!==i)break;t++}return t}function r(e){const t=e.charCodeAt(0);return t>=48&&t<=57||t>=65&&t<=90||t>=97&&t<=122||95==t}function o(e){let t=0,i="",n=!1;const s=[];for(;t<e.length;){const r=e.charAt(t);if(i)r===i?'"'===i||"'"===i?("\\"!==e.charAt(t-1)&&(i=""),s.push(r)):(i="",n=!1):"*/"===i&&"*"===r&&t+1<e.length?("/"===e.charAt(t+1)&&(i=""),""===i&&(n=!1,t++)):n||s.push(r);else{switch(r){case'"':case"'":case"`":i=r;break;case"/":if(t+1<e.length){const s=e.charAt(t+1);"/"===s?(i="\n",n=!0):"*"===s&&(i="*/",n=!0)}}n||s.push(r)}t++}return s.join("")}function a(e,t,i){for(;t>=0&&e.charAt(t)!==i;)t--;return t}function l(e){return e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}i.d(t,{AW:()=>l,Kt:()=>o,Pm:()=>s,uA:()=>r,vt:()=>n,wm:()=>a})},9703:(e,t,i)=>{function n(e,t,i=!1){const n=t.width,s=t.height;if(e instanceof Float32Array){let t=e.byteLength/e.BYTES_PER_ELEMENT;const i=new Uint8Array(t);for(;--t>=0;){let n=e[t];n<0?n=0:n>1&&(n=1),i[t]=255*n}e=i}const r=document.createElement("canvas");r.width=n,r.height=s;const o=r.getContext("2d");if(!o)return null;const a=o.createImageData(n,s);if(a.data.set(e),o.putImageData(a,0,0),i){const e=document.createElement("canvas");e.width=n,e.height=s;const t=e.getContext("2d");return t?(t.translate(0,s),t.scale(1,-1),t.drawImage(r,0,0),e.toDataURL("image/png")):null}return r.toDataURL("image/png")}function s(e,t=0,i=0){const s=e.getInternalTexture();if(!s)return null;const r=e._readPixelsSync(t,i);return r?n(r,e.getSize(),s.invertY):null}async function r(e,t=0,i=0){const s=e.getInternalTexture();if(!s)return null;const r=await e.readPixels(t,i);return r?n(r,e.getSize(),s.invertY):null}i.d(t,{Jj:()=>r,_u:()=>s,r1:()=>o,xj:()=>n});const o={GenerateBase64StringFromPixelData:n,GenerateBase64StringFromTexture:s,GenerateBase64StringFromTextureAsync:r}},2697:(e,t,i)=>{function n(e,t,i){try{const n=e.next();n.done?t(n):n.value?n.value.then((()=>{n.value=void 0,t(n)}),i):t(n)}catch(e){i(e)}}function s(e=25){let t;return(i,s,r)=>{const o=performance.now();void 0===t||o-t>e?(t=o,setTimeout((()=>{n(i,s,r)}),0)):n(i,s,r)}}function r(e,t,i,n,s){const r=()=>{let o;const a=e=>{e.done?i(e.value):void 0===o?o=!0:r()};do{o=void 0,s&&s.aborted?n(new Error("Aborted")):t(e,a,n),void 0===o&&(o=!1)}while(o)};r()}function o(e,t){let i;return r(e,n,(e=>i=e),(e=>{throw e}),t),i}function a(e,t,i){return new Promise(((n,s)=>{r(e,t,n,s,i)}))}function l(e,t){return(...i)=>o(e(...i),t)}function h(e,t,i){return(...n)=>a(e(...n),t,i)}i.d(t,{KO:()=>s,U3:()=>h,WP:()=>n,d_:()=>r,s3:()=>o,sM:()=>a,vp:()=>l})},1918:(e,t,i)=>{i.d(t,{d:()=>s});var n=i(2655);class s{constructor(e){this.byteOffset=0,this.buffer=e}loadAsync(e){return this.buffer.readAsync(this.byteOffset,e).then((e=>{this._dataView=new DataView(e.buffer,e.byteOffset,e.byteLength),this._dataByteOffset=0}))}readUint32(){const e=this._dataView.getUint32(this._dataByteOffset,!0);return this._dataByteOffset+=4,this.byteOffset+=4,e}readUint8Array(e){const t=new Uint8Array(this._dataView.buffer,this._dataView.byteOffset+this._dataByteOffset,e);return this._dataByteOffset+=e,this.byteOffset+=e,t}readString(e){return(0,n.fJ)(this.readUint8Array(e))}skipBytes(e){this._dataByteOffset+=e,this.byteOffset+=e}}},3956:(e,t,i)=>{i.d(t,{G6:()=>P,N$:()=>x,QC:()=>g,RR:()=>y,VE:()=>C,XX:()=>b,hd:()=>v,mv:()=>S,n9:()=>_,oQ:()=>E,oU:()=>f,p4:()=>A,qC:()=>p,qQ:()=>m,rX:()=>T,wz:()=>d});var n=i(4875),s=i(4141),r=i(4934),o=i(4649);const a={},l={},h=function(e,t,i,s={}){const r=e();n.$&&n.$.HasTags(t)&&n.$.AddTagsTo(r,n.$.GetTags(t,!0));const o=c(r),a={};for(const e in o){const n=o[e],l=t[e],h=n.type;if(null!=l&&("uniqueId"!==e||A.AllowLoadingUniqueId))switch(h){case 0:case 6:case 11:r[e]=l;break;case 1:s.cloneTexturesOnlyOnce&&a[l.uniqueId]?r[e]=a[l.uniqueId]:(r[e]=i||l.isRenderTarget?l:l.clone(),a[l.uniqueId]=r[e]);break;case 2:case 3:case 4:case 5:case 7:case 10:case 12:r[e]=i?l:l.clone()}}return r};function c(e){const t=e.getClassName();if(l[t])return l[t];l[t]={};const i=l[t];let n=e,s=t;for(;s;){const e=a[s];for(const t in e)i[t]=e[t];let t,r=!1;do{if(t=Object.getPrototypeOf(n),!t.getClassName){r=!0;break}if(t.getClassName()!==s)break;n=t}while(t);if(r)break;s=t.getClassName(),n=t}return i}function u(e,t){return(i,n)=>{const s=function(e){const t=e.getClassName();return a[t]||(a[t]={}),a[t]}(i);s[n]||(s[n]={type:e,sourceName:t})}}function d(e,t=null){return function(e,t=null){return(i,n)=>{const s=t||"_"+n;Object.defineProperty(i,n,{get:function(){return this[s]},set:function(t){"function"==typeof this.equals&&this.equals(t)||this[s]!==t&&(this[s]=t,i[e].apply(this))},enumerable:!0,configurable:!0})}}(e,t)}function p(e){return u(0,e)}function f(e){return u(1,e)}function _(e){return u(2,e)}function m(e){return u(3,e)}function g(e){return u(4,e)}function v(e){return u(5,e)}function y(e){return u(6,e)}function x(e){return u(7,e)}function b(e){return u(8,e)}function T(e){return u(9,e)}function S(e){return u(10,e)}function E(e){return u(12,e)}function C(e){return u(11,e)}class A{static AppendSerializedAnimations(e,t){if(e.animations){t.animations=[];for(let i=0;i<e.animations.length;i++){const n=e.animations[i];t.animations.push(n.serialize())}}}static Serialize(e,t){t||(t={}),n.$&&(t.tags=n.$.GetTags(e));const i=c(e);for(const n in i){const s=i[n],r=s.sourceName||n,o=s.type,a=e[n];if(null!=a&&("uniqueId"!==n||A.AllowLoadingUniqueId))switch(o){case 0:t[r]=a;break;case 1:case 3:case 7:case 9:t[r]=a.serialize();break;case 2:case 4:case 5:case 8:case 10:case 12:t[r]=a.asArray();break;case 6:case 11:t[r]=a.id}}return t}static ParseProperties(e,t,i,n){n||(n="");const r=c(t);for(const a in r){const l=r[a],h=e[l.sourceName||a],c=l.type;if(null!=h&&("uniqueId"!==a||A.AllowLoadingUniqueId)){const e=t;switch(c){case 0:e[a]=h;break;case 1:i&&(e[a]=A._TextureParser(h,i,n));break;case 2:e[a]=o.Wo.FromArray(h);break;case 3:e[a]=A._FresnelParametersParser(h);break;case 4:e[a]=s.FM.FromArray(h);break;case 5:e[a]=s.P.FromArray(h);break;case 6:i&&(e[a]=i.getLastMeshById(h));break;case 7:e[a]=A._ColorCurvesParser(h);break;case 8:e[a]=o.HE.FromArray(h);break;case 9:e[a]=A._ImageProcessingConfigurationParser(h);break;case 10:e[a]=s._f.FromArray(h);break;case 11:i&&(e[a]=i.getCameraById(h));break;case 12:e[a]=s.y3.FromArray(h)}}}}static Parse(e,t,i,s=null){const r=e();return n.$&&n.$.AddTagsTo(r,t.tags),A.ParseProperties(t,r,i,s),r}static Clone(e,t,i={}){return h(e,t,!1,i)}static Instanciate(e,t){return h(e,t,!0)}}function P(e,t,i,n){const s=i.value;i.value=(...i)=>{let r=s;if("undefined"!=typeof _native&&_native[t]){const e=_native[t];r=n?(...t)=>n(...t)?e(...t):s(...t):e}return e[t]=r,r(...i)}}A.AllowLoadingUniqueId=!1,A._ImageProcessingConfigurationParser=e=>{throw(0,r.S)("ImageProcessingConfiguration")},A._FresnelParametersParser=e=>{throw(0,r.S)("FresnelParameters")},A._ColorCurvesParser=e=>{throw(0,r.S)("ColorCurves")},A._TextureParser=(e,t,i)=>{throw(0,r.S)("Texture")},P.filter=function(e){return(t,i,n)=>P(t,i,n,e)}},6387:(e,t,i)=>{i.d(t,{j:()=>r});var n=i(2722);const s=(e,t)=>e?e.getClassName&&"Mesh"===e.getClassName()?null:e.getClassName&&"SubMesh"===e.getClassName()?e.clone(t):e.clone?e.clone():null:null;class r{static DeepCopy(e,t,i,r){const o=function(e){const t=[];do{Object.getOwnPropertyNames(e).forEach((function(e){-1===t.indexOf(e)&&t.push(e)}))}while(e=Object.getPrototypeOf(e));return t}(e);for(const a of o){if("_"===a[0]&&(!r||-1===r.indexOf(a)))continue;if(a.endsWith("Observable"))continue;if(i&&-1!==i.indexOf(a))continue;const o=e[a],l=typeof o;if("function"!==l)try{if("object"===l)if(o instanceof Array){if(t[a]=[],o.length>0)if("object"==typeof o[0])for(let e=0;e<o.length;e++){const i=s(o[e],t);-1===t[a].indexOf(i)&&t[a].push(i)}else t[a]=o.slice(0)}else t[a]=s(o,t);else t[a]=o}catch(e){n.Y.Warn(e.message)}}}}},7188:(e,t,i)=>{i.d(t,{B:()=>n});class n{get resolve(){return this._resolve}get reject(){return this._reject}constructor(){this.promise=new Promise(((e,t)=>{this._resolve=e,this._reject=t}))}}},4934:(e,t,i)=>{function n(e){return`${e} needs to be imported before as it contains a side-effect required by your code.`}i.d(t,{S:()=>n})},6797:(e,t,i)=>{function n(){return"undefined"!=typeof window}function s(){return"undefined"!=typeof navigator}function r(){return"undefined"!=typeof document}function o(e){let t="",i=e.firstChild;for(;i;)3===i.nodeType&&(t+=i.textContent),i=i.nextSibling;return t}i.d(t,{CG:()=>n,MZ:()=>a,n5:()=>r,up:()=>s,v:()=>o});const a={IsWindowObjectExist:n,IsNavigatorAvailable:s,IsDocumentAvailable:r,GetDOMTextContent:o}},2286:(e,t,i)=>{i.d(t,{B:()=>a});var n=i(3230),s=i(7218),r=i(7257),o=i(7182);class a{static _CreateDumpRenderer(){if(!a._DumpToolsEngine){const e=new OffscreenCanvas(100,100),t=new n.B(e,!1,{preserveDrawingBuffer:!0,depth:!1,stencil:!1,alpha:!0,premultipliedAlpha:!1,antialias:!1,failIfMajorPerformanceCaveat:!1});t.getCaps().parallelShaderCompile=void 0;const i=new s.I(t),r=new s.H({engine:t,name:o.T.name,fragmentShader:o.T.shader,samplerNames:["textureSampler"]});a._DumpToolsEngine={canvas:e,engine:t,renderer:i,wrapper:r}}return a._DumpToolsEngine}static async DumpFramebuffer(e,t,i,n,s="image/png",r){const o=await i.readPixels(0,0,e,t),l=new Uint8Array(o.buffer);a.DumpData(e,t,l,n,s,r,!0)}static DumpDataAsync(e,t,i,n="image/png",s,r=!1,o=!1,l){return new Promise((h=>{a.DumpData(e,t,i,(e=>h(e)),n,s,r,o,l)}))}static DumpData(e,t,i,n,s="image/png",o,l=!1,h=!1,c){const u=a._CreateDumpRenderer();if(u.engine.setSize(e,t,!0),i instanceof Float32Array){const e=new Uint8Array(i.length);let t=i.length;for(;t--;){const n=i[t];e[t]=n<0?0:n>1?1:Math.round(255*n)}i=e}const d=u.engine.createRawTexture(i,e,t,5,!1,!l,1);u.renderer.setViewport(),u.renderer.applyEffectWrapper(u.wrapper),u.wrapper.effect._bindTexture("textureSampler",d),u.renderer.draw(),h?r.w1.ToBlob(u.canvas,(e=>{const t=new FileReader;t.onload=e=>{const t=e.target.result;n&&n(t)},t.readAsArrayBuffer(e)}),s,c):r.w1.EncodeScreenshotCanvasData(u.canvas,n,s,o,c),d.dispose()}static Dispose(){a._DumpToolsEngine&&(a._DumpToolsEngine.wrapper.dispose(),a._DumpToolsEngine.renderer.dispose(),a._DumpToolsEngine.engine.dispose()),a._DumpToolsEngine=null}}r.w1.DumpData=a.DumpData,r.w1.DumpDataAsync=a.DumpDataAsync,r.w1.DumpFramebuffer=a.DumpFramebuffer},4277:(e,t,i)=>{i.d(t,{p6:()=>x,Do:()=>T,qh:()=>R,qJ:()=>v,Ro:()=>S,qC:()=>A,qZ:()=>C,Lf:()=>P,QH:()=>y});var n=i(7257),s=i(4141),r=i(1128),o=i(6113),a=i(6202),l=i(6702),h=i(1057),c=i(392),u=i(2722),d=i(8121),p=(i(6697),i(9075),i(452),i(8104));i(1423);p.v.ShadersStore.rgbdEncodePixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\n#include<helperFunctions>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) \n{\ngl_FragColor=toRGBD(texture2D(textureSampler,vUV).rgb);\n}",i(7161);var f=i(2286);const _="image/png",m=2,g=[134,22,135,150,246,214,150,54];function v(e){const t=new DataView(e.buffer,e.byteOffset,e.byteLength);let i=0;for(let e=0;e<g.length;e++)if(t.getUint8(i++)!==g[e])return u.Y.Error("Not a babylon environment map"),null;let n="",s=0;for(;s=t.getUint8(i++);)n+=String.fromCharCode(s);let r=JSON.parse(n);return r=y(r),r.specular&&(r.specular.specularDataPosition=i,r.specular.lodGenerationScale=r.specular.lodGenerationScale||.8),r}function y(e){if(e.version>m)throw new Error(`Unsupported babylon environment map version "${e.version}". Latest supported version is "${m}".`);return 2===e.version?e:e={...e,version:2,imageType:_}}async function x(e,t={}){var i;const n=e.getInternalTexture();if(!n)return Promise.reject("The cube texture is invalid.");const s=null!==(i=t.imageType)&&void 0!==i?i:_,o=n.getEngine();if(2!==e.textureType&&1!==e.textureType&&0!==e.textureType&&0!==e.textureType&&7!==e.textureType&&-1!==e.textureType)return Promise.reject("The cube texture should allow HDR (Full Float or Half Float).");let a=1;if(!o.getCaps().textureFloatRender&&(a=2,!o.getCaps().textureHalfFloatRender))return Promise.reject("Env texture can only be created when the browser supports half float or full float rendering.");const l=n.width,c=new h.x(o),u={};o.flushFramebuffer();const p=r.R.ILog2(n.width);for(let i=0;i<=p;i++){const n=Math.pow(2,p-i);for(let r=0;r<6;r++){let l=await e.readPixels(r,i,void 0,!1);if(l&&l.byteLength===l.length){const e=new Float32Array(4*l.byteLength);for(let t=0;t<l.byteLength;t++)e[t]=l[t]/255,e[t]=Math.pow(e[t],2.2);l=e}else if(l&&e.gammaSpace){const e=l;for(let t=0;t<e.length;t++)e[t]=Math.pow(e[t],2.2)}const h=o.createRawTexture(l,n,n,5,!1,!0,1,null,a);await d.r.EncodeTextureToRGBD(h,c,a);const p=await o._readTexturePixels(h,n,n),_=await f.B.DumpDataAsync(n,n,p,s,void 0,!1,!0,t.imageQuality);u[6*i+r]=_,h.dispose()}}c.dispose();const v={version:m,width:l,imageType:s,irradiance:b(e),specular:{mipmaps:[],lodGenerationScale:e.lodGenerationScale}};let y=0;for(let e=0;e<=p;e++)for(let t=0;t<6;t++){const i=u[6*e+t].byteLength;v.specular.mipmaps.push({length:i,position:y}),y+=i}const x=JSON.stringify(v),T=new ArrayBuffer(x.length+1),S=new Uint8Array(T);for(let e=0,t=x.length;e<t;e++)S[e]=x.charCodeAt(e);S[x.length]=0;const E=g.length+y+T.byteLength,C=new ArrayBuffer(E),A=new Uint8Array(C),P=new DataView(C);let R=0;for(let e=0;e<g.length;e++)P.setUint8(R++,g[e]);A.set(new Uint8Array(T),R),R+=T.byteLength;for(let e=0;e<=p;e++)for(let t=0;t<6;t++){const i=u[6*e+t];A.set(new Uint8Array(i),R),R+=i.byteLength}return C}function b(e){const t=e.sphericalPolynomial;return null==t?null:{x:[t.x.x,t.x.y,t.x.z],y:[t.y.x,t.y.y,t.y.z],z:[t.z.x,t.z.y,t.z.z],xx:[t.xx.x,t.xx.y,t.xx.z],yy:[t.yy.x,t.yy.y,t.yy.z],zz:[t.zz.x,t.zz.y,t.zz.z],yz:[t.yz.x,t.yz.y,t.yz.z],zx:[t.zx.x,t.zx.y,t.zx.z],xy:[t.xy.x,t.xy.y,t.xy.z]}}function T(e,t){const i=(t=y(t)).specular;let n=r.R.Log2(t.width);if(n=Math.round(n)+1,i.mipmaps.length!==6*n)throw new Error(`Unsupported specular mipmaps number "${i.mipmaps.length}"`);const s=new Array(n);for(let t=0;t<n;t++){s[t]=new Array(6);for(let n=0;n<6;n++){const r=i.mipmaps[6*t+n];s[t][n]=new Uint8Array(e.buffer,e.byteOffset+i.specularDataPosition+r.position,r.length)}}return s}function S(e,t,i){const n=(i=y(i)).specular;return n?(e._lodGenerationScale=n.lodGenerationScale,C(e,T(t,i),i.imageType)):Promise.resolve()}function E(e,t,i,n,s,r,o,a,l,h,c){return new Promise(((u,d)=>{if(i){const i=t.createTexture(null,!0,!0,null,1,null,(e=>{d(e)}),e);n.getEffect().executeWhenCompiled((()=>{n.externalTextureSamplerBinding=!0,n.onApply=n=>{n._bindTexture("textureSampler",i),n.setFloat2("scale",1,t._features.needsInvertingBitmap&&e instanceof ImageBitmap?-1:1)},t.scenes.length&&(t.scenes[0].postProcessManager.directRender([n],h,!0,r,o),t.restoreDefaultFramebuffer(),i.dispose(),URL.revokeObjectURL(s),u())}))}else{if(t._uploadImageToTexture(c,e,r,o),a){const i=l[o];i&&t._uploadImageToTexture(i._texture,e,r,0)}u()}}))}function C(e,t,i=_){if(!n.w1.IsExponentOfTwo(e.width))throw new Error("Texture size must be a power of two");const s=r.R.ILog2(e.width)+1,o=e.getEngine();let h=!1,u=!1,d=null,p=null,f=null;const m=o.getCaps();if(e.format=5,e.type=0,e.generateMipMaps=!0,e._cachedAnisotropicFilteringLevel=null,o.updateTextureSamplingMode(3,e),m.textureLOD?o._features.supportRenderAndCopyToLodForFloatTextures?m.textureHalfFloatRender&&m.textureHalfFloatLinearFiltering?(h=!0,e.type=2):m.textureFloatRender&&m.textureFloatLinearFiltering&&(h=!0,e.type=1):h=!1:(h=!1,u=!0,f={}),h)d=new c.D("rgbdDecode","rgbdDecode",null,null,1,null,3,o,!1,void 0,e.type,void 0,null,!1),e._isRGBD=!1,e.invertY=!1,p=o.createRenderTargetCubeTexture(e.width,{generateDepthBuffer:!1,generateMipMaps:!0,generateStencilBuffer:!1,samplingMode:3,type:e.type,format:5});else if(e._isRGBD=!0,e.invertY=!0,u){const t=3,i=e._lodGenerationScale,n=e._lodGenerationOffset;for(let r=0;r<t;r++){const h=(s-1)*i+n,c=n+(h-n)*(1-r/(t-1)),u=Math.round(Math.min(Math.max(c,0),h)),d=new a.l(o,a.S.Temp);d.isCube=!0,d.invertY=!0,d.generateMipMaps=!1,o.updateTextureSamplingMode(2,d);const p=new l.V(null);switch(p._isCube=!0,p._texture=d,f[u]=p,r){case 0:e._lodTextureLow=p;break;case 1:e._lodTextureMid=p;break;case 2:e._lodTextureHigh=p}}}const g=[];for(let n=0;n<t.length;n++)for(let s=0;s<6;s++){const r=t[n][s],a=new Blob([r],{type:i}),l=URL.createObjectURL(a);let c;if("undefined"==typeof Image||o._features.forceBitmapOverHTMLImageElement)c=o.createImageBitmap(a,{premultiplyAlpha:"none"}).then((t=>E(t,o,h,d,l,s,n,u,f,p,e)));else{const t=new Image;t.src=l,c=new Promise(((i,r)=>{t.onload=()=>{E(t,o,h,d,l,s,n,u,f,p,e).then((()=>i())).catch((e=>{r(e)}))},t.onerror=e=>{r(e)}}))}g.push(c)}if(t.length<s){let i;const n=Math.pow(2,s-1-t.length),r=n*n*4;switch(e.type){case 0:i=new Uint8Array(r);break;case 2:i=new Uint16Array(r);break;case 1:i=new Float32Array(r)}for(let n=t.length;n<s;n++)for(let t=0;t<6;t++)o._uploadArrayBufferViewToTexture(e,i,t,n)}return Promise.all(g).then((()=>{p&&(o._releaseTexture(e),p._swapAndDie(e)),d&&d.dispose(),u&&(e._lodTextureHigh&&e._lodTextureHigh._texture&&(e._lodTextureHigh._texture.isReady=!0),e._lodTextureMid&&e._lodTextureMid._texture&&(e._lodTextureMid._texture.isReady=!0),e._lodTextureLow&&e._lodTextureLow._texture&&(e._lodTextureLow._texture.isReady=!0))}))}function A(e,t){const i=(t=y(t)).irradiance;if(!i)return;const n=new o.i;s.P.FromArrayToRef(i.x,0,n.x),s.P.FromArrayToRef(i.y,0,n.y),s.P.FromArrayToRef(i.z,0,n.z),s.P.FromArrayToRef(i.xx,0,n.xx),s.P.FromArrayToRef(i.yy,0,n.yy),s.P.FromArrayToRef(i.zz,0,n.zz),s.P.FromArrayToRef(i.yz,0,n.yz),s.P.FromArrayToRef(i.zx,0,n.zx),s.P.FromArrayToRef(i.xy,0,n.xy),e._sphericalPolynomial=n}function P(e,t,i,n,s){const r=C(e.getEngine().createRawCubeTexture(null,e.width,e.format,e.type,e.generateMipMaps,e.invertY,e.samplingMode,e._compression),t).then((()=>e));return e.onRebuildCallback=e=>({proxy:r,isReady:!0,isAsync:!0}),e._source=a.S.CubeRawRGBD,e._bufferViewArrayArray=t,e._lodGenerationScale=n,e._lodGenerationOffset=s,e._sphericalPolynomial=i,C(e,t).then((()=>(e.isReady=!0,e)))}const R={GetEnvInfo:v,CreateEnvTextureAsync:x,CreateImageDataArrayBufferViews:T,UploadEnvLevelsAsync:S,UploadLevelsAsync:C,UploadEnvSpherical:A}},1722:(e,t,i)=>{i.d(t,{GU:()=>n,LH:()=>r,SM:()=>s});class n extends Error{}n._setPrototypeOf=Object.setPrototypeOf||((e,t)=>(e.__proto__=t,e));const s={MeshInvalidPositionsError:0,UnsupportedTextureError:1e3,GLTFLoaderUnexpectedMagicError:2e3,SceneLoaderError:3e3,LoadFileError:4e3,RequestFileError:4001,ReadFileError:4002};class r extends n{constructor(e,t,i){super(e),this.errorCode=t,this.innerError=i,this.name="RuntimeError",n._setPrototypeOf(this,r.prototype)}}},5661:(e,t,i)=>{i.d(t,{$K:()=>M,$M:()=>b,A2:()=>I,FV:()=>C,Ip:()=>S,RC:()=>v,Uh:()=>A,VL:()=>P,W5:()=>O,e0:()=>D,eh:()=>m,kK:()=>g,qC:()=>R,r6:()=>T,rN:()=>y,vP:()=>E});var n=i(6662),s=i(6797),r=i(5757),o=i(679),a=i(4918),l=i(1722),h=i(2655),c=i(8198),u=i(3230),d=i(1431),p=i(2722),f=i(6290);const _=new RegExp(/^data:([^,]+\/[^,]+)?;base64,/i);class m extends l.LH{constructor(e,t){super(e,l.SM.LoadFileError),this.name="LoadFileError",l.GU._setPrototypeOf(this,m.prototype),t instanceof n.g?this.request=t:this.file=t}}class g extends l.LH{constructor(e,t){super(e,l.SM.RequestFileError),this.request=t,this.name="RequestFileError",l.GU._setPrototypeOf(this,g.prototype)}}class v extends l.LH{constructor(e,t){super(e,l.SM.ReadFileError),this.file=t,this.name="ReadFileError",l.GU._setPrototypeOf(this,v.prototype)}}const y={DefaultRetryStrategy:a.b.ExponentialBackoff(),BaseUrl:"",CorsBehavior:"anonymous",PreprocessUrl:e=>e},x=e=>e.replace(/#/gm,"%23"),b=(e,t)=>{if((!e||0!==e.indexOf("data:"))&&y.CorsBehavior)if("string"==typeof y.CorsBehavior||y.CorsBehavior instanceof String)t.crossOrigin=y.CorsBehavior;else{const i=y.CorsBehavior(e);i&&(t.crossOrigin=i)}},T=(e,t,i,n,s="",r)=>{var a;let l,c=!1;e instanceof ArrayBuffer||ArrayBuffer.isView(e)?"undefined"!=typeof Blob&&"undefined"!=typeof URL?(l=URL.createObjectURL(new Blob([e],{type:s})),c=!0):l=`data:${s};base64,`+(0,h.Gh)(e):e instanceof Blob?(l=URL.createObjectURL(e),c=!0):(l=x(e),l=y.PreprocessUrl(e));const u=d.l.LastCreatedEngine,p=t=>{if(i){const n=l||e.toString();i(`Error while trying to load image: ${0===n.indexOf("http")||n.length<=128?n:n.slice(0,128)+"..."}`,t)}};if("undefined"==typeof Image||null!==(a=null==u?void 0:u._features.forceBitmapOverHTMLImageElement)&&void 0!==a&&a)return E(l,(n=>{u.createImageBitmap(new Blob([n],{type:s}),{premultiplyAlpha:"none",...r}).then((e=>{t(e),c&&URL.revokeObjectURL(l)})).catch((t=>{i&&i("Error while trying to load image: "+e,t)}))}),void 0,n||void 0,!0,((e,t)=>{p(t)})),null;const f=new Image;b(l,f);const _=[],m=()=>{_.forEach((e=>{e.target.removeEventListener(e.name,e.handler)})),_.length=0};_.push({target:f,name:"load",handler:()=>{m(),t(f),c&&f.src&&URL.revokeObjectURL(f.src)}}),_.push({target:f,name:"error",handler:e=>{m(),p(e),c&&f.src&&URL.revokeObjectURL(f.src)}}),_.push({target:document,name:"securitypolicyviolation",handler:e=>{if(e.blockedURI!==f.src)return;m();const t=new Error(`CSP violation of policy ${e.effectiveDirective} ${e.blockedURI}. Current policy is ${e.originalPolicy}`);d.l.UseFallbackTexture=!1,p(t),c&&f.src&&URL.revokeObjectURL(f.src),f.src=""}}),_.forEach((e=>{e.target.addEventListener(e.name,e.handler)}));const g="blob:"===l.substring(0,5),v="data:"===l.substring(0,5),T=()=>{g||v?f.src=l:E(l,((e,t,i)=>{const n=new Blob([e],{type:!s&&i?i:s}),r=URL.createObjectURL(n);c=!0,f.src=r}),void 0,n||void 0,!0,((e,t)=>{p(t)}))};if(!g&&!v&&n&&n.enableTexturesOffline)n.open((()=>{n&&n.loadImage(l,f)}),T);else{if(-1!==l.indexOf("file:")){const e=decodeURIComponent(l.substring(5).toLowerCase());if(o.X.FilesToLoad[e]&&"undefined"!=typeof URL){try{let t;try{t=URL.createObjectURL(o.X.FilesToLoad[e])}catch(i){t=URL.createObjectURL(o.X.FilesToLoad[e])}f.src=t,c=!0}catch(e){f.src=""}return f}}T()}return f},S=(e,t,i,n,s)=>{const o=new FileReader,a={onCompleteObservable:new r.y$,abort:()=>o.abort()};return o.onloadend=()=>a.onCompleteObservable.notifyObservers(a),s&&(o.onerror=()=>{s(new v(`Unable to read ${e.name}`,e))}),o.onload=e=>{t(e.target.result)},i&&(o.onprogress=i),n?o.readAsArrayBuffer(e):o.readAsText(e),a},E=(e,t,i,n,s,a,l)=>{if(e.name)return S(e,t,i,s,a?e=>{a(void 0,e)}:void 0);const h=e;if(-1!==h.indexOf("file:")){let e=decodeURIComponent(h.substring(5).toLowerCase());0===e.indexOf("./")&&(e=e.substring(2));const n=o.X.FilesToLoad[e];if(n)return S(n,t,i,s,a?e=>a(void 0,new m(e.message,e.file)):void 0)}const{match:c,type:u}=R(h);if(c){const e={onCompleteObservable:new r.y$,abort:()=>()=>{}};try{const e=s?M(h):I(h);t(e,void 0,u)}catch(e){a?a(void 0,e):p.Y.Error(e.message||"Failed to parse the Data URL")}return f.Q.SetImmediate((()=>{e.onCompleteObservable.notifyObservers(e)})),e}return C(h,((e,i)=>{t(e,null==i?void 0:i.responseURL,null==i?void 0:i.getResponseHeader("content-type"))}),i,n,s,a?e=>{a(e.request,new m(e.message,e.request))}:void 0,l)},C=(e,t,i,o,a,l,h)=>{e=x(e),e=y.PreprocessUrl(e);const c=y.BaseUrl+e;let u=!1;const d={onCompleteObservable:new r.y$,abort:()=>u=!0},f=()=>{let e,r=new n.g,o=null;const f=()=>{r&&(i&&r.removeEventListener("progress",i),e&&r.removeEventListener("readystatechange",e),r.removeEventListener("loadend",_))};let _=()=>{f(),d.onCompleteObservable.notifyObservers(d),d.onCompleteObservable.clear(),i=void 0,e=null,_=null,l=void 0,h=void 0,t=void 0};d.abort=()=>{u=!0,_&&_(),r&&r.readyState!==(XMLHttpRequest.DONE||4)&&r.abort(),null!==o&&(clearTimeout(o),o=null),r=null};const m=e=>{const t=e.message||"Unknown error";l&&r?l(new g(t,r)):p.Y.Error(t)},v=d=>{if(r){if(r.open("GET",c),h)try{h(r)}catch(e){return void m(e)}a&&(r.responseType="arraybuffer"),i&&r.addEventListener("progress",i),_&&r.addEventListener("loadend",_),e=()=>{if(!u&&r&&r.readyState===(XMLHttpRequest.DONE||4)){if(e&&r.removeEventListener("readystatechange",e),r.status>=200&&r.status<300||0===r.status&&(!(0,s.CG)()||A())){try{t&&t(a?r.response:r.responseText,r)}catch(e){m(e)}return}const i=y.DefaultRetryStrategy;if(i){const e=i(c,r,d);if(-1!==e)return f(),r=new n.g,void(o=setTimeout((()=>v(d+1)),e))}const h=new g("Error status: "+r.status+" "+r.statusText+" - Unable to load "+c,r);l&&l(h)}},r.addEventListener("readystatechange",e),r.send()}};v(0)};if(o&&o.enableSceneOffline){const n=e=>{e&&e.status>400?l&&l(e):f()},s=()=>{o&&o.loadFile(y.BaseUrl+e,(e=>{!u&&t&&t(e),d.onCompleteObservable.notifyObservers(d)}),i?e=>{!u&&i&&i(e)}:void 0,n,a)};o.open(s,n)}else f();return d},A=()=>"undefined"!=typeof location&&"file:"===location.protocol,P=e=>_.test(e),R=e=>{const t=_.exec(e);return null===t||0===t.length?{match:!1,type:""}:{match:!0,type:t[0].replace("data:","").replace("base64,","")}};function M(e){return(0,h.HQ)(e.split(",")[1])}const I=e=>(0,h.rP)(e.split(",")[1]);let D;u.B._FileToolsLoadImage=T,u.B._FileToolsLoadFile=E,c.L._FileToolsLoadFile=E;const O=(e,t,i,n,s,r,o,a,l,h)=>{D={DecodeBase64UrlToBinary:e,DecodeBase64UrlToString:t,DefaultRetryStrategy:i.DefaultRetryStrategy,BaseUrl:i.BaseUrl,CorsBehavior:i.CorsBehavior,PreprocessUrl:i.PreprocessUrl,IsBase64DataUrl:n,IsFileURL:s,LoadFile:r,LoadImage:o,ReadFile:a,RequestFile:l,SetCorsBehavior:h},Object.defineProperty(D,"DefaultRetryStrategy",{get:function(){return i.DefaultRetryStrategy},set:function(e){i.DefaultRetryStrategy=e}}),Object.defineProperty(D,"BaseUrl",{get:function(){return i.BaseUrl},set:function(e){i.BaseUrl=e}}),Object.defineProperty(D,"PreprocessUrl",{get:function(){return i.PreprocessUrl},set:function(e){i.PreprocessUrl=e}}),Object.defineProperty(D,"CorsBehavior",{get:function(){return i.CorsBehavior},set:function(e){i.CorsBehavior=e}})};O(M,I,y,P,A,E,T,S,C,b)},679:(e,t,i)=>{i.d(t,{X:()=>n});class n{}n.FilesToLoad={}},1983:(e,t,i)=>{function n(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,(e=>{const t=16*Math.random()|0;return("x"===e?t:3&t|8).toString(16)}))}i.d(t,{f:()=>n,x:()=>s});const s={RandomId:n}},8126:(e,t,i)=>{i.d(t,{K:()=>r});var n=i(2722),s=i(2208);class r{static Instantiate(e){if(this.RegisteredExternalClasses&&this.RegisteredExternalClasses[e])return this.RegisteredExternalClasses[e];const t=(0,s.q)(e);if(t)return t;n.Y.Warn(e+" not found, you may have missed an import.");const i=e.split(".");let r=window||this;for(let e=0,t=i.length;e<t;e++)r=r[i[e]];return"function"!=typeof r?null:r}}r.RegisteredExternalClasses={}},2722:(e,t,i)=>{i.d(t,{Y:()=>n});class n{static _CheckLimit(e,t){let i=n._LogLimitOutputs[e];return i?i.current++:(i={limit:t,current:1},n._LogLimitOutputs[e]=i),i.current<=i.limit}static _GenerateLimitMessage(e,t=1){var i;const s=n._LogLimitOutputs[e];if(!s||!n.MessageLimitReached)return;const r=this._Levels[t];s.current===s.limit&&n[r.name](n.MessageLimitReached.replace(/%LIMIT%/g,""+s.limit).replace(/%TYPE%/g,null!==(i=r.name)&&void 0!==i?i:""))}static _AddLogEntry(e){n._LogCache=e+n._LogCache,n.OnNewCacheEntry&&n.OnNewCacheEntry(e)}static _FormatMessage(e){const t=e=>e<10?"0"+e:""+e,i=new Date;return"["+t(i.getHours())+":"+t(i.getMinutes())+":"+t(i.getSeconds())+"]: "+e}static _LogDisabled(e,t){}static _LogEnabled(e=1,t,i){if(void 0!==i&&!n._CheckLimit(t,i))return;const s=n._FormatMessage(t),r=this._Levels[e];r.logFunc&&r.logFunc("BJS - "+s);const o=`<div style='color:${r.color}'>${s}</div><br>`;n._AddLogEntry(o),n._GenerateLimitMessage(t,e)}static get LogCache(){return n._LogCache}static ClearLogCache(){n._LogCache="",n._LogLimitOutputs={},n.errorsCount=0}static set LogLevels(e){n.Log=n._LogDisabled,n.Warn=n._LogDisabled,n.Error=n._LogDisabled,[n.MessageLogLevel,n.WarningLogLevel,n.ErrorLogLevel].forEach((t=>{if((e&t)===t){const e=this._Levels[t];n[e.name]=n._LogEnabled.bind(n,t)}}))}}n.NoneLogLevel=0,n.MessageLogLevel=1,n.WarningLogLevel=2,n.ErrorLogLevel=4,n.AllLogLevel=7,n.MessageLimitReached="Too many %TYPE%s (%LIMIT%), no more %TYPE%s will be reported for this message.",n._LogCache="",n._LogLimitOutputs={},n._Levels=[{},{color:"white",logFunc:console.log,name:"Log"},{color:"orange",logFunc:console.warn,name:"Warn"},{},{color:"red",logFunc:console.error,name:"Error"}],n.errorsCount=0,n.Log=n._LogEnabled.bind(n,n.MessageLogLevel),n.Warn=n._LogEnabled.bind(n,n.WarningLogLevel),n.Error=n._LogEnabled.bind(n,n.ErrorLogLevel)},5757:(e,t,i)=>{i.d(t,{Qj:()=>s,he:()=>n,y$:()=>r});class n{constructor(e,t=!1,i,n){this.initialize(e,t,i,n)}initialize(e,t=!1,i,n){return this.mask=e,this.skipNextObservers=t,this.target=i,this.currentTarget=n,this}}class s{constructor(e,t,i=null){this.callback=e,this.mask=t,this.scope=i,this._willBeUnregistered=!1,this.unregisterOnNextCall=!1}}class r{static FromPromise(e,t){const i=new r;return e.then((e=>{i.notifyObservers(e)})).catch((e=>{if(!t)throw e;t.notifyObservers(e)})),i}get observers(){return this._observers}constructor(e,t=!1){this.notifyIfTriggered=t,this._observers=new Array,this._numObserversMarkedAsDeleted=0,this._hasNotified=!1,this._eventState=new n(0),e&&(this._onObserverAdded=e)}add(e,t=-1,i=!1,n=null,r=!1){if(!e)return null;const o=new s(e,t,n);return o.unregisterOnNextCall=r,i?this._observers.unshift(o):this._observers.push(o),this._onObserverAdded&&this._onObserverAdded(o),this._hasNotified&&this.notifyIfTriggered&&void 0!==this._lastNotifiedValue&&this.notifyObserver(o,this._lastNotifiedValue),o}addOnce(e){return this.add(e,void 0,void 0,void 0,!0)}remove(e){return!!e&&(-1!==this._observers.indexOf(e)&&(this._deferUnregister(e),!0))}removeCallback(e,t){for(let i=0;i<this._observers.length;i++){const n=this._observers[i];if(!(n._willBeUnregistered||n.callback!==e||t&&t!==n.scope))return this._deferUnregister(n),!0}return!1}_deferUnregister(e){e._willBeUnregistered||(this._numObserversMarkedAsDeleted++,e.unregisterOnNextCall=!1,e._willBeUnregistered=!0,setTimeout((()=>{this._remove(e)}),0))}_remove(e,t=!0){if(!e)return!1;const i=this._observers.indexOf(e);return-1!==i&&(t&&this._numObserversMarkedAsDeleted--,this._observers.splice(i,1),!0)}makeObserverTopPriority(e){this._remove(e,!1),this._observers.unshift(e)}makeObserverBottomPriority(e){this._remove(e,!1),this._observers.push(e)}notifyObservers(e,t=-1,i,n,s){if(this.notifyIfTriggered&&(this._hasNotified=!0,this._lastNotifiedValue=e),!this._observers.length)return!0;const r=this._eventState;r.mask=t,r.target=i,r.currentTarget=n,r.skipNextObservers=!1,r.lastReturnValue=e,r.userInfo=s;for(const i of this._observers)if(!i._willBeUnregistered&&(i.mask&t&&(i.unregisterOnNextCall&&this._deferUnregister(i),i.scope?r.lastReturnValue=i.callback.apply(i.scope,[e,r]):r.lastReturnValue=i.callback(e,r)),r.skipNextObservers))return!1;return!0}notifyObserver(e,t,i=-1){if(this.notifyIfTriggered&&(this._hasNotified=!0,this._lastNotifiedValue=t),e._willBeUnregistered)return;const n=this._eventState;n.mask=i,n.skipNextObservers=!1,e.unregisterOnNextCall&&this._deferUnregister(e),e.callback(t,n)}hasObservers(){return this._observers.length-this._numObserversMarkedAsDeleted>0}clear(){this._observers.length=0,this._onObserverAdded=null,this._numObserversMarkedAsDeleted=0,this.cleanLastNotifiedState()}cleanLastNotifiedState(){this._hasNotified=!1,this._lastNotifiedValue=void 0}clone(){const e=new r;return e._observers=this._observers.slice(0),e}hasSpecificMask(e=-1){for(const t of this._observers)if(t.mask&e||t.mask===e)return!0;return!1}}},8215:(e,t,i)=>{i.d(t,{z:()=>s});var n=i(8108);class s{get min(){return this._min}get max(){return this._max}get average(){return this._average}get lastSecAverage(){return this._lastSecAverage}get current(){return this._current}get total(){return this._totalAccumulated}get count(){return this._totalValueCount}constructor(){this._startMonitoringTime=0,this._min=0,this._max=0,this._average=0,this._lastSecAverage=0,this._current=0,this._totalValueCount=0,this._totalAccumulated=0,this._lastSecAccumulated=0,this._lastSecTime=0,this._lastSecValueCount=0}fetchNewFrame(){this._totalValueCount++,this._current=0,this._lastSecValueCount++}addCount(e,t){s.Enabled&&(this._current+=e,t&&this._fetchResult())}beginMonitoring(){s.Enabled&&(this._startMonitoringTime=n.F.Now)}endMonitoring(e=!0){if(!s.Enabled)return;e&&this.fetchNewFrame();const t=n.F.Now;this._current=t-this._startMonitoringTime,e&&this._fetchResult()}_fetchResult(){this._totalAccumulated+=this._current,this._lastSecAccumulated+=this._current,this._min=Math.min(this._min,this._current),this._max=Math.max(this._max,this._current),this._average=this._totalAccumulated/this._totalValueCount;const e=n.F.Now;e-this._lastSecTime>1e3&&(this._lastSecAverage=this._lastSecAccumulated/this._lastSecValueCount,this._lastSecTime=e,this._lastSecAccumulated=0,this._lastSecValueCount=0)}}s.Enabled=!0},4757:(e,t,i)=>{i.d(t,{A:()=>s,Z:()=>r});var n=i(8108);class s{constructor(e=30){this._enabled=!0,this._rollingFrameTime=new r(e)}sampleFrame(e=n.F.Now){if(this._enabled){if(null!=this._lastFrameTimeMs){const t=e-this._lastFrameTimeMs;this._rollingFrameTime.add(t)}this._lastFrameTimeMs=e}}get averageFrameTime(){return this._rollingFrameTime.average}get averageFrameTimeVariance(){return this._rollingFrameTime.variance}get instantaneousFrameTime(){return this._rollingFrameTime.history(0)}get averageFPS(){return 1e3/this._rollingFrameTime.average}get instantaneousFPS(){const e=this._rollingFrameTime.history(0);return 0===e?0:1e3/e}get isSaturated(){return this._rollingFrameTime.isSaturated()}enable(){this._enabled=!0}disable(){this._enabled=!1,this._lastFrameTimeMs=null}get isEnabled(){return this._enabled}reset(){this._lastFrameTimeMs=null,this._rollingFrameTime.reset()}}class r{constructor(e){this._samples=new Array(e),this.reset()}add(e){let t;if(this.isSaturated()){const e=this._samples[this._pos];t=e-this.average,this.average-=t/(this._sampleCount-1),this._m2-=t*(e-this.average)}else this._sampleCount++;t=e-this.average,this.average+=t/this._sampleCount,this._m2+=t*(e-this.average),this.variance=this._m2/(this._sampleCount-1),this._samples[this._pos]=e,this._pos++,this._pos%=this._samples.length}history(e){if(e>=this._sampleCount||e>=this._samples.length)return 0;const t=this._wrapPosition(this._pos-1);return this._samples[this._wrapPosition(t-e)]}isSaturated(){return this._sampleCount>=this._samples.length}reset(){this.average=0,this.variance=0,this._sampleCount=0,this._pos=0,this._m2=0}_wrapPosition(e){const t=this._samples.length;return(e%t+t)%t}}},6746:(e,t,i)=>{i.d(t,{m:()=>s});var n=i(4141);class s{static _RemoveAndStorePivotPoint(e){e&&0===s._PivotCached&&(e.getPivotPointToRef(s._OldPivotPoint),s._PivotPostMultiplyPivotMatrix=e._postMultiplyPivotMatrix,s._OldPivotPoint.equalsToFloats(0,0,0)||(e.setPivotMatrix(n.y3.IdentityReadOnly),s._OldPivotPoint.subtractToRef(e.getPivotPoint(),s._PivotTranslation),s._PivotTmpVector.copyFromFloats(1,1,1),s._PivotTmpVector.subtractInPlace(e.scaling),s._PivotTmpVector.multiplyInPlace(s._PivotTranslation),e.position.addInPlace(s._PivotTmpVector))),s._PivotCached++}static _RestorePivotPoint(e){e&&!s._OldPivotPoint.equalsToFloats(0,0,0)&&1===s._PivotCached&&(e.setPivotPoint(s._OldPivotPoint),e._postMultiplyPivotMatrix=s._PivotPostMultiplyPivotMatrix,s._PivotTmpVector.copyFromFloats(1,1,1),s._PivotTmpVector.subtractInPlace(e.scaling),s._PivotTmpVector.multiplyInPlace(s._PivotTranslation),e.position.subtractInPlace(s._PivotTmpVector)),this._PivotCached--}}s._PivotCached=0,s._OldPivotPoint=new n.P,s._PivotTranslation=new n.P,s._PivotTmpVector=new n.P,s._PivotPostMultiplyPivotMatrix=!1},8108:(e,t,i)=>{i.d(t,{F:()=>s});var n=i(6797);class s{static get Now(){return n.MZ.IsWindowObjectExist()&&window.performance&&window.performance.now?window.performance.now():Date.now()}}},4918:(e,t,i)=>{i.d(t,{b:()=>n});class n{static ExponentialBackoff(e=3,t=500){return(i,n,s)=>0!==n.status||s>=e||-1!==i.indexOf("file:")?-1:Math.pow(2,s)*t}}},8121:(e,t,i)=>{i.d(t,{r:()=>r});var n=i(392),s=(i(7161),i(7246),i(806));class r{static ExpandRGBDTexture(e){const t=e._texture;if(!t||!e.isRGBD)return;const i=t.getEngine(),s=i.getCaps(),r=t.isReady;let o=!1;s.textureHalfFloatRender&&s.textureHalfFloatLinearFiltering?(o=!0,t.type=2):s.textureFloatRender&&s.textureFloatLinearFiltering&&(o=!0,t.type=1),o&&(t.isReady=!1,t._isRGBD=!1,t.invertY=!1);const a=()=>{if(o){const s=new n.D("rgbdDecode","rgbdDecode",null,null,1,null,3,i,!1,void 0,t.type,void 0,null,!1);s.externalTextureSamplerBinding=!0;const r=i.createRenderTargetTexture(t.width,{generateDepthBuffer:!1,generateMipMaps:!1,generateStencilBuffer:!1,samplingMode:t.samplingMode,type:t.type,format:5});s.getEffect().executeWhenCompiled((()=>{s.onApply=e=>{e._bindTexture("textureSampler",t),e.setFloat2("scale",1,1)},e.getScene().postProcessManager.directRender([s],r,!0),i.restoreDefaultFramebuffer(),i._releaseTexture(t),s&&s.dispose(),r._swapAndDie(t),t.isReady=!0}))}};r?a():e.onLoadObservable.addOnce(a)}static EncodeTextureToRGBD(e,t,i=0){return(0,s.$0)("rgbdEncode",e,t,i,1,5)}}},5363:(e,t,i)=>{i.d(t,{f:()=>s,t:()=>n});class n{constructor(e){this.length=0,this.data=new Array(e),this._id=n._GlobalId++}push(e){this.data[this.length++]=e,this.length>this.data.length&&(this.data.length*=2)}forEach(e){for(let t=0;t<this.length;t++)e(this.data[t])}sort(e){this.data.sort(e)}reset(){this.length=0}dispose(){this.reset(),this.data&&(this.data.length=0)}concat(e){if(0!==e.length){this.length+e.length>this.data.length&&(this.data.length=2*(this.length+e.length));for(let t=0;t<e.length;t++)this.data[this.length++]=(e.data||e)[t]}}indexOf(e){const t=this.data.indexOf(e);return t>=this.length?-1:t}contains(e){return-1!==this.indexOf(e)}}n._GlobalId=0;class s extends n{constructor(){super(...arguments),this._duplicateId=0}push(e){super.push(e),e.__smartArrayFlags||(e.__smartArrayFlags={}),e.__smartArrayFlags[this._id]=this._duplicateId}pushNoDuplicate(e){return!(e.__smartArrayFlags&&e.__smartArrayFlags[this._id]===this._duplicateId||(this.push(e),0))}reset(){super.reset(),this._duplicateId++}concatWithNoDuplicate(e){if(0!==e.length){this.length+e.length>this.data.length&&(this.data.length=2*(this.length+e.length));for(let t=0;t<e.length;t++){const i=(e.data||e)[t];this.pushNoDuplicate(i)}}}}},7090:(e,t,i)=>{i.d(t,{x:()=>n});class n{constructor(){this._count=0,this._data={}}copyFrom(e){this.clear(),e.forEach(((e,t)=>this.add(e,t)))}get(e){const t=this._data[e];if(void 0!==t)return t}getOrAddWithFactory(e,t){let i=this.get(e);return void 0!==i||(i=t(e),i&&this.add(e,i)),i}getOrAdd(e,t){const i=this.get(e);return void 0!==i?i:(this.add(e,t),t)}contains(e){return void 0!==this._data[e]}add(e,t){return void 0===this._data[e]&&(this._data[e]=t,++this._count,!0)}set(e,t){return void 0!==this._data[e]&&(this._data[e]=t,!0)}getAndRemove(e){const t=this.get(e);return void 0!==t?(delete this._data[e],--this._count,t):null}remove(e){return!!this.contains(e)&&(delete this._data[e],--this._count,!0)}clear(){this._data={},this._count=0}get count(){return this._count}forEach(e){for(const t in this._data)e(t,this._data[t])}first(e){for(const t in this._data){const i=e(t,this._data[t]);if(i)return i}return null}}},2655:(e,t,i)=>{i.d(t,{Gh:()=>o,HQ:()=>l,Ml:()=>c,Ri:()=>s,fJ:()=>r,gi:()=>n,rP:()=>a,zA:()=>h});const n=(e,t)=>e.endsWith(t),s=(e,t)=>!!e&&e.startsWith(t),r=e=>{if("undefined"!=typeof TextDecoder)return(new TextDecoder).decode(e);let t="";for(let i=0;i<e.byteLength;i++)t+=String.fromCharCode(e[i]);return t},o=e=>{const t="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";let i,n,s,r,o,a,l,h="",c=0;const u=ArrayBuffer.isView(e)?new Uint8Array(e.buffer,e.byteOffset,e.byteLength):new Uint8Array(e);for(;c<u.length;)i=u[c++],n=c<u.length?u[c++]:Number.NaN,s=c<u.length?u[c++]:Number.NaN,r=i>>2,o=(3&i)<<4|n>>4,a=(15&n)<<2|s>>6,l=63&s,isNaN(n)?a=l=64:isNaN(s)&&(l=64),h+=t.charAt(r)+t.charAt(o)+t.charAt(a)+t.charAt(l);return h},a=e=>atob(e),l=e=>{const t=a(e),i=t.length,n=new Uint8Array(new ArrayBuffer(i));for(let e=0;e<i;e++)n[e]=t.charCodeAt(e);return n.buffer},h=(e,t)=>{let i=String(e);for(;i.length<t;)i="0"+i;return i},c={EndsWith:n,StartsWith:s,Decode:r,EncodeArrayBufferToBase64:o,DecodeBase64ToString:a,DecodeBase64ToBinary:l,PadNumber:h}},4875:(e,t,i)=>{i.d(t,{$:()=>s});var n=i(5559);class s{static EnableFor(e){e._tags=e._tags||{},e.hasTags=()=>s.HasTags(e),e.addTags=t=>s.AddTagsTo(e,t),e.removeTags=t=>s.RemoveTagsFrom(e,t),e.matchesTagsQuery=t=>s.MatchesQuery(e,t)}static DisableFor(e){delete e._tags,delete e.hasTags,delete e.addTags,delete e.removeTags,delete e.matchesTagsQuery}static HasTags(e){if(!e._tags)return!1;const t=e._tags;for(const e in t)if(Object.prototype.hasOwnProperty.call(t,e))return!0;return!1}static GetTags(e,t=!0){if(!e._tags)return null;if(t){const t=[];for(const i in e._tags)Object.prototype.hasOwnProperty.call(e._tags,i)&&!0===e._tags[i]&&t.push(i);return t.join(" ")}return e._tags}static AddTagsTo(e,t){t&&"string"==typeof t&&t.split(" ").forEach((function(t){s._AddTagTo(e,t)}))}static _AddTagTo(e,t){""!==(t=t.trim())&&"true"!==t&&"false"!==t&&(t.match(/[\s]/)||t.match(/^([!]|([|]|[&]){2})/)||(s.EnableFor(e),e._tags[t]=!0))}static RemoveTagsFrom(e,t){if(!s.HasTags(e))return;const i=t.split(" ");for(const t in i)s._RemoveTagFrom(e,i[t])}static _RemoveTagFrom(e,t){delete e._tags[t]}static MatchesQuery(e,t){return void 0===t||(""===t?s.HasTags(e):n.q.Eval(t,(t=>s.HasTags(e)&&e._tags[t])))}}},806:(e,t,i)=>{i.d(t,{$0:()=>l,Oi:()=>p,ay:()=>u,cW:()=>a,qZ:()=>d});var n=i(2262),s=i(4246),r=i(9525),o=i(392);function a(e,t,i,o=!0){const a=e.getScene(),l=a.getEngine(),h=new s._("resized"+e.name,{width:t,height:i},a,!e.noMipmap,!0,e._texture.type,!1,e.samplingMode,!1);h.wrapU=e.wrapU,h.wrapV=e.wrapV,h.uOffset=e.uOffset,h.vOffset=e.vOffset,h.uScale=e.uScale,h.vScale=e.vScale,h.uAng=e.uAng,h.vAng=e.vAng,h.wAng=e.wAng,h.coordinatesIndex=e.coordinatesIndex,h.level=e.level,h.anisotropicFilteringLevel=e.anisotropicFilteringLevel,h._texture.isReady=!1,e.wrapU=n.x.CLAMP_ADDRESSMODE,e.wrapV=n.x.CLAMP_ADDRESSMODE;const c=new r.Q("pass",1,null,o?n.x.BILINEAR_SAMPLINGMODE:n.x.NEAREST_SAMPLINGMODE,l,!1,0);return c.externalTextureSamplerBinding=!0,c.getEffect().executeWhenCompiled((()=>{c.onApply=function(t){t.setTexture("textureSampler",e)};const t=h.renderTarget;t&&(a.postProcessManager.directRender([c],t),l.unBindFramebuffer(t),h.disposeFramebufferObjects(),c.dispose(),h.getInternalTexture().isReady=!0)})),h}function l(e,t,i,n,s,r,a,l){const h=t.getEngine();return t.isReady=!1,s=null!=s?s:t.samplingMode,n=null!=n?n:t.type,r=null!=r?r:t.format,a=null!=a?a:t.width,l=null!=l?l:t.height,-1===n&&(n=0),new Promise((c=>{const u=new o.D("postprocess",e,null,null,1,null,s,h,!1,void 0,n,void 0,null,!1,r);u.externalTextureSamplerBinding=!0;const d=h.createRenderTargetTexture({width:a,height:l},{generateDepthBuffer:!1,generateMipMaps:!1,generateStencilBuffer:!1,samplingMode:s,type:n,format:r});u.getEffect().executeWhenCompiled((()=>{u.onApply=e=>{e._bindTexture("textureSampler",t),e.setFloat2("scale",1,1)},i.postProcessManager.directRender([u],d,!0),h.restoreDefaultFramebuffer(),h._releaseTexture(t),u&&u.dispose(),d._swapAndDie(t),t.type=n,t.format=5,t.isReady=!0,c(t)}))}))}let h,c;function u(e){h||(h=new Float32Array(1),c=new Int32Array(h.buffer)),h[0]=e;const t=c[0];let i=t>>16&32768,n=t>>12&2047;const s=t>>23&255;return s<103?i:s>142?(i|=31744,i|=(255==s?0:1)&&8388607&t,i):s<113?(n|=2048,i|=(n>>114-s)+(n>>113-s&1),i):(i|=s-112<<10|n>>1,i+=1&n,i)}function d(e){const t=(32768&e)>>15,i=(31744&e)>>10,n=1023&e;return 0===i?(t?-1:1)*Math.pow(2,-14)*(n/Math.pow(2,10)):31==i?n?NaN:1/0*(t?-1:1):(t?-1:1)*Math.pow(2,i-15)*(1+n/Math.pow(2,10))}const p={CreateResizedCopy:a,ApplyPostProcess:l,ToHalfFloat:u,FromHalfFloat:d}},6290:(e,t,i)=>{i.d(t,{Q:()=>s});var n=i(6797);class s{static SetImmediate(e){(0,n.CG)()&&window.setImmediate?window.setImmediate(e):setTimeout(e,1)}}},7257:(e,t,i)=>{i.d(t,{$g:()=>g,ok:()=>m,w1:()=>_});var n=i(5757),s=i(6797),r=i(2722),o=i(6387),a=i(8108),l=i(4934),h=i(6662),c=i(1431),u=i(5661),d=i(6290),p=i(8126),f=i(1983);class _{static get BaseUrl(){return u.rN.BaseUrl}static set BaseUrl(e){u.rN.BaseUrl=e}static get DefaultRetryStrategy(){return u.rN.DefaultRetryStrategy}static set DefaultRetryStrategy(e){u.rN.DefaultRetryStrategy=e}static get CorsBehavior(){return u.rN.CorsBehavior}static set CorsBehavior(e){u.rN.CorsBehavior=e}static get UseFallbackTexture(){return c.l.UseFallbackTexture}static set UseFallbackTexture(e){c.l.UseFallbackTexture=e}static get RegisteredExternalClasses(){return p.K.RegisteredExternalClasses}static set RegisteredExternalClasses(e){p.K.RegisteredExternalClasses=e}static get fallbackTexture(){return c.l.FallbackTexture}static set fallbackTexture(e){c.l.FallbackTexture=e}static FetchToRef(e,t,i,n,s,r){const o=4*((Math.abs(e)*i%i|0)+(Math.abs(t)*n%n|0)*i);r.r=s[o]/255,r.g=s[o+1]/255,r.b=s[o+2]/255,r.a=s[o+3]/255}static Mix(e,t,i){return e*(1-i)+t*i}static Instantiate(e){return p.K.Instantiate(e)}static SetImmediate(e){d.Q.SetImmediate(e)}static IsExponentOfTwo(e){let t=1;do{t*=2}while(t<e);return t===e}static FloatRound(e){return Math.fround?Math.fround(e):(_._TmpFloatArray[0]=e,_._TmpFloatArray[0])}static GetFilename(e){const t=e.lastIndexOf("/");return t<0?e:e.substring(t+1)}static GetFolderPath(e,t=!1){const i=e.lastIndexOf("/");return i<0?t?e:"":e.substring(0,i+1)}static ToDegrees(e){return 180*e/Math.PI}static ToRadians(e){return e*Math.PI/180}static SmoothAngleChange(e,t,i=.9){const n=this.ToRadians(e),s=this.ToRadians(t);return this.ToDegrees(Math.atan2((1-i)*Math.sin(s)+i*Math.sin(n),(1-i)*Math.cos(s)+i*Math.cos(n)))}static MakeArray(e,t){return!0===t||void 0!==e&&null!=e?Array.isArray(e)?e:[e]:null}static GetPointerPrefix(e){let t="pointer";return(0,s.CG)()&&!window.PointerEvent&&(t="mouse"),!e._badDesktopOS||e._badOS||document&&"ontouchend"in document||(t="mouse"),t}static SetCorsBehavior(e,t){(0,u.$M)(e,t)}static SetReferrerPolicyBehavior(e,t){t.referrerPolicy=e}static CleanUrl(e){return e.replace(/#/gm,"%23")}static get PreprocessUrl(){return u.rN.PreprocessUrl}static set PreprocessUrl(e){u.rN.PreprocessUrl=e}static LoadImage(e,t,i,n,s,r){return(0,u.r6)(e,t,i,n,s,r)}static LoadFile(e,t,i,n,s,r){return(0,u.vP)(e,t,i,n,s,r)}static LoadFileAsync(e,t=!0){return new Promise(((i,n)=>{(0,u.vP)(e,(e=>{i(e)}),void 0,void 0,t,((e,t)=>{n(t)}))}))}static LoadScript(e,t,i,n){if("function"==typeof importScripts){try{importScripts(e),t()}catch(t){null==i||i(`Unable to load script '${e}' in worker`,t)}return}if(!(0,s.CG)())return void(null==i||i(`Cannot load script '${e}' outside of a window or a worker`));const r=document.getElementsByTagName("head")[0],o=document.createElement("script");o.setAttribute("type","text/javascript"),o.setAttribute("src",e),n&&(o.id=n),o.onload=()=>{t&&t()},o.onerror=t=>{i&&i(`Unable to load script '${e}'`,t)},r.appendChild(o)}static LoadScriptAsync(e){return new Promise(((t,i)=>{this.LoadScript(e,(()=>{t()}),((e,t)=>{i(t||new Error(e))}))}))}static ReadFileAsDataURL(e,t,i){const s=new FileReader,r={onCompleteObservable:new n.y$,abort:()=>s.abort()};return s.onloadend=()=>{r.onCompleteObservable.notifyObservers(r)},s.onload=e=>{t(e.target.result)},s.onprogress=i,s.readAsDataURL(e),r}static ReadFile(e,t,i,n,s){return(0,u.Ip)(e,t,i,n,s)}static FileAsURL(e){const t=new Blob([e]);return window.URL.createObjectURL(t)}static Format(e,t=2){return e.toFixed(t)}static DeepCopy(e,t,i,n){o.j.DeepCopy(e,t,i,n)}static IsEmpty(e){for(const t in e)if(Object.prototype.hasOwnProperty.call(e,t))return!1;return!0}static RegisterTopRootEvents(e,t){for(let i=0;i<t.length;i++){const n=t[i];e.addEventListener(n.name,n.handler,!1);try{window.parent&&window.parent.addEventListener(n.name,n.handler,!1)}catch(e){}}}static UnregisterTopRootEvents(e,t){for(let i=0;i<t.length;i++){const n=t[i];e.removeEventListener(n.name,n.handler);try{e.parent&&e.parent.removeEventListener(n.name,n.handler)}catch(e){}}}static async DumpFramebuffer(e,t,i,n,s="image/png",r){throw(0,l.S)("DumpTools")}static DumpData(e,t,i,n,s="image/png",r,o=!1,a=!1,h){throw(0,l.S)("DumpTools")}static DumpDataAsync(e,t,i,n="image/png",s,r=!1,o=!1,a){throw(0,l.S)("DumpTools")}static _IsOffScreenCanvas(e){return void 0!==e.convertToBlob}static ToBlob(e,t,i="image/png",n){_._IsOffScreenCanvas(e)||e.toBlob||(e.toBlob=function(e,t,i){setTimeout((()=>{const n=atob(this.toDataURL(t,i).split(",")[1]),s=n.length,r=new Uint8Array(s);for(let e=0;e<s;e++)r[e]=n.charCodeAt(e);e(new Blob([r]))}))}),_._IsOffScreenCanvas(e)?e.convertToBlob({type:i,quality:n}).then((e=>t(e))):e.toBlob((function(e){t(e)}),i,n)}static DownloadBlob(e,t){if("download"in document.createElement("a")){if(!t){const e=new Date;t="screenshot_"+(e.getFullYear()+"-"+(e.getMonth()+1)).slice(2)+"-"+e.getDate()+"_"+e.getHours()+"-"+("0"+e.getMinutes()).slice(-2)+".png"}_.Download(e,t)}else if(e&&"undefined"!=typeof URL){const t=URL.createObjectURL(e),i=window.open("");if(!i)return;const n=i.document.createElement("img");n.onload=function(){URL.revokeObjectURL(t)},n.src=t,i.document.body.appendChild(n)}}static EncodeScreenshotCanvasData(e,t,i="image/png",n,s){if("string"!=typeof n&&t){if(t){if(_._IsOffScreenCanvas(e))return void e.convertToBlob({type:i,quality:s}).then((e=>{const i=new FileReader;i.readAsDataURL(e),i.onloadend=()=>{const e=i.result;t(e)}}));const n=e.toDataURL(i,s);t(n)}}else this.ToBlob(e,(function(e){e&&_.DownloadBlob(e,n),t&&t("")}),i,s)}static Download(e,t){if("undefined"==typeof URL)return;const i=window.URL.createObjectURL(e),n=document.createElement("a");document.body.appendChild(n),n.style.display="none",n.href=i,n.download=t,n.addEventListener("click",(()=>{n.parentElement&&n.parentElement.removeChild(n)})),n.click(),window.URL.revokeObjectURL(i)}static BackCompatCameraNoPreventDefault(e){return"boolean"==typeof e[0]?e[0]:"boolean"==typeof e[1]&&e[1]}static CreateScreenshot(e,t,i,n,s="image/png"){throw(0,l.S)("ScreenshotTools")}static CreateScreenshotAsync(e,t,i,n="image/png"){throw(0,l.S)("ScreenshotTools")}static CreateScreenshotUsingRenderTarget(e,t,i,n,s="image/png",r=1,o=!1,a){throw(0,l.S)("ScreenshotTools")}static CreateScreenshotUsingRenderTargetAsync(e,t,i,n="image/png",s=1,r=!1,o){throw(0,l.S)("ScreenshotTools")}static RandomId(){return(0,f.f)()}static IsBase64(e){return(0,u.VL)(e)}static DecodeBase64(e){return(0,u.$K)(e)}static get errorsCount(){return r.Y.errorsCount}static Log(e){r.Y.Log(e)}static Warn(e){r.Y.Warn(e)}static Error(e){r.Y.Error(e)}static get LogCache(){return r.Y.LogCache}static ClearLogCache(){r.Y.ClearLogCache()}static set LogLevels(e){r.Y.LogLevels=e}static set PerformanceLogLevel(e){return(e&_.PerformanceUserMarkLogLevel)===_.PerformanceUserMarkLogLevel?(_.StartPerformanceCounter=_._StartUserMark,void(_.EndPerformanceCounter=_._EndUserMark)):(e&_.PerformanceConsoleLogLevel)===_.PerformanceConsoleLogLevel?(_.StartPerformanceCounter=_._StartPerformanceConsole,void(_.EndPerformanceCounter=_._EndPerformanceConsole)):(_.StartPerformanceCounter=_._StartPerformanceCounterDisabled,void(_.EndPerformanceCounter=_._EndPerformanceCounterDisabled))}static _StartPerformanceCounterDisabled(e,t){}static _EndPerformanceCounterDisabled(e,t){}static _StartUserMark(e,t=!0){if(!_._Performance){if(!(0,s.CG)())return;_._Performance=window.performance}t&&_._Performance.mark&&_._Performance.mark(e+"-Begin")}static _EndUserMark(e,t=!0){t&&_._Performance.mark&&(_._Performance.mark(e+"-End"),_._Performance.measure(e,e+"-Begin",e+"-End"))}static _StartPerformanceConsole(e,t=!0){t&&(_._StartUserMark(e,t),console.time&&console.time(e))}static _EndPerformanceConsole(e,t=!0){t&&(_._EndUserMark(e,t),console.timeEnd(e))}static get Now(){return a.F.Now}static GetClassName(e,t=!1){let i=null;return!t&&e.getClassName?i=e.getClassName():(e instanceof Object&&(i=(t?e:Object.getPrototypeOf(e)).constructor.__bjsclassName__),i||(i=typeof e)),i}static First(e,t){for(const i of e)if(t(i))return i;return null}static getFullClassName(e,t=!1){let i=null,n=null;if(!t&&e.getClassName)i=e.getClassName();else{if(e instanceof Object){const s=t?e:Object.getPrototypeOf(e);i=s.constructor.__bjsclassName__,n=s.constructor.__bjsmoduleName__}i||(i=typeof e)}return i?(null!=n?n+".":"")+i:null}static DelayAsync(e){return new Promise((t=>{setTimeout((()=>{t()}),e)}))}static IsSafari(){return!!(0,s.up)()&&/^((?!chrome|android).)*safari/i.test(navigator.userAgent)}}function m(e,t){return i=>{i.__bjsclassName__=e,i.__bjsmoduleName__=null!=t?t:null}}_.UseCustomRequestHeaders=!1,_.CustomRequestHeaders=h.g.CustomRequestHeaders,_._TmpFloatArray=new Float32Array(1),_.GetDOMTextContent=s.v,_.GetAbsoluteUrl="object"==typeof document?e=>{const t=document.createElement("a");return t.href=e,t.href}:"function"==typeof URL&&"object"==typeof location?e=>new URL(e,location.origin).href:()=>{throw new Error("Unable to get absolute URL. Override BABYLON.Tools.GetAbsoluteUrl to a custom implementation for the current context.")},_.NoneLogLevel=r.Y.NoneLogLevel,_.MessageLogLevel=r.Y.MessageLogLevel,_.WarningLogLevel=r.Y.WarningLogLevel,_.ErrorLogLevel=r.Y.ErrorLogLevel,_.AllLogLevel=r.Y.AllLogLevel,_.IsWindowObjectExist=s.CG,_.PerformanceNoneLogLevel=0,_.PerformanceUserMarkLogLevel=1,_.PerformanceConsoleLogLevel=2,_.StartPerformanceCounter=_._StartPerformanceCounterDisabled,_.EndPerformanceCounter=_._EndPerformanceCounterDisabled;class g{constructor(e,t,i,n=0){this.iterations=e,this.index=n-1,this._done=!1,this._fn=t,this._successCallback=i}executeNext(){this._done||(this.index+1<this.iterations?(++this.index,this._fn(this)):this.breakLoop())}breakLoop(){this._done=!0,this._successCallback()}static Run(e,t,i,n=0){const s=new g(e,t,i,n);return s.executeNext(),s}static SyncAsyncForLoop(e,t,i,n,s,r=0){return g.Run(Math.ceil(e/t),(n=>{s&&s()?n.breakLoop():setTimeout((()=>{for(let r=0;r<t;++r){const o=n.index*t+r;if(o>=e)break;if(i(o),s&&s()){n.breakLoop();break}}n.executeNext()}),r)}),n)}}c.l.FallbackTexture="data:image/jpg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/4QBmRXhpZgAATU0AKgAAAAgABAEaAAUAAAABAAAAPgEbAAUAAAABAAAARgEoAAMAAAABAAIAAAExAAIAAAAQAAAATgAAAAAAAABgAAAAAQAAAGAAAAABcGFpbnQubmV0IDQuMC41AP/bAEMABAIDAwMCBAMDAwQEBAQFCQYFBQUFCwgIBgkNCw0NDQsMDA4QFBEODxMPDAwSGBITFRYXFxcOERkbGRYaFBYXFv/bAEMBBAQEBQUFCgYGChYPDA8WFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWFv/AABEIAQABAAMBIgACEQEDEQH/xAAfAAABBQEBAQEBAQAAAAAAAAAAAQIDBAUGBwgJCgv/xAC1EAACAQMDAgQDBQUEBAAAAX0BAgMABBEFEiExQQYTUWEHInEUMoGRoQgjQrHBFVLR8CQzYnKCCQoWFxgZGiUmJygpKjQ1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4eLj5OXm5+jp6vHy8/T19vf4+fr/xAAfAQADAQEBAQEBAQEBAAAAAAAAAQIDBAUGBwgJCgv/xAC1EQACAQIEBAMEBwUEBAABAncAAQIDEQQFITEGEkFRB2FxEyIygQgUQpGhscEJIzNS8BVictEKFiQ04SXxFxgZGiYnKCkqNTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqCg4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2dri4+Tl5ufo6ery8/T19vf4+fr/2gAMAwEAAhEDEQA/APH6KKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FCiiigD6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++gooooA+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gUKKKKAPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76CiiigD5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BQooooA+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/voKKKKAPl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FCiiigD6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++gooooA+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gUKKKKAPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76CiiigD5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BQooooA+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/voKKKKAPl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FCiiigD6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++gooooA+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gUKKKKAPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76Pl+iiivuj+BT6gooor4U/vo+X6KKK+6P4FPqCiiivhT++j5fooor7o/gU+oKKKK+FP76P//Z"},2208:(e,t,i)=>{i.d(t,{H:()=>s,q:()=>r});const n={};function s(e,t){n[e]=t}function r(e){return n[e]}},8718:(e,t,i)=>{i.d(t,{K:()=>n});class n{static get UniqueId(){const e=this._UniqueIdCounter;return this._UniqueIdCounter++,e}}n._UniqueIdCounter=1},6662:(e,t,i)=>{i.d(t,{g:()=>n});class n{constructor(){this._xhr="undefined"!=typeof _native&&_native.XMLHttpRequest?new _native.XMLHttpRequest:new XMLHttpRequest,this._requestURL=""}_injectCustomRequestHeaders(){if(!this._shouldSkipRequestModifications(this._requestURL))for(const e in n.CustomRequestHeaders){const t=n.CustomRequestHeaders[e];t&&this._xhr.setRequestHeader(e,t)}}_shouldSkipRequestModifications(e){return n.SkipRequestModificationForBabylonCDN&&(e.includes("preview.babylonjs.com")||e.includes("cdn.babylonjs.com"))}get onprogress(){return this._xhr.onprogress}set onprogress(e){this._xhr.onprogress=e}get readyState(){return this._xhr.readyState}get status(){return this._xhr.status}get statusText(){return this._xhr.statusText}get response(){return this._xhr.response}get responseURL(){return this._xhr.responseURL}get responseText(){return this._xhr.responseText}get responseType(){return this._xhr.responseType}set responseType(e){this._xhr.responseType=e}get timeout(){return this._xhr.timeout}set timeout(e){this._xhr.timeout=e}addEventListener(e,t,i){this._xhr.addEventListener(e,t,i)}removeEventListener(e,t,i){this._xhr.removeEventListener(e,t,i)}abort(){this._xhr.abort()}send(e){n.CustomRequestHeaders&&this._injectCustomRequestHeaders(),this._xhr.send(e)}open(e,t){for(const e of n.CustomRequestModifiers){if(this._shouldSkipRequestModifications(t))return;e(this._xhr,t)}return t=(t=t.replace("file:http:","http:")).replace("file:https:","https:"),this._requestURL=t,this._xhr.open(e,t,!0)}setRequestHeader(e,t){this._xhr.setRequestHeader(e,t)}getResponseHeader(e){return this._xhr.getResponseHeader(e)}}n.CustomRequestHeaders={},n.CustomRequestModifiers=new Array,n.SkipRequestModificationForBabylonCDN=!0},6250:(e,t,i)=>{i.d(t,{h:()=>n,v:()=>s});class n{constructor(e){this._pendingActions=new Array,this._workerInfos=e.map((e=>({workerPromise:Promise.resolve(e),idle:!0})))}dispose(){for(const e of this._workerInfos)e.workerPromise.then((e=>{e.terminate()}));this._workerInfos.length=0,this._pendingActions.length=0}push(e){this._executeOnIdleWorker(e)||this._pendingActions.push(e)}_executeOnIdleWorker(e){for(const t of this._workerInfos)if(t.idle)return this._execute(t,e),!0;return!1}_execute(e,t){e.idle=!1,e.workerPromise.then((i=>{t(i,(()=>{const t=this._pendingActions.shift();t?this._execute(e,t):e.idle=!0}))}))}}class s extends n{constructor(e,t,i=s.DefaultOptions){super([]),this._maxWorkers=e,this._createWorkerAsync=t,this._options=i}push(e){if(!this._executeOnIdleWorker(e))if(this._workerInfos.length<this._maxWorkers){const t={workerPromise:this._createWorkerAsync(),idle:!1};this._workerInfos.push(t),this._execute(t,e)}else this._pendingActions.push(e)}_execute(e,t){e.timeoutId&&(clearTimeout(e.timeoutId),delete e.timeoutId),super._execute(e,((i,n)=>{t(i,(()=>{n(),e.idle&&(e.timeoutId=setTimeout((()=>{e.workerPromise.then((e=>{e.terminate()}));const t=this._workerInfos.indexOf(e);-1!==t&&this._workerInfos.splice(t,1)}),this._options.idleTimeElapsedBeforeRelease))}))}))}}s.DefaultOptions={idleTimeElapsedBeforeRelease:1e3}},7780:(e,t,i)=>{i.d(t,{Y:()=>h});var n=i(9472),s=i(5757),r=i(1431),o=i(708),a=i(3956),l=i(2208);class h{get influence(){return this._influence}set influence(e){if(this._influence===e)return;const t=this._influence;this._influence=e,this.onInfluenceChanged.hasObservers()&&this.onInfluenceChanged.notifyObservers(0===t||0===e)}get animationPropertiesOverride(){return!this._animationPropertiesOverride&&this._scene?this._scene.animationPropertiesOverride:this._animationPropertiesOverride}set animationPropertiesOverride(e){this._animationPropertiesOverride=e}constructor(e,t=0,i=null){this.name=e,this.animations=new Array,this._positions=null,this._normals=null,this._tangents=null,this._uvs=null,this._uniqueId=0,this.onInfluenceChanged=new s.y$,this._onDataLayoutChanged=new s.y$,this._animationPropertiesOverride=null,this._scene=i||r.l.LastCreatedScene,this.influence=t,this._scene&&(this._uniqueId=this._scene.getUniqueId())}get uniqueId(){return this._uniqueId}get hasPositions(){return!!this._positions}get hasNormals(){return!!this._normals}get hasTangents(){return!!this._tangents}get hasUVs(){return!!this._uvs}setPositions(e){const t=this.hasPositions;this._positions=e,t!==this.hasPositions&&this._onDataLayoutChanged.notifyObservers(void 0)}getPositions(){return this._positions}setNormals(e){const t=this.hasNormals;this._normals=e,t!==this.hasNormals&&this._onDataLayoutChanged.notifyObservers(void 0)}getNormals(){return this._normals}setTangents(e){const t=this.hasTangents;this._tangents=e,t!==this.hasTangents&&this._onDataLayoutChanged.notifyObservers(void 0)}getTangents(){return this._tangents}setUVs(e){const t=this.hasUVs;this._uvs=e,t!==this.hasUVs&&this._onDataLayoutChanged.notifyObservers(void 0)}getUVs(){return this._uvs}clone(){const e=a.p4.Clone((()=>new h(this.name,this.influence,this._scene)),this);return e._positions=this._positions,e._normals=this._normals,e._tangents=this._tangents,e._uvs=this._uvs,e}serialize(){const e={};return e.name=this.name,e.influence=this.influence,e.positions=Array.prototype.slice.call(this.getPositions()),null!=this.id&&(e.id=this.id),this.hasNormals&&(e.normals=Array.prototype.slice.call(this.getNormals())),this.hasTangents&&(e.tangents=Array.prototype.slice.call(this.getTangents())),this.hasUVs&&(e.uvs=Array.prototype.slice.call(this.getUVs())),a.p4.AppendSerializedAnimations(this,e),e}getClassName(){return"MorphTarget"}static Parse(e,t){const i=new h(e.name,e.influence);if(i.setPositions(e.positions),null!=e.id&&(i.id=e.id),e.normals&&i.setNormals(e.normals),e.tangents&&i.setTangents(e.tangents),e.uvs&&i.setUVs(e.uvs),e.animations){for(let t=0;t<e.animations.length;t++){const n=e.animations[t],s=(0,l.q)("BABYLON.Animation");s&&i.animations.push(s.Parse(n))}e.autoAnimate&&t&&t.beginAnimation(i,e.autoAnimateFrom,e.autoAnimateTo,e.autoAnimateLoop,e.autoAnimateSpeed||1)}return i}static FromMesh(e,t,i){t||(t=e.name);const n=new h(t,i,e.getScene());return n.setPositions(e.getVerticesData(o.o.PositionKind)),e.isVerticesDataPresent(o.o.NormalKind)&&n.setNormals(e.getVerticesData(o.o.NormalKind)),e.isVerticesDataPresent(o.o.TangentKind)&&n.setTangents(e.getVerticesData(o.o.TangentKind)),e.isVerticesDataPresent(o.o.UVKind)&&n.setUVs(e.getVerticesData(o.o.UVKind)),n}}(0,n.gn)([(0,a.qC)()],h.prototype,"id",void 0)},4702:(e,t,i)=>{i.d(t,{O:()=>l});var n=i(5363),s=i(2722),r=i(1431),o=i(7780),a=i(3324);class l{set areUpdatesFrozen(e){e?this._blockCounter++:(this._blockCounter--,this._blockCounter<=0&&(this._blockCounter=0,this._syncActiveTargets(!0)))}get areUpdatesFrozen(){return this._blockCounter>0}constructor(e=null){if(this._targets=new Array,this._targetInfluenceChangedObservers=new Array,this._targetDataLayoutChangedObservers=new Array,this._activeTargets=new n.t(16),this._supportsNormals=!1,this._supportsTangents=!1,this._supportsUVs=!1,this._vertexCount=0,this._textureVertexStride=0,this._textureWidth=0,this._textureHeight=1,this._uniqueId=0,this._tempInfluences=new Array,this._canUseTextureForTargets=!1,this._blockCounter=0,this._parentContainer=null,this.optimizeInfluencers=!0,this.enableNormalMorphing=!0,this.enableTangentMorphing=!0,this.enableUVMorphing=!0,this._useTextureToStoreTargets=!0,e||(e=r.l.LastCreatedScene),this._scene=e,this._scene){this._scene.addMorphTargetManager(this),this._uniqueId=this._scene.getUniqueId();const e=this._scene.getEngine().getCaps();this._canUseTextureForTargets=e.canUseGLVertexID&&e.textureFloat&&e.maxVertexTextureImageUnits>0&&e.texture2DArrayMaxLayerCount>1}}get uniqueId(){return this._uniqueId}get vertexCount(){return this._vertexCount}get supportsNormals(){return this._supportsNormals&&this.enableNormalMorphing}get supportsTangents(){return this._supportsTangents&&this.enableTangentMorphing}get supportsUVs(){return this._supportsUVs&&this.enableUVMorphing}get numTargets(){return this._targets.length}get numInfluencers(){return this._activeTargets.length}get influences(){return this._influences}get useTextureToStoreTargets(){return this._useTextureToStoreTargets}set useTextureToStoreTargets(e){this._useTextureToStoreTargets=e}get isUsingTextureForTargets(){var e;return l.EnableTextureStorage&&this.useTextureToStoreTargets&&this._canUseTextureForTargets&&!(null===(e=this._scene)||void 0===e?void 0:e.getEngine().getCaps().disableMorphTargetTexture)}getActiveTarget(e){return this._activeTargets.data[e]}getTarget(e){return this._targets[e]}addTarget(e){this._targets.push(e),this._targetInfluenceChangedObservers.push(e.onInfluenceChanged.add((e=>{this._syncActiveTargets(e)}))),this._targetDataLayoutChangedObservers.push(e._onDataLayoutChanged.add((()=>{this._syncActiveTargets(!0)}))),this._syncActiveTargets(!0)}removeTarget(e){const t=this._targets.indexOf(e);t>=0&&(this._targets.splice(t,1),e.onInfluenceChanged.remove(this._targetInfluenceChangedObservers.splice(t,1)[0]),e._onDataLayoutChanged.remove(this._targetDataLayoutChangedObservers.splice(t,1)[0]),this._syncActiveTargets(!0)),this._scene&&this._scene.stopAnimation(e)}_bind(e){e.setFloat3("morphTargetTextureInfo",this._textureVertexStride,this._textureWidth,this._textureHeight),e.setFloatArray("morphTargetTextureIndices",this._morphTargetTextureIndices),e.setTexture("morphTargets",this._targetStoreTexture)}clone(){const e=new l(this._scene);for(const t of this._targets)e.addTarget(t.clone());return e.enableNormalMorphing=this.enableNormalMorphing,e.enableTangentMorphing=this.enableTangentMorphing,e.enableUVMorphing=this.enableUVMorphing,e}serialize(){const e={};e.id=this.uniqueId,e.targets=[];for(const t of this._targets)e.targets.push(t.serialize());return e}_syncActiveTargets(e){if(this.areUpdatesFrozen)return;let t=0;this._activeTargets.reset(),this._supportsNormals=!0,this._supportsTangents=!0,this._supportsUVs=!0,this._vertexCount=0,this._scene&&this._targets.length>this._scene.getEngine().getCaps().texture2DArrayMaxLayerCount&&(this.useTextureToStoreTargets=!1),this._morphTargetTextureIndices&&this._morphTargetTextureIndices.length===this._targets.length||(this._morphTargetTextureIndices=new Float32Array(this._targets.length));let i=-1;for(const e of this._targets){if(i++,0===e.influence&&this.optimizeInfluencers)continue;if(this._activeTargets.length>=l.MaxActiveMorphTargetsInVertexAttributeMode&&!this.isUsingTextureForTargets)break;this._activeTargets.push(e),this._morphTargetTextureIndices[t]=i,this._tempInfluences[t++]=e.influence,this._supportsNormals=this._supportsNormals&&e.hasNormals,this._supportsTangents=this._supportsTangents&&e.hasTangents,this._supportsUVs=this._supportsUVs&&e.hasUVs;const n=e.getPositions();if(n){const e=n.length/3;if(0===this._vertexCount)this._vertexCount=e;else if(this._vertexCount!==e)return void s.Y.Error("Incompatible target. Targets must all have the same vertices count.")}}this._influences&&this._influences.length===t||(this._influences=new Float32Array(t));for(let e=0;e<t;e++)this._influences[e]=this._tempInfluences[e];e&&this.synchronize()}synchronize(){if(this._scene&&!this.areUpdatesFrozen){if(this.isUsingTextureForTargets&&this._vertexCount){this._textureVertexStride=1,this._supportsNormals&&this._textureVertexStride++,this._supportsTangents&&this._textureVertexStride++,this._supportsUVs&&this._textureVertexStride++,this._textureWidth=this._vertexCount*this._textureVertexStride,this._textureHeight=1;const e=this._scene.getEngine().getCaps().maxTextureSize;this._textureWidth>e&&(this._textureHeight=Math.ceil(this._textureWidth/e),this._textureWidth=e);let t=!0;if(this._targetStoreTexture){const e=this._targetStoreTexture.getSize();e.width===this._textureWidth&&e.height===this._textureHeight&&this._targetStoreTexture.depth===this._targets.length&&(t=!1)}if(t){this._targetStoreTexture&&this._targetStoreTexture.dispose();const e=this._targets.length,t=new Float32Array(e*this._textureWidth*this._textureHeight*4);let i=0;for(let n=0;n<e;n++){const e=this._targets[n],r=e.getPositions(),o=e.getNormals(),a=e.getUVs(),l=e.getTangents();if(!r)return void(0===n&&s.Y.Error("Invalid morph target. Target must have positions."));i=n*this._textureWidth*this._textureHeight*4;for(let e=0;e<this._vertexCount;e++)t[i]=r[3*e],t[i+1]=r[3*e+1],t[i+2]=r[3*e+2],i+=4,o&&(t[i]=o[3*e],t[i+1]=o[3*e+1],t[i+2]=o[3*e+2],i+=4),a&&(t[i]=a[2*e],t[i+1]=a[2*e+1],i+=4),l&&(t[i]=l[3*e],t[i+1]=l[3*e+1],t[i+2]=l[3*e+2],i+=4)}this._targetStoreTexture=a.e.CreateRGBATexture(t,this._textureWidth,this._textureHeight,e,this._scene,!1,!1,1,1)}}for(const e of this._scene.meshes)e.morphTargetManager===this&&e._syncGeometryWithMorphTargetManager()}}dispose(){if(this._targetStoreTexture&&this._targetStoreTexture.dispose(),this._targetStoreTexture=null,this._scene){if(this._scene.removeMorphTargetManager(this),this._parentContainer){const e=this._parentContainer.morphTargetManagers.indexOf(this);e>-1&&this._parentContainer.morphTargetManagers.splice(e,1),this._parentContainer=null}for(const e of this._targets)this._scene.stopAnimation(e)}}static Parse(e,t){const i=new l(t);i._uniqueId=e.id;for(const n of e.targets)i.addTarget(o.Y.Parse(n,t));return i}}l.EnableTextureStorage=!0,l.MaxActiveMorphTargetsInVertexAttributeMode=8},1499:(e,t,i)=>{i.d(t,{S:()=>o});var n=i(6387),s=i(4141),r=i(1128);class o{constructor(){this.direction1=new s.P(0,1,0),this.direction2=new s.P(0,1,0),this.minEmitBox=new s.P(-.5,-.5,-.5),this.maxEmitBox=new s.P(.5,.5,.5)}startDirectionFunction(e,t,i,n){const o=r.R.RandomRange(this.direction1.x,this.direction2.x),a=r.R.RandomRange(this.direction1.y,this.direction2.y),l=r.R.RandomRange(this.direction1.z,this.direction2.z);if(n)return t.x=o,t.y=a,void(t.z=l);s.P.TransformNormalFromFloatsToRef(o,a,l,e,t)}startPositionFunction(e,t,i,n){const o=r.R.RandomRange(this.minEmitBox.x,this.maxEmitBox.x),a=r.R.RandomRange(this.minEmitBox.y,this.maxEmitBox.y),l=r.R.RandomRange(this.minEmitBox.z,this.maxEmitBox.z);if(n)return t.x=o,t.y=a,void(t.z=l);s.P.TransformCoordinatesFromFloatsToRef(o,a,l,e,t)}clone(){const e=new o;return n.j.DeepCopy(this,e),e}applyToShader(e){e.setVector3("direction1",this.direction1),e.setVector3("direction2",this.direction2),e.setVector3("minEmitBox",this.minEmitBox),e.setVector3("maxEmitBox",this.maxEmitBox)}buildUniformLayout(e){e.addUniform("direction1",3),e.addUniform("direction2",3),e.addUniform("minEmitBox",3),e.addUniform("maxEmitBox",3)}getEffectDefines(){return"#define BOXEMITTER"}getClassName(){return"BoxParticleEmitter"}serialize(){const e={};return e.type=this.getClassName(),e.direction1=this.direction1.asArray(),e.direction2=this.direction2.asArray(),e.minEmitBox=this.minEmitBox.asArray(),e.maxEmitBox=this.maxEmitBox.asArray(),e}parse(e){s.P.FromArrayToRef(e.direction1,0,this.direction1),s.P.FromArrayToRef(e.direction2,0,this.direction2),s.P.FromArrayToRef(e.minEmitBox,0,this.minEmitBox),s.P.FromArrayToRef(e.maxEmitBox,0,this.maxEmitBox)}}},5098:(e,t,i)=>{i.d(t,{E:()=>r});var n=i(6387),s=i(4141);class r{constructor(){this.particlePositionGenerator=()=>{},this.particleDestinationGenerator=()=>{}}startDirectionFunction(e,t,i,n){const r=s.jp.Vector3[0];if(this.particleDestinationGenerator){this.particleDestinationGenerator(-1,i,r);const e=s.jp.Vector3[1];r.subtractToRef(i.position,e),e.scaleToRef(1/i.lifeTime,r)}else r.set(0,0,0);n?t.copyFrom(r):s.P.TransformNormalToRef(r,e,t)}startPositionFunction(e,t,i,n){const r=s.jp.Vector3[0];this.particlePositionGenerator?this.particlePositionGenerator(-1,i,r):r.set(0,0,0),n?t.copyFrom(r):s.P.TransformCoordinatesToRef(r,e,t)}clone(){const e=new r;return n.j.DeepCopy(this,e),e}applyToShader(e){}buildUniformLayout(e){}getEffectDefines(){return"#define CUSTOMEMITTER"}getClassName(){return"CustomParticleEmitter"}serialize(){const e={};return e.type=this.getClassName(),e}parse(e){}}},5089:(e,t,i)=>{i.d(t,{S3:()=>n.S,LV:()=>a,E0:()=>f.E,z:()=>h,kT:()=>l,VD:()=>c,F3:()=>m,cl:()=>u,cE:()=>p,Ai:()=>d});var n=i(1499),s=i(6387),r=i(4141),o=i(1128);class a{get radius(){return this._radius}set radius(e){this._radius=e,this._buildHeight()}get angle(){return this._angle}set angle(e){this._angle=e,this._buildHeight()}_buildHeight(){0!==this._angle?this._height=this._radius/Math.tan(this._angle/2):this._height=1}constructor(e=1,t=Math.PI,i=0){this.directionRandomizer=i,this.radiusRange=1,this.heightRange=1,this.emitFromSpawnPointOnly=!1,this.angle=t,this.radius=e}startDirectionFunction(e,t,i,n){n?r.jp.Vector3[0].copyFrom(i._localPosition).normalize():i.position.subtractToRef(e.getTranslation(),r.jp.Vector3[0]).normalize();const s=o.R.RandomRange(0,this.directionRandomizer),a=o.R.RandomRange(0,this.directionRandomizer),l=o.R.RandomRange(0,this.directionRandomizer);t.x=r.jp.Vector3[0].x+s,t.y=r.jp.Vector3[0].y+a,t.z=r.jp.Vector3[0].z+l,t.normalize()}startPositionFunction(e,t,i,n){const s=o.R.RandomRange(0,2*Math.PI);let a;this.emitFromSpawnPointOnly?a=1e-4:(a=o.R.RandomRange(0,this.heightRange),a=1-a*a);let l=this._radius-o.R.RandomRange(0,this._radius*this.radiusRange);l*=a;const h=l*Math.sin(s),c=l*Math.cos(s),u=a*this._height;if(n)return t.x=h,t.y=u,void(t.z=c);r.P.TransformCoordinatesFromFloatsToRef(h,u,c,e,t)}clone(){const e=new a(this._radius,this._angle,this.directionRandomizer);return s.j.DeepCopy(this,e),e}applyToShader(e){e.setFloat2("radius",this._radius,this.radiusRange),e.setFloat("coneAngle",this._angle),e.setFloat2("height",this._height,this.heightRange),e.setFloat("directionRandomizer",this.directionRandomizer)}buildUniformLayout(e){e.addUniform("radius",2),e.addUniform("coneAngle",1),e.addUniform("height",2),e.addUniform("directionRandomizer",1)}getEffectDefines(){let e="#define CONEEMITTER";return this.emitFromSpawnPointOnly&&(e+="\n#define CONEEMITTERSPAWNPOINT"),e}getClassName(){return"ConeParticleEmitter"}serialize(){const e={};return e.type=this.getClassName(),e.radius=this._radius,e.angle=this._angle,e.directionRandomizer=this.directionRandomizer,e.radiusRange=this.radiusRange,e.heightRange=this.heightRange,e.emitFromSpawnPointOnly=this.emitFromSpawnPointOnly,e}parse(e){this.radius=e.radius,this.angle=e.angle,this.directionRandomizer=e.directionRandomizer,this.radiusRange=void 0!==e.radiusRange?e.radiusRange:1,this.heightRange=void 0!==e.radiusRange?e.heightRange:1,this.emitFromSpawnPointOnly=void 0!==e.emitFromSpawnPointOnly&&e.emitFromSpawnPointOnly}}class l{constructor(e=1,t=1,i=1,n=0){this.radius=e,this.height=t,this.radiusRange=i,this.directionRandomizer=n,this._tempVector=r.P.Zero()}startDirectionFunction(e,t,i,n,s){i.position.subtractToRef(e.getTranslation(),this._tempVector),this._tempVector.normalize(),r.P.TransformNormalToRef(this._tempVector,s,this._tempVector);const a=o.R.RandomRange(-this.directionRandomizer/2,this.directionRandomizer/2);let l=Math.atan2(this._tempVector.x,this._tempVector.z);l+=o.R.RandomRange(-Math.PI/2,Math.PI/2)*this.directionRandomizer,this._tempVector.y=a,this._tempVector.x=Math.sin(l),this._tempVector.z=Math.cos(l),this._tempVector.normalize(),n?t.copyFrom(this._tempVector):r.P.TransformNormalFromFloatsToRef(this._tempVector.x,this._tempVector.y,this._tempVector.z,e,t)}startPositionFunction(e,t,i,n){const s=o.R.RandomRange(-this.height/2,this.height/2),a=o.R.RandomRange(0,2*Math.PI),l=o.R.RandomRange((1-this.radiusRange)*(1-this.radiusRange),1),h=Math.sqrt(l)*this.radius,c=h*Math.cos(a),u=h*Math.sin(a);n?t.copyFromFloats(c,s,u):r.P.TransformCoordinatesFromFloatsToRef(c,s,u,e,t)}clone(){const e=new l(this.radius,this.directionRandomizer);return s.j.DeepCopy(this,e),e}applyToShader(e){e.setFloat("radius",this.radius),e.setFloat("height",this.height),e.setFloat("radiusRange",this.radiusRange),e.setFloat("directionRandomizer",this.directionRandomizer)}buildUniformLayout(e){e.addUniform("radius",1),e.addUniform("height",1),e.addUniform("radiusRange",1),e.addUniform("directionRandomizer",1)}getEffectDefines(){return"#define CYLINDEREMITTER"}getClassName(){return"CylinderParticleEmitter"}serialize(){const e={};return e.type=this.getClassName(),e.radius=this.radius,e.height=this.height,e.radiusRange=this.radiusRange,e.directionRandomizer=this.directionRandomizer,e}parse(e){this.radius=e.radius,this.height=e.height,this.radiusRange=e.radiusRange,this.directionRandomizer=e.directionRandomizer}}class h extends l{constructor(e=1,t=1,i=1,n=new r.P(0,1,0),s=new r.P(0,1,0)){super(e,t,i),this.direction1=n,this.direction2=s}startDirectionFunction(e,t){const i=o.R.RandomRange(this.direction1.x,this.direction2.x),n=o.R.RandomRange(this.direction1.y,this.direction2.y),s=o.R.RandomRange(this.direction1.z,this.direction2.z);r.P.TransformNormalFromFloatsToRef(i,n,s,e,t)}clone(){const e=new h(this.radius,this.height,this.radiusRange,this.direction1,this.direction2);return s.j.DeepCopy(this,e),e}applyToShader(e){e.setFloat("radius",this.radius),e.setFloat("height",this.height),e.setFloat("radiusRange",this.radiusRange),e.setVector3("direction1",this.direction1),e.setVector3("direction2",this.direction2)}buildUniformLayout(e){e.addUniform("radius",1),e.addUniform("height",1),e.addUniform("radiusRange",1),e.addUniform("direction1",3),e.addUniform("direction2",3)}getEffectDefines(){return"#define CYLINDEREMITTER\n#define DIRECTEDCYLINDEREMITTER"}getClassName(){return"CylinderDirectedParticleEmitter"}serialize(){const e=super.serialize();return e.direction1=this.direction1.asArray(),e.direction2=this.direction2.asArray(),e}parse(e){super.parse(e),this.direction1.copyFrom(e.direction1),this.direction2.copyFrom(e.direction2)}}class c{constructor(e=1,t=1,i=0){this.radius=e,this.radiusRange=t,this.directionRandomizer=i}startDirectionFunction(e,t,i,n){const s=i.position.subtract(e.getTranslation()).normalize(),a=o.R.RandomRange(0,this.directionRandomizer),l=o.R.RandomRange(0,this.directionRandomizer),h=o.R.RandomRange(0,this.directionRandomizer);s.x+=a,s.y+=l,s.z+=h,s.normalize(),n?t.copyFrom(s):r.P.TransformNormalFromFloatsToRef(s.x,s.y,s.z,e,t)}startPositionFunction(e,t,i,n){const s=this.radius-o.R.RandomRange(0,this.radius*this.radiusRange),a=o.R.RandomRange(0,1),l=o.R.RandomRange(0,2*Math.PI),h=Math.acos(2*a-1),c=s*Math.cos(l)*Math.sin(h),u=s*Math.cos(h),d=s*Math.sin(l)*Math.sin(h);n?t.copyFromFloats(c,Math.abs(u),d):r.P.TransformCoordinatesFromFloatsToRef(c,Math.abs(u),d,e,t)}clone(){const e=new c(this.radius,this.directionRandomizer);return s.j.DeepCopy(this,e),e}applyToShader(e){e.setFloat("radius",this.radius),e.setFloat("radiusRange",this.radiusRange),e.setFloat("directionRandomizer",this.directionRandomizer)}buildUniformLayout(e){e.addUniform("radius",1),e.addUniform("radiusRange",1),e.addUniform("directionRandomizer",1)}getEffectDefines(){return"#define HEMISPHERICEMITTER"}getClassName(){return"HemisphericParticleEmitter"}serialize(){const e={};return e.type=this.getClassName(),e.radius=this.radius,e.radiusRange=this.radiusRange,e.directionRandomizer=this.directionRandomizer,e}parse(e){this.radius=e.radius,this.radiusRange=e.radiusRange,this.directionRandomizer=e.directionRandomizer}}class u{constructor(){this.direction1=new r.P(0,1,0),this.direction2=new r.P(0,1,0)}startDirectionFunction(e,t,i,n){const s=o.R.RandomRange(this.direction1.x,this.direction2.x),a=o.R.RandomRange(this.direction1.y,this.direction2.y),l=o.R.RandomRange(this.direction1.z,this.direction2.z);n?t.copyFromFloats(s,a,l):r.P.TransformNormalFromFloatsToRef(s,a,l,e,t)}startPositionFunction(e,t,i,n){n?t.copyFromFloats(0,0,0):r.P.TransformCoordinatesFromFloatsToRef(0,0,0,e,t)}clone(){const e=new u;return s.j.DeepCopy(this,e),e}applyToShader(e){e.setVector3("direction1",this.direction1),e.setVector3("direction2",this.direction2)}buildUniformLayout(e){e.addUniform("direction1",3),e.addUniform("direction2",3)}getEffectDefines(){return"#define POINTEMITTER"}getClassName(){return"PointParticleEmitter"}serialize(){const e={};return e.type=this.getClassName(),e.direction1=this.direction1.asArray(),e.direction2=this.direction2.asArray(),e}parse(e){r.P.FromArrayToRef(e.direction1,0,this.direction1),r.P.FromArrayToRef(e.direction2,0,this.direction2)}}class d{constructor(e=1,t=1,i=0){this.radius=e,this.radiusRange=t,this.directionRandomizer=i}startDirectionFunction(e,t,i,n){const s=i.position.subtract(e.getTranslation()).normalize(),a=o.R.RandomRange(0,this.directionRandomizer),l=o.R.RandomRange(0,this.directionRandomizer),h=o.R.RandomRange(0,this.directionRandomizer);s.x+=a,s.y+=l,s.z+=h,s.normalize(),n?t.copyFrom(s):r.P.TransformNormalFromFloatsToRef(s.x,s.y,s.z,e,t)}startPositionFunction(e,t,i,n){const s=this.radius-o.R.RandomRange(0,this.radius*this.radiusRange),a=o.R.RandomRange(0,1),l=o.R.RandomRange(0,2*Math.PI),h=Math.acos(2*a-1),c=s*Math.cos(l)*Math.sin(h),u=s*Math.cos(h),d=s*Math.sin(l)*Math.sin(h);n?t.copyFromFloats(c,u,d):r.P.TransformCoordinatesFromFloatsToRef(c,u,d,e,t)}clone(){const e=new d(this.radius,this.directionRandomizer);return s.j.DeepCopy(this,e),e}applyToShader(e){e.setFloat("radius",this.radius),e.setFloat("radiusRange",this.radiusRange),e.setFloat("directionRandomizer",this.directionRandomizer)}buildUniformLayout(e){e.addUniform("radius",1),e.addUniform("radiusRange",1),e.addUniform("directionRandomizer",1)}getEffectDefines(){return"#define SPHEREEMITTER"}getClassName(){return"SphereParticleEmitter"}serialize(){const e={};return e.type=this.getClassName(),e.radius=this.radius,e.radiusRange=this.radiusRange,e.directionRandomizer=this.directionRandomizer,e}parse(e){this.radius=e.radius,this.radiusRange=e.radiusRange,this.directionRandomizer=e.directionRandomizer}}class p extends d{constructor(e=1,t=new r.P(0,1,0),i=new r.P(0,1,0)){super(e),this.direction1=t,this.direction2=i}startDirectionFunction(e,t){const i=o.R.RandomRange(this.direction1.x,this.direction2.x),n=o.R.RandomRange(this.direction1.y,this.direction2.y),s=o.R.RandomRange(this.direction1.z,this.direction2.z);r.P.TransformNormalFromFloatsToRef(i,n,s,e,t)}clone(){const e=new p(this.radius,this.direction1,this.direction2);return s.j.DeepCopy(this,e),e}applyToShader(e){e.setFloat("radius",this.radius),e.setFloat("radiusRange",this.radiusRange),e.setVector3("direction1",this.direction1),e.setVector3("direction2",this.direction2)}buildUniformLayout(e){e.addUniform("radius",1),e.addUniform("radiusRange",1),e.addUniform("direction1",3),e.addUniform("direction2",3)}getEffectDefines(){return"#define SPHEREEMITTER\n#define DIRECTEDSPHEREEMITTER"}getClassName(){return"SphereDirectedParticleEmitter"}serialize(){const e=super.serialize();return e.direction1=this.direction1.asArray(),e.direction2=this.direction2.asArray(),e}parse(e){super.parse(e),this.direction1.copyFrom(e.direction1),this.direction2.copyFrom(e.direction2)}}var f=i(5098),_=i(708);class m{get mesh(){return this._mesh}set mesh(e){this._mesh!==e&&(this._mesh=e,e?(this._indices=e.getIndices(),this._positions=e.getVerticesData(_.o.PositionKind),this._normals=e.getVerticesData(_.o.NormalKind)):(this._indices=null,this._positions=null,this._normals=null))}constructor(e=null){this._indices=null,this._positions=null,this._normals=null,this._storedNormal=r.P.Zero(),this._mesh=null,this.direction1=new r.P(0,1,0),this.direction2=new r.P(0,1,0),this.useMeshNormalsForDirection=!0,this.mesh=e}startDirectionFunction(e,t,i,n){if(this.useMeshNormalsForDirection&&this._normals)return void r.P.TransformNormalToRef(this._storedNormal,e,t);const s=o.R.RandomRange(this.direction1.x,this.direction2.x),a=o.R.RandomRange(this.direction1.y,this.direction2.y),l=o.R.RandomRange(this.direction1.z,this.direction2.z);n?t.copyFromFloats(s,a,l):r.P.TransformNormalFromFloatsToRef(s,a,l,e,t)}startPositionFunction(e,t,i,n){if(!this._indices||!this._positions)return;const s=3*Math.random()*(this._indices.length/3)|0,o=Math.random(),a=Math.random()*(1-o),l=1-o-a,h=this._indices[s],c=this._indices[s+1],u=this._indices[s+2],d=r.jp.Vector3[0],p=r.jp.Vector3[1],f=r.jp.Vector3[2],_=r.jp.Vector3[3];r.P.FromArrayToRef(this._positions,3*h,d),r.P.FromArrayToRef(this._positions,3*c,p),r.P.FromArrayToRef(this._positions,3*u,f),_.x=o*d.x+a*p.x+l*f.x,_.y=o*d.y+a*p.y+l*f.y,_.z=o*d.z+a*p.z+l*f.z,n?t.copyFromFloats(_.x,_.y,_.z):r.P.TransformCoordinatesFromFloatsToRef(_.x,_.y,_.z,e,t),this.useMeshNormalsForDirection&&this._normals&&(r.P.FromArrayToRef(this._normals,3*h,d),r.P.FromArrayToRef(this._normals,3*c,p),r.P.FromArrayToRef(this._normals,3*u,f),this._storedNormal.x=o*d.x+a*p.x+l*f.x,this._storedNormal.y=o*d.y+a*p.y+l*f.y,this._storedNormal.z=o*d.z+a*p.z+l*f.z)}clone(){const e=new m(this.mesh);return s.j.DeepCopy(this,e),e}applyToShader(e){e.setVector3("direction1",this.direction1),e.setVector3("direction2",this.direction2)}buildUniformLayout(e){e.addUniform("direction1",3),e.addUniform("direction2",3)}getEffectDefines(){return""}getClassName(){return"MeshParticleEmitter"}serialize(){var e;const t={};return t.type=this.getClassName(),t.direction1=this.direction1.asArray(),t.direction2=this.direction2.asArray(),t.meshId=null===(e=this.mesh)||void 0===e?void 0:e.id,t.useMeshNormalsForDirection=this.useMeshNormalsForDirection,t}parse(e,t){r.P.FromArrayToRef(e.direction1,0,this.direction1),r.P.FromArrayToRef(e.direction2,0,this.direction2),e.meshId&&t&&(this.mesh=t.getLastMeshById(e.meshId)),this.useMeshNormalsForDirection=e.useMeshNormalsForDirection}}},5753:(e,t,i)=>{i.d(t,{U:()=>a});var n=i(4141),s=i(4475),r=i(5089),o=i(4649);i(3742);class a{get noiseTexture(){return this._noiseTexture}set noiseTexture(e){this._noiseTexture!==e&&(this._noiseTexture=e,this._reset())}get isAnimationSheetEnabled(){return this._isAnimationSheetEnabled}set isAnimationSheetEnabled(e){this._isAnimationSheetEnabled!=e&&(this._isAnimationSheetEnabled=e,this._reset())}get useLogarithmicDepth(){return this._useLogarithmicDepth}set useLogarithmicDepth(e){this._useLogarithmicDepth=e&&this.getScene().getEngine().getCaps().fragmentDepthSupported}getScene(){return this._scene}_hasTargetStopDurationDependantGradient(){return this._startSizeGradients&&this._startSizeGradients.length>0||this._emitRateGradients&&this._emitRateGradients.length>0||this._lifeTimeGradients&&this._lifeTimeGradients.length>0}getDragGradients(){return this._dragGradients}getLimitVelocityGradients(){return this._limitVelocityGradients}getColorGradients(){return this._colorGradients}getSizeGradients(){return this._sizeGradients}getColorRemapGradients(){return this._colorRemapGradients}getAlphaRemapGradients(){return this._alphaRemapGradients}getLifeTimeGradients(){return this._lifeTimeGradients}getAngularSpeedGradients(){return this._angularSpeedGradients}getVelocityGradients(){return this._velocityGradients}getStartSizeGradients(){return this._startSizeGradients}getEmitRateGradients(){return this._emitRateGradients}get direction1(){return this.particleEmitterType.direction1?this.particleEmitterType.direction1:n.P.Zero()}set direction1(e){this.particleEmitterType.direction1&&(this.particleEmitterType.direction1=e)}get direction2(){return this.particleEmitterType.direction2?this.particleEmitterType.direction2:n.P.Zero()}set direction2(e){this.particleEmitterType.direction2&&(this.particleEmitterType.direction2=e)}get minEmitBox(){return this.particleEmitterType.minEmitBox?this.particleEmitterType.minEmitBox:n.P.Zero()}set minEmitBox(e){this.particleEmitterType.minEmitBox&&(this.particleEmitterType.minEmitBox=e)}get maxEmitBox(){return this.particleEmitterType.maxEmitBox?this.particleEmitterType.maxEmitBox:n.P.Zero()}set maxEmitBox(e){this.particleEmitterType.maxEmitBox&&(this.particleEmitterType.maxEmitBox=e)}get billboardMode(){return this._billboardMode}set billboardMode(e){this._billboardMode!==e&&(this._billboardMode=e,this._reset())}get isBillboardBased(){return this._isBillboardBased}set isBillboardBased(e){this._isBillboardBased!==e&&(this._isBillboardBased=e,this._reset())}get imageProcessingConfiguration(){return this._imageProcessingConfiguration}set imageProcessingConfiguration(e){this._attachImageProcessingConfiguration(e)}_attachImageProcessingConfiguration(e){e!==this._imageProcessingConfiguration&&(!e&&this._scene?this._imageProcessingConfiguration=this._scene.imageProcessingConfiguration:this._imageProcessingConfiguration=e)}_reset(){}_removeGradientAndTexture(e,t,i){if(!t)return this;let n=0;for(const i of t){if(i.gradient===e){t.splice(n,1);break}n++}return i&&i.dispose(),this}constructor(e){this.animations=[],this.renderingGroupId=0,this.emitter=n.P.Zero(),this.emitRate=10,this.manualEmitCount=-1,this.updateSpeed=.01,this.targetStopDuration=0,this.disposeOnStop=!1,this.minEmitPower=1,this.maxEmitPower=1,this.minLifeTime=1,this.maxLifeTime=1,this.minSize=1,this.maxSize=1,this.minScaleX=1,this.maxScaleX=1,this.minScaleY=1,this.maxScaleY=1,this.minInitialRotation=0,this.maxInitialRotation=0,this.minAngularSpeed=0,this.maxAngularSpeed=0,this.layerMask=268435455,this.customShader=null,this.preventAutoStart=!1,this._wasDispatched=!1,this._rootUrl="",this.noiseStrength=new n.P(10,10,10),this.onAnimationEnd=null,this.blendMode=a.BLENDMODE_ONEONE,this.forceDepthWrite=!1,this.preWarmCycles=0,this.preWarmStepOffset=1,this.spriteCellChangeSpeed=1,this.startSpriteCellID=0,this.endSpriteCellID=0,this.spriteCellWidth=0,this.spriteCellHeight=0,this.spriteCellLoop=!0,this.spriteRandomStartCell=!1,this.translationPivot=new n.FM(0,0),this.beginAnimationOnStart=!1,this.beginAnimationFrom=0,this.beginAnimationTo=60,this.beginAnimationLoop=!1,this.worldOffset=new n.P(0,0,0),this._useLogarithmicDepth=!1,this.gravity=n.P.Zero(),this._colorGradients=null,this._sizeGradients=null,this._lifeTimeGradients=null,this._angularSpeedGradients=null,this._velocityGradients=null,this._limitVelocityGradients=null,this._dragGradients=null,this._emitRateGradients=null,this._startSizeGradients=null,this._rampGradients=null,this._colorRemapGradients=null,this._alphaRemapGradients=null,this.startDelay=0,this.limitVelocityDamping=.4,this.color1=new o.HE(1,1,1,1),this.color2=new o.HE(1,1,1,1),this.colorDead=new o.HE(0,0,0,1),this.textureMask=new o.HE(1,1,1,1),this._isSubEmitter=!1,this._billboardMode=7,this._isBillboardBased=!0,this._imageProcessingConfigurationDefines=new s.b,this.id=e,this.name=e}createPointEmitter(e,t){const i=new r.cl;return i.direction1=e,i.direction2=t,this.particleEmitterType=i,i}createHemisphericEmitter(e=1,t=1){const i=new r.VD(e,t);return this.particleEmitterType=i,i}createSphereEmitter(e=1,t=1){const i=new r.Ai(e,t);return this.particleEmitterType=i,i}createDirectedSphereEmitter(e=1,t=new n.P(0,1,0),i=new n.P(0,1,0)){const s=new r.cE(e,t,i);return this.particleEmitterType=s,s}createCylinderEmitter(e=1,t=1,i=1,n=0){const s=new r.kT(e,t,i,n);return this.particleEmitterType=s,s}createDirectedCylinderEmitter(e=1,t=1,i=1,s=new n.P(0,1,0),o=new n.P(0,1,0)){const a=new r.z(e,t,i,s,o);return this.particleEmitterType=a,a}createConeEmitter(e=1,t=Math.PI/4){const i=new r.LV(e,t);return this.particleEmitterType=i,i}createBoxEmitter(e,t,i,n){const s=new r.S3;return this.particleEmitterType=s,this.direction1=e,this.direction2=t,this.minEmitBox=i,this.maxEmitBox=n,s}}a.BLENDMODE_ONEONE=0,a.BLENDMODE_STANDARD=1,a.BLENDMODE_ADD=2,a.BLENDMODE_MULTIPLY=3,a.BLENDMODE_MULTIPLYADD=4},4453:(e,t,i)=>{i.d(t,{d:()=>s});var n=i(4141);class s{constructor(){this._hasHit=!1,this._hitDistance=0,this._hitNormalWorld=n.P.Zero(),this._hitPointWorld=n.P.Zero(),this._rayFromWorld=n.P.Zero(),this._rayToWorld=n.P.Zero()}get hasHit(){return this._hasHit}get hitDistance(){return this._hitDistance}get hitNormalWorld(){return this._hitNormalWorld}get hitPointWorld(){return this._hitPointWorld}get rayFromWorld(){return this._rayFromWorld}get rayToWorld(){return this._rayToWorld}setHitData(e,t){this._hasHit=!0,this._hitNormalWorld.set(e.x,e.y,e.z),this._hitPointWorld.set(t.x,t.y,t.z)}setHitDistance(e){this._hitDistance=e}calculateHitDistance(){this._hitDistance=n.P.Distance(this._rayFromWorld,this._hitPointWorld)}reset(e=n.P.Zero(),t=n.P.Zero()){this._rayFromWorld.copyFrom(e),this._rayToWorld.copyFrom(t),this._hasHit=!1,this._hitDistance=0,this._hitNormalWorld.setAll(0),this._hitPointWorld.setAll(0)}}},934:(e,t,i)=>{i.d(t,{T:()=>r});var n=i(4141),s=i(4934);class r{getPluginVersion(){return this._physicsPlugin.getPluginVersion()}static DefaultPluginFactory(){throw(0,s.S)("CannonJSPlugin")}constructor(e,t=r.DefaultPluginFactory()){if(this._physicsPlugin=t,this._impostors=[],this._joints=[],this._subTimeStep=0,this._uniqueIdCounter=0,!this._physicsPlugin.isSupported())throw new Error("Physics Engine "+this._physicsPlugin.name+" cannot be found. Please make sure it is included.");e=e||new n.P(0,-9.807,0),this.setGravity(e),this.setTimeStep()}setGravity(e){this.gravity=e,this._physicsPlugin.setGravity(this.gravity)}setTimeStep(e=1/60){this._physicsPlugin.setTimeStep(e)}getTimeStep(){return this._physicsPlugin.getTimeStep()}setSubTimeStep(e=0){this._subTimeStep=e}getSubTimeStep(){return this._subTimeStep}dispose(){this._impostors.forEach((function(e){e.dispose()})),this._physicsPlugin.dispose()}getPhysicsPluginName(){return this._physicsPlugin.name}addImpostor(e){this._impostors.push(e),e.uniqueId=this._uniqueIdCounter++,e.parent||this._physicsPlugin.generatePhysicsBody(e)}removeImpostor(e){const t=this._impostors.indexOf(e);t>-1&&this._impostors.splice(t,1).length&&this.getPhysicsPlugin().removePhysicsBody(e)}addJoint(e,t,i){const n={mainImpostor:e,connectedImpostor:t,joint:i};i.physicsPlugin=this._physicsPlugin,this._joints.push(n),this._physicsPlugin.generateJoint(n)}removeJoint(e,t,i){const n=this._joints.filter((function(n){return n.connectedImpostor===t&&n.joint===i&&n.mainImpostor===e}));n.length&&this._physicsPlugin.removeJoint(n[0])}_step(e){this._impostors.forEach((e=>{e.isBodyInitRequired()&&this._physicsPlugin.generatePhysicsBody(e)})),e>.1?e=.1:e<=0&&(e=1/60),this._physicsPlugin.executeStep(e,this._impostors)}getPhysicsPlugin(){return this._physicsPlugin}getImpostors(){return this._impostors}getImpostorForPhysicsObject(e){for(let t=0;t<this._impostors.length;++t)if(this._impostors[t].object===e)return this._impostors[t];return null}getImpostorWithPhysicsBody(e){for(let t=0;t<this._impostors.length;++t)if(this._impostors[t].physicsBody===e)return this._impostors[t];return null}raycast(e,t){return this._physicsPlugin.raycast(e,t)}raycastToRef(e,t,i){return this._physicsPlugin.raycastToRef(e,t,i)}}},4389:(e,t,i)=>{i.d(t,{Q:()=>c});var n=i(2722),s=i(5860),r=i(4141),o=i(1795),a=i(4496),l=i(58),h=i(5203);a.Kj._PhysicsImpostorParser=function(e,t,i){return new c(t,i.physicsImpostor,{mass:i.physicsMass,friction:i.physicsFriction,restitution:i.physicsRestitution},e)};class c{get isDisposed(){return this._isDisposed}get mass(){return this._physicsEngine?this._physicsEngine.getPhysicsPlugin().getBodyMass(this):0}set mass(e){this.setMass(e)}get friction(){return this._physicsEngine?this._physicsEngine.getPhysicsPlugin().getBodyFriction(this):0}set friction(e){this._physicsEngine&&this._physicsEngine.getPhysicsPlugin().setBodyFriction(this,e)}get restitution(){return this._physicsEngine?this._physicsEngine.getPhysicsPlugin().getBodyRestitution(this):0}set restitution(e){this._physicsEngine&&this._physicsEngine.getPhysicsPlugin().setBodyRestitution(this,e)}get pressure(){if(!this._physicsEngine)return 0;const e=this._physicsEngine.getPhysicsPlugin();return e.setBodyPressure?e.getBodyPressure(this):0}set pressure(e){if(!this._physicsEngine)return;const t=this._physicsEngine.getPhysicsPlugin();t.setBodyPressure&&t.setBodyPressure(this,e)}get stiffness(){if(!this._physicsEngine)return 0;const e=this._physicsEngine.getPhysicsPlugin();return e.getBodyStiffness?e.getBodyStiffness(this):0}set stiffness(e){if(!this._physicsEngine)return;const t=this._physicsEngine.getPhysicsPlugin();t.setBodyStiffness&&t.setBodyStiffness(this,e)}get velocityIterations(){if(!this._physicsEngine)return 0;const e=this._physicsEngine.getPhysicsPlugin();return e.getBodyVelocityIterations?e.getBodyVelocityIterations(this):0}set velocityIterations(e){if(!this._physicsEngine)return;const t=this._physicsEngine.getPhysicsPlugin();t.setBodyVelocityIterations&&t.setBodyVelocityIterations(this,e)}get positionIterations(){if(!this._physicsEngine)return 0;const e=this._physicsEngine.getPhysicsPlugin();return e.getBodyPositionIterations?e.getBodyPositionIterations(this):0}set positionIterations(e){if(!this._physicsEngine)return;const t=this._physicsEngine.getPhysicsPlugin();t.setBodyPositionIterations&&t.setBodyPositionIterations(this,e)}constructor(e,t,i={mass:0},s){this.object=e,this.type=t,this._options=i,this._scene=s,this._pluginData={},this._bodyUpdateRequired=!1,this._onBeforePhysicsStepCallbacks=new Array,this._onAfterPhysicsStepCallbacks=new Array,this._onPhysicsCollideCallbacks=[],this._deltaPosition=r.P.Zero(),this._isDisposed=!1,this.soft=!1,this.segments=0,this._tmpQuat=new r._f,this._tmpQuat2=new r._f,this.beforeStep=()=>{this._physicsEngine&&(this.object.translate(this._deltaPosition,-1),this._deltaRotationConjugated&&this.object.rotationQuaternion&&this.object.rotationQuaternion.multiplyToRef(this._deltaRotationConjugated,this.object.rotationQuaternion),this.object.computeWorldMatrix(!1),this.object.parent&&this.object.rotationQuaternion?(this.getParentsRotation(),this._tmpQuat.multiplyToRef(this.object.rotationQuaternion,this._tmpQuat)):this._tmpQuat.copyFrom(this.object.rotationQuaternion||new r._f),this._options.disableBidirectionalTransformation||this.object.rotationQuaternion&&this._physicsEngine.getPhysicsPlugin().setPhysicsBodyTransformation(this,this.object.getAbsolutePosition(),this._tmpQuat),this._onBeforePhysicsStepCallbacks.forEach((e=>{e(this)})))},this.afterStep=()=>{this._physicsEngine&&(this._onAfterPhysicsStepCallbacks.forEach((e=>{e(this)})),this._physicsEngine.getPhysicsPlugin().setTransformationFromPhysicsBody(this),this.object.parent&&this.object.rotationQuaternion&&(this.getParentsRotation(),this._tmpQuat.conjugateInPlace(),this._tmpQuat.multiplyToRef(this.object.rotationQuaternion,this.object.rotationQuaternion)),this.object.setAbsolutePosition(this.object.position),this._deltaRotation?(this.object.rotationQuaternion&&this.object.rotationQuaternion.multiplyToRef(this._deltaRotation,this.object.rotationQuaternion),this._deltaPosition.applyRotationQuaternionToRef(this._deltaRotation,c._TmpVecs[0]),this.object.translate(c._TmpVecs[0],1)):this.object.translate(this._deltaPosition,1),this.object.computeWorldMatrix(!0))},this.onCollideEvent=null,this.onCollide=e=>{if(!this._onPhysicsCollideCallbacks.length&&!this.onCollideEvent)return;if(!this._physicsEngine)return;const t=this._physicsEngine.getImpostorWithPhysicsBody(e.body);t&&(this.onCollideEvent&&this.onCollideEvent(this,t),this._onPhysicsCollideCallbacks.filter((e=>-1!==e.otherImpostors.indexOf(t))).forEach((i=>{i.callback(this,t,e.point,e.distance,e.impulse,e.normal)})))},this.object?(this.object.parent&&0!==i.mass&&n.Y.Warn("A physics impostor has been created for an object which has a parent. Babylon physics currently works in local space so unexpected issues may occur."),!this._scene&&e.getScene&&(this._scene=e.getScene()),this._scene&&(this.type>100&&(this.soft=!0),this._physicsEngine=this._scene.getPhysicsEngine(),this._physicsEngine?(this.object.rotationQuaternion||(this.object.rotation?this.object.rotationQuaternion=r._f.RotationYawPitchRoll(this.object.rotation.y,this.object.rotation.x,this.object.rotation.z):this.object.rotationQuaternion=new r._f),this._options.mass=void 0===i.mass?0:i.mass,this._options.friction=void 0===i.friction?.2:i.friction,this._options.restitution=void 0===i.restitution?.2:i.restitution,this.soft&&(this._options.mass=this._options.mass>0?this._options.mass:1,this._options.pressure=void 0===i.pressure?200:i.pressure,this._options.stiffness=void 0===i.stiffness?1:i.stiffness,this._options.velocityIterations=void 0===i.velocityIterations?20:i.velocityIterations,this._options.positionIterations=void 0===i.positionIterations?20:i.positionIterations,this._options.fixedPoints=void 0===i.fixedPoints?0:i.fixedPoints,this._options.margin=void 0===i.margin?0:i.margin,this._options.damping=void 0===i.damping?0:i.damping,this._options.path=void 0===i.path?null:i.path,this._options.shape=void 0===i.shape?null:i.shape),this._joints=[],!this.object.parent||this._options.ignoreParent?this._init():this.object.parent.physicsImpostor&&n.Y.Warn("You must affect impostors to children before affecting impostor to parent.")):n.Y.Error("Physics not enabled. Please use scene.enablePhysics(...) before creating impostors."))):n.Y.Error("No object was provided. A physics object is obligatory")}_init(){this._physicsEngine&&(this._physicsEngine.removeImpostor(this),this.physicsBody=null,this._parent=this._parent||this._getPhysicsParent(),this._isDisposed||this.parent&&!this._options.ignoreParent||this._physicsEngine.addImpostor(this))}_getPhysicsParent(){return this.object.parent instanceof o.x?this.object.parent.physicsImpostor:null}isBodyInitRequired(){return this._bodyUpdateRequired||!this._physicsBody&&(!this._parent||!!this._options.ignoreParent)}setScalingUpdated(){this.forceUpdate()}forceUpdate(){this._init(),this.parent&&!this._options.ignoreParent&&this.parent.forceUpdate()}get physicsBody(){return this._parent&&!this._options.ignoreParent?this._parent.physicsBody:this._physicsBody}get parent(){return!this._options.ignoreParent&&this._parent?this._parent:null}set parent(e){this._parent=e}set physicsBody(e){this._physicsBody&&this._physicsEngine&&this._physicsEngine.getPhysicsPlugin().removePhysicsBody(this),this._physicsBody=e,this.resetUpdateFlags()}resetUpdateFlags(){this._bodyUpdateRequired=!1}getObjectExtents(){if(this.object.getBoundingInfo){const e=this.object.rotationQuaternion,t=this.object.scaling.clone();this.object.rotationQuaternion=c.IDENTITY_QUATERNION;const i=this.object.computeWorldMatrix&&this.object.computeWorldMatrix(!0);i&&i.decompose(t,void 0,void 0);const n=this.object.getBoundingInfo().boundingBox.extendSize.scale(2).multiplyInPlace(t);return n.x=Math.abs(n.x),n.y=Math.abs(n.y),n.z=Math.abs(n.z),this.object.rotationQuaternion=e,this.object.computeWorldMatrix&&this.object.computeWorldMatrix(!0),n}return c.DEFAULT_OBJECT_SIZE}getObjectCenter(){return this.object.getBoundingInfo?this.object.getBoundingInfo().boundingBox.centerWorld:this.object.position}getParam(e){return this._options[e]}setParam(e,t){this._options[e]=t,this._bodyUpdateRequired=!0}setMass(e){this.getParam("mass")!==e&&this.setParam("mass",e),this._physicsEngine&&this._physicsEngine.getPhysicsPlugin().setBodyMass(this,e)}getLinearVelocity(){return this._physicsEngine?this._physicsEngine.getPhysicsPlugin().getLinearVelocity(this):r.P.Zero()}setLinearVelocity(e){this._physicsEngine&&this._physicsEngine.getPhysicsPlugin().setLinearVelocity(this,e)}getAngularVelocity(){return this._physicsEngine?this._physicsEngine.getPhysicsPlugin().getAngularVelocity(this):r.P.Zero()}setAngularVelocity(e){this._physicsEngine&&this._physicsEngine.getPhysicsPlugin().setAngularVelocity(this,e)}executeNativeFunction(e){this._physicsEngine&&e(this._physicsEngine.getPhysicsPlugin().world,this.physicsBody)}registerBeforePhysicsStep(e){this._onBeforePhysicsStepCallbacks.push(e)}unregisterBeforePhysicsStep(e){const t=this._onBeforePhysicsStepCallbacks.indexOf(e);t>-1?this._onBeforePhysicsStepCallbacks.splice(t,1):n.Y.Warn("Function to remove was not found")}registerAfterPhysicsStep(e){this._onAfterPhysicsStepCallbacks.push(e)}unregisterAfterPhysicsStep(e){const t=this._onAfterPhysicsStepCallbacks.indexOf(e);t>-1?this._onAfterPhysicsStepCallbacks.splice(t,1):n.Y.Warn("Function to remove was not found")}registerOnPhysicsCollide(e,t){const i=e instanceof Array?e:[e];this._onPhysicsCollideCallbacks.push({callback:t,otherImpostors:i})}unregisterOnPhysicsCollide(e,t){const i=e instanceof Array?e:[e];let s=-1;this._onPhysicsCollideCallbacks.some(((e,n)=>{if(e.callback===t&&e.otherImpostors.length===i.length){const t=e.otherImpostors.every((e=>i.indexOf(e)>-1));return t&&(s=n),t}return!1}))?this._onPhysicsCollideCallbacks.splice(s,1):n.Y.Warn("Function to remove was not found")}getParentsRotation(){let e=this.object.parent;for(this._tmpQuat.copyFromFloats(0,0,0,1);e;)e.rotationQuaternion?this._tmpQuat2.copyFrom(e.rotationQuaternion):r._f.RotationYawPitchRollToRef(e.rotation.y,e.rotation.x,e.rotation.z,this._tmpQuat2),this._tmpQuat.multiplyToRef(this._tmpQuat2,this._tmpQuat),e=e.parent;return this._tmpQuat}applyForce(e,t){return this._physicsEngine&&this._physicsEngine.getPhysicsPlugin().applyForce(this,e,t),this}applyImpulse(e,t){return this._physicsEngine&&this._physicsEngine.getPhysicsPlugin().applyImpulse(this,e,t),this}createJoint(e,t,i){const n=new l.q7(t,i);return this.addJoint(e,n),this}addJoint(e,t){return this._joints.push({otherImpostor:e,joint:t}),this._physicsEngine&&this._physicsEngine.addJoint(this,e,t),this}addAnchor(e,t,i,n,s){if(!this._physicsEngine)return this;const r=this._physicsEngine.getPhysicsPlugin();return r.appendAnchor?(this._physicsEngine&&r.appendAnchor(this,e,t,i,n,s),this):this}addHook(e,t,i,n){if(!this._physicsEngine)return this;const s=this._physicsEngine.getPhysicsPlugin();return s.appendAnchor?(this._physicsEngine&&s.appendHook(this,e,t,i,n),this):this}sleep(){return this._physicsEngine&&this._physicsEngine.getPhysicsPlugin().sleepBody(this),this}wakeUp(){return this._physicsEngine&&this._physicsEngine.getPhysicsPlugin().wakeUpBody(this),this}clone(e){return e?new c(e,this.type,this._options,this._scene):null}dispose(){this._physicsEngine&&(this._joints.forEach((e=>{this._physicsEngine&&this._physicsEngine.removeJoint(this,e.otherImpostor,e.joint)})),this._physicsEngine.removeImpostor(this),this.parent&&this.parent.forceUpdate(),this._isDisposed=!0)}setDeltaPosition(e){this._deltaPosition.copyFrom(e)}setDeltaRotation(e){this._deltaRotation||(this._deltaRotation=new r._f),this._deltaRotation.copyFrom(e),this._deltaRotationConjugated=this._deltaRotation.conjugate()}getBoxSizeToRef(e){return this._physicsEngine&&this._physicsEngine.getPhysicsPlugin().getBoxSizeToRef(this,e),this}getRadius(){return this._physicsEngine?this._physicsEngine.getPhysicsPlugin().getRadius(this):0}syncBoneWithImpostor(e,t,i,n,s){const r=c._TmpVecs[0],o=this.object;if(o.rotationQuaternion)if(s){const i=c._TmpQuat;o.rotationQuaternion.multiplyToRef(s,i),e.setRotationQuaternion(i,h.T.WORLD,t)}else e.setRotationQuaternion(o.rotationQuaternion,h.T.WORLD,t);r.x=0,r.y=0,r.z=0,i&&(r.x=i.x,r.y=i.y,r.z=i.z,e.getDirectionToRef(r,t,r),null==n&&(n=i.length()),r.x*=n,r.y*=n,r.z*=n),e.getParent()?(r.addInPlace(o.getAbsolutePosition()),e.setAbsolutePosition(r,t)):(t.setAbsolutePosition(o.getAbsolutePosition()),t.position.x-=r.x,t.position.y-=r.y,t.position.z-=r.z)}syncImpostorWithBone(e,t,i,n,s,r){const o=this.object;if(o.rotationQuaternion)if(s){const i=c._TmpQuat;e.getRotationQuaternionToRef(h.T.WORLD,t,i),i.multiplyToRef(s,o.rotationQuaternion)}else e.getRotationQuaternionToRef(h.T.WORLD,t,o.rotationQuaternion);const a=c._TmpVecs[0],l=c._TmpVecs[1];r||((r=c._TmpVecs[2]).x=0,r.y=1,r.z=0),e.getDirectionToRef(r,t,l),e.getAbsolutePositionToRef(t,a),null==n&&i&&(n=i.length()),null!=n&&(a.x+=l.x*n,a.y+=l.y*n,a.z+=l.z*n),o.setAbsolutePosition(a)}}c.DEFAULT_OBJECT_SIZE=new r.P(1,1,1),c.IDENTITY_QUATERNION=r._f.Identity(),c._TmpVecs=s.B.BuildArray(3,r.P.Zero),c._TmpQuat=r._f.Identity(),c.NoImpostor=0,c.SphereImpostor=1,c.BoxImpostor=2,c.PlaneImpostor=3,c.MeshImpostor=4,c.CapsuleImpostor=6,c.CylinderImpostor=7,c.ParticleImpostor=8,c.HeightmapImpostor=9,c.ConvexHullImpostor=10,c.CustomImpostor=100,c.RopeImpostor=101,c.ClothImpostor=102,c.SoftbodyImpostor=103},58:(e,t,i)=>{i.d(t,{$Q:()=>r,OT:()=>a,mN:()=>s,q7:()=>n,yr:()=>o});class n{constructor(e,t){this.type=e,this.jointData=t,t.nativeParams=t.nativeParams||{}}get physicsJoint(){return this._physicsJoint}set physicsJoint(e){this._physicsJoint,this._physicsJoint=e}set physicsPlugin(e){this._physicsPlugin=e}executeNativeFunction(e){e(this._physicsPlugin.world,this._physicsJoint)}}n.DistanceJoint=0,n.HingeJoint=1,n.BallAndSocketJoint=2,n.WheelJoint=3,n.SliderJoint=4,n.PrismaticJoint=5,n.UniversalJoint=6,n.Hinge2Joint=n.WheelJoint,n.PointToPointJoint=8,n.SpringJoint=9,n.LockJoint=10;class s extends n{constructor(e){super(n.DistanceJoint,e)}updateDistance(e,t){this._physicsPlugin.updateDistanceJoint(this,e,t)}}class r extends n{constructor(e,t){super(e,t)}setMotor(e,t){this._physicsPlugin.setMotor(this,e||0,t)}setLimit(e,t){this._physicsPlugin.setLimit(this,e,t)}}class o extends r{constructor(e){super(n.HingeJoint,e)}setMotor(e,t){this._physicsPlugin.setMotor(this,e||0,t)}setLimit(e,t){this._physicsPlugin.setLimit(this,e,t)}}class a extends r{constructor(e){super(n.Hinge2Joint,e)}setMotor(e,t,i=0){this._physicsPlugin.setMotor(this,e||0,t,i)}setLimit(e,t,i=0){this._physicsPlugin.setLimit(this,e,t,i)}}},9525:(e,t,i)=>{i.d(t,{Z:()=>l,Q:()=>a});var n=i(392),s=i(7814);i(7182);i(8104).v.ShadersStore.passCubePixelShader="varying vec2 vUV;\nuniform samplerCube textureSampler;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) \n{\nvec2 uv=vUV*2.0-1.0;\n#ifdef POSITIVEX\ngl_FragColor=textureCube(textureSampler,vec3(1.001,uv.y,uv.x));\n#endif\n#ifdef NEGATIVEX\ngl_FragColor=textureCube(textureSampler,vec3(-1.001,uv.y,uv.x));\n#endif\n#ifdef POSITIVEY\ngl_FragColor=textureCube(textureSampler,vec3(uv.y,1.001,uv.x));\n#endif\n#ifdef NEGATIVEY\ngl_FragColor=textureCube(textureSampler,vec3(uv.y,-1.001,uv.x));\n#endif\n#ifdef POSITIVEZ\ngl_FragColor=textureCube(textureSampler,vec3(uv,1.001));\n#endif\n#ifdef NEGATIVEZ\ngl_FragColor=textureCube(textureSampler,vec3(uv,-1.001));\n#endif\n}";var r=i(2208),o=i(3956);class a extends n.D{getClassName(){return"PassPostProcess"}constructor(e,t,i=null,n,s,r,o=0,a=!1){super(e,"pass",null,null,t,i,n,s,r,void 0,o,void 0,null,a)}static _Parse(e,t,i,n){return o.p4.Parse((()=>new a(e.name,e.options,t,e.renderTargetSamplingMode,e._engine,e.reusable)),e,i,n)}}(0,r.H)("BABYLON.PassPostProcess",a);class l extends n.D{get face(){return this._face}set face(e){if(!(e<0||e>5))switch(this._face=e,this._face){case 0:this.updateEffect("#define POSITIVEX");break;case 1:this.updateEffect("#define NEGATIVEX");break;case 2:this.updateEffect("#define POSITIVEY");break;case 3:this.updateEffect("#define NEGATIVEY");break;case 4:this.updateEffect("#define POSITIVEZ");break;case 5:this.updateEffect("#define NEGATIVEZ")}}getClassName(){return"PassCubePostProcess"}constructor(e,t,i=null,n,s,r,o=0,a=!1){super(e,"passCube",null,null,t,i,n,s,r,"#define POSITIVEX",o,void 0,null,a),this._face=0}static _Parse(e,t,i,n){return o.p4.Parse((()=>new l(e.name,e.options,t,e.renderTargetSamplingMode,e._engine,e.reusable)),e,i,n)}}s.D._RescalePostProcessFactory=e=>new a("rescale",1,null,2,e,!1,0)},392:(e,t,i)=>{i.d(t,{D:()=>d});var n=i(9472),s=i(5363),r=i(5757),o=i(4141),a=(i(8793),i(7814)),l=(i(7246),i(3956)),h=i(2208),c=i(1345),u=i(9131);class d{static RegisterShaderCodeProcessing(e,t){t?d._CustomShaderCodeProcessing[null!=e?e:""]=t:delete d._CustomShaderCodeProcessing[null!=e?e:""]}static _GetShaderCodeProcessing(e){var t;return null!==(t=d._CustomShaderCodeProcessing[e])&&void 0!==t?t:d._CustomShaderCodeProcessing[""]}get samples(){return this._samples}set samples(e){this._samples=Math.min(e,this._engine.getCaps().maxMSAASamples),this._textures.forEach((e=>{e.setSamples(this._samples)}))}getEffectName(){return this._fragmentUrl}set onActivate(e){this._onActivateObserver&&this.onActivateObservable.remove(this._onActivateObserver),e&&(this._onActivateObserver=this.onActivateObservable.add(e))}set onSizeChanged(e){this._onSizeChangedObserver&&this.onSizeChangedObservable.remove(this._onSizeChangedObserver),this._onSizeChangedObserver=this.onSizeChangedObservable.add(e)}set onApply(e){this._onApplyObserver&&this.onApplyObservable.remove(this._onApplyObserver),this._onApplyObserver=this.onApplyObservable.add(e)}set onBeforeRender(e){this._onBeforeRenderObserver&&this.onBeforeRenderObservable.remove(this._onBeforeRenderObserver),this._onBeforeRenderObserver=this.onBeforeRenderObservable.add(e)}set onAfterRender(e){this._onAfterRenderObserver&&this.onAfterRenderObservable.remove(this._onAfterRenderObserver),this._onAfterRenderObserver=this.onAfterRenderObservable.add(e)}get inputTexture(){return this._textures.data[this._currentRenderTextureInd]}set inputTexture(e){this._forcedOutputTexture=e}restoreDefaultInputTexture(){this._forcedOutputTexture&&(this._forcedOutputTexture=null,this.markTextureDirty())}getCamera(){return this._camera}get texelSize(){return this._shareOutputWithPostProcess?this._shareOutputWithPostProcess.texelSize:(this._forcedOutputTexture&&this._texelSize.copyFromFloats(1/this._forcedOutputTexture.width,1/this._forcedOutputTexture.height),this._texelSize)}constructor(e,t,i,n,a,l,h=1,d,p,f=null,_=0,m="postprocess",g,v=!1,y=5,x=u.x.GLSL){this._parentContainer=null,this.width=-1,this.height=-1,this.nodeMaterialSource=null,this._outputTexture=null,this.autoClear=!0,this.forceAutoClearInAlphaMode=!1,this.alphaMode=0,this.animations=new Array,this.enablePixelPerfectMode=!1,this.forceFullscreenViewport=!0,this.scaleMode=1,this.alwaysForcePOT=!1,this._samples=1,this.adaptScaleToCurrentViewport=!1,this._reusable=!1,this._renderId=0,this.externalTextureSamplerBinding=!1,this._textures=new s.t(2),this._textureCache=[],this._currentRenderTextureInd=0,this._scaleRatio=new o.FM(1,1),this._texelSize=o.FM.Zero(),this.onActivateObservable=new r.y$,this.onSizeChangedObservable=new r.y$,this.onApplyObservable=new r.y$,this.onBeforeRenderObservable=new r.y$,this.onAfterRenderObservable=new r.y$,this.name=e,null!=l?(this._camera=l,this._scene=l.getScene(),l.attachPostProcess(this),this._engine=this._scene.getEngine(),this._scene.postProcesses.push(this),this.uniqueId=this._scene.getUniqueId()):d&&(this._engine=d,this._engine.postProcesses.push(this)),this._options=a,this.renderTargetSamplingMode=h||1,this._reusable=p||!1,this._textureType=_,this._textureFormat=y,this._shaderLanguage=x,this._samplers=n||[],this._samplers.push("textureSampler"),this._fragmentUrl=t,this._vertexUrl=m,this._parameters=i||[],this._parameters.push("scale"),this._indexParameters=g,this._drawWrapper=new c.q(this._engine),v||this.updateEffect(f)}getClassName(){return"PostProcess"}getEngine(){return this._engine}getEffect(){return this._drawWrapper.effect}shareOutputWith(e){return this._disposeTextures(),this._shareOutputWithPostProcess=e,this}useOwnOutput(){0==this._textures.length&&(this._textures=new s.t(2)),this._shareOutputWithPostProcess=null}updateEffect(e=null,t=null,i=null,n,s,r,o,a){var l,h;const c=d._GetShaderCodeProcessing(this.name);if(null==c?void 0:c.defineCustomBindings){const n=null!==(l=null==t?void 0:t.slice())&&void 0!==l?l:[];n.push(...this._parameters);const s=null!==(h=null==i?void 0:i.slice())&&void 0!==h?h:[];s.push(...this._samplers),e=c.defineCustomBindings(this.name,e,n,s),t=n,i=s}this._postProcessDefines=e,this._drawWrapper.effect=this._engine.createEffect({vertex:null!=o?o:this._vertexUrl,fragment:null!=a?a:this._fragmentUrl},{attributes:["position"],uniformsNames:t||this._parameters,uniformBuffersNames:[],samplers:i||this._samplers,defines:null!==e?e:"",fallbacks:null,onCompiled:null!=s?s:null,onError:null!=r?r:null,indexParameters:n||this._indexParameters,processCodeAfterIncludes:(null==c?void 0:c.processCodeAfterIncludes)?(e,t)=>c.processCodeAfterIncludes(this.name,e,t):null,processFinalCode:(null==c?void 0:c.processFinalCode)?(e,t)=>c.processFinalCode(this.name,e,t):null,shaderLanguage:this._shaderLanguage},this._engine)}isReusable(){return this._reusable}markTextureDirty(){this.width=-1}_createRenderTargetTexture(e,t,i=0){for(let n=0;n<this._textureCache.length;n++)if(this._textureCache[n].texture.width===e.width&&this._textureCache[n].texture.height===e.height&&this._textureCache[n].postProcessChannel===i&&this._textureCache[n].texture._generateDepthBuffer===t.generateDepthBuffer&&this._textureCache[n].texture.samples===t.samples)return this._textureCache[n].texture;const n=this._engine.createRenderTargetTexture(e,t);return this._textureCache.push({texture:n,postProcessChannel:i,lastUsedRenderId:-1}),n}_flushTextureCache(){const e=this._renderId;for(let t=this._textureCache.length-1;t>=0;t--)if(e-this._textureCache[t].lastUsedRenderId>100){let e=!1;for(let i=0;i<this._textures.length;i++)if(this._textures.data[i]===this._textureCache[t].texture){e=!0;break}e||(this._textureCache[t].texture.dispose(),this._textureCache.splice(t,1))}}_resize(e,t,i,n,s){this._textures.length>0&&this._textures.reset(),this.width=e,this.height=t;let r=null;for(let e=0;e<i._postProcesses.length;e++)if(null!==i._postProcesses[e]){r=i._postProcesses[e];break}const o={width:this.width,height:this.height},a={generateMipMaps:n,generateDepthBuffer:s||r===this,generateStencilBuffer:(s||r===this)&&this._engine.isStencilEnable,samplingMode:this.renderTargetSamplingMode,type:this._textureType,format:this._textureFormat,samples:this._samples,label:"PostProcessRTT-"+this.name};this._textures.push(this._createRenderTargetTexture(o,a,0)),this._reusable&&this._textures.push(this._createRenderTargetTexture(o,a,1)),this._texelSize.copyFromFloats(1/this.width,1/this.height),this.onSizeChangedObservable.notifyObservers(this)}activate(e,t=null,i){var n,s;const r=(e=e||this._camera).getScene(),o=r.getEngine(),l=o.getCaps().maxTextureSize;let h=(t?t.width:this._engine.getRenderWidth(!0))*this._options|0;const c=(t?t.height:this._engine.getRenderHeight(!0))*this._options|0,u=e.parent;!u||u.leftCamera!=e&&u.rightCamera!=e||(h/=2);let d=this._options.width||h,p=this._options.height||c;const f=7!==this.renderTargetSamplingMode&&1!==this.renderTargetSamplingMode&&2!==this.renderTargetSamplingMode;if(!this._shareOutputWithPostProcess&&!this._forcedOutputTexture){if(this.adaptScaleToCurrentViewport){const e=o.currentViewport;e&&(d*=e.width,p*=e.height)}(f||this.alwaysForcePOT)&&(this._options.width||(d=o.needPOTTextures?a.D.GetExponentOfTwo(d,l,this.scaleMode):d),this._options.height||(p=o.needPOTTextures?a.D.GetExponentOfTwo(p,l,this.scaleMode):p)),this.width===d&&this.height===p||this._resize(d,p,e,f,i),this._textures.forEach((e=>{e.samples!==this.samples&&this._engine.updateRenderTargetTextureSampleCount(e,this.samples)})),this._flushTextureCache(),this._renderId++}let _;if(this._shareOutputWithPostProcess)_=this._shareOutputWithPostProcess.inputTexture;else if(this._forcedOutputTexture)_=this._forcedOutputTexture,this.width=this._forcedOutputTexture.width,this.height=this._forcedOutputTexture.height;else{let e;_=this.inputTexture;for(let t=0;t<this._textureCache.length;t++)if(this._textureCache[t].texture===_){e=this._textureCache[t];break}e&&(e.lastUsedRenderId=this._renderId)}return this.enablePixelPerfectMode?(this._scaleRatio.copyFromFloats(h/d,c/p),this._engine.bindFramebuffer(_,0,h,c,this.forceFullscreenViewport)):(this._scaleRatio.copyFromFloats(1,1),this._engine.bindFramebuffer(_,0,void 0,void 0,this.forceFullscreenViewport)),null===(s=(n=this._engine)._debugInsertMarker)||void 0===s||s.call(n,`post process ${this.name} input`),this.onActivateObservable.notifyObservers(e),this.autoClear&&(0===this.alphaMode||this.forceAutoClearInAlphaMode)&&this._engine.clear(this.clearColor?this.clearColor:r.clearColor,r._allowPostProcessClearColor,!0,!0),this._reusable&&(this._currentRenderTextureInd=(this._currentRenderTextureInd+1)%2),_}get isSupported(){return this._drawWrapper.effect.isSupported}get aspectRatio(){return this._shareOutputWithPostProcess?this._shareOutputWithPostProcess.aspectRatio:this._forcedOutputTexture?this._forcedOutputTexture.width/this._forcedOutputTexture.height:this.width/this.height}isReady(){var e,t;return null!==(t=null===(e=this._drawWrapper.effect)||void 0===e?void 0:e.isReady())&&void 0!==t&&t}apply(){var e,t,i;if(!(null===(e=this._drawWrapper.effect)||void 0===e?void 0:e.isReady()))return null;let n;return this._engine.enableEffect(this._drawWrapper),this._engine.setState(!1),this._engine.setDepthBuffer(!1),this._engine.setDepthWrite(!1),this._engine.setAlphaMode(this.alphaMode),this.alphaConstants&&this.getEngine().setAlphaConstants(this.alphaConstants.r,this.alphaConstants.g,this.alphaConstants.b,this.alphaConstants.a),n=this._shareOutputWithPostProcess?this._shareOutputWithPostProcess.inputTexture:this._forcedOutputTexture?this._forcedOutputTexture:this.inputTexture,this.externalTextureSamplerBinding||this._drawWrapper.effect._bindTexture("textureSampler",null==n?void 0:n.texture),this._drawWrapper.effect.setVector2("scale",this._scaleRatio),this.onApplyObservable.notifyObservers(this._drawWrapper.effect),null===(i=null===(t=d._GetShaderCodeProcessing(this.name))||void 0===t?void 0:t.bindCustomBindings)||void 0===i||i.call(t,this.name,this._drawWrapper.effect),this._drawWrapper.effect}_disposeTextures(){this._shareOutputWithPostProcess||this._forcedOutputTexture?this._disposeTextureCache():(this._disposeTextureCache(),this._textures.dispose())}_disposeTextureCache(){for(let e=this._textureCache.length-1;e>=0;e--)this._textureCache[e].texture.dispose();this._textureCache.length=0}setPrePassRenderer(e){return!!this._prePassEffectConfiguration&&(this._prePassEffectConfiguration=e.addEffectConfiguration(this._prePassEffectConfiguration),this._prePassEffectConfiguration.enabled=!0,!0)}dispose(e){let t;if(e=e||this._camera,this._disposeTextures(),this._scene&&(t=this._scene.postProcesses.indexOf(this),-1!==t&&this._scene.postProcesses.splice(t,1)),this._parentContainer){const e=this._parentContainer.postProcesses.indexOf(this);e>-1&&this._parentContainer.postProcesses.splice(e,1),this._parentContainer=null}if(t=this._engine.postProcesses.indexOf(this),-1!==t&&this._engine.postProcesses.splice(t,1),e){if(e.detachPostProcess(this),t=e._postProcesses.indexOf(this),0===t&&e._postProcesses.length>0){const e=this._camera._getFirstPostProcess();e&&e.markTextureDirty()}this.onActivateObservable.clear(),this.onAfterRenderObservable.clear(),this.onApplyObservable.clear(),this.onBeforeRenderObservable.clear(),this.onSizeChangedObservable.clear()}}serialize(){const e=l.p4.Serialize(this),t=this.getCamera()||this._scene&&this._scene.activeCamera;return e.customType="BABYLON."+this.getClassName(),e.cameraId=t?t.id:null,e.reusable=this._reusable,e.textureType=this._textureType,e.fragmentUrl=this._fragmentUrl,e.parameters=this._parameters,e.samplers=this._samplers,e.options=this._options,e.defines=this._postProcessDefines,e.textureFormat=this._textureFormat,e.vertexUrl=this._vertexUrl,e.indexParameters=this._indexParameters,e}clone(){const e=this.serialize();e._engine=this._engine,e.cameraId=null;const t=d.Parse(e,this._scene,"");return t?(t.onActivateObservable=this.onActivateObservable.clone(),t.onSizeChangedObservable=this.onSizeChangedObservable.clone(),t.onApplyObservable=this.onApplyObservable.clone(),t.onBeforeRenderObservable=this.onBeforeRenderObservable.clone(),t.onAfterRenderObservable=this.onAfterRenderObservable.clone(),t._prePassEffectConfiguration=this._prePassEffectConfiguration,t):null}static Parse(e,t,i){const n=(0,h.q)(e.customType);if(!n||!n._Parse)return null;const s=t?t.getCameraById(e.cameraId):null;return n._Parse(e,s,t,i)}static _Parse(e,t,i,n){return l.p4.Parse((()=>new d(e.name,e.fragmentUrl,e.parameters,e.samplers,e.options,t,e.renderTargetSamplingMode,e._engine,e.reusable,e.defines,e.textureType,e.vertexUrl,e.indexParameters,!1,e.textureFormat)),e,i,n)}}d._CustomShaderCodeProcessing={},(0,n.gn)([(0,l.qC)()],d.prototype,"uniqueId",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"name",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"width",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"height",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"renderTargetSamplingMode",void 0),(0,n.gn)([(0,l.XX)()],d.prototype,"clearColor",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"autoClear",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"forceAutoClearInAlphaMode",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"alphaMode",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"alphaConstants",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"enablePixelPerfectMode",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"forceFullscreenViewport",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"scaleMode",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"alwaysForcePOT",void 0),(0,n.gn)([(0,l.qC)("samples")],d.prototype,"_samples",void 0),(0,n.gn)([(0,l.qC)()],d.prototype,"adaptScaleToCurrentViewport",void 0),(0,h.H)("BABYLON.PostProcess",d)},727:(e,t,i)=>{i.d(t,{O:()=>s});var n=i(708);class s{constructor(e){this._vertexBuffers={},this._scene=e}_prepareBuffers(){if(this._vertexBuffers[n.o.PositionKind])return;const e=[];e.push(1,1),e.push(-1,1),e.push(-1,-1),e.push(1,-1),this._vertexBuffers[n.o.PositionKind]=new n.o(this._scene.getEngine(),e,n.o.PositionKind,!1,!1,2),this._buildIndexBuffer()}_buildIndexBuffer(){const e=[];e.push(0),e.push(1),e.push(2),e.push(0),e.push(2),e.push(3),this._indexBuffer=this._scene.getEngine().createIndexBuffer(e)}_rebuild(){const e=this._vertexBuffers[n.o.PositionKind];e&&(e._rebuild(),this._buildIndexBuffer())}_prepareFrame(e=null,t=null){const i=this._scene.activeCamera;return!(!i||!(t=t||i._postProcesses.filter((e=>null!=e)))||0===t.length||!this._scene.postProcessesEnabled||(t[0].activate(i,e,null!=t),0))}directRender(e,t=null,i=!1,n=0,s=0,r=!1){var o;const a=this._scene.getEngine();for(let l=0;l<e.length;l++){l<e.length-1?e[l+1].activate(this._scene.activeCamera,null==t?void 0:t.texture):(t?a.bindFramebuffer(t,n,void 0,void 0,i,s):r||a.restoreDefaultFramebuffer(),null===(o=a._debugInsertMarker)||void 0===o||o.call(a,`post process ${e[l].name} output`));const h=e[l],c=h.apply();c&&(h.onBeforeRenderObservable.notifyObservers(c),this._prepareBuffers(),a.bindBuffers(this._vertexBuffers,this._indexBuffer,c),a.drawElementsType(0,0,6),h.onAfterRenderObservable.notifyObservers(c))}a.setDepthBuffer(!0),a.setDepthWrite(!0)}_finalizeFrame(e,t,i,n,s=!1){var r;const o=this._scene.activeCamera;if(!o)return;if(0===(n=n||o._postProcesses.filter((e=>null!=e))).length||!this._scene.postProcessesEnabled)return;const a=this._scene.getEngine();for(let l=0,h=n.length;l<h;l++){const c=n[l];if(l<h-1?c._outputTexture=n[l+1].activate(o,null==t?void 0:t.texture):(t?(a.bindFramebuffer(t,i,void 0,void 0,s),c._outputTexture=t):(a.restoreDefaultFramebuffer(),c._outputTexture=null),null===(r=a._debugInsertMarker)||void 0===r||r.call(a,`post process ${n[l].name} output`)),e)break;const u=c.apply();u&&(c.onBeforeRenderObservable.notifyObservers(u),this._prepareBuffers(),a.bindBuffers(this._vertexBuffers,this._indexBuffer,u),a.drawElementsType(0,0,6),c.onAfterRenderObservable.notifyObservers(u))}a.setDepthBuffer(!0),a.setDepthWrite(!0),a.setAlphaMode(0)}dispose(){const e=this._vertexBuffers[n.o.PositionKind];e&&(e.dispose(),this._vertexBuffers[n.o.PositionKind]=null),this._indexBuffer&&(this._scene.getEngine()._releaseBuffer(this._indexBuffer),this._indexBuffer=null)}}},1617:(e,t,i)=>{i.d(t,{S:()=>r});var n=i(5363),s=i(4141);class r{set opaqueSortCompareFn(e){this._opaqueSortCompareFn=e||r.PainterSortCompare,this._renderOpaque=this._renderOpaqueSorted}set alphaTestSortCompareFn(e){this._alphaTestSortCompareFn=e||r.PainterSortCompare,this._renderAlphaTest=this._renderAlphaTestSorted}set transparentSortCompareFn(e){this._transparentSortCompareFn=e||r.defaultTransparentSortCompare,this._renderTransparent=this._renderTransparentSorted}constructor(e,t,i=null,s=null,r=null){this.index=e,this._opaqueSubMeshes=new n.t(256),this._transparentSubMeshes=new n.t(256),this._alphaTestSubMeshes=new n.t(256),this._depthOnlySubMeshes=new n.t(256),this._particleSystems=new n.t(256),this._spriteManagers=new n.t(256),this._empty=!0,this._edgesRenderers=new n.f(16),this._scene=t,this.opaqueSortCompareFn=i,this.alphaTestSortCompareFn=s,this.transparentSortCompareFn=r}render(e,t,i,n){if(e)return void e(this._opaqueSubMeshes,this._alphaTestSubMeshes,this._transparentSubMeshes,this._depthOnlySubMeshes);const s=this._scene.getEngine();0!==this._depthOnlySubMeshes.length&&(s.setColorWrite(!1),this._renderAlphaTest(this._depthOnlySubMeshes),s.setColorWrite(!0)),0!==this._opaqueSubMeshes.length&&this._renderOpaque(this._opaqueSubMeshes),0!==this._alphaTestSubMeshes.length&&this._renderAlphaTest(this._alphaTestSubMeshes);const r=s.getStencilBuffer();if(s.setStencilBuffer(!1),t&&this._renderSprites(),i&&this._renderParticles(n),this.onBeforeTransparentRendering&&this.onBeforeTransparentRendering(),0!==this._transparentSubMeshes.length||this._scene.useOrderIndependentTransparency){if(s.setStencilBuffer(r),this._scene.useOrderIndependentTransparency){const e=this._scene.depthPeelingRenderer.render(this._transparentSubMeshes);e.length&&this._renderTransparent(e)}else this._renderTransparent(this._transparentSubMeshes);s.setAlphaMode(0)}if(s.setStencilBuffer(!1),this._edgesRenderers.length){for(let e=0;e<this._edgesRenderers.length;e++)this._edgesRenderers.data[e].render();s.setAlphaMode(0)}s.setStencilBuffer(r)}_renderOpaqueSorted(e){return r._RenderSorted(e,this._opaqueSortCompareFn,this._scene.activeCamera,!1)}_renderAlphaTestSorted(e){return r._RenderSorted(e,this._alphaTestSortCompareFn,this._scene.activeCamera,!1)}_renderTransparentSorted(e){return r._RenderSorted(e,this._transparentSortCompareFn,this._scene.activeCamera,!0)}static _RenderSorted(e,t,i,n){let o,a=0;const l=i?i.globalPosition:r._ZeroVector;if(n)for(;a<e.length;a++)o=e.data[a],o._alphaIndex=o.getMesh().alphaIndex,o._distanceToCamera=s.P.Distance(o.getBoundingInfo().boundingSphere.centerWorld,l);const h=e.length===e.data.length?e.data:e.data.slice(0,e.length);t&&h.sort(t);const c=h[0].getMesh().getScene();for(a=0;a<h.length;a++)if(o=h[a],!c._activeMeshesFrozenButKeepClipping||o.isInFrustum(c._frustumPlanes)){if(n){const e=o.getMaterial();if(e&&e.needDepthPrePass){const t=e.getScene().getEngine();t.setColorWrite(!1),t.setAlphaMode(0),o.render(!1),t.setColorWrite(!0)}}o.render(n)}}static defaultTransparentSortCompare(e,t){return e._alphaIndex>t._alphaIndex?1:e._alphaIndex<t._alphaIndex?-1:r.backToFrontSortCompare(e,t)}static backToFrontSortCompare(e,t){return e._distanceToCamera<t._distanceToCamera?1:e._distanceToCamera>t._distanceToCamera?-1:0}static frontToBackSortCompare(e,t){return e._distanceToCamera<t._distanceToCamera?-1:e._distanceToCamera>t._distanceToCamera?1:0}static PainterSortCompare(e,t){const i=e.getMesh(),n=t.getMesh();return i.material&&n.material?i.material.uniqueId-n.material.uniqueId:i.uniqueId-n.uniqueId}prepare(){this._opaqueSubMeshes.reset(),this._transparentSubMeshes.reset(),this._alphaTestSubMeshes.reset(),this._depthOnlySubMeshes.reset(),this._particleSystems.reset(),this.prepareSprites(),this._edgesRenderers.reset(),this._empty=!0}prepareSprites(){this._spriteManagers.reset()}dispose(){this._opaqueSubMeshes.dispose(),this._transparentSubMeshes.dispose(),this._alphaTestSubMeshes.dispose(),this._depthOnlySubMeshes.dispose(),this._particleSystems.dispose(),this._spriteManagers.dispose(),this._edgesRenderers.dispose()}dispatch(e,t,i){void 0===t&&(t=e.getMesh()),void 0===i&&(i=e.getMaterial()),null!=i&&(i.needAlphaBlendingForMesh(t)?this._transparentSubMeshes.push(e):i.needAlphaTesting()?(i.needDepthPrePass&&this._depthOnlySubMeshes.push(e),this._alphaTestSubMeshes.push(e)):(i.needDepthPrePass&&this._depthOnlySubMeshes.push(e),this._opaqueSubMeshes.push(e)),t._renderingGroup=this,t._edgesRenderer&&t._edgesRenderer.isEnabled&&this._edgesRenderers.pushNoDuplicate(t._edgesRenderer),this._empty=!1)}dispatchSprites(e){this._spriteManagers.push(e),this._empty=!1}dispatchParticles(e){this._particleSystems.push(e),this._empty=!1}_renderParticles(e){if(0===this._particleSystems.length)return;const t=this._scene.activeCamera;this._scene.onBeforeParticlesRenderingObservable.notifyObservers(this._scene);for(let i=0;i<this._particleSystems.length;i++){const n=this._particleSystems.data[i];if(0===(t&&t.layerMask&n.layerMask))continue;const s=n.emitter;s.position&&e&&-1===e.indexOf(s)||this._scene._activeParticles.addCount(n.render(),!1)}this._scene.onAfterParticlesRenderingObservable.notifyObservers(this._scene)}_renderSprites(){if(!this._scene.spritesEnabled||0===this._spriteManagers.length)return;const e=this._scene.activeCamera;this._scene.onBeforeSpritesRenderingObservable.notifyObservers(this._scene);for(let t=0;t<this._spriteManagers.length;t++){const i=this._spriteManagers.data[t];0!==(e&&e.layerMask&i.layerMask)&&i.render()}this._scene.onAfterSpritesRenderingObservable.notifyObservers(this._scene)}}r._ZeroVector=s.P.Zero()},4221:(e,t,i)=>{i.d(t,{$:()=>r,t:()=>s});var n=i(1617);class s{}class r{get maintainStateBetweenFrames(){return this._maintainStateBetweenFrames}set maintainStateBetweenFrames(e){if(e!==this._maintainStateBetweenFrames&&(this._maintainStateBetweenFrames=e,!this._maintainStateBetweenFrames)){for(const e of this._scene.meshes)if(e.subMeshes)for(const t of e.subMeshes)t._wasDispatched=!1;if(this._scene.spriteManagers)for(const e of this._scene.spriteManagers)e._wasDispatched=!1;for(const e of this._scene.particleSystems)e._wasDispatched=!1}}constructor(e){this._useSceneAutoClearSetup=!1,this._renderingGroups=new Array,this._autoClearDepthStencil={},this._customOpaqueSortCompareFn={},this._customAlphaTestSortCompareFn={},this._customTransparentSortCompareFn={},this._renderingGroupInfo=new s,this._maintainStateBetweenFrames=!1,this._scene=e;for(let e=r.MIN_RENDERINGGROUPS;e<r.MAX_RENDERINGGROUPS;e++)this._autoClearDepthStencil[e]={autoClear:!0,depth:!0,stencil:!0}}getRenderingGroup(e){const t=e||0;return this._prepareRenderingGroup(t),this._renderingGroups[t]}_clearDepthStencilBuffer(e=!0,t=!0){this._depthStencilBufferAlreadyCleaned||(this._scene.getEngine().clear(null,!1,e,t),this._depthStencilBufferAlreadyCleaned=!0)}render(e,t,i,n){const s=this._renderingGroupInfo;if(s.scene=this._scene,s.camera=this._scene.activeCamera,this._scene.spriteManagers&&n)for(let e=0;e<this._scene.spriteManagers.length;e++){const t=this._scene.spriteManagers[e];this.dispatchSprites(t)}for(let o=r.MIN_RENDERINGGROUPS;o<r.MAX_RENDERINGGROUPS;o++){this._depthStencilBufferAlreadyCleaned=o===r.MIN_RENDERINGGROUPS;const a=this._renderingGroups[o];if(!a||a._empty)continue;const l=Math.pow(2,o);if(s.renderingGroupId=o,this._scene.onBeforeRenderingGroupObservable.notifyObservers(s,l),r.AUTOCLEAR){const e=this._useSceneAutoClearSetup?this._scene.getAutoClearDepthStencilSetup(o):this._autoClearDepthStencil[o];e&&e.autoClear&&this._clearDepthStencilBuffer(e.depth,e.stencil)}for(const e of this._scene._beforeRenderingGroupDrawStage)e.action(o);a.render(e,n,i,t);for(const e of this._scene._afterRenderingGroupDrawStage)e.action(o);this._scene.onAfterRenderingGroupObservable.notifyObservers(s,l)}}reset(){if(!this.maintainStateBetweenFrames)for(let e=r.MIN_RENDERINGGROUPS;e<r.MAX_RENDERINGGROUPS;e++){const t=this._renderingGroups[e];t&&t.prepare()}}resetSprites(){if(!this.maintainStateBetweenFrames)for(let e=r.MIN_RENDERINGGROUPS;e<r.MAX_RENDERINGGROUPS;e++){const t=this._renderingGroups[e];t&&t.prepareSprites()}}dispose(){this.freeRenderingGroups(),this._renderingGroups.length=0,this._renderingGroupInfo=null}freeRenderingGroups(){for(let e=r.MIN_RENDERINGGROUPS;e<r.MAX_RENDERINGGROUPS;e++){const t=this._renderingGroups[e];t&&t.dispose()}}_prepareRenderingGroup(e){void 0===this._renderingGroups[e]&&(this._renderingGroups[e]=new n.S(e,this._scene,this._customOpaqueSortCompareFn[e],this._customAlphaTestSortCompareFn[e],this._customTransparentSortCompareFn[e]))}dispatchSprites(e){this.maintainStateBetweenFrames&&e._wasDispatched||(e._wasDispatched=!0,this.getRenderingGroup(e.renderingGroupId).dispatchSprites(e))}dispatchParticles(e){this.maintainStateBetweenFrames&&e._wasDispatched||(e._wasDispatched=!0,this.getRenderingGroup(e.renderingGroupId).dispatchParticles(e))}dispatch(e,t,i){void 0===t&&(t=e.getMesh()),this.maintainStateBetweenFrames&&e._wasDispatched||(e._wasDispatched=!0,this.getRenderingGroup(t.renderingGroupId).dispatch(e,t,i))}setRenderingOrder(e,t=null,i=null,n=null){if(this._customOpaqueSortCompareFn[e]=t,this._customAlphaTestSortCompareFn[e]=i,this._customTransparentSortCompareFn[e]=n,this._renderingGroups[e]){const t=this._renderingGroups[e];t.opaqueSortCompareFn=this._customOpaqueSortCompareFn[e],t.alphaTestSortCompareFn=this._customAlphaTestSortCompareFn[e],t.transparentSortCompareFn=this._customTransparentSortCompareFn[e]}}setRenderingAutoClearDepthStencil(e,t,i=!0,n=!0){this._autoClearDepthStencil[e]={autoClear:t,depth:i,stencil:n}}getAutoClearDepthStencilSetup(e){return this._autoClearDepthStencil[e]}}r.MAX_RENDERINGGROUPS=4,r.MIN_RENDERINGGROUPS=0,r.AUTOCLEAR=!0},9803:(e,t,i)=>{i.d(t,{x:()=>u});var n=i(1057),s=i(5757),r=i(1903),o=i(5670),a=i(1431),l=i(7616),h=i(4141),c=i(4649);class u{getRenderCamera(e){if(this._renderCamera)return this._renderCamera;{let t;return t=this.originalScene.activeCameras&&this.originalScene.activeCameras.length>1?this.originalScene.activeCameras[this.originalScene.activeCameras.length-1]:this.originalScene.activeCamera,e&&t&&t.isRigCamera?t.rigParent:t}}setRenderCamera(e){this._renderCamera=e}_getSharedGizmoLight(){return this._sharedGizmoLight||(this._sharedGizmoLight=new l.e("shared gizmo light",new h.P(0,1,0),this.utilityLayerScene),this._sharedGizmoLight.intensity=2,this._sharedGizmoLight.groundColor=c.Wo.Gray()),this._sharedGizmoLight}static get DefaultUtilityLayer(){return null==u._DefaultUtilityLayer?u._CreateDefaultUtilityLayerFromScene(a.l.LastCreatedScene):u._DefaultUtilityLayer}static _CreateDefaultUtilityLayerFromScene(e){return u._DefaultUtilityLayer=new u(e),u._DefaultUtilityLayer.originalScene.onDisposeObservable.addOnce((()=>{u._DefaultUtilityLayer=null})),u._DefaultUtilityLayer}static get DefaultKeepDepthUtilityLayer(){return null==u._DefaultKeepDepthUtilityLayer&&(u._DefaultKeepDepthUtilityLayer=new u(a.l.LastCreatedScene),u._DefaultKeepDepthUtilityLayer.utilityLayerScene.autoClearDepthAndStencil=!1,u._DefaultKeepDepthUtilityLayer.originalScene.onDisposeObservable.addOnce((()=>{u._DefaultKeepDepthUtilityLayer=null}))),u._DefaultKeepDepthUtilityLayer}constructor(e,t=!0){this.originalScene=e,this._pointerCaptures={},this._lastPointerEvents={},this._sharedGizmoLight=null,this._renderCamera=null,this.pickUtilitySceneFirst=!0,this.shouldRender=!0,this.onlyCheckPointerDownEvents=!0,this.processAllEvents=!1,this.pickingEnabled=!0,this.onPointerOutObservable=new s.y$,this.utilityLayerScene=new n.x(e.getEngine(),{virtual:!0}),this.utilityLayerScene.useRightHandedSystem=e.useRightHandedSystem,this.utilityLayerScene._allowPostProcessClearColor=!1,this.utilityLayerScene.postProcessesEnabled=!1,this.utilityLayerScene.detachControl(),t&&(this._originalPointerObserver=e.onPrePointerObservable.add((t=>{if(!this.utilityLayerScene.activeCamera)return;if(!this.pickingEnabled)return;if(!this.processAllEvents&&t.type!==r.kD.POINTERMOVE&&t.type!==r.kD.POINTERUP&&t.type!==r.kD.POINTERDOWN&&t.type!==r.kD.POINTERDOUBLETAP)return;this.utilityLayerScene.pointerX=e.pointerX,this.utilityLayerScene.pointerY=e.pointerY;const i=t.event;if(e.isPointerCaptured(i.pointerId))return void(this._pointerCaptures[i.pointerId]=!1);const n=i=>{let n=null;if(t.nearInteractionPickingInfo)n=t.nearInteractionPickingInfo.pickedMesh.getScene()==i?t.nearInteractionPickingInfo:new o.p;else if(i!==this.utilityLayerScene&&t.originalPickingInfo)n=t.originalPickingInfo;else{let s=null;this._renderCamera&&(s=i._activeCamera,i._activeCamera=this._renderCamera,t.ray=null),n=t.ray?i.pickWithRay(t.ray):i.pick(e.pointerX,e.pointerY),s&&(i._activeCamera=s)}return n},s=n(this.utilityLayerScene);if(!t.ray&&s&&(t.ray=s.ray),this.utilityLayerScene.onPrePointerObservable.notifyObservers(t),this.onlyCheckPointerDownEvents&&t.type!=r.kD.POINTERDOWN)return t.skipOnPointerObservable||this.utilityLayerScene.onPointerObservable.notifyObservers(new r.R5(t.type,t.event,s),t.type),void(t.type===r.kD.POINTERUP&&this._pointerCaptures[i.pointerId]&&(this._pointerCaptures[i.pointerId]=!1));if(this.utilityLayerScene.autoClearDepthAndStencil||this.pickUtilitySceneFirst)s&&s.hit&&(t.skipOnPointerObservable||this.utilityLayerScene.onPointerObservable.notifyObservers(new r.R5(t.type,t.event,s),t.type),t.skipOnPointerObservable=!0);else{const i=n(e),o=t.event;i&&s&&(0===s.distance&&i.pickedMesh?this.mainSceneTrackerPredicate&&this.mainSceneTrackerPredicate(i.pickedMesh)?(this._notifyObservers(t,i,o),t.skipOnPointerObservable=!0):t.type===r.kD.POINTERDOWN?this._pointerCaptures[o.pointerId]=!0:t.type!==r.kD.POINTERMOVE&&t.type!==r.kD.POINTERUP||(this._lastPointerEvents[o.pointerId]&&(this.onPointerOutObservable.notifyObservers(o.pointerId),delete this._lastPointerEvents[o.pointerId]),this._notifyObservers(t,i,o)):!this._pointerCaptures[o.pointerId]&&(s.distance<i.distance||0===i.distance)?(this._notifyObservers(t,s,o),t.skipOnPointerObservable||(t.skipOnPointerObservable=s.distance>0)):!this._pointerCaptures[o.pointerId]&&s.distance>=i.distance&&(this.mainSceneTrackerPredicate&&this.mainSceneTrackerPredicate(i.pickedMesh)?(this._notifyObservers(t,i,o),t.skipOnPointerObservable=!0):(t.type!==r.kD.POINTERMOVE&&t.type!==r.kD.POINTERUP||this._lastPointerEvents[o.pointerId]&&(this.onPointerOutObservable.notifyObservers(o.pointerId),delete this._lastPointerEvents[o.pointerId]),this._notifyObservers(t,s,o))),t.type===r.kD.POINTERUP&&this._pointerCaptures[o.pointerId]&&(this._pointerCaptures[o.pointerId]=!1))}})),this._originalPointerObserver&&e.onPrePointerObservable.makeObserverTopPriority(this._originalPointerObserver)),this.utilityLayerScene.autoClear=!1,this._afterRenderObserver=this.originalScene.onAfterRenderCameraObservable.add((e=>{this.shouldRender&&e==this.getRenderCamera()&&this.render()})),this._sceneDisposeObserver=this.originalScene.onDisposeObservable.add((()=>{this.dispose()})),this._updateCamera()}_notifyObservers(e,t,i){e.skipOnPointerObservable||(this.utilityLayerScene.onPointerObservable.notifyObservers(new r.R5(e.type,e.event,t),e.type),this._lastPointerEvents[i.pointerId]=!0)}render(){if(this._updateCamera(),this.utilityLayerScene.activeCamera){const e=this.utilityLayerScene.activeCamera.getScene(),t=this.utilityLayerScene.activeCamera;t._scene=this.utilityLayerScene,t.leftCamera&&(t.leftCamera._scene=this.utilityLayerScene),t.rightCamera&&(t.rightCamera._scene=this.utilityLayerScene),this.utilityLayerScene.render(!1),t._scene=e,t.leftCamera&&(t.leftCamera._scene=e),t.rightCamera&&(t.rightCamera._scene=e)}}dispose(){this.onPointerOutObservable.clear(),this._afterRenderObserver&&this.originalScene.onAfterCameraRenderObservable.remove(this._afterRenderObserver),this._sceneDisposeObserver&&this.originalScene.onDisposeObservable.remove(this._sceneDisposeObserver),this._originalPointerObserver&&this.originalScene.onPrePointerObservable.remove(this._originalPointerObserver),this.utilityLayerScene.dispose()}_updateCamera(){this.utilityLayerScene.cameraToUseForPointers=this.getRenderCamera(),this.utilityLayerScene.activeCamera=this.getRenderCamera()}}u._DefaultUtilityLayer=null,u._DefaultKeepDepthUtilityLayer=null},3206:(e,t,i)=>{i(8104).v.IncludesShadersStore.bakedVertexAnimation="#ifdef BAKED_VERTEX_ANIMATION_TEXTURE\n{\n#ifdef INSTANCES\n#define BVASNAME bakedVertexAnimationSettingsInstanced\n#else\n#define BVASNAME bakedVertexAnimationSettings\n#endif\nfloat VATStartFrame=BVASNAME.x;\nfloat VATEndFrame=BVASNAME.y;\nfloat VATOffsetFrame=BVASNAME.z;\nfloat VATSpeed=BVASNAME.w;\nfloat totalFrames=VATEndFrame-VATStartFrame+1.0;\nfloat time=bakedVertexAnimationTime*VATSpeed/totalFrames;\nfloat frameCorrection=time<1.0 ? 0.0 : 1.0;\nfloat numOfFrames=totalFrames-frameCorrection;\nfloat VATFrameNum=fract(time)*numOfFrames;\nVATFrameNum=mod(VATFrameNum+VATOffsetFrame,numOfFrames);\nVATFrameNum=floor(VATFrameNum);\nVATFrameNum+=VATStartFrame+frameCorrection;\nmat4 VATInfluence;\nVATInfluence=readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,matricesIndices[0],VATFrameNum)*matricesWeights[0];\n#if NUM_BONE_INFLUENCERS>1\nVATInfluence+=readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,matricesIndices[1],VATFrameNum)*matricesWeights[1];\n#endif\n#if NUM_BONE_INFLUENCERS>2\nVATInfluence+=readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,matricesIndices[2],VATFrameNum)*matricesWeights[2];\n#endif\n#if NUM_BONE_INFLUENCERS>3\nVATInfluence+=readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,matricesIndices[3],VATFrameNum)*matricesWeights[3];\n#endif\n#if NUM_BONE_INFLUENCERS>4\nVATInfluence+=readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,matricesIndicesExtra[0],VATFrameNum)*matricesWeightsExtra[0];\n#endif\n#if NUM_BONE_INFLUENCERS>5\nVATInfluence+=readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,matricesIndicesExtra[1],VATFrameNum)*matricesWeightsExtra[1];\n#endif\n#if NUM_BONE_INFLUENCERS>6\nVATInfluence+=readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,matricesIndicesExtra[2],VATFrameNum)*matricesWeightsExtra[2];\n#endif\n#if NUM_BONE_INFLUENCERS>7\nVATInfluence+=readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,matricesIndicesExtra[3],VATFrameNum)*matricesWeightsExtra[3];\n#endif\nfinalWorld=finalWorld*VATInfluence;\n}\n#endif\n"},493:(e,t,i)=>{i(8104).v.IncludesShadersStore.bakedVertexAnimationDeclaration="#ifdef BAKED_VERTEX_ANIMATION_TEXTURE\nuniform float bakedVertexAnimationTime;\nuniform vec2 bakedVertexAnimationTextureSizeInverted;\nuniform vec4 bakedVertexAnimationSettings;\nuniform sampler2D bakedVertexAnimationTexture;\n#ifdef INSTANCES\nattribute vec4 bakedVertexAnimationSettingsInstanced;\n#endif\n#define inline\nmat4 readMatrixFromRawSamplerVAT(sampler2D smp,float index,float frame)\n{\nfloat offset=index*4.0;\nfloat frameUV=(frame+0.5)*bakedVertexAnimationTextureSizeInverted.y;\nfloat dx=bakedVertexAnimationTextureSizeInverted.x;\nvec4 m0=texture2D(smp,vec2(dx*(offset+0.5),frameUV));\nvec4 m1=texture2D(smp,vec2(dx*(offset+1.5),frameUV));\nvec4 m2=texture2D(smp,vec2(dx*(offset+2.5),frameUV));\nvec4 m3=texture2D(smp,vec2(dx*(offset+3.5),frameUV));\nreturn mat4(m0,m1,m2,m3);\n}\n#endif\n"},7520:(e,t,i)=>{i(8104).v.IncludesShadersStore.bonesDeclaration="#if NUM_BONE_INFLUENCERS>0\nattribute vec4 matricesIndices;\nattribute vec4 matricesWeights;\n#if NUM_BONE_INFLUENCERS>4\nattribute vec4 matricesIndicesExtra;\nattribute vec4 matricesWeightsExtra;\n#endif\n#ifndef BAKED_VERTEX_ANIMATION_TEXTURE\n#ifdef BONETEXTURE\nuniform sampler2D boneSampler;\nuniform float boneTextureWidth;\n#else\nuniform mat4 mBones[BonesPerMesh];\n#ifdef BONES_VELOCITY_ENABLED\nuniform mat4 mPreviousBones[BonesPerMesh];\n#endif\n#endif\n#ifdef BONETEXTURE\n#define inline\nmat4 readMatrixFromRawSampler(sampler2D smp,float index)\n{\nfloat offset=index *4.0;\nfloat dx=1.0/boneTextureWidth;\nvec4 m0=texture2D(smp,vec2(dx*(offset+0.5),0.));\nvec4 m1=texture2D(smp,vec2(dx*(offset+1.5),0.));\nvec4 m2=texture2D(smp,vec2(dx*(offset+2.5),0.));\nvec4 m3=texture2D(smp,vec2(dx*(offset+3.5),0.));\nreturn mat4(m0,m1,m2,m3);\n}\n#endif\n#endif\n#endif\n"},6655:(e,t,i)=>{i(8104).v.IncludesShadersStore.bonesVertex="#ifndef BAKED_VERTEX_ANIMATION_TEXTURE\n#if NUM_BONE_INFLUENCERS>0\nmat4 influence;\n#ifdef BONETEXTURE\ninfluence=readMatrixFromRawSampler(boneSampler,matricesIndices[0])*matricesWeights[0];\n#if NUM_BONE_INFLUENCERS>1\ninfluence+=readMatrixFromRawSampler(boneSampler,matricesIndices[1])*matricesWeights[1];\n#endif\n#if NUM_BONE_INFLUENCERS>2\ninfluence+=readMatrixFromRawSampler(boneSampler,matricesIndices[2])*matricesWeights[2];\n#endif\n#if NUM_BONE_INFLUENCERS>3\ninfluence+=readMatrixFromRawSampler(boneSampler,matricesIndices[3])*matricesWeights[3];\n#endif\n#if NUM_BONE_INFLUENCERS>4\ninfluence+=readMatrixFromRawSampler(boneSampler,matricesIndicesExtra[0])*matricesWeightsExtra[0];\n#endif\n#if NUM_BONE_INFLUENCERS>5\ninfluence+=readMatrixFromRawSampler(boneSampler,matricesIndicesExtra[1])*matricesWeightsExtra[1];\n#endif\n#if NUM_BONE_INFLUENCERS>6\ninfluence+=readMatrixFromRawSampler(boneSampler,matricesIndicesExtra[2])*matricesWeightsExtra[2];\n#endif\n#if NUM_BONE_INFLUENCERS>7\ninfluence+=readMatrixFromRawSampler(boneSampler,matricesIndicesExtra[3])*matricesWeightsExtra[3];\n#endif\n#else\ninfluence=mBones[int(matricesIndices[0])]*matricesWeights[0];\n#if NUM_BONE_INFLUENCERS>1\ninfluence+=mBones[int(matricesIndices[1])]*matricesWeights[1];\n#endif\n#if NUM_BONE_INFLUENCERS>2\ninfluence+=mBones[int(matricesIndices[2])]*matricesWeights[2];\n#endif\n#if NUM_BONE_INFLUENCERS>3\ninfluence+=mBones[int(matricesIndices[3])]*matricesWeights[3];\n#endif\n#if NUM_BONE_INFLUENCERS>4\ninfluence+=mBones[int(matricesIndicesExtra[0])]*matricesWeightsExtra[0];\n#endif\n#if NUM_BONE_INFLUENCERS>5\ninfluence+=mBones[int(matricesIndicesExtra[1])]*matricesWeightsExtra[1];\n#endif\n#if NUM_BONE_INFLUENCERS>6\ninfluence+=mBones[int(matricesIndicesExtra[2])]*matricesWeightsExtra[2];\n#endif\n#if NUM_BONE_INFLUENCERS>7\ninfluence+=mBones[int(matricesIndicesExtra[3])]*matricesWeightsExtra[3];\n#endif\n#endif\nfinalWorld=finalWorld*influence;\n#endif\n#endif\n"},2321:(e,t,i)=>{i(8104).v.IncludesShadersStore.bumpFragment="vec2 uvOffset=vec2(0.0,0.0);\n#if defined(BUMP) || defined(PARALLAX) || defined(DETAIL)\n#ifdef NORMALXYSCALE\nfloat normalScale=1.0;\n#elif defined(BUMP)\nfloat normalScale=vBumpInfos.y;\n#else\nfloat normalScale=1.0;\n#endif\n#if defined(TANGENT) && defined(NORMAL)\nmat3 TBN=vTBN;\n#elif defined(BUMP)\nvec2 TBNUV=gl_FrontFacing ? vBumpUV : -vBumpUV;\nmat3 TBN=cotangent_frame(normalW*normalScale,vPositionW,TBNUV,vTangentSpaceParams);\n#else\nvec2 TBNUV=gl_FrontFacing ? vDetailUV : -vDetailUV;\nmat3 TBN=cotangent_frame(normalW*normalScale,vPositionW,TBNUV,vec2(1.,1.));\n#endif\n#elif defined(ANISOTROPIC)\n#if defined(TANGENT) && defined(NORMAL)\nmat3 TBN=vTBN;\n#else\nvec2 TBNUV=gl_FrontFacing ? vMainUV1 : -vMainUV1;\nmat3 TBN=cotangent_frame(normalW,vPositionW,TBNUV,vec2(1.,1.));\n#endif\n#endif\n#ifdef PARALLAX\nmat3 invTBN=transposeMat3(TBN);\n#ifdef PARALLAXOCCLUSION\nuvOffset=parallaxOcclusion(invTBN*-viewDirectionW,invTBN*normalW,vBumpUV,vBumpInfos.z);\n#else\nuvOffset=parallaxOffset(invTBN*viewDirectionW,vBumpInfos.z);\n#endif\n#endif\n#ifdef DETAIL\nvec4 detailColor=texture2D(detailSampler,vDetailUV+uvOffset);\nvec2 detailNormalRG=detailColor.wy*2.0-1.0;\nfloat detailNormalB=sqrt(1.-saturate(dot(detailNormalRG,detailNormalRG)));\nvec3 detailNormal=vec3(detailNormalRG,detailNormalB);\n#endif\n#ifdef BUMP\n#ifdef OBJECTSPACE_NORMALMAP\n#define CUSTOM_FRAGMENT_BUMP_FRAGMENT\nnormalW=normalize(texture2D(bumpSampler,vBumpUV).xyz *2.0-1.0);\nnormalW=normalize(mat3(normalMatrix)*normalW);\n#elif !defined(DETAIL)\nnormalW=perturbNormal(TBN,texture2D(bumpSampler,vBumpUV+uvOffset).xyz,vBumpInfos.y);\n#else\nvec3 bumpNormal=texture2D(bumpSampler,vBumpUV+uvOffset).xyz*2.0-1.0;\n#if DETAIL_NORMALBLENDMETHOD==0 \ndetailNormal.xy*=vDetailInfos.z;\nvec3 blendedNormal=normalize(vec3(bumpNormal.xy+detailNormal.xy,bumpNormal.z*detailNormal.z));\n#elif DETAIL_NORMALBLENDMETHOD==1 \ndetailNormal.xy*=vDetailInfos.z;\nbumpNormal+=vec3(0.0,0.0,1.0);\ndetailNormal*=vec3(-1.0,-1.0,1.0);\nvec3 blendedNormal=bumpNormal*dot(bumpNormal,detailNormal)/bumpNormal.z-detailNormal;\n#endif\nnormalW=perturbNormalBase(TBN,blendedNormal,vBumpInfos.y);\n#endif\n#elif defined(DETAIL)\ndetailNormal.xy*=vDetailInfos.z;\nnormalW=perturbNormalBase(TBN,detailNormal,vDetailInfos.z);\n#endif\n"},7441:(e,t,i)=>{var n=i(8104);i(1015);n.v.IncludesShadersStore.bumpFragmentFunctions="#if defined(BUMP)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,BUMP,_VARYINGNAME_,Bump,_SAMPLERNAME_,bump)\n#endif\n#if defined(DETAIL)\n#include<samplerFragmentDeclaration>(_DEFINENAME_,DETAIL,_VARYINGNAME_,Detail,_SAMPLERNAME_,detail)\n#endif\n#if defined(BUMP) && defined(PARALLAX)\nconst float minSamples=4.;\nconst float maxSamples=15.;\nconst int iMaxSamples=15;\nvec2 parallaxOcclusion(vec3 vViewDirCoT,vec3 vNormalCoT,vec2 texCoord,float parallaxScale) {\nfloat parallaxLimit=length(vViewDirCoT.xy)/vViewDirCoT.z;\nparallaxLimit*=parallaxScale;\nvec2 vOffsetDir=normalize(vViewDirCoT.xy);\nvec2 vMaxOffset=vOffsetDir*parallaxLimit;\nfloat numSamples=maxSamples+(dot(vViewDirCoT,vNormalCoT)*(minSamples-maxSamples));\nfloat stepSize=1.0/numSamples;\nfloat currRayHeight=1.0;\nvec2 vCurrOffset=vec2(0,0);\nvec2 vLastOffset=vec2(0,0);\nfloat lastSampledHeight=1.0;\nfloat currSampledHeight=1.0;\nbool keepWorking=true;\nfor (int i=0; i<iMaxSamples; i++)\n{\ncurrSampledHeight=texture2D(bumpSampler,texCoord+vCurrOffset).w;\nif (!keepWorking)\n{\n}\nelse if (currSampledHeight>currRayHeight)\n{\nfloat delta1=currSampledHeight-currRayHeight;\nfloat delta2=(currRayHeight+stepSize)-lastSampledHeight;\nfloat ratio=delta1/(delta1+delta2);\nvCurrOffset=(ratio)* vLastOffset+(1.0-ratio)*vCurrOffset;\nkeepWorking=false;\n}\nelse\n{\ncurrRayHeight-=stepSize;\nvLastOffset=vCurrOffset;\nvCurrOffset+=stepSize*vMaxOffset;\nlastSampledHeight=currSampledHeight;\n}\n}\nreturn vCurrOffset;\n}\nvec2 parallaxOffset(vec3 viewDir,float heightScale)\n{\nfloat height=texture2D(bumpSampler,vBumpUV).w;\nvec2 texCoordOffset=heightScale*viewDir.xy*height;\nreturn -texCoordOffset;\n}\n#endif\n"},8882:(e,t,i)=>{i(8104).v.IncludesShadersStore.bumpFragmentMainFunctions="#if defined(BUMP) || defined(CLEARCOAT_BUMP) || defined(ANISOTROPIC) || defined(DETAIL)\n#if defined(TANGENT) && defined(NORMAL) \nvarying mat3 vTBN;\n#endif\n#ifdef OBJECTSPACE_NORMALMAP\nuniform mat4 normalMatrix;\n#if defined(WEBGL2) || defined(WEBGPU)\nmat4 toNormalMatrix(mat4 wMatrix)\n{\nmat4 ret=inverse(wMatrix);\nret=transpose(ret);\nret[0][3]=0.;\nret[1][3]=0.;\nret[2][3]=0.;\nret[3]=vec4(0.,0.,0.,1.);\nreturn ret;\n}\n#else\nmat4 toNormalMatrix(mat4 m)\n{\nfloat\na00=m[0][0],a01=m[0][1],a02=m[0][2],a03=m[0][3],\na10=m[1][0],a11=m[1][1],a12=m[1][2],a13=m[1][3],\na20=m[2][0],a21=m[2][1],a22=m[2][2],a23=m[2][3],\na30=m[3][0],a31=m[3][1],a32=m[3][2],a33=m[3][3],\nb00=a00*a11-a01*a10,\nb01=a00*a12-a02*a10,\nb02=a00*a13-a03*a10,\nb03=a01*a12-a02*a11,\nb04=a01*a13-a03*a11,\nb05=a02*a13-a03*a12,\nb06=a20*a31-a21*a30,\nb07=a20*a32-a22*a30,\nb08=a20*a33-a23*a30,\nb09=a21*a32-a22*a31,\nb10=a21*a33-a23*a31,\nb11=a22*a33-a23*a32,\ndet=b00*b11-b01*b10+b02*b09+b03*b08-b04*b07+b05*b06;\nmat4 mi=mat4(\na11*b11-a12*b10+a13*b09,\na02*b10-a01*b11-a03*b09,\na31*b05-a32*b04+a33*b03,\na22*b04-a21*b05-a23*b03,\na12*b08-a10*b11-a13*b07,\na00*b11-a02*b08+a03*b07,\na32*b02-a30*b05-a33*b01,\na20*b05-a22*b02+a23*b01,\na10*b10-a11*b08+a13*b06,\na01*b08-a00*b10-a03*b06,\na30*b04-a31*b02+a33*b00,\na21*b02-a20*b04-a23*b00,\na11*b07-a10*b09-a12*b06,\na00*b09-a01*b07+a02*b06,\na31*b01-a30*b03-a32*b00,\na20*b03-a21*b01+a22*b00)/det;\nreturn mat4(mi[0][0],mi[1][0],mi[2][0],mi[3][0],\nmi[0][1],mi[1][1],mi[2][1],mi[3][1],\nmi[0][2],mi[1][2],mi[2][2],mi[3][2],\nmi[0][3],mi[1][3],mi[2][3],mi[3][3]);\n}\n#endif\n#endif\nvec3 perturbNormalBase(mat3 cotangentFrame,vec3 normal,float scale)\n{\n#ifdef NORMALXYSCALE\nnormal=normalize(normal*vec3(scale,scale,1.0));\n#endif\nreturn normalize(cotangentFrame*normal);\n}\nvec3 perturbNormal(mat3 cotangentFrame,vec3 textureSample,float scale)\n{\nreturn perturbNormalBase(cotangentFrame,textureSample*2.0-1.0,scale);\n}\nmat3 cotangent_frame(vec3 normal,vec3 p,vec2 uv,vec2 tangentSpaceParams)\n{\nvec3 dp1=dFdx(p);\nvec3 dp2=dFdy(p);\nvec2 duv1=dFdx(uv);\nvec2 duv2=dFdy(uv);\nvec3 dp2perp=cross(dp2,normal);\nvec3 dp1perp=cross(normal,dp1);\nvec3 tangent=dp2perp*duv1.x+dp1perp*duv2.x;\nvec3 bitangent=dp2perp*duv1.y+dp1perp*duv2.y;\ntangent*=tangentSpaceParams.x;\nbitangent*=tangentSpaceParams.y;\nfloat det=max(dot(tangent,tangent),dot(bitangent,bitangent));\nfloat invmax=det==0.0 ? 0.0 : inversesqrt(det);\nreturn mat3(tangent*invmax,bitangent*invmax,normal);\n}\n#endif\n"},6255:(e,t,i)=>{i(8104).v.IncludesShadersStore.bumpVertex="#if defined(BUMP) || defined(PARALLAX) || defined(CLEARCOAT_BUMP) || defined(ANISOTROPIC)\n#if defined(TANGENT) && defined(NORMAL)\nvec3 tbnNormal=normalize(normalUpdated);\nvec3 tbnTangent=normalize(tangentUpdated.xyz);\nvec3 tbnBitangent=cross(tbnNormal,tbnTangent)*tangentUpdated.w;\nvTBN=mat3(finalWorld)*mat3(tbnTangent,tbnBitangent,tbnNormal);\n#endif\n#endif\n"},2838:(e,t,i)=>{i(8104).v.IncludesShadersStore.bumpVertexDeclaration="#if defined(BUMP) || defined(PARALLAX) || defined(CLEARCOAT_BUMP) || defined(ANISOTROPIC)\n#if defined(TANGENT) && defined(NORMAL) \nvarying mat3 vTBN;\n#endif\n#endif\n"},5791:(e,t,i)=>{i(8104).v.IncludesShadersStore.clipPlaneFragment="#if defined(CLIPPLANE) || defined(CLIPPLANE2) || defined(CLIPPLANE3) || defined(CLIPPLANE4) || defined(CLIPPLANE5) || defined(CLIPPLANE6)\nif (false) {}\n#endif\n#ifdef CLIPPLANE\nelse if (fClipDistance>0.0)\n{\ndiscard;\n}\n#endif\n#ifdef CLIPPLANE2\nelse if (fClipDistance2>0.0)\n{\ndiscard;\n}\n#endif\n#ifdef CLIPPLANE3\nelse if (fClipDistance3>0.0)\n{\ndiscard;\n}\n#endif\n#ifdef CLIPPLANE4\nelse if (fClipDistance4>0.0)\n{\ndiscard;\n}\n#endif\n#ifdef CLIPPLANE5\nelse if (fClipDistance5>0.0)\n{\ndiscard;\n}\n#endif\n#ifdef CLIPPLANE6\nelse if (fClipDistance6>0.0)\n{\ndiscard;\n}\n#endif\n"},6390:(e,t,i)=>{i(8104).v.IncludesShadersStore.clipPlaneFragmentDeclaration="#ifdef CLIPPLANE\nvarying float fClipDistance;\n#endif\n#ifdef CLIPPLANE2\nvarying float fClipDistance2;\n#endif\n#ifdef CLIPPLANE3\nvarying float fClipDistance3;\n#endif\n#ifdef CLIPPLANE4\nvarying float fClipDistance4;\n#endif\n#ifdef CLIPPLANE5\nvarying float fClipDistance5;\n#endif\n#ifdef CLIPPLANE6\nvarying float fClipDistance6;\n#endif\n"},5215:(e,t,i)=>{i(8104).v.IncludesShadersStore.clipPlaneVertex="#ifdef CLIPPLANE\nfClipDistance=dot(worldPos,vClipPlane);\n#endif\n#ifdef CLIPPLANE2\nfClipDistance2=dot(worldPos,vClipPlane2);\n#endif\n#ifdef CLIPPLANE3\nfClipDistance3=dot(worldPos,vClipPlane3);\n#endif\n#ifdef CLIPPLANE4\nfClipDistance4=dot(worldPos,vClipPlane4);\n#endif\n#ifdef CLIPPLANE5\nfClipDistance5=dot(worldPos,vClipPlane5);\n#endif\n#ifdef CLIPPLANE6\nfClipDistance6=dot(worldPos,vClipPlane6);\n#endif\n"},6343:(e,t,i)=>{i(8104).v.IncludesShadersStore.clipPlaneVertexDeclaration="#ifdef CLIPPLANE\nuniform vec4 vClipPlane;\nvarying float fClipDistance;\n#endif\n#ifdef CLIPPLANE2\nuniform vec4 vClipPlane2;\nvarying float fClipDistance2;\n#endif\n#ifdef CLIPPLANE3\nuniform vec4 vClipPlane3;\nvarying float fClipDistance3;\n#endif\n#ifdef CLIPPLANE4\nuniform vec4 vClipPlane4;\nvarying float fClipDistance4;\n#endif\n#ifdef CLIPPLANE5\nuniform vec4 vClipPlane5;\nvarying float fClipDistance5;\n#endif\n#ifdef CLIPPLANE6\nuniform vec4 vClipPlane6;\nvarying float fClipDistance6;\n#endif\n"},8074:(e,t,i)=>{i(8104).v.IncludesShadersStore.decalFragment="#ifdef DECAL\n#ifdef GAMMADECAL\ndecalColor.rgb=toLinearSpace(decalColor.rgb);\n#endif\n#ifdef DECAL_SMOOTHALPHA\ndecalColor.a*=decalColor.a;\n#endif\nsurfaceAlbedo.rgb=mix(surfaceAlbedo.rgb,decalColor.rgb,decalColor.a);\n#endif\n"},3055:(e,t,i)=>{i(8104).v.IncludesShadersStore.decalFragmentDeclaration="#ifdef DECAL\nuniform vec4 vDecalInfos;\n#endif\n"},5613:(e,t,i)=>{i(8104).v.IncludesShadersStore.decalVertexDeclaration="#ifdef DECAL\nuniform vec4 vDecalInfos;\nuniform mat4 decalMatrix;\n#endif\n"},783:(e,t,i)=>{i(8104).v.IncludesShadersStore.depthPrePass="#ifdef DEPTHPREPASS\ngl_FragColor=vec4(0.,0.,0.,1.0);\nreturn;\n#endif\n"},6043:(e,t,i)=>{i(8104).v.IncludesShadersStore.fogFragment="#ifdef FOG\nfloat fog=CalcFogFactor();\n#ifdef PBR\nfog=toLinearSpace(fog);\n#endif\ncolor.rgb=mix(vFogColor,color.rgb,fog);\n#endif\n"},9519:(e,t,i)=>{i(8104).v.IncludesShadersStore.fogFragmentDeclaration="#ifdef FOG\n#define FOGMODE_NONE 0.\n#define FOGMODE_EXP 1.\n#define FOGMODE_EXP2 2.\n#define FOGMODE_LINEAR 3.\n#define E 2.71828\nuniform vec4 vFogInfos;\nuniform vec3 vFogColor;\nvarying vec3 vFogDistance;\nfloat CalcFogFactor()\n{\nfloat fogCoeff=1.0;\nfloat fogStart=vFogInfos.y;\nfloat fogEnd=vFogInfos.z;\nfloat fogDensity=vFogInfos.w;\nfloat fogDistance=length(vFogDistance);\nif (FOGMODE_LINEAR==vFogInfos.x)\n{\nfogCoeff=(fogEnd-fogDistance)/(fogEnd-fogStart);\n}\nelse if (FOGMODE_EXP==vFogInfos.x)\n{\nfogCoeff=1.0/pow(E,fogDistance*fogDensity);\n}\nelse if (FOGMODE_EXP2==vFogInfos.x)\n{\nfogCoeff=1.0/pow(E,fogDistance*fogDistance*fogDensity*fogDensity);\n}\nreturn clamp(fogCoeff,0.0,1.0);\n}\n#endif\n"},962:(e,t,i)=>{i(8104).v.IncludesShadersStore.fogVertex="#ifdef FOG\nvFogDistance=(view*worldPos).xyz;\n#endif\n"},9042:(e,t,i)=>{i(8104).v.IncludesShadersStore.fogVertexDeclaration="#ifdef FOG\nvarying vec3 vFogDistance;\n#endif\n"},8491:(e,t,i)=>{i(8104).v.IncludesShadersStore.fresnelFunction="#ifdef FRESNEL\nfloat computeFresnelTerm(vec3 viewDirection,vec3 worldNormal,float bias,float power)\n{\nfloat fresnelTerm=pow(bias+abs(dot(viewDirection,worldNormal)),power);\nreturn clamp(fresnelTerm,0.,1.);\n}\n#endif\n"},4115:(e,t,i)=>{i(8104).v.IncludesShadersStore.hdrFilteringFunctions="#ifdef NUM_SAMPLES\n#if NUM_SAMPLES>0\n#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\nfloat radicalInverse_VdC(uint bits) \n{\nbits=(bits<<16u) | (bits>>16u);\nbits=((bits & 0x55555555u)<<1u) | ((bits & 0xAAAAAAAAu)>>1u);\nbits=((bits & 0x33333333u)<<2u) | ((bits & 0xCCCCCCCCu)>>2u);\nbits=((bits & 0x0F0F0F0Fu)<<4u) | ((bits & 0xF0F0F0F0u)>>4u);\nbits=((bits & 0x00FF00FFu)<<8u) | ((bits & 0xFF00FF00u)>>8u);\nreturn float(bits)*2.3283064365386963e-10; \n}\nvec2 hammersley(uint i,uint N)\n{\nreturn vec2(float(i)/float(N),radicalInverse_VdC(i));\n}\n#else\nfloat vanDerCorpus(int n,int base)\n{\nfloat invBase=1.0/float(base);\nfloat denom =1.0;\nfloat result =0.0;\nfor(int i=0; i<32; ++i)\n{\nif(n>0)\n{\ndenom =mod(float(n),2.0);\nresult+=denom*invBase;\ninvBase=invBase/2.0;\nn =int(float(n)/2.0);\n}\n}\nreturn result;\n}\nvec2 hammersley(int i,int N)\n{\nreturn vec2(float(i)/float(N),vanDerCorpus(i,2));\n}\n#endif\nfloat log4(float x) {\nreturn log2(x)/2.;\n}\nconst float NUM_SAMPLES_FLOAT=float(NUM_SAMPLES);\nconst float NUM_SAMPLES_FLOAT_INVERSED=1./NUM_SAMPLES_FLOAT;\nconst float K=4.;\n#define inline\nvec3 irradiance(samplerCube inputTexture,vec3 inputN,vec2 filteringInfo)\n{\nvec3 n=normalize(inputN);\nvec3 result=vec3(0.0);\nvec3 tangent=abs(n.z)<0.999 ? vec3(0.,0.,1.) : vec3(1.,0.,0.);\ntangent=normalize(cross(tangent,n));\nvec3 bitangent=cross(n,tangent);\nmat3 tbn=mat3(tangent,bitangent,n);\nfloat maxLevel=filteringInfo.y;\nfloat dim0=filteringInfo.x;\nfloat omegaP=(4.*PI)/(6.*dim0*dim0);\n#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\nfor(uint i=0u; i<NUM_SAMPLES; ++i)\n#else\nfor(int i=0; i<NUM_SAMPLES; ++i)\n#endif\n{\nvec2 Xi=hammersley(i,NUM_SAMPLES);\nvec3 Ls=hemisphereCosSample(Xi);\nLs=normalize(Ls);\nvec3 Ns=vec3(0.,0.,1.);\nfloat NoL=dot(Ns,Ls);\nif (NoL>0.) {\nfloat pdf_inversed=PI/NoL;\nfloat omegaS=NUM_SAMPLES_FLOAT_INVERSED*pdf_inversed;\nfloat l=log4(omegaS)-log4(omegaP)+log4(K);\nfloat mipLevel=clamp(l,0.0,maxLevel);\nvec3 c=textureCubeLodEXT(inputTexture,tbn*Ls,mipLevel).rgb;\n#ifdef GAMMA_INPUT\nc=toLinearSpace(c);\n#endif\nresult+=c;\n}\n}\nresult=result*NUM_SAMPLES_FLOAT_INVERSED;\nreturn result;\n}\n#define inline\nvec3 radiance(float alphaG,samplerCube inputTexture,vec3 inputN,vec2 filteringInfo)\n{\nvec3 n=normalize(inputN);\nif (alphaG==0.) {\nvec3 c=textureCube(inputTexture,n).rgb;\n#ifdef GAMMA_INPUT\nc=toLinearSpace(c);\n#endif\nreturn c;\n} else {\nvec3 result=vec3(0.);\nvec3 tangent=abs(n.z)<0.999 ? vec3(0.,0.,1.) : vec3(1.,0.,0.);\ntangent=normalize(cross(tangent,n));\nvec3 bitangent=cross(n,tangent);\nmat3 tbn=mat3(tangent,bitangent,n);\nfloat maxLevel=filteringInfo.y;\nfloat dim0=filteringInfo.x;\nfloat omegaP=(4.*PI)/(6.*dim0*dim0);\nfloat weight=0.;\n#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\nfor(uint i=0u; i<NUM_SAMPLES; ++i)\n#else\nfor(int i=0; i<NUM_SAMPLES; ++i)\n#endif\n{\nvec2 Xi=hammersley(i,NUM_SAMPLES);\nvec3 H=hemisphereImportanceSampleDggx(Xi,alphaG);\nfloat NoV=1.;\nfloat NoH=H.z;\nfloat NoH2=H.z*H.z;\nfloat NoL=2.*NoH2-1.;\nvec3 L=vec3(2.*NoH*H.x,2.*NoH*H.y,NoL);\nL=normalize(L);\nif (NoL>0.) {\nfloat pdf_inversed=4./normalDistributionFunction_TrowbridgeReitzGGX(NoH,alphaG);\nfloat omegaS=NUM_SAMPLES_FLOAT_INVERSED*pdf_inversed;\nfloat l=log4(omegaS)-log4(omegaP)+log4(K);\nfloat mipLevel=clamp(float(l),0.0,maxLevel);\nweight+=NoL;\nvec3 c=textureCubeLodEXT(inputTexture,tbn*L,mipLevel).rgb;\n#ifdef GAMMA_INPUT\nc=toLinearSpace(c);\n#endif\nresult+=c*NoL;\n}\n}\nresult=result/weight;\nreturn result;\n}\n}\n#endif\n#endif\n"},1423:(e,t,i)=>{i(8104).v.IncludesShadersStore.helperFunctions="const float PI=3.1415926535897932384626433832795;\nconst float HALF_MIN=5.96046448e-08; \nconst float LinearEncodePowerApprox=2.2;\nconst float GammaEncodePowerApprox=1.0/LinearEncodePowerApprox;\nconst vec3 LuminanceEncodeApprox=vec3(0.2126,0.7152,0.0722);\nconst float Epsilon=0.0000001;\n#define saturate(x) clamp(x,0.0,1.0)\n#define absEps(x) abs(x)+Epsilon\n#define maxEps(x) max(x,Epsilon)\n#define saturateEps(x) clamp(x,Epsilon,1.0)\nmat3 transposeMat3(mat3 inMatrix) {\nvec3 i0=inMatrix[0];\nvec3 i1=inMatrix[1];\nvec3 i2=inMatrix[2];\nmat3 outMatrix=mat3(\nvec3(i0.x,i1.x,i2.x),\nvec3(i0.y,i1.y,i2.y),\nvec3(i0.z,i1.z,i2.z)\n);\nreturn outMatrix;\n}\nmat3 inverseMat3(mat3 inMatrix) {\nfloat a00=inMatrix[0][0],a01=inMatrix[0][1],a02=inMatrix[0][2];\nfloat a10=inMatrix[1][0],a11=inMatrix[1][1],a12=inMatrix[1][2];\nfloat a20=inMatrix[2][0],a21=inMatrix[2][1],a22=inMatrix[2][2];\nfloat b01=a22*a11-a12*a21;\nfloat b11=-a22*a10+a12*a20;\nfloat b21=a21*a10-a11*a20;\nfloat det=a00*b01+a01*b11+a02*b21;\nreturn mat3(b01,(-a22*a01+a02*a21),(a12*a01-a02*a11),\nb11,(a22*a00-a02*a20),(-a12*a00+a02*a10),\nb21,(-a21*a00+a01*a20),(a11*a00-a01*a10))/det;\n}\n#if USE_EXACT_SRGB_CONVERSIONS\nvec3 toLinearSpaceExact(vec3 color)\n{\nvec3 nearZeroSection=0.0773993808*color;\nvec3 remainingSection=pow(0.947867299*(color+vec3(0.055)),vec3(2.4));\n#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\nreturn mix(remainingSection,nearZeroSection,lessThanEqual(color,vec3(0.04045)));\n#else\nreturn\nvec3(\ncolor.r<=0.04045 ? nearZeroSection.r : remainingSection.r,\ncolor.g<=0.04045 ? nearZeroSection.g : remainingSection.g,\ncolor.b<=0.04045 ? nearZeroSection.b : remainingSection.b);\n#endif\n}\nvec3 toGammaSpaceExact(vec3 color)\n{\nvec3 nearZeroSection=12.92*color;\nvec3 remainingSection=1.055*pow(color,vec3(0.41666))-vec3(0.055);\n#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\nreturn mix(remainingSection,nearZeroSection,lessThanEqual(color,vec3(0.0031308)));\n#else\nreturn\nvec3(\ncolor.r<=0.0031308 ? nearZeroSection.r : remainingSection.r,\ncolor.g<=0.0031308 ? nearZeroSection.g : remainingSection.g,\ncolor.b<=0.0031308 ? nearZeroSection.b : remainingSection.b);\n#endif\n}\n#endif\nfloat toLinearSpace(float color)\n{\n#if USE_EXACT_SRGB_CONVERSIONS\nfloat nearZeroSection=0.0773993808*color;\nfloat remainingSection=pow(0.947867299*(color+0.055),2.4);\nreturn color<=0.04045 ? nearZeroSection : remainingSection;\n#else\nreturn pow(color,LinearEncodePowerApprox);\n#endif\n}\nvec3 toLinearSpace(vec3 color)\n{\n#if USE_EXACT_SRGB_CONVERSIONS\nreturn toLinearSpaceExact(color);\n#else\nreturn pow(color,vec3(LinearEncodePowerApprox));\n#endif\n}\nvec4 toLinearSpace(vec4 color)\n{\n#if USE_EXACT_SRGB_CONVERSIONS\nreturn vec4(toLinearSpaceExact(color.rgb),color.a);\n#else\nreturn vec4(pow(color.rgb,vec3(LinearEncodePowerApprox)),color.a);\n#endif\n}\nfloat toGammaSpace(float color)\n{\n#if USE_EXACT_SRGB_CONVERSIONS\nfloat nearZeroSection=12.92*color;\nfloat remainingSection=1.055*pow(color,0.41666)-0.055;\nreturn color<=0.0031308 ? nearZeroSection : remainingSection;\n#else\nreturn pow(color,GammaEncodePowerApprox);\n#endif\n}\nvec3 toGammaSpace(vec3 color)\n{\n#if USE_EXACT_SRGB_CONVERSIONS\nreturn toGammaSpaceExact(color);\n#else\nreturn pow(color,vec3(GammaEncodePowerApprox));\n#endif\n}\nvec4 toGammaSpace(vec4 color)\n{\n#if USE_EXACT_SRGB_CONVERSIONS\nreturn vec4(toGammaSpaceExact(color.rgb),color.a);\n#else\nreturn vec4(pow(color.rgb,vec3(GammaEncodePowerApprox)),color.a);\n#endif\n}\nfloat square(float value)\n{\nreturn value*value;\n}\nvec3 square(vec3 value)\n{\nreturn value*value;\n}\nfloat pow5(float value) {\nfloat sq=value*value;\nreturn sq*sq*value;\n}\nfloat getLuminance(vec3 color)\n{\nreturn clamp(dot(color,LuminanceEncodeApprox),0.,1.);\n}\nfloat getRand(vec2 seed) {\nreturn fract(sin(dot(seed.xy ,vec2(12.9898,78.233)))*43758.5453);\n}\nfloat dither(vec2 seed,float varianceAmount) {\nfloat rand=getRand(seed);\nfloat normVariance=varianceAmount/255.0;\nfloat dither=mix(-normVariance,normVariance,rand);\nreturn dither;\n}\nconst float rgbdMaxRange=255.0;\nvec4 toRGBD(vec3 color) {\nfloat maxRGB=maxEps(max(color.r,max(color.g,color.b)));\nfloat D =max(rgbdMaxRange/maxRGB,1.);\nD =clamp(floor(D)/255.0,0.,1.);\nvec3 rgb=color.rgb*D;\nrgb=toGammaSpace(rgb);\nreturn vec4(clamp(rgb,0.,1.),D); \n}\nvec3 fromRGBD(vec4 rgbd) {\nrgbd.rgb=toLinearSpace(rgbd.rgb);\nreturn rgbd.rgb/rgbd.a;\n}\nvec3 parallaxCorrectNormal( vec3 vertexPos,vec3 origVec,vec3 cubeSize,vec3 cubePos ) {\nvec3 invOrigVec=vec3(1.0,1.0,1.0)/origVec;\nvec3 halfSize=cubeSize*0.5;\nvec3 intersecAtMaxPlane=(cubePos+halfSize-vertexPos)*invOrigVec;\nvec3 intersecAtMinPlane=(cubePos-halfSize-vertexPos)*invOrigVec;\nvec3 largestIntersec=max(intersecAtMaxPlane,intersecAtMinPlane);\nfloat distance=min(min(largestIntersec.x,largestIntersec.y),largestIntersec.z);\nvec3 intersectPositionWS=vertexPos+origVec*distance;\nreturn intersectPositionWS-cubePos;\n}\n"},689:(e,t,i)=>{i(8104).v.IncludesShadersStore.imageProcessingCompatibility="#ifdef IMAGEPROCESSINGPOSTPROCESS\ngl_FragColor.rgb=pow(gl_FragColor.rgb,vec3(2.2));\n#endif\n"},5141:(e,t,i)=>{i(8104).v.IncludesShadersStore.imageProcessingDeclaration="#ifdef EXPOSURE\nuniform float exposureLinear;\n#endif\n#ifdef CONTRAST\nuniform float contrast;\n#endif\n#if defined(VIGNETTE) || defined(DITHER)\nuniform vec2 vInverseScreenSize;\n#endif\n#ifdef VIGNETTE\nuniform vec4 vignetteSettings1;\nuniform vec4 vignetteSettings2;\n#endif\n#ifdef COLORCURVES\nuniform vec4 vCameraColorCurveNegative;\nuniform vec4 vCameraColorCurveNeutral;\nuniform vec4 vCameraColorCurvePositive;\n#endif\n#ifdef COLORGRADING\n#ifdef COLORGRADING3D\nuniform highp sampler3D txColorTransform;\n#else\nuniform sampler2D txColorTransform;\n#endif\nuniform vec4 colorTransformSettings;\n#endif\n#ifdef DITHER\nuniform float ditherIntensity;\n#endif\n"},3660:(e,t,i)=>{i(8104).v.IncludesShadersStore.imageProcessingFunctions="#if defined(COLORGRADING) && !defined(COLORGRADING3D)\n/** \n* Polyfill for SAMPLE_TEXTURE_3D,which is unsupported in WebGL.\n* sampler3dSetting.x=textureOffset (0.5/textureSize).\n* sampler3dSetting.y=textureSize.\n*/\n#define inline\nvec3 sampleTexture3D(sampler2D colorTransform,vec3 color,vec2 sampler3dSetting)\n{\nfloat sliceSize=2.0*sampler3dSetting.x; \n#ifdef SAMPLER3DGREENDEPTH\nfloat sliceContinuous=(color.g-sampler3dSetting.x)*sampler3dSetting.y;\n#else\nfloat sliceContinuous=(color.b-sampler3dSetting.x)*sampler3dSetting.y;\n#endif\nfloat sliceInteger=floor(sliceContinuous);\nfloat sliceFraction=sliceContinuous-sliceInteger;\n#ifdef SAMPLER3DGREENDEPTH\nvec2 sliceUV=color.rb;\n#else\nvec2 sliceUV=color.rg;\n#endif\nsliceUV.x*=sliceSize;\nsliceUV.x+=sliceInteger*sliceSize;\nsliceUV=saturate(sliceUV);\nvec4 slice0Color=texture2D(colorTransform,sliceUV);\nsliceUV.x+=sliceSize;\nsliceUV=saturate(sliceUV);\nvec4 slice1Color=texture2D(colorTransform,sliceUV);\nvec3 result=mix(slice0Color.rgb,slice1Color.rgb,sliceFraction);\n#ifdef SAMPLER3DBGRMAP\ncolor.rgb=result.rgb;\n#else\ncolor.rgb=result.bgr;\n#endif\nreturn color;\n}\n#endif\n#ifdef TONEMAPPING_ACES\nconst mat3 ACESInputMat=mat3(\nvec3(0.59719,0.07600,0.02840),\nvec3(0.35458,0.90834,0.13383),\nvec3(0.04823,0.01566,0.83777)\n);\nconst mat3 ACESOutputMat=mat3(\nvec3( 1.60475,-0.10208,-0.00327),\nvec3(-0.53108, 1.10813,-0.07276),\nvec3(-0.07367,-0.00605, 1.07602)\n);\nvec3 RRTAndODTFit(vec3 v)\n{\nvec3 a=v*(v+0.0245786)-0.000090537;\nvec3 b=v*(0.983729*v+0.4329510)+0.238081;\nreturn a/b;\n}\nvec3 ACESFitted(vec3 color)\n{\ncolor=ACESInputMat*color;\ncolor=RRTAndODTFit(color);\ncolor=ACESOutputMat*color;\ncolor=saturate(color);\nreturn color;\n}\n#endif\n#define CUSTOM_IMAGEPROCESSINGFUNCTIONS_DEFINITIONS\nvec4 applyImageProcessing(vec4 result) {\n#define CUSTOM_IMAGEPROCESSINGFUNCTIONS_UPDATERESULT_ATSTART\n#ifdef EXPOSURE\nresult.rgb*=exposureLinear;\n#endif\n#ifdef VIGNETTE\nvec2 viewportXY=gl_FragCoord.xy*vInverseScreenSize;\nviewportXY=viewportXY*2.0-1.0;\nvec3 vignetteXY1=vec3(viewportXY*vignetteSettings1.xy+vignetteSettings1.zw,1.0);\nfloat vignetteTerm=dot(vignetteXY1,vignetteXY1);\nfloat vignette=pow(vignetteTerm,vignetteSettings2.w);\nvec3 vignetteColor=vignetteSettings2.rgb;\n#ifdef VIGNETTEBLENDMODEMULTIPLY\nvec3 vignetteColorMultiplier=mix(vignetteColor,vec3(1,1,1),vignette);\nresult.rgb*=vignetteColorMultiplier;\n#endif\n#ifdef VIGNETTEBLENDMODEOPAQUE\nresult.rgb=mix(vignetteColor,result.rgb,vignette);\n#endif\n#endif\n#ifdef TONEMAPPING\n#ifdef TONEMAPPING_ACES\nresult.rgb=ACESFitted(result.rgb);\n#else\nconst float tonemappingCalibration=1.590579;\nresult.rgb=1.0-exp2(-tonemappingCalibration*result.rgb);\n#endif\n#endif\nresult.rgb=toGammaSpace(result.rgb);\nresult.rgb=saturate(result.rgb);\n#ifdef CONTRAST\nvec3 resultHighContrast=result.rgb*result.rgb*(3.0-2.0*result.rgb);\nif (contrast<1.0) {\nresult.rgb=mix(vec3(0.5,0.5,0.5),result.rgb,contrast);\n} else {\nresult.rgb=mix(result.rgb,resultHighContrast,contrast-1.0);\n}\n#endif\n#ifdef COLORGRADING\nvec3 colorTransformInput=result.rgb*colorTransformSettings.xxx+colorTransformSettings.yyy;\n#ifdef COLORGRADING3D\nvec3 colorTransformOutput=texture(txColorTransform,colorTransformInput).rgb;\n#else\nvec3 colorTransformOutput=sampleTexture3D(txColorTransform,colorTransformInput,colorTransformSettings.yz).rgb;\n#endif\nresult.rgb=mix(result.rgb,colorTransformOutput,colorTransformSettings.www);\n#endif\n#ifdef COLORCURVES\nfloat luma=getLuminance(result.rgb);\nvec2 curveMix=clamp(vec2(luma*3.0-1.5,luma*-3.0+1.5),vec2(0.0),vec2(1.0));\nvec4 colorCurve=vCameraColorCurveNeutral+curveMix.x*vCameraColorCurvePositive-curveMix.y*vCameraColorCurveNegative;\nresult.rgb*=colorCurve.rgb;\nresult.rgb=mix(vec3(luma),result.rgb,colorCurve.a);\n#endif\n#ifdef DITHER\nfloat rand=getRand(gl_FragCoord.xy*vInverseScreenSize);\nfloat dither=mix(-ditherIntensity,ditherIntensity,rand);\nresult.rgb=saturate(result.rgb+vec3(dither));\n#endif\n#define CUSTOM_IMAGEPROCESSINGFUNCTIONS_UPDATERESULT_ATEND\nreturn result;\n}"},3897:(e,t,i)=>{i(8104).v.IncludesShadersStore.importanceSampling="vec3 hemisphereCosSample(vec2 u) {\nfloat phi=2.*PI*u.x;\nfloat cosTheta2=1.-u.y;\nfloat cosTheta=sqrt(cosTheta2);\nfloat sinTheta=sqrt(1.-cosTheta2);\nreturn vec3(sinTheta*cos(phi),sinTheta*sin(phi),cosTheta);\n}\nvec3 hemisphereImportanceSampleDggx(vec2 u,float a) {\nfloat phi=2.*PI*u.x;\nfloat cosTheta2=(1.-u.y)/(1.+(a+1.)*((a-1.)*u.y));\nfloat cosTheta=sqrt(cosTheta2);\nfloat sinTheta=sqrt(1.-cosTheta2);\nreturn vec3(sinTheta*cos(phi),sinTheta*sin(phi),cosTheta);\n}\nvec3 hemisphereImportanceSampleDCharlie(vec2 u,float a) { \nfloat phi=2.*PI*u.x;\nfloat sinTheta=pow(u.y,a/(2.*a+1.));\nfloat cosTheta=sqrt(1.-sinTheta*sinTheta);\nreturn vec3(sinTheta*cos(phi),sinTheta*sin(phi),cosTheta);\n}"},1063:(e,t,i)=>{i(8104).v.IncludesShadersStore.instancesDeclaration="#ifdef INSTANCES\nattribute vec4 world0;\nattribute vec4 world1;\nattribute vec4 world2;\nattribute vec4 world3;\n#ifdef INSTANCESCOLOR\nattribute vec4 instanceColor;\n#endif\n#if defined(THIN_INSTANCES) && !defined(WORLD_UBO)\nuniform mat4 world;\n#endif\n#if defined(VELOCITY) || defined(PREPASS_VELOCITY)\nattribute vec4 previousWorld0;\nattribute vec4 previousWorld1;\nattribute vec4 previousWorld2;\nattribute vec4 previousWorld3;\n#ifdef THIN_INSTANCES\nuniform mat4 previousWorld;\n#endif\n#endif\n#else\n#if !defined(WORLD_UBO)\nuniform mat4 world;\n#endif\n#if defined(VELOCITY) || defined(PREPASS_VELOCITY)\nuniform mat4 previousWorld;\n#endif\n#endif\n"},6883:(e,t,i)=>{i(8104).v.IncludesShadersStore.instancesVertex="#ifdef INSTANCES\nmat4 finalWorld=mat4(world0,world1,world2,world3);\n#if defined(PREPASS_VELOCITY) || defined(VELOCITY)\nmat4 finalPreviousWorld=mat4(previousWorld0,previousWorld1,previousWorld2,previousWorld3);\n#endif\n#ifdef THIN_INSTANCES\nfinalWorld=world*finalWorld;\n#if defined(PREPASS_VELOCITY) || defined(VELOCITY)\nfinalPreviousWorld=previousWorld*finalPreviousWorld;\n#endif\n#endif\n#else\nmat4 finalWorld=world;\n#if defined(PREPASS_VELOCITY) || defined(VELOCITY)\nmat4 finalPreviousWorld=previousWorld;\n#endif\n#endif\n"},9490:(e,t,i)=>{i(8104).v.IncludesShadersStore.lightFragment="#ifdef LIGHT{X}\n#if defined(SHADOWONLY) || defined(LIGHTMAP) && defined(LIGHTMAPEXCLUDED{X}) && defined(LIGHTMAPNOSPECULAR{X})\n#else\n#ifdef PBR\n#ifdef SPOTLIGHT{X}\npreInfo=computePointAndSpotPreLightingInfo(light{X}.vLightData,viewDirectionW,normalW);\n#elif defined(POINTLIGHT{X})\npreInfo=computePointAndSpotPreLightingInfo(light{X}.vLightData,viewDirectionW,normalW);\n#elif defined(HEMILIGHT{X})\npreInfo=computeHemisphericPreLightingInfo(light{X}.vLightData,viewDirectionW,normalW);\n#elif defined(DIRLIGHT{X})\npreInfo=computeDirectionalPreLightingInfo(light{X}.vLightData,viewDirectionW,normalW);\n#endif\npreInfo.NdotV=NdotV;\n#ifdef SPOTLIGHT{X}\n#ifdef LIGHT_FALLOFF_GLTF{X}\npreInfo.attenuation=computeDistanceLightFalloff_GLTF(preInfo.lightDistanceSquared,light{X}.vLightFalloff.y);\npreInfo.attenuation*=computeDirectionalLightFalloff_GLTF(light{X}.vLightDirection.xyz,preInfo.L,light{X}.vLightFalloff.z,light{X}.vLightFalloff.w);\n#elif defined(LIGHT_FALLOFF_PHYSICAL{X})\npreInfo.attenuation=computeDistanceLightFalloff_Physical(preInfo.lightDistanceSquared);\npreInfo.attenuation*=computeDirectionalLightFalloff_Physical(light{X}.vLightDirection.xyz,preInfo.L,light{X}.vLightDirection.w);\n#elif defined(LIGHT_FALLOFF_STANDARD{X})\npreInfo.attenuation=computeDistanceLightFalloff_Standard(preInfo.lightOffset,light{X}.vLightFalloff.x);\npreInfo.attenuation*=computeDirectionalLightFalloff_Standard(light{X}.vLightDirection.xyz,preInfo.L,light{X}.vLightDirection.w,light{X}.vLightData.w);\n#else\npreInfo.attenuation=computeDistanceLightFalloff(preInfo.lightOffset,preInfo.lightDistanceSquared,light{X}.vLightFalloff.x,light{X}.vLightFalloff.y);\npreInfo.attenuation*=computeDirectionalLightFalloff(light{X}.vLightDirection.xyz,preInfo.L,light{X}.vLightDirection.w,light{X}.vLightData.w,light{X}.vLightFalloff.z,light{X}.vLightFalloff.w);\n#endif\n#elif defined(POINTLIGHT{X})\n#ifdef LIGHT_FALLOFF_GLTF{X}\npreInfo.attenuation=computeDistanceLightFalloff_GLTF(preInfo.lightDistanceSquared,light{X}.vLightFalloff.y);\n#elif defined(LIGHT_FALLOFF_PHYSICAL{X})\npreInfo.attenuation=computeDistanceLightFalloff_Physical(preInfo.lightDistanceSquared);\n#elif defined(LIGHT_FALLOFF_STANDARD{X})\npreInfo.attenuation=computeDistanceLightFalloff_Standard(preInfo.lightOffset,light{X}.vLightFalloff.x);\n#else\npreInfo.attenuation=computeDistanceLightFalloff(preInfo.lightOffset,preInfo.lightDistanceSquared,light{X}.vLightFalloff.x,light{X}.vLightFalloff.y);\n#endif\n#else\npreInfo.attenuation=1.0;\n#endif\n#ifdef HEMILIGHT{X}\npreInfo.roughness=roughness;\n#else\npreInfo.roughness=adjustRoughnessFromLightProperties(roughness,light{X}.vLightSpecular.a,preInfo.lightDistance);\n#endif\n#ifdef IRIDESCENCE\npreInfo.iridescenceIntensity=iridescenceIntensity;\n#endif\n#ifdef HEMILIGHT{X}\ninfo.diffuse=computeHemisphericDiffuseLighting(preInfo,light{X}.vLightDiffuse.rgb,light{X}.vLightGround);\n#elif defined(SS_TRANSLUCENCY)\ninfo.diffuse=computeDiffuseAndTransmittedLighting(preInfo,light{X}.vLightDiffuse.rgb,subSurfaceOut.transmittance);\n#else\ninfo.diffuse=computeDiffuseLighting(preInfo,light{X}.vLightDiffuse.rgb);\n#endif\n#ifdef SPECULARTERM\n#ifdef ANISOTROPIC\ninfo.specular=computeAnisotropicSpecularLighting(preInfo,viewDirectionW,normalW,anisotropicOut.anisotropicTangent,anisotropicOut.anisotropicBitangent,anisotropicOut.anisotropy,clearcoatOut.specularEnvironmentR0,specularEnvironmentR90,AARoughnessFactors.x,light{X}.vLightDiffuse.rgb);\n#else\ninfo.specular=computeSpecularLighting(preInfo,normalW,clearcoatOut.specularEnvironmentR0,specularEnvironmentR90,AARoughnessFactors.x,light{X}.vLightDiffuse.rgb);\n#endif\n#endif\n#ifdef SHEEN\n#ifdef SHEEN_LINKWITHALBEDO\npreInfo.roughness=sheenOut.sheenIntensity;\n#else\n#ifdef HEMILIGHT{X}\npreInfo.roughness=sheenOut.sheenRoughness;\n#else\npreInfo.roughness=adjustRoughnessFromLightProperties(sheenOut.sheenRoughness,light{X}.vLightSpecular.a,preInfo.lightDistance);\n#endif\n#endif\ninfo.sheen=computeSheenLighting(preInfo,normalW,sheenOut.sheenColor,specularEnvironmentR90,AARoughnessFactors.x,light{X}.vLightDiffuse.rgb);\n#endif\n#ifdef CLEARCOAT\n#ifdef HEMILIGHT{X}\npreInfo.roughness=clearcoatOut.clearCoatRoughness;\n#else\npreInfo.roughness=adjustRoughnessFromLightProperties(clearcoatOut.clearCoatRoughness,light{X}.vLightSpecular.a,preInfo.lightDistance);\n#endif\ninfo.clearCoat=computeClearCoatLighting(preInfo,clearcoatOut.clearCoatNormalW,clearcoatOut.clearCoatAARoughnessFactors.x,clearcoatOut.clearCoatIntensity,light{X}.vLightDiffuse.rgb);\n#ifdef CLEARCOAT_TINT\nabsorption=computeClearCoatLightingAbsorption(clearcoatOut.clearCoatNdotVRefract,preInfo.L,clearcoatOut.clearCoatNormalW,clearcoatOut.clearCoatColor,clearcoatOut.clearCoatThickness,clearcoatOut.clearCoatIntensity);\ninfo.diffuse*=absorption;\n#ifdef SPECULARTERM\ninfo.specular*=absorption;\n#endif\n#endif\ninfo.diffuse*=info.clearCoat.w;\n#ifdef SPECULARTERM\ninfo.specular*=info.clearCoat.w;\n#endif\n#ifdef SHEEN\ninfo.sheen*=info.clearCoat.w;\n#endif\n#endif\n#else\n#ifdef SPOTLIGHT{X}\ninfo=computeSpotLighting(viewDirectionW,normalW,light{X}.vLightData,light{X}.vLightDirection,light{X}.vLightDiffuse.rgb,light{X}.vLightSpecular.rgb,light{X}.vLightDiffuse.a,glossiness);\n#elif defined(HEMILIGHT{X})\ninfo=computeHemisphericLighting(viewDirectionW,normalW,light{X}.vLightData,light{X}.vLightDiffuse.rgb,light{X}.vLightSpecular.rgb,light{X}.vLightGround,glossiness);\n#elif defined(POINTLIGHT{X}) || defined(DIRLIGHT{X})\ninfo=computeLighting(viewDirectionW,normalW,light{X}.vLightData,light{X}.vLightDiffuse.rgb,light{X}.vLightSpecular.rgb,light{X}.vLightDiffuse.a,glossiness);\n#endif\n#endif\n#ifdef PROJECTEDLIGHTTEXTURE{X}\ninfo.diffuse*=computeProjectionTextureDiffuseLighting(projectionLightSampler{X},textureProjectionMatrix{X});\n#endif\n#endif\n#ifdef SHADOW{X}\n#ifdef SHADOWCSM{X}\nfor (int i=0; i<SHADOWCSMNUM_CASCADES{X}; i++) \n{\n#ifdef SHADOWCSM_RIGHTHANDED{X}\ndiff{X}=viewFrustumZ{X}[i]+vPositionFromCamera{X}.z;\n#else\ndiff{X}=viewFrustumZ{X}[i]-vPositionFromCamera{X}.z;\n#endif\nif (diff{X}>=0.) {\nindex{X}=i;\nbreak;\n}\n}\n#ifdef SHADOWCSMUSESHADOWMAXZ{X}\nif (index{X}>=0)\n#endif\n{\n#if defined(SHADOWPCF{X})\n#if defined(SHADOWLOWQUALITY{X})\nshadow=computeShadowWithCSMPCF1(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],shadowSampler{X},light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#elif defined(SHADOWMEDIUMQUALITY{X})\nshadow=computeShadowWithCSMPCF3(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],shadowSampler{X},light{X}.shadowsInfo.yz,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#else\nshadow=computeShadowWithCSMPCF5(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],shadowSampler{X},light{X}.shadowsInfo.yz,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#endif\n#elif defined(SHADOWPCSS{X})\n#if defined(SHADOWLOWQUALITY{X})\nshadow=computeShadowWithCSMPCSS16(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],depthSampler{X},shadowSampler{X},light{X}.shadowsInfo.y,light{X}.shadowsInfo.z,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w,lightSizeUVCorrection{X}[index{X}],depthCorrection{X}[index{X}],penumbraDarkness{X});\n#elif defined(SHADOWMEDIUMQUALITY{X})\nshadow=computeShadowWithCSMPCSS32(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],depthSampler{X},shadowSampler{X},light{X}.shadowsInfo.y,light{X}.shadowsInfo.z,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w,lightSizeUVCorrection{X}[index{X}],depthCorrection{X}[index{X}],penumbraDarkness{X});\n#else\nshadow=computeShadowWithCSMPCSS64(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],depthSampler{X},shadowSampler{X},light{X}.shadowsInfo.y,light{X}.shadowsInfo.z,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w,lightSizeUVCorrection{X}[index{X}],depthCorrection{X}[index{X}],penumbraDarkness{X});\n#endif\n#else\nshadow=computeShadowCSM(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],shadowSampler{X},light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#endif\n#ifdef SHADOWCSMDEBUG{X}\nshadowDebug{X}=vec3(shadow)*vCascadeColorsMultiplier{X}[index{X}];\n#endif\n#ifndef SHADOWCSMNOBLEND{X}\nfloat frustumLength=frustumLengths{X}[index{X}];\nfloat diffRatio=clamp(diff{X}/frustumLength,0.,1.)*cascadeBlendFactor{X};\nif (index{X}<(SHADOWCSMNUM_CASCADES{X}-1) && diffRatio<1.)\n{\nindex{X}+=1;\nfloat nextShadow=0.;\n#if defined(SHADOWPCF{X})\n#if defined(SHADOWLOWQUALITY{X})\nnextShadow=computeShadowWithCSMPCF1(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],shadowSampler{X},light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#elif defined(SHADOWMEDIUMQUALITY{X})\nnextShadow=computeShadowWithCSMPCF3(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],shadowSampler{X},light{X}.shadowsInfo.yz,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#else\nnextShadow=computeShadowWithCSMPCF5(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],shadowSampler{X},light{X}.shadowsInfo.yz,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#endif\n#elif defined(SHADOWPCSS{X})\n#if defined(SHADOWLOWQUALITY{X})\nnextShadow=computeShadowWithCSMPCSS16(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],depthSampler{X},shadowSampler{X},light{X}.shadowsInfo.y,light{X}.shadowsInfo.z,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w,lightSizeUVCorrection{X}[index{X}],depthCorrection{X}[index{X}],penumbraDarkness{X});\n#elif defined(SHADOWMEDIUMQUALITY{X})\nnextShadow=computeShadowWithCSMPCSS32(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],depthSampler{X},shadowSampler{X},light{X}.shadowsInfo.y,light{X}.shadowsInfo.z,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w,lightSizeUVCorrection{X}[index{X}],depthCorrection{X}[index{X}],penumbraDarkness{X});\n#else\nnextShadow=computeShadowWithCSMPCSS64(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],depthSampler{X},shadowSampler{X},light{X}.shadowsInfo.y,light{X}.shadowsInfo.z,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w,lightSizeUVCorrection{X}[index{X}],depthCorrection{X}[index{X}],penumbraDarkness{X});\n#endif\n#else\nnextShadow=computeShadowCSM(float(index{X}),vPositionFromLight{X}[index{X}],vDepthMetric{X}[index{X}],shadowSampler{X},light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#endif\nshadow=mix(nextShadow,shadow,diffRatio);\n#ifdef SHADOWCSMDEBUG{X}\nshadowDebug{X}=mix(vec3(nextShadow)*vCascadeColorsMultiplier{X}[index{X}],shadowDebug{X},diffRatio);\n#endif\n}\n#endif\n}\n#elif defined(SHADOWCLOSEESM{X})\n#if defined(SHADOWCUBE{X})\nshadow=computeShadowWithCloseESMCube(light{X}.vLightData.xyz,shadowSampler{X},light{X}.shadowsInfo.x,light{X}.shadowsInfo.z,light{X}.depthValues);\n#else\nshadow=computeShadowWithCloseESM(vPositionFromLight{X},vDepthMetric{X},shadowSampler{X},light{X}.shadowsInfo.x,light{X}.shadowsInfo.z,light{X}.shadowsInfo.w);\n#endif\n#elif defined(SHADOWESM{X})\n#if defined(SHADOWCUBE{X})\nshadow=computeShadowWithESMCube(light{X}.vLightData.xyz,shadowSampler{X},light{X}.shadowsInfo.x,light{X}.shadowsInfo.z,light{X}.depthValues);\n#else\nshadow=computeShadowWithESM(vPositionFromLight{X},vDepthMetric{X},shadowSampler{X},light{X}.shadowsInfo.x,light{X}.shadowsInfo.z,light{X}.shadowsInfo.w);\n#endif\n#elif defined(SHADOWPOISSON{X})\n#if defined(SHADOWCUBE{X})\nshadow=computeShadowWithPoissonSamplingCube(light{X}.vLightData.xyz,shadowSampler{X},light{X}.shadowsInfo.y,light{X}.shadowsInfo.x,light{X}.depthValues);\n#else\nshadow=computeShadowWithPoissonSampling(vPositionFromLight{X},vDepthMetric{X},shadowSampler{X},light{X}.shadowsInfo.y,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#endif\n#elif defined(SHADOWPCF{X})\n#if defined(SHADOWLOWQUALITY{X})\nshadow=computeShadowWithPCF1(vPositionFromLight{X},vDepthMetric{X},shadowSampler{X},light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#elif defined(SHADOWMEDIUMQUALITY{X})\nshadow=computeShadowWithPCF3(vPositionFromLight{X},vDepthMetric{X},shadowSampler{X},light{X}.shadowsInfo.yz,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#else\nshadow=computeShadowWithPCF5(vPositionFromLight{X},vDepthMetric{X},shadowSampler{X},light{X}.shadowsInfo.yz,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#endif\n#elif defined(SHADOWPCSS{X})\n#if defined(SHADOWLOWQUALITY{X})\nshadow=computeShadowWithPCSS16(vPositionFromLight{X},vDepthMetric{X},depthSampler{X},shadowSampler{X},light{X}.shadowsInfo.y,light{X}.shadowsInfo.z,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#elif defined(SHADOWMEDIUMQUALITY{X})\nshadow=computeShadowWithPCSS32(vPositionFromLight{X},vDepthMetric{X},depthSampler{X},shadowSampler{X},light{X}.shadowsInfo.y,light{X}.shadowsInfo.z,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#else\nshadow=computeShadowWithPCSS64(vPositionFromLight{X},vDepthMetric{X},depthSampler{X},shadowSampler{X},light{X}.shadowsInfo.y,light{X}.shadowsInfo.z,light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#endif\n#else\n#if defined(SHADOWCUBE{X})\nshadow=computeShadowCube(light{X}.vLightData.xyz,shadowSampler{X},light{X}.shadowsInfo.x,light{X}.depthValues);\n#else\nshadow=computeShadow(vPositionFromLight{X},vDepthMetric{X},shadowSampler{X},light{X}.shadowsInfo.x,light{X}.shadowsInfo.w);\n#endif\n#endif\n#ifdef SHADOWONLY\n#ifndef SHADOWINUSE\n#define SHADOWINUSE\n#endif\nglobalShadow+=shadow;\nshadowLightCount+=1.0;\n#endif\n#else\nshadow=1.;\n#endif\n#ifndef SHADOWONLY\n#ifdef CUSTOMUSERLIGHTING\ndiffuseBase+=computeCustomDiffuseLighting(info,diffuseBase,shadow);\n#ifdef SPECULARTERM\nspecularBase+=computeCustomSpecularLighting(info,specularBase,shadow);\n#endif\n#elif defined(LIGHTMAP) && defined(LIGHTMAPEXCLUDED{X})\ndiffuseBase+=lightmapColor.rgb*shadow;\n#ifdef SPECULARTERM\n#ifndef LIGHTMAPNOSPECULAR{X}\nspecularBase+=info.specular*shadow*lightmapColor.rgb;\n#endif\n#endif\n#ifdef CLEARCOAT\n#ifndef LIGHTMAPNOSPECULAR{X}\nclearCoatBase+=info.clearCoat.rgb*shadow*lightmapColor.rgb;\n#endif\n#endif\n#ifdef SHEEN\n#ifndef LIGHTMAPNOSPECULAR{X}\nsheenBase+=info.sheen.rgb*shadow;\n#endif\n#endif\n#else\n#ifdef SHADOWCSMDEBUG{X}\ndiffuseBase+=info.diffuse*shadowDebug{X};\n#else \ndiffuseBase+=info.diffuse*shadow;\n#endif\n#ifdef SPECULARTERM\nspecularBase+=info.specular*shadow;\n#endif\n#ifdef CLEARCOAT\nclearCoatBase+=info.clearCoat.rgb*shadow;\n#endif\n#ifdef SHEEN\nsheenBase+=info.sheen.rgb*shadow;\n#endif\n#endif\n#endif\n#endif\n"},2557:(e,t,i)=>{i(8104).v.IncludesShadersStore.lightFragmentDeclaration="#ifdef LIGHT{X}\nuniform vec4 vLightData{X};\nuniform vec4 vLightDiffuse{X};\n#ifdef SPECULARTERM\nuniform vec4 vLightSpecular{X};\n#else\nvec4 vLightSpecular{X}=vec4(0.);\n#endif\n#ifdef SHADOW{X}\n#ifdef SHADOWCSM{X}\nuniform mat4 lightMatrix{X}[SHADOWCSMNUM_CASCADES{X}];\nuniform float viewFrustumZ{X}[SHADOWCSMNUM_CASCADES{X}];\nuniform float frustumLengths{X}[SHADOWCSMNUM_CASCADES{X}];\nuniform float cascadeBlendFactor{X};\nvarying vec4 vPositionFromLight{X}[SHADOWCSMNUM_CASCADES{X}];\nvarying float vDepthMetric{X}[SHADOWCSMNUM_CASCADES{X}];\nvarying vec4 vPositionFromCamera{X};\n#if defined(SHADOWPCSS{X})\nuniform highp sampler2DArrayShadow shadowSampler{X};\nuniform highp sampler2DArray depthSampler{X};\nuniform vec2 lightSizeUVCorrection{X}[SHADOWCSMNUM_CASCADES{X}];\nuniform float depthCorrection{X}[SHADOWCSMNUM_CASCADES{X}];\nuniform float penumbraDarkness{X};\n#elif defined(SHADOWPCF{X})\nuniform highp sampler2DArrayShadow shadowSampler{X};\n#else\nuniform highp sampler2DArray shadowSampler{X};\n#endif\n#ifdef SHADOWCSMDEBUG{X}\nconst vec3 vCascadeColorsMultiplier{X}[8]=vec3[8]\n(\nvec3 ( 1.5,0.0,0.0 ),\nvec3 ( 0.0,1.5,0.0 ),\nvec3 ( 0.0,0.0,5.5 ),\nvec3 ( 1.5,0.0,5.5 ),\nvec3 ( 1.5,1.5,0.0 ),\nvec3 ( 1.0,1.0,1.0 ),\nvec3 ( 0.0,1.0,5.5 ),\nvec3 ( 0.5,3.5,0.75 )\n);\nvec3 shadowDebug{X};\n#endif\n#ifdef SHADOWCSMUSESHADOWMAXZ{X}\nint index{X}=-1;\n#else\nint index{X}=SHADOWCSMNUM_CASCADES{X}-1;\n#endif\nfloat diff{X}=0.;\n#elif defined(SHADOWCUBE{X})\nuniform samplerCube shadowSampler{X};\n#else\nvarying vec4 vPositionFromLight{X};\nvarying float vDepthMetric{X};\n#if defined(SHADOWPCSS{X})\nuniform highp sampler2DShadow shadowSampler{X};\nuniform highp sampler2D depthSampler{X};\n#elif defined(SHADOWPCF{X})\nuniform highp sampler2DShadow shadowSampler{X};\n#else\nuniform sampler2D shadowSampler{X};\n#endif\nuniform mat4 lightMatrix{X};\n#endif\nuniform vec4 shadowsInfo{X};\nuniform vec2 depthValues{X};\n#endif\n#ifdef SPOTLIGHT{X}\nuniform vec4 vLightDirection{X};\nuniform vec4 vLightFalloff{X};\n#elif defined(POINTLIGHT{X})\nuniform vec4 vLightFalloff{X};\n#elif defined(HEMILIGHT{X})\nuniform vec3 vLightGround{X};\n#endif\n#ifdef PROJECTEDLIGHTTEXTURE{X}\nuniform mat4 textureProjectionMatrix{X};\nuniform sampler2D projectionLightSampler{X};\n#endif\n#endif\n"},3756:(e,t,i)=>{i(8104).v.IncludesShadersStore.lightUboDeclaration="#ifdef LIGHT{X}\nuniform Light{X}\n{\nvec4 vLightData;\nvec4 vLightDiffuse;\nvec4 vLightSpecular;\n#ifdef SPOTLIGHT{X}\nvec4 vLightDirection;\nvec4 vLightFalloff;\n#elif defined(POINTLIGHT{X})\nvec4 vLightFalloff;\n#elif defined(HEMILIGHT{X})\nvec3 vLightGround;\n#endif\nvec4 shadowsInfo;\nvec2 depthValues;\n} light{X};\n#ifdef PROJECTEDLIGHTTEXTURE{X}\nuniform mat4 textureProjectionMatrix{X};\nuniform sampler2D projectionLightSampler{X};\n#endif\n#ifdef SHADOW{X}\n#ifdef SHADOWCSM{X}\nuniform mat4 lightMatrix{X}[SHADOWCSMNUM_CASCADES{X}];\nuniform float viewFrustumZ{X}[SHADOWCSMNUM_CASCADES{X}];\nuniform float frustumLengths{X}[SHADOWCSMNUM_CASCADES{X}];\nuniform float cascadeBlendFactor{X};\nvarying vec4 vPositionFromLight{X}[SHADOWCSMNUM_CASCADES{X}];\nvarying float vDepthMetric{X}[SHADOWCSMNUM_CASCADES{X}];\nvarying vec4 vPositionFromCamera{X};\n#if defined(SHADOWPCSS{X})\nuniform highp sampler2DArrayShadow shadowSampler{X};\nuniform highp sampler2DArray depthSampler{X};\nuniform vec2 lightSizeUVCorrection{X}[SHADOWCSMNUM_CASCADES{X}];\nuniform float depthCorrection{X}[SHADOWCSMNUM_CASCADES{X}];\nuniform float penumbraDarkness{X};\n#elif defined(SHADOWPCF{X})\nuniform highp sampler2DArrayShadow shadowSampler{X};\n#else\nuniform highp sampler2DArray shadowSampler{X};\n#endif\n#ifdef SHADOWCSMDEBUG{X}\nconst vec3 vCascadeColorsMultiplier{X}[8]=vec3[8]\n(\nvec3 ( 1.5,0.0,0.0 ),\nvec3 ( 0.0,1.5,0.0 ),\nvec3 ( 0.0,0.0,5.5 ),\nvec3 ( 1.5,0.0,5.5 ),\nvec3 ( 1.5,1.5,0.0 ),\nvec3 ( 1.0,1.0,1.0 ),\nvec3 ( 0.0,1.0,5.5 ),\nvec3 ( 0.5,3.5,0.75 )\n);\nvec3 shadowDebug{X};\n#endif\n#ifdef SHADOWCSMUSESHADOWMAXZ{X}\nint index{X}=-1;\n#else\nint index{X}=SHADOWCSMNUM_CASCADES{X}-1;\n#endif\nfloat diff{X}=0.;\n#elif defined(SHADOWCUBE{X})\nuniform samplerCube shadowSampler{X}; \n#else\nvarying vec4 vPositionFromLight{X};\nvarying float vDepthMetric{X};\n#if defined(SHADOWPCSS{X})\nuniform highp sampler2DShadow shadowSampler{X};\nuniform highp sampler2D depthSampler{X};\n#elif defined(SHADOWPCF{X})\nuniform highp sampler2DShadow shadowSampler{X};\n#else\nuniform sampler2D shadowSampler{X};\n#endif\nuniform mat4 lightMatrix{X};\n#endif\n#endif\n#endif\n"},1542:(e,t,i)=>{i(8104).v.IncludesShadersStore.lightVxFragmentDeclaration="#ifdef LIGHT{X}\nuniform vec4 vLightData{X};\nuniform vec4 vLightDiffuse{X};\n#ifdef SPECULARTERM\nuniform vec4 vLightSpecular{X};\n#else\nvec4 vLightSpecular{X}=vec4(0.);\n#endif\n#ifdef SHADOW{X}\n#ifdef SHADOWCSM{X}\nuniform mat4 lightMatrix{X}[SHADOWCSMNUM_CASCADES{X}];\nvarying vec4 vPositionFromLight{X}[SHADOWCSMNUM_CASCADES{X}];\nvarying float vDepthMetric{X}[SHADOWCSMNUM_CASCADES{X}];\nvarying vec4 vPositionFromCamera{X};\n#elif defined(SHADOWCUBE{X})\n#else\nvarying vec4 vPositionFromLight{X};\nvarying float vDepthMetric{X};\nuniform mat4 lightMatrix{X};\n#endif\nuniform vec4 shadowsInfo{X};\nuniform vec2 depthValues{X};\n#endif\n#ifdef SPOTLIGHT{X}\nuniform vec4 vLightDirection{X};\nuniform vec4 vLightFalloff{X};\n#elif defined(POINTLIGHT{X})\nuniform vec4 vLightFalloff{X};\n#elif defined(HEMILIGHT{X})\nuniform vec3 vLightGround{X};\n#endif\n#endif\n"},9935:(e,t,i)=>{i(8104).v.IncludesShadersStore.lightVxUboDeclaration="#ifdef LIGHT{X}\nuniform Light{X}\n{\nvec4 vLightData;\nvec4 vLightDiffuse;\nvec4 vLightSpecular;\n#ifdef SPOTLIGHT{X}\nvec4 vLightDirection;\nvec4 vLightFalloff;\n#elif defined(POINTLIGHT{X})\nvec4 vLightFalloff;\n#elif defined(HEMILIGHT{X})\nvec3 vLightGround;\n#endif\nvec4 shadowsInfo;\nvec2 depthValues;\n} light{X};\n#ifdef SHADOW{X}\n#ifdef SHADOWCSM{X}\nuniform mat4 lightMatrix{X}[SHADOWCSMNUM_CASCADES{X}];\nvarying vec4 vPositionFromLight{X}[SHADOWCSMNUM_CASCADES{X}];\nvarying float vDepthMetric{X}[SHADOWCSMNUM_CASCADES{X}];\nvarying vec4 vPositionFromCamera{X};\n#elif defined(SHADOWCUBE{X})\n#else\nvarying vec4 vPositionFromLight{X};\nvarying float vDepthMetric{X};\nuniform mat4 lightMatrix{X};\n#endif\n#endif\n#endif\n"},6568:(e,t,i)=>{i(8104).v.IncludesShadersStore.lightsFragmentFunctions="struct lightingInfo\n{\nvec3 diffuse;\n#ifdef SPECULARTERM\nvec3 specular;\n#endif\n#ifdef NDOTL\nfloat ndl;\n#endif\n};\nlightingInfo computeLighting(vec3 viewDirectionW,vec3 vNormal,vec4 lightData,vec3 diffuseColor,vec3 specularColor,float range,float glossiness) {\nlightingInfo result;\nvec3 lightVectorW;\nfloat attenuation=1.0;\nif (lightData.w==0.)\n{\nvec3 direction=lightData.xyz-vPositionW;\nattenuation=max(0.,1.0-length(direction)/range);\nlightVectorW=normalize(direction);\n}\nelse\n{\nlightVectorW=normalize(-lightData.xyz);\n}\nfloat ndl=max(0.,dot(vNormal,lightVectorW));\n#ifdef NDOTL\nresult.ndl=ndl;\n#endif\nresult.diffuse=ndl*diffuseColor*attenuation;\n#ifdef SPECULARTERM\nvec3 angleW=normalize(viewDirectionW+lightVectorW);\nfloat specComp=max(0.,dot(vNormal,angleW));\nspecComp=pow(specComp,max(1.,glossiness));\nresult.specular=specComp*specularColor*attenuation;\n#endif\nreturn result;\n}\nlightingInfo computeSpotLighting(vec3 viewDirectionW,vec3 vNormal,vec4 lightData,vec4 lightDirection,vec3 diffuseColor,vec3 specularColor,float range,float glossiness) {\nlightingInfo result;\nvec3 direction=lightData.xyz-vPositionW;\nvec3 lightVectorW=normalize(direction);\nfloat attenuation=max(0.,1.0-length(direction)/range);\nfloat cosAngle=max(0.,dot(lightDirection.xyz,-lightVectorW));\nif (cosAngle>=lightDirection.w)\n{\ncosAngle=max(0.,pow(cosAngle,lightData.w));\nattenuation*=cosAngle;\nfloat ndl=max(0.,dot(vNormal,lightVectorW));\n#ifdef NDOTL\nresult.ndl=ndl;\n#endif\nresult.diffuse=ndl*diffuseColor*attenuation;\n#ifdef SPECULARTERM\nvec3 angleW=normalize(viewDirectionW+lightVectorW);\nfloat specComp=max(0.,dot(vNormal,angleW));\nspecComp=pow(specComp,max(1.,glossiness));\nresult.specular=specComp*specularColor*attenuation;\n#endif\nreturn result;\n}\nresult.diffuse=vec3(0.);\n#ifdef SPECULARTERM\nresult.specular=vec3(0.);\n#endif\n#ifdef NDOTL\nresult.ndl=0.;\n#endif\nreturn result;\n}\nlightingInfo computeHemisphericLighting(vec3 viewDirectionW,vec3 vNormal,vec4 lightData,vec3 diffuseColor,vec3 specularColor,vec3 groundColor,float glossiness) {\nlightingInfo result;\nfloat ndl=dot(vNormal,lightData.xyz)*0.5+0.5;\n#ifdef NDOTL\nresult.ndl=ndl;\n#endif\nresult.diffuse=mix(groundColor,diffuseColor,ndl);\n#ifdef SPECULARTERM\nvec3 angleW=normalize(viewDirectionW+lightData.xyz);\nfloat specComp=max(0.,dot(vNormal,angleW));\nspecComp=pow(specComp,max(1.,glossiness));\nresult.specular=specComp*specularColor;\n#endif\nreturn result;\n}\n#define inline\nvec3 computeProjectionTextureDiffuseLighting(sampler2D projectionLightSampler,mat4 textureProjectionMatrix){\nvec4 strq=textureProjectionMatrix*vec4(vPositionW,1.0);\nstrq/=strq.w;\nvec3 textureColor=texture2D(projectionLightSampler,strq.xy).rgb;\nreturn textureColor;\n}"},1030:(e,t,i)=>{i(8104).v.IncludesShadersStore.logDepthDeclaration="#ifdef LOGARITHMICDEPTH\nuniform float logarithmicDepthConstant;\nvarying float vFragmentDepth;\n#endif\n"},8773:(e,t,i)=>{i(8104).v.IncludesShadersStore.logDepthFragment="#ifdef LOGARITHMICDEPTH\ngl_FragDepthEXT=log2(vFragmentDepth)*logarithmicDepthConstant*0.5;\n#endif\n"},5501:(e,t,i)=>{i(8104).v.IncludesShadersStore.logDepthVertex="#ifdef LOGARITHMICDEPTH\nvFragmentDepth=1.0+gl_Position.w;\ngl_Position.z=log2(max(0.000001,vFragmentDepth))*logarithmicDepthConstant;\n#endif\n"},6637:(e,t,i)=>{i(8104).v.IncludesShadersStore.mainUVVaryingDeclaration="#ifdef MAINUV{X}\nvarying vec2 vMainUV{X};\n#endif\n"},4804:(e,t,i)=>{i(8104).v.IncludesShadersStore.meshUboDeclaration="#ifdef WEBGL2\nuniform mat4 world;\nuniform float visibility;\n#else\nlayout(std140,column_major) uniform;\nuniform Mesh\n{\nmat4 world;\nfloat visibility;\n};\n#endif\n#define WORLD_UBO\n"},9085:(e,t,i)=>{i(8104).v.IncludesShadersStore.morphTargetsVertex="#ifdef MORPHTARGETS\n#ifdef MORPHTARGETS_TEXTURE \nvertexID=float(gl_VertexID)*morphTargetTextureInfo.x;\npositionUpdated+=(readVector3FromRawSampler({X},vertexID)-position)*morphTargetInfluences[{X}];\nvertexID+=1.0;\n#ifdef MORPHTARGETS_NORMAL\nnormalUpdated+=(readVector3FromRawSampler({X},vertexID) -normal)*morphTargetInfluences[{X}];\nvertexID+=1.0;\n#endif\n#ifdef MORPHTARGETS_UV\nuvUpdated+=(readVector3FromRawSampler({X},vertexID).xy-uv)*morphTargetInfluences[{X}];\nvertexID+=1.0;\n#endif\n#ifdef MORPHTARGETS_TANGENT\ntangentUpdated.xyz+=(readVector3FromRawSampler({X},vertexID) -tangent.xyz)*morphTargetInfluences[{X}];\n#endif\n#else\npositionUpdated+=(position{X}-position)*morphTargetInfluences[{X}];\n#ifdef MORPHTARGETS_NORMAL\nnormalUpdated+=(normal{X}-normal)*morphTargetInfluences[{X}];\n#endif\n#ifdef MORPHTARGETS_TANGENT\ntangentUpdated.xyz+=(tangent{X}-tangent.xyz)*morphTargetInfluences[{X}];\n#endif\n#ifdef MORPHTARGETS_UV\nuvUpdated+=(uv_{X}-uv)*morphTargetInfluences[{X}];\n#endif\n#endif\n#endif\n"},8073:(e,t,i)=>{i(8104).v.IncludesShadersStore.morphTargetsVertexDeclaration="#ifdef MORPHTARGETS\n#ifndef MORPHTARGETS_TEXTURE\nattribute vec3 position{X};\n#ifdef MORPHTARGETS_NORMAL\nattribute vec3 normal{X};\n#endif\n#ifdef MORPHTARGETS_TANGENT\nattribute vec3 tangent{X};\n#endif\n#ifdef MORPHTARGETS_UV\nattribute vec2 uv_{X};\n#endif\n#endif\n#endif\n"},6757:(e,t,i)=>{i(8104).v.IncludesShadersStore.morphTargetsVertexGlobal="#ifdef MORPHTARGETS\n#ifdef MORPHTARGETS_TEXTURE\nfloat vertexID;\n#endif\n#endif\n"},9901:(e,t,i)=>{i(8104).v.IncludesShadersStore.morphTargetsVertexGlobalDeclaration="#ifdef MORPHTARGETS\nuniform float morphTargetInfluences[NUM_MORPH_INFLUENCERS];\n#ifdef MORPHTARGETS_TEXTURE \nprecision mediump sampler2DArray; \nuniform float morphTargetTextureIndices[NUM_MORPH_INFLUENCERS];\nuniform vec3 morphTargetTextureInfo;\nuniform sampler2DArray morphTargets;\nvec3 readVector3FromRawSampler(int targetIndex,float vertexIndex)\n{ \nfloat y=floor(vertexIndex/morphTargetTextureInfo.y);\nfloat x=vertexIndex-y*morphTargetTextureInfo.y;\nvec3 textureUV=vec3((x+0.5)/morphTargetTextureInfo.y,(y+0.5)/morphTargetTextureInfo.z,morphTargetTextureIndices[targetIndex]);\nreturn texture(morphTargets,textureUV).xyz;\n}\n#endif\n#endif\n"},1868:(e,t,i)=>{i(8104).v.IncludesShadersStore.oitDeclaration="#ifdef ORDER_INDEPENDENT_TRANSPARENCY\n#extension GL_EXT_draw_buffers : require\nlayout(location=0) out vec2 depth; \nlayout(location=1) out vec4 frontColor;\nlayout(location=2) out vec4 backColor;\n#define MAX_DEPTH 99999.0\nhighp vec4 gl_FragColor;\nuniform sampler2D oitDepthSampler;\nuniform sampler2D oitFrontColorSampler;\n#endif\n"},4643:(e,t,i)=>{i(8104).v.IncludesShadersStore.oitFragment="#ifdef ORDER_INDEPENDENT_TRANSPARENCY\nfloat fragDepth=gl_FragCoord.z; \n#ifdef ORDER_INDEPENDENT_TRANSPARENCY_16BITS\nuint halfFloat=packHalf2x16(vec2(fragDepth));\nvec2 full=unpackHalf2x16(halfFloat);\nfragDepth=full.x;\n#endif\nivec2 fragCoord=ivec2(gl_FragCoord.xy);\nvec2 lastDepth=texelFetch(oitDepthSampler,fragCoord,0).rg;\nvec4 lastFrontColor=texelFetch(oitFrontColorSampler,fragCoord,0);\ndepth.rg=vec2(-MAX_DEPTH);\nfrontColor=lastFrontColor;\nbackColor=vec4(0.0);\n#ifdef USE_REVERSE_DEPTHBUFFER\nfloat furthestDepth=-lastDepth.x;\nfloat nearestDepth=lastDepth.y;\n#else\nfloat nearestDepth=-lastDepth.x;\nfloat furthestDepth=lastDepth.y;\n#endif\nfloat alphaMultiplier=1.0-lastFrontColor.a;\n#ifdef USE_REVERSE_DEPTHBUFFER\nif (fragDepth>nearestDepth || fragDepth<furthestDepth) {\n#else\nif (fragDepth<nearestDepth || fragDepth>furthestDepth) {\n#endif\nreturn;\n}\n#ifdef USE_REVERSE_DEPTHBUFFER\nif (fragDepth<nearestDepth && fragDepth>furthestDepth) {\n#else\nif (fragDepth>nearestDepth && fragDepth<furthestDepth) {\n#endif\ndepth.rg=vec2(-fragDepth,fragDepth);\nreturn;\n}\n#endif\n"},3154:(e,t,i)=>{i(8104).v.IncludesShadersStore.pbrBRDFFunctions="#define FRESNEL_MAXIMUM_ON_ROUGH 0.25\n#ifdef MS_BRDF_ENERGY_CONSERVATION\nvec3 getEnergyConservationFactor(const vec3 specularEnvironmentR0,const vec3 environmentBrdf) {\nreturn 1.0+specularEnvironmentR0*(1.0/environmentBrdf.y-1.0);\n}\n#endif\n#ifdef ENVIRONMENTBRDF\nvec3 getBRDFLookup(float NdotV,float perceptualRoughness) {\nvec2 UV=vec2(NdotV,perceptualRoughness);\nvec4 brdfLookup=texture2D(environmentBrdfSampler,UV);\n#ifdef ENVIRONMENTBRDF_RGBD\nbrdfLookup.rgb=fromRGBD(brdfLookup.rgba);\n#endif\nreturn brdfLookup.rgb;\n}\nvec3 getReflectanceFromBRDFLookup(const vec3 specularEnvironmentR0,const vec3 specularEnvironmentR90,const vec3 environmentBrdf) {\n#ifdef BRDF_V_HEIGHT_CORRELATED\nvec3 reflectance=(specularEnvironmentR90-specularEnvironmentR0)*environmentBrdf.x+specularEnvironmentR0*environmentBrdf.y;\n#else\nvec3 reflectance=specularEnvironmentR0*environmentBrdf.x+specularEnvironmentR90*environmentBrdf.y;\n#endif\nreturn reflectance;\n}\nvec3 getReflectanceFromBRDFLookup(const vec3 specularEnvironmentR0,const vec3 environmentBrdf) {\n#ifdef BRDF_V_HEIGHT_CORRELATED\nvec3 reflectance=mix(environmentBrdf.xxx,environmentBrdf.yyy,specularEnvironmentR0);\n#else\nvec3 reflectance=specularEnvironmentR0*environmentBrdf.x+environmentBrdf.y;\n#endif\nreturn reflectance;\n}\n#endif\n/* NOT USED\n#if defined(SHEEN) && defined(SHEEN_SOFTER)\nfloat getBRDFLookupCharlieSheen(float NdotV,float perceptualRoughness)\n{\nfloat c=1.0-NdotV;\nfloat c3=c*c*c;\nreturn 0.65584461*c3+1.0/(4.16526551+exp(-7.97291361*perceptualRoughness+6.33516894));\n}\n#endif\n*/\n#if !defined(ENVIRONMENTBRDF) || defined(REFLECTIONMAP_SKYBOX) || defined(ALPHAFRESNEL)\nvec3 getReflectanceFromAnalyticalBRDFLookup_Jones(float VdotN,vec3 reflectance0,vec3 reflectance90,float smoothness)\n{\nfloat weight=mix(FRESNEL_MAXIMUM_ON_ROUGH,1.0,smoothness);\nreturn reflectance0+weight*(reflectance90-reflectance0)*pow5(saturate(1.0-VdotN));\n}\n#endif\n#if defined(SHEEN) && defined(ENVIRONMENTBRDF)\n/**\n* The sheen BRDF not containing F can be easily stored in the blue channel of the BRDF texture.\n* The blue channel contains DCharlie*VAshikhmin*NdotL as a lokkup table\n*/\nvec3 getSheenReflectanceFromBRDFLookup(const vec3 reflectance0,const vec3 environmentBrdf) {\nvec3 sheenEnvironmentReflectance=reflectance0*environmentBrdf.b;\nreturn sheenEnvironmentReflectance;\n}\n#endif\nvec3 fresnelSchlickGGX(float VdotH,vec3 reflectance0,vec3 reflectance90)\n{\nreturn reflectance0+(reflectance90-reflectance0)*pow5(1.0-VdotH);\n}\nfloat fresnelSchlickGGX(float VdotH,float reflectance0,float reflectance90)\n{\nreturn reflectance0+(reflectance90-reflectance0)*pow5(1.0-VdotH);\n}\n#ifdef CLEARCOAT\nvec3 getR0RemappedForClearCoat(vec3 f0) {\n#ifdef CLEARCOAT_DEFAULTIOR\n#ifdef MOBILE\nreturn saturate(f0*(f0*0.526868+0.529324)-0.0482256);\n#else\nreturn saturate(f0*(f0*(0.941892-0.263008*f0)+0.346479)-0.0285998);\n#endif\n#else\nvec3 s=sqrt(f0);\nvec3 t=(vClearCoatRefractionParams.z+vClearCoatRefractionParams.w*s)/(vClearCoatRefractionParams.w+vClearCoatRefractionParams.z*s);\nreturn square(t);\n#endif\n}\n#endif\n#ifdef IRIDESCENCE\nconst mat3 XYZ_TO_REC709=mat3(\n3.2404542,-0.9692660, 0.0556434,\n-1.5371385, 1.8760108,-0.2040259,\n-0.4985314, 0.0415560, 1.0572252\n);\nvec3 getIORTfromAirToSurfaceR0(vec3 f0) {\nvec3 sqrtF0=sqrt(f0);\nreturn (1.+sqrtF0)/(1.-sqrtF0);\n}\nvec3 getR0fromIORs(vec3 iorT,float iorI) {\nreturn square((iorT-vec3(iorI))/(iorT+vec3(iorI)));\n}\nfloat getR0fromIORs(float iorT,float iorI) {\nreturn square((iorT-iorI)/(iorT+iorI));\n}\nvec3 evalSensitivity(float opd,vec3 shift) {\nfloat phase=2.0*PI*opd*1.0e-9;\nconst vec3 val=vec3(5.4856e-13,4.4201e-13,5.2481e-13);\nconst vec3 pos=vec3(1.6810e+06,1.7953e+06,2.2084e+06);\nconst vec3 var=vec3(4.3278e+09,9.3046e+09,6.6121e+09);\nvec3 xyz=val*sqrt(2.0*PI*var)*cos(pos*phase+shift)*exp(-square(phase)*var);\nxyz.x+=9.7470e-14*sqrt(2.0*PI*4.5282e+09)*cos(2.2399e+06*phase+shift[0])*exp(-4.5282e+09*square(phase));\nxyz/=1.0685e-7;\nvec3 srgb=XYZ_TO_REC709*xyz;\nreturn srgb;\n}\nvec3 evalIridescence(float outsideIOR,float eta2,float cosTheta1,float thinFilmThickness,vec3 baseF0) {\nvec3 I=vec3(1.0);\nfloat iridescenceIOR=mix(outsideIOR,eta2,smoothstep(0.0,0.03,thinFilmThickness));\nfloat sinTheta2Sq=square(outsideIOR/iridescenceIOR)*(1.0-square(cosTheta1));\nfloat cosTheta2Sq=1.0-sinTheta2Sq;\nif (cosTheta2Sq<0.0) {\nreturn I;\n}\nfloat cosTheta2=sqrt(cosTheta2Sq);\nfloat R0=getR0fromIORs(iridescenceIOR,outsideIOR);\nfloat R12=fresnelSchlickGGX(cosTheta1,R0,1.);\nfloat R21=R12;\nfloat T121=1.0-R12;\nfloat phi12=0.0;\nif (iridescenceIOR<outsideIOR) phi12=PI;\nfloat phi21=PI-phi12;\nvec3 baseIOR=getIORTfromAirToSurfaceR0(clamp(baseF0,0.0,0.9999)); \nvec3 R1=getR0fromIORs(baseIOR,iridescenceIOR);\nvec3 R23=fresnelSchlickGGX(cosTheta2,R1,vec3(1.));\nvec3 phi23=vec3(0.0);\nif (baseIOR[0]<iridescenceIOR) phi23[0]=PI;\nif (baseIOR[1]<iridescenceIOR) phi23[1]=PI;\nif (baseIOR[2]<iridescenceIOR) phi23[2]=PI;\nfloat opd=2.0*iridescenceIOR*thinFilmThickness*cosTheta2;\nvec3 phi=vec3(phi21)+phi23;\nvec3 R123=clamp(R12*R23,1e-5,0.9999);\nvec3 r123=sqrt(R123);\nvec3 Rs=square(T121)*R23/(vec3(1.0)-R123);\nvec3 C0=R12+Rs;\nI=C0;\nvec3 Cm=Rs-T121;\nfor (int m=1; m<=2; ++m)\n{\nCm*=r123;\nvec3 Sm=2.0*evalSensitivity(float(m)*opd,float(m)*phi);\nI+=Cm*Sm;\n}\nreturn max(I,vec3(0.0));\n}\n#endif\nfloat normalDistributionFunction_TrowbridgeReitzGGX(float NdotH,float alphaG)\n{\nfloat a2=square(alphaG);\nfloat d=NdotH*NdotH*(a2-1.0)+1.0;\nreturn a2/(PI*d*d);\n}\n#ifdef SHEEN\nfloat normalDistributionFunction_CharlieSheen(float NdotH,float alphaG)\n{\nfloat invR=1./alphaG;\nfloat cos2h=NdotH*NdotH;\nfloat sin2h=1.-cos2h;\nreturn (2.+invR)*pow(sin2h,invR*.5)/(2.*PI);\n}\n#endif\n#ifdef ANISOTROPIC\nfloat normalDistributionFunction_BurleyGGX_Anisotropic(float NdotH,float TdotH,float BdotH,const vec2 alphaTB) {\nfloat a2=alphaTB.x*alphaTB.y;\nvec3 v=vec3(alphaTB.y*TdotH,alphaTB.x *BdotH,a2*NdotH);\nfloat v2=dot(v,v);\nfloat w2=a2/v2;\nreturn a2*w2*w2*RECIPROCAL_PI;\n}\n#endif\n#ifdef BRDF_V_HEIGHT_CORRELATED\nfloat smithVisibility_GGXCorrelated(float NdotL,float NdotV,float alphaG) {\n#ifdef MOBILE\nfloat GGXV=NdotL*(NdotV*(1.0-alphaG)+alphaG);\nfloat GGXL=NdotV*(NdotL*(1.0-alphaG)+alphaG);\nreturn 0.5/(GGXV+GGXL);\n#else\nfloat a2=alphaG*alphaG;\nfloat GGXV=NdotL*sqrt(NdotV*(NdotV-a2*NdotV)+a2);\nfloat GGXL=NdotV*sqrt(NdotL*(NdotL-a2*NdotL)+a2);\nreturn 0.5/(GGXV+GGXL);\n#endif\n}\n#else\nfloat smithVisibilityG1_TrowbridgeReitzGGXFast(float dot,float alphaG)\n{\n#ifdef MOBILE\nreturn 1.0/(dot+alphaG+(1.0-alphaG)*dot ));\n#else\nfloat alphaSquared=alphaG*alphaG;\nreturn 1.0/(dot+sqrt(alphaSquared+(1.0-alphaSquared)*dot*dot));\n#endif\n}\nfloat smithVisibility_TrowbridgeReitzGGXFast(float NdotL,float NdotV,float alphaG)\n{\nfloat visibility=smithVisibilityG1_TrowbridgeReitzGGXFast(NdotL,alphaG)*smithVisibilityG1_TrowbridgeReitzGGXFast(NdotV,alphaG);\nreturn visibility;\n}\n#endif\n#ifdef ANISOTROPIC\nfloat smithVisibility_GGXCorrelated_Anisotropic(float NdotL,float NdotV,float TdotV,float BdotV,float TdotL,float BdotL,const vec2 alphaTB) {\nfloat lambdaV=NdotL*length(vec3(alphaTB.x*TdotV,alphaTB.y*BdotV,NdotV));\nfloat lambdaL=NdotV*length(vec3(alphaTB.x*TdotL,alphaTB.y*BdotL,NdotL));\nfloat v=0.5/(lambdaV+lambdaL);\nreturn v;\n}\n#endif\n#ifdef CLEARCOAT\nfloat visibility_Kelemen(float VdotH) {\nreturn 0.25/(VdotH*VdotH); \n}\n#endif\n#ifdef SHEEN\nfloat visibility_Ashikhmin(float NdotL,float NdotV)\n{\nreturn 1./(4.*(NdotL+NdotV-NdotL*NdotV));\n}\n/* NOT USED\n#ifdef SHEEN_SOFTER\nfloat l(float x,float alphaG)\n{\nfloat oneMinusAlphaSq=(1.0-alphaG)*(1.0-alphaG);\nfloat a=mix(21.5473,25.3245,oneMinusAlphaSq);\nfloat b=mix(3.82987,3.32435,oneMinusAlphaSq);\nfloat c=mix(0.19823,0.16801,oneMinusAlphaSq);\nfloat d=mix(-1.97760,-1.27393,oneMinusAlphaSq);\nfloat e=mix(-4.32054,-4.85967,oneMinusAlphaSq);\nreturn a/(1.0+b*pow(x,c))+d*x+e;\n}\nfloat lambdaSheen(float cosTheta,float alphaG)\n{\nreturn abs(cosTheta)<0.5 ? exp(l(cosTheta,alphaG)) : exp(2.0*l(0.5,alphaG)-l(1.0-cosTheta,alphaG));\n}\nfloat visibility_CharlieSheen(float NdotL,float NdotV,float alphaG)\n{\nfloat G=1.0/(1.0+lambdaSheen(NdotV,alphaG)+lambdaSheen(NdotL,alphaG));\nreturn G/(4.0*NdotV*NdotL);\n}\n#endif\n*/\n#endif\nfloat diffuseBRDF_Burley(float NdotL,float NdotV,float VdotH,float roughness) {\nfloat diffuseFresnelNV=pow5(saturateEps(1.0-NdotL));\nfloat diffuseFresnelNL=pow5(saturateEps(1.0-NdotV));\nfloat diffuseFresnel90=0.5+2.0*VdotH*VdotH*roughness;\nfloat fresnel =\n(1.0+(diffuseFresnel90-1.0)*diffuseFresnelNL) *\n(1.0+(diffuseFresnel90-1.0)*diffuseFresnelNV);\nreturn fresnel/PI;\n}\n#ifdef SS_TRANSLUCENCY\nvec3 transmittanceBRDF_Burley(const vec3 tintColor,const vec3 diffusionDistance,float thickness) {\nvec3 S=1./maxEps(diffusionDistance);\nvec3 temp=exp((-0.333333333*thickness)*S);\nreturn tintColor.rgb*0.25*(temp*temp*temp+3.0*temp);\n}\nfloat computeWrappedDiffuseNdotL(float NdotL,float w) {\nfloat t=1.0+w;\nfloat invt2=1.0/square(t);\nreturn saturate((NdotL+w)*invt2);\n}\n#endif\n"},8190:(e,t,i)=>{i(8104).v.IncludesShadersStore.prePassDeclaration="#ifdef PREPASS\n#extension GL_EXT_draw_buffers : require\nlayout(location=0) out highp vec4 glFragData[{X}];highp vec4 gl_FragColor;\n#ifdef PREPASS_DEPTH\nvarying highp vec3 vViewPos;\n#endif\n#ifdef PREPASS_VELOCITY\nvarying highp vec4 vCurrentPosition;varying highp vec4 vPreviousPosition;\n#endif\n#endif\n"},8741:(e,t,i)=>{i(8104).v.IncludesShadersStore.prePassVertex="#ifdef PREPASS_DEPTH\nvViewPos=(view*worldPos).rgb;\n#endif\n#if defined(PREPASS_VELOCITY) && defined(BONES_VELOCITY_ENABLED)\nvCurrentPosition=viewProjection*worldPos;\n#if NUM_BONE_INFLUENCERS>0\nmat4 previousInfluence;\npreviousInfluence=mPreviousBones[int(matricesIndices[0])]*matricesWeights[0];\n#if NUM_BONE_INFLUENCERS>1\npreviousInfluence+=mPreviousBones[int(matricesIndices[1])]*matricesWeights[1];\n#endif \n#if NUM_BONE_INFLUENCERS>2\npreviousInfluence+=mPreviousBones[int(matricesIndices[2])]*matricesWeights[2];\n#endif \n#if NUM_BONE_INFLUENCERS>3\npreviousInfluence+=mPreviousBones[int(matricesIndices[3])]*matricesWeights[3];\n#endif\n#if NUM_BONE_INFLUENCERS>4\npreviousInfluence+=mPreviousBones[int(matricesIndicesExtra[0])]*matricesWeightsExtra[0];\n#endif \n#if NUM_BONE_INFLUENCERS>5\npreviousInfluence+=mPreviousBones[int(matricesIndicesExtra[1])]*matricesWeightsExtra[1];\n#endif \n#if NUM_BONE_INFLUENCERS>6\npreviousInfluence+=mPreviousBones[int(matricesIndicesExtra[2])]*matricesWeightsExtra[2];\n#endif \n#if NUM_BONE_INFLUENCERS>7\npreviousInfluence+=mPreviousBones[int(matricesIndicesExtra[3])]*matricesWeightsExtra[3];\n#endif\nvPreviousPosition=previousViewProjection*finalPreviousWorld*previousInfluence*vec4(positionUpdated,1.0);\n#else\nvPreviousPosition=previousViewProjection*finalPreviousWorld*vec4(positionUpdated,1.0);\n#endif\n#endif\n"},7019:(e,t,i)=>{i(8104).v.IncludesShadersStore.prePassVertexDeclaration="#ifdef PREPASS\n#ifdef PREPASS_DEPTH\nvarying vec3 vViewPos;\n#endif\n#ifdef PREPASS_VELOCITY\nuniform mat4 previousViewProjection;\nvarying vec4 vCurrentPosition;\nvarying vec4 vPreviousPosition;\n#endif\n#endif\n"},2132:(e,t,i)=>{i(8104).v.IncludesShadersStore.reflectionFunction="vec3 computeFixedEquirectangularCoords(vec4 worldPos,vec3 worldNormal,vec3 direction)\n{\nfloat lon=atan(direction.z,direction.x);\nfloat lat=acos(direction.y);\nvec2 sphereCoords=vec2(lon,lat)*RECIPROCAL_PI2*2.0;\nfloat s=sphereCoords.x*0.5+0.5;\nfloat t=sphereCoords.y;\nreturn vec3(s,t,0); \n}\nvec3 computeMirroredFixedEquirectangularCoords(vec4 worldPos,vec3 worldNormal,vec3 direction)\n{\nfloat lon=atan(direction.z,direction.x);\nfloat lat=acos(direction.y);\nvec2 sphereCoords=vec2(lon,lat)*RECIPROCAL_PI2*2.0;\nfloat s=sphereCoords.x*0.5+0.5;\nfloat t=sphereCoords.y;\nreturn vec3(1.0-s,t,0); \n}\nvec3 computeEquirectangularCoords(vec4 worldPos,vec3 worldNormal,vec3 eyePosition,mat4 reflectionMatrix)\n{\nvec3 cameraToVertex=normalize(worldPos.xyz-eyePosition);\nvec3 r=normalize(reflect(cameraToVertex,worldNormal));\nr=vec3(reflectionMatrix*vec4(r,0));\nfloat lon=atan(r.z,r.x);\nfloat lat=acos(r.y);\nvec2 sphereCoords=vec2(lon,lat)*RECIPROCAL_PI2*2.0;\nfloat s=sphereCoords.x*0.5+0.5;\nfloat t=sphereCoords.y;\nreturn vec3(s,t,0);\n}\nvec3 computeSphericalCoords(vec4 worldPos,vec3 worldNormal,mat4 view,mat4 reflectionMatrix)\n{\nvec3 viewDir=normalize(vec3(view*worldPos));\nvec3 viewNormal=normalize(vec3(view*vec4(worldNormal,0.0)));\nvec3 r=reflect(viewDir,viewNormal);\nr=vec3(reflectionMatrix*vec4(r,0));\nr.z=r.z-1.0;\nfloat m=2.0*length(r);\nreturn vec3(r.x/m+0.5,1.0-r.y/m-0.5,0);\n}\nvec3 computePlanarCoords(vec4 worldPos,vec3 worldNormal,vec3 eyePosition,mat4 reflectionMatrix)\n{\nvec3 viewDir=worldPos.xyz-eyePosition;\nvec3 coords=normalize(reflect(viewDir,worldNormal));\nreturn vec3(reflectionMatrix*vec4(coords,1));\n}\nvec3 computeCubicCoords(vec4 worldPos,vec3 worldNormal,vec3 eyePosition,mat4 reflectionMatrix)\n{\nvec3 viewDir=normalize(worldPos.xyz-eyePosition);\nvec3 coords=reflect(viewDir,worldNormal);\ncoords=vec3(reflectionMatrix*vec4(coords,0));\n#ifdef INVERTCUBICMAP\ncoords.y*=-1.0;\n#endif\nreturn coords;\n}\nvec3 computeCubicLocalCoords(vec4 worldPos,vec3 worldNormal,vec3 eyePosition,mat4 reflectionMatrix,vec3 reflectionSize,vec3 reflectionPosition)\n{\nvec3 viewDir=normalize(worldPos.xyz-eyePosition);\nvec3 coords=reflect(viewDir,worldNormal);\ncoords=parallaxCorrectNormal(worldPos.xyz,coords,reflectionSize,reflectionPosition);\ncoords=vec3(reflectionMatrix*vec4(coords,0));\n#ifdef INVERTCUBICMAP\ncoords.y*=-1.0;\n#endif\nreturn coords;\n}\nvec3 computeProjectionCoords(vec4 worldPos,mat4 view,mat4 reflectionMatrix)\n{\nreturn vec3(reflectionMatrix*(view*worldPos));\n}\nvec3 computeSkyBoxCoords(vec3 positionW,mat4 reflectionMatrix)\n{\nreturn vec3(reflectionMatrix*vec4(positionW,1.));\n}\n#ifdef REFLECTION\nvec3 computeReflectionCoords(vec4 worldPos,vec3 worldNormal)\n{\n#ifdef REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED\nvec3 direction=normalize(vDirectionW);\nreturn computeMirroredFixedEquirectangularCoords(worldPos,worldNormal,direction);\n#endif\n#ifdef REFLECTIONMAP_EQUIRECTANGULAR_FIXED\nvec3 direction=normalize(vDirectionW);\nreturn computeFixedEquirectangularCoords(worldPos,worldNormal,direction);\n#endif\n#ifdef REFLECTIONMAP_EQUIRECTANGULAR\nreturn computeEquirectangularCoords(worldPos,worldNormal,vEyePosition.xyz,reflectionMatrix);\n#endif\n#ifdef REFLECTIONMAP_SPHERICAL\nreturn computeSphericalCoords(worldPos,worldNormal,view,reflectionMatrix);\n#endif\n#ifdef REFLECTIONMAP_PLANAR\nreturn computePlanarCoords(worldPos,worldNormal,vEyePosition.xyz,reflectionMatrix);\n#endif\n#ifdef REFLECTIONMAP_CUBIC\n#ifdef USE_LOCAL_REFLECTIONMAP_CUBIC\nreturn computeCubicLocalCoords(worldPos,worldNormal,vEyePosition.xyz,reflectionMatrix,vReflectionSize,vReflectionPosition);\n#else\nreturn computeCubicCoords(worldPos,worldNormal,vEyePosition.xyz,reflectionMatrix);\n#endif\n#endif\n#ifdef REFLECTIONMAP_PROJECTION\nreturn computeProjectionCoords(worldPos,view,reflectionMatrix);\n#endif\n#ifdef REFLECTIONMAP_SKYBOX\nreturn computeSkyBoxCoords(vPositionUVW,reflectionMatrix);\n#endif\n#ifdef REFLECTIONMAP_EXPLICIT\nreturn vec3(0,0,0);\n#endif\n}\n#endif\n"},1015:(e,t,i)=>{i(8104).v.IncludesShadersStore.samplerFragmentDeclaration="#ifdef _DEFINENAME_\n#if _DEFINENAME_DIRECTUV==1\n#define v_VARYINGNAME_UV vMainUV1\n#elif _DEFINENAME_DIRECTUV==2\n#define v_VARYINGNAME_UV vMainUV2\n#elif _DEFINENAME_DIRECTUV==3\n#define v_VARYINGNAME_UV vMainUV3\n#elif _DEFINENAME_DIRECTUV==4\n#define v_VARYINGNAME_UV vMainUV4\n#elif _DEFINENAME_DIRECTUV==5\n#define v_VARYINGNAME_UV vMainUV5\n#elif _DEFINENAME_DIRECTUV==6\n#define v_VARYINGNAME_UV vMainUV6\n#else\nvarying vec2 v_VARYINGNAME_UV;\n#endif\nuniform sampler2D _SAMPLERNAME_Sampler;\n#endif\n"},9478:(e,t,i)=>{i(8104).v.IncludesShadersStore.samplerVertexDeclaration="#if defined(_DEFINENAME_) && _DEFINENAME_DIRECTUV==0\nvarying vec2 v_VARYINGNAME_UV;\n#endif\n"},2508:(e,t,i)=>{i(8104).v.IncludesShadersStore.samplerVertexImplementation="#if defined(_DEFINENAME_) && _DEFINENAME_DIRECTUV==0\nif (v_INFONAME_==0.)\n{\nv_VARYINGNAME_UV=vec2(_MATRIXNAME_Matrix*vec4(uvUpdated,1.0,0.0));\n}\n#ifdef UV2\nelse if (v_INFONAME_==1.)\n{\nv_VARYINGNAME_UV=vec2(_MATRIXNAME_Matrix*vec4(uv2,1.0,0.0));\n}\n#endif\n#ifdef UV3\nelse if (v_INFONAME_==2.)\n{\nv_VARYINGNAME_UV=vec2(_MATRIXNAME_Matrix*vec4(uv3,1.0,0.0));\n}\n#endif\n#ifdef UV4\nelse if (v_INFONAME_==3.)\n{\nv_VARYINGNAME_UV=vec2(_MATRIXNAME_Matrix*vec4(uv4,1.0,0.0));\n}\n#endif\n#ifdef UV5\nelse if (v_INFONAME_==4.)\n{\nv_VARYINGNAME_UV=vec2(_MATRIXNAME_Matrix*vec4(uv5,1.0,0.0));\n}\n#endif\n#ifdef UV6\nelse if (v_INFONAME_==5.)\n{\nv_VARYINGNAME_UV=vec2(_MATRIXNAME_Matrix*vec4(uv6,1.0,0.0));\n}\n#endif\n#endif\n"},2963:(e,t,i)=>{i(8104).v.IncludesShadersStore.sceneUboDeclaration="layout(std140,column_major) uniform;\nuniform Scene {\nmat4 viewProjection;\n#ifdef MULTIVIEW\nmat4 viewProjectionR;\n#endif \nmat4 view;\nmat4 projection;\nvec4 vEyePosition;\n};\n"},3996:(e,t,i)=>{i(8104).v.IncludesShadersStore.shadowsFragmentFunctions="#ifdef SHADOWS\n#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\n#define TEXTUREFUNC(s,c,l) texture2DLodEXT(s,c,l)\n#else\n#define TEXTUREFUNC(s,c,b) texture2D(s,c,b)\n#endif\n#ifndef SHADOWFLOAT\nfloat unpack(vec4 color)\n{\nconst vec4 bit_shift=vec4(1.0/(255.0*255.0*255.0),1.0/(255.0*255.0),1.0/255.0,1.0);\nreturn dot(color,bit_shift);\n}\n#endif\nfloat computeFallOff(float value,vec2 clipSpace,float frustumEdgeFalloff)\n{\nfloat mask=smoothstep(1.0-frustumEdgeFalloff,1.00000012,clamp(dot(clipSpace,clipSpace),0.,1.));\nreturn mix(value,1.0,mask);\n}\n#define inline\nfloat computeShadowCube(vec3 lightPosition,samplerCube shadowSampler,float darkness,vec2 depthValues)\n{\nvec3 directionToLight=vPositionW-lightPosition;\nfloat depth=length(directionToLight);\ndepth=(depth+depthValues.x)/(depthValues.y);\ndepth=clamp(depth,0.,1.0);\ndirectionToLight=normalize(directionToLight);\ndirectionToLight.y=-directionToLight.y;\n#ifndef SHADOWFLOAT\nfloat shadow=unpack(textureCube(shadowSampler,directionToLight));\n#else\nfloat shadow=textureCube(shadowSampler,directionToLight).x;\n#endif\nreturn depth>shadow ? darkness : 1.0;\n}\n#define inline\nfloat computeShadowWithPoissonSamplingCube(vec3 lightPosition,samplerCube shadowSampler,float mapSize,float darkness,vec2 depthValues)\n{\nvec3 directionToLight=vPositionW-lightPosition;\nfloat depth=length(directionToLight);\ndepth=(depth+depthValues.x)/(depthValues.y);\ndepth=clamp(depth,0.,1.0);\ndirectionToLight=normalize(directionToLight);\ndirectionToLight.y=-directionToLight.y;\nfloat visibility=1.;\nvec3 poissonDisk[4];\npoissonDisk[0]=vec3(-1.0,1.0,-1.0);\npoissonDisk[1]=vec3(1.0,-1.0,-1.0);\npoissonDisk[2]=vec3(-1.0,-1.0,-1.0);\npoissonDisk[3]=vec3(1.0,-1.0,1.0);\n#ifndef SHADOWFLOAT\nif (unpack(textureCube(shadowSampler,directionToLight+poissonDisk[0]*mapSize))<depth) visibility-=0.25;\nif (unpack(textureCube(shadowSampler,directionToLight+poissonDisk[1]*mapSize))<depth) visibility-=0.25;\nif (unpack(textureCube(shadowSampler,directionToLight+poissonDisk[2]*mapSize))<depth) visibility-=0.25;\nif (unpack(textureCube(shadowSampler,directionToLight+poissonDisk[3]*mapSize))<depth) visibility-=0.25;\n#else\nif (textureCube(shadowSampler,directionToLight+poissonDisk[0]*mapSize).x<depth) visibility-=0.25;\nif (textureCube(shadowSampler,directionToLight+poissonDisk[1]*mapSize).x<depth) visibility-=0.25;\nif (textureCube(shadowSampler,directionToLight+poissonDisk[2]*mapSize).x<depth) visibility-=0.25;\nif (textureCube(shadowSampler,directionToLight+poissonDisk[3]*mapSize).x<depth) visibility-=0.25;\n#endif\nreturn min(1.0,visibility+darkness);\n}\n#define inline\nfloat computeShadowWithESMCube(vec3 lightPosition,samplerCube shadowSampler,float darkness,float depthScale,vec2 depthValues)\n{\nvec3 directionToLight=vPositionW-lightPosition;\nfloat depth=length(directionToLight);\ndepth=(depth+depthValues.x)/(depthValues.y);\nfloat shadowPixelDepth=clamp(depth,0.,1.0);\ndirectionToLight=normalize(directionToLight);\ndirectionToLight.y=-directionToLight.y;\n#ifndef SHADOWFLOAT\nfloat shadowMapSample=unpack(textureCube(shadowSampler,directionToLight));\n#else\nfloat shadowMapSample=textureCube(shadowSampler,directionToLight).x;\n#endif\nfloat esm=1.0-clamp(exp(min(87.,depthScale*shadowPixelDepth))*shadowMapSample,0.,1.-darkness); \nreturn esm;\n}\n#define inline\nfloat computeShadowWithCloseESMCube(vec3 lightPosition,samplerCube shadowSampler,float darkness,float depthScale,vec2 depthValues)\n{\nvec3 directionToLight=vPositionW-lightPosition;\nfloat depth=length(directionToLight);\ndepth=(depth+depthValues.x)/(depthValues.y);\nfloat shadowPixelDepth=clamp(depth,0.,1.0);\ndirectionToLight=normalize(directionToLight);\ndirectionToLight.y=-directionToLight.y;\n#ifndef SHADOWFLOAT\nfloat shadowMapSample=unpack(textureCube(shadowSampler,directionToLight));\n#else\nfloat shadowMapSample=textureCube(shadowSampler,directionToLight).x;\n#endif\nfloat esm=clamp(exp(min(87.,-depthScale*(shadowPixelDepth-shadowMapSample))),darkness,1.);\nreturn esm;\n}\n#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\n#define inline\nfloat computeShadowCSM(float layer,vec4 vPositionFromLight,float depthMetric,highp sampler2DArray shadowSampler,float darkness,float frustumEdgeFalloff)\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec2 uv=0.5*clipSpace.xy+vec2(0.5);\nvec3 uvLayer=vec3(uv.x,uv.y,layer);\nfloat shadowPixelDepth=clamp(depthMetric,0.,1.0);\n#ifndef SHADOWFLOAT\nfloat shadow=unpack(texture2D(shadowSampler,uvLayer));\n#else\nfloat shadow=texture2D(shadowSampler,uvLayer).x;\n#endif\nreturn shadowPixelDepth>shadow ? computeFallOff(darkness,clipSpace.xy,frustumEdgeFalloff) : 1.;\n}\n#endif\n#define inline\nfloat computeShadow(vec4 vPositionFromLight,float depthMetric,sampler2D shadowSampler,float darkness,float frustumEdgeFalloff)\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec2 uv=0.5*clipSpace.xy+vec2(0.5);\nif (uv.x<0. || uv.x>1.0 || uv.y<0. || uv.y>1.0)\n{\nreturn 1.0;\n}\nelse\n{\nfloat shadowPixelDepth=clamp(depthMetric,0.,1.0);\n#ifndef SHADOWFLOAT\nfloat shadow=unpack(TEXTUREFUNC(shadowSampler,uv,0.));\n#else\nfloat shadow=TEXTUREFUNC(shadowSampler,uv,0.).x;\n#endif\nreturn shadowPixelDepth>shadow ? computeFallOff(darkness,clipSpace.xy,frustumEdgeFalloff) : 1.;\n}\n}\n#define inline\nfloat computeShadowWithPoissonSampling(vec4 vPositionFromLight,float depthMetric,sampler2D shadowSampler,float mapSize,float darkness,float frustumEdgeFalloff)\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec2 uv=0.5*clipSpace.xy+vec2(0.5);\nif (uv.x<0. || uv.x>1.0 || uv.y<0. || uv.y>1.0)\n{\nreturn 1.0;\n}\nelse\n{\nfloat shadowPixelDepth=clamp(depthMetric,0.,1.0);\nfloat visibility=1.;\nvec2 poissonDisk[4];\npoissonDisk[0]=vec2(-0.94201624,-0.39906216);\npoissonDisk[1]=vec2(0.94558609,-0.76890725);\npoissonDisk[2]=vec2(-0.094184101,-0.92938870);\npoissonDisk[3]=vec2(0.34495938,0.29387760);\n#ifndef SHADOWFLOAT\nif (unpack(TEXTUREFUNC(shadowSampler,uv+poissonDisk[0]*mapSize,0.))<shadowPixelDepth) visibility-=0.25;\nif (unpack(TEXTUREFUNC(shadowSampler,uv+poissonDisk[1]*mapSize,0.))<shadowPixelDepth) visibility-=0.25;\nif (unpack(TEXTUREFUNC(shadowSampler,uv+poissonDisk[2]*mapSize,0.))<shadowPixelDepth) visibility-=0.25;\nif (unpack(TEXTUREFUNC(shadowSampler,uv+poissonDisk[3]*mapSize,0.))<shadowPixelDepth) visibility-=0.25;\n#else\nif (TEXTUREFUNC(shadowSampler,uv+poissonDisk[0]*mapSize,0.).x<shadowPixelDepth) visibility-=0.25;\nif (TEXTUREFUNC(shadowSampler,uv+poissonDisk[1]*mapSize,0.).x<shadowPixelDepth) visibility-=0.25;\nif (TEXTUREFUNC(shadowSampler,uv+poissonDisk[2]*mapSize,0.).x<shadowPixelDepth) visibility-=0.25;\nif (TEXTUREFUNC(shadowSampler,uv+poissonDisk[3]*mapSize,0.).x<shadowPixelDepth) visibility-=0.25;\n#endif\nreturn computeFallOff(min(1.0,visibility+darkness),clipSpace.xy,frustumEdgeFalloff);\n}\n}\n#define inline\nfloat computeShadowWithESM(vec4 vPositionFromLight,float depthMetric,sampler2D shadowSampler,float darkness,float depthScale,float frustumEdgeFalloff)\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec2 uv=0.5*clipSpace.xy+vec2(0.5);\nif (uv.x<0. || uv.x>1.0 || uv.y<0. || uv.y>1.0)\n{\nreturn 1.0;\n}\nelse\n{\nfloat shadowPixelDepth=clamp(depthMetric,0.,1.0);\n#ifndef SHADOWFLOAT\nfloat shadowMapSample=unpack(TEXTUREFUNC(shadowSampler,uv,0.));\n#else\nfloat shadowMapSample=TEXTUREFUNC(shadowSampler,uv,0.).x;\n#endif\nfloat esm=1.0-clamp(exp(min(87.,depthScale*shadowPixelDepth))*shadowMapSample,0.,1.-darkness);\nreturn computeFallOff(esm,clipSpace.xy,frustumEdgeFalloff);\n}\n}\n#define inline\nfloat computeShadowWithCloseESM(vec4 vPositionFromLight,float depthMetric,sampler2D shadowSampler,float darkness,float depthScale,float frustumEdgeFalloff)\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec2 uv=0.5*clipSpace.xy+vec2(0.5);\nif (uv.x<0. || uv.x>1.0 || uv.y<0. || uv.y>1.0)\n{\nreturn 1.0;\n}\nelse\n{\nfloat shadowPixelDepth=clamp(depthMetric,0.,1.0); \n#ifndef SHADOWFLOAT\nfloat shadowMapSample=unpack(TEXTUREFUNC(shadowSampler,uv,0.));\n#else\nfloat shadowMapSample=TEXTUREFUNC(shadowSampler,uv,0.).x;\n#endif\nfloat esm=clamp(exp(min(87.,-depthScale*(shadowPixelDepth-shadowMapSample))),darkness,1.);\nreturn computeFallOff(esm,clipSpace.xy,frustumEdgeFalloff);\n}\n}\n#ifdef IS_NDC_HALF_ZRANGE\n#define ZINCLIP clipSpace.z\n#else\n#define ZINCLIP uvDepth.z\n#endif\n#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\n#define GREATEST_LESS_THAN_ONE 0.99999994\n#define inline\nfloat computeShadowWithCSMPCF1(float layer,vec4 vPositionFromLight,float depthMetric,highp sampler2DArrayShadow shadowSampler,float darkness,float frustumEdgeFalloff)\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec3 uvDepth=vec3(0.5*clipSpace.xyz+vec3(0.5));\nuvDepth.z=clamp(ZINCLIP,0.,GREATEST_LESS_THAN_ONE);\nvec4 uvDepthLayer=vec4(uvDepth.x,uvDepth.y,layer,uvDepth.z);\nfloat shadow=texture2D(shadowSampler,uvDepthLayer);\nshadow=mix(darkness,1.,shadow);\nreturn computeFallOff(shadow,clipSpace.xy,frustumEdgeFalloff);\n}\n#define inline\nfloat computeShadowWithCSMPCF3(float layer,vec4 vPositionFromLight,float depthMetric,highp sampler2DArrayShadow shadowSampler,vec2 shadowMapSizeAndInverse,float darkness,float frustumEdgeFalloff)\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec3 uvDepth=vec3(0.5*clipSpace.xyz+vec3(0.5));\nuvDepth.z=clamp(ZINCLIP,0.,GREATEST_LESS_THAN_ONE);\nvec2 uv=uvDepth.xy*shadowMapSizeAndInverse.x; \nuv+=0.5; \nvec2 st=fract(uv); \nvec2 base_uv=floor(uv)-0.5; \nbase_uv*=shadowMapSizeAndInverse.y; \nvec2 uvw0=3.-2.*st;\nvec2 uvw1=1.+2.*st;\nvec2 u=vec2((2.-st.x)/uvw0.x-1.,st.x/uvw1.x+1.)*shadowMapSizeAndInverse.y;\nvec2 v=vec2((2.-st.y)/uvw0.y-1.,st.y/uvw1.y+1.)*shadowMapSizeAndInverse.y;\nfloat shadow=0.;\nshadow+=uvw0.x*uvw0.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[0],v[0]),layer,uvDepth.z));\nshadow+=uvw1.x*uvw0.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[1],v[0]),layer,uvDepth.z));\nshadow+=uvw0.x*uvw1.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[0],v[1]),layer,uvDepth.z));\nshadow+=uvw1.x*uvw1.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[1],v[1]),layer,uvDepth.z));\nshadow=shadow/16.;\nshadow=mix(darkness,1.,shadow);\nreturn computeFallOff(shadow,clipSpace.xy,frustumEdgeFalloff);\n}\n#define inline\nfloat computeShadowWithCSMPCF5(float layer,vec4 vPositionFromLight,float depthMetric,highp sampler2DArrayShadow shadowSampler,vec2 shadowMapSizeAndInverse,float darkness,float frustumEdgeFalloff)\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec3 uvDepth=vec3(0.5*clipSpace.xyz+vec3(0.5));\nuvDepth.z=clamp(ZINCLIP,0.,GREATEST_LESS_THAN_ONE);\nvec2 uv=uvDepth.xy*shadowMapSizeAndInverse.x; \nuv+=0.5; \nvec2 st=fract(uv); \nvec2 base_uv=floor(uv)-0.5; \nbase_uv*=shadowMapSizeAndInverse.y; \nvec2 uvw0=4.-3.*st;\nvec2 uvw1=vec2(7.);\nvec2 uvw2=1.+3.*st;\nvec3 u=vec3((3.-2.*st.x)/uvw0.x-2.,(3.+st.x)/uvw1.x,st.x/uvw2.x+2.)*shadowMapSizeAndInverse.y;\nvec3 v=vec3((3.-2.*st.y)/uvw0.y-2.,(3.+st.y)/uvw1.y,st.y/uvw2.y+2.)*shadowMapSizeAndInverse.y;\nfloat shadow=0.;\nshadow+=uvw0.x*uvw0.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[0],v[0]),layer,uvDepth.z));\nshadow+=uvw1.x*uvw0.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[1],v[0]),layer,uvDepth.z));\nshadow+=uvw2.x*uvw0.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[2],v[0]),layer,uvDepth.z));\nshadow+=uvw0.x*uvw1.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[0],v[1]),layer,uvDepth.z));\nshadow+=uvw1.x*uvw1.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[1],v[1]),layer,uvDepth.z));\nshadow+=uvw2.x*uvw1.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[2],v[1]),layer,uvDepth.z));\nshadow+=uvw0.x*uvw2.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[0],v[2]),layer,uvDepth.z));\nshadow+=uvw1.x*uvw2.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[1],v[2]),layer,uvDepth.z));\nshadow+=uvw2.x*uvw2.y*texture2D(shadowSampler,vec4(base_uv.xy+vec2(u[2],v[2]),layer,uvDepth.z));\nshadow=shadow/144.;\nshadow=mix(darkness,1.,shadow);\nreturn computeFallOff(shadow,clipSpace.xy,frustumEdgeFalloff);\n}\n#define inline\nfloat computeShadowWithPCF1(vec4 vPositionFromLight,float depthMetric,highp sampler2DShadow shadowSampler,float darkness,float frustumEdgeFalloff)\n{\nif (depthMetric>1.0 || depthMetric<0.0) {\nreturn 1.0;\n}\nelse\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec3 uvDepth=vec3(0.5*clipSpace.xyz+vec3(0.5));\nuvDepth.z=ZINCLIP;\nfloat shadow=TEXTUREFUNC(shadowSampler,uvDepth,0.);\nshadow=mix(darkness,1.,shadow);\nreturn computeFallOff(shadow,clipSpace.xy,frustumEdgeFalloff);\n}\n}\n#define inline\nfloat computeShadowWithPCF3(vec4 vPositionFromLight,float depthMetric,highp sampler2DShadow shadowSampler,vec2 shadowMapSizeAndInverse,float darkness,float frustumEdgeFalloff)\n{\nif (depthMetric>1.0 || depthMetric<0.0) {\nreturn 1.0;\n}\nelse\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec3 uvDepth=vec3(0.5*clipSpace.xyz+vec3(0.5));\nuvDepth.z=ZINCLIP;\nvec2 uv=uvDepth.xy*shadowMapSizeAndInverse.x; \nuv+=0.5; \nvec2 st=fract(uv); \nvec2 base_uv=floor(uv)-0.5; \nbase_uv*=shadowMapSizeAndInverse.y; \nvec2 uvw0=3.-2.*st;\nvec2 uvw1=1.+2.*st;\nvec2 u=vec2((2.-st.x)/uvw0.x-1.,st.x/uvw1.x+1.)*shadowMapSizeAndInverse.y;\nvec2 v=vec2((2.-st.y)/uvw0.y-1.,st.y/uvw1.y+1.)*shadowMapSizeAndInverse.y;\nfloat shadow=0.;\nshadow+=uvw0.x*uvw0.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[0],v[0]),uvDepth.z),0.);\nshadow+=uvw1.x*uvw0.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[1],v[0]),uvDepth.z),0.);\nshadow+=uvw0.x*uvw1.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[0],v[1]),uvDepth.z),0.);\nshadow+=uvw1.x*uvw1.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[1],v[1]),uvDepth.z),0.);\nshadow=shadow/16.;\nshadow=mix(darkness,1.,shadow);\nreturn computeFallOff(shadow,clipSpace.xy,frustumEdgeFalloff);\n}\n}\n#define inline\nfloat computeShadowWithPCF5(vec4 vPositionFromLight,float depthMetric,highp sampler2DShadow shadowSampler,vec2 shadowMapSizeAndInverse,float darkness,float frustumEdgeFalloff)\n{\nif (depthMetric>1.0 || depthMetric<0.0) {\nreturn 1.0;\n}\nelse\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec3 uvDepth=vec3(0.5*clipSpace.xyz+vec3(0.5));\nuvDepth.z=ZINCLIP;\nvec2 uv=uvDepth.xy*shadowMapSizeAndInverse.x; \nuv+=0.5; \nvec2 st=fract(uv); \nvec2 base_uv=floor(uv)-0.5; \nbase_uv*=shadowMapSizeAndInverse.y; \nvec2 uvw0=4.-3.*st;\nvec2 uvw1=vec2(7.);\nvec2 uvw2=1.+3.*st;\nvec3 u=vec3((3.-2.*st.x)/uvw0.x-2.,(3.+st.x)/uvw1.x,st.x/uvw2.x+2.)*shadowMapSizeAndInverse.y;\nvec3 v=vec3((3.-2.*st.y)/uvw0.y-2.,(3.+st.y)/uvw1.y,st.y/uvw2.y+2.)*shadowMapSizeAndInverse.y;\nfloat shadow=0.;\nshadow+=uvw0.x*uvw0.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[0],v[0]),uvDepth.z),0.);\nshadow+=uvw1.x*uvw0.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[1],v[0]),uvDepth.z),0.);\nshadow+=uvw2.x*uvw0.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[2],v[0]),uvDepth.z),0.);\nshadow+=uvw0.x*uvw1.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[0],v[1]),uvDepth.z),0.);\nshadow+=uvw1.x*uvw1.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[1],v[1]),uvDepth.z),0.);\nshadow+=uvw2.x*uvw1.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[2],v[1]),uvDepth.z),0.);\nshadow+=uvw0.x*uvw2.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[0],v[2]),uvDepth.z),0.);\nshadow+=uvw1.x*uvw2.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[1],v[2]),uvDepth.z),0.);\nshadow+=uvw2.x*uvw2.y*TEXTUREFUNC(shadowSampler,vec3(base_uv.xy+vec2(u[2],v[2]),uvDepth.z),0.);\nshadow=shadow/144.;\nshadow=mix(darkness,1.,shadow);\nreturn computeFallOff(shadow,clipSpace.xy,frustumEdgeFalloff);\n}\n}\nconst vec3 PoissonSamplers32[64]=vec3[64](\nvec3(0.06407013,0.05409927,0.),\nvec3(0.7366577,0.5789394,0.),\nvec3(-0.6270542,-0.5320278,0.),\nvec3(-0.4096107,0.8411095,0.),\nvec3(0.6849564,-0.4990818,0.),\nvec3(-0.874181,-0.04579735,0.),\nvec3(0.9989998,0.0009880066,0.),\nvec3(-0.004920578,-0.9151649,0.),\nvec3(0.1805763,0.9747483,0.),\nvec3(-0.2138451,0.2635818,0.),\nvec3(0.109845,0.3884785,0.),\nvec3(0.06876755,-0.3581074,0.),\nvec3(0.374073,-0.7661266,0.),\nvec3(0.3079132,-0.1216763,0.),\nvec3(-0.3794335,-0.8271583,0.),\nvec3(-0.203878,-0.07715034,0.),\nvec3(0.5912697,0.1469799,0.),\nvec3(-0.88069,0.3031784,0.),\nvec3(0.5040108,0.8283722,0.),\nvec3(-0.5844124,0.5494877,0.),\nvec3(0.6017799,-0.1726654,0.),\nvec3(-0.5554981,0.1559997,0.),\nvec3(-0.3016369,-0.3900928,0.),\nvec3(-0.5550632,-0.1723762,0.),\nvec3(0.925029,0.2995041,0.),\nvec3(-0.2473137,0.5538505,0.),\nvec3(0.9183037,-0.2862392,0.),\nvec3(0.2469421,0.6718712,0.),\nvec3(0.3916397,-0.4328209,0.),\nvec3(-0.03576927,-0.6220032,0.),\nvec3(-0.04661255,0.7995201,0.),\nvec3(0.4402924,0.3640312,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.),\nvec3(0.,0.,0.)\n);\nconst vec3 PoissonSamplers64[64]=vec3[64](\nvec3(-0.613392,0.617481,0.),\nvec3(0.170019,-0.040254,0.),\nvec3(-0.299417,0.791925,0.),\nvec3(0.645680,0.493210,0.),\nvec3(-0.651784,0.717887,0.),\nvec3(0.421003,0.027070,0.),\nvec3(-0.817194,-0.271096,0.),\nvec3(-0.705374,-0.668203,0.),\nvec3(0.977050,-0.108615,0.),\nvec3(0.063326,0.142369,0.),\nvec3(0.203528,0.214331,0.),\nvec3(-0.667531,0.326090,0.),\nvec3(-0.098422,-0.295755,0.),\nvec3(-0.885922,0.215369,0.),\nvec3(0.566637,0.605213,0.),\nvec3(0.039766,-0.396100,0.),\nvec3(0.751946,0.453352,0.),\nvec3(0.078707,-0.715323,0.),\nvec3(-0.075838,-0.529344,0.),\nvec3(0.724479,-0.580798,0.),\nvec3(0.222999,-0.215125,0.),\nvec3(-0.467574,-0.405438,0.),\nvec3(-0.248268,-0.814753,0.),\nvec3(0.354411,-0.887570,0.),\nvec3(0.175817,0.382366,0.),\nvec3(0.487472,-0.063082,0.),\nvec3(-0.084078,0.898312,0.),\nvec3(0.488876,-0.783441,0.),\nvec3(0.470016,0.217933,0.),\nvec3(-0.696890,-0.549791,0.),\nvec3(-0.149693,0.605762,0.),\nvec3(0.034211,0.979980,0.),\nvec3(0.503098,-0.308878,0.),\nvec3(-0.016205,-0.872921,0.),\nvec3(0.385784,-0.393902,0.),\nvec3(-0.146886,-0.859249,0.),\nvec3(0.643361,0.164098,0.),\nvec3(0.634388,-0.049471,0.),\nvec3(-0.688894,0.007843,0.),\nvec3(0.464034,-0.188818,0.),\nvec3(-0.440840,0.137486,0.),\nvec3(0.364483,0.511704,0.),\nvec3(0.034028,0.325968,0.),\nvec3(0.099094,-0.308023,0.),\nvec3(0.693960,-0.366253,0.),\nvec3(0.678884,-0.204688,0.),\nvec3(0.001801,0.780328,0.),\nvec3(0.145177,-0.898984,0.),\nvec3(0.062655,-0.611866,0.),\nvec3(0.315226,-0.604297,0.),\nvec3(-0.780145,0.486251,0.),\nvec3(-0.371868,0.882138,0.),\nvec3(0.200476,0.494430,0.),\nvec3(-0.494552,-0.711051,0.),\nvec3(0.612476,0.705252,0.),\nvec3(-0.578845,-0.768792,0.),\nvec3(-0.772454,-0.090976,0.),\nvec3(0.504440,0.372295,0.),\nvec3(0.155736,0.065157,0.),\nvec3(0.391522,0.849605,0.),\nvec3(-0.620106,-0.328104,0.),\nvec3(0.789239,-0.419965,0.),\nvec3(-0.545396,0.538133,0.),\nvec3(-0.178564,-0.596057,0.)\n);\n#define inline\nfloat computeShadowWithCSMPCSS(float layer,vec4 vPositionFromLight,float depthMetric,highp sampler2DArray depthSampler,highp sampler2DArrayShadow shadowSampler,float shadowMapSizeInverse,float lightSizeUV,float darkness,float frustumEdgeFalloff,int searchTapCount,int pcfTapCount,vec3[64] poissonSamplers,vec2 lightSizeUVCorrection,float depthCorrection,float penumbraDarkness)\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec3 uvDepth=vec3(0.5*clipSpace.xyz+vec3(0.5));\nuvDepth.z=clamp(ZINCLIP,0.,GREATEST_LESS_THAN_ONE);\nvec4 uvDepthLayer=vec4(uvDepth.x,uvDepth.y,layer,uvDepth.z);\nfloat blockerDepth=0.0;\nfloat sumBlockerDepth=0.0;\nfloat numBlocker=0.0;\nfor (int i=0; i<searchTapCount; i ++) {\nblockerDepth=texture2D(depthSampler,vec3(uvDepth.xy+(lightSizeUV*lightSizeUVCorrection*shadowMapSizeInverse*PoissonSamplers32[i].xy),layer)).r;\nif (blockerDepth<depthMetric) {\nsumBlockerDepth+=blockerDepth;\nnumBlocker++;\n}\n}\nfloat avgBlockerDepth=sumBlockerDepth/numBlocker;\nfloat AAOffset=shadowMapSizeInverse*10.;\nfloat penumbraRatio=((depthMetric-avgBlockerDepth)*depthCorrection+AAOffset);\nvec4 filterRadius=vec4(penumbraRatio*lightSizeUV*lightSizeUVCorrection*shadowMapSizeInverse,0.,0.);\nfloat random=getRand(vPositionFromLight.xy);\nfloat rotationAngle=random*3.1415926;\nvec2 rotationVector=vec2(cos(rotationAngle),sin(rotationAngle));\nfloat shadow=0.;\nfor (int i=0; i<pcfTapCount; i++) {\nvec4 offset=vec4(poissonSamplers[i],0.);\noffset=vec4(offset.x*rotationVector.x-offset.y*rotationVector.y,offset.y*rotationVector.x+offset.x*rotationVector.y,0.,0.);\nshadow+=texture2D(shadowSampler,uvDepthLayer+offset*filterRadius);\n}\nshadow/=float(pcfTapCount);\nshadow=mix(shadow,1.,min((depthMetric-avgBlockerDepth)*depthCorrection*penumbraDarkness,1.));\nshadow=mix(darkness,1.,shadow);\nif (numBlocker<1.0) {\nreturn 1.0;\n}\nelse\n{\nreturn computeFallOff(shadow,clipSpace.xy,frustumEdgeFalloff);\n}\n}\n#define inline\nfloat computeShadowWithPCSS(vec4 vPositionFromLight,float depthMetric,sampler2D depthSampler,highp sampler2DShadow shadowSampler,float shadowMapSizeInverse,float lightSizeUV,float darkness,float frustumEdgeFalloff,int searchTapCount,int pcfTapCount,vec3[64] poissonSamplers)\n{\nif (depthMetric>1.0 || depthMetric<0.0) {\nreturn 1.0;\n}\nelse\n{\nvec3 clipSpace=vPositionFromLight.xyz/vPositionFromLight.w;\nvec3 uvDepth=vec3(0.5*clipSpace.xyz+vec3(0.5));\nuvDepth.z=ZINCLIP;\nfloat blockerDepth=0.0;\nfloat sumBlockerDepth=0.0;\nfloat numBlocker=0.0;\nfor (int i=0; i<searchTapCount; i ++) {\nblockerDepth=TEXTUREFUNC(depthSampler,uvDepth.xy+(lightSizeUV*shadowMapSizeInverse*PoissonSamplers32[i].xy),0.).r;\nif (blockerDepth<depthMetric) {\nsumBlockerDepth+=blockerDepth;\nnumBlocker++;\n}\n}\nif (numBlocker<1.0) {\nreturn 1.0;\n}\nelse\n{\nfloat avgBlockerDepth=sumBlockerDepth/numBlocker;\nfloat AAOffset=shadowMapSizeInverse*10.;\nfloat penumbraRatio=((depthMetric-avgBlockerDepth)+AAOffset);\nfloat filterRadius=penumbraRatio*lightSizeUV*shadowMapSizeInverse;\nfloat random=getRand(vPositionFromLight.xy);\nfloat rotationAngle=random*3.1415926;\nvec2 rotationVector=vec2(cos(rotationAngle),sin(rotationAngle));\nfloat shadow=0.;\nfor (int i=0; i<pcfTapCount; i++) {\nvec3 offset=poissonSamplers[i];\noffset=vec3(offset.x*rotationVector.x-offset.y*rotationVector.y,offset.y*rotationVector.x+offset.x*rotationVector.y,0.);\nshadow+=TEXTUREFUNC(shadowSampler,uvDepth+offset*filterRadius,0.);\n}\nshadow/=float(pcfTapCount);\nshadow=mix(shadow,1.,depthMetric-avgBlockerDepth);\nshadow=mix(darkness,1.,shadow);\nreturn computeFallOff(shadow,clipSpace.xy,frustumEdgeFalloff);\n}\n}\n}\n#define inline\nfloat computeShadowWithPCSS16(vec4 vPositionFromLight,float depthMetric,sampler2D depthSampler,highp sampler2DShadow shadowSampler,float shadowMapSizeInverse,float lightSizeUV,float darkness,float frustumEdgeFalloff)\n{\nreturn computeShadowWithPCSS(vPositionFromLight,depthMetric,depthSampler,shadowSampler,shadowMapSizeInverse,lightSizeUV,darkness,frustumEdgeFalloff,16,16,PoissonSamplers32);\n}\n#define inline\nfloat computeShadowWithPCSS32(vec4 vPositionFromLight,float depthMetric,sampler2D depthSampler,highp sampler2DShadow shadowSampler,float shadowMapSizeInverse,float lightSizeUV,float darkness,float frustumEdgeFalloff)\n{\nreturn computeShadowWithPCSS(vPositionFromLight,depthMetric,depthSampler,shadowSampler,shadowMapSizeInverse,lightSizeUV,darkness,frustumEdgeFalloff,16,32,PoissonSamplers32);\n}\n#define inline\nfloat computeShadowWithPCSS64(vec4 vPositionFromLight,float depthMetric,sampler2D depthSampler,highp sampler2DShadow shadowSampler,float shadowMapSizeInverse,float lightSizeUV,float darkness,float frustumEdgeFalloff)\n{\nreturn computeShadowWithPCSS(vPositionFromLight,depthMetric,depthSampler,shadowSampler,shadowMapSizeInverse,lightSizeUV,darkness,frustumEdgeFalloff,32,64,PoissonSamplers64);\n}\n#define inline\nfloat computeShadowWithCSMPCSS16(float layer,vec4 vPositionFromLight,float depthMetric,highp sampler2DArray depthSampler,highp sampler2DArrayShadow shadowSampler,float shadowMapSizeInverse,float lightSizeUV,float darkness,float frustumEdgeFalloff,vec2 lightSizeUVCorrection,float depthCorrection,float penumbraDarkness)\n{\nreturn computeShadowWithCSMPCSS(layer,vPositionFromLight,depthMetric,depthSampler,shadowSampler,shadowMapSizeInverse,lightSizeUV,darkness,frustumEdgeFalloff,16,16,PoissonSamplers32,lightSizeUVCorrection,depthCorrection,penumbraDarkness);\n}\n#define inline\nfloat computeShadowWithCSMPCSS32(float layer,vec4 vPositionFromLight,float depthMetric,highp sampler2DArray depthSampler,highp sampler2DArrayShadow shadowSampler,float shadowMapSizeInverse,float lightSizeUV,float darkness,float frustumEdgeFalloff,vec2 lightSizeUVCorrection,float depthCorrection,float penumbraDarkness)\n{\nreturn computeShadowWithCSMPCSS(layer,vPositionFromLight,depthMetric,depthSampler,shadowSampler,shadowMapSizeInverse,lightSizeUV,darkness,frustumEdgeFalloff,16,32,PoissonSamplers32,lightSizeUVCorrection,depthCorrection,penumbraDarkness);\n}\n#define inline\nfloat computeShadowWithCSMPCSS64(float layer,vec4 vPositionFromLight,float depthMetric,highp sampler2DArray depthSampler,highp sampler2DArrayShadow shadowSampler,float shadowMapSizeInverse,float lightSizeUV,float darkness,float frustumEdgeFalloff,vec2 lightSizeUVCorrection,float depthCorrection,float penumbraDarkness)\n{\nreturn computeShadowWithCSMPCSS(layer,vPositionFromLight,depthMetric,depthSampler,shadowSampler,shadowMapSizeInverse,lightSizeUV,darkness,frustumEdgeFalloff,32,64,PoissonSamplers64,lightSizeUVCorrection,depthCorrection,penumbraDarkness);\n}\n#endif\n#endif\n"},1101:(e,t,i)=>{i(8104).v.IncludesShadersStore.shadowsVertex="#ifdef SHADOWS\n#if defined(SHADOWCSM{X})\nvPositionFromCamera{X}=view*worldPos;\nfor (int i=0; i<SHADOWCSMNUM_CASCADES{X}; i++) {\nvPositionFromLight{X}[i]=lightMatrix{X}[i]*worldPos;\n#ifdef USE_REVERSE_DEPTHBUFFER\nvDepthMetric{X}[i]=(-vPositionFromLight{X}[i].z+light{X}.depthValues.x)/light{X}.depthValues.y;\n#else\nvDepthMetric{X}[i]=(vPositionFromLight{X}[i].z+light{X}.depthValues.x)/light{X}.depthValues.y;\n#endif\n}\n#elif defined(SHADOW{X}) && !defined(SHADOWCUBE{X})\nvPositionFromLight{X}=lightMatrix{X}*worldPos;\n#ifdef USE_REVERSE_DEPTHBUFFER\nvDepthMetric{X}=(-vPositionFromLight{X}.z+light{X}.depthValues.x)/light{X}.depthValues.y;\n#else\nvDepthMetric{X}=(vPositionFromLight{X}.z+light{X}.depthValues.x)/light{X}.depthValues.y;\n#endif\n#endif\n#endif\n"},4022:(e,t,i)=>{i(8104).v.IncludesShadersStore.subSurfaceScatteringFunctions="bool testLightingForSSS(float diffusionProfile)\n{\nreturn diffusionProfile<1.;\n}"},6467:(e,t,i)=>{i(8104).v.IncludesShadersStore.uvAttributeDeclaration="#ifdef UV{X}\nattribute vec2 uv{X};\n#endif\n"},3088:(e,t,i)=>{i(8104).v.IncludesShadersStore.uvVariableDeclaration="#if !defined(UV{X}) && defined(MAINUV{X})\nvec2 uv{X}=vec2(0.,0.);\n#endif\n#ifdef MAINUV{X}\nvMainUV{X}=uv{X};\n#endif\n"},9025:(e,t,i)=>{i(8104).v.IncludesShadersStore.vertexColorMixing="#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvColor=vec4(1.0);\n#ifdef VERTEXCOLOR\n#ifdef VERTEXALPHA\nvColor*=color;\n#else\nvColor.rgb*=color.rgb;\n#endif\n#endif\n#ifdef INSTANCESCOLOR\nvColor*=instanceColor;\n#endif\n#endif\n"},6980:(e,t,i)=>{var n=i(8104);i(6390),i(5791);n.v.ShadersStore.colorPixelShader="#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\n#define VERTEXCOLOR\nvarying vec4 vColor;\n#else\nuniform vec4 color;\n#endif\n#include<clipPlaneFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\ngl_FragColor=vColor;\n#else\ngl_FragColor=color;\n#endif\n#define CUSTOM_FRAGMENT_MAIN_END\n}"},9753:(e,t,i)=>{var n=i(8104);i(7520),i(493),i(6343),i(1063),i(6883),i(6655),i(3206),i(5215),i(9025);n.v.ShadersStore.colorVertexShader="attribute vec3 position;\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<clipPlaneVertexDeclaration>\n#include<instancesDeclaration>\nuniform mat4 viewProjection;\n#ifdef MULTIVIEW\nuniform mat4 viewProjectionR;\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(position,1.0);\n#ifdef MULTIVIEW\nif (gl_ViewID_OVR==0u) {\ngl_Position=viewProjection*worldPos;\n} else {\ngl_Position=viewProjectionR*worldPos;\n}\n#else\ngl_Position=viewProjection*worldPos;\n#endif\n#include<clipPlaneVertex>\n#include<vertexColorMixing>\n#define CUSTOM_VERTEX_MAIN_END\n}"},7182:(e,t,i)=>{i.d(t,{T:()=>r});const n="passPixelShader",s="varying vec2 vUV;\nuniform sampler2D textureSampler;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) \n{\ngl_FragColor=texture2D(textureSampler,vUV);\n}";i(8104).v.ShadersStore[n]=s;const r={name:n,shader:s}},8793:(e,t,i)=>{i(8104).v.ShadersStore.postprocessVertexShader="attribute vec2 position;\nuniform vec2 scale;\nvarying vec2 vUV;\nconst vec2 madd=vec2(0.5,0.5);\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nvUV=(position*madd+madd)*scale;\ngl_Position=vec4(position,0.0,1.0);\n#define CUSTOM_VERTEX_MAIN_END\n}"},7161:(e,t,i)=>{var n=i(8104);i(1423);n.v.ShadersStore.rgbdDecodePixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\n#include<helperFunctions>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) \n{\ngl_FragColor=vec4(fromRGBD(texture2D(textureSampler,vUV)),1.0);\n}"},4710:(e,t,i)=>{i.d(t,{Q:()=>n});class n{constructor(){this._blendFunctionParameters=new Array(4),this._blendEquationParameters=new Array(2),this._blendConstants=new Array(4),this._isBlendConstantsDirty=!1,this._alphaBlend=!1,this._isAlphaBlendDirty=!1,this._isBlendFunctionParametersDirty=!1,this._isBlendEquationParametersDirty=!1,this.reset()}get isDirty(){return this._isAlphaBlendDirty||this._isBlendFunctionParametersDirty||this._isBlendEquationParametersDirty}get alphaBlend(){return this._alphaBlend}set alphaBlend(e){this._alphaBlend!==e&&(this._alphaBlend=e,this._isAlphaBlendDirty=!0)}setAlphaBlendConstants(e,t,i,n){this._blendConstants[0]===e&&this._blendConstants[1]===t&&this._blendConstants[2]===i&&this._blendConstants[3]===n||(this._blendConstants[0]=e,this._blendConstants[1]=t,this._blendConstants[2]=i,this._blendConstants[3]=n,this._isBlendConstantsDirty=!0)}setAlphaBlendFunctionParameters(e,t,i,n){this._blendFunctionParameters[0]===e&&this._blendFunctionParameters[1]===t&&this._blendFunctionParameters[2]===i&&this._blendFunctionParameters[3]===n||(this._blendFunctionParameters[0]=e,this._blendFunctionParameters[1]=t,this._blendFunctionParameters[2]=i,this._blendFunctionParameters[3]=n,this._isBlendFunctionParametersDirty=!0)}setAlphaEquationParameters(e,t){this._blendEquationParameters[0]===e&&this._blendEquationParameters[1]===t||(this._blendEquationParameters[0]=e,this._blendEquationParameters[1]=t,this._isBlendEquationParametersDirty=!0)}reset(){this._alphaBlend=!1,this._blendFunctionParameters[0]=null,this._blendFunctionParameters[1]=null,this._blendFunctionParameters[2]=null,this._blendFunctionParameters[3]=null,this._blendEquationParameters[0]=null,this._blendEquationParameters[1]=null,this._blendConstants[0]=null,this._blendConstants[1]=null,this._blendConstants[2]=null,this._blendConstants[3]=null,this._isAlphaBlendDirty=!0,this._isBlendFunctionParametersDirty=!1,this._isBlendEquationParametersDirty=!1,this._isBlendConstantsDirty=!1}apply(e){this.isDirty&&(this._isAlphaBlendDirty&&(this._alphaBlend?e.enable(e.BLEND):e.disable(e.BLEND),this._isAlphaBlendDirty=!1),this._isBlendFunctionParametersDirty&&(e.blendFuncSeparate(this._blendFunctionParameters[0],this._blendFunctionParameters[1],this._blendFunctionParameters[2],this._blendFunctionParameters[3]),this._isBlendFunctionParametersDirty=!1),this._isBlendEquationParametersDirty&&(e.blendEquationSeparate(this._blendEquationParameters[0],this._blendEquationParameters[1]),this._isBlendEquationParametersDirty=!1),this._isBlendConstantsDirty&&(e.blendColor(this._blendConstants[0],this._blendConstants[1],this._blendConstants[2],this._blendConstants[3]),this._isBlendConstantsDirty=!1))}}},6533:(e,t,i)=>{i.d(t,{k:()=>n});class n{constructor(e=!0){this._isDepthTestDirty=!1,this._isDepthMaskDirty=!1,this._isDepthFuncDirty=!1,this._isCullFaceDirty=!1,this._isCullDirty=!1,this._isZOffsetDirty=!1,this._isFrontFaceDirty=!1,e&&this.reset()}get isDirty(){return this._isDepthFuncDirty||this._isDepthTestDirty||this._isDepthMaskDirty||this._isCullFaceDirty||this._isCullDirty||this._isZOffsetDirty||this._isFrontFaceDirty}get zOffset(){return this._zOffset}set zOffset(e){this._zOffset!==e&&(this._zOffset=e,this._isZOffsetDirty=!0)}get zOffsetUnits(){return this._zOffsetUnits}set zOffsetUnits(e){this._zOffsetUnits!==e&&(this._zOffsetUnits=e,this._isZOffsetDirty=!0)}get cullFace(){return this._cullFace}set cullFace(e){this._cullFace!==e&&(this._cullFace=e,this._isCullFaceDirty=!0)}get cull(){return this._cull}set cull(e){this._cull!==e&&(this._cull=e,this._isCullDirty=!0)}get depthFunc(){return this._depthFunc}set depthFunc(e){this._depthFunc!==e&&(this._depthFunc=e,this._isDepthFuncDirty=!0)}get depthMask(){return this._depthMask}set depthMask(e){this._depthMask!==e&&(this._depthMask=e,this._isDepthMaskDirty=!0)}get depthTest(){return this._depthTest}set depthTest(e){this._depthTest!==e&&(this._depthTest=e,this._isDepthTestDirty=!0)}get frontFace(){return this._frontFace}set frontFace(e){this._frontFace!==e&&(this._frontFace=e,this._isFrontFaceDirty=!0)}reset(){this._depthMask=!0,this._depthTest=!0,this._depthFunc=null,this._cullFace=null,this._cull=null,this._zOffset=0,this._zOffsetUnits=0,this._frontFace=null,this._isDepthTestDirty=!0,this._isDepthMaskDirty=!0,this._isDepthFuncDirty=!1,this._isCullFaceDirty=!1,this._isCullDirty=!1,this._isZOffsetDirty=!0,this._isFrontFaceDirty=!1}apply(e){this.isDirty&&(this._isCullDirty&&(this.cull?e.enable(e.CULL_FACE):e.disable(e.CULL_FACE),this._isCullDirty=!1),this._isCullFaceDirty&&(e.cullFace(this.cullFace),this._isCullFaceDirty=!1),this._isDepthMaskDirty&&(e.depthMask(this.depthMask),this._isDepthMaskDirty=!1),this._isDepthTestDirty&&(this.depthTest?e.enable(e.DEPTH_TEST):e.disable(e.DEPTH_TEST),this._isDepthTestDirty=!1),this._isDepthFuncDirty&&(e.depthFunc(this.depthFunc),this._isDepthFuncDirty=!1),this._isZOffsetDirty&&(this.zOffset||this.zOffsetUnits?(e.enable(e.POLYGON_OFFSET_FILL),e.polygonOffset(this.zOffset,this.zOffsetUnits)):e.disable(e.POLYGON_OFFSET_FILL),this._isZOffsetDirty=!1),this._isFrontFaceDirty&&(e.frontFace(this.frontFace),this._isFrontFaceDirty=!1))}}},8657:(e,t,i)=>{i.d(t,{s:()=>n});class n{constructor(){this.reset()}reset(){this.enabled=!1,this.mask=255,this.func=n.ALWAYS,this.funcRef=1,this.funcMask=255,this.opStencilFail=n.KEEP,this.opDepthFail=n.KEEP,this.opStencilDepthPass=n.REPLACE}get stencilFunc(){return this.func}set stencilFunc(e){this.func=e}get stencilFuncRef(){return this.funcRef}set stencilFuncRef(e){this.funcRef=e}get stencilFuncMask(){return this.funcMask}set stencilFuncMask(e){this.funcMask=e}get stencilOpStencilFail(){return this.opStencilFail}set stencilOpStencilFail(e){this.opStencilFail=e}get stencilOpDepthFail(){return this.opDepthFail}set stencilOpDepthFail(e){this.opDepthFail=e}get stencilOpStencilDepthPass(){return this.opStencilDepthPass}set stencilOpStencilDepthPass(e){this.opStencilDepthPass=e}get stencilMask(){return this.mask}set stencilMask(e){this.mask=e}get stencilTest(){return this.enabled}set stencilTest(e){this.enabled=e}}n.ALWAYS=519,n.KEEP=7680,n.REPLACE=7681},9468:(e,t,i)=>{i.d(t,{C:()=>n});class n{get isDirty(){return this._isStencilTestDirty||this._isStencilMaskDirty||this._isStencilFuncDirty||this._isStencilOpDirty}get func(){return this._func}set func(e){this._func!==e&&(this._func=e,this._isStencilFuncDirty=!0)}get funcRef(){return this._funcRef}set funcRef(e){this._funcRef!==e&&(this._funcRef=e,this._isStencilFuncDirty=!0)}get funcMask(){return this._funcMask}set funcMask(e){this._funcMask!==e&&(this._funcMask=e,this._isStencilFuncDirty=!0)}get opStencilFail(){return this._opStencilFail}set opStencilFail(e){this._opStencilFail!==e&&(this._opStencilFail=e,this._isStencilOpDirty=!0)}get opDepthFail(){return this._opDepthFail}set opDepthFail(e){this._opDepthFail!==e&&(this._opDepthFail=e,this._isStencilOpDirty=!0)}get opStencilDepthPass(){return this._opStencilDepthPass}set opStencilDepthPass(e){this._opStencilDepthPass!==e&&(this._opStencilDepthPass=e,this._isStencilOpDirty=!0)}get mask(){return this._mask}set mask(e){this._mask!==e&&(this._mask=e,this._isStencilMaskDirty=!0)}get enabled(){return this._enabled}set enabled(e){this._enabled!==e&&(this._enabled=e,this._isStencilTestDirty=!0)}constructor(e=!0){this._isStencilTestDirty=!1,this._isStencilMaskDirty=!1,this._isStencilFuncDirty=!1,this._isStencilOpDirty=!1,this.useStencilGlobalOnly=!1,e&&this.reset()}reset(){var e;this.stencilMaterial=void 0,null===(e=this.stencilGlobal)||void 0===e||e.reset(),this._isStencilTestDirty=!0,this._isStencilMaskDirty=!0,this._isStencilFuncDirty=!0,this._isStencilOpDirty=!0}apply(e){var t;if(!e)return;const i=!this.useStencilGlobalOnly&&!!(null===(t=this.stencilMaterial)||void 0===t?void 0:t.enabled);this.enabled=i?this.stencilMaterial.enabled:this.stencilGlobal.enabled,this.func=i?this.stencilMaterial.func:this.stencilGlobal.func,this.funcRef=i?this.stencilMaterial.funcRef:this.stencilGlobal.funcRef,this.funcMask=i?this.stencilMaterial.funcMask:this.stencilGlobal.funcMask,this.opStencilFail=i?this.stencilMaterial.opStencilFail:this.stencilGlobal.opStencilFail,this.opDepthFail=i?this.stencilMaterial.opDepthFail:this.stencilGlobal.opDepthFail,this.opStencilDepthPass=i?this.stencilMaterial.opStencilDepthPass:this.stencilGlobal.opStencilDepthPass,this.mask=i?this.stencilMaterial.mask:this.stencilGlobal.mask,this.isDirty&&(this._isStencilTestDirty&&(this.enabled?e.enable(e.STENCIL_TEST):e.disable(e.STENCIL_TEST),this._isStencilTestDirty=!1),this._isStencilMaskDirty&&(e.stencilMask(this.mask),this._isStencilMaskDirty=!1),this._isStencilFuncDirty&&(e.stencilFunc(this.func,this.funcRef,this.funcMask),this._isStencilFuncDirty=!1),this._isStencilOpDirty&&(e.stencilOp(this.opStencilFail,this.opDepthFail,this.opStencilDepthPass),this._isStencilOpDirty=!1))}}},2844:(e,t,i)=>{i.d(t,{F:()=>n});class n{constructor(e){this._xrSessionManager=e,this._attached=!1,this._removeOnDetach=[],this.isDisposed=!1,this.disableAutoAttach=!1,this.xrNativeFeatureName=""}get attached(){return this._attached}attach(e){if(this.isDisposed)return!1;if(e)this.attached&&this.detach();else if(this.attached)return!1;return this._attached=!0,this._addNewAttachObserver(this._xrSessionManager.onXRFrameObservable,(e=>this._onXRFrame(e))),!0}detach(){return this._attached?(this._attached=!1,this._removeOnDetach.forEach((e=>{e.observable.remove(e.observer)})),!0):(this.disableAutoAttach=!0,!1)}dispose(){this.detach(),this.isDisposed=!0}isCompatible(){return!0}_addNewAttachObserver(e,t){this._removeOnDetach.push({observable:e,observer:e.add(t)})}}},9596:(e,t,i)=>{i.d(t,{OF:()=>n,e0:()=>x,en:()=>b,fL:()=>s});var n,s,r=i(2844),o=i(4370),a=i(4141),l=i(4389),h=i(5757),c=i(9953),u=i(4649),d=i(4834),p=i(7104),f=i(6272),_=i(4674),m=i(5203),g=i(1431);!function(e){e.WRIST="wrist",e.THUMB="thumb",e.INDEX="index",e.MIDDLE="middle",e.RING="ring",e.LITTLE="little"}(n||(n={})),function(e){e.WRIST="wrist",e.THUMB_METACARPAL="thumb-metacarpal",e.THUMB_PHALANX_PROXIMAL="thumb-phalanx-proximal",e.THUMB_PHALANX_DISTAL="thumb-phalanx-distal",e.THUMB_TIP="thumb-tip",e.INDEX_FINGER_METACARPAL="index-finger-metacarpal",e.INDEX_FINGER_PHALANX_PROXIMAL="index-finger-phalanx-proximal",e.INDEX_FINGER_PHALANX_INTERMEDIATE="index-finger-phalanx-intermediate",e.INDEX_FINGER_PHALANX_DISTAL="index-finger-phalanx-distal",e.INDEX_FINGER_TIP="index-finger-tip",e.MIDDLE_FINGER_METACARPAL="middle-finger-metacarpal",e.MIDDLE_FINGER_PHALANX_PROXIMAL="middle-finger-phalanx-proximal",e.MIDDLE_FINGER_PHALANX_INTERMEDIATE="middle-finger-phalanx-intermediate",e.MIDDLE_FINGER_PHALANX_DISTAL="middle-finger-phalanx-distal",e.MIDDLE_FINGER_TIP="middle-finger-tip",e.RING_FINGER_METACARPAL="ring-finger-metacarpal",e.RING_FINGER_PHALANX_PROXIMAL="ring-finger-phalanx-proximal",e.RING_FINGER_PHALANX_INTERMEDIATE="ring-finger-phalanx-intermediate",e.RING_FINGER_PHALANX_DISTAL="ring-finger-phalanx-distal",e.RING_FINGER_TIP="ring-finger-tip",e.PINKY_FINGER_METACARPAL="pinky-finger-metacarpal",e.PINKY_FINGER_PHALANX_PROXIMAL="pinky-finger-phalanx-proximal",e.PINKY_FINGER_PHALANX_INTERMEDIATE="pinky-finger-phalanx-intermediate",e.PINKY_FINGER_PHALANX_DISTAL="pinky-finger-phalanx-distal",e.PINKY_FINGER_TIP="pinky-finger-tip"}(s||(s={}));const v=[s.WRIST,s.THUMB_METACARPAL,s.THUMB_PHALANX_PROXIMAL,s.THUMB_PHALANX_DISTAL,s.THUMB_TIP,s.INDEX_FINGER_METACARPAL,s.INDEX_FINGER_PHALANX_PROXIMAL,s.INDEX_FINGER_PHALANX_INTERMEDIATE,s.INDEX_FINGER_PHALANX_DISTAL,s.INDEX_FINGER_TIP,s.MIDDLE_FINGER_METACARPAL,s.MIDDLE_FINGER_PHALANX_PROXIMAL,s.MIDDLE_FINGER_PHALANX_INTERMEDIATE,s.MIDDLE_FINGER_PHALANX_DISTAL,s.MIDDLE_FINGER_TIP,s.RING_FINGER_METACARPAL,s.RING_FINGER_PHALANX_PROXIMAL,s.RING_FINGER_PHALANX_INTERMEDIATE,s.RING_FINGER_PHALANX_DISTAL,s.RING_FINGER_TIP,s.PINKY_FINGER_METACARPAL,s.PINKY_FINGER_PHALANX_PROXIMAL,s.PINKY_FINGER_PHALANX_INTERMEDIATE,s.PINKY_FINGER_PHALANX_DISTAL,s.PINKY_FINGER_TIP],y={[n.WRIST]:[s.WRIST],[n.THUMB]:[s.THUMB_METACARPAL,s.THUMB_PHALANX_PROXIMAL,s.THUMB_PHALANX_DISTAL,s.THUMB_TIP],[n.INDEX]:[s.INDEX_FINGER_METACARPAL,s.INDEX_FINGER_PHALANX_PROXIMAL,s.INDEX_FINGER_PHALANX_INTERMEDIATE,s.INDEX_FINGER_PHALANX_DISTAL,s.INDEX_FINGER_TIP],[n.MIDDLE]:[s.MIDDLE_FINGER_METACARPAL,s.MIDDLE_FINGER_PHALANX_PROXIMAL,s.MIDDLE_FINGER_PHALANX_INTERMEDIATE,s.MIDDLE_FINGER_PHALANX_DISTAL,s.MIDDLE_FINGER_TIP],[n.RING]:[s.RING_FINGER_METACARPAL,s.RING_FINGER_PHALANX_PROXIMAL,s.RING_FINGER_PHALANX_INTERMEDIATE,s.RING_FINGER_PHALANX_DISTAL,s.RING_FINGER_TIP],[n.LITTLE]:[s.PINKY_FINGER_METACARPAL,s.PINKY_FINGER_PHALANX_PROXIMAL,s.PINKY_FINGER_PHALANX_INTERMEDIATE,s.PINKY_FINGER_PHALANX_DISTAL,s.PINKY_FINGER_TIP]};class x{get handMesh(){return this._handMesh}getHandPartMeshes(e){return y[e].map((e=>this._jointMeshes[v.indexOf(e)]))}getJointMesh(e){return this._jointMeshes[v.indexOf(e)]}constructor(e,t,i,n,s=!1,r=!1,o=1){this.xrController=e,this._jointMeshes=t,this._handMesh=i,this.rigMapping=n,this._leftHandedMeshes=s,this._jointsInvisible=r,this._jointScaleFactor=o,this._jointTransforms=new Array(v.length),this._jointTransformMatrices=new Float32Array(16*v.length),this._tempJointMatrix=new a.y3,this._jointRadii=new Float32Array(v.length),this._scene=t[0].getScene();for(let e=0;e<this._jointTransforms.length;e++)(this._jointTransforms[e]=new _.Y(v[e],this._scene)).rotationQuaternion=new a._f,t[e].rotationQuaternion=new a._f;i&&this.setHandMesh(i,n),this.xrController.motionController&&(this.xrController.motionController.rootMesh?this.xrController.motionController.rootMesh.setEnabled(!1):this.xrController.motionController.onModelLoadedObservable.add((e=>{e.rootMesh&&e.rootMesh.setEnabled(!1)}))),this.xrController.onMotionControllerInitObservable.add((e=>{e.onModelLoadedObservable.add((e=>{e.rootMesh&&e.rootMesh.setEnabled(!1)})),e.rootMesh&&e.rootMesh.setEnabled(!1)}))}setHandMesh(e,t){if(this._handMesh=e,e.alwaysSelectAsActiveMesh=!0,e.getChildMeshes().forEach((e=>e.alwaysSelectAsActiveMesh=!0)),this._handMesh.skeleton){const e=this._handMesh.skeleton;v.forEach(((i,n)=>{const s=e.getBoneIndexByName(t?t[i]:i);-1!==s&&e.bones[s].linkTransformNode(this._jointTransforms[n])}))}}updateFromXRFrame(e,t){const i=this.xrController.inputSource.hand;if(!i)return;const n=i,s=v.map((e=>n[e]||i.get(e)));let r=!1;if(e.fillPoses&&e.fillJointRadii)r=e.fillPoses(s,t,this._jointTransformMatrices)&&e.fillJointRadii(s,this._jointRadii);else if(e.getJointPose){r=!0;for(let i=0;i<s.length;i++){const n=e.getJointPose(s[i],t);if(!n){r=!1;break}this._jointTransformMatrices.set(n.transform.matrix,16*i),this._jointRadii[i]=n.radius||.008}}r&&(v.forEach(((e,t)=>{const i=this._jointTransforms[t];a.y3.FromArrayToRef(this._jointTransformMatrices,16*t,this._tempJointMatrix),this._tempJointMatrix.decompose(void 0,i.rotationQuaternion,i.position);const n=this._jointRadii[t]*this._jointScaleFactor,s=this._jointMeshes[t];s.isVisible=!this._handMesh&&!this._jointsInvisible,s.position.copyFrom(i.position),s.rotationQuaternion.copyFrom(i.rotationQuaternion),s.scaling.setAll(n),this._scene.useRightHandedSystem||(s.position.z*=-1,s.rotationQuaternion.z*=-1,s.rotationQuaternion.w*=-1,this._leftHandedMeshes&&this._handMesh&&(i.position.z*=-1,i.rotationQuaternion.z*=-1,i.rotationQuaternion.w*=-1))})),this._handMesh&&(this._handMesh.isVisible=!0))}dispose(){this._handMesh&&(this._handMesh.isVisible=!1)}}class b extends r.F{static _GenerateTrackedJointMeshes(e){const t={};return["left","right"].map((i=>{var n,s,r,o,h;const c=[],u=(null===(n=e.jointMeshes)||void 0===n?void 0:n.sourceMesh)||(0,f.Au)("jointParent",b._ICOSPHERE_PARAMS);u.isVisible=!!(null===(s=e.jointMeshes)||void 0===s?void 0:s.keepOriginalVisible);for(let t=0;t<v.length;++t){let n=u.createInstance(`${i}-handJoint-${t}`);if(null===(r=e.jointMeshes)||void 0===r?void 0:r.onHandJointMeshGenerated){const s=e.jointMeshes.onHandJointMeshGenerated(n,t,i);s&&s!==n&&(n.dispose(),n=s)}if(n.isPickable=!1,null===(o=e.jointMeshes)||void 0===o?void 0:o.enablePhysics){const t=(null===(h=e.jointMeshes)||void 0===h?void 0:h.physicsProps)||{};n.scaling.setAll(.02);const i=void 0!==t.impostorType?t.impostorType:l.Q.SphereImpostor;n.physicsImpostor=new l.Q(n,i,{mass:0,...t})}n.rotationQuaternion=new a._f,n.isVisible=!1,c.push(n)}t[i]=c})),{left:t.left,right:t.right}}static _GenerateDefaultHandMeshesAsync(e,t){return new Promise((async i=>{var n,s,r,o,a;const l={};(null===(s=null===(n=b._RightHandGLB)||void 0===n?void 0:n.meshes[1])||void 0===s?void 0:s.isDisposed())&&(b._RightHandGLB=null),(null===(o=null===(r=b._LeftHandGLB)||void 0===r?void 0:r.meshes[1])||void 0===o?void 0:o.isDisposed())&&(b._LeftHandGLB=null);const h=!(!b._RightHandGLB||!b._LeftHandGLB),f=await Promise.all([b._RightHandGLB||c.n.ImportMeshAsync("",b.DEFAULT_HAND_MODEL_BASE_URL,b.DEFAULT_HAND_MODEL_RIGHT_FILENAME,e),b._LeftHandGLB||c.n.ImportMeshAsync("",b.DEFAULT_HAND_MODEL_BASE_URL,b.DEFAULT_HAND_MODEL_LEFT_FILENAME,e)]);b._RightHandGLB=f[0],b._LeftHandGLB=f[1];const _=new d.O("handShader",e,{emitComments:!1});await _.loadAsync(b.DEFAULT_HAND_MODEL_SHADER_URL),_.needDepthPrePass=!0,_.transparencyMode=p.F.MATERIAL_ALPHABLEND,_.alphaMode=2,_.build(!1);const g={base:u.Wo.FromInts(116,63,203),fresnel:u.Wo.FromInts(149,102,229),fingerColor:u.Wo.FromInts(177,130,255),tipFresnel:u.Wo.FromInts(220,200,255),...null===(a=null==t?void 0:t.handMeshes)||void 0===a?void 0:a.customColors},v={base:_.getBlockByName("baseColor"),fresnel:_.getBlockByName("fresnelColor"),fingerColor:_.getBlockByName("fingerColor"),tipFresnel:_.getBlockByName("tipFresnelColor")};v.base.value=g.base,v.fresnel.value=g.fresnel,v.fingerColor.value=g.fingerColor,v.tipFresnel.value=g.tipFresnel,["left","right"].forEach((t=>{const i="left"==t?b._LeftHandGLB:b._RightHandGLB;if(!i)throw new Error("Could not load hand model");const n=i.meshes[1];n._internalAbstractMeshDataInfo._computeBonesUsingShaders=!0,n.material=_.clone(`${t}HandShaderClone`,!0),n.isVisible=!1,l[t]=n,h||e.useRightHandedSystem||i.meshes[1].rotate(m.RD.Y,Math.PI)})),_.dispose(),i({left:l.left,right:l.right})}))}static _GenerateDefaultHandMeshRigMapping(e){const t="right"==e?"R":"L";return{[s.WRIST]:`wrist_${t}`,[s.THUMB_METACARPAL]:`thumb_metacarpal_${t}`,[s.THUMB_PHALANX_PROXIMAL]:`thumb_proxPhalanx_${t}`,[s.THUMB_PHALANX_DISTAL]:`thumb_distPhalanx_${t}`,[s.THUMB_TIP]:`thumb_tip_${t}`,[s.INDEX_FINGER_METACARPAL]:`index_metacarpal_${t}`,[s.INDEX_FINGER_PHALANX_PROXIMAL]:`index_proxPhalanx_${t}`,[s.INDEX_FINGER_PHALANX_INTERMEDIATE]:`index_intPhalanx_${t}`,[s.INDEX_FINGER_PHALANX_DISTAL]:`index_distPhalanx_${t}`,[s.INDEX_FINGER_TIP]:`index_tip_${t}`,[s.MIDDLE_FINGER_METACARPAL]:`middle_metacarpal_${t}`,[s.MIDDLE_FINGER_PHALANX_PROXIMAL]:`middle_proxPhalanx_${t}`,[s.MIDDLE_FINGER_PHALANX_INTERMEDIATE]:`middle_intPhalanx_${t}`,[s.MIDDLE_FINGER_PHALANX_DISTAL]:`middle_distPhalanx_${t}`,[s.MIDDLE_FINGER_TIP]:`middle_tip_${t}`,[s.RING_FINGER_METACARPAL]:`ring_metacarpal_${t}`,[s.RING_FINGER_PHALANX_PROXIMAL]:`ring_proxPhalanx_${t}`,[s.RING_FINGER_PHALANX_INTERMEDIATE]:`ring_intPhalanx_${t}`,[s.RING_FINGER_PHALANX_DISTAL]:`ring_distPhalanx_${t}`,[s.RING_FINGER_TIP]:`ring_tip_${t}`,[s.PINKY_FINGER_METACARPAL]:`little_metacarpal_${t}`,[s.PINKY_FINGER_PHALANX_PROXIMAL]:`little_proxPhalanx_${t}`,[s.PINKY_FINGER_PHALANX_INTERMEDIATE]:`little_intPhalanx_${t}`,[s.PINKY_FINGER_PHALANX_DISTAL]:`little_distPhalanx_${t}`,[s.PINKY_FINGER_TIP]:`little_tip_${t}`}}isCompatible(){return"undefined"!=typeof XRHand}getHandByControllerId(e){return this._attachedHands[e]}getHandByHandedness(e){return"none"==e?null:this._trackingHands[e]}constructor(e,t){super(e),this.options=t,this._attachedHands={},this._trackingHands={left:null,right:null},this._handResources={jointMeshes:null,handMeshes:null,rigMappings:null},this.onHandAddedObservable=new h.y$,this.onHandRemovedObservable=new h.y$,this._attachHand=e=>{var t,i,n;if(!e.inputSource.hand||"none"==e.inputSource.handedness||!this._handResources.jointMeshes)return;const s=e.inputSource.handedness,r=new x(e,this._handResources.jointMeshes[s],this._handResources.handMeshes&&this._handResources.handMeshes[s],this._handResources.rigMappings&&this._handResources.rigMappings[s],null===(t=this.options.handMeshes)||void 0===t?void 0:t.meshesUseLeftHandedCoordinates,null===(i=this.options.jointMeshes)||void 0===i?void 0:i.invisible,null===(n=this.options.jointMeshes)||void 0===n?void 0:n.scaleFactor);this._attachedHands[e.uniqueId]=r,this._trackingHands[s]=r,this.onHandAddedObservable.notifyObservers(r)},this._detachHand=e=>{this._detachHandById(e.uniqueId)},this.xrNativeFeatureName="hand-tracking";const i=t.jointMeshes;if(i&&(void 0!==i.disableDefaultHandMesh&&(t.handMeshes=t.handMeshes||{},t.handMeshes.disableDefaultMeshes=i.disableDefaultHandMesh),void 0!==i.handMeshes&&(t.handMeshes=t.handMeshes||{},t.handMeshes.customMeshes=i.handMeshes),void 0!==i.leftHandedSystemMeshes&&(t.handMeshes=t.handMeshes||{},t.handMeshes.meshesUseLeftHandedCoordinates=i.leftHandedSystemMeshes),void 0!==i.rigMapping)){t.handMeshes=t.handMeshes||{};const e={},n={};[[i.rigMapping.left,e],[i.rigMapping.right,n]].forEach((e=>{const t=e[0],i=e[1];t.forEach(((e,t)=>{i[v[t]]=e}))})),t.handMeshes.customRigMappings={left:e,right:n}}}attach(){var e,t,i,n;return!!super.attach()&&(this._handResources={jointMeshes:b._GenerateTrackedJointMeshes(this.options),handMeshes:(null===(e=this.options.handMeshes)||void 0===e?void 0:e.customMeshes)||null,rigMappings:(null===(t=this.options.handMeshes)||void 0===t?void 0:t.customRigMappings)||null},(null===(i=this.options.handMeshes)||void 0===i?void 0:i.customMeshes)||(null===(n=this.options.handMeshes)||void 0===n?void 0:n.disableDefaultMeshes)||b._GenerateDefaultHandMeshesAsync(g.l.LastCreatedScene,this.options).then((e=>{var t,i;this._handResources.handMeshes=e,this._handResources.rigMappings={left:b._GenerateDefaultHandMeshRigMapping("left"),right:b._GenerateDefaultHandMeshRigMapping("right")},null===(t=this._trackingHands.left)||void 0===t||t.setHandMesh(this._handResources.handMeshes.left,this._handResources.rigMappings.left),null===(i=this._trackingHands.right)||void 0===i||i.setHandMesh(this._handResources.handMeshes.right,this._handResources.rigMappings.right)})),this.options.xrInput.controllers.forEach(this._attachHand),this._addNewAttachObserver(this.options.xrInput.onControllerAddedObservable,this._attachHand),this._addNewAttachObserver(this.options.xrInput.onControllerRemovedObservable,this._detachHand),!0)}_onXRFrame(e){var t,i;null===(t=this._trackingHands.left)||void 0===t||t.updateFromXRFrame(e,this._xrSessionManager.referenceSpace),null===(i=this._trackingHands.right)||void 0===i||i.updateFromXRFrame(e,this._xrSessionManager.referenceSpace)}_detachHandById(e){var t;const i=this.getHandByControllerId(e);if(i){const n="left"==i.xrController.inputSource.handedness?"left":"right";(null===(t=this._trackingHands[n])||void 0===t?void 0:t.xrController.uniqueId)===e&&(this._trackingHands[n]=null),this.onHandRemovedObservable.notifyObservers(i),i.dispose(),delete this._attachedHands[e]}}detach(){return!!super.detach()&&(Object.keys(this._attachedHands).forEach((e=>this._detachHandById(e))),!0)}dispose(){var e;super.dispose(),this.onHandAddedObservable.clear(),this.onHandRemovedObservable.clear(),this._handResources.handMeshes&&!(null===(e=this.options.handMeshes)||void 0===e?void 0:e.customMeshes)&&(this._handResources.handMeshes.left.dispose(),this._handResources.handMeshes.right.dispose(),b._RightHandGLB=null,b._LeftHandGLB=null),this._handResources.jointMeshes&&(this._handResources.jointMeshes.left.forEach((e=>e.dispose())),this._handResources.jointMeshes.right.forEach((e=>e.dispose())))}}b.Name=o.b.HAND_TRACKING,b.Version=1,b.DEFAULT_HAND_MODEL_BASE_URL="https://assets.babylonjs.com/meshes/HandMeshes/",b.DEFAULT_HAND_MODEL_RIGHT_FILENAME="r_hand_rhs.glb",b.DEFAULT_HAND_MODEL_LEFT_FILENAME="l_hand_rhs.glb",b.DEFAULT_HAND_MODEL_SHADER_URL="https://assets.babylonjs.com/meshes/HandMeshes/handsShader.json",b._ICOSPHERE_PARAMS={radius:.5,flat:!1,subdivisions:2},b._RightHandGLB=null,b._LeftHandGLB=null,o.d.AddWebXRFeature(b.Name,((e,t)=>()=>new b(e,t)),b.Version,!1)},4370:(e,t,i)=>{i.d(t,{b:()=>s,d:()=>r});var n=i(7257);class s{}s.ANCHOR_SYSTEM="xr-anchor-system",s.BACKGROUND_REMOVER="xr-background-remover",s.HIT_TEST="xr-hit-test",s.MESH_DETECTION="xr-mesh-detection",s.PHYSICS_CONTROLLERS="xr-physics-controller",s.PLANE_DETECTION="xr-plane-detection",s.POINTER_SELECTION="xr-controller-pointer-selection",s.TELEPORTATION="xr-controller-teleportation",s.FEATURE_POINTS="xr-feature-points",s.HAND_TRACKING="xr-hand-tracking",s.IMAGE_TRACKING="xr-image-tracking",s.NEAR_INTERACTION="xr-near-interaction",s.DOM_OVERLAY="xr-dom-overlay",s.MOVEMENT="xr-controller-movement",s.LIGHT_ESTIMATION="xr-light-estimation",s.EYE_TRACKING="xr-eye-tracking",s.WALKING_LOCOMOTION="xr-walking-locomotion",s.LAYERS="xr-layers",s.DEPTH_SENSING="xr-depth-sensing";class r{constructor(e){this._xrSessionManager=e,this._features={},this._xrSessionManager.onXRSessionInit.add((()=>{this.getEnabledFeatures().forEach((e=>{const t=this._features[e];!t.enabled||t.featureImplementation.attached||t.featureImplementation.disableAutoAttach||this.attachFeature(e)}))})),this._xrSessionManager.onXRSessionEnded.add((()=>{this.getEnabledFeatures().forEach((e=>{const t=this._features[e];t.enabled&&t.featureImplementation.attached&&this.detachFeature(e)}))}))}static AddWebXRFeature(e,t,i=1,n=!1){this._AvailableFeatures[e]=this._AvailableFeatures[e]||{latest:i},i>this._AvailableFeatures[e].latest&&(this._AvailableFeatures[e].latest=i),n&&(this._AvailableFeatures[e].stable=i),this._AvailableFeatures[e][i]=t}static ConstructFeature(e,t=1,i,n){const s=this._AvailableFeatures[e][t];if(!s)throw new Error("feature not found");return s(i,n)}static GetAvailableFeatures(){return Object.keys(this._AvailableFeatures)}static GetAvailableVersions(e){return Object.keys(this._AvailableFeatures[e])}static GetLatestVersionOfFeature(e){return this._AvailableFeatures[e]&&this._AvailableFeatures[e].latest||-1}static GetStableVersionOfFeature(e){return this._AvailableFeatures[e]&&this._AvailableFeatures[e].stable||-1}attachFeature(e){const t=this._features[e];t&&t.enabled&&!t.featureImplementation.attached&&t.featureImplementation.attach()}detachFeature(e){const t=this._features[e];t&&t.featureImplementation.attached&&t.featureImplementation.detach()}disableFeature(e){const t="string"==typeof e?e:e.Name,i=this._features[t];return!(!i||!i.enabled||(i.enabled=!1,this.detachFeature(t),i.featureImplementation.dispose(),delete this._features[t],0))}dispose(){this.getEnabledFeatures().forEach((e=>{this.disableFeature(e)}))}enableFeature(e,t="latest",i={},s=!0,o=!0){const a="string"==typeof e?e:e.Name;let l=0;if("string"==typeof t){if(!t)throw new Error(`Error in provided version - ${a} (${t})`);if(l="stable"===t?r.GetStableVersionOfFeature(a):"latest"===t?r.GetLatestVersionOfFeature(a):+t,-1===l||isNaN(l))throw new Error(`feature not found - ${a} (${t})`)}else l=t;const h=r._ConflictingFeatures[a];if(void 0!==h&&-1!==this.getEnabledFeatures().indexOf(h))throw new Error(`Feature ${a} cannot be enabled while ${h} is enabled.`);const c=this._features[a],u=r.ConstructFeature(a,l,this._xrSessionManager,i);if(!u)throw new Error(`feature not found - ${a}`);c&&this.disableFeature(a);const d=u();if(d.dependsOn){const e=d.dependsOn.every((e=>!!this._features[e]));if(!e)throw new Error(`Dependant features missing. Make sure the following features are enabled - ${d.dependsOn.join(", ")}`)}if(d.isCompatible())return this._features[a]={featureImplementation:d,enabled:!0,version:l,required:o},s?this._xrSessionManager.session&&!this._features[a].featureImplementation.attached&&this.attachFeature(a):this._features[a].featureImplementation.disableAutoAttach=!0,this._features[a].featureImplementation;if(o)throw new Error("required feature not compatible");return n.w1.Warn(`Feature ${a} not compatible with the current environment/browser and was not enabled.`),d}getEnabledFeature(e){return this._features[e]&&this._features[e].featureImplementation}getEnabledFeatures(){return Object.keys(this._features)}async _extendXRSessionInitObject(e){const t=this.getEnabledFeatures();for(const i of t){const t=this._features[i],n=t.featureImplementation.xrNativeFeatureName;if(n&&(t.required?(e.requiredFeatures=e.requiredFeatures||[],-1===e.requiredFeatures.indexOf(n)&&e.requiredFeatures.push(n)):(e.optionalFeatures=e.optionalFeatures||[],-1===e.optionalFeatures.indexOf(n)&&e.optionalFeatures.push(n))),t.featureImplementation.getXRSessionInitExtension){const i=await t.featureImplementation.getXRSessionInitExtension();e={...e,...i}}}return e}}r._AvailableFeatures={},r._ConflictingFeatures={[s.TELEPORTATION]:s.MOVEMENT,[s.MOVEMENT]:s.TELEPORTATION}},5655:(e,t,i)=>{i.d(t,{p:()=>n});class n{constructor(){this.rootNodes=new Array,this.cameras=new Array,this.lights=new Array,this.meshes=new Array,this.skeletons=new Array,this.particleSystems=new Array,this.animations=[],this.animationGroups=new Array,this.multiMaterials=new Array,this.materials=new Array,this.morphTargetManagers=new Array,this.geometries=new Array,this.transformNodes=new Array,this.actionManagers=new Array,this.textures=new Array,this._environmentTexture=null,this.postProcesses=new Array}static AddParser(e,t){this._BabylonFileParsers[e]=t}static GetParser(e){return this._BabylonFileParsers[e]?this._BabylonFileParsers[e]:null}static AddIndividualParser(e,t){this._IndividualBabylonFileParsers[e]=t}static GetIndividualParser(e){return this._IndividualBabylonFileParsers[e]?this._IndividualBabylonFileParsers[e]:null}static Parse(e,t,i,n){for(const s in this._BabylonFileParsers)Object.prototype.hasOwnProperty.call(this._BabylonFileParsers,s)&&this._BabylonFileParsers[s](e,t,i,n)}get environmentTexture(){return this._environmentTexture}set environmentTexture(e){this._environmentTexture=e}getNodes(){let e=new Array;return e=e.concat(this.meshes),e=e.concat(this.lights),e=e.concat(this.cameras),e=e.concat(this.transformNodes),this.skeletons.forEach((t=>e=e.concat(t.bones))),e}}n._BabylonFileParsers={},n._IndividualBabylonFileParsers={}},1468:(e,t,i)=>{i.d(t,{TJ:()=>f,fD:()=>d,ve:()=>p});var n=i(5655),s=i(4496),r=i(4674),o=i(2722),a=i(1431),l=i(7338),h=i(9311),c=i(2704),u=i(7257);class d extends n.p{}class p{constructor(){this.rootNodes=[],this.skeletons=[],this.animationGroups=[]}dispose(){this.rootNodes.slice(0).forEach((e=>{e.dispose()})),this.rootNodes.length=0,this.skeletons.slice(0).forEach((e=>{e.dispose()})),this.skeletons.length=0,this.animationGroups.slice(0).forEach((e=>{e.dispose()})),this.animationGroups.length=0}}class f extends n.p{constructor(e){super(),this._wasAddedToScene=!1,(e=e||a.l.LastCreatedScene)&&(this.scene=e,this.sounds=[],this.effectLayers=[],this.layers=[],this.lensFlareSystems=[],this.proceduralTextures=[],this.reflectionProbes=[],e.onDisposeObservable.add((()=>{this._wasAddedToScene||this.dispose()})),this._onContextRestoredObserver=e.getEngine().onContextRestoredObservable.add((()=>{for(const e of this.geometries)e._rebuild();for(const e of this.meshes)e._rebuild();for(const e of this.particleSystems)e.rebuild();for(const e of this.textures)e._rebuild()})))}_topologicalSort(e){const t=new Map;for(const i of e)t.set(i.uniqueId,i);const i={dependsOn:new Map,dependedBy:new Map};for(const t of e){const e=t.uniqueId;i.dependsOn.set(e,new Set),i.dependedBy.set(e,new Set)}for(const n of e){const e=n.uniqueId,s=i.dependsOn.get(e);if(n instanceof l.S){const r=n.sourceMesh;t.has(r.uniqueId)&&(s.add(r.uniqueId),i.dependedBy.get(r.uniqueId).add(e))}const r=i.dependedBy.get(e);for(const s of n.getDescendants()){const n=s.uniqueId;t.has(n)&&(r.add(n),i.dependsOn.get(n).add(e))}}const n=[],s=[];for(const n of e){const e=n.uniqueId;0===i.dependsOn.get(e).size&&(s.push(n),t.delete(e))}const r=s;for(;r.length>0;){const e=r.shift();n.push(e);const s=i.dependedBy.get(e.uniqueId);for(const n of Array.from(s.values())){const s=i.dependsOn.get(n);s.delete(e.uniqueId),0===s.size&&t.get(n)&&(r.push(t.get(n)),t.delete(n))}}return t.size>0&&(console.error("SceneSerializer._topologicalSort: There were unvisited nodes:"),t.forEach((e=>console.error(e.name)))),n}_addNodeAndDescendantsToList(e,t,i,n){if(i&&(!n||n(i))&&!t.has(i.uniqueId)){e.push(i),t.add(i.uniqueId);for(const s of i.getDescendants(!0))this._addNodeAndDescendantsToList(e,t,s,n)}}_isNodeInContainer(e){return e instanceof s.Kj&&-1!==this.meshes.indexOf(e)||e instanceof r.Y&&-1!==this.transformNodes.indexOf(e)||e instanceof h._&&-1!==this.lights.indexOf(e)||e instanceof c.V&&-1!==this.cameras.indexOf(e)}_isValidHierarchy(){for(const e of this.meshes)if(e.parent&&!this._isNodeInContainer(e.parent))return o.Y.Warn(`Node ${e.name} has a parent that is not in the container.`),!1;for(const e of this.transformNodes)if(e.parent&&!this._isNodeInContainer(e.parent))return o.Y.Warn(`Node ${e.name} has a parent that is not in the container.`),!1;for(const e of this.lights)if(e.parent&&!this._isNodeInContainer(e.parent))return o.Y.Warn(`Node ${e.name} has a parent that is not in the container.`),!1;for(const e of this.cameras)if(e.parent&&!this._isNodeInContainer(e.parent))return o.Y.Warn(`Node ${e.name} has a parent that is not in the container.`),!1;return!0}instantiateModelsToScene(e,t=!1,i){this._isValidHierarchy()||u.w1.Warn("SceneSerializer.InstantiateModelsToScene: The Asset Container hierarchy is not valid.");const n={},r={},o=new p,a=[],l=[],h={doNotInstantiate:!0,...i},c=[],d=new Set;for(const e of this.transformNodes)null===e.parent&&this._addNodeAndDescendantsToList(c,d,e,h.predicate);for(const e of this.meshes)null===e.parent&&this._addNodeAndDescendantsToList(c,d,e,h.predicate);const f=this._topologicalSort(c),_=(i,a)=>{if(((t,i)=>{if(n[t.uniqueId]=i.uniqueId,r[i.uniqueId]=i,e&&(i.name=e(t.name)),i instanceof s.Kj){const e=i;if(e.morphTargetManager){const i=t.morphTargetManager;e.morphTargetManager=i.clone();for(let t=0;t<i.numTargets;t++){const s=i.getTarget(t),o=e.morphTargetManager.getTarget(t);n[s.uniqueId]=o.uniqueId,r[o.uniqueId]=o}}}})(i,a),i.parent){const e=n[i.parent.uniqueId],t=r[e];a.parent=t||i.parent}if(a.position&&i.position&&a.position.copyFrom(i.position),a.rotationQuaternion&&i.rotationQuaternion&&a.rotationQuaternion.copyFrom(i.rotationQuaternion),a.rotation&&i.rotation&&a.rotation.copyFrom(i.rotation),a.scaling&&i.scaling&&a.scaling.copyFrom(i.scaling),a.material){const s=a;if(s.material)if(t){const t=i.material;if(-1===l.indexOf(t)){let i=t.clone(e?e(t.name):"Clone of "+t.name);if(l.push(t),n[t.uniqueId]=i.uniqueId,r[i.uniqueId]=i,"MultiMaterial"===t.getClassName()){const s=t;for(const t of s.subMaterials)t&&(i=t.clone(e?e(t.name):"Clone of "+t.name),l.push(t),n[t.uniqueId]=i.uniqueId,r[i.uniqueId]=i);s.subMaterials=s.subMaterials.map((e=>e&&r[n[e.uniqueId]]))}}"InstancedMesh"!==s.getClassName()&&(s.material=r[n[t.uniqueId]])}else"MultiMaterial"===s.material.getClassName()?-1===this.scene.multiMaterials.indexOf(s.material)&&this.scene.addMultiMaterial(s.material):-1===this.scene.materials.indexOf(s.material)&&this.scene.addMaterial(s.material)}null===a.parent&&o.rootNodes.push(a)};return f.forEach((e=>{if("InstancedMesh"===e.getClassName()){const t=e,i=t.sourceMesh,s=n[i.uniqueId],o=("number"==typeof s?r[s]:i).createInstance(t.name);_(t,o)}else{let t=!0;"TransformNode"===e.getClassName()||"Node"===e.getClassName()||e.skeleton||0===e.getTotalVertices()?t=!1:h.doNotInstantiate&&(t="function"==typeof h.doNotInstantiate?!h.doNotInstantiate(e):!h.doNotInstantiate);const i=t?e.createInstance(`instance of ${e.name}`):e.clone(`Clone of ${e.name}`,null,!0);if(!i)throw new Error(`Could not clone or instantiate node on Asset Container ${e.name}`);_(e,i)}})),this.skeletons.forEach((t=>{if(h.predicate&&!h.predicate(t))return;const i=t.clone(e?e(t.name):"Clone of "+t.name);for(const e of this.meshes)if(e.skeleton===t&&!e.isAnInstance){const t=r[n[e.uniqueId]];if(!t||t.isAnInstance)continue;if(t.skeleton=i,-1!==a.indexOf(i))continue;a.push(i);for(const e of i.bones)e._linkedTransformNode&&(e._linkedTransformNode=r[n[e._linkedTransformNode.uniqueId]])}o.skeletons.push(i)})),this.animationGroups.forEach((t=>{if(h.predicate&&!h.predicate(t))return;const i=t.clone(e?e(t.name):"Clone of "+t.name,(e=>r[n[e.uniqueId]]||e));o.animationGroups.push(i)})),o}addAllToScene(){if(!this._wasAddedToScene){this._isValidHierarchy()||u.w1.Warn("SceneSerializer.addAllToScene: The Asset Container hierarchy is not valid."),this._wasAddedToScene=!0,this.addToScene(null),this.environmentTexture&&(this.scene.environmentTexture=this.environmentTexture);for(const e of this.scene._serializableComponents)e.addFromContainer(this);this.scene.getEngine().onContextRestoredObservable.remove(this._onContextRestoredObserver),this._onContextRestoredObserver=null}}addToScene(e=null){this.cameras.forEach((t=>{e&&!e(t)||this.scene.addCamera(t)})),this.lights.forEach((t=>{e&&!e(t)||this.scene.addLight(t)})),this.meshes.forEach((t=>{e&&!e(t)||this.scene.addMesh(t)})),this.skeletons.forEach((t=>{e&&!e(t)||this.scene.addSkeleton(t)})),this.animations.forEach((t=>{e&&!e(t)||this.scene.addAnimation(t)})),this.animationGroups.forEach((t=>{e&&!e(t)||this.scene.addAnimationGroup(t)})),this.multiMaterials.forEach((t=>{e&&!e(t)||this.scene.addMultiMaterial(t)})),this.materials.forEach((t=>{e&&!e(t)||this.scene.addMaterial(t)})),this.morphTargetManagers.forEach((t=>{e&&!e(t)||this.scene.addMorphTargetManager(t)})),this.geometries.forEach((t=>{e&&!e(t)||this.scene.addGeometry(t)})),this.transformNodes.forEach((t=>{e&&!e(t)||this.scene.addTransformNode(t)})),this.actionManagers.forEach((t=>{e&&!e(t)||this.scene.addActionManager(t)})),this.textures.forEach((t=>{e&&!e(t)||this.scene.addTexture(t)})),this.reflectionProbes.forEach((t=>{e&&!e(t)||this.scene.addReflectionProbe(t)}))}removeAllFromScene(){this._isValidHierarchy()||u.w1.Warn("SceneSerializer.removeAllFromScene: The Asset Container hierarchy is not valid."),this._wasAddedToScene=!1,this.removeFromScene(null),this.environmentTexture===this.scene.environmentTexture&&(this.scene.environmentTexture=null);for(const e of this.scene._serializableComponents)e.removeFromContainer(this)}removeFromScene(e=null){this.cameras.forEach((t=>{e&&!e(t)||this.scene.removeCamera(t)})),this.lights.forEach((t=>{e&&!e(t)||this.scene.removeLight(t)})),this.meshes.forEach((t=>{e&&!e(t)||this.scene.removeMesh(t)})),this.skeletons.forEach((t=>{e&&!e(t)||this.scene.removeSkeleton(t)})),this.animations.forEach((t=>{e&&!e(t)||this.scene.removeAnimation(t)})),this.animationGroups.forEach((t=>{e&&!e(t)||this.scene.removeAnimationGroup(t)})),this.multiMaterials.forEach((t=>{e&&!e(t)||this.scene.removeMultiMaterial(t)})),this.materials.forEach((t=>{e&&!e(t)||this.scene.removeMaterial(t)})),this.morphTargetManagers.forEach((t=>{e&&!e(t)||this.scene.removeMorphTargetManager(t)})),this.geometries.forEach((t=>{e&&!e(t)||this.scene.removeGeometry(t)})),this.transformNodes.forEach((t=>{e&&!e(t)||this.scene.removeTransformNode(t)})),this.actionManagers.forEach((t=>{e&&!e(t)||this.scene.removeActionManager(t)})),this.textures.forEach((t=>{e&&!e(t)||this.scene.removeTexture(t)})),this.reflectionProbes.forEach((t=>{e&&!e(t)||this.scene.removeReflectionProbe(t)}))}dispose(){this.cameras.slice(0).forEach((e=>{e.dispose()})),this.cameras.length=0,this.lights.slice(0).forEach((e=>{e.dispose()})),this.lights.length=0,this.meshes.slice(0).forEach((e=>{e.dispose()})),this.meshes.length=0,this.skeletons.slice(0).forEach((e=>{e.dispose()})),this.skeletons.length=0,this.animationGroups.slice(0).forEach((e=>{e.dispose()})),this.animationGroups.length=0,this.multiMaterials.slice(0).forEach((e=>{e.dispose()})),this.multiMaterials.length=0,this.materials.slice(0).forEach((e=>{e.dispose()})),this.materials.length=0,this.geometries.slice(0).forEach((e=>{e.dispose()})),this.geometries.length=0,this.transformNodes.slice(0).forEach((e=>{e.dispose()})),this.transformNodes.length=0,this.actionManagers.slice(0).forEach((e=>{e.dispose()})),this.actionManagers.length=0,this.textures.slice(0).forEach((e=>{e.dispose()})),this.textures.length=0,this.reflectionProbes.slice(0).forEach((e=>{e.dispose()})),this.reflectionProbes.length=0,this.morphTargetManagers.slice(0).forEach((e=>{e.dispose()})),this.morphTargetManagers.length=0,this.environmentTexture&&(this.environmentTexture.dispose(),this.environmentTexture=null);for(const e of this.scene._serializableComponents)e.removeFromContainer(this,!0);this._onContextRestoredObserver&&(this.scene.getEngine().onContextRestoredObservable.remove(this._onContextRestoredObserver),this._onContextRestoredObserver=null)}_moveAssets(e,t,i){if(e&&t)for(const n of e){let e=!0;if(i)for(const t of i)if(n===t){e=!1;break}e&&(t.push(n),n._parentContainer=this)}}moveAllFromScene(e){this._wasAddedToScene=!1,void 0===e&&(e=new d);for(const t in this)Object.prototype.hasOwnProperty.call(this,t)&&(this[t]=this[t]||("_environmentTexture"===t?null:[]),this._moveAssets(this.scene[t],this[t],e[t]));this.environmentTexture=this.scene.environmentTexture,this.removeAllFromScene()}createRootMesh(){const e=new s.Kj("assetContainerRootMesh",this.scene);return this.meshes.forEach((t=>{t.parent||e.addChild(t)})),this.meshes.unshift(e),e}mergeAnimationsTo(e=a.l.LastCreatedScene,t,i=null){if(!e)return o.Y.Error("No scene available to merge animations to"),[];const n=i||(t=>{let i=null;const n=t.animations.length?t.animations[0].targetProperty:"",s=t.name.split(".").join("").split("_primitive")[0];switch(n){case"position":case"rotationQuaternion":i=e.getTransformNodeByName(t.name)||e.getTransformNodeByName(s);break;case"influence":i=e.getMorphTargetByName(t.name)||e.getMorphTargetByName(s);break;default:i=e.getNodeByName(t.name)||e.getNodeByName(s)}return i});this.getNodes().forEach((e=>{const t=n(e);if(null!==t){for(const i of e.animations){const e=t.animations.filter((e=>e.targetProperty===i.targetProperty));for(const i of e){const e=t.animations.indexOf(i,0);e>-1&&t.animations.splice(e,1)}}t.animations=t.animations.concat(e.animations)}}));const s=new Array;return this.animationGroups.slice().forEach((e=>{s.push(e.clone(e.name,n)),e.animatables.forEach((e=>{e.stop()}))})),t.forEach((t=>{const i=n(t.target);i&&(e.beginAnimation(i,t.fromFrame,t.toFrame,t.loopAnimation,t.speedRatio,t.onAnimationEnd?t.onAnimationEnd:void 0,void 0,!0,void 0,t.onAnimationLoop?t.onAnimationLoop:void 0),e.stopAnimation(t.target))})),s}}},8099:(e,t,i)=>{i.r(t),i.d(t,{AbstractActionManager:()=>s.O,AbstractAssetTask:()=>Fg,AbstractMesh:()=>Un.x,AbstractScene:()=>n.p,AcquireNativeObjectAsync:()=>Ks,Action:()=>h,ActionEvent:()=>c.V,ActionManager:()=>R,AddBlock:()=>Xu,AddressMode:()=>ur,AdvancedTimer:()=>zl,AlphaState:()=>Og.Q,AmmoJSPlugin:()=>Vh,AnaglyphArcRotateCamera:()=>ai,AnaglyphFreeCamera:()=>li,AnaglyphGamepadCamera:()=>hi,AnaglyphPostProcess:()=>ri,AnaglyphUniversalCamera:()=>ci,Analyser:()=>pe,AndOrNotEvaluator:()=>Ng.q,Angle:()=>Gr.RZ,Animatable:()=>W,AnimatedInputBlockTypes:()=>Wu.c,Animation:()=>D.f,AnimationEvent:()=>re.O,AnimationGroup:()=>oe.O,AnimationKeyInterpolation:()=>ae.N,AnimationPropertiesOverride:()=>H,AnimationRange:()=>le.X,AnisotropyBlock:()=>Ud,ApplyPostProcess:()=>ro.$0,Arc2:()=>Gr.Q,ArcFollowCamera:()=>Gt,ArcRotateCamera:()=>Ft,ArcRotateCameraGamepadInput:()=>nt,ArcRotateCameraInputsManager:()=>ut,ArcRotateCameraKeyboardMoveInput:()=>rt,ArcRotateCameraMouseWheelInput:()=>ht,ArcRotateCameraPointersInput:()=>ct,ArcRotateCameraVRDeviceOrientationInput:()=>dt,ArcTan2Block:()=>xd,AssetContainer:()=>ce.TJ,AssetTaskState:()=>Dg,AssetsManager:()=>jg,AssetsProgressEvent:()=>Lg,AsyncLoop:()=>de.$g,AttachToBoxBehavior:()=>Ne,AudioEngine:()=>_e,AudioSceneComponent:()=>ye,AutoLayoutMode:()=>Tr,AutoReleaseWorkerPool:()=>cl.v,AutoRotationBehavior:()=>Ie,AxesViewer:()=>Hn,Axis:()=>Gr.RD,AxisDragGizmo:()=>Wn,AxisScaleGizmo:()=>ca,BRDFTextureTools:()=>Bd.D,BabylonFileLoaderConfiguration:()=>zh,BackEase:()=>q,BackgroundMaterial:()=>Wa,BakedVertexAnimationManager:()=>Se,BallAndSocketConstraint:()=>U_,BaseCameraMouseWheelInput:()=>Qe.Y,BaseCameraPointersInput:()=>Ze,BaseError:()=>Hs.GU,BaseParticleSystem:()=>Wf.U,BaseSixDofDragBehavior:()=>ke.N,BaseTexture:()=>Oa.V,BasisTools:()=>zc,BasisToolsOptions:()=>Nc,BasisTranscodeConfiguration:()=>Oc,BezierCurve:()=>Gr.hr,BezierCurveEase:()=>se,BiPlanarBlock:()=>sp,BinaryFileAssetTask:()=>kg,BlackAndWhitePostProcess:()=>om,BlendFactor:()=>Pr,BlendOperation:()=>Rr,BloomEffect:()=>cm,BloomMergePostProcess:()=>hm,BlurPostProcess:()=>wa,Bone:()=>z.N,BoneAxesViewer:()=>Xn,BoneIKController:()=>He,BoneLookController:()=>je,BonesBlock:()=>_u,BounceEase:()=>K,BouncingBehavior:()=>De,BoundingBox:()=>On.k,BoundingBoxGizmo:()=>da,BoundingBoxRenderer:()=>$m,BoundingInfo:()=>wn.j,BoundingSphere:()=>Nn.K,BoxBuilder:()=>Yn.kg,BoxParticleEmitter:()=>Hf.S3,Buffer:()=>qe.l,BufferBindingType:()=>mr,BufferMapState:()=>nr,BufferUsage:()=>sr,CSG:()=>Lp,Camera:()=>Mt.V,CameraGizmo:()=>Da,CameraInputTypes:()=>Je.u,CameraInputsManager:()=>Je.p,CannonJSPlugin:()=>Bh,CanvasAlphaMode:()=>Ur,CapsuleBuilder:()=>es,CascadedShadowGenerator:()=>Th,ChromaticAberrationPostProcess:()=>um,CircleEase:()=>Y,CircleOfConfusionPostProcess:()=>dm,ClampBlock:()=>Yu,ClearCoatBlock:()=>kd,ClipPlanesBlock:()=>zu,ClipboardEventTypes:()=>ea.p,ClipboardInfo:()=>ea.o,CloudBlock:()=>ep,CloudPoint:()=>d_,Collider:()=>yn,Color3:()=>Gr.Wo,Color3Gradient:()=>$f,Color4:()=>Gr.HE,ColorCorrectionPostProcess:()=>pm,ColorCurves:()=>Jh.U,ColorGradient:()=>Kf,ColorGradingTexture:()=>uc,ColorMergerBlock:()=>td,ColorSplitterBlock:()=>sd.v,ColorWriteFlags:()=>Ar,CombineAction:()=>S,CompareFunction:()=>fr,CompatibilityOptions:()=>rn.e,CompilationMessageType:()=>xr,ComputeBindingType:()=>Pn,ComputeEffect:()=>An,ComputePassTimestampLocation:()=>wr,ComputeShader:()=>Dn,ComputeShaderParticleSystem:()=>qf,Condition:()=>u,ConditionalBlock:()=>Jd,ConditionalBlockConditions:()=>jd,ConeParticleEmitter:()=>Hf.LV,Constants:()=>Cs.g,ContainerAssetTask:()=>Bg,ConversionMode:()=>vg,ConvolutionPostProcess:()=>fm,Coordinate:()=>Gr.c7,CopyTextureToTexture:()=>yg,CopyTools:()=>Uv.r1,CreateBox:()=>Yn.NR,CreateBoxVertexData:()=>Yn.aR,CreateCapsule:()=>Jn,CreateCapsuleVertexData:()=>Zn,CreateCylinder:()=>an,CreateCylinderVertexData:()=>on,CreateDashedLines:()=>as,CreateDashedLinesVertexData:()=>ss,CreateDecal:()=>vf,CreateDisc:()=>Ca,CreateDiscVertexData:()=>Ea,CreateEnvTextureAsync:()=>Gs.p6,CreateGeodesic:()=>Ef,CreateGoldberg:()=>Af,CreateGoldbergVertexData:()=>Cf,CreateGround:()=>dn.$6,CreateGroundFromHeightMap:()=>dn.W,CreateGroundFromHeightMapVertexData:()=>dn.Qq,CreateGroundVertexData:()=>dn.kt,CreateHemisphere:()=>Pa,CreateIcoSphere:()=>cf.Au,CreateIcoSphereVertexData:()=>cf.GQ,CreateImageDataArrayBufferViews:()=>Gs.Do,CreateLathe:()=>of,CreateLineSystem:()=>rs,CreateLineSystemVertexData:()=>ns,CreateLines:()=>os,CreatePlane:()=>pa.pT,CreatePlaneVertexData:()=>pa.Hq,CreatePolygon:()=>nf,CreatePolygonVertexData:()=>tf,CreatePolyhedron:()=>ya,CreatePolyhedronVertexData:()=>va,CreateResizedCopy:()=>ro.cW,CreateRibbon:()=>fs,CreateRibbonVertexData:()=>ps,CreateScreenshot:()=>yv,CreateScreenshotAsync:()=>xv,CreateScreenshotUsingRenderTarget:()=>Tv,CreateScreenshotUsingRenderTargetAsync:()=>Sv,CreateScreenshotWithResizeAsync:()=>bv,CreateSphere:()=>Kn,CreateSphereVertexData:()=>qn,CreateTiledBox:()=>jp,CreateTiledBoxVertexData:()=>Xp,CreateTiledGround:()=>dn.DG,CreateTiledGroundVertexData:()=>dn.Es,CreateTiledPlane:()=>Wp,CreateTiledPlaneVertexData:()=>zp,CreateTorus:()=>cn,CreateTorusKnot:()=>Kp,CreateTorusKnotVertexData:()=>qp,CreateTorusVertexData:()=>hn,CreateTube:()=>lf,CrossBlock:()=>qu,CubeMapToSphericalPolynomialTools:()=>Ka.$,CubeTexture:()=>Fa.B,CubeTextureAssetTask:()=>Wg,CubicEase:()=>$,CullMode:()=>Cr,CurrentScreenBlock:()=>ku.K,Curve3:()=>Gr.j_,CustomBlock:()=>Ku,CustomOptimization:()=>rv,CustomParticleEmitter:()=>Hf.E0,CustomProceduralTexture:()=>$c,CylinderBuilder:()=>ln,CylinderDirectedParticleEmitter:()=>Hf.z,CylinderParticleEmitter:()=>Hf.kT,DDSTools:()=>nl,DataBuffer:()=>Ke.h,DataReader:()=>Iv.d,DataStorage:()=>Dv,Database:()=>zf,DaydreamController:()=>ia,DebugLayer:()=>jn,DebugLayerTab:()=>kn,DecalBuilder:()=>yf,DecalMapConfiguration:()=>gp,DecalMapDefines:()=>mp,Decode:()=>Ae.fJ,DecodeBase64ToBinary:()=>Ae.HQ,DecodeBase64ToString:()=>Ae.rP,DecodeBase64UrlToBinary:()=>dc.$K,DecodeBase64UrlToString:()=>dc.A2,DeepCopier:()=>P.j,DefaultCollisionCoordinator:()=>xn,DefaultKTX2DecoderOptions:()=>pl,DefaultLoadingScreen:()=>Ch,DefaultRenderingPipeline:()=>Nm,Deferred:()=>Yg.B,DepthCullingState:()=>bo.k,DepthOfFieldBlurPostProcess:()=>_m,DepthOfFieldEffect:()=>vm,DepthOfFieldEffectBlurLevel:()=>gm,DepthOfFieldMergePostProcess:()=>mm,DepthPeelingRenderer:()=>Jm,DepthPeelingSceneComponent:()=>eg,DepthReducer:()=>mh,DepthRenderer:()=>ph,DepthRendererSceneComponent:()=>Qm,DepthSortedParticle:()=>h_,DerivativeBlock:()=>Au,DesaturateBlock:()=>Fd,DetailMapConfiguration:()=>_p.p,DeviceInputEventType:()=>at.g,DeviceLostReason:()=>Vr,DeviceOrientationCamera:()=>Lt,DeviceSource:()=>Ss.p,DeviceSourceManager:()=>Es.U,DeviceType:()=>Ts.Yi,DirectionalLight:()=>Sa.O,DirectionalLightFrustumViewer:()=>bs,DiscBuilder:()=>Aa,DiscardBlock:()=>Eu,DisplayPassPostProcess:()=>ym,DistanceBlock:()=>_d,DistanceConstraint:()=>V_,DistanceJoint:()=>Nh.mN,DivideBlock:()=>ad,DoNothingAction:()=>T,DomManagement:()=>fe.MZ,DotBlock:()=>$u,DracoCompression:()=>Mp.J,DrawWrapper:()=>Ps.q,DualSenseInput:()=>Ts.s2,DualShockButton:()=>Xt,DualShockDpad:()=>jt,DualShockInput:()=>Ts.V7,DualShockPad:()=>Qt,DumpTools:()=>gv.B,DynamicFloat32Array:()=>Gv,DynamicTexture:()=>zi.c,EasingFunction:()=>j,EdgesRenderer:()=>ig,Effect:()=>ds.Q,EffectFallbacks:()=>ka.L,EffectLayer:()=>Jl,EffectLayerSceneComponent:()=>eh,EffectRenderer:()=>Ih.I,EffectWrapper:()=>Ih.H,ElasticEase:()=>Q,ElbowBlock:()=>ip,EncodeArrayBufferToBase64:()=>Ae.Gh,EndsWith:()=>Ae.gi,Engine:()=>ue.D,EngineFactory:()=>Jo,EngineFormat:()=>hl,EngineInstrumentation:()=>$l,EngineStore:()=>A.l,EngineView:()=>Fs,EnvironmentHelper:()=>Ha,EnvironmentTextureTools:()=>Gs.qh,Epsilon:()=>Gr.kn,EquiRectangularCubeTexture:()=>pc,EquiRectangularCubeTextureAssetTask:()=>Xg,ErrorCodes:()=>Hs.SM,ErrorFilter:()=>kr,EventConstants:()=>at.G,EventState:()=>r.he,ExecuteCodeAction:()=>E,ExponentialEase:()=>Z,ExternalTexture:()=>So,ExtractHighlightsPostProcess:()=>lm,ExtrudePolygon:()=>sf,ExtrudeShape:()=>ms,ExtrudeShapeCustom:()=>gs,FactorGradient:()=>Qf,FadeInOutBehavior:()=>Fe.Y,FeatureName:()=>ir,FileTools:()=>dc.e0,FileToolsOptions:()=>dc.rN,FilesInput:()=>$g,FilesInputStore:()=>Kg.X,FilterMode:()=>dr,FilterPostProcess:()=>xm,FluidRenderer:()=>Sg,FluidRendererSceneComponent:()=>Tg,FluidRenderingDebug:()=>ug,FluidRenderingObject:()=>pg,FluidRenderingObjectCustomParticles:()=>gg,FluidRenderingObjectParticleSystem:()=>fg,FluidRenderingTargetRenderer:()=>mg,FlyCamera:()=>Ut,FlyCameraInputsManager:()=>Bt,FlyCameraKeyboardInput:()=>pt,FlyCameraMouseInput:()=>ft,FogBlock:()=>Nu,FollowBehavior:()=>Ge.j,FollowCamera:()=>kt,FollowCameraInputsManager:()=>Vt,FollowCameraKeyboardMoveInput:()=>_t,FollowCameraMouseWheelInput:()=>mt,FollowCameraPointersInput:()=>gt,FragCoordBlock:()=>Pu,FragDepthBlock:()=>Ou,FragmentOutputBlock:()=>yu.g,FramingBehavior:()=>Oe,FreeCamera:()=>Dt.c,FreeCameraDeviceOrientationInput:()=>yt,FreeCameraGamepadInput:()=>xt,FreeCameraInputsManager:()=>vt.a,FreeCameraKeyboardMoveInput:()=>Tt.Y,FreeCameraMouseInput:()=>St.A,FreeCameraMouseWheelInput:()=>Et.A,FreeCameraTouchInput:()=>Ct.y,FreeCameraVirtualJoystickInput:()=>Rt,FresnelBlock:()=>dd,FresnelParameters:()=>ec,FromHalfFloat:()=>ro.qZ,FrontFace:()=>Er,FrontFacingBlock:()=>Cu,Frustum:()=>Gr.iW,FxaaPostProcess:()=>bm,GPUParticleSystem:()=>s_,GUID:()=>hp.x,Gamepad:()=>tt,GamepadCamera:()=>ti,GamepadManager:()=>Zt,GamepadSystemSceneComponent:()=>Jt,GearVRController:()=>na,GenerateBase64StringFromPixelData:()=>Uv.xj,GenerateBase64StringFromTexture:()=>Uv._u,GenerateBase64StringFromTextureAsync:()=>Uv.Jj,GenericController:()=>sa,GenericPad:()=>it,GeodesicData:()=>Sf,Geometry:()=>Ah.Z,GeometryBufferRenderer:()=>Cm,GeometryBufferRendererSceneComponent:()=>Pm,GetClass:()=>l.q,GetDOMTextContent:()=>fe.v,GetEnvInfo:()=>Gs.qJ,GetEnvironmentBRDFTexture:()=>Bd.$,GetInternalFormatFromBasisFormat:()=>Fc,GetTGAHeader:()=>Pc,Gizmo:()=>Gn.t,GizmoManager:()=>Ta,GlowLayer:()=>th,GoldbergMesh:()=>Vp,GradientBlock:()=>Pd,GradientBlockColorStep:()=>Ad,GradientHelper:()=>Zf,GrainPostProcess:()=>Tm,GroundBuilder:()=>dn.vU,GroundMesh:()=>Up.E,HDRCubeTexture:()=>Oh,HDRCubeTextureAssetTask:()=>Hg,HDRFiltering:()=>Dh,HDRTools:()=>Mh,HandConstraintBehavior:()=>ze.q_,HandConstraintOrientation:()=>ze.rX,HandConstraintVisibility:()=>ze.bH,HandConstraintZone:()=>ze.$6,HandPart:()=>oy.OF,HardwareScalingOptimization:()=>tv,HavokPlugin:()=>K_,HeightToNormalBlock:()=>Du,HemisphereBuilder:()=>Ra,HemisphericLight:()=>Li.e,HemisphericParticleEmitter:()=>Hf.VD,HighlightLayer:()=>nh,HighlightsPostProcess:()=>Sm,Hinge2Joint:()=>Nh.OT,HingeConstraint:()=>k_,HingeJoint:()=>Nh.yr,HtmlElementTexture:()=>fc,IWebXRControllerPhysicsOptions:()=>iy,IcoSphereBuilder:()=>cf.GM,ImageAssetTask:()=>Gg,ImageProcessingBlock:()=>bu,ImageProcessingConfiguration:()=>ki.$,ImageProcessingConfigurationDefines:()=>ki.b,ImageProcessingPostProcess:()=>Wi,ImageSourceBlock:()=>Lu,IncrementValueAction:()=>y,IndexFormat:()=>Ir,InputBlock:()=>fu.S,InputStepMode:()=>Or,InspectableType:()=>Av,InstancedLinesMesh:()=>is.E,InstancedMesh:()=>Gp.S,InstancesBlock:()=>mu,InstantiatedEntries:()=>ce.ve,InternalTexture:()=>Ei.l,InternalTextureSource:()=>Ei.S,InterpolateValueAction:()=>O,IntersectionInfo:()=>Tn.c,IsBase64DataUrl:()=>dc.VL,IsDocumentAvailable:()=>fe.n5,IsFileURL:()=>dc.Uh,IsNavigatorAvailable:()=>fe.up,IsWindowObjectExist:()=>fe.CG,JoystickAxis:()=>bt,KeepAssets:()=>ce.fD,KeyboardEventTypes:()=>st.OG,KeyboardInfo:()=>st.NG,KeyboardInfoPre:()=>st.WZ,KhronosTextureContainer:()=>ol,KhronosTextureContainer2:()=>fl,LatheBuilder:()=>af,Layer:()=>sh.m,LayerSceneComponent:()=>rh.N,LengthBlock:()=>md,LensFlare:()=>oh,LensFlareSystem:()=>ah,LensFlareSystemSceneComponent:()=>lh,LensFlaresOptimization:()=>sv,LensRenderingPipeline:()=>Fm,LerpBlock:()=>od,Light:()=>hh._,LightBlock:()=>Fu,LightGizmo:()=>Ia,LightInformationBlock:()=>vu,LineEdgesRenderer:()=>ng,LinesBuilder:()=>ls,LinesMesh:()=>is._,LoadFile:()=>dc.vP,LoadFileError:()=>dc.eh,LoadImage:()=>dc.r6,LoadOp:()=>Fr,LoadTextureFromTranscodeResult:()=>Gc,LockConstraint:()=>z_,Logger:()=>_.Y,MapMode:()=>rr,Material:()=>cs.F,MaterialAnisotropicDefines:()=>ic.i,MaterialClearCoatDefines:()=>rc.d,MaterialDefines:()=>Ba.H,MaterialDetailMapDefines:()=>_p.G,MaterialFlags:()=>Va.k,MaterialHelper:()=>La.G,MaterialIridescenceDefines:()=>oc.f,MaterialPluginBase:()=>dp.n,MaterialPluginEvent:()=>fp.S,MaterialPluginManager:()=>pp.BK,MaterialSheenDefines:()=>hc.A,MaterialSubSurfaceDefines:()=>cc.H,Matrix:()=>Gr.y3,MatrixBuilderBlock:()=>Zd,MatrixDeterminantBlock:()=>rp,MatrixTransposeBlock:()=>op,MaxBlock:()=>pd,MergeMeshesOptimization:()=>lv,Mesh:()=>Nt.Kj,MeshAssetTask:()=>Ug,MeshAttributeExistsBlock:()=>ap,MeshAttributeExistsBlockTypes:()=>Yd,MeshBuilder:()=>Pf,MeshExploder:()=>qg,MeshLODLevel:()=>Bf.g,MeshParticleEmitter:()=>Hf.F3,MeshUVSpaceRenderer:()=>Bp,MeshoptCompression:()=>Ip.K,MinBlock:()=>fd,MinMaxReducer:()=>_h,MipmapFilterMode:()=>pr,MirrorTexture:()=>Na,ModBlock:()=>Qd,ModelShape:()=>l_,MorphTarget:()=>Vf.Y,MorphTargetManager:()=>wh.O,MorphTargetsBlock:()=>gu,MotionBlurPostProcess:()=>Rm,MotorEnabledJoint:()=>Nh.$Q,MultiMaterial:()=>Ph.G,MultiObserver:()=>Qg,MultiPointerScaleBehavior:()=>Be,MultiRenderTarget:()=>Xc,MultiplyBlock:()=>Hu.U,NLerpBlock:()=>Rd,NativeDataStream:()=>ks,NativeEngine:()=>Js,NativePointerInput:()=>Ts.FP,NativeXRFrame:()=>By,NativeXRLayerRenderTargetTextureProvider:()=>en,NativeXRLayerWrapper:()=>Ji,NativeXRRenderTarget:()=>tn,NegateBlock:()=>gd,Node:()=>Ot.N,NodeMaterial:()=>Fl.O,NodeMaterialBlock:()=>du.k,NodeMaterialBlockConnectionPointMode:()=>au.M,NodeMaterialBlockConnectionPointTypes:()=>ou.E,NodeMaterialBlockTargets:()=>ru.u,NodeMaterialConnectionPoint:()=>cu.VT,NodeMaterialConnectionPointCompatibilityStates:()=>cu.WS,NodeMaterialConnectionPointCustomObject:()=>uu,NodeMaterialConnectionPointDirection:()=>cu.Ab,NodeMaterialDefines:()=>Fl.n,NodeMaterialModes:()=>hu.a,NodeMaterialOptimizer:()=>lp,NodeMaterialSystemValues:()=>lu.$,NoiseProceduralTexture:()=>Qc,NormalBlendBlock:()=>Dd,NormalizeBlock:()=>Ju,NullEngine:()=>Is,NullEngineOptions:()=>Ms,Observable:()=>r.y$,Observer:()=>r.Qj,OcclusionMaterial:()=>tc,Octree:()=>Bn,OctreeBlock:()=>Ln,OctreeSceneComponent:()=>Vn,OculusTouchController:()=>ra,OimoJSPlugin:()=>Uh,OnAfterEnteringVRObservableEvent:()=>mn,OneMinusBlock:()=>cd,Orientation:()=>Gr.i5,OutlineRenderer:()=>cg,PBRAnisotropicConfiguration:()=>ic.u,PBRBaseMaterial:()=>nc.m,PBRBaseSimpleMaterial:()=>sc,PBRClearCoatConfiguration:()=>rc.Y,PBRIridescenceConfiguration:()=>oc.B,PBRMaterial:()=>Ya.Y,PBRMaterialDefines:()=>nc.r,PBRMetallicRoughnessBlock:()=>Xd,PBRMetallicRoughnessMaterial:()=>ac,PBRSheenConfiguration:()=>hc.B,PBRSpecularGlossinessMaterial:()=>lc,PBRSubSurfaceConfiguration:()=>cc.u,PHI:()=>Gr.Q_,PadNumber:()=>Ae.zA,PanoramaToCubeMapTools:()=>Rh,Particle:()=>Jf,ParticleBlendMultiplyBlock:()=>$d.D,ParticleHelper:()=>o_,ParticleRampGradientBlock:()=>Kd.p,ParticleSystem:()=>i_,ParticleSystemSet:()=>r_,ParticleTextureBlock:()=>qd.P,ParticlesOptimization:()=>ov,PassCubePostProcess:()=>ii.Z,PassPostProcess:()=>ii.Q,Path2:()=>Gr.ZZ,Path3D:()=>Gr.$B,PathCursor:()=>he,PerfCollectionStrategy:()=>qv,PerfCounter:()=>Os.z,PerformanceConfigurator:()=>As.Z,PerformanceMonitor:()=>Zg.A,PerformanceViewerCollector:()=>jv,PerturbNormalBlock:()=>Su,PhotoDome:()=>ja,Physics6DoFConstraint:()=>B_,Physics6DoFLimit:()=>L_,PhysicsAggregate:()=>H_,PhysicsBody:()=>A_,PhysicsConstraint:()=>F_,PhysicsConstraintAxis:()=>m_,PhysicsConstraintAxisLimitMode:()=>__,PhysicsConstraintMotorType:()=>y_,PhysicsConstraintType:()=>g_,PhysicsEngine:()=>Lh.T,PhysicsEngineV2:()=>C_,PhysicsHelper:()=>Z_,PhysicsImpostor:()=>Qn.Q,PhysicsJoint:()=>Nh.q7,PhysicsMaterialCombineMode:()=>b_,PhysicsMotionType:()=>x_,PhysicsRadialExplosionEventOptions:()=>nm,PhysicsRadialImpulseFalloff:()=>T_,PhysicsRaycastResult:()=>Fh.d,PhysicsShape:()=>P_,PhysicsShapeBox:()=>D_,PhysicsShapeCapsule:()=>M_,PhysicsShapeContainer:()=>N_,PhysicsShapeConvexHull:()=>O_,PhysicsShapeCylinder:()=>I_,PhysicsShapeMesh:()=>w_,PhysicsShapeSphere:()=>R_,PhysicsShapeType:()=>v_,PhysicsUpdraftEventOptions:()=>sm,PhysicsUpdraftMode:()=>S_,PhysicsViewer:()=>ts,PhysicsVortexEventOptions:()=>rm,PickingInfo:()=>bn.p,PipelineErrorReason:()=>br,PivotTools:()=>ua.m,Plane:()=>Gr.JO,PlaneBuilder:()=>pa.mx,PlaneDragGizmo:()=>ma,PlaneRotationGizmo:()=>fa,PlayAnimationAction:()=>x,PlaySoundAction:()=>M,PointColor:()=>f_,PointLight:()=>Eh.c,PointParticleEmitter:()=>Hf.cl,PointerDragBehavior:()=>Le.M,PointerEventTypes:()=>Re.kD,PointerInfo:()=>Re.R5,PointerInfoBase:()=>Re.CU,PointerInfoPre:()=>Re.FV,PointerInput:()=>Ts.Fz,PointsCloudSystem:()=>E_,PointsGroup:()=>p_,Polar:()=>Pp,Polygon:()=>Jp,PolygonBuilder:()=>rf,PolygonMeshBuilder:()=>ef,PolyhedronBuilder:()=>xa,PolyhedronData:()=>Tf,PoseEnabledController:()=>Kt,PoseEnabledControllerHelper:()=>qt,PoseEnabledControllerType:()=>zt,PositionGizmo:()=>ga,PositionNormalTextureVertex:()=>Gr.eN,PositionNormalVertex:()=>Gr.$S,PostProcess:()=>ni.D,PostProcessManager:()=>fh.O,PostProcessRenderEffect:()=>am,PostProcessRenderPipeline:()=>Dm,PostProcessRenderPipelineManager:()=>Om,PostProcessRenderPipelineManagerSceneComponent:()=>wm,PostProcessesOptimization:()=>nv,PosterizeBlock:()=>Ed,PowBlock:()=>vd,PowerEase:()=>J,PowerPreference:()=>tr,PrePassRenderer:()=>rg,PrePassRendererSceneComponent:()=>og,PrecisionDate:()=>G.F,PredicateCondition:()=>p,PressureObserverWrapper:()=>kv,PrimitiveTopology:()=>Sr,PrismaticConstraint:()=>W_,ProceduralTexture:()=>qc.g,ProceduralTextureSceneComponent:()=>Zc.O,PropertyTypeForEdition:()=>xu.U,PushMaterial:()=>Ua.a,QuadraticEase:()=>ee,QuadraticErrorSimplification:()=>Ff,QuarticEase:()=>te,Quaternion:()=>Gr._f,QueryType:()=>Br,QuinticEase:()=>ie,RGBDTextureTools:()=>Rv.r,RandomGUID:()=>hp.f,RandomNumberBlock:()=>yd,RawCubeTexture:()=>Jc.N,RawTexture:()=>Ee.l,RawTexture2DArray:()=>eu.e,RawTexture3D:()=>tu,Ray:()=>Yt.z,RayHelper:()=>hs,ReadFile:()=>dc.Ip,ReadFileError:()=>dc.RC,RecastJSCrowd:()=>Gf,RecastJSPlugin:()=>kf,ReciprocalBlock:()=>Td,ReflectBlock:()=>wd,ReflectionBlock:()=>Vd,ReflectionProbe:()=>kh,ReflectionTextureBlock:()=>Vu,Reflector:()=>Vv,RefractBlock:()=>Nd,RefractionBlock:()=>zd,RefractionPostProcess:()=>Mm,RefractionTexture:()=>iu,RegisterClass:()=>l.H,RegisterMaterialPlugin:()=>pp.rs,RegisterNativeTypeAsync:()=>$s,RemapBlock:()=>Zu.w,RenderPassTimestampLocation:()=>Nr,RenderTargetTexture:()=>Ai._,RenderTargetWrapper:()=>Rs.r,RenderTargetsOptimization:()=>av,RenderingGroup:()=>dg.S,RenderingGroupInfo:()=>uh.t,RenderingManager:()=>uh.$,ReplaceColorBlock:()=>Sd,RequestFile:()=>dc.FV,RequestFileError:()=>dc.kK,RetryStrategy:()=>Mv.b,RibbonBuilder:()=>_s,RollingAverage:()=>Zg.Z,Rotate2dBlock:()=>Od,RotationGizmo:()=>_a,RuntimeAnimation:()=>V,RuntimeError:()=>Hs.LH,SSAO2RenderingPipeline:()=>Bm,SSAORenderingPipeline:()=>Um,SSRRenderingPipeline:()=>Xm,SamplerBindingType:()=>gr,Scalar:()=>lt.R,ScaleBlock:()=>ju,ScaleGizmo:()=>ba,Scene:()=>k.x,SceneComponentConstants:()=>ve.l,SceneDepthBlock:()=>Gu,SceneInstrumentation:()=>Ql,SceneLoader:()=>ta.n,SceneLoaderAnimationGroupLoadingMode:()=>ta.O,SceneLoaderFlags:()=>Zh.Z,SceneOptimization:()=>Jg,SceneOptimizer:()=>cv,SceneOptimizerOptions:()=>hv,ScenePerformancePriority:()=>k.a,SceneRecorder:()=>Ov,SceneSerializer:()=>fv,ScreenSizeBlock:()=>Ru,ScreenSpaceBlock:()=>Mu,ScreenSpaceCurvaturePostProcess:()=>Km,ScreenSpaceReflectionPostProcess:()=>km,ScreenshotTools:()=>Cv,SerializationHelper:()=>Te.p4,SetCorsBehavior:()=>dc.$M,SetParentAction:()=>C,SetStateAction:()=>g,SetValueAction:()=>v,ShaderCodeInliner:()=>zs.Z,ShaderLanguage:()=>Cn.x,ShaderMaterial:()=>us.j,ShaderStage:()=>_r,ShaderStore:()=>si.v,ShadowDepthWrapper:()=>up,ShadowGenerator:()=>dh,ShadowGeneratorSceneComponent:()=>Sh,ShadowLight:()=>ch.O,ShadowMapBlock:()=>wu,ShadowsOptimization:()=>iv,ShapeBuilder:()=>ys,SharpenPostProcess:()=>Im,SheenBlock:()=>Ld,SimplexPerlin3DBlock:()=>Id,SimplicationQueueSceneComponent:()=>Lf,SimplificationQueue:()=>Mf,SimplificationSettings:()=>Rf,SimplificationType:()=>If,SineEase:()=>ne,SixDofDragBehavior:()=>Ue.K,Size:()=>Gr.$u,Skeleton:()=>Ye.O,SkeletonViewer:()=>xs,SliderConstraint:()=>G_,SmartArray:()=>Fn.t,SmartArrayNoDuplicate:()=>Fn.f,SmoothStepBlock:()=>bd,SolidParticle:()=>a_,SolidParticleSystem:()=>u_,SolidParticleVertex:()=>c_,Sound:()=>me.$,SoundTrack:()=>ge,SourceTextureFormat:()=>al,Space:()=>Gr.T,SphereBuilder:()=>$n,SphereDirectedParticleEmitter:()=>Hf.cE,SphereParticleEmitter:()=>Hf.Ai,Spherical:()=>Rp,SphericalHarmonics:()=>qa._,SphericalPolynomial:()=>qa.i,SpotLight:()=>Ma.P,Sprite:()=>Cg,SpriteManager:()=>Rg,SpriteMap:()=>Mg,SpritePackedManager:()=>Ig,SpriteSceneComponent:()=>Ag,Stage:()=>ve.H,StandardMaterial:()=>Gi.K,StandardMaterialDefines:()=>Gi.R,StandardRenderingPipeline:()=>Gm,StartsWith:()=>Ae.Ri,StateCondition:()=>f,StencilOperation:()=>Mr,StencilState:()=>wg.s,StencilStateComposer:()=>yo.C,StepBlock:()=>hd,StereoscopicArcRotateCamera:()=>_i,StereoscopicFreeCamera:()=>mi,StereoscopicGamepadCamera:()=>gi,StereoscopicInterlacePostProcess:()=>pi,StereoscopicInterlacePostProcessI:()=>di,StereoscopicScreenUniversalCamera:()=>xi,StereoscopicUniversalCamera:()=>vi,StickValues:()=>et,StopAnimationAction:()=>b,StopSoundAction:()=>I,StorageBuffer:()=>$e,StorageTextureAccess:()=>yr,StoreOp:()=>Lr,StringDictionary:()=>At.x,StringTools:()=>Ae.Ml,SubEmitter:()=>t_,SubEmitterType:()=>e_,SubMesh:()=>Ll.P,SubSurfaceBlock:()=>Wd,SubSurfaceSceneComponent:()=>hg,SubtractBlock:()=>ld,SurfaceMagnetismBehavior:()=>Ve.p,SwitchBooleanAction:()=>m,SwitchInput:()=>Ts.D_,TBNBlock:()=>Tu,TGATools:()=>Mc,Tags:()=>_v.$,TargetCamera:()=>It.C,TargetedAnimation:()=>oe.U,TestBase64DataUrl:()=>dc.qC,TextFileAssetTask:()=>Vg,Texture:()=>Ce.x,TextureAspect:()=>hr,TextureAssetTask:()=>zg,TextureBlock:()=>Bu,TextureDimension:()=>or,TextureFormat:()=>cr,TextureOptimization:()=>ev,TexturePacker:()=>Yc,TexturePackerFrame:()=>jc,TextureSampleType:()=>vr,TextureSampler:()=>In.a,TextureTools:()=>ro.Oi,TextureUsage:()=>ar,TextureViewDimension:()=>lr,ThinEngine:()=>Rn.B,ThinRenderTargetTexture:()=>su,ThinTexture:()=>nu.g,TiledBoxBuilder:()=>Yp,TiledPlaneBuilder:()=>Hp,TimerState:()=>Nl,TmpColors:()=>Gr.zZ,TmpVectors:()=>Gr.jp,ToGammaSpace:()=>Gr.zp,ToHalfFloat:()=>ro.ay,ToLinearSpace:()=>Gr.Nn,TonemapPostProcess:()=>Ym,TonemappingOperator:()=>jm,Tools:()=>de.w1,TorusBuilder:()=>un,TorusKnotBuilder:()=>$p,TouchCamera:()=>wt,TrailMesh:()=>kp,Trajectory:()=>wv,TrajectoryClassifier:()=>Bv,TranscodeAsync:()=>Vc,TranscodeTarget:()=>ll,TransformBlock:()=>Qu.m,TransformNode:()=>yi.Y,TriPlanarBlock:()=>np,TrigonometryBlock:()=>ed.S,TrigonometryBlockOperations:()=>ed.p,TubeBuilder:()=>hf,TwirlBlock:()=>Iu,UniformBuffer:()=>Ci.M,UniversalCamera:()=>ei,UnregisterAllMaterialPlugins:()=>pp.Dh,UnregisterMaterialPlugin:()=>pp.jD,UploadContent:()=>Rc,UploadEnvLevelsAsync:()=>Gs.Ro,UploadEnvSpherical:()=>Gs.qC,UploadLevelsAsync:()=>Gs.qZ,UtilityLayerRenderer:()=>zn.x,VRCameraMetrics:()=>Ti,VRDeviceOrientationArcRotateCamera:()=>wi,VRDeviceOrientationFreeCamera:()=>Ni,VRDeviceOrientationGamepadCamera:()=>Fi,VRDistortionCorrectionPostProcess:()=>Si,VRExperienceHelper:()=>gn,VRMultiviewToSingleviewPostProcess:()=>Di,ValidatedNativeDataStream:()=>er,ValueCondition:()=>d,Vector2:()=>Gr.FM,Vector3:()=>Gr.P,Vector4:()=>Gr.Lt,VectorMergerBlock:()=>nd.t,VectorSplitterBlock:()=>rd,VertexAnimationBaker:()=>Pe,VertexBuffer:()=>qe.o,VertexData:()=>sn.x,VertexFormat:()=>Dr,VertexOutputBlock:()=>pu.t,VideoDome:()=>Kl,VideoRecorder:()=>mv,VideoTexture:()=>ql,ViewDirectionBlock:()=>ud,Viewport:()=>Gr.l_,VirtualJoystick:()=>Pt,VirtualJoysticksCamera:()=>bi,ViveController:()=>oa,VolumetricLightScatteringPostProcess:()=>qm,VoronoiNoiseBlock:()=>tp,WaveBlock:()=>Cd,WaveBlockKind:()=>id,WebGL2ParticleSystem:()=>Yf,WebGL2ShaderProcessor:()=>Ws.C,WebGLDataBuffer:()=>Uf.M,WebGLHardwareTexture:()=>Yi.B,WebGLPipelineContext:()=>Zo.y,WebGPUCacheBindGroups:()=>Po,WebGPUCacheRenderPipeline:()=>mo,WebGPUCacheRenderPipelineTree:()=>vo,WebGPUCacheSampler:()=>uo,WebGPUDataBuffer:()=>so,WebGPUDrawContext:()=>Co,WebGPUEngine:()=>jo,WebGPUTintWASM:()=>Go,WebRequest:()=>Kc.g,WebVRController:()=>Vi,WebVRFreeCamera:()=>Ui,WebXRAbstractFeature:()=>Il.F,WebXRAbstractMotionController:()=>bl,WebXRAnchorSystem:()=>Zv,WebXRBackgroundRemover:()=>ty,WebXRCamera:()=>gl,WebXRCompositionLayerWrapper:()=>by,WebXRControllerComponent:()=>xl,WebXRControllerMovement:()=>dy,WebXRControllerPhysics:()=>ny,WebXRControllerPointerSelection:()=>Dl,WebXRDefaultExperience:()=>Xl,WebXRDefaultExperienceOptions:()=>Hl,WebXRDepthSensing:()=>Ry,WebXRDomOverlay:()=>uy,WebXREnterExitUI:()=>kl,WebXREnterExitUIButton:()=>Ul,WebXREnterExitUIOptions:()=>Vl,WebXRExperienceHelper:()=>yl,WebXREyeTracking:()=>_y,WebXRFeatureName:()=>vl.b,WebXRFeaturePointSystem:()=>ry,WebXRFeaturesManager:()=>vl.d,WebXRGenericHandController:()=>My,WebXRGenericTriggerMotionController:()=>Tl,WebXRHTCViveMotionController:()=>Fy,WebXRHand:()=>oy.e0,WebXRHandJoint:()=>oy.fL,WebXRHandTracking:()=>oy.en,WebXRHitTest:()=>sy,WebXRHitTestLegacy:()=>$v,WebXRImageTracking:()=>cy,WebXRInput:()=>Ml,WebXRInputSource:()=>Rl,WebXRLayers:()=>Py,WebXRLightEstimation:()=>fy,WebXRManagedOutputCanvas:()=>Zi,WebXRManagedOutputCanvasOptions:()=>Qi,WebXRMeshDetector:()=>ly,WebXRMicrosoftMixedRealityController:()=>Dy,WebXRMotionControllerManager:()=>Al,WebXRMotionControllerTeleportation:()=>Wl,WebXRNearControllerMode:()=>wl,WebXRNearInteraction:()=>Bl,WebXROculusTouchMotionController:()=>wy,WebXRPlaneDetector:()=>ey,WebXRProfiledMotionController:()=>El,WebXRProjectionLayerWrapper:()=>Sy,WebXRSessionManager:()=>nn,WebXRState:()=>Xi,WebXRTrackingState:()=>ji,WebXRWalkingLocomotion:()=>xy,WeightedSound:()=>xe.s,WindowsMotionController:()=>la,WorkerPool:()=>cl.h,WorleyNoise3DBlock:()=>Md,XRWindowsMotionController:()=>ha,Xbox360Button:()=>Wt,Xbox360Dpad:()=>Ht,Xbox360Pad:()=>$t,XboxInput:()=>Ts.$i,_BabylonLoaderRegistered:()=>Gh,_BasisTextureLoader:()=>Hc,_CreationDataStorage:()=>Nt.gW,_DDSTextureLoader:()=>sl,_ENVTextureLoader:()=>rl,_HDRTextureLoader:()=>Dc,_IAnimationState:()=>D.u,_InstancesBatch:()=>Nt.Wv,_KTXTextureLoader:()=>ml,_MeshCollisionData:()=>Sn.a,_OcclusionDataStorage:()=>ws,_PrimaryIsoTriangle:()=>bf,_TGATextureLoader:()=>Ic,_TimeToken:()=>Ds,_UpdateRGBDAsync:()=>Gs.Lf,_forceSceneHelpersToBundle:()=>jl,_forceTransformFeedbackToBundle:()=>Ns,_injectLTSFileTools:()=>dc.W5,addClipPlaneUniforms:()=>Ga.qx,allocateAndCopyTypedBuffer:()=>Us.A,bindClipPlane:()=>Ga.an,className:()=>de.ok,createDetailMapPlugin:()=>Cp,createPBRAnisotropicPlugin:()=>yp,createPBRBRDFPlugin:()=>xp,createPBRClearCoatPlugin:()=>bp,createPBRIridescencePlugin:()=>Tp,createPBRSheenPlugin:()=>Sp,createPBRSubSurfacePlugin:()=>Ep,createYieldingScheduler:()=>Kv.KO,editableInPropertyPage:()=>xu.p,expandToProperty:()=>Te.wz,extractMinAndMax:()=>Ap.k,extractMinAndMaxIndexed:()=>Ap.y,inlineScheduler:()=>Kv.WP,makeAsyncFunction:()=>Kv.U3,makeSyncFunction:()=>Kv.vp,nativeOverride:()=>Te.G6,normalizeEnvInfo:()=>Gs.QH,prepareDefinesForClipPlanes:()=>Ga.AN,prepareStringDefinesForClipPlanes:()=>Ga.lK,runCoroutine:()=>Kv.d_,runCoroutineAsync:()=>Kv.sM,runCoroutineSync:()=>Kv.s3,serialize:()=>Te.qC,serializeAsCameraReference:()=>Te.VE,serializeAsColor3:()=>Te.n9,serializeAsColor4:()=>Te.XX,serializeAsColorCurves:()=>Te.N$,serializeAsFresnelParameters:()=>Te.qQ,serializeAsImageProcessingConfiguration:()=>Te.rX,serializeAsMatrix:()=>Te.oQ,serializeAsMeshReference:()=>Te.RR,serializeAsQuaternion:()=>Te.mv,serializeAsTexture:()=>Te.oU,serializeAsVector2:()=>Te.QC,serializeAsVector3:()=>Te.hd,setAndStartTimer:()=>Gl,setStereoscopicAnaglyphRigMode:()=>oi,setStereoscopicRigMode:()=>fi,setVRRigMode:()=>Oi,setWebVRRigMode:()=>Bi});var n=i(5655),s=i(1803),r=i(5757),o=i(4141),a=i(4649),l=i(2208);class h{constructor(e,t){this.triggerOptions=e,this.onBeforeExecuteObservable=new r.y$,e.parameter?(this.trigger=e.trigger,this._triggerParameter=e.parameter):e.trigger?this.trigger=e.trigger:this.trigger=e,this._nextActiveAction=this,this._condition=t}_prepare(){}getTriggerParameter(){return this._triggerParameter}setTriggerParameter(e){this._triggerParameter=e}_evaluateConditionForCurrentFrame(){const e=this._condition;if(!e)return!0;const t=this._actionManager.getScene().getRenderId();return e._evaluationId!==t&&(e._evaluationId=t,e._currentResult=e.isValid()),e._currentResult}_executeCurrent(e){this._evaluateConditionForCurrentFrame()&&(this.onBeforeExecuteObservable.notifyObservers(this),this._nextActiveAction.execute(e),this.skipToNextActiveAction())}execute(e){}skipToNextActiveAction(){this._nextActiveAction._child?(this._nextActiveAction._child._actionManager||(this._nextActiveAction._child._actionManager=this._actionManager),this._nextActiveAction=this._nextActiveAction._child):this._nextActiveAction=this}then(e){return this._child=e,e._actionManager=this._actionManager,e._prepare(),e}_getProperty(e){return this._actionManager._getProperty(e)}_getEffectiveTarget(e,t){return this._actionManager._getEffectiveTarget(e,t)}serialize(e){}_serialize(e,t){const i={type:1,children:[],name:e.name,properties:e.properties||[]};if(this._child&&this._child.serialize(i),this._condition){const e=this._condition.serialize();return e.children.push(i),t&&t.children.push(e),e}return t&&t.children.push(i),i}}h._SerializeValueAsString=e=>"number"==typeof e?e.toString():"boolean"==typeof e?e?"true":"false":e instanceof o.FM?e.x+", "+e.y:e instanceof o.P?e.x+", "+e.y+", "+e.z:e instanceof a.Wo?e.r+", "+e.g+", "+e.b:e instanceof a.HE?e.r+", "+e.g+", "+e.b+", "+e.a:e,h._GetTargetProperty=e=>({name:"target",targetType:e._isMesh?"MeshProperties":e._isLight?"LightProperties":e._isCamera?"CameraProperties":e._isMaterial?"MaterialProperties":"SceneProperties",value:e._isScene?"Scene":e.name}),(0,l.H)("BABYLON.Action",h);var c=i(2633);class u{constructor(e){this._actionManager=e}isValid(){return!0}_getProperty(e){return this._actionManager._getProperty(e)}_getEffectiveTarget(e,t){return this._actionManager._getEffectiveTarget(e,t)}serialize(){}_serialize(e){return{type:2,children:[],name:e.name,properties:e.properties}}}class d extends u{static get IsEqual(){return d._IsEqual}static get IsDifferent(){return d._IsDifferent}static get IsGreater(){return d._IsGreater}static get IsLesser(){return d._IsLesser}constructor(e,t,i,n,s=d.IsEqual){super(e),this.propertyPath=i,this.value=n,this.operator=s,this._target=t,this._effectiveTarget=this._getEffectiveTarget(t,this.propertyPath),this._property=this._getProperty(this.propertyPath)}isValid(){switch(this.operator){case d.IsGreater:return this._effectiveTarget[this._property]>this.value;case d.IsLesser:return this._effectiveTarget[this._property]<this.value;case d.IsEqual:case d.IsDifferent:{let e;return e=this.value.equals?this.value.equals(this._effectiveTarget[this._property]):this.value===this._effectiveTarget[this._property],this.operator===d.IsEqual?e:!e}}return!1}serialize(){return this._serialize({name:"ValueCondition",properties:[h._GetTargetProperty(this._target),{name:"propertyPath",value:this.propertyPath},{name:"value",value:h._SerializeValueAsString(this.value)},{name:"operator",value:d.GetOperatorName(this.operator)}]})}static GetOperatorName(e){switch(e){case d._IsEqual:return"IsEqual";case d._IsDifferent:return"IsDifferent";case d._IsGreater:return"IsGreater";case d._IsLesser:return"IsLesser";default:return""}}}d._IsEqual=0,d._IsDifferent=1,d._IsGreater=2,d._IsLesser=3;class p extends u{constructor(e,t){super(e),this.predicate=t}isValid(){return this.predicate()}}class f extends u{constructor(e,t,i){super(e),this.value=i,this._target=t}isValid(){return this._target.state===this.value}serialize(){return this._serialize({name:"StateCondition",properties:[h._GetTargetProperty(this._target),{name:"value",value:this.value}]})}}(0,l.H)("BABYLON.ValueCondition",d),(0,l.H)("BABYLON.PredicateCondition",p),(0,l.H)("BABYLON.StateCondition",f);var _=i(2722);class m extends h{constructor(e,t,i,n){super(e,n),this.propertyPath=i,this._target=this._effectiveTarget=t}_prepare(){this._effectiveTarget=this._getEffectiveTarget(this._effectiveTarget,this.propertyPath),this._property=this._getProperty(this.propertyPath)}execute(){this._effectiveTarget[this._property]=!this._effectiveTarget[this._property]}serialize(e){return super._serialize({name:"SwitchBooleanAction",properties:[h._GetTargetProperty(this._target),{name:"propertyPath",value:this.propertyPath}]},e)}}class g extends h{constructor(e,t,i,n){super(e,n),this.value=i,this._target=t}execute(){this._target.state=this.value}serialize(e){return super._serialize({name:"SetStateAction",properties:[h._GetTargetProperty(this._target),{name:"value",value:this.value}]},e)}}class v extends h{constructor(e,t,i,n,s){super(e,s),this.propertyPath=i,this.value=n,this._target=this._effectiveTarget=t}_prepare(){this._effectiveTarget=this._getEffectiveTarget(this._effectiveTarget,this.propertyPath),this._property=this._getProperty(this.propertyPath)}execute(){this._effectiveTarget[this._property]=this.value,this._target.markAsDirty&&this._target.markAsDirty(this._property)}serialize(e){return super._serialize({name:"SetValueAction",properties:[h._GetTargetProperty(this._target),{name:"propertyPath",value:this.propertyPath},{name:"value",value:h._SerializeValueAsString(this.value)}]},e)}}class y extends h{constructor(e,t,i,n,s){super(e,s),this.propertyPath=i,this.value=n,this._target=this._effectiveTarget=t}_prepare(){this._effectiveTarget=this._getEffectiveTarget(this._effectiveTarget,this.propertyPath),this._property=this._getProperty(this.propertyPath),"number"!=typeof this._effectiveTarget[this._property]&&_.Y.Warn("Warning: IncrementValueAction can only be used with number values")}execute(){this._effectiveTarget[this._property]+=this.value,this._target.markAsDirty&&this._target.markAsDirty(this._property)}serialize(e){return super._serialize({name:"IncrementValueAction",properties:[h._GetTargetProperty(this._target),{name:"propertyPath",value:this.propertyPath},{name:"value",value:h._SerializeValueAsString(this.value)}]},e)}}class x extends h{constructor(e,t,i,n,s,r){super(e,r),this.from=i,this.to=n,this.loop=s,this._target=t}_prepare(){}execute(){this._actionManager.getScene().beginAnimation(this._target,this.from,this.to,this.loop)}serialize(e){return super._serialize({name:"PlayAnimationAction",properties:[h._GetTargetProperty(this._target),{name:"from",value:String(this.from)},{name:"to",value:String(this.to)},{name:"loop",value:h._SerializeValueAsString(this.loop)||!1}]},e)}}class b extends h{constructor(e,t,i){super(e,i),this._target=t}_prepare(){}execute(){this._actionManager.getScene().stopAnimation(this._target)}serialize(e){return super._serialize({name:"StopAnimationAction",properties:[h._GetTargetProperty(this._target)]},e)}}class T extends h{constructor(e=0,t){super(e,t)}execute(){}serialize(e){return super._serialize({name:"DoNothingAction",properties:[]},e)}}class S extends h{constructor(e,t,i,n=!0){super(e,i),this.children=t,this.enableChildrenConditions=n}_prepare(){for(let e=0;e<this.children.length;e++)this.children[e]._actionManager=this._actionManager,this.children[e]._prepare()}execute(e){for(const t of this.children)this.enableChildrenConditions&&!t._evaluateConditionForCurrentFrame()||t.execute(e)}serialize(e){const t=super._serialize({name:"CombineAction",properties:[],combine:[]},e);for(let e=0;e<this.children.length;e++)t.combine.push(this.children[e].serialize(null));return t}}class E extends h{constructor(e,t,i){super(e,i),this.func=t}execute(e){this.func(e)}}class C extends h{constructor(e,t,i,n){super(e,n),this._target=t,this._parent=i}_prepare(){}execute(){if(this._target.parent===this._parent)return;const e=this._parent.getWorldMatrix().clone();e.invert(),this._target.position=o.P.TransformCoordinates(this._target.position,e),this._target.parent=this._parent}serialize(e){return super._serialize({name:"SetParentAction",properties:[h._GetTargetProperty(this._target),h._GetTargetProperty(this._parent)]},e)}}(0,l.H)("BABYLON.SetParentAction",C),(0,l.H)("BABYLON.ExecuteCodeAction",E),(0,l.H)("BABYLON.DoNothingAction",T),(0,l.H)("BABYLON.StopAnimationAction",b),(0,l.H)("BABYLON.PlayAnimationAction",x),(0,l.H)("BABYLON.IncrementValueAction",y),(0,l.H)("BABYLON.SetValueAction",v),(0,l.H)("BABYLON.SetStateAction",g),(0,l.H)("BABYLON.SetParentAction",C),(0,l.H)("BABYLON.SwitchBooleanAction",m),(0,l.H)("BABYLON.CombineAction",S);var A=i(1431),P=i(6387);class R extends s.O{constructor(e){super(),(e=e||A.l.LastCreatedScene)&&(this._scene=e,e.actionManagers.push(this))}dispose(){const e=this._scene.actionManagers.indexOf(this);for(let e=0;e<this.actions.length;e++){const t=this.actions[e];R.Triggers[t.trigger]--,0===R.Triggers[t.trigger]&&delete R.Triggers[t.trigger]}e>-1&&this._scene.actionManagers.splice(e,1)}getScene(){return this._scene}hasSpecificTriggers(e){for(let t=0;t<this.actions.length;t++){const i=this.actions[t];if(e.indexOf(i.trigger)>-1)return!0}return!1}hasSpecificTriggers2(e,t){for(let i=0;i<this.actions.length;i++){const n=this.actions[i];if(e==n.trigger||t==n.trigger)return!0}return!1}hasSpecificTrigger(e,t){for(let i=0;i<this.actions.length;i++){const n=this.actions[i];if(n.trigger===e){if(!t)return!0;if(t(n.getTriggerParameter()))return!0}}return!1}get hasPointerTriggers(){for(let e=0;e<this.actions.length;e++){const t=this.actions[e];if(t.trigger>=R.OnPickTrigger&&t.trigger<=R.OnPointerOutTrigger)return!0}return!1}get hasPickTriggers(){for(let e=0;e<this.actions.length;e++){const t=this.actions[e];if(t.trigger>=R.OnPickTrigger&&t.trigger<=R.OnPickUpTrigger)return!0}return!1}registerAction(e){return e.trigger===R.OnEveryFrameTrigger&&this.getScene().actionManager!==this?(_.Y.Warn("OnEveryFrameTrigger can only be used with scene.actionManager"),null):(this.actions.push(e),this.getScene()._registeredActions++,R.Triggers[e.trigger]?R.Triggers[e.trigger]++:R.Triggers[e.trigger]=1,e._actionManager=this,e._prepare(),e)}unregisterAction(e){const t=this.actions.indexOf(e);return-1!==t&&(this.actions.splice(t,1),R.Triggers[e.trigger]-=1,0===R.Triggers[e.trigger]&&delete R.Triggers[e.trigger],e._actionManager=null,this.getScene()._registeredActions--,!0)}processTrigger(e,t){for(let i=0;i<this.actions.length;i++){const n=this.actions[i];if(n.trigger===e){if(t&&(e===R.OnKeyUpTrigger||e===R.OnKeyDownTrigger)){const e=n.getTriggerParameter();if("function"==typeof e){if(!e(t))continue}else if(e&&e!==t.sourceEvent.keyCode){if(!e.toLowerCase)continue;const i=e.toLowerCase();if(i!==t.sourceEvent.key){const e=t.sourceEvent.charCode?t.sourceEvent.charCode:t.sourceEvent.keyCode;if(String.fromCharCode(e).toLowerCase()!==i)continue}}}n._executeCurrent(t)}}}_getEffectiveTarget(e,t){const i=t.split(".");for(let t=0;t<i.length-1;t++)e=e[i[t]];return e}_getProperty(e){const t=e.split(".");return t[t.length-1]}serialize(e){const t={children:new Array,name:e,type:3,properties:new Array};for(let e=0;e<this.actions.length;e++){const i={type:0,children:new Array,name:R.GetTriggerName(this.actions[e].trigger),properties:new Array},n=this.actions[e].triggerOptions;if(n&&"number"!=typeof n)if(n.parameter instanceof Node)i.properties.push(h._GetTargetProperty(n.parameter));else if("object"==typeof n.parameter){const e={};P.j.DeepCopy(n.parameter,e,["mesh"]),n.parameter&&n.parameter.mesh&&(e._meshId=n.parameter.mesh.id),i.properties.push({name:"parameter",targetType:null,value:e})}else i.properties.push({name:"parameter",targetType:null,value:n.parameter});this.actions[e].serialize(i),t.children.push(i)}return t}static Parse(e,t,i){const n=new R(i);null===t?i.actionManager=n:t.actionManager=n;const s=(e,t,i,n)=>{if(null===n){const e=parseFloat(t);return"true"===t||"false"===t?"true"===t:isNaN(e)?t:e}const s=n.split("."),r=t.split(",");for(let e=0;e<s.length;e++)i=i[s[e]];if("boolean"==typeof i)return"true"===r[0];if("string"==typeof i)return r[0];const l=new Array;for(let e=0;e<r.length;e++)l.push(parseFloat(r[e]));return i instanceof o.P?o.P.FromArray(l):i instanceof o.Lt?o.Lt.FromArray(l):i instanceof a.Wo?a.Wo.FromArray(l):i instanceof a.HE?a.HE.FromArray(l):parseFloat(r[0])},r=(e,t,o,a,h=null)=>{if(e.detached)return;const c=new Array;let p=null,f=null;const _=e.combine&&e.combine.length>0;if(2===e.type?c.push(n):c.push(t),_){const t=new Array;for(let i=0;i<e.combine.length;i++)r(e.combine[i],R.NothingTrigger,o,a,t);c.push(t)}else for(let t=0;t<e.properties.length;t++){let n=e.properties[t].value;const r=e.properties[t].name,o=e.properties[t].targetType;"target"===r?n=p="SceneProperties"===o?i:"MaterialProperties"===o?i.getMaterialByName(n):i.getNodeByName(n):"parent"===r?n=i.getNodeByName(n):"sound"===r?i.getSoundByName&&(n=i.getSoundByName(n)):"propertyPath"!==r?n=2===e.type&&"operator"===r?d[n]:s(0,n,p,"value"===r?f:null):f=n,c.push(n)}if(null===h?c.push(o):c.push(null),"InterpolateValueAction"===e.name){const e=c[c.length-2];c[c.length-1]=e,c[c.length-2]=o}let m=((e,t)=>{const i=(0,l.q)("BABYLON."+e);return i&&new i(...t)})(e.name,c);if(m instanceof u&&null!==o){const e=new T(t,o);a?a.then(e):n.registerAction(e),a=e}null===h?m instanceof u?(o=m,m=a):(o=null,a?a.then(m):n.registerAction(m)):h.push(m);for(let i=0;i<e.children.length;i++)r(e.children[i],t,o,m,null)};for(let t=0;t<e.children.length;t++){let n;const s=e.children[t];if(s.properties.length>0){const e=s.properties[0].value,t=null===s.properties[0].targetType?e:i.getMeshByName(e);t._meshId&&(t.mesh=i.getMeshById(t._meshId)),n={trigger:R[s.name],parameter:t}}else n=R[s.name];for(let e=0;e<s.children.length;e++)s.detached||r(s.children[e],n,null,null)}}static GetTriggerName(e){switch(e){case 0:return"NothingTrigger";case 1:return"OnPickTrigger";case 2:return"OnLeftPickTrigger";case 3:return"OnRightPickTrigger";case 4:return"OnCenterPickTrigger";case 5:return"OnPickDownTrigger";case 6:return"OnDoublePickTrigger";case 7:return"OnPickUpTrigger";case 8:return"OnLongPressTrigger";case 9:return"OnPointerOverTrigger";case 10:return"OnPointerOutTrigger";case 11:return"OnEveryFrameTrigger";case 12:return"OnIntersectionEnterTrigger";case 13:return"OnIntersectionExitTrigger";case 14:return"OnKeyDownTrigger";case 15:return"OnKeyUpTrigger";case 16:return"OnPickOutTrigger";default:return""}}}R.NothingTrigger=0,R.OnPickTrigger=1,R.OnLeftPickTrigger=2,R.OnRightPickTrigger=3,R.OnCenterPickTrigger=4,R.OnPickDownTrigger=5,R.OnDoublePickTrigger=6,R.OnPickUpTrigger=7,R.OnPickOutTrigger=16,R.OnLongPressTrigger=8,R.OnPointerOverTrigger=9,R.OnPointerOutTrigger=10,R.OnEveryFrameTrigger=11,R.OnIntersectionEnterTrigger=12,R.OnIntersectionExitTrigger=13,R.OnKeyDownTrigger=14,R.OnKeyUpTrigger=15;class M extends h{constructor(e,t,i){super(e,i),this._sound=t}_prepare(){}execute(){void 0!==this._sound&&this._sound.play()}serialize(e){return super._serialize({name:"PlaySoundAction",properties:[{name:"sound",value:this._sound.name}]},e)}}class I extends h{constructor(e,t,i){super(e,i),this._sound=t}_prepare(){}execute(){void 0!==this._sound&&this._sound.stop()}serialize(e){return super._serialize({name:"StopSoundAction",properties:[{name:"sound",value:this._sound.name}]},e)}}(0,l.H)("BABYLON.PlaySoundAction",M),(0,l.H)("BABYLON.StopSoundAction",I);var D=i(4676);class O extends h{constructor(e,t,i,n,s=1e3,o,a,l){super(e,o),this.duration=1e3,this.onInterpolationDoneObservable=new r.y$,this.propertyPath=i,this.value=n,this.duration=s,this.stopOtherAnimations=a,this.onInterpolationDone=l,this._target=this._effectiveTarget=t}_prepare(){this._effectiveTarget=this._getEffectiveTarget(this._effectiveTarget,this.propertyPath),this._property=this._getProperty(this.propertyPath)}execute(){const e=this._actionManager.getScene(),t=[{frame:0,value:this._effectiveTarget[this._property]},{frame:100,value:this.value}];let i;if("number"==typeof this.value)i=D.f.ANIMATIONTYPE_FLOAT;else if(this.value instanceof a.Wo)i=D.f.ANIMATIONTYPE_COLOR3;else if(this.value instanceof o.P)i=D.f.ANIMATIONTYPE_VECTOR3;else if(this.value instanceof o.y3)i=D.f.ANIMATIONTYPE_MATRIX;else{if(!(this.value instanceof o._f))return void _.Y.Warn("InterpolateValueAction: Unsupported type ("+typeof this.value+")");i=D.f.ANIMATIONTYPE_QUATERNION}const n=new D.f("InterpolateValueAction",this._property,1e3/this.duration*100,i,D.f.ANIMATIONLOOPMODE_CONSTANT);n.setKeys(t),this.stopOtherAnimations&&e.stopAnimation(this._effectiveTarget),e.beginDirectAnimation(this._effectiveTarget,[n],0,100,!1,1,(()=>{this.onInterpolationDoneObservable.notifyObservers(this),this.onInterpolationDone&&this.onInterpolationDone()}))}serialize(e){return super._serialize({name:"InterpolateValueAction",properties:[h._GetTargetProperty(this._target),{name:"propertyPath",value:this.propertyPath},{name:"value",value:h._SerializeValueAsString(this.value)},{name:"duration",value:h._SerializeValueAsString(this.duration)},{name:"stopOtherAnimations",value:h._SerializeValueAsString(this.stopOtherAnimations)||!1}]},e)}}(0,l.H)("BABYLON.InterpolateValueAction",O);var w=i(9697);const N=Object.freeze(new o._f(0,0,0,0)),F=Object.freeze(o.P.Zero()),L=Object.freeze(o.FM.Zero()),B=Object.freeze(w.$.Zero()),U=Object.freeze(a.Wo.Black());class V{get currentFrame(){return this._currentFrame}get weight(){return this._weight}get currentValue(){return this._currentValue}get targetPath(){return this._targetPath}get target(){return this._currentActiveTarget}get isAdditive(){return this._host&&this._host.isAdditive}constructor(e,t,i,n){if(this._events=new Array,this._currentFrame=0,this._originalValue=new Array,this._originalBlendValue=null,this._offsetsCache={},this._highLimitsCache={},this._stopped=!1,this._blendingFactor=0,this._currentValue=null,this._currentActiveTarget=null,this._directTarget=null,this._targetPath="",this._weight=1,this._ratioOffset=0,this._previousDelay=0,this._previousRatio=0,this._targetIsArray=!1,this._animation=t,this._target=e,this._scene=i,this._host=n,this._activeTargets=[],t._runtimeAnimations.push(this),this._animationState={key:0,repeatCount:0,loopMode:this._getCorrectLoopMode()},this._animation.dataType===D.f.ANIMATIONTYPE_MATRIX&&(this._animationState.workValue=o.y3.Zero()),this._keys=this._animation.getKeys(),this._minFrame=this._keys[0].frame,this._maxFrame=this._keys[this._keys.length-1].frame,this._minValue=this._keys[0].value,this._maxValue=this._keys[this._keys.length-1].value,0!==this._minFrame){const e={frame:0,value:this._minValue};this._keys.splice(0,0,e)}if(this._target instanceof Array){let e=0;for(const t of this._target)this._preparePath(t,e),this._getOriginalValues(e),e++;this._targetIsArray=!0}else this._preparePath(this._target),this._getOriginalValues(),this._targetIsArray=!1,this._directTarget=this._activeTargets[0];const s=t.getEvents();s&&s.length>0&&s.forEach((e=>{this._events.push(e._clone())})),this._enableBlending=e&&e.animationPropertiesOverride?e.animationPropertiesOverride.enableBlending:this._animation.enableBlending}_preparePath(e,t=0){const i=this._animation.targetPropertyPath;if(i.length>1){let n=e[i[0]];for(let e=1;e<i.length-1;e++)n=n[i[e]];this._targetPath=i[i.length-1],this._activeTargets[t]=n}else this._targetPath=i[0],this._activeTargets[t]=e}get animation(){return this._animation}reset(e=!1){if(e)if(this._target instanceof Array){let e=0;for(const t of this._target)void 0!==this._originalValue[e]&&this._setValue(t,this._activeTargets[e],this._originalValue[e],-1,e),e++}else void 0!==this._originalValue[0]&&this._setValue(this._target,this._directTarget,this._originalValue[0],-1,0);this._offsetsCache={},this._highLimitsCache={},this._currentFrame=0,this._blendingFactor=0;for(let e=0;e<this._events.length;e++)this._events[e].isDone=!1}isStopped(){return this._stopped}dispose(){const e=this._animation.runtimeAnimations.indexOf(this);e>-1&&this._animation.runtimeAnimations.splice(e,1)}setValue(e,t){if(this._targetIsArray)for(let i=0;i<this._target.length;i++){const n=this._target[i];this._setValue(n,this._activeTargets[i],e,t,i)}else this._setValue(this._target,this._directTarget,e,t,0)}_getOriginalValues(e=0){let t;const i=this._activeTargets[e];t=i.getRestPose&&"_matrix"===this._targetPath?i.getRestPose():i[this._targetPath],t&&t.clone?this._originalValue[e]=t.clone():this._originalValue[e]=t}_setValue(e,t,i,n,s){if(this._currentActiveTarget=t,this._weight=n,this._enableBlending&&this._blendingFactor<=1){if(!this._originalBlendValue){const e=t[this._targetPath];e.clone?this._originalBlendValue=e.clone():this._originalBlendValue=e}this._originalBlendValue.m?D.f.AllowMatrixDecomposeForInterpolation?this._currentValue?o.y3.DecomposeLerpToRef(this._originalBlendValue,i,this._blendingFactor,this._currentValue):this._currentValue=o.y3.DecomposeLerp(this._originalBlendValue,i,this._blendingFactor):this._currentValue?o.y3.LerpToRef(this._originalBlendValue,i,this._blendingFactor,this._currentValue):this._currentValue=o.y3.Lerp(this._originalBlendValue,i,this._blendingFactor):this._currentValue=D.f._UniversalLerp(this._originalBlendValue,i,this._blendingFactor);const n=e&&e.animationPropertiesOverride?e.animationPropertiesOverride.blendingSpeed:this._animation.blendingSpeed;this._blendingFactor+=n}else this._currentValue?this._currentValue.copyFrom?this._currentValue.copyFrom(i):this._currentValue=i:(null==i?void 0:i.clone)?this._currentValue=i.clone():this._currentValue=i;-1!==n?this._scene._registerTargetForLateAnimationBinding(this,this._originalValue[s]):t[this._targetPath]=this._currentValue,e.markAsDirty&&e.markAsDirty(this._animation.targetProperty)}_getCorrectLoopMode(){return this._target&&this._target.animationPropertiesOverride?this._target.animationPropertiesOverride.loopMode:this._animation.loopMode}goToFrame(e){const t=this._animation.getKeys();e<t[0].frame?e=t[0].frame:e>t[t.length-1].frame&&(e=t[t.length-1].frame);const i=this._events;if(i.length)for(let t=0;t<i.length;t++)i[t].onlyOnce||(i[t].isDone=i[t].frame<e);this._currentFrame=e;const n=this._animation._interpolate(e,this._animationState);this.setValue(n,-1)}_prepareForSpeedRatioChange(e){const t=this._previousDelay*(this._animation.framePerSecond*e)/1e3;this._ratioOffset=this._previousRatio-t}animate(e,t,i,n,s,r=-1){const o=this._animation,a=o.targetPropertyPath;if(!a||a.length<1)return this._stopped=!0,!1;let l=!0;(t<this._minFrame||t>this._maxFrame)&&(t=this._minFrame),(i<this._minFrame||i>this._maxFrame)&&(i=this._maxFrame);const h=i-t;let c;const u=e*(o.framePerSecond*s)/1e3+this._ratioOffset;let d,p=0;if(this._previousDelay=e,this._previousRatio=u,!n&&i>=t&&u>=h)l=!1,p=o._getKeyValue(this._maxValue);else if(!n&&t>=i&&u<=h)l=!1,p=o._getKeyValue(this._minValue);else if(this._animationState.loopMode!==D.f.ANIMATIONLOOPMODE_CYCLE){const e=i.toString()+t.toString();if(!this._offsetsCache[e]){this._animationState.repeatCount=0,this._animationState.loopMode=D.f.ANIMATIONLOOPMODE_CYCLE;const n=o._interpolate(t,this._animationState),s=o._interpolate(i,this._animationState);switch(this._animationState.loopMode=this._getCorrectLoopMode(),o.dataType){case D.f.ANIMATIONTYPE_FLOAT:this._offsetsCache[e]=s-n;break;case D.f.ANIMATIONTYPE_QUATERNION:case D.f.ANIMATIONTYPE_VECTOR3:case D.f.ANIMATIONTYPE_VECTOR2:case D.f.ANIMATIONTYPE_SIZE:case D.f.ANIMATIONTYPE_COLOR3:this._offsetsCache[e]=s.subtract(n)}this._highLimitsCache[e]=s}p=this._highLimitsCache[e],c=this._offsetsCache[e]}if(void 0===c)switch(o.dataType){case D.f.ANIMATIONTYPE_FLOAT:c=0;break;case D.f.ANIMATIONTYPE_QUATERNION:c=N;break;case D.f.ANIMATIONTYPE_VECTOR3:c=F;break;case D.f.ANIMATIONTYPE_VECTOR2:c=L;break;case D.f.ANIMATIONTYPE_SIZE:c=B;break;case D.f.ANIMATIONTYPE_COLOR3:c=U}if(this._host&&this._host.syncRoot){const e=this._host.syncRoot;d=t+(i-t)*((e.masterFrame-e.fromFrame)/(e.toFrame-e.fromFrame))}else d=u>0&&t>i||u<0&&t<i?l&&0!==h?i+u%h:t:l&&0!==h?t+u%h:i;const f=this._events;if(s>0&&this.currentFrame>d||s<0&&this.currentFrame<d){this._onLoop();for(let e=0;e<f.length;e++)f[e].onlyOnce||(f[e].isDone=!1);this._animationState.key=s>0?0:o.getKeys().length-1}this._currentFrame=d,this._animationState.repeatCount=0===h?0:u/h>>0,this._animationState.highLimitValue=p,this._animationState.offsetValue=c;const _=o._interpolate(d,this._animationState);if(this.setValue(_,r),f.length)for(let e=0;e<f.length;e++)if(h>0&&d>=f[e].frame&&f[e].frame>=t||h<0&&d<=f[e].frame&&f[e].frame<=t){const t=f[e];t.isDone||(t.onlyOnce&&(f.splice(e,1),e--),t.isDone=!0,t.action(d))}return l||(this._stopped=!0),l}}var k=i(1057),G=i(8108),z=i(4026);class W{get syncRoot(){return this._syncRoot}get masterFrame(){return 0===this._runtimeAnimations.length?0:this._runtimeAnimations[0].currentFrame}get weight(){return this._weight}set weight(e){this._weight=-1!==e?Math.min(Math.max(e,0),1):-1}get speedRatio(){return this._speedRatio}set speedRatio(e){for(let t=0;t<this._runtimeAnimations.length;t++)this._runtimeAnimations[t]._prepareForSpeedRatioChange(e);this._speedRatio=e,null!==this._goToFrame&&this.goToFrame(this._goToFrame)}constructor(e,t,i=0,n=100,s=!1,o=1,a,l,h,c=!1){this.target=t,this.fromFrame=i,this.toFrame=n,this.loopAnimation=s,this.onAnimationEnd=a,this.onAnimationLoop=h,this.isAdditive=c,this._localDelayOffset=null,this._pausedDelay=null,this._manualJumpDelay=null,this._runtimeAnimations=new Array,this._paused=!1,this._speedRatio=1,this._weight=-1,this._syncRoot=null,this._frameToSyncFromJump=null,this._goToFrame=null,this.disposeOnEnd=!0,this.animationStarted=!1,this.onAnimationEndObservable=new r.y$,this.onAnimationLoopObservable=new r.y$,this._scene=e,l&&this.appendAnimations(t,l),this._speedRatio=o,e._activeAnimatables.push(this)}syncWith(e){if(this._syncRoot=e,e){const e=this._scene._activeAnimatables.indexOf(this);e>-1&&(this._scene._activeAnimatables.splice(e,1),this._scene._activeAnimatables.push(this))}return this}getAnimations(){return this._runtimeAnimations}appendAnimations(e,t){for(let i=0;i<t.length;i++){const n=t[i],s=new V(e,n,this._scene,this);s._onLoop=()=>{this.onAnimationLoopObservable.notifyObservers(this),this.onAnimationLoop&&this.onAnimationLoop()},this._runtimeAnimations.push(s)}}getAnimationByTargetProperty(e){const t=this._runtimeAnimations;for(let i=0;i<t.length;i++)if(t[i].animation.targetProperty===e)return t[i].animation;return null}getRuntimeAnimationByTargetProperty(e){const t=this._runtimeAnimations;for(let i=0;i<t.length;i++)if(t[i].animation.targetProperty===e)return t[i];return null}reset(){const e=this._runtimeAnimations;for(let t=0;t<e.length;t++)e[t].reset(!0);this._localDelayOffset=null,this._pausedDelay=null}enableBlending(e){const t=this._runtimeAnimations;for(let i=0;i<t.length;i++)t[i].animation.enableBlending=!0,t[i].animation.blendingSpeed=e}disableBlending(){const e=this._runtimeAnimations;for(let t=0;t<e.length;t++)e[t].animation.enableBlending=!1}goToFrame(e){var t;const i=this._runtimeAnimations;if(i[0]){const n=i[0].animation.framePerSecond;this._frameToSyncFromJump=null!==(t=this._frameToSyncFromJump)&&void 0!==t?t:i[0].currentFrame;const s=0===this.speedRatio?0:(e-this._frameToSyncFromJump)/n*1e3/this.speedRatio;this._manualJumpDelay=-s}for(let t=0;t<i.length;t++)i[t].goToFrame(e);this._goToFrame=e}pause(){this._paused||(this._paused=!0)}restart(){this._paused=!1}_raiseOnAnimationEnd(){this.onAnimationEnd&&this.onAnimationEnd(),this.onAnimationEndObservable.notifyObservers(this)}stop(e,t,i=!1){if(e||t){const n=this._scene._activeAnimatables.indexOf(this);if(n>-1){const s=this._runtimeAnimations;for(let i=s.length-1;i>=0;i--){const n=s[i];e&&n.animation.name!=e||t&&!t(n.target)||(n.dispose(),s.splice(i,1))}0==s.length&&(i||this._scene._activeAnimatables.splice(n,1),this._raiseOnAnimationEnd())}}else{const e=this._scene._activeAnimatables.indexOf(this);if(e>-1){i||this._scene._activeAnimatables.splice(e,1);const t=this._runtimeAnimations;for(let e=0;e<t.length;e++)t[e].dispose();this._runtimeAnimations.length=0,this._raiseOnAnimationEnd()}}}waitAsync(){return new Promise((e=>{this.onAnimationEndObservable.add((()=>{e(this)}),void 0,void 0,this,!0)}))}_animate(e){if(this._paused)return this.animationStarted=!1,null===this._pausedDelay&&(this._pausedDelay=e),!0;if(null===this._localDelayOffset?(this._localDelayOffset=e,this._pausedDelay=null):null!==this._pausedDelay&&(this._localDelayOffset+=e-this._pausedDelay,this._pausedDelay=null),null!==this._manualJumpDelay&&(this._localDelayOffset+=this._manualJumpDelay,this._manualJumpDelay=null,this._frameToSyncFromJump=null),this._goToFrame=null,0===this._weight)return!0;let t=!1;const i=this._runtimeAnimations;let n;for(n=0;n<i.length;n++){const s=i[n].animate(e-this._localDelayOffset,this.fromFrame,this.toFrame,this.loopAnimation,this._speedRatio,this._weight);t=t||s}if(this.animationStarted=t,!t){if(this.disposeOnEnd)for(n=this._scene._activeAnimatables.indexOf(this),this._scene._activeAnimatables.splice(n,1),n=0;n<i.length;n++)i[n].dispose();this._raiseOnAnimationEnd(),this.disposeOnEnd&&(this.onAnimationEnd=null,this.onAnimationLoop=null,this.onAnimationLoopObservable.clear(),this.onAnimationEndObservable.clear())}return t}}k.x.prototype._animate=function(){if(!this.animationsEnabled)return;const e=G.F.Now;if(!this._animationTimeLast){if(this._pendingData.length>0)return;this._animationTimeLast=e}this.deltaTime=this.useConstantAnimationDeltaTime?16:(e-this._animationTimeLast)*this.animationTimeScale,this._animationTimeLast=e;const t=this._activeAnimatables;if(0===t.length)return;this._animationTime+=this.deltaTime;const i=this._animationTime;for(let e=0;e<t.length;e++){const n=t[e];!n._animate(i)&&n.disposeOnEnd&&e--}this._processLateAnimationBindings()},k.x.prototype.beginWeightedAnimation=function(e,t,i,n=1,s,r=1,o,a,l,h,c=!1){const u=this.beginAnimation(e,t,i,s,r,o,a,!1,l,h,c);return u.weight=n,u},k.x.prototype.beginAnimation=function(e,t,i,n,s=1,r,o,a=!0,l,h,c=!1){t>i&&s>0&&(s*=-1),a&&this.stopAnimation(e,void 0,l),o||(o=new W(this,e,t,i,n,s,r,void 0,h,c));const u=!l||l(e);if(e.animations&&u&&o.appendAnimations(e,e.animations),e.getAnimatables){const c=e.getAnimatables();for(let e=0;e<c.length;e++)this.beginAnimation(c[e],t,i,n,s,r,o,a,l,h)}return o.reset(),o},k.x.prototype.beginHierarchyAnimation=function(e,t,i,n,s,r=1,o,a,l=!0,h,c,u=!1){const d=e.getDescendants(t),p=[];p.push(this.beginAnimation(e,i,n,s,r,o,a,l,h,void 0,u));for(const e of d)p.push(this.beginAnimation(e,i,n,s,r,o,a,l,h,void 0,u));return p},k.x.prototype.beginDirectAnimation=function(e,t,i,n,s,r,o,a,l=!1){if(void 0===r&&(r=1),i>n&&r>0)r*=-1;else if(n>i&&r<0){const e=n;n=i,i=e}return new W(this,e,i,n,s,r,o,t,a,l)},k.x.prototype.beginDirectHierarchyAnimation=function(e,t,i,n,s,r,o,a,l,h=!1){const c=e.getDescendants(t),u=[];u.push(this.beginDirectAnimation(e,i,n,s,r,o,a,l,h));for(const e of c)u.push(this.beginDirectAnimation(e,i,n,s,r,o,a,l,h));return u},k.x.prototype.getAnimatableByTarget=function(e){for(let t=0;t<this._activeAnimatables.length;t++)if(this._activeAnimatables[t].target===e)return this._activeAnimatables[t];return null},k.x.prototype.getAllAnimatablesByTarget=function(e){const t=[];for(let i=0;i<this._activeAnimatables.length;i++)this._activeAnimatables[i].target===e&&t.push(this._activeAnimatables[i]);return t},k.x.prototype.stopAnimation=function(e,t,i){const n=this.getAllAnimatablesByTarget(e);for(const e of n)e.stop(t,i)},k.x.prototype.stopAllAnimations=function(){if(this._activeAnimatables){for(let e=0;e<this._activeAnimatables.length;e++)this._activeAnimatables[e].stop(void 0,void 0,!0);this._activeAnimatables.length=0}for(const e of this.animationGroups)e.stop()},k.x.prototype._registerTargetForLateAnimationBinding=function(e,t){const i=e.target;this._registeredForLateAnimationBindings.pushNoDuplicate(i),i._lateAnimationHolders||(i._lateAnimationHolders={}),i._lateAnimationHolders[e.targetPath]||(i._lateAnimationHolders[e.targetPath]={totalWeight:0,totalAdditiveWeight:0,animations:[],additiveAnimations:[],originalValue:t}),e.isAdditive?(i._lateAnimationHolders[e.targetPath].additiveAnimations.push(e),i._lateAnimationHolders[e.targetPath].totalAdditiveWeight+=e.weight):(i._lateAnimationHolders[e.targetPath].animations.push(e),i._lateAnimationHolders[e.targetPath].totalWeight+=e.weight)},k.x.prototype._processLateAnimationBindingsForMatrices=function(e){if(0===e.totalWeight&&0===e.totalAdditiveWeight)return e.originalValue;let t=1;const i=o.jp.Vector3[0],n=o.jp.Vector3[1],s=o.jp.Quaternion[0];let r=0;const a=e.animations[0],l=e.originalValue;let h=1,c=!1;if(e.totalWeight<1)h=1-e.totalWeight,l.decompose(n,s,i);else{if(r=1,t=e.totalWeight,h=a.weight/t,1==h){if(!e.totalAdditiveWeight)return a.currentValue;c=!0}a.currentValue.decompose(n,s,i)}if(!c){n.scaleInPlace(h),i.scaleInPlace(h),s.scaleInPlace(h);for(let a=r;a<e.animations.length;a++){const r=e.animations[a];if(0===r.weight)continue;h=r.weight/t;const l=o.jp.Vector3[2],c=o.jp.Vector3[3],u=o.jp.Quaternion[1];r.currentValue.decompose(c,u,l),c.scaleAndAddToRef(h,n),u.scaleAndAddToRef(o._f.Dot(s,u)>0?h:-h,s),l.scaleAndAddToRef(h,i)}s.normalize()}for(let t=0;t<e.additiveAnimations.length;t++){const r=e.additiveAnimations[t];if(0===r.weight)continue;const a=o.jp.Vector3[2],l=o.jp.Vector3[3],h=o.jp.Quaternion[1];r.currentValue.decompose(l,h,a),l.multiplyToRef(n,l),o.P.LerpToRef(n,l,r.weight,n),s.multiplyToRef(h,h),o._f.SlerpToRef(s,h,r.weight,s),a.scaleAndAddToRef(r.weight,i)}const u=a?a._animationState.workValue:o.jp.Matrix[0].clone();return o.y3.ComposeToRef(n,s,i,u),u},k.x.prototype._processLateAnimationBindingsForQuaternions=function(e,t){if(0===e.totalWeight&&0===e.totalAdditiveWeight)return t;const i=e.animations[0],n=e.originalValue;let s=t;if(0===e.totalWeight&&e.totalAdditiveWeight>0)s.copyFrom(n);else if(1===e.animations.length){if(o._f.SlerpToRef(n,i.currentValue,Math.min(1,e.totalWeight),s),0===e.totalAdditiveWeight)return s}else if(e.animations.length>1){let i,r,a=1;if(e.totalWeight<1){const t=1-e.totalWeight;i=[],r=[],i.push(n),r.push(t)}else{if(2===e.animations.length&&(o._f.SlerpToRef(e.animations[0].currentValue,e.animations[1].currentValue,e.animations[1].weight/e.totalWeight,t),0===e.totalAdditiveWeight))return t;i=[],r=[],a=e.totalWeight}for(let t=0;t<e.animations.length;t++){const n=e.animations[t];i.push(n.currentValue),r.push(n.weight/a)}let l=0;for(let e=0;e<i.length;)e?(l+=r[e],o._f.SlerpToRef(s,i[e],r[e]/l,s),e++):(o._f.SlerpToRef(i[e],i[e+1],r[e+1]/(r[e]+r[e+1]),t),s=t,l=r[e]+r[e+1],e+=2)}for(let t=0;t<e.additiveAnimations.length;t++){const i=e.additiveAnimations[t];0!==i.weight&&(s.multiplyToRef(i.currentValue,o.jp.Quaternion[0]),o._f.SlerpToRef(s,o.jp.Quaternion[0],i.weight,s))}return s},k.x.prototype._processLateAnimationBindings=function(){if(this._registeredForLateAnimationBindings.length){for(let e=0;e<this._registeredForLateAnimationBindings.length;e++){const t=this._registeredForLateAnimationBindings.data[e];for(const e in t._lateAnimationHolders){const i=t._lateAnimationHolders[e],n=i.animations[0],s=i.originalValue;if(null==s)continue;const r=D.f.AllowMatrixDecomposeForInterpolation&&s.m;let a=t[e];if(r)a=this._processLateAnimationBindingsForMatrices(i);else if(void 0!==s.w)a=this._processLateAnimationBindingsForQuaternions(i,a||o._f.Identity());else{let e=0,t=1;if(i.totalWeight<1)a=n&&s.scale?s.scale(1-i.totalWeight):n?s*(1-i.totalWeight):s.clone?s.clone():s;else if(n){t=i.totalWeight;const s=n.weight/t;a=1!==s?n.currentValue.scale?n.currentValue.scale(s):n.currentValue*s:n.currentValue,e=1}for(let n=e;n<i.animations.length;n++){const e=i.animations[n],s=e.weight/t;s&&(e.currentValue.scaleAndAddToRef?e.currentValue.scaleAndAddToRef(s,a):a+=e.currentValue*s)}for(let e=0;e<i.additiveAnimations.length;e++){const t=i.additiveAnimations[e],n=t.weight;n&&(t.currentValue.scaleAndAddToRef?t.currentValue.scaleAndAddToRef(n,a):a+=t.currentValue*n)}}t[e]=a}t._lateAnimationHolders={}}this._registeredForLateAnimationBindings.reset()}},z.N.prototype.copyAnimationRange=function(e,t,i,n=!1,s=null){0===this.animations.length&&(this.animations.push(new D.f(this.name,"_matrix",e.animations[0].framePerSecond,D.f.ANIMATIONTYPE_MATRIX,0)),this.animations[0].setKeys([]));const r=e.animations[0].getRange(t);if(!r)return!1;const o=r.from,a=r.to,l=e.animations[0].getKeys(),h=e.length,c=e.getParent(),u=this.getParent(),d=n&&c&&h&&this.length&&h!==this.length,p=d&&u&&c?u.length/c.length:1,f=n&&!u&&s&&(1!==s.x||1!==s.y||1!==s.z),_=this.animations[0].getKeys();let m,g,v;for(let e=0,t=l.length;e<t;e++)m=l[e],m.frame>=o&&m.frame<=a&&(n?(v=m.value.clone(),d?(g=v.getTranslation(),v.setTranslation(g.scaleInPlace(p))):f&&s?(g=v.getTranslation(),v.setTranslation(g.multiplyInPlace(s))):v=m.value):v=m.value,_.push({frame:m.frame+i,value:v}));return this.animations[0].createRange(t,o+i,a+i),!0};class H{constructor(){this.enableBlending=!1,this.blendingSpeed=.01,this.loopMode=D.f.ANIMATIONLOOPMODE_CYCLE}}var X=i(1277);class j{constructor(){this._easingMode=j.EASINGMODE_EASEIN}setEasingMode(e){const t=Math.min(Math.max(e,0),2);this._easingMode=t}getEasingMode(){return this._easingMode}easeInCore(e){throw new Error("You must implement this method")}ease(e){switch(this._easingMode){case j.EASINGMODE_EASEIN:return this.easeInCore(e);case j.EASINGMODE_EASEOUT:return 1-this.easeInCore(1-e)}return e>=.5?.5*(1-this.easeInCore(2*(1-e)))+.5:.5*this.easeInCore(2*e)}}j.EASINGMODE_EASEIN=0,j.EASINGMODE_EASEOUT=1,j.EASINGMODE_EASEINOUT=2;class Y extends j{easeInCore(e){return e=Math.max(0,Math.min(1,e)),1-Math.sqrt(1-e*e)}}class q extends j{constructor(e=1){super(),this.amplitude=e}easeInCore(e){const t=Math.max(0,this.amplitude);return Math.pow(e,3)-e*t*Math.sin(3.141592653589793*e)}}class K extends j{constructor(e=3,t=2){super(),this.bounces=e,this.bounciness=t}easeInCore(e){const t=Math.max(0,this.bounces);let i=this.bounciness;i<=1&&(i=1.001);const n=Math.pow(i,t),s=1-i,r=(1-n)/s+.5*n,o=e*r,a=Math.log(-o*(1-i)+1)/Math.log(i),l=Math.floor(a),h=l+1,c=(1-Math.pow(i,l))/(s*r),u=.5*(c+(1-Math.pow(i,h))/(s*r)),d=e-u,p=u-c;return-Math.pow(1/i,t-l)/(p*p)*(d-p)*(d+p)}}class $ extends j{easeInCore(e){return e*e*e}}class Q extends j{constructor(e=3,t=3){super(),this.oscillations=e,this.springiness=t}easeInCore(e){let t;const i=Math.max(0,this.oscillations),n=Math.max(0,this.springiness);return t=0==n?e:(Math.exp(n*e)-1)/(Math.exp(n)-1),t*Math.sin((6.283185307179586*i+1.5707963267948966)*e)}}class Z extends j{constructor(e=2){super(),this.exponent=e}easeInCore(e){return this.exponent<=0?e:(Math.exp(this.exponent*e)-1)/(Math.exp(this.exponent)-1)}}class J extends j{constructor(e=2){super(),this.power=e}easeInCore(e){const t=Math.max(0,this.power);return Math.pow(e,t)}}class ee extends j{easeInCore(e){return e*e}}class te extends j{easeInCore(e){return e*e*e*e}}class ie extends j{easeInCore(e){return e*e*e*e*e}}class ne extends j{easeInCore(e){return 1-Math.sin(1.5707963267948966*(1-e))}}class se extends j{constructor(e=0,t=0,i=1,n=1){super(),this.x1=e,this.y1=t,this.x2=i,this.y2=n}easeInCore(e){return X.hr.Interpolate(e,this.x1,this.y1,this.x2,this.y2)}}var re=i(8117),oe=i(2323),ae=i(4173),le=i(2695);class he{constructor(e){this._path=e,this._onchange=new Array,this.value=0,this.animations=new Array}getPoint(){const e=this._path.getPointAtLengthPosition(this.value);return new o.P(e.x,0,e.y)}moveAhead(e=.002){return this.move(e),this}moveBack(e=.002){return this.move(-e),this}move(e){if(Math.abs(e)>1)throw"step size should be less than 1.";return this.value+=e,this._ensureLimits(),this._raiseOnChange(),this}_ensureLimits(){for(;this.value>1;)this.value-=1;for(;this.value<0;)this.value+=1;return this}_raiseOnChange(){return this._onchange.forEach((e=>e(this))),this}onchange(e){return this._onchange.push(e),this}}var ce=i(1468),ue=i(7814),de=i(7257);class pe{constructor(e){this.SMOOTHING=.75,this.FFT_SIZE=512,this.BARGRAPHAMPLITUDE=256,this.DEBUGCANVASPOS={x:20,y:20},this.DEBUGCANVASSIZE={width:320,height:200},(e=e||A.l.LastCreatedScene)&&(this._scene=e,ue.D.audioEngine?(this._audioEngine=ue.D.audioEngine,this._audioEngine.canUseWebAudio&&this._audioEngine.audioContext&&(this._webAudioAnalyser=this._audioEngine.audioContext.createAnalyser(),this._webAudioAnalyser.minDecibels=-140,this._webAudioAnalyser.maxDecibels=0,this._byteFreqs=new Uint8Array(this._webAudioAnalyser.frequencyBinCount),this._byteTime=new Uint8Array(this._webAudioAnalyser.frequencyBinCount),this._floatFreqs=new Float32Array(this._webAudioAnalyser.frequencyBinCount))):de.w1.Warn("No audio engine initialized, failed to create an audio analyser"))}getFrequencyBinCount(){return this._audioEngine.canUseWebAudio?this._webAudioAnalyser.frequencyBinCount:0}getByteFrequencyData(){return this._audioEngine.canUseWebAudio&&(this._webAudioAnalyser.smoothingTimeConstant=this.SMOOTHING,this._webAudioAnalyser.fftSize=this.FFT_SIZE,this._webAudioAnalyser.getByteFrequencyData(this._byteFreqs)),this._byteFreqs}getByteTimeDomainData(){return this._audioEngine.canUseWebAudio&&(this._webAudioAnalyser.smoothingTimeConstant=this.SMOOTHING,this._webAudioAnalyser.fftSize=this.FFT_SIZE,this._webAudioAnalyser.getByteTimeDomainData(this._byteTime)),this._byteTime}getFloatFrequencyData(){return this._audioEngine.canUseWebAudio&&(this._webAudioAnalyser.smoothingTimeConstant=this.SMOOTHING,this._webAudioAnalyser.fftSize=this.FFT_SIZE,this._webAudioAnalyser.getFloatFrequencyData(this._floatFreqs)),this._floatFreqs}drawDebugCanvas(){if(this._audioEngine.canUseWebAudio&&(this._debugCanvas||(this._debugCanvas=document.createElement("canvas"),this._debugCanvas.width=this.DEBUGCANVASSIZE.width,this._debugCanvas.height=this.DEBUGCANVASSIZE.height,this._debugCanvas.style.position="absolute",this._debugCanvas.style.top=this.DEBUGCANVASPOS.y+"px",this._debugCanvas.style.left=this.DEBUGCANVASPOS.x+"px",this._debugCanvasContext=this._debugCanvas.getContext("2d"),document.body.appendChild(this._debugCanvas),this._registerFunc=()=>{this.drawDebugCanvas()},this._scene.registerBeforeRender(this._registerFunc)),this._registerFunc&&this._debugCanvasContext)){const e=this.getByteFrequencyData();this._debugCanvasContext.fillStyle="rgb(0, 0, 0)",this._debugCanvasContext.fillRect(0,0,this.DEBUGCANVASSIZE.width,this.DEBUGCANVASSIZE.height);for(let t=0;t<this.getFrequencyBinCount();t++){const i=e[t]/this.BARGRAPHAMPLITUDE,n=this.DEBUGCANVASSIZE.height*i,s=this.DEBUGCANVASSIZE.height-n-1,r=this.DEBUGCANVASSIZE.width/this.getFrequencyBinCount(),o=t/this.getFrequencyBinCount()*360;this._debugCanvasContext.fillStyle="hsl("+o+", 100%, 50%)",this._debugCanvasContext.fillRect(t*r,s,r,n)}}}stopDebugCanvas(){this._debugCanvas&&(this._registerFunc&&(this._scene.unregisterBeforeRender(this._registerFunc),this._registerFunc=null),document.body.removeChild(this._debugCanvas),this._debugCanvas=null,this._debugCanvasContext=null)}connectAudioNodes(e,t){this._audioEngine.canUseWebAudio&&(e.connect(this._webAudioAnalyser),this._webAudioAnalyser.connect(t))}dispose(){this._audioEngine.canUseWebAudio&&this._webAudioAnalyser.disconnect()}}var fe=i(6797);ue.D.AudioEngineFactory=(e,t,i)=>new _e(e,t,i);class _e{get audioContext(){return this._audioContextInitialized?this.unlocked||this._muteButton||this._displayMuteButton():this._initializeAudioContext(),this._audioContext}constructor(e=null,t=null,i=null){if(this._audioContext=null,this._audioContextInitialized=!1,this._muteButton=null,this._audioDestination=null,this.canUseWebAudio=!1,this.WarnedWebAudioUnsupported=!1,this.isMP3supported=!1,this.isOGGsupported=!1,this.unlocked=!0,this.useCustomUnlockedButton=!1,this.onAudioUnlockedObservable=new r.y$,this.onAudioLockedObservable=new r.y$,this._tryToRun=!1,this._onResize=()=>{this._moveButtonToTopLeft()},!(0,fe.CG)())return;void 0!==window.AudioContext&&(this.canUseWebAudio=!0);const n=document.createElement("audio");this._hostElement=e,this._audioContext=t,this._audioDestination=i;try{n&&n.canPlayType&&(n.canPlayType('audio/mpeg; codecs="mp3"').replace(/^no$/,"")||n.canPlayType("audio/mp3").replace(/^no$/,""))&&(this.isMP3supported=!0)}catch(e){}try{n&&n.canPlayType&&n.canPlayType('audio/ogg; codecs="vorbis"').replace(/^no$/,"")&&(this.isOGGsupported=!0)}catch(e){}}lock(){this._triggerSuspendedState()}unlock(){this._triggerRunningState()}_resumeAudioContext(){let e;return void 0!==this._audioContext.resume&&(e=this._audioContext.resume()),e||Promise.resolve()}_initializeAudioContext(){try{this.canUseWebAudio&&(this._audioContext||(this._audioContext=new AudioContext),this.masterGain=this._audioContext.createGain(),this.masterGain.gain.value=1,this._audioDestination||(this._audioDestination=this._audioContext.destination),this.masterGain.connect(this._audioDestination),this._audioContextInitialized=!0,"running"===this._audioContext.state&&this._triggerRunningState())}catch(e){this.canUseWebAudio=!1,_.Y.Error("Web Audio: "+e.message)}}_triggerRunningState(){this._tryToRun||(this._tryToRun=!0,this._resumeAudioContext().then((()=>{this._tryToRun=!1,this._muteButton&&this._hideMuteButton(),this.unlocked=!0,this.onAudioUnlockedObservable.notifyObservers(this)})).catch((()=>{this._tryToRun=!1,this.unlocked=!1})))}_triggerSuspendedState(){this.unlocked=!1,this.onAudioLockedObservable.notifyObservers(this),this._displayMuteButton()}_displayMuteButton(){if(this.useCustomUnlockedButton||this._muteButton)return;this._muteButton=document.createElement("BUTTON"),this._muteButton.className="babylonUnmuteIcon",this._muteButton.id="babylonUnmuteIconBtn",this._muteButton.title="Unmute";const e=".babylonUnmuteIcon { position: absolute; left: 20px; top: 20px; height: 40px; width: 60px; background-color: rgba(51,51,51,0.7); background-image: url("+(window.SVGSVGElement?"data:image/svg+xml;charset=UTF-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2239%22%20height%3D%2232%22%20viewBox%3D%220%200%2039%2032%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M9.625%2018.938l-0.031%200.016h-4.953q-0.016%200-0.031-0.016v-12.453q0-0.016%200.031-0.016h4.953q0.031%200%200.031%200.016v12.453zM12.125%207.688l8.719-8.703v27.453l-8.719-8.719-0.016-0.047v-9.938zM23.359%207.875l1.406-1.406%204.219%204.203%204.203-4.203%201.422%201.406-4.219%204.219%204.219%204.203-1.484%201.359-4.141-4.156-4.219%204.219-1.406-1.422%204.219-4.203z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E":"https://cdn.babylonjs.com/Assets/audio.png")+");  background-size: 80%; background-repeat:no-repeat; background-position: center; background-position-y: 4px; border: none; outline: none; transition: transform 0.125s ease-out; cursor: pointer; z-index: 9999; } .babylonUnmuteIcon:hover { transform: scale(1.05) } .babylonUnmuteIcon:active { background-color: rgba(51,51,51,1) }",t=document.createElement("style");t.appendChild(document.createTextNode(e)),document.getElementsByTagName("head")[0].appendChild(t),document.body.appendChild(this._muteButton),this._moveButtonToTopLeft(),this._muteButton.addEventListener("touchend",(()=>{this._triggerRunningState()}),!0),this._muteButton.addEventListener("click",(()=>{this._triggerRunningState()}),!0),window.addEventListener("resize",this._onResize)}_moveButtonToTopLeft(){this._hostElement&&this._muteButton&&(this._muteButton.style.top=this._hostElement.offsetTop+20+"px",this._muteButton.style.left=this._hostElement.offsetLeft+20+"px")}_hideMuteButton(){this._muteButton&&(document.body.removeChild(this._muteButton),this._muteButton=null)}dispose(){this.canUseWebAudio&&this._audioContextInitialized&&(this._connectedAnalyser&&this._audioContext&&(this._connectedAnalyser.stopDebugCanvas(),this._connectedAnalyser.dispose(),this.masterGain.disconnect(),this.masterGain.connect(this._audioContext.destination),this._connectedAnalyser=null),this.masterGain.gain.value=1),this.WarnedWebAudioUnsupported=!1,this._hideMuteButton(),window.removeEventListener("resize",this._onResize),this.onAudioUnlockedObservable.clear(),this.onAudioLockedObservable.clear()}getGlobalVolume(){return this.canUseWebAudio&&this._audioContextInitialized?this.masterGain.gain.value:-1}setGlobalVolume(e){this.canUseWebAudio&&this._audioContextInitialized&&(this.masterGain.gain.value=e)}connectToAnalyser(e){this._connectedAnalyser&&this._connectedAnalyser.stopDebugCanvas(),this.canUseWebAudio&&this._audioContextInitialized&&this._audioContext&&(this._connectedAnalyser=e,this.masterGain.disconnect(),this._connectedAnalyser.connectAudioNodes(this.masterGain,this._audioContext.destination))}}var me=i(3642);class ge{constructor(e,t={}){this.id=-1,this._isInitialized=!1,(e=e||A.l.LastCreatedScene)&&(this._scene=e,this.soundCollection=new Array,this._options=t,!this._options.mainTrack&&this._scene.soundTracks&&(this._scene.soundTracks.push(this),this.id=this._scene.soundTracks.length-1))}_initializeSoundTrackAudioGraph(){var e;(null===(e=ue.D.audioEngine)||void 0===e?void 0:e.canUseWebAudio)&&ue.D.audioEngine.audioContext&&(this._outputAudioNode=ue.D.audioEngine.audioContext.createGain(),this._outputAudioNode.connect(ue.D.audioEngine.masterGain),this._options&&this._options.volume&&(this._outputAudioNode.gain.value=this._options.volume),this._isInitialized=!0)}dispose(){if(ue.D.audioEngine&&ue.D.audioEngine.canUseWebAudio){for(this._connectedAnalyser&&this._connectedAnalyser.stopDebugCanvas();this.soundCollection.length;)this.soundCollection[0].dispose();this._outputAudioNode&&this._outputAudioNode.disconnect(),this._outputAudioNode=null}}addSound(e){var t;this._isInitialized||this._initializeSoundTrackAudioGraph(),(null===(t=ue.D.audioEngine)||void 0===t?void 0:t.canUseWebAudio)&&this._outputAudioNode&&e.connectToSoundTrackAudioNode(this._outputAudioNode),e.soundTrackId&&(-1===e.soundTrackId?this._scene.mainSoundTrack.removeSound(e):this._scene.soundTracks&&this._scene.soundTracks[e.soundTrackId].removeSound(e)),this.soundCollection.push(e),e.soundTrackId=this.id}removeSound(e){const t=this.soundCollection.indexOf(e);-1!==t&&this.soundCollection.splice(t,1)}setVolume(e){var t;(null===(t=ue.D.audioEngine)||void 0===t?void 0:t.canUseWebAudio)&&this._outputAudioNode&&(this._outputAudioNode.gain.value=e)}switchPanningModelToHRTF(){var e;if(null===(e=ue.D.audioEngine)||void 0===e?void 0:e.canUseWebAudio)for(let e=0;e<this.soundCollection.length;e++)this.soundCollection[e].switchPanningModelToHRTF()}switchPanningModelToEqualPower(){var e;if(null===(e=ue.D.audioEngine)||void 0===e?void 0:e.canUseWebAudio)for(let e=0;e<this.soundCollection.length;e++)this.soundCollection[e].switchPanningModelToEqualPower()}connectToAnalyser(e){var t;this._connectedAnalyser&&this._connectedAnalyser.stopDebugCanvas(),this._connectedAnalyser=e,(null===(t=ue.D.audioEngine)||void 0===t?void 0:t.canUseWebAudio)&&this._outputAudioNode&&(this._outputAudioNode.disconnect(),this._connectedAnalyser.connectAudioNodes(this._outputAudioNode,ue.D.audioEngine.masterGain))}}var ve=i(2333);n.p.AddParser(ve.l.NAME_AUDIO,((e,t,i,n)=>{var s;let r,o=[];if(i.sounds=i.sounds||[],void 0!==e.sounds&&null!==e.sounds)for(let a=0,l=e.sounds.length;a<l;a++){const l=e.sounds[a];(null===(s=ue.D.audioEngine)||void 0===s?void 0:s.canUseWebAudio)?(l.url||(l.url=l.name),o[l.url]?i.sounds.push(me.$.Parse(l,t,n,o[l.url])):(r=me.$.Parse(l,t,n),o[l.url]=r,i.sounds.push(r))):i.sounds.push(new me.$(l.name,null,t))}o=[]})),Object.defineProperty(k.x.prototype,"mainSoundTrack",{get:function(){let e=this._getComponent(ve.l.NAME_AUDIO);return e||(e=new ye(this),this._addComponent(e)),this._mainSoundTrack||(this._mainSoundTrack=new ge(this,{mainTrack:!0})),this._mainSoundTrack},enumerable:!0,configurable:!0}),k.x.prototype.getSoundByName=function(e){let t;for(t=0;t<this.mainSoundTrack.soundCollection.length;t++)if(this.mainSoundTrack.soundCollection[t].name===e)return this.mainSoundTrack.soundCollection[t];if(this.soundTracks)for(let i=0;i<this.soundTracks.length;i++)for(t=0;t<this.soundTracks[i].soundCollection.length;t++)if(this.soundTracks[i].soundCollection[t].name===e)return this.soundTracks[i].soundCollection[t];return null},Object.defineProperty(k.x.prototype,"audioEnabled",{get:function(){let e=this._getComponent(ve.l.NAME_AUDIO);return e||(e=new ye(this),this._addComponent(e)),e.audioEnabled},set:function(e){let t=this._getComponent(ve.l.NAME_AUDIO);t||(t=new ye(this),this._addComponent(t)),e?t.enableAudio():t.disableAudio()},enumerable:!0,configurable:!0}),Object.defineProperty(k.x.prototype,"headphone",{get:function(){let e=this._getComponent(ve.l.NAME_AUDIO);return e||(e=new ye(this),this._addComponent(e)),e.headphone},set:function(e){let t=this._getComponent(ve.l.NAME_AUDIO);t||(t=new ye(this),this._addComponent(t)),e?t.switchAudioModeForHeadphones():t.switchAudioModeForNormalSpeakers()},enumerable:!0,configurable:!0}),Object.defineProperty(k.x.prototype,"audioListenerPositionProvider",{get:function(){let e=this._getComponent(ve.l.NAME_AUDIO);return e||(e=new ye(this),this._addComponent(e)),e.audioListenerPositionProvider},set:function(e){let t=this._getComponent(ve.l.NAME_AUDIO);if(t||(t=new ye(this),this._addComponent(t)),"function"!=typeof e)throw new Error("The value passed to [Scene.audioListenerPositionProvider] must be a function that returns a Vector3");t.audioListenerPositionProvider=e},enumerable:!0,configurable:!0}),Object.defineProperty(k.x.prototype,"audioListenerRotationProvider",{get:function(){let e=this._getComponent(ve.l.NAME_AUDIO);return e||(e=new ye(this),this._addComponent(e)),e.audioListenerRotationProvider},set:function(e){let t=this._getComponent(ve.l.NAME_AUDIO);if(t||(t=new ye(this),this._addComponent(t)),"function"!=typeof e)throw new Error("The value passed to [Scene.audioListenerRotationProvider] must be a function that returns a Vector3");t.audioListenerRotationProvider=e},enumerable:!0,configurable:!0}),Object.defineProperty(k.x.prototype,"audioPositioningRefreshRate",{get:function(){let e=this._getComponent(ve.l.NAME_AUDIO);return e||(e=new ye(this),this._addComponent(e)),e.audioPositioningRefreshRate},set:function(e){let t=this._getComponent(ve.l.NAME_AUDIO);t||(t=new ye(this),this._addComponent(t)),t.audioPositioningRefreshRate=e},enumerable:!0,configurable:!0});class ye{get audioEnabled(){return this._audioEnabled}get headphone(){return this._headphone}constructor(e){this.name=ve.l.NAME_AUDIO,this._audioEnabled=!0,this._headphone=!1,this.audioPositioningRefreshRate=500,this.audioListenerPositionProvider=null,this.audioListenerRotationProvider=null,this._cachedCameraDirection=new o.P,this._cachedCameraPosition=new o.P,this._lastCheck=0,this._invertMatrixTemp=new o.y3,this._cameraDirectionTemp=new o.P,(e=e||A.l.LastCreatedScene)&&(this.scene=e,e.soundTracks=new Array,e.sounds=new Array)}register(){this.scene._afterRenderStage.registerStep(ve.l.STEP_AFTERRENDER_AUDIO,this,this._afterRender)}rebuild(){}serialize(e){if(e.sounds=[],this.scene.soundTracks)for(let t=0;t<this.scene.soundTracks.length;t++){const i=this.scene.soundTracks[t];for(let t=0;t<i.soundCollection.length;t++)e.sounds.push(i.soundCollection[t].serialize())}}addFromContainer(e){e.sounds&&e.sounds.forEach((e=>{e.play(),e.autoplay=!0,this.scene.mainSoundTrack.addSound(e)}))}removeFromContainer(e,t=!1){e.sounds&&e.sounds.forEach((e=>{e.stop(),e.autoplay=!1,this.scene.mainSoundTrack.removeSound(e),t&&e.dispose()}))}dispose(){const e=this.scene;if(e._mainSoundTrack&&e.mainSoundTrack.dispose(),e.soundTracks)for(let t=0;t<e.soundTracks.length;t++)e.soundTracks[t].dispose()}disableAudio(){const e=this.scene;let t;for(this._audioEnabled=!1,ue.D.audioEngine&&ue.D.audioEngine.audioContext&&ue.D.audioEngine.audioContext.suspend(),t=0;t<e.mainSoundTrack.soundCollection.length;t++)e.mainSoundTrack.soundCollection[t].pause();if(e.soundTracks)for(t=0;t<e.soundTracks.length;t++)for(let i=0;i<e.soundTracks[t].soundCollection.length;i++)e.soundTracks[t].soundCollection[i].pause()}enableAudio(){const e=this.scene;let t;for(this._audioEnabled=!0,ue.D.audioEngine&&ue.D.audioEngine.audioContext&&ue.D.audioEngine.audioContext.resume(),t=0;t<e.mainSoundTrack.soundCollection.length;t++)e.mainSoundTrack.soundCollection[t].isPaused&&e.mainSoundTrack.soundCollection[t].play();if(e.soundTracks)for(t=0;t<e.soundTracks.length;t++)for(let i=0;i<e.soundTracks[t].soundCollection.length;i++)e.soundTracks[t].soundCollection[i].isPaused&&e.soundTracks[t].soundCollection[i].play()}switchAudioModeForHeadphones(){const e=this.scene;if(this._headphone=!0,e.mainSoundTrack.switchPanningModelToHRTF(),e.soundTracks)for(let t=0;t<e.soundTracks.length;t++)e.soundTracks[t].switchPanningModelToHRTF()}switchAudioModeForNormalSpeakers(){const e=this.scene;if(this._headphone=!1,e.mainSoundTrack.switchPanningModelToEqualPower(),e.soundTracks)for(let t=0;t<e.soundTracks.length;t++)e.soundTracks[t].switchPanningModelToEqualPower()}_afterRender(){const e=G.F.Now;if(this._lastCheck&&e-this._lastCheck<this.audioPositioningRefreshRate)return;this._lastCheck=e;const t=this.scene;if(!this._audioEnabled||!t._mainSoundTrack||!t.soundTracks||0===t._mainSoundTrack.soundCollection.length&&1===t.soundTracks.length)return;const i=ue.D.audioEngine;if(i&&i.audioContext){let e,n=t.activeCamera;if(t.activeCameras&&t.activeCameras.length>0&&(n=t.activeCameras[0]),this.audioListenerPositionProvider){const e=this.audioListenerPositionProvider();i.audioContext.listener.setPosition(e.x||0,e.y||0,e.z||0)}else n?this._cachedCameraPosition.equals(n.globalPosition)||(this._cachedCameraPosition.copyFrom(n.globalPosition),i.audioContext.listener.setPosition(n.globalPosition.x,n.globalPosition.y,n.globalPosition.z)):i.audioContext.listener.setPosition(0,0,0);if(this.audioListenerRotationProvider){const e=this.audioListenerRotationProvider();i.audioContext.listener.setOrientation(e.x||0,e.y||0,e.z||0,0,1,0)}else n?(n.rigCameras&&n.rigCameras.length>0&&(n=n.rigCameras[0]),n.getViewMatrix().invertToRef(this._invertMatrixTemp),o.P.TransformNormalToRef(ye._CameraDirection,this._invertMatrixTemp,this._cameraDirectionTemp),this._cameraDirectionTemp.normalize(),isNaN(this._cameraDirectionTemp.x)||isNaN(this._cameraDirectionTemp.y)||isNaN(this._cameraDirectionTemp.z)||this._cachedCameraDirection.equals(this._cameraDirectionTemp)||(this._cachedCameraDirection.copyFrom(this._cameraDirectionTemp),i.audioContext.listener.setOrientation(this._cameraDirectionTemp.x,this._cameraDirectionTemp.y,this._cameraDirectionTemp.z,0,1,0))):i.audioContext.listener.setOrientation(0,0,0,0,1,0);for(e=0;e<t.mainSoundTrack.soundCollection.length;e++){const i=t.mainSoundTrack.soundCollection[e];i.useCustomAttenuation&&i.updateDistanceFromListener()}if(t.soundTracks)for(e=0;e<t.soundTracks.length;e++)for(let i=0;i<t.soundTracks[e].soundCollection.length;i++){const n=t.soundTracks[e].soundCollection[i];n.useCustomAttenuation&&n.updateDistanceFromListener()}}}}ye._CameraDirection=new o.P(0,0,-1),me.$._SceneComponentInitialization=e=>{let t=e._getComponent(ve.l.NAME_AUDIO);t||(t=new ye(e),e._addComponent(t))};var xe=i(710),be=i(9472),Te=i(3956);class Se{constructor(e){this._texture=null,this._isEnabled=!0,this.isEnabled=!0,this.time=0,(e=e||A.l.LastCreatedScene)&&(this._scene=e,this.animationParameters=new o.Lt(0,0,0,30))}_markSubMeshesAsAttributesDirty(){for(const e of this._scene.meshes)e.bakedVertexAnimationManager===this&&e._markSubMeshesAsAttributesDirty()}bind(e,t=!1){if(!this._texture||!this._isEnabled)return;const i=this._texture.getSize();e.setFloat2("bakedVertexAnimationTextureSizeInverted",1/i.width,1/i.height),e.setFloat("bakedVertexAnimationTime",this.time),t||e.setVector4("bakedVertexAnimationSettings",this.animationParameters),e.setTexture("bakedVertexAnimationTexture",this._texture)}clone(){const e=new Se(this._scene);return this.copyTo(e),e}setAnimationParameters(e,t,i=0,n=30){this.animationParameters=new o.Lt(e,t,i,n)}dispose(e){var t;e&&(null===(t=this._texture)||void 0===t||t.dispose())}getClassName(){return"BakedVertexAnimationManager"}copyTo(e){Te.p4.Clone((()=>e),this)}serialize(){return Te.p4.Serialize(this)}parse(e,t,i){Te.p4.Parse((()=>this),e,t,i)}}(0,be.gn)([(0,Te.oU)(),(0,Te.wz)("_markSubMeshesAsAttributesDirty")],Se.prototype,"texture",void 0),(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markSubMeshesAsAttributesDirty")],Se.prototype,"isEnabled",void 0),(0,be.gn)([(0,Te.qC)()],Se.prototype,"animationParameters",void 0),(0,be.gn)([(0,Te.qC)()],Se.prototype,"time",void 0);var Ee=i(7647),Ce=i(2262),Ae=i(2655);class Pe{constructor(e,t){this._scene=e,this._mesh=t}async bakeVertexData(e){if(!this._mesh.skeleton)throw new Error("No skeleton in this mesh.");const t=this._mesh.skeleton.bones.length,i=e.reduce(((e,t)=>e+t.to-t.from+1),0);if(isNaN(i))throw new Error("Invalid animation ranges.");let n=0;const s=new Float32Array(4*(t+1)*4*i);this._scene.stopAnimation(this._mesh),this._mesh.skeleton.returnToRest();for(const t of e)for(let e=t.from;e<=t.to;e++)await this._executeAnimationFrame(s,e,n++);return s}async _executeAnimationFrame(e,t,i){return new Promise(((n,s)=>{this._scene.beginAnimation(this._mesh.skeleton,t,t,!1,1,(()=>{const t=this._mesh.skeleton.getTransformMatrices(this._mesh);e.set(t,i*t.length),n()}))}))}textureFromBakedVertexData(e){if(!this._mesh.skeleton)throw new Error("No skeleton in this mesh.");const t=this._mesh.skeleton.bones.length,i=Ee.l.CreateRGBATexture(e,4*(t+1),e.length/(4*(t+1)*4),this._scene,!1,!1,Ce.x.NEAREST_NEAREST,1);return i.name="VAT"+this._mesh.skeleton.name,i}serializeBakedVertexDataToObject(e){if(!this._mesh.skeleton)throw new Error("No skeleton in this mesh.");const t=this._mesh.skeleton.bones.length,i=4*(t+1),n=e.length/(4*(t+1)*4);return{vertexData:(0,Ae.Gh)(e),width:i,height:n}}loadBakedVertexDataFromObject(e){return new Float32Array((0,Ae.HQ)(e.vertexData))}serializeBakedVertexDataToJSON(e){return JSON.stringify(this.serializeBakedVertexDataToObject(e))}loadBakedVertexDataFromJSON(e){return this.loadBakedVertexDataFromObject(JSON.parse(e))}}var Re=i(1903),Me=i(1341);class Ie{constructor(){this._zoomStopsAnimation=!1,this._idleRotationSpeed=.05,this._idleRotationWaitTime=2e3,this._idleRotationSpinupTime=2e3,this.targetAlpha=null,this._isPointerDown=!1,this._lastFrameTime=null,this._lastInteractionTime=-1/0,this._cameraRotationSpeed=0,this._lastFrameRadius=0}get name(){return"AutoRotation"}set zoomStopsAnimation(e){this._zoomStopsAnimation=e}get zoomStopsAnimation(){return this._zoomStopsAnimation}set idleRotationSpeed(e){this._idleRotationSpeed=e}get idleRotationSpeed(){return this._idleRotationSpeed}set idleRotationWaitTime(e){this._idleRotationWaitTime=e}get idleRotationWaitTime(){return this._idleRotationWaitTime}set idleRotationSpinupTime(e){this._idleRotationSpinupTime=e}get idleRotationSpinupTime(){return this._idleRotationSpinupTime}get rotationInProgress(){return Math.abs(this._cameraRotationSpeed)>0}init(){}attach(e){this._attachedCamera=e;const t=this._attachedCamera.getScene();this._onPrePointerObservableObserver=t.onPrePointerObservable.add((e=>{e.type!==Re.kD.POINTERDOWN?e.type===Re.kD.POINTERUP&&(this._isPointerDown=!1):this._isPointerDown=!0})),this._onAfterCheckInputsObserver=e.onAfterCheckInputsObservable.add((()=>{if(this._reachTargetAlpha())return;const e=G.F.Now;let t=0;null!=this._lastFrameTime&&(t=e-this._lastFrameTime),this._lastFrameTime=e,this._applyUserInteraction();const i=e-this._lastInteractionTime-this._idleRotationWaitTime,n=Math.max(Math.min(i/this._idleRotationSpinupTime,1),0);this._cameraRotationSpeed=this._idleRotationSpeed*n,this._attachedCamera&&(this._attachedCamera.alpha-=this._cameraRotationSpeed*(t/1e3))}))}detach(){if(!this._attachedCamera)return;const e=this._attachedCamera.getScene();this._onPrePointerObservableObserver&&e.onPrePointerObservable.remove(this._onPrePointerObservableObserver),this._attachedCamera.onAfterCheckInputsObservable.remove(this._onAfterCheckInputsObserver),this._attachedCamera=null}resetLastInteractionTime(e){this._lastInteractionTime=null!=e?e:G.F.Now}_reachTargetAlpha(){return!(!this._attachedCamera||!this.targetAlpha)&&Math.abs(this._attachedCamera.alpha-this.targetAlpha)<Me.kn}_userIsZooming(){return!!this._attachedCamera&&0!==this._attachedCamera.inertialRadiusOffset}_shouldAnimationStopForInteraction(){if(!this._attachedCamera)return!1;let e=!1;return this._lastFrameRadius===this._attachedCamera.radius&&0!==this._attachedCamera.inertialRadiusOffset&&(e=!0),this._lastFrameRadius=this._attachedCamera.radius,this._zoomStopsAnimation?e:this._userIsZooming()}_applyUserInteraction(){this._userIsMoving()&&!this._shouldAnimationStopForInteraction()&&(this._lastInteractionTime=G.F.Now)}_userIsMoving(){return!!this._attachedCamera&&(0!==this._attachedCamera.inertialAlphaOffset||0!==this._attachedCamera.inertialBetaOffset||0!==this._attachedCamera.inertialRadiusOffset||0!==this._attachedCamera.inertialPanningX||0!==this._attachedCamera.inertialPanningY||this._isPointerDown)}}class De{constructor(){this.transitionDuration=450,this.lowerRadiusTransitionRange=2,this.upperRadiusTransitionRange=-2,this._autoTransitionRange=!1,this._radiusIsAnimating=!1,this._radiusBounceTransition=null,this._animatables=new Array}get name(){return"Bouncing"}get autoTransitionRange(){return this._autoTransitionRange}set autoTransitionRange(e){if(this._autoTransitionRange===e)return;this._autoTransitionRange=e;const t=this._attachedCamera;t&&(e?this._onMeshTargetChangedObserver=t.onMeshTargetChangedObservable.add((e=>{if(!e)return;e.computeWorldMatrix(!0);const t=e.getBoundingInfo().diagonalLength;this.lowerRadiusTransitionRange=.05*t,this.upperRadiusTransitionRange=.05*t})):this._onMeshTargetChangedObserver&&t.onMeshTargetChangedObservable.remove(this._onMeshTargetChangedObserver))}init(){}attach(e){this._attachedCamera=e,this._onAfterCheckInputsObserver=e.onAfterCheckInputsObservable.add((()=>{this._attachedCamera&&(this._isRadiusAtLimit(this._attachedCamera.lowerRadiusLimit)&&this._applyBoundRadiusAnimation(this.lowerRadiusTransitionRange),this._isRadiusAtLimit(this._attachedCamera.upperRadiusLimit)&&this._applyBoundRadiusAnimation(this.upperRadiusTransitionRange))}))}detach(){this._attachedCamera&&(this._onAfterCheckInputsObserver&&this._attachedCamera.onAfterCheckInputsObservable.remove(this._onAfterCheckInputsObserver),this._onMeshTargetChangedObserver&&this._attachedCamera.onMeshTargetChangedObservable.remove(this._onMeshTargetChangedObserver),this._attachedCamera=null)}_isRadiusAtLimit(e){return!!this._attachedCamera&&this._attachedCamera.radius===e&&!this._radiusIsAnimating}_applyBoundRadiusAnimation(e){if(!this._attachedCamera)return;this._radiusBounceTransition||(De.EasingFunction.setEasingMode(De.EasingMode),this._radiusBounceTransition=D.f.CreateAnimation("radius",D.f.ANIMATIONTYPE_FLOAT,60,De.EasingFunction)),this._cachedWheelPrecision=this._attachedCamera.wheelPrecision,this._attachedCamera.wheelPrecision=1/0,this._attachedCamera.inertialRadiusOffset=0,this.stopAllAnimations(),this._radiusIsAnimating=!0;const t=D.f.TransitionTo("radius",this._attachedCamera.radius+e,this._attachedCamera,this._attachedCamera.getScene(),60,this._radiusBounceTransition,this.transitionDuration,(()=>this._clearAnimationLocks()));t&&this._animatables.push(t)}_clearAnimationLocks(){this._radiusIsAnimating=!1,this._attachedCamera&&(this._attachedCamera.wheelPrecision=this._cachedWheelPrecision)}stopAllAnimations(){for(this._attachedCamera&&(this._attachedCamera.animations=[]);this._animatables.length;)this._animatables[0].onAnimationEnd=null,this._animatables[0].stop(),this._animatables.shift()}}De.EasingFunction=new q(.3),De.EasingMode=j.EASINGMODE_EASEOUT;class Oe{constructor(){this.onTargetFramingAnimationEndObservable=new r.y$,this._mode=Oe.FitFrustumSidesMode,this._radiusScale=1,this._positionScale=.5,this._defaultElevation=.3,this._elevationReturnTime=1500,this._elevationReturnWaitTime=1e3,this._zoomStopsAnimation=!1,this._framingTime=1500,this.autoCorrectCameraLimitsAndSensibility=!0,this._isPointerDown=!1,this._lastInteractionTime=-1/0,this._animatables=new Array,this._betaIsAnimating=!1}get name(){return"Framing"}set mode(e){this._mode=e}get mode(){return this._mode}set radiusScale(e){this._radiusScale=e}get radiusScale(){return this._radiusScale}set positionScale(e){this._positionScale=e}get positionScale(){return this._positionScale}set defaultElevation(e){this._defaultElevation=e}get defaultElevation(){return this._defaultElevation}set elevationReturnTime(e){this._elevationReturnTime=e}get elevationReturnTime(){return this._elevationReturnTime}set elevationReturnWaitTime(e){this._elevationReturnWaitTime=e}get elevationReturnWaitTime(){return this._elevationReturnWaitTime}set zoomStopsAnimation(e){this._zoomStopsAnimation=e}get zoomStopsAnimation(){return this._zoomStopsAnimation}set framingTime(e){this._framingTime=e}get framingTime(){return this._framingTime}init(){}attach(e){this._attachedCamera=e;const t=this._attachedCamera.getScene();Oe.EasingFunction.setEasingMode(Oe.EasingMode),this._onPrePointerObservableObserver=t.onPrePointerObservable.add((e=>{e.type!==Re.kD.POINTERDOWN?e.type===Re.kD.POINTERUP&&(this._isPointerDown=!1):this._isPointerDown=!0})),this._onMeshTargetChangedObserver=e.onMeshTargetChangedObservable.add((e=>{e&&this.zoomOnMesh(e,void 0,(()=>{this.onTargetFramingAnimationEndObservable.notifyObservers()}))})),this._onAfterCheckInputsObserver=e.onAfterCheckInputsObservable.add((()=>{this._applyUserInteraction(),this._maintainCameraAboveGround()}))}detach(){if(!this._attachedCamera)return;const e=this._attachedCamera.getScene();this._onPrePointerObservableObserver&&e.onPrePointerObservable.remove(this._onPrePointerObservableObserver),this._onAfterCheckInputsObserver&&this._attachedCamera.onAfterCheckInputsObservable.remove(this._onAfterCheckInputsObserver),this._onMeshTargetChangedObserver&&this._attachedCamera.onMeshTargetChangedObservable.remove(this._onMeshTargetChangedObserver),this._attachedCamera=null}zoomOnMesh(e,t=!1,i=null){e.computeWorldMatrix(!0);const n=e.getBoundingInfo().boundingBox;this.zoomOnBoundingInfo(n.minimumWorld,n.maximumWorld,t,i)}zoomOnMeshHierarchy(e,t=!1,i=null){e.computeWorldMatrix(!0);const n=e.getHierarchyBoundingVectors(!0);this.zoomOnBoundingInfo(n.min,n.max,t,i)}zoomOnMeshesHierarchy(e,t=!1,i=null){const n=new o.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),s=new o.P(-Number.MAX_VALUE,-Number.MAX_VALUE,-Number.MAX_VALUE);for(let t=0;t<e.length;t++){const i=e[t].getHierarchyBoundingVectors(!0);o.P.CheckExtends(i.min,n,s),o.P.CheckExtends(i.max,n,s)}this.zoomOnBoundingInfo(n,s,t,i)}zoomOnBoundingInfo(e,t,i=!1,n=null){let s;if(!this._attachedCamera)return;const r=e.y,a=r+(t.y-r)*this._positionScale,l=t.subtract(e).scale(.5);if(i)s=new o.P(0,a,0);else{const t=e.add(l);s=new o.P(t.x,a,t.z)}this._vectorTransition||(this._vectorTransition=D.f.CreateAnimation("target",D.f.ANIMATIONTYPE_VECTOR3,60,Oe.EasingFunction)),this._betaIsAnimating=!0;let h=D.f.TransitionTo("target",s,this._attachedCamera,this._attachedCamera.getScene(),60,this._vectorTransition,this._framingTime);h&&this._animatables.push(h);let c=0;if(this._mode===Oe.FitFrustumSidesMode){const i=this._calculateLowerRadiusFromModelBoundingSphere(e,t);this.autoCorrectCameraLimitsAndSensibility&&(this._attachedCamera.lowerRadiusLimit=l.length()+this._attachedCamera.minZ),c=i}else this._mode===Oe.IgnoreBoundsSizeMode&&(c=this._calculateLowerRadiusFromModelBoundingSphere(e,t),this.autoCorrectCameraLimitsAndSensibility&&null===this._attachedCamera.lowerRadiusLimit&&(this._attachedCamera.lowerRadiusLimit=this._attachedCamera.minZ));if(this.autoCorrectCameraLimitsAndSensibility){const i=t.subtract(e).length();this._attachedCamera.panningSensibility=5e3/i,this._attachedCamera.wheelPrecision=100/c}this._radiusTransition||(this._radiusTransition=D.f.CreateAnimation("radius",D.f.ANIMATIONTYPE_FLOAT,60,Oe.EasingFunction)),h=D.f.TransitionTo("radius",c,this._attachedCamera,this._attachedCamera.getScene(),60,this._radiusTransition,this._framingTime,(()=>{this.stopAllAnimations(),n&&n(),this._attachedCamera&&this._attachedCamera.useInputToRestoreState&&this._attachedCamera.storeState()})),h&&this._animatables.push(h)}_calculateLowerRadiusFromModelBoundingSphere(e,t){const i=t.subtract(e).length(),n=this._getFrustumSlope(),s=.5*i*this._radiusScale,r=s*Math.sqrt(1+1/(n.x*n.x)),o=s*Math.sqrt(1+1/(n.y*n.y));let a=Math.max(r,o);const l=this._attachedCamera;return l?(l.lowerRadiusLimit&&this._mode===Oe.IgnoreBoundsSizeMode&&(a=a<l.lowerRadiusLimit?l.lowerRadiusLimit:a),l.upperRadiusLimit&&(a=a>l.upperRadiusLimit?l.upperRadiusLimit:a),a):0}_maintainCameraAboveGround(){if(this._elevationReturnTime<0)return;const e=G.F.Now-this._lastInteractionTime,t=.5*Math.PI-this._defaultElevation,i=.5*Math.PI;if(this._attachedCamera&&!this._betaIsAnimating&&this._attachedCamera.beta>i&&e>=this._elevationReturnWaitTime){this._betaIsAnimating=!0,this.stopAllAnimations(),this._betaTransition||(this._betaTransition=D.f.CreateAnimation("beta",D.f.ANIMATIONTYPE_FLOAT,60,Oe.EasingFunction));const e=D.f.TransitionTo("beta",t,this._attachedCamera,this._attachedCamera.getScene(),60,this._betaTransition,this._elevationReturnTime,(()=>{this._clearAnimationLocks(),this.stopAllAnimations()}));e&&this._animatables.push(e)}}_getFrustumSlope(){const e=this._attachedCamera;if(!e)return o.FM.Zero();const t=e.getScene().getEngine().getAspectRatio(e),i=Math.tan(e.fov/2),n=i*t;return new o.FM(n,i)}_clearAnimationLocks(){this._betaIsAnimating=!1}_applyUserInteraction(){this.isUserIsMoving&&(this._lastInteractionTime=G.F.Now,this.stopAllAnimations(),this._clearAnimationLocks())}stopAllAnimations(){for(this._attachedCamera&&(this._attachedCamera.animations=[]);this._animatables.length;)this._animatables[0]&&(this._animatables[0].onAnimationEnd=null,this._animatables[0].stop()),this._animatables.shift()}get isUserIsMoving(){return!!this._attachedCamera&&(0!==this._attachedCamera.inertialAlphaOffset||0!==this._attachedCamera.inertialBetaOffset||0!==this._attachedCamera.inertialRadiusOffset||0!==this._attachedCamera.inertialPanningX||0!==this._attachedCamera.inertialPanningY||this._isPointerDown)}}Oe.EasingFunction=new Z,Oe.EasingMode=j.EASINGMODE_EASEINOUT,Oe.IgnoreBoundsSizeMode=0,Oe.FitFrustumSidesMode=1;class we{constructor(e,t=new o.P,i=0,n=!1){this.direction=e,this.rotatedDirection=t,this.diff=i,this.ignore=n}}class Ne{constructor(e){this._ui=e,this.name="AttachToBoxBehavior",this.distanceAwayFromFace=.15,this.distanceAwayFromBottomOfFace=.15,this._faceVectors=[new we(o.P.Up()),new we(o.P.Down()),new we(o.P.Left()),new we(o.P.Right()),new we(o.P.Forward()),new we(o.P.Forward().scaleInPlace(-1))],this._tmpMatrix=new o.y3,this._tmpVector=new o.P,this._zeroVector=o.P.Zero(),this._lookAtTmpMatrix=new o.y3}init(){}_closestFace(e){return this._faceVectors.forEach((t=>{this._target.rotationQuaternion||(this._target.rotationQuaternion=o._f.RotationYawPitchRoll(this._target.rotation.y,this._target.rotation.x,this._target.rotation.z)),this._target.rotationQuaternion.toRotationMatrix(this._tmpMatrix),o.P.TransformCoordinatesToRef(t.direction,this._tmpMatrix,t.rotatedDirection),t.diff=o.P.GetAngleBetweenVectors(t.rotatedDirection,e,o.P.Cross(t.rotatedDirection,e))})),this._faceVectors.reduce(((e,t)=>e.ignore?t:t.ignore||e.diff<t.diff?e:t),this._faceVectors[0])}_lookAtToRef(e,t=new o.P(0,1,0),i){o.y3.LookAtLHToRef(this._zeroVector,e,t,this._lookAtTmpMatrix),this._lookAtTmpMatrix.invert(),o._f.FromRotationMatrixToRef(this._lookAtTmpMatrix,i)}attach(e){this._target=e,this._scene=this._target.getScene(),this._onRenderObserver=this._scene.onBeforeRenderObservable.add((()=>{if(!this._scene.activeCamera)return;let t=this._scene.activeCamera.position;this._scene.activeCamera.devicePosition&&(t=this._scene.activeCamera.devicePosition);const i=this._closestFace(t.subtract(e.position));this._scene.activeCamera.leftCamera?this._scene.activeCamera.leftCamera.computeWorldMatrix().getRotationMatrixToRef(this._tmpMatrix):this._scene.activeCamera.computeWorldMatrix().getRotationMatrixToRef(this._tmpMatrix),o.P.TransformCoordinatesToRef(o.P.Up(),this._tmpMatrix,this._tmpVector),this._faceVectors.forEach((e=>{i.direction.x&&e.direction.x&&(e.ignore=!0),i.direction.y&&e.direction.y&&(e.ignore=!0),i.direction.z&&e.direction.z&&(e.ignore=!0)}));const n=this._closestFace(this._tmpVector);this._faceVectors.forEach((e=>{e.ignore=!1})),this._ui.position.copyFrom(e.position),i.direction.x&&(i.rotatedDirection.scaleToRef(e.scaling.x/2+this.distanceAwayFromFace,this._tmpVector),this._ui.position.addInPlace(this._tmpVector)),i.direction.y&&(i.rotatedDirection.scaleToRef(e.scaling.y/2+this.distanceAwayFromFace,this._tmpVector),this._ui.position.addInPlace(this._tmpVector)),i.direction.z&&(i.rotatedDirection.scaleToRef(e.scaling.z/2+this.distanceAwayFromFace,this._tmpVector),this._ui.position.addInPlace(this._tmpVector)),this._ui.rotationQuaternion||(this._ui.rotationQuaternion=o._f.RotationYawPitchRoll(this._ui.rotation.y,this._ui.rotation.x,this._ui.rotation.z)),i.rotatedDirection.scaleToRef(-1,this._tmpVector),this._lookAtToRef(this._tmpVector,n.rotatedDirection,this._ui.rotationQuaternion),n.direction.x&&this._ui.up.scaleToRef(this.distanceAwayFromBottomOfFace-e.scaling.x/2,this._tmpVector),n.direction.y&&this._ui.up.scaleToRef(this.distanceAwayFromBottomOfFace-e.scaling.y/2,this._tmpVector),n.direction.z&&this._ui.up.scaleToRef(this.distanceAwayFromBottomOfFace-e.scaling.z/2,this._tmpVector),this._ui.position.addInPlace(this._tmpVector)}))}detach(){this._scene.onBeforeRenderObservable.remove(this._onRenderObserver)}}var Fe=i(1809),Le=i(9778);class Be{constructor(){this._startDistance=0,this._initialScale=new o.P(0,0,0),this._targetScale=new o.P(0,0,0),this._sceneRenderObserver=null,this._dragBehaviorA=new Le.M({}),this._dragBehaviorA.moveAttached=!1,this._dragBehaviorB=new Le.M({}),this._dragBehaviorB.moveAttached=!1}get name(){return"MultiPointerScale"}init(){}_getCurrentDistance(){return this._dragBehaviorA.lastDragPosition.subtract(this._dragBehaviorB.lastDragPosition).length()}attach(e){this._ownerNode=e,this._dragBehaviorA.onDragStartObservable.add((()=>{this._dragBehaviorA.dragging&&this._dragBehaviorB.dragging&&(this._dragBehaviorA.currentDraggingPointerId==this._dragBehaviorB.currentDraggingPointerId?this._dragBehaviorA.releaseDrag():(this._initialScale.copyFrom(e.scaling),this._startDistance=this._getCurrentDistance()))})),this._dragBehaviorB.onDragStartObservable.add((()=>{this._dragBehaviorA.dragging&&this._dragBehaviorB.dragging&&(this._dragBehaviorA.currentDraggingPointerId==this._dragBehaviorB.currentDraggingPointerId?this._dragBehaviorB.releaseDrag():(this._initialScale.copyFrom(e.scaling),this._startDistance=this._getCurrentDistance()))})),[this._dragBehaviorA,this._dragBehaviorB].forEach((e=>{e.onDragObservable.add((()=>{if(this._dragBehaviorA.dragging&&this._dragBehaviorB.dragging){const e=this._getCurrentDistance()/this._startDistance;this._initialScale.scaleToRef(e,this._targetScale)}}))})),e.addBehavior(this._dragBehaviorA),e.addBehavior(this._dragBehaviorB),this._sceneRenderObserver=e.getScene().onBeforeRenderObservable.add((()=>{if(this._dragBehaviorA.dragging&&this._dragBehaviorB.dragging){const t=this._targetScale.subtract(e.scaling).scaleInPlace(.1);t.length()>.01&&e.scaling.addInPlace(t)}}))}detach(){this._ownerNode.getScene().onBeforeRenderObservable.remove(this._sceneRenderObserver),[this._dragBehaviorA,this._dragBehaviorB].forEach((e=>{e.onDragStartObservable.clear(),e.onDragObservable.clear(),this._ownerNode.removeBehavior(e)}))}}var Ue=i(498),Ve=i(120),ke=i(6981),Ge=i(4095),ze=i(4184),We=i(5203);class He{get maxAngle(){return this._maxAngle}set maxAngle(e){this._setMaxAngle(e)}constructor(e,t,i){this.targetPosition=o.P.Zero(),this.poleTargetPosition=o.P.Zero(),this.poleTargetLocalOffset=o.P.Zero(),this.poleAngle=0,this.slerpAmount=1,this._bone1Quat=o._f.Identity(),this._bone1Mat=o.y3.Identity(),this._bone2Ang=Math.PI,this._maxAngle=Math.PI,this._rightHandedSystem=!1,this._bendAxis=o.P.Right(),this._slerping=!1,this._adjustRoll=0,this._notEnoughInformation=!1,this._bone2=t;const n=t.getParent();if(!n)return this._notEnoughInformation=!0,void _.Y.Error("BoneIKController: bone must have a parent for IK to work.");if(this._bone1=n,0===this._bone2.children.length&&!this._bone2.length)return this._notEnoughInformation=!0,void _.Y.Error("BoneIKController: bone must not be a leaf or it should have a length for IK to work.");this.mesh=e;const s=t.getPosition();if(t.getAbsoluteTransform().determinant()>0&&(this._rightHandedSystem=!0,this._bendAxis.x=0,this._bendAxis.y=0,this._bendAxis.z=-1,s.x>s.y&&s.x>s.z&&(this._adjustRoll=.5*Math.PI,this._bendAxis.z=1)),this._bone1.length&&this._bone2.length){const e=this._bone1.getScale(),t=this._bone2.getScale();this._bone1Length=this._bone1.length*e.y*this.mesh.scaling.y,this._bone2Length=this._bone2.length*t.y*this.mesh.scaling.y}else if(this._bone2.children[0]){e.computeWorldMatrix(!0);const t=this._bone2.children[0].getAbsolutePosition(e),i=this._bone2.getAbsolutePosition(e),n=this._bone1.getAbsolutePosition(e);this._bone2Length=o.P.Distance(t,i),this._bone1Length=o.P.Distance(i,n)}else{e.computeWorldMatrix(!0);const t=this._bone2.getScale();this._bone2Length=this._bone2.length*t.y*this.mesh.scaling.y;const i=this._bone2.getAbsolutePosition(e),n=this._bone1.getAbsolutePosition(e);this._bone1Length=o.P.Distance(i,n)}this._bone1.getRotationMatrixToRef(We.T.WORLD,e,this._bone1Mat),this.maxAngle=Math.PI,i&&(i.targetMesh&&(this.targetMesh=i.targetMesh,this.targetMesh.computeWorldMatrix(!0)),i.poleTargetMesh?(this.poleTargetMesh=i.poleTargetMesh,this.poleTargetMesh.computeWorldMatrix(!0)):i.poleTargetBone?this.poleTargetBone=i.poleTargetBone:this._bone1.getParent()&&(this.poleTargetBone=this._bone1.getParent()),i.poleTargetLocalOffset&&this.poleTargetLocalOffset.copyFrom(i.poleTargetLocalOffset),i.poleAngle&&(this.poleAngle=i.poleAngle),i.bendAxis&&this._bendAxis.copyFrom(i.bendAxis),i.maxAngle&&(this.maxAngle=i.maxAngle),i.slerpAmount&&(this.slerpAmount=i.slerpAmount))}_setMaxAngle(e){e<0&&(e=0),(e>Math.PI||null==e)&&(e=Math.PI),this._maxAngle=e;const t=this._bone1Length,i=this._bone2Length;this._maxReach=Math.sqrt(t*t+i*i-2*t*i*Math.cos(e))}update(){if(this._notEnoughInformation)return;const e=this.targetPosition,t=this.poleTargetPosition,i=He._TmpMats[0],n=He._TmpMats[1];this.targetMesh&&e.copyFrom(this.targetMesh.getAbsolutePosition()),this.poleTargetBone?this.poleTargetBone.getAbsolutePositionFromLocalToRef(this.poleTargetLocalOffset,this.mesh,t):this.poleTargetMesh&&o.P.TransformCoordinatesToRef(this.poleTargetLocalOffset,this.poleTargetMesh.getWorldMatrix(),t);const s=He._TmpVecs[0],r=He._TmpVecs[1],a=He._TmpVecs[2],l=He._TmpVecs[3],h=He._TmpVecs[4],c=He._TmpQuat;this._bone1.getAbsolutePositionToRef(this.mesh,s),t.subtractToRef(s,h),0==h.x&&0==h.y&&0==h.z?h.y=1:h.normalize(),e.subtractToRef(s,l),l.normalize(),o.P.CrossToRef(l,h,r),r.normalize(),o.P.CrossToRef(l,r,a),a.normalize(),o.y3.FromXYZAxesToRef(a,l,r,i);const u=this._bone1Length,d=this._bone2Length;let p=o.P.Distance(s,e);this._maxReach>0&&(p=Math.min(this._maxReach,p));let f=(d*d+p*p-u*u)/(2*d*p),_=(p*p+u*u-d*d)/(2*p*u);f>1&&(f=1),_>1&&(_=1),f<-1&&(f=-1),_<-1&&(_=-1);const m=Math.acos(f),g=Math.acos(_);let v=-m-g;if(this._rightHandedSystem)o.y3.RotationYawPitchRollToRef(0,0,this._adjustRoll,n),n.multiplyToRef(i,i),o.y3.RotationAxisToRef(this._bendAxis,g,n),n.multiplyToRef(i,i);else{const e=He._TmpVecs[5];e.copyFrom(this._bendAxis),e.x*=-1,o.y3.RotationAxisToRef(e,-g,n),n.multiplyToRef(i,i)}this.poleAngle&&(o.y3.RotationAxisToRef(l,this.poleAngle,n),i.multiplyToRef(n,i)),this._bone1&&(this.slerpAmount<1?(this._slerping||o._f.FromRotationMatrixToRef(this._bone1Mat,this._bone1Quat),o._f.FromRotationMatrixToRef(i,c),o._f.SlerpToRef(this._bone1Quat,c,this.slerpAmount,this._bone1Quat),v=this._bone2Ang*(1-this.slerpAmount)+v*this.slerpAmount,this._bone1.setRotationQuaternion(this._bone1Quat,We.T.WORLD,this.mesh),this._slerping=!0):(this._bone1.setRotationMatrix(i,We.T.WORLD,this.mesh),this._bone1Mat.copyFrom(i),this._slerping=!1),this._updateLinkedTransformRotation(this._bone1)),this._bone2.setAxisAngle(this._bendAxis,v,We.T.LOCAL),this._updateLinkedTransformRotation(this._bone2),this._bone2Ang=v}_updateLinkedTransformRotation(e){e._linkedTransformNode&&(e._linkedTransformNode.rotationQuaternion||(e._linkedTransformNode.rotationQuaternion=new o._f),e.getRotationQuaternionToRef(We.T.LOCAL,null,e._linkedTransformNode.rotationQuaternion))}}He._TmpVecs=[o.P.Zero(),o.P.Zero(),o.P.Zero(),o.P.Zero(),o.P.Zero(),o.P.Zero()],He._TmpQuat=o._f.Identity(),He._TmpMats=[o.y3.Identity(),o.y3.Identity()];var Xe=i(5860);class je{get minYaw(){return this._minYaw}set minYaw(e){this._minYaw=e,this._minYawSin=Math.sin(e),this._minYawCos=Math.cos(e),null!=this._maxYaw&&(this._midYawConstraint=.5*this._getAngleDiff(this._minYaw,this._maxYaw)+this._minYaw,this._yawRange=this._maxYaw-this._minYaw)}get maxYaw(){return this._maxYaw}set maxYaw(e){this._maxYaw=e,this._maxYawSin=Math.sin(e),this._maxYawCos=Math.cos(e),null!=this._minYaw&&(this._midYawConstraint=.5*this._getAngleDiff(this._minYaw,this._maxYaw)+this._minYaw,this._yawRange=this._maxYaw-this._minYaw)}get minPitch(){return this._minPitch}set minPitch(e){this._minPitch=e,this._minPitchTan=Math.tan(e)}get maxPitch(){return this._maxPitch}set maxPitch(e){this._maxPitch=e,this._maxPitchTan=Math.tan(e)}constructor(e,t,i,n){if(this.upAxis=o.P.Up(),this.upAxisSpace=We.T.LOCAL,this.adjustYaw=0,this.adjustPitch=0,this.adjustRoll=0,this.slerpAmount=1,this._boneQuat=o._f.Identity(),this._slerping=!1,this._firstFrameSkipped=!1,this._fowardAxis=o.P.Forward(),this.mesh=e,this.bone=t,this.target=i,n&&(n.adjustYaw&&(this.adjustYaw=n.adjustYaw),n.adjustPitch&&(this.adjustPitch=n.adjustPitch),n.adjustRoll&&(this.adjustRoll=n.adjustRoll),null!=n.maxYaw?this.maxYaw=n.maxYaw:this.maxYaw=Math.PI,null!=n.minYaw?this.minYaw=n.minYaw:this.minYaw=-Math.PI,null!=n.maxPitch?this.maxPitch=n.maxPitch:this.maxPitch=Math.PI,null!=n.minPitch?this.minPitch=n.minPitch:this.minPitch=-Math.PI,null!=n.slerpAmount&&(this.slerpAmount=n.slerpAmount),null!=n.upAxis&&(this.upAxis=n.upAxis),null!=n.upAxisSpace&&(this.upAxisSpace=n.upAxisSpace),null!=n.yawAxis||null!=n.pitchAxis)){let e=We.RD.Y,t=We.RD.X;null!=n.yawAxis&&(e=n.yawAxis.clone(),e.normalize()),null!=n.pitchAxis&&(t=n.pitchAxis.clone(),t.normalize());const i=o.P.Cross(t,e);this._transformYawPitch=o.y3.Identity(),o.y3.FromXYZAxesToRef(t,e,i,this._transformYawPitch),this._transformYawPitchInv=this._transformYawPitch.clone(),this._transformYawPitch.invert()}t.getParent()||this.upAxisSpace!=We.T.BONE||(this.upAxisSpace=We.T.LOCAL)}update(){if(this.slerpAmount<1&&!this._firstFrameSkipped)return void(this._firstFrameSkipped=!0);const e=this.bone,t=je._TmpVecs[0];e.getAbsolutePositionToRef(this.mesh,t);let i=this.target;const n=je._TmpMats[0],s=je._TmpMats[1],r=this.mesh,a=e.getParent(),l=je._TmpVecs[1];l.copyFrom(this.upAxis),this.upAxisSpace==We.T.BONE&&a?(this._transformYawPitch&&o.P.TransformCoordinatesToRef(l,this._transformYawPitchInv,l),a.getDirectionToRef(l,this.mesh,l)):this.upAxisSpace==We.T.LOCAL&&(r.getDirectionToRef(l,l),1==r.scaling.x&&1==r.scaling.y&&1==r.scaling.z||l.normalize());let h=!1,c=!1;if(this._maxYaw==Math.PI&&this._minYaw==-Math.PI||(h=!0),this._maxPitch==Math.PI&&this._minPitch==-Math.PI||(c=!0),h||c){const e=je._TmpMats[2],n=je._TmpMats[3];if(this.upAxisSpace==We.T.BONE&&1==l.y&&a)a.getRotationMatrixToRef(We.T.WORLD,this.mesh,e);else if(this.upAxisSpace!=We.T.LOCAL||1!=l.y||a){let t=je._TmpVecs[2];t.copyFrom(this._fowardAxis),this._transformYawPitch&&o.P.TransformCoordinatesToRef(t,this._transformYawPitchInv,t),a?a.getDirectionToRef(t,this.mesh,t):r.getDirectionToRef(t,t);const i=o.P.Cross(l,t);i.normalize(),t=o.P.Cross(i,l),o.y3.FromXYZAxesToRef(i,l,t,e)}else e.copyFrom(r.getWorldMatrix());e.invertToRef(n);let s=null;if(c){const r=je._TmpVecs[3];i.subtractToRef(t,r),o.P.TransformCoordinatesToRef(r,n,r),s=Math.sqrt(r.x*r.x+r.z*r.z);const a=Math.atan2(r.y,s);let l=a;a>this._maxPitch?(r.y=this._maxPitchTan*s,l=this._maxPitch):a<this._minPitch&&(r.y=this._minPitchTan*s,l=this._minPitch),a!=l&&(o.P.TransformCoordinatesToRef(r,e,r),r.addInPlace(t),i=r)}if(h){const r=je._TmpVecs[4];i.subtractToRef(t,r),o.P.TransformCoordinatesToRef(r,n,r);const a=Math.atan2(r.x,r.z);let l=a;if((a>this._maxYaw||a<this._minYaw)&&(null==s&&(s=Math.sqrt(r.x*r.x+r.z*r.z)),this._yawRange>Math.PI?this._isAngleBetween(a,this._maxYaw,this._midYawConstraint)?(r.z=this._maxYawCos*s,r.x=this._maxYawSin*s,l=this._maxYaw):this._isAngleBetween(a,this._midYawConstraint,this._minYaw)&&(r.z=this._minYawCos*s,r.x=this._minYawSin*s,l=this._minYaw):a>this._maxYaw?(r.z=this._maxYawCos*s,r.x=this._maxYawSin*s,l=this._maxYaw):a<this._minYaw&&(r.z=this._minYawCos*s,r.x=this._minYawSin*s,l=this._minYaw)),this._slerping&&this._yawRange>Math.PI){const e=je._TmpVecs[8];e.copyFrom(We.RD.Z),this._transformYawPitch&&o.P.TransformCoordinatesToRef(e,this._transformYawPitchInv,e);const t=je._TmpMats[4];this._boneQuat.toRotationMatrix(t),this.mesh.getWorldMatrix().multiplyToRef(t,t),o.P.TransformCoordinatesToRef(e,t,e),o.P.TransformCoordinatesToRef(e,n,e);const i=Math.atan2(e.x,e.z);if(this._getAngleBetween(i,a)>this._getAngleBetween(i,this._midYawConstraint)){null==s&&(s=Math.sqrt(r.x*r.x+r.z*r.z));const e=this._getAngleBetween(i,this._maxYaw);this._getAngleBetween(i,this._minYaw)<e?(l=i+.75*Math.PI,r.z=Math.cos(l)*s,r.x=Math.sin(l)*s):(l=i-.75*Math.PI,r.z=Math.cos(l)*s,r.x=Math.sin(l)*s)}}a!=l&&(o.P.TransformCoordinatesToRef(r,e,r),r.addInPlace(t),i=r)}}const u=je._TmpVecs[5],d=je._TmpVecs[6],p=je._TmpVecs[7],f=je._TmpQuat;i.subtractToRef(t,u),u.normalize(),o.P.CrossToRef(l,u,d),d.normalize(),o.P.CrossToRef(u,d,p),p.normalize(),o.y3.FromXYZAxesToRef(d,p,u,n),0===d.x&&0===d.y&&0===d.z||0===p.x&&0===p.y&&0===p.z||0===u.x&&0===u.y&&0===u.z||((this.adjustYaw||this.adjustPitch||this.adjustRoll)&&(o.y3.RotationYawPitchRollToRef(this.adjustYaw,this.adjustPitch,this.adjustRoll,s),s.multiplyToRef(n,n)),this.slerpAmount<1?(this._slerping||this.bone.getRotationQuaternionToRef(We.T.WORLD,this.mesh,this._boneQuat),this._transformYawPitch&&this._transformYawPitch.multiplyToRef(n,n),o._f.FromRotationMatrixToRef(n,f),o._f.SlerpToRef(this._boneQuat,f,this.slerpAmount,this._boneQuat),this.bone.setRotationQuaternion(this._boneQuat,We.T.WORLD,this.mesh),this._slerping=!0):(this._transformYawPitch&&this._transformYawPitch.multiplyToRef(n,n),this.bone.setRotationMatrix(n,We.T.WORLD,this.mesh),this._slerping=!1),this._updateLinkedTransformRotation())}_getAngleDiff(e,t){let i=t-e;return i%=2*Math.PI,i>Math.PI?i-=2*Math.PI:i<-Math.PI&&(i+=2*Math.PI),i}_getAngleBetween(e,t){let i=0;return i=(e=(e%=2*Math.PI)<0?e+2*Math.PI:e)<(t=(t%=2*Math.PI)<0?t+2*Math.PI:t)?t-e:e-t,i>Math.PI&&(i=2*Math.PI-i),i}_isAngleBetween(e,t,i){if(e=(e%=2*Math.PI)<0?e+2*Math.PI:e,(t=(t%=2*Math.PI)<0?t+2*Math.PI:t)<(i=(i%=2*Math.PI)<0?i+2*Math.PI:i)){if(e>t&&e<i)return!0}else if(e>i&&e<t)return!0;return!1}_updateLinkedTransformRotation(){const e=this.bone;e._linkedTransformNode&&(e._linkedTransformNode.rotationQuaternion||(e._linkedTransformNode.rotationQuaternion=new o._f),e.getRotationQuaternionToRef(We.T.LOCAL,null,e._linkedTransformNode.rotationQuaternion))}}je._TmpVecs=Xe.B.BuildArray(10,o.P.Zero),je._TmpQuat=o._f.Identity(),je._TmpMats=Xe.B.BuildArray(5,o.y3.Identity);var Ye=i(5047),qe=i(708),Ke=i(7698);class $e{constructor(e,t,i=3){this._engine=e,this._engine._storageBuffers.push(this),this._create(t,i)}_create(e,t){this._bufferSize=e,this._creationFlags=t,this._buffer=this._engine.createStorageBuffer(e,t)}_rebuild(){this._create(this._bufferSize,this._creationFlags)}getBuffer(){return this._buffer}update(e,t,i){this._buffer&&this._engine.updateStorageBuffer(this._buffer,e,t,i)}read(e,t,i){return this._engine.readFromStorageBuffer(this._buffer,e,t,i)}dispose(){const e=this._engine._storageBuffers,t=e.indexOf(this);-1!==t&&(e[t]=e[e.length-1],e.pop()),this._engine._releaseBuffer(this._buffer),this._buffer=null}}var Qe=i(9563);class Ze{constructor(){this._currentActiveButton=-1,this.buttons=[0,1,2]}attachControl(e){e=de.w1.BackCompatCameraNoPreventDefault(arguments);const t=this.camera.getEngine(),i=t.getInputElement();let n=0,s=null;this._pointA=null,this._pointB=null,this._altKey=!1,this._ctrlKey=!1,this._metaKey=!1,this._shiftKey=!1,this._buttonsPressed=0,this._pointerInput=r=>{var o,a;const l=r.event,h="touch"===l.pointerType;if(t.isInVRExclusivePointerMode)return;if(r.type!==Re.kD.POINTERMOVE&&-1===this.buttons.indexOf(l.button))return;const c=l.target;if(this._altKey=l.altKey,this._ctrlKey=l.ctrlKey,this._metaKey=l.metaKey,this._shiftKey=l.shiftKey,this._buttonsPressed=l.buttons,t.isPointerLock){const e=l.movementX,t=l.movementY;this.onTouch(null,e,t),this._pointA=null,this._pointB=null}else{if(r.type!==Re.kD.POINTERDOWN&&h&&(null===(o=this._pointA)||void 0===o?void 0:o.pointerId)!==l.pointerId&&(null===(a=this._pointB)||void 0===a?void 0:a.pointerId)!==l.pointerId)return;if(r.type!==Re.kD.POINTERDOWN||-1!==this._currentActiveButton&&!h)if(r.type===Re.kD.POINTERDOUBLETAP)this.onDoubleTap(l.pointerType);else if(r.type!==Re.kD.POINTERUP||this._currentActiveButton!==l.button&&!h){if(r.type===Re.kD.POINTERMOVE)if(e||l.preventDefault(),this._pointA&&null===this._pointB){const e=l.clientX-this._pointA.x,t=l.clientY-this._pointA.y;this.onTouch(this._pointA,e,t),this._pointA.x=l.clientX,this._pointA.y=l.clientY}else if(this._pointA&&this._pointB){const e=this._pointA.pointerId===l.pointerId?this._pointA:this._pointB;e.x=l.clientX,e.y=l.clientY;const t=this._pointA.x-this._pointB.x,i=this._pointA.y-this._pointB.y,o=t*t+i*i,a={x:(this._pointA.x+this._pointB.x)/2,y:(this._pointA.y+this._pointB.y)/2,pointerId:l.pointerId,type:r.type};this.onMultiTouch(this._pointA,this._pointB,n,o,s,a),s=a,n=o}}else{try{null==c||c.releasePointerCapture(l.pointerId)}catch(e){}h||(this._pointB=null),t._badOS?this._pointA=this._pointB=null:this._pointB&&this._pointA&&this._pointA.pointerId==l.pointerId?(this._pointA=this._pointB,this._pointB=null):this._pointA&&this._pointB&&this._pointB.pointerId==l.pointerId?this._pointB=null:this._pointA=this._pointB=null,(0!==n||s)&&(this.onMultiTouch(this._pointA,this._pointB,n,0,s,null),n=0,s=null),this._currentActiveButton=-1,this.onButtonUp(l),e||l.preventDefault()}else{try{null==c||c.setPointerCapture(l.pointerId)}catch(e){}if(null===this._pointA)this._pointA={x:l.clientX,y:l.clientY,pointerId:l.pointerId,type:l.pointerType};else{if(null!==this._pointB)return;this._pointB={x:l.clientX,y:l.clientY,pointerId:l.pointerId,type:l.pointerType}}-1!==this._currentActiveButton||h||(this._currentActiveButton=l.button),this.onButtonDown(l),e||(l.preventDefault(),i&&i.focus())}}},this._observer=this.camera.getScene()._inputManager._addCameraPointerObserver(this._pointerInput,Re.kD.POINTERDOWN|Re.kD.POINTERUP|Re.kD.POINTERMOVE|Re.kD.POINTERDOUBLETAP),this._onLostFocus=()=>{this._pointA=this._pointB=null,n=0,s=null,this.onLostFocus()},this._contextMenuBind=this.onContextMenu.bind(this),i&&i.addEventListener("contextmenu",this._contextMenuBind,!1);const r=this.camera.getScene().getEngine().getHostWindow();r&&de.w1.RegisterTopRootEvents(r,[{name:"blur",handler:this._onLostFocus}])}detachControl(){if(this._onLostFocus){const e=this.camera.getScene().getEngine().getHostWindow();e&&de.w1.UnregisterTopRootEvents(e,[{name:"blur",handler:this._onLostFocus}])}if(this._observer){if(this.camera.getScene()._inputManager._removeCameraPointerObserver(this._observer),this._observer=null,this._contextMenuBind){const e=this.camera.getScene().getEngine().getInputElement();e&&e.removeEventListener("contextmenu",this._contextMenuBind)}this._onLostFocus=null}this._altKey=!1,this._ctrlKey=!1,this._metaKey=!1,this._shiftKey=!1,this._buttonsPressed=0,this._currentActiveButton=-1}getClassName(){return"BaseCameraPointersInput"}getSimpleName(){return"pointers"}onDoubleTap(e){}onTouch(e,t,i){}onMultiTouch(e,t,i,n,s,r){}onContextMenu(e){e.preventDefault()}onButtonDown(e){}onButtonUp(e){}onLostFocus(){}}(0,be.gn)([(0,Te.qC)()],Ze.prototype,"buttons",void 0);var Je=i(1181);class et{constructor(e,t){this.x=e,this.y=t}}class tt{get isConnected(){return this._isConnected}constructor(e,t,i,n=0,s=1,r=2,o=3){this.id=e,this.index=t,this.browserGamepad=i,this._leftStick={x:0,y:0},this._rightStick={x:0,y:0},this._isConnected=!0,this._invertLeftStickY=!1,this.type=tt.GAMEPAD,this._leftStickAxisX=n,this._leftStickAxisY=s,this._rightStickAxisX=r,this._rightStickAxisY=o,this.browserGamepad.axes.length>=2&&(this._leftStick={x:this.browserGamepad.axes[this._leftStickAxisX],y:this.browserGamepad.axes[this._leftStickAxisY]}),this.browserGamepad.axes.length>=4&&(this._rightStick={x:this.browserGamepad.axes[this._rightStickAxisX],y:this.browserGamepad.axes[this._rightStickAxisY]})}onleftstickchanged(e){this._onleftstickchanged=e}onrightstickchanged(e){this._onrightstickchanged=e}get leftStick(){return this._leftStick}set leftStick(e){!this._onleftstickchanged||this._leftStick.x===e.x&&this._leftStick.y===e.y||this._onleftstickchanged(e),this._leftStick=e}get rightStick(){return this._rightStick}set rightStick(e){!this._onrightstickchanged||this._rightStick.x===e.x&&this._rightStick.y===e.y||this._onrightstickchanged(e),this._rightStick=e}update(){this._leftStick&&(this.leftStick={x:this.browserGamepad.axes[this._leftStickAxisX],y:this.browserGamepad.axes[this._leftStickAxisY]},this._invertLeftStickY&&(this.leftStick.y*=-1)),this._rightStick&&(this.rightStick={x:this.browserGamepad.axes[this._rightStickAxisX],y:this.browserGamepad.axes[this._rightStickAxisY]})}dispose(){}}tt.GAMEPAD=0,tt.GENERIC=1,tt.XBOX=2,tt.POSE_ENABLED=3,tt.DUALSHOCK=4;class it extends tt{onbuttondown(e){this._onbuttondown=e}onbuttonup(e){this._onbuttonup=e}constructor(e,t,i){super(e,t,i),this.onButtonDownObservable=new r.y$,this.onButtonUpObservable=new r.y$,this.type=tt.GENERIC,this._buttons=new Array(i.buttons.length)}_setButtonValue(e,t,i){return e!==t&&(1===e&&(this._onbuttondown&&this._onbuttondown(i),this.onButtonDownObservable.notifyObservers(i)),0===e&&(this._onbuttonup&&this._onbuttonup(i),this.onButtonUpObservable.notifyObservers(i))),e}update(){super.update();for(let e=0;e<this._buttons.length;e++)this._buttons[e]=this._setButtonValue(this.browserGamepad.buttons[e].value,this._buttons[e],e)}dispose(){super.dispose(),this.onButtonDownObservable.clear(),this.onButtonUpObservable.clear()}}class nt{constructor(){this.gamepadRotationSensibility=80,this.gamepadMoveSensibility=40,this._yAxisScale=1}get invertYAxis(){return 1!==this._yAxisScale}set invertYAxis(e){this._yAxisScale=e?-1:1}attachControl(){const e=this.camera.getScene().gamepadManager;this._onGamepadConnectedObserver=e.onGamepadConnectedObservable.add((e=>{e.type!==tt.POSE_ENABLED&&(this.gamepad&&e.type!==tt.XBOX||(this.gamepad=e))})),this._onGamepadDisconnectedObserver=e.onGamepadDisconnectedObservable.add((e=>{this.gamepad===e&&(this.gamepad=null)})),this.gamepad=e.getGamepadByType(tt.XBOX)}detachControl(){this.camera.getScene().gamepadManager.onGamepadConnectedObservable.remove(this._onGamepadConnectedObserver),this.camera.getScene().gamepadManager.onGamepadDisconnectedObservable.remove(this._onGamepadDisconnectedObserver),this.gamepad=null}checkInputs(){if(this.gamepad){const e=this.camera,t=this.gamepad.rightStick;if(t){if(0!=t.x){const i=t.x/this.gamepadRotationSensibility;0!=i&&Math.abs(i)>.005&&(e.inertialAlphaOffset+=i)}if(0!=t.y){const i=t.y/this.gamepadRotationSensibility*this._yAxisScale;0!=i&&Math.abs(i)>.005&&(e.inertialBetaOffset+=i)}}const i=this.gamepad.leftStick;if(i&&0!=i.y){const e=i.y/this.gamepadMoveSensibility;0!=e&&Math.abs(e)>.005&&(this.camera.inertialRadiusOffset-=e)}}}getClassName(){return"ArcRotateCameraGamepadInput"}getSimpleName(){return"gamepad"}}(0,be.gn)([(0,Te.qC)()],nt.prototype,"gamepadRotationSensibility",void 0),(0,be.gn)([(0,Te.qC)()],nt.prototype,"gamepadMoveSensibility",void 0),Je.u.ArcRotateCameraGamepadInput=nt;var st=i(2925);class rt{constructor(){this.keysUp=[38],this.keysDown=[40],this.keysLeft=[37],this.keysRight=[39],this.keysReset=[220],this.panningSensibility=50,this.zoomingSensibility=25,this.useAltToZoom=!0,this.angularSpeed=.01,this._keys=new Array}attachControl(e){e=de.w1.BackCompatCameraNoPreventDefault(arguments),this._onCanvasBlurObserver||(this._scene=this.camera.getScene(),this._engine=this._scene.getEngine(),this._onCanvasBlurObserver=this._engine.onCanvasBlurObservable.add((()=>{this._keys.length=0})),this._onKeyboardObserver=this._scene.onKeyboardObservable.add((t=>{const i=t.event;if(!i.metaKey)if(t.type===st.OG.KEYDOWN)this._ctrlPressed=i.ctrlKey,this._altPressed=i.altKey,(-1!==this.keysUp.indexOf(i.keyCode)||-1!==this.keysDown.indexOf(i.keyCode)||-1!==this.keysLeft.indexOf(i.keyCode)||-1!==this.keysRight.indexOf(i.keyCode)||-1!==this.keysReset.indexOf(i.keyCode))&&(-1===this._keys.indexOf(i.keyCode)&&this._keys.push(i.keyCode),i.preventDefault&&(e||i.preventDefault()));else if(-1!==this.keysUp.indexOf(i.keyCode)||-1!==this.keysDown.indexOf(i.keyCode)||-1!==this.keysLeft.indexOf(i.keyCode)||-1!==this.keysRight.indexOf(i.keyCode)||-1!==this.keysReset.indexOf(i.keyCode)){const t=this._keys.indexOf(i.keyCode);t>=0&&this._keys.splice(t,1),i.preventDefault&&(e||i.preventDefault())}})))}detachControl(){this._scene&&(this._onKeyboardObserver&&this._scene.onKeyboardObservable.remove(this._onKeyboardObserver),this._onCanvasBlurObserver&&this._engine.onCanvasBlurObservable.remove(this._onCanvasBlurObserver),this._onKeyboardObserver=null,this._onCanvasBlurObserver=null),this._keys.length=0}checkInputs(){if(this._onKeyboardObserver){const e=this.camera;for(let t=0;t<this._keys.length;t++){const i=this._keys[t];-1!==this.keysLeft.indexOf(i)?this._ctrlPressed&&this.camera._useCtrlForPanning?e.inertialPanningX-=1/this.panningSensibility:e.inertialAlphaOffset-=this.angularSpeed:-1!==this.keysUp.indexOf(i)?this._ctrlPressed&&this.camera._useCtrlForPanning?e.inertialPanningY+=1/this.panningSensibility:this._altPressed&&this.useAltToZoom?e.inertialRadiusOffset+=1/this.zoomingSensibility:e.inertialBetaOffset-=this.angularSpeed:-1!==this.keysRight.indexOf(i)?this._ctrlPressed&&this.camera._useCtrlForPanning?e.inertialPanningX+=1/this.panningSensibility:e.inertialAlphaOffset+=this.angularSpeed:-1!==this.keysDown.indexOf(i)?this._ctrlPressed&&this.camera._useCtrlForPanning?e.inertialPanningY-=1/this.panningSensibility:this._altPressed&&this.useAltToZoom?e.inertialRadiusOffset-=1/this.zoomingSensibility:e.inertialBetaOffset+=this.angularSpeed:-1!==this.keysReset.indexOf(i)&&e.useInputToRestoreState&&e.restoreState()}}}getClassName(){return"ArcRotateCameraKeyboardMoveInput"}getSimpleName(){return"keyboard"}}(0,be.gn)([(0,Te.qC)()],rt.prototype,"keysUp",void 0),(0,be.gn)([(0,Te.qC)()],rt.prototype,"keysDown",void 0),(0,be.gn)([(0,Te.qC)()],rt.prototype,"keysLeft",void 0),(0,be.gn)([(0,Te.qC)()],rt.prototype,"keysRight",void 0),(0,be.gn)([(0,Te.qC)()],rt.prototype,"keysReset",void 0),(0,be.gn)([(0,Te.qC)()],rt.prototype,"panningSensibility",void 0),(0,be.gn)([(0,Te.qC)()],rt.prototype,"zoomingSensibility",void 0),(0,be.gn)([(0,Te.qC)()],rt.prototype,"useAltToZoom",void 0),(0,be.gn)([(0,Te.qC)()],rt.prototype,"angularSpeed",void 0),Je.u.ArcRotateCameraKeyboardMoveInput=rt;var ot=i(142),at=i(2272),lt=i(1128);class ht{constructor(){this.wheelPrecision=3,this.zoomToMouseLocation=!1,this.wheelDeltaPercentage=0,this.customComputeDeltaFromMouseWheel=null,this._inertialPanning=o.P.Zero()}_computeDeltaFromMouseWheelLegacyEvent(e,t){let i=0;const n=.01*e*this.wheelDeltaPercentage*t;return i=e>0?n/(1+this.wheelDeltaPercentage):n*(1+this.wheelDeltaPercentage),i}attachControl(e){e=de.w1.BackCompatCameraNoPreventDefault(arguments),this._wheel=t=>{if(t.type!==Re.kD.POINTERWHEEL)return;const i=t.event;let n=0;const s=i.deltaMode===at.G.DOM_DELTA_LINE?40:1,r=-i.deltaY*s;if(this.customComputeDeltaFromMouseWheel)n=this.customComputeDeltaFromMouseWheel(r,this,i);else if(this.wheelDeltaPercentage){if(n=this._computeDeltaFromMouseWheelLegacyEvent(r,this.camera.radius),n>0){let e=this.camera.radius,t=this.camera.inertialRadiusOffset+n;for(let i=0;i<20&&Math.abs(t)>.001;i++)e-=t,t*=this.camera.inertia;e=lt.R.Clamp(e,0,Number.MAX_VALUE),n=this._computeDeltaFromMouseWheelLegacyEvent(r,e)}}else n=r/(40*this.wheelPrecision);n&&(this.zoomToMouseLocation&&this._hitPlane?this._zoomToMouse(n):this.camera.inertialRadiusOffset+=n),i.preventDefault&&(e||i.preventDefault())},this._observer=this.camera.getScene()._inputManager._addCameraPointerObserver(this._wheel,Re.kD.POINTERWHEEL),this.zoomToMouseLocation&&this._inertialPanning.setAll(0)}detachControl(){this._observer&&(this.camera.getScene()._inputManager._removeCameraPointerObserver(this._observer),this._observer=null,this._wheel=null)}checkInputs(){if(!this.zoomToMouseLocation)return;const e=this.camera;0+e.inertialAlphaOffset+e.inertialBetaOffset+e.inertialRadiusOffset&&(this._updateHitPlane(),e.target.addInPlace(this._inertialPanning),this._inertialPanning.scaleInPlace(e.inertia),this._zeroIfClose(this._inertialPanning))}getClassName(){return"ArcRotateCameraMouseWheelInput"}getSimpleName(){return"mousewheel"}_updateHitPlane(){const e=this.camera,t=e.target.subtract(e.position);this._hitPlane=ot.J.FromPositionAndNormal(e.target,t)}_getPosition(){var e;const t=this.camera,i=t.getScene(),n=i.createPickingRay(i.pointerX,i.pointerY,o.y3.Identity(),t,!1);let s=0;return this._hitPlane&&(s=null!==(e=n.intersectsPlane(this._hitPlane))&&void 0!==e?e:0),n.origin.addInPlace(n.direction.scaleInPlace(s))}_zoomToMouse(e){var t,i;const n=this.camera,s=1-n.inertia;if(n.lowerRadiusLimit){const i=null!==(t=n.lowerRadiusLimit)&&void 0!==t?t:0;n.radius-(n.inertialRadiusOffset+e)/s<i&&(e=(n.radius-i)*s-n.inertialRadiusOffset)}if(n.upperRadiusLimit){const t=null!==(i=n.upperRadiusLimit)&&void 0!==i?i:0;n.radius-(n.inertialRadiusOffset+e)/s>t&&(e=(n.radius-t)*s-n.inertialRadiusOffset)}const r=e/s/n.radius,a=this._getPosition(),l=o.jp.Vector3[6];a.subtractToRef(n.target,l),l.scaleInPlace(r),l.scaleInPlace(s),this._inertialPanning.addInPlace(l),n.inertialRadiusOffset+=e}_zeroIfClose(e){Math.abs(e.x)<Me.kn&&(e.x=0),Math.abs(e.y)<Me.kn&&(e.y=0),Math.abs(e.z)<Me.kn&&(e.z=0)}}(0,be.gn)([(0,Te.qC)()],ht.prototype,"wheelPrecision",void 0),(0,be.gn)([(0,Te.qC)()],ht.prototype,"zoomToMouseLocation",void 0),(0,be.gn)([(0,Te.qC)()],ht.prototype,"wheelDeltaPercentage",void 0),Je.u.ArcRotateCameraMouseWheelInput=ht;class ct extends Ze{constructor(){super(...arguments),this.buttons=[0,1,2],this.angularSensibilityX=1e3,this.angularSensibilityY=1e3,this.pinchPrecision=12,this.pinchDeltaPercentage=0,this.useNaturalPinchZoom=!1,this.pinchZoom=!0,this.panningSensibility=1e3,this.multiTouchPanning=!0,this.multiTouchPanAndZoom=!0,this.pinchInwards=!0,this._isPanClick=!1,this._twoFingerActivityCount=0,this._isPinching=!1}getClassName(){return"ArcRotateCameraPointersInput"}_computeMultiTouchPanning(e,t){if(0!==this.panningSensibility&&e&&t){const i=t.x-e.x,n=t.y-e.y;this.camera.inertialPanningX+=-i/this.panningSensibility,this.camera.inertialPanningY+=n/this.panningSensibility}}_computePinchZoom(e,t){const i=this.camera.radius||ct.MinimumRadiusForPinch;this.useNaturalPinchZoom?this.camera.radius=i*Math.sqrt(e)/Math.sqrt(t):this.pinchDeltaPercentage?this.camera.inertialRadiusOffset+=.001*(t-e)*i*this.pinchDeltaPercentage:this.camera.inertialRadiusOffset+=(t-e)/(this.pinchPrecision*(this.pinchInwards?1:-1)*(this.angularSensibilityX+this.angularSensibilityY)/2)}onTouch(e,t,i){0!==this.panningSensibility&&(this._ctrlKey&&this.camera._useCtrlForPanning||this._isPanClick)?(this.camera.inertialPanningX+=-t/this.panningSensibility,this.camera.inertialPanningY+=i/this.panningSensibility):(this.camera.inertialAlphaOffset-=t/this.angularSensibilityX,this.camera.inertialBetaOffset-=i/this.angularSensibilityY)}onDoubleTap(){this.camera.useInputToRestoreState&&this.camera.restoreState()}onMultiTouch(e,t,i,n,s,r){0===i&&null===s||0===n&&null===r||(this.multiTouchPanAndZoom?(this._computePinchZoom(i,n),this._computeMultiTouchPanning(s,r)):this.multiTouchPanning&&this.pinchZoom?(this._twoFingerActivityCount++,this._isPinching||this._twoFingerActivityCount<20&&Math.abs(Math.sqrt(n)-Math.sqrt(i))>this.camera.pinchToPanMaxDistance?(this._computePinchZoom(i,n),this._isPinching=!0):this._computeMultiTouchPanning(s,r)):this.multiTouchPanning?this._computeMultiTouchPanning(s,r):this.pinchZoom&&this._computePinchZoom(i,n))}onButtonDown(e){this._isPanClick=e.button===this.camera._panningMouseButton}onButtonUp(){this._twoFingerActivityCount=0,this._isPinching=!1}onLostFocus(){this._isPanClick=!1,this._twoFingerActivityCount=0,this._isPinching=!1}}ct.MinimumRadiusForPinch=.001,(0,be.gn)([(0,Te.qC)()],ct.prototype,"buttons",void 0),(0,be.gn)([(0,Te.qC)()],ct.prototype,"angularSensibilityX",void 0),(0,be.gn)([(0,Te.qC)()],ct.prototype,"angularSensibilityY",void 0),(0,be.gn)([(0,Te.qC)()],ct.prototype,"pinchPrecision",void 0),(0,be.gn)([(0,Te.qC)()],ct.prototype,"pinchDeltaPercentage",void 0),(0,be.gn)([(0,Te.qC)()],ct.prototype,"useNaturalPinchZoom",void 0),(0,be.gn)([(0,Te.qC)()],ct.prototype,"pinchZoom",void 0),(0,be.gn)([(0,Te.qC)()],ct.prototype,"panningSensibility",void 0),(0,be.gn)([(0,Te.qC)()],ct.prototype,"multiTouchPanning",void 0),(0,be.gn)([(0,Te.qC)()],ct.prototype,"multiTouchPanAndZoom",void 0),Je.u.ArcRotateCameraPointersInput=ct;class ut extends Je.p{constructor(e){super(e)}addMouseWheel(){return this.add(new ht),this}addPointers(){return this.add(new ct),this}addKeyboard(){return this.add(new rt),this}}ut.prototype.addVRDeviceOrientation=function(){return this.add(new dt),this};class dt{constructor(){this.alphaCorrection=1,this.gammaCorrection=1,this._alpha=0,this._gamma=0,this._dirty=!1,this._deviceOrientationHandler=this._onOrientationEvent.bind(this)}attachControl(e){e=de.w1.BackCompatCameraNoPreventDefault(arguments),this.camera.attachControl(e);const t=this.camera.getScene().getEngine().getHostWindow();t&&("undefined"!=typeof DeviceOrientationEvent&&"function"==typeof DeviceOrientationEvent.requestPermission?DeviceOrientationEvent.requestPermission().then((e=>{"granted"===e?t.addEventListener("deviceorientation",this._deviceOrientationHandler):de.w1.Warn("Permission not granted.")})).catch((e=>{de.w1.Error(e)})):t.addEventListener("deviceorientation",this._deviceOrientationHandler))}_onOrientationEvent(e){null!==e.alpha&&(this._alpha=(0|+e.alpha)*this.alphaCorrection),null!==e.gamma&&(this._gamma=(0|+e.gamma)*this.gammaCorrection),this._dirty=!0}checkInputs(){this._dirty&&(this._dirty=!1,this._gamma<0&&(this._gamma=180+this._gamma),this.camera.alpha=-this._alpha/180*Math.PI%Math.PI*2,this.camera.beta=this._gamma/180*Math.PI)}detachControl(){window.removeEventListener("deviceorientation",this._deviceOrientationHandler)}getClassName(){return"ArcRotateCameraVRDeviceOrientationInput"}getSimpleName(){return"VRDeviceOrientation"}}Je.u.ArcRotateCameraVRDeviceOrientationInput=dt;class pt{constructor(){this.keysForward=[87],this.keysBackward=[83],this.keysUp=[69],this.keysDown=[81],this.keysRight=[68],this.keysLeft=[65],this._keys=new Array}attachControl(e){e=de.w1.BackCompatCameraNoPreventDefault(arguments),this._onCanvasBlurObserver||(this._scene=this.camera.getScene(),this._engine=this._scene.getEngine(),this._onCanvasBlurObserver=this._engine.onCanvasBlurObservable.add((()=>{this._keys.length=0})),this._onKeyboardObserver=this._scene.onKeyboardObservable.add((t=>{const i=t.event;if(t.type===st.OG.KEYDOWN)-1===this.keysForward.indexOf(i.keyCode)&&-1===this.keysBackward.indexOf(i.keyCode)&&-1===this.keysUp.indexOf(i.keyCode)&&-1===this.keysDown.indexOf(i.keyCode)&&-1===this.keysLeft.indexOf(i.keyCode)&&-1===this.keysRight.indexOf(i.keyCode)||(-1===this._keys.indexOf(i.keyCode)&&this._keys.push(i.keyCode),e||i.preventDefault());else if(-1!==this.keysForward.indexOf(i.keyCode)||-1!==this.keysBackward.indexOf(i.keyCode)||-1!==this.keysUp.indexOf(i.keyCode)||-1!==this.keysDown.indexOf(i.keyCode)||-1!==this.keysLeft.indexOf(i.keyCode)||-1!==this.keysRight.indexOf(i.keyCode)){const t=this._keys.indexOf(i.keyCode);t>=0&&this._keys.splice(t,1),e||i.preventDefault()}})))}detachControl(){this._scene&&(this._onKeyboardObserver&&this._scene.onKeyboardObservable.remove(this._onKeyboardObserver),this._onCanvasBlurObserver&&this._engine.onCanvasBlurObservable.remove(this._onCanvasBlurObserver),this._onKeyboardObserver=null,this._onCanvasBlurObserver=null),this._keys.length=0}getClassName(){return"FlyCameraKeyboardInput"}_onLostFocus(){this._keys.length=0}getSimpleName(){return"keyboard"}checkInputs(){if(this._onKeyboardObserver){const e=this.camera;for(let t=0;t<this._keys.length;t++){const i=this._keys[t],n=e._computeLocalCameraSpeed();-1!==this.keysForward.indexOf(i)?e._localDirection.copyFromFloats(0,0,n):-1!==this.keysBackward.indexOf(i)?e._localDirection.copyFromFloats(0,0,-n):-1!==this.keysUp.indexOf(i)?e._localDirection.copyFromFloats(0,n,0):-1!==this.keysDown.indexOf(i)?e._localDirection.copyFromFloats(0,-n,0):-1!==this.keysRight.indexOf(i)?e._localDirection.copyFromFloats(n,0,0):-1!==this.keysLeft.indexOf(i)&&e._localDirection.copyFromFloats(-n,0,0),e.getScene().useRightHandedSystem&&(e._localDirection.z*=-1),e.getViewMatrix().invertToRef(e._cameraTransformMatrix),o.P.TransformNormalToRef(e._localDirection,e._cameraTransformMatrix,e._transformedDirection),e.cameraDirection.addInPlace(e._transformedDirection)}}}}(0,be.gn)([(0,Te.qC)()],pt.prototype,"keysForward",void 0),(0,be.gn)([(0,Te.qC)()],pt.prototype,"keysBackward",void 0),(0,be.gn)([(0,Te.qC)()],pt.prototype,"keysUp",void 0),(0,be.gn)([(0,Te.qC)()],pt.prototype,"keysDown",void 0),(0,be.gn)([(0,Te.qC)()],pt.prototype,"keysRight",void 0),(0,be.gn)([(0,Te.qC)()],pt.prototype,"keysLeft",void 0),Je.u.FlyCameraKeyboardInput=pt;class ft{constructor(){this.buttons=[0,1,2],this.buttonsYaw=[-1,0,1],this.buttonsPitch=[-1,0,1],this.buttonsRoll=[2],this.activeButton=-1,this.angularSensibility=1e3,this._previousPosition=null}attachControl(e){e=de.w1.BackCompatCameraNoPreventDefault(arguments),this._noPreventDefault=e,this._observer=this.camera.getScene()._inputManager._addCameraPointerObserver((e=>{this._pointerInput(e)}),Re.kD.POINTERDOWN|Re.kD.POINTERUP|Re.kD.POINTERMOVE),this._rollObserver=this.camera.getScene().onBeforeRenderObservable.add((()=>{this.camera.rollCorrect&&this.camera.restoreRoll(this.camera.rollCorrect)}))}detachControl(){this._observer&&(this.camera.getScene()._inputManager._removeCameraPointerObserver(this._observer),this.camera.getScene().onBeforeRenderObservable.remove(this._rollObserver),this._observer=null,this._rollObserver=null,this._previousPosition=null,this._noPreventDefault=void 0)}getClassName(){return"FlyCameraMouseInput"}getSimpleName(){return"mouse"}_pointerInput(e){const t=e.event,i=this.camera.getEngine();if(i.isInVRExclusivePointerMode)return;if(!this.touchEnabled&&"touch"===t.pointerType)return;if(e.type!==Re.kD.POINTERMOVE&&-1===this.buttons.indexOf(t.button))return;const n=t.target;if(e.type===Re.kD.POINTERDOWN){try{null==n||n.setPointerCapture(t.pointerId)}catch(t){}this._previousPosition={x:t.clientX,y:t.clientY},this.activeButton=t.button,this._noPreventDefault||(t.preventDefault(),this._element.focus()),i.isPointerLock&&this._onMouseMove(e.event)}else if(e.type===Re.kD.POINTERUP){try{null==n||n.releasePointerCapture(t.pointerId)}catch(t){}this.activeButton=-1,this._previousPosition=null,this._noPreventDefault||t.preventDefault()}else if(e.type===Re.kD.POINTERMOVE){if(!this._previousPosition)return void(i.isPointerLock&&this._onMouseMove(e.event));const n=t.clientX-this._previousPosition.x,s=t.clientY-this._previousPosition.y;this._rotateCamera(n,s),this._previousPosition={x:t.clientX,y:t.clientY},this._noPreventDefault||t.preventDefault()}}_onMouseMove(e){const t=this.camera.getEngine();if(!t.isPointerLock||t.isInVRExclusivePointerMode)return;const i=e.movementX,n=e.movementY;this._rotateCamera(i,n),this._previousPosition=null,this._noPreventDefault||e.preventDefault()}_rotateCamera(e,t){const i=this.camera;this.camera.getScene().useRightHandedSystem&&(e*=-1),i.parent&&i.parent._getWorldMatrixDeterminant()<0&&(e*=-1);const n=e/this.angularSensibility,s=t/this.angularSensibility,r=o._f.RotationYawPitchRoll(i.rotation.y,i.rotation.x,i.rotation.z);let a;if(this.buttonsPitch.some((e=>e===this.activeButton))&&(a=o._f.RotationAxis(We.RD.X,s),r.multiplyInPlace(a)),this.buttonsYaw.some((e=>e===this.activeButton))){a=o._f.RotationAxis(We.RD.Y,n),r.multiplyInPlace(a);const e=i.bankedTurnLimit+i._trackRoll;if(i.bankedTurn&&-e<i.rotation.z&&i.rotation.z<e){const e=i.bankedTurnMultiplier*-n;a=o._f.RotationAxis(We.RD.Z,e),r.multiplyInPlace(a)}}this.buttonsRoll.some((e=>e===this.activeButton))&&(a=o._f.RotationAxis(We.RD.Z,-n),i._trackRoll-=n,r.multiplyInPlace(a)),r.toEulerAnglesToRef(i.rotation)}}(0,be.gn)([(0,Te.qC)()],ft.prototype,"buttons",void 0),(0,be.gn)([(0,Te.qC)()],ft.prototype,"angularSensibility",void 0),Je.u.FlyCameraMouseInput=ft;class _t{constructor(){this.keysHeightOffsetIncr=[38],this.keysHeightOffsetDecr=[40],this.keysHeightOffsetModifierAlt=!1,this.keysHeightOffsetModifierCtrl=!1,this.keysHeightOffsetModifierShift=!1,this.keysRotationOffsetIncr=[37],this.keysRotationOffsetDecr=[39],this.keysRotationOffsetModifierAlt=!1,this.keysRotationOffsetModifierCtrl=!1,this.keysRotationOffsetModifierShift=!1,this.keysRadiusIncr=[40],this.keysRadiusDecr=[38],this.keysRadiusModifierAlt=!0,this.keysRadiusModifierCtrl=!1,this.keysRadiusModifierShift=!1,this.heightSensibility=1,this.rotationSensibility=1,this.radiusSensibility=1,this._keys=new Array}attachControl(e){e=de.w1.BackCompatCameraNoPreventDefault(arguments),this._onCanvasBlurObserver||(this._scene=this.camera.getScene(),this._engine=this._scene.getEngine(),this._onCanvasBlurObserver=this._engine.onCanvasBlurObservable.add((()=>{this._keys.length=0})),this._onKeyboardObserver=this._scene.onKeyboardObservable.add((t=>{const i=t.event;if(!i.metaKey)if(t.type===st.OG.KEYDOWN)this._ctrlPressed=i.ctrlKey,this._altPressed=i.altKey,this._shiftPressed=i.shiftKey,(-1!==this.keysHeightOffsetIncr.indexOf(i.keyCode)||-1!==this.keysHeightOffsetDecr.indexOf(i.keyCode)||-1!==this.keysRotationOffsetIncr.indexOf(i.keyCode)||-1!==this.keysRotationOffsetDecr.indexOf(i.keyCode)||-1!==this.keysRadiusIncr.indexOf(i.keyCode)||-1!==this.keysRadiusDecr.indexOf(i.keyCode))&&(-1===this._keys.indexOf(i.keyCode)&&this._keys.push(i.keyCode),i.preventDefault&&(e||i.preventDefault()));else if(-1!==this.keysHeightOffsetIncr.indexOf(i.keyCode)||-1!==this.keysHeightOffsetDecr.indexOf(i.keyCode)||-1!==this.keysRotationOffsetIncr.indexOf(i.keyCode)||-1!==this.keysRotationOffsetDecr.indexOf(i.keyCode)||-1!==this.keysRadiusIncr.indexOf(i.keyCode)||-1!==this.keysRadiusDecr.indexOf(i.keyCode)){const t=this._keys.indexOf(i.keyCode);t>=0&&this._keys.splice(t,1),i.preventDefault&&(e||i.preventDefault())}})))}detachControl(){this._scene&&(this._onKeyboardObserver&&this._scene.onKeyboardObservable.remove(this._onKeyboardObserver),this._onCanvasBlurObserver&&this._engine.onCanvasBlurObservable.remove(this._onCanvasBlurObserver),this._onKeyboardObserver=null,this._onCanvasBlurObserver=null),this._keys.length=0}checkInputs(){this._onKeyboardObserver&&this._keys.forEach((e=>{-1!==this.keysHeightOffsetIncr.indexOf(e)&&this._modifierHeightOffset()?this.camera.heightOffset+=this.heightSensibility:-1!==this.keysHeightOffsetDecr.indexOf(e)&&this._modifierHeightOffset()?this.camera.heightOffset-=this.heightSensibility:-1!==this.keysRotationOffsetIncr.indexOf(e)&&this._modifierRotationOffset()?(this.camera.rotationOffset+=this.rotationSensibility,this.camera.rotationOffset%=360):-1!==this.keysRotationOffsetDecr.indexOf(e)&&this._modifierRotationOffset()?(this.camera.rotationOffset-=this.rotationSensibility,this.camera.rotationOffset%=360):-1!==this.keysRadiusIncr.indexOf(e)&&this._modifierRadius()?this.camera.radius+=this.radiusSensibility:-1!==this.keysRadiusDecr.indexOf(e)&&this._modifierRadius()&&(this.camera.radius-=this.radiusSensibility)}))}getClassName(){return"FollowCameraKeyboardMoveInput"}getSimpleName(){return"keyboard"}_modifierHeightOffset(){return this.keysHeightOffsetModifierAlt===this._altPressed&&this.keysHeightOffsetModifierCtrl===this._ctrlPressed&&this.keysHeightOffsetModifierShift===this._shiftPressed}_modifierRotationOffset(){return this.keysRotationOffsetModifierAlt===this._altPressed&&this.keysRotationOffsetModifierCtrl===this._ctrlPressed&&this.keysRotationOffsetModifierShift===this._shiftPressed}_modifierRadius(){return this.keysRadiusModifierAlt===this._altPressed&&this.keysRadiusModifierCtrl===this._ctrlPressed&&this.keysRadiusModifierShift===this._shiftPressed}}(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysHeightOffsetIncr",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysHeightOffsetDecr",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysHeightOffsetModifierAlt",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysHeightOffsetModifierCtrl",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysHeightOffsetModifierShift",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysRotationOffsetIncr",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysRotationOffsetDecr",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysRotationOffsetModifierAlt",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysRotationOffsetModifierCtrl",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysRotationOffsetModifierShift",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysRadiusIncr",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysRadiusDecr",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysRadiusModifierAlt",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysRadiusModifierCtrl",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"keysRadiusModifierShift",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"heightSensibility",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"rotationSensibility",void 0),(0,be.gn)([(0,Te.qC)()],_t.prototype,"radiusSensibility",void 0),Je.u.FollowCameraKeyboardMoveInput=_t;class mt{constructor(){this.axisControlRadius=!0,this.axisControlHeight=!1,this.axisControlRotation=!1,this.wheelPrecision=3,this.wheelDeltaPercentage=0}attachControl(e){e=de.w1.BackCompatCameraNoPreventDefault(arguments),this._wheel=t=>{if(t.type!==Re.kD.POINTERWHEEL)return;const i=t.event;let n=0;const s=Math.max(-1,Math.min(1,i.deltaY));this.wheelDeltaPercentage?(console.assert(this.axisControlRadius+this.axisControlHeight+this.axisControlRotation<=1,"wheelDeltaPercentage only usable when mouse wheel controls ONE axis. Currently enabled: axisControlRadius: "+this.axisControlRadius+", axisControlHeightOffset: "+this.axisControlHeight+", axisControlRotationOffset: "+this.axisControlRotation),this.axisControlRadius?n=.01*s*this.wheelDeltaPercentage*this.camera.radius:this.axisControlHeight?n=.01*s*this.wheelDeltaPercentage*this.camera.heightOffset:this.axisControlRotation&&(n=.01*s*this.wheelDeltaPercentage*this.camera.rotationOffset)):n=s*this.wheelPrecision,n&&(this.axisControlRadius?this.camera.radius+=n:this.axisControlHeight?this.camera.heightOffset-=n:this.axisControlRotation&&(this.camera.rotationOffset-=n)),i.preventDefault&&(e||i.preventDefault())},this._observer=this.camera.getScene()._inputManager._addCameraPointerObserver(this._wheel,Re.kD.POINTERWHEEL)}detachControl(){this._observer&&(this.camera.getScene()._inputManager._removeCameraPointerObserver(this._observer),this._observer=null,this._wheel=null)}getClassName(){return"ArcRotateCameraMouseWheelInput"}getSimpleName(){return"mousewheel"}}(0,be.gn)([(0,Te.qC)()],mt.prototype,"axisControlRadius",void 0),(0,be.gn)([(0,Te.qC)()],mt.prototype,"axisControlHeight",void 0),(0,be.gn)([(0,Te.qC)()],mt.prototype,"axisControlRotation",void 0),(0,be.gn)([(0,Te.qC)()],mt.prototype,"wheelPrecision",void 0),(0,be.gn)([(0,Te.qC)()],mt.prototype,"wheelDeltaPercentage",void 0),Je.u.FollowCameraMouseWheelInput=mt;class gt extends Ze{constructor(){super(...arguments),this.angularSensibilityX=1,this.angularSensibilityY=1,this.pinchPrecision=1e4,this.pinchDeltaPercentage=0,this.axisXControlRadius=!1,this.axisXControlHeight=!1,this.axisXControlRotation=!0,this.axisYControlRadius=!1,this.axisYControlHeight=!0,this.axisYControlRotation=!1,this.axisPinchControlRadius=!0,this.axisPinchControlHeight=!1,this.axisPinchControlRotation=!1,this.warningEnable=!0,this._warningCounter=0}getClassName(){return"FollowCameraPointersInput"}onTouch(e,t,i){this._warning(),this.axisXControlRotation?this.camera.rotationOffset+=t/this.angularSensibilityX:this.axisYControlRotation&&(this.camera.rotationOffset+=i/this.angularSensibilityX),this.axisXControlHeight?this.camera.heightOffset+=t/this.angularSensibilityY:this.axisYControlHeight&&(this.camera.heightOffset+=i/this.angularSensibilityY),this.axisXControlRadius?this.camera.radius-=t/this.angularSensibilityY:this.axisYControlRadius&&(this.camera.radius-=i/this.angularSensibilityY)}onMultiTouch(e,t,i,n,s,r){if(0===i&&null===s)return;if(0===n&&null===r)return;let o=(n-i)/(this.pinchPrecision*(this.angularSensibilityX+this.angularSensibilityY)/2);this.pinchDeltaPercentage?(o*=.01*this.pinchDeltaPercentage,this.axisPinchControlRotation&&(this.camera.rotationOffset+=o*this.camera.rotationOffset),this.axisPinchControlHeight&&(this.camera.heightOffset+=o*this.camera.heightOffset),this.axisPinchControlRadius&&(this.camera.radius-=o*this.camera.radius)):(this.axisPinchControlRotation&&(this.camera.rotationOffset+=o),this.axisPinchControlHeight&&(this.camera.heightOffset+=o),this.axisPinchControlRadius&&(this.camera.radius-=o))}_warning(){if(!this.warningEnable||this._warningCounter++%100!=0)return;const e="It probably only makes sense to control ONE camera property with each pointer axis. Set 'warningEnable = false' if you are sure. Currently enabled: ";console.assert(this.axisXControlRotation+this.axisXControlHeight+this.axisXControlRadius<=1,e+"axisXControlRotation: "+this.axisXControlRotation+", axisXControlHeight: "+this.axisXControlHeight+", axisXControlRadius: "+this.axisXControlRadius),console.assert(this.axisYControlRotation+this.axisYControlHeight+this.axisYControlRadius<=1,e+"axisYControlRotation: "+this.axisYControlRotation+", axisYControlHeight: "+this.axisYControlHeight+", axisYControlRadius: "+this.axisYControlRadius),console.assert(this.axisPinchControlRotation+this.axisPinchControlHeight+this.axisPinchControlRadius<=1,e+"axisPinchControlRotation: "+this.axisPinchControlRotation+", axisPinchControlHeight: "+this.axisPinchControlHeight+", axisPinchControlRadius: "+this.axisPinchControlRadius)}}(0,be.gn)([(0,Te.qC)()],gt.prototype,"angularSensibilityX",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"angularSensibilityY",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"pinchPrecision",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"pinchDeltaPercentage",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"axisXControlRadius",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"axisXControlHeight",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"axisXControlRotation",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"axisYControlRadius",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"axisYControlHeight",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"axisYControlRotation",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"axisPinchControlRadius",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"axisPinchControlHeight",void 0),(0,be.gn)([(0,Te.qC)()],gt.prototype,"axisPinchControlRotation",void 0),Je.u.FollowCameraPointersInput=gt;var vt=i(189);vt.a.prototype.addDeviceOrientation=function(e){return this._deviceOrientationInput||(this._deviceOrientationInput=new yt,e&&(this._deviceOrientationInput.smoothFactor=e),this.add(this._deviceOrientationInput)),this};class yt{static WaitForOrientationChangeAsync(e){return new Promise(((t,i)=>{let n=!1;const s=()=>{window.removeEventListener("deviceorientation",s),n=!0,t()};e&&setTimeout((()=>{n||(window.removeEventListener("deviceorientation",s),i("WaitForOrientationChangeAsync timed out"))}),e),"undefined"!=typeof DeviceOrientationEvent&&"function"==typeof DeviceOrientationEvent.requestPermission?DeviceOrientationEvent.requestPermission().then((e=>{"granted"==e?window.addEventListener("deviceorientation",s):de.w1.Warn("Permission not granted.")})).catch((e=>{de.w1.Error(e)})):window.addEventListener("deviceorientation",s)}))}constructor(){this._screenOrientationAngle=0,this._screenQuaternion=new o._f,this._alpha=0,this._beta=0,this._gamma=0,this.smoothFactor=0,this._onDeviceOrientationChangedObservable=new r.y$,this._orientationChanged=()=>{this._screenOrientationAngle=void 0!==window.orientation?+window.orientation:window.screen.orientation&&window.screen.orientation.angle?window.screen.orientation.angle:0,this._screenOrientationAngle=-de.w1.ToRadians(this._screenOrientationAngle/2),this._screenQuaternion.copyFromFloats(0,Math.sin(this._screenOrientationAngle),0,Math.cos(this._screenOrientationAngle))},this._deviceOrientation=e=>{this.smoothFactor?(this._alpha=null!==e.alpha?de.w1.SmoothAngleChange(this._alpha,e.alpha,this.smoothFactor):0,this._beta=null!==e.beta?de.w1.SmoothAngleChange(this._beta,e.beta,this.smoothFactor):0,this._gamma=null!==e.gamma?de.w1.SmoothAngleChange(this._gamma,e.gamma,this.smoothFactor):0):(this._alpha=null!==e.alpha?e.alpha:0,this._beta=null!==e.beta?e.beta:0,this._gamma=null!==e.gamma?e.gamma:0),null!==e.alpha&&this._onDeviceOrientationChangedObservable.notifyObservers()},this._constantTranform=new o._f(-Math.sqrt(.5),0,0,Math.sqrt(.5)),this._orientationChanged()}get camera(){return this._camera}set camera(e){this._camera=e,null==this._camera||this._camera.rotationQuaternion||(this._camera.rotationQuaternion=new o._f),this._camera&&this._camera.onDisposeObservable.add((()=>{this._onDeviceOrientationChangedObservable.clear()}))}attachControl(){const e=this.camera.getScene().getEngine().getHostWindow();if(e){const t=()=>{e.addEventListener("orientationchange",this._orientationChanged),e.addEventListener("deviceorientation",this._deviceOrientation),this._orientationChanged()};"undefined"!=typeof DeviceOrientationEvent&&"function"==typeof DeviceOrientationEvent.requestPermission?DeviceOrientationEvent.requestPermission().then((e=>{"granted"===e?t():de.w1.Warn("Permission not granted.")})).catch((e=>{de.w1.Error(e)})):t()}}detachControl(){window.removeEventListener("orientationchange",this._orientationChanged),window.removeEventListener("deviceorientation",this._deviceOrientation),this._alpha=0}checkInputs(){this._alpha&&(o._f.RotationYawPitchRollToRef(de.w1.ToRadians(this._alpha),de.w1.ToRadians(this._beta),-de.w1.ToRadians(this._gamma),this.camera.rotationQuaternion),this._camera.rotationQuaternion.multiplyInPlace(this._screenQuaternion),this._camera.rotationQuaternion.multiplyInPlace(this._constantTranform),this._camera.rotationQuaternion.z*=-1,this._camera.rotationQuaternion.w*=-1)}getClassName(){return"FreeCameraDeviceOrientationInput"}getSimpleName(){return"deviceOrientation"}}Je.u.FreeCameraDeviceOrientationInput=yt;class xt{constructor(){this.gamepadAngularSensibility=200,this.gamepadMoveSensibility=40,this.deadzoneDelta=.1,this._yAxisScale=1,this._cameraTransform=o.y3.Identity(),this._deltaTransform=o.P.Zero(),this._vector3=o.P.Zero(),this._vector2=o.FM.Zero()}get invertYAxis(){return 1!==this._yAxisScale}set invertYAxis(e){this._yAxisScale=e?-1:1}attachControl(){const e=this.camera.getScene().gamepadManager;this._onGamepadConnectedObserver=e.onGamepadConnectedObservable.add((e=>{e.type!==tt.POSE_ENABLED&&(this.gamepad&&e.type!==tt.XBOX||(this.gamepad=e))})),this._onGamepadDisconnectedObserver=e.onGamepadDisconnectedObservable.add((e=>{this.gamepad===e&&(this.gamepad=null)})),this.gamepad=e.getGamepadByType(tt.XBOX),!this.gamepad&&e.gamepads.length&&(this.gamepad=e.gamepads[0])}detachControl(){this.camera.getScene().gamepadManager.onGamepadConnectedObservable.remove(this._onGamepadConnectedObserver),this.camera.getScene().gamepadManager.onGamepadDisconnectedObservable.remove(this._onGamepadDisconnectedObserver),this.gamepad=null}checkInputs(){if(this.gamepad&&this.gamepad.leftStick){const e=this.camera,t=this.gamepad.leftStick;0!==this.gamepadMoveSensibility&&(t.x=Math.abs(t.x)>this.deadzoneDelta?t.x/this.gamepadMoveSensibility:0,t.y=Math.abs(t.y)>this.deadzoneDelta?t.y/this.gamepadMoveSensibility:0);let i=this.gamepad.rightStick;i&&0!==this.gamepadAngularSensibility?(i.x=Math.abs(i.x)>this.deadzoneDelta?i.x/this.gamepadAngularSensibility:0,i.y=(Math.abs(i.y)>this.deadzoneDelta?i.y/this.gamepadAngularSensibility:0)*this._yAxisScale):i={x:0,y:0},e.rotationQuaternion?e.rotationQuaternion.toRotationMatrix(this._cameraTransform):o.y3.RotationYawPitchRollToRef(e.rotation.y,e.rotation.x,0,this._cameraTransform);const n=50*e._computeLocalCameraSpeed();this._vector3.copyFromFloats(t.x*n,0,-t.y*n),o.P.TransformCoordinatesToRef(this._vector3,this._cameraTransform,this._deltaTransform),e.cameraDirection.addInPlace(this._deltaTransform),this._vector2.copyFromFloats(i.y,i.x),e.cameraRotation.addInPlace(this._vector2)}}getClassName(){return"FreeCameraGamepadInput"}getSimpleName(){return"gamepad"}}(0,be.gn)([(0,Te.qC)()],xt.prototype,"gamepadAngularSensibility",void 0),(0,be.gn)([(0,Te.qC)()],xt.prototype,"gamepadMoveSensibility",void 0),Je.u.FreeCameraGamepadInput=xt;var bt,Tt=i(1399),St=i(3516),Et=i(9891),Ct=i(7932),At=i(7090);!function(e){e[e.X=0]="X",e[e.Y=1]="Y",e[e.Z=2]="Z"}(bt||(bt={}));class Pt{static _GetDefaultOptions(){return{puckSize:40,containerSize:60,color:"cyan",puckImage:void 0,containerImage:void 0,position:void 0,alwaysVisible:!1,limitToContainer:!1}}constructor(e,t){this._released=!1;const i={...Pt._GetDefaultOptions(),...t};if(this._leftJoystick=!!e,Pt._GlobalJoystickIndex++,this._axisTargetedByLeftAndRight=bt.X,this._axisTargetedByUpAndDown=bt.Y,this.reverseLeftRight=!1,this.reverseUpDown=!1,this._touches=new At.x,this.deltaPosition=o.P.Zero(),this._joystickSensibility=25,this._inversedSensibility=1/(this._joystickSensibility/1e3),this._onResize=()=>{Pt._VJCanvasWidth=window.innerWidth,Pt._VJCanvasHeight=window.innerHeight,Pt.Canvas&&(Pt.Canvas.width=Pt._VJCanvasWidth,Pt.Canvas.height=Pt._VJCanvasHeight),Pt._HalfWidth=Pt._VJCanvasWidth/2},!Pt.Canvas){window.addEventListener("resize",this._onResize,!1),Pt.Canvas=document.createElement("canvas"),Pt._VJCanvasWidth=window.innerWidth,Pt._VJCanvasHeight=window.innerHeight,Pt.Canvas.width=window.innerWidth,Pt.Canvas.height=window.innerHeight,Pt.Canvas.style.width="100%",Pt.Canvas.style.height="100%",Pt.Canvas.style.position="absolute",Pt.Canvas.style.backgroundColor="transparent",Pt.Canvas.style.top="0px",Pt.Canvas.style.left="0px",Pt.Canvas.style.zIndex="5",Pt.Canvas.style.touchAction="none",Pt.Canvas.setAttribute("touch-action","none");const e=Pt.Canvas.getContext("2d");if(!e)throw new Error("Unable to create canvas for virtual joystick");Pt._VJCanvasContext=e,Pt._VJCanvasContext.strokeStyle="#ffffff",Pt._VJCanvasContext.lineWidth=2,document.body.appendChild(Pt.Canvas)}Pt._HalfWidth=Pt.Canvas.width/2,this.pressed=!1,this.limitToContainer=i.limitToContainer,this._joystickColor=i.color,this.containerSize=i.containerSize,this.puckSize=i.puckSize,i.position&&this.setPosition(i.position.x,i.position.y),i.puckImage&&this.setPuckImage(i.puckImage),i.containerImage&&this.setContainerImage(i.containerImage),i.alwaysVisible&&Pt._AlwaysVisibleSticks++,this.alwaysVisible=i.alwaysVisible,this._joystickPointerId=-1,this._joystickPointerPos=new o.FM(0,0),this._joystickPreviousPointerPos=new o.FM(0,0),this._joystickPointerStartPos=new o.FM(0,0),this._deltaJoystickVector=new o.FM(0,0),this._onPointerDownHandlerRef=e=>{this._onPointerDown(e)},this._onPointerMoveHandlerRef=e=>{this._onPointerMove(e)},this._onPointerUpHandlerRef=e=>{this._onPointerUp(e)},Pt.Canvas.addEventListener("pointerdown",this._onPointerDownHandlerRef,!1),Pt.Canvas.addEventListener("pointermove",this._onPointerMoveHandlerRef,!1),Pt.Canvas.addEventListener("pointerup",this._onPointerUpHandlerRef,!1),Pt.Canvas.addEventListener("pointerout",this._onPointerUpHandlerRef,!1),Pt.Canvas.addEventListener("contextmenu",(e=>{e.preventDefault()}),!1),requestAnimationFrame((()=>{this._drawVirtualJoystick()}))}setJoystickSensibility(e){this._joystickSensibility=e,this._inversedSensibility=1/(this._joystickSensibility/1e3)}_onPointerDown(e){let t;e.preventDefault(),t=!0===this._leftJoystick?e.clientX<Pt._HalfWidth:e.clientX>Pt._HalfWidth,t&&this._joystickPointerId<0?(this._joystickPointerId=e.pointerId,this._joystickPosition?(this._joystickPointerStartPos=this._joystickPosition.clone(),this._joystickPointerPos=this._joystickPosition.clone(),this._joystickPreviousPointerPos=this._joystickPosition.clone(),this._onPointerMove(e)):(this._joystickPointerStartPos.x=e.clientX,this._joystickPointerStartPos.y=e.clientY,this._joystickPointerPos=this._joystickPointerStartPos.clone(),this._joystickPreviousPointerPos=this._joystickPointerStartPos.clone()),this._deltaJoystickVector.x=0,this._deltaJoystickVector.y=0,this.pressed=!0,this._touches.add(e.pointerId.toString(),e)):Pt._GlobalJoystickIndex<2&&this._action&&(this._action(),this._touches.add(e.pointerId.toString(),{x:e.clientX,y:e.clientY,prevX:e.clientX,prevY:e.clientY}))}_onPointerMove(e){if(this._joystickPointerId==e.pointerId){if(this.limitToContainer){const t=new o.FM(e.clientX-this._joystickPointerStartPos.x,e.clientY-this._joystickPointerStartPos.y),i=t.length();i>this.containerSize&&t.scaleInPlace(this.containerSize/i),this._joystickPointerPos.x=this._joystickPointerStartPos.x+t.x,this._joystickPointerPos.y=this._joystickPointerStartPos.y+t.y}else this._joystickPointerPos.x=e.clientX,this._joystickPointerPos.y=e.clientY;this._deltaJoystickVector=this._joystickPointerPos.clone(),this._deltaJoystickVector=this._deltaJoystickVector.subtract(this._joystickPointerStartPos),0<Pt._AlwaysVisibleSticks&&(this._leftJoystick?this._joystickPointerPos.x=Math.min(Pt._HalfWidth,this._joystickPointerPos.x):this._joystickPointerPos.x=Math.max(Pt._HalfWidth,this._joystickPointerPos.x));const t=(this.reverseLeftRight?-1:1)*this._deltaJoystickVector.x/this._inversedSensibility;switch(this._axisTargetedByLeftAndRight){case bt.X:this.deltaPosition.x=Math.min(1,Math.max(-1,t));break;case bt.Y:this.deltaPosition.y=Math.min(1,Math.max(-1,t));break;case bt.Z:this.deltaPosition.z=Math.min(1,Math.max(-1,t))}const i=(this.reverseUpDown?1:-1)*this._deltaJoystickVector.y/this._inversedSensibility;switch(this._axisTargetedByUpAndDown){case bt.X:this.deltaPosition.x=Math.min(1,Math.max(-1,i));break;case bt.Y:this.deltaPosition.y=Math.min(1,Math.max(-1,i));break;case bt.Z:this.deltaPosition.z=Math.min(1,Math.max(-1,i))}}else{const t=this._touches.get(e.pointerId.toString());t&&(t.x=e.clientX,t.y=e.clientY)}}_onPointerUp(e){if(this._joystickPointerId==e.pointerId)this._clearPreviousDraw(),this._joystickPointerId=-1,this.pressed=!1;else{const t=this._touches.get(e.pointerId.toString());t&&Pt._VJCanvasContext.clearRect(t.prevX-44,t.prevY-44,88,88)}this._deltaJoystickVector.x=0,this._deltaJoystickVector.y=0,this._touches.remove(e.pointerId.toString())}setJoystickColor(e){this._joystickColor=e}set containerSize(e){this._joystickContainerSize=e,this._clearContainerSize=~~(2.1*this._joystickContainerSize),this._clearContainerSizeOffset=~~(this._clearContainerSize/2)}get containerSize(){return this._joystickContainerSize}set puckSize(e){this._joystickPuckSize=e,this._clearPuckSize=~~(2.1*this._joystickPuckSize),this._clearPuckSizeOffset=~~(this._clearPuckSize/2)}get puckSize(){return this._joystickPuckSize}clearPosition(){this.alwaysVisible=!1,this._joystickPosition=null}set alwaysVisible(e){this._alwaysVisible!==e&&(e&&this._joystickPosition?(Pt._AlwaysVisibleSticks++,this._alwaysVisible=!0):(Pt._AlwaysVisibleSticks--,this._alwaysVisible=!1))}get alwaysVisible(){return this._alwaysVisible}setPosition(e,t){this._joystickPointerStartPos&&this._clearPreviousDraw(),this._joystickPosition=new o.FM(e,t)}setActionOnTouch(e){this._action=e}setAxisForLeftRight(e){switch(e){case bt.X:case bt.Y:case bt.Z:this._axisTargetedByLeftAndRight=e;break;default:this._axisTargetedByLeftAndRight=bt.X}}setAxisForUpDown(e){switch(e){case bt.X:case bt.Y:case bt.Z:this._axisTargetedByUpAndDown=e;break;default:this._axisTargetedByUpAndDown=bt.Y}}_clearPreviousDraw(){const e=this._joystickPosition||this._joystickPointerStartPos;Pt._VJCanvasContext.clearRect(e.x-this._clearContainerSizeOffset,e.y-this._clearContainerSizeOffset,this._clearContainerSize,this._clearContainerSize),Pt._VJCanvasContext.clearRect(this._joystickPreviousPointerPos.x-this._clearPuckSizeOffset-1,this._joystickPreviousPointerPos.y-this._clearPuckSizeOffset-1,this._clearPuckSize+2,this._clearPuckSize+2)}setContainerImage(e){const t=new Image;t.src=e,t.onload=()=>this._containerImage=t}setPuckImage(e){const t=new Image;t.src=e,t.onload=()=>this._puckImage=t}_drawContainer(){const e=this._joystickPosition||this._joystickPointerStartPos;this._clearPreviousDraw(),this._containerImage?Pt._VJCanvasContext.drawImage(this._containerImage,e.x-this.containerSize,e.y-this.containerSize,2*this.containerSize,2*this.containerSize):(Pt._VJCanvasContext.beginPath(),Pt._VJCanvasContext.strokeStyle=this._joystickColor,Pt._VJCanvasContext.lineWidth=2,Pt._VJCanvasContext.arc(e.x,e.y,this.containerSize,0,2*Math.PI,!0),Pt._VJCanvasContext.stroke(),Pt._VJCanvasContext.closePath(),Pt._VJCanvasContext.beginPath(),Pt._VJCanvasContext.lineWidth=6,Pt._VJCanvasContext.strokeStyle=this._joystickColor,Pt._VJCanvasContext.arc(e.x,e.y,this.puckSize,0,2*Math.PI,!0),Pt._VJCanvasContext.stroke(),Pt._VJCanvasContext.closePath())}_drawPuck(){this._puckImage?Pt._VJCanvasContext.drawImage(this._puckImage,this._joystickPointerPos.x-this.puckSize,this._joystickPointerPos.y-this.puckSize,2*this.puckSize,2*this.puckSize):(Pt._VJCanvasContext.beginPath(),Pt._VJCanvasContext.strokeStyle=this._joystickColor,Pt._VJCanvasContext.lineWidth=2,Pt._VJCanvasContext.arc(this._joystickPointerPos.x,this._joystickPointerPos.y,this.puckSize,0,2*Math.PI,!0),Pt._VJCanvasContext.stroke(),Pt._VJCanvasContext.closePath())}_drawVirtualJoystick(){this._released||(this.alwaysVisible&&this._drawContainer(),this.pressed&&this._touches.forEach(((e,t)=>{t.pointerId===this._joystickPointerId?(this.alwaysVisible||this._drawContainer(),this._drawPuck(),this._joystickPreviousPointerPos=this._joystickPointerPos.clone()):(Pt._VJCanvasContext.clearRect(t.prevX-44,t.prevY-44,88,88),Pt._VJCanvasContext.beginPath(),Pt._VJCanvasContext.fillStyle="white",Pt._VJCanvasContext.beginPath(),Pt._VJCanvasContext.strokeStyle="red",Pt._VJCanvasContext.lineWidth=6,Pt._VJCanvasContext.arc(t.x,t.y,40,0,2*Math.PI,!0),Pt._VJCanvasContext.stroke(),Pt._VJCanvasContext.closePath(),t.prevX=t.x,t.prevY=t.y)})),requestAnimationFrame((()=>{this._drawVirtualJoystick()})))}releaseCanvas(){Pt.Canvas&&(Pt.Canvas.removeEventListener("pointerdown",this._onPointerDownHandlerRef),Pt.Canvas.removeEventListener("pointermove",this._onPointerMoveHandlerRef),Pt.Canvas.removeEventListener("pointerup",this._onPointerUpHandlerRef),Pt.Canvas.removeEventListener("pointerout",this._onPointerUpHandlerRef),window.removeEventListener("resize",this._onResize),document.body.removeChild(Pt.Canvas),Pt.Canvas=null),this._released=!0}}Pt._GlobalJoystickIndex=0,Pt._AlwaysVisibleSticks=0,vt.a.prototype.addVirtualJoystick=function(){return this.add(new Rt),this};class Rt{getLeftJoystick(){return this._leftjoystick}getRightJoystick(){return this._rightjoystick}checkInputs(){if(this._leftjoystick){const e=this.camera,t=50*e._computeLocalCameraSpeed(),i=o.y3.RotationYawPitchRoll(e.rotation.y,e.rotation.x,0),n=o.P.TransformCoordinates(new o.P(this._leftjoystick.deltaPosition.x*t,this._leftjoystick.deltaPosition.y*t,this._leftjoystick.deltaPosition.z*t),i);e.cameraDirection=e.cameraDirection.add(n),e.cameraRotation=e.cameraRotation.addVector3(this._rightjoystick.deltaPosition),this._leftjoystick.pressed||(this._leftjoystick.deltaPosition=this._leftjoystick.deltaPosition.scale(.9)),this._rightjoystick.pressed||(this._rightjoystick.deltaPosition=this._rightjoystick.deltaPosition.scale(.9))}}attachControl(){this._leftjoystick=new Pt(!0),this._leftjoystick.setAxisForUpDown(bt.Z),this._leftjoystick.setAxisForLeftRight(bt.X),this._leftjoystick.setJoystickSensibility(.15),this._rightjoystick=new Pt(!1),this._rightjoystick.setAxisForUpDown(bt.X),this._rightjoystick.setAxisForLeftRight(bt.Y),this._rightjoystick.reverseUpDown=!0,this._rightjoystick.setJoystickSensibility(.05),this._rightjoystick.setJoystickColor("yellow")}detachControl(){this._leftjoystick.releaseCanvas(),this._rightjoystick.releaseCanvas()}getClassName(){return"FreeCameraVirtualJoystickInput"}getSimpleName(){return"virtualJoystick"}}Je.u.FreeCameraVirtualJoystickInput=Rt;var Mt=i(2704),It=i(3835),Dt=i(8482),Ot=i(9257);Ot.N.AddNodeConstructor("TouchCamera",((e,t)=>()=>new wt(e,o.P.Zero(),t)));class wt extends Dt.c{get touchAngularSensibility(){const e=this.inputs.attached.touch;return e?e.touchAngularSensibility:0}set touchAngularSensibility(e){const t=this.inputs.attached.touch;t&&(t.touchAngularSensibility=e)}get touchMoveSensibility(){const e=this.inputs.attached.touch;return e?e.touchMoveSensibility:0}set touchMoveSensibility(e){const t=this.inputs.attached.touch;t&&(t.touchMoveSensibility=e)}constructor(e,t,i){super(e,t,i),this.inputs.addTouch(),this._setupInputs()}getClassName(){return"TouchCamera"}_setupInputs(){const e=this.inputs.attached.touch,t=this.inputs.attached.mouse;t?t.touchEnabled=!1:e.allowMouse=!0}}var Nt=i(4496);Ot.N.AddNodeConstructor("ArcRotateCamera",((e,t)=>()=>new Ft(e,0,0,1,o.P.Zero(),t)));class Ft extends It.C{get target(){return this._target}set target(e){this.setTarget(e)}get targetHost(){return this._targetHost}set targetHost(e){e&&this.setTarget(e)}getTarget(){return this.target}get position(){return this._position}set position(e){this.setPosition(e)}set upVector(e){this._upToYMatrix||(this._yToUpMatrix=new o.y3,this._upToYMatrix=new o.y3,this._upVector=o.P.Zero()),e.normalize(),this._upVector.copyFrom(e),this.setMatUp()}get upVector(){return this._upVector}setMatUp(){o.y3.RotationAlignToRef(o.P.UpReadOnly,this._upVector,this._yToUpMatrix),o.y3.RotationAlignToRef(this._upVector,o.P.UpReadOnly,this._upToYMatrix)}get angularSensibilityX(){const e=this.inputs.attached.pointers;return e?e.angularSensibilityX:0}set angularSensibilityX(e){const t=this.inputs.attached.pointers;t&&(t.angularSensibilityX=e)}get angularSensibilityY(){const e=this.inputs.attached.pointers;return e?e.angularSensibilityY:0}set angularSensibilityY(e){const t=this.inputs.attached.pointers;t&&(t.angularSensibilityY=e)}get pinchPrecision(){const e=this.inputs.attached.pointers;return e?e.pinchPrecision:0}set pinchPrecision(e){const t=this.inputs.attached.pointers;t&&(t.pinchPrecision=e)}get pinchDeltaPercentage(){const e=this.inputs.attached.pointers;return e?e.pinchDeltaPercentage:0}set pinchDeltaPercentage(e){const t=this.inputs.attached.pointers;t&&(t.pinchDeltaPercentage=e)}get useNaturalPinchZoom(){const e=this.inputs.attached.pointers;return!!e&&e.useNaturalPinchZoom}set useNaturalPinchZoom(e){const t=this.inputs.attached.pointers;t&&(t.useNaturalPinchZoom=e)}get panningSensibility(){const e=this.inputs.attached.pointers;return e?e.panningSensibility:0}set panningSensibility(e){const t=this.inputs.attached.pointers;t&&(t.panningSensibility=e)}get keysUp(){const e=this.inputs.attached.keyboard;return e?e.keysUp:[]}set keysUp(e){const t=this.inputs.attached.keyboard;t&&(t.keysUp=e)}get keysDown(){const e=this.inputs.attached.keyboard;return e?e.keysDown:[]}set keysDown(e){const t=this.inputs.attached.keyboard;t&&(t.keysDown=e)}get keysLeft(){const e=this.inputs.attached.keyboard;return e?e.keysLeft:[]}set keysLeft(e){const t=this.inputs.attached.keyboard;t&&(t.keysLeft=e)}get keysRight(){const e=this.inputs.attached.keyboard;return e?e.keysRight:[]}set keysRight(e){const t=this.inputs.attached.keyboard;t&&(t.keysRight=e)}get wheelPrecision(){const e=this.inputs.attached.mousewheel;return e?e.wheelPrecision:0}set wheelPrecision(e){const t=this.inputs.attached.mousewheel;t&&(t.wheelPrecision=e)}get zoomToMouseLocation(){const e=this.inputs.attached.mousewheel;return!!e&&e.zoomToMouseLocation}set zoomToMouseLocation(e){const t=this.inputs.attached.mousewheel;t&&(t.zoomToMouseLocation=e)}get wheelDeltaPercentage(){const e=this.inputs.attached.mousewheel;return e?e.wheelDeltaPercentage:0}set wheelDeltaPercentage(e){const t=this.inputs.attached.mousewheel;t&&(t.wheelDeltaPercentage=e)}get bouncingBehavior(){return this._bouncingBehavior}get useBouncingBehavior(){return null!=this._bouncingBehavior}set useBouncingBehavior(e){e!==this.useBouncingBehavior&&(e?(this._bouncingBehavior=new De,this.addBehavior(this._bouncingBehavior)):this._bouncingBehavior&&(this.removeBehavior(this._bouncingBehavior),this._bouncingBehavior=null))}get framingBehavior(){return this._framingBehavior}get useFramingBehavior(){return null!=this._framingBehavior}set useFramingBehavior(e){e!==this.useFramingBehavior&&(e?(this._framingBehavior=new Oe,this.addBehavior(this._framingBehavior)):this._framingBehavior&&(this.removeBehavior(this._framingBehavior),this._framingBehavior=null))}get autoRotationBehavior(){return this._autoRotationBehavior}get useAutoRotationBehavior(){return null!=this._autoRotationBehavior}set useAutoRotationBehavior(e){e!==this.useAutoRotationBehavior&&(e?(this._autoRotationBehavior=new Ie,this.addBehavior(this._autoRotationBehavior)):this._autoRotationBehavior&&(this.removeBehavior(this._autoRotationBehavior),this._autoRotationBehavior=null))}constructor(e,t,i,n,s,a,l=!0){super(e,o.P.Zero(),a,l),this.inertialAlphaOffset=0,this.inertialBetaOffset=0,this.inertialRadiusOffset=0,this.lowerAlphaLimit=null,this.upperAlphaLimit=null,this.lowerBetaLimit=.01,this.upperBetaLimit=Math.PI-.01,this.lowerRadiusLimit=null,this.upperRadiusLimit=null,this.inertialPanningX=0,this.inertialPanningY=0,this.pinchToPanMaxDistance=20,this.panningDistanceLimit=null,this.panningOriginTarget=o.P.Zero(),this.panningInertia=.9,this.zoomOnFactor=1,this.targetScreenOffset=o.FM.Zero(),this.allowUpsideDown=!0,this.useInputToRestoreState=!0,this._viewMatrix=new o.y3,this.panningAxis=new o.P(1,1,0),this._transformedDirection=new o.P,this.mapPanning=!1,this.onMeshTargetChangedObservable=new r.y$,this.checkCollisions=!1,this.collisionRadius=new o.P(.5,.5,.5),this._previousPosition=o.P.Zero(),this._collisionVelocity=o.P.Zero(),this._newPosition=o.P.Zero(),this._computationVector=o.P.Zero(),this._onCollisionPositionChange=(e,t,i=null)=>{i?(this.setPosition(t),this.onCollide&&this.onCollide(i)):this._previousPosition.copyFrom(this._position);const n=Math.cos(this.alpha),s=Math.sin(this.alpha),r=Math.cos(this.beta);let o=Math.sin(this.beta);0===o&&(o=1e-4);const a=this._getTargetPosition();this._computationVector.copyFromFloats(this.radius*n*o,this.radius*r,this.radius*s*o),a.addToRef(this._computationVector,this._newPosition),this._position.copyFrom(this._newPosition);let l=this.upVector;this.allowUpsideDown&&this.beta<0&&(l=l.clone(),l=l.negate()),this._computeViewMatrix(this._position,a,l),this._viewMatrix.addAtIndex(12,this.targetScreenOffset.x),this._viewMatrix.addAtIndex(13,this.targetScreenOffset.y),this._collisionTriggered=!1},this._target=o.P.Zero(),s&&this.setTarget(s),this.alpha=t,this.beta=i,this.radius=n,this.getViewMatrix(),this.inputs=new ut(this),this.inputs.addKeyboard().addMouseWheel().addPointers()}_initCache(){super._initCache(),this._cache._target=new o.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),this._cache.alpha=void 0,this._cache.beta=void 0,this._cache.radius=void 0,this._cache.targetScreenOffset=o.FM.Zero()}_updateCache(e){e||super._updateCache(),this._cache._target.copyFrom(this._getTargetPosition()),this._cache.alpha=this.alpha,this._cache.beta=this.beta,this._cache.radius=this.radius,this._cache.targetScreenOffset.copyFrom(this.targetScreenOffset)}_getTargetPosition(){if(this._targetHost&&this._targetHost.getAbsolutePosition){const e=this._targetHost.getAbsolutePosition();this._targetBoundingCenter?e.addToRef(this._targetBoundingCenter,this._target):this._target.copyFrom(e)}return this._getLockedTargetPosition()||this._target}storeState(){return this._storedAlpha=this.alpha,this._storedBeta=this.beta,this._storedRadius=this.radius,this._storedTarget=this._getTargetPosition().clone(),this._storedTargetScreenOffset=this.targetScreenOffset.clone(),super.storeState()}_restoreStateValues(){return!!super._restoreStateValues()&&(this.setTarget(this._storedTarget.clone()),this.alpha=this._storedAlpha,this.beta=this._storedBeta,this.radius=this._storedRadius,this.targetScreenOffset=this._storedTargetScreenOffset.clone(),this.inertialAlphaOffset=0,this.inertialBetaOffset=0,this.inertialRadiusOffset=0,this.inertialPanningX=0,this.inertialPanningY=0,!0)}_isSynchronizedViewMatrix(){return!!super._isSynchronizedViewMatrix()&&this._cache._target.equals(this._getTargetPosition())&&this._cache.alpha===this.alpha&&this._cache.beta===this.beta&&this._cache.radius===this.radius&&this._cache.targetScreenOffset.equals(this.targetScreenOffset)}attachControl(e,t,i=!0,n=2){const s=arguments;t=de.w1.BackCompatCameraNoPreventDefault(s),this._useCtrlForPanning=i,this._panningMouseButton=n,"boolean"==typeof s[0]&&(s.length>1&&(this._useCtrlForPanning=s[1]),s.length>2&&(this._panningMouseButton=s[2])),this.inputs.attachElement(t),this._reset=()=>{this.inertialAlphaOffset=0,this.inertialBetaOffset=0,this.inertialRadiusOffset=0,this.inertialPanningX=0,this.inertialPanningY=0}}detachControl(){this.inputs.detachElement(),this._reset&&this._reset()}_checkInputs(){if(!this._collisionTriggered){if(this.inputs.checkInputs(),0!==this.inertialAlphaOffset||0!==this.inertialBetaOffset||0!==this.inertialRadiusOffset){const e=this.invertRotation?-1:1;let t=this.inertialAlphaOffset;this.beta<=0&&(t*=-1),this.getScene().useRightHandedSystem&&(t*=-1),this.parent&&this.parent._getWorldMatrixDeterminant()<0&&(t*=-1),this.alpha+=t*e,this.beta+=this.inertialBetaOffset*e,this.radius-=this.inertialRadiusOffset,this.inertialAlphaOffset*=this.inertia,this.inertialBetaOffset*=this.inertia,this.inertialRadiusOffset*=this.inertia,Math.abs(this.inertialAlphaOffset)<Me.kn&&(this.inertialAlphaOffset=0),Math.abs(this.inertialBetaOffset)<Me.kn&&(this.inertialBetaOffset=0),Math.abs(this.inertialRadiusOffset)<this.speed*Me.kn&&(this.inertialRadiusOffset=0)}if(0!==this.inertialPanningX||0!==this.inertialPanningY){const e=new o.P(this.inertialPanningX,this.inertialPanningY,this.inertialPanningY);this._viewMatrix.invertToRef(this._cameraTransformMatrix),e.multiplyInPlace(this.panningAxis),o.P.TransformNormalToRef(e,this._cameraTransformMatrix,this._transformedDirection),!this.mapPanning&&this.panningAxis.y||(this._transformedDirection.y=0),this._targetHost||(this.panningDistanceLimit?(this._transformedDirection.addInPlace(this._target),o.P.DistanceSquared(this._transformedDirection,this.panningOriginTarget)<=this.panningDistanceLimit*this.panningDistanceLimit&&this._target.copyFrom(this._transformedDirection)):this._target.addInPlace(this._transformedDirection)),this.inertialPanningX*=this.panningInertia,this.inertialPanningY*=this.panningInertia,Math.abs(this.inertialPanningX)<this.speed*Me.kn&&(this.inertialPanningX=0),Math.abs(this.inertialPanningY)<this.speed*Me.kn&&(this.inertialPanningY=0)}this._checkLimits(),super._checkInputs()}}_checkLimits(){null===this.lowerBetaLimit||void 0===this.lowerBetaLimit?this.allowUpsideDown&&this.beta>Math.PI&&(this.beta=this.beta-2*Math.PI):this.beta<this.lowerBetaLimit&&(this.beta=this.lowerBetaLimit),null===this.upperBetaLimit||void 0===this.upperBetaLimit?this.allowUpsideDown&&this.beta<-Math.PI&&(this.beta=this.beta+2*Math.PI):this.beta>this.upperBetaLimit&&(this.beta=this.upperBetaLimit),null!==this.lowerAlphaLimit&&this.alpha<this.lowerAlphaLimit&&(this.alpha=this.lowerAlphaLimit),null!==this.upperAlphaLimit&&this.alpha>this.upperAlphaLimit&&(this.alpha=this.upperAlphaLimit),null!==this.lowerRadiusLimit&&this.radius<this.lowerRadiusLimit&&(this.radius=this.lowerRadiusLimit,this.inertialRadiusOffset=0),null!==this.upperRadiusLimit&&this.radius>this.upperRadiusLimit&&(this.radius=this.upperRadiusLimit,this.inertialRadiusOffset=0)}rebuildAnglesAndRadius(){this._position.subtractToRef(this._getTargetPosition(),this._computationVector),0===this._upVector.x&&1===this._upVector.y&&0===this._upVector.z||o.P.TransformCoordinatesToRef(this._computationVector,this._upToYMatrix,this._computationVector),this.radius=this._computationVector.length(),0===this.radius&&(this.radius=1e-4);const e=this.alpha;0===this._computationVector.x&&0===this._computationVector.z?this.alpha=Math.PI/2:this.alpha=Math.acos(this._computationVector.x/Math.sqrt(Math.pow(this._computationVector.x,2)+Math.pow(this._computationVector.z,2))),this._computationVector.z<0&&(this.alpha=2*Math.PI-this.alpha);const t=Math.round((e-this.alpha)/(2*Math.PI));this.alpha+=2*t*Math.PI,this.beta=Math.acos(this._computationVector.y/this.radius),this._checkLimits()}setPosition(e){this._position.equals(e)||(this._position.copyFrom(e),this.rebuildAnglesAndRadius())}setTarget(e,t=!1,i=!1,n=!1){var s;if(n=null!==(s=this.overrideCloneAlphaBetaRadius)&&void 0!==s?s:n,e.getBoundingInfo)this._targetBoundingCenter=t?e.getBoundingInfo().boundingBox.centerWorld.clone():null,e.computeWorldMatrix(),this._targetHost=e,this._target=this._getTargetPosition(),this.onMeshTargetChangedObservable.notifyObservers(this._targetHost);else{const t=e,n=this._getTargetPosition();if(n&&!i&&n.equals(t))return;this._targetHost=null,this._target=t,this._targetBoundingCenter=null,this.onMeshTargetChangedObservable.notifyObservers(null)}n||this.rebuildAnglesAndRadius()}_getViewMatrix(){const e=Math.cos(this.alpha),t=Math.sin(this.alpha),i=Math.cos(this.beta);let n=Math.sin(this.beta);0===n&&(n=1e-4),0===this.radius&&(this.radius=1e-4);const s=this._getTargetPosition();if(this._computationVector.copyFromFloats(this.radius*e*n,this.radius*i,this.radius*t*n),0===this._upVector.x&&1===this._upVector.y&&0===this._upVector.z||o.P.TransformCoordinatesToRef(this._computationVector,this._yToUpMatrix,this._computationVector),s.addToRef(this._computationVector,this._newPosition),this.getScene().collisionsEnabled&&this.checkCollisions){const e=this.getScene().collisionCoordinator;this._collider||(this._collider=e.createCollider()),this._collider._radius=this.collisionRadius,this._newPosition.subtractToRef(this._position,this._collisionVelocity),this._collisionTriggered=!0,e.getNewPosition(this._position,this._collisionVelocity,this._collider,3,null,this._onCollisionPositionChange,this.uniqueId)}else{this._position.copyFrom(this._newPosition);let e=this.upVector;this.allowUpsideDown&&n<0&&(e=e.negate()),this._computeViewMatrix(this._position,s,e),this._viewMatrix.addAtIndex(12,this.targetScreenOffset.x),this._viewMatrix.addAtIndex(13,this.targetScreenOffset.y)}return this._currentTarget=s,this._viewMatrix}zoomOn(e,t=!1){e=e||this.getScene().meshes;const i=Nt.Kj.MinMax(e),n=o.P.Distance(i.min,i.max);this.radius=n*this.zoomOnFactor,this.focusOn({min:i.min,max:i.max,distance:n},t)}focusOn(e,t=!1){let i,n;if(void 0===e.min){const t=e||this.getScene().meshes;i=Nt.Kj.MinMax(t),n=o.P.Distance(i.min,i.max)}else i=e,n=e.distance;this._target=Nt.Kj.Center(i),t||(this.maxZ=2*n)}createRigCamera(e,t){let i=0;switch(this.cameraRigMode){case Mt.V.RIG_MODE_STEREOSCOPIC_ANAGLYPH:case Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL:case Mt.V.RIG_MODE_STEREOSCOPIC_OVERUNDER:case Mt.V.RIG_MODE_STEREOSCOPIC_INTERLACED:case Mt.V.RIG_MODE_VR:i=this._cameraRigParams.stereoHalfAngle*(0===t?1:-1);break;case Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_CROSSEYED:i=this._cameraRigParams.stereoHalfAngle*(0===t?-1:1)}const n=new Ft(e,this.alpha+i,this.beta,this.radius,this._target,this.getScene());return n._cameraRigParams={},n.isRigCamera=!0,n.rigParent=this,n.upVector=this.upVector,n.mode=this.mode,n.orthoLeft=this.orthoLeft,n.orthoRight=this.orthoRight,n.orthoBottom=this.orthoBottom,n.orthoTop=this.orthoTop,n}_updateRigCameras(){const e=this._rigCameras[0],t=this._rigCameras[1];switch(e.beta=t.beta=this.beta,this.cameraRigMode){case Mt.V.RIG_MODE_STEREOSCOPIC_ANAGLYPH:case Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL:case Mt.V.RIG_MODE_STEREOSCOPIC_OVERUNDER:case Mt.V.RIG_MODE_STEREOSCOPIC_INTERLACED:case Mt.V.RIG_MODE_VR:e.alpha=this.alpha-this._cameraRigParams.stereoHalfAngle,t.alpha=this.alpha+this._cameraRigParams.stereoHalfAngle;break;case Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_CROSSEYED:e.alpha=this.alpha+this._cameraRigParams.stereoHalfAngle,t.alpha=this.alpha-this._cameraRigParams.stereoHalfAngle}super._updateRigCameras()}dispose(){this.inputs.clear(),super.dispose()}getClassName(){return"ArcRotateCamera"}}(0,be.gn)([(0,Te.qC)()],Ft.prototype,"alpha",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"beta",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"radius",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"overrideCloneAlphaBetaRadius",void 0),(0,be.gn)([(0,Te.hd)("target")],Ft.prototype,"_target",void 0),(0,be.gn)([(0,Te.RR)("targetHost")],Ft.prototype,"_targetHost",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"inertialAlphaOffset",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"inertialBetaOffset",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"inertialRadiusOffset",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"lowerAlphaLimit",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"upperAlphaLimit",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"lowerBetaLimit",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"upperBetaLimit",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"lowerRadiusLimit",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"upperRadiusLimit",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"inertialPanningX",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"inertialPanningY",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"pinchToPanMaxDistance",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"panningDistanceLimit",void 0),(0,be.gn)([(0,Te.hd)()],Ft.prototype,"panningOriginTarget",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"panningInertia",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"zoomToMouseLocation",null),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"zoomOnFactor",void 0),(0,be.gn)([(0,Te.QC)()],Ft.prototype,"targetScreenOffset",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"allowUpsideDown",void 0),(0,be.gn)([(0,Te.qC)()],Ft.prototype,"useInputToRestoreState",void 0),Ot.N.AddNodeConstructor("DeviceOrientationCamera",((e,t)=>()=>new Lt(e,o.P.Zero(),t)));class Lt extends Dt.c{constructor(e,t,i){super(e,t,i),this._tmpDragQuaternion=new o._f,this._disablePointerInputWhenUsingDeviceOrientation=!0,this._dragFactor=0,this._quaternionCache=new o._f,this.inputs.addDeviceOrientation(),this.inputs._deviceOrientationInput&&this.inputs._deviceOrientationInput._onDeviceOrientationChangedObservable.addOnce((()=>{this._disablePointerInputWhenUsingDeviceOrientation&&this.inputs._mouseInput&&(this.inputs._mouseInput._allowCameraRotation=!1,this.inputs._mouseInput.onPointerMovedObservable.add((e=>{0!=this._dragFactor&&(this._initialQuaternion||(this._initialQuaternion=new o._f),o._f.FromEulerAnglesToRef(0,e.offsetX*this._dragFactor,0,this._tmpDragQuaternion),this._initialQuaternion.multiplyToRef(this._tmpDragQuaternion,this._initialQuaternion))})))}))}get disablePointerInputWhenUsingDeviceOrientation(){return this._disablePointerInputWhenUsingDeviceOrientation}set disablePointerInputWhenUsingDeviceOrientation(e){this._disablePointerInputWhenUsingDeviceOrientation=e}enableHorizontalDragging(e=1/300){this._dragFactor=e}getClassName(){return"DeviceOrientationCamera"}_checkInputs(){super._checkInputs(),this._quaternionCache.copyFrom(this.rotationQuaternion),this._initialQuaternion&&this._initialQuaternion.multiplyToRef(this.rotationQuaternion,this.rotationQuaternion)}resetToCurrentRotation(e=We.RD.Y){this.rotationQuaternion&&(this._initialQuaternion||(this._initialQuaternion=new o._f),this._initialQuaternion.copyFrom(this._quaternionCache||this.rotationQuaternion),["x","y","z"].forEach((t=>{e[t]?this._initialQuaternion[t]*=-1:this._initialQuaternion[t]=0})),this._initialQuaternion.normalize(),this._initialQuaternion.multiplyToRef(this.rotationQuaternion,this.rotationQuaternion))}}class Bt extends Je.p{constructor(e){super(e)}addKeyboard(){return this.add(new pt),this}addMouse(){return this.add(new ft),this}}class Ut extends It.C{get angularSensibility(){const e=this.inputs.attached.mouse;return e?e.angularSensibility:0}set angularSensibility(e){const t=this.inputs.attached.mouse;t&&(t.angularSensibility=e)}get keysForward(){const e=this.inputs.attached.keyboard;return e?e.keysForward:[]}set keysForward(e){const t=this.inputs.attached.keyboard;t&&(t.keysForward=e)}get keysBackward(){const e=this.inputs.attached.keyboard;return e?e.keysBackward:[]}set keysBackward(e){const t=this.inputs.attached.keyboard;t&&(t.keysBackward=e)}get keysUp(){const e=this.inputs.attached.keyboard;return e?e.keysUp:[]}set keysUp(e){const t=this.inputs.attached.keyboard;t&&(t.keysUp=e)}get keysDown(){const e=this.inputs.attached.keyboard;return e?e.keysDown:[]}set keysDown(e){const t=this.inputs.attached.keyboard;t&&(t.keysDown=e)}get keysLeft(){const e=this.inputs.attached.keyboard;return e?e.keysLeft:[]}set keysLeft(e){const t=this.inputs.attached.keyboard;t&&(t.keysLeft=e)}get keysRight(){const e=this.inputs.attached.keyboard;return e?e.keysRight:[]}set keysRight(e){const t=this.inputs.attached.keyboard;t&&(t.keysRight=e)}constructor(e,t,i,n=!0){super(e,t,i,n),this.ellipsoid=new o.P(1,1,1),this.ellipsoidOffset=new o.P(0,0,0),this.checkCollisions=!1,this.applyGravity=!1,this.cameraDirection=o.P.Zero(),this._trackRoll=0,this.rollCorrect=100,this.bankedTurn=!1,this.bankedTurnLimit=Math.PI/2,this.bankedTurnMultiplier=1,this._needMoveForGravity=!1,this._oldPosition=o.P.Zero(),this._diffPosition=o.P.Zero(),this._newPosition=o.P.Zero(),this._collisionMask=-1,this._onCollisionPositionChange=(e,t,i=null)=>{(e=>{this._newPosition.copyFrom(e),this._newPosition.subtractToRef(this._oldPosition,this._diffPosition),this._diffPosition.length()>ue.D.CollisionsEpsilon&&(this.position.addInPlace(this._diffPosition),this.onCollide&&i&&this.onCollide(i))})(t)},this.inputs=new Bt(this),this.inputs.addKeyboard().addMouse()}attachControl(e,t){t=de.w1.BackCompatCameraNoPreventDefault(arguments),this.inputs.attachElement(t)}detachControl(){this.inputs.detachElement(),this.cameraDirection=new o.P(0,0,0)}get collisionMask(){return this._collisionMask}set collisionMask(e){this._collisionMask=isNaN(e)?-1:e}_collideWithWorld(e){let t;t=this.parent?o.P.TransformCoordinates(this.position,this.parent.getWorldMatrix()):this.position,t.subtractFromFloatsToRef(0,this.ellipsoid.y,0,this._oldPosition),this._oldPosition.addInPlace(this.ellipsoidOffset);const i=this.getScene().collisionCoordinator;this._collider||(this._collider=i.createCollider()),this._collider._radius=this.ellipsoid,this._collider.collisionMask=this._collisionMask;let n=e;this.applyGravity&&(n=e.add(this.getScene().gravity)),i.getNewPosition(this._oldPosition,n,this._collider,3,null,this._onCollisionPositionChange,this.uniqueId)}_checkInputs(){this._localDirection||(this._localDirection=o.P.Zero(),this._transformedDirection=o.P.Zero()),this.inputs.checkInputs(),super._checkInputs()}_decideIfNeedsToMove(){return this._needMoveForGravity||Math.abs(this.cameraDirection.x)>0||Math.abs(this.cameraDirection.y)>0||Math.abs(this.cameraDirection.z)>0}_updatePosition(){this.checkCollisions&&this.getScene().collisionsEnabled?this._collideWithWorld(this.cameraDirection):super._updatePosition()}restoreRoll(e){const t=this._trackRoll,i=t-this.rotation.z;Math.abs(i)>=.001&&(this.rotation.z+=i/e,Math.abs(t-this.rotation.z)<=.001&&(this.rotation.z=t))}dispose(){this.inputs.clear(),super.dispose()}getClassName(){return"FlyCamera"}}(0,be.gn)([(0,Te.hd)()],Ut.prototype,"ellipsoid",void 0),(0,be.gn)([(0,Te.hd)()],Ut.prototype,"ellipsoidOffset",void 0),(0,be.gn)([(0,Te.qC)()],Ut.prototype,"checkCollisions",void 0),(0,be.gn)([(0,Te.qC)()],Ut.prototype,"applyGravity",void 0);class Vt extends Je.p{constructor(e){super(e)}addKeyboard(){return this.add(new _t),this}addMouseWheel(){return this.add(new mt),this}addPointers(){return this.add(new gt),this}addVRDeviceOrientation(){return console.warn("DeviceOrientation support not yet implemented for FollowCamera."),this}}Ot.N.AddNodeConstructor("FollowCamera",((e,t)=>()=>new kt(e,o.P.Zero(),t))),Ot.N.AddNodeConstructor("ArcFollowCamera",((e,t)=>()=>new Gt(e,0,0,1,null,t)));class kt extends It.C{constructor(e,t,i,n=null){super(e,t,i),this.radius=12,this.lowerRadiusLimit=null,this.upperRadiusLimit=null,this.rotationOffset=0,this.lowerRotationOffsetLimit=null,this.upperRotationOffsetLimit=null,this.heightOffset=4,this.lowerHeightOffsetLimit=null,this.upperHeightOffsetLimit=null,this.cameraAcceleration=.05,this.maxCameraSpeed=20,this.lockedTarget=n,this.inputs=new Vt(this),this.inputs.addKeyboard().addMouseWheel().addPointers()}_follow(e){if(!e)return;const t=o.jp.Matrix[0];e.absoluteRotationQuaternion.toRotationMatrix(t);const i=Math.atan2(t.m[8],t.m[10]),n=de.w1.ToRadians(this.rotationOffset)+i,s=e.getAbsolutePosition(),r=s.x+Math.sin(n)*this.radius,a=s.z+Math.cos(n)*this.radius,l=r-this.position.x,h=s.y+this.heightOffset-this.position.y,c=a-this.position.z;let u=l*this.cameraAcceleration*2,d=h*this.cameraAcceleration,p=c*this.cameraAcceleration*2;(u>this.maxCameraSpeed||u<-this.maxCameraSpeed)&&(u=u<1?-this.maxCameraSpeed:this.maxCameraSpeed),(d>this.maxCameraSpeed||d<-this.maxCameraSpeed)&&(d=d<1?-this.maxCameraSpeed:this.maxCameraSpeed),(p>this.maxCameraSpeed||p<-this.maxCameraSpeed)&&(p=p<1?-this.maxCameraSpeed:this.maxCameraSpeed),this.position=new o.P(this.position.x+u,this.position.y+d,this.position.z+p),this.setTarget(s)}attachControl(e,t){t=de.w1.BackCompatCameraNoPreventDefault(arguments),this.inputs.attachElement(t),this._reset=()=>{}}detachControl(){this.inputs.detachElement(),this._reset&&this._reset()}_checkInputs(){this.inputs.checkInputs(),this._checkLimits(),super._checkInputs(),this.lockedTarget&&this._follow(this.lockedTarget)}_checkLimits(){null!==this.lowerRadiusLimit&&this.radius<this.lowerRadiusLimit&&(this.radius=this.lowerRadiusLimit),null!==this.upperRadiusLimit&&this.radius>this.upperRadiusLimit&&(this.radius=this.upperRadiusLimit),null!==this.lowerHeightOffsetLimit&&this.heightOffset<this.lowerHeightOffsetLimit&&(this.heightOffset=this.lowerHeightOffsetLimit),null!==this.upperHeightOffsetLimit&&this.heightOffset>this.upperHeightOffsetLimit&&(this.heightOffset=this.upperHeightOffsetLimit),null!==this.lowerRotationOffsetLimit&&this.rotationOffset<this.lowerRotationOffsetLimit&&(this.rotationOffset=this.lowerRotationOffsetLimit),null!==this.upperRotationOffsetLimit&&this.rotationOffset>this.upperRotationOffsetLimit&&(this.rotationOffset=this.upperRotationOffsetLimit)}getClassName(){return"FollowCamera"}}(0,be.gn)([(0,Te.qC)()],kt.prototype,"radius",void 0),(0,be.gn)([(0,Te.qC)()],kt.prototype,"lowerRadiusLimit",void 0),(0,be.gn)([(0,Te.qC)()],kt.prototype,"upperRadiusLimit",void 0),(0,be.gn)([(0,Te.qC)()],kt.prototype,"rotationOffset",void 0),(0,be.gn)([(0,Te.qC)()],kt.prototype,"lowerRotationOffsetLimit",void 0),(0,be.gn)([(0,Te.qC)()],kt.prototype,"upperRotationOffsetLimit",void 0),(0,be.gn)([(0,Te.qC)()],kt.prototype,"heightOffset",void 0),(0,be.gn)([(0,Te.qC)()],kt.prototype,"lowerHeightOffsetLimit",void 0),(0,be.gn)([(0,Te.qC)()],kt.prototype,"upperHeightOffsetLimit",void 0),(0,be.gn)([(0,Te.qC)()],kt.prototype,"cameraAcceleration",void 0),(0,be.gn)([(0,Te.qC)()],kt.prototype,"maxCameraSpeed",void 0),(0,be.gn)([(0,Te.RR)("lockedTargetId")],kt.prototype,"lockedTarget",void 0);class Gt extends It.C{constructor(e,t,i,n,s,r){super(e,o.P.Zero(),r),this.alpha=t,this.beta=i,this.radius=n,this._cartesianCoordinates=o.P.Zero(),this.setMeshTarget(s)}setMeshTarget(e){this._meshTarget=e,this._follow()}_follow(){if(!this._meshTarget)return;this._cartesianCoordinates.x=this.radius*Math.cos(this.alpha)*Math.cos(this.beta),this._cartesianCoordinates.y=this.radius*Math.sin(this.beta),this._cartesianCoordinates.z=this.radius*Math.sin(this.alpha)*Math.cos(this.beta);const e=this._meshTarget.getAbsolutePosition();this.position=e.add(this._cartesianCoordinates),this.setTarget(e)}_checkInputs(){super._checkInputs(),this._follow()}getClassName(){return"ArcFollowCamera"}}var zt,Wt,Ht,Xt,jt,Yt=i(450);!function(e){e[e.VIVE=0]="VIVE",e[e.OCULUS=1]="OCULUS",e[e.WINDOWS=2]="WINDOWS",e[e.GEAR_VR=3]="GEAR_VR",e[e.DAYDREAM=4]="DAYDREAM",e[e.GENERIC=5]="GENERIC"}(zt||(zt={}));class qt{static InitiateController(e){for(const t of this._ControllerFactories)if(t.canCreate(e))return t.create(e);if(this._DefaultControllerFactory)return this._DefaultControllerFactory(e);throw"The type of gamepad you are trying to load needs to be imported first or is not supported."}}qt._ControllerFactories=[],qt._DefaultControllerFactory=null;class Kt extends tt{_disableTrackPosition(e){this._trackPosition&&(this._calculatedPosition.copyFrom(e),this._trackPosition=!1)}constructor(e){super(e.id,e.index,e),this.isXR=!1,this._deviceRoomPosition=o.P.Zero(),this._deviceRoomRotationQuaternion=new o._f,this.devicePosition=o.P.Zero(),this.deviceRotationQuaternion=new o._f,this.deviceScaleFactor=1,this._trackPosition=!0,this._maxRotationDistFromHeadset=Math.PI/5,this._draggedRoomRotation=0,this._leftHandSystemQuaternion=new o._f,this._deviceToWorld=o.y3.Identity(),this._pointingPoseNode=null,this._workingMatrix=o.y3.Identity(),this._meshAttachedObservable=new r.y$,this.type=tt.POSE_ENABLED,this.controllerType=zt.GENERIC,this.position=o.P.Zero(),this.rotationQuaternion=new o._f,this._calculatedPosition=o.P.Zero(),this._calculatedRotation=new o._f,o._f.RotationYawPitchRollToRef(Math.PI,0,0,this._leftHandSystemQuaternion)}update(){super.update(),this._updatePoseAndMesh()}_updatePoseAndMesh(){if(this.isXR)return;const e=this.browserGamepad.pose;if(this.updateFromDevice(e),!this._trackPosition&&A.l.LastCreatedScene&&A.l.LastCreatedScene.activeCamera&&A.l.LastCreatedScene.activeCamera.devicePosition){const e=A.l.LastCreatedScene.activeCamera;if(e._computeDevicePosition(),this._deviceToWorld.setTranslation(e.devicePosition),e.deviceRotationQuaternion){e._deviceRoomRotationQuaternion.toEulerAnglesToRef(o.jp.Vector3[0]);const t=Math.atan2(Math.sin(o.jp.Vector3[0].y-this._draggedRoomRotation),Math.cos(o.jp.Vector3[0].y-this._draggedRoomRotation));if(Math.abs(t)>this._maxRotationDistFromHeadset){const e=t-(t<0?-this._maxRotationDistFromHeadset:this._maxRotationDistFromHeadset);this._draggedRoomRotation+=e;const i=Math.sin(-e),n=Math.cos(-e);this._calculatedPosition.x=this._calculatedPosition.x*n-this._calculatedPosition.z*i,this._calculatedPosition.z=this._calculatedPosition.x*i+this._calculatedPosition.z*n}}}o.P.TransformCoordinatesToRef(this._calculatedPosition,this._deviceToWorld,this.devicePosition),this._deviceToWorld.getRotationMatrixToRef(this._workingMatrix),o._f.FromRotationMatrixToRef(this._workingMatrix,this.deviceRotationQuaternion),this.deviceRotationQuaternion.multiplyInPlace(this._calculatedRotation),this._mesh&&(this._mesh.position.copyFrom(this.devicePosition),this._mesh.rotationQuaternion&&this._mesh.rotationQuaternion.copyFrom(this.deviceRotationQuaternion))}updateFromDevice(e){if(!this.isXR&&e){this.rawPose=e,e.position&&(this._deviceRoomPosition.copyFromFloats(e.position[0],e.position[1],-e.position[2]),this._mesh&&this._mesh.getScene().useRightHandedSystem&&(this._deviceRoomPosition.z*=-1),this._trackPosition&&this._deviceRoomPosition.scaleToRef(this.deviceScaleFactor,this._calculatedPosition),this._calculatedPosition.addInPlace(this.position));const t=this.rawPose;e.orientation&&t.orientation&&4===t.orientation.length&&(this._deviceRoomRotationQuaternion.copyFromFloats(t.orientation[0],t.orientation[1],-t.orientation[2],-t.orientation[3]),this._mesh&&(this._mesh.getScene().useRightHandedSystem?(this._deviceRoomRotationQuaternion.z*=-1,this._deviceRoomRotationQuaternion.w*=-1):this._deviceRoomRotationQuaternion.multiplyToRef(this._leftHandSystemQuaternion,this._deviceRoomRotationQuaternion)),this._deviceRoomRotationQuaternion.multiplyToRef(this.rotationQuaternion,this._calculatedRotation))}}attachToMesh(e){if(this._mesh&&(this._mesh.parent=null),this._mesh=e,this._poseControlledCamera&&(this._mesh.parent=this._poseControlledCamera),this._mesh.rotationQuaternion||(this._mesh.rotationQuaternion=new o._f),!this.isXR&&(this._updatePoseAndMesh(),this._pointingPoseNode)){const e=[];let t=this._pointingPoseNode;for(;t.parent;)e.push(t.parent),t=t.parent;e.reverse().forEach((e=>{e.computeWorldMatrix(!0)}))}this._meshAttachedObservable.notifyObservers(e)}attachToPoseControlledCamera(e){this._poseControlledCamera=e,this._mesh&&(this._mesh.parent=this._poseControlledCamera)}dispose(){this._mesh&&this._mesh.dispose(),this._mesh=null,super.dispose()}get mesh(){return this._mesh}getForwardRay(e=100){if(!this.mesh)return new Yt.z(o.P.Zero(),new o.P(0,0,1),e);const t=this._pointingPoseNode?this._pointingPoseNode.getWorldMatrix():this.mesh.getWorldMatrix(),i=t.getTranslation(),n=new o.P(0,0,-1),s=o.P.TransformNormal(n,t),r=o.P.Normalize(s);return new Yt.z(i,r,e)}}Kt.POINTING_POSE="POINTING_POSE",function(e){e[e.A=0]="A",e[e.B=1]="B",e[e.X=2]="X",e[e.Y=3]="Y",e[e.LB=4]="LB",e[e.RB=5]="RB",e[e.Back=8]="Back",e[e.Start=9]="Start",e[e.LeftStick=10]="LeftStick",e[e.RightStick=11]="RightStick"}(Wt||(Wt={})),function(e){e[e.Up=12]="Up",e[e.Down=13]="Down",e[e.Left=14]="Left",e[e.Right=15]="Right"}(Ht||(Ht={}));class $t extends tt{constructor(e,t,i,n=!1){super(e,t,i,0,1,2,3),this._leftTrigger=0,this._rightTrigger=0,this.onButtonDownObservable=new r.y$,this.onButtonUpObservable=new r.y$,this.onPadDownObservable=new r.y$,this.onPadUpObservable=new r.y$,this._buttonA=0,this._buttonB=0,this._buttonX=0,this._buttonY=0,this._buttonBack=0,this._buttonStart=0,this._buttonLB=0,this._buttonRB=0,this._buttonLeftStick=0,this._buttonRightStick=0,this._dPadUp=0,this._dPadDown=0,this._dPadLeft=0,this._dPadRight=0,this._isXboxOnePad=!1,this.type=tt.XBOX,this._isXboxOnePad=n}onlefttriggerchanged(e){this._onlefttriggerchanged=e}onrighttriggerchanged(e){this._onrighttriggerchanged=e}get leftTrigger(){return this._leftTrigger}set leftTrigger(e){this._onlefttriggerchanged&&this._leftTrigger!==e&&this._onlefttriggerchanged(e),this._leftTrigger=e}get rightTrigger(){return this._rightTrigger}set rightTrigger(e){this._onrighttriggerchanged&&this._rightTrigger!==e&&this._onrighttriggerchanged(e),this._rightTrigger=e}onbuttondown(e){this._onbuttondown=e}onbuttonup(e){this._onbuttonup=e}ondpaddown(e){this._ondpaddown=e}ondpadup(e){this._ondpadup=e}_setButtonValue(e,t,i){return e!==t&&(1===e&&(this._onbuttondown&&this._onbuttondown(i),this.onButtonDownObservable.notifyObservers(i)),0===e&&(this._onbuttonup&&this._onbuttonup(i),this.onButtonUpObservable.notifyObservers(i))),e}_setDPadValue(e,t,i){return e!==t&&(1===e&&(this._ondpaddown&&this._ondpaddown(i),this.onPadDownObservable.notifyObservers(i)),0===e&&(this._ondpadup&&this._ondpadup(i),this.onPadUpObservable.notifyObservers(i))),e}get buttonA(){return this._buttonA}set buttonA(e){this._buttonA=this._setButtonValue(e,this._buttonA,Wt.A)}get buttonB(){return this._buttonB}set buttonB(e){this._buttonB=this._setButtonValue(e,this._buttonB,Wt.B)}get buttonX(){return this._buttonX}set buttonX(e){this._buttonX=this._setButtonValue(e,this._buttonX,Wt.X)}get buttonY(){return this._buttonY}set buttonY(e){this._buttonY=this._setButtonValue(e,this._buttonY,Wt.Y)}get buttonStart(){return this._buttonStart}set buttonStart(e){this._buttonStart=this._setButtonValue(e,this._buttonStart,Wt.Start)}get buttonBack(){return this._buttonBack}set buttonBack(e){this._buttonBack=this._setButtonValue(e,this._buttonBack,Wt.Back)}get buttonLB(){return this._buttonLB}set buttonLB(e){this._buttonLB=this._setButtonValue(e,this._buttonLB,Wt.LB)}get buttonRB(){return this._buttonRB}set buttonRB(e){this._buttonRB=this._setButtonValue(e,this._buttonRB,Wt.RB)}get buttonLeftStick(){return this._buttonLeftStick}set buttonLeftStick(e){this._buttonLeftStick=this._setButtonValue(e,this._buttonLeftStick,Wt.LeftStick)}get buttonRightStick(){return this._buttonRightStick}set buttonRightStick(e){this._buttonRightStick=this._setButtonValue(e,this._buttonRightStick,Wt.RightStick)}get dPadUp(){return this._dPadUp}set dPadUp(e){this._dPadUp=this._setDPadValue(e,this._dPadUp,Ht.Up)}get dPadDown(){return this._dPadDown}set dPadDown(e){this._dPadDown=this._setDPadValue(e,this._dPadDown,Ht.Down)}get dPadLeft(){return this._dPadLeft}set dPadLeft(e){this._dPadLeft=this._setDPadValue(e,this._dPadLeft,Ht.Left)}get dPadRight(){return this._dPadRight}set dPadRight(e){this._dPadRight=this._setDPadValue(e,this._dPadRight,Ht.Right)}update(){super.update(),this._isXboxOnePad,this.buttonA=this.browserGamepad.buttons[0].value,this.buttonB=this.browserGamepad.buttons[1].value,this.buttonX=this.browserGamepad.buttons[2].value,this.buttonY=this.browserGamepad.buttons[3].value,this.buttonLB=this.browserGamepad.buttons[4].value,this.buttonRB=this.browserGamepad.buttons[5].value,this.leftTrigger=this.browserGamepad.buttons[6].value,this.rightTrigger=this.browserGamepad.buttons[7].value,this.buttonBack=this.browserGamepad.buttons[8].value,this.buttonStart=this.browserGamepad.buttons[9].value,this.buttonLeftStick=this.browserGamepad.buttons[10].value,this.buttonRightStick=this.browserGamepad.buttons[11].value,this.dPadUp=this.browserGamepad.buttons[12].value,this.dPadDown=this.browserGamepad.buttons[13].value,this.dPadLeft=this.browserGamepad.buttons[14].value,this.dPadRight=this.browserGamepad.buttons[15].value}dispose(){super.dispose(),this.onButtonDownObservable.clear(),this.onButtonUpObservable.clear(),this.onPadDownObservable.clear(),this.onPadUpObservable.clear()}}!function(e){e[e.Cross=0]="Cross",e[e.Circle=1]="Circle",e[e.Square=2]="Square",e[e.Triangle=3]="Triangle",e[e.L1=4]="L1",e[e.R1=5]="R1",e[e.Share=8]="Share",e[e.Options=9]="Options",e[e.LeftStick=10]="LeftStick",e[e.RightStick=11]="RightStick"}(Xt||(Xt={})),function(e){e[e.Up=12]="Up",e[e.Down=13]="Down",e[e.Left=14]="Left",e[e.Right=15]="Right"}(jt||(jt={}));class Qt extends tt{constructor(e,t,i){super(e.replace("STANDARD GAMEPAD","SONY PLAYSTATION DUALSHOCK"),t,i,0,1,2,3),this._leftTrigger=0,this._rightTrigger=0,this.onButtonDownObservable=new r.y$,this.onButtonUpObservable=new r.y$,this.onPadDownObservable=new r.y$,this.onPadUpObservable=new r.y$,this._buttonCross=0,this._buttonCircle=0,this._buttonSquare=0,this._buttonTriangle=0,this._buttonShare=0,this._buttonOptions=0,this._buttonL1=0,this._buttonR1=0,this._buttonLeftStick=0,this._buttonRightStick=0,this._dPadUp=0,this._dPadDown=0,this._dPadLeft=0,this._dPadRight=0,this.type=tt.DUALSHOCK}onlefttriggerchanged(e){this._onlefttriggerchanged=e}onrighttriggerchanged(e){this._onrighttriggerchanged=e}get leftTrigger(){return this._leftTrigger}set leftTrigger(e){this._onlefttriggerchanged&&this._leftTrigger!==e&&this._onlefttriggerchanged(e),this._leftTrigger=e}get rightTrigger(){return this._rightTrigger}set rightTrigger(e){this._onrighttriggerchanged&&this._rightTrigger!==e&&this._onrighttriggerchanged(e),this._rightTrigger=e}onbuttondown(e){this._onbuttondown=e}onbuttonup(e){this._onbuttonup=e}ondpaddown(e){this._ondpaddown=e}ondpadup(e){this._ondpadup=e}_setButtonValue(e,t,i){return e!==t&&(1===e&&(this._onbuttondown&&this._onbuttondown(i),this.onButtonDownObservable.notifyObservers(i)),0===e&&(this._onbuttonup&&this._onbuttonup(i),this.onButtonUpObservable.notifyObservers(i))),e}_setDPadValue(e,t,i){return e!==t&&(1===e&&(this._ondpaddown&&this._ondpaddown(i),this.onPadDownObservable.notifyObservers(i)),0===e&&(this._ondpadup&&this._ondpadup(i),this.onPadUpObservable.notifyObservers(i))),e}get buttonCross(){return this._buttonCross}set buttonCross(e){this._buttonCross=this._setButtonValue(e,this._buttonCross,Xt.Cross)}get buttonCircle(){return this._buttonCircle}set buttonCircle(e){this._buttonCircle=this._setButtonValue(e,this._buttonCircle,Xt.Circle)}get buttonSquare(){return this._buttonSquare}set buttonSquare(e){this._buttonSquare=this._setButtonValue(e,this._buttonSquare,Xt.Square)}get buttonTriangle(){return this._buttonTriangle}set buttonTriangle(e){this._buttonTriangle=this._setButtonValue(e,this._buttonTriangle,Xt.Triangle)}get buttonOptions(){return this._buttonOptions}set buttonOptions(e){this._buttonOptions=this._setButtonValue(e,this._buttonOptions,Xt.Options)}get buttonShare(){return this._buttonShare}set buttonShare(e){this._buttonShare=this._setButtonValue(e,this._buttonShare,Xt.Share)}get buttonL1(){return this._buttonL1}set buttonL1(e){this._buttonL1=this._setButtonValue(e,this._buttonL1,Xt.L1)}get buttonR1(){return this._buttonR1}set buttonR1(e){this._buttonR1=this._setButtonValue(e,this._buttonR1,Xt.R1)}get buttonLeftStick(){return this._buttonLeftStick}set buttonLeftStick(e){this._buttonLeftStick=this._setButtonValue(e,this._buttonLeftStick,Xt.LeftStick)}get buttonRightStick(){return this._buttonRightStick}set buttonRightStick(e){this._buttonRightStick=this._setButtonValue(e,this._buttonRightStick,Xt.RightStick)}get dPadUp(){return this._dPadUp}set dPadUp(e){this._dPadUp=this._setDPadValue(e,this._dPadUp,jt.Up)}get dPadDown(){return this._dPadDown}set dPadDown(e){this._dPadDown=this._setDPadValue(e,this._dPadDown,jt.Down)}get dPadLeft(){return this._dPadLeft}set dPadLeft(e){this._dPadLeft=this._setDPadValue(e,this._dPadLeft,jt.Left)}get dPadRight(){return this._dPadRight}set dPadRight(e){this._dPadRight=this._setDPadValue(e,this._dPadRight,jt.Right)}update(){super.update(),this.buttonCross=this.browserGamepad.buttons[0].value,this.buttonCircle=this.browserGamepad.buttons[1].value,this.buttonSquare=this.browserGamepad.buttons[2].value,this.buttonTriangle=this.browserGamepad.buttons[3].value,this.buttonL1=this.browserGamepad.buttons[4].value,this.buttonR1=this.browserGamepad.buttons[5].value,this.leftTrigger=this.browserGamepad.buttons[6].value,this.rightTrigger=this.browserGamepad.buttons[7].value,this.buttonShare=this.browserGamepad.buttons[8].value,this.buttonOptions=this.browserGamepad.buttons[9].value,this.buttonLeftStick=this.browserGamepad.buttons[10].value,this.buttonRightStick=this.browserGamepad.buttons[11].value,this.dPadUp=this.browserGamepad.buttons[12].value,this.dPadDown=this.browserGamepad.buttons[13].value,this.dPadLeft=this.browserGamepad.buttons[14].value,this.dPadRight=this.browserGamepad.buttons[15].value}dispose(){super.dispose(),this.onButtonDownObservable.clear(),this.onButtonUpObservable.clear(),this.onPadDownObservable.clear(),this.onPadUpObservable.clear()}}class Zt{constructor(e){if(this._scene=e,this._babylonGamepads=[],this._oneGamepadConnected=!1,this._isMonitoring=!1,this.onGamepadDisconnectedObservable=new r.y$,(0,fe.CG)()?(this._gamepadEventSupported="GamepadEvent"in window,this._gamepadSupport=navigator&&navigator.getGamepads):this._gamepadEventSupported=!1,this.onGamepadConnectedObservable=new r.y$((e=>{for(const t in this._babylonGamepads){const i=this._babylonGamepads[t];i&&i._isConnected&&this.onGamepadConnectedObservable.notifyObserver(e,i)}})),this._onGamepadConnectedEvent=e=>{const t=e.gamepad;if(t.index in this._babylonGamepads&&this._babylonGamepads[t.index].isConnected)return;let i;this._babylonGamepads[t.index]?(i=this._babylonGamepads[t.index],i.browserGamepad=t,i._isConnected=!0):i=this._addNewGamepad(t),this.onGamepadConnectedObservable.notifyObservers(i),this._startMonitoringGamepads()},this._onGamepadDisconnectedEvent=e=>{const t=e.gamepad;for(const e in this._babylonGamepads)if(this._babylonGamepads[e].index===t.index){const t=this._babylonGamepads[e];t._isConnected=!1,this.onGamepadDisconnectedObservable.notifyObservers(t),t.dispose&&t.dispose();break}},this._gamepadSupport)if(this._updateGamepadObjects(),this._babylonGamepads.length&&this._startMonitoringGamepads(),this._gamepadEventSupported){const e=this._scene?this._scene.getEngine().getHostWindow():window;e&&(e.addEventListener("gamepadconnected",this._onGamepadConnectedEvent,!1),e.addEventListener("gamepaddisconnected",this._onGamepadDisconnectedEvent,!1))}else this._startMonitoringGamepads()}get gamepads(){return this._babylonGamepads}getGamepadByType(e=tt.XBOX){for(const t of this._babylonGamepads)if(t&&t.type===e)return t;return null}dispose(){this._gamepadEventSupported&&(this._onGamepadConnectedEvent&&window.removeEventListener("gamepadconnected",this._onGamepadConnectedEvent),this._onGamepadDisconnectedEvent&&window.removeEventListener("gamepaddisconnected",this._onGamepadDisconnectedEvent),this._onGamepadConnectedEvent=null,this._onGamepadDisconnectedEvent=null),this._babylonGamepads.forEach((e=>{e.dispose()})),this.onGamepadConnectedObservable.clear(),this.onGamepadDisconnectedObservable.clear(),this._oneGamepadConnected=!1,this._stopMonitoringGamepads(),this._babylonGamepads=[]}_addNewGamepad(e){let t;this._oneGamepadConnected||(this._oneGamepadConnected=!0);const i=-1!==e.id.search("054c")&&-1===e.id.search("0ce6"),n=-1!==e.id.search("Xbox One");return t=n||-1!==e.id.search("Xbox 360")||-1!==e.id.search("xinput")||-1!==e.id.search("045e")&&-1===e.id.search("Surface Dock")?new $t(e.id,e.index,e,n):i?new Qt(e.id,e.index,e):e.pose?qt.InitiateController(e):new it(e.id,e.index,e),this._babylonGamepads[t.index]=t,t}_startMonitoringGamepads(){this._isMonitoring||(this._isMonitoring=!0,this._checkGamepadsStatus())}_stopMonitoringGamepads(){this._isMonitoring=!1}_checkGamepadsStatus(){this._updateGamepadObjects();for(const e in this._babylonGamepads){const t=this._babylonGamepads[e];if(t&&t.isConnected)try{t.update()}catch(e){-1===this._loggedErrors.indexOf(t.index)&&(de.w1.Warn(`Error updating gamepad ${t.id}`),this._loggedErrors.push(t.index))}}this._isMonitoring&&ue.D.QueueNewFrame((()=>{this._checkGamepadsStatus()}))}_updateGamepadObjects(){const e=navigator.getGamepads?navigator.getGamepads():[];for(let t=0;t<e.length;t++){const i=e[t];if(i)if(this._babylonGamepads[i.index])this._babylonGamepads[t].browserGamepad=i,this._babylonGamepads[t].isConnected||(this._babylonGamepads[t]._isConnected=!0,this.onGamepadConnectedObservable.notifyObservers(this._babylonGamepads[t]));else{const e=this._addNewGamepad(i);this.onGamepadConnectedObservable.notifyObservers(e)}}}}Object.defineProperty(k.x.prototype,"gamepadManager",{get:function(){if(!this._gamepadManager){this._gamepadManager=new Zt(this);let e=this._getComponent(ve.l.NAME_GAMEPAD);e||(e=new Jt(this),this._addComponent(e))}return this._gamepadManager},enumerable:!0,configurable:!0}),vt.a.prototype.addGamepad=function(){return this.add(new xt),this},ut.prototype.addGamepad=function(){return this.add(new nt),this};class Jt{constructor(e){this.name=ve.l.NAME_GAMEPAD,this.scene=e}register(){this.scene._beforeCameraUpdateStage.registerStep(ve.l.STEP_BEFORECAMERAUPDATE_GAMEPAD,this,this._beforeCameraUpdate)}rebuild(){}dispose(){const e=this.scene._gamepadManager;e&&(e.dispose(),this.scene._gamepadManager=null)}_beforeCameraUpdate(){const e=this.scene._gamepadManager;e&&e._isMonitoring&&e._checkGamepadsStatus()}}Ot.N.AddNodeConstructor("FreeCamera",((e,t)=>()=>new ei(e,o.P.Zero(),t)));class ei extends wt{get gamepadAngularSensibility(){const e=this.inputs.attached.gamepad;return e?e.gamepadAngularSensibility:0}set gamepadAngularSensibility(e){const t=this.inputs.attached.gamepad;t&&(t.gamepadAngularSensibility=e)}get gamepadMoveSensibility(){const e=this.inputs.attached.gamepad;return e?e.gamepadMoveSensibility:0}set gamepadMoveSensibility(e){const t=this.inputs.attached.gamepad;t&&(t.gamepadMoveSensibility=e)}constructor(e,t,i){super(e,t,i),this.inputs.addGamepad()}getClassName(){return"UniversalCamera"}}Mt.V._CreateDefaultParsedCamera=(e,t)=>new ei(e,o.P.Zero(),t),Ot.N.AddNodeConstructor("GamepadCamera",((e,t)=>()=>new ti(e,o.P.Zero(),t)));class ti extends ei{constructor(e,t,i){super(e,t,i)}getClassName(){return"GamepadCamera"}}var ii=i(9525),ni=i(392),si=i(8104);si.v.ShadersStore.anaglyphPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform sampler2D leftSampler;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nvec4 leftFrag=texture2D(leftSampler,vUV);\nleftFrag=vec4(1.0,leftFrag.g,leftFrag.b,1.0);\nvec4 rightFrag=texture2D(textureSampler,vUV);\nrightFrag=vec4(rightFrag.r,1.0,1.0,1.0);\ngl_FragColor=vec4(rightFrag.rgb*leftFrag.rgb,1.0);\n}";class ri extends ni.D{getClassName(){return"AnaglyphPostProcess"}constructor(e,t,i,n,s,r){super(e,"anaglyph",null,["leftSampler"],t,i[1],n,s,r),this._passedProcess=i[0]._rigPostProcess,this.onApplyObservable.add((e=>{e.setTextureFromPostProcess("leftSampler",this._passedProcess)}))}}function oi(e){e._rigCameras[0]._rigPostProcess=new ii.Q(e.name+"_passthru",1,e._rigCameras[0]),e._rigCameras[1]._rigPostProcess=new ri(e.name+"_anaglyph",1,e._rigCameras)}(0,l.H)("BABYLON.AnaglyphPostProcess",ri),Ot.N.AddNodeConstructor("AnaglyphArcRotateCamera",((e,t,i)=>()=>new ai(e,0,0,1,o.P.Zero(),i.interaxial_distance,t)));class ai extends Ft{constructor(e,t,i,n,s,r,o){super(e,t,i,n,s,o),this._setRigMode=oi.bind(null,this),this.interaxialDistance=r,this.setCameraRigMode(Mt.V.RIG_MODE_STEREOSCOPIC_ANAGLYPH,{interaxialDistance:r})}getClassName(){return"AnaglyphArcRotateCamera"}}Ot.N.AddNodeConstructor("AnaglyphFreeCamera",((e,t,i)=>()=>new li(e,o.P.Zero(),i.interaxial_distance,t)));class li extends Dt.c{constructor(e,t,i,n){super(e,t,n),this._setRigMode=oi.bind(null,this),this.interaxialDistance=i,this.setCameraRigMode(Mt.V.RIG_MODE_STEREOSCOPIC_ANAGLYPH,{interaxialDistance:i})}getClassName(){return"AnaglyphFreeCamera"}}Ot.N.AddNodeConstructor("AnaglyphGamepadCamera",((e,t,i)=>()=>new hi(e,o.P.Zero(),i.interaxial_distance,t)));class hi extends ti{constructor(e,t,i,n){super(e,t,n),this._setRigMode=oi.bind(null,this),this.interaxialDistance=i,this.setCameraRigMode(Mt.V.RIG_MODE_STEREOSCOPIC_ANAGLYPH,{interaxialDistance:i})}getClassName(){return"AnaglyphGamepadCamera"}}Ot.N.AddNodeConstructor("AnaglyphUniversalCamera",((e,t,i)=>()=>new ci(e,o.P.Zero(),i.interaxial_distance,t)));class ci extends ei{constructor(e,t,i,n){super(e,t,n),this._setRigMode=oi.bind(null,this),this.interaxialDistance=i,this.setCameraRigMode(Mt.V.RIG_MODE_STEREOSCOPIC_ANAGLYPH,{interaxialDistance:i})}getClassName(){return"AnaglyphUniversalCamera"}}var ui=i(4538);si.v.ShadersStore.stereoscopicInterlacePixelShader="const vec3 TWO=vec3(2.0,2.0,2.0);\nvarying vec2 vUV;\nuniform sampler2D camASampler;\nuniform sampler2D textureSampler;\nuniform vec2 stepSize;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nbool useCamA;\nbool useCamB;\nvec2 texCoord1;\nvec2 texCoord2;\nvec3 frag1;\nvec3 frag2;\n#ifdef IS_STEREOSCOPIC_HORIZ\nuseCamB=vUV.x>0.5;\nuseCamA=!useCamB;\ntexCoord1=vec2(useCamB ? (vUV.x-0.5)*2.0 : vUV.x*2.0,vUV.y);\ntexCoord2=vec2(texCoord1.x+stepSize.x,vUV.y);\n#else\n#ifdef IS_STEREOSCOPIC_INTERLACED\nfloat rowNum=floor(vUV.y/stepSize.y);\nuseCamA=mod(rowNum,2.0)==1.0;\nuseCamB=mod(rowNum,2.0)==0.0;\ntexCoord1=vec2(vUV.x,vUV.y);\ntexCoord2=vec2(vUV.x,vUV.y);\n#else\nuseCamB=vUV.y>0.5;\nuseCamA=!useCamB;\ntexCoord1=vec2(vUV.x,useCamB ? (vUV.y-0.5)*2.0 : vUV.y*2.0);\ntexCoord2=vec2(vUV.x,texCoord1.y+stepSize.y);\n#endif\n#endif\nif (useCamB){\nfrag1=texture2D(textureSampler,texCoord1).rgb;\nfrag2=texture2D(textureSampler,texCoord2).rgb;\n}else if (useCamA){\nfrag1=texture2D(camASampler ,texCoord1).rgb;\nfrag2=texture2D(camASampler ,texCoord2).rgb;\n}else {\ndiscard;\n}\ngl_FragColor=vec4((frag1+frag2)/TWO,1.0);\n}\n";class di extends ni.D{getClassName(){return"StereoscopicInterlacePostProcessI"}constructor(e,t,i,n,s,r,a){super(e,"stereoscopicInterlace",["stepSize"],["camASampler"],1,t[1],s,r,a,n?"#define IS_STEREOSCOPIC_INTERLACED 1":i?"#define IS_STEREOSCOPIC_HORIZ 1":void 0),this._passedProcess=t[0]._rigPostProcess,this._stepSize=new o.FM(1/this.width,1/this.height),this.onSizeChangedObservable.add((()=>{this._stepSize=new o.FM(1/this.width,1/this.height)})),this.onApplyObservable.add((e=>{e.setTextureFromPostProcess("camASampler",this._passedProcess),e.setFloat2("stepSize",this._stepSize.x,this._stepSize.y)}))}}class pi extends ni.D{getClassName(){return"StereoscopicInterlacePostProcess"}constructor(e,t,i,n,s,r){super(e,"stereoscopicInterlace",["stepSize"],["camASampler"],1,t[1],n,s,r,i?"#define IS_STEREOSCOPIC_HORIZ 1":void 0),this._passedProcess=t[0]._rigPostProcess,this._stepSize=new o.FM(1/this.width,1/this.height),this.onSizeChangedObservable.add((()=>{this._stepSize=new o.FM(1/this.width,1/this.height)})),this.onApplyObservable.add((e=>{e.setTextureFromPostProcess("camASampler",this._passedProcess),e.setFloat2("stepSize",this._stepSize.x,this._stepSize.y)}))}}function fi(e){const t=e.cameraRigMode===Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL||e.cameraRigMode===Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_CROSSEYED,i=e.cameraRigMode===Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_CROSSEYED;e.cameraRigMode===Mt.V.RIG_MODE_STEREOSCOPIC_INTERLACED?(e._rigCameras[0]._rigPostProcess=new ii.Q(e.name+"_passthru",1,e._rigCameras[0]),e._rigCameras[1]._rigPostProcess=new di(e.name+"_stereoInterlace",e._rigCameras,!1,!0)):(e._rigCameras[i?1:0].viewport=new ui.l(0,0,t?.5:1,t?1:.5),e._rigCameras[i?0:1].viewport=new ui.l(t?.5:0,t?0:.5,t?.5:1,t?1:.5))}Ot.N.AddNodeConstructor("StereoscopicArcRotateCamera",((e,t,i)=>()=>new _i(e,0,0,1,o.P.Zero(),i.interaxial_distance,i.isStereoscopicSideBySide,t)));class _i extends Ft{constructor(e,t,i,n,s,r,o,a){super(e,t,i,n,s,a),this._setRigMode=fi.bind(null,this),this.interaxialDistance=r,this.isStereoscopicSideBySide=o,this.setCameraRigMode(o?Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL:Mt.V.RIG_MODE_STEREOSCOPIC_OVERUNDER,{interaxialDistance:r})}getClassName(){return"StereoscopicArcRotateCamera"}}Ot.N.AddNodeConstructor("StereoscopicFreeCamera",((e,t,i)=>()=>new mi(e,o.P.Zero(),i.interaxial_distance,i.isStereoscopicSideBySide,t)));class mi extends Dt.c{constructor(e,t,i,n,s){super(e,t,s),this._setRigMode=fi.bind(null,this),this.interaxialDistance=i,this.isStereoscopicSideBySide=n,this.setCameraRigMode(n?Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL:Mt.V.RIG_MODE_STEREOSCOPIC_OVERUNDER,{interaxialDistance:i})}getClassName(){return"StereoscopicFreeCamera"}}Ot.N.AddNodeConstructor("StereoscopicGamepadCamera",((e,t,i)=>()=>new gi(e,o.P.Zero(),i.interaxial_distance,i.isStereoscopicSideBySide,t)));class gi extends ti{constructor(e,t,i,n,s){super(e,t,s),this._setRigMode=fi.bind(null,this),this.interaxialDistance=i,this.isStereoscopicSideBySide=n,this.setCameraRigMode(n?Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL:Mt.V.RIG_MODE_STEREOSCOPIC_OVERUNDER,{interaxialDistance:i})}getClassName(){return"StereoscopicGamepadCamera"}}Ot.N.AddNodeConstructor("StereoscopicFreeCamera",((e,t,i)=>()=>new vi(e,o.P.Zero(),i.interaxial_distance,i.isStereoscopicSideBySide,t)));class vi extends ei{constructor(e,t,i,n,s){super(e,t,s),this._setRigMode=fi.bind(null,this),this.interaxialDistance=i,this.isStereoscopicSideBySide=n,this.setCameraRigMode(n?Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL:Mt.V.RIG_MODE_STEREOSCOPIC_OVERUNDER,{interaxialDistance:i})}getClassName(){return"StereoscopicUniversalCamera"}}var yi=i(4674);class xi extends ei{set distanceBetweenEyes(e){this._distanceBetweenEyes=e}get distanceBetweenEyes(){return this._distanceBetweenEyes}set distanceToProjectionPlane(e){this._distanceToProjectionPlane=e}get distanceToProjectionPlane(){return this._distanceToProjectionPlane}constructor(e,t,i,n=1,s=.065){super(e,t,i),this._distanceBetweenEyes=s,this._distanceToProjectionPlane=n,this.setCameraRigMode(Mt.V.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL,{stereoHalfAngle:0}),this._cameraRigParams.stereoHalfAngle=0,this._cameraRigParams.interaxialDistance=s}getClassName(){return"StereoscopicUniversalCamera"}createRigCamera(e){const t=new It.C(e,o.P.Zero(),this.getScene()),i=new yi.Y("tm_"+e,this.getScene());return t.parent=i,i.setPivotMatrix(o.y3.Identity(),!1),t.isRigCamera=!0,t.rigParent=this,t}_updateRigCameras(){for(let e=0;e<this._rigCameras.length;e++){const t=this._rigCameras[e];t.minZ=this.minZ,t.maxZ=this.maxZ,t.fov=this.fov,t.upVector.copyFrom(this.upVector),t.rotationQuaternion?t.rotationQuaternion.copyFrom(this.rotationQuaternion):t.rotation.copyFrom(this.rotation),this._updateCamera(this._rigCameras[e],e)}}_updateCamera(e,t){const i=this.distanceBetweenEyes/2,n=i/this.distanceToProjectionPlane;e.position.copyFrom(this.position),e.position.addInPlaceFromFloats(0===t?-i:i,0,-this._distanceToProjectionPlane);const s=e.parent,r=s.getPivotMatrix();r.setTranslationFromFloats(0===t?i:-i,0,0),r.setRowFromFloats(2,0===t?n:-n,0,1,0),s.setPivotMatrix(r,!1)}_setRigMode(){this._rigCameras[0].viewport=new ui.l(0,0,.5,1),this._rigCameras[1].viewport=new ui.l(.5,0,.5,1);for(let e=0;e<this._rigCameras.length;e++)this._updateCamera(this._rigCameras[e],e)}}Ot.N.AddNodeConstructor("VirtualJoysticksCamera",((e,t)=>()=>new bi(e,o.P.Zero(),t)));class bi extends Dt.c{constructor(e,t,i){super(e,t,i),this.inputs.addVirtualJoystick()}getClassName(){return"VirtualJoysticksCamera"}}class Ti{constructor(){this.compensateDistortion=!0,this.multiviewEnabled=!1}get aspectRatio(){return this.hResolution/(2*this.vResolution)}get aspectRatioFov(){return 2*Math.atan(this.postProcessScaleFactor*this.vScreenSize/(2*this.eyeToScreenDistance))}get leftHMatrix(){const e=4*(this.hScreenSize/4-this.lensSeparationDistance/2)/this.hScreenSize;return o.y3.Translation(e,0,0)}get rightHMatrix(){const e=4*(this.hScreenSize/4-this.lensSeparationDistance/2)/this.hScreenSize;return o.y3.Translation(-e,0,0)}get leftPreViewMatrix(){return o.y3.Translation(.5*this.interpupillaryDistance,0,0)}get rightPreViewMatrix(){return o.y3.Translation(-.5*this.interpupillaryDistance,0,0)}static GetDefault(){const e=new Ti;return e.hResolution=1280,e.vResolution=800,e.hScreenSize=.149759993,e.vScreenSize=.0935999975,e.vScreenCenter=.0467999987,e.eyeToScreenDistance=.0410000011,e.lensSeparationDistance=.063500002,e.interpupillaryDistance=.064000003,e.distortionK=[1,.219999999,.239999995,0],e.chromaAbCorrection=[.995999992,-.00400000019,1.01400006,0],e.postProcessScaleFactor=1.714605507808412,e.lensCenterOffset=.151976421,e}}si.v.ShadersStore.vrDistortionCorrectionPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform vec2 LensCenter;\nuniform vec2 Scale;\nuniform vec2 ScaleIn;\nuniform vec4 HmdWarpParam;\nvec2 HmdWarp(vec2 in01) {\nvec2 theta=(in01-LensCenter)*ScaleIn; \nfloat rSq=theta.x*theta.x+theta.y*theta.y;\nvec2 rvector=theta*(HmdWarpParam.x+HmdWarpParam.y*rSq+HmdWarpParam.z*rSq*rSq+HmdWarpParam.w*rSq*rSq*rSq);\nreturn LensCenter+Scale*rvector;\n}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nvec2 tc=HmdWarp(vUV);\nif (tc.x <0.0 || tc.x>1.0 || tc.y<0.0 || tc.y>1.0)\ngl_FragColor=vec4(0.0,0.0,0.0,0.0);\nelse{\ngl_FragColor=texture2D(textureSampler,tc);\n}\n}";class Si extends ni.D{getClassName(){return"VRDistortionCorrectionPostProcess"}constructor(e,t,i,n){super(e,"vrDistortionCorrection",["LensCenter","Scale","ScaleIn","HmdWarpParam"],null,n.postProcessScaleFactor,t,Ce.x.BILINEAR_SAMPLINGMODE),this._isRightEye=i,this._distortionFactors=n.distortionK,this._postProcessScaleFactor=n.postProcessScaleFactor,this._lensCenterOffset=n.lensCenterOffset,this.adaptScaleToCurrentViewport=!0,this.onSizeChangedObservable.add((()=>{this._scaleIn=new o.FM(2,2/this.aspectRatio),this._scaleFactor=new o.FM(1/this._postProcessScaleFactor*.5,1/this._postProcessScaleFactor*.5*this.aspectRatio),this._lensCenter=new o.FM(this._isRightEye?.5-.5*this._lensCenterOffset:.5+.5*this._lensCenterOffset,.5)})),this.onApplyObservable.add((e=>{e.setFloat2("LensCenter",this._lensCenter.x,this._lensCenter.y),e.setFloat2("Scale",this._scaleFactor.x,this._scaleFactor.y),e.setFloat2("ScaleIn",this._scaleIn.x,this._scaleIn.y),e.setFloat4("HmdWarpParam",this._distortionFactors[0],this._distortionFactors[1],this._distortionFactors[2],this._distortionFactors[3])}))}}si.v.ShadersStore.vrMultiviewToSingleviewPixelShader="precision mediump sampler2DArray;\nvarying vec2 vUV;\nuniform sampler2DArray multiviewSampler;\nuniform int imageIndex;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\ngl_FragColor=texture2D(multiviewSampler,vec3(vUV,imageIndex));\n}";var Ei=i(6202),Ci=i(3743),Ai=i(4246);class Pi extends Ai._{set samples(e){this._samples=e}get samples(){return this._samples}constructor(e,t=512){super("multiview rtt",t,e,!1,!0,0,!1,void 0,!1,!1,!0,void 0,!0),this._renderTarget=this.getScene().getEngine().createMultiviewRenderTargetTexture(this.getRenderWidth(),this.getRenderHeight()),this._texture=this._renderTarget.texture,this._texture.isMultiview=!0,this._texture.format=5,this.samples=this._getEngine().getCaps().maxSamples||this.samples,this._texture.samples=this._samples}_bindFrameBuffer(){this._renderTarget&&this.getScene().getEngine().bindMultiviewFramebuffer(this._renderTarget)}getViewCount(){return 2}}var Ri=i(1560);function Mi(e,t){const i=new Ci.M(e,void 0,!0,t);return i.addUniform("viewProjection",16),i.addUniform("viewProjectionR",16),i.addUniform("view",16),i.addUniform("projection",16),i.addUniform("vEyePosition",4),i}ue.D.prototype.createMultiviewRenderTargetTexture=function(e,t){const i=this._gl;if(!this.getCaps().multiview)throw"Multiview is not supported";const n=this._createHardwareRenderTargetWrapper(!1,!1,{width:e,height:t});n._framebuffer=i.createFramebuffer();const s=new Ei.l(this,Ei.S.Unknown,!0);return s.width=e,s.height=t,s.isMultiview=!0,n._colorTextureArray=i.createTexture(),i.bindTexture(i.TEXTURE_2D_ARRAY,n._colorTextureArray),i.texStorage3D(i.TEXTURE_2D_ARRAY,1,i.RGBA8,e,t,2),n._depthStencilTextureArray=i.createTexture(),i.bindTexture(i.TEXTURE_2D_ARRAY,n._depthStencilTextureArray),i.texStorage3D(i.TEXTURE_2D_ARRAY,1,i.DEPTH24_STENCIL8,e,t,2),s.isReady=!0,n.setTextures(s),n._depthStencilTexture=s,n},ue.D.prototype.bindMultiviewFramebuffer=function(e){const t=e,i=this._gl,n=this.getCaps().oculusMultiview||this.getCaps().multiview;if(this.bindFramebuffer(t,void 0,void 0,void 0,!0),i.bindFramebuffer(i.DRAW_FRAMEBUFFER,t._framebuffer),!t._colorTextureArray||!t._depthStencilTextureArray)throw"Invalid multiview frame buffer";this.getCaps().oculusMultiview?(n.framebufferTextureMultisampleMultiviewOVR(i.DRAW_FRAMEBUFFER,i.COLOR_ATTACHMENT0,t._colorTextureArray,0,t.samples,0,2),n.framebufferTextureMultisampleMultiviewOVR(i.DRAW_FRAMEBUFFER,i.DEPTH_STENCIL_ATTACHMENT,t._depthStencilTextureArray,0,t.samples,0,2)):(n.framebufferTextureMultiviewOVR(i.DRAW_FRAMEBUFFER,i.COLOR_ATTACHMENT0,t._colorTextureArray,0,0,2),n.framebufferTextureMultiviewOVR(i.DRAW_FRAMEBUFFER,i.DEPTH_STENCIL_ATTACHMENT,t._depthStencilTextureArray,0,0,2))},Mt.V.prototype._useMultiviewToSingleView=!1,Mt.V.prototype._multiviewTexture=null,Mt.V.prototype._resizeOrCreateMultiviewTexture=function(e,t){this._multiviewTexture?this._multiviewTexture.getRenderWidth()==e&&this._multiviewTexture.getRenderHeight()==t||(this._multiviewTexture.dispose(),this._multiviewTexture=new Pi(this.getScene(),{width:e,height:t})):this._multiviewTexture=new Pi(this.getScene(),{width:e,height:t})};const Ii=k.x.prototype.createSceneUniformBuffer;k.x.prototype._transformMatrixR=o.y3.Zero(),k.x.prototype._multiviewSceneUbo=null,k.x.prototype._createMultiviewUbo=function(){this._multiviewSceneUbo=Mi(this.getEngine(),"scene_multiview")},k.x.prototype.createSceneUniformBuffer=function(e){return this._multiviewSceneUbo?Mi(this.getEngine(),e):Ii.bind(this)(e)},k.x.prototype._updateMultiviewUbo=function(e,t){e&&t&&e.multiplyToRef(t,this._transformMatrixR),e&&t&&(e.multiplyToRef(t,o.jp.Matrix[0]),Ri.i.GetRightPlaneToRef(o.jp.Matrix[0],this._frustumPlanes[3])),this._multiviewSceneUbo&&(this._multiviewSceneUbo.updateMatrix("viewProjection",this.getTransformMatrix()),this._multiviewSceneUbo.updateMatrix("viewProjectionR",this._transformMatrixR),this._multiviewSceneUbo.updateMatrix("view",this._viewMatrix),this._multiviewSceneUbo.updateMatrix("projection",this._projectionMatrix))},k.x.prototype._renderMultiviewToSingleView=function(e){e._resizeOrCreateMultiviewTexture(e._rigPostProcess&&e._rigPostProcess&&e._rigPostProcess.width>0?e._rigPostProcess.width:this.getEngine().getRenderWidth(!0),e._rigPostProcess&&e._rigPostProcess&&e._rigPostProcess.height>0?e._rigPostProcess.height:this.getEngine().getRenderHeight(!0)),this._multiviewSceneUbo||this._createMultiviewUbo(),e.outputRenderTarget=e._multiviewTexture,this._renderForCamera(e),e.outputRenderTarget=null;for(let t=0;t<e._rigCameras.length;t++){const i=this.getEngine();this._activeCamera=e._rigCameras[t],i.setViewport(this._activeCamera.viewport),this.postProcessManager&&(this.postProcessManager._prepareFrame(),this.postProcessManager._finalizeFrame(this._activeCamera.isIntermediate))}};class Di extends ni.D{getClassName(){return"VRMultiviewToSingleviewPostProcess"}constructor(e,t,i){super(e,"vrMultiviewToSingleview",["imageIndex"],["multiviewSampler"],i,t,Ce.x.BILINEAR_SAMPLINGMODE);const n=null!=t?t:this.getCamera();this.onSizeChangedObservable.add((()=>{})),this.onApplyObservable.add((e=>{n._scene.activeCamera&&n._scene.activeCamera.isLeftCamera?e.setInt("imageIndex",0):e.setInt("imageIndex",1),e.setTexture("multiviewSampler",n._multiviewTexture)}))}}function Oi(e,t){const i=t.vrCameraMetrics||Ti.GetDefault();e._rigCameras[0]._cameraRigParams.vrMetrics=i,e._rigCameras[0].viewport=new ui.l(0,0,.5,1),e._rigCameras[0]._cameraRigParams.vrWorkMatrix=new o.y3,e._rigCameras[0]._cameraRigParams.vrHMatrix=i.leftHMatrix,e._rigCameras[0]._cameraRigParams.vrPreViewMatrix=i.leftPreViewMatrix,e._rigCameras[0].getProjectionMatrix=e._rigCameras[0]._getVRProjectionMatrix,e._rigCameras[1]._cameraRigParams.vrMetrics=i,e._rigCameras[1].viewport=new ui.l(.5,0,.5,1),e._rigCameras[1]._cameraRigParams.vrWorkMatrix=new o.y3,e._rigCameras[1]._cameraRigParams.vrHMatrix=i.rightHMatrix,e._rigCameras[1]._cameraRigParams.vrPreViewMatrix=i.rightPreViewMatrix,e._rigCameras[1].getProjectionMatrix=e._rigCameras[1]._getVRProjectionMatrix,i.multiviewEnabled&&(e.getScene().getEngine().getCaps().multiview?(e._useMultiviewToSingleView=!0,e._rigPostProcess=new Di("VRMultiviewToSingleview",e,i.postProcessScaleFactor)):(_.Y.Warn("Multiview is not supported, falling back to standard rendering"),i.multiviewEnabled=!1)),i.compensateDistortion&&(e._rigCameras[0]._rigPostProcess=new Si("VR_Distort_Compensation_Left",e._rigCameras[0],!1,i),e._rigCameras[1]._rigPostProcess=new Si("VR_Distort_Compensation_Right",e._rigCameras[1],!0,i))}Ot.N.AddNodeConstructor("VRDeviceOrientationArcRotateCamera",((e,t)=>()=>new wi(e,0,0,1,o.P.Zero(),t)));class wi extends Ft{constructor(e,t,i,n,s,r,o=!0,a=Ti.GetDefault()){super(e,t,i,n,s,r),this._setRigMode=Oi.bind(null,this),a.compensateDistortion=o,this.setCameraRigMode(Mt.V.RIG_MODE_VR,{vrCameraMetrics:a}),this.inputs.addVRDeviceOrientation()}getClassName(){return"VRDeviceOrientationArcRotateCamera"}}Ot.N.AddNodeConstructor("VRDeviceOrientationFreeCamera",((e,t)=>()=>new Ni(e,o.P.Zero(),t)));class Ni extends Lt{constructor(e,t,i,n=!0,s=Ti.GetDefault()){super(e,t,i),this._setRigMode=Oi.bind(null,this),s.compensateDistortion=n,this.setCameraRigMode(Mt.V.RIG_MODE_VR,{vrCameraMetrics:s})}getClassName(){return"VRDeviceOrientationFreeCamera"}}Ot.N.AddNodeConstructor("VRDeviceOrientationGamepadCamera",((e,t)=>()=>new Fi(e,o.P.Zero(),t)));class Fi extends Ni{constructor(e,t,i,n=!0,s=Ti.GetDefault()){super(e,t,i,n,s),this._setRigMode=Oi.bind(null,this),this.inputs.addGamepad()}getClassName(){return"VRDeviceOrientationGamepadCamera"}}var Li=i(7616);function Bi(e,t){if(t.vrDisplay){const i=t.vrDisplay.getEyeParameters("left"),n=t.vrDisplay.getEyeParameters("right");e._rigCameras[0].viewport=new ui.l(0,0,.5,1),e._rigCameras[0].setCameraRigParameter("left",!0),e._rigCameras[0].setCameraRigParameter("specs",t.specs),e._rigCameras[0].setCameraRigParameter("eyeParameters",i),e._rigCameras[0].setCameraRigParameter("frameData",t.frameData),e._rigCameras[0].setCameraRigParameter("parentCamera",t.parentCamera),e._rigCameras[0]._cameraRigParams.vrWorkMatrix=new o.y3,e._rigCameras[0].getProjectionMatrix=e._getWebVRProjectionMatrix,e._rigCameras[0].parent=e,e._rigCameras[0]._getViewMatrix=e._getWebVRViewMatrix,e._rigCameras[1].viewport=new ui.l(.5,0,.5,1),e._rigCameras[1].setCameraRigParameter("eyeParameters",n),e._rigCameras[1].setCameraRigParameter("specs",t.specs),e._rigCameras[1].setCameraRigParameter("frameData",t.frameData),e._rigCameras[1].setCameraRigParameter("parentCamera",t.parentCamera),e._rigCameras[1]._cameraRigParams.vrWorkMatrix=new o.y3,e._rigCameras[1].getProjectionMatrix=e._getWebVRProjectionMatrix,e._rigCameras[1].parent=e,e._rigCameras[1]._getViewMatrix=e._getWebVRViewMatrix}}Object.defineProperty(ue.D.prototype,"isInVRExclusivePointerMode",{get:function(){return this._vrExclusivePointerMode},enumerable:!0,configurable:!0}),ue.D.prototype._prepareVRComponent=function(){this._vrSupported=!1,this._vrExclusivePointerMode=!1,this.onVRDisplayChangedObservable=new r.y$,this.onVRRequestPresentComplete=new r.y$,this.onVRRequestPresentStart=new r.y$},ue.D.prototype.isVRDevicePresent=function(){return!!this._vrDisplay},ue.D.prototype.getVRDevice=function(){return this._vrDisplay},ue.D.prototype.initWebVR=function(){return this.initWebVRAsync(),this.onVRDisplayChangedObservable},ue.D.prototype.initWebVRAsync=function(){const e=()=>{const e={vrDisplay:this._vrDisplay,vrSupported:this._vrSupported};this.onVRDisplayChangedObservable.notifyObservers(e),this._webVRInitPromise=new Promise((t=>{t(e)}))};if(!this._onVrDisplayConnect){this._onVrDisplayConnect=t=>{this._vrDisplay=t.display,e()},this._onVrDisplayDisconnect=()=>{this._vrDisplay.cancelAnimationFrame(this._frameHandler),this._vrDisplay=void 0,this._frameHandler=ue.D.QueueNewFrame(this._boundRenderFunction),e()},this._onVrDisplayPresentChange=()=>{this._vrExclusivePointerMode=this._vrDisplay&&this._vrDisplay.isPresenting};const t=this.getHostWindow();t&&(t.addEventListener("vrdisplayconnect",this._onVrDisplayConnect),t.addEventListener("vrdisplaydisconnect",this._onVrDisplayDisconnect),t.addEventListener("vrdisplaypresentchange",this._onVrDisplayPresentChange))}return this._webVRInitPromise=this._webVRInitPromise||this._getVRDisplaysAsync(),this._webVRInitPromise.then(e),this._webVRInitPromise},ue.D.prototype._getVRDisplaysAsync=function(){return new Promise((e=>{navigator.getVRDisplays?navigator.getVRDisplays().then((t=>{this._vrSupported=!0,this._vrDisplay=t[0],e({vrDisplay:this._vrDisplay,vrSupported:this._vrSupported})})):(this._vrDisplay=void 0,this._vrSupported=!1,e({vrDisplay:this._vrDisplay,vrSupported:this._vrSupported}))}))},ue.D.prototype.enableVR=function(e){if(this._vrDisplay&&!this._vrDisplay.isPresenting){const t=()=>{this.onVRRequestPresentComplete.notifyObservers(!0),this._onVRFullScreenTriggered()},i=()=>{this.onVRRequestPresentComplete.notifyObservers(!1)};this.onVRRequestPresentStart.notifyObservers(this);const n={highRefreshRate:!!this.vrPresentationAttributes&&this.vrPresentationAttributes.highRefreshRate,foveationLevel:this.vrPresentationAttributes?this.vrPresentationAttributes.foveationLevel:1,multiview:(this.getCaps().multiview||this.getCaps().oculusMultiview)&&e.useMultiview};this._vrDisplay.requestPresent([{source:this.getRenderingCanvas(),attributes:n,...n}]).then(t).catch(i)}},ue.D.prototype._onVRFullScreenTriggered=function(){if(this._vrDisplay&&this._vrDisplay.isPresenting){this._oldSize=new w.$(this.getRenderWidth(),this.getRenderHeight()),this._oldHardwareScaleFactor=this.getHardwareScalingLevel();const e=this._vrDisplay.getEyeParameters("left");this.setHardwareScalingLevel(1),this.setSize(2*e.renderWidth,e.renderHeight)}else this.setHardwareScalingLevel(this._oldHardwareScaleFactor),this.setSize(this._oldSize.width,this._oldSize.height)},ue.D.prototype.disableVR=function(){this._vrDisplay&&this._vrDisplay.isPresenting&&this._vrDisplay.exitPresent().then((()=>this._onVRFullScreenTriggered())).catch((()=>this._onVRFullScreenTriggered())),(0,fe.CG)()&&(window.removeEventListener("vrdisplaypointerrestricted",this._onVRDisplayPointerRestricted),window.removeEventListener("vrdisplaypointerunrestricted",this._onVRDisplayPointerUnrestricted),this._onVrDisplayConnect&&(window.removeEventListener("vrdisplayconnect",this._onVrDisplayConnect),this._onVrDisplayDisconnect&&window.removeEventListener("vrdisplaydisconnect",this._onVrDisplayDisconnect),this._onVrDisplayPresentChange&&window.removeEventListener("vrdisplaypresentchange",this._onVrDisplayPresentChange),this._onVrDisplayConnect=null,this._onVrDisplayDisconnect=null))},ue.D.prototype._connectVREvents=function(e,t){if(this._onVRDisplayPointerRestricted=()=>{e&&e.requestPointerLock()},this._onVRDisplayPointerUnrestricted=()=>{if(t)t.exitPointerLock&&t.exitPointerLock();else{const e=this.getHostWindow();e.document&&e.document.exitPointerLock&&e.document.exitPointerLock()}},(0,fe.CG)()){const e=this.getHostWindow();e.addEventListener("vrdisplaypointerrestricted",this._onVRDisplayPointerRestricted,!1),e.addEventListener("vrdisplaypointerunrestricted",this._onVRDisplayPointerUnrestricted,!1)}},ue.D.prototype._submitVRFrame=function(){if(this._vrDisplay&&this._vrDisplay.isPresenting)try{this._vrDisplay.submitFrame()}catch(e){de.w1.Warn("webVR submitFrame has had an unexpected failure: "+e)}},ue.D.prototype.isVRPresenting=function(){return this._vrDisplay&&this._vrDisplay.isPresenting},ue.D.prototype._requestVRFrame=function(){this._frameHandler=ue.D.QueueNewFrame(this._boundRenderFunction,this._vrDisplay)},Ot.N.AddNodeConstructor("WebVRFreeCamera",((e,t)=>()=>new Ui(e,o.P.Zero(),t))),Ot.N.AddNodeConstructor("WebVRGamepadCamera",((e,t)=>()=>new Ui(e,o.P.Zero(),t)));class Ui extends Dt.c{constructor(e,t,i,n={}){super(e,t,i),this._webVROptions=n,this._vrDevice=null,this.rawPose=null,this._specsVersion="1.1",this._attached=!1,this._descendants=[],this._deviceRoomPosition=o.P.Zero(),this._deviceRoomRotationQuaternion=o._f.Identity(),this._standingMatrix=null,this.devicePosition=o.P.Zero(),this.deviceRotationQuaternion=o._f.Identity(),this.deviceScaleFactor=1,this._deviceToWorld=o.y3.Identity(),this._worldToDevice=o.y3.Identity(),this.controllers=[],this.onControllersAttachedObservable=new r.y$,this.onControllerMeshLoadedObservable=new r.y$,this.onPoseUpdatedFromDeviceObservable=new r.y$,this._poseSet=!1,this.rigParenting=!0,this._defaultHeight=void 0,this._setRigMode=Bi.bind(null,this),this._detachIfAttached=()=>{const e=this.getEngine().getVRDevice();e&&!e.isPresenting&&this.detachControl()},this._workingVector=o.P.Zero(),this._oneVector=o.P.One(),this._workingMatrix=o.y3.Identity(),this._tmpMatrix=new o.y3,this._cache.position=o.P.Zero(),n.defaultHeight&&(this._defaultHeight=n.defaultHeight,this.position.y=this._defaultHeight),this.minZ=.1,5===arguments.length&&(this._webVROptions=arguments[4]),null==this._webVROptions.trackPosition&&(this._webVROptions.trackPosition=!0),null==this._webVROptions.controllerMeshes&&(this._webVROptions.controllerMeshes=!0),null==this._webVROptions.defaultLightingOnControllers&&(this._webVROptions.defaultLightingOnControllers=!0),this.rotationQuaternion=new o._f,this._webVROptions&&this._webVROptions.positionScale&&(this.deviceScaleFactor=this._webVROptions.positionScale);const s=this.getEngine();this._onVREnabled=e=>{e&&this.initControllers()},s.onVRRequestPresentComplete.add(this._onVREnabled),s.initWebVR().add((e=>{e.vrDisplay&&this._vrDevice!==e.vrDisplay&&(this._vrDevice=e.vrDisplay,this.setCameraRigMode(Mt.V.RIG_MODE_WEBVR,{parentCamera:this,vrDisplay:this._vrDevice,frameData:this._frameData,specs:this._specsVersion}),this._attached&&this.getEngine().enableVR(this._webVROptions))})),"undefined"!=typeof VRFrameData&&(this._frameData=new VRFrameData),n.useMultiview&&(this.getScene().getEngine().getCaps().multiview?(this._useMultiviewToSingleView=!0,this._rigPostProcess=new Di("VRMultiviewToSingleview",this,1)):(_.Y.Warn("Multiview is not supported, falling back to standard rendering"),this._useMultiviewToSingleView=!1)),this.getScene().onBeforeCameraRenderObservable.add((e=>{e.parent===this&&this.rigParenting&&(this._descendants=this.getDescendants(!0,(e=>{const t=this.controllers.some((t=>t._mesh===e)),i=-1!==this._rigCameras.indexOf(e);return!t&&!i})),this._descendants.forEach((t=>{t.parent=e})))})),this.getScene().onAfterCameraRenderObservable.add((e=>{e.parent===this&&this.rigParenting&&this._descendants.forEach((e=>{e.parent=this}))}))}deviceDistanceToRoomGround(){return this._standingMatrix?(this._standingMatrix.getTranslationToRef(this._workingVector),this._deviceRoomPosition.y+this._workingVector.y):this._defaultHeight||0}useStandingMatrix(e=(e=>{})){this.getEngine().initWebVRAsync().then((t=>{t.vrDisplay&&t.vrDisplay.stageParameters&&t.vrDisplay.stageParameters.sittingToStandingTransform&&this._webVROptions.trackPosition?(this._standingMatrix=new o.y3,o.y3.FromFloat32ArrayToRefScaled(t.vrDisplay.stageParameters.sittingToStandingTransform,0,1,this._standingMatrix),this.getScene().useRightHandedSystem||this._standingMatrix&&this._standingMatrix.toggleModelMatrixHandInPlace(),e(!0)):e(!1)}))}useStandingMatrixAsync(){return new Promise((e=>{this.useStandingMatrix((t=>{e(t)}))}))}dispose(){this._detachIfAttached(),this.getEngine().onVRRequestPresentComplete.removeCallback(this._onVREnabled),this._updateCacheWhenTrackingDisabledObserver&&this._scene.onBeforeRenderObservable.remove(this._updateCacheWhenTrackingDisabledObserver),super.dispose()}getControllerByName(e){for(const t of this.controllers)if(t.hand===e)return t;return null}get leftController(){return this._leftController||(this._leftController=this.getControllerByName("left")),this._leftController}get rightController(){return this._rightController||(this._rightController=this.getControllerByName("right")),this._rightController}getForwardRay(e=100){return this.leftCamera?super.getForwardRay(e,this.leftCamera.getWorldMatrix(),this.leftCamera.globalPosition):super.getForwardRay(e)}_checkInputs(){this._vrDevice&&this._vrDevice.isPresenting&&(this._vrDevice.getFrameData(this._frameData),this.updateFromDevice(this._frameData.pose)),super._checkInputs()}updateFromDevice(e){e&&e.orientation&&4===e.orientation.length&&(this.rawPose=e,this._deviceRoomRotationQuaternion.copyFromFloats(e.orientation[0],e.orientation[1],-e.orientation[2],-e.orientation[3]),this.getScene().useRightHandedSystem&&(this._deviceRoomRotationQuaternion.z*=-1,this._deviceRoomRotationQuaternion.w*=-1),this._webVROptions.trackPosition&&this.rawPose.position&&(this._deviceRoomPosition.copyFromFloats(this.rawPose.position[0],this.rawPose.position[1],-this.rawPose.position[2]),this.getScene().useRightHandedSystem&&(this._deviceRoomPosition.z*=-1)),this._poseSet=!0)}attachControl(e){e=de.w1.BackCompatCameraNoPreventDefault(arguments),super.attachControl(e),this._attached=!0,e=!Mt.V.ForceAttachControlToAlwaysPreventDefault&&e,this._vrDevice&&this.getEngine().enableVR(this._webVROptions);const t=this._scene.getEngine().getHostWindow();t&&t.addEventListener("vrdisplaypresentchange",this._detachIfAttached)}detachControl(){this.getScene().gamepadManager.onGamepadConnectedObservable.remove(this._onGamepadConnectedObserver),this.getScene().gamepadManager.onGamepadDisconnectedObservable.remove(this._onGamepadDisconnectedObserver),super.detachControl(),this._attached=!1,this.getEngine().disableVR(),window.removeEventListener("vrdisplaypresentchange",this._detachIfAttached)}getClassName(){return"WebVRFreeCamera"}resetToCurrentRotation(){this._vrDevice.resetPose()}_updateRigCameras(){const e=this._rigCameras[0],t=this._rigCameras[1];e.rotationQuaternion.copyFrom(this._deviceRoomRotationQuaternion),t.rotationQuaternion.copyFrom(this._deviceRoomRotationQuaternion),e.position.copyFrom(this._deviceRoomPosition),t.position.copyFrom(this._deviceRoomPosition)}_correctPositionIfNotTrackPosition(e,t=!1){this.rawPose&&this.rawPose.position&&!this._webVROptions.trackPosition&&(o.y3.TranslationToRef(this.rawPose.position[0],this.rawPose.position[1],-this.rawPose.position[2],this._tmpMatrix),t||this._tmpMatrix.invert(),this._tmpMatrix.multiplyToRef(e,e))}_updateCache(e){this.rotationQuaternion.equals(this._cache.rotationQuaternion)&&this.position.equals(this._cache.position)||(this._updateCacheCalled||(this._updateCacheCalled=!0,this.update()),this.rotationQuaternion.toRotationMatrix(this._workingMatrix),o.P.TransformCoordinatesToRef(this._deviceRoomPosition,this._workingMatrix,this._workingVector),this.devicePosition.subtractToRef(this._workingVector,this._workingVector),o.y3.ComposeToRef(this._oneVector,this.rotationQuaternion,this._workingVector,this._deviceToWorld),this._deviceToWorld.getTranslationToRef(this._workingVector),this._workingVector.addInPlace(this.position),this._workingVector.subtractInPlace(this._cache.position),this._deviceToWorld.setTranslation(this._workingVector),this._deviceToWorld.invertToRef(this._worldToDevice),this.controllers.forEach((e=>{e._deviceToWorld.copyFrom(this._deviceToWorld),this._correctPositionIfNotTrackPosition(e._deviceToWorld),e.update()}))),e||super._updateCache(),this._updateCacheCalled=!1}_computeDevicePosition(){o.P.TransformCoordinatesToRef(this._deviceRoomPosition,this._deviceToWorld,this.devicePosition)}update(){this._computeDevicePosition(),o.y3.FromQuaternionToRef(this._deviceRoomRotationQuaternion,this._workingMatrix),this._workingMatrix.multiplyToRef(this._deviceToWorld,this._workingMatrix),o._f.FromRotationMatrixToRef(this._workingMatrix,this.deviceRotationQuaternion),this._poseSet&&this.onPoseUpdatedFromDeviceObservable.notifyObservers(null),super.update()}_getViewMatrix(){return o.y3.Identity()}_getWebVRViewMatrix(){const e=this._cameraRigParams.parentCamera;e._updateCache();const t=this._cameraRigParams.left?this._cameraRigParams.frameData.leftViewMatrix:this._cameraRigParams.frameData.rightViewMatrix;return o.y3.FromArrayToRef(t,0,this._webvrViewMatrix),this.getScene().useRightHandedSystem||this._webvrViewMatrix.toggleModelMatrixHandInPlace(),this._webvrViewMatrix.getRotationMatrixToRef(this._cameraRotationMatrix),o.P.TransformCoordinatesToRef(this._referencePoint,this._cameraRotationMatrix,this._transformedReferencePoint),this.position.addToRef(this._transformedReferencePoint,this._currentTarget),1!==e.deviceScaleFactor&&(this._webvrViewMatrix.invert(),e.deviceScaleFactor&&(this._webvrViewMatrix.multiplyAtIndex(12,e.deviceScaleFactor),this._webvrViewMatrix.multiplyAtIndex(13,e.deviceScaleFactor),this._webvrViewMatrix.multiplyAtIndex(14,e.deviceScaleFactor)),this._webvrViewMatrix.invert()),e._correctPositionIfNotTrackPosition(this._webvrViewMatrix,!0),e._worldToDevice.multiplyToRef(this._webvrViewMatrix,this._webvrViewMatrix),this._workingMatrix=this._workingMatrix||o.y3.Identity(),this._webvrViewMatrix.invertToRef(this._workingMatrix),this._workingMatrix.multiplyToRef(e.getWorldMatrix(),this._workingMatrix),this._workingMatrix.getTranslationToRef(this._globalPosition),this._markSyncedWithParent(),this._webvrViewMatrix}_getWebVRProjectionMatrix(){const e=this.parent;e._vrDevice.depthNear=e.minZ,e._vrDevice.depthFar=e.maxZ;const t=this._cameraRigParams.left?this._cameraRigParams.frameData.leftProjectionMatrix:this._cameraRigParams.frameData.rightProjectionMatrix;return o.y3.FromArrayToRef(t,0,this._projectionMatrix),this.getScene().useRightHandedSystem||this._projectionMatrix.toggleProjectionMatrixHandInPlace(),this._projectionMatrix}initControllers(){this.controllers.length=0;const e=this.getScene().gamepadManager;this._onGamepadDisconnectedObserver=e.onGamepadDisconnectedObservable.add((e=>{if(e.type===tt.POSE_ENABLED){const t=e;t.defaultModel&&t.defaultModel.setEnabled(!1),"right"===t.hand&&(this._rightController=null),"left"===t.hand&&(this._leftController=null);const i=this.controllers.indexOf(t);-1!==i&&this.controllers.splice(i,1)}})),this._onGamepadConnectedObserver=e.onGamepadConnectedObservable.add((e=>{if(e.type===tt.POSE_ENABLED){const t=e;if(this._webVROptions.trackPosition||(t._disableTrackPosition(new o.P("left"==t.hand?-.15:.15,-.5,.25)),this._updateCacheWhenTrackingDisabledObserver||(this._updateCacheWhenTrackingDisabledObserver=this._scene.onBeforeRenderObservable.add((()=>{this._updateCache()})))),t.deviceScaleFactor=this.deviceScaleFactor,t._deviceToWorld.copyFrom(this._deviceToWorld),this._correctPositionIfNotTrackPosition(t._deviceToWorld),this._webVROptions.controllerMeshes&&(t.defaultModel?t.defaultModel.setEnabled(!0):t.initControllerMesh(this.getScene(),(e=>{if(e.scaling.scaleInPlace(this.deviceScaleFactor),this.onControllerMeshLoadedObservable.notifyObservers(t),this._webVROptions.defaultLightingOnControllers){this._lightOnControllers||(this._lightOnControllers=new Li.e("vrControllersLight",new o.P(0,1,0),this.getScene()));const t=function(e,i){const n=e.getChildren();n&&0!==n.length&&n.forEach((e=>{i.includedOnlyMeshes.push(e),t(e,i)}))};this._lightOnControllers.includedOnlyMeshes.push(e),t(e,this._lightOnControllers)}}))),t.attachToPoseControlledCamera(this),-1===this.controllers.indexOf(t)){this.controllers.push(t);let e=!1;for(let t=0;t<this.controllers.length;t++)this.controllers[t].controllerType===zt.VIVE&&(e?this.controllers[t].hand="right":(e=!0,this.controllers[t].hand="left"));this.controllers.length>=2&&this.onControllersAttachedObservable.notifyObservers(this.controllers)}}}))}}class Vi extends Kt{onButtonStateChange(e){this._onButtonStateChange=e}get defaultModel(){return this._defaultModel}constructor(e){super(e),this.onTriggerStateChangedObservable=new r.y$,this.onMainButtonStateChangedObservable=new r.y$,this.onSecondaryButtonStateChangedObservable=new r.y$,this.onPadStateChangedObservable=new r.y$,this.onPadValuesChangedObservable=new r.y$,this.pad={x:0,y:0},this._changes={pressChanged:!1,touchChanged:!1,valueChanged:!1,changed:!1},this._buttons=new Array(e.buttons.length),this.hand=e.hand}update(){super.update();for(let e=0;e<this._buttons.length;e++)this._setButtonValue(this.browserGamepad.buttons[e],this._buttons[e],e);this.leftStick.x===this.pad.x&&this.leftStick.y===this.pad.y||(this.pad.x=this.leftStick.x,this.pad.y=this.leftStick.y,this.onPadValuesChangedObservable.notifyObservers(this.pad))}_setButtonValue(e,t,i){e||(e={pressed:!1,touched:!1,value:0}),t?(this._checkChanges(e,t),this._changes.changed&&(this._onButtonStateChange&&this._onButtonStateChange(this.index,i,e),this._handleButtonChange(i,e,this._changes)),this._buttons[i].pressed=e.pressed,this._buttons[i].touched=e.touched,this._buttons[i].value=e.value<1e-8?0:e.value):this._buttons[i]={pressed:e.pressed,touched:e.touched,value:e.value}}_checkChanges(e,t){return this._changes.pressChanged=e.pressed!==t.pressed,this._changes.touchChanged=e.touched!==t.touched,this._changes.valueChanged=e.value!==t.value,this._changes.changed=this._changes.pressChanged||this._changes.touchChanged||this._changes.valueChanged,this._changes}dispose(){super.dispose(),this._defaultModel=null,this.onTriggerStateChangedObservable.clear(),this.onMainButtonStateChangedObservable.clear(),this.onSecondaryButtonStateChangedObservable.clear(),this.onPadStateChangedObservable.clear(),this.onPadValuesChangedObservable.clear()}}var ki=i(4475),Gi=i(252),zi=i(4160);i(5141),i(1423),i(3660);si.v.ShadersStore.imageProcessingPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\n#include<imageProcessingDeclaration>\n#include<helperFunctions>\n#include<imageProcessingFunctions>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nvec4 result=texture2D(textureSampler,vUV);\n#ifdef IMAGEPROCESSING\n#ifndef FROMLINEARSPACE\nresult.rgb=toLinearSpace(result.rgb);\n#endif\nresult=applyImageProcessing(result);\n#else\n#ifdef FROMLINEARSPACE\nresult=applyImageProcessing(result);\n#endif\n#endif\ngl_FragColor=result;\n}",i(8793);class Wi extends ni.D{get imageProcessingConfiguration(){return this._imageProcessingConfiguration}set imageProcessingConfiguration(e){e.applyByPostProcess=!0,this._attachImageProcessingConfiguration(e)}_attachImageProcessingConfiguration(e,t=!1){if(e!==this._imageProcessingConfiguration){if(this._imageProcessingConfiguration&&this._imageProcessingObserver&&this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver),e)this._imageProcessingConfiguration=e;else{let e=null;const t=this.getEngine(),i=this.getCamera();if(i)e=i.getScene();else if(t&&t.scenes){const i=t.scenes;e=i[i.length-1]}else e=A.l.LastCreatedScene;this._imageProcessingConfiguration=e?e.imageProcessingConfiguration:new ki.$}this._imageProcessingConfiguration&&(this._imageProcessingObserver=this._imageProcessingConfiguration.onUpdateParameters.add((()=>{this._updateParameters()}))),t||this._updateParameters()}}get isSupported(){const e=this.getEffect();return!e||e.isSupported}get colorCurves(){return this.imageProcessingConfiguration.colorCurves}set colorCurves(e){this.imageProcessingConfiguration.colorCurves=e}get colorCurvesEnabled(){return this.imageProcessingConfiguration.colorCurvesEnabled}set colorCurvesEnabled(e){this.imageProcessingConfiguration.colorCurvesEnabled=e}get colorGradingTexture(){return this.imageProcessingConfiguration.colorGradingTexture}set colorGradingTexture(e){this.imageProcessingConfiguration.colorGradingTexture=e}get colorGradingEnabled(){return this.imageProcessingConfiguration.colorGradingEnabled}set colorGradingEnabled(e){this.imageProcessingConfiguration.colorGradingEnabled=e}get exposure(){return this.imageProcessingConfiguration.exposure}set exposure(e){this.imageProcessingConfiguration.exposure=e}get toneMappingEnabled(){return this._imageProcessingConfiguration.toneMappingEnabled}set toneMappingEnabled(e){this._imageProcessingConfiguration.toneMappingEnabled=e}get toneMappingType(){return this._imageProcessingConfiguration.toneMappingType}set toneMappingType(e){this._imageProcessingConfiguration.toneMappingType=e}get contrast(){return this.imageProcessingConfiguration.contrast}set contrast(e){this.imageProcessingConfiguration.contrast=e}get vignetteStretch(){return this.imageProcessingConfiguration.vignetteStretch}set vignetteStretch(e){this.imageProcessingConfiguration.vignetteStretch=e}get vignetteCentreX(){return this.imageProcessingConfiguration.vignetteCenterX}set vignetteCentreX(e){this.imageProcessingConfiguration.vignetteCenterX=e}get vignetteCentreY(){return this.imageProcessingConfiguration.vignetteCenterY}set vignetteCentreY(e){this.imageProcessingConfiguration.vignetteCenterY=e}get vignetteCenterY(){return this.imageProcessingConfiguration.vignetteCenterY}set vignetteCenterY(e){this.imageProcessingConfiguration.vignetteCenterY=e}get vignetteCenterX(){return this.imageProcessingConfiguration.vignetteCenterX}set vignetteCenterX(e){this.imageProcessingConfiguration.vignetteCenterX=e}get vignetteWeight(){return this.imageProcessingConfiguration.vignetteWeight}set vignetteWeight(e){this.imageProcessingConfiguration.vignetteWeight=e}get vignetteColor(){return this.imageProcessingConfiguration.vignetteColor}set vignetteColor(e){this.imageProcessingConfiguration.vignetteColor=e}get vignetteCameraFov(){return this.imageProcessingConfiguration.vignetteCameraFov}set vignetteCameraFov(e){this.imageProcessingConfiguration.vignetteCameraFov=e}get vignetteBlendMode(){return this.imageProcessingConfiguration.vignetteBlendMode}set vignetteBlendMode(e){this.imageProcessingConfiguration.vignetteBlendMode=e}get vignetteEnabled(){return this.imageProcessingConfiguration.vignetteEnabled}set vignetteEnabled(e){this.imageProcessingConfiguration.vignetteEnabled=e}get ditheringIntensity(){return this.imageProcessingConfiguration.ditheringIntensity}set ditheringIntensity(e){this.imageProcessingConfiguration.ditheringIntensity=e}get ditheringEnabled(){return this.imageProcessingConfiguration.ditheringEnabled}set ditheringEnabled(e){this.imageProcessingConfiguration.ditheringEnabled=e}get fromLinearSpace(){return this._fromLinearSpace}set fromLinearSpace(e){this._fromLinearSpace!==e&&(this._fromLinearSpace=e,this._updateParameters())}constructor(e,t,i=null,n,s,r,o=0,a){super(e,"imageProcessing",[],[],t,i,n,s,r,null,o,"postprocess",null,!0),this._fromLinearSpace=!0,this._defines={IMAGEPROCESSING:!1,VIGNETTE:!1,VIGNETTEBLENDMODEMULTIPLY:!1,VIGNETTEBLENDMODEOPAQUE:!1,TONEMAPPING:!1,TONEMAPPING_ACES:!1,CONTRAST:!1,COLORCURVES:!1,COLORGRADING:!1,COLORGRADING3D:!1,FROMLINEARSPACE:!1,SAMPLER3DGREENDEPTH:!1,SAMPLER3DBGRMAP:!1,DITHER:!1,IMAGEPROCESSINGPOSTPROCESS:!1,EXPOSURE:!1,SKIPFINALCOLORCLAMP:!1},a?(a.applyByPostProcess=!0,this._attachImageProcessingConfiguration(a,!0),this._updateParameters()):(this._attachImageProcessingConfiguration(null,!0),this.imageProcessingConfiguration.applyByPostProcess=!0),this.onApply=e=>{this.imageProcessingConfiguration.bind(e,this.aspectRatio)}}getClassName(){return"ImageProcessingPostProcess"}_updateParameters(){this._defines.FROMLINEARSPACE=this._fromLinearSpace,this.imageProcessingConfiguration.prepareDefines(this._defines,!0);let e="";for(const t in this._defines)this._defines[t]&&(e+=`#define ${t};\r\n`);const t=["textureSampler"],i=["scale"];ki.$&&(ki.$.PrepareSamplers(t,this._defines),ki.$.PrepareUniforms(i,this._defines)),this.updateEffect(e,i,t)}dispose(e){super.dispose(e),this._imageProcessingConfiguration&&this._imageProcessingObserver&&this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver),this._imageProcessingConfiguration&&(this.imageProcessingConfiguration.applyByPostProcess=!1)}}(0,be.gn)([(0,Te.qC)()],Wi.prototype,"_fromLinearSpace",void 0);class Hi{get isFixedFoveationSupported(){return"XRWebGLLayer"==this.layerType&&"number"==typeof this.layer.fixedFoveation}get fixedFoveation(){return this.isFixedFoveationSupported?this.layer.fixedFoveation:null}set fixedFoveation(e){if(this.isFixedFoveationSupported){const t=Math.max(0,Math.min(1,e||0));this.layer.fixedFoveation=t}}constructor(e,t,i,n,s){this.getWidth=e,this.getHeight=t,this.layer=i,this.layerType=n,this.createRenderTargetTextureProvider=s}}var Xi,ji,Yi=i(2200);class qi{constructor(e,t){this._scene=e,this.layerWrapper=t,this._renderTargetTextures=new Array,this._engine=e.getEngine()}_createInternalTexture(e,t){const i=new Ei.l(this._engine,Ei.S.Unknown,!0);return i.width=e.width,i.height=e.height,i._hardwareTexture=new Yi.B(t,this._engine._gl),i.isReady=!0,i}_createRenderTargetTexture(e,t,i,n,s,r){if(!this._engine)throw new Error("Engine is disposed");const o={width:e,height:t},a=r?new Pi(this._scene,o):new Ai._("XR renderTargetTexture",o,this._scene),l=a.renderTarget;if(l._samples=a.samples,!i&&n||(l._framebuffer=i),n)if(r)l._colorTextureArray=n;else{const e=this._createInternalTexture(o,n);l.setTexture(e,0),a._texture=e}return s&&(r?l._depthStencilTextureArray=s:l._depthStencilTexture=this._createInternalTexture(o,s)),a.disableRescaling(),"undefined"!=typeof XRWebGLBinding&&(a.skipInitialClear=!0),this._renderTargetTextures.push(a),a}_destroyRenderTargetTexture(e){this._renderTargetTextures.splice(this._renderTargetTextures.indexOf(e),1),e.dispose()}getFramebufferDimensions(){return this._framebufferDimensions}dispose(){this._renderTargetTextures.forEach((e=>e.dispose())),this._renderTargetTextures.length=0}}class Ki extends Hi{constructor(e){super((()=>e.framebufferWidth),(()=>e.framebufferHeight),e,"XRWebGLLayer",(e=>new $i(e.scene,this))),this.layer=e}}class $i extends qi{constructor(e,t){super(e,t),this.layerWrapper=t,this._layer=t.layer,this._framebufferDimensions={framebufferWidth:this._layer.framebufferWidth,framebufferHeight:this._layer.framebufferHeight}}trySetViewportForView(e,t){const i=this._layer.getViewport(t);if(!i)return!1;const n=this._framebufferDimensions.framebufferWidth,s=this._framebufferDimensions.framebufferHeight;return e.x=i.x/n,e.y=i.y/s,e.width=i.width/n,e.height=i.height/s,!0}getRenderTargetTextureForEye(e){const t=this._layer.framebufferWidth,i=this._layer.framebufferHeight,n=this._layer.framebuffer;return this._rtt&&t===this._framebufferDimensions.framebufferWidth&&i===this._framebufferDimensions.framebufferHeight&&n===this._framebuffer||(this._rtt=this._createRenderTargetTexture(t,i,n),this._framebufferDimensions.framebufferWidth=t,this._framebufferDimensions.framebufferHeight=i,this._framebuffer=n),this._rtt}getRenderTargetTextureForView(e){return this.getRenderTargetTextureForEye(e.eye)}}class Qi{static GetDefaults(e){const t=new Qi;return t.canvasOptions={antialias:!0,depth:!0,stencil:!e||e.isStencilEnable,alpha:!0,framebufferScaleFactor:1},t.newCanvasCssStyle="position:absolute; bottom:0px;right:0px;z-index:10;width:90%;height:100%;background-color: #000000;",t}}class Zi{constructor(e,t=Qi.GetDefaults()){if(this._options=t,this._canvas=null,this._engine=null,this.xrLayer=null,this._xrLayerWrapper=null,this.onXRLayerInitObservable=new r.y$,this._engine=e.scene.getEngine(),this._engine.onDisposeObservable.addOnce((()=>{this._engine=null})),t.canvasElement)this._setManagedOutputCanvas(t.canvasElement);else{const e=document.createElement("canvas");e.style.cssText=this._options.newCanvasCssStyle||"position:absolute; bottom:0px;right:0px;",this._setManagedOutputCanvas(e)}e.onXRSessionInit.add((()=>{this._addCanvas()})),e.onXRSessionEnded.add((()=>{this._removeCanvas()}))}dispose(){this._removeCanvas(),this._setManagedOutputCanvas(null)}async initializeXRLayerAsync(e){const t=()=>(this.xrLayer=new XRWebGLLayer(e,this.canvasContext,this._options.canvasOptions),this._xrLayerWrapper=new Ki(this.xrLayer),this.onXRLayerInitObservable.notifyObservers(this.xrLayer),this.xrLayer);return this.canvasContext.makeXRCompatible?this.canvasContext.makeXRCompatible().then((()=>{}),(()=>{de.w1.Warn("Error executing makeXRCompatible. This does not mean that the session will work incorrectly.")})).then((()=>t())):Promise.resolve(t())}_addCanvas(){this._canvas&&this._engine&&this._canvas!==this._engine.getRenderingCanvas()&&document.body.appendChild(this._canvas),this.xrLayer?this._setCanvasSize(!0):this.onXRLayerInitObservable.addOnce((()=>{this._setCanvasSize(!0)}))}_removeCanvas(){this._canvas&&this._engine&&document.body.contains(this._canvas)&&this._canvas!==this._engine.getRenderingCanvas()&&document.body.removeChild(this._canvas),this._setCanvasSize(!1)}_setCanvasSize(e=!0,t=this._xrLayerWrapper){this._canvas&&this._engine&&(e?t&&(this._canvas!==this._engine.getRenderingCanvas()?(this._canvas.style.width=t.getWidth()+"px",this._canvas.style.height=t.getHeight()+"px"):this._engine.setSize(t.getWidth(),t.getHeight())):this._originalCanvasSize&&(this._canvas!==this._engine.getRenderingCanvas()?(this._canvas.style.width=this._originalCanvasSize.width+"px",this._canvas.style.height=this._originalCanvasSize.height+"px"):this._engine.setSize(this._originalCanvasSize.width,this._originalCanvasSize.height)))}_setManagedOutputCanvas(e){this._removeCanvas(),e?(this._originalCanvasSize={width:e.offsetWidth,height:e.offsetHeight},this._canvas=e,this.canvasContext=this._canvas.getContext("webgl2"),this.canvasContext||(this.canvasContext=this._canvas.getContext("webgl"))):(this._canvas=null,this.canvasContext=null)}}class Ji extends Hi{constructor(e){super((()=>e.framebufferWidth),(()=>e.framebufferHeight),e,"XRWebGLLayer",(e=>new en(e,this))),this.layer=e}}class en extends qi{constructor(e,t){super(e.scene,t),this.layerWrapper=t,this._nativeRTTProvider=navigator.xr.getNativeRenderTargetProvider(e.session,this._createRenderTargetTexture.bind(this),this._destroyRenderTargetTexture.bind(this)),this._nativeLayer=t.layer}trySetViewportForView(e){return e.x=0,e.y=0,e.width=1,e.height=1,!0}getRenderTargetTextureForEye(e){return this._nativeRTTProvider.getRenderTargetForEye(e)}getRenderTargetTextureForView(e){return this._nativeRTTProvider.getRenderTargetForEye(e.eye)}getFramebufferDimensions(){return{framebufferWidth:this._nativeLayer.framebufferWidth,framebufferHeight:this._nativeLayer.framebufferHeight}}}class tn{constructor(e){this._nativeRenderTarget=navigator.xr.getWebXRRenderTarget(e.scene.getEngine())}async initializeXRLayerAsync(e){return await this._nativeRenderTarget.initializeXRLayerAsync(e),this.xrLayer=this._nativeRenderTarget.xrLayer,this.xrLayer}dispose(){}}class nn{constructor(e){this.scene=e,this.currentTimestamp=-1,this.defaultHeightCompensation=1.7,this.onXRFrameObservable=new r.y$,this.onXRReferenceSpaceChanged=new r.y$,this.onXRSessionEnded=new r.y$,this.onXRSessionInit=new r.y$,this.inXRFrameLoop=!1,this.inXRSession=!1,this._engine=e.getEngine(),this._onEngineDisposedObserver=this._engine.onDisposeObservable.addOnce((()=>{this._engine=null})),e.onDisposeObservable.addOnce((()=>{this.dispose()}))}get referenceSpace(){return this._referenceSpace}set referenceSpace(e){this._referenceSpace=e,this.onXRReferenceSpaceChanged.notifyObservers(this._referenceSpace)}get sessionMode(){return this._sessionMode}dispose(){var e;this.inXRSession&&this.exitXRAsync(),this.onXRFrameObservable.clear(),this.onXRSessionEnded.clear(),this.onXRReferenceSpaceChanged.clear(),this.onXRSessionInit.clear(),null===(e=this._engine)||void 0===e||e.onDisposeObservable.remove(this._onEngineDisposedObserver),this._engine=null}exitXRAsync(){return this.session&&this.inXRSession?(this.inXRSession=!1,this.session.end().catch((()=>{_.Y.Warn("Could not end XR session.")}))):Promise.resolve()}trySetViewportForView(e,t){var i;return(null===(i=this._baseLayerRTTProvider)||void 0===i?void 0:i.trySetViewportForView(e,t))||!1}getRenderTargetTextureForEye(e){var t;return(null===(t=this._baseLayerRTTProvider)||void 0===t?void 0:t.getRenderTargetTextureForEye(e))||null}getRenderTargetTextureForView(e){var t;return(null===(t=this._baseLayerRTTProvider)||void 0===t?void 0:t.getRenderTargetTextureForView(e))||null}getWebXRRenderTarget(e){const t=this.scene.getEngine();return this._xrNavigator.xr.native?new tn(this):((e=e||Qi.GetDefaults(t)).canvasElement=e.canvasElement||t.getRenderingCanvas()||void 0,new Zi(this,e))}initializeAsync(){return this._xrNavigator=navigator,this._xrNavigator.xr?Promise.resolve():Promise.reject("WebXR not available")}initializeSessionAsync(e="immersive-vr",t={}){return this._xrNavigator.xr.requestSession(e,t).then((t=>(this.session=t,this._sessionMode=e,this.onXRSessionInit.notifyObservers(t),this.inXRSession=!0,this.session.addEventListener("end",(()=>{var e;this.inXRSession=!1,this.onXRSessionEnded.notifyObservers(null),this._engine&&(this._engine.framebufferDimensionsObject=null,this._engine.restoreDefaultFramebuffer(),this._engine.customAnimationFrameRequester=null,this._engine._renderLoop()),this.isNative&&(null===(e=this._baseLayerRTTProvider)||void 0===e||e.dispose()),this._baseLayerRTTProvider=null,this._baseLayerWrapper=null}),{once:!0}),this.session)))}isSessionSupportedAsync(e){return nn.IsSessionSupportedAsync(e)}resetReferenceSpace(){this.referenceSpace=this.baseReferenceSpace}runXRRenderLoop(){var e;this.inXRSession&&this._engine&&(this._engine.customAnimationFrameRequester={requestAnimationFrame:this.session.requestAnimationFrame.bind(this.session),renderFunction:(e,t)=>{var i;this.inXRSession&&this._engine&&(this.currentFrame=t,this.currentTimestamp=e,t&&(this.inXRFrameLoop=!0,this._engine.framebufferDimensionsObject=(null===(i=this._baseLayerRTTProvider)||void 0===i?void 0:i.getFramebufferDimensions())||null,this.onXRFrameObservable.notifyObservers(t),this._engine._renderLoop(),this._engine.framebufferDimensionsObject=null,this.inXRFrameLoop=!1))}},this._engine.framebufferDimensionsObject=(null===(e=this._baseLayerRTTProvider)||void 0===e?void 0:e.getFramebufferDimensions())||null,"undefined"!=typeof window&&window.cancelAnimationFrame&&window.cancelAnimationFrame(this._engine._frameHandler),this._engine._renderLoop())}setReferenceSpaceTypeAsync(e="local-floor"){return this.session.requestReferenceSpace(e).then((e=>e),(e=>(_.Y.Error("XR.requestReferenceSpace failed for the following reason: "),_.Y.Error(e),_.Y.Log('Defaulting to universally-supported "viewer" reference space type.'),this.session.requestReferenceSpace("viewer").then((e=>{const t=new XRRigidTransform({x:0,y:-this.defaultHeightCompensation,z:0});return e.getOffsetReferenceSpace(t)}),(e=>{throw _.Y.Error(e),'XR initialization failed: required "viewer" reference space type not supported.'}))))).then((e=>this.session.requestReferenceSpace("viewer").then((t=>(this.viewerReferenceSpace=t,e))))).then((e=>(this.referenceSpace=this.baseReferenceSpace=e,this.referenceSpace)))}updateRenderStateAsync(e){return Promise.resolve(this.session.updateRenderState(e))}_setBaseLayerWrapper(e){var t,i;this.isNative&&(null===(t=this._baseLayerRTTProvider)||void 0===t||t.dispose()),this._baseLayerWrapper=e,this._baseLayerRTTProvider=(null===(i=this._baseLayerWrapper)||void 0===i?void 0:i.createRenderTargetTextureProvider(this))||null}updateRenderState(e){e.baseLayer&&this._setBaseLayerWrapper(this.isNative?new Ji(e.baseLayer):new Ki(e.baseLayer)),this.session.updateRenderState(e)}static IsSessionSupportedAsync(e){if(!navigator.xr)return Promise.resolve(!1);const t=navigator.xr.isSessionSupported||navigator.xr.supportsSession;return t?t.call(navigator.xr,e).then((e=>{const t=void 0===e||e;return Promise.resolve(t)})).catch((e=>(_.Y.Warn(e),Promise.resolve(!1)))):Promise.resolve(!1)}get isNative(){var e;return null!==(e=this._xrNavigator.xr.native)&&void 0!==e&&e}get currentFrameRate(){var e;return null===(e=this.session)||void 0===e?void 0:e.frameRate}get supportedFrameRates(){var e;return null===(e=this.session)||void 0===e?void 0:e.supportedFrameRates}updateTargetFrameRate(e){return this.session.updateTargetFrameRate(e)}runInXRFrame(e,t=!0){this.inXRFrameLoop?e():!this.inXRSession&&t||this.onXRFrameObservable.addOnce(e)}get isFixedFoveationSupported(){var e;return(null===(e=this._baseLayerWrapper)||void 0===e?void 0:e.isFixedFoveationSupported)||!1}get fixedFoveation(){var e;return(null===(e=this._baseLayerWrapper)||void 0===e?void 0:e.fixedFoveation)||null}set fixedFoveation(e){const t=Math.max(0,Math.min(1,e||0));this._baseLayerWrapper&&(this._baseLayerWrapper.fixedFoveation=t)}}!function(e){e[e.ENTERING_XR=0]="ENTERING_XR",e[e.EXITING_XR=1]="EXITING_XR",e[e.IN_XR=2]="IN_XR",e[e.NOT_IN_XR=3]="NOT_IN_XR"}(Xi||(Xi={})),function(e){e[e.NOT_TRACKING=0]="NOT_TRACKING",e[e.TRACKING_LOST=1]="TRACKING_LOST",e[e.TRACKING=2]="TRACKING"}(ji||(ji={}));var sn=i(2101),rn=i(4892);function on(e){const t=e.height||2;let i=0===e.diameterTop?0:e.diameterTop||e.diameter||1,n=0===e.diameterBottom?0:e.diameterBottom||e.diameter||1;i=i||1e-5,n=n||1e-5;const s=e.tessellation||24,r=e.subdivisions||1,l=!!e.hasRings,h=!!e.enclose,c=0===e.cap?0:e.cap||Nt.Kj.CAP_ALL,u=e.arc&&(e.arc<=0||e.arc>1)?1:e.arc||1,d=0===e.sideOrientation?0:e.sideOrientation||sn.x.DEFAULTSIDE,p=e.faceUV||new Array(3),f=e.faceColors,_=2+(1+(1!==u&&h?2:0))*(l?r:1);let m;for(m=0;m<_;m++)f&&void 0===f[m]&&(f[m]=new a.HE(1,1,1,1));for(m=0;m<_;m++)p&&void 0===p[m]&&(p[m]=new o.Lt(0,0,1,1));const g=new Array,v=new Array,y=new Array,x=new Array,b=new Array,T=2*Math.PI*u/s;let S,E,C;const A=(n-i)/2/t,P=o.P.Zero(),R=o.P.Zero(),M=o.P.Zero(),I=o.P.Zero(),D=o.P.Zero(),O=We.RD.Y;let w,N,F,L=1,B=1,U=0,V=0;for(w=0;w<=r;w++)for(E=w/r,C=(E*(i-n)+n)/2,L=l&&0!==w&&w!==r?2:1,F=0;F<L;F++){for(l&&(B+=F),h&&(B+=2*F),N=0;N<=s;N++)S=N*T,P.x=Math.cos(-S)*C,P.y=-t/2+E*t,P.z=Math.sin(-S)*C,0===i&&w===r?(R.x=y[y.length-3*(s+1)],R.y=y[y.length-3*(s+1)+1],R.z=y[y.length-3*(s+1)+2]):(R.x=P.x,R.z=P.z,R.y=Math.sqrt(R.x*R.x+R.z*R.z)*A,R.normalize()),0===N&&(M.copyFrom(P),I.copyFrom(R)),v.push(P.x,P.y,P.z),y.push(R.x,R.y,R.z),V=l?U!==B?p[B].y:p[B].w:p[B].y+(p[B].w-p[B].y)*E,x.push(p[B].x+(p[B].z-p[B].x)*N/s,rn.e.UseOpenGLOrientationForUV?1-V:V),f&&b.push(f[B].r,f[B].g,f[B].b,f[B].a);1!==u&&h&&(v.push(P.x,P.y,P.z),v.push(0,P.y,0),v.push(0,P.y,0),v.push(M.x,M.y,M.z),o.P.CrossToRef(O,R,D),D.normalize(),y.push(D.x,D.y,D.z,D.x,D.y,D.z),o.P.CrossToRef(I,O,D),D.normalize(),y.push(D.x,D.y,D.z,D.x,D.y,D.z),V=l?U!==B?p[B+1].y:p[B+1].w:p[B+1].y+(p[B+1].w-p[B+1].y)*E,x.push(p[B+1].x,rn.e.UseOpenGLOrientationForUV?1-V:V),x.push(p[B+1].z,rn.e.UseOpenGLOrientationForUV?1-V:V),V=l?U!==B?p[B+2].y:p[B+2].w:p[B+2].y+(p[B+2].w-p[B+2].y)*E,x.push(p[B+2].x,rn.e.UseOpenGLOrientationForUV?1-V:V),x.push(p[B+2].z,rn.e.UseOpenGLOrientationForUV?1-V:V),f&&(b.push(f[B+1].r,f[B+1].g,f[B+1].b,f[B+1].a),b.push(f[B+1].r,f[B+1].g,f[B+1].b,f[B+1].a),b.push(f[B+2].r,f[B+2].g,f[B+2].b,f[B+2].a),b.push(f[B+2].r,f[B+2].g,f[B+2].b,f[B+2].a))),U!==B&&(U=B)}const k=1!==u&&h?s+4:s;for(w=0,B=0;B<r;B++){let e=0,t=0,i=0,n=0;for(N=0;N<s;N++)e=w*(k+1)+N,t=(w+1)*(k+1)+N,i=w*(k+1)+(N+1),n=(w+1)*(k+1)+(N+1),g.push(e,t,i),g.push(n,i,t);1!==u&&h&&(g.push(e+2,t+2,i+2),g.push(n+2,i+2,t+2),g.push(e+4,t+4,i+4),g.push(n+4,i+4,t+4)),w=l?w+2:w+1}const G=e=>{const r=e?i/2:n/2;if(0===r)return;let a,l,h;const c=e?p[_-1]:p[0];let d=null;f&&(d=e?f[_-1]:f[0]);const m=v.length/3,T=e?t/2:-t/2,S=new o.P(0,T,0);v.push(S.x,S.y,S.z),y.push(0,e?1:-1,0);const E=c.y+.5*(c.w-c.y);x.push(c.x+.5*(c.z-c.x),rn.e.UseOpenGLOrientationForUV?1-E:E),d&&b.push(d.r,d.g,d.b,d.a);const C=new o.FM(.5,.5);for(h=0;h<=s;h++){a=2*Math.PI*h*u/s;const t=Math.cos(-a),i=Math.sin(-a);l=new o.P(t*r,T,i*r);const n=new o.FM(t*C.x+.5,i*C.y+.5);v.push(l.x,l.y,l.z),y.push(0,e?1:-1,0);const p=c.y+(c.w-c.y)*n.y;x.push(c.x+(c.z-c.x)*n.x,rn.e.UseOpenGLOrientationForUV?1-p:p),d&&b.push(d.r,d.g,d.b,d.a)}for(h=0;h<s;h++)e?(g.push(m),g.push(m+(h+2)),g.push(m+(h+1))):(g.push(m),g.push(m+(h+1)),g.push(m+(h+2)))};c!==Nt.Kj.CAP_START&&c!==Nt.Kj.CAP_ALL||G(!1),c!==Nt.Kj.CAP_END&&c!==Nt.Kj.CAP_ALL||G(!0),sn.x._ComputeSides(d,v,g,y,x,e.frontUVs,e.backUVs);const z=new sn.x;return z.indices=g,z.positions=v,z.normals=y,z.uvs=x,f&&(z.colors=b),z}function an(e,t={},i){const n=new Nt.Kj(e,i);return t.sideOrientation=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),n._originalBuilderSideOrientation=t.sideOrientation,on(t).applyToMesh(n,t.updatable),n}const ln={CreateCylinder:an};function hn(e){const t=[],i=[],n=[],s=[],r=e.diameter||1,a=e.thickness||.5,l=e.tessellation||16,h=0===e.sideOrientation?0:e.sideOrientation||sn.x.DEFAULTSIDE,c=l+1;for(let e=0;e<=l;e++){const h=e/l,u=e*Math.PI*2/l-Math.PI/2,d=o.y3.Translation(r/2,0,0).multiply(o.y3.RotationY(u));for(let r=0;r<=l;r++){const u=1-r/l,p=r*Math.PI*2/l+Math.PI,f=Math.cos(p),_=Math.sin(p);let m=new o.P(f,_,0),g=m.scale(a/2);const v=new o.FM(h,u);g=o.P.TransformCoordinates(g,d),m=o.P.TransformNormal(m,d),i.push(g.x,g.y,g.z),n.push(m.x,m.y,m.z),s.push(v.x,rn.e.UseOpenGLOrientationForUV?1-v.y:v.y);const y=(e+1)%c,x=(r+1)%c;t.push(e*c+r),t.push(e*c+x),t.push(y*c+r),t.push(e*c+x),t.push(y*c+x),t.push(y*c+r)}}sn.x._ComputeSides(h,i,t,n,s,e.frontUVs,e.backUVs);const u=new sn.x;return u.indices=t,u.positions=i,u.normals=n,u.uvs=s,u}function cn(e,t={},i){const n=new Nt.Kj(e,i);return t.sideOrientation=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),n._originalBuilderSideOrientation=t.sideOrientation,hn(t).applyToMesh(n,t.updatable),n}sn.x.CreateCylinder=on,Nt.Kj.CreateCylinder=(e,t,i,n,s,r,o,a,l)=>(void 0!==o&&o instanceof k.x||(void 0!==o&&(l=a||Nt.Kj.DEFAULTSIDE,a=o),o=r,r=1),an(e,{height:t,diameterTop:i,diameterBottom:n,tessellation:s,subdivisions:r,sideOrientation:l,updatable:a},o));const un={CreateTorus:cn};sn.x.CreateTorus=hn,Nt.Kj.CreateTorus=(e,t,i,n,s,r,o)=>cn(e,{diameter:t,thickness:i,tessellation:n,sideOrientation:o,updatable:r},s);var dn=i(8027);class pn{constructor(e,t=null){if(this.scene=e,this._pointerDownOnMeshAsked=!1,this._isActionableMesh=!1,this._teleportationRequestInitiated=!1,this._teleportationBackRequestInitiated=!1,this._rotationRightAsked=!1,this._rotationLeftAsked=!1,this._dpadPressed=!0,this._activePointer=!1,this._id=pn._IdCounter++,t)this._gazeTracker=t.clone("gazeTracker");else{this._gazeTracker=cn("gazeTracker",{diameter:.0035,thickness:.0025,tessellation:20,updatable:!1},e),this._gazeTracker.bakeCurrentTransformIntoVertices(),this._gazeTracker.isPickable=!1,this._gazeTracker.isVisible=!1;const t=new Gi.K("targetMat",e);t.specularColor=a.Wo.Black(),t.emissiveColor=new a.Wo(.7,.7,.7),t.backFaceCulling=!1,this._gazeTracker.material=t}}_getForwardRay(e){return new Yt.z(o.P.Zero(),new o.P(0,0,e))}_selectionPointerDown(){this._pointerDownOnMeshAsked=!0,this._currentHit&&this.scene.simulatePointerDown(this._currentHit,{pointerId:this._id})}_selectionPointerUp(){this._currentHit&&this.scene.simulatePointerUp(this._currentHit,{pointerId:this._id}),this._pointerDownOnMeshAsked=!1}_activatePointer(){this._activePointer=!0}_deactivatePointer(){this._activePointer=!1}_updatePointerDistance(e=100){}dispose(){this._interactionsEnabled=!1,this._teleportationEnabled=!1,this._gazeTracker&&this._gazeTracker.dispose()}}pn._IdCounter=0;class fn extends pn{constructor(e,t,i){super(t,i),this.webVRController=e,this._laserPointer=an("laserPointer",{updatable:!1,height:1,diameterTop:.004,diameterBottom:2e-4,tessellation:20,subdivisions:1},t);const n=new Gi.K("laserPointerMat",t);if(n.emissiveColor=new a.Wo(.7,.7,.7),n.alpha=.6,this._laserPointer.material=n,this._laserPointer.rotation.x=Math.PI/2,this._laserPointer.position.z=-.5,this._laserPointer.isVisible=!1,this._laserPointer.isPickable=!1,!e.mesh){const i=new Nt.Kj("preloadControllerMesh",t),n=new Nt.Kj(Kt.POINTING_POSE,t);n.rotation.x=-.7,i.addChild(n),e.attachToMesh(i)}this._setLaserPointerParent(e.mesh),this._meshAttachedObserver=e._meshAttachedObservable.add((e=>{this._setLaserPointerParent(e)}))}_getForwardRay(e){return this.webVRController.getForwardRay(e)}_activatePointer(){super._activatePointer(),this._laserPointer.isVisible=!0}_deactivatePointer(){super._deactivatePointer(),this._laserPointer.isVisible=!1}_setLaserPointerColor(e){this._laserPointer.material.emissiveColor=e}_setLaserPointerLightingDisabled(e){this._laserPointer.material.disableLighting=e}_setLaserPointerParent(e){const t=e=>{e.isPickable=!1,e.getChildMeshes().forEach((e=>{t(e)}))};t(e);const i=e.getChildren(void 0,!1);let n=e;this.webVRController._pointingPoseNode=null;for(let e=0;e<i.length;e++)if(i[e].name&&i[e].name.indexOf(Kt.POINTING_POSE)>=0){n=i[e],this.webVRController._pointingPoseNode=n;break}this._laserPointer.parent=n}_updatePointerDistance(e=100){this._laserPointer.scaling.y=e,this._laserPointer.position.z=-e/2}dispose(){super.dispose(),this._laserPointer.dispose(),this._meshAttachedObserver&&this.webVRController._meshAttachedObservable.remove(this._meshAttachedObserver)}}class _n extends pn{constructor(e,t){super(t),this._getCamera=e}_getForwardRay(e){const t=this._getCamera();return t?t.getForwardRay(e):new Yt.z(o.P.Zero(),o.P.Forward())}}class mn{}class gn{get onEnteringVR(){return this.onEnteringVRObservable}get onExitingVR(){return this.onExitingVRObservable}get onControllerMeshLoaded(){return this.onControllerMeshLoadedObservable}get teleportationTarget(){return this._teleportationTarget}set teleportationTarget(e){e&&(e.name="teleportationTarget",this._isDefaultTeleportationTarget=!1,this._teleportationTarget=e)}get gazeTrackerMesh(){return this._cameraGazer._gazeTracker}set gazeTrackerMesh(e){e&&(this._cameraGazer._gazeTracker&&this._cameraGazer._gazeTracker.dispose(),this._leftController&&this._leftController._gazeTracker&&this._leftController._gazeTracker.dispose(),this._rightController&&this._rightController._gazeTracker&&this._rightController._gazeTracker.dispose(),this._cameraGazer._gazeTracker=e,this._cameraGazer._gazeTracker.bakeCurrentTransformIntoVertices(),this._cameraGazer._gazeTracker.isPickable=!1,this._cameraGazer._gazeTracker.isVisible=!1,this._cameraGazer._gazeTracker.name="gazeTracker",this._leftController&&(this._leftController._gazeTracker=this._cameraGazer._gazeTracker.clone("gazeTracker")),this._rightController&&(this._rightController._gazeTracker=this._cameraGazer._gazeTracker.clone("gazeTracker")))}get leftControllerGazeTrackerMesh(){return this._leftController?this._leftController._gazeTracker:null}get rightControllerGazeTrackerMesh(){return this._rightController?this._rightController._gazeTracker:null}get displayGaze(){return this._displayGaze}set displayGaze(e){this._displayGaze=e,e||(this._cameraGazer._gazeTracker.isVisible=!1,this._leftController&&(this._leftController._gazeTracker.isVisible=!1),this._rightController&&(this._rightController._gazeTracker.isVisible=!1))}get displayLaserPointer(){return this._displayLaserPointer}set displayLaserPointer(e){this._displayLaserPointer=e,e?(this._rightController&&this._rightController._activatePointer(),this._leftController&&this._leftController._activatePointer()):(this._rightController&&(this._rightController._deactivatePointer(),this._rightController._gazeTracker.isVisible=!1),this._leftController&&(this._leftController._deactivatePointer(),this._leftController._gazeTracker.isVisible=!1))}get deviceOrientationCamera(){return this._deviceOrientationCamera}get currentVRCamera(){return this._webVRready?this._webVRCamera:this._scene.activeCamera}get webVRCamera(){return this._webVRCamera}get vrDeviceOrientationCamera(){return this._vrDeviceOrientationCamera}get vrButton(){return this._btnVR}get _teleportationRequestInitiated(){return this._cameraGazer._teleportationRequestInitiated||null!==this._leftController&&this._leftController._teleportationRequestInitiated||null!==this._rightController&&this._rightController._teleportationRequestInitiated}constructor(e,t={}){if(this.webVROptions=t,this._webVRsupported=!1,this._webVRready=!1,this._webVRrequesting=!1,this._webVRpresenting=!1,this._fullscreenVRpresenting=!1,this.enableGazeEvenWhenNoPointerLock=!1,this.exitVROnDoubleTap=!0,this.onEnteringVRObservable=new r.y$,this.onAfterEnteringVRObservable=new r.y$,this.onExitingVRObservable=new r.y$,this.onControllerMeshLoadedObservable=new r.y$,this._useCustomVRButton=!1,this._teleportationRequested=!1,this._teleportActive=!1,this._floorMeshesCollection=[],this._teleportationMode=gn.TELEPORTATIONMODE_CONSTANTTIME,this._teleportationTime=122,this._teleportationSpeed=20,this._rotationAllowed=!0,this._teleportBackwardsVector=new o.P(0,-1,-1),this._isDefaultTeleportationTarget=!0,this._teleportationFillColor="#444444",this._teleportationBorderColor="#FFFFFF",this._rotationAngle=0,this._haloCenter=new o.P(0,0,0),this._padSensibilityUp=.65,this._padSensibilityDown=.35,this._leftController=null,this._rightController=null,this._gazeColor=new a.Wo(.7,.7,.7),this._laserColor=new a.Wo(.7,.7,.7),this._pickedLaserColor=new a.Wo(.2,.2,1),this._pickedGazeColor=new a.Wo(0,0,1),this.onNewMeshSelected=new r.y$,this.onMeshSelectedWithController=new r.y$,this.onNewMeshPicked=new r.y$,this.onBeforeCameraTeleport=new r.y$,this.onAfterCameraTeleport=new r.y$,this.onSelectedMeshUnselected=new r.y$,this.teleportationEnabled=!0,this._teleportationInitialized=!1,this._interactionsEnabled=!1,this._interactionsRequested=!1,this._displayGaze=!0,this._displayLaserPointer=!0,this.updateGazeTrackerScale=!0,this.updateGazeTrackerColor=!0,this.updateControllerLaserColor=!0,this.requestPointerLockOnFullScreen=!0,this.xrTestDone=!1,this._onResize=()=>{this._moveButtonToBottomRight(),this._fullscreenVRpresenting&&this._webVRready&&this.exitVR()},this._onFullscreenChange=()=>{this._fullscreenVRpresenting=!!document.fullscreenElement,!this._fullscreenVRpresenting&&this._inputElement&&(this.exitVR(),!this._useCustomVRButton&&this._btnVR&&(this._btnVR.style.top=this._inputElement.offsetTop+this._inputElement.offsetHeight-70+"px",this._btnVR.style.left=this._inputElement.offsetLeft+this._inputElement.offsetWidth-100+"px",this._updateButtonVisibility()))},this._cachedAngularSensibility={angularSensibilityX:null,angularSensibilityY:null,angularSensibility:null},this._beforeRender=()=>{this._leftController&&this._leftController._activePointer&&this._castRayAndSelectObject(this._leftController),this._rightController&&this._rightController._activePointer&&this._castRayAndSelectObject(this._rightController),this._noControllerIsActive&&(this._scene.getEngine().isPointerLock||this.enableGazeEvenWhenNoPointerLock)?this._castRayAndSelectObject(this._cameraGazer):this._cameraGazer._gazeTracker.isVisible=!1},this._onNewGamepadConnected=e=>{if(e.type!==tt.POSE_ENABLED)e.leftStick&&e.onleftstickchanged((e=>{this._teleportationInitialized&&this.teleportationEnabled&&(!this._leftController&&!this._rightController||this._leftController&&!this._leftController._activePointer&&this._rightController&&!this._rightController._activePointer)&&(this._checkTeleportWithRay(e,this._cameraGazer),this._checkTeleportBackwards(e,this._cameraGazer))})),e.rightStick&&e.onrightstickchanged((e=>{this._teleportationInitialized&&this._checkRotate(e,this._cameraGazer)})),e.type===tt.XBOX&&(e.onbuttondown((e=>{this._interactionsEnabled&&e===Wt.A&&this._cameraGazer._selectionPointerDown()})),e.onbuttonup((e=>{this._interactionsEnabled&&e===Wt.A&&this._cameraGazer._selectionPointerUp()})));else{const t=e,i=new fn(t,this._scene,this._cameraGazer._gazeTracker);"right"===t.hand||this._leftController&&this._leftController.webVRController!=t?this._rightController=i:this._leftController=i,this._tryEnableInteractionOnController(i)}},this._tryEnableInteractionOnController=e=>{this._interactionsRequested&&!e._interactionsEnabled&&this._enableInteractionOnController(e),this._teleportationRequested&&!e._teleportationEnabled&&this._enableTeleportationOnController(e)},this._onNewGamepadDisconnected=e=>{e instanceof Vi&&("left"===e.hand&&null!=this._leftController&&(this._leftController.dispose(),this._leftController=null),"right"===e.hand&&null!=this._rightController&&(this._rightController.dispose(),this._rightController=null))},this._workingVector=o.P.Zero(),this._workingQuaternion=o._f.Identity(),this._workingMatrix=o.y3.Identity(),_.Y.Warn("WebVR is deprecated. Please avoid using this experience helper and use the WebXR experience helper instead"),this._scene=e,this._inputElement=e.getEngine().getInputElement(),"getVRDisplays"in navigator||void 0!==t.useXR||(t.useXR=!0),void 0===t.createFallbackVRDeviceOrientationFreeCamera&&(t.createFallbackVRDeviceOrientationFreeCamera=!0),void 0===t.createDeviceOrientationCamera&&(t.createDeviceOrientationCamera=!0),void 0===t.laserToggle&&(t.laserToggle=!0),void 0===t.defaultHeight&&(t.defaultHeight=1.7),t.useCustomVRButton&&(this._useCustomVRButton=!0,t.customVRButton&&(this._btnVR=t.customVRButton)),t.rayLength&&(this._rayLength=t.rayLength),this._defaultHeight=t.defaultHeight,t.positionScale&&(this._rayLength*=t.positionScale,this._defaultHeight*=t.positionScale),this._hasEnteredVR=!1,this._scene.activeCamera?this._position=this._scene.activeCamera.position.clone():this._position=new o.P(0,this._defaultHeight,0),t.createDeviceOrientationCamera||!this._scene.activeCamera){if(this._deviceOrientationCamera=new Lt("deviceOrientationVRHelper",this._position.clone(),e),this._scene.activeCamera&&(this._deviceOrientationCamera.minZ=this._scene.activeCamera.minZ,this._deviceOrientationCamera.maxZ=this._scene.activeCamera.maxZ,this._scene.activeCamera instanceof It.C&&this._scene.activeCamera.rotation)){const e=this._scene.activeCamera;e.rotationQuaternion?this._deviceOrientationCamera.rotationQuaternion.copyFrom(e.rotationQuaternion):this._deviceOrientationCamera.rotationQuaternion.copyFrom(o._f.RotationYawPitchRoll(e.rotation.y,e.rotation.x,e.rotation.z)),this._deviceOrientationCamera.rotation=e.rotation.clone()}this._scene.activeCamera=this._deviceOrientationCamera,this._inputElement&&this._scene.activeCamera.attachControl()}else this._existingCamera=this._scene.activeCamera;this.webVROptions.useXR&&navigator.xr?nn.IsSessionSupportedAsync("immersive-vr").then((i=>{i?(_.Y.Log("Using WebXR. It is recommended to use the WebXRDefaultExperience directly"),e.createDefaultXRExperienceAsync({floorMeshes:t.floorMeshes||[]}).then((t=>{this.xr=t,this.xrTestDone=!0,this._cameraGazer=new _n((()=>this.xr.baseExperience.camera),e),this.xr.baseExperience.onStateChangedObservable.add((e=>{switch(e){case Xi.ENTERING_XR:this.onEnteringVRObservable.notifyObservers(this),this._interactionsEnabled||this.xr.pointerSelection.detach(),this.xr.pointerSelection.displayLaserPointer=this._displayLaserPointer;break;case Xi.EXITING_XR:this.onExitingVRObservable.notifyObservers(this),this._scene.getEngine().resize();break;case Xi.IN_XR:this._hasEnteredVR=!0;break;case Xi.NOT_IN_XR:this._hasEnteredVR=!1}}))}))):this._completeVRInit(e,t)})):this._completeVRInit(e,t)}_completeVRInit(e,t){if(this.xrTestDone=!0,t.createFallbackVRDeviceOrientationFreeCamera&&(t.useMultiview&&(t.vrDeviceOrientationCameraMetrics||(t.vrDeviceOrientationCameraMetrics=Ti.GetDefault()),t.vrDeviceOrientationCameraMetrics.multiviewEnabled=!0),this._vrDeviceOrientationCamera=new Ni("VRDeviceOrientationVRHelper",this._position,this._scene,!0,t.vrDeviceOrientationCameraMetrics),this._vrDeviceOrientationCamera.angularSensibility=Number.MAX_VALUE),this._webVRCamera=new Ui("WebVRHelper",this._position,this._scene,t),this._webVRCamera.useStandingMatrix(),this._cameraGazer=new _n((()=>this.currentVRCamera),e),!this._useCustomVRButton){this._btnVR=document.createElement("BUTTON"),this._btnVR.className="babylonVRicon",this._btnVR.id="babylonVRiconbtn",this._btnVR.title="Click to switch to VR";let e=".babylonVRicon { position: absolute; right: 20px; height: 50px; width: 80px; background-color: rgba(51,51,51,0.7); background-image: url("+(window.SVGSVGElement?"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%222048%22%20height%3D%221152%22%20viewBox%3D%220%200%202048%201152%22%20version%3D%221.1%22%3E%3Cpath%20transform%3D%22rotate%28180%201024%2C576.0000000000001%29%22%20d%3D%22m1109%2C896q17%2C0%2030%2C-12t13%2C-30t-12.5%2C-30.5t-30.5%2C-12.5l-170%2C0q-18%2C0%20-30.5%2C12.5t-12.5%2C30.5t13%2C30t30%2C12l170%2C0zm-85%2C256q59%2C0%20132.5%2C-1.5t154.5%2C-5.5t164.5%2C-11.5t163%2C-20t150%2C-30t124.5%2C-41.5q23%2C-11%2042%2C-24t38%2C-30q27%2C-25%2041%2C-61.5t14%2C-72.5l0%2C-257q0%2C-123%20-47%2C-232t-128%2C-190t-190%2C-128t-232%2C-47l-81%2C0q-37%2C0%20-68.5%2C14t-60.5%2C34.5t-55.5%2C45t-53%2C45t-53%2C34.5t-55.5%2C14t-55.5%2C-14t-53%2C-34.5t-53%2C-45t-55.5%2C-45t-60.5%2C-34.5t-68.5%2C-14l-81%2C0q-123%2C0%20-232%2C47t-190%2C128t-128%2C190t-47%2C232l0%2C257q0%2C68%2038%2C115t97%2C73q54%2C24%20124.5%2C41.5t150%2C30t163%2C20t164.5%2C11.5t154.5%2C5.5t132.5%2C1.5zm939%2C-298q0%2C39%20-24.5%2C67t-58.5%2C42q-54%2C23%20-122%2C39.5t-143.5%2C28t-155.5%2C19t-157%2C11t-148.5%2C5t-129.5%2C1.5q-59%2C0%20-130%2C-1.5t-148%2C-5t-157%2C-11t-155.5%2C-19t-143.5%2C-28t-122%2C-39.5q-34%2C-14%20-58.5%2C-42t-24.5%2C-67l0%2C-257q0%2C-106%2040.5%2C-199t110%2C-162.5t162.5%2C-109.5t199%2C-40l81%2C0q27%2C0%2052%2C14t50%2C34.5t51%2C44.5t55.5%2C44.5t63.5%2C34.5t74%2C14t74%2C-14t63.5%2C-34.5t55.5%2C-44.5t51%2C-44.5t50%2C-34.5t52%2C-14l14%2C0q37%2C0%2070%2C0.5t64.5%2C4.5t63.5%2C12t68%2C23q71%2C30%20128.5%2C78.5t98.5%2C110t63.5%2C133.5t22.5%2C149l0%2C257z%22%20fill%3D%22white%22%20/%3E%3C/svg%3E%0A":"https://cdn.babylonjs.com/Assets/vrButton.png")+"); background-size: 80%; background-repeat:no-repeat; background-position: center; border: none; outline: none; transition: transform 0.125s ease-out } .babylonVRicon:hover { transform: scale(1.05) } .babylonVRicon:active {background-color: rgba(51,51,51,1) } .babylonVRicon:focus {background-color: rgba(51,51,51,1) }";e+=".babylonVRicon.vrdisplaypresenting { display: none; }";const t=document.createElement("style");t.appendChild(document.createTextNode(e)),document.getElementsByTagName("head")[0].appendChild(t),this._moveButtonToBottomRight()}this._btnVR&&this._btnVR.addEventListener("click",(()=>{this.isInVRMode?this._scene.getEngine().disableVR():this.enterVR()}));const i=this._scene.getEngine().getHostWindow();i&&(i.addEventListener("resize",this._onResize),document.addEventListener("fullscreenchange",this._onFullscreenChange,!1),t.createFallbackVRDeviceOrientationFreeCamera?this._displayVRButton():this._scene.getEngine().onVRDisplayChangedObservable.add((e=>{e.vrDisplay&&this._displayVRButton()})),this._onKeyDown=e=>{27===e.keyCode&&this.isInVRMode&&this.exitVR()},document.addEventListener("keydown",this._onKeyDown),this._scene.onPrePointerObservable.add((()=>{this._hasEnteredVR&&this.exitVROnDoubleTap&&(this.exitVR(),this._fullscreenVRpresenting&&this._scene.getEngine().exitFullscreen())}),Re.kD.POINTERDOUBLETAP,!1),this._onVRDisplayChangedBind=e=>this._onVRDisplayChanged(e),this._onVrDisplayPresentChangeBind=()=>this._onVrDisplayPresentChange(),this._onVRRequestPresentStart=()=>{this._webVRrequesting=!0,this._updateButtonVisibility()},this._onVRRequestPresentComplete=()=>{this._webVRrequesting=!1,this._updateButtonVisibility()},e.getEngine().onVRDisplayChangedObservable.add(this._onVRDisplayChangedBind),e.getEngine().onVRRequestPresentStart.add(this._onVRRequestPresentStart),e.getEngine().onVRRequestPresentComplete.add(this._onVRRequestPresentComplete),i.addEventListener("vrdisplaypresentchange",this._onVrDisplayPresentChangeBind),e.onDisposeObservable.add((()=>{this.dispose()})),this._webVRCamera.onControllerMeshLoadedObservable.add((e=>this._onDefaultMeshLoaded(e))),this._scene.gamepadManager.onGamepadConnectedObservable.add(this._onNewGamepadConnected),this._scene.gamepadManager.onGamepadDisconnectedObservable.add(this._onNewGamepadDisconnected),this._updateButtonVisibility(),this._circleEase=new Y,this._circleEase.setEasingMode(j.EASINGMODE_EASEINOUT),this._teleportationEasing=this._circleEase,e.onPointerObservable.add((t=>{this._interactionsEnabled&&e.activeCamera===this.vrDeviceOrientationCamera&&"mouse"===t.event.pointerType&&(t.type===Re.kD.POINTERDOWN?this._cameraGazer._selectionPointerDown():t.type===Re.kD.POINTERUP&&this._cameraGazer._selectionPointerUp())})),this.webVROptions.floorMeshes&&this.enableTeleportation({floorMeshes:this.webVROptions.floorMeshes}))}_onDefaultMeshLoaded(e){this._leftController&&this._leftController.webVRController==e&&e.mesh&&this._leftController._setLaserPointerParent(e.mesh),this._rightController&&this._rightController.webVRController==e&&e.mesh&&this._rightController._setLaserPointerParent(e.mesh);try{this.onControllerMeshLoadedObservable.notifyObservers(e)}catch(e){_.Y.Warn("Error in your custom logic onControllerMeshLoaded: "+e)}}get isInVRMode(){return this.xr&&this.webVROptions.useXR&&this.xr.baseExperience.state===Xi.IN_XR||this._webVRpresenting||this._fullscreenVRpresenting}_onVrDisplayPresentChange(){const e=this._scene.getEngine().getVRDevice();if(e){const t=this._webVRpresenting;this._webVRpresenting=e.isPresenting,t&&!this._webVRpresenting&&this.exitVR()}else _.Y.Warn("Detected VRDisplayPresentChange on an unknown VRDisplay. Did you can enterVR on the vrExperienceHelper?");this._updateButtonVisibility()}_onVRDisplayChanged(e){this._webVRsupported=e.vrSupported,this._webVRready=!!e.vrDisplay,this._webVRpresenting=e.vrDisplay&&e.vrDisplay.isPresenting,this._updateButtonVisibility()}_moveButtonToBottomRight(){if(this._inputElement&&!this._useCustomVRButton&&this._btnVR){const e=this._inputElement.getBoundingClientRect();this._btnVR.style.top=e.top+e.height-70+"px",this._btnVR.style.left=e.left+e.width-100+"px"}}_displayVRButton(){this._useCustomVRButton||this._btnVRDisplayed||!this._btnVR||(document.body.appendChild(this._btnVR),this._btnVRDisplayed=!0)}_updateButtonVisibility(){this._btnVR&&!this._useCustomVRButton&&(this._btnVR.className="babylonVRicon",this.isInVRMode?this._btnVR.className+=" vrdisplaypresenting":(this._webVRready&&(this._btnVR.className+=" vrdisplayready"),this._webVRsupported&&(this._btnVR.className+=" vrdisplaysupported"),this._webVRrequesting&&(this._btnVR.className+=" vrdisplayrequesting")))}enterVR(){if(this.xr)this.xr.baseExperience.enterXRAsync("immersive-vr","local-floor",this.xr.renderTarget);else{if(this.onEnteringVRObservable)try{this.onEnteringVRObservable.notifyObservers(this)}catch(e){_.Y.Warn("Error in your custom logic onEnteringVR: "+e)}if(this._scene.activeCamera){if(this._position=this._scene.activeCamera.position.clone(),this.vrDeviceOrientationCamera&&(this.vrDeviceOrientationCamera.rotation=o._f.FromRotationMatrix(this._scene.activeCamera.getWorldMatrix().getRotationMatrix()).toEulerAngles(),this.vrDeviceOrientationCamera.angularSensibility=2e3),this.webVRCamera){const e=this.webVRCamera.deviceRotationQuaternion.toEulerAngles().y,t=o._f.FromRotationMatrix(this._scene.activeCamera.getWorldMatrix().getRotationMatrix()).toEulerAngles().y-e,i=this.webVRCamera.rotationQuaternion.toEulerAngles().y;this.webVRCamera.rotationQuaternion=o._f.FromEulerAngles(0,i+t,0)}this._existingCamera=this._scene.activeCamera,this._existingCamera.angularSensibilityX&&(this._cachedAngularSensibility.angularSensibilityX=this._existingCamera.angularSensibilityX,this._existingCamera.angularSensibilityX=Number.MAX_VALUE),this._existingCamera.angularSensibilityY&&(this._cachedAngularSensibility.angularSensibilityY=this._existingCamera.angularSensibilityY,this._existingCamera.angularSensibilityY=Number.MAX_VALUE),this._existingCamera.angularSensibility&&(this._cachedAngularSensibility.angularSensibility=this._existingCamera.angularSensibility,this._existingCamera.angularSensibility=Number.MAX_VALUE)}this._webVRrequesting||(this._webVRready?this._webVRpresenting||(this._scene.getEngine().onVRRequestPresentComplete.addOnce((e=>{this.onAfterEnteringVRObservable.notifyObservers({success:e})})),this._webVRCamera.position=this._position,this._scene.activeCamera=this._webVRCamera):this._vrDeviceOrientationCamera&&(this._vrDeviceOrientationCamera.position=this._position,this._scene.activeCamera&&(this._vrDeviceOrientationCamera.minZ=this._scene.activeCamera.minZ),this._scene.activeCamera=this._vrDeviceOrientationCamera,this._scene.getEngine().enterFullscreen(this.requestPointerLockOnFullScreen),this._updateButtonVisibility(),this._vrDeviceOrientationCamera.onViewMatrixChangedObservable.addOnce((()=>{this.onAfterEnteringVRObservable.notifyObservers({success:!0})}))),this._scene.activeCamera&&this._inputElement&&this._scene.activeCamera.attachControl(),this._interactionsEnabled&&this._scene.registerBeforeRender(this._beforeRender),this._displayLaserPointer&&[this._leftController,this._rightController].forEach((e=>{e&&e._activatePointer()})),this._hasEnteredVR=!0)}}exitVR(){if(this.xr)this.xr.baseExperience.exitXRAsync();else if(this._hasEnteredVR){if(this.onExitingVRObservable)try{this.onExitingVRObservable.notifyObservers(this)}catch(e){_.Y.Warn("Error in your custom logic onExitingVR: "+e)}this._webVRpresenting&&this._scene.getEngine().disableVR(),this._scene.activeCamera&&(this._position=this._scene.activeCamera.position.clone()),this.vrDeviceOrientationCamera&&(this.vrDeviceOrientationCamera.angularSensibility=Number.MAX_VALUE),this._deviceOrientationCamera?(this._deviceOrientationCamera.position=this._position,this._scene.activeCamera=this._deviceOrientationCamera,this._cachedAngularSensibility.angularSensibilityX&&(this._deviceOrientationCamera.angularSensibilityX=this._cachedAngularSensibility.angularSensibilityX,this._cachedAngularSensibility.angularSensibilityX=null),this._cachedAngularSensibility.angularSensibilityY&&(this._deviceOrientationCamera.angularSensibilityY=this._cachedAngularSensibility.angularSensibilityY,this._cachedAngularSensibility.angularSensibilityY=null),this._cachedAngularSensibility.angularSensibility&&(this._deviceOrientationCamera.angularSensibility=this._cachedAngularSensibility.angularSensibility,this._cachedAngularSensibility.angularSensibility=null)):this._existingCamera&&(this._existingCamera.position=this._position,this._scene.activeCamera=this._existingCamera,this._inputElement&&this._scene.activeCamera.attachControl(),this._cachedAngularSensibility.angularSensibilityX&&(this._existingCamera.angularSensibilityX=this._cachedAngularSensibility.angularSensibilityX,this._cachedAngularSensibility.angularSensibilityX=null),this._cachedAngularSensibility.angularSensibilityY&&(this._existingCamera.angularSensibilityY=this._cachedAngularSensibility.angularSensibilityY,this._cachedAngularSensibility.angularSensibilityY=null),this._cachedAngularSensibility.angularSensibility&&(this._existingCamera.angularSensibility=this._cachedAngularSensibility.angularSensibility,this._cachedAngularSensibility.angularSensibility=null)),this._updateButtonVisibility(),this._interactionsEnabled&&(this._scene.unregisterBeforeRender(this._beforeRender),this._cameraGazer._gazeTracker.isVisible=!1,this._leftController&&(this._leftController._gazeTracker.isVisible=!1),this._rightController&&(this._rightController._gazeTracker.isVisible=!1)),this._scene.getEngine().resize(),[this._leftController,this._rightController].forEach((e=>{e&&e._deactivatePointer()})),this._hasEnteredVR=!1;const e=this._scene.getEngine();e._onVrDisplayPresentChange&&e._onVrDisplayPresentChange()}}get position(){return this._position}set position(e){this._position=e,this._scene.activeCamera&&(this._scene.activeCamera.position=e)}enableInteractions(){if(!this._interactionsEnabled){if(this._interactionsRequested=!0,this.xr)return void(this.xr.baseExperience.state===Xi.IN_XR&&this.xr.pointerSelection.attach());this._leftController&&this._enableInteractionOnController(this._leftController),this._rightController&&this._enableInteractionOnController(this._rightController),this.raySelectionPredicate=e=>e.isVisible&&(e.isPickable||e.name===this._floorMeshName),this.meshSelectionPredicate=()=>!0,this._raySelectionPredicate=e=>!!(this._isTeleportationFloor(e)||-1===e.name.indexOf("gazeTracker")&&-1===e.name.indexOf("teleportationTarget")&&-1===e.name.indexOf("torusTeleportation"))&&this.raySelectionPredicate(e),this._interactionsEnabled=!0}}get _noControllerIsActive(){return!(this._leftController&&this._leftController._activePointer||this._rightController&&this._rightController._activePointer)}_isTeleportationFloor(e){for(let t=0;t<this._floorMeshesCollection.length;t++)if(this._floorMeshesCollection[t].id===e.id)return!0;return!(!this._floorMeshName||e.name!==this._floorMeshName)}addFloorMesh(e){this._floorMeshesCollection&&(this._floorMeshesCollection.indexOf(e)>-1||this._floorMeshesCollection.push(e))}removeFloorMesh(e){if(!this._floorMeshesCollection)return;const t=this._floorMeshesCollection.indexOf(e);-1!==t&&this._floorMeshesCollection.splice(t,1)}enableTeleportation(e={}){if(!this._teleportationInitialized){if(this._teleportationRequested=!0,this.enableInteractions(),this.webVROptions.useXR&&(e.floorMeshes||e.floorMeshName)){const t=e.floorMeshes||[];if(!t.length){const i=this._scene.getMeshByName(e.floorMeshName);i&&t.push(i)}if(this.xr)return t.forEach((e=>{this.xr.teleportation.addFloorMesh(e)})),void(this.xr.teleportation.attached||this.xr.teleportation.attach());if(!this.xrTestDone){const t=()=>{this.xrTestDone&&(this._scene.unregisterBeforeRender(t),this.xr?this.xr.teleportation.attached||this.xr.teleportation.attach():this.enableTeleportation(e))};return void this._scene.registerBeforeRender(t)}}e.floorMeshName&&(this._floorMeshName=e.floorMeshName),e.floorMeshes&&(this._floorMeshesCollection=e.floorMeshes),e.teleportationMode&&(this._teleportationMode=e.teleportationMode),e.teleportationTime&&e.teleportationTime>0&&(this._teleportationTime=e.teleportationTime),e.teleportationSpeed&&e.teleportationSpeed>0&&(this._teleportationSpeed=e.teleportationSpeed),void 0!==e.easingFunction&&(this._teleportationEasing=e.easingFunction),null!=this._leftController&&this._enableTeleportationOnController(this._leftController),null!=this._rightController&&this._enableTeleportationOnController(this._rightController);const t=new ki.$;t.vignetteColor=new a.HE(0,0,0,0),t.vignetteEnabled=!0,this._postProcessMove=new Wi("postProcessMove",1,this._webVRCamera,void 0,void 0,void 0,void 0,t),this._webVRCamera.detachPostProcess(this._postProcessMove),this._teleportationInitialized=!0,this._isDefaultTeleportationTarget&&(this._createTeleportationCircles(),this._teleportationTarget.scaling.scaleInPlace(this._webVRCamera.deviceScaleFactor))}}_enableInteractionOnController(e){e.webVRController.mesh&&(e._interactionsEnabled=!0,this.isInVRMode&&this._displayLaserPointer&&e._activatePointer(),this.webVROptions.laserToggle&&e.webVRController.onMainButtonStateChangedObservable.add((t=>{this._displayLaserPointer&&1===t.value&&(e._activePointer?e._deactivatePointer():e._activatePointer(),this.displayGaze&&(e._gazeTracker.isVisible=e._activePointer))})),e.webVRController.onTriggerStateChangedObservable.add((t=>{let i=e;this._noControllerIsActive&&(i=this._cameraGazer),i._pointerDownOnMeshAsked?t.value<this._padSensibilityDown&&i._selectionPointerUp():t.value>this._padSensibilityUp&&i._selectionPointerDown()})))}_checkTeleportWithRay(e,t){this._teleportationRequestInitiated&&!t._teleportationRequestInitiated||(t._teleportationRequestInitiated?Math.sqrt(e.y*e.y+e.x*e.x)<this._padSensibilityDown&&(this._teleportActive&&this.teleportCamera(this._haloCenter),t._teleportationRequestInitiated=!1):e.y<-this._padSensibilityUp&&t._dpadPressed&&(t._activatePointer(),t._teleportationRequestInitiated=!0))}_checkRotate(e,t){t._teleportationRequestInitiated||(t._rotationLeftAsked?e.x>-this._padSensibilityDown&&(t._rotationLeftAsked=!1):e.x<-this._padSensibilityUp&&t._dpadPressed&&(t._rotationLeftAsked=!0,this._rotationAllowed&&this._rotateCamera(!1)),t._rotationRightAsked?e.x<this._padSensibilityDown&&(t._rotationRightAsked=!1):e.x>this._padSensibilityUp&&t._dpadPressed&&(t._rotationRightAsked=!0,this._rotationAllowed&&this._rotateCamera(!0)))}_checkTeleportBackwards(e,t){if(!t._teleportationRequestInitiated)if(e.y>this._padSensibilityUp&&t._dpadPressed){if(!t._teleportationBackRequestInitiated){if(!this.currentVRCamera)return;let e=o._f.FromRotationMatrix(this.currentVRCamera.getWorldMatrix().getRotationMatrix()),i=this.currentVRCamera.position;this.currentVRCamera.devicePosition&&this.currentVRCamera.deviceRotationQuaternion&&(e=this.currentVRCamera.deviceRotationQuaternion,i=this.currentVRCamera.devicePosition),e.toEulerAnglesToRef(this._workingVector),this._workingVector.z=0,this._workingVector.x=0,o._f.RotationYawPitchRollToRef(this._workingVector.y,this._workingVector.x,this._workingVector.z,this._workingQuaternion),this._workingQuaternion.toRotationMatrix(this._workingMatrix),o.P.TransformCoordinatesToRef(this._teleportBackwardsVector,this._workingMatrix,this._workingVector);const n=new Yt.z(i,this._workingVector),s=this._scene.pickWithRay(n,this._raySelectionPredicate);s&&s.pickedPoint&&s.pickedMesh&&this._isTeleportationFloor(s.pickedMesh)&&s.distance<5&&this.teleportCamera(s.pickedPoint),t._teleportationBackRequestInitiated=!0}}else t._teleportationBackRequestInitiated=!1}_enableTeleportationOnController(e){e.webVRController.mesh&&(e._interactionsEnabled||this._enableInteractionOnController(e),e._interactionsEnabled=!0,e._teleportationEnabled=!0,e.webVRController.controllerType===zt.VIVE&&(e._dpadPressed=!1,e.webVRController.onPadStateChangedObservable.add((t=>{e._dpadPressed=t.pressed,e._dpadPressed||(e._rotationLeftAsked=!1,e._rotationRightAsked=!1,e._teleportationBackRequestInitiated=!1)}))),e.webVRController.onPadValuesChangedObservable.add((t=>{this.teleportationEnabled&&(this._checkTeleportBackwards(t,e),this._checkTeleportWithRay(t,e)),this._checkRotate(t,e)})))}_createTeleportationCircles(){this._teleportationTarget=(0,dn.$6)("teleportationTarget",{width:2,height:2,subdivisions:2},this._scene),this._teleportationTarget.isPickable=!1;const e=new zi.c("DynamicTexture",512,this._scene,!0);e.hasAlpha=!0;const t=e.getContext();t.beginPath(),t.arc(256,256,200,0,2*Math.PI,!1),t.fillStyle=this._teleportationFillColor,t.fill(),t.lineWidth=10,t.strokeStyle=this._teleportationBorderColor,t.stroke(),t.closePath(),e.update();const i=new Gi.K("TextPlaneMaterial",this._scene);i.diffuseTexture=e,this._teleportationTarget.material=i;const n=cn("torusTeleportation",{diameter:.75,thickness:.1,tessellation:25,updatable:!1},this._scene);n.isPickable=!1,n.parent=this._teleportationTarget;const s=new D.f("animationInnerCircle","position.y",30,D.f.ANIMATIONTYPE_FLOAT,D.f.ANIMATIONLOOPMODE_CYCLE),r=[];r.push({frame:0,value:0}),r.push({frame:30,value:.4}),r.push({frame:60,value:0}),s.setKeys(r);const o=new ne;o.setEasingMode(j.EASINGMODE_EASEINOUT),s.setEasingFunction(o),n.animations=[],n.animations.push(s),this._scene.beginAnimation(n,0,60,!0),this._hideTeleportationTarget()}_displayTeleportationTarget(){this._teleportActive=!0,this._teleportationInitialized&&(this._teleportationTarget.isVisible=!0,this._isDefaultTeleportationTarget&&(this._teleportationTarget.getChildren()[0].isVisible=!0))}_hideTeleportationTarget(){this._teleportActive=!1,this._teleportationInitialized&&(this._teleportationTarget.isVisible=!1,this._isDefaultTeleportationTarget&&(this._teleportationTarget.getChildren()[0].isVisible=!1))}_rotateCamera(e){if(!(this.currentVRCamera instanceof Dt.c))return;e?this._rotationAngle++:this._rotationAngle--,this.currentVRCamera.animations=[];const t=o._f.FromRotationMatrix(o.y3.RotationY(Math.PI/4*this._rotationAngle)),i=new D.f("animationRotation","rotationQuaternion",90,D.f.ANIMATIONTYPE_QUATERNION,D.f.ANIMATIONLOOPMODE_CONSTANT),n=[];n.push({frame:0,value:this.currentVRCamera.rotationQuaternion}),n.push({frame:6,value:t}),i.setKeys(n),i.setEasingFunction(this._circleEase),this.currentVRCamera.animations.push(i),this._postProcessMove.animations=[];const s=new D.f("animationPP","vignetteWeight",90,D.f.ANIMATIONTYPE_FLOAT,D.f.ANIMATIONLOOPMODE_CONSTANT),r=[];r.push({frame:0,value:0}),r.push({frame:3,value:4}),r.push({frame:6,value:0}),s.setKeys(r),s.setEasingFunction(this._circleEase),this._postProcessMove.animations.push(s);const a=new D.f("animationPP2","vignetteStretch",90,D.f.ANIMATIONTYPE_FLOAT,D.f.ANIMATIONLOOPMODE_CONSTANT),l=[];l.push({frame:0,value:0}),l.push({frame:3,value:10}),l.push({frame:6,value:0}),a.setKeys(l),a.setEasingFunction(this._circleEase),this._postProcessMove.animations.push(a),this._postProcessMove.imageProcessingConfiguration.vignetteWeight=0,this._postProcessMove.imageProcessingConfiguration.vignetteStretch=0,this._postProcessMove.samples=4,this._webVRCamera.attachPostProcess(this._postProcessMove),this._scene.beginAnimation(this._postProcessMove,0,6,!1,1,(()=>{this._webVRCamera.detachPostProcess(this._postProcessMove)})),this._scene.beginAnimation(this.currentVRCamera,0,6,!1,1)}_moveTeleportationSelectorTo(e,t,i){if(e.pickedPoint){t._teleportationRequestInitiated&&(this._displayTeleportationTarget(),this._haloCenter.copyFrom(e.pickedPoint),this._teleportationTarget.position.copyFrom(e.pickedPoint));const n=this._convertNormalToDirectionOfRay(e.getNormal(!0,!1),i);if(n){const e=o.P.Cross(We.RD.Y,n),t=o.P.Cross(n,e);o.P.RotationFromAxisToRef(t,n,e,this._teleportationTarget.rotation)}this._teleportationTarget.position.y+=.1}}teleportCamera(e){if(!(this.currentVRCamera instanceof Dt.c))return;let t,i;if(this.webVRCamera.leftCamera?(this._workingVector.copyFrom(this.webVRCamera.leftCamera.globalPosition),this._workingVector.subtractInPlace(this.webVRCamera.position),e.subtractToRef(this._workingVector,this._workingVector)):this._workingVector.copyFrom(e),this.isInVRMode?this._workingVector.y+=this.webVRCamera.deviceDistanceToRoomGround()*this._webVRCamera.deviceScaleFactor:this._workingVector.y+=this._defaultHeight,this.onBeforeCameraTeleport.notifyObservers(this._workingVector),this._teleportationMode==gn.TELEPORTATIONMODE_CONSTANTSPEED){i=90;const e=o.P.Distance(this.currentVRCamera.position,this._workingVector);t=this._teleportationSpeed/e}else i=Math.round(90*this._teleportationTime/1e3),t=1;this.currentVRCamera.animations=[];const n=new D.f("animationCameraTeleportation","position",90,D.f.ANIMATIONTYPE_VECTOR3,D.f.ANIMATIONLOOPMODE_CONSTANT),s=[{frame:0,value:this.currentVRCamera.position},{frame:i,value:this._workingVector}];n.setKeys(s),n.setEasingFunction(this._teleportationEasing),this.currentVRCamera.animations.push(n),this._postProcessMove.animations=[];const r=Math.round(i/2),a=new D.f("animationPP","vignetteWeight",90,D.f.ANIMATIONTYPE_FLOAT,D.f.ANIMATIONLOOPMODE_CONSTANT),l=[];l.push({frame:0,value:0}),l.push({frame:r,value:8}),l.push({frame:i,value:0}),a.setKeys(l),this._postProcessMove.animations.push(a);const h=new D.f("animationPP2","vignetteStretch",90,D.f.ANIMATIONTYPE_FLOAT,D.f.ANIMATIONLOOPMODE_CONSTANT),c=[];c.push({frame:0,value:0}),c.push({frame:r,value:10}),c.push({frame:i,value:0}),h.setKeys(c),this._postProcessMove.animations.push(h),this._postProcessMove.imageProcessingConfiguration.vignetteWeight=0,this._postProcessMove.imageProcessingConfiguration.vignetteStretch=0,this._webVRCamera.attachPostProcess(this._postProcessMove),this._scene.beginAnimation(this._postProcessMove,0,i,!1,t,(()=>{this._webVRCamera.detachPostProcess(this._postProcessMove)})),this._scene.beginAnimation(this.currentVRCamera,0,i,!1,t,(()=>{this.onAfterCameraTeleport.notifyObservers(this._workingVector)})),this._hideTeleportationTarget()}_convertNormalToDirectionOfRay(e,t){return e&&Math.acos(o.P.Dot(e,t.direction))<Math.PI/2&&e.scaleInPlace(-1),e}_castRayAndSelectObject(e){if(!(this.currentVRCamera instanceof Dt.c))return;const t=e._getForwardRay(this._rayLength),i=this._scene.pickWithRay(t,this._raySelectionPredicate);if(i&&this._scene.simulatePointerMove(i,{pointerId:e._id}),e._currentHit=i,i&&i.pickedPoint){if(this._displayGaze){let n=1;e._gazeTracker.isVisible=!0,e._isActionableMesh&&(n=3),this.updateGazeTrackerScale&&(e._gazeTracker.scaling.x=i.distance*n,e._gazeTracker.scaling.y=i.distance*n,e._gazeTracker.scaling.z=i.distance*n);const s=this._convertNormalToDirectionOfRay(i.getNormal(),t),r=.002;if(s){const t=o.P.Cross(We.RD.Y,s),i=o.P.Cross(s,t);o.P.RotationFromAxisToRef(i,s,t,e._gazeTracker.rotation)}e._gazeTracker.position.copyFrom(i.pickedPoint),e._gazeTracker.position.x<0?e._gazeTracker.position.x+=r:e._gazeTracker.position.x-=r,e._gazeTracker.position.y<0?e._gazeTracker.position.y+=r:e._gazeTracker.position.y-=r,e._gazeTracker.position.z<0?e._gazeTracker.position.z+=r:e._gazeTracker.position.z-=r}e._updatePointerDistance(i.distance)}else e._updatePointerDistance(),e._gazeTracker.isVisible=!1;if(i&&i.pickedMesh){if(this._teleportationInitialized&&this._isTeleportationFloor(i.pickedMesh)&&i.pickedPoint)return e._currentMeshSelected&&!this._isTeleportationFloor(e._currentMeshSelected)&&this._notifySelectedMeshUnselected(e._currentMeshSelected),e._currentMeshSelected=null,void(e._teleportationRequestInitiated&&this._moveTeleportationSelectorTo(i,e,t));if(i.pickedMesh!==e._currentMeshSelected)if(this.meshSelectionPredicate(i.pickedMesh)){this.onNewMeshPicked.notifyObservers(i),e._currentMeshSelected=i.pickedMesh,i.pickedMesh.isPickable&&i.pickedMesh.actionManager?(this.changeGazeColor(this._pickedGazeColor),this.changeLaserColor(this._pickedLaserColor),e._isActionableMesh=!0):(this.changeGazeColor(this._gazeColor),this.changeLaserColor(this._laserColor),e._isActionableMesh=!1);try{this.onNewMeshSelected.notifyObservers(i.pickedMesh);const t=e;t.webVRController&&this.onMeshSelectedWithController.notifyObservers({mesh:i.pickedMesh,controller:t.webVRController})}catch(e){_.Y.Warn("Error while raising onNewMeshSelected or onMeshSelectedWithController: "+e)}}else this._notifySelectedMeshUnselected(e._currentMeshSelected),e._currentMeshSelected=null,this.changeGazeColor(this._gazeColor),this.changeLaserColor(this._laserColor)}else this._notifySelectedMeshUnselected(e._currentMeshSelected),e._currentMeshSelected=null,this.changeGazeColor(this._gazeColor),this.changeLaserColor(this._laserColor)}_notifySelectedMeshUnselected(e){e&&this.onSelectedMeshUnselected.notifyObservers(e)}setLaserColor(e,t=this._pickedLaserColor){this._laserColor=e,this._pickedLaserColor=t}setLaserLightingState(e=!0){this._leftController&&this._leftController._setLaserPointerLightingDisabled(!e),this._rightController&&this._rightController._setLaserPointerLightingDisabled(!e)}setGazeColor(e,t=this._pickedGazeColor){this._gazeColor=e,this._pickedGazeColor=t}changeLaserColor(e){this.updateControllerLaserColor&&(this._leftController&&this._leftController._setLaserPointerColor(e),this._rightController&&this._rightController._setLaserPointerColor(e))}changeGazeColor(e){this.updateGazeTrackerColor&&this._cameraGazer._gazeTracker.material&&(this._cameraGazer._gazeTracker.material.emissiveColor=e,this._leftController&&(this._leftController._gazeTracker.material.emissiveColor=e),this._rightController&&(this._rightController._gazeTracker.material.emissiveColor=e))}dispose(){this.isInVRMode&&this.exitVR(),this._postProcessMove&&this._postProcessMove.dispose(),this._webVRCamera&&this._webVRCamera.dispose(),this._vrDeviceOrientationCamera&&this._vrDeviceOrientationCamera.dispose(),!this._useCustomVRButton&&this._btnVR&&this._btnVR.parentNode&&document.body.removeChild(this._btnVR),this._deviceOrientationCamera&&this._scene.activeCamera!=this._deviceOrientationCamera&&this._deviceOrientationCamera.dispose(),this._cameraGazer&&this._cameraGazer.dispose(),this._leftController&&this._leftController.dispose(),this._rightController&&this._rightController.dispose(),this._teleportationTarget&&this._teleportationTarget.dispose(),this.xr&&this.xr.dispose(),this._floorMeshesCollection.length=0,document.removeEventListener("keydown",this._onKeyDown),window.removeEventListener("vrdisplaypresentchange",this._onVrDisplayPresentChangeBind),window.removeEventListener("resize",this._onResize),document.removeEventListener("fullscreenchange",this._onFullscreenChange),this._scene.getEngine().onVRDisplayChangedObservable.removeCallback(this._onVRDisplayChangedBind),this._scene.getEngine().onVRRequestPresentStart.removeCallback(this._onVRRequestPresentStart),this._scene.getEngine().onVRRequestPresentComplete.removeCallback(this._onVRRequestPresentComplete),this._scene.gamepadManager.onGamepadConnectedObservable.removeCallback(this._onNewGamepadConnected),this._scene.gamepadManager.onGamepadDisconnectedObservable.removeCallback(this._onNewGamepadDisconnected),this._scene.unregisterBeforeRender(this._beforeRender)}getClassName(){return"VRExperienceHelper"}}gn.TELEPORTATIONMODE_CONSTANTTIME=0,gn.TELEPORTATIONMODE_CONSTANTSPEED=1;const vn=function(){const e={root:0,found:!1};return function(t,i,n,s){e.root=0,e.found=!1;const r=i*i-4*t*n;if(r<0)return e;const o=Math.sqrt(r);let a=(-i-o)/(2*t),l=(-i+o)/(2*t);if(a>l){const e=l;l=a,a=e}return a>0&&a<s?(e.root=a,e.found=!0,e):l>0&&l<s?(e.root=l,e.found=!0,e):e}}();class yn{constructor(){this._collisionPoint=o.P.Zero(),this._planeIntersectionPoint=o.P.Zero(),this._tempVector=o.P.Zero(),this._tempVector2=o.P.Zero(),this._tempVector3=o.P.Zero(),this._tempVector4=o.P.Zero(),this._edge=o.P.Zero(),this._baseToVertex=o.P.Zero(),this._destinationPoint=o.P.Zero(),this._slidePlaneNormal=o.P.Zero(),this._displacementVector=o.P.Zero(),this._radius=o.P.One(),this._retry=0,this._basePointWorld=o.P.Zero(),this._velocityWorld=o.P.Zero(),this._normalizedVelocity=o.P.Zero(),this._collisionMask=-1}get collisionMask(){return this._collisionMask}set collisionMask(e){this._collisionMask=isNaN(e)?-1:e}get slidePlaneNormal(){return this._slidePlaneNormal}_initialize(e,t,i){this._velocity=t,this._velocitySquaredLength=this._velocity.lengthSquared();const n=Math.sqrt(this._velocitySquaredLength);0===n||1===n?this._normalizedVelocity.copyFromFloats(t._x,t._y,t._z):t.scaleToRef(1/n,this._normalizedVelocity),this._basePoint=e,e.multiplyToRef(this._radius,this._basePointWorld),t.multiplyToRef(this._radius,this._velocityWorld),this._velocityWorldLength=this._velocityWorld.length(),this._epsilon=i,this.collisionFound=!1}_checkPointInTriangle(e,t,i,n,s){t.subtractToRef(e,this._tempVector),i.subtractToRef(e,this._tempVector2),o.P.CrossToRef(this._tempVector,this._tempVector2,this._tempVector4);let r=o.P.Dot(this._tempVector4,s);return!(r<0)&&(n.subtractToRef(e,this._tempVector3),o.P.CrossToRef(this._tempVector2,this._tempVector3,this._tempVector4),r=o.P.Dot(this._tempVector4,s),!(r<0)&&(o.P.CrossToRef(this._tempVector3,this._tempVector,this._tempVector4),r=o.P.Dot(this._tempVector4,s),r>=0))}_canDoCollision(e,t,i,n){const s=o.P.Distance(this._basePointWorld,e),r=Math.max(this._radius.x,this._radius.y,this._radius.z);return!(s>this._velocityWorldLength+r+t||!((e,t,i,n)=>!(e.x>i.x+n||i.x-n>t.x||e.y>i.y+n||i.y-n>t.y||e.z>i.z+n||i.z-n>t.z))(i,n,this._basePointWorld,this._velocityWorldLength+r))}_testTriangle(e,t,i,n,s,r,a){let l,h=!1;t||(t=[]),t[e]||(t[e]=new ot.J(0,0,0,0),t[e].copyFromPoints(i,n,s));const c=t[e];if(!r&&!c.isFrontFacingTo(this._normalizedVelocity,0))return;const u=c.signedDistanceTo(this._basePoint),d=o.P.Dot(c.normal,this._velocity);if(yn.DoubleSidedCheck&&d>1e-4)return;if(0==d){if(Math.abs(u)>=1)return;h=!0,l=0}else{l=(-1-u)/d;let e=(1-u)/d;if(l>e){const t=e;e=l,l=t}if(l>1||e<0)return;l<0&&(l=0),l>1&&(l=1)}this._collisionPoint.copyFromFloats(0,0,0);let p=!1,f=1;if(h||(this._basePoint.subtractToRef(c.normal,this._planeIntersectionPoint),this._velocity.scaleToRef(l,this._tempVector),this._planeIntersectionPoint.addInPlace(this._tempVector),this._checkPointInTriangle(this._planeIntersectionPoint,i,n,s,c.normal)&&(p=!0,f=l,this._collisionPoint.copyFrom(this._planeIntersectionPoint))),!p){let e=this._velocitySquaredLength;this._basePoint.subtractToRef(i,this._tempVector);let t=2*o.P.Dot(this._velocity,this._tempVector),r=this._tempVector.lengthSquared()-1,a=vn(e,t,r,f);a.found&&(f=a.root,p=!0,this._collisionPoint.copyFrom(i)),this._basePoint.subtractToRef(n,this._tempVector),t=2*o.P.Dot(this._velocity,this._tempVector),r=this._tempVector.lengthSquared()-1,a=vn(e,t,r,f),a.found&&(f=a.root,p=!0,this._collisionPoint.copyFrom(n)),this._basePoint.subtractToRef(s,this._tempVector),t=2*o.P.Dot(this._velocity,this._tempVector),r=this._tempVector.lengthSquared()-1,a=vn(e,t,r,f),a.found&&(f=a.root,p=!0,this._collisionPoint.copyFrom(s)),n.subtractToRef(i,this._edge),i.subtractToRef(this._basePoint,this._baseToVertex);let l=this._edge.lengthSquared(),h=o.P.Dot(this._edge,this._velocity),c=o.P.Dot(this._edge,this._baseToVertex);if(e=l*-this._velocitySquaredLength+h*h,t=2*(l*o.P.Dot(this._velocity,this._baseToVertex)-h*c),r=l*(1-this._baseToVertex.lengthSquared())+c*c,a=vn(e,t,r,f),a.found){const e=(h*a.root-c)/l;e>=0&&e<=1&&(f=a.root,p=!0,this._edge.scaleInPlace(e),i.addToRef(this._edge,this._collisionPoint))}if(s.subtractToRef(n,this._edge),n.subtractToRef(this._basePoint,this._baseToVertex),l=this._edge.lengthSquared(),h=o.P.Dot(this._edge,this._velocity),c=o.P.Dot(this._edge,this._baseToVertex),e=l*-this._velocitySquaredLength+h*h,t=2*(l*o.P.Dot(this._velocity,this._baseToVertex)-h*c),r=l*(1-this._baseToVertex.lengthSquared())+c*c,a=vn(e,t,r,f),a.found){const e=(h*a.root-c)/l;e>=0&&e<=1&&(f=a.root,p=!0,this._edge.scaleInPlace(e),n.addToRef(this._edge,this._collisionPoint))}if(i.subtractToRef(s,this._edge),s.subtractToRef(this._basePoint,this._baseToVertex),l=this._edge.lengthSquared(),h=o.P.Dot(this._edge,this._velocity),c=o.P.Dot(this._edge,this._baseToVertex),e=l*-this._velocitySquaredLength+h*h,t=2*(l*o.P.Dot(this._velocity,this._baseToVertex)-h*c),r=l*(1-this._baseToVertex.lengthSquared())+c*c,a=vn(e,t,r,f),a.found){const e=(h*a.root-c)/l;e>=0&&e<=1&&(f=a.root,p=!0,this._edge.scaleInPlace(e),s.addToRef(this._edge,this._collisionPoint))}}if(p){const e=f*f*this._velocitySquaredLength;(!this.collisionFound||e<this._nearestDistanceSquared)&&(a.collisionResponse&&(this.intersectionPoint?this.intersectionPoint.copyFrom(this._collisionPoint):this.intersectionPoint=this._collisionPoint.clone(),this._nearestDistanceSquared=e,this._nearestDistance=Math.sqrt(e),this.collisionFound=!0),this.collidedMesh=a)}}_collide(e,t,i,n,s,r,o,a,l,h=!1){if(h)if(i&&0!==i.length)for(let r=n;r<s-2;r+=1){const n=i[r],s=i[r+1],h=i[r+2];if(4294967295===h){r+=2;continue}const c=t[n],u=t[s],d=t[h];c&&u&&d&&((l?1:0)^r%2?this._testTriangle(r,e,c,u,d,o,a):this._testTriangle(r,e,u,c,d,o,a))}else for(let i=0;i<t.length-2;i+=1){const n=t[i],s=t[i+1],r=t[i+2];n&&s&&r&&((l?1:0)^i%2?this._testTriangle(i,e,n,s,r,o,a):this._testTriangle(i,e,s,n,r,o,a))}else if(i&&0!==i.length)for(let h=n;h<s;h+=3){const n=t[i[h]-r],s=t[i[h+1]-r],c=t[i[h+2]-r];l?this._testTriangle(h,e,n,s,c,o,a):this._testTriangle(h,e,c,s,n,o,a)}else for(let i=0;i<t.length;i+=3){const n=t[i],s=t[i+1],r=t[i+2];l?this._testTriangle(i,e,n,s,r,o,a):this._testTriangle(i,e,r,s,n,o,a)}}_getResponse(e,t){e.addToRef(t,this._destinationPoint),t.scaleInPlace(this._nearestDistance/t.length()),this._basePoint.addToRef(t,e),e.subtractToRef(this.intersectionPoint,this._slidePlaneNormal),this._slidePlaneNormal.normalize(),this._slidePlaneNormal.scaleToRef(this._epsilon,this._displacementVector),e.addInPlace(this._displacementVector),this.intersectionPoint.addInPlace(this._displacementVector),this._slidePlaneNormal.scaleInPlace(ot.J.SignedDistanceToPlaneFromPositionAndNormal(this.intersectionPoint,this._slidePlaneNormal,this._destinationPoint)),this._destinationPoint.subtractInPlace(this._slidePlaneNormal),this._destinationPoint.subtractToRef(this.intersectionPoint,t)}}yn.DoubleSidedCheck=!1;class xn{constructor(){this._scaledPosition=o.P.Zero(),this._scaledVelocity=o.P.Zero(),this._finalPosition=o.P.Zero()}getNewPosition(e,t,i,n,s,r,o){e.divideToRef(i._radius,this._scaledPosition),t.divideToRef(i._radius,this._scaledVelocity),i.collidedMesh=null,i._retry=0,i._initialVelocity=this._scaledVelocity,i._initialPosition=this._scaledPosition,this._collideWithWorld(this._scaledPosition,this._scaledVelocity,i,n,this._finalPosition,s),this._finalPosition.multiplyInPlace(i._radius),r(o,this._finalPosition,i.collidedMesh)}createCollider(){return new yn}init(e){this._scene=e}_collideWithWorld(e,t,i,n,s,r=null){const o=10*ue.D.CollisionsEpsilon;if(i._retry>=n)return void s.copyFrom(e);const a=r?r.collisionMask:i.collisionMask;i._initialize(e,t,o);const l=r&&r.surroundingMeshes||this._scene.meshes;for(let e=0;e<l.length;e++){const t=l[e];t.isEnabled()&&t.checkCollisions&&t.subMeshes&&t!==r&&0!=(a&t.collisionGroup)&&t._checkCollision(i)}i.collisionFound?(0===t.x&&0===t.y&&0===t.z||i._getResponse(e,t),t.length()<=o?s.copyFrom(e):(i._retry++,this._collideWithWorld(e,t,i,n,s,r))):e.addToRef(t,s)}}k.x.CollisionCoordinatorFactory=()=>new xn;var bn=i(5670),Tn=i(2312),Sn=i(9356),En=i(8198),Cn=i(9131);class An{constructor(e,t,i,n=""){var s,o;let a;this.name=null,this.defines="",this.onCompiled=null,this.onError=null,this.uniqueId=0,this.onCompileObservable=new r.y$,this.onErrorObservable=new r.y$,this.onBindObservable=new r.y$,this._wasPreviouslyReady=!1,this._isReady=!1,this._compilationError="",this._key="",this._computeSourceCodeOverride="",this._pipelineContext=null,this._computeSourceCode="",this._rawComputeSourceCode="",this._shaderLanguage=Cn.x.WGSL,this.name=e,this._key=n,this._engine=i,this.uniqueId=An._UniqueIdSeed++,this.defines=null!==(s=t.defines)&&void 0!==s?s:"",this.onError=t.onError,this.onCompiled=t.onCompiled,this._entryPoint=null!==(o=t.entryPoint)&&void 0!==o?o:"main",this._shaderStore=si.v.GetShadersStore(this._shaderLanguage),this._shaderRepository=si.v.GetShadersRepository(this._shaderLanguage),this._includeShaderStore=si.v.GetIncludesShadersStore(this._shaderLanguage);const l=(0,fe.CG)()?this._engine.getHostDocument():null;e.computeSource?a="source:"+e.computeSource:e.computeElement?(a=l?l.getElementById(e.computeElement):null,a||(a=e.computeElement)):a=e.compute||e;const h={defines:this.defines.split("\n"),indexParameters:void 0,isFragment:!1,shouldUseHighPrecisionShader:!1,processor:null,supportsUniformBuffers:this._engine.supportsUniformBuffers,shadersRepository:this._shaderRepository,includesShadersStore:this._includeShaderStore,version:(100*this._engine.version).toString(),platformName:this._engine.shaderPlatformName,processingContext:null,isNDCHalfZRange:this._engine.isNDCHalfZRange,useReverseDepthBuffer:this._engine.useReverseDepthBuffer};this._loadShader(a,"Compute","",(i=>{En.L.Initialize(h),En.L.PreProcess(i,h,(n=>{this._rawComputeSourceCode=i,t.processFinalCode&&(n=t.processFinalCode(n));const s=En.L.Finalize(n,"",h);this._useFinalCode(s.vertexCode,e)}),this._engine)}))}_useFinalCode(e,t){if(t){const i=t.computeElement||t.compute||t.spectorName||t;this._computeSourceCode="//#define SHADER_NAME compute:"+i+"\n"+e}else this._computeSourceCode=e;this._prepareEffect()}get key(){return this._key}isReady(){try{return this._isReadyInternal()}catch(e){return!1}}_isReadyInternal(){return!!this._isReady||!!this._pipelineContext&&this._pipelineContext.isReady}getEngine(){return this._engine}getPipelineContext(){return this._pipelineContext}getCompilationError(){return this._compilationError}executeWhenCompiled(e){this.isReady()?e(this):(this.onCompileObservable.add((t=>{e(t)})),this._pipelineContext&&!this._pipelineContext.isAsync||setTimeout((()=>{this._checkIsReady(null)}),16))}_checkIsReady(e){try{if(this._isReadyInternal())return}catch(t){return void this._processCompilationErrors(t,e)}setTimeout((()=>{this._checkIsReady(e)}),16)}_loadShader(e,t,i,n){if("undefined"!=typeof HTMLElement&&e instanceof HTMLElement)return void n((0,fe.v)(e));if("source:"===e.substr(0,7))return void n(e.substr(7));if("base64:"===e.substr(0,7))return void n(window.atob(e.substr(7)));if(this._shaderStore[e+t+"Shader"])return void n(this._shaderStore[e+t+"Shader"]);if(i&&this._shaderStore[e+i+"Shader"])return void n(this._shaderStore[e+i+"Shader"]);let s;s="."===e[0]||"/"===e[0]||e.indexOf("http")>-1?e:this._shaderRepository+e,this._engine._loadFile(s+"."+t.toLowerCase()+".fx",n)}get computeSourceCode(){var e,t;return this._computeSourceCodeOverride?this._computeSourceCodeOverride:null!==(t=null===(e=this._pipelineContext)||void 0===e?void 0:e._getComputeShaderCode())&&void 0!==t?t:this._computeSourceCode}get rawComputeSourceCode(){return this._rawComputeSourceCode}_prepareEffect(){const e=this.defines,t=this._pipelineContext;this._isReady=!1;try{const i=this._engine;this._pipelineContext=i.createComputePipelineContext(),this._pipelineContext._name=this._key,i._prepareComputePipelineContext(this._pipelineContext,this._computeSourceCodeOverride?this._computeSourceCodeOverride:this._computeSourceCode,this._rawComputeSourceCode,this._computeSourceCodeOverride?null:e,this._entryPoint),i._executeWhenComputeStateIsCompiled(this._pipelineContext,(()=>{this._compilationError="",this._isReady=!0,this.onCompiled&&this.onCompiled(this),this.onCompileObservable.notifyObservers(this),this.onCompileObservable.clear(),t&&this.getEngine()._deleteComputePipelineContext(t)})),this._pipelineContext.isAsync&&this._checkIsReady(t)}catch(e){this._processCompilationErrors(e,t)}}_getShaderCodeAndErrorLine(e,t){const i=/COMPUTE SHADER ERROR: 0:(\d+?):/;let n=null;if(t&&e){const s=t.match(i);if(s&&2===s.length){const t=parseInt(s[1]),i=e.split("\n",-1);i.length>=t&&(n=`Offending line [${t}] in compute code: ${i[t-1]}`)}}return[e,n]}_processCompilationErrors(e,t=null){var i;if(this._compilationError=e.message,_.Y.Error("Unable to compile compute effect:"),_.Y.Error("Defines:\r\n"+this.defines),An.LogShaderCodeOnCompilationError){let e=null,t=null;(null===(i=this._pipelineContext)||void 0===i?void 0:i._getComputeShaderCode())&&([t,e]=this._getShaderCodeAndErrorLine(this._pipelineContext._getComputeShaderCode(),this._compilationError),t&&(_.Y.Error("Compute code:"),_.Y.Error(t))),e&&_.Y.Error(e)}_.Y.Error("Error: "+this._compilationError),t&&(this._pipelineContext=t,this._isReady=!0,this.onError&&this.onError(this,this._compilationError),this.onErrorObservable.notifyObservers(this))}dispose(){this._pipelineContext&&this._pipelineContext.dispose(),this._engine._releaseComputeEffect(this)}static RegisterShader(e,t){si.v.GetShadersStore(Cn.x.WGSL)[`${e}ComputeShader`]=t}}An._UniqueIdSeed=0,An.LogShaderCodeOnCompilationError=!0;var Pn,Rn=i(3230);!function(e){e[e.Texture=0]="Texture",e[e.StorageTexture=1]="StorageTexture",e[e.UniformBuffer=2]="UniformBuffer",e[e.StorageBuffer=3]="StorageBuffer",e[e.TextureWithoutSampler=4]="TextureWithoutSampler",e[e.Sampler=5]="Sampler"}(Pn||(Pn={})),Rn.B.prototype.createComputeEffect=function(e,t){throw new Error("createComputeEffect: This engine does not support compute shaders!")},Rn.B.prototype.createComputePipelineContext=function(){throw new Error("createComputePipelineContext: This engine does not support compute shaders!")},Rn.B.prototype.createComputeContext=function(){},Rn.B.prototype.computeDispatch=function(e,t,i,n,s,r,o){throw new Error("computeDispatch: This engine does not support compute shaders!")},Rn.B.prototype.areAllComputeEffectsReady=function(){return!0},Rn.B.prototype.releaseComputeEffects=function(){},Rn.B.prototype._prepareComputePipelineContext=function(e,t,i,n,s){},Rn.B.prototype._rebuildComputeEffects=function(){},Rn.B.prototype._executeWhenComputeStateIsCompiled=function(e,t){t()},Rn.B.prototype._releaseComputeEffect=function(e){},Rn.B.prototype._deleteComputePipelineContext=function(e){};var Mn=i(8718),In=i(3297);class Dn{get options(){return this._options}get shaderPath(){return this._shaderPath}constructor(e,t,i,n={}){this._bindings={},this._samplers={},this._contextIsDirty=!1,this.onCompiled=null,this.onError=null,this.name=e,this._engine=t,this.uniqueId=Mn.K.UniqueId,this._engine.getCaps().supportComputeShaders?n.bindingsMapping?(this._context=t.createComputeContext(),this._shaderPath=i,this._options={bindingsMapping:{},defines:[],...n}):_.Y.Error("You must provide the binding mappings as browsers don't support reflection for wgsl shaders yet!"):_.Y.Error("This engine does not support compute shaders!")}getClassName(){return"ComputeShader"}setTexture(e,t,i=!0){const n=this._bindings[e];this._bindings[e]={type:i?Pn.Texture:Pn.TextureWithoutSampler,object:t,indexInGroupEntries:null==n?void 0:n.indexInGroupEntries},this._contextIsDirty||(this._contextIsDirty=!n||n.object!==t||n.type!==this._bindings[e].type)}setStorageTexture(e,t){const i=this._bindings[e];this._contextIsDirty||(this._contextIsDirty=!i||i.object!==t),this._bindings[e]={type:Pn.StorageTexture,object:t,indexInGroupEntries:null==i?void 0:i.indexInGroupEntries}}setUniformBuffer(e,t){const i=this._bindings[e];this._contextIsDirty||(this._contextIsDirty=!i||i.object!==t),this._bindings[e]={type:Pn.UniformBuffer,object:t,indexInGroupEntries:null==i?void 0:i.indexInGroupEntries}}setStorageBuffer(e,t){const i=this._bindings[e];this._contextIsDirty||(this._contextIsDirty=!i||i.object!==t),this._bindings[e]={type:Pn.StorageBuffer,object:t,indexInGroupEntries:null==i?void 0:i.indexInGroupEntries}}setTextureSampler(e,t){const i=this._bindings[e];this._contextIsDirty||(this._contextIsDirty=!i||!t.compareSampler(i.object)),this._bindings[e]={type:Pn.Sampler,object:t,indexInGroupEntries:null==i?void 0:i.indexInGroupEntries}}isReady(){let e=this._effect;for(const e in this._bindings){const t=this._bindings[e],i=t.type,n=t.object;switch(i){case Pn.Texture:case Pn.TextureWithoutSampler:case Pn.StorageTexture:if(!n.isReady())return!1}}const t=[],i=this._shaderPath;if(this._options.defines)for(let e=0;e<this._options.defines.length;e++)t.push(this._options.defines[e]);const n=t.join("\n");return this._cachedDefines!==n&&(this._cachedDefines=n,e=this._engine.createComputeEffect(i,{defines:n,entryPoint:this._options.entryPoint,onCompiled:this.onCompiled,onError:this.onError}),this._effect=e),!!e.isReady()}dispatch(e,t,i){var n;if(!this.isReady())return!1;for(const e in this._bindings){const t=this._bindings[e];if(!this._options.bindingsMapping[e])throw new Error("ComputeShader ('"+this.name+"'): No binding mapping has been provided for the property '"+e+"'");switch(t.type){case Pn.Texture:{const i=this._samplers[e],s=t.object;i&&s._texture&&i.compareSampler(s._texture)||(this._samplers[e]=(new In.a).setParameters(s.wrapU,s.wrapV,s.wrapR,s.anisotropicFilteringLevel,s._texture.samplingMode,null===(n=s._texture)||void 0===n?void 0:n._comparisonFunction),this._contextIsDirty=!0);break}case Pn.UniformBuffer:{const e=t.object;e.getBuffer()!==t.buffer&&(t.buffer=e.getBuffer(),this._contextIsDirty=!0);break}}}return this._contextIsDirty&&(this._contextIsDirty=!1,this._context.clear()),this._engine.computeDispatch(this._effect,this._context,this._bindings,e,t,i,this._options.bindingsMapping),!0}dispatchWhenReady(e,t,i,n=10){return new Promise((s=>{const r=()=>{this.dispatch(e,t,i)?s():setTimeout(r,n)};r()}))}serialize(){const e=Te.p4.Serialize(this);e.options=this._options,e.shaderPath=this._shaderPath,e.bindings={},e.textures={};for(const t in this._bindings){const i=this._bindings[t],n=i.object;switch(i.type){case Pn.Texture:case Pn.TextureWithoutSampler:case Pn.StorageTexture:{const s=n.serialize();s&&(e.textures[t]=s,e.bindings[t]={type:i.type});break}case Pn.UniformBuffer:}}return e}static Parse(e,t,i){const n=Te.p4.Parse((()=>new Dn(e.name,t.getEngine(),e.shaderPath,e.options)),e,t,i);for(const s in e.textures){const r=e.bindings[s],o=Ce.x.Parse(e.textures[s],t,i);r.type===Pn.Texture?n.setTexture(s,o):r.type===Pn.TextureWithoutSampler?n.setTexture(s,o,!1):n.setStorageTexture(s,o)}return n}}(0,be.gn)([(0,Te.qC)()],Dn.prototype,"name",void 0),(0,l.H)("BABYLON.ComputeShader",Dn);var On=i(5237),wn=i(3722),Nn=i(6667),Fn=i(5363);class Ln{constructor(e,t,i,n,s,r){this.entries=new Array,this._boundingVectors=new Array,this._capacity=i,this._depth=n,this._maxDepth=s,this._creationFunc=r,this._minPoint=e,this._maxPoint=t,this._boundingVectors.push(e.clone()),this._boundingVectors.push(t.clone()),this._boundingVectors.push(e.clone()),this._boundingVectors[2].x=t.x,this._boundingVectors.push(e.clone()),this._boundingVectors[3].y=t.y,this._boundingVectors.push(e.clone()),this._boundingVectors[4].z=t.z,this._boundingVectors.push(t.clone()),this._boundingVectors[5].z=e.z,this._boundingVectors.push(t.clone()),this._boundingVectors[6].x=e.x,this._boundingVectors.push(t.clone()),this._boundingVectors[7].y=e.y}get capacity(){return this._capacity}get minPoint(){return this._minPoint}get maxPoint(){return this._maxPoint}addEntry(e){if(this.blocks)for(let t=0;t<this.blocks.length;t++)this.blocks[t].addEntry(e);else this._creationFunc(e,this),this.entries.length>this.capacity&&this._depth<this._maxDepth&&this.createInnerBlocks()}removeEntry(e){if(this.blocks){for(let t=0;t<this.blocks.length;t++)this.blocks[t].removeEntry(e);return}const t=this.entries.indexOf(e);t>-1&&this.entries.splice(t,1)}addEntries(e){for(let t=0;t<e.length;t++){const i=e[t];this.addEntry(i)}}select(e,t,i){if(On.k.IsInFrustum(this._boundingVectors,e)){if(this.blocks){for(let n=0;n<this.blocks.length;n++)this.blocks[n].select(e,t,i);return}i?t.concat(this.entries):t.concatWithNoDuplicate(this.entries)}}intersects(e,t,i,n){if(On.k.IntersectsSphere(this._minPoint,this._maxPoint,e,t)){if(this.blocks){for(let s=0;s<this.blocks.length;s++)this.blocks[s].intersects(e,t,i,n);return}n?i.concat(this.entries):i.concatWithNoDuplicate(this.entries)}}intersectsRay(e,t){if(e.intersectsBoxMinMax(this._minPoint,this._maxPoint)){if(this.blocks){for(let i=0;i<this.blocks.length;i++)this.blocks[i].intersectsRay(e,t);return}t.concatWithNoDuplicate(this.entries)}}createInnerBlocks(){Ln._CreateBlocks(this._minPoint,this._maxPoint,this.entries,this._capacity,this._depth,this._maxDepth,this,this._creationFunc),this.entries.splice(0)}static _CreateBlocks(e,t,i,n,s,r,a,l){a.blocks=new Array;const h=new o.P((t.x-e.x)/2,(t.y-e.y)/2,(t.z-e.z)/2);for(let t=0;t<2;t++)for(let o=0;o<2;o++)for(let c=0;c<2;c++){const u=e.add(h.multiplyByFloats(t,o,c)),d=e.add(h.multiplyByFloats(t+1,o+1,c+1)),p=new Ln(u,d,n,s+1,r,l);p.addEntries(i),a.blocks.push(p)}}}class Bn{constructor(e,t,i=2){this.maxDepth=i,this.dynamicContent=new Array,this._maxBlockCapacity=t||64,this._selectionContent=new Fn.f(1024),this._creationFunc=e}update(e,t,i){Ln._CreateBlocks(e,t,i,this._maxBlockCapacity,0,this.maxDepth,this,this._creationFunc)}addMesh(e){for(let t=0;t<this.blocks.length;t++)this.blocks[t].addEntry(e)}removeMesh(e){for(let t=0;t<this.blocks.length;t++)this.blocks[t].removeEntry(e)}select(e,t){this._selectionContent.reset();for(let i=0;i<this.blocks.length;i++)this.blocks[i].select(e,this._selectionContent,t);return t?this._selectionContent.concat(this.dynamicContent):this._selectionContent.concatWithNoDuplicate(this.dynamicContent),this._selectionContent}intersects(e,t,i){this._selectionContent.reset();for(let n=0;n<this.blocks.length;n++)this.blocks[n].intersects(e,t,this._selectionContent,i);return i?this._selectionContent.concat(this.dynamicContent):this._selectionContent.concatWithNoDuplicate(this.dynamicContent),this._selectionContent}intersectsRay(e){this._selectionContent.reset();for(let t=0;t<this.blocks.length;t++)this.blocks[t].intersectsRay(e,this._selectionContent);return this._selectionContent.concatWithNoDuplicate(this.dynamicContent),this._selectionContent}}Bn.CreationFuncForMeshes=(e,t)=>{const i=e.getBoundingInfo();!e.isBlocked&&i.boundingBox.intersectsMinMax(t.minPoint,t.maxPoint)&&t.entries.push(e)},Bn.CreationFuncForSubMeshes=(e,t)=>{e.getBoundingInfo().boundingBox.intersectsMinMax(t.minPoint,t.maxPoint)&&t.entries.push(e)};var Un=i(1795);k.x.prototype.createOrUpdateSelectionOctree=function(e=64,t=2){let i=this._getComponent(ve.l.NAME_OCTREE);i||(i=new Vn(this),this._addComponent(i)),this._selectionOctree||(this._selectionOctree=new Bn(Bn.CreationFuncForMeshes,e,t));const n=this.getWorldExtends();return this._selectionOctree.update(n.min,n.max,this.meshes),this._selectionOctree},Object.defineProperty(k.x.prototype,"selectionOctree",{get:function(){return this._selectionOctree},enumerable:!0,configurable:!0}),Un.x.prototype.createOrUpdateSubmeshesOctree=function(e=64,t=2){const i=this.getScene();let n=i._getComponent(ve.l.NAME_OCTREE);n||(n=new Vn(i),i._addComponent(n)),this._submeshesOctree||(this._submeshesOctree=new Bn(Bn.CreationFuncForSubMeshes,e,t)),this.computeWorldMatrix(!0);const s=this.getBoundingInfo().boundingBox;return this._submeshesOctree.update(s.minimumWorld,s.maximumWorld,this.subMeshes),this._submeshesOctree};class Vn{constructor(e){this.name=ve.l.NAME_OCTREE,this.checksIsEnabled=!0,this._tempRay=new Yt.z(o.P.Zero(),new o.P(1,1,1)),(e=e||A.l.LastCreatedScene)&&(this.scene=e,this.scene.getActiveMeshCandidates=this.getActiveMeshCandidates.bind(this),this.scene.getActiveSubMeshCandidates=this.getActiveSubMeshCandidates.bind(this),this.scene.getCollidingSubMeshCandidates=this.getCollidingSubMeshCandidates.bind(this),this.scene.getIntersectingSubMeshCandidates=this.getIntersectingSubMeshCandidates.bind(this))}register(){this.scene.onMeshRemovedObservable.add((e=>{const t=this.scene.selectionOctree;if(null!=t){const i=t.dynamicContent.indexOf(e);-1!==i&&t.dynamicContent.splice(i,1)}})),this.scene.onMeshImportedObservable.add((e=>{const t=this.scene.selectionOctree;null!=t&&t.addMesh(e)}))}getActiveMeshCandidates(){var e;return(null===(e=this.scene._selectionOctree)||void 0===e?void 0:e.select(this.scene.frustumPlanes))||this.scene._getDefaultMeshCandidates()}getActiveSubMeshCandidates(e){return e._submeshesOctree&&e.useOctreeForRenderingSelection?e._submeshesOctree.select(this.scene.frustumPlanes):this.scene._getDefaultSubMeshCandidates(e)}getIntersectingSubMeshCandidates(e,t){return e._submeshesOctree&&e.useOctreeForPicking?(Yt.z.TransformToRef(t,e.getWorldMatrix(),this._tempRay),e._submeshesOctree.intersectsRay(this._tempRay)):this.scene._getDefaultSubMeshCandidates(e)}getCollidingSubMeshCandidates(e,t){if(e._submeshesOctree&&e.useOctreeForCollisions){const i=t._velocityWorldLength+Math.max(t._radius.x,t._radius.y,t._radius.z);return e._submeshesOctree.intersects(t._basePointWorld,i)}return this.scene._getDefaultSubMeshCandidates(e)}rebuild(){}dispose(){}}var kn,Gn=i(3322),zn=i(9803);class Wn extends Gn.t{get coloredMaterial(){return this._coloredMaterial}get hoverMaterial(){return this._hoverMaterial}get disableMaterial(){return this._disableMaterial}static _CreateArrow(e,t,i=1,n=!1){const s=new yi.Y("arrow",e),r=an("cylinder",{diameterTop:0,height:.075,diameterBottom:.0375*(1+(i-1)/4),tessellation:96},e),o=an("cylinder",{diameterTop:.005*i,height:.275,diameterBottom:.005*i,tessellation:96},e);return r.parent=s,r.material=t,r.rotation.x=Math.PI/2,r.position.z+=.3,o.parent=s,o.material=t,o.position.z+=.1375,o.rotation.x=Math.PI/2,n&&(o.visibility=0,r.visibility=0),s}static _CreateArrowInstance(e,t){const i=new yi.Y("arrow",e);for(const e of t.getChildMeshes())e.createInstance(e.name).parent=i;return i}constructor(e,t=a.Wo.Gray(),i=zn.x.DefaultUtilityLayer,n=null,s=1){var l;super(i),this._pointerObserver=null,this.snapDistance=0,this.onSnapObservable=new r.y$,this._isEnabled=!0,this._parent=null,this._dragging=!1,this._parent=n,this._coloredMaterial=new Gi.K("",i.utilityLayerScene),this._coloredMaterial.diffuseColor=t,this._coloredMaterial.specularColor=t.subtract(new a.Wo(.1,.1,.1)),this._hoverMaterial=new Gi.K("",i.utilityLayerScene),this._hoverMaterial.diffuseColor=a.Wo.Yellow(),this._disableMaterial=new Gi.K("",i.utilityLayerScene),this._disableMaterial.diffuseColor=a.Wo.Gray(),this._disableMaterial.alpha=.4;const h=Wn._CreateArrow(i.utilityLayerScene,this._coloredMaterial,s),c=Wn._CreateArrow(i.utilityLayerScene,this._coloredMaterial,s+4,!0);this._gizmoMesh=new Nt.Kj("",i.utilityLayerScene),this._gizmoMesh.addChild(h),this._gizmoMesh.addChild(c),this._gizmoMesh.lookAt(this._rootMesh.position.add(e)),this._gizmoMesh.scaling.scaleInPlace(1/3),this._gizmoMesh.parent=this._rootMesh;let u=0;const d={snapDistance:0};this.dragBehavior=new Le.M({dragAxis:e}),this.dragBehavior.moveAttached=!1,this.dragBehavior.updateDragPlane=!1,this._rootMesh.addBehavior(this.dragBehavior),this.dragBehavior.onDragObservable.add((e=>{if(this.attachedNode){this._handlePivot();let t=!1;if(0==this.snapDistance)this.attachedNode.getWorldMatrix().getTranslationToRef(o.jp.Vector3[2]),o.jp.Vector3[2].addInPlace(e.delta),this.dragBehavior.validateDrag(o.jp.Vector3[2])&&(this.attachedNode.position&&this.attachedNode.position.addInPlaceFromFloats(e.delta.x,e.delta.y,e.delta.z),this.attachedNode.getWorldMatrix().addTranslationFromFloats(e.delta.x,e.delta.y,e.delta.z),this.attachedNode.updateCache(),t=!0);else if(u+=e.dragDistance,Math.abs(u)>this.snapDistance){const i=Math.floor(Math.abs(u)/this.snapDistance);u%=this.snapDistance,e.delta.normalizeToRef(o.jp.Vector3[1]),o.jp.Vector3[1].scaleInPlace(this.snapDistance*i),this.attachedNode.getWorldMatrix().getTranslationToRef(o.jp.Vector3[2]),o.jp.Vector3[2].addInPlace(o.jp.Vector3[1]),this.dragBehavior.validateDrag(o.jp.Vector3[2])&&(this.attachedNode.getWorldMatrix().addTranslationFromFloats(o.jp.Vector3[1].x,o.jp.Vector3[1].y,o.jp.Vector3[1].z),this.attachedNode.updateCache(),d.snapDistance=this.snapDistance*i,this.onSnapObservable.notifyObservers(d),t=!0)}t&&this._matrixChanged()}})),this.dragBehavior.onDragStartObservable.add((()=>{this._dragging=!0})),this.dragBehavior.onDragEndObservable.add((()=>{this._dragging=!1}));const p=i._getSharedGizmoLight();p.includedOnlyMeshes=p.includedOnlyMeshes.concat(this._rootMesh.getChildMeshes(!1));const f={gizmoMeshes:h.getChildMeshes(),colliderMeshes:c.getChildMeshes(),material:this._coloredMaterial,hoverMaterial:this._hoverMaterial,disableMaterial:this._disableMaterial,active:!1,dragBehavior:this.dragBehavior};null===(l=this._parent)||void 0===l||l.addToAxisCache(c,f),this._pointerObserver=i.utilityLayerScene.onPointerObservable.add((e=>{var t;if(!this._customMeshSet&&(this._isHovered=!(-1==f.colliderMeshes.indexOf(null===(t=null==e?void 0:e.pickInfo)||void 0===t?void 0:t.pickedMesh)),!this._parent)){const e=this.dragBehavior.enabled?this._isHovered||this._dragging?this._hoverMaterial:this._coloredMaterial:this._disableMaterial;this._setGizmoMeshMaterial(f.gizmoMeshes,e)}})),this.dragBehavior.onEnabledObservable.add((e=>{this._setGizmoMeshMaterial(f.gizmoMeshes,e?f.material:f.disableMaterial)}))}_attachedNodeChanged(e){this.dragBehavior&&(this.dragBehavior.enabled=!!e)}set isEnabled(e){this._isEnabled=e,e?this._parent&&(this.attachedMesh=this._parent.attachedMesh,this.attachedNode=this._parent.attachedNode):(this.attachedMesh=null,this.attachedNode=null)}get isEnabled(){return this._isEnabled}dispose(){this.onSnapObservable.clear(),this.gizmoLayer.utilityLayerScene.onPointerObservable.remove(this._pointerObserver),this.dragBehavior.detach(),this._gizmoMesh&&this._gizmoMesh.dispose(),[this._coloredMaterial,this._hoverMaterial,this._disableMaterial].forEach((e=>{e&&e.dispose()})),super.dispose()}}class Hn{get xAxis(){return this._xAxis}get yAxis(){return this._yAxis}get zAxis(){return this._zAxis}constructor(e,t=1,i=2,n,s,r,l=1){if(this._scaleLinesFactor=4,this._instanced=!1,this.scene=null,this.scaleLines=1,e=e||A.l.LastCreatedScene){if(this.scaleLines=t,!n){const t=new Gi.K("",e);t.disableLighting=!0,t.emissiveColor=a.Wo.Red().scale(.5),n=Wn._CreateArrow(e,t,l)}if(!s){const t=new Gi.K("",e);t.disableLighting=!0,t.emissiveColor=a.Wo.Green().scale(.5),s=Wn._CreateArrow(e,t,l)}if(!r){const t=new Gi.K("",e);t.disableLighting=!0,t.emissiveColor=a.Wo.Blue().scale(.5),r=Wn._CreateArrow(e,t,l)}this._xAxis=n,this._xAxis.scaling.setAll(this.scaleLines*this._scaleLinesFactor),this._yAxis=s,this._yAxis.scaling.setAll(this.scaleLines*this._scaleLinesFactor),this._zAxis=r,this._zAxis.scaling.setAll(this.scaleLines*this._scaleLinesFactor),null!=i&&(Hn._SetRenderingGroupId(this._xAxis,i),Hn._SetRenderingGroupId(this._yAxis,i),Hn._SetRenderingGroupId(this._zAxis,i)),this.scene=e,this.update(new o.P,o.P.Right(),o.P.Up(),o.P.Forward())}}update(e,t,i,n){this._xAxis.position.copyFrom(e),this._xAxis.setDirection(t),this._xAxis.scaling.setAll(this.scaleLines*this._scaleLinesFactor),this._yAxis.position.copyFrom(e),this._yAxis.setDirection(i),this._yAxis.scaling.setAll(this.scaleLines*this._scaleLinesFactor),this._zAxis.position.copyFrom(e),this._zAxis.setDirection(n),this._zAxis.scaling.setAll(this.scaleLines*this._scaleLinesFactor)}createInstance(){const e=Wn._CreateArrowInstance(this.scene,this._xAxis),t=Wn._CreateArrowInstance(this.scene,this._yAxis),i=Wn._CreateArrowInstance(this.scene,this._zAxis),n=new Hn(this.scene,this.scaleLines,null,e,t,i);return n._instanced=!0,n}dispose(){this._xAxis&&this._xAxis.dispose(!1,!this._instanced),this._yAxis&&this._yAxis.dispose(!1,!this._instanced),this._zAxis&&this._zAxis.dispose(!1,!this._instanced),this.scene=null}static _SetRenderingGroupId(e,t){e.getChildMeshes().forEach((e=>{e.renderingGroupId=t}))}}class Xn extends Hn{constructor(e,t,i,n=1){super(e,n),this.pos=o.P.Zero(),this.xaxis=o.P.Zero(),this.yaxis=o.P.Zero(),this.zaxis=o.P.Zero(),this.mesh=i,this.bone=t}update(){if(!this.mesh||!this.bone)return;const e=this.bone;e.getAbsolutePositionToRef(this.mesh,this.pos),e.getDirectionToRef(We.RD.X,this.mesh,this.xaxis),e.getDirectionToRef(We.RD.Y,this.mesh,this.yaxis),e.getDirectionToRef(We.RD.Z,this.mesh,this.zaxis),super.update(this.pos,this.xaxis,this.yaxis,this.zaxis)}dispose(){this.mesh&&(this.mesh=null,this.bone=null,super.dispose())}}Object.defineProperty(k.x.prototype,"debugLayer",{get:function(){return this._debugLayer||(this._debugLayer=new jn(this)),this._debugLayer},enumerable:!0,configurable:!0}),function(e){e[e.Properties=0]="Properties",e[e.Debug=1]="Debug",e[e.Statistics=2]="Statistics",e[e.Tools=3]="Tools",e[e.Settings=4]="Settings"}(kn||(kn={}));class jn{get onPropertyChangedObservable(){return this.BJSINSPECTOR&&this.BJSINSPECTOR.Inspector?this.BJSINSPECTOR.Inspector.OnPropertyChangedObservable:(this._onPropertyChangedObservable||(this._onPropertyChangedObservable=new r.y$),this._onPropertyChangedObservable)}get onSelectionChangedObservable(){return this.BJSINSPECTOR&&this.BJSINSPECTOR.Inspector?this.BJSINSPECTOR.Inspector.OnSelectionChangeObservable:(this._onSelectionChangedObservable||(this._onSelectionChangedObservable=new r.y$),this._onSelectionChangedObservable)}constructor(e){this.BJSINSPECTOR=this._getGlobalInspector(),this._scene=e||A.l.LastCreatedScene,this._scene&&this._scene.onDisposeObservable.add((()=>{this._scene._debugLayer&&this._scene._debugLayer.hide()}))}_createInspector(e){if(this.isVisible())return;if(this._onPropertyChangedObservable){for(const e of this._onPropertyChangedObservable.observers)this.BJSINSPECTOR.Inspector.OnPropertyChangedObservable.add(e);this._onPropertyChangedObservable.clear(),this._onPropertyChangedObservable=void 0}if(this._onSelectionChangedObservable){for(const e of this._onSelectionChangedObservable.observers)this.BJSINSPECTOR.Inspector.OnSelectionChangedObservable.add(e);this._onSelectionChangedObservable.clear(),this._onSelectionChangedObservable=void 0}const t={overlay:!1,showExplorer:!0,showInspector:!0,embedMode:!1,handleResize:!0,enablePopup:!0,...e};this.BJSINSPECTOR=this.BJSINSPECTOR||this._getGlobalInspector(),this.BJSINSPECTOR.Inspector.Show(this._scene,t)}select(e,t){this.BJSINSPECTOR&&(t&&("[object String]"==Object.prototype.toString.call(t)?this.BJSINSPECTOR.Inspector.MarkLineContainerTitleForHighlighting(t):this.BJSINSPECTOR.Inspector.MarkMultipleLineContainerTitlesForHighlighting(t)),this.BJSINSPECTOR.Inspector.OnSelectionChangeObservable.notifyObservers(e))}_getGlobalInspector(){return"undefined"!=typeof INSPECTOR?INSPECTOR:"undefined"!=typeof BABYLON&&void 0!==BABYLON.Inspector?BABYLON:void 0}isVisible(){return this.BJSINSPECTOR&&this.BJSINSPECTOR.Inspector.IsVisible}hide(){this.BJSINSPECTOR&&this.BJSINSPECTOR.Inspector.Hide()}setAsActiveScene(){this.BJSINSPECTOR&&this.BJSINSPECTOR.Inspector._SetNewScene(this._scene)}show(e){return new Promise((t=>{if(void 0===this.BJSINSPECTOR){const i=e&&e.inspectorURL?e.inspectorURL:jn.InspectorURL;de.w1.LoadScript(i,(()=>{this._createInspector(e),t(this)}))}else this._createInspector(e),t(this)}))}}jn.InspectorURL=`https://unpkg.com/babylonjs-inspector@${ue.D.Version}/babylon.inspector.bundle.js`;var Yn=i(7422);function qn(e){const t=e.segments||32,i=e.diameterX||e.diameter||1,n=e.diameterY||e.diameter||1,s=e.diameterZ||e.diameter||1,r=e.arc&&(e.arc<=0||e.arc>1)?1:e.arc||1,a=e.slice&&e.slice<=0?1:e.slice||1,l=0===e.sideOrientation?0:e.sideOrientation||sn.x.DEFAULTSIDE,h=!!e.dedupTopBottomIndices,c=new o.P(i/2,n/2,s/2),u=2+t,d=2*u,p=[],f=[],_=[],m=[];for(let e=0;e<=u;e++){const t=e/u,i=t*Math.PI*a;for(let e=0;e<=d;e++){const n=e/d,s=n*Math.PI*2*r,a=o.y3.RotationZ(-i),l=o.y3.RotationY(s),h=o.P.TransformCoordinates(o.P.Up(),a),u=o.P.TransformCoordinates(h,l),p=u.multiply(c),g=u.divide(c).normalize();f.push(p.x,p.y,p.z),_.push(g.x,g.y,g.z),m.push(n,rn.e.UseOpenGLOrientationForUV?1-t:t)}if(e>0){const t=f.length/3;for(let i=t-2*(d+1);i+d+2<t;i++)h?(e>1&&(p.push(i),p.push(i+1),p.push(i+d+1)),(e<u||a<1)&&(p.push(i+d+1),p.push(i+1),p.push(i+d+2))):(p.push(i),p.push(i+1),p.push(i+d+1),p.push(i+d+1),p.push(i+1),p.push(i+d+2))}}sn.x._ComputeSides(l,f,p,_,m,e.frontUVs,e.backUVs);const g=new sn.x;return g.indices=p,g.positions=f,g.normals=_,g.uvs=m,g}function Kn(e,t={},i=null){const n=new Nt.Kj(e,i);return t.sideOrientation=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),n._originalBuilderSideOrientation=t.sideOrientation,qn(t).applyToMesh(n,t.updatable),n}const $n={CreateSphere:Kn};sn.x.CreateSphere=qn,Nt.Kj.CreateSphere=(e,t,i,n,s,r)=>Kn(e,{segments:t,diameterX:i,diameterY:i,diameterZ:i,sideOrientation:r,updatable:s},n);var Qn=i(4389);function Zn(e={subdivisions:2,tessellation:16,height:1,radius:.25,capSubdivisions:6}){const t=Math.max(e.subdivisions?e.subdivisions:2,1),i=Math.max(e.tessellation?e.tessellation:16,3),n=Math.max(e.height?e.height:1,0),s=Math.max(e.radius?e.radius:.25,0),r=Math.max(e.capSubdivisions?e.capSubdivisions:6,1),a=i,l=t,h=Math.max(e.radiusTop?e.radiusTop:s,0),c=Math.max(e.radiusBottom?e.radiusBottom:s,0),u=n-(h+c),d=2*Math.PI,p=Math.max(e.topCapSubdivisions?e.topCapSubdivisions:r,1),f=Math.max(e.bottomCapSubdivisions?e.bottomCapSubdivisions:r,1),_=Math.acos((c-h)/n);let m=[];const g=[],v=[],y=[];let x=0;const b=[],T=.5*u,S=.5*Math.PI;let E,C;const A=o.P.Zero(),P=o.P.Zero(),R=Math.cos(_),M=Math.sin(_),I=new o.FM(h*M,T+h*R).subtract(new o.FM(c*M,c*R-T)).length(),D=h*_+I+c*(S-_);let O=0;for(C=0;C<=p;C++){const e=[],t=S-_*(C/p);O+=h*_/p;const i=Math.cos(t),n=Math.sin(t),s=i*h;for(E=0;E<=a;E++){const t=E/a,r=t*d+0,o=Math.sin(r),l=Math.cos(r);P.x=s*o,P.y=T+n*h,P.z=s*l,g.push(P.x,P.y,P.z),A.set(i*o,n,i*l),v.push(A.x,A.y,A.z),y.push(t,rn.e.UseOpenGLOrientationForUV?O/D:1-O/D),e.push(x),x++}b.push(e)}const w=n-h-c+R*h-R*c,N=M*(c-h)/w;for(C=1;C<=l;C++){const e=[];O+=I/l;const t=M*(C*(c-h)/l+h);for(E=0;E<=a;E++){const i=E/a,n=i*d+0,s=Math.sin(n),r=Math.cos(n);P.x=t*s,P.y=T+R*h-C*w/l,P.z=t*r,g.push(P.x,P.y,P.z),A.set(s,N,r).normalize(),v.push(A.x,A.y,A.z),y.push(i,rn.e.UseOpenGLOrientationForUV?O/D:1-O/D),e.push(x),x++}b.push(e)}for(C=1;C<=f;C++){const e=[],t=S-_-(Math.PI-_)*(C/f);O+=c*_/f;const i=Math.cos(t),n=Math.sin(t),s=i*c;for(E=0;E<=a;E++){const t=E/a,r=t*d+0,o=Math.sin(r),l=Math.cos(r);P.x=s*o,P.y=n*c-T,P.z=s*l,g.push(P.x,P.y,P.z),A.set(i*o,n,i*l),v.push(A.x,A.y,A.z),y.push(t,rn.e.UseOpenGLOrientationForUV?O/D:1-O/D),e.push(x),x++}b.push(e)}for(E=0;E<a;E++)for(C=0;C<p+l+f;C++){const e=b[C][E],t=b[C+1][E],i=b[C+1][E+1],n=b[C][E+1];m.push(e),m.push(t),m.push(n),m.push(t),m.push(i),m.push(n)}if(m=m.reverse(),e.orientation&&!e.orientation.equals(o.P.Up())){const t=new o.y3;e.orientation.clone().scale(.5*Math.PI).cross(o.P.Up()).toQuaternion().toRotationMatrix(t);const i=o.P.Zero();for(let e=0;e<g.length;e+=3)i.set(g[e],g[e+1],g[e+2]),o.P.TransformCoordinatesToRef(i.clone(),t,i),g[e]=i.x,g[e+1]=i.y,g[e+2]=i.z}const F=new sn.x;return F.positions=g,F.normals=v,F.uvs=y,F.indices=m,F}function Jn(e,t={orientation:o.P.Up(),subdivisions:2,tessellation:16,height:1,radius:.25,capSubdivisions:6,updatable:!1},i=null){const n=new Nt.Kj(e,i);return Zn(t).applyToMesh(n,t.updatable),n}const es={CreateCapsule:Jn};Nt.Kj.CreateCapsule=(e,t,i)=>Jn(e,t,i),sn.x.CreateCapsule=Zn;class ts{constructor(e){if(this._impostors=[],this._meshes=[],this._bodies=[],this._bodyMeshes=[],this._numMeshes=0,this._numBodies=0,this._debugMeshMeshes=new Array,this._scene=e||A.l.LastCreatedScene,!this._scene)return;const t=this._scene.getPhysicsEngine();t&&(this._physicsEnginePlugin=t.getPhysicsPlugin()),this._utilityLayer=new zn.x(this._scene,!1),this._utilityLayer.pickUtilitySceneFirst=!1,this._utilityLayer.utilityLayerScene.autoClearDepthAndStencil=!0}_updateDebugMeshes(){const e=this._physicsEnginePlugin;1===(null==e?void 0:e.getPluginVersion())?this._updateDebugMeshesV1():this._updateDebugMeshesV2()}_updateDebugMeshesV1(){const e=this._physicsEnginePlugin;for(let t=0;t<this._numMeshes;t++){const i=this._impostors[t];if(i)if(i.isDisposed)this.hideImpostor(this._impostors[t--]);else{if(i.type===Qn.Q.MeshImpostor)continue;const n=this._meshes[t];n&&e&&e.syncMeshWithImpostor(n,i)}}}_updateDebugMeshesV2(){const e=this._physicsEnginePlugin;for(let t=0;t<this._numBodies;t++){const i=this._bodies[t],n=this._bodyMeshes[t];i&&n&&e.syncTransform(i,n)}}showImpostor(e,t){if(!this._scene)return null;for(let t=0;t<this._numMeshes;t++)if(this._impostors[t]==e)return null;const i=this._getDebugMesh(e,t);return i&&(this._impostors[this._numMeshes]=e,this._meshes[this._numMeshes]=i,0===this._numMeshes&&(this._renderFunction=this._updateDebugMeshes.bind(this),this._scene.registerBeforeRender(this._renderFunction)),this._numMeshes++),i}showBody(e){if(!this._scene)return null;for(let t=0;t<this._numBodies;t++)if(this._bodies[t]==e)return null;const t=this._getDebugBodyMesh(e);return t&&(this._bodies[this._numBodies]=e,this._bodyMeshes[this._numBodies]=t,0===this._numBodies&&(this._renderFunction=this._updateDebugMeshes.bind(this),this._scene.registerBeforeRender(this._renderFunction)),this._numBodies++),t}hideImpostor(e){if(!e||!this._scene||!this._utilityLayer)return;let t=!1;const i=this._utilityLayer.utilityLayerScene;for(let n=0;n<this._numMeshes;n++)if(this._impostors[n]==e){const e=this._meshes[n];if(!e)continue;i.removeMesh(e),e.dispose();const s=this._debugMeshMeshes.indexOf(e);s>-1&&this._debugMeshMeshes.splice(s,1),this._numMeshes--,this._numMeshes>0?(this._meshes[n]=this._meshes[this._numMeshes],this._impostors[n]=this._impostors[this._numMeshes],this._meshes[this._numMeshes]=null,this._impostors[this._numMeshes]=null):(this._meshes[0]=null,this._impostors[0]=null),t=!0;break}t&&0===this._numMeshes&&this._scene.unregisterBeforeRender(this._renderFunction)}hideBody(e){if(!e||!this._scene||!this._utilityLayer)return;let t=!1;const i=this._utilityLayer.utilityLayerScene;for(let n=0;n<this._numBodies;n++)if(this._bodies[n]===e){const e=this._bodyMeshes[n];if(!e)continue;i.removeMesh(e),e.dispose(),this._numBodies--,this._numBodies>0?(this._bodyMeshes[n]=this._bodyMeshes[this._numBodies],this._bodies[n]=this._bodies[this._numBodies],this._bodyMeshes[this._numBodies]=null,this._bodies[this._numBodies]=null):(this._bodyMeshes[0]=null,this._bodies[0]=null),t=!0;break}t&&0===this._numBodies&&this._scene.unregisterBeforeRender(this._renderFunction)}_getDebugMaterial(e){return this._debugMaterial||(this._debugMaterial=new Gi.K("",e),this._debugMaterial.wireframe=!0,this._debugMaterial.emissiveColor=a.Wo.White(),this._debugMaterial.disableLighting=!0),this._debugMaterial}_getDebugBoxMesh(e){return this._debugBoxMesh||(this._debugBoxMesh=(0,Yn.NR)("physicsBodyBoxViewMesh",{size:1},e),this._debugBoxMesh.rotationQuaternion=o._f.Identity(),this._debugBoxMesh.material=this._getDebugMaterial(e),this._debugBoxMesh.setEnabled(!1)),this._debugBoxMesh.createInstance("physicsBodyBoxViewInstance")}_getDebugSphereMesh(e){return this._debugSphereMesh||(this._debugSphereMesh=Kn("physicsBodySphereViewMesh",{diameter:1},e),this._debugSphereMesh.rotationQuaternion=o._f.Identity(),this._debugSphereMesh.material=this._getDebugMaterial(e),this._debugSphereMesh.setEnabled(!1)),this._debugSphereMesh.createInstance("physicsBodySphereViewInstance")}_getDebugCapsuleMesh(e){return this._debugCapsuleMesh||(this._debugCapsuleMesh=Jn("physicsBodyCapsuleViewMesh",{height:1},e),this._debugCapsuleMesh.rotationQuaternion=o._f.Identity(),this._debugCapsuleMesh.material=this._getDebugMaterial(e),this._debugCapsuleMesh.setEnabled(!1)),this._debugCapsuleMesh.createInstance("physicsBodyCapsuleViewInstance")}_getDebugCylinderMesh(e){return this._debugCylinderMesh||(this._debugCylinderMesh=an("physicsBodyCylinderViewMesh",{diameterTop:1,diameterBottom:1,height:1},e),this._debugCylinderMesh.rotationQuaternion=o._f.Identity(),this._debugCylinderMesh.material=this._getDebugMaterial(e),this._debugCylinderMesh.setEnabled(!1)),this._debugCylinderMesh.createInstance("physicsBodyCylinderViewInstance")}_getDebugMeshMesh(e,t){const i=new Nt.Kj(e.name,t,null,e);return i.setParent(e),i.position=o.P.Zero(),i.material=this._getDebugMaterial(t),this._debugMeshMeshes.push(i),i}_getDebugMesh(e,t){if(!this._utilityLayer)return null;if(t&&t.parent&&t.parent.physicsImpostor)return null;let i=null;const n=this._utilityLayer.utilityLayerScene;if(!e.physicsBody)return _.Y.Warn("Unable to get physicsBody of impostor. It might be initialized later by its parent's impostor."),null;switch(e.type){case Qn.Q.BoxImpostor:i=this._getDebugBoxMesh(n),e.getBoxSizeToRef(i.scaling);break;case Qn.Q.SphereImpostor:{i=this._getDebugSphereMesh(n);const t=e.getRadius();i.scaling.x=2*t,i.scaling.y=2*t,i.scaling.z=2*t;break}case Qn.Q.CapsuleImpostor:{i=this._getDebugCapsuleMesh(n);const t=e.object.getBoundingInfo();i.scaling.x=2*(t.boundingBox.maximum.x-t.boundingBox.minimum.x)*e.object.scaling.x,i.scaling.y=(t.boundingBox.maximum.y-t.boundingBox.minimum.y)*e.object.scaling.y,i.scaling.z=2*(t.boundingBox.maximum.z-t.boundingBox.minimum.z)*e.object.scaling.z;break}case Qn.Q.MeshImpostor:t&&(i=this._getDebugMeshMesh(t,n));break;case Qn.Q.NoImpostor:t?t.getChildMeshes().filter((e=>e.physicsImpostor?1:0)).forEach((e=>{if(e.physicsImpostor&&"Mesh"===e.getClassName()){const t=e.getBoundingInfo(),s=t.boundingBox.minimum,r=t.boundingBox.maximum;switch(e.physicsImpostor.type){case Qn.Q.BoxImpostor:i=this._getDebugBoxMesh(n),i.position.copyFrom(s),i.position.addInPlace(r),i.position.scaleInPlace(.5);break;case Qn.Q.SphereImpostor:i=this._getDebugSphereMesh(n);break;case Qn.Q.CylinderImpostor:i=this._getDebugCylinderMesh(n);break;default:i=null}i&&(i.scaling.x=r.x-s.x,i.scaling.y=r.y-s.y,i.scaling.z=r.z-s.z,i.parent=e)}})):_.Y.Warn("No target mesh parameter provided for NoImpostor. Skipping."),i=null;break;case Qn.Q.CylinderImpostor:{i=this._getDebugCylinderMesh(n);const t=e.object.getBoundingInfo();i.scaling.x=(t.boundingBox.maximum.x-t.boundingBox.minimum.x)*e.object.scaling.x,i.scaling.y=(t.boundingBox.maximum.y-t.boundingBox.minimum.y)*e.object.scaling.y,i.scaling.z=(t.boundingBox.maximum.z-t.boundingBox.minimum.z)*e.object.scaling.z;break}}return i}_getDebugBodyMesh(e){if(!this._utilityLayer)return null;const t=this._utilityLayer.utilityLayerScene,i=new Nt.Kj("custom",t),n=new sn.x,s=e.getGeometry();if(n.positions=s.positions,n.indices=s.indices,n.applyToMesh(i),e._pluginDataInstances){const t=new Float32Array(16*e._pluginDataInstances.length);i.thinInstanceSetBuffer("matrix",t,16)}return i.material=this._getDebugMaterial(t),i}dispose(){for(let e=this._numMeshes-1;e>=0;e--)this.hideImpostor(this._impostors[0]);for(let e=this._numBodies-1;e>=0;e--)this.hideBody(this._bodies[0]);this._debugBoxMesh&&this._debugBoxMesh.dispose(),this._debugSphereMesh&&this._debugSphereMesh.dispose(),this._debugCylinderMesh&&this._debugCylinderMesh.dispose(),this._debugMaterial&&this._debugMaterial.dispose(),this._impostors.length=0,this._scene=null,this._physicsEnginePlugin=null,this._utilityLayer&&(this._utilityLayer.dispose(),this._utilityLayer=null)}}var is=i(8591);function ns(e){const t=[],i=[],n=e.lines,s=e.colors,r=[];let o=0;for(let e=0;e<n.length;e++){const a=n[e];for(let n=0;n<a.length;n++){if(i.push(a[n].x,a[n].y,a[n].z),s){const t=s[e];r.push(t[n].r,t[n].g,t[n].b,t[n].a)}n>0&&(t.push(o-1),t.push(o)),o++}}const a=new sn.x;return a.indices=t,a.positions=i,s&&(a.colors=r),a}function ss(e){const t=e.dashSize||3,i=e.gapSize||1,n=e.dashNb||200,s=e.points,r=new Array,a=new Array,l=o.P.Zero();let h=0,c=0,u=0,d=0,p=0,f=0,_=0;for(_=0;_<s.length-1;_++)s[_+1].subtractToRef(s[_],l),h+=l.length();for(u=h/n,d=t*u/(t+i),_=0;_<s.length-1;_++){s[_+1].subtractToRef(s[_],l),c=Math.floor(l.length()/u),l.normalize();for(let e=0;e<c;e++)p=u*e,r.push(s[_].x+p*l.x,s[_].y+p*l.y,s[_].z+p*l.z),r.push(s[_].x+(p+d)*l.x,s[_].y+(p+d)*l.y,s[_].z+(p+d)*l.z),a.push(f,f+1),f+=2}const m=new sn.x;return m.positions=r,m.indices=a,m}function rs(e,t,i){const n=t.instance,s=t.lines,r=t.colors;if(n){const e=n.getVerticesData(qe.o.PositionKind);let t,i;r&&(t=n.getVerticesData(qe.o.ColorKind));let o=0,a=0;for(let n=0;n<s.length;n++){const l=s[n];for(let s=0;s<l.length;s++)e[o]=l[s].x,e[o+1]=l[s].y,e[o+2]=l[s].z,r&&t&&(i=r[n],t[a]=i[s].r,t[a+1]=i[s].g,t[a+2]=i[s].b,t[a+3]=i[s].a,a+=4),o+=3}return n.updateVerticesData(qe.o.PositionKind,e,!1,!1),r&&t&&n.updateVerticesData(qe.o.ColorKind,t,!1,!1),n}const o=!!r,a=new is._(e,i,null,void 0,void 0,o,t.useVertexAlpha,t.material);return ns(t).applyToMesh(a,t.updatable),a}function os(e,t,i=null){const n=t.colors?[t.colors]:null;return rs(e,{lines:[t.points],updatable:t.updatable,instance:t.instance,colors:n,useVertexAlpha:t.useVertexAlpha,material:t.material},i)}function as(e,t,i=null){const n=t.points,s=t.instance,r=t.gapSize||1,a=t.dashSize||3;if(s){const e=e=>{const t=o.P.Zero(),i=e.length/6;let r=0,a=0,l=0,h=0,c=0,u=0,d=0,p=0;for(d=0;d<n.length-1;d++)n[d+1].subtractToRef(n[d],t),r+=t.length();l=r/i;const f=s._creationDataStorage.dashSize;for(h=f*l/(f+s._creationDataStorage.gapSize),d=0;d<n.length-1;d++)for(n[d+1].subtractToRef(n[d],t),a=Math.floor(t.length()/l),t.normalize(),p=0;p<a&&u<e.length;)c=l*p,e[u]=n[d].x+c*t.x,e[u+1]=n[d].y+c*t.y,e[u+2]=n[d].z+c*t.z,e[u+3]=n[d].x+(c+h)*t.x,e[u+4]=n[d].y+(c+h)*t.y,e[u+5]=n[d].z+(c+h)*t.z,u+=6,p++;for(;u<e.length;)e[u]=n[d].x,e[u+1]=n[d].y,e[u+2]=n[d].z,u+=3};return(t.dashNb||t.dashSize||t.gapSize||t.useVertexAlpha||t.material)&&_.Y.Warn("You have used an option other than points with the instance option. Please be aware that these other options will be ignored."),s.updateMeshPositions(e,!1),s}const l=new is._(e,i,null,void 0,void 0,void 0,t.useVertexAlpha,t.material);return ss(t).applyToMesh(l,t.updatable),l._creationDataStorage=new Nt.gW,l._creationDataStorage.dashSize=a,l._creationDataStorage.gapSize=r,l}const ls={CreateDashedLines:as,CreateLineSystem:rs,CreateLines:os};sn.x.CreateLineSystem=ns,sn.x.CreateDashedLines=ss,Nt.Kj.CreateLines=(e,t,i=null,n=!1,s=null)=>os(e,{points:t,updatable:n,instance:s},i),Nt.Kj.CreateDashedLines=(e,t,i,n,s,r=null,o,a)=>as(e,{points:t,dashSize:i,gapSize:n,dashNb:s,updatable:o,instance:a},r);class hs{static CreateAndShow(e,t,i){const n=new hs(e);return n.show(t,i),n}constructor(e){this.ray=e}show(e,t){if(!this._renderFunction&&this.ray){const t=this.ray;this._renderFunction=this._render.bind(this),this._scene=e,this._renderPoints=[t.origin,t.origin.add(t.direction.scale(t.length))],this._renderLine=os("ray",{points:this._renderPoints,updatable:!0},e),this._renderLine.isPickable=!1,this._renderFunction&&this._scene.registerBeforeRender(this._renderFunction)}t&&this._renderLine&&this._renderLine.color.copyFrom(t)}hide(){this._renderFunction&&this._scene&&(this._scene.unregisterBeforeRender(this._renderFunction),this._scene=null,this._renderFunction=null,this._renderLine&&(this._renderLine.dispose(),this._renderLine=null),this._renderPoints=[])}_render(){var e;const t=this.ray;if(!t)return;const i=this._renderPoints[1],n=Math.min(t.length,1e6);i.copyFrom(t.direction),i.scaleInPlace(n),i.addInPlace(t.origin),this._renderPoints[0].copyFrom(t.origin),os("ray",{points:this._renderPoints,updatable:!0,instance:this._renderLine},this._scene),null===(e=this._renderLine)||void 0===e||e.refreshBoundingInfo()}attachToMesh(e,t,i,n){this._attachedToMesh=e;const s=this.ray;s&&(s.direction||(s.direction=o.P.Zero()),s.origin||(s.origin=o.P.Zero()),n&&(s.length=n),i||(i=o.P.Zero()),t||(t=new o.P(0,0,-1)),this._scene||(this._scene=e.getScene()),this._meshSpaceDirection?(this._meshSpaceDirection.copyFrom(t),this._meshSpaceOrigin.copyFrom(i)):(this._meshSpaceDirection=t.clone(),this._meshSpaceOrigin=i.clone()),this._onAfterRenderObserver||(this._onAfterRenderObserver=this._scene.onBeforeRenderObservable.add((()=>this._updateToMesh())),this._onAfterStepObserver=this._scene.onAfterStepObservable.add((()=>this._updateToMesh()))),this._attachedToMesh.computeWorldMatrix(!0),this._updateToMesh())}detachFromMesh(){this._attachedToMesh&&this._scene&&(this._onAfterRenderObserver&&(this._scene.onBeforeRenderObservable.remove(this._onAfterRenderObserver),this._scene.onAfterStepObservable.remove(this._onAfterStepObserver)),this._attachedToMesh=null,this._onAfterRenderObserver=null,this._onAfterStepObserver=null,this._scene=null)}_updateToMesh(){const e=this.ray;this._attachedToMesh&&e&&(this._attachedToMesh.isDisposed()?this.detachFromMesh():(this._attachedToMesh.getDirectionToRef(this._meshSpaceDirection,e.direction),o.P.TransformCoordinatesToRef(this._meshSpaceOrigin,this._attachedToMesh.getWorldMatrix(),e.origin)))}dispose(){this.hide(),this.detachFromMesh(),this.ray=null}}var cs=i(7104),us=i(8097),ds=i(1979);function ps(e){let t=e.pathArray;const i=e.closeArray||!1,n=e.closePath||!1,s=e.invertUV||!1,r=Math.floor(t[0].length/2);let o=e.offset||r;o=o>r?r:Math.floor(o);const a=0===e.sideOrientation?0:e.sideOrientation||sn.x.DEFAULTSIDE,l=e.uvs,h=e.colors,c=[],u=[],d=[],p=[],f=[],_=[],m=[],g=[];let v;const y=[],x=[];let b,T,S;if(t.length<2){const e=[],i=[];for(T=0;T<t[0].length-o;T++)e.push(t[0][T]),i.push(t[0][T+o]);t=[e,i]}let E=0;const C=n?1:0;let A,P,R,M,I,D;for(v=t[0].length,b=0;b<t.length;b++){for(m[b]=0,f[b]=[0],A=t[b],P=A.length,v=v<P?v:P,S=0;S<P;)c.push(A[S].x,A[S].y,A[S].z),S>0&&(R=A[S].subtract(A[S-1]).length(),M=R+m[b],f[b].push(M),m[b]=M),S++;n&&(S--,c.push(A[0].x,A[0].y,A[0].z),R=A[S].subtract(A[0]).length(),M=R+m[b],f[b].push(M),m[b]=M),y[b]=P+C,x[b]=E,E+=P+C}let O,w,N=null,F=null;for(T=0;T<v+C;T++){for(g[T]=0,_[T]=[0],b=0;b<t.length-1;b++)I=t[b],D=t[b+1],T===v?(N=I[0],F=D[0]):(N=I[T],F=D[T]),R=F.subtract(N).length(),M=R+g[T],_[T].push(M),g[T]=M;i&&F&&N&&(I=t[b],D=t[0],T===v&&(F=D[0]),R=F.subtract(N).length(),M=R+g[T],g[T]=M)}if(l)for(b=0;b<l.length;b++)p.push(l[b].x,rn.e.UseOpenGLOrientationForUV?1-l[b].y:l[b].y);else for(b=0;b<t.length;b++)for(T=0;T<v+C;T++)O=0!=m[b]?f[b][T]/m[b]:0,w=0!=g[T]?_[T][b]/g[T]:0,s?p.push(w,O):p.push(O,rn.e.UseOpenGLOrientationForUV?1-w:w);b=0;let L=0,B=y[b]-1,U=y[b+1]-1,V=B<U?B:U,k=x[1]-x[0];const G=i?y.length:y.length-1;for(;L<=V&&b<G;)u.push(L,L+k,L+1),u.push(L+k+1,L+1,L+k),L+=1,L===V&&(b++,b===y.length-1?(k=x[0]-x[b],B=y[b]-1,U=y[0]-1):(k=x[b+1]-x[b],B=y[b]-1,U=y[b+1]-1),L=x[b],V=B<U?B+L:U+L);if(sn.x.ComputeNormals(c,u,d),n){let e=0,i=0;for(b=0;b<t.length;b++)e=3*x[b],i=b+1<t.length?3*(x[b+1]-1):d.length-3,d[e]=.5*(d[e]+d[i]),d[e+1]=.5*(d[e+1]+d[i+1]),d[e+2]=.5*(d[e+2]+d[i+2]),d[i]=d[e],d[i+1]=d[e+1],d[i+2]=d[e+2]}sn.x._ComputeSides(a,c,u,d,p,e.frontUVs,e.backUVs);let z=null;if(h){z=new Float32Array(4*h.length);for(let e=0;e<h.length;e++)z[4*e]=h[e].r,z[4*e+1]=h[e].g,z[4*e+2]=h[e].b,z[4*e+3]=h[e].a}const W=new sn.x,H=new Float32Array(c),X=new Float32Array(d),j=new Float32Array(p);return W.indices=u,W.positions=H,W.normals=X,W.uvs=j,z&&W.set(z,qe.o.ColorKind),n&&(W._idx=x),W}function fs(e,t,i=null){const n=t.pathArray,s=t.closeArray,r=t.closePath,a=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),l=t.instance,h=t.updatable;if(l){const e=o.jp.Vector3[0].setAll(Number.MAX_VALUE),i=o.jp.Vector3[1].setAll(-Number.MAX_VALUE),s=t=>{let s=n[0].length;const r=l;let o=0;const a=r._originalBuilderSideOrientation===Nt.Kj.DOUBLESIDE?2:1;for(let l=1;l<=a;++l)for(let a=0;a<n.length;++a){const l=n[a],h=l.length;s=s<h?s:h;for(let n=0;n<s;++n){const s=l[n];t[o]=s.x,t[o+1]=s.y,t[o+2]=s.z,e.minimizeInPlaceFromFloats(s.x,s.y,s.z),i.maximizeInPlaceFromFloats(s.x,s.y,s.z),o+=3}if(r._creationDataStorage&&r._creationDataStorage.closePath){const e=l[0];t[o]=e.x,t[o+1]=e.y,t[o+2]=e.z,o+=3}}},r=l.getVerticesData(qe.o.PositionKind);if(s(r),l.hasBoundingInfo?l.getBoundingInfo().reConstruct(e,i,l._worldMatrix):l.buildBoundingInfo(e,i,l._worldMatrix),l.updateVerticesData(qe.o.PositionKind,r,!1,!1),t.colors){const e=l.getVerticesData(qe.o.ColorKind);for(let i=0,n=0;i<t.colors.length;i++,n+=4){const s=t.colors[i];e[n]=s.r,e[n+1]=s.g,e[n+2]=s.b,e[n+3]=s.a}l.updateVerticesData(qe.o.ColorKind,e,!1,!1)}if(t.uvs){const e=l.getVerticesData(qe.o.UVKind);for(let i=0;i<t.uvs.length;i++)e[2*i]=t.uvs[i].x,e[2*i+1]=rn.e.UseOpenGLOrientationForUV?1-t.uvs[i].y:t.uvs[i].y;l.updateVerticesData(qe.o.UVKind,e,!1,!1)}if(!l.areNormalsFrozen||l.isFacetDataEnabled){const e=l.getIndices(),t=l.getVerticesData(qe.o.NormalKind),i=l.isFacetDataEnabled?l.getFacetDataParameters():null;if(sn.x.ComputeNormals(r,e,t,i),l._creationDataStorage&&l._creationDataStorage.closePath){let e=0,i=0;for(let s=0;s<n.length;s++)e=3*l._creationDataStorage.idx[s],i=s+1<n.length?3*(l._creationDataStorage.idx[s+1]-1):t.length-3,t[e]=.5*(t[e]+t[i]),t[e+1]=.5*(t[e+1]+t[i+1]),t[e+2]=.5*(t[e+2]+t[i+2]),t[i]=t[e],t[i+1]=t[e+1],t[i+2]=t[e+2]}l.areNormalsFrozen||l.updateVerticesData(qe.o.NormalKind,t,!1,!1)}return l}{const n=new Nt.Kj(e,i);n._originalBuilderSideOrientation=a,n._creationDataStorage=new Nt.gW;const o=ps(t);return r&&(n._creationDataStorage.idx=o._idx),n._creationDataStorage.closePath=r,n._creationDataStorage.closeArray=s,o.applyToMesh(n,h),n}}const _s={CreateRibbon:fs};function ms(e,t,i=null){const n=t.path,s=t.shape,r=t.scale||1,o=t.rotation||0,a=0===t.cap?0:t.cap||Nt.Kj.NO_CAP,l=t.updatable,h=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),c=t.instance||null,u=t.invertUV||!1,d=t.closeShape||!1;return vs(e,s,n,r,o,null,null,t.closePath||!1,d,a,!1,i,!!l,h,c,u,t.frontUVs||null,t.backUVs||null,t.firstNormal||null,!!t.adjustFrame)}function gs(e,t,i=null){const n=t.path,s=t.shape,r=t.scaleFunction||(()=>1),o=t.rotationFunction||(()=>0),a=t.closePath||t.ribbonCloseArray||!1,l=t.closeShape||t.ribbonClosePath||!1,h=0===t.cap?0:t.cap||Nt.Kj.NO_CAP,c=t.updatable,u=t.firstNormal||null,d=t.adjustFrame||!1;return vs(e,s,n,null,null,r,o,a,l,h,!0,i,!!c,Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),t.instance||null,t.invertUV||!1,t.frontUVs||null,t.backUVs||null,u,d)}function vs(e,t,i,n,s,r,a,l,h,c,u,d,p,f,_,m,g,v,y,x){const b=(e,t,i,n,s,r,a,l,h,c,u)=>{const d=i.getTangents(),p=i.getNormals(),f=i.getBinormals(),_=i.getDistances();if(u)for(let e=0;e<d.length;e++)if(0==d[e].x&&0==d[e].y&&0==d[e].z&&d[e].copyFrom(d[e-1]),0==p[e].x&&0==p[e].y&&0==p[e].z&&p[e].copyFrom(p[e-1]),0==f[e].x&&0==f[e].y&&0==f[e].z&&f[e].copyFrom(f[e-1]),e>0){let t=d[e-1];o.P.Dot(t,d[e])<0&&d[e].scaleInPlace(-1),t=p[e-1],o.P.Dot(t,p[e])<0&&p[e].scaleInPlace(-1),t=f[e-1],o.P.Dot(t,f[e])<0&&f[e].scaleInPlace(-1)}let m=0;const g=c&&l?l:()=>null!==r?r:0,v=c&&a?a:()=>null!==s?s:1;let y=h===Nt.Kj.NO_CAP||h===Nt.Kj.CAP_END?0:2;const x=o.jp.Matrix[0];for(let i=0;i<t.length;i++){const s=new Array,r=g(i,_[i]),a=v(i,_[i]);o.y3.RotationAxisToRef(d[i],m,x);for(let n=0;n<e.length;n++){const r=d[i].scale(e[n].z).add(p[i].scale(e[n].x)).add(f[i].scale(e[n].y)),l=o.P.Zero();o.P.TransformCoordinatesToRef(r,x,l),l.scaleInPlace(a).addInPlace(t[i]),s[n]=l}n[y]=s,m+=r,y++}const b=e=>{const t=Array(),i=o.P.Zero();let n;for(n=0;n<e.length;n++)i.addInPlace(e[n]);for(i.scaleInPlace(1/e.length),n=0;n<e.length;n++)t.push(i);return t};switch(h){case Nt.Kj.NO_CAP:break;case Nt.Kj.CAP_START:n[0]=b(n[2]),n[1]=n[2];break;case Nt.Kj.CAP_END:n[y]=n[y-1],n[y+1]=b(n[y-1]);break;case Nt.Kj.CAP_ALL:n[0]=b(n[2]),n[1]=n[2],n[y]=n[y-1],n[y+1]=b(n[y-1])}return n};let T,S;if(_){const e=_._creationDataStorage;return T=y?e.path3D.update(i,y):e.path3D.update(i),S=b(t,i,e.path3D,e.pathArray,n,s,r,a,e.cap,u,x),fs("",{pathArray:S,closeArray:!1,closePath:!1,offset:0,updatable:!1,sideOrientation:0,instance:_},d||void 0)}T=y?new X.$B(i,y):new X.$B(i),S=b(t,i,T,new Array,n,s,r,a,c=c<0||c>3?0:c,u,x);const E=fs(e,{pathArray:S,closeArray:l,closePath:h,updatable:p,sideOrientation:f,invertUV:m,frontUVs:g||void 0,backUVs:v||void 0},d);return E._creationDataStorage.pathArray=S,E._creationDataStorage.path3D=T,E._creationDataStorage.cap=c,E}sn.x.CreateRibbon=ps,Nt.Kj.CreateRibbon=(e,t,i=!1,n,s,r,o=!1,a,l)=>fs(e,{pathArray:t,closeArray:i,closePath:n,offset:s,updatable:o,sideOrientation:a,instance:l},r);const ys={ExtrudeShape:ms,ExtrudeShapeCustom:gs};Nt.Kj.ExtrudeShape=(e,t,i,n,s,r,o=null,a,l,h)=>ms(e,{shape:t,path:i,scale:n,rotation:s,cap:0===r?0:r||Nt.Kj.NO_CAP,sideOrientation:l,instance:h,updatable:a},o),Nt.Kj.ExtrudeShapeCustom=(e,t,i,n,s,r,o,a,l,h,c,u)=>gs(e,{shape:t,path:i,scaleFunction:n,rotationFunction:s,ribbonCloseArray:r,ribbonClosePath:o,cap:0===a?0:a||Nt.Kj.NO_CAP,sideOrientation:c,instance:u,updatable:h},l);class xs{static CreateBoneWeightShader(e,t){var i,n,s,r,o,l;const h=e.skeleton,c=null!==(i=e.colorBase)&&void 0!==i?i:a.Wo.Black(),u=null!==(n=e.colorZero)&&void 0!==n?n:a.Wo.Blue(),d=null!==(s=e.colorQuarter)&&void 0!==s?s:a.Wo.Green(),p=null!==(r=e.colorHalf)&&void 0!==r?r:a.Wo.Yellow(),f=null!==(o=e.colorFull)&&void 0!==o?o:a.Wo.Red(),_=null!==(l=e.targetBoneIndex)&&void 0!==l?l:0;ds.Q.ShadersStore["boneWeights:"+h.name+"VertexShader"]="precision highp float;\n\n        attribute vec3 position;\n        attribute vec2 uv;\n\n        uniform mat4 view;\n        uniform mat4 projection;\n        uniform mat4 worldViewProjection;\n\n        #include<bonesDeclaration>\n        #if NUM_BONE_INFLUENCERS == 0\n            attribute vec4 matricesIndices;\n            attribute vec4 matricesWeights;\n        #endif\n        #include<bakedVertexAnimationDeclaration>\n\n        #include<instancesDeclaration>\n\n        varying vec3 vColor;\n\n        uniform vec3 colorBase;\n        uniform vec3 colorZero;\n        uniform vec3 colorQuarter;\n        uniform vec3 colorHalf;\n        uniform vec3 colorFull;\n\n        uniform float targetBoneIndex;\n\n        void main() {\n            vec3 positionUpdated = position;\n\n            #include<instancesVertex>\n            #include<bonesVertex>\n            #include<bakedVertexAnimation>\n\n            vec4 worldPos = finalWorld * vec4(positionUpdated, 1.0);\n\n            vec3 color = colorBase;\n            float totalWeight = 0.;\n            if(matricesIndices[0] == targetBoneIndex && matricesWeights[0] > 0.){\n                totalWeight += matricesWeights[0];\n            }\n            if(matricesIndices[1] == targetBoneIndex && matricesWeights[1] > 0.){\n                totalWeight += matricesWeights[1];\n            }\n            if(matricesIndices[2] == targetBoneIndex && matricesWeights[2] > 0.){\n                totalWeight += matricesWeights[2];\n            }\n            if(matricesIndices[3] == targetBoneIndex && matricesWeights[3] > 0.){\n                totalWeight += matricesWeights[3];\n            }\n\n            color = mix(color, colorZero, smoothstep(0., 0.25, totalWeight));\n            color = mix(color, colorQuarter, smoothstep(0.25, 0.5, totalWeight));\n            color = mix(color, colorHalf, smoothstep(0.5, 0.75, totalWeight));\n            color = mix(color, colorFull, smoothstep(0.75, 1.0, totalWeight));\n            vColor = color;\n\n        gl_Position = projection * view * worldPos;\n        }",ds.Q.ShadersStore["boneWeights:"+h.name+"FragmentShader"]="\n            precision highp float;\n            varying vec3 vPosition;\n\n            varying vec3 vColor;\n\n            void main() {\n                vec4 color = vec4(vColor, 1.0);\n                gl_FragColor = color;\n            }\n        ";const m=new us.j("boneWeight:"+h.name,t,{vertex:"boneWeights:"+h.name,fragment:"boneWeights:"+h.name},{attributes:["position","normal","matricesIndices","matricesWeights"],uniforms:["world","worldView","worldViewProjection","view","projection","viewProjection","colorBase","colorZero","colorQuarter","colorHalf","colorFull","targetBoneIndex"]});return m.setColor3("colorBase",c),m.setColor3("colorZero",u),m.setColor3("colorQuarter",d),m.setColor3("colorHalf",p),m.setColor3("colorFull",f),m.setFloat("targetBoneIndex",_),m.getClassName=()=>"BoneWeightShader",m.transparencyMode=cs.F.MATERIAL_OPAQUE,m}static CreateSkeletonMapShader(e,t){var i;const n=e.skeleton,s=null!==(i=e.colorMap)&&void 0!==i?i:[{color:new a.Wo(1,.38,.18),location:0},{color:new a.Wo(.59,.18,1),location:.2},{color:new a.Wo(.59,1,.18),location:.4},{color:new a.Wo(1,.87,.17),location:.6},{color:new a.Wo(1,.17,.42),location:.8},{color:new a.Wo(.17,.68,1),location:1}],r=n.bones.length+1,o=xs._CreateBoneMapColorBuffer(r,s,t),l=new us.j("boneWeights:"+n.name,t,{vertexSource:"precision highp float;\n\n            attribute vec3 position;\n            attribute vec2 uv;\n\n            uniform mat4 view;\n            uniform mat4 projection;\n            uniform mat4 worldViewProjection;\n            uniform float colorMap["+4*n.bones.length+"];\n\n            #include<bonesDeclaration>\n            #if NUM_BONE_INFLUENCERS == 0\n                attribute vec4 matricesIndices;\n                attribute vec4 matricesWeights;\n            #endif\n            #include<bakedVertexAnimationDeclaration>\n            #include<instancesDeclaration>\n\n            varying vec3 vColor;\n\n            void main() {\n                vec3 positionUpdated = position;\n\n                #include<instancesVertex>\n                #include<bonesVertex>\n                #include<bakedVertexAnimation>\n\n                vec3 color = vec3(0.);\n                bool first = true;\n\n                for (int i = 0; i < 4; i++) {\n                    int boneIdx = int(matricesIndices[i]);\n                    float boneWgt = matricesWeights[i];\n\n                    vec3 c = vec3(colorMap[boneIdx * 4 + 0], colorMap[boneIdx * 4 + 1], colorMap[boneIdx * 4 + 2]);\n\n                    if (boneWgt > 0.) {\n                        if (first) {\n                            first = false;\n                            color = c;\n                        } else {\n                            color = mix(color, c, boneWgt);\n                        }\n                    }\n                }\n\n                vColor = color;\n\n                vec4 worldPos = finalWorld * vec4(positionUpdated, 1.0);\n\n                gl_Position = projection * view * worldPos;\n            }",fragmentSource:"\n            precision highp float;\n            varying vec3 vColor;\n\n            void main() {\n                vec4 color = vec4( vColor, 1.0 );\n                gl_FragColor = color;\n            }\n            "},{attributes:["position","normal","matricesIndices","matricesWeights"],uniforms:["world","worldView","worldViewProjection","view","projection","viewProjection","colorMap"]});return l.setFloats("colorMap",o),l.getClassName=()=>"SkeletonMapShader",l.transparencyMode=cs.F.MATERIAL_OPAQUE,l}static _CreateBoneMapColorBuffer(e,t,i){const n=new zi.c("temp",{width:e,height:1},i,!1),s=n.getContext(),r=s.createLinearGradient(0,0,e,0);t.forEach((e=>{r.addColorStop(e.location,e.color.toHexString())})),s.fillStyle=r,s.fillRect(0,0,e,1),n.update();const o=[],a=s.getImageData(0,0,e,1).data;for(let e=0;e<a.length;e++)o.push(.00392156862745098*a[e]);return n.dispose(),o}get scene(){return this._scene}get utilityLayer(){return this._utilityLayer}get isReady(){return this._ready}set ready(e){this._ready=e}get debugMesh(){return this._debugMesh}set debugMesh(e){this._debugMesh=e}get displayMode(){return this.options.displayMode||xs.DISPLAY_LINES}set displayMode(e){e>xs.DISPLAY_SPHERE_AND_SPURS&&(e=xs.DISPLAY_LINES),this.options.displayMode=e}constructor(e,t,i,n=!0,s=3,r={}){var o,l,h,c,u,d,p,f,_,m,g,v,y,x;this.skeleton=e,this.mesh=t,this.autoUpdateBonesMatrices=n,this.renderingGroupId=s,this.options=r,this.color=a.Wo.White(),this._debugLines=new Array,this._localAxes=null,this._isEnabled=!0,this._obs=null,this._scene=i,this._ready=!1,r.pauseAnimations=null===(o=r.pauseAnimations)||void 0===o||o,r.returnToRest=null!==(l=r.returnToRest)&&void 0!==l&&l,r.displayMode=null!==(h=r.displayMode)&&void 0!==h?h:xs.DISPLAY_LINES,r.displayOptions=null!==(c=r.displayOptions)&&void 0!==c?c:{},r.displayOptions.midStep=null!==(u=r.displayOptions.midStep)&&void 0!==u?u:.235,r.displayOptions.midStepFactor=null!==(d=r.displayOptions.midStepFactor)&&void 0!==d?d:.155,r.displayOptions.sphereBaseSize=null!==(p=r.displayOptions.sphereBaseSize)&&void 0!==p?p:.15,r.displayOptions.sphereScaleUnit=null!==(f=r.displayOptions.sphereScaleUnit)&&void 0!==f?f:2,r.displayOptions.sphereFactor=null!==(_=r.displayOptions.sphereFactor)&&void 0!==_?_:.865,r.displayOptions.spurFollowsChild=null!==(m=r.displayOptions.spurFollowsChild)&&void 0!==m&&m,r.displayOptions.showLocalAxes=null!==(g=r.displayOptions.showLocalAxes)&&void 0!==g&&g,r.displayOptions.localAxesSize=null!==(v=r.displayOptions.localAxesSize)&&void 0!==v?v:.075,r.computeBonesUsingShaders=null===(y=r.computeBonesUsingShaders)||void 0===y||y,r.useAllBones=null===(x=r.useAllBones)||void 0===x||x;const b=t.getVerticesData(qe.o.MatricesIndicesKind),T=t.getVerticesData(qe.o.MatricesWeightsKind);if(this._boneIndices=new Set,!r.useAllBones&&b&&T)for(let e=0;e<b.length;++e){const t=b[e];0!==T[e]&&this._boneIndices.add(t)}this._utilityLayer=new zn.x(this._scene,!1),this._utilityLayer.pickUtilitySceneFirst=!1,this._utilityLayer.utilityLayerScene.autoClearDepthAndStencil=!0;let S=this.options.displayMode||0;S>xs.DISPLAY_SPHERE_AND_SPURS&&(S=xs.DISPLAY_LINES),this.displayMode=S,this.update(),this._bindObs()}_bindObs(){this.displayMode===xs.DISPLAY_LINES&&(this._obs=this.scene.onBeforeRenderObservable.add((()=>{this._displayLinesUpdate()})))}update(){switch(this.displayMode){case xs.DISPLAY_LINES:this._displayLinesUpdate();break;case xs.DISPLAY_SPHERES:this._buildSpheresAndSpurs(!0);break;case xs.DISPLAY_SPHERE_AND_SPURS:this._buildSpheresAndSpurs(!1)}this._buildLocalAxes()}set isEnabled(e){this.isEnabled!==e&&(this._isEnabled=e,this.debugMesh&&this.debugMesh.setEnabled(e),e&&!this._obs?this._bindObs():!e&&this._obs&&(this.scene.onBeforeRenderObservable.remove(this._obs),this._obs=null))}get isEnabled(){return this._isEnabled}_getBonePosition(e,t,i,n=0,s=0,r=0){const a=o.jp.Matrix[0],l=t.getParent();if(a.copyFrom(t.getLocalMatrix()),0!==n||0!==s||0!==r){const e=o.jp.Matrix[1];o.y3.IdentityToRef(e),e.setTranslationFromFloats(n,s,r),e.multiplyToRef(a,a)}l&&a.multiplyToRef(l.getAbsoluteTransform(),a),a.multiplyToRef(i,a),e.x=a.m[12],e.y=a.m[13],e.z=a.m[14]}_getLinesForBonesWithLength(e,t){const i=e.length,n=this.mesh.position;let s=0;for(let r=0;r<i;r++){const i=e[r];let a=this._debugLines[s];-1!==i._index&&(this._boneIndices.has(i.getIndex())||this.options.useAllBones)&&(a||(a=[o.P.Zero(),o.P.Zero()],this._debugLines[s]=a),this._getBonePosition(a[0],i,t),this._getBonePosition(a[1],i,t,0,i.length,0),a[0].subtractInPlace(n),a[1].subtractInPlace(n),s++)}}_getLinesForBonesNoLength(e){const t=e.length;let i=0;const n=this.mesh,s=n.position;for(let r=t-1;r>=0;r--){const t=e[r],a=t.getParent();if(!a||!this._boneIndices.has(t.getIndex())&&!this.options.useAllBones)continue;let l=this._debugLines[i];l||(l=[o.P.Zero(),o.P.Zero()],this._debugLines[i]=l),t.getAbsolutePositionToRef(n,l[0]),a.getAbsolutePositionToRef(n,l[1]),l[0].subtractInPlace(s),l[1].subtractInPlace(s),i++}}_revert(e){this.options.pauseAnimations&&(this.scene.animationsEnabled=e,this.utilityLayer.utilityLayerScene.animationsEnabled=e)}_getAbsoluteBindPoseToRef(e,t){null!==e&&-1!==e._index?(this._getAbsoluteBindPoseToRef(e.getParent(),t),e.getBaseMatrix().multiplyToRef(t,t)):t.copyFrom(o.y3.Identity())}_buildSpheresAndSpurs(e=!0){var t,i;this._debugMesh&&(this._debugMesh.dispose(),this._debugMesh=null,this.ready=!1),this._ready=!1;const n=null===(t=this.utilityLayer)||void 0===t?void 0:t.utilityLayerScene,s=this.skeleton.bones,r=[],a=[],l=this.scene.animationsEnabled;try{this.options.pauseAnimations&&(this.scene.animationsEnabled=!1,n.animationsEnabled=!1),this.options.returnToRest&&this.skeleton.returnToRest(),this.autoUpdateBonesMatrices&&this.skeleton.computeAbsoluteTransforms();let t=Number.NEGATIVE_INFINITY;const h=this.options.displayOptions||{};for(let i=0;i<s.length;i++){const l=s[i];if(-1===l._index||!this._boneIndices.has(l.getIndex())&&!this.options.useAllBones)continue;const c=new o.y3;this._getAbsoluteBindPoseToRef(l,c);const u=new o.P;c.decompose(void 0,void 0,u),l.children.forEach((i=>{const s=new o.y3;i.getBaseMatrix().multiplyToRef(c,s);const r=new o.P;s.decompose(void 0,void 0,r);const d=o.P.Distance(u,r);if(d>t&&(t=d),e)return;const p=r.clone().subtract(u.clone()),f=p.length(),_=p.normalize().scale(f),m=h.midStep||.165,g=h.midStepFactor||.215,v=_.scale(m),y=gs("skeletonViewer",{shape:[new o.P(1,-1,0),new o.P(1,1,0),new o.P(-1,1,0),new o.P(-1,-1,0),new o.P(1,-1,0)],path:[o.P.Zero(),v,_],scaleFunction:e=>{switch(e){case 0:case 2:return 0;case 1:return f*g}return 0},sideOrientation:Nt.Kj.DEFAULTSIDE,updatable:!1},n),x=y.getTotalVertices(),b=[],T=[];for(let e=0;e<x;e++)b.push(1,0,0,0),h.spurFollowsChild&&e>9?T.push(i.getIndex(),0,0,0):T.push(l.getIndex(),0,0,0);y.position=u.clone(),y.setVerticesData(qe.o.MatricesWeightsKind,b,!1),y.setVerticesData(qe.o.MatricesIndicesKind,T,!1),y.convertToFlatShadedMesh(),a.push(y)}));const d=Kn("skeletonViewer",{segments:6,diameter:h.sphereBaseSize||.2,updatable:!0},n),p=d.getTotalVertices(),f=[],_=[];for(let e=0;e<p;e++)f.push(1,0,0,0),_.push(l.getIndex(),0,0,0);d.setVerticesData(qe.o.MatricesWeightsKind,f,!1),d.setVerticesData(qe.o.MatricesIndicesKind,_,!1),d.position=u.clone(),r.push([d,l])}const c=h.sphereScaleUnit||2,u=h.sphereFactor||.85,d=[];for(let e=0;e<r.length;e++){const[i,n]=r[e],s=1/(c/t);let o=0,a=n;for(;a.getParent()&&-1!==a.getParent().getIndex();)o++,a=a.getParent();i.scaling.scaleInPlace(s*Math.pow(u,o)),d.push(i)}this.debugMesh=Nt.Kj.MergeMeshes(d.concat(a),!0,!0),this.debugMesh&&(this.debugMesh.renderingGroupId=this.renderingGroupId,this.debugMesh.skeleton=this.skeleton,this.debugMesh.parent=this.mesh,this.debugMesh.computeBonesUsingShaders=null===(i=this.options.computeBonesUsingShaders)||void 0===i||i,this.debugMesh.alwaysSelectAsActiveMesh=!0),this.utilityLayer._getSharedGizmoLight().intensity=.7,this._revert(l),this.ready=!0}catch(e){console.error(e),this._revert(l),this.dispose()}}_buildLocalAxes(){var e;this._localAxes&&this._localAxes.dispose(),this._localAxes=null;const t=this.options.displayOptions||{};if(!t.showLocalAxes)return;const i=this._utilityLayer.utilityLayerScene,n=t.localAxesSize||.075,s=[],r=[],l=new a.HE(1,0,0,1),h=new a.HE(0,1,0,1),c=new a.HE(0,0,1,1),u=[],d=[];for(const e in this.skeleton.bones){const t=this.skeleton.bones[e];if(-1===t._index||!this._boneIndices.has(t.getIndex())&&!this.options.useAllBones)continue;const i=new o.y3,a=new o.P;this._getAbsoluteBindPoseToRef(t,i),i.decompose(void 0,o.jp.Quaternion[0],a);const p=new o.y3;o.jp.Quaternion[0].toRotationMatrix(p);const f=o.P.TransformCoordinates(new o.P(0+n,0,0),p),_=o.P.TransformCoordinates(new o.P(0,0+n,0),p),m=o.P.TransformCoordinates(new o.P(0,0,0+n),p),g=[[a,a.add(f)],[a,a.add(_)],[a,a.add(m)]],v=[[l,l],[h,h],[c,c]];s.push(...g),r.push(...v);for(let e=0;e<6;e++)u.push(1,0,0,0),d.push(t.getIndex(),0,0,0)}this._localAxes=rs("localAxes",{lines:s,colors:r,updatable:!0},i),this._localAxes.setVerticesData(qe.o.MatricesWeightsKind,u,!1),this._localAxes.setVerticesData(qe.o.MatricesIndicesKind,d,!1),this._localAxes.skeleton=this.skeleton,this._localAxes.renderingGroupId=this.renderingGroupId+1,this._localAxes.parent=this.mesh,this._localAxes.computeBonesUsingShaders=null===(e=this.options.computeBonesUsingShaders)||void 0===e||e}_displayLinesUpdate(){if(!this._utilityLayer)return;this.autoUpdateBonesMatrices&&this.skeleton.computeAbsoluteTransforms(),void 0===this.skeleton.bones[0].length?this._getLinesForBonesNoLength(this.skeleton.bones):this._getLinesForBonesWithLength(this.skeleton.bones,this.mesh.getWorldMatrix());const e=this._utilityLayer.utilityLayerScene;e&&(this._debugMesh?rs("",{lines:this._debugLines,updatable:!0,instance:this._debugMesh},e):(this._debugMesh=rs("",{lines:this._debugLines,updatable:!0,instance:null},e),this._debugMesh.renderingGroupId=this.renderingGroupId),this._debugMesh.position.copyFrom(this.mesh.position),this._debugMesh.color=this.color)}changeDisplayMode(e){const t=!!this.isEnabled;this.displayMode!==e&&(this.isEnabled=!1,this._debugMesh&&(this._debugMesh.dispose(),this._debugMesh=null,this.ready=!1),this.displayMode=e,this.update(),this._bindObs(),this.isEnabled=t)}changeDisplayOptions(e,t){const i=!!this.isEnabled;this.options.displayOptions[e]=t,this.isEnabled=!1,this._debugMesh&&(this._debugMesh.dispose(),this._debugMesh=null,this.ready=!1),this.update(),this._bindObs(),this.isEnabled=i}dispose(){this.isEnabled=!1,this._debugMesh&&(this._debugMesh.dispose(),this._debugMesh=null),this._utilityLayer&&(this._utilityLayer.dispose(),this._utilityLayer=null),this.ready=!1}}xs.DISPLAY_LINES=0,xs.DISPLAY_SPHERES=1,xs.DISPLAY_SPHERE_AND_SPURS=2;class bs{get transparency(){return this._transparency}set transparency(e){this._transparency=e;for(let t=6;t<12;++t)this._lightHelperFrustumMeshes[t].material.alpha=e}get showLines(){return this._showLines}set showLines(e){if(this._showLines!==e){this._showLines=e;for(let t=0;t<6;++t)this._lightHelperFrustumMeshes[t].setEnabled(e)}}get showPlanes(){return this._showPlanes}set showPlanes(e){if(this._showPlanes!==e){this._showPlanes=e;for(let t=6;t<12;++t)this._lightHelperFrustumMeshes[t].setEnabled(e)}}constructor(e,t){this._oldPosition=new o.P(Number.NaN,Number.NaN,Number.NaN),this._oldDirection=new o.P(Number.NaN,Number.NaN,Number.NaN),this._transparency=.3,this._showLines=!0,this._showPlanes=!0,this._scene=e.getScene(),this._light=e,this._camera=t,this._inverseViewMatrix=o.y3.Identity(),this._lightHelperFrustumMeshes=[],this._createGeometry(),this.show(),this.update()}show(){this._lightHelperFrustumMeshes.forEach(((e,t)=>{e.setEnabled(t<6&&this._showLines||t>=6&&this._showPlanes)})),this._oldPosition.set(Number.NaN,Number.NaN,Number.NaN),this._visible=!0}hide(){this._lightHelperFrustumMeshes.forEach((e=>{e.setEnabled(!1)})),this._visible=!1}update(){var e,t,i,n,s,r;if(!this._visible)return;if(this._oldPosition.equals(this._light.position)&&this._oldDirection.equals(this._light.direction)&&this._oldAutoCalc===this._light.autoCalcShadowZBounds&&this._oldMinZ===this._light.shadowMinZ&&this._oldMaxZ===this._light.shadowMaxZ)return;this._oldPosition.copyFrom(this._light.position),this._oldDirection.copyFrom(this._light.direction),this._oldAutoCalc=this._light.autoCalcShadowZBounds,this._oldMinZ=this._light.shadowMinZ,this._oldMaxZ=this._light.shadowMaxZ,o.jp.Vector3[0].set(this._light.orthoLeft,this._light.orthoBottom,void 0!==this._light.shadowMinZ?this._light.shadowMinZ:this._camera.minZ),o.jp.Vector3[1].set(this._light.orthoRight,this._light.orthoTop,void 0!==this._light.shadowMaxZ?this._light.shadowMaxZ:this._camera.maxZ);const a=this._getInvertViewMatrix();o.jp.Vector3[2].copyFromFloats(o.jp.Vector3[1].x,o.jp.Vector3[1].y,o.jp.Vector3[0].z),o.jp.Vector3[3].copyFromFloats(o.jp.Vector3[1].x,o.jp.Vector3[0].y,o.jp.Vector3[0].z),o.jp.Vector3[4].copyFromFloats(o.jp.Vector3[0].x,o.jp.Vector3[0].y,o.jp.Vector3[0].z),o.jp.Vector3[5].copyFromFloats(o.jp.Vector3[0].x,o.jp.Vector3[1].y,o.jp.Vector3[0].z),o.P.TransformCoordinatesToRef(o.jp.Vector3[2],a,o.jp.Vector3[2]),o.P.TransformCoordinatesToRef(o.jp.Vector3[3],a,o.jp.Vector3[3]),o.P.TransformCoordinatesToRef(o.jp.Vector3[4],a,o.jp.Vector3[4]),o.P.TransformCoordinatesToRef(o.jp.Vector3[5],a,o.jp.Vector3[5]),o.jp.Vector3[6].copyFromFloats(o.jp.Vector3[1].x,o.jp.Vector3[1].y,o.jp.Vector3[1].z),o.jp.Vector3[7].copyFromFloats(o.jp.Vector3[1].x,o.jp.Vector3[0].y,o.jp.Vector3[1].z),o.jp.Vector3[8].copyFromFloats(o.jp.Vector3[0].x,o.jp.Vector3[0].y,o.jp.Vector3[1].z),o.jp.Vector3[9].copyFromFloats(o.jp.Vector3[0].x,o.jp.Vector3[1].y,o.jp.Vector3[1].z),o.P.TransformCoordinatesToRef(o.jp.Vector3[6],a,o.jp.Vector3[6]),o.P.TransformCoordinatesToRef(o.jp.Vector3[7],a,o.jp.Vector3[7]),o.P.TransformCoordinatesToRef(o.jp.Vector3[8],a,o.jp.Vector3[8]),o.P.TransformCoordinatesToRef(o.jp.Vector3[9],a,o.jp.Vector3[9]),os("nearlines",{updatable:!0,points:this._nearLinesPoints,instance:this._lightHelperFrustumMeshes[0]},this._scene),os("farlines",{updatable:!0,points:this._farLinesPoints,instance:this._lightHelperFrustumMeshes[1]},this._scene),os("trlines",{updatable:!0,points:this._trLinesPoints,instance:this._lightHelperFrustumMeshes[2]},this._scene),os("brlines",{updatable:!0,points:this._brLinesPoints,instance:this._lightHelperFrustumMeshes[3]},this._scene),os("tllines",{updatable:!0,points:this._tlLinesPoints,instance:this._lightHelperFrustumMeshes[4]},this._scene),os("bllines",{updatable:!0,points:this._blLinesPoints,instance:this._lightHelperFrustumMeshes[5]},this._scene),o.jp.Vector3[2].toArray(this._nearPlaneVertices,0),o.jp.Vector3[3].toArray(this._nearPlaneVertices,3),o.jp.Vector3[4].toArray(this._nearPlaneVertices,6),o.jp.Vector3[5].toArray(this._nearPlaneVertices,9),null===(e=this._lightHelperFrustumMeshes[6].geometry)||void 0===e||e.updateVerticesDataDirectly("position",this._nearPlaneVertices,0),o.jp.Vector3[6].toArray(this._farPlaneVertices,0),o.jp.Vector3[7].toArray(this._farPlaneVertices,3),o.jp.Vector3[8].toArray(this._farPlaneVertices,6),o.jp.Vector3[9].toArray(this._farPlaneVertices,9),null===(t=this._lightHelperFrustumMeshes[7].geometry)||void 0===t||t.updateVerticesDataDirectly("position",this._farPlaneVertices,0),o.jp.Vector3[2].toArray(this._rightPlaneVertices,0),o.jp.Vector3[6].toArray(this._rightPlaneVertices,3),o.jp.Vector3[7].toArray(this._rightPlaneVertices,6),o.jp.Vector3[3].toArray(this._rightPlaneVertices,9),null===(i=this._lightHelperFrustumMeshes[8].geometry)||void 0===i||i.updateVerticesDataDirectly("position",this._rightPlaneVertices,0),o.jp.Vector3[5].toArray(this._leftPlaneVertices,0),o.jp.Vector3[9].toArray(this._leftPlaneVertices,3),o.jp.Vector3[8].toArray(this._leftPlaneVertices,6),o.jp.Vector3[4].toArray(this._leftPlaneVertices,9),null===(n=this._lightHelperFrustumMeshes[9].geometry)||void 0===n||n.updateVerticesDataDirectly("position",this._leftPlaneVertices,0),o.jp.Vector3[2].toArray(this._topPlaneVertices,0),o.jp.Vector3[6].toArray(this._topPlaneVertices,3),o.jp.Vector3[9].toArray(this._topPlaneVertices,6),o.jp.Vector3[5].toArray(this._topPlaneVertices,9),null===(s=this._lightHelperFrustumMeshes[10].geometry)||void 0===s||s.updateVerticesDataDirectly("position",this._topPlaneVertices,0),o.jp.Vector3[3].toArray(this._bottomPlaneVertices,0),o.jp.Vector3[7].toArray(this._bottomPlaneVertices,3),o.jp.Vector3[8].toArray(this._bottomPlaneVertices,6),o.jp.Vector3[4].toArray(this._bottomPlaneVertices,9),null===(r=this._lightHelperFrustumMeshes[11].geometry)||void 0===r||r.updateVerticesDataDirectly("position",this._bottomPlaneVertices,0)}dispose(){this._lightHelperFrustumMeshes.forEach((e=>{var t;null===(t=e.material)||void 0===t||t.dispose(),e.dispose()})),this._rootNode.dispose()}_createGeometry(){this._rootNode=new yi.Y("directionalLightHelperRoot_"+this._light.name,this._scene),this._rootNode.parent=this._light.parent,this._nearLinesPoints=[o.P.ZeroReadOnly,o.P.ZeroReadOnly,o.P.ZeroReadOnly,o.P.ZeroReadOnly,o.P.ZeroReadOnly];const e=os("nearlines",{updatable:!0,points:this._nearLinesPoints},this._scene);e.parent=this._rootNode,e.alwaysSelectAsActiveMesh=!0,this._farLinesPoints=[o.P.ZeroReadOnly,o.P.ZeroReadOnly,o.P.ZeroReadOnly,o.P.ZeroReadOnly,o.P.ZeroReadOnly];const t=os("farlines",{updatable:!0,points:this._farLinesPoints},this._scene);t.parent=this._rootNode,t.alwaysSelectAsActiveMesh=!0,this._trLinesPoints=[o.P.ZeroReadOnly,o.P.ZeroReadOnly];const i=os("trlines",{updatable:!0,points:this._trLinesPoints},this._scene);i.parent=this._rootNode,i.alwaysSelectAsActiveMesh=!0,this._brLinesPoints=[o.P.ZeroReadOnly,o.P.ZeroReadOnly];const n=os("brlines",{updatable:!0,points:this._brLinesPoints},this._scene);n.parent=this._rootNode,n.alwaysSelectAsActiveMesh=!0,this._tlLinesPoints=[o.P.ZeroReadOnly,o.P.ZeroReadOnly];const s=os("tllines",{updatable:!0,points:this._tlLinesPoints},this._scene);s.parent=this._rootNode,s.alwaysSelectAsActiveMesh=!0,this._blLinesPoints=[o.P.ZeroReadOnly,o.P.ZeroReadOnly];const r=os("bllines",{updatable:!0,points:this._blLinesPoints},this._scene);r.parent=this._rootNode,r.alwaysSelectAsActiveMesh=!0,this._lightHelperFrustumMeshes.push(e,t,i,n,s,r);const l=(e,t,i)=>{const n=new Nt.Kj(e+"plane",this._scene),s=new Gi.K(e+"PlaneMat",this._scene);n.material=s,n.parent=this._rootNode,n.alwaysSelectAsActiveMesh=!0,s.emissiveColor=t,s.alpha=this.transparency,s.backFaceCulling=!1,s.disableLighting=!0;const r=new sn.x;r.positions=i,r.indices=[0,1,2,0,2,3],r.applyToMesh(n,!0),this._lightHelperFrustumMeshes.push(n)};this._nearPlaneVertices=[0,0,0,0,0,0,0,0,0,0,0,0],this._farPlaneVertices=[0,0,0,0,0,0,0,0,0,0,0,0],this._rightPlaneVertices=[0,0,0,0,0,0,0,0,0,0,0,0],this._leftPlaneVertices=[0,0,0,0,0,0,0,0,0,0,0,0],this._topPlaneVertices=[0,0,0,0,0,0,0,0,0,0,0,0],this._bottomPlaneVertices=[0,0,0,0,0,0,0,0,0,0,0,0],l("near",new a.Wo(1,0,0),this._nearPlaneVertices),l("far",new a.Wo(.3,0,0),this._farPlaneVertices),l("right",new a.Wo(0,1,0),this._rightPlaneVertices),l("left",new a.Wo(0,.3,0),this._leftPlaneVertices),l("top",new a.Wo(0,0,1),this._topPlaneVertices),l("bottom",new a.Wo(0,0,.3),this._bottomPlaneVertices),this._nearLinesPoints[0]=o.jp.Vector3[2],this._nearLinesPoints[1]=o.jp.Vector3[3],this._nearLinesPoints[2]=o.jp.Vector3[4],this._nearLinesPoints[3]=o.jp.Vector3[5],this._nearLinesPoints[4]=o.jp.Vector3[2],this._farLinesPoints[0]=o.jp.Vector3[6],this._farLinesPoints[1]=o.jp.Vector3[7],this._farLinesPoints[2]=o.jp.Vector3[8],this._farLinesPoints[3]=o.jp.Vector3[9],this._farLinesPoints[4]=o.jp.Vector3[6],this._trLinesPoints[0]=o.jp.Vector3[2],this._trLinesPoints[1]=o.jp.Vector3[6],this._brLinesPoints[0]=o.jp.Vector3[3],this._brLinesPoints[1]=o.jp.Vector3[7],this._tlLinesPoints[0]=o.jp.Vector3[4],this._tlLinesPoints[1]=o.jp.Vector3[8],this._blLinesPoints[0]=o.jp.Vector3[5],this._blLinesPoints[1]=o.jp.Vector3[9]}_getInvertViewMatrix(){return o.y3.LookAtLHToRef(this._light.position,this._light.position.add(this._light.direction),o.P.UpReadOnly,this._inverseViewMatrix),this._inverseViewMatrix.invertToRef(this._inverseViewMatrix),this._inverseViewMatrix}}var Ts=i(3255),Ss=i(7967),Es=i(3739),Cs=i(7458),As=i(771),Ps=i(1345),Rs=i(7374);class Ms{constructor(){this.renderWidth=512,this.renderHeight=256,this.textureSize=512,this.deterministicLockstep=!1,this.lockstepMaxSteps=4}}class Is extends ue.D{isDeterministicLockStep(){return this._options.deterministicLockstep}getLockstepMaxSteps(){return this._options.lockstepMaxSteps}getHardwareScalingLevel(){return 1}constructor(e=new Ms){super(null),ue.D.Instances.push(this),void 0===e.deterministicLockstep&&(e.deterministicLockstep=!1),void 0===e.lockstepMaxSteps&&(e.lockstepMaxSteps=4),this._options=e,As.Z.SetMatrixPrecision(!!e.useHighPrecisionMatrix),this._caps={maxTexturesImageUnits:16,maxVertexTextureImageUnits:16,maxCombinedTexturesImageUnits:32,maxTextureSize:512,maxCubemapTextureSize:512,maxRenderTextureSize:512,maxVertexAttribs:16,maxVaryingVectors:16,maxFragmentUniformVectors:16,maxVertexUniformVectors:16,standardDerivatives:!1,astc:null,pvrtc:null,etc1:null,etc2:null,bptc:null,maxAnisotropy:0,uintIndices:!1,fragmentDepthSupported:!1,highPrecisionShaderSupported:!0,colorBufferFloat:!1,textureFloat:!1,textureFloatLinearFiltering:!1,textureFloatRender:!1,textureHalfFloat:!1,textureHalfFloatLinearFiltering:!1,textureHalfFloatRender:!1,textureLOD:!1,texelFetch:!1,drawBuffersExtension:!1,depthTextureExtension:!1,vertexArrayObject:!1,instancedArrays:!1,supportOcclusionQuery:!1,canUseTimestampForTimerQuery:!1,maxMSAASamples:1,blendMinMax:!1,canUseGLInstanceID:!1,canUseGLVertexID:!1,supportComputeShaders:!1,supportSRGBBuffers:!1,supportTransformFeedbacks:!1,textureMaxLevel:!1,texture2DArrayMaxLayerCount:128,disableMorphTargetTexture:!1},this._features={forceBitmapOverHTMLImageElement:!1,supportRenderAndCopyToLodForFloatTextures:!1,supportDepthStencilTexture:!1,supportShadowSamplers:!1,uniformBufferHardCheckMatrix:!1,allowTexturePrefiltering:!1,trackUbosInFrame:!1,checkUbosContentBeforeUpload:!1,supportCSM:!1,basisNeedsPOT:!1,support3DTextures:!1,needTypeSuffixInShaderConstants:!1,supportMSAA:!1,supportSSAO2:!1,supportExtendedTextureFormats:!1,supportSwitchCaseInShader:!1,supportSyncTextureRead:!1,needsInvertingBitmap:!1,useUBOBindingCache:!1,needShaderCodeInlining:!1,needToAlwaysBindUniformBuffers:!1,supportRenderPasses:!0,supportSpriteInstancing:!1,_collectUbosUpdatedInFrame:!1},_.Y.Log(`Babylon.js v${ue.D.Version} - Null engine`);const t="undefined"!=typeof self?self:"undefined"!=typeof global?global:window;"undefined"==typeof URL&&(t.URL={createObjectURL:function(){},revokeObjectURL:function(){}}),"undefined"==typeof Blob&&(t.Blob=function(){})}createVertexBuffer(e){const t=new Ke.h;return t.references=1,t}createIndexBuffer(e){const t=new Ke.h;return t.references=1,t}clear(e,t,i,n=!1){}getRenderWidth(e=!1){return!e&&this._currentRenderTarget?this._currentRenderTarget.width:this._options.renderWidth}getRenderHeight(e=!1){return!e&&this._currentRenderTarget?this._currentRenderTarget.height:this._options.renderHeight}setViewport(e,t,i){this._cachedViewport=e}createShaderProgram(e,t,i,n,s){return{__SPECTOR_rebuildProgram:null}}getUniforms(e,t){return[]}getAttributes(e,t){return[]}bindSamplers(e){this._currentEffect=null}enableEffect(e){e=null!==e&&Ps.q.IsWrapper(e)?e.effect:e,this._currentEffect=e,e&&(e.onBind&&e.onBind(e),e._onBindObservable&&e._onBindObservable.notifyObservers(e))}setState(e,t=0,i,n=!1,s,r,o=0){}setIntArray(e,t){return!0}setIntArray2(e,t){return!0}setIntArray3(e,t){return!0}setIntArray4(e,t){return!0}setFloatArray(e,t){return!0}setFloatArray2(e,t){return!0}setFloatArray3(e,t){return!0}setFloatArray4(e,t){return!0}setArray(e,t){return!0}setArray2(e,t){return!0}setArray3(e,t){return!0}setArray4(e,t){return!0}setMatrices(e,t){return!0}setMatrix3x3(e,t){return!0}setMatrix2x2(e,t){return!0}setFloat(e,t){return!0}setFloat2(e,t,i){return!0}setFloat3(e,t,i,n){return!0}setBool(e,t){return!0}setFloat4(e,t,i,n,s){return!0}setAlphaMode(e,t=!1){this._alphaMode!==e&&(this.alphaState.alphaBlend=0!==e,t||this.setDepthWrite(0===e),this._alphaMode=e)}bindBuffers(e,t,i){}wipeCaches(e){this.preventCacheWipeBetweenFrames||(this.resetTextureCache(),this._currentEffect=null,e&&(this._currentProgram=null,this._stencilStateComposer.reset(),this.depthCullingState.reset(),this.alphaState.reset()),this._cachedVertexBuffers=null,this._cachedIndexBuffer=null,this._cachedEffectForVertexBuffers=null)}draw(e,t,i,n){}drawElementsType(e,t,i,n){}drawArraysType(e,t,i,n){}_createTexture(){return{}}_releaseTexture(e){}createTexture(e,t,i,n,s=3,r=null,o=null,a=null,l=null,h=null,c=null,u){const d=new Ei.l(this,Ei.S.Url),p=String(e);return d.url=p,d.generateMipMaps=!t,d.samplingMode=s,d.invertY=i,d.baseWidth=this._options.textureSize,d.baseHeight=this._options.textureSize,d.width=this._options.textureSize,d.height=this._options.textureSize,h&&(d.format=h),d.isReady=!0,r&&setTimeout((()=>{r(d)})),this._internalTexturesCache.push(d),d}_createHardwareRenderTargetWrapper(e,t,i){const n=new Rs.r(e,t,i,this);return this._renderTargetWrapperCache.push(n),n}createRenderTargetTexture(e,t){const i=this._createHardwareRenderTargetWrapper(!1,!1,e),n={};void 0!==t&&"object"==typeof t?(n.generateMipMaps=t.generateMipMaps,n.generateDepthBuffer=void 0===t.generateDepthBuffer||t.generateDepthBuffer,n.generateStencilBuffer=n.generateDepthBuffer&&t.generateStencilBuffer,n.type=void 0===t.type?0:t.type,n.samplingMode=void 0===t.samplingMode?3:t.samplingMode):(n.generateMipMaps=t,n.generateDepthBuffer=!0,n.generateStencilBuffer=!1,n.type=0,n.samplingMode=3);const s=new Ei.l(this,Ei.S.RenderTarget),r=e.width||e,o=e.height||e;return i._generateDepthBuffer=n.generateDepthBuffer,i._generateStencilBuffer=!!n.generateStencilBuffer,s.baseWidth=r,s.baseHeight=o,s.width=r,s.height=o,s.isReady=!0,s.samples=1,s.generateMipMaps=!!n.generateMipMaps,s.samplingMode=n.samplingMode,s.type=n.type,this._internalTexturesCache.push(s),i}createRenderTargetCubeTexture(e,t){const i=this._createHardwareRenderTargetWrapper(!1,!0,e),n={generateMipMaps:!0,generateDepthBuffer:!0,generateStencilBuffer:!1,type:0,samplingMode:3,format:5,...t};n.generateStencilBuffer=n.generateDepthBuffer&&n.generateStencilBuffer,(1!==n.type||this._caps.textureFloatLinearFiltering)&&(2!==n.type||this._caps.textureHalfFloatLinearFiltering)||(n.samplingMode=1),i._generateDepthBuffer=n.generateDepthBuffer,i._generateStencilBuffer=!!n.generateStencilBuffer;const s=new Ei.l(this,Ei.S.RenderTarget);return s.baseWidth=e,s.baseHeight=e,s.width=e,s.height=e,s.isReady=!0,s.isCube=!0,s.samples=1,s.generateMipMaps=!!n.generateMipMaps,s.samplingMode=n.samplingMode,s.type=n.type,this._internalTexturesCache.push(s),i}updateTextureSamplingMode(e,t){t.samplingMode=e}createRawTexture(e,t,i,n,s,r,o,a=null,l=0,h=0,c=!1){const u=new Ei.l(this,Ei.S.Raw);return u.baseWidth=t,u.baseHeight=i,u.width=t,u.height=i,u.format=n,u.generateMipMaps=s,u.samplingMode=o,u.invertY=r,u._compression=a,u.type=l,u._useSRGBBuffer=c,this._doNotHandleContextLost||(u._bufferView=e),u}updateRawTexture(e,t,i,n,s=null,r=0,o=!1){e&&(e._bufferView=t,e.format=i,e.invertY=n,e._compression=s,e.type=r,e._useSRGBBuffer=o)}bindFramebuffer(e,t,i,n,s){this._currentRenderTarget&&this.unBindFramebuffer(this._currentRenderTarget),this._currentRenderTarget=e,this._currentFramebuffer=null,this._cachedViewport&&!s&&this.setViewport(this._cachedViewport,i,n)}unBindFramebuffer(e,t=!1,i){this._currentRenderTarget=null,i&&i(),this._currentFramebuffer=null}createDynamicVertexBuffer(e){const t=new Ke.h;return t.references=1,t.capacity=1,t}updateDynamicTexture(e,t,i,n=!1,s){}areAllEffectsReady(){return!0}getError(){return 0}_getUnpackAlignement(){return 1}_unpackFlipY(e){}updateDynamicIndexBuffer(e,t,i=0){}updateDynamicVertexBuffer(e,t,i,n){}_bindTextureDirectly(e,t){return this._boundTexturesCache[this._activeChannel]!==t&&(this._boundTexturesCache[this._activeChannel]=t,!0)}_bindTexture(e,t){e<0||this._bindTextureDirectly(0,t)}_deleteBuffer(e){}releaseEffects(){}displayLoadingUI(){}hideLoadingUI(){}set loadingUIText(e){}_uploadCompressedDataToTextureDirectly(e,t,i,n,s,r=0,o=0){}_uploadDataToTextureDirectly(e,t,i=0,n=0){}_uploadArrayBufferViewToTexture(e,t,i=0,n=0){}_uploadImageToTexture(e,t,i=0,n=0){}}i(9347),Rn.B.prototype._debugPushGroup=function(e,t){},Rn.B.prototype._debugPopGroup=function(e){},Rn.B.prototype._debugInsertMarker=function(e,t){},Rn.B.prototype._debugFlushPendingCommands=function(){};class Ds{constructor(){this._timeElapsedQueryEnded=!1}}var Os=i(8215);class ws{constructor(){this.occlusionInternalRetryCounter=0,this.isOcclusionQueryInProgress=!1,this.isOccluded=!1,this.occlusionRetryCount=-1,this.occlusionType=Un.x.OCCLUSION_TYPE_NONE,this.occlusionQueryAlgorithmType=Un.x.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE,this.forceRenderingWhenOccluded=!1}}ue.D.prototype.createQuery=function(){const e=this._gl.createQuery();if(!e)throw new Error("Unable to create Occlusion Query");return e},ue.D.prototype.deleteQuery=function(e){return this._gl.deleteQuery(e),this},ue.D.prototype.isQueryResultAvailable=function(e){return this._gl.getQueryParameter(e,this._gl.QUERY_RESULT_AVAILABLE)},ue.D.prototype.getQueryResult=function(e){return this._gl.getQueryParameter(e,this._gl.QUERY_RESULT)},ue.D.prototype.beginOcclusionQuery=function(e,t){const i=this._getGlAlgorithmType(e);return this._gl.beginQuery(i,t),!0},ue.D.prototype.endOcclusionQuery=function(e){const t=this._getGlAlgorithmType(e);return this._gl.endQuery(t),this},ue.D.prototype._createTimeQuery=function(){const e=this.getCaps().timerQuery;return e.createQueryEXT?e.createQueryEXT():this.createQuery()},ue.D.prototype._deleteTimeQuery=function(e){const t=this.getCaps().timerQuery;t.deleteQueryEXT?t.deleteQueryEXT(e):this.deleteQuery(e)},ue.D.prototype._getTimeQueryResult=function(e){const t=this.getCaps().timerQuery;return t.getQueryObjectEXT?t.getQueryObjectEXT(e,t.QUERY_RESULT_EXT):this.getQueryResult(e)},ue.D.prototype._getTimeQueryAvailability=function(e){const t=this.getCaps().timerQuery;return t.getQueryObjectEXT?t.getQueryObjectEXT(e,t.QUERY_RESULT_AVAILABLE_EXT):this.isQueryResultAvailable(e)},ue.D.prototype.startTimeQuery=function(){const e=this.getCaps(),t=e.timerQuery;if(!t)return null;const i=new Ds;if(this._gl.getParameter(t.GPU_DISJOINT_EXT),e.canUseTimestampForTimerQuery)i._startTimeQuery=this._createTimeQuery(),t.queryCounterEXT(i._startTimeQuery,t.TIMESTAMP_EXT);else{if(this._currentNonTimestampToken)return this._currentNonTimestampToken;i._timeElapsedQuery=this._createTimeQuery(),t.beginQueryEXT?t.beginQueryEXT(t.TIME_ELAPSED_EXT,i._timeElapsedQuery):this._gl.beginQuery(t.TIME_ELAPSED_EXT,i._timeElapsedQuery),this._currentNonTimestampToken=i}return i},ue.D.prototype.endTimeQuery=function(e){const t=this.getCaps(),i=t.timerQuery;if(!i||!e)return-1;if(t.canUseTimestampForTimerQuery){if(!e._startTimeQuery)return-1;e._endTimeQuery||(e._endTimeQuery=this._createTimeQuery(),i.queryCounterEXT(e._endTimeQuery,i.TIMESTAMP_EXT))}else if(!e._timeElapsedQueryEnded){if(!e._timeElapsedQuery)return-1;i.endQueryEXT?i.endQueryEXT(i.TIME_ELAPSED_EXT):(this._gl.endQuery(i.TIME_ELAPSED_EXT),this._currentNonTimestampToken=null),e._timeElapsedQueryEnded=!0}const n=this._gl.getParameter(i.GPU_DISJOINT_EXT);let s=!1;if(e._endTimeQuery?s=this._getTimeQueryAvailability(e._endTimeQuery):e._timeElapsedQuery&&(s=this._getTimeQueryAvailability(e._timeElapsedQuery)),s&&!n){let i=0;if(t.canUseTimestampForTimerQuery){if(!e._startTimeQuery||!e._endTimeQuery)return-1;const t=this._getTimeQueryResult(e._startTimeQuery);i=this._getTimeQueryResult(e._endTimeQuery)-t,this._deleteTimeQuery(e._startTimeQuery),this._deleteTimeQuery(e._endTimeQuery),e._startTimeQuery=null,e._endTimeQuery=null}else{if(!e._timeElapsedQuery)return-1;i=this._getTimeQueryResult(e._timeElapsedQuery),this._deleteTimeQuery(e._timeElapsedQuery),e._timeElapsedQuery=null,e._timeElapsedQueryEnded=!1}return i}return-1},ue.D.prototype._captureGPUFrameTime=!1,ue.D.prototype._gpuFrameTime=new Os.z,ue.D.prototype.getGPUFrameTimeCounter=function(){return this._gpuFrameTime},ue.D.prototype.captureGPUFrameTime=function(e){e!==this._captureGPUFrameTime&&(this._captureGPUFrameTime=e,e?(this._onBeginFrameObserver=this.onBeginFrameObservable.add((()=>{this._gpuFrameTimeToken||(this._gpuFrameTimeToken=this.startTimeQuery())})),this._onEndFrameObserver=this.onEndFrameObservable.add((()=>{if(!this._gpuFrameTimeToken)return;const e=this.endTimeQuery(this._gpuFrameTimeToken);e>-1&&(this._gpuFrameTimeToken=null,this._gpuFrameTime.fetchNewFrame(),this._gpuFrameTime.addCount(e,!0))}))):(this.onBeginFrameObservable.remove(this._onBeginFrameObserver),this._onBeginFrameObserver=null,this.onEndFrameObservable.remove(this._onEndFrameObserver),this._onEndFrameObserver=null))},ue.D.prototype._getGlAlgorithmType=function(e){return e===Un.x.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE?this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE:this._gl.ANY_SAMPLES_PASSED},Object.defineProperty(Un.x.prototype,"isOcclusionQueryInProgress",{get:function(){return this._occlusionDataStorage.isOcclusionQueryInProgress},set:function(e){this._occlusionDataStorage.isOcclusionQueryInProgress=e},enumerable:!1,configurable:!0}),Object.defineProperty(Un.x.prototype,"_occlusionDataStorage",{get:function(){return this.__occlusionDataStorage||(this.__occlusionDataStorage=new ws),this.__occlusionDataStorage},enumerable:!1,configurable:!0}),Object.defineProperty(Un.x.prototype,"isOccluded",{get:function(){return this._occlusionDataStorage.isOccluded},set:function(e){this._occlusionDataStorage.isOccluded=e},enumerable:!0,configurable:!0}),Object.defineProperty(Un.x.prototype,"occlusionQueryAlgorithmType",{get:function(){return this._occlusionDataStorage.occlusionQueryAlgorithmType},set:function(e){this._occlusionDataStorage.occlusionQueryAlgorithmType=e},enumerable:!0,configurable:!0}),Object.defineProperty(Un.x.prototype,"occlusionType",{get:function(){return this._occlusionDataStorage.occlusionType},set:function(e){this._occlusionDataStorage.occlusionType=e},enumerable:!0,configurable:!0}),Object.defineProperty(Un.x.prototype,"occlusionRetryCount",{get:function(){return this._occlusionDataStorage.occlusionRetryCount},set:function(e){this._occlusionDataStorage.occlusionRetryCount=e},enumerable:!0,configurable:!0}),Object.defineProperty(Un.x.prototype,"forceRenderingWhenOccluded",{get:function(){return this._occlusionDataStorage.forceRenderingWhenOccluded},set:function(e){this._occlusionDataStorage.forceRenderingWhenOccluded=e},enumerable:!0,configurable:!0}),Un.x.prototype._checkOcclusionQuery=function(){const e=this._occlusionDataStorage;if(e.occlusionType===Un.x.OCCLUSION_TYPE_NONE)return e.isOccluded=!1,!1;const t=this.getEngine();if(!t.getCaps().supportOcclusionQuery)return e.isOccluded=!1,!1;if(!t.isQueryResultAvailable)return e.isOccluded=!1,!1;if(this.isOcclusionQueryInProgress&&this._occlusionQuery)if(t.isQueryResultAvailable(this._occlusionQuery)){const i=t.getQueryResult(this._occlusionQuery);e.isOcclusionQueryInProgress=!1,e.occlusionInternalRetryCounter=0,e.isOccluded=!(i>0)}else{if(e.occlusionInternalRetryCounter++,!(-1!==e.occlusionRetryCount&&e.occlusionInternalRetryCounter>e.occlusionRetryCount))return e.occlusionType!==Un.x.OCCLUSION_TYPE_OPTIMISTIC&&e.isOccluded;e.isOcclusionQueryInProgress=!1,e.occlusionInternalRetryCounter=0,e.isOccluded=e.occlusionType!==Un.x.OCCLUSION_TYPE_OPTIMISTIC&&e.isOccluded}const i=this.getScene();if(i.getBoundingBoxRenderer){const n=i.getBoundingBoxRenderer();null===this._occlusionQuery&&(this._occlusionQuery=t.createQuery()),t.beginOcclusionQuery(e.occlusionQueryAlgorithmType,this._occlusionQuery)&&(n.renderOcclusionBoundingBox(this),t.endOcclusionQuery(e.occlusionQueryAlgorithmType),this._occlusionDataStorage.isOcclusionQueryInProgress=!0)}return e.isOccluded};var Ns=!0;ue.D.prototype.createTransformFeedback=function(){const e=this._gl.createTransformFeedback();if(!e)throw new Error("Unable to create Transform Feedback");return e},ue.D.prototype.deleteTransformFeedback=function(e){this._gl.deleteTransformFeedback(e)},ue.D.prototype.bindTransformFeedback=function(e){this._gl.bindTransformFeedback(this._gl.TRANSFORM_FEEDBACK,e)},ue.D.prototype.beginTransformFeedback=function(e=!0){this._gl.beginTransformFeedback(e?this._gl.POINTS:this._gl.TRIANGLES)},ue.D.prototype.endTransformFeedback=function(){this._gl.endTransformFeedback()},ue.D.prototype.setTranformFeedbackVaryings=function(e,t){this._gl.transformFeedbackVaryings(e,t,this._gl.INTERLEAVED_ATTRIBS)},ue.D.prototype.bindTransformFeedbackBuffer=function(e){this._gl.bindBufferBase(this._gl.TRANSFORM_FEEDBACK_BUFFER,0,e?e.underlyingResource:null)},i(6599),i(6914),Rn.B.prototype.createExternalTexture=function(e){return null},Rn.B.prototype.setExternalTexture=function(e,t){throw new Error("setExternalTexture: This engine does not support external textures!")},Rn.B.prototype.updateVideoTexture=function(e,t,i){if(!e||e._isDisabled)return;const n=this._getInternalFormat(e.format),s=this._getRGBABufferInternalSizedFormat(0,e.format),r=this._bindTextureDirectly(this._gl.TEXTURE_2D,e,!0);this._unpackFlipY(!i);try{if(void 0===this._videoTextureSupported&&(this._gl.getError(),this._gl.texImage2D(this._gl.TEXTURE_2D,0,s,n,this._gl.UNSIGNED_BYTE,t),0!==this._gl.getError()?this._videoTextureSupported=!1:this._videoTextureSupported=!0),this._videoTextureSupported)this._gl.texImage2D(this._gl.TEXTURE_2D,0,s,n,this._gl.UNSIGNED_BYTE,t);else{if(!e._workingCanvas){e._workingCanvas=this.createCanvas(e.width,e.height);const t=e._workingCanvas.getContext("2d");if(!t)throw new Error("Unable to get 2d context");e._workingContext=t,e._workingCanvas.width=e.width,e._workingCanvas.height=e.height}e._workingContext.clearRect(0,0,e.width,e.height),e._workingContext.drawImage(t,0,0,t.videoWidth,t.videoHeight,0,0,e.width,e.height),this._gl.texImage2D(this._gl.TEXTURE_2D,0,s,n,this._gl.UNSIGNED_BYTE,e._workingCanvas)}e.generateMipMaps&&this._gl.generateMipmap(this._gl.TEXTURE_2D),r||this._bindTextureDirectly(this._gl.TEXTURE_2D,null),e.isReady=!0}catch(t){e._isDisabled=!0}},Rn.B.prototype.restoreSingleAttachment=function(){const e=this._gl;this.bindAttachments([e.BACK])},Rn.B.prototype.restoreSingleAttachmentForRenderTarget=function(){const e=this._gl;this.bindAttachments([e.COLOR_ATTACHMENT0])},Rn.B.prototype.buildTextureLayout=function(e){const t=this._gl,i=[];for(let n=0;n<e.length;n++)e[n]?i.push(t["COLOR_ATTACHMENT"+n]):i.push(t.NONE);return i},Rn.B.prototype.bindAttachments=function(e){this._gl.drawBuffers(e)},Rn.B.prototype.unBindMultiColorAttachmentFramebuffer=function(e,t=!1,i){this._currentRenderTarget=null;const n=this._gl,s=e._attachments,r=s.length;if(e._MSAAFramebuffer){n.bindFramebuffer(n.READ_FRAMEBUFFER,e._MSAAFramebuffer),n.bindFramebuffer(n.DRAW_FRAMEBUFFER,e._framebuffer);for(let t=0;t<r;t++){const i=e.textures[t];for(let e=0;e<r;e++)s[e]=n.NONE;s[t]=n[this.webGLVersion>1?"COLOR_ATTACHMENT"+t:"COLOR_ATTACHMENT"+t+"_WEBGL"],n.readBuffer(s[t]),n.drawBuffers(s),n.blitFramebuffer(0,0,i.width,i.height,0,0,i.width,i.height,n.COLOR_BUFFER_BIT,n.NEAREST)}for(let e=0;e<r;e++)s[e]=n[this.webGLVersion>1?"COLOR_ATTACHMENT"+e:"COLOR_ATTACHMENT"+e+"_WEBGL"];n.drawBuffers(s)}for(let i=0;i<r;i++){const s=e.textures[i];!(null==s?void 0:s.generateMipMaps)||t||s.isCube||(this._bindTextureDirectly(n.TEXTURE_2D,s,!0),n.generateMipmap(n.TEXTURE_2D),this._bindTextureDirectly(n.TEXTURE_2D,null))}i&&(e._MSAAFramebuffer&&this._bindUnboundFramebuffer(e._framebuffer),i()),this._bindUnboundFramebuffer(null)},Rn.B.prototype.createMultipleRenderTarget=function(e,t,i=!0){var n;let s=!1,r=!0,o=!1,a=!1,l=15,h=1,c=new Array,u=new Array,d=new Array,p=new Array,f=new Array,m=new Array,g=new Array,v=new Array;const y=this._createHardwareRenderTargetWrapper(!0,!1,e);void 0!==t&&(s=void 0!==t.generateMipMaps&&t.generateMipMaps,r=void 0===t.generateDepthBuffer||t.generateDepthBuffer,o=void 0!==t.generateStencilBuffer&&t.generateStencilBuffer,a=void 0!==t.generateDepthTexture&&t.generateDepthTexture,h=t.textureCount||1,t.types&&(c=t.types),t.samplingModes&&(u=t.samplingModes),t.useSRGBBuffers&&(d=t.useSRGBBuffers),t.formats&&(p=t.formats),t.targetTypes&&(f=t.targetTypes),t.faceIndex&&(m=t.faceIndex),t.layerIndex&&(g=t.layerIndex),t.layerCounts&&(v=t.layerCounts),this.webGLVersion>1&&(13===t.depthTextureFormat||17===t.depthTextureFormat||16===t.depthTextureFormat||14===t.depthTextureFormat||18===t.depthTextureFormat)&&(l=t.depthTextureFormat));const x=this._gl,b=x.createFramebuffer();this._bindUnboundFramebuffer(b);const T=e.width||e,S=e.height||e,E=[],C=[],A=this.webGLVersion>1&&a&&(13===t.depthTextureFormat||17===t.depthTextureFormat||18===t.depthTextureFormat),P=this._setupFramebufferDepthAttachments(!A&&o,!a&&r,T,S);y._framebuffer=b,y._depthStencilBuffer=P,y._generateDepthBuffer=!a&&r,y._generateStencilBuffer=!A&&o,y._attachments=C;for(let e=0;e<h;e++){let t=u[e]||3,i=c[e]||0,r=d[e]||!1;const o=p[e]||5,a=f[e]||3553,l=null!==(n=v[e])&&void 0!==n?n:1;(1!==i||this._caps.textureFloatLinearFiltering)&&(2!==i||this._caps.textureHalfFloatLinearFiltering)||(t=1);const h=this._getSamplingParameters(t,s);1!==i||this._caps.textureFloat||(i=0,_.Y.Warn("Float textures are not supported. Render target forced to TEXTURETYPE_UNSIGNED_BYTE type")),r=r&&this._caps.supportSRGBBuffers&&(this.webGLVersion>1||this.isWebGPU);const m=this.webGLVersion>1,g=x[m?"COLOR_ATTACHMENT"+e:"COLOR_ATTACHMENT"+e+"_WEBGL"];if(C.push(g),-1===a)continue;const y=new Ei.l(this,Ei.S.MultiRenderTarget);E[e]=y,x.activeTexture(x["TEXTURE"+e]),x.bindTexture(a,y._hardwareTexture.underlyingResource),x.texParameteri(a,x.TEXTURE_MAG_FILTER,h.mag),x.texParameteri(a,x.TEXTURE_MIN_FILTER,h.min),x.texParameteri(a,x.TEXTURE_WRAP_S,x.CLAMP_TO_EDGE),x.texParameteri(a,x.TEXTURE_WRAP_T,x.CLAMP_TO_EDGE);const b=this._getRGBABufferInternalSizedFormat(i,o,r),A=this._getInternalFormat(o),P=this._getWebGLTextureType(i);if(!m||35866!==a&&32879!==a)if(34067===a){for(let e=0;e<6;e++)x.texImage2D(x.TEXTURE_CUBE_MAP_POSITIVE_X+e,0,b,T,S,0,A,P,null);y.isCube=!0}else x.texImage2D(x.TEXTURE_2D,0,b,T,S,0,A,P,null);else 35866===a?y.is2DArray=!0:y.is3D=!0,y.baseDepth=y.depth=l,x.texImage3D(a,0,b,T,S,l,0,A,P,null);s&&x.generateMipmap(a),this._bindTextureDirectly(a,null),y.baseWidth=T,y.baseHeight=S,y.width=T,y.height=S,y.isReady=!0,y.samples=1,y.generateMipMaps=s,y.samplingMode=t,y.type=i,y._useSRGBBuffer=r,y.format=o,this._internalTexturesCache.push(y)}if(a&&this._caps.depthTextureExtension){const e=new Ei.l(this,Ei.S.Depth);let t=5,i=x.DEPTH_COMPONENT16,n=x.DEPTH_COMPONENT,r=x.UNSIGNED_SHORT,o=x.DEPTH_ATTACHMENT;this.webGLVersion<2?i=x.DEPTH_COMPONENT:14===l?(t=1,r=x.FLOAT,i=x.DEPTH_COMPONENT32F):18===l?(t=0,r=x.FLOAT_32_UNSIGNED_INT_24_8_REV,i=x.DEPTH32F_STENCIL8,n=x.DEPTH_STENCIL,o=x.DEPTH_STENCIL_ATTACHMENT):16===l?(t=0,r=x.UNSIGNED_INT,i=x.DEPTH_COMPONENT24,o=x.DEPTH_ATTACHMENT):13!==l&&17!==l||(t=12,r=x.UNSIGNED_INT_24_8,i=x.DEPTH24_STENCIL8,n=x.DEPTH_STENCIL,o=x.DEPTH_STENCIL_ATTACHMENT),x.activeTexture(x.TEXTURE0),x.bindTexture(x.TEXTURE_2D,e._hardwareTexture.underlyingResource),x.texParameteri(x.TEXTURE_2D,x.TEXTURE_MAG_FILTER,x.NEAREST),x.texParameteri(x.TEXTURE_2D,x.TEXTURE_MIN_FILTER,x.NEAREST),x.texParameteri(x.TEXTURE_2D,x.TEXTURE_WRAP_S,x.CLAMP_TO_EDGE),x.texParameteri(x.TEXTURE_2D,x.TEXTURE_WRAP_T,x.CLAMP_TO_EDGE),x.texImage2D(x.TEXTURE_2D,0,i,T,S,0,n,r,null),x.framebufferTexture2D(x.FRAMEBUFFER,o,x.TEXTURE_2D,e._hardwareTexture.underlyingResource,0),e.baseWidth=T,e.baseHeight=S,e.width=T,e.height=S,e.isReady=!0,e.samples=1,e.generateMipMaps=s,e.samplingMode=1,e.format=l,e.type=t,E[h]=e,this._internalTexturesCache.push(e)}return y.setTextures(E),i&&x.drawBuffers(C),this._bindUnboundFramebuffer(null),y.setLayerAndFaceIndices(g,m),this.resetTextureCache(),y},Rn.B.prototype.updateMultipleRenderTargetTextureSampleCount=function(e,t,i=!0){if(this.webGLVersion<2||!e||!e.texture)return 1;if(e.samples===t)return t;const n=e._attachments.length;if(0===n)return 1;const s=this._gl;t=Math.min(t,this.getCaps().maxMSAASamples);const r=!!e._depthStencilBuffer;if(r&&(s.deleteRenderbuffer(e._depthStencilBuffer),e._depthStencilBuffer=null),e._MSAAFramebuffer&&(s.deleteFramebuffer(e._MSAAFramebuffer),e._MSAAFramebuffer=null),t>1&&"function"==typeof s.renderbufferStorageMultisample){const r=s.createFramebuffer();if(!r)throw new Error("Unable to create multi sampled framebuffer");e._MSAAFramebuffer=r,this._bindUnboundFramebuffer(r);const o=[];for(let t=0;t<n;t++)e.textures[t]._hardwareTexture.releaseMSAARenderBuffers();for(let i=0;i<n;i++){const n=e.textures[i],r=n._hardwareTexture,a=s[this.webGLVersion>1?"COLOR_ATTACHMENT"+i:"COLOR_ATTACHMENT"+i+"_WEBGL"],l=this._createRenderBuffer(n.width,n.height,t,-1,this._getRGBAMultiSampleBufferFormat(n.type,n.format),a);if(!l)throw new Error("Unable to create multi sampled framebuffer");r.addMSAARenderBuffer(l),n.samples=t,o.push(a)}i&&s.drawBuffers(o)}else this._bindUnboundFramebuffer(e._framebuffer);return r&&(e._depthStencilBuffer=this._setupFramebufferDepthAttachments(e._generateStencilBuffer,e._generateDepthBuffer,e.texture.width,e.texture.height,t)),this._bindUnboundFramebuffer(null),t},i(2477),i(7246),i(6697),Rn.B.prototype.setTextureSampler=function(e,t){throw new Error("setTextureSampler: This engine does not support separate texture sampler objects!")},i(4901),i(3742);class Fs{}const Ls=new r.y$,Bs=new r.y$;Object.defineProperty(ue.D.prototype,"onBeforeViewRenderObservable",{get:function(){return Ls}}),Object.defineProperty(ue.D.prototype,"onAfterViewRenderObservable",{get:function(){return Bs}}),Object.defineProperty(ue.D.prototype,"inputElement",{get:function(){return this._inputElement},set:function(e){var t;this._inputElement!==e&&(this._inputElement=e,null===(t=this._onEngineViewChanged)||void 0===t||t.call(this))}}),ue.D.prototype.getInputElement=function(){return this.inputElement||this.getRenderingCanvas()},ue.D.prototype.registerView=function(e,t,i){this.views||(this.views=[]);for(const t of this.views)if(t.target===e)return t;const n=this.getRenderingCanvas();n&&(e.width=n.width,e.height=n.height);const s={target:e,camera:t,clearBeforeCopy:i,enabled:!0,id:(1e5*Math.random()).toFixed()};return this.views.push(s),t&&t.onDisposeObservable.add((()=>{this.unRegisterView(e)})),s},ue.D.prototype.unRegisterView=function(e){if(!this.views||0===this.views.length)return this;for(const t of this.views)if(t.target===e){const e=this.views.indexOf(t);-1!==e&&this.views.splice(e,1);break}return this},ue.D.prototype._renderViewStep=function(e){const t=e.target,i=t.getContext("2d");if(!i)return!0;const n=this.getRenderingCanvas();Ls.notifyObservers(e);const s=e.camera;let r=null,o=null;if(s){if(o=s.getScene(),!o||o.activeCameras&&o.activeCameras.length)return!0;this.activeView=e,r=o.activeCamera,o.activeCamera=s}if(e.customResize)e.customResize(t);else{const e=Math.floor(t.clientWidth/this._hardwareScalingLevel),i=Math.floor(t.clientHeight/this._hardwareScalingLevel),s=e!==t.width||n.width!==t.width||i!==t.height||n.height!==t.height;t.clientWidth&&t.clientHeight&&s&&(t.width=e,t.height=i,this.setSize(e,i))}return!(!n.width||!n.height||(this._renderFrame(),this.flushFramebuffer(),e.clearBeforeCopy&&i.clearRect(0,0,n.width,n.height),i.drawImage(n,0,0),r&&o&&(o.activeCamera=r),Bs.notifyObservers(e),0))},ue.D.prototype._renderViews=function(){if(!this.views||0===this.views.length)return!1;if(!this.getRenderingCanvas())return!1;let e;for(const t of this.views)if(t.enabled)if(t.target!==this.inputElement){if(!this._renderViewStep(t))return!1}else e=t;return!(e&&!this._renderViewStep(e)||(this.activeView=null,0))};var Us=i(9075);function Vs(e){if(this._excludedCompressedTextures&&this._excludedCompressedTextures.some((t=>{const i="\\b"+t+"\\b";return e&&(e===t||e.match(new RegExp(i,"g")))})))return e;const t=e.lastIndexOf("."),i=e.lastIndexOf("?"),n=i>-1?e.substring(i,e.length):"";return(t>-1?e.substring(0,t):e)+this._textureFormatInUse+n}Rn.B.prototype.createStorageBuffer=function(e,t){throw new Error("createStorageBuffer: Unsupported method in this engine!")},Rn.B.prototype.updateStorageBuffer=function(e,t,i,n){},Rn.B.prototype.readFromStorageBuffer=function(e,t,i,n){throw new Error("readFromStorageBuffer: Unsupported method in this engine!")},Rn.B.prototype.setStorageBuffer=function(e,t){throw new Error("setStorageBuffer: Unsupported method in this engine!")},Object.defineProperty(ue.D.prototype,"texturesSupported",{get:function(){const e=new Array;return this._caps.astc&&e.push("-astc.ktx"),this._caps.s3tc&&e.push("-dxt.ktx"),this._caps.pvrtc&&e.push("-pvrtc.ktx"),this._caps.etc2&&e.push("-etc2.ktx"),this._caps.etc1&&e.push("-etc1.ktx"),e},enumerable:!0,configurable:!0}),Object.defineProperty(ue.D.prototype,"textureFormatInUse",{get:function(){return this._textureFormatInUse||null},enumerable:!0,configurable:!0}),ue.D.prototype.setCompressedTextureExclusions=function(e){this._excludedCompressedTextures=e},ue.D.prototype.setTextureFormatToUse=function(e){const t=this.texturesSupported;for(let i=0,n=t.length;i<n;i++)for(let n=0,s=e.length;n<s;n++)if(t[i]===e[n].toLowerCase())return this._transformTextureUrl=Vs.bind(this),this._textureFormatInUse=t[i];return this._textureFormatInUse="",this._transformTextureUrl=null,null};class ks{constructor(){const e=new ArrayBuffer(ks.DEFAULT_BUFFER_SIZE);this._uint32s=new Uint32Array(e),this._int32s=new Int32Array(e),this._float32s=new Float32Array(e),this._length=ks.DEFAULT_BUFFER_SIZE/4,this._position=0,this._nativeDataStream=new _native.NativeDataStream((()=>{this._flush()}))}writeUint32(e){this._flushIfNecessary(1),this._uint32s[this._position++]=e}writeInt32(e){this._flushIfNecessary(1),this._int32s[this._position++]=e}writeFloat32(e){this._flushIfNecessary(1),this._float32s[this._position++]=e}writeUint32Array(e){this._flushIfNecessary(1+e.length),this._uint32s[this._position++]=e.length,this._uint32s.set(e,this._position),this._position+=e.length}writeInt32Array(e){this._flushIfNecessary(1+e.length),this._uint32s[this._position++]=e.length,this._int32s.set(e,this._position),this._position+=e.length}writeFloat32Array(e){this._flushIfNecessary(1+e.length),this._uint32s[this._position++]=e.length,this._float32s.set(e,this._position),this._position+=e.length}writeNativeData(e){this._flushIfNecessary(e.length),this._uint32s.set(e,this._position),this._position+=e.length}writeBoolean(e){this.writeUint32(e?1:0)}_flushIfNecessary(e){this._position+e>this._length&&this._flush()}_flush(){this._nativeDataStream.writeBuffer(this._uint32s.buffer,this._position),this._position=0}}ks.DEFAULT_BUFFER_SIZE=65536;var Gs=i(4277),zs=i(6430),Ws=i(4001),Hs=i(1722);class Xs{get isAsync(){return this.isParallelCompiled}get isReady(){if(this.compilationError){const e=this.compilationError.message;throw new Error("SHADER ERROR"+("string"==typeof e?"\n"+e:""))}return this.isCompiled}_getVertexShaderCode(){return null}_getFragmentShaderCode(){return null}_handlesSpectorRebuildCallback(e){throw new Error("Not implemented")}constructor(e){this.isParallelCompiled=!0,this.isCompiled=!1,this._valueCache={},this._engine=e}_fillEffectInformation(e,t,i,n,s,r,o,a){const l=this._engine;if(l.supportsUniformBuffers)for(const i in t)e.bindUniformBlock(i,t[i]);let h;for(this._engine.getUniforms(this,i).forEach(((e,t)=>{n[i[t]]=e})),this._uniforms=n,h=0;h<s.length;h++)null==e.getUniform(s[h])&&(s.splice(h,1),h--);s.forEach(((e,t)=>{r[e]=t})),a.push(...l.getAttributes(this,o))}dispose(){this._uniforms={}}_cacheMatrix(e,t){const i=this._valueCache[e],n=t.updateFlag;return(void 0===i||i!==n)&&(this._valueCache[e]=n,!0)}_cacheFloat2(e,t,i){let n=this._valueCache[e];if(!n)return n=[t,i],this._valueCache[e]=n,!0;let s=!1;return n[0]!==t&&(n[0]=t,s=!0),n[1]!==i&&(n[1]=i,s=!0),s}_cacheFloat3(e,t,i,n){let s=this._valueCache[e];if(!s)return s=[t,i,n],this._valueCache[e]=s,!0;let r=!1;return s[0]!==t&&(s[0]=t,r=!0),s[1]!==i&&(s[1]=i,r=!0),s[2]!==n&&(s[2]=n,r=!0),r}_cacheFloat4(e,t,i,n,s){let r=this._valueCache[e];if(!r)return r=[t,i,n,s],this._valueCache[e]=r,!0;let o=!1;return r[0]!==t&&(r[0]=t,o=!0),r[1]!==i&&(r[1]=i,o=!0),r[2]!==n&&(r[2]=n,o=!0),r[3]!==s&&(r[3]=s,o=!0),o}setInt(e,t){const i=this._valueCache[e];void 0!==i&&i===t||this._engine.setInt(this._uniforms[e],t)&&(this._valueCache[e]=t)}setInt2(e,t,i){this._cacheFloat2(e,t,i)&&(this._engine.setInt2(this._uniforms[e],t,i)||(this._valueCache[e]=null))}setInt3(e,t,i,n){this._cacheFloat3(e,t,i,n)&&(this._engine.setInt3(this._uniforms[e],t,i,n)||(this._valueCache[e]=null))}setInt4(e,t,i,n,s){this._cacheFloat4(e,t,i,n,s)&&(this._engine.setInt4(this._uniforms[e],t,i,n,s)||(this._valueCache[e]=null))}setIntArray(e,t){this._valueCache[e]=null,this._engine.setIntArray(this._uniforms[e],t)}setIntArray2(e,t){this._valueCache[e]=null,this._engine.setIntArray2(this._uniforms[e],t)}setIntArray3(e,t){this._valueCache[e]=null,this._engine.setIntArray3(this._uniforms[e],t)}setIntArray4(e,t){this._valueCache[e]=null,this._engine.setIntArray4(this._uniforms[e],t)}setUInt(e,t){const i=this._valueCache[e];void 0!==i&&i===t||this._engine.setUInt(this._uniforms[e],t)&&(this._valueCache[e]=t)}setUInt2(e,t,i){this._cacheFloat2(e,t,i)&&(this._engine.setUInt2(this._uniforms[e],t,i)||(this._valueCache[e]=null))}setUInt3(e,t,i,n){this._cacheFloat3(e,t,i,n)&&(this._engine.setUInt3(this._uniforms[e],t,i,n)||(this._valueCache[e]=null))}setUInt4(e,t,i,n,s){this._cacheFloat4(e,t,i,n,s)&&(this._engine.setUInt4(this._uniforms[e],t,i,n,s)||(this._valueCache[e]=null))}setUIntArray(e,t){this._valueCache[e]=null,this._engine.setUIntArray(this._uniforms[e],t)}setUIntArray2(e,t){this._valueCache[e]=null,this._engine.setUIntArray2(this._uniforms[e],t)}setUIntArray3(e,t){this._valueCache[e]=null,this._engine.setUIntArray3(this._uniforms[e],t)}setUIntArray4(e,t){this._valueCache[e]=null,this._engine.setUIntArray4(this._uniforms[e],t)}setFloatArray(e,t){this._valueCache[e]=null,this._engine.setFloatArray(this._uniforms[e],t)}setFloatArray2(e,t){this._valueCache[e]=null,this._engine.setFloatArray2(this._uniforms[e],t)}setFloatArray3(e,t){this._valueCache[e]=null,this._engine.setFloatArray3(this._uniforms[e],t)}setFloatArray4(e,t){this._valueCache[e]=null,this._engine.setFloatArray4(this._uniforms[e],t)}setArray(e,t){this._valueCache[e]=null,this._engine.setArray(this._uniforms[e],t)}setArray2(e,t){this._valueCache[e]=null,this._engine.setArray2(this._uniforms[e],t)}setArray3(e,t){this._valueCache[e]=null,this._engine.setArray3(this._uniforms[e],t)}setArray4(e,t){this._valueCache[e]=null,this._engine.setArray4(this._uniforms[e],t)}setMatrices(e,t){t&&(this._valueCache[e]=null,this._engine.setMatrices(this._uniforms[e],t))}setMatrix(e,t){this._cacheMatrix(e,t)&&(this._engine.setMatrices(this._uniforms[e],t.toArray())||(this._valueCache[e]=null))}setMatrix3x3(e,t){this._valueCache[e]=null,this._engine.setMatrix3x3(this._uniforms[e],t)}setMatrix2x2(e,t){this._valueCache[e]=null,this._engine.setMatrix2x2(this._uniforms[e],t)}setFloat(e,t){const i=this._valueCache[e];void 0!==i&&i===t||this._engine.setFloat(this._uniforms[e],t)&&(this._valueCache[e]=t)}setBool(e,t){const i=this._valueCache[e];void 0!==i&&i===t||this._engine.setInt(this._uniforms[e],t?1:0)&&(this._valueCache[e]=t?1:0)}setVector2(e,t){this._cacheFloat2(e,t.x,t.y)&&(this._engine.setFloat2(this._uniforms[e],t.x,t.y)||(this._valueCache[e]=null))}setFloat2(e,t,i){this._cacheFloat2(e,t,i)&&(this._engine.setFloat2(this._uniforms[e],t,i)||(this._valueCache[e]=null))}setVector3(e,t){this._cacheFloat3(e,t.x,t.y,t.z)&&(this._engine.setFloat3(this._uniforms[e],t.x,t.y,t.z)||(this._valueCache[e]=null))}setFloat3(e,t,i,n){this._cacheFloat3(e,t,i,n)&&(this._engine.setFloat3(this._uniforms[e],t,i,n)||(this._valueCache[e]=null))}setVector4(e,t){this._cacheFloat4(e,t.x,t.y,t.z,t.w)&&(this._engine.setFloat4(this._uniforms[e],t.x,t.y,t.z,t.w)||(this._valueCache[e]=null))}setQuaternion(e,t){this._cacheFloat4(e,t.x,t.y,t.z,t.w)&&(this._engine.setFloat4(this._uniforms[e],t.x,t.y,t.z,t.w)||(this._valueCache[e]=null))}setFloat4(e,t,i,n,s){this._cacheFloat4(e,t,i,n,s)&&(this._engine.setFloat4(this._uniforms[e],t,i,n,s)||(this._valueCache[e]=null))}setColor3(e,t){this._cacheFloat3(e,t.r,t.g,t.b)&&(this._engine.setFloat3(this._uniforms[e],t.r,t.g,t.b)||(this._valueCache[e]=null))}setColor4(e,t,i){this._cacheFloat4(e,t.r,t.g,t.b,i)&&(this._engine.setFloat4(this._uniforms[e],t.r,t.g,t.b,i)||(this._valueCache[e]=null))}setDirectColor4(e,t){this._cacheFloat4(e,t.r,t.g,t.b,t.a)&&(this._engine.setFloat4(this._uniforms[e],t.r,t.g,t.b,t.a)||(this._valueCache[e]=null))}}class js extends Rs.r{get _framebuffer(){return this.__framebuffer}set _framebuffer(e){this.__framebuffer&&this._engine._releaseFramebufferObjects(this.__framebuffer),this.__framebuffer=e}get _framebufferDepthStencil(){return this.__framebufferDepthStencil}set _framebufferDepthStencil(e){this.__framebufferDepthStencil&&this._engine._releaseFramebufferObjects(this.__framebufferDepthStencil),this.__framebufferDepthStencil=e}constructor(e,t,i,n){super(e,t,i,n),this.__framebuffer=null,this.__framebufferDepthStencil=null,this._engine=n}dispose(e=!1){this._framebuffer=null,this._framebufferDepthStencil=null,super.dispose(e)}}class Ys{get underlyingResource(){return this._nativeTexture}constructor(e,t){this._engine=t,this.set(e)}setUsage(){}set(e){this._nativeTexture=e}reset(){this._nativeTexture=null}release(){this._nativeTexture&&this._engine.deleteTexture(this._nativeTexture),this.reset()}}const qs=new r.y$;if("undefined"!=typeof self&&!Object.prototype.hasOwnProperty.call(self,"_native")){let e;Object.defineProperty(self,"_native",{get:()=>e,set:t=>{e=t,e&&qs.notifyObservers(e)}})}function Ks(){return new Promise((e=>{"undefined"==typeof _native?qs.addOnce((t=>e(t))):e(_native)}))}async function $s(e,t){(await Ks())[e]=t}class Qs extends Ke.h{}class Zs{constructor(e){this._engine=e,this._pending=new Array,this._isCommandBufferScopeActive=!1,this._commandStream=Js._createNativeDataStream(),this._engine.setCommandDataStream(this._commandStream)}beginCommandScope(){if(this._isCommandBufferScopeActive)throw new Error("Command scope already active.");this._isCommandBufferScopeActive=!0}endCommandScope(){if(!this._isCommandBufferScopeActive)throw new Error("Command scope is not active.");this._isCommandBufferScopeActive=!1,this._submit()}startEncodingCommand(e){this._commandStream.writeNativeData(e)}encodeCommandArgAsUInt32(e){this._commandStream.writeUint32(e)}encodeCommandArgAsUInt32s(e){this._commandStream.writeUint32Array(e)}encodeCommandArgAsInt32(e){this._commandStream.writeInt32(e)}encodeCommandArgAsInt32s(e){this._commandStream.writeInt32Array(e)}encodeCommandArgAsFloat32(e){this._commandStream.writeFloat32(e)}encodeCommandArgAsFloat32s(e){this._commandStream.writeFloat32Array(e)}encodeCommandArgAsNativeData(e){this._commandStream.writeNativeData(e),this._pending.push(e)}finishEncodingCommand(){this._isCommandBufferScopeActive||this._submit()}_submit(){this._engine.submitCommands(),this._pending.length=0}}class Js extends ue.D{setHardwareScalingLevel(e){super.setHardwareScalingLevel(e),this._engine.setHardwareScalingLevel(e)}constructor(e={}){if(super(null,!1,void 0,e.adaptToDeviceRatio),this._engine=new _native.Engine,this._camera=_native.Camera?new _native.Camera:null,this._commandBufferEncoder=new Zs(this._engine),this._boundBuffersVertexArray=null,this._currentDepthTest=_native.Engine.DEPTH_TEST_LEQUAL,this._stencilTest=!1,this._stencilMask=255,this._stencilFunc=519,this._stencilFuncRef=0,this._stencilFuncMask=255,this._stencilOpStencilFail=7680,this._stencilOpDepthFail=7680,this._stencilOpStencilDepthPass=7681,this._zOffset=0,this._zOffsetUnits=0,this._depthWrite=!0,_native.Engine.PROTOCOL_VERSION!==Js.PROTOCOL_VERSION)throw new Error(`Protocol version mismatch: ${_native.Engine.PROTOCOL_VERSION} (Native) !== ${Js.PROTOCOL_VERSION} (JS)`);this._webGLVersion=2,this.disableUniformBuffers=!0,this._shaderPlatformName="NATIVE",this._caps={maxTexturesImageUnits:16,maxVertexTextureImageUnits:16,maxCombinedTexturesImageUnits:32,maxTextureSize:_native.Engine.CAPS_LIMITS_MAX_TEXTURE_SIZE,maxCubemapTextureSize:512,maxRenderTextureSize:512,maxVertexAttribs:16,maxVaryingVectors:16,maxFragmentUniformVectors:16,maxVertexUniformVectors:16,standardDerivatives:!0,astc:null,pvrtc:null,etc1:null,etc2:null,bptc:null,maxAnisotropy:16,uintIndices:!0,fragmentDepthSupported:!1,highPrecisionShaderSupported:!0,colorBufferFloat:!1,textureFloat:!0,textureFloatLinearFiltering:!1,textureFloatRender:!1,textureHalfFloat:!1,textureHalfFloatLinearFiltering:!1,textureHalfFloatRender:!1,textureLOD:!0,texelFetch:!1,drawBuffersExtension:!1,depthTextureExtension:!1,vertexArrayObject:!0,instancedArrays:!0,supportOcclusionQuery:!1,canUseTimestampForTimerQuery:!1,blendMinMax:!1,maxMSAASamples:1,canUseGLInstanceID:!0,canUseGLVertexID:!0,supportComputeShaders:!1,supportSRGBBuffers:!0,supportTransformFeedbacks:!1,textureMaxLevel:!1,texture2DArrayMaxLayerCount:_native.Engine.CAPS_LIMITS_MAX_TEXTURE_LAYERS,disableMorphTargetTexture:!1},this._features={forceBitmapOverHTMLImageElement:!1,supportRenderAndCopyToLodForFloatTextures:!1,supportDepthStencilTexture:!1,supportShadowSamplers:!1,uniformBufferHardCheckMatrix:!1,allowTexturePrefiltering:!1,trackUbosInFrame:!1,checkUbosContentBeforeUpload:!1,supportCSM:!1,basisNeedsPOT:!1,support3DTextures:!1,needTypeSuffixInShaderConstants:!1,supportMSAA:!1,supportSSAO2:!1,supportExtendedTextureFormats:!1,supportSwitchCaseInShader:!1,supportSyncTextureRead:!1,needsInvertingBitmap:!0,useUBOBindingCache:!0,needShaderCodeInlining:!0,needToAlwaysBindUniformBuffers:!1,supportRenderPasses:!0,supportSpriteInstancing:!1,_collectUbosUpdatedInFrame:!1},de.w1.Log("Babylon Native (v"+ue.D.Version+") launched"),de.w1.LoadScript=function(e,t,i,n){de.w1.LoadFile(e,(e=>{Function(e).apply(null),t&&t()}),void 0,void 0,!1,((e,t)=>{i&&i("LoadScript Error",t)}))},"undefined"==typeof URL&&(window.URL={createObjectURL:function(){},revokeObjectURL:function(){}}),"undefined"==typeof Blob&&(window.Blob=function(e){return e}),Array.prototype.flat||Object.defineProperty(Array.prototype,"flat",{configurable:!0,value:function e(){const t=isNaN(arguments[0])?1:Number(arguments[0]);return t?Array.prototype.reduce.call(this,(function(i,n){return Array.isArray(n)?i.push.apply(i,e.call(n,t-1)):i.push(n),i}),[]):Array.prototype.slice.call(this)},writable:!0});const t=window&&window.devicePixelRatio||1;this._hardwareScalingLevel=e.adaptToDeviceRatio?1/t:1,this._engine.setHardwareScalingLevel(this._hardwareScalingLevel),this._lastDevicePixelRatio=t,this.resize();const i=this.getDepthFunction();i&&this.setDepthFunction(i),this._shaderProcessor=new Ws.C,this.onNewSceneAddedObservable.add((e=>{const t=e.render;e.render=(...i)=>{this._commandBufferEncoder.beginCommandScope(),t.apply(e,i),this._commandBufferEncoder.endCommandScope()}}))}dispose(){super.dispose(),this._boundBuffersVertexArray&&this._deleteVertexArray(this._boundBuffersVertexArray),this._engine.dispose()}static _createNativeDataStream(){return new ks}_queueNewFrame(e,t){return t.requestAnimationFrame&&t!==window?t.requestAnimationFrame(e):this._engine.requestAnimationFrame(e),0}_bindUnboundFramebuffer(e){this._currentFramebuffer!==e&&(this._currentFramebuffer&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_UNBINDFRAMEBUFFER),this._commandBufferEncoder.encodeCommandArgAsNativeData(this._currentFramebuffer),this._commandBufferEncoder.finishEncodingCommand()),e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_BINDFRAMEBUFFER),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.finishEncodingCommand()),this._currentFramebuffer=e)}getHostDocument(){return null}clear(e,t,i,n=!1){if(this.useReverseDepthBuffer)throw new Error("reverse depth buffer is not currently implemented");this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_CLEAR),this._commandBufferEncoder.encodeCommandArgAsUInt32(t&&e?1:0),this._commandBufferEncoder.encodeCommandArgAsFloat32(e?e.r:0),this._commandBufferEncoder.encodeCommandArgAsFloat32(e?e.g:0),this._commandBufferEncoder.encodeCommandArgAsFloat32(e?e.b:0),this._commandBufferEncoder.encodeCommandArgAsFloat32(e?e.a:1),this._commandBufferEncoder.encodeCommandArgAsUInt32(i?1:0),this._commandBufferEncoder.encodeCommandArgAsFloat32(1),this._commandBufferEncoder.encodeCommandArgAsUInt32(n?1:0),this._commandBufferEncoder.encodeCommandArgAsUInt32(0),this._commandBufferEncoder.finishEncodingCommand()}createIndexBuffer(e,t){const i=this._normalizeIndexData(e),n=new Qs;return n.references=1,n.is32Bits=4===i.BYTES_PER_ELEMENT,i.byteLength&&(n.nativeIndexBuffer=this._engine.createIndexBuffer(i.buffer,i.byteOffset,i.byteLength,n.is32Bits,null!=t&&t)),n}createVertexBuffer(e,t){const i=ArrayBuffer.isView(e)?e:new Float32Array(e),n=new Qs;return n.references=1,i.byteLength&&(n.nativeVertexBuffer=this._engine.createVertexBuffer(i.buffer,i.byteOffset,i.byteLength,null!=t&&t)),n}_recordVertexArrayObject(e,t,i,n,s){i&&this._engine.recordIndexBuffer(e,i.nativeIndexBuffer);const r=n.getAttributesNames();for(let i=0;i<r.length;i++){const o=n.getAttributeLocation(i);if(o>=0){const n=r[i];let a=null;if(s&&(a=s[n]),a||(a=t[n]),a){const t=a.getBuffer();t&&t.nativeVertexBuffer&&this._engine.recordVertexBuffer(e,t.nativeVertexBuffer,o,a.byteOffset,a.byteStride,a.getSize(),this._getNativeAttribType(a.type),a.normalized,a.getInstanceDivisor())}}}}bindBuffers(e,t,i){this._boundBuffersVertexArray&&this._deleteVertexArray(this._boundBuffersVertexArray),this._boundBuffersVertexArray=this._engine.createVertexArray(),this._recordVertexArrayObject(this._boundBuffersVertexArray,e,t,i),this.bindVertexArrayObject(this._boundBuffersVertexArray)}recordVertexArrayObject(e,t,i,n){const s=this._engine.createVertexArray();return this._recordVertexArrayObject(s,e,t,i,n),s}_deleteVertexArray(e){this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_DELETEVERTEXARRAY),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.finishEncodingCommand()}bindVertexArrayObject(e){this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_BINDVERTEXARRAY),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.finishEncodingCommand()}releaseVertexArrayObject(e){this._deleteVertexArray(e)}getAttributes(e,t){const i=e;return this._engine.getAttributes(i.nativeProgram,t)}drawElementsType(e,t,i,n){this._drawCalls.addCount(1,!1),this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_DRAWINDEXED),this._commandBufferEncoder.encodeCommandArgAsUInt32(e),this._commandBufferEncoder.encodeCommandArgAsUInt32(t),this._commandBufferEncoder.encodeCommandArgAsUInt32(i),this._commandBufferEncoder.finishEncodingCommand()}drawArraysType(e,t,i,n){this._drawCalls.addCount(1,!1),this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_DRAW),this._commandBufferEncoder.encodeCommandArgAsUInt32(e),this._commandBufferEncoder.encodeCommandArgAsUInt32(t),this._commandBufferEncoder.encodeCommandArgAsUInt32(i),this._commandBufferEncoder.finishEncodingCommand()}createPipelineContext(){return new Xs(this)}createMaterialContext(){}createDrawContext(){}_preparePipelineContext(e,t,i,n,s,r,o,a){e.nativeProgram=n?this.createRawShaderProgram():this.createShaderProgram(e,t,i,a)}isAsync(e){return!(!e.isAsync||!this._engine.createProgramAsync)}_executeWhenRenderingStateIsCompiled(e,t){const i=e;if(!this.isAsync(e))return void t();const n=i.onCompiled;i.onCompiled=n?()=>{n(),t()}:t}createRawShaderProgram(){throw new Error("Not Supported")}createShaderProgram(e,t,i,n){const s=e;if(s.nativeProgram)throw new Error("Tried to create a second program in the same NativePipelineContext");this.onBeforeShaderCompilationObservable.notifyObservers(this);const r=new zs.Z(t);r.processCode(),t=r.code;const o=new zs.Z(i);o.processCode(),i=o.code,t=Rn.B._ConcatenateShader(t,n),i=Rn.B._ConcatenateShader(i,n);const a=()=>{var e;s.isCompiled=!0,null===(e=s.onCompiled)||void 0===e||e.call(s),this.onAfterShaderCompilationObservable.notifyObservers(this)};if(this.isAsync(e))return this._engine.createProgramAsync(t,i,a,(e=>{s.compilationError=e}));try{const e=s.nativeProgram=this._engine.createProgram(t,i);return a(),e}catch(e){const t=null==e?void 0:e.message;throw new Error("SHADER ERROR"+("string"==typeof t?"\n"+t:""))}}inlineShaderCode(e){const t=new zs.Z(e);return t.debug=!1,t.processCode(),t.code}_setProgram(e){this._currentProgram!==e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETPROGRAM),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.finishEncodingCommand(),this._currentProgram=e)}_deletePipelineContext(e){const t=e;t&&t.nativeProgram&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_DELETEPROGRAM),this._commandBufferEncoder.encodeCommandArgAsNativeData(t.nativeProgram),this._commandBufferEncoder.finishEncodingCommand())}getUniforms(e,t){const i=e;return this._engine.getUniforms(i.nativeProgram,t)}bindUniformBlock(e,t,i){throw new Error("Not Implemented")}bindSamplers(e){const t=e.getPipelineContext();this._setProgram(t.nativeProgram);const i=e.getSamplers();for(let t=0;t<i.length;t++){const n=e.getUniform(i[t]);n&&(this._boundUniforms[t]=n)}this._currentEffect=null}getRenderWidth(e=!1){return!e&&this._currentRenderTarget?this._currentRenderTarget.width:this._engine.getRenderWidth()}getRenderHeight(e=!1){return!e&&this._currentRenderTarget?this._currentRenderTarget.height:this._engine.getRenderHeight()}setViewport(e,t,i){this._cachedViewport=e,this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETVIEWPORT),this._commandBufferEncoder.encodeCommandArgAsFloat32(e.x),this._commandBufferEncoder.encodeCommandArgAsFloat32(e.y),this._commandBufferEncoder.encodeCommandArgAsFloat32(e.width),this._commandBufferEncoder.encodeCommandArgAsFloat32(e.height),this._commandBufferEncoder.finishEncodingCommand()}setState(e,t=0,i,n=!1,s,r,o=0){var a,l;this._zOffset=t,this._zOffsetUnits=o,this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETSTATE),this._commandBufferEncoder.encodeCommandArgAsUInt32(e?1:0),this._commandBufferEncoder.encodeCommandArgAsFloat32(t),this._commandBufferEncoder.encodeCommandArgAsFloat32(o),this._commandBufferEncoder.encodeCommandArgAsUInt32(null===(l=null!==(a=this.cullBackFaces)&&void 0!==a?a:s)||void 0===l||l?1:0),this._commandBufferEncoder.encodeCommandArgAsUInt32(n?1:0),this._commandBufferEncoder.finishEncodingCommand()}getInputElementClientRect(){return{bottom:this.getRenderHeight(),height:this.getRenderHeight(),left:0,right:this.getRenderWidth(),top:0,width:this.getRenderWidth(),x:0,y:0,toJSON:()=>{}}}setZOffset(e){e!==this._zOffset&&(this._zOffset=e,this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETZOFFSET),this._commandBufferEncoder.encodeCommandArgAsFloat32(this.useReverseDepthBuffer?-e:e),this._commandBufferEncoder.finishEncodingCommand())}getZOffset(){return this._zOffset}setZOffsetUnits(e){e!==this._zOffsetUnits&&(this._zOffsetUnits=e,this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETZOFFSETUNITS),this._commandBufferEncoder.encodeCommandArgAsFloat32(this.useReverseDepthBuffer?-e:e),this._commandBufferEncoder.finishEncodingCommand())}getZOffsetUnits(){return this._zOffsetUnits}setDepthBuffer(e){this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETDEPTHTEST),this._commandBufferEncoder.encodeCommandArgAsUInt32(e?this._currentDepthTest:_native.Engine.DEPTH_TEST_ALWAYS),this._commandBufferEncoder.finishEncodingCommand()}getDepthWrite(){return this._depthWrite}getDepthFunction(){switch(this._currentDepthTest){case _native.Engine.DEPTH_TEST_NEVER:return 512;case _native.Engine.DEPTH_TEST_ALWAYS:return 519;case _native.Engine.DEPTH_TEST_GREATER:return 516;case _native.Engine.DEPTH_TEST_GEQUAL:return 518;case _native.Engine.DEPTH_TEST_NOTEQUAL:return 517;case _native.Engine.DEPTH_TEST_EQUAL:return 514;case _native.Engine.DEPTH_TEST_LESS:return 513;case _native.Engine.DEPTH_TEST_LEQUAL:return 515}return null}setDepthFunction(e){let t=0;switch(e){case 512:t=_native.Engine.DEPTH_TEST_NEVER;break;case 519:t=_native.Engine.DEPTH_TEST_ALWAYS;break;case 516:t=_native.Engine.DEPTH_TEST_GREATER;break;case 518:t=_native.Engine.DEPTH_TEST_GEQUAL;break;case 517:t=_native.Engine.DEPTH_TEST_NOTEQUAL;break;case 514:t=_native.Engine.DEPTH_TEST_EQUAL;break;case 513:t=_native.Engine.DEPTH_TEST_LESS;break;case 515:t=_native.Engine.DEPTH_TEST_LEQUAL}this._currentDepthTest=t,this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETDEPTHTEST),this._commandBufferEncoder.encodeCommandArgAsUInt32(this._currentDepthTest),this._commandBufferEncoder.finishEncodingCommand()}setDepthWrite(e){this._depthWrite=e,this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETDEPTHWRITE),this._commandBufferEncoder.encodeCommandArgAsUInt32(Number(e)),this._commandBufferEncoder.finishEncodingCommand()}setColorWrite(e){this._colorWrite=e,this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETCOLORWRITE),this._commandBufferEncoder.encodeCommandArgAsUInt32(Number(e)),this._commandBufferEncoder.finishEncodingCommand()}getColorWrite(){return this._colorWrite}applyStencil(){this._setStencil(this._stencilMask,this._getStencilOpFail(this._stencilOpStencilFail),this._getStencilDepthFail(this._stencilOpDepthFail),this._getStencilDepthPass(this._stencilOpStencilDepthPass),this._getStencilFunc(this._stencilFunc),this._stencilFuncRef)}_setStencil(e,t,i,n,s,r){this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETSTENCIL),this._commandBufferEncoder.encodeCommandArgAsUInt32(e),this._commandBufferEncoder.encodeCommandArgAsUInt32(t),this._commandBufferEncoder.encodeCommandArgAsUInt32(i),this._commandBufferEncoder.encodeCommandArgAsUInt32(n),this._commandBufferEncoder.encodeCommandArgAsUInt32(s),this._commandBufferEncoder.encodeCommandArgAsUInt32(r),this._commandBufferEncoder.finishEncodingCommand()}setStencilBuffer(e){this._stencilTest=e,e?this.applyStencil():this._setStencil(255,_native.Engine.STENCIL_OP_FAIL_S_KEEP,_native.Engine.STENCIL_OP_FAIL_Z_KEEP,_native.Engine.STENCIL_OP_PASS_Z_KEEP,_native.Engine.STENCIL_TEST_ALWAYS,0)}getStencilBuffer(){return this._stencilTest}getStencilOperationPass(){return this._stencilOpStencilDepthPass}setStencilOperationPass(e){this._stencilOpStencilDepthPass=e,this.applyStencil()}setStencilMask(e){this._stencilMask=e,this.applyStencil()}setStencilFunction(e){this._stencilFunc=e,this.applyStencil()}setStencilFunctionReference(e){this._stencilFuncRef=e,this.applyStencil()}setStencilFunctionMask(e){this._stencilFuncMask=e}setStencilOperationFail(e){this._stencilOpStencilFail=e,this.applyStencil()}setStencilOperationDepthFail(e){this._stencilOpDepthFail=e,this.applyStencil()}getStencilMask(){return this._stencilMask}getStencilFunction(){return this._stencilFunc}getStencilFunctionReference(){return this._stencilFuncRef}getStencilFunctionMask(){return this._stencilFuncMask}getStencilOperationFail(){return this._stencilOpStencilFail}getStencilOperationDepthFail(){return this._stencilOpDepthFail}setAlphaConstants(e,t,i,n){throw new Error("Setting alpha blend constant color not yet implemented.")}setAlphaMode(e,t=!1){if(this._alphaMode===e)return;const i=this._getNativeAlphaMode(e);this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETBLENDMODE),this._commandBufferEncoder.encodeCommandArgAsUInt32(i),this._commandBufferEncoder.finishEncodingCommand(),t||this.setDepthWrite(0===e),this._alphaMode=e}getAlphaMode(){return this._alphaMode}setInt(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETINT),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsInt32(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setIntArray(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETINTARRAY),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsInt32s(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setIntArray2(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETINTARRAY2),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsInt32s(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setIntArray3(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETINTARRAY3),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsInt32s(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setIntArray4(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETINTARRAY4),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsInt32s(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setFloatArray(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETFLOATARRAY),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsFloat32s(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setFloatArray2(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETFLOATARRAY2),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsFloat32s(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setFloatArray3(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETFLOATARRAY3),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsFloat32s(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setFloatArray4(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETFLOATARRAY4),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsFloat32s(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setArray(e,t){return!!e&&this.setFloatArray(e,new Float32Array(t))}setArray2(e,t){return!!e&&this.setFloatArray2(e,new Float32Array(t))}setArray3(e,t){return!!e&&this.setFloatArray3(e,new Float32Array(t))}setArray4(e,t){return!!e&&this.setFloatArray4(e,new Float32Array(t))}setMatrices(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETMATRICES),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsFloat32s(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setMatrix3x3(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETMATRIX3X3),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsFloat32s(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setMatrix2x2(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETMATRIX2X2),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsFloat32s(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setFloat(e,t){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETFLOAT),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsFloat32(t),this._commandBufferEncoder.finishEncodingCommand(),!0)}setFloat2(e,t,i){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETFLOAT2),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsFloat32(t),this._commandBufferEncoder.encodeCommandArgAsFloat32(i),this._commandBufferEncoder.finishEncodingCommand(),!0)}setFloat3(e,t,i,n){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETFLOAT3),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsFloat32(t),this._commandBufferEncoder.encodeCommandArgAsFloat32(i),this._commandBufferEncoder.encodeCommandArgAsFloat32(n),this._commandBufferEncoder.finishEncodingCommand(),!0)}setFloat4(e,t,i,n,s){return!!e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETFLOAT4),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsFloat32(t),this._commandBufferEncoder.encodeCommandArgAsFloat32(i),this._commandBufferEncoder.encodeCommandArgAsFloat32(n),this._commandBufferEncoder.encodeCommandArgAsFloat32(s),this._commandBufferEncoder.finishEncodingCommand(),!0)}setColor3(e,t){return!!e&&(this.setFloat3(e,t.r,t.g,t.b),!0)}setColor4(e,t,i){return!!e&&(this.setFloat4(e,t.r,t.g,t.b,i),!0)}wipeCaches(e){this.preventCacheWipeBetweenFrames||(this.resetTextureCache(),this._currentEffect=null,e&&(this._currentProgram=null,this._stencilStateComposer.reset(),this._depthCullingState.reset(),this._alphaState.reset()),this._cachedVertexBuffers=null,this._cachedIndexBuffer=null,this._cachedEffectForVertexBuffers=null)}_createTexture(){return this._engine.createTexture()}_deleteTexture(e){e&&this._engine.deleteTexture(e)}updateDynamicTexture(e,t,i,n=!1,s){if(void 0===n&&(n=!1),e&&e._hardwareTexture){const i=t.getCanvasTexture(),n=e._hardwareTexture.underlyingResource;this._engine.copyTexture(n,i),e.isReady=!0}}createDynamicTexture(e,t,i,n){return e=Math.max(e,1),t=Math.max(t,1),this.createRawTexture(new Uint8Array(e*t*4),e,t,5,!1,!1,n)}createVideoElement(e){return this._camera?this._camera.createVideo(e):null}updateVideoTexture(e,t,i){if(e&&e._hardwareTexture&&this._camera){const n=e._hardwareTexture.underlyingResource;this._camera.updateVideoTexture(n,t,i)}}createRawTexture(e,t,i,n,s,r,o,a=null,l=0,h=0,c=!1){const u=new Ei.l(this,Ei.S.Raw);if(u.format=n,u.generateMipMaps=s,u.samplingMode=o,u.invertY=r,u.baseWidth=t,u.baseHeight=i,u.width=u.baseWidth,u.height=u.baseHeight,u._compression=a,u.type=l,u._useSRGBBuffer=this._getUseSRGBBuffer(c,!s),this.updateRawTexture(u,e,n,r,a,l,u._useSRGBBuffer),u._hardwareTexture){const e=u._hardwareTexture.underlyingResource,t=this._getNativeSamplingMode(o);this._setTextureSampling(e,t)}return this._internalTexturesCache.push(u),u}createRawTexture2DArray(e,t,i,n,s,r,o,a,l=null,h=0){const c=new Ei.l(this,Ei.S.Raw2DArray);if(c.baseWidth=t,c.baseHeight=i,c.baseDepth=n,c.width=t,c.height=i,c.depth=n,c.format=s,c.type=h,c.generateMipMaps=r,c.samplingMode=a,c.is2DArray=!0,c._hardwareTexture){const l=c._hardwareTexture.underlyingResource;this._engine.loadRawTexture2DArray(l,e,t,i,n,this._getNativeTextureFormat(s,h),r,o);const u=this._getNativeSamplingMode(a);this._setTextureSampling(l,u)}return c.isReady=!0,this._internalTexturesCache.push(c),c}updateRawTexture(e,t,i,n,s=null,r=0,o=!1){if(e){if(t&&e._hardwareTexture){const n=e._hardwareTexture.underlyingResource;this._engine.loadRawTexture(n,t,e.width,e.height,this._getNativeTextureFormat(i,r),e.generateMipMaps,e.invertY)}e.isReady=!0}}createTexture(e,t,i,n,s=3,r=null,o=null,a=null,l=null,h=null,c=null,u,d,p,f=!1){const m="data:"===(e=e||"").substr(0,5),g=m&&-1!==e.indexOf(";base64,"),v=l||new Ei.l(this,Ei.S.Url),y=e;!this._transformTextureUrl||g||l||a||(e=this._transformTextureUrl(e));const x=e.lastIndexOf("."),b=c||(x>-1?e.substring(x).toLowerCase():"");let T=null;for(const e of ue.D._TextureLoaders)if(e.canLoad(b)){T=e;break}n&&n.addPendingData(v),v.url=e,v.generateMipMaps=!t,v.samplingMode=s,v.invertY=i,v._useSRGBBuffer=this._getUseSRGBBuffer(f,t),this.doNotHandleContextLost||(v._buffer=a);let S=null;r&&!l&&(S=v.onLoadedObservable.add(r)),l||this._internalTexturesCache.push(v);const E=(i,l)=>{n&&n.removePendingData(v),e===y?(S&&v.onLoadedObservable.remove(S),A.l.UseFallbackTexture&&this.createTexture(A.l.FallbackTexture,t,v.invertY,n,s,null,o,a,v),o&&o((i||"Unknown error")+(A.l.UseFallbackTexture?" - Fallback texture was used":""),l)):(_.Y.Warn(`Failed to load ${e}, falling back to ${y}`),this.createTexture(y,t,v.invertY,n,s,r,o,a,v,h,c,u,d))};if(T)throw new Error("Loading textures from IInternalTextureLoader not yet implemented.");{const r=e=>{if(!v._hardwareTexture)return void(n&&n.removePendingData(v));const r=v._hardwareTexture.underlyingResource;this._engine.loadTexture(r,e,!t,i,f,(()=>{v.baseWidth=this._engine.getTextureWidth(r),v.baseHeight=this._engine.getTextureHeight(r),v.width=v.baseWidth,v.height=v.baseHeight,v.isReady=!0;const e=this._getNativeSamplingMode(s);this._setTextureSampling(r,e),n&&n.removePendingData(v),v.onLoadedObservable.notifyObservers(v),v.onLoadedObservable.clear()}),(()=>{throw new Error("Could not load a native texture.")}))};if(m&&a)if(a instanceof ArrayBuffer)r(new Uint8Array(a));else if(ArrayBuffer.isView(a))r(a);else{if("string"!=typeof a)throw new Error("Unsupported buffer type");r(new Uint8Array(de.w1.DecodeBase64(a)))}else g?r(new Uint8Array(de.w1.DecodeBase64(e))):this._loadFile(e,(e=>r(new Uint8Array(e))),void 0,void 0,!0,((e,t)=>{E("Unable to load "+(e&&e.responseURL,t))}))}return v}wrapNativeTexture(e,t=!1,i=3){const n=new Ys(e,this._engine),s=new Ei.l(this,Ei.S.Unknown,!0);return s._hardwareTexture=n,s.isReady=!0,s.useMipMaps=t,this.updateTextureSamplingMode(i,s),s}wrapWebGLTexture(){throw new Error("wrapWebGLTexture is not supported, use wrapNativeTexture instead.")}_createDepthStencilTexture(e,t,i){const n=i,s=new Ei.l(this,Ei.S.DepthStencil),r=e.width||e,o=e.height||e,a=this._engine.createFrameBuffer(s._hardwareTexture.underlyingResource,r,o,!0,!0);return n._framebufferDepthStencil=a,s}_releaseFramebufferObjects(e){e&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_DELETEFRAMEBUFFER),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.finishEncodingCommand())}_createImageBitmapFromSource(e,t){const i=new Promise(((t,i)=>{const n=this.createCanvasImage();n.onload=()=>{try{const e=this._engine.createImageBitmap(n);t(e)}catch(e){i(`Error loading image ${n.src} with exception: ${e}`)}},n.onerror=e=>{i(`Error loading image ${n.src} with exception: ${e}`)},n.src=e}));return i}createImageBitmap(e,t){return new Promise(((t,i)=>{if(Array.isArray(e)){const i=e;if(i.length){const e=this._engine.createImageBitmap(i[0]);if(e)return void t(e)}}i("Unsupported data for createImageBitmap.")}))}resizeImageBitmap(e,t,i){return this._engine.resizeImageBitmap(e,t,i)}createCubeTexture(e,t,i,n,s=null,r=null,o,a=null,l=!1,h=0,c=0,u=null,d,p=!1){const f=u||new Ei.l(this,Ei.S.Cube);f.isCube=!0,f.url=e,f.generateMipMaps=!n,f._lodGenerationScale=h,f._lodGenerationOffset=c,this._doNotHandleContextLost||(f._extension=a,f._files=i);const _=e.lastIndexOf(".");if(".env"===(a||(_>-1?e.substring(_).toLowerCase():""))){const t=e=>{const t=(0,Gs.qJ)(e);f.width=t.width,f.height=t.width,(0,Gs.qC)(f,t);const i=t.specular;if(!i)throw new Error("Nothing else parsed so far");f._lodGenerationScale=i.lodGenerationScale;const n=(0,Gs.Do)(e,t);f.format=5,f.type=0,f.generateMipMaps=!0,f.getEngine().updateTextureSamplingMode(Ce.x.TRILINEAR_SAMPLINGMODE,f),f._isRGBD=!0,f.invertY=!0,this._engine.loadCubeTextureWithMips(f._hardwareTexture.underlyingResource,n,!1,p,(()=>{f.isReady=!0,s&&s()}),(()=>{throw new Error("Could not load a native cube texture.")}))};if(i&&6===i.length)throw new Error("Multi-file loading not allowed on env files.");{const i=(e,t)=>{r&&e&&r(e.status+" "+e.statusText,t)};this._loadFile(e,(e=>t(new Uint8Array(e))),void 0,void 0,!0,i)}}else{if(!i||6!==i.length)throw new Error("Cannot load cubemap because 6 files were not defined");const e=[i[0],i[3],i[1],i[4],i[2],i[5]];Promise.all(e.map((e=>de.w1.LoadFileAsync(e).then((e=>new Uint8Array(e)))))).then((e=>new Promise(((t,i)=>{this._engine.loadCubeTexture(f._hardwareTexture.underlyingResource,e,!n,!0,p,t,i)})))).then((()=>{f.isReady=!0,s&&s()}),(e=>{r&&r(`Failed to load cubemap: ${e.message}`,e)}))}return this._internalTexturesCache.push(f),f}_createHardwareTexture(){return new Ys(this._createTexture(),this._engine)}_createHardwareRenderTargetWrapper(e,t,i){const n=new js(e,t,i,this);return this._renderTargetWrapperCache.push(n),n}_createInternalTexture(e,t,i=!0,n=Ei.S.Unknown){var s;let r,o=!1,a=0,l=3,h=5,c=!1,u=1;void 0!==t&&"object"==typeof t?(o=!!t.generateMipMaps,a=void 0===t.type?0:t.type,l=void 0===t.samplingMode?3:t.samplingMode,h=void 0===t.format?5:t.format,c=void 0!==t.useSRGBBuffer&&t.useSRGBBuffer,u=null!==(s=t.samples)&&void 0!==s?s:1,r=t.label):o=!!t,c&&(c=this._caps.supportSRGBBuffers&&(this.webGLVersion>1||this.isWebGPU)),(1!==a||this._caps.textureFloatLinearFiltering)&&(2!==a||this._caps.textureHalfFloatLinearFiltering)||(l=1),1!==a||this._caps.textureFloat||(a=0,_.Y.Warn("Float textures are not supported. Type forced to TEXTURETYPE_UNSIGNED_BYTE"));const d=new Ei.l(this,n),p=e.width||e,f=e.height||e,m=e.layers||0;if(0!==m)throw new Error("Texture layers are not supported in Babylon Native");const g=d._hardwareTexture.underlyingResource,v=this._getNativeTextureFormat(h,a);return this._engine.initializeTexture(g,p,f,o,v,!0,c),this._setTextureSampling(g,this._getNativeSamplingMode(l)),d._useSRGBBuffer=c,d.baseWidth=p,d.baseHeight=f,d.width=p,d.height=f,d.depth=m,d.isReady=!0,d.samples=u,d.generateMipMaps=o,d.samplingMode=l,d.type=a,d.format=h,d.label=r,this._internalTexturesCache.push(d),d}createRenderTargetTexture(e,t){var i,n;const s=this._createHardwareRenderTargetWrapper(!1,!1,e);let r,o=!0,a=!1,l=!1,h=1;void 0!==t&&"object"==typeof t&&(o=null===(i=t.generateDepthBuffer)||void 0===i||i,a=!!t.generateStencilBuffer,l=!!t.noColorAttachment,r=t.colorAttachment,h=null!==(n=t.samples)&&void 0!==n?n:1);const c=r||(l?null:this._createInternalTexture(e,t,!0,Ei.S.RenderTarget)),u=e.width||e,d=e.height||e,p=this._engine.createFrameBuffer(c?c._hardwareTexture.underlyingResource:null,u,d,a,o);return s._framebuffer=p,s._generateDepthBuffer=o,s._generateStencilBuffer=a,s.setTextures(c),this.updateRenderTargetTextureSampleCount(s,h),s}updateRenderTargetTextureSampleCount(e,t){return 1}updateTextureSamplingMode(e,t){if(t._hardwareTexture){const i=this._getNativeSamplingMode(e);this._setTextureSampling(t._hardwareTexture.underlyingResource,i)}t.samplingMode=e}bindFramebuffer(e,t,i,n,s){const r=e;if(this._currentRenderTarget&&this.unBindFramebuffer(this._currentRenderTarget),this._currentRenderTarget=e,t)throw new Error("Cuboid frame buffers are not yet supported in NativeEngine.");if(i||n)throw new Error("Required width/height for frame buffers not yet supported in NativeEngine.");r._framebufferDepthStencil?this._bindUnboundFramebuffer(r._framebufferDepthStencil):this._bindUnboundFramebuffer(r._framebuffer)}unBindFramebuffer(e,t=!1,i){this._currentRenderTarget=null,i&&i(),this._bindUnboundFramebuffer(null)}createDynamicVertexBuffer(e){return this.createVertexBuffer(e,!0)}updateDynamicIndexBuffer(e,t,i=0){const n=e,s=this._normalizeIndexData(t);n.is32Bits=4===s.BYTES_PER_ELEMENT,this._engine.updateDynamicIndexBuffer(n.nativeIndexBuffer,s.buffer,s.byteOffset,s.byteLength,i)}updateDynamicVertexBuffer(e,t,i,n){const s=e,r=ArrayBuffer.isView(t)?t:new Float32Array(t);this._engine.updateDynamicVertexBuffer(s.nativeVertexBuffer,r.buffer,r.byteOffset+(null!=i?i:0),null!=n?n:r.byteLength)}_setTexture(e,t,i=!1,n=!1){const s=this._boundUniforms[e];if(!s)return!1;if(!t)return null!=this._boundTexturesCache[e]&&(this._activeChannel=e,this._boundTexturesCache[e]=null),!1;if(t.video)this._activeChannel=e,t.update();else if(4===t.delayLoadState)return t.delayLoad(),!1;let r;return r=n?t.depthStencilTexture:t.isReady()?t.getInternalTexture():t.isCube?this.emptyCubeTexture:t.is3D?this.emptyTexture3D:t.is2DArray?this.emptyTexture2DArray:this.emptyTexture,this._activeChannel=e,!(!r||!r._hardwareTexture||(this._setTextureWrapMode(r._hardwareTexture.underlyingResource,this._getAddressMode(t.wrapU),this._getAddressMode(t.wrapV),this._getAddressMode(t.wrapR)),this._updateAnisotropicLevel(t),this._setTextureCore(s,r._hardwareTexture.underlyingResource),0))}_setTextureSampling(e,t){this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETTEXTURESAMPLING),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsUInt32(t),this._commandBufferEncoder.finishEncodingCommand()}_setTextureWrapMode(e,t,i,n){this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETTEXTUREWRAPMODE),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsUInt32(t),this._commandBufferEncoder.encodeCommandArgAsUInt32(i),this._commandBufferEncoder.encodeCommandArgAsUInt32(n),this._commandBufferEncoder.finishEncodingCommand()}_setTextureCore(e,t){this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETTEXTURE),this._commandBufferEncoder.encodeCommandArgAsNativeData(e),this._commandBufferEncoder.encodeCommandArgAsNativeData(t),this._commandBufferEncoder.finishEncodingCommand()}_updateAnisotropicLevel(e){const t=e.getInternalTexture(),i=e.anisotropicFilteringLevel;t&&t._hardwareTexture&&t._cachedAnisotropicFilteringLevel!==i&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_SETTEXTUREANISOTROPICLEVEL),this._commandBufferEncoder.encodeCommandArgAsNativeData(t._hardwareTexture.underlyingResource),this._commandBufferEncoder.encodeCommandArgAsUInt32(i),this._commandBufferEncoder.finishEncodingCommand(),t._cachedAnisotropicFilteringLevel=i)}_getAddressMode(e){switch(e){case 1:return _native.Engine.ADDRESS_MODE_WRAP;case 0:return _native.Engine.ADDRESS_MODE_CLAMP;case 2:return _native.Engine.ADDRESS_MODE_MIRROR;default:throw new Error("Unexpected wrap mode: "+e+".")}}_bindTexture(e,t){const i=this._boundUniforms[e];if(i&&t&&t._hardwareTexture){const e=t._hardwareTexture.underlyingResource;this._setTextureCore(i,e)}}_deleteBuffer(e){e.nativeIndexBuffer&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_DELETEINDEXBUFFER),this._commandBufferEncoder.encodeCommandArgAsNativeData(e.nativeIndexBuffer),this._commandBufferEncoder.finishEncodingCommand(),delete e.nativeIndexBuffer),e.nativeVertexBuffer&&(this._commandBufferEncoder.startEncodingCommand(_native.Engine.COMMAND_DELETEVERTEXBUFFER),this._commandBufferEncoder.encodeCommandArgAsNativeData(e.nativeVertexBuffer),this._commandBufferEncoder.finishEncodingCommand(),delete e.nativeVertexBuffer)}createCanvas(e,t){if(!_native.Canvas)throw new Error("Native Canvas plugin not available.");const i=new _native.Canvas;return i.width=e,i.height=t,i}createCanvasImage(){if(!_native.Canvas)throw new Error("Native Canvas plugin not available.");return new _native.Image}updateTextureData(e,t,i,n,s,r,o=0,a=0,l=!1){throw new Error("updateTextureData not implemented.")}_uploadCompressedDataToTextureDirectly(e,t,i,n,s,r=0,o=0){throw new Error("_uploadCompressedDataToTextureDirectly not implemented.")}_uploadDataToTextureDirectly(e,t,i=0,n=0){throw new Error("_uploadDataToTextureDirectly not implemented.")}_uploadArrayBufferViewToTexture(e,t,i=0,n=0){throw new Error("_uploadArrayBufferViewToTexture not implemented.")}_uploadImageToTexture(e,t,i=0,n=0){throw new Error("_uploadArrayBufferViewToTexture not implemented.")}_getNativeSamplingMode(e){switch(e){case 1:return _native.Engine.TEXTURE_NEAREST_NEAREST;case 2:return _native.Engine.TEXTURE_LINEAR_LINEAR;case 3:return _native.Engine.TEXTURE_LINEAR_LINEAR_MIPLINEAR;case 4:return _native.Engine.TEXTURE_NEAREST_NEAREST_MIPNEAREST;case 5:return _native.Engine.TEXTURE_NEAREST_LINEAR_MIPNEAREST;case 6:return _native.Engine.TEXTURE_NEAREST_LINEAR_MIPLINEAR;case 7:return _native.Engine.TEXTURE_NEAREST_LINEAR;case 8:return _native.Engine.TEXTURE_NEAREST_NEAREST_MIPLINEAR;case 9:return _native.Engine.TEXTURE_LINEAR_NEAREST_MIPNEAREST;case 10:return _native.Engine.TEXTURE_LINEAR_NEAREST_MIPLINEAR;case 11:return _native.Engine.TEXTURE_LINEAR_LINEAR_MIPNEAREST;case 12:return _native.Engine.TEXTURE_LINEAR_NEAREST;default:throw new Error(`Unsupported sampling mode: ${e}.`)}}_getStencilFunc(e){switch(e){case 513:return _native.Engine.STENCIL_TEST_LESS;case 515:return _native.Engine.STENCIL_TEST_LEQUAL;case 514:return _native.Engine.STENCIL_TEST_EQUAL;case 518:return _native.Engine.STENCIL_TEST_GEQUAL;case 516:return _native.Engine.STENCIL_TEST_GREATER;case 517:return _native.Engine.STENCIL_TEST_NOTEQUAL;case 512:return _native.Engine.STENCIL_TEST_NEVER;case 519:return _native.Engine.STENCIL_TEST_ALWAYS;default:throw new Error(`Unsupported stencil func mode: ${e}.`)}}_getStencilOpFail(e){switch(e){case 7680:return _native.Engine.STENCIL_OP_FAIL_S_KEEP;case 0:return _native.Engine.STENCIL_OP_FAIL_S_ZERO;case 7681:return _native.Engine.STENCIL_OP_FAIL_S_REPLACE;case 7682:return _native.Engine.STENCIL_OP_FAIL_S_INCR;case 7683:return _native.Engine.STENCIL_OP_FAIL_S_DECR;case 5386:return _native.Engine.STENCIL_OP_FAIL_S_INVERT;case 34055:return _native.Engine.STENCIL_OP_FAIL_S_INCRSAT;case 34056:return _native.Engine.STENCIL_OP_FAIL_S_DECRSAT;default:throw new Error(`Unsupported stencil OpFail mode: ${e}.`)}}_getStencilDepthFail(e){switch(e){case 7680:return _native.Engine.STENCIL_OP_FAIL_Z_KEEP;case 0:return _native.Engine.STENCIL_OP_FAIL_Z_ZERO;case 7681:return _native.Engine.STENCIL_OP_FAIL_Z_REPLACE;case 7682:return _native.Engine.STENCIL_OP_FAIL_Z_INCR;case 7683:return _native.Engine.STENCIL_OP_FAIL_Z_DECR;case 5386:return _native.Engine.STENCIL_OP_FAIL_Z_INVERT;case 34055:return _native.Engine.STENCIL_OP_FAIL_Z_INCRSAT;case 34056:return _native.Engine.STENCIL_OP_FAIL_Z_DECRSAT;default:throw new Error(`Unsupported stencil depthFail mode: ${e}.`)}}_getStencilDepthPass(e){switch(e){case 7680:return _native.Engine.STENCIL_OP_PASS_Z_KEEP;case 0:return _native.Engine.STENCIL_OP_PASS_Z_ZERO;case 7681:return _native.Engine.STENCIL_OP_PASS_Z_REPLACE;case 7682:return _native.Engine.STENCIL_OP_PASS_Z_INCR;case 7683:return _native.Engine.STENCIL_OP_PASS_Z_DECR;case 5386:return _native.Engine.STENCIL_OP_PASS_Z_INVERT;case 34055:return _native.Engine.STENCIL_OP_PASS_Z_INCRSAT;case 34056:return _native.Engine.STENCIL_OP_PASS_Z_DECRSAT;default:throw new Error(`Unsupported stencil opPass mode: ${e}.`)}}_getNativeTextureFormat(e,t){if(4==e&&0==t)return _native.Engine.TEXTURE_FORMAT_RGB8;if(5==e&&0==t)return _native.Engine.TEXTURE_FORMAT_RGBA8;if(5==e&&2==t)return _native.Engine.TEXTURE_FORMAT_RGBA16F;if(5==e&&1==t)return _native.Engine.TEXTURE_FORMAT_RGBA32F;throw new Hs.LH(`Unsupported texture format or type: format ${e}, type ${t}.`,Hs.SM.UnsupportedTextureError)}_getNativeAlphaMode(e){switch(e){case 0:return _native.Engine.ALPHA_DISABLE;case 1:return _native.Engine.ALPHA_ADD;case 2:return _native.Engine.ALPHA_COMBINE;case 3:return _native.Engine.ALPHA_SUBTRACT;case 4:return _native.Engine.ALPHA_MULTIPLY;case 5:return _native.Engine.ALPHA_MAXIMIZED;case 6:return _native.Engine.ALPHA_ONEONE;case 7:return _native.Engine.ALPHA_PREMULTIPLIED;case 8:return _native.Engine.ALPHA_PREMULTIPLIED_PORTERDUFF;case 9:return _native.Engine.ALPHA_INTERPOLATE;case 10:return _native.Engine.ALPHA_SCREENMODE;default:throw new Error(`Unsupported alpha mode: ${e}.`)}}_getNativeAttribType(e){switch(e){case qe.o.BYTE:return _native.Engine.ATTRIB_TYPE_INT8;case qe.o.UNSIGNED_BYTE:return _native.Engine.ATTRIB_TYPE_UINT8;case qe.o.SHORT:return _native.Engine.ATTRIB_TYPE_INT16;case qe.o.UNSIGNED_SHORT:return _native.Engine.ATTRIB_TYPE_UINT16;case qe.o.FLOAT:return _native.Engine.ATTRIB_TYPE_FLOAT;default:throw new Error(`Unsupported attribute type: ${e}.`)}}getFontOffset(e){return{ascent:0,height:0,descent:0}}_readTexturePixels(e,t,i,n,s,r,o,a,l,h){var c,u,d,p;if(void 0!==n&&-1!==n)throw new Error(`Reading cubemap faces is not supported, but faceIndex is ${n}.`);return this._engine.readTexture(null===(c=e._hardwareTexture)||void 0===c?void 0:c.underlyingResource,null!=s?s:0,null!=l?l:0,null!=h?h:0,t,i,null!==(u=null==r?void 0:r.buffer)&&void 0!==u?u:null,null!==(d=null==r?void 0:r.byteOffset)&&void 0!==d?d:0,null!==(p=null==r?void 0:r.byteLength)&&void 0!==p?p:0).then((e=>(r||(r=new Uint8Array(e)),r)))}}Js.PROTOCOL_VERSION=8,Js._createNativeDataStream=function(){return _native.NativeDataStream.VALIDATION_ENABLED?new er:new ks};class er extends ks{constructor(){super()}writeUint32(e){super.writeUint32(_native.NativeDataStream.VALIDATION_UINT_32),super.writeUint32(e)}writeInt32(e){super.writeUint32(_native.NativeDataStream.VALIDATION_INT_32),super.writeInt32(e)}writeFloat32(e){super.writeUint32(_native.NativeDataStream.VALIDATION_FLOAT_32),super.writeFloat32(e)}writeUint32Array(e){super.writeUint32(_native.NativeDataStream.VALIDATION_UINT_32_ARRAY),super.writeUint32Array(e)}writeInt32Array(e){super.writeUint32(_native.NativeDataStream.VALIDATION_INT_32_ARRAY),super.writeInt32Array(e)}writeFloat32Array(e){super.writeUint32(_native.NativeDataStream.VALIDATION_FLOAT_32_ARRAY),super.writeFloat32Array(e)}writeNativeData(e){super.writeUint32(_native.NativeDataStream.VALIDATION_NATIVE_DATA),super.writeNativeData(e)}writeBoolean(e){super.writeUint32(_native.NativeDataStream.VALIDATION_BOOLEAN),super.writeBoolean(e)}}var tr,ir,nr,sr,rr,or,ar,lr,hr,cr,ur,dr,pr,fr,_r,mr,gr,vr,yr,xr,br,Tr,Sr,Er,Cr,Ar,Pr,Rr,Mr,Ir,Dr,Or,wr,Nr,Fr,Lr,Br,Ur,Vr,kr,Gr=i(6913);!function(e){e.LowPower="low-power",e.HighPerformance="high-performance"}(tr||(tr={})),function(e){e.DepthClipControl="depth-clip-control",e.Depth32FloatStencil8="depth32float-stencil8",e.TextureCompressionBC="texture-compression-bc",e.TextureCompressionETC2="texture-compression-etc2",e.TextureCompressionASTC="texture-compression-astc",e.TimestampQuery="timestamp-query",e.IndirectFirstInstance="indirect-first-instance",e.ShaderF16="shader-f16",e.RG11B10UFloatRenderable="rg11b10ufloat-renderable",e.BGRA8UnormStorage="bgra8unorm-storage",e.Float32Filterable="float32-filterable"}(ir||(ir={})),function(e){e.Unmapped="unmapped",e.Pending="pending",e.Mapped="mapped"}(nr||(nr={})),function(e){e[e.MapRead=1]="MapRead",e[e.MapWrite=2]="MapWrite",e[e.CopySrc=4]="CopySrc",e[e.CopyDst=8]="CopyDst",e[e.Index=16]="Index",e[e.Vertex=32]="Vertex",e[e.Uniform=64]="Uniform",e[e.Storage=128]="Storage",e[e.Indirect=256]="Indirect",e[e.QueryResolve=512]="QueryResolve"}(sr||(sr={})),function(e){e[e.Read=1]="Read",e[e.Write=2]="Write"}(rr||(rr={})),function(e){e.E1d="1d",e.E2d="2d",e.E3d="3d"}(or||(or={})),function(e){e[e.CopySrc=1]="CopySrc",e[e.CopyDst=2]="CopyDst",e[e.TextureBinding=4]="TextureBinding",e[e.StorageBinding=8]="StorageBinding",e[e.RenderAttachment=16]="RenderAttachment"}(ar||(ar={})),function(e){e.E1d="1d",e.E2d="2d",e.E2dArray="2d-array",e.Cube="cube",e.CubeArray="cube-array",e.E3d="3d"}(lr||(lr={})),function(e){e.All="all",e.StencilOnly="stencil-only",e.DepthOnly="depth-only"}(hr||(hr={})),function(e){e.R8Unorm="r8unorm",e.R8Snorm="r8snorm",e.R8Uint="r8uint",e.R8Sint="r8sint",e.R16Uint="r16uint",e.R16Sint="r16sint",e.R16Float="r16float",e.RG8Unorm="rg8unorm",e.RG8Snorm="rg8snorm",e.RG8Uint="rg8uint",e.RG8Sint="rg8sint",e.R32Uint="r32uint",e.R32Sint="r32sint",e.R32Float="r32float",e.RG16Uint="rg16uint",e.RG16Sint="rg16sint",e.RG16Float="rg16float",e.RGBA8Unorm="rgba8unorm",e.RGBA8UnormSRGB="rgba8unorm-srgb",e.RGBA8Snorm="rgba8snorm",e.RGBA8Uint="rgba8uint",e.RGBA8Sint="rgba8sint",e.BGRA8Unorm="bgra8unorm",e.BGRA8UnormSRGB="bgra8unorm-srgb",e.RGB9E5UFloat="rgb9e5ufloat",e.RGB10A2Unorm="rgb10a2unorm",e.RG11B10UFloat="rg11b10ufloat",e.RG32Uint="rg32uint",e.RG32Sint="rg32sint",e.RG32Float="rg32float",e.RGBA16Uint="rgba16uint",e.RGBA16Sint="rgba16sint",e.RGBA16Float="rgba16float",e.RGBA32Uint="rgba32uint",e.RGBA32Sint="rgba32sint",e.RGBA32Float="rgba32float",e.Stencil8="stencil8",e.Depth16Unorm="depth16unorm",e.Depth24Plus="depth24plus",e.Depth24PlusStencil8="depth24plus-stencil8",e.Depth32Float="depth32float",e.BC1RGBAUnorm="bc1-rgba-unorm",e.BC1RGBAUnormSRGB="bc1-rgba-unorm-srgb",e.BC2RGBAUnorm="bc2-rgba-unorm",e.BC2RGBAUnormSRGB="bc2-rgba-unorm-srgb",e.BC3RGBAUnorm="bc3-rgba-unorm",e.BC3RGBAUnormSRGB="bc3-rgba-unorm-srgb",e.BC4RUnorm="bc4-r-unorm",e.BC4RSnorm="bc4-r-snorm",e.BC5RGUnorm="bc5-rg-unorm",e.BC5RGSnorm="bc5-rg-snorm",e.BC6HRGBUFloat="bc6h-rgb-ufloat",e.BC6HRGBFloat="bc6h-rgb-float",e.BC7RGBAUnorm="bc7-rgba-unorm",e.BC7RGBAUnormSRGB="bc7-rgba-unorm-srgb",e.ETC2RGB8Unorm="etc2-rgb8unorm",e.ETC2RGB8UnormSRGB="etc2-rgb8unorm-srgb",e.ETC2RGB8A1Unorm="etc2-rgb8a1unorm",e.ETC2RGB8A1UnormSRGB="etc2-rgb8a1unorm-srgb",e.ETC2RGBA8Unorm="etc2-rgba8unorm",e.ETC2RGBA8UnormSRGB="etc2-rgba8unorm-srgb",e.EACR11Unorm="eac-r11unorm",e.EACR11Snorm="eac-r11snorm",e.EACRG11Unorm="eac-rg11unorm",e.EACRG11Snorm="eac-rg11snorm",e.ASTC4x4Unorm="astc-4x4-unorm",e.ASTC4x4UnormSRGB="astc-4x4-unorm-srgb",e.ASTC5x4Unorm="astc-5x4-unorm",e.ASTC5x4UnormSRGB="astc-5x4-unorm-srgb",e.ASTC5x5Unorm="astc-5x5-unorm",e.ASTC5x5UnormSRGB="astc-5x5-unorm-srgb",e.ASTC6x5Unorm="astc-6x5-unorm",e.ASTC6x5UnormSRGB="astc-6x5-unorm-srgb",e.ASTC6x6Unorm="astc-6x6-unorm",e.ASTC6x6UnormSRGB="astc-6x6-unorm-srgb",e.ASTC8x5Unorm="astc-8x5-unorm",e.ASTC8x5UnormSRGB="astc-8x5-unorm-srgb",e.ASTC8x6Unorm="astc-8x6-unorm",e.ASTC8x6UnormSRGB="astc-8x6-unorm-srgb",e.ASTC8x8Unorm="astc-8x8-unorm",e.ASTC8x8UnormSRGB="astc-8x8-unorm-srgb",e.ASTC10x5Unorm="astc-10x5-unorm",e.ASTC10x5UnormSRGB="astc-10x5-unorm-srgb",e.ASTC10x6Unorm="astc-10x6-unorm",e.ASTC10x6UnormSRGB="astc-10x6-unorm-srgb",e.ASTC10x8Unorm="astc-10x8-unorm",e.ASTC10x8UnormSRGB="astc-10x8-unorm-srgb",e.ASTC10x10Unorm="astc-10x10-unorm",e.ASTC10x10UnormSRGB="astc-10x10-unorm-srgb",e.ASTC12x10Unorm="astc-12x10-unorm",e.ASTC12x10UnormSRGB="astc-12x10-unorm-srgb",e.ASTC12x12Unorm="astc-12x12-unorm",e.ASTC12x12UnormSRGB="astc-12x12-unorm-srgb",e.Depth24UnormStencil8="depth24unorm-stencil8",e.Depth32FloatStencil8="depth32float-stencil8"}(cr||(cr={})),function(e){e.ClampToEdge="clamp-to-edge",e.Repeat="repeat",e.MirrorRepeat="mirror-repeat"}(ur||(ur={})),function(e){e.Nearest="nearest",e.Linear="linear"}(dr||(dr={})),function(e){e.Nearest="nearest",e.Linear="linear"}(pr||(pr={})),function(e){e.Never="never",e.Less="less",e.Equal="equal",e.LessEqual="less-equal",e.Greater="greater",e.NotEqual="not-equal",e.GreaterEqual="greater-equal",e.Always="always"}(fr||(fr={})),function(e){e[e.Vertex=1]="Vertex",e[e.Fragment=2]="Fragment",e[e.Compute=4]="Compute"}(_r||(_r={})),function(e){e.Uniform="uniform",e.Storage="storage",e.ReadOnlyStorage="read-only-storage"}(mr||(mr={})),function(e){e.Filtering="filtering",e.NonFiltering="non-filtering",e.Comparison="comparison"}(gr||(gr={})),function(e){e.Float="float",e.UnfilterableFloat="unfilterable-float",e.Depth="depth",e.Sint="sint",e.Uint="uint"}(vr||(vr={})),function(e){e.WriteOnly="write-only"}(yr||(yr={})),function(e){e.Error="error",e.Warning="warning",e.Info="info"}(xr||(xr={})),function(e){e.Validation="validation",e.Internal="internal"}(br||(br={})),function(e){e.Auto="auto"}(Tr||(Tr={})),function(e){e.PointList="point-list",e.LineList="line-list",e.LineStrip="line-strip",e.TriangleList="triangle-list",e.TriangleStrip="triangle-strip"}(Sr||(Sr={})),function(e){e.CCW="ccw",e.CW="cw"}(Er||(Er={})),function(e){e.None="none",e.Front="front",e.Back="back"}(Cr||(Cr={})),function(e){e[e.Red=1]="Red",e[e.Green=2]="Green",e[e.Blue=4]="Blue",e[e.Alpha=8]="Alpha",e[e.All=15]="All"}(Ar||(Ar={})),function(e){e.Zero="zero",e.One="one",e.Src="src",e.OneMinusSrc="one-minus-src",e.SrcAlpha="src-alpha",e.OneMinusSrcAlpha="one-minus-src-alpha",e.Dst="dst",e.OneMinusDst="one-minus-dst",e.DstAlpha="dst-alpha",e.OneMinusDstAlpha="one-minus-dst-alpha",e.SrcAlphaSaturated="src-alpha-saturated",e.Constant="constant",e.OneMinusConstant="one-minus-constant"}(Pr||(Pr={})),function(e){e.Add="add",e.Subtract="subtract",e.ReverseSubtract="reverse-subtract",e.Min="min",e.Max="max"}(Rr||(Rr={})),function(e){e.Keep="keep",e.Zero="zero",e.Replace="replace",e.Invert="invert",e.IncrementClamp="increment-clamp",e.DecrementClamp="decrement-clamp",e.IncrementWrap="increment-wrap",e.DecrementWrap="decrement-wrap"}(Mr||(Mr={})),function(e){e.Uint16="uint16",e.Uint32="uint32"}(Ir||(Ir={})),function(e){e.Uint8x2="uint8x2",e.Uint8x4="uint8x4",e.Sint8x2="sint8x2",e.Sint8x4="sint8x4",e.Unorm8x2="unorm8x2",e.Unorm8x4="unorm8x4",e.Snorm8x2="snorm8x2",e.Snorm8x4="snorm8x4",e.Uint16x2="uint16x2",e.Uint16x4="uint16x4",e.Sint16x2="sint16x2",e.Sint16x4="sint16x4",e.Unorm16x2="unorm16x2",e.Unorm16x4="unorm16x4",e.Snorm16x2="snorm16x2",e.Snorm16x4="snorm16x4",e.Float16x2="float16x2",e.Float16x4="float16x4",e.Float32="float32",e.Float32x2="float32x2",e.Float32x3="float32x3",e.Float32x4="float32x4",e.Uint32="uint32",e.Uint32x2="uint32x2",e.Uint32x3="uint32x3",e.Uint32x4="uint32x4",e.Sint32="sint32",e.Sint32x2="sint32x2",e.Sint32x3="sint32x3",e.Sint32x4="sint32x4"}(Dr||(Dr={})),function(e){e.Vertex="vertex",e.Instance="instance"}(Or||(Or={})),function(e){e.Beginning="beginning",e.End="end"}(wr||(wr={})),function(e){e.Beginning="beginning",e.End="end"}(Nr||(Nr={})),function(e){e.Load="load",e.Clear="clear"}(Fr||(Fr={})),function(e){e.Store="store",e.Discard="discard"}(Lr||(Lr={})),function(e){e.Occlusion="occlusion",e.Timestamp="timestamp"}(Br||(Br={})),function(e){e.Opaque="opaque",e.Premultiplied="premultiplied"}(Ur||(Ur={})),function(e){e.Unknown="unknown",e.Destroyed="destroyed"}(Vr||(Vr={})),function(e){e.Validation="validation",e.OutOfMemory="out-of-memory",e.Internal="internal"}(kr||(kr={}));class zr{constructor(){this.shaderLanguage=Cn.x.GLSL}_addUniformToLeftOverUBO(e,t,i){let n=0;[e,t,n]=this._getArraySize(e,t,i);for(let t=0;t<this._webgpuProcessingContext.leftOverUniforms.length;t++)if(this._webgpuProcessingContext.leftOverUniforms[t].name===e)return;this._webgpuProcessingContext.leftOverUniforms.push({name:e,type:t,length:n})}_buildLeftOverUBO(){if(!this._webgpuProcessingContext.leftOverUniforms.length)return"";const e=zr.LeftOvertUBOName;let t=this._webgpuProcessingContext.availableBuffers[e];return t||(t={binding:this._webgpuProcessingContext.getNextFreeUBOBinding()},this._webgpuProcessingContext.availableBuffers[e]=t,this._addBufferBindingDescription(e,t,mr.Uniform,!0),this._addBufferBindingDescription(e,t,mr.Uniform,!1)),this._generateLeftOverUBOCode(e,t)}_collectBindingNames(){for(let e=0;e<this._webgpuProcessingContext.bindGroupLayoutEntries.length;e++){const t=this._webgpuProcessingContext.bindGroupLayoutEntries[e];if(void 0!==t)for(let i=0;i<t.length;i++){const t=this._webgpuProcessingContext.bindGroupLayoutEntries[e][i],n=this._webgpuProcessingContext.bindGroupLayoutEntryInfo[e][t.binding].name,s=this._webgpuProcessingContext.bindGroupLayoutEntryInfo[e][t.binding].nameInArrayOfTexture;t&&(t.texture||t.externalTexture||t.storageTexture?this._webgpuProcessingContext.textureNames.push(s):t.sampler?this._webgpuProcessingContext.samplerNames.push(n):t.buffer&&this._webgpuProcessingContext.bufferNames.push(n))}else this._webgpuProcessingContext.bindGroupLayoutEntries[e]=[]}}_preCreateBindGroupEntries(){const e=this._webgpuProcessingContext.bindGroupEntries;for(let t=0;t<this._webgpuProcessingContext.bindGroupLayoutEntries.length;t++){const i=this._webgpuProcessingContext.bindGroupLayoutEntries[t],n=[];for(let e=0;e<i.length;e++){const i=this._webgpuProcessingContext.bindGroupLayoutEntries[t][e];i.sampler||i.texture||i.storageTexture||i.externalTexture?n.push({binding:i.binding,resource:void 0}):i.buffer&&n.push({binding:i.binding,resource:{buffer:void 0,offset:0,size:0}})}e[t]=n}}_addTextureBindingDescription(e,t,i,n,s,r){let{groupIndex:o,bindingIndex:a}=t.textures[i];if(this._webgpuProcessingContext.bindGroupLayoutEntries[o]||(this._webgpuProcessingContext.bindGroupLayoutEntries[o]=[],this._webgpuProcessingContext.bindGroupLayoutEntryInfo[o]=[]),!this._webgpuProcessingContext.bindGroupLayoutEntryInfo[o][a]){let r;r=null===n?this._webgpuProcessingContext.bindGroupLayoutEntries[o].push({binding:a,visibility:0,externalTexture:{}}):s?this._webgpuProcessingContext.bindGroupLayoutEntries[o].push({binding:a,visibility:0,storageTexture:{access:yr.WriteOnly,format:s,viewDimension:n}}):this._webgpuProcessingContext.bindGroupLayoutEntries[o].push({binding:a,visibility:0,texture:{sampleType:t.sampleType,viewDimension:n,multisampled:!1}});const l=t.isTextureArray?e+i:e;this._webgpuProcessingContext.bindGroupLayoutEntryInfo[o][a]={name:e,index:r-1,nameInArrayOfTexture:l}}a=this._webgpuProcessingContext.bindGroupLayoutEntryInfo[o][a].index,this._webgpuProcessingContext.bindGroupLayoutEntries[o][a].visibility|=r?_r.Vertex:_r.Fragment}_addSamplerBindingDescription(e,t,i){let{groupIndex:n,bindingIndex:s}=t.binding;if(this._webgpuProcessingContext.bindGroupLayoutEntries[n]||(this._webgpuProcessingContext.bindGroupLayoutEntries[n]=[],this._webgpuProcessingContext.bindGroupLayoutEntryInfo[n]=[]),!this._webgpuProcessingContext.bindGroupLayoutEntryInfo[n][s]){const i=this._webgpuProcessingContext.bindGroupLayoutEntries[n].push({binding:s,visibility:0,sampler:{type:t.type}});this._webgpuProcessingContext.bindGroupLayoutEntryInfo[n][s]={name:e,index:i-1}}s=this._webgpuProcessingContext.bindGroupLayoutEntryInfo[n][s].index,this._webgpuProcessingContext.bindGroupLayoutEntries[n][s].visibility|=i?_r.Vertex:_r.Fragment}_addBufferBindingDescription(e,t,i,n){let{groupIndex:s,bindingIndex:r}=t.binding;if(this._webgpuProcessingContext.bindGroupLayoutEntries[s]||(this._webgpuProcessingContext.bindGroupLayoutEntries[s]=[],this._webgpuProcessingContext.bindGroupLayoutEntryInfo[s]=[]),!this._webgpuProcessingContext.bindGroupLayoutEntryInfo[s][r]){const t=this._webgpuProcessingContext.bindGroupLayoutEntries[s].push({binding:r,visibility:0,buffer:{type:i}});this._webgpuProcessingContext.bindGroupLayoutEntryInfo[s][r]={name:e,index:t-1}}r=this._webgpuProcessingContext.bindGroupLayoutEntryInfo[s][r].index,this._webgpuProcessingContext.bindGroupLayoutEntries[s][r].visibility|=n?_r.Vertex:_r.Fragment}_injectStartingAndEndingCode(e,t,i,n){let s=e.indexOf(t);if(s<0)return console.error('No "main" function found in shader code! Processing aborted.'),e;if(i){for(;s++<e.length&&"{"!=e.charAt(s););if(s<e.length){const t=e.substring(0,s+1),n=e.substring(s+1);e=t+i+n}}if(n){const t=e.lastIndexOf("}");e=e.substring(0,t),e+=n+"\n}"}return e}}zr.AutoSamplerSuffix="Sampler",zr.LeftOvertUBOName="LeftOver",zr.InternalsUBOName="Internals",zr.UniformSizes={bool:1,int:1,float:1,vec2:2,ivec2:2,vec3:3,ivec3:3,vec4:4,ivec4:4,mat2:4,mat3:12,mat4:16,i32:1,u32:1,f32:1,mat2x2:4,mat3x3:12,mat4x4:16},zr._SamplerFunctionByWebGLSamplerType={sampler2D:"sampler2D",sampler2DArray:"sampler2DArray",sampler2DShadow:"sampler2DShadow",sampler2DArrayShadow:"sampler2DArrayShadow",samplerCube:"samplerCube",sampler3D:"sampler3D"},zr._TextureTypeByWebGLSamplerType={sampler2D:"texture2D",sampler2DArray:"texture2DArray",sampler2DShadow:"texture2D",sampler2DArrayShadow:"texture2DArray",samplerCube:"textureCube",samplerCubeArray:"textureCubeArray",sampler3D:"texture3D"},zr._GpuTextureViewDimensionByWebGPUTextureType={textureCube:lr.Cube,textureCubeArray:lr.CubeArray,texture2D:lr.E2d,texture2DArray:lr.E2dArray,texture3D:lr.E3d},zr._SamplerTypeByWebGLSamplerType={sampler2DShadow:"samplerShadow",sampler2DArrayShadow:"samplerShadow"},zr._IsComparisonSamplerByWebGPUSamplerType={samplerShadow:!0,samplerArrayShadow:!0,sampler:!1};class Wr{get isAsync(){return!1}get isReady(){return!!this.stages}constructor(e,t){this._name="unnamed",this.shaderProcessingContext=e,this._leftOverUniformsByName={},this.engine=t}_handlesSpectorRebuildCallback(){}_fillEffectInformation(e,t,i,n,s,r,o,a){const l=this.engine;e._fragmentSourceCode="",e._vertexSourceCode="";const h=this.shaderProcessingContext.availableTextures;let c;for(c=0;c<s.length;c++){const e=s[c],t=h[s[c]];null==t||null==t?(s.splice(c,1),c--):r[e]=c}for(const e of l.getAttributes(this,o))a.push(e);this.buildUniformLayout();const u=[],d=[];for(c=0;c<o.length;c++){const e=a[c];e>=0&&(u.push(o[c]),d.push(e))}this.shaderProcessingContext.attributeNamesFromEffect=u,this.shaderProcessingContext.attributeLocationsFromEffect=d}buildUniformLayout(){if(this.shaderProcessingContext.leftOverUniforms.length){this.uniformBuffer=new Ci.M(this.engine,void 0,void 0,"leftOver-"+this._name);for(const e of this.shaderProcessingContext.leftOverUniforms){const t=e.type.replace(/^(.*?)(<.*>)?$/,"$1"),i=zr.UniformSizes[t];this.uniformBuffer.addUniform(e.name,i,e.length),this._leftOverUniformsByName[e.name]=e.type}this.uniformBuffer.create()}}dispose(){this.uniformBuffer&&this.uniformBuffer.dispose()}setInt(e,t){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateInt(e,t)}setInt2(e,t,i){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateInt2(e,t,i)}setInt3(e,t,i,n){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateInt3(e,t,i,n)}setInt4(e,t,i,n,s){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateInt4(e,t,i,n,s)}setIntArray(e,t){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateIntArray(e,t)}setIntArray2(e,t){this.setIntArray(e,t)}setIntArray3(e,t){this.setIntArray(e,t)}setIntArray4(e,t){this.setIntArray(e,t)}setUInt(e,t){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateUInt(e,t)}setUInt2(e,t,i){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateUInt2(e,t,i)}setUInt3(e,t,i,n){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateUInt3(e,t,i,n)}setUInt4(e,t,i,n,s){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateUInt4(e,t,i,n,s)}setUIntArray(e,t){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateUIntArray(e,t)}setUIntArray2(e,t){this.setUIntArray(e,t)}setUIntArray3(e,t){this.setUIntArray(e,t)}setUIntArray4(e,t){this.setUIntArray(e,t)}setArray(e,t){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateArray(e,t)}setArray2(e,t){this.setArray(e,t)}setArray3(e,t){this.setArray(e,t)}setArray4(e,t){this.setArray(e,t)}setMatrices(e,t){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateMatrices(e,t)}setMatrix(e,t){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateMatrix(e,t)}setMatrix3x3(e,t){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateMatrix3x3(e,t)}setMatrix2x2(e,t){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateMatrix2x2(e,t)}setFloat(e,t){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateFloat(e,t)}setVector2(e,t){this.setFloat2(e,t.x,t.y)}setFloat2(e,t,i){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateFloat2(e,t,i)}setVector3(e,t){this.setFloat3(e,t.x,t.y,t.z)}setFloat3(e,t,i,n){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateFloat3(e,t,i,n)}setVector4(e,t){this.setFloat4(e,t.x,t.y,t.z,t.w)}setQuaternion(e,t){this.setFloat4(e,t.x,t.y,t.z,t.w)}setFloat4(e,t,i,n,s){this.uniformBuffer&&this._leftOverUniformsByName[e]&&this.uniformBuffer.updateFloat4(e,t,i,n,s)}setColor3(e,t){this.setFloat3(e,t.r,t.g,t.b)}setColor4(e,t,i){this.setFloat4(e,t.r,t.g,t.b,i)}setDirectColor4(e,t){this.setFloat4(e,t.r,t.g,t.b,t.a)}_getVertexShaderCode(){var e;return null===(e=this.sources)||void 0===e?void 0:e.vertex}_getFragmentShaderCode(){var e;return null===(e=this.sources)||void 0===e?void 0:e.fragment}}const Hr={mat2:2,mat3:3,mat4:4,mat2x2:2,mat3x3:3,mat4x4:4};class Xr{static get KnownUBOs(){return Xr._SimplifiedKnownBindings?Xr._SimplifiedKnownUBOs:Xr._KnownUBOs}constructor(e){this.shaderLanguage=e,this._attributeNextLocation=0,this._varyingNextLocation=0,this.freeGroupIndex=0,this.freeBindingIndex=0,this.availableVaryings={},this.availableAttributes={},this.availableBuffers={},this.availableTextures={},this.availableSamplers={},this.orderedAttributes=[],this.bindGroupLayoutEntries=[],this.bindGroupLayoutEntryInfo=[],this.bindGroupEntries=[],this.bufferNames=[],this.textureNames=[],this.samplerNames=[],this.leftOverUniforms=[],this._findStartingGroupBinding()}_findStartingGroupBinding(){const e=Xr.KnownUBOs,t=[];for(const i in e){const n=e[i].binding;-1!==n.groupIndex&&(void 0===t[n.groupIndex]?t[n.groupIndex]=n.bindingIndex:t[n.groupIndex]=Math.max(t[n.groupIndex],n.bindingIndex))}this.freeGroupIndex=t.length-1,0===this.freeGroupIndex?(this.freeGroupIndex++,this.freeBindingIndex=0):this.freeBindingIndex=t[t.length-1]+1}getAttributeNextLocation(e,t=0){var i;const n=this._attributeNextLocation;return this._attributeNextLocation+=(null!==(i=Hr[e])&&void 0!==i?i:1)*(t||1),n}getVaryingNextLocation(e,t=0){var i;const n=this._varyingNextLocation;return this._varyingNextLocation+=(null!==(i=Hr[e])&&void 0!==i?i:1)*(t||1),n}getNextFreeUBOBinding(){return this._getNextFreeBinding(1)}_getNextFreeBinding(e){if(this.freeBindingIndex>65536-e&&(this.freeGroupIndex++,this.freeBindingIndex=0),4===this.freeGroupIndex)throw"Too many textures or UBOs have been declared and it is not supported in WebGPU.";const t={groupIndex:this.freeGroupIndex,bindingIndex:this.freeBindingIndex};return this.freeBindingIndex+=e,t}}Xr._SimplifiedKnownBindings=!0,Xr._SimplifiedKnownUBOs={Scene:{binding:{groupIndex:0,bindingIndex:0}},Light0:{binding:{groupIndex:-1,bindingIndex:-1}},Light1:{binding:{groupIndex:-1,bindingIndex:-1}},Light2:{binding:{groupIndex:-1,bindingIndex:-1}},Light3:{binding:{groupIndex:-1,bindingIndex:-1}},Light4:{binding:{groupIndex:-1,bindingIndex:-1}},Light5:{binding:{groupIndex:-1,bindingIndex:-1}},Light6:{binding:{groupIndex:-1,bindingIndex:-1}},Light7:{binding:{groupIndex:-1,bindingIndex:-1}},Light8:{binding:{groupIndex:-1,bindingIndex:-1}},Light9:{binding:{groupIndex:-1,bindingIndex:-1}},Light10:{binding:{groupIndex:-1,bindingIndex:-1}},Light11:{binding:{groupIndex:-1,bindingIndex:-1}},Light12:{binding:{groupIndex:-1,bindingIndex:-1}},Light13:{binding:{groupIndex:-1,bindingIndex:-1}},Light14:{binding:{groupIndex:-1,bindingIndex:-1}},Light15:{binding:{groupIndex:-1,bindingIndex:-1}},Light16:{binding:{groupIndex:-1,bindingIndex:-1}},Light17:{binding:{groupIndex:-1,bindingIndex:-1}},Light18:{binding:{groupIndex:-1,bindingIndex:-1}},Light19:{binding:{groupIndex:-1,bindingIndex:-1}},Light20:{binding:{groupIndex:-1,bindingIndex:-1}},Light21:{binding:{groupIndex:-1,bindingIndex:-1}},Light22:{binding:{groupIndex:-1,bindingIndex:-1}},Light23:{binding:{groupIndex:-1,bindingIndex:-1}},Light24:{binding:{groupIndex:-1,bindingIndex:-1}},Light25:{binding:{groupIndex:-1,bindingIndex:-1}},Light26:{binding:{groupIndex:-1,bindingIndex:-1}},Light27:{binding:{groupIndex:-1,bindingIndex:-1}},Light28:{binding:{groupIndex:-1,bindingIndex:-1}},Light29:{binding:{groupIndex:-1,bindingIndex:-1}},Light30:{binding:{groupIndex:-1,bindingIndex:-1}},Light31:{binding:{groupIndex:-1,bindingIndex:-1}},Material:{binding:{groupIndex:-1,bindingIndex:-1}},Mesh:{binding:{groupIndex:-1,bindingIndex:-1}},Internals:{binding:{groupIndex:-1,bindingIndex:-1}}},Xr._KnownUBOs={Scene:{binding:{groupIndex:0,bindingIndex:0}},Light0:{binding:{groupIndex:1,bindingIndex:0}},Light1:{binding:{groupIndex:1,bindingIndex:1}},Light2:{binding:{groupIndex:1,bindingIndex:2}},Light3:{binding:{groupIndex:1,bindingIndex:3}},Light4:{binding:{groupIndex:1,bindingIndex:4}},Light5:{binding:{groupIndex:1,bindingIndex:5}},Light6:{binding:{groupIndex:1,bindingIndex:6}},Light7:{binding:{groupIndex:1,bindingIndex:7}},Light8:{binding:{groupIndex:1,bindingIndex:8}},Light9:{binding:{groupIndex:1,bindingIndex:9}},Light10:{binding:{groupIndex:1,bindingIndex:10}},Light11:{binding:{groupIndex:1,bindingIndex:11}},Light12:{binding:{groupIndex:1,bindingIndex:12}},Light13:{binding:{groupIndex:1,bindingIndex:13}},Light14:{binding:{groupIndex:1,bindingIndex:14}},Light15:{binding:{groupIndex:1,bindingIndex:15}},Light16:{binding:{groupIndex:1,bindingIndex:16}},Light17:{binding:{groupIndex:1,bindingIndex:17}},Light18:{binding:{groupIndex:1,bindingIndex:18}},Light19:{binding:{groupIndex:1,bindingIndex:19}},Light20:{binding:{groupIndex:1,bindingIndex:20}},Light21:{binding:{groupIndex:1,bindingIndex:21}},Light22:{binding:{groupIndex:1,bindingIndex:22}},Light23:{binding:{groupIndex:1,bindingIndex:23}},Light24:{binding:{groupIndex:1,bindingIndex:24}},Light25:{binding:{groupIndex:1,bindingIndex:25}},Light26:{binding:{groupIndex:1,bindingIndex:26}},Light27:{binding:{groupIndex:1,bindingIndex:27}},Light28:{binding:{groupIndex:1,bindingIndex:28}},Light29:{binding:{groupIndex:1,bindingIndex:29}},Light30:{binding:{groupIndex:1,bindingIndex:30}},Light31:{binding:{groupIndex:1,bindingIndex:31}},Material:{binding:{groupIndex:2,bindingIndex:0}},Mesh:{binding:{groupIndex:2,bindingIndex:1}},Internals:{binding:{groupIndex:2,bindingIndex:2}}};class jr extends zr{constructor(){super(...arguments),this._missingVaryings=[],this._textureArrayProcessing=[],this._vertexIsGLES3=!1,this._fragmentIsGLES3=!1,this.shaderLanguage=Cn.x.GLSL,this.parseGLES3=!0}_getArraySize(e,t,i){let n=0;const s=e.indexOf("["),r=e.indexOf("]");if(s>0&&r>0){const t=e.substring(s+1,r);n=+t,isNaN(n)&&(n=+i[t.trim()]),e=e.substr(0,s)}return[e,t,n]}initializeShaders(e){this._webgpuProcessingContext=e,this._missingVaryings.length=0,this._textureArrayProcessing.length=0,this.attributeKeywordName=void 0,this.varyingVertexKeywordName=void 0,this.varyingFragmentKeywordName=void 0}preProcessShaderCode(e,t){const i=`// Internals UBO\r\nuniform ${zr.InternalsUBOName} {\nfloat yFactor_;\nfloat textureOutputHeight_;\n};\n`,n=-1!==e.indexOf("// Internals UBO");return t?(this._fragmentIsGLES3=-1!==e.indexOf("#version 3"),this._fragmentIsGLES3&&(this.varyingFragmentKeywordName="in"),n?e:i+"##INJECTCODE##\n"+e):(this._vertexIsGLES3=-1!==e.indexOf("#version 3"),this._vertexIsGLES3&&(this.attributeKeywordName="in",this.varyingVertexKeywordName="out"),n?e:i+e)}varyingProcessor(e,t,i){this._preProcessors=i;const n=(t&&this._fragmentIsGLES3?/\s*in\s+(?:(?:highp)?|(?:lowp)?)\s*(\S+)\s+(\S+)\s*;/gm:!t&&this._vertexIsGLES3?/\s*out\s+(?:(?:highp)?|(?:lowp)?)\s*(\S+)\s+(\S+)\s*;/gm:/\s*varying\s+(?:(?:highp)?|(?:lowp)?)\s*(\S+)\s+(\S+)\s*;/gm).exec(e);if(null!==n){const s=n[1],r=n[2];let o;t?(o=this._webgpuProcessingContext.availableVaryings[r],this._missingVaryings[o]="",void 0===o&&_.Y.Warn(`Invalid fragment shader: The varying named "${r}" is not declared in the vertex shader! This declaration will be ignored.`)):(o=this._webgpuProcessingContext.getVaryingNextLocation(s,this._getArraySize(r,s,i)[2]),this._webgpuProcessingContext.availableVaryings[r]=o,this._missingVaryings[o]=`layout(location = ${o}) in ${s} ${r};`),e=e.replace(n[0],void 0===o?"":`layout(location = ${o}) ${t?"in":"out"} ${s} ${r};`)}return e}attributeProcessor(e,t){this._preProcessors=t;const i=(this._vertexIsGLES3?/\s*in\s+(\S+)\s+(\S+)\s*;/gm:/\s*attribute\s+(\S+)\s+(\S+)\s*;/gm).exec(e);if(null!==i){const n=i[1],s=i[2],r=this._webgpuProcessingContext.getAttributeNextLocation(n,this._getArraySize(s,n,t)[2]);this._webgpuProcessingContext.availableAttributes[s]=r,this._webgpuProcessingContext.orderedAttributes[r]=s,e=e.replace(i[0],`layout(location = ${r}) in ${n} ${s};`)}return e}uniformProcessor(e,t,i){var n;this._preProcessors=i;const s=/\s*uniform\s+(?:(?:highp)?|(?:lowp)?)\s*(\S+)\s+(\S+)\s*;/gm.exec(e);if(null!==s){let r=s[1],o=s[2];if(0===r.indexOf("sampler")||1===r.indexOf("sampler")){let s=0;[o,r,s]=this._getArraySize(o,r,i);let a=this._webgpuProcessingContext.availableTextures[o];if(!a){a={autoBindSampler:!0,isTextureArray:s>0,isStorageTexture:!1,textures:[],sampleType:vr.Float};for(let e=0;e<(s||1);++e)a.textures.push(this._webgpuProcessingContext.getNextFreeUBOBinding())}const l=null!==(n=zr._SamplerTypeByWebGLSamplerType[r])&&void 0!==n?n:"sampler",h=!!zr._IsComparisonSamplerByWebGPUSamplerType[l],c=h?gr.Comparison:gr.Filtering,u=o+zr.AutoSamplerSuffix;let d=this._webgpuProcessingContext.availableSamplers[u];d||(d={binding:this._webgpuProcessingContext.getNextFreeUBOBinding(),type:c});const p="u"===r.charAt(0)?"u":"i"===r.charAt(0)?"i":"";p&&(r=r.substr(1));const f=h?vr.Depth:"u"===p?vr.Uint:"i"===p?vr.Sint:vr.Float;a.sampleType=f;const _=s>0,m=d.binding.groupIndex,g=d.binding.bindingIndex,v=zr._SamplerFunctionByWebGLSamplerType[r],y=zr._TextureTypeByWebGLSamplerType[r],x=zr._GpuTextureViewDimensionByWebGPUTextureType[y];if(_){const t=[];t.push(`layout(set = ${m}, binding = ${g}) uniform ${p}${l} ${u};`),e="\r\n";for(let i=0;i<s;++i){const n=a.textures[i].groupIndex,s=a.textures[i].bindingIndex;t.push(`layout(set = ${n}, binding = ${s}) uniform ${y} ${o}Texture${i};`),e+=`${i>0?"\r\n":""}#define ${o}${i} ${p}${v}(${o}Texture${i}, ${u})`}e=t.join("\r\n")+e,this._textureArrayProcessing.push(o)}else s=1,e=`layout(set = ${m}, binding = ${g}) uniform ${p}${l} ${u};\n                        layout(set = ${a.textures[0].groupIndex}, binding = ${a.textures[0].bindingIndex}) uniform ${y} ${o}Texture;\n                        #define ${o} ${p}${v}(${o}Texture, ${u})`;this._webgpuProcessingContext.availableTextures[o]=a,this._webgpuProcessingContext.availableSamplers[u]=d,this._addSamplerBindingDescription(u,d,!t);for(let e=0;e<s;++e)this._addTextureBindingDescription(o,a,e,x,null,!t)}else this._addUniformToLeftOverUBO(o,r,i),e=""}return e}uniformBufferProcessor(e,t){const i=/uniform\s+(\w+)/gm.exec(e);if(null!==i){const n=i[1];let s=this._webgpuProcessingContext.availableBuffers[n];if(!s){const e=Xr.KnownUBOs[n];let t;t=e&&-1!==e.binding.groupIndex?e.binding:this._webgpuProcessingContext.getNextFreeUBOBinding(),s={binding:t},this._webgpuProcessingContext.availableBuffers[n]=s}this._addBufferBindingDescription(n,s,mr.Uniform,!t),e=e.replace("uniform",`layout(set = ${s.binding.groupIndex}, binding = ${s.binding.bindingIndex}) uniform`)}return e}postProcessor(e,t,i,n,s){const r=-1!==e.search(/#extension.+GL_EXT_draw_buffers.+require/);if(e=(e=e.replace(/#extension.+(GL_OVR_multiview2|GL_OES_standard_derivatives|GL_EXT_shader_texture_lod|GL_EXT_frag_depth|GL_EXT_draw_buffers).+(enable|require)/g,"")).replace(/texture2D\s*\(/g,"texture("),i){const t=e.indexOf("gl_FragCoord")>=0,i="\n                glFragCoord_ = gl_FragCoord;\n                if (yFactor_ == 1.) {\n                    glFragCoord_.y = textureOutputHeight_ - glFragCoord_.y;\n                }\n            ",n=t?"vec4 glFragCoord_;\n":"";if(e=(e=(e=(e=(e=(e=(e=e.replace(/texture2DLodEXT\s*\(/g,"textureLod(")).replace(/textureCubeLodEXT\s*\(/g,"textureLod(")).replace(/textureCube\s*\(/g,"texture(")).replace(/gl_FragDepthEXT/g,"gl_FragDepth")).replace(/gl_FragColor/g,"glFragColor")).replace(/gl_FragData/g,"glFragData")).replace(/gl_FragCoord/g,"glFragCoord_"),this._fragmentIsGLES3){const t=/^\s*out\s+\S+\s+\S+\s*;/gm.exec(e);null!==t&&(e=e.substring(0,t.index)+"layout(location = 0) "+e.substring(t.index))}else e=e.replace(/void\s+?main\s*\(/g,(r?"":"layout(location = 0) out vec4 glFragColor;\n")+"void main(");e=(e=e.replace(/dFdy/g,"(-yFactor_)*dFdy")).replace("##INJECTCODE##",n),t&&(e=this._injectStartingAndEndingCode(e,"void main",i))}else if(e=(e=e.replace(/gl_InstanceID/g,"gl_InstanceIndex")).replace(/gl_VertexID/g,"gl_VertexIndex"),-1!==t.indexOf("#define MULTIVIEW"))return"#extension GL_OVR_multiview2 : require\nlayout (num_views = 2) in;\n"+e;if(!i){const t=e.lastIndexOf("}");e=e.substring(0,t),e+="gl_Position.y *= yFactor_;\n",s.isNDCHalfZRange||(e+="gl_Position.z = (gl_Position.z + gl_Position.w) / 2.0;\n"),e+="}"}return e}_applyTextureArrayProcessing(e,t){const i=new RegExp(t+"\\s*\\[(.+)?\\]","gm");let n=i.exec(e);for(;null!==n;){const s=n[1];let r=+s;this._preProcessors&&isNaN(r)&&(r=+this._preProcessors[s.trim()]),e=e.replace(n[0],t+r),n=i.exec(e)}return e}_generateLeftOverUBOCode(e,t){let i=`layout(set = ${t.binding.groupIndex}, binding = ${t.binding.bindingIndex}) uniform ${e} {\n    `;for(const e of this._webgpuProcessingContext.leftOverUniforms)e.length>0?i+=`    ${e.type} ${e.name}[${e.length}];\n`:i+=`    ${e.type} ${e.name};\n`;return i+="};\n\n",i}finalizeShaders(e,t){for(let i=0;i<this._textureArrayProcessing.length;++i){const n=this._textureArrayProcessing[i];e=this._applyTextureArrayProcessing(e,n),t=this._applyTextureArrayProcessing(t,n)}for(let e=0;e<this._missingVaryings.length;++e){const i=this._missingVaryings[e];i&&i.length>0&&(t=i+"\n"+t)}const i=this._buildLeftOverUBO();return e=i+e,t=i+t,this._collectBindingNames(),this._preCreateBindGroupEntries(),this._preProcessors=null,{vertexCode:e,fragmentCode:t}}}var Yr=i(8985);si.v.IncludesShadersStoreWGSL.bonesDeclaration="#if NUM_BONE_INFLUENCERS>0\nattribute matricesIndices : vec4<f32>;\nattribute matricesWeights : vec4<f32>;\n#if NUM_BONE_INFLUENCERS>4\nattribute matricesIndicesExtra : vec4<f32>;\nattribute matricesWeightsExtra : vec4<f32>;\n#endif\n#ifndef BAKED_VERTEX_ANIMATION_TEXTURE\n#ifdef BONETEXTURE\nvar boneSampler : texture_2d<f32>;\nuniform boneTextureWidth : f32;\n#else\nuniform mBones : array<mat4x4,BonesPerMesh>;\n#ifdef BONES_VELOCITY_ENABLED\nuniform mPreviousBones : array<mat4x4,BonesPerMesh>;\n#endif\n#endif\n#ifdef BONETEXTURE\nfn readMatrixFromRawSampler(smp : texture_2d<f32>,index : f32)->mat4x4<f32>\n{\nlet offset=i32(index) *4; \nlet m0=textureLoad(smp,vec2<i32>(offset+0,0),0);\nlet m1=textureLoad(smp,vec2<i32>(offset+1,0),0);\nlet m2=textureLoad(smp,vec2<i32>(offset+2,0),0);\nlet m3=textureLoad(smp,vec2<i32>(offset+3,0),0);\nreturn mat4x4<f32>(m0,m1,m2,m3);\n}\n#endif\n#endif\n#endif\n";si.v.IncludesShadersStoreWGSL.bonesVertex="#ifndef BAKED_VERTEX_ANIMATION_TEXTURE\n#if NUM_BONE_INFLUENCERS>0\nvar influence : mat4x4<f32>;\n#ifdef BONETEXTURE\ninfluence=readMatrixFromRawSampler(boneSampler,vertexInputs.matricesIndices[0])*vertexInputs.matricesWeights[0];\n#if NUM_BONE_INFLUENCERS>1\ninfluence=influence+readMatrixFromRawSampler(boneSampler,vertexInputs.matricesIndices[1])*vertexInputs.matricesWeights[1];\n#endif \n#if NUM_BONE_INFLUENCERS>2\ninfluence=influence+readMatrixFromRawSampler(boneSampler,vertexInputs.matricesIndices[2])*vertexInputs.matricesWeights[2];\n#endif \n#if NUM_BONE_INFLUENCERS>3\ninfluence=influence+readMatrixFromRawSampler(boneSampler,vertexInputs.matricesIndices[3])*vertexInputs.matricesWeights[3];\n#endif \n#if NUM_BONE_INFLUENCERS>4\ninfluence=influence+readMatrixFromRawSampler(boneSampler,vertexInputs.matricesIndicesExtra[0])*vertexInputs.matricesWeightsExtra[0];\n#endif \n#if NUM_BONE_INFLUENCERS>5\ninfluence=influence+readMatrixFromRawSampler(boneSampler,vertexInputs.matricesIndicesExtra[1])*vertexInputs.matricesWeightsExtra[1];\n#endif \n#if NUM_BONE_INFLUENCERS>6\ninfluence=influence+readMatrixFromRawSampler(boneSampler,vertexInputs.matricesIndicesExtra[2])*vertexInputs.matricesWeightsExtra[2];\n#endif \n#if NUM_BONE_INFLUENCERS>7\ninfluence=influence+readMatrixFromRawSampler(boneSampler,vertexInputs.matricesIndicesExtra[3])*vertexInputs.matricesWeightsExtra[3];\n#endif \n#else \ninfluence=uniforms.mBones[int(vertexInputs.matricesIndices[0])]*vertexInputs.matricesWeights[0];\n#if NUM_BONE_INFLUENCERS>1\ninfluence=influence+uniforms.mBones[int(vertexInputs.matricesIndices[1])]*vertexInputs.matricesWeights[1];\n#endif \n#if NUM_BONE_INFLUENCERS>2\ninfluence=influence+uniforms.mBones[int(vertexInputs.matricesIndices[2])]*vertexInputs.matricesWeights[2];\n#endif \n#if NUM_BONE_INFLUENCERS>3\ninfluence=influence+uniforms.mBones[int(vertexInputs.matricesIndices[3])]*vertexInputs.matricesWeights[3];\n#endif \n#if NUM_BONE_INFLUENCERS>4\ninfluence=influence+uniforms.mBones[int(vertexInputs.matricesIndicesExtra[0])]*vertexInputs.matricesWeightsExtra[0];\n#endif \n#if NUM_BONE_INFLUENCERS>5\ninfluence=influence+uniforms.mBones[int(vertexInputs.matricesIndicesExtra[1])]*vertexInputs.matricesWeightsExtra[1];\n#endif \n#if NUM_BONE_INFLUENCERS>6\ninfluence=influence+uniforms.mBones[int(vertexInputs.matricesIndicesExtra[2])]*vertexInputs.matricesWeightsExtra[2];\n#endif \n#if NUM_BONE_INFLUENCERS>7\ninfluence=influence+uniforms.mBones[int(vertexInputs.matricesIndicesExtra[3])]*vertexInputs.matricesWeightsExtra[3];\n#endif \n#endif\nfinalWorld=finalWorld*influence;\n#endif\n#endif\n";si.v.IncludesShadersStoreWGSL.bakedVertexAnimationDeclaration="#ifdef BAKED_VERTEX_ANIMATION_TEXTURE\nuniform bakedVertexAnimationTime: f32;\nuniform bakedVertexAnimationTextureSizeInverted: vec2<f32>;\nuniform bakedVertexAnimationSettings: vec4<f32>;\nvar bakedVertexAnimationTexture : texture_2d<f32>;\n#ifdef INSTANCES\nattribute bakedVertexAnimationSettingsInstanced : vec4<f32>;\n#endif\nfn readMatrixFromRawSamplerVAT(smp : texture_2d<f32>,index : f32,frame : f32)->mat4x4<f32>\n{\nlet offset=i32(index)*4;\nlet frameUV=i32(frame);\nlet m0=textureLoad(smp,vec2<i32>(offset+0,frameUV),0);\nlet m1=textureLoad(smp,vec2<i32>(offset+1,frameUV),0);\nlet m2=textureLoad(smp,vec2<i32>(offset+2,frameUV),0);\nlet m3=textureLoad(smp,vec2<i32>(offset+3,frameUV),0);\nreturn mat4x4<f32>(m0,m1,m2,m3);\n}\n#endif\n";si.v.IncludesShadersStoreWGSL.bakedVertexAnimation="#ifdef BAKED_VERTEX_ANIMATION_TEXTURE\n{\n#ifdef INSTANCES\nlet VATStartFrame: f32=vertexInputs.bakedVertexAnimationSettingsInstanced.x;\nlet VATEndFrame: f32=vertexInputs.bakedVertexAnimationSettingsInstanced.y;\nlet VATOffsetFrame: f32=vertexInputs.bakedVertexAnimationSettingsInstanced.z;\nlet VATSpeed: f32=vertexInputs.bakedVertexAnimationSettingsInstanced.w;\n#else\nlet VATStartFrame: f32=uniforms.bakedVertexAnimationSettings.x;\nlet VATEndFrame: f32=uniforms.bakedVertexAnimationSettings.y;\nlet VATOffsetFrame: f32=uniforms.bakedVertexAnimationSettings.z;\nlet VATSpeed: f32=uniforms.bakedVertexAnimationSettings.w;\n#endif\nlet totalFrames: f32=VATEndFrame-VATStartFrame+1.0;\nlet time: f32=uniforms.bakedVertexAnimationTime*VATSpeed/totalFrames;\nlet frameCorrection: f32=select(1.0,0.0,time<1.0);\nlet numOfFrames: f32=totalFrames-frameCorrection;\nvar VATFrameNum: f32=fract(time)*numOfFrames;\nVATFrameNum=(VATFrameNum+VATOffsetFrame) % numOfFrames;\nVATFrameNum=floor(VATFrameNum);\nVATFrameNum=VATFrameNum+VATStartFrame+frameCorrection;\nvar VATInfluence : mat4x4<f32>;\nVATInfluence=readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,vertexInputs.matricesIndices[0],VATFrameNum)*vertexInputs.matricesWeights[0];\n#if NUM_BONE_INFLUENCERS>1\nVATInfluence=VATInfluence+readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,vertexInputs.matricesIndices[1],VATFrameNum)*vertexInputs.matricesWeights[1];\n#endif\n#if NUM_BONE_INFLUENCERS>2\nVATInfluence=VATInfluence+readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,vertexInputs.matricesIndices[2],VATFrameNum)*vertexInputs.matricesWeights[2];\n#endif\n#if NUM_BONE_INFLUENCERS>3\nVATInfluence=VATInfluence+readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,vertexInputs.matricesIndices[3],VATFrameNum)*vertexInputs.matricesWeights[3];\n#endif\n#if NUM_BONE_INFLUENCERS>4\nVATInfluence=VATInfluence+readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,vertexInputs.matricesIndicesExtra[0],VATFrameNum)*vertexInputs.matricesWeightsExtra[0];\n#endif\n#if NUM_BONE_INFLUENCERS>5\nVATInfluence=VATInfluence+readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,vertexInputs.matricesIndicesExtra[1],VATFrameNum)*vertexInputs.matricesWeightsExtra[1];\n#endif\n#if NUM_BONE_INFLUENCERS>6\nVATInfluence=VATInfluence+readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,vertexInputs.matricesIndicesExtra[2],VATFrameNum)*vertexInputs.matricesWeightsExtra[2];\n#endif\n#if NUM_BONE_INFLUENCERS>7\nVATInfluence=VATInfluence+readMatrixFromRawSamplerVAT(bakedVertexAnimationTexture,vertexInputs.matricesIndicesExtra[3],VATFrameNum)*vertexInputs.matricesWeightsExtra[3];\n#endif\nfinalWorld=finalWorld*VATInfluence;\n}\n#endif\n";si.v.IncludesShadersStoreWGSL.clipPlaneFragment="#if defined(CLIPPLANE) || defined(CLIPPLANE2) || defined(CLIPPLANE3) || defined(CLIPPLANE4) || defined(CLIPPLANE5) || defined(CLIPPLANE6)\nif (false) {}\n#endif\n#ifdef CLIPPLANE\nelse if (fragmentInputs.fClipDistance>0.0)\n{\ndiscard;\n}\n#endif\n#ifdef CLIPPLANE2\nelse if (fragmentInputs.fClipDistance2>0.0)\n{\ndiscard;\n}\n#endif\n#ifdef CLIPPLANE3\nelse if (fragmentInputs.fClipDistance3>0.0)\n{\ndiscard;\n}\n#endif\n#ifdef CLIPPLANE4\nelse if (fragmentInputs.fClipDistance4>0.0)\n{\ndiscard;\n}\n#endif\n#ifdef CLIPPLANE5\nelse if (fragmentInputs.fClipDistance5>0.0)\n{\ndiscard;\n}\n#endif\n#ifdef CLIPPLANE6\nelse if (fragmentInputs.fClipDistance6>0.0)\n{\ndiscard;\n}\n#endif\n";si.v.IncludesShadersStoreWGSL.clipPlaneFragmentDeclaration="#ifdef CLIPPLANE\nvarying fClipDistance: f32;\n#endif\n#ifdef CLIPPLANE2\nvarying fClipDistance2: f32;\n#endif\n#ifdef CLIPPLANE3\nvarying fClipDistance3: f32;\n#endif\n#ifdef CLIPPLANE4\nvarying fClipDistance4: f32;\n#endif\n#ifdef CLIPPLANE5\nvarying fClipDistance5: f32;\n#endif\n#ifdef CLIPPLANE6\nvarying fClipDistance6: f32;\n#endif\n";si.v.IncludesShadersStoreWGSL.clipPlaneVertex="#ifdef CLIPPLANE\nvertexOutputs.fClipDistance=dot(worldPos,uniforms.vClipPlane);\n#endif\n#ifdef CLIPPLANE2\nvertexOutputs.fClipDistance2=dot(worldPos,uniforms.vClipPlane2);\n#endif\n#ifdef CLIPPLANE3\nvertexOutputs.fClipDistance3=dot(worldPos,uniforms.vClipPlane3);\n#endif\n#ifdef CLIPPLANE4\nvertexOutputs.fClipDistance4=dot(worldPos,uniforms.vClipPlane4);\n#endif\n#ifdef CLIPPLANE5\nvertexOutputs.fClipDistance5=dot(worldPos,uniforms.vClipPlane5);\n#endif\n#ifdef CLIPPLANE6\nvertexOutputs.fClipDistance6=dot(worldPos,uniforms.vClipPlane6);\n#endif\n";si.v.IncludesShadersStoreWGSL.clipPlaneVertexDeclaration="#ifdef CLIPPLANE\nuniform vClipPlane: vec4<f32>;\nvarying fClipDistance: f32;\n#endif\n#ifdef CLIPPLANE2\nuniform vClipPlane2: vec4<f32>;\nvarying fClipDistance2: f32;\n#endif\n#ifdef CLIPPLANE3\nuniform vClipPlane3: vec4<f32>;\nvarying fClipDistance3: f32;\n#endif\n#ifdef CLIPPLANE4\nuniform vClipPlane4: vec4<f32>;\nvarying fClipDistance4: f32;\n#endif\n#ifdef CLIPPLANE5\nuniform vClipPlane5: vec4<f32>;\nvarying fClipDistance5: f32;\n#endif\n#ifdef CLIPPLANE6\nuniform vClipPlane6: vec4<f32>;\nvarying fClipDistance6: f32;\n#endif\n";si.v.IncludesShadersStoreWGSL.instancesDeclaration="#ifdef INSTANCES\nattribute world0 : vec4<f32>;\nattribute world1 : vec4<f32>;\nattribute world2 : vec4<f32>;\nattribute world3 : vec4<f32>;\n#ifdef INSTANCESCOLOR\nattribute instanceColor : vec4<f32>;\n#endif\n#if defined(THIN_INSTANCES) && !defined(WORLD_UBO)\nuniform world : mat4x4<f32>;\n#endif\n#if defined(VELOCITY) || defined(PREPASS_VELOCITY)\nattribute previousWorld0 : vec4<f32>;\nattribute previousWorld1 : vec4<f32>;\nattribute previousWorld2 : vec4<f32>;\nattribute previousWorld3 : vec4<f32>;\n#ifdef THIN_INSTANCES\nuniform previousWorld : mat4x4<f32>;\n#endif\n#endif\n#else\n#if !defined(WORLD_UBO)\nuniform world : mat4x4<f32>;\n#endif\n#if defined(VELOCITY) || defined(PREPASS_VELOCITY)\nuniform previousWorld : mat4x4<f32>;\n#endif\n#endif\n";si.v.IncludesShadersStoreWGSL.instancesVertex="#ifdef INSTANCES\nvar finalWorld=mat4x4<f32>(vertexInputs.world0,vertexInputs.world1,vertexInputs.world2,vertexInputs.world3);\n#if defined(PREPASS_VELOCITY) || defined(VELOCITY)\nvar finalPreviousWorld=mat4x4<f32>(previousWorld0,previousWorld1,previousWorld2,previousWorld3);\n#endif\n#ifdef THIN_INSTANCES\n#if !defined(WORLD_UBO)\nfinalWorld=uniforms.world*finalWorld;\n#else\nfinalWorld=mesh.world*finalWorld;\n#endif\n#if defined(PREPASS_VELOCITY) || defined(VELOCITY)\nfinalPreviousWorld=previousWorld*finalPreviousWorld;\n#endif\n#endif\n#else\n#if !defined(WORLD_UBO)\nvar finalWorld=uniforms.world;\n#else\nvar finalWorld=mesh.world;\n#endif\n#if defined(PREPASS_VELOCITY) || defined(VELOCITY)\nvar finalPreviousWorld=previousWorld;\n#endif\n#endif\n";si.v.IncludesShadersStoreWGSL.meshUboDeclaration="struct Mesh {\nworld : mat4x4<f32>,\nvisibility : f32,\n};\nvar<uniform> mesh : Mesh;\n#define WORLD_UBO\n";si.v.IncludesShadersStoreWGSL.morphTargetsVertex="#ifdef MORPHTARGETS\n#ifdef MORPHTARGETS_TEXTURE \nvertexID=f32(vertexInputs.vertexIndex)*uniforms.morphTargetTextureInfo.x;\npositionUpdated=positionUpdated+(readVector3FromRawSampler({X},vertexID)-vertexInputs.position)*uniforms.morphTargetInfluences[{X}];\nvertexID=vertexID+1.0;\n#ifdef MORPHTARGETS_NORMAL\nnormalUpdated=normalUpdated+(readVector3FromRawSampler({X},vertexID) -vertexInputs.normal)*uniforms.morphTargetInfluences[{X}];\nvertexID=vertexID+1.0;\n#endif\n#ifdef MORPHTARGETS_UV\nuvUpdated=uvUpdated+(readVector3FromRawSampler({X},vertexID).xy-vertexInputs.uv)*uniforms.morphTargetInfluences[{X}];\nvertexID=vertexID+1.0;\n#endif\n#ifdef MORPHTARGETS_TANGENT\ntangentUpdated.xyz=tangentUpdated.xyz+(readVector3FromRawSampler({X},vertexID) -vertexInputs.tangent.xyz)*uniforms.morphTargetInfluences[{X}];\n#endif\n#else\npositionUpdated=positionUpdated+(position{X}-vertexInputs.position)*uniforms.morphTargetInfluences[{X}];\n#ifdef MORPHTARGETS_NORMAL\nnormalUpdated+=(normal{X}-vertexInputs.normal)*uniforms.morphTargetInfluences[{X}];\n#endif\n#ifdef MORPHTARGETS_TANGENT\ntangentUpdated.xyz=tangentUpdated.xyz+(tangent{X}-vertexInputs.tangent.xyz)*uniforms.morphTargetInfluences[{X}];\n#endif\n#ifdef MORPHTARGETS_UV\nuvUpdated=uvUpdated+(uv_{X}-vertexInputs.uv)*uniforms.morphTargetInfluences[{X}];\n#endif\n#endif\n#endif\n";si.v.IncludesShadersStoreWGSL.morphTargetsVertexDeclaration="#ifdef MORPHTARGETS\n#ifndef MORPHTARGETS_TEXTURE\nattribute position{X} : vec3<f32>;\n#ifdef MORPHTARGETS_NORMAL\nattribute normal{X} : vec3<f32>;\n#endif\n#ifdef MORPHTARGETS_TANGENT\nattribute tangent{X} : vec3<f32>;\n#endif\n#ifdef MORPHTARGETS_UV\nattribute uv_{X} : vec2<f32>;\n#endif\n#endif\n#endif\n";si.v.IncludesShadersStoreWGSL.morphTargetsVertexGlobal="#ifdef MORPHTARGETS\n#ifdef MORPHTARGETS_TEXTURE\nvar vertexID : f32;\n#endif\n#endif\n";si.v.IncludesShadersStoreWGSL.morphTargetsVertexGlobalDeclaration="#ifdef MORPHTARGETS\nuniform morphTargetInfluences : array<f32,NUM_MORPH_INFLUENCERS>;\n#ifdef MORPHTARGETS_TEXTURE \nuniform morphTargetTextureIndices : array<f32,NUM_MORPH_INFLUENCERS>;\nuniform morphTargetTextureInfo : vec3<f32>;\nvar morphTargets : texture_2d_array<f32>;\nvar morphTargetsSampler : sampler;\nfn readVector3FromRawSampler(targetIndex : i32,vertexIndex : f32)->vec3<f32>\n{ \nlet y=floor(vertexIndex/uniforms.morphTargetTextureInfo.y);\nlet x=vertexIndex-y*uniforms.morphTargetTextureInfo.y;\nlet textureUV=vec2<f32>((x+0.5)/uniforms.morphTargetTextureInfo.y,(y+0.5)/uniforms.morphTargetTextureInfo.z);\nreturn textureSampleLevel(morphTargets,morphTargetsSampler,textureUV,i32(uniforms.morphTargetTextureIndices[targetIndex]),0.0).xyz;\n}\n#endif\n#endif\n";si.v.IncludesShadersStoreWGSL.sceneUboDeclaration="struct Scene {\nviewProjection : mat4x4<f32>,\n#ifdef MULTIVIEW\nviewProjectionR : mat4x4<f32>,\n#endif \nview : mat4x4<f32>,\nprojection : mat4x4<f32>,\nvEyePosition : vec4<f32>,\n};\nvar<uniform> scene : Scene;\n";const qr={texture_1d:lr.E1d,texture_2d:lr.E2d,texture_2d_array:lr.E2dArray,texture_3d:lr.E3d,texture_cube:lr.Cube,texture_cube_array:lr.CubeArray,texture_multisampled_2d:lr.E2d,texture_depth_2d:lr.E2d,texture_depth_2d_array:lr.E2dArray,texture_depth_cube:lr.Cube,texture_depth_cube_array:lr.CubeArray,texture_depth_multisampled_2d:lr.E2d,texture_storage_1d:lr.E1d,texture_storage_2d:lr.E2d,texture_storage_2d_array:lr.E2dArray,texture_storage_3d:lr.E3d,texture_external:null};class Kr extends zr{constructor(){super(...arguments),this.shaderLanguage=Cn.x.WGSL,this.uniformRegexp=/uniform\s+(\w+)\s*:\s*(.+)\s*;/,this.textureRegexp=/var\s+(\w+)\s*:\s*((array<\s*)?(texture_\w+)\s*(<\s*(.+)\s*>)?\s*(,\s*\w+\s*>\s*)?);/,this.noPrecision=!0}_getArraySize(e,t,i){let n=0;const s=t.lastIndexOf(">");if(t.indexOf("array")>=0&&s>0){let e=s;for(;e>0&&" "!==t.charAt(e)&&","!==t.charAt(e);)e--;const r=t.substring(e+1,s);for(n=+r,isNaN(n)&&(n=+i[r.trim()]);e>0&&(" "===t.charAt(e)||","===t.charAt(e));)e--;t=t.substring(t.indexOf("<")+1,e+1)}return[e,t,n]}initializeShaders(e){this._webgpuProcessingContext=e,this._attributesWGSL=[],this._varyingsWGSL=[],this._varyingNamesWGSL=[],this._stridedUniformArrays=[]}preProcessShaderCode(e){return`struct ${zr.InternalsUBOName} {\n  yFactor_: f32,\n  textureOutputHeight_: f32,\n};\nvar<uniform> internals : ${zr.InternalsUBOName};\n`+(0,Yr.Kt)(e)}varyingProcessor(e,t,i){const n=/\s*varying\s+(?:(?:highp)?|(?:lowp)?)\s*(\S+)\s*:\s*(.+)\s*;/gm.exec(e);if(null!==n){const s=n[2],r=n[1];let o;t?(o=this._webgpuProcessingContext.availableVaryings[r],void 0===o&&_.Y.Warn(`Invalid fragment shader: The varying named "${r}" is not declared in the vertex shader! This declaration will be ignored.`)):(o=this._webgpuProcessingContext.getVaryingNextLocation(s,this._getArraySize(r,s,i)[2]),this._webgpuProcessingContext.availableVaryings[r]=o,this._varyingsWGSL.push(`  @location(${o}) ${r} : ${s},`),this._varyingNamesWGSL.push(r)),e=""}return e}attributeProcessor(e,t){const i=/\s*attribute\s+(\S+)\s*:\s*(.+)\s*;/gm.exec(e);if(null!==i){const n=i[2],s=i[1],r=this._webgpuProcessingContext.getAttributeNextLocation(n,this._getArraySize(s,n,t)[2]);this._webgpuProcessingContext.availableAttributes[s]=r,this._webgpuProcessingContext.orderedAttributes[r]=s,this._attributesWGSL.push(`@location(${r}) ${s} : ${n},`),e=""}return e}uniformProcessor(e,t,i){const n=this.uniformRegexp.exec(e);if(null!==n){const t=n[2],s=n[1];this._addUniformToLeftOverUBO(s,t,i),e=""}return e}textureProcessor(e,t,i){const n=this.textureRegexp.exec(e);if(null!==n){const s=n[1],r=n[2],o=!!n[3],a=n[4],l=a.indexOf("storage")>0,h=n[6],c=l?h.substring(0,h.indexOf(",")).trim():null;let u=o?this._getArraySize(s,r,i)[2]:0,d=this._webgpuProcessingContext.availableTextures[s];if(d)u=d.textures.length;else{d={isTextureArray:u>0,isStorageTexture:l,textures:[],sampleType:vr.Float},u=u||1;for(let e=0;e<u;++e)d.textures.push(this._webgpuProcessingContext.getNextFreeUBOBinding())}this._webgpuProcessingContext.availableTextures[s]=d;const p=a.indexOf("depth")>0,f=qr[a],_=p?vr.Depth:"u32"===h?vr.Uint:"i32"===h?vr.Sint:vr.Float;if(d.sampleType=_,void 0===f)throw`Can't get the texture dimension corresponding to the texture function "${a}"!`;for(let i=0;i<u;++i){const{groupIndex:n,bindingIndex:r}=d.textures[i];0===i&&(e=`@group(${n}) @binding(${r}) ${e}`),this._addTextureBindingDescription(s,d,i,f,c,!t)}}return e}postProcessor(e){return e}finalizeShaders(e,t){const i=t.indexOf("fragmentInputs.position")>=0?"\n            if (internals.yFactor_ == 1.) {\n                fragmentInputs.position.y = internals.textureOutputHeight_ - fragmentInputs.position.y;\n            }\n        ":"";e=this._processSamplers(e,!0),t=this._processSamplers(t,!1),e=this._processCustomBuffers(e,!0),t=this._processCustomBuffers(t,!1);const n=this._buildLeftOverUBO();t=n+t,e=(e=n+e).replace(/#define /g,"//#define "),e=this._processStridedUniformArrays(e);let s="struct VertexInputs {\n  @builtin(vertex_index) vertexIndex : u32,\n  @builtin(instance_index) instanceIndex : u32,\n";this._attributesWGSL.length>0&&(s+=this._attributesWGSL.join("\n")),s+="\n};\nvar<private> vertexInputs : VertexInputs;\n";let r="struct FragmentInputs {\n  @builtin(position) position : vec4<f32>,\n";this._varyingsWGSL.length>0&&(r+=this._varyingsWGSL.join("\n")),r+="\n};\nvar<private> vertexOutputs : FragmentInputs;\n",e=s+r+e,e=this._injectStartingAndEndingCode(e,"fn main","\n  vertexInputs = input;\n","  vertexOutputs.position.y = vertexOutputs.position.y * internals.yFactor_;\n  return vertexOutputs;"),t=t.replace(/#define /g,"//#define "),t=(t=this._processStridedUniformArrays(t)).replace(/dpdy/g,"(-internals.yFactor_)*dpdy");let o="struct FragmentInputs {\n  @builtin(position) position : vec4<f32>,\n  @builtin(front_facing) frontFacing : bool,\n";this._varyingsWGSL.length>0&&(o+=this._varyingsWGSL.join("\n")),o+="\n};\nvar<private> fragmentInputs : FragmentInputs;\n";let a="struct FragmentOutputs {\n  @location(0) color : vec4<f32>,\n",l=!1,h=0;for(;!(l||(h=t.indexOf("fragmentOutputs.fragDepth",h),h<0));){const e=h;for(l=!0;h>1&&"\n"!==t.charAt(h);){if("/"===t.charAt(h)&&"/"===t.charAt(h-1)){l=!1;break}h--}h=e+25}l&&(a+="  @builtin(frag_depth) fragDepth: f32,\n"),a+="};\nvar<private> fragmentOutputs : FragmentOutputs;\n",t=o+a+t;const c="  fragmentInputs = input;\n  "+i;return t=this._injectStartingAndEndingCode(t,"fn main",c,"  return fragmentOutputs;"),this._collectBindingNames(),this._preCreateBindGroupEntries(),{vertexCode:e,fragmentCode:t}}_generateLeftOverUBOCode(e,t){let i="",n=`struct ${e} {\n`;for(const t of this._webgpuProcessingContext.leftOverUniforms){const s=t.type.replace(/^(.*?)(<.*>)?$/,"$1"),r=zr.UniformSizes[s];if(t.length>0)if(r<=2){const r=`${e}_${this._stridedUniformArrays.length}_strided_arr`;i+=`struct ${r} {\n                        @size(16)\n                        el: ${s},\n                    }`,this._stridedUniformArrays.push(t.name),n+=` @align(16) ${t.name} : array<${r}, ${t.length}>,\n`}else n+=` ${t.name} : array<${t.type}, ${t.length}>,\n`;else n+=`  ${t.name} : ${t.type},\n`}return n+="};\n",n=`${i}\n${n}`,n+=`@group(${t.binding.groupIndex}) @binding(${t.binding.bindingIndex}) var<uniform> uniforms : ${e};\n`,n}_processSamplers(e,t){const i=/var\s+(\w+Sampler)\s*:\s*(sampler|sampler_comparison)\s*;/gm;for(;;){const n=i.exec(e);if(null===n)break;const s=n[1],r=n[2],o=s.indexOf(zr.AutoSamplerSuffix)===s.length-zr.AutoSamplerSuffix.length?s.substring(0,s.indexOf(zr.AutoSamplerSuffix)):null,a="sampler_comparison"===r?gr.Comparison:gr.Filtering;if(o){const e=this._webgpuProcessingContext.availableTextures[o];e&&(e.autoBindSampler=!0)}let l=this._webgpuProcessingContext.availableSamplers[s];l||(l={binding:this._webgpuProcessingContext.getNextFreeUBOBinding(),type:a},this._webgpuProcessingContext.availableSamplers[s]=l),this._addSamplerBindingDescription(s,l,t);const h=e.substring(0,n.index),c=`@group(${l.binding.groupIndex}) @binding(${l.binding.bindingIndex}) `,u=e.substring(n.index);e=h+c+u,i.lastIndex+=c.length}return e}_processCustomBuffers(e,t){const i=/var<\s*(uniform|storage)\s*(,\s*(read|read_write)\s*)?>\s+(\S+)\s*:\s*(\S+)\s*;/gm;for(;;){const n=i.exec(e);if(null===n)break;const s=n[1],r=n[3];let o=n[4];const a=n[5];let l=this._webgpuProcessingContext.availableBuffers[o];if(!l){const e="uniform"===s?Xr.KnownUBOs[a]:null;let t;e?(o=a,t=e.binding,-1===t.groupIndex&&(t=this._webgpuProcessingContext.getNextFreeUBOBinding())):t=this._webgpuProcessingContext.getNextFreeUBOBinding(),l={binding:t},this._webgpuProcessingContext.availableBuffers[o]=l}this._addBufferBindingDescription(o,this._webgpuProcessingContext.availableBuffers[o],"read_write"===r?mr.Storage:"storage"===s?mr.ReadOnlyStorage:mr.Uniform,t);const h=l.binding.groupIndex,c=l.binding.bindingIndex,u=e.substring(0,n.index),d=`@group(${h}) @binding(${c}) `,p=e.substring(n.index);e=u+d+p,i.lastIndex+=d.length}return e}_processStridedUniformArrays(e){for(const t of this._stridedUniformArrays)e=e.replace(new RegExp(`${t}\\s*\\[(.*)\\]`,"g"),`${t}[$1].el`);return e}}class $r{get underlyingResource(){return this._webgpuTexture}getMSAATexture(e=0){var t,i;return null!==(i=null===(t=this._webgpuMSAATexture)||void 0===t?void 0:t[e])&&void 0!==i?i:null}setMSAATexture(e,t=-1){this._webgpuMSAATexture||(this._webgpuMSAATexture=[]),-1===t&&(t=this._webgpuMSAATexture.length),this._webgpuMSAATexture[t]=e}releaseMSAATexture(){if(this._webgpuMSAATexture){for(const e of this._webgpuMSAATexture)null==e||e.destroy();this._webgpuMSAATexture=null}}constructor(e=null){this.format=cr.RGBA8Unorm,this.textureUsages=0,this.textureAdditionalUsages=0,this._webgpuTexture=e,this._webgpuMSAATexture=null,this.view=null,this.viewForWriting=null}set(e){this._webgpuTexture=e}setUsage(e,t,i,n,s){this.createView({format:this.format,dimension:i?lr.Cube:lr.E2d,mipLevelCount:t?lt.R.ILog2(Math.max(n,s))+1:1,baseArrayLayer:0,baseMipLevel:0,arrayLayerCount:i?6:1,aspect:hr.All})}createView(e,t=!1){if(this.view=this._webgpuTexture.createView(e),t&&e){const t=e.mipLevelCount;e.mipLevelCount=1,this.viewForWriting=this._webgpuTexture.createView(e),e.mipLevelCount=t}}reset(){this._webgpuTexture=null,this._webgpuMSAATexture=null,this.view=null,this.viewForWriting=null}release(){var e,t;null===(e=this._webgpuTexture)||void 0===e||e.destroy(),this.releaseMSAATexture(),null===(t=this._copyInvertYTempTexture)||void 0===t||t.destroy(),this.reset()}}const Qr="\n    #extension GL_EXT_samplerless_texture_functions : enable\n\n    const vec2 pos[4] = vec2[4](vec2(-1.0f, 1.0f), vec2(1.0f, 1.0f), vec2(-1.0f, -1.0f), vec2(1.0f, -1.0f));\n    const vec2 tex[4] = vec2[4](vec2(0.0f, 0.0f), vec2(1.0f, 0.0f), vec2(0.0f, 1.0f), vec2(1.0f, 1.0f));\n\n    layout(set = 0, binding = 0) uniform texture2D img;\n\n    #ifdef INVERTY\n        layout(location = 0) out flat ivec2 vTextureSize;\n    #endif\n\n    void main() {\n        #ifdef INVERTY\n            vTextureSize = textureSize(img, 0);\n        #endif\n        gl_Position = vec4(pos[gl_VertexIndex], 0.0, 1.0);\n    }\n    ",Zr=Qr;var Jr,eo;!function(e){e[e.MipMap=0]="MipMap",e[e.InvertYPremultiplyAlpha=1]="InvertYPremultiplyAlpha",e[e.Clear=2]="Clear",e[e.InvertYPremultiplyAlphaWithOfst=3]="InvertYPremultiplyAlphaWithOfst"}(Jr||(Jr={})),function(e){e[e.DontInvertY=0]="DontInvertY",e[e.InvertY=1]="InvertY"}(eo||(eo={}));const to=[{vertex:"\n    const vec2 pos[4] = vec2[4](vec2(-1.0f, 1.0f), vec2(1.0f, 1.0f), vec2(-1.0f, -1.0f), vec2(1.0f, -1.0f));\n    const vec2 tex[4] = vec2[4](vec2(0.0f, 0.0f), vec2(1.0f, 0.0f), vec2(0.0f, 1.0f), vec2(1.0f, 1.0f));\n\n    layout(location = 0) out vec2 vTex;\n\n    void main() {\n        vTex = tex[gl_VertexIndex];\n        gl_Position = vec4(pos[gl_VertexIndex], 0.0, 1.0);\n    }\n    ",fragment:"\n    layout(set = 0, binding = 0) uniform sampler imgSampler;\n    layout(set = 0, binding = 1) uniform texture2D img;\n\n    layout(location = 0) in vec2 vTex;\n    layout(location = 0) out vec4 outColor;\n\n    void main() {\n        outColor = texture(sampler2D(img, imgSampler), vTex);\n    }\n    "},{vertex:Qr,fragment:"\n    #extension GL_EXT_samplerless_texture_functions : enable\n\n    layout(set = 0, binding = 0) uniform texture2D img;\n\n    #ifdef INVERTY\n        layout(location = 0) in flat ivec2 vTextureSize;\n    #endif\n    layout(location = 0) out vec4 outColor;\n\n    void main() {\n    #ifdef INVERTY\n        vec4 color = texelFetch(img, ivec2(gl_FragCoord.x, vTextureSize.y - gl_FragCoord.y), 0);\n    #else\n        vec4 color = texelFetch(img, ivec2(gl_FragCoord.xy), 0);\n    #endif\n    #ifdef PREMULTIPLYALPHA\n        color.rgb *= color.a;\n    #endif\n        outColor = color;\n    }\n    "},{vertex:"\n    const vec2 pos[4] = vec2[4](vec2(-1.0f, 1.0f), vec2(1.0f, 1.0f), vec2(-1.0f, -1.0f), vec2(1.0f, -1.0f));\n\n    void main() {\n        gl_Position = vec4(pos[gl_VertexIndex], 0.0, 1.0);\n    }\n    ",fragment:"\n    layout(set = 0, binding = 0) uniform Uniforms {\n        uniform vec4 color;\n    };\n\n    layout(location = 0) out vec4 outColor;\n\n    void main() {\n        outColor = color;\n    }\n    "},{vertex:Zr,fragment:"\n    #extension GL_EXT_samplerless_texture_functions : enable\n\n    layout(set = 0, binding = 0) uniform texture2D img;\n    layout(set = 0, binding = 1) uniform Params {\n        float ofstX;\n        float ofstY;\n        float width;\n        float height;\n    };\n\n    #ifdef INVERTY\n        layout(location = 0) in flat ivec2 vTextureSize;\n    #endif\n    layout(location = 0) out vec4 outColor;\n\n    void main() {\n        if (gl_FragCoord.x < ofstX || gl_FragCoord.x >= ofstX + width) {\n            discard;\n        }\n        if (gl_FragCoord.y < ofstY || gl_FragCoord.y >= ofstY + height) {\n            discard;\n        }\n    #ifdef INVERTY\n        vec4 color = texelFetch(img, ivec2(gl_FragCoord.x, ofstY + height - (gl_FragCoord.y - ofstY)), 0);\n    #else\n        vec4 color = texelFetch(img, ivec2(gl_FragCoord.xy), 0);\n    #endif\n    #ifdef PREMULTIPLYALPHA\n        color.rgb *= color.a;\n    #endif\n        outColor = color;\n    }\n    "}],io={"":0,r8unorm:1,r8uint:2,r8sint:3,r16uint:4,r16sint:5,r16float:6,rg8unorm:7,rg8uint:8,rg8sint:9,r32uint:10,r32sint:11,r32float:12,rg16uint:13,rg16sint:14,rg16float:15,rgba8unorm:16,"rgba8unorm-srgb":17,rgba8uint:18,rgba8sint:19,bgra8unorm:20,"bgra8unorm-srgb":21,rgb10a2unorm:22,rg32uint:23,rg32sint:24,rg32float:25,rgba16uint:26,rgba16sint:27,rgba16float:28,rgba32uint:29,rgba32sint:30,rgba32float:31,stencil8:32,depth16unorm:33,depth24plus:34,"depth24plus-stencil8":35,depth32float:36,"depth24unorm-stencil8":37,"depth32float-stencil8":38};class no{static ComputeNumMipmapLevels(e,t){return lt.R.ILog2(Math.max(e,t))+1}constructor(e,t,i,n){this._pipelines={},this._compiledShaders=[],this._videoPipelines={},this._videoCompiledShaders=[],this._deferredReleaseTextures=[],this._device=e,this._glslang=t,this._tintWASM=i,this._bufferManager=n,this._mipmapSampler=e.createSampler({minFilter:dr.Linear}),this._videoSampler=e.createSampler({minFilter:dr.Linear}),this._ubCopyWithOfst=this._bufferManager.createBuffer(16,sr.Uniform|sr.CopyDst).underlyingResource,this._getPipeline(cr.RGBA8Unorm),this._getVideoPipeline(cr.RGBA8Unorm)}_getPipeline(e,t=Jr.MipMap,i){const n=t===Jr.MipMap?1:t===Jr.InvertYPremultiplyAlpha?((i.invertY?1:0)<<1)+((i.premultiplyAlpha?1:0)<<2):t===Jr.Clear?8:t===Jr.InvertYPremultiplyAlphaWithOfst?((i.invertY?1:0)<<4)+((i.premultiplyAlpha?1:0)<<5):0;this._pipelines[e]||(this._pipelines[e]=[]);let s=this._pipelines[e][n];if(!s){let r="#version 450\r\n";t!==Jr.InvertYPremultiplyAlpha&&t!==Jr.InvertYPremultiplyAlphaWithOfst||(i.invertY&&(r+="#define INVERTY\r\n"),i.premultiplyAlpha&&(r+="#define PREMULTIPLYALPHA\r\n"));let o=this._compiledShaders[n];if(!o){let e=this._glslang.compileGLSL(r+to[t].vertex,"vertex"),i=this._glslang.compileGLSL(r+to[t].fragment,"fragment");this._tintWASM&&(e=this._tintWASM.convertSpirV2WGSL(e),i=this._tintWASM.convertSpirV2WGSL(i));const s=this._device.createShaderModule({code:e}),a=this._device.createShaderModule({code:i});o=this._compiledShaders[n]=[s,a]}const a=this._device.createRenderPipeline({layout:Tr.Auto,vertex:{module:o[0],entryPoint:"main"},fragment:{module:o[1],entryPoint:"main",targets:[{format:e}]},primitive:{topology:Sr.TriangleStrip,stripIndexFormat:Ir.Uint16}});s=this._pipelines[e][n]=[a,a.getBindGroupLayout(0)]}return s}_getVideoPipeline(e,t=eo.DontInvertY){const i=t===eo.InvertY?1:0;this._videoPipelines[e]||(this._videoPipelines[e]=[]);let n=this._videoPipelines[e][i];if(!n){let t=this._videoCompiledShaders[i];if(!t){const e=this._device.createShaderModule({code:"\n    struct VertexOutput {\n        @builtin(position) Position : vec4<f32>,\n        @location(0) fragUV : vec2<f32>\n    }\n  \n    @vertex\n    fn main(\n        @builtin(vertex_index) VertexIndex : u32\n    ) -> VertexOutput {\n        var pos = array<vec2<f32>, 4>(\n            vec2(-1.0,  1.0),\n            vec2( 1.0,  1.0),\n            vec2(-1.0, -1.0),\n            vec2( 1.0, -1.0)\n        );\n        var tex = array<vec2<f32>, 4>(\n            vec2(0.0, 0.0),\n            vec2(1.0, 0.0),\n            vec2(0.0, 1.0),\n            vec2(1.0, 1.0)\n        );\n\n        var output: VertexOutput;\n\n        output.Position = vec4<f32>(pos[VertexIndex], 0.0, 1.0);\n        output.fragUV = tex[VertexIndex];\n\n        return output;\n    }\n    "}),n=this._device.createShaderModule({code:0===i?"\n    @group(0) @binding(0) var videoSampler: sampler;\n    @group(0) @binding(1) var videoTexture: texture_external;\n\n    @fragment\n    fn main(\n        @location(0) fragUV: vec2<f32>\n    ) -> @location(0) vec4<f32> {\n        return textureSampleBaseClampToEdge(videoTexture, videoSampler, fragUV);\n    }\n    ":"\n    @group(0) @binding(0) var videoSampler: sampler;\n    @group(0) @binding(1) var videoTexture: texture_external;\n\n    @fragment\n    fn main(\n        @location(0) fragUV: vec2<f32>\n    ) -> @location(0) vec4<f32> {\n        return textureSampleBaseClampToEdge(videoTexture, videoSampler, vec2<f32>(fragUV.x, 1.0 - fragUV.y));\n    }\n    "});t=this._videoCompiledShaders[i]=[e,n]}const s=this._device.createRenderPipeline({label:`CopyVideoToTexture_${e}_${0===i?"DontInvertY":"InvertY"}`,layout:Tr.Auto,vertex:{module:t[0],entryPoint:"main"},fragment:{module:t[1],entryPoint:"main",targets:[{format:e}]},primitive:{topology:Sr.TriangleStrip,stripIndexFormat:Ir.Uint16}});n=this._videoPipelines[e][i]=[s,s.getBindGroupLayout(0)]}return n}static _GetTextureTypeFromFormat(e){switch(e){case cr.R8Unorm:case cr.R8Snorm:case cr.R8Uint:case cr.R8Sint:case cr.RG8Unorm:case cr.RG8Snorm:case cr.RG8Uint:case cr.RG8Sint:case cr.RGBA8Unorm:case cr.RGBA8UnormSRGB:case cr.RGBA8Snorm:case cr.RGBA8Uint:case cr.RGBA8Sint:case cr.BGRA8Unorm:case cr.BGRA8UnormSRGB:case cr.RGB10A2Unorm:case cr.RGB9E5UFloat:case cr.RG11B10UFloat:case cr.Depth24UnormStencil8:case cr.Depth32FloatStencil8:case cr.BC7RGBAUnorm:case cr.BC7RGBAUnormSRGB:case cr.BC6HRGBUFloat:case cr.BC6HRGBFloat:case cr.BC5RGUnorm:case cr.BC5RGSnorm:case cr.BC3RGBAUnorm:case cr.BC3RGBAUnormSRGB:case cr.BC2RGBAUnorm:case cr.BC2RGBAUnormSRGB:case cr.BC4RUnorm:case cr.BC4RSnorm:case cr.BC1RGBAUnorm:case cr.BC1RGBAUnormSRGB:case cr.ETC2RGB8Unorm:case cr.ETC2RGB8UnormSRGB:case cr.ETC2RGB8A1Unorm:case cr.ETC2RGB8A1UnormSRGB:case cr.ETC2RGBA8Unorm:case cr.ETC2RGBA8UnormSRGB:case cr.EACR11Unorm:case cr.EACR11Snorm:case cr.EACRG11Unorm:case cr.EACRG11Snorm:case cr.ASTC4x4Unorm:case cr.ASTC4x4UnormSRGB:case cr.ASTC5x4Unorm:case cr.ASTC5x4UnormSRGB:case cr.ASTC5x5Unorm:case cr.ASTC5x5UnormSRGB:case cr.ASTC6x5Unorm:case cr.ASTC6x5UnormSRGB:case cr.ASTC6x6Unorm:case cr.ASTC6x6UnormSRGB:case cr.ASTC8x5Unorm:case cr.ASTC8x5UnormSRGB:case cr.ASTC8x6Unorm:case cr.ASTC8x6UnormSRGB:case cr.ASTC8x8Unorm:case cr.ASTC8x8UnormSRGB:case cr.ASTC10x5Unorm:case cr.ASTC10x5UnormSRGB:case cr.ASTC10x6Unorm:case cr.ASTC10x6UnormSRGB:case cr.ASTC10x8Unorm:case cr.ASTC10x8UnormSRGB:case cr.ASTC10x10Unorm:case cr.ASTC10x10UnormSRGB:case cr.ASTC12x10Unorm:case cr.ASTC12x10UnormSRGB:case cr.ASTC12x12Unorm:case cr.ASTC12x12UnormSRGB:return 0;case cr.R16Uint:case cr.R16Sint:case cr.RG16Uint:case cr.RG16Sint:case cr.RGBA16Uint:case cr.RGBA16Sint:case cr.Depth16Unorm:return 5;case cr.R16Float:case cr.RG16Float:case cr.RGBA16Float:return 2;case cr.R32Uint:case cr.R32Sint:case cr.RG32Uint:case cr.RG32Sint:case cr.RGBA32Uint:case cr.RGBA32Sint:return 7;case cr.R32Float:case cr.RG32Float:case cr.RGBA32Float:case cr.Depth32Float:return 1;case cr.Stencil8:throw"No fixed size for Stencil8 format!";case cr.Depth24Plus:throw"No fixed size for Depth24Plus format!";case cr.Depth24PlusStencil8:throw"No fixed size for Depth24PlusStencil8 format!"}return 0}static _GetBlockInformationFromFormat(e){switch(e){case cr.R8Unorm:case cr.R8Snorm:case cr.R8Uint:case cr.R8Sint:return{width:1,height:1,length:1};case cr.R16Uint:case cr.R16Sint:case cr.R16Float:case cr.RG8Unorm:case cr.RG8Snorm:case cr.RG8Uint:case cr.RG8Sint:return{width:1,height:1,length:2};case cr.R32Uint:case cr.R32Sint:case cr.R32Float:case cr.RG16Uint:case cr.RG16Sint:case cr.RG16Float:case cr.RGBA8Unorm:case cr.RGBA8UnormSRGB:case cr.RGBA8Snorm:case cr.RGBA8Uint:case cr.RGBA8Sint:case cr.BGRA8Unorm:case cr.BGRA8UnormSRGB:case cr.RGB9E5UFloat:case cr.RGB10A2Unorm:case cr.RG11B10UFloat:return{width:1,height:1,length:4};case cr.RG32Uint:case cr.RG32Sint:case cr.RG32Float:case cr.RGBA16Uint:case cr.RGBA16Sint:case cr.RGBA16Float:return{width:1,height:1,length:8};case cr.RGBA32Uint:case cr.RGBA32Sint:case cr.RGBA32Float:return{width:1,height:1,length:16};case cr.Stencil8:throw"No fixed size for Stencil8 format!";case cr.Depth16Unorm:return{width:1,height:1,length:2};case cr.Depth24Plus:throw"No fixed size for Depth24Plus format!";case cr.Depth24PlusStencil8:throw"No fixed size for Depth24PlusStencil8 format!";case cr.Depth32Float:case cr.Depth24UnormStencil8:return{width:1,height:1,length:4};case cr.Depth32FloatStencil8:return{width:1,height:1,length:5};case cr.BC7RGBAUnorm:case cr.BC7RGBAUnormSRGB:case cr.BC6HRGBUFloat:case cr.BC6HRGBFloat:case cr.BC5RGUnorm:case cr.BC5RGSnorm:case cr.BC3RGBAUnorm:case cr.BC3RGBAUnormSRGB:case cr.BC2RGBAUnorm:case cr.BC2RGBAUnormSRGB:return{width:4,height:4,length:16};case cr.BC4RUnorm:case cr.BC4RSnorm:case cr.BC1RGBAUnorm:case cr.BC1RGBAUnormSRGB:case cr.ETC2RGB8Unorm:case cr.ETC2RGB8UnormSRGB:case cr.ETC2RGB8A1Unorm:case cr.ETC2RGB8A1UnormSRGB:case cr.EACR11Unorm:case cr.EACR11Snorm:return{width:4,height:4,length:8};case cr.ETC2RGBA8Unorm:case cr.ETC2RGBA8UnormSRGB:case cr.EACRG11Unorm:case cr.EACRG11Snorm:case cr.ASTC4x4Unorm:case cr.ASTC4x4UnormSRGB:return{width:4,height:4,length:16};case cr.ASTC5x4Unorm:case cr.ASTC5x4UnormSRGB:return{width:5,height:4,length:16};case cr.ASTC5x5Unorm:case cr.ASTC5x5UnormSRGB:return{width:5,height:5,length:16};case cr.ASTC6x5Unorm:case cr.ASTC6x5UnormSRGB:return{width:6,height:5,length:16};case cr.ASTC6x6Unorm:case cr.ASTC6x6UnormSRGB:return{width:6,height:6,length:16};case cr.ASTC8x5Unorm:case cr.ASTC8x5UnormSRGB:return{width:8,height:5,length:16};case cr.ASTC8x6Unorm:case cr.ASTC8x6UnormSRGB:return{width:8,height:6,length:16};case cr.ASTC8x8Unorm:case cr.ASTC8x8UnormSRGB:return{width:8,height:8,length:16};case cr.ASTC10x5Unorm:case cr.ASTC10x5UnormSRGB:return{width:10,height:5,length:16};case cr.ASTC10x6Unorm:case cr.ASTC10x6UnormSRGB:return{width:10,height:6,length:16};case cr.ASTC10x8Unorm:case cr.ASTC10x8UnormSRGB:return{width:10,height:8,length:16};case cr.ASTC10x10Unorm:case cr.ASTC10x10UnormSRGB:return{width:10,height:10,length:16};case cr.ASTC12x10Unorm:case cr.ASTC12x10UnormSRGB:return{width:12,height:10,length:16};case cr.ASTC12x12Unorm:case cr.ASTC12x12UnormSRGB:return{width:12,height:12,length:16}}return{width:1,height:1,length:4}}static _IsHardwareTexture(e){return!!e.release}static _IsInternalTexture(e){return!!e.dispose}static IsImageBitmap(e){return void 0!==e.close}static IsImageBitmapArray(e){return Array.isArray(e)&&void 0!==e[0].close}setCommandEncoder(e){this._commandEncoderForCreation=e}static IsCompressedFormat(e){switch(e){case cr.BC7RGBAUnormSRGB:case cr.BC7RGBAUnorm:case cr.BC6HRGBFloat:case cr.BC6HRGBUFloat:case cr.BC5RGSnorm:case cr.BC5RGUnorm:case cr.BC4RSnorm:case cr.BC4RUnorm:case cr.BC3RGBAUnormSRGB:case cr.BC3RGBAUnorm:case cr.BC2RGBAUnormSRGB:case cr.BC2RGBAUnorm:case cr.BC1RGBAUnormSRGB:case cr.BC1RGBAUnorm:case cr.ETC2RGB8Unorm:case cr.ETC2RGB8UnormSRGB:case cr.ETC2RGB8A1Unorm:case cr.ETC2RGB8A1UnormSRGB:case cr.ETC2RGBA8Unorm:case cr.ETC2RGBA8UnormSRGB:case cr.EACR11Unorm:case cr.EACR11Snorm:case cr.EACRG11Unorm:case cr.EACRG11Snorm:case cr.ASTC4x4Unorm:case cr.ASTC4x4UnormSRGB:case cr.ASTC5x4Unorm:case cr.ASTC5x4UnormSRGB:case cr.ASTC5x5Unorm:case cr.ASTC5x5UnormSRGB:case cr.ASTC6x5Unorm:case cr.ASTC6x5UnormSRGB:case cr.ASTC6x6Unorm:case cr.ASTC6x6UnormSRGB:case cr.ASTC8x5Unorm:case cr.ASTC8x5UnormSRGB:case cr.ASTC8x6Unorm:case cr.ASTC8x6UnormSRGB:case cr.ASTC8x8Unorm:case cr.ASTC8x8UnormSRGB:case cr.ASTC10x5Unorm:case cr.ASTC10x5UnormSRGB:case cr.ASTC10x6Unorm:case cr.ASTC10x6UnormSRGB:case cr.ASTC10x8Unorm:case cr.ASTC10x8UnormSRGB:case cr.ASTC10x10Unorm:case cr.ASTC10x10UnormSRGB:case cr.ASTC12x10Unorm:case cr.ASTC12x10UnormSRGB:case cr.ASTC12x12Unorm:case cr.ASTC12x12UnormSRGB:return!0}return!1}static GetWebGPUTextureFormat(e,t,i=!1){switch(t){case 15:return cr.Depth16Unorm;case 16:return cr.Depth24Plus;case 13:return cr.Depth24PlusStencil8;case 14:return cr.Depth32Float;case 17:return cr.Depth24UnormStencil8;case 18:return cr.Depth32FloatStencil8;case 19:return cr.Stencil8;case 36492:return i?cr.BC7RGBAUnormSRGB:cr.BC7RGBAUnorm;case 36495:return cr.BC6HRGBUFloat;case 36494:return cr.BC6HRGBFloat;case 33779:return i?cr.BC3RGBAUnormSRGB:cr.BC3RGBAUnorm;case 33778:return i?cr.BC2RGBAUnormSRGB:cr.BC2RGBAUnorm;case 33777:case 33776:return i?cr.BC1RGBAUnormSRGB:cr.BC1RGBAUnorm;case 37808:return i?cr.ASTC4x4UnormSRGB:cr.ASTC4x4Unorm;case 36196:case 37492:return i?cr.ETC2RGB8UnormSRGB:cr.ETC2RGB8Unorm;case 37496:return i?cr.ETC2RGBA8UnormSRGB:cr.ETC2RGBA8Unorm}switch(e){case 3:switch(t){case 6:return cr.R8Snorm;case 7:return cr.RG8Snorm;case 4:throw"RGB format not supported in WebGPU";case 8:return cr.R8Sint;case 9:return cr.RG8Sint;case 10:throw"RGB_INTEGER format not supported in WebGPU";case 11:return cr.RGBA8Sint;default:return cr.RGBA8Snorm}case 0:switch(t){case 6:return cr.R8Unorm;case 7:return cr.RG8Unorm;case 4:throw"TEXTUREFORMAT_RGB format not supported in WebGPU";case 5:return i?cr.RGBA8UnormSRGB:cr.RGBA8Unorm;case 12:return i?cr.BGRA8UnormSRGB:cr.BGRA8Unorm;case 8:return cr.R8Uint;case 9:return cr.RG8Uint;case 10:throw"RGB_INTEGER format not supported in WebGPU";case 11:return cr.RGBA8Uint;case 0:throw"TEXTUREFORMAT_ALPHA format not supported in WebGPU";case 1:throw"TEXTUREFORMAT_LUMINANCE format not supported in WebGPU";case 2:throw"TEXTUREFORMAT_LUMINANCE_ALPHA format not supported in WebGPU";default:return cr.RGBA8Unorm}case 4:switch(t){case 8:return cr.R16Sint;case 9:return cr.RG16Sint;case 10:throw"TEXTUREFORMAT_RGB_INTEGER format not supported in WebGPU";default:return cr.RGBA16Sint}case 5:switch(t){case 8:return cr.R16Uint;case 9:return cr.RG16Uint;case 10:throw"TEXTUREFORMAT_RGB_INTEGER format not supported in WebGPU";default:return cr.RGBA16Uint}case 6:switch(t){case 8:return cr.R32Sint;case 9:return cr.RG32Sint;case 10:throw"TEXTUREFORMAT_RGB_INTEGER format not supported in WebGPU";default:return cr.RGBA32Sint}case 7:switch(t){case 8:return cr.R32Uint;case 9:return cr.RG32Uint;case 10:throw"TEXTUREFORMAT_RGB_INTEGER format not supported in WebGPU";default:return cr.RGBA32Uint}case 1:switch(t){case 6:return cr.R32Float;case 7:return cr.RG32Float;case 4:throw"TEXTUREFORMAT_RGB format not supported in WebGPU";default:return cr.RGBA32Float}case 2:switch(t){case 6:return cr.R16Float;case 7:return cr.RG16Float;case 4:throw"TEXTUREFORMAT_RGB format not supported in WebGPU";default:return cr.RGBA16Float}case 10:throw"TEXTURETYPE_UNSIGNED_SHORT_5_6_5 format not supported in WebGPU";case 13:throw"TEXTURETYPE_UNSIGNED_INT_10F_11F_11F_REV format not supported in WebGPU";case 14:throw"TEXTURETYPE_UNSIGNED_INT_5_9_9_9_REV format not supported in WebGPU";case 8:throw"TEXTURETYPE_UNSIGNED_SHORT_4_4_4_4 format not supported in WebGPU";case 9:throw"TEXTURETYPE_UNSIGNED_SHORT_5_5_5_1 format not supported in WebGPU";case 11:switch(t){case 5:default:return cr.RGB10A2Unorm;case 11:throw"TEXTUREFORMAT_RGBA_INTEGER format not supported in WebGPU when type is TEXTURETYPE_UNSIGNED_INT_2_10_10_10_REV"}}return i?cr.RGBA8UnormSRGB:cr.RGBA8Unorm}static GetNumChannelsFromWebGPUTextureFormat(e){switch(e){case cr.R8Unorm:case cr.R8Snorm:case cr.R8Uint:case cr.R8Sint:case cr.BC4RUnorm:case cr.BC4RSnorm:case cr.R16Uint:case cr.R16Sint:case cr.Depth16Unorm:case cr.R16Float:case cr.R32Uint:case cr.R32Sint:case cr.R32Float:case cr.Depth32Float:case cr.Stencil8:case cr.Depth24Plus:case cr.EACR11Unorm:case cr.EACR11Snorm:return 1;case cr.RG8Unorm:case cr.RG8Snorm:case cr.RG8Uint:case cr.RG8Sint:case cr.Depth24UnormStencil8:case cr.Depth32FloatStencil8:case cr.BC5RGUnorm:case cr.BC5RGSnorm:case cr.RG16Uint:case cr.RG16Sint:case cr.RG16Float:case cr.RG32Uint:case cr.RG32Sint:case cr.RG32Float:case cr.Depth24PlusStencil8:case cr.EACRG11Unorm:case cr.EACRG11Snorm:return 2;case cr.RGB9E5UFloat:case cr.RG11B10UFloat:case cr.BC6HRGBUFloat:case cr.BC6HRGBFloat:case cr.ETC2RGB8Unorm:case cr.ETC2RGB8UnormSRGB:return 3;case cr.RGBA8Unorm:case cr.RGBA8UnormSRGB:case cr.RGBA8Snorm:case cr.RGBA8Uint:case cr.RGBA8Sint:case cr.BGRA8Unorm:case cr.BGRA8UnormSRGB:case cr.RGB10A2Unorm:case cr.BC7RGBAUnorm:case cr.BC7RGBAUnormSRGB:case cr.BC3RGBAUnorm:case cr.BC3RGBAUnormSRGB:case cr.BC2RGBAUnorm:case cr.BC2RGBAUnormSRGB:case cr.BC1RGBAUnorm:case cr.BC1RGBAUnormSRGB:case cr.RGBA16Uint:case cr.RGBA16Sint:case cr.RGBA16Float:case cr.RGBA32Uint:case cr.RGBA32Sint:case cr.RGBA32Float:case cr.ETC2RGB8A1Unorm:case cr.ETC2RGB8A1UnormSRGB:case cr.ETC2RGBA8Unorm:case cr.ETC2RGBA8UnormSRGB:case cr.ASTC4x4Unorm:case cr.ASTC4x4UnormSRGB:case cr.ASTC5x4Unorm:case cr.ASTC5x4UnormSRGB:case cr.ASTC5x5Unorm:case cr.ASTC5x5UnormSRGB:case cr.ASTC6x5Unorm:case cr.ASTC6x5UnormSRGB:case cr.ASTC6x6Unorm:case cr.ASTC6x6UnormSRGB:case cr.ASTC8x5Unorm:case cr.ASTC8x5UnormSRGB:case cr.ASTC8x6Unorm:case cr.ASTC8x6UnormSRGB:case cr.ASTC8x8Unorm:case cr.ASTC8x8UnormSRGB:case cr.ASTC10x5Unorm:case cr.ASTC10x5UnormSRGB:case cr.ASTC10x6Unorm:case cr.ASTC10x6UnormSRGB:case cr.ASTC10x8Unorm:case cr.ASTC10x8UnormSRGB:case cr.ASTC10x10Unorm:case cr.ASTC10x10UnormSRGB:case cr.ASTC12x10Unorm:case cr.ASTC12x10UnormSRGB:case cr.ASTC12x12Unorm:case cr.ASTC12x12UnormSRGB:return 4}throw`Unknown format ${e}!`}static HasStencilAspect(e){switch(e){case cr.Stencil8:case cr.Depth24UnormStencil8:case cr.Depth32FloatStencil8:case cr.Depth24PlusStencil8:return!0}return!1}static HasDepthAndStencilAspects(e){switch(e){case cr.Depth24UnormStencil8:case cr.Depth32FloatStencil8:case cr.Depth24PlusStencil8:return!0}return!1}static GetDepthFormatOnly(e){switch(e){case cr.Depth16Unorm:return cr.Depth16Unorm;case cr.Depth24Plus:case cr.Depth24PlusStencil8:case cr.Depth24UnormStencil8:return cr.Depth24Plus;case cr.Depth32Float:case cr.Depth32FloatStencil8:return cr.Depth32Float}return e}copyVideoToTexture(e,t,i,n=!1,s){var r,o,a,l;const h=void 0===s,[c,u]=this._getVideoPipeline(i,n?eo.InvertY:eo.DontInvertY);h&&(s=this._device.createCommandEncoder({})),null===(o=(r=s).pushDebugGroup)||void 0===o||o.call(r,`copy video to texture - invertY=${n}`);const d={colorAttachments:[{view:t._hardwareTexture.underlyingResource.createView({format:i,dimension:lr.E2d,mipLevelCount:1,baseArrayLayer:0,baseMipLevel:0,arrayLayerCount:1,aspect:hr.All}),loadOp:Fr.Load,storeOp:Lr.Store}]},p=s.beginRenderPass(d),f={layout:u,entries:[{binding:0,resource:this._videoSampler},{binding:1,resource:this._device.importExternalTexture({source:e.underlyingResource})}]},_=this._device.createBindGroup(f);p.setPipeline(c),p.setBindGroup(0,_),p.draw(4,1,0,0),p.end(),null===(l=(a=s).popDebugGroup)||void 0===l||l.call(a),h&&(this._device.queue.submit([s.finish()]),s=null)}invertYPreMultiplyAlpha(e,t,i,n,s=!1,r=!1,o=0,a=0,l=1,h=0,c=0,u=0,d=0,p,f){var _,m,g,v,y,x;const b=0!==u,T=void 0===p,[S,E]=this._getPipeline(n,b?Jr.InvertYPremultiplyAlphaWithOfst:Jr.InvertYPremultiplyAlpha,{invertY:s,premultiplyAlpha:r});let C;if(o=Math.max(o,0),T&&(p=this._device.createCommandEncoder({})),null===(m=(_=p).pushDebugGroup)||void 0===m||m.call(_,`internal process texture - invertY=${s} premultiplyAlpha=${r}`),no._IsHardwareTexture(e)?(C=e.underlyingResource,s&&!r&&1===l&&0===o||(e=void 0)):(C=e,e=void 0),!C)return;b&&this._bufferManager.setRawData(this._ubCopyWithOfst,0,new Float32Array([h,c,u,d]),0,16);const A=e,P=null!==(g=null==A?void 0:A._copyInvertYTempTexture)&&void 0!==g?g:this.createTexture({width:t,height:i,layers:1},!1,!1,!1,!1,!1,n,1,p,ar.CopySrc|ar.RenderAttachment|ar.TextureBinding,void 0,"TempTextureForCopyWithInvertY"),R=null!==(v=null==A?void 0:A._copyInvertYRenderPassDescr)&&void 0!==v?v:{colorAttachments:[{view:P.createView({format:n,dimension:lr.E2d,baseMipLevel:0,mipLevelCount:1,arrayLayerCount:1,baseArrayLayer:0}),loadOp:Fr.Load,storeOp:Lr.Store}]},M=p.beginRenderPass(R);let I=b?null==A?void 0:A._copyInvertYBindGroupWithOfst:null==A?void 0:A._copyInvertYBindGroup;if(!I){const e={layout:E,entries:[{binding:0,resource:C.createView({format:n,dimension:lr.E2d,baseMipLevel:a,mipLevelCount:1,arrayLayerCount:l,baseArrayLayer:o})}]};b&&e.entries.push({binding:1,resource:{buffer:this._ubCopyWithOfst}}),I=this._device.createBindGroup(e)}M.setPipeline(S),M.setBindGroup(0,I),M.draw(4,1,0,0),M.end(),p.copyTextureToTexture({texture:P},{texture:C,mipLevel:a,origin:{x:0,y:0,z:o}},{width:t,height:i,depthOrArrayLayers:1}),A?(A._copyInvertYTempTexture=P,A._copyInvertYRenderPassDescr=R,b?A._copyInvertYBindGroupWithOfst=I:A._copyInvertYBindGroup=I):this._deferredReleaseTextures.push([P,null]),null===(x=(y=p).popDebugGroup)||void 0===x||x.call(y),T&&(this._device.queue.submit([p.finish()]),p=null)}copyWithInvertY(e,t,i,n){var s,r,o,a;const l=void 0===n,[h,c]=this._getPipeline(t,Jr.InvertYPremultiplyAlpha,{invertY:!0,premultiplyAlpha:!1});l&&(n=this._device.createCommandEncoder({})),null===(r=(s=n).pushDebugGroup)||void 0===r||r.call(s,"internal copy texture with invertY");const u=n.beginRenderPass(i),d=this._device.createBindGroup({layout:c,entries:[{binding:0,resource:e}]});u.setPipeline(h),u.setBindGroup(0,d),u.draw(4,1,0,0),u.end(),null===(a=(o=n).popDebugGroup)||void 0===a||a.call(o),l&&(this._device.queue.submit([n.finish()]),n=null)}createTexture(e,t=!1,i=!1,n=!1,s=!1,r=!1,o=cr.RGBA8Unorm,a=1,l,h=-1,c=0,u){a>1&&(a=4);const d=e.layers||1,p={width:e.width,height:e.height,depthOrArrayLayers:d},f=no.IsCompressedFormat(o),_=t?no.ComputeNumMipmapLevels(e.width,e.height):1,m=h>=0?h:ar.CopySrc|ar.CopyDst|ar.TextureBinding;c|=t&&!f?ar.CopySrc|ar.RenderAttachment:0,f||r||(c|=ar.RenderAttachment|ar.CopyDst);const g=this._device.createTexture({label:`Texture${r?"3D":"2D"}_${u?u+"_":""}${p.width}x${p.height}x${p.depthOrArrayLayers}_${t?"wmips":"womips"}_${o}_samples${a}`,size:p,dimension:r?or.E3d:or.E2d,format:o,usage:m|c,sampleCount:a,mipLevelCount:_});return no.IsImageBitmap(e)&&(this.updateTexture(e,g,e.width,e.height,d,o,0,0,n,s,0,0),t&&i&&this.generateMipmaps(g,o,_,0,l)),g}createCubeTexture(e,t=!1,i=!1,n=!1,s=!1,r=cr.RGBA8Unorm,o=1,a,l=-1,h=0,c){o>1&&(o=4);const u=no.IsImageBitmapArray(e)?e[0].width:e.width,d=no.IsImageBitmapArray(e)?e[0].height:e.height,p=no.IsCompressedFormat(r),f=t?no.ComputeNumMipmapLevels(u,d):1,_=l>=0?l:ar.CopySrc|ar.CopyDst|ar.TextureBinding;h|=t&&!p?ar.CopySrc|ar.RenderAttachment:0,p||(h|=ar.RenderAttachment|ar.CopyDst);const m=this._device.createTexture({label:`TextureCube_${c?c+"_":""}${u}x${d}x6_${t?"wmips":"womips"}_${r}_samples${o}`,size:{width:u,height:d,depthOrArrayLayers:6},dimension:or.E2d,format:r,usage:_|h,sampleCount:o,mipLevelCount:f});return no.IsImageBitmapArray(e)&&(this.updateCubeTextures(e,m,u,d,r,n,s,0,0),t&&i&&this.generateCubeMipmaps(m,r,f,a)),m}generateCubeMipmaps(e,t,i,n){var s,r,o,a;const l=void 0===n;l&&(n=this._device.createCommandEncoder({})),null===(r=(s=n).pushDebugGroup)||void 0===r||r.call(s,`create cube mipmaps - ${i} levels`);for(let s=0;s<6;++s)this.generateMipmaps(e,t,i,s,n);null===(a=(o=n).popDebugGroup)||void 0===a||a.call(o),l&&(this._device.queue.submit([n.finish()]),n=null)}generateMipmaps(e,t,i,n=0,s){var r,o,a,l,h,c,u,d;const p=void 0===s,[f,_]=this._getPipeline(t);let m;if(n=Math.max(n,0),p&&(s=this._device.createCommandEncoder({})),null===(o=(r=s).pushDebugGroup)||void 0===o||o.call(r,`create mipmaps for face #${n} - ${i} levels`),no._IsHardwareTexture(e)?(m=e.underlyingResource,e._mipmapGenRenderPassDescr=e._mipmapGenRenderPassDescr||[],e._mipmapGenBindGroup=e._mipmapGenBindGroup||[]):(m=e,e=void 0),!m)return;const g=e;for(let e=1;e<i;++e){const i=null!==(l=null===(a=null==g?void 0:g._mipmapGenRenderPassDescr[n])||void 0===a?void 0:a[e-1])&&void 0!==l?l:{colorAttachments:[{view:m.createView({format:t,dimension:lr.E2d,baseMipLevel:e,mipLevelCount:1,arrayLayerCount:1,baseArrayLayer:n}),loadOp:Fr.Load,storeOp:Lr.Store}]};g&&(g._mipmapGenRenderPassDescr[n]=g._mipmapGenRenderPassDescr[n]||[],g._mipmapGenRenderPassDescr[n][e-1]=i);const r=s.beginRenderPass(i),o=null!==(c=null===(h=null==g?void 0:g._mipmapGenBindGroup[n])||void 0===h?void 0:h[e-1])&&void 0!==c?c:this._device.createBindGroup({layout:_,entries:[{binding:0,resource:this._mipmapSampler},{binding:1,resource:m.createView({format:t,dimension:lr.E2d,baseMipLevel:e-1,mipLevelCount:1,arrayLayerCount:1,baseArrayLayer:n})}]});g&&(g._mipmapGenBindGroup[n]=g._mipmapGenBindGroup[n]||[],g._mipmapGenBindGroup[n][e-1]=o),r.setPipeline(f),r.setBindGroup(0,o),r.draw(4,1,0,0),r.end()}null===(d=(u=s).popDebugGroup)||void 0===d||d.call(u),p&&(this._device.queue.submit([s.finish()]),s=null)}createGPUTextureForInternalTexture(e,t,i,n,s){e._hardwareTexture||(e._hardwareTexture=new $r),void 0===t&&(t=e.width),void 0===i&&(i=e.height),void 0===n&&(n=e.depth);const r=e._hardwareTexture,o=0!=(1&(null!=s?s:0));r.format=no.GetWebGPUTextureFormat(e.type,e.format,e._useSRGBBuffer),r.textureUsages=e._source===Ei.S.RenderTarget||e.source===Ei.S.MultiRenderTarget?ar.TextureBinding|ar.CopySrc|ar.RenderAttachment:e._source===Ei.S.DepthStencil?ar.TextureBinding|ar.RenderAttachment:-1,r.textureAdditionalUsages=o?ar.StorageBinding:0;const a=e.generateMipMaps,l=n||1;let h;if(h=null!==e._maxLodLevel?e._maxLodLevel:a?no.ComputeNumMipmapLevels(t,i):1,e.isCube){const n=this.createCubeTexture({width:t,height:i},e.generateMipMaps,e.generateMipMaps,e.invertY,!1,r.format,1,this._commandEncoderForCreation,r.textureUsages,r.textureAdditionalUsages,e.label);r.set(n),r.createView({format:no.GetDepthFormatOnly(r.format),dimension:lr.Cube,mipLevelCount:h,baseArrayLayer:0,baseMipLevel:0,arrayLayerCount:6,aspect:no.HasDepthAndStencilAspects(r.format)?hr.DepthOnly:hr.All},o)}else{const n=this.createTexture({width:t,height:i,layers:l},e.generateMipMaps,e.generateMipMaps,e.invertY,!1,e.is3D,r.format,1,this._commandEncoderForCreation,r.textureUsages,r.textureAdditionalUsages,e.label);r.set(n),r.createView({format:no.GetDepthFormatOnly(r.format),dimension:e.is2DArray?lr.E2dArray:e.is3D?or.E3d:lr.E2d,mipLevelCount:h,baseArrayLayer:0,baseMipLevel:0,arrayLayerCount:e.is3D?1:l,aspect:no.HasDepthAndStencilAspects(r.format)?hr.DepthOnly:hr.All},o)}return e.width=e.baseWidth=t,e.height=e.baseHeight=i,e.depth=e.baseDepth=n,this.createMSAATexture(e,e.samples),r}createMSAATexture(e,t,i=!0,n=-1){const s=e._hardwareTexture;if(i&&(null==s||s.releaseMSAATexture()),!s||(null!=t?t:1)<=1)return;const r=e.width,o=e.height,a=this.createTexture({width:r,height:o,layers:1},!1,!1,!1,!1,!1,s.format,t,this._commandEncoderForCreation,ar.RenderAttachment,0,e.label?"MSAA"+e.label:void 0);s.setMSAATexture(a,n)}updateCubeTextures(e,t,i,n,s,r=!1,o=!1,a=0,l=0){const h=[0,3,1,4,2,5];for(let c=0;c<h.length;++c){const u=e[h[c]];this.updateTexture(u,t,i,n,1,s,c,0,r,o,a,l)}}updateTexture(e,t,i,n,s,r,o=0,a=0,l=!1,h=!1,c=0,u=0,d){const p=no._IsInternalTexture(t)?t._hardwareTexture.underlyingResource:t,f=no._GetBlockInformationFromFormat(r),_=no._IsInternalTexture(t)?t._hardwareTexture:t,m={texture:p,origin:{x:c,y:u,z:Math.max(o,0)},mipLevel:a,premultipliedAlpha:h},g={width:Math.ceil(i/f.width)*f.width,height:Math.ceil(n/f.height)*f.height,depthOrArrayLayers:s||1};if(void 0!==e.byteLength){const p=Math.ceil(i/f.width)*f.length;if(256*Math.ceil(p/256)===p){const t=this._device.createCommandEncoder({}),i=this._bufferManager.createRawBuffer(e.byteLength,sr.MapWrite|sr.CopySrc,!0),s=i.getMappedRange();new Uint8Array(s).set(e),i.unmap(),t.copyBufferToTexture({buffer:i,offset:0,bytesPerRow:p,rowsPerImage:n},m,g),this._device.queue.submit([t.finish()]),this._bufferManager.releaseBuffer(i)}else this._device.queue.writeTexture(m,e,{offset:0,bytesPerRow:p,rowsPerImage:n},g);if(l||h){if(!no._IsInternalTexture(t))throw"updateTexture: Can't process the texture data because a GPUTexture was provided instead of an InternalTexture!";{const e=0===c&&0===u&&i===t.width&&n===t.height;this.invertYPreMultiplyAlpha(_,t.width,t.height,r,l,h,o,a,s||1,c,u,e?0:i,e?0:n,void 0,d)}}}else if(l)if(m.premultipliedAlpha=!1,no._IsInternalTexture(t)&&0===c&&0===u&&i===t.width&&n===t.height)this._device.queue.copyExternalImageToTexture({source:e},m,g),this.invertYPreMultiplyAlpha(_,i,n,r,l,h,o,a,s||1,0,0,0,0,void 0,d);else{const t=this._device.createCommandEncoder({}),c=this.createTexture({width:i,height:n,layers:1},!1,!1,!1,!1,!1,r,1,t,ar.CopySrc|ar.TextureBinding,void 0,"TempTextureForUpdateTexture");this._deferredReleaseTextures.push([c,null]),g.depthOrArrayLayers=1,this._device.queue.copyExternalImageToTexture({source:e},{texture:c},g),g.depthOrArrayLayers=s||1,this.invertYPreMultiplyAlpha(c,i,n,r,l,h,o,a,s||1,0,0,0,0,t,d),t.copyTextureToTexture({texture:c},m,g),this._device.queue.submit([t.finish()])}else this._device.queue.copyExternalImageToTexture({source:e},m,g)}readPixels(e,t,i,n,s,r,o=0,a=0,l=null,h=!1){const c=no._GetBlockInformationFromFormat(r),u=Math.ceil(n/c.width)*c.length,d=256*Math.ceil(u/256),p=d*s,f=this._bufferManager.createRawBuffer(p,sr.MapRead|sr.CopyDst),_=this._device.createCommandEncoder({});return _.copyTextureToBuffer({texture:e,mipLevel:a,origin:{x:t,y:i,z:Math.max(o,0)}},{buffer:f,offset:0,bytesPerRow:d},{width:n,height:s,depthOrArrayLayers:1}),this._device.queue.submit([_.finish()]),this._bufferManager.readDataFromBuffer(f,p,n,s,u,d,no._GetTextureTypeFromFormat(r),0,l,!0,h)}releaseTexture(e){if(no._IsInternalTexture(e)){const t=e._hardwareTexture,i=e._irradianceTexture;this._deferredReleaseTextures.push([t,i])}else this._deferredReleaseTextures.push([e,null])}destroyDeferredTextures(){for(let e=0;e<this._deferredReleaseTextures.length;++e){const[t,i]=this._deferredReleaseTextures[e];t&&(no._IsHardwareTexture(t)?t.release():t.destroy()),null==i||i.dispose()}this._deferredReleaseTextures.length=0}}class so extends Ke.h{constructor(e){super(),this._buffer=e}get underlyingResource(){return this._buffer}}var ro=i(806);class oo{static _IsGPUBuffer(e){return void 0===e.underlyingResource}constructor(e){this._deferredReleaseBuffers=[],this._device=e}createRawBuffer(e,t,i=!1){const n={mappedAtCreation:i,size:void 0!==e.byteLength?e.byteLength+3&-4:e+3&-4,usage:t};return this._device.createBuffer(n)}createBuffer(e,t){const i=void 0!==e.byteLength,n=this.createRawBuffer(e,t),s=new so(n);return s.references=1,s.capacity=i?e.byteLength:e,i&&this.setSubData(s,0,e),s}setRawData(e,t,i,n,s){this._device.queue.writeBuffer(e,t,i.buffer,n,s)}setSubData(e,t,i,n=0,s=0){const r=e.underlyingResource;s=s||i.byteLength,s=Math.min(s,e.capacity-t);let o=i.byteOffset+n,a=o+s;const l=s+3&-4;if(l!==s){const e=new Uint8Array(i.buffer.slice(o,a));(i=new Uint8Array(l)).set(e),n=0,o=0,a=l,s=l}const h=15728640;let c=0;for(;a-(o+c)>h;)this._device.queue.writeBuffer(r,t+c,i.buffer,o+c,h),c+=h;this._device.queue.writeBuffer(r,t+c,i.buffer,o+c,s-c)}_getHalfFloatAsFloatRGBAArrayBuffer(e,t,i){i||(i=new Float32Array(e));const n=new Uint16Array(t);for(;e--;)i[e]=(0,ro.qZ)(n[e]);return i}readDataFromBuffer(e,t,i,n,s,r,o=0,a=0,l=null,h=!0,c=!1){const u=1===o?2:2===o?1:0;return new Promise(((i,d)=>{e.mapAsync(rr.Read,a,t).then((()=>{const d=e.getMappedRange(a,t);let p=l;if(c)p=null===p?(0,Us.A)(o,t,!0,d):(0,Us.A)(o,p.buffer,void 0,d);else if(null===p)switch(u){case 0:p=new Uint8Array(t),p.set(new Uint8Array(d));break;case 1:p=this._getHalfFloatAsFloatRGBAArrayBuffer(t/2,d);break;case 2:p=new Float32Array(t/4),p.set(new Float32Array(d))}else switch(u){case 0:p=new Uint8Array(p.buffer),p.set(new Uint8Array(d));break;case 1:p=this._getHalfFloatAsFloatRGBAArrayBuffer(t/2,d,l);break;case 2:p=new Float32Array(p.buffer),p.set(new Float32Array(d))}if(s!==r){1!==u||c||(s*=2,r*=2);const e=new Uint8Array(p.buffer);let t=s,i=0;for(let o=1;o<n;++o){i=o*r;for(let n=0;n<s;++n)e[t++]=e[i++]}p=0===u||c?new Uint8Array(e.buffer,0,t):new Float32Array(e.buffer,0,t/4)}e.unmap(),h&&this.releaseBuffer(e),i(p)}),(e=>d(e)))}))}releaseBuffer(e){return oo._IsGPUBuffer(e)?(this._deferredReleaseBuffers.push(e),!0):(e.references--,0===e.references&&(this._deferredReleaseBuffers.push(e.underlyingResource),!0))}destroyDeferredBuffers(){for(let e=0;e<this._deferredReleaseBuffers.length;++e)this._deferredReleaseBuffers[e].destroy();this._deferredReleaseBuffers.length=0}}class ao{constructor(){this.colorAttachmentGPUTextures=[],this.reset()}reset(e=!1){this.renderPass=null,e&&(this.renderPassDescriptor=null,this.colorAttachmentViewDescriptor=null,this.depthAttachmentViewDescriptor=null,this.colorAttachmentGPUTextures=[],this.depthTextureFormat=void 0)}}const lo=[0,0,3,7,0,2,6,2,4,1,5,3,1],ho=[0,64,32,96,16,80,48,112,8],co=[0,128,128,0,0,0,0,128,0,0,0,0,128];class uo{constructor(e){this._samplers={},this._device=e,this.disabled=!1}static GetSamplerHashCode(e){var t,i,n;const s=e._cachedAnisotropicFilteringLevel&&e._cachedAnisotropicFilteringLevel>1?4:1;return lo[e.samplingMode]+ho[(e._comparisonFunction||514)-512+1]+co[e.samplingMode]+((null!==(t=e._cachedWrapU)&&void 0!==t?t:1)<<8)+((null!==(i=e._cachedWrapV)&&void 0!==i?i:1)<<10)+((null!==(n=e._cachedWrapR)&&void 0!==n?n:1)<<12)+((e.useMipMaps?1:0)<<14)+(s<<15)}static _GetSamplerFilterDescriptor(e,t){let i,n,s,r,o;const a=e.useMipMaps;switch(e.samplingMode){case 11:i=dr.Linear,n=dr.Linear,s=dr.Nearest,a||(r=o=0);break;case 3:case 3:i=dr.Linear,n=dr.Linear,a?s=dr.Linear:(s=dr.Nearest,r=o=0);break;case 8:i=dr.Nearest,n=dr.Nearest,a?s=dr.Linear:(s=dr.Nearest,r=o=0);break;case 4:i=dr.Nearest,n=dr.Nearest,s=dr.Nearest,a||(r=o=0);break;case 5:i=dr.Nearest,n=dr.Linear,s=dr.Nearest,a||(r=o=0);break;case 6:i=dr.Nearest,n=dr.Linear,a?s=dr.Linear:(s=dr.Nearest,r=o=0);break;case 7:i=dr.Nearest,n=dr.Linear,s=dr.Nearest,r=o=0;break;case 1:case 1:default:i=dr.Nearest,n=dr.Nearest,s=dr.Nearest,r=o=0;break;case 9:i=dr.Linear,n=dr.Nearest,s=dr.Nearest,a||(r=o=0);break;case 10:i=dr.Linear,n=dr.Nearest,a?s=dr.Linear:(s=dr.Nearest,r=o=0);break;case 2:case 2:i=dr.Linear,n=dr.Linear,s=dr.Nearest,r=o=0;break;case 12:i=dr.Linear,n=dr.Nearest,s=dr.Nearest,r=o=0}return t>1&&(0!==r||0!==o)?{magFilter:dr.Linear,minFilter:dr.Linear,mipmapFilter:dr.Linear,anisotropyEnabled:!0}:{magFilter:i,minFilter:n,mipmapFilter:s,lodMinClamp:r,lodMaxClamp:o}}static _GetWrappingMode(e){switch(e){case 1:return ur.Repeat;case 0:return ur.ClampToEdge;case 2:return ur.MirrorRepeat}return ur.Repeat}static _GetSamplerWrappingDescriptor(e){return{addressModeU:this._GetWrappingMode(e._cachedWrapU),addressModeV:this._GetWrappingMode(e._cachedWrapV),addressModeW:this._GetWrappingMode(e._cachedWrapR)}}static _GetSamplerDescriptor(e){const t=e.useMipMaps&&e._cachedAnisotropicFilteringLevel&&e._cachedAnisotropicFilteringLevel>1?4:1,i=this._GetSamplerFilterDescriptor(e,t);return{...i,...this._GetSamplerWrappingDescriptor(e),compare:e._comparisonFunction?uo.GetCompareFunction(e._comparisonFunction):void 0,maxAnisotropy:i.anisotropyEnabled?t:1}}static GetCompareFunction(e){switch(e){case 519:return fr.Always;case 514:return fr.Equal;case 516:return fr.Greater;case 518:return fr.GreaterEqual;case 513:default:return fr.Less;case 515:return fr.LessEqual;case 512:return fr.Never;case 517:return fr.NotEqual}}getSampler(e,t=!1,i=0){if(this.disabled)return this._device.createSampler(uo._GetSamplerDescriptor(e));t?i=0:0===i&&(i=uo.GetSamplerHashCode(e));let n=t?void 0:this._samplers[i];return n||(n=this._device.createSampler(uo._GetSamplerDescriptor(e)),t||(this._samplers[i]=n)),n}}var po;!function(e){e[e.StencilReadMask=0]="StencilReadMask",e[e.StencilWriteMask=1]="StencilWriteMask",e[e.DepthBias=2]="DepthBias",e[e.DepthBiasSlopeScale=3]="DepthBiasSlopeScale",e[e.DepthStencilState=4]="DepthStencilState",e[e.MRTAttachments1=5]="MRTAttachments1",e[e.MRTAttachments2=6]="MRTAttachments2",e[e.RasterizationState=7]="RasterizationState",e[e.ColorStates=8]="ColorStates",e[e.ShaderStage=9]="ShaderStage",e[e.TextureStage=10]="TextureStage",e[e.VertexState=11]="VertexState",e[e.NumStates=12]="NumStates"}(po||(po={}));const fo={0:1,1:2,768:3,769:4,770:5,771:6,772:7,773:8,774:9,775:10,776:11,32769:12,32770:13,32771:12,32772:13},_o={0:0,7680:1,7681:2,7682:3,7683:4,5386:5,34055:6,34056:7};class mo{constructor(e,t,i){this.mrtTextureCount=0,this._device=e,this._useTextureStage=i,this._states=new Array(30),this._statesLength=0,this._stateDirtyLowestIndex=0,this._emptyVertexBuffer=t,this._mrtFormats=[],this._parameter={token:void 0,pipeline:null},this.disabled=!1,this.vertexBuffers=[],this._kMaxVertexBufferStride=e.limits.maxVertexBufferArrayStride||2048,this.reset()}reset(){this._isDirty=!0,this.vertexBuffers.length=0,this.setAlphaToCoverage(!1),this.resetDepthCullingState(),this.setClampDepth(!1),this.setDepthBias(0),this._webgpuColorFormat=[cr.BGRA8Unorm],this.setColorFormat(cr.BGRA8Unorm),this.setMRT([]),this.setAlphaBlendEnabled(!1),this.setAlphaBlendFactors([null,null,null,null],[null,null]),this.setWriteMask(15),this.setDepthStencilFormat(cr.Depth24PlusStencil8),this.setStencilEnabled(!1),this.resetStencilState(),this.setBuffers(null,null,null),this._setTextureState(0)}get colorFormats(){return this._mrtAttachments1>0?this._mrtFormats:this._webgpuColorFormat}getRenderPipeline(e,t,i,n=0){if(i>1&&(i=4),this.disabled){const n=mo._GetTopology(e);return this._setVertexState(t),this._parameter.pipeline=this._createRenderPipeline(t,n,i),mo.NumCacheMiss++,mo._NumPipelineCreationCurrentFrame++,this._parameter.pipeline}if(this._setShaderStage(t.uniqueId),this._setRasterizationState(e,i),this._setColorStates(),this._setDepthStencilState(),this._setVertexState(t),this._setTextureState(n),this.lastStateDirtyLowestIndex=this._stateDirtyLowestIndex,!this._isDirty&&this._parameter.pipeline)return this._stateDirtyLowestIndex=this._statesLength,mo.NumCacheHitWithoutHash++,this._parameter.pipeline;if(this._getRenderPipeline(this._parameter),this._isDirty=!1,this._stateDirtyLowestIndex=this._statesLength,this._parameter.pipeline)return mo.NumCacheHitWithHash++,this._parameter.pipeline;const s=mo._GetTopology(e);return this._parameter.pipeline=this._createRenderPipeline(t,s,i),this._setRenderPipeline(this._parameter),mo.NumCacheMiss++,mo._NumPipelineCreationCurrentFrame++,this._parameter.pipeline}endFrame(){mo.NumPipelineCreationLastFrame=mo._NumPipelineCreationCurrentFrame,mo._NumPipelineCreationCurrentFrame=0}setAlphaToCoverage(e){this._alphaToCoverageEnabled=e}setFrontFace(e){this._frontFace=e}setCullEnabled(e){this._cullEnabled=e}setCullFace(e){this._cullFace=e}setClampDepth(e){this._clampDepth=e}resetDepthCullingState(){this.setDepthCullingState(!1,2,1,0,0,!0,!0,519)}setDepthCullingState(e,t,i,n,s,r,o,a){this._depthWriteEnabled=o,this._depthTestEnabled=r,this._depthCompare=(null!=a?a:519)-512,this._cullFace=i,this._cullEnabled=e,this._frontFace=t,this.setDepthBiasSlopeScale(n),this.setDepthBias(s)}setDepthBias(e){this._depthBias!==e&&(this._depthBias=e,this._states[po.DepthBias]=e,this._isDirty=!0,this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.DepthBias))}setDepthBiasSlopeScale(e){this._depthBiasSlopeScale!==e&&(this._depthBiasSlopeScale=e,this._states[po.DepthBiasSlopeScale]=e,this._isDirty=!0,this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.DepthBiasSlopeScale))}setColorFormat(e){this._webgpuColorFormat[0]=e,this._colorFormat=io[null!=e?e:""]}setMRTAttachments(e){this.mrtAttachments=e;let t=0;for(let i=0;i<e.length;++i)0!==e[i]&&(t+=1<<i);this._mrtEnabledMask!==t&&(this._mrtEnabledMask=t,this._isDirty=!0,this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.MRTAttachments1))}setMRT(e,t){var i,n;if((t=null!=t?t:e.length)>10)throw"Can't handle more than 10 attachments for a MRT in cache render pipeline!";this.mrtTextureArray=e,this.mrtTextureCount=t,this._mrtEnabledMask=65535;const s=[0,0];let r=0,o=0,a=0;for(let l=0;l<t;++l){const t=e[l],h=null==t?void 0:t._hardwareTexture;this._mrtFormats[a]=null!==(i=null==h?void 0:h.format)&&void 0!==i?i:this._webgpuColorFormat[0],s[r]+=io[null!==(n=this._mrtFormats[a])&&void 0!==n?n:""]<<o,o+=6,a++,o>=32&&(o=0,r++)}this._mrtFormats.length=a,this._mrtAttachments1===s[0]&&this._mrtAttachments2===s[1]||(this._mrtAttachments1=s[0],this._mrtAttachments2=s[1],this._states[po.MRTAttachments1]=s[0],this._states[po.MRTAttachments2]=s[1],this._isDirty=!0,this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.MRTAttachments1))}setAlphaBlendEnabled(e){this._alphaBlendEnabled=e}setAlphaBlendFactors(e,t){this._alphaBlendFuncParams=e,this._alphaBlendEqParams=t}setWriteMask(e){this._writeMask=e}setDepthStencilFormat(e){this._webgpuDepthStencilFormat=e,this._depthStencilFormat=void 0===e?0:io[e]}setDepthTestEnabled(e){this._depthTestEnabled=e}setDepthWriteEnabled(e){this._depthWriteEnabled=e}setDepthCompare(e){this._depthCompare=(null!=e?e:519)-512}setStencilEnabled(e){this._stencilEnabled=e}setStencilCompare(e){this._stencilFrontCompare=(null!=e?e:519)-512}setStencilDepthFailOp(e){this._stencilFrontDepthFailOp=null===e?1:_o[e]}setStencilPassOp(e){this._stencilFrontPassOp=null===e?2:_o[e]}setStencilFailOp(e){this._stencilFrontFailOp=null===e?1:_o[e]}setStencilReadMask(e){this._stencilReadMask!==e&&(this._stencilReadMask=e,this._states[po.StencilReadMask]=e,this._isDirty=!0,this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.StencilReadMask))}setStencilWriteMask(e){this._stencilWriteMask!==e&&(this._stencilWriteMask=e,this._states[po.StencilWriteMask]=e,this._isDirty=!0,this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.StencilWriteMask))}resetStencilState(){this.setStencilState(!1,519,7680,7681,7680,255,255)}setStencilState(e,t,i,n,s,r,o){this._stencilEnabled=e,this._stencilFrontCompare=(null!=t?t:519)-512,this._stencilFrontDepthFailOp=null===i?1:_o[i],this._stencilFrontPassOp=null===n?2:_o[n],this._stencilFrontFailOp=null===s?1:_o[s],this.setStencilReadMask(r),this.setStencilWriteMask(o)}setBuffers(e,t,i){this._vertexBuffers=e,this._overrideVertexBuffers=i,this._indexBuffer=t}static _GetTopology(e){switch(e){case 0:default:return Sr.TriangleList;case 2:case 3:return Sr.PointList;case 1:case 4:return Sr.LineList;case 5:throw"LineLoop is an unsupported fillmode in WebGPU";case 6:return Sr.LineStrip;case 7:return Sr.TriangleStrip;case 8:throw"TriangleFan is an unsupported fillmode in WebGPU"}}static _GetAphaBlendOperation(e){switch(e){case 32774:default:return Rr.Add;case 32778:return Rr.Subtract;case 32779:return Rr.ReverseSubtract;case 32775:return Rr.Min;case 32776:return Rr.Max}}static _GetAphaBlendFactor(e){switch(e){case 0:return Pr.Zero;case 1:default:return Pr.One;case 768:return Pr.Src;case 769:return Pr.OneMinusSrc;case 770:return Pr.SrcAlpha;case 771:return Pr.OneMinusSrcAlpha;case 772:return Pr.DstAlpha;case 773:return Pr.OneMinusDstAlpha;case 774:return Pr.Dst;case 775:return Pr.OneMinusDst;case 776:return Pr.SrcAlphaSaturated;case 32769:case 32771:return Pr.Constant;case 32770:case 32772:return Pr.OneMinusConstant}}static _GetCompareFunction(e){switch(e){case 0:return fr.Never;case 1:return fr.Less;case 2:return fr.Equal;case 3:return fr.LessEqual;case 4:return fr.Greater;case 5:return fr.NotEqual;case 6:return fr.GreaterEqual;case 7:return fr.Always}return fr.Never}static _GetStencilOpFunction(e){switch(e){case 0:return Mr.Zero;case 1:return Mr.Keep;case 2:return Mr.Replace;case 3:return Mr.IncrementClamp;case 4:return Mr.DecrementClamp;case 5:return Mr.Invert;case 6:return Mr.IncrementWrap;case 7:return Mr.DecrementWrap}return Mr.Keep}static _GetVertexInputDescriptorFormat(e){const t=e.type,i=e.normalized,n=e.getSize();switch(t){case qe.o.BYTE:switch(n){case 1:case 2:return i?Dr.Snorm8x2:Dr.Sint8x2;case 3:case 4:return i?Dr.Snorm8x4:Dr.Sint8x4}break;case qe.o.UNSIGNED_BYTE:switch(n){case 1:case 2:return i?Dr.Unorm8x2:Dr.Uint8x2;case 3:case 4:return i?Dr.Unorm8x4:Dr.Uint8x4}break;case qe.o.SHORT:switch(n){case 1:case 2:return i?Dr.Snorm16x2:Dr.Sint16x2;case 3:case 4:return i?Dr.Snorm16x4:Dr.Sint16x4}break;case qe.o.UNSIGNED_SHORT:switch(n){case 1:case 2:return i?Dr.Unorm16x2:Dr.Uint16x2;case 3:case 4:return i?Dr.Unorm16x4:Dr.Uint16x4}break;case qe.o.INT:switch(n){case 1:return Dr.Sint32;case 2:return Dr.Sint32x2;case 3:return Dr.Sint32x3;case 4:return Dr.Sint32x4}break;case qe.o.UNSIGNED_INT:switch(n){case 1:return Dr.Uint32;case 2:return Dr.Uint32x2;case 3:return Dr.Uint32x3;case 4:return Dr.Uint32x4}break;case qe.o.FLOAT:switch(n){case 1:return Dr.Float32;case 2:return Dr.Float32x2;case 3:return Dr.Float32x3;case 4:return Dr.Float32x4}}throw new Error(`Invalid Format '${e.getKind()}' - type=${t}, normalized=${i}, size=${n}`)}_getAphaBlendState(){return this._alphaBlendEnabled?{srcFactor:mo._GetAphaBlendFactor(this._alphaBlendFuncParams[2]),dstFactor:mo._GetAphaBlendFactor(this._alphaBlendFuncParams[3]),operation:mo._GetAphaBlendOperation(this._alphaBlendEqParams[1])}:null}_getColorBlendState(){return this._alphaBlendEnabled?{srcFactor:mo._GetAphaBlendFactor(this._alphaBlendFuncParams[0]),dstFactor:mo._GetAphaBlendFactor(this._alphaBlendFuncParams[1]),operation:mo._GetAphaBlendOperation(this._alphaBlendEqParams[0])}:null}_setShaderStage(e){this._shaderId!==e&&(this._shaderId=e,this._states[po.ShaderStage]=e,this._isDirty=!0,this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.ShaderStage))}_setRasterizationState(e,t){const i=this._frontFace-1+((this._cullEnabled?this._cullFace:0)<<1)+((this._clampDepth?1:0)<<3)+((this._alphaToCoverageEnabled?1:0)<<4)+(e<<5)+(t<<8);this._rasterizationState!==i&&(this._rasterizationState=i,this._states[po.RasterizationState]=this._rasterizationState,this._isDirty=!0,this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.RasterizationState))}_setColorStates(){let e=((this._writeMask?1:0)<<22)+(this._colorFormat<<23)+((this._depthWriteEnabled?1:0)<<29);this._alphaBlendEnabled&&(e+=((null===this._alphaBlendFuncParams[0]?2:fo[this._alphaBlendFuncParams[0]])<<0)+((null===this._alphaBlendFuncParams[1]?2:fo[this._alphaBlendFuncParams[1]])<<4)+((null===this._alphaBlendFuncParams[2]?2:fo[this._alphaBlendFuncParams[2]])<<8)+((null===this._alphaBlendFuncParams[3]?2:fo[this._alphaBlendFuncParams[3]])<<12)+((null===this._alphaBlendEqParams[0]?1:this._alphaBlendEqParams[0]-32773)<<16)+((null===this._alphaBlendEqParams[1]?1:this._alphaBlendEqParams[1]-32773)<<19)),e!==this._colorStates&&(this._colorStates=e,this._states[po.ColorStates]=this._colorStates,this._isDirty=!0,this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.ColorStates))}_setDepthStencilState(){const e=this._stencilEnabled?this._stencilFrontCompare+(this._stencilFrontDepthFailOp<<3)+(this._stencilFrontPassOp<<6)+(this._stencilFrontFailOp<<9):591,t=this._depthStencilFormat+((this._depthTestEnabled?this._depthCompare:7)<<6)+(e<<10);this._depthStencilState!==t&&(this._depthStencilState=t,this._states[po.DepthStencilState]=this._depthStencilState,this._isDirty=!0,this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.DepthStencilState))}_setVertexState(e){var t,i;const n=this._statesLength;let s=po.VertexState;const r=e._pipelineContext,o=r.shaderProcessingContext.attributeNamesFromEffect,a=r.shaderProcessingContext.attributeLocationsFromEffect;let l,h=0;for(let e=0;e<o.length;e++){const n=a[e];let r=null!==(t=this._overrideVertexBuffers&&this._overrideVertexBuffers[o[e]])&&void 0!==t?t:this._vertexBuffers[o[e]];r||(r=this._emptyVertexBuffer);const c=null===(i=r.getBuffer())||void 0===i?void 0:i.underlyingResource;if(void 0===r._validOffsetRange){const e=r.byteOffset,t=r.getSize(!0),i=r.byteStride;r._validOffsetRange=e<=this._kMaxVertexBufferStride-t&&(0===i||e+t<=i)}l&&l===c&&r._validOffsetRange||(this.vertexBuffers[h++]=r,l=r._validOffsetRange?c:null);const u=r.hashCode+(n<<7);this._isDirty=this._isDirty||this._states[s]!==u,this._states[s++]=u}this.vertexBuffers.length=h,this._statesLength=s,this._isDirty=this._isDirty||s!==n,this._isDirty&&(this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.VertexState))}_setTextureState(e){this._textureState!==e&&(this._textureState=e,this._states[po.TextureStage]=this._textureState,this._isDirty=!0,this._stateDirtyLowestIndex=Math.min(this._stateDirtyLowestIndex,po.TextureStage))}_createPipelineLayout(e){if(this._useTextureStage)return this._createPipelineLayoutWithTextureStage(e);const t=[],i=e.shaderProcessingContext.bindGroupLayoutEntries;for(let e=0;e<i.length;e++){const n=i[e];t[e]=this._device.createBindGroupLayout({entries:n})}return e.bindGroupLayouts=t,this._device.createPipelineLayout({bindGroupLayouts:t})}_createPipelineLayoutWithTextureStage(e){var t;const i=e.shaderProcessingContext,n=i.bindGroupLayoutEntries;let s=1;for(let e=0;e<n.length;e++){const r=n[e];for(let o=0;o<r.length;o++){const r=n[e][o];if(r.texture){const o=i.bindGroupLayoutEntryInfo[e][r.binding].name,a=i.availableTextures[o],l=a.autoBindSampler?i.availableSamplers[o+zr.AutoSamplerSuffix]:null;let h=a.sampleType,c=null!==(t=null==l?void 0:l.type)&&void 0!==t?t:gr.Filtering;if(this._textureState&s&&h!==vr.Depth&&(a.autoBindSampler&&(c=gr.NonFiltering),h=vr.UnfilterableFloat),r.texture.sampleType=h,l){const e=i.bindGroupLayoutEntryInfo[l.binding.groupIndex][l.binding.bindingIndex].index;n[l.binding.groupIndex][e].sampler.type=c}s<<=1}}}const r=[];for(let e=0;e<n.length;++e)r[e]=this._device.createBindGroupLayout({entries:n[e]});return e.bindGroupLayouts=r,this._device.createPipelineLayout({bindGroupLayouts:r})}_getVertexInputDescriptor(e){var t,i;const n=[],s=e._pipelineContext,r=s.shaderProcessingContext.attributeNamesFromEffect,o=s.shaderProcessingContext.attributeLocationsFromEffect;let a,l;for(let e=0;e<r.length;e++){const s=o[e];let h=null!==(t=this._overrideVertexBuffers&&this._overrideVertexBuffers[r[e]])&&void 0!==t?t:this._vertexBuffers[r[e]];h||(h=this._emptyVertexBuffer);let c=null===(i=h.getBuffer())||void 0===i?void 0:i.underlyingResource,u=h.byteOffset;const d=!h._validOffsetRange;if(!a||!l||a!==c||d){const e={arrayStride:h.byteStride,stepMode:h.getIsInstanced()?Or.Instance:Or.Vertex,attributes:[]};n.push(e),l=e.attributes,d&&(u=0,c=null)}l.push({shaderLocation:s,offset:u,format:mo._GetVertexInputDescriptorFormat(h)}),a=c}return n}_createRenderPipeline(e,t,i){var n,s,r;const o=e._pipelineContext,a=this._getVertexInputDescriptor(e),l=this._createPipelineLayout(o),h=[],c=this._getAphaBlendState(),u=this._getColorBlendState();if(this._mrtAttachments1>0)for(let e=0;e<this._mrtFormats.length;++e){const t=this._mrtFormats[e];if(t){const i={format:t,writeMask:0!=(this._mrtEnabledMask&1<<e)?this._writeMask:0};c&&u&&(i.blend={alpha:c,color:u}),h.push(i)}else h.push(null)}else if(this._webgpuColorFormat[0]){const e={format:this._webgpuColorFormat[0],writeMask:this._writeMask};c&&u&&(e.blend={alpha:c,color:u}),h.push(e)}else h.push(null);const d={compare:mo._GetCompareFunction(this._stencilEnabled?this._stencilFrontCompare:7),depthFailOp:mo._GetStencilOpFunction(this._stencilEnabled?this._stencilFrontDepthFailOp:1),failOp:mo._GetStencilOpFunction(this._stencilEnabled?this._stencilFrontFailOp:1),passOp:mo._GetStencilOpFunction(this._stencilEnabled?this._stencilFrontPassOp:1)};let p;t!==Sr.LineStrip&&t!==Sr.TriangleStrip||(p=!this._indexBuffer||this._indexBuffer.is32Bits?Ir.Uint32:Ir.Uint16);const f=!!this._webgpuDepthStencilFormat&&no.HasStencilAspect(this._webgpuDepthStencilFormat);return this._device.createRenderPipeline({label:`RenderPipeline_${null!==(s=null===(n=h[0])||void 0===n?void 0:n.format)&&void 0!==s?s:"nooutput"}_${null!==(r=this._webgpuDepthStencilFormat)&&void 0!==r?r:"nodepth"}_samples${i}`,layout:l,vertex:{module:o.stages.vertexStage.module,entryPoint:o.stages.vertexStage.entryPoint,buffers:a},primitive:{topology:t,stripIndexFormat:p,frontFace:1===this._frontFace?Er.CCW:Er.CW,cullMode:this._cullEnabled?2===this._cullFace?Cr.Front:Cr.Back:Cr.None},fragment:o.stages.fragmentStage?{module:o.stages.fragmentStage.module,entryPoint:o.stages.fragmentStage.entryPoint,targets:h}:void 0,multisample:{count:i},depthStencil:void 0===this._webgpuDepthStencilFormat?void 0:{depthWriteEnabled:this._depthWriteEnabled,depthCompare:this._depthTestEnabled?mo._GetCompareFunction(this._depthCompare):fr.Always,format:this._webgpuDepthStencilFormat,stencilFront:this._stencilEnabled&&f?d:void 0,stencilBack:this._stencilEnabled&&f?d:void 0,stencilReadMask:this._stencilEnabled&&f?this._stencilReadMask:void 0,stencilWriteMask:this._stencilEnabled&&f?this._stencilWriteMask:void 0,depthBias:this._depthBias,depthBiasClamp:this._depthBiasClamp,depthBiasSlopeScale:this._depthBiasSlopeScale}})}}mo.NumCacheHitWithoutHash=0,mo.NumCacheHitWithHash=0,mo.NumCacheMiss=0,mo.NumPipelineCreationLastFrame=0,mo._NumPipelineCreationCurrentFrame=0;class go{constructor(){this.values={}}count(){let e=0,t=this.pipeline?1:0;for(const i in this.values){const n=this.values[i],[s,r]=n.count();e+=s,t+=r,e++}return[e,t]}}class vo extends mo{static GetNodeCounts(){const e=vo._Cache.count();return{nodeCount:e[0],pipelineCount:e[1]}}static _GetPipelines(e,t,i,n){if(e.pipeline){const e=i.slice();e.length=n,t.push(e)}for(const s in e.values){const r=e.values[s];i[n]=parseInt(s),vo._GetPipelines(r,t,i,n+1)}}static GetPipelines(){const e=[];return vo._GetPipelines(vo._Cache,e,[],0),e}constructor(e,t,i){super(e,t,i),this._nodeStack=[],this._nodeStack[0]=vo._Cache}_getRenderPipeline(e){let t=this._nodeStack[this._stateDirtyLowestIndex];for(let e=this._stateDirtyLowestIndex;e<this._statesLength;++e){let i=t.values[this._states[e]];i||(i=new go,t.values[this._states[e]]=i),t=i,this._nodeStack[e+1]=t}e.token=t,e.pipeline=t.pipeline}_setRenderPipeline(e){e.token.pipeline=e.pipeline}}vo._Cache=new go;var yo=i(9468);class xo extends yo.C{constructor(e){super(!1),this._cache=e,this.reset()}get func(){return this._func}set func(e){this._func!==e&&(this._func=e,this._cache.setStencilCompare(e))}get funcMask(){return this._funcMask}set funcMask(e){this._funcMask!==e&&(this._funcMask=e,this._cache.setStencilReadMask(e))}get opStencilFail(){return this._opStencilFail}set opStencilFail(e){this._opStencilFail!==e&&(this._opStencilFail=e,this._cache.setStencilFailOp(e))}get opDepthFail(){return this._opDepthFail}set opDepthFail(e){this._opDepthFail!==e&&(this._opDepthFail=e,this._cache.setStencilDepthFailOp(e))}get opStencilDepthPass(){return this._opStencilDepthPass}set opStencilDepthPass(e){this._opStencilDepthPass!==e&&(this._opStencilDepthPass=e,this._cache.setStencilPassOp(e))}get mask(){return this._mask}set mask(e){this._mask!==e&&(this._mask=e,this._cache.setStencilWriteMask(e))}get enabled(){return this._enabled}set enabled(e){this._enabled!==e&&(this._enabled=e,this._cache.setStencilEnabled(e))}reset(){super.reset(),this._cache.resetStencilState()}apply(){var e;const t=null===(e=this.stencilMaterial)||void 0===e?void 0:e.enabled;this.enabled=t?this.stencilMaterial.enabled:this.stencilGlobal.enabled,this.enabled&&(this.func=t?this.stencilMaterial.func:this.stencilGlobal.func,this.funcRef=t?this.stencilMaterial.funcRef:this.stencilGlobal.funcRef,this.funcMask=t?this.stencilMaterial.funcMask:this.stencilGlobal.funcMask,this.opStencilFail=t?this.stencilMaterial.opStencilFail:this.stencilGlobal.opStencilFail,this.opDepthFail=t?this.stencilMaterial.opDepthFail:this.stencilGlobal.opDepthFail,this.opStencilDepthPass=t?this.stencilMaterial.opStencilDepthPass:this.stencilGlobal.opStencilDepthPass,this.mask=t?this.stencilMaterial.mask:this.stencilGlobal.mask)}}var bo=i(6533);class To extends bo.k{constructor(e){super(!1),this._cache=e,this.reset()}get zOffset(){return this._zOffset}set zOffset(e){this._zOffset!==e&&(this._zOffset=e,this._isZOffsetDirty=!0,this._cache.setDepthBiasSlopeScale(e))}get zOffsetUnits(){return this._zOffsetUnits}set zOffsetUnits(e){this._zOffsetUnits!==e&&(this._zOffsetUnits=e,this._isZOffsetDirty=!0,this._cache.setDepthBias(e))}get cullFace(){return this._cullFace}set cullFace(e){this._cullFace!==e&&(this._cullFace=e,this._isCullFaceDirty=!0,this._cache.setCullFace(null!=e?e:1))}get cull(){return this._cull}set cull(e){this._cull!==e&&(this._cull=e,this._isCullDirty=!0,this._cache.setCullEnabled(!!e))}get depthFunc(){return this._depthFunc}set depthFunc(e){this._depthFunc!==e&&(this._depthFunc=e,this._isDepthFuncDirty=!0,this._cache.setDepthCompare(e))}get depthMask(){return this._depthMask}set depthMask(e){this._depthMask!==e&&(this._depthMask=e,this._isDepthMaskDirty=!0,this._cache.setDepthWriteEnabled(e))}get depthTest(){return this._depthTest}set depthTest(e){this._depthTest!==e&&(this._depthTest=e,this._isDepthTestDirty=!0,this._cache.setDepthTestEnabled(e))}get frontFace(){return this._frontFace}set frontFace(e){this._frontFace!==e&&(this._frontFace=e,this._isFrontFaceDirty=!0,this._cache.setFrontFace(null!=e?e:2))}reset(){super.reset(),this._cache.resetDepthCullingState()}apply(){}}class So{static IsExternalTexture(e){return void 0!==e.underlyingResource}getClassName(){return"ExternalTexture"}get underlyingResource(){return this._video}constructor(e){this.useMipMaps=!1,this.type=16,this._video=e,this.uniqueId=Ei.l._Counter++}isReady(){return this._video.readyState>=this._video.HAVE_CURRENT_DATA}dispose(){}}class Eo{get forceBindGroupCreation(){return this._numExternalTextures>0}get hasFloatTextures(){return this._numFloatTextures>0}constructor(){this.uniqueId=Eo._Counter++,this.updateId=0,this.reset()}reset(){this.samplers={},this.textures={},this.isDirty=!0,this._numFloatTextures=0,this._numExternalTextures=0}setSampler(e,t){let i=this.samplers[e],n=-1;i?n=i.hashCode:this.samplers[e]=i={sampler:t,hashCode:0},i.sampler=t,i.hashCode=t?uo.GetSamplerHashCode(t):0;const s=n!==i.hashCode;s&&this.updateId++,this.isDirty||(this.isDirty=s)}setTexture(e,t){var i,n,s;let r=this.textures[e],o=-1;r?o=null!==(n=null===(i=r.texture)||void 0===i?void 0:i.uniqueId)&&void 0!==n?n:-1:this.textures[e]=r={texture:t,isFloatTexture:!1,isExternalTexture:!1},r.isExternalTexture&&this._numExternalTextures--,r.isFloatTexture&&this._numFloatTextures--,t?(r.isFloatTexture=1===t.type,r.isExternalTexture=So.IsExternalTexture(t),r.isFloatTexture&&this._numFloatTextures++,r.isExternalTexture&&this._numExternalTextures++):(r.isFloatTexture=!1,r.isExternalTexture=!1),r.texture=t;const a=o!==(null!==(s=null==t?void 0:t.uniqueId)&&void 0!==s?s:-1);a&&this.updateId++,this.isDirty||(this.isDirty=a)}}Eo._Counter=0;class Co{isDirty(e){return this._isDirty||this._materialContextUpdateId!==e}resetIsDirty(e){this._isDirty=!1,this._materialContextUpdateId=e}get useInstancing(){return this._useInstancing}set useInstancing(e){this._useInstancing!==e&&(e?(this.indirectDrawBuffer=this._bufferManager.createRawBuffer(40,sr.CopyDst|sr.Indirect),this._indirectDrawData=new Uint32Array(5),this._indirectDrawData[3]=0,this._indirectDrawData[4]=0):(this.indirectDrawBuffer&&this._bufferManager.releaseBuffer(this.indirectDrawBuffer),this.indirectDrawBuffer=void 0,this._indirectDrawData=void 0),this._useInstancing=e,this._currentInstanceCount=-1)}constructor(e){this._bufferManager=e,this.uniqueId=Co._Counter++,this._useInstancing=!1,this._currentInstanceCount=0,this.reset()}reset(){this.buffers={},this._isDirty=!0,this._materialContextUpdateId=0,this.fastBundle=void 0,this.bindGroups=void 0}setBuffer(e,t){var i;this._isDirty||(this._isDirty=(null==t?void 0:t.uniqueId)!==(null===(i=this.buffers[e])||void 0===i?void 0:i.uniqueId)),this.buffers[e]=t}setIndirectData(e,t,i){t!==this._currentInstanceCount&&this.indirectDrawBuffer&&this._indirectDrawData&&(this._currentInstanceCount=t,this._indirectDrawData[0]=e,this._indirectDrawData[1]=t,this._indirectDrawData[2]=i,this._bufferManager.setRawData(this.indirectDrawBuffer,0,this._indirectDrawData,0,20))}dispose(){this.indirectDrawBuffer&&(this._bufferManager.releaseBuffer(this.indirectDrawBuffer),this.indirectDrawBuffer=void 0,this._indirectDrawData=void 0),this.fastBundle=void 0,this.bindGroups=void 0,this.buffers=void 0}}Co._Counter=0;class Ao{constructor(){this.values={}}}class Po{static get Statistics(){return{totalCreated:Po.NumBindGroupsCreatedTotal,lastFrameCreated:Po.NumBindGroupsCreatedLastFrame,lookupLastFrame:Po.NumBindGroupsLookupLastFrame,noLookupLastFrame:Po.NumBindGroupsNoLookupLastFrame}}constructor(e,t,i){this.disabled=!1,this._device=e,this._cacheSampler=t,this._engine=i}endFrame(){Po.NumBindGroupsCreatedLastFrame=Po._NumBindGroupsCreatedCurrentFrame,Po.NumBindGroupsLookupLastFrame=Po._NumBindGroupsLookupCurrentFrame,Po.NumBindGroupsNoLookupLastFrame=Po._NumBindGroupsNoLookupCurrentFrame,Po._NumBindGroupsCreatedCurrentFrame=0,Po._NumBindGroupsLookupCurrentFrame=0,Po._NumBindGroupsNoLookupCurrentFrame=0}getBindGroups(e,t,i){var n,s,r,o,a,l,h,c,u,d;let p,f=Po._Cache;const m=this.disabled||i.forceBindGroupCreation;if(!m){if(!t.isDirty(i.updateId)&&!i.isDirty)return Po._NumBindGroupsNoLookupCurrentFrame++,t.bindGroups;for(const i of e.shaderProcessingContext.bufferNames){const e=null!==(s=null===(n=t.buffers[i])||void 0===n?void 0:n.uniqueId)&&void 0!==s?s:0;let r=f.values[e];r||(r=new Ao,f.values[e]=r),f=r}for(const t of e.shaderProcessingContext.samplerNames){const e=null!==(o=null===(r=i.samplers[t])||void 0===r?void 0:r.hashCode)&&void 0!==o?o:0;let n=f.values[e];n||(n=new Ao,f.values[e]=n),f=n}for(const t of e.shaderProcessingContext.textureNames){const e=null!==(h=null===(l=null===(a=i.textures[t])||void 0===a?void 0:a.texture)||void 0===l?void 0:l.uniqueId)&&void 0!==h?h:0;let n=f.values[e];n||(n=new Ao,f.values[e]=n),f=n}p=f.bindGroups}if(t.resetIsDirty(i.updateId),i.isDirty=!1,p)return t.bindGroups=p,Po._NumBindGroupsLookupCurrentFrame++,p;p=[],t.bindGroups=p,m||(f.bindGroups=p),Po.NumBindGroupsCreatedTotal++,Po._NumBindGroupsCreatedCurrentFrame++;const g=e.bindGroupLayouts;for(let n=0;n<e.shaderProcessingContext.bindGroupLayoutEntries.length;n++){const s=e.shaderProcessingContext.bindGroupLayoutEntries[n],r=e.shaderProcessingContext.bindGroupEntries[n];for(let o=0;o<s.length;o++){const s=e.shaderProcessingContext.bindGroupLayoutEntries[n][o],a=e.shaderProcessingContext.bindGroupLayoutEntryInfo[n][s.binding],l=null!==(c=a.nameInArrayOfTexture)&&void 0!==c?c:a.name;if(s.sampler){const e=i.samplers[l];if(e){const t=e.sampler;if(!t){this._engine.dbgSanityChecks&&_.Y.Error(`Trying to bind a null sampler! entry=${JSON.stringify(s)}, name=${l}, bindingInfo=${JSON.stringify(e,((e,t)=>"texture"===e?"<no dump>":t))}, materialContext.uniqueId=${i.uniqueId}`,50);continue}r[o].resource=this._cacheSampler.getSampler(t,!1,e.hashCode)}else _.Y.Error(`Sampler "${l}" could not be bound. entry=${JSON.stringify(s)}, materialContext=${JSON.stringify(i,((e,t)=>"texture"===e||"sampler"===e?"<no dump>":t))}`,50)}else if(s.texture||s.storageTexture){const e=i.textures[l];if(e){if(this._engine.dbgSanityChecks&&null===e.texture){_.Y.Error(`Trying to bind a null texture! entry=${JSON.stringify(s)}, bindingInfo=${JSON.stringify(e,((e,t)=>"texture"===e?"<no dump>":t))}, materialContext.uniqueId=${i.uniqueId}`,50);continue}const t=e.texture._hardwareTexture;if(this._engine.dbgSanityChecks&&(!t||s.texture&&!t.view||s.storageTexture&&!t.viewForWriting)){_.Y.Error(`Trying to bind a null gpu texture or view! entry=${JSON.stringify(s)}, name=${l}, bindingInfo=${JSON.stringify(e,((e,t)=>"texture"===e?"<no dump>":t))}, isReady=${null===(u=e.texture)||void 0===u?void 0:u.isReady}, materialContext.uniqueId=${i.uniqueId}`,50);continue}r[o].resource=s.storageTexture?t.viewForWriting:t.view}else _.Y.Error(`Texture "${l}" could not be bound. entry=${JSON.stringify(s)}, materialContext=${JSON.stringify(i,((e,t)=>"texture"===e||"sampler"===e?"<no dump>":t))}`,50)}else if(s.externalTexture){const e=i.textures[l];if(e){if(this._engine.dbgSanityChecks&&null===e.texture){_.Y.Error(`Trying to bind a null external texture! entry=${JSON.stringify(s)}, name=${l}, bindingInfo=${JSON.stringify(e,((e,t)=>"texture"===e?"<no dump>":t))}, materialContext.uniqueId=${i.uniqueId}`,50);continue}const t=e.texture.underlyingResource;if(this._engine.dbgSanityChecks&&!t){_.Y.Error(`Trying to bind a null gpu external texture! entry=${JSON.stringify(s)}, name=${l}, bindingInfo=${JSON.stringify(e,((e,t)=>"texture"===e?"<no dump>":t))}, isReady=${null===(d=e.texture)||void 0===d?void 0:d.isReady}, materialContext.uniqueId=${i.uniqueId}`,50);continue}r[o].resource=this._device.importExternalTexture({source:t})}else _.Y.Error(`Texture "${l}" could not be bound. entry=${JSON.stringify(s)}, materialContext=${JSON.stringify(i,((e,t)=>"texture"===e||"sampler"===e?"<no dump>":t))}`,50)}else if(s.buffer){const e=t.buffers[l];if(e){const t=e.underlyingResource;r[o].resource.buffer=t,r[o].resource.size=e.capacity}else _.Y.Error(`Can't find buffer "${l}". entry=${JSON.stringify(s)}, buffers=${JSON.stringify(t.buffers)}, drawContext.uniqueId=${t.uniqueId}`,50)}}const o=g[n];p[n]=this._device.createBindGroup({layout:o,entries:r})}return p}}Po.NumBindGroupsCreatedTotal=0,Po.NumBindGroupsCreatedLastFrame=0,Po.NumBindGroupsLookupLastFrame=0,Po.NumBindGroupsNoLookupLastFrame=0,Po._Cache=new Ao,Po._NumBindGroupsCreatedCurrentFrame=0,Po._NumBindGroupsLookupCurrentFrame=0,Po._NumBindGroupsNoLookupCurrentFrame=0;si.v.ShadersStore.clearQuadVertexShader="uniform float depthValue;\nconst vec2 pos[4]={\nvec2(-1.0,1.0),\nvec2(1.0,1.0),\nvec2(-1.0,-1.0),\nvec2(1.0,-1.0)\n};\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\ngl_Position=vec4(pos[gl_VertexID],depthValue,1.0);\n#define CUSTOM_VERTEX_MAIN_END\n}\n";si.v.ShadersStore.clearQuadPixelShader="uniform vec4 color;\nvoid main() {\ngl_FragColor=color;\n}\n";class Ro{setDepthStencilFormat(e){this._depthTextureFormat=e,this._cacheRenderPipeline.setDepthStencilFormat(e)}setColorFormat(e){this._cacheRenderPipeline.setColorFormat(e)}setMRTAttachments(e,t,i){this._cacheRenderPipeline.setMRT(t,i),this._cacheRenderPipeline.setMRTAttachments(e)}constructor(e,t,i){this._bindGroups={},this._bundleCache={},this._keyTemp=[],this._device=e,this._engine=t,this._cacheRenderPipeline=new vo(this._device,i,!t._caps.textureFloatLinearFiltering),this._cacheRenderPipeline.setDepthTestEnabled(!1),this._cacheRenderPipeline.setStencilReadMask(255),this._effect=t.createEffect("clearQuad",[],["color","depthValue"])}clear(e,t,i,n,s=1){var r,o;let a,l,h=null;const c=!!this._engine._currentRenderTarget;if(e)a=e;else{let e=0;this._keyTemp.length=0;for(let t=0;t<this._cacheRenderPipeline.colorFormats.length;++t)this._keyTemp[e++]=io[null!==(r=this._cacheRenderPipeline.colorFormats[t])&&void 0!==r?r:""];const u=io[null!==(o=this._depthTextureFormat)&&void 0!==o?o:0];if(this._keyTemp[e]=(t?t.r+256*t.g+256*t.b*256+256*t.a*256*256:0)+(i?2**32:0)+(n?2**33:0)+(this._engine.useReverseDepthBuffer?2**34:0)+(c?2**35:0)+(s>1?2**36:0)+u*2**37,l=this._keyTemp.join("_"),h=this._bundleCache[l],h)return h;a=this._device.createRenderBundleEncoder({colorFormats:this._cacheRenderPipeline.colorFormats,depthStencilFormat:this._depthTextureFormat,sampleCount:s})}this._cacheRenderPipeline.setDepthWriteEnabled(!!i),this._cacheRenderPipeline.setStencilEnabled(!!n&&!!this._depthTextureFormat&&no.HasStencilAspect(this._depthTextureFormat)),this._cacheRenderPipeline.setStencilWriteMask(n?255:0),this._cacheRenderPipeline.setStencilCompare(n?519:512),this._cacheRenderPipeline.setStencilPassOp(n?7681:7680),this._cacheRenderPipeline.setWriteMask(t?15:0);const u=this._cacheRenderPipeline.getRenderPipeline(7,this._effect,s),d=this._effect._pipelineContext;t&&this._effect.setDirectColor4("color",t),this._effect.setFloat("depthValue",this._engine.useReverseDepthBuffer?this._engine._clearReverseDepthValue:this._engine._clearDepthValue),d.uniformBuffer.update();const p=c?this._engine._ubInvertY:this._engine._ubDontInvertY,f=d.uniformBuffer.getBuffer(),_=f.uniqueId+"-"+p.uniqueId;let m=this._bindGroups[_];if(!m){const e=d.bindGroupLayouts;m=this._bindGroups[_]=[],m.push(this._device.createBindGroup({layout:e[0],entries:[]})),Xr._SimplifiedKnownBindings||m.push(this._device.createBindGroup({layout:e[1],entries:[]})),m.push(this._device.createBindGroup({layout:e[Xr._SimplifiedKnownBindings?1:2],entries:[{binding:0,resource:{buffer:p.underlyingResource,size:p.capacity}},{binding:1,resource:{buffer:f.underlyingResource,size:f.capacity}}]}))}a.setPipeline(u);for(let e=0;e<m.length;++e)a.setBindGroup(e,m[e]);return a.draw(4,1,0,0),e||(h=a.finish(),this._bundleCache[l]=h),h}}class Mo{constructor(e,t,i,n){this.x=Math.floor(e),this.y=Math.floor(t),this.w=Math.floor(i),this.h=Math.floor(n)}run(e){e.setViewport(this.x,this.y,this.w,this.h,0,1)}clone(){return new Mo(this.x,this.y,this.w,this.h)}}class Io{constructor(e,t,i,n){this.x=e,this.y=t,this.w=i,this.h=n}run(e){e.setScissorRect(this.x,this.y,this.w,this.h)}clone(){return new Io(this.x,this.y,this.w,this.h)}}class Do{constructor(e){this.ref=e}run(e){e.setStencilReference(this.ref)}clone(){return new Do(this.ref)}}class Oo{constructor(e){this.color=e}run(e){e.setBlendConstant(this.color)}clone(){return new Oo(this.color)}}class wo{constructor(e){this.query=e}run(e){e.beginOcclusionQuery(this.query)}clone(){return new wo(this.query)}}class No{constructor(){}run(e){e.endOcclusionQuery()}clone(){return new No}}class Fo{constructor(){this.bundles=[]}run(e){e.executeBundles(this.bundles)}clone(){const e=new Fo;return e.bundles=this.bundles,e}}class Lo{constructor(e){this.numDrawCalls=0,this._device=e,this._list=new Array(10),this._listLength=0}addBundle(e){if(!this._currentItemIsBundle){const e=new Fo;this._list[this._listLength++]=e,this._currentBundleList=e.bundles,this._currentItemIsBundle=!0}e&&this._currentBundleList.push(e)}_finishBundle(){this._currentItemIsBundle&&this._bundleEncoder&&(this._currentBundleList.push(this._bundleEncoder.finish()),this._bundleEncoder=void 0,this._currentItemIsBundle=!1)}addItem(e){this._finishBundle(),this._list[this._listLength++]=e,this._currentItemIsBundle=!1}getBundleEncoder(e,t,i){return this._currentItemIsBundle||(this.addBundle(),this._bundleEncoder=this._device.createRenderBundleEncoder({colorFormats:e,depthStencilFormat:t,sampleCount:i})),this._bundleEncoder}close(){this._finishBundle()}run(e){this.close();for(let t=0;t<this._listLength;++t)this._list[t].run(e)}reset(){this._listLength=0,this._currentItemIsBundle=!1,this.numDrawCalls=0}clone(){this.close();const e=new Lo(this._device);e._list=new Array(this._listLength),e._listLength=this._listLength,e.numDrawCalls=this.numDrawCalls;for(let t=0;t<this._listLength;++t)e._list[t]=this._list[t].clone();return e}}class Bo{get querySet(){return this._querySet}constructor(e,t,i,n,s=!0){this._dstBuffers=[],this._device=i,this._bufferManager=n,this._count=e,this._canUseMultipleBuffers=s,this._querySet=i.createQuerySet({type:t,count:e}),this._queryBuffer=n.createRawBuffer(8*e,sr.QueryResolve|sr.CopySrc),s||this._dstBuffers.push(this._bufferManager.createRawBuffer(8*this._count,sr.MapRead|sr.CopyDst))}_getBuffer(e,t){if(!this._canUseMultipleBuffers&&0===this._dstBuffers.length)return null;const i=this._device.createCommandEncoder();let n;return 0===this._dstBuffers.length?n=this._bufferManager.createRawBuffer(8*this._count,sr.MapRead|sr.CopyDst):(n=this._dstBuffers[this._dstBuffers.length-1],this._dstBuffers.length--),i.resolveQuerySet(this._querySet,e,t,this._queryBuffer,0),i.copyBufferToBuffer(this._queryBuffer,0,n,0,8*t),this._device.queue.submit([i.finish()]),n}async readValues(e=0,t=1){const i=this._getBuffer(e,t);if(null===i)return null;await i.mapAsync(rr.Read);const n=new BigUint64Array(i.getMappedRange()).slice();return i.unmap(),this._dstBuffers[this._dstBuffers.length]=i,n}async readValue(e=0){const t=this._getBuffer(e,1);if(null===t)return null;await t.mapAsync(rr.Read);const i=new BigUint64Array(t.getMappedRange()),n=Number(i[0]);return t.unmap(),this._dstBuffers[this._dstBuffers.length]=t,n}async readTwoValuesAndSubtract(e=0){const t=this._getBuffer(e,2);if(null===t)return null;await t.mapAsync(rr.Read);const i=new BigUint64Array(t.getMappedRange()),n=Number(i[1]-i[0]);return t.unmap(),this._dstBuffers[this._dstBuffers.length]=t,n}dispose(){this._querySet.destroy(),this._bufferManager.releaseBuffer(this._queryBuffer);for(let e=0;e<this._dstBuffers.length;++e)this._bufferManager.releaseBuffer(this._dstBuffers[e])}}class Uo{get gpuFrameTimeCounter(){return this._gpuFrameTimeCounter}constructor(e,t){this._enabled=!1,this._gpuFrameTimeCounter=new Os.z,this._measureDurationState=0,this._device=e,this._bufferManager=t}get enable(){return this._enabled}set enable(e){this._enabled!==e&&(this._enabled=e,this._measureDurationState=0,e?this._measureDuration=new Vo(this._device,this._bufferManager):this._measureDuration.dispose())}startFrame(e){this._enabled&&0===this._measureDurationState&&(this._measureDuration.start(e),this._measureDurationState=1)}endFrame(e){1===this._measureDurationState&&(this._measureDurationState=2,this._measureDuration.stop(e).then((e=>{null!==e&&e>=0&&(this._gpuFrameTimeCounter.fetchNewFrame(),this._gpuFrameTimeCounter.addCount(e,!0)),this._measureDurationState=0})))}}class Vo{constructor(e,t){this._querySet=new Bo(2,Br.Timestamp,e,t)}start(e){e.writeTimestamp(this._querySet.querySet,0)}async stop(e){return e.writeTimestamp(this._querySet.querySet,1),this._querySet.readTwoValuesAndSubtract(0)}dispose(){this._querySet.dispose()}}class ko{get querySet(){return this._querySet.querySet}get hasQueries(){return this._currentTotalIndices!==this._availableIndices.length}get canBeginQuery(){switch(this._engine._getCurrentRenderPassIndex()){case 0:return void 0!==this._engine._mainRenderPassWrapper.renderPassDescriptor.occlusionQuerySet;case 1:return void 0!==this._engine._rttRenderPassWrapper.renderPassDescriptor.occlusionQuerySet}return!1}constructor(e,t,i,n=50,s=100){this._availableIndices=[],this._engine=e,this._device=t,this._bufferManager=i,this._frameLastBuffer=-1,this._currentTotalIndices=0,this._countIncrement=s,this._allocateNewIndices(n)}createQuery(){0===this._availableIndices.length&&this._allocateNewIndices();const e=this._availableIndices[this._availableIndices.length-1];return this._availableIndices.length--,e}deleteQuery(e){this._availableIndices[this._availableIndices.length-1]=e}isQueryResultAvailable(e){return this._retrieveQueryBuffer(),!!this._lastBuffer&&e<this._lastBuffer.length}getQueryResult(e){var t,i;return Number(null!==(i=null===(t=this._lastBuffer)||void 0===t?void 0:t[e])&&void 0!==i?i:-1)}_retrieveQueryBuffer(){this._lastBuffer&&this._frameLastBuffer===this._engine.frameId||this._frameLastBuffer!==this._engine.frameId&&(this._frameLastBuffer=this._engine.frameId,this._querySet.readValues(0,this._currentTotalIndices).then((e=>{this._lastBuffer=e})))}_allocateNewIndices(e){e=null!=e?e:this._countIncrement,this._delayQuerySetDispose();for(let t=0;t<e;++t)this._availableIndices.push(this._currentTotalIndices+t);this._currentTotalIndices+=e,this._querySet=new Bo(this._currentTotalIndices,Br.Occlusion,this._device,this._bufferManager,!1)}_delayQuerySetDispose(){const e=this._querySet;e&&setTimeout((()=>e.dispose),1e3)}dispose(){var e;null===(e=this._querySet)||void 0===e||e.dispose(),this._availableIndices.length=0}}class Go{async initTwgsl(e){if(!Go._twgsl)return e=e||{},(e={...Go._TWgslDefaultOptions,...e}).twgsl?(Go._twgsl=e.twgsl,Promise.resolve()):(e.jsPath&&e.wasmPath&&((0,fe.CG)()?await de.w1.LoadScriptAsync(e.jsPath):importScripts(e.jsPath)),self.twgsl?(Go._twgsl=await self.twgsl(e.wasmPath),Promise.resolve()):Promise.reject("twgsl is not available."))}convertSpirV2WGSL(e,t=!1){const i=Go._twgsl.convertSpirV2WGSL(e);return Go.ShowWGSLShaderCode&&(console.log(i),console.log("***********************************************")),Go.DisableUniformityAnalysis||t?"diagnostic(off, derivative_uniformity);\n"+i:i}}Go._TWgslDefaultOptions={jsPath:"https://preview.babylonjs.com/twgsl/twgsl.js",wasmPath:"https://preview.babylonjs.com/twgsl/twgsl.wasm"},Go.ShowWGSLShaderCode=!1,Go.DisableUniformityAnalysis=!1,Go._twgsl=null;class zo{constructor(e,t,i,n){this._record=!1,this._play=!1,this._mainPassBundleList=[],this._enabled=!1,this._engine=e,this._mode=t,this._bundleList=i,this._bundleListRenderTarget=n}get enabled(){return this._enabled}get play(){return this._play}get record(){return this._record}set enabled(e){this._mainPassBundleList.length=0,this._record=this._enabled=e,this._play=!1,e&&(this._modeSaved=this._mode,this._mode=0)}get mode(){return this._mode}set mode(e){this._record?this._modeSaved=e:this._mode=e}endMainRenderPass(){this._record&&this._mainPassBundleList.push(this._bundleList.clone())}endRenderTargetPass(e,t){var i,n,s,r;if(this._play)null===(n=null===(i=t._bundleLists)||void 0===i?void 0:i[t._currentLayer])||void 0===n||n.run(e),1===this._mode&&this._engine._reportDrawCall(null===(r=null===(s=t._bundleLists)||void 0===s?void 0:s[t._currentLayer])||void 0===r?void 0:r.numDrawCalls);else{if(!this._record)return!1;t._bundleLists||(t._bundleLists=[]),t._bundleLists[t._currentLayer]=this._bundleListRenderTarget.clone(),t._bundleLists[t._currentLayer].run(e),this._bundleListRenderTarget.reset()}return!0}endFrame(e){if(this._record&&(this._mainPassBundleList.push(this._bundleList.clone()),this._record=!1,this._play=!0,this._mode=this._modeSaved),null!==e&&this._play)for(let t=0;t<this._mainPassBundleList.length;++t)this._mainPassBundleList[t].run(e),1===this._mode&&this._engine._reportDrawCall(this._mainPassBundleList[t].numDrawCalls)}reset(){this.enabled=!1,this.enabled=!0}}const Wo={label:"TextureView_SwapChain_ResolveTarget",dimension:or.E2d,format:void 0,mipLevelCount:1,arrayLayerCount:1},Ho={label:"TextureView_SwapChain",dimension:or.E2d,format:void 0,mipLevelCount:1,arrayLayerCount:1},Xo="/* disable_uniformity_analysis */";class jo extends ue.D{get snapshotRenderingMode(){return this._snapshotRendering.mode}set snapshotRenderingMode(e){this._snapshotRendering.mode=e}snapshotRenderingReset(){this._snapshotRendering.reset()}get snapshotRendering(){return this._snapshotRendering.enabled}set snapshotRendering(e){this._snapshotRendering.enabled=e}get disableCacheSamplers(){return!!this._cacheSampler&&this._cacheSampler.disabled}set disableCacheSamplers(e){this._cacheSampler&&(this._cacheSampler.disabled=e)}get disableCacheRenderPipelines(){return!!this._cacheRenderPipeline&&this._cacheRenderPipeline.disabled}set disableCacheRenderPipelines(e){this._cacheRenderPipeline&&(this._cacheRenderPipeline.disabled=e)}get disableCacheBindGroups(){return!!this._cacheBindGroups&&this._cacheBindGroups.disabled}set disableCacheBindGroups(e){this._cacheBindGroups&&(this._cacheBindGroups.disabled=e)}static get IsSupportedAsync(){return navigator.gpu?navigator.gpu.requestAdapter().then((e=>!!e),(()=>!1)).catch((()=>!1)):Promise.resolve(!1)}static get IsSupported(){return _.Y.Warn("You must call IsSupportedAsync for WebGPU!"),!1}get supportsUniformBuffers(){return!0}get supportedExtensions(){return this._adapterSupportedExtensions}get enabledExtensions(){return this._deviceEnabledExtensions}get supportedLimits(){return this._adapterSupportedLimits}get currentLimits(){return this._deviceLimits}get description(){return this.name+this.version}get version(){return 1}getInfo(){return{vendor:this._adapterInfo.vendor||"unknown vendor",renderer:this._adapterInfo.architecture||"unknown renderer",version:this._adapterInfo.description||"unknown version"}}get compatibilityMode(){return this._compatibilityMode}set compatibilityMode(e){this._compatibilityMode=e}get currentSampleCount(){return this._currentRenderTarget?this._currentRenderTarget.samples:this._mainPassSampleCount}static CreateAsync(e,t={}){const i=new jo(e,t);return new Promise((e=>{i.initAsync(t.glslangOptions,t.twgslOptions).then((()=>e(i)))}))}constructor(e,t={}){var i,n;super(null,null===(i=t.antialias)||void 0===i||i,t),this._uploadEncoderDescriptor={label:"upload"},this._renderEncoderDescriptor={label:"render"},this._renderTargetEncoderDescriptor={label:"renderTarget"},this._clearDepthValue=1,this._clearReverseDepthValue=0,this._clearStencilValue=0,this._defaultSampleCount=4,this._glslang=null,this._tintWASM=null,this._adapterInfo={vendor:"",architecture:"",device:"",description:""},this._compiledComputeEffects={},this._counters={numEnableEffects:0,numEnableDrawWrapper:0,numBundleCreationNonCompatMode:0,numBundleReuseNonCompatMode:0},this.countersLastFrame={numEnableEffects:0,numEnableDrawWrapper:0,numBundleCreationNonCompatMode:0,numBundleReuseNonCompatMode:0},this.numMaxUncapturedErrors=20,this._commandBuffers=[null,null,null],this._currentRenderPass=null,this._mainRenderPassWrapper=new ao,this._rttRenderPassWrapper=new ao,this._pendingDebugCommands=[],this._onAfterUnbindFrameBufferObservable=new r.y$,this._currentOverrideVertexBuffers=null,this._currentIndexBuffer=null,this._colorWriteLocal=!0,this._forceEnableEffect=!1,this.dbgShowShaderCode=!1,this.dbgSanityChecks=!0,this.dbgVerboseLogsForFirstFrames=!1,this.dbgVerboseLogsNumFrames=10,this.dbgLogIfNotDrawWrapper=!0,this.dbgShowEmptyEnableEffectCalls=!0,this.isNDCHalfZRange=!0,this.hasOriginBottomLeft=!1,this._viewportsCurrent=[{x:0,y:0,w:0,h:0},{x:0,y:0,w:0,h:0}],this._scissorsCurrent=[{x:0,y:0,w:0,h:0},{x:0,y:0,w:0,h:0}],this._scissorCached={x:0,y:0,z:0,w:0},this._stencilRefsCurrent=[-1,-1],this._blendColorsCurrent=[[null,null,null,null],[null,null,null,null]],this._name="WebGPU",t.deviceDescriptor=t.deviceDescriptor||{},t.enableGPUDebugMarkers=null!==(n=t.enableGPUDebugMarkers)&&void 0!==n&&n,_.Y.Log(`Babylon.js v${ue.D.Version} - ${this.description} engine`),navigator.gpu?(t.swapChainFormat=t.swapChainFormat||navigator.gpu.getPreferredCanvasFormat(),this._isWebGPU=!0,this._shaderPlatformName="WEBGPU",this._renderingCanvas=e,this._options=t,this._mainPassSampleCount=t.antialias?this._defaultSampleCount:1,this._setupMobileChecks(),this._sharedInit(e),this._shaderProcessor=new jr,this._shaderProcessorWGSL=new Kr):_.Y.Error("WebGPU is not supported by your browser.")}initAsync(e,t){var i;return this._initGlslang(null!=e?e:null===(i=this._options)||void 0===i?void 0:i.glslangOptions).then((e=>{var i;return this._glslang=e,this._tintWASM=jo.UseTWGSL?new Go:null,this._tintWASM?this._tintWASM.initTwgsl(null!=t?t:null===(i=this._options)||void 0===i?void 0:i.twgslOptions).then((()=>navigator.gpu.requestAdapter(this._options)),(e=>{throw _.Y.Error("Can not initialize twgsl!"),_.Y.Error(e),Error("WebGPU initializations stopped.")})):navigator.gpu.requestAdapter(this._options)}),(e=>{throw _.Y.Error("Can not initialize glslang!"),_.Y.Error(e),Error("WebGPU initializations stopped.")})).then((e=>{var t,i,n;if(e){this._adapter=e,this._adapterSupportedExtensions=[],null===(t=this._adapter.features)||void 0===t||t.forEach((e=>this._adapterSupportedExtensions.push(e))),this._adapterSupportedLimits=this._adapter.limits,this._adapter.requestAdapterInfo().then((e=>{this._adapterInfo=e}));const s=null!==(i=this._options.deviceDescriptor)&&void 0!==i?i:{},r=null!==(n=null==s?void 0:s.requiredFeatures)&&void 0!==n?n:this._options.enableAllFeatures?this._adapterSupportedExtensions:void 0;if(r){const e=r,t=[];for(const i of e)-1!==this._adapterSupportedExtensions.indexOf(i)&&t.push(i);s.requiredFeatures=t}if(this._options.setMaximumLimits&&!s.requiredLimits){s.requiredLimits={};for(const e in this._adapterSupportedLimits)s.requiredLimits[e]=this._adapterSupportedLimits[e]}return this._adapter.requestDevice(s)}throw"Could not retrieve a WebGPU adapter (adapter is null)."})).then((e=>{var t,i;this._device=e,this._deviceEnabledExtensions=[],null===(t=this._device.features)||void 0===t||t.forEach((e=>this._deviceEnabledExtensions.push(e))),this._deviceLimits=e.limits;let n=-1;this._device.addEventListener("uncapturederror",(e=>{++n<this.numMaxUncapturedErrors?_.Y.Warn(`WebGPU uncaptured error (${n+1}): ${e.error} - ${e.error.message}`):n++===this.numMaxUncapturedErrors&&_.Y.Warn(`WebGPU uncaptured error: too many warnings (${this.numMaxUncapturedErrors}), no more warnings will be reported to the console for this engine.`)})),this._doNotHandleContextLost||null===(i=this._device.lost)||void 0===i||i.then((e=>{this._isDisposed||(this._contextWasLost=!0,_.Y.Warn("WebGPU context lost. "+e),this.onContextLostObservable.notifyObservers(this),this._restoreEngineAfterContextLost(this.initAsync.bind(this)))}))}),(e=>{_.Y.Error("Could not retrieve a WebGPU device."),_.Y.Error(e)})).then((()=>{this._bufferManager=new oo(this._device),this._textureHelper=new no(this._device,this._glslang,this._tintWASM,this._bufferManager),this._cacheSampler=new uo(this._device),this._cacheBindGroups=new Po(this._device,this._cacheSampler,this),this._timestampQuery=new Uo(this._device,this._bufferManager),this._occlusionQuery=this._device.createQuerySet?new ko(this,this._device,this._bufferManager):void 0,this._bundleList=new Lo(this._device),this._bundleListRenderTarget=new Lo(this._device),this._snapshotRendering=new zo(this,this._snapshotRenderingMode,this._bundleList,this._bundleListRenderTarget),this._ubInvertY=this._bufferManager.createBuffer(new Float32Array([-1,0]),sr.Uniform|sr.CopyDst),this._ubDontInvertY=this._bufferManager.createBuffer(new Float32Array([1,0]),sr.Uniform|sr.CopyDst),this.dbgVerboseLogsForFirstFrames&&void 0===this._count&&(this._count=0,console.log("%c frame #"+this._count+" - begin","background: #ffff00")),this._uploadEncoder=this._device.createCommandEncoder(this._uploadEncoderDescriptor),this._renderEncoder=this._device.createCommandEncoder(this._renderEncoderDescriptor),this._renderTargetEncoder=this._device.createCommandEncoder(this._renderTargetEncoderDescriptor),this._emptyVertexBuffer=new qe.o(this,[0],"",!1,!1,1,!1,0,1),this._initializeLimits(),this._cacheRenderPipeline=new vo(this._device,this._emptyVertexBuffer,!this._caps.textureFloatLinearFiltering),this._depthCullingState=new To(this._cacheRenderPipeline),this._stencilStateComposer=new xo(this._cacheRenderPipeline),this._stencilStateComposer.stencilGlobal=this._stencilState,this._depthCullingState.depthTest=!0,this._depthCullingState.depthFunc=515,this._depthCullingState.depthMask=!0,this._textureHelper.setCommandEncoder(this._uploadEncoder),this._clearQuad=new Ro(this._device,this,this._emptyVertexBuffer),this._defaultDrawContext=this.createDrawContext(),this._currentDrawContext=this._defaultDrawContext,this._defaultMaterialContext=this.createMaterialContext(),this._currentMaterialContext=this._defaultMaterialContext,this._initializeContextAndSwapChain(),this._initializeMainAttachments(),this.resize()})).catch((e=>{_.Y.Error("Can not create WebGPU Device and/or context."),_.Y.Error(e),console.trace&&console.trace()}))}_initGlslang(e){return e=e||{},(e={...jo._GLSLslangDefaultOptions,...e}).glslang?Promise.resolve(e.glslang):self.glslang?self.glslang(e.wasmPath):e.jsPath&&e.wasmPath?(0,fe.CG)()?de.w1.LoadScriptAsync(e.jsPath).then((()=>self.glslang(e.wasmPath))):(importScripts(e.jsPath),self.glslang(e.wasmPath)):Promise.reject("gslang is not available.")}_initializeLimits(){this._caps={maxTexturesImageUnits:this._deviceLimits.maxSampledTexturesPerShaderStage,maxVertexTextureImageUnits:this._deviceLimits.maxSampledTexturesPerShaderStage,maxCombinedTexturesImageUnits:2*this._deviceLimits.maxSampledTexturesPerShaderStage,maxTextureSize:this._deviceLimits.maxTextureDimension2D,maxCubemapTextureSize:this._deviceLimits.maxTextureDimension2D,maxRenderTextureSize:this._deviceLimits.maxTextureDimension2D,maxVertexAttribs:this._deviceLimits.maxVertexAttributes,maxVaryingVectors:this._deviceLimits.maxInterStageShaderVariables,maxFragmentUniformVectors:Math.floor(this._deviceLimits.maxUniformBufferBindingSize/4),maxVertexUniformVectors:Math.floor(this._deviceLimits.maxUniformBufferBindingSize/4),standardDerivatives:!0,astc:this._deviceEnabledExtensions.indexOf(ir.TextureCompressionASTC)>=0||void 0,s3tc:this._deviceEnabledExtensions.indexOf(ir.TextureCompressionBC)>=0||void 0,pvrtc:null,etc1:null,etc2:this._deviceEnabledExtensions.indexOf(ir.TextureCompressionETC2)>=0||void 0,bptc:this._deviceEnabledExtensions.indexOf(ir.TextureCompressionBC)>=0||void 0,maxAnisotropy:16,uintIndices:!0,fragmentDepthSupported:!0,highPrecisionShaderSupported:!0,colorBufferFloat:!0,textureFloat:!0,textureFloatLinearFiltering:this._deviceEnabledExtensions.indexOf(ir.Float32Filterable)>=0,textureFloatRender:!0,textureHalfFloat:!0,textureHalfFloatLinearFiltering:!0,textureHalfFloatRender:!0,textureLOD:!0,texelFetch:!0,drawBuffersExtension:!0,depthTextureExtension:!0,vertexArrayObject:!1,instancedArrays:!0,timerQuery:"undefined"!=typeof BigUint64Array&&-1!==this._deviceEnabledExtensions.indexOf(ir.TimestampQuery)||void 0,supportOcclusionQuery:"undefined"!=typeof BigUint64Array,canUseTimestampForTimerQuery:!0,multiview:!1,oculusMultiview:!1,parallelShaderCompile:void 0,blendMinMax:!0,maxMSAASamples:4,canUseGLInstanceID:!0,canUseGLVertexID:!0,supportComputeShaders:!0,supportSRGBBuffers:!0,supportTransformFeedbacks:!1,textureMaxLevel:!0,texture2DArrayMaxLayerCount:this._deviceLimits.maxTextureArrayLayers,disableMorphTargetTexture:!1},this._caps.parallelShaderCompile=null,this._features={forceBitmapOverHTMLImageElement:!0,supportRenderAndCopyToLodForFloatTextures:!0,supportDepthStencilTexture:!0,supportShadowSamplers:!0,uniformBufferHardCheckMatrix:!1,allowTexturePrefiltering:!0,trackUbosInFrame:!0,checkUbosContentBeforeUpload:!0,supportCSM:!0,basisNeedsPOT:!1,support3DTextures:!0,needTypeSuffixInShaderConstants:!0,supportMSAA:!0,supportSSAO2:!0,supportExtendedTextureFormats:!0,supportSwitchCaseInShader:!0,supportSyncTextureRead:!1,needsInvertingBitmap:!1,useUBOBindingCache:!1,needShaderCodeInlining:!0,needToAlwaysBindUniformBuffers:!0,supportRenderPasses:!0,supportSpriteInstancing:!0,_collectUbosUpdatedInFrame:!1}}_initializeContextAndSwapChain(){if(!this._renderingCanvas)throw"The rendering canvas has not been set!";this._context=this._renderingCanvas.getContext("webgpu"),this._configureContext(),this._colorFormat=this._options.swapChainFormat,this._mainRenderPassWrapper.colorAttachmentGPUTextures=[new $r],this._mainRenderPassWrapper.colorAttachmentGPUTextures[0].format=this._colorFormat}_initializeMainAttachments(){if(!this._bufferManager)return;this.flushFramebuffer(!1),this._mainTextureExtends={width:this.getRenderWidth(!0),height:this.getRenderHeight(!0),depthOrArrayLayers:1};const e=new Float32Array([this.getRenderHeight(!0)]);let t;if(this._bufferManager.setSubData(this._ubInvertY,4,e),this._bufferManager.setSubData(this._ubDontInvertY,4,e),this._options.antialias){const e={label:`Texture_MainColor_${this._mainTextureExtends.width}x${this._mainTextureExtends.height}_antialiasing`,size:this._mainTextureExtends,mipLevelCount:1,sampleCount:this._mainPassSampleCount,dimension:or.E2d,format:this._options.swapChainFormat,usage:ar.RenderAttachment};this._mainTexture&&this._textureHelper.releaseTexture(this._mainTexture),this._mainTexture=this._device.createTexture(e),t=[{view:this._mainTexture.createView({label:"TextureView_MainColor_antialiasing",dimension:or.E2d,format:this._options.swapChainFormat,mipLevelCount:1,arrayLayerCount:1}),clearValue:new Gr.HE(0,0,0,1),loadOp:Fr.Clear,storeOp:Lr.Store}]}else t=[{view:void 0,clearValue:new Gr.HE(0,0,0,1),loadOp:Fr.Clear,storeOp:Lr.Store}];this._mainRenderPassWrapper.depthTextureFormat=this.isStencilEnable?cr.Depth24PlusStencil8:cr.Depth32Float,this._setDepthTextureFormat(this._mainRenderPassWrapper);const i={label:`Texture_MainDepthStencil_${this._mainTextureExtends.width}x${this._mainTextureExtends.height}`,size:this._mainTextureExtends,mipLevelCount:1,sampleCount:this._mainPassSampleCount,dimension:or.E2d,format:this._mainRenderPassWrapper.depthTextureFormat,usage:ar.RenderAttachment};this._depthTexture&&this._textureHelper.releaseTexture(this._depthTexture),this._depthTexture=this._device.createTexture(i);const n={view:this._depthTexture.createView({label:`TextureView_MainDepthStencil_${this._mainTextureExtends.width}x${this._mainTextureExtends.height}`,dimension:or.E2d,format:this._depthTexture.format,mipLevelCount:1,arrayLayerCount:1}),depthClearValue:this._clearDepthValue,depthLoadOp:Fr.Clear,depthStoreOp:Lr.Store,stencilClearValue:this._clearStencilValue,stencilLoadOp:this.isStencilEnable?Fr.Clear:void 0,stencilStoreOp:this.isStencilEnable?Lr.Store:void 0};this._mainRenderPassWrapper.renderPassDescriptor={colorAttachments:t,depthStencilAttachment:n}}_configureContext(){this._context.configure({device:this._device,format:this._options.swapChainFormat,usage:ar.RenderAttachment|ar.CopySrc,alphaMode:this.premultipliedAlpha?Ur.Premultiplied:Ur.Opaque})}setSize(e,t,i=!1){return!!super.setSize(e,t,i)&&(this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - setSize called -",e,t)),this._initializeMainAttachments(),this.snapshotRendering&&this.snapshotRenderingReset(),!0)}_getShaderProcessor(e){return e===Cn.x.WGSL?this._shaderProcessorWGSL:this._shaderProcessor}_getShaderProcessingContext(e){return new Xr(e)}applyStates(){this._stencilStateComposer.apply(),this._cacheRenderPipeline.setAlphaBlendEnabled(this._alphaState.alphaBlend)}wipeCaches(e){this.preventCacheWipeBetweenFrames&&!e||(this._forceEnableEffect=!0,this._currentIndexBuffer=null,this._currentOverrideVertexBuffers=null,this._cacheRenderPipeline.setBuffers(null,null,null),e&&(this._stencilStateComposer.reset(),this._depthCullingState.reset(),this._depthCullingState.depthFunc=515,this._alphaState.reset(),this._alphaMode=1,this._alphaEquation=0,this._cacheRenderPipeline.setAlphaBlendFactors(this._alphaState._blendFunctionParameters,this._alphaState._blendEquationParameters),this._cacheRenderPipeline.setAlphaBlendEnabled(!1),this.setColorWrite(!0)),this._cachedVertexBuffers=null,this._cachedIndexBuffer=null,this._cachedEffectForVertexBuffers=null)}setColorWrite(e){this._colorWriteLocal=e,this._cacheRenderPipeline.setWriteMask(e?15:0)}getColorWrite(){return this._colorWriteLocal}_resetCurrentViewport(e){this._viewportsCurrent[e].x=0,this._viewportsCurrent[e].y=0,this._viewportsCurrent[e].w=0,this._viewportsCurrent[e].h=0}_mustUpdateViewport(e){const t=e===this._mainRenderPassWrapper.renderPass?0:1,i=this._viewportCached.x,n=this._viewportCached.y,s=this._viewportCached.z,r=this._viewportCached.w,o=this._viewportsCurrent[t].x!==i||this._viewportsCurrent[t].y!==n||this._viewportsCurrent[t].w!==s||this._viewportsCurrent[t].h!==r;return o&&(this._viewportsCurrent[t].x=this._viewportCached.x,this._viewportsCurrent[t].y=this._viewportCached.y,this._viewportsCurrent[t].w=this._viewportCached.z,this._viewportsCurrent[t].h=this._viewportCached.w),o}_applyViewport(e){let t=Math.floor(this._viewportCached.y);const i=Math.floor(this._viewportCached.w);this._currentRenderTarget||(t=this.getRenderHeight(!0)-t-i),e.setViewport(Math.floor(this._viewportCached.x),t,Math.floor(this._viewportCached.z),i,0,1),this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - viewport applied - (",this._viewportCached.x,this._viewportCached.y,this._viewportCached.z,this._viewportCached.w,") current pass is main pass="+(e===this._mainRenderPassWrapper.renderPass)))}_viewport(e,t,i,n){this._viewportCached.x=e,this._viewportCached.y=t,this._viewportCached.z=i,this._viewportCached.w=n}_resetCurrentScissor(e){this._scissorsCurrent[e].x=0,this._scissorsCurrent[e].y=0,this._scissorsCurrent[e].w=0,this._scissorsCurrent[e].h=0}_mustUpdateScissor(e){const t=e===this._mainRenderPassWrapper.renderPass?0:1,i=this._scissorCached.x,n=this._scissorCached.y,s=this._scissorCached.z,r=this._scissorCached.w,o=this._scissorsCurrent[t].x!==i||this._scissorsCurrent[t].y!==n||this._scissorsCurrent[t].w!==s||this._scissorsCurrent[t].h!==r;return o&&(this._scissorsCurrent[t].x=this._scissorCached.x,this._scissorsCurrent[t].y=this._scissorCached.y,this._scissorsCurrent[t].w=this._scissorCached.z,this._scissorsCurrent[t].h=this._scissorCached.w),o}_applyScissor(e){e.setScissorRect(this._scissorCached.x,this._currentRenderTarget?this._scissorCached.y:this.getRenderHeight()-this._scissorCached.w-this._scissorCached.y,this._scissorCached.z,this._scissorCached.w),this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - scissor applied - (",this._scissorCached.x,this._scissorCached.y,this._scissorCached.z,this._scissorCached.w,") current pass is main pass="+(e===this._mainRenderPassWrapper.renderPass)))}_scissorIsActive(){return 0!==this._scissorCached.x||0!==this._scissorCached.y||0!==this._scissorCached.z||0!==this._scissorCached.w}enableScissor(e,t,i,n){this._scissorCached.x=e,this._scissorCached.y=t,this._scissorCached.z=i,this._scissorCached.w=n}disableScissor(){this._scissorCached.x=0,this._scissorCached.y=0,this._scissorCached.z=0,this._scissorCached.w=0,this._resetCurrentScissor(0),this._resetCurrentScissor(1)}_resetCurrentStencilRef(e){this._stencilRefsCurrent[e]=-1}_mustUpdateStencilRef(e){const t=e===this._mainRenderPassWrapper.renderPass?0:1,i=this._stencilStateComposer.funcRef!==this._stencilRefsCurrent[t];return i&&(this._stencilRefsCurrent[t]=this._stencilStateComposer.funcRef),i}_applyStencilRef(e){var t;e.setStencilReference(null!==(t=this._stencilStateComposer.funcRef)&&void 0!==t?t:0)}_resetCurrentColorBlend(e){this._blendColorsCurrent[e][0]=this._blendColorsCurrent[e][1]=this._blendColorsCurrent[e][2]=this._blendColorsCurrent[e][3]=null}_mustUpdateBlendColor(e){const t=e===this._mainRenderPassWrapper.renderPass?0:1,i=this._alphaState._blendConstants,n=i[0]!==this._blendColorsCurrent[t][0]||i[1]!==this._blendColorsCurrent[t][1]||i[2]!==this._blendColorsCurrent[t][2]||i[3]!==this._blendColorsCurrent[t][3];return n&&(this._blendColorsCurrent[t][0]=i[0],this._blendColorsCurrent[t][1]=i[1],this._blendColorsCurrent[t][2]=i[2],this._blendColorsCurrent[t][3]=i[3]),n}_applyBlendColor(e){e.setBlendConstant(this._alphaState._blendConstants)}clear(e,t,i,n=!1){e&&void 0===e.a&&(e.a=1);const s=this._scissorIsActive();this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - clear called - backBuffer=",t," depth=",i," stencil=",n," scissor is active=",s)),this._currentRenderTarget?s?(this._rttRenderPassWrapper.renderPass||this._startRenderTargetRenderPass(this._currentRenderTarget,!1,t?e:null,i,n),this.compatibilityMode?this._applyScissor(this._currentRenderPass):this._bundleListRenderTarget.addItem(new Io(this._scissorCached.x,this._scissorCached.y,this._scissorCached.z,this._scissorCached.w)),this._clearFullQuad(t?e:null,i,n)):(this._currentRenderPass&&this._endRenderTargetRenderPass(),this._startRenderTargetRenderPass(this._currentRenderTarget,!0,t?e:null,i,n)):(this._mainRenderPassWrapper.renderPass&&s||this._startMainRenderPass(!s,t?e:null,i,n),s&&(this.compatibilityMode?this._applyScissor(this._currentRenderPass):this._bundleList.addItem(new Io(this._scissorCached.x,this._scissorCached.y,this._scissorCached.z,this._scissorCached.w)),this._clearFullQuad(t?e:null,i,n)))}_clearFullQuad(e,t,i){var n,s,r;const o=this.compatibilityMode?this._getCurrentRenderPass():null,a=0===this._getCurrentRenderPassIndex()?this._bundleList:this._bundleListRenderTarget;this._clearQuad.setColorFormat(this._colorFormat),this._clearQuad.setDepthStencilFormat(this._depthTextureFormat),this._clearQuad.setMRTAttachments(null!==(n=this._cacheRenderPipeline.mrtAttachments)&&void 0!==n?n:[],null!==(s=this._cacheRenderPipeline.mrtTextureArray)&&void 0!==s?s:[],this._cacheRenderPipeline.mrtTextureCount),this.compatibilityMode?o.setStencilReference(this._clearStencilValue):a.addItem(new Do(this._clearStencilValue));const l=this._clearQuad.clear(o,e,t,i,this.currentSampleCount);this.compatibilityMode?this._applyStencilRef(o):(a.addBundle(l),a.addItem(new Do(null!==(r=this._stencilStateComposer.funcRef)&&void 0!==r?r:0)),this._reportDrawCall())}createVertexBuffer(e){let t;return t=e instanceof Array?new Float32Array(e):e instanceof ArrayBuffer?new Uint8Array(e):e,this._bufferManager.createBuffer(t,sr.Vertex|sr.CopyDst)}createDynamicVertexBuffer(e){return this.createVertexBuffer(e)}createIndexBuffer(e){let t,i=!0;e instanceof Uint32Array||e instanceof Int32Array?t=e:e instanceof Uint16Array?(t=e,i=!1):e.length>65535?t=new Uint32Array(e):(t=new Uint16Array(e),i=!1);const n=this._bufferManager.createBuffer(t,sr.Index|sr.CopyDst);return n.is32Bits=i,n}_createBuffer(e,t){let i;i=e instanceof Array?new Float32Array(e):e instanceof ArrayBuffer?new Uint8Array(e):e;let n=0;return 1&t&&(n|=sr.CopySrc),2&t&&(n|=sr.CopyDst),4&t&&(n|=sr.Uniform),8&t&&(n|=sr.Vertex),16&t&&(n|=sr.Index),32&t&&(n|=sr.Storage),this._bufferManager.createBuffer(i,n)}bindBuffersDirectly(){throw"Not implemented on WebGPU"}updateAndBindInstancesBuffer(){throw"Not implemented on WebGPU"}bindBuffers(e,t,i,n){this._currentIndexBuffer=t,this._currentOverrideVertexBuffers=null!=n?n:null,this._cacheRenderPipeline.setBuffers(e,t,this._currentOverrideVertexBuffers)}_releaseBuffer(e){return this._bufferManager.releaseBuffer(e)}createEffect(e,t,i,n,s,r,o,a,l,h=Cn.x.GLSL){var c;const u=e.vertexElement||e.vertex||e.vertexToken||e.vertexSource||e,d=e.fragmentElement||e.fragment||e.fragmentToken||e.fragmentSource||e,p=this._getGlobalDefines();let f=null!==(c=null!=s?s:t.defines)&&void 0!==c?c:"";p&&(f+="\n"+p);const _=u+"+"+d+"@"+f;if(this._compiledEffects[_]){const e=this._compiledEffects[_];return o&&e.isReady()&&o(e),e}const m=new ds.Q(e,t,i,n,this,s,r,o,a,l,_,h);return this._compiledEffects[_]=m,m}_compileRawShaderToSpirV(e,t){return this._glslang.compileGLSL(e,t)}_compileShaderToSpirV(e,t,i,n){return this._compileRawShaderToSpirV(n+(i?i+"\n":"")+e,t)}_getWGSLShader(e,t,i){return(i=i?"//"+i.split("\n").join("\n//")+"\n":"")+e}_createPipelineStageDescriptor(e,t,i,n,s){return this._tintWASM&&i===Cn.x.GLSL&&(e=this._tintWASM.convertSpirV2WGSL(e,n),t=this._tintWASM.convertSpirV2WGSL(t,s)),{vertexStage:{module:this._device.createShaderModule({code:e}),entryPoint:"main"},fragmentStage:{module:this._device.createShaderModule({code:t}),entryPoint:"main"}}}_compileRawPipelineStageDescriptor(e,t,i){const n=e.indexOf(Xo)>=0,s=t.indexOf(Xo)>=0,r=i===Cn.x.GLSL?this._compileRawShaderToSpirV(e,"vertex"):e,o=i===Cn.x.GLSL?this._compileRawShaderToSpirV(t,"fragment"):t;return this._createPipelineStageDescriptor(r,o,i,n,s)}_compilePipelineStageDescriptor(e,t,i,n){this.onBeforeShaderCompilationObservable.notifyObservers(this);const s=e.indexOf(Xo)>=0,r=t.indexOf(Xo)>=0,o="#version 450\n",a=n===Cn.x.GLSL?this._compileShaderToSpirV(e,"vertex",i,o):this._getWGSLShader(e,"vertex",i),l=n===Cn.x.GLSL?this._compileShaderToSpirV(t,"fragment",i,o):this._getWGSLShader(t,"fragment",i),h=this._createPipelineStageDescriptor(a,l,n,s,r);return this.onAfterShaderCompilationObservable.notifyObservers(this),h}createRawShaderProgram(){throw"Not available on WebGPU"}createShaderProgram(){throw"Not available on WebGPU"}inlineShaderCode(e){const t=new zs.Z(e);return t.debug=!1,t.processCode(),t.code}createPipelineContext(e){return new Wr(e,this)}createMaterialContext(){return new Eo}createDrawContext(){return new Co(this._bufferManager)}_preparePipelineContext(e,t,i,n,s,r,o,a){const l=e,h=l.shaderProcessingContext.shaderLanguage;this.dbgShowShaderCode&&(console.log(a),console.log(t),console.log(i),console.log("***********************************************")),l.sources={fragment:i,vertex:t,rawVertex:s,rawFragment:r},l.stages=n?this._compileRawPipelineStageDescriptor(t,i,h):this._compilePipelineStageDescriptor(t,i,a,h)}getAttributes(e,t){const i=new Array(t.length),n=e;for(let e=0;e<t.length;e++){const s=t[e],r=n.shaderProcessingContext.availableAttributes[s];void 0!==r&&(i[e]=r)}return i}enableEffect(e){if(!e)return;let t=!0;if(Ps.q.IsWrapper(e)){if(!e.effect||e.effect===this._currentEffect&&e.materialContext===this._currentMaterialContext&&e.drawContext===this._currentDrawContext&&!this._forceEnableEffect){if(!e.effect&&this.dbgShowEmptyEnableEffectCalls)throw console.error("drawWrapper=",e),"Invalid call to enableEffect: the effect property is empty!";return}if(t=e.effect!==this._currentEffect,this._currentEffect=e.effect,this._currentMaterialContext=e.materialContext,this._currentDrawContext=e.drawContext,this._counters.numEnableDrawWrapper++,!this._currentMaterialContext)throw console.error("drawWrapper=",e),"Invalid call to enableEffect: the materialContext property is empty!"}else t=e!==this._currentEffect,this._currentEffect=e,this._currentMaterialContext=this._defaultMaterialContext,this._currentDrawContext=this._defaultDrawContext,this._counters.numEnableEffects++,this.dbgLogIfNotDrawWrapper&&_.Y.Warn(`enableEffect has been called with an Effect and not a Wrapper! effect.uniqueId=${e.uniqueId}, effect.name=${e.name}, effect.name.vertex=${e.name.vertex}, effect.name.fragment=${e.name.fragment}`,10);this._stencilStateComposer.stencilMaterial=void 0,this._forceEnableEffect=!t&&!this._forceEnableEffect&&this._forceEnableEffect,t&&(this._currentEffect.onBind&&this._currentEffect.onBind(this._currentEffect),this._currentEffect._onBindObservable&&this._currentEffect._onBindObservable.notifyObservers(this._currentEffect))}_releaseEffect(e){this._compiledEffects[e._key]&&(delete this._compiledEffects[e._key],this._deletePipelineContext(e.getPipelineContext()))}releaseEffects(){for(const e in this._compiledEffects){const t=this._compiledEffects[e].getPipelineContext();this._deletePipelineContext(t)}this._compiledEffects={}}_deletePipelineContext(e){e&&e.dispose()}get needPOTTextures(){return!1}_createHardwareTexture(){return new $r}_releaseTexture(e){const t=this._internalTexturesCache.indexOf(e);-1!==t&&this._internalTexturesCache.splice(t,1),this._textureHelper.releaseTexture(e)}_getRGBABufferInternalSizedFormat(){return 5}updateTextureComparisonFunction(e,t){e._comparisonFunction=t}_createInternalTexture(e,t,i=!0,n=Ei.S.Unknown){var s,r,o;const a={};void 0!==t&&"object"==typeof t?(a.generateMipMaps=t.generateMipMaps,a.type=void 0===t.type?0:t.type,a.samplingMode=void 0===t.samplingMode?3:t.samplingMode,a.format=void 0===t.format?5:t.format,a.samples=null!==(s=t.samples)&&void 0!==s?s:1,a.creationFlags=null!==(r=t.creationFlags)&&void 0!==r?r:0,a.useSRGBBuffer=null!==(o=t.useSRGBBuffer)&&void 0!==o&&o,a.label=t.label):(a.generateMipMaps=t,a.type=0,a.samplingMode=3,a.format=5,a.samples=1,a.creationFlags=0,a.useSRGBBuffer=!1),(1!==a.type||this._caps.textureFloatLinearFiltering)&&(2!==a.type||this._caps.textureHalfFloatLinearFiltering)||(a.samplingMode=1),1!==a.type||this._caps.textureFloat||(a.type=0,_.Y.Warn("Float textures are not supported. Type forced to TEXTURETYPE_UNSIGNED_BYTE"));const l=new Ei.l(this,n),h=e.width||e,c=e.height||e,u=e.layers||0;return l.baseWidth=h,l.baseHeight=c,l.width=h,l.height=c,l.depth=u,l.isReady=!0,l.samples=a.samples,l.generateMipMaps=!!a.generateMipMaps,l.samplingMode=a.samplingMode,l.type=a.type,l.format=a.format,l.is2DArray=u>0,l._cachedWrapU=0,l._cachedWrapV=0,l._useSRGBBuffer=a.useSRGBBuffer,l.label=a.label,this._internalTexturesCache.push(l),i||this._textureHelper.createGPUTextureForInternalTexture(l,h,c,u||1,a.creationFlags),l}createTexture(e,t,i,n,s=3,r=null,o=null,a=null,l=null,h=null,c=null,u,d,p,f){return this._createTextureBase(e,t,i,n,s,r,o,((e,t,i,n,s,r,o,a)=>{var l;const c=n;if(e.baseWidth=c.width,e.baseHeight=c.height,e.width=c.width,e.height=c.height,e.format=null!=h?h:-1,a(e.width,e.height,c,t,e,(()=>{})),null===(l=e._hardwareTexture)||void 0===l?void 0:l.underlyingResource)r||o||this._generateMipmaps(e,this._uploadEncoder);else{const t=this._textureHelper.createGPUTextureForInternalTexture(e,c.width,c.height,void 0,p);no.IsImageBitmap(c)&&(this._textureHelper.updateTexture(c,e,c.width,c.height,e.depth,t.format,0,0,s,!1,0,0),r||o||this._generateMipmaps(e,this._uploadEncoder))}i&&i.removePendingData(e),e.isReady=!0,e.onLoadedObservable.notifyObservers(e),e.onLoadedObservable.clear()}),(()=>!1),a,l,h,c,u,d,f)}wrapWebGPUTexture(e){const t=new $r(e),i=new Ei.l(this,Ei.S.Unknown,!0);return i._hardwareTexture=t,i.isReady=!0,i}wrapWebGLTexture(){throw new Error("wrapWebGLTexture is not supported, use wrapWebGPUTexture instead.")}generateMipMapsForCubemap(e){var t;e.generateMipMaps&&((null===(t=e._hardwareTexture)||void 0===t?void 0:t.underlyingResource)||this._textureHelper.createGPUTextureForInternalTexture(e),this._generateMipmaps(e,e.source===Ei.S.RenderTarget||e.source===Ei.S.MultiRenderTarget?this._renderTargetEncoder:void 0))}updateTextureSamplingMode(e,t,i=!1){i&&(t.generateMipMaps=!0,this._generateMipmaps(t)),t.samplingMode=e}updateTextureWrappingMode(e,t,i=null,n=null){null!==t&&(e._cachedWrapU=t),null!==i&&(e._cachedWrapV=i),(e.is2DArray||e.is3D)&&null!==n&&(e._cachedWrapR=n)}updateTextureDimensions(e,t,i,n=1){if(!e._hardwareTexture)return;if(e.width===t&&e.height===i&&e.depth===n)return;const s=e._hardwareTexture.textureAdditionalUsages;e._hardwareTexture.release(),this._textureHelper.createGPUTextureForInternalTexture(e,t,i,n,s)}_setInternalTexture(e,t,i){if(i=null!=i?i:e,this._currentEffect){const n=this._currentEffect._pipelineContext.shaderProcessingContext.availableTextures[i];if(this._currentMaterialContext.setTexture(e,t),n&&n.autoBindSampler){const e=i+zr.AutoSamplerSuffix;this._currentMaterialContext.setSampler(e,t)}}}setTexture(e,t,i,n){this._setTexture(e,i,!1,!1,n,n)}setTextureArray(e,t,i,n){for(let e=0;e<i.length;e++)this._setTexture(-1,i[e],!0,!1,n+e.toString(),n)}_setTexture(e,t,i=!1,n=!1,s="",r){if(r=null!=r?r:s,this._currentEffect){if(!t)return this._currentMaterialContext.setTexture(s,null),!1;if(t.video)t.update();else if(4===t.delayLoadState)return t.delayLoad(),!1;let e=null;if(e=n?t.depthStencilTexture:t.isReady()?t.getInternalTexture():t.isCube?this.emptyCubeTexture:t.is3D?this.emptyTexture3D:t.is2DArray?this.emptyTexture2DArray:this.emptyTexture,e&&!e.isMultiview){if(e.isCube&&e._cachedCoordinatesMode!==t.coordinatesMode){e._cachedCoordinatesMode=t.coordinatesMode;const i=3!==t.coordinatesMode&&5!==t.coordinatesMode?1:0;t.wrapU=i,t.wrapV=i}e._cachedWrapU=t.wrapU,e._cachedWrapV=t.wrapV,e.is3D&&(e._cachedWrapR=t.wrapR),this._setAnisotropicLevel(0,e,t.anisotropicFilteringLevel)}this._setInternalTexture(s,e,r)}else this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - _setTexture called with a null _currentEffect! texture=",t));return!0}_setAnisotropicLevel(e,t,i){t._cachedAnisotropicFilteringLevel!==i&&(t._cachedAnisotropicFilteringLevel=Math.min(i,this._caps.maxAnisotropy))}_bindTexture(e,t,i){void 0!==e&&this._setInternalTexture(i,t)}generateMipmaps(e){this._generateMipmaps(e,this._renderTargetEncoder)}_generateMipmaps(e,t){const i=e._hardwareTexture;if(!i)return;t=null!=t?t:this._currentRenderTarget&&!this._currentRenderPass?this._renderTargetEncoder:this._currentRenderPass?this._uploadEncoder:this._renderEncoder;const n=e._hardwareTexture.format,s=no.ComputeNumMipmapLevels(e.width,e.height);this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - generate mipmaps called - width=",e.width,"height=",e.height,"isCube=",e.isCube)),e.isCube?this._textureHelper.generateCubeMipmaps(i,n,s,t):this._textureHelper.generateMipmaps(i,n,s,0,t)}updateTextureData(e,t,i,n,s,r,o=0,a=0,l=!1){var h;let c=e._hardwareTexture;(null===(h=e._hardwareTexture)||void 0===h?void 0:h.underlyingResource)||(c=this._textureHelper.createGPUTextureForInternalTexture(e));const u=new Uint8Array(t.buffer,t.byteOffset,t.byteLength);this._textureHelper.updateTexture(u,e,s,r,e.depth,c.format,o,a,e.invertY,!1,i,n),l&&this._generateMipmaps(e,this._renderTargetEncoder)}_uploadCompressedDataToTextureDirectly(e,t,i,n,s,r=0,o=0){var a;let l=e._hardwareTexture;(null===(a=e._hardwareTexture)||void 0===a?void 0:a.underlyingResource)||(e.format=t,l=this._textureHelper.createGPUTextureForInternalTexture(e,i,n));const h=new Uint8Array(s.buffer,s.byteOffset,s.byteLength);this._textureHelper.updateTexture(h,e,i,n,e.depth,l.format,r,o,!1,!1,0,0)}_uploadDataToTextureDirectly(e,t,i=0,n=0,s,r=!1){var o;const a=Math.round(Math.log(e.width)*Math.LOG2E),l=Math.round(Math.log(e.height)*Math.LOG2E),h=r?e.width:Math.pow(2,Math.max(a-n,0)),c=r?e.height:Math.pow(2,Math.max(l-n,0));let u=e._hardwareTexture;(null===(o=e._hardwareTexture)||void 0===o?void 0:o.underlyingResource)||(u=this._textureHelper.createGPUTextureForInternalTexture(e,h,c));const d=new Uint8Array(t.buffer,t.byteOffset,t.byteLength);this._textureHelper.updateTexture(d,e,h,c,e.depth,u.format,i,n,e.invertY,!1,0,0)}_uploadArrayBufferViewToTexture(e,t,i=0,n=0){this._uploadDataToTextureDirectly(e,t,i,n)}_uploadImageToTexture(e,t,i=0,n=0){var s;let r=e._hardwareTexture;if((null===(s=e._hardwareTexture)||void 0===s?void 0:s.underlyingResource)||(r=this._textureHelper.createGPUTextureForInternalTexture(e)),t instanceof HTMLImageElement)throw"WebGPU engine: HTMLImageElement not supported in _uploadImageToTexture!";const o=t,a=Math.ceil(e.width/(1<<n)),l=Math.ceil(e.height/(1<<n));this._textureHelper.updateTexture(o,e,a,l,e.depth,r.format,i,n,e.invertY,!1,0,0)}readPixels(e,t,i,n,s=!0,r=!0){const o=(this._rttRenderPassWrapper.renderPass?this._rttRenderPassWrapper:this._mainRenderPassWrapper).colorAttachmentGPUTextures[0];if(!o)return Promise.resolve(new Uint8Array(0));const a=o.underlyingResource,l=o.format;return a?(r&&this.flushFramebuffer(),this._textureHelper.readPixels(a,e,t,i,n,l)):Promise.resolve(new Uint8Array(0))}beginFrame(){super.beginFrame()}endFrame(){if(this._snapshotRendering.endFrame(this._mainRenderPassWrapper.renderPass),this._endMainRenderPass(),this._timestampQuery.endFrame(this._renderEncoder),this.flushFramebuffer(!1),this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - counters")),this._textureHelper.destroyDeferredTextures(),this._bufferManager.destroyDeferredBuffers(),this._features._collectUbosUpdatedInFrame){if(this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),!this._count||this._count<this.dbgVerboseLogsNumFrames)){const e=[];for(const t in Ci.M._UpdatedUbosInFrame)e.push(t+":"+Ci.M._UpdatedUbosInFrame[t]);console.log("frame #"+this._count+" - updated ubos -",e.join(", "))}Ci.M._UpdatedUbosInFrame={}}this.countersLastFrame.numEnableEffects=this._counters.numEnableEffects,this.countersLastFrame.numEnableDrawWrapper=this._counters.numEnableDrawWrapper,this.countersLastFrame.numBundleCreationNonCompatMode=this._counters.numBundleCreationNonCompatMode,this.countersLastFrame.numBundleReuseNonCompatMode=this._counters.numBundleReuseNonCompatMode,this._counters.numEnableEffects=0,this._counters.numEnableDrawWrapper=0,this._counters.numBundleCreationNonCompatMode=0,this._counters.numBundleReuseNonCompatMode=0,this._cacheRenderPipeline.endFrame(),this._cacheBindGroups.endFrame(),this._pendingDebugCommands.length=0,super.endFrame(),this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),this._count<this.dbgVerboseLogsNumFrames&&console.log("%c frame #"+this._count+" - end","background: #ffff00"),this._count<this.dbgVerboseLogsNumFrames&&(this._count++,this._count!==this.dbgVerboseLogsNumFrames&&console.log("%c frame #"+this._count+" - begin","background: #ffff00")))}flushFramebuffer(e=!0){const t=!this._currentRenderPass;let i=0;this._currentRenderPass&&this._currentRenderTarget&&(i|=1,this._endRenderTargetRenderPass()),this._mainRenderPassWrapper.renderPass&&(i|=2,this._endMainRenderPass()),this._commandBuffers[0]=this._uploadEncoder.finish(),this._commandBuffers[1]=this._renderTargetEncoder.finish(),this._commandBuffers[2]=this._renderEncoder.finish(),this._device.queue.submit(this._commandBuffers),this._uploadEncoder=this._device.createCommandEncoder(this._uploadEncoderDescriptor),this._renderEncoder=this._device.createCommandEncoder(this._renderEncoderDescriptor),this._renderTargetEncoder=this._device.createCommandEncoder(this._renderTargetEncoderDescriptor),this._timestampQuery.startFrame(this._uploadEncoder),this._textureHelper.setCommandEncoder(this._uploadEncoder),this._bundleList.reset(),this._bundleListRenderTarget.reset(),e&&(2&i&&this._startMainRenderPass(!1),1&i&&this._startRenderTargetRenderPass(this._currentRenderTarget,!1,null,!1,!1),t&&this._currentRenderTarget&&(this._currentRenderPass=null))}_currentFrameBufferIsDefaultFrameBuffer(){return null===this._currentRenderTarget}_startRenderTargetRenderPass(e,t,i,n,s){var r,o,a,l,h,c,u;const d=e,p=d._depthStencilTexture,f=null==p?void 0:p._hardwareTexture,_=null==f?void 0:f.underlyingResource,m=null==f?void 0:f.getMSAATexture(),g=null==_?void 0:_.createView(this._rttRenderPassWrapper.depthAttachmentViewDescriptor),v=null==m?void 0:m.createView(this._rttRenderPassWrapper.depthAttachmentViewDescriptor),y=!!f&&no.HasStencilAspect(f.format),x=[];this.useReverseDepthBuffer&&this.setDepthFunctionToGreaterOrEqual();const b=t&&i,T=t&&n,S=t&&s;if(d._attachments&&d.isMulti){this._mrtAttachments&&0!==this._mrtAttachments.length||(this._mrtAttachments=d._defaultAttachments);for(let e=0;e<this._mrtAttachments.length;++e){const t=this._mrtAttachments[e],n=d.textures[e],s=null==n?void 0:n._hardwareTexture,h=null==s?void 0:s.underlyingResource;if(s&&h){const c=s.getMSAATexture(e),u=null!==(o=null===(r=d.layerIndices)||void 0===r?void 0:r[e])&&void 0!==o?o:0,p=null!==(l=null===(a=d.faceIndices)||void 0===a?void 0:a[e])&&void 0!==l?l:0,f={...this._rttRenderPassWrapper.colorAttachmentViewDescriptor,format:s.format,baseArrayLayer:n.isCube?6*u+p:u},_={...this._rttRenderPassWrapper.colorAttachmentViewDescriptor,format:s.format,baseArrayLayer:0},m=h.createView(f),g=null==c?void 0:c.createView(_);x.push({view:g||m,resolveTarget:c?m:void 0,clearValue:0!==t&&b?i:void 0,loadOp:0!==t&&b?Fr.Clear:Fr.Load,storeOp:Lr.Store})}}this._cacheRenderPipeline.setMRT(d.textures,this._mrtAttachments.length),this._cacheRenderPipeline.setMRTAttachments(this._mrtAttachments)}else{const e=d.texture;if(e){const t=e._hardwareTexture,n=t.underlyingResource,s=t.getMSAATexture(),r=n.createView(this._rttRenderPassWrapper.colorAttachmentViewDescriptor),o=null==s?void 0:s.createView(this._rttRenderPassWrapper.colorAttachmentViewDescriptor);x.push({view:o||r,resolveTarget:s?r:void 0,clearValue:b?i:void 0,loadOp:b?Fr.Clear:Fr.Load,storeOp:Lr.Store})}else x.push(null)}if(null===(h=this._debugPushGroup)||void 0===h||h.call(this,"render target pass",1),this._rttRenderPassWrapper.renderPassDescriptor={colorAttachments:x,depthStencilAttachment:p&&_?{view:v||g,depthClearValue:T?this.useReverseDepthBuffer?this._clearReverseDepthValue:this._clearDepthValue:void 0,depthLoadOp:T?Fr.Clear:Fr.Load,depthStoreOp:Lr.Store,stencilClearValue:d._depthStencilTextureWithStencil&&S?this._clearStencilValue:void 0,stencilLoadOp:y?d._depthStencilTextureWithStencil&&S?Fr.Clear:Fr.Load:void 0,stencilStoreOp:y?Lr.Store:void 0}:void 0,occlusionQuerySet:(null===(c=this._occlusionQuery)||void 0===c?void 0:c.hasQueries)?this._occlusionQuery.querySet:void 0},this._rttRenderPassWrapper.renderPass=this._renderTargetEncoder.beginRenderPass(this._rttRenderPassWrapper.renderPassDescriptor),this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),!this._count||this._count<this.dbgVerboseLogsNumFrames)){const e=d.texture;console.log("frame #"+this._count+" - render target begin pass - internalTexture.uniqueId=",e.uniqueId,"width=",e.width,"height=",e.height,this._rttRenderPassWrapper.renderPassDescriptor)}this._currentRenderPass=this._rttRenderPassWrapper.renderPass,null===(u=this._debugFlushPendingCommands)||void 0===u||u.call(this),this._resetCurrentViewport(1),this._resetCurrentScissor(1),this._resetCurrentStencilRef(1),this._resetCurrentColorBlend(1),f&&no.HasStencilAspect(f.format)||(this._stencilStateComposer.enabled=!1)}_endRenderTargetRenderPass(){var e,t,i,n;if(this._currentRenderPass){const s=null===(e=this._currentRenderTarget.texture)||void 0===e?void 0:e._hardwareTexture;!s||this._snapshotRendering.endRenderTargetPass(this._currentRenderPass,s)||this.compatibilityMode||(this._bundleListRenderTarget.run(this._currentRenderPass),this._bundleListRenderTarget.reset()),this._currentRenderPass.end(),this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - render target end pass - internalTexture.uniqueId=",null===(i=null===(t=this._currentRenderTarget)||void 0===t?void 0:t.texture)||void 0===i?void 0:i.uniqueId)),null===(n=this._debugPopGroup)||void 0===n||n.call(this,1),this._resetCurrentViewport(1),this._viewport(0,0,0,0),this._resetCurrentScissor(1),this._resetCurrentStencilRef(1),this._resetCurrentColorBlend(1),this._currentRenderPass=null,this._rttRenderPassWrapper.reset()}}_getCurrentRenderPass(){return this._currentRenderTarget&&!this._currentRenderPass?this._startRenderTargetRenderPass(this._currentRenderTarget,!1,null,!1,!1):this._currentRenderPass||this._startMainRenderPass(!1),this._currentRenderPass}_getCurrentRenderPassIndex(){return null===this._currentRenderPass?-1:this._currentRenderPass===this._mainRenderPassWrapper.renderPass?0:1}_startMainRenderPass(e,t,i,n){var s,r,o;this._mainRenderPassWrapper.renderPass&&this.flushFramebuffer(!1),this.useReverseDepthBuffer&&this.setDepthFunctionToGreaterOrEqual();const a=e&&t,l=e&&i,h=e&&n;this._mainRenderPassWrapper.renderPassDescriptor.colorAttachments[0].clearValue=a?t:void 0,this._mainRenderPassWrapper.renderPassDescriptor.colorAttachments[0].loadOp=a?Fr.Clear:Fr.Load,this._mainRenderPassWrapper.renderPassDescriptor.depthStencilAttachment.depthClearValue=l?this.useReverseDepthBuffer?this._clearReverseDepthValue:this._clearDepthValue:void 0,this._mainRenderPassWrapper.renderPassDescriptor.depthStencilAttachment.depthLoadOp=l?Fr.Clear:Fr.Load,this._mainRenderPassWrapper.renderPassDescriptor.depthStencilAttachment.stencilClearValue=h?this._clearStencilValue:void 0,this._mainRenderPassWrapper.renderPassDescriptor.depthStencilAttachment.stencilLoadOp=this.isStencilEnable?h?Fr.Clear:Fr.Load:void 0,this._mainRenderPassWrapper.renderPassDescriptor.occlusionQuerySet=(null===(s=this._occlusionQuery)||void 0===s?void 0:s.hasQueries)?this._occlusionQuery.querySet:void 0;const c=this._context.getCurrentTexture();this._mainRenderPassWrapper.colorAttachmentGPUTextures[0].set(c),this._options.antialias?(Wo.format=c.format,this._mainRenderPassWrapper.renderPassDescriptor.colorAttachments[0].resolveTarget=c.createView(Wo)):(Ho.format=c.format,this._mainRenderPassWrapper.renderPassDescriptor.colorAttachments[0].view=c.createView(Ho)),this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - main begin pass - texture width="+this._mainTextureExtends.width," height="+this._mainTextureExtends.height,this._mainRenderPassWrapper.renderPassDescriptor)),null===(r=this._debugPushGroup)||void 0===r||r.call(this,"main pass",0),this._currentRenderPass=this._renderEncoder.beginRenderPass(this._mainRenderPassWrapper.renderPassDescriptor),this._mainRenderPassWrapper.renderPass=this._currentRenderPass,null===(o=this._debugFlushPendingCommands)||void 0===o||o.call(this),this._resetCurrentViewport(0),this._resetCurrentScissor(0),this._resetCurrentStencilRef(0),this._resetCurrentColorBlend(0),this._isStencilEnable||(this._stencilStateComposer.enabled=!1)}_endMainRenderPass(){var e;null!==this._mainRenderPassWrapper.renderPass&&(this._snapshotRendering.endMainRenderPass(),this.compatibilityMode||this._snapshotRendering.play||(this._bundleList.run(this._mainRenderPassWrapper.renderPass),this._bundleList.reset()),this._mainRenderPassWrapper.renderPass.end(),this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - main end pass")),null===(e=this._debugPopGroup)||void 0===e||e.call(this,0),this._resetCurrentViewport(0),this._resetCurrentScissor(0),this._resetCurrentStencilRef(0),this._resetCurrentColorBlend(0),this._mainRenderPassWrapper.renderPass===this._currentRenderPass&&(this._currentRenderPass=null),this._mainRenderPassWrapper.reset(!1))}bindFramebuffer(e,t=0,i,n,s,r=0,o=0){var a,l;const h=null===(a=e.texture)||void 0===a?void 0:a._hardwareTexture;this._currentRenderTarget&&this.unBindFramebuffer(this._currentRenderTarget),this._currentRenderTarget=e,h&&(h._currentLayer=e.isCube?6*o+t:o),this._rttRenderPassWrapper.colorAttachmentGPUTextures[0]=h,this._rttRenderPassWrapper.depthTextureFormat=this._currentRenderTarget._depthStencilTexture?no.GetWebGPUTextureFormat(-1,this._currentRenderTarget._depthStencilTexture.format):void 0,this._setDepthTextureFormat(this._rttRenderPassWrapper),this._setColorFormat(this._rttRenderPassWrapper),this._rttRenderPassWrapper.colorAttachmentViewDescriptor={format:this._colorFormat,dimension:lr.E2d,mipLevelCount:1,baseArrayLayer:e.isCube?6*o+t:o,baseMipLevel:r,arrayLayerCount:1,aspect:hr.All},this._rttRenderPassWrapper.depthAttachmentViewDescriptor={format:this._depthTextureFormat,dimension:lr.E2d,mipLevelCount:1,baseArrayLayer:e.isCube?6*o+t:o,baseMipLevel:0,arrayLayerCount:1,aspect:hr.All},this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - bindFramebuffer called - internalTexture.uniqueId=",null===(l=e.texture)||void 0===l?void 0:l.uniqueId,"face=",t,"lodLevel=",r,"layer=",o,this._rttRenderPassWrapper.colorAttachmentViewDescriptor,this._rttRenderPassWrapper.depthAttachmentViewDescriptor)),this._currentRenderPass=null,this.snapshotRendering&&1===this.snapshotRenderingMode&&this._getCurrentRenderPass(),this._cachedViewport&&!s?this.setViewport(this._cachedViewport,i,n):(i||(i=e.width,r&&(i/=Math.pow(2,r))),n||(n=e.height,r&&(n/=Math.pow(2,r))),this._viewport(0,0,i,n)),this.wipeCaches()}unBindFramebuffer(e,t=!1,i){var n,s;const r=this._currentRenderTarget;this._currentRenderTarget=null,i&&i(),this._currentRenderTarget=r,this._currentRenderPass&&this._currentRenderPass!==this._mainRenderPassWrapper.renderPass&&this._endRenderTargetRenderPass(),!(null===(n=e.texture)||void 0===n?void 0:n.generateMipMaps)||t||e.isCube||this._generateMipmaps(e.texture),this._currentRenderTarget=null,this._onAfterUnbindFrameBufferObservable.notifyObservers(this),this.dbgVerboseLogsForFirstFrames&&(void 0===this._count&&(this._count=0),(!this._count||this._count<this.dbgVerboseLogsNumFrames)&&console.log("frame #"+this._count+" - unBindFramebuffer called - internalTexture.uniqueId=",null===(s=e.texture)||void 0===s?void 0:s.uniqueId)),this._mrtAttachments=[],this._cacheRenderPipeline.setMRT([]),this._cacheRenderPipeline.setMRTAttachments(this._mrtAttachments),this._currentRenderPass=this._mainRenderPassWrapper.renderPass,this._setDepthTextureFormat(this._mainRenderPassWrapper),this._setColorFormat(this._mainRenderPassWrapper)}restoreDefaultFramebuffer(){this._currentRenderTarget?this.unBindFramebuffer(this._currentRenderTarget):(this._currentRenderPass=this._mainRenderPassWrapper.renderPass,this._setDepthTextureFormat(this._mainRenderPassWrapper),this._setColorFormat(this._mainRenderPassWrapper)),this._currentRenderPass&&this._cachedViewport&&this.setViewport(this._cachedViewport),this.wipeCaches()}_setColorFormat(e){var t,i;const n=null!==(i=null===(t=e.colorAttachmentGPUTextures[0])||void 0===t?void 0:t.format)&&void 0!==i?i:null;this._cacheRenderPipeline.setColorFormat(n),this._colorFormat!==n&&(this._colorFormat=n)}_setDepthTextureFormat(e){this._cacheRenderPipeline.setDepthStencilFormat(e.depthTextureFormat),this._depthTextureFormat!==e.depthTextureFormat&&(this._depthTextureFormat=e.depthTextureFormat)}setDitheringState(){}setRasterizerState(){}setState(e,t=0,i,n=!1,s,r,o=0){var a,l;(this._depthCullingState.cull!==e||i)&&(this._depthCullingState.cull=e);const h=null===(l=null!==(a=this.cullBackFaces)&&void 0!==a?a:s)||void 0===l||l?1:2;(this._depthCullingState.cullFace!==h||i)&&(this._depthCullingState.cullFace=h),this.setZOffset(t),this.setZOffsetUnits(o);const c=n?this._currentRenderTarget?1:2:this._currentRenderTarget?2:1;(this._depthCullingState.frontFace!==c||i)&&(this._depthCullingState.frontFace=c),this._stencilStateComposer.stencilMaterial=r}_applyRenderPassChanges(e,t){var i;const n=this._mustUpdateViewport(e),s=this._mustUpdateScissor(e),r=!!this._stencilStateComposer.enabled&&this._mustUpdateStencilRef(e),o=!!this._alphaState.alphaBlend&&this._mustUpdateBlendColor(e);t?(n&&t.addItem(new Mo(this._viewportCached.x,this._viewportCached.y,this._viewportCached.z,this._viewportCached.w)),s&&t.addItem(new Io(this._scissorCached.x,this._scissorCached.y,this._scissorCached.z,this._scissorCached.w)),r&&t.addItem(new Do(null!==(i=this._stencilStateComposer.funcRef)&&void 0!==i?i:0)),o&&t.addItem(new Oo(this._alphaState._blendConstants.slice()))):(n&&this._applyViewport(e),s&&this._applyScissor(e),r&&this._applyStencilRef(e),o&&this._applyBlendColor(e))}_draw(e,t,i,n,s){var r;const o=this._getCurrentRenderPass(),a=0===this._getCurrentRenderPassIndex()?this._bundleList:this._bundleListRenderTarget;this.applyStates();const l=this._currentEffect._pipelineContext;if(this.bindUniformBufferBase(this._currentRenderTarget?this._ubInvertY:this._ubDontInvertY,0,zr.InternalsUBOName),l.uniformBuffer&&(l.uniformBuffer.update(),this.bindUniformBufferBase(l.uniformBuffer.getBuffer(),0,zr.LeftOvertUBOName)),this._snapshotRendering.play)return void this._reportDrawCall();!this.compatibilityMode&&(this._currentDrawContext.isDirty(this._currentMaterialContext.updateId)||this._currentMaterialContext.isDirty||this._currentMaterialContext.forceBindGroupCreation)&&(this._currentDrawContext.fastBundle=void 0);let h=o;if(!this.compatibilityMode&&this._currentDrawContext.fastBundle||this._snapshotRendering.record){if(this._applyRenderPassChanges(o,a),!this._snapshotRendering.record)return this._counters.numBundleReuseNonCompatMode++,this._currentDrawContext.indirectDrawBuffer&&this._currentDrawContext.setIndirectData(n,s||1,i),a.addBundle(this._currentDrawContext.fastBundle),void this._reportDrawCall();h=a.getBundleEncoder(this._cacheRenderPipeline.colorFormats,this._depthTextureFormat,this.currentSampleCount),a.numDrawCalls++}let c=0;if(!this._caps.textureFloatLinearFiltering&&this._currentMaterialContext.hasFloatTextures){let e=1;for(let t=0;t<l.shaderProcessingContext.textureNames.length;++t){const i=l.shaderProcessingContext.textureNames[t],n=null===(r=this._currentMaterialContext.textures[i])||void 0===r?void 0:r.texture;1===(null==n?void 0:n.type)&&(c|=e),e<<=1}}const u=this._cacheRenderPipeline.getRenderPipeline(t,this._currentEffect,this.currentSampleCount,c),d=this._cacheBindGroups.getBindGroups(l,this._currentDrawContext,this._currentMaterialContext);this._snapshotRendering.record||(this._applyRenderPassChanges(o,this.compatibilityMode?null:a),this.compatibilityMode||(this._counters.numBundleCreationNonCompatMode++,h=this._device.createRenderBundleEncoder({colorFormats:this._cacheRenderPipeline.colorFormats,depthStencilFormat:this._depthTextureFormat,sampleCount:this.currentSampleCount}))),h.setPipeline(u),this._currentIndexBuffer&&h.setIndexBuffer(this._currentIndexBuffer.underlyingResource,this._currentIndexBuffer.is32Bits?Ir.Uint32:Ir.Uint16,0);const p=this._cacheRenderPipeline.vertexBuffers;for(let e=0;e<p.length;e++){const t=p[e],i=t.getBuffer();i&&h.setVertexBuffer(e,i.underlyingResource,t._validOffsetRange?0:t.byteOffset)}for(let e=0;e<d.length;e++)h.setBindGroup(e,d[e]);const f=!this.compatibilityMode&&!this._snapshotRendering.record;f&&this._currentDrawContext.indirectDrawBuffer?(this._currentDrawContext.setIndirectData(n,s||1,i),0===e?h.drawIndexedIndirect(this._currentDrawContext.indirectDrawBuffer,0):h.drawIndirect(this._currentDrawContext.indirectDrawBuffer,0)):0===e?h.drawIndexed(n,s||1,i,0,0):h.draw(n,s||1,i,0),f&&(this._currentDrawContext.fastBundle=h.finish(),a.addBundle(this._currentDrawContext.fastBundle)),this._reportDrawCall()}drawElementsType(e,t,i,n=1){this._draw(0,e,t,i,n)}drawArraysType(e,t,i,n=1){this._currentIndexBuffer=null,this._draw(1,e,t,i,n)}dispose(){var e,t;this._isDisposed=!0,null===(e=this._mainTexture)||void 0===e||e.destroy(),null===(t=this._depthTexture)||void 0===t||t.destroy(),this._device.destroy(),super.dispose()}getRenderWidth(e=!1){var t,i;return!e&&this._currentRenderTarget?this._currentRenderTarget.width:null!==(i=null===(t=this._renderingCanvas)||void 0===t?void 0:t.width)&&void 0!==i?i:0}getRenderHeight(e=!1){var t,i;return!e&&this._currentRenderTarget?this._currentRenderTarget.height:null!==(i=null===(t=this._renderingCanvas)||void 0===t?void 0:t.height)&&void 0!==i?i:0}getError(){return 0}bindSamplers(){}_bindTextureDirectly(){return!1}areAllEffectsReady(){return!0}_executeWhenRenderingStateIsCompiled(e,t){t()}_isRenderingStateCompiled(){return!0}_getUnpackAlignement(){return 1}_unpackFlipY(){}_bindUnboundFramebuffer(){throw"_bindUnboundFramebuffer is not implementedin WebGPU! You probably want to use restoreDefaultFramebuffer or unBindFramebuffer instead"}_getSamplingParameters(){throw"_getSamplingParameters is not available in WebGPU"}getUniforms(){return[]}setIntArray(){return!1}setIntArray2(){return!1}setIntArray3(){return!1}setIntArray4(){return!1}setArray(){return!1}setArray2(){return!1}setArray3(){return!1}setArray4(){return!1}setMatrices(){return!1}setMatrix3x3(){return!1}setMatrix2x2(){return!1}setFloat(){return!1}setFloat2(){return!1}setFloat3(){return!1}setFloat4(){return!1}}jo._GLSLslangDefaultOptions={jsPath:"https://preview.babylonjs.com/glslang/glslang.js",wasmPath:"https://preview.babylonjs.com/glslang/glslang.wasm"},jo.UseTWGSL=!0,jo.prototype.setAlphaMode=function(e,t=!1){if(this._alphaMode===e&&(0===e&&!this._alphaState.alphaBlend||0!==e&&this._alphaState.alphaBlend)){if(!t){const t=0===e;this.depthCullingState.depthMask!==t&&(this.setDepthWrite(t),this._cacheRenderPipeline.setDepthWriteEnabled(t))}}else{switch(e){case 0:this._alphaState.alphaBlend=!1;break;case 7:this._alphaState.setAlphaBlendFunctionParameters(1,771,1,1),this._alphaState.alphaBlend=!0;break;case 8:case 14:this._alphaState.setAlphaBlendFunctionParameters(1,771,1,771),this._alphaState.alphaBlend=!0;break;case 2:this._alphaState.setAlphaBlendFunctionParameters(770,771,1,1),this._alphaState.alphaBlend=!0;break;case 6:this._alphaState.setAlphaBlendFunctionParameters(1,1,0,1),this._alphaState.alphaBlend=!0;break;case 1:this._alphaState.setAlphaBlendFunctionParameters(770,1,0,1),this._alphaState.alphaBlend=!0;break;case 3:this._alphaState.setAlphaBlendFunctionParameters(0,769,1,1),this._alphaState.alphaBlend=!0;break;case 4:this._alphaState.setAlphaBlendFunctionParameters(774,0,1,1),this._alphaState.alphaBlend=!0;break;case 5:this._alphaState.setAlphaBlendFunctionParameters(770,769,1,1),this._alphaState.alphaBlend=!0;break;case 9:this._alphaState.setAlphaBlendFunctionParameters(32769,32770,32771,32772),this._alphaState.alphaBlend=!0;break;case 10:this._alphaState.setAlphaBlendFunctionParameters(1,769,1,771),this._alphaState.alphaBlend=!0;break;case 11:this._alphaState.setAlphaBlendFunctionParameters(1,1,1,1),this._alphaState.alphaBlend=!0;break;case 12:this._alphaState.setAlphaBlendFunctionParameters(772,1,0,0),this._alphaState.alphaBlend=!0;break;case 13:this._alphaState.setAlphaBlendFunctionParameters(775,769,773,771),this._alphaState.alphaBlend=!0;break;case 15:this._alphaState.setAlphaBlendFunctionParameters(1,1,1,0),this._alphaState.alphaBlend=!0;break;case 16:this._alphaState.setAlphaBlendFunctionParameters(775,769,0,1),this._alphaState.alphaBlend=!0;break;case 17:this._alphaState.setAlphaBlendFunctionParameters(770,771,1,771),this._alphaState.alphaBlend=!0}t||(this.setDepthWrite(e===ue.D.ALPHA_DISABLE),this._cacheRenderPipeline.setDepthWriteEnabled(e===ue.D.ALPHA_DISABLE)),this._alphaMode=e,this._cacheRenderPipeline.setAlphaBlendEnabled(this._alphaState.alphaBlend),this._cacheRenderPipeline.setAlphaBlendFactors(this._alphaState._blendFunctionParameters,this._alphaState._blendEquationParameters)}},jo.prototype.setAlphaEquation=function(e){ue.D.prototype.setAlphaEquation.call(this,e),this._cacheRenderPipeline.setAlphaBlendFactors(this._alphaState._blendFunctionParameters,this._alphaState._blendEquationParameters)};class Yo{getBindGroups(e,t,i){if(!i)throw new Error("WebGPUComputeContext.getBindGroups: bindingsMapping is required until browsers support reflection for wgsl shaders!");if(0===this._bindGroups.length){const n=this._bindGroupEntries.length>0;for(const t in e){const s=e[t],r=i[t],o=r.group,a=r.binding,l=s.type,h=s.object;let c=s.indexInGroupEntries,u=this._bindGroupEntries[o];switch(u||(u=this._bindGroupEntries[o]=[]),l){case Pn.Sampler:{const e=h;void 0!==c&&n?u[c].resource=this._cacheSampler.getSampler(e):(s.indexInGroupEntries=u.length,u.push({binding:a,resource:this._cacheSampler.getSampler(e)}));break}case Pn.Texture:case Pn.TextureWithoutSampler:{const e=h,t=e._texture._hardwareTexture;void 0!==c&&n?(l===Pn.Texture&&(u[c++].resource=this._cacheSampler.getSampler(e._texture)),u[c].resource=t.view):(s.indexInGroupEntries=u.length,l===Pn.Texture&&u.push({binding:a-1,resource:this._cacheSampler.getSampler(e._texture)}),u.push({binding:a,resource:t.view}));break}case Pn.StorageTexture:{const e=h,t=e._texture._hardwareTexture;0==(t.textureAdditionalUsages&ar.StorageBinding)&&_.Y.Error(`computeDispatch: The texture (name=${e.name}, uniqueId=${e.uniqueId}) is not a storage texture!`,50),void 0!==c&&n?u[c].resource=t.viewForWriting:(s.indexInGroupEntries=u.length,u.push({binding:a,resource:t.viewForWriting}));break}case Pn.UniformBuffer:case Pn.StorageBuffer:{const e=(Pn.UniformBuffer,h).getBuffer(),t=e.underlyingResource;void 0!==c&&n?(u[c].resource.buffer=t,u[c].resource.size=e.capacity):(s.indexInGroupEntries=u.length,u.push({binding:a,resource:{buffer:t,offset:0,size:e.capacity}}));break}}}for(let e=0;e<this._bindGroupEntries.length;++e){const i=this._bindGroupEntries[e];this._bindGroups[e]=i?this._device.createBindGroup({layout:t.getBindGroupLayout(e),entries:i}):void 0}this._bindGroups.length=this._bindGroupEntries.length}return this._bindGroups}constructor(e,t){this._device=e,this._cacheSampler=t,this.uniqueId=Yo._Counter++,this._bindGroupEntries=[],this.clear()}clear(){this._bindGroups=[]}}Yo._Counter=0;class qo{get isAsync(){return!1}get isReady(){return!!this.stage}constructor(e){this._name="unnamed",this.engine=e}_getComputeShaderCode(){var e;return null===(e=this.sources)||void 0===e?void 0:e.compute}dispose(){}}jo.prototype.createComputeContext=function(){return new Yo(this._device,this._cacheSampler)},jo.prototype.createComputeEffect=function(e,t){const i=(e.computeElement||e.compute||e.computeToken||e.computeSource||e)+"@"+t.defines;if(this._compiledComputeEffects[i]){const e=this._compiledComputeEffects[i];return t.onCompiled&&e.isReady()&&t.onCompiled(e),e}const n=new An(e,t,this,i);return this._compiledComputeEffects[i]=n,n},jo.prototype.createComputePipelineContext=function(){return new qo(this)},jo.prototype.areAllComputeEffectsReady=function(){for(const e in this._compiledComputeEffects)if(!this._compiledComputeEffects[e].isReady())return!1;return!0},jo.prototype.computeDispatch=function(e,t,i,n,s,r,o){if(this._currentRenderTarget)return void this._onAfterUnbindFrameBufferObservable.addOnce((()=>{this.computeDispatch(e,t,i,n,s,r,o)}));const a=e._pipelineContext,l=t;a.computePipeline||(a.computePipeline=this._device.createComputePipeline({layout:Tr.Auto,compute:a.stage}));const h=this._renderTargetEncoder.beginComputePass();h.setPipeline(a.computePipeline);const c=l.getBindGroups(i,a.computePipeline,o);for(let e=0;e<c.length;++e){const t=c[e];t&&h.setBindGroup(e,t)}h.dispatchWorkgroups(n,s,r),h.end()},jo.prototype.releaseComputeEffects=function(){for(const e in this._compiledComputeEffects){const t=this._compiledComputeEffects[e].getPipelineContext();this._deleteComputePipelineContext(t)}this._compiledComputeEffects={}},jo.prototype._prepareComputePipelineContext=function(e,t,i,n,s){const r=e;this.dbgShowShaderCode&&(console.log(n),console.log(t)),r.sources={compute:t,rawCompute:i},r.stage=this._createComputePipelineStageDescriptor(t,n,s)},jo.prototype._releaseComputeEffect=function(e){this._compiledComputeEffects[e._key]&&(delete this._compiledComputeEffects[e._key],this._deleteComputePipelineContext(e.getPipelineContext()))},jo.prototype._rebuildComputeEffects=function(){for(const e in this._compiledComputeEffects){const t=this._compiledComputeEffects[e];t._pipelineContext=null,t._wasPreviouslyReady=!1,t._prepareEffect()}},jo.prototype._deleteComputePipelineContext=function(e){e&&e.dispose()},jo.prototype._createComputePipelineStageDescriptor=function(e,t,i){return t=t?"//"+t.split("\n").join("\n//")+"\n":"",{module:this._device.createShaderModule({code:t+e}),entryPoint:i}},jo.prototype._createDepthStencilCubeTexture=function(e,t){const i=new Ei.l(this,Ei.S.DepthStencil);i.isCube=!0;const n={bilinearFiltering:!1,comparisonFunction:0,generateStencil:!1,samples:1,...t};return i.format=n.generateStencil?13:14,this._setupDepthStencilTexture(i,e,n.generateStencil,n.bilinearFiltering,n.comparisonFunction,n.samples),this._textureHelper.createGPUTextureForInternalTexture(i),this._internalTexturesCache.push(i),i},jo.prototype.createCubeTexture=function(e,t,i,n,s=null,r=null,o,a=null,l=!1,h=0,c=0,u=null,d=!1){return this.createCubeTextureBase(e,t,i,!!n,s,r,o,a,l,h,c,u,null,((e,t)=>{const i=t,r=i[0].width,a=r;this._setCubeMapTextureParams(e,!n),e.format=null!=o?o:-1;const l=this._textureHelper.createGPUTextureForInternalTexture(e,r,a);this._textureHelper.updateCubeTextures(i,l.underlyingResource,r,a,l.format,!1,!1,0,0),n||this._generateMipmaps(e,this._uploadEncoder),e.isReady=!0,e.onLoadedObservable.notifyObservers(e),e.onLoadedObservable.clear(),s&&s()}),!!d)},jo.prototype._setCubeMapTextureParams=function(e,t,i){e.samplingMode=t?3:2,e._cachedWrapU=0,e._cachedWrapV=0,i&&(e._maxLodLevel=i)},jo.prototype._debugPushGroup=function(e,t){this._options.enableGPUDebugMarkers&&(0===t||1===t?(0===t?this._renderEncoder:this._renderTargetEncoder).pushDebugGroup(e):this._currentRenderPass?this._currentRenderPass.pushDebugGroup(e):this._pendingDebugCommands.push(["push",e]))},jo.prototype._debugPopGroup=function(e){this._options.enableGPUDebugMarkers&&(0===e||1===e?(0===e?this._renderEncoder:this._renderTargetEncoder).popDebugGroup():this._currentRenderPass?this._currentRenderPass.popDebugGroup():this._pendingDebugCommands.push(["pop",null]))},jo.prototype._debugInsertMarker=function(e,t){this._options.enableGPUDebugMarkers&&(0===t||1===t?(0===t?this._renderEncoder:this._renderTargetEncoder).insertDebugMarker(e):this._currentRenderPass?this._currentRenderPass.insertDebugMarker(e):this._pendingDebugCommands.push(["insert",e]))},jo.prototype._debugFlushPendingCommands=function(){for(let e=0;e<this._pendingDebugCommands.length;++e){const[t,i]=this._pendingDebugCommands[e];switch(t){case"push":this._debugPushGroup(i);break;case"pop":this._debugPopGroup();break;case"insert":this._debugInsertMarker(i)}}this._pendingDebugCommands.length=0},jo.prototype.updateDynamicIndexBuffer=function(e,t,i=0){const n=e;let s;s=e.is32Bits?t instanceof Uint32Array?t:new Uint32Array(t):t instanceof Uint16Array?t:new Uint16Array(t),this._bufferManager.setSubData(n,i,s)},jo.prototype.updateDynamicVertexBuffer=function(e,t,i,n){const s=e;let r;void 0===i&&(i=0),void 0===n?(r=t instanceof Array?new Float32Array(t):t instanceof ArrayBuffer?new Uint8Array(t):t,n=r.byteLength):r=t instanceof Array?new Float32Array(t):t instanceof ArrayBuffer?new Uint8Array(t):t,this._bufferManager.setSubData(s,i,r,0,n)},jo.prototype.updateDynamicTexture=function(e,t,i,n=!1,s,r,o){var a;if(!e)return;const l=t.width,h=t.height;let c=e._hardwareTexture;(null===(a=e._hardwareTexture)||void 0===a?void 0:a.underlyingResource)||(c=this._textureHelper.createGPUTextureForInternalTexture(e,l,h)),this._textureHelper.updateTexture(t,e,l,h,e.depth,c.format,0,0,i,n,0,0,o),e.generateMipMaps&&this._generateMipmaps(e,this._uploadEncoder),e.isReady=!0};class Ko extends So{constructor(e){super(e)}}function $o(e,t,i,n){let s,r=1;1===n?s=new Float32Array(t*i*4):2===n?(s=new Uint16Array(t*i*4),r=15360):s=7===n?new Uint32Array(t*i*4):new Uint8Array(t*i*4);for(let n=0;n<t;n++)for(let o=0;o<i;o++){const i=3*(o*t+n),a=4*(o*t+n);s[a+0]=e[i+0],s[a+1]=e[i+1],s[a+2]=e[i+2],s[a+3]=r}return s}ds.Q.prototype.setExternalTexture=function(e,t){this._engine.setExternalTexture(e,t)},jo.prototype.createExternalTexture=function(e){return new Ko(e)},jo.prototype.setExternalTexture=function(e,t){t?this._setInternalTexture(e,t):this._currentMaterialContext.setTexture(e,null)},jo.prototype.unBindMultiColorAttachmentFramebuffer=function(e,t=!1,i){i&&i();const n=e._attachments.length;this._currentRenderPass&&this._currentRenderPass!==this._mainRenderPassWrapper.renderPass&&this._endRenderTargetRenderPass();for(let i=0;i<n;i++){const n=e.textures[i];!n.generateMipMaps||t||n.isCube||this._generateMipmaps(n)}this._currentRenderTarget=null,this._mrtAttachments=[],this._cacheRenderPipeline.setMRT([]),this._cacheRenderPipeline.setMRTAttachments(this._mrtAttachments),this._currentRenderPass=this._mainRenderPassWrapper.renderPass,this._setDepthTextureFormat(this._mainRenderPassWrapper),this._setColorFormat(this._mainRenderPassWrapper)},jo.prototype.createMultipleRenderTarget=function(e,t,i){var n,s;let r=!1,o=!0,a=!1,l=!1,h=15,c=1,u=new Array,d=new Array,p=new Array,f=new Array,m=new Array,g=new Array,v=new Array,y=new Array;const x=this._createHardwareRenderTargetWrapper(!0,!1,e);void 0!==t&&(r=void 0!==t.generateMipMaps&&t.generateMipMaps,o=void 0===t.generateDepthBuffer||t.generateDepthBuffer,a=void 0!==t.generateStencilBuffer&&t.generateStencilBuffer,l=void 0!==t.generateDepthTexture&&t.generateDepthTexture,c=t.textureCount||1,h=null!==(n=t.depthTextureFormat)&&void 0!==n?n:15,t.types&&(u=t.types),t.samplingModes&&(d=t.samplingModes),t.useSRGBBuffers&&(p=t.useSRGBBuffers),t.formats&&(f=t.formats),t.targetTypes&&(m=t.targetTypes),t.faceIndex&&(g=t.faceIndex),t.layerIndex&&(v=t.layerIndex),t.layerCounts&&(y=t.layerCounts));const b=e.width||e,T=e.height||e;let S=null;(o||a||l)&&(l||(h=o&&a?13:o?14:19),S=x.createDepthStencilTexture(0,!1,a,1,h));const E=[],C=[],A=[];x._generateDepthBuffer=o,x._generateStencilBuffer=a,x._attachments=C,x._defaultAttachments=A;for(let e=0;e<c;e++){let t=d[e]||3,n=u[e]||0;const o=f[e]||5,a=!!p[e]&&this._caps.supportSRGBBuffers,l=m[e]||3553,h=null!==(s=y[e])&&void 0!==s?s:1;if((1!==n||this._caps.textureFloatLinearFiltering)&&(2!==n||this._caps.textureHalfFloatLinearFiltering)||(t=1),1!==n||this._caps.textureFloat||(n=0,_.Y.Warn("Float textures are not supported. Render target forced to TEXTURETYPE_UNSIGNED_BYTE type")),C.push(e+1),A.push(i?e+1:0===e?1:0),-1===l)continue;const c=new Ei.l(this,Ei.S.MultiRenderTarget);switch(E[e]=c,l){case 34067:c.isCube=!0;break;case 32879:c.is3D=!0,c.baseDepth=c.depth=h;break;case 35866:c.is2DArray=!0,c.baseDepth=c.depth=h}c.baseWidth=b,c.baseHeight=T,c.width=b,c.height=T,c.isReady=!0,c.samples=1,c.generateMipMaps=r,c.samplingMode=t,c.type=n,c._cachedWrapU=0,c._cachedWrapV=0,c._useSRGBBuffer=a,c.format=o,this._internalTexturesCache.push(c),this._textureHelper.createGPUTextureForInternalTexture(c)}return S&&(S.incrementReferences(),E[c]=S,this._internalTexturesCache.push(S)),x.setTextures(E),x.setLayerAndFaceIndices(v,g),x},jo.prototype.updateMultipleRenderTargetTextureSampleCount=function(e,t){if(!e||!e.textures||e.textures[0].samples===t)return t;const i=e.textures.length;if(0===i)return 1;t=Math.min(t,this.getCaps().maxMSAASamples);for(let t=0;t<i;++t){const i=e.textures[t]._hardwareTexture;null==i||i.releaseMSAATexture()}const n=e._depthStencilTexture===e.textures[i-1];for(let s=0;s<i;++s){const r=e.textures[s];this._textureHelper.createMSAATexture(r,t,!1,s===i-1&&n?0:s),r.samples=t}return e._depthStencilTexture&&!n&&(this._textureHelper.createMSAATexture(e._depthStencilTexture,t),e._depthStencilTexture.samples=t),t},jo.prototype.bindAttachments=function(e){0!==e.length&&this._currentRenderTarget&&(this._mrtAttachments=e,this._currentRenderPass&&this._cacheRenderPipeline.setMRTAttachments(e))},jo.prototype.buildTextureLayout=function(e){const t=[];for(let i=0;i<e.length;i++)e[i]?t.push(i+1):t.push(0);return t},jo.prototype.restoreSingleAttachment=function(){},jo.prototype.restoreSingleAttachmentForRenderTarget=function(){},jo.prototype.getGPUFrameTimeCounter=function(){return this._timestampQuery.gpuFrameTimeCounter},jo.prototype.captureGPUFrameTime=function(e){this._timestampQuery.enable=e&&!!this._caps.timerQuery},jo.prototype.createQuery=function(){return this._occlusionQuery.createQuery()},jo.prototype.deleteQuery=function(e){return this._occlusionQuery.deleteQuery(e),this},jo.prototype.isQueryResultAvailable=function(e){return this._occlusionQuery.isQueryResultAvailable(e)},jo.prototype.getQueryResult=function(e){return this._occlusionQuery.getQueryResult(e)},jo.prototype.beginOcclusionQuery=function(e,t){var i;return this.compatibilityMode?!!this._occlusionQuery.canBeginQuery&&(null===(i=this._currentRenderPass)||void 0===i||i.beginOcclusionQuery(t),!0):((0===this._getCurrentRenderPassIndex()?this._bundleList:this._bundleListRenderTarget).addItem(new wo(t)),!0)},jo.prototype.endOcclusionQuery=function(){var e;return this.compatibilityMode?null===(e=this._currentRenderPass)||void 0===e||e.endOcclusionQuery():(0===this._getCurrentRenderPassIndex()?this._bundleList:this._bundleListRenderTarget).addItem(new No),this},jo.prototype.createRawTexture=function(e,t,i,n,s,r,o,a=null,l=0,h=0,c=!1){const u=new Ei.l(this,Ei.S.Raw);return u.baseWidth=t,u.baseHeight=i,u.width=t,u.height=i,u.format=n,u.generateMipMaps=s,u.samplingMode=o,u.invertY=r,u._compression=a,u.type=l,u._useSRGBBuffer=c,this._doNotHandleContextLost||(u._bufferView=e),this._textureHelper.createGPUTextureForInternalTexture(u,t,i,void 0,h),this.updateRawTexture(u,e,n,r,a,l,c),this._internalTexturesCache.push(u),u},jo.prototype.updateRawTexture=function(e,t,i,n,s=null,r=0,o=!1){if(e){if(this._doNotHandleContextLost||(e._bufferView=t,e.invertY=n,e._compression=s,e._useSRGBBuffer=o),t){const s=e._hardwareTexture;4===i&&(t=$o(t,e.width,e.height,r));const o=new Uint8Array(t.buffer,t.byteOffset,t.byteLength);this._textureHelper.updateTexture(o,e,e.width,e.height,e.depth,s.format,0,0,n,!1,0,0),e.generateMipMaps&&this._generateMipmaps(e,this._uploadEncoder)}e.isReady=!0}},jo.prototype.createRawCubeTexture=function(e,t,i,n,s,r,o,a=null){const l=new Ei.l(this,Ei.S.CubeRaw);return 1!==n||this._caps.textureFloatLinearFiltering?2!==n||this._caps.textureHalfFloatLinearFiltering?1!==n||this._caps.textureFloatRender?2!==n||this._caps.colorBufferFloat||(s=!1,_.Y.Warn("Render to half float textures is not supported. Mipmap generation forced to false.")):(s=!1,_.Y.Warn("Render to float textures is not supported. Mipmap generation forced to false.")):(s=!1,o=1,_.Y.Warn("Half float texture filtering is not supported. Mipmap generation and sampling mode are forced to false and TEXTURE_NEAREST_SAMPLINGMODE, respectively.")):(s=!1,o=1,_.Y.Warn("Float texture filtering is not supported. Mipmap generation and sampling mode are forced to false and TEXTURE_NEAREST_SAMPLINGMODE, respectively.")),l.isCube=!0,l.format=4===i?5:i,l.type=n,l.generateMipMaps=s,l.width=t,l.height=t,l.samplingMode=o,this._doNotHandleContextLost||(l._bufferViewArray=e),l.invertY=r,l._compression=a,l._cachedWrapU=0,l._cachedWrapV=0,this._textureHelper.createGPUTextureForInternalTexture(l),e&&this.updateRawCubeTexture(l,e,i,n,r,a),l.isReady=!0,l},jo.prototype.updateRawCubeTexture=function(e,t,i,n,s,r=null){e._bufferViewArray=t,e.invertY=s,e._compression=r;const o=e._hardwareTexture,a=4===i,l=[];for(let i=0;i<t.length;++i){let s=t[i];a&&(s=$o(t[i],e.width,e.height,n)),l.push(new Uint8Array(s.buffer,s.byteOffset,s.byteLength))}this._textureHelper.updateCubeTextures(l,o.underlyingResource,e.width,e.height,o.format,s,!1,0,0),e.generateMipMaps&&this._generateMipmaps(e,this._uploadEncoder),e.isReady=!0},jo.prototype.createRawCubeTextureFromUrl=function(e,t,i,n,s,r,o,a,l=null,h=null,c=3,u=!1){const d=this.createRawCubeTexture(null,i,n,s,!r,u,c,null);null==t||t.addPendingData(d),d.url=e,this._internalTexturesCache.push(d);const p=e=>{const i=d.width,r=o(e);if(!r)return;const h=[0,2,4,1,3,5];if(a){const e=4===n,t=a(r),o=d._hardwareTexture,l=[0,1,2,3,4,5];for(let n=0;n<t.length;n++){const r=i>>n,a=[];for(let i=0;i<6;i++){let o=t[n][l[i]];e&&(o=$o(o,r,r,s)),a.push(new Uint8Array(o.buffer,o.byteOffset,o.byteLength))}this._textureHelper.updateCubeTextures(a,o.underlyingResource,r,r,o.format,u,!1,0,0)}}else{const e=[];for(let t=0;t<6;t++)e.push(r[h[t]]);this.updateRawCubeTexture(d,e,n,s,u)}d.isReady=!0,null==t||t.removePendingData(d),l&&l()};return this._loadFile(e,(e=>{p(e)}),void 0,null==t?void 0:t.offlineProvider,!0,((e,i)=>{null==t||t.removePendingData(d),h&&e&&h(e.status+" "+e.statusText,i)})),d},jo.prototype.createRawTexture3D=function(e,t,i,n,s,r,o,a,l=null,h=0,c=0){const u=Ei.S.Raw3D,d=new Ei.l(this,u);return d.baseWidth=t,d.baseHeight=i,d.baseDepth=n,d.width=t,d.height=i,d.depth=n,d.format=s,d.type=h,d.generateMipMaps=r,d.samplingMode=a,d.is3D=!0,this._doNotHandleContextLost||(d._bufferView=e),this._textureHelper.createGPUTextureForInternalTexture(d,t,i,void 0,c),this.updateRawTexture3D(d,e,s,o,l,h),this._internalTexturesCache.push(d),d},jo.prototype.updateRawTexture3D=function(e,t,i,n,s=null,r=0){if(this._doNotHandleContextLost||(e._bufferView=t,e.format=i,e.invertY=n,e._compression=s),t){const s=e._hardwareTexture;4===i&&(t=$o(t,e.width,e.height,r));const o=new Uint8Array(t.buffer,t.byteOffset,t.byteLength);this._textureHelper.updateTexture(o,e,e.width,e.height,e.depth,s.format,0,0,n,!1,0,0),e.generateMipMaps&&this._generateMipmaps(e,this._uploadEncoder)}e.isReady=!0},jo.prototype.createRawTexture2DArray=function(e,t,i,n,s,r,o,a,l=null,h=0,c=0){const u=Ei.S.Raw2DArray,d=new Ei.l(this,u);return d.baseWidth=t,d.baseHeight=i,d.baseDepth=n,d.width=t,d.height=i,d.depth=n,d.format=s,d.type=h,d.generateMipMaps=r,d.samplingMode=a,d.is2DArray=!0,this._doNotHandleContextLost||(d._bufferView=e),this._textureHelper.createGPUTextureForInternalTexture(d,t,i,n,c),this.updateRawTexture2DArray(d,e,s,o,l,h),this._internalTexturesCache.push(d),d},jo.prototype.updateRawTexture2DArray=function(e,t,i,n,s=null,r=0){if(this._doNotHandleContextLost||(e._bufferView=t,e.format=i,e.invertY=n,e._compression=s),t){const s=e._hardwareTexture;4===i&&(t=$o(t,e.width,e.height,r));const o=new Uint8Array(t.buffer,t.byteOffset,t.byteLength);this._textureHelper.updateTexture(o,e,e.width,e.height,e.depth,s.format,0,0,n,!1,0,0),e.generateMipMaps&&this._generateMipmaps(e,this._uploadEncoder)}e.isReady=!0},jo.prototype._readTexturePixels=function(e,t,i,n=-1,s=0,r=null,o=!0,a=!1,l=0,h=0){const c=e._hardwareTexture;return o&&this.flushFramebuffer(),this._textureHelper.readPixels(c.underlyingResource,l,h,t,i,c.format,n,s,r,a)},jo.prototype._readTexturePixelsSync=function(){throw"_readTexturePixelsSync is unsupported in WebGPU!"};class Qo extends Rs.r{}jo.prototype._createHardwareRenderTargetWrapper=function(e,t,i){const n=new Qo(e,t,i,this);return this._renderTargetWrapperCache.push(n),n},jo.prototype.createRenderTargetTexture=function(e,t){var i,n;const s=this._createHardwareRenderTargetWrapper(!1,!1,e),r={};void 0!==t&&"object"==typeof t?(r.generateMipMaps=t.generateMipMaps,r.generateDepthBuffer=void 0===t.generateDepthBuffer||t.generateDepthBuffer,r.generateStencilBuffer=r.generateDepthBuffer&&t.generateStencilBuffer,r.samplingMode=void 0===t.samplingMode?3:t.samplingMode,r.creationFlags=null!==(i=t.creationFlags)&&void 0!==i?i:0,r.noColorAttachment=!!t.noColorAttachment,r.samples=t.samples,r.label=t.label):(r.generateMipMaps=t,r.generateDepthBuffer=!0,r.generateStencilBuffer=!1,r.samplingMode=3,r.creationFlags=0,r.noColorAttachment=!1);const o=r.noColorAttachment?null:this._createInternalTexture(e,t,!0,Ei.S.RenderTarget);return s._samples=null!==(n=r.samples)&&void 0!==n?n:1,s._generateDepthBuffer=r.generateDepthBuffer,s._generateStencilBuffer=!!r.generateStencilBuffer,s.setTextures(o),(s._generateDepthBuffer||s._generateStencilBuffer)&&s.createDepthStencilTexture(0,this._caps.textureFloatLinearFiltering&&(void 0===r.samplingMode||2===r.samplingMode||2===r.samplingMode||3===r.samplingMode||3===r.samplingMode||5===r.samplingMode||6===r.samplingMode||7===r.samplingMode||11===r.samplingMode),s._generateStencilBuffer,s.samples,r.generateStencilBuffer?13:14,r.label?r.label+"-DepthStencil":void 0),o&&(void 0!==t&&"object"==typeof t&&t.createMipMaps&&!r.generateMipMaps&&(o.generateMipMaps=!0),this._textureHelper.createGPUTextureForInternalTexture(o,void 0,void 0,void 0,r.creationFlags),void 0!==t&&"object"==typeof t&&t.createMipMaps&&!r.generateMipMaps&&(o.generateMipMaps=!1)),s},jo.prototype._createDepthStencilTexture=function(e,t){const i=new Ei.l(this,Ei.S.DepthStencil);i.label=t.label;const n={bilinearFiltering:!1,comparisonFunction:0,generateStencil:!1,samples:1,depthTextureFormat:t.generateStencil?13:14,...t};return i.format=n.depthTextureFormat,this._setupDepthStencilTexture(i,e,n.generateStencil,n.bilinearFiltering,n.comparisonFunction,n.samples),this._textureHelper.createGPUTextureForInternalTexture(i),this._internalTexturesCache.push(i),i},jo.prototype._setupDepthStencilTexture=function(e,t,i,n,s,r=1){const o=t.width||t,a=t.height||t,l=t.layers||0;e.baseWidth=o,e.baseHeight=a,e.width=o,e.height=a,e.is2DArray=l>0,e.depth=l,e.isReady=!0,e.samples=r,e.generateMipMaps=!1,e.samplingMode=n?2:1,e.type=1,e._comparisonFunction=s,e._cachedWrapU=0,e._cachedWrapV=0},jo.prototype.updateRenderTargetTextureSampleCount=function(e,t){return e&&e.texture&&e.samples!==t?(t=Math.min(t,this.getCaps().maxMSAASamples),this._textureHelper.createMSAATexture(e.texture,t),e._depthStencilTexture&&(this._textureHelper.createMSAATexture(e._depthStencilTexture,t),e._depthStencilTexture.samples=t),e._samples=t,e.texture.samples=t,t):t},jo.prototype.createRenderTargetCubeTexture=function(e,t){const i=this._createHardwareRenderTargetWrapper(!1,!0,e),n={generateMipMaps:!0,generateDepthBuffer:!0,generateStencilBuffer:!1,type:0,samplingMode:3,format:5,samples:1,...t};n.generateStencilBuffer=n.generateDepthBuffer&&n.generateStencilBuffer,i._generateDepthBuffer=n.generateDepthBuffer,i._generateStencilBuffer=n.generateStencilBuffer;const s=new Ei.l(this,Ei.S.RenderTarget);return s.width=e,s.height=e,s.depth=0,s.isReady=!0,s.isCube=!0,s.samples=n.samples,s.generateMipMaps=n.generateMipMaps,s.samplingMode=n.samplingMode,s.type=n.type,s.format=n.format,this._internalTexturesCache.push(s),i.setTextures(s),(i._generateDepthBuffer||i._generateStencilBuffer)&&i.createDepthStencilTexture(0,void 0===n.samplingMode||2===n.samplingMode||2===n.samplingMode||3===n.samplingMode||3===n.samplingMode||5===n.samplingMode||6===n.samplingMode||7===n.samplingMode||11===n.samplingMode,i._generateStencilBuffer,i.samples),t&&t.createMipMaps&&!n.generateMipMaps&&(s.generateMipMaps=!0),this._textureHelper.createGPUTextureForInternalTexture(s),t&&t.createMipMaps&&!n.generateMipMaps&&(s.generateMipMaps=!1),i},ds.Q.prototype.setTextureSampler=function(e,t){this._engine.setTextureSampler(e,t)},jo.prototype.setTextureSampler=function(e,t){var i;null===(i=this._currentMaterialContext)||void 0===i||i.setSampler(e,t)},ds.Q.prototype.setStorageBuffer=function(e,t){this._engine.setStorageBuffer(e,t)},jo.prototype.createStorageBuffer=function(e,t){return this._createBuffer(e,32|t)},jo.prototype.updateStorageBuffer=function(e,t,i,n){const s=e;let r;void 0===i&&(i=0),void 0===n?(r=t instanceof Array?new Float32Array(t):t instanceof ArrayBuffer?new Uint8Array(t):t,n=r.byteLength):r=t instanceof Array?new Float32Array(t):t instanceof ArrayBuffer?new Uint8Array(t):t,this._bufferManager.setSubData(s,i,r,0,n)},jo.prototype.readFromStorageBuffer=function(e,t,i,n){i=i||e.capacity;const s=this._bufferManager.createRawBuffer(i,sr.MapRead|sr.CopyDst);return this._renderTargetEncoder.copyBufferToBuffer(e.underlyingResource,null!=t?t:0,s,0,i),new Promise(((e,t)=>{this.onEndFrameObservable.addOnce((()=>{s.mapAsync(rr.Read,0,i).then((()=>{const t=s.getMappedRange(0,i);let r=n;if(void 0===r)r=new Uint8Array(i),r.set(new Uint8Array(t));else{const e=r.constructor;r=new e(r.buffer),r.set(new e(t))}s.unmap(),this._bufferManager.releaseBuffer(s),e(r)}),(e=>t(e)))}))}))},jo.prototype.setStorageBuffer=function(e,t){var i,n;null===(i=this._currentDrawContext)||void 0===i||i.setBuffer(e,null!==(n=null==t?void 0:t.getBuffer())&&void 0!==n?n:null)},jo.prototype.createUniformBuffer=function(e){let t;return t=e instanceof Array?new Float32Array(e):e,this._bufferManager.createBuffer(t,sr.Uniform|sr.CopyDst)},jo.prototype.createDynamicUniformBuffer=function(e){return this.createUniformBuffer(e)},jo.prototype.updateUniformBuffer=function(e,t,i,n){void 0===i&&(i=0);const s=e;let r;void 0===n?(r=t instanceof Float32Array?t:new Float32Array(t),n=r.byteLength):r=t instanceof Float32Array?t:new Float32Array(t),this._bufferManager.setSubData(s,i,r,0,n)},jo.prototype.bindUniformBufferBase=function(e,t,i){this._currentDrawContext.setBuffer(i,e)},jo.prototype.bindUniformBlock=function(){},jo.prototype.updateVideoTexture=function(e,t,i){var n;if(!e||e._isDisabled)return;void 0===this._videoTextureSupported&&(this._videoTextureSupported=!0);let s=e._hardwareTexture;(null===(n=e._hardwareTexture)||void 0===n?void 0:n.underlyingResource)||(s=this._textureHelper.createGPUTextureForInternalTexture(e)),function(e){return!(!e||void 0===e.underlyingResource)}(t)?(this._textureHelper.copyVideoToTexture(t,e,s.format,!i),e.generateMipMaps&&this._generateMipmaps(e,this._uploadEncoder),e.isReady=!0):t&&this.createImageBitmap(t).then((t=>{this._textureHelper.updateTexture(t,e,e.width,e.height,e.depth,s.format,0,0,!i,!1,0,0),e.generateMipMaps&&this._generateMipmaps(e,this._uploadEncoder),e.isReady=!0})).catch((()=>{e.isReady=!0}))};var Zo=i(4238);class Jo{static CreateAsync(e,t){return jo.IsSupportedAsync.then((i=>i?jo.CreateAsync(e,t):ue.D.IsSupported?new Promise((i=>{i(new ue.D(e,void 0,t))})):new Promise((e=>{e(new Is(t))}))))}}var ea=i(9884),ta=i(9953);class ia extends Vi{constructor(e){super(e),this.controllerType=zt.DAYDREAM}initControllerMesh(e,t){ta.n.ImportMesh("",ia.MODEL_BASE_URL,ia.MODEL_FILENAME,e,(e=>{this._defaultModel=e[1],this.attachToMesh(this._defaultModel),t&&t(this._defaultModel)}))}_handleButtonChange(e,t){if(0===e){const e=this.onTriggerStateChangedObservable;e&&e.notifyObservers(t)}else _.Y.Warn(`Unrecognized Daydream button index: ${e}`)}}ia.MODEL_BASE_URL="https://controllers.babylonjs.com/generic/",ia.MODEL_FILENAME="generic.babylon",ia.GAMEPAD_ID_PREFIX="Daydream",qt._ControllerFactories.push({canCreate:e=>0===e.id.indexOf(ia.GAMEPAD_ID_PREFIX),create:e=>new ia(e)});class na extends Vi{constructor(e){super(e),this._buttonIndexToObservableNameMap=["onPadStateChangedObservable","onTriggerStateChangedObservable"],this.controllerType=zt.GEAR_VR,this._calculatedPosition=new o.P("left"==this.hand?-.15:.15,-.5,.25),this._disableTrackPosition(this._calculatedPosition)}initControllerMesh(e,t){ta.n.ImportMesh("",na.MODEL_BASE_URL,na.MODEL_FILENAME,e,(i=>{const n=new Nt.Kj("",e);i[1].parent=n,i[1].position.z=-.15,this._defaultModel=n,this.attachToMesh(this._defaultModel),t&&t(this._defaultModel)}))}_handleButtonChange(e,t){if(e<this._buttonIndexToObservableNameMap.length){const i=this[this._buttonIndexToObservableNameMap[e]];i&&i.notifyObservers(t)}}}na.MODEL_BASE_URL="https://controllers.babylonjs.com/generic/",na.MODEL_FILENAME="generic.babylon",na.GAMEPAD_ID_PREFIX="Gear VR",qt._ControllerFactories.push({canCreate:e=>0===e.id.indexOf(na.GAMEPAD_ID_PREFIX)||-1!==e.id.indexOf("Oculus Go")||-1!==e.id.indexOf("Vive Focus"),create:e=>new na(e)});class sa extends Vi{constructor(e){super(e)}initControllerMesh(e,t){ta.n.ImportMesh("",sa.MODEL_BASE_URL,sa.MODEL_FILENAME,e,(e=>{this._defaultModel=e[1],this.attachToMesh(this._defaultModel),t&&t(this._defaultModel)}))}_handleButtonChange(e,t){console.log("Button id: "+e+"state: "),console.dir(t)}}sa.MODEL_BASE_URL="https://controllers.babylonjs.com/generic/",sa.MODEL_FILENAME="generic.babylon",qt._DefaultControllerFactory=e=>new sa(e);class ra extends Vi{constructor(e){super(e),this.onSecondaryTriggerStateChangedObservable=new r.y$,this.onThumbRestChangedObservable=new r.y$,this.controllerType=zt.OCULUS}initControllerMesh(e,t){let i;i="left"===this.hand?ra.MODEL_LEFT_FILENAME:ra.MODEL_RIGHT_FILENAME,ta.n.ImportMesh("",ra._IsQuest?ra.QUEST_MODEL_BASE_URL:ra.MODEL_BASE_URL,i,e,(e=>{this._defaultModel=ra._IsQuest?e[0]:e[1],this.attachToMesh(this._defaultModel),t&&t(this._defaultModel)}))}get onAButtonStateChangedObservable(){if("right"===this.hand)return this.onMainButtonStateChangedObservable;throw new Error("No A button on left hand")}get onBButtonStateChangedObservable(){if("right"===this.hand)return this.onSecondaryButtonStateChangedObservable;throw new Error("No B button on left hand")}get onXButtonStateChangedObservable(){if("left"===this.hand)return this.onMainButtonStateChangedObservable;throw new Error("No X button on right hand")}get onYButtonStateChangedObservable(){if("left"===this.hand)return this.onSecondaryButtonStateChangedObservable;throw new Error("No Y button on right hand")}_handleButtonChange(e,t){const i=t,n="right"===this.hand?-1:1;switch(e){case 0:return void this.onPadStateChangedObservable.notifyObservers(i);case 1:return!ra._IsQuest&&this._defaultModel&&(this._defaultModel.getChildren()[3].rotation.x=.2*-i.value,this._defaultModel.getChildren()[3].position.y=.005*-i.value,this._defaultModel.getChildren()[3].position.z=.005*-i.value),void this.onTriggerStateChangedObservable.notifyObservers(i);case 2:return!ra._IsQuest&&this._defaultModel&&(this._defaultModel.getChildren()[4].position.x=n*i.value*.0035),void this.onSecondaryTriggerStateChangedObservable.notifyObservers(i);case 3:return!ra._IsQuest&&this._defaultModel&&(i.pressed?this._defaultModel.getChildren()[1].position.y=-.001:this._defaultModel.getChildren()[1].position.y=0),void this.onMainButtonStateChangedObservable.notifyObservers(i);case 4:return!ra._IsQuest&&this._defaultModel&&(i.pressed?this._defaultModel.getChildren()[2].position.y=-.001:this._defaultModel.getChildren()[2].position.y=0),void this.onSecondaryButtonStateChangedObservable.notifyObservers(i);case 5:return void this.onThumbRestChangedObservable.notifyObservers(i)}}}ra.MODEL_BASE_URL="https://controllers.babylonjs.com/oculus/",ra.MODEL_LEFT_FILENAME="left.babylon",ra.MODEL_RIGHT_FILENAME="right.babylon",ra.QUEST_MODEL_BASE_URL="https://controllers.babylonjs.com/oculusQuest/",ra._IsQuest=!1,qt._ControllerFactories.push({canCreate:e=>(A.l.LastCreatedEngine&&A.l.LastCreatedEngine._vrDisplay&&"Oculus Quest"===A.l.LastCreatedEngine._vrDisplay.displayName&&(ra._IsQuest=!0),-1!==e.id.indexOf("Oculus Touch")),create:e=>new ra(e)});class oa extends Vi{constructor(e){super(e),this.controllerType=zt.VIVE,this._invertLeftStickY=!0}initControllerMesh(e,t){ta.n.ImportMesh("",oa.MODEL_BASE_URL,oa.MODEL_FILENAME,e,(e=>{this._defaultModel=e[1],this.attachToMesh(this._defaultModel),t&&t(this._defaultModel)}))}get onLeftButtonStateChangedObservable(){return this.onMainButtonStateChangedObservable}get onRightButtonStateChangedObservable(){return this.onMainButtonStateChangedObservable}get onMenuButtonStateChangedObservable(){return this.onSecondaryButtonStateChangedObservable}_handleButtonChange(e,t){const i=t;switch(e){case 0:return void this.onPadStateChangedObservable.notifyObservers(i);case 1:return this._defaultModel&&(this._defaultModel.getChildren()[6].rotation.x=.15*-i.value),void this.onTriggerStateChangedObservable.notifyObservers(i);case 2:return void this.onMainButtonStateChangedObservable.notifyObservers(i);case 3:return this._defaultModel&&(i.pressed?this._defaultModel.getChildren()[2].position.y=-.001:this._defaultModel.getChildren()[2].position.y=0),void this.onSecondaryButtonStateChangedObservable.notifyObservers(i)}}}oa.MODEL_BASE_URL="https://controllers.babylonjs.com/vive/",oa.MODEL_FILENAME="wand.babylon",qt._ControllerFactories.push({canCreate:e=>-1!==e.id.toLowerCase().indexOf("openvr"),create:e=>new oa(e)});class aa{constructor(){this.buttonMeshes={},this.axisMeshes={}}}class la extends Vi{constructor(e){super(e),this._mapping={buttons:["thumbstick","trigger","grip","menu","trackpad"],buttonMeshNames:{trigger:"SELECT",menu:"MENU",grip:"GRASP",thumbstick:"THUMBSTICK_PRESS",trackpad:"TOUCHPAD_PRESS"},buttonObservableNames:{trigger:"onTriggerStateChangedObservable",menu:"onSecondaryButtonStateChangedObservable",grip:"onMainButtonStateChangedObservable",thumbstick:"onPadStateChangedObservable",trackpad:"onTrackpadChangedObservable"},axisMeshNames:["THUMBSTICK_X","THUMBSTICK_Y","TOUCHPAD_TOUCH_X","TOUCHPAD_TOUCH_Y"],pointingPoseMeshName:Kt.POINTING_POSE},this.onTrackpadChangedObservable=new r.y$,this.onTrackpadValuesChangedObservable=new r.y$,this.trackpad={x:0,y:0},this.controllerType=zt.WINDOWS,this._loadedMeshInfo=null}get onTriggerButtonStateChangedObservable(){return this.onTriggerStateChangedObservable}get onMenuButtonStateChangedObservable(){return this.onSecondaryButtonStateChangedObservable}get onGripButtonStateChangedObservable(){return this.onMainButtonStateChangedObservable}get onThumbstickButtonStateChangedObservable(){return this.onPadStateChangedObservable}get onTouchpadButtonStateChangedObservable(){return this.onTrackpadChangedObservable}get onTouchpadValuesChangedObservable(){return this.onTrackpadValuesChangedObservable}_updateTrackpad(){!this.browserGamepad.axes||this.browserGamepad.axes[2]==this.trackpad.x&&this.browserGamepad.axes[3]==this.trackpad.y||(this.trackpad.x=this.browserGamepad.axes[this._mapping.axisMeshNames.indexOf("TOUCHPAD_TOUCH_X")],this.trackpad.y=this.browserGamepad.axes[this._mapping.axisMeshNames.indexOf("TOUCHPAD_TOUCH_Y")],this.onTrackpadValuesChangedObservable.notifyObservers(this.trackpad))}update(){if(super.update(),this.browserGamepad.axes&&(this._updateTrackpad(),this._loadedMeshInfo))for(let e=0;e<this._mapping.axisMeshNames.length;e++)this._lerpAxisTransform(e,this.browserGamepad.axes[e])}_handleButtonChange(e,t){const i=this._mapping.buttons[e];if(!i)return;this._updateTrackpad();const n=this[this._mapping.buttonObservableNames[i]];n&&n.notifyObservers(t),this._lerpButtonTransform(i,t.value)}_lerpButtonTransform(e,t){if(!this._loadedMeshInfo)return;const i=this._loadedMeshInfo.buttonMeshes[e];i&&i.unpressed.rotationQuaternion&&i.pressed.rotationQuaternion&&i.value.rotationQuaternion&&(o._f.SlerpToRef(i.unpressed.rotationQuaternion,i.pressed.rotationQuaternion,t,i.value.rotationQuaternion),o.P.LerpToRef(i.unpressed.position,i.pressed.position,t,i.value.position))}_lerpAxisTransform(e,t){if(!this._loadedMeshInfo)return;const i=this._loadedMeshInfo.axisMeshes[e];if(!i)return;if(!i.min.rotationQuaternion||!i.max.rotationQuaternion||!i.value.rotationQuaternion)return;const n=.5*t+.5;o._f.SlerpToRef(i.min.rotationQuaternion,i.max.rotationQuaternion,n,i.value.rotationQuaternion),o.P.LerpToRef(i.min.position,i.max.position,n,i.value.position)}initControllerMesh(e,t,i=!1){let n,s;if(ta.n.IsPluginForExtensionAvailable(".glb")){let e="default";if(this.id&&!i){const t=this.id.match(la.GAMEPAD_ID_PATTERN);e=t&&t[0]||e}s="left"===this.hand?la.MODEL_LEFT_FILENAME:la.MODEL_RIGHT_FILENAME,n=la.MODEL_BASE_URL+e+"/"}else _.Y.Warn("You need to reference GLTF loader to load Windows Motion Controllers model. Falling back to generic models"),n=sa.MODEL_BASE_URL,s=sa.MODEL_FILENAME;ta.n.ImportMesh("",n,s,e,(i=>{this._loadedMeshInfo=this._processModel(e,i),this._loadedMeshInfo&&(this._defaultModel=this._loadedMeshInfo.rootNode,this.attachToMesh(this._defaultModel),t&&t(this._defaultModel))}),null,((e,r)=>{_.Y.Log(r),_.Y.Warn("Failed to retrieve controller model from the remote server: "+n+s),i||this.initControllerMesh(e,t,!0)}))}_processModel(e,t){let i=null;const n=new Nt.Kj(this.id+" "+this.hand,e);let s=null;for(let e=0;e<t.length;e++){const i=t[e];if(!i.parent){i.isPickable=!1,s=i;break}}return s?(s.setParent(n),i=this._createMeshInfo(n)):_.Y.Warn("Could not find root node in model file."),i}_createMeshInfo(e){const t=new aa;let i;for(t.rootNode=e,t.buttonMeshes={},t.axisMeshes={},i=0;i<this._mapping.buttons.length;i++){const r=this._mapping.buttonMeshNames[this._mapping.buttons[i]];if(!r){_.Y.Log("Skipping unknown button at index: "+i+" with mapped name: "+this._mapping.buttons[i]);continue}const o=n(e,r);if(!o){_.Y.Warn("Missing button mesh with name: "+r);continue}const a={index:i,value:s(o,"VALUE"),pressed:s(o,"PRESSED"),unpressed:s(o,"UNPRESSED")};a.value&&a.pressed&&a.unpressed?t.buttonMeshes[this._mapping.buttons[i]]=a:_.Y.Warn("Missing button submesh under mesh with name: "+r+"(VALUE: "+!!a.value+", PRESSED: "+!!a.pressed+", UNPRESSED:"+!!a.unpressed+")")}for(i=0;i<this._mapping.axisMeshNames.length;i++){const r=this._mapping.axisMeshNames[i];if(!r){_.Y.Log("Skipping unknown axis at index: "+i);continue}const o=n(e,r);if(!o){_.Y.Warn("Missing axis mesh with name: "+r);continue}const a={index:i,value:s(o,"VALUE"),min:s(o,"MIN"),max:s(o,"MAX")};a.value&&a.min&&a.max?t.axisMeshes[i]=a:_.Y.Warn("Missing axis submesh under mesh with name: "+r+"(VALUE: "+!!a.value+", MIN: "+!!a.min+", MAX:"+!!a.max+")")}return t.pointingPoseNode=n(e,this._mapping.pointingPoseMeshName),t.pointingPoseNode?this._pointingPoseNode=t.pointingPoseNode:_.Y.Warn("Missing pointing pose mesh with name: "+this._mapping.pointingPoseMeshName),t;function n(e,t){return e.getChildren((e=>e.name===t),!1)[0]}function s(e,t){return e.getChildren((e=>e.name==t),!0)[0]}}getForwardRay(e=100){if(!this._loadedMeshInfo||!this._loadedMeshInfo.pointingPoseNode)return super.getForwardRay(e);const t=this._loadedMeshInfo.pointingPoseNode.getWorldMatrix(),i=t.getTranslation(),n=new o.P(0,0,-1),s=o.P.TransformNormal(n,t),r=o.P.Normalize(s);return new Yt.z(i,r,e)}dispose(){super.dispose(),this.onTrackpadChangedObservable.clear(),this.onTrackpadValuesChangedObservable.clear()}}la.MODEL_BASE_URL="https://controllers.babylonjs.com/microsoft/",la.MODEL_LEFT_FILENAME="left.glb",la.MODEL_RIGHT_FILENAME="right.glb",la.GAMEPAD_ID_PREFIX="Spatial Controller (Spatial Interaction Source) ",la.GAMEPAD_ID_PATTERN=/([0-9a-zA-Z]+-[0-9a-zA-Z]+)$/;class ha extends la{constructor(e){super(e),this._mapping={buttons:["trigger","grip","trackpad","thumbstick","menu"],buttonMeshNames:{trigger:"SELECT",menu:"MENU",grip:"GRASP",thumbstick:"THUMBSTICK_PRESS",trackpad:"TOUCHPAD_PRESS"},buttonObservableNames:{trigger:"onTriggerStateChangedObservable",menu:"onSecondaryButtonStateChangedObservable",grip:"onMainButtonStateChangedObservable",thumbstick:"onThumbstickStateChangedObservable",trackpad:"onTrackpadChangedObservable"},axisMeshNames:["TOUCHPAD_TOUCH_X","TOUCHPAD_TOUCH_Y","THUMBSTICK_X","THUMBSTICK_Y"],pointingPoseMeshName:Kt.POINTING_POSE},this.thumbstickValues={x:0,y:0},this.onThumbstickStateChangedObservable=new r.y$,this.onThumbstickValuesChangedObservable=new r.y$,this.onTrackpadChangedObservable=this.onPadStateChangedObservable,this.onTrackpadValuesChangedObservable=this.onPadValuesChangedObservable}get onThumbstickButtonStateChangedObservable(){return this.onThumbstickStateChangedObservable}_updateTrackpad(){!this.browserGamepad.axes||this.browserGamepad.axes[2]==this.thumbstickValues.x&&this.browserGamepad.axes[3]==this.thumbstickValues.y||(this.trackpad.x=this.browserGamepad.axes[2],this.trackpad.y=this.browserGamepad.axes[3],this.onThumbstickValuesChangedObservable.notifyObservers(this.trackpad))}dispose(){super.dispose(),this.onThumbstickStateChangedObservable.clear(),this.onThumbstickValuesChangedObservable.clear()}}qt._ControllerFactories.push({canCreate:e=>0===e.id.indexOf(la.GAMEPAD_ID_PREFIX),create:e=>new la(e)});class ca extends Gn.t{get coloredMaterial(){return this._coloredMaterial}get hoverMaterial(){return this._hoverMaterial}get disableMaterial(){return this._disableMaterial}constructor(e,t=a.Wo.Gray(),i=zn.x.DefaultUtilityLayer,n=null,s=1){var l,h,c,u,d,p,f;super(i),this._pointerObserver=null,this.snapDistance=0,this.onSnapObservable=new r.y$,this.uniformScaling=!1,this.sensitivity=1,this.dragScale=1,this._isEnabled=!0,this._parent=null,this._dragging=!1,this._tmpVector=new o.P(0,0,0),this._parent=n,this._coloredMaterial=new Gi.K("",i.utilityLayerScene),this._coloredMaterial.diffuseColor=t,this._coloredMaterial.specularColor=t.subtract(new a.Wo(.1,.1,.1)),this._hoverMaterial=new Gi.K("",i.utilityLayerScene),this._hoverMaterial.diffuseColor=a.Wo.Yellow(),this._disableMaterial=new Gi.K("",i.utilityLayerScene),this._disableMaterial.diffuseColor=a.Wo.Gray(),this._disableMaterial.alpha=.4,this._gizmoMesh=new Nt.Kj("axis",i.utilityLayerScene);const{arrowMesh:_,arrowTail:m}=this._createGizmoMesh(this._gizmoMesh,s),g=this._createGizmoMesh(this._gizmoMesh,s+4,!0);this._gizmoMesh.lookAt(this._rootMesh.position.add(e)),this._rootMesh.addChild(this._gizmoMesh,Gn.t.PreserveScaling),this._gizmoMesh.scaling.scaleInPlace(1/3);const v=_.position.clone(),y=m.position.clone(),x=m.scaling.clone(),b=e=>{const t=e*(3/this._rootMesh.scaling.length())*6;_.position.z+=t/3.5,m.scaling.y+=t,this.dragScale=m.scaling.y,m.position.z=_.position.z/2},T=()=>{_.position.set(v.x,v.y,v.z),m.position.set(y.x,y.y,y.z),m.scaling.set(x.x,x.y,x.z),this.dragScale=m.scaling.y,this._dragging=!1};this.dragBehavior=new Le.M({dragAxis:e}),this.dragBehavior.moveAttached=!1,this.dragBehavior.updateDragPlane=!1,this._rootMesh.addBehavior(this.dragBehavior);let S=0;const E={snapDistance:0};this.dragBehavior.onDragObservable.add((t=>{if(this.attachedNode){this._handlePivot();const i=this.sensitivity*t.dragDistance*(3*this.scaleRatio/this._rootMesh.scaling.length()),n=this._tmpVector;let s=!1,r=0;this.uniformScaling?n.setAll(.57735):n.copyFrom(e),0==this.snapDistance?n.scaleToRef(i,n):(S+=i,Math.abs(S)>this.snapDistance?(r=Math.floor(Math.abs(S)/this.snapDistance),S<0&&(r*=-1),S%=this.snapDistance,n.scaleToRef(this.snapDistance*r,n),s=!0):n.scaleInPlace(0)),o.y3.ScalingToRef(1+n.x,1+n.y,1+n.z,o.jp.Matrix[2]),o.jp.Matrix[2].multiplyToRef(this.attachedNode.getWorldMatrix(),o.jp.Matrix[1]);const a=this.attachedNode._isMesh?this.attachedNode:void 0;o.jp.Matrix[1].decompose(o.jp.Vector3[1],void 0,void 0,Gn.t.PreserveScaling?a:void 0);const l=1e5;Math.abs(o.jp.Vector3[1].x)<l&&Math.abs(o.jp.Vector3[1].y)<l&&Math.abs(o.jp.Vector3[1].z)<l&&this.attachedNode.getWorldMatrix().copyFrom(o.jp.Matrix[1]),s&&(E.snapDistance=this.snapDistance*r,this.onSnapObservable.notifyObservers(E)),this._matrixChanged()}})),this.dragBehavior.onDragStartObservable.add((()=>{this._dragging=!0})),this.dragBehavior.onDragObservable.add((e=>b(e.dragDistance))),this.dragBehavior.onDragEndObservable.add(T),null===(c=null===(h=null===(l=null==n?void 0:n.uniformScaleGizmo)||void 0===l?void 0:l.dragBehavior)||void 0===h?void 0:h.onDragObservable)||void 0===c||c.add((e=>b(e.delta.y))),null===(p=null===(d=null===(u=null==n?void 0:n.uniformScaleGizmo)||void 0===u?void 0:u.dragBehavior)||void 0===d?void 0:d.onDragEndObservable)||void 0===p||p.add(T);const C={gizmoMeshes:[_,m],colliderMeshes:[g.arrowMesh,g.arrowTail],material:this._coloredMaterial,hoverMaterial:this._hoverMaterial,disableMaterial:this._disableMaterial,active:!1,dragBehavior:this.dragBehavior};null===(f=this._parent)||void 0===f||f.addToAxisCache(this._gizmoMesh,C),this._pointerObserver=i.utilityLayerScene.onPointerObservable.add((e=>{var t;if(!this._customMeshSet&&(this._isHovered=!(-1==C.colliderMeshes.indexOf(null===(t=null==e?void 0:e.pickInfo)||void 0===t?void 0:t.pickedMesh)),!this._parent)){const e=this.dragBehavior.enabled?this._isHovered||this._dragging?this._hoverMaterial:this._coloredMaterial:this._disableMaterial;this._setGizmoMeshMaterial(C.gizmoMeshes,e)}})),this.dragBehavior.onEnabledObservable.add((e=>{this._setGizmoMeshMaterial(C.gizmoMeshes,e?this._coloredMaterial:this._disableMaterial)}));const A=i._getSharedGizmoLight();A.includedOnlyMeshes=A.includedOnlyMeshes.concat(this._rootMesh.getChildMeshes())}_createGizmoMesh(e,t,i=!1){const n=(0,Yn.NR)("yPosMesh",{size:.4*(1+(t-1)/4)},this.gizmoLayer.utilityLayerScene),s=an("cylinder",{diameterTop:.005*t,height:.275,diameterBottom:.005*t,tessellation:96},this.gizmoLayer.utilityLayerScene);return n.scaling.scaleInPlace(.1),n.material=this._coloredMaterial,n.rotation.x=Math.PI/2,n.position.z+=.3,s.material=this._coloredMaterial,s.position.z+=.1375,s.rotation.x=Math.PI/2,i&&(n.visibility=0,s.visibility=0),e.addChild(n),e.addChild(s),{arrowMesh:n,arrowTail:s}}_attachedNodeChanged(e){this.dragBehavior&&(this.dragBehavior.enabled=!!e)}set isEnabled(e){this._isEnabled=e,e?this._parent&&(this.attachedMesh=this._parent.attachedMesh,this.attachedNode=this._parent.attachedNode):(this.attachedMesh=null,this.attachedNode=null)}get isEnabled(){return this._isEnabled}dispose(){this.onSnapObservable.clear(),this.gizmoLayer.utilityLayerScene.onPointerObservable.remove(this._pointerObserver),this.dragBehavior.detach(),this._gizmoMesh&&this._gizmoMesh.dispose(),[this._coloredMaterial,this._hoverMaterial,this._disableMaterial].forEach((e=>{e&&e.dispose()})),super.dispose()}setCustomMesh(e,t=!1){super.setCustomMesh(e),t&&(this._rootMesh.getChildMeshes().forEach((e=>{e.material=this._coloredMaterial,e.color&&(e.color=this._coloredMaterial.diffuseColor)})),this._customMeshSet=!1)}}var ua=i(6746);class da extends Gn.t{set axisFactor(e){this._axisFactor=e;const t=this._scaleBoxesParent.getChildMeshes();let i=0;for(let e=0;e<3;e++)for(let n=0;n<3;n++)for(let s=0;s<3;s++){const r=(1===e?1:0)+(1===n?1:0)+(1===s?1:0);if(1!==r&&3!==r){if(t[i]){const r=new o.P(e-1,n-1,s-1);r.multiplyInPlace(this._axisFactor),t[i].setEnabled(r.lengthSquared()>Me.kn)}i++}}}get axisFactor(){return this._axisFactor}set scaleDragSpeed(e){this._scaleDragSpeed=e}get scaleDragSpeed(){return this._scaleDragSpeed}get coloredMaterial(){return this._coloredMaterial}get hoverMaterial(){return this._hoverColoredMaterial}get pointerDragBehavior(){return this._pointerDragBehavior}setColor(e){this._coloredMaterial.emissiveColor=e,this._hoverColoredMaterial.emissiveColor=e.clone().add(new a.Wo(.3,.3,.3)),this._lineBoundingBox.getChildren().forEach((t=>{t.color&&(t.color=e)}))}constructor(e=a.Wo.Gray(),t=zn.x.DefaultKeepDepthUtilityLayer){super(t),this._boundingDimensions=new o.P(1,1,1),this._renderObserver=null,this._pointerObserver=null,this._scaleDragSpeed=.2,this._tmpQuaternion=new o._f,this._tmpVector=new o.P(0,0,0),this._tmpRotationMatrix=new o.y3,this.ignoreChildren=!1,this.includeChildPredicate=null,this.rotationSphereSize=.1,this.scaleBoxSize=.1,this.fixedDragMeshScreenSize=!1,this.fixedDragMeshBoundsSize=!1,this.fixedDragMeshScreenSizeDistanceFactor=10,this.onDragStartObservable=new r.y$,this.onScaleBoxDragObservable=new r.y$,this.onScaleBoxDragEndObservable=new r.y$,this.onRotationSphereDragObservable=new r.y$,this.onRotationSphereDragEndObservable=new r.y$,this.scalePivot=null,this._axisFactor=new o.P(1,1,1),this._existingMeshScale=new o.P,this._dragMesh=null,this._pointerDragBehavior=new Le.M,this.updateScale=!1,this._anchorMesh=new Un.x("anchor",t.utilityLayerScene),this._coloredMaterial=new Gi.K("",t.utilityLayerScene),this._coloredMaterial.disableLighting=!0,this._hoverColoredMaterial=new Gi.K("",t.utilityLayerScene),this._hoverColoredMaterial.disableLighting=!0,this._lineBoundingBox=new Un.x("",t.utilityLayerScene),this._lineBoundingBox.rotationQuaternion=new o._f;const i=[];i.push(os("lines",{points:[new o.P(0,0,0),new o.P(this._boundingDimensions.x,0,0)]},t.utilityLayerScene)),i.push(os("lines",{points:[new o.P(0,0,0),new o.P(0,this._boundingDimensions.y,0)]},t.utilityLayerScene)),i.push(os("lines",{points:[new o.P(0,0,0),new o.P(0,0,this._boundingDimensions.z)]},t.utilityLayerScene)),i.push(os("lines",{points:[new o.P(this._boundingDimensions.x,0,0),new o.P(this._boundingDimensions.x,this._boundingDimensions.y,0)]},t.utilityLayerScene)),i.push(os("lines",{points:[new o.P(this._boundingDimensions.x,0,0),new o.P(this._boundingDimensions.x,0,this._boundingDimensions.z)]},t.utilityLayerScene)),i.push(os("lines",{points:[new o.P(0,this._boundingDimensions.y,0),new o.P(this._boundingDimensions.x,this._boundingDimensions.y,0)]},t.utilityLayerScene)),i.push(os("lines",{points:[new o.P(0,this._boundingDimensions.y,0),new o.P(0,this._boundingDimensions.y,this._boundingDimensions.z)]},t.utilityLayerScene)),i.push(os("lines",{points:[new o.P(0,0,this._boundingDimensions.z),new o.P(this._boundingDimensions.x,0,this._boundingDimensions.z)]},t.utilityLayerScene)),i.push(os("lines",{points:[new o.P(0,0,this._boundingDimensions.z),new o.P(0,this._boundingDimensions.y,this._boundingDimensions.z)]},t.utilityLayerScene)),i.push(os("lines",{points:[new o.P(this._boundingDimensions.x,this._boundingDimensions.y,this._boundingDimensions.z),new o.P(0,this._boundingDimensions.y,this._boundingDimensions.z)]},t.utilityLayerScene)),i.push(os("lines",{points:[new o.P(this._boundingDimensions.x,this._boundingDimensions.y,this._boundingDimensions.z),new o.P(this._boundingDimensions.x,0,this._boundingDimensions.z)]},t.utilityLayerScene)),i.push(os("lines",{points:[new o.P(this._boundingDimensions.x,this._boundingDimensions.y,this._boundingDimensions.z),new o.P(this._boundingDimensions.x,this._boundingDimensions.y,0)]},t.utilityLayerScene)),i.forEach((t=>{t.color=e,t.position.addInPlace(new o.P(-this._boundingDimensions.x/2,-this._boundingDimensions.y/2,-this._boundingDimensions.z/2)),t.isPickable=!1,this._lineBoundingBox.addChild(t)})),this._rootMesh.addChild(this._lineBoundingBox),this.setColor(e),this._rotateSpheresParent=new Un.x("",t.utilityLayerScene),this._rotateSpheresParent.rotationQuaternion=new o._f;for(let e=0;e<12;e++){const i=Kn("",{diameter:1},t.utilityLayerScene);i.rotationQuaternion=new o._f,i.material=this._coloredMaterial,i.isNearGrabbable=!0;const n=new Le.M({});n.moveAttached=!1,n.updateDragPlane=!1,i.addBehavior(n);const s=new o.P(1,0,0);let r=0;n.onDragStartObservable.add((()=>{s.copyFrom(i.forward),r=0})),n.onDragObservable.add((t=>{if(this.onRotationSphereDragObservable.notifyObservers({}),this.attachedMesh){const i=this.attachedMesh.parent;if(i&&i.scaling&&i.scaling.isNonUniformWithinEpsilon(.001))return void _.Y.Warn("BoundingBoxGizmo controls are not supported on child meshes with non-uniform parent scaling");ua.m._RemoveAndStorePivotPoint(this.attachedMesh);const n=s,a=t.dragPlaneNormal.scale(o.P.Dot(t.dragPlaneNormal,n)),l=n.subtract(a).normalizeToNew();let h=o.P.Dot(l,t.delta)<0?Math.abs(t.delta.length()):-Math.abs(t.delta.length());h=h/this._boundingDimensions.length()*this._anchorMesh.scaling.length(),this.attachedMesh.rotationQuaternion||(this.attachedMesh.rotationQuaternion=o._f.RotationYawPitchRoll(this.attachedMesh.rotation.y,this.attachedMesh.rotation.x,this.attachedMesh.rotation.z)),this._anchorMesh.rotationQuaternion||(this._anchorMesh.rotationQuaternion=o._f.RotationYawPitchRoll(this._anchorMesh.rotation.y,this._anchorMesh.rotation.x,this._anchorMesh.rotation.z)),r+=h,Math.abs(r)<=2*Math.PI&&(e>=8?o._f.RotationYawPitchRollToRef(0,0,h,this._tmpQuaternion):e>=4?o._f.RotationYawPitchRollToRef(h,0,0,this._tmpQuaternion):o._f.RotationYawPitchRollToRef(0,h,0,this._tmpQuaternion),this._anchorMesh.addChild(this.attachedMesh,Gn.t.PreserveScaling),this._anchorMesh.getScene().useRightHandedSystem&&this._tmpQuaternion.conjugateInPlace(),this._anchorMesh.rotationQuaternion.multiplyToRef(this._tmpQuaternion,this._anchorMesh.rotationQuaternion),this._anchorMesh.removeChild(this.attachedMesh,Gn.t.PreserveScaling),this.attachedMesh.setParent(i,Gn.t.PreserveScaling)),this.updateBoundingBox(),ua.m._RestorePivotPoint(this.attachedMesh)}this._updateDummy()})),n.onDragStartObservable.add((()=>{this.onDragStartObservable.notifyObservers({}),this._selectNode(i)})),n.onDragEndObservable.add((e=>{this.onRotationSphereDragEndObservable.notifyObservers({}),this._selectNode(null),this._updateDummy(),this._unhoverMeshOnTouchUp(e.pointerInfo,i)})),this._rotateSpheresParent.addChild(i)}this._rootMesh.addChild(this._rotateSpheresParent),this._scaleBoxesParent=new Un.x("",t.utilityLayerScene),this._scaleBoxesParent.rotationQuaternion=new o._f;for(let e=0;e<3;e++)for(let i=0;i<3;i++)for(let n=0;n<3;n++){const s=(1===e?1:0)+(1===i?1:0)+(1===n?1:0);if(1===s||3===s)continue;const r=(0,Yn.NR)("",{size:1},t.utilityLayerScene);r.material=this._coloredMaterial,r._internalMetadata=2===s,r.isNearGrabbable=!0;const a=new o.P(e-1,i-1,n-1).normalize(),l=new Le.M({dragAxis:a});l.updateDragPlane=!1,l.moveAttached=!1,r.addBehavior(l),l.onDragObservable.add((e=>{if(this.onScaleBoxDragObservable.notifyObservers({}),this.attachedMesh){const t=this.attachedMesh.parent;if(t&&t.scaling&&t.scaling.isNonUniformWithinEpsilon(.001))return void _.Y.Warn("BoundingBoxGizmo controls are not supported on child meshes with non-uniform parent scaling");ua.m._RemoveAndStorePivotPoint(this.attachedMesh);const i=e.dragDistance/this._boundingDimensions.length()*this._anchorMesh.scaling.length(),n=new o.P(i,i,i);2===s&&(n.x*=Math.abs(a.x),n.y*=Math.abs(a.y),n.z*=Math.abs(a.z)),n.scaleInPlace(this._scaleDragSpeed),n.multiplyInPlace(this._axisFactor),this.updateBoundingBox(),this.scalePivot?(this.attachedMesh.getWorldMatrix().getRotationMatrixToRef(this._tmpRotationMatrix),this._boundingDimensions.scaleToRef(.5,this._tmpVector),o.P.TransformCoordinatesToRef(this._tmpVector,this._tmpRotationMatrix,this._tmpVector),this._anchorMesh.position.subtractInPlace(this._tmpVector),this._boundingDimensions.multiplyToRef(this.scalePivot,this._tmpVector),o.P.TransformCoordinatesToRef(this._tmpVector,this._tmpRotationMatrix,this._tmpVector),this._anchorMesh.position.addInPlace(this._tmpVector)):(r.absolutePosition.subtractToRef(this._anchorMesh.position,this._tmpVector),this._anchorMesh.position.subtractInPlace(this._tmpVector)),this._anchorMesh.addChild(this.attachedMesh,Gn.t.PreserveScaling),this._anchorMesh.scaling.addInPlace(n),(this._anchorMesh.scaling.x<0||this._anchorMesh.scaling.y<0||this._anchorMesh.scaling.z<0)&&this._anchorMesh.scaling.subtractInPlace(n),this._anchorMesh.removeChild(this.attachedMesh,Gn.t.PreserveScaling),this.attachedMesh.setParent(t,Gn.t.PreserveScaling),ua.m._RestorePivotPoint(this.attachedMesh)}this._updateDummy()})),l.onDragStartObservable.add((()=>{this.onDragStartObservable.notifyObservers({}),this._selectNode(r)})),l.onDragEndObservable.add((e=>{this.onScaleBoxDragEndObservable.notifyObservers({}),this._selectNode(null),this._updateDummy(),this._unhoverMeshOnTouchUp(e.pointerInfo,r)})),this._scaleBoxesParent.addChild(r)}this._rootMesh.addChild(this._scaleBoxesParent);const n=new Array;this._pointerObserver=t.utilityLayerScene.onPointerObservable.add((e=>{n[e.event.pointerId]?e.pickInfo&&e.pickInfo.pickedMesh!=n[e.event.pointerId]&&(n[e.event.pointerId].material=this._coloredMaterial,delete n[e.event.pointerId]):this._rotateSpheresParent.getChildMeshes().concat(this._scaleBoxesParent.getChildMeshes()).forEach((t=>{e.pickInfo&&e.pickInfo.pickedMesh==t&&(n[e.event.pointerId]=t,t.material=this._hoverColoredMaterial)}))})),this._renderObserver=this.gizmoLayer.originalScene.onBeforeRenderObservable.add((()=>{this.attachedMesh&&!this._existingMeshScale.equals(this.attachedMesh.scaling)?this.updateBoundingBox():(this.fixedDragMeshScreenSize||this.fixedDragMeshBoundsSize)&&(this._updateRotationSpheres(),this._updateScaleBoxes()),this._dragMesh&&this.attachedMesh&&this._pointerDragBehavior.dragging&&(this._lineBoundingBox.position.rotateByQuaternionToRef(this._rootMesh.rotationQuaternion,this._tmpVector),this.attachedMesh.setAbsolutePosition(this._dragMesh.position.add(this._tmpVector.scale(-1))))})),this.updateBoundingBox()}_attachedNodeChanged(e){if(e){this._anchorMesh.scaling.setAll(1),ua.m._RemoveAndStorePivotPoint(e);const t=e.parent;this._anchorMesh.addChild(e,Gn.t.PreserveScaling),this._anchorMesh.removeChild(e,Gn.t.PreserveScaling),e.setParent(t,Gn.t.PreserveScaling),ua.m._RestorePivotPoint(e),this.updateBoundingBox(),e.getChildMeshes(!1).forEach((e=>{e.markAsDirty("scaling")})),this.gizmoLayer.utilityLayerScene.onAfterRenderObservable.addOnce((()=>{this._updateDummy()}))}}_selectNode(e){this._rotateSpheresParent.getChildMeshes().concat(this._scaleBoxesParent.getChildMeshes()).forEach((t=>{t.isVisible=!e||t==e}))}_unhoverMeshOnTouchUp(e,t){(null==e?void 0:e.event)instanceof PointerEvent&&"touch"===(null==e?void 0:e.event.pointerType)&&(t.material=this._coloredMaterial)}getScaleBoxes(){return this._scaleBoxesParent.getChildMeshes()}updateBoundingBox(){if(this.attachedMesh){ua.m._RemoveAndStorePivotPoint(this.attachedMesh);const e=this.attachedMesh.parent;this.attachedMesh.setParent(null,Gn.t.PreserveScaling),this._update(),this.attachedMesh.rotationQuaternion||(this.attachedMesh.rotationQuaternion=o._f.RotationYawPitchRoll(this.attachedMesh.rotation.y,this.attachedMesh.rotation.x,this.attachedMesh.rotation.z)),this._anchorMesh.rotationQuaternion||(this._anchorMesh.rotationQuaternion=o._f.RotationYawPitchRoll(this._anchorMesh.rotation.y,this._anchorMesh.rotation.x,this._anchorMesh.rotation.z)),this._anchorMesh.rotationQuaternion.copyFrom(this.attachedMesh.rotationQuaternion),this._tmpQuaternion.copyFrom(this.attachedMesh.rotationQuaternion),this._tmpVector.copyFrom(this.attachedMesh.position),this.attachedMesh.rotationQuaternion.set(0,0,0,1),this.attachedMesh.position.set(0,0,0);const t=this.attachedMesh.getHierarchyBoundingVectors(!this.ignoreChildren,this.includeChildPredicate);t.max.subtractToRef(t.min,this._boundingDimensions),this._lineBoundingBox.scaling.copyFrom(this._boundingDimensions),this._lineBoundingBox.position.set((t.max.x+t.min.x)/2,(t.max.y+t.min.y)/2,(t.max.z+t.min.z)/2),this._rotateSpheresParent.position.copyFrom(this._lineBoundingBox.position),this._scaleBoxesParent.position.copyFrom(this._lineBoundingBox.position),this._lineBoundingBox.computeWorldMatrix(),this._anchorMesh.position.copyFrom(this._lineBoundingBox.absolutePosition),this.attachedMesh.rotationQuaternion.copyFrom(this._tmpQuaternion),this.attachedMesh.position.copyFrom(this._tmpVector),this.attachedMesh.setParent(e,Gn.t.PreserveScaling)}this._updateRotationSpheres(),this._updateScaleBoxes(),this.attachedMesh&&(this._existingMeshScale.copyFrom(this.attachedMesh.scaling),ua.m._RestorePivotPoint(this.attachedMesh))}_updateRotationSpheres(){const e=this._rotateSpheresParent.getChildMeshes();for(let t=0;t<3;t++)for(let i=0;i<2;i++)for(let n=0;n<2;n++){const s=4*t+2*i+n;if(0==t&&(e[s].position.set(this._boundingDimensions.x/2,this._boundingDimensions.y*i,this._boundingDimensions.z*n),e[s].position.addInPlace(new o.P(-this._boundingDimensions.x/2,-this._boundingDimensions.y/2,-this._boundingDimensions.z/2)),e[s].lookAt(o.P.Cross(e[s].position.normalizeToNew(),o.P.Right()).normalizeToNew().add(e[s].position))),1==t&&(e[s].position.set(this._boundingDimensions.x*i,this._boundingDimensions.y/2,this._boundingDimensions.z*n),e[s].position.addInPlace(new o.P(-this._boundingDimensions.x/2,-this._boundingDimensions.y/2,-this._boundingDimensions.z/2)),e[s].lookAt(o.P.Cross(e[s].position.normalizeToNew(),o.P.Up()).normalizeToNew().add(e[s].position))),2==t&&(e[s].position.set(this._boundingDimensions.x*i,this._boundingDimensions.y*n,this._boundingDimensions.z/2),e[s].position.addInPlace(new o.P(-this._boundingDimensions.x/2,-this._boundingDimensions.y/2,-this._boundingDimensions.z/2)),e[s].lookAt(o.P.Cross(e[s].position.normalizeToNew(),o.P.Forward()).normalizeToNew().add(e[s].position))),this.fixedDragMeshScreenSize&&this.gizmoLayer.utilityLayerScene.activeCamera){e[s].absolutePosition.subtractToRef(this.gizmoLayer.utilityLayerScene.activeCamera.position,this._tmpVector);const t=this.rotationSphereSize*this._tmpVector.length()/this.fixedDragMeshScreenSizeDistanceFactor;e[s].scaling.set(t,t,t)}else this.fixedDragMeshBoundsSize?e[s].scaling.set(this.rotationSphereSize*this._boundingDimensions.x,this.rotationSphereSize*this._boundingDimensions.y,this.rotationSphereSize*this._boundingDimensions.z):e[s].scaling.set(this.rotationSphereSize,this.rotationSphereSize,this.rotationSphereSize)}}_updateScaleBoxes(){const e=this._scaleBoxesParent.getChildMeshes();let t=0;for(let i=0;i<3;i++)for(let n=0;n<3;n++)for(let s=0;s<3;s++){const r=(1===i?1:0)+(1===n?1:0)+(1===s?1:0);if(1!==r&&3!==r){if(e[t])if(e[t].position.set(this._boundingDimensions.x*(i/2),this._boundingDimensions.y*(n/2),this._boundingDimensions.z*(s/2)),e[t].position.addInPlace(new o.P(-this._boundingDimensions.x/2,-this._boundingDimensions.y/2,-this._boundingDimensions.z/2)),this.fixedDragMeshScreenSize&&this.gizmoLayer.utilityLayerScene.activeCamera){e[t].absolutePosition.subtractToRef(this.gizmoLayer.utilityLayerScene.activeCamera.position,this._tmpVector);const i=this.scaleBoxSize*this._tmpVector.length()/this.fixedDragMeshScreenSizeDistanceFactor;e[t].scaling.set(i,i,i)}else this.fixedDragMeshBoundsSize?e[t].scaling.set(this.scaleBoxSize*this._boundingDimensions.x,this.scaleBoxSize*this._boundingDimensions.y,this.scaleBoxSize*this._boundingDimensions.z):e[t].scaling.set(this.scaleBoxSize,this.scaleBoxSize,this.scaleBoxSize);t++}}}setEnabledRotationAxis(e){this._rotateSpheresParent.getChildMeshes().forEach(((t,i)=>{i<4?t.setEnabled(-1!=e.indexOf("x")):i<8?t.setEnabled(-1!=e.indexOf("y")):t.setEnabled(-1!=e.indexOf("z"))}))}setEnabledScaling(e,t=!1){this._scaleBoxesParent.getChildMeshes().forEach((i=>{let n=e;t&&!0===i._internalMetadata&&(n=!1),i.setEnabled(n)}))}_updateDummy(){this._dragMesh&&(this._dragMesh.position.copyFrom(this._lineBoundingBox.getAbsolutePosition()),this._dragMesh.scaling.copyFrom(this._lineBoundingBox.scaling),this._dragMesh.rotationQuaternion.copyFrom(this._rootMesh.rotationQuaternion))}enableDragBehavior(){this._dragMesh=(0,Yn.NR)("dummy",{size:1},this.gizmoLayer.utilityLayerScene),this._dragMesh.visibility=0,this._dragMesh.rotationQuaternion=new o._f,this._pointerDragBehavior.useObjectOrientationForDragging=!1,this._dragMesh.addBehavior(this._pointerDragBehavior)}dispose(){this.gizmoLayer.utilityLayerScene.onPointerObservable.remove(this._pointerObserver),this.gizmoLayer.originalScene.onBeforeRenderObservable.remove(this._renderObserver),this._lineBoundingBox.dispose(),this._rotateSpheresParent.dispose(),this._scaleBoxesParent.dispose(),this._dragMesh&&this._dragMesh.dispose(),super.dispose()}static MakeNotPickableAndWrapInBoundingBox(e){const t=e=>{e.isPickable=!1,e.getChildMeshes().forEach((e=>{t(e)}))};t(e),e.rotationQuaternion||(e.rotationQuaternion=o._f.RotationYawPitchRoll(e.rotation.y,e.rotation.x,e.rotation.z));const i=e.position.clone(),n=e.rotationQuaternion.clone();e.rotationQuaternion.set(0,0,0,1),e.position.set(0,0,0);const s=(0,Yn.NR)("box",{size:1},e.getScene()),r=e.getHierarchyBoundingVectors();return r.max.subtractToRef(r.min,s.scaling),0===s.scaling.y&&(s.scaling.y=Me.kn),0===s.scaling.x&&(s.scaling.x=Me.kn),0===s.scaling.z&&(s.scaling.z=Me.kn),s.position.set((r.max.x+r.min.x)/2,(r.max.y+r.min.y)/2,(r.max.z+r.min.z)/2),e.addChild(s),e.rotationQuaternion.copyFrom(n),e.position.copyFrom(i),e.removeChild(s),s.addChild(e),s.visibility=0,s}setCustomMesh(){_.Y.Error("Custom meshes are not supported on this gizmo")}}var pa=i(3615);class fa extends Gn.t{get coloredMaterial(){return this._coloredMaterial}get hoverMaterial(){return this._hoverMaterial}get disableMaterial(){return this._disableMaterial}constructor(e,t=a.Wo.Gray(),i=zn.x.DefaultUtilityLayer,n=32,s=null,l=!1,h=1){var c;super(i),this._pointerObserver=null,this.snapDistance=0,this.onSnapObservable=new r.y$,this.angle=0,this._isEnabled=!0,this._parent=null,this._dragging=!1,this._angles=new o.P,this._parent=s,this._coloredMaterial=new Gi.K("",i.utilityLayerScene),this._coloredMaterial.diffuseColor=t,this._coloredMaterial.specularColor=t.subtract(new a.Wo(.1,.1,.1)),this._hoverMaterial=new Gi.K("",i.utilityLayerScene),this._hoverMaterial.diffuseColor=a.Wo.Yellow(),this._disableMaterial=new Gi.K("",i.utilityLayerScene),this._disableMaterial.diffuseColor=a.Wo.Gray(),this._disableMaterial.alpha=.4,this._gizmoMesh=new Nt.Kj("",i.utilityLayerScene);const{rotationMesh:u,collider:d}=this._createGizmoMesh(this._gizmoMesh,h,n);this._rotationDisplayPlane=(0,pa.pT)("rotationDisplay",{size:.6,updatable:!1},this.gizmoLayer.utilityLayerScene),this._rotationDisplayPlane.rotation.z=.5*Math.PI,this._rotationDisplayPlane.parent=this._gizmoMesh,this._rotationDisplayPlane.setEnabled(!1),ds.Q.ShadersStore.rotationGizmoVertexShader=fa._RotationGizmoVertexShader,ds.Q.ShadersStore.rotationGizmoFragmentShader=fa._RotationGizmoFragmentShader,this._rotationShaderMaterial=new us.j("shader",this.gizmoLayer.utilityLayerScene,{vertex:"rotationGizmo",fragment:"rotationGizmo"},{attributes:["position","uv"],uniforms:["worldViewProjection","angles"]}),this._rotationShaderMaterial.backFaceCulling=!1,this._rotationDisplayPlane.material=this._rotationShaderMaterial,this._rotationDisplayPlane.visibility=.999,this._gizmoMesh.lookAt(this._rootMesh.position.add(e)),this._rootMesh.addChild(this._gizmoMesh,Gn.t.PreserveScaling),this._gizmoMesh.scaling.scaleInPlace(1/3),this.dragBehavior=new Le.M({dragPlaneNormal:e}),this.dragBehavior.moveAttached=!1,this.dragBehavior.maxDragAngle=fa.MaxDragAngle,this.dragBehavior._useAlternatePickedPointAboveMaxDragAngle=!0,this._rootMesh.addBehavior(this.dragBehavior);const p=new o.P,f=new o.y3,m=new o.P;let g=new o.P;this.dragBehavior.onDragStartObservable.add((e=>{this.attachedNode&&(p.copyFrom(e.dragPlanePoint),this._rotationDisplayPlane.setEnabled(!0),this._rotationDisplayPlane.getWorldMatrix().invertToRef(f),o.P.TransformCoordinatesToRef(e.dragPlanePoint,f,p),this._angles.x=Math.atan2(p.y,p.x)+Math.PI,this._angles.y=0,this._angles.z=this.updateGizmoRotationToMatchAttachedMesh?1:0,this._dragging=!0,p.copyFrom(e.dragPlanePoint),this._rotationShaderMaterial.setVector3("angles",this._angles),this.angle=0)})),this.dragBehavior.onDragEndObservable.add((()=>{this._dragging=!1,this._rotationDisplayPlane.setEnabled(!1)}));const v={snapDistance:0};let y=0;const x=new o.y3,b=new o._f;this.dragBehavior.onDragObservable.add((t=>{if(this.attachedNode){const n=new o.P(1,1,1),s=new o._f(0,0,0,1),r=new o.P(0,0,0);if(this._handlePivot(),this.attachedNode.getWorldMatrix().decompose(n,s,r),!(Math.abs(Math.abs(n.x)-Math.abs(n.y))<=Me.kn&&Math.abs(Math.abs(n.x)-Math.abs(n.z))<=Me.kn)&&this.updateGizmoRotationToMatchAttachedMesh)return void _.Y.Warn("Unable to use a rotation gizmo matching mesh rotation with non uniform scaling. Use uniform scaling or set updateGizmoRotationToMatchAttachedMesh to false.");s.normalize();const a=this.updateGizmoPositionToMatchAttachedMesh?r:this._rootMesh.absolutePosition,l=t.dragPlanePoint.subtract(a).normalize(),h=p.subtract(a).normalize(),c=o.P.Cross(l,h),u=o.P.Dot(l,h);let d=Math.atan2(c.length(),u);m.copyFrom(e),g.copyFrom(e),this.updateGizmoRotationToMatchAttachedMesh&&(s.toRotationMatrix(f),g=o.P.TransformCoordinates(m,f));let T=!1;if(i.utilityLayerScene.activeCamera){const e=i.utilityLayerScene.activeCamera.position.subtract(a).normalize();o.P.Dot(e,g)>0&&(m.scaleInPlace(-1),g.scaleInPlace(-1),T=!0)}o.P.Dot(g,c)>0&&(d=-d);let S=!1;if(0!=this.snapDistance)if(y+=d,Math.abs(y)>this.snapDistance){let e=Math.floor(Math.abs(y)/this.snapDistance);y<0&&(e*=-1),y%=this.snapDistance,d=this.snapDistance*e,S=!0}else d=0;const E=Math.sin(d/2);if(b.set(m.x*E,m.y*E,m.z*E,Math.cos(d/2)),x.determinant()>0){const e=new o.P;b.toEulerAnglesToRef(e),o._f.RotationYawPitchRollToRef(e.y,-e.x,-e.z,b)}this.updateGizmoRotationToMatchAttachedMesh?(s.multiplyToRef(b,s),o.y3.ComposeToRef(n,s,r,this.attachedNode.getWorldMatrix())):(b.toRotationMatrix(o.jp.Matrix[0]),o.jp.Matrix[0].multiplyToRef(this.attachedNode.getWorldMatrix(),this.attachedNode.getWorldMatrix())),p.copyFrom(t.dragPlanePoint),S&&(v.snapDistance=d,this.onSnapObservable.notifyObservers(v)),this._angles.y+=d,this.angle+=T?-d:d,this._rotationShaderMaterial.setVector3("angles",this._angles),this._matrixChanged()}}));const T=i._getSharedGizmoLight();T.includedOnlyMeshes=T.includedOnlyMeshes.concat(this._rootMesh.getChildMeshes(!1));const S={colliderMeshes:[d],gizmoMeshes:[u],material:this._coloredMaterial,hoverMaterial:this._hoverMaterial,disableMaterial:this._disableMaterial,active:!1,dragBehavior:this.dragBehavior};null===(c=this._parent)||void 0===c||c.addToAxisCache(this._gizmoMesh,S),this._pointerObserver=i.utilityLayerScene.onPointerObservable.add((e=>{var t;if(!this._customMeshSet&&(this.dragBehavior.maxDragAngle=fa.MaxDragAngle,this._isHovered=!(-1==S.colliderMeshes.indexOf(null===(t=null==e?void 0:e.pickInfo)||void 0===t?void 0:t.pickedMesh)),!this._parent)){const e=S.dragBehavior.enabled?this._isHovered||this._dragging?this._hoverMaterial:this._coloredMaterial:this._disableMaterial;this._setGizmoMeshMaterial(S.gizmoMeshes,e)}})),this.dragBehavior.onEnabledObservable.add((e=>{this._setGizmoMeshMaterial(S.gizmoMeshes,e?this._coloredMaterial:this._disableMaterial)}))}_createGizmoMesh(e,t,i){const n=cn("ignore",{diameter:.6,thickness:.03*t,tessellation:i},this.gizmoLayer.utilityLayerScene);n.visibility=0;const s=cn("",{diameter:.6,thickness:.005*t,tessellation:i},this.gizmoLayer.utilityLayerScene);return s.material=this._coloredMaterial,s.rotation.x=Math.PI/2,n.rotation.x=Math.PI/2,e.addChild(s,Gn.t.PreserveScaling),e.addChild(n,Gn.t.PreserveScaling),{rotationMesh:s,collider:n}}_attachedNodeChanged(e){this.dragBehavior&&(this.dragBehavior.enabled=!!e)}set isEnabled(e){this._isEnabled=e,e?this._parent&&(this.attachedMesh=this._parent.attachedMesh):this.attachedMesh=null}get isEnabled(){return this._isEnabled}dispose(){this.onSnapObservable.clear(),this.gizmoLayer.utilityLayerScene.onPointerObservable.remove(this._pointerObserver),this.dragBehavior.detach(),this._gizmoMesh&&this._gizmoMesh.dispose(),this._rotationDisplayPlane&&this._rotationDisplayPlane.dispose(),this._rotationShaderMaterial&&this._rotationShaderMaterial.dispose(),[this._coloredMaterial,this._hoverMaterial,this._disableMaterial].forEach((e=>{e&&e.dispose()})),super.dispose()}}fa.MaxDragAngle=9*Math.PI/20,fa._RotationGizmoVertexShader="\n        precision highp float;\n        attribute vec3 position;\n        attribute vec2 uv;\n        uniform mat4 worldViewProjection;\n        varying vec3 vPosition;\n        varying vec2 vUV;\n        void main(void) {\n            gl_Position = worldViewProjection * vec4(position, 1.0);\n            vUV = uv;\n        }",fa._RotationGizmoFragmentShader="\n        precision highp float;\n        varying vec2 vUV;\n        varying vec3 vPosition;\n        uniform vec3 angles;\n        #define twopi 6.283185307\n        void main(void) {\n            vec2 uv = vUV - vec2(0.5);\n            float angle = atan(uv.y, uv.x) + 3.141592;\n            float delta = gl_FrontFacing ? angles.y : -angles.y;\n            float begin = angles.x - delta * angles.z;\n            float start = (begin < (begin + delta)) ? begin : (begin + delta);\n            float end = (begin > (begin + delta)) ? begin : (begin + delta);\n            float len = sqrt(dot(uv,uv));\n            float opacity = 1. - step(0.5, len);\n\n            float base = abs(floor(start / twopi)) * twopi;\n            start += base;\n            end += base;\n\n            float intensity = 0.;\n            for (int i = 0; i < 5; i++)\n            {\n                intensity += max(step(start, angle) - step(end, angle), 0.);\n                angle += twopi;\n            }\n            gl_FragColor = vec4(1.,1.,0., min(intensity * 0.25, 0.8)) * opacity;\n        }";class _a extends Gn.t{get attachedMesh(){return this._meshAttached}set attachedMesh(e){this._meshAttached=e,this._nodeAttached=e,this._checkBillboardTransform(),[this.xGizmo,this.yGizmo,this.zGizmo].forEach((t=>{t.isEnabled?t.attachedMesh=e:t.attachedMesh=null}))}get attachedNode(){return this._nodeAttached}set attachedNode(e){this._meshAttached=null,this._nodeAttached=e,this._checkBillboardTransform(),[this.xGizmo,this.yGizmo,this.zGizmo].forEach((t=>{t.isEnabled?t.attachedNode=e:t.attachedNode=null}))}_checkBillboardTransform(){this._nodeAttached&&this._nodeAttached.billboardMode&&console.log("Rotation Gizmo will not work with transforms in billboard mode.")}get isHovered(){let e=!1;return[this.xGizmo,this.yGizmo,this.zGizmo].forEach((t=>{e=e||t.isHovered})),e}constructor(e=zn.x.DefaultUtilityLayer,t=32,i=!1,n=1,s,l){super(e),this.onDragStartObservable=new r.y$,this.onDragEndObservable=new r.y$,this._observables=[],this._gizmoAxisCache=new Map;const h=l&&l.xOptions&&l.xOptions.color?l.xOptions.color:a.Wo.Red().scale(.5),c=l&&l.yOptions&&l.yOptions.color?l.yOptions.color:a.Wo.Green().scale(.5),u=l&&l.zOptions&&l.zOptions.color?l.zOptions.color:a.Wo.Blue().scale(.5);this.xGizmo=new fa(new o.P(1,0,0),h,e,t,this,i,n),this.yGizmo=new fa(new o.P(0,1,0),c,e,t,this,i,n),this.zGizmo=new fa(new o.P(0,0,1),u,e,t,this,i,n),[this.xGizmo,this.yGizmo,this.zGizmo].forEach((e=>{l&&null!=l.updateScale&&(e.updateScale=l.updateScale),e.dragBehavior.onDragStartObservable.add((()=>{this.onDragStartObservable.notifyObservers({})})),e.dragBehavior.onDragEndObservable.add((()=>{this.onDragEndObservable.notifyObservers({})}))})),this.attachedMesh=null,this.attachedNode=null,s?s.addToAxisCache(this._gizmoAxisCache):Gn.t.GizmoAxisPointerObserver(e,this._gizmoAxisCache)}set updateGizmoRotationToMatchAttachedMesh(e){this.xGizmo&&(this.xGizmo.updateGizmoRotationToMatchAttachedMesh=e,this.yGizmo.updateGizmoRotationToMatchAttachedMesh=e,this.zGizmo.updateGizmoRotationToMatchAttachedMesh=e)}get updateGizmoRotationToMatchAttachedMesh(){return this.xGizmo.updateGizmoRotationToMatchAttachedMesh}set updateGizmoPositionToMatchAttachedMesh(e){this.xGizmo&&(this.xGizmo.updateGizmoPositionToMatchAttachedMesh=e,this.yGizmo.updateGizmoPositionToMatchAttachedMesh=e,this.zGizmo.updateGizmoPositionToMatchAttachedMesh=e)}get updateGizmoPositionToMatchAttachedMesh(){return this.xGizmo.updateGizmoPositionToMatchAttachedMesh}set updateScale(e){this.xGizmo&&(this.xGizmo.updateScale=e,this.yGizmo.updateScale=e,this.zGizmo.updateScale=e)}get updateScale(){return this.xGizmo.updateScale}set snapDistance(e){this.xGizmo&&(this.xGizmo.snapDistance=e,this.yGizmo.snapDistance=e,this.zGizmo.snapDistance=e)}get snapDistance(){return this.xGizmo.snapDistance}set scaleRatio(e){this.xGizmo&&(this.xGizmo.scaleRatio=e,this.yGizmo.scaleRatio=e,this.zGizmo.scaleRatio=e)}get scaleRatio(){return this.xGizmo.scaleRatio}addToAxisCache(e,t){this._gizmoAxisCache.set(e,t)}dispose(){this.xGizmo.dispose(),this.yGizmo.dispose(),this.zGizmo.dispose(),this.onDragStartObservable.clear(),this.onDragEndObservable.clear(),this._observables.forEach((e=>{this.gizmoLayer.utilityLayerScene.onPointerObservable.remove(e)}))}setCustomMesh(){_.Y.Error("Custom meshes are not supported on this gizmo, please set the custom meshes on the gizmos contained within this one (gizmo.xGizmo, gizmo.yGizmo, gizmo.zGizmo)")}}class ma extends Gn.t{get coloredMaterial(){return this._coloredMaterial}get hoverMaterial(){return this._hoverMaterial}get disableMaterial(){return this._disableMaterial}static _CreatePlane(e,t){const i=new yi.Y("plane",e),n=(0,pa.pT)("dragPlane",{width:.1375,height:.1375,sideOrientation:2},e);return n.material=t,n.parent=i,i}constructor(e,t=a.Wo.Gray(),i=zn.x.DefaultUtilityLayer,n=null){var s;super(i),this._pointerObserver=null,this.snapDistance=0,this.onSnapObservable=new r.y$,this._isEnabled=!1,this._parent=null,this._dragging=!1,this._parent=n,this._coloredMaterial=new Gi.K("",i.utilityLayerScene),this._coloredMaterial.diffuseColor=t,this._coloredMaterial.specularColor=t.subtract(new a.Wo(.1,.1,.1)),this._hoverMaterial=new Gi.K("",i.utilityLayerScene),this._hoverMaterial.diffuseColor=a.Wo.Yellow(),this._disableMaterial=new Gi.K("",i.utilityLayerScene),this._disableMaterial.diffuseColor=a.Wo.Gray(),this._disableMaterial.alpha=.4,this._gizmoMesh=ma._CreatePlane(i.utilityLayerScene,this._coloredMaterial),this._gizmoMesh.lookAt(this._rootMesh.position.add(e)),this._gizmoMesh.scaling.scaleInPlace(1/3),this._gizmoMesh.parent=this._rootMesh;let l=0;const h=new o.P,c={snapDistance:0};this.dragBehavior=new Le.M({dragPlaneNormal:e}),this.dragBehavior.moveAttached=!1,this._rootMesh.addBehavior(this.dragBehavior),this.dragBehavior.onDragObservable.add((e=>{if(this.attachedNode){if(this._handlePivot(),0==this.snapDistance)this.attachedNode.getWorldMatrix().addTranslationFromFloats(e.delta.x,e.delta.y,e.delta.z);else if(l+=e.dragDistance,Math.abs(l)>this.snapDistance){const t=Math.floor(Math.abs(l)/this.snapDistance);l%=this.snapDistance,e.delta.normalizeToRef(h),h.scaleInPlace(this.snapDistance*t),this.attachedNode.getWorldMatrix().addTranslationFromFloats(h.x,h.y,h.z),c.snapDistance=this.snapDistance*t,this.onSnapObservable.notifyObservers(c)}this._matrixChanged()}})),this.dragBehavior.onDragStartObservable.add((()=>{this._dragging=!0})),this.dragBehavior.onDragEndObservable.add((()=>{this._dragging=!1}));const u=i._getSharedGizmoLight();u.includedOnlyMeshes=u.includedOnlyMeshes.concat(this._rootMesh.getChildMeshes(!1));const d={gizmoMeshes:this._gizmoMesh.getChildMeshes(),colliderMeshes:this._gizmoMesh.getChildMeshes(),material:this._coloredMaterial,hoverMaterial:this._hoverMaterial,disableMaterial:this._disableMaterial,active:!1,dragBehavior:this.dragBehavior};null===(s=this._parent)||void 0===s||s.addToAxisCache(this._gizmoMesh,d),this._pointerObserver=i.utilityLayerScene.onPointerObservable.add((e=>{var t;if(!this._customMeshSet&&(this._isHovered=!(-1==d.colliderMeshes.indexOf(null===(t=null==e?void 0:e.pickInfo)||void 0===t?void 0:t.pickedMesh)),!this._parent)){const e=d.dragBehavior.enabled?this._isHovered||this._dragging?this._hoverMaterial:this._coloredMaterial:this._disableMaterial;this._setGizmoMeshMaterial(d.gizmoMeshes,e)}})),this.dragBehavior.onEnabledObservable.add((e=>{this._setGizmoMeshMaterial(d.gizmoMeshes,e?this._coloredMaterial:this._disableMaterial)}))}_attachedNodeChanged(e){this.dragBehavior&&(this.dragBehavior.enabled=!!e)}set isEnabled(e){this._isEnabled=e,e?this._parent&&(this.attachedNode=this._parent.attachedNode):this.attachedNode=null}get isEnabled(){return this._isEnabled}dispose(){this.onSnapObservable.clear(),this.gizmoLayer.utilityLayerScene.onPointerObservable.remove(this._pointerObserver),this.dragBehavior.detach(),super.dispose(),this._gizmoMesh&&this._gizmoMesh.dispose(),[this._coloredMaterial,this._hoverMaterial,this._disableMaterial].forEach((e=>{e&&e.dispose()}))}}class ga extends Gn.t{get attachedMesh(){return this._meshAttached}set attachedMesh(e){this._meshAttached=e,this._nodeAttached=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.xPlaneGizmo,this.yPlaneGizmo,this.zPlaneGizmo].forEach((t=>{t.isEnabled?t.attachedMesh=e:t.attachedMesh=null}))}get attachedNode(){return this._nodeAttached}set attachedNode(e){this._meshAttached=null,this._nodeAttached=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.xPlaneGizmo,this.yPlaneGizmo,this.zPlaneGizmo].forEach((t=>{t.isEnabled?t.attachedNode=e:t.attachedNode=null}))}get isHovered(){let e=!1;return[this.xGizmo,this.yGizmo,this.zGizmo,this.xPlaneGizmo,this.yPlaneGizmo,this.zPlaneGizmo].forEach((t=>{e=e||t.isHovered})),e}constructor(e=zn.x.DefaultUtilityLayer,t=1,i){super(e),this._meshAttached=null,this._nodeAttached=null,this._observables=[],this._gizmoAxisCache=new Map,this.onDragStartObservable=new r.y$,this.onDragEndObservable=new r.y$,this._planarGizmoEnabled=!1,this.xGizmo=new Wn(new o.P(1,0,0),a.Wo.Red().scale(.5),e,this,t),this.yGizmo=new Wn(new o.P(0,1,0),a.Wo.Green().scale(.5),e,this,t),this.zGizmo=new Wn(new o.P(0,0,1),a.Wo.Blue().scale(.5),e,this,t),this.xPlaneGizmo=new ma(new o.P(1,0,0),a.Wo.Red().scale(.5),this.gizmoLayer,this),this.yPlaneGizmo=new ma(new o.P(0,1,0),a.Wo.Green().scale(.5),this.gizmoLayer,this),this.zPlaneGizmo=new ma(new o.P(0,0,1),a.Wo.Blue().scale(.5),this.gizmoLayer,this),[this.xGizmo,this.yGizmo,this.zGizmo,this.xPlaneGizmo,this.yPlaneGizmo,this.zPlaneGizmo].forEach((e=>{e.dragBehavior.onDragStartObservable.add((()=>{this.onDragStartObservable.notifyObservers({})})),e.dragBehavior.onDragEndObservable.add((()=>{this.onDragEndObservable.notifyObservers({})}))})),this.attachedMesh=null,i?i.addToAxisCache(this._gizmoAxisCache):Gn.t.GizmoAxisPointerObserver(e,this._gizmoAxisCache)}set planarGizmoEnabled(e){this._planarGizmoEnabled=e,[this.xPlaneGizmo,this.yPlaneGizmo,this.zPlaneGizmo].forEach((t=>{t&&(t.isEnabled=e,e&&(t.attachedMesh?t.attachedMesh=this.attachedMesh:t.attachedNode=this.attachedNode))}),this)}get planarGizmoEnabled(){return this._planarGizmoEnabled}set updateGizmoRotationToMatchAttachedMesh(e){this._updateGizmoRotationToMatchAttachedMesh=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.xPlaneGizmo,this.yPlaneGizmo,this.zPlaneGizmo].forEach((t=>{t&&(t.updateGizmoRotationToMatchAttachedMesh=e)}))}get updateGizmoRotationToMatchAttachedMesh(){return this._updateGizmoRotationToMatchAttachedMesh}set updateGizmoPositionToMatchAttachedMesh(e){this._updateGizmoPositionToMatchAttachedMesh=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.xPlaneGizmo,this.yPlaneGizmo,this.zPlaneGizmo].forEach((t=>{t&&(t.updateGizmoPositionToMatchAttachedMesh=e)}))}get updateGizmoPositionToMatchAttachedMesh(){return this._updateGizmoPositionToMatchAttachedMesh}set updateScale(e){this.xGizmo&&(this.xGizmo.updateScale=e,this.yGizmo.updateScale=e,this.zGizmo.updateScale=e)}get updateScale(){return this.xGizmo.updateScale}set snapDistance(e){this._snapDistance=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.xPlaneGizmo,this.yPlaneGizmo,this.zPlaneGizmo].forEach((t=>{t&&(t.snapDistance=e)}))}get snapDistance(){return this._snapDistance}set scaleRatio(e){this._scaleRatio=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.xPlaneGizmo,this.yPlaneGizmo,this.zPlaneGizmo].forEach((t=>{t&&(t.scaleRatio=e)}))}get scaleRatio(){return this._scaleRatio}addToAxisCache(e,t){this._gizmoAxisCache.set(e,t)}dispose(){[this.xGizmo,this.yGizmo,this.zGizmo,this.xPlaneGizmo,this.yPlaneGizmo,this.zPlaneGizmo].forEach((e=>{e&&e.dispose()})),this._observables.forEach((e=>{this.gizmoLayer.utilityLayerScene.onPointerObservable.remove(e)})),this.onDragStartObservable.clear(),this.onDragEndObservable.clear()}setCustomMesh(){_.Y.Error("Custom meshes are not supported on this gizmo, please set the custom meshes on the gizmos contained within this one (gizmo.xGizmo, gizmo.yGizmo, gizmo.zGizmo,gizmo.xPlaneGizmo, gizmo.yPlaneGizmo, gizmo.zPlaneGizmo)")}}function va(e){const t=[];t[0]={vertex:[[0,0,1.732051],[1.632993,0,-.5773503],[-.8164966,1.414214,-.5773503],[-.8164966,-1.414214,-.5773503]],face:[[0,1,2],[0,2,3],[0,3,1],[1,3,2]]},t[1]={vertex:[[0,0,1.414214],[1.414214,0,0],[0,1.414214,0],[-1.414214,0,0],[0,-1.414214,0],[0,0,-1.414214]],face:[[0,1,2],[0,2,3],[0,3,4],[0,4,1],[1,4,5],[1,5,2],[2,5,3],[3,5,4]]},t[2]={vertex:[[0,0,1.070466],[.7136442,0,.7978784],[-.3568221,.618034,.7978784],[-.3568221,-.618034,.7978784],[.7978784,.618034,.3568221],[.7978784,-.618034,.3568221],[-.9341724,.381966,.3568221],[.1362939,1,.3568221],[.1362939,-1,.3568221],[-.9341724,-.381966,.3568221],[.9341724,.381966,-.3568221],[.9341724,-.381966,-.3568221],[-.7978784,.618034,-.3568221],[-.1362939,1,-.3568221],[-.1362939,-1,-.3568221],[-.7978784,-.618034,-.3568221],[.3568221,.618034,-.7978784],[.3568221,-.618034,-.7978784],[-.7136442,0,-.7978784],[0,0,-1.070466]],face:[[0,1,4,7,2],[0,2,6,9,3],[0,3,8,5,1],[1,5,11,10,4],[2,7,13,12,6],[3,9,15,14,8],[4,10,16,13,7],[5,8,14,17,11],[6,12,18,15,9],[10,11,17,19,16],[12,13,16,19,18],[14,15,18,19,17]]},t[3]={vertex:[[0,0,1.175571],[1.051462,0,.5257311],[.3249197,1,.5257311],[-.8506508,.618034,.5257311],[-.8506508,-.618034,.5257311],[.3249197,-1,.5257311],[.8506508,.618034,-.5257311],[.8506508,-.618034,-.5257311],[-.3249197,1,-.5257311],[-1.051462,0,-.5257311],[-.3249197,-1,-.5257311],[0,0,-1.175571]],face:[[0,1,2],[0,2,3],[0,3,4],[0,4,5],[0,5,1],[1,5,7],[1,7,6],[1,6,2],[2,6,8],[2,8,3],[3,8,9],[3,9,4],[4,9,10],[4,10,5],[5,10,7],[6,7,11],[6,11,8],[7,10,11],[8,11,9],[9,11,10]]},t[4]={vertex:[[0,0,1.070722],[.7148135,0,.7971752],[-.104682,.7071068,.7971752],[-.6841528,.2071068,.7971752],[-.104682,-.7071068,.7971752],[.6101315,.7071068,.5236279],[1.04156,.2071068,.1367736],[.6101315,-.7071068,.5236279],[-.3574067,1,.1367736],[-.7888348,-.5,.5236279],[-.9368776,.5,.1367736],[-.3574067,-1,.1367736],[.3574067,1,-.1367736],[.9368776,-.5,-.1367736],[.7888348,.5,-.5236279],[.3574067,-1,-.1367736],[-.6101315,.7071068,-.5236279],[-1.04156,-.2071068,-.1367736],[-.6101315,-.7071068,-.5236279],[.104682,.7071068,-.7971752],[.6841528,-.2071068,-.7971752],[.104682,-.7071068,-.7971752],[-.7148135,0,-.7971752],[0,0,-1.070722]],face:[[0,2,3],[1,6,5],[4,9,11],[7,15,13],[8,16,10],[12,14,19],[17,22,18],[20,21,23],[0,1,5,2],[0,3,9,4],[0,4,7,1],[1,7,13,6],[2,5,12,8],[2,8,10,3],[3,10,17,9],[4,11,15,7],[5,6,14,12],[6,13,20,14],[8,12,19,16],[9,17,18,11],[10,16,22,17],[11,18,21,15],[13,15,21,20],[14,20,23,19],[16,19,23,22],[18,22,23,21]]},t[5]={vertex:[[0,0,1.322876],[1.309307,0,.1889822],[-.9819805,.8660254,.1889822],[.1636634,-1.299038,.1889822],[.3273268,.8660254,-.9449112],[-.8183171,-.4330127,-.9449112]],face:[[0,3,1],[2,4,5],[0,1,4,2],[0,2,5,3],[1,3,5,4]]},t[6]={vertex:[[0,0,1.159953],[1.013464,0,.5642542],[-.3501431,.9510565,.5642542],[-.7715208,-.6571639,.5642542],[.6633206,.9510565,-.03144481],[.8682979,-.6571639,-.3996071],[-1.121664,.2938926,-.03144481],[-.2348831,-1.063314,-.3996071],[.5181548,.2938926,-.9953061],[-.5850262,-.112257,-.9953061]],face:[[0,1,4,2],[0,2,6,3],[1,5,8,4],[3,6,9,7],[5,7,9,8],[0,3,7,5,1],[2,4,8,9,6]]},t[7]={vertex:[[0,0,1.118034],[.8944272,0,.6708204],[-.2236068,.8660254,.6708204],[-.7826238,-.4330127,.6708204],[.6708204,.8660254,.2236068],[1.006231,-.4330127,-.2236068],[-1.006231,.4330127,.2236068],[-.6708204,-.8660254,-.2236068],[.7826238,.4330127,-.6708204],[.2236068,-.8660254,-.6708204],[-.8944272,0,-.6708204],[0,0,-1.118034]],face:[[0,1,4,2],[0,2,6,3],[1,5,8,4],[3,6,10,7],[5,9,11,8],[7,10,11,9],[0,3,7,9,5,1],[2,4,8,11,10,6]]},t[8]={vertex:[[-.729665,.670121,.319155],[-.655235,-.29213,-.754096],[-.093922,-.607123,.537818],[.702196,.595691,.485187],[.776626,-.36656,-.588064]],face:[[1,4,2],[0,1,2],[3,0,2],[4,3,2],[4,1,0,3]]},t[9]={vertex:[[-.868849,-.100041,.61257],[-.329458,.976099,.28078],[-.26629,-.013796,-.477654],[-.13392,-1.034115,.229829],[.738834,.707117,-.307018],[.859683,-.535264,-.338508]],face:[[3,0,2],[5,3,2],[4,5,2],[1,4,2],[0,1,2],[0,3,5,4,1]]},t[10]={vertex:[[-.610389,.243975,.531213],[-.187812,-.48795,-.664016],[-.187812,.9759,-.664016],[.187812,-.9759,.664016],[.798201,.243975,.132803]],face:[[1,3,0],[3,4,0],[3,1,4],[0,2,1],[0,4,2],[2,4,1]]},t[11]={vertex:[[-1.028778,.392027,-.048786],[-.640503,-.646161,.621837],[-.125162,-.395663,-.540059],[.004683,.888447,-.651988],[.125161,.395663,.540059],[.632925,-.791376,.433102],[1.031672,.157063,-.354165]],face:[[3,2,0],[2,1,0],[2,5,1],[0,4,3],[0,1,4],[4,1,5],[2,3,6],[3,4,6],[5,2,6],[4,5,6]]},t[12]={vertex:[[-.669867,.334933,-.529576],[-.669867,.334933,.529577],[-.4043,1.212901,0],[-.334933,-.669867,-.529576],[-.334933,-.669867,.529577],[.334933,.669867,-.529576],[.334933,.669867,.529577],[.4043,-1.212901,0],[.669867,-.334933,-.529576],[.669867,-.334933,.529577]],face:[[8,9,7],[6,5,2],[3,8,7],[5,0,2],[4,3,7],[0,1,2],[9,4,7],[1,6,2],[9,8,5,6],[8,3,0,5],[3,4,1,0],[4,9,6,1]]},t[13]={vertex:[[-.931836,.219976,-.264632],[-.636706,.318353,.692816],[-.613483,-.735083,-.264632],[-.326545,.979634,0],[-.318353,-.636706,.692816],[-.159176,.477529,-.856368],[.159176,-.477529,-.856368],[.318353,.636706,.692816],[.326545,-.979634,0],[.613482,.735082,-.264632],[.636706,-.318353,.692816],[.931835,-.219977,-.264632]],face:[[11,10,8],[7,9,3],[6,11,8],[9,5,3],[2,6,8],[5,0,3],[4,2,8],[0,1,3],[10,4,8],[1,7,3],[10,11,9,7],[11,6,5,9],[6,2,0,5],[2,4,1,0],[4,10,7,1]]},t[14]={vertex:[[-.93465,.300459,-.271185],[-.838689,-.260219,-.516017],[-.711319,.717591,.128359],[-.710334,-.156922,.080946],[-.599799,.556003,-.725148],[-.503838,-.004675,-.969981],[-.487004,.26021,.48049],[-.460089,-.750282,-.512622],[-.376468,.973135,-.325605],[-.331735,-.646985,.084342],[-.254001,.831847,.530001],[-.125239,-.494738,-.966586],[.029622,.027949,.730817],[.056536,-.982543,-.262295],[.08085,1.087391,.076037],[.125583,-.532729,.485984],[.262625,.599586,.780328],[.391387,-.726999,-.716259],[.513854,-.868287,.139347],[.597475,.85513,.326364],[.641224,.109523,.783723],[.737185,-.451155,.538891],[.848705,-.612742,-.314616],[.976075,.365067,.32976],[1.072036,-.19561,.084927]],face:[[15,18,21],[12,20,16],[6,10,2],[3,0,1],[9,7,13],[2,8,4,0],[0,4,5,1],[1,5,11,7],[7,11,17,13],[13,17,22,18],[18,22,24,21],[21,24,23,20],[20,23,19,16],[16,19,14,10],[10,14,8,2],[15,9,13,18],[12,15,21,20],[6,12,16,10],[3,6,2,0],[9,3,1,7],[9,15,12,6,3],[22,17,11,5,4,8,14,19,23,24]]};const i=e.type&&(e.type<0||e.type>=t.length)?0:e.type||0,n=e.size,s=e.sizeX||n||1,r=e.sizeY||n||1,l=e.sizeZ||n||1,h=e.custom||t[i],c=h.face.length,u=e.faceUV||new Array(c),d=e.faceColors,p=void 0===e.flat||e.flat,f=0===e.sideOrientation?0:e.sideOrientation||sn.x.DEFAULTSIDE,_=new Array,m=new Array,g=new Array,v=new Array,y=new Array;let x=0,b=0;const T=new Array;let S,E,C,A,P,R,M=0,I=0;if(p)for(I=0;I<c;I++)d&&void 0===d[I]&&(d[I]=new a.HE(1,1,1,1)),u&&void 0===u[I]&&(u[I]=new o.Lt(0,0,1,1));if(p)for(I=0;I<c;I++){const e=h.face[I].length;for(C=2*Math.PI/e,A=.5*Math.tan(C/2),P=.5,M=0;M<e;M++)_.push(h.vertex[h.face[I][M]][0]*s,h.vertex[h.face[I][M]][1]*r,h.vertex[h.face[I][M]][2]*l),T.push(x),x++,S=u[I].x+(u[I].z-u[I].x)*(.5+A),E=u[I].y+(u[I].w-u[I].y)*(P-.5),v.push(S,rn.e.UseOpenGLOrientationForUV?1-E:E),R=A*Math.cos(C)-P*Math.sin(C),P=A*Math.sin(C)+P*Math.cos(C),A=R,d&&y.push(d[I].r,d[I].g,d[I].b,d[I].a);for(M=0;M<e-2;M++)m.push(T[0+b],T[M+2+b],T[M+1+b]);b+=e}else{for(M=0;M<h.vertex.length;M++)_.push(h.vertex[M][0]*s,h.vertex[M][1]*r,h.vertex[M][2]*l),v.push(0,rn.e.UseOpenGLOrientationForUV?1:0);for(I=0;I<c;I++)for(M=0;M<h.face[I].length-2;M++)m.push(h.face[I][0],h.face[I][M+2],h.face[I][M+1])}sn.x.ComputeNormals(_,m,g),sn.x._ComputeSides(f,_,m,g,v,e.frontUVs,e.backUVs);const D=new sn.x;return D.positions=_,D.indices=m,D.normals=g,D.uvs=v,d&&p&&(D.colors=y),D}function ya(e,t={},i=null){const n=new Nt.Kj(e,i);return t.sideOrientation=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),n._originalBuilderSideOrientation=t.sideOrientation,va(t).applyToMesh(n,t.updatable),n}const xa={CreatePolyhedron:ya};sn.x.CreatePolyhedron=va,Nt.Kj.CreatePolyhedron=(e,t,i)=>ya(e,t,i);class ba extends Gn.t{get coloredMaterial(){return this._coloredMaterial}get hoverMaterial(){return this._hoverMaterial}get disableMaterial(){return this._disableMaterial}get attachedMesh(){return this._meshAttached}set attachedMesh(e){this._meshAttached=e,this._nodeAttached=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.uniformScaleGizmo].forEach((t=>{t.isEnabled?t.attachedMesh=e:t.attachedMesh=null}))}get attachedNode(){return this._nodeAttached}set attachedNode(e){this._meshAttached=null,this._nodeAttached=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.uniformScaleGizmo].forEach((t=>{t.isEnabled?t.attachedNode=e:t.attachedNode=null}))}set updateScale(e){this.xGizmo&&(this.xGizmo.updateScale=e,this.yGizmo.updateScale=e,this.zGizmo.updateScale=e)}get updateScale(){return this.xGizmo.updateScale}get isHovered(){let e=!1;return[this.xGizmo,this.yGizmo,this.zGizmo].forEach((t=>{e=e||t.isHovered})),e}constructor(e=zn.x.DefaultUtilityLayer,t=1,i){super(e),this._meshAttached=null,this._nodeAttached=null,this._sensitivity=1,this._observables=[],this._gizmoAxisCache=new Map,this.onDragStartObservable=new r.y$,this.onDragEndObservable=new r.y$,this.uniformScaleGizmo=this._createUniformScaleMesh(),this.xGizmo=new ca(new o.P(1,0,0),a.Wo.Red().scale(.5),e,this,t),this.yGizmo=new ca(new o.P(0,1,0),a.Wo.Green().scale(.5),e,this,t),this.zGizmo=new ca(new o.P(0,0,1),a.Wo.Blue().scale(.5),e,this,t),[this.xGizmo,this.yGizmo,this.zGizmo,this.uniformScaleGizmo].forEach((e=>{e.dragBehavior.onDragStartObservable.add((()=>{this.onDragStartObservable.notifyObservers({})})),e.dragBehavior.onDragEndObservable.add((()=>{this.onDragEndObservable.notifyObservers({})}))})),this.attachedMesh=null,this.attachedNode=null,i?i.addToAxisCache(this._gizmoAxisCache):Gn.t.GizmoAxisPointerObserver(e,this._gizmoAxisCache)}_createUniformScaleMesh(){this._coloredMaterial=new Gi.K("",this.gizmoLayer.utilityLayerScene),this._coloredMaterial.diffuseColor=a.Wo.Gray(),this._hoverMaterial=new Gi.K("",this.gizmoLayer.utilityLayerScene),this._hoverMaterial.diffuseColor=a.Wo.Yellow(),this._disableMaterial=new Gi.K("",this.gizmoLayer.utilityLayerScene),this._disableMaterial.diffuseColor=a.Wo.Gray(),this._disableMaterial.alpha=.4;const e=new ca(new o.P(0,1,0),a.Wo.Gray().scale(.5),this.gizmoLayer,this);e.updateGizmoRotationToMatchAttachedMesh=!1,e.uniformScaling=!0,this._uniformScalingMesh=ya("uniform",{type:1},e.gizmoLayer.utilityLayerScene),this._uniformScalingMesh.scaling.scaleInPlace(.01),this._uniformScalingMesh.visibility=0,this._octahedron=ya("",{type:1},e.gizmoLayer.utilityLayerScene),this._octahedron.scaling.scaleInPlace(.007),this._uniformScalingMesh.addChild(this._octahedron),e.setCustomMesh(this._uniformScalingMesh,!0);const t=this.gizmoLayer._getSharedGizmoLight();t.includedOnlyMeshes=t.includedOnlyMeshes.concat(this._octahedron);const i={gizmoMeshes:[this._octahedron,this._uniformScalingMesh],colliderMeshes:[this._uniformScalingMesh],material:this._coloredMaterial,hoverMaterial:this._hoverMaterial,disableMaterial:this._disableMaterial,active:!1,dragBehavior:e.dragBehavior};return this.addToAxisCache(e._rootMesh,i),e}set updateGizmoRotationToMatchAttachedMesh(e){e?(this._updateGizmoRotationToMatchAttachedMesh=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.uniformScaleGizmo].forEach((t=>{t&&(t.updateGizmoRotationToMatchAttachedMesh=e)}))):_.Y.Warn("Setting updateGizmoRotationToMatchAttachedMesh = false on scaling gizmo is not supported.")}get updateGizmoRotationToMatchAttachedMesh(){return this._updateGizmoRotationToMatchAttachedMesh}set snapDistance(e){this._snapDistance=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.uniformScaleGizmo].forEach((t=>{t&&(t.snapDistance=e)}))}get snapDistance(){return this._snapDistance}set scaleRatio(e){this._scaleRatio=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.uniformScaleGizmo].forEach((t=>{t&&(t.scaleRatio=e)}))}get scaleRatio(){return this._scaleRatio}set sensitivity(e){this._sensitivity=e,[this.xGizmo,this.yGizmo,this.zGizmo,this.uniformScaleGizmo].forEach((t=>{t&&(t.sensitivity=e)}))}get sensitivity(){return this._sensitivity}addToAxisCache(e,t){this._gizmoAxisCache.set(e,t)}dispose(){[this.xGizmo,this.yGizmo,this.zGizmo,this.uniformScaleGizmo].forEach((e=>{e&&e.dispose()})),this._observables.forEach((e=>{this.gizmoLayer.utilityLayerScene.onPointerObservable.remove(e)})),this.onDragStartObservable.clear(),this.onDragEndObservable.clear(),[this._uniformScalingMesh,this._octahedron].forEach((e=>{e&&e.dispose()})),[this._coloredMaterial,this._hoverMaterial,this._disableMaterial].forEach((e=>{e&&e.dispose()}))}}class Ta{get keepDepthUtilityLayer(){return this._defaultKeepDepthUtilityLayer}get utilityLayer(){return this._defaultUtilityLayer}get isHovered(){let e=!1;for(const t in this.gizmos){const i=this.gizmos[t];if(i&&i.isHovered){e=!0;break}}return e}set scaleRatio(e){this._scaleRatio=e,[this.gizmos.positionGizmo,this.gizmos.rotationGizmo,this.gizmos.scaleGizmo].forEach((t=>{t&&(t.scaleRatio=e)}))}get scaleRatio(){return this._scaleRatio}constructor(e,t=1,i=zn.x.DefaultUtilityLayer,n=zn.x.DefaultKeepDepthUtilityLayer){this._scene=e,this.clearGizmoOnEmptyPointerEvent=!1,this.enableAutoPicking=!0,this.onAttachedToMeshObservable=new r.y$,this.onAttachedToNodeObservable=new r.y$,this._gizmosEnabled={positionGizmo:!1,rotationGizmo:!1,scaleGizmo:!1,boundingBoxGizmo:!1},this._pointerObservers=[],this._attachedMesh=null,this._attachedNode=null,this._boundingBoxColor=a.Wo.FromHexString("#0984e3"),this._thickness=1,this._scaleRatio=1,this._gizmoAxisCache=new Map,this.boundingBoxDragBehavior=new Ue.K,this.attachableMeshes=null,this.attachableNodes=null,this.usePointerToAttachGizmos=!0,this._defaultUtilityLayer=i,this._defaultKeepDepthUtilityLayer=n,this._defaultKeepDepthUtilityLayer.utilityLayerScene.autoClearDepthAndStencil=!1,this._thickness=t,this.gizmos={positionGizmo:null,rotationGizmo:null,scaleGizmo:null,boundingBoxGizmo:null};const s=this._attachToMeshPointerObserver(e),o=Gn.t.GizmoAxisPointerObserver(this._defaultUtilityLayer,this._gizmoAxisCache);this._pointerObservers=[s,o]}_attachToMeshPointerObserver(e){const t=e.onPointerObservable.add((e=>{if(this.usePointerToAttachGizmos&&e.type==Re.kD.POINTERDOWN)if(e.pickInfo&&e.pickInfo.pickedMesh){if(this.enableAutoPicking){let t=e.pickInfo.pickedMesh;if(null==this.attachableMeshes)for(;t&&null!=t.parent;)t=t.parent;else{let e=!1;this.attachableMeshes.forEach((i=>{t&&(t==i||t.isDescendantOf(i))&&(t=i,e=!0)})),e||(t=null)}t instanceof Un.x?this._attachedMesh!=t&&this.attachToMesh(t):this.clearGizmoOnEmptyPointerEvent&&this.attachToMesh(null)}}else this.clearGizmoOnEmptyPointerEvent&&this.attachToMesh(null)}));return t}attachToMesh(e){this._attachedMesh&&this._attachedMesh.removeBehavior(this.boundingBoxDragBehavior),this._attachedNode&&this._attachedNode.removeBehavior(this.boundingBoxDragBehavior),this._attachedMesh=e,this._attachedNode=null;for(const t in this.gizmos){const i=this.gizmos[t];i&&this._gizmosEnabled[t]&&(i.attachedMesh=e)}this.boundingBoxGizmoEnabled&&this._attachedMesh&&this._attachedMesh.addBehavior(this.boundingBoxDragBehavior),this.onAttachedToMeshObservable.notifyObservers(e)}attachToNode(e){this._attachedMesh&&this._attachedMesh.removeBehavior(this.boundingBoxDragBehavior),this._attachedNode&&this._attachedNode.removeBehavior(this.boundingBoxDragBehavior),this._attachedMesh=null,this._attachedNode=e;for(const t in this.gizmos){const i=this.gizmos[t];i&&this._gizmosEnabled[t]&&(i.attachedNode=e)}this.boundingBoxGizmoEnabled&&this._attachedNode&&this._attachedNode.addBehavior(this.boundingBoxDragBehavior),this.onAttachedToNodeObservable.notifyObservers(e)}set positionGizmoEnabled(e){e?(this.gizmos.positionGizmo||(this.gizmos.positionGizmo=new ga(this._defaultUtilityLayer,this._thickness,this)),this._attachedNode?this.gizmos.positionGizmo.attachedNode=this._attachedNode:this.gizmos.positionGizmo.attachedMesh=this._attachedMesh):this.gizmos.positionGizmo&&(this.gizmos.positionGizmo.attachedNode=null),this._gizmosEnabled.positionGizmo=e}get positionGizmoEnabled(){return this._gizmosEnabled.positionGizmo}set rotationGizmoEnabled(e){e?(this.gizmos.rotationGizmo||(this.gizmos.rotationGizmo=new _a(this._defaultUtilityLayer,32,!1,this._thickness,this)),this._attachedNode?this.gizmos.rotationGizmo.attachedNode=this._attachedNode:this.gizmos.rotationGizmo.attachedMesh=this._attachedMesh):this.gizmos.rotationGizmo&&(this.gizmos.rotationGizmo.attachedNode=null),this._gizmosEnabled.rotationGizmo=e}get rotationGizmoEnabled(){return this._gizmosEnabled.rotationGizmo}set scaleGizmoEnabled(e){e?(this.gizmos.scaleGizmo=this.gizmos.scaleGizmo||new ba(this._defaultUtilityLayer,this._thickness,this),this._attachedNode?this.gizmos.scaleGizmo.attachedNode=this._attachedNode:this.gizmos.scaleGizmo.attachedMesh=this._attachedMesh):this.gizmos.scaleGizmo&&(this.gizmos.scaleGizmo.attachedNode=null),this._gizmosEnabled.scaleGizmo=e}get scaleGizmoEnabled(){return this._gizmosEnabled.scaleGizmo}set boundingBoxGizmoEnabled(e){e?(this.gizmos.boundingBoxGizmo=this.gizmos.boundingBoxGizmo||new da(this._boundingBoxColor,this._defaultKeepDepthUtilityLayer),this._attachedMesh?this.gizmos.boundingBoxGizmo.attachedMesh=this._attachedMesh:this.gizmos.boundingBoxGizmo.attachedNode=this._attachedNode,this._attachedMesh?(this._attachedMesh.removeBehavior(this.boundingBoxDragBehavior),this._attachedMesh.addBehavior(this.boundingBoxDragBehavior)):this._attachedNode&&(this._attachedNode.removeBehavior(this.boundingBoxDragBehavior),this._attachedNode.addBehavior(this.boundingBoxDragBehavior))):this.gizmos.boundingBoxGizmo&&(this._attachedMesh?this._attachedMesh.removeBehavior(this.boundingBoxDragBehavior):this._attachedNode&&this._attachedNode.removeBehavior(this.boundingBoxDragBehavior),this.gizmos.boundingBoxGizmo.attachedNode=null),this._gizmosEnabled.boundingBoxGizmo=e}get boundingBoxGizmoEnabled(){return this._gizmosEnabled.boundingBoxGizmo}addToAxisCache(e){e.size>0&&e.forEach(((e,t)=>{this._gizmoAxisCache.set(t,e)}))}dispose(){var e,t;this._pointerObservers.forEach((e=>{this._scene.onPointerObservable.remove(e)}));for(const e in this.gizmos){const t=this.gizmos[e];t&&t.dispose()}this._defaultKeepDepthUtilityLayer!==zn.x._DefaultKeepDepthUtilityLayer&&(null===(e=this._defaultKeepDepthUtilityLayer)||void 0===e||e.dispose()),this._defaultUtilityLayer!==zn.x._DefaultUtilityLayer&&(null===(t=this._defaultUtilityLayer)||void 0===t||t.dispose()),this.boundingBoxDragBehavior.detach(),this.onAttachedToMeshObservable.clear()}}var Sa=i(7951);function Ea(e){const t=new Array,i=new Array,n=new Array,s=new Array,r=e.radius||.5,o=e.tessellation||64,a=e.arc&&(e.arc<=0||e.arc>1)?1:e.arc||1,l=0===e.sideOrientation?0:e.sideOrientation||sn.x.DEFAULTSIDE;t.push(0,0,0),s.push(.5,.5);const h=2*Math.PI*a,c=1===a?h/o:h/(o-1);let u=0;for(let e=0;e<o;e++){const e=Math.cos(u),i=Math.sin(u),n=(e+1)/2,o=(1-i)/2;t.push(r*e,r*i,0),s.push(n,rn.e.UseOpenGLOrientationForUV?1-o:o),u+=c}1===a&&(t.push(t[3],t[4],t[5]),s.push(s[2],rn.e.UseOpenGLOrientationForUV?1-s[3]:s[3]));const d=t.length/3;for(let e=1;e<d-1;e++)i.push(e+1,0,e);sn.x.ComputeNormals(t,i,n),sn.x._ComputeSides(l,t,i,n,s,e.frontUVs,e.backUVs);const p=new sn.x;return p.indices=i,p.positions=t,p.normals=n,p.uvs=s,p}function Ca(e,t={},i=null){const n=new Nt.Kj(e,i);return t.sideOrientation=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),n._originalBuilderSideOrientation=t.sideOrientation,Ea(t).applyToMesh(n,t.updatable),n}const Aa={CreateDisc:Ca};function Pa(e,t={},i){t.diameter||(t.diameter=1),t.segments||(t.segments=16);const n=Kn("",{slice:.5,diameter:t.diameter,segments:t.segments},i),s=Ca("",{radius:t.diameter/2,tessellation:3*t.segments+(4-t.segments)},i);s.rotation.x=-Math.PI/2,s.parent=n;const r=Nt.Kj.MergeMeshes([s,n],!0);return r.name=e,r}sn.x.CreateDisc=Ea,Nt.Kj.CreateDisc=(e,t,i,n=null,s,r)=>Ca(e,{radius:t,tessellation:i,sideOrientation:r,updatable:s},n);const Ra={CreateHemisphere:Pa};Nt.Kj.CreateHemisphere=(e,t,i,n)=>Pa(e,{segments:t,diameter:i},n);var Ma=i(6317);class Ia extends Gn.t{constructor(e=zn.x.DefaultUtilityLayer){super(e),this._cachedPosition=new o.P,this._cachedForward=new o.P(0,0,1),this._pointerObserver=null,this.onClickedObservable=new r.y$,this._light=null,this.attachedMesh=new Un.x("",this.gizmoLayer.utilityLayerScene),this._attachedMeshParent=new yi.Y("parent",this.gizmoLayer.utilityLayerScene),this.attachedMesh.parent=this._attachedMeshParent,this._material=new Gi.K("light",this.gizmoLayer.utilityLayerScene),this._material.diffuseColor=new a.Wo(.5,.5,.5),this._material.specularColor=new a.Wo(.1,.1,.1),this._pointerObserver=e.utilityLayerScene.onPointerObservable.add((e=>{this._light&&(this._isHovered=!(!e.pickInfo||-1==this._rootMesh.getChildMeshes().indexOf(e.pickInfo.pickedMesh)),this._isHovered&&0===e.event.button&&this.onClickedObservable.notifyObservers(this._light))}),Re.kD.POINTERDOWN)}get attachedNode(){return this.attachedMesh}set attachedNode(e){console.warn("Nodes cannot be attached to LightGizmo. Attach to a mesh instead.")}set light(e){if(this._light=e,e){this._lightMesh&&this._lightMesh.dispose(),e instanceof Li.e?this._lightMesh=Ia._CreateHemisphericLightMesh(this.gizmoLayer.utilityLayerScene):e instanceof Sa.O?this._lightMesh=Ia._CreateDirectionalLightMesh(this.gizmoLayer.utilityLayerScene):e instanceof Ma.P?this._lightMesh=Ia._CreateSpotLightMesh(this.gizmoLayer.utilityLayerScene):this._lightMesh=Ia._CreatePointLightMesh(this.gizmoLayer.utilityLayerScene),this._lightMesh.getChildMeshes(!1).forEach((e=>{e.material=this._material})),this._lightMesh.parent=this._rootMesh;const t=this.gizmoLayer._getSharedGizmoLight();t.includedOnlyMeshes=t.includedOnlyMeshes.concat(this._lightMesh.getChildMeshes(!1)),this._lightMesh.rotationQuaternion=new o._f,this.attachedMesh.reservedDataStore||(this.attachedMesh.reservedDataStore={}),this.attachedMesh.reservedDataStore.lightGizmo=this,e.parent&&this._attachedMeshParent.freezeWorldMatrix(e.parent.getWorldMatrix()),e.position&&(this.attachedMesh.position.copyFrom(e.position),this.attachedMesh.computeWorldMatrix(!0),this._cachedPosition.copyFrom(this.attachedMesh.position)),e.direction&&(this.attachedMesh.setDirection(e.direction),this.attachedMesh.computeWorldMatrix(!0),this._cachedForward.copyFrom(this.attachedMesh.forward)),this._update()}}get light(){return this._light}get material(){return this._material}_update(){if(super._update(),this._light){if(this._light.parent&&this._attachedMeshParent.freezeWorldMatrix(this._light.parent.getWorldMatrix()),this._light.position)if(this.attachedMesh.position.equals(this._cachedPosition))this.attachedMesh.position.copyFrom(this._light.position),this.attachedMesh.computeWorldMatrix(!0),this._cachedPosition.copyFrom(this.attachedMesh.position);else{const e=this.attachedMesh.position;this._light.position=new o.P(e.x,e.y,e.z),this._cachedPosition.copyFrom(this.attachedMesh.position)}if(this._light.direction)if(o.P.DistanceSquared(this.attachedMesh.forward,this._cachedForward)>1e-4){const e=this.attachedMesh.forward;this._light.direction=new o.P(e.x,e.y,e.z),this._cachedForward.copyFrom(this.attachedMesh.forward)}else o.P.DistanceSquared(this.attachedMesh.forward,this._light.direction)>1e-4&&(this.attachedMesh.setDirection(this._light.direction),this.attachedMesh.computeWorldMatrix(!0),this._cachedForward.copyFrom(this.attachedMesh.forward))}}dispose(){this.onClickedObservable.clear(),this.gizmoLayer.utilityLayerScene.onPointerObservable.remove(this._pointerObserver),this._material.dispose(),super.dispose(),this._attachedMeshParent.dispose()}static _CreateHemisphericLightMesh(e){const t=new Nt.Kj("hemisphereLight",e),i=Pa(t.name,{segments:10,diameter:1},e);return i.position.z=-.15,i.rotation.x=Math.PI/2,i.parent=t,this._CreateLightLines(3,e).parent=t,t.scaling.scaleInPlace(Ia._Scale),t.rotation.x=Math.PI/2,t}static _CreatePointLightMesh(e){const t=new Nt.Kj("pointLight",e),i=Kn(t.name,{segments:10,diameter:1},e);return i.rotation.x=Math.PI/2,i.parent=t,this._CreateLightLines(5,e).parent=t,t.scaling.scaleInPlace(Ia._Scale),t.rotation.x=Math.PI/2,t}static _CreateSpotLightMesh(e){const t=new Nt.Kj("spotLight",e);Kn(t.name,{segments:10,diameter:1},e).parent=t;const i=Pa(t.name,{segments:10,diameter:2},e);return i.parent=t,i.rotation.x=-Math.PI/2,this._CreateLightLines(2,e).parent=t,t.scaling.scaleInPlace(Ia._Scale),t.rotation.x=Math.PI/2,t}static _CreateDirectionalLightMesh(e){const t=new Nt.Kj("directionalLight",e),i=new Nt.Kj(t.name,e);i.parent=t,Kn(t.name,{diameter:1.2,segments:10},e).parent=i;const n=an(t.name,{updatable:!1,height:6,diameterTop:.3,diameterBottom:.3,tessellation:6,subdivisions:1},e);n.parent=i;let s=n.clone(t.name);s.scaling.y=.5,s.position.x+=1.25;let r=n.clone(t.name);r.scaling.y=.5,r.position.x+=-1.25;const o=an(t.name,{updatable:!1,height:1,diameterTop:0,diameterBottom:.6,tessellation:6,subdivisions:1},e);return o.position.y+=3,o.parent=i,s=o.clone(t.name),s.position.y=1.5,s.position.x+=1.25,r=o.clone(t.name),r.position.y=1.5,r.position.x+=-1.25,i.scaling.scaleInPlace(Ia._Scale),i.rotation.z=Math.PI/2,i.rotation.y=Math.PI/2,t}}Ia._Scale=.007,Ia._CreateLightLines=(e,t)=>{const i=new Nt.Kj("root",t);i.rotation.x=Math.PI/2;const n=new Nt.Kj("linePivot",t);n.parent=i;const s=an("line",{updatable:!1,height:2,diameterTop:.2,diameterBottom:.3,tessellation:6,subdivisions:1},t);if(s.position.y=s.scaling.y/2+1.2,s.parent=n,e<2)return n;for(let e=0;e<4;e++){const t=n.clone("lineParentClone");t.rotation.z=Math.PI/4,t.rotation.y=Math.PI/2+Math.PI/2*e,t.getChildMeshes()[0].scaling.y=.5,t.getChildMeshes()[0].scaling.x=t.getChildMeshes()[0].scaling.z=.8,t.getChildMeshes()[0].position.y=t.getChildMeshes()[0].scaling.y/2+1.2}if(e<3)return i;for(let e=0;e<4;e++){const t=n.clone("linePivotClone");t.rotation.z=Math.PI/2,t.rotation.y=Math.PI/2*e}if(e<4)return i;for(let e=0;e<4;e++){const t=n.clone("linePivotClone");t.rotation.z=Math.PI+Math.PI/4,t.rotation.y=Math.PI/2+Math.PI/2*e,t.getChildMeshes()[0].scaling.y=.5,t.getChildMeshes()[0].scaling.x=t.getChildMeshes()[0].scaling.z=.8,t.getChildMeshes()[0].position.y=t.getChildMeshes()[0].scaling.y/2+1.2}return e<5||(n.clone("linePivotClone").rotation.z=Math.PI),i};class Da extends Gn.t{constructor(e=zn.x.DefaultUtilityLayer){super(e),this._pointerObserver=null,this.onClickedObservable=new r.y$,this._camera=null,this._invProjection=new Gr.y3,this._material=new Gi.K("cameraGizmoMaterial",this.gizmoLayer.utilityLayerScene),this._material.diffuseColor=new a.Wo(.5,.5,.5),this._material.specularColor=new a.Wo(.1,.1,.1),this._pointerObserver=e.utilityLayerScene.onPointerObservable.add((e=>{this._camera&&(this._isHovered=!(!e.pickInfo||-1==this._rootMesh.getChildMeshes().indexOf(e.pickInfo.pickedMesh)),this._isHovered&&0===e.event.button&&this.onClickedObservable.notifyObservers(this._camera))}),Re.kD.POINTERDOWN)}get displayFrustum(){return this._cameraLinesMesh.isEnabled()}set displayFrustum(e){this._cameraLinesMesh.setEnabled(e)}set camera(e){if(this._camera=e,this.attachedNode=e,e){this._cameraMesh&&this._cameraMesh.dispose(),this._cameraLinesMesh&&this._cameraLinesMesh.dispose(),this._cameraMesh=Da._CreateCameraMesh(this.gizmoLayer.utilityLayerScene),this._cameraLinesMesh=Da._CreateCameraFrustum(this.gizmoLayer.utilityLayerScene),this._cameraMesh.getChildMeshes(!1).forEach((e=>{e.material=this._material})),this._cameraMesh.parent=this._rootMesh,this._cameraLinesMesh.parent=this._rootMesh,this.gizmoLayer.utilityLayerScene.activeCamera&&this.gizmoLayer.utilityLayerScene.activeCamera.maxZ<1.5*e.maxZ&&(this.gizmoLayer.utilityLayerScene.activeCamera.maxZ=1.5*e.maxZ),this.attachedNode.reservedDataStore||(this.attachedNode.reservedDataStore={}),this.attachedNode.reservedDataStore.cameraGizmo=this;const t=this.gizmoLayer._getSharedGizmoLight();t.includedOnlyMeshes=t.includedOnlyMeshes.concat(this._cameraMesh.getChildMeshes(!1)),this._update()}}get camera(){return this._camera}get material(){return this._material}_update(){super._update(),this._camera&&(this._camera.getProjectionMatrix().invertToRef(this._invProjection),this._cameraLinesMesh.setPivotMatrix(this._invProjection,!1),this._cameraLinesMesh.scaling.x=1/this._rootMesh.scaling.x,this._cameraLinesMesh.scaling.y=1/this._rootMesh.scaling.y,this._cameraLinesMesh.scaling.z=1/this._rootMesh.scaling.z,this._cameraMesh.parent=null,this._cameraMesh.rotation.y=.5*Math.PI*(this._camera.getScene().useRightHandedSystem?1:-1),this._cameraMesh.parent=this._rootMesh)}dispose(){this.onClickedObservable.clear(),this.gizmoLayer.utilityLayerScene.onPointerObservable.remove(this._pointerObserver),this._cameraMesh&&this._cameraMesh.dispose(),this._cameraLinesMesh&&this._cameraLinesMesh.dispose(),this._material.dispose(),super.dispose()}static _CreateCameraMesh(e){const t=new Nt.Kj("rootCameraGizmo",e),i=new Nt.Kj(t.name,e);i.parent=t,(0,Yn.NR)(t.name,{width:1,height:.8,depth:.5},e).parent=i;const n=an(t.name,{height:.5,diameterTop:.8,diameterBottom:.8},e);n.parent=i,n.position.y=.3,n.position.x=-.6,n.rotation.x=.5*Math.PI;const s=an(t.name,{height:.5,diameterTop:.6,diameterBottom:.6},e);s.parent=i,s.position.y=.5,s.position.x=.4,s.rotation.x=.5*Math.PI;const r=an(t.name,{height:.5,diameterTop:.5,diameterBottom:.5},e);return r.parent=i,r.position.y=0,r.position.x=.6,r.rotation.z=.5*Math.PI,t.scaling.scaleInPlace(Da._Scale),i.position.x=-.9,t}static _CreateCameraFrustum(e){const t=new Nt.Kj("rootCameraGizmo",e),i=new Nt.Kj(t.name,e);i.parent=t;for(let t=0;t<4;t+=2)for(let n=0;n<4;n+=2){let s=os("lines",{points:[new o.P(-1+n,-1+t,-1),new o.P(-1+n,-1+t,1)]},e);s.parent=i,s.alwaysSelectAsActiveMesh=!0,s.isPickable=!1,s=os("lines",{points:[new o.P(-1,-1+n,-1+t),new o.P(1,-1+n,-1+t)]},e),s.parent=i,s.alwaysSelectAsActiveMesh=!0,s.isPickable=!1,s=os("lines",{points:[new o.P(-1+n,-1,-1+t),new o.P(-1+n,1,-1+t)]},e),s.parent=i,s.alwaysSelectAsActiveMesh=!0,s.isPickable=!1}return t}}Da._Scale=.05;var Oa=i(6702);si.v.IncludesShadersStore.kernelBlurVaryingDeclaration="varying vec2 sampleCoord{X};";si.v.IncludesShadersStore.packingFunctions="vec4 pack(float depth)\n{\nconst vec4 bit_shift=vec4(255.0*255.0*255.0,255.0*255.0,255.0,1.0);\nconst vec4 bit_mask=vec4(0.0,1.0/255.0,1.0/255.0,1.0/255.0);\nvec4 res=fract(depth*bit_shift);\nres-=res.xxyz*bit_mask;\nreturn res;\n}\nfloat unpack(vec4 color)\n{\nconst vec4 bit_shift=vec4(1.0/(255.0*255.0*255.0),1.0/(255.0*255.0),1.0/255.0,1.0);\nreturn dot(color,bit_shift);\n}";si.v.IncludesShadersStore.kernelBlurFragment="#ifdef DOF\nfactor=sampleCoC(sampleCoord{X}); \ncomputedWeight=KERNEL_WEIGHT{X}*factor;\nsumOfWeights+=computedWeight;\n#else\ncomputedWeight=KERNEL_WEIGHT{X};\n#endif\n#ifdef PACKEDFLOAT\nblend+=unpack(texture2D(textureSampler,sampleCoord{X}))*computedWeight;\n#else\nblend+=texture2D(textureSampler,sampleCoord{X})*computedWeight;\n#endif\n";si.v.IncludesShadersStore.kernelBlurFragment2="#ifdef DOF\nfactor=sampleCoC(sampleCenter+delta*KERNEL_DEP_OFFSET{X});\ncomputedWeight=KERNEL_DEP_WEIGHT{X}*factor;\nsumOfWeights+=computedWeight;\n#else\ncomputedWeight=KERNEL_DEP_WEIGHT{X};\n#endif\n#ifdef PACKEDFLOAT\nblend+=unpack(texture2D(textureSampler,sampleCenter+delta*KERNEL_DEP_OFFSET{X}))*computedWeight;\n#else\nblend+=texture2D(textureSampler,sampleCenter+delta*KERNEL_DEP_OFFSET{X})*computedWeight;\n#endif\n";si.v.ShadersStore.kernelBlurPixelShader="uniform sampler2D textureSampler;\nuniform vec2 delta;\nvarying vec2 sampleCenter;\n#ifdef DOF\nuniform sampler2D circleOfConfusionSampler;\nfloat sampleCoC(in vec2 offset) {\nfloat coc=texture2D(circleOfConfusionSampler,offset).r;\nreturn coc; \n}\n#endif\n#include<kernelBlurVaryingDeclaration>[0..varyingCount]\n#ifdef PACKEDFLOAT\n#include<packingFunctions>\n#endif\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nfloat computedWeight=0.0;\n#ifdef PACKEDFLOAT\nfloat blend=0.;\n#else\nvec4 blend=vec4(0.);\n#endif\n#ifdef DOF\nfloat sumOfWeights=CENTER_WEIGHT; \nfloat factor=0.0;\n#ifdef PACKEDFLOAT\nblend+=unpack(texture2D(textureSampler,sampleCenter))*CENTER_WEIGHT;\n#else\nblend+=texture2D(textureSampler,sampleCenter)*CENTER_WEIGHT;\n#endif\n#endif\n#include<kernelBlurFragment>[0..varyingCount]\n#include<kernelBlurFragment2>[0..depCount]\n#ifdef PACKEDFLOAT\ngl_FragColor=pack(blend);\n#else\ngl_FragColor=blend;\n#endif\n#ifdef DOF\ngl_FragColor/=sumOfWeights;\n#endif\n}";si.v.IncludesShadersStore.kernelBlurVertex="sampleCoord{X}=sampleCenter+delta*KERNEL_OFFSET{X};";si.v.ShadersStore.kernelBlurVertexShader="attribute vec2 position;\nuniform vec2 delta;\nvarying vec2 sampleCenter;\n#include<kernelBlurVaryingDeclaration>[0..varyingCount]\nconst vec2 madd=vec2(0.5,0.5);\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nsampleCenter=(position*madd+madd);\n#include<kernelBlurVertex>[0..varyingCount]\ngl_Position=vec4(position,0.0,1.0);\n#define CUSTOM_VERTEX_MAIN_END\n}";class wa extends ni.D{set kernel(e){this._idealKernel!==e&&(e=Math.max(e,1),this._idealKernel=e,this._kernel=this._nearestBestKernel(e),this._blockCompilation||this._updateParameters())}get kernel(){return this._idealKernel}set packedFloat(e){this._packedFloat!==e&&(this._packedFloat=e,this._blockCompilation||this._updateParameters())}get packedFloat(){return this._packedFloat}getClassName(){return"BlurPostProcess"}constructor(e,t,i,n,s,r=Ce.x.BILINEAR_SAMPLINGMODE,o,a,l=0,h="",c=!1,u=5){super(e,"kernelBlur",["delta","direction"],["circleOfConfusionSampler"],n,s,r,o,a,null,l,"kernelBlur",{varyingCount:0,depCount:0},!0,u),this._blockCompilation=c,this._packedFloat=!1,this._staticDefines="",this._staticDefines=h,this.direction=t,this.onApplyObservable.add((e=>{this._outputTexture?e.setFloat2("delta",1/this._outputTexture.width*this.direction.x,1/this._outputTexture.height*this.direction.y):e.setFloat2("delta",1/this.width*this.direction.x,1/this.height*this.direction.y)})),this.kernel=i}updateEffect(e=null,t=null,i=null,n,s,r){this._updateParameters(s,r)}_updateParameters(e,t){const i=this._kernel,n=(i-1)/2;let s=[],r=[],o=0;for(let e=0;e<i;e++){const t=e/(i-1),a=this._gaussianWeight(2*t-1);s[e]=e-n,r[e]=a,o+=a}for(let e=0;e<r.length;e++)r[e]/=o;const a=[],l=[],h=[];for(let e=0;e<=n;e+=2){const t=Math.min(e+1,Math.floor(n));if(e===t)h.push({o:s[e],w:r[e]});else{const i=t===n,o=r[e]+r[t]*(i?.5:1),a=s[e]+1/(1+r[e]/r[t]);0===a?(h.push({o:s[e],w:r[e]}),h.push({o:s[e+1],w:r[e+1]})):(h.push({o:a,w:o}),h.push({o:-a,w:o}))}}for(let e=0;e<h.length;e++)l[e]=h[e].o,a[e]=h[e].w;s=l,r=a;const c=this.getEngine().getCaps().maxVaryingVectors,u=Math.max(c,0)-1;let d=Math.min(s.length,u),p="";p+=this._staticDefines,-1!=this._staticDefines.indexOf("DOF")&&(p+=`#define CENTER_WEIGHT ${this._glslFloat(r[d-1])}\r\n`,d--);for(let e=0;e<d;e++)p+=`#define KERNEL_OFFSET${e} ${this._glslFloat(s[e])}\r\n`,p+=`#define KERNEL_WEIGHT${e} ${this._glslFloat(r[e])}\r\n`;let f=0;for(let e=u;e<s.length;e++)p+=`#define KERNEL_DEP_OFFSET${f} ${this._glslFloat(s[e])}\r\n`,p+=`#define KERNEL_DEP_WEIGHT${f} ${this._glslFloat(r[e])}\r\n`,f++;this.packedFloat&&(p+="#define PACKEDFLOAT 1"),this._blockCompilation=!1,super.updateEffect(p,null,null,{varyingCount:d,depCount:f},e,t)}_nearestBestKernel(e){const t=Math.round(e);for(const e of[t,t-1,t+1,t-2,t+2])if(e%2!=0&&Math.floor(e/2)%2==0&&e>0)return Math.max(e,3);return Math.max(t,3)}_gaussianWeight(e){const t=1/3,i=-e*e/(2*t*t);return 1/(Math.sqrt(2*Math.PI)*t)*Math.exp(i)}_glslFloat(e,t=8){return e.toFixed(t).replace(/0+$/,"")}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new wa(e.name,e.direction,e.kernel,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.reusable,e.textureType,void 0,!1)),e,i,n)}}(0,be.gn)([(0,Te.qC)("kernel")],wa.prototype,"_kernel",void 0),(0,be.gn)([(0,Te.qC)("packedFloat")],wa.prototype,"_packedFloat",void 0),(0,be.gn)([(0,Te.QC)()],wa.prototype,"direction",void 0),(0,l.H)("BABYLON.BlurPostProcess",wa);class Na extends Ai._{set blurRatio(e){this._blurRatio!==e&&(this._blurRatio=e,this._preparePostProcesses())}get blurRatio(){return this._blurRatio}set adaptiveBlurKernel(e){this._adaptiveBlurKernel=e,this._autoComputeBlurKernel()}set blurKernel(e){this.blurKernelX=e,this.blurKernelY=e}set blurKernelX(e){this._blurKernelX!==e&&(this._blurKernelX=e,this._preparePostProcesses())}get blurKernelX(){return this._blurKernelX}set blurKernelY(e){this._blurKernelY!==e&&(this._blurKernelY=e,this._preparePostProcesses())}get blurKernelY(){return this._blurKernelY}_autoComputeBlurKernel(){const e=this.getScene().getEngine(),t=this.getRenderWidth()/e.getRenderWidth(),i=this.getRenderHeight()/e.getRenderHeight();this.blurKernelX=this._adaptiveBlurKernel*t,this.blurKernelY=this._adaptiveBlurKernel*i}_onRatioRescale(){this._sizeRatio&&(this.resize(this._initialSizeParameter),this._adaptiveBlurKernel||this._preparePostProcesses()),this._adaptiveBlurKernel&&this._autoComputeBlurKernel()}_updateGammaSpace(){const e=this.getScene();e&&(this.gammaSpace=!e.imageProcessingConfiguration.isEnabled||!e.imageProcessingConfiguration.applyByPostProcess)}constructor(e,t,i,n,s=0,r=Ce.x.BILINEAR_SAMPLINGMODE,a=!0){if(super(e,t,i,n,!0,s,!1,r,a),this.mirrorPlane=new ot.J(0,1,0,1),this._transformMatrix=o.y3.Zero(),this._mirrorMatrix=o.y3.Zero(),this._adaptiveBlurKernel=0,this._blurKernelX=0,this._blurKernelY=0,this._blurRatio=1,!(i=this.getScene()))return this;this.ignoreCameraViewport=!0,this._updateGammaSpace(),this._imageProcessingConfigChangeObserver=i.imageProcessingConfiguration.onUpdateParameters.add((()=>{this._updateGammaSpace()}));const l=i.getEngine();let h;l.supportsUniformBuffers&&(this._sceneUBO=i.createSceneUniformBuffer(`Scene for Mirror Texture (name "${e}")`)),this.onBeforeBindObservable.add((()=>{var t;null===(t=l._debugPushGroup)||void 0===t||t.call(l,`mirror generation for ${e}`,1)})),this.onAfterUnbindObservable.add((()=>{var e;null===(e=l._debugPopGroup)||void 0===e||e.call(l,1)})),this.onBeforeRenderObservable.add((()=>{this._sceneUBO&&(this._currentSceneUBO=i.getSceneUniformBuffer(),i.setSceneUniformBuffer(this._sceneUBO),i.getSceneUniformBuffer().unbindEffect()),o.y3.ReflectionToRef(this.mirrorPlane,this._mirrorMatrix),this._mirrorMatrix.multiplyToRef(i.getViewMatrix(),this._transformMatrix),i.setTransformMatrix(this._transformMatrix,i.getProjectionMatrix()),h=i.clipPlane,i.clipPlane=this.mirrorPlane,i._mirroredCameraPosition=o.P.TransformCoordinates(i.activeCamera.globalPosition,this._mirrorMatrix)})),this.onAfterRenderObservable.add((()=>{this._sceneUBO&&i.setSceneUniformBuffer(this._currentSceneUBO),i.updateTransformMatrix(),i._mirroredCameraPosition=null,i.clipPlane=h}))}_preparePostProcesses(){if(this.clearPostProcesses(!0),this._blurKernelX&&this._blurKernelY){const e=this.getScene().getEngine(),t=e.getCaps().textureFloatRender&&e.getCaps().textureFloatLinearFiltering?1:2;this._blurX=new wa("horizontal blur",new o.FM(1,0),this._blurKernelX,this._blurRatio,null,Ce.x.BILINEAR_SAMPLINGMODE,e,!1,t),this._blurX.autoClear=!1,1===this._blurRatio&&this.samples<2&&this._texture?this._blurX.inputTexture=this._renderTarget:this._blurX.alwaysForcePOT=!0,this._blurY=new wa("vertical blur",new o.FM(0,1),this._blurKernelY,this._blurRatio,null,Ce.x.BILINEAR_SAMPLINGMODE,e,!1,t),this._blurY.autoClear=!1,this._blurY.alwaysForcePOT=1!==this._blurRatio,this.addPostProcess(this._blurX),this.addPostProcess(this._blurY)}else this._blurY&&(this.removePostProcess(this._blurY),this._blurY.dispose(),this._blurY=null),this._blurX&&(this.removePostProcess(this._blurX),this._blurX.dispose(),this._blurX=null)}clone(){const e=this.getScene();if(!e)return this;const t=this.getSize(),i=new Na(this.name,t.width,e,this._renderTargetOptions.generateMipMaps,this._renderTargetOptions.type,this._renderTargetOptions.samplingMode,this._renderTargetOptions.generateDepthBuffer);return i.hasAlpha=this.hasAlpha,i.level=this.level,i.mirrorPlane=this.mirrorPlane.clone(),this.renderList&&(i.renderList=this.renderList.slice(0)),i}serialize(){if(!this.name)return null;const e=super.serialize();return e.mirrorPlane=this.mirrorPlane.asArray(),e}dispose(){var e;super.dispose();const t=this.getScene();t&&t.imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingConfigChangeObserver),null===(e=this._sceneUBO)||void 0===e||e.dispose()}}Ce.x._CreateMirror=(e,t,i,n)=>new Na(e,t,i,n);var Fa=i(4051),La=i(5346),Ba=i(1917),Ua=i(580),Va=i(85);si.v.IncludesShadersStore.backgroundFragmentDeclaration="uniform vec4 vEyePosition;\nuniform vec4 vPrimaryColor;\n#ifdef USEHIGHLIGHTANDSHADOWCOLORS\nuniform vec4 vPrimaryColorShadow;\n#endif\nuniform float shadowLevel;\nuniform float alpha;\n#ifdef DIFFUSE\nuniform vec2 vDiffuseInfos;\n#endif\n#ifdef REFLECTION\nuniform vec2 vReflectionInfos;\nuniform mat4 reflectionMatrix;\nuniform vec3 vReflectionMicrosurfaceInfos;\n#endif\n#if defined(REFLECTIONFRESNEL) || defined(OPACITYFRESNEL)\nuniform vec3 vBackgroundCenter;\n#endif\n#ifdef REFLECTIONFRESNEL\nuniform vec4 vReflectionControl;\n#endif\n#if defined(REFLECTIONMAP_SPHERICAL) || defined(REFLECTIONMAP_PROJECTION) || defined(REFRACTION)\nuniform mat4 view;\n#endif\n",i(2963);si.v.IncludesShadersStore.backgroundUboDeclaration="layout(std140,column_major) uniform;\nuniform Material\n{\nuniform vec4 vPrimaryColor;\nuniform vec4 vPrimaryColorShadow;\nuniform vec2 vDiffuseInfos;\nuniform vec2 vReflectionInfos;\nuniform mat4 diffuseMatrix;\nuniform mat4 reflectionMatrix;\nuniform vec3 vReflectionMicrosurfaceInfos;\nuniform float fFovMultiplier;\nuniform float pointSize;\nuniform float shadowLevel;\nuniform float alpha;\n#if defined(REFLECTIONFRESNEL) || defined(OPACITYFRESNEL)\nuniform vec3 vBackgroundCenter;\n#endif\n#ifdef REFLECTIONFRESNEL\nuniform vec4 vReflectionControl;\n#endif\n};\n#include<sceneUboDeclaration>\n",i(2132),i(2557),i(3756),i(6568),i(3996),i(6390),i(9519),i(5791),i(9490),i(6043);si.v.ShadersStore.backgroundPixelShader="#ifdef TEXTURELODSUPPORT\n#extension GL_EXT_shader_texture_lod : enable\n#endif\nprecision highp float;\n#include<__decl__backgroundFragment>\n#include<helperFunctions>\n#define RECIPROCAL_PI2 0.15915494\nvarying vec3 vPositionW;\n#ifdef MAINUV1\nvarying vec2 vMainUV1;\n#endif \n#ifdef MAINUV2 \nvarying vec2 vMainUV2; \n#endif \n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef DIFFUSE\n#if DIFFUSEDIRECTUV==1\n#define vDiffuseUV vMainUV1\n#elif DIFFUSEDIRECTUV==2\n#define vDiffuseUV vMainUV2\n#else\nvarying vec2 vDiffuseUV;\n#endif\nuniform sampler2D diffuseSampler;\n#endif\n#ifdef REFLECTION\n#ifdef REFLECTIONMAP_3D\n#define sampleReflection(s,c) textureCube(s,c)\nuniform samplerCube reflectionSampler;\n#ifdef TEXTURELODSUPPORT\n#define sampleReflectionLod(s,c,l) textureCubeLodEXT(s,c,l)\n#else\nuniform samplerCube reflectionSamplerLow;\nuniform samplerCube reflectionSamplerHigh;\n#endif\n#else\n#define sampleReflection(s,c) texture2D(s,c)\nuniform sampler2D reflectionSampler;\n#ifdef TEXTURELODSUPPORT\n#define sampleReflectionLod(s,c,l) texture2DLodEXT(s,c,l)\n#else\nuniform samplerCube reflectionSamplerLow;\nuniform samplerCube reflectionSamplerHigh;\n#endif\n#endif\n#ifdef REFLECTIONMAP_SKYBOX\nvarying vec3 vPositionUVW;\n#else\n#if defined(REFLECTIONMAP_EQUIRECTANGULAR_FIXED) || defined(REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED)\nvarying vec3 vDirectionW;\n#endif\n#endif\n#include<reflectionFunction>\n#endif\n#ifndef FROMLINEARSPACE\n#define FROMLINEARSPACE;\n#endif\n#ifndef SHADOWONLY\n#define SHADOWONLY;\n#endif\n#include<imageProcessingDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#include<imageProcessingFunctions>\n#include<clipPlaneFragmentDeclaration>\n#include<fogFragmentDeclaration>\n#ifdef REFLECTIONFRESNEL\n#define FRESNEL_MAXIMUM_ON_ROUGH 0.25\nvec3 fresnelSchlickEnvironmentGGX(float VdotN,vec3 reflectance0,vec3 reflectance90,float smoothness)\n{\nfloat weight=mix(FRESNEL_MAXIMUM_ON_ROUGH,1.0,smoothness);\nreturn reflectance0+weight*(reflectance90-reflectance0)*pow5(saturate(1.0-VdotN));\n}\n#endif\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=vec3(0.0,1.0,0.0);\n#endif\nfloat shadow=1.;\nfloat globalShadow=0.;\nfloat shadowLightCount=0.;\n#include<lightFragment>[0..maxSimultaneousLights]\n#ifdef SHADOWINUSE\nglobalShadow/=shadowLightCount;\n#else\nglobalShadow=1.0;\n#endif\n#ifndef BACKMAT_SHADOWONLY\nvec4 reflectionColor=vec4(1.,1.,1.,1.);\n#ifdef REFLECTION\nvec3 reflectionVector=computeReflectionCoords(vec4(vPositionW,1.0),normalW);\n#ifdef REFLECTIONMAP_OPPOSITEZ\nreflectionVector.z*=-1.0;\n#endif\n#ifdef REFLECTIONMAP_3D\nvec3 reflectionCoords=reflectionVector;\n#else\nvec2 reflectionCoords=reflectionVector.xy;\n#ifdef REFLECTIONMAP_PROJECTION\nreflectionCoords/=reflectionVector.z;\n#endif\nreflectionCoords.y=1.0-reflectionCoords.y;\n#endif\n#ifdef REFLECTIONBLUR\nfloat reflectionLOD=vReflectionInfos.y;\n#ifdef TEXTURELODSUPPORT\nreflectionLOD=reflectionLOD*log2(vReflectionMicrosurfaceInfos.x)*vReflectionMicrosurfaceInfos.y+vReflectionMicrosurfaceInfos.z;\nreflectionColor=sampleReflectionLod(reflectionSampler,reflectionCoords,reflectionLOD);\n#else\nfloat lodReflectionNormalized=saturate(reflectionLOD);\nfloat lodReflectionNormalizedDoubled=lodReflectionNormalized*2.0;\nvec4 reflectionSpecularMid=sampleReflection(reflectionSampler,reflectionCoords);\nif(lodReflectionNormalizedDoubled<1.0){\nreflectionColor=mix(\nsampleReflection(reflectionSamplerHigh,reflectionCoords),\nreflectionSpecularMid,\nlodReflectionNormalizedDoubled\n);\n} else {\nreflectionColor=mix(\nreflectionSpecularMid,\nsampleReflection(reflectionSamplerLow,reflectionCoords),\nlodReflectionNormalizedDoubled-1.0\n);\n}\n#endif\n#else\nvec4 reflectionSample=sampleReflection(reflectionSampler,reflectionCoords);\nreflectionColor=reflectionSample;\n#endif\n#ifdef RGBDREFLECTION\nreflectionColor.rgb=fromRGBD(reflectionColor);\n#endif\n#ifdef GAMMAREFLECTION\nreflectionColor.rgb=toLinearSpace(reflectionColor.rgb);\n#endif\n#ifdef REFLECTIONBGR\nreflectionColor.rgb=reflectionColor.bgr;\n#endif\nreflectionColor.rgb*=vReflectionInfos.x;\n#endif\nvec3 diffuseColor=vec3(1.,1.,1.);\nfloat finalAlpha=alpha;\n#ifdef DIFFUSE\nvec4 diffuseMap=texture2D(diffuseSampler,vDiffuseUV);\n#ifdef GAMMADIFFUSE\ndiffuseMap.rgb=toLinearSpace(diffuseMap.rgb);\n#endif\ndiffuseMap.rgb*=vDiffuseInfos.y;\n#ifdef DIFFUSEHASALPHA\nfinalAlpha*=diffuseMap.a;\n#endif\ndiffuseColor=diffuseMap.rgb;\n#endif\n#ifdef REFLECTIONFRESNEL\nvec3 colorBase=diffuseColor;\n#else\nvec3 colorBase=reflectionColor.rgb*diffuseColor;\n#endif\ncolorBase=max(colorBase,0.0);\n#ifdef USERGBCOLOR\nvec3 finalColor=colorBase;\n#else\n#ifdef USEHIGHLIGHTANDSHADOWCOLORS\nvec3 mainColor=mix(vPrimaryColorShadow.rgb,vPrimaryColor.rgb,colorBase);\n#else\nvec3 mainColor=vPrimaryColor.rgb;\n#endif\nvec3 finalColor=colorBase*mainColor;\n#endif\n#ifdef REFLECTIONFRESNEL\nvec3 reflectionAmount=vReflectionControl.xxx;\nvec3 reflectionReflectance0=vReflectionControl.yyy;\nvec3 reflectionReflectance90=vReflectionControl.zzz;\nfloat VdotN=dot(normalize(vEyePosition.xyz),normalW);\nvec3 planarReflectionFresnel=fresnelSchlickEnvironmentGGX(saturate(VdotN),reflectionReflectance0,reflectionReflectance90,1.0);\nreflectionAmount*=planarReflectionFresnel;\n#ifdef REFLECTIONFALLOFF\nfloat reflectionDistanceFalloff=1.0-saturate(length(vPositionW.xyz-vBackgroundCenter)*vReflectionControl.w);\nreflectionDistanceFalloff*=reflectionDistanceFalloff;\nreflectionAmount*=reflectionDistanceFalloff;\n#endif\nfinalColor=mix(finalColor,reflectionColor.rgb,saturate(reflectionAmount));\n#endif\n#ifdef OPACITYFRESNEL\nfloat viewAngleToFloor=dot(normalW,normalize(vEyePosition.xyz-vBackgroundCenter));\nconst float startAngle=0.1;\nfloat fadeFactor=saturate(viewAngleToFloor/startAngle);\nfinalAlpha*=fadeFactor*fadeFactor;\n#endif\n#ifdef SHADOWINUSE\nfinalColor=mix(finalColor*shadowLevel,finalColor,globalShadow);\n#endif\nvec4 color=vec4(finalColor,finalAlpha);\n#else\nvec4 color=vec4(vPrimaryColor.rgb,(1.0-clamp(globalShadow,0.,1.))*alpha);\n#endif\n#include<fogFragment>\n#ifdef IMAGEPROCESSINGPOSTPROCESS\n#if !defined(SKIPFINALCOLORCLAMP)\ncolor.rgb=clamp(color.rgb,0.,30.0);\n#endif\n#else\ncolor=applyImageProcessing(color);\n#endif\n#ifdef PREMULTIPLYALPHA\ncolor.rgb*=color.a;\n#endif\n#ifdef NOISE\ncolor.rgb+=dither(vPositionW.xy,0.5);\ncolor=max(color,0.0);\n#endif\ngl_FragColor=color;\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n";si.v.IncludesShadersStore.backgroundVertexDeclaration="uniform mat4 view;\nuniform mat4 viewProjection;\nuniform float shadowLevel;\n#ifdef DIFFUSE\nuniform mat4 diffuseMatrix;\nuniform vec2 vDiffuseInfos;\n#endif\n#ifdef REFLECTION\nuniform vec2 vReflectionInfos;\nuniform mat4 reflectionMatrix;\nuniform vec3 vReflectionMicrosurfaceInfos;\nuniform float fFovMultiplier;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\n",i(7520),i(493),i(1063),i(6343),i(9042),i(1542),i(9935),i(6883),i(6655),i(3206),i(5215),i(962),i(1101);si.v.ShadersStore.backgroundVertexShader="precision highp float;\n#include<__decl__backgroundVertex>\n#include<helperFunctions>\nattribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef MAINUV1\nvarying vec2 vMainUV1;\n#endif\n#ifdef MAINUV2\nvarying vec2 vMainUV2;\n#endif\n#if defined(DIFFUSE) && DIFFUSEDIRECTUV==0\nvarying vec2 vDiffuseUV;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightVxFragment>[0..maxSimultaneousLights]\n#ifdef REFLECTIONMAP_SKYBOX\nvarying vec3 vPositionUVW;\n#endif\n#if defined(REFLECTIONMAP_EQUIRECTANGULAR_FIXED) || defined(REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED)\nvarying vec3 vDirectionW;\n#endif\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#ifdef REFLECTIONMAP_SKYBOX\nvPositionUVW=position;\n#endif\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\n#ifdef MULTIVIEW\nif (gl_ViewID_OVR==0u) {\ngl_Position=viewProjection*finalWorld*vec4(position,1.0);\n} else {\ngl_Position=viewProjectionR*finalWorld*vec4(position,1.0);\n}\n#else\ngl_Position=viewProjection*finalWorld*vec4(position,1.0);\n#endif\nvec4 worldPos=finalWorld*vec4(position,1.0);\nvPositionW=vec3(worldPos);\n#ifdef NORMAL\nmat3 normalWorld=mat3(finalWorld);\n#ifdef NONUNIFORMSCALING\nnormalWorld=transposeMat3(inverseMat3(normalWorld));\n#endif\nvNormalW=normalize(normalWorld*normal);\n#endif\n#if defined(REFLECTIONMAP_EQUIRECTANGULAR_FIXED) || defined(REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED)\nvDirectionW=normalize(vec3(finalWorld*vec4(position,0.0)));\n#ifdef EQUIRECTANGULAR_RELFECTION_FOV\nmat3 screenToWorld=inverseMat3(mat3(finalWorld*viewProjection));\nvec3 segment=mix(vDirectionW,screenToWorld*vec3(0.0,0.0,1.0),abs(fFovMultiplier-1.0));\nif (fFovMultiplier<=1.0) {\nvDirectionW=normalize(segment);\n} else {\nvDirectionW=normalize(vDirectionW+(vDirectionW-segment));\n}\n#endif\n#endif\n#ifndef UV1\nvec2 uv=vec2(0.,0.);\n#endif\n#ifndef UV2\nvec2 uv2=vec2(0.,0.);\n#endif\n#ifdef MAINUV1\nvMainUV1=uv;\n#endif\n#ifdef MAINUV2\nvMainUV2=uv2;\n#endif\n#if defined(DIFFUSE) && DIFFUSEDIRECTUV==0\nif (vDiffuseInfos.x==0.)\n{\nvDiffuseUV=vec2(diffuseMatrix*vec4(uv,1.0,0.0));\n}\nelse\n{\nvDiffuseUV=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));\n}\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#ifdef VERTEXCOLOR\nvColor=color;\n#endif\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";var ka=i(1434),Ga=i(99);class za extends Ba.H{constructor(){super(),this.DIFFUSE=!1,this.DIFFUSEDIRECTUV=0,this.GAMMADIFFUSE=!1,this.DIFFUSEHASALPHA=!1,this.OPACITYFRESNEL=!1,this.REFLECTIONBLUR=!1,this.REFLECTIONFRESNEL=!1,this.REFLECTIONFALLOFF=!1,this.TEXTURELODSUPPORT=!1,this.PREMULTIPLYALPHA=!1,this.USERGBCOLOR=!1,this.USEHIGHLIGHTANDSHADOWCOLORS=!1,this.BACKMAT_SHADOWONLY=!1,this.NOISE=!1,this.REFLECTIONBGR=!1,this.IMAGEPROCESSING=!1,this.VIGNETTE=!1,this.VIGNETTEBLENDMODEMULTIPLY=!1,this.VIGNETTEBLENDMODEOPAQUE=!1,this.TONEMAPPING=!1,this.TONEMAPPING_ACES=!1,this.CONTRAST=!1,this.COLORCURVES=!1,this.COLORGRADING=!1,this.COLORGRADING3D=!1,this.SAMPLER3DGREENDEPTH=!1,this.SAMPLER3DBGRMAP=!1,this.DITHER=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.EXPOSURE=!1,this.MULTIVIEW=!1,this.REFLECTION=!1,this.REFLECTIONMAP_3D=!1,this.REFLECTIONMAP_SPHERICAL=!1,this.REFLECTIONMAP_PLANAR=!1,this.REFLECTIONMAP_CUBIC=!1,this.REFLECTIONMAP_PROJECTION=!1,this.REFLECTIONMAP_SKYBOX=!1,this.REFLECTIONMAP_EXPLICIT=!1,this.REFLECTIONMAP_EQUIRECTANGULAR=!1,this.REFLECTIONMAP_EQUIRECTANGULAR_FIXED=!1,this.REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED=!1,this.INVERTCUBICMAP=!1,this.REFLECTIONMAP_OPPOSITEZ=!1,this.LODINREFLECTIONALPHA=!1,this.GAMMAREFLECTION=!1,this.RGBDREFLECTION=!1,this.EQUIRECTANGULAR_RELFECTION_FOV=!1,this.MAINUV1=!1,this.MAINUV2=!1,this.UV1=!1,this.UV2=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.POINTSIZE=!1,this.FOG=!1,this.NORMAL=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.SHADOWFLOAT=!1,this.LOGARITHMICDEPTH=!1,this.NONUNIFORMSCALING=!1,this.ALPHATEST=!1,this.rebuild()}}class Wa extends Ua.a{get _perceptualColor(){return this.__perceptualColor}set _perceptualColor(e){this.__perceptualColor=e,this._computePrimaryColorFromPerceptualColor(),this._markAllSubMeshesAsLightsDirty()}get primaryColorShadowLevel(){return this._primaryColorShadowLevel}set primaryColorShadowLevel(e){this._primaryColorShadowLevel=e,this._computePrimaryColors(),this._markAllSubMeshesAsLightsDirty()}get primaryColorHighlightLevel(){return this._primaryColorHighlightLevel}set primaryColorHighlightLevel(e){this._primaryColorHighlightLevel=e,this._computePrimaryColors(),this._markAllSubMeshesAsLightsDirty()}set reflectionStandardFresnelWeight(e){let t=e;t<.5?(t*=2,this.reflectionReflectance0=Wa.StandardReflectance0*t,this.reflectionReflectance90=Wa.StandardReflectance90*t):(t=2*t-1,this.reflectionReflectance0=Wa.StandardReflectance0+(1-Wa.StandardReflectance0)*t,this.reflectionReflectance90=Wa.StandardReflectance90+(1-Wa.StandardReflectance90)*t)}get fovMultiplier(){return this._fovMultiplier}set fovMultiplier(e){isNaN(e)&&(e=1),this._fovMultiplier=Math.max(0,Math.min(2,e))}_attachImageProcessingConfiguration(e){e!==this._imageProcessingConfiguration&&(this._imageProcessingConfiguration&&this._imageProcessingObserver&&this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver),this._imageProcessingConfiguration=e||this.getScene().imageProcessingConfiguration,this._imageProcessingConfiguration&&(this._imageProcessingObserver=this._imageProcessingConfiguration.onUpdateParameters.add((()=>{this._computePrimaryColorFromPerceptualColor(),this._markAllSubMeshesAsImageProcessingDirty()}))))}get imageProcessingConfiguration(){return this._imageProcessingConfiguration}set imageProcessingConfiguration(e){this._attachImageProcessingConfiguration(e),this._markAllSubMeshesAsTexturesDirty()}get cameraColorCurvesEnabled(){return this.imageProcessingConfiguration.colorCurvesEnabled}set cameraColorCurvesEnabled(e){this.imageProcessingConfiguration.colorCurvesEnabled=e}get cameraColorGradingEnabled(){return this.imageProcessingConfiguration.colorGradingEnabled}set cameraColorGradingEnabled(e){this.imageProcessingConfiguration.colorGradingEnabled=e}get cameraToneMappingEnabled(){return this._imageProcessingConfiguration.toneMappingEnabled}set cameraToneMappingEnabled(e){this._imageProcessingConfiguration.toneMappingEnabled=e}get cameraExposure(){return this._imageProcessingConfiguration.exposure}set cameraExposure(e){this._imageProcessingConfiguration.exposure=e}get cameraContrast(){return this._imageProcessingConfiguration.contrast}set cameraContrast(e){this._imageProcessingConfiguration.contrast=e}get cameraColorGradingTexture(){return this._imageProcessingConfiguration.colorGradingTexture}set cameraColorGradingTexture(e){this.imageProcessingConfiguration.colorGradingTexture=e}get cameraColorCurves(){return this.imageProcessingConfiguration.colorCurves}set cameraColorCurves(e){this.imageProcessingConfiguration.colorCurves=e}constructor(e,t){super(e,t),this.primaryColor=a.Wo.White(),this._primaryColorShadowLevel=0,this._primaryColorHighlightLevel=0,this.reflectionTexture=null,this.reflectionBlur=0,this.diffuseTexture=null,this._shadowLights=null,this.shadowLights=null,this.shadowLevel=0,this.sceneCenter=o.P.Zero(),this.opacityFresnel=!0,this.reflectionFresnel=!1,this.reflectionFalloffDistance=0,this.reflectionAmount=1,this.reflectionReflectance0=.05,this.reflectionReflectance90=.5,this.useRGBColor=!0,this.enableNoise=!1,this._fovMultiplier=1,this.useEquirectangularFOV=!1,this._maxSimultaneousLights=4,this.maxSimultaneousLights=4,this._shadowOnly=!1,this.shadowOnly=!1,this._imageProcessingObserver=null,this.switchToBGR=!1,this._renderTargets=new Fn.t(16),this._reflectionControls=o.Lt.Zero(),this._white=a.Wo.White(),this._primaryShadowColor=a.Wo.Black(),this._primaryHighlightColor=a.Wo.Black(),this._attachImageProcessingConfiguration(null),this.getRenderTargetTextures=()=>(this._renderTargets.reset(),this._diffuseTexture&&this._diffuseTexture.isRenderTarget&&this._renderTargets.push(this._diffuseTexture),this._reflectionTexture&&this._reflectionTexture.isRenderTarget&&this._renderTargets.push(this._reflectionTexture),this._renderTargets)}get hasRenderTargetTextures(){return!(!this._diffuseTexture||!this._diffuseTexture.isRenderTarget)||!(!this._reflectionTexture||!this._reflectionTexture.isRenderTarget)}needAlphaTesting(){return!0}needAlphaBlending(){return this.alpha<1||null!=this._diffuseTexture&&this._diffuseTexture.hasAlpha||this._shadowOnly}isReadyForSubMesh(e,t,i=!1){if(t.effect&&this.isFrozen&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new za);const n=this.getScene(),s=t.materialDefines;if(this._isReadyForSubMesh(t))return!0;const r=n.getEngine();if(La.G.PrepareDefinesForLights(n,e,s,!1,this._maxSimultaneousLights),s._needNormals=!0,La.G.PrepareDefinesForMultiview(n,s),s._areTexturesDirty){if(s._needUVs=!1,n.texturesEnabled){if(n.getEngine().getCaps().textureLOD&&(s.TEXTURELODSUPPORT=!0),this._diffuseTexture&&Va.k.DiffuseTextureEnabled){if(!this._diffuseTexture.isReadyOrNotBlocking())return!1;La.G.PrepareDefinesForMergedUV(this._diffuseTexture,s,"DIFFUSE"),s.DIFFUSEHASALPHA=this._diffuseTexture.hasAlpha,s.GAMMADIFFUSE=this._diffuseTexture.gammaSpace,s.OPACITYFRESNEL=this._opacityFresnel}else s.DIFFUSE=!1,s.DIFFUSEDIRECTUV=0,s.DIFFUSEHASALPHA=!1,s.GAMMADIFFUSE=!1,s.OPACITYFRESNEL=!1;const e=this._reflectionTexture;if(e&&Va.k.ReflectionTextureEnabled){if(!e.isReadyOrNotBlocking())return!1;switch(s.REFLECTION=!0,s.GAMMAREFLECTION=e.gammaSpace,s.RGBDREFLECTION=e.isRGBD,s.REFLECTIONBLUR=this._reflectionBlur>0,s.LODINREFLECTIONALPHA=e.lodLevelInAlpha,s.EQUIRECTANGULAR_RELFECTION_FOV=this.useEquirectangularFOV,s.REFLECTIONBGR=this.switchToBGR,e.coordinatesMode===Ce.x.INVCUBIC_MODE&&(s.INVERTCUBICMAP=!0),s.REFLECTIONMAP_3D=e.isCube,s.REFLECTIONMAP_OPPOSITEZ=s.REFLECTIONMAP_3D&&this.getScene().useRightHandedSystem?!e.invertZ:e.invertZ,e.coordinatesMode){case Ce.x.EXPLICIT_MODE:s.REFLECTIONMAP_EXPLICIT=!0;break;case Ce.x.PLANAR_MODE:s.REFLECTIONMAP_PLANAR=!0;break;case Ce.x.PROJECTION_MODE:s.REFLECTIONMAP_PROJECTION=!0;break;case Ce.x.SKYBOX_MODE:s.REFLECTIONMAP_SKYBOX=!0;break;case Ce.x.SPHERICAL_MODE:s.REFLECTIONMAP_SPHERICAL=!0;break;case Ce.x.EQUIRECTANGULAR_MODE:s.REFLECTIONMAP_EQUIRECTANGULAR=!0;break;case Ce.x.FIXED_EQUIRECTANGULAR_MODE:s.REFLECTIONMAP_EQUIRECTANGULAR_FIXED=!0;break;case Ce.x.FIXED_EQUIRECTANGULAR_MIRRORED_MODE:s.REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED=!0;break;case Ce.x.CUBIC_MODE:case Ce.x.INVCUBIC_MODE:default:s.REFLECTIONMAP_CUBIC=!0}this.reflectionFresnel?(s.REFLECTIONFRESNEL=!0,s.REFLECTIONFALLOFF=this.reflectionFalloffDistance>0,this._reflectionControls.x=this.reflectionAmount,this._reflectionControls.y=this.reflectionReflectance0,this._reflectionControls.z=this.reflectionReflectance90,this._reflectionControls.w=1/this.reflectionFalloffDistance):(s.REFLECTIONFRESNEL=!1,s.REFLECTIONFALLOFF=!1)}else s.REFLECTION=!1,s.REFLECTIONFRESNEL=!1,s.REFLECTIONFALLOFF=!1,s.REFLECTIONBLUR=!1,s.REFLECTIONMAP_3D=!1,s.REFLECTIONMAP_SPHERICAL=!1,s.REFLECTIONMAP_PLANAR=!1,s.REFLECTIONMAP_CUBIC=!1,s.REFLECTIONMAP_PROJECTION=!1,s.REFLECTIONMAP_SKYBOX=!1,s.REFLECTIONMAP_EXPLICIT=!1,s.REFLECTIONMAP_EQUIRECTANGULAR=!1,s.REFLECTIONMAP_EQUIRECTANGULAR_FIXED=!1,s.REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED=!1,s.INVERTCUBICMAP=!1,s.REFLECTIONMAP_OPPOSITEZ=!1,s.LODINREFLECTIONALPHA=!1,s.GAMMAREFLECTION=!1,s.RGBDREFLECTION=!1}s.PREMULTIPLYALPHA=7===this.alphaMode||8===this.alphaMode,s.USERGBCOLOR=this._useRGBColor,s.NOISE=this._enableNoise}if(s._areLightsDirty&&(s.USEHIGHLIGHTANDSHADOWCOLORS=!this._useRGBColor&&(0!==this._primaryColorShadowLevel||0!==this._primaryColorHighlightLevel),s.BACKMAT_SHADOWONLY=this._shadowOnly),s._areImageProcessingDirty&&this._imageProcessingConfiguration){if(!this._imageProcessingConfiguration.isReady())return!1;this._imageProcessingConfiguration.prepareDefines(s)}if(La.G.PrepareDefinesForMisc(e,n,!1,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),s),La.G.PrepareDefinesForFrameBoundValues(n,r,this,s,i,null,t.getRenderingMesh().hasThinInstances),La.G.PrepareDefinesForAttributes(e,s,!1,!0,!1)&&e&&(n.getEngine().getCaps().standardDerivatives||e.isVerticesDataPresent(qe.o.NormalKind)||(e.createNormals(!0),_.Y.Warn("BackgroundMaterial: Normals have been created for the mesh: "+e.name))),s.isDirty){s.markAsProcessed(),n.resetCachedMaterial();const i=new ka.L;s.FOG&&i.addFallback(0,"FOG"),s.POINTSIZE&&i.addFallback(1,"POINTSIZE"),s.MULTIVIEW&&i.addFallback(0,"MULTIVIEW"),La.G.HandleFallbacksForShadows(s,i,this._maxSimultaneousLights);const o=[qe.o.PositionKind];s.NORMAL&&o.push(qe.o.NormalKind),s.UV1&&o.push(qe.o.UVKind),s.UV2&&o.push(qe.o.UV2Kind),La.G.PrepareAttributesForBones(o,e,s,i),La.G.PrepareAttributesForInstances(o,s);const a=["world","view","viewProjection","vEyePosition","vLightsType","vFogInfos","vFogColor","pointSize","mBones","vPrimaryColor","vPrimaryColorShadow","vReflectionInfos","reflectionMatrix","vReflectionMicrosurfaceInfos","fFovMultiplier","shadowLevel","alpha","vBackgroundCenter","vReflectionControl","vDiffuseInfos","diffuseMatrix"];(0,Ga.qx)(a);const l=["diffuseSampler","reflectionSampler","reflectionSamplerLow","reflectionSamplerHigh"],h=["Material","Scene"];ki.$&&(ki.$.PrepareUniforms(a,s),ki.$.PrepareSamplers(l,s)),La.G.PrepareUniformsAndSamplersList({uniformsNames:a,uniformBuffersNames:h,samplers:l,defines:s,maxSimultaneousLights:this._maxSimultaneousLights});const c=s.toString(),u=n.getEngine().createEffect("background",{attributes:o,uniformsNames:a,uniformBuffersNames:h,samplers:l,defines:c,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:this._maxSimultaneousLights}},r);t.setEffect(u,s,this._materialContext),this.buildUniformLayout()}return!(!t.effect||!t.effect.isReady()||(s._renderId=n.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=i,this._checkScenePerformancePriority(),0))}_computePrimaryColorFromPerceptualColor(){this.__perceptualColor&&(this._primaryColor.copyFrom(this.__perceptualColor),this._primaryColor.toLinearSpaceToRef(this._primaryColor,this.getScene().getEngine().useExactSrgbConversions),this._imageProcessingConfiguration&&this._primaryColor.scaleToRef(1/this._imageProcessingConfiguration.exposure,this._primaryColor),this._computePrimaryColors())}_computePrimaryColors(){0===this._primaryColorShadowLevel&&0===this._primaryColorHighlightLevel||(this._primaryColor.scaleToRef(this._primaryColorShadowLevel,this._primaryShadowColor),this._primaryColor.subtractToRef(this._primaryShadowColor,this._primaryShadowColor),this._white.subtractToRef(this._primaryColor,this._primaryHighlightColor),this._primaryHighlightColor.scaleToRef(this._primaryColorHighlightLevel,this._primaryHighlightColor),this._primaryColor.addToRef(this._primaryHighlightColor,this._primaryHighlightColor))}buildUniformLayout(){this._uniformBuffer.addUniform("vPrimaryColor",4),this._uniformBuffer.addUniform("vPrimaryColorShadow",4),this._uniformBuffer.addUniform("vDiffuseInfos",2),this._uniformBuffer.addUniform("vReflectionInfos",2),this._uniformBuffer.addUniform("diffuseMatrix",16),this._uniformBuffer.addUniform("reflectionMatrix",16),this._uniformBuffer.addUniform("vReflectionMicrosurfaceInfos",3),this._uniformBuffer.addUniform("fFovMultiplier",1),this._uniformBuffer.addUniform("pointSize",1),this._uniformBuffer.addUniform("shadowLevel",1),this._uniformBuffer.addUniform("alpha",1),this._uniformBuffer.addUniform("vBackgroundCenter",3),this._uniformBuffer.addUniform("vReflectionControl",4),this._uniformBuffer.create()}unbind(){this._diffuseTexture&&this._diffuseTexture.isRenderTarget&&this._uniformBuffer.setTexture("diffuseSampler",null),this._reflectionTexture&&this._reflectionTexture.isRenderTarget&&this._uniformBuffer.setTexture("reflectionSampler",null),super.unbind()}bindOnlyWorldMatrix(e){this._activeEffect.setMatrix("world",e)}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;if(!r)return;this._activeEffect=r,this.bindOnlyWorldMatrix(e),La.G.BindBonesParameters(t,this._activeEffect);const o=this._mustRebind(n,r,t.visibility);if(o){this._uniformBuffer.bindToEffect(r,"Material"),this.bindViewProjection(r);const e=this._reflectionTexture;this._uniformBuffer.useUbo&&this.isFrozen&&this._uniformBuffer.isSync||(n.texturesEnabled&&(this._diffuseTexture&&Va.k.DiffuseTextureEnabled&&(this._uniformBuffer.updateFloat2("vDiffuseInfos",this._diffuseTexture.coordinatesIndex,this._diffuseTexture.level),La.G.BindTextureMatrix(this._diffuseTexture,this._uniformBuffer,"diffuse")),e&&Va.k.ReflectionTextureEnabled&&(this._uniformBuffer.updateMatrix("reflectionMatrix",e.getReflectionTextureMatrix()),this._uniformBuffer.updateFloat2("vReflectionInfos",e.level,this._reflectionBlur),this._uniformBuffer.updateFloat3("vReflectionMicrosurfaceInfos",e.getSize().width,e.lodGenerationScale,e.lodGenerationOffset))),this.shadowLevel>0&&this._uniformBuffer.updateFloat("shadowLevel",this.shadowLevel),this._uniformBuffer.updateFloat("alpha",this.alpha),this.pointsCloud&&this._uniformBuffer.updateFloat("pointSize",this.pointSize),s.USEHIGHLIGHTANDSHADOWCOLORS?(this._uniformBuffer.updateColor4("vPrimaryColor",this._primaryHighlightColor,1),this._uniformBuffer.updateColor4("vPrimaryColorShadow",this._primaryShadowColor,1)):this._uniformBuffer.updateColor4("vPrimaryColor",this._primaryColor,1)),this._uniformBuffer.updateFloat("fFovMultiplier",this._fovMultiplier),n.texturesEnabled&&(this._diffuseTexture&&Va.k.DiffuseTextureEnabled&&this._uniformBuffer.setTexture("diffuseSampler",this._diffuseTexture),e&&Va.k.ReflectionTextureEnabled&&(s.REFLECTIONBLUR&&s.TEXTURELODSUPPORT?this._uniformBuffer.setTexture("reflectionSampler",e):s.REFLECTIONBLUR?(this._uniformBuffer.setTexture("reflectionSampler",e._lodTextureMid||e),this._uniformBuffer.setTexture("reflectionSamplerLow",e._lodTextureLow||e),this._uniformBuffer.setTexture("reflectionSamplerHigh",e._lodTextureHigh||e)):this._uniformBuffer.setTexture("reflectionSampler",e),s.REFLECTIONFRESNEL&&(this._uniformBuffer.updateFloat3("vBackgroundCenter",this.sceneCenter.x,this.sceneCenter.y,this.sceneCenter.z),this._uniformBuffer.updateFloat4("vReflectionControl",this._reflectionControls.x,this._reflectionControls.y,this._reflectionControls.z,this._reflectionControls.w)))),(0,Ga.an)(this._activeEffect,this,n),n.bindEyePosition(r)}else n.getEngine()._features.needToAlwaysBindUniformBuffers&&(this._uniformBuffer.bindToEffect(r,"Material"),this._needToBindSceneUbo=!0);!o&&this.isFrozen||(n.lightsEnabled&&La.G.BindLights(n,t,this._activeEffect,s,this._maxSimultaneousLights),this.bindView(r),La.G.BindFogParameters(n,t,this._activeEffect,!0),this._imageProcessingConfiguration&&this._imageProcessingConfiguration.bind(this._activeEffect)),this._afterBind(t,this._activeEffect),this._uniformBuffer.update()}hasTexture(e){return!!super.hasTexture(e)||this._reflectionTexture===e||this._diffuseTexture===e}dispose(e=!1,t=!1){t&&(this.diffuseTexture&&this.diffuseTexture.dispose(),this.reflectionTexture&&this.reflectionTexture.dispose()),this._renderTargets.dispose(),this._imageProcessingConfiguration&&this._imageProcessingObserver&&this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver),super.dispose(e)}clone(e){return Te.p4.Clone((()=>new Wa(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.BackgroundMaterial",e}getClassName(){return"BackgroundMaterial"}static Parse(e,t,i){return Te.p4.Parse((()=>new Wa(e.name,t)),e,t,i)}}Wa.StandardReflectance0=.05,Wa.StandardReflectance90=.5,(0,be.gn)([(0,Te.n9)()],Wa.prototype,"_primaryColor",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsLightsDirty")],Wa.prototype,"primaryColor",void 0),(0,be.gn)([(0,Te.n9)()],Wa.prototype,"__perceptualColor",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_primaryColorShadowLevel",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_primaryColorHighlightLevel",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsLightsDirty")],Wa.prototype,"primaryColorHighlightLevel",null),(0,be.gn)([(0,Te.oU)()],Wa.prototype,"_reflectionTexture",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"reflectionTexture",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_reflectionBlur",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"reflectionBlur",void 0),(0,be.gn)([(0,Te.oU)()],Wa.prototype,"_diffuseTexture",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"diffuseTexture",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"shadowLights",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_shadowLevel",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"shadowLevel",void 0),(0,be.gn)([(0,Te.hd)()],Wa.prototype,"_sceneCenter",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"sceneCenter",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_opacityFresnel",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"opacityFresnel",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_reflectionFresnel",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"reflectionFresnel",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_reflectionFalloffDistance",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"reflectionFalloffDistance",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_reflectionAmount",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"reflectionAmount",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_reflectionReflectance0",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"reflectionReflectance0",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_reflectionReflectance90",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"reflectionReflectance90",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_useRGBColor",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"useRGBColor",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_enableNoise",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"enableNoise",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_maxSimultaneousLights",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],Wa.prototype,"maxSimultaneousLights",void 0),(0,be.gn)([(0,Te.qC)()],Wa.prototype,"_shadowOnly",void 0),(0,be.gn)([(0,Te.wz)("_markAllSubMeshesAsLightsDirty")],Wa.prototype,"shadowOnly",void 0),(0,be.gn)([(0,Te.rX)()],Wa.prototype,"_imageProcessingConfiguration",void 0),(0,l.H)("BABYLON.BackgroundMaterial",Wa);class Ha{static _GetDefaultOptions(e){return{createGround:!0,groundSize:15,groundTexture:this._GroundTextureCDNUrl,groundColor:new a.Wo(.2,.2,.3).toLinearSpace(e.getEngine().useExactSrgbConversions).scale(3),groundOpacity:.9,enableGroundShadow:!0,groundShadowLevel:.5,enableGroundMirror:!1,groundMirrorSizeRatio:.3,groundMirrorBlurKernel:64,groundMirrorAmount:1,groundMirrorFresnelWeight:1,groundMirrorFallOffDistance:0,groundMirrorTextureType:0,groundYBias:1e-5,createSkybox:!0,skyboxSize:20,skyboxTexture:this._SkyboxTextureCDNUrl,skyboxColor:new a.Wo(.2,.2,.3).toLinearSpace(e.getEngine().useExactSrgbConversions).scale(3),backgroundYRotation:0,sizeAuto:!0,rootPosition:o.P.Zero(),setupImageProcessing:!0,environmentTexture:this._EnvironmentTextureCDNUrl,cameraExposure:.8,cameraContrast:1.2,toneMappingEnabled:!0}}get rootMesh(){return this._rootMesh}get skybox(){return this._skybox}get skyboxTexture(){return this._skyboxTexture}get skyboxMaterial(){return this._skyboxMaterial}get ground(){return this._ground}get groundTexture(){return this._groundTexture}get groundMirror(){return this._groundMirror}get groundMirrorRenderList(){return this._groundMirror?this._groundMirror.renderList:null}get groundMaterial(){return this._groundMaterial}constructor(e,t){this._errorHandler=(e,t)=>{this.onErrorObservable.notifyObservers({message:e,exception:t})},this._options={...Ha._GetDefaultOptions(t),...e},this._scene=t,this.onErrorObservable=new r.y$,this._setupBackground(),this._setupImageProcessing()}updateOptions(e){const t={...this._options,...e};this._ground&&!t.createGround&&(this._ground.dispose(),this._ground=null),this._groundMaterial&&!t.createGround&&(this._groundMaterial.dispose(),this._groundMaterial=null),this._groundTexture&&this._options.groundTexture!=t.groundTexture&&(this._groundTexture.dispose(),this._groundTexture=null),this._skybox&&!t.createSkybox&&(this._skybox.dispose(),this._skybox=null),this._skyboxMaterial&&!t.createSkybox&&(this._skyboxMaterial.dispose(),this._skyboxMaterial=null),this._skyboxTexture&&this._options.skyboxTexture!=t.skyboxTexture&&(this._skyboxTexture.dispose(),this._skyboxTexture=null),this._groundMirror&&!t.enableGroundMirror&&(this._groundMirror.dispose(),this._groundMirror=null),this._scene.environmentTexture&&this._options.environmentTexture!=t.environmentTexture&&this._scene.environmentTexture.dispose(),this._options=t,this._setupBackground(),this._setupImageProcessing()}setMainColor(e){this.groundMaterial&&(this.groundMaterial.primaryColor=e),this.skyboxMaterial&&(this.skyboxMaterial.primaryColor=e),this.groundMirror&&(this.groundMirror.clearColor=new a.HE(e.r,e.g,e.b,1))}_setupImageProcessing(){this._options.setupImageProcessing&&(this._scene.imageProcessingConfiguration.contrast=this._options.cameraContrast,this._scene.imageProcessingConfiguration.exposure=this._options.cameraExposure,this._scene.imageProcessingConfiguration.toneMappingEnabled=this._options.toneMappingEnabled,this._setupEnvironmentTexture())}_setupEnvironmentTexture(){if(this._scene.environmentTexture)return;if(this._options.environmentTexture instanceof Oa.V)return void(this._scene.environmentTexture=this._options.environmentTexture);const e=Fa.B.CreateFromPrefilteredData(this._options.environmentTexture,this._scene);this._scene.environmentTexture=e}_setupBackground(){this._rootMesh||(this._rootMesh=new Nt.Kj("BackgroundHelper",this._scene)),this._rootMesh.rotation.y=this._options.backgroundYRotation;const e=this._getSceneSize();this._options.createGround&&(this._setupGround(e),this._setupGroundMaterial(),this._setupGroundDiffuseTexture(),this._options.enableGroundMirror&&this._setupGroundMirrorTexture(e),this._setupMirrorInGroundMaterial()),this._options.createSkybox&&(this._setupSkybox(e),this._setupSkyboxMaterial(),this._setupSkyboxReflectionTexture()),this._rootMesh.position.x=e.rootPosition.x,this._rootMesh.position.z=e.rootPosition.z,this._rootMesh.position.y=e.rootPosition.y}_getSceneSize(){let e=this._options.groundSize,t=this._options.skyboxSize,i=this._options.rootPosition;if(!this._scene.meshes||1===this._scene.meshes.length)return{groundSize:e,skyboxSize:t,rootPosition:i};const n=this._scene.getWorldExtends((e=>e!==this._ground&&e!==this._rootMesh&&e!==this._skybox)),s=n.max.subtract(n.min);if(this._options.sizeAuto){this._scene.activeCamera instanceof Ft&&this._scene.activeCamera.upperRadiusLimit&&(e=2*this._scene.activeCamera.upperRadiusLimit,t=e);const r=s.length();r>e&&(e=2*r,t=e),e*=1.1,t*=1.5,i=n.min.add(s.scale(.5)),i.y=n.min.y-this._options.groundYBias}return{groundSize:e,skyboxSize:t,rootPosition:i}}_setupGround(e){this._ground&&!this._ground.isDisposed()||(this._ground=(0,pa.pT)("BackgroundPlane",{size:e.groundSize},this._scene),this._ground.rotation.x=Math.PI/2,this._ground.parent=this._rootMesh,this._ground.onDisposeObservable.add((()=>{this._ground=null}))),this._ground.receiveShadows=this._options.enableGroundShadow}_setupGroundMaterial(){this._groundMaterial||(this._groundMaterial=new Wa("BackgroundPlaneMaterial",this._scene)),this._groundMaterial.alpha=this._options.groundOpacity,this._groundMaterial.alphaMode=8,this._groundMaterial.shadowLevel=this._options.groundShadowLevel,this._groundMaterial.primaryColor=this._options.groundColor,this._groundMaterial.useRGBColor=!1,this._groundMaterial.enableNoise=!0,this._ground&&(this._ground.material=this._groundMaterial)}_setupGroundDiffuseTexture(){this._groundMaterial&&(this._groundTexture||(this._options.groundTexture instanceof Oa.V?this._groundMaterial.diffuseTexture=this._options.groundTexture:(this._groundTexture=new Ce.x(this._options.groundTexture,this._scene,void 0,void 0,void 0,void 0,this._errorHandler),this._groundTexture.gammaSpace=!1,this._groundTexture.hasAlpha=!0,this._groundMaterial.diffuseTexture=this._groundTexture)))}_setupGroundMirrorTexture(e){const t=Ce.x.CLAMP_ADDRESSMODE;if(!this._groundMirror&&(this._groundMirror=new Na("BackgroundPlaneMirrorTexture",{ratio:this._options.groundMirrorSizeRatio},this._scene,!1,this._options.groundMirrorTextureType,Ce.x.BILINEAR_SAMPLINGMODE,!0),this._groundMirror.mirrorPlane=new ot.J(0,-1,0,e.rootPosition.y),this._groundMirror.anisotropicFilteringLevel=1,this._groundMirror.wrapU=t,this._groundMirror.wrapV=t,this._groundMirror.renderList))for(let e=0;e<this._scene.meshes.length;e++){const t=this._scene.meshes[e];t!==this._ground&&t!==this._skybox&&t!==this._rootMesh&&this._groundMirror.renderList.push(t)}const i=this._options.groundColor.toGammaSpace(this._scene.getEngine().useExactSrgbConversions);this._groundMirror.clearColor=new a.HE(i.r,i.g,i.b,1),this._groundMirror.adaptiveBlurKernel=this._options.groundMirrorBlurKernel}_setupMirrorInGroundMaterial(){this._groundMaterial&&(this._groundMaterial.reflectionTexture=this._groundMirror,this._groundMaterial.reflectionFresnel=!0,this._groundMaterial.reflectionAmount=this._options.groundMirrorAmount,this._groundMaterial.reflectionStandardFresnelWeight=this._options.groundMirrorFresnelWeight,this._groundMaterial.reflectionFalloffDistance=this._options.groundMirrorFallOffDistance)}_setupSkybox(e){this._skybox&&!this._skybox.isDisposed()||(this._skybox=(0,Yn.NR)("BackgroundSkybox",{size:e.skyboxSize,sideOrientation:Nt.Kj.BACKSIDE},this._scene),this._skybox.onDisposeObservable.add((()=>{this._skybox=null}))),this._skybox.parent=this._rootMesh}_setupSkyboxMaterial(){this._skybox&&(this._skyboxMaterial||(this._skyboxMaterial=new Wa("BackgroundSkyboxMaterial",this._scene)),this._skyboxMaterial.useRGBColor=!1,this._skyboxMaterial.primaryColor=this._options.skyboxColor,this._skyboxMaterial.enableNoise=!0,this._skybox.material=this._skyboxMaterial)}_setupSkyboxReflectionTexture(){this._skyboxMaterial&&(this._skyboxTexture||(this._options.skyboxTexture instanceof Oa.V?this._skyboxMaterial.reflectionTexture=this._options.skyboxTexture:(this._skyboxTexture=new Fa.B(this._options.skyboxTexture,this._scene,void 0,void 0,void 0,void 0,this._errorHandler),this._skyboxTexture.coordinatesMode=Ce.x.SKYBOX_MODE,this._skyboxTexture.gammaSpace=!1,this._skyboxMaterial.reflectionTexture=this._skyboxTexture)))}dispose(){this._groundMaterial&&this._groundMaterial.dispose(!0,!0),this._skyboxMaterial&&this._skyboxMaterial.dispose(!0,!0),this._rootMesh.dispose(!1)}}Ha._GroundTextureCDNUrl="https://assets.babylonjs.com/environments/backgroundGround.png",Ha._SkyboxTextureCDNUrl="https://assets.babylonjs.com/environments/backgroundSkybox.dds",Ha._EnvironmentTextureCDNUrl="https://assets.babylonjs.com/environments/environmentSpecular.env";class Xa extends yi.Y{get texture(){return this._texture}set texture(e){this._texture!==e&&(this._texture=e,this._useDirectMapping?(this._texture.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._texture.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._material.diffuseTexture=this._texture):(this._texture.coordinatesMode=Ce.x.FIXED_EQUIRECTANGULAR_MIRRORED_MODE,this._texture.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._material.reflectionTexture=this._texture),this._changeTextureMode(this._textureMode))}get mesh(){return this._mesh}get fovMultiplier(){return this._material.fovMultiplier}set fovMultiplier(e){this._material.fovMultiplier=e}get textureMode(){return this._textureMode}set textureMode(e){this._textureMode!==e&&this._changeTextureMode(e)}get halfDome(){return this._halfDome}set halfDome(e){this._halfDome=e,this._halfDomeMask.setEnabled(e),this._changeTextureMode(this._textureMode)}set crossEye(e){this._crossEye=e,this._changeTextureMode(this._textureMode)}get crossEye(){return this._crossEye}get material(){return this._material}constructor(e,t,i,n,s=null){super(e,n),this.onError=s,this._halfDome=!1,this._crossEye=!1,this._useDirectMapping=!1,this._textureMode=Xa.MODE_MONOSCOPIC,this._onBeforeCameraRenderObserver=null,this.onLoadErrorObservable=new r.y$,this.onLoadObservable=new r.y$,n=this.getScene(),e=e||"textureDome",i.resolution=0|Math.abs(i.resolution)||32,i.clickToPlay=Boolean(i.clickToPlay),i.autoPlay=void 0===i.autoPlay||Boolean(i.autoPlay),i.loop=void 0===i.loop||Boolean(i.loop),i.size=Math.abs(i.size)||(n.activeCamera?.48*n.activeCamera.maxZ:1e3),void 0===i.useDirectMapping?this._useDirectMapping=!0:this._useDirectMapping=i.useDirectMapping,void 0===i.faceForward&&(i.faceForward=!0),this._setReady(!1),i.mesh?this._mesh=i.mesh:this._mesh=Kn(e+"_mesh",{segments:i.resolution,diameter:i.size,updatable:!1,sideOrientation:Nt.Kj.BACKSIDE},n);const a=this._material=new Wa(e+"_material",n);a.useEquirectangularFOV=!0,a.fovMultiplier=1,a.opacityFresnel=!1;const l=this._initTexture(t,n,i);if(this.texture=l,this._mesh.material=a,this._mesh.parent=this,this._halfDomeMask=Kn("",{slice:.5,diameter:.98*i.size,segments:2*i.resolution,sideOrientation:Nt.Kj.BACKSIDE},n),this._halfDomeMask.rotate(Gr.RD.X,-Math.PI/2),this._halfDomeMask.parent=this._mesh,this._halfDome=!!i.halfDomeMode,this._halfDomeMask.setEnabled(this._halfDome),this._crossEye=!!i.crossEyeMode,this._texture.anisotropicFilteringLevel=1,this._texture.onLoadObservable.addOnce((()=>{this._setReady(!0)})),i.faceForward&&n.activeCamera){const e=n.activeCamera,t=o.P.Forward(),i=o.P.TransformNormal(t,e.getViewMatrix());i.normalize(),this.rotation.y=Math.acos(o.P.Dot(t,i))}this._changeTextureMode(this._textureMode)}_changeTextureMode(e){switch(this._scene.onBeforeCameraRenderObservable.remove(this._onBeforeCameraRenderObserver),this._textureMode=e,this._texture.uScale=1,this._texture.vScale=1,this._texture.uOffset=0,this._texture.vOffset=0,this._texture.vAng=0,e){case Xa.MODE_MONOSCOPIC:this._halfDome&&(this._texture.uScale=2,this._texture.uOffset=-1);break;case Xa.MODE_SIDEBYSIDE:{this._texture.uScale=this._halfDome?.99999:.5;const e=this._halfDome?0:.5,t=this._halfDome?-.5:0;this._onBeforeCameraRenderObserver=this._scene.onBeforeCameraRenderObservable.add((i=>{let n=i.isRightCamera;this._crossEye&&(n=!n),this._texture.uOffset=n?e:t}));break}case Xa.MODE_TOPBOTTOM:this._texture.vScale=this._halfDome?.99999:.5,this._onBeforeCameraRenderObserver=this._scene.onBeforeCameraRenderObservable.add((e=>{let t=e.isRightCamera;this._crossEye&&(t=!t),this._texture.vOffset=t?.5:0}))}}dispose(e,t=!1){this._texture.dispose(),this._mesh.dispose(),this._material.dispose(),this._scene.onBeforeCameraRenderObservable.remove(this._onBeforeCameraRenderObserver),this.onLoadErrorObservable.clear(),this.onLoadObservable.clear(),super.dispose(e,t)}}Xa.MODE_MONOSCOPIC=0,Xa.MODE_TOPBOTTOM=1,Xa.MODE_SIDEBYSIDE=2;class ja extends Xa{get photoTexture(){return this.texture}set photoTexture(e){this.texture=e}get imageMode(){return this.textureMode}set imageMode(e){this.textureMode=e}_initTexture(e,t,i){return new Ce.x(e,t,!i.generateMipMaps,!this._useDirectMapping,void 0,(()=>{this.onLoadObservable.notifyObservers()}),((e,t)=>{this.onLoadErrorObservable.notifyObservers(e||"Unknown error occured"),this.onError&&this.onError(e,t)}))}}ja.MODE_MONOSCOPIC=Xa.MODE_MONOSCOPIC,ja.MODE_TOPBOTTOM=Xa.MODE_TOPBOTTOM,ja.MODE_SIDEBYSIDE=Xa.MODE_SIDEBYSIDE;var Ya=i(9500),qa=i(6113),Ka=i(123);const $a=131072,Qa=131072;function Za(e){return e.charCodeAt(0)+(e.charCodeAt(1)<<8)+(e.charCodeAt(2)<<16)+(e.charCodeAt(3)<<24)}const Ja=Za("DXT1"),el=Za("DXT3"),tl=Za("DXT5"),il=Za("DX10");class nl{static GetDDSInfo(e){const t=new Int32Array(e.buffer,e.byteOffset,31),i=new Int32Array(e.buffer,e.byteOffset,35);let n=1;t[2]&$a&&(n=Math.max(1,t[7]));const s=t[21],r=s===il?i[32]:0;let o=0;switch(s){case 113:o=2;break;case 116:o=1;break;case il:if(10===r){o=2;break}if(2===r){o=1;break}}return{width:t[4],height:t[3],mipmapCount:n,isFourCC:4==(4&t[20]),isRGB:64==(64&t[20]),isLuminance:(t[20]&Qa)===Qa,isCube:512==(512&t[28]),isCompressed:s===Ja||s===el||s===tl,dxgiFormat:r,textureType:o}}static _GetHalfFloatAsFloatRGBAArrayBuffer(e,t,i,n,s,r){const o=new Float32Array(n),a=new Uint16Array(s,i);let l=0;for(let i=0;i<t;i++)for(let t=0;t<e;t++){const n=4*(t+i*e);o[l]=(0,ro.qZ)(a[n]),o[l+1]=(0,ro.qZ)(a[n+1]),o[l+2]=(0,ro.qZ)(a[n+2]),nl.StoreLODInAlphaChannel?o[l+3]=r:o[l+3]=(0,ro.qZ)(a[n+3]),l+=4}return o}static _GetHalfFloatRGBAArrayBuffer(e,t,i,n,s,r){if(nl.StoreLODInAlphaChannel){const o=new Uint16Array(n),a=new Uint16Array(s,i);let l=0;for(let i=0;i<t;i++)for(let t=0;t<e;t++){const n=4*(t+i*e);o[l]=a[n],o[l+1]=a[n+1],o[l+2]=a[n+2],o[l+3]=(0,ro.ay)(r),l+=4}return o}return new Uint16Array(s,i,n)}static _GetFloatRGBAArrayBuffer(e,t,i,n,s,r){if(nl.StoreLODInAlphaChannel){const o=new Float32Array(n),a=new Float32Array(s,i);let l=0;for(let i=0;i<t;i++)for(let t=0;t<e;t++){const n=4*(t+i*e);o[l]=a[n],o[l+1]=a[n+1],o[l+2]=a[n+2],o[l+3]=r,l+=4}return o}return new Float32Array(s,i,n)}static _GetFloatAsHalfFloatRGBAArrayBuffer(e,t,i,n,s,r){const o=new Uint16Array(n),a=new Float32Array(s,i);let l=0;for(let i=0;i<t;i++)for(let t=0;t<e;t++)o[l]=(0,ro.ay)(a[l]),o[l+1]=(0,ro.ay)(a[l+1]),o[l+2]=(0,ro.ay)(a[l+2]),nl.StoreLODInAlphaChannel?o[l+3]=(0,ro.ay)(r):o[l+3]=(0,ro.ay)(a[l+3]),l+=4;return o}static _GetFloatAsUIntRGBAArrayBuffer(e,t,i,n,s,r){const o=new Uint8Array(n),a=new Float32Array(s,i);let l=0;for(let i=0;i<t;i++)for(let t=0;t<e;t++){const n=4*(t+i*e);o[l]=255*lt.R.Clamp(a[n]),o[l+1]=255*lt.R.Clamp(a[n+1]),o[l+2]=255*lt.R.Clamp(a[n+2]),nl.StoreLODInAlphaChannel?o[l+3]=r:o[l+3]=255*lt.R.Clamp(a[n+3]),l+=4}return o}static _GetHalfFloatAsUIntRGBAArrayBuffer(e,t,i,n,s,r){const o=new Uint8Array(n),a=new Uint16Array(s,i);let l=0;for(let i=0;i<t;i++)for(let t=0;t<e;t++){const n=4*(t+i*e);o[l]=255*lt.R.Clamp((0,ro.qZ)(a[n])),o[l+1]=255*lt.R.Clamp((0,ro.qZ)(a[n+1])),o[l+2]=255*lt.R.Clamp((0,ro.qZ)(a[n+2])),nl.StoreLODInAlphaChannel?o[l+3]=r:o[l+3]=255*lt.R.Clamp((0,ro.qZ)(a[n+3])),l+=4}return o}static _GetRGBAArrayBuffer(e,t,i,n,s,r,o,a,l){const h=new Uint8Array(n),c=new Uint8Array(s,i);let u=0;for(let i=0;i<t;i++)for(let t=0;t<e;t++){const n=4*(t+i*e);h[u]=c[n+r],h[u+1]=c[n+o],h[u+2]=c[n+a],h[u+3]=c[n+l],u+=4}return h}static _ExtractLongWordOrder(e){return 0===e||255===e||-16777216===e?0:1+nl._ExtractLongWordOrder(e>>8)}static _GetRGBArrayBuffer(e,t,i,n,s,r,o,a){const l=new Uint8Array(n),h=new Uint8Array(s,i);let c=0;for(let i=0;i<t;i++)for(let t=0;t<e;t++){const n=3*(t+i*e);l[c]=h[n+r],l[c+1]=h[n+o],l[c+2]=h[n+a],c+=3}return l}static _GetLuminanceArrayBuffer(e,t,i,n,s){const r=new Uint8Array(n),o=new Uint8Array(s,i);let a=0;for(let i=0;i<t;i++)for(let t=0;t<e;t++){const n=t+i*e;r[a]=o[n],a++}return r}static UploadDDSLevels(e,t,i,n,s,r,o=-1,a,l=!0){let h=null;n.sphericalPolynomial&&(h=new Array);const c=!!e.getCaps().s3tc;t.generateMipMaps=s;const u=new Int32Array(i.buffer,i.byteOffset,31);let d,p,f,m,g,v,y,x=0,b=0,T=1;if(542327876!==u[0])return void _.Y.Error("Invalid magic number in DDS header");if(!n.isFourCC&&!n.isRGB&&!n.isLuminance)return void _.Y.Error("Unsupported format, must contain a FourCC, RGB or LUMINANCE code");if(n.isCompressed&&!c)return void _.Y.Error("Compressed textures are not supported on this platform.");let S=u[22];m=u[1]+4;let E=!1;if(n.isFourCC)switch(d=u[21],d){case Ja:T=8,b=33777;break;case el:T=16,b=33778;break;case tl:T=16,b=33779;break;case 113:E=!0,S=64;break;case 116:E=!0,S=128;break;case il:{m+=20;let e=!1;switch(n.dxgiFormat){case 10:E=!0,S=64,e=!0;break;case 2:E=!0,S=128,e=!0;break;case 88:n.isRGB=!0,n.isFourCC=!1,S=32,e=!0}if(e)break}default:return void console.error("Unsupported FourCC code:",(C=d,String.fromCharCode(255&C,C>>8&255,C>>16&255,C>>24&255)))}var C;const A=nl._ExtractLongWordOrder(u[23]),P=nl._ExtractLongWordOrder(u[24]),R=nl._ExtractLongWordOrder(u[25]),M=nl._ExtractLongWordOrder(u[26]);E&&(b=e._getRGBABufferInternalSizedFormat(n.textureType)),v=1,u[2]&$a&&!1!==s&&(v=Math.max(1,u[7]));const I=a||0,D=e.getCaps();for(let s=I;s<r;s++){for(p=u[4],f=u[3],y=0;y<v;++y){if(-1===o||o===y){const r=-1===o?y:0;if(!n.isCompressed&&n.isFourCC){t.format=5,x=p*f*4;let n=null;if(e._badOS||e._badDesktopOS||!D.textureHalfFloat&&!D.textureFloat)128===S?(n=nl._GetFloatAsUIntRGBAArrayBuffer(p,f,i.byteOffset+m,x,i.buffer,r),h&&0==r&&h.push(nl._GetFloatRGBAArrayBuffer(p,f,i.byteOffset+m,x,i.buffer,r))):64===S&&(n=nl._GetHalfFloatAsUIntRGBAArrayBuffer(p,f,i.byteOffset+m,x,i.buffer,r),h&&0==r&&h.push(nl._GetHalfFloatAsFloatRGBAArrayBuffer(p,f,i.byteOffset+m,x,i.buffer,r))),t.type=0;else{const e=D.textureFloat&&(l&&D.textureFloatLinearFiltering||!l),s=D.textureHalfFloat&&(l&&D.textureHalfFloatLinearFiltering||!l),o=(128===S||64===S&&!s)&&e?1:(64===S||128===S&&!e)&&s?2:0;let a,c=null;if(128===S)switch(o){case 1:a=nl._GetFloatRGBAArrayBuffer,c=null;break;case 2:a=nl._GetFloatAsHalfFloatRGBAArrayBuffer,c=nl._GetFloatRGBAArrayBuffer;break;case 0:a=nl._GetFloatAsUIntRGBAArrayBuffer,c=nl._GetFloatRGBAArrayBuffer}else switch(o){case 1:a=nl._GetHalfFloatAsFloatRGBAArrayBuffer,c=null;break;case 2:a=nl._GetHalfFloatRGBAArrayBuffer,c=nl._GetHalfFloatAsFloatRGBAArrayBuffer;break;case 0:a=nl._GetHalfFloatAsUIntRGBAArrayBuffer,c=nl._GetHalfFloatAsFloatRGBAArrayBuffer}t.type=o,n=a(p,f,i.byteOffset+m,x,i.buffer,r),h&&0==r&&h.push(c?c(p,f,i.byteOffset+m,x,i.buffer,r):n)}n&&e._uploadDataToTextureDirectly(t,n,s,r)}else if(n.isRGB)t.type=0,24===S?(t.format=4,x=p*f*3,g=nl._GetRGBArrayBuffer(p,f,i.byteOffset+m,x,i.buffer,A,P,R),e._uploadDataToTextureDirectly(t,g,s,r)):(t.format=5,x=p*f*4,g=nl._GetRGBAArrayBuffer(p,f,i.byteOffset+m,x,i.buffer,A,P,R,M),e._uploadDataToTextureDirectly(t,g,s,r));else if(n.isLuminance){const n=e._getUnpackAlignement(),o=p;x=Math.floor((p+n-1)/n)*n*(f-1)+o,g=nl._GetLuminanceArrayBuffer(p,f,i.byteOffset+m,x,i.buffer),t.format=1,t.type=0,e._uploadDataToTextureDirectly(t,g,s,r)}else x=Math.max(4,p)/4*Math.max(4,f)/4*T,g=new Uint8Array(i.buffer,i.byteOffset+m,x),t.type=0,e._uploadCompressedDataToTextureDirectly(t,b,p,f,g,s,r)}m+=S?p*f*(S/8):x,p*=.5,f*=.5,p=Math.max(1,p),f=Math.max(1,f)}if(void 0!==a)break}h&&h.length>0?n.sphericalPolynomial=Ka.$.ConvertCubeMapToSphericalPolynomial({size:u[4],right:h[0],left:h[1],up:h[2],down:h[3],front:h[4],back:h[5],format:5,type:1,gammaSpace:!1}):n.sphericalPolynomial=void 0}}nl.StoreLODInAlphaChannel=!1,Rn.B.prototype.createPrefilteredCubeTexture=function(e,t,i,n,s=null,r=null,o,a=null,l=!0){return this.createCubeTexture(e,t,null,!1,(e=>{if(!e)return void(s&&s(null));const r=e.texture;if(l?e.info.sphericalPolynomial&&(r._sphericalPolynomial=e.info.sphericalPolynomial):r._sphericalPolynomial=new qa.i,r._source=Ei.S.CubePrefiltered,this.getCaps().textureLOD)return void(s&&s(r));const o=this._gl,a=e.width;if(!a)return;const h=[];for(let s=0;s<3;s++){const l=1-s/2,c=n,u=lt.R.Log2(a)*i+n,d=c+(u-c)*l,p=Math.round(Math.min(Math.max(d,0),u)),f=new Ei.l(this,Ei.S.Temp);if(f.type=r.type,f.format=r.format,f.width=Math.pow(2,Math.max(lt.R.Log2(a)-p,0)),f.height=f.width,f.isCube=!0,f._cachedWrapU=0,f._cachedWrapV=0,this._bindTextureDirectly(o.TEXTURE_CUBE_MAP,f,!0),f.samplingMode=2,o.texParameteri(o.TEXTURE_CUBE_MAP,o.TEXTURE_MAG_FILTER,o.LINEAR),o.texParameteri(o.TEXTURE_CUBE_MAP,o.TEXTURE_MIN_FILTER,o.LINEAR),o.texParameteri(o.TEXTURE_CUBE_MAP,o.TEXTURE_WRAP_S,o.CLAMP_TO_EDGE),o.texParameteri(o.TEXTURE_CUBE_MAP,o.TEXTURE_WRAP_T,o.CLAMP_TO_EDGE),e.isDDS){const t=e.info,i=e.data;this._unpackFlipY(t.isCompressed),nl.UploadDDSLevels(this,f,i,t,!0,6,p)}else _.Y.Warn("DDS is the only prefiltered cube map supported so far.");this._bindTextureDirectly(o.TEXTURE_CUBE_MAP,null);const m=new Oa.V(t);m._isCube=!0,m._texture=f,f.isReady=!0,h.push(m)}r._lodTextureHigh=h[2],r._lodTextureMid=h[1],r._lodTextureLow=h[0],s&&s(r)}),r,o,a,l,i,n)};class sl{constructor(){this.supportCascades=!0}canLoad(e){return e.endsWith(".dds")}loadCubeData(e,t,i,n){const s=t.getEngine();let r,o=!1,a=1e3;if(Array.isArray(e))for(let i=0;i<e.length;i++){const n=e[i];r=nl.GetDDSInfo(n),t.width=r.width,t.height=r.height,o=(r.isRGB||r.isLuminance||r.mipmapCount>1)&&t.generateMipMaps,s._unpackFlipY(r.isCompressed),nl.UploadDDSLevels(s,t,n,r,o,6,-1,i),r.isFourCC||1!==r.mipmapCount?a=r.mipmapCount-1:s.generateMipMapsForCubemap(t)}else{const n=e;r=nl.GetDDSInfo(n),t.width=r.width,t.height=r.height,i&&(r.sphericalPolynomial=new qa.i),o=(r.isRGB||r.isLuminance||r.mipmapCount>1)&&t.generateMipMaps,s._unpackFlipY(r.isCompressed),nl.UploadDDSLevels(s,t,n,r,o,6),r.isFourCC||1!==r.mipmapCount?a=r.mipmapCount-1:s.generateMipMapsForCubemap(t,!1)}s._setCubeMapTextureParams(t,o,a),t.isReady=!0,t.onLoadedObservable.notifyObservers(t),t.onLoadedObservable.clear(),n&&n({isDDS:!0,width:t.width,info:r,data:e,texture:t})}loadData(e,t,i){const n=nl.GetDDSInfo(e),s=(n.isRGB||n.isLuminance||n.mipmapCount>1)&&t.generateMipMaps&&n.width>>n.mipmapCount-1==1;i(n.width,n.height,s,n.isFourCC,(()=>{nl.UploadDDSLevels(t.getEngine(),t,e,n,s,1)}))}}ue.D._TextureLoaders.push(new sl);class rl{constructor(){this.supportCascades=!1}canLoad(e){return e.endsWith(".env")}loadCubeData(e,t,i,n,s){if(Array.isArray(e))return;const r=(0,Gs.qJ)(e);if(r){t.width=r.width,t.height=r.width;try{(0,Gs.qC)(t,r),(0,Gs.Ro)(t,e,r).then((()=>{t.isReady=!0,t.onLoadedObservable.notifyObservers(t),t.onLoadedObservable.clear(),n&&n()}),(e=>{null==s||s("Can not upload environment levels",e)}))}catch(e){null==s||s("Can not upload environment file",e)}}else s&&s("Can not parse the environment file",null)}loadData(){throw".env not supported in 2d."}}ue.D._TextureLoaders.push(new rl);class ol{constructor(e,t){if(this.data=e,this.isInvalid=!1,!ol.IsValid(e))return this.isInvalid=!0,void _.Y.Error("texture missing KTX identifier");const i=Uint32Array.BYTES_PER_ELEMENT,n=new DataView(this.data.buffer,this.data.byteOffset+12,13*i),s=67305985===n.getUint32(0,!0);return this.glType=n.getUint32(1*i,s),this.glTypeSize=n.getUint32(2*i,s),this.glFormat=n.getUint32(3*i,s),this.glInternalFormat=n.getUint32(4*i,s),this.glBaseInternalFormat=n.getUint32(5*i,s),this.pixelWidth=n.getUint32(6*i,s),this.pixelHeight=n.getUint32(7*i,s),this.pixelDepth=n.getUint32(8*i,s),this.numberOfArrayElements=n.getUint32(9*i,s),this.numberOfFaces=n.getUint32(10*i,s),this.numberOfMipmapLevels=n.getUint32(11*i,s),this.bytesOfKeyValueData=n.getUint32(12*i,s),0!==this.glType?(_.Y.Error("only compressed formats currently supported"),void(this.isInvalid=!0)):(this.numberOfMipmapLevels=Math.max(1,this.numberOfMipmapLevels),0===this.pixelHeight||0!==this.pixelDepth?(_.Y.Error("only 2D textures currently supported"),void(this.isInvalid=!0)):0!==this.numberOfArrayElements?(_.Y.Error("texture arrays not currently supported"),void(this.isInvalid=!0)):this.numberOfFaces!==t?(_.Y.Error("number of faces expected"+t+", but found "+this.numberOfFaces),void(this.isInvalid=!0)):void(this.loadType=ol.COMPRESSED_2D))}uploadLevels(e,t){switch(this.loadType){case ol.COMPRESSED_2D:this._upload2DCompressedLevels(e,t);case ol.TEX_2D:case ol.COMPRESSED_3D:case ol.TEX_3D:}}_upload2DCompressedLevels(e,t){let i=ol.HEADER_LEN+this.bytesOfKeyValueData,n=this.pixelWidth,s=this.pixelHeight;const r=t?this.numberOfMipmapLevels:1;for(let t=0;t<r;t++){const r=new Int32Array(this.data.buffer,this.data.byteOffset+i,1)[0];i+=4;for(let o=0;o<this.numberOfFaces;o++){const a=new Uint8Array(this.data.buffer,this.data.byteOffset+i,r);e.getEngine()._uploadCompressedDataToTextureDirectly(e,e.format,n,s,a,o,t),i+=r,i+=3-(r+3)%4}n=Math.max(1,.5*n),s=Math.max(1,.5*s)}}static IsValid(e){if(e.byteLength>=12){const t=new Uint8Array(e.buffer,e.byteOffset,12);if(171===t[0]&&75===t[1]&&84===t[2]&&88===t[3]&&32===t[4]&&49===t[5]&&49===t[6]&&187===t[7]&&13===t[8]&&10===t[9]&&26===t[10]&&10===t[11])return!0}return!1}}ol.HEADER_LEN=64,ol.COMPRESSED_2D=0,ol.COMPRESSED_3D=1,ol.TEX_2D=2,ol.TEX_3D=3;var al,ll,hl,cl=i(6250);function ul(e){return e?de.w1.GetAbsoluteUrl(e):null}function dl(e){null!==e.wasmUASTCToASTC&&(KTX2DECODER.LiteTranscoder_UASTC_ASTC.WasmModuleURL=e.wasmUASTCToASTC),null!==e.wasmUASTCToBC7&&(KTX2DECODER.LiteTranscoder_UASTC_BC7.WasmModuleURL=e.wasmUASTCToBC7),null!==e.wasmUASTCToRGBA_UNORM&&(KTX2DECODER.LiteTranscoder_UASTC_RGBA_UNORM.WasmModuleURL=e.wasmUASTCToRGBA_UNORM),null!==e.wasmUASTCToRGBA_SRGB&&(KTX2DECODER.LiteTranscoder_UASTC_RGBA_SRGB.WasmModuleURL=e.wasmUASTCToRGBA_SRGB),null!==e.wasmUASTCToR8_UNORM&&(KTX2DECODER.LiteTranscoder_UASTC_R8_UNORM.WasmModuleURL=e.wasmUASTCToR8_UNORM),null!==e.wasmUASTCToRG8_UNORM&&(KTX2DECODER.LiteTranscoder_UASTC_RG8_UNORM.WasmModuleURL=e.wasmUASTCToRG8_UNORM),null!==e.jsMSCTranscoder&&(KTX2DECODER.MSCTranscoder.JSModuleURL=e.jsMSCTranscoder),null!==e.wasmMSCTranscoder&&(KTX2DECODER.MSCTranscoder.WasmModuleURL=e.wasmMSCTranscoder),null!==e.wasmZSTDDecoder&&(KTX2DECODER.ZSTDDecoder.WasmModuleURL=e.wasmZSTDDecoder)}!function(e){e[e.ETC1S=0]="ETC1S",e[e.UASTC4x4=1]="UASTC4x4"}(al||(al={})),function(e){e[e.ASTC_4X4_RGBA=0]="ASTC_4X4_RGBA",e[e.BC7_RGBA=1]="BC7_RGBA",e[e.BC3_RGBA=2]="BC3_RGBA",e[e.BC1_RGB=3]="BC1_RGB",e[e.PVRTC1_4_RGBA=4]="PVRTC1_4_RGBA",e[e.PVRTC1_4_RGB=5]="PVRTC1_4_RGB",e[e.ETC2_RGBA=6]="ETC2_RGBA",e[e.ETC1_RGB=7]="ETC1_RGB",e[e.RGBA32=8]="RGBA32",e[e.R8=9]="R8",e[e.RG8=10]="RG8"}(ll||(ll={})),function(e){e[e.COMPRESSED_RGBA_BPTC_UNORM_EXT=36492]="COMPRESSED_RGBA_BPTC_UNORM_EXT",e[e.COMPRESSED_RGBA_ASTC_4X4_KHR=37808]="COMPRESSED_RGBA_ASTC_4X4_KHR",e[e.COMPRESSED_RGB_S3TC_DXT1_EXT=33776]="COMPRESSED_RGB_S3TC_DXT1_EXT",e[e.COMPRESSED_RGBA_S3TC_DXT5_EXT=33779]="COMPRESSED_RGBA_S3TC_DXT5_EXT",e[e.COMPRESSED_RGBA_PVRTC_4BPPV1_IMG=35842]="COMPRESSED_RGBA_PVRTC_4BPPV1_IMG",e[e.COMPRESSED_RGB_PVRTC_4BPPV1_IMG=35840]="COMPRESSED_RGB_PVRTC_4BPPV1_IMG",e[e.COMPRESSED_RGBA8_ETC2_EAC=37496]="COMPRESSED_RGBA8_ETC2_EAC",e[e.COMPRESSED_RGB8_ETC2=37492]="COMPRESSED_RGB8_ETC2",e[e.COMPRESSED_RGB_ETC1_WEBGL=36196]="COMPRESSED_RGB_ETC1_WEBGL",e[e.RGBA8Format=32856]="RGBA8Format",e[e.R8Format=33321]="R8Format",e[e.RG8Format=33323]="RG8Format"}(hl||(hl={}));class pl{constructor(){this._isDirty=!0,this._useRGBAIfOnlyBC1BC3AvailableWhenUASTC=!0,this._ktx2DecoderOptions={}}get isDirty(){return this._isDirty}get useRGBAIfASTCBC7NotAvailableWhenUASTC(){return this._useRGBAIfASTCBC7NotAvailableWhenUASTC}set useRGBAIfASTCBC7NotAvailableWhenUASTC(e){this._useRGBAIfASTCBC7NotAvailableWhenUASTC!==e&&(this._useRGBAIfASTCBC7NotAvailableWhenUASTC=e,this._isDirty=!0)}get useRGBAIfOnlyBC1BC3AvailableWhenUASTC(){return this._useRGBAIfOnlyBC1BC3AvailableWhenUASTC}set useRGBAIfOnlyBC1BC3AvailableWhenUASTC(e){this._useRGBAIfOnlyBC1BC3AvailableWhenUASTC!==e&&(this._useRGBAIfOnlyBC1BC3AvailableWhenUASTC=e,this._isDirty=!0)}get forceRGBA(){return this._forceRGBA}set forceRGBA(e){this._forceRGBA!==e&&(this._forceRGBA=e,this._isDirty=!0)}get forceR8(){return this._forceR8}set forceR8(e){this._forceR8!==e&&(this._forceR8=e,this._isDirty=!0)}get forceRG8(){return this._forceRG8}set forceRG8(e){this._forceRG8!==e&&(this._forceRG8=e,this._isDirty=!0)}get bypassTranscoders(){return this._bypassTranscoders}set bypassTranscoders(e){this._bypassTranscoders!==e&&(this._bypassTranscoders=e,this._isDirty=!0)}_getKTX2DecoderOptions(){if(!this._isDirty)return this._ktx2DecoderOptions;this._isDirty=!1;const e={useRGBAIfASTCBC7NotAvailableWhenUASTC:this._useRGBAIfASTCBC7NotAvailableWhenUASTC,forceRGBA:this._forceRGBA,forceR8:this._forceR8,forceRG8:this._forceRG8,bypassTranscoders:this._bypassTranscoders};return this.useRGBAIfOnlyBC1BC3AvailableWhenUASTC&&(e.transcodeFormatDecisionTree={UASTC:{transcodeFormat:[ll.BC1_RGB,ll.BC3_RGBA],yes:{transcodeFormat:ll.RGBA32,engineFormat:hl.RGBA8Format,roundToMultiple4:!1}}}),this._ktx2DecoderOptions=e,e}}class fl{static GetDefaultNumWorkers(){return"object"==typeof navigator&&navigator.hardwareConcurrency?Math.min(Math.floor(.5*navigator.hardwareConcurrency),4):1}static _Initialize(e){if(fl._WorkerPoolPromise||fl._DecoderModulePromise)return;const t={jsDecoderModule:de.w1.GetAbsoluteUrl(this.URLConfig.jsDecoderModule),wasmUASTCToASTC:ul(this.URLConfig.wasmUASTCToASTC),wasmUASTCToBC7:ul(this.URLConfig.wasmUASTCToBC7),wasmUASTCToRGBA_UNORM:ul(this.URLConfig.wasmUASTCToRGBA_UNORM),wasmUASTCToRGBA_SRGB:ul(this.URLConfig.wasmUASTCToRGBA_SRGB),wasmUASTCToR8_UNORM:ul(this.URLConfig.wasmUASTCToR8_UNORM),wasmUASTCToRG8_UNORM:ul(this.URLConfig.wasmUASTCToRG8_UNORM),jsMSCTranscoder:ul(this.URLConfig.jsMSCTranscoder),wasmMSCTranscoder:ul(this.URLConfig.wasmMSCTranscoder),wasmZSTDDecoder:ul(this.URLConfig.wasmZSTDDecoder)};e&&"function"==typeof Worker&&"undefined"!=typeof URL?fl._WorkerPoolPromise=new Promise((i=>{const n=`${dl}(${_l})()`,s=URL.createObjectURL(new Blob([n],{type:"application/javascript"}));i(new cl.v(e,(()=>new Promise(((e,i)=>{const n=new Worker(s),r=e=>{n.removeEventListener("error",r),n.removeEventListener("message",o),i(e)},o=t=>{"init"===t.data.action&&(n.removeEventListener("error",r),n.removeEventListener("message",o),e(n))};n.addEventListener("error",r),n.addEventListener("message",o),n.postMessage({action:"init",urls:t})})))))})):"undefined"==typeof KTX2DECODER?fl._DecoderModulePromise=de.w1.LoadScriptAsync(t.jsDecoderModule).then((()=>(KTX2DECODER.MSCTranscoder.UseFromWorkerThread=!1,KTX2DECODER.WASMMemoryManager.LoadBinariesFromCurrentThread=!0,dl(t),new KTX2DECODER.KTX2Decoder))):(KTX2DECODER.MSCTranscoder.UseFromWorkerThread=!1,KTX2DECODER.WASMMemoryManager.LoadBinariesFromCurrentThread=!0,fl._DecoderModulePromise=Promise.resolve(new KTX2DECODER.KTX2Decoder))}constructor(e,t=fl.DefaultNumWorkers){this._engine=e,fl._Initialize(t)}uploadAsync(e,t,i){const n=this._engine.getCaps(),s={astc:!!n.astc,bptc:!!n.bptc,s3tc:!!n.s3tc,pvrtc:!!n.pvrtc,etc2:!!n.etc2,etc1:!!n.etc1};if(fl._WorkerPoolPromise)return fl._WorkerPoolPromise.then((n=>new Promise(((r,o)=>{n.push(((n,a)=>{const l=e=>{n.removeEventListener("error",l),n.removeEventListener("message",h),o(e),a()},h=e=>{if("decoded"===e.data.action){if(n.removeEventListener("error",l),n.removeEventListener("message",h),e.data.success)try{this._createTexture(e.data.decodedData,t,i),r()}catch(e){o({message:e})}else o({message:e.data.msg});a()}};n.addEventListener("error",l),n.addEventListener("message",h),n.postMessage({action:"setDefaultDecoderOptions",options:fl.DefaultDecoderOptions._getKTX2DecoderOptions()});const c=new Uint8Array(e.byteLength);c.set(new Uint8Array(e.buffer,e.byteOffset,e.byteLength)),n.postMessage({action:"decode",data:c,caps:s,options:i},[c.buffer])}))}))));if(fl._DecoderModulePromise)return fl._DecoderModulePromise.then((i=>(fl.DefaultDecoderOptions.isDirty&&(KTX2DECODER.KTX2Decoder.DefaultDecoderOptions=fl.DefaultDecoderOptions._getKTX2DecoderOptions()),new Promise(((s,r)=>{i.decode(e,n).then((e=>{this._createTexture(e,t),s()})).catch((e=>{r({message:e})}))})))));throw new Error("KTX2 decoder module is not available")}_createTexture(e,t,i){this._engine._bindTextureDirectly(3553,t),i&&(i.transcodedFormat=e.transcodedFormat,i.isInGammaSpace=e.isInGammaSpace,i.hasAlpha=e.hasAlpha,i.transcoderName=e.transcoderName);let n=!0;switch(e.transcodedFormat){case 32856:t.type=0,t.format=5;break;case 33321:t.type=0,t.format=6;break;case 33323:t.type=0,t.format=7;break;default:t.format=e.transcodedFormat,n=!1}if(t._gammaSpace=e.isInGammaSpace,t.generateMipMaps=e.mipmaps.length>1,e.errors)throw new Error("KTX2 container - could not transcode the data. "+e.errors);for(let i=0;i<e.mipmaps.length;++i){const s=e.mipmaps[i];if(!s||!s.data)throw new Error("KTX2 container - could not transcode one of the image");n?(t.width=s.width,t.height=s.height,this._engine._uploadDataToTextureDirectly(t,s.data,0,i,void 0,!0)):this._engine._uploadCompressedDataToTextureDirectly(t,e.transcodedFormat,s.width,s.height,s.data,0,i)}t._extension=".ktx2",t.width=e.mipmaps[0].width,t.height=e.mipmaps[0].height,t.isReady=!0,this._engine._bindTextureDirectly(3553,null)}static IsValid(e){if(e.byteLength>=12){const t=new Uint8Array(e.buffer,e.byteOffset,12);if(171===t[0]&&75===t[1]&&84===t[2]&&88===t[3]&&32===t[4]&&50===t[5]&&48===t[6]&&187===t[7]&&13===t[8]&&10===t[9]&&26===t[10]&&10===t[11])return!0}return!1}}function _l(){let e;onmessage=t=>{if(t.data)switch(t.data.action){case"init":{const i=t.data.urls;importScripts(i.jsDecoderModule),dl(i),e=new KTX2DECODER.KTX2Decoder,postMessage({action:"init"});break}case"setDefaultDecoderOptions":KTX2DECODER.KTX2Decoder.DefaultDecoderOptions=t.data.options;break;case"decode":e.decode(t.data.data,t.data.caps,t.data.options).then((e=>{const t=[];for(let i=0;i<e.mipmaps.length;++i){const n=e.mipmaps[i];n&&n.data&&t.push(n.data.buffer)}postMessage({action:"decoded",success:!0,decodedData:e},t)})).catch((e=>{postMessage({action:"decoded",success:!1,msg:e})}))}}}fl.URLConfig={jsDecoderModule:"https://preview.babylonjs.com/babylon.ktx2Decoder.js",wasmUASTCToASTC:null,wasmUASTCToBC7:null,wasmUASTCToRGBA_UNORM:null,wasmUASTCToRGBA_SRGB:null,wasmUASTCToR8_UNORM:null,wasmUASTCToRG8_UNORM:null,jsMSCTranscoder:null,wasmMSCTranscoder:null,wasmZSTDDecoder:null},fl.DefaultNumWorkers=fl.GetDefaultNumWorkers(),fl.DefaultDecoderOptions=new pl;class ml{constructor(){this.supportCascades=!1}canLoad(e,t){return e.endsWith(".ktx")||e.endsWith(".ktx2")||"image/ktx"===t||"image/ktx2"===t}loadCubeData(e,t,i,n){if(Array.isArray(e))return;t._invertVScale=!t.invertY;const s=t.getEngine(),r=new ol(e,6),o=r.numberOfMipmapLevels>1&&t.generateMipMaps;s._unpackFlipY(!0),r.uploadLevels(t,t.generateMipMaps),t.width=r.pixelWidth,t.height=r.pixelHeight,s._setCubeMapTextureParams(t,o,r.numberOfMipmapLevels-1),t.isReady=!0,t.onLoadedObservable.notifyObservers(t),t.onLoadedObservable.clear(),n&&n()}loadData(e,t,i,n){if(ol.IsValid(e)){t._invertVScale=!t.invertY;const n=new ol(e,1),s=function(e){switch(e){case 35916:return 33776;case 35918:return 33778;case 35919:return 33779;case 37493:return 37492;case 37497:return 37496;case 37495:return 37494;case 37840:return 37808;case 36493:return 36492}return null}(n.glInternalFormat);s?(t.format=s,t._useSRGBBuffer=t.getEngine()._getUseSRGBBuffer(!0,t.generateMipMaps),t._gammaSpace=!0):t.format=n.glInternalFormat,i(n.pixelWidth,n.pixelHeight,t.generateMipMaps,!0,(()=>{n.uploadLevels(t,t.generateMipMaps)}),n.isInvalid)}else fl.IsValid(e)?new fl(t.getEngine()).uploadAsync(e,t,n).then((()=>{i(t.width,t.height,t.generateMipMaps,!0,(()=>{}),!1)}),(e=>{_.Y.Warn(`Failed to load KTX2 texture data: ${e.message}`),i(0,0,!1,!1,(()=>{}),!0)})):(_.Y.Error("texture missing KTX identifier"),i(0,0,!1,!1,(()=>{}),!0))}}ue.D._TextureLoaders.unshift(new ml);class gl extends Dt.c{constructor(e,t,i){super(e,o.P.Zero(),t),this._xrSessionManager=i,this._firstFrame=!1,this._referenceQuaternion=o._f.Identity(),this._referencedPosition=new o.P,this._trackingState=ji.NOT_TRACKING,this.onBeforeCameraTeleport=new r.y$,this.onAfterCameraTeleport=new r.y$,this.onTrackingStateChanged=new r.y$,this.compensateOnFirstFrame=!0,this._rotate180=new o._f(0,1,0,0),this.minZ=.1,this.rotationQuaternion=new o._f,this.cameraRigMode=Mt.V.RIG_MODE_CUSTOM,this.updateUpVectorFromRotation=!0,this._updateNumberOfRigCameras(1),this.freezeProjectionMatrix(),this._xrSessionManager.onXRSessionInit.add((()=>{this._referencedPosition.copyFromFloats(0,0,0),this._referenceQuaternion.copyFromFloats(0,0,0,1),this._firstFrame=this.compensateOnFirstFrame})),this._xrSessionManager.onXRFrameObservable.add((()=>{this._firstFrame&&this._updateFromXRSession(),this._updateReferenceSpace(),this._updateFromXRSession()}),void 0,!0)}get trackingState(){return this._trackingState}_setTrackingState(e){this._trackingState!==e&&(this._trackingState=e,this.onTrackingStateChanged.notifyObservers(e))}get realWorldHeight(){const e=this._xrSessionManager.currentFrame&&this._xrSessionManager.currentFrame.getViewerPose(this._xrSessionManager.baseReferenceSpace);return e&&e.transform?e.transform.position.y:0}_updateForDualEyeDebugging(){this._updateNumberOfRigCameras(2),this.rigCameras[0].viewport=new ui.l(0,0,.5,1),this.rigCameras[0].outputRenderTarget=null,this.rigCameras[1].viewport=new ui.l(.5,0,.5,1),this.rigCameras[1].outputRenderTarget=null}setTransformationFromNonVRCamera(e=this.getScene().activeCamera,t=!0){e&&e!==this&&(e.computeWorldMatrix().decompose(void 0,this.rotationQuaternion,this.position),this.position.y=0,o._f.FromEulerAnglesToRef(0,this.rotationQuaternion.toEulerAngles().y,0,this.rotationQuaternion),this._firstFrame=!0,t&&this._xrSessionManager.resetReferenceSpace())}getClassName(){return"WebXRCamera"}setTarget(e){const t=o.jp.Vector3[1];e.subtractToRef(this.position,t),t.y=0,t.normalize();const i=Math.atan2(t.x,t.z);this.rotationQuaternion.toEulerAnglesToRef(t),o._f.FromEulerAnglesToRef(t.x,i,t.z,this.rotationQuaternion)}dispose(){super.dispose(),this._lastXRViewerPose=void 0}_updateFromXRSession(){const e=this._xrSessionManager.currentFrame&&this._xrSessionManager.currentFrame.getViewerPose(this._xrSessionManager.referenceSpace);if(this._lastXRViewerPose=e||void 0,!e)return void this._setTrackingState(ji.NOT_TRACKING);const t=e.emulatedPosition?ji.TRACKING_LOST:ji.TRACKING;if(this._setTrackingState(t),this.minZ!==this._cache.minZ||this.maxZ!==this._cache.maxZ){const e={depthFar:this.maxZ||1e4,depthNear:this.minZ};this._xrSessionManager.updateRenderState(e),this._cache.minZ=this.minZ,this._cache.maxZ=this.maxZ}if(e.transform){const t=e.transform.orientation;if(void 0===e.transform.orientation.x)return;const i=e.transform.position;this._referencedPosition.set(i.x,i.y,i.z),this._referenceQuaternion.set(t.x,t.y,t.z,t.w),this._scene.useRightHandedSystem||(this._referencedPosition.z*=-1,this._referenceQuaternion.z*=-1,this._referenceQuaternion.w*=-1),this._firstFrame?(this._firstFrame=!1,this.position.y+=this._referencedPosition.y,this._referenceQuaternion.copyFromFloats(0,0,0,1)):(this.rotationQuaternion.copyFrom(this._referenceQuaternion),this.position.copyFrom(this._referencedPosition))}this.rigCameras.length!==e.views.length&&this._updateNumberOfRigCameras(e.views.length),e.views.forEach(((e,t)=>{var i;const n=this.rigCameras[t];n.isLeftCamera||n.isRightCamera||("right"===e.eye?n._isRightCamera=!0:"left"===e.eye&&(n._isLeftCamera=!0));const s=e.transform.position,r=e.transform.orientation;n.parent=this.parent,n.position.set(s.x,s.y,s.z),n.rotationQuaternion.set(r.x,r.y,r.z,r.w),this._scene.useRightHandedSystem?n.rotationQuaternion.multiplyInPlace(this._rotate180):(n.position.z*=-1,n.rotationQuaternion.z*=-1,n.rotationQuaternion.w*=-1),o.y3.FromFloat32ArrayToRefScaled(e.projectionMatrix,0,1,n._projectionMatrix),this._scene.useRightHandedSystem||n._projectionMatrix.toggleProjectionMatrixHandInPlace(),0===t&&this._projectionMatrix.copyFrom(n._projectionMatrix);const a=this._xrSessionManager.getRenderTargetTextureForView(e);this._renderingMultiview=(null===(i=null==a?void 0:a._texture)||void 0===i?void 0:i.isMultiview)||!1,this._renderingMultiview?0==t&&(this._xrSessionManager.trySetViewportForView(this.viewport,e),this.outputRenderTarget=a):(this._xrSessionManager.trySetViewportForView(n.viewport,e),n.outputRenderTarget=a||this._xrSessionManager.getRenderTargetTextureForView(e)),n.layerMask=this.layerMask}))}_updateNumberOfRigCameras(e=1){for(;this.rigCameras.length<e;){const e=new It.C("XR-RigCamera: "+this.rigCameras.length,o.P.Zero(),this.getScene());e.minZ=.1,e.rotationQuaternion=new o._f,e.updateUpVectorFromRotation=!0,e.isRigCamera=!0,e.rigParent=this,e.freezeProjectionMatrix(),this.rigCameras.push(e)}for(;this.rigCameras.length>e;){const e=this.rigCameras.pop();e&&e.dispose()}}_updateReferenceSpace(){if(!this.position.equals(this._referencedPosition)||!this.rotationQuaternion.equals(this._referenceQuaternion)){const e=o.jp.Matrix[0],t=o.jp.Matrix[1],i=o.jp.Matrix[2];o.y3.ComposeToRef(gl._ScaleReadOnly,this._referenceQuaternion,this._referencedPosition,e),o.y3.ComposeToRef(gl._ScaleReadOnly,this.rotationQuaternion,this.position,t),e.invert().multiplyToRef(t,i),i.invert(),this._scene.useRightHandedSystem||i.toggleModelMatrixHandInPlace(),i.decompose(void 0,this._referenceQuaternion,this._referencedPosition);const n=new XRRigidTransform({x:this._referencedPosition.x,y:this._referencedPosition.y,z:this._referencedPosition.z},{x:this._referenceQuaternion.x,y:this._referenceQuaternion.y,z:this._referenceQuaternion.z,w:this._referenceQuaternion.w});this._xrSessionManager.referenceSpace=this._xrSessionManager.referenceSpace.getOffsetReferenceSpace(n)}}}gl._ScaleReadOnly=o.P.One();var vl=i(4370);class yl{constructor(e){this._scene=e,this._nonVRCamera=null,this._attachedToElement=!1,this._spectatorCamera=null,this._originalSceneAutoClear=!0,this._supported=!1,this._spectatorMode=!1,this._lastTimestamp=0,this.onInitialXRPoseSetObservable=new r.y$,this.onStateChangedObservable=new r.y$,this.state=Xi.NOT_IN_XR,this.sessionManager=new nn(e),this.camera=new gl("webxr",e,this.sessionManager),this.featuresManager=new vl.d(this.sessionManager),e.onDisposeObservable.addOnce((()=>{this.dispose()}))}static CreateAsync(e){const t=new yl(e);return t.sessionManager.initializeAsync().then((()=>(t._supported=!0,t))).catch((e=>{throw t._setState(Xi.NOT_IN_XR),t.dispose(),e}))}dispose(){var e;this.exitXRAsync(),this.camera.dispose(),this.onStateChangedObservable.clear(),this.onInitialXRPoseSetObservable.clear(),this.sessionManager.dispose(),null===(e=this._spectatorCamera)||void 0===e||e.dispose(),this._nonVRCamera&&(this._scene.activeCamera=this._nonVRCamera)}async enterXRAsync(e,t,i=this.sessionManager.getWebXRRenderTarget(),n={}){var s,r,o;if(!this._supported)throw"WebXR not supported in this browser or environment";this._setState(Xi.ENTERING_XR),"viewer"!==t&&"local"!==t&&(n.optionalFeatures=n.optionalFeatures||[],n.optionalFeatures.push(t)),n=await this.featuresManager._extendXRSessionInitObject(n),"immersive-ar"===e&&"unbounded"!==t&&_.Y.Warn("We recommend using 'unbounded' reference space type when using 'immersive-ar' session mode");try{await this.sessionManager.initializeSessionAsync(e,n),await this.sessionManager.setReferenceSpaceTypeAsync(t);const a=await i.initializeXRLayerAsync(this.sessionManager.session),l={depthFar:this.camera.maxZ||1e4,depthNear:this.camera.minZ};return this.featuresManager.getEnabledFeature(vl.b.LAYERS)||(l.baseLayer=a),this.sessionManager.updateRenderState(l),this.sessionManager.runXRRenderLoop(),this._originalSceneAutoClear=this._scene.autoClear,this._nonVRCamera=this._scene.activeCamera,this._attachedToElement=!!(null===(r=null===(s=this._nonVRCamera)||void 0===s?void 0:s.inputs)||void 0===r?void 0:r.attachedToElement),null===(o=this._nonVRCamera)||void 0===o||o.detachControl(),this._scene.activeCamera=this.camera,"immersive-ar"!==e?this._nonXRToXRCamera():(this._scene.autoClear=!1,this.camera.compensateOnFirstFrame=!1,this.camera.position.set(0,0,0),this.camera.rotationQuaternion.set(0,0,0,1)),this.sessionManager.onXRSessionEnded.addOnce((()=>{this.state!==Xi.EXITING_XR&&this._setState(Xi.EXITING_XR),this.camera.rigCameras.forEach((e=>{e.outputRenderTarget=null})),this._scene.autoClear=this._originalSceneAutoClear,this._scene.activeCamera=this._nonVRCamera,this._attachedToElement&&this._nonVRCamera&&this._nonVRCamera.attachControl(!!this._nonVRCamera.inputs.noPreventDefault),"immersive-ar"!==e&&this.camera.compensateOnFirstFrame&&(this._nonVRCamera.setPosition?this._nonVRCamera.setPosition(this.camera.position):this._nonVRCamera.position.copyFrom(this.camera.position)),this._setState(Xi.NOT_IN_XR)})),this.sessionManager.onXRFrameObservable.addOnce((()=>{this._setState(Xi.IN_XR)})),this.sessionManager}catch(e){throw console.log(e),console.log(e.message),this._setState(Xi.NOT_IN_XR),e}}exitXRAsync(){return this.state!==Xi.IN_XR?Promise.resolve():(this._setState(Xi.EXITING_XR),this.sessionManager.exitXRAsync())}enableSpectatorMode(e){this._spectatorMode||(this._spectatorMode=!0,this._switchSpectatorMode(e))}disableSpecatatorMode(){this._spectatorMode&&(this._spectatorMode=!1,this._switchSpectatorMode())}_switchSpectatorMode(e){const t=1/((null==e?void 0:e.fps)?e.fps:1e3)*1e3,i=(null==e?void 0:e.preferredCameraIndex)?null==e?void 0:e.preferredCameraIndex:0,n=()=>{this._spectatorCamera&&this.sessionManager.currentTimestamp-this._lastTimestamp>=t&&(this._lastTimestamp=this.sessionManager.currentTimestamp,this._spectatorCamera.position.copyFrom(this.camera.rigCameras[i].globalPosition),this._spectatorCamera.rotationQuaternion.copyFrom(this.camera.rigCameras[i].absoluteRotation))};if(this._spectatorMode){if(i>=this.camera.rigCameras.length)throw new Error("the preferred camera index is beyond the length of rig camera array.");const e=()=>{this.state===Xi.IN_XR?(this._spectatorCamera=new ei("webxr-spectator",o.P.Zero(),this._scene),this._spectatorCamera.rotationQuaternion=new o._f,this._scene.activeCameras=[this.camera,this._spectatorCamera],this.sessionManager.onXRFrameObservable.add(n),this._scene.onAfterRenderCameraObservable.add((e=>{e===this.camera&&(this._scene.getEngine().framebufferDimensionsObject=null)}))):this.state===Xi.EXITING_XR&&(this.sessionManager.onXRFrameObservable.removeCallback(n),this._scene.activeCameras=null)};this.onStateChangedObservable.add(e),e()}else this.sessionManager.onXRFrameObservable.removeCallback(n),this._scene.activeCameras=[this.camera]}_nonXRToXRCamera(){this.camera.setTransformationFromNonVRCamera(this._nonVRCamera),this.onInitialXRPoseSetObservable.notifyObservers(this.camera)}_setState(e){this.state!==e&&(this.state=e,this.onStateChangedObservable.notifyObservers(this.state))}}class xl{constructor(e,t,i=-1,n=[]){this.id=e,this.type=t,this._buttonIndex=i,this._axesIndices=n,this._axes={x:0,y:0},this._changes={},this._currentValue=0,this._hasChanges=!1,this._pressed=!1,this._touched=!1,this.onAxisValueChangedObservable=new r.y$,this.onButtonStateChangedObservable=new r.y$}get axes(){return this._axes}get changes(){return this._changes}get hasChanges(){return this._hasChanges}get pressed(){return this._pressed}get touched(){return this._touched}get value(){return this._currentValue}dispose(){this.onAxisValueChangedObservable.clear(),this.onButtonStateChangedObservable.clear()}isAxes(){return 0!==this._axesIndices.length}isButton(){return-1!==this._buttonIndex}update(e){let t=!1,i=!1;if(this._hasChanges=!1,this._changes={},this.isButton()){const i=e.buttons[this._buttonIndex];if(!i)return;this._currentValue!==i.value&&(this.changes.value={current:i.value,previous:this._currentValue},t=!0,this._currentValue=i.value),this._touched!==i.touched&&(this.changes.touched={current:i.touched,previous:this._touched},t=!0,this._touched=i.touched),this._pressed!==i.pressed&&(this.changes.pressed={current:i.pressed,previous:this._pressed},t=!0,this._pressed=i.pressed)}this.isAxes()&&(this._axes.x!==e.axes[this._axesIndices[0]]&&(this.changes.axes={current:{x:e.axes[this._axesIndices[0]],y:this._axes.y},previous:{x:this._axes.x,y:this._axes.y}},this._axes.x=e.axes[this._axesIndices[0]],i=!0),this._axes.y!==e.axes[this._axesIndices[1]]&&(this.changes.axes?this.changes.axes.current.y=e.axes[this._axesIndices[1]]:this.changes.axes={current:{x:this._axes.x,y:e.axes[this._axesIndices[1]]},previous:{x:this._axes.x,y:this._axes.y}},this._axes.y=e.axes[this._axesIndices[1]],i=!0)),t&&(this._hasChanges=!0,this.onButtonStateChangedObservable.notifyObservers(this)),i&&(this._hasChanges=!0,this.onAxisValueChangedObservable.notifyObservers(this._axes))}}xl.BUTTON_TYPE="button",xl.SQUEEZE_TYPE="squeeze",xl.THUMBSTICK_TYPE="thumbstick",xl.TOUCHPAD_TYPE="touchpad",xl.TRIGGER_TYPE="trigger";class bl{constructor(e,t,i,n,s=!1,o){this.scene=e,this.layout=t,this.gamepadObject=i,this.handedness=n,this._doNotLoadControllerMesh=s,this._controllerCache=o,this._initComponent=e=>{if(!e)return;const t=this.layout.components[e],i=t.type,n=t.gamepadIndices.button,s=[];void 0!==t.gamepadIndices.xAxis&&void 0!==t.gamepadIndices.yAxis&&s.push(t.gamepadIndices.xAxis,t.gamepadIndices.yAxis),this.components[e]=new xl(e,i,n,s)},this._modelReady=!1,this.components={},this.disableAnimation=!1,this.onModelLoadedObservable=new r.y$,t.components&&Object.keys(t.components).forEach(this._initComponent)}dispose(){this.getComponentIds().forEach((e=>this.getComponent(e).dispose())),this.rootMesh&&(this.rootMesh.getChildren(void 0,!0).forEach((e=>{e.setEnabled(!1)})),this.rootMesh.dispose(!!this._controllerCache,!this._controllerCache))}getAllComponentsOfType(e){return this.getComponentIds().map((e=>this.components[e])).filter((t=>t.type===e))}getComponent(e){return this.components[e]}getComponentIds(){return Object.keys(this.components)}getComponentOfType(e){return this.getAllComponentsOfType(e)[0]||null}getMainComponent(){return this.getComponent(this.layout.selectComponentId)}async loadModel(){const e=!this._getModelLoadingConstraints();let t=this._getGenericFilenameAndPath();return e?_.Y.Warn("Falling back to generic models"):t=this._getFilenameAndPath(),new Promise(((i,n)=>{const s=t=>{e?this._getGenericParentMesh(t):this._setRootMesh(t),this._processLoadedModel(t),this._modelReady=!0,this.onModelLoadedObservable.notifyObservers(this),i(!0)};if(this._controllerCache){const e=this._controllerCache.filter((e=>e.filename===t.filename&&e.path===t.path));if(e[0])return e[0].meshes.forEach((e=>e.setEnabled(!0))),void s(e[0].meshes)}ta.n.ImportMesh("",t.path,t.filename,this.scene,(e=>{this._controllerCache&&this._controllerCache.push({...t,meshes:e}),s(e)}),null,((e,i)=>{_.Y.Log(i),_.Y.Warn(`Failed to retrieve controller model of type ${this.profileId} from the remote server: ${t.path}${t.filename}`),n(i)}))}))}updateFromXRFrame(e){this.getComponentIds().forEach((e=>this.getComponent(e).update(this.gamepadObject))),this.updateModel(e)}get handness(){return this.handedness}pulse(e,t,i=0){return this.gamepadObject.hapticActuators&&this.gamepadObject.hapticActuators[i]?this.gamepadObject.hapticActuators[i].pulse(e,t):Promise.resolve(!1)}_getChildByName(e,t){return e.getChildren((e=>e.name===t),!1)[0]}_getImmediateChildByName(e,t){return e.getChildren((e=>e.name==t),!0)[0]}_lerpTransform(e,t,i){if(!e.minMesh||!e.maxMesh||!e.valueMesh)return;if(!e.minMesh.rotationQuaternion||!e.maxMesh.rotationQuaternion||!e.valueMesh.rotationQuaternion)return;const n=i?.5*t+.5:t;o._f.SlerpToRef(e.minMesh.rotationQuaternion,e.maxMesh.rotationQuaternion,n,e.valueMesh.rotationQuaternion),o.P.LerpToRef(e.minMesh.position,e.maxMesh.position,n,e.valueMesh.position)}updateModel(e){this._modelReady&&this._updateModel(e)}_getGenericFilenameAndPath(){return{filename:"generic.babylon",path:"https://controllers.babylonjs.com/generic/"}}_getGenericParentMesh(e){this.rootMesh=new Nt.Kj(this.profileId+" "+this.handedness,this.scene),e.forEach((e=>{e.parent||(e.isPickable=!1,e.setParent(this.rootMesh))})),this.rootMesh.rotationQuaternion=o._f.FromEulerAngles(0,Math.PI,0)}}class Tl extends bl{constructor(e,t,i){super(e,Sl[i],t,i),this.profileId=Tl.ProfileId}_getFilenameAndPath(){return{filename:"generic.babylon",path:"https://controllers.babylonjs.com/generic/"}}_getModelLoadingConstraints(){return!0}_processLoadedModel(e){}_setRootMesh(e){this.rootMesh=new Nt.Kj(this.profileId+" "+this.handedness,this.scene),e.forEach((e=>{e.isPickable=!1,e.parent||e.setParent(this.rootMesh)})),this.rootMesh.rotationQuaternion=o._f.FromEulerAngles(0,Math.PI,0)}_updateModel(){}}Tl.ProfileId="generic-trigger";const Sl={left:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr_standard_trigger",visualResponses:{}}},gamepadMapping:"xr-standard",rootNodeName:"generic-trigger-left",assetPath:"left.glb"},right:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr_standard_trigger",visualResponses:{}}},gamepadMapping:"xr-standard",rootNodeName:"generic-trigger-right",assetPath:"right.glb"},none:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr_standard_trigger",visualResponses:{}}},gamepadMapping:"xr-standard",rootNodeName:"generic-trigger-none",assetPath:"none.glb"}};class El extends bl{constructor(e,t,i,n,s){super(e,i.layouts[t.handedness||"none"],t.gamepad,t.handedness,void 0,s),this._repositoryUrl=n,this.controllerCache=s,this._buttonMeshMapping={},this._touchDots={},this.profileId=i.profileId}dispose(){super.dispose(),this.controllerCache||Object.keys(this._touchDots).forEach((e=>{this._touchDots[e].dispose()}))}_getFilenameAndPath(){return{filename:this.layout.assetPath,path:`${this._repositoryUrl}/profiles/${this.profileId}/`}}_getModelLoadingConstraints(){const e=ta.n.IsPluginForExtensionAvailable(".glb");return e||_.Y.Warn("glTF / glb loader was not registered, using generic controller instead"),e}_processLoadedModel(e){this.getComponentIds().forEach((e=>{const t=this.layout.components[e];this._buttonMeshMapping[e]={mainMesh:this._getChildByName(this.rootMesh,t.rootNodeName),states:{}},Object.keys(t.visualResponses).forEach((i=>{const n=t.visualResponses[i];if("transform"===n.valueNodeProperty)this._buttonMeshMapping[e].states[i]={valueMesh:this._getChildByName(this.rootMesh,n.valueNodeName),minMesh:this._getChildByName(this.rootMesh,n.minNodeName),maxMesh:this._getChildByName(this.rootMesh,n.maxNodeName)};else{const s=t.type===xl.TOUCHPAD_TYPE&&t.touchPointNodeName?t.touchPointNodeName:n.valueNodeName;if(this._buttonMeshMapping[e].states[i]={valueMesh:this._getChildByName(this.rootMesh,s)},t.type===xl.TOUCHPAD_TYPE&&!this._touchDots[i]){const t=Kn(i+"dot",{diameter:.0015,segments:8},this.scene);t.material=new Gi.K(i+"mat",this.scene),t.material.diffuseColor=a.Wo.Red(),t.parent=this._buttonMeshMapping[e].states[i].valueMesh||null,t.isVisible=!1,this._touchDots[i]=t}}}))}))}_setRootMesh(e){let t;this.rootMesh=new Nt.Kj(this.profileId+"-"+this.handedness,this.scene),this.rootMesh.isPickable=!1;for(let i=0;i<e.length;i++){const n=e[i];n.isPickable=!1,n.parent||(t=n)}t&&t.setParent(this.rootMesh),this.scene.useRightHandedSystem||this.rootMesh.rotate(We.RD.Y,Math.PI,We.T.WORLD)}_updateModel(e){this.disableAnimation||this.getComponentIds().forEach((e=>{const t=this.getComponent(e);if(!t.hasChanges)return;const i=this._buttonMeshMapping[e],n=this.layout.components[e];Object.keys(n.visualResponses).forEach((e=>{const s=n.visualResponses[e];let r=t.value;if("xAxis"===s.componentProperty?r=t.axes.x:"yAxis"===s.componentProperty&&(r=t.axes.y),"transform"===s.valueNodeProperty)this._lerpTransform(i.states[e],r,"button"!==s.componentProperty);else{const n=i.states[e].valueMesh;n&&(n.isVisible=t.touched||t.pressed),this._touchDots[e]&&(this._touchDots[e].isVisible=t.touched||t.pressed)}}))}))}}const Cl=[];class Al{static ClearProfilesCache(){this._ProfilesList=null,this._ProfileLoadingPromises={}}static DefaultFallbacks(){this.RegisterFallbacksForProfileId("google-daydream",["generic-touchpad"]),this.RegisterFallbacksForProfileId("htc-vive-focus",["generic-trigger-touchpad"]),this.RegisterFallbacksForProfileId("htc-vive",["generic-trigger-squeeze-touchpad"]),this.RegisterFallbacksForProfileId("magicleap-one",["generic-trigger-squeeze-touchpad"]),this.RegisterFallbacksForProfileId("windows-mixed-reality",["generic-trigger-squeeze-touchpad-thumbstick"]),this.RegisterFallbacksForProfileId("microsoft-mixed-reality",["windows-mixed-reality","generic-trigger-squeeze-touchpad-thumbstick"]),this.RegisterFallbacksForProfileId("oculus-go",["generic-trigger-touchpad"]),this.RegisterFallbacksForProfileId("oculus-touch-v2",["oculus-touch","generic-trigger-squeeze-thumbstick"]),this.RegisterFallbacksForProfileId("oculus-touch",["generic-trigger-squeeze-thumbstick"]),this.RegisterFallbacksForProfileId("samsung-gearvr",["windows-mixed-reality","generic-trigger-squeeze-touchpad-thumbstick"]),this.RegisterFallbacksForProfileId("samsung-odyssey",["generic-touchpad"]),this.RegisterFallbacksForProfileId("valve-index",["generic-trigger-squeeze-touchpad-thumbstick"]),this.RegisterFallbacksForProfileId("generic-hand-select",["generic-trigger"])}static FindFallbackWithProfileId(e){const t=this._Fallbacks[e]||[];return t.unshift(e),t}static GetMotionControllerWithXRInput(e,t,i){const n=[];i&&n.push(i),n.push(...e.profiles||[]),n.length&&!n[0]&&n.pop(),e.gamepad&&e.gamepad.id&&e.gamepad.id===(e.gamepad.id.match(/oculus touch/gi)?e.gamepad.id:void 0)&&n.push("oculus-touch-v2");const s=n.indexOf("windows-mixed-reality");if(-1!==s&&n.splice(s,0,"microsoft-mixed-reality"),n.length||n.push("generic-trigger"),this.UseOnlineRepository){const i=this.PrioritizeOnlineRepository?this._LoadProfileFromRepository:this._LoadProfilesFromAvailableControllers,s=this.PrioritizeOnlineRepository?this._LoadProfilesFromAvailableControllers:this._LoadProfileFromRepository;return i.call(this,n,e,t).catch((()=>s.call(this,n,e,t)))}return this._LoadProfilesFromAvailableControllers(n,e,t)}static RegisterController(e,t){this._AvailableControllers[e]=t}static RegisterFallbacksForProfileId(e,t){this._Fallbacks[e]?this._Fallbacks[e].push(...t):this._Fallbacks[e]=t}static UpdateProfilesList(){return this._ProfilesList=de.w1.LoadFileAsync(this.BaseRepositoryUrl+"/profiles/profilesList.json",!1).then((e=>JSON.parse(e.toString()))),this._ProfilesList}static ClearControllerCache(){Cl.forEach((e=>{e.meshes.forEach((e=>{e.dispose(!1,!0)}))})),Cl.length=0}static _LoadProfileFromRepository(e,t,i){return Promise.resolve().then((()=>this._ProfilesList?this._ProfilesList:this.UpdateProfilesList())).then((t=>{for(let i=0;i<e.length;++i)if(e[i]&&t[e[i]])return e[i];throw new Error(`neither controller ${e[0]} nor all fallbacks were found in the repository,`)})).then((e=>(this._ProfileLoadingPromises[e]||(this._ProfileLoadingPromises[e]=de.w1.LoadFileAsync(`${this.BaseRepositoryUrl}/profiles/${e}/profile.json`,!1).then((e=>JSON.parse(e)))),this._ProfileLoadingPromises[e]))).then((e=>new El(i,t,e,this.BaseRepositoryUrl,this.DisableControllerCache?void 0:Cl)))}static _LoadProfilesFromAvailableControllers(e,t,i){for(let n=0;n<e.length;++n){if(!e[n])continue;const s=this.FindFallbackWithProfileId(e[n]);for(let e=0;e<s.length;++e){const n=this._AvailableControllers[s[e]];if(n)return Promise.resolve(n(t,i))}}throw new Error("no controller requested was found in the available controllers list")}}Al._AvailableControllers={},Al._Fallbacks={},Al._ProfileLoadingPromises={},Al.BaseRepositoryUrl="https://immersive-web.github.io/webxr-input-profiles/packages/viewer/dist",Al.PrioritizeOnlineRepository=!0,Al.UseOnlineRepository=!0,Al.DisableControllerCache=!0,Al.RegisterController(Tl.ProfileId,((e,t)=>new Tl(t,e.gamepad,e.handedness))),Al.DefaultFallbacks();let Pl=0;class Rl{constructor(e,t,i={}){this._scene=e,this.inputSource=t,this._options=i,this._tmpVector=new o.P,this._disposed=!1,this.onDisposeObservable=new r.y$,this.onMeshLoadedObservable=new r.y$,this.onMotionControllerInitObservable=new r.y$,this._uniqueId=`controller-${Pl++}-${t.targetRayMode}-${t.handedness}`,this.pointer=new Un.x(`${this._uniqueId}-pointer`,e),this.pointer.rotationQuaternion=new o._f,this.inputSource.gripSpace&&(this.grip=new Un.x(`${this._uniqueId}-grip`,this._scene),this.grip.rotationQuaternion=new o._f),this._tmpVector.set(0,0,this._scene.useRightHandedSystem?-1:1),this.inputSource.gamepad&&"tracked-pointer"===this.inputSource.targetRayMode&&Al.GetMotionControllerWithXRInput(t,e,this._options.forceControllerProfile).then((e=>{this.motionController=e,this.onMotionControllerInitObservable.notifyObservers(e),this._options.doNotLoadControllerMesh||this.motionController._doNotLoadControllerMesh||this.motionController.loadModel().then((e=>{var t;e&&this.motionController&&this.motionController.rootMesh&&(this._options.renderingGroupId&&(this.motionController.rootMesh.renderingGroupId=this._options.renderingGroupId,this.motionController.rootMesh.getChildMeshes(!1).forEach((e=>e.renderingGroupId=this._options.renderingGroupId))),this.onMeshLoadedObservable.notifyObservers(this.motionController.rootMesh),this.motionController.rootMesh.parent=this.grip||this.pointer,this.motionController.disableAnimation=!!this._options.disableMotionControllerAnimation),this._disposed&&(null===(t=this.motionController)||void 0===t||t.dispose())}))}),(()=>{de.w1.Warn("Could not find a matching motion controller for the registered input source")}))}get uniqueId(){return this._uniqueId}dispose(){this.grip&&this.grip.dispose(!0),this.motionController&&this.motionController.dispose(),this.pointer.dispose(!0),this.onMotionControllerInitObservable.clear(),this.onMeshLoadedObservable.clear(),this.onDisposeObservable.notifyObservers(this),this.onDisposeObservable.clear(),this._disposed=!0}getWorldPointerRayToRef(e,t=!1){const i=t&&this.grip?this.grip:this.pointer;o.P.TransformNormalToRef(this._tmpVector,i.getWorldMatrix(),e.direction),e.direction.normalize(),e.origin.copyFrom(i.absolutePosition),e.length=1e3}updateFromXRFrame(e,t,i){const n=e.getPose(this.inputSource.targetRaySpace,t);if(this._lastXRPose=n,n){const e=n.transform.position;this.pointer.position.set(e.x,e.y,e.z);const t=n.transform.orientation;this.pointer.rotationQuaternion.set(t.x,t.y,t.z,t.w),this._scene.useRightHandedSystem||(this.pointer.position.z*=-1,this.pointer.rotationQuaternion.z*=-1,this.pointer.rotationQuaternion.w*=-1),this.pointer.parent=i.parent}if(this.inputSource.gripSpace&&this.grip){const n=e.getPose(this.inputSource.gripSpace,t);if(n){const e=n.transform.position,t=n.transform.orientation;this.grip.position.set(e.x,e.y,e.z),this.grip.rotationQuaternion.set(t.x,t.y,t.z,t.w),this._scene.useRightHandedSystem||(this.grip.position.z*=-1,this.grip.rotationQuaternion.z*=-1,this.grip.rotationQuaternion.w*=-1)}this.grip.parent=i.parent}this.motionController&&this.motionController.updateFromXRFrame(e)}}class Ml{constructor(e,t,i={}){if(this.xrSessionManager=e,this.xrCamera=t,this._options=i,this.controllers=[],this.onControllerAddedObservable=new r.y$,this.onControllerRemovedObservable=new r.y$,this._onInputSourcesChange=e=>{this._addAndRemoveControllers(e.added,e.removed)},this._sessionEndedObserver=this.xrSessionManager.onXRSessionEnded.add((()=>{this._addAndRemoveControllers([],this.controllers.map((e=>e.inputSource)))})),this._sessionInitObserver=this.xrSessionManager.onXRSessionInit.add((e=>{e.addEventListener("inputsourceschange",this._onInputSourcesChange)})),this._frameObserver=this.xrSessionManager.onXRFrameObservable.add((e=>{this.controllers.forEach((t=>{t.updateFromXRFrame(e,this.xrSessionManager.referenceSpace,this.xrCamera)}))})),this._options.customControllersRepositoryURL&&(Al.BaseRepositoryUrl=this._options.customControllersRepositoryURL),Al.UseOnlineRepository=!this._options.disableOnlineControllerRepository,Al.UseOnlineRepository)try{Al.UpdateProfilesList().catch((()=>{Al.UseOnlineRepository=!1}))}catch(e){Al.UseOnlineRepository=!1}}_addAndRemoveControllers(e,t){const i=this.controllers.map((e=>e.inputSource));for(const t of e)if(-1===i.indexOf(t)){const e=new Rl(this.xrSessionManager.scene,t,{...this._options.controllerOptions||{},forceControllerProfile:this._options.forceInputProfile,doNotLoadControllerMesh:this._options.doNotLoadControllerMeshes,disableMotionControllerAnimation:this._options.disableControllerAnimation});this.controllers.push(e),this.onControllerAddedObservable.notifyObservers(e)}const n=[],s=[];this.controllers.forEach((e=>{-1===t.indexOf(e.inputSource)?n.push(e):s.push(e)})),this.controllers=n,s.forEach((e=>{this.onControllerRemovedObservable.notifyObservers(e),e.dispose()}))}dispose(){this.controllers.forEach((e=>{e.dispose()})),this.xrSessionManager.onXRFrameObservable.remove(this._frameObserver),this.xrSessionManager.onXRSessionInit.remove(this._sessionInitObserver),this.xrSessionManager.onXRSessionEnded.remove(this._sessionEndedObserver),this.onControllerAddedObservable.clear(),this.onControllerRemovedObservable.clear(),Al.ClearControllerCache()}}var Il=i(2844);class Dl extends Il.F{constructor(e,t){super(e),this._options=t,this._attachController=e=>{if(this._controllers[e.uniqueId])return;const{laserPointer:t,selectionMesh:i}=this._generateNewMeshPair(e.pointer);switch(this._controllers[e.uniqueId]={xrController:e,laserPointer:t,selectionMesh:i,meshUnderPointer:null,pick:null,tmpRay:new Yt.z(new o.P,new o.P),disabledByNearInteraction:!1,id:Dl._IdCounter++},this._attachedController?!this._options.enablePointerSelectionOnAllControllers&&this._options.preferredHandedness&&e.inputSource.handedness===this._options.preferredHandedness&&(this._attachedController=e.uniqueId):this._options.enablePointerSelectionOnAllControllers||(this._attachedController=e.uniqueId),e.inputSource.targetRayMode){case"tracked-pointer":return this._attachTrackedPointerRayMode(e);case"gaze":return this._attachGazeMode(e);case"screen":return this._attachScreenRayMode(e)}},this._controllers={},this._tmpVectorForPickCompare=new o.P,this.disablePointerLighting=!0,this.disableSelectionMeshLighting=!0,this.displayLaserPointer=!0,this.displaySelectionMesh=!0,this.laserPointerPickedColor=new a.Wo(.9,.9,.9),this.laserPointerDefaultColor=new a.Wo(.7,.7,.7),this.selectionMeshDefaultColor=new a.Wo(.8,.8,.8),this.selectionMeshPickedColor=new a.Wo(.3,.3,1),this._identityMatrix=o.y3.Identity(),this._screenCoordinatesRef=o.P.Zero(),this._viewportRef=new ui.l(0,0,0,0),this._scene=this._xrSessionManager.scene}attach(){if(!super.attach())return!1;if(this._options.xrInput.controllers.forEach(this._attachController),this._addNewAttachObserver(this._options.xrInput.onControllerAddedObservable,this._attachController),this._addNewAttachObserver(this._options.xrInput.onControllerRemovedObservable,(e=>{this._detachController(e.uniqueId)})),this._scene.constantlyUpdateMeshUnderPointer=!0,this._options.gazeCamera){const e=this._options.gazeCamera,{laserPointer:t,selectionMesh:i}=this._generateNewMeshPair(e);this._controllers.camera={webXRCamera:e,laserPointer:t,selectionMesh:i,meshUnderPointer:null,pick:null,tmpRay:new Yt.z(new o.P,new o.P),disabledByNearInteraction:!1,id:Dl._IdCounter++},this._attachGazeMode()}return!0}detach(){return!!super.detach()&&(Object.keys(this._controllers).forEach((e=>{this._detachController(e)})),!0)}getMeshUnderPointer(e){return this._controllers[e]?this._controllers[e].meshUnderPointer:null}getXRControllerByPointerId(e){const t=Object.keys(this._controllers);for(let i=0;i<t.length;++i)if(this._controllers[t[i]].id===e)return this._controllers[t[i]].xrController||null;return null}_getPointerSelectionDisabledByPointerId(e){const t=Object.keys(this._controllers);for(let i=0;i<t.length;++i)if(this._controllers[t[i]].id===e)return this._controllers[t[i]].disabledByNearInteraction;return!0}_setPointerSelectionDisabledByPointerId(e,t){const i=Object.keys(this._controllers);for(let n=0;n<i.length;++n)if(this._controllers[i[n]].id===e)return void(this._controllers[i[n]].disabledByNearInteraction=t)}_onXRFrame(e){Object.keys(this._controllers).forEach((e=>{const t=this._controllers[e];if(!this._options.enablePointerSelectionOnAllControllers&&e!==this._attachedController||t.disabledByNearInteraction)return t.selectionMesh.isVisible=!1,t.laserPointer.isVisible=!1,void(t.pick=null);let i;if(t.laserPointer.isVisible=this.displayLaserPointer,t.xrController)i=t.xrController.pointer.position,t.xrController.getWorldPointerRayToRef(t.tmpRay);else{if(!t.webXRCamera)return;i=t.webXRCamera.position,t.webXRCamera.getForwardRayToRef(t.tmpRay)}if(this._options.maxPointerDistance&&(t.tmpRay.length=this._options.maxPointerDistance),!this._options.disableScenePointerVectorUpdate&&i){const e=this._xrSessionManager.scene,n=this._options.xrInput.xrCamera;n&&(n.viewport.toGlobalToRef(e.getEngine().getRenderWidth(),e.getEngine().getRenderHeight(),this._viewportRef),o.P.ProjectToRef(i,this._identityMatrix,e.getTransformMatrix(),this._viewportRef,this._screenCoordinatesRef),"number"!=typeof this._screenCoordinatesRef.x||"number"!=typeof this._screenCoordinatesRef.y||isNaN(this._screenCoordinatesRef.x)||isNaN(this._screenCoordinatesRef.y)||(e.pointerX=this._screenCoordinatesRef.x,e.pointerY=this._screenCoordinatesRef.y,t.screenCoordinates={x:this._screenCoordinatesRef.x,y:this._screenCoordinatesRef.y}))}let n=null;this._utilityLayerScene&&(n=this._utilityLayerScene.pickWithRay(t.tmpRay,this._utilityLayerScene.pointerMovePredicate||this.raySelectionPredicate));const s=this._scene.pickWithRay(t.tmpRay,this._scene.pointerMovePredicate||this.raySelectionPredicate);n&&n.hit?s&&s.hit?n.distance<s.distance?t.pick=n:t.pick=s:t.pick=n:t.pick=s,t.pick&&t.xrController&&(t.pick.aimTransform=t.xrController.pointer,t.pick.gripTransform=t.xrController.grip||null);const r=t.pick;if(r&&r.pickedPoint&&r.hit){this._updatePointerDistance(t.laserPointer,r.distance),t.selectionMesh.position.copyFrom(r.pickedPoint),t.selectionMesh.scaling.x=Math.sqrt(r.distance),t.selectionMesh.scaling.y=Math.sqrt(r.distance),t.selectionMesh.scaling.z=Math.sqrt(r.distance);const e=this._convertNormalToDirectionOfRay(r.getNormal(!0),t.tmpRay),i=.001;if(t.selectionMesh.position.copyFrom(r.pickedPoint),e){const n=o.P.Cross(We.RD.Y,e),s=o.P.Cross(e,n);o.P.RotationFromAxisToRef(s,e,n,t.selectionMesh.rotation),t.selectionMesh.position.addInPlace(e.scale(i))}t.selectionMesh.isVisible=this.displaySelectionMesh,t.meshUnderPointer=r.pickedMesh}else t.selectionMesh.isVisible=!1,this._updatePointerDistance(t.laserPointer,1),t.meshUnderPointer=null}))}get _utilityLayerScene(){return this._options.customUtilityLayerScene||zn.x.DefaultUtilityLayer.utilityLayerScene}_attachGazeMode(e){const t=this._controllers[e&&e.uniqueId||"camera"],i=this._options.timeToSelect||3e3,n=this._options.useUtilityLayer?this._utilityLayerScene:this._scene;let s=new bn.p;const r=cn("selection",{diameter:.0525,thickness:.015,tessellation:20},n);r.isVisible=!1,r.isPickable=!1,r.parent=t.selectionMesh;let o=0,a=!1;const l={pointerId:t.id,pointerType:"xr"};t.onFrameObserver=this._xrSessionManager.onXRFrameObservable.add((()=>{if(t.pick){if(this._augmentPointerInit(l,t.id,t.screenCoordinates),t.laserPointer.material.alpha=0,r.isVisible=!1,t.pick.hit)if(this._pickingMoved(s,t.pick))a&&(this._options.disablePointerUpOnTouchOut||this._scene.simulatePointerUp(t.pick,l)),a=!1,o=0;else if(o>i/10&&(r.isVisible=!0),o+=this._scene.getEngine().getDeltaTime(),o>=i)this._scene.simulatePointerDown(t.pick,l),a=!0,this._options.disablePointerUpOnTouchOut&&this._scene.simulatePointerUp(t.pick,l),r.isVisible=!1;else{const e=1-o/i;r.scaling.set(e,e,e)}else a=!1,o=0;this._scene.simulatePointerMove(t.pick,l),s=t.pick}})),void 0!==this._options.renderingGroupId&&(r.renderingGroupId=this._options.renderingGroupId),e&&e.onDisposeObservable.addOnce((()=>{t.pick&&!this._options.disablePointerUpOnTouchOut&&a&&(this._scene.simulatePointerUp(t.pick,l),t.finalPointerUpTriggered=!0),r.dispose()}))}_attachScreenRayMode(e){const t=this._controllers[e.uniqueId];let i=!1;const n={pointerId:t.id,pointerType:"xr"};t.onFrameObserver=this._xrSessionManager.onXRFrameObservable.add((()=>{this._augmentPointerInit(n,t.id,t.screenCoordinates),!t.pick||this._options.disablePointerUpOnTouchOut&&i||(i?this._scene.simulatePointerMove(t.pick,n):(this._scene.simulatePointerDown(t.pick,n),t.pointerDownTriggered=!0,i=!0,this._options.disablePointerUpOnTouchOut&&this._scene.simulatePointerUp(t.pick,n)))})),e.onDisposeObservable.addOnce((()=>{this._augmentPointerInit(n,t.id,t.screenCoordinates),this._xrSessionManager.runInXRFrame((()=>{t.pick&&!t.finalPointerUpTriggered&&i&&!this._options.disablePointerUpOnTouchOut&&(this._scene.simulatePointerUp(t.pick,n),t.finalPointerUpTriggered=!0)}))}))}_attachTrackedPointerRayMode(e){const t=this._controllers[e.uniqueId];if(this._options.forceGazeMode)return this._attachGazeMode(e);const i={pointerId:t.id,pointerType:"xr"};if(t.onFrameObserver=this._xrSessionManager.onXRFrameObservable.add((()=>{t.laserPointer.material.disableLighting=this.disablePointerLighting,t.selectionMesh.material.disableLighting=this.disableSelectionMeshLighting,t.pick&&(this._augmentPointerInit(i,t.id,t.screenCoordinates),this._scene.simulatePointerMove(t.pick,i))})),e.inputSource.gamepad){const n=n=>{this._options.overrideButtonId&&(t.selectionComponent=n.getComponent(this._options.overrideButtonId)),t.selectionComponent||(t.selectionComponent=n.getMainComponent()),t.onButtonChangedObserver=t.selectionComponent.onButtonStateChangedObservable.add((n=>{if(n.changes.pressed){const s=n.changes.pressed.current;t.pick?(this._options.enablePointerSelectionOnAllControllers||e.uniqueId===this._attachedController)&&(this._augmentPointerInit(i,t.id,t.screenCoordinates),s?(this._scene.simulatePointerDown(t.pick,i),t.pointerDownTriggered=!0,t.selectionMesh.material.emissiveColor=this.selectionMeshPickedColor,t.laserPointer.material.emissiveColor=this.laserPointerPickedColor):(this._scene.simulatePointerUp(t.pick,i),t.selectionMesh.material.emissiveColor=this.selectionMeshDefaultColor,t.laserPointer.material.emissiveColor=this.laserPointerDefaultColor)):!s||this._options.enablePointerSelectionOnAllControllers||this._options.disableSwitchOnClick||(this._attachedController=e.uniqueId)}}))};e.motionController?n(e.motionController):e.onMotionControllerInitObservable.add(n)}else{const e=e=>{this._augmentPointerInit(i,t.id,t.screenCoordinates),t.xrController&&e.inputSource===t.xrController.inputSource&&t.pick&&(this._scene.simulatePointerDown(t.pick,i),t.pointerDownTriggered=!0,t.selectionMesh.material.emissiveColor=this.selectionMeshPickedColor,t.laserPointer.material.emissiveColor=this.laserPointerPickedColor)},n=e=>{this._augmentPointerInit(i,t.id,t.screenCoordinates),t.xrController&&e.inputSource===t.xrController.inputSource&&t.pick&&(this._scene.simulatePointerUp(t.pick,i),t.selectionMesh.material.emissiveColor=this.selectionMeshDefaultColor,t.laserPointer.material.emissiveColor=this.laserPointerDefaultColor)};t.eventListeners={selectend:n,selectstart:e},this._xrSessionManager.session.addEventListener("selectstart",e),this._xrSessionManager.session.addEventListener("selectend",n)}}_convertNormalToDirectionOfRay(e,t){return e&&Math.acos(o.P.Dot(e,t.direction))<Math.PI/2&&e.scaleInPlace(-1),e}_detachController(e){const t=this._controllers[e];if(t){if(t.selectionComponent&&t.onButtonChangedObserver&&t.selectionComponent.onButtonStateChangedObservable.remove(t.onButtonChangedObserver),t.onFrameObserver&&this._xrSessionManager.onXRFrameObservable.remove(t.onFrameObserver),t.eventListeners&&Object.keys(t.eventListeners).forEach((e=>{const i=t.eventListeners&&t.eventListeners[e];i&&this._xrSessionManager.session.removeEventListener(e,i)})),!t.finalPointerUpTriggered&&t.pointerDownTriggered){const e={pointerId:t.id,pointerType:"xr"};this._xrSessionManager.runInXRFrame((()=>{this._augmentPointerInit(e,t.id,t.screenCoordinates),this._scene.simulatePointerUp(t.pick||new bn.p,e),t.finalPointerUpTriggered=!0}))}this._xrSessionManager.scene.onBeforeRenderObservable.addOnce((()=>{try{if(t.selectionMesh.dispose(),t.laserPointer.dispose(),delete this._controllers[e],this._attachedController===e){const e=Object.keys(this._controllers);e.length?this._attachedController=e[0]:this._attachedController=""}}catch(e){de.w1.Warn("controller already detached.")}}))}}_generateNewMeshPair(e){const t=this._options.useUtilityLayer?this._options.customUtilityLayerScene||zn.x.DefaultUtilityLayer.utilityLayerScene:this._scene,i=this._options.customLasterPointerMeshGenerator?this._options.customLasterPointerMeshGenerator():an("laserPointer",{height:1,diameterTop:2e-4,diameterBottom:.004,tessellation:20,subdivisions:1},t);i.parent=e;const n=new Gi.K("laserPointerMat",t);n.emissiveColor=this.laserPointerDefaultColor,n.alpha=.7,i.material=n,i.rotation.x=Math.PI/2,this._updatePointerDistance(i,1),i.isPickable=!1,i.isVisible=!1;const s=this._options.customSelectionMeshGenerator?this._options.customSelectionMeshGenerator():cn("gazeTracker",{diameter:.0105,thickness:.0075,tessellation:20},t);s.bakeCurrentTransformIntoVertices(),s.isPickable=!1,s.isVisible=!1;const r=new Gi.K("targetMat",t);return r.specularColor=a.Wo.Black(),r.emissiveColor=this.selectionMeshDefaultColor,r.backFaceCulling=!1,s.material=r,void 0!==this._options.renderingGroupId&&(i.renderingGroupId=this._options.renderingGroupId,s.renderingGroupId=this._options.renderingGroupId),{laserPointer:i,selectionMesh:s}}_pickingMoved(e,t){var i;if(!e.hit||!t.hit)return!0;if(!(e.pickedMesh&&e.pickedPoint&&t.pickedMesh&&t.pickedPoint))return!0;if(e.pickedMesh!==t.pickedMesh)return!0;null===(i=e.pickedPoint)||void 0===i||i.subtractToRef(t.pickedPoint,this._tmpVectorForPickCompare),this._tmpVectorForPickCompare.set(Math.abs(this._tmpVectorForPickCompare.x),Math.abs(this._tmpVectorForPickCompare.y),Math.abs(this._tmpVectorForPickCompare.z));const n=.01*(this._options.gazeModePointerMovedFactor||1)*t.distance;return this._tmpVectorForPickCompare.length()>n}_updatePointerDistance(e,t=100){e.scaling.y=t,this._scene.useRightHandedSystem&&(t*=-1),e.position.z=t/2+.05}_augmentPointerInit(e,t,i){e.pointerId=t,e.pointerType="xr",i&&(e.screenX=i.x,e.screenY=i.y)}get lasterPointerDefaultColor(){return this.laserPointerDefaultColor}}Dl._IdCounter=200,Dl.Name=vl.b.POINTER_SELECTION,Dl.Version=1,vl.d.AddWebXRFeature(Dl.Name,((e,t)=>()=>new Dl(e,t)),Dl.Version,!0);var Ol,wl,Nl,Fl=i(4834),Ll=i(9401);Ll.P.prototype._projectOnTrianglesToRef=function(e,t,i,n,s,r){const a=o.jp.Vector3[0],l=o.jp.Vector3[1];let h=1/0;for(let r=this.indexStart;r<this.indexStart+this.indexCount-(3-n);r+=n){const n=i[r],c=i[r+1],u=i[r+2];if(s&&4294967295===u){r+=2;continue}const d=t[n],p=t[c],f=t[u];if(!d||!p||!f)continue;const _=o.P.ProjectOnTriangleToRef(e,d,p,f,l);_<h&&(a.copyFrom(l),h=_)}return r.copyFrom(a),h},Ll.P.prototype._projectOnUnIndexedTrianglesToRef=function(e,t,i,n){const s=o.jp.Vector3[0],r=o.jp.Vector3[1];let a=1/0;for(let i=this.verticesStart;i<this.verticesStart+this.verticesCount;i+=3){const n=t[i],l=t[i+1],h=t[i+2],c=o.P.ProjectOnTriangleToRef(e,n,l,h,r);c<a&&(s.copyFrom(r),a=c)}return n.copyFrom(s),a},Ll.P.prototype.projectToRef=function(e,t,i,n){const s=this.getMaterial();if(!s)return-1;let r=3,o=!1;switch(s.fillMode){case 3:case 5:case 6:case 8:return-1;case 7:r=1,o=!0}return 4===s.fillMode?-1:!i.length&&this._mesh._unIndexed?this._projectOnUnIndexedTrianglesToRef(e,t,i,n):this._projectOnTrianglesToRef(e,t,i,r,o,n)},function(e){e[e.DEHYDRATED=0]="DEHYDRATED",e[e.HOVER=1]="HOVER",e[e.TOUCH=2]="TOUCH"}(Ol||(Ol={})),function(e){e[e.DISABLED=0]="DISABLED",e[e.CENTERED_ON_CONTROLLER=1]="CENTERED_ON_CONTROLLER",e[e.CENTERED_IN_FRONT=2]="CENTERED_IN_FRONT"}(wl||(wl={}));class Bl extends Il.F{constructor(e,t){super(e),this._options=t,this._tmpRay=new Yt.z(new o.P,new o.P),this._attachController=e=>{if(this._controllers[e.uniqueId])return;const{touchCollisionMesh:t,touchCollisionMeshFunction:i,hydrateCollisionMeshFunction:n}=this._generateNewTouchPointMesh(),s=this._generateVisualCue();switch(this._controllers[e.uniqueId]={xrController:e,meshUnderPointer:null,nearInteractionTargetMesh:null,pick:null,stalePick:null,touchCollisionMesh:t,touchCollisionMeshFunction:i,hydrateCollisionMeshFunction:n,currentAnimationState:Ol.DEHYDRATED,grabRay:new Yt.z(new o.P,new o.P),hoverInteraction:!1,nearInteraction:!1,grabInteraction:!1,id:Bl._IdCounter++,pickedPointVisualCue:s},this._attachedController?!this._options.enableNearInteractionOnAllControllers&&this._options.preferredHandedness&&e.inputSource.handedness===this._options.preferredHandedness&&(this._attachedController=e.uniqueId):this._options.enableNearInteractionOnAllControllers||(this._attachedController=e.uniqueId),e.inputSource.targetRayMode){case"tracked-pointer":return this._attachNearInteractionMode(e);case"gaze":case"screen":return null}},this._controllers={},this._farInteractionFeature=null,this.selectionMeshDefaultColor=new a.Wo(.8,.8,.8),this.selectionMeshPickedColor=new a.Wo(.3,.3,1),this._hoverRadius=.1,this._pickRadius=.02,this._controllerPickRadius=.03,this._nearGrabLengthScale=5,this._scene=this._xrSessionManager.scene,void 0===this._options.nearInteractionControllerMode&&(this._options.nearInteractionControllerMode=wl.CENTERED_IN_FRONT),this._options.farInteractionFeature&&(this._farInteractionFeature=this._options.farInteractionFeature)}attach(){return!!super.attach()&&(this._options.xrInput.controllers.forEach(this._attachController),this._addNewAttachObserver(this._options.xrInput.onControllerAddedObservable,this._attachController),this._addNewAttachObserver(this._options.xrInput.onControllerRemovedObservable,(e=>{this._detachController(e.uniqueId)})),this._scene.constantlyUpdateMeshUnderPointer=!0,!0)}detach(){return!!super.detach()&&(Object.keys(this._controllers).forEach((e=>{this._detachController(e)})),!0)}getMeshUnderPointer(e){return this._controllers[e]?this._controllers[e].meshUnderPointer:null}getXRControllerByPointerId(e){const t=Object.keys(this._controllers);for(let i=0;i<t.length;++i)if(this._controllers[t[i]].id===e)return this._controllers[t[i]].xrController||null;return null}setFarInteractionFeature(e){this._farInteractionFeature=e}_nearPickPredicate(e){return e.isEnabled()&&e.isVisible&&e.isPickable&&e.isNearPickable}_nearGrabPredicate(e){return e.isEnabled()&&e.isVisible&&e.isPickable&&e.isNearGrabbable}_nearInteractionPredicate(e){return e.isEnabled()&&e.isVisible&&e.isPickable&&(e.isNearPickable||e.isNearGrabbable)}_controllerAvailablePredicate(e,t){let i=e;for(;i;){if(i.reservedDataStore&&i.reservedDataStore.nearInteraction&&i.reservedDataStore.nearInteraction.excludedControllerId===t)return!1;i=i.parent}return!0}_handleTransitionAnimation(e,t){var i;if(e.currentAnimationState!==t&&this._options.nearInteractionControllerMode===wl.CENTERED_IN_FRONT&&!(null===(i=e.xrController)||void 0===i?void 0:i.inputSource.hand)){if(t>e.currentAnimationState)switch(e.currentAnimationState){case Ol.DEHYDRATED:if(e.hydrateCollisionMeshFunction(!0),t===Ol.HOVER)break;case Ol.HOVER:if(e.touchCollisionMeshFunction(!0),t===Ol.TOUCH)break}else switch(e.currentAnimationState){case Ol.TOUCH:if(e.touchCollisionMeshFunction(!1),t===Ol.HOVER)break;case Ol.HOVER:if(e.hydrateCollisionMeshFunction(!1),t===Ol.DEHYDRATED)break}e.currentAnimationState=t}}_processTouchPoint(e,t,i){var n;const s=this._controllers[e];s.grabRay.origin.copyFrom(t),i.toEulerAnglesToRef(o.jp.Vector3[0]),s.grabRay.direction.copyFrom(o.jp.Vector3[0]),this._options.nearInteractionControllerMode!==wl.CENTERED_IN_FRONT||(null===(n=s.xrController)||void 0===n?void 0:n.inputSource.hand)||(s.xrController.getWorldPointerRayToRef(this._tmpRay),s.grabRay.origin.addInPlace(this._tmpRay.direction.scale(.05))),s.grabRay.length=this._nearGrabLengthScale*this._hoverRadius,s.touchCollisionMesh.position.copyFrom(s.grabRay.origin)}_onXRFrame(e){Object.keys(this._controllers).forEach((t=>{var i;const n=this._controllers[t],s=null===(i=n.xrController)||void 0===i?void 0:i.inputSource.hand;if(!this._options.enableNearInteractionOnAllControllers&&t!==this._attachedController||!n.xrController||!s&&(!this._options.nearInteractionControllerMode||!n.xrController.inputSource.gamepad))return void(n.pick=null);if(n.hoverInteraction=!1,n.nearInteraction=!1,!n.xrController)return;if(s){const i=s.get("index-finger-tip");if(i){const n=e.getJointPose(i,this._xrSessionManager.referenceSpace);if(n&&n.transform){const e=this._scene.useRightHandedSystem?1:-1;o.jp.Vector3[0].set(n.transform.position.x,n.transform.position.y,n.transform.position.z*e),o.jp.Quaternion[0].set(n.transform.orientation.x,n.transform.orientation.y,n.transform.orientation.z*e,n.transform.orientation.w*e),this._processTouchPoint(t,o.jp.Vector3[0],o.jp.Quaternion[0])}}}else if(n.xrController.inputSource.gamepad&&this._options.nearInteractionControllerMode!==wl.DISABLED){let e=n.xrController.pointer;n.xrController.grip&&this._options.nearInteractionControllerMode===wl.CENTERED_ON_CONTROLLER&&(e=n.xrController.grip),this._processTouchPoint(t,e.position,e.rotationQuaternion)}const r=(e,t)=>{let i=null;return i=t&&t.hit?e&&e.hit?t.distance<e.distance?t:e:t:e,i},a=e=>{let t=new bn.p,i=!1;const n=e&&e.pickedPoint&&e.hit;return(null==e?void 0:e.pickedPoint)&&(i=0===e.pickedPoint.x&&0===e.pickedPoint.y&&0===e.pickedPoint.z),n&&!i&&(t=e),t};if(!n.grabInteraction){let e=null,t=null;this._options.useUtilityLayer&&this._utilityLayerScene&&(t=this._pickWithSphere(n,this._hoverRadius,this._utilityLayerScene,(e=>this._nearInteractionPredicate(e))));const i=r(this._pickWithSphere(n,this._hoverRadius,this._scene,(e=>this._nearInteractionPredicate(e))),t);if(i&&i.hit&&(e=a(i),e.hit&&(n.hoverInteraction=!0)),n.hoverInteraction){let t=null;const i=s?this._pickRadius:this._controllerPickRadius;this._options.useUtilityLayer&&this._utilityLayerScene&&(t=this._pickWithSphere(n,i,this._utilityLayerScene,(e=>this._nearPickPredicate(e))));const o=a(r(this._pickWithSphere(n,i,this._scene,(e=>this._nearPickPredicate(e))),t));o.hit&&(e=o,n.nearInteraction=!0)}n.stalePick=n.pick,n.pick=e,n.pick&&n.pick.pickedPoint&&n.pick.hit?(n.meshUnderPointer=n.pick.pickedMesh,n.pickedPointVisualCue.position.copyFrom(n.pick.pickedPoint),n.pickedPointVisualCue.isVisible=!0,this._farInteractionFeature&&this._farInteractionFeature.attached&&this._farInteractionFeature._setPointerSelectionDisabledByPointerId(n.id,!0)):(n.meshUnderPointer=null,n.pickedPointVisualCue.isVisible=!1,this._farInteractionFeature&&this._farInteractionFeature.attached&&this._farInteractionFeature._setPointerSelectionDisabledByPointerId(n.id,!1))}let l=Ol.DEHYDRATED;n.grabInteraction||n.nearInteraction?l=Ol.TOUCH:n.hoverInteraction&&(l=Ol.HOVER),this._handleTransitionAnimation(n,l)}))}get _utilityLayerScene(){return this._options.customUtilityLayerScene||zn.x.DefaultUtilityLayer.utilityLayerScene}_generateVisualCue(){const e=this._options.useUtilityLayer?this._options.customUtilityLayerScene||zn.x.DefaultUtilityLayer.utilityLayerScene:this._scene,t=Kn("nearInteraction",{diameter:.0105},e);t.bakeCurrentTransformIntoVertices(),t.isPickable=!1,t.isVisible=!1,t.rotationQuaternion=o._f.Identity();const i=new Gi.K("targetMat",e);return i.specularColor=a.Wo.Black(),i.emissiveColor=this.selectionMeshDefaultColor,i.backFaceCulling=!1,t.material=i,t}_isControllerReadyForNearInteraction(e){return!this._farInteractionFeature||this._farInteractionFeature._getPointerSelectionDisabledByPointerId(e)}_attachNearInteractionMode(e){const t=this._controllers[e.uniqueId],i={pointerId:t.id,pointerType:"xr-near"};t.onFrameObserver=this._xrSessionManager.onXRFrameObservable.add((()=>{(this._options.enableNearInteractionOnAllControllers||e.uniqueId===this._attachedController)&&t.xrController&&(t.xrController.inputSource.hand||this._options.nearInteractionControllerMode&&t.xrController.inputSource.gamepad)&&(t.pick&&(t.pick.ray=t.grabRay),t.pick&&this._isControllerReadyForNearInteraction(t.id)&&this._scene.simulatePointerMove(t.pick,i),t.nearInteraction&&t.pick&&t.pick.hit?t.nearInteractionTargetMesh||(this._scene.simulatePointerDown(t.pick,i),t.nearInteractionTargetMesh=t.meshUnderPointer):t.nearInteractionTargetMesh&&t.stalePick&&(this._scene.simulatePointerUp(t.stalePick,i),t.nearInteractionTargetMesh=null))}));const n=n=>{this._options.enableNearInteractionOnAllControllers||e.uniqueId===this._attachedController&&this._isControllerReadyForNearInteraction(t.id)?(t.pick&&(t.pick.ray=t.grabRay),n&&t.pick&&t.meshUnderPointer&&this._nearGrabPredicate(t.meshUnderPointer)?(t.grabInteraction=!0,t.pickedPointVisualCue.isVisible=!1,this._scene.simulatePointerDown(t.pick,i)):!n&&t.pick&&t.grabInteraction&&(this._scene.simulatePointerUp(t.pick,i),t.grabInteraction=!1,t.pickedPointVisualCue.isVisible=!0)):!n||this._options.enableNearInteractionOnAllControllers||this._options.disableSwitchOnClick||(this._attachedController=e.uniqueId)};if(e.inputSource.gamepad){const i=e=>{t.squeezeComponent=e.getComponent("grasp"),t.squeezeComponent?t.onSqueezeButtonChangedObserver=t.squeezeComponent.onButtonStateChangedObservable.add((e=>{if(e.changes.pressed){const t=e.changes.pressed.current;n(t)}})):(t.selectionComponent=e.getMainComponent(),t.onButtonChangedObserver=t.selectionComponent.onButtonStateChangedObservable.add((e=>{if(e.changes.pressed){const t=e.changes.pressed.current;n(t)}})))};e.motionController?i(e.motionController):e.onMotionControllerInitObservable.add(i)}else{const e=e=>{t.xrController&&e.inputSource===t.xrController.inputSource&&t.pick&&this._isControllerReadyForNearInteraction(t.id)&&t.meshUnderPointer&&this._nearGrabPredicate(t.meshUnderPointer)&&(t.grabInteraction=!0,t.pickedPointVisualCue.isVisible=!1,this._scene.simulatePointerDown(t.pick,i))},n=e=>{t.xrController&&e.inputSource===t.xrController.inputSource&&t.pick&&this._isControllerReadyForNearInteraction(t.id)&&(this._scene.simulatePointerUp(t.pick,i),t.grabInteraction=!1,t.pickedPointVisualCue.isVisible=!0)};t.eventListeners={selectend:n,selectstart:e},this._xrSessionManager.session.addEventListener("selectstart",e),this._xrSessionManager.session.addEventListener("selectend",n)}}_detachController(e){const t=this._controllers[e];if(t&&(t.squeezeComponent&&t.onSqueezeButtonChangedObserver&&t.squeezeComponent.onButtonStateChangedObservable.remove(t.onSqueezeButtonChangedObserver),t.selectionComponent&&t.onButtonChangedObserver&&t.selectionComponent.onButtonStateChangedObservable.remove(t.onButtonChangedObserver),t.onFrameObserver&&this._xrSessionManager.onXRFrameObservable.remove(t.onFrameObserver),t.eventListeners&&Object.keys(t.eventListeners).forEach((e=>{const i=t.eventListeners&&t.eventListeners[e];i&&this._xrSessionManager.session.removeEventListener(e,i)})),t.touchCollisionMesh.dispose(),t.pickedPointVisualCue.dispose(),this._xrSessionManager.runInXRFrame((()=>{const e={pointerId:t.id,pointerType:"xr-near"};this._scene.simulatePointerUp(new bn.p,e)})),delete this._controllers[e],this._attachedController===e)){const e=Object.keys(this._controllers);e.length?this._attachedController=e[0]:this._attachedController=""}}_generateNewTouchPointMesh(){const e=this._options.useUtilityLayer?this._options.customUtilityLayerScene||zn.x.DefaultUtilityLayer.utilityLayerScene:this._scene,t=Kn("PickSphere",{diameter:1},e);t.isVisible=!1,this._options.motionControllerOrbMaterial?t.material=this._options.motionControllerOrbMaterial:Fl.O.ParseFromSnippetAsync("8RUNKL#3",e).then((e=>{t.material=e}));const i=new ee;i.setEasingMode(j.EASINGMODE_EASEINOUT);const n=new o.P(this._controllerPickRadius,this._controllerPickRadius,this._controllerPickRadius),s=this._controllerPickRadius*(4/3),r=new o.P(s,s,s),a=this._controllerPickRadius*(7/6),l=new o.P(a,a,a),h=.8*this._controllerPickRadius,c=new o.P(h,h,h),u=1.5*this._controllerPickRadius,d=[{frame:0,value:n},{frame:10,value:new o.P(u,u,u)},{frame:18,value:r}],p=[{frame:0,value:r},{frame:10,value:c},{frame:18,value:n}],f=[{frame:0,value:o.P.ZeroReadOnly},{frame:12,value:l},{frame:15,value:n}],_=[{frame:0,value:n},{frame:10,value:o.P.ZeroReadOnly},{frame:15,value:o.P.ZeroReadOnly}],m=new D.f("touch","scaling",60,D.f.ANIMATIONTYPE_VECTOR3,D.f.ANIMATIONLOOPMODE_CONSTANT),g=new D.f("release","scaling",60,D.f.ANIMATIONTYPE_VECTOR3,D.f.ANIMATIONLOOPMODE_CONSTANT),v=new D.f("hydrate","scaling",60,D.f.ANIMATIONTYPE_VECTOR3,D.f.ANIMATIONLOOPMODE_CONSTANT),y=new D.f("dehydrate","scaling",60,D.f.ANIMATIONTYPE_VECTOR3,D.f.ANIMATIONLOOPMODE_CONSTANT);return m.setEasingFunction(i),g.setEasingFunction(i),v.setEasingFunction(i),y.setEasingFunction(i),m.setKeys(d),g.setKeys(p),v.setKeys(f),y.setKeys(_),{touchCollisionMesh:t,touchCollisionMeshFunction:i=>{const n=i?m:g;e.beginDirectAnimation(t,[n],0,18,!1,1)},hydrateCollisionMeshFunction:i=>{const n=i?v:y;i&&(t.isVisible=!0),e.beginDirectAnimation(t,[n],0,15,!1,1,(()=>{i||(t.isVisible=!1)}))}}}_pickWithSphere(e,t,i,n){const s=new bn.p;if(s.distance=1/0,e.touchCollisionMesh&&e.xrController){const r=e.touchCollisionMesh.position,o=Nn.K.CreateFromCenterAndRadius(r,t);for(let t=0;t<i.meshes.length;t++){const r=i.meshes[t];if(!n(r)||!this._controllerAvailablePredicate(r,e.xrController.uniqueId))continue;const a=Bl.PickMeshWithSphere(r,o);a&&a.hit&&a.distance<s.distance&&(s.hit=a.hit,s.pickedMesh=r,s.pickedPoint=a.pickedPoint,s.aimTransform=e.xrController.pointer,s.gripTransform=e.xrController.grip||null,s.originMesh=e.touchCollisionMesh,s.distance=a.distance)}}return s}static PickMeshWithSphere(e,t,i=!1){const n=e.subMeshes,s=new bn.p,r=e.getBoundingInfo();if(!e._generatePointsArray())return s;if(!e.subMeshes||!r)return s;if(!i&&!Nn.K.Intersects(r.boundingSphere,t))return s;const a=o.jp.Vector3[0],l=o.jp.Vector3[1];let h,c,u,d=1/0;const p=o.jp.Vector3[2],f=o.jp.Matrix[0];f.copyFrom(e.getWorldMatrix()),f.invert(),o.P.TransformCoordinatesToRef(t.center,f,p);for(let i=0;i<n.length;i++)n[i].projectToRef(p,e._positions,e.getIndices(),l),o.P.TransformCoordinatesToRef(l,e.getWorldMatrix(),l),h=o.P.Distance(l,t.center),u=o.P.Distance(l,e.getAbsolutePosition()),c=o.P.Distance(t.center,e.getAbsolutePosition()),-1!==c&&-1!==u&&u>c&&(h=0,l.copyFrom(t.center)),-1!==h&&h<d&&(d=h,a.copyFrom(l));return d<t.radius&&(s.hit=!0,s.distance=d,s.pickedMesh=e,s.pickedPoint=a.clone()),s}}Bl._IdCounter=200,Bl.Name=vl.b.NEAR_INTERACTION,Bl.Version=1,vl.d.AddWebXRFeature(Bl.Name,((e,t)=>()=>new Bl(e,t)),Bl.Version,!0);class Ul{constructor(e,t,i){this.element=e,this.sessionMode=t,this.referenceSpaceType=i}update(e){}}class Vl{}class kl{constructor(e,t){if(this._scene=e,this.options=t,this._activeButton=null,this._buttons=[],this.activeButtonChangedObservable=new r.y$,this._onSessionGranted=e=>{this._helper&&this._enterXRWithButtonIndex(0)},this.overlay=document.createElement("div"),this.overlay.classList.add("xr-button-overlay"),!t.ignoreSessionGrantedEvent&&navigator.xr&&navigator.xr.addEventListener("sessiongranted",this._onSessionGranted),"undefined"!=typeof window&&window.location&&"http:"===window.location.protocol&&"localhost"!==window.location.hostname)throw de.w1.Warn("WebXR can only be served over HTTPS"),new Error("WebXR can only be served over HTTPS");if(t.customButtons)this._buttons=t.customButtons;else{this.overlay.style.cssText="z-index:11;position: absolute; right: 20px;bottom: 50px;";const e=t.sessionMode||"immersive-vr",i=t.referenceSpaceType||"local-floor";let n=".babylonVRicon { color: #868686; border-color: #868686; border-style: solid; margin-left: 10px; height: 50px; width: 80px; background-color: rgba(51,51,51,0.7); background-image: url("+("undefined"==typeof SVGSVGElement?"https://cdn.babylonjs.com/Assets/vrButton.png":"data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%222048%22%20height%3D%221152%22%20viewBox%3D%220%200%202048%201152%22%20version%3D%221.1%22%3E%3Cpath%20transform%3D%22rotate%28180%201024%2C576.0000000000001%29%22%20d%3D%22m1109%2C896q17%2C0%2030%2C-12t13%2C-30t-12.5%2C-30.5t-30.5%2C-12.5l-170%2C0q-18%2C0%20-30.5%2C12.5t-12.5%2C30.5t13%2C30t30%2C12l170%2C0zm-85%2C256q59%2C0%20132.5%2C-1.5t154.5%2C-5.5t164.5%2C-11.5t163%2C-20t150%2C-30t124.5%2C-41.5q23%2C-11%2042%2C-24t38%2C-30q27%2C-25%2041%2C-61.5t14%2C-72.5l0%2C-257q0%2C-123%20-47%2C-232t-128%2C-190t-190%2C-128t-232%2C-47l-81%2C0q-37%2C0%20-68.5%2C14t-60.5%2C34.5t-55.5%2C45t-53%2C45t-53%2C34.5t-55.5%2C14t-55.5%2C-14t-53%2C-34.5t-53%2C-45t-55.5%2C-45t-60.5%2C-34.5t-68.5%2C-14l-81%2C0q-123%2C0%20-232%2C47t-190%2C128t-128%2C190t-47%2C232l0%2C257q0%2C68%2038%2C115t97%2C73q54%2C24%20124.5%2C41.5t150%2C30t163%2C20t164.5%2C11.5t154.5%2C5.5t132.5%2C1.5zm939%2C-298q0%2C39%20-24.5%2C67t-58.5%2C42q-54%2C23%20-122%2C39.5t-143.5%2C28t-155.5%2C19t-157%2C11t-148.5%2C5t-129.5%2C1.5q-59%2C0%20-130%2C-1.5t-148%2C-5t-157%2C-11t-155.5%2C-19t-143.5%2C-28t-122%2C-39.5q-34%2C-14%20-58.5%2C-42t-24.5%2C-67l0%2C-257q0%2C-106%2040.5%2C-199t110%2C-162.5t162.5%2C-109.5t199%2C-40l81%2C0q27%2C0%2052%2C14t50%2C34.5t51%2C44.5t55.5%2C44.5t63.5%2C34.5t74%2C14t74%2C-14t63.5%2C-34.5t55.5%2C-44.5t51%2C-44.5t50%2C-34.5t52%2C-14l14%2C0q37%2C0%2070%2C0.5t64.5%2C4.5t63.5%2C12t68%2C23q71%2C30%20128.5%2C78.5t98.5%2C110t63.5%2C133.5t22.5%2C149l0%2C257z%22%20fill%3D%22white%22%20/%3E%3C/svg%3E%0A")+"); background-size: 80%; background-repeat:no-repeat; background-position: center; border: none; outline: none; transition: transform 0.125s ease-out } .babylonVRicon:hover { transform: scale(1.05) } .babylonVRicon:active {background-color: rgba(51,51,51,1) } .babylonVRicon:focus {background-color: rgba(51,51,51,1) }";n+='.babylonVRicon.vrdisplaypresenting { background-image: none;} .vrdisplaypresenting::after { content: "EXIT"} .xr-error::after { content: "ERROR"}';const s=document.createElement("style");s.appendChild(document.createTextNode(n)),document.getElementsByTagName("head")[0].appendChild(s);const r=document.createElement("button");r.className="babylonVRicon",r.title=`${e} - ${i}`,this._buttons.push(new Ul(r,e,i)),this._buttons[this._buttons.length-1].update=function(e){this.element.style.display=null===e||e===this?"":"none",r.className="babylonVRicon"+(e===this?" vrdisplaypresenting":"")},this._updateButtons(null)}const i=e.getEngine().getInputElement();i&&i.parentNode&&(i.parentNode.appendChild(this.overlay),e.onDisposeObservable.addOnce((()=>{this.dispose()})))}async setHelperAsync(e,t){this._helper=e,this._renderTarget=t;const i=this._buttons.map((t=>e.sessionManager.isSessionSupportedAsync(t.sessionMode)));e.onStateChangedObservable.add((e=>{e==Xi.NOT_IN_XR&&this._updateButtons(null)})),(await Promise.all(i)).forEach(((e,t)=>{e?(this.overlay.appendChild(this._buttons[t].element),this._buttons[t].element.onclick=this._enterXRWithButtonIndex.bind(this,t)):de.w1.Warn(`Session mode "${this._buttons[t].sessionMode}" not supported in browser`)}))}static async CreateAsync(e,t,i){const n=new kl(e,i);return await n.setHelperAsync(t,i.renderTarget||void 0),n}async _enterXRWithButtonIndex(e=0){if(this._helper.state==Xi.IN_XR)await this._helper.exitXRAsync(),this._updateButtons(null);else if(this._helper.state==Xi.NOT_IN_XR)try{await this._helper.enterXRAsync(this._buttons[e].sessionMode,this._buttons[e].referenceSpaceType,this._renderTarget,{optionalFeatures:this.options.optionalFeatures,requiredFeatures:this.options.requiredFeatures}),this._updateButtons(this._buttons[e])}catch(t){this._updateButtons(null);const i=this._buttons[e].element,n=i.title;i.title="Error entering XR session : "+n,i.classList.add("xr-error"),this.options.onError&&this.options.onError(t)}}dispose(){const e=this._scene.getEngine().getInputElement();e&&e.parentNode&&e.parentNode.contains(this.overlay)&&e.parentNode.removeChild(this.overlay),this.activeButtonChangedObservable.clear(),navigator.xr.removeEventListener("sessiongranted",this._onSessionGranted)}_updateButtons(e){this._activeButton=e,this._buttons.forEach((e=>{e.update(this._activeButton)})),this.activeButtonChangedObservable.notifyObservers(this._activeButton)}}function Gl(e){var t;let i=0;const n=Date.now();e.observableParameters=null!==(t=e.observableParameters)&&void 0!==t?t:{};const s=e.contextObservable.add((t=>{const r=Date.now();i=r-n;const o={startTime:n,currentTime:r,deltaTime:i,completeRate:i/e.timeout,payload:t};e.onTick&&e.onTick(o),e.breakCondition&&e.breakCondition()&&(e.contextObservable.remove(s),e.onAborted&&e.onAborted(o)),i>=e.timeout&&(e.contextObservable.remove(s),e.onEnded&&e.onEnded(o))}),e.observableParameters.mask,e.observableParameters.insertFirst,e.observableParameters.scope);return s}!function(e){e[e.INIT=0]="INIT",e[e.STARTED=1]="STARTED",e[e.ENDED=2]="ENDED"}(Nl||(Nl={}));class zl{constructor(e){var t,i;this.onEachCountObservable=new r.y$,this.onTimerAbortedObservable=new r.y$,this.onTimerEndedObservable=new r.y$,this.onStateChangedObservable=new r.y$,this._observer=null,this._breakOnNextTick=!1,this._tick=e=>{const t=Date.now();this._timer=t-this._startTime;const i={startTime:this._startTime,currentTime:t,deltaTime:this._timer,completeRate:this._timer/this._timeToEnd,payload:e},n=this._breakOnNextTick||this._breakCondition(i);n||this._timer>=this._timeToEnd?this._stop(i,n):this.onEachCountObservable.notifyObservers(i)},this._setState(Nl.INIT),this._contextObservable=e.contextObservable,this._observableParameters=null!==(t=e.observableParameters)&&void 0!==t?t:{},this._breakCondition=null!==(i=e.breakCondition)&&void 0!==i?i:()=>!1,this._timeToEnd=e.timeout,e.onEnded&&this.onTimerEndedObservable.add(e.onEnded),e.onTick&&this.onEachCountObservable.add(e.onTick),e.onAborted&&this.onTimerAbortedObservable.add(e.onAborted)}set breakCondition(e){this._breakCondition=e}clearObservables(){this.onEachCountObservable.clear(),this.onTimerAbortedObservable.clear(),this.onTimerEndedObservable.clear(),this.onStateChangedObservable.clear()}start(e=this._timeToEnd){if(this._state===Nl.STARTED)throw new Error("Timer already started. Please stop it before starting again");this._timeToEnd=e,this._startTime=Date.now(),this._timer=0,this._observer=this._contextObservable.add(this._tick,this._observableParameters.mask,this._observableParameters.insertFirst,this._observableParameters.scope),this._setState(Nl.STARTED)}stop(){this._state===Nl.STARTED&&(this._breakOnNextTick=!0)}dispose(){this._observer&&this._contextObservable.remove(this._observer),this.clearObservables()}_setState(e){this._state=e,this.onStateChangedObservable.notifyObservers(this._state)}_stop(e,t=!1){this._contextObservable.remove(this._observer),this._setState(Nl.ENDED),t?this.onTimerAbortedObservable.notifyObservers(e):this.onTimerEndedObservable.notifyObservers(e)}}class Wl extends Il.F{get rotationEnabled(){return this._rotationEnabled}set rotationEnabled(e){if(this._rotationEnabled=e,this._options.teleportationTargetMesh){const t=this._options.teleportationTargetMesh.getChildMeshes(!1,(e=>"rotationCone"===e.name));t[0]&&t[0].setEnabled(e)}}get teleportationTargetMesh(){return this._options.teleportationTargetMesh||null}constructor(e,t){super(e),this._options=t,this._controllers={},this._snappedToPoint=!1,this._cachedColor4White=new a.HE(1,1,1,1),this._tmpRay=new Yt.z(new o.P,new o.P),this._tmpVector=new o.P,this._tmpQuaternion=new o._f,this.skipNextTeleportation=!1,this.backwardsMovementEnabled=!0,this.backwardsTeleportationDistance=.7,this.parabolicCheckRadius=5,this.parabolicRayEnabled=!0,this.straightRayEnabled=!0,this.rotationAngle=Math.PI/8,this.onTargetMeshPositionUpdatedObservable=new r.y$,this.teleportationEnabled=!0,this._rotationEnabled=!0,this._attachController=e=>{if(this._controllers[e.uniqueId]||this._options.forceHandedness&&e.inputSource.handedness!==this._options.forceHandedness)return;this._controllers[e.uniqueId]={xrController:e,teleportationState:{forward:!1,backwards:!1,rotating:!1,currentRotation:0,baseRotation:0,blocked:!1}};const t=this._controllers[e.uniqueId];if("tracked-pointer"===t.xrController.inputSource.targetRayMode&&t.xrController.inputSource.gamepad){const i=()=>{if(e.motionController){const i=e.motionController.getComponentOfType(xl.THUMBSTICK_TYPE)||e.motionController.getComponentOfType(xl.TOUCHPAD_TYPE);if(!i||this._options.useMainComponentOnly){const i=e.motionController.getMainComponent();if(!i)return;t.teleportationComponent=i,t.onButtonChangedObserver=i.onButtonStateChangedObservable.add((()=>{this.teleportationEnabled&&i.changes.pressed&&(i.changes.pressed.current?(t.teleportationState.forward=!0,this._currentTeleportationControllerId=t.xrController.uniqueId,t.teleportationState.baseRotation=this._options.xrInput.xrCamera.rotationQuaternion.toEulerAngles().y,t.teleportationState.currentRotation=0,Gl({timeout:this._options.timeToTeleport||3e3,contextObservable:this._xrSessionManager.onXRFrameObservable,breakCondition:()=>!i.pressed,onEnded:()=>{this._currentTeleportationControllerId===t.xrController.uniqueId&&t.teleportationState.forward&&this._teleportForward(e.uniqueId)}})):(t.teleportationState.forward=!1,this._currentTeleportationControllerId=""))}))}else t.teleportationComponent=i,t.onAxisChangedObserver=i.onAxisValueChangedObservable.add((i=>{if(i.y<=.7&&t.teleportationState.backwards&&(t.teleportationState.backwards=!1),i.y>.7&&!t.teleportationState.forward&&this.backwardsMovementEnabled&&!this.snapPointsOnly&&!t.teleportationState.backwards){t.teleportationState.backwards=!0,this._tmpQuaternion.copyFrom(this._options.xrInput.xrCamera.rotationQuaternion),this._tmpQuaternion.toEulerAnglesToRef(this._tmpVector),this._tmpVector.x=0,this._tmpVector.z=0,o._f.FromEulerVectorToRef(this._tmpVector,this._tmpQuaternion),this._tmpVector.set(0,0,this.backwardsTeleportationDistance*(this._xrSessionManager.scene.useRightHandedSystem?1:-1)),this._tmpVector.rotateByQuaternionToRef(this._tmpQuaternion,this._tmpVector),this._tmpVector.addInPlace(this._options.xrInput.xrCamera.position),this._tmpRay.origin.copyFrom(this._tmpVector),this._tmpRay.length=this._options.xrInput.xrCamera.realWorldHeight+.1,this._tmpRay.direction.set(0,-1,0);const e=this._xrSessionManager.scene.pickWithRay(this._tmpRay,(e=>-1!==this._floorMeshes.indexOf(e)));e&&e.pickedPoint&&(this._options.xrInput.xrCamera.position.x=e.pickedPoint.x,this._options.xrInput.xrCamera.position.z=e.pickedPoint.z)}if(i.y<-.7&&!this._currentTeleportationControllerId&&!t.teleportationState.rotating&&this.teleportationEnabled&&(t.teleportationState.forward=!0,this._currentTeleportationControllerId=t.xrController.uniqueId,t.teleportationState.baseRotation=this._options.xrInput.xrCamera.rotationQuaternion.toEulerAngles().y),i.x){if(t.teleportationState.forward)this._currentTeleportationControllerId===t.xrController.uniqueId&&(this.rotationEnabled?setTimeout((()=>{t.teleportationState.currentRotation=Math.atan2(i.x,i.y*(this._xrSessionManager.scene.useRightHandedSystem?1:-1))})):t.teleportationState.currentRotation=0);else if(!t.teleportationState.rotating&&Math.abs(i.x)>.7){t.teleportationState.rotating=!0;const e=this.rotationAngle*(i.x>0?1:-1)*(this._xrSessionManager.scene.useRightHandedSystem?-1:1);o._f.FromEulerAngles(0,e,0).multiplyToRef(this._options.xrInput.xrCamera.rotationQuaternion,this._options.xrInput.xrCamera.rotationQuaternion)}}else t.teleportationState.rotating=!1;0===i.x&&0===i.y&&(t.teleportationState.blocked&&(t.teleportationState.blocked=!1,this._setTargetMeshVisibility(!1)),t.teleportationState.forward&&this._teleportForward(e.uniqueId))}))}};e.motionController?i():e.onMotionControllerInitObservable.addOnce((()=>{i()}))}else this._xrSessionManager.scene.onPointerObservable.add((i=>{i.type===Re.kD.POINTERDOWN?(t.teleportationState.forward=!0,this._currentTeleportationControllerId=t.xrController.uniqueId,t.teleportationState.baseRotation=this._options.xrInput.xrCamera.rotationQuaternion.toEulerAngles().y,t.teleportationState.currentRotation=0,Gl({timeout:this._options.timeToTeleport||3e3,contextObservable:this._xrSessionManager.onXRFrameObservable,onEnded:()=>{this._currentTeleportationControllerId===t.xrController.uniqueId&&t.teleportationState.forward&&this._teleportForward(e.uniqueId)}})):i.type===Re.kD.POINTERUP&&(t.teleportationState.forward=!1,this._currentTeleportationControllerId="")}))},this._options.teleportationTargetMesh||this._createDefaultTargetMesh(),this._floorMeshes=this._options.floorMeshes||[],this._snapToPositions=this._options.snapPositions||[],this._blockedRayColor=this._options.blockedRayColor||new a.HE(1,0,0,.75),this._setTargetMeshVisibility(!1)}get snapPointsOnly(){return!!this._options.snapPointsOnly}set snapPointsOnly(e){this._options.snapPointsOnly=e}addFloorMesh(e){this._floorMeshes.push(e)}addBlockerMesh(e){this._options.pickBlockerMeshes=this._options.pickBlockerMeshes||[],this._options.pickBlockerMeshes.push(e)}addSnapPoint(e){this._snapToPositions.push(e)}attach(){return!!super.attach()&&(this._currentTeleportationControllerId="",this._options.xrInput.controllers.forEach(this._attachController),this._addNewAttachObserver(this._options.xrInput.onControllerAddedObservable,this._attachController),this._addNewAttachObserver(this._options.xrInput.onControllerRemovedObservable,(e=>{this._detachController(e.uniqueId)})),!0)}detach(){return!!super.detach()&&(Object.keys(this._controllers).forEach((e=>{this._detachController(e)})),this._setTargetMeshVisibility(!1),this._currentTeleportationControllerId="",this._controllers={},!0)}dispose(){super.dispose(),this._options.teleportationTargetMesh&&this._options.teleportationTargetMesh.dispose(!1,!0)}removeFloorMesh(e){const t=this._floorMeshes.indexOf(e);-1!==t&&this._floorMeshes.splice(t,1)}removeBlockerMesh(e){this._options.pickBlockerMeshes=this._options.pickBlockerMeshes||[];const t=this._options.pickBlockerMeshes.indexOf(e);-1!==t&&this._options.pickBlockerMeshes.splice(t,1)}removeFloorMeshByName(e){const t=this._xrSessionManager.scene.getMeshByName(e);t&&this.removeFloorMesh(t)}removeSnapPoint(e){let t=this._snapToPositions.indexOf(e);if(-1===t)for(let i=0;i<this._snapToPositions.length;++i)if(this._snapToPositions[i].equals(e)){t=i;break}return-1!==t&&(this._snapToPositions.splice(t,1),!0)}setSelectionFeature(e){this._selectionFeature=e}_onXRFrame(e){const t=this._xrSessionManager.currentFrame,i=this._xrSessionManager.scene;if(!this.attach||!t)return;const n=this._options.teleportationTargetMesh;if(this._currentTeleportationControllerId){if(!n)return;n.rotationQuaternion=n.rotationQuaternion||new o._f;const e=this._controllers[this._currentTeleportationControllerId];if(e&&e.teleportationState.forward){o._f.RotationYawPitchRollToRef(e.teleportationState.currentRotation+e.teleportationState.baseRotation,0,0,n.rotationQuaternion);let t=!1;if(e.xrController.getWorldPointerRayToRef(this._tmpRay),this.straightRayEnabled){const n=i.pickWithRay(this._tmpRay,(e=>{if(this._options.pickBlockerMeshes&&-1!==this._options.pickBlockerMeshes.indexOf(e))return!0;const t=this._floorMeshes.indexOf(e);return-1!==t&&this._floorMeshes[t].absolutePosition.y<this._options.xrInput.xrCamera.globalPosition.y}));if(n&&n.pickedMesh&&this._options.pickBlockerMeshes&&-1!==this._options.pickBlockerMeshes.indexOf(n.pickedMesh))return e.teleportationState.blocked=!0,this._setTargetMeshVisibility(!1),void this._showParabolicPath(n);n&&n.pickedPoint&&(e.teleportationState.blocked=!1,t=!0,this._setTargetMeshPosition(n),this._setTargetMeshVisibility(!0),this._showParabolicPath(n))}if(this.parabolicRayEnabled&&!t){const n=e.xrController.pointer.rotationQuaternion.toEulerAngles().x,s=Math.PI/2-Math.abs(n)+1,r=this.parabolicCheckRadius*s;this._tmpRay.origin.addToRef(this._tmpRay.direction.scale(2*r),this._tmpVector),this._tmpVector.y=this._tmpRay.origin.y,this._tmpRay.origin.addInPlace(this._tmpRay.direction.scale(r)),this._tmpVector.subtractToRef(this._tmpRay.origin,this._tmpRay.direction),this._tmpRay.direction.normalize();const o=i.pickWithRay(this._tmpRay,(e=>!(!this._options.pickBlockerMeshes||-1===this._options.pickBlockerMeshes.indexOf(e))||-1!==this._floorMeshes.indexOf(e)));if(o&&o.pickedMesh&&this._options.pickBlockerMeshes&&-1!==this._options.pickBlockerMeshes.indexOf(o.pickedMesh))return e.teleportationState.blocked=!0,this._setTargetMeshVisibility(!1),void this._showParabolicPath(o);o&&o.pickedPoint&&(e.teleportationState.blocked=!1,t=!0,this._setTargetMeshPosition(o),this._setTargetMeshVisibility(!0),this._showParabolicPath(o))}this._setTargetMeshVisibility(t)}else this._setTargetMeshVisibility(!1)}else this._disposeBezierCurve(),this._setTargetMeshVisibility(!1)}_createDefaultTargetMesh(){this._options.defaultTargetMeshOptions=this._options.defaultTargetMeshOptions||{};const e=this._options.useUtilityLayer?this._options.customUtilityLayerScene||zn.x.DefaultUtilityLayer.utilityLayerScene:this._xrSessionManager.scene,t=(0,dn.$6)("teleportationTarget",{width:2,height:2,subdivisions:2},e);if(t.isPickable=!1,this._options.defaultTargetMeshOptions.teleportationCircleMaterial)t.material=this._options.defaultTargetMeshOptions.teleportationCircleMaterial;else{const i=512,n=new zi.c("teleportationPlaneDynamicTexture",i,e,!0);n.hasAlpha=!0;const s=n.getContext(),r=i/2,o=i/2,a=200;s.beginPath(),s.arc(r,o,a,0,2*Math.PI,!1),s.fillStyle=this._options.defaultTargetMeshOptions.teleportationFillColor||"#444444",s.fill(),s.lineWidth=10,s.strokeStyle=this._options.defaultTargetMeshOptions.teleportationBorderColor||"#FFFFFF",s.stroke(),s.closePath(),n.update();const l=new Gi.K("teleportationPlaneMaterial",e);l.diffuseTexture=n,t.material=l}const i=cn("torusTeleportation",{diameter:.75,thickness:.1,tessellation:20},e);if(i.isPickable=!1,i.parent=t,!this._options.defaultTargetMeshOptions.disableAnimation){const t=new D.f("animationInnerCircle","position.y",30,D.f.ANIMATIONTYPE_FLOAT,D.f.ANIMATIONLOOPMODE_CYCLE),n=[];n.push({frame:0,value:0}),n.push({frame:30,value:.4}),n.push({frame:60,value:0}),t.setKeys(n);const s=new ne;s.setEasingMode(j.EASINGMODE_EASEINOUT),t.setEasingFunction(s),i.animations=[],i.animations.push(t),e.beginAnimation(i,0,60,!0)}const n=an("rotationCone",{diameterTop:0,tessellation:4},e);if(n.isPickable=!1,n.scaling.set(.5,.12,.2),n.rotate(We.RD.X,Math.PI/2),n.position.z=.6,n.parent=i,this._options.defaultTargetMeshOptions.torusArrowMaterial)i.material=this._options.defaultTargetMeshOptions.torusArrowMaterial,n.material=this._options.defaultTargetMeshOptions.torusArrowMaterial;else{const t=new Gi.K("torusConsMat",e);t.disableLighting=!!this._options.defaultTargetMeshOptions.disableLighting,t.disableLighting?t.emissiveColor=new a.Wo(.3,.3,1):t.diffuseColor=new a.Wo(.3,.3,1),t.alpha=.9,i.material=t,n.material=t,this._teleportationRingMaterial=t}void 0!==this._options.renderingGroupId&&(t.renderingGroupId=this._options.renderingGroupId,i.renderingGroupId=this._options.renderingGroupId,n.renderingGroupId=this._options.renderingGroupId),this._options.teleportationTargetMesh=t,this._setTargetMeshVisibility(!1)}_detachController(e){const t=this._controllers[e];t&&(t.teleportationComponent&&(t.onAxisChangedObserver&&t.teleportationComponent.onAxisValueChangedObservable.remove(t.onAxisChangedObserver),t.onButtonChangedObserver&&t.teleportationComponent.onButtonStateChangedObservable.remove(t.onButtonChangedObserver)),delete this._controllers[e])}_findClosestSnapPointWithRadius(e,t=this._options.snapToPositionRadius||.8){let i=null,n=Number.MAX_VALUE;if(this._snapToPositions.length){const s=t*t;this._snapToPositions.forEach((t=>{const r=o.P.DistanceSquared(t,e);r<=s&&r<n&&(n=r,i=t)}))}return i}_setTargetMeshPosition(e){const t=e.pickedPoint;if(!this._options.teleportationTargetMesh||!t)return;const i=this._findClosestSnapPointWithRadius(t);this._snappedToPoint=!!i,this.snapPointsOnly&&!this._snappedToPoint&&this._teleportationRingMaterial?this._teleportationRingMaterial.diffuseColor.set(1,.3,.3):this.snapPointsOnly&&this._snappedToPoint&&this._teleportationRingMaterial&&this._teleportationRingMaterial.diffuseColor.set(.3,.3,1),this._options.teleportationTargetMesh.position.copyFrom(i||t),this._options.teleportationTargetMesh.position.y+=.01,this.onTargetMeshPositionUpdatedObservable.notifyObservers(e)}_setTargetMeshVisibility(e,t){this._options.teleportationTargetMesh&&(this._options.teleportationTargetMesh.isVisible!==e||t)&&(this._options.teleportationTargetMesh.isVisible=e,this._options.teleportationTargetMesh.getChildren(void 0,!1).forEach((t=>{t.isVisible=e})),e?this._selectionFeature&&this._selectionFeature.detach():(this._quadraticBezierCurve&&(this._quadraticBezierCurve.dispose(),this._quadraticBezierCurve=null),this._selectionFeature&&this._selectionFeature.attach()))}_disposeBezierCurve(){this._quadraticBezierCurve&&(this._quadraticBezierCurve.dispose(),this._quadraticBezierCurve=null)}_showParabolicPath(e){if(!e.pickedPoint||!this._currentTeleportationControllerId)return;const t=this._options.useUtilityLayer?this._options.customUtilityLayerScene||zn.x.DefaultUtilityLayer.utilityLayerScene:this._xrSessionManager.scene,i=this._controllers[this._currentTeleportationControllerId],n=X.j_.CreateQuadraticBezier(i.xrController.pointer.absolutePosition,e.ray.origin,e.pickedPoint,25),s=i.teleportationState.blocked?this._blockedRayColor:void 0,r=new Array(26).fill(s||this._cachedColor4White);this._options.generateRayPathMesh?this._quadraticBezierCurve=this._options.generateRayPathMesh(n.getPoints(),e):this._quadraticBezierCurve=os("teleportation path line",{points:n.getPoints(),instance:this._quadraticBezierCurve,updatable:!0,colors:r},t),this._quadraticBezierCurve.isPickable=!1,void 0!==this._options.renderingGroupId&&(this._quadraticBezierCurve.renderingGroupId=this._options.renderingGroupId)}_teleportForward(e){const t=this._controllers[e];if(t&&t.teleportationState.forward&&this.teleportationEnabled&&(t.teleportationState.forward=!1,this._currentTeleportationControllerId="",!this.snapPointsOnly||this._snappedToPoint))if(this.skipNextTeleportation)this.skipNextTeleportation=!1;else if(this._options.teleportationTargetMesh&&this._options.teleportationTargetMesh.isVisible){const e=this._options.xrInput.xrCamera.realWorldHeight;this._options.xrInput.xrCamera.onBeforeCameraTeleport.notifyObservers(this._options.xrInput.xrCamera.position),this._options.xrInput.xrCamera.position.copyFrom(this._options.teleportationTargetMesh.position),this._options.xrInput.xrCamera.position.y+=e,o._f.FromEulerAngles(0,t.teleportationState.currentRotation-(this._xrSessionManager.scene.useRightHandedSystem?Math.PI:0),0).multiplyToRef(this._options.xrInput.xrCamera.rotationQuaternion,this._options.xrInput.xrCamera.rotationQuaternion),this._options.xrInput.xrCamera.onAfterCameraTeleport.notifyObservers(this._options.xrInput.xrCamera.position)}}}Wl.Name=vl.b.TELEPORTATION,Wl.Version=1,vl.d.AddWebXRFeature(Wl.Name,((e,t)=>()=>new Wl(e,t)),Wl.Version,!0);class Hl{}class Xl{constructor(){}static CreateAsync(e,t={}){const i=new Xl;if(e.onDisposeObservable.addOnce((()=>{i.dispose()})),!t.disableDefaultUI){const n={renderTarget:i.renderTarget,...t.uiOptions||{}};t.optionalFeatures&&("boolean"==typeof t.optionalFeatures?n.optionalFeatures=["hit-test","anchors","plane-detection","hand-tracking"]:n.optionalFeatures=t.optionalFeatures),i.enterExitUI=new kl(e,n)}return yl.CreateAsync(e).then((e=>{if(i.baseExperience=e,t.ignoreNativeCameraTransformation&&(i.baseExperience.camera.compensateOnFirstFrame=!1),i.input=new Ml(e.sessionManager,e.camera,{controllerOptions:{renderingGroupId:t.renderingGroupId},...t.inputOptions||{}}),!t.disablePointerSelection){const e={...t.pointerSelectionOptions,xrInput:i.input,renderingGroupId:t.renderingGroupId};i.pointerSelection=i.baseExperience.featuresManager.enableFeature(Dl.Name,t.useStablePlugins?"stable":"latest",e),t.disableTeleportation||(i.teleportation=i.baseExperience.featuresManager.enableFeature(Wl.Name,t.useStablePlugins?"stable":"latest",{floorMeshes:t.floorMeshes,xrInput:i.input,renderingGroupId:t.renderingGroupId,...t.teleportationOptions}),i.teleportation.setSelectionFeature(i.pointerSelection))}return t.disableNearInteraction||(i.nearInteraction=i.baseExperience.featuresManager.enableFeature(Bl.Name,t.useStablePlugins?"stable":"latest",{xrInput:i.input,farInteractionFeature:i.pointerSelection,renderingGroupId:t.renderingGroupId,useUtilityLayer:!0,enableNearInteractionOnAllControllers:!0,...t.nearInteractionOptions})),i.renderTarget=i.baseExperience.sessionManager.getWebXRRenderTarget(t.outputCanvasOptions),t.disableDefaultUI?void 0:i.enterExitUI.setHelperAsync(i.baseExperience,i.renderTarget)})).then((()=>i)).catch((e=>(_.Y.Error("Error initializing XR"),_.Y.Error(e),i)))}dispose(){this.baseExperience&&this.baseExperience.dispose(),this.input&&this.input.dispose(),this.enterExitUI&&this.enterExitUI.dispose(),this.renderTarget&&this.renderTarget.dispose()}}var jl=!0;function Yl(e){for(;e.firstChild;)e.removeChild(e.firstChild);e.srcObject=null,e.src="",e.removeAttribute("src")}k.x.prototype.createDefaultLight=function(e=!1){if(e&&this.lights)for(let e=0;e<this.lights.length;e++)this.lights[e].dispose();0===this.lights.length&&new Li.e("default light",o.P.Up(),this)},k.x.prototype.createDefaultCamera=function(e=!1,t=!1,i=!1){if(t&&this.activeCamera&&(this.activeCamera.dispose(),this.activeCamera=null),!this.activeCamera){const t=this.getWorldExtends((e=>e.isVisible&&e.isEnabled())),n=t.max.subtract(t.min),s=t.min.add(n.scale(.5));let r,a=1.5*n.length();if(isFinite(a)||(a=1,s.copyFromFloats(0,0,0)),e){const e=new Ft("default camera",-Math.PI/2,Math.PI/2,a,s,this);e.lowerRadiusLimit=.01*a,e.wheelPrecision=100/a,r=e}else{const e=new Dt.c("default camera",new o.P(s.x,s.y,-a),this);e.setTarget(s),r=e}r.minZ=.01*a,r.maxZ=1e3*a,r.speed=.2*a,this.activeCamera=r,i&&r.attachControl()}},k.x.prototype.createDefaultCameraOrLight=function(e=!1,t=!1,i=!1){this.createDefaultLight(t),this.createDefaultCamera(e,t,i)},k.x.prototype.createDefaultSkybox=function(e,t=!1,i=1e3,n=0,s=!0){if(!e)return _.Y.Warn("Can not create default skybox without environment texture."),null;s&&e&&(this.environmentTexture=e);const r=(0,Yn.NR)("hdrSkyBox",{size:i},this);if(t){const t=new Ya.Y("skyBox",this);t.backFaceCulling=!1,t.reflectionTexture=e.clone(),t.reflectionTexture&&(t.reflectionTexture.coordinatesMode=Ce.x.SKYBOX_MODE),t.microSurface=1-n,t.disableLighting=!0,t.twoSidedLighting=!0,r.material=t}else{const t=new Gi.K("skyBox",this);t.backFaceCulling=!1,t.reflectionTexture=e.clone(),t.reflectionTexture&&(t.reflectionTexture.coordinatesMode=Ce.x.SKYBOX_MODE),t.disableLighting=!0,r.material=t}return r.isPickable=!1,r.infiniteDistance=!0,r.ignoreCameraMaxZ=!0,r},k.x.prototype.createDefaultEnvironment=function(e){return Ha?new Ha(e,this):null},k.x.prototype.createDefaultVRExperience=function(e={}){return new gn(this,e)},k.x.prototype.createDefaultXRExperienceAsync=function(e={}){return Xl.CreateAsync(this,e).then((e=>e))};class ql extends Ce.x{get onUserActionRequestedObservable(){return this._onUserActionRequestedObservable||(this._onUserActionRequestedObservable=new r.y$),this._onUserActionRequestedObservable}_processError(e){this._errorFound=!0,this._onError?this._onError(null==e?void 0:e.message):_.Y.Error(null==e?void 0:e.message)}_handlePlay(){this._errorFound=!1,this.video.play().catch((e=>{if("NotAllowedError"===(null==e?void 0:e.name)){if(this._onUserActionRequestedObservable&&this._onUserActionRequestedObservable.hasObservers())return void this._onUserActionRequestedObservable.notifyObservers(this);if(!this.video.muted)return _.Y.Warn("Unable to autoplay a video with sound. Trying again with muted turned true"),this.video.muted=!0,this._errorFound=!1,void this.video.play().catch((e=>{this._processError(e)}))}this._processError(e)}))}constructor(e,t,i,n=!1,s=!1,r=Ce.x.TRILINEAR_SAMPLINGMODE,o={},a,l=5){var h,c;super(null,i,!n,s),this._onUserActionRequestedObservable=null,this._stillImageCaptured=!1,this._displayingPosterTexture=!1,this._frameId=-1,this._currentSrc=null,this._errorFound=!1,this._resizeInternalTexture=()=>{var e;null!=this._texture&&this._texture.dispose(),!this._getEngine().needPOTTextures||de.w1.IsExponentOfTwo(this.video.videoWidth)&&de.w1.IsExponentOfTwo(this.video.videoHeight)?(this.wrapU=Ce.x.WRAP_ADDRESSMODE,this.wrapV=Ce.x.WRAP_ADDRESSMODE):(this.wrapU=Ce.x.CLAMP_ADDRESSMODE,this.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._generateMipMaps=!1),this._texture=this._getEngine().createDynamicTexture(this.video.videoWidth,this.video.videoHeight,this._generateMipMaps,this.samplingMode),this._texture.format=null!==(e=this._format)&&void 0!==e?e:5,this._frameId=-1,this._updateInternalTexture()},this._createInternalTexture=()=>{if(null!=this._texture){if(!this._displayingPosterTexture)return;this._displayingPosterTexture=!1}if(this.video.addEventListener("resize",this._resizeInternalTexture),this._resizeInternalTexture(),this.video.autoplay||this._settings.poster||this._settings.independentVideoSource)this._updateInternalTexture(),this.onLoadObservable.hasObservers()&&this.onLoadObservable.notifyObservers(this);else{const e=this.video.onplaying,t=this.video.muted;this.video.muted=!0,this.video.onplaying=()=>{this.video.muted=t,this.video.onplaying=e,this._updateInternalTexture(),this._errorFound||this.video.pause(),this.onLoadObservable.hasObservers()&&this.onLoadObservable.notifyObservers(this)},this._handlePlay()}},this._reset=()=>{null!=this._texture&&(this._displayingPosterTexture||(this._texture.dispose(),this._texture=null))},this._updateInternalTexture=()=>{if(null==this._texture)return;if(this.video.readyState<this.video.HAVE_CURRENT_DATA)return;if(this._displayingPosterTexture)return;const e=this.getScene().getFrameId();this._frameId!==e&&(this._frameId=e,this._getEngine().updateVideoTexture(this._texture,this._externalTexture?this._externalTexture:this.video,this._invertY))},this._settings={autoPlay:!0,loop:!0,autoUpdateTexture:!0,...o},this._onError=a,this._generateMipMaps=n,this._initialSamplingMode=r,this.autoUpdateTexture=this._settings.autoUpdateTexture,this._currentSrc=t,this.name=e||this._getName(t),this.video=this._getVideo(t),this._externalTexture=null!==(c=null===(h=this._engine)||void 0===h?void 0:h.createExternalTexture(this.video))&&void 0!==c?c:null,this._settings.independentVideoSource||(this._settings.poster&&(this.video.poster=this._settings.poster),void 0!==this._settings.autoPlay&&(this.video.autoplay=this._settings.autoPlay),void 0!==this._settings.loop&&(this.video.loop=this._settings.loop),void 0!==this._settings.muted&&(this.video.muted=this._settings.muted),this.video.setAttribute("playsinline",""),this.video.addEventListener("paused",this._updateInternalTexture),this.video.addEventListener("seeked",this._updateInternalTexture),this.video.addEventListener("emptied",this._reset),this._settings.autoPlay&&this._handlePlay()),this._createInternalTextureOnEvent=this._settings.poster&&!this._settings.autoPlay?"play":"canplay",this.video.addEventListener(this._createInternalTextureOnEvent,this._createInternalTexture),this._format=l;const u=this.video.readyState>=this.video.HAVE_CURRENT_DATA;!this._settings.poster||this._settings.autoPlay&&u?u&&this._createInternalTexture():(this._texture=this._getEngine().createTexture(this._settings.poster,!1,!this.invertY,i),this._displayingPosterTexture=!0)}getClassName(){return"VideoTexture"}_getName(e){return e instanceof HTMLVideoElement?e.currentSrc:"object"==typeof e?e.toString():e}_getVideo(e){if(e.isNative)return e;if(e instanceof HTMLVideoElement)return de.w1.SetCorsBehavior(e.currentSrc,e),e;const t=document.createElement("video");return"string"==typeof e?(de.w1.SetCorsBehavior(e,t),t.src=e):(de.w1.SetCorsBehavior(e[0],t),e.forEach((e=>{const i=document.createElement("source");i.src=e,t.appendChild(i)}))),this.onDisposeObservable.addOnce((()=>{Yl(t)})),t}_rebuild(){this.update()}update(){this.autoUpdateTexture&&this.updateTexture(!0)}updateTexture(e){e&&(this.video.paused&&this._stillImageCaptured||(this._stillImageCaptured=!0,this._updateInternalTexture()))}updateURL(e){this.video.src=e,this._currentSrc=e}clone(){return new ql(this.name,this._currentSrc,this.getScene(),this._generateMipMaps,this.invertY,this.samplingMode,this._settings)}dispose(){var e;super.dispose(),this._currentSrc=null,this._onUserActionRequestedObservable&&(this._onUserActionRequestedObservable.clear(),this._onUserActionRequestedObservable=null),this.video.removeEventListener(this._createInternalTextureOnEvent,this._createInternalTexture),this._settings.independentVideoSource||(this.video.removeEventListener("paused",this._updateInternalTexture),this.video.removeEventListener("seeked",this._updateInternalTexture),this.video.removeEventListener("emptied",this._reset),this.video.removeEventListener("resize",this._resizeInternalTexture),this.video.pause()),null===(e=this._externalTexture)||void 0===e||e.dispose()}static CreateFromStreamAsync(e,t,i,n=!0){const s=e.getEngine().createVideoElement(i);return e.getEngine()._badOS&&(document.body.appendChild(s),s.style.transform="scale(0.0001, 0.0001)",s.style.opacity="0",s.style.position="fixed",s.style.bottom="0px",s.style.right="0px"),s.setAttribute("autoplay",""),s.setAttribute("muted","true"),s.setAttribute("playsinline",""),s.muted=!0,s.isNative||(void 0!==s.mozSrcObject?s.mozSrcObject=t:"object"==typeof s.srcObject?s.srcObject=t:s.src=window.URL&&window.URL.createObjectURL(t)),new Promise((t=>{const i=()=>{const r=new ql("video",s,e,!0,n,void 0,void 0,void 0,4);e.getEngine()._badOS&&r.onDisposeObservable.addOnce((()=>{s.remove()})),r.onDisposeObservable.addOnce((()=>{Yl(s)})),t(r),s.removeEventListener("playing",i)};s.addEventListener("playing",i),s.play()}))}static async CreateFromWebCamAsync(e,t,i=!1,n=!0){if(navigator.mediaDevices){const s=await navigator.mediaDevices.getUserMedia({video:t,audio:i}),r=await this.CreateFromStreamAsync(e,s,t,n);return r.onDisposeObservable.addOnce((()=>{s.getTracks().forEach((e=>{e.stop()}))})),r}return Promise.reject("No support for userMedia on this device")}static CreateFromWebCam(e,t,i,n=!1,s=!0){this.CreateFromWebCamAsync(e,i,n,s).then((function(e){t&&t(e)})).catch((function(e){_.Y.Error(e.name)}))}}class Kl extends Xa{get videoTexture(){return this._texture}get videoMode(){return this.textureMode}set videoMode(e){this.textureMode=e}_initTexture(e,t,i){const n={loop:i.loop,autoPlay:i.autoPlay,autoUpdateTexture:!0,poster:i.poster},s=new ql((this.name||"videoDome")+"_texture",e,t,i.generateMipMaps,this._useDirectMapping,Ce.x.TRILINEAR_SAMPLINGMODE,n);return i.clickToPlay&&(this._pointerObserver=t.onPointerObservable.add((e=>{var t;(null===(t=e.pickInfo)||void 0===t?void 0:t.pickedMesh)===this.mesh&&this._texture.video.play()}),Re.kD.POINTERDOWN)),this._textureObserver=s.onLoadObservable.add((()=>{this.onLoadObservable.notifyObservers()})),s}dispose(e,t=!1){this._texture.onLoadObservable.remove(this._textureObserver),this._scene.onPointerObservable.remove(this._pointerObserver),super.dispose(e,t)}}Kl.MODE_MONOSCOPIC=Xa.MODE_MONOSCOPIC,Kl.MODE_TOPBOTTOM=Xa.MODE_TOPBOTTOM,Kl.MODE_SIDEBYSIDE=Xa.MODE_SIDEBYSIDE;class $l{get gpuFrameTimeCounter(){return this.engine.getGPUFrameTimeCounter()}get captureGPUFrameTime(){return this._captureGPUFrameTime}set captureGPUFrameTime(e){e!==this._captureGPUFrameTime&&(this._captureGPUFrameTime=e,this.engine.captureGPUFrameTime(e))}get shaderCompilationTimeCounter(){return this._shaderCompilationTime}get captureShaderCompilationTime(){return this._captureShaderCompilationTime}set captureShaderCompilationTime(e){e!==this._captureShaderCompilationTime&&(this._captureShaderCompilationTime=e,e?(this._onBeforeShaderCompilationObserver=this.engine.onBeforeShaderCompilationObservable.add((()=>{this._shaderCompilationTime.fetchNewFrame(),this._shaderCompilationTime.beginMonitoring()})),this._onAfterShaderCompilationObserver=this.engine.onAfterShaderCompilationObservable.add((()=>{this._shaderCompilationTime.endMonitoring()}))):(this.engine.onBeforeShaderCompilationObservable.remove(this._onBeforeShaderCompilationObserver),this._onBeforeShaderCompilationObserver=null,this.engine.onAfterShaderCompilationObservable.remove(this._onAfterShaderCompilationObserver),this._onAfterShaderCompilationObserver=null))}constructor(e){this.engine=e,this._captureGPUFrameTime=!1,this._captureShaderCompilationTime=!1,this._shaderCompilationTime=new Os.z,this._onBeginFrameObserver=null,this._onEndFrameObserver=null,this._onBeforeShaderCompilationObserver=null,this._onAfterShaderCompilationObserver=null}dispose(){this.engine.onBeginFrameObservable.remove(this._onBeginFrameObserver),this._onBeginFrameObserver=null,this.engine.onEndFrameObservable.remove(this._onEndFrameObserver),this._onEndFrameObserver=null,this.engine.onBeforeShaderCompilationObservable.remove(this._onBeforeShaderCompilationObserver),this._onBeforeShaderCompilationObserver=null,this.engine.onAfterShaderCompilationObservable.remove(this._onAfterShaderCompilationObserver),this._onAfterShaderCompilationObserver=null,this.engine=null}}class Ql{get activeMeshesEvaluationTimeCounter(){return this._activeMeshesEvaluationTime}get captureActiveMeshesEvaluationTime(){return this._captureActiveMeshesEvaluationTime}set captureActiveMeshesEvaluationTime(e){e!==this._captureActiveMeshesEvaluationTime&&(this._captureActiveMeshesEvaluationTime=e,e?(this._onBeforeActiveMeshesEvaluationObserver=this.scene.onBeforeActiveMeshesEvaluationObservable.add((()=>{de.w1.StartPerformanceCounter("Active meshes evaluation"),this._activeMeshesEvaluationTime.beginMonitoring()})),this._onAfterActiveMeshesEvaluationObserver=this.scene.onAfterActiveMeshesEvaluationObservable.add((()=>{de.w1.EndPerformanceCounter("Active meshes evaluation"),this._activeMeshesEvaluationTime.endMonitoring()}))):(this.scene.onBeforeActiveMeshesEvaluationObservable.remove(this._onBeforeActiveMeshesEvaluationObserver),this._onBeforeActiveMeshesEvaluationObserver=null,this.scene.onAfterActiveMeshesEvaluationObservable.remove(this._onAfterActiveMeshesEvaluationObserver),this._onAfterActiveMeshesEvaluationObserver=null))}get renderTargetsRenderTimeCounter(){return this._renderTargetsRenderTime}get captureRenderTargetsRenderTime(){return this._captureRenderTargetsRenderTime}set captureRenderTargetsRenderTime(e){e!==this._captureRenderTargetsRenderTime&&(this._captureRenderTargetsRenderTime=e,e?(this._onBeforeRenderTargetsRenderObserver=this.scene.onBeforeRenderTargetsRenderObservable.add((()=>{de.w1.StartPerformanceCounter("Render targets rendering"),this._renderTargetsRenderTime.beginMonitoring()})),this._onAfterRenderTargetsRenderObserver=this.scene.onAfterRenderTargetsRenderObservable.add((()=>{de.w1.EndPerformanceCounter("Render targets rendering"),this._renderTargetsRenderTime.endMonitoring(!1)}))):(this.scene.onBeforeRenderTargetsRenderObservable.remove(this._onBeforeRenderTargetsRenderObserver),this._onBeforeRenderTargetsRenderObserver=null,this.scene.onAfterRenderTargetsRenderObservable.remove(this._onAfterRenderTargetsRenderObserver),this._onAfterRenderTargetsRenderObserver=null))}get particlesRenderTimeCounter(){return this._particlesRenderTime}get captureParticlesRenderTime(){return this._captureParticlesRenderTime}set captureParticlesRenderTime(e){e!==this._captureParticlesRenderTime&&(this._captureParticlesRenderTime=e,e?(this._onBeforeParticlesRenderingObserver=this.scene.onBeforeParticlesRenderingObservable.add((()=>{de.w1.StartPerformanceCounter("Particles"),this._particlesRenderTime.beginMonitoring()})),this._onAfterParticlesRenderingObserver=this.scene.onAfterParticlesRenderingObservable.add((()=>{de.w1.EndPerformanceCounter("Particles"),this._particlesRenderTime.endMonitoring(!1)}))):(this.scene.onBeforeParticlesRenderingObservable.remove(this._onBeforeParticlesRenderingObserver),this._onBeforeParticlesRenderingObserver=null,this.scene.onAfterParticlesRenderingObservable.remove(this._onAfterParticlesRenderingObserver),this._onAfterParticlesRenderingObserver=null))}get spritesRenderTimeCounter(){return this._spritesRenderTime}get captureSpritesRenderTime(){return this._captureSpritesRenderTime}set captureSpritesRenderTime(e){e!==this._captureSpritesRenderTime&&(this._captureSpritesRenderTime=e,this.scene.spriteManagers&&(e?(this._onBeforeSpritesRenderingObserver=this.scene.onBeforeSpritesRenderingObservable.add((()=>{de.w1.StartPerformanceCounter("Sprites"),this._spritesRenderTime.beginMonitoring()})),this._onAfterSpritesRenderingObserver=this.scene.onAfterSpritesRenderingObservable.add((()=>{de.w1.EndPerformanceCounter("Sprites"),this._spritesRenderTime.endMonitoring(!1)}))):(this.scene.onBeforeSpritesRenderingObservable.remove(this._onBeforeSpritesRenderingObserver),this._onBeforeSpritesRenderingObserver=null,this.scene.onAfterSpritesRenderingObservable.remove(this._onAfterSpritesRenderingObserver),this._onAfterSpritesRenderingObserver=null)))}get physicsTimeCounter(){return this._physicsTime}get capturePhysicsTime(){return this._capturePhysicsTime}set capturePhysicsTime(e){e!==this._capturePhysicsTime&&this.scene.onBeforePhysicsObservable&&(this._capturePhysicsTime=e,e?(this._onBeforePhysicsObserver=this.scene.onBeforePhysicsObservable.add((()=>{de.w1.StartPerformanceCounter("Physics"),this._physicsTime.beginMonitoring()})),this._onAfterPhysicsObserver=this.scene.onAfterPhysicsObservable.add((()=>{de.w1.EndPerformanceCounter("Physics"),this._physicsTime.endMonitoring()}))):(this.scene.onBeforePhysicsObservable.remove(this._onBeforePhysicsObserver),this._onBeforePhysicsObserver=null,this.scene.onAfterPhysicsObservable.remove(this._onAfterPhysicsObserver),this._onAfterPhysicsObserver=null))}get animationsTimeCounter(){return this._animationsTime}get captureAnimationsTime(){return this._captureAnimationsTime}set captureAnimationsTime(e){e!==this._captureAnimationsTime&&(this._captureAnimationsTime=e,e?this._onAfterAnimationsObserver=this.scene.onAfterAnimationsObservable.add((()=>{this._animationsTime.endMonitoring()})):(this.scene.onAfterAnimationsObservable.remove(this._onAfterAnimationsObserver),this._onAfterAnimationsObserver=null))}get frameTimeCounter(){return this._frameTime}get captureFrameTime(){return this._captureFrameTime}set captureFrameTime(e){this._captureFrameTime=e}get interFrameTimeCounter(){return this._interFrameTime}get captureInterFrameTime(){return this._captureInterFrameTime}set captureInterFrameTime(e){this._captureInterFrameTime=e}get renderTimeCounter(){return this._renderTime}get captureRenderTime(){return this._captureRenderTime}set captureRenderTime(e){e!==this._captureRenderTime&&(this._captureRenderTime=e,e?(this._onBeforeDrawPhaseObserver=this.scene.onBeforeDrawPhaseObservable.add((()=>{this._renderTime.beginMonitoring(),de.w1.StartPerformanceCounter("Main render")})),this._onAfterDrawPhaseObserver=this.scene.onAfterDrawPhaseObservable.add((()=>{this._renderTime.endMonitoring(!1),de.w1.EndPerformanceCounter("Main render")}))):(this.scene.onBeforeDrawPhaseObservable.remove(this._onBeforeDrawPhaseObserver),this._onBeforeDrawPhaseObserver=null,this.scene.onAfterDrawPhaseObservable.remove(this._onAfterDrawPhaseObserver),this._onAfterDrawPhaseObserver=null))}get cameraRenderTimeCounter(){return this._cameraRenderTime}get captureCameraRenderTime(){return this._captureCameraRenderTime}set captureCameraRenderTime(e){e!==this._captureCameraRenderTime&&(this._captureCameraRenderTime=e,e?(this._onBeforeCameraRenderObserver=this.scene.onBeforeCameraRenderObservable.add((e=>{this._cameraRenderTime.beginMonitoring(),de.w1.StartPerformanceCounter(`Rendering camera ${e.name}`)})),this._onAfterCameraRenderObserver=this.scene.onAfterCameraRenderObservable.add((e=>{this._cameraRenderTime.endMonitoring(!1),de.w1.EndPerformanceCounter(`Rendering camera ${e.name}`)}))):(this.scene.onBeforeCameraRenderObservable.remove(this._onBeforeCameraRenderObserver),this._onBeforeCameraRenderObserver=null,this.scene.onAfterCameraRenderObservable.remove(this._onAfterCameraRenderObserver),this._onAfterCameraRenderObserver=null))}get drawCallsCounter(){return this.scene.getEngine()._drawCalls}constructor(e){this.scene=e,this._captureActiveMeshesEvaluationTime=!1,this._activeMeshesEvaluationTime=new Os.z,this._captureRenderTargetsRenderTime=!1,this._renderTargetsRenderTime=new Os.z,this._captureFrameTime=!1,this._frameTime=new Os.z,this._captureRenderTime=!1,this._renderTime=new Os.z,this._captureInterFrameTime=!1,this._interFrameTime=new Os.z,this._captureParticlesRenderTime=!1,this._particlesRenderTime=new Os.z,this._captureSpritesRenderTime=!1,this._spritesRenderTime=new Os.z,this._capturePhysicsTime=!1,this._physicsTime=new Os.z,this._captureAnimationsTime=!1,this._animationsTime=new Os.z,this._captureCameraRenderTime=!1,this._cameraRenderTime=new Os.z,this._onBeforeActiveMeshesEvaluationObserver=null,this._onAfterActiveMeshesEvaluationObserver=null,this._onBeforeRenderTargetsRenderObserver=null,this._onAfterRenderTargetsRenderObserver=null,this._onAfterRenderObserver=null,this._onBeforeDrawPhaseObserver=null,this._onAfterDrawPhaseObserver=null,this._onBeforeAnimationsObserver=null,this._onBeforeParticlesRenderingObserver=null,this._onAfterParticlesRenderingObserver=null,this._onBeforeSpritesRenderingObserver=null,this._onAfterSpritesRenderingObserver=null,this._onBeforePhysicsObserver=null,this._onAfterPhysicsObserver=null,this._onAfterAnimationsObserver=null,this._onBeforeCameraRenderObserver=null,this._onAfterCameraRenderObserver=null,this._onBeforeAnimationsObserver=e.onBeforeAnimationsObservable.add((()=>{this._captureActiveMeshesEvaluationTime&&this._activeMeshesEvaluationTime.fetchNewFrame(),this._captureRenderTargetsRenderTime&&this._renderTargetsRenderTime.fetchNewFrame(),this._captureFrameTime&&(de.w1.StartPerformanceCounter("Scene rendering"),this._frameTime.beginMonitoring()),this._captureInterFrameTime&&this._interFrameTime.endMonitoring(),this._captureParticlesRenderTime&&this._particlesRenderTime.fetchNewFrame(),this._captureSpritesRenderTime&&this._spritesRenderTime.fetchNewFrame(),this._captureAnimationsTime&&this._animationsTime.beginMonitoring(),this.scene.getEngine()._drawCalls.fetchNewFrame()})),this._onAfterRenderObserver=e.onAfterRenderObservable.add((()=>{this._captureFrameTime&&(de.w1.EndPerformanceCounter("Scene rendering"),this._frameTime.endMonitoring()),this._captureRenderTime&&this._renderTime.endMonitoring(!1),this._captureInterFrameTime&&this._interFrameTime.beginMonitoring()}))}dispose(){this.scene.onAfterRenderObservable.remove(this._onAfterRenderObserver),this._onAfterRenderObserver=null,this.scene.onBeforeActiveMeshesEvaluationObservable.remove(this._onBeforeActiveMeshesEvaluationObserver),this._onBeforeActiveMeshesEvaluationObserver=null,this.scene.onAfterActiveMeshesEvaluationObservable.remove(this._onAfterActiveMeshesEvaluationObserver),this._onAfterActiveMeshesEvaluationObserver=null,this.scene.onBeforeRenderTargetsRenderObservable.remove(this._onBeforeRenderTargetsRenderObserver),this._onBeforeRenderTargetsRenderObserver=null,this.scene.onAfterRenderTargetsRenderObservable.remove(this._onAfterRenderTargetsRenderObserver),this._onAfterRenderTargetsRenderObserver=null,this.scene.onBeforeAnimationsObservable.remove(this._onBeforeAnimationsObserver),this._onBeforeAnimationsObserver=null,this.scene.onBeforeParticlesRenderingObservable.remove(this._onBeforeParticlesRenderingObserver),this._onBeforeParticlesRenderingObserver=null,this.scene.onAfterParticlesRenderingObservable.remove(this._onAfterParticlesRenderingObserver),this._onAfterParticlesRenderingObserver=null,this._onBeforeSpritesRenderingObserver&&(this.scene.onBeforeSpritesRenderingObservable.remove(this._onBeforeSpritesRenderingObserver),this._onBeforeSpritesRenderingObserver=null),this._onAfterSpritesRenderingObserver&&(this.scene.onAfterSpritesRenderingObservable.remove(this._onAfterSpritesRenderingObserver),this._onAfterSpritesRenderingObserver=null),this.scene.onBeforeDrawPhaseObservable.remove(this._onBeforeDrawPhaseObserver),this._onBeforeDrawPhaseObserver=null,this.scene.onAfterDrawPhaseObservable.remove(this._onAfterDrawPhaseObserver),this._onAfterDrawPhaseObserver=null,this._onBeforePhysicsObserver&&(this.scene.onBeforePhysicsObservable.remove(this._onBeforePhysicsObserver),this._onBeforePhysicsObserver=null),this._onAfterPhysicsObserver&&(this.scene.onAfterPhysicsObservable.remove(this._onAfterPhysicsObserver),this._onAfterPhysicsObserver=null),this.scene.onAfterAnimationsObservable.remove(this._onAfterAnimationsObserver),this._onAfterAnimationsObserver=null,this.scene.onBeforeCameraRenderObservable.remove(this._onBeforeCameraRenderObserver),this._onBeforeCameraRenderObserver=null,this.scene.onAfterCameraRenderObservable.remove(this._onAfterCameraRenderObserver),this._onAfterCameraRenderObserver=null,this.scene=null}}si.v.ShadersStore.glowMapGenerationPixelShader="#if defined(DIFFUSE_ISLINEAR) || defined(EMISSIVE_ISLINEAR)\n#include<helperFunctions>\n#endif\n#ifdef DIFFUSE\nvarying vec2 vUVDiffuse;\nuniform sampler2D diffuseSampler;\n#endif\n#ifdef OPACITY\nvarying vec2 vUVOpacity;\nuniform sampler2D opacitySampler;\nuniform float opacityIntensity;\n#endif\n#ifdef EMISSIVE\nvarying vec2 vUVEmissive;\nuniform sampler2D emissiveSampler;\n#endif\n#ifdef VERTEXALPHA\nvarying vec4 vColor;\n#endif\nuniform vec4 glowColor;\nuniform float glowIntensity;\n#include<clipPlaneFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\n#include<clipPlaneFragment>\nvec4 finalColor=glowColor;\n#ifdef DIFFUSE\nvec4 albedoTexture=texture2D(diffuseSampler,vUVDiffuse);\n#ifdef DIFFUSE_ISLINEAR\nalbedoTexture=toGammaSpace(albedoTexture);\n#endif\n#ifdef GLOW\nfinalColor.a*=albedoTexture.a;\n#endif\n#ifdef HIGHLIGHT\nfinalColor.a=albedoTexture.a;\n#endif\n#endif\n#ifdef OPACITY\nvec4 opacityMap=texture2D(opacitySampler,vUVOpacity);\n#ifdef OPACITYRGB\nfinalColor.a*=getLuminance(opacityMap.rgb);\n#else\nfinalColor.a*=opacityMap.a;\n#endif\nfinalColor.a*=opacityIntensity;\n#endif\n#ifdef VERTEXALPHA\nfinalColor.a*=vColor.a;\n#endif\n#ifdef ALPHATEST\nif (finalColor.a<ALPHATESTVALUE)\ndiscard;\n#endif\n#ifdef EMISSIVE\nvec4 emissive=texture2D(emissiveSampler,vUVEmissive);\n#ifdef EMISSIVE_ISLINEAR\nemissive=toGammaSpace(emissive);\n#endif\ngl_FragColor=emissive*finalColor*glowIntensity;\n#else\ngl_FragColor=finalColor;\n#endif\n#ifdef HIGHLIGHT\ngl_FragColor.a=glowColor.a;\n#endif\n}",i(9901),i(8073),i(6757),i(9085);si.v.ShadersStore.glowMapGenerationVertexShader="attribute vec3 position;\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<morphTargetsVertexGlobalDeclaration>\n#include<morphTargetsVertexDeclaration>[0..maxSimultaneousMorphTargets]\n#include<clipPlaneVertexDeclaration>\n#include<instancesDeclaration>\nuniform mat4 viewProjection;\nvarying vec4 vPosition;\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef DIFFUSE\nvarying vec2 vUVDiffuse;\nuniform mat4 diffuseMatrix;\n#endif\n#ifdef OPACITY\nvarying vec2 vUVOpacity;\nuniform mat4 opacityMatrix;\n#endif\n#ifdef EMISSIVE\nvarying vec2 vUVEmissive;\nuniform mat4 emissiveMatrix;\n#endif\n#ifdef VERTEXALPHA\nattribute vec4 color;\nvarying vec4 vColor;\n#endif\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void)\n{\nvec3 positionUpdated=position;\n#ifdef UV1\nvec2 uvUpdated=uv;\n#endif\n#include<morphTargetsVertexGlobal>\n#include<morphTargetsVertex>[0..maxSimultaneousMorphTargets]\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(positionUpdated,1.0);\n#ifdef CUBEMAP\nvPosition=worldPos;\ngl_Position=viewProjection*finalWorld*vec4(position,1.0);\n#else\nvPosition=viewProjection*worldPos;\ngl_Position=vPosition;\n#endif\n#ifdef DIFFUSE\n#ifdef DIFFUSEUV1\nvUVDiffuse=vec2(diffuseMatrix*vec4(uvUpdated,1.0,0.0));\n#endif\n#ifdef DIFFUSEUV2\nvUVDiffuse=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));\n#endif\n#endif\n#ifdef OPACITY\n#ifdef OPACITYUV1\nvUVOpacity=vec2(opacityMatrix*vec4(uvUpdated,1.0,0.0));\n#endif\n#ifdef OPACITYUV2\nvUVOpacity=vec2(opacityMatrix*vec4(uv2,1.0,0.0));\n#endif\n#endif\n#ifdef EMISSIVE\n#ifdef EMISSIVEUV1\nvUVEmissive=vec2(emissiveMatrix*vec4(uvUpdated,1.0,0.0));\n#endif\n#ifdef EMISSIVEUV2\nvUVEmissive=vec2(emissiveMatrix*vec4(uv2,1.0,0.0));\n#endif\n#endif\n#ifdef VERTEXALPHA\nvColor=color;\n#endif\n#include<clipPlaneVertex>\n}";var Zl=i(4934);class Jl{get camera(){return this._effectLayerOptions.camera}get renderingGroupId(){return this._effectLayerOptions.renderingGroupId}set renderingGroupId(e){this._effectLayerOptions.renderingGroupId=e}get mainTexture(){return this._mainTexture}setMaterialForRendering(e,t){if(this._mainTexture.setMaterialForRendering(e,t),Array.isArray(e))for(let i=0;i<e.length;++i){const n=e[i];t?this._materialForRendering[n.uniqueId]=[n,t]:delete this._materialForRendering[n.uniqueId]}else t?this._materialForRendering[e.uniqueId]=[e,t]:delete this._materialForRendering[e.uniqueId]}getEffectIntensity(e){var t;return null!==(t=this._effectIntensity[e.uniqueId])&&void 0!==t?t:1}setEffectIntensity(e,t){this._effectIntensity[e.uniqueId]=t}constructor(e,t){this._vertexBuffers={},this._maxSize=0,this._mainTextureDesiredSize={width:0,height:0},this._shouldRender=!0,this._postProcesses=[],this._textures=[],this._emissiveTextureAndColor={texture:null,color:new a.HE},this._effectIntensity={},this.neutralColor=new a.HE,this.isEnabled=!0,this.disableBoundingBoxesFromEffectLayer=!1,this.onDisposeObservable=new r.y$,this.onBeforeRenderMainTextureObservable=new r.y$,this.onBeforeComposeObservable=new r.y$,this.onBeforeRenderMeshToEffect=new r.y$,this.onAfterRenderMeshToEffect=new r.y$,this.onAfterComposeObservable=new r.y$,this.onSizeChangedObservable=new r.y$,this._materialForRendering={},this.name=e,this._scene=t||A.l.LastCreatedScene,Jl._SceneComponentInitialization(this._scene),this._engine=this._scene.getEngine(),this._maxSize=this._engine.getCaps().maxTextureSize,this._scene.effectLayers.push(this),this._mergeDrawWrapper=[],this._generateIndexBuffer(),this._generateVertexBuffer()}_numInternalDraws(){return 1}_init(e){this._effectLayerOptions={mainTextureRatio:.5,alphaBlendingMode:2,camera:null,renderingGroupId:-1,mainTextureType:0,...e},this._setMainTextureSize(),this._createMainTexture(),this._createTextureAndPostProcesses()}_generateIndexBuffer(){const e=[];e.push(0),e.push(1),e.push(2),e.push(0),e.push(2),e.push(3),this._indexBuffer=this._engine.createIndexBuffer(e)}_generateVertexBuffer(){const e=[];e.push(1,1),e.push(-1,1),e.push(-1,-1),e.push(1,-1);const t=new qe.o(this._engine,e,qe.o.PositionKind,!1,!1,2);this._vertexBuffers[qe.o.PositionKind]=t}_setMainTextureSize(){this._effectLayerOptions.mainTextureFixedSize?(this._mainTextureDesiredSize.width=this._effectLayerOptions.mainTextureFixedSize,this._mainTextureDesiredSize.height=this._effectLayerOptions.mainTextureFixedSize):(this._mainTextureDesiredSize.width=this._engine.getRenderWidth()*this._effectLayerOptions.mainTextureRatio,this._mainTextureDesiredSize.height=this._engine.getRenderHeight()*this._effectLayerOptions.mainTextureRatio,this._mainTextureDesiredSize.width=this._engine.needPOTTextures?ue.D.GetExponentOfTwo(this._mainTextureDesiredSize.width,this._maxSize):this._mainTextureDesiredSize.width,this._mainTextureDesiredSize.height=this._engine.needPOTTextures?ue.D.GetExponentOfTwo(this._mainTextureDesiredSize.height,this._maxSize):this._mainTextureDesiredSize.height),this._mainTextureDesiredSize.width=Math.floor(this._mainTextureDesiredSize.width),this._mainTextureDesiredSize.height=Math.floor(this._mainTextureDesiredSize.height)}_createMainTexture(){this._mainTexture=new Ai._("EffectLayerMainRTT",{width:this._mainTextureDesiredSize.width,height:this._mainTextureDesiredSize.height},this._scene,!1,!0,this._effectLayerOptions.mainTextureType),this._mainTexture.activeCamera=this._effectLayerOptions.camera,this._mainTexture.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._mainTexture.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._mainTexture.anisotropicFilteringLevel=1,this._mainTexture.updateSamplingMode(Ce.x.BILINEAR_SAMPLINGMODE),this._mainTexture.renderParticles=!1,this._mainTexture.renderList=null,this._mainTexture.ignoreCameraViewport=!0;for(const e in this._materialForRendering){const[t,i]=this._materialForRendering[e];this._mainTexture.setMaterialForRendering(t,i)}if(this._mainTexture.customIsReadyFunction=(e,t,i)=>{if((i||0===t)&&e.subMeshes)for(let t=0;t<e.subMeshes.length;++t){const i=e.subMeshes[t],n=i.getMaterial(),s=i.getRenderingMesh();if(!n)continue;const r=s._getInstancesRenderList(i._id,!!i.getReplacementMesh()).hardwareInstancedRendering[i._id]||s.hasThinInstances;if(this._setEmissiveTextureAndColor(s,i,n),!this._isReady(i,r,this._emissiveTextureAndColor.texture))return!1}return!0},this._mainTexture.customRenderFunction=(e,t,i,n)=>{let s;this.onBeforeRenderMainTextureObservable.notifyObservers(this);const r=this._scene.getEngine();if(n.length){for(r.setColorWrite(!1),s=0;s<n.length;s++)this._renderSubMesh(n.data[s]);r.setColorWrite(!0)}for(s=0;s<e.length;s++)this._renderSubMesh(e.data[s]);for(s=0;s<t.length;s++)this._renderSubMesh(t.data[s]);const o=r.getAlphaMode();for(s=0;s<i.length;s++)this._renderSubMesh(i.data[s],!0);r.setAlphaMode(o)},this._mainTexture.onClearObservable.add((e=>{e.clear(this.neutralColor,!0,!0,!0)})),this._scene.getBoundingBoxRenderer){const e=this._scene.getBoundingBoxRenderer().enabled;this._mainTexture.onBeforeBindObservable.add((()=>{this._scene.getBoundingBoxRenderer().enabled=!this.disableBoundingBoxesFromEffectLayer&&e})),this._mainTexture.onAfterUnbindObservable.add((()=>{this._scene.getBoundingBoxRenderer().enabled=e}))}}_addCustomEffectDefines(e){}_isReady(e,t,i){var n;const s=this._scene.getEngine(),r=e.getMesh(),o=null===(n=r._internalAbstractMeshDataInfo._materialForRenderPass)||void 0===n?void 0:n[s.currentRenderPassId];if(o)return o.isReadyForSubMesh(r,e,t);const a=e.getMaterial();if(!a)return!1;if(this._useMeshMaterial(e.getRenderingMesh()))return a.isReadyForSubMesh(e.getMesh(),e,t);const l=[],h=[qe.o.PositionKind];let c=!1,u=!1;if(a){const e=a.needAlphaTesting(),t=a.getAlphaTestTexture(),i=t&&t.hasAlpha&&(a.useAlphaFromDiffuseTexture||a._useAlphaFromAlbedoTexture);t&&(e||i)&&(l.push("#define DIFFUSE"),r.isVerticesDataPresent(qe.o.UV2Kind)&&1===t.coordinatesIndex?(l.push("#define DIFFUSEUV2"),u=!0):r.isVerticesDataPresent(qe.o.UVKind)&&(l.push("#define DIFFUSEUV1"),c=!0),e&&(l.push("#define ALPHATEST"),l.push("#define ALPHATESTVALUE 0.4")),t.gammaSpace||l.push("#define DIFFUSE_ISLINEAR"));const n=a.opacityTexture;n&&(l.push("#define OPACITY"),r.isVerticesDataPresent(qe.o.UV2Kind)&&1===n.coordinatesIndex?(l.push("#define OPACITYUV2"),u=!0):r.isVerticesDataPresent(qe.o.UVKind)&&(l.push("#define OPACITYUV1"),c=!0))}i&&(l.push("#define EMISSIVE"),r.isVerticesDataPresent(qe.o.UV2Kind)&&1===i.coordinatesIndex?(l.push("#define EMISSIVEUV2"),u=!0):r.isVerticesDataPresent(qe.o.UVKind)&&(l.push("#define EMISSIVEUV1"),c=!0),i.gammaSpace||l.push("#define EMISSIVE_ISLINEAR")),r.useVertexColors&&r.isVerticesDataPresent(qe.o.ColorKind)&&r.hasVertexAlpha&&a.transparencyMode!==cs.F.MATERIAL_OPAQUE&&(h.push(qe.o.ColorKind),l.push("#define VERTEXALPHA")),c&&(h.push(qe.o.UVKind),l.push("#define UV1")),u&&(h.push(qe.o.UV2Kind),l.push("#define UV2"));const d=new ka.L;if(r.useBones&&r.computeBonesUsingShaders){h.push(qe.o.MatricesIndicesKind),h.push(qe.o.MatricesWeightsKind),r.numBoneInfluencers>4&&(h.push(qe.o.MatricesIndicesExtraKind),h.push(qe.o.MatricesWeightsExtraKind)),l.push("#define NUM_BONE_INFLUENCERS "+r.numBoneInfluencers);const e=r.skeleton;e&&e.isUsingTextureForMatrices?l.push("#define BONETEXTURE"):l.push("#define BonesPerMesh "+(e?e.bones.length+1:0)),r.numBoneInfluencers>0&&d.addCPUSkinningFallback(0,r)}else l.push("#define NUM_BONE_INFLUENCERS 0");const p=r.morphTargetManager;let f=0;p&&p.numInfluencers>0&&(l.push("#define MORPHTARGETS"),f=p.numInfluencers,l.push("#define NUM_MORPH_INFLUENCERS "+f),p.isUsingTextureForTargets&&l.push("#define MORPHTARGETS_TEXTURE"),La.G.PrepareAttributesForMorphTargetsInfluencers(h,r,f)),t&&(l.push("#define INSTANCES"),La.G.PushAttributesForInstances(h),e.getRenderingMesh().hasThinInstances&&l.push("#define THIN_INSTANCES")),(0,Ga.lK)(a,this._scene,l),this._addCustomEffectDefines(l);const _=e._getDrawWrapper(void 0,!0),m=_.defines,g=l.join("\n");if(m!==g){const e=["world","mBones","viewProjection","glowColor","morphTargetInfluences","boneTextureWidth","diffuseMatrix","emissiveMatrix","opacityMatrix","opacityIntensity","morphTargetTextureInfo","morphTargetTextureIndices","glowIntensity"];(0,Ga.qx)(e),_.setEffect(this._engine.createEffect("glowMapGeneration",h,e,["diffuseSampler","emissiveSampler","opacitySampler","boneSampler","morphTargets"],g,d,void 0,void 0,{maxSimultaneousMorphTargets:f}),g)}return _.effect.isReady()}render(){for(let e=0;e<this._postProcesses.length;e++)if(!this._postProcesses[e].isReady())return;const e=this._scene.getEngine(),t=this._numInternalDraws();let i=!0;for(let e=0;e<t;++e){let t=this._mergeDrawWrapper[e];t||(t=this._mergeDrawWrapper[e]=new Ps.q(this._engine),t.setEffect(this._createMergeEffect())),i=i&&t.effect.isReady()}if(!i)return;this.onBeforeComposeObservable.notifyObservers(this);const n=e.getAlphaMode();for(let i=0;i<t;++i){const t=this._mergeDrawWrapper[i];e.enableEffect(t),e.setState(!1),e.bindBuffers(this._vertexBuffers,this._indexBuffer,t.effect),e.setAlphaMode(this._effectLayerOptions.alphaBlendingMode),this._internalRender(t.effect,i)}e.setAlphaMode(n),this.onAfterComposeObservable.notifyObservers(this);const s=this._mainTexture.getSize();this._setMainTextureSize(),s.width===this._mainTextureDesiredSize.width&&s.height===this._mainTextureDesiredSize.height||0===this._mainTextureDesiredSize.width||0===this._mainTextureDesiredSize.height||(this.onSizeChangedObservable.notifyObservers(this),this._disposeTextureAndPostProcesses(),this._createMainTexture(),this._createTextureAndPostProcesses())}hasMesh(e){return-1===this.renderingGroupId||e.renderingGroupId===this.renderingGroupId}shouldRender(){return this.isEnabled&&this._shouldRender}_shouldRenderMesh(e){return!0}_canRenderMesh(e,t){return!t.needAlphaBlendingForMesh(e)}_shouldRenderEmissiveTextureForMesh(){return!0}_renderSubMesh(e,t=!1){var i,n;if(!this.shouldRender())return;const s=e.getMaterial(),r=e.getMesh(),o=e.getReplacementMesh(),a=e.getRenderingMesh(),l=e.getEffectiveMesh(),h=this._scene,c=h.getEngine();if(l._internalAbstractMeshDataInfo._isActiveIntermediate=!1,!s)return;if(!this._canRenderMesh(a,s))return;let u=null!==(i=a.overrideMaterialSideOrientation)&&void 0!==i?i:s.sideOrientation;l._getWorldMatrixDeterminant()<0&&(u=u===cs.F.ClockWiseSideOrientation?cs.F.CounterClockWiseSideOrientation:cs.F.ClockWiseSideOrientation);const d=u===cs.F.ClockWiseSideOrientation;c.setState(s.backFaceCulling,s.zOffset,void 0,d,s.cullBackFaces,void 0,s.zOffsetUnits);const p=a._getInstancesRenderList(e._id,!!o);if(p.mustReturn)return;if(!this._shouldRenderMesh(a))return;const f=p.hardwareInstancedRendering[e._id]||a.hasThinInstances;if(this._setEmissiveTextureAndColor(a,e,s),this.onBeforeRenderMeshToEffect.notifyObservers(r),this._useMeshMaterial(a))a.render(e,t,o||void 0);else if(this._isReady(e,f,this._emissiveTextureAndColor.texture)){const i=null===(n=l._internalAbstractMeshDataInfo._materialForRenderPass)||void 0===n?void 0:n[c.currentRenderPassId];let r=e._getDrawWrapper();if(!r&&i&&(r=i._getDrawWrapper()),!r)return;const o=r.effect;if(c.enableEffect(r),f||a._bind(e,o,s.fillMode),i?i.bindForSubMesh(l.getWorldMatrix(),l,e):(o.setMatrix("viewProjection",h.getTransformMatrix()),o.setMatrix("world",l.getWorldMatrix()),o.setFloat4("glowColor",this._emissiveTextureAndColor.color.r,this._emissiveTextureAndColor.color.g,this._emissiveTextureAndColor.color.b,this._emissiveTextureAndColor.color.a)),!i){const e=s.needAlphaTesting(),i=s.getAlphaTestTexture(),n=i&&i.hasAlpha&&(s.useAlphaFromDiffuseTexture||s._useAlphaFromAlbedoTexture);if(i&&(e||n)){o.setTexture("diffuseSampler",i);const e=i.getTextureMatrix();e&&o.setMatrix("diffuseMatrix",e)}const r=s.opacityTexture;if(r){o.setTexture("opacitySampler",r),o.setFloat("opacityIntensity",r.level);const e=r.getTextureMatrix();e&&o.setMatrix("opacityMatrix",e)}if(this._emissiveTextureAndColor.texture&&(o.setTexture("emissiveSampler",this._emissiveTextureAndColor.texture),o.setMatrix("emissiveMatrix",this._emissiveTextureAndColor.texture.getTextureMatrix())),a.useBones&&a.computeBonesUsingShaders&&a.skeleton){const e=a.skeleton;if(e.isUsingTextureForMatrices){const t=e.getTransformMatrixTexture(a);if(!t)return;o.setTexture("boneSampler",t),o.setFloat("boneTextureWidth",4*(e.bones.length+1))}else o.setMatrices("mBones",e.getTransformMatrices(a))}La.G.BindMorphTargetParameters(a,o),a.morphTargetManager&&a.morphTargetManager.isUsingTextureForTargets&&a.morphTargetManager._bind(o),t&&c.setAlphaMode(s.alphaMode),o.setFloat("glowIntensity",this.getEffectIntensity(a)),(0,Ga.an)(o,s,h)}a._processRendering(l,e,o,s.fillMode,p,f,((e,t)=>o.setMatrix("world",t)))}else this._mainTexture.resetRefreshCounter();this.onAfterRenderMeshToEffect.notifyObservers(r)}_useMeshMaterial(e){return!1}_rebuild(){const e=this._vertexBuffers[qe.o.PositionKind];e&&e._rebuild(),this._generateIndexBuffer()}_disposeTextureAndPostProcesses(){this._mainTexture.dispose();for(let e=0;e<this._postProcesses.length;e++)this._postProcesses[e]&&this._postProcesses[e].dispose();this._postProcesses=[];for(let e=0;e<this._textures.length;e++)this._textures[e]&&this._textures[e].dispose();this._textures=[]}dispose(){const e=this._vertexBuffers[qe.o.PositionKind];e&&(e.dispose(),this._vertexBuffers[qe.o.PositionKind]=null),this._indexBuffer&&(this._scene.getEngine()._releaseBuffer(this._indexBuffer),this._indexBuffer=null);for(const e of this._mergeDrawWrapper)e.dispose();this._mergeDrawWrapper=[],this._disposeTextureAndPostProcesses();const t=this._scene.effectLayers.indexOf(this,0);t>-1&&this._scene.effectLayers.splice(t,1),this.onDisposeObservable.notifyObservers(this),this.onDisposeObservable.clear(),this.onBeforeRenderMainTextureObservable.clear(),this.onBeforeComposeObservable.clear(),this.onBeforeRenderMeshToEffect.clear(),this.onAfterRenderMeshToEffect.clear(),this.onAfterComposeObservable.clear(),this.onSizeChangedObservable.clear()}getClassName(){return"EffectLayer"}static Parse(e,t,i){return de.w1.Instantiate(e.customType).Parse(e,t,i)}}Jl._SceneComponentInitialization=e=>{throw(0,Zl.S)("EffectLayerSceneComponent")},(0,be.gn)([(0,Te.qC)()],Jl.prototype,"name",void 0),(0,be.gn)([(0,Te.XX)()],Jl.prototype,"neutralColor",void 0),(0,be.gn)([(0,Te.qC)()],Jl.prototype,"isEnabled",void 0),(0,be.gn)([(0,Te.VE)()],Jl.prototype,"camera",null),(0,be.gn)([(0,Te.qC)()],Jl.prototype,"renderingGroupId",null),(0,be.gn)([(0,Te.qC)()],Jl.prototype,"disableBoundingBoxesFromEffectLayer",void 0),n.p.AddParser(ve.l.NAME_EFFECTLAYER,((e,t,i,n)=>{if(e.effectLayers){i.effectLayers||(i.effectLayers=new Array);for(let s=0;s<e.effectLayers.length;s++){const r=Jl.Parse(e.effectLayers[s],t,n);i.effectLayers.push(r)}}})),n.p.prototype.removeEffectLayer=function(e){const t=this.effectLayers.indexOf(e);return-1!==t&&this.effectLayers.splice(t,1),t},n.p.prototype.addEffectLayer=function(e){this.effectLayers.push(e)};class eh{constructor(e){this.name=ve.l.NAME_EFFECTLAYER,this._renderEffects=!1,this._needStencil=!1,this._previousStencilState=!1,this.scene=e||A.l.LastCreatedScene,this.scene&&(this._engine=this.scene.getEngine(),this.scene.effectLayers=new Array)}register(){this.scene._isReadyForMeshStage.registerStep(ve.l.STEP_ISREADYFORMESH_EFFECTLAYER,this,this._isReadyForMesh),this.scene._cameraDrawRenderTargetStage.registerStep(ve.l.STEP_CAMERADRAWRENDERTARGET_EFFECTLAYER,this,this._renderMainTexture),this.scene._beforeCameraDrawStage.registerStep(ve.l.STEP_BEFORECAMERADRAW_EFFECTLAYER,this,this._setStencil),this.scene._afterRenderingGroupDrawStage.registerStep(ve.l.STEP_AFTERRENDERINGGROUPDRAW_EFFECTLAYER_DRAW,this,this._drawRenderingGroup),this.scene._afterCameraDrawStage.registerStep(ve.l.STEP_AFTERCAMERADRAW_EFFECTLAYER,this,this._setStencilBack),this.scene._afterCameraDrawStage.registerStep(ve.l.STEP_AFTERCAMERADRAW_EFFECTLAYER_DRAW,this,this._drawCamera)}rebuild(){const e=this.scene.effectLayers;for(const t of e)t._rebuild()}serialize(e){e.effectLayers=[];const t=this.scene.effectLayers;for(const i of t)i.serialize&&e.effectLayers.push(i.serialize())}addFromContainer(e){e.effectLayers&&e.effectLayers.forEach((e=>{this.scene.addEffectLayer(e)}))}removeFromContainer(e,t){e.effectLayers&&e.effectLayers.forEach((e=>{this.scene.removeEffectLayer(e),t&&e.dispose()}))}dispose(){const e=this.scene.effectLayers;for(;e.length;)e[0].dispose()}_isReadyForMesh(e,t){const i=this._engine.currentRenderPassId,n=this.scene.effectLayers;for(const s of n){if(!s.hasMesh(e))continue;const n=s._mainTexture;this._engine.currentRenderPassId=n.renderPassId;for(const n of e.subMeshes)if(!s.isReady(n,t))return this._engine.currentRenderPassId=i,!1}return this._engine.currentRenderPassId=i,!0}_renderMainTexture(e){this._renderEffects=!1,this._needStencil=!1;let t=!1;const i=this.scene.effectLayers;if(i&&i.length>0){this._previousStencilState=this._engine.getStencilBuffer();for(const n of i)if(n.shouldRender()&&(!n.camera||n.camera.cameraRigMode===Mt.V.RIG_MODE_NONE&&e===n.camera||n.camera.cameraRigMode!==Mt.V.RIG_MODE_NONE&&n.camera._rigCameras.indexOf(e)>-1)){this._renderEffects=!0,this._needStencil=this._needStencil||n.needStencil();const e=n._mainTexture;e._shouldRender()&&(this.scene.incrementRenderId(),e.render(!1,!1),t=!0)}this.scene.incrementRenderId()}return t}_setStencil(){this._needStencil&&this._engine.setStencilBuffer(!0)}_setStencilBack(){this._needStencil&&this._engine.setStencilBuffer(this._previousStencilState)}_draw(e){if(this._renderEffects){this._engine.setDepthBuffer(!1);const t=this.scene.effectLayers;for(let i=0;i<t.length;i++){const n=t[i];n.renderingGroupId===e&&n.shouldRender()&&n.render()}this._engine.setDepthBuffer(!0)}}_drawCamera(){this._renderEffects&&this._draw(-1)}_drawRenderingGroup(e){!this.scene._isInIntermediateRendering()&&this._renderEffects&&this._draw(e)}}Jl._SceneComponentInitialization=e=>{let t=e._getComponent(ve.l.NAME_EFFECTLAYER);t||(t=new eh(e),e._addComponent(t))};si.v.ShadersStore.glowMapMergePixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\n#ifdef EMISSIVE\nuniform sampler2D textureSampler2;\n#endif\nuniform float offset;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\nvec4 baseColor=texture2D(textureSampler,vUV);\n#ifdef EMISSIVE\nbaseColor+=texture2D(textureSampler2,vUV);\nbaseColor*=offset;\n#else\nbaseColor.a=abs(offset-baseColor.a);\n#ifdef STROKE\nfloat alpha=smoothstep(.0,.1,baseColor.a);\nbaseColor.a=alpha;\nbaseColor.rgb=baseColor.rgb*alpha;\n#endif\n#endif\n#if LDR\nbaseColor=clamp(baseColor,0.,1.0);\n#endif\ngl_FragColor=baseColor;\n#define CUSTOM_FRAGMENT_MAIN_END\n}";si.v.ShadersStore.glowMapMergeVertexShader="attribute vec2 position;\nvarying vec2 vUV;\nconst vec2 madd=vec2(0.5,0.5);\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nvUV=position*madd+madd;\ngl_Position=vec4(position,0.0,1.0);\n#define CUSTOM_VERTEX_MAIN_END\n}",n.p.prototype.getGlowLayerByName=function(e){var t;for(let i=0;i<(null===(t=this.effectLayers)||void 0===t?void 0:t.length);i++)if(this.effectLayers[i].name===e&&this.effectLayers[i].getEffectName()===th.EffectName)return this.effectLayers[i];return null};class th extends Jl{set blurKernelSize(e){if(e===this._options.blurKernelSize)return;this._options.blurKernelSize=e;const t=this._getEffectiveBlurKernelSize();this._horizontalBlurPostprocess1.kernel=t,this._verticalBlurPostprocess1.kernel=t,this._horizontalBlurPostprocess2.kernel=t,this._verticalBlurPostprocess2.kernel=t}get blurKernelSize(){return this._options.blurKernelSize}set intensity(e){this._intensity=e}get intensity(){return this._intensity}constructor(e,t,i){super(e,t),this._intensity=1,this._includedOnlyMeshes=[],this._excludedMeshes=[],this._meshesUsingTheirOwnMaterials=[],this.neutralColor=new a.HE(0,0,0,1),this._options={mainTextureRatio:th.DefaultTextureRatio,blurKernelSize:32,mainTextureFixedSize:void 0,camera:null,mainTextureSamples:1,renderingGroupId:-1,ldrMerge:!1,alphaBlendingMode:1,mainTextureType:0,...i},this._init({alphaBlendingMode:this._options.alphaBlendingMode,camera:this._options.camera,mainTextureFixedSize:this._options.mainTextureFixedSize,mainTextureRatio:this._options.mainTextureRatio,renderingGroupId:this._options.renderingGroupId,mainTextureType:this._options.mainTextureType})}getEffectName(){return th.EffectName}_createMergeEffect(){let e="#define EMISSIVE \n";return this._options.ldrMerge&&(e+="#define LDR \n"),this._engine.createEffect("glowMapMerge",[qe.o.PositionKind],["offset"],["textureSampler","textureSampler2"],e)}_createTextureAndPostProcesses(){let e=this._mainTextureDesiredSize.width,t=this._mainTextureDesiredSize.height;e=this._engine.needPOTTextures?ue.D.GetExponentOfTwo(e,this._maxSize):e,t=this._engine.needPOTTextures?ue.D.GetExponentOfTwo(t,this._maxSize):t;let i=0;i=this._engine.getCaps().textureHalfFloatRender?2:0,this._blurTexture1=new Ai._("GlowLayerBlurRTT",{width:e,height:t},this._scene,!1,!0,i),this._blurTexture1.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._blurTexture1.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._blurTexture1.updateSamplingMode(Ce.x.BILINEAR_SAMPLINGMODE),this._blurTexture1.renderParticles=!1,this._blurTexture1.ignoreCameraViewport=!0;const n=Math.floor(e/2),s=Math.floor(t/2);this._blurTexture2=new Ai._("GlowLayerBlurRTT2",{width:n,height:s},this._scene,!1,!0,i),this._blurTexture2.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._blurTexture2.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._blurTexture2.updateSamplingMode(Ce.x.BILINEAR_SAMPLINGMODE),this._blurTexture2.renderParticles=!1,this._blurTexture2.ignoreCameraViewport=!0,this._textures=[this._blurTexture1,this._blurTexture2];const r=this._getEffectiveBlurKernelSize();this._horizontalBlurPostprocess1=new wa("GlowLayerHBP1",new o.FM(1,0),r,{width:e,height:t},null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,i),this._horizontalBlurPostprocess1.width=e,this._horizontalBlurPostprocess1.height=t,this._horizontalBlurPostprocess1.externalTextureSamplerBinding=!0,this._horizontalBlurPostprocess1.onApplyObservable.add((e=>{e.setTexture("textureSampler",this._mainTexture)})),this._verticalBlurPostprocess1=new wa("GlowLayerVBP1",new o.FM(0,1),r,{width:e,height:t},null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,i),this._horizontalBlurPostprocess2=new wa("GlowLayerHBP2",new o.FM(1,0),r,{width:n,height:s},null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,i),this._horizontalBlurPostprocess2.width=n,this._horizontalBlurPostprocess2.height=s,this._horizontalBlurPostprocess2.externalTextureSamplerBinding=!0,this._horizontalBlurPostprocess2.onApplyObservable.add((e=>{e.setTexture("textureSampler",this._blurTexture1)})),this._verticalBlurPostprocess2=new wa("GlowLayerVBP2",new o.FM(0,1),r,{width:n,height:s},null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,i),this._postProcesses=[this._horizontalBlurPostprocess1,this._verticalBlurPostprocess1,this._horizontalBlurPostprocess2,this._verticalBlurPostprocess2],this._postProcesses1=[this._horizontalBlurPostprocess1,this._verticalBlurPostprocess1],this._postProcesses2=[this._horizontalBlurPostprocess2,this._verticalBlurPostprocess2],this._mainTexture.samples=this._options.mainTextureSamples,this._mainTexture.onAfterUnbindObservable.add((()=>{const e=this._blurTexture1.renderTarget;if(e){this._scene.postProcessManager.directRender(this._postProcesses1,e,!0);const t=this._blurTexture2.renderTarget;t&&this._scene.postProcessManager.directRender(this._postProcesses2,t,!0),this._engine.unBindFramebuffer(null!=t?t:e,!0)}})),this._postProcesses.map((e=>{e.autoClear=!1}))}_getEffectiveBlurKernelSize(){return this._options.blurKernelSize/2}isReady(e,t){const i=e.getMaterial(),n=e.getRenderingMesh();if(!i||!n)return!1;const s=i.emissiveTexture;return super._isReady(e,t,s)}needStencil(){return!1}_canRenderMesh(e,t){return!0}_internalRender(e){e.setTexture("textureSampler",this._blurTexture1),e.setTexture("textureSampler2",this._blurTexture2),e.setFloat("offset",this._intensity);const t=this._engine,i=t.getStencilBuffer();t.setStencilBuffer(!1),t.drawElementsType(cs.F.TriangleFillMode,0,6),t.setStencilBuffer(i)}_setEmissiveTextureAndColor(e,t,i){var n;let s=1;this.customEmissiveTextureSelector?this._emissiveTextureAndColor.texture=this.customEmissiveTextureSelector(e,t,i):i?(this._emissiveTextureAndColor.texture=i.emissiveTexture,this._emissiveTextureAndColor.texture&&(s=this._emissiveTextureAndColor.texture.level)):this._emissiveTextureAndColor.texture=null,this.customEmissiveColorSelector?this.customEmissiveColorSelector(e,t,i,this._emissiveTextureAndColor.color):i.emissiveColor?(s*=null!==(n=i.emissiveIntensity)&&void 0!==n?n:1,this._emissiveTextureAndColor.color.set(i.emissiveColor.r*s,i.emissiveColor.g*s,i.emissiveColor.b*s,i.alpha)):this._emissiveTextureAndColor.color.set(this.neutralColor.r,this.neutralColor.g,this.neutralColor.b,this.neutralColor.a)}_shouldRenderMesh(e){return this.hasMesh(e)}_addCustomEffectDefines(e){e.push("#define GLOW")}addExcludedMesh(e){-1===this._excludedMeshes.indexOf(e.uniqueId)&&this._excludedMeshes.push(e.uniqueId)}removeExcludedMesh(e){const t=this._excludedMeshes.indexOf(e.uniqueId);-1!==t&&this._excludedMeshes.splice(t,1)}addIncludedOnlyMesh(e){-1===this._includedOnlyMeshes.indexOf(e.uniqueId)&&this._includedOnlyMeshes.push(e.uniqueId)}removeIncludedOnlyMesh(e){const t=this._includedOnlyMeshes.indexOf(e.uniqueId);-1!==t&&this._includedOnlyMeshes.splice(t,1)}hasMesh(e){return!!super.hasMesh(e)&&(this._includedOnlyMeshes.length?-1!==this._includedOnlyMeshes.indexOf(e.uniqueId):!this._excludedMeshes.length||-1===this._excludedMeshes.indexOf(e.uniqueId))}_useMeshMaterial(e){return 0!=this._meshesUsingTheirOwnMaterials.length&&this._meshesUsingTheirOwnMaterials.indexOf(e.uniqueId)>-1}referenceMeshToUseItsOwnMaterial(e){e.resetDrawCache(this._mainTexture.renderPassId),this._meshesUsingTheirOwnMaterials.push(e.uniqueId),e.onDisposeObservable.add((()=>{this._disposeMesh(e)}))}unReferenceMeshFromUsingItsOwnMaterial(e){let t=this._meshesUsingTheirOwnMaterials.indexOf(e.uniqueId);for(;t>=0;)this._meshesUsingTheirOwnMaterials.splice(t,1),t=this._meshesUsingTheirOwnMaterials.indexOf(e.uniqueId);e.resetDrawCache(this._mainTexture.renderPassId)}_disposeMesh(e){this.removeIncludedOnlyMesh(e),this.removeExcludedMesh(e)}getClassName(){return"GlowLayer"}serialize(){const e=Te.p4.Serialize(this);let t;if(e.customType="BABYLON.GlowLayer",e.includedMeshes=[],this._includedOnlyMeshes.length)for(t=0;t<this._includedOnlyMeshes.length;t++){const i=this._scene.getMeshByUniqueId(this._includedOnlyMeshes[t]);i&&e.includedMeshes.push(i.id)}if(e.excludedMeshes=[],this._excludedMeshes.length)for(t=0;t<this._excludedMeshes.length;t++){const i=this._scene.getMeshByUniqueId(this._excludedMeshes[t]);i&&e.excludedMeshes.push(i.id)}return e}static Parse(e,t,i){const n=Te.p4.Parse((()=>new th(e.name,t,e.options)),e,t,i);let s;for(s=0;s<e.excludedMeshes.length;s++){const i=t.getMeshById(e.excludedMeshes[s]);i&&n.addExcludedMesh(i)}for(s=0;s<e.includedMeshes.length;s++){const i=t.getMeshById(e.includedMeshes[s]);i&&n.addIncludedOnlyMesh(i)}return n}}th.EffectName="GlowLayer",th.DefaultBlurKernelSize=32,th.DefaultTextureRatio=.5,(0,be.gn)([(0,Te.qC)()],th.prototype,"blurKernelSize",null),(0,be.gn)([(0,Te.qC)()],th.prototype,"intensity",null),(0,be.gn)([(0,Te.qC)("options")],th.prototype,"_options",void 0),(0,l.H)("BABYLON.GlowLayer",th);si.v.ShadersStore.glowBlurPostProcessPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform vec2 screenSize;\nuniform vec2 direction;\nuniform float blurWidth;\nfloat getLuminance(vec3 color)\n{\nreturn dot(color,vec3(0.2126,0.7152,0.0722));\n}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nfloat weights[7];\nweights[0]=0.05;\nweights[1]=0.1;\nweights[2]=0.2;\nweights[3]=0.3;\nweights[4]=0.2;\nweights[5]=0.1;\nweights[6]=0.05;\nvec2 texelSize=vec2(1.0/screenSize.x,1.0/screenSize.y);\nvec2 texelStep=texelSize*direction*blurWidth;\nvec2 start=vUV-3.0*texelStep;\nvec4 baseColor=vec4(0.,0.,0.,0.);\nvec2 texelOffset=vec2(0.,0.);\nfor (int i=0; i<7; i++)\n{\nvec4 texel=texture2D(textureSampler,start+texelOffset);\nbaseColor.a+=texel.a*weights[i];\nfloat luminance=getLuminance(baseColor.rgb);\nfloat luminanceTexel=getLuminance(texel.rgb);\nfloat choice=step(luminanceTexel,luminance);\nbaseColor.rgb=choice*baseColor.rgb+(1.0-choice)*texel.rgb;\ntexelOffset+=texelStep;\n}\ngl_FragColor=baseColor;\n}",n.p.prototype.getHighlightLayerByName=function(e){var t;for(let i=0;i<(null===(t=this.effectLayers)||void 0===t?void 0:t.length);i++)if(this.effectLayers[i].name===e&&this.effectLayers[i].getEffectName()===nh.EffectName)return this.effectLayers[i];return null};class ih extends ni.D{constructor(e,t,i,n,s,r=Ce.x.BILINEAR_SAMPLINGMODE,o,a){super(e,"glowBlurPostProcess",["screenSize","direction","blurWidth"],null,n,s,r,o,a),this.direction=t,this.kernel=i,this.onApplyObservable.add((e=>{e.setFloat2("screenSize",this.width,this.height),e.setVector2("direction",this.direction),e.setFloat("blurWidth",this.kernel)}))}}class nh extends Jl{set blurHorizontalSize(e){this._horizontalBlurPostprocess.kernel=e,this._options.blurHorizontalSize=e}set blurVerticalSize(e){this._verticalBlurPostprocess.kernel=e,this._options.blurVerticalSize=e}get blurHorizontalSize(){return this._horizontalBlurPostprocess.kernel}get blurVerticalSize(){return this._verticalBlurPostprocess.kernel}constructor(e,t,i){super(e,t),this.name=e,this.innerGlow=!0,this.outerGlow=!0,this.onBeforeBlurObservable=new r.y$,this.onAfterBlurObservable=new r.y$,this._instanceGlowingMeshStencilReference=nh.GlowingMeshStencilReference++,this._meshes={},this._excludedMeshes={},this.neutralColor=nh.NeutralColor,this._engine.isStencilEnable||_.Y.Warn("Rendering the Highlight Layer requires the stencil to be active on the canvas. var engine = new Engine(canvas, antialias, { stencil: true }"),this._options={mainTextureRatio:.5,blurTextureSizeRatio:.5,blurHorizontalSize:1,blurVerticalSize:1,alphaBlendingMode:2,camera:null,renderingGroupId:-1,mainTextureType:0,...i},this._init({alphaBlendingMode:this._options.alphaBlendingMode,camera:this._options.camera,mainTextureFixedSize:this._options.mainTextureFixedSize,mainTextureRatio:this._options.mainTextureRatio,renderingGroupId:this._options.renderingGroupId,mainTextureType:this._options.mainTextureType}),this._shouldRender=!1}getEffectName(){return nh.EffectName}_numInternalDraws(){return 2}_createMergeEffect(){return this._engine.createEffect("glowMapMerge",[qe.o.PositionKind],["offset"],["textureSampler"],this._options.isStroke?"#define STROKE \n":void 0)}_createTextureAndPostProcesses(){let e=this._mainTextureDesiredSize.width*this._options.blurTextureSizeRatio,t=this._mainTextureDesiredSize.height*this._options.blurTextureSizeRatio;e=this._engine.needPOTTextures?ue.D.GetExponentOfTwo(e,this._maxSize):e,t=this._engine.needPOTTextures?ue.D.GetExponentOfTwo(t,this._maxSize):t;let i=0;i=this._engine.getCaps().textureHalfFloatRender?2:0,this._blurTexture=new Ai._("HighlightLayerBlurRTT",{width:e,height:t},this._scene,!1,!0,i),this._blurTexture.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._blurTexture.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._blurTexture.anisotropicFilteringLevel=16,this._blurTexture.updateSamplingMode(Ce.x.TRILINEAR_SAMPLINGMODE),this._blurTexture.renderParticles=!1,this._blurTexture.ignoreCameraViewport=!0,this._textures=[this._blurTexture],2===this._options.alphaBlendingMode?(this._downSamplePostprocess=new ii.Q("HighlightLayerPPP",this._options.blurTextureSizeRatio,null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine()),this._downSamplePostprocess.externalTextureSamplerBinding=!0,this._downSamplePostprocess.onApplyObservable.add((e=>{e.setTexture("textureSampler",this._mainTexture)})),this._horizontalBlurPostprocess=new ih("HighlightLayerHBP",new o.FM(1,0),this._options.blurHorizontalSize,1,null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine()),this._horizontalBlurPostprocess.onApplyObservable.add((i=>{i.setFloat2("screenSize",e,t)})),this._verticalBlurPostprocess=new ih("HighlightLayerVBP",new o.FM(0,1),this._options.blurVerticalSize,1,null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine()),this._verticalBlurPostprocess.onApplyObservable.add((i=>{i.setFloat2("screenSize",e,t)})),this._postProcesses=[this._downSamplePostprocess,this._horizontalBlurPostprocess,this._verticalBlurPostprocess]):(this._horizontalBlurPostprocess=new wa("HighlightLayerHBP",new o.FM(1,0),this._options.blurHorizontalSize/2,{width:e,height:t},null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,i),this._horizontalBlurPostprocess.width=e,this._horizontalBlurPostprocess.height=t,this._horizontalBlurPostprocess.externalTextureSamplerBinding=!0,this._horizontalBlurPostprocess.onApplyObservable.add((e=>{e.setTexture("textureSampler",this._mainTexture)})),this._verticalBlurPostprocess=new wa("HighlightLayerVBP",new o.FM(0,1),this._options.blurVerticalSize/2,{width:e,height:t},null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,i),this._postProcesses=[this._horizontalBlurPostprocess,this._verticalBlurPostprocess]),this._mainTexture.onAfterUnbindObservable.add((()=>{this.onBeforeBlurObservable.notifyObservers(this);const e=this._blurTexture.renderTarget;e&&(this._scene.postProcessManager.directRender(this._postProcesses,e,!0),this._engine.unBindFramebuffer(e,!0)),this.onAfterBlurObservable.notifyObservers(this)})),this._postProcesses.map((e=>{e.autoClear=!1}))}needStencil(){return!0}isReady(e,t){const i=e.getMaterial(),n=e.getRenderingMesh();if(!i||!n||!this._meshes)return!1;let s=null;const r=this._meshes[n.uniqueId];return r&&r.glowEmissiveOnly&&i&&(s=i.emissiveTexture),super._isReady(e,t,s)}_internalRender(e,t){e.setTexture("textureSampler",this._blurTexture);const i=this._engine;i.cacheStencilState(),i.setStencilOperationPass(7681),i.setStencilOperationFail(7680),i.setStencilOperationDepthFail(7680),i.setStencilMask(0),i.setStencilBuffer(!0),i.setStencilFunctionReference(this._instanceGlowingMeshStencilReference),this.outerGlow&&0===t&&(e.setFloat("offset",0),i.setStencilFunction(517),i.drawElementsType(cs.F.TriangleFillMode,0,6)),this.innerGlow&&1===t&&(e.setFloat("offset",1),i.setStencilFunction(514),i.drawElementsType(cs.F.TriangleFillMode,0,6)),i.restoreStencilState()}shouldRender(){return!!super.shouldRender()&&!!this._meshes}_shouldRenderMesh(e){return!(this._excludedMeshes&&this._excludedMeshes[e.uniqueId]||!super.hasMesh(e))}_canRenderMesh(e,t){return!0}_addCustomEffectDefines(e){e.push("#define HIGHLIGHT")}_setEmissiveTextureAndColor(e,t,i){const n=this._meshes[e.uniqueId];n?this._emissiveTextureAndColor.color.set(n.color.r,n.color.g,n.color.b,1):this._emissiveTextureAndColor.color.set(this.neutralColor.r,this.neutralColor.g,this.neutralColor.b,this.neutralColor.a),n&&n.glowEmissiveOnly&&i?(this._emissiveTextureAndColor.texture=i.emissiveTexture,this._emissiveTextureAndColor.color.set(1,1,1,1)):this._emissiveTextureAndColor.texture=null}addExcludedMesh(e){if(this._excludedMeshes&&!this._excludedMeshes[e.uniqueId]){const t={mesh:e,beforeBind:null,afterRender:null,stencilState:!1};t.beforeBind=e.onBeforeBindObservable.add((e=>{t.stencilState=e.getEngine().getStencilBuffer(),e.getEngine().setStencilBuffer(!1)})),t.afterRender=e.onAfterRenderObservable.add((e=>{e.getEngine().setStencilBuffer(t.stencilState)})),this._excludedMeshes[e.uniqueId]=t}}removeExcludedMesh(e){if(!this._excludedMeshes)return;const t=this._excludedMeshes[e.uniqueId];t&&(t.beforeBind&&e.onBeforeBindObservable.remove(t.beforeBind),t.afterRender&&e.onAfterRenderObservable.remove(t.afterRender)),this._excludedMeshes[e.uniqueId]=null}hasMesh(e){return!!this._meshes&&!!super.hasMesh(e)&&void 0!==this._meshes[e.uniqueId]&&null!==this._meshes[e.uniqueId]}addMesh(e,t,i=!1){if(!this._meshes)return;const n=this._meshes[e.uniqueId];n?n.color=t:(this._meshes[e.uniqueId]={mesh:e,color:t,observerHighlight:e.onBeforeBindObservable.add((e=>{this.isEnabled&&(this._excludedMeshes&&this._excludedMeshes[e.uniqueId]?this._defaultStencilReference(e):e.getScene().getEngine().setStencilFunctionReference(this._instanceGlowingMeshStencilReference))})),observerDefault:e.onAfterRenderObservable.add((e=>{this.isEnabled&&this._defaultStencilReference(e)})),glowEmissiveOnly:i},e.onDisposeObservable.add((()=>{this._disposeMesh(e)}))),this._shouldRender=!0}removeMesh(e){if(!this._meshes)return;const t=this._meshes[e.uniqueId];t&&(t.observerHighlight&&e.onBeforeBindObservable.remove(t.observerHighlight),t.observerDefault&&e.onAfterRenderObservable.remove(t.observerDefault),delete this._meshes[e.uniqueId]),this._shouldRender=!1;for(const e in this._meshes)if(this._meshes[e]){this._shouldRender=!0;break}}removeAllMeshes(){if(this._meshes)for(const e in this._meshes)if(Object.prototype.hasOwnProperty.call(this._meshes,e)){const t=this._meshes[e];t&&this.removeMesh(t.mesh)}}_defaultStencilReference(e){e.getScene().getEngine().setStencilFunctionReference(nh.NormalMeshStencilReference)}_disposeMesh(e){this.removeMesh(e),this.removeExcludedMesh(e)}dispose(){if(this._meshes){for(const e in this._meshes){const t=this._meshes[e];t&&t.mesh&&(t.observerHighlight&&t.mesh.onBeforeBindObservable.remove(t.observerHighlight),t.observerDefault&&t.mesh.onAfterRenderObservable.remove(t.observerDefault))}this._meshes=null}if(this._excludedMeshes){for(const e in this._excludedMeshes){const t=this._excludedMeshes[e];t&&(t.beforeBind&&t.mesh.onBeforeBindObservable.remove(t.beforeBind),t.afterRender&&t.mesh.onAfterRenderObservable.remove(t.afterRender))}this._excludedMeshes=null}super.dispose()}getClassName(){return"HighlightLayer"}serialize(){const e=Te.p4.Serialize(this);if(e.customType="BABYLON.HighlightLayer",e.meshes=[],this._meshes)for(const t in this._meshes){const i=this._meshes[t];i&&e.meshes.push({glowEmissiveOnly:i.glowEmissiveOnly,color:i.color.asArray(),meshId:i.mesh.id})}if(e.excludedMeshes=[],this._excludedMeshes)for(const t in this._excludedMeshes){const i=this._excludedMeshes[t];i&&e.excludedMeshes.push(i.mesh.id)}return e}static Parse(e,t,i){const n=Te.p4.Parse((()=>new nh(e.name,t,e.options)),e,t,i);let s;for(s=0;s<e.excludedMeshes.length;s++){const i=t.getMeshById(e.excludedMeshes[s]);i&&n.addExcludedMesh(i)}for(s=0;s<e.meshes.length;s++){const i=e.meshes[s],r=t.getMeshById(i.meshId);r&&n.addMesh(r,a.Wo.FromArray(i.color),i.glowEmissiveOnly)}return n}}nh.EffectName="HighlightLayer",nh.NeutralColor=new a.HE(0,0,0,0),nh.GlowingMeshStencilReference=2,nh.NormalMeshStencilReference=1,(0,be.gn)([(0,Te.qC)()],nh.prototype,"innerGlow",void 0),(0,be.gn)([(0,Te.qC)()],nh.prototype,"outerGlow",void 0),(0,be.gn)([(0,Te.qC)()],nh.prototype,"blurHorizontalSize",null),(0,be.gn)([(0,Te.qC)()],nh.prototype,"blurVerticalSize",null),(0,be.gn)([(0,Te.qC)("options")],nh.prototype,"_options",void 0),(0,l.H)("BABYLON.HighlightLayer",nh);var sh=i(4380),rh=i(8513);class oh{static AddFlare(e,t,i,n,s){return new oh(e,t,i,n,s)}constructor(e,t,i,n,s){this.size=e,this.position=t,this.alphaMode=6,this.color=i||new a.Wo(1,1,1),this.texture=n?new Ce.x(n,s.getScene(),!0):null,this._system=s;const r=s.scene.getEngine();this._drawWrapper=new Ps.q(r),this._drawWrapper.effect=r.createEffect("lensFlare",[qe.o.PositionKind],["color","viewportMatrix"],["textureSampler"],""),s.lensFlares.push(this)}dispose(){this.texture&&this.texture.dispose();const e=this._system.lensFlares.indexOf(this);this._system.lensFlares.splice(e,1)}}si.v.ShadersStore.lensFlarePixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform vec4 color;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\nvec4 baseColor=texture2D(textureSampler,vUV);\ngl_FragColor=baseColor*color;\n#define CUSTOM_FRAGMENT_MAIN_END\n}";si.v.ShadersStore.lensFlareVertexShader="attribute vec2 position;\nuniform mat4 viewportMatrix;\nvarying vec2 vUV;\nconst vec2 madd=vec2(0.5,0.5);\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nvUV=position*madd+madd;\ngl_Position=viewportMatrix*vec4(position,0.0,1.0);\n#define CUSTOM_VERTEX_MAIN_END\n}";class ah{get scene(){return this._scene}constructor(e,t,i){this.name=e,this.lensFlares=new Array,this.borderLimit=300,this.viewportBorder=0,this.layerMask=268435455,this._vertexBuffers={},this._isEnabled=!0,this._scene=i||A.l.LastCreatedScene,ah._SceneComponentInitialization(this._scene),this._emitter=t,this.id=e,i.lensFlareSystems.push(this),this.meshesSelectionPredicate=e=>i.activeCamera&&e.material&&e.isVisible&&e.isEnabled()&&e.isBlocker&&0!=(e.layerMask&i.activeCamera.layerMask);const n=i.getEngine(),s=[];s.push(1,1),s.push(-1,1),s.push(-1,-1),s.push(1,-1),this._vertexBuffers[qe.o.PositionKind]=new qe.o(n,s,qe.o.PositionKind,!1,!1,2),this._createIndexBuffer()}_createIndexBuffer(){const e=[];e.push(0),e.push(1),e.push(2),e.push(0),e.push(2),e.push(3),this._indexBuffer=this._scene.getEngine().createIndexBuffer(e)}get isEnabled(){return this._isEnabled}set isEnabled(e){this._isEnabled=e}getScene(){return this._scene}getEmitter(){return this._emitter}setEmitter(e){this._emitter=e}getEmitterPosition(){return this._emitter.getAbsolutePosition?this._emitter.getAbsolutePosition():this._emitter.position}computeEffectivePosition(e){let t=this.getEmitterPosition();t=o.P.Project(t,o.y3.Identity(),this._scene.getTransformMatrix(),e),this._positionX=t.x,this._positionY=t.y,t=o.P.TransformCoordinates(this.getEmitterPosition(),this._scene.getViewMatrix()),this.viewportBorder>0&&(e.x-=this.viewportBorder,e.y-=this.viewportBorder,e.width+=2*this.viewportBorder,e.height+=2*this.viewportBorder,t.x+=this.viewportBorder,t.y+=this.viewportBorder,this._positionX+=this.viewportBorder,this._positionY+=this.viewportBorder);const i=this._scene.useRightHandedSystem;return!!(t.z>0&&!i||t.z<0&&i)&&(this._positionX>e.x&&this._positionX<e.x+e.width&&this._positionY>e.y&&(this._positionY,e.y,e.height),!0)}_isVisible(){if(!this._isEnabled||!this._scene.activeCamera)return!1;const e=this.getEmitterPosition().subtract(this._scene.activeCamera.globalPosition),t=e.length();e.normalize();const i=new Yt.z(this._scene.activeCamera.globalPosition,e),n=this._scene.pickWithRay(i,this.meshesSelectionPredicate,!0);return!n||!n.hit||n.distance>t}render(){if(!this._scene.activeCamera)return!1;const e=this._scene.getEngine(),t=this._scene.activeCamera.viewport.toGlobal(e.getRenderWidth(!0),e.getRenderHeight(!0));if(!this.computeEffectivePosition(t))return!1;if(!this._isVisible())return!1;let i,n;i=this._positionX<this.borderLimit+t.x?this.borderLimit+t.x-this._positionX:this._positionX>t.x+t.width-this.borderLimit?this._positionX-t.x-t.width+this.borderLimit:0,n=this._positionY<this.borderLimit+t.y?this.borderLimit+t.y-this._positionY:this._positionY>t.y+t.height-this.borderLimit?this._positionY-t.y-t.height+this.borderLimit:0;let s=i>n?i:n;s-=this.viewportBorder,s>this.borderLimit&&(s=this.borderLimit);let r=1-lt.R.Clamp(s/this.borderLimit,0,1);if(r<0)return!1;r>1&&(r=1),this.viewportBorder>0&&(t.x+=this.viewportBorder,t.y+=this.viewportBorder,t.width-=2*this.viewportBorder,t.height-=2*this.viewportBorder,this._positionX-=this.viewportBorder,this._positionY-=this.viewportBorder);const a=t.x+t.width/2,l=t.y+t.height/2,h=a-this._positionX,c=l-this._positionY;e.setState(!1),e.setDepthBuffer(!1);for(let i=0;i<this.lensFlares.length;i++){const n=this.lensFlares[i];if(!n._drawWrapper.effect.isReady()||n.texture&&!n.texture.isReady())continue;e.enableEffect(n._drawWrapper),e.bindBuffers(this._vertexBuffers,this._indexBuffer,n._drawWrapper.effect),e.setAlphaMode(n.alphaMode);const s=a-h*n.position,u=l-c*n.position,d=n.size,p=n.size*e.getAspectRatio(this._scene.activeCamera,!0),f=s/(t.width+2*t.x)*2-1,_=1-u/(t.height+2*t.y)*2,m=o.y3.FromValues(d/2,0,0,0,0,p/2,0,0,0,0,1,0,f,_,0,1);n._drawWrapper.effect.setMatrix("viewportMatrix",m),n._drawWrapper.effect.setTexture("textureSampler",n.texture),n._drawWrapper.effect.setFloat4("color",n.color.r*r,n.color.g*r,n.color.b*r,1),e.drawElementsType(cs.F.TriangleFillMode,0,6)}return e.setDepthBuffer(!0),e.setAlphaMode(0),!0}rebuild(){var e;this._createIndexBuffer();for(const t in this._vertexBuffers)null===(e=this._vertexBuffers[t])||void 0===e||e._rebuild()}dispose(){const e=this._vertexBuffers[qe.o.PositionKind];for(e&&(e.dispose(),this._vertexBuffers[qe.o.PositionKind]=null),this._indexBuffer&&(this._scene.getEngine()._releaseBuffer(this._indexBuffer),this._indexBuffer=null);this.lensFlares.length;)this.lensFlares[0].dispose();const t=this._scene.lensFlareSystems.indexOf(this);this._scene.lensFlareSystems.splice(t,1)}static Parse(e,t,i){const n=t.getLastEntryById(e.emitterId),s=e.name||"lensFlareSystem#"+e.emitterId,r=new ah(s,n,t);r.id=e.id||s,r.borderLimit=e.borderLimit;for(let t=0;t<e.flares.length;t++){const n=e.flares[t];oh.AddFlare(n.size,n.position,a.Wo.FromArray(n.color),n.textureName?i+n.textureName:"",r)}return r}serialize(){const e={};e.id=this.id,e.name=this.name,e.emitterId=this.getEmitter().id,e.borderLimit=this.borderLimit,e.flares=[];for(let t=0;t<this.lensFlares.length;t++){const i=this.lensFlares[t];e.flares.push({size:i.size,position:i.position,color:i.color.asArray(),textureName:de.w1.GetFilename(i.texture?i.texture.name:"")})}return e}}ah._SceneComponentInitialization=e=>{throw(0,Zl.S)("LensFlareSystemSceneComponent")},n.p.AddParser(ve.l.NAME_LENSFLARESYSTEM,((e,t,i,n)=>{if(void 0!==e.lensFlareSystems&&null!==e.lensFlareSystems){i.lensFlareSystems||(i.lensFlareSystems=new Array);for(let s=0,r=e.lensFlareSystems.length;s<r;s++){const r=e.lensFlareSystems[s],o=ah.Parse(r,t,n);i.lensFlareSystems.push(o)}}})),n.p.prototype.getLensFlareSystemByName=function(e){for(let t=0;t<this.lensFlareSystems.length;t++)if(this.lensFlareSystems[t].name===e)return this.lensFlareSystems[t];return null},n.p.prototype.getLensFlareSystemById=function(e){for(let t=0;t<this.lensFlareSystems.length;t++)if(this.lensFlareSystems[t].id===e)return this.lensFlareSystems[t];return null},n.p.prototype.getLensFlareSystemByID=function(e){return this.getLensFlareSystemById(e)},n.p.prototype.removeLensFlareSystem=function(e){const t=this.lensFlareSystems.indexOf(e);return-1!==t&&this.lensFlareSystems.splice(t,1),t},n.p.prototype.addLensFlareSystem=function(e){this.lensFlareSystems.push(e)};class lh{constructor(e){this.name=ve.l.NAME_LENSFLARESYSTEM,this.scene=e,e.lensFlareSystems=new Array}register(){this.scene._afterCameraDrawStage.registerStep(ve.l.STEP_AFTERCAMERADRAW_LENSFLARESYSTEM,this,this._draw)}rebuild(){for(let e=0;e<this.scene.lensFlareSystems.length;e++)this.scene.lensFlareSystems[e].rebuild()}addFromContainer(e){e.lensFlareSystems&&e.lensFlareSystems.forEach((e=>{this.scene.addLensFlareSystem(e)}))}removeFromContainer(e,t){e.lensFlareSystems&&e.lensFlareSystems.forEach((e=>{this.scene.removeLensFlareSystem(e),t&&e.dispose()}))}serialize(e){e.lensFlareSystems=[];const t=this.scene.lensFlareSystems;for(const i of t)e.lensFlareSystems.push(i.serialize())}dispose(){const e=this.scene.lensFlareSystems;for(;e.length;)e[0].dispose()}_draw(e){if(this.scene.lensFlaresEnabled){const t=this.scene.lensFlareSystems;de.w1.StartPerformanceCounter("Lens flares",t.length>0);for(const i of t)0!=(e.layerMask&i.layerMask)&&i.render();de.w1.EndPerformanceCounter("Lens flares",t.length>0)}}}ah._SceneComponentInitialization=e=>{let t=e._getComponent(ve.l.NAME_LENSFLARESYSTEM);t||(t=new lh(e),e._addComponent(t))};var hh=i(9311),ch=i(6792),uh=i(4221);si.v.IncludesShadersStore.bayerDitherFunctions="float bayerDither2(vec2 _P) {\nreturn mod(2.0*_P.y+_P.x+1.0,4.0);\n}\nfloat bayerDither4(vec2 _P) {\nvec2 P1=mod(_P,2.0); \nvec2 P2=floor(0.5*mod(_P,4.0)); \nreturn 4.0*bayerDither2(P1)+bayerDither2(P2);\n}\nfloat bayerDither8(vec2 _P) {\nvec2 P1=mod(_P,2.0); \nvec2 P2=floor(0.5 *mod(_P,4.0)); \nvec2 P4=floor(0.25*mod(_P,8.0)); \nreturn 4.0*(4.0*bayerDither2(P1)+bayerDither2(P2))+bayerDither2(P4);\n}\n";si.v.IncludesShadersStore.shadowMapFragmentExtraDeclaration="#if SM_FLOAT==0\n#include<packingFunctions>\n#endif\n#if SM_SOFTTRANSPARENTSHADOW==1\n#include<bayerDitherFunctions>\nuniform float softTransparentShadowSM;\n#endif\nvarying float vDepthMetricSM;\n#if SM_USEDISTANCE==1\nuniform vec3 lightDataSM;\nvarying vec3 vPositionWSM;\n#endif\nuniform vec3 biasAndScaleSM;\nuniform vec2 depthValuesSM;\n#if defined(SM_DEPTHCLAMP) && SM_DEPTHCLAMP==1\nvarying float zSM;\n#endif\n";si.v.IncludesShadersStore.shadowMapFragment="float depthSM=vDepthMetricSM;\n#if defined(SM_DEPTHCLAMP) && SM_DEPTHCLAMP==1\n#if SM_USEDISTANCE==1\ndepthSM=(length(vPositionWSM-lightDataSM)+depthValuesSM.x)/depthValuesSM.y+biasAndScaleSM.x;\n#else\n#ifdef USE_REVERSE_DEPTHBUFFER\ndepthSM=(-zSM+depthValuesSM.x)/depthValuesSM.y+biasAndScaleSM.x;\n#else\ndepthSM=(zSM+depthValuesSM.x)/depthValuesSM.y+biasAndScaleSM.x;\n#endif\n#endif\n#ifdef USE_REVERSE_DEPTHBUFFER\ngl_FragDepth=clamp(1.0-depthSM,0.0,1.0);\n#else\ngl_FragDepth=clamp(depthSM,0.0,1.0); \n#endif\n#elif SM_USEDISTANCE==1\ndepthSM=(length(vPositionWSM-lightDataSM)+depthValuesSM.x)/depthValuesSM.y+biasAndScaleSM.x;\n#endif\n#if SM_ESM==1\ndepthSM=clamp(exp(-min(87.,biasAndScaleSM.z*depthSM)),0.,1.);\n#endif\n#if SM_FLOAT==1\ngl_FragColor=vec4(depthSM,1.0,1.0,1.0);\n#else\ngl_FragColor=pack(depthSM);\n#endif\nreturn;";si.v.ShadersStore.shadowMapPixelShader="#include<shadowMapFragmentExtraDeclaration>\n#ifdef ALPHATEXTURE\nvarying vec2 vUV;\nuniform sampler2D diffuseSampler;\n#endif\n#include<clipPlaneFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\n#include<clipPlaneFragment>\n#ifdef ALPHATEXTURE\nfloat alphaFromAlphaTexture=texture2D(diffuseSampler,vUV).a;\n#ifdef ALPHATESTVALUE\nif (alphaFromAlphaTexture<ALPHATESTVALUE)\ndiscard;\n#endif\n#endif\n#if SM_SOFTTRANSPARENTSHADOW==1\n#ifdef ALPHATEXTURE\nif ((bayerDither8(floor(mod(gl_FragCoord.xy,8.0))))/64.0>=softTransparentShadowSM*alphaFromAlphaTexture) discard;\n#else\nif ((bayerDither8(floor(mod(gl_FragCoord.xy,8.0))))/64.0>=softTransparentShadowSM) discard;\n#endif\n#endif\n#include<shadowMapFragment>\n}";si.v.IncludesShadersStore.sceneVertexDeclaration="uniform mat4 viewProjection;\n#ifdef MULTIVIEW\nuniform mat4 viewProjectionR;\n#endif\nuniform mat4 view;\nuniform mat4 projection;\nuniform vec4 vEyePosition;\n";si.v.IncludesShadersStore.meshVertexDeclaration="uniform mat4 world;\nuniform float visibility;\n";si.v.IncludesShadersStore.shadowMapVertexDeclaration="#include<sceneVertexDeclaration>\n#include<meshVertexDeclaration>\n",i(4804);si.v.IncludesShadersStore.shadowMapUboDeclaration="layout(std140,column_major) uniform;\n#include<sceneUboDeclaration>\n#include<meshUboDeclaration>\n";si.v.IncludesShadersStore.shadowMapVertexExtraDeclaration="#if SM_NORMALBIAS==1\nuniform vec3 lightDataSM;\n#endif\nuniform vec3 biasAndScaleSM;\nuniform vec2 depthValuesSM;\nvarying float vDepthMetricSM;\n#if SM_USEDISTANCE==1\nvarying vec3 vPositionWSM;\n#endif\n#if defined(SM_DEPTHCLAMP) && SM_DEPTHCLAMP==1\nvarying float zSM;\n#endif\n";si.v.IncludesShadersStore.shadowMapVertexNormalBias="#if SM_NORMALBIAS==1\n#if SM_DIRECTIONINLIGHTDATA==1\nvec3 worldLightDirSM=normalize(-lightDataSM.xyz);\n#else\nvec3 directionToLightSM=lightDataSM.xyz-worldPos.xyz;\nvec3 worldLightDirSM=normalize(directionToLightSM);\n#endif\nfloat ndlSM=dot(vNormalW,worldLightDirSM);\nfloat sinNLSM=sqrt(1.0-ndlSM*ndlSM);\nfloat normalBiasSM=biasAndScaleSM.y*sinNLSM;\nworldPos.xyz-=vNormalW*normalBiasSM;\n#endif\n";si.v.IncludesShadersStore.shadowMapVertexMetric="#if SM_USEDISTANCE==1\nvPositionWSM=worldPos.xyz;\n#endif\n#if SM_DEPTHTEXTURE==1\n#ifdef IS_NDC_HALF_ZRANGE\n#define BIASFACTOR 0.5\n#else\n#define BIASFACTOR 1.0\n#endif\n#ifdef USE_REVERSE_DEPTHBUFFER\ngl_Position.z-=biasAndScaleSM.x*gl_Position.w*BIASFACTOR;\n#else\ngl_Position.z+=biasAndScaleSM.x*gl_Position.w*BIASFACTOR;\n#endif\n#endif\n#if defined(SM_DEPTHCLAMP) && SM_DEPTHCLAMP==1\nzSM=gl_Position.z;\ngl_Position.z=0.0;\n#elif SM_USEDISTANCE==0\n#ifdef USE_REVERSE_DEPTHBUFFER\nvDepthMetricSM=(-gl_Position.z+depthValuesSM.x)/depthValuesSM.y+biasAndScaleSM.x;\n#else\nvDepthMetricSM=(gl_Position.z+depthValuesSM.x)/depthValuesSM.y+biasAndScaleSM.x;\n#endif\n#endif\n";si.v.ShadersStore.shadowMapVertexShader="attribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<morphTargetsVertexGlobalDeclaration>\n#include<morphTargetsVertexDeclaration>[0..maxSimultaneousMorphTargets]\n#ifdef INSTANCES\nattribute vec4 world0;\nattribute vec4 world1;\nattribute vec4 world2;\nattribute vec4 world3;\n#endif\n#include<helperFunctions>\n#include<__decl__shadowMapVertex>\n#ifdef ALPHATEXTURE\nvarying vec2 vUV;\nuniform mat4 diffuseMatrix;\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#endif\n#include<shadowMapVertexExtraDeclaration>\n#include<clipPlaneVertexDeclaration>\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void)\n{\nvec3 positionUpdated=position;\n#ifdef UV1\nvec2 uvUpdated=uv;\n#endif\n#ifdef NORMAL\nvec3 normalUpdated=normal;\n#endif\n#include<morphTargetsVertexGlobal>\n#include<morphTargetsVertex>[0..maxSimultaneousMorphTargets]\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(positionUpdated,1.0);\n#ifdef NORMAL\nmat3 normWorldSM=mat3(finalWorld);\n#if defined(INSTANCES) && defined(THIN_INSTANCES)\nvec3 vNormalW=normalUpdated/vec3(dot(normWorldSM[0],normWorldSM[0]),dot(normWorldSM[1],normWorldSM[1]),dot(normWorldSM[2],normWorldSM[2]));\nvNormalW=normalize(normWorldSM*vNormalW);\n#else\n#ifdef NONUNIFORMSCALING\nnormWorldSM=transposeMat3(inverseMat3(normWorldSM));\n#endif\nvec3 vNormalW=normalize(normWorldSM*normalUpdated);\n#endif\n#endif\n#include<shadowMapVertexNormalBias>\ngl_Position=viewProjection*worldPos;\n#include<shadowMapVertexMetric>\n#ifdef ALPHATEXTURE\n#ifdef UV1\nvUV=vec2(diffuseMatrix*vec4(uvUpdated,1.0,0.0));\n#endif\n#ifdef UV2\nvUV=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));\n#endif\n#endif\n#include<clipPlaneVertex>\n}";si.v.ShadersStore.depthBoxBlurPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform vec2 screenSize;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nvec4 colorDepth=vec4(0.0);\nfor (int x=-OFFSET; x<=OFFSET; x++)\nfor (int y=-OFFSET; y<=OFFSET; y++)\ncolorDepth+=texture2D(textureSampler,vUV+vec2(x,y)/screenSize);\ngl_FragColor=(colorDepth/float((OFFSET*2+1)*(OFFSET*2+1)));\n}";si.v.IncludesShadersStore.shadowMapFragmentSoftTransparentShadow="#if SM_SOFTTRANSPARENTSHADOW==1\nif ((bayerDither8(floor(mod(gl_FragCoord.xy,8.0))))/64.0>=softTransparentShadowSM*alpha) discard;\n#endif\n";class dh{get bias(){return this._bias}set bias(e){this._bias=e}get normalBias(){return this._normalBias}set normalBias(e){this._normalBias=e}get blurBoxOffset(){return this._blurBoxOffset}set blurBoxOffset(e){this._blurBoxOffset!==e&&(this._blurBoxOffset=e,this._disposeBlurPostProcesses())}get blurScale(){return this._blurScale}set blurScale(e){this._blurScale!==e&&(this._blurScale=e,this._disposeBlurPostProcesses())}get blurKernel(){return this._blurKernel}set blurKernel(e){this._blurKernel!==e&&(this._blurKernel=e,this._disposeBlurPostProcesses())}get useKernelBlur(){return this._useKernelBlur}set useKernelBlur(e){this._useKernelBlur!==e&&(this._useKernelBlur=e,this._disposeBlurPostProcesses())}get depthScale(){return void 0!==this._depthScale?this._depthScale:this._light.getDepthScale()}set depthScale(e){this._depthScale=e}_validateFilter(e){return e}get filter(){return this._filter}set filter(e){if(e=this._validateFilter(e),this._light.needCube()){if(e===dh.FILTER_BLUREXPONENTIALSHADOWMAP)return void(this.useExponentialShadowMap=!0);if(e===dh.FILTER_BLURCLOSEEXPONENTIALSHADOWMAP)return void(this.useCloseExponentialShadowMap=!0);if(e===dh.FILTER_PCF||e===dh.FILTER_PCSS)return void(this.usePoissonSampling=!0)}e!==dh.FILTER_PCF&&e!==dh.FILTER_PCSS||this._scene.getEngine()._features.supportShadowSamplers?this._filter!==e&&(this._filter=e,this._disposeBlurPostProcesses(),this._applyFilterValues(),this._light._markMeshesAsLightDirty()):this.usePoissonSampling=!0}get usePoissonSampling(){return this.filter===dh.FILTER_POISSONSAMPLING}set usePoissonSampling(e){const t=this._validateFilter(dh.FILTER_POISSONSAMPLING);(e||this.filter===dh.FILTER_POISSONSAMPLING)&&(this.filter=e?t:dh.FILTER_NONE)}get useExponentialShadowMap(){return this.filter===dh.FILTER_EXPONENTIALSHADOWMAP}set useExponentialShadowMap(e){const t=this._validateFilter(dh.FILTER_EXPONENTIALSHADOWMAP);(e||this.filter===dh.FILTER_EXPONENTIALSHADOWMAP)&&(this.filter=e?t:dh.FILTER_NONE)}get useBlurExponentialShadowMap(){return this.filter===dh.FILTER_BLUREXPONENTIALSHADOWMAP}set useBlurExponentialShadowMap(e){const t=this._validateFilter(dh.FILTER_BLUREXPONENTIALSHADOWMAP);(e||this.filter===dh.FILTER_BLUREXPONENTIALSHADOWMAP)&&(this.filter=e?t:dh.FILTER_NONE)}get useCloseExponentialShadowMap(){return this.filter===dh.FILTER_CLOSEEXPONENTIALSHADOWMAP}set useCloseExponentialShadowMap(e){const t=this._validateFilter(dh.FILTER_CLOSEEXPONENTIALSHADOWMAP);(e||this.filter===dh.FILTER_CLOSEEXPONENTIALSHADOWMAP)&&(this.filter=e?t:dh.FILTER_NONE)}get useBlurCloseExponentialShadowMap(){return this.filter===dh.FILTER_BLURCLOSEEXPONENTIALSHADOWMAP}set useBlurCloseExponentialShadowMap(e){const t=this._validateFilter(dh.FILTER_BLURCLOSEEXPONENTIALSHADOWMAP);(e||this.filter===dh.FILTER_BLURCLOSEEXPONENTIALSHADOWMAP)&&(this.filter=e?t:dh.FILTER_NONE)}get usePercentageCloserFiltering(){return this.filter===dh.FILTER_PCF}set usePercentageCloserFiltering(e){const t=this._validateFilter(dh.FILTER_PCF);(e||this.filter===dh.FILTER_PCF)&&(this.filter=e?t:dh.FILTER_NONE)}get filteringQuality(){return this._filteringQuality}set filteringQuality(e){this._filteringQuality!==e&&(this._filteringQuality=e,this._disposeBlurPostProcesses(),this._applyFilterValues(),this._light._markMeshesAsLightDirty())}get useContactHardeningShadow(){return this.filter===dh.FILTER_PCSS}set useContactHardeningShadow(e){const t=this._validateFilter(dh.FILTER_PCSS);(e||this.filter===dh.FILTER_PCSS)&&(this.filter=e?t:dh.FILTER_NONE)}get contactHardeningLightSizeUVRatio(){return this._contactHardeningLightSizeUVRatio}set contactHardeningLightSizeUVRatio(e){this._contactHardeningLightSizeUVRatio=e}get darkness(){return this._darkness}set darkness(e){this.setDarkness(e)}getDarkness(){return this._darkness}setDarkness(e){return this._darkness=e>=1?1:e<=0?0:e,this}get transparencyShadow(){return this._transparencyShadow}set transparencyShadow(e){this.setTransparencyShadow(e)}setTransparencyShadow(e){return this._transparencyShadow=e,this}getShadowMap(){return this._shadowMap}getShadowMapForRendering(){return this._shadowMap2?this._shadowMap2:this._shadowMap}getClassName(){return dh.CLASSNAME}addShadowCaster(e,t=!0){if(!this._shadowMap)return this;if(this._shadowMap.renderList||(this._shadowMap.renderList=[]),-1===this._shadowMap.renderList.indexOf(e)&&this._shadowMap.renderList.push(e),t)for(const t of e.getChildMeshes())-1===this._shadowMap.renderList.indexOf(t)&&this._shadowMap.renderList.push(t);return this}removeShadowCaster(e,t=!0){if(!this._shadowMap||!this._shadowMap.renderList)return this;const i=this._shadowMap.renderList.indexOf(e);if(-1!==i&&this._shadowMap.renderList.splice(i,1),t)for(const t of e.getChildren())this.removeShadowCaster(t);return this}getLight(){return this._light}_getCamera(){var e;return null!==(e=this._camera)&&void 0!==e?e:this._scene.activeCamera}get mapSize(){return this._mapSize}set mapSize(e){this._mapSize=e,this._light._markMeshesAsLightDirty(),this.recreateShadowMap()}constructor(e,t,i,n){this.onBeforeShadowMapRenderObservable=new r.y$,this.onAfterShadowMapRenderObservable=new r.y$,this.onBeforeShadowMapRenderMeshObservable=new r.y$,this.onAfterShadowMapRenderMeshObservable=new r.y$,this._bias=5e-5,this._normalBias=0,this._blurBoxOffset=1,this._blurScale=2,this._blurKernel=1,this._useKernelBlur=!1,this._filter=dh.FILTER_NONE,this._filteringQuality=dh.QUALITY_HIGH,this._contactHardeningLightSizeUVRatio=.1,this._darkness=0,this._transparencyShadow=!1,this.enableSoftTransparentShadow=!1,this.useOpacityTextureForTransparentShadow=!1,this.frustumEdgeFalloff=0,this.forceBackFacesOnly=!1,this._lightDirection=o.P.Zero(),this._viewMatrix=o.y3.Zero(),this._projectionMatrix=o.y3.Zero(),this._transformMatrix=o.y3.Zero(),this._cachedPosition=new o.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),this._cachedDirection=new o.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),this._currentFaceIndex=0,this._currentFaceIndexCache=0,this._defaultTextureMatrix=o.y3.Identity(),this._mapSize=e,this._light=t,this._scene=t.getScene(),this._camera=null!=n?n:null;let s=t._shadowGenerators;s||(s=t._shadowGenerators=new Map),s.set(this._camera,this),this.id=t.id,this._useUBO=this._scene.getEngine().supportsUniformBuffers,this._useUBO&&(this._sceneUBOs=[],this._sceneUBOs.push(this._scene.createSceneUniformBuffer(`Scene for Shadow Generator (light "${this._light.name}")`))),dh._SceneComponentInitialization(this._scene);const a=this._scene.getEngine().getCaps();i?a.textureFloatRender&&a.textureFloatLinearFiltering?this._textureType=1:a.textureHalfFloatRender&&a.textureHalfFloatLinearFiltering?this._textureType=2:this._textureType=0:a.textureHalfFloatRender&&a.textureHalfFloatLinearFiltering?this._textureType=2:a.textureFloatRender&&a.textureFloatLinearFiltering?this._textureType=1:this._textureType=0,this._initializeGenerator(),this._applyFilterValues()}_initializeGenerator(){this._light._markMeshesAsLightDirty(),this._initializeShadowMap()}_createTargetRenderTexture(){const e=this._scene.getEngine();e._features.supportDepthStencilTexture?(this._shadowMap=new Ai._(this._light.name+"_shadowMap",this._mapSize,this._scene,!1,!0,this._textureType,this._light.needCube(),void 0,!1,!1),this._shadowMap.createDepthStencilTexture(e.useReverseDepthBuffer?516:513,!0)):this._shadowMap=new Ai._(this._light.name+"_shadowMap",this._mapSize,this._scene,!1,!0,this._textureType,this._light.needCube())}_initializeShadowMap(){if(this._createTargetRenderTexture(),null===this._shadowMap)return;this._shadowMap.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._shadowMap.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._shadowMap.anisotropicFilteringLevel=1,this._shadowMap.updateSamplingMode(Ce.x.BILINEAR_SAMPLINGMODE),this._shadowMap.renderParticles=!1,this._shadowMap.ignoreCameraViewport=!0,this._storedUniqueId&&(this._shadowMap.uniqueId=this._storedUniqueId),this._shadowMap.customRenderFunction=this._renderForShadowMap.bind(this),this._shadowMap.customIsReadyFunction=()=>!0;const e=this._scene.getEngine();this._shadowMap.onBeforeBindObservable.add((()=>{var t;this._currentSceneUBO=this._scene.getSceneUniformBuffer(),null===(t=e._debugPushGroup)||void 0===t||t.call(e,`shadow map generation for pass id ${e.currentRenderPassId}`,1)})),this._shadowMap.onBeforeRenderObservable.add((t=>{this._sceneUBOs&&this._scene.setSceneUniformBuffer(this._sceneUBOs[0]),this._currentFaceIndex=t,this._filter===dh.FILTER_PCF&&e.setColorWrite(!1),this.getTransformMatrix(),this._scene.setTransformMatrix(this._viewMatrix,this._projectionMatrix),this._useUBO&&(this._scene.getSceneUniformBuffer().unbindEffect(),this._scene.finalizeSceneUbo())})),this._shadowMap.onAfterUnbindObservable.add((()=>{var t,i;if(this._sceneUBOs&&this._scene.setSceneUniformBuffer(this._currentSceneUBO),this._scene.updateTransformMatrix(),this._filter===dh.FILTER_PCF&&e.setColorWrite(!0),!this.useBlurExponentialShadowMap&&!this.useBlurCloseExponentialShadowMap)return void(null===(t=e._debugPopGroup)||void 0===t||t.call(e,1));const n=this.getShadowMapForRendering();n&&(this._scene.postProcessManager.directRender(this._blurPostProcesses,n.renderTarget,!0),e.unBindFramebuffer(n.renderTarget,!0),null===(i=e._debugPopGroup)||void 0===i||i.call(e,1))}));const t=new a.HE(0,0,0,0),i=new a.HE(1,1,1,1);this._shadowMap.onClearObservable.add((e=>{this._filter===dh.FILTER_PCF?e.clear(i,!1,!0,!1):this.useExponentialShadowMap||this.useBlurExponentialShadowMap?e.clear(t,!0,!0,!1):e.clear(i,!0,!0,!1)})),this._shadowMap.onResizeObservable.add((e=>{this._storedUniqueId=this._shadowMap.uniqueId,this._mapSize=e.getRenderSize(),this._light._markMeshesAsLightDirty(),this.recreateShadowMap()}));for(let e=uh.$.MIN_RENDERINGGROUPS;e<uh.$.MAX_RENDERINGGROUPS;e++)this._shadowMap.setRenderingAutoClearDepthStencil(e,!1)}_initializeBlurRTTAndPostProcesses(){const e=this._scene.getEngine(),t=this._mapSize/this.blurScale;this.useKernelBlur&&1===this.blurScale||(this._shadowMap2=new Ai._(this._light.name+"_shadowMap2",t,this._scene,!1,!0,this._textureType,void 0,void 0,!1),this._shadowMap2.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._shadowMap2.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._shadowMap2.updateSamplingMode(Ce.x.BILINEAR_SAMPLINGMODE)),this.useKernelBlur?(this._kernelBlurXPostprocess=new wa(this._light.name+"KernelBlurX",new o.FM(1,0),this.blurKernel,1,null,Ce.x.BILINEAR_SAMPLINGMODE,e,!1,this._textureType),this._kernelBlurXPostprocess.width=t,this._kernelBlurXPostprocess.height=t,this._kernelBlurXPostprocess.externalTextureSamplerBinding=!0,this._kernelBlurXPostprocess.onApplyObservable.add((e=>{e.setTexture("textureSampler",this._shadowMap)})),this._kernelBlurYPostprocess=new wa(this._light.name+"KernelBlurY",new o.FM(0,1),this.blurKernel,1,null,Ce.x.BILINEAR_SAMPLINGMODE,e,!1,this._textureType),this._kernelBlurXPostprocess.autoClear=!1,this._kernelBlurYPostprocess.autoClear=!1,0===this._textureType&&(this._kernelBlurXPostprocess.packedFloat=!0,this._kernelBlurYPostprocess.packedFloat=!0),this._blurPostProcesses=[this._kernelBlurXPostprocess,this._kernelBlurYPostprocess]):(this._boxBlurPostprocess=new ni.D(this._light.name+"DepthBoxBlur","depthBoxBlur",["screenSize","boxOffset"],[],1,null,Ce.x.BILINEAR_SAMPLINGMODE,e,!1,"#define OFFSET "+this._blurBoxOffset,this._textureType),this._boxBlurPostprocess.externalTextureSamplerBinding=!0,this._boxBlurPostprocess.onApplyObservable.add((e=>{e.setFloat2("screenSize",t,t),e.setTexture("textureSampler",this._shadowMap)})),this._boxBlurPostprocess.autoClear=!1,this._blurPostProcesses=[this._boxBlurPostprocess])}_renderForShadowMap(e,t,i,n){let s;if(n.length)for(s=0;s<n.length;s++)this._renderSubMeshForShadowMap(n.data[s]);for(s=0;s<e.length;s++)this._renderSubMeshForShadowMap(e.data[s]);for(s=0;s<t.length;s++)this._renderSubMeshForShadowMap(t.data[s]);if(this._transparencyShadow)for(s=0;s<i.length;s++)this._renderSubMeshForShadowMap(i.data[s],!0);else for(s=0;s<i.length;s++)i.data[s].getEffectiveMesh()._internalAbstractMeshDataInfo._isActiveIntermediate=!1}_bindCustomEffectForRenderSubMeshForShadowMap(e,t,i){t.setMatrix("viewProjection",this.getTransformMatrix())}_renderSubMeshForShadowMap(e,t=!1){var i,n;const s=e.getRenderingMesh(),r=e.getEffectiveMesh(),o=this._scene,a=o.getEngine(),l=e.getMaterial();if(r._internalAbstractMeshDataInfo._isActiveIntermediate=!1,!l||0===e.verticesCount||e._renderId===o.getRenderId())return;const h=r._getWorldMatrixDeterminant()<0;let c=null!==(i=s.overrideMaterialSideOrientation)&&void 0!==i?i:l.sideOrientation;h&&(c=0===c?1:0);const u=0===c;a.setState(l.backFaceCulling,void 0,void 0,u,l.cullBackFaces);const d=s._getInstancesRenderList(e._id,!!e.getReplacementMesh());if(d.mustReturn)return;const p=a.getCaps().instancedArrays&&(null!==d.visibleInstances[e._id]&&void 0!==d.visibleInstances[e._id]||s.hasThinInstances);if(!this.customAllowRendering||this.customAllowRendering(e))if(this.isReady(e,p,t)){e._renderId=o.getRenderId();const i=l.shadowDepthWrapper,h=null!==(n=null==i?void 0:i.getEffect(e,this,a.currentRenderPassId))&&void 0!==n?n:e._getDrawWrapper(),c=Ps.q.GetEffect(h);a.enableEffect(h),p||s._bind(e,c,l.fillMode),this.getTransformMatrix(),c.setFloat3("biasAndScaleSM",this.bias,this.normalBias,this.depthScale),this.getLight().getTypeID()===hh._.LIGHTTYPEID_DIRECTIONALLIGHT?c.setVector3("lightDataSM",this._cachedDirection):c.setVector3("lightDataSM",this._cachedPosition);const u=this._getCamera();if(u&&c.setFloat2("depthValuesSM",this.getLight().getDepthMinZ(u),this.getLight().getDepthMinZ(u)+this.getLight().getDepthMaxZ(u)),t&&this.enableSoftTransparentShadow&&c.setFloat("softTransparentShadowSM",r.visibility*l.alpha),i)e._setMainDrawWrapperOverride(h),i.standalone?i.baseMaterial.bindForSubMesh(r.getWorldMatrix(),s,e):l.bindForSubMesh(r.getWorldMatrix(),s,e),e._setMainDrawWrapperOverride(null);else{if(this._opacityTexture&&(c.setTexture("diffuseSampler",this._opacityTexture),c.setMatrix("diffuseMatrix",this._opacityTexture.getTextureMatrix()||this._defaultTextureMatrix)),s.useBones&&s.computeBonesUsingShaders&&s.skeleton){const e=s.skeleton;if(e.isUsingTextureForMatrices){const t=e.getTransformMatrixTexture(s);if(!t)return;c.setTexture("boneSampler",t),c.setFloat("boneTextureWidth",4*(e.bones.length+1))}else c.setMatrices("mBones",e.getTransformMatrices(s))}La.G.BindMorphTargetParameters(s,c),s.morphTargetManager&&s.morphTargetManager.isUsingTextureForTargets&&s.morphTargetManager._bind(c),(0,Ga.an)(c,l,o)}this._useUBO||i||this._bindCustomEffectForRenderSubMeshForShadowMap(e,c,r),La.G.BindSceneUniformBuffer(c,this._scene.getSceneUniformBuffer()),this._scene.getSceneUniformBuffer().bindUniformBuffer();const f=r.getWorldMatrix();p&&(r.getMeshUniformBuffer().bindToEffect(c,"Mesh"),r.transferToEffect(f)),this.forceBackFacesOnly&&a.setState(!0,0,!1,!0,l.cullBackFaces),this.onBeforeShadowMapRenderMeshObservable.notifyObservers(s),this.onBeforeShadowMapRenderObservable.notifyObservers(c),s._processRendering(r,e,c,l.fillMode,d,p,((e,t)=>{r===s||e?(r.getMeshUniformBuffer().bindToEffect(c,"Mesh"),r.transferToEffect(e?t:f)):(s.getMeshUniformBuffer().bindToEffect(c,"Mesh"),s.transferToEffect(t))})),this.forceBackFacesOnly&&a.setState(!0,0,!1,!1,l.cullBackFaces),this.onAfterShadowMapRenderObservable.notifyObservers(c),this.onAfterShadowMapRenderMeshObservable.notifyObservers(s)}else this._shadowMap&&this._shadowMap.resetRefreshCounter()}_applyFilterValues(){this._shadowMap&&(this.filter===dh.FILTER_NONE||this.filter===dh.FILTER_PCSS?this._shadowMap.updateSamplingMode(Ce.x.NEAREST_SAMPLINGMODE):this._shadowMap.updateSamplingMode(Ce.x.BILINEAR_SAMPLINGMODE))}forceCompilation(e,t){const i={useInstances:!1,...t},n=this.getShadowMap();if(!n)return void(e&&e(this));const s=n.renderList;if(!s)return void(e&&e(this));const r=new Array;for(const e of s)r.push(...e.subMeshes);if(0===r.length)return void(e&&e(this));let o=0;const a=()=>{var t,n;if(this._scene&&this._scene.getEngine()){for(;this.isReady(r[o],i.useInstances,null!==(n=null===(t=r[o].getMaterial())||void 0===t?void 0:t.needAlphaBlendingForMesh(r[o].getMesh()))&&void 0!==n&&n);)if(o++,o>=r.length)return void(e&&e(this));setTimeout(a,16)}};a()}forceCompilationAsync(e){return new Promise((t=>{this.forceCompilation((()=>{t()}),e)}))}_isReadyCustomDefines(e,t,i){}_prepareShadowDefines(e,t,i,n){i.push("#define SM_LIGHTTYPE_"+this._light.getClassName().toUpperCase()),i.push("#define SM_FLOAT "+(0!==this._textureType?"1":"0")),i.push("#define SM_ESM "+(this.useExponentialShadowMap||this.useBlurExponentialShadowMap?"1":"0")),i.push("#define SM_DEPTHTEXTURE "+(this.usePercentageCloserFiltering||this.useContactHardeningShadow?"1":"0"));const s=e.getMesh();return i.push("#define SM_NORMALBIAS "+(this.normalBias&&s.isVerticesDataPresent(qe.o.NormalKind)?"1":"0")),i.push("#define SM_DIRECTIONINLIGHTDATA "+(this.getLight().getTypeID()===hh._.LIGHTTYPEID_DIRECTIONALLIGHT?"1":"0")),i.push("#define SM_USEDISTANCE "+(this._light.needCube()?"1":"0")),i.push("#define SM_SOFTTRANSPARENTSHADOW "+(this.enableSoftTransparentShadow&&n?"1":"0")),this._isReadyCustomDefines(i,e,t),i}isReady(e,t,i){var n;const s=e.getMaterial(),r=null==s?void 0:s.shadowDepthWrapper;if(this._opacityTexture=null,!s)return!1;const o=[];if(this._prepareShadowDefines(e,t,o,i),r){if(!r.isReadyForSubMesh(e,o,this,t,this._scene.getEngine().currentRenderPassId))return!1}else{const i=e._getDrawWrapper(void 0,!0);let r=i.effect,a=i.defines;const l=[qe.o.PositionKind],h=e.getMesh();this.normalBias&&h.isVerticesDataPresent(qe.o.NormalKind)&&(l.push(qe.o.NormalKind),o.push("#define NORMAL"),h.nonUniformScaling&&o.push("#define NONUNIFORMSCALING"));const c=s.needAlphaTesting();if((c||s.needAlphaBlending())&&(this.useOpacityTextureForTransparentShadow?this._opacityTexture=s.opacityTexture:this._opacityTexture=s.getAlphaTestTexture(),this._opacityTexture)){if(!this._opacityTexture.isReady())return!1;const e=null!==(n=s.alphaCutOff)&&void 0!==n?n:dh.DEFAULT_ALPHA_CUTOFF;o.push("#define ALPHATEXTURE"),c&&o.push(`#define ALPHATESTVALUE ${e}${e%1==0?".":""}`),h.isVerticesDataPresent(qe.o.UVKind)&&(l.push(qe.o.UVKind),o.push("#define UV1")),h.isVerticesDataPresent(qe.o.UV2Kind)&&1===this._opacityTexture.coordinatesIndex&&(l.push(qe.o.UV2Kind),o.push("#define UV2"))}const u=new ka.L;if(h.useBones&&h.computeBonesUsingShaders&&h.skeleton){l.push(qe.o.MatricesIndicesKind),l.push(qe.o.MatricesWeightsKind),h.numBoneInfluencers>4&&(l.push(qe.o.MatricesIndicesExtraKind),l.push(qe.o.MatricesWeightsExtraKind));const e=h.skeleton;o.push("#define NUM_BONE_INFLUENCERS "+h.numBoneInfluencers),h.numBoneInfluencers>0&&u.addCPUSkinningFallback(0,h),e.isUsingTextureForMatrices?o.push("#define BONETEXTURE"):o.push("#define BonesPerMesh "+(e.bones.length+1))}else o.push("#define NUM_BONE_INFLUENCERS 0");const d=h.morphTargetManager;let p=0;if(d&&d.numInfluencers>0&&(o.push("#define MORPHTARGETS"),p=d.numInfluencers,o.push("#define NUM_MORPH_INFLUENCERS "+p),d.isUsingTextureForTargets&&o.push("#define MORPHTARGETS_TEXTURE"),La.G.PrepareAttributesForMorphTargetsInfluencers(l,h,p)),(0,Ga.lK)(s,this._scene,o),t&&(o.push("#define INSTANCES"),La.G.PushAttributesForInstances(l),e.getRenderingMesh().hasThinInstances&&o.push("#define THIN_INSTANCES")),this.customShaderOptions&&this.customShaderOptions.defines)for(const e of this.customShaderOptions.defines)-1===o.indexOf(e)&&o.push(e);const f=o.join("\n");if(a!==f){a=f;let e="shadowMap";const t=["world","mBones","viewProjection","diffuseMatrix","lightDataSM","depthValuesSM","biasAndScaleSM","morphTargetInfluences","boneTextureWidth","softTransparentShadowSM","morphTargetTextureInfo","morphTargetTextureIndices"],n=["diffuseSampler","boneSampler","morphTargets"],s=["Scene","Mesh"];if((0,Ga.qx)(t),this.customShaderOptions){if(e=this.customShaderOptions.shaderName,this.customShaderOptions.attributes)for(const e of this.customShaderOptions.attributes)-1===l.indexOf(e)&&l.push(e);if(this.customShaderOptions.uniforms)for(const e of this.customShaderOptions.uniforms)-1===t.indexOf(e)&&t.push(e);if(this.customShaderOptions.samplers)for(const e of this.customShaderOptions.samplers)-1===n.indexOf(e)&&n.push(e)}const o=this._scene.getEngine();r=o.createEffect(e,{attributes:l,uniformsNames:t,uniformBuffersNames:s,samplers:n,defines:f,fallbacks:u,onCompiled:null,onError:null,indexParameters:{maxSimultaneousMorphTargets:p}},o),i.setEffect(r,a)}if(!r.isReady())return!1}return(this.useBlurExponentialShadowMap||this.useBlurCloseExponentialShadowMap)&&(this._blurPostProcesses&&this._blurPostProcesses.length||this._initializeBlurRTTAndPostProcesses()),!(this._kernelBlurXPostprocess&&!this._kernelBlurXPostprocess.isReady()||this._kernelBlurYPostprocess&&!this._kernelBlurYPostprocess.isReady()||this._boxBlurPostprocess&&!this._boxBlurPostprocess.isReady())}prepareDefines(e,t){const i=this._scene,n=this._light;i.shadowsEnabled&&n.shadowEnabled&&(e["SHADOW"+t]=!0,this.useContactHardeningShadow?(e["SHADOWPCSS"+t]=!0,this._filteringQuality===dh.QUALITY_LOW?e["SHADOWLOWQUALITY"+t]=!0:this._filteringQuality===dh.QUALITY_MEDIUM&&(e["SHADOWMEDIUMQUALITY"+t]=!0)):this.usePercentageCloserFiltering?(e["SHADOWPCF"+t]=!0,this._filteringQuality===dh.QUALITY_LOW?e["SHADOWLOWQUALITY"+t]=!0:this._filteringQuality===dh.QUALITY_MEDIUM&&(e["SHADOWMEDIUMQUALITY"+t]=!0)):this.usePoissonSampling?e["SHADOWPOISSON"+t]=!0:this.useExponentialShadowMap||this.useBlurExponentialShadowMap?e["SHADOWESM"+t]=!0:(this.useCloseExponentialShadowMap||this.useBlurCloseExponentialShadowMap)&&(e["SHADOWCLOSEESM"+t]=!0),n.needCube()&&(e["SHADOWCUBE"+t]=!0))}bindShadowLight(e,t){const i=this._light;if(!this._scene.shadowsEnabled||!i.shadowEnabled)return;const n=this._getCamera();if(!n)return;const s=this.getShadowMap();s&&(i.needCube()||t.setMatrix("lightMatrix"+e,this.getTransformMatrix()),this._filter===dh.FILTER_PCF?(t.setDepthStencilTexture("shadowSampler"+e,this.getShadowMapForRendering()),i._uniformBuffer.updateFloat4("shadowsInfo",this.getDarkness(),s.getSize().width,1/s.getSize().width,this.frustumEdgeFalloff,e)):this._filter===dh.FILTER_PCSS?(t.setDepthStencilTexture("shadowSampler"+e,this.getShadowMapForRendering()),t.setTexture("depthSampler"+e,this.getShadowMapForRendering()),i._uniformBuffer.updateFloat4("shadowsInfo",this.getDarkness(),1/s.getSize().width,this._contactHardeningLightSizeUVRatio*s.getSize().width,this.frustumEdgeFalloff,e)):(t.setTexture("shadowSampler"+e,this.getShadowMapForRendering()),i._uniformBuffer.updateFloat4("shadowsInfo",this.getDarkness(),this.blurScale/s.getSize().width,this.depthScale,this.frustumEdgeFalloff,e)),i._uniformBuffer.updateFloat2("depthValues",this.getLight().getDepthMinZ(n),this.getLight().getDepthMinZ(n)+this.getLight().getDepthMaxZ(n),e))}getTransformMatrix(){const e=this._scene;if(this._currentRenderId===e.getRenderId()&&this._currentFaceIndexCache===this._currentFaceIndex)return this._transformMatrix;this._currentRenderId=e.getRenderId(),this._currentFaceIndexCache=this._currentFaceIndex;let t=this._light.position;if(this._light.computeTransformedInformation()&&(t=this._light.transformedPosition),o.P.NormalizeToRef(this._light.getShadowDirection(this._currentFaceIndex),this._lightDirection),1===Math.abs(o.P.Dot(this._lightDirection,o.P.Up()))&&(this._lightDirection.z=1e-13),this._light.needProjectionMatrixCompute()||!this._cachedPosition||!this._cachedDirection||!t.equals(this._cachedPosition)||!this._lightDirection.equals(this._cachedDirection)){this._cachedPosition.copyFrom(t),this._cachedDirection.copyFrom(this._lightDirection),o.y3.LookAtLHToRef(t,t.add(this._lightDirection),o.P.Up(),this._viewMatrix);const e=this.getShadowMap();if(e){const t=e.renderList;t&&this._light.setShadowProjectionMatrix(this._projectionMatrix,this._viewMatrix,t)}this._viewMatrix.multiplyToRef(this._projectionMatrix,this._transformMatrix)}return this._transformMatrix}recreateShadowMap(){const e=this._shadowMap;if(!e)return;const t=e.renderList;if(this._disposeRTTandPostProcesses(),this._initializeGenerator(),this.filter=this._filter,this._applyFilterValues(),t){this._shadowMap.renderList||(this._shadowMap.renderList=[]);for(const e of t)this._shadowMap.renderList.push(e)}else this._shadowMap.renderList=null}_disposeBlurPostProcesses(){this._shadowMap2&&(this._shadowMap2.dispose(),this._shadowMap2=null),this._boxBlurPostprocess&&(this._boxBlurPostprocess.dispose(),this._boxBlurPostprocess=null),this._kernelBlurXPostprocess&&(this._kernelBlurXPostprocess.dispose(),this._kernelBlurXPostprocess=null),this._kernelBlurYPostprocess&&(this._kernelBlurYPostprocess.dispose(),this._kernelBlurYPostprocess=null),this._blurPostProcesses=[]}_disposeRTTandPostProcesses(){this._shadowMap&&(this._shadowMap.dispose(),this._shadowMap=null),this._disposeBlurPostProcesses()}_disposeSceneUBOs(){if(this._sceneUBOs){for(const e of this._sceneUBOs)e.dispose();this._sceneUBOs=[]}}dispose(){if(this._disposeRTTandPostProcesses(),this._disposeSceneUBOs(),this._light){if(this._light._shadowGenerators){const e=this._light._shadowGenerators.entries();for(let t=e.next();!0!==t.done;t=e.next()){const[e,i]=t.value;i===this&&this._light._shadowGenerators.delete(e)}0===this._light._shadowGenerators.size&&(this._light._shadowGenerators=null)}this._light._markMeshesAsLightDirty()}this.onBeforeShadowMapRenderMeshObservable.clear(),this.onBeforeShadowMapRenderObservable.clear(),this.onAfterShadowMapRenderMeshObservable.clear(),this.onAfterShadowMapRenderObservable.clear()}serialize(){var e;const t={},i=this.getShadowMap();if(!i)return t;if(t.className=this.getClassName(),t.lightId=this._light.id,t.cameraId=null===(e=this._camera)||void 0===e?void 0:e.id,t.id=this.id,t.mapSize=i.getRenderSize(),t.forceBackFacesOnly=this.forceBackFacesOnly,t.darkness=this.getDarkness(),t.transparencyShadow=this._transparencyShadow,t.frustumEdgeFalloff=this.frustumEdgeFalloff,t.bias=this.bias,t.normalBias=this.normalBias,t.usePercentageCloserFiltering=this.usePercentageCloserFiltering,t.useContactHardeningShadow=this.useContactHardeningShadow,t.contactHardeningLightSizeUVRatio=this.contactHardeningLightSizeUVRatio,t.filteringQuality=this.filteringQuality,t.useExponentialShadowMap=this.useExponentialShadowMap,t.useBlurExponentialShadowMap=this.useBlurExponentialShadowMap,t.useCloseExponentialShadowMap=this.useBlurExponentialShadowMap,t.useBlurCloseExponentialShadowMap=this.useBlurExponentialShadowMap,t.usePoissonSampling=this.usePoissonSampling,t.depthScale=this.depthScale,t.blurBoxOffset=this.blurBoxOffset,t.blurKernel=this.blurKernel,t.blurScale=this.blurScale,t.useKernelBlur=this.useKernelBlur,t.renderList=[],i.renderList)for(let e=0;e<i.renderList.length;e++){const n=i.renderList[e];t.renderList.push(n.id)}return t}static Parse(e,t,i){const n=t.getLightById(e.lightId),s=void 0!==e.cameraId?t.getCameraById(e.cameraId):null,r=i?i(e.mapSize,n,s):new dh(e.mapSize,n,void 0,s),o=r.getShadowMap();for(let i=0;i<e.renderList.length;i++)t.getMeshesById(e.renderList[i]).forEach((function(e){o&&(o.renderList||(o.renderList=[]),o.renderList.push(e))}));return void 0!==e.id&&(r.id=e.id),r.forceBackFacesOnly=!!e.forceBackFacesOnly,void 0!==e.darkness&&r.setDarkness(e.darkness),e.transparencyShadow&&r.setTransparencyShadow(!0),void 0!==e.frustumEdgeFalloff&&(r.frustumEdgeFalloff=e.frustumEdgeFalloff),void 0!==e.bias&&(r.bias=e.bias),void 0!==e.normalBias&&(r.normalBias=e.normalBias),e.usePercentageCloserFiltering?r.usePercentageCloserFiltering=!0:e.useContactHardeningShadow?r.useContactHardeningShadow=!0:e.usePoissonSampling?r.usePoissonSampling=!0:e.useExponentialShadowMap?r.useExponentialShadowMap=!0:e.useBlurExponentialShadowMap?r.useBlurExponentialShadowMap=!0:e.useCloseExponentialShadowMap?r.useCloseExponentialShadowMap=!0:e.useBlurCloseExponentialShadowMap?r.useBlurCloseExponentialShadowMap=!0:e.useVarianceShadowMap?r.useExponentialShadowMap=!0:e.useBlurVarianceShadowMap&&(r.useBlurExponentialShadowMap=!0),void 0!==e.contactHardeningLightSizeUVRatio&&(r.contactHardeningLightSizeUVRatio=e.contactHardeningLightSizeUVRatio),void 0!==e.filteringQuality&&(r.filteringQuality=e.filteringQuality),e.depthScale&&(r.depthScale=e.depthScale),e.blurScale&&(r.blurScale=e.blurScale),e.blurBoxOffset&&(r.blurBoxOffset=e.blurBoxOffset),e.useKernelBlur&&(r.useKernelBlur=e.useKernelBlur),e.blurKernel&&(r.blurKernel=e.blurKernel),r}}dh.CLASSNAME="ShadowGenerator",dh.FILTER_NONE=0,dh.FILTER_EXPONENTIALSHADOWMAP=1,dh.FILTER_POISSONSAMPLING=2,dh.FILTER_BLUREXPONENTIALSHADOWMAP=3,dh.FILTER_CLOSEEXPONENTIALSHADOWMAP=4,dh.FILTER_BLURCLOSEEXPONENTIALSHADOWMAP=5,dh.FILTER_PCF=6,dh.FILTER_PCSS=7,dh.QUALITY_HIGH=0,dh.QUALITY_MEDIUM=1,dh.QUALITY_LOW=2,dh.DEFAULT_ALPHA_CUTOFF=.5,dh._SceneComponentInitialization=e=>{throw(0,Zl.S)("ShadowGeneratorSceneComponent")};si.v.ShadersStore.depthPixelShader="#ifdef ALPHATEST\nvarying vec2 vUV;\nuniform sampler2D diffuseSampler;\n#endif\n#include<clipPlaneFragmentDeclaration>\nvarying float vDepthMetric;\n#ifdef PACKED\n#include<packingFunctions>\n#endif\n#ifdef STORE_CAMERASPACE_Z\nvarying vec4 vViewPos;\n#endif\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\n#include<clipPlaneFragment>\n#ifdef ALPHATEST\nif (texture2D(diffuseSampler,vUV).a<0.4)\ndiscard;\n#endif\n#ifdef STORE_CAMERASPACE_Z\n#ifdef PACKED\ngl_FragColor=pack(vViewPos.z);\n#else\ngl_FragColor=vec4(vViewPos.z,0.0,0.0,1.0);\n#endif\n#else\n#ifdef NONLINEARDEPTH\n#ifdef PACKED\ngl_FragColor=pack(gl_FragCoord.z);\n#else\ngl_FragColor=vec4(gl_FragCoord.z,0.0,0.0,0.0);\n#endif\n#else\n#ifdef PACKED\ngl_FragColor=pack(vDepthMetric);\n#else\ngl_FragColor=vec4(vDepthMetric,0.0,0.0,1.0);\n#endif\n#endif\n#endif\n}";si.v.ShadersStore.depthVertexShader="attribute vec3 position;\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<morphTargetsVertexGlobalDeclaration>\n#include<morphTargetsVertexDeclaration>[0..maxSimultaneousMorphTargets]\n#include<clipPlaneVertexDeclaration>\n#include<instancesDeclaration>\nuniform mat4 viewProjection;\nuniform vec2 depthValues;\n#if defined(ALPHATEST) || defined(NEED_UV)\nvarying vec2 vUV;\nuniform mat4 diffuseMatrix;\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#endif\n#ifdef STORE_CAMERASPACE_Z\nuniform mat4 view;\nvarying vec4 vViewPos;\n#endif\nvarying float vDepthMetric;\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void)\n{\nvec3 positionUpdated=position;\n#ifdef UV1\nvec2 uvUpdated=uv;\n#endif\n#include<morphTargetsVertexGlobal>\n#include<morphTargetsVertex>[0..maxSimultaneousMorphTargets]\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(positionUpdated,1.0);\n#include<clipPlaneVertex>\ngl_Position=viewProjection*worldPos;\n#ifdef STORE_CAMERASPACE_Z\nvViewPos=view*worldPos;\n#else\n#ifdef USE_REVERSE_DEPTHBUFFER\nvDepthMetric=((-gl_Position.z+depthValues.x)/(depthValues.y));\n#else\nvDepthMetric=((gl_Position.z+depthValues.x)/(depthValues.y));\n#endif\n#endif\n#if defined(ALPHATEST) || defined(BASIC_RENDER)\n#ifdef UV1\nvUV=vec2(diffuseMatrix*vec4(uvUpdated,1.0,0.0));\n#endif\n#ifdef UV2\nvUV=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));\n#endif\n#endif\n}\n";class ph{setMaterialForRendering(e,t){this._depthMap.setMaterialForRendering(e,t)}constructor(e,t=1,i=null,n=!1,s=Ce.x.TRILINEAR_SAMPLINGMODE,r=!1,o){this.enabled=!0,this.forceDepthWriteTransparentMeshes=!1,this.useOnlyInActiveCamera=!1,this.reverseCulling=!1,this._scene=e,this._storeNonLinearDepth=n,this._storeCameraSpaceZ=r,this.isPacked=0===t,this.isPacked?this.clearColor=new a.HE(1,1,1,1):this.clearColor=new a.HE(r?1e8:1,0,0,1),ph._SceneComponentInitialization(this._scene);const l=e.getEngine();this._camera=i,s!==Ce.x.NEAREST_SAMPLINGMODE&&(1!==t||l._caps.textureFloatLinearFiltering||(s=Ce.x.NEAREST_SAMPLINGMODE),2!==t||l._caps.textureHalfFloatLinearFiltering||(s=Ce.x.NEAREST_SAMPLINGMODE));const h=this.isPacked||!l._features.supportExtendedTextureFormats?5:6;this._depthMap=new Ai._(null!=o?o:"DepthRenderer",{width:l.getRenderWidth(),height:l.getRenderHeight()},this._scene,!1,!0,t,!1,s,void 0,void 0,void 0,h),this._depthMap.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._depthMap.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._depthMap.refreshRate=1,this._depthMap.renderParticles=!1,this._depthMap.renderList=null,this._depthMap.activeCamera=this._camera,this._depthMap.ignoreCameraViewport=!0,this._depthMap.useCameraPostProcesses=!1,this._depthMap.onClearObservable.add((e=>{e.clear(this.clearColor,!0,!0,!0)})),this._depthMap.onBeforeBindObservable.add((()=>{var e;null===(e=l._debugPushGroup)||void 0===e||e.call(l,"depth renderer",1)})),this._depthMap.onAfterUnbindObservable.add((()=>{var e;null===(e=l._debugPopGroup)||void 0===e||e.call(l,1)})),this._depthMap.customIsReadyFunction=(e,t,i)=>{if((i||0===t)&&e.subMeshes)for(let t=0;t<e.subMeshes.length;++t){const i=e.subMeshes[t],n=i.getRenderingMesh(),s=n._getInstancesRenderList(i._id,!!i.getReplacementMesh()),r=l.getCaps().instancedArrays&&(null!==s.visibleInstances[i._id]&&void 0!==s.visibleInstances[i._id]||n.hasThinInstances);if(!this.isReady(i,r))return!1}return!0};const c=e=>{var t,i;const n=e.getRenderingMesh(),s=e.getEffectiveMesh(),r=this._scene,o=r.getEngine(),a=e.getMaterial();if(s._internalAbstractMeshDataInfo._isActiveIntermediate=!1,!a||s.infiniteDistance||a.disableDepthWrite||0===e.verticesCount||e._renderId===r.getRenderId())return;const l=s._getWorldMatrixDeterminant()<0;let h=null!==(t=n.overrideMaterialSideOrientation)&&void 0!==t?t:a.sideOrientation;l&&(h=0===h?1:0);const c=0===h;o.setState(a.backFaceCulling,0,!1,c,this.reverseCulling?!a.cullBackFaces:a.cullBackFaces);const u=n._getInstancesRenderList(e._id,!!e.getReplacementMesh());if(u.mustReturn)return;const d=o.getCaps().instancedArrays&&(null!==u.visibleInstances[e._id]&&void 0!==u.visibleInstances[e._id]||n.hasThinInstances),p=this._camera||r.activeCamera;if(this.isReady(e,d)&&p){e._renderId=r.getRenderId();const t=null===(i=s._internalAbstractMeshDataInfo._materialForRenderPass)||void 0===i?void 0:i[o.currentRenderPassId];let l=e._getDrawWrapper();!l&&t&&(l=t._getDrawWrapper());const h=p.mode===Mt.V.ORTHOGRAPHIC_CAMERA;if(!l)return;const c=l.effect;let f,_;if(o.enableEffect(l),d||n._bind(e,c,a.fillMode),t?t.bindForSubMesh(s.getWorldMatrix(),s,e):(c.setMatrix("viewProjection",r.getTransformMatrix()),c.setMatrix("world",s.getWorldMatrix()),this._storeCameraSpaceZ&&c.setMatrix("view",r.getViewMatrix())),h?(f=!o.useReverseDepthBuffer&&o.isNDCHalfZRange?0:1,_=o.useReverseDepthBuffer&&o.isNDCHalfZRange?0:1):(f=o.useReverseDepthBuffer&&o.isNDCHalfZRange?p.minZ:o.isNDCHalfZRange?0:p.minZ,_=o.useReverseDepthBuffer&&o.isNDCHalfZRange?0:p.maxZ),c.setFloat2("depthValues",f,f+_),!t){if(a.needAlphaTesting()){const e=a.getAlphaTestTexture();e&&(c.setTexture("diffuseSampler",e),c.setMatrix("diffuseMatrix",e.getTextureMatrix()))}if(n.useBones&&n.computeBonesUsingShaders&&n.skeleton){const e=n.skeleton;if(e.isUsingTextureForMatrices){const t=e.getTransformMatrixTexture(n);if(!t)return;c.setTexture("boneSampler",t),c.setFloat("boneTextureWidth",4*(e.bones.length+1))}else c.setMatrices("mBones",e.getTransformMatrices(n))}(0,Ga.an)(c,a,r),La.G.BindMorphTargetParameters(n,c),n.morphTargetManager&&n.morphTargetManager.isUsingTextureForTargets&&n.morphTargetManager._bind(c)}n._processRendering(s,e,c,a.fillMode,u,d,((e,t)=>c.setMatrix("world",t)))}};this._depthMap.customRenderFunction=(e,t,i,n)=>{let s;if(n.length)for(s=0;s<n.length;s++)c(n.data[s]);for(s=0;s<e.length;s++)c(e.data[s]);for(s=0;s<t.length;s++)c(t.data[s]);if(this.forceDepthWriteTransparentMeshes)for(s=0;s<i.length;s++)c(i.data[s]);else for(s=0;s<i.length;s++)i.data[s].getEffectiveMesh()._internalAbstractMeshDataInfo._isActiveIntermediate=!1}}isReady(e,t){var i;const n=this._scene.getEngine(),s=e.getMesh(),r=s.getScene(),o=null===(i=s._internalAbstractMeshDataInfo._materialForRenderPass)||void 0===i?void 0:i[n.currentRenderPassId];if(o)return o.isReadyForSubMesh(s,e,t);const a=e.getMaterial();if(!a||a.disableDepthWrite)return!1;const l=[],h=[qe.o.PositionKind];if(a&&a.needAlphaTesting()&&a.getAlphaTestTexture()&&(l.push("#define ALPHATEST"),s.isVerticesDataPresent(qe.o.UVKind)&&(h.push(qe.o.UVKind),l.push("#define UV1")),s.isVerticesDataPresent(qe.o.UV2Kind)&&(h.push(qe.o.UV2Kind),l.push("#define UV2"))),s.useBones&&s.computeBonesUsingShaders){h.push(qe.o.MatricesIndicesKind),h.push(qe.o.MatricesWeightsKind),s.numBoneInfluencers>4&&(h.push(qe.o.MatricesIndicesExtraKind),h.push(qe.o.MatricesWeightsExtraKind)),l.push("#define NUM_BONE_INFLUENCERS "+s.numBoneInfluencers),l.push("#define BonesPerMesh "+(s.skeleton?s.skeleton.bones.length+1:0));const t=e.getRenderingMesh().skeleton;(null==t?void 0:t.isUsingTextureForMatrices)&&l.push("#define BONETEXTURE")}else l.push("#define NUM_BONE_INFLUENCERS 0");const c=s.morphTargetManager;let u=0;c&&c.numInfluencers>0&&(u=c.numInfluencers,l.push("#define MORPHTARGETS"),l.push("#define NUM_MORPH_INFLUENCERS "+u),c.isUsingTextureForTargets&&l.push("#define MORPHTARGETS_TEXTURE"),La.G.PrepareAttributesForMorphTargetsInfluencers(h,s,u)),t&&(l.push("#define INSTANCES"),La.G.PushAttributesForInstances(h),e.getRenderingMesh().hasThinInstances&&l.push("#define THIN_INSTANCES")),this._storeNonLinearDepth&&l.push("#define NONLINEARDEPTH"),this._storeCameraSpaceZ&&l.push("#define STORE_CAMERASPACE_Z"),this.isPacked&&l.push("#define PACKED"),(0,Ga.lK)(a,r,l);const d=e._getDrawWrapper(void 0,!0),p=d.defines,f=l.join("\n");if(p!==f){const e=["world","mBones","boneTextureWidth","viewProjection","view","diffuseMatrix","depthValues","morphTargetInfluences","morphTargetTextureInfo","morphTargetTextureIndices"];(0,Ga.qx)(e),d.setEffect(n.createEffect("depth",h,e,["diffuseSampler","morphTargets","boneSampler"],f,void 0,void 0,void 0,{maxSimultaneousMorphTargets:u}),f)}return d.effect.isReady()}getDepthMap(){return this._depthMap}dispose(){const e=[];for(const t in this._scene._depthRenderer)this._scene._depthRenderer[t]===this&&e.push(t);if(e.length>0){this._depthMap.dispose();for(const t of e)delete this._scene._depthRenderer[t]}}}ph._SceneComponentInitialization=e=>{throw(0,Zl.S)("DepthRendererSceneComponent")};var fh=i(727);si.v.ShadersStore.minmaxReduxPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\n#if defined(INITIAL)\nuniform sampler2D sourceTexture;\nuniform vec2 texSize;\nvoid main(void)\n{\nivec2 coord=ivec2(vUV*(texSize-1.0));\nfloat f1=texelFetch(sourceTexture,coord,0).r;\nfloat f2=texelFetch(sourceTexture,coord+ivec2(1,0),0).r;\nfloat f3=texelFetch(sourceTexture,coord+ivec2(1,1),0).r;\nfloat f4=texelFetch(sourceTexture,coord+ivec2(0,1),0).r;\nfloat minz=min(min(min(f1,f2),f3),f4);\n#ifdef DEPTH_REDUX\nfloat maxz=max(max(max(sign(1.0-f1)*f1,sign(1.0-f2)*f2),sign(1.0-f3)*f3),sign(1.0-f4)*f4);\n#else\nfloat maxz=max(max(max(f1,f2),f3),f4);\n#endif\nglFragColor=vec4(minz,maxz,0.,0.);\n}\n#elif defined(MAIN)\nuniform vec2 texSize;\nvoid main(void)\n{\nivec2 coord=ivec2(vUV*(texSize-1.0));\nvec2 f1=texelFetch(textureSampler,coord,0).rg;\nvec2 f2=texelFetch(textureSampler,coord+ivec2(1,0),0).rg;\nvec2 f3=texelFetch(textureSampler,coord+ivec2(1,1),0).rg;\nvec2 f4=texelFetch(textureSampler,coord+ivec2(0,1),0).rg;\nfloat minz=min(min(min(f1.x,f2.x),f3.x),f4.x);\nfloat maxz=max(max(max(f1.y,f2.y),f3.y),f4.y);\nglFragColor=vec4(minz,maxz,0.,0.);\n}\n#elif defined(ONEBEFORELAST)\nuniform ivec2 texSize;\nvoid main(void)\n{\nivec2 coord=ivec2(vUV*vec2(texSize-1));\nvec2 f1=texelFetch(textureSampler,coord % texSize,0).rg;\nvec2 f2=texelFetch(textureSampler,(coord+ivec2(1,0)) % texSize,0).rg;\nvec2 f3=texelFetch(textureSampler,(coord+ivec2(1,1)) % texSize,0).rg;\nvec2 f4=texelFetch(textureSampler,(coord+ivec2(0,1)) % texSize,0).rg;\nfloat minz=min(f1.x,f2.x);\nfloat maxz=max(f1.y,f2.y);\nglFragColor=vec4(minz,maxz,0.,0.);\n}\n#elif defined(LAST)\nvoid main(void)\n{\nglFragColor=vec4(0.);\nif (true) { \ndiscard;\n}\n}\n#endif\n";class _h{constructor(e){this.onAfterReductionPerformed=new r.y$,this._forceFullscreenViewport=!0,this._activated=!1,this._camera=e,this._postProcessManager=new fh.O(e.getScene()),this._onContextRestoredObserver=e.getEngine().onContextRestoredObservable.add((()=>{this._postProcessManager._rebuild()}))}get sourceTexture(){return this._sourceTexture}setSourceTexture(e,t,i=2,n=!0){if(e===this._sourceTexture)return;this.dispose(!1),this._sourceTexture=e,this._reductionSteps=[],this._forceFullscreenViewport=n;const s=this._camera.getScene(),r=new ni.D("Initial reduction phase","minmaxRedux",["texSize"],["sourceTexture"],1,null,1,s.getEngine(),!1,"#define INITIAL"+(t?"\n#define DEPTH_REDUX":""),i,void 0,void 0,void 0,7);r.autoClear=!1,r.forceFullscreenViewport=n;let o=this._sourceTexture.getRenderWidth(),a=this._sourceTexture.getRenderHeight();r.onApply=((e,t)=>i=>{i.setTexture("sourceTexture",this._sourceTexture),i.setFloat2("texSize",e,t)})(o,a),this._reductionSteps.push(r);let l=1;for(;o>1||a>1;){o=Math.max(Math.round(o/2),1),a=Math.max(Math.round(a/2),1);const e=new ni.D("Reduction phase "+l,"minmaxRedux",["texSize"],null,{width:o,height:a},null,1,s.getEngine(),!1,"#define "+(1==o&&1==a?"LAST":1==o||1==a?"ONEBEFORELAST":"MAIN"),i,void 0,void 0,void 0,7);if(e.autoClear=!1,e.forceFullscreenViewport=n,e.onApply=((e,t)=>i=>{1==e||1==t?i.setInt2("texSize",e,t):i.setFloat2("texSize",e,t)})(o,a),this._reductionSteps.push(e),l++,1==o&&1==a){const t=(e,t,i)=>{const n=new Float32Array(4*e*t),r={min:0,max:0};return()=>{s.getEngine()._readTexturePixels(i.inputTexture.texture,e,t,-1,0,n,!1),r.min=n[0],r.max=n[1],this.onAfterReductionPerformed.notifyObservers(r)}};e.onAfterRenderObservable.add(t(o,a,e))}}}get refreshRate(){return this._sourceTexture?this._sourceTexture.refreshRate:-1}set refreshRate(e){this._sourceTexture&&(this._sourceTexture.refreshRate=e)}get activated(){return this._activated}activate(){!this._onAfterUnbindObserver&&this._sourceTexture&&(this._onAfterUnbindObserver=this._sourceTexture.onAfterUnbindObservable.add((()=>{var e,t;const i=this._camera.getScene().getEngine();null===(e=i._debugPushGroup)||void 0===e||e.call(i,"min max reduction",1),this._reductionSteps[0].activate(this._camera),this._postProcessManager.directRender(this._reductionSteps,this._reductionSteps[0].inputTexture,this._forceFullscreenViewport),i.unBindFramebuffer(this._reductionSteps[0].inputTexture,!1),null===(t=i._debugPopGroup)||void 0===t||t.call(i,1)})),this._activated=!0)}deactivate(){this._onAfterUnbindObserver&&this._sourceTexture&&(this._sourceTexture.onAfterUnbindObservable.remove(this._onAfterUnbindObserver),this._onAfterUnbindObserver=null,this._activated=!1)}dispose(e=!0){if(e&&(this.onAfterReductionPerformed.clear(),this._onContextRestoredObserver&&(this._camera.getEngine().onContextRestoredObservable.remove(this._onContextRestoredObserver),this._onContextRestoredObserver=null)),this.deactivate(),this._reductionSteps){for(let e=0;e<this._reductionSteps.length;++e)this._reductionSteps[e].dispose();this._reductionSteps=null}this._postProcessManager&&e&&this._postProcessManager.dispose(),this._sourceTexture=null}}class mh extends _h{get depthRenderer(){return this._depthRenderer}constructor(e){super(e)}setDepthRenderer(e=null,t=2,i=!0){const n=this._camera.getScene();this._depthRenderer&&(delete n._depthRenderer[this._depthRendererId],this._depthRenderer.dispose(),this._depthRenderer=null),null===e&&(n._depthRenderer||(n._depthRenderer={}),(e=this._depthRenderer=new ph(n,t,this._camera,!1,1)).enabled=!1,this._depthRendererId="minmax"+this._camera.id,n._depthRenderer[this._depthRendererId]=e),super.setSourceTexture(e.getDepthMap(),!0,t,i)}setSourceTexture(e,t,i=2,n=!0){super.setSourceTexture(e,t,i,n)}activate(){this._depthRenderer&&(this._depthRenderer.enabled=!0),super.activate()}deactivate(){super.deactivate(),this._depthRenderer&&(this._depthRenderer.enabled=!1)}dispose(e=!0){if(super.dispose(e),this._depthRenderer&&e){const e=this._depthRenderer.getDepthMap().getScene();e&&delete e._depthRenderer[this._depthRendererId],this._depthRenderer.dispose(),this._depthRenderer=null}}}const gh=o.P.Up(),vh=o.P.Zero(),yh=new o.P,xh=new o.P,bh=new o.y3;class Th extends dh{_validateFilter(e){return e===dh.FILTER_NONE||e===dh.FILTER_PCF||e===dh.FILTER_PCSS?e:(console.error('Unsupported filter "'+e+'"!'),dh.FILTER_NONE)}get numCascades(){return this._numCascades}set numCascades(e){(e=Math.min(Math.max(e,Th.MIN_CASCADES_COUNT),Th.MAX_CASCADES_COUNT))!==this._numCascades&&(this._numCascades=e,this.recreateShadowMap(),this._recreateSceneUBOs())}get freezeShadowCastersBoundingInfo(){return this._freezeShadowCastersBoundingInfo}set freezeShadowCastersBoundingInfo(e){this._freezeShadowCastersBoundingInfoObservable&&e&&(this._scene.onBeforeRenderObservable.remove(this._freezeShadowCastersBoundingInfoObservable),this._freezeShadowCastersBoundingInfoObservable=null),this._freezeShadowCastersBoundingInfoObservable||e||(this._freezeShadowCastersBoundingInfoObservable=this._scene.onBeforeRenderObservable.add(this._computeShadowCastersBoundingInfo.bind(this))),this._freezeShadowCastersBoundingInfo=e,e&&this._computeShadowCastersBoundingInfo()}_computeShadowCastersBoundingInfo(){if(this._scbiMin.copyFromFloats(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),this._scbiMax.copyFromFloats(Number.MIN_VALUE,Number.MIN_VALUE,Number.MIN_VALUE),this._shadowMap&&this._shadowMap.renderList){const e=this._shadowMap.renderList;for(let t=0;t<e.length;t++){const i=e[t];if(!i)continue;const n=i.getBoundingInfo().boundingBox;this._scbiMin.minimizeInPlace(n.minimumWorld),this._scbiMax.maximizeInPlace(n.maximumWorld)}const t=this._scene.meshes;for(let e=0;e<t.length;e++){const i=t[e];if(!(i&&i.isVisible&&i.isEnabled&&i.receiveShadows))continue;const n=i.getBoundingInfo().boundingBox;this._scbiMin.minimizeInPlace(n.minimumWorld),this._scbiMax.maximizeInPlace(n.maximumWorld)}}this._shadowCastersBoundingInfo.reConstruct(this._scbiMin,this._scbiMax)}get shadowCastersBoundingInfo(){return this._shadowCastersBoundingInfo}set shadowCastersBoundingInfo(e){this._shadowCastersBoundingInfo=e}setMinMaxDistance(e,t){this._minDistance===e&&this._maxDistance===t||(e>t&&(e=0,t=1),e<0&&(e=0),t>1&&(t=1),this._minDistance=e,this._maxDistance=t,this._breaksAreDirty=!0)}get minDistance(){return this._minDistance}get maxDistance(){return this._maxDistance}getClassName(){return Th.CLASSNAME}getCascadeMinExtents(e){return e>=0&&e<this._numCascades?this._cascadeMinExtents[e]:null}getCascadeMaxExtents(e){return e>=0&&e<this._numCascades?this._cascadeMaxExtents[e]:null}get shadowMaxZ(){return this._getCamera()?this._shadowMaxZ:0}set shadowMaxZ(e){const t=this._getCamera();t?this._shadowMaxZ===e||e<t.minZ||e>t.maxZ||(this._shadowMaxZ=e,this._light._markMeshesAsLightDirty(),this._breaksAreDirty=!0):this._shadowMaxZ=e}get debug(){return this._debug}set debug(e){this._debug=e,this._light._markMeshesAsLightDirty()}get depthClamp(){return this._depthClamp}set depthClamp(e){this._depthClamp=e}get cascadeBlendPercentage(){return this._cascadeBlendPercentage}set cascadeBlendPercentage(e){this._cascadeBlendPercentage=e,this._light._markMeshesAsLightDirty()}get lambda(){return this._lambda}set lambda(e){const t=Math.min(Math.max(e,0),1);this._lambda!=t&&(this._lambda=t,this._breaksAreDirty=!0)}getCascadeViewMatrix(e){return e>=0&&e<this._numCascades?this._viewMatrices[e]:null}getCascadeProjectionMatrix(e){return e>=0&&e<this._numCascades?this._projectionMatrices[e]:null}getCascadeTransformMatrix(e){return e>=0&&e<this._numCascades?this._transformMatrices[e]:null}setDepthRenderer(e){this._depthRenderer=e,this._depthReducer&&this._depthReducer.setDepthRenderer(this._depthRenderer)}get autoCalcDepthBounds(){return this._autoCalcDepthBounds}set autoCalcDepthBounds(e){const t=this._getCamera();if(t){if(this._autoCalcDepthBounds=e,!e)return this._depthReducer&&this._depthReducer.deactivate(),void this.setMinMaxDistance(0,1);this._depthReducer||(this._depthReducer=new mh(t),this._depthReducer.onAfterReductionPerformed.add((e=>{let t=e.min,i=e.max;t>=i&&(t=0,i=1),t==this._minDistance&&i==this._maxDistance||this.setMinMaxDistance(t,i)})),this._depthReducer.setDepthRenderer(this._depthRenderer)),this._depthReducer.activate()}}get autoCalcDepthBoundsRefreshRate(){var e,t,i;return null!==(i=null===(t=null===(e=this._depthReducer)||void 0===e?void 0:e.depthRenderer)||void 0===t?void 0:t.getDepthMap().refreshRate)&&void 0!==i?i:-1}set autoCalcDepthBoundsRefreshRate(e){var t;(null===(t=this._depthReducer)||void 0===t?void 0:t.depthRenderer)&&(this._depthReducer.depthRenderer.getDepthMap().refreshRate=e)}splitFrustum(){this._breaksAreDirty=!0}_splitFrustum(){const e=this._getCamera();if(!e)return;const t=e.minZ,i=e.maxZ,n=i-t,s=this._minDistance,r=t+s*n,o=t+(this._shadowMaxZ<i&&this._shadowMaxZ>=t?Math.min((this._shadowMaxZ-t)/(i-t),this._maxDistance):this._maxDistance)*n,a=o-r,l=o/r;for(let e=0;e<this._cascades.length;++e){const i=(e+1)/this._numCascades,o=r*l**i,h=r+a*i,c=this._lambda*(o-h)+h;this._cascades[e].prevBreakDistance=0===e?s:this._cascades[e-1].breakDistance,this._cascades[e].breakDistance=(c-t)/n,this._viewSpaceFrustumsZ[e]=c,this._frustumLengths[e]=(this._cascades[e].breakDistance-this._cascades[e].prevBreakDistance)*n}this._breaksAreDirty=!1}_computeMatrices(){const e=this._scene;if(!this._getCamera())return;o.P.NormalizeToRef(this._light.getShadowDirection(0),this._lightDirection),1===Math.abs(o.P.Dot(this._lightDirection,o.P.Up()))&&(this._lightDirection.z=1e-13),this._cachedDirection.copyFrom(this._lightDirection);const t=e.getEngine().useReverseDepthBuffer;for(let i=0;i<this._numCascades;++i){this._computeFrustumInWorldSpace(i),this._computeCascadeFrustum(i),this._cascadeMaxExtents[i].subtractToRef(this._cascadeMinExtents[i],yh),this._frustumCenter[i].addToRef(this._lightDirection.scale(this._cascadeMinExtents[i].z),this._shadowCameraPos[i]),o.y3.LookAtLHToRef(this._shadowCameraPos[i],this._frustumCenter[i],gh,this._viewMatrices[i]);let n=0,s=yh.z;const r=this._shadowCastersBoundingInfo;r.update(this._viewMatrices[i]),s=Math.min(s,r.boundingBox.maximumWorld.z),n=this._depthClamp&&this.filter!==dh.FILTER_PCSS?Math.max(n,r.boundingBox.minimumWorld.z):Math.min(n,r.boundingBox.minimumWorld.z),o.y3.OrthoOffCenterLHToRef(this._cascadeMinExtents[i].x,this._cascadeMaxExtents[i].x,this._cascadeMinExtents[i].y,this._cascadeMaxExtents[i].y,t?s:n,t?n:s,this._projectionMatrices[i],e.getEngine().isNDCHalfZRange),this._cascadeMinExtents[i].z=n,this._cascadeMaxExtents[i].z=s,this._viewMatrices[i].multiplyToRef(this._projectionMatrices[i],this._transformMatrices[i]),o.P.TransformCoordinatesToRef(vh,this._transformMatrices[i],yh),yh.scaleInPlace(this._mapSize/2),xh.copyFromFloats(Math.round(yh.x),Math.round(yh.y),Math.round(yh.z)),xh.subtractInPlace(yh).scaleInPlace(2/this._mapSize),o.y3.TranslationToRef(xh.x,xh.y,0,bh),this._projectionMatrices[i].multiplyToRef(bh,this._projectionMatrices[i]),this._viewMatrices[i].multiplyToRef(this._projectionMatrices[i],this._transformMatrices[i]),this._transformMatrices[i].copyToArray(this._transformMatricesAsArray,16*i)}}_computeFrustumInWorldSpace(e){const t=this._getCamera();if(!t)return;const i=this._cascades[e].prevBreakDistance,n=this._cascades[e].breakDistance,s=this._scene.getEngine().isNDCHalfZRange;t.getViewMatrix();const r=o.y3.Invert(t.getTransformationMatrix()),a=this._scene.getEngine().useReverseDepthBuffer?4:0;for(let t=0;t<Th._FrustumCornersNDCSpace.length;++t)yh.copyFrom(Th._FrustumCornersNDCSpace[(t+a)%Th._FrustumCornersNDCSpace.length]),s&&-1===yh.z&&(yh.z=0),o.P.TransformCoordinatesToRef(yh,r,this._frustumCornersWorldSpace[e][t]);for(let t=0;t<Th._FrustumCornersNDCSpace.length/2;++t)yh.copyFrom(this._frustumCornersWorldSpace[e][t+4]).subtractInPlace(this._frustumCornersWorldSpace[e][t]),xh.copyFrom(yh).scaleInPlace(i),yh.scaleInPlace(n),yh.addInPlace(this._frustumCornersWorldSpace[e][t]),this._frustumCornersWorldSpace[e][t+4].copyFrom(yh),this._frustumCornersWorldSpace[e][t].addInPlace(xh)}_computeCascadeFrustum(e){if(this._cascadeMinExtents[e].copyFromFloats(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),this._cascadeMaxExtents[e].copyFromFloats(Number.MIN_VALUE,Number.MIN_VALUE,Number.MIN_VALUE),this._frustumCenter[e].copyFromFloats(0,0,0),this._getCamera()){for(let t=0;t<this._frustumCornersWorldSpace[e].length;++t)this._frustumCenter[e].addInPlace(this._frustumCornersWorldSpace[e][t]);if(this._frustumCenter[e].scaleInPlace(1/this._frustumCornersWorldSpace[e].length),this.stabilizeCascades){let t=0;for(let i=0;i<this._frustumCornersWorldSpace[e].length;++i){const n=this._frustumCornersWorldSpace[e][i].subtractToRef(this._frustumCenter[e],yh).length();t=Math.max(t,n)}t=Math.ceil(16*t)/16,this._cascadeMaxExtents[e].copyFromFloats(t,t,t),this._cascadeMinExtents[e].copyFromFloats(-t,-t,-t)}else{const t=this._frustumCenter[e];this._frustumCenter[e].addToRef(this._lightDirection,yh),o.y3.LookAtLHToRef(t,yh,gh,bh);for(let t=0;t<this._frustumCornersWorldSpace[e].length;++t)o.P.TransformCoordinatesToRef(this._frustumCornersWorldSpace[e][t],bh,yh),this._cascadeMinExtents[e].minimizeInPlace(yh),this._cascadeMaxExtents[e].maximizeInPlace(yh)}}}_recreateSceneUBOs(){if(this._disposeSceneUBOs(),this._sceneUBOs)for(let e=0;e<this._numCascades;++e)this._sceneUBOs.push(this._scene.createSceneUniformBuffer(`Scene for CSM Shadow Generator (light "${this._light.name}" cascade #${e})`))}static get IsSupported(){const e=A.l.LastCreatedEngine;return!!e&&e._features.supportCSM}constructor(e,t,i,n){Th.IsSupported?(super(e,t,i,n),this.usePercentageCloserFiltering=!0):_.Y.Error("CascadedShadowMap is not supported by the current engine.")}_initializeGenerator(){var e,t,i,n,s,r,a,l,h,c,u,d,p,f,_,m,g,v,y,x;this.penumbraDarkness=null!==(e=this.penumbraDarkness)&&void 0!==e?e:1,this._numCascades=null!==(t=this._numCascades)&&void 0!==t?t:Th.DEFAULT_CASCADES_COUNT,this.stabilizeCascades=null!==(i=this.stabilizeCascades)&&void 0!==i&&i,this._freezeShadowCastersBoundingInfoObservable=null!==(n=this._freezeShadowCastersBoundingInfoObservable)&&void 0!==n?n:null,this.freezeShadowCastersBoundingInfo=null!==(s=this.freezeShadowCastersBoundingInfo)&&void 0!==s&&s,this._scbiMin=null!==(r=this._scbiMin)&&void 0!==r?r:new o.P(0,0,0),this._scbiMax=null!==(a=this._scbiMax)&&void 0!==a?a:new o.P(0,0,0),this._shadowCastersBoundingInfo=null!==(l=this._shadowCastersBoundingInfo)&&void 0!==l?l:new wn.j(new o.P(0,0,0),new o.P(0,0,0)),this._breaksAreDirty=null===(h=this._breaksAreDirty)||void 0===h||h,this._minDistance=null!==(c=this._minDistance)&&void 0!==c?c:0,this._maxDistance=null!==(u=this._maxDistance)&&void 0!==u?u:1,this._currentLayer=null!==(d=this._currentLayer)&&void 0!==d?d:0,this._shadowMaxZ=null!==(_=null!==(p=this._shadowMaxZ)&&void 0!==p?p:null===(f=this._getCamera())||void 0===f?void 0:f.maxZ)&&void 0!==_?_:1e4,this._debug=null!==(m=this._debug)&&void 0!==m&&m,this._depthClamp=null===(g=this._depthClamp)||void 0===g||g,this._cascadeBlendPercentage=null!==(v=this._cascadeBlendPercentage)&&void 0!==v?v:.1,this._lambda=null!==(y=this._lambda)&&void 0!==y?y:.5,this._autoCalcDepthBounds=null!==(x=this._autoCalcDepthBounds)&&void 0!==x&&x,this._recreateSceneUBOs(),super._initializeGenerator()}_createTargetRenderTexture(){const e=this._scene.getEngine(),t={width:this._mapSize,height:this._mapSize,layers:this.numCascades};this._shadowMap=new Ai._(this._light.name+"_CSMShadowMap",t,this._scene,!1,!0,this._textureType,!1,void 0,!1,!1,void 0),this._shadowMap.createDepthStencilTexture(e.useReverseDepthBuffer?516:513,!0)}_initializeShadowMap(){if(super._initializeShadowMap(),null===this._shadowMap)return;this._transformMatricesAsArray=new Float32Array(16*this._numCascades),this._viewSpaceFrustumsZ=new Array(this._numCascades),this._frustumLengths=new Array(this._numCascades),this._lightSizeUVCorrection=new Array(2*this._numCascades),this._depthCorrection=new Array(this._numCascades),this._cascades=[],this._viewMatrices=[],this._projectionMatrices=[],this._transformMatrices=[],this._cascadeMinExtents=[],this._cascadeMaxExtents=[],this._frustumCenter=[],this._shadowCameraPos=[],this._frustumCornersWorldSpace=[];for(let e=0;e<this._numCascades;++e){this._cascades[e]={prevBreakDistance:0,breakDistance:0},this._viewMatrices[e]=o.y3.Zero(),this._projectionMatrices[e]=o.y3.Zero(),this._transformMatrices[e]=o.y3.Zero(),this._cascadeMinExtents[e]=new o.P,this._cascadeMaxExtents[e]=new o.P,this._frustumCenter[e]=new o.P,this._shadowCameraPos[e]=new o.P,this._frustumCornersWorldSpace[e]=new Array(Th._FrustumCornersNDCSpace.length);for(let t=0;t<Th._FrustumCornersNDCSpace.length;++t)this._frustumCornersWorldSpace[e][t]=new o.P}const e=this._scene.getEngine();this._shadowMap.onBeforeBindObservable.clear(),this._shadowMap.onBeforeRenderObservable.clear(),this._shadowMap.onBeforeRenderObservable.add((t=>{this._sceneUBOs&&this._scene.setSceneUniformBuffer(this._sceneUBOs[t]),this._currentLayer=t,this._filter===dh.FILTER_PCF&&e.setColorWrite(!1),this._scene.setTransformMatrix(this.getCascadeViewMatrix(t),this.getCascadeProjectionMatrix(t)),this._useUBO&&(this._scene.getSceneUniformBuffer().unbindEffect(),this._scene.finalizeSceneUbo())})),this._shadowMap.onBeforeBindObservable.add((()=>{var t;this._currentSceneUBO=this._scene.getSceneUniformBuffer(),null===(t=e._debugPushGroup)||void 0===t||t.call(e,`cascaded shadow map generation for pass id ${e.currentRenderPassId}`,1),this._breaksAreDirty&&this._splitFrustum(),this._computeMatrices()})),this._splitFrustum()}_bindCustomEffectForRenderSubMeshForShadowMap(e,t){t.setMatrix("viewProjection",this.getCascadeTransformMatrix(this._currentLayer))}_isReadyCustomDefines(e){e.push("#define SM_DEPTHCLAMP "+(this._depthClamp&&this._filter!==dh.FILTER_PCSS?"1":"0"))}prepareDefines(e,t){super.prepareDefines(e,t);const i=this._scene,n=this._light;if(!i.shadowsEnabled||!n.shadowEnabled)return;e["SHADOWCSM"+t]=!0,e["SHADOWCSMDEBUG"+t]=this.debug,e["SHADOWCSMNUM_CASCADES"+t]=this.numCascades,e["SHADOWCSM_RIGHTHANDED"+t]=i.useRightHandedSystem;const s=this._getCamera();s&&this._shadowMaxZ<s.maxZ&&(e["SHADOWCSMUSESHADOWMAXZ"+t]=!0),0===this.cascadeBlendPercentage&&(e["SHADOWCSMNOBLEND"+t]=!0)}bindShadowLight(e,t){const i=this._light;if(!this._scene.shadowsEnabled||!i.shadowEnabled)return;const n=this._getCamera();if(!n)return;const s=this.getShadowMap();if(!s)return;const r=s.getSize().width;if(t.setMatrices("lightMatrix"+e,this._transformMatricesAsArray),t.setArray("viewFrustumZ"+e,this._viewSpaceFrustumsZ),t.setFloat("cascadeBlendFactor"+e,0===this.cascadeBlendPercentage?1e4:1/this.cascadeBlendPercentage),t.setArray("frustumLengths"+e,this._frustumLengths),this._filter===dh.FILTER_PCF)t.setDepthStencilTexture("shadowSampler"+e,s),i._uniformBuffer.updateFloat4("shadowsInfo",this.getDarkness(),r,1/r,this.frustumEdgeFalloff,e);else if(this._filter===dh.FILTER_PCSS){for(let e=0;e<this._numCascades;++e)this._lightSizeUVCorrection[2*e+0]=0===e?1:(this._cascadeMaxExtents[0].x-this._cascadeMinExtents[0].x)/(this._cascadeMaxExtents[e].x-this._cascadeMinExtents[e].x),this._lightSizeUVCorrection[2*e+1]=0===e?1:(this._cascadeMaxExtents[0].y-this._cascadeMinExtents[0].y)/(this._cascadeMaxExtents[e].y-this._cascadeMinExtents[e].y),this._depthCorrection[e]=0===e?1:(this._cascadeMaxExtents[e].z-this._cascadeMinExtents[e].z)/(this._cascadeMaxExtents[0].z-this._cascadeMinExtents[0].z);t.setDepthStencilTexture("shadowSampler"+e,s),t.setTexture("depthSampler"+e,s),t.setArray2("lightSizeUVCorrection"+e,this._lightSizeUVCorrection),t.setArray("depthCorrection"+e,this._depthCorrection),t.setFloat("penumbraDarkness"+e,this.penumbraDarkness),i._uniformBuffer.updateFloat4("shadowsInfo",this.getDarkness(),1/r,this._contactHardeningLightSizeUVRatio*r,this.frustumEdgeFalloff,e)}else t.setTexture("shadowSampler"+e,s),i._uniformBuffer.updateFloat4("shadowsInfo",this.getDarkness(),r,1/r,this.frustumEdgeFalloff,e);i._uniformBuffer.updateFloat2("depthValues",this.getLight().getDepthMinZ(n),this.getLight().getDepthMinZ(n)+this.getLight().getDepthMaxZ(n),e)}getTransformMatrix(){return this.getCascadeTransformMatrix(0)}dispose(){super.dispose(),this._freezeShadowCastersBoundingInfoObservable&&(this._scene.onBeforeRenderObservable.remove(this._freezeShadowCastersBoundingInfoObservable),this._freezeShadowCastersBoundingInfoObservable=null),this._depthReducer&&(this._depthReducer.dispose(),this._depthReducer=null)}serialize(){const e=super.serialize(),t=this.getShadowMap();if(!t)return e;if(e.numCascades=this._numCascades,e.debug=this._debug,e.stabilizeCascades=this.stabilizeCascades,e.lambda=this._lambda,e.cascadeBlendPercentage=this.cascadeBlendPercentage,e.depthClamp=this._depthClamp,e.autoCalcDepthBounds=this.autoCalcDepthBounds,e.shadowMaxZ=this._shadowMaxZ,e.penumbraDarkness=this.penumbraDarkness,e.freezeShadowCastersBoundingInfo=this._freezeShadowCastersBoundingInfo,e.minDistance=this.minDistance,e.maxDistance=this.maxDistance,e.renderList=[],t.renderList)for(let i=0;i<t.renderList.length;i++){const n=t.renderList[i];e.renderList.push(n.id)}return e}static Parse(e,t){const i=dh.Parse(e,t,((e,t,i)=>new Th(e,t,void 0,i)));return void 0!==e.numCascades&&(i.numCascades=e.numCascades),void 0!==e.debug&&(i.debug=e.debug),void 0!==e.stabilizeCascades&&(i.stabilizeCascades=e.stabilizeCascades),void 0!==e.lambda&&(i.lambda=e.lambda),void 0!==e.cascadeBlendPercentage&&(i.cascadeBlendPercentage=e.cascadeBlendPercentage),void 0!==e.depthClamp&&(i.depthClamp=e.depthClamp),void 0!==e.autoCalcDepthBounds&&(i.autoCalcDepthBounds=e.autoCalcDepthBounds),void 0!==e.shadowMaxZ&&(i.shadowMaxZ=e.shadowMaxZ),void 0!==e.penumbraDarkness&&(i.penumbraDarkness=e.penumbraDarkness),void 0!==e.freezeShadowCastersBoundingInfo&&(i.freezeShadowCastersBoundingInfo=e.freezeShadowCastersBoundingInfo),void 0!==e.minDistance&&void 0!==e.maxDistance&&i.setMinMaxDistance(e.minDistance,e.maxDistance),i}}Th._FrustumCornersNDCSpace=[new o.P(-1,1,-1),new o.P(1,1,-1),new o.P(1,-1,-1),new o.P(-1,-1,-1),new o.P(-1,1,1),new o.P(1,1,1),new o.P(1,-1,1),new o.P(-1,-1,1)],Th.CLASSNAME="CascadedShadowGenerator",Th.DEFAULT_CASCADES_COUNT=4,Th.MIN_CASCADES_COUNT=2,Th.MAX_CASCADES_COUNT=4,Th._SceneComponentInitialization=e=>{throw(0,Zl.S)("ShadowGeneratorSceneComponent")},n.p.AddParser(ve.l.NAME_SHADOWGENERATOR,((e,t)=>{if(void 0!==e.shadowGenerators&&null!==e.shadowGenerators)for(let i=0,n=e.shadowGenerators.length;i<n;i++){const n=e.shadowGenerators[i];n.className===Th.CLASSNAME?Th.Parse(n,t):dh.Parse(n,t)}}));class Sh{constructor(e){this.name=ve.l.NAME_SHADOWGENERATOR,this.scene=e}register(){this.scene._gatherRenderTargetsStage.registerStep(ve.l.STEP_GATHERRENDERTARGETS_SHADOWGENERATOR,this,this._gatherRenderTargets)}rebuild(){}serialize(e){e.shadowGenerators=[];const t=this.scene.lights;for(const i of t){const t=i.getShadowGenerators();if(t){const i=t.values();for(let t=i.next();!0!==t.done;t=i.next()){const i=t.value;e.shadowGenerators.push(i.serialize())}}}}addFromContainer(e){}removeFromContainer(e,t){}dispose(){}_gatherRenderTargets(e){const t=this.scene;if(this.scene.shadowsEnabled)for(let i=0;i<t.lights.length;i++){const n=t.lights[i],s=n.getShadowGenerators();if(n.isEnabled()&&n.shadowEnabled&&s){const i=s.values();for(let n=i.next();!0!==n.done;n=i.next()){const i=n.value.getShadowMap();-1!==t.textures.indexOf(i)&&e.push(i)}}}}}dh._SceneComponentInitialization=e=>{let t=e._getComponent(ve.l.NAME_SHADOWGENERATOR);t||(t=new Sh(e),e._addComponent(t))};var Eh=i(5520);class Ch{constructor(e,t="",i="black"){this._renderingCanvas=e,this._loadingText=t,this._loadingDivBackgroundColor=i,this._resizeLoadingUI=()=>{const e=this._renderingCanvas.getBoundingClientRect(),t=window.getComputedStyle(this._renderingCanvas).position;this._loadingDiv&&(this._loadingDiv.style.position="fixed"===t?"fixed":"absolute",this._loadingDiv.style.left=e.left+"px",this._loadingDiv.style.top=e.top+"px",this._loadingDiv.style.width=e.width+"px",this._loadingDiv.style.height=e.height+"px")}}displayLoadingUI(){if(this._loadingDiv)return;this._loadingDiv=document.createElement("div"),this._loadingDiv.id="babylonjsLoadingDiv",this._loadingDiv.style.opacity="0",this._loadingDiv.style.transition="opacity 1.5s ease",this._loadingDiv.style.pointerEvents="none",this._loadingDiv.style.display="grid",this._loadingDiv.style.gridTemplateRows="100%",this._loadingDiv.style.gridTemplateColumns="100%",this._loadingDiv.style.justifyItems="center",this._loadingDiv.style.alignItems="center",this._loadingTextDiv=document.createElement("div"),this._loadingTextDiv.style.position="absolute",this._loadingTextDiv.style.left="0",this._loadingTextDiv.style.top="50%",this._loadingTextDiv.style.marginTop="80px",this._loadingTextDiv.style.width="100%",this._loadingTextDiv.style.height="20px",this._loadingTextDiv.style.fontFamily="Arial",this._loadingTextDiv.style.fontSize="14px",this._loadingTextDiv.style.color="white",this._loadingTextDiv.style.textAlign="center",this._loadingTextDiv.style.zIndex="1",this._loadingTextDiv.innerHTML="Loading",this._loadingDiv.appendChild(this._loadingTextDiv),this._loadingTextDiv.innerHTML=this._loadingText,this._style=document.createElement("style"),this._style.type="text/css",this._style.innerHTML="@-webkit-keyframes spin1 {                    0% { -webkit-transform: rotate(0deg);}\n                    100% { -webkit-transform: rotate(360deg);}\n                }                @keyframes spin1 {                    0% { transform: rotate(0deg);}\n                    100% { transform: rotate(360deg);}\n                }",document.getElementsByTagName("head")[0].appendChild(this._style);const e=!!window.SVGSVGElement,t=new Image;Ch.DefaultLogoUrl?t.src=Ch.DefaultLogoUrl:t.src=e?"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxODAuMTcgMjA4LjA0Ij48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6I2UwNjg0Yjt9LmNscy0ze2ZpbGw6I2JiNDY0Yjt9LmNscy00e2ZpbGw6I2UwZGVkODt9LmNscy01e2ZpbGw6I2Q1ZDJjYTt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPkJhYnlsb25Mb2dvPC90aXRsZT48ZyBpZD0iTGF5ZXJfMiIgZGF0YS1uYW1lPSJMYXllciAyIj48ZyBpZD0iUGFnZV9FbGVtZW50cyIgZGF0YS1uYW1lPSJQYWdlIEVsZW1lbnRzIj48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik05MC4wOSwwLDAsNTJWMTU2bDkwLjA5LDUyLDkwLjA4LTUyVjUyWiIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxODAuMTcgNTIuMDEgMTUxLjk3IDM1LjczIDEyNC44NSA1MS4zOSAxNTMuMDUgNjcuNjcgMTgwLjE3IDUyLjAxIi8+PHBvbHlnb24gY2xhc3M9ImNscy0yIiBwb2ludHM9IjI3LjEyIDY3LjY3IDExNy4yMSAxNS42NiA5MC4wOCAwIDAgNTIuMDEgMjcuMTIgNjcuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iNjEuODkgMTIwLjMgOTAuMDggMTM2LjU4IDExOC4yOCAxMjAuMyA5MC4wOCAxMDQuMDIgNjEuODkgMTIwLjMiLz48cG9seWdvbiBjbGFzcz0iY2xzLTMiIHBvaW50cz0iMTUzLjA1IDY3LjY3IDE1My4wNSAxNDAuMzcgOTAuMDggMTc2LjcyIDI3LjEyIDE0MC4zNyAyNy4xMiA2Ny42NyAwIDUyLjAxIDAgMTU2LjAzIDkwLjA4IDIwOC4wNCAxODAuMTcgMTU2LjAzIDE4MC4xNyA1Mi4wMSAxNTMuMDUgNjcuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTMiIHBvaW50cz0iOTAuMDggNzEuNDYgNjEuODkgODcuNzQgNjEuODkgMTIwLjMgOTAuMDggMTA0LjAyIDExOC4yOCAxMjAuMyAxMTguMjggODcuNzQgOTAuMDggNzEuNDYiLz48cG9seWdvbiBjbGFzcz0iY2xzLTQiIHBvaW50cz0iMTUzLjA1IDY3LjY3IDExOC4yOCA4Ny43NCAxMTguMjggMTIwLjMgOTAuMDggMTM2LjU4IDkwLjA4IDE3Ni43MiAxNTMuMDUgMTQwLjM3IDE1My4wNSA2Ny42NyIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtNSIgcG9pbnRzPSIyNy4xMiA2Ny42NyA2MS44OSA4Ny43NCA2MS44OSAxMjAuMyA5MC4wOCAxMzYuNTggOTAuMDggMTc2LjcyIDI3LjEyIDE0MC4zNyAyNy4xMiA2Ny42NyIvPjwvZz48L2c+PC9zdmc+":"https://cdn.babylonjs.com/Assets/babylonLogo.png",t.style.width="150px",t.style.gridColumn="1",t.style.gridRow="1",t.style.top="50%",t.style.left="50%",t.style.transform="translate(-50%, -50%)",t.style.position="absolute";const i=document.createElement("div");i.style.width="300px",i.style.gridColumn="1",i.style.gridRow="1",i.style.top="50%",i.style.left="50%",i.style.transform="translate(-50%, -50%)",i.style.position="absolute";const n=new Image;if(Ch.DefaultSpinnerUrl?n.src=Ch.DefaultSpinnerUrl:n.src=e?"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzOTIgMzkyIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2UwNjg0Yjt9LmNscy0ye2ZpbGw6bm9uZTt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPlNwaW5uZXJJY29uPC90aXRsZT48ZyBpZD0iTGF5ZXJfMiIgZGF0YS1uYW1lPSJMYXllciAyIj48ZyBpZD0iU3Bpbm5lciI+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNNDAuMjEsMTI2LjQzYzMuNy03LjMxLDcuNjctMTQuNDQsMTItMjEuMzJsMy4zNi01LjEsMy41Mi01YzEuMjMtMS42MywyLjQxLTMuMjksMy42NS00LjkxczIuNTMtMy4yMSwzLjgyLTQuNzlBMTg1LjIsMTg1LjIsMCwwLDEsODMuNCw2Ny40M2EyMDgsMjA4LDAsMCwxLDE5LTE1LjY2YzMuMzUtMi40MSw2Ljc0LTQuNzgsMTAuMjUtN3M3LjExLTQuMjgsMTAuNzUtNi4zMmM3LjI5LTQsMTQuNzMtOCwyMi41My0xMS40OSwzLjktMS43Miw3Ljg4LTMuMywxMi00LjY0YTEwNC4yMiwxMDQuMjIsMCwwLDEsMTIuNDQtMy4yMyw2Mi40NCw2Mi40NCwwLDAsMSwxMi43OC0xLjM5QTI1LjkyLDI1LjkyLDAsMCwxLDE5NiwyMS40NGE2LjU1LDYuNTUsMCwwLDEsMi4wNSw5LDYuNjYsNi42NiwwLDAsMS0xLjY0LDEuNzhsLS40MS4yOWEyMi4wNywyMi4wNywwLDAsMS01Ljc4LDMsMzAuNDIsMzAuNDIsMCwwLDEtNS42NywxLjYyLDM3LjgyLDM3LjgyLDAsMCwxLTUuNjkuNzFjLTEsMC0xLjkuMTgtMi44NS4yNmwtMi44NS4yNHEtNS43Mi41MS0xMS40OCwxLjFjLTMuODQuNC03LjcxLjgyLTExLjU4LDEuNGExMTIuMzQsMTEyLjM0LDAsMCwwLTIyLjk0LDUuNjFjLTMuNzIsMS4zNS03LjM0LDMtMTAuOTQsNC42NHMtNy4xNCwzLjUxLTEwLjYsNS41MUExNTEuNiwxNTEuNiwwLDAsMCw2OC41Niw4N0M2Ny4yMyw4OC40OCw2Niw5MCw2NC42NCw5MS41NnMtMi41MSwzLjE1LTMuNzUsNC43M2wtMy41NCw0LjljLTEuMTMsMS42Ni0yLjIzLDMuMzUtMy4zMyw1YTEyNywxMjcsMCwwLDAtMTAuOTMsMjEuNDksMS41OCwxLjU4LDAsMSwxLTMtMS4xNVM0MC4xOSwxMjYuNDcsNDAuMjEsMTI2LjQzWiIvPjxyZWN0IGNsYXNzPSJjbHMtMiIgd2lkdGg9IjM5MiIgaGVpZ2h0PSIzOTIiLz48L2c+PC9nPjwvc3ZnPg==":"https://cdn.babylonjs.com/Assets/loadingIcon.png",n.style.animation="spin1 0.75s infinite linear",n.style.webkitAnimation="spin1 0.75s infinite linear",n.style.transformOrigin="50% 50%",n.style.webkitTransformOrigin="50% 50%",!e){const e={w:16,h:18.5},i={w:30,h:30};t.style.width=`${e.w}vh`,t.style.height=`${e.h}vh`,t.style.left=`calc(50% - ${e.w/2}vh)`,t.style.top=`calc(50% - ${e.h/2}vh)`,n.style.width=`${i.w}vh`,n.style.height=`${i.h}vh`,n.style.left=`calc(50% - ${i.w/2}vh)`,n.style.top=`calc(50% - ${i.h/2}vh)`}i.appendChild(n),this._loadingDiv.appendChild(t),this._loadingDiv.appendChild(i),this._resizeLoadingUI(),window.addEventListener("resize",this._resizeLoadingUI),this._loadingDiv.style.backgroundColor=this._loadingDivBackgroundColor,document.body.appendChild(this._loadingDiv),this._loadingDiv.style.opacity="1"}hideLoadingUI(){this._loadingDiv&&(this._loadingDiv.style.opacity="0",this._loadingDiv.addEventListener("transitionend",(()=>{this._loadingTextDiv&&(this._loadingTextDiv.remove(),this._loadingTextDiv=null),this._loadingDiv&&(this._loadingDiv.remove(),this._loadingDiv=null),this._style&&(this._style.remove(),this._style=null),window.removeEventListener("resize",this._resizeLoadingUI)})))}set loadingUIText(e){this._loadingText=e,this._loadingTextDiv&&(this._loadingTextDiv.innerHTML=this._loadingText)}get loadingUIText(){return this._loadingText}get loadingUIBackgroundColor(){return this._loadingDivBackgroundColor}set loadingUIBackgroundColor(e){this._loadingDivBackgroundColor=e,this._loadingDiv&&(this._loadingDiv.style.backgroundColor=this._loadingDivBackgroundColor)}}Ch.DefaultLogoUrl="",Ch.DefaultSpinnerUrl="",ue.D.DefaultLoadingScreenFactory=e=>new Ch(e);var Ah=i(7321),Ph=i(9828);class Rh{static ConvertPanoramaToCubemap(e,t,i,n,s=!1){if(!e)throw"ConvertPanoramaToCubemap: input cannot be null";if(e.length!=t*i*3)throw"ConvertPanoramaToCubemap: input size is wrong";return{front:this.CreateCubemapTexture(n,this.FACE_FRONT,e,t,i,s),back:this.CreateCubemapTexture(n,this.FACE_BACK,e,t,i,s),left:this.CreateCubemapTexture(n,this.FACE_LEFT,e,t,i,s),right:this.CreateCubemapTexture(n,this.FACE_RIGHT,e,t,i,s),up:this.CreateCubemapTexture(n,this.FACE_UP,e,t,i,s),down:this.CreateCubemapTexture(n,this.FACE_DOWN,e,t,i,s),size:n,type:1,format:4,gammaSpace:!1}}static CreateCubemapTexture(e,t,i,n,s,r=!1){const o=new ArrayBuffer(e*e*4*3),a=new Float32Array(o),l=r?Math.max(1,Math.round(n/4/e)):1,h=1/l,c=h*h,u=t[1].subtract(t[0]).scale(h/e),d=t[3].subtract(t[2]).scale(h/e),p=1/e;let f=0;for(let r=0;r<e;r++)for(let o=0;o<l;o++){let o=t[0],_=t[2];for(let t=0;t<e;t++)for(let h=0;h<l;h++){const l=_.subtract(o).scale(f).add(o);l.normalize();const h=this.CalcProjectionSpherical(l,i,n,s);a[r*e*3+3*t+0]+=h.r*c,a[r*e*3+3*t+1]+=h.g*c,a[r*e*3+3*t+2]+=h.b*c,o=o.add(u),_=_.add(d)}f+=p*h}return a}static CalcProjectionSpherical(e,t,i,n){let s=Math.atan2(e.z,e.x);const r=Math.acos(e.y);for(;s<-Math.PI;)s+=2*Math.PI;for(;s>Math.PI;)s-=2*Math.PI;let o=s/Math.PI;const a=r/Math.PI;o=.5*o+.5;let l=Math.round(o*i);l<0?l=0:l>=i&&(l=i-1);let h=Math.round(a*n);h<0?h=0:h>=n&&(h=n-1);const c=n-h-1;return{r:t[c*i*3+3*l+0],g:t[c*i*3+3*l+1],b:t[c*i*3+3*l+2]}}}Rh.FACE_LEFT=[new o.P(-1,-1,-1),new o.P(1,-1,-1),new o.P(-1,1,-1),new o.P(1,1,-1)],Rh.FACE_RIGHT=[new o.P(1,-1,1),new o.P(-1,-1,1),new o.P(1,1,1),new o.P(-1,1,1)],Rh.FACE_FRONT=[new o.P(1,-1,-1),new o.P(1,-1,1),new o.P(1,1,-1),new o.P(1,1,1)],Rh.FACE_BACK=[new o.P(-1,-1,1),new o.P(-1,-1,-1),new o.P(-1,1,1),new o.P(-1,1,-1)],Rh.FACE_DOWN=[new o.P(1,1,-1),new o.P(1,1,1),new o.P(-1,1,-1),new o.P(-1,1,1)],Rh.FACE_UP=[new o.P(-1,-1,-1),new o.P(-1,-1,1),new o.P(1,-1,-1),new o.P(1,-1,1)];class Mh{static _Ldexp(e,t){return t>1023?e*Math.pow(2,1023)*Math.pow(2,t-1023):t<-1074?e*Math.pow(2,-1074)*Math.pow(2,t+1074):e*Math.pow(2,t)}static _Rgbe2float(e,t,i,n,s,r){s>0?(s=this._Ldexp(1,s-136),e[r+0]=t*s,e[r+1]=i*s,e[r+2]=n*s):(e[r+0]=0,e[r+1]=0,e[r+2]=0)}static _ReadStringLine(e,t){let i="",n="";for(let s=t;s<e.length-t&&(n=String.fromCharCode(e[s]),"\n"!=n);s++)i+=n;return i}static RGBE_ReadHeader(e){let t=0,i=0,n=this._ReadStringLine(e,0);if("#"!=n[0]||"?"!=n[1])throw"Bad HDR Format.";let s=!1,r=!1,o=0;do{o+=n.length+1,n=this._ReadStringLine(e,o),"FORMAT=32-bit_rle_rgbe"==n?r=!0:0==n.length&&(s=!0)}while(!s);if(!r)throw"HDR Bad header format, unsupported FORMAT";o+=n.length+1,n=this._ReadStringLine(e,o);const a=/^-Y (.*) \+X (.*)$/g.exec(n);if(!a||a.length<3)throw"HDR Bad header format, no size";if(i=parseInt(a[2]),t=parseInt(a[1]),i<8||i>32767)throw"HDR Bad header format, unsupported size";return o+=n.length+1,{height:t,width:i,dataPosition:o}}static GetCubeMapTextureData(e,t,i=!1){const n=new Uint8Array(e),s=this.RGBE_ReadHeader(n),r=this.RGBE_ReadPixels(n,s);return Rh.ConvertPanoramaToCubemap(r,s.width,s.height,t,i)}static RGBE_ReadPixels(e,t){return this._RGBEReadPixelsRLE(e,t)}static _RGBEReadPixelsRLE(e,t){let i=t.height;const n=t.width;let s,r,o,a,l,h=t.dataPosition,c=0,u=0,d=0;const p=new ArrayBuffer(4*n),f=new Uint8Array(p),_=new ArrayBuffer(t.width*t.height*4*3),m=new Float32Array(_);for(;i>0;){if(s=e[h++],r=e[h++],o=e[h++],a=e[h++],2!=s||2!=r||128&o||t.width<8||t.width>32767)return this._RGBEReadPixelsNOTRLE(e,t);if((o<<8|a)!=n)throw"HDR Bad header format, wrong scan line width";for(c=0,d=0;d<4;d++)for(u=(d+1)*n;c<u;)if(s=e[h++],r=e[h++],s>128){if(l=s-128,0==l||l>u-c)throw"HDR Bad Format, bad scanline data (run)";for(;l-- >0;)f[c++]=r}else{if(l=s,0==l||l>u-c)throw"HDR Bad Format, bad scanline data (non-run)";if(f[c++]=r,--l>0)for(let t=0;t<l;t++)f[c++]=e[h++]}for(d=0;d<n;d++)s=f[d],r=f[d+n],o=f[d+2*n],a=f[d+3*n],this._Rgbe2float(m,s,r,o,a,(t.height-i)*n*3+3*d);i--}return m}static _RGBEReadPixelsNOTRLE(e,t){let i=t.height;const n=t.width;let s,r,o,a,l,h=t.dataPosition;const c=new ArrayBuffer(t.width*t.height*4*3),u=new Float32Array(c);for(;i>0;){for(l=0;l<t.width;l++)s=e[h++],r=e[h++],o=e[h++],a=e[h++],this._Rgbe2float(u,s,r,o,a,(t.height-i)*n*3+3*l);i--}return u}}var Ih=i(7218);si.v.ShadersStore.hdrFilteringVertexShader="attribute vec2 position;\nvarying vec3 direction;\nuniform vec3 up;\nuniform vec3 right;\nuniform vec3 front;\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nmat3 view=mat3(up,right,front);\ndirection=view*vec3(position,1.0);\ngl_Position=vec4(position,0.0,1.0);\n#define CUSTOM_VERTEX_MAIN_END\n}",i(3897),i(3154),i(4115);si.v.ShadersStore.hdrFilteringPixelShader="#include<helperFunctions>\n#include<importanceSampling>\n#include<pbrBRDFFunctions>\n#include<hdrFilteringFunctions>\nuniform float alphaG;\nuniform samplerCube inputTexture;\nuniform vec2 vFilteringInfo;\nuniform float hdrScale;\nvarying vec3 direction;\nvoid main() {\nvec3 color=radiance(alphaG,inputTexture,direction,vFilteringInfo);\ngl_FragColor=vec4(color*hdrScale,1.0);\n}";class Dh{constructor(e,t={}){this._lodGenerationOffset=0,this._lodGenerationScale=.8,this.quality=4096,this.hdrScale=1,this._engine=e,this.hdrScale=t.hdrScale||this.hdrScale,this.quality=t.quality||this.quality}_createRenderTarget(e){let t=0;this._engine.getCaps().textureHalfFloatRender?t=2:this._engine.getCaps().textureFloatRender&&(t=1);const i=this._engine.createRenderTargetCubeTexture(e,{format:5,type:t,createMipMaps:!0,generateMipMaps:!1,generateDepthBuffer:!1,generateStencilBuffer:!1,samplingMode:1});return this._engine.updateTextureWrappingMode(i.texture,0,0,0),this._engine.updateTextureSamplingMode(3,i.texture,!0),i}_prefilterInternal(e){const t=e.getSize().width,i=lt.R.ILog2(t)+1,n=this._effectWrapper.effect,s=this._createRenderTarget(t);this._effectRenderer.setViewport();const r=e.getInternalTexture();r&&this._engine.updateTextureSamplingMode(3,r,!0),this._effectRenderer.applyEffectWrapper(this._effectWrapper);const o=[[new Gr.P(0,0,-1),new Gr.P(0,-1,0),new Gr.P(1,0,0)],[new Gr.P(0,0,1),new Gr.P(0,-1,0),new Gr.P(-1,0,0)],[new Gr.P(1,0,0),new Gr.P(0,0,1),new Gr.P(0,1,0)],[new Gr.P(1,0,0),new Gr.P(0,0,-1),new Gr.P(0,-1,0)],[new Gr.P(1,0,0),new Gr.P(0,-1,0),new Gr.P(0,0,1)],[new Gr.P(-1,0,0),new Gr.P(0,-1,0),new Gr.P(0,0,-1)]];n.setFloat("hdrScale",this.hdrScale),n.setFloat2("vFilteringInfo",e.getSize().width,i),n.setTexture("inputTexture",e);for(let e=0;e<6;e++){n.setVector3("up",o[e][0]),n.setVector3("right",o[e][1]),n.setVector3("front",o[e][2]);for(let r=0;r<i;r++){this._engine.bindFramebuffer(s,e,void 0,void 0,!0,r),this._effectRenderer.applyEffectWrapper(this._effectWrapper);let i=Math.pow(2,(r-this._lodGenerationOffset)/this._lodGenerationScale)/t;0===r&&(i=0),n.setFloat("alphaG",i),this._effectRenderer.draw()}}this._effectRenderer.restoreStates(),this._engine.restoreDefaultFramebuffer(),this._engine._releaseTexture(e._texture);const a=s.texture.type,l=s.texture.format;return s._swapAndDie(e._texture),e._texture.type=a,e._texture.format=l,e.gammaSpace=!1,e.lodGenerationOffset=this._lodGenerationOffset,e.lodGenerationScale=this._lodGenerationScale,e._prefiltered=!0,e}_createEffect(e,t){const i=[];return e.gammaSpace&&i.push("#define GAMMA_INPUT"),i.push("#define NUM_SAMPLES "+this.quality+"u"),new Ih.H({engine:this._engine,name:"hdrFiltering",vertexShader:"hdrFiltering",fragmentShader:"hdrFiltering",samplerNames:["inputTexture"],uniformNames:["vSampleDirections","vWeights","up","right","front","vFilteringInfo","hdrScale","alphaG"],useShaderStore:!0,defines:i,onCompiled:t})}isReady(e){return e.isReady()&&this._effectWrapper.effect.isReady()}prefilter(e,t=null){return this._engine._features.allowTexturePrefiltering?new Promise((i=>{this._effectRenderer=new Ih.I(this._engine),this._effectWrapper=this._createEffect(e),this._effectWrapper.effect.executeWhenCompiled((()=>{this._prefilterInternal(e),this._effectRenderer.dispose(),this._effectWrapper.dispose(),i(),t&&t()}))})):(_.Y.Warn("HDR prefiltering is not available in WebGL 1., you can use real time filtering instead."),Promise.reject("HDR prefiltering is not available in WebGL 1., you can use real time filtering instead."))}}i(452);class Oh extends Oa.V{set isBlocking(e){this._isBlocking=e}get isBlocking(){return this._isBlocking}set rotationY(e){this._rotationY=e,this.setReflectionTextureMatrix(o.y3.RotationY(this._rotationY))}get rotationY(){return this._rotationY}set boundingBoxSize(e){if(this._boundingBoxSize&&this._boundingBoxSize.equals(e))return;this._boundingBoxSize=e;const t=this.getScene();t&&t.markAllMaterialsAsDirty(1)}get boundingBoxSize(){return this._boundingBoxSize}constructor(e,t,i,n=!1,s=!0,a=!1,l=!1,h=null,c=null,u=!1){var d;super(t),this._generateHarmonics=!0,this._onError=null,this._isBlocking=!0,this._rotationY=0,this.boundingBoxPosition=o.P.Zero(),this.onLoadObservable=new r.y$,e&&(this._coordinatesMode=Ce.x.CUBIC_MODE,this.name=e,this.url=e,this.hasAlpha=!1,this.isCube=!0,this._textureMatrix=o.y3.Identity(),this._prefilterOnLoad=l,this._onLoad=()=>{this.onLoadObservable.notifyObservers(this),h&&h()},this._onError=c,this.gammaSpace=a,this._noMipmap=n,this._size=i,this._supersample=u,this._generateHarmonics=s,this._texture=this._getFromCache(e,this._noMipmap,void 0,void 0,void 0,this.isCube),this._texture?this._texture.isReady?de.w1.SetImmediate((()=>this._onLoad())):this._texture.onLoadedObservable.add(this._onLoad):(null===(d=this.getScene())||void 0===d?void 0:d.useDelayedTextureLoading)?this.delayLoadState=4:this._loadTexture())}getClassName(){return"HDRCubeTexture"}_loadTexture(){const e=this._getEngine(),t=e.getCaps();let i=0;if(t.textureFloat&&t.textureFloatLinearFiltering?i=1:t.textureHalfFloat&&t.textureHalfFloatLinearFiltering&&(i=2),e._features.allowTexturePrefiltering&&this._prefilterOnLoad){const t=this._onLoad,i=new Dh(e);this._onLoad=()=>{i.prefilter(this,t)}}this._texture=e.createRawCubeTextureFromUrl(this.url,this.getScene(),this._size,4,i,this._noMipmap,(e=>{this.lodGenerationOffset=0,this.lodGenerationScale=.8;const t=Mh.GetCubeMapTextureData(e,this._size,this._supersample);if(this._generateHarmonics){const e=Ka.$.ConvertCubeMapToSphericalPolynomial(t);this.sphericalPolynomial=e}const n=[];let s=null,r=null;for(let e=0;e<6;e++){2===i?r=new Uint16Array(this._size*this._size*3):0===i&&(s=new Uint8Array(this._size*this._size*3));const o=t[Oh._FacesMapping[e]];if(this.gammaSpace||r||s)for(let e=0;e<this._size*this._size;e++)if(this.gammaSpace&&(o[3*e+0]=Math.pow(o[3*e+0],Me.zp),o[3*e+1]=Math.pow(o[3*e+1],Me.zp),o[3*e+2]=Math.pow(o[3*e+2],Me.zp)),r&&(r[3*e+0]=(0,ro.ay)(o[3*e+0]),r[3*e+1]=(0,ro.ay)(o[3*e+1]),r[3*e+2]=(0,ro.ay)(o[3*e+2])),s){let t=Math.max(255*o[3*e+0],0),i=Math.max(255*o[3*e+1],0),n=Math.max(255*o[3*e+2],0);const r=Math.max(Math.max(t,i),n);if(r>255){const e=255/r;t*=e,i*=e,n*=e}s[3*e+0]=t,s[3*e+1]=i,s[3*e+2]=n}r?n.push(r):s?n.push(s):n.push(o)}return n}),null,this._onLoad,this._onError)}clone(){const e=new Oh(this.url,this.getScene()||this._getEngine(),this._size,this._noMipmap,this._generateHarmonics,this.gammaSpace);return e.level=this.level,e.wrapU=this.wrapU,e.wrapV=this.wrapV,e.coordinatesIndex=this.coordinatesIndex,e.coordinatesMode=this.coordinatesMode,e}delayLoad(){4===this.delayLoadState&&(this.delayLoadState=1,this._texture=this._getFromCache(this.url,this._noMipmap),this._texture||this._loadTexture())}getReflectionTextureMatrix(){return this._textureMatrix}setReflectionTextureMatrix(e){var t;this._textureMatrix=e,e.updateFlag!==this._textureMatrix.updateFlag&&e.isIdentity()!==this._textureMatrix.isIdentity()&&(null===(t=this.getScene())||void 0===t||t.markAllMaterialsAsDirty(1,(e=>-1!==e.getActiveTextures().indexOf(this))))}dispose(){this.onLoadObservable.clear(),super.dispose()}static Parse(e,t,i){let n=null;return e.name&&!e.isRenderTarget&&(n=new Oh(i+e.name,t,e.size,e.noMipmap,e.generateHarmonics,e.useInGammaSpace),n.name=e.name,n.hasAlpha=e.hasAlpha,n.level=e.level,n.coordinatesMode=e.coordinatesMode,n.isBlocking=e.isBlocking),n&&(e.boundingBoxPosition&&(n.boundingBoxPosition=o.P.FromArray(e.boundingBoxPosition)),e.boundingBoxSize&&(n.boundingBoxSize=o.P.FromArray(e.boundingBoxSize)),e.rotationY&&(n.rotationY=e.rotationY)),n}serialize(){if(!this.name)return null;const e={};return e.name=this.name,e.hasAlpha=this.hasAlpha,e.isCube=!0,e.level=this.level,e.size=this._size,e.coordinatesMode=this.coordinatesMode,e.useInGammaSpace=this.gammaSpace,e.generateHarmonics=this._generateHarmonics,e.customType="BABYLON.HDRCubeTexture",e.noMipmap=this._noMipmap,e.isBlocking=this._isBlocking,e.rotationY=this._rotationY,e}}Oh._FacesMapping=["right","left","up","down","front","back"],(0,l.H)("BABYLON.HDRCubeTexture",Oh);var wh=i(4702),Nh=i(58),Fh=i(4453),Lh=i(934);class Bh{constructor(e=!0,t=10,i=CANNON){this._useDeltaForWorldStep=e,this.name="CannonJSPlugin",this._physicsMaterials=new Array,this._fixedTimeStep=1/60,this._physicsBodiesToRemoveAfterStep=new Array,this._firstFrame=!0,this._tmpQuaternion=new o._f,this._minus90X=new o._f(-.7071067811865475,0,0,.7071067811865475),this._plus90X=new o._f(.7071067811865475,0,0,.7071067811865475),this._tmpPosition=o.P.Zero(),this._tmpDeltaPosition=o.P.Zero(),this._tmpUnityRotation=new o._f,this.BJSCANNON=i,this.isSupported()?(this._extendNamespace(),this.world=new this.BJSCANNON.World,this.world.broadphase=new this.BJSCANNON.NaiveBroadphase,this.world.solver.iterations=t,this._cannonRaycastResult=new this.BJSCANNON.RaycastResult,this._raycastResult=new Fh.d):_.Y.Error("CannonJS is not available. Please make sure you included the js file.")}getPluginVersion(){return 1}setGravity(e){const t=e;this.world.gravity.set(t.x,t.y,t.z)}setTimeStep(e){this._fixedTimeStep=e}getTimeStep(){return this._fixedTimeStep}executeStep(e,t){if(this._firstFrame){this._firstFrame=!1;for(const e of t)e.type!=Qn.Q.HeightmapImpostor&&e.type!==Qn.Q.PlaneImpostor&&e.beforeStep()}this.world.step(this._useDeltaForWorldStep?e:this._fixedTimeStep),this._removeMarkedPhysicsBodiesFromWorld()}_removeMarkedPhysicsBodiesFromWorld(){this._physicsBodiesToRemoveAfterStep.length>0&&(this._physicsBodiesToRemoveAfterStep.forEach((e=>{"function"==typeof this.world.removeBody?this.world.removeBody(e):this.world.remove(e)})),this._physicsBodiesToRemoveAfterStep.length=0)}applyImpulse(e,t,i){const n=new this.BJSCANNON.Vec3(i.x,i.y,i.z),s=new this.BJSCANNON.Vec3(t.x,t.y,t.z);e.physicsBody.applyImpulse(s,n)}applyForce(e,t,i){const n=new this.BJSCANNON.Vec3(i.x,i.y,i.z),s=new this.BJSCANNON.Vec3(t.x,t.y,t.z);e.physicsBody.applyForce(s,n)}generatePhysicsBody(e){if(this._removeMarkedPhysicsBodiesFromWorld(),e.parent)e.physicsBody&&(this.removePhysicsBody(e),e.forceUpdate());else{if(e.isBodyInitRequired()){const t=this._createShape(e);if(!t)return void _.Y.Warn("It was not possible to create a physics body for this object.");const i=e.physicsBody;i&&this.removePhysicsBody(e);const n=this._addMaterial("mat-"+e.uniqueId,e.getParam("friction"),e.getParam("restitution")),s={mass:e.getParam("mass"),material:n},r=e.getParam("nativeOptions");for(const e in r)Object.prototype.hasOwnProperty.call(r,e)&&(s[e]=r[e]);e.physicsBody=new this.BJSCANNON.Body(s),e.physicsBody.addEventListener("collide",e.onCollide),this.world.addEventListener("preStep",e.beforeStep),this.world.addEventListener("postStep",e.afterStep),e.physicsBody.addShape(t),"function"==typeof this.world.addBody?this.world.addBody(e.physicsBody):this.world.add(e.physicsBody),i&&["force","torque","velocity","angularVelocity"].forEach((function(t){const n=i[t];e.physicsBody[t].set(n.x,n.y,n.z)})),this._processChildMeshes(e)}this._updatePhysicsBodyTransformation(e)}}_processChildMeshes(e){const t=e.object.getChildMeshes?e.object.getChildMeshes(!0):[],i=e.object.rotationQuaternion;if(i?i.conjugateToRef(this._tmpQuaternion):this._tmpQuaternion.set(0,0,0,1),t.length){const i=t=>{if(!t.rotationQuaternion)return;const n=t.getPhysicsImpostor();if(n&&n.parent!==e&&t.parent){const i=t.getAbsolutePosition().subtract(t.parent.getAbsolutePosition()),s=t.rotationQuaternion.multiply(this._tmpQuaternion);n.physicsBody&&(this.removePhysicsBody(n),n.physicsBody=null),n.parent=e,n.resetUpdateFlags(),e.physicsBody.addShape(this._createShape(n),new this.BJSCANNON.Vec3(i.x,i.y,i.z),new this.BJSCANNON.Quaternion(s.x,s.y,s.z,s.w)),e.physicsBody.mass+=n.getParam("mass")}t.getChildMeshes(!0).filter((e=>!!e.physicsImpostor)).forEach(i)};t.filter((e=>!!e.physicsImpostor)).forEach(i)}}removePhysicsBody(e){e.physicsBody.removeEventListener("collide",e.onCollide),this.world.removeEventListener("preStep",e.beforeStep),this.world.removeEventListener("postStep",e.afterStep),-1===this._physicsBodiesToRemoveAfterStep.indexOf(e.physicsBody)&&this._physicsBodiesToRemoveAfterStep.push(e.physicsBody)}generateJoint(e){const t=e.mainImpostor.physicsBody,i=e.connectedImpostor.physicsBody;if(!t||!i)return;let n;const s=e.joint.jointData,r={pivotA:s.mainPivot?(new this.BJSCANNON.Vec3).set(s.mainPivot.x,s.mainPivot.y,s.mainPivot.z):null,pivotB:s.connectedPivot?(new this.BJSCANNON.Vec3).set(s.connectedPivot.x,s.connectedPivot.y,s.connectedPivot.z):null,axisA:s.mainAxis?(new this.BJSCANNON.Vec3).set(s.mainAxis.x,s.mainAxis.y,s.mainAxis.z):null,axisB:s.connectedAxis?(new this.BJSCANNON.Vec3).set(s.connectedAxis.x,s.connectedAxis.y,s.connectedAxis.z):null,maxForce:s.nativeParams.maxForce,collideConnected:!!s.collision};switch(e.joint.type){case Nh.q7.HingeJoint:case Nh.q7.Hinge2Joint:n=new this.BJSCANNON.HingeConstraint(t,i,r);break;case Nh.q7.DistanceJoint:n=new this.BJSCANNON.DistanceConstraint(t,i,s.maxDistance||2);break;case Nh.q7.SpringJoint:{const e=s;n=new this.BJSCANNON.Spring(t,i,{restLength:e.length,stiffness:e.stiffness,damping:e.damping,localAnchorA:r.pivotA,localAnchorB:r.pivotB});break}case Nh.q7.LockJoint:n=new this.BJSCANNON.LockConstraint(t,i,r);break;case Nh.q7.PointToPointJoint:case Nh.q7.BallAndSocketJoint:default:n=new this.BJSCANNON.PointToPointConstraint(t,r.pivotA,i,r.pivotB,r.maxForce)}n.collideConnected=!!s.collision,e.joint.physicsJoint=n,e.joint.type!==Nh.q7.SpringJoint?this.world.addConstraint(n):(e.joint.jointData.forceApplicationCallback=e.joint.jointData.forceApplicationCallback||function(){n.applyForce()},e.mainImpostor.registerAfterPhysicsStep(e.joint.jointData.forceApplicationCallback))}removeJoint(e){e.joint.type!==Nh.q7.SpringJoint?this.world.removeConstraint(e.joint.physicsJoint):e.mainImpostor.unregisterAfterPhysicsStep(e.joint.jointData.forceApplicationCallback)}_addMaterial(e,t,i){let n,s;for(n=0;n<this._physicsMaterials.length;n++)if(s=this._physicsMaterials[n],s.friction===t&&s.restitution===i)return s;const r=new this.BJSCANNON.Material(e);return r.friction=t,r.restitution=i,this._physicsMaterials.push(r),r}_checkWithEpsilon(e){return e<Me.kn?Me.kn:e}_createShape(e){const t=e.object;let i;const n=e.getObjectExtents();switch(e.type){case Qn.Q.SphereImpostor:{const e=n.x,t=n.y,s=n.z;i=new this.BJSCANNON.Sphere(Math.max(this._checkWithEpsilon(e),this._checkWithEpsilon(t),this._checkWithEpsilon(s))/2);break}case Qn.Q.CylinderImpostor:{let t=e.getParam("nativeOptions");t||(t={});const s=void 0!==t.radiusTop?t.radiusTop:this._checkWithEpsilon(n.x)/2,r=void 0!==t.radiusBottom?t.radiusBottom:this._checkWithEpsilon(n.x)/2,o=void 0!==t.height?t.height:this._checkWithEpsilon(n.y),a=void 0!==t.numSegments?t.numSegments:16;i=new this.BJSCANNON.Cylinder(s,r,o,a);const l=new this.BJSCANNON.Quaternion;l.setFromAxisAngle(new this.BJSCANNON.Vec3(1,0,0),-Math.PI/2);const h=new this.BJSCANNON.Vec3(0,0,0);i.transformAllPoints(h,l);break}case Qn.Q.BoxImpostor:{const e=n.scale(.5);i=new this.BJSCANNON.Box(new this.BJSCANNON.Vec3(this._checkWithEpsilon(e.x),this._checkWithEpsilon(e.y),this._checkWithEpsilon(e.z)));break}case Qn.Q.PlaneImpostor:_.Y.Warn("Attention, PlaneImposter might not behave as you expect. Consider using BoxImposter instead"),i=new this.BJSCANNON.Plane;break;case Qn.Q.MeshImpostor:{const n=t.getVerticesData?t.getVerticesData(qe.o.PositionKind):[],s=t.getIndices?t.getIndices():[];if(!n)return void _.Y.Warn("Tried to create a MeshImpostor for an object without vertices. This will fail.");const r=t.position.clone(),a=t.rotation&&t.rotation.clone(),l=t.rotationQuaternion&&t.rotationQuaternion.clone();t.position.copyFromFloats(0,0,0),t.rotation&&t.rotation.copyFromFloats(0,0,0),t.rotationQuaternion&&t.rotationQuaternion.copyFrom(e.getParentsRotation()),t.rotationQuaternion&&t.parent&&t.rotationQuaternion.conjugateInPlace();const h=t.computeWorldMatrix(!0),c=new Array;let u;for(u=0;u<n.length;u+=3)o.P.TransformCoordinates(o.P.FromArray(n,u),h).toArray(c,u);_.Y.Warn("MeshImpostor only collides against spheres."),i=new this.BJSCANNON.Trimesh(c,s),t.position.copyFrom(r),a&&t.rotation&&t.rotation.copyFrom(a),l&&t.rotationQuaternion&&t.rotationQuaternion.copyFrom(l);break}case Qn.Q.HeightmapImpostor:{const n=t.position.clone(),s=t.rotation&&t.rotation.clone(),r=t.rotationQuaternion&&t.rotationQuaternion.clone();t.position.copyFromFloats(0,0,0),t.rotation&&t.rotation.copyFromFloats(0,0,0),t.rotationQuaternion&&t.rotationQuaternion.copyFrom(e.getParentsRotation()),t.rotationQuaternion&&t.parent&&t.rotationQuaternion.conjugateInPlace(),t.rotationQuaternion&&t.rotationQuaternion.multiplyInPlace(this._minus90X),i=this._createHeightmap(t),t.position.copyFrom(n),s&&t.rotation&&t.rotation.copyFrom(s),r&&t.rotationQuaternion&&t.rotationQuaternion.copyFrom(r),t.computeWorldMatrix(!0);break}case Qn.Q.ParticleImpostor:i=new this.BJSCANNON.Particle;break;case Qn.Q.NoImpostor:i=new this.BJSCANNON.Box(new this.BJSCANNON.Vec3(0,0,0))}return i}_createHeightmap(e,t){let i=e.getVerticesData(qe.o.PositionKind);const n=e.computeWorldMatrix(!0),s=new Array;let r;for(r=0;r<i.length;r+=3)o.P.TransformCoordinates(o.P.FromArray(i,r),n).toArray(s,r);i=s;const a=new Array,l=t||~~(Math.sqrt(i.length/3)-1),h=e.getBoundingInfo(),c=Math.min(h.boundingBox.extendSizeWorld.x,h.boundingBox.extendSizeWorld.y),u=h.boundingBox.extendSizeWorld.z,d=2*c/l;for(let e=0;e<i.length;e+=3){const t=Math.round(i[e+0]/d+l/2),n=Math.round(-1*(i[e+1]/d-l/2)),s=-i[e+2]+u;a[t]||(a[t]=[]),a[t][n]||(a[t][n]=s),a[t][n]=Math.max(s,a[t][n])}for(let e=0;e<=l;++e){if(!a[e]){let t=1;for(;!a[(e+t)%l];)t++;a[e]=a[(e+t)%l].slice()}for(let t=0;t<=l;++t)if(!a[e][t]){let i,n=1;for(;void 0===i;)i=a[e][(t+n++)%l];a[e][t]=i}}const p=new this.BJSCANNON.Heightfield(a,{elementSize:d});return p.minY=u,p}_updatePhysicsBodyTransformation(e){const t=e.object;if(t.computeWorldMatrix&&t.computeWorldMatrix(!0),!t.getBoundingInfo())return;const i=e.getObjectCenter();this._tmpDeltaPosition.copyFrom(t.getAbsolutePivotPoint().subtract(i)),this._tmpDeltaPosition.divideInPlace(e.object.scaling),this._tmpPosition.copyFrom(i);let n=t.rotationQuaternion;if(n){if(e.type!==Qn.Q.PlaneImpostor&&e.type!==Qn.Q.HeightmapImpostor||(n=n.multiply(this._minus90X),e.setDeltaRotation(this._plus90X)),e.type===Qn.Q.HeightmapImpostor){const e=t;let n=e.getBoundingInfo();const s=e.rotationQuaternion;e.rotationQuaternion=this._tmpUnityRotation,e.computeWorldMatrix(!0);const r=i.clone();let a=e.getPivotMatrix();a=a?a.clone():o.y3.Identity();const l=o.y3.Translation(n.boundingBox.extendSizeWorld.x,0,-n.boundingBox.extendSizeWorld.z);e.setPreTransformMatrix(l),e.computeWorldMatrix(!0),n=e.getBoundingInfo();const h=n.boundingBox.centerWorld.subtract(i).subtract(e.position).negate();this._tmpPosition.copyFromFloats(h.x,h.y-n.boundingBox.extendSizeWorld.y,h.z),this._tmpDeltaPosition.copyFrom(n.boundingBox.centerWorld.subtract(r)),this._tmpDeltaPosition.y+=n.boundingBox.extendSizeWorld.y,e.rotationQuaternion=s,e.setPreTransformMatrix(a),e.computeWorldMatrix(!0)}else e.type===Qn.Q.MeshImpostor&&this._tmpDeltaPosition.copyFromFloats(0,0,0);e.setDeltaPosition(this._tmpDeltaPosition),e.physicsBody.position.set(this._tmpPosition.x,this._tmpPosition.y,this._tmpPosition.z),e.physicsBody.quaternion.set(n.x,n.y,n.z,n.w)}}setTransformationFromPhysicsBody(e){if(e.object.position.set(e.physicsBody.position.x,e.physicsBody.position.y,e.physicsBody.position.z),e.object.rotationQuaternion){const t=e.physicsBody.quaternion;e.object.rotationQuaternion.set(t.x,t.y,t.z,t.w)}}setPhysicsBodyTransformation(e,t,i){e.physicsBody.position.set(t.x,t.y,t.z),e.physicsBody.quaternion.set(i.x,i.y,i.z,i.w)}isSupported(){return void 0!==this.BJSCANNON}setLinearVelocity(e,t){e.physicsBody.velocity.set(t.x,t.y,t.z)}setAngularVelocity(e,t){e.physicsBody.angularVelocity.set(t.x,t.y,t.z)}getLinearVelocity(e){const t=e.physicsBody.velocity;return t?new o.P(t.x,t.y,t.z):null}getAngularVelocity(e){const t=e.physicsBody.angularVelocity;return t?new o.P(t.x,t.y,t.z):null}setBodyMass(e,t){e.physicsBody.mass=t,e.physicsBody.updateMassProperties()}getBodyMass(e){return e.physicsBody.mass}getBodyFriction(e){return e.physicsBody.material.friction}setBodyFriction(e,t){e.physicsBody.material.friction=t}getBodyRestitution(e){return e.physicsBody.material.restitution}setBodyRestitution(e,t){e.physicsBody.material.restitution=t}sleepBody(e){e.physicsBody.sleep()}wakeUpBody(e){e.physicsBody.wakeUp()}updateDistanceJoint(e,t){e.physicsJoint.distance=t}setMotor(e,t,i,n){n||(e.physicsJoint.enableMotor(),e.physicsJoint.setMotorSpeed(t),i&&this.setLimit(e,i))}setLimit(e,t,i){e.physicsJoint.motorEquation.maxForce=i,e.physicsJoint.motorEquation.minForce=void 0===t?-t:t}syncMeshWithImpostor(e,t){const i=t.physicsBody;e.position.x=i.position.x,e.position.y=i.position.y,e.position.z=i.position.z,e.rotationQuaternion&&(e.rotationQuaternion.x=i.quaternion.x,e.rotationQuaternion.y=i.quaternion.y,e.rotationQuaternion.z=i.quaternion.z,e.rotationQuaternion.w=i.quaternion.w)}getRadius(e){return e.physicsBody.shapes[0].boundingSphereRadius}getBoxSizeToRef(e,t){const i=e.physicsBody.shapes[0];t.x=2*i.halfExtents.x,t.y=2*i.halfExtents.y,t.z=2*i.halfExtents.z}dispose(){}_extendNamespace(){const e=new this.BJSCANNON.Vec3,t=this.BJSCANNON;this.BJSCANNON.World.prototype.step=function(i,n,s){if(s=s||10,0===(n=n||0))this.internalStep(i),this.time+=i;else{let r=Math.floor((this.time+n)/i)-Math.floor(this.time/i);r=Math.min(r,s)||1;const o=performance.now();for(let e=0;e!==r&&(this.internalStep(i),!(performance.now()-o>1e3*i));e++);this.time+=n;const a=this.time%i/i,l=e,h=this.bodies;for(let e=0;e!==h.length;e++){const i=h[e];i.type!==t.Body.STATIC&&i.sleepState!==t.Body.SLEEPING?(i.position.vsub(i.previousPosition,l),l.scale(a,l),i.position.vadd(l,i.interpolatedPosition)):(i.interpolatedPosition.set(i.position.x,i.position.y,i.position.z),i.interpolatedQuaternion.set(i.quaternion.x,i.quaternion.y,i.quaternion.z,i.quaternion.w))}}}}raycast(e,t){return this._raycastResult.reset(e,t),this.raycastToRef(e,t,this._raycastResult),this._raycastResult}raycastToRef(e,t,i){this._cannonRaycastResult.reset(),this.world.raycastClosest(e,t,{},this._cannonRaycastResult),i.reset(e,t),this._cannonRaycastResult.hasHit&&(i.setHitData({x:this._cannonRaycastResult.hitNormalWorld.x,y:this._cannonRaycastResult.hitNormalWorld.y,z:this._cannonRaycastResult.hitNormalWorld.z},{x:this._cannonRaycastResult.hitPointWorld.x,y:this._cannonRaycastResult.hitPointWorld.y,z:this._cannonRaycastResult.hitPointWorld.z}),i.setHitDistance(this._cannonRaycastResult.distance))}}Lh.T.DefaultPluginFactory=()=>new Bh;class Uh{constructor(e=!0,t,i=OIMO){this._useDeltaForWorldStep=e,this.name="OimoJSPlugin",this._fixedTimeStep=1/60,this._tmpImpostorsArray=[],this._tmpPositionVector=o.P.Zero(),this.BJSOIMO=i,this.world=new this.BJSOIMO.World({iterations:t}),this.world.clear(),this._raycastResult=new Fh.d}getPluginVersion(){return 1}setGravity(e){this.world.gravity.set(e.x,e.y,e.z)}setTimeStep(e){this.world.timeStep=e}getTimeStep(){return this.world.timeStep}executeStep(e,t){t.forEach((function(e){e.beforeStep()})),this.world.timeStep=this._useDeltaForWorldStep?e:this._fixedTimeStep,this.world.step(),t.forEach((e=>{e.afterStep(),this._tmpImpostorsArray[e.uniqueId]=e}));let i=this.world.contacts;for(;null!==i;){if(i.touching&&!i.body1.sleeping&&!i.body2.sleeping){i=i.next;continue}const e=this._tmpImpostorsArray[+i.body1.name],t=this._tmpImpostorsArray[+i.body2.name];e&&t?(e.onCollide({body:t.physicsBody,point:null,distance:0,impulse:0,normal:null}),t.onCollide({body:e.physicsBody,point:null,distance:0,impulse:0,normal:null}),i=i.next):i=i.next}}applyImpulse(e,t,i){const n=e.physicsBody.mass;e.physicsBody.applyImpulse(i.scale(this.world.invScale),t.scale(this.world.invScale*n))}applyForce(e,t,i){_.Y.Warn("Oimo doesn't support applying force. Using impulse instead."),this.applyImpulse(e,t,i)}generatePhysicsBody(e){if(e.parent)e.physicsBody&&(this.removePhysicsBody(e),e.forceUpdate());else{if(e.isBodyInitRequired()){const i={name:e.uniqueId,config:[e.getParam("mass")||.001,e.getParam("friction"),e.getParam("restitution")],size:[],type:[],pos:[],posShape:[],rot:[],rotShape:[],move:0!==e.getParam("mass"),density:e.getParam("mass"),friction:e.getParam("friction"),restitution:e.getParam("restitution"),world:this.world},n=[e];(t=e.object).getChildMeshes&&t.getChildMeshes().forEach((function(e){e.physicsImpostor&&n.push(e.physicsImpostor)}));const s=e=>Math.max(e,Me.kn),r=new o._f;n.forEach((t=>{if(!t.object.rotationQuaternion)return;const n=t.object.rotationQuaternion;r.copyFrom(n),t.object.rotationQuaternion.set(0,0,0,1),t.object.computeWorldMatrix(!0);const o=r.toEulerAngles(),a=t.getObjectExtents(),l=57.29577951308232;if(t===e){const t=e.getObjectCenter();e.object.getAbsolutePivotPoint().subtractToRef(t,this._tmpPositionVector),this._tmpPositionVector.divideInPlace(e.object.scaling),i.pos.push(t.x),i.pos.push(t.y),i.pos.push(t.z),i.posShape.push(0,0,0),i.rotShape.push(0,0,0)}else{const e=t.object.position.clone();i.posShape.push(e.x),i.posShape.push(e.y),i.posShape.push(e.z),i.rotShape.push(o.x*l,o.y*l,o.z*l)}switch(t.object.rotationQuaternion.copyFrom(r),t.type){case Qn.Q.ParticleImpostor:_.Y.Warn("No Particle support in OIMO.js. using SphereImpostor instead");case Qn.Q.SphereImpostor:{const e=a.x,t=a.y,n=a.z,r=Math.max(s(e),s(t),s(n))/2;i.type.push("sphere"),i.size.push(r),i.size.push(r),i.size.push(r);break}case Qn.Q.CylinderImpostor:{const e=s(a.x)/2,t=s(a.y);i.type.push("cylinder"),i.size.push(e),i.size.push(t),i.size.push(t);break}case Qn.Q.PlaneImpostor:case Qn.Q.BoxImpostor:default:{const e=s(a.x),t=s(a.y),n=s(a.z);i.type.push("box"),i.size.push(e),i.size.push(t),i.size.push(n);break}}t.object.rotationQuaternion=n})),e.physicsBody=this.world.add(i),e.physicsBody.resetQuaternion(r),e.physicsBody.updatePosition(0)}else this._tmpPositionVector.copyFromFloats(0,0,0);e.setDeltaPosition(this._tmpPositionVector)}var t}removePhysicsBody(e){this.world.removeRigidBody(e.physicsBody)}generateJoint(e){const t=e.mainImpostor.physicsBody,i=e.connectedImpostor.physicsBody;if(!t||!i)return;const n=e.joint.jointData,s=n.nativeParams||{};let r;const o={body1:t,body2:i,axe1:s.axe1||(n.mainAxis?n.mainAxis.asArray():null),axe2:s.axe2||(n.connectedAxis?n.connectedAxis.asArray():null),pos1:s.pos1||(n.mainPivot?n.mainPivot.asArray():null),pos2:s.pos2||(n.connectedPivot?n.connectedPivot.asArray():null),min:s.min,max:s.max,collision:s.collision||n.collision,spring:s.spring,world:this.world};switch(e.joint.type){case Nh.q7.BallAndSocketJoint:r="jointBall";break;case Nh.q7.SpringJoint:{_.Y.Warn("OIMO.js doesn't support Spring Constraint. Simulating using DistanceJoint instead");const e=n;o.min=e.length||o.min,o.max=Math.max(o.min,o.max)}case Nh.q7.DistanceJoint:r="jointDistance",o.max=n.maxDistance;break;case Nh.q7.PrismaticJoint:r="jointPrisme";break;case Nh.q7.SliderJoint:r="jointSlide";break;case Nh.q7.WheelJoint:r="jointWheel";break;case Nh.q7.HingeJoint:default:r="jointHinge"}o.type=r,e.joint.physicsJoint=this.world.add(o)}removeJoint(e){try{this.world.removeJoint(e.joint.physicsJoint)}catch(e){_.Y.Warn(e)}}isSupported(){return void 0!==this.BJSOIMO}setTransformationFromPhysicsBody(e){if(!e.physicsBody.sleeping){if(e.physicsBody.shapes.next){let t=e.physicsBody.shapes;for(;t.next;)t=t.next;e.object.position.set(t.position.x,t.position.y,t.position.z)}else{const t=e.physicsBody.getPosition();e.object.position.set(t.x,t.y,t.z)}if(e.object.rotationQuaternion){const t=e.physicsBody.getQuaternion();e.object.rotationQuaternion.set(t.x,t.y,t.z,t.w)}}}setPhysicsBodyTransformation(e,t,i){const n=e.physicsBody;e.physicsBody.shapes.next||(n.position.set(t.x,t.y,t.z),n.orientation.set(i.x,i.y,i.z,i.w),n.syncShapes(),n.awake())}setLinearVelocity(e,t){e.physicsBody.linearVelocity.set(t.x,t.y,t.z)}setAngularVelocity(e,t){e.physicsBody.angularVelocity.set(t.x,t.y,t.z)}getLinearVelocity(e){const t=e.physicsBody.linearVelocity;return t?new o.P(t.x,t.y,t.z):null}getAngularVelocity(e){const t=e.physicsBody.angularVelocity;return t?new o.P(t.x,t.y,t.z):null}setBodyMass(e,t){const i=0===t;e.physicsBody.shapes.density=i?1:t,e.physicsBody.setupMass(i?2:1)}getBodyMass(e){return e.physicsBody.shapes.density}getBodyFriction(e){return e.physicsBody.shapes.friction}setBodyFriction(e,t){e.physicsBody.shapes.friction=t}getBodyRestitution(e){return e.physicsBody.shapes.restitution}setBodyRestitution(e,t){e.physicsBody.shapes.restitution=t}sleepBody(e){e.physicsBody.sleep()}wakeUpBody(e){e.physicsBody.awake()}updateDistanceJoint(e,t,i){e.physicsJoint.limitMotor.upperLimit=t,void 0!==i&&(e.physicsJoint.limitMotor.lowerLimit=i)}setMotor(e,t,i,n){void 0!==i?_.Y.Warn("OimoJS plugin currently has unexpected behavior when using setMotor with force parameter"):i=1e6,t*=-1;const s=n?e.physicsJoint.rotationalLimitMotor2:e.physicsJoint.rotationalLimitMotor1||e.physicsJoint.rotationalLimitMotor||e.physicsJoint.limitMotor;s&&s.setMotor(t,i)}setLimit(e,t,i,n){const s=n?e.physicsJoint.rotationalLimitMotor2:e.physicsJoint.rotationalLimitMotor1||e.physicsJoint.rotationalLimitMotor||e.physicsJoint.limitMotor;s&&s.setLimit(t,void 0===i?-t:i)}syncMeshWithImpostor(e,t){const i=t.physicsBody;e.position.x=i.position.x,e.position.y=i.position.y,e.position.z=i.position.z,e.rotationQuaternion&&(e.rotationQuaternion.x=i.orientation.x,e.rotationQuaternion.y=i.orientation.y,e.rotationQuaternion.z=i.orientation.z,e.rotationQuaternion.w=i.orientation.w)}getRadius(e){return e.physicsBody.shapes.radius}getBoxSizeToRef(e,t){const i=e.physicsBody.shapes;t.x=2*i.halfWidth,t.y=2*i.halfHeight,t.z=2*i.halfDepth}dispose(){this.world.clear()}raycast(e,t){return _.Y.Warn("raycast is not currently supported by the Oimo physics plugin"),this._raycastResult.reset(e,t),this._raycastResult}raycastToRef(e,t,i){_.Y.Warn("raycast is not currently supported by the Oimo physics plugin"),i.reset(e,t)}}class Vh{constructor(e=!0,t=Ammo,i=null){this._useDeltaForWorldStep=e,this.bjsAMMO={},this.name="AmmoJSPlugin",this._timeStep=1/60,this._fixedTimeStep=1/60,this._maxSteps=5,this._tmpQuaternion=new o._f,this._tmpContactCallbackResult=!1,this._tmpContactPoint=new o.P,this._tmpContactNormal=new o.P,this._tmpVec3=new o.P,this._tmpMatrix=new o.y3,"function"!=typeof t?(this.bjsAMMO=t,this.isSupported()?(this._collisionConfiguration=new this.bjsAMMO.btSoftBodyRigidBodyCollisionConfiguration,this._dispatcher=new this.bjsAMMO.btCollisionDispatcher(this._collisionConfiguration),this._overlappingPairCache=i||new this.bjsAMMO.btDbvtBroadphase,this._solver=new this.bjsAMMO.btSequentialImpulseConstraintSolver,this._softBodySolver=new this.bjsAMMO.btDefaultSoftBodySolver,this.world=new this.bjsAMMO.btSoftRigidDynamicsWorld(this._dispatcher,this._overlappingPairCache,this._solver,this._collisionConfiguration,this._softBodySolver),this._tmpAmmoConcreteContactResultCallback=new this.bjsAMMO.ConcreteContactResultCallback,this._tmpAmmoConcreteContactResultCallback.addSingleResult=e=>{const t=(e=this.bjsAMMO.wrapPointer(e,this.bjsAMMO.btManifoldPoint)).getPositionWorldOnA(),i=e.m_normalWorldOnB;this._tmpContactPoint.x=t.x(),this._tmpContactPoint.y=t.y(),this._tmpContactPoint.z=t.z(),this._tmpContactNormal.x=i.x(),this._tmpContactNormal.y=i.y(),this._tmpContactNormal.z=i.z(),this._tmpContactImpulse=e.getAppliedImpulse(),this._tmpContactDistance=e.getDistance(),this._tmpContactCallbackResult=!0},this._raycastResult=new Fh.d,this._tmpAmmoTransform=new this.bjsAMMO.btTransform,this._tmpAmmoTransform.setIdentity(),this._tmpAmmoQuaternion=new this.bjsAMMO.btQuaternion(0,0,0,1),this._tmpAmmoVectorA=new this.bjsAMMO.btVector3(0,0,0),this._tmpAmmoVectorB=new this.bjsAMMO.btVector3(0,0,0),this._tmpAmmoVectorC=new this.bjsAMMO.btVector3(0,0,0),this._tmpAmmoVectorD=new this.bjsAMMO.btVector3(0,0,0)):_.Y.Error("AmmoJS is not available. Please make sure you included the js file.")):_.Y.Error("AmmoJS is not ready. Please make sure you await Ammo() before using the plugin.")}getPluginVersion(){return 1}setGravity(e){this._tmpAmmoVectorA.setValue(e.x,e.y,e.z),this.world.setGravity(this._tmpAmmoVectorA),this.world.getWorldInfo().set_m_gravity(this._tmpAmmoVectorA)}setTimeStep(e){this._timeStep=e}setFixedTimeStep(e){this._fixedTimeStep=e}setMaxSteps(e){this._maxSteps=e}getTimeStep(){return this._timeStep}_isImpostorInContact(e){return this._tmpContactCallbackResult=!1,this.world.contactTest(e.physicsBody,this._tmpAmmoConcreteContactResultCallback),this._tmpContactCallbackResult}_isImpostorPairInContact(e,t){return this._tmpContactCallbackResult=!1,this.world.contactPairTest(e.physicsBody,t.physicsBody,this._tmpAmmoConcreteContactResultCallback),this._tmpContactCallbackResult}_stepSimulation(e=1/60,t=10,i=1/60){if(0==t)this.world.stepSimulation(e,0);else for(;t>0&&e>0;)e-i<i?(this.world.stepSimulation(e,0),e=0):(e-=i,this.world.stepSimulation(i,0)),t--}executeStep(e,t){for(const e of t)e.soft||e.beforeStep();this._stepSimulation(this._useDeltaForWorldStep?e:this._timeStep,this._maxSteps,this._fixedTimeStep);for(const e of t)if(e.soft?this._afterSoftStep(e):e.afterStep(),e._onPhysicsCollideCallbacks.length>0&&this._isImpostorInContact(e))for(const t of e._onPhysicsCollideCallbacks)for(const i of t.otherImpostors)(e.physicsBody.isActive()||i.physicsBody.isActive())&&this._isImpostorPairInContact(e,i)&&(e.onCollide({body:i.physicsBody,point:this._tmpContactPoint,distance:this._tmpContactDistance,impulse:this._tmpContactImpulse,normal:this._tmpContactNormal}),i.onCollide({body:e.physicsBody,point:this._tmpContactPoint,distance:this._tmpContactDistance,impulse:this._tmpContactImpulse,normal:this._tmpContactNormal}))}_afterSoftStep(e){e.type===Qn.Q.RopeImpostor?this._ropeStep(e):this._softbodyOrClothStep(e)}_ropeStep(e){const t=e.physicsBody.get_m_nodes(),i=t.size();let n,s,r,a,l;const h=new Array;for(let e=0;e<i;e++)n=t.at(e),s=n.get_m_x(),r=s.x(),a=s.y(),l=s.z(),h.push(new o.P(r,a,l));const c=e.object,u=e.getParam("shape");e._isFromLine?e.object=os("lines",{points:h,instance:c}):e.object=ms("ext",{shape:u,path:h,instance:c})}_softbodyOrClothStep(e){const t=e.type===Qn.Q.ClothImpostor?1:-1,i=e.object;let n=i.getVerticesData(qe.o.PositionKind);n||(n=[]);let s=i.getVerticesData(qe.o.NormalKind);s||(s=[]);const r=n.length/3,o=e.physicsBody.get_m_nodes();let a,l,h,c,u,d,p,f;for(let e=0;e<r;e++){a=o.at(e),l=a.get_m_x(),h=l.x(),c=l.y(),u=l.z()*t;const i=a.get_m_n();d=i.x(),p=i.y(),f=i.z()*t,n[3*e]=h,n[3*e+1]=c,n[3*e+2]=u,s[3*e]=d,s[3*e+1]=p,s[3*e+2]=f}const _=new sn.x;_.positions=n,_.normals=s,_.uvs=i.getVerticesData(qe.o.UVKind),_.colors=i.getVerticesData(qe.o.ColorKind),i&&i.getIndices&&(_.indices=i.getIndices()),_.applyToMesh(i)}applyImpulse(e,t,i){if(e.soft)_.Y.Warn("Cannot be applied to a soft body");else{e.physicsBody.activate();const n=this._tmpAmmoVectorA,s=this._tmpAmmoVectorB;e.object&&e.object.getWorldMatrix&&i.subtractInPlace(e.object.getWorldMatrix().getTranslation()),n.setValue(i.x,i.y,i.z),s.setValue(t.x,t.y,t.z),e.physicsBody.applyImpulse(s,n)}}applyForce(e,t,i){if(e.soft)_.Y.Warn("Cannot be applied to a soft body");else{e.physicsBody.activate();const n=this._tmpAmmoVectorA,s=this._tmpAmmoVectorB;if(e.object&&e.object.getWorldMatrix){const t=e.object.getWorldMatrix().getTranslation();n.setValue(i.x-t.x,i.y-t.y,i.z-t.z)}else n.setValue(i.x,i.y,i.z);s.setValue(t.x,t.y,t.z),e.physicsBody.applyForce(s,n)}}generatePhysicsBody(e){if(e._pluginData.toDispose=[],e.parent)e.physicsBody&&(this.removePhysicsBody(e),e.forceUpdate());else if(e.isBodyInitRequired()){const t=this._createShape(e),i=e.getParam("mass");if(e._pluginData.mass=i,e.soft)t.get_m_cfg().set_collisions(17),t.get_m_cfg().set_kDP(e.getParam("damping")),this.bjsAMMO.castObject(t,this.bjsAMMO.btCollisionObject).getCollisionShape().setMargin(e.getParam("margin")),t.setActivationState(Vh._DISABLE_DEACTIVATION_FLAG),this.world.addSoftBody(t,1,-1),e.physicsBody=t,e._pluginData.toDispose.push(t),this.setBodyPressure(e,0),e.type===Qn.Q.SoftbodyImpostor&&this.setBodyPressure(e,e.getParam("pressure")),this.setBodyStiffness(e,e.getParam("stiffness")),this.setBodyVelocityIterations(e,e.getParam("velocityIterations")),this.setBodyPositionIterations(e,e.getParam("positionIterations"));else{const n=new this.bjsAMMO.btVector3(0,0,0),s=new this.bjsAMMO.btTransform;e.object.computeWorldMatrix(!0),s.setIdentity(),0!==i&&t.calculateLocalInertia(i,n),this._tmpAmmoVectorA.setValue(e.object.position.x,e.object.position.y,e.object.position.z),this._tmpAmmoQuaternion.setValue(e.object.rotationQuaternion.x,e.object.rotationQuaternion.y,e.object.rotationQuaternion.z,e.object.rotationQuaternion.w),s.setOrigin(this._tmpAmmoVectorA),s.setRotation(this._tmpAmmoQuaternion);const r=new this.bjsAMMO.btDefaultMotionState(s),o=new this.bjsAMMO.btRigidBodyConstructionInfo(i,r,t,n),a=new this.bjsAMMO.btRigidBody(o);if(0===i&&(a.setCollisionFlags(a.getCollisionFlags()|Vh._KINEMATIC_FLAG),a.setActivationState(Vh._DISABLE_DEACTIVATION_FLAG)),e.type!=Qn.Q.NoImpostor||t.getChildShape||a.setCollisionFlags(a.getCollisionFlags()|Vh._DISABLE_COLLISION_FLAG),e.type!==Qn.Q.MeshImpostor&&e.type!==Qn.Q.NoImpostor){const t=e.object.getBoundingInfo();this._tmpVec3.copyFrom(e.object.getAbsolutePosition()),this._tmpVec3.subtractInPlace(t.boundingBox.centerWorld),this._tmpVec3.x/=e.object.scaling.x,this._tmpVec3.y/=e.object.scaling.y,this._tmpVec3.z/=e.object.scaling.z,e.setDeltaPosition(this._tmpVec3)}const l=e.getParam("group"),h=e.getParam("mask");l&&h?this.world.addRigidBody(a,l,h):this.world.addRigidBody(a),e.physicsBody=a,e._pluginData.toDispose=e._pluginData.toDispose.concat([a,o,r,s,n,t])}this.setBodyRestitution(e,e.getParam("restitution")),this.setBodyFriction(e,e.getParam("friction"))}}removePhysicsBody(e){this.world&&(e.soft?this.world.removeSoftBody(e.physicsBody):this.world.removeRigidBody(e.physicsBody),e._pluginData&&(e._pluginData.toDispose.forEach((e=>{this.bjsAMMO.destroy(e)})),e._pluginData.toDispose=[]))}generateJoint(e){const t=e.mainImpostor.physicsBody,i=e.connectedImpostor.physicsBody;if(!t||!i)return;const n=e.joint.jointData;let s;switch(n.mainPivot||(n.mainPivot=new o.P(0,0,0)),n.connectedPivot||(n.connectedPivot=new o.P(0,0,0)),e.joint.type){case Nh.q7.DistanceJoint:{const e=n.maxDistance;e&&(n.mainPivot=new o.P(0,-e/2,0),n.connectedPivot=new o.P(0,e/2,0)),s=new this.bjsAMMO.btPoint2PointConstraint(t,i,new this.bjsAMMO.btVector3(n.mainPivot.x,n.mainPivot.y,n.mainPivot.z),new this.bjsAMMO.btVector3(n.connectedPivot.x,n.connectedPivot.y,n.connectedPivot.z));break}case Nh.q7.HingeJoint:{n.mainAxis||(n.mainAxis=new o.P(0,0,0)),n.connectedAxis||(n.connectedAxis=new o.P(0,0,0));const e=new this.bjsAMMO.btVector3(n.mainAxis.x,n.mainAxis.y,n.mainAxis.z),r=new this.bjsAMMO.btVector3(n.connectedAxis.x,n.connectedAxis.y,n.connectedAxis.z);s=new this.bjsAMMO.btHingeConstraint(t,i,new this.bjsAMMO.btVector3(n.mainPivot.x,n.mainPivot.y,n.mainPivot.z),new this.bjsAMMO.btVector3(n.connectedPivot.x,n.connectedPivot.y,n.connectedPivot.z),e,r);break}case Nh.q7.BallAndSocketJoint:s=new this.bjsAMMO.btPoint2PointConstraint(t,i,new this.bjsAMMO.btVector3(n.mainPivot.x,n.mainPivot.y,n.mainPivot.z),new this.bjsAMMO.btVector3(n.connectedPivot.x,n.connectedPivot.y,n.connectedPivot.z));break;default:_.Y.Warn("JointType not currently supported by the Ammo plugin, falling back to PhysicsJoint.BallAndSocketJoint"),s=new this.bjsAMMO.btPoint2PointConstraint(t,i,new this.bjsAMMO.btVector3(n.mainPivot.x,n.mainPivot.y,n.mainPivot.z),new this.bjsAMMO.btVector3(n.connectedPivot.x,n.connectedPivot.y,n.connectedPivot.z))}this.world.addConstraint(s,!e.joint.jointData.collision),e.joint.physicsJoint=s}removeJoint(e){this.world&&this.world.removeConstraint(e.joint.physicsJoint)}_addMeshVerts(e,t,i){let n=0;if(i&&i.getIndices&&i.getWorldMatrix&&i.getChildMeshes){let s=i.getIndices();s||(s=[]);let r,a=i.getVerticesData(qe.o.PositionKind);if(a||(a=[]),t&&t!==i){let e;e=t.rotationQuaternion?t.rotationQuaternion:t.rotation?o._f.FromEulerAngles(t.rotation.x,t.rotation.y,t.rotation.z):o._f.Identity(),o.y3.Compose(o.P.One(),e,t.position).invertToRef(this._tmpMatrix),r=i.computeWorldMatrix(!1).multiply(this._tmpMatrix)}else o.y3.ScalingToRef(i.scaling.x,i.scaling.y,i.scaling.z,this._tmpMatrix),r=this._tmpMatrix;const l=s.length/3;for(let t=0;t<l;t++){const i=[];for(let e=0;e<3;e++){let n,l=new o.P(a[3*s[3*t+e]+0],a[3*s[3*t+e]+1],a[3*s[3*t+e]+2]);l=o.P.TransformCoordinates(l,r),n=0==e?this._tmpAmmoVectorA:1==e?this._tmpAmmoVectorB:this._tmpAmmoVectorC,n.setValue(l.x,l.y,l.z),i.push(n)}e.addTriangle(i[0],i[1],i[2]),n++}i.getChildMeshes().forEach((i=>{n+=this._addMeshVerts(e,t,i)}))}return n}_softVertexData(e){const t=e.object;if(t&&t.getIndices&&t.getWorldMatrix&&t.getChildMeshes){let e=t.getIndices();e||(e=[]);let i=t.getVerticesData(qe.o.PositionKind);i||(i=[]);let n=t.getVerticesData(qe.o.NormalKind);n||(n=[]),t.computeWorldMatrix(!1);const s=[],r=[];for(let e=0;e<i.length;e+=3){let a=new o.P(i[e],i[e+1],i[e+2]),l=new o.P(n[e],n[e+1],n[e+2]);a=o.P.TransformCoordinates(a,t.getWorldMatrix()),l=o.P.TransformNormal(l,t.getWorldMatrix()),s.push(a.x,a.y,a.z),r.push(l.x,l.y,l.z)}const a=new sn.x;return a.positions=s,a.normals=r,a.uvs=t.getVerticesData(qe.o.UVKind),a.colors=t.getVerticesData(qe.o.ColorKind),t&&t.getIndices&&(a.indices=t.getIndices()),a.applyToMesh(t),t.position=o.P.Zero(),t.rotationQuaternion=null,t.rotation=o.P.Zero(),t.computeWorldMatrix(!0),a}return sn.x.ExtractFromMesh(t)}_createSoftbody(e){const t=e.object;if(t&&t.getIndices){let i=t.getIndices();i||(i=[]);const n=this._softVertexData(e),s=n.positions,r=n.normals;if(null===s||null===r)return new this.bjsAMMO.btCompoundShape;{const e=[],n=[];for(let t=0;t<s.length;t+=3){const i=new o.P(s[t],s[t+1],s[t+2]),a=new o.P(r[t],r[t+1],r[t+2]);e.push(i.x,i.y,-i.z),n.push(a.x,a.y,-a.z)}const a=(new this.bjsAMMO.btSoftBodyHelpers).CreateFromTriMesh(this.world.getWorldInfo(),e,t.getIndices(),i.length/3,!0),l=s.length/3,h=a.get_m_nodes();let c,u;for(let e=0;e<l;e++)c=h.at(e),u=c.get_m_n(),u.setX(n[3*e]),u.setY(n[3*e+1]),u.setZ(n[3*e+2]);return a}}}_createCloth(e){const t=e.object;if(t&&t.getIndices){let i=t.getIndices();i||(i=[]);const n=this._softVertexData(e),s=n.positions,r=n.normals;if(null===s||null===r)return new this.bjsAMMO.btCompoundShape;{const t=s.length,i=Math.sqrt(t/3);e.segments=i;const n=i-1;return this._tmpAmmoVectorA.setValue(s[0],s[1],s[2]),this._tmpAmmoVectorB.setValue(s[3*n],s[3*n+1],s[3*n+2]),this._tmpAmmoVectorD.setValue(s[t-3],s[t-2],s[t-1]),this._tmpAmmoVectorC.setValue(s[t-3-3*n],s[t-2-3*n],s[t-1-3*n]),(new this.bjsAMMO.btSoftBodyHelpers).CreatePatch(this.world.getWorldInfo(),this._tmpAmmoVectorA,this._tmpAmmoVectorB,this._tmpAmmoVectorC,this._tmpAmmoVectorD,i,i,e.getParam("fixedPoints"),!0)}}}_createRope(e){let t,i;const n=this._softVertexData(e),s=n.positions,r=n.normals;if(null===s||null===r)return new this.bjsAMMO.btCompoundShape;if(n.applyToMesh(e.object,!0),e._isFromLine=!0,0===r.map((e=>e*e)).reduce(((e,t)=>e+t)))t=s.length,i=t/3-1,this._tmpAmmoVectorA.setValue(s[0],s[1],s[2]),this._tmpAmmoVectorB.setValue(s[t-3],s[t-2],s[t-1]);else{e._isFromLine=!1;const n=e.getParam("path");if(null===e.getParam("shape"))return _.Y.Warn("No shape available for extruded mesh"),new this.bjsAMMO.btCompoundShape;t=n.length,i=t-1,this._tmpAmmoVectorA.setValue(n[0].x,n[0].y,n[0].z),this._tmpAmmoVectorB.setValue(n[t-1].x,n[t-1].y,n[t-1].z)}e.segments=i;let o=e.getParam("fixedPoints");o=o>3?3:o;const a=(new this.bjsAMMO.btSoftBodyHelpers).CreateRope(this.world.getWorldInfo(),this._tmpAmmoVectorA,this._tmpAmmoVectorB,i-1,o);return a.get_m_cfg().set_collisions(17),a}_createCustom(e){let t=null;return this.onCreateCustomShape&&(t=this.onCreateCustomShape(e)),null==t&&(t=new this.bjsAMMO.btCompoundShape),t}_addHullVerts(e,t,i){let n=0;if(i&&i.getIndices&&i.getWorldMatrix&&i.getChildMeshes){let s=i.getIndices();s||(s=[]);let r=i.getVerticesData(qe.o.PositionKind);r||(r=[]),i.computeWorldMatrix(!1);const a=s.length/3;for(let t=0;t<a;t++){const a=[];for(let e=0;e<3;e++){let n,l=new o.P(r[3*s[3*t+e]+0],r[3*s[3*t+e]+1],r[3*s[3*t+e]+2]);o.y3.ScalingToRef(i.scaling.x,i.scaling.y,i.scaling.z,this._tmpMatrix),l=o.P.TransformCoordinates(l,this._tmpMatrix),n=0==e?this._tmpAmmoVectorA:1==e?this._tmpAmmoVectorB:this._tmpAmmoVectorC,n.setValue(l.x,l.y,l.z),a.push(n)}e.addPoint(a[0],!0),e.addPoint(a[1],!0),e.addPoint(a[2],!0),n++}i.getChildMeshes().forEach((i=>{n+=this._addHullVerts(e,t,i)}))}return n}_createShape(e,t=!1){const i=e.object;let n;const s=e.getObjectExtents();if(!t){const t=e.object.getChildMeshes?e.object.getChildMeshes(!0):[];n=new this.bjsAMMO.btCompoundShape;let i=0;if(t.forEach((e=>{const t=e.getPhysicsImpostor();if(t){if(t.type==Qn.Q.MeshImpostor)throw"A child MeshImpostor is not supported. Only primitive impostors are supported as children (eg. box or sphere)";const s=this._createShape(t),r=e.parent.getWorldMatrix().clone(),a=new o.P;r.decompose(a),this._tmpAmmoTransform.getOrigin().setValue(e.position.x*a.x,e.position.y*a.y,e.position.z*a.z),this._tmpAmmoQuaternion.setValue(e.rotationQuaternion.x,e.rotationQuaternion.y,e.rotationQuaternion.z,e.rotationQuaternion.w),this._tmpAmmoTransform.setRotation(this._tmpAmmoQuaternion),n.addChildShape(this._tmpAmmoTransform,s),t.dispose(),i++}})),i>0){if(e.type!=Qn.Q.NoImpostor){const t=this._createShape(e,!0);t&&(this._tmpAmmoTransform.getOrigin().setValue(0,0,0),this._tmpAmmoQuaternion.setValue(0,0,0,1),this._tmpAmmoTransform.setRotation(this._tmpAmmoQuaternion),n.addChildShape(this._tmpAmmoTransform,t))}return n}this.bjsAMMO.destroy(n),n=null}switch(e.type){case Qn.Q.SphereImpostor:if(lt.R.WithinEpsilon(s.x,s.y,1e-4)&&lt.R.WithinEpsilon(s.x,s.z,1e-4))n=new this.bjsAMMO.btSphereShape(s.x/2);else{const e=[new this.bjsAMMO.btVector3(0,0,0)],t=[1];n=new this.bjsAMMO.btMultiSphereShape(e,t,1),n.setLocalScaling(new this.bjsAMMO.btVector3(s.x/2,s.y/2,s.z/2))}break;case Qn.Q.CapsuleImpostor:{const e=s.x/2;n=new this.bjsAMMO.btCapsuleShape(e,s.y-2*e)}break;case Qn.Q.CylinderImpostor:this._tmpAmmoVectorA.setValue(s.x/2,s.y/2,s.z/2),n=new this.bjsAMMO.btCylinderShape(this._tmpAmmoVectorA);break;case Qn.Q.PlaneImpostor:case Qn.Q.BoxImpostor:this._tmpAmmoVectorA.setValue(s.x/2,s.y/2,s.z/2),n=new this.bjsAMMO.btBoxShape(this._tmpAmmoVectorA);break;case Qn.Q.MeshImpostor:if(0==e.getParam("mass")){if(this.onCreateCustomMeshImpostor)n=this.onCreateCustomMeshImpostor(e);else{const t=new this.bjsAMMO.btTriangleMesh;e._pluginData.toDispose.push(t);const s=this._addMeshVerts(t,i,i);n=0==s?new this.bjsAMMO.btCompoundShape:new this.bjsAMMO.btBvhTriangleMeshShape(t)}break}case Qn.Q.ConvexHullImpostor:if(this.onCreateCustomConvexHullImpostor)n=this.onCreateCustomConvexHullImpostor(e);else{const t=new this.bjsAMMO.btConvexHullShape;0==this._addHullVerts(t,i,i)?(e._pluginData.toDispose.push(t),n=new this.bjsAMMO.btCompoundShape):n=t}break;case Qn.Q.NoImpostor:n=new this.bjsAMMO.btSphereShape(s.x/2);break;case Qn.Q.CustomImpostor:n=this._createCustom(e);break;case Qn.Q.SoftbodyImpostor:n=this._createSoftbody(e);break;case Qn.Q.ClothImpostor:n=this._createCloth(e);break;case Qn.Q.RopeImpostor:n=this._createRope(e);break;default:_.Y.Warn("The impostor type is not currently supported by the ammo plugin.")}return n}setTransformationFromPhysicsBody(e){e.physicsBody.getMotionState().getWorldTransform(this._tmpAmmoTransform),e.object.position.set(this._tmpAmmoTransform.getOrigin().x(),this._tmpAmmoTransform.getOrigin().y(),this._tmpAmmoTransform.getOrigin().z()),e.object.rotationQuaternion?e.object.rotationQuaternion.set(this._tmpAmmoTransform.getRotation().x(),this._tmpAmmoTransform.getRotation().y(),this._tmpAmmoTransform.getRotation().z(),this._tmpAmmoTransform.getRotation().w()):e.object.rotation&&(this._tmpQuaternion.set(this._tmpAmmoTransform.getRotation().x(),this._tmpAmmoTransform.getRotation().y(),this._tmpAmmoTransform.getRotation().z(),this._tmpAmmoTransform.getRotation().w()),this._tmpQuaternion.toEulerAnglesToRef(e.object.rotation))}setPhysicsBodyTransformation(e,t,i){const n=e.physicsBody.getWorldTransform();if(Math.abs(n.getOrigin().x()-t.x)>Me.kn||Math.abs(n.getOrigin().y()-t.y)>Me.kn||Math.abs(n.getOrigin().z()-t.z)>Me.kn||Math.abs(n.getRotation().x()-i.x)>Me.kn||Math.abs(n.getRotation().y()-i.y)>Me.kn||Math.abs(n.getRotation().z()-i.z)>Me.kn||Math.abs(n.getRotation().w()-i.w)>Me.kn)if(this._tmpAmmoVectorA.setValue(t.x,t.y,t.z),n.setOrigin(this._tmpAmmoVectorA),this._tmpAmmoQuaternion.setValue(i.x,i.y,i.z,i.w),n.setRotation(this._tmpAmmoQuaternion),e.physicsBody.setWorldTransform(n),0==e.mass){const t=e.physicsBody.getMotionState();t&&t.setWorldTransform(n)}else e.physicsBody.activate()}isSupported(){return void 0!==this.bjsAMMO}setLinearVelocity(e,t){this._tmpAmmoVectorA.setValue(t.x,t.y,t.z),e.soft?e.physicsBody.linearVelocity(this._tmpAmmoVectorA):e.physicsBody.setLinearVelocity(this._tmpAmmoVectorA)}setAngularVelocity(e,t){this._tmpAmmoVectorA.setValue(t.x,t.y,t.z),e.soft?e.physicsBody.angularVelocity(this._tmpAmmoVectorA):e.physicsBody.setAngularVelocity(this._tmpAmmoVectorA)}getLinearVelocity(e){let t;if(t=e.soft?e.physicsBody.linearVelocity():e.physicsBody.getLinearVelocity(),!t)return null;const i=new o.P(t.x(),t.y(),t.z());return this.bjsAMMO.destroy(t),i}getAngularVelocity(e){let t;if(t=e.soft?e.physicsBody.angularVelocity():e.physicsBody.getAngularVelocity(),!t)return null;const i=new o.P(t.x(),t.y(),t.z());return this.bjsAMMO.destroy(t),i}setBodyMass(e,t){e.soft?e.physicsBody.setTotalMass(t,!1):e.physicsBody.setMassProps(t),e._pluginData.mass=t}getBodyMass(e){return e._pluginData.mass||0}getBodyFriction(e){return e._pluginData.friction||0}setBodyFriction(e,t){e.soft?e.physicsBody.get_m_cfg().set_kDF(t):e.physicsBody.setFriction(t),e._pluginData.friction=t}getBodyRestitution(e){return e._pluginData.restitution||0}setBodyRestitution(e,t){e.physicsBody.setRestitution(t),e._pluginData.restitution=t}getBodyPressure(e){return e.soft?e._pluginData.pressure||0:(_.Y.Warn("Pressure is not a property of a rigid body"),0)}setBodyPressure(e,t){e.soft?e.type===Qn.Q.SoftbodyImpostor?(e.physicsBody.get_m_cfg().set_kPR(t),e._pluginData.pressure=t):(e.physicsBody.get_m_cfg().set_kPR(0),e._pluginData.pressure=0):_.Y.Warn("Pressure can only be applied to a softbody")}getBodyStiffness(e){return e.soft?e._pluginData.stiffness||0:(_.Y.Warn("Stiffness is not a property of a rigid body"),0)}setBodyStiffness(e,t){e.soft?(t=(t=t<0?0:t)>1?1:t,e.physicsBody.get_m_materials().at(0).set_m_kLST(t),e._pluginData.stiffness=t):_.Y.Warn("Stiffness cannot be applied to a rigid body")}getBodyVelocityIterations(e){return e.soft?e._pluginData.velocityIterations||0:(_.Y.Warn("Velocity iterations is not a property of a rigid body"),0)}setBodyVelocityIterations(e,t){e.soft?(t=t<0?0:t,e.physicsBody.get_m_cfg().set_viterations(t),e._pluginData.velocityIterations=t):_.Y.Warn("Velocity iterations cannot be applied to a rigid body")}getBodyPositionIterations(e){return e.soft?e._pluginData.positionIterations||0:(_.Y.Warn("Position iterations is not a property of a rigid body"),0)}setBodyPositionIterations(e,t){e.soft?(t=t<0?0:t,e.physicsBody.get_m_cfg().set_piterations(t),e._pluginData.positionIterations=t):_.Y.Warn("Position iterations cannot be applied to a rigid body")}appendAnchor(e,t,i,n,s=1,r=!1){const o=e.segments,a=Math.round((o-1)*i)+o*(o-1-Math.round((o-1)*n));e.physicsBody.appendAnchor(a,t.physicsBody,r,s)}appendHook(e,t,i,n=1,s=!1){const r=Math.round(e.segments*i);e.physicsBody.appendAnchor(r,t.physicsBody,s,n)}sleepBody(e){e.physicsBody.forceActivationState(0)}wakeUpBody(e){e.physicsBody.activate()}updateDistanceJoint(){_.Y.Warn("updateDistanceJoint is not currently supported by the Ammo physics plugin")}setMotor(e,t,i){e.physicsJoint.enableAngularMotor(!0,t,i)}setLimit(){_.Y.Warn("setLimit is not currently supported by the Ammo physics plugin")}syncMeshWithImpostor(e,t){t.physicsBody.getMotionState().getWorldTransform(this._tmpAmmoTransform),e.position.x=this._tmpAmmoTransform.getOrigin().x(),e.position.y=this._tmpAmmoTransform.getOrigin().y(),e.position.z=this._tmpAmmoTransform.getOrigin().z(),e.rotationQuaternion&&(e.rotationQuaternion.x=this._tmpAmmoTransform.getRotation().x(),e.rotationQuaternion.y=this._tmpAmmoTransform.getRotation().y(),e.rotationQuaternion.z=this._tmpAmmoTransform.getRotation().z(),e.rotationQuaternion.w=this._tmpAmmoTransform.getRotation().w())}getRadius(e){return e.getObjectExtents().x/2}getBoxSizeToRef(e,t){const i=e.getObjectExtents();t.x=i.x,t.y=i.y,t.z=i.z}dispose(){this.bjsAMMO.destroy(this.world),this.bjsAMMO.destroy(this._solver),this.bjsAMMO.destroy(this._overlappingPairCache),this.bjsAMMO.destroy(this._dispatcher),this.bjsAMMO.destroy(this._collisionConfiguration),this.bjsAMMO.destroy(this._tmpAmmoVectorA),this.bjsAMMO.destroy(this._tmpAmmoVectorB),this.bjsAMMO.destroy(this._tmpAmmoVectorC),this.bjsAMMO.destroy(this._tmpAmmoTransform),this.bjsAMMO.destroy(this._tmpAmmoQuaternion),this.bjsAMMO.destroy(this._tmpAmmoConcreteContactResultCallback),this.world=null}raycast(e,t){return this.raycastToRef(e,t,this._raycastResult),this._raycastResult}raycastToRef(e,t,i){this._tmpAmmoVectorRCA=new this.bjsAMMO.btVector3(e.x,e.y,e.z),this._tmpAmmoVectorRCB=new this.bjsAMMO.btVector3(t.x,t.y,t.z);const n=new this.bjsAMMO.ClosestRayResultCallback(this._tmpAmmoVectorRCA,this._tmpAmmoVectorRCB);this.world.rayTest(this._tmpAmmoVectorRCA,this._tmpAmmoVectorRCB,n),i.reset(e,t),n.hasHit()&&(i.setHitData({x:n.get_m_hitNormalWorld().x(),y:n.get_m_hitNormalWorld().y(),z:n.get_m_hitNormalWorld().z()},{x:n.get_m_hitPointWorld().x(),y:n.get_m_hitPointWorld().y(),z:n.get_m_hitPointWorld().z()}),i.calculateHitDistance()),this.bjsAMMO.destroy(n),this.bjsAMMO.destroy(this._tmpAmmoVectorRCA),this.bjsAMMO.destroy(this._tmpAmmoVectorRCB)}}Vh._DISABLE_COLLISION_FLAG=4,Vh._KINEMATIC_FLAG=2,Vh._DISABLE_DEACTIVATION_FLAG=4,n.p.prototype.removeReflectionProbe=function(e){if(!this.reflectionProbes)return-1;const t=this.reflectionProbes.indexOf(e);return-1!==t&&this.reflectionProbes.splice(t,1),t},n.p.prototype.addReflectionProbe=function(e){this.reflectionProbes||(this.reflectionProbes=[]),this.reflectionProbes.push(e)};class kh{constructor(e,t,i,n=!0,s=!1,r=!1){if(this.name=e,this._viewMatrix=o.y3.Identity(),this._target=o.P.Zero(),this._add=o.P.Zero(),this._invertYAxis=!1,this.position=o.P.Zero(),this.metadata=null,this._parentContainer=null,this._scene=i,i.getEngine().supportsUniformBuffers){this._sceneUBOs=[];for(let t=0;t<6;++t)this._sceneUBOs.push(i.createSceneUniformBuffer(`Scene for Reflection Probe (name "${e}") face #${t}`))}this._scene.reflectionProbes||(this._scene.reflectionProbes=new Array),this._scene.reflectionProbes.push(this);let a=0;if(s){const e=this._scene.getEngine().getCaps();e.textureHalfFloatRender?a=2:e.textureFloatRender&&(a=1)}this._renderTargetTexture=new Ai._(e,t,i,n,!0,a,!0),this._renderTargetTexture.gammaSpace=!r,this._renderTargetTexture.invertZ=i.useRightHandedSystem;const l=i.getEngine().useReverseDepthBuffer;let h;this._renderTargetTexture.onBeforeRenderObservable.add((e=>{switch(this._sceneUBOs&&(i.setSceneUniformBuffer(this._sceneUBOs[e]),i.getSceneUniformBuffer().unbindEffect()),e){case 0:this._add.copyFromFloats(1,0,0);break;case 1:this._add.copyFromFloats(-1,0,0);break;case 2:this._add.copyFromFloats(0,this._invertYAxis?1:-1,0);break;case 3:this._add.copyFromFloats(0,this._invertYAxis?-1:1,0);break;case 4:this._add.copyFromFloats(0,0,i.useRightHandedSystem?-1:1);break;case 5:this._add.copyFromFloats(0,0,i.useRightHandedSystem?1:-1)}this._attachedMesh&&this.position.copyFrom(this._attachedMesh.getAbsolutePosition()),this.position.addToRef(this._add,this._target);const t=i.useRightHandedSystem?o.y3.LookAtRHToRef:o.y3.LookAtLHToRef,n=i.useRightHandedSystem?o.y3.PerspectiveFovRH:o.y3.PerspectiveFovLH;t(this.position,this._target,o.P.Up(),this._viewMatrix),i.activeCamera&&(this._projectionMatrix=n(Math.PI/2,1,l?i.activeCamera.maxZ:i.activeCamera.minZ,l?i.activeCamera.minZ:i.activeCamera.maxZ,this._scene.getEngine().isNDCHalfZRange),i.setTransformMatrix(this._viewMatrix,this._projectionMatrix),i.activeCamera.isRigCamera&&!this._renderTargetTexture.activeCamera&&(this._renderTargetTexture.activeCamera=i.activeCamera.rigParent||null)),i._forcedViewPosition=this.position})),this._renderTargetTexture.onBeforeBindObservable.add((()=>{var t,n;this._currentSceneUBO=i.getSceneUniformBuffer(),null===(n=(t=i.getEngine())._debugPushGroup)||void 0===n||n.call(t,`reflection probe generation for ${e}`,1),h=this._scene.imageProcessingConfiguration.applyByPostProcess,r&&(i.imageProcessingConfiguration.applyByPostProcess=!0)})),this._renderTargetTexture.onAfterUnbindObservable.add((()=>{var e,t;i.imageProcessingConfiguration.applyByPostProcess=h,i._forcedViewPosition=null,this._sceneUBOs&&i.setSceneUniformBuffer(this._currentSceneUBO),i.updateTransformMatrix(!0),null===(t=(e=i.getEngine())._debugPopGroup)||void 0===t||t.call(e,1)}))}get samples(){return this._renderTargetTexture.samples}set samples(e){this._renderTargetTexture.samples=e}get refreshRate(){return this._renderTargetTexture.refreshRate}set refreshRate(e){this._renderTargetTexture.refreshRate=e}getScene(){return this._scene}get cubeTexture(){return this._renderTargetTexture}get renderList(){return this._renderTargetTexture.renderList}attachToMesh(e){this._attachedMesh=e}setRenderingAutoClearDepthStencil(e,t){this._renderTargetTexture.setRenderingAutoClearDepthStencil(e,t)}dispose(){const e=this._scene.reflectionProbes.indexOf(this);if(-1!==e&&this._scene.reflectionProbes.splice(e,1),this._parentContainer){const e=this._parentContainer.reflectionProbes.indexOf(this);e>-1&&this._parentContainer.reflectionProbes.splice(e,1),this._parentContainer=null}if(this._renderTargetTexture&&(this._renderTargetTexture.dispose(),this._renderTargetTexture=null),this._sceneUBOs){for(const e of this._sceneUBOs)e.dispose();this._sceneUBOs=[]}}toString(e){let t="Name: "+this.name;return e&&(t+=", position: "+this.position.toString(),this._attachedMesh&&(t+=", attached mesh: "+this._attachedMesh.name)),t}getClassName(){return"ReflectionProbe"}serialize(){const e=Te.p4.Serialize(this,this._renderTargetTexture.serialize());return e.isReflectionProbe=!0,e.metadata=this.metadata,e}static Parse(e,t,i){let n=null;if(t.reflectionProbes)for(let i=0;i<t.reflectionProbes.length;i++){const s=t.reflectionProbes[i];if(s.name===e.name){n=s;break}}return n=Te.p4.Parse((()=>n||new kh(e.name,e.renderTargetSize,t,e._generateMipMaps)),e,t,i),n.cubeTexture._waitingRenderList=e.renderList,e._attachedMesh&&n.attachToMesh(t.getMeshById(e._attachedMesh)),e.metadata&&(n.metadata=e.metadata),n}}(0,be.gn)([(0,Te.RR)()],kh.prototype,"_attachedMesh",void 0),(0,be.gn)([(0,Te.hd)()],kh.prototype,"position",void 0);var Gh=!0;class zh{}zh.LoaderInjectedPhysicsEngine=void 0;let Wh={},Hh={};const Xh=(e,t,i,n)=>{if(!t.materials)return null;for(let s=0,r=t.materials.length;s<r;s++){const r=t.materials[s];if(e(r))return{parsedMaterial:r,material:cs.F.Parse(r,i,n)}}return null},jh=(e,t,i)=>{for(const n in t)if(e.name===t[n])return i.push(e.id),!0;return void 0!==e.parentId&&-1!==i.indexOf(e.parentId)&&(i.push(e.id),!0)},Yh=(e,t)=>e+" of "+(t?t.file+" from "+t.name+" version: "+t.version+", exporter version: "+t.exporter_version:"unknown"),qh=(e,t)=>{const i=t;if(t._waitingData.lods){if(t._waitingData.lods.ids&&t._waitingData.lods.ids.length>0){const n=t._waitingData.lods.ids,s=i.isEnabled(!1);if(t._waitingData.lods.distances){const r=t._waitingData.lods.distances;if(r.length>=n.length){const t=r.length>n.length?r[r.length-1]:0;i.setEnabled(!1);for(let t=0;t<n.length;t++){const s=n[t],o=e.getMeshById(s);null!=o&&i.addLODLevel(r[t],o)}t>0&&i.addLODLevel(t,null),!0===s&&i.setEnabled(!0)}else de.w1.Warn("Invalid level of detail distances for "+t.name)}}t._waitingData.lods=null}},Kh=(e,t,i)=>{if("number"!=typeof e){const n=i.getLastEntryById(e);return n&&null!=t?n.instances[parseInt(t)]:n}const n=Wh[e];return n&&null!=t?n.instances[parseInt(t)]:n},$h=(e,t)=>"number"!=typeof e?t.getLastMaterialById(e,!0):Hh[e],Qh=(e,t,i,s,r=!1)=>{const o=new ce.TJ(e);let a="importScene has failed JSON parse";try{var h=JSON.parse(t);a="";const s=ta.n.loggingLevel===ta.n.DETAILED_LOGGING;let r,c;if(void 0!==h.environmentTexture&&null!==h.environmentTexture){const t=void 0===h.isPBR||h.isPBR;if(h.environmentTextureType&&"BABYLON.HDRCubeTexture"===h.environmentTextureType){const n=h.environmentTextureSize?h.environmentTextureSize:128,s=new Oh((h.environmentTexture.match(/https?:\/\//g)?"":i)+h.environmentTexture,e,n,!0,!t,void 0,h.environmentTexturePrefilterOnLoad);h.environmentTextureRotationY&&(s.rotationY=h.environmentTextureRotationY),e.environmentTexture=s}else if("object"==typeof h.environmentTexture){const t=Fa.B.Parse(h.environmentTexture,e,i);e.environmentTexture=t}else if(h.environmentTexture.endsWith(".env")){const t=new Fa.B((h.environmentTexture.match(/https?:\/\//g)?"":i)+h.environmentTexture,e,h.environmentTextureForcedExtension);h.environmentTextureRotationY&&(t.rotationY=h.environmentTextureRotationY),e.environmentTexture=t}else{const t=Fa.B.CreateFromPrefilteredData((h.environmentTexture.match(/https?:\/\//g)?"":i)+h.environmentTexture,e,h.environmentTextureForcedExtension);h.environmentTextureRotationY&&(t.rotationY=h.environmentTextureRotationY),e.environmentTexture=t}if(!0===h.createDefaultSkybox){const i=void 0!==e.activeCamera&&null!==e.activeCamera?(e.activeCamera.maxZ-e.activeCamera.minZ)/2:1e3,n=h.skyboxBlurLevel||0;e.createDefaultSkybox(e.environmentTexture,t,i,n)}o.environmentTexture=e.environmentTexture}if(void 0!==h.environmentIntensity&&null!==h.environmentIntensity&&(e.environmentIntensity=h.environmentIntensity),void 0!==h.lights&&null!==h.lights)for(r=0,c=h.lights.length;r<c;r++){const t=h.lights[r],i=hh._.Parse(t,e);i&&(Wh[t.uniqueId]=i,o.lights.push(i),i._parentContainer=o,a+=0===r?"\n\tLights:":"",a+="\n\t\t"+i.toString(s))}if(void 0!==h.reflectionProbes&&null!==h.reflectionProbes)for(r=0,c=h.reflectionProbes.length;r<c;r++){const t=h.reflectionProbes[r],n=kh.Parse(t,e,i);n&&(o.reflectionProbes.push(n),n._parentContainer=o,a+=0===r?"\n\tReflection Probes:":"",a+="\n\t\t"+n.toString(s))}if(void 0!==h.animations&&null!==h.animations)for(r=0,c=h.animations.length;r<c;r++){const t=h.animations[r],i=(0,l.q)("BABYLON.Animation");if(i){const n=i.Parse(t);e.animations.push(n),o.animations.push(n),a+=0===r?"\n\tAnimations:":"",a+="\n\t\t"+n.toString(s)}}if(void 0!==h.materials&&null!==h.materials)for(r=0,c=h.materials.length;r<c;r++){const t=h.materials[r],n=cs.F.Parse(t,e,i);n&&(Hh[t.uniqueId||t.id]=n,o.materials.push(n),n._parentContainer=o,a+=0===r?"\n\tMaterials:":"",a+="\n\t\t"+n.toString(s),n.getActiveTextures().forEach((e=>{-1==o.textures.indexOf(e)&&(o.textures.push(e),e._parentContainer=o)})))}if(void 0!==h.multiMaterials&&null!==h.multiMaterials)for(r=0,c=h.multiMaterials.length;r<c;r++){const t=h.multiMaterials[r],i=Ph.G.ParseMultiMaterial(t,e);Hh[t.uniqueId||t.id]=i,o.multiMaterials.push(i),i._parentContainer=o,a+=0===r?"\n\tMultiMaterials:":"",a+="\n\t\t"+i.toString(s),i.getActiveTextures().forEach((e=>{-1==o.textures.indexOf(e)&&(o.textures.push(e),e._parentContainer=o)}))}if(void 0!==h.morphTargetManagers&&null!==h.morphTargetManagers)for(const t of h.morphTargetManagers){const i=wh.O.Parse(t,e);o.morphTargetManagers.push(i),i._parentContainer=o}if(void 0!==h.skeletons&&null!==h.skeletons)for(r=0,c=h.skeletons.length;r<c;r++){const t=h.skeletons[r],i=Ye.O.Parse(t,e);o.skeletons.push(i),i._parentContainer=o,a+=0===r?"\n\tSkeletons:":"",a+="\n\t\t"+i.toString(s)}const u=h.geometries;if(null!=u){const t=new Array,n=u.vertexData;if(null!=n)for(r=0,c=n.length;r<c;r++){const s=n[r];t.push(Ah.Z.Parse(s,e,i))}t.forEach((e=>{e&&(o.geometries.push(e),e._parentContainer=o)}))}if(void 0!==h.transformNodes&&null!==h.transformNodes)for(r=0,c=h.transformNodes.length;r<c;r++){const t=h.transformNodes[r],n=yi.Y.Parse(t,e,i);Wh[t.uniqueId]=n,o.transformNodes.push(n),n._parentContainer=o}if(void 0!==h.meshes&&null!==h.meshes)for(r=0,c=h.meshes.length;r<c;r++){const t=h.meshes[r],n=Nt.Kj.Parse(t,e,i);if(Wh[t.uniqueId]=n,o.meshes.push(n),n._parentContainer=o,n.hasInstances)for(const e of n.instances)o.meshes.push(e),e._parentContainer=o;a+=0===r?"\n\tMeshes:":"",a+="\n\t\t"+n.toString(s)}if(void 0!==h.cameras&&null!==h.cameras)for(r=0,c=h.cameras.length;r<c;r++){const t=h.cameras[r],i=Mt.V.Parse(t,e);Wh[t.uniqueId]=i,o.cameras.push(i),i._parentContainer=o,a+=0===r?"\n\tCameras:":"",a+="\n\t\t"+i.toString(s)}if(void 0!==h.postProcesses&&null!==h.postProcesses)for(r=0,c=h.postProcesses.length;r<c;r++){const t=h.postProcesses[r],n=ni.D.Parse(t,e,i);n&&(o.postProcesses.push(n),n._parentContainer=o,a+=0===r?"\nPostprocesses:":"",a+="\n\t\t"+n.toString())}if(void 0!==h.animationGroups&&null!==h.animationGroups)for(r=0,c=h.animationGroups.length;r<c;r++){const t=h.animationGroups[r],i=oe.O.Parse(t,e);o.animationGroups.push(i),i._parentContainer=o,a+=0===r?"\n\tAnimationGroups:":"",a+="\n\t\t"+i.toString(s)}for(r=0,c=e.cameras.length;r<c;r++){const t=e.cameras[r];null!==t._waitingParentId&&(t.parent=Kh(t._waitingParentId,t._waitingParentInstanceIndex,e),t._waitingParentId=null,t._waitingParentInstanceIndex=null)}for(r=0,c=e.lights.length;r<c;r++){const t=e.lights[r];t&&null!==t._waitingParentId&&(t.parent=Kh(t._waitingParentId,t._waitingParentInstanceIndex,e),t._waitingParentId=null,t._waitingParentInstanceIndex=null)}for(r=0,c=e.transformNodes.length;r<c;r++){const t=e.transformNodes[r];null!==t._waitingParentId&&(t.parent=Kh(t._waitingParentId,t._waitingParentInstanceIndex,e),t._waitingParentId=null,t._waitingParentInstanceIndex=null)}for(r=0,c=e.meshes.length;r<c;r++){const t=e.meshes[r];null!==t._waitingParentId&&(t.parent=Kh(t._waitingParentId,t._waitingParentInstanceIndex,e),t._waitingParentId=null,t._waitingParentInstanceIndex=null),t._waitingData.lods&&qh(e,t)}for(e.multiMaterials.forEach((t=>{t._waitingSubMaterialsUniqueIds.forEach((i=>{t.subMaterials.push($h(i,e))})),t._waitingSubMaterialsUniqueIds=[]})),e.meshes.forEach((t=>{null!==t._waitingMaterialId&&(t.material=$h(t._waitingMaterialId,e),t._waitingMaterialId=null)})),r=0,c=e.skeletons.length;r<c;r++){const t=e.skeletons[r];t._hasWaitingData&&(null!=t.bones&&t.bones.forEach((t=>{if(t._waitingTransformNodeId){const i=e.getLastEntryById(t._waitingTransformNodeId);i&&t.linkTransformNode(i),t._waitingTransformNodeId=null}})),t._hasWaitingData=null)}for(r=0,c=e.meshes.length;r<c;r++){const t=e.meshes[r];t._waitingData.freezeWorldMatrix?(t.freezeWorldMatrix(),t._waitingData.freezeWorldMatrix=null):t.computeWorldMatrix(!0)}for(r=0,c=e.lights.length;r<c;r++){const t=e.lights[r];if(t._excludedMeshesIds.length>0){for(let i=0;i<t._excludedMeshesIds.length;i++){const n=e.getMeshById(t._excludedMeshesIds[i]);n&&t.excludedMeshes.push(n)}t._excludedMeshesIds=[]}if(t._includedOnlyMeshesIds.length>0){for(let i=0;i<t._includedOnlyMeshesIds.length;i++){const n=e.getMeshById(t._includedOnlyMeshesIds[i]);n&&t.includedOnlyMeshes.push(n)}t._includedOnlyMeshesIds=[]}}for(e.geometries.forEach((e=>{e._loadedUniqueId=""})),n.p.Parse(h,e,o,i),r=0,c=e.meshes.length;r<c;r++){const t=e.meshes[r];t._waitingData.actions&&(R.Parse(t._waitingData.actions,t,e),t._waitingData.actions=null)}void 0!==h.actions&&null!==h.actions&&R.Parse(h.actions,null,e)}catch(e){const t=Yh("loadAssets",h?h.producer:"Unknown")+a;if(!s)throw _.Y.Log(t),e;s(t,e)}finally{Wh={},Hh={},r||o.removeAllFromScene(),null!==a&&ta.n.loggingLevel!==ta.n.NO_LOGGING&&_.Y.Log(Yh("loadAssets",h?h.producer:"Unknown")+(ta.n.loggingLevel!==ta.n.MINIMAL_LOGGING?a:""))}return o};ta.n.RegisterPlugin({name:"babylon.js",extensions:".babylon",canDirectLoad:e=>-1!==e.indexOf("babylon"),importMesh:(e,t,i,s,r,o,a,l)=>{var h;let c="importMesh has failed JSON parse";try{var u=JSON.parse(i);c="";const l=ta.n.loggingLevel===ta.n.DETAILED_LOGGING;e?Array.isArray(e)||(e=[e]):e=null;const d=new Array,p=new Map,f=[];if(void 0!==u.transformNodes&&null!==u.transformNodes)for(let e=0,i=u.transformNodes.length;e<i;e++){const i=u.transformNodes[e],n=yi.Y.Parse(i,t,s);f.push(n),p.set(n._waitingParsedUniqueId,n),n._waitingParsedUniqueId=null}if(void 0!==u.meshes&&null!==u.meshes){const i=[],n=[],o=[],m=[];for(let h=0,f=u.meshes.length;h<f;h++){const f=u.meshes[h];if(null===e||jh(f,e,d)){if(null!==e&&delete e[e.indexOf(f.name)],void 0!==f.geometryId&&null!==f.geometryId&&void 0!==u.geometries&&null!==u.geometries){let e=!1;["boxes","spheres","cylinders","toruses","grounds","planes","torusKnots","vertexData"].forEach((i=>{!0!==e&&u.geometries[i]&&Array.isArray(u.geometries[i])&&u.geometries[i].forEach((n=>{n.id===f.geometryId&&("vertexData"===i&&Ah.Z.Parse(n,t,s),e=!0)}))})),!1===e&&_.Y.Warn("Geometry not found for mesh "+f.id)}if(f.materialUniqueId||f.materialId){const e=f.materialUniqueId?o:n;let i=-1!==e.indexOf(f.materialUniqueId||f.materialId);if(!1===i&&void 0!==u.multiMaterials&&null!==u.multiMaterials){const n=(i,n)=>{e.push(i);const r=Xh(n,u,t,s);r&&r.material&&(Hh[r.parsedMaterial.uniqueId||r.parsedMaterial.id]=r.material,c+="\n\tMaterial "+r.material.toString(l))};for(let s=0,r=u.multiMaterials.length;s<r;s++){const r=u.multiMaterials[s];if(f.materialUniqueId&&r.uniqueId===f.materialUniqueId||r.id===f.materialId){r.materialsUniqueIds?r.materialsUniqueIds.forEach((e=>n(e,(t=>t.uniqueId===e)))):r.materials.forEach((e=>n(e,(t=>t.id===e)))),e.push(r.uniqueId||r.id);const s=Ph.G.ParseMultiMaterial(r,t);Hh[r.uniqueId||r.id]=s,s&&(i=!0,c+="\n\tMulti-Material "+s.toString(l));break}}}if(!1===i){e.push(f.materialUniqueId||f.materialId);const i=Xh((e=>f.materialUniqueId&&e.uniqueId===f.materialUniqueId||e.id===f.materialId),u,t,s);i&&i.material?(Hh[i.parsedMaterial.uniqueId||i.parsedMaterial.id]=i.material,c+="\n\tMaterial "+i.material.toString(l)):_.Y.Warn("Material not found for mesh "+f.id)}}if(f.skeletonId>-1&&void 0!==u.skeletons&&null!==u.skeletons&&!(i.indexOf(f.skeletonId)>-1))for(let e=0,n=u.skeletons.length;e<n;e++){const n=u.skeletons[e];if(n.id===f.skeletonId){const e=Ye.O.Parse(n,t);a.push(e),i.push(n.id),c+="\n\tSkeleton "+e.toString(l)}}if(f.morphTargetManagerId>-1&&void 0!==u.morphTargetManagers&&null!==u.morphTargetManagers&&!(m.indexOf(f.morphTargetManagerId)>-1))for(let e=0,i=u.morphTargetManagers.length;e<i;e++){const i=u.morphTargetManagers[e];if(i.id===f.morphTargetManagerId){const e=wh.O.Parse(i,t);m.push(e.uniqueId),c+="\nMorph target "+e.toString()}}const h=Nt.Kj.Parse(f,t,s);r.push(h),p.set(h._waitingParsedUniqueId,h),h._waitingParsedUniqueId=null,c+="\n\tMesh "+h.toString(l)}}t.multiMaterials.forEach((e=>{e._waitingSubMaterialsUniqueIds.forEach((i=>{e.subMaterials.push($h(i,t))})),e._waitingSubMaterialsUniqueIds=[]})),t.meshes.forEach((e=>{null!==e._waitingMaterialId&&(e.material=$h(e._waitingMaterialId,t),e._waitingMaterialId=null)}));for(let e=0,i=t.transformNodes.length;e<i;e++){const i=t.transformNodes[e];if(null!==i._waitingParentId){let e=p.get(parseInt(i._waitingParentId))||null;null===e&&(e=t.getLastEntryById(i._waitingParentId));let n=e;i._waitingParentInstanceIndex&&(n=e.instances[parseInt(i._waitingParentInstanceIndex)],i._waitingParentInstanceIndex=null),i.parent=n,i._waitingParentId=null}}let g;for(let e=0,i=t.meshes.length;e<i;e++){if(g=t.meshes[e],g._waitingParentId){let e=p.get(parseInt(g._waitingParentId))||null;null===e&&(e=t.getLastEntryById(g._waitingParentId));let i=e;if(g._waitingParentInstanceIndex&&(i=e.instances[parseInt(g._waitingParentInstanceIndex)],g._waitingParentInstanceIndex=null),g.parent=i,"TransformNode"===(null===(h=g.parent)||void 0===h?void 0:h.getClassName())){const e=f.indexOf(g.parent);e>-1&&f.splice(e,1)}g._waitingParentId=null}g._waitingData.lods&&qh(t,g)}for(const e of f)e.dispose();for(let e=0,i=t.skeletons.length;e<i;e++){const i=t.skeletons[e];i._hasWaitingData&&(null!=i.bones&&i.bones.forEach((e=>{if(e._waitingTransformNodeId){const i=t.getLastEntryById(e._waitingTransformNodeId);i&&e.linkTransformNode(i),e._waitingTransformNodeId=null}})),i._hasWaitingData=null)}for(let e=0,i=t.meshes.length;e<i;e++)g=t.meshes[e],g._waitingData.freezeWorldMatrix?(g.freezeWorldMatrix(),g._waitingData.freezeWorldMatrix=null):g.computeWorldMatrix(!0)}if(void 0!==u.particleSystems&&null!==u.particleSystems){const e=n.p.GetIndividualParser(ve.l.NAME_PARTICLESYSTEM);if(e)for(let i=0,n=u.particleSystems.length;i<n;i++){const n=u.particleSystems[i];-1!==d.indexOf(n.emitterId)&&o.push(e(n,t,s))}}return t.geometries.forEach((e=>{e._loadedUniqueId=""})),!0}catch(e){const t=Yh("importMesh",u?u.producer:"Unknown")+c;if(!l)throw _.Y.Log(t),e;l(t,e)}finally{null!==c&&ta.n.loggingLevel!==ta.n.NO_LOGGING&&_.Y.Log(Yh("importMesh",u?u.producer:"Unknown")+(ta.n.loggingLevel!==ta.n.MINIMAL_LOGGING?c:"")),Hh={}}return!1},load:(e,t,i,n)=>{let s="importScene has failed JSON parse";try{var r=JSON.parse(t);if(s="",void 0!==r.useDelayedTextureLoading&&null!==r.useDelayedTextureLoading&&(e.useDelayedTextureLoading=r.useDelayedTextureLoading&&!ta.n.ForceFullSceneLoadingForIncremental),void 0!==r.autoClear&&null!==r.autoClear&&(e.autoClear=r.autoClear),void 0!==r.clearColor&&null!==r.clearColor&&(e.clearColor=a.HE.FromArray(r.clearColor)),void 0!==r.ambientColor&&null!==r.ambientColor&&(e.ambientColor=a.Wo.FromArray(r.ambientColor)),void 0!==r.gravity&&null!==r.gravity&&(e.gravity=o.P.FromArray(r.gravity)),void 0!==r.useRightHandedSystem&&(e.useRightHandedSystem=!!r.useRightHandedSystem),r.fogMode&&0!==r.fogMode)switch(e.fogMode=r.fogMode,e.fogColor=a.Wo.FromArray(r.fogColor),e.fogStart=r.fogStart,e.fogEnd=r.fogEnd,e.fogDensity=r.fogDensity,s+="\tFog mode for scene:  ",e.fogMode){case 1:s+="exp\n";break;case 2:s+="exp2\n";break;case 3:s+="linear\n"}if(r.physicsEnabled){let t;"cannon"===r.physicsEngine||r.physicsEngine===Bh.name?t=new Bh(void 0,void 0,zh.LoaderInjectedPhysicsEngine):"oimo"===r.physicsEngine||r.physicsEngine===Uh.name?t=new Uh(void 0,zh.LoaderInjectedPhysicsEngine):"ammo"!==r.physicsEngine&&r.physicsEngine!==Vh.name||(t=new Vh(void 0,zh.LoaderInjectedPhysicsEngine,void 0)),s="\tPhysics engine "+(r.physicsEngine?r.physicsEngine:"oimo")+" enabled\n";const i=r.physicsGravity?o.P.FromArray(r.physicsGravity):null;e.enablePhysics(i,t)}return void 0!==r.metadata&&null!==r.metadata&&(e.metadata=r.metadata),void 0!==r.collisionsEnabled&&null!==r.collisionsEnabled&&(e.collisionsEnabled=r.collisionsEnabled),!!Qh(e,t,i,n,!0)&&(r.autoAnimate&&e.beginAnimation(e,r.autoAnimateFrom,r.autoAnimateTo,r.autoAnimateLoop,r.autoAnimateSpeed||1),void 0!==r.activeCameraID&&null!==r.activeCameraID&&e.setActiveCameraById(r.activeCameraID),!0)}catch(e){const t=Yh("importScene",r?r.producer:"Unknown")+s;if(!n)throw _.Y.Log(t),e;n(t,e)}finally{null!==s&&ta.n.loggingLevel!==ta.n.NO_LOGGING&&_.Y.Log(Yh("importScene",r?r.producer:"Unknown")+(ta.n.loggingLevel!==ta.n.MINIMAL_LOGGING?s:""))}return!1},loadAssetContainer:(e,t,i,n)=>Qh(e,t,i,n)});var Zh=i(1376),Jh=i(8237);class ec{get isEnabled(){return this._isEnabled}set isEnabled(e){this._isEnabled!==e&&(this._isEnabled=e,ue.D.MarkAllMaterialsAsDirty(20))}constructor(e={}){this._isEnabled=!0,this.bias=void 0===e.bias?0:e.bias,this.power=void 0===e.power?1:e.power,this.leftColor=e.leftColor||a.Wo.White(),this.rightColor=e.rightColor||a.Wo.Black(),!1===e.isEnabled&&(this.isEnabled=!1)}clone(){const e=new ec;return P.j.DeepCopy(this,e),e}equals(e){return e&&this.bias===e.bias&&this.power===e.power&&this.leftColor.equals(e.leftColor)&&this.rightColor.equals(e.rightColor)&&this.isEnabled===e.isEnabled}serialize(){return{isEnabled:this.isEnabled,leftColor:this.leftColor.asArray(),rightColor:this.rightColor.asArray(),bias:this.bias,power:this.power}}static Parse(e){return new ec({isEnabled:e.isEnabled,leftColor:a.Wo.FromArray(e.leftColor),rightColor:a.Wo.FromArray(e.rightColor),bias:e.bias,power:e.power||1})}}Te.p4._FresnelParametersParser=ec.Parse,i(6980),i(9753);class tc extends us.j{constructor(e,t){super(e,t,"color",{attributes:["position"],uniforms:["world","viewProjection","color"]}),this.disableColorWrite=!0,this.forceDepthWrite=!0,this.setColor4("color",new a.HE(0,0,0,1))}}var ic=i(9482),nc=i(5843);class sc extends nc.m{get doubleSided(){return this._twoSidedLighting}set doubleSided(e){this._twoSidedLighting!==e&&(this._twoSidedLighting=e,this.backFaceCulling=!e,this._markAllSubMeshesAsTexturesDirty())}constructor(e,t){super(e,t),this.maxSimultaneousLights=4,this.disableLighting=!1,this.invertNormalMapX=!1,this.invertNormalMapY=!1,this.emissiveColor=new a.Wo(0,0,0),this.occlusionStrength=1,this.useLightmapAsShadowmap=!1,this._useAlphaFromAlbedoTexture=!0,this._useAmbientInGrayScale=!0}getClassName(){return"PBRBaseSimpleMaterial"}}(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsLightsDirty")],sc.prototype,"maxSimultaneousLights",void 0),(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsLightsDirty")],sc.prototype,"disableLighting",void 0),(0,be.gn)([(0,Te.oU)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_reflectionTexture")],sc.prototype,"environmentTexture",void 0),(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],sc.prototype,"invertNormalMapX",void 0),(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],sc.prototype,"invertNormalMapY",void 0),(0,be.gn)([(0,Te.oU)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_bumpTexture")],sc.prototype,"normalTexture",void 0),(0,be.gn)([(0,Te.n9)("emissive"),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],sc.prototype,"emissiveColor",void 0),(0,be.gn)([(0,Te.oU)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],sc.prototype,"emissiveTexture",void 0),(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_ambientTextureStrength")],sc.prototype,"occlusionStrength",void 0),(0,be.gn)([(0,Te.oU)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_ambientTexture")],sc.prototype,"occlusionTexture",void 0),(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_alphaCutOff")],sc.prototype,"alphaCutOff",void 0),(0,be.gn)([(0,Te.qC)()],sc.prototype,"doubleSided",null),(0,be.gn)([(0,Te.oU)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty",null)],sc.prototype,"lightmapTexture",void 0),(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],sc.prototype,"useLightmapAsShadowmap",void 0);var rc=i(3077),oc=i(3949);class ac extends sc{constructor(e,t){super(e,t),this._useRoughnessFromMetallicTextureAlpha=!1,this._useRoughnessFromMetallicTextureGreen=!0,this._useMetallnessFromMetallicTextureBlue=!0,this.metallic=1,this.roughness=1}getClassName(){return"PBRMetallicRoughnessMaterial"}clone(e){const t=Te.p4.Clone((()=>new ac(e,this.getScene())),this);return t.id=e,t.name=e,this.clearCoat.copyTo(t.clearCoat),this.anisotropy.copyTo(t.anisotropy),this.brdf.copyTo(t.brdf),this.sheen.copyTo(t.sheen),this.subSurface.copyTo(t.subSurface),t}serialize(){const e=Te.p4.Serialize(this);return e.customType="BABYLON.PBRMetallicRoughnessMaterial",e.clearCoat=this.clearCoat.serialize(),e.anisotropy=this.anisotropy.serialize(),e.brdf=this.brdf.serialize(),e.sheen=this.sheen.serialize(),e.subSurface=this.subSurface.serialize(),e.iridescence=this.iridescence.serialize(),e}static Parse(e,t,i){const n=Te.p4.Parse((()=>new ac(e.name,t)),e,t,i);return e.clearCoat&&n.clearCoat.parse(e.clearCoat,t,i),e.anisotropy&&n.anisotropy.parse(e.anisotropy,t,i),e.brdf&&n.brdf.parse(e.brdf,t,i),e.sheen&&n.sheen.parse(e.sheen,t,i),e.subSurface&&n.subSurface.parse(e.subSurface,t,i),e.iridescence&&n.iridescence.parse(e.iridescence,t,i),n}}(0,be.gn)([(0,Te.n9)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_albedoColor")],ac.prototype,"baseColor",void 0),(0,be.gn)([(0,Te.oU)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_albedoTexture")],ac.prototype,"baseTexture",void 0),(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],ac.prototype,"metallic",void 0),(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],ac.prototype,"roughness",void 0),(0,be.gn)([(0,Te.oU)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_metallicTexture")],ac.prototype,"metallicRoughnessTexture",void 0),(0,l.H)("BABYLON.PBRMetallicRoughnessMaterial",ac);class lc extends sc{get useMicroSurfaceFromReflectivityMapAlpha(){return this._useMicroSurfaceFromReflectivityMapAlpha}constructor(e,t){super(e,t),this._useMicroSurfaceFromReflectivityMapAlpha=!0}getClassName(){return"PBRSpecularGlossinessMaterial"}clone(e){const t=Te.p4.Clone((()=>new lc(e,this.getScene())),this);return t.id=e,t.name=e,this.clearCoat.copyTo(t.clearCoat),this.anisotropy.copyTo(t.anisotropy),this.brdf.copyTo(t.brdf),this.sheen.copyTo(t.sheen),this.subSurface.copyTo(t.subSurface),t}serialize(){const e=Te.p4.Serialize(this);return e.customType="BABYLON.PBRSpecularGlossinessMaterial",e.clearCoat=this.clearCoat.serialize(),e.anisotropy=this.anisotropy.serialize(),e.brdf=this.brdf.serialize(),e.sheen=this.sheen.serialize(),e.subSurface=this.subSurface.serialize(),e.iridescence=this.iridescence.serialize(),e}static Parse(e,t,i){const n=Te.p4.Parse((()=>new lc(e.name,t)),e,t,i);return e.clearCoat&&n.clearCoat.parse(e.clearCoat,t,i),e.anisotropy&&n.anisotropy.parse(e.anisotropy,t,i),e.brdf&&n.brdf.parse(e.brdf,t,i),e.sheen&&n.sheen.parse(e.sheen,t,i),e.subSurface&&n.subSurface.parse(e.subSurface,t,i),e.iridescence&&n.iridescence.parse(e.iridescence,t,i),n}}(0,be.gn)([(0,Te.n9)("diffuse"),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_albedoColor")],lc.prototype,"diffuseColor",void 0),(0,be.gn)([(0,Te.oU)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_albedoTexture")],lc.prototype,"diffuseTexture",void 0),(0,be.gn)([(0,Te.n9)("specular"),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_reflectivityColor")],lc.prototype,"specularColor",void 0),(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_microSurface")],lc.prototype,"glossiness",void 0),(0,be.gn)([(0,Te.oU)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty","_reflectivityTexture")],lc.prototype,"specularGlossinessTexture",void 0),(0,l.H)("BABYLON.PBRSpecularGlossinessMaterial",lc);var hc=i(4783),cc=i(3808);class uc extends Oa.V{constructor(e,t,i=null){if(super(t),e)if(this._textureMatrix=o.y3.Identity(),this.name=e,this.url=e,this._onLoad=i,this._texture=this._getFromCache(e,!0),this._texture)this._triggerOnLoad();else{const e=this.getScene();e&&e.useDelayedTextureLoading?this.delayLoadState=4:this._loadTexture()}}_triggerOnLoad(){this._onLoad&&this._onLoad()}getTextureMatrix(){return this._textureMatrix}_load3dlTexture(){const e=this._getEngine();let t;t=e._features.support3DTextures?e.createRawTexture3D(null,1,1,1,5,!1,!1,2,null,0):e.createRawTexture(null,1,1,5,!1,!1,2,null,0),this._texture=t,this._texture.isReady=!1,this.isCube=!1,this.is3D=e._features.support3DTextures,this.wrapU=0,this.wrapV=0,this.wrapR=0,this.anisotropicFilteringLevel=1;const i=i=>{if("string"!=typeof i)return;let n,s=null,r=null;const o=i.split("\n");let a=0,l=0,h=0,c=0,u=0;for(let e=0;e<o.length;e++){if(n=o[e],!uc._NoneEmptyLineRegex.test(n))continue;if(0===n.indexOf("#"))continue;const t=n.split(" ");if(0!==a){if(0!=a){const e=Math.max(parseInt(t[0]),0),i=Math.max(parseInt(t[1]),0),n=Math.max(parseInt(t[2]),0);u=Math.max(e,u),u=Math.max(i,u),u=Math.max(n,u);const s=4*(l+c*a+h*a*a);r&&(r[s+0]=e,r[s+1]=i,r[s+2]=n),h++,h%a==0&&(c++,h=0,c%a==0&&(l++,c=0))}}else a=t.length,s=new Uint8Array(a*a*a*4),r=new Float32Array(a*a*a*4)}if(r&&s)for(let e=0;e<r.length;e++)if(e>0&&(e+1)%4==0)s[e]=255;else{const t=r[e];s[e]=t/u*255}t.is3D?(t.updateSize(a,a,a),e.updateRawTexture3D(t,s,5,!1)):(t.updateSize(a*a,a),e.updateRawTexture(t,s,5,!1)),t.isReady=!0,this._triggerOnLoad()},n=this.getScene();return n?n._loadFile(this.url,i):e._loadFile(this.url,i),this._texture}_loadTexture(){this.url&&this.url.toLocaleLowerCase().indexOf(".3dl")==this.url.length-4&&this._load3dlTexture()}clone(){const e=new uc(this.url,this.getScene()||this._getEngine());return e.level=this.level,e}delayLoad(){4===this.delayLoadState&&(this.delayLoadState=1,this._texture=this._getFromCache(this.url,!0),this._texture||this._loadTexture())}static Parse(e,t){let i=null;return e.name&&!e.isRenderTarget&&(i=new uc(e.name,t),i.name=e.name,i.level=e.level),i}serialize(){if(!this.name)return null;const e={};return e.name=this.name,e.level=this.level,e.customType="BABYLON.ColorGradingTexture",e}}uc._NoneEmptyLineRegex=/\S+/,(0,l.H)("BABYLON.ColorGradingTexture",uc);var dc=i(5661);class pc extends Oa.V{constructor(e,t,i,n=!1,s=!0,r=null,o=null,a=!1){if(super(t),this._onLoad=null,this._onError=null,!e)throw new Error("Image url is not set");this._coordinatesMode=Ce.x.CUBIC_MODE,this.name=e,this.url=e,this._size=i,this._supersample=a,this._noMipmap=n,this.gammaSpace=s,this._onLoad=r,this._onError=o,this.hasAlpha=!1,this.isCube=!0,this._texture=this._getFromCache(e,this._noMipmap,void 0,void 0,void 0,this.isCube),this._texture?r&&(this._texture.isReady?de.w1.SetImmediate((()=>r())):this._texture.onLoadedObservable.add(r)):t.useDelayedTextureLoading?this.delayLoadState=4:this._loadImage(this._loadTexture.bind(this),this._onError)}_loadImage(e,t){const i=document.createElement("canvas");(0,dc.r6)(this.url,(t=>{this._width=t.width,this._height=t.height,i.width=this._width,i.height=this._height;const n=i.getContext("2d");n.drawImage(t,0,0);const s=n.getImageData(0,0,t.width,t.height);this._buffer=s.data.buffer,i.remove(),e()}),((e,i)=>{t&&t(`${this.getClassName()} could not be loaded`,i)}),null)}_loadTexture(){const e=this.getScene();e&&(this._texture=e.getEngine().createRawCubeTextureFromUrl(this.url,e,this._size,4,e.getEngine().getCaps().textureFloat?1:7,this._noMipmap,(()=>{const e=this._getFloat32ArrayFromArrayBuffer(this._buffer),t=Rh.ConvertPanoramaToCubemap(e,this._width,this._height,this._size,this._supersample),i=[];for(let e=0;e<6;e++){const n=t[pc._FacesMapping[e]];i.push(n)}return i}),null,this._onLoad,this._onError))}_getFloat32ArrayFromArrayBuffer(e){const t=new DataView(e),i=new Float32Array(3*e.byteLength/4);let n=0;for(let s=0;s<e.byteLength;s++)(s+1)%4!=0&&(i[n++]=t.getUint8(s)/255);return i}getClassName(){return"EquiRectangularCubeTexture"}clone(){const e=this.getScene();if(!e)return this;const t=new pc(this.url,e,this._size,this._noMipmap,this.gammaSpace);return t.level=this.level,t.wrapU=this.wrapU,t.wrapV=this.wrapV,t.coordinatesIndex=this.coordinatesIndex,t.coordinatesMode=this.coordinatesMode,t}}pc._FacesMapping=["right","left","up","down","front","back"];class fc extends Oa.V{constructor(e,t,i){var n,s;super(i.scene||i.engine),this.onLoadObservable=new r.y$,t&&(i.engine||i.scene)&&(i={...fc._DefaultOptions,...i},this._generateMipMaps=i.generateMipMaps,this._samplingMode=i.samplingMode,this._textureMatrix=o.y3.Identity(),this._format=i.format,this.name=e,this.element=t,this._isVideo=!!t.getVideoPlaybackQuality,this._externalTexture=this._isVideo&&null!==(s=null===(n=this._engine)||void 0===n?void 0:n.createExternalTexture(t))&&void 0!==s?s:null,this.anisotropicFilteringLevel=1,this._createInternalTexture())}_createInternalTexture(){let e=0,t=0;this._isVideo?(e=this.element.videoWidth,t=this.element.videoHeight):(e=this.element.width,t=this.element.height);const i=this._getEngine();i&&(this._texture=i.createDynamicTexture(e,t,this._generateMipMaps,this._samplingMode),this._texture.format=this._format),this.update()}getTextureMatrix(){return this._textureMatrix}update(e=null){const t=this._getEngine();if(null==this._texture||null==t)return;const i=this.isReady();if(this._isVideo){const i=this.element;if(i.readyState<i.HAVE_CURRENT_DATA)return;t.updateVideoTexture(this._texture,this._externalTexture?this._externalTexture:i,null===e||e)}else{const i=this.element;t.updateDynamicTexture(this._texture,i,null===e||e,!1,this._format)}!i&&this.isReady()&&this.onLoadObservable.notifyObservers(this)}dispose(){this.onLoadObservable.clear(),super.dispose()}}fc._DefaultOptions={generateMipMaps:!1,samplingMode:2,format:5,engine:null,scene:null};const _c=1,mc=2,gc=3,vc=9,yc=10,xc=11,bc=48,Tc=4,Sc=0,Ec=1,Cc=2,Ac=3;function Pc(e){let t=0;return{id_length:e[t++],colormap_type:e[t++],image_type:e[t++],colormap_index:e[t++]|e[t++]<<8,colormap_length:e[t++]|e[t++]<<8,colormap_size:e[t++],origin:[e[t++]|e[t++]<<8,e[t++]|e[t++]<<8],width:e[t++]|e[t++]<<8,height:e[t++]|e[t++]<<8,pixel_size:e[t++],flags:e[t++]}}function Rc(e,t){if(t.length<19)return void _.Y.Error("Unable to load TGA file - Not enough data to contain header");let i=18;const n=Pc(t);if(n.id_length+i>t.length)return void _.Y.Error("Unable to load TGA file - Not enough data");i+=n.id_length;let s,r=!1,o=!1,a=!1;switch(n.image_type){case vc:r=!0;case _c:o=!0;break;case yc:r=!0;case mc:break;case xc:r=!0;case gc:a=!0}const l=n.pixel_size>>3,h=n.width*n.height*l;let c,u,d,p,f,m,g;if(o&&(c=t.subarray(i,i+=n.colormap_length*(n.colormap_size>>3))),r){let e,n,r;s=new Uint8Array(h);let o=0;const a=new Uint8Array(l);for(;i<h&&o<h;)if(e=t[i++],n=1+(127&e),128&e){for(r=0;r<l;++r)a[r]=t[i++];for(r=0;r<n;++r)s.set(a,o+r*l);o+=l*n}else{for(n*=l,r=0;r<n;++r)s[o+r]=t[i++];o+=n}}else s=t.subarray(i,i+=o?n.width*n.height:h);switch((n.flags&bc)>>Tc){default:case Cc:u=0,p=1,g=n.width,d=0,f=1,m=n.height;break;case Sc:u=0,p=1,g=n.width,d=n.height-1,f=-1,m=-1;break;case Ac:u=n.width-1,p=-1,g=-1,d=0,f=1,m=n.height;break;case Ec:u=n.width-1,p=-1,g=-1,d=n.height-1,f=-1,m=-1}const v="_getImageData"+(a?"Grey":"")+n.pixel_size+"bits",y=Mc[v](n,c,s,d,f,m,u,p,g);e.getEngine()._uploadDataToTextureDirectly(e,y)}const Mc={GetTGAHeader:Pc,UploadContent:Rc,_getImageData8bits:function(e,t,i,n,s,r,o,a,l){const h=i,c=t,u=e.width,d=e.height;let p,f,_,m=0;const g=new Uint8Array(u*d*4);for(_=n;_!==r;_+=s)for(f=o;f!==l;f+=a,m++)p=h[m],g[4*(f+u*_)+3]=255,g[4*(f+u*_)+2]=c[3*p+0],g[4*(f+u*_)+1]=c[3*p+1],g[4*(f+u*_)+0]=c[3*p+2];return g},_getImageData16bits:function(e,t,i,n,s,r,o,a,l){const h=i,c=e.width,u=e.height;let d,p,f,_=0;const m=new Uint8Array(c*u*4);for(f=n;f!==r;f+=s)for(p=o;p!==l;p+=a,_+=2){d=h[_+0]+(h[_+1]<<8);const e=255*((31744&d)>>10)/31|0,t=255*((992&d)>>5)/31|0,i=255*(31&d)/31|0;m[4*(p+c*f)+0]=e,m[4*(p+c*f)+1]=t,m[4*(p+c*f)+2]=i,m[4*(p+c*f)+3]=32768&d?0:255}return m},_getImageData24bits:function(e,t,i,n,s,r,o,a,l){const h=i,c=e.width,u=e.height;let d,p,f=0;const _=new Uint8Array(c*u*4);for(p=n;p!==r;p+=s)for(d=o;d!==l;d+=a,f+=3)_[4*(d+c*p)+3]=255,_[4*(d+c*p)+2]=h[f+0],_[4*(d+c*p)+1]=h[f+1],_[4*(d+c*p)+0]=h[f+2];return _},_getImageData32bits:function(e,t,i,n,s,r,o,a,l){const h=i,c=e.width,u=e.height;let d,p,f=0;const _=new Uint8Array(c*u*4);for(p=n;p!==r;p+=s)for(d=o;d!==l;d+=a,f+=4)_[4*(d+c*p)+2]=h[f+0],_[4*(d+c*p)+1]=h[f+1],_[4*(d+c*p)+0]=h[f+2],_[4*(d+c*p)+3]=h[f+3];return _},_getImageDataGrey8bits:function(e,t,i,n,s,r,o,a,l){const h=i,c=e.width,u=e.height;let d,p,f,_=0;const m=new Uint8Array(c*u*4);for(f=n;f!==r;f+=s)for(p=o;p!==l;p+=a,_++)d=h[_],m[4*(p+c*f)+0]=d,m[4*(p+c*f)+1]=d,m[4*(p+c*f)+2]=d,m[4*(p+c*f)+3]=255;return m},_getImageDataGrey16bits:function(e,t,i,n,s,r,o,a,l){const h=i,c=e.width,u=e.height;let d,p,f=0;const _=new Uint8Array(c*u*4);for(p=n;p!==r;p+=s)for(d=o;d!==l;d+=a,f+=2)_[4*(d+c*p)+0]=h[f+0],_[4*(d+c*p)+1]=h[f+0],_[4*(d+c*p)+2]=h[f+0],_[4*(d+c*p)+3]=h[f+1];return _}};class Ic{constructor(){this.supportCascades=!1}canLoad(e){return e.endsWith(".tga")}loadCubeData(){throw".env not supported in Cube."}loadData(e,t,i){const n=new Uint8Array(e.buffer,e.byteOffset,e.byteLength),s=Pc(n);i(s.width,s.height,t.generateMipMaps,!1,(()=>{Rc(t,n)}))}}ue.D._TextureLoaders.push(new Ic);class Dc{constructor(){this.supportCascades=!1}canLoad(e){return e.endsWith(".hdr")}loadCubeData(){throw".env not supported in Cube."}loadData(e,t,i){const n=new Uint8Array(e.buffer,e.byteOffset,e.byteLength),s=Mh.RGBE_ReadHeader(n),r=Mh.RGBE_ReadPixels(n,s),o=s.width*s.height,a=new Float32Array(4*o);for(let e=0;e<o;e+=1)a[4*e]=r[3*e],a[4*e+1]=r[3*e+1],a[4*e+2]=r[3*e+2],a[4*e+3]=1;i(s.width,s.height,t.generateMipMaps,!1,(()=>{const e=t.getEngine();t.type=1,t.format=5,t._gammaSpace=!1,e._uploadDataToTextureDirectly(t,a)}))}}ue.D._TextureLoaders.push(new Dc);class Oc{}var wc;!function(e){e[e.cTFETC1=0]="cTFETC1",e[e.cTFETC2=1]="cTFETC2",e[e.cTFBC1=2]="cTFBC1",e[e.cTFBC3=3]="cTFBC3",e[e.cTFBC4=4]="cTFBC4",e[e.cTFBC5=5]="cTFBC5",e[e.cTFBC7=6]="cTFBC7",e[e.cTFPVRTC1_4_RGB=8]="cTFPVRTC1_4_RGB",e[e.cTFPVRTC1_4_RGBA=9]="cTFPVRTC1_4_RGBA",e[e.cTFASTC_4x4=10]="cTFASTC_4x4",e[e.cTFATC_RGB=11]="cTFATC_RGB",e[e.cTFATC_RGBA_INTERPOLATED_ALPHA=12]="cTFATC_RGBA_INTERPOLATED_ALPHA",e[e.cTFRGBA32=13]="cTFRGBA32",e[e.cTFRGB565=14]="cTFRGB565",e[e.cTFBGR565=15]="cTFBGR565",e[e.cTFRGBA4444=16]="cTFRGBA4444",e[e.cTFFXT1_RGB=17]="cTFFXT1_RGB",e[e.cTFPVRTC2_4_RGB=18]="cTFPVRTC2_4_RGB",e[e.cTFPVRTC2_4_RGBA=19]="cTFPVRTC2_4_RGBA",e[e.cTFETC2_EAC_R11=20]="cTFETC2_EAC_R11",e[e.cTFETC2_EAC_RG11=21]="cTFETC2_EAC_RG11"}(wc||(wc={}));const Nc={JSModuleURL:"https://cdn.babylonjs.com/basisTranscoder/1/basis_transcoder.js",WasmModuleURL:"https://cdn.babylonjs.com/basisTranscoder/1/basis_transcoder.wasm"},Fc=(e,t)=>{let i;switch(e){case wc.cTFETC1:i=36196;break;case wc.cTFBC1:i=33776;break;case wc.cTFBC4:i=33779;break;case wc.cTFASTC_4x4:i=37808;break;case wc.cTFETC2:i=37496;break;case wc.cTFBC7:i=36492}if(void 0===i)throw"The chosen Basis transcoder format is not currently supported";return i};let Lc=null,Bc=null,Uc=0;const Vc=(e,t)=>{const i=e instanceof ArrayBuffer?new Uint8Array(e):e;return new Promise(((e,n)=>{(Lc||(Lc=new Promise(((e,t)=>{Bc?e(Bc):de.w1.LoadFileAsync(Nc.WasmModuleURL).then((i=>{if("function"!=typeof URL)return t("Basis transcoder requires an environment with a URL constructor");const n=URL.createObjectURL(new Blob([`(${Wc})()`],{type:"application/javascript"}));Bc=new Worker(n);const s=i=>{"init"===i.data.action?(Bc.removeEventListener("message",s),e(Bc)):"error"===i.data.action&&t(i.data.error||"error initializing worker")};Bc.addEventListener("message",s),Bc.postMessage({action:"init",url:Nc.JSModuleURL,wasmBinary:i})})).catch(t)}))),Lc).then((()=>{const s=Uc++,r=t=>{"transcode"===t.data.action&&t.data.id===s&&(Bc.removeEventListener("message",r),t.data.success?e(t.data):n("Transcode is not supported on this device"))};Bc.addEventListener("message",r);const o=new Uint8Array(i.byteLength);o.set(new Uint8Array(i.buffer,i.byteOffset,i.byteLength)),Bc.postMessage({action:"transcode",id:s,imageData:o,config:t,ignoreSupportedFormats:!1},[o.buffer])}),(e=>{n(e)}))}))},kc=(e,t)=>{var i,n;let s=null===(i=t._gl)||void 0===i?void 0:i.TEXTURE_2D;e.isCube&&(s=null===(n=t._gl)||void 0===n?void 0:n.TEXTURE_CUBE_MAP),t._bindTextureDirectly(s,e,!0)},Gc=(e,t)=>{const i=e.getEngine();for(let n=0;n<t.fileInfo.images.length;n++){const s=t.fileInfo.images[n].levels[0];if(e._invertVScale=e.invertY,-1===t.format||t.format===wc.cTFRGB565)if(e.type=10,e.format=4,!i._features.basisNeedsPOT||lt.R.Log2(s.width)%1==0&&lt.R.Log2(s.height)%1==0)e._invertVScale=!e.invertY,e.width=s.width+3&-4,e.height=s.height+3&-4,e.samplingMode=2,kc(e,i),i._uploadDataToTextureDirectly(e,new Uint16Array(s.transcodedPixels.buffer),n,0,4,!0);else{const t=new Ei.l(i,Ei.S.Temp);e._invertVScale=e.invertY,t.type=10,t.format=4,t.width=s.width+3&-4,t.height=s.height+3&-4,kc(t,i),i._uploadDataToTextureDirectly(t,new Uint16Array(s.transcodedPixels.buffer),n,0,4,!0),i._rescaleTexture(t,e,i.scenes[0],i._getInternalFormat(4),(()=>{i._releaseTexture(t),kc(e,i)}))}else{e.width=s.width,e.height=s.height,e.generateMipMaps=t.fileInfo.images[n].levels.length>1;const r=zc.GetInternalFormatFromBasisFormat(t.format,i);e.format=r,kc(e,i),t.fileInfo.images[n].levels.forEach(((t,s)=>{i._uploadCompressedDataToTextureDirectly(e,r,t.width,t.height,t.transcodedPixels,n,s)})),!i._features.basisNeedsPOT||lt.R.Log2(e.width)%1==0&&lt.R.Log2(e.height)%1==0||(de.w1.Warn("Loaded .basis texture width and height are not a power of two. Texture wrapping will be set to Texture.CLAMP_ADDRESSMODE as other modes are not supported with non power of two dimensions in webGL 1."),e._cachedWrapU=Ce.x.CLAMP_ADDRESSMODE,e._cachedWrapV=Ce.x.CLAMP_ADDRESSMODE)}}},zc={JSModuleURL:Nc.JSModuleURL,WasmModuleURL:Nc.WasmModuleURL,GetInternalFormatFromBasisFormat:Fc,TranscodeAsync:Vc,LoadTextureFromTranscodeResult:Gc};function Wc(){let e=null;function t(e,t,i,n,s){const r=e.getImageTranscodedSizeInBytes(t,i,n);let o=new Uint8Array(r);return e.transcodeImage(o,t,i,n,1,0)?(s&&(o=function(e,t,i,n){const s=new Uint16Array(4),r=new Uint16Array(i*n),o=i/4,a=n/4;for(let t=0;t<a;t++)for(let n=0;n<o;n++){const a=0+8*(t*o+n);s[0]=e[a]|e[a+1]<<8,s[1]=e[a+2]|e[a+3]<<8,s[2]=(2*(31&s[0])+1*(31&s[1]))/3|(2*(2016&s[0])+1*(2016&s[1]))/3&2016|(2*(63488&s[0])+1*(63488&s[1]))/3&63488,s[3]=(2*(31&s[1])+1*(31&s[0]))/3|(2*(2016&s[1])+1*(2016&s[0]))/3&2016|(2*(63488&s[1])+1*(63488&s[0]))/3&63488;for(let o=0;o<4;o++){const l=e[a+4+o];let h=(4*t+o)*i+4*n;r[h++]=s[3&l],r[h++]=s[l>>2&3],r[h++]=s[l>>4&3],r[h++]=s[l>>6&3]}}return r}(o,0,e.getImageWidth(t,i)+3&-4,e.getImageHeight(t,i)+3&-4)),o):null}onmessage=i=>{if("init"===i.data.action){if(!e){try{importScripts(i.data.url)}catch(e){postMessage({action:"error",error:e})}e=BASIS({wasmBinary:i.data.wasmBinary})}null!==e&&e.then((e=>{BASIS=e,e.initializeBasis(),postMessage({action:"init"})}))}else if("transcode"===i.data.action){const e=i.data.config,n=i.data.imageData,s=new BASIS.BasisFile(n),r=function(e){const t=e.getHasAlpha(),i=e.getNumImages(),n=[];for(let t=0;t<i;t++){const i={levels:[]},s=e.getNumLevels(t);for(let n=0;n<s;n++){const s={width:e.getImageWidth(t,n),height:e.getImageHeight(t,n)};i.levels.push(s)}n.push(i)}return{hasAlpha:t,images:n}}(s);let o=i.data.ignoreSupportedFormats?null:function(e,t){let i=null;return e.supportedCompressionFormats&&(i=e.supportedCompressionFormats.astc?10:e.supportedCompressionFormats.bc7?6:e.supportedCompressionFormats.s3tc?t.hasAlpha?3:2:e.supportedCompressionFormats.pvrtc?t.hasAlpha?9:8:e.supportedCompressionFormats.etc2?1:e.supportedCompressionFormats.etc1?0:14),i}(i.data.config,r),a=!1;null===o&&(a=!0,o=r.hasAlpha?3:2);let l=!0;s.startTranscoding()||(l=!1);const h=[];for(let i=0;i<r.images.length&&l;i++){const n=r.images[i];if(void 0===e.loadSingleImage||e.loadSingleImage===i){let r=n.levels.length;!1===e.loadMipmapLevels&&(r=1);for(let e=0;e<r;e++){const r=n.levels[e],c=t(s,i,e,o,a);if(!c){l=!1;break}r.transcodedPixels=c,h.push(r.transcodedPixels.buffer)}}}s.close(),s.delete(),a&&(o=-1),l?postMessage({action:"transcode",success:l,id:i.data.id,fileInfo:r,format:o},h):postMessage({action:"transcode",success:l,id:i.data.id})}}}Object.defineProperty(zc,"JSModuleURL",{get:function(){return Nc.JSModuleURL},set:function(e){Nc.JSModuleURL=e}}),Object.defineProperty(zc,"WasmModuleURL",{get:function(){return Nc.WasmModuleURL},set:function(e){Nc.WasmModuleURL=e}});class Hc{constructor(){this.supportCascades=!1}canLoad(e){return e.endsWith(".basis")}loadCubeData(e,t,i,n,s){if(Array.isArray(e))return;const r=t.getEngine().getCaps(),o={supportedCompressionFormats:{etc1:!!r.etc1,s3tc:!!r.s3tc,pvrtc:!!r.pvrtc,etc2:!!r.etc2,astc:!!r.astc,bc7:!!r.bptc}};Vc(e,o).then((e=>{const i=e.fileInfo.images[0].levels.length>1&&t.generateMipMaps;Gc(t,e),t.getEngine()._setCubeMapTextureParams(t,i),t.isReady=!0,t.onLoadedObservable.notifyObservers(t),t.onLoadedObservable.clear(),n&&n()})).catch((e=>{de.w1.Warn("Failed to transcode Basis file, transcoding may not be supported on this device"),t.isReady=!0,s&&s(e)}))}loadData(e,t,i){const n=t.getEngine().getCaps(),s={supportedCompressionFormats:{etc1:!!n.etc1,s3tc:!!n.s3tc,pvrtc:!!n.pvrtc,etc2:!!n.etc2,astc:!!n.astc,bc7:!!n.bptc}};Vc(e,s).then((e=>{const n=e.fileInfo.images[0].levels[0],s=e.fileInfo.images[0].levels.length>1&&t.generateMipMaps;i(n.width,n.height,s,-1!==e.format,(()=>{Gc(t,e)}))})).catch((e=>{de.w1.Warn("Failed to transcode Basis file, transcoding may not be supported on this device"),de.w1.Warn(`Failed to transcode Basis file: ${e}`),i(0,0,!1,!1,(()=>{}),!0)}))}}ue.D._TextureLoaders.push(new Hc);class Xc extends Ai._{get isSupported(){var e,t;return null!==(t=null===(e=this._engine)||void 0===e?void 0:e.getCaps().drawBuffersExtension)&&void 0!==t&&t}get textures(){return this._textures}get count(){return this._count}get depthTexture(){return this._textures[this._textures.length-1]}set wrapU(e){if(this._textures)for(let t=0;t<this._textures.length;t++)this._textures[t].wrapU=e}set wrapV(e){if(this._textures)for(let t=0;t<this._textures.length;t++)this._textures[t].wrapV=e}constructor(e,t,i,n,s,r){const o=!(!s||!s.generateMipMaps)&&s.generateMipMaps,a=!(!s||!s.generateDepthTexture)&&s.generateDepthTexture,l=s&&s.depthTextureFormat?s.depthTextureFormat:15,h=!s||void 0===s.doNotChangeAspectRatio||s.doNotChangeAspectRatio,c=!(!s||!s.drawOnlyOnFirstAttachmentByDefault)&&s.drawOnlyOnFirstAttachmentByDefault;if(super(e,t,n,o,h,void 0,void 0,void 0,void 0,void 0,void 0,void 0,!0),!this.isSupported)return void this.dispose();this._textureNames=r;const u=[],d=[],p=[],f=[],_=[],m=[],g=[],v=[];this._initTypes(i,u,d,p,f,_,m,g,v,s);const y=!s||void 0===s.generateDepthBuffer||s.generateDepthBuffer,x=!(!s||void 0===s.generateStencilBuffer)&&s.generateStencilBuffer;this._size=t,this._multiRenderTargetOptions={samplingModes:d,generateMipMaps:o,generateDepthBuffer:y,generateStencilBuffer:x,generateDepthTexture:a,depthTextureFormat:l,types:u,textureCount:i,useSRGBBuffers:p,formats:f,targetTypes:_,faceIndex:m,layerIndex:g,layerCounts:v},this._count=i,this._drawOnlyOnFirstAttachmentByDefault=c,i>0&&(this._createInternalTextures(),this._createTextures(r))}_initTypes(e,t,i,n,s,r,o,a,l,h){for(let c=0;c<e;c++)h&&h.types&&void 0!==h.types[c]?t.push(h.types[c]):t.push(h&&h.defaultType?h.defaultType:0),h&&h.samplingModes&&void 0!==h.samplingModes[c]?i.push(h.samplingModes[c]):i.push(Ce.x.BILINEAR_SAMPLINGMODE),h&&h.useSRGBBuffers&&void 0!==h.useSRGBBuffers[c]?n.push(h.useSRGBBuffers[c]):n.push(!1),h&&h.formats&&void 0!==h.formats[c]?s.push(h.formats[c]):s.push(5),h&&h.targetTypes&&void 0!==h.targetTypes[c]?r.push(h.targetTypes[c]):r.push(3553),h&&h.faceIndex&&void 0!==h.faceIndex[c]?o.push(h.faceIndex[c]):o.push(0),h&&h.layerIndex&&void 0!==h.layerIndex[c]?a.push(h.layerIndex[c]):a.push(0),h&&h.layerCounts&&void 0!==h.layerCounts[c]?l.push(h.layerCounts[c]):l.push(1)}_createInternaTextureIndexMapping(){const e={},t=[];if(!this._renderTarget)return t;const i=this._renderTarget.textures;for(let n=0;n<i.length;n++){const s=i[n];if(!s)continue;const r=e[s.uniqueId];void 0!==r?t[n]=r:e[s.uniqueId]=n}return t}_rebuild(e=!1,t){if(this._count<1)return;const i=this._createInternaTextureIndexMapping();this.releaseInternalTextures(),this._createInternalTextures(),e&&(this._releaseTextures(),this._createTextures(t));const n=this._renderTarget.textures;for(let e=0;e<n.length;e++){const t=this._textures[e];void 0!==i[e]&&this._renderTarget.setTexture(n[i[e]],e),t._texture=n[e],t._texture&&(t._noMipmap=!t._texture.useMipMaps,t._useSRGBBuffer=t._texture._useSRGBBuffer)}1!==this.samples&&this._renderTarget.setSamples(this.samples,!this._drawOnlyOnFirstAttachmentByDefault,!0)}_createInternalTextures(){this._renderTarget=this._getEngine().createMultipleRenderTarget(this._size,this._multiRenderTargetOptions,!this._drawOnlyOnFirstAttachmentByDefault),this._texture=this._renderTarget.texture}_releaseTextures(){if(this._textures)for(let e=0;e<this._textures.length;e++)this._textures[e]._texture=null,this._textures[e].dispose()}_createTextures(e){const t=this._renderTarget.textures;this._textures=[];for(let i=0;i<t.length;i++){const n=new Ce.x(null,this.getScene());(null==e?void 0:e[i])&&(n.name=e[i]),n._texture=t[i],n._texture&&(n._noMipmap=!n._texture.useMipMaps,n._useSRGBBuffer=n._texture._useSRGBBuffer),this._textures.push(n)}}setInternalTexture(e,t,i=!0){var n,s;if(this.renderTarget&&(0===t&&(this._texture=e),this.renderTarget.setTexture(e,t,i),this.textures[t]||(this.textures[t]=new Ce.x(null,this.getScene()),this.textures[t].name=null!==(s=null===(n=this._textureNames)||void 0===n?void 0:n[t])&&void 0!==s?s:this.textures[t].name),this.textures[t]._texture=e,this.textures[t]._noMipmap=!e.useMipMaps,this.textures[t]._useSRGBBuffer=e._useSRGBBuffer,this._count=this.renderTarget.textures?this.renderTarget.textures.length:0,this._multiRenderTargetOptions.types&&(this._multiRenderTargetOptions.types[t]=e.type),this._multiRenderTargetOptions.samplingModes&&(this._multiRenderTargetOptions.samplingModes[t]=e.samplingMode),this._multiRenderTargetOptions.useSRGBBuffers&&(this._multiRenderTargetOptions.useSRGBBuffers[t]=e._useSRGBBuffer),this._multiRenderTargetOptions.targetTypes&&-1!==this._multiRenderTargetOptions.targetTypes[t])){let i=0;i=e.is2DArray?35866:e.isCube?34067:e.is3D?32879:3553,this._multiRenderTargetOptions.targetTypes[t]=i}}setLayerAndFaceIndex(e,t=-1,i=-1){this.textures[e]&&this.renderTarget&&(this._multiRenderTargetOptions.layerIndex&&(this._multiRenderTargetOptions.layerIndex[e]=t),this._multiRenderTargetOptions.faceIndex&&(this._multiRenderTargetOptions.faceIndex[e]=i),this.renderTarget.setLayerAndFaceIndex(e,t,i))}setLayerAndFaceIndices(e,t){this.renderTarget&&(this._multiRenderTargetOptions.layerIndex=e,this._multiRenderTargetOptions.faceIndex=t,this.renderTarget.setLayerAndFaceIndices(e,t))}get samples(){return this._samples}set samples(e){this._renderTarget?this._samples=this._renderTarget.setSamples(e):this._samples=e}resize(e){this._size=e,this._rebuild(void 0,this._textureNames)}updateCount(e,t,i){this._multiRenderTargetOptions.textureCount=e,this._count=e;const n=[],s=[],r=[],o=[],a=[],l=[],h=[],c=[];this._textureNames=i,this._initTypes(e,n,s,r,o,a,l,h,c,t),this._multiRenderTargetOptions.types=n,this._multiRenderTargetOptions.samplingModes=s,this._multiRenderTargetOptions.useSRGBBuffers=r,this._multiRenderTargetOptions.formats=o,this._multiRenderTargetOptions.targetTypes=a,this._multiRenderTargetOptions.faceIndex=l,this._multiRenderTargetOptions.layerIndex=h,this._multiRenderTargetOptions.layerCounts=c,this._rebuild(!0,i)}_unbindFrameBuffer(e,t){this._renderTarget&&e.unBindMultiColorAttachmentFramebuffer(this._renderTarget,this.isCube,(()=>{this.onAfterRenderObservable.notifyObservers(t)}))}dispose(e=!1){this._releaseTextures(),e?this._texture=null:this.releaseInternalTextures(),super.dispose()}releaseInternalTextures(){var e,t;const i=null===(e=this._renderTarget)||void 0===e?void 0:e.textures;if(i){for(let e=i.length-1;e>=0;e--)this._textures[e]._texture=null;null===(t=this._renderTarget)||void 0===t||t.dispose(),this._renderTarget=null}}}class jc{constructor(e,t,i){this.id=e,this.scale=t,this.offset=i}}class Yc{constructor(e,t,i,n){var s,r,o,l,h,c,u,d,p,f,_,m,g;return this.name=e,this.meshes=t,this.scene=n,this.options=i,this.options.map=null!==(s=this.options.map)&&void 0!==s?s:["ambientTexture","bumpTexture","diffuseTexture","emissiveTexture","lightmapTexture","opacityTexture","reflectionTexture","refractionTexture","specularTexture"],this.options.uvsIn=null!==(r=this.options.uvsIn)&&void 0!==r?r:qe.o.UVKind,this.options.uvsOut=null!==(o=this.options.uvsOut)&&void 0!==o?o:qe.o.UVKind,this.options.layout=null!==(l=this.options.layout)&&void 0!==l?l:Yc.LAYOUT_STRIP,this.options.layout===Yc.LAYOUT_COLNUM&&(this.options.colnum=null!==(h=this.options.colnum)&&void 0!==h?h:8),this.options.updateInputMeshes=null===(c=this.options.updateInputMeshes)||void 0===c||c,this.options.disposeSources=null===(u=this.options.disposeSources)||void 0===u||u,this._expecting=0,this.options.fillBlanks=null===(d=this.options.fillBlanks)||void 0===d||d,!0===this.options.fillBlanks&&(this.options.customFillColor=null!==(p=this.options.customFillColor)&&void 0!==p?p:"black"),this.options.frameSize=null!==(f=this.options.frameSize)&&void 0!==f?f:256,this.options.paddingRatio=null!==(_=this.options.paddingRatio)&&void 0!==_?_:.0115,this._paddingValue=Math.ceil(this.options.frameSize*this.options.paddingRatio),this._paddingValue%2!=0&&this._paddingValue++,this.options.paddingMode=null!==(m=this.options.paddingMode)&&void 0!==m?m:Yc.SUBUV_WRAP,this.options.paddingMode===Yc.SUBUV_COLOR&&(this.options.paddingColor=null!==(g=this.options.paddingColor)&&void 0!==g?g:new a.HE(0,0,0,1)),this.sets={},this.frames=[],this}_createFrames(e){const t=this._calculateSize(),i=new o.FM(1,1).divide(t);let n=0;const s=this._expecting,r=this.meshes.length,l=Object.keys(this.sets);for(let e=0;e<l.length;e++){const i=l[e],n=new zi.c(this.name+".TexturePack."+i+"Set",{width:t.x,height:t.y},this.scene,!0,Ce.x.TRILINEAR_SAMPLINGMODE,ue.D.TEXTUREFORMAT_RGBA),s=n.getContext();s.fillStyle="rgba(0,0,0,0)",s.fillRect(0,0,t.x,t.y),n.update(!1),this.sets[i]=n}const h=this.options.frameSize||256,c=this._paddingValue,u=h+2*c,d=()=>{this._calculateMeshUVFrames(h,c,t,i,this.options.updateInputMeshes||!1)};for(let i=0;i<r;i++){const r=this.meshes[i].material;for(let o=0;o<l.length;o++){const p=new zi.c("temp",u,this.scene,!0),f=p.getContext(),_=this._getFrameOffset(i),m=()=>{n++,p.update(!1);const i=f.getImageData(0,0,u,u),r=this.sets[g];if(r.getContext().putImageData(i,t.x*_.x,t.y*_.y),p.dispose(),r.update(!1),n==s)return d(),void e()},g=l[o]||"_blank";if(r&&null!==r[g]){const e=r[g],t=new Image;e instanceof zi.c?t.src=e.getContext().canvas.toDataURL("image/png"):t.src=e.url,de.w1.SetCorsBehavior(t.src,t),t.onload=()=>{f.fillStyle="rgba(0,0,0,0)",f.fillRect(0,0,u,u),p.update(!1),f.setTransform(1,0,0,-1,0,0);const e=[0,0,1,0,1,1,0,1,-1,1,-1,0,-2,0,-1,1,-1];switch(this.options.paddingMode){case 0:for(let i=0;i<9;i++)f.drawImage(t,0,0,t.width,t.height,c+h*e[i],c+h*e[i+1]-u,h,h);break;case 1:for(let i=0;i<c;i++)f.drawImage(t,0,0,t.width,t.height,i+h*e[0],c-u,h,h),f.drawImage(t,0,0,t.width,t.height,2*c-i,c-u,h,h),f.drawImage(t,0,0,t.width,t.height,c,i-u,h,h),f.drawImage(t,0,0,t.width,t.height,c,2*c-i-u,h,h);f.drawImage(t,0,0,t.width,t.height,c+h*e[0],c+h*e[1]-u,h,h);break;case 2:f.fillStyle=(this.options.paddingColor||a.Wo.Black()).toHexString(),f.fillRect(0,0,u,-u),f.clearRect(c,c,h,h),f.drawImage(t,0,0,t.width,t.height,c+h*e[0],c+h*e[1]-u,h,h)}f.setTransform(1,0,0,1,0,0),m()}}else f.fillStyle="rgba(0,0,0,0)",this.options.fillBlanks&&(f.fillStyle=this.options.customFillColor),f.fillRect(0,0,u,u),m()}}}_calculateSize(){const e=this.meshes.length||0,t=this.options.frameSize||0,i=this._paddingValue||0;switch(this.options.layout){case 0:return new o.FM(t*e+2*i*e,t+2*i);case 1:{const n=Math.max(2,Math.ceil(Math.sqrt(e))),s=t*n+2*i*n;return new o.FM(s,s)}case 2:{const n=this.options.colnum||1,s=Math.max(1,Math.ceil(e/n));return new o.FM(t*n+2*i*n,t*s+2*i*s)}}return o.FM.Zero()}_calculateMeshUVFrames(e,t,i,n,s){const r=this.meshes.length;for(let a=0;a<r;a++){const r=this.meshes[a],l=new o.FM(e/i.x,e/i.y),h=n.clone().scale(t),c=this._getFrameOffset(a).add(h),u=new jc(a,l,c);this.frames.push(u),s&&(this._updateMeshUV(r,a),this._updateTextureReferences(r))}}_getFrameOffset(e){const t=this.meshes.length;let i,n,s;switch(this.options.layout){case 0:return i=1/t,new o.FM(e*i,0);case 1:{const r=Math.max(2,Math.ceil(Math.sqrt(t)));return n=Math.floor(e/r),s=e-n*r,i=1/r,new o.FM(s*i,n*i)}case 2:{const r=this.options.colnum||1,a=Math.max(1,Math.ceil(t/r));return s=Math.floor(e/a),n=e-s*a,i=new o.FM(1/r,1/a),new o.FM(s*i.x,n*i.y)}}return o.FM.Zero()}_updateMeshUV(e,t){const i=this.frames[t],n=e.getVerticesData(this.options.uvsIn||qe.o.UVKind),s=[];let r=0;n.length&&(r=n.length||0);for(let e=0;e<r;e+=2)s.push(n[e]*i.scale.x+i.offset.x,n[e+1]*i.scale.y+i.offset.y);e.setVerticesData(this.options.uvsOut||qe.o.UVKind,s)}_updateTextureReferences(e,t=!1){const i=e.material,n=Object.keys(this.sets),s=e=>{e.dispose&&e.dispose()};for(let e=0;e<n.length;e++){const r=n[e];if(t)null!==i[r]&&s(i[r]),i[r]=this.sets[r];else{if(!i)return;null!==i[r]&&(s(i[r]),i[r]=this.sets[r])}}}setMeshToFrame(e,t,i=!1){this._updateMeshUV(e,t),i&&this._updateTextureReferences(e,!0)}processAsync(){return new Promise(((e,t)=>{try{if(0===this.meshes.length)return void e();let t=0;const i=i=>{if(t++,this.options.map){for(let e=0;e<this.options.map.length;e++)null!==i[this.options.map[e]]&&(this.sets[this.options.map[e]]||(this.sets[this.options.map[e]]=!0),this._expecting++);t===this.meshes.length&&this._createFrames(e)}};for(let n=0;n<this.meshes.length;n++){const s=this.meshes[n],r=s.material;if(r)r.forceCompilationAsync(s).then((()=>{i(r)}));else if(t++,t===this.meshes.length)return this._createFrames(e)}}catch(e){return t(e)}}))}dispose(){const e=Object.keys(this.sets);for(let t=0;t<e.length;t++){const i=e[t];this.sets[i].dispose()}}download(e="png",t=1){setTimeout((()=>{const i={name:this.name,sets:{},options:{},frames:[]},n=Object.keys(this.sets),s=Object.keys(this.options);try{for(let s=0;s<n.length;s++){const r=n[s],o=this.sets[r];i.sets[r]=o.getContext().canvas.toDataURL("image/"+e,t)}for(let e=0;e<s.length;e++){const t=s[e];i.options[t]=this.options[t]}for(let e=0;e<this.frames.length;e++){const t=this.frames[e];i.frames.push(t.scale.x,t.scale.y,t.offset.x,t.offset.y)}}catch(e){return void _.Y.Warn("Unable to download: "+e)}const r="data:text/json;charset=utf-8,"+encodeURIComponent(JSON.stringify(i,null,4)),o=document.createElement("a");o.setAttribute("href",r),o.setAttribute("download",this.name+"_texurePackage.json"),document.body.appendChild(o),o.click(),o.remove()}),0)}updateFromJSON(e){try{const t=JSON.parse(e);this.name=t.name;const i=Object.keys(t.options);for(let e=0;e<i.length;e++)this.options[i[e]]=t.options[i[e]];for(let e=0;e<t.frames.length;e+=4){const i=new jc(e/4,new o.FM(t.frames[e],t.frames[e+1]),new o.FM(t.frames[e+2],t.frames[e+3]));this.frames.push(i)}const n=Object.keys(t.sets);for(let e=0;e<n.length;e++){const i=new Ce.x(t.sets[n[e]],this.scene,!1,!1);this.sets[n[e]]=i}}catch(e){_.Y.Warn("Unable to update from JSON: "+e)}}}Yc.LAYOUT_STRIP=0,Yc.LAYOUT_POWER2=1,Yc.LAYOUT_COLNUM=2,Yc.SUBUV_WRAP=0,Yc.SUBUV_EXTEND=1,Yc.SUBUV_COLOR=2;var qc=i(7902),Kc=i(6662);class $c extends qc.g{constructor(e,t,i,n,s,r,o){super(e,i,null,n,s,r),this._animate=!0,this._time=0,this._texturePath=t,o?this.setFragment(this._texturePath):this._loadJson(t),this.refreshRate=1}_loadJson(e){const t=()=>{try{this.setFragment(this._texturePath)}catch(e){_.Y.Log("No json or ShaderStore or DOM element found for CustomProceduralTexture")}},i=e+"/config.json",n=new Kc.g;n.open("GET",i),n.addEventListener("load",(()=>{if(200===n.status||n.responseText&&n.responseText.length>0)try{this._config=JSON.parse(n.response),this.updateShaderUniforms(),this.updateTextures(),this.setFragment(this._texturePath+"/custom"),this._animate=this._config.animate,this.refreshRate=this._config.refreshrate}catch(e){t()}else t()}),!1),n.addEventListener("error",(()=>{t()}),!1);try{n.send()}catch(e){_.Y.Error("CustomProceduralTexture: Error on XHR send request.")}}isReady(){if(!super.isReady())return!1;for(const e in this._textures)if(!this._textures[e].isReady())return!1;return!0}render(e){const t=this.getScene();this._animate&&t&&(this._time+=.03*t.getAnimationRatio(),this.updateShaderUniforms()),super.render(e)}updateTextures(){for(let e=0;e<this._config.sampler2Ds.length;e++)this.setTexture(this._config.sampler2Ds[e].sample2Dname,new Ce.x(this._texturePath+"/"+this._config.sampler2Ds[e].textureRelativeUrl,this.getScene()))}updateShaderUniforms(){if(this._config)for(let e=0;e<this._config.uniforms.length;e++){const t=this._config.uniforms[e];switch(t.type){case"float":this.setFloat(t.name,t.value);break;case"color3":this.setColor3(t.name,new a.Wo(t.r,t.g,t.b));break;case"color4":this.setColor4(t.name,new a.HE(t.r,t.g,t.b,t.a));break;case"vector2":this.setVector2(t.name,new o.FM(t.x,t.y));break;case"vector3":this.setVector3(t.name,new o.P(t.x,t.y,t.z))}}this.setFloat("time",this._time)}get animate(){return this._animate}set animate(e){this._animate=e}}si.v.ShadersStore.noisePixelShader="uniform float brightness;\nuniform float persistence;\nuniform float timeScale;\nvarying vec2 vUV;\nvec2 hash22(vec2 p)\n{\np=p*mat2(127.1,311.7,269.5,183.3);\np=-1.0+2.0*fract(sin(p)*43758.5453123);\nreturn sin(p*6.283+timeScale);\n}\nfloat interpolationNoise(vec2 p)\n{\nvec2 pi=floor(p);\nvec2 pf=p-pi;\nvec2 w=pf*pf*(3.-2.*pf);\nfloat f00=dot(hash22(pi+vec2(.0,.0)),pf-vec2(.0,.0));\nfloat f01=dot(hash22(pi+vec2(.0,1.)),pf-vec2(.0,1.));\nfloat f10=dot(hash22(pi+vec2(1.0,0.)),pf-vec2(1.0,0.));\nfloat f11=dot(hash22(pi+vec2(1.0,1.)),pf-vec2(1.0,1.));\nfloat xm1=mix(f00,f10,w.x);\nfloat xm2=mix(f01,f11,w.x);\nfloat ym=mix(xm1,xm2,w.y); \nreturn ym;\n}\nfloat perlinNoise2D(float x,float y)\n{\nfloat sum=0.0;\nfloat frequency=0.0;\nfloat amplitude=0.0;\nfor(int i=0; i<OCTAVES; i++)\n{\nfrequency=pow(2.0,float(i));\namplitude=pow(persistence,float(i));\nsum=sum+interpolationNoise(vec2(x*frequency,y*frequency))*amplitude;\n}\nreturn sum;\n}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nfloat x=abs(vUV.x);\nfloat y=abs(vUV.y);\nfloat noise=brightness+(1.0-brightness)*perlinNoise2D(x,y);\ngl_FragColor=vec4(noise,noise,noise,1.0);\n}\n";class Qc extends qc.g{constructor(e,t=256,i=A.l.LastCreatedScene,n,s){super(e,t,"noise",i,n,s),this.time=0,this.brightness=.2,this.octaves=3,this.persistence=.8,this.animationSpeedFactor=1,this.autoClear=!1,this._updateShaderUniforms()}_updateShaderUniforms(){const e=this.getScene();e&&(this.time+=e.getAnimationRatio()*this.animationSpeedFactor*.01,this.setFloat("brightness",this.brightness),this.setFloat("persistence",this.persistence),this.setFloat("timeScale",this.time))}_getDefines(){return"#define OCTAVES "+(0|this.octaves)}render(e){this._updateShaderUniforms(),super.render(e)}serialize(){const e={customType:"BABYLON.NoiseProceduralTexture"};return e.brightness=this.brightness,e.octaves=this.octaves,e.persistence=this.persistence,e.animationSpeedFactor=this.animationSpeedFactor,e.size=this.getSize().width,e.generateMipMaps=this._generateMipMaps,e.time=this.time,e}clone(){const e=this.getSize(),t=new Qc(this.name,e.width,this.getScene(),this._fallbackTexture?this._fallbackTexture:void 0,this._generateMipMaps);return t.hasAlpha=this.hasAlpha,t.level=this.level,t.coordinatesMode=this.coordinatesMode,t.brightness=this.brightness,t.octaves=this.octaves,t.persistence=this.persistence,t.animationSpeedFactor=this.animationSpeedFactor,t.time=this.time,t}static Parse(e,t){var i;const n=new Qc(e.name,e.size,t,void 0,e.generateMipMaps);return n.brightness=e.brightness,n.octaves=e.octaves,n.persistence=e.persistence,n.animationSpeedFactor=e.animationSpeedFactor,n.time=null!==(i=e.time)&&void 0!==i?i:0,n}}(0,l.H)("BABYLON.NoiseProceduralTexture",Qc);var Zc=i(8517),Jc=i(9630),eu=i(3324);class tu extends Ce.x{constructor(e,t,i,n,s,r,o=!0,a=!1,l=Ce.x.TRILINEAR_SAMPLINGMODE,h=0){super(null,r,!o,a),this.format=s,this._texture=r.getEngine().createRawTexture3D(e,t,i,n,s,o,a,l,null,h),this.is3D=!0}update(e){this._texture&&this._getEngine().updateRawTexture3D(this._texture,e,this._texture.format,this._texture.invertY,null,this._texture.type)}}class iu extends Ai._{constructor(e,t,i,n){super(e,t,i,n,!0),this.refractionPlane=new ot.J(0,1,0,1),this.depth=2,this.onBeforeRenderObservable.add((()=>{this.getScene().clipPlane=this.refractionPlane})),this.onAfterRenderObservable.add((()=>{this.getScene().clipPlane=null}))}clone(){const e=this.getScene();if(!e)return this;const t=this.getSize(),i=new iu(this.name,t.width,e,this._generateMipMaps);return i.hasAlpha=this.hasAlpha,i.level=this.level,i.refractionPlane=this.refractionPlane.clone(),this.renderList&&(i.renderList=this.renderList.slice(0)),i.depth=this.depth,i}serialize(){if(!this.name)return null;const e=super.serialize();return e.mirrorPlane=this.refractionPlane.asArray(),e.depth=this.depth,e}}var nu=i(2035);class su extends nu.g{get renderTarget(){return this._renderTarget}constructor(e,t,i){super(null),this._renderTarget=null,this._engine=e,this._renderTargetOptions=i,this.resize(t)}resize(e){var t;null===(t=this._renderTarget)||void 0===t||t.dispose(),this._renderTarget=null,this._texture=null,this._size=e,this._engine&&(this._renderTarget=this._engine.createRenderTargetTexture(this._size,this._renderTargetOptions)),this._texture=this.renderTarget.texture}getInternalTexture(){return this._texture}getClassName(){return"ThinRenderTargetTexture"}dispose(e=!1){var t;null===(t=this._renderTarget)||void 0===t||t.dispose(!0),this._renderTarget=null,e||super.dispose()}}var ru=i(4767),ou=i(3837),au=i(8832),lu=i(9135),hu=i(2904),cu=i(8660);class uu extends cu.VT{constructor(e,t,i,n,s){super(e,t,i),this._blockType=n,this._blockName=s,this.needDualDirectionValidation=!0}checkCompatibilityState(e){return e instanceof uu&&e._blockName===this._blockName?cu.WS.Compatible:cu.WS.TypeIncompatible}createCustomInputBlock(){return[new this._blockType(this._blockName),this.name]}}var du=i(468),pu=i(7123),fu=i(363);class _u extends du.k{constructor(e){super(e,ru.u.Vertex),this.registerInput("matricesIndices",ou.E.Vector4),this.registerInput("matricesWeights",ou.E.Vector4),this.registerInput("matricesIndicesExtra",ou.E.Vector4,!0),this.registerInput("matricesWeightsExtra",ou.E.Vector4,!0),this.registerInput("world",ou.E.Matrix),this.registerOutput("output",ou.E.Matrix)}initialize(e){e._excludeVariableName("boneSampler"),e._excludeVariableName("boneTextureWidth"),e._excludeVariableName("mBones"),e._excludeVariableName("BonesPerMesh")}getClassName(){return"BonesBlock"}get matricesIndices(){return this._inputs[0]}get matricesWeights(){return this._inputs[1]}get matricesIndicesExtra(){return this._inputs[2]}get matricesWeightsExtra(){return this._inputs[3]}get world(){return this._inputs[4]}get output(){return this._outputs[0]}autoConfigure(e){if(!this.matricesIndices.isConnected){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"matricesIndices"===e.name));t||(t=new fu.S("matricesIndices"),t.setAsAttribute("matricesIndices")),t.output.connectTo(this.matricesIndices)}if(!this.matricesWeights.isConnected){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"matricesWeights"===e.name));t||(t=new fu.S("matricesWeights"),t.setAsAttribute("matricesWeights")),t.output.connectTo(this.matricesWeights)}if(!this.world.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.World));t||(t=new fu.S("world"),t.setAsSystemValue(lu.$.World)),t.output.connectTo(this.world)}}provideFallbacks(e,t){e&&e.useBones&&e.computeBonesUsingShaders&&e.skeleton&&t.addCPUSkinningFallback(0,e)}bind(e,t,i){La.G.BindBonesParameters(i,e)}prepareDefines(e,t,i){i._areAttributesDirty&&La.G.PrepareDefinesForBones(e,i)}_buildBlock(e){super._buildBlock(e),e.sharedData.blocksWithFallbacks.push(this),e.sharedData.forcedBindableBlocks.push(this),e.sharedData.blocksWithDefines.push(this),e.uniforms.push("boneTextureWidth"),e.uniforms.push("mBones"),e.samplers.push("boneSampler");const t=`//${this.name}`;e._emitFunctionFromInclude("bonesDeclaration",t,{removeAttributes:!0,removeUniforms:!1,removeVaryings:!0,removeIfDef:!1});const i=e._getFreeVariableName("influence");e.compilationString+=e._emitCodeFromInclude("bonesVertex",t,{replaceStrings:[{search:/finalWorld=finalWorld\*influence;/,replace:""},{search:/influence/gm,replace:i}]});const n=this._outputs[0],s=this.world;return e.compilationString+="#if NUM_BONE_INFLUENCERS>0\r\n",e.compilationString+=this._declareOutput(n,e)+` = ${s.associatedVariableName} * ${i};\r\n`,e.compilationString+="#else\r\n",e.compilationString+=this._declareOutput(n,e)+` = ${s.associatedVariableName};\r\n`,e.compilationString+="#endif\r\n",this}}(0,l.H)("BABYLON.BonesBlock",_u);class mu extends du.k{constructor(e){super(e,ru.u.Vertex),this.registerInput("world0",ou.E.Vector4),this.registerInput("world1",ou.E.Vector4),this.registerInput("world2",ou.E.Vector4),this.registerInput("world3",ou.E.Vector4),this.registerInput("world",ou.E.Matrix,!0),this.registerOutput("output",ou.E.Matrix),this.registerOutput("instanceID",ou.E.Float)}getClassName(){return"InstancesBlock"}get world0(){return this._inputs[0]}get world1(){return this._inputs[1]}get world2(){return this._inputs[2]}get world3(){return this._inputs[3]}get world(){return this._inputs[4]}get output(){return this._outputs[0]}get instanceID(){return this._outputs[1]}autoConfigure(e){if(!this.world0.connectedPoint){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"world0"===e.name));t||(t=new fu.S("world0"),t.setAsAttribute("world0")),t.output.connectTo(this.world0)}if(!this.world1.connectedPoint){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"world1"===e.name));t||(t=new fu.S("world1"),t.setAsAttribute("world1")),t.output.connectTo(this.world1)}if(!this.world2.connectedPoint){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"world2"===e.name));t||(t=new fu.S("world2"),t.setAsAttribute("world2")),t.output.connectTo(this.world2)}if(!this.world3.connectedPoint){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"world3"===e.name));t||(t=new fu.S("world3"),t.setAsAttribute("world3")),t.output.connectTo(this.world3)}if(!this.world.connectedPoint){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"world"===e.name));t||(t=new fu.S("world"),t.setAsSystemValue(lu.$.World)),t.output.connectTo(this.world)}this.world.define="!INSTANCES || THIN_INSTANCES"}prepareDefines(e,t,i,n=!1,s){let r=!1;i.INSTANCES!==n&&(i.setValue("INSTANCES",n),r=!0),s&&i.THIN_INSTANCES!==!!(null==s?void 0:s.getRenderingMesh().hasThinInstances)&&(i.setValue("THIN_INSTANCES",!!(null==s?void 0:s.getRenderingMesh().hasThinInstances)),r=!0),r&&i.markAsUnprocessed()}_buildBlock(e){super._buildBlock(e);const t=e.sharedData.scene.getEngine();e.sharedData.blocksWithDefines.push(this);const i=this._outputs[0],n=this._outputs[1],s=this.world0,r=this.world1,o=this.world2,a=this.world3;return e.compilationString+="#ifdef INSTANCES\r\n",e.compilationString+=this._declareOutput(i,e)+` = mat4(${s.associatedVariableName}, ${r.associatedVariableName}, ${o.associatedVariableName}, ${a.associatedVariableName});\r\n`,e.compilationString+="#ifdef THIN_INSTANCES\r\n",e.compilationString+=`${i.associatedVariableName} = ${this.world.associatedVariableName} * ${i.associatedVariableName};\r\n`,e.compilationString+="#endif\r\n",t._caps.canUseGLInstanceID?e.compilationString+=this._declareOutput(n,e)+" = float(gl_InstanceID);\r\n":e.compilationString+=this._declareOutput(n,e)+" = 0.0;\r\n",e.compilationString+="#else\r\n",e.compilationString+=this._declareOutput(i,e)+` = ${this.world.associatedVariableName};\r\n`,e.compilationString+=this._declareOutput(n,e)+" = 0.0;\r\n",e.compilationString+="#endif\r\n",this}}(0,l.H)("BABYLON.InstancesBlock",mu);class gu extends du.k{constructor(e){super(e,ru.u.Vertex),this.registerInput("position",ou.E.Vector3),this.registerInput("normal",ou.E.Vector3),this.registerInput("tangent",ou.E.AutoDetect),this.tangent.addExcludedConnectionPointFromAllowedTypes(ou.E.Color4|ou.E.Vector4|ou.E.Vector3),this.registerInput("uv",ou.E.Vector2),this.registerOutput("positionOutput",ou.E.Vector3),this.registerOutput("normalOutput",ou.E.Vector3),this.registerOutput("tangentOutput",ou.E.Vector4),this.registerOutput("uvOutput",ou.E.Vector2)}getClassName(){return"MorphTargetsBlock"}get position(){return this._inputs[0]}get normal(){return this._inputs[1]}get tangent(){return this._inputs[2]}get uv(){return this._inputs[3]}get positionOutput(){return this._outputs[0]}get normalOutput(){return this._outputs[1]}get tangentOutput(){return this._outputs[2]}get uvOutput(){return this._outputs[3]}initialize(e){e._excludeVariableName("morphTargetInfluences")}autoConfigure(e){if(!this.position.isConnected){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"position"===e.name));t||(t=new fu.S("position"),t.setAsAttribute()),t.output.connectTo(this.position)}if(!this.normal.isConnected){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"normal"===e.name));t||(t=new fu.S("normal"),t.setAsAttribute("normal")),t.output.connectTo(this.normal)}if(!this.tangent.isConnected){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"tangent"===e.name));t||(t=new fu.S("tangent"),t.setAsAttribute("tangent")),t.output.connectTo(this.tangent)}if(!this.uv.isConnected){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"uv"===e.name));t||(t=new fu.S("uv"),t.setAsAttribute("uv")),t.output.connectTo(this.uv)}}prepareDefines(e,t,i){if(e.morphTargetManager){const t=e.morphTargetManager;(null==t?void 0:t.isUsingTextureForTargets)&&t.numInfluencers!==i.NUM_MORPH_INFLUENCERS&&i.markAsAttributesDirty()}i._areAttributesDirty&&La.G.PrepareDefinesForMorphTargets(e,i)}bind(e,t,i){i&&i.morphTargetManager&&i.morphTargetManager.numInfluencers>0&&(La.G.BindMorphTargetParameters(i,e),i.morphTargetManager.isUsingTextureForTargets&&i.morphTargetManager._bind(e))}replaceRepeatableContent(e,t,i,n){const s=this.position,r=this.normal,o=this.tangent,a=this.uv,l=this.positionOutput,h=this.normalOutput,c=this.tangentOutput,u=this.uvOutput,d=e,p=n.NUM_MORPH_INFLUENCERS,f=i.morphTargetManager,_=f&&f.supportsNormals&&n.NORMAL,m=f&&f.supportsTangents&&n.TANGENT,g=f&&f.supportsUVs&&n.UV1;let v="";(null==f?void 0:f.isUsingTextureForTargets)&&p>0&&(v+="float vertexID;\r\n");for(let e=0;e<p;e++)v+="#ifdef MORPHTARGETS\r\n",(null==f?void 0:f.isUsingTextureForTargets)?(v+="vertexID = float(gl_VertexID) * morphTargetTextureInfo.x;\r\n",v+=`${l.associatedVariableName} += (readVector3FromRawSampler(${e}, vertexID) - ${s.associatedVariableName}) * morphTargetInfluences[${e}];\r\n`,v+="vertexID += 1.0;\r\n"):v+=`${l.associatedVariableName} += (position${e} - ${s.associatedVariableName}) * morphTargetInfluences[${e}];\r\n`,_&&(v+="#ifdef MORPHTARGETS_NORMAL\r\n",(null==f?void 0:f.isUsingTextureForTargets)?(v+=`${h.associatedVariableName} += (readVector3FromRawSampler(${e}, vertexID) - ${r.associatedVariableName}) * morphTargetInfluences[${e}];\r\n`,v+="vertexID += 1.0;\r\n"):v+=`${h.associatedVariableName} += (normal${e} - ${r.associatedVariableName}) * morphTargetInfluences[${e}];\r\n`,v+="#endif\r\n"),g&&(v+="#ifdef MORPHTARGETS_UV\r\n",(null==f?void 0:f.isUsingTextureForTargets)?(v+=`${u.associatedVariableName} += (readVector3FromRawSampler(${e}, vertexID).xy - ${a.associatedVariableName}) * morphTargetInfluences[${e}];\r\n`,v+="vertexID += 1.0;\r\n"):v+=`${u.associatedVariableName}.xy += (uv_${e} - ${a.associatedVariableName}.xy) * morphTargetInfluences[${e}];\r\n`,v+="#endif\r\n"),m&&(v+="#ifdef MORPHTARGETS_TANGENT\r\n",(null==f?void 0:f.isUsingTextureForTargets)?v+=`${c.associatedVariableName}.xyz += (readVector3FromRawSampler(${e}, vertexID) - ${o.associatedVariableName}.xyz) * morphTargetInfluences[${e}];\r\n`:v+=`${c.associatedVariableName}.xyz += (tangent${e} - ${o.associatedVariableName}.xyz) * morphTargetInfluences[${e}];\r\n`,o.type===ou.E.Vector4?v+=`${c.associatedVariableName}.w = ${o.associatedVariableName}.w;\r\n`:v+=`${c.associatedVariableName}.w = 1.;\r\n`,v+="#endif\r\n"),v+="#endif\r\n";if(d.compilationString=d.compilationString.replace(this._repeatableContentAnchor,v),p>0)for(let e=0;e<p;e++)d.attributes.push(qe.o.PositionKind+e),_&&d.attributes.push(qe.o.NormalKind+e),m&&d.attributes.push(qe.o.TangentKind+e),g&&d.attributes.push(qe.o.UVKind+"_"+e)}_buildBlock(e){super._buildBlock(e),e.sharedData.blocksWithDefines.push(this),e.sharedData.bindableBlocks.push(this),e.sharedData.repeatableContentBlocks.push(this);const t=this.position,i=this.normal,n=this.tangent,s=this.uv,r=this.positionOutput,o=this.normalOutput,a=this.tangentOutput,l=this.uvOutput,h=`//${this.name}`;return e.uniforms.push("morphTargetInfluences"),e.uniforms.push("morphTargetTextureInfo"),e.uniforms.push("morphTargetTextureIndices"),e.samplers.push("morphTargets"),e._emitFunctionFromInclude("morphTargetsVertexGlobalDeclaration",h),e._emitFunctionFromInclude("morphTargetsVertexDeclaration",h,{repeatKey:"maxSimultaneousMorphTargets"}),e.compilationString+=`${this._declareOutput(r,e)} = ${t.associatedVariableName};\r\n`,e.compilationString+="#ifdef NORMAL\r\n",e.compilationString+=`${this._declareOutput(o,e)} = ${i.associatedVariableName};\r\n`,e.compilationString+="#else\r\n",e.compilationString+=`${this._declareOutput(o,e)} = vec3(0., 0., 0.);\r\n`,e.compilationString+="#endif\r\n",e.compilationString+="#ifdef TANGENT\r\n",e.compilationString+=`${this._declareOutput(a,e)} = ${n.associatedVariableName};\r\n`,e.compilationString+="#else\r\n",e.compilationString+=`${this._declareOutput(a,e)} = vec4(0., 0., 0., 0.);\r\n`,e.compilationString+="#endif\r\n",e.compilationString+="#ifdef UV1\r\n",e.compilationString+=`${this._declareOutput(l,e)} = ${s.associatedVariableName};\r\n`,e.compilationString+="#else\r\n",e.compilationString+=`${this._declareOutput(l,e)} = vec2(0., 0.);\r\n`,e.compilationString+="#endif\r\n",this._repeatableContentAnchor=e._repeatableContentAnchor,e.compilationString+=this._repeatableContentAnchor,this}}(0,l.H)("BABYLON.MorphTargetsBlock",gu);class vu extends du.k{constructor(e){super(e,ru.u.Vertex),this.registerInput("worldPosition",ou.E.Vector4,!1,ru.u.Vertex),this.registerOutput("direction",ou.E.Vector3),this.registerOutput("color",ou.E.Color3),this.registerOutput("intensity",ou.E.Float),this.registerOutput("shadowBias",ou.E.Float),this.registerOutput("shadowNormalBias",ou.E.Float),this.registerOutput("shadowDepthScale",ou.E.Float),this.registerOutput("shadowDepthRange",ou.E.Vector2)}getClassName(){return"LightInformationBlock"}get worldPosition(){return this._inputs[0]}get direction(){return this._outputs[0]}get color(){return this._outputs[1]}get intensity(){return this._outputs[2]}get shadowBias(){return this._outputs[3]}get shadowNormalBias(){return this._outputs[4]}get shadowDepthScale(){return this._outputs[5]}get shadowDepthRange(){return this._outputs[6]}bind(e,t,i){if(!i)return;this.light&&this.light.isDisposed()&&(this.light=null);let n=this.light;const s=t.getScene();if(!n&&s.lights.length&&(n=this.light=s.lights[0],this._forcePrepareDefines=!0),!n||!n.isEnabled)return e.setFloat3(this._lightDataUniformName,0,0,0),void e.setFloat4(this._lightColorUniformName,0,0,0,0);n.transferToNodeMaterialEffect(e,this._lightDataUniformName),e.setColor4(this._lightColorUniformName,n.diffuse,n.intensity);const r=n.getShadowGenerator();if((this.shadowBias.hasEndpoints||this.shadowNormalBias.hasEndpoints||this.shadowDepthScale.hasEndpoints)&&(r?e.setFloat3(this._lightShadowUniformName,r.bias,r.normalBias,r.depthScale):e.setFloat3(this._lightShadowUniformName,0,0,0)),this.shadowDepthRange)if(r&&s.activeCamera){const t=n;e.setFloat2(this._lightShadowExtraUniformName,t.getDepthMinZ(s.activeCamera),t.getDepthMinZ(s.activeCamera)+t.getDepthMaxZ(s.activeCamera))}else e.setFloat2(this._lightShadowExtraUniformName,0,0)}prepareDefines(e,t,i){if(!i._areLightsDirty&&!this._forcePrepareDefines)return;this._forcePrepareDefines=!1;const n=this.light;i.setValue(this._lightTypeDefineName,!!(n&&n instanceof Eh.c),!0)}_buildBlock(e){super._buildBlock(e),e.sharedData.bindableBlocks.push(this),e.sharedData.blocksWithDefines.push(this);const t=this.direction,i=this.color,n=this.intensity,s=this.shadowBias,r=this.shadowNormalBias,o=this.shadowDepthScale,a=this.shadowDepthRange;return this._lightDataUniformName=e._getFreeVariableName("lightData"),this._lightColorUniformName=e._getFreeVariableName("lightColor"),this._lightShadowUniformName=e._getFreeVariableName("shadowData"),this._lightShadowExtraUniformName=e._getFreeVariableName("shadowExtraData"),this._lightTypeDefineName=e._getFreeDefineName("LIGHTPOINTTYPE"),e._emitUniformFromString(this._lightDataUniformName,"vec3"),e._emitUniformFromString(this._lightColorUniformName,"vec4"),e.compilationString+=`#ifdef ${this._lightTypeDefineName}\r\n`,e.compilationString+=this._declareOutput(t,e)+` = normalize(${this.worldPosition.associatedVariableName}.xyz - ${this._lightDataUniformName});\r\n`,e.compilationString+="#else\r\n",e.compilationString+=this._declareOutput(t,e)+` = ${this._lightDataUniformName};\r\n`,e.compilationString+="#endif\r\n",e.compilationString+=this._declareOutput(i,e)+` = ${this._lightColorUniformName}.rgb;\r\n`,e.compilationString+=this._declareOutput(n,e)+` = ${this._lightColorUniformName}.a;\r\n`,(s.hasEndpoints||r.hasEndpoints||o.hasEndpoints)&&(e._emitUniformFromString(this._lightShadowUniformName,"vec3"),s.hasEndpoints&&(e.compilationString+=this._declareOutput(s,e)+` = ${this._lightShadowUniformName}.x;\r\n`),r.hasEndpoints&&(e.compilationString+=this._declareOutput(r,e)+` = ${this._lightShadowUniformName}.y;\r\n`),o.hasEndpoints&&(e.compilationString+=this._declareOutput(o,e)+` = ${this._lightShadowUniformName}.z;\r\n`)),a.hasEndpoints&&(e._emitUniformFromString(this._lightShadowExtraUniformName,"vec2"),e.compilationString+=this._declareOutput(a,e)+` = ${this._lightShadowUniformName};\r\n`),this}serialize(){const e=super.serialize();return this.light&&(e.lightId=this.light.id),e}_deserialize(e,t,i){super._deserialize(e,t,i),e.lightId&&(this.light=t.getLightById(e.lightId))}}(0,l.H)("BABYLON.LightInformationBlock",vu);var yu=i(9709),xu=i(9749);class bu extends du.k{constructor(e){super(e,ru.u.Fragment),this.convertInputToLinearSpace=!0,this.registerInput("color",ou.E.AutoDetect),this.registerOutput("output",ou.E.Color4),this.registerOutput("rgb",ou.E.Color3),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Color4|ou.E.Vector3|ou.E.Vector4)}getClassName(){return"ImageProcessingBlock"}get color(){return this._inputs[0]}get output(){return this._outputs[0]}get rgb(){return this._outputs[1]}initialize(e){e._excludeVariableName("exposureLinear"),e._excludeVariableName("contrast"),e._excludeVariableName("vInverseScreenSize"),e._excludeVariableName("vignetteSettings1"),e._excludeVariableName("vignetteSettings2"),e._excludeVariableName("vCameraColorCurveNegative"),e._excludeVariableName("vCameraColorCurveNeutral"),e._excludeVariableName("vCameraColorCurvePositive"),e._excludeVariableName("txColorTransform"),e._excludeVariableName("colorTransformSettings"),e._excludeVariableName("ditherIntensity")}isReady(e,t,i){return!(i._areImageProcessingDirty&&t.imageProcessingConfiguration&&!t.imageProcessingConfiguration.isReady())}prepareDefines(e,t,i){i._areImageProcessingDirty&&t.imageProcessingConfiguration&&t.imageProcessingConfiguration.prepareDefines(i)}bind(e,t,i){i&&t.imageProcessingConfiguration&&t.imageProcessingConfiguration.bind(e)}_buildBlock(e){var t;super._buildBlock(e),e.sharedData.blocksWithDefines.push(this),e.sharedData.blockingBlocks.push(this),e.sharedData.bindableBlocks.push(this),e.uniforms.push("exposureLinear"),e.uniforms.push("contrast"),e.uniforms.push("vInverseScreenSize"),e.uniforms.push("vignetteSettings1"),e.uniforms.push("vignetteSettings2"),e.uniforms.push("vCameraColorCurveNegative"),e.uniforms.push("vCameraColorCurveNeutral"),e.uniforms.push("vCameraColorCurvePositive"),e.uniforms.push("txColorTransform"),e.uniforms.push("colorTransformSettings"),e.uniforms.push("ditherIntensity");const i=this.color,n=this._outputs[0],s=`//${this.name}`;return e._emitFunctionFromInclude("helperFunctions",s),e._emitFunctionFromInclude("imageProcessingDeclaration",s),e._emitFunctionFromInclude("imageProcessingFunctions",s),(null===(t=i.connectedPoint)||void 0===t?void 0:t.isConnected)&&(i.connectedPoint.type===ou.E.Color4||i.connectedPoint.type===ou.E.Vector4?e.compilationString+=`${this._declareOutput(n,e)} = ${i.associatedVariableName};\r\n`:e.compilationString+=`${this._declareOutput(n,e)} = vec4(${i.associatedVariableName}, 1.0);\r\n`,e.compilationString+="#ifdef IMAGEPROCESSINGPOSTPROCESS\r\n",this.convertInputToLinearSpace&&(e.compilationString+=`${n.associatedVariableName}.rgb = toLinearSpace(${i.associatedVariableName}.rgb);\r\n`),e.compilationString+="#else\r\n",e.compilationString+="#ifdef IMAGEPROCESSING\r\n",this.convertInputToLinearSpace&&(e.compilationString+=`${n.associatedVariableName}.rgb = toLinearSpace(${i.associatedVariableName}.rgb);\r\n`),e.compilationString+=`${n.associatedVariableName} = applyImageProcessing(${n.associatedVariableName});\r\n`,e.compilationString+="#endif\r\n",e.compilationString+="#endif\r\n",this.rgb.hasEndpoints&&(e.compilationString+=this._declareOutput(this.rgb,e)+` = ${this.output.associatedVariableName}.xyz;\r\n`)),this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.convertInputToLinearSpace = ${this.convertInputToLinearSpace};\r\n`,e}serialize(){const e=super.serialize();return e.convertInputToLinearSpace=this.convertInputToLinearSpace,e}_deserialize(e,t,i){var n;super._deserialize(e,t,i),this.convertInputToLinearSpace=null===(n=e.convertInputToLinearSpace)||void 0===n||n}}(0,be.gn)([(0,xu.p)("Convert input to linear space",xu.U.Boolean,"ADVANCED")],bu.prototype,"convertInputToLinearSpace",void 0),(0,l.H)("BABYLON.ImageProcessingBlock",bu);class Tu extends du.k{constructor(e){super(e,ru.u.Fragment,!0),this.registerInput("normal",ou.E.AutoDetect,!1),this.normal.addExcludedConnectionPointFromAllowedTypes(ou.E.Color4|ou.E.Vector4|ou.E.Vector3),this.registerInput("tangent",ou.E.Vector4,!1),this.registerInput("world",ou.E.Matrix,!1),this.registerOutput("TBN",ou.E.Object,ru.u.Fragment,new uu("TBN",this,cu.Ab.Output,Tu,"TBNBlock")),this.registerOutput("row0",ou.E.Vector3,ru.u.Fragment),this.registerOutput("row1",ou.E.Vector3,ru.u.Fragment),this.registerOutput("row2",ou.E.Vector3,ru.u.Fragment)}getClassName(){return"TBNBlock"}initialize(e){e._excludeVariableName("tbnNormal"),e._excludeVariableName("tbnTangent"),e._excludeVariableName("tbnBitangent"),e._excludeVariableName("TBN")}get normal(){return this._inputs[0]}get tangent(){return this._inputs[1]}get world(){return this._inputs[2]}get TBN(){return this._outputs[0]}get row0(){return this._outputs[1]}get row1(){return this._outputs[2]}get row2(){return this._outputs[3]}get target(){return ru.u.Fragment}set target(e){}autoConfigure(e){if(!this.world.isConnected){let t=e.getInputBlockByPredicate((e=>e.isSystemValue&&e.systemValue===lu.$.World));t||(t=new fu.S("world"),t.setAsSystemValue(lu.$.World)),t.output.connectTo(this.world)}if(!this.normal.isConnected){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"normal"===e.name));t||(t=new fu.S("normal"),t.setAsAttribute("normal")),t.output.connectTo(this.normal)}if(!this.tangent.isConnected){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"tangent"===e.name&&e.type===ou.E.Vector4));t||(t=new fu.S("tangent"),t.setAsAttribute("tangent")),t.output.connectTo(this.tangent)}}prepareDefines(e,t,i){var n,s,r,o;const a=this.normal,l=this.tangent;let h=a.isConnected;(null===(n=a.connectInputBlock)||void 0===n?void 0:n.isAttribute)&&!e.isVerticesDataPresent(null===(s=a.connectInputBlock)||void 0===s?void 0:s.name)&&(h=!1);let c=l.isConnected;(null===(r=l.connectInputBlock)||void 0===r?void 0:r.isAttribute)&&!e.isVerticesDataPresent(null===(o=l.connectInputBlock)||void 0===o?void 0:o.name)&&(c=!1);const u=h&&c;i.setValue("TBNBLOCK",u,!0)}_buildBlock(e){super._buildBlock(e);const t=this.normal,i=this.tangent,n=this.world,s=this.TBN,r=this.row0,o=this.row1,a=this.row2;return e.target===ru.u.Fragment&&(e.compilationString+=`\n                // ${this.name}\n                vec3 tbnNormal = normalize(${t.associatedVariableName}).xyz;\n                vec3 tbnTangent = normalize(${i.associatedVariableName}.xyz);\n                vec3 tbnBitangent = cross(tbnNormal, tbnTangent) * ${i.associatedVariableName}.w;\n                mat3 ${s.associatedVariableName} = mat3(${n.associatedVariableName}) * mat3(tbnTangent, tbnBitangent, tbnNormal);\n            `,r.hasEndpoints&&(e.compilationString+=this._declareOutput(r,e)+` = vec3(${s.associatedVariableName}[0][0], ${s.associatedVariableName}[0][1], ${s.associatedVariableName}[0][2]);\r\n`),o.hasEndpoints&&(e.compilationString+=this._declareOutput(o,e)+` = vec3(${s.associatedVariableName}[1[0], ${s.associatedVariableName}[1][1], ${s.associatedVariableName}[1][2]);\r\n`),a.hasEndpoints&&(e.compilationString+=this._declareOutput(a,e)+` = vec3(${s.associatedVariableName}[2][0], ${s.associatedVariableName}[2][1], ${s.associatedVariableName}[2][2]);\r\n`),e.sharedData.blocksWithDefines.push(this)),this}}(0,l.H)("BABYLON.TBNBlock",Tu),i(8882),i(7441),i(2321);class Su extends du.k{constructor(e){super(e,ru.u.Fragment),this._tangentSpaceParameterName="",this._tangentCorrectionFactorName="",this._worldMatrixName="",this.invertX=!1,this.invertY=!1,this.useParallaxOcclusion=!1,this.useObjectSpaceNormalMap=!1,this._isUnique=!0,this.registerInput("worldPosition",ou.E.Vector4,!1),this.registerInput("worldNormal",ou.E.Vector4,!1),this.registerInput("worldTangent",ou.E.Vector4,!0),this.registerInput("uv",ou.E.Vector2,!1),this.registerInput("normalMapColor",ou.E.Color3,!1),this.registerInput("strength",ou.E.Float,!1),this.registerInput("viewDirection",ou.E.Vector3,!0),this.registerInput("parallaxScale",ou.E.Float,!0),this.registerInput("parallaxHeight",ou.E.Float,!0),this.registerInput("TBN",ou.E.Object,!0,ru.u.VertexAndFragment,new uu("TBN",this,cu.Ab.Input,Tu,"TBNBlock")),this.registerInput("world",ou.E.Matrix,!0),this.registerOutput("output",ou.E.Vector4),this.registerOutput("uvOffset",ou.E.Vector2)}getClassName(){return"PerturbNormalBlock"}get worldPosition(){return this._inputs[0]}get worldNormal(){return this._inputs[1]}get worldTangent(){return this._inputs[2]}get uv(){return this._inputs[3]}get normalMapColor(){return this._inputs[4]}get strength(){return this._inputs[5]}get viewDirection(){return this._inputs[6]}get parallaxScale(){return this._inputs[7]}get parallaxHeight(){return this._inputs[8]}get TBN(){return this._inputs[9]}get world(){return this._inputs[10]}get output(){return this._outputs[0]}get uvOffset(){return this._outputs[1]}prepareDefines(e,t,i){const n=this.normalMapColor.connectedPoint._ownerBlock.samplerName,s=this.viewDirection.isConnected&&(this.useParallaxOcclusion&&n||!this.useParallaxOcclusion&&this.parallaxHeight.isConnected);i.setValue("BUMP",!0),i.setValue("PARALLAX",s,!0),i.setValue("PARALLAXOCCLUSION",this.useParallaxOcclusion,!0),i.setValue("OBJECTSPACE_NORMALMAP",this.useObjectSpaceNormalMap,!0)}bind(e,t,i){t.getScene()._mirroredCameraPosition?e.setFloat2(this._tangentSpaceParameterName,this.invertX?1:-1,this.invertY?1:-1):e.setFloat2(this._tangentSpaceParameterName,this.invertX?-1:1,this.invertY?-1:1),i&&(e.setFloat(this._tangentCorrectionFactorName,i.getWorldMatrix().determinant()<0?-1:1),this.useObjectSpaceNormalMap&&!this.world.isConnected&&e.setMatrix(this._worldMatrixName,i.getWorldMatrix()))}autoConfigure(e){if(!this.uv.isConnected){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"uv"===e.name));t||(t=new fu.S("uv"),t.setAsAttribute()),t.output.connectTo(this.uv)}if(!this.strength.isConnected){const e=new fu.S("strength");e.value=1,e.output.connectTo(this.strength)}}_buildBlock(e){super._buildBlock(e);const t=`//${this.name}`,i=this.uv,n=this.worldPosition,s=this.worldNormal,r=this.worldTangent;e.sharedData.blocksWithDefines.push(this),e.sharedData.bindableBlocks.push(this),this._tangentSpaceParameterName=e._getFreeDefineName("tangentSpaceParameter"),e._emitUniformFromString(this._tangentSpaceParameterName,"vec2"),this._tangentCorrectionFactorName=e._getFreeDefineName("tangentCorrectionFactor"),e._emitUniformFromString(this._tangentCorrectionFactorName,"float"),this._worldMatrixName=e._getFreeDefineName("perturbNormalWorldMatrix"),e._emitUniformFromString(this._worldMatrixName,"mat4");let o=null;this.normalMapColor.connectedPoint&&(o=this.normalMapColor.connectedPoint._ownerBlock.samplerName);const a=this.viewDirection.isConnected&&(this.useParallaxOcclusion&&o||!this.useParallaxOcclusion&&this.parallaxHeight.isConnected),l=this.parallaxScale.isConnectedToInputBlock?this.parallaxScale.connectInputBlock.isConstant?e._emitFloat(this.parallaxScale.connectInputBlock.value):this.parallaxScale.associatedVariableName:"0.05",h=this.strength.isConnectedToInputBlock&&this.strength.connectInputBlock.isConstant?`\r\n#if !defined(NORMALXYSCALE)\r\n1.0/\r\n#endif\r\n${e._emitFloat(this.strength.connectInputBlock.value)}`:`\r\n#if !defined(NORMALXYSCALE)\r\n1.0/\r\n#endif\r\n${this.strength.associatedVariableName}`;e._emitExtension("derivatives","#extension GL_OES_standard_derivatives : enable");const c={search:/defined\(TANGENT\)/g,replace:r.isConnected?"defined(TANGENT)":"defined(IGNORE)"},u=this.TBN;u.isConnected?e.compilationString+=`\n            #ifdef TBNBLOCK\n            mat3 vTBN = ${u.associatedVariableName};\n            #endif\n            `:r.isConnected&&(e.compilationString+=`vec3 tbnNormal = normalize(${s.associatedVariableName}.xyz);\r\n`,e.compilationString+=`vec3 tbnTangent = normalize(${r.associatedVariableName}.xyz);\r\n`,e.compilationString+=`vec3 tbnBitangent = cross(tbnNormal, tbnTangent) * ${this._tangentCorrectionFactorName};\r\n`,e.compilationString+="mat3 vTBN = mat3(tbnTangent, tbnBitangent, tbnNormal);\r\n"),e._emitFunctionFromInclude("bumpFragmentMainFunctions",t,{replaceStrings:[c,{search:/varying mat3 vTBN/g,replace:""},{search:/uniform mat4 normalMatrix;/g,replace:""}]}),e._emitFunctionFromInclude("bumpFragmentFunctions",t,{replaceStrings:[{search:/#include<samplerFragmentDeclaration>\(_DEFINENAME_,BUMP,_VARYINGNAME_,Bump,_SAMPLERNAME_,bump\)/g,replace:""},{search:/uniform sampler2D bumpSampler;/g,replace:""},{search:/vec2 parallaxOcclusion\(vec3 vViewDirCoT,vec3 vNormalCoT,vec2 texCoord,float parallaxScale\)/g,replace:"#define inline\r\nvec2 parallaxOcclusion(vec3 vViewDirCoT, vec3 vNormalCoT, vec2 texCoord, float parallaxScale, sampler2D bumpSampler)"},{search:/vec2 parallaxOffset\(vec3 viewDir,float heightScale\)/g,replace:"vec2 parallaxOffset(vec3 viewDir, float heightScale, float height_)"},{search:/texture2D\(bumpSampler,vBumpUV\)\.w/g,replace:"height_"}]});const d=a&&o?`texture2D(${o}, ${i.associatedVariableName} + uvOffset).xyz`:this.normalMapColor.associatedVariableName;return e.compilationString+=this._declareOutput(this.output,e)+" = vec4(0.);\r\n",e.compilationString+=e._emitCodeFromInclude("bumpFragment",t,{replaceStrings:[{search:/texture2D\(bumpSampler,vBumpUV\)/g,replace:`${d}`},{search:/#define CUSTOM_FRAGMENT_BUMP_FRAGMENT/g,replace:`mat4 normalMatrix = toNormalMatrix(${this.world.isConnected?this.world.associatedVariableName:this._worldMatrixName});`},{search:/perturbNormal\(TBN,texture2D\(bumpSampler,vBumpUV\+uvOffset\).xyz,vBumpInfos.y\)/g,replace:`perturbNormal(TBN, ${d}, vBumpInfos.y)`},{search:/parallaxOcclusion\(invTBN\*-viewDirectionW,invTBN\*normalW,vBumpUV,vBumpInfos.z\)/g,replace:`parallaxOcclusion((invTBN * -viewDirectionW), (invTBN * normalW), vBumpUV, vBumpInfos.z, ${a&&this.useParallaxOcclusion?o:"bumpSampler"})`},{search:/parallaxOffset\(invTBN\*viewDirectionW,vBumpInfos\.z\)/g,replace:`parallaxOffset(invTBN * viewDirectionW, vBumpInfos.z, ${a?this.parallaxHeight.associatedVariableName:"0."})`},{search:/vTangentSpaceParams/g,replace:this._tangentSpaceParameterName},{search:/vBumpInfos.y/g,replace:h},{search:/vBumpInfos.z/g,replace:l},{search:/vBumpUV/g,replace:i.associatedVariableName},{search:/vPositionW/g,replace:n.associatedVariableName+".xyz"},{search:/normalW=/g,replace:this.output.associatedVariableName+".xyz = "},{search:/mat3\(normalMatrix\)\*normalW/g,replace:"mat3(normalMatrix) * "+this.output.associatedVariableName+".xyz"},{search:/normalW/g,replace:s.associatedVariableName+".xyz"},{search:/viewDirectionW/g,replace:a?this.viewDirection.associatedVariableName:"vec3(0.)"},c]}),this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode()+`${this._codeVariableName}.invertX = ${this.invertX};\r\n`;return e+=`${this._codeVariableName}.invertY = ${this.invertY};\r\n`,e+=`${this._codeVariableName}.useParallaxOcclusion = ${this.useParallaxOcclusion};\r\n`,e+=`${this._codeVariableName}.useObjectSpaceNormalMap = ${this.useObjectSpaceNormalMap};\r\n`,e}serialize(){const e=super.serialize();return e.invertX=this.invertX,e.invertY=this.invertY,e.useParallaxOcclusion=this.useParallaxOcclusion,e.useObjectSpaceNormalMap=this.useObjectSpaceNormalMap,e}_deserialize(e,t,i){super._deserialize(e,t,i),this.invertX=e.invertX,this.invertY=e.invertY,this.useParallaxOcclusion=!!e.useParallaxOcclusion,this.useObjectSpaceNormalMap=!!e.useObjectSpaceNormalMap}}(0,be.gn)([(0,xu.p)("Invert X axis",xu.U.Boolean,"PROPERTIES",{notifiers:{update:!1}})],Su.prototype,"invertX",void 0),(0,be.gn)([(0,xu.p)("Invert Y axis",xu.U.Boolean,"PROPERTIES",{notifiers:{update:!1}})],Su.prototype,"invertY",void 0),(0,be.gn)([(0,xu.p)("Use parallax occlusion",xu.U.Boolean)],Su.prototype,"useParallaxOcclusion",void 0),(0,be.gn)([(0,xu.p)("Object Space Mode",xu.U.Boolean,"PROPERTIES",{notifiers:{update:!1}})],Su.prototype,"useObjectSpaceNormalMap",void 0),(0,l.H)("BABYLON.PerturbNormalBlock",Su);class Eu extends du.k{constructor(e){super(e,ru.u.Fragment,!0),this.registerInput("value",ou.E.Float,!0),this.registerInput("cutoff",ou.E.Float,!0)}getClassName(){return"DiscardBlock"}get value(){return this._inputs[0]}get cutoff(){return this._inputs[1]}_buildBlock(e){if(super._buildBlock(e),e.sharedData.hints.needAlphaTesting=!0,this.cutoff.isConnected&&this.value.isConnected)return e.compilationString+=`if (${this.value.associatedVariableName} < ${this.cutoff.associatedVariableName}) discard;\r\n`,this}}(0,l.H)("BABYLON.DiscardBlock",Eu);class Cu extends du.k{constructor(e){super(e,ru.u.Fragment),this.registerOutput("output",ou.E.Float,ru.u.Fragment)}getClassName(){return"FrontFacingBlock"}get output(){return this._outputs[0]}_buildBlock(e){if(super._buildBlock(e),e.target===ru.u.Vertex)throw"FrontFacingBlock must only be used in a fragment shader";const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+" = gl_FrontFacing ? 1.0 : 0.0;\r\n",this}}(0,l.H)("BABYLON.FrontFacingBlock",Cu);class Au extends du.k{constructor(e){super(e,ru.u.Fragment),this.registerInput("input",ou.E.AutoDetect,!1),this.registerOutput("dx",ou.E.BasedOnInput),this.registerOutput("dy",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._outputs[1]._typeConnectionSource=this._inputs[0]}getClassName(){return"DerivativeBlock"}get input(){return this._inputs[0]}get dx(){return this._outputs[0]}get dy(){return this._outputs[1]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0],i=this._outputs[1];return e._emitExtension("derivatives","#extension GL_OES_standard_derivatives : enable"),t.hasEndpoints&&(e.compilationString+=this._declareOutput(t,e)+` = dFdx(${this.input.associatedVariableName});\r\n`),i.hasEndpoints&&(e.compilationString+=this._declareOutput(i,e)+` = dFdy(${this.input.associatedVariableName});\r\n`),this}}(0,l.H)("BABYLON.DerivativeBlock",Au);class Pu extends du.k{constructor(e){super(e,ru.u.Fragment),this.registerOutput("xy",ou.E.Vector2,ru.u.Fragment),this.registerOutput("xyz",ou.E.Vector3,ru.u.Fragment),this.registerOutput("xyzw",ou.E.Vector4,ru.u.Fragment),this.registerOutput("x",ou.E.Float,ru.u.Fragment),this.registerOutput("y",ou.E.Float,ru.u.Fragment),this.registerOutput("z",ou.E.Float,ru.u.Fragment),this.registerOutput("w",ou.E.Float,ru.u.Fragment)}getClassName(){return"FragCoordBlock"}get xy(){return this._outputs[0]}get xyz(){return this._outputs[1]}get xyzw(){return this._outputs[2]}get x(){return this._outputs[3]}get y(){return this._outputs[4]}get z(){return this._outputs[5]}get output(){return this._outputs[6]}writeOutputs(e){let t="";for(const i of this._outputs)i.hasEndpoints&&(t+=`${this._declareOutput(i,e)} = gl_FragCoord.${i.name};\r\n`);return t}_buildBlock(e){if(super._buildBlock(e),e.target===ru.u.Vertex)throw"FragCoordBlock must only be used in a fragment shader";return e.compilationString+=this.writeOutputs(e),this}}(0,l.H)("BABYLON.FragCoordBlock",Pu);class Ru extends du.k{constructor(e){super(e,ru.u.Fragment),this.registerOutput("xy",ou.E.Vector2,ru.u.Fragment),this.registerOutput("x",ou.E.Float,ru.u.Fragment),this.registerOutput("y",ou.E.Float,ru.u.Fragment)}getClassName(){return"ScreenSizeBlock"}get xy(){return this._outputs[0]}get x(){return this._outputs[1]}get y(){return this._outputs[2]}bind(e){const t=this._scene.getEngine();e.setFloat2(this._varName,t.getRenderWidth(),t.getRenderHeight())}writeOutputs(e,t){let i="";for(const n of this._outputs)n.hasEndpoints&&(i+=`${this._declareOutput(n,e)} = ${t}.${n.name};\r\n`);return i}_buildBlock(e){if(super._buildBlock(e),this._scene=e.sharedData.scene,e.target===ru.u.Vertex)throw"ScreenSizeBlock must only be used in a fragment shader";return e.sharedData.bindableBlocks.push(this),this._varName=e._getFreeVariableName("screenSize"),e._emitUniformFromString(this._varName,"vec2"),e.compilationString+=this.writeOutputs(e,this._varName),this}}(0,l.H)("BABYLON.ScreenSizeBlock",Ru);class Mu extends du.k{constructor(e){super(e,ru.u.Fragment),this.registerInput("vector",ou.E.AutoDetect),this.registerInput("worldViewProjection",ou.E.Matrix),this.registerOutput("output",ou.E.Vector2),this.registerOutput("x",ou.E.Float),this.registerOutput("y",ou.E.Float),this.inputs[0].addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Vector3|ou.E.Vector4)}getClassName(){return"ScreenSpaceBlock"}get vector(){return this._inputs[0]}get worldViewProjection(){return this._inputs[1]}get output(){return this._outputs[0]}get x(){return this._outputs[1]}get y(){return this._outputs[2]}autoConfigure(e){if(!this.worldViewProjection.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.WorldViewProjection));t||(t=new fu.S("worldViewProjection"),t.setAsSystemValue(lu.$.WorldViewProjection)),t.output.connectTo(this.worldViewProjection)}}_buildBlock(e){super._buildBlock(e);const t=this.vector,i=this.worldViewProjection;if(!t.connectedPoint)return;const n=i.associatedVariableName,s=e._getFreeVariableName("screenSpaceTemp");switch(t.connectedPoint.type){case ou.E.Vector3:e.compilationString+=`vec4 ${s} = ${n} * vec4(${t.associatedVariableName}, 1.0);\r\n`;break;case ou.E.Vector4:e.compilationString+=`vec4 ${s} = ${n} * ${t.associatedVariableName};\r\n`}return e.compilationString+=`${s}.xy /= ${s}.w;`,e.compilationString+=`${s}.xy = ${s}.xy * 0.5 + vec2(0.5, 0.5);`,this.output.hasEndpoints&&(e.compilationString+=this._declareOutput(this.output,e)+` = ${s}.xy;\r\n`),this.x.hasEndpoints&&(e.compilationString+=this._declareOutput(this.x,e)+` = ${s}.x;\r\n`),this.y.hasEndpoints&&(e.compilationString+=this._declareOutput(this.y,e)+` = ${s}.y;\r\n`),this}}(0,l.H)("BABYLON.ScreenSpaceBlock",Mu);class Iu extends du.k{constructor(e){super(e,ru.u.Fragment),this.registerInput("input",ou.E.Vector2),this.registerInput("strength",ou.E.Float),this.registerInput("center",ou.E.Vector2),this.registerInput("offset",ou.E.Vector2),this.registerOutput("output",ou.E.Vector2),this.registerOutput("x",ou.E.Float),this.registerOutput("y",ou.E.Float)}getClassName(){return"TwirlBlock"}get input(){return this._inputs[0]}get strength(){return this._inputs[1]}get center(){return this._inputs[2]}get offset(){return this._inputs[3]}get output(){return this._outputs[0]}get x(){return this._outputs[1]}get y(){return this._outputs[2]}autoConfigure(){if(!this.center.isConnected){const e=new fu.S("center");e.value=new o.FM(.5,.5),e.output.connectTo(this.center)}if(!this.strength.isConnected){const e=new fu.S("strength");e.value=1,e.output.connectTo(this.strength)}if(!this.offset.isConnected){const e=new fu.S("offset");e.value=new o.FM(0,0),e.output.connectTo(this.offset)}}_buildBlock(e){super._buildBlock(e);const t=e._getFreeVariableName("delta"),i=e._getFreeVariableName("angle"),n=e._getFreeVariableName("x"),s=e._getFreeVariableName("y"),r=e._getFreeVariableName("result");return e.compilationString+=`\n            vec2 ${t} = ${this.input.associatedVariableName} - ${this.center.associatedVariableName};\n            float ${i} = ${this.strength.associatedVariableName} * length(${t});\n            float ${n} = cos(${i}) * ${t}.x - sin(${i}) * ${t}.y;\n            float ${s} = sin(${i}) * ${t}.x + cos(${i}) * ${t}.y;\n            vec2 ${r} = vec2(${n} + ${this.center.associatedVariableName}.x + ${this.offset.associatedVariableName}.x, ${s} + ${this.center.associatedVariableName}.y + ${this.offset.associatedVariableName}.y);\n        `,this.output.hasEndpoints&&(e.compilationString+=this._declareOutput(this.output,e)+` = ${r};\r\n`),this.x.hasEndpoints&&(e.compilationString+=this._declareOutput(this.x,e)+` = ${r}.x;\r\n`),this.y.hasEndpoints&&(e.compilationString+=this._declareOutput(this.y,e)+` = ${r}.y;\r\n`),this}}(0,l.H)("BABYLON.TwirlBlock",Iu);class Du extends du.k{constructor(e){super(e,ru.u.Fragment),this.generateInWorldSpace=!1,this.automaticNormalizationNormal=!0,this.automaticNormalizationTangent=!0,this.registerInput("input",ou.E.Float),this.registerInput("worldPosition",ou.E.Vector3),this.registerInput("worldNormal",ou.E.Vector3),this.registerInput("worldTangent",ou.E.AutoDetect,!0),this.registerOutput("output",ou.E.Vector4),this.registerOutput("xyz",ou.E.Vector3),this._inputs[3].addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Vector3|ou.E.Vector4)}getClassName(){return"HeightToNormalBlock"}get input(){return this._inputs[0]}get worldPosition(){return this._inputs[1]}get worldNormal(){return this._inputs[2]}get worldTangent(){return this._inputs[3]}get output(){return this._outputs[0]}get xyz(){return this._outputs[1]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];this.generateInWorldSpace||this.worldTangent.isConnected||console.error(`You must connect the 'worldTangent' input of the ${this.name} block!`);const i=this.generateInWorldSpace?"":"\n            vec3 biTangent = cross(normal, tangent);\n            mat3 TBN = mat3(tangent, biTangent, normal);\n            ",n=this.generateInWorldSpace?"":"\n            result = TBN * result;\n            result = result * vec3(0.5) + vec3(0.5);\n            ",s=`\n            vec4 heightToNormal(in float height, in vec3 position, in vec3 tangent, in vec3 normal) {\n                ${i}\n                ${this.automaticNormalizationTangent?"tangent = normalize(tangent);":""}\n                ${this.automaticNormalizationNormal?"normal = normalize(normal);":""}\n                vec3 worlddX = dFdx(position);\n                vec3 worlddY = dFdy(position);\n                vec3 crossX = cross(normal, worlddX);\n                vec3 crossY = cross(normal, worlddY);\n                float d = abs(dot(crossY, worlddX));\n                vec3 inToNormal = vec3(((((height + dFdx(height)) - height) * crossY) + (((height + dFdy(height)) - height) * crossX)) * sign(d));\n                inToNormal.y *= -1.0;\n                vec3 result = normalize((d * normal) - inToNormal);\n                ${n}\n                return vec4(result, 0.);\n            }`;return e._emitExtension("derivatives","#extension GL_OES_standard_derivatives : enable"),e._emitFunction("heightToNormal",s,"// heightToNormal"),e.compilationString+=this._declareOutput(t,e)+` = heightToNormal(${this.input.associatedVariableName}, ${this.worldPosition.associatedVariableName}, ${this.worldTangent.isConnected?this.worldTangent.associatedVariableName:"vec3(0.)"}.xyz, ${this.worldNormal.associatedVariableName});\r\n`,this.xyz.hasEndpoints&&(e.compilationString+=this._declareOutput(this.xyz,e)+` = ${this.output.associatedVariableName}.xyz;\r\n`),this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.generateInWorldSpace = ${this.generateInWorldSpace};\r\n`,e+=`${this._codeVariableName}.automaticNormalizationNormal = ${this.automaticNormalizationNormal};\r\n`,e+=`${this._codeVariableName}.automaticNormalizationTangent = ${this.automaticNormalizationTangent};\r\n`,e}serialize(){const e=super.serialize();return e.generateInWorldSpace=this.generateInWorldSpace,e.automaticNormalizationNormal=this.automaticNormalizationNormal,e.automaticNormalizationTangent=this.automaticNormalizationTangent,e}_deserialize(e,t,i){super._deserialize(e,t,i),this.generateInWorldSpace=e.generateInWorldSpace,this.automaticNormalizationNormal=e.automaticNormalizationNormal,this.automaticNormalizationTangent=e.automaticNormalizationTangent}}(0,be.gn)([(0,xu.p)("Generate in world space instead of tangent space",xu.U.Boolean,"PROPERTIES",{notifiers:{update:!0}})],Du.prototype,"generateInWorldSpace",void 0),(0,be.gn)([(0,xu.p)("Force normalization for the worldNormal input",xu.U.Boolean,"PROPERTIES",{notifiers:{update:!0}})],Du.prototype,"automaticNormalizationNormal",void 0),(0,be.gn)([(0,xu.p)("Force normalization for the worldTangent input",xu.U.Boolean,"PROPERTIES",{notifiers:{update:!0}})],Du.prototype,"automaticNormalizationTangent",void 0),(0,l.H)("BABYLON.HeightToNormalBlock",Du);class Ou extends du.k{constructor(e){super(e,ru.u.Fragment,!0),this.registerInput("depth",ou.E.Float,!0),this.registerInput("worldPos",ou.E.Vector4,!0),this.registerInput("viewProjection",ou.E.Matrix,!0)}getClassName(){return"FragDepthBlock"}get depth(){return this._inputs[0]}get worldPos(){return this._inputs[1]}get viewProjection(){return this._inputs[2]}_buildBlock(e){return super._buildBlock(e),this.depth.isConnected?e.compilationString+=`gl_FragDepth = ${this.depth.associatedVariableName};\r\n`:this.worldPos.isConnected&&this.viewProjection.isConnected?e.compilationString+=`\n                vec4 p = ${this.viewProjection.associatedVariableName} * ${this.worldPos.associatedVariableName};\n                float v = p.z / p.w;\n                #ifndef IS_NDC_HALF_ZRANGE\n                    v = v * 0.5 + 0.5;\n                #endif\n                gl_FragDepth = v;\n    \n            `:console.warn("FragDepthBlock: either the depth input or both the worldPos and viewProjection inputs must be connected!"),this}}(0,l.H)("BABYLON.FragDepthBlock",Ou);class wu extends du.k{constructor(e){super(e,ru.u.Fragment),this.registerInput("worldPosition",ou.E.Vector4,!1),this.registerInput("viewProjection",ou.E.Matrix,!1),this.registerInput("worldNormal",ou.E.AutoDetect,!0),this.registerOutput("depth",ou.E.Vector3),this.worldNormal.addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Vector3|ou.E.Vector4)}getClassName(){return"ShadowMapBlock"}initialize(e){e._excludeVariableName("vPositionWSM"),e._excludeVariableName("lightDataSM"),e._excludeVariableName("biasAndScaleSM"),e._excludeVariableName("depthValuesSM"),e._excludeVariableName("clipPos"),e._excludeVariableName("worldPos"),e._excludeVariableName("zSM")}get worldPosition(){return this._inputs[0]}get viewProjection(){return this._inputs[1]}get worldNormal(){return this._inputs[2]}get depth(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=`//${this.name}`;return e._emitUniformFromString("biasAndScaleSM","vec3"),e._emitUniformFromString("lightDataSM","vec3"),e._emitUniformFromString("depthValuesSM","vec2"),e._emitFunctionFromInclude("packingFunctions",t),e.compilationString+=`vec4 worldPos = ${this.worldPosition.associatedVariableName};\r\n`,e.compilationString+="vec3 vPositionWSM;\r\n",e.compilationString+="float vDepthMetricSM = 0.0;\r\n",e.compilationString+="float zSM;\r\n",this.worldNormal.isConnected&&(e.compilationString+=`vec3 vNormalW = ${this.worldNormal.associatedVariableName}.xyz;\r\n`,e.compilationString+=e._emitCodeFromInclude("shadowMapVertexNormalBias",t)),e.compilationString+=`vec4 clipPos = ${this.viewProjection.associatedVariableName} * worldPos;\r\n`,e.compilationString+=e._emitCodeFromInclude("shadowMapVertexMetric",t,{replaceStrings:[{search:/gl_Position/g,replace:"clipPos"}]}),e.compilationString+=e._emitCodeFromInclude("shadowMapFragment",t,{replaceStrings:[{search:/return;/g,replace:""}]}),e.compilationString+="\n            #if SM_DEPTHTEXTURE == 1\n                #ifdef IS_NDC_HALF_ZRANGE\n                    gl_FragDepth = (clipPos.z / clipPos.w);\n                #else\n                    gl_FragDepth = (clipPos.z / clipPos.w) * 0.5 + 0.5;\n                #endif\n            #endif\n        ",e.compilationString+=`${this._declareOutput(this.depth,e)} = vec3(depthSM, 1., 1.);\r\n`,this}}(0,l.H)("BABYLON.ShadowMapBlock",wu);class Nu extends du.k{constructor(e){super(e,ru.u.VertexAndFragment,!1),this.registerInput("worldPosition",ou.E.Vector4,!1,ru.u.Vertex),this.registerInput("view",ou.E.Matrix,!1,ru.u.Vertex),this.registerInput("input",ou.E.AutoDetect,!1,ru.u.Fragment),this.registerInput("fogColor",ou.E.AutoDetect,!1,ru.u.Fragment),this.registerOutput("output",ou.E.Color3,ru.u.Fragment),this.input.addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Vector3|ou.E.Color4),this.fogColor.addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Vector3|ou.E.Color4)}getClassName(){return"FogBlock"}get worldPosition(){return this._inputs[0]}get view(){return this._inputs[1]}get input(){return this._inputs[2]}get fogColor(){return this._inputs[3]}get output(){return this._outputs[0]}autoConfigure(e){if(!this.view.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.View));t||(t=new fu.S("view"),t.setAsSystemValue(lu.$.View)),t.output.connectTo(this.view)}if(!this.fogColor.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.FogColor));t||(t=new fu.S("fogColor",void 0,ou.E.Color3),t.setAsSystemValue(lu.$.FogColor)),t.output.connectTo(this.fogColor)}}prepareDefines(e,t,i){const n=e.getScene();i.setValue("FOG",t.fogEnabled&&La.G.GetFogState(e,n))}bind(e,t,i){if(!i)return;const n=i.getScene();e.setFloat4(this._fogParameters,n.fogMode,n.fogStart,n.fogEnd,n.fogDensity)}_buildBlock(e){if(super._buildBlock(e),e.target===ru.u.Fragment){e.sharedData.blocksWithDefines.push(this),e.sharedData.bindableBlocks.push(this),e._emitFunctionFromInclude("fogFragmentDeclaration",`//${this.name}`,{removeUniforms:!0,removeVaryings:!0,removeIfDef:!1,replaceStrings:[{search:/float CalcFogFactor\(\)/,replace:"float CalcFogFactor(vec3 vFogDistance, vec4 vFogInfos)"}]});const t=e._getFreeVariableName("fog"),i=this.input,n=this.fogColor;this._fogParameters=e._getFreeVariableName("fogParameters");const s=this._outputs[0];e._emitUniformFromString(this._fogParameters,"vec4"),e.compilationString+="#ifdef FOG\r\n",e.compilationString+=`float ${t} = CalcFogFactor(${this._fogDistanceName}, ${this._fogParameters});\r\n`,e.compilationString+=this._declareOutput(s,e)+` = ${t} * ${i.associatedVariableName}.rgb + (1.0 - ${t}) * ${n.associatedVariableName}.rgb;\r\n`,e.compilationString+=`#else\r\n${this._declareOutput(s,e)} =  ${i.associatedVariableName}.rgb;\r\n`,e.compilationString+="#endif\r\n"}else{const t=this.worldPosition,i=this.view;this._fogDistanceName=e._getFreeVariableName("vFogDistance"),e._emitVaryingFromString(this._fogDistanceName,"vec3"),e.compilationString+=`${this._fogDistanceName} = (${i.associatedVariableName} * ${t.associatedVariableName}).xyz;\r\n`}return this}}(0,l.H)("BABYLON.FogBlock",Nu);class Fu extends du.k{static _OnGenerateOnlyFragmentCodeChanged(e,t){const i=e;return i.worldPosition.isConnected?(i.generateOnlyFragmentCode=!i.generateOnlyFragmentCode,console.error("The worldPosition input must not be connected to be able to switch!"),!1):(i._setTarget(),!0)}_setTarget(){this._setInitialTarget(this.generateOnlyFragmentCode?ru.u.Fragment:ru.u.VertexAndFragment),this.getInputByName("worldPosition").target=this.generateOnlyFragmentCode?ru.u.Fragment:ru.u.Vertex}constructor(e){super(e,ru.u.VertexAndFragment),this._lightId=0,this.generateOnlyFragmentCode=!1,this._isUnique=!0,this.registerInput("worldPosition",ou.E.Vector4,!1,ru.u.Vertex),this.registerInput("worldNormal",ou.E.Vector4,!1,ru.u.Fragment),this.registerInput("cameraPosition",ou.E.Vector3,!1,ru.u.Fragment),this.registerInput("glossiness",ou.E.Float,!0,ru.u.Fragment),this.registerInput("glossPower",ou.E.Float,!0,ru.u.Fragment),this.registerInput("diffuseColor",ou.E.Color3,!0,ru.u.Fragment),this.registerInput("specularColor",ou.E.Color3,!0,ru.u.Fragment),this.registerInput("view",ou.E.Matrix,!0),this.registerOutput("diffuseOutput",ou.E.Color3,ru.u.Fragment),this.registerOutput("specularOutput",ou.E.Color3,ru.u.Fragment),this.registerOutput("shadow",ou.E.Float,ru.u.Fragment)}getClassName(){return"LightBlock"}get worldPosition(){return this._inputs[0]}get worldNormal(){return this._inputs[1]}get cameraPosition(){return this._inputs[2]}get glossiness(){return this._inputs[3]}get glossPower(){return this._inputs[4]}get diffuseColor(){return this._inputs[5]}get specularColor(){return this._inputs[6]}get view(){return this._inputs[7]}get diffuseOutput(){return this._outputs[0]}get specularOutput(){return this._outputs[1]}get shadow(){return this._outputs[2]}autoConfigure(e){if(!this.cameraPosition.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.CameraPosition));t||(t=new fu.S("cameraPosition"),t.setAsSystemValue(lu.$.CameraPosition)),t.output.connectTo(this.cameraPosition)}}prepareDefines(e,t,i){if(!i._areLightsDirty)return;const n=e.getScene();if(this.light){const t={needNormals:!1,needRebuild:!1,lightmapMode:!1,shadowEnabled:!1,specularEnabled:!1};La.G.PrepareDefinesForLight(n,e,this.light,this._lightId,i,!0,t),t.needRebuild&&i.rebuild()}else La.G.PrepareDefinesForLights(n,e,i,!0,t.maxSimultaneousLights)}updateUniformsAndSamples(e,t,i,n){for(let s=0;s<t.maxSimultaneousLights&&i["LIGHT"+s];s++){const t=e.uniforms.indexOf("vLightData"+s)>=0;La.G.PrepareUniformsAndSamplersForLight(s,e.uniforms,e.samplers,i["PROJECTEDLIGHTTEXTURE"+s],n,t)}}bind(e,t,i){if(!i)return;const n=i.getScene();this.light?La.G.BindLight(this.light,this._lightId,n,e,!0):La.G.BindLights(n,i,e,!0,t.maxSimultaneousLights)}_injectVertexCode(e){const t=this.worldPosition,i=`//${this.name}`;this.light?(this._lightId=(void 0!==e.counters.lightCounter?e.counters.lightCounter:-1)+1,e.counters.lightCounter=this._lightId,e._emitFunctionFromInclude(e.supportUniformBuffers?"lightVxUboDeclaration":"lightVxFragmentDeclaration",i,{replaceStrings:[{search:/{X}/g,replace:this._lightId.toString()}]},this._lightId.toString())):(e._emitFunctionFromInclude(e.supportUniformBuffers?"lightVxUboDeclaration":"lightVxFragmentDeclaration",i,{repeatKey:"maxSimultaneousLights"}),this._lightId=0,e.sharedData.dynamicUniformBlocks.push(this));const n="v_"+t.associatedVariableName;e._emitVaryingFromString(n,"vec4")&&(e.compilationString+=`${n} = ${t.associatedVariableName};\r\n`),this.light?e.compilationString+=e._emitCodeFromInclude("shadowsVertex",i,{replaceStrings:[{search:/{X}/g,replace:this._lightId.toString()},{search:/worldPos/g,replace:t.associatedVariableName}]}):(e.compilationString+=`vec4 worldPos = ${t.associatedVariableName};\r\n`,this.view.isConnected&&(e.compilationString+=`mat4 view = ${this.view.associatedVariableName};\r\n`),e.compilationString+=e._emitCodeFromInclude("shadowsVertex",i,{repeatKey:"maxSimultaneousLights"}))}_buildBlock(e){if(super._buildBlock(e),e.target!==ru.u.Fragment)return void this._injectVertexCode(e);this.generateOnlyFragmentCode&&e.sharedData.dynamicUniformBlocks.push(this),e.sharedData.forcedBindableBlocks.push(this),e.sharedData.blocksWithDefines.push(this);const t=`//${this.name}`,i=this.worldPosition;let n=i.associatedVariableName;this.generateOnlyFragmentCode?(n=e._getFreeVariableName("globalWorldPos"),e._emitFunction("light_globalworldpos",`vec3 ${n};\r\n`,t),e.compilationString+=`${n} = ${i.associatedVariableName}.xyz;\r\n`,e.compilationString+=e._emitCodeFromInclude("shadowsVertex",t,{repeatKey:"maxSimultaneousLights",substitutionVars:this.generateOnlyFragmentCode?`worldPos,${i.associatedVariableName}`:void 0})):n="v_"+n+".xyz",e._emitFunctionFromInclude("helperFunctions",t),e._emitFunctionFromInclude("lightsFragmentFunctions",t,{replaceStrings:[{search:/vPositionW/g,replace:n}]}),e._emitFunctionFromInclude("shadowsFragmentFunctions",t,{replaceStrings:[{search:/vPositionW/g,replace:n}]}),this.light?e._emitFunctionFromInclude(e.supportUniformBuffers?"lightUboDeclaration":"lightFragmentDeclaration",t,{replaceStrings:[{search:/{X}/g,replace:this._lightId.toString()}]},this._lightId.toString()):e._emitFunctionFromInclude(e.supportUniformBuffers?"lightUboDeclaration":"lightFragmentDeclaration",t,{repeatKey:"maxSimultaneousLights",substitutionVars:this.generateOnlyFragmentCode?"varying,":void 0}),0===this._lightId&&(e._registerTempVariable("viewDirectionW")&&(e.compilationString+=`vec3 viewDirectionW = normalize(${this.cameraPosition.associatedVariableName} - ${n});\r\n`),e.compilationString+="lightingInfo info;\r\n",e.compilationString+="float shadow = 1.;\r\n",e.compilationString+=`float glossiness = ${this.glossiness.isConnected?this.glossiness.associatedVariableName:"1.0"} * ${this.glossPower.isConnected?this.glossPower.associatedVariableName:"1024.0"};\r\n`,e.compilationString+="vec3 diffuseBase = vec3(0., 0., 0.);\r\n",e.compilationString+="vec3 specularBase = vec3(0., 0., 0.);\r\n",e.compilationString+=`vec3 normalW = ${this.worldNormal.associatedVariableName}.xyz;\r\n`),this.light?e.compilationString+=e._emitCodeFromInclude("lightFragment",t,{replaceStrings:[{search:/{X}/g,replace:this._lightId.toString()}]}):e.compilationString+=e._emitCodeFromInclude("lightFragment",t,{repeatKey:"maxSimultaneousLights"});const s=this.diffuseOutput,r=this.specularOutput;return e.compilationString+=this._declareOutput(s,e)+` = diffuseBase${this.diffuseColor.isConnected?" * "+this.diffuseColor.associatedVariableName:""};\r\n`,r.hasEndpoints&&(e.compilationString+=this._declareOutput(r,e)+` = specularBase${this.specularColor.isConnected?" * "+this.specularColor.associatedVariableName:""};\r\n`),this.shadow.hasEndpoints&&(e.compilationString+=this._declareOutput(this.shadow,e)+" = shadow;\r\n"),this}serialize(){const e=super.serialize();return e.generateOnlyFragmentCode=this.generateOnlyFragmentCode,this.light&&(e.lightId=this.light.id),e}_deserialize(e,t,i){super._deserialize(e,t,i),e.lightId&&(this.light=t.getLightById(e.lightId)),this.generateOnlyFragmentCode=e.generateOnlyFragmentCode,this._setTarget()}}(0,be.gn)([(0,xu.p)("Generate only fragment code",xu.U.Boolean,"ADVANCED",{notifiers:{rebuild:!0,update:!0,onValidation:Fu._OnGenerateOnlyFragmentCodeChanged}})],Fu.prototype,"generateOnlyFragmentCode",void 0),(0,l.H)("BABYLON.LightBlock",Fu);class Lu extends du.k{get texture(){return this._texture}set texture(e){var t;if(this._texture===e)return;const i=null!==(t=null==e?void 0:e.getScene())&&void 0!==t?t:A.l.LastCreatedScene;!e&&i&&i.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this._texture))),this._texture=e,e&&i&&i.markAllMaterialsAsDirty(1,(t=>t.hasTexture(e)))}get samplerName(){return this._samplerName}constructor(e){super(e,ru.u.VertexAndFragment),this.registerOutput("source",ou.E.Object,ru.u.VertexAndFragment,new uu("source",this,cu.Ab.Output,Lu,"ImageSourceBlock"))}bind(e){this.texture&&e.setTexture(this._samplerName,this.texture)}isReady(){return!(this.texture&&!this.texture.isReadyOrNotBlocking())}getClassName(){return"ImageSourceBlock"}get source(){return this._outputs[0]}_buildBlock(e){return super._buildBlock(e),e.target===ru.u.Vertex&&(this._samplerName=e._getFreeVariableName(this.name+"Sampler"),e.sharedData.blockingBlocks.push(this),e.sharedData.textureBlocks.push(this),e.sharedData.bindableBlocks.push(this)),e._emit2DSampler(this._samplerName),this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return this.texture?(e+=`${this._codeVariableName}.texture = new BABYLON.Texture("${this.texture.name}", null, ${this.texture.noMipmap}, ${this.texture.invertY}, ${this.texture.samplingMode});\r\n`,e+=`${this._codeVariableName}.texture.wrapU = ${this.texture.wrapU};\r\n`,e+=`${this._codeVariableName}.texture.wrapV = ${this.texture.wrapV};\r\n`,e+=`${this._codeVariableName}.texture.uAng = ${this.texture.uAng};\r\n`,e+=`${this._codeVariableName}.texture.vAng = ${this.texture.vAng};\r\n`,e+=`${this._codeVariableName}.texture.wAng = ${this.texture.wAng};\r\n`,e+=`${this._codeVariableName}.texture.uOffset = ${this.texture.uOffset};\r\n`,e+=`${this._codeVariableName}.texture.vOffset = ${this.texture.vOffset};\r\n`,e+=`${this._codeVariableName}.texture.uScale = ${this.texture.uScale};\r\n`,e+=`${this._codeVariableName}.texture.vScale = ${this.texture.vScale};\r\n`,e+=`${this._codeVariableName}.texture.coordinatesMode = ${this.texture.coordinatesMode};\r\n`,e):e}serialize(){const e=super.serialize();return this.texture&&!this.texture.isRenderTarget&&"VideoTexture"!==this.texture.getClassName()&&(e.texture=this.texture.serialize()),e}_deserialize(e,t,i){super._deserialize(e,t,i),e.texture&&!Fl.O.IgnoreTexturesAtLoadTime&&void 0!==e.texture.url&&(i=0===e.texture.url.indexOf("data:")?"":i,this.texture=Ce.x.Parse(e.texture,t,i))}}(0,l.H)("BABYLON.ImageSourceBlock",Lu);class Bu extends du.k{get texture(){var e;return this.source.isConnected?(null===(e=this.source.connectedPoint)||void 0===e?void 0:e.ownerBlock).texture:this._texture}set texture(e){var t;if(this._texture===e)return;const i=null!==(t=null==e?void 0:e.getScene())&&void 0!==t?t:A.l.LastCreatedScene;!e&&i&&i.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this._texture))),this._texture=e,e&&i&&i.markAllMaterialsAsDirty(1,(t=>t.hasTexture(e)))}get samplerName(){return this._imageSource?this._imageSource.samplerName:this._samplerName}get hasImageSource(){return this.source.isConnected}set convertToGammaSpace(e){var t;if(e!==this._convertToGammaSpace&&(this._convertToGammaSpace=e,this.texture)){const e=null!==(t=this.texture.getScene())&&void 0!==t?t:A.l.LastCreatedScene;null==e||e.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this.texture)))}}get convertToGammaSpace(){return this._convertToGammaSpace}set convertToLinearSpace(e){var t;if(e!==this._convertToLinearSpace&&(this._convertToLinearSpace=e,this.texture)){const e=null!==(t=this.texture.getScene())&&void 0!==t?t:A.l.LastCreatedScene;null==e||e.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this.texture)))}}get convertToLinearSpace(){return this._convertToLinearSpace}constructor(e,t=!1){super(e,t?ru.u.Fragment:ru.u.VertexAndFragment),this._convertToGammaSpace=!1,this._convertToLinearSpace=!1,this.disableLevelMultiplication=!1,this._fragmentOnly=t,this.registerInput("uv",ou.E.AutoDetect,!1,ru.u.VertexAndFragment),this.registerInput("source",ou.E.Object,!0,ru.u.VertexAndFragment,new uu("source",this,cu.Ab.Input,Lu,"ImageSourceBlock")),this.registerInput("layer",ou.E.Float,!0),this.registerOutput("rgba",ou.E.Color4,ru.u.Neutral),this.registerOutput("rgb",ou.E.Color3,ru.u.Neutral),this.registerOutput("r",ou.E.Float,ru.u.Neutral),this.registerOutput("g",ou.E.Float,ru.u.Neutral),this.registerOutput("b",ou.E.Float,ru.u.Neutral),this.registerOutput("a",ou.E.Float,ru.u.Neutral),this.registerOutput("level",ou.E.Float,ru.u.Neutral),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(ou.E.Vector2|ou.E.Vector3|ou.E.Vector4),this._inputs[0]._prioritizeVertex=!t}getClassName(){return"TextureBlock"}get uv(){return this._inputs[0]}get source(){return this._inputs[1]}get layer(){return this._inputs[2]}get rgba(){return this._outputs[0]}get rgb(){return this._outputs[1]}get r(){return this._outputs[2]}get g(){return this._outputs[3]}get b(){return this._outputs[4]}get a(){return this._outputs[5]}get level(){return this._outputs[6]}get target(){if(this._fragmentOnly)return ru.u.Fragment;if(!this.uv.isConnected)return ru.u.VertexAndFragment;if(this.uv.sourceBlock.isInput)return ru.u.VertexAndFragment;let e=this.uv.connectedPoint;for(;e;){if(e.target===ru.u.Fragment)return ru.u.Fragment;if(e.target===ru.u.Vertex)return ru.u.VertexAndFragment;if(e.target===ru.u.Neutral||e.target===ru.u.VertexAndFragment){const t=e.ownerBlock;if(t.target===ru.u.Fragment)return ru.u.Fragment;e=null;for(const i of t.inputs)if(i.connectedPoint){e=i.connectedPoint;break}}}return ru.u.VertexAndFragment}set target(e){}autoConfigure(e){if(!this.uv.isConnected)if(e.mode===hu.a.PostProcess){const t=e.getBlockByPredicate((e=>"uv"===e.name));t&&t.connectTo(this)}else{const t=e.mode===hu.a.Particle?"particle_uv":"uv";let i=e.getInputBlockByPredicate((e=>e.isAttribute&&e.name===t));i||(i=new fu.S("uv"),i.setAsAttribute(t)),i.output.connectTo(this.uv)}}initializeDefines(e,t,i){i._areTexturesDirty&&void 0!==this._mainUVDefineName&&i.setValue(this._mainUVDefineName,!1,!0)}prepareDefines(e,t,i){if(!i._areTexturesDirty)return;if(!this.texture||!this.texture.getTextureMatrix)return void(this._isMixed&&(i.setValue(this._defineName,!1,!0),i.setValue(this._mainUVDefineName,!0,!0)));const n=this.convertToGammaSpace&&this.texture&&!this.texture.gammaSpace,s=this.convertToLinearSpace&&this.texture&&this.texture.gammaSpace;i.setValue(this._linearDefineName,n,!0),i.setValue(this._gammaDefineName,s,!0),this._isMixed&&(this.texture.getTextureMatrix().isIdentityAs3x2()?(i.setValue(this._defineName,!1,!0),i.setValue(this._mainUVDefineName,!0,!0)):(i.setValue(this._defineName,!0),null==i[this._mainUVDefineName]&&i.setValue(this._mainUVDefineName,!1,!0)))}isReady(){return!(this.texture&&!this.texture.isReadyOrNotBlocking())}bind(e){this.texture&&(this._isMixed&&(e.setFloat(this._textureInfoName,this.texture.level),e.setMatrix(this._textureTransformName,this.texture.getTextureMatrix())),this._imageSource||e.setTexture(this._samplerName,this.texture))}get _isMixed(){return this.target!==ru.u.Fragment}_injectVertexCode(e){const t=this.uv;if(this._defineName=e._getFreeDefineName("UVTRANSFORM"),this._mainUVDefineName="VMAIN"+t.associatedVariableName.toUpperCase(),this._mainUVName="vMain"+t.associatedVariableName,this._transformedUVName=e._getFreeVariableName("transformedUV"),this._textureTransformName=e._getFreeVariableName("textureTransform"),this._textureInfoName=e._getFreeVariableName("textureInfoName"),this.level.associatedVariableName=this._textureInfoName,e._emitVaryingFromString(this._transformedUVName,"vec2",this._defineName),e._emitVaryingFromString(this._mainUVName,"vec2",this._mainUVDefineName),e._emitUniformFromString(this._textureTransformName,"mat4",this._defineName),e.compilationString+=`#ifdef ${this._defineName}\r\n`,e.compilationString+=`${this._transformedUVName} = vec2(${this._textureTransformName} * vec4(${t.associatedVariableName}.xy, 1.0, 0.0));\r\n`,e.compilationString+=`#elif defined(${this._mainUVDefineName})\r\n`,e.compilationString+=`${this._mainUVName} = ${t.associatedVariableName}.xy;\r\n`,e.compilationString+="#endif\r\n",this._outputs.some((e=>e.isConnectedInVertexShader))){this._writeTextureRead(e,!0);for(const t of this._outputs)t.hasEndpoints&&"level"!==t.name&&this._writeOutput(e,t,t.name,!0)}}_getUVW(e){var t,i,n;let s=e;return null!==(n=null===(i=null===(t=this._texture)||void 0===t?void 0:t._texture)||void 0===i?void 0:i.is2DArray)&&void 0!==n&&n&&(s=`vec3(${e}, ${this.layer.isConnected?this.layer.associatedVariableName:"0"})`),s}_generateTextureLookup(e){const t=this.samplerName;e.compilationString+=`#ifdef ${this._defineName}\r\n`,e.compilationString+=`vec4 ${this._tempTextureRead} = texture2D(${t}, ${this._getUVW(this._transformedUVName)});\r\n`,e.compilationString+=`#elif defined(${this._mainUVDefineName})\r\n`,e.compilationString+=`vec4 ${this._tempTextureRead} = texture2D(${t}, ${this._getUVW(this._mainUVName?this._mainUVName:this.uv.associatedVariableName)});\r\n`,e.compilationString+="#endif\r\n"}_writeTextureRead(e,t=!1){const i=this.uv;if(t){if(e.target===ru.u.Fragment)return;this._generateTextureLookup(e)}else this.uv.ownerBlock.target!==ru.u.Fragment?this._generateTextureLookup(e):e.compilationString+=`vec4 ${this._tempTextureRead} = texture2D(${this.samplerName}, ${this._getUVW(i.associatedVariableName)});\r\n`}_generateConversionCode(e,t,i){"a"!==i&&(this.texture&&this.texture.gammaSpace||(e.compilationString+=`#ifdef ${this._linearDefineName}\n                    ${t.associatedVariableName} = toGammaSpace(${t.associatedVariableName});\n                    #endif\n                `),e.compilationString+=`#ifdef ${this._gammaDefineName}\n                ${t.associatedVariableName} = toLinearSpace(${t.associatedVariableName});\n                #endif\n            `)}_writeOutput(e,t,i,n=!1){if(n){if(e.target===ru.u.Fragment)return;return e.compilationString+=`${this._declareOutput(t,e)} = ${this._tempTextureRead}.${i};\r\n`,void this._generateConversionCode(e,t,i)}if(this.uv.ownerBlock.target===ru.u.Fragment)return e.compilationString+=`${this._declareOutput(t,e)} = ${this._tempTextureRead}.${i};\r\n`,void this._generateConversionCode(e,t,i);let s="";this.disableLevelMultiplication||(s=` * ${this._textureInfoName}`),e.compilationString+=`${this._declareOutput(t,e)} = ${this._tempTextureRead}.${i}${s};\r\n`,this._generateConversionCode(e,t,i)}_buildBlock(e){var t,i,n,s;if(super._buildBlock(e),this.source.isConnected?this._imageSource=this.source.connectedPoint.ownerBlock:this._imageSource=null,(e.target===ru.u.Vertex||this._fragmentOnly||e.target===ru.u.Fragment)&&(this._tempTextureRead=e._getFreeVariableName("tempTextureRead"),this._linearDefineName=e._getFreeDefineName("ISLINEAR"),this._gammaDefineName=e._getFreeDefineName("ISGAMMA")),(!this._isMixed&&e.target===ru.u.Fragment||this._isMixed&&e.target===ru.u.Vertex)&&(this._imageSource||(this._samplerName=e._getFreeVariableName(this.name+"Sampler"),(null===(i=null===(t=this._texture)||void 0===t?void 0:t._texture)||void 0===i?void 0:i.is2DArray)?e._emit2DArraySampler(this._samplerName):e._emit2DSampler(this._samplerName)),e.sharedData.blockingBlocks.push(this),e.sharedData.textureBlocks.push(this),e.sharedData.blocksWithDefines.push(this),e.sharedData.bindableBlocks.push(this)),e.target!==ru.u.Fragment)return void this._injectVertexCode(e);if(!this._outputs.some((e=>e.isConnectedInFragmentShader)))return;this._isMixed&&!this._imageSource&&((null===(s=null===(n=this._texture)||void 0===n?void 0:n._texture)||void 0===s?void 0:s.is2DArray)?e._emit2DArraySampler(this._samplerName):e._emit2DSampler(this._samplerName));const r=`//${this.name}`;e._emitFunctionFromInclude("helperFunctions",r),this._isMixed&&e._emitUniformFromString(this._textureInfoName,"float"),this._writeTextureRead(e);for(const t of this._outputs)t.hasEndpoints&&"level"!==t.name&&this._writeOutput(e,t,t.name);return this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.convertToGammaSpace = ${this.convertToGammaSpace};\r\n`,e+=`${this._codeVariableName}.convertToLinearSpace = ${this.convertToLinearSpace};\r\n`,e+=`${this._codeVariableName}.disableLevelMultiplication = ${this.disableLevelMultiplication};\r\n`,this.texture?(e+=`${this._codeVariableName}.texture = new BABYLON.Texture("${this.texture.name}", null, ${this.texture.noMipmap}, ${this.texture.invertY}, ${this.texture.samplingMode});\r\n`,e+=`${this._codeVariableName}.texture.wrapU = ${this.texture.wrapU};\r\n`,e+=`${this._codeVariableName}.texture.wrapV = ${this.texture.wrapV};\r\n`,e+=`${this._codeVariableName}.texture.uAng = ${this.texture.uAng};\r\n`,e+=`${this._codeVariableName}.texture.vAng = ${this.texture.vAng};\r\n`,e+=`${this._codeVariableName}.texture.wAng = ${this.texture.wAng};\r\n`,e+=`${this._codeVariableName}.texture.uOffset = ${this.texture.uOffset};\r\n`,e+=`${this._codeVariableName}.texture.vOffset = ${this.texture.vOffset};\r\n`,e+=`${this._codeVariableName}.texture.uScale = ${this.texture.uScale};\r\n`,e+=`${this._codeVariableName}.texture.vScale = ${this.texture.vScale};\r\n`,e+=`${this._codeVariableName}.texture.coordinatesMode = ${this.texture.coordinatesMode};\r\n`,e):e}serialize(){const e=super.serialize();return e.convertToGammaSpace=this.convertToGammaSpace,e.convertToLinearSpace=this.convertToLinearSpace,e.fragmentOnly=this._fragmentOnly,e.disableLevelMultiplication=this.disableLevelMultiplication,this.hasImageSource||!this.texture||this.texture.isRenderTarget||"VideoTexture"===this.texture.getClassName()||(e.texture=this.texture.serialize()),e}_deserialize(e,t,i){super._deserialize(e,t,i),this.convertToGammaSpace=e.convertToGammaSpace,this.convertToLinearSpace=!!e.convertToLinearSpace,this._fragmentOnly=!!e.fragmentOnly,this.disableLevelMultiplication=!!e.disableLevelMultiplication,e.texture&&!Fl.O.IgnoreTexturesAtLoadTime&&void 0!==e.texture.url&&(i=0===e.texture.url.indexOf("data:")?"":i,this.texture=Ce.x.Parse(e.texture,t,i))}}(0,l.H)("BABYLON.TextureBlock",Bu);class Uu extends du.k{get texture(){return this._texture}set texture(e){var t;if(this._texture===e)return;const i=null!==(t=null==e?void 0:e.getScene())&&void 0!==t?t:A.l.LastCreatedScene;!e&&i&&i.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this._texture))),this._texture=e,e&&i&&i.markAllMaterialsAsDirty(1,(t=>t.hasTexture(e)))}static _OnGenerateOnlyFragmentCodeChanged(e,t){return e._onGenerateOnlyFragmentCodeChanged()}_onGenerateOnlyFragmentCodeChanged(){return this._setTarget(),!0}_setTarget(){this._setInitialTarget(this.generateOnlyFragmentCode?ru.u.Fragment:ru.u.VertexAndFragment)}constructor(e){super(e,ru.u.VertexAndFragment),this.generateOnlyFragmentCode=!1}getClassName(){return"ReflectionTextureBaseBlock"}_getTexture(){return this.texture}autoConfigure(e){if(!this.position.isConnected){let t=e.getInputBlockByPredicate((e=>e.isAttribute&&"position"===e.name));t||(t=new fu.S("position"),t.setAsAttribute()),t.output.connectTo(this.position)}if(!this.world.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.World));t||(t=new fu.S("world"),t.setAsSystemValue(lu.$.World)),t.output.connectTo(this.world)}if(this.view&&!this.view.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.View));t||(t=new fu.S("view"),t.setAsSystemValue(lu.$.View)),t.output.connectTo(this.view)}}prepareDefines(e,t,i){if(!i._areTexturesDirty)return;const n=this._getTexture();n&&n.getTextureMatrix&&(i.setValue(this._define3DName,n.isCube,!0),i.setValue(this._defineLocalCubicName,!!n.boundingBoxSize,!0),i.setValue(this._defineExplicitName,0===n.coordinatesMode,!0),i.setValue(this._defineSkyboxName,5===n.coordinatesMode,!0),i.setValue(this._defineCubicName,3===n.coordinatesMode||6===n.coordinatesMode,!0),i.setValue("INVERTCUBICMAP",6===n.coordinatesMode,!0),i.setValue(this._defineSphericalName,1===n.coordinatesMode,!0),i.setValue(this._definePlanarName,2===n.coordinatesMode,!0),i.setValue(this._defineProjectionName,4===n.coordinatesMode,!0),i.setValue(this._defineEquirectangularName,7===n.coordinatesMode,!0),i.setValue(this._defineEquirectangularFixedName,8===n.coordinatesMode,!0),i.setValue(this._defineMirroredEquirectangularFixedName,9===n.coordinatesMode,!0))}isReady(){const e=this._getTexture();return!(e&&!e.isReadyOrNotBlocking())}bind(e,t,i){const n=this._getTexture();if(i&&n&&(e.setMatrix(this._reflectionMatrixName,n.getReflectionTextureMatrix()),n.isCube?e.setTexture(this._cubeSamplerName,n):e.setTexture(this._2DSamplerName,n),n.boundingBoxSize)){const t=n;e.setVector3(this._reflectionPositionName,t.boundingBoxPosition),e.setVector3(this._reflectionSizeName,t.boundingBoxSize)}}handleVertexSide(e){if(this.generateOnlyFragmentCode&&e.target===ru.u.Vertex)return"";this._define3DName=e._getFreeDefineName("REFLECTIONMAP_3D"),this._defineCubicName=e._getFreeDefineName("REFLECTIONMAP_CUBIC"),this._defineSphericalName=e._getFreeDefineName("REFLECTIONMAP_SPHERICAL"),this._definePlanarName=e._getFreeDefineName("REFLECTIONMAP_PLANAR"),this._defineProjectionName=e._getFreeDefineName("REFLECTIONMAP_PROJECTION"),this._defineExplicitName=e._getFreeDefineName("REFLECTIONMAP_EXPLICIT"),this._defineEquirectangularName=e._getFreeDefineName("REFLECTIONMAP_EQUIRECTANGULAR"),this._defineLocalCubicName=e._getFreeDefineName("USE_LOCAL_REFLECTIONMAP_CUBIC"),this._defineMirroredEquirectangularFixedName=e._getFreeDefineName("REFLECTIONMAP_MIRROREDEQUIRECTANGULAR_FIXED"),this._defineEquirectangularFixedName=e._getFreeDefineName("REFLECTIONMAP_EQUIRECTANGULAR_FIXED"),this._defineSkyboxName=e._getFreeDefineName("REFLECTIONMAP_SKYBOX"),this._defineOppositeZ=e._getFreeDefineName("REFLECTIONMAP_OPPOSITEZ"),this._reflectionMatrixName=e._getFreeVariableName("reflectionMatrix"),e._emitUniformFromString(this._reflectionMatrixName,"mat4");let t="";this._worldPositionNameInFragmentOnlyMode=e._getFreeVariableName("worldPosition");const i=this.generateOnlyFragmentCode?this._worldPositionNameInFragmentOnlyMode:"v_"+this.worldPosition.associatedVariableName;return(this.generateOnlyFragmentCode||e._emitVaryingFromString(i,"vec4"))&&(t+=`${this.generateOnlyFragmentCode?"vec4 ":""}${i} = ${this.worldPosition.associatedVariableName};\r\n`),this._positionUVWName=e._getFreeVariableName("positionUVW"),this._directionWName=e._getFreeVariableName("directionW"),(this.generateOnlyFragmentCode||e._emitVaryingFromString(this._positionUVWName,"vec3",this._defineSkyboxName))&&(t+=`#ifdef ${this._defineSkyboxName}\r\n`,t+=`${this.generateOnlyFragmentCode?"vec3 ":""}${this._positionUVWName} = ${this.position.associatedVariableName}.xyz;\r\n`,t+="#endif\r\n"),(this.generateOnlyFragmentCode||e._emitVaryingFromString(this._directionWName,"vec3",`defined(${this._defineEquirectangularFixedName}) || defined(${this._defineMirroredEquirectangularFixedName})`))&&(t+=`#if defined(${this._defineEquirectangularFixedName}) || defined(${this._defineMirroredEquirectangularFixedName})\r\n`,t+=`${this.generateOnlyFragmentCode?"vec3 ":""}${this._directionWName} = normalize(vec3(${this.world.associatedVariableName} * vec4(${this.position.associatedVariableName}.xyz, 0.0)));\r\n`,t+="#endif\r\n"),t}handleFragmentSideInits(e){e.sharedData.blockingBlocks.push(this),e.sharedData.textureBlocks.push(this),this._cubeSamplerName=e._getFreeVariableName(this.name+"CubeSampler"),e.samplers.push(this._cubeSamplerName),this._2DSamplerName=e._getFreeVariableName(this.name+"2DSampler"),e.samplers.push(this._2DSamplerName),e._samplerDeclaration+=`#ifdef ${this._define3DName}\r\n`,e._samplerDeclaration+=`uniform samplerCube ${this._cubeSamplerName};\r\n`,e._samplerDeclaration+="#else\r\n",e._samplerDeclaration+=`uniform sampler2D ${this._2DSamplerName};\r\n`,e._samplerDeclaration+="#endif\r\n",e.sharedData.blocksWithDefines.push(this),e.sharedData.bindableBlocks.push(this);const t=`//${this.name}`;e._emitFunction("ReciprocalPI","#define RECIPROCAL_PI2 0.15915494",""),e._emitFunctionFromInclude("helperFunctions",t),e._emitFunctionFromInclude("reflectionFunction",t,{replaceStrings:[{search:/vec3 computeReflectionCoords/g,replace:"void DUMMYFUNC"}]}),this._reflectionColorName=e._getFreeVariableName("reflectionColor"),this._reflectionVectorName=e._getFreeVariableName("reflectionUVW"),this._reflectionCoordsName=e._getFreeVariableName("reflectionCoords"),this._reflectionPositionName=e._getFreeVariableName("vReflectionPosition"),e._emitUniformFromString(this._reflectionPositionName,"vec3"),this._reflectionSizeName=e._getFreeVariableName("vReflectionPosition"),e._emitUniformFromString(this._reflectionSizeName,"vec3")}handleFragmentSideCodeReflectionCoords(e,t,i=!1,n=!1){t||(t=this.generateOnlyFragmentCode?this._worldPositionNameInFragmentOnlyMode:`v_${this.worldPosition.associatedVariableName}`);const s=this._reflectionMatrixName,r=`normalize(${this._directionWName})`,o=`${this._positionUVWName}`,a=`${this.cameraPosition.associatedVariableName}`,l=`${this.view.associatedVariableName}`;e+=".xyz";let h=`\n            #ifdef ${this._defineMirroredEquirectangularFixedName}\n                vec3 ${this._reflectionVectorName} = computeMirroredFixedEquirectangularCoords(${t}, ${e}, ${r});\n            #endif\n\n            #ifdef ${this._defineEquirectangularFixedName}\n                vec3 ${this._reflectionVectorName} = computeFixedEquirectangularCoords(${t}, ${e}, ${r});\n            #endif\n\n            #ifdef ${this._defineEquirectangularName}\n                vec3 ${this._reflectionVectorName} = computeEquirectangularCoords(${t}, ${e}, ${a}.xyz, ${s});\n            #endif\n\n            #ifdef ${this._defineSphericalName}\n                vec3 ${this._reflectionVectorName} = computeSphericalCoords(${t}, ${e}, ${l}, ${s});\n            #endif\n\n            #ifdef ${this._definePlanarName}\n                vec3 ${this._reflectionVectorName} = computePlanarCoords(${t}, ${e}, ${a}.xyz, ${s});\n            #endif\n\n            #ifdef ${this._defineCubicName}\n                #ifdef ${this._defineLocalCubicName}\n                    vec3 ${this._reflectionVectorName} = computeCubicLocalCoords(${t}, ${e}, ${a}.xyz, ${s}, ${this._reflectionSizeName}, ${this._reflectionPositionName});\n                #else\n                vec3 ${this._reflectionVectorName} = computeCubicCoords(${t}, ${e}, ${a}.xyz, ${s});\n                #endif\n            #endif\n\n            #ifdef ${this._defineProjectionName}\n                vec3 ${this._reflectionVectorName} = computeProjectionCoords(${t}, ${l}, ${s});\n            #endif\n\n            #ifdef ${this._defineSkyboxName}\n                vec3 ${this._reflectionVectorName} = computeSkyBoxCoords(${o}, ${s});\n            #endif\n\n            #ifdef ${this._defineExplicitName}\n                vec3 ${this._reflectionVectorName} = vec3(0, 0, 0);\n            #endif\r\n`;return n||(h+=`#ifdef ${this._defineOppositeZ}\n                ${this._reflectionVectorName}.z *= -1.0;\n            #endif\r\n`),i||(h+=`\n                #ifdef ${this._define3DName}\n                    vec3 ${this._reflectionCoordsName} = ${this._reflectionVectorName};\n                #else\n                    vec2 ${this._reflectionCoordsName} = ${this._reflectionVectorName}.xy;\n                    #ifdef ${this._defineProjectionName}\n                        ${this._reflectionCoordsName} /= ${this._reflectionVectorName}.z;\n                    #endif\n                    ${this._reflectionCoordsName}.y = 1.0 - ${this._reflectionCoordsName}.y;\n                #endif\r\n`),h}handleFragmentSideCodeReflectionColor(e,t=".rgb"){let i=`${"vec"+(0===t.length?"4":t.length-1)} ${this._reflectionColorName};\n            #ifdef ${this._define3DName}\r\n`;return i+=e?`${this._reflectionColorName} = textureCubeLodEXT(${this._cubeSamplerName}, ${this._reflectionVectorName}, ${e})${t};\r\n`:`${this._reflectionColorName} = textureCube(${this._cubeSamplerName}, ${this._reflectionVectorName})${t};\r\n`,i+="\n            #else\r\n",i+=e?`${this._reflectionColorName} = texture2DLodEXT(${this._2DSamplerName}, ${this._reflectionCoordsName}, ${e})${t};\r\n`:`${this._reflectionColorName} = texture2D(${this._2DSamplerName}, ${this._reflectionCoordsName})${t};\r\n`,i+="#endif\r\n",i}writeOutputs(e,t){let i="";if(e.target===ru.u.Fragment)for(const n of this._outputs)n.hasEndpoints&&(i+=`${this._declareOutput(n,e)} = ${t}.${n.name};\r\n`);return i}_buildBlock(e){return super._buildBlock(e),this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();if(!this.texture)return e;if(this.texture.isCube){const t=this.texture.forcedExtension;e+=`${this._codeVariableName}.texture = new BABYLON.CubeTexture("${this.texture.name}", undefined, undefined, ${this.texture.noMipmap}, null, undefined, undefined, undefined, ${this.texture._prefiltered}, ${t?'"'+t+'"':"null"});\r\n`}else e+=`${this._codeVariableName}.texture = new BABYLON.Texture("${this.texture.name}", null);\r\n`;return e+=`${this._codeVariableName}.texture.coordinatesMode = ${this.texture.coordinatesMode};\r\n`,e}serialize(){const e=super.serialize();return this.texture&&!this.texture.isRenderTarget&&(e.texture=this.texture.serialize()),e.generateOnlyFragmentCode=this.generateOnlyFragmentCode,e}_deserialize(e,t,i){super._deserialize(e,t,i),e.texture&&!Fl.O.IgnoreTexturesAtLoadTime&&(i=0===e.texture.url.indexOf("data:")?"":i,e.texture.isCube?this.texture=Fa.B.Parse(e.texture,t,i):this.texture=Ce.x.Parse(e.texture,t,i)),this.generateOnlyFragmentCode=e.generateOnlyFragmentCode,this._setTarget()}}(0,be.gn)([(0,xu.p)("Generate only fragment code",xu.U.Boolean,"ADVANCED",{notifiers:{rebuild:!0,update:!0,onValidation:Uu._OnGenerateOnlyFragmentCodeChanged}})],Uu.prototype,"generateOnlyFragmentCode",void 0),(0,l.H)("BABYLON.ReflectionTextureBaseBlock",Uu);class Vu extends Uu{_onGenerateOnlyFragmentCodeChanged(){return this.position.isConnected?(this.generateOnlyFragmentCode=!this.generateOnlyFragmentCode,console.error("The position input must not be connected to be able to switch!"),!1):this.worldPosition.isConnected?(this.generateOnlyFragmentCode=!this.generateOnlyFragmentCode,console.error("The worldPosition input must not be connected to be able to switch!"),!1):(this._setTarget(),!0)}_setTarget(){super._setTarget(),this.getInputByName("position").target=this.generateOnlyFragmentCode?ru.u.Fragment:ru.u.Vertex,this.getInputByName("worldPosition").target=this.generateOnlyFragmentCode?ru.u.Fragment:ru.u.Vertex}constructor(e){super(e),this.registerInput("position",ou.E.AutoDetect,!1,ru.u.Vertex),this.registerInput("worldPosition",ou.E.Vector4,!1,ru.u.Vertex),this.registerInput("worldNormal",ou.E.Vector4,!1,ru.u.Fragment),this.registerInput("world",ou.E.Matrix,!1,ru.u.Vertex),this.registerInput("cameraPosition",ou.E.Vector3,!1,ru.u.Fragment),this.registerInput("view",ou.E.Matrix,!1,ru.u.Fragment),this.registerOutput("rgb",ou.E.Color3,ru.u.Fragment),this.registerOutput("rgba",ou.E.Color4,ru.u.Fragment),this.registerOutput("r",ou.E.Float,ru.u.Fragment),this.registerOutput("g",ou.E.Float,ru.u.Fragment),this.registerOutput("b",ou.E.Float,ru.u.Fragment),this.registerOutput("a",ou.E.Float,ru.u.Fragment),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Vector3|ou.E.Vector4)}getClassName(){return"ReflectionTextureBlock"}get position(){return this._inputs[0]}get worldPosition(){return this._inputs[1]}get worldNormal(){return this._inputs[2]}get world(){return this._inputs[3]}get cameraPosition(){return this._inputs[4]}get view(){return this._inputs[5]}get rgb(){return this._outputs[0]}get rgba(){return this._outputs[1]}get r(){return this._outputs[2]}get g(){return this._outputs[3]}get b(){return this._outputs[4]}get a(){return this._outputs[5]}autoConfigure(e){if(super.autoConfigure(e),!this.cameraPosition.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.CameraPosition));t||(t=new fu.S("cameraPosition"),t.setAsSystemValue(lu.$.CameraPosition)),t.output.connectTo(this.cameraPosition)}}_buildBlock(e){if(super._buildBlock(e),!this.texture)return e.compilationString+=this.writeOutputs(e,"vec4(0.)"),this;if(e.target!==ru.u.Fragment)return e.compilationString+=this.handleVertexSide(e),this;this.generateOnlyFragmentCode&&(e.compilationString+=this.handleVertexSide(e)),this.handleFragmentSideInits(e);const t=e._getFreeVariableName("normalWUnit");return e.compilationString+=`vec4 ${t} = normalize(${this.worldNormal.associatedVariableName});\r\n`,e.compilationString+=this.handleFragmentSideCodeReflectionCoords(t),e.compilationString+=this.handleFragmentSideCodeReflectionColor(void 0,""),e.compilationString+=this.writeOutputs(e,this._reflectionColorName),this}}(0,l.H)("BABYLON.ReflectionTextureBlock",Vu);var ku=i(6653);class Gu extends du.k{constructor(e){super(e,ru.u.VertexAndFragment),this.useNonLinearDepth=!1,this.storeCameraSpaceZ=!1,this.force32itsFloat=!1,this._isUnique=!0,this.registerInput("uv",ou.E.AutoDetect,!1,ru.u.VertexAndFragment),this.registerOutput("depth",ou.E.Float,ru.u.Neutral),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(ou.E.Vector2|ou.E.Vector3|ou.E.Vector4),this._inputs[0]._prioritizeVertex=!1}getClassName(){return"SceneDepthBlock"}get uv(){return this._inputs[0]}get depth(){return this._outputs[0]}initialize(e){e._excludeVariableName("textureSampler")}get target(){return this.uv.isConnected?this.uv.sourceBlock.isInput?ru.u.VertexAndFragment:ru.u.Fragment:ru.u.VertexAndFragment}_getTexture(e){return e.enableDepthRenderer(void 0,this.useNonLinearDepth,this.force32itsFloat,void 0,this.storeCameraSpaceZ).getDepthMap()}bind(e,t){const i=this._getTexture(t.getScene());e.setTexture(this._samplerName,i)}_injectVertexCode(e){const t=this.uv;if(t.connectedPoint.ownerBlock.isInput&&(t.connectedPoint.ownerBlock.isAttribute||e._emitUniformFromString(t.associatedVariableName,"vec"+(t.type===ou.E.Vector3?"3":t.type===ou.E.Vector4?"4":"2"))),this._mainUVName="vMain"+t.associatedVariableName,e._emitVaryingFromString(this._mainUVName,"vec2"),e.compilationString+=`${this._mainUVName} = ${t.associatedVariableName}.xy;\r\n`,this._outputs.some((e=>e.isConnectedInVertexShader))){this._writeTextureRead(e,!0);for(const t of this._outputs)t.hasEndpoints&&this._writeOutput(e,t,"r",!0)}}_writeTextureRead(e,t=!1){const i=this.uv;if(t){if(e.target===ru.u.Fragment)return;e.compilationString+=`vec4 ${this._tempTextureRead} = texture2D(${this._samplerName}, ${i.associatedVariableName}.xy);\r\n`}else this.uv.ownerBlock.target!==ru.u.Fragment?e.compilationString+=`vec4 ${this._tempTextureRead} = texture2D(${this._samplerName}, ${this._mainUVName});\r\n`:e.compilationString+=`vec4 ${this._tempTextureRead} = texture2D(${this._samplerName}, ${i.associatedVariableName}.xy);\r\n`}_writeOutput(e,t,i,n=!1){if(n){if(e.target===ru.u.Fragment)return;e.compilationString+=`${this._declareOutput(t,e)} = ${this._tempTextureRead}.${i};\r\n`}else this.uv.ownerBlock.target,ru.u.Fragment,e.compilationString+=`${this._declareOutput(t,e)} = ${this._tempTextureRead}.${i};\r\n`}_buildBlock(e){if(super._buildBlock(e),this._samplerName=e._getFreeVariableName(this.name+"Sampler"),this._tempTextureRead=e._getFreeVariableName("tempTextureRead"),e.sharedData.bindableBlocks.indexOf(this)<0&&e.sharedData.bindableBlocks.push(this),e.target!==ru.u.Fragment)return e._emit2DSampler(this._samplerName),void this._injectVertexCode(e);if(this._outputs.some((e=>e.isConnectedInFragmentShader))){e._emit2DSampler(this._samplerName),this._writeTextureRead(e);for(const t of this._outputs)t.hasEndpoints&&this._writeOutput(e,t,"r");return this}}serialize(){const e=super.serialize();return e.useNonLinearDepth=this.useNonLinearDepth,e.storeCameraSpaceZ=this.storeCameraSpaceZ,e.force32itsFloat=this.force32itsFloat,e}_deserialize(e,t,i){super._deserialize(e,t,i),this.useNonLinearDepth=e.useNonLinearDepth,this.storeCameraSpaceZ=!!e.storeCameraSpaceZ,this.force32itsFloat=e.force32itsFloat}}(0,be.gn)([(0,xu.p)("Use non linear depth",xu.U.Boolean,"ADVANCED",{notifiers:{activatePreviewCommand:!0,callback:(e,t)=>{const i=t;let n=!1;return i.useNonLinearDepth&&(i.storeCameraSpaceZ=!1,n=!0),e.disableDepthRenderer(),n}}})],Gu.prototype,"useNonLinearDepth",void 0),(0,be.gn)([(0,xu.p)("Store Camera space Z",xu.U.Boolean,"ADVANCED",{notifiers:{activatePreviewCommand:!0,callback:(e,t)=>{const i=t;let n=!1;return i.storeCameraSpaceZ&&(i.useNonLinearDepth=!1,n=!0),e.disableDepthRenderer(),n}}})],Gu.prototype,"storeCameraSpaceZ",void 0),(0,be.gn)([(0,xu.p)("Force 32 bits float",xu.U.Boolean,"ADVANCED",{notifiers:{activatePreviewCommand:!0,callback:e=>e.disableDepthRenderer()}})],Gu.prototype,"force32itsFloat",void 0),(0,l.H)("BABYLON.SceneDepthBlock",Gu);class zu extends du.k{constructor(e){super(e,ru.u.VertexAndFragment,!0),this.registerInput("worldPosition",ou.E.Vector4,!1)}getClassName(){return"ClipPlanesBlock"}initialize(e){e._excludeVariableName("vClipPlane"),e._excludeVariableName("fClipDistance"),e._excludeVariableName("vClipPlane2"),e._excludeVariableName("fClipDistance2"),e._excludeVariableName("vClipPlane3"),e._excludeVariableName("fClipDistance3"),e._excludeVariableName("vClipPlane4"),e._excludeVariableName("fClipDistance4"),e._excludeVariableName("vClipPlane5"),e._excludeVariableName("fClipDistance5"),e._excludeVariableName("vClipPlane6"),e._excludeVariableName("fClipDistance6")}get worldPosition(){return this._inputs[0]}get target(){return ru.u.VertexAndFragment}set target(e){}prepareDefines(e,t,i){var n,s,r,o,a,l;const h=e.getScene(),c=!!(null!==(n=t.clipPlane)&&void 0!==n?n:h.clipPlane),u=!!(null!==(s=t.clipPlane2)&&void 0!==s?s:h.clipPlane2),d=!!(null!==(r=t.clipPlane3)&&void 0!==r?r:h.clipPlane3),p=!!(null!==(o=t.clipPlane4)&&void 0!==o?o:h.clipPlane4),f=!!(null!==(a=t.clipPlane5)&&void 0!==a?a:h.clipPlane5),_=!!(null!==(l=t.clipPlane6)&&void 0!==l?l:h.clipPlane6);i.setValue("CLIPPLANE",c,!0),i.setValue("CLIPPLANE2",u,!0),i.setValue("CLIPPLANE3",d,!0),i.setValue("CLIPPLANE4",p,!0),i.setValue("CLIPPLANE5",f,!0),i.setValue("CLIPPLANE6",_,!0)}bind(e,t,i){if(!i)return;const n=i.getScene();(0,Ga.an)(e,t,n)}_buildBlock(e){super._buildBlock(e);const t=`//${this.name}`;if(e.target!==ru.u.Fragment){const i=this.worldPosition;return e._emitFunctionFromInclude("clipPlaneVertexDeclaration",t,{replaceStrings:[{search:/uniform vec4 vClipPlane\d*;/g,replace:""}]}),e.compilationString+=e._emitCodeFromInclude("clipPlaneVertex",t,{replaceStrings:[{search:/worldPos/g,replace:i.associatedVariableName}]}),e._emitUniformFromString("vClipPlane","vec4"),e._emitUniformFromString("vClipPlane2","vec4"),e._emitUniformFromString("vClipPlane3","vec4"),e._emitUniformFromString("vClipPlane4","vec4"),e._emitUniformFromString("vClipPlane5","vec4"),void e._emitUniformFromString("vClipPlane6","vec4")}return e.sharedData.bindableBlocks.push(this),e.sharedData.blocksWithDefines.push(this),e._emitFunctionFromInclude("clipPlaneFragmentDeclaration",t),e.compilationString+=e._emitCodeFromInclude("clipPlaneFragment",t),this}}(0,l.H)("BABYLON.ClipPlanesBlock",zu);var Wu=i(3426),Hu=i(3841);class Xu extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("left",ou.E.AutoDetect),this.registerInput("right",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1)}getClassName(){return"AddBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = ${this.left.associatedVariableName} + ${this.right.associatedVariableName};\r\n`,this}}(0,l.H)("BABYLON.AddBlock",Xu);class ju extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("input",ou.E.AutoDetect),this.registerInput("factor",ou.E.Float),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0]}getClassName(){return"ScaleBlock"}get input(){return this._inputs[0]}get factor(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = ${this.input.associatedVariableName} * ${this.factor.associatedVariableName};\r\n`,this}}(0,l.H)("BABYLON.ScaleBlock",ju);class Yu extends du.k{constructor(e){super(e,ru.u.Neutral),this.minimum=0,this.maximum=1,this.registerInput("value",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0]}getClassName(){return"ClampBlock"}get value(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = clamp(${this.value.associatedVariableName}, ${this._writeFloat(this.minimum)}, ${this._writeFloat(this.maximum)});\r\n`,this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode()+`${this._codeVariableName}.minimum = ${this.minimum};\r\n`;return e+=`${this._codeVariableName}.maximum = ${this.maximum};\r\n`,e}serialize(){const e=super.serialize();return e.minimum=this.minimum,e.maximum=this.maximum,e}_deserialize(e,t,i){super._deserialize(e,t,i),this.minimum=e.minimum,this.maximum=e.maximum}}(0,be.gn)([(0,xu.p)("Minimum",xu.U.Float)],Yu.prototype,"minimum",void 0),(0,be.gn)([(0,xu.p)("Maximum",xu.U.Float)],Yu.prototype,"maximum",void 0),(0,l.H)("BABYLON.ClampBlock",Yu);class qu extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("left",ou.E.AutoDetect),this.registerInput("right",ou.E.AutoDetect),this.registerOutput("output",ou.E.Vector3),this._linkConnectionTypes(0,1),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Float),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Matrix),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Vector2),this._inputs[1].excludedConnectionPointTypes.push(ou.E.Float),this._inputs[1].excludedConnectionPointTypes.push(ou.E.Matrix),this._inputs[1].excludedConnectionPointTypes.push(ou.E.Vector2)}getClassName(){return"CrossBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = cross(${this.left.associatedVariableName}.xyz, ${this.right.associatedVariableName}.xyz);\r\n`,this}}(0,l.H)("BABYLON.CrossBlock",qu);class Ku extends du.k{get options(){return this._options}set options(e){this._deserializeOptions(e)}constructor(e){super(e)}getClassName(){return"CustomBlock"}_buildBlock(e){super._buildBlock(e);let t=this._code,i=this._options.functionName;this._inputs.forEach((n=>{const s=new RegExp("\\{TYPE_"+n.name+"\\}","gm"),r=e._getGLType(n.type);t=t.replace(s,r),i=i.replace(s,r)})),this._outputs.forEach((n=>{const s=new RegExp("\\{TYPE_"+n.name+"\\}","gm"),r=e._getGLType(n.type);t=t.replace(s,r),i=i.replace(s,r)})),e._emitFunction(i,t,""),this._outputs.forEach((t=>{e.compilationString+=this._declareOutput(t,e)+";\r\n"})),e.compilationString+=i+"(";let n=!1;return this._inputs.forEach(((t,i)=>{i>0&&(e.compilationString+=", "),e.compilationString+=t.associatedVariableName,n=!0})),this._outputs.forEach(((t,i)=>{(i>0||n)&&(e.compilationString+=", "),e.compilationString+=t.associatedVariableName})),e.compilationString+=");\r\n",this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.options = ${JSON.stringify(this._options)};\r\n`,e}serialize(){const e=super.serialize();return e.options=this._options,e}_deserialize(e,t,i){this._deserializeOptions(e.options),super._deserialize(e,t,i)}_deserializeOptions(e){var t,i,n;this._options=e,this._code=e.code.join("\r\n")+"\r\n",this.name=this.name||e.name,this.target=ru.u[e.target],null===(t=e.inParameters)||void 0===t||t.forEach(((e,t)=>{const i=ou.E[e.type];this.registerInput(e.name,i),Object.defineProperty(this,e.name,{get:function(){return this._inputs[t]},enumerable:!0,configurable:!0})})),null===(i=e.outParameters)||void 0===i||i.forEach(((e,t)=>{this.registerOutput(e.name,ou.E[e.type]),Object.defineProperty(this,e.name,{get:function(){return this._outputs[t]},enumerable:!0,configurable:!0}),"BasedOnInput"===e.type&&(this._outputs[t]._typeConnectionSource=this._findInputByName(e.typeFromInput)[0])})),null===(n=e.inLinkedConnectionTypes)||void 0===n||n.forEach((e=>{this._linkConnectionTypes(this._findInputByName(e.input1)[1],this._findInputByName(e.input2)[1])}))}_findInputByName(e){if(!e)return null;for(let t=0;t<this._inputs.length;t++)if(this._inputs[t].name===e)return[this._inputs[t],t];return null}}(0,l.H)("BABYLON.CustomBlock",Ku);class $u extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("left",ou.E.AutoDetect),this.registerInput("right",ou.E.AutoDetect),this.registerOutput("output",ou.E.Float),this._linkConnectionTypes(0,1),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Float),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Matrix),this._inputs[1].excludedConnectionPointTypes.push(ou.E.Float),this._inputs[1].excludedConnectionPointTypes.push(ou.E.Matrix)}getClassName(){return"DotBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = dot(${this.left.associatedVariableName}, ${this.right.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.DotBlock",$u);var Qu=i(7238),Zu=i(2864);class Ju extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("input",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._inputs[0].excludedConnectionPointTypes.push(ou.E.Float),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Matrix)}getClassName(){return"NormalizeBlock"}get input(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0],i=this._inputs[0];return e.compilationString+=this._declareOutput(t,e)+` = normalize(${i.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.NormalizeBlock",Ju);var ed=i(3069);class td extends du.k{constructor(e){super(e,ru.u.Neutral),this.rSwizzle="r",this.gSwizzle="g",this.bSwizzle="b",this.aSwizzle="a",this.registerInput("rgb ",ou.E.Color3,!0),this.registerInput("r",ou.E.Float,!0),this.registerInput("g",ou.E.Float,!0),this.registerInput("b",ou.E.Float,!0),this.registerInput("a",ou.E.Float,!0),this.registerOutput("rgba",ou.E.Color4),this.registerOutput("rgb",ou.E.Color3)}getClassName(){return"ColorMergerBlock"}get rgbIn(){return this._inputs[0]}get r(){return this._inputs[1]}get g(){return this._inputs[2]}get b(){return this._inputs[3]}get a(){return this._inputs[4]}get rgba(){return this._outputs[0]}get rgbOut(){return this._outputs[1]}get rgb(){return this.rgbOut}_inputRename(e){return"rgb "===e?"rgbIn":e}_buildSwizzle(e){return"."+(this.rSwizzle+this.gSwizzle+this.bSwizzle+this.aSwizzle).substr(0,e)}_buildBlock(e){super._buildBlock(e);const t=this.r,i=this.g,n=this.b,s=this.a,r=this.rgbIn,o=this._outputs[0],a=this._outputs[1];return r.isConnected?(o.hasEndpoints&&(e.compilationString+=this._declareOutput(o,e)+` = vec4(${r.associatedVariableName}, ${s.isConnected?this._writeVariable(s):"0.0"})${this._buildSwizzle(4)};\r\n`),a.hasEndpoints&&(e.compilationString+=this._declareOutput(a,e)+` = ${r.associatedVariableName}${this._buildSwizzle(3)};\r\n`)):(o.hasEndpoints&&(e.compilationString+=this._declareOutput(o,e)+` = vec4(${t.isConnected?this._writeVariable(t):"0.0"}, ${i.isConnected?this._writeVariable(i):"0.0"}, ${n.isConnected?this._writeVariable(n):"0.0"}, ${s.isConnected?this._writeVariable(s):"0.0"})${this._buildSwizzle(4)};\r\n`),a.hasEndpoints&&(e.compilationString+=this._declareOutput(a,e)+` = vec3(${t.isConnected?this._writeVariable(t):"0.0"}, ${i.isConnected?this._writeVariable(i):"0.0"}, ${n.isConnected?this._writeVariable(n):"0.0"})${this._buildSwizzle(3)};\r\n`)),this}serialize(){const e=super.serialize();return e.rSwizzle=this.rSwizzle,e.gSwizzle=this.gSwizzle,e.bSwizzle=this.bSwizzle,e.aSwizzle=this.aSwizzle,e}_deserialize(e,t,i){var n,s,r,o;super._deserialize(e,t,i),this.rSwizzle=null!==(n=e.rSwizzle)&&void 0!==n?n:"r",this.gSwizzle=null!==(s=e.gSwizzle)&&void 0!==s?s:"g",this.bSwizzle=null!==(r=e.bSwizzle)&&void 0!==r?r:"b",this.aSwizzle=null!==(o=e.aSwizzle)&&void 0!==o?o:"a"}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.rSwizzle = "${this.rSwizzle}";\r\n`,e+=`${this._codeVariableName}.gSwizzle = "${this.gSwizzle}";\r\n`,e+=`${this._codeVariableName}.bSwizzle = "${this.bSwizzle}";\r\n`,e+=`${this._codeVariableName}.aSwizzle = "${this.aSwizzle}";\r\n`,e}}(0,l.H)("BABYLON.ColorMergerBlock",td);var id,nd=i(8982),sd=i(8022);class rd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("xyzw",ou.E.Vector4,!0),this.registerInput("xyz ",ou.E.Vector3,!0),this.registerInput("xy ",ou.E.Vector2,!0),this.registerOutput("xyz",ou.E.Vector3),this.registerOutput("xy",ou.E.Vector2),this.registerOutput("zw",ou.E.Vector2),this.registerOutput("x",ou.E.Float),this.registerOutput("y",ou.E.Float),this.registerOutput("z",ou.E.Float),this.registerOutput("w",ou.E.Float),this.inputsAreExclusive=!0}getClassName(){return"VectorSplitterBlock"}get xyzw(){return this._inputs[0]}get xyzIn(){return this._inputs[1]}get xyIn(){return this._inputs[2]}get xyzOut(){return this._outputs[0]}get xyOut(){return this._outputs[1]}get zw(){return this._outputs[2]}get x(){return this._outputs[3]}get y(){return this._outputs[4]}get z(){return this._outputs[5]}get w(){return this._outputs[6]}_inputRename(e){switch(e){case"xy ":return"xyIn";case"xyz ":return"xyzIn";default:return e}}_outputRename(e){switch(e){case"xy":return"xyOut";case"xyz":return"xyzOut";default:return e}}_buildBlock(e){super._buildBlock(e);const t=this.xyzw.isConnected?this.xyzw:this.xyzIn.isConnected?this.xyzIn:this.xyIn,i=this._outputs[0],n=this._outputs[1],s=this._outputs[2],r=this._outputs[3],o=this._outputs[4],a=this._outputs[5],l=this._outputs[6];return i.hasEndpoints&&(t===this.xyIn?e.compilationString+=this._declareOutput(i,e)+` = vec3(${t.associatedVariableName}, 0.0);\r\n`:e.compilationString+=this._declareOutput(i,e)+` = ${t.associatedVariableName}.xyz;\r\n`),s.hasEndpoints&&this.xyzw.isConnected&&(e.compilationString+=this._declareOutput(s,e)+` = ${this.xyzw.associatedVariableName}.zw;\r\n`),n.hasEndpoints&&(e.compilationString+=this._declareOutput(n,e)+` = ${t.associatedVariableName}.xy;\r\n`),r.hasEndpoints&&(e.compilationString+=this._declareOutput(r,e)+` = ${t.associatedVariableName}.x;\r\n`),o.hasEndpoints&&(e.compilationString+=this._declareOutput(o,e)+` = ${t.associatedVariableName}.y;\r\n`),a.hasEndpoints&&(e.compilationString+=this._declareOutput(a,e)+` = ${t.associatedVariableName}.z;\r\n`),l.hasEndpoints&&(e.compilationString+=this._declareOutput(l,e)+` = ${t.associatedVariableName}.w;\r\n`),this}}(0,l.H)("BABYLON.VectorSplitterBlock",rd);class od extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("left",ou.E.AutoDetect),this.registerInput("right",ou.E.AutoDetect),this.registerInput("gradient",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1),this._linkConnectionTypes(1,2,!0),this._inputs[2].acceptedConnectionPointTypes.push(ou.E.Float)}getClassName(){return"LerpBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get gradient(){return this._inputs[2]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = mix(${this.left.associatedVariableName} , ${this.right.associatedVariableName}, ${this.gradient.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.LerpBlock",od);class ad extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("left",ou.E.AutoDetect),this.registerInput("right",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1)}getClassName(){return"DivideBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = ${this.left.associatedVariableName} / ${this.right.associatedVariableName};\r\n`,this}}(0,l.H)("BABYLON.DivideBlock",ad);class ld extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("left",ou.E.AutoDetect),this.registerInput("right",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1)}getClassName(){return"SubtractBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = ${this.left.associatedVariableName} - ${this.right.associatedVariableName};\r\n`,this}}(0,l.H)("BABYLON.SubtractBlock",ld);class hd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("value",ou.E.Float),this.registerInput("edge",ou.E.Float),this.registerOutput("output",ou.E.Float)}getClassName(){return"StepBlock"}get value(){return this._inputs[0]}get edge(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = step(${this.edge.associatedVariableName}, ${this.value.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.StepBlock",hd);class cd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("input",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._outputs[0].excludedConnectionPointTypes.push(ou.E.Matrix)}getClassName(){return"OneMinusBlock"}get input(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = 1. - ${this.input.associatedVariableName};\r\n`,this}}(0,l.H)("BABYLON.OneMinusBlock",cd),(0,l.H)("BABYLON.OppositeBlock",cd);class ud extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("worldPosition",ou.E.Vector4),this.registerInput("cameraPosition",ou.E.Vector3),this.registerOutput("output",ou.E.Vector3)}getClassName(){return"ViewDirectionBlock"}get worldPosition(){return this._inputs[0]}get cameraPosition(){return this._inputs[1]}get output(){return this._outputs[0]}autoConfigure(e){if(!this.cameraPosition.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.CameraPosition));t||(t=new fu.S("cameraPosition"),t.setAsSystemValue(lu.$.CameraPosition)),t.output.connectTo(this.cameraPosition)}}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = normalize(${this.cameraPosition.associatedVariableName} - ${this.worldPosition.associatedVariableName}.xyz);\r\n`,this}}(0,l.H)("BABYLON.ViewDirectionBlock",ud),i(8491);class dd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("worldNormal",ou.E.Vector4),this.registerInput("viewDirection",ou.E.Vector3),this.registerInput("bias",ou.E.Float),this.registerInput("power",ou.E.Float),this.registerOutput("fresnel",ou.E.Float)}getClassName(){return"FresnelBlock"}get worldNormal(){return this._inputs[0]}get viewDirection(){return this._inputs[1]}get bias(){return this._inputs[2]}get power(){return this._inputs[3]}get fresnel(){return this._outputs[0]}autoConfigure(e){if(!this.viewDirection.isConnected){const t=new ud("View direction");t.output.connectTo(this.viewDirection),t.autoConfigure(e)}if(!this.bias.isConnected){const e=new fu.S("bias");e.value=0,e.output.connectTo(this.bias)}if(!this.power.isConnected){const e=new fu.S("power");e.value=1,e.output.connectTo(this.power)}}_buildBlock(e){super._buildBlock(e);const t=`//${this.name}`;return e._emitFunctionFromInclude("fresnelFunction",t,{removeIfDef:!0}),e.compilationString+=this._declareOutput(this.fresnel,e)+` = computeFresnelTerm(${this.viewDirection.associatedVariableName}.xyz, ${this.worldNormal.associatedVariableName}.xyz, ${this.bias.associatedVariableName}, ${this.power.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.FresnelBlock",dd);class pd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("left",ou.E.AutoDetect),this.registerInput("right",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1)}getClassName(){return"MaxBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = max(${this.left.associatedVariableName}, ${this.right.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.MaxBlock",pd);class fd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("left",ou.E.AutoDetect),this.registerInput("right",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1)}getClassName(){return"MinBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = min(${this.left.associatedVariableName}, ${this.right.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.MinBlock",fd);class _d extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("left",ou.E.AutoDetect),this.registerInput("right",ou.E.AutoDetect),this.registerOutput("output",ou.E.Float),this._linkConnectionTypes(0,1),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Float),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Matrix),this._inputs[1].excludedConnectionPointTypes.push(ou.E.Float),this._inputs[1].excludedConnectionPointTypes.push(ou.E.Matrix)}getClassName(){return"DistanceBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = length(${this.left.associatedVariableName} - ${this.right.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.DistanceBlock",_d);class md extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("value",ou.E.AutoDetect),this.registerOutput("output",ou.E.Float),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Float),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Matrix)}getClassName(){return"LengthBlock"}get value(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = length(${this.value.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.LengthBlock",md);class gd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("value",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0]}getClassName(){return"NegateBlock"}get value(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = -1.0 * ${this.value.associatedVariableName};\r\n`,this}}(0,l.H)("BABYLON.NegateBlock",gd);class vd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("value",ou.E.AutoDetect),this.registerInput("power",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1)}getClassName(){return"PowBlock"}get value(){return this._inputs[0]}get power(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = pow(${this.value.associatedVariableName}, ${this.power.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.PowBlock",vd);class yd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("seed",ou.E.AutoDetect),this.registerOutput("output",ou.E.Float),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(ou.E.Vector2|ou.E.Vector3|ou.E.Vector4|ou.E.Color3|ou.E.Color4)}getClassName(){return"RandomNumberBlock"}get seed(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0],i=`//${this.name}`;return e._emitFunctionFromInclude("helperFunctions",i),e.compilationString+=this._declareOutput(t,e)+` = getRand(${this.seed.associatedVariableName}.xy);\r\n`,this}}(0,l.H)("BABYLON.RandomNumberBlock",yd);class xd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("x",ou.E.Float),this.registerInput("y",ou.E.Float),this.registerOutput("output",ou.E.Float)}getClassName(){return"ArcTan2Block"}get x(){return this._inputs[0]}get y(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = atan(${this.x.associatedVariableName}, ${this.y.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.ArcTan2Block",xd);class bd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("value",ou.E.AutoDetect),this.registerInput("edge0",ou.E.Float),this.registerInput("edge1",ou.E.Float),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0]}getClassName(){return"SmoothStepBlock"}get value(){return this._inputs[0]}get edge0(){return this._inputs[1]}get edge1(){return this._inputs[2]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = smoothstep(${this.edge0.associatedVariableName}, ${this.edge1.associatedVariableName}, ${this.value.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.SmoothStepBlock",bd);class Td extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("input",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0]}getClassName(){return"ReciprocalBlock"}get input(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return this.input.type===ou.E.Matrix?e.compilationString+=this._declareOutput(t,e)+` = inverse(${this.input.associatedVariableName});\r\n`:e.compilationString+=this._declareOutput(t,e)+` = 1. / ${this.input.associatedVariableName};\r\n`,this}}(0,l.H)("BABYLON.ReciprocalBlock",Td);class Sd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("value",ou.E.AutoDetect),this.registerInput("reference",ou.E.AutoDetect),this.registerInput("distance",ou.E.Float),this.registerInput("replacement",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1),this._linkConnectionTypes(0,3),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Float),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Matrix),this._inputs[1].excludedConnectionPointTypes.push(ou.E.Float),this._inputs[1].excludedConnectionPointTypes.push(ou.E.Matrix),this._inputs[3].excludedConnectionPointTypes.push(ou.E.Float),this._inputs[3].excludedConnectionPointTypes.push(ou.E.Matrix)}getClassName(){return"ReplaceColorBlock"}get value(){return this._inputs[0]}get reference(){return this._inputs[1]}get distance(){return this._inputs[2]}get replacement(){return this._inputs[3]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+";\r\n",e.compilationString+=`if (length(${this.value.associatedVariableName} - ${this.reference.associatedVariableName}) < ${this.distance.associatedVariableName}) {\r\n`,e.compilationString+=`${t.associatedVariableName} = ${this.replacement.associatedVariableName};\r\n`,e.compilationString+="} else {\r\n",e.compilationString+=`${t.associatedVariableName} = ${this.value.associatedVariableName};\r\n`,e.compilationString+="}\r\n",this}}(0,l.H)("BABYLON.ReplaceColorBlock",Sd);class Ed extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("value",ou.E.AutoDetect),this.registerInput("steps",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1),this._inputs[0].excludedConnectionPointTypes.push(ou.E.Matrix),this._inputs[1].excludedConnectionPointTypes.push(ou.E.Matrix)}getClassName(){return"PosterizeBlock"}get value(){return this._inputs[0]}get steps(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = floor(${this.value.associatedVariableName} / (1.0 / ${this.steps.associatedVariableName})) * (1.0 / ${this.steps.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.PosterizeBlock",Ed),function(e){e[e.SawTooth=0]="SawTooth",e[e.Square=1]="Square",e[e.Triangle=2]="Triangle"}(id||(id={}));class Cd extends du.k{constructor(e){super(e,ru.u.Neutral),this.kind=id.SawTooth,this.registerInput("input",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._inputs[0].excludedConnectionPointTypes.push(ou.E.Matrix)}getClassName(){return"WaveBlock"}get input(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];switch(this.kind){case id.SawTooth:e.compilationString+=this._declareOutput(t,e)+` = ${this.input.associatedVariableName} - floor(0.5 + ${this.input.associatedVariableName});\r\n`;break;case id.Square:e.compilationString+=this._declareOutput(t,e)+` = 1.0 - 2.0 * round(fract(${this.input.associatedVariableName}));\r\n`;break;case id.Triangle:e.compilationString+=this._declareOutput(t,e)+` = 2.0 * abs(2.0 * (${this.input.associatedVariableName} - floor(0.5 + ${this.input.associatedVariableName}))) - 1.0;\r\n`}return this}serialize(){const e=super.serialize();return e.kind=this.kind,e}_deserialize(e,t,i){super._deserialize(e,t,i),this.kind=e.kind}}(0,l.H)("BABYLON.WaveBlock",Cd);class Ad{get step(){return this._step}set step(e){this._step=e}get color(){return this._color}set color(e){this._color=e}constructor(e,t){this.step=e,this.color=t}}class Pd extends du.k{colorStepsUpdated(){this.onValueChangedObservable.notifyObservers(this)}constructor(e){super(e,ru.u.Neutral),this.colorSteps=[new Ad(0,a.Wo.Black()),new Ad(1,a.Wo.White())],this.onValueChangedObservable=new r.y$,this.registerInput("gradient",ou.E.AutoDetect),this.registerOutput("output",ou.E.Color3),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(ou.E.Float|ou.E.Vector2|ou.E.Vector3|ou.E.Vector4|ou.E.Color3|ou.E.Color4)}getClassName(){return"GradientBlock"}get gradient(){return this._inputs[0]}get output(){return this._outputs[0]}_writeColorConstant(e){const t=this.colorSteps[e];return`vec3(${t.color.r}, ${t.color.g}, ${t.color.b})`}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];if(!this.colorSteps.length||!this.gradient.connectedPoint)return void(e.compilationString+=this._declareOutput(t,e)+" = vec3(0., 0., 0.);\r\n");const i=e._getFreeVariableName("gradientTempColor"),n=e._getFreeVariableName("gradientTempPosition");e.compilationString+=`vec3 ${i} = ${this._writeColorConstant(0)};\r\n`,e.compilationString+=`float ${n};\r\n`;let s=this.gradient.associatedVariableName;this.gradient.connectedPoint.type!==ou.E.Float&&(s+=".x");for(let t=1;t<this.colorSteps.length;t++){const r=this.colorSteps[t],o=this.colorSteps[t-1];e.compilationString+=`${n} = clamp((${s} - ${e._emitFloat(o.step)}) / (${e._emitFloat(r.step)} -  ${e._emitFloat(o.step)}), 0.0, 1.0) * step(${e._emitFloat(t)}, ${e._emitFloat(this.colorSteps.length-1)});\r\n`,e.compilationString+=`${i} = mix(${i}, ${this._writeColorConstant(t)}, ${n});\r\n`}return e.compilationString+=this._declareOutput(t,e)+` = ${i};\r\n`,this}serialize(){const e=super.serialize();e.colorSteps=[];for(const t of this.colorSteps)e.colorSteps.push({step:t.step,color:{r:t.color.r,g:t.color.g,b:t.color.b}});return e}_deserialize(e,t,i){super._deserialize(e,t,i),this.colorSteps.length=0;for(const t of e.colorSteps)this.colorSteps.push(new Ad(t.step,new a.Wo(t.color.r,t.color.g,t.color.b)))}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();e+=`${this._codeVariableName}.colorSteps = [];\r\n`;for(const t of this.colorSteps)e+=`${this._codeVariableName}.colorSteps.push(new BABYLON.GradientBlockColorStep(${t.step}, new BABYLON.Color3(${t.color.r}, ${t.color.g}, ${t.color.b})));\r\n`;return e}}(0,l.H)("BABYLON.GradientBlock",Pd);class Rd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("left",ou.E.AutoDetect),this.registerInput("right",ou.E.AutoDetect),this.registerInput("gradient",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1),this._linkConnectionTypes(1,2,!0),this._inputs[2].acceptedConnectionPointTypes.push(ou.E.Float)}getClassName(){return"NLerpBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get gradient(){return this._inputs[2]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = normalize(mix(${this.left.associatedVariableName} , ${this.right.associatedVariableName}, ${this.gradient.associatedVariableName}));\r\n`,this}}(0,l.H)("BABYLON.NLerpBlock",Rd);class Md extends du.k{constructor(e){super(e,ru.u.Neutral),this.manhattanDistance=!1,this.registerInput("seed",ou.E.Vector3),this.registerInput("jitter",ou.E.Float),this.registerOutput("output",ou.E.Vector2),this.registerOutput("x",ou.E.Float),this.registerOutput("y",ou.E.Float)}getClassName(){return"WorleyNoise3DBlock"}get seed(){return this._inputs[0]}get jitter(){return this._inputs[1]}get output(){return this._outputs[0]}get x(){return this._outputs[1]}get y(){return this._outputs[2]}_buildBlock(e){if(super._buildBlock(e),!this.seed.isConnected)return;if(!this.output.hasEndpoints&&!this.x.hasEndpoints&&!this.y.hasEndpoints)return;let t="vec3 permute(vec3 x){\r\n";t+="    return mod((34.0 * x + 1.0) * x, 289.0);\r\n",t+="}\r\n\r\n",t+="vec3 dist(vec3 x, vec3 y, vec3 z,  bool manhattanDistance){\r\n",t+="    return manhattanDistance ?  abs(x) + abs(y) + abs(z) :  (x * x + y * y + z * z);\r\n",t+="}\r\n\r\n",t+="vec2 worley(vec3 P, float jitter, bool manhattanDistance){\r\n",t+="    float K = 0.142857142857; // 1/7\r\n",t+="    float Ko = 0.428571428571; // 1/2-K/2\r\n",t+="    float  K2 = 0.020408163265306; // 1/(7*7)\r\n",t+="    float Kz = 0.166666666667; // 1/6\r\n",t+="    float Kzo = 0.416666666667; // 1/2-1/6*2\r\n",t+="\r\n",t+="    vec3 Pi = mod(floor(P), 289.0);\r\n",t+="    vec3 Pf = fract(P) - 0.5;\r\n",t+="\r\n",t+="    vec3 Pfx = Pf.x + vec3(1.0, 0.0, -1.0);\r\n",t+="    vec3 Pfy = Pf.y + vec3(1.0, 0.0, -1.0);\r\n",t+="    vec3 Pfz = Pf.z + vec3(1.0, 0.0, -1.0);\r\n",t+="\r\n",t+="    vec3 p = permute(Pi.x + vec3(-1.0, 0.0, 1.0));\r\n",t+="    vec3 p1 = permute(p + Pi.y - 1.0);\r\n",t+="    vec3 p2 = permute(p + Pi.y);\r\n",t+="    vec3 p3 = permute(p + Pi.y + 1.0);\r\n",t+="\r\n",t+="    vec3 p11 = permute(p1 + Pi.z - 1.0);\r\n",t+="    vec3 p12 = permute(p1 + Pi.z);\r\n",t+="    vec3 p13 = permute(p1 + Pi.z + 1.0);\r\n",t+="\r\n",t+="    vec3 p21 = permute(p2 + Pi.z - 1.0);\r\n",t+="    vec3 p22 = permute(p2 + Pi.z);\r\n",t+="    vec3 p23 = permute(p2 + Pi.z + 1.0);\r\n",t+="\r\n",t+="    vec3 p31 = permute(p3 + Pi.z - 1.0);\r\n",t+="    vec3 p32 = permute(p3 + Pi.z);\r\n",t+="    vec3 p33 = permute(p3 + Pi.z + 1.0);\r\n",t+="\r\n",t+="    vec3 ox11 = fract(p11*K) - Ko;\r\n",t+="    vec3 oy11 = mod(floor(p11*K), 7.0)*K - Ko;\r\n",t+="    vec3 oz11 = floor(p11*K2)*Kz - Kzo; // p11 < 289 guaranteed\r\n",t+="\r\n",t+="    vec3 ox12 = fract(p12*K) - Ko;\r\n",t+="    vec3 oy12 = mod(floor(p12*K), 7.0)*K - Ko;\r\n",t+="    vec3 oz12 = floor(p12*K2)*Kz - Kzo;\r\n",t+="\r\n",t+="    vec3 ox13 = fract(p13*K) - Ko;\r\n",t+="    vec3 oy13 = mod(floor(p13*K), 7.0)*K - Ko;\r\n",t+="    vec3 oz13 = floor(p13*K2)*Kz - Kzo;\r\n",t+="\r\n",t+="    vec3 ox21 = fract(p21*K) - Ko;\r\n",t+="    vec3 oy21 = mod(floor(p21*K), 7.0)*K - Ko;\r\n",t+="    vec3 oz21 = floor(p21*K2)*Kz - Kzo;\r\n",t+="\r\n",t+="    vec3 ox22 = fract(p22*K) - Ko;\r\n",t+="    vec3 oy22 = mod(floor(p22*K), 7.0)*K - Ko;\r\n",t+="    vec3 oz22 = floor(p22*K2)*Kz - Kzo;\r\n",t+="\r\n",t+="    vec3 ox23 = fract(p23*K) - Ko;\r\n",t+="    vec3 oy23 = mod(floor(p23*K), 7.0)*K - Ko;\r\n",t+="    vec3 oz23 = floor(p23*K2)*Kz - Kzo;\r\n",t+="\r\n",t+="    vec3 ox31 = fract(p31*K) - Ko;\r\n",t+="    vec3 oy31 = mod(floor(p31*K), 7.0)*K - Ko;\r\n",t+="    vec3 oz31 = floor(p31*K2)*Kz - Kzo;\r\n",t+="\r\n",t+="    vec3 ox32 = fract(p32*K) - Ko;\r\n",t+="    vec3 oy32 = mod(floor(p32*K), 7.0)*K - Ko;\r\n",t+="    vec3 oz32 = floor(p32*K2)*Kz - Kzo;\r\n",t+="\r\n",t+="    vec3 ox33 = fract(p33*K) - Ko;\r\n",t+="    vec3 oy33 = mod(floor(p33*K), 7.0)*K - Ko;\r\n",t+="    vec3 oz33 = floor(p33*K2)*Kz - Kzo;\r\n",t+="\r\n",t+="    vec3 dx11 = Pfx + jitter*ox11;\r\n",t+="    vec3 dy11 = Pfy.x + jitter*oy11;\r\n",t+="    vec3 dz11 = Pfz.x + jitter*oz11;\r\n",t+="\r\n",t+="    vec3 dx12 = Pfx + jitter*ox12;\r\n",t+="    vec3 dy12 = Pfy.x + jitter*oy12;\r\n",t+="    vec3 dz12 = Pfz.y + jitter*oz12;\r\n",t+="\r\n",t+="    vec3 dx13 = Pfx + jitter*ox13;\r\n",t+="    vec3 dy13 = Pfy.x + jitter*oy13;\r\n",t+="    vec3 dz13 = Pfz.z + jitter*oz13;\r\n",t+="\r\n",t+="    vec3 dx21 = Pfx + jitter*ox21;\r\n",t+="    vec3 dy21 = Pfy.y + jitter*oy21;\r\n",t+="    vec3 dz21 = Pfz.x + jitter*oz21;\r\n",t+="\r\n",t+="    vec3 dx22 = Pfx + jitter*ox22;\r\n",t+="    vec3 dy22 = Pfy.y + jitter*oy22;\r\n",t+="    vec3 dz22 = Pfz.y + jitter*oz22;\r\n",t+="\r\n",t+="    vec3 dx23 = Pfx + jitter*ox23;\r\n",t+="    vec3 dy23 = Pfy.y + jitter*oy23;\r\n",t+="    vec3 dz23 = Pfz.z + jitter*oz23;\r\n",t+="\r\n",t+="    vec3 dx31 = Pfx + jitter*ox31;\r\n",t+="    vec3 dy31 = Pfy.z + jitter*oy31;\r\n",t+="    vec3 dz31 = Pfz.x + jitter*oz31;\r\n",t+="\r\n",t+="    vec3 dx32 = Pfx + jitter*ox32;\r\n",t+="    vec3 dy32 = Pfy.z + jitter*oy32;\r\n",t+="    vec3 dz32 = Pfz.y + jitter*oz32;\r\n",t+="\r\n",t+="    vec3 dx33 = Pfx + jitter*ox33;\r\n",t+="    vec3 dy33 = Pfy.z + jitter*oy33;\r\n",t+="    vec3 dz33 = Pfz.z + jitter*oz33;\r\n",t+="\r\n",t+="    vec3 d11 = dist(dx11, dy11, dz11, manhattanDistance);\r\n",t+="    vec3 d12 =dist(dx12, dy12, dz12, manhattanDistance);\r\n",t+="    vec3 d13 = dist(dx13, dy13, dz13, manhattanDistance);\r\n",t+="    vec3 d21 = dist(dx21, dy21, dz21, manhattanDistance);\r\n",t+="    vec3 d22 = dist(dx22, dy22, dz22, manhattanDistance);\r\n",t+="    vec3 d23 = dist(dx23, dy23, dz23, manhattanDistance);\r\n",t+="    vec3 d31 = dist(dx31, dy31, dz31, manhattanDistance);\r\n",t+="    vec3 d32 = dist(dx32, dy32, dz32, manhattanDistance);\r\n",t+="    vec3 d33 = dist(dx33, dy33, dz33, manhattanDistance);\r\n",t+="\r\n",t+="    vec3 d1a = min(d11, d12);\r\n",t+="    d12 = max(d11, d12);\r\n",t+="    d11 = min(d1a, d13); // Smallest now not in d12 or d13\r\n",t+="    d13 = max(d1a, d13);\r\n",t+="    d12 = min(d12, d13); // 2nd smallest now not in d13\r\n",t+="    vec3 d2a = min(d21, d22);\r\n",t+="    d22 = max(d21, d22);\r\n",t+="    d21 = min(d2a, d23); // Smallest now not in d22 or d23\r\n",t+="    d23 = max(d2a, d23);\r\n",t+="    d22 = min(d22, d23); // 2nd smallest now not in d23\r\n",t+="    vec3 d3a = min(d31, d32);\r\n",t+="    d32 = max(d31, d32);\r\n",t+="    d31 = min(d3a, d33); // Smallest now not in d32 or d33\r\n",t+="    d33 = max(d3a, d33);\r\n",t+="    d32 = min(d32, d33); // 2nd smallest now not in d33\r\n",t+="    vec3 da = min(d11, d21);\r\n",t+="    d21 = max(d11, d21);\r\n",t+="    d11 = min(da, d31); // Smallest now in d11\r\n",t+="    d31 = max(da, d31); // 2nd smallest now not in d31\r\n",t+="    d11.xy = (d11.x < d11.y) ? d11.xy : d11.yx;\r\n",t+="    d11.xz = (d11.x < d11.z) ? d11.xz : d11.zx; // d11.x now smallest\r\n",t+="    d12 = min(d12, d21); // 2nd smallest now not in d21\r\n",t+="    d12 = min(d12, d22); // nor in d22\r\n",t+="    d12 = min(d12, d31); // nor in d31\r\n",t+="    d12 = min(d12, d32); // nor in d32\r\n",t+="    d11.yz = min(d11.yz,d12.xy); // nor in d12.yz\r\n",t+="    d11.y = min(d11.y,d12.z); // Only two more to go\r\n",t+="    d11.y = min(d11.y,d11.z); // Done! (Phew!)\r\n",t+="    return sqrt(d11.xy); // F1, F2\r\n",t+="}\r\n\r\n",e._emitFunction("worley3D","vec3 permute(vec3 x){\r\n    return mod((34.0 * x + 1.0) * x, 289.0);\r\n}\r\n\r\nvec3 dist(vec3 x, vec3 y, vec3 z,  bool manhattanDistance){\r\n    return manhattanDistance ?  abs(x) + abs(y) + abs(z) :  (x * x + y * y + z * z);\r\n}\r\n\r\nvec2 worley(vec3 P, float jitter, bool manhattanDistance){\r\n    float K = 0.142857142857; // 1/7\r\n    float Ko = 0.428571428571; // 1/2-K/2\r\n    float  K2 = 0.020408163265306; // 1/(7*7)\r\n    float Kz = 0.166666666667; // 1/6\r\n    float Kzo = 0.416666666667; // 1/2-1/6*2\r\n\r\n    vec3 Pi = mod(floor(P), 289.0);\r\n    vec3 Pf = fract(P) - 0.5;\r\n\r\n    vec3 Pfx = Pf.x + vec3(1.0, 0.0, -1.0);\r\n    vec3 Pfy = Pf.y + vec3(1.0, 0.0, -1.0);\r\n    vec3 Pfz = Pf.z + vec3(1.0, 0.0, -1.0);\r\n\r\n    vec3 p = permute(Pi.x + vec3(-1.0, 0.0, 1.0));\r\n    vec3 p1 = permute(p + Pi.y - 1.0);\r\n    vec3 p2 = permute(p + Pi.y);\r\n    vec3 p3 = permute(p + Pi.y + 1.0);\r\n\r\n    vec3 p11 = permute(p1 + Pi.z - 1.0);\r\n    vec3 p12 = permute(p1 + Pi.z);\r\n    vec3 p13 = permute(p1 + Pi.z + 1.0);\r\n\r\n    vec3 p21 = permute(p2 + Pi.z - 1.0);\r\n    vec3 p22 = permute(p2 + Pi.z);\r\n    vec3 p23 = permute(p2 + Pi.z + 1.0);\r\n\r\n    vec3 p31 = permute(p3 + Pi.z - 1.0);\r\n    vec3 p32 = permute(p3 + Pi.z);\r\n    vec3 p33 = permute(p3 + Pi.z + 1.0);\r\n\r\n    vec3 ox11 = fract(p11*K) - Ko;\r\n    vec3 oy11 = mod(floor(p11*K), 7.0)*K - Ko;\r\n    vec3 oz11 = floor(p11*K2)*Kz - Kzo; // p11 < 289 guaranteed\r\n\r\n    vec3 ox12 = fract(p12*K) - Ko;\r\n    vec3 oy12 = mod(floor(p12*K), 7.0)*K - Ko;\r\n    vec3 oz12 = floor(p12*K2)*Kz - Kzo;\r\n\r\n    vec3 ox13 = fract(p13*K) - Ko;\r\n    vec3 oy13 = mod(floor(p13*K), 7.0)*K - Ko;\r\n    vec3 oz13 = floor(p13*K2)*Kz - Kzo;\r\n\r\n    vec3 ox21 = fract(p21*K) - Ko;\r\n    vec3 oy21 = mod(floor(p21*K), 7.0)*K - Ko;\r\n    vec3 oz21 = floor(p21*K2)*Kz - Kzo;\r\n\r\n    vec3 ox22 = fract(p22*K) - Ko;\r\n    vec3 oy22 = mod(floor(p22*K), 7.0)*K - Ko;\r\n    vec3 oz22 = floor(p22*K2)*Kz - Kzo;\r\n\r\n    vec3 ox23 = fract(p23*K) - Ko;\r\n    vec3 oy23 = mod(floor(p23*K), 7.0)*K - Ko;\r\n    vec3 oz23 = floor(p23*K2)*Kz - Kzo;\r\n\r\n    vec3 ox31 = fract(p31*K) - Ko;\r\n    vec3 oy31 = mod(floor(p31*K), 7.0)*K - Ko;\r\n    vec3 oz31 = floor(p31*K2)*Kz - Kzo;\r\n\r\n    vec3 ox32 = fract(p32*K) - Ko;\r\n    vec3 oy32 = mod(floor(p32*K), 7.0)*K - Ko;\r\n    vec3 oz32 = floor(p32*K2)*Kz - Kzo;\r\n\r\n    vec3 ox33 = fract(p33*K) - Ko;\r\n    vec3 oy33 = mod(floor(p33*K), 7.0)*K - Ko;\r\n    vec3 oz33 = floor(p33*K2)*Kz - Kzo;\r\n\r\n    vec3 dx11 = Pfx + jitter*ox11;\r\n    vec3 dy11 = Pfy.x + jitter*oy11;\r\n    vec3 dz11 = Pfz.x + jitter*oz11;\r\n\r\n    vec3 dx12 = Pfx + jitter*ox12;\r\n    vec3 dy12 = Pfy.x + jitter*oy12;\r\n    vec3 dz12 = Pfz.y + jitter*oz12;\r\n\r\n    vec3 dx13 = Pfx + jitter*ox13;\r\n    vec3 dy13 = Pfy.x + jitter*oy13;\r\n    vec3 dz13 = Pfz.z + jitter*oz13;\r\n\r\n    vec3 dx21 = Pfx + jitter*ox21;\r\n    vec3 dy21 = Pfy.y + jitter*oy21;\r\n    vec3 dz21 = Pfz.x + jitter*oz21;\r\n\r\n    vec3 dx22 = Pfx + jitter*ox22;\r\n    vec3 dy22 = Pfy.y + jitter*oy22;\r\n    vec3 dz22 = Pfz.y + jitter*oz22;\r\n\r\n    vec3 dx23 = Pfx + jitter*ox23;\r\n    vec3 dy23 = Pfy.y + jitter*oy23;\r\n    vec3 dz23 = Pfz.z + jitter*oz23;\r\n\r\n    vec3 dx31 = Pfx + jitter*ox31;\r\n    vec3 dy31 = Pfy.z + jitter*oy31;\r\n    vec3 dz31 = Pfz.x + jitter*oz31;\r\n\r\n    vec3 dx32 = Pfx + jitter*ox32;\r\n    vec3 dy32 = Pfy.z + jitter*oy32;\r\n    vec3 dz32 = Pfz.y + jitter*oz32;\r\n\r\n    vec3 dx33 = Pfx + jitter*ox33;\r\n    vec3 dy33 = Pfy.z + jitter*oy33;\r\n    vec3 dz33 = Pfz.z + jitter*oz33;\r\n\r\n    vec3 d11 = dist(dx11, dy11, dz11, manhattanDistance);\r\n    vec3 d12 =dist(dx12, dy12, dz12, manhattanDistance);\r\n    vec3 d13 = dist(dx13, dy13, dz13, manhattanDistance);\r\n    vec3 d21 = dist(dx21, dy21, dz21, manhattanDistance);\r\n    vec3 d22 = dist(dx22, dy22, dz22, manhattanDistance);\r\n    vec3 d23 = dist(dx23, dy23, dz23, manhattanDistance);\r\n    vec3 d31 = dist(dx31, dy31, dz31, manhattanDistance);\r\n    vec3 d32 = dist(dx32, dy32, dz32, manhattanDistance);\r\n    vec3 d33 = dist(dx33, dy33, dz33, manhattanDistance);\r\n\r\n    vec3 d1a = min(d11, d12);\r\n    d12 = max(d11, d12);\r\n    d11 = min(d1a, d13); // Smallest now not in d12 or d13\r\n    d13 = max(d1a, d13);\r\n    d12 = min(d12, d13); // 2nd smallest now not in d13\r\n    vec3 d2a = min(d21, d22);\r\n    d22 = max(d21, d22);\r\n    d21 = min(d2a, d23); // Smallest now not in d22 or d23\r\n    d23 = max(d2a, d23);\r\n    d22 = min(d22, d23); // 2nd smallest now not in d23\r\n    vec3 d3a = min(d31, d32);\r\n    d32 = max(d31, d32);\r\n    d31 = min(d3a, d33); // Smallest now not in d32 or d33\r\n    d33 = max(d3a, d33);\r\n    d32 = min(d32, d33); // 2nd smallest now not in d33\r\n    vec3 da = min(d11, d21);\r\n    d21 = max(d11, d21);\r\n    d11 = min(da, d31); // Smallest now in d11\r\n    d31 = max(da, d31); // 2nd smallest now not in d31\r\n    d11.xy = (d11.x < d11.y) ? d11.xy : d11.yx;\r\n    d11.xz = (d11.x < d11.z) ? d11.xz : d11.zx; // d11.x now smallest\r\n    d12 = min(d12, d21); // 2nd smallest now not in d21\r\n    d12 = min(d12, d22); // nor in d22\r\n    d12 = min(d12, d31); // nor in d31\r\n    d12 = min(d12, d32); // nor in d32\r\n    d11.yz = min(d11.yz,d12.xy); // nor in d12.yz\r\n    d11.y = min(d11.y,d12.z); // Only two more to go\r\n    d11.y = min(d11.y,d11.z); // Done! (Phew!)\r\n    return sqrt(d11.xy); // F1, F2\r\n}\r\n\r\n","// Worley3D");const i=e._getFreeVariableName("worleyTemp");return e.compilationString+=`vec2 ${i} = worley(${this.seed.associatedVariableName}, ${this.jitter.associatedVariableName}, ${this.manhattanDistance});\r\n`,this.output.hasEndpoints&&(e.compilationString+=this._declareOutput(this.output,e)+` = ${i};\r\n`),this.x.hasEndpoints&&(e.compilationString+=this._declareOutput(this.x,e)+` = ${i}.x;\r\n`),this.y.hasEndpoints&&(e.compilationString+=this._declareOutput(this.y,e)+` = ${i}.y;\r\n`),this}_dumpPropertiesCode(){return super._dumpPropertiesCode()+`${this._codeVariableName}.manhattanDistance = ${this.manhattanDistance};\r\n`}serialize(){const e=super.serialize();return e.manhattanDistance=this.manhattanDistance,e}_deserialize(e,t,i){super._deserialize(e,t,i),this.manhattanDistance=e.manhattanDistance}}(0,be.gn)([(0,xu.p)("Use Manhattan Distance",xu.U.Boolean,"PROPERTIES",{notifiers:{update:!1}})],Md.prototype,"manhattanDistance",void 0),(0,l.H)("BABYLON.WorleyNoise3DBlock",Md);class Id extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("seed",ou.E.Vector3),this.registerOutput("output",ou.E.Float)}getClassName(){return"SimplexPerlin3DBlock"}get seed(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){if(super._buildBlock(e),!this.seed.isConnected)return;if(!this._outputs[0].hasEndpoints)return;let t="const float SKEWFACTOR = 1.0/3.0;\r\n";return t+="const float UNSKEWFACTOR = 1.0/6.0;\r\n",t+="const float SIMPLEX_CORNER_POS = 0.5;\r\n",t+="const float SIMPLEX_TETRAHADRON_HEIGHT = 0.70710678118654752440084436210485;\r\n",t+="float SimplexPerlin3D( vec3 P ){\r\n",t+="    P.x = P == vec3(0., 0., 0.) ? 0.00001 : P.x;\r\n",t+="    P *= SIMPLEX_TETRAHADRON_HEIGHT;\r\n",t+="    vec3 Pi = floor( P + dot( P, vec3( SKEWFACTOR) ) );",t+="    vec3 x0 = P - Pi + dot(Pi, vec3( UNSKEWFACTOR ) );\r\n",t+="    vec3 g = step(x0.yzx, x0.xyz);\r\n",t+="    vec3 l = 1.0 - g;\r\n",t+="    vec3 Pi_1 = min( g.xyz, l.zxy );\r\n",t+="    vec3 Pi_2 = max( g.xyz, l.zxy );\r\n",t+="    vec3 x1 = x0 - Pi_1 + UNSKEWFACTOR;\r\n",t+="    vec3 x2 = x0 - Pi_2 + SKEWFACTOR;\r\n",t+="    vec3 x3 = x0 - SIMPLEX_CORNER_POS;\r\n",t+="    vec4 v1234_x = vec4( x0.x, x1.x, x2.x, x3.x );\r\n",t+="    vec4 v1234_y = vec4( x0.y, x1.y, x2.y, x3.y );\r\n",t+="    vec4 v1234_z = vec4( x0.z, x1.z, x2.z, x3.z );\r\n",t+="    Pi.xyz = Pi.xyz - floor(Pi.xyz * ( 1.0 / 69.0 )) * 69.0;\r\n",t+="    vec3 Pi_inc1 = step( Pi, vec3( 69.0 - 1.5 ) ) * ( Pi + 1.0 );\r\n",t+="    vec4 Pt = vec4( Pi.xy, Pi_inc1.xy ) + vec2( 50.0, 161.0 ).xyxy;\r\n",t+="    Pt *= Pt;\r\n",t+="    vec4 V1xy_V2xy = mix( Pt.xyxy, Pt.zwzw, vec4( Pi_1.xy, Pi_2.xy ) );\r\n",t+="    Pt = vec4( Pt.x, V1xy_V2xy.xz, Pt.z ) * vec4( Pt.y, V1xy_V2xy.yw, Pt.w );\r\n",t+="    const vec3 SOMELARGEFLOATS = vec3( 635.298681, 682.357502, 668.926525 );\r\n",t+="    const vec3 ZINC = vec3( 48.500388, 65.294118, 63.934599 );\r\n",t+="    vec3 lowz_mods = vec3( 1.0 / ( SOMELARGEFLOATS.xyz + Pi.zzz * ZINC.xyz ) );\r\n",t+="    vec3 highz_mods = vec3( 1.0 / ( SOMELARGEFLOATS.xyz + Pi_inc1.zzz * ZINC.xyz ) );\r\n",t+="    Pi_1 = ( Pi_1.z < 0.5 ) ? lowz_mods : highz_mods;\r\n",t+="    Pi_2 = ( Pi_2.z < 0.5 ) ? lowz_mods : highz_mods;\r\n",t+="    vec4 hash_0 = fract( Pt * vec4( lowz_mods.x, Pi_1.x, Pi_2.x, highz_mods.x ) ) - 0.49999;\r\n",t+="    vec4 hash_1 = fract( Pt * vec4( lowz_mods.y, Pi_1.y, Pi_2.y, highz_mods.y ) ) - 0.49999;\r\n",t+="    vec4 hash_2 = fract( Pt * vec4( lowz_mods.z, Pi_1.z, Pi_2.z, highz_mods.z ) ) - 0.49999;\r\n",t+="    vec4 grad_results = inversesqrt( hash_0 * hash_0 + hash_1 * hash_1 + hash_2 * hash_2 ) * ( hash_0 * v1234_x + hash_1 * v1234_y + hash_2 * v1234_z );\r\n",t+="    const float FINAL_NORMALIZATION = 37.837227241611314102871574478976;\r\n",t+="    vec4 kernel_weights = v1234_x * v1234_x + v1234_y * v1234_y + v1234_z * v1234_z;\r\n",t+="    kernel_weights = max(0.5 - kernel_weights, 0.0);\r\n",t+="    kernel_weights = kernel_weights*kernel_weights*kernel_weights;\r\n",t+="    return dot( kernel_weights, grad_results ) * FINAL_NORMALIZATION;\r\n",t+="}\r\n",e._emitFunction("SimplexPerlin3D","const float SKEWFACTOR = 1.0/3.0;\r\nconst float UNSKEWFACTOR = 1.0/6.0;\r\nconst float SIMPLEX_CORNER_POS = 0.5;\r\nconst float SIMPLEX_TETRAHADRON_HEIGHT = 0.70710678118654752440084436210485;\r\nfloat SimplexPerlin3D( vec3 P ){\r\n    P.x = P == vec3(0., 0., 0.) ? 0.00001 : P.x;\r\n    P *= SIMPLEX_TETRAHADRON_HEIGHT;\r\n    vec3 Pi = floor( P + dot( P, vec3( SKEWFACTOR) ) );    vec3 x0 = P - Pi + dot(Pi, vec3( UNSKEWFACTOR ) );\r\n    vec3 g = step(x0.yzx, x0.xyz);\r\n    vec3 l = 1.0 - g;\r\n    vec3 Pi_1 = min( g.xyz, l.zxy );\r\n    vec3 Pi_2 = max( g.xyz, l.zxy );\r\n    vec3 x1 = x0 - Pi_1 + UNSKEWFACTOR;\r\n    vec3 x2 = x0 - Pi_2 + SKEWFACTOR;\r\n    vec3 x3 = x0 - SIMPLEX_CORNER_POS;\r\n    vec4 v1234_x = vec4( x0.x, x1.x, x2.x, x3.x );\r\n    vec4 v1234_y = vec4( x0.y, x1.y, x2.y, x3.y );\r\n    vec4 v1234_z = vec4( x0.z, x1.z, x2.z, x3.z );\r\n    Pi.xyz = Pi.xyz - floor(Pi.xyz * ( 1.0 / 69.0 )) * 69.0;\r\n    vec3 Pi_inc1 = step( Pi, vec3( 69.0 - 1.5 ) ) * ( Pi + 1.0 );\r\n    vec4 Pt = vec4( Pi.xy, Pi_inc1.xy ) + vec2( 50.0, 161.0 ).xyxy;\r\n    Pt *= Pt;\r\n    vec4 V1xy_V2xy = mix( Pt.xyxy, Pt.zwzw, vec4( Pi_1.xy, Pi_2.xy ) );\r\n    Pt = vec4( Pt.x, V1xy_V2xy.xz, Pt.z ) * vec4( Pt.y, V1xy_V2xy.yw, Pt.w );\r\n    const vec3 SOMELARGEFLOATS = vec3( 635.298681, 682.357502, 668.926525 );\r\n    const vec3 ZINC = vec3( 48.500388, 65.294118, 63.934599 );\r\n    vec3 lowz_mods = vec3( 1.0 / ( SOMELARGEFLOATS.xyz + Pi.zzz * ZINC.xyz ) );\r\n    vec3 highz_mods = vec3( 1.0 / ( SOMELARGEFLOATS.xyz + Pi_inc1.zzz * ZINC.xyz ) );\r\n    Pi_1 = ( Pi_1.z < 0.5 ) ? lowz_mods : highz_mods;\r\n    Pi_2 = ( Pi_2.z < 0.5 ) ? lowz_mods : highz_mods;\r\n    vec4 hash_0 = fract( Pt * vec4( lowz_mods.x, Pi_1.x, Pi_2.x, highz_mods.x ) ) - 0.49999;\r\n    vec4 hash_1 = fract( Pt * vec4( lowz_mods.y, Pi_1.y, Pi_2.y, highz_mods.y ) ) - 0.49999;\r\n    vec4 hash_2 = fract( Pt * vec4( lowz_mods.z, Pi_1.z, Pi_2.z, highz_mods.z ) ) - 0.49999;\r\n    vec4 grad_results = inversesqrt( hash_0 * hash_0 + hash_1 * hash_1 + hash_2 * hash_2 ) * ( hash_0 * v1234_x + hash_1 * v1234_y + hash_2 * v1234_z );\r\n    const float FINAL_NORMALIZATION = 37.837227241611314102871574478976;\r\n    vec4 kernel_weights = v1234_x * v1234_x + v1234_y * v1234_y + v1234_z * v1234_z;\r\n    kernel_weights = max(0.5 - kernel_weights, 0.0);\r\n    kernel_weights = kernel_weights*kernel_weights*kernel_weights;\r\n    return dot( kernel_weights, grad_results ) * FINAL_NORMALIZATION;\r\n}\r\n","// SimplexPerlin3D"),e.compilationString+=this._declareOutput(this._outputs[0],e)+` = SimplexPerlin3D(${this.seed.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.SimplexPerlin3DBlock",Id);class Dd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("normalMap0",ou.E.AutoDetect),this.registerInput("normalMap1",ou.E.AutoDetect),this.registerOutput("output",ou.E.Vector3),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Color4|ou.E.Vector3|ou.E.Vector4),this._inputs[1].addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Color4|ou.E.Vector3|ou.E.Vector4)}getClassName(){return"NormalBlendBlock"}get normalMap0(){return this._inputs[0]}get normalMap1(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0],i=this._inputs[0],n=this._inputs[1],s=e._getFreeVariableName("stepR"),r=e._getFreeVariableName("stepG");return e.compilationString+=`float ${s} = step(0.5, ${i.associatedVariableName}.r);\r\n`,e.compilationString+=`float ${r} = step(0.5, ${i.associatedVariableName}.g);\r\n`,e.compilationString+=this._declareOutput(t,e)+";\r\n",e.compilationString+=`${t.associatedVariableName}.r = (1.0 - ${s}) * ${i.associatedVariableName}.r * ${n.associatedVariableName}.r * 2.0 + ${s} * (1.0 - (1.0 - ${i.associatedVariableName}.r) * (1.0 - ${n.associatedVariableName}.r) * 2.0);\r\n`,e.compilationString+=`${t.associatedVariableName}.g = (1.0 - ${r}) * ${i.associatedVariableName}.g * ${n.associatedVariableName}.g * 2.0 + ${r} * (1.0 - (1.0 - ${i.associatedVariableName}.g) * (1.0 - ${n.associatedVariableName}.g) * 2.0);\r\n`,e.compilationString+=`${t.associatedVariableName}.b = ${i.associatedVariableName}.b * ${n.associatedVariableName}.b;\r\n`,this}}(0,l.H)("BABYLON.NormalBlendBlock",Dd);class Od extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("input",ou.E.Vector2),this.registerInput("angle",ou.E.Float),this.registerOutput("output",ou.E.Vector2)}getClassName(){return"Rotate2dBlock"}get input(){return this._inputs[0]}get angle(){return this._inputs[1]}get output(){return this._outputs[0]}autoConfigure(){if(!this.angle.isConnected){const e=new fu.S("angle");e.value=0,e.output.connectTo(this.angle)}}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0],i=this.angle,n=this.input;return e.compilationString+=this._declareOutput(t,e)+` = vec2(cos(${i.associatedVariableName}) * ${n.associatedVariableName}.x - sin(${i.associatedVariableName}) * ${n.associatedVariableName}.y, sin(${i.associatedVariableName}) * ${n.associatedVariableName}.x + cos(${i.associatedVariableName}) * ${n.associatedVariableName}.y);\r\n`,this}}(0,l.H)("BABYLON.Rotate2dBlock",Od);class wd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("incident",ou.E.AutoDetect),this.registerInput("normal",ou.E.AutoDetect),this.registerOutput("output",ou.E.Vector3),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(ou.E.Vector3|ou.E.Vector4|ou.E.Color3|ou.E.Color4),this._inputs[1].addExcludedConnectionPointFromAllowedTypes(ou.E.Vector3|ou.E.Vector4|ou.E.Color3|ou.E.Color4)}getClassName(){return"ReflectBlock"}get incident(){return this._inputs[0]}get normal(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = reflect(${this.incident.associatedVariableName}.xyz, ${this.normal.associatedVariableName}.xyz);\r\n`,this}}(0,l.H)("BABYLON.ReflectBlock",wd);class Nd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("incident",ou.E.AutoDetect),this.registerInput("normal",ou.E.AutoDetect),this.registerInput("ior",ou.E.Float),this.registerOutput("output",ou.E.Vector3),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(ou.E.Vector3|ou.E.Vector4|ou.E.Color3|ou.E.Color4),this._inputs[1].addExcludedConnectionPointFromAllowedTypes(ou.E.Vector3|ou.E.Vector4|ou.E.Color3|ou.E.Color4)}getClassName(){return"RefractBlock"}get incident(){return this._inputs[0]}get normal(){return this._inputs[1]}get ior(){return this._inputs[2]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = refract(${this.incident.associatedVariableName}.xyz, ${this.normal.associatedVariableName}.xyz, ${this.ior.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.RefractBlock",Nd);class Fd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("color",ou.E.Color3),this.registerInput("level",ou.E.Float),this.registerOutput("output",ou.E.Color3)}getClassName(){return"DesaturateBlock"}get color(){return this._inputs[0]}get level(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0],i=this.color.associatedVariableName,n=e._getFreeVariableName("colorMin"),s=e._getFreeVariableName("colorMax"),r=e._getFreeVariableName("colorMerge");return e.compilationString+=`float ${n} = min(min(${i}.x, ${i}.y), ${i}.z);\r\n`,e.compilationString+=`float ${s} = max(max(${i}.x, ${i}.y), ${i}.z);\r\n`,e.compilationString+=`float ${r} = 0.5 * (${n} + ${s});\r\n`,e.compilationString+=this._declareOutput(t,e)+` = mix(${i}, vec3(${r}, ${r}, ${r}), ${this.level.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.DesaturateBlock",Fd);class Ld extends du.k{constructor(e){super(e,ru.u.Fragment),this.albedoScaling=!1,this.linkSheenWithAlbedo=!1,this._isUnique=!0,this.registerInput("intensity",ou.E.Float,!0,ru.u.Fragment),this.registerInput("color",ou.E.Color3,!0,ru.u.Fragment),this.registerInput("roughness",ou.E.Float,!0,ru.u.Fragment),this.registerOutput("sheen",ou.E.Object,ru.u.Fragment,new uu("sheen",this,cu.Ab.Output,Ld,"SheenBlock"))}initialize(e){e._excludeVariableName("sheenOut"),e._excludeVariableName("sheenMapData"),e._excludeVariableName("vSheenColor"),e._excludeVariableName("vSheenRoughness")}getClassName(){return"SheenBlock"}get intensity(){return this._inputs[0]}get color(){return this._inputs[1]}get roughness(){return this._inputs[2]}get sheen(){return this._outputs[0]}prepareDefines(e,t,i){super.prepareDefines(e,t,i),i.setValue("SHEEN",!0),i.setValue("SHEEN_USE_ROUGHNESS_FROM_MAINTEXTURE",!0,!0),i.setValue("SHEEN_LINKWITHALBEDO",this.linkSheenWithAlbedo,!0),i.setValue("SHEEN_ROUGHNESS",this.roughness.isConnected,!0),i.setValue("SHEEN_ALBEDOSCALING",this.albedoScaling,!0)}getCode(e){let t="";return t=`#ifdef SHEEN\n            sheenOutParams sheenOut;\n\n            vec4 vSheenColor = vec4(${this.color.isConnected?this.color.associatedVariableName:"vec3(1.)"}, ${this.intensity.isConnected?this.intensity.associatedVariableName:"1."});\n\n            sheenBlock(\n                vSheenColor,\n            #ifdef SHEEN_ROUGHNESS\n                ${this.roughness.isConnected?this.roughness.associatedVariableName:"0."},\n            #endif\n                roughness,\n            #ifdef SHEEN_TEXTURE\n                vec4(0.),\n                1.0,\n            #endif\n                reflectance,\n            #ifdef SHEEN_LINKWITHALBEDO\n                baseColor,\n                surfaceAlbedo,\n            #endif\n            #ifdef ENVIRONMENTBRDF\n                NdotV,\n                environmentBrdf,\n            #endif\n            #if defined(REFLECTION) && defined(ENVIRONMENTBRDF)\n                AARoughnessFactors,\n                ${null==e?void 0:e._vReflectionMicrosurfaceInfosName},\n                ${null==e?void 0:e._vReflectionInfosName},\n                ${null==e?void 0:e.reflectionColor},\n                vLightingIntensity,\n                #ifdef ${null==e?void 0:e._define3DName}\n                    ${null==e?void 0:e._cubeSamplerName},\n                #else\n                    ${null==e?void 0:e._2DSamplerName},\n                #endif\n                reflectionOut.reflectionCoords,\n                NdotVUnclamped,\n                #ifndef LODBASEDMICROSFURACE\n                    #ifdef ${null==e?void 0:e._define3DName}\n                        ${null==e?void 0:e._cubeSamplerName},\n                        ${null==e?void 0:e._cubeSamplerName},\n                    #else\n                        ${null==e?void 0:e._2DSamplerName},\n                        ${null==e?void 0:e._2DSamplerName},\n                    #endif\n                #endif\n                #if !defined(${null==e?void 0:e._defineSkyboxName}) && defined(RADIANCEOCCLUSION)\n                    seo,\n                #endif\n                #if !defined(${null==e?void 0:e._defineSkyboxName}) && defined(HORIZONOCCLUSION) && defined(BUMP) && defined(${null==e?void 0:e._define3DName})\n                    eho,\n                #endif\n            #endif\n                sheenOut\n            );\n\n            #ifdef SHEEN_LINKWITHALBEDO\n                surfaceAlbedo = sheenOut.surfaceAlbedo;\n            #endif\n        #endif\r\n`,t}_buildBlock(e){return e.target===ru.u.Fragment&&e.sharedData.blocksWithDefines.push(this),this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.albedoScaling = ${this.albedoScaling};\r\n`,e+=`${this._codeVariableName}.linkSheenWithAlbedo = ${this.linkSheenWithAlbedo};\r\n`,e}serialize(){const e=super.serialize();return e.albedoScaling=this.albedoScaling,e.linkSheenWithAlbedo=this.linkSheenWithAlbedo,e}_deserialize(e,t,i){super._deserialize(e,t,i),this.albedoScaling=e.albedoScaling,this.linkSheenWithAlbedo=e.linkSheenWithAlbedo}}(0,be.gn)([(0,xu.p)("Albedo scaling",xu.U.Boolean,"PROPERTIES",{notifiers:{update:!0}})],Ld.prototype,"albedoScaling",void 0),(0,be.gn)([(0,xu.p)("Link sheen with albedo",xu.U.Boolean,"PROPERTIES",{notifiers:{update:!0}})],Ld.prototype,"linkSheenWithAlbedo",void 0),(0,l.H)("BABYLON.SheenBlock",Ld);var Bd=i(6344);class Ud extends du.k{constructor(e){super(e,ru.u.Fragment),this._tangentCorrectionFactorName="",this._isUnique=!0,this.registerInput("intensity",ou.E.Float,!0,ru.u.Fragment),this.registerInput("direction",ou.E.Vector2,!0,ru.u.Fragment),this.registerInput("uv",ou.E.Vector2,!0),this.registerInput("worldTangent",ou.E.Vector4,!0),this.registerInput("TBN",ou.E.Object,!0,ru.u.VertexAndFragment,new uu("TBN",this,cu.Ab.Input,Tu,"TBNBlock")),this.registerOutput("anisotropy",ou.E.Object,ru.u.Fragment,new uu("anisotropy",this,cu.Ab.Output,Ud,"AnisotropyBlock"))}initialize(e){e._excludeVariableName("anisotropicOut"),e._excludeVariableName("TBN")}getClassName(){return"AnisotropyBlock"}get intensity(){return this._inputs[0]}get direction(){return this._inputs[1]}get uv(){return this._inputs[2]}get worldTangent(){return this._inputs[3]}get TBN(){return this._inputs[4]}get anisotropy(){return this._outputs[0]}_generateTBNSpace(e){let t="";const i=`//${this.name}`,n=this.uv,s=this.worldPositionConnectionPoint,r=this.worldNormalConnectionPoint,o=this.worldTangent;n.isConnected||console.error("You must connect the 'uv' input of the Anisotropy block!"),e._emitExtension("derivatives","#extension GL_OES_standard_derivatives : enable");const a={search:/defined\(TANGENT\)/g,replace:o.isConnected?"defined(TANGENT)":"defined(IGNORE)"},l=this.TBN;return l.isConnected?e.compilationString+=`\n            #ifdef TBNBLOCK\n            mat3 vTBN = ${l.associatedVariableName};\n            #endif\n            `:o.isConnected&&(t+=`vec3 tbnNormal = normalize(${r.associatedVariableName}.xyz);\r\n`,t+=`vec3 tbnTangent = normalize(${o.associatedVariableName}.xyz);\r\n`,t+=`vec3 tbnBitangent = cross(tbnNormal, tbnTangent) * ${this._tangentCorrectionFactorName};\r\n`,t+="mat3 vTBN = mat3(tbnTangent, tbnBitangent, tbnNormal);\r\n"),t+=`\n            #if defined(${o.isConnected?"TANGENT":"IGNORE"}) && defined(NORMAL)\n                mat3 TBN = vTBN;\n            #else\n                mat3 TBN = cotangent_frame(${r.associatedVariableName+".xyz"}, ${"v_"+s.associatedVariableName+".xyz"}, ${n.isConnected?n.associatedVariableName:"vec2(0.)"}, vec2(1., 1.));\n            #endif\r\n`,e._emitFunctionFromInclude("bumpFragmentMainFunctions",i,{replaceStrings:[a]}),t}getCode(e,t=!1){let i="";t&&(i+=this._generateTBNSpace(e));const n=this.intensity.isConnected?this.intensity.associatedVariableName:"1.0";return i+=`anisotropicOutParams anisotropicOut;\n            anisotropicBlock(\n                vec3(${this.direction.isConnected?this.direction.associatedVariableName:"vec2(1., 0.)"}, ${n}),\n            #ifdef ANISOTROPIC_TEXTURE\n                vec3(0.),\n            #endif\n                TBN,\n                normalW,\n                viewDirectionW,\n                anisotropicOut\n            );\r\n`,i}prepareDefines(e,t,i){super.prepareDefines(e,t,i),i.setValue("ANISOTROPIC",!0),i.setValue("ANISOTROPIC_TEXTURE",!1,!0)}bind(e,t,i){super.bind(e,t,i),i&&e.setFloat(this._tangentCorrectionFactorName,i.getWorldMatrix().determinant()<0?-1:1)}_buildBlock(e){return e.target===ru.u.Fragment&&(e.sharedData.blocksWithDefines.push(this),e.sharedData.bindableBlocks.push(this),this._tangentCorrectionFactorName=e._getFreeDefineName("tangentCorrectionFactor"),e._emitUniformFromString(this._tangentCorrectionFactorName,"float")),this}}(0,l.H)("BABYLON.AnisotropyBlock",Ud);class Vd extends Uu{_onGenerateOnlyFragmentCodeChanged(){return this.position.isConnected?(this.generateOnlyFragmentCode=!this.generateOnlyFragmentCode,console.error("The position input must not be connected to be able to switch!"),!1):(this._setTarget(),!0)}_setTarget(){super._setTarget(),this.getInputByName("position").target=this.generateOnlyFragmentCode?ru.u.Fragment:ru.u.Vertex,this.generateOnlyFragmentCode&&(this.forceIrradianceInFragment=!0)}constructor(e){super(e),this.useSphericalHarmonics=!0,this.forceIrradianceInFragment=!1,this._isUnique=!0,this.registerInput("position",ou.E.AutoDetect,!1,ru.u.Vertex),this.registerInput("world",ou.E.Matrix,!1,ru.u.Vertex),this.registerInput("color",ou.E.Color3,!0,ru.u.Fragment),this.registerOutput("reflection",ou.E.Object,ru.u.Fragment,new uu("reflection",this,cu.Ab.Output,Vd,"ReflectionBlock")),this.position.addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Vector3|ou.E.Vector4)}getClassName(){return"ReflectionBlock"}get position(){return this._inputs[0]}get worldPosition(){return this.worldPositionConnectionPoint}get worldNormal(){return this.worldNormalConnectionPoint}get world(){return this._inputs[1]}get cameraPosition(){return this.cameraPositionConnectionPoint}get view(){return this.viewConnectionPoint}get color(){return this._inputs[2]}get reflection(){return this._outputs[0]}get hasTexture(){return!!this._getTexture()}get reflectionColor(){return this.color.isConnected?this.color.associatedVariableName:"vec3(1., 1., 1.)"}_getTexture(){return this.texture?this.texture:this._scene.environmentTexture}prepareDefines(e,t,i){super.prepareDefines(e,t,i);const n=this._getTexture(),s=n&&n.getTextureMatrix;i.setValue("REFLECTION",s,!0),s&&(i.setValue(this._defineLODReflectionAlpha,n.lodLevelInAlpha,!0),i.setValue(this._defineLinearSpecularReflection,n.linearSpecularLOD,!0),i.setValue(this._defineOppositeZ,this._scene.useRightHandedSystem?!n.invertZ:n.invertZ,!0),i.setValue("SPHERICAL_HARMONICS",this.useSphericalHarmonics,!0),i.setValue("GAMMAREFLECTION",n.gammaSpace,!0),i.setValue("RGBDREFLECTION",n.isRGBD,!0),n&&n.coordinatesMode!==Ce.x.SKYBOX_MODE&&n.isCube&&(i.setValue("USESPHERICALFROMREFLECTIONMAP",!0),i.setValue("USEIRRADIANCEMAP",!1),this.forceIrradianceInFragment||this._scene.getEngine().getCaps().maxVaryingVectors<=8?i.setValue("USESPHERICALINVERTEX",!1):i.setValue("USESPHERICALINVERTEX",!0)))}bind(e,t,i,n){super.bind(e,t,i);const s=this._getTexture();if(!s||!n)return;s.isCube?e.setTexture(this._cubeSamplerName,s):e.setTexture(this._2DSamplerName,s);const r=s.getSize().width;e.setFloat3(this._vReflectionMicrosurfaceInfosName,r,s.lodGenerationScale,s.lodGenerationOffset),e.setFloat2(this._vReflectionFilteringInfoName,r,lt.R.Log2(r));const o=n.materialDefines,a=s.sphericalPolynomial;if(o.USESPHERICALFROMREFLECTIONMAP&&a)if(o.SPHERICAL_HARMONICS){const t=a.preScaledHarmonics;e.setVector3("vSphericalL00",t.l00),e.setVector3("vSphericalL1_1",t.l1_1),e.setVector3("vSphericalL10",t.l10),e.setVector3("vSphericalL11",t.l11),e.setVector3("vSphericalL2_2",t.l2_2),e.setVector3("vSphericalL2_1",t.l2_1),e.setVector3("vSphericalL20",t.l20),e.setVector3("vSphericalL21",t.l21),e.setVector3("vSphericalL22",t.l22)}else e.setFloat3("vSphericalX",a.x.x,a.x.y,a.x.z),e.setFloat3("vSphericalY",a.y.x,a.y.y,a.y.z),e.setFloat3("vSphericalZ",a.z.x,a.z.y,a.z.z),e.setFloat3("vSphericalXX_ZZ",a.xx.x-a.zz.x,a.xx.y-a.zz.y,a.xx.z-a.zz.z),e.setFloat3("vSphericalYY_ZZ",a.yy.x-a.zz.x,a.yy.y-a.zz.y,a.yy.z-a.zz.z),e.setFloat3("vSphericalZZ",a.zz.x,a.zz.y,a.zz.z),e.setFloat3("vSphericalXY",a.xy.x,a.xy.y,a.xy.z),e.setFloat3("vSphericalYZ",a.yz.x,a.yz.y,a.yz.z),e.setFloat3("vSphericalZX",a.zx.x,a.zx.y,a.zx.z)}handleVertexSide(e){let t=super.handleVertexSide(e);e._emitFunctionFromInclude("harmonicsFunctions",`//${this.name}`,{replaceStrings:[{search:/uniform vec3 vSphericalL00;[\s\S]*?uniform vec3 vSphericalL22;/g,replace:""},{search:/uniform vec3 vSphericalX;[\s\S]*?uniform vec3 vSphericalZX;/g,replace:""}]});const i=e._getFreeVariableName("reflectionVector");return this._vEnvironmentIrradianceName=e._getFreeVariableName("vEnvironmentIrradiance"),e._emitVaryingFromString(this._vEnvironmentIrradianceName,"vec3","defined(USESPHERICALFROMREFLECTIONMAP) && defined(USESPHERICALINVERTEX)"),e._emitUniformFromString("vSphericalL00","vec3","SPHERICAL_HARMONICS"),e._emitUniformFromString("vSphericalL1_1","vec3","SPHERICAL_HARMONICS"),e._emitUniformFromString("vSphericalL10","vec3","SPHERICAL_HARMONICS"),e._emitUniformFromString("vSphericalL11","vec3","SPHERICAL_HARMONICS"),e._emitUniformFromString("vSphericalL2_2","vec3","SPHERICAL_HARMONICS"),e._emitUniformFromString("vSphericalL2_1","vec3","SPHERICAL_HARMONICS"),e._emitUniformFromString("vSphericalL20","vec3","SPHERICAL_HARMONICS"),e._emitUniformFromString("vSphericalL21","vec3","SPHERICAL_HARMONICS"),e._emitUniformFromString("vSphericalL22","vec3","SPHERICAL_HARMONICS"),e._emitUniformFromString("vSphericalX","vec3","SPHERICAL_HARMONICS",!0),e._emitUniformFromString("vSphericalY","vec3","SPHERICAL_HARMONICS",!0),e._emitUniformFromString("vSphericalZ","vec3","SPHERICAL_HARMONICS",!0),e._emitUniformFromString("vSphericalXX_ZZ","vec3","SPHERICAL_HARMONICS",!0),e._emitUniformFromString("vSphericalYY_ZZ","vec3","SPHERICAL_HARMONICS",!0),e._emitUniformFromString("vSphericalZZ","vec3","SPHERICAL_HARMONICS",!0),e._emitUniformFromString("vSphericalXY","vec3","SPHERICAL_HARMONICS",!0),e._emitUniformFromString("vSphericalYZ","vec3","SPHERICAL_HARMONICS",!0),e._emitUniformFromString("vSphericalZX","vec3","SPHERICAL_HARMONICS",!0),t+=`#if defined(USESPHERICALFROMREFLECTIONMAP) && defined(USESPHERICALINVERTEX)\n                vec3 ${i} = vec3(${this._reflectionMatrixName} * vec4(normalize(${this.worldNormal.associatedVariableName}).xyz, 0)).xyz;\n                #ifdef ${this._defineOppositeZ}\n                    ${i}.z *= -1.0;\n                #endif\n                ${this._vEnvironmentIrradianceName} = computeEnvironmentIrradiance(${i});\n            #endif\r\n`,t}getCode(e,t){let i="";this.handleFragmentSideInits(e),e._emitFunctionFromInclude("harmonicsFunctions",`//${this.name}`,{replaceStrings:[{search:/uniform vec3 vSphericalL00;[\s\S]*?uniform vec3 vSphericalL22;/g,replace:""},{search:/uniform vec3 vSphericalX;[\s\S]*?uniform vec3 vSphericalZX;/g,replace:""}]}),e._emitFunction("sampleReflection",`\n            #ifdef ${this._define3DName}\n                #define sampleReflection(s, c) textureCube(s, c)\n            #else\n                #define sampleReflection(s, c) texture2D(s, c)\n            #endif\r\n`,`//${this.name}`),e._emitFunction("sampleReflectionLod",`\n            #ifdef ${this._define3DName}\n                #define sampleReflectionLod(s, c, l) textureCubeLodEXT(s, c, l)\n            #else\n                #define sampleReflectionLod(s, c, l) texture2DLodEXT(s, c, l)\n            #endif\r\n`,`//${this.name}`);const n=`\n            vec3 computeReflectionCoordsPBR(vec4 worldPos, vec3 worldNormal) {\n                ${this.handleFragmentSideCodeReflectionCoords("worldNormal","worldPos",!0,!0)}\n                return ${this._reflectionVectorName};\n            }\r\n`;return e._emitFunction("computeReflectionCoordsPBR",n,`//${this.name}`),this._vReflectionMicrosurfaceInfosName=e._getFreeVariableName("vReflectionMicrosurfaceInfos"),e._emitUniformFromString(this._vReflectionMicrosurfaceInfosName,"vec3"),this._vReflectionInfosName=e._getFreeVariableName("vReflectionInfos"),this._vReflectionFilteringInfoName=e._getFreeVariableName("vReflectionFilteringInfo"),e._emitUniformFromString(this._vReflectionFilteringInfoName,"vec2"),i+=`#ifdef REFLECTION\n            vec2 ${this._vReflectionInfosName} = vec2(1., 0.);\n\n            reflectionOutParams reflectionOut;\n\n            reflectionBlock(\n                ${this.generateOnlyFragmentCode?this._worldPositionNameInFragmentOnlyMode:"v_"+this.worldPosition.associatedVariableName}.xyz,\n                ${t},\n                alphaG,\n                ${this._vReflectionMicrosurfaceInfosName},\n                ${this._vReflectionInfosName},\n                ${this.reflectionColor},\n            #ifdef ANISOTROPIC\n                anisotropicOut,\n            #endif\n            #if defined(${this._defineLODReflectionAlpha}) && !defined(${this._defineSkyboxName})\n                NdotVUnclamped,\n            #endif\n            #ifdef ${this._defineLinearSpecularReflection}\n                roughness,\n            #endif\n            #ifdef ${this._define3DName}\n                ${this._cubeSamplerName},\n            #else\n                ${this._2DSamplerName},\n            #endif\n            #if defined(NORMAL) && defined(USESPHERICALINVERTEX)\n                ${this._vEnvironmentIrradianceName},\n            #endif\n            #ifdef USESPHERICALFROMREFLECTIONMAP\n                #if !defined(NORMAL) || !defined(USESPHERICALINVERTEX)\n                    ${this._reflectionMatrixName},\n                #endif\n            #endif\n            #ifdef USEIRRADIANCEMAP\n                irradianceSampler, // ** not handled **\n            #endif\n            #ifndef LODBASEDMICROSFURACE\n                #ifdef ${this._define3DName}\n                    ${this._cubeSamplerName},\n                    ${this._cubeSamplerName},\n                #else\n                    ${this._2DSamplerName},\n                    ${this._2DSamplerName},\n                #endif\n            #endif\n            #ifdef REALTIME_FILTERING\n                ${this._vReflectionFilteringInfoName},\n            #endif\n                reflectionOut\n            );\n        #endif\r\n`,i}_buildBlock(e){return this._scene=e.sharedData.scene,e.target!==ru.u.Fragment&&(this._defineLODReflectionAlpha=e._getFreeDefineName("LODINREFLECTIONALPHA"),this._defineLinearSpecularReflection=e._getFreeDefineName("LINEARSPECULARREFLECTION")),this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return this.texture&&(e+=`${this._codeVariableName}.texture.gammaSpace = ${this.texture.gammaSpace};\r\n`),e+=`${this._codeVariableName}.useSphericalHarmonics = ${this.useSphericalHarmonics};\r\n`,e+=`${this._codeVariableName}.forceIrradianceInFragment = ${this.forceIrradianceInFragment};\r\n`,e}serialize(){var e,t;const i=super.serialize();return i.useSphericalHarmonics=this.useSphericalHarmonics,i.forceIrradianceInFragment=this.forceIrradianceInFragment,i.gammaSpace=null===(t=null===(e=this.texture)||void 0===e?void 0:e.gammaSpace)||void 0===t||t,i}_deserialize(e,t,i){super._deserialize(e,t,i),this.useSphericalHarmonics=e.useSphericalHarmonics,this.forceIrradianceInFragment=e.forceIrradianceInFragment,this.texture&&(this.texture.gammaSpace=e.gammaSpace)}}(0,be.gn)([(0,xu.p)("Spherical Harmonics",xu.U.Boolean,"ADVANCED",{notifiers:{update:!0}})],Vd.prototype,"useSphericalHarmonics",void 0),(0,be.gn)([(0,xu.p)("Force irradiance in fragment",xu.U.Boolean,"ADVANCED",{notifiers:{update:!0}})],Vd.prototype,"forceIrradianceInFragment",void 0),(0,l.H)("BABYLON.ReflectionBlock",Vd);class kd extends du.k{constructor(e){super(e,ru.u.Fragment),this._tangentCorrectionFactorName="",this.remapF0OnInterfaceChange=!0,this._isUnique=!0,this.registerInput("intensity",ou.E.Float,!1,ru.u.Fragment),this.registerInput("roughness",ou.E.Float,!0,ru.u.Fragment),this.registerInput("indexOfRefraction",ou.E.Float,!0,ru.u.Fragment),this.registerInput("normalMapColor",ou.E.Color3,!0,ru.u.Fragment),this.registerInput("uv",ou.E.Vector2,!0,ru.u.Fragment),this.registerInput("tintColor",ou.E.Color3,!0,ru.u.Fragment),this.registerInput("tintAtDistance",ou.E.Float,!0,ru.u.Fragment),this.registerInput("tintThickness",ou.E.Float,!0,ru.u.Fragment),this.registerInput("worldTangent",ou.E.Vector4,!0),this.registerInput("worldNormal",ou.E.AutoDetect,!0),this.worldNormal.addExcludedConnectionPointFromAllowedTypes(ou.E.Color4|ou.E.Vector4|ou.E.Vector3),this.registerInput("TBN",ou.E.Object,!0,ru.u.VertexAndFragment,new uu("TBN",this,cu.Ab.Input,Tu,"TBNBlock")),this.registerOutput("clearcoat",ou.E.Object,ru.u.Fragment,new uu("clearcoat",this,cu.Ab.Output,kd,"ClearCoatBlock"))}initialize(e){e._excludeVariableName("clearcoatOut"),e._excludeVariableName("vClearCoatParams"),e._excludeVariableName("vClearCoatTintParams"),e._excludeVariableName("vClearCoatRefractionParams"),e._excludeVariableName("vClearCoatTangentSpaceParams"),e._excludeVariableName("vGeometricNormaClearCoatW")}getClassName(){return"ClearCoatBlock"}get intensity(){return this._inputs[0]}get roughness(){return this._inputs[1]}get indexOfRefraction(){return this._inputs[2]}get normalMapColor(){return this._inputs[3]}get uv(){return this._inputs[4]}get tintColor(){return this._inputs[5]}get tintAtDistance(){return this._inputs[6]}get tintThickness(){return this._inputs[7]}get worldTangent(){return this._inputs[8]}get worldNormal(){return this._inputs[9]}get TBN(){return this._inputs[10]}get clearcoat(){return this._outputs[0]}autoConfigure(){if(!this.intensity.isConnected){const e=new fu.S("ClearCoat intensity",ru.u.Fragment,ou.E.Float);e.value=1,e.output.connectTo(this.intensity)}}prepareDefines(e,t,i){super.prepareDefines(e,t,i),i.setValue("CLEARCOAT",!0),i.setValue("CLEARCOAT_TEXTURE",!1,!0),i.setValue("CLEARCOAT_USE_ROUGHNESS_FROM_MAINTEXTURE",!0,!0),i.setValue("CLEARCOAT_TINT",this.tintColor.isConnected||this.tintThickness.isConnected||this.tintAtDistance.isConnected,!0),i.setValue("CLEARCOAT_BUMP",this.normalMapColor.isConnected,!0),i.setValue("CLEARCOAT_DEFAULTIOR",!this.indexOfRefraction.isConnected||this.indexOfRefraction.connectInputBlock.value===rc.Y._DefaultIndexOfRefraction,!0),i.setValue("CLEARCOAT_REMAP_F0",this.remapF0OnInterfaceChange,!0)}bind(e,t,i){var n,s;super.bind(e,t,i);const r=null!==(s=null===(n=this.indexOfRefraction.connectInputBlock)||void 0===n?void 0:n.value)&&void 0!==s?s:rc.Y._DefaultIndexOfRefraction,o=1-r,a=1+r,l=Math.pow(-o/a,2),h=1/r;e.setFloat4("vClearCoatRefractionParams",l,h,o,a);const c=this.clearcoat.hasEndpoints?this.clearcoat.endpoints[0].ownerBlock:null,u=(null==c?void 0:c.perturbedNormal.isConnected)?c.perturbedNormal.connectedPoint.ownerBlock:null;this._scene._mirroredCameraPosition?e.setFloat2("vClearCoatTangentSpaceParams",(null==u?void 0:u.invertX)?1:-1,(null==u?void 0:u.invertY)?1:-1):e.setFloat2("vClearCoatTangentSpaceParams",(null==u?void 0:u.invertX)?-1:1,(null==u?void 0:u.invertY)?-1:1),i&&e.setFloat(this._tangentCorrectionFactorName,i.getWorldMatrix().determinant()<0?-1:1)}_generateTBNSpace(e,t,i){let n="";const s=`//${this.name}`,r=this.worldTangent;e._emitExtension("derivatives","#extension GL_OES_standard_derivatives : enable");const o={search:/defined\(TANGENT\)/g,replace:r.isConnected?"defined(TANGENT)":"defined(IGNORE)"},a=this.TBN;return a.isConnected?e.compilationString+=`\n            #ifdef TBNBLOCK\n            mat3 vTBN = ${a.associatedVariableName};\n            #endif\n            `:r.isConnected&&(n+=`vec3 tbnNormal = normalize(${i}.xyz);\r\n`,n+=`vec3 tbnTangent = normalize(${r.associatedVariableName}.xyz);\r\n`,n+=`vec3 tbnBitangent = cross(tbnNormal, tbnTangent) * ${this._tangentCorrectionFactorName};\r\n`,n+="mat3 vTBN = mat3(tbnTangent, tbnBitangent, tbnNormal);\r\n"),e._emitFunctionFromInclude("bumpFragmentMainFunctions",s,{replaceStrings:[o]}),n}static GetCode(e,t,i,n,s,r,o){let a="";const l=(null==t?void 0:t.intensity.isConnected)?t.intensity.associatedVariableName:"1.",h=(null==t?void 0:t.roughness.isConnected)?t.roughness.associatedVariableName:"0.",c=(null==t?void 0:t.normalMapColor.isConnected)?t.normalMapColor.associatedVariableName:"vec3(0.)",u=(null==t?void 0:t.uv.isConnected)?t.uv.associatedVariableName:"vec2(0.)",d=(null==t?void 0:t.tintColor.isConnected)?t.tintColor.associatedVariableName:"vec3(1.)",p=(null==t?void 0:t.tintThickness.isConnected)?t.tintThickness.associatedVariableName:"1.",f=(null==t?void 0:t.tintAtDistance.isConnected)?t.tintAtDistance.associatedVariableName:"1.";if(t){e._emitUniformFromString("vClearCoatRefractionParams","vec4"),e._emitUniformFromString("vClearCoatTangentSpaceParams","vec2");const i=t.worldNormal;a+=`vec3 vGeometricNormaClearCoatW = ${i.isConnected?"normalize("+i.associatedVariableName+".xyz)":"geometricNormalW"};\r\n`}else a+="vec3 vGeometricNormaClearCoatW = geometricNormalW;\r\n";return s&&t&&(a+=t._generateTBNSpace(e,n,o),r=t.worldTangent.isConnected),a+=`clearcoatOutParams clearcoatOut;\n\n        #ifdef CLEARCOAT\n            vec2 vClearCoatParams = vec2(${l}, ${h});\n            vec4 vClearCoatTintParams = vec4(${d}, ${p});\n\n            clearcoatBlock(\n                ${n}.xyz,\n                vGeometricNormaClearCoatW,\n                viewDirectionW,\n                vClearCoatParams,\n                specularEnvironmentR0,\n            #ifdef CLEARCOAT_TEXTURE\n                vec2(0.),\n            #endif\n            #ifdef CLEARCOAT_TINT\n                vClearCoatTintParams,\n                ${f},\n                vClearCoatRefractionParams,\n                #ifdef CLEARCOAT_TINT_TEXTURE\n                    vec4(0.),\n                #endif\n            #endif\n            #ifdef CLEARCOAT_BUMP\n                vec2(0., 1.),\n                vec4(${c}, 0.),\n                ${u},\n                #if defined(${r?"TANGENT":"IGNORE"}) && defined(NORMAL)\n                    vTBN,\n                #else\n                    vClearCoatTangentSpaceParams,\n                #endif\n                #ifdef OBJECTSPACE_NORMALMAP\n                    normalMatrix,\n                #endif\n            #endif\n            #if defined(FORCENORMALFORWARD) && defined(NORMAL)\n                faceNormal,\n            #endif\n            #ifdef REFLECTION\n                ${null==i?void 0:i._vReflectionMicrosurfaceInfosName},\n                ${null==i?void 0:i._vReflectionInfosName},\n                ${null==i?void 0:i.reflectionColor},\n                vLightingIntensity,\n                #ifdef ${null==i?void 0:i._define3DName}\n                    ${null==i?void 0:i._cubeSamplerName},\n                #else\n                    ${null==i?void 0:i._2DSamplerName},\n                #endif\n                #ifndef LODBASEDMICROSFURACE\n                    #ifdef ${null==i?void 0:i._define3DName}\n                        ${null==i?void 0:i._cubeSamplerName},\n                        ${null==i?void 0:i._cubeSamplerName},\n                    #else\n                        ${null==i?void 0:i._2DSamplerName},\n                        ${null==i?void 0:i._2DSamplerName},\n                    #endif\n                #endif\n            #endif\n            #if defined(ENVIRONMENTBRDF) && !defined(${null==i?void 0:i._defineSkyboxName})\n                #ifdef RADIANCEOCCLUSION\n                    ambientMonochrome,\n                #endif\n            #endif\n            #if defined(CLEARCOAT_BUMP) || defined(TWOSIDEDLIGHTING)\n                (gl_FrontFacing ? 1. : -1.),\n            #endif\n                clearcoatOut\n            );\n        #else\n            clearcoatOut.specularEnvironmentR0 = specularEnvironmentR0;\n        #endif\r\n`,a}_buildBlock(e){return this._scene=e.sharedData.scene,e.target===ru.u.Fragment&&(e.sharedData.bindableBlocks.push(this),e.sharedData.blocksWithDefines.push(this),this._tangentCorrectionFactorName=e._getFreeDefineName("tangentCorrectionFactor"),e._emitUniformFromString(this._tangentCorrectionFactorName,"float")),this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.remapF0OnInterfaceChange = ${this.remapF0OnInterfaceChange};\r\n`,e}serialize(){const e=super.serialize();return e.remapF0OnInterfaceChange=this.remapF0OnInterfaceChange,e}_deserialize(e,t,i){var n;super._deserialize(e,t,i),this.remapF0OnInterfaceChange=null===(n=e.remapF0OnInterfaceChange)||void 0===n||n}}(0,be.gn)([(0,xu.p)("Remap F0 on interface change",xu.U.Boolean,"ADVANCED")],kd.prototype,"remapF0OnInterfaceChange",void 0),(0,l.H)("BABYLON.ClearCoatBlock",kd);class Gd extends du.k{constructor(e){super(e,ru.u.Fragment),this._isUnique=!0,this.registerInput("intensity",ou.E.Float,!0,ru.u.Fragment),this.registerInput("indexOfRefraction",ou.E.Float,!0,ru.u.Fragment),this.registerInput("thickness",ou.E.Float,!0,ru.u.Fragment),this.registerOutput("iridescence",ou.E.Object,ru.u.Fragment,new uu("iridescence",this,cu.Ab.Output,Gd,"IridescenceBlock"))}initialize(e){e._excludeVariableName("iridescenceOut"),e._excludeVariableName("vIridescenceParams")}getClassName(){return"IridescenceBlock"}get intensity(){return this._inputs[0]}get indexOfRefraction(){return this._inputs[1]}get thickness(){return this._inputs[2]}get iridescence(){return this._outputs[0]}autoConfigure(){if(!this.intensity.isConnected){const e=new fu.S("Iridescence intensity",ru.u.Fragment,ou.E.Float);e.value=1,e.output.connectTo(this.intensity);const t=new fu.S("Iridescence ior",ru.u.Fragment,ou.E.Float);t.value=1.3,t.output.connectTo(this.indexOfRefraction);const i=new fu.S("Iridescence thickness",ru.u.Fragment,ou.E.Float);i.value=400,i.output.connectTo(this.thickness)}}prepareDefines(e,t,i){super.prepareDefines(e,t,i),i.setValue("IRIDESCENCE",!0,!0),i.setValue("IRIDESCENCE_TEXTURE",!1,!0),i.setValue("IRIDESCENCE_THICKNESS_TEXTURE",!1,!0)}static GetCode(e){let t="";return t+=`iridescenceOutParams iridescenceOut;\n\n        #ifdef IRIDESCENCE\n            iridescenceBlock(\n                vec4(${(null==e?void 0:e.intensity.isConnected)?e.intensity.associatedVariableName:"1."}, ${(null==e?void 0:e.indexOfRefraction.isConnected)?e.indexOfRefraction.associatedVariableName:oc.B._DefaultIndexOfRefraction}, 1., ${(null==e?void 0:e.thickness.isConnected)?e.thickness.associatedVariableName:oc.B._DefaultMaximumThickness}),\n                NdotV,\n                specularEnvironmentR0,\n                #ifdef CLEARCOAT\n                    NdotVUnclamped,\n                #endif\n                iridescenceOut\n            );\n\n            float iridescenceIntensity = iridescenceOut.iridescenceIntensity;\n            specularEnvironmentR0 = iridescenceOut.specularEnvironmentR0;\n        #endif\r\n`,t}_buildBlock(e){return e.target===ru.u.Fragment&&(e.sharedData.bindableBlocks.push(this),e.sharedData.blocksWithDefines.push(this)),this}serialize(){return super.serialize()}_deserialize(e,t,i){super._deserialize(e,t,i)}}(0,l.H)("BABYLON.IridescenceBlock",Gd);class zd extends du.k{constructor(e){super(e,ru.u.Fragment),this.linkRefractionWithTransparency=!1,this.invertRefractionY=!1,this.useThicknessAsDepth=!1,this._isUnique=!0,this.registerInput("intensity",ou.E.Float,!1,ru.u.Fragment),this.registerInput("tintAtDistance",ou.E.Float,!0,ru.u.Fragment),this.registerInput("volumeIndexOfRefraction",ou.E.Float,!0,ru.u.Fragment),this.registerOutput("refraction",ou.E.Object,ru.u.Fragment,new uu("refraction",this,cu.Ab.Output,zd,"RefractionBlock"))}initialize(e){e._excludeVariableName("vRefractionPosition"),e._excludeVariableName("vRefractionSize")}getClassName(){return"RefractionBlock"}get intensity(){return this._inputs[0]}get tintAtDistance(){return this._inputs[1]}get volumeIndexOfRefraction(){return this._inputs[2]}get view(){return this.viewConnectionPoint}get refraction(){return this._outputs[0]}get hasTexture(){return!!this._getTexture()}_getTexture(){return this.texture?this.texture:this._scene.environmentTexture}autoConfigure(e){if(!this.intensity.isConnected){const e=new fu.S("Refraction intensity",ru.u.Fragment,ou.E.Float);e.value=1,e.output.connectTo(this.intensity)}if(this.view&&!this.view.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.View));t||(t=new fu.S("view"),t.setAsSystemValue(lu.$.View)),t.output.connectTo(this.view)}}prepareDefines(e,t,i){super.prepareDefines(e,t,i);const n=this._getTexture(),s=n&&n.getTextureMatrix;i.setValue("SS_REFRACTION",s,!0),s&&(i.setValue(this._define3DName,n.isCube,!0),i.setValue(this._defineLODRefractionAlpha,n.lodLevelInAlpha,!0),i.setValue(this._defineLinearSpecularRefraction,n.linearSpecularLOD,!0),i.setValue(this._defineOppositeZ,this._scene.useRightHandedSystem&&n.isCube?!n.invertZ:n.invertZ,!0),i.setValue("SS_LINKREFRACTIONTOTRANSPARENCY",this.linkRefractionWithTransparency,!0),i.setValue("SS_GAMMAREFRACTION",n.gammaSpace,!0),i.setValue("SS_RGBDREFRACTION",n.isRGBD,!0),i.setValue("SS_USE_LOCAL_REFRACTIONMAP_CUBIC",!!n.boundingBoxSize,!0),i.setValue("SS_USE_THICKNESS_AS_DEPTH",this.useThicknessAsDepth,!0))}isReady(){const e=this._getTexture();return!(e&&!e.isReadyOrNotBlocking())}bind(e,t,i){var n,s,r,o;super.bind(e,t,i);const a=this._getTexture();if(!a)return;a.isCube?e.setTexture(this._cubeSamplerName,a):e.setTexture(this._2DSamplerName,a),e.setMatrix(this._refractionMatrixName,a.getRefractionTextureMatrix());let l=1;a.isCube||a.depth&&(l=a.depth);const h=null!==(o=null!==(s=null===(n=this.volumeIndexOfRefraction.connectInputBlock)||void 0===n?void 0:n.value)&&void 0!==s?s:null===(r=this.indexOfRefractionConnectionPoint.connectInputBlock)||void 0===r?void 0:r.value)&&void 0!==o?o:1.5;e.setFloat4(this._vRefractionInfosName,a.level,1/h,l,this.invertRefractionY?-1:1),e.setFloat4(this._vRefractionMicrosurfaceInfosName,a.getSize().width,a.lodGenerationScale,a.lodGenerationOffset,1/h);const c=a.getSize().width;if(e.setFloat2(this._vRefractionFilteringInfoName,c,lt.R.Log2(c)),a.boundingBoxSize){const t=a;e.setVector3("vRefractionPosition",t.boundingBoxPosition),e.setVector3("vRefractionSize",t.boundingBoxSize)}}getCode(e){return e.sharedData.blockingBlocks.push(this),e.sharedData.textureBlocks.push(this),this._cubeSamplerName=e._getFreeVariableName(this.name+"CubeSampler"),e.samplers.push(this._cubeSamplerName),this._2DSamplerName=e._getFreeVariableName(this.name+"2DSampler"),e.samplers.push(this._2DSamplerName),this._define3DName=e._getFreeDefineName("SS_REFRACTIONMAP_3D"),e._samplerDeclaration+=`#ifdef ${this._define3DName}\r\n`,e._samplerDeclaration+=`uniform samplerCube ${this._cubeSamplerName};\r\n`,e._samplerDeclaration+="#else\r\n",e._samplerDeclaration+=`uniform sampler2D ${this._2DSamplerName};\r\n`,e._samplerDeclaration+="#endif\r\n",e.sharedData.blocksWithDefines.push(this),e.sharedData.bindableBlocks.push(this),this._defineLODRefractionAlpha=e._getFreeDefineName("SS_LODINREFRACTIONALPHA"),this._defineLinearSpecularRefraction=e._getFreeDefineName("SS_LINEARSPECULARREFRACTION"),this._defineOppositeZ=e._getFreeDefineName("SS_REFRACTIONMAP_OPPOSITEZ"),this._refractionMatrixName=e._getFreeVariableName("refractionMatrix"),e._emitUniformFromString(this._refractionMatrixName,"mat4"),e._emitFunction("sampleRefraction",`\n            #ifdef ${this._define3DName}\n                #define sampleRefraction(s, c) textureCube(s, c)\n            #else\n                #define sampleRefraction(s, c) texture2D(s, c)\n            #endif\r\n`,`//${this.name}`),e._emitFunction("sampleRefractionLod",`\n            #ifdef ${this._define3DName}\n                #define sampleRefractionLod(s, c, l) textureCubeLodEXT(s, c, l)\n            #else\n                #define sampleRefractionLod(s, c, l) texture2DLodEXT(s, c, l)\n            #endif\r\n`,`//${this.name}`),this._vRefractionMicrosurfaceInfosName=e._getFreeVariableName("vRefractionMicrosurfaceInfos"),e._emitUniformFromString(this._vRefractionMicrosurfaceInfosName,"vec4"),this._vRefractionInfosName=e._getFreeVariableName("vRefractionInfos"),e._emitUniformFromString(this._vRefractionInfosName,"vec4"),this._vRefractionFilteringInfoName=e._getFreeVariableName("vRefractionFilteringInfo"),e._emitUniformFromString(this._vRefractionFilteringInfoName,"vec2"),e._emitUniformFromString("vRefractionPosition","vec3"),e._emitUniformFromString("vRefractionSize","vec3"),""}_buildBlock(e){return this._scene=e.sharedData.scene,this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return this.texture&&(e=this.texture.isCube?`${this._codeVariableName}.texture = new BABYLON.CubeTexture("${this.texture.name}");\r\n`:`${this._codeVariableName}.texture = new BABYLON.Texture("${this.texture.name}");\r\n`,e+=`${this._codeVariableName}.texture.coordinatesMode = ${this.texture.coordinatesMode};\r\n`),e+=`${this._codeVariableName}.linkRefractionWithTransparency = ${this.linkRefractionWithTransparency};\r\n`,e+=`${this._codeVariableName}.invertRefractionY = ${this.invertRefractionY};\r\n`,e+=`${this._codeVariableName}.useThicknessAsDepth = ${this.useThicknessAsDepth};\r\n`,e}serialize(){const e=super.serialize();return this.texture&&!this.texture.isRenderTarget&&(e.texture=this.texture.serialize()),e.linkRefractionWithTransparency=this.linkRefractionWithTransparency,e.invertRefractionY=this.invertRefractionY,e.useThicknessAsDepth=this.useThicknessAsDepth,e}_deserialize(e,t,i){super._deserialize(e,t,i),e.texture&&(i=0===e.texture.url.indexOf("data:")?"":i,e.texture.isCube?this.texture=Fa.B.Parse(e.texture,t,i):this.texture=Ce.x.Parse(e.texture,t,i)),this.linkRefractionWithTransparency=e.linkRefractionWithTransparency,this.invertRefractionY=e.invertRefractionY,this.useThicknessAsDepth=!!e.useThicknessAsDepth}}(0,be.gn)([(0,xu.p)("Link refraction to transparency",xu.U.Boolean,"ADVANCED",{notifiers:{update:!0}})],zd.prototype,"linkRefractionWithTransparency",void 0),(0,be.gn)([(0,xu.p)("Invert refraction Y",xu.U.Boolean,"ADVANCED",{notifiers:{update:!0}})],zd.prototype,"invertRefractionY",void 0),(0,be.gn)([(0,xu.p)("Use thickness as depth",xu.U.Boolean,"ADVANCED",{notifiers:{update:!0}})],zd.prototype,"useThicknessAsDepth",void 0),(0,l.H)("BABYLON.RefractionBlock",zd);class Wd extends du.k{constructor(e){super(e,ru.u.Fragment),this._isUnique=!0,this.registerInput("thickness",ou.E.Float,!1,ru.u.Fragment),this.registerInput("tintColor",ou.E.Color3,!0,ru.u.Fragment),this.registerInput("translucencyIntensity",ou.E.Float,!0,ru.u.Fragment),this.registerInput("translucencyDiffusionDist",ou.E.Color3,!0,ru.u.Fragment),this.registerInput("refraction",ou.E.Object,!0,ru.u.Fragment,new uu("refraction",this,cu.Ab.Input,zd,"RefractionBlock")),this.registerOutput("subsurface",ou.E.Object,ru.u.Fragment,new uu("subsurface",this,cu.Ab.Output,Wd,"SubSurfaceBlock"))}initialize(e){e._excludeVariableName("subSurfaceOut"),e._excludeVariableName("vThicknessParam"),e._excludeVariableName("vTintColor"),e._excludeVariableName("vSubSurfaceIntensity")}getClassName(){return"SubSurfaceBlock"}get thickness(){return this._inputs[0]}get tintColor(){return this._inputs[1]}get translucencyIntensity(){return this._inputs[2]}get translucencyDiffusionDist(){return this._inputs[3]}get refraction(){return this._inputs[4]}get subsurface(){return this._outputs[0]}autoConfigure(){if(!this.thickness.isConnected){const e=new fu.S("SubSurface thickness",ru.u.Fragment,ou.E.Float);e.value=0,e.output.connectTo(this.thickness)}}prepareDefines(e,t,i){super.prepareDefines(e,t,i);const n=this.translucencyDiffusionDist.isConnected||this.translucencyIntensity.isConnected;i.setValue("SUBSURFACE",n||this.refraction.isConnected,!0),i.setValue("SS_TRANSLUCENCY",n,!0),i.setValue("SS_THICKNESSANDMASK_TEXTURE",!1,!0),i.setValue("SS_REFRACTIONINTENSITY_TEXTURE",!1,!0),i.setValue("SS_TRANSLUCENCYINTENSITY_TEXTURE",!1,!0),i.setValue("SS_MASK_FROM_THICKNESS_TEXTURE",!1,!0),i.setValue("SS_USE_GLTF_TEXTURES",!1,!0)}static GetCode(e,t,i,n){var s,r,o,a,l,h,c,u,d,p,f,_,m,g,v,y;let x="";const b=(null==t?void 0:t.thickness.isConnected)?t.thickness.associatedVariableName:"0.",T=(null==t?void 0:t.tintColor.isConnected)?t.tintColor.associatedVariableName:"vec3(1.)",S=(null==t?void 0:t.translucencyIntensity.isConnected)?null==t?void 0:t.translucencyIntensity.associatedVariableName:"1.",E=(null==t?void 0:t.translucencyDiffusionDist.isConnected)?null==t?void 0:t.translucencyDiffusionDist.associatedVariableName:"vec3(1.)",C=(null==t?void 0:t.refraction.isConnected)?null===(s=null==t?void 0:t.refraction.connectedPoint)||void 0===s?void 0:s.ownerBlock:null,A=(null==C?void 0:C.tintAtDistance.isConnected)?C.tintAtDistance.associatedVariableName:"1.",P=(null==C?void 0:C.intensity.isConnected)?C.intensity.associatedVariableName:"1.",R=(null==C?void 0:C.view.isConnected)?C.view.associatedVariableName:"";return x+=null!==(r=null==C?void 0:C.getCode(e))&&void 0!==r?r:"",x+=`subSurfaceOutParams subSurfaceOut;\n\n        #ifdef SUBSURFACE\n            vec2 vThicknessParam = vec2(0., ${b});\n            vec4 vTintColor = vec4(${T}, ${A});\n            vec3 vSubSurfaceIntensity = vec3(${P}, ${S}, 0.);\n\n            subSurfaceBlock(\n                vSubSurfaceIntensity,\n                vThicknessParam,\n                vTintColor,\n                normalW,\n                specularEnvironmentReflectance,\n            #ifdef SS_THICKNESSANDMASK_TEXTURE\n                vec4(0.),\n            #endif\n            #ifdef REFLECTION\n                #ifdef SS_TRANSLUCENCY\n                    ${null==i?void 0:i._reflectionMatrixName},\n                    #ifdef USESPHERICALFROMREFLECTIONMAP\n                        #if !defined(NORMAL) || !defined(USESPHERICALINVERTEX)\n                            reflectionOut.irradianceVector,\n                        #endif\n                        #if defined(REALTIME_FILTERING)\n                            ${null==i?void 0:i._cubeSamplerName},\n                            ${null==i?void 0:i._vReflectionFilteringInfoName},\n                        #endif\n                        #endif\n                    #ifdef USEIRRADIANCEMAP\n                        irradianceSampler,\n                    #endif\n                #endif\n            #endif\n            #if defined(SS_REFRACTION) || defined(SS_TRANSLUCENCY)\n                surfaceAlbedo,\n            #endif\n            #ifdef SS_REFRACTION\n                ${n}.xyz,\n                viewDirectionW,\n                ${R},\n                ${null!==(o=null==C?void 0:C._vRefractionInfosName)&&void 0!==o?o:""},\n                ${null!==(a=null==C?void 0:C._refractionMatrixName)&&void 0!==a?a:""},\n                ${null!==(l=null==C?void 0:C._vRefractionMicrosurfaceInfosName)&&void 0!==l?l:""},\n                vLightingIntensity,\n                #ifdef SS_LINKREFRACTIONTOTRANSPARENCY\n                    alpha,\n                #endif\n                #ifdef ${null!==(h=null==C?void 0:C._defineLODRefractionAlpha)&&void 0!==h?h:"IGNORE"}\n                    NdotVUnclamped,\n                #endif\n                #ifdef ${null!==(c=null==C?void 0:C._defineLinearSpecularRefraction)&&void 0!==c?c:"IGNORE"}\n                    roughness,\n                #endif\n                alphaG,\n                #ifdef ${null!==(u=null==C?void 0:C._define3DName)&&void 0!==u?u:"IGNORE"}\n                    ${null!==(d=null==C?void 0:C._cubeSamplerName)&&void 0!==d?d:""},\n                #else\n                    ${null!==(p=null==C?void 0:C._2DSamplerName)&&void 0!==p?p:""},\n                #endif\n                #ifndef LODBASEDMICROSFURACE\n                    #ifdef ${null!==(f=null==C?void 0:C._define3DName)&&void 0!==f?f:"IGNORE"}\n                        ${null!==(_=null==C?void 0:C._cubeSamplerName)&&void 0!==_?_:""},\n                        ${null!==(m=null==C?void 0:C._cubeSamplerName)&&void 0!==m?m:""},\n                    #else\n                        ${null!==(g=null==C?void 0:C._2DSamplerName)&&void 0!==g?g:""},\n                        ${null!==(v=null==C?void 0:C._2DSamplerName)&&void 0!==v?v:""},\n                    #endif\n                #endif\n                #ifdef ANISOTROPIC\n                    anisotropicOut,\n                #endif\n                #ifdef REALTIME_FILTERING\n                    ${null!==(y=null==C?void 0:C._vRefractionFilteringInfoName)&&void 0!==y?y:""},\n                #endif\n                #ifdef SS_USE_LOCAL_REFRACTIONMAP_CUBIC\n                    vRefractionPosition,\n                    vRefractionSize,\n                #endif\n            #endif\n            #ifdef SS_TRANSLUCENCY\n                ${E},\n            #endif\n                subSurfaceOut\n            );\n\n            #ifdef SS_REFRACTION\n                surfaceAlbedo = subSurfaceOut.surfaceAlbedo;\n                #ifdef SS_LINKREFRACTIONTOTRANSPARENCY\n                    alpha = subSurfaceOut.alpha;\n                #endif\n            #endif\n        #else\n            subSurfaceOut.specularEnvironmentReflectance = specularEnvironmentReflectance;\n        #endif\r\n`,x}_buildBlock(e){return e.target===ru.u.Fragment&&e.sharedData.blocksWithDefines.push(this),this}}(0,l.H)("BABYLON.SubSurfaceBlock",Wd);const Hd={ambientClr:["finalAmbient",""],diffuseDir:["finalDiffuse",""],specularDir:["finalSpecularScaled","!defined(UNLIT) && defined(SPECULARTERM)"],clearcoatDir:["finalClearCoatScaled","!defined(UNLIT) && defined(CLEARCOAT)"],sheenDir:["finalSheenScaled","!defined(UNLIT) && defined(SHEEN)"],diffuseInd:["finalIrradiance","!defined(UNLIT) && defined(REFLECTION)"],specularInd:["finalRadianceScaled","!defined(UNLIT) && defined(REFLECTION)"],clearcoatInd:["clearcoatOut.finalClearCoatRadianceScaled","!defined(UNLIT) && defined(REFLECTION) && defined(CLEARCOAT)"],sheenInd:["sheenOut.finalSheenRadianceScaled","!defined(UNLIT) && defined(REFLECTION) && defined(SHEEN) && defined(ENVIRONMENTBRDF)"],refraction:["subSurfaceOut.finalRefraction","!defined(UNLIT) && defined(SS_REFRACTION)"],lighting:["finalColor.rgb",""],shadow:["shadow",""],alpha:["alpha",""]};class Xd extends du.k{static _OnGenerateOnlyFragmentCodeChanged(e,t){const i=e;return i.worldPosition.isConnected?(i.generateOnlyFragmentCode=!i.generateOnlyFragmentCode,console.error("The worldPosition input must not be connected to be able to switch!"),!1):(i._setTarget(),!0)}_setTarget(){this._setInitialTarget(this.generateOnlyFragmentCode?ru.u.Fragment:ru.u.VertexAndFragment),this.getInputByName("worldPosition").target=this.generateOnlyFragmentCode?ru.u.Fragment:ru.u.Vertex}constructor(e){super(e,ru.u.VertexAndFragment),this._environmentBRDFTexture=null,this._metallicReflectanceColor=a.Wo.White(),this._metallicF0Factor=1,this.directIntensity=1,this.environmentIntensity=1,this.specularIntensity=1,this.lightFalloff=0,this.useAlphaTest=!1,this.alphaTestCutoff=.5,this.useAlphaBlending=!1,this.useRadianceOverAlpha=!0,this.useSpecularOverAlpha=!0,this.enableSpecularAntiAliasing=!1,this.realTimeFiltering=!1,this.realTimeFilteringQuality=8,this.useEnergyConservation=!0,this.useRadianceOcclusion=!0,this.useHorizonOcclusion=!0,this.unlit=!1,this.forceNormalForward=!1,this.generateOnlyFragmentCode=!1,this.debugMode=0,this.debugLimit=0,this.debugFactor=1,this._isUnique=!0,this.registerInput("worldPosition",ou.E.Vector4,!1,ru.u.Vertex),this.registerInput("worldNormal",ou.E.Vector4,!1,ru.u.Fragment),this.registerInput("view",ou.E.Matrix,!1),this.registerInput("cameraPosition",ou.E.Vector3,!1,ru.u.Fragment),this.registerInput("perturbedNormal",ou.E.Vector4,!0,ru.u.Fragment),this.registerInput("baseColor",ou.E.Color3,!0,ru.u.Fragment),this.registerInput("metallic",ou.E.Float,!1,ru.u.Fragment),this.registerInput("roughness",ou.E.Float,!1,ru.u.Fragment),this.registerInput("ambientOcc",ou.E.Float,!0,ru.u.Fragment),this.registerInput("opacity",ou.E.Float,!0,ru.u.Fragment),this.registerInput("indexOfRefraction",ou.E.Float,!0,ru.u.Fragment),this.registerInput("ambientColor",ou.E.Color3,!0,ru.u.Fragment),this.registerInput("reflection",ou.E.Object,!0,ru.u.Fragment,new uu("reflection",this,cu.Ab.Input,Vd,"ReflectionBlock")),this.registerInput("clearcoat",ou.E.Object,!0,ru.u.Fragment,new uu("clearcoat",this,cu.Ab.Input,kd,"ClearCoatBlock")),this.registerInput("sheen",ou.E.Object,!0,ru.u.Fragment,new uu("sheen",this,cu.Ab.Input,Ld,"SheenBlock")),this.registerInput("subsurface",ou.E.Object,!0,ru.u.Fragment,new uu("subsurface",this,cu.Ab.Input,Wd,"SubSurfaceBlock")),this.registerInput("anisotropy",ou.E.Object,!0,ru.u.Fragment,new uu("anisotropy",this,cu.Ab.Input,Ud,"AnisotropyBlock")),this.registerInput("iridescence",ou.E.Object,!0,ru.u.Fragment,new uu("iridescence",this,cu.Ab.Input,Gd,"IridescenceBlock")),this.registerOutput("ambientClr",ou.E.Color3,ru.u.Fragment),this.registerOutput("diffuseDir",ou.E.Color3,ru.u.Fragment),this.registerOutput("specularDir",ou.E.Color3,ru.u.Fragment),this.registerOutput("clearcoatDir",ou.E.Color3,ru.u.Fragment),this.registerOutput("sheenDir",ou.E.Color3,ru.u.Fragment),this.registerOutput("diffuseInd",ou.E.Color3,ru.u.Fragment),this.registerOutput("specularInd",ou.E.Color3,ru.u.Fragment),this.registerOutput("clearcoatInd",ou.E.Color3,ru.u.Fragment),this.registerOutput("sheenInd",ou.E.Color3,ru.u.Fragment),this.registerOutput("refraction",ou.E.Color3,ru.u.Fragment),this.registerOutput("lighting",ou.E.Color3,ru.u.Fragment),this.registerOutput("shadow",ou.E.Float,ru.u.Fragment),this.registerOutput("alpha",ou.E.Float,ru.u.Fragment)}initialize(e){e._excludeVariableName("vLightingIntensity"),e._excludeVariableName("geometricNormalW"),e._excludeVariableName("normalW"),e._excludeVariableName("faceNormal"),e._excludeVariableName("albedoOpacityOut"),e._excludeVariableName("surfaceAlbedo"),e._excludeVariableName("alpha"),e._excludeVariableName("aoOut"),e._excludeVariableName("baseColor"),e._excludeVariableName("reflectivityOut"),e._excludeVariableName("microSurface"),e._excludeVariableName("roughness"),e._excludeVariableName("NdotVUnclamped"),e._excludeVariableName("NdotV"),e._excludeVariableName("alphaG"),e._excludeVariableName("AARoughnessFactors"),e._excludeVariableName("environmentBrdf"),e._excludeVariableName("ambientMonochrome"),e._excludeVariableName("seo"),e._excludeVariableName("eho"),e._excludeVariableName("environmentRadiance"),e._excludeVariableName("irradianceVector"),e._excludeVariableName("environmentIrradiance"),e._excludeVariableName("diffuseBase"),e._excludeVariableName("specularBase"),e._excludeVariableName("preInfo"),e._excludeVariableName("info"),e._excludeVariableName("shadow"),e._excludeVariableName("finalDiffuse"),e._excludeVariableName("finalAmbient"),e._excludeVariableName("ambientOcclusionForDirectDiffuse"),e._excludeVariableName("finalColor"),e._excludeVariableName("vClipSpacePosition"),e._excludeVariableName("vDebugMode")}getClassName(){return"PBRMetallicRoughnessBlock"}get worldPosition(){return this._inputs[0]}get worldNormal(){return this._inputs[1]}get view(){return this._inputs[2]}get cameraPosition(){return this._inputs[3]}get perturbedNormal(){return this._inputs[4]}get baseColor(){return this._inputs[5]}get metallic(){return this._inputs[6]}get roughness(){return this._inputs[7]}get ambientOcc(){return this._inputs[8]}get opacity(){return this._inputs[9]}get indexOfRefraction(){return this._inputs[10]}get ambientColor(){return this._inputs[11]}get reflection(){return this._inputs[12]}get clearcoat(){return this._inputs[13]}get sheen(){return this._inputs[14]}get subsurface(){return this._inputs[15]}get anisotropy(){return this._inputs[16]}get iridescence(){return this._inputs[17]}get ambientClr(){return this._outputs[0]}get diffuseDir(){return this._outputs[1]}get specularDir(){return this._outputs[2]}get clearcoatDir(){return this._outputs[3]}get sheenDir(){return this._outputs[4]}get diffuseInd(){return this._outputs[5]}get specularInd(){return this._outputs[6]}get clearcoatInd(){return this._outputs[7]}get sheenInd(){return this._outputs[8]}get refraction(){return this._outputs[9]}get lighting(){return this._outputs[10]}get shadow(){return this._outputs[11]}get alpha(){return this._outputs[12]}autoConfigure(e){if(!this.cameraPosition.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.CameraPosition));t||(t=new fu.S("cameraPosition"),t.setAsSystemValue(lu.$.CameraPosition)),t.output.connectTo(this.cameraPosition)}if(!this.view.isConnected){let t=e.getInputBlockByPredicate((e=>e.systemValue===lu.$.View));t||(t=new fu.S("view"),t.setAsSystemValue(lu.$.View)),t.output.connectTo(this.view)}}prepareDefines(e,t,i){i.setValue("PBR",!0),i.setValue("METALLICWORKFLOW",!0),i.setValue("DEBUGMODE",this.debugMode,!0),i.setValue("NORMALXYSCALE",!0),i.setValue("BUMP",this.perturbedNormal.isConnected,!0),i.setValue("LODBASEDMICROSFURACE",this._scene.getEngine().getCaps().textureLOD),i.setValue("ALBEDO",!1,!0),i.setValue("OPACITY",this.opacity.isConnected,!0),i.setValue("AMBIENT",!0,!0),i.setValue("AMBIENTINGRAYSCALE",!1,!0),i.setValue("REFLECTIVITY",!1,!0),i.setValue("AOSTOREINMETALMAPRED",!1,!0),i.setValue("METALLNESSSTOREINMETALMAPBLUE",!1,!0),i.setValue("ROUGHNESSSTOREINMETALMAPALPHA",!1,!0),i.setValue("ROUGHNESSSTOREINMETALMAPGREEN",!1,!0),this.lightFalloff===nc.m.LIGHTFALLOFF_STANDARD?(i.setValue("USEPHYSICALLIGHTFALLOFF",!1),i.setValue("USEGLTFLIGHTFALLOFF",!1)):this.lightFalloff===nc.m.LIGHTFALLOFF_GLTF?(i.setValue("USEPHYSICALLIGHTFALLOFF",!1),i.setValue("USEGLTFLIGHTFALLOFF",!0)):(i.setValue("USEPHYSICALLIGHTFALLOFF",!0),i.setValue("USEGLTFLIGHTFALLOFF",!1));const n=this.alphaTestCutoff.toString();i.setValue("ALPHABLEND",this.useAlphaBlending,!0),i.setValue("ALPHAFROMALBEDO",!1,!0),i.setValue("ALPHATEST",this.useAlphaTest,!0),i.setValue("ALPHATESTVALUE",n.indexOf(".")<0?n+".":n,!0),i.setValue("OPACITYRGB",!1,!0),i.setValue("RADIANCEOVERALPHA",this.useRadianceOverAlpha,!0),i.setValue("SPECULAROVERALPHA",this.useSpecularOverAlpha,!0),i.setValue("SPECULARAA",this._scene.getEngine().getCaps().standardDerivatives&&this.enableSpecularAntiAliasing,!0),i.setValue("REALTIME_FILTERING",this.realTimeFiltering,!0);const s=e.getScene();if(s.getEngine()._features.needTypeSuffixInShaderConstants?i.setValue("NUM_SAMPLES",this.realTimeFilteringQuality+"u",!0):i.setValue("NUM_SAMPLES",""+this.realTimeFilteringQuality,!0),i.setValue("BRDF_V_HEIGHT_CORRELATED",!0),i.setValue("MS_BRDF_ENERGY_CONSERVATION",this.useEnergyConservation,!0),i.setValue("RADIANCEOCCLUSION",this.useRadianceOcclusion,!0),i.setValue("HORIZONOCCLUSION",this.useHorizonOcclusion,!0),i.setValue("UNLIT",this.unlit,!0),i.setValue("FORCENORMALFORWARD",this.forceNormalForward,!0),this._environmentBRDFTexture&&Va.k.ReflectionTextureEnabled?(i.setValue("ENVIRONMENTBRDF",!0),i.setValue("ENVIRONMENTBRDF_RGBD",this._environmentBRDFTexture.isRGBD,!0)):(i.setValue("ENVIRONMENTBRDF",!1),i.setValue("ENVIRONMENTBRDF_RGBD",!1)),i._areImageProcessingDirty&&t.imageProcessingConfiguration&&t.imageProcessingConfiguration.prepareDefines(i),i._areLightsDirty)if(this.light){const t={needNormals:!1,needRebuild:!1,lightmapMode:!1,shadowEnabled:!1,specularEnabled:!1};La.G.PrepareDefinesForLight(s,e,this.light,this._lightId,i,!0,t),t.needRebuild&&i.rebuild()}else La.G.PrepareDefinesForLights(s,e,i,!0,t.maxSimultaneousLights),i._needNormals=!0,La.G.PrepareDefinesForMultiview(s,i)}updateUniformsAndSamples(e,t,i,n){for(let s=0;s<t.maxSimultaneousLights&&i["LIGHT"+s];s++){const t=e.uniforms.indexOf("vLightData"+s)>=0;La.G.PrepareUniformsAndSamplersForLight(s,e.uniforms,e.samplers,i["PROJECTEDLIGHTTEXTURE"+s],n,t)}}isReady(e,t,i){return!(this._environmentBRDFTexture&&!this._environmentBRDFTexture.isReady()||i._areImageProcessingDirty&&t.imageProcessingConfiguration&&!t.imageProcessingConfiguration.isReady())}bind(e,t,i){var n,s;if(!i)return;const r=i.getScene();this.light?La.G.BindLight(this.light,this._lightId,r,e,!0):La.G.BindLights(r,i,e,!0,t.maxSimultaneousLights),e.setTexture(this._environmentBrdfSamplerName,this._environmentBRDFTexture),e.setFloat2("vDebugMode",this.debugLimit,this.debugFactor);const o=this._scene.ambientColor;o&&e.setColor3("ambientFromScene",o);const l=r.useRightHandedSystem===(null!=r._mirroredCameraPosition);e.setFloat(this._invertNormalName,l?-1:1),e.setFloat4("vLightingIntensity",this.directIntensity,1,this.environmentIntensity*this._scene.environmentIntensity,this.specularIntensity);const h=null!==(s=null===(n=this.indexOfRefraction.connectInputBlock)||void 0===n?void 0:n.value)&&void 0!==s?s:1.5,c=Math.pow((h-1)/(h+1),2);this._metallicReflectanceColor.scaleToRef(c*this._metallicF0Factor,a.zZ.Color3[0]);const u=this._metallicF0Factor;e.setColor4(this._vMetallicReflectanceFactorsName,a.zZ.Color3[0],u),t.imageProcessingConfiguration&&t.imageProcessingConfiguration.bind(e)}_injectVertexCode(e){var t,i;const n=this.worldPosition,s=`//${this.name}`;this.light?(this._lightId=(void 0!==e.counters.lightCounter?e.counters.lightCounter:-1)+1,e.counters.lightCounter=this._lightId,e._emitFunctionFromInclude(e.supportUniformBuffers?"lightVxUboDeclaration":"lightVxFragmentDeclaration",s,{replaceStrings:[{search:/{X}/g,replace:this._lightId.toString()}]},this._lightId.toString())):(e._emitFunctionFromInclude(e.supportUniformBuffers?"lightVxUboDeclaration":"lightVxFragmentDeclaration",s,{repeatKey:"maxSimultaneousLights"}),this._lightId=0,e.sharedData.dynamicUniformBlocks.push(this));const r="v_"+n.associatedVariableName;e._emitVaryingFromString(r,"vec4")&&(e.compilationString+=`${r} = ${n.associatedVariableName};\r\n`);const o=this.reflection.isConnected?null===(t=this.reflection.connectedPoint)||void 0===t?void 0:t.ownerBlock:null;o&&(o.viewConnectionPoint=this.view),e.compilationString+=null!==(i=null==o?void 0:o.handleVertexSide(e))&&void 0!==i?i:"",e._emitVaryingFromString("vClipSpacePosition","vec4","defined(IGNORE) || DEBUGMODE > 0")&&(e._injectAtEnd+="#if DEBUGMODE > 0\r\n",e._injectAtEnd+="vClipSpacePosition = gl_Position;\r\n",e._injectAtEnd+="#endif\r\n"),this.light?e.compilationString+=e._emitCodeFromInclude("shadowsVertex",s,{replaceStrings:[{search:/{X}/g,replace:this._lightId.toString()},{search:/worldPos/g,replace:n.associatedVariableName}]}):(e.compilationString+=`vec4 worldPos = ${n.associatedVariableName};\r\n`,this.view.isConnected&&(e.compilationString+=`mat4 view = ${this.view.associatedVariableName};\r\n`),e.compilationString+=e._emitCodeFromInclude("shadowsVertex",s,{repeatKey:"maxSimultaneousLights"}))}_getAlbedoOpacityCode(){let e="albedoOpacityOutParams albedoOpacityOut;\r\n";return e+=`albedoOpacityBlock(\n                vec4(${this.baseColor.isConnected?this.baseColor.associatedVariableName:"vec3(1.)"}, 1.),\n            #ifdef ALBEDO\n                vec4(1.),\n                vec2(1., 1.),\n            #endif\n            #ifdef OPACITY\n                vec4(${this.opacity.isConnected?this.opacity.associatedVariableName:"1."}),\n                vec2(1., 1.),\n            #endif\n                albedoOpacityOut\n            );\n\n            vec3 surfaceAlbedo = albedoOpacityOut.surfaceAlbedo;\n            float alpha = albedoOpacityOut.alpha;\r\n`,e}_getAmbientOcclusionCode(){let e="ambientOcclusionOutParams aoOut;\r\n";return e+=`ambientOcclusionBlock(\n            #ifdef AMBIENT\n                vec3(${this.ambientOcc.isConnected?this.ambientOcc.associatedVariableName:"1."}),\n                vec4(0., 1.0, 1.0, 0.),\n            #endif\n                aoOut\n            );\r\n`,e}_getReflectivityCode(e){let t="reflectivityOutParams reflectivityOut;\r\n";return this._vMetallicReflectanceFactorsName=e._getFreeVariableName("vMetallicReflectanceFactors"),e._emitUniformFromString(this._vMetallicReflectanceFactorsName,"vec4"),t+=`vec3 baseColor = surfaceAlbedo;\n\n            reflectivityBlock(\n                vec4(${this.metallic.associatedVariableName}, ${this.roughness.associatedVariableName}, 0., 0.),\n            #ifdef METALLICWORKFLOW\n                surfaceAlbedo,\n                ${this._vMetallicReflectanceFactorsName},\n            #endif\n            #ifdef REFLECTIVITY\n                vec3(0., 0., 1.),\n                vec4(1.),\n            #endif\n            #if defined(METALLICWORKFLOW) && defined(REFLECTIVITY)  && defined(AOSTOREINMETALMAPRED)\n                aoOut.ambientOcclusionColor,\n            #endif\n            #ifdef MICROSURFACEMAP\n                microSurfaceTexel, <== not handled!\n            #endif\n                reflectivityOut\n            );\n\n            float microSurface = reflectivityOut.microSurface;\n            float roughness = reflectivityOut.roughness;\n\n            #ifdef METALLICWORKFLOW\n                surfaceAlbedo = reflectivityOut.surfaceAlbedo;\n            #endif\n            #if defined(METALLICWORKFLOW) && defined(REFLECTIVITY) && defined(AOSTOREINMETALMAPRED)\n                aoOut.ambientOcclusionColor = reflectivityOut.ambientOcclusionColor;\n            #endif\r\n`,t}_buildBlock(e){var t,i,n,s,r,o,a,l,h,c,u,d,p,f,_,m,g,v,y,x,b,T,S,E,C,A,P,R,M,I,D,O,w,N,F,L,B,U,V,k,G;super._buildBlock(e),this._scene=e.sharedData.scene,this._environmentBRDFTexture||(this._environmentBRDFTexture=(0,Bd.$)(this._scene));const z=this.reflection.isConnected?null===(t=this.reflection.connectedPoint)||void 0===t?void 0:t.ownerBlock:null;if(z&&(z.worldPositionConnectionPoint=this.worldPosition,z.cameraPositionConnectionPoint=this.cameraPosition,z.worldNormalConnectionPoint=this.worldNormal,z.viewConnectionPoint=this.view),e.target!==ru.u.Fragment)return this._injectVertexCode(e),this;e.sharedData.forcedBindableBlocks.push(this),e.sharedData.blocksWithDefines.push(this),e.sharedData.blockingBlocks.push(this),this.generateOnlyFragmentCode&&e.sharedData.dynamicUniformBlocks.push(this);const W=`//${this.name}`,H=this.perturbedNormal;let X=this.worldPosition.associatedVariableName;this.generateOnlyFragmentCode?(X=e._getFreeVariableName("globalWorldPos"),e._emitFunction("pbr_globalworldpos",`vec3 ${X};\r\n`,W),e.compilationString+=`${X} = ${this.worldPosition.associatedVariableName}.xyz;\r\n`,e.compilationString+=e._emitCodeFromInclude("shadowsVertex",W,{repeatKey:"maxSimultaneousLights",substitutionVars:this.generateOnlyFragmentCode?`worldPos,${this.worldPosition.associatedVariableName}`:void 0}),e.compilationString+="#if DEBUGMODE > 0\r\n",e.compilationString+="vec4 vClipSpacePosition = vec4((vec2(gl_FragCoord.xy) / vec2(1.0)) * 2.0 - 1.0, 0.0, 1.0);\r\n",e.compilationString+="#endif\r\n"):X="v_"+X,this._environmentBrdfSamplerName=e._getFreeVariableName("environmentBrdfSampler"),e._emit2DSampler(this._environmentBrdfSamplerName),e.sharedData.hints.needAlphaBlending=e.sharedData.hints.needAlphaBlending||this.useAlphaBlending,e.sharedData.hints.needAlphaTesting=e.sharedData.hints.needAlphaTesting||this.useAlphaTest,e._emitExtension("lod","#extension GL_EXT_shader_texture_lod : enable","defined(LODBASEDMICROSFURACE)"),e._emitExtension("derivatives","#extension GL_OES_standard_derivatives : enable"),e._emitUniformFromString("vDebugMode","vec2","defined(IGNORE) || DEBUGMODE > 0"),e._emitUniformFromString("ambientFromScene","vec3"),e.uniforms.push("exposureLinear"),e.uniforms.push("contrast"),e.uniforms.push("vInverseScreenSize"),e.uniforms.push("vignetteSettings1"),e.uniforms.push("vignetteSettings2"),e.uniforms.push("vCameraColorCurveNegative"),e.uniforms.push("vCameraColorCurveNeutral"),e.uniforms.push("vCameraColorCurvePositive"),e.uniforms.push("txColorTransform"),e.uniforms.push("colorTransformSettings"),e.uniforms.push("ditherIntensity"),this.light?e._emitFunctionFromInclude(e.supportUniformBuffers?"lightUboDeclaration":"lightFragmentDeclaration",W,{replaceStrings:[{search:/{X}/g,replace:this._lightId.toString()}]},this._lightId.toString()):e._emitFunctionFromInclude(e.supportUniformBuffers?"lightUboDeclaration":"lightFragmentDeclaration",W,{repeatKey:"maxSimultaneousLights",substitutionVars:this.generateOnlyFragmentCode?"varying,":void 0}),e._emitFunctionFromInclude("helperFunctions",W),e._emitFunctionFromInclude("importanceSampling",W),e._emitFunctionFromInclude("pbrHelperFunctions",W),e._emitFunctionFromInclude("imageProcessingDeclaration",W),e._emitFunctionFromInclude("imageProcessingFunctions",W),e._emitFunctionFromInclude("shadowsFragmentFunctions",W,{replaceStrings:[{search:/vPositionW/g,replace:X+".xyz"}]}),e._emitFunctionFromInclude("pbrDirectLightingSetupFunctions",W,{replaceStrings:[{search:/vPositionW/g,replace:X+".xyz"}]}),e._emitFunctionFromInclude("pbrDirectLightingFalloffFunctions",W),e._emitFunctionFromInclude("pbrBRDFFunctions",W,{replaceStrings:[{search:/REFLECTIONMAP_SKYBOX/g,replace:null!==(i=null==z?void 0:z._defineSkyboxName)&&void 0!==i?i:"REFLECTIONMAP_SKYBOX"}]}),e._emitFunctionFromInclude("hdrFilteringFunctions",W),e._emitFunctionFromInclude("pbrDirectLightingFunctions",W,{replaceStrings:[{search:/vPositionW/g,replace:X+".xyz"}]}),e._emitFunctionFromInclude("pbrIBLFunctions",W),e._emitFunctionFromInclude("pbrBlockAlbedoOpacity",W),e._emitFunctionFromInclude("pbrBlockReflectivity",W),e._emitFunctionFromInclude("pbrBlockAmbientOcclusion",W),e._emitFunctionFromInclude("pbrBlockAlphaFresnel",W),e._emitFunctionFromInclude("pbrBlockAnisotropic",W),e._emitUniformFromString("vLightingIntensity","vec4"),(null==z?void 0:z.generateOnlyFragmentCode)&&(e.compilationString+=z.handleVertexSide(e)),this._vNormalWName=e._getFreeVariableName("vNormalW"),e.compilationString+=`vec4 ${this._vNormalWName} = normalize(${this.worldNormal.associatedVariableName});\r\n`,e._registerTempVariable("viewDirectionW")&&(e.compilationString+=`vec3 viewDirectionW = normalize(${this.cameraPosition.associatedVariableName} - ${X}.xyz);\r\n`),e.compilationString+=`vec3 geometricNormalW = ${this._vNormalWName}.xyz;\r\n`,e.compilationString+=`vec3 normalW = ${H.isConnected?"normalize("+H.associatedVariableName+".xyz)":"geometricNormalW"};\r\n`,this._invertNormalName=e._getFreeVariableName("invertNormal"),e._emitUniformFromString(this._invertNormalName,"float"),e.compilationString+=e._emitCodeFromInclude("pbrBlockNormalFinal",W,{replaceStrings:[{search:/vPositionW/g,replace:X+".xyz"},{search:/vEyePosition.w/g,replace:this._invertNormalName}]}),e.compilationString+=this._getAlbedoOpacityCode(),e.compilationString+=e._emitCodeFromInclude("depthPrePass",W),e.compilationString+=this._getAmbientOcclusionCode(),e.compilationString+=e._emitCodeFromInclude("pbrBlockLightmapInit",W),e.compilationString+="#ifdef UNLIT\n                vec3 diffuseBase = vec3(1., 1., 1.);\n            #else\r\n",e.compilationString+=this._getReflectivityCode(e),e.compilationString+=e._emitCodeFromInclude("pbrBlockGeometryInfo",W,{replaceStrings:[{search:/REFLECTIONMAP_SKYBOX/g,replace:null!==(n=null==z?void 0:z._defineSkyboxName)&&void 0!==n?n:"REFLECTIONMAP_SKYBOX"},{search:/REFLECTIONMAP_3D/g,replace:null!==(s=null==z?void 0:z._define3DName)&&void 0!==s?s:"REFLECTIONMAP_3D"}]});const j=this.anisotropy.isConnected?null===(r=this.anisotropy.connectedPoint)||void 0===r?void 0:r.ownerBlock:null;j&&(j.worldPositionConnectionPoint=this.worldPosition,j.worldNormalConnectionPoint=this.worldNormal,e.compilationString+=j.getCode(e,!this.perturbedNormal.isConnected)),z&&z.hasTexture&&(e.compilationString+=z.getCode(e,j?"anisotropicOut.anisotropicNormal":"normalW")),e._emitFunctionFromInclude("pbrBlockReflection",W,{replaceStrings:[{search:/computeReflectionCoords/g,replace:"computeReflectionCoordsPBR"},{search:/REFLECTIONMAP_3D/g,replace:null!==(o=null==z?void 0:z._define3DName)&&void 0!==o?o:"REFLECTIONMAP_3D"},{search:/REFLECTIONMAP_OPPOSITEZ/g,replace:null!==(a=null==z?void 0:z._defineOppositeZ)&&void 0!==a?a:"REFLECTIONMAP_OPPOSITEZ"},{search:/REFLECTIONMAP_PROJECTION/g,replace:null!==(l=null==z?void 0:z._defineProjectionName)&&void 0!==l?l:"REFLECTIONMAP_PROJECTION"},{search:/REFLECTIONMAP_SKYBOX/g,replace:null!==(h=null==z?void 0:z._defineSkyboxName)&&void 0!==h?h:"REFLECTIONMAP_SKYBOX"},{search:/LODINREFLECTIONALPHA/g,replace:null!==(c=null==z?void 0:z._defineLODReflectionAlpha)&&void 0!==c?c:"LODINREFLECTIONALPHA"},{search:/LINEARSPECULARREFLECTION/g,replace:null!==(u=null==z?void 0:z._defineLinearSpecularReflection)&&void 0!==u?u:"LINEARSPECULARREFLECTION"},{search:/vReflectionFilteringInfo/g,replace:null!==(d=null==z?void 0:z._vReflectionFilteringInfoName)&&void 0!==d?d:"vReflectionFilteringInfo"}]}),e.compilationString+=e._emitCodeFromInclude("pbrBlockReflectance0",W,{replaceStrings:[{search:/metallicReflectanceFactors/g,replace:this._vMetallicReflectanceFactorsName}]});const Y=this.sheen.isConnected?null===(p=this.sheen.connectedPoint)||void 0===p?void 0:p.ownerBlock:null;Y&&(e.compilationString+=Y.getCode(z)),e._emitFunctionFromInclude("pbrBlockSheen",W,{replaceStrings:[{search:/REFLECTIONMAP_3D/g,replace:null!==(f=null==z?void 0:z._define3DName)&&void 0!==f?f:"REFLECTIONMAP_3D"},{search:/REFLECTIONMAP_SKYBOX/g,replace:null!==(_=null==z?void 0:z._defineSkyboxName)&&void 0!==_?_:"REFLECTIONMAP_SKYBOX"},{search:/LODINREFLECTIONALPHA/g,replace:null!==(m=null==z?void 0:z._defineLODReflectionAlpha)&&void 0!==m?m:"LODINREFLECTIONALPHA"},{search:/LINEARSPECULARREFLECTION/g,replace:null!==(g=null==z?void 0:z._defineLinearSpecularReflection)&&void 0!==g?g:"LINEARSPECULARREFLECTION"}]});const q=this.iridescence.isConnected?null===(v=this.iridescence.connectedPoint)||void 0===v?void 0:v.ownerBlock:null;e.compilationString+=Gd.GetCode(q),e._emitFunctionFromInclude("pbrBlockIridescence",W,{replaceStrings:[]});const K=this.clearcoat.isConnected?null===(y=this.clearcoat.connectedPoint)||void 0===y?void 0:y.ownerBlock:null,$=!this.perturbedNormal.isConnected&&!this.anisotropy.isConnected,Q=this.perturbedNormal.isConnected&&(null===(b=(null===(x=this.perturbedNormal.connectedPoint)||void 0===x?void 0:x.ownerBlock).worldTangent)||void 0===b?void 0:b.isConnected),Z=this.anisotropy.isConnected&&(null===(T=this.anisotropy.connectedPoint)||void 0===T?void 0:T.ownerBlock).worldTangent.isConnected;let J=Q||!this.perturbedNormal.isConnected&&Z;e.compilationString+=kd.GetCode(e,K,z,X,$,J,this.worldNormal.associatedVariableName),$&&(J=null!==(S=null==K?void 0:K.worldTangent.isConnected)&&void 0!==S&&S),e._emitFunctionFromInclude("pbrBlockClearcoat",W,{replaceStrings:[{search:/computeReflectionCoords/g,replace:"computeReflectionCoordsPBR"},{search:/REFLECTIONMAP_3D/g,replace:null!==(E=null==z?void 0:z._define3DName)&&void 0!==E?E:"REFLECTIONMAP_3D"},{search:/REFLECTIONMAP_OPPOSITEZ/g,replace:null!==(C=null==z?void 0:z._defineOppositeZ)&&void 0!==C?C:"REFLECTIONMAP_OPPOSITEZ"},{search:/REFLECTIONMAP_PROJECTION/g,replace:null!==(A=null==z?void 0:z._defineProjectionName)&&void 0!==A?A:"REFLECTIONMAP_PROJECTION"},{search:/REFLECTIONMAP_SKYBOX/g,replace:null!==(P=null==z?void 0:z._defineSkyboxName)&&void 0!==P?P:"REFLECTIONMAP_SKYBOX"},{search:/LODINREFLECTIONALPHA/g,replace:null!==(R=null==z?void 0:z._defineLODReflectionAlpha)&&void 0!==R?R:"LODINREFLECTIONALPHA"},{search:/LINEARSPECULARREFLECTION/g,replace:null!==(M=null==z?void 0:z._defineLinearSpecularReflection)&&void 0!==M?M:"LINEARSPECULARREFLECTION"},{search:/defined\(TANGENT\)/g,replace:J?"defined(TANGENT)":"defined(IGNORE)"}]}),e.compilationString+=e._emitCodeFromInclude("pbrBlockReflectance",W,{replaceStrings:[{search:/REFLECTIONMAP_SKYBOX/g,replace:null!==(I=null==z?void 0:z._defineSkyboxName)&&void 0!==I?I:"REFLECTIONMAP_SKYBOX"},{search:/REFLECTIONMAP_3D/g,replace:null!==(D=null==z?void 0:z._define3DName)&&void 0!==D?D:"REFLECTIONMAP_3D"}]});const ee=this.subsurface.isConnected?null===(O=this.subsurface.connectedPoint)||void 0===O?void 0:O.ownerBlock:null,te=this.subsurface.isConnected?null===(N=(null===(w=this.subsurface.connectedPoint)||void 0===w?void 0:w.ownerBlock).refraction.connectedPoint)||void 0===N?void 0:N.ownerBlock:null;te&&(te.viewConnectionPoint=this.view,te.indexOfRefractionConnectionPoint=this.indexOfRefraction),e.compilationString+=Wd.GetCode(e,ee,z,X),e._emitFunctionFromInclude("pbrBlockSubSurface",W,{replaceStrings:[{search:/REFLECTIONMAP_3D/g,replace:null!==(F=null==z?void 0:z._define3DName)&&void 0!==F?F:"REFLECTIONMAP_3D"},{search:/REFLECTIONMAP_OPPOSITEZ/g,replace:null!==(L=null==z?void 0:z._defineOppositeZ)&&void 0!==L?L:"REFLECTIONMAP_OPPOSITEZ"},{search:/REFLECTIONMAP_PROJECTION/g,replace:null!==(B=null==z?void 0:z._defineProjectionName)&&void 0!==B?B:"REFLECTIONMAP_PROJECTION"},{search:/SS_REFRACTIONMAP_3D/g,replace:null!==(U=null==te?void 0:te._define3DName)&&void 0!==U?U:"SS_REFRACTIONMAP_3D"},{search:/SS_LODINREFRACTIONALPHA/g,replace:null!==(V=null==te?void 0:te._defineLODRefractionAlpha)&&void 0!==V?V:"SS_LODINREFRACTIONALPHA"},{search:/SS_LINEARSPECULARREFRACTION/g,replace:null!==(k=null==te?void 0:te._defineLinearSpecularRefraction)&&void 0!==k?k:"SS_LINEARSPECULARREFRACTION"},{search:/SS_REFRACTIONMAP_OPPOSITEZ/g,replace:null!==(G=null==te?void 0:te._defineOppositeZ)&&void 0!==G?G:"SS_REFRACTIONMAP_OPPOSITEZ"}]}),e.compilationString+=e._emitCodeFromInclude("pbrBlockDirectLighting",W),this.light?e.compilationString+=e._emitCodeFromInclude("lightFragment",W,{replaceStrings:[{search:/{X}/g,replace:this._lightId.toString()}]}):e.compilationString+=e._emitCodeFromInclude("lightFragment",W,{repeatKey:"maxSimultaneousLights"}),e.compilationString+=e._emitCodeFromInclude("pbrBlockFinalLitComponents",W),e.compilationString+="#endif\r\n";const ie=this.ambientColor.isConnected?this.ambientColor.associatedVariableName:"vec3(0., 0., 0.)";let ne=nc.m.DEFAULT_AO_ON_ANALYTICAL_LIGHTS.toString();-1===ne.indexOf(".")&&(ne+="."),e.compilationString+=e._emitCodeFromInclude("pbrBlockFinalUnlitComponents",W,{replaceStrings:[{search:/vec3 finalEmissive[\s\S]*?finalEmissive\*=vLightingIntensity\.y;/g,replace:""},{search:/vAmbientColor/g,replace:ie+" * ambientFromScene"},{search:/vAmbientInfos\.w/g,replace:ne}]}),e.compilationString+=e._emitCodeFromInclude("pbrBlockFinalColorComposition",W,{replaceStrings:[{search:/finalEmissive/g,replace:"vec3(0.)"}]}),e.compilationString+=e._emitCodeFromInclude("pbrBlockImageProcessing",W,{replaceStrings:[{search:/visibility/g,replace:"1."}]}),e.compilationString+=e._emitCodeFromInclude("pbrDebug",W,{replaceStrings:[{search:/vNormalW/g,replace:this._vNormalWName},{search:/vPositionW/g,replace:X},{search:/albedoTexture\.rgb;/g,replace:"vec3(1.);\r\ngl_FragColor.rgb = toGammaSpace(gl_FragColor.rgb);\r\n"}]});for(const t of this._outputs)if(t.hasEndpoints){const i=Hd[t.name];if(i){const[n,s]=i;s&&(e.compilationString+=`#if ${s}\r\n`),e.compilationString+=`${this._declareOutput(t,e)} = ${n};\r\n`,s&&(e.compilationString+="#else\r\n",e.compilationString+=`${this._declareOutput(t,e)} = vec3(0.);\r\n`,e.compilationString+="#endif\r\n")}else console.error(`There's no remapping for the ${t.name} end point! No code generated`)}return this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.lightFalloff = ${this.lightFalloff};\r\n`,e+=`${this._codeVariableName}.useAlphaTest = ${this.useAlphaTest};\r\n`,e+=`${this._codeVariableName}.alphaTestCutoff = ${this.alphaTestCutoff};\r\n`,e+=`${this._codeVariableName}.useAlphaBlending = ${this.useAlphaBlending};\r\n`,e+=`${this._codeVariableName}.useRadianceOverAlpha = ${this.useRadianceOverAlpha};\r\n`,e+=`${this._codeVariableName}.useSpecularOverAlpha = ${this.useSpecularOverAlpha};\r\n`,e+=`${this._codeVariableName}.enableSpecularAntiAliasing = ${this.enableSpecularAntiAliasing};\r\n`,e+=`${this._codeVariableName}.realTimeFiltering = ${this.realTimeFiltering};\r\n`,e+=`${this._codeVariableName}.realTimeFilteringQuality = ${this.realTimeFilteringQuality};\r\n`,e+=`${this._codeVariableName}.useEnergyConservation = ${this.useEnergyConservation};\r\n`,e+=`${this._codeVariableName}.useRadianceOcclusion = ${this.useRadianceOcclusion};\r\n`,e+=`${this._codeVariableName}.useHorizonOcclusion = ${this.useHorizonOcclusion};\r\n`,e+=`${this._codeVariableName}.unlit = ${this.unlit};\r\n`,e+=`${this._codeVariableName}.forceNormalForward = ${this.forceNormalForward};\r\n`,e+=`${this._codeVariableName}.debugMode = ${this.debugMode};\r\n`,e+=`${this._codeVariableName}.debugLimit = ${this.debugLimit};\r\n`,e+=`${this._codeVariableName}.debugFactor = ${this.debugFactor};\r\n`,e}serialize(){const e=super.serialize();return this.light&&(e.lightId=this.light.id),e.lightFalloff=this.lightFalloff,e.useAlphaTest=this.useAlphaTest,e.alphaTestCutoff=this.alphaTestCutoff,e.useAlphaBlending=this.useAlphaBlending,e.useRadianceOverAlpha=this.useRadianceOverAlpha,e.useSpecularOverAlpha=this.useSpecularOverAlpha,e.enableSpecularAntiAliasing=this.enableSpecularAntiAliasing,e.realTimeFiltering=this.realTimeFiltering,e.realTimeFilteringQuality=this.realTimeFilteringQuality,e.useEnergyConservation=this.useEnergyConservation,e.useRadianceOcclusion=this.useRadianceOcclusion,e.useHorizonOcclusion=this.useHorizonOcclusion,e.unlit=this.unlit,e.forceNormalForward=this.forceNormalForward,e.debugMode=this.debugMode,e.debugLimit=this.debugLimit,e.debugFactor=this.debugFactor,e.generateOnlyFragmentCode=this.generateOnlyFragmentCode,e}_deserialize(e,t,i){var n,s;super._deserialize(e,t,i),e.lightId&&(this.light=t.getLightById(e.lightId)),this.lightFalloff=null!==(n=e.lightFalloff)&&void 0!==n?n:0,this.useAlphaTest=e.useAlphaTest,this.alphaTestCutoff=e.alphaTestCutoff,this.useAlphaBlending=e.useAlphaBlending,this.useRadianceOverAlpha=e.useRadianceOverAlpha,this.useSpecularOverAlpha=e.useSpecularOverAlpha,this.enableSpecularAntiAliasing=e.enableSpecularAntiAliasing,this.realTimeFiltering=!!e.realTimeFiltering,this.realTimeFilteringQuality=null!==(s=e.realTimeFilteringQuality)&&void 0!==s?s:8,this.useEnergyConservation=e.useEnergyConservation,this.useRadianceOcclusion=e.useRadianceOcclusion,this.useHorizonOcclusion=e.useHorizonOcclusion,this.unlit=e.unlit,this.forceNormalForward=!!e.forceNormalForward,this.debugMode=e.debugMode,this.debugLimit=e.debugLimit,this.debugFactor=e.debugFactor,this.generateOnlyFragmentCode=!!e.generateOnlyFragmentCode,this._setTarget()}}(0,be.gn)([(0,xu.p)("Direct lights",xu.U.Float,"INTENSITY",{min:0,max:1,notifiers:{update:!0}})],Xd.prototype,"directIntensity",void 0),(0,be.gn)([(0,xu.p)("Environment lights",xu.U.Float,"INTENSITY",{min:0,max:1,notifiers:{update:!0}})],Xd.prototype,"environmentIntensity",void 0),(0,be.gn)([(0,xu.p)("Specular highlights",xu.U.Float,"INTENSITY",{min:0,max:1,notifiers:{update:!0}})],Xd.prototype,"specularIntensity",void 0),(0,be.gn)([(0,xu.p)("Light falloff",xu.U.List,"LIGHTING & COLORS",{notifiers:{update:!0},options:[{label:"Physical",value:nc.m.LIGHTFALLOFF_PHYSICAL},{label:"GLTF",value:nc.m.LIGHTFALLOFF_GLTF},{label:"Standard",value:nc.m.LIGHTFALLOFF_STANDARD}]})],Xd.prototype,"lightFalloff",void 0),(0,be.gn)([(0,xu.p)("Alpha Testing",xu.U.Boolean,"OPACITY")],Xd.prototype,"useAlphaTest",void 0),(0,be.gn)([(0,xu.p)("Alpha CutOff",xu.U.Float,"OPACITY",{min:0,max:1,notifiers:{update:!0}})],Xd.prototype,"alphaTestCutoff",void 0),(0,be.gn)([(0,xu.p)("Alpha blending",xu.U.Boolean,"OPACITY")],Xd.prototype,"useAlphaBlending",void 0),(0,be.gn)([(0,xu.p)("Radiance over alpha",xu.U.Boolean,"RENDERING",{notifiers:{update:!0}})],Xd.prototype,"useRadianceOverAlpha",void 0),(0,be.gn)([(0,xu.p)("Specular over alpha",xu.U.Boolean,"RENDERING",{notifiers:{update:!0}})],Xd.prototype,"useSpecularOverAlpha",void 0),(0,be.gn)([(0,xu.p)("Specular anti-aliasing",xu.U.Boolean,"RENDERING",{notifiers:{update:!0}})],Xd.prototype,"enableSpecularAntiAliasing",void 0),(0,be.gn)([(0,xu.p)("Realtime filtering",xu.U.Boolean,"RENDERING",{notifiers:{update:!0}})],Xd.prototype,"realTimeFiltering",void 0),(0,be.gn)([(0,xu.p)("Realtime filtering quality",xu.U.List,"RENDERING",{notifiers:{update:!0},options:[{label:"Low",value:8},{label:"Medium",value:16},{label:"High",value:64}]})],Xd.prototype,"realTimeFilteringQuality",void 0),(0,be.gn)([(0,xu.p)("Energy Conservation",xu.U.Boolean,"ADVANCED",{notifiers:{update:!0}})],Xd.prototype,"useEnergyConservation",void 0),(0,be.gn)([(0,xu.p)("Radiance occlusion",xu.U.Boolean,"ADVANCED",{notifiers:{update:!0}})],Xd.prototype,"useRadianceOcclusion",void 0),(0,be.gn)([(0,xu.p)("Horizon occlusion",xu.U.Boolean,"ADVANCED",{notifiers:{update:!0}})],Xd.prototype,"useHorizonOcclusion",void 0),(0,be.gn)([(0,xu.p)("Unlit",xu.U.Boolean,"ADVANCED",{notifiers:{update:!0}})],Xd.prototype,"unlit",void 0),(0,be.gn)([(0,xu.p)("Force normal forward",xu.U.Boolean,"ADVANCED",{notifiers:{update:!0}})],Xd.prototype,"forceNormalForward",void 0),(0,be.gn)([(0,xu.p)("Generate only fragment code",xu.U.Boolean,"ADVANCED",{notifiers:{rebuild:!0,update:!0,onValidation:Xd._OnGenerateOnlyFragmentCodeChanged}})],Xd.prototype,"generateOnlyFragmentCode",void 0),(0,be.gn)([(0,xu.p)("Debug mode",xu.U.List,"DEBUG",{notifiers:{update:!0},options:[{label:"None",value:0},{label:"Normalized position",value:1},{label:"Normals",value:2},{label:"Tangents",value:3},{label:"Bitangents",value:4},{label:"Bump Normals",value:5},{label:"ClearCoat Normals",value:8},{label:"ClearCoat Tangents",value:9},{label:"ClearCoat Bitangents",value:10},{label:"Anisotropic Normals",value:11},{label:"Anisotropic Tangents",value:12},{label:"Anisotropic Bitangents",value:13},{label:"Env Refraction",value:40},{label:"Env Reflection",value:41},{label:"Env Clear Coat",value:42},{label:"Direct Diffuse",value:50},{label:"Direct Specular",value:51},{label:"Direct Clear Coat",value:52},{label:"Direct Sheen",value:53},{label:"Env Irradiance",value:54},{label:"Surface Albedo",value:60},{label:"Reflectance 0",value:61},{label:"Metallic",value:62},{label:"Metallic F0",value:71},{label:"Roughness",value:63},{label:"AlphaG",value:64},{label:"NdotV",value:65},{label:"ClearCoat Color",value:66},{label:"ClearCoat Roughness",value:67},{label:"ClearCoat NdotV",value:68},{label:"Transmittance",value:69},{label:"Refraction Transmittance",value:70},{label:"SEO",value:80},{label:"EHO",value:81},{label:"Energy Factor",value:82},{label:"Specular Reflectance",value:83},{label:"Clear Coat Reflectance",value:84},{label:"Sheen Reflectance",value:85},{label:"Luminance Over Alpha",value:86},{label:"Alpha",value:87}]})],Xd.prototype,"debugMode",void 0),(0,be.gn)([(0,xu.p)("Split position",xu.U.Float,"DEBUG",{min:-1,max:1,notifiers:{update:!0}})],Xd.prototype,"debugLimit",void 0),(0,be.gn)([(0,xu.p)("Output factor",xu.U.Float,"DEBUG",{min:0,max:5,notifiers:{update:!0}})],Xd.prototype,"debugFactor",void 0),(0,l.H)("BABYLON.PBRMetallicRoughnessBlock",Xd);var jd,Yd,qd=i(7010),Kd=i(8560),$d=i(1320);class Qd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("left",ou.E.AutoDetect),this.registerInput("right",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1)}getClassName(){return"ModBlock"}get left(){return this._inputs[0]}get right(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0];return e.compilationString+=this._declareOutput(t,e)+` = mod(${this.left.associatedVariableName}, ${this.right.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.ModBlock",Qd);class Zd extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("row0",ou.E.Vector4),this.registerInput("row1",ou.E.Vector4),this.registerInput("row2",ou.E.Vector4),this.registerInput("row3",ou.E.Vector4),this.registerOutput("output",ou.E.Matrix)}getClassName(){return"MatrixBuilder"}get row0(){return this._inputs[0]}get row1(){return this._inputs[1]}get row2(){return this._inputs[2]}get row3(){return this._inputs[3]}get output(){return this._outputs[0]}autoConfigure(){if(!this.row0.isConnected){const e=new fu.S("row0");e.value=new o.Lt(1,0,0,0),e.output.connectTo(this.row0)}if(!this.row1.isConnected){const e=new fu.S("row1");e.value=new o.Lt(0,1,0,0),e.output.connectTo(this.row1)}if(!this.row2.isConnected){const e=new fu.S("row2");e.value=new o.Lt(0,0,1,0),e.output.connectTo(this.row2)}if(!this.row3.isConnected){const e=new fu.S("row3");e.value=new o.Lt(0,0,0,1),e.output.connectTo(this.row3)}}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0],i=this.row0,n=this.row1,s=this.row2,r=this.row3;return e.compilationString+=this._declareOutput(t,e)+` = mat4(${i.associatedVariableName}, ${n.associatedVariableName}, ${s.associatedVariableName}, ${r.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.MatrixBuilder",Zd),function(e){e[e.Equal=0]="Equal",e[e.NotEqual=1]="NotEqual",e[e.LessThan=2]="LessThan",e[e.GreaterThan=3]="GreaterThan",e[e.LessOrEqual=4]="LessOrEqual",e[e.GreaterOrEqual=5]="GreaterOrEqual",e[e.Xor=6]="Xor",e[e.Or=7]="Or",e[e.And=8]="And"}(jd||(jd={}));class Jd extends du.k{constructor(e){super(e,ru.u.Neutral),this.condition=jd.LessThan,this.registerInput("a",ou.E.Float),this.registerInput("b",ou.E.Float),this.registerInput("true",ou.E.AutoDetect,!0),this.registerInput("false",ou.E.AutoDetect,!0),this.registerOutput("output",ou.E.BasedOnInput),this._linkConnectionTypes(2,3),this._outputs[0]._typeConnectionSource=this._inputs[2],this._outputs[0]._defaultConnectionPointType=ou.E.Float}getClassName(){return"ConditionalBlock"}get a(){return this._inputs[0]}get b(){return this._inputs[1]}get true(){return this._inputs[2]}get false(){return this._inputs[3]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0],i=this.true.isConnected?this.true.associatedVariableName:"1.0",n=this.false.isConnected?this.false.associatedVariableName:"0.0";switch(this.condition){case jd.Equal:e.compilationString+=this._declareOutput(t,e)+` = ${this.a.associatedVariableName} == ${this.b.associatedVariableName} ? ${i} : ${n};\r\n`;break;case jd.NotEqual:e.compilationString+=this._declareOutput(t,e)+` = ${this.a.associatedVariableName} != ${this.b.associatedVariableName} ? ${i} : ${n};\r\n`;break;case jd.LessThan:e.compilationString+=this._declareOutput(t,e)+` = ${this.a.associatedVariableName} < ${this.b.associatedVariableName} ? ${i} : ${n};\r\n`;break;case jd.LessOrEqual:e.compilationString+=this._declareOutput(t,e)+` = ${this.a.associatedVariableName} <= ${this.b.associatedVariableName} ? ${i} : ${n};\r\n`;break;case jd.GreaterThan:e.compilationString+=this._declareOutput(t,e)+` = ${this.a.associatedVariableName} > ${this.b.associatedVariableName} ? ${i} : ${n};\r\n`;break;case jd.GreaterOrEqual:e.compilationString+=this._declareOutput(t,e)+` = ${this.a.associatedVariableName} >= ${this.b.associatedVariableName} ? ${i} : ${n};\r\n`;break;case jd.Xor:e.compilationString+=this._declareOutput(t,e)+` = (mod(${this.a.associatedVariableName} + ${this.b.associatedVariableName}, 2.0) > 0.0) ? ${i} : ${n};\r\n`;break;case jd.Or:e.compilationString+=this._declareOutput(t,e)+` = (min(${this.a.associatedVariableName} + ${this.b.associatedVariableName}, 1.0) > 0.0) ? ${i} : ${n};\r\n`;break;case jd.And:e.compilationString+=this._declareOutput(t,e)+` = (${this.a.associatedVariableName} * ${this.b.associatedVariableName} > 0.0)  ? ${i} : ${n};\r\n`}return this}serialize(){const e=super.serialize();return e.condition=this.condition,e}_deserialize(e,t,i){super._deserialize(e,t,i),this.condition=e.condition}_dumpPropertiesCode(){return super._dumpPropertiesCode()+`${this._codeVariableName}.condition = BABYLON.ConditionalBlockConditions.${jd[this.condition]};\r\n`}}(0,l.H)("BABYLON.ConditionalBlock",Jd);class ep extends du.k{constructor(e){super(e,ru.u.Neutral),this.octaves=6,this.registerInput("seed",ou.E.AutoDetect),this.registerInput("chaos",ou.E.AutoDetect,!0),this.registerInput("offsetX",ou.E.Float,!0),this.registerInput("offsetY",ou.E.Float,!0),this.registerInput("offsetZ",ou.E.Float,!0),this.registerOutput("output",ou.E.Float),this._inputs[0].acceptedConnectionPointTypes.push(ou.E.Vector2),this._inputs[0].acceptedConnectionPointTypes.push(ou.E.Vector3),this._linkConnectionTypes(0,1)}getClassName(){return"CloudBlock"}get seed(){return this._inputs[0]}get chaos(){return this._inputs[1]}get offsetX(){return this._inputs[2]}get offsetY(){return this._inputs[3]}get offsetZ(){return this._inputs[4]}get output(){return this._outputs[0]}_buildBlock(e){var t,i;if(super._buildBlock(e),!this.seed.isConnected)return;if(!this._outputs[0].hasEndpoints)return;const n=`fbm${this.octaves}`;e._emitFunction("CloudBlockCode","\n\n        float cloudRandom(in float p) { p = fract(p * 0.011); p *= p + 7.5; p *= p + p; return fract(p); }\n\n        // Based on Morgan McGuire @morgan3d\n        // https://www.shadertoy.com/view/4dS3Wd\n        float cloudNoise(in vec2 x, in vec2 chaos) {\n            vec2 step = chaos * vec2(75., 120.) + vec2(75., 120.);\n\n            vec2 i = floor(x);\n            vec2 f = fract(x);\n\n            float n = dot(i, step);\n\n            vec2 u = f * f * (3.0 - 2.0 * f);\n            return mix(\n                    mix(cloudRandom(n + dot(step, vec2(0, 0))), cloudRandom(n + dot(step, vec2(1, 0))), u.x),\n                    mix(cloudRandom(n + dot(step, vec2(0, 1))), cloudRandom(n + dot(step, vec2(1, 1))), u.x),\n                    u.y\n                );\n        }\n\n        float cloudNoise(in vec3 x, in vec3 chaos) {\n            vec3 step = chaos * vec3(60., 120., 75.) + vec3(60., 120., 75.);\n\n            vec3 i = floor(x);\n            vec3 f = fract(x);\n\n            float n = dot(i, step);\n\n            vec3 u = f * f * (3.0 - 2.0 * f);\n            return mix(mix(mix( cloudRandom(n + dot(step, vec3(0, 0, 0))), cloudRandom(n + dot(step, vec3(1, 0, 0))), u.x),\n                           mix( cloudRandom(n + dot(step, vec3(0, 1, 0))), cloudRandom(n + dot(step, vec3(1, 1, 0))), u.x), u.y),\n                       mix(mix( cloudRandom(n + dot(step, vec3(0, 0, 1))), cloudRandom(n + dot(step, vec3(1, 0, 1))), u.x),\n                           mix( cloudRandom(n + dot(step, vec3(0, 1, 1))), cloudRandom(n + dot(step, vec3(1, 1, 1))), u.x), u.y), u.z);\n        }","// CloudBlockCode"),e._emitFunction("CloudBlockCodeFBM"+this.octaves,"\n        float fbm(in vec2 st, in vec2 chaos) {\n            // Initial values\n            float value = 0.0;\n            float amplitude = .5;\n            float frequency = 0.;\n\n            // Loop of octaves\n            for (int i = 0; i < OCTAVES; i++) {\n                value += amplitude * cloudNoise(st, chaos);\n                st *= 2.0;\n                amplitude *= 0.5;\n            }\n            return value;\n        }\n\n        float fbm(in vec3 x, in vec3 chaos) {\n            // Initial values\n            float value = 0.0;\n            float amplitude = 0.5;\n            for (int i = 0; i < OCTAVES; ++i) {\n                value += amplitude * cloudNoise(x, chaos);\n                x = x * 2.0;\n                amplitude *= 0.5;\n            }\n            return value;\n        }".replace(/fbm/gi,n).replace(/OCTAVES/gi,(0|this.octaves).toString()),"// CloudBlockCode FBM");const s=e._getFreeVariableName("st"),r=(null===(t=this.seed.connectedPoint)||void 0===t?void 0:t.type)===ou.E.Vector2?"vec2":"vec3";e.compilationString+=`${r} ${s} = ${this.seed.associatedVariableName};\r\n`,this.offsetX.isConnected&&(e.compilationString+=`${s}.x += 0.1 * ${this.offsetX.associatedVariableName};\r\n`),this.offsetY.isConnected&&(e.compilationString+=`${s}.y += 0.1 * ${this.offsetY.associatedVariableName};\r\n`),this.offsetZ.isConnected&&"vec3"===r&&(e.compilationString+=`${s}.z += 0.1 * ${this.offsetZ.associatedVariableName};\r\n`);let o="";return o=this.chaos.isConnected?this.chaos.associatedVariableName:(null===(i=this.seed.connectedPoint)||void 0===i?void 0:i.type)===ou.E.Vector2?"vec2(0., 0.)":"vec3(0., 0., 0.)",e.compilationString+=this._declareOutput(this._outputs[0],e)+` = ${n}(${s}, ${o});\r\n`,this}_dumpPropertiesCode(){return super._dumpPropertiesCode()+`${this._codeVariableName}.octaves = ${this.octaves};\r\n`}serialize(){const e=super.serialize();return e.octaves=this.octaves,e}_deserialize(e,t,i){super._deserialize(e,t,i),this.octaves=e.octaves}}(0,be.gn)([(0,xu.p)("Octaves",xu.U.Int)],ep.prototype,"octaves",void 0),(0,l.H)("BABYLON.CloudBlock",ep);class tp extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("seed",ou.E.Vector2),this.registerInput("offset",ou.E.Float),this.registerInput("density",ou.E.Float),this.registerOutput("output",ou.E.Float),this.registerOutput("cells",ou.E.Float)}getClassName(){return"VoronoiNoiseBlock"}get seed(){return this._inputs[0]}get offset(){return this._inputs[1]}get density(){return this._inputs[2]}get output(){return this._outputs[0]}get cells(){return this._outputs[1]}_buildBlock(e){if(super._buildBlock(e),!this.seed.isConnected)return;let t="vec2 voronoiRandom(vec2 seed, float offset){\n            mat2 m = mat2(15.27, 47.63, 99.41, 89.98);\n            vec2 uv = fract(sin(m * seed) * 46839.32);\n            return vec2(sin(uv.y * offset) * 0.5 + 0.5, cos(uv.x * offset) * 0.5 + 0.5);\n        }\n        ";e._emitFunction("voronoiRandom",t,"// Voronoi random generator"),t="void voronoi(vec2 seed, float offset, float density, out float outValue, out float cells){\n            vec2 g = floor(seed * density);\n            vec2 f = fract(seed * density);\n            float t = 8.0;\n            vec3 res = vec3(8.0, 0.0, 0.0);\n\n            for(int y=-1; y<=1; y++)\n            {\n                for(int x=-1; x<=1; x++)\n                {\n                    vec2 lattice = vec2(x,y);\n                    vec2 randomOffset = voronoiRandom(lattice + g, offset);\n                    float d = distance(lattice + randomOffset, f);\n                    if(d < res.x)\n                    {\n                        res = vec3(d, randomOffset.x, randomOffset.y);\n                        outValue = res.x;\n                        cells = res.y;\n                    }\n                }\n            }\n        }\n        ",e._emitFunction("voronoi",t,"// Voronoi");const i=e._getFreeVariableName("tempOutput"),n=e._getFreeVariableName("tempCells");return e.compilationString+=`float ${i} = 0.0;\r\n`,e.compilationString+=`float ${n} = 0.0;\r\n`,e.compilationString+=`voronoi(${this.seed.associatedVariableName}, ${this.offset.associatedVariableName}, ${this.density.associatedVariableName}, ${i}, ${n});\r\n`,this.output.hasEndpoints&&(e.compilationString+=this._declareOutput(this.output,e)+` = ${i};\r\n`),this.cells.hasEndpoints&&(e.compilationString+=this._declareOutput(this.cells,e)+` = ${n};\r\n`),this}}(0,l.H)("BABYLON.VoronoiNoiseBlock",tp);class ip extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("input",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0]}getClassName(){return"ElbowBlock"}get input(){return this._inputs[0]}get output(){return this._outputs[0]}get target(){const e=this._inputs[0];if(e.isConnected){const t=e.connectedPoint.ownerBlock;if(t.target!==ru.u.VertexAndFragment)return t.target;if(e.connectedPoint.target!==ru.u.VertexAndFragment)return e.connectedPoint.target}return this._target}set target(e){0==(this._target&e)&&(this._target=e)}_buildBlock(e){super._buildBlock(e);const t=this._outputs[0],i=this._inputs[0];return e.compilationString+=this._declareOutput(t,e)+` = ${i.associatedVariableName};\r\n`,this}}(0,l.H)("BABYLON.ElbowBlock",ip);class np extends du.k{get texture(){var e;return this.source.isConnected?(null===(e=this.source.connectedPoint)||void 0===e?void 0:e.ownerBlock).texture:this._texture}set texture(e){var t;if(this._texture===e)return;const i=null!==(t=null==e?void 0:e.getScene())&&void 0!==t?t:A.l.LastCreatedScene;!e&&i&&i.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this._texture))),this._texture=e,e&&i&&i.markAllMaterialsAsDirty(1,(t=>t.hasTexture(e)))}get textureY(){var e;return this.sourceY.isConnected?(null===(e=this.sourceY.connectedPoint)||void 0===e?void 0:e.ownerBlock).texture:null}get textureZ(){var e,t;return(null===(e=this.sourceZ)||void 0===e?void 0:e.isConnected)?(null===(t=this.sourceY.connectedPoint)||void 0===t?void 0:t.ownerBlock).texture:null}_getImageSourceBlock(e){return(null==e?void 0:e.isConnected)?e.connectedPoint.ownerBlock:null}get samplerName(){const e=this._getImageSourceBlock(this.source);return e?e.samplerName:this._samplerName}get samplerYName(){var e,t;return null!==(t=null===(e=this._getImageSourceBlock(this.sourceY))||void 0===e?void 0:e.samplerName)&&void 0!==t?t:null}get samplerZName(){var e,t;return null!==(t=null===(e=this._getImageSourceBlock(this.sourceZ))||void 0===e?void 0:e.samplerName)&&void 0!==t?t:null}get hasImageSource(){return this.source.isConnected}set convertToGammaSpace(e){var t;if(e!==this._convertToGammaSpace&&(this._convertToGammaSpace=e,this.texture)){const e=null!==(t=this.texture.getScene())&&void 0!==t?t:A.l.LastCreatedScene;null==e||e.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this.texture)))}}get convertToGammaSpace(){return this._convertToGammaSpace}set convertToLinearSpace(e){var t;if(e!==this._convertToLinearSpace&&(this._convertToLinearSpace=e,this.texture)){const e=null!==(t=this.texture.getScene())&&void 0!==t?t:A.l.LastCreatedScene;null==e||e.markAllMaterialsAsDirty(1,(e=>e.hasTexture(this.texture)))}}get convertToLinearSpace(){return this._convertToLinearSpace}constructor(e,t=!1){super(e,ru.u.Neutral),this.projectAsCube=!1,this._convertToGammaSpace=!1,this._convertToLinearSpace=!1,this.disableLevelMultiplication=!1,this.registerInput("position",ou.E.AutoDetect,!1),this.registerInput("normal",ou.E.AutoDetect,!1),this.registerInput("sharpness",ou.E.Float,!0),this.registerInput("source",ou.E.Object,!0,ru.u.VertexAndFragment,new uu("source",this,cu.Ab.Input,Lu,"ImageSourceBlock")),this.registerInput("sourceY",ou.E.Object,!0,ru.u.VertexAndFragment,new uu("sourceY",this,cu.Ab.Input,Lu,"ImageSourceBlock")),t||this.registerInput("sourceZ",ou.E.Object,!0,ru.u.VertexAndFragment,new uu("sourceZ",this,cu.Ab.Input,Lu,"ImageSourceBlock")),this.registerOutput("rgba",ou.E.Color4,ru.u.Neutral),this.registerOutput("rgb",ou.E.Color3,ru.u.Neutral),this.registerOutput("r",ou.E.Float,ru.u.Neutral),this.registerOutput("g",ou.E.Float,ru.u.Neutral),this.registerOutput("b",ou.E.Float,ru.u.Neutral),this.registerOutput("a",ou.E.Float,ru.u.Neutral),this.registerOutput("level",ou.E.Float,ru.u.Neutral),this._inputs[0].addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Vector3|ou.E.Vector4),this._inputs[1].addExcludedConnectionPointFromAllowedTypes(ou.E.Color3|ou.E.Vector3|ou.E.Vector4)}getClassName(){return"TriPlanarBlock"}get position(){return this._inputs[0]}get normal(){return this._inputs[1]}get sharpness(){return this._inputs[2]}get source(){return this._inputs[3]}get sourceY(){return this._inputs[4]}get sourceZ(){return this._inputs[5]}get rgba(){return this._outputs[0]}get rgb(){return this._outputs[1]}get r(){return this._outputs[2]}get g(){return this._outputs[3]}get b(){return this._outputs[4]}get a(){return this._outputs[5]}get level(){return this._outputs[6]}prepareDefines(e,t,i){if(!i._areTexturesDirty)return;const n=this.convertToGammaSpace&&this.texture&&!this.texture.gammaSpace,s=this.convertToLinearSpace&&this.texture&&this.texture.gammaSpace;i.setValue(this._linearDefineName,n,!0),i.setValue(this._gammaDefineName,s,!0)}isReady(){return!(this.texture&&!this.texture.isReadyOrNotBlocking())}bind(e){this.texture&&(e.setFloat(this._textureInfoName,this.texture.level),this._imageSource||e.setTexture(this._samplerName,this.texture))}_generateTextureLookup(e){var t,i;const n=this.samplerName,s=null!==(t=this.samplerYName)&&void 0!==t?t:n,r=null!==(i=this.samplerZName)&&void 0!==i?i:n,o=this.sharpness.isConnected?this.sharpness.associatedVariableName:"1.0",a=e._getFreeVariableName("x"),l=e._getFreeVariableName("y"),h=e._getFreeVariableName("z"),c=e._getFreeVariableName("w"),u=e._getFreeVariableName("n"),d=e._getFreeVariableName("uvx"),p=e._getFreeVariableName("uvy"),f=e._getFreeVariableName("uvz");e.compilationString+=`\n            vec3 ${u} = ${this.normal.associatedVariableName}.xyz;\n\n            vec2 ${d} = ${this.position.associatedVariableName}.yz;\n            vec2 ${p} = ${this.position.associatedVariableName}.zx;\n            vec2 ${f} = ${this.position.associatedVariableName}.xy;\n        `,this.projectAsCube&&(e.compilationString+=`\n                ${d}.xy = ${d}.yx;\n\n                if (${u}.x >= 0.0) {\n                    ${d}.x = -${d}.x;\n                }\n                if (${u}.y < 0.0) {\n                    ${p}.y = -${p}.y;\n                }\n                if (${u}.z < 0.0) {\n                    ${f}.x = -${f}.x;\n                }\n            `),e.compilationString+=`\n            vec4 ${a} = texture2D(${n}, ${d});\n            vec4 ${l} = texture2D(${s}, ${p});\n            vec4 ${h} = texture2D(${r}, ${f});\n           \n            // blend weights\n            vec3 ${c} = pow(abs(${u}), vec3(${o}));\n\n            // blend and return\n            vec4 ${this._tempTextureRead} = (${a}*${c}.x + ${l}*${c}.y + ${h}*${c}.z) / (${c}.x + ${c}.y + ${c}.z);        \n        `}_generateConversionCode(e,t,i){"a"!==i&&(this.texture&&this.texture.gammaSpace||(e.compilationString+=`#ifdef ${this._linearDefineName}\n                    ${t.associatedVariableName} = toGammaSpace(${t.associatedVariableName});\n                    #endif\n                `),e.compilationString+=`#ifdef ${this._gammaDefineName}\n                ${t.associatedVariableName} = toLinearSpace(${t.associatedVariableName});\n                #endif\n            `)}_writeOutput(e,t,i){let n="";this.disableLevelMultiplication||(n=` * ${this._textureInfoName}`),e.compilationString+=`${this._declareOutput(t,e)} = ${this._tempTextureRead}.${i}${n};\r\n`,this._generateConversionCode(e,t,i)}_buildBlock(e){super._buildBlock(e),this.source.isConnected?this._imageSource=this.source.connectedPoint.ownerBlock:this._imageSource=null,this._textureInfoName=e._getFreeVariableName("textureInfoName"),this.level.associatedVariableName=this._textureInfoName,this._tempTextureRead=e._getFreeVariableName("tempTextureRead"),this._linearDefineName=e._getFreeDefineName("ISLINEAR"),this._gammaDefineName=e._getFreeDefineName("ISGAMMA"),this._imageSource||(this._samplerName=e._getFreeVariableName(this.name+"Sampler"),e._emit2DSampler(this._samplerName)),e.sharedData.blockingBlocks.push(this),e.sharedData.textureBlocks.push(this),e.sharedData.blocksWithDefines.push(this),e.sharedData.bindableBlocks.push(this);const t=`//${this.name}`;e._emitFunctionFromInclude("helperFunctions",t),e._emitUniformFromString(this._textureInfoName,"float"),this._generateTextureLookup(e);for(const t of this._outputs)t.hasEndpoints&&"level"!==t.name&&this._writeOutput(e,t,t.name);return this}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.convertToGammaSpace = ${this.convertToGammaSpace};\r\n`,e+=`${this._codeVariableName}.convertToLinearSpace = ${this.convertToLinearSpace};\r\n`,e+=`${this._codeVariableName}.disableLevelMultiplication = ${this.disableLevelMultiplication};\r\n`,e+=`${this._codeVariableName}.projectAsCube = ${this.projectAsCube};\r\n`,this.texture?(e+=`${this._codeVariableName}.texture = new BABYLON.Texture("${this.texture.name}", null, ${this.texture.noMipmap}, ${this.texture.invertY}, ${this.texture.samplingMode});\r\n`,e+=`${this._codeVariableName}.texture.wrapU = ${this.texture.wrapU};\r\n`,e+=`${this._codeVariableName}.texture.wrapV = ${this.texture.wrapV};\r\n`,e+=`${this._codeVariableName}.texture.uAng = ${this.texture.uAng};\r\n`,e+=`${this._codeVariableName}.texture.vAng = ${this.texture.vAng};\r\n`,e+=`${this._codeVariableName}.texture.wAng = ${this.texture.wAng};\r\n`,e+=`${this._codeVariableName}.texture.uOffset = ${this.texture.uOffset};\r\n`,e+=`${this._codeVariableName}.texture.vOffset = ${this.texture.vOffset};\r\n`,e+=`${this._codeVariableName}.texture.uScale = ${this.texture.uScale};\r\n`,e+=`${this._codeVariableName}.texture.vScale = ${this.texture.vScale};\r\n`,e+=`${this._codeVariableName}.texture.coordinatesMode = ${this.texture.coordinatesMode};\r\n`,e):e}serialize(){const e=super.serialize();return e.convertToGammaSpace=this.convertToGammaSpace,e.convertToLinearSpace=this.convertToLinearSpace,e.disableLevelMultiplication=this.disableLevelMultiplication,e.projectAsCube=this.projectAsCube,this.hasImageSource||!this.texture||this.texture.isRenderTarget||"VideoTexture"===this.texture.getClassName()||(e.texture=this.texture.serialize()),e}_deserialize(e,t,i){super._deserialize(e,t,i),this.convertToGammaSpace=e.convertToGammaSpace,this.convertToLinearSpace=!!e.convertToLinearSpace,this.disableLevelMultiplication=!!e.disableLevelMultiplication,this.projectAsCube=!!e.projectAsCube,e.texture&&!Fl.O.IgnoreTexturesAtLoadTime&&void 0!==e.texture.url&&(i=0===e.texture.url.indexOf("data:")?"":i,this.texture=Ce.x.Parse(e.texture,t,i))}}(0,be.gn)([(0,xu.p)("Project as cube",xu.U.Boolean,"ADVANCED",{notifiers:{update:!0}})],np.prototype,"projectAsCube",void 0),(0,l.H)("BABYLON.TriPlanarBlock",np);class sp extends np{constructor(e){super(e,!0)}getClassName(){return"BiPlanarBlock"}_generateTextureLookup(e){var t;const i=this.samplerName,n=null!==(t=this.samplerYName)&&void 0!==t?t:this.samplerName,s=this.sharpness.isConnected?this.sharpness.associatedVariableName:"1.0",r=e._getFreeVariableName("dpdx"),o=e._getFreeVariableName("dpdy"),a=e._getFreeVariableName("n"),l=e._getFreeVariableName("ma"),h=e._getFreeVariableName("mi"),c=e._getFreeVariableName("me"),u=e._getFreeVariableName("x"),d=e._getFreeVariableName("y"),p=e._getFreeVariableName("y");e.compilationString+=`\n            // grab coord derivatives for texturing\n            vec3 ${r} = dFdx(${this.position.associatedVariableName}.xyz);\n            vec3 ${o} = dFdy(${this.position.associatedVariableName}.xyz);\n            vec3 ${a} = abs(${this.normal.associatedVariableName}.xyz);\n        \n            // determine major axis (in x; yz are following axis)\n            ivec3 ${l} = (${a}.x>${a}.y && ${a}.x>${a}.z) ? ivec3(0,1,2) :\n                    (${a}.y>${a}.z)            ? ivec3(1,2,0) :\n                                            ivec3(2,0,1) ;\n            // determine minor axis (in x; yz are following axis)\n            ivec3 ${h} = (${a}.x<${a}.y && ${a}.x<${a}.z) ? ivec3(0,1,2) :\n                    (${a}.y<${a}.z)            ? ivec3(1,2,0) :\n                                            ivec3(2,0,1) ;\n            // determine median axis (in x;  yz are following axis)\n            ivec3 ${c} = ivec3(3) - ${h} - ${l};\n            \n            // project+fetch\n            vec4 ${u} = textureGrad( ${i}, vec2(   ${this.position.associatedVariableName}[${l}.y],   ${this.position.associatedVariableName}[${l}.z]), \n                                    vec2(${r}[${l}.y],${r}[${l}.z]), \n                                    vec2(${o}[${l}.y],${o}[${l}.z]) );\n            vec4 ${d} = textureGrad( ${n}, vec2(   ${this.position.associatedVariableName}[${c}.y],   ${this.position.associatedVariableName}[${c}.z]), \n                                    vec2(${r}[${c}.y],${r}[${c}.z]),\n                                    vec2(${o}[${c}.y],${o}[${c}.z]) );\n            \n            // blend factors\n            vec2 ${p} = vec2(${a}[${l}.x],${a}[${c}.x]);\n            // make local support\n            ${p} = clamp( (${p}-0.5773)/(1.0-0.5773), 0.0, 1.0 );\n            // shape transition\n            ${p} = pow( ${p}, vec2(${s}/8.0) );\n            // blend and return\n            vec4 ${this._tempTextureRead} = (${u}*${p}.x + ${d}*${p}.y) / (${p}.x + ${p}.y);\n        `}}(0,l.H)("BABYLON.BiPlanarBlock",sp);class rp extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("input",ou.E.Matrix),this.registerOutput("output",ou.E.Float)}getClassName(){return"MatrixDeterminantBlock"}get input(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this.output,i=this.input;return e.compilationString+=this._declareOutput(t,e)+`${t.associatedVariableName} = determinant(${i.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.MatrixDeterminantBlock",rp);class op extends du.k{constructor(e){super(e,ru.u.Neutral),this.registerInput("input",ou.E.Matrix),this.registerOutput("output",ou.E.Matrix)}getClassName(){return"MatrixTransposeBlock"}get input(){return this._inputs[0]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);const t=this.output,i=this.input;return e.compilationString+=this._declareOutput(t,e)+`${t.associatedVariableName} = transpose(${i.associatedVariableName});\r\n`,this}}(0,l.H)("BABYLON.MatrixTransposeBlock",op),function(e){e[e.None=0]="None",e[e.Normal=1]="Normal",e[e.Tangent=2]="Tangent",e[e.VertexColor=3]="VertexColor",e[e.UV1=4]="UV1",e[e.UV2=5]="UV2",e[e.UV3=6]="UV3",e[e.UV4=7]="UV4",e[e.UV5=8]="UV5",e[e.UV6=9]="UV6"}(Yd||(Yd={}));class ap extends du.k{constructor(e){super(e,ru.u.Neutral),this.attributeType=Yd.None,this.registerInput("input",ou.E.AutoDetect),this.registerInput("fallback",ou.E.AutoDetect),this.registerOutput("output",ou.E.BasedOnInput),this._outputs[0]._typeConnectionSource=this._inputs[0],this._linkConnectionTypes(0,1),this._inputs[0].onConnectionObservable.add((e=>{var t;if(this.attributeType)return;const i=e.ownerBlock;if(i instanceof fu.S&&i.isAttribute)switch(i.name){case"color":this.attributeType=Yd.VertexColor;break;case"normal":this.attributeType=Yd.Normal;break;case"tangent":this.attributeType=Yd.Tangent;break;case"uv":this.attributeType=Yd.UV1;break;case"uv2":this.attributeType=Yd.UV2;break;case"uv3":this.attributeType=Yd.UV3;break;case"uv4":this.attributeType=Yd.UV4;break;case"uv5":this.attributeType=Yd.UV5;break;case"uv6":this.attributeType=Yd.UV6}else if(i instanceof gu)switch(null===(t=this.input.connectedPoint)||void 0===t?void 0:t.name){case"normalOutput":this.attributeType=Yd.Normal;break;case"tangentOutput":this.attributeType=Yd.Tangent;break;case"uvOutput":this.attributeType=Yd.UV1}}))}getClassName(){return"MeshAttributeExistsBlock"}get input(){return this._inputs[0]}get fallback(){return this._inputs[1]}get output(){return this._outputs[0]}_buildBlock(e){super._buildBlock(e);let t=null;switch(this.attributeType){case Yd.VertexColor:t="VERTEXCOLOR_NME";break;case Yd.Normal:t="NORMAL";break;case Yd.Tangent:t="TANGENT";break;case Yd.UV1:t="UV1";break;case Yd.UV2:t="UV2";break;case Yd.UV3:t="UV3";break;case Yd.UV4:t="UV4";break;case Yd.UV5:t="UV5";break;case Yd.UV6:t="UV6"}const i=this._declareOutput(this.output,e);return t&&(e.compilationString+=`#ifdef ${t}\r\n`),e.compilationString+=`${i} = ${this.input.associatedVariableName};\r\n`,t&&(e.compilationString+="#else\r\n",e.compilationString+=`${i} = ${this.fallback.associatedVariableName};\r\n`,e.compilationString+="#endif\r\n"),this}serialize(){const e=super.serialize();return e.attributeType=this.attributeType,e}_deserialize(e,t,i){var n;super._deserialize(e,t,i),this.attributeType=null!==(n=e.attributeType)&&void 0!==n?n:Yd.None}_dumpPropertiesCode(){let e=super._dumpPropertiesCode();return e+=`${this._codeVariableName}.attributeType = ${this.attributeType};\r\n`,e}}(0,be.gn)([(0,xu.p)("Attribute lookup",xu.U.List,void 0,{notifiers:{update:!0},options:[{label:"(None)",value:Yd.None},{label:"Normal",value:Yd.Normal},{label:"Tangent",value:Yd.Tangent},{label:"Vertex Color",value:Yd.VertexColor},{label:"UV1",value:Yd.UV1},{label:"UV2",value:Yd.UV2},{label:"UV3",value:Yd.UV3},{label:"UV4",value:Yd.UV4},{label:"UV5",value:Yd.UV5},{label:"UV6",value:Yd.UV6}]})],ap.prototype,"attributeType",void 0),(0,l.H)("BABYLON.MeshAttributeExistsBlock",ap);class lp{optimize(e,t){}}var hp=i(1983);class cp{constructor(){this.mm=new Map}get(e,t){const i=this.mm.get(e);if(void 0!==i)return i.get(t)}set(e,t,i){let n=this.mm.get(e);void 0===n&&this.mm.set(e,n=new Map),n.set(t,i)}}class up{get standalone(){var e,t;return null!==(t=null===(e=this._options)||void 0===e?void 0:e.standalone)&&void 0!==t&&t}get baseMaterial(){return this._baseMaterial}get doNotInjectCode(){var e,t;return null!==(t=null===(e=this._options)||void 0===e?void 0:e.doNotInjectCode)&&void 0!==t&&t}constructor(e,t,i){this._baseMaterial=e,this._scene=null!=t?t:A.l.LastCreatedScene,this._options=i,this._subMeshToEffect=new Map,this._subMeshToDepthWrapper=new cp,this._meshes=new Map,this._onEffectCreatedObserver=this._baseMaterial.onEffectCreatedObservable.add((e=>{var t;const i=null===(t=e.subMesh)||void 0===t?void 0:t.getMesh();i&&!this._meshes.has(i)&&this._meshes.set(i,i.onDisposeObservable.add((e=>{const t=this._subMeshToEffect.keys();for(let i=t.next();!0!==i.done;i=t.next()){const t=i.value;(null==t?void 0:t.getMesh())===e&&(this._subMeshToEffect.delete(t),this._subMeshToDepthWrapper.mm.delete(t))}}))),this._subMeshToEffect.set(e.subMesh,[e.effect,this._scene.getEngine().currentRenderPassId]),this._subMeshToDepthWrapper.mm.delete(e.subMesh)}))}getEffect(e,t,i){var n;const s=null===(n=this._subMeshToDepthWrapper.mm.get(e))||void 0===n?void 0:n.get(t);if(!s)return null;let r=s.drawWrapper[i];return r||(r=s.drawWrapper[i]=new Ps.q(this._scene.getEngine()),r.setEffect(s.mainDrawWrapper.effect,s.mainDrawWrapper.defines)),r}isReadyForSubMesh(e,t,i,n,s){var r,o;return!(this.standalone&&!this._baseMaterial.isReadyForSubMesh(e.getMesh(),e,n))&&null!==(o=null===(r=this._makeEffect(e,t,i,s))||void 0===r?void 0:r.isReady())&&void 0!==o&&o}dispose(){this._baseMaterial.onEffectCreatedObservable.remove(this._onEffectCreatedObserver),this._onEffectCreatedObserver=null;const e=this._meshes.entries();for(let t=e.next();!0!==t.done;t=e.next()){const[e,i]=t.value;e.onDisposeObservable.remove(i)}}_makeEffect(e,t,i,n){var s,r,o;const a=this._scene.getEngine(),l=this._subMeshToEffect.get(e);if(!l)return null;const[h,c]=l;let u=this._subMeshToDepthWrapper.get(e,i);if(!u){const t=new Ps.q(a);t.defines=null!==(r=null===(s=e._getDrawWrapper(c))||void 0===s?void 0:s.defines)&&void 0!==r?r:null,u={drawWrapper:[],mainDrawWrapper:t,depthDefines:"",token:(0,hp.f)()},u.drawWrapper[n]=t,this._subMeshToDepthWrapper.set(e,i,u)}const d=t.join("\n");if(u.mainDrawWrapper.effect&&d===u.depthDefines)return u.mainDrawWrapper.effect;u.depthDefines=d;const p=h.getUniformNames().slice();let f=h.vertexSourceCodeBeforeMigration,_=h.fragmentSourceCodeBeforeMigration;if(!this.doNotInjectCode){const e=this._options&&this._options.remappedVariables?`#include<shadowMapVertexNormalBias>(${this._options.remappedVariables.join(",")})`:ds.Q.IncludesShadersStore.shadowMapVertexNormalBias,t=this._options&&this._options.remappedVariables?`#include<shadowMapVertexMetric>(${this._options.remappedVariables.join(",")})`:ds.Q.IncludesShadersStore.shadowMapVertexMetric,i=this._options&&this._options.remappedVariables?`#include<shadowMapFragmentSoftTransparentShadow>(${this._options.remappedVariables.join(",")})`:ds.Q.IncludesShadersStore.shadowMapFragmentSoftTransparentShadow,n=ds.Q.IncludesShadersStore.shadowMapFragment;f=f.replace(/void\s+?main/g,ds.Q.IncludesShadersStore.shadowMapVertexExtraDeclaration+"\r\nvoid main"),f=f.replace(/#define SHADOWDEPTH_NORMALBIAS|#define CUSTOM_VERTEX_UPDATE_WORLDPOS/g,e),f=-1!==f.indexOf("#define SHADOWDEPTH_METRIC")?f.replace(/#define SHADOWDEPTH_METRIC/g,t):f.replace(/}\s*$/g,t+"\r\n}"),f=f.replace(/#define SHADER_NAME.*?\n|out vec4 glFragColor;\n/g,"");const s=_.indexOf("#define SHADOWDEPTH_SOFTTRANSPARENTSHADOW")>=0||_.indexOf("#define CUSTOM_FRAGMENT_BEFORE_FOG")>=0,r=-1!==_.indexOf("#define SHADOWDEPTH_FRAGMENT");let o="";s?_=_.replace(/#define SHADOWDEPTH_SOFTTRANSPARENTSHADOW|#define CUSTOM_FRAGMENT_BEFORE_FOG/g,i):o=i+"\r\n",_=_.replace(/void\s+?main/g,ds.Q.IncludesShadersStore.shadowMapFragmentExtraDeclaration+"\r\nvoid main"),r?_=_.replace(/#define SHADOWDEPTH_FRAGMENT/g,n):o+=n+"\r\n",o&&(_=_.replace(/}\s*$/g,o+"}")),p.push("biasAndScaleSM","depthValuesSM","lightDataSM","softTransparentShadowSM")}u.mainDrawWrapper.effect=a.createEffect({vertexSource:f,fragmentSource:_,vertexToken:u.token,fragmentToken:u.token},{attributes:h.getAttributesNames(),uniformsNames:p,uniformBuffersNames:h.getUniformBuffersNames(),samplers:h.getSamplers(),defines:d+"\n"+h.defines.replace("#define SHADOWS","").replace(/#define SHADOW\d/g,""),indexParameters:h.getIndexParameters()},a);for(let e=0;e<u.drawWrapper.length;++e)e!==n&&(null===(o=u.drawWrapper[e])||void 0===o||o.setEffect(u.mainDrawWrapper.effect,u.mainDrawWrapper.defines));return u.mainDrawWrapper.effect}}var dp=i(8449),pp=i(9249),fp=i(1698),_p=i(6150);class mp extends Ba.H{constructor(){super(...arguments),this.DECAL=!1,this.DECALDIRECTUV=0,this.DECAL_SMOOTHALPHA=!1,this.GAMMADECAL=!1}}class gp extends dp.n{_markAllSubMeshesAsTexturesDirty(){this._enable(this._isEnabled),this._internalMarkAllSubMeshesAsTexturesDirty()}constructor(e,t=!0){super(e,"DecalMap",150,new mp,t),this._isEnabled=!1,this.isEnabled=!1,this._smoothAlpha=!1,this.smoothAlpha=!1,this.registerForExtraEvents=!0,this._internalMarkAllSubMeshesAsTexturesDirty=e._dirtyCallbacks[1]}isReadyForSubMesh(e,t,i,n){const s=n.getMesh().decalMap;return!(this._isEnabled&&(null==s?void 0:s.texture)&&Va.k.DecalMapEnabled&&t.texturesEnabled)||s.isReady()}prepareDefines(e,t,i){const n=i.decalMap;this._isEnabled&&(null==n?void 0:n.texture)&&Va.k.DecalMapEnabled&&t.texturesEnabled?((!e.DECAL||e.GAMMADECAL!==n.texture.gammaSpace)&&e.markAsTexturesDirty(),e.DECAL=!0,e.GAMMADECAL=n.texture.gammaSpace,e.DECAL_SMOOTHALPHA=this._smoothAlpha,La.G.PrepareDefinesForMergedUV(n.texture,e,"DECAL")):(e.DECAL&&e.markAsTexturesDirty(),e.DECAL=!1)}hardBindForSubMesh(e,t,i,n){const s=n.getMesh().decalMap;if(!(this._isEnabled&&(null==s?void 0:s.texture)&&Va.k.DecalMapEnabled&&t.texturesEnabled))return;const r=this._material.isFrozen,o=s.texture;e.useUbo&&r&&e.isSync||(e.updateFloat4("vDecalInfos",o.coordinatesIndex,0,0,0),La.G.BindTextureMatrix(o,e,"decal")),e.setTexture("decalSampler",o)}getClassName(){return"DecalMapConfiguration"}getSamplers(e){e.push("decalSampler")}getUniforms(){return{ubo:[{name:"vDecalInfos",size:4,type:"vec4"},{name:"decalMatrix",size:16,type:"mat4"}]}}}(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],gp.prototype,"isEnabled",void 0),(0,be.gn)([(0,Te.qC)(),(0,Te.wz)("_markAllSubMeshesAsTexturesDirty")],gp.prototype,"smoothAlpha",void 0);var vp=i(1444);function yp(e){return e instanceof nc.m?new ic.u(e):null}function xp(e){return e instanceof nc.m?new vp.d(e):null}function bp(e){return e instanceof nc.m?new rc.Y(e):null}function Tp(e){return e instanceof nc.m?new oc.B(e):null}function Sp(e){return e instanceof nc.m?new hc.B(e):null}function Ep(e){return e instanceof nc.m?new cc.u(e):null}function Cp(e){return e instanceof nc.m||e instanceof Gi.K?new _p.p(e):null}Object.defineProperty(Gi.K.prototype,"decalMap",{get:function(){if(!this._decalMap){if(this._uniformBufferLayoutBuilt)return null;this._decalMap=new gp(this)}return this._decalMap},enumerable:!0,configurable:!0}),Object.defineProperty(nc.m.prototype,"decalMap",{get:function(){if(!this._decalMap){if(this._uniformBufferLayoutBuilt)return null;this._decalMap=new gp(this)}return this._decalMap},enumerable:!0,configurable:!0}),Object.defineProperty(Un.x.prototype,"decalMap",{get:function(){return this._decalMap},set:function(e){this._decalMap=e},enumerable:!0,configurable:!0});var Ap=i(1372);class Pp{constructor(e,t){this.radius=e,this.theta=t}getClassName(){return"Polar"}toString(){return JSON.stringify(this)}asArray(){return[this.radius,this.theta]}addToRef(e,t){return t.radius=this.radius+e.radius,t.theta=this.theta+e.theta,t}add(e){const t=new Pp(0,0);return this.addToRef(e,t),t}addInPlace(e){return this.addToRef(e,this),this}addInPlaceFromFloats(e,t){return this.radius+=e,this.theta+=t,this}subtractToRef(e,t){return t.radius=this.radius-e.radius,t.theta=this.theta-e.theta,t}subtract(e){const t=new Pp(0,0);return this.subtractToRef(e,t),t}subtractInPlace(e){return this.subtractToRef(e,this),this}subtractFromFloatsToRef(e,t,i){return i.radius=this.radius-e,i.theta=this.theta-t,i}subtractFromFloats(e,t){const i=new Pp(0,0);return this.subtractFromFloatsToRef(e,t,i),i}multiplyToRef(e,t){return t.radius=this.radius*e.radius,t.theta=this.theta*e.theta,t}multiply(e){const t=new Pp(0,0);return this.multiplyToRef(e,t),t}multiplyInPlace(e){return this.multiplyToRef(e,this),this}divideToRef(e,t){return t.radius=this.radius/e.radius,t.theta=this.theta/e.theta,t}divide(e){const t=new Pp(0,0);return this.divideToRef(e,t),t}divideInPlace(e){return this.divideToRef(e,this),this}clone(){return new Pp(this.radius,this.theta)}copyFrom(e){return this.radius=e.radius,this.theta=e.theta,this}copyFromFloats(e,t){return this.radius=e,this.theta=t,this}scaleToRef(e,t){return t.radius=this.radius*e,t.theta=this.theta*e,t}scale(e){const t=new Pp(0,0);return this.scaleToRef(e,t),t}scaleInPlace(e){return this.scaleToRef(e,this),this}set(e,t){return this.radius=e,this.theta=t,this}setAll(e){return this.set(e,e),this}toVector2ToRef(e){const t=this.radius*Math.cos(this.theta),i=this.radius*Math.sin(this.theta);return e.set(t,i),e}toVector2(){const e=new o.FM(0,0);return this.toVector2ToRef(e)}static FromVector2ToRef(e,t){const i=Math.sign(e.y)*Math.acos(e.x/e.length());return t.radius=e.length(),t.theta=i,t}static FromVector2(e){const t=new Pp(0,0);return Pp.FromVector2ToRef(e,t),t}static FromArray(e){return new Pp(e[0],e[1])}}class Rp{constructor(e,t,i){this.radius=e,this.theta=t,this.phi=i}getClassName(){return"Spherical"}toString(){return JSON.stringify(this)}asArray(){return[this.radius,this.theta,this.phi]}addToRef(e,t){return t.radius=this.radius+e.radius,t.theta=this.theta+e.theta,t.phi=this.phi+e.phi,t}add(e){const t=new Rp(0,0,0);return this.addToRef(e,t),t}addInPlace(e){return this.addToRef(e,this),this}addInPlaceFromFloats(e,t,i){return this.radius+=e,this.theta+=t,this.phi+=i,this}subtractToRef(e,t){return t.radius=this.radius-e.radius,t.theta=this.theta-e.theta,t.phi=this.phi-e.phi,t}subtract(e){const t=new Rp(0,0,0);return this.subtractToRef(e,t),t}subtractInPlace(e){return this.subtractToRef(e,this),this}subtractFromFloatsToRef(e,t,i,n){return n.radius=this.radius-e,n.theta=this.theta-t,n.phi=this.phi-i,n}subtractFromFloats(e,t,i){const n=new Rp(0,0,0);return this.subtractFromFloatsToRef(e,t,i,n),n}multiplyToRef(e,t){return t.radius=this.radius*e.radius,t.theta=this.theta*e.theta,t.phi=this.phi*e.phi,t}multiply(e){const t=new Rp(0,0,0);return this.multiplyToRef(e,t),t}multiplyInPlace(e){return this.multiplyToRef(e,this),this}divideToRef(e,t){return t.radius=this.radius/e.radius,t.theta=this.theta/e.theta,t.phi=this.phi/e.phi,t}divide(e){const t=new Rp(0,0,0);return this.divideToRef(e,t),t}divideInPlace(e){return this.divideToRef(e,this),this}clone(){return new Rp(this.radius,this.theta,this.phi)}copyFrom(e){return this.radius=e.radius,this.theta=e.theta,this.phi=e.phi,this}copyFromFloats(e,t,i){return this.radius=e,this.theta=t,this.phi=i,this}scaleToRef(e,t){return t.radius=this.radius*e,t.theta=this.theta*e,t.phi=this.phi*e,t}scale(e){const t=new Rp(0,0,0);return this.scaleToRef(e,t),t}scaleInPlace(e){return this.scaleToRef(e,this),this}set(e,t,i){return this.radius=e,this.theta=t,this.phi=i,this}setAll(e){return this.set(e,e,e),this}toVector3ToRef(e){const t=this.radius*Math.sin(this.theta)*Math.cos(this.phi),i=this.radius*Math.cos(this.theta),n=this.radius*Math.sin(this.theta)*Math.sin(this.phi);return e.set(t,i,n),e}toVector3(){const e=new o.P(0,0,0);return this.toVector3ToRef(e)}static FromVector3ToRef(e,t){return t.radius=e.length(),t.theta=Math.acos(e.y/t.radius),t.phi=Math.atan2(e.z,e.x),t}static FromVector3(e){const t=new Rp(0,0,0);return Rp.FromVector3ToRef(e,t),t}static FromArray(e){return new Rp(e[0],e[1],e[2])}}var Mp=i(1500),Ip=i(9481);let Dp=0;class Op{constructor(e,t,i,n){this.pos=e,this.normal=t,this.uv=i,this.vertColor=n}clone(){var e,t;return new Op(this.pos.clone(),this.normal.clone(),null===(e=this.uv)||void 0===e?void 0:e.clone(),null===(t=this.vertColor)||void 0===t?void 0:t.clone())}flip(){this.normal=this.normal.scale(-1)}interpolate(e,t){return new Op(o.P.Lerp(this.pos,e.pos,t),o.P.Lerp(this.normal,e.normal,t),this.uv&&e.uv?o.FM.Lerp(this.uv,e.uv,t):void 0,this.vertColor&&e.vertColor?a.HE.Lerp(this.vertColor,e.vertColor,t):void 0)}}class wp{constructor(e,t){this.normal=e,this.w=t}static FromPoints(e,t,i){const n=i.subtract(e),s=t.subtract(e);if(0===n.lengthSquared()||0===s.lengthSquared())return null;const r=o.P.Normalize(o.P.Cross(n,s));return new wp(r,o.P.Dot(r,e))}clone(){return new wp(this.normal.clone(),this.w)}flip(){this.normal.scaleInPlace(-1),this.w=-this.w}splitPolygon(e,t,i,n,s){let r=0;const a=[];let l,h;for(l=0;l<e.vertices.length;l++){h=o.P.Dot(this.normal,e.vertices[l].pos)-this.w;const t=h<-wp.EPSILON?2:h>wp.EPSILON?1:0;r|=t,a.push(t)}switch(r){case 0:(o.P.Dot(this.normal,e.plane.normal)>0?t:i).push(e);break;case 1:n.push(e);break;case 2:s.push(e);break;case 3:{const t=[],i=[];for(l=0;l<e.vertices.length;l++){const n=(l+1)%e.vertices.length,s=a[l],r=a[n],c=e.vertices[l],u=e.vertices[n];if(2!==s&&t.push(c),1!==s&&i.push(2!==s?c.clone():c),3==(s|r)){h=(this.w-o.P.Dot(this.normal,c.pos))/o.P.Dot(this.normal,u.pos.subtract(c.pos));const e=c.interpolate(u,h);t.push(e),i.push(e.clone())}}let r;t.length>=3&&(r=new Np(t,e.shared),r.plane&&n.push(r)),i.length>=3&&(r=new Np(i,e.shared),r.plane&&s.push(r));break}}}}wp.EPSILON=1e-5;class Np{constructor(e,t){this.vertices=e,this.shared=t,this.plane=wp.FromPoints(e[0].pos,e[1].pos,e[2].pos)}clone(){const e=this.vertices.map((e=>e.clone()));return new Np(e,this.shared)}flip(){this.vertices.reverse().map((e=>{e.flip()})),this.plane.flip()}}class Fp{constructor(e){this._plane=null,this._front=null,this._back=null,this._polygons=new Array,e&&this.build(e)}clone(){const e=new Fp;return e._plane=this._plane&&this._plane.clone(),e._front=this._front&&this._front.clone(),e._back=this._back&&this._back.clone(),e._polygons=this._polygons.map((e=>e.clone())),e}invert(){for(let e=0;e<this._polygons.length;e++)this._polygons[e].flip();this._plane&&this._plane.flip(),this._front&&this._front.invert(),this._back&&this._back.invert();const e=this._front;this._front=this._back,this._back=e}clipPolygons(e){if(!this._plane)return e.slice();let t=new Array,i=new Array;for(let n=0;n<e.length;n++)this._plane.splitPolygon(e[n],t,i,t,i);return this._front&&(t=this._front.clipPolygons(t)),i=this._back?this._back.clipPolygons(i):[],t.concat(i)}clipTo(e){this._polygons=e.clipPolygons(this._polygons),this._front&&this._front.clipTo(e),this._back&&this._back.clipTo(e)}allPolygons(){let e=this._polygons.slice();return this._front&&(e=e.concat(this._front.allPolygons())),this._back&&(e=e.concat(this._back.allPolygons())),e}build(e){if(!e.length)return;this._plane||(this._plane=e[0].plane.clone());const t=new Array,i=new Array;for(let n=0;n<e.length;n++)this._plane.splitPolygon(e[n],this._polygons,this._polygons,t,i);t.length&&(this._front||(this._front=new Fp),this._front.build(t)),i.length&&(this._back||(this._back=new Fp),this._back.build(i))}}class Lp{constructor(){this._polygons=new Array}static FromMesh(e,t=!1){let i,n,s,r,l,h,c;const u=new Array;let d,p,f,_,m=null,g=!1;if(!(e instanceof Nt.Kj))throw"BABYLON.CSG: Wrong Mesh type, must be BABYLON.Mesh";e.computeWorldMatrix(!0),d=e.getWorldMatrix(),p=e.position.clone(),f=e.rotation.clone(),e.rotationQuaternion&&(m=e.rotationQuaternion.clone()),_=e.scaling.clone(),e.material&&t&&(g=0===e.material.sideOrientation);const v=e.getIndices(),y=e.getVerticesData(qe.o.PositionKind),x=e.getVerticesData(qe.o.NormalKind),b=e.getVerticesData(qe.o.UVKind),T=e.getVerticesData(qe.o.ColorKind),S=e.subMeshes;for(let e=0,t=S.length;e<t;e++)for(let t=S[e].indexStart,p=S[e].indexCount+S[e].indexStart;t<p;t+=3){c=[];for(let e=0;e<3;e++){const h=0===e?t+e:g?t+3-e:t+e,u=new o.P(x[3*v[h]],x[3*v[h]+1],x[3*v[h]+2]);b&&(s=new o.FM(b[2*v[h]],b[2*v[h]+1])),T&&(l=new a.HE(T[4*v[h]],T[4*v[h]+1],T[4*v[h]+2],T[4*v[h]+3]));const p=new o.P(y[3*v[h]],y[3*v[h]+1],y[3*v[h]+2]);r=o.P.TransformCoordinates(p,d),n=o.P.TransformNormal(u,d),i=new Op(r,n,s,l),c.push(i)}h=new Np(c,{subMeshId:e,meshId:Dp,materialIndex:S[e].materialIndex}),h.plane&&u.push(h)}const E=Lp._FromPolygons(u);return E.matrix=t?o.y3.Identity():d,E.position=t?o.P.Zero():p,E.rotation=t?o.P.Zero():f,E.scaling=t?o.P.One():_,E.rotationQuaternion=t&&m?o._f.Identity():m,Dp++,E}static _FromPolygons(e){const t=new Lp;return t._polygons=e,t}clone(){const e=new Lp;return e._polygons=this._polygons.map((e=>e.clone())),e.copyTransformAttributes(this),e}union(e){const t=new Fp(this.clone()._polygons),i=new Fp(e.clone()._polygons);return t.clipTo(i),i.clipTo(t),i.invert(),i.clipTo(t),i.invert(),t.build(i.allPolygons()),Lp._FromPolygons(t.allPolygons()).copyTransformAttributes(this)}unionInPlace(e){const t=new Fp(this._polygons),i=new Fp(e._polygons);t.clipTo(i),i.clipTo(t),i.invert(),i.clipTo(t),i.invert(),t.build(i.allPolygons()),this._polygons=t.allPolygons()}subtract(e){const t=new Fp(this.clone()._polygons),i=new Fp(e.clone()._polygons);return t.invert(),t.clipTo(i),i.clipTo(t),i.invert(),i.clipTo(t),i.invert(),t.build(i.allPolygons()),t.invert(),Lp._FromPolygons(t.allPolygons()).copyTransformAttributes(this)}subtractInPlace(e){const t=new Fp(this._polygons),i=new Fp(e._polygons);t.invert(),t.clipTo(i),i.clipTo(t),i.invert(),i.clipTo(t),i.invert(),t.build(i.allPolygons()),t.invert(),this._polygons=t.allPolygons()}intersect(e){const t=new Fp(this.clone()._polygons),i=new Fp(e.clone()._polygons);return t.invert(),i.clipTo(t),i.invert(),t.clipTo(i),i.clipTo(t),t.build(i.allPolygons()),t.invert(),Lp._FromPolygons(t.allPolygons()).copyTransformAttributes(this)}intersectInPlace(e){const t=new Fp(this._polygons),i=new Fp(e._polygons);t.invert(),i.clipTo(t),i.invert(),t.clipTo(i),i.clipTo(t),t.build(i.allPolygons()),t.invert(),this._polygons=t.allPolygons()}inverse(){const e=this.clone();return e.inverseInPlace(),e}inverseInPlace(){this._polygons.map((e=>{e.flip()}))}copyTransformAttributes(e){return this.matrix=e.matrix,this.position=e.position,this.rotation=e.rotation,this.scaling=e.scaling,this.rotationQuaternion=e.rotationQuaternion,this}buildMeshGeometry(e,t,i){const n=this.matrix.clone();n.invert();const s=new Nt.Kj(e,t),r=[],l=[],h=[];let c=null,u=null;const d=o.P.Zero(),p=o.P.Zero(),f=o.FM.Zero(),_=new a.HE(0,0,0,0),m=this._polygons,g=[0,0,0];let v;const y={};let x,b=0;const T={};let S;i&&m.sort(((e,t)=>e.shared.meshId===t.shared.meshId?e.shared.subMeshId-t.shared.subMeshId:e.shared.meshId-t.shared.meshId));for(let e=0,t=m.length;e<t;e++){v=m[e],T[v.shared.meshId]||(T[v.shared.meshId]={}),T[v.shared.meshId][v.shared.subMeshId]||(T[v.shared.meshId][v.shared.subMeshId]={indexStart:1/0,indexEnd:-1/0,materialIndex:v.shared.materialIndex}),S=T[v.shared.meshId][v.shared.subMeshId];for(let e=2,t=v.vertices.length;e<t;e++){g[0]=0,g[1]=e-1,g[2]=e;for(let e=0;e<3;e++){d.copyFrom(v.vertices[g[e]].pos),p.copyFrom(v.vertices[g[e]].normal),v.vertices[g[e]].uv&&(c||(c=[]),f.copyFrom(v.vertices[g[e]].uv)),v.vertices[g[e]].vertColor&&(u||(u=[]),_.copyFrom(v.vertices[g[e]].vertColor));const t=o.P.TransformCoordinates(d,n),i=o.P.TransformNormal(p,n);x=y[t.x+","+t.y+","+t.z];let s=!1;c&&c[2*x]!==f.x&&c[2*x+1]!==f.y&&(s=!0);let a=!1;u&&u[4*x]!==_.r&&u[4*x+1]!==_.g&&u[4*x+2]!==_.b&&u[4*x+3]!==_.a&&(a=!0),(void 0===x||h[3*x]!==i.x||h[3*x+1]!==i.y||h[3*x+2]!==i.z||s||a)&&(r.push(t.x,t.y,t.z),c&&c.push(f.x,f.y),h.push(p.x,p.y,p.z),u&&u.push(_.r,_.g,_.b,_.a),x=y[t.x+","+t.y+","+t.z]=r.length/3-1),l.push(x),S.indexStart=Math.min(b,S.indexStart),S.indexEnd=Math.max(b,S.indexEnd),b++}}}if(s.setVerticesData(qe.o.PositionKind,r),s.setVerticesData(qe.o.NormalKind,h),c&&s.setVerticesData(qe.o.UVKind,c),u&&s.setVerticesData(qe.o.ColorKind,u),s.setIndices(l,null),i){let e,t=0;s.subMeshes=new Array;for(const i in T){e=-1;for(const n in T[i])S=T[i][n],Ll.P.CreateFromIndices(S.materialIndex+t,S.indexStart,S.indexEnd-S.indexStart+1,s),e=Math.max(S.materialIndex,e);t+=++e}}return s}toMesh(e,t=null,i,n){const s=this.buildMeshGeometry(e,i,n);return s.material=t,s.position.copyFrom(this.position),s.rotation.copyFrom(this.rotation),this.rotationQuaternion&&(s.rotationQuaternion=this.rotationQuaternion.clone()),s.scaling.copyFrom(this.scaling),s.computeWorldMatrix(!0),s}}si.v.ShadersStore.meshUVSpaceRendererVertexShader="precision highp float;\nattribute vec3 position;\nattribute vec3 normal;\nattribute vec2 uv;\nuniform mat4 projMatrix;\nvarying vec2 vDecalTC;\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<morphTargetsVertexGlobalDeclaration>\n#include<morphTargetsVertexDeclaration>[0..maxSimultaneousMorphTargets]\n#include<instancesDeclaration>\nvoid main(void) {\nvec3 positionUpdated=position;\nvec3 normalUpdated=normal;\n#include<morphTargetsVertexGlobal>\n#include<morphTargetsVertex>[0..maxSimultaneousMorphTargets]\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(positionUpdated,1.0);\nmat3 normWorldSM=mat3(finalWorld);\nvec3 vNormalW;\n#if defined(INSTANCES) && defined(THIN_INSTANCES)\nvNormalW=normalUpdated/vec3(dot(normWorldSM[0],normWorldSM[0]),dot(normWorldSM[1],normWorldSM[1]),dot(normWorldSM[2],normWorldSM[2]));\nvNormalW=normalize(normWorldSM*vNormalW);\n#else\n#ifdef NONUNIFORMSCALING\nnormWorldSM=transposeMat3(inverseMat3(normWorldSM));\n#endif\nvNormalW=normalize(normWorldSM*normalUpdated);\n#endif\nvec3 normalView=normalize((projMatrix*vec4(vNormalW,0.0)).xyz);\nvec3 decalTC=(projMatrix*worldPos).xyz;\nvDecalTC=decalTC.xy;\ngl_Position=vec4(uv*2.0-1.0,normalView.z>0.0 ? 2. : decalTC.z,1.0);\n}\n";si.v.ShadersStore.meshUVSpaceRendererPixelShader="precision highp float;\nvarying vec2 vDecalTC;\nuniform sampler2D textureSampler;\nvoid main(void) {\nif (vDecalTC.x<0. || vDecalTC.x>1. || vDecalTC.y<0. || vDecalTC.y>1.) {\ndiscard;\n}\ngl_FragColor=texture2D(textureSampler,vDecalTC);\n}\n";class Bp{static _GetShader(e){if(!e._meshUVSpaceRendererShader){const t=new us.j("meshUVSpaceRendererShader",e,{vertex:"meshUVSpaceRenderer",fragment:"meshUVSpaceRenderer"},{attributes:["position","normal","uv"],uniforms:["world","worldView","worldViewProjection","view","projection"],needAlphaBlending:!0});t.backFaceCulling=!1,t.alphaMode=2,e.onDisposeObservable.add((()=>{var t;null===(t=e._meshUVSpaceRendererShader)||void 0===t||t.dispose(),e._meshUVSpaceRendererShader=null})),e._meshUVSpaceRendererShader=t}return e._meshUVSpaceRendererShader}static _IsRenderTargetTexture(e){return void 0!==e.renderList}constructor(e,t,i){this._textureCreatedInternally=!1,this.clearColor=new a.HE(0,0,0,0),this._mesh=e,this._scene=t,this._options={width:1024,height:1024,textureType:0,generateMipMaps:!0,optimizeUVAllocation:!0,...i}}isReady(){var e,t;return Bp._GetShader(this._scene).isReady()&&(null===(t=null===(e=this.texture)||void 0===e?void 0:e.isReady())||void 0===t||t)}renderTexture(e,t,i,n,s=0){if(this.texture||this._createDiffuseRTT(),Bp._IsRenderTargetTexture(this.texture)){const r=this._createProjectionMatrix(t,i,n,s),o=Bp._GetShader(this._scene);o.setTexture("textureSampler",e),o.setMatrix("projMatrix",r),this.texture.render()}}clear(){if(Bp._IsRenderTargetTexture(this.texture)&&this.texture.renderTarget){const e=this._scene.getEngine();e.bindFramebuffer(this.texture.renderTarget),e.clear(this.clearColor,!0,!0,!0),e.unBindFramebuffer(this.texture.renderTarget)}}dispose(){this._textureCreatedInternally&&(this.texture.dispose(),this._textureCreatedInternally=!1)}_createDiffuseRTT(){this._textureCreatedInternally=!0;const e=this._createRenderTargetTexture(this._options.width,this._options.height);e.setMaterialForRendering(this._mesh,Bp._GetShader(this._scene)),this.texture=e}_createRenderTargetTexture(e,t){const i=new Ai._(this._mesh.name+"_uvspaceTexture",{width:e,height:t},this._scene,this._options.generateMipMaps,!0,this._options.textureType,!1,this._options.generateMipMaps?3:2,!1,!1,!1,5);return i.optimizeUVAllocation=!!this._options.optimizeUVAllocation,i.onClearObservable.addOnce((()=>{this._scene.getEngine().clear(this.clearColor,!0,!0,!0),i.onClearObservable.add((()=>{}))})),i.renderList=[this._mesh],i}_createProjectionMatrix(e,t,i,n=0){const s=-Math.atan2(t.z,t.x)-Math.PI/2,r=Math.sqrt(t.x*t.x+t.z*t.z),a=Math.atan2(t.y,r),l=e.add(t.scale(.5*i.z)),h=o.y3.RotationYawPitchRoll(s,a,n).multiply(o.y3.Translation(l.x,l.y,l.z)),c=o.y3.Invert(h),u=o.y3.FromArray([2/i.x,0,0,0,0,2/i.y,0,0,0,0,1/i.z,0,0,0,0,1]),d=o.y3.FromArray([.5,0,0,0,0,.5,0,0,0,0,1,0,.5,.5,0,1]);return c.multiply(u).multiply(d)}}var Up=i(8475);Nt.Kj._GoldbergMeshParser=(e,t)=>Vp.Parse(e,t);class Vp extends Nt.Kj{constructor(){super(...arguments),this.goldbergData={faceColors:[],faceCenters:[],faceZaxis:[],faceXaxis:[],faceYaxis:[],nbSharedFaces:0,nbUnsharedFaces:0,nbFaces:0,nbFacesAtPole:0,adjacentFaces:[]}}relatedGoldbergFace(e,t){return void 0===t?(e>this.goldbergData.nbUnsharedFaces-1&&(_.Y.Warn("Maximum number of unshared faces used"),e=this.goldbergData.nbUnsharedFaces-1),this.goldbergData.nbUnsharedFaces+e):(e>11&&(_.Y.Warn("Last pole used"),e=11),t>this.goldbergData.nbFacesAtPole-1&&(_.Y.Warn("Maximum number of faces at a pole used"),t=this.goldbergData.nbFacesAtPole-1),12+e*this.goldbergData.nbFacesAtPole+t)}_changeGoldbergFaceColors(e){for(let t=0;t<e.length;t++){const i=e[t][0],n=e[t][1],s=e[t][2];for(let e=i;e<n+1;e++)this.goldbergData.faceColors[e]=s}const t=[];for(let e=0;e<12;e++)for(let i=0;i<5;i++)t.push(this.goldbergData.faceColors[e].r,this.goldbergData.faceColors[e].g,this.goldbergData.faceColors[e].b,this.goldbergData.faceColors[e].a);for(let e=12;e<this.goldbergData.faceColors.length;e++)for(let i=0;i<6;i++)t.push(this.goldbergData.faceColors[e].r,this.goldbergData.faceColors[e].g,this.goldbergData.faceColors[e].b,this.goldbergData.faceColors[e].a);return t}setGoldbergFaceColors(e){const t=this._changeGoldbergFaceColors(e);this.setVerticesData(qe.o.ColorKind,t)}updateGoldbergFaceColors(e){const t=this._changeGoldbergFaceColors(e);this.updateVerticesData(qe.o.ColorKind,t)}_changeGoldbergFaceUVs(e){const t=this.getVerticesData(qe.o.UVKind);for(let i=0;i<e.length;i++){const n=e[i][0],s=e[i][1],r=e[i][2],o=e[i][3],a=e[i][4],l=[],h=[];let c,u;for(let e=0;e<5;e++)c=r.x+o*Math.cos(a+e*Math.PI/2.5),u=r.y+o*Math.sin(a+e*Math.PI/2.5),c<0&&(c=0),c>1&&(c=1),l.push(c,u);for(let e=0;e<6;e++)c=r.x+o*Math.cos(a+e*Math.PI/3),u=r.y+o*Math.sin(a+e*Math.PI/3),c<0&&(c=0),c>1&&(c=1),h.push(c,u);for(let e=n;e<Math.min(12,s+1);e++)for(let i=0;i<5;i++)t[10*e+2*i]=l[2*i],t[10*e+2*i+1]=l[2*i+1];for(let e=Math.max(12,n);e<s+1;e++)for(let i=0;i<6;i++)t[12*e-24+2*i]=h[2*i],t[12*e-23+2*i]=h[2*i+1]}return t}setGoldbergFaceUVs(e){const t=this._changeGoldbergFaceUVs(e);this.setVerticesData(qe.o.UVKind,t)}updateGoldbergFaceUVs(e){const t=this._changeGoldbergFaceUVs(e);this.updateVerticesData(qe.o.UVKind,t)}placeOnGoldbergFaceAt(e,t,i){const n=o.P.RotationFromAxis(this.goldbergData.faceXaxis[t],this.goldbergData.faceYaxis[t],this.goldbergData.faceZaxis[t]);e.rotation=n,e.position=this.goldbergData.faceCenters[t].add(this.goldbergData.faceXaxis[t].scale(i.x)).add(this.goldbergData.faceYaxis[t].scale(i.y)).add(this.goldbergData.faceZaxis[t].scale(i.z))}serialize(e){super.serialize(e),e.type="GoldbergMesh";const t={};if(t.adjacentFaces=this.goldbergData.adjacentFaces,t.nbSharedFaces=this.goldbergData.nbSharedFaces,t.nbUnsharedFaces=this.goldbergData.nbUnsharedFaces,t.nbFaces=this.goldbergData.nbFaces,t.nbFacesAtPole=this.goldbergData.nbFacesAtPole,this.goldbergData.faceColors){t.faceColors=[];for(const e of this.goldbergData.faceColors)t.faceColors.push(e.asArray())}if(this.goldbergData.faceCenters){t.faceCenters=[];for(const e of this.goldbergData.faceCenters)t.faceCenters.push(e.asArray())}if(this.goldbergData.faceZaxis){t.faceZaxis=[];for(const e of this.goldbergData.faceZaxis)t.faceZaxis.push(e.asArray())}if(this.goldbergData.faceYaxis){t.faceYaxis=[];for(const e of this.goldbergData.faceYaxis)t.faceYaxis.push(e.asArray())}if(this.goldbergData.faceXaxis){t.faceXaxis=[];for(const e of this.goldbergData.faceXaxis)t.faceXaxis.push(e.asArray())}e.goldbergData=t}static Parse(e,t){const i=e.goldbergData;i.faceColors=i.faceColors.map((e=>a.HE.FromArray(e))),i.faceCenters=i.faceCenters.map((e=>o.P.FromArray(e))),i.faceZaxis=i.faceZaxis.map((e=>o.P.FromArray(e))),i.faceXaxis=i.faceXaxis.map((e=>o.P.FromArray(e))),i.faceYaxis=i.faceYaxis.map((e=>o.P.FromArray(e)));const n=new Vp(e.name,t);return n.goldbergData=i,n}}class kp extends Nt.Kj{constructor(e,t,i,n=1,s=60,r=!0){super(e,i),this._sectionPolygonPointsCount=4,this._running=!1,this._autoStart=r,this._generator=t,this.diameter=n,this._length=s,this._sectionVectors=[],this._sectionNormalVectors=[];for(let e=0;e<this._sectionPolygonPointsCount;e++)this._sectionVectors[e]=o.P.Zero(),this._sectionNormalVectors[e]=o.P.Zero();this._createMesh()}getClassName(){return"TrailMesh"}_createMesh(){const e=new sn.x,t=[],i=[],n=[];let s=o.P.Zero();s=this._generator instanceof Un.x&&this._generator.hasBoundingInfo?this._generator.getBoundingInfo().boundingBox.centerWorld:this._generator.position;const r=2*Math.PI/this._sectionPolygonPointsCount;for(let e=0;e<this._sectionPolygonPointsCount;e++)t.push(s.x+Math.cos(e*r)*this.diameter,s.y+Math.sin(e*r)*this.diameter,s.z);for(let e=1;e<=this._length;e++){for(let e=0;e<this._sectionPolygonPointsCount;e++)t.push(s.x+Math.cos(e*r)*this.diameter,s.y+Math.sin(e*r)*this.diameter,s.z);const e=t.length/3-2*this._sectionPolygonPointsCount;for(let t=0;t<this._sectionPolygonPointsCount-1;t++)n.push(e+t,e+t+this._sectionPolygonPointsCount,e+t+this._sectionPolygonPointsCount+1),n.push(e+t,e+t+this._sectionPolygonPointsCount+1,e+t+1);n.push(e+this._sectionPolygonPointsCount-1,e+this._sectionPolygonPointsCount-1+this._sectionPolygonPointsCount,e+this._sectionPolygonPointsCount),n.push(e+this._sectionPolygonPointsCount-1,e+this._sectionPolygonPointsCount,e)}sn.x.ComputeNormals(t,n,i),e.positions=t,e.normals=i,e.indices=n,e.applyToMesh(this,!0),this._autoStart&&this.start()}start(){this._running||(this._running=!0,this._beforeRenderObserver=this.getScene().onBeforeRenderObservable.add((()=>{this.update()})))}stop(){this._beforeRenderObserver&&this._running&&(this._running=!1,this.getScene().onBeforeRenderObservable.remove(this._beforeRenderObserver))}update(){const e=this.getVerticesData(qe.o.PositionKind),t=this.getVerticesData(qe.o.NormalKind),i=this._generator.getWorldMatrix();if(e&&t){for(let i=3*this._sectionPolygonPointsCount;i<e.length;i++)e[i-3*this._sectionPolygonPointsCount]=e[i]-t[i]/this._length*this.diameter;for(let e=3*this._sectionPolygonPointsCount;e<t.length;e++)t[e-3*this._sectionPolygonPointsCount]=t[e];const n=e.length-3*this._sectionPolygonPointsCount,s=2*Math.PI/this._sectionPolygonPointsCount;for(let e=0;e<this._sectionPolygonPointsCount;e++)this._sectionVectors[e].copyFromFloats(Math.cos(e*s)*this.diameter,Math.sin(e*s)*this.diameter,0),this._sectionNormalVectors[e].copyFromFloats(Math.cos(e*s),Math.sin(e*s),0),o.P.TransformCoordinatesToRef(this._sectionVectors[e],i,this._sectionVectors[e]),o.P.TransformNormalToRef(this._sectionNormalVectors[e],i,this._sectionNormalVectors[e]);for(let i=0;i<this._sectionPolygonPointsCount;i++)e[n+3*i]=this._sectionVectors[i].x,e[n+3*i+1]=this._sectionVectors[i].y,e[n+3*i+2]=this._sectionVectors[i].z,t[n+3*i]=this._sectionNormalVectors[i].x,t[n+3*i+1]=this._sectionNormalVectors[i].y,t[n+3*i+2]=this._sectionNormalVectors[i].z;this.updateVerticesData(qe.o.PositionKind,e,!0,!1),this.updateVerticesData(qe.o.NormalKind,t,!0,!1)}}clone(e="",t){return new kp(e,void 0===t?this._generator:t,this.getScene(),this.diameter,this._length,this._autoStart)}serialize(e){super.serialize(e)}static Parse(e,t){var i;return new kp(e.name,e._generator,t,null!==(i=e.diameter)&&void 0!==i?i:e._diameter,e._length,e._autoStart)}}var Gp=i(7338);function zp(e){const t=e.pattern||Nt.Kj.NO_FLIP,i=e.tileWidth||e.tileSize||1,n=e.tileHeight||e.tileSize||1,s=e.alignHorizontal||0,r=e.alignVertical||0,o=e.width||e.size||1,a=Math.floor(o/i);let l=o-a*i;const h=e.height||e.size||1,c=Math.floor(h/n);let u=h-c*n;const d=i*a/2,p=n*c/2;let f=0,_=0,m=0,g=0,v=0,y=0;if(l>0||u>0){switch(m=-d,g=-p,v=d,y=p,s){case Nt.Kj.CENTER:l/=2,m-=l,v+=l;break;case Nt.Kj.LEFT:v+=l,f=-l/2;break;case Nt.Kj.RIGHT:m-=l,f=l/2}switch(r){case Nt.Kj.CENTER:u/=2,g-=u,y+=u;break;case Nt.Kj.BOTTOM:y+=u,_=-u/2;break;case Nt.Kj.TOP:g-=u,_=u/2}}const x=[],b=[],T=[];T[0]=[0,0,1,0,1,1,0,1],T[1]=[0,0,1,0,1,1,0,1],t!==Nt.Kj.ROTATE_TILE&&t!==Nt.Kj.ROTATE_ROW||(T[1]=[1,1,0,1,0,0,1,0]),t!==Nt.Kj.FLIP_TILE&&t!==Nt.Kj.FLIP_ROW||(T[1]=[1,0,0,0,0,1,1,1]),t!==Nt.Kj.FLIP_N_ROTATE_TILE&&t!==Nt.Kj.FLIP_N_ROTATE_ROW||(T[1]=[0,1,1,1,1,0,0,0]);let S=[];const E=[],C=[];let A=0;for(let e=0;e<c;e++)for(let s=0;s<a;s++)x.push(s*i-d+f,e*n-p+_,0),x.push((s+1)*i-d+f,e*n-p+_,0),x.push((s+1)*i-d+f,(e+1)*n-p+_,0),x.push(s*i-d+f,(e+1)*n-p+_,0),C.push(A,A+1,A+3,A+1,A+2,A+3),S=t===Nt.Kj.FLIP_TILE||t===Nt.Kj.ROTATE_TILE||t===Nt.Kj.FLIP_N_ROTATE_TILE?S.concat(T[(s%2+e%2)%2]):t===Nt.Kj.FLIP_ROW||t===Nt.Kj.ROTATE_ROW||t===Nt.Kj.FLIP_N_ROTATE_ROW?S.concat(T[e%2]):S.concat(T[0]),E.push(1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1),b.push(0,0,-1,0,0,-1,0,0,-1,0,0,-1),A+=4;if(l>0||u>0){const e=u>0&&(r===Nt.Kj.CENTER||r===Nt.Kj.TOP),o=u>0&&(r===Nt.Kj.CENTER||r===Nt.Kj.BOTTOM),h=l>0&&(s===Nt.Kj.CENTER||s===Nt.Kj.RIGHT),T=l>0&&(s===Nt.Kj.CENTER||s===Nt.Kj.LEFT);let P,R,M,I,D=[];if(e&&h&&(x.push(m+f,g+_,0),x.push(-d+f,g+_,0),x.push(-d+f,g+u+_,0),x.push(m+f,g+u+_,0),C.push(A,A+1,A+3,A+1,A+2,A+3),A+=4,P=1-l/i,R=1-u/n,M=1,I=1,D=[P,R,M,R,M,I,P,I],t===Nt.Kj.ROTATE_ROW&&(D=[1-P,1-R,1-M,1-R,1-M,1-I,1-P,1-I]),t===Nt.Kj.FLIP_ROW&&(D=[1-P,R,1-M,R,1-M,I,1-P,I]),t===Nt.Kj.FLIP_N_ROTATE_ROW&&(D=[P,1-R,M,1-R,M,1-I,P,1-I]),S=S.concat(D),E.push(1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1),b.push(0,0,-1,0,0,-1,0,0,-1,0,0,-1)),e&&T&&(x.push(d+f,g+_,0),x.push(v+f,g+_,0),x.push(v+f,g+u+_,0),x.push(d+f,g+u+_,0),C.push(A,A+1,A+3,A+1,A+2,A+3),A+=4,P=0,R=1-u/n,M=l/i,I=1,D=[P,R,M,R,M,I,P,I],(t===Nt.Kj.ROTATE_ROW||t===Nt.Kj.ROTATE_TILE&&a%2==0)&&(D=[1-P,1-R,1-M,1-R,1-M,1-I,1-P,1-I]),(t===Nt.Kj.FLIP_ROW||t===Nt.Kj.FLIP_TILE&&a%2==0)&&(D=[1-P,R,1-M,R,1-M,I,1-P,I]),(t===Nt.Kj.FLIP_N_ROTATE_ROW||t===Nt.Kj.FLIP_N_ROTATE_TILE&&a%2==0)&&(D=[P,1-R,M,1-R,M,1-I,P,1-I]),S=S.concat(D),E.push(1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1),b.push(0,0,-1,0,0,-1,0,0,-1,0,0,-1)),o&&h&&(x.push(m+f,p+_,0),x.push(-d+f,p+_,0),x.push(-d+f,y+_,0),x.push(m+f,y+_,0),C.push(A,A+1,A+3,A+1,A+2,A+3),A+=4,P=1-l/i,R=0,M=1,I=u/n,D=[P,R,M,R,M,I,P,I],(t===Nt.Kj.ROTATE_ROW&&c%2==1||t===Nt.Kj.ROTATE_TILE&&c%1==0)&&(D=[1-P,1-R,1-M,1-R,1-M,1-I,1-P,1-I]),(t===Nt.Kj.FLIP_ROW&&c%2==1||t===Nt.Kj.FLIP_TILE&&c%2==0)&&(D=[1-P,R,1-M,R,1-M,I,1-P,I]),(t===Nt.Kj.FLIP_N_ROTATE_ROW&&c%2==1||t===Nt.Kj.FLIP_N_ROTATE_TILE&&c%2==0)&&(D=[P,1-R,M,1-R,M,1-I,P,1-I]),S=S.concat(D),E.push(1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1),b.push(0,0,-1,0,0,-1,0,0,-1,0,0,-1)),o&&T&&(x.push(d+f,p+_,0),x.push(v+f,p+_,0),x.push(v+f,y+_,0),x.push(d+f,y+_,0),C.push(A,A+1,A+3,A+1,A+2,A+3),A+=4,P=0,R=0,M=l/i,I=u/n,D=[P,R,M,R,M,I,P,I],(t===Nt.Kj.ROTATE_ROW&&c%2==1||t===Nt.Kj.ROTATE_TILE&&(c+a)%2==1)&&(D=[1-P,1-R,1-M,1-R,1-M,1-I,1-P,1-I]),(t===Nt.Kj.FLIP_ROW&&c%2==1||t===Nt.Kj.FLIP_TILE&&(c+a)%2==1)&&(D=[1-P,R,1-M,R,1-M,I,1-P,I]),(t===Nt.Kj.FLIP_N_ROTATE_ROW&&c%2==1||t===Nt.Kj.FLIP_N_ROTATE_TILE&&(c+a)%2==1)&&(D=[P,1-R,M,1-R,M,1-I,P,1-I]),S=S.concat(D),E.push(1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1),b.push(0,0,-1,0,0,-1,0,0,-1,0,0,-1)),e){const e=[];P=0,R=1-u/n,M=1,I=1,e[0]=[P,R,M,R,M,I,P,I],e[1]=[P,R,M,R,M,I,P,I],t!==Nt.Kj.ROTATE_TILE&&t!==Nt.Kj.ROTATE_ROW||(e[1]=[1-P,1-R,1-M,1-R,1-M,1-I,1-P,1-I]),t!==Nt.Kj.FLIP_TILE&&t!==Nt.Kj.FLIP_ROW||(e[1]=[1-P,R,1-M,R,1-M,I,1-P,I]),t!==Nt.Kj.FLIP_N_ROTATE_TILE&&t!==Nt.Kj.FLIP_N_ROTATE_ROW||(e[1]=[P,1-R,M,1-R,M,1-I,P,1-I]);for(let n=0;n<a;n++)x.push(n*i-d+f,g+_,0),x.push((n+1)*i-d+f,g+_,0),x.push((n+1)*i-d+f,g+u+_,0),x.push(n*i-d+f,g+u+_,0),C.push(A,A+1,A+3,A+1,A+2,A+3),A+=4,S=t===Nt.Kj.FLIP_TILE||t===Nt.Kj.ROTATE_TILE||t===Nt.Kj.FLIP_N_ROTATE_TILE?S.concat(e[(n+1)%2]):t===Nt.Kj.FLIP_ROW||t===Nt.Kj.ROTATE_ROW||t===Nt.Kj.FLIP_N_ROTATE_ROW?S.concat(e[1]):S.concat(e[0]),E.push(1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1),b.push(0,0,-1,0,0,-1,0,0,-1,0,0,-1)}if(o){const e=[];P=0,R=0,M=1,I=u/n,e[0]=[P,R,M,R,M,I,P,I],e[1]=[P,R,M,R,M,I,P,I],t!==Nt.Kj.ROTATE_TILE&&t!==Nt.Kj.ROTATE_ROW||(e[1]=[1-P,1-R,1-M,1-R,1-M,1-I,1-P,1-I]),t!==Nt.Kj.FLIP_TILE&&t!==Nt.Kj.FLIP_ROW||(e[1]=[1-P,R,1-M,R,1-M,I,1-P,I]),t!==Nt.Kj.FLIP_N_ROTATE_TILE&&t!==Nt.Kj.FLIP_N_ROTATE_ROW||(e[1]=[P,1-R,M,1-R,M,1-I,P,1-I]);for(let n=0;n<a;n++)x.push(n*i-d+f,y-u+_,0),x.push((n+1)*i-d+f,y-u+_,0),x.push((n+1)*i-d+f,y+_,0),x.push(n*i-d+f,y+_,0),C.push(A,A+1,A+3,A+1,A+2,A+3),A+=4,S=t===Nt.Kj.FLIP_TILE||t===Nt.Kj.ROTATE_TILE||t===Nt.Kj.FLIP_N_ROTATE_TILE?S.concat(e[(n+c)%2]):t===Nt.Kj.FLIP_ROW||t===Nt.Kj.ROTATE_ROW||t===Nt.Kj.FLIP_N_ROTATE_ROW?S.concat(e[c%2]):S.concat(e[0]),E.push(1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1),b.push(0,0,-1,0,0,-1,0,0,-1,0,0,-1)}if(h){const e=[];P=1-l/i,R=0,M=1,I=1,e[0]=[P,R,M,R,M,I,P,I],e[1]=[P,R,M,R,M,I,P,I],t!==Nt.Kj.ROTATE_TILE&&t!==Nt.Kj.ROTATE_ROW||(e[1]=[1-P,1-R,1-M,1-R,1-M,1-I,1-P,1-I]),t!==Nt.Kj.FLIP_TILE&&t!==Nt.Kj.FLIP_ROW||(e[1]=[1-P,R,1-M,R,1-M,I,1-P,I]),t!==Nt.Kj.FLIP_N_ROTATE_TILE&&t!==Nt.Kj.FLIP_N_ROTATE_ROW||(e[1]=[P,1-R,M,1-R,M,1-I,P,1-I]);for(let i=0;i<c;i++)x.push(m+f,i*n-p+_,0),x.push(m+l+f,i*n-p+_,0),x.push(m+l+f,(i+1)*n-p+_,0),x.push(m+f,(i+1)*n-p+_,0),C.push(A,A+1,A+3,A+1,A+2,A+3),A+=4,S=t===Nt.Kj.FLIP_TILE||t===Nt.Kj.ROTATE_TILE||t===Nt.Kj.FLIP_N_ROTATE_TILE?S.concat(e[(i+1)%2]):t===Nt.Kj.FLIP_ROW||t===Nt.Kj.ROTATE_ROW||t===Nt.Kj.FLIP_N_ROTATE_ROW?S.concat(e[i%2]):S.concat(e[0]),E.push(1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1),b.push(0,0,-1,0,0,-1,0,0,-1,0,0,-1)}if(T){const e=[];P=0,R=0,M=l/n,I=1,e[0]=[P,R,M,R,M,I,P,I],e[1]=[P,R,M,R,M,I,P,I],t!==Nt.Kj.ROTATE_TILE&&t!==Nt.Kj.ROTATE_ROW||(e[1]=[1-P,1-R,1-M,1-R,1-M,1-I,1-P,1-I]),t!==Nt.Kj.FLIP_TILE&&t!==Nt.Kj.FLIP_ROW||(e[1]=[1-P,R,1-M,R,1-M,I,1-P,I]),t!==Nt.Kj.FLIP_N_ROTATE_TILE&&t!==Nt.Kj.FLIP_N_ROTATE_ROW||(e[1]=[P,1-R,M,1-R,M,1-I,P,1-I]);for(let i=0;i<c;i++)x.push(v-l+f,i*n-p+_,0),x.push(v+f,i*n-p+_,0),x.push(v+f,(i+1)*n-p+_,0),x.push(v-l+f,(i+1)*n-p+_,0),C.push(A,A+1,A+3,A+1,A+2,A+3),A+=4,S=t===Nt.Kj.FLIP_TILE||t===Nt.Kj.ROTATE_TILE||t===Nt.Kj.FLIP_N_ROTATE_TILE?S.concat(e[(i+a)%2]):t===Nt.Kj.FLIP_ROW||t===Nt.Kj.ROTATE_ROW||t===Nt.Kj.FLIP_N_ROTATE_ROW?S.concat(e[i%2]):S.concat(e[0]),E.push(1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1),b.push(0,0,-1,0,0,-1,0,0,-1,0,0,-1)}}const P=0===e.sideOrientation?0:e.sideOrientation||sn.x.DEFAULTSIDE;sn.x._ComputeSides(P,x,C,b,S,e.frontUVs,e.backUVs);const R=new sn.x;R.indices=C,R.positions=x,R.normals=b,R.uvs=S;const M=P===sn.x.DOUBLESIDE?E.concat(E):E;return R.colors=M,R}function Wp(e,t,i=null){const n=new Nt.Kj(e,i);return t.sideOrientation=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),n._originalBuilderSideOrientation=t.sideOrientation,zp(t).applyToMesh(n,t.updatable),n}const Hp={CreateTiledPlane:Wp};function Xp(e){const t=e.faceUV||new Array(6),i=e.faceColors,n=e.pattern||Nt.Kj.NO_FLIP,s=e.width||e.size||1,r=e.height||e.size||1,l=e.depth||e.size||1,h=e.tileWidth||e.tileSize||1,c=e.tileHeight||e.tileSize||1,u=e.alignHorizontal||0,d=e.alignVertical||0,p=0===e.sideOrientation?0:e.sideOrientation||sn.x.DEFAULTSIDE;for(let e=0;e<6;e++)void 0===t[e]&&(t[e]=new o.Lt(0,0,1,1)),i&&void 0===i[e]&&(i[e]=new a.HE(1,1,1,1));const f=s/2,_=r/2,m=l/2,g=[];for(let e=0;e<2;e++)g[e]=zp({pattern:n,tileWidth:h,tileHeight:c,width:s,height:r,alignVertical:d,alignHorizontal:u,sideOrientation:p});for(let e=2;e<4;e++)g[e]=zp({pattern:n,tileWidth:h,tileHeight:c,width:l,height:r,alignVertical:d,alignHorizontal:u,sideOrientation:p});let v=d;d===Nt.Kj.BOTTOM?v=Nt.Kj.TOP:d===Nt.Kj.TOP&&(v=Nt.Kj.BOTTOM);for(let e=4;e<6;e++)g[e]=zp({pattern:n,tileWidth:h,tileHeight:c,width:s,height:l,alignVertical:v,alignHorizontal:u,sideOrientation:p});let y=[],x=[],b=[],T=[];const S=[],E=[],C=[],A=[];let P=0,R=0;for(let e=0;e<6;e++){const n=g[e].positions.length;E[e]=[],C[e]=[];for(let t=0;t<n/3;t++)E[e].push(new o.P(g[e].positions[3*t],g[e].positions[3*t+1],g[e].positions[3*t+2])),C[e].push(new o.P(g[e].normals[3*t],g[e].normals[3*t+1],g[e].normals[3*t+2]));P=g[e].uvs.length,A[e]=[];for(let i=0;i<P;i+=2)A[e][i]=t[e].x+(t[e].z-t[e].x)*g[e].uvs[i],A[e][i+1]=t[e].y+(t[e].w-t[e].y)*g[e].uvs[i+1],rn.e.UseOpenGLOrientationForUV&&(A[e][i+1]=1-A[e][i+1]);if(b=b.concat(A[e]),T=T.concat(g[e].indices.map((e=>e+R))),R+=E[e].length,i)for(let t=0;t<4;t++)S.push(i[e].r,i[e].g,i[e].b,i[e].a)}const M=new o.P(0,0,m),I=o.y3.RotationY(Math.PI);y=E[0].map((e=>o.P.TransformNormal(e,I).add(M))).map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[]),x=C[0].map((e=>o.P.TransformNormal(e,I))).map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[]),y=y.concat(E[1].map((e=>e.subtract(M))).map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[])),x=x.concat(C[1].map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[]));const D=new o.P(f,0,0),O=o.y3.RotationY(-Math.PI/2);y=y.concat(E[2].map((e=>o.P.TransformNormal(e,O).add(D))).map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[])),x=x.concat(C[2].map((e=>o.P.TransformNormal(e,O))).map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[]));const w=o.y3.RotationY(Math.PI/2);y=y.concat(E[3].map((e=>o.P.TransformNormal(e,w).subtract(D))).map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[])),x=x.concat(C[3].map((e=>o.P.TransformNormal(e,w))).map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[]));const N=new o.P(0,_,0),F=o.y3.RotationX(Math.PI/2);y=y.concat(E[4].map((e=>o.P.TransformNormal(e,F).add(N))).map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[])),x=x.concat(C[4].map((e=>o.P.TransformNormal(e,F))).map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[]));const L=o.y3.RotationX(-Math.PI/2);y=y.concat(E[5].map((e=>o.P.TransformNormal(e,L).subtract(N))).map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[])),x=x.concat(C[5].map((e=>o.P.TransformNormal(e,L))).map((e=>[e.x,e.y,e.z])).reduce(((e,t)=>e.concat(t)),[])),sn.x._ComputeSides(p,y,T,x,b);const B=new sn.x;if(B.indices=T,B.positions=y,B.normals=x,B.uvs=b,i){const e=p===sn.x.DOUBLESIDE?S.concat(S):S;B.colors=e}return B}function jp(e,t,i=null){const n=new Nt.Kj(e,i);return t.sideOrientation=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),n._originalBuilderSideOrientation=t.sideOrientation,Xp(t).applyToMesh(n,t.updatable),n}sn.x.CreateTiledPlane=zp;const Yp={CreateTiledBox:jp};function qp(e){const t=new Array,i=new Array,n=new Array,s=new Array,r=e.radius||2,a=e.tube||.5,l=e.radialSegments||32,h=e.tubularSegments||32,c=e.p||2,u=e.q||3,d=0===e.sideOrientation?0:e.sideOrientation||sn.x.DEFAULTSIDE,p=e=>{const t=Math.cos(e),i=Math.sin(e),n=u/c*e,s=Math.cos(n),a=r*(2+s)*.5*t,l=r*(2+s)*i*.5,h=r*Math.sin(n)*.5;return new o.P(a,l,h)};let f,_;for(f=0;f<=l;f++){const e=f%l/l*2*c*Math.PI,t=p(e),n=p(e+.01),r=n.subtract(t);let u=n.add(t);const d=o.P.Cross(r,u);for(u=o.P.Cross(d,r),d.normalize(),u.normalize(),_=0;_<h;_++){const e=_%h/h*2*Math.PI,n=-a*Math.cos(e),r=a*Math.sin(e);i.push(t.x+n*u.x+r*d.x),i.push(t.y+n*u.y+r*d.y),i.push(t.z+n*u.z+r*d.z),s.push(f/l),s.push(rn.e.UseOpenGLOrientationForUV?1-_/h:_/h)}}for(f=0;f<l;f++)for(_=0;_<h;_++){const e=(_+1)%h,i=f*h+_,n=(f+1)*h+_,s=(f+1)*h+e,r=f*h+e;t.push(r),t.push(n),t.push(i),t.push(r),t.push(s),t.push(n)}sn.x.ComputeNormals(i,t,n),sn.x._ComputeSides(d,i,t,n,s,e.frontUVs,e.backUVs);const m=new sn.x;return m.indices=t,m.positions=i,m.normals=n,m.uvs=s,m}function Kp(e,t={},i){const n=new Nt.Kj(e,i);return t.sideOrientation=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),n._originalBuilderSideOrientation=t.sideOrientation,qp(t).applyToMesh(n,t.updatable),n}sn.x.CreateTiledBox=Xp;const $p={CreateTorusKnot:Kp};sn.x.CreateTorusKnot=qp,Nt.Kj.CreateTorusKnot=(e,t,i,n,s,r,o,a,l,h)=>Kp(e,{radius:t,tube:i,radialSegments:n,tubularSegments:s,p:r,q:o,sideOrientation:h,updatable:l},a);class Qp extends o.FM{constructor(e,t){super(e.x,e.y),this.index=t}}class Zp{constructor(){this.elements=new Array}add(e){const t=new Array;return e.forEach((e=>{const i=new Qp(e,this.elements.length);t.push(i),this.elements.push(i)})),t}computeBounds(){const e=new o.FM(this.elements[0].x,this.elements[0].y),t=new o.FM(this.elements[0].x,this.elements[0].y);return this.elements.forEach((i=>{i.x<e.x?e.x=i.x:i.x>t.x&&(t.x=i.x),i.y<e.y?e.y=i.y:i.y>t.y&&(t.y=i.y)})),{min:e,max:t,width:t.x-e.x,height:t.y-e.y}}}class Jp{static Rectangle(e,t,i,n){return[new o.FM(e,t),new o.FM(i,t),new o.FM(i,n),new o.FM(e,n)]}static Circle(e,t=0,i=0,n=32){const s=new Array;let r=0;const a=2*Math.PI/n;for(let l=0;l<n;l++)s.push(new o.FM(t+Math.cos(r)*e,i+Math.sin(r)*e)),r-=a;return s}static Parse(e){const t=e.split(/[^-+eE.\d]+/).map(parseFloat).filter((e=>!isNaN(e)));let i;const n=[];for(i=0;i<(2147483646&t.length);i+=2)n.push(new o.FM(t[i],t[i+1]));return n}static StartingAt(e,t){return X.ZZ.StartingAt(e,t)}}class ef{_addToepoint(e){for(const t of e)this._epoints.push(t.x,t.y)}constructor(e,t,i,n=earcut){let s;this._points=new Zp,this._outlinepoints=new Zp,this._holes=new Array,this._epoints=new Array,this._eholes=new Array,this.bjsEarcut=n,this._name=e,this._scene=i||A.l.LastCreatedScene,s=t instanceof X.ZZ?t.getPoints():t,this._addToepoint(s),this._points.add(s),this._outlinepoints.add(s),void 0===this.bjsEarcut&&_.Y.Warn("Earcut was not found, the polygon will not be built.")}addHole(e){this._points.add(e);const t=new Zp;return t.add(e),this._holes.push(t),this._eholes.push(this._epoints.length/2),this._addToepoint(e),this}build(e=!1,t=0,i=2){const n=new Nt.Kj(this._name,this._scene),s=this.buildVertexData(t,i);return n.setVerticesData(qe.o.PositionKind,s.positions,e),n.setVerticesData(qe.o.NormalKind,s.normals,e),n.setVerticesData(qe.o.UVKind,s.uvs,e),n.setIndices(s.indices),n}buildVertexData(e=0,t=2){const i=new sn.x,n=new Array,s=new Array,r=new Array,o=this._points.computeBounds();this._points.elements.forEach((e=>{n.push(0,1,0),s.push(e.x,0,e.y),r.push((e.x-o.min.x)/o.width,(e.y-o.min.y)/o.height)}));const a=new Array,l=this.bjsEarcut(this._epoints,this._eholes,2);for(let e=0;e<l.length;e++)a.push(l[e]);if(e>0){const i=s.length/3;this._points.elements.forEach((t=>{n.push(0,-1,0),s.push(t.x,-e,t.y),r.push(1-(t.x-o.min.x)/o.width,1-(t.y-o.min.y)/o.height)}));const l=a.length;for(let e=0;e<l;e+=3){const t=a[e+0],n=a[e+1],s=a[e+2];a.push(s+i),a.push(n+i),a.push(t+i)}this._addSide(s,n,r,a,o,this._outlinepoints,e,!1,t),this._holes.forEach((i=>{this._addSide(s,n,r,a,o,i,e,!0,t)}))}return i.indices=a,i.positions=s,i.normals=n,i.uvs=r,i}_addSide(e,t,i,n,s,r,a,l,h){let c=e.length/3,u=0;for(let d=0;d<r.elements.length;d++){const p=r.elements[d],f=r.elements[(d+1)%r.elements.length];e.push(p.x,0,p.y),e.push(p.x,-a,p.y),e.push(f.x,0,f.y),e.push(f.x,-a,f.y);const _=r.elements[(d+r.elements.length-1)%r.elements.length],m=r.elements[(d+2)%r.elements.length];let g=new o.P(-(f.y-p.y),0,f.x-p.x),v=new o.P(-(p.y-_.y),0,p.x-_.x),y=new o.P(-(m.y-f.y),0,m.x-f.x);l||(g=g.scale(-1),v=v.scale(-1),y=y.scale(-1));const x=g.normalizeToNew();let b=v.normalizeToNew(),T=y.normalizeToNew();const S=o.P.Dot(b,x);b=S>h?S<Me.kn-1?new o.P(p.x,0,p.y).subtract(new o.P(f.x,0,f.y)).normalize():v.add(g).normalize():x;const E=o.P.Dot(y,g);T=E>h?E<Me.kn-1?new o.P(f.x,0,f.y).subtract(new o.P(p.x,0,p.y)).normalize():y.add(g).normalize():x,i.push(u/s.width,0),i.push(u/s.width,1),u+=g.length(),i.push(u/s.width,0),i.push(u/s.width,1),t.push(b.x,b.y,b.z),t.push(b.x,b.y,b.z),t.push(T.x,T.y,T.z),t.push(T.x,T.y,T.z),l?(n.push(c),n.push(c+2),n.push(c+1),n.push(c+1),n.push(c+2),n.push(c+3)):(n.push(c),n.push(c+1),n.push(c+2),n.push(c+1),n.push(c+3),n.push(c+2)),c+=4}}}function tf(e,t,i,n,s,r,l){const h=i||new Array(3),c=n,u=[],d=l||!1;for(let e=0;e<3;e++)void 0===h[e]&&(h[e]=new o.Lt(0,0,1,1)),c&&void 0===c[e]&&(c[e]=new a.HE(1,1,1,1));const p=e.getVerticesData(qe.o.PositionKind),f=e.getVerticesData(qe.o.NormalKind),_=e.getVerticesData(qe.o.UVKind),m=e.getIndices(),g=p.length/9;let v=0,y=0,x=0,b=0,T=0;const S=[0];if(d)for(let e=g;e<p.length/3;e+=4)y=p[3*(e+2)]-p[3*e],x=p[3*(e+2)+2]-p[3*e+2],b=Math.sqrt(y*y+x*x),T+=b,S.push(T);let E=0,C=0;for(let e=0;e<f.length;e+=3)Math.abs(f[e+1])<.001&&(C=1),Math.abs(f[e+1]-1)<.001&&(C=0),Math.abs(f[e+1]+1)<.001&&(C=2),E=e/3,1===C?(v=E-g,_[2*E]=v%4<1.5?d?h[C].x+(h[C].z-h[C].x)*S[Math.floor(v/4)]/T:h[C].x:d?h[C].x+(h[C].z-h[C].x)*S[Math.floor(v/4)+1]/T:h[C].z,_[2*E+1]=v%2==0?rn.e.UseOpenGLOrientationForUV?1-h[C].w:h[C].w:rn.e.UseOpenGLOrientationForUV?1-h[C].y:h[C].y):(_[2*E]=(1-_[2*E])*h[C].x+_[2*E]*h[C].z,_[2*E+1]=(1-_[2*E+1])*h[C].y+_[2*E+1]*h[C].w,rn.e.UseOpenGLOrientationForUV&&(_[2*E+1]=1-_[2*E+1])),c&&u.push(c[C].r,c[C].g,c[C].b,c[C].a);sn.x._ComputeSides(t,p,m,f,_,s,r);const A=new sn.x;if(A.indices=m,A.positions=p,A.normals=f,A.uvs=_,c){const e=t===sn.x.DOUBLESIDE?u.concat(u):u;A.colors=e}return A}function nf(e,t,i=null,n=earcut){t.sideOrientation=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation);const s=t.shape,r=t.holes||[],a=t.depth||0,l=t.smoothingThreshold||2,h=[];let c=[];for(let e=0;e<s.length;e++)h[e]=new o.FM(s[e].x,s[e].z);h[0].equalsWithEpsilon(h[h.length-1],1e-8)&&h.pop();const u=new ef(e,h,i||A.l.LastCreatedScene,n);for(let e=0;e<r.length;e++){c=[];for(let t=0;t<r[e].length;t++)c.push(new o.FM(r[e][t].x,r[e][t].z));u.addHole(c)}const d=u.build(!1,a,l);return d._originalBuilderSideOrientation=t.sideOrientation,tf(d,t.sideOrientation,t.faceUV,t.faceColors,t.frontUVs,t.backUVs,t.wrap).applyToMesh(d,t.updatable),d}function sf(e,t,i=null,n=earcut){return nf(e,t,i,n)}const rf={ExtrudePolygon:sf,CreatePolygon:nf};function of(e,t,i=null){const n=t.arc?t.arc<=0||t.arc>1?1:t.arc:1,s=void 0===t.closed||t.closed,r=t.shape,a=t.radius||1,l=t.tessellation||64,h=t.clip||0,c=t.updatable,u=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),d=t.cap||Nt.Kj.NO_CAP,p=2*Math.PI,f=new Array,_=t.invertUV||!1;let m=0,g=0;const v=p/l*n;let y,x;for(m=0;m<=l-h;m++){for(x=[],d!=Nt.Kj.CAP_START&&d!=Nt.Kj.CAP_ALL||(x.push(new o.P(0,r[0].y,0)),x.push(new o.P(Math.cos(m*v)*r[0].x*a,r[0].y,Math.sin(m*v)*r[0].x*a))),g=0;g<r.length;g++)y=new o.P(Math.cos(m*v)*r[g].x*a,r[g].y,Math.sin(m*v)*r[g].x*a),x.push(y);d!=Nt.Kj.CAP_END&&d!=Nt.Kj.CAP_ALL||(x.push(new o.P(Math.cos(m*v)*r[r.length-1].x*a,r[r.length-1].y,Math.sin(m*v)*r[r.length-1].x*a)),x.push(new o.P(0,r[r.length-1].y,0))),f.push(x)}return fs(e,{pathArray:f,closeArray:s,sideOrientation:u,updatable:c,invertUV:_,frontUVs:t.frontUVs,backUVs:t.backUVs},i)}sn.x.CreatePolygon=tf,Nt.Kj.CreatePolygon=(e,t,i,n,s,r,o=earcut)=>nf(e,{shape:t,holes:n,updatable:s,sideOrientation:r},i,o),Nt.Kj.ExtrudePolygon=(e,t,i,n,s,r,o,a=earcut)=>sf(e,{shape:t,holes:s,depth:i,updatable:r,sideOrientation:o},n,a);const af={CreateLathe:of};function lf(e,t,i=null){const n=t.path;let s=t.instance,r=1;void 0!==t.radius?r=t.radius:s&&(r=s._creationDataStorage.radius);const a=t.tessellation||64,l=t.radiusFunction||null;let h=t.cap||Nt.Kj.NO_CAP;const c=t.invertUV||!1,u=t.updatable,d=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation);t.arc=t.arc&&(t.arc<=0||t.arc>1)?1:t.arc||1;const p=(e,t,i,n,s,r,a,l)=>{const h=t.getTangents(),c=t.getNormals(),u=t.getDistances(),d=2*Math.PI/s*l,p=r||(()=>n);let f,_,m,g;const v=o.jp.Matrix[0];let y=a===Nt.Kj.NO_CAP||a===Nt.Kj.CAP_END?0:2;for(let t=0;t<e.length;t++){_=p(t,u[t]),f=Array(),m=c[t];for(let i=0;i<s;i++)o.y3.RotationAxisToRef(h[t],d*i,v),g=f[i]?f[i]:o.P.Zero(),o.P.TransformCoordinatesToRef(m,v,g),g.scaleInPlace(_).addInPlace(e[t]),f[i]=g;i[y]=f,y++}const x=(t,i)=>{const n=Array();for(let s=0;s<t;s++)n.push(e[i]);return n};switch(a){case Nt.Kj.NO_CAP:break;case Nt.Kj.CAP_START:i[0]=x(s,0),i[1]=i[2].slice(0);break;case Nt.Kj.CAP_END:i[y]=i[y-1].slice(0),i[y+1]=x(s,e.length-1);break;case Nt.Kj.CAP_ALL:i[0]=x(s,0),i[1]=i[2].slice(0),i[y]=i[y-1].slice(0),i[y+1]=x(s,e.length-1)}return i};let f,_;if(s){const e=s._creationDataStorage,i=t.arc||e.arc;return f=e.path3D.update(n),_=p(n,f,e.pathArray,r,e.tessellation,l,e.cap,i),s=fs("",{pathArray:_,instance:s}),e.path3D=f,e.pathArray=_,e.arc=i,e.radius=r,s}f=new X.$B(n),h=h<0||h>3?0:h,_=p(n,f,new Array,r,a,l,h,t.arc);const m=fs(e,{pathArray:_,closePath:!0,closeArray:!1,updatable:u,sideOrientation:d,invertUV:c,frontUVs:t.frontUVs,backUVs:t.backUVs},i);return m._creationDataStorage.pathArray=_,m._creationDataStorage.path3D=f,m._creationDataStorage.tessellation=a,m._creationDataStorage.cap=h,m._creationDataStorage.arc=t.arc,m._creationDataStorage.radius=r,m}Nt.Kj.CreateLathe=(e,t,i,n,s,r,o)=>of(e,{shape:t,radius:i,tessellation:n,sideOrientation:o,updatable:r},s);const hf={CreateTube:lf};Nt.Kj.CreateTube=(e,t,i,n,s,r,o,a,l,h)=>lf(e,{path:t,radius:i,tessellation:n,radiusFunction:s,arc:1,cap:r,updatable:a,sideOrientation:l,instance:h},o);var cf=i(6272);const uf=new o.P(1,0,0),df=new o.P(-1,0,0),pf=new o.P(0,1,0),ff=new o.P(0,-1,0),_f=new o.P(0,0,1),mf=new o.P(0,0,-1);class gf{constructor(e=o.P.Zero(),t=o.P.Up(),i=o.FM.Zero(),n=0,s=0,r=null,a=null,l=null,h=null){this.position=e,this.normal=t,this.uv=i,this.vertexIdx=n,this.vertexIdxForBones=s,this.localPositionOverride=r,this.localNormalOverride=a,this.matrixIndicesOverride=l,this.matrixWeightsOverride=h}clone(){var e,t,i,n;return new gf(this.position.clone(),this.normal.clone(),this.uv.clone(),this.vertexIdx,this.vertexIdxForBones,null===(e=this.localPositionOverride)||void 0===e?void 0:e.slice(),null===(t=this.localNormalOverride)||void 0===t?void 0:t.slice(),null===(i=this.matrixIndicesOverride)||void 0===i?void 0:i.slice(),null===(n=this.matrixWeightsOverride)||void 0===n?void 0:n.slice())}}function vf(e,t,i){const n=!!t.skeleton,s=i.localMode||n,r=null!==t.overrideMaterialSideOrientation&&void 0!==t.overrideMaterialSideOrientation,a=t.getIndices(),l=n?t.getPositionData(!0,!0):t.getVerticesData(qe.o.PositionKind),h=n?t.getNormalsData(!0,!0):t.getVerticesData(qe.o.NormalKind),c=s?n?t.getVerticesData(qe.o.PositionKind):l:null,u=s?n?t.getVerticesData(qe.o.NormalKind):h:null,d=t.getVerticesData(qe.o.UVKind),p=n?t.getVerticesData(qe.o.MatricesIndicesKind):null,f=n?t.getVerticesData(qe.o.MatricesWeightsKind):null,_=n?t.getVerticesData(qe.o.MatricesIndicesExtraKind):null,m=n?t.getVerticesData(qe.o.MatricesWeightsExtraKind):null,g=i.position||o.P.Zero();let v=i.normal||o.P.Up();const y=i.size||o.P.One(),x=i.angle||0;if(!v){const e=new o.P(0,0,1),i=t.getScene().activeCamera,n=o.P.TransformCoordinates(e,i.getWorldMatrix());v=i.globalPosition.subtract(n)}const b=-Math.atan2(v.z,v.x)-Math.PI/2,T=Math.sqrt(v.x*v.x+v.z*v.z),S=Math.atan2(v.y,T),E=o.y3.RotationYawPitchRoll(b,S,x).multiply(o.y3.Translation(g.x,g.y,g.z)),C=o.y3.Invert(E),A=t.getWorldMatrix().multiply(C),P=new sn.x;P.indices=[],P.positions=[],P.normals=[],P.uvs=[],P.matricesIndices=n?[]:null,P.matricesWeights=n?[]:null,P.matricesIndicesExtra=_?[]:null,P.matricesWeightsExtra=m?[]:null;let R=0;const M=e=>{const t=new gf;if(!a||!l||!h)return t;const n=a[e];if(t.vertexIdx=3*n,t.vertexIdxForBones=4*n,t.position=new o.P(l[3*n],l[3*n+1],l[3*n+2]),o.P.TransformCoordinatesToRef(t.position,A,t.position),t.normal=new o.P(h[3*n],h[3*n+1],h[3*n+2]),o.P.TransformNormalToRef(t.normal,A,t.normal),i.captureUVS&&d){const e=d[2*n+1];t.uv=new o.FM(d[2*n],rn.e.UseOpenGLOrientationForUV?1-e:e)}return t},I=[0,0,0,0],D=(e,t)=>{if(0===e.length)return e;const i=.5*Math.abs(o.P.Dot(y,t)),n=(e,t,i,n)=>{for(let s=0;s<n;++s)if(e[i+s]===t)return i+s;return-1},s=(e,s)=>{var r,a,l,h,d,_,m,g,v,y,x,b,T,S,E,C;const A=o.P.GetClipFactor(e.position,s.position,t,i);let P=I,R=I;if(p&&f){const t=e.matrixIndicesOverride?0:e.vertexIdxForBones,i=null!==(r=e.matrixIndicesOverride)&&void 0!==r?r:p,o=null!==(a=e.matrixWeightsOverride)&&void 0!==a?a:f,c=s.matrixIndicesOverride?0:s.vertexIdxForBones,u=null!==(l=s.matrixIndicesOverride)&&void 0!==l?l:p,d=null!==(h=s.matrixWeightsOverride)&&void 0!==h?h:f;P=[0,0,0,0],R=[0,0,0,0];let _=0;for(let e=0;e<4;++e)if(o[t+e]>0){const s=n(u,i[t+e],c,4);P[_]=i[t+e],R[_]=lt.R.Lerp(o[t+e],s>=0?d[s]:0,A),_++}for(let e=0;e<4&&_<4;++e){const s=u[c+e];-1===n(i,s,t,4)&&(P[_]=s,R[_]=lt.R.Lerp(0,d[c+e],A),_++)}const m=R[0]+R[1]+R[2]+R[3];R[0]/=m,R[1]/=m,R[2]/=m,R[3]/=m}const M=e.localPositionOverride?e.localPositionOverride[0]:null!==(d=null==c?void 0:c[e.vertexIdx])&&void 0!==d?d:0,D=e.localPositionOverride?e.localPositionOverride[1]:null!==(_=null==c?void 0:c[e.vertexIdx+1])&&void 0!==_?_:0,O=e.localPositionOverride?e.localPositionOverride[2]:null!==(m=null==c?void 0:c[e.vertexIdx+2])&&void 0!==m?m:0,w=s.localPositionOverride?s.localPositionOverride[0]:null!==(g=null==c?void 0:c[s.vertexIdx])&&void 0!==g?g:0,N=s.localPositionOverride?s.localPositionOverride[1]:null!==(v=null==c?void 0:c[s.vertexIdx+1])&&void 0!==v?v:0,F=s.localPositionOverride?s.localPositionOverride[2]:null!==(y=null==c?void 0:c[s.vertexIdx+2])&&void 0!==y?y:0,L=e.localNormalOverride?e.localNormalOverride[0]:null!==(x=null==u?void 0:u[e.vertexIdx])&&void 0!==x?x:0,B=e.localNormalOverride?e.localNormalOverride[1]:null!==(b=null==u?void 0:u[e.vertexIdx+1])&&void 0!==b?b:0,U=e.localNormalOverride?e.localNormalOverride[2]:null!==(T=null==u?void 0:u[e.vertexIdx+2])&&void 0!==T?T:0,V=L+((s.localNormalOverride?s.localNormalOverride[0]:null!==(S=null==u?void 0:u[s.vertexIdx])&&void 0!==S?S:0)-L)*A,k=B+((s.localNormalOverride?s.localNormalOverride[1]:null!==(E=null==u?void 0:u[s.vertexIdx+1])&&void 0!==E?E:0)-B)*A,G=U+((s.localNormalOverride?s.localNormalOverride[2]:null!==(C=null==u?void 0:u[s.vertexIdx+2])&&void 0!==C?C:0)-U)*A,z=Math.sqrt(V*V+k*k+G*G);return new gf(o.P.Lerp(e.position,s.position,A),o.P.Lerp(e.normal,s.normal,A).normalize(),o.FM.Lerp(e.uv,s.uv,A),-1,-1,c?[M+(w-M)*A,D+(N-D)*A,O+(F-O)*A]:null,u?[V/z,k/z,G/z]:null,P,R)};let r=null;e.length>3&&(r=new Array);for(let n=0;n<e.length;n+=3){let a=0,l=null,h=null,c=null,u=null;const d=o.P.Dot(e[n].position,t)-i>0,p=o.P.Dot(e[n+1].position,t)-i>0,f=o.P.Dot(e[n+2].position,t)-i>0;switch(a=(d?1:0)+(p?1:0)+(f?1:0),a){case 0:e.length>3?(r.push(e[n]),r.push(e[n+1]),r.push(e[n+2])):r=e;break;case 1:if(r=null!=r?r:new Array,d&&(l=e[n+1],h=e[n+2],c=s(e[n],l),u=s(e[n],h)),p){l=e[n],h=e[n+2],c=s(e[n+1],l),u=s(e[n+1],h),r.push(c),r.push(h.clone()),r.push(l.clone()),r.push(h.clone()),r.push(c.clone()),r.push(u);break}f&&(l=e[n],h=e[n+1],c=s(e[n+2],l),u=s(e[n+2],h)),l&&h&&c&&u&&(r.push(l.clone()),r.push(h.clone()),r.push(c),r.push(u),r.push(c.clone()),r.push(h.clone()));break;case 2:r=null!=r?r:new Array,d||(l=e[n].clone(),h=s(l,e[n+1]),c=s(l,e[n+2]),r.push(l),r.push(h),r.push(c)),p||(l=e[n+1].clone(),h=s(l,e[n+2]),c=s(l,e[n]),r.push(l),r.push(h),r.push(c)),f||(l=e[n+2].clone(),h=s(l,e[n]),c=s(l,e[n+1]),r.push(l),r.push(h),r.push(c))}}return r},O=new Array(3);for(let e=0;e<a.length;e+=3){let t=O;if(t[0]=M(e),r&&s?(t[1]=M(e+2),t[2]=M(e+1)):(t[1]=M(e+1),t[2]=M(e+2)),!(i.cullBackFaces&&-t[0].normal.z<=0&&-t[1].normal.z<=0&&-t[2].normal.z<=0)&&(t=D(t,uf),t&&(t=D(t,df),t&&(t=D(t,pf),t&&(t=D(t,ff),t&&(t=D(t,_f),t&&(t=D(t,mf),t)))))))for(let e=0;e<t.length;e++){const n=t[e];if(P.indices.push(R),s?(n.localPositionOverride?(P.positions[3*R]=n.localPositionOverride[0],P.positions[3*R+1]=n.localPositionOverride[1],P.positions[3*R+2]=n.localPositionOverride[2]):c&&(P.positions[3*R]=c[n.vertexIdx],P.positions[3*R+1]=c[n.vertexIdx+1],P.positions[3*R+2]=c[n.vertexIdx+2]),n.localNormalOverride?(P.normals[3*R]=n.localNormalOverride[0],P.normals[3*R+1]=n.localNormalOverride[1],P.normals[3*R+2]=n.localNormalOverride[2]):u&&(P.normals[3*R]=u[n.vertexIdx],P.normals[3*R+1]=u[n.vertexIdx+1],P.normals[3*R+2]=u[n.vertexIdx+2])):(n.position.toArray(P.positions,3*R),n.normal.toArray(P.normals,3*R)),P.matricesIndices&&P.matricesWeights&&(n.matrixIndicesOverride?(P.matricesIndices[4*R]=n.matrixIndicesOverride[0],P.matricesIndices[4*R+1]=n.matrixIndicesOverride[1],P.matricesIndices[4*R+2]=n.matrixIndicesOverride[2],P.matricesIndices[4*R+3]=n.matrixIndicesOverride[3]):(p&&(P.matricesIndices[4*R]=p[n.vertexIdxForBones],P.matricesIndices[4*R+1]=p[n.vertexIdxForBones+1],P.matricesIndices[4*R+2]=p[n.vertexIdxForBones+2],P.matricesIndices[4*R+3]=p[n.vertexIdxForBones+3]),_&&P.matricesIndicesExtra&&(P.matricesIndicesExtra[4*R]=_[n.vertexIdxForBones],P.matricesIndicesExtra[4*R+1]=_[n.vertexIdxForBones+1],P.matricesIndicesExtra[4*R+2]=_[n.vertexIdxForBones+2],P.matricesIndicesExtra[4*R+3]=_[n.vertexIdxForBones+3])),n.matrixWeightsOverride?(P.matricesWeights[4*R]=n.matrixWeightsOverride[0],P.matricesWeights[4*R+1]=n.matrixWeightsOverride[1],P.matricesWeights[4*R+2]=n.matrixWeightsOverride[2],P.matricesWeights[4*R+3]=n.matrixWeightsOverride[3]):(f&&(P.matricesWeights[4*R]=f[n.vertexIdxForBones],P.matricesWeights[4*R+1]=f[n.vertexIdxForBones+1],P.matricesWeights[4*R+2]=f[n.vertexIdxForBones+2],P.matricesWeights[4*R+3]=f[n.vertexIdxForBones+3]),m&&P.matricesWeightsExtra&&(P.matricesWeightsExtra[4*R]=m[n.vertexIdxForBones],P.matricesWeightsExtra[4*R+1]=m[n.vertexIdxForBones+1],P.matricesWeightsExtra[4*R+2]=m[n.vertexIdxForBones+2],P.matricesWeightsExtra[4*R+3]=m[n.vertexIdxForBones+3]))),i.captureUVS)n.uv.toArray(P.uvs,2*R);else{P.uvs.push(.5+n.position.x/y.x);const e=.5+n.position.y/y.y;P.uvs.push(rn.e.UseOpenGLOrientationForUV?1-e:e)}R++}}const w=new Nt.Kj(e,t.getScene());return P.applyToMesh(w),s?(w.skeleton=t.skeleton,w.parent=t):(w.position=g.clone(),w.rotation=new o.P(S,b,x)),w.computeWorldMatrix(!0),w.refreshBoundingInfo(!0,!0),w}const yf={CreateDecal:vf};Nt.Kj.CreateDecal=(e,t,i,n,s,r)=>vf(e,t,{position:i,normal:n,size:s,angle:r});class xf{constructor(e=0,t=0){this.x=e,this.y=t,e!==Math.floor(e)&&(Math.floor(e),_.Y.Warn("x is not an integer, floor(x) used")),t!==Math.floor(t)&&(Math.floor(t),_.Y.Warn("y is not an integer, floor(y) used"))}clone(){return new xf(this.x,this.y)}rotate60About(e){const t=this.x;return this.x=e.x+e.y-this.y,this.y=t+this.y-e.x,this}rotateNeg60About(e){const t=this.x;return this.x=t+this.y-e.y,this.y=e.x+e.y-t,this}rotate120(e,t){e!==Math.floor(e)&&(Math.floor(e),_.Y.Warn("m not an integer only floor(m) used")),t!==Math.floor(t)&&(Math.floor(t),_.Y.Warn("n not an integer only floor(n) used"));const i=this.x;return this.x=e-i-this.y,this.y=t+i,this}rotateNeg120(e,t){e!==Math.floor(e)&&(Math.floor(e),_.Y.Warn("m is not an integer, floor(m) used")),t!==Math.floor(t)&&(Math.floor(t),_.Y.Warn("n is not an integer,   floor(n) used"));const i=this.x;return this.x=this.y-t,this.y=e+t-i-this.y,this}toCartesianOrigin(e,t){const i=o.P.Zero();return i.x=e.x+2*this.x*t+this.y*t,i.y=e.y+Math.sqrt(3)*this.y*t,i}static Zero(){return new xf(0,0)}}class bf{constructor(){this.cartesian=[],this.vertices=[],this.max=[],this.min=[],this.closestTo=[],this.innerFacets=[],this.isoVecsABOB=[],this.isoVecsOBOA=[],this.isoVecsBAOA=[],this.vertexTypes=[],this.IDATA=new Tf("icosahedron","Regular",[[0,Me.Q_,-1],[-Me.Q_,1,0],[-1,0,-Me.Q_],[1,0,-Me.Q_],[Me.Q_,1,0],[0,Me.Q_,1],[-1,0,Me.Q_],[-Me.Q_,-1,0],[0,-Me.Q_,-1],[Me.Q_,-1,0],[1,0,Me.Q_],[0,-Me.Q_,1]],[[0,2,1],[0,3,2],[0,4,3],[0,5,4],[0,1,5],[7,6,1],[8,7,2],[9,8,3],[10,9,4],[6,10,5],[2,7,1],[3,8,2],[4,9,3],[5,10,4],[1,6,5],[11,6,7],[11,7,8],[11,8,9],[11,9,10],[11,10,6]])}setIndices(){let e=12;const t={},i=this.m,n=this.n;let s,r,o,a,l,h=i,c=1,u=0;0!==n&&(h=lt.R.HCF(i,n)),c=i/h,u=n/h;const d=xf.Zero(),p=new xf(i,n),f=new xf(-n,i+n),_=xf.Zero(),m=xf.Zero(),g=xf.Zero();let v,y,x,b,T=[];const S=[],E=this.vertByDist,C=(i,n,s,r)=>{v=i+"|"+s,y=n+"|"+r,v in t||y in t?v in t&&!(y in t)?t[y]=t[v]:y in t&&!(v in t)&&(t[v]=t[y]):(t[v]=e,t[y]=e,e++),E[s][0]>2?S[t[v]]=[-E[s][0],E[s][1],t[v]]:S[t[v]]=[T[E[s][0]],E[s][1],t[v]]};this.IDATA.edgematch=[[1,"B"],[2,"B"],[3,"B"],[4,"B"],[0,"B"],[10,"O",14,"A"],[11,"O",10,"A"],[12,"O",11,"A"],[13,"O",12,"A"],[14,"O",13,"A"],[0,"O"],[1,"O"],[2,"O"],[3,"O"],[4,"O"],[19,"B",5,"A"],[15,"B",6,"A"],[16,"B",7,"A"],[17,"B",8,"A"],[18,"B",9,"A"]];for(let y=0;y<20;y++){if(T=this.IDATA.face[y],o=T[2],a=T[1],l=T[0],x=d.x+"|"+d.y,v=y+"|"+x,v in t||(t[v]=o,S[o]=[T[E[x][0]],E[x][1]]),x=p.x+"|"+p.y,v=y+"|"+x,v in t||(t[v]=a,S[a]=[T[E[x][0]],E[x][1]]),x=f.x+"|"+f.y,v=y+"|"+x,v in t||(t[v]=l,S[l]=[T[E[x][0]],E[x][1]]),s=this.IDATA.edgematch[y][0],r=this.IDATA.edgematch[y][1],"B"===r)for(let e=1;e<h;e++)m.x=i-e*(c+u),m.y=n+e*c,g.x=-e*u,g.y=e*(c+u),x=m.x+"|"+m.y,b=g.x+"|"+g.y,C(y,s,x,b);if("O"===r)for(let e=1;e<h;e++)g.x=-e*u,g.y=e*(c+u),_.x=e*c,_.y=e*u,x=g.x+"|"+g.y,b=_.x+"|"+_.y,C(y,s,x,b);if(s=this.IDATA.edgematch[y][2],r=this.IDATA.edgematch[y][3],r&&"A"===r)for(let e=1;e<h;e++)_.x=e*c,_.y=e*u,m.x=i-(h-e)*(c+u),m.y=n+(h-e)*c,x=_.x+"|"+_.y,b=m.x+"|"+m.y,C(y,s,x,b);for(let i=0;i<this.vertices.length;i++)x=this.vertices[i].x+"|"+this.vertices[i].y,v=y+"|"+x,v in t||(t[v]=e++,E[x][0]>2?S[t[v]]=[-E[x][0],E[x][1],t[v]]:S[t[v]]=[T[E[x][0]],E[x][1],t[v]])}this.closestTo=S,this.vecToidx=t}calcCoeffs(){const e=this.m,t=this.n,i=Math.sqrt(3)/3,n=e*e+t*t+e*t;this.coau=(e+t)/n,this.cobu=-t/n,this.coav=-i*(e-t)/n,this.cobv=i*(2*e+t)/n}createInnerFacets(){const e=this.m,t=this.n;for(let i=0;i<t+e+1;i++)for(let e=this.min[i];e<this.max[i]+1;e++)e<this.max[i]&&e<this.max[i+1]+1&&this.innerFacets.push(["|"+e+"|"+i,"|"+e+"|"+(i+1),"|"+(e+1)+"|"+i]),i>0&&e<this.max[i-1]&&e+1<this.max[i]+1&&this.innerFacets.push(["|"+e+"|"+i,"|"+(e+1)+"|"+i,"|"+(e+1)+"|"+(i-1)])}edgeVecsABOB(){const e=this.m,t=this.n,i=new xf(-t,e+t);for(let n=1;n<e+t;n++){const e=new xf(this.min[n],n),t=new xf(this.min[n-1],n-1),s=new xf(this.min[n+1],n+1),r=e.clone(),o=t.clone(),a=s.clone();r.rotate60About(i),o.rotate60About(i),a.rotate60About(i);const l=new xf(this.max[r.y],r.y),h=new xf(this.max[r.y-1],r.y-1),c=new xf(this.max[r.y-1]-1,r.y-1);r.x===l.x&&r.y===l.y||(r.x!==h.x?(this.vertexTypes.push([1,0,0]),this.isoVecsABOB.push([e,h,c]),this.vertexTypes.push([1,0,0]),this.isoVecsABOB.push([e,c,l])):r.y===a.y?(this.vertexTypes.push([1,1,0]),this.isoVecsABOB.push([e,t,h]),this.vertexTypes.push([1,0,1]),this.isoVecsABOB.push([e,h,s])):(this.vertexTypes.push([1,1,0]),this.isoVecsABOB.push([e,t,h]),this.vertexTypes.push([1,0,0]),this.isoVecsABOB.push([e,h,l])))}}mapABOBtoOBOA(){const e=new xf(0,0);for(let t=0;t<this.isoVecsABOB.length;t++){const i=[];for(let n=0;n<3;n++)e.x=this.isoVecsABOB[t][n].x,e.y=this.isoVecsABOB[t][n].y,0===this.vertexTypes[t][n]&&e.rotateNeg120(this.m,this.n),i.push(e.clone());this.isoVecsOBOA.push(i)}}mapABOBtoBAOA(){const e=new xf(0,0);for(let t=0;t<this.isoVecsABOB.length;t++){const i=[];for(let n=0;n<3;n++)e.x=this.isoVecsABOB[t][n].x,e.y=this.isoVecsABOB[t][n].y,1===this.vertexTypes[t][n]&&e.rotate120(this.m,this.n),i.push(e.clone());this.isoVecsBAOA.push(i)}}MapToFace(e,t){const i=this.IDATA.face[e],n=i[2],s=i[1],r=i[0],a=o.P.FromArray(this.IDATA.vertex[n]),l=o.P.FromArray(this.IDATA.vertex[s]),h=o.P.FromArray(this.IDATA.vertex[r]),c=l.subtract(a),u=h.subtract(a),d=c.scale(this.coau).add(u.scale(this.cobu)),p=c.scale(this.coav).add(u.scale(this.cobv)),f=[];let _,m=o.jp.Vector3[0];for(let i=0;i<this.cartesian.length;i++)m=d.scale(this.cartesian[i].x).add(p.scale(this.cartesian[i].y)).add(a),f[i]=[m.x,m.y,m.z],_=e+"|"+this.vertices[i].x+"|"+this.vertices[i].y,t.vertex[this.vecToidx[_]]=[m.x,m.y,m.z]}build(e,t){const i=new Array,n=xf.Zero(),s=new xf(e,t),r=new xf(-t,e+t);i.push(n,s,r);for(let n=t;n<e+1;n++)for(let t=0;t<e+1-n;t++)i.push(new xf(t,n));if(t>0){const n=lt.R.HCF(e,t),s=e/n,r=t/n;for(let o=1;o<n;o++)i.push(new xf(o*s,o*r)),i.push(new xf(-o*r,o*(s+r))),i.push(new xf(e-o*(s+r),t+o*s));const o=e/t;for(let n=1;n<t;n++)for(let s=0;s<n*o;s++)i.push(new xf(s,n)),i.push(new xf(s,n).rotate120(e,t)),i.push(new xf(s,n).rotateNeg120(e,t))}i.sort(((e,t)=>e.x-t.x)),i.sort(((e,t)=>e.y-t.y));const o=new Array(e+t+1),a=new Array(e+t+1);for(let e=0;e<o.length;e++)o[e]=1/0,a[e]=-1/0;let l=0,h=0;const c=i.length;for(let e=0;e<c;e++)h=i[e].x,l=i[e].y,o[l]=Math.min(h,o[l]),a[l]=Math.max(h,a[l]);const u=(i,n)=>{const s=i.clone();return"A"===n&&s.rotateNeg120(e,t),"B"===n&&s.rotate120(e,t),s.x<0?s.y:s.x+s.y},d=[],p=[],f=[],_=[],m={},g=[];let v=-1,y=-1;for(let e=0;e<c;e++)d[e]=i[e].toCartesianOrigin(new xf(0,0),.5),p[e]=u(i[e],"O"),f[e]=u(i[e],"A"),_[e]=u(i[e],"B"),p[e]===f[e]&&f[e]===_[e]?(v=3,y=p[e]):p[e]===f[e]?(v=4,y=p[e]):f[e]===_[e]?(v=5,y=f[e]):_[e]===p[e]&&(v=6,y=p[e]),p[e]<f[e]&&p[e]<_[e]&&(v=2,y=p[e]),f[e]<p[e]&&f[e]<_[e]&&(v=1,y=f[e]),_[e]<f[e]&&_[e]<p[e]&&(v=0,y=_[e]),g.push([v,y,i[e].x,i[e].y]);g.sort(((e,t)=>e[2]-t[2])),g.sort(((e,t)=>e[3]-t[3])),g.sort(((e,t)=>e[1]-t[1])),g.sort(((e,t)=>e[0]-t[0]));for(let e=0;e<g.length;e++)m[g[e][2]+"|"+g[e][3]]=[g[e][0],g[e][1],e];return this.m=e,this.n=t,this.vertices=i,this.vertByDist=m,this.cartesian=d,this.min=o,this.max=a,this}}class Tf{constructor(e,t,i,n){this.name=e,this.category=t,this.vertex=i,this.face=n}}class Sf extends Tf{innerToData(e,t){for(let i=0;i<t.innerFacets.length;i++)this.face.push(t.innerFacets[i].map((i=>t.vecToidx[e+i])))}mapABOBtoDATA(e,t){const i=t.IDATA.edgematch[e][0];for(let n=0;n<t.isoVecsABOB.length;n++){const s=[];for(let r=0;r<3;r++)0===t.vertexTypes[n][r]?s.push(e+"|"+t.isoVecsABOB[n][r].x+"|"+t.isoVecsABOB[n][r].y):s.push(i+"|"+t.isoVecsABOB[n][r].x+"|"+t.isoVecsABOB[n][r].y);this.face.push([t.vecToidx[s[0]],t.vecToidx[s[1]],t.vecToidx[s[2]]])}}mapOBOAtoDATA(e,t){const i=t.IDATA.edgematch[e][0];for(let n=0;n<t.isoVecsOBOA.length;n++){const s=[];for(let r=0;r<3;r++)1===t.vertexTypes[n][r]?s.push(e+"|"+t.isoVecsOBOA[n][r].x+"|"+t.isoVecsOBOA[n][r].y):s.push(i+"|"+t.isoVecsOBOA[n][r].x+"|"+t.isoVecsOBOA[n][r].y);this.face.push([t.vecToidx[s[0]],t.vecToidx[s[1]],t.vecToidx[s[2]]])}}mapBAOAtoDATA(e,t){const i=t.IDATA.edgematch[e][2];for(let n=0;n<t.isoVecsBAOA.length;n++){const s=[];for(let r=0;r<3;r++)1===t.vertexTypes[n][r]?s.push(e+"|"+t.isoVecsBAOA[n][r].x+"|"+t.isoVecsBAOA[n][r].y):s.push(i+"|"+t.isoVecsBAOA[n][r].x+"|"+t.isoVecsBAOA[n][r].y);this.face.push([t.vecToidx[s[0]],t.vecToidx[s[1]],t.vecToidx[s[2]]])}}orderData(e){const t=[];for(let e=0;e<13;e++)t[e]=[];const i=e.closestTo;for(let e=0;e<i.length;e++)i[e][0]>-1?i[e][1]>0&&t[i[e][0]].push([e,i[e][1]]):t[12].push([e,i[e][0]]);const n=[];for(let e=0;e<12;e++)n[e]=e;let s=12;for(let e=0;e<12;e++){t[e].sort(((e,t)=>e[1]-t[1]));for(let i=0;i<t[e].length;i++)n[t[e][i][0]]=s++}for(let e=0;e<t[12].length;e++)n[t[12][e][0]]=s++;for(let e=0;e<this.vertex.length;e++)this.vertex[e].push(n[e]);this.vertex.sort(((e,t)=>e[3]-t[3]));for(let e=0;e<this.vertex.length;e++)this.vertex[e].pop();for(let e=0;e<this.face.length;e++)for(let t=0;t<this.face[e].length;t++)this.face[e][t]=n[this.face[e][t]];this.sharedNodes=t[12].length,this.poleNodes=this.vertex.length-this.sharedNodes}setOrder(e,t){const i=[],n=[];let s=t.pop();n.push(s);let r=this.face[s].indexOf(e);r=(r+2)%3;let o=this.face[s][r];i.push(o);let a=0;for(;t.length>0;)s=t[a],this.face[s].indexOf(o)>-1?(r=(this.face[s].indexOf(o)+1)%3,o=this.face[s][r],i.push(o),n.push(s),t.splice(a,1),a=0):a++;return this.adjacentFaces.push(i),n}toGoldbergPolyhedronData(){const e=new Tf("GeoDual","Goldberg",[],[]);e.name="GD dual";const t=this.vertex.length,i=new Array(t);for(let e=0;e<t;e++)i[e]=[];for(let e=0;e<this.face.length;e++)for(let t=0;t<3;t++)i[this.face[e][t]].push(e);let n=0,s=0,r=0,o=[],a=[];this.adjacentFaces=[];for(let t=0;t<i.length;t++)e.face[t]=this.setOrder(t,i[t].concat([])),i[t].forEach((t=>{n=0,s=0,r=0,o=this.face[t];for(let e=0;e<3;e++)a=this.vertex[o[e]],n+=a[0],s+=a[1],r+=a[2];e.vertex[t]=[n/3,s/3,r/3]}));return e}static BuildGeodesicData(e){const t=new Sf("Geodesic-m-n","Geodesic",[[0,Me.Q_,-1],[-Me.Q_,1,0],[-1,0,-Me.Q_],[1,0,-Me.Q_],[Me.Q_,1,0],[0,Me.Q_,1],[-1,0,Me.Q_],[-Me.Q_,-1,0],[0,-Me.Q_,-1],[Me.Q_,-1,0],[1,0,Me.Q_],[0,-Me.Q_,1]],[]);e.setIndices(),e.calcCoeffs(),e.createInnerFacets(),e.edgeVecsABOB(),e.mapABOBtoOBOA(),e.mapABOBtoBAOA();for(let i=0;i<e.IDATA.face.length;i++)e.MapToFace(i,t),t.innerToData(i,e),"B"===e.IDATA.edgematch[i][1]&&t.mapABOBtoDATA(i,e),"O"===e.IDATA.edgematch[i][1]&&t.mapOBOAtoDATA(i,e),"A"===e.IDATA.edgematch[i][3]&&t.mapBAOAtoDATA(i,e);return t.orderData(e),t.vertex=t.vertex.map((function(e){const t=e[0],i=e[1],n=e[2],s=Math.sqrt(t*t+i*i+n*n);return e[0]*=1/s,e[1]*=1/s,e[2]*=1/s,e})),t}}function Ef(e,t,i=null){let n=t.m||1;n!==Math.floor(n)&&(Math.floor(n),_.Y.Warn("m not an integer only floor(m) used"));let s=t.n||0;if(s!==Math.floor(s)&&(Math.floor(s),_.Y.Warn("n not an integer only floor(n) used")),s>n){const e=s;s=n,n=e,_.Y.Warn("n > m therefore m and n swapped")}const r=new bf;return r.build(n,s),ya(e,{custom:Sf.BuildGeodesicData(r),size:t.size,sizeX:t.sizeX,sizeY:t.sizeY,sizeZ:t.sizeZ,faceUV:t.faceUV,faceColors:t.faceColors,flat:t.flat,updatable:t.updatable,sideOrientation:t.sideOrientation,frontUVs:t.frontUVs,backUVs:t.backUVs},i)}function Cf(e,t){const i=e.size,n=e.sizeX||i||1,s=e.sizeY||i||1,r=e.sizeZ||i||1,a=0===e.sideOrientation?0:e.sideOrientation||sn.x.DEFAULTSIDE,l=new Array,h=new Array,c=new Array,u=new Array;let d=1/0,p=-1/0,f=1/0,_=-1/0;for(let e=0;e<t.vertex.length;e++)d=Math.min(d,t.vertex[e][0]*n),p=Math.max(p,t.vertex[e][0]*n),f=Math.min(f,t.vertex[e][1]*s),_=Math.max(_,t.vertex[e][1]*s);let m=0;for(let e=0;e<t.face.length;e++){const i=t.face[e],a=o.P.FromArray(t.vertex[i[0]]),g=o.P.FromArray(t.vertex[i[2]]),v=o.P.FromArray(t.vertex[i[1]]),y=g.subtract(a),x=v.subtract(a),b=o.P.Cross(x,y).normalize();for(let e=0;e<i.length;e++){c.push(b.x,b.y,b.z);const o=t.vertex[i[e]];l.push(o[0]*n,o[1]*s,o[2]*r);const a=(o[1]*s-f)/(_-f);u.push((o[0]*n-d)/(p-d),rn.e.UseOpenGLOrientationForUV?1-a:a)}for(let e=0;e<i.length-2;e++)h.push(m,m+e+2,m+e+1);m+=i.length}sn.x._ComputeSides(a,l,h,c,u);const g=new sn.x;return g.positions=l,g.indices=h,g.normals=c,g.uvs=u,g}function Af(e,t,i=null){const n=t.size,s=t.sizeX||n||1,r=t.sizeY||n||1,l=t.sizeZ||n||1;let h=t.m||1;h!==Math.floor(h)&&(Math.floor(h),_.Y.Warn("m not an integer only floor(m) used"));let c=t.n||0;if(c!==Math.floor(c)&&(Math.floor(c),_.Y.Warn("n not an integer only floor(n) used")),c>h){const e=c;c=h,h=e,_.Y.Warn("n > m therefore m and n swapped")}const u=new bf;u.build(h,c);const d=Sf.BuildGeodesicData(u),p=d.toGoldbergPolyhedronData(),f=new Vp(e,i);t.sideOrientation=Nt.Kj._GetDefaultSideOrientation(t.sideOrientation),f._originalBuilderSideOrientation=t.sideOrientation,Cf(t,p).applyToMesh(f,t.updatable),f.goldbergData.nbSharedFaces=d.sharedNodes,f.goldbergData.nbUnsharedFaces=d.poleNodes,f.goldbergData.adjacentFaces=d.adjacentFaces,f.goldbergData.nbFaces=f.goldbergData.nbSharedFaces+f.goldbergData.nbUnsharedFaces,f.goldbergData.nbFacesAtPole=(f.goldbergData.nbUnsharedFaces-12)/12;for(let e=0;e<d.vertex.length;e++)f.goldbergData.faceCenters.push(o.P.FromArray(d.vertex[e])),f.goldbergData.faceCenters[e].x*=s,f.goldbergData.faceCenters[e].y*=r,f.goldbergData.faceCenters[e].z*=l,f.goldbergData.faceColors.push(new a.HE(1,1,1,1));for(let e=0;e<p.face.length;e++){const t=p.face[e],i=o.P.FromArray(p.vertex[t[0]]),n=o.P.FromArray(p.vertex[t[2]]),s=o.P.FromArray(p.vertex[t[1]]),r=n.subtract(i),a=s.subtract(i),l=o.P.Cross(a,r).normalize(),h=o.P.Cross(a,l).normalize();f.goldbergData.faceXaxis.push(a.normalize()),f.goldbergData.faceYaxis.push(l),f.goldbergData.faceZaxis.push(h)}return f}Nt.Kj.CreateGoldberg=Af;const Pf={CreateBox:Yn.NR,CreateTiledBox:jp,CreateSphere:Kn,CreateDisc:Ca,CreateIcoSphere:cf.Au,CreateRibbon:fs,CreateCylinder:an,CreateTorus:cn,CreateTorusKnot:Kp,CreateLineSystem:rs,CreateLines:os,CreateDashedLines:as,ExtrudeShape:ms,ExtrudeShapeCustom:gs,CreateLathe:of,CreateTiledPlane:Wp,CreatePlane:pa.pT,CreateGround:dn.$6,CreateTiledGround:dn.DG,CreateGroundFromHeightMap:dn.W,CreatePolygon:nf,ExtrudePolygon:sf,CreateTube:lf,CreatePolyhedron:ya,CreateGeodesic:Ef,CreateGoldberg:Af,CreateDecal:vf,CreateCapsule:Jn};class Rf{constructor(e,t,i){this.quality=e,this.distance=t,this.optimizeMesh=i}}class Mf{constructor(){this.running=!1,this._simplificationArray=[]}addTask(e){this._simplificationArray.push(e)}executeNext(){const e=this._simplificationArray.pop();e?(this.running=!0,this.runSimplification(e)):this.running=!1}runSimplification(e){if(e.parallelProcessing)e.settings.forEach((t=>{this._getSimplifier(e).simplify(t,(i=>{void 0!==t.distance&&e.mesh.addLODLevel(t.distance,i),i.isVisible=!0,t.quality===e.settings[e.settings.length-1].quality&&e.successCallback&&e.successCallback(),this.executeNext()}))}));else{const t=this._getSimplifier(e),i=(i,n)=>{t.simplify(i,(t=>{void 0!==i.distance&&e.mesh.addLODLevel(i.distance,t),t.isVisible=!0,n()}))};de.$g.Run(e.settings.length,(t=>{i(e.settings[t.index],(()=>{t.executeNext()}))}),(()=>{e.successCallback&&e.successCallback(),this.executeNext()}))}}_getSimplifier(e){return e.simplificationType,If.QUADRATIC,new Ff(e.mesh)}}var If;!function(e){e[e.QUADRATIC=0]="QUADRATIC"}(If||(If={}));class Df{constructor(e){this._vertices=e,this.error=new Array(4),this.deleted=!1,this.isDirty=!1,this.deletePending=!1,this.borderFactor=0}}class Of{constructor(e,t){this.position=e,this.id=t,this.isBorder=!0,this.q=new wf,this.triangleCount=0,this.triangleStart=0,this.originalOffsets=[]}updatePosition(e){this.position.copyFrom(e)}}class wf{constructor(e){this.data=new Array(10);for(let t=0;t<10;++t)e&&e[t]?this.data[t]=e[t]:this.data[t]=0}det(e,t,i,n,s,r,o,a,l){return this.data[e]*this.data[s]*this.data[l]+this.data[i]*this.data[n]*this.data[a]+this.data[t]*this.data[r]*this.data[o]-this.data[i]*this.data[s]*this.data[o]-this.data[e]*this.data[r]*this.data[a]-this.data[t]*this.data[n]*this.data[l]}addInPlace(e){for(let t=0;t<10;++t)this.data[t]+=e.data[t]}addArrayInPlace(e){for(let t=0;t<10;++t)this.data[t]+=e[t]}add(e){const t=new wf;for(let i=0;i<10;++i)t.data[i]=this.data[i]+e.data[i];return t}static FromData(e,t,i,n){return new wf(wf.DataFromNumbers(e,t,i,n))}static DataFromNumbers(e,t,i,n){return[e*e,e*t,e*i,e*n,t*t,t*i,t*n,i*i,i*n,n*n]}}class Nf{constructor(e,t){this.vertexId=e,this.triangleId=t}}class Ff{constructor(e){this._mesh=e,this.syncIterations=5e3,this.aggressiveness=7,this.decimationIterations=100,this.boundingBoxEpsilon=Me.kn}simplify(e,t){this._initDecimatedMesh(),de.$g.Run(this._mesh.subMeshes.length,(t=>{this._initWithMesh(t.index,(()=>{this._runDecimation(e,t.index,(()=>{t.executeNext()}))}),e.optimizeMesh)}),(()=>{setTimeout((()=>{t(this._reconstructedMesh)}),0)}))}_runDecimation(e,t,i){const n=~~(this._triangles.length*e.quality);let s=0;const r=this._triangles.length,a=(e,t)=>{setTimeout((()=>{e%5==0&&this._updateMesh(0===e);for(let e=0;e<this._triangles.length;++e)this._triangles[e].isDirty=!1;const i=1e-9*Math.pow(e+3,this.aggressiveness);de.$g.SyncAsyncForLoop(this._triangles.length,this.syncIterations,(e=>{const t=~~((this._triangles.length/2+e)%this._triangles.length),n=this._triangles[t];if(n&&!(n.error[3]>i||n.deleted||n.isDirty))for(let e=0;e<3;++e)if(n.error[e]<i){const t=[],i=[],r=n._vertices[e],a=n._vertices[(e+1)%3];if(r.isBorder||a.isBorder)continue;const l=o.P.Zero();this._calculateError(r,a,l);const h=new Array;if(this._isFlipped(r,a,l,t,h))continue;if(this._isFlipped(a,r,l,i,h))continue;if(t.indexOf(!0)<0||i.indexOf(!0)<0)continue;const c=new Array;if(h.forEach((e=>{-1===c.indexOf(e)&&(e.deletePending=!0,c.push(e))})),c.length%2!=0)continue;r.q=a.q.add(r.q),r.updatePosition(l);const u=this._references.length;s=this._updateTriangles(r,r,t,s),s=this._updateTriangles(r,a,i,s);const d=this._references.length-u;if(d<=r.triangleCount){if(d)for(let e=0;e<d;e++)this._references[r.triangleStart+e]=this._references[u+e]}else r.triangleStart=u;r.triangleCount=d;break}}),t,(()=>r-s<=n))}),0)};de.$g.Run(this.decimationIterations,(e=>{r-s<=n?e.breakLoop():a(e.index,(()=>{e.executeNext()}))}),(()=>{setTimeout((()=>{this._reconstructMesh(t),i()}),0)}))}_initWithMesh(e,t,i){this._vertices=[],this._triangles=[];const n=this._mesh.getVerticesData(qe.o.PositionKind),s=this._mesh.getIndices(),r=this._mesh.subMeshes[e],a=e=>{if(i)for(let t=0;t<this._vertices.length;++t)if(this._vertices[t].position.equalsWithEpsilon(e,1e-4))return this._vertices[t];return null},l=[],h=r.verticesCount;de.$g.SyncAsyncForLoop(h,this.syncIterations/4>>0,(e=>{if(!n)return;const t=e+r.verticesStart,i=o.P.FromArray(n,3*t),s=a(i)||new Of(i,this._vertices.length);s.originalOffsets.push(t),s.id===this._vertices.length&&this._vertices.push(s),l.push(s.id)}),(()=>{de.$g.SyncAsyncForLoop(r.indexCount/3,this.syncIterations,(e=>{if(!s)return;const t=3*(r.indexStart/3+e),i=s[t+0],n=s[t+1],o=s[t+2],a=this._vertices[l[i-r.verticesStart]],h=this._vertices[l[n-r.verticesStart]],c=this._vertices[l[o-r.verticesStart]],u=new Df([a,h,c]);u.originalOffset=t,this._triangles.push(u)}),(()=>{this._init(t)}))}))}_init(e){de.$g.SyncAsyncForLoop(this._triangles.length,this.syncIterations,(e=>{const t=this._triangles[e];t.normal=o.P.Cross(t._vertices[1].position.subtract(t._vertices[0].position),t._vertices[2].position.subtract(t._vertices[0].position)).normalize();for(let e=0;e<3;e++)t._vertices[e].q.addArrayInPlace(wf.DataFromNumbers(t.normal.x,t.normal.y,t.normal.z,-o.P.Dot(t.normal,t._vertices[0].position)))}),(()=>{de.$g.SyncAsyncForLoop(this._triangles.length,this.syncIterations,(e=>{const t=this._triangles[e];for(let e=0;e<3;++e)t.error[e]=this._calculateError(t._vertices[e],t._vertices[(e+1)%3]);t.error[3]=Math.min(t.error[0],t.error[1],t.error[2])}),(()=>{e()}))}))}_reconstructMesh(e){const t=[];let i,n,s;for(i=0;i<this._vertices.length;++i)this._vertices[i].triangleCount=0;for(i=0;i<this._triangles.length;++i)if(!this._triangles[i].deleted){for(n=this._triangles[i],s=0;s<3;++s)n._vertices[s].triangleCount=1;t.push(n)}const r=this._reconstructedMesh.getVerticesData(qe.o.PositionKind)||[],o=this._reconstructedMesh.getVerticesData(qe.o.NormalKind)||[],a=this._reconstructedMesh.getVerticesData(qe.o.UVKind)||[],l=this._reconstructedMesh.getVerticesData(qe.o.ColorKind)||[],h=this._mesh.getVerticesData(qe.o.NormalKind),c=this._mesh.getVerticesData(qe.o.UVKind),u=this._mesh.getVerticesData(qe.o.ColorKind);let d=0;for(i=0;i<this._vertices.length;++i){const e=this._vertices[i];e.id=d,e.triangleCount&&e.originalOffsets.forEach((t=>{r.push(e.position.x),r.push(e.position.y),r.push(e.position.z),h&&h.length&&(o.push(h[3*t]),o.push(h[3*t+1]),o.push(h[3*t+2])),c&&c.length&&(a.push(c[2*t]),a.push(c[2*t+1])),u&&u.length&&(l.push(u[4*t]),l.push(u[4*t+1]),l.push(u[4*t+2]),l.push(u[4*t+3])),++d}))}const p=this._reconstructedMesh.getTotalIndices(),f=this._reconstructedMesh.getTotalVertices(),_=this._reconstructedMesh.subMeshes;this._reconstructedMesh.subMeshes=[];const m=this._reconstructedMesh.getIndices(),g=this._mesh.getIndices();for(i=0;i<t.length;++i)n=t[i],[0,1,2].forEach((e=>{const t=g[n.originalOffset+e];let i=n._vertices[e].originalOffsets.indexOf(t);i<0&&(i=0),m.push(n._vertices[e].id+i+f)}));this._reconstructedMesh.setIndices(m),this._reconstructedMesh.setVerticesData(qe.o.PositionKind,r),o.length>0&&this._reconstructedMesh.setVerticesData(qe.o.NormalKind,o),a.length>0&&this._reconstructedMesh.setVerticesData(qe.o.UVKind,a),l.length>0&&this._reconstructedMesh.setVerticesData(qe.o.ColorKind,l);const v=this._mesh.subMeshes[e];e>0&&(this._reconstructedMesh.subMeshes=[],_.forEach((e=>{Ll.P.AddToMesh(e.materialIndex,e.verticesStart,e.verticesCount,e.indexStart,e.indexCount,e.getMesh())})),Ll.P.AddToMesh(v.materialIndex,f,d,p,3*t.length,this._reconstructedMesh))}_initDecimatedMesh(){this._reconstructedMesh=new Nt.Kj(this._mesh.name+"Decimated",this._mesh.getScene()),this._reconstructedMesh.material=this._mesh.material,this._reconstructedMesh.parent=this._mesh.parent,this._reconstructedMesh.isVisible=!1,this._reconstructedMesh.renderingGroupId=this._mesh.renderingGroupId}_isFlipped(e,t,i,n,s){for(let r=0;r<e.triangleCount;++r){const a=this._triangles[this._references[e.triangleStart+r].triangleId];if(a.deleted)continue;const l=this._references[e.triangleStart+r].vertexId,h=a._vertices[(l+1)%3],c=a._vertices[(l+2)%3];if(h===t||c===t){n[r]=!0,s.push(a);continue}let u=h.position.subtract(i);u=u.normalize();let d=c.position.subtract(i);if(d=d.normalize(),Math.abs(o.P.Dot(u,d))>.999)return!0;const p=o.P.Cross(u,d).normalize();if(n[r]=!1,o.P.Dot(p,a.normal)<.2)return!0}return!1}_updateTriangles(e,t,i,n){let s=n;for(let n=0;n<t.triangleCount;++n){const r=this._references[t.triangleStart+n],o=this._triangles[r.triangleId];o.deleted||(i[n]&&o.deletePending?(o.deleted=!0,s++):(o._vertices[r.vertexId]=e,o.isDirty=!0,o.error[0]=this._calculateError(o._vertices[0],o._vertices[1])+o.borderFactor/2,o.error[1]=this._calculateError(o._vertices[1],o._vertices[2])+o.borderFactor/2,o.error[2]=this._calculateError(o._vertices[2],o._vertices[0])+o.borderFactor/2,o.error[3]=Math.min(o.error[0],o.error[1],o.error[2]),this._references.push(r)))}return s}_identifyBorder(){for(let e=0;e<this._vertices.length;++e){const t=[],i=[],n=this._vertices[e];let s;for(s=0;s<n.triangleCount;++s){const e=this._triangles[this._references[n.triangleStart+s].triangleId];for(let n=0;n<3;n++){let s=0;const r=e._vertices[n];for(;s<t.length&&i[s]!==r.id;)++s;s===t.length?(t.push(1),i.push(r.id)):t[s]++}}for(s=0;s<t.length;++s)1===t[s]?this._vertices[i[s]].isBorder=!0:this._vertices[i[s]].isBorder=!1}}_updateMesh(e=!1){let t,i,n,s;if(!e){const e=[];for(t=0;t<this._triangles.length;++t)this._triangles[t].deleted||e.push(this._triangles[t]);this._triangles=e}for(t=0;t<this._vertices.length;++t)this._vertices[t].triangleCount=0,this._vertices[t].triangleStart=0;for(t=0;t<this._triangles.length;++t)for(i=this._triangles[t],n=0;n<3;++n)s=i._vertices[n],s.triangleCount++;let r=0;for(t=0;t<this._vertices.length;++t)this._vertices[t].triangleStart=r,r+=this._vertices[t].triangleCount,this._vertices[t].triangleCount=0;const o=new Array(3*this._triangles.length);for(t=0;t<this._triangles.length;++t)for(i=this._triangles[t],n=0;n<3;++n)s=i._vertices[n],o[s.triangleStart+s.triangleCount]=new Nf(n,t),s.triangleCount++;this._references=o,e&&this._identifyBorder()}_vertexError(e,t){const i=t.x,n=t.y,s=t.z;return e.data[0]*i*i+2*e.data[1]*i*n+2*e.data[2]*i*s+2*e.data[3]*i+e.data[4]*n*n+2*e.data[5]*n*s+2*e.data[6]*n+e.data[7]*s*s+2*e.data[8]*s+e.data[9]}_calculateError(e,t,i){const n=e.q.add(t.q),s=e.isBorder&&t.isBorder;let r=0;const a=n.det(0,1,2,1,4,5,2,5,7);if(0===a||s){const s=e.position.add(t.position).divide(new o.P(2,2,2)),a=this._vertexError(n,e.position),l=this._vertexError(n,t.position),h=this._vertexError(n,s);r=Math.min(a,l,h),r===a?i&&i.copyFrom(e.position):r===l?i&&i.copyFrom(t.position):i&&i.copyFrom(s)}else i||(i=o.P.Zero()),i.x=-1/a*n.det(1,2,3,4,5,6,5,7,8),i.y=1/a*n.det(0,2,3,1,5,6,2,7,8),i.z=-1/a*n.det(0,1,3,1,4,6,2,5,8),r=this._vertexError(n,i);return r}}Object.defineProperty(k.x.prototype,"simplificationQueue",{get:function(){if(!this._simplificationQueue){this._simplificationQueue=new Mf;let e=this._getComponent(ve.l.NAME_SIMPLIFICATIONQUEUE);e||(e=new Lf(this),this._addComponent(e))}return this._simplificationQueue},set:function(e){this._simplificationQueue=e},enumerable:!0,configurable:!0}),Nt.Kj.prototype.simplify=function(e,t=!0,i=If.QUADRATIC,n){return this.getScene().simplificationQueue.addTask({settings:e,parallelProcessing:t,mesh:this,simplificationType:i,successCallback:n}),this};class Lf{constructor(e){this.name=ve.l.NAME_SIMPLIFICATIONQUEUE,this.scene=e}register(){this.scene._beforeCameraUpdateStage.registerStep(ve.l.STEP_BEFORECAMERAUPDATE_SIMPLIFICATIONQUEUE,this,this._beforeCameraUpdate)}rebuild(){}dispose(){}_beforeCameraUpdate(){this.scene._simplificationQueue&&!this.scene._simplificationQueue.running&&this.scene._simplificationQueue.executeNext()}}var Bf=i(447),Uf=i(8261),Vf=(i(2708),i(7780));class kf{constructor(e=Recast){this.bjsRECAST={},this.name="RecastJSPlugin",this._maximumSubStepCount=10,this._timeStep=1/60,this._timeFactor=1,this._worker=null,"function"==typeof e?_.Y.Error("RecastJS is not ready. Please make sure you await Recast() before using the plugin."):this.bjsRECAST=e,this.isSupported()?(this.setTimeStep(),this._tempVec1=new this.bjsRECAST.Vec3,this._tempVec2=new this.bjsRECAST.Vec3):_.Y.Error("RecastJS is not available. Please make sure you included the js file.")}setWorkerURL(e){return!(!window||!window.Worker||(this._worker=new Worker(e),0))}setTimeStep(e=1/60){this._timeStep=e}getTimeStep(){return this._timeStep}setMaximumSubStepCount(e=10){this._maximumSubStepCount=e}getMaximumSubStepCount(){return this._maximumSubStepCount}set timeFactor(e){this._timeFactor=Math.max(e,0)}get timeFactor(){return this._timeFactor}createNavMesh(e,t,i){let n,s,r;this._worker&&!i?console.warn("A worker is avaible but no completion callback. Defaulting to blocking navmesh creation"):!this._worker&&i&&console.warn("A completion callback is avaible but no worker. Defaulting to blocking navmesh creation"),this.navMesh=new this.bjsRECAST.NavMesh;const o=[],a=[];let l=0;for(n=0;n<e.length;n++)if(e[n]){const t=e[n],i=t.getIndices();if(!i)continue;const h=t.getVerticesData(qe.o.PositionKind,!1,!1);if(!h)continue;const c=[],u=t.computeWorldMatrix(!0);if(t.hasThinInstances){const e=t.thinInstanceGetWorldMatrices();for(let t=0;t<e.length;t++){const i=new Gr.y3;e[t].multiplyToRef(u,i),c.push(i)}}else c.push(u);for(let e=0;e<c.length;e++){const t=c[e];for(s=0;s<i.length;s++)o.push(i[s]+l);const n=Gr.P.Zero(),u=Gr.P.Zero();for(r=0;r<h.length;r+=3)Gr.P.FromArrayToRef(h,r,u),Gr.P.TransformCoordinatesToRef(u,t,n),a.push(n.x,n.y,n.z);l+=h.length/3}}if(this._worker&&i)this._worker.postMessage([a,l,o,o.length,t]),this._worker.onmessage=function(e){i(e.data)};else{const e=new this.bjsRECAST.rcConfig;e.cs=t.cs,e.ch=t.ch,e.borderSize=t.borderSize?t.borderSize:0,e.tileSize=t.tileSize?t.tileSize:0,e.walkableSlopeAngle=t.walkableSlopeAngle,e.walkableHeight=t.walkableHeight,e.walkableClimb=t.walkableClimb,e.walkableRadius=t.walkableRadius,e.maxEdgeLen=t.maxEdgeLen,e.maxSimplificationError=t.maxSimplificationError,e.minRegionArea=t.minRegionArea,e.mergeRegionArea=t.mergeRegionArea,e.maxVertsPerPoly=t.maxVertsPerPoly,e.detailSampleDist=t.detailSampleDist,e.detailSampleMaxError=t.detailSampleMaxError,this.navMesh.build(a,l,o,o.length,e)}}createDebugNavMesh(e){let t,i;const n=this.navMesh.getDebugNavMesh(),s=n.getTriangleCount(),r=[],o=[];for(t=0;t<3*s;t++)r.push(t);for(t=0;t<s;t++)for(i=0;i<3;i++){const e=n.getTriangle(t).getPoint(i);o.push(e.x,e.y,e.z)}const a=new Nt.Kj("NavMeshDebug",e),l=new sn.x;return l.indices=r,l.positions=o,l.applyToMesh(a,!1),a}getClosestPoint(e){this._tempVec1.x=e.x,this._tempVec1.y=e.y,this._tempVec1.z=e.z;const t=this.navMesh.getClosestPoint(this._tempVec1);return new Gr.P(t.x,t.y,t.z)}getClosestPointToRef(e,t){this._tempVec1.x=e.x,this._tempVec1.y=e.y,this._tempVec1.z=e.z;const i=this.navMesh.getClosestPoint(this._tempVec1);t.set(i.x,i.y,i.z)}getRandomPointAround(e,t){this._tempVec1.x=e.x,this._tempVec1.y=e.y,this._tempVec1.z=e.z;const i=this.navMesh.getRandomPointAround(this._tempVec1,t);return new Gr.P(i.x,i.y,i.z)}getRandomPointAroundToRef(e,t,i){this._tempVec1.x=e.x,this._tempVec1.y=e.y,this._tempVec1.z=e.z;const n=this.navMesh.getRandomPointAround(this._tempVec1,t);i.set(n.x,n.y,n.z)}moveAlong(e,t){this._tempVec1.x=e.x,this._tempVec1.y=e.y,this._tempVec1.z=e.z,this._tempVec2.x=t.x,this._tempVec2.y=t.y,this._tempVec2.z=t.z;const i=this.navMesh.moveAlong(this._tempVec1,this._tempVec2);return new Gr.P(i.x,i.y,i.z)}moveAlongToRef(e,t,i){this._tempVec1.x=e.x,this._tempVec1.y=e.y,this._tempVec1.z=e.z,this._tempVec2.x=t.x,this._tempVec2.y=t.y,this._tempVec2.z=t.z;const n=this.navMesh.moveAlong(this._tempVec1,this._tempVec2);i.set(n.x,n.y,n.z)}computePath(e,t){let i;this._tempVec1.x=e.x,this._tempVec1.y=e.y,this._tempVec1.z=e.z,this._tempVec2.x=t.x,this._tempVec2.y=t.y,this._tempVec2.z=t.z;const n=this.navMesh.computePath(this._tempVec1,this._tempVec2),s=n.getPointCount(),r=[];for(i=0;i<s;i++){const e=n.getPoint(i);r.push(new Gr.P(e.x,e.y,e.z))}return r}createCrowd(e,t,i){return new Gf(this,e,t,i)}setDefaultQueryExtent(e){this._tempVec1.x=e.x,this._tempVec1.y=e.y,this._tempVec1.z=e.z,this.navMesh.setDefaultQueryExtent(this._tempVec1)}getDefaultQueryExtent(){const e=this.navMesh.getDefaultQueryExtent();return new Gr.P(e.x,e.y,e.z)}buildFromNavmeshData(e){const t=e.length*e.BYTES_PER_ELEMENT,i=this.bjsRECAST._malloc(t),n=new Uint8Array(this.bjsRECAST.HEAPU8.buffer,i,t);n.set(e);const s=new this.bjsRECAST.NavmeshData;s.dataPointer=n.byteOffset,s.size=e.length,this.navMesh=new this.bjsRECAST.NavMesh,this.navMesh.buildFromNavmeshData(s),this.bjsRECAST._free(n.byteOffset)}getNavmeshData(){const e=this.navMesh.getNavmeshData(),t=new Uint8Array(this.bjsRECAST.HEAPU8.buffer,e.dataPointer,e.size),i=new Uint8Array(e.size);return i.set(t),this.navMesh.freeNavmeshData(e),i}getDefaultQueryExtentToRef(e){const t=this.navMesh.getDefaultQueryExtent();e.set(t.x,t.y,t.z)}dispose(){}addCylinderObstacle(e,t,i){return this._tempVec1.x=e.x,this._tempVec1.y=e.y,this._tempVec1.z=e.z,this.navMesh.addCylinderObstacle(this._tempVec1,t,i)}addBoxObstacle(e,t,i){return this._tempVec1.x=e.x,this._tempVec1.y=e.y,this._tempVec1.z=e.z,this._tempVec2.x=t.x,this._tempVec2.y=t.y,this._tempVec2.z=t.z,this.navMesh.addBoxObstacle(this._tempVec1,this._tempVec2,i)}removeObstacle(e){this.navMesh.removeObstacle(e)}isSupported(){return void 0!==this.bjsRECAST}}class Gf{constructor(e,t,i,n){this.recastCrowd={},this.transforms=new Array,this.agents=new Array,this.reachRadii=new Array,this._agentDestinationArmed=new Array,this._agentDestination=new Array,this._onBeforeAnimationsObserver=null,this.onReachTargetObservable=new r.y$,this.bjsRECASTPlugin=e,this.recastCrowd=new this.bjsRECASTPlugin.bjsRECAST.Crowd(t,i,this.bjsRECASTPlugin.navMesh.getNavMesh()),this._scene=n,this._onBeforeAnimationsObserver=n.onBeforeAnimationsObservable.add((()=>{this.update(.001*n.getEngine().getDeltaTime()*e.timeFactor)}))}addAgent(e,t,i){const n=new this.bjsRECASTPlugin.bjsRECAST.dtCrowdAgentParams;n.radius=t.radius,n.height=t.height,n.maxAcceleration=t.maxAcceleration,n.maxSpeed=t.maxSpeed,n.collisionQueryRange=t.collisionQueryRange,n.pathOptimizationRange=t.pathOptimizationRange,n.separationWeight=t.separationWeight,n.updateFlags=7,n.obstacleAvoidanceType=0,n.queryFilterType=0,n.userData=0;const s=this.recastCrowd.addAgent(new this.bjsRECASTPlugin.bjsRECAST.Vec3(e.x,e.y,e.z),n);return this.transforms.push(i),this.agents.push(s),this.reachRadii.push(t.reachRadius?t.reachRadius:t.radius),this._agentDestinationArmed.push(!1),this._agentDestination.push(new Gr.P(0,0,0)),s}getAgentPosition(e){const t=this.recastCrowd.getAgentPosition(e);return new Gr.P(t.x,t.y,t.z)}getAgentPositionToRef(e,t){const i=this.recastCrowd.getAgentPosition(e);t.set(i.x,i.y,i.z)}getAgentVelocity(e){const t=this.recastCrowd.getAgentVelocity(e);return new Gr.P(t.x,t.y,t.z)}getAgentVelocityToRef(e,t){const i=this.recastCrowd.getAgentVelocity(e);t.set(i.x,i.y,i.z)}getAgentNextTargetPath(e){const t=this.recastCrowd.getAgentNextTargetPath(e);return new Gr.P(t.x,t.y,t.z)}getAgentNextTargetPathToRef(e,t){const i=this.recastCrowd.getAgentNextTargetPath(e);t.set(i.x,i.y,i.z)}getAgentState(e){return this.recastCrowd.getAgentState(e)}overOffmeshConnection(e){return this.recastCrowd.overOffmeshConnection(e)}agentGoto(e,t){this.recastCrowd.agentGoto(e,new this.bjsRECASTPlugin.bjsRECAST.Vec3(t.x,t.y,t.z));const i=this.agents.indexOf(e);i>-1&&(this._agentDestinationArmed[i]=!0,this._agentDestination[i].set(t.x,t.y,t.z))}agentTeleport(e,t){this.recastCrowd.agentTeleport(e,new this.bjsRECASTPlugin.bjsRECAST.Vec3(t.x,t.y,t.z))}updateAgentParameters(e,t){const i=this.recastCrowd.getAgentParameters(e);void 0!==t.radius&&(i.radius=t.radius),void 0!==t.height&&(i.height=t.height),void 0!==t.maxAcceleration&&(i.maxAcceleration=t.maxAcceleration),void 0!==t.maxSpeed&&(i.maxSpeed=t.maxSpeed),void 0!==t.collisionQueryRange&&(i.collisionQueryRange=t.collisionQueryRange),void 0!==t.pathOptimizationRange&&(i.pathOptimizationRange=t.pathOptimizationRange),void 0!==t.separationWeight&&(i.separationWeight=t.separationWeight),this.recastCrowd.setAgentParameters(e,i)}removeAgent(e){this.recastCrowd.removeAgent(e);const t=this.agents.indexOf(e);t>-1&&(this.agents.splice(t,1),this.transforms.splice(t,1),this.reachRadii.splice(t,1),this._agentDestinationArmed.splice(t,1),this._agentDestination.splice(t,1))}getAgents(){return this.agents}update(e){if(this.bjsRECASTPlugin.navMesh.update(),e<=Gr.kn)return;const t=this.bjsRECASTPlugin.getTimeStep(),i=this.bjsRECASTPlugin.getMaximumSubStepCount();if(t<=Gr.kn)this.recastCrowd.update(e);else{let n=Math.floor(e/t);i&&n>i&&(n=i),n<1&&(n=1);const s=e/n;for(let e=0;e<n;e++)this.recastCrowd.update(s)}for(let e=0;e<this.agents.length;e++){const t=this.agents[e],i=this.getAgentPosition(t);if(this.transforms[e].position=i,this._agentDestinationArmed[e]){const n=i.x-this._agentDestination[e].x,s=i.z-this._agentDestination[e].z,r=this.reachRadii[e],o=this._agentDestination[e].y-this.reachRadii[e],a=this._agentDestination[e].y+this.reachRadii[e],l=n*n+s*s;i.y>o&&i.y<a&&l<r*r&&(this.onReachTargetObservable.notifyObservers({agentIndex:t,destination:this._agentDestination[e]}),this._agentDestinationArmed[e]=!1)}}}setDefaultQueryExtent(e){const t=new this.bjsRECASTPlugin.bjsRECAST.Vec3(e.x,e.y,e.z);this.recastCrowd.setDefaultQueryExtent(t)}getDefaultQueryExtent(){const e=this.recastCrowd.getDefaultQueryExtent();return new Gr.P(e.x,e.y,e.z)}getDefaultQueryExtentToRef(e){const t=this.recastCrowd.getDefaultQueryExtent();e.set(t.x,t.y,t.z)}getCorners(e){let t;const i=this.recastCrowd.getCorners(e),n=i.getPointCount(),s=[];for(t=0;t<n;t++){const e=i.getPoint(t);s.push(new Gr.P(e.x,e.y,e.z))}return s}dispose(){this.recastCrowd.destroy(),this._scene.onBeforeAnimationsObservable.remove(this._onBeforeAnimationsObserver),this._onBeforeAnimationsObserver=null,this.onReachTargetObservable.clear()}}ue.D.OfflineProviderFactory=(e,t,i=!1)=>new zf(e,t,i);class zf{get enableSceneOffline(){return this._enableSceneOffline}get enableTexturesOffline(){return this._enableTexturesOffline}constructor(e,t,i=!1){this._idbFactory="undefined"!=typeof indexedDB?indexedDB:void 0,this._currentSceneUrl=zf._ReturnFullUrlLocation(e),this._db=null,this._enableSceneOffline=!1,this._enableTexturesOffline=!1,this._manifestVersionFound=0,this._mustUpdateRessources=!1,this._hasReachedQuota=!1,zf.IDBStorageEnabled?i?(this._enableSceneOffline=!0,this._enableTexturesOffline=!0,this._manifestVersionFound=1,de.w1.SetImmediate((()=>{t(!0)}))):this._checkManifestFile(t):t(!0)}_checkManifestFile(e){const t=()=>{this._enableSceneOffline=!1,this._enableTexturesOffline=!1,e(!1)},i=()=>{try{if("function"==typeof URL&&0===this._currentSceneUrl.indexOf("http")){const e=new URL(this._currentSceneUrl);return e.pathname+=".manifest",e.toString()}}catch(e){}return`${this._currentSceneUrl}.manifest`};let n=!1,s=i();const r=new Kc.g;navigator.onLine&&(n=!0,s=s+(null==s.match(/\?/)?"?":"&")+Date.now()),r.open("GET",s),r.addEventListener("load",(()=>{if(200===r.status||zf._ValidateXHRData(r,1))try{const t=JSON.parse(r.response);this._enableSceneOffline=t.enableSceneOffline,this._enableTexturesOffline=t.enableTexturesOffline&&zf._IsUASupportingBlobStorage,t.version&&!isNaN(parseInt(t.version))&&(this._manifestVersionFound=t.version),e(!0)}catch(e){t()}else t()}),!1),r.addEventListener("error",(()=>{if(n){n=!1;const e=i();r.open("GET",e),r.send()}else t()}),!1);try{r.send()}catch(t){_.Y.Error("Error on XHR send request."),e(!1)}}open(e,t){const i=()=>{this._isSupported=!1,t&&t()};if(this._idbFactory&&(this._enableSceneOffline||this._enableTexturesOffline))if(this._db)e&&e();else{this._hasReachedQuota=!1,this._isSupported=!0;const t=this._idbFactory.open("babylonjs",1);t.onerror=()=>{i()},t.onblocked=()=>{_.Y.Error("IDB request blocked. Please reload the page."),i()},t.onsuccess=()=>{this._db=t.result,e()},t.onupgradeneeded=e=>{if(this._db=e.target.result,this._db)try{this._db.createObjectStore("scenes",{keyPath:"sceneUrl"}),this._db.createObjectStore("versions",{keyPath:"sceneUrl"}),this._db.createObjectStore("textures",{keyPath:"textureUrl"})}catch(e){_.Y.Error("Error while creating object stores. Exception: "+e.message),i()}}}else this._isSupported=!1,t&&t()}loadImage(e,t){const i=zf._ReturnFullUrlLocation(e),n=()=>{this._hasReachedQuota||null===this._db?t.src=e:this._saveImageIntoDBAsync(i,t)};this._mustUpdateRessources?n():this._loadImageFromDBAsync(i,t,n)}_loadImageFromDBAsync(e,t,i){if(this._isSupported&&null!==this._db){let n;const s=this._db.transaction(["textures"]);s.onabort=()=>{t.src=e},s.oncomplete=()=>{let s;n&&"function"==typeof URL?(s=URL.createObjectURL(n.data),t.onerror=()=>{_.Y.Error("Error loading image from blob URL: "+s+" switching back to web url: "+e),t.src=e},t.src=s):i()};const r=s.objectStore("textures").get(e);r.onsuccess=e=>{n=e.target.result},r.onerror=()=>{_.Y.Error("Error loading texture "+e+" from DB."),t.src=e}}else _.Y.Error("Error: IndexedDB not supported by your browser or BabylonJS Database is not open."),t.src=e}_saveImageIntoDBAsync(e,t){let i;if(this._isSupported){const n=()=>{let e;if(i&&"function"==typeof URL)try{e=URL.createObjectURL(i)}catch(t){e=URL.createObjectURL(i)}e&&(t.src=e)};if(zf._IsUASupportingBlobStorage){const s=new Kc.g;s.open("GET",e),s.responseType="blob",s.addEventListener("load",(()=>{if(200===s.status&&this._db){i=s.response;const r=this._db.transaction(["textures"],"readwrite");r.onabort=e=>{try{const t=e.target.error;t&&"QuotaExceededError"===t.name&&(this._hasReachedQuota=!0)}catch(e){}n()},r.oncomplete=()=>{n()};const o={textureUrl:e,data:i};try{const e=r.objectStore("textures").put(o);e.onsuccess=()=>{},e.onerror=()=>{n()}}catch(i){25===i.code&&(zf._IsUASupportingBlobStorage=!1,this._enableTexturesOffline=!1),t.src=e}}else t.src=e}),!1),s.addEventListener("error",(()=>{_.Y.Error("Error in XHR request in BABYLON.Database."),t.src=e}),!1),s.send()}else t.src=e}else _.Y.Error("Error: IndexedDB not supported by your browser or Babylon.js database is not open."),t.src=e}_checkVersionFromDB(e,t){this._loadVersionFromDBAsync(e,t,(()=>{this._saveVersionIntoDBAsync(e,t)}))}_loadVersionFromDBAsync(e,t,i){if(this._isSupported&&this._db){let n;try{const s=this._db.transaction(["versions"]);s.oncomplete=()=>{n?this._manifestVersionFound!==n.data?(this._mustUpdateRessources=!0,i()):t(n.data):(this._mustUpdateRessources=!0,i())},s.onabort=()=>{t(-1)};const r=s.objectStore("versions").get(e);r.onsuccess=e=>{n=e.target.result},r.onerror=()=>{_.Y.Error("Error loading version for scene "+e+" from DB."),t(-1)}}catch(e){_.Y.Error("Error while accessing 'versions' object store (READ OP). Exception: "+e.message),t(-1)}}else _.Y.Error("Error: IndexedDB not supported by your browser or Babylon.js database is not open."),t(-1)}_saveVersionIntoDBAsync(e,t){if(this._isSupported&&!this._hasReachedQuota&&this._db)try{const i=this._db.transaction(["versions"],"readwrite");i.onabort=e=>{try{const t=e.target.error;t&&"QuotaExceededError"===t.name&&(this._hasReachedQuota=!0)}catch(e){}t(-1)},i.oncomplete=()=>{t(this._manifestVersionFound)};const n={sceneUrl:e,data:this._manifestVersionFound},s=i.objectStore("versions").put(n);s.onsuccess=()=>{},s.onerror=()=>{_.Y.Error("Error in DB add version request in BABYLON.Database.")}}catch(e){_.Y.Error("Error while accessing 'versions' object store (WRITE OP). Exception: "+e.message),t(-1)}else t(-1)}loadFile(e,t,i,n,s){const r=zf._ReturnFullUrlLocation(e),o=()=>{this._saveFileAsync(r,t,i,s,n)};this._checkVersionFromDB(r,(e=>{-1!==e?this._mustUpdateRessources?this._saveFileAsync(r,t,i,s,n):this._loadFileAsync(r,t,o):n&&n()}))}_loadFileAsync(e,t,i){if(this._isSupported&&this._db){let n,s;n=-1!==e.indexOf(".babylon")?"scenes":"textures";const r=this._db.transaction([n]);r.oncomplete=()=>{s?t(s.data):i()},r.onabort=()=>{i()};const o=r.objectStore(n).get(e);o.onsuccess=e=>{s=e.target.result},o.onerror=()=>{_.Y.Error("Error loading file "+e+" from DB."),i()}}else _.Y.Error("Error: IndexedDB not supported by your browser or BabylonJS Database is not open."),t()}_saveFileAsync(e,t,i,n,s){if(this._isSupported){let r;r=-1!==e.indexOf(".babylon")?"scenes":"textures";const o=new Kc.g;let a;o.open("GET",e+(null==e.match(/\?/)?"?":"&")+Date.now()),n&&(o.responseType="arraybuffer"),i&&(o.onprogress=i),o.addEventListener("load",(()=>{if(200===o.status||o.status<400&&zf._ValidateXHRData(o,n?6:1))if(a=n?o.response:o.responseText,!this._hasReachedQuota&&this._db){const i=this._db.transaction([r],"readwrite");let n;i.onabort=e=>{try{const t=e.target.error;t&&"QuotaExceededError"===t.name&&(this._hasReachedQuota=!0)}catch(e){}t(a)},i.oncomplete=()=>{t(a)},n="scenes"===r?{sceneUrl:e,data:a,version:this._manifestVersionFound}:{textureUrl:e,data:a};try{const e=i.objectStore(r).put(n);e.onsuccess=()=>{},e.onerror=()=>{_.Y.Error("Error in DB add file request in BABYLON.Database.")}}catch(e){t(a)}}else t(a);else o.status>=400&&s?s(o):t()}),!1),o.addEventListener("error",(()=>{_.Y.Error("error on XHR request."),s&&s()}),!1),o.send()}else _.Y.Error("Error: IndexedDB not supported by your browser or Babylon.js database is not open."),s&&s()}static _ValidateXHRData(e,t=7){try{if(1&t){if(e.responseText&&e.responseText.length>0)return!0;if(1===t)return!1}if(2&t){const i=Pc(e.response);if(i.width&&i.height&&i.width>0&&i.height>0)return!0;if(2===t)return!1}if(4&t){const t=new Uint8Array(e.response,0,3);return 68===t[0]&&68===t[1]&&83===t[2]}}catch(e){}return!1}}zf._IsUASupportingBlobStorage=!0,zf.IDBStorageEnabled=!1,zf._ParseURL=e=>{document.createElement("a").href=e;const t=e.substring(0,e.lastIndexOf("#")),i=e.substring(t.lastIndexOf("/")+1,e.length);return e.substring(0,e.indexOf(i,0))},zf._ReturnFullUrlLocation=e=>-1===e.indexOf("http:/")&&-1===e.indexOf("https:/")&&"undefined"!=typeof window?zf._ParseURL(window.location.href)+e:e;var Wf=i(5753),Hf=i(5089),Xf=i(5098);class jf{_isUbo(e){return void 0!==e.addUniform}constructor(e){this._isUbo(e)?(this.setMatrix3x3=e.updateMatrix3x3.bind(e),this.setMatrix2x2=e.updateMatrix2x2.bind(e),this.setFloat=e.updateFloat.bind(e),this.setFloat2=e.updateFloat2.bind(e),this.setFloat3=e.updateFloat3.bind(e),this.setFloat4=e.updateFloat4.bind(e),this.setFloatArray=e.updateFloatArray.bind(e),this.setArray=e.updateArray.bind(e),this.setIntArray=e.updateIntArray.bind(e),this.setMatrix=e.updateMatrix.bind(e),this.setMatrices=e.updateMatrices.bind(e),this.setVector3=e.updateVector3.bind(e),this.setVector4=e.updateVector4.bind(e),this.setColor3=e.updateColor3.bind(e),this.setColor4=e.updateColor4.bind(e),this.setDirectColor4=e.updateDirectColor4.bind(e),this.setInt=e.updateInt.bind(e),this.setInt2=e.updateInt2.bind(e),this.setInt3=e.updateInt3.bind(e),this.setInt4=e.updateInt4.bind(e)):(this.setMatrix3x3=e.setMatrix3x3.bind(e),this.setMatrix2x2=e.setMatrix2x2.bind(e),this.setFloat=e.setFloat.bind(e),this.setFloat2=e.setFloat2.bind(e),this.setFloat3=e.setFloat3.bind(e),this.setFloat4=e.setFloat4.bind(e),this.setFloatArray=e.setFloatArray.bind(e),this.setArray=e.setArray.bind(e),this.setIntArray=e.setIntArray.bind(e),this.setMatrix=e.setMatrix.bind(e),this.setMatrices=e.setMatrices.bind(e),this.setVector3=e.setVector3.bind(e),this.setVector4=e.setVector4.bind(e),this.setColor3=e.setColor3.bind(e),this.setColor4=e.setColor4.bind(e),this.setDirectColor4=e.setDirectColor4.bind(e),this.setInt=e.setInt.bind(e),this.setInt2=e.setInt2.bind(e),this.setInt3=e.setInt3.bind(e),this.setInt4=e.setInt4.bind(e))}}si.v.ShadersStore.gpuUpdateParticlesPixelShader="#version 300 es\nvoid main() {\ndiscard;\n}\n";si.v.ShadersStore.gpuUpdateParticlesVertexShader="#version 300 es\n#define PI 3.14159\nuniform float currentCount;\nuniform float timeDelta;\nuniform float stopFactor;\n#ifndef LOCAL\nuniform mat4 emitterWM;\n#endif\nuniform vec2 lifeTime;\nuniform vec2 emitPower;\nuniform vec2 sizeRange;\nuniform vec4 scaleRange;\n#ifndef COLORGRADIENTS\nuniform vec4 color1;\nuniform vec4 color2;\n#endif\nuniform vec3 gravity;\nuniform sampler2D randomSampler;\nuniform sampler2D randomSampler2;\nuniform vec4 angleRange;\n#ifdef BOXEMITTER\nuniform vec3 direction1;\nuniform vec3 direction2;\nuniform vec3 minEmitBox;\nuniform vec3 maxEmitBox;\n#endif\n#ifdef POINTEMITTER\nuniform vec3 direction1;\nuniform vec3 direction2;\n#endif\n#ifdef HEMISPHERICEMITTER\nuniform float radius;\nuniform float radiusRange;\nuniform float directionRandomizer;\n#endif\n#ifdef SPHEREEMITTER\nuniform float radius;\nuniform float radiusRange;\n#ifdef DIRECTEDSPHEREEMITTER\nuniform vec3 direction1;\nuniform vec3 direction2;\n#else\nuniform float directionRandomizer;\n#endif\n#endif\n#ifdef CYLINDEREMITTER\nuniform float radius;\nuniform float height;\nuniform float radiusRange;\n#ifdef DIRECTEDCYLINDEREMITTER\nuniform vec3 direction1;\nuniform vec3 direction2;\n#else\nuniform float directionRandomizer;\n#endif\n#endif\n#ifdef CONEEMITTER\nuniform vec2 radius;\nuniform float coneAngle;\nuniform vec2 height;\nuniform float directionRandomizer;\n#endif\nin vec3 position;\n#ifdef CUSTOMEMITTER\nin vec3 initialPosition;\n#endif\nin float age;\nin float life;\nin vec4 seed;\nin vec3 size;\n#ifndef COLORGRADIENTS\nin vec4 color;\n#endif\nin vec3 direction;\n#ifndef BILLBOARD\nin vec3 initialDirection;\n#endif\n#ifdef ANGULARSPEEDGRADIENTS\nin float angle;\n#else\nin vec2 angle;\n#endif\n#ifdef ANIMATESHEET\nin float cellIndex;\n#ifdef ANIMATESHEETRANDOMSTART\nin float cellStartOffset;\n#endif\n#endif\n#ifdef NOISE\nin vec3 noiseCoordinates1;\nin vec3 noiseCoordinates2;\n#endif\nout vec3 outPosition;\n#ifdef CUSTOMEMITTER\nout vec3 outInitialPosition;\n#endif\nout float outAge;\nout float outLife;\nout vec4 outSeed;\nout vec3 outSize;\n#ifndef COLORGRADIENTS\nout vec4 outColor;\n#endif\nout vec3 outDirection;\n#ifndef BILLBOARD\nout vec3 outInitialDirection;\n#endif\n#ifdef ANGULARSPEEDGRADIENTS\nout float outAngle;\n#else\nout vec2 outAngle;\n#endif\n#ifdef ANIMATESHEET\nout float outCellIndex;\n#ifdef ANIMATESHEETRANDOMSTART\nout float outCellStartOffset;\n#endif\n#endif\n#ifdef NOISE\nout vec3 outNoiseCoordinates1;\nout vec3 outNoiseCoordinates2;\n#endif\n#ifdef SIZEGRADIENTS\nuniform sampler2D sizeGradientSampler;\n#endif \n#ifdef ANGULARSPEEDGRADIENTS\nuniform sampler2D angularSpeedGradientSampler;\n#endif \n#ifdef VELOCITYGRADIENTS\nuniform sampler2D velocityGradientSampler;\n#endif\n#ifdef LIMITVELOCITYGRADIENTS\nuniform sampler2D limitVelocityGradientSampler;\nuniform float limitVelocityDamping;\n#endif\n#ifdef DRAGGRADIENTS\nuniform sampler2D dragGradientSampler;\n#endif\n#ifdef NOISE\nuniform vec3 noiseStrength;\nuniform sampler2D noiseSampler;\n#endif\n#ifdef ANIMATESHEET\nuniform vec4 cellInfos;\n#endif\nvec3 getRandomVec3(float offset) {\nreturn texture(randomSampler2,vec2(float(gl_VertexID)*offset/currentCount,0)).rgb;\n}\nvec4 getRandomVec4(float offset) {\nreturn texture(randomSampler,vec2(float(gl_VertexID)*offset/currentCount,0));\n}\nvoid main() {\nfloat newAge=age+timeDelta; \nif (newAge>=life && stopFactor != 0.) {\nvec3 newPosition;\nvec3 newDirection;\nvec4 randoms=getRandomVec4(seed.x);\noutLife=lifeTime.x+(lifeTime.y-lifeTime.x)*randoms.r;\noutAge=newAge-life;\noutSeed=seed;\n#ifdef SIZEGRADIENTS \noutSize.x=texture(sizeGradientSampler,vec2(0,0)).r;\n#else\noutSize.x=sizeRange.x+(sizeRange.y-sizeRange.x)*randoms.g;\n#endif\noutSize.y=scaleRange.x+(scaleRange.y-scaleRange.x)*randoms.b;\noutSize.z=scaleRange.z+(scaleRange.w-scaleRange.z)*randoms.a; \n#ifndef COLORGRADIENTS\noutColor=color1+(color2-color1)*randoms.b;\n#endif\n#ifndef ANGULARSPEEDGRADIENTS \noutAngle.y=angleRange.x+(angleRange.y-angleRange.x)*randoms.a;\noutAngle.x=angleRange.z+(angleRange.w-angleRange.z)*randoms.r;\n#else\noutAngle=angleRange.z+(angleRange.w-angleRange.z)*randoms.r;\n#endif \n#ifdef POINTEMITTER\nvec3 randoms2=getRandomVec3(seed.y);\nvec3 randoms3=getRandomVec3(seed.z);\nnewPosition=vec3(0,0,0);\nnewDirection=direction1+(direction2-direction1)*randoms3;\n#elif defined(BOXEMITTER)\nvec3 randoms2=getRandomVec3(seed.y);\nvec3 randoms3=getRandomVec3(seed.z);\nnewPosition=minEmitBox+(maxEmitBox-minEmitBox)*randoms2;\nnewDirection=direction1+(direction2-direction1)*randoms3; \n#elif defined(HEMISPHERICEMITTER)\nvec3 randoms2=getRandomVec3(seed.y);\nvec3 randoms3=getRandomVec3(seed.z);\nfloat phi=2.0*PI*randoms2.x;\nfloat theta=acos(2.0*randoms2.y-1.0);\nfloat randX=cos(phi)*sin(theta);\nfloat randY=cos(theta);\nfloat randZ=sin(phi)*sin(theta);\nnewPosition=(radius-(radius*radiusRange*randoms2.z))*vec3(randX,abs(randY),randZ);\nnewDirection=newPosition+directionRandomizer*randoms3; \n#elif defined(SPHEREEMITTER)\nvec3 randoms2=getRandomVec3(seed.y);\nvec3 randoms3=getRandomVec3(seed.z);\nfloat phi=2.0*PI*randoms2.x;\nfloat theta=acos(2.0*randoms2.y-1.0);\nfloat randX=cos(phi)*sin(theta);\nfloat randY=cos(theta);\nfloat randZ=sin(phi)*sin(theta);\nnewPosition=(radius-(radius*radiusRange*randoms2.z))*vec3(randX,randY,randZ);\n#ifdef DIRECTEDSPHEREEMITTER\nnewDirection=normalize(direction1+(direction2-direction1)*randoms3);\n#else\nnewDirection=normalize(newPosition+directionRandomizer*randoms3);\n#endif\n#elif defined(CYLINDEREMITTER)\nvec3 randoms2=getRandomVec3(seed.y);\nvec3 randoms3=getRandomVec3(seed.z);\nfloat yPos=(randoms2.x-0.5)*height;\nfloat angle=randoms2.y*PI*2.;\nfloat inverseRadiusRangeSquared=((1.-radiusRange)*(1.-radiusRange));\nfloat positionRadius=radius*sqrt(inverseRadiusRangeSquared+(randoms2.z*(1.-inverseRadiusRangeSquared)));\nfloat xPos=positionRadius*cos(angle);\nfloat zPos=positionRadius*sin(angle);\nnewPosition=vec3(xPos,yPos,zPos);\n#ifdef DIRECTEDCYLINDEREMITTER\nnewDirection=direction1+(direction2-direction1)*randoms3;\n#else\nangle=angle+((randoms3.x-0.5)*PI)*directionRandomizer;\nnewDirection=vec3(cos(angle),(randoms3.y-0.5)*directionRandomizer,sin(angle));\nnewDirection=normalize(newDirection);\n#endif\n#elif defined(CONEEMITTER)\nvec3 randoms2=getRandomVec3(seed.y);\nfloat s=2.0*PI*randoms2.x;\n#ifdef CONEEMITTERSPAWNPOINT\nfloat h=0.0001;\n#else\nfloat h=randoms2.y*height.y;\nh=1.-h*h; \n#endif\nfloat lRadius=radius.x-radius.x*randoms2.z*radius.y;\nlRadius=lRadius*h;\nfloat randX=lRadius*sin(s);\nfloat randZ=lRadius*cos(s);\nfloat randY=h *height.x;\nnewPosition=vec3(randX,randY,randZ); \nif (abs(cos(coneAngle))==1.0) {\nnewDirection=vec3(0.,1.0,0.);\n} else {\nvec3 randoms3=getRandomVec3(seed.z);\nnewDirection=normalize(newPosition+directionRandomizer*randoms3); \n}\n#elif defined(CUSTOMEMITTER)\nnewPosition=initialPosition;\noutInitialPosition=initialPosition;\n#else \nnewPosition=vec3(0.,0.,0.);\nnewDirection=2.0*(getRandomVec3(seed.w)-vec3(0.5,0.5,0.5));\n#endif\nfloat power=emitPower.x+(emitPower.y-emitPower.x)*randoms.a;\n#ifdef LOCAL\noutPosition=newPosition;\n#else\noutPosition=(emitterWM*vec4(newPosition,1.)).xyz;\n#endif\n#ifdef CUSTOMEMITTER\noutDirection=direction;\n#ifndef BILLBOARD \noutInitialDirection=direction;\n#endif\n#else\n#ifdef LOCAL\nvec3 initial=newDirection;\n#else \nvec3 initial=(emitterWM*vec4(newDirection,0.)).xyz;\n#endif\noutDirection=initial*power;\n#ifndef BILLBOARD \noutInitialDirection=initial;\n#endif\n#endif\n#ifdef ANIMATESHEET \noutCellIndex=cellInfos.x;\n#ifdef ANIMATESHEETRANDOMSTART\noutCellStartOffset=randoms.a*outLife;\n#endif \n#endif\n#ifdef NOISE\noutNoiseCoordinates1=noiseCoordinates1;\noutNoiseCoordinates2=noiseCoordinates2;\n#endif\n} else {\nfloat directionScale=timeDelta;\noutAge=newAge;\nfloat ageGradient=newAge/life;\n#ifdef VELOCITYGRADIENTS\ndirectionScale*=texture(velocityGradientSampler,vec2(ageGradient,0)).r;\n#endif\n#ifdef DRAGGRADIENTS\ndirectionScale*=1.0-texture(dragGradientSampler,vec2(ageGradient,0)).r;\n#endif\n#if defined(CUSTOMEMITTER)\noutPosition=position+(direction-position)*ageGradient; \noutInitialPosition=initialPosition;\n#else\noutPosition=position+direction*directionScale;\n#endif\noutLife=life;\noutSeed=seed;\n#ifndef COLORGRADIENTS \noutColor=color;\n#endif\n#ifdef SIZEGRADIENTS\noutSize.x=texture(sizeGradientSampler,vec2(ageGradient,0)).r;\noutSize.yz=size.yz;\n#else\noutSize=size;\n#endif \n#ifndef BILLBOARD \noutInitialDirection=initialDirection;\n#endif\n#ifdef CUSTOMEMITTER\noutDirection=direction;\n#else\nvec3 updatedDirection=direction+gravity*timeDelta;\n#ifdef LIMITVELOCITYGRADIENTS\nfloat limitVelocity=texture(limitVelocityGradientSampler,vec2(ageGradient,0)).r;\nfloat currentVelocity=length(updatedDirection);\nif (currentVelocity>limitVelocity) {\nupdatedDirection=updatedDirection*limitVelocityDamping;\n}\n#endif\noutDirection=updatedDirection;\n#ifdef NOISE\nfloat fetchedR=texture(noiseSampler,vec2(noiseCoordinates1.x,noiseCoordinates1.y)*vec2(0.5)+vec2(0.5)).r;\nfloat fetchedG=texture(noiseSampler,vec2(noiseCoordinates1.z,noiseCoordinates2.x)*vec2(0.5)+vec2(0.5)).r;\nfloat fetchedB=texture(noiseSampler,vec2(noiseCoordinates2.y,noiseCoordinates2.z)*vec2(0.5)+vec2(0.5)).r;\nvec3 force=vec3(2.*fetchedR-1.,2.*fetchedG-1.,2.*fetchedB-1.)*noiseStrength;\noutDirection=outDirection+force*timeDelta;\noutNoiseCoordinates1=noiseCoordinates1;\noutNoiseCoordinates2=noiseCoordinates2;\n#endif \n#endif \n#ifdef ANGULARSPEEDGRADIENTS\nfloat angularSpeed=texture(angularSpeedGradientSampler,vec2(ageGradient,0)).r;\noutAngle=angle+angularSpeed*timeDelta;\n#else\noutAngle=vec2(angle.x+angle.y*timeDelta,angle.y);\n#endif\n#ifdef ANIMATESHEET \nfloat offsetAge=outAge;\nfloat dist=cellInfos.y-cellInfos.x;\n#ifdef ANIMATESHEETRANDOMSTART\noutCellStartOffset=cellStartOffset;\noffsetAge+=cellStartOffset;\n#else\nfloat cellStartOffset=0.;\n#endif \nfloat ratio=0.;\nif (cellInfos.w==1.0) {\nratio=clamp(mod(cellStartOffset+cellInfos.z*offsetAge,life)/life,0.,1.0);\n}\nelse {\nratio=clamp(cellStartOffset+cellInfos.z*offsetAge/life,0.,1.0);\n}\noutCellIndex=float(int(cellInfos.x+ratio*dist));\n#endif\n}\n}";class Yf{constructor(e,t){this._renderVAO=[],this._updateVAO=[],this.alignDataInBuffer=!1,this._parent=e,this._engine=t,this._updateEffectOptions={attributes:["position","initialPosition","age","life","seed","size","color","direction","initialDirection","angle","cellIndex","cellStartOffset","noiseCoordinates1","noiseCoordinates2"],uniformsNames:["currentCount","timeDelta","emitterWM","lifeTime","color1","color2","sizeRange","scaleRange","gravity","emitPower","direction1","direction2","minEmitBox","maxEmitBox","radius","directionRandomizer","height","coneAngle","stopFactor","angleRange","radiusRange","cellInfos","noiseStrength","limitVelocityDamping"],uniformBuffersNames:[],samplers:["randomSampler","randomSampler2","sizeGradientSampler","angularSpeedGradientSampler","velocityGradientSampler","limitVelocityGradientSampler","noiseSampler","dragGradientSampler"],defines:"",fallbacks:null,onCompiled:null,onError:null,indexParameters:null,maxSimultaneousLights:0,transformFeedbackVaryings:[]}}isUpdateBufferCreated(){return!!this._updateEffect}isUpdateBufferReady(){var e,t;return null!==(t=null===(e=this._updateEffect)||void 0===e?void 0:e.isReady())&&void 0!==t&&t}createUpdateBuffer(e){return this._updateEffectOptions.transformFeedbackVaryings=["outPosition"],this._updateEffectOptions.transformFeedbackVaryings.push("outAge"),this._updateEffectOptions.transformFeedbackVaryings.push("outSize"),this._updateEffectOptions.transformFeedbackVaryings.push("outLife"),this._updateEffectOptions.transformFeedbackVaryings.push("outSeed"),this._updateEffectOptions.transformFeedbackVaryings.push("outDirection"),this._parent.particleEmitterType instanceof Xf.E&&this._updateEffectOptions.transformFeedbackVaryings.push("outInitialPosition"),this._parent._colorGradientsTexture||this._updateEffectOptions.transformFeedbackVaryings.push("outColor"),this._parent._isBillboardBased||this._updateEffectOptions.transformFeedbackVaryings.push("outInitialDirection"),this._parent.noiseTexture&&(this._updateEffectOptions.transformFeedbackVaryings.push("outNoiseCoordinates1"),this._updateEffectOptions.transformFeedbackVaryings.push("outNoiseCoordinates2")),this._updateEffectOptions.transformFeedbackVaryings.push("outAngle"),this._parent.isAnimationSheetEnabled&&(this._updateEffectOptions.transformFeedbackVaryings.push("outCellIndex"),this._parent.spriteRandomStartCell&&this._updateEffectOptions.transformFeedbackVaryings.push("outCellStartOffset")),this._updateEffectOptions.defines=e,this._updateEffect=new ds.Q("gpuUpdateParticles",this._updateEffectOptions,this._engine),new jf(this._updateEffect)}createVertexBuffers(e,t){this._updateVAO.push(this._createUpdateVAO(e)),this._renderVAO.push(this._engine.recordVertexArrayObject(t,null,this._parent._getWrapper(this._parent.blendMode).effect)),this._engine.bindArrayBuffer(null)}createParticleBuffer(e){return e}bindDrawBuffers(e){this._engine.bindVertexArrayObject(this._renderVAO[e],null)}preUpdateParticleBuffer(){const e=this._engine;if(this._engine.enableEffect(this._updateEffect),!e.setState)throw new Error("GPU particles cannot work without a full Engine. ThinEngine is not supported")}updateParticleBuffer(e,t,i){this._updateEffect.setTexture("randomSampler",this._parent._randomTexture),this._updateEffect.setTexture("randomSampler2",this._parent._randomTexture2),this._parent._sizeGradientsTexture&&this._updateEffect.setTexture("sizeGradientSampler",this._parent._sizeGradientsTexture),this._parent._angularSpeedGradientsTexture&&this._updateEffect.setTexture("angularSpeedGradientSampler",this._parent._angularSpeedGradientsTexture),this._parent._velocityGradientsTexture&&this._updateEffect.setTexture("velocityGradientSampler",this._parent._velocityGradientsTexture),this._parent._limitVelocityGradientsTexture&&this._updateEffect.setTexture("limitVelocityGradientSampler",this._parent._limitVelocityGradientsTexture),this._parent._dragGradientsTexture&&this._updateEffect.setTexture("dragGradientSampler",this._parent._dragGradientsTexture),this._parent.noiseTexture&&this._updateEffect.setTexture("noiseSampler",this._parent.noiseTexture),this._engine.bindVertexArrayObject(this._updateVAO[e],null);const n=this._engine;n.bindTransformFeedbackBuffer(t.getBuffer()),n.setRasterizerState(!1),n.beginTransformFeedback(!0),n.drawArraysType(3,0,i),n.endTransformFeedback(),n.setRasterizerState(!0),n.bindTransformFeedbackBuffer(null)}releaseBuffers(){}releaseVertexBuffers(){for(let e=0;e<this._updateVAO.length;e++)this._engine.releaseVertexArrayObject(this._updateVAO[e]);this._updateVAO.length=0;for(let e=0;e<this._renderVAO.length;e++)this._engine.releaseVertexArrayObject(this._renderVAO[e]);this._renderVAO.length=0}_createUpdateVAO(e){const t={};t.position=e.createVertexBuffer("position",0,3);let i=3;t.age=e.createVertexBuffer("age",i,1),i+=1,t.size=e.createVertexBuffer("size",i,3),i+=3,t.life=e.createVertexBuffer("life",i,1),i+=1,t.seed=e.createVertexBuffer("seed",i,4),i+=4,t.direction=e.createVertexBuffer("direction",i,3),i+=3,this._parent.particleEmitterType instanceof Xf.E&&(t.initialPosition=e.createVertexBuffer("initialPosition",i,3),i+=3),this._parent._colorGradientsTexture||(t.color=e.createVertexBuffer("color",i,4),i+=4),this._parent._isBillboardBased||(t.initialDirection=e.createVertexBuffer("initialDirection",i,3),i+=3),this._parent.noiseTexture&&(t.noiseCoordinates1=e.createVertexBuffer("noiseCoordinates1",i,3),i+=3,t.noiseCoordinates2=e.createVertexBuffer("noiseCoordinates2",i,3),i+=3),this._parent._angularSpeedGradientsTexture?(t.angle=e.createVertexBuffer("angle",i,1),i+=1):(t.angle=e.createVertexBuffer("angle",i,2),i+=2),this._parent._isAnimationSheetEnabled&&(t.cellIndex=e.createVertexBuffer("cellIndex",i,1),i+=1,this._parent.spriteRandomStartCell&&(t.cellStartOffset=e.createVertexBuffer("cellStartOffset",i,1),i+=1));const n=this._engine.recordVertexArrayObject(t,null,this._updateEffect);return this._engine.bindArrayBuffer(null),n}}(0,l.H)("BABYLON.WebGL2ParticleSystem",Yf);si.v.ShadersStoreWGSL.gpuUpdateParticlesComputeShader="struct Particle {\nposition : vec3<f32>,\nage : f32,\nsize : vec3<f32>,\nlife : f32,\nseed : vec4<f32>,\ndirection : vec3<f32>,\ndummy0: f32,\n#ifdef CUSTOMEMITTER\ninitialPosition : vec3<f32>,\ndummy1: f32,\n#endif\n#ifndef COLORGRADIENTS\ncolor : vec4<f32>,\n#endif\n#ifndef BILLBOARD\ninitialDirection : vec3<f32>,\ndummy2: f32,\n#endif\n#ifdef NOISE\nnoiseCoordinates1 : vec3<f32>,\ndummy3: f32,\nnoiseCoordinates2 : vec3<f32>,\ndummy4: f32,\n#endif\n#ifdef ANGULARSPEEDGRADIENTS\nangle : f32,\n#else\nangle : vec2<f32>,\n#endif\n#ifdef ANIMATESHEET\ncellIndex : f32,\n#ifdef ANIMATESHEETRANDOMSTART\ncellStartOffset : f32,\n#endif\n#endif\n};\nstruct Particles {\nparticles : array<Particle>,\n};\nstruct SimParams {\ncurrentCount : f32,\ntimeDelta : f32,\nstopFactor : f32,\nrandomTextureSize: i32,\nlifeTime : vec2<f32>,\nemitPower : vec2<f32>,\n#ifndef COLORGRADIENTS\ncolor1 : vec4<f32>,\ncolor2 : vec4<f32>,\n#endif\nsizeRange : vec2<f32>,\nscaleRange : vec4<f32>,\nangleRange : vec4<f32>,\ngravity : vec3<f32>,\n#ifdef LIMITVELOCITYGRADIENTS\nlimitVelocityDamping : f32,\n#endif\n#ifdef ANIMATESHEET\ncellInfos : vec4<f32>,\n#endif\n#ifdef NOISE\nnoiseStrength : vec3<f32>,\n#endif\n#ifndef LOCAL\nemitterWM : mat4x4<f32>,\n#endif\n#ifdef BOXEMITTER\ndirection1 : vec3<f32>,\ndirection2 : vec3<f32>,\nminEmitBox : vec3<f32>,\nmaxEmitBox : vec3<f32>,\n#endif\n#ifdef CONEEMITTER\nradius : vec2<f32>,\nconeAngle : f32,\nheight : vec2<f32>,\ndirectionRandomizer : f32,\n#endif\n#ifdef CYLINDEREMITTER\nradius : f32,\nheight : f32,\nradiusRange : f32,\n#ifdef DIRECTEDCYLINDEREMITTER\ndirection1 : vec3<f32>,\ndirection2 : vec3<f32>,\n#else\ndirectionRandomizer : f32,\n#endif\n#endif\n#ifdef HEMISPHERICEMITTER\nradius : f32,\nradiusRange : f32,\ndirectionRandomizer : f32,\n#endif\n#ifdef POINTEMITTER\ndirection1 : vec3<f32>,\ndirection2 : vec3<f32>,\n#endif\n#ifdef SPHEREEMITTER\nradius : f32,\nradiusRange : f32,\n#ifdef DIRECTEDSPHEREEMITTER\ndirection1 : vec3<f32>,\ndirection2 : vec3<f32>,\n#else\ndirectionRandomizer : f32,\n#endif\n#endif\n};\n@binding(0) @group(0) var<uniform> params : SimParams;\n@binding(1) @group(0) var<storage,read> particlesIn : Particles;\n@binding(2) @group(0) var<storage,read_write> particlesOut : Particles;\n@binding(3) @group(0) var randomTexture : texture_2d<f32>;\n@binding(4) @group(0) var randomTexture2 : texture_2d<f32>;\n#ifdef SIZEGRADIENTS\n@binding(0) @group(1) var sizeGradientSampler : sampler;\n@binding(1) @group(1) var sizeGradientTexture : texture_2d<f32>;\n#endif \n#ifdef ANGULARSPEEDGRADIENTS\n@binding(2) @group(1) var angularSpeedGradientSampler : sampler;\n@binding(3) @group(1) var angularSpeedGradientTexture : texture_2d<f32>;\n#endif \n#ifdef VELOCITYGRADIENTS\n@binding(4) @group(1) var velocityGradientSampler : sampler;\n@binding(5) @group(1) var velocityGradientTexture : texture_2d<f32>;\n#endif\n#ifdef LIMITVELOCITYGRADIENTS\n@binding(6) @group(1) var limitVelocityGradientSampler : sampler;\n@binding(7) @group(1) var limitVelocityGradientTexture : texture_2d<f32>;\n#endif\n#ifdef DRAGGRADIENTS\n@binding(8) @group(1) var dragGradientSampler : sampler;\n@binding(9) @group(1) var dragGradientTexture : texture_2d<f32>;\n#endif\n#ifdef NOISE\n@binding(10) @group(1) var noiseSampler : sampler;\n@binding(11) @group(1) var noiseTexture : texture_2d<f32>;\n#endif\nfn getRandomVec3(offset : f32,vertexID : f32)->vec3<f32> {\nreturn textureLoad(randomTexture2,vec2<i32>(i32(vertexID*offset/params.currentCount*f32(params.randomTextureSize)) % params.randomTextureSize,0),0).rgb;\n}\nfn getRandomVec4(offset : f32,vertexID : f32)->vec4<f32> {\nreturn textureLoad(randomTexture,vec2<i32>(i32(vertexID*offset/params.currentCount*f32(params.randomTextureSize)) % params.randomTextureSize,0),0);\n}\n@compute @workgroup_size(64)\nfn main(@builtin(global_invocation_id) GlobalInvocationID : vec3<u32>) {\nlet index : u32=GlobalInvocationID.x;\nlet vertexID : f32=f32(index);\nif (index>=u32(params.currentCount)) {\nreturn;\n}\nlet PI : f32=3.14159;\nlet timeDelta : f32=params.timeDelta;\nlet newAge : f32=particlesIn.particles[index].age+timeDelta;\nlet life : f32=particlesIn.particles[index].life;\nlet seed : vec4<f32>=particlesIn.particles[index].seed;\nlet direction : vec3<f32>=particlesIn.particles[index].direction;\nif (newAge>=life && params.stopFactor != 0.) {\nvar newPosition : vec3<f32>;\nvar newDirection : vec3<f32>;\nlet randoms : vec4<f32>=getRandomVec4(seed.x,vertexID);\nlet outLife : f32=params.lifeTime.x+(params.lifeTime.y-params.lifeTime.x)*randoms.r;\nparticlesOut.particles[index].life=outLife;\nparticlesOut.particles[index].age=newAge-life;\nparticlesOut.particles[index].seed=seed;\nvar sizex : f32;\n#ifdef SIZEGRADIENTS \nsizex=textureSampleLevel(sizeGradientTexture,sizeGradientSampler,vec2<f32>(0.,0.),0.).r;\n#else\nsizex=params.sizeRange.x+(params.sizeRange.y-params.sizeRange.x)*randoms.g;\n#endif\nparticlesOut.particles[index].size=vec3<f32>(\nsizex,\nparams.scaleRange.x+(params.scaleRange.y-params.scaleRange.x)*randoms.b,\nparams.scaleRange.z+(params.scaleRange.w-params.scaleRange.z)*randoms.a);\n#ifndef COLORGRADIENTS\nparticlesOut.particles[index].color=params.color1+(params.color2-params.color1)*randoms.b;\n#endif\n#ifndef ANGULARSPEEDGRADIENTS \nparticlesOut.particles[index].angle=vec2<f32>(\nparams.angleRange.z+(params.angleRange.w-params.angleRange.z)*randoms.r,\nparams.angleRange.x+(params.angleRange.y-params.angleRange.x)*randoms.a);\n#else\nparticlesOut.particles[index].angle=params.angleRange.z+(params.angleRange.w-params.angleRange.z)*randoms.r;\n#endif \n#if defined(POINTEMITTER)\nlet randoms2 : vec3<f32>=getRandomVec3(seed.y,vertexID);\nlet randoms3 : vec3<f32>=getRandomVec3(seed.z,vertexID);\nnewPosition=vec3<f32>(0.,0.,0.);\nnewDirection=params.direction1+(params.direction2-params.direction1)*randoms3;\n#elif defined(BOXEMITTER)\nlet randoms2 : vec3<f32>=getRandomVec3(seed.y,vertexID);\nlet randoms3 : vec3<f32>=getRandomVec3(seed.z,vertexID);\nnewPosition=params.minEmitBox+(params.maxEmitBox-params.minEmitBox)*randoms2;\nnewDirection=params.direction1+(params.direction2-params.direction1)*randoms3; \n#elif defined(HEMISPHERICEMITTER)\nlet randoms2 : vec3<f32>=getRandomVec3(seed.y,vertexID);\nlet randoms3 : vec3<f32>=getRandomVec3(seed.z,vertexID);\nlet phi : f32=2.0*PI*randoms2.x;\nlet theta : f32=acos(-1.0+2.0*randoms2.y);\nlet randX : f32=cos(phi)*sin(theta);\nlet randY : f32=cos(theta);\nlet randZ : f32=sin(phi)*sin(theta);\nnewPosition=(params.radius-(params.radius*params.radiusRange*randoms2.z))*vec3<f32>(randX,abs(randY),randZ);\nnewDirection=normalize(newPosition+params.directionRandomizer*randoms3);\n#elif defined(SPHEREEMITTER)\nlet randoms2 : vec3<f32>=getRandomVec3(seed.y,vertexID);\nlet randoms3 : vec3<f32>=getRandomVec3(seed.z,vertexID);\nlet phi : f32=2.0*PI*randoms2.x;\nlet theta : f32=acos(-1.0+2.0*randoms2.y);\nlet randX : f32=cos(phi)*sin(theta);\nlet randY : f32=cos(theta);\nlet randZ : f32=sin(phi)*sin(theta);\nnewPosition=(params.radius-(params.radius*params.radiusRange*randoms2.z))*vec3<f32>(randX,randY,randZ);\n#ifdef DIRECTEDSPHEREEMITTER\nnewDirection=normalize(params.direction1+(params.direction2-params.direction1)*randoms3);\n#else\nnewDirection=normalize(newPosition+params.directionRandomizer*randoms3);\n#endif\n#elif defined(CYLINDEREMITTER)\nlet randoms2 : vec3<f32>=getRandomVec3(seed.y,vertexID);\nlet randoms3 : vec3<f32>=getRandomVec3(seed.z,vertexID);\nlet yPos : f32=(-0.5+randoms2.x)*params.height;\nvar angle : f32=randoms2.y*PI*2.;\nlet inverseRadiusRangeSquared : f32=(1.-params.radiusRange)*(1.-params.radiusRange);\nlet positionRadius : f32=params.radius*sqrt(inverseRadiusRangeSquared+randoms2.z*(1.-inverseRadiusRangeSquared));\nlet xPos : f32=positionRadius*cos(angle);\nlet zPos : f32=positionRadius*sin(angle);\nnewPosition=vec3<f32>(xPos,yPos,zPos);\n#ifdef DIRECTEDCYLINDEREMITTER\nnewDirection=params.direction1+(params.direction2-params.direction1)*randoms3;\n#else\nangle=angle+(-0.5+randoms3.x)*PI*params.directionRandomizer;\nnewDirection=vec3<f32>(cos(angle),(-0.5+randoms3.y)*params.directionRandomizer,sin(angle));\nnewDirection=normalize(newDirection);\n#endif\n#elif defined(CONEEMITTER)\nlet randoms2 : vec3<f32>=getRandomVec3(seed.y,vertexID);\nlet s : f32=2.0*PI*randoms2.x;\n#ifdef CONEEMITTERSPAWNPOINT\nlet h : f32=0.0001;\n#else\nvar h : f32=randoms2.y*params.height.y;\nh=1.-h*h; \n#endif\nvar lRadius : f32=params.radius.x-params.radius.x*randoms2.z*params.radius.y;\nlRadius=lRadius*h;\nlet randX : f32=lRadius*sin(s);\nlet randZ : f32=lRadius*cos(s);\nlet randY : f32=h *params.height.x;\nnewPosition=vec3<f32>(randX,randY,randZ); \nif (abs(cos(params.coneAngle))==1.0) {\nnewDirection=vec3<f32>(0.,1.0,0.);\n} else {\nlet randoms3 : vec3<f32>=getRandomVec3(seed.z,vertexID);\nnewDirection=normalize(newPosition+params.directionRandomizer*randoms3); \n}\n#elif defined(CUSTOMEMITTER)\nnewPosition=particlesIn.particles[index].initialPosition;\nparticlesOut.particles[index].initialPosition=newPosition;\n#else \nnewPosition=vec3<f32>(0.,0.,0.);\nnewDirection=2.0*(getRandomVec3(seed.w,vertexID)-vec3<f32>(0.5,0.5,0.5));\n#endif\nlet power : f32=params.emitPower.x+(params.emitPower.y-params.emitPower.x)*randoms.a;\n#ifdef LOCAL\nparticlesOut.particles[index].position=newPosition;\n#else\nparticlesOut.particles[index].position=(params.emitterWM*vec4<f32>(newPosition,1.)).xyz;\n#endif\n#ifdef CUSTOMEMITTER\nparticlesOut.particles[index].direction=direction;\n#ifndef BILLBOARD \nparticlesOut.particles[index].initialDirection=direction;\n#endif\n#else\n#ifdef LOCAL\nlet initial : vec3<f32>=newDirection;\n#else \nlet initial : vec3<f32>=(params.emitterWM*vec4<f32>(newDirection,0.)).xyz;\n#endif\nparticlesOut.particles[index].direction=initial*power;\n#ifndef BILLBOARD \nparticlesOut.particles[index].initialDirection=initial;\n#endif\n#endif\n#ifdef ANIMATESHEET \nparticlesOut.particles[index].cellIndex=params.cellInfos.x;\n#ifdef ANIMATESHEETRANDOMSTART\nparticlesOut.particles[index].cellStartOffset=randoms.a*outLife;\n#endif \n#endif\n#ifdef NOISE\nparticlesOut.particles[index].noiseCoordinates1=particlesIn.particles[index].noiseCoordinates1;\nparticlesOut.particles[index].noiseCoordinates2=particlesIn.particles[index].noiseCoordinates2;\n#endif\n} else {\nvar directionScale : f32=timeDelta;\nparticlesOut.particles[index].age=newAge;\nlet ageGradient : f32=newAge/life;\n#ifdef VELOCITYGRADIENTS\ndirectionScale=directionScale*textureSampleLevel(velocityGradientTexture,velocityGradientSampler,vec2<f32>(ageGradient,0.),0.).r;\n#endif\n#ifdef DRAGGRADIENTS\ndirectionScale=directionScale*(1.0-textureSampleLevel(dragGradientTexture,dragGradientSampler,vec2<f32>(ageGradient,0.),0.).r);\n#endif\nlet position : vec3<f32>=particlesIn.particles[index].position;\n#if defined(CUSTOMEMITTER)\nparticlesOut.particles[index].position=position+(direction-position)*ageGradient; \nparticlesOut.particles[index].initialPosition=particlesIn.particles[index].initialPosition;\n#else\nparticlesOut.particles[index].position=position+direction*directionScale;\n#endif\nparticlesOut.particles[index].life=life;\nparticlesOut.particles[index].seed=seed;\n#ifndef COLORGRADIENTS \nparticlesOut.particles[index].color=particlesIn.particles[index].color;\n#endif\n#ifdef SIZEGRADIENTS\nparticlesOut.particles[index].size=vec3<f32>(\ntextureSampleLevel(sizeGradientTexture,sizeGradientSampler,vec2<f32>(ageGradient,0.),0.).r,\nparticlesIn.particles[index].size.yz);\n#else\nparticlesOut.particles[index].size=particlesIn.particles[index].size;\n#endif \n#ifndef BILLBOARD \nparticlesOut.particles[index].initialDirection=particlesIn.particles[index].initialDirection;\n#endif\n#ifdef CUSTOMEMITTER\nparticlesOut.particles[index].direction=direction;\n#else\nvar updatedDirection : vec3<f32>=direction+params.gravity*timeDelta;\n#ifdef LIMITVELOCITYGRADIENTS\nlet limitVelocity : f32=textureSampleLevel(limitVelocityGradientTexture,limitVelocityGradientSampler,vec2<f32>(ageGradient,0.),0.).r;\nlet currentVelocity : f32=length(updatedDirection);\nif (currentVelocity>limitVelocity) {\nupdatedDirection=updatedDirection*params.limitVelocityDamping;\n}\n#endif\nparticlesOut.particles[index].direction=updatedDirection;\n#ifdef NOISE\nlet noiseCoordinates1 : vec3<f32>=particlesIn.particles[index].noiseCoordinates1;\nlet noiseCoordinates2 : vec3<f32>=particlesIn.particles[index].noiseCoordinates2;\nlet fetchedR : f32=textureSampleLevel(noiseTexture,noiseSampler,vec2<f32>(noiseCoordinates1.x,noiseCoordinates1.y)*vec2<f32>(0.5,0.5)+vec2<f32>(0.5,0.5),0.).r;\nlet fetchedG : f32=textureSampleLevel(noiseTexture,noiseSampler,vec2<f32>(noiseCoordinates1.z,noiseCoordinates2.x)*vec2<f32>(0.5,0.5)+vec2<f32>(0.5,0.5),0.).r;\nlet fetchedB : f32=textureSampleLevel(noiseTexture,noiseSampler,vec2<f32>(noiseCoordinates2.y,noiseCoordinates2.z)*vec2<f32>(0.5,0.5)+vec2<f32>(0.5,0.5),0.).r;\nlet force : vec3<f32>=vec3<f32>(-1.+2.*fetchedR,-1.+2.*fetchedG,-1.+2.*fetchedB)*params.noiseStrength;\nparticlesOut.particles[index].direction=particlesOut.particles[index].direction+force*timeDelta;\nparticlesOut.particles[index].noiseCoordinates1=noiseCoordinates1;\nparticlesOut.particles[index].noiseCoordinates2=noiseCoordinates2;\n#endif \n#endif \n#ifdef ANGULARSPEEDGRADIENTS\nlet angularSpeed : f32=textureSampleLevel(angularSpeedGradientTexture,angularSpeedGradientSampler,vec2<f32>(ageGradient,0.),0.).r;\nparticlesOut.particles[index].angle=particlesIn.particles[index].angle+angularSpeed*timeDelta;\n#else\nlet angle : vec2<f32>=particlesIn.particles[index].angle;\nparticlesOut.particles[index].angle=vec2<f32>(angle.x+angle.y*timeDelta,angle.y);\n#endif\n#ifdef ANIMATESHEET \nvar offsetAge : f32=particlesOut.particles[index].age;\nlet dist : f32=params.cellInfos.y-params.cellInfos.x;\n#ifdef ANIMATESHEETRANDOMSTART\nlet cellStartOffset : f32=particlesIn.particles[index].cellStartOffset;\nparticlesOut.particles[index].cellStartOffset=cellStartOffset;\noffsetAge=offsetAge+cellStartOffset;\n#else\nlet cellStartOffset : f32=0.;\n#endif \nvar ratio : f32;\nif (params.cellInfos.w==1.0) {\nratio=clamp(((cellStartOffset+params.cellInfos.z*offsetAge) % life)/life,0.,1.0);\n}\nelse {\nratio=clamp((cellStartOffset+params.cellInfos.z*offsetAge)/life,0.,1.0);\n}\nparticlesOut.particles[index].cellIndex=f32(i32(params.cellInfos.x+ratio*dist));\n#endif\n}\n}\n";class qf{constructor(e,t){this._bufferComputeShader=[],this._renderVertexBuffers=[],this.alignDataInBuffer=!0,this._parent=e,this._engine=t}isUpdateBufferCreated(){return!!this._updateComputeShader}isUpdateBufferReady(){var e,t;return null!==(t=null===(e=this._updateComputeShader)||void 0===e?void 0:e.isReady())&&void 0!==t&&t}createUpdateBuffer(e){var t;const i={params:{group:0,binding:0},particlesIn:{group:0,binding:1},particlesOut:{group:0,binding:2},randomTexture:{group:0,binding:3},randomTexture2:{group:0,binding:4}};return this._parent._sizeGradientsTexture&&(i.sizeGradientTexture={group:1,binding:1}),this._parent._angularSpeedGradientsTexture&&(i.angularSpeedGradientTexture={group:1,binding:3}),this._parent._velocityGradientsTexture&&(i.velocityGradientTexture={group:1,binding:5}),this._parent._limitVelocityGradientsTexture&&(i.limitVelocityGradientTexture={group:1,binding:7}),this._parent._dragGradientsTexture&&(i.dragGradientTexture={group:1,binding:9}),this._parent.noiseTexture&&(i.noiseTexture={group:1,binding:11}),this._updateComputeShader=new Dn("updateParticles",this._engine,"gpuUpdateParticles",{bindingsMapping:i,defines:e.split("\n")}),null===(t=this._simParamsComputeShader)||void 0===t||t.dispose(),this._simParamsComputeShader=new Ci.M(this._engine),this._simParamsComputeShader.addUniform("currentCount",1),this._simParamsComputeShader.addUniform("timeDelta",1),this._simParamsComputeShader.addUniform("stopFactor",1),this._simParamsComputeShader.addUniform("randomTextureSize",1),this._simParamsComputeShader.addUniform("lifeTime",2),this._simParamsComputeShader.addUniform("emitPower",2),this._parent._colorGradientsTexture||(this._simParamsComputeShader.addUniform("color1",4),this._simParamsComputeShader.addUniform("color2",4)),this._simParamsComputeShader.addUniform("sizeRange",2),this._simParamsComputeShader.addUniform("scaleRange",4),this._simParamsComputeShader.addUniform("angleRange",4),this._simParamsComputeShader.addUniform("gravity",3),this._parent._limitVelocityGradientsTexture&&this._simParamsComputeShader.addUniform("limitVelocityDamping",1),this._parent.isAnimationSheetEnabled&&this._simParamsComputeShader.addUniform("cellInfos",4),this._parent.noiseTexture&&this._simParamsComputeShader.addUniform("noiseStrength",3),this._parent.isLocal||this._simParamsComputeShader.addUniform("emitterWM",16),this._parent.particleEmitterType&&this._parent.particleEmitterType.buildUniformLayout(this._simParamsComputeShader),this._updateComputeShader.setUniformBuffer("params",this._simParamsComputeShader),new jf(this._simParamsComputeShader)}createVertexBuffers(e,t){this._renderVertexBuffers.push(t)}createParticleBuffer(e){const t=new $e(this._engine,4*e.length,11);return t.update(e),this._bufferComputeShader.push(t),t.getBuffer()}bindDrawBuffers(e,t){this._engine.bindBuffers(this._renderVertexBuffers[e],null,t)}preUpdateParticleBuffer(){}updateParticleBuffer(e,t,i){this._simParamsComputeShader.update(),this._updateComputeShader.setTexture("randomTexture",this._parent._randomTexture,!1),this._updateComputeShader.setTexture("randomTexture2",this._parent._randomTexture2,!1),this._parent._sizeGradientsTexture&&this._updateComputeShader.setTexture("sizeGradientTexture",this._parent._sizeGradientsTexture),this._parent._angularSpeedGradientsTexture&&this._updateComputeShader.setTexture("angularSpeedGradientTexture",this._parent._angularSpeedGradientsTexture),this._parent._velocityGradientsTexture&&this._updateComputeShader.setTexture("velocityGradientTexture",this._parent._velocityGradientsTexture),this._parent._limitVelocityGradientsTexture&&this._updateComputeShader.setTexture("limitVelocityGradientTexture",this._parent._limitVelocityGradientsTexture),this._parent._dragGradientsTexture&&this._updateComputeShader.setTexture("dragGradientTexture",this._parent._dragGradientsTexture),this._parent.noiseTexture&&this._updateComputeShader.setTexture("noiseTexture",this._parent.noiseTexture),this._updateComputeShader.setStorageBuffer("particlesIn",this._bufferComputeShader[e]),this._updateComputeShader.setStorageBuffer("particlesOut",this._bufferComputeShader[1^e]),this._updateComputeShader.dispatch(Math.ceil(i/64))}releaseBuffers(){var e;for(let e=0;e<this._bufferComputeShader.length;++e)this._bufferComputeShader[e].dispose();this._bufferComputeShader.length=0,null===(e=this._simParamsComputeShader)||void 0===e||e.dispose(),this._simParamsComputeShader=null,this._updateComputeShader=null}releaseVertexBuffers(){this._renderVertexBuffers.length=0}}(0,l.H)("BABYLON.ComputeShaderParticleSystem",qf);class Kf{constructor(e,t,i){this.gradient=e,this.color1=t,this.color2=i}getColorToRef(e){this.color2?a.HE.LerpToRef(this.color1,this.color2,Math.random(),e):e.copyFrom(this.color1)}}class $f{constructor(e,t){this.gradient=e,this.color=t}}class Qf{constructor(e,t,i){this.gradient=e,this.factor1=t,this.factor2=i}getFactor(){return void 0===this.factor2||this.factor2===this.factor1?this.factor1:this.factor1+(this.factor2-this.factor1)*Math.random()}}class Zf{static GetCurrentGradient(e,t,i){if(t[0].gradient>e)return void i(t[0],t[0],1);for(let n=0;n<t.length-1;n++){const s=t[n],r=t[n+1];if(e>=s.gradient&&e<=r.gradient)return void i(s,r,(e-s.gradient)/(r.gradient-s.gradient))}const n=t.length-1;i(t[n],t[n],1)}}class Jf{constructor(e){this.particleSystem=e,this.position=o.P.Zero(),this.direction=o.P.Zero(),this.color=new a.HE(0,0,0,0),this.colorStep=new a.HE(0,0,0,0),this.lifeTime=1,this.age=0,this.size=0,this.scale=new o.FM(1,1),this.angle=0,this.angularSpeed=0,this.cellIndex=0,this._attachedSubEmitters=null,this._currentColor1=new a.HE(0,0,0,0),this._currentColor2=new a.HE(0,0,0,0),this._currentSize1=0,this._currentSize2=0,this._currentAngularSpeed1=0,this._currentAngularSpeed2=0,this._currentVelocity1=0,this._currentVelocity2=0,this._currentLimitVelocity1=0,this._currentLimitVelocity2=0,this._currentDrag1=0,this._currentDrag2=0,this.id=Jf._Count++,this.particleSystem.isAnimationSheetEnabled&&this._updateCellInfoFromSystem()}_updateCellInfoFromSystem(){this.cellIndex=this.particleSystem.startSpriteCellID}updateCellIndex(){let e=this.age,t=this.particleSystem.spriteCellChangeSpeed;this.particleSystem.spriteRandomStartCell&&(void 0===this._randomCellOffset&&(this._randomCellOffset=Math.random()*this.lifeTime),0===t?(t=1,e=this._randomCellOffset):e+=this._randomCellOffset);const i=this._initialEndSpriteCellID-this._initialStartSpriteCellID;let n;n=this._initialSpriteCellLoop?lt.R.Clamp(e*t%this.lifeTime/this.lifeTime):lt.R.Clamp(e*t/this.lifeTime),this.cellIndex=this._initialStartSpriteCellID+n*i|0}_inheritParticleInfoToSubEmitter(e){if(e.particleSystem.emitter.position){const t=e.particleSystem.emitter;if(t.position.copyFrom(this.position),e.inheritDirection){const e=o.jp.Vector3[0];this.direction.normalizeToRef(e),t.setDirection(e,0,Math.PI/2)}}else e.particleSystem.emitter.copyFrom(this.position);this.direction.scaleToRef(e.inheritedVelocityAmount/2,o.jp.Vector3[0]),e.particleSystem._inheritedVelocityOffset.copyFrom(o.jp.Vector3[0])}_inheritParticleInfoToSubEmitters(){this._attachedSubEmitters&&this._attachedSubEmitters.length>0&&this._attachedSubEmitters.forEach((e=>{this._inheritParticleInfoToSubEmitter(e)}))}_reset(){this.age=0,this.id=Jf._Count++,this._currentColorGradient=null,this._currentSizeGradient=null,this._currentAngularSpeedGradient=null,this._currentVelocityGradient=null,this._currentLimitVelocityGradient=null,this._currentDragGradient=null,this.cellIndex=this.particleSystem.startSpriteCellID,this._randomCellOffset=void 0}copyTo(e){e.position.copyFrom(this.position),this._initialDirection?e._initialDirection?e._initialDirection.copyFrom(this._initialDirection):e._initialDirection=this._initialDirection.clone():e._initialDirection=null,e.direction.copyFrom(this.direction),this._localPosition&&(e._localPosition?e._localPosition.copyFrom(this._localPosition):e._localPosition=this._localPosition.clone()),e.color.copyFrom(this.color),e.colorStep.copyFrom(this.colorStep),e.lifeTime=this.lifeTime,e.age=this.age,e._randomCellOffset=this._randomCellOffset,e.size=this.size,e.scale.copyFrom(this.scale),e.angle=this.angle,e.angularSpeed=this.angularSpeed,e.particleSystem=this.particleSystem,e.cellIndex=this.cellIndex,e.id=this.id,e._attachedSubEmitters=this._attachedSubEmitters,this._currentColorGradient&&(e._currentColorGradient=this._currentColorGradient,e._currentColor1.copyFrom(this._currentColor1),e._currentColor2.copyFrom(this._currentColor2)),this._currentSizeGradient&&(e._currentSizeGradient=this._currentSizeGradient,e._currentSize1=this._currentSize1,e._currentSize2=this._currentSize2),this._currentAngularSpeedGradient&&(e._currentAngularSpeedGradient=this._currentAngularSpeedGradient,e._currentAngularSpeed1=this._currentAngularSpeed1,e._currentAngularSpeed2=this._currentAngularSpeed2),this._currentVelocityGradient&&(e._currentVelocityGradient=this._currentVelocityGradient,e._currentVelocity1=this._currentVelocity1,e._currentVelocity2=this._currentVelocity2),this._currentLimitVelocityGradient&&(e._currentLimitVelocityGradient=this._currentLimitVelocityGradient,e._currentLimitVelocity1=this._currentLimitVelocity1,e._currentLimitVelocity2=this._currentLimitVelocity2),this._currentDragGradient&&(e._currentDragGradient=this._currentDragGradient,e._currentDrag1=this._currentDrag1,e._currentDrag2=this._currentDrag2),this.particleSystem.isAnimationSheetEnabled&&(e._initialStartSpriteCellID=this._initialStartSpriteCellID,e._initialEndSpriteCellID=this._initialEndSpriteCellID,e._initialSpriteCellLoop=this._initialSpriteCellLoop),this.particleSystem.useRampGradients&&(e.remapData&&this.remapData?e.remapData.copyFrom(this.remapData):e.remapData=new o.Lt(0,0,0,0)),this._randomNoiseCoordinates1&&(e._randomNoiseCoordinates1?(e._randomNoiseCoordinates1.copyFrom(this._randomNoiseCoordinates1),e._randomNoiseCoordinates2.copyFrom(this._randomNoiseCoordinates2)):(e._randomNoiseCoordinates1=this._randomNoiseCoordinates1.clone(),e._randomNoiseCoordinates2=this._randomNoiseCoordinates2.clone()))}}var e_;Jf._Count=0,function(e){e[e.ATTACHED=0]="ATTACHED",e[e.END=1]="END"}(e_||(e_={}));class t_{constructor(e){if(this.particleSystem=e,this.type=e_.END,this.inheritDirection=!1,this.inheritedVelocityAmount=0,!e.emitter||!e.emitter.dispose){const t=(0,l.q)("BABYLON.AbstractMesh");e.emitter=new t("SubemitterSystemEmitter",e.getScene()),e._disposeEmitterOnDispose=!0}}clone(){let e=this.particleSystem.emitter;e?e instanceof o.P?e=e.clone():-1!==e.getClassName().indexOf("Mesh")&&(e=new((0,l.q)("BABYLON.Mesh"))("",e.getScene()),e.isVisible=!1):e=new o.P;const t=new t_(this.particleSystem.clone(this.particleSystem.name,e));return t.particleSystem.name+="Clone",t.type=this.type,t.inheritDirection=this.inheritDirection,t.inheritedVelocityAmount=this.inheritedVelocityAmount,t.particleSystem._disposeEmitterOnDispose=!0,t.particleSystem.disposeOnStop=!0,t}serialize(e=!1){const t={};return t.type=this.type,t.inheritDirection=this.inheritDirection,t.inheritedVelocityAmount=this.inheritedVelocityAmount,t.particleSystem=this.particleSystem.serialize(e),t}static _ParseParticleSystem(e,t,i,n=!1){throw(0,Zl.S)("ParseParticle")}static Parse(e,t,i){const n=e.particleSystem,s=new t_(t_._ParseParticleSystem(n,t,i,!0));return s.type=e.type,s.inheritDirection=e.inheritDirection,s.inheritedVelocityAmount=e.inheritedVelocityAmount,s.particleSystem._isSubEmitter=!0,s}dispose(){this.particleSystem.dispose()}}i(1030),i(8773);si.v.ShadersStore.particlesPixelShader="#ifdef LOGARITHMICDEPTH\n#extension GL_EXT_frag_depth : enable\n#endif\nvarying vec2 vUV;\nvarying vec4 vColor;\nuniform vec4 textureMask;\nuniform sampler2D diffuseSampler;\n#include<clipPlaneFragmentDeclaration>\n#include<imageProcessingDeclaration>\n#include<logDepthDeclaration>\n#include<helperFunctions>\n#include<imageProcessingFunctions>\n#ifdef RAMPGRADIENT\nvarying vec4 remapRanges;\nuniform sampler2D rampSampler;\n#endif\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec4 textureColor=texture2D(diffuseSampler,vUV);\nvec4 baseColor=(textureColor*textureMask+(vec4(1.,1.,1.,1.)-textureMask))*vColor;\n#ifdef RAMPGRADIENT\nfloat alpha=baseColor.a;\nfloat remappedColorIndex=clamp((alpha-remapRanges.x)/remapRanges.y,0.0,1.0);\nvec4 rampColor=texture2D(rampSampler,vec2(1.0-remappedColorIndex,0.));\nbaseColor.rgb*=rampColor.rgb;\nfloat finalAlpha=baseColor.a;\nbaseColor.a=clamp((alpha*rampColor.a-remapRanges.z)/remapRanges.w,0.0,1.0);\n#endif\n#ifdef BLENDMULTIPLYMODE\nfloat sourceAlpha=vColor.a*textureColor.a;\nbaseColor.rgb=baseColor.rgb*sourceAlpha+vec3(1.0)*(1.0-sourceAlpha);\n#endif\n#include<logDepthFragment>\n#ifdef IMAGEPROCESSINGPOSTPROCESS\nbaseColor.rgb=toLinearSpace(baseColor.rgb);\n#else\n#ifdef IMAGEPROCESSING\nbaseColor.rgb=toLinearSpace(baseColor.rgb);\nbaseColor=applyImageProcessing(baseColor);\n#endif\n#endif\ngl_FragColor=baseColor;\n#define CUSTOM_FRAGMENT_MAIN_END\n}",i(5501);si.v.ShadersStore.particlesVertexShader="attribute vec3 position;\nattribute vec4 color;\nattribute float angle;\nattribute vec2 size;\n#ifdef ANIMATESHEET\nattribute float cellIndex;\n#endif\n#ifndef BILLBOARD\nattribute vec3 direction;\n#endif\n#ifdef BILLBOARDSTRETCHED\nattribute vec3 direction;\n#endif\n#ifdef RAMPGRADIENT\nattribute vec4 remapData;\n#endif\nattribute vec2 offset;\nuniform mat4 view;\nuniform mat4 projection;\nuniform vec2 translationPivot;\n#ifdef ANIMATESHEET\nuniform vec3 particlesInfos; \n#endif\nvarying vec2 vUV;\nvarying vec4 vColor;\nvarying vec3 vPositionW;\n#ifdef RAMPGRADIENT\nvarying vec4 remapRanges;\n#endif\n#if defined(BILLBOARD) && !defined(BILLBOARDY) && !defined(BILLBOARDSTRETCHED)\nuniform mat4 invView;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<logDepthDeclaration>\n#ifdef BILLBOARD\nuniform vec3 eyePosition;\n#endif\nvec3 rotate(vec3 yaxis,vec3 rotatedCorner) {\nvec3 xaxis=normalize(cross(vec3(0.,1.0,0.),yaxis));\nvec3 zaxis=normalize(cross(yaxis,xaxis));\nvec3 row0=vec3(xaxis.x,xaxis.y,xaxis.z);\nvec3 row1=vec3(yaxis.x,yaxis.y,yaxis.z);\nvec3 row2=vec3(zaxis.x,zaxis.y,zaxis.z);\nmat3 rotMatrix= mat3(row0,row1,row2);\nvec3 alignedCorner=rotMatrix*rotatedCorner;\nreturn position+alignedCorner;\n}\n#ifdef BILLBOARDSTRETCHED\nvec3 rotateAlign(vec3 toCamera,vec3 rotatedCorner) {\nvec3 normalizedToCamera=normalize(toCamera);\nvec3 normalizedCrossDirToCamera=normalize(cross(normalize(direction),normalizedToCamera));\nvec3 row0=vec3(normalizedCrossDirToCamera.x,normalizedCrossDirToCamera.y,normalizedCrossDirToCamera.z);\nvec3 row2=vec3(normalizedToCamera.x,normalizedToCamera.y,normalizedToCamera.z);\n#ifdef BILLBOARDSTRETCHED_LOCAL\nvec3 row1=direction;\n#else\nvec3 crossProduct=normalize(cross(normalizedToCamera,normalizedCrossDirToCamera));\nvec3 row1=vec3(crossProduct.x,crossProduct.y,crossProduct.z);\n#endif\nmat3 rotMatrix= mat3(row0,row1,row2);\nvec3 alignedCorner=rotMatrix*rotatedCorner;\nreturn position+alignedCorner;\n}\n#endif\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nvec2 cornerPos;\ncornerPos=(vec2(offset.x-0.5,offset.y -0.5)-translationPivot)*size+translationPivot;\n#ifdef BILLBOARD\nvec3 rotatedCorner;\n#ifdef BILLBOARDY\nrotatedCorner.x=cornerPos.x*cos(angle)-cornerPos.y*sin(angle);\nrotatedCorner.z=cornerPos.x*sin(angle)+cornerPos.y*cos(angle);\nrotatedCorner.y=0.;\nvec3 yaxis=position-eyePosition;\nyaxis.y=0.;\nvPositionW=rotate(normalize(yaxis),rotatedCorner);\nvec3 viewPos=(view*vec4(vPositionW,1.0)).xyz;\n#elif defined(BILLBOARDSTRETCHED)\nrotatedCorner.x=cornerPos.x*cos(angle)-cornerPos.y*sin(angle);\nrotatedCorner.y=cornerPos.x*sin(angle)+cornerPos.y*cos(angle);\nrotatedCorner.z=0.;\nvec3 toCamera=position-eyePosition;\nvPositionW=rotateAlign(toCamera,rotatedCorner);\nvec3 viewPos=(view*vec4(vPositionW,1.0)).xyz;\n#else\nrotatedCorner.x=cornerPos.x*cos(angle)-cornerPos.y*sin(angle);\nrotatedCorner.y=cornerPos.x*sin(angle)+cornerPos.y*cos(angle);\nrotatedCorner.z=0.;\nvec3 viewPos=(view*vec4(position,1.0)).xyz+rotatedCorner;\nvPositionW=(invView*vec4(viewPos,1)).xyz;\n#endif\n#ifdef RAMPGRADIENT\nremapRanges=remapData;\n#endif\ngl_Position=projection*vec4(viewPos,1.0);\n#else\nvec3 rotatedCorner;\nrotatedCorner.x=cornerPos.x*cos(angle)-cornerPos.y*sin(angle);\nrotatedCorner.z=cornerPos.x*sin(angle)+cornerPos.y*cos(angle);\nrotatedCorner.y=0.;\nvec3 yaxis=normalize(direction);\nvPositionW=rotate(yaxis,rotatedCorner);\ngl_Position=projection*view*vec4(vPositionW,1.0);\n#endif\nvColor=color;\n#ifdef ANIMATESHEET\nfloat rowOffset=floor(cellIndex*particlesInfos.z);\nfloat columnOffset=cellIndex-rowOffset/particlesInfos.z;\nvec2 uvScale=particlesInfos.xy;\nvec2 uvOffset=vec2(offset.x ,1.0-offset.y);\nvUV=(uvOffset+vec2(columnOffset,rowOffset))*uvScale;\n#else\nvUV=offset;\n#endif\n#if defined(CLIPPLANE) || defined(CLIPPLANE2) || defined(CLIPPLANE3) || defined(CLIPPLANE4) || defined(CLIPPLANE5) || defined(CLIPPLANE6)\nvec4 worldPos=vec4(vPositionW,1.0);\n#endif\n#include<clipPlaneVertex>\n#include<logDepthVertex>\n#define CUSTOM_VERTEX_MAIN_END\n}";class i_ extends Wf.U{set onDispose(e){this._onDisposeObserver&&this.onDisposeObservable.remove(this._onDisposeObserver),this._onDisposeObserver=this.onDisposeObservable.add(e)}get useRampGradients(){return this._useRampGradients}set useRampGradients(e){this._useRampGradients!==e&&(this._useRampGradients=e,this._resetEffect())}get particles(){return this._particles}getActiveCount(){return this._particles.length}getClassName(){return"ParticleSystem"}isStopping(){return this._stopped&&this.isAlive()}getCustomEffect(e=0){var t,i;return null!==(i=null===(t=this._customWrappers[e])||void 0===t?void 0:t.effect)&&void 0!==i?i:this._customWrappers[0].effect}_getCustomDrawWrapper(e=0){var t;return null!==(t=this._customWrappers[e])&&void 0!==t?t:this._customWrappers[0]}setCustomEffect(e,t=0){this._customWrappers[t]=new Ps.q(this._engine),this._customWrappers[t].effect=e,this._customWrappers[t].drawContext&&(this._customWrappers[t].drawContext.useInstancing=this._useInstancing)}get onBeforeDrawParticlesObservable(){return this._onBeforeDrawParticlesObservable||(this._onBeforeDrawParticlesObservable=new r.y$),this._onBeforeDrawParticlesObservable}get vertexShaderName(){return"particles"}get vertexBuffers(){return this._vertexBuffers}get indexBuffer(){return this._indexBuffer}constructor(e,t,i,n=null,s=!1,l=.01){super(e),this._emitterInverseWorldMatrix=o.y3.Identity(),this._inheritedVelocityOffset=new o.P,this.onDisposeObservable=new r.y$,this.onStoppedObservable=new r.y$,this._particles=new Array,this._stockParticles=new Array,this._newPartsExcess=0,this._vertexBuffers={},this._scaledColorStep=new a.HE(0,0,0,0),this._colorDiff=new a.HE(0,0,0,0),this._scaledDirection=o.P.Zero(),this._scaledGravity=o.P.Zero(),this._currentRenderId=-1,this._useInstancing=!1,this._started=!1,this._stopped=!1,this._actualFrame=0,this._currentEmitRate1=0,this._currentEmitRate2=0,this._currentStartSize1=0,this._currentStartSize2=0,this.updateInAnimate=!0,this._rawTextureWidth=256,this._useRampGradients=!1,this._disposeEmitterOnDispose=!1,this.isLocal=!1,this.isGPU=!1,this._onBeforeDrawParticlesObservable=null,this.recycleParticle=e=>{const t=this._particles.pop();t!==e&&t.copyTo(e),this._stockParticles.push(t)},this._createParticle=()=>{let e;if(0!==this._stockParticles.length?(e=this._stockParticles.pop(),e._reset()):e=new Jf(this),this._subEmitters&&this._subEmitters.length>0){const t=this._subEmitters[Math.floor(Math.random()*this._subEmitters.length)];e._attachedSubEmitters=[],t.forEach((t=>{if(t.type===e_.ATTACHED){const i=t.clone();e._attachedSubEmitters.push(i),i.particleSystem.start()}}))}return e},this._emitFromParticle=e=>{if(!this._subEmitters||0===this._subEmitters.length)return;const t=Math.floor(Math.random()*this._subEmitters.length);this._subEmitters[t].forEach((t=>{if(t.type===e_.END){const i=t.clone();e._inheritParticleInfoToSubEmitter(i),i.particleSystem._rootParticleSystem=this,this.activeSubSystems.push(i.particleSystem),i.particleSystem.start()}}))},this._capacity=t,this._epsilon=l,this._isAnimationSheetEnabled=s,i&&"Scene"!==i.getClassName()?(this._engine=i,this.defaultProjectionMatrix=o.y3.PerspectiveFovLH(.8,1,.1,100,this._engine.isNDCHalfZRange)):(this._scene=i||A.l.LastCreatedScene,this._engine=this._scene.getEngine(),this.uniqueId=this._scene.getUniqueId(),this._scene.particleSystems.push(this)),this._engine.getCaps().vertexArrayObject&&(this._vertexArrayObject=null),this._attachImageProcessingConfiguration(null),this._customWrappers={0:new Ps.q(this._engine)},this._customWrappers[0].effect=n,this._drawWrappers=[],this._useInstancing=this._engine.getCaps().instancedArrays,this._createIndexBuffer(),this._createVertexBuffers(),this.particleEmitterType=new Hf.S3;let h=null;this.updateFunction=e=>{var t;let i=null;this.noiseTexture&&(i=this.noiseTexture.getSize(),null===(t=this.noiseTexture.getContent())||void 0===t||t.then((e=>{h=e})));for(let t=0;t<e.length;t++){const n=e[t];let s=this._scaledUpdateSpeed;const r=n.age;if(n.age+=s,n.age>n.lifeTime){const e=n.age-r;s=(n.lifeTime-r)*s/e,n.age=n.lifeTime}const l=n.age/n.lifeTime;this._colorGradients&&this._colorGradients.length>0?Zf.GetCurrentGradient(l,this._colorGradients,((e,t,i)=>{e!==n._currentColorGradient&&(n._currentColor1.copyFrom(n._currentColor2),t.getColorToRef(n._currentColor2),n._currentColorGradient=e),a.HE.LerpToRef(n._currentColor1,n._currentColor2,i,n.color)})):(n.colorStep.scaleToRef(s,this._scaledColorStep),n.color.addInPlace(this._scaledColorStep),n.color.a<0&&(n.color.a=0)),this._angularSpeedGradients&&this._angularSpeedGradients.length>0&&Zf.GetCurrentGradient(l,this._angularSpeedGradients,((e,t,i)=>{e!==n._currentAngularSpeedGradient&&(n._currentAngularSpeed1=n._currentAngularSpeed2,n._currentAngularSpeed2=t.getFactor(),n._currentAngularSpeedGradient=e),n.angularSpeed=lt.R.Lerp(n._currentAngularSpeed1,n._currentAngularSpeed2,i)})),n.angle+=n.angularSpeed*s;let c=s;if(this._velocityGradients&&this._velocityGradients.length>0&&Zf.GetCurrentGradient(l,this._velocityGradients,((e,t,i)=>{e!==n._currentVelocityGradient&&(n._currentVelocity1=n._currentVelocity2,n._currentVelocity2=t.getFactor(),n._currentVelocityGradient=e),c*=lt.R.Lerp(n._currentVelocity1,n._currentVelocity2,i)})),n.direction.scaleToRef(c,this._scaledDirection),this._limitVelocityGradients&&this._limitVelocityGradients.length>0&&Zf.GetCurrentGradient(l,this._limitVelocityGradients,((e,t,i)=>{e!==n._currentLimitVelocityGradient&&(n._currentLimitVelocity1=n._currentLimitVelocity2,n._currentLimitVelocity2=t.getFactor(),n._currentLimitVelocityGradient=e);const s=lt.R.Lerp(n._currentLimitVelocity1,n._currentLimitVelocity2,i);n.direction.length()>s&&n.direction.scaleInPlace(this.limitVelocityDamping)})),this._dragGradients&&this._dragGradients.length>0&&Zf.GetCurrentGradient(l,this._dragGradients,((e,t,i)=>{e!==n._currentDragGradient&&(n._currentDrag1=n._currentDrag2,n._currentDrag2=t.getFactor(),n._currentDragGradient=e);const s=lt.R.Lerp(n._currentDrag1,n._currentDrag2,i);this._scaledDirection.scaleInPlace(1-s)})),this.isLocal&&n._localPosition?(n._localPosition.addInPlace(this._scaledDirection),o.P.TransformCoordinatesToRef(n._localPosition,this._emitterWorldMatrix,n.position)):n.position.addInPlace(this._scaledDirection),h&&i&&n._randomNoiseCoordinates1){const e=this._fetchR(n._randomNoiseCoordinates1.x,n._randomNoiseCoordinates1.y,i.width,i.height,h),t=this._fetchR(n._randomNoiseCoordinates1.z,n._randomNoiseCoordinates2.x,i.width,i.height,h),r=this._fetchR(n._randomNoiseCoordinates2.y,n._randomNoiseCoordinates2.z,i.width,i.height,h),a=o.jp.Vector3[0],l=o.jp.Vector3[1];a.copyFromFloats((2*e-1)*this.noiseStrength.x,(2*t-1)*this.noiseStrength.y,(2*r-1)*this.noiseStrength.z),a.scaleToRef(s,l),n.direction.addInPlace(l)}this.gravity.scaleToRef(s,this._scaledGravity),n.direction.addInPlace(this._scaledGravity),this._sizeGradients&&this._sizeGradients.length>0&&Zf.GetCurrentGradient(l,this._sizeGradients,((e,t,i)=>{e!==n._currentSizeGradient&&(n._currentSize1=n._currentSize2,n._currentSize2=t.getFactor(),n._currentSizeGradient=e),n.size=lt.R.Lerp(n._currentSize1,n._currentSize2,i)})),this._useRampGradients&&(this._colorRemapGradients&&this._colorRemapGradients.length>0&&Zf.GetCurrentGradient(l,this._colorRemapGradients,((e,t,i)=>{const s=lt.R.Lerp(e.factor1,t.factor1,i),r=lt.R.Lerp(e.factor2,t.factor2,i);n.remapData.x=s,n.remapData.y=r-s})),this._alphaRemapGradients&&this._alphaRemapGradients.length>0&&Zf.GetCurrentGradient(l,this._alphaRemapGradients,((e,t,i)=>{const s=lt.R.Lerp(e.factor1,t.factor1,i),r=lt.R.Lerp(e.factor2,t.factor2,i);n.remapData.z=s,n.remapData.w=r-s}))),this._isAnimationSheetEnabled&&n.updateCellIndex(),n._inheritParticleInfoToSubEmitters(),n.age>=n.lifeTime&&(this._emitFromParticle(n),n._attachedSubEmitters&&(n._attachedSubEmitters.forEach((e=>{e.particleSystem.disposeOnStop=!0,e.particleSystem.stop()})),n._attachedSubEmitters=null),this.recycleParticle(n),t--)}}}_addFactorGradient(e,t,i,n){const s=new Qf(t,i,n);e.push(s),e.sort(((e,t)=>e.gradient<t.gradient?-1:e.gradient>t.gradient?1:0))}_removeFactorGradient(e,t){if(!e)return;let i=0;for(const n of e){if(n.gradient===t){e.splice(i,1);break}i++}}addLifeTimeGradient(e,t,i){return this._lifeTimeGradients||(this._lifeTimeGradients=[]),this._addFactorGradient(this._lifeTimeGradients,e,t,i),this}removeLifeTimeGradient(e){return this._removeFactorGradient(this._lifeTimeGradients,e),this}addSizeGradient(e,t,i){return this._sizeGradients||(this._sizeGradients=[]),this._addFactorGradient(this._sizeGradients,e,t,i),this}removeSizeGradient(e){return this._removeFactorGradient(this._sizeGradients,e),this}addColorRemapGradient(e,t,i){return this._colorRemapGradients||(this._colorRemapGradients=[]),this._addFactorGradient(this._colorRemapGradients,e,t,i),this}removeColorRemapGradient(e){return this._removeFactorGradient(this._colorRemapGradients,e),this}addAlphaRemapGradient(e,t,i){return this._alphaRemapGradients||(this._alphaRemapGradients=[]),this._addFactorGradient(this._alphaRemapGradients,e,t,i),this}removeAlphaRemapGradient(e){return this._removeFactorGradient(this._alphaRemapGradients,e),this}addAngularSpeedGradient(e,t,i){return this._angularSpeedGradients||(this._angularSpeedGradients=[]),this._addFactorGradient(this._angularSpeedGradients,e,t,i),this}removeAngularSpeedGradient(e){return this._removeFactorGradient(this._angularSpeedGradients,e),this}addVelocityGradient(e,t,i){return this._velocityGradients||(this._velocityGradients=[]),this._addFactorGradient(this._velocityGradients,e,t,i),this}removeVelocityGradient(e){return this._removeFactorGradient(this._velocityGradients,e),this}addLimitVelocityGradient(e,t,i){return this._limitVelocityGradients||(this._limitVelocityGradients=[]),this._addFactorGradient(this._limitVelocityGradients,e,t,i),this}removeLimitVelocityGradient(e){return this._removeFactorGradient(this._limitVelocityGradients,e),this}addDragGradient(e,t,i){return this._dragGradients||(this._dragGradients=[]),this._addFactorGradient(this._dragGradients,e,t,i),this}removeDragGradient(e){return this._removeFactorGradient(this._dragGradients,e),this}addEmitRateGradient(e,t,i){return this._emitRateGradients||(this._emitRateGradients=[]),this._addFactorGradient(this._emitRateGradients,e,t,i),this}removeEmitRateGradient(e){return this._removeFactorGradient(this._emitRateGradients,e),this}addStartSizeGradient(e,t,i){return this._startSizeGradients||(this._startSizeGradients=[]),this._addFactorGradient(this._startSizeGradients,e,t,i),this}removeStartSizeGradient(e){return this._removeFactorGradient(this._startSizeGradients,e),this}_createRampGradientTexture(){if(!this._rampGradients||!this._rampGradients.length||this._rampGradientsTexture||!this._scene)return;const e=new Uint8Array(4*this._rawTextureWidth),t=a.zZ.Color3[0];for(let i=0;i<this._rawTextureWidth;i++){const n=i/this._rawTextureWidth;Zf.GetCurrentGradient(n,this._rampGradients,((n,s,r)=>{a.Wo.LerpToRef(n.color,s.color,r,t),e[4*i]=255*t.r,e[4*i+1]=255*t.g,e[4*i+2]=255*t.b,e[4*i+3]=255}))}this._rampGradientsTexture=Ee.l.CreateRGBATexture(e,this._rawTextureWidth,1,this._scene,!1,!1,1)}getRampGradients(){return this._rampGradients}forceRefreshGradients(){this._syncRampGradientTexture()}_syncRampGradientTexture(){this._rampGradients&&(this._rampGradients.sort(((e,t)=>e.gradient<t.gradient?-1:e.gradient>t.gradient?1:0)),this._rampGradientsTexture&&(this._rampGradientsTexture.dispose(),this._rampGradientsTexture=null),this._createRampGradientTexture())}addRampGradient(e,t){this._rampGradients||(this._rampGradients=[]);const i=new $f(e,t);return this._rampGradients.push(i),this._syncRampGradientTexture(),this}removeRampGradient(e){return this._removeGradientAndTexture(e,this._rampGradients,this._rampGradientsTexture),this._rampGradientsTexture=null,this._rampGradients&&this._rampGradients.length>0&&this._createRampGradientTexture(),this}addColorGradient(e,t,i){this._colorGradients||(this._colorGradients=[]);const n=new Kf(e,t,i);return this._colorGradients.push(n),this._colorGradients.sort(((e,t)=>e.gradient<t.gradient?-1:e.gradient>t.gradient?1:0)),this}removeColorGradient(e){if(!this._colorGradients)return this;let t=0;for(const i of this._colorGradients){if(i.gradient===e){this._colorGradients.splice(t,1);break}t++}return this}resetDrawCache(){for(const e of this._drawWrappers)if(e)for(const t of e)null==t||t.dispose();this._drawWrappers=[]}_fetchR(e,t,i,n,s){return s[4*(((e=.5*Math.abs(e)+.5)*i%i|0)+((t=.5*Math.abs(t)+.5)*n%n|0)*i)]/255}_reset(){this._resetEffect()}_resetEffect(){this._vertexBuffer&&(this._vertexBuffer.dispose(),this._vertexBuffer=null),this._spriteBuffer&&(this._spriteBuffer.dispose(),this._spriteBuffer=null),this._vertexArrayObject&&(this._engine.releaseVertexArrayObject(this._vertexArrayObject),this._vertexArrayObject=null),this._createVertexBuffers()}_createVertexBuffers(){this._vertexBufferSize=this._useInstancing?10:12,this._isAnimationSheetEnabled&&(this._vertexBufferSize+=1),this._isBillboardBased&&this.billboardMode!==i_.BILLBOARDMODE_STRETCHED&&this.billboardMode!==i_.BILLBOARDMODE_STRETCHED_LOCAL||(this._vertexBufferSize+=3),this._useRampGradients&&(this._vertexBufferSize+=4);const e=this._engine,t=this._vertexBufferSize*(this._useInstancing?1:4);this._vertexData=new Float32Array(this._capacity*t),this._vertexBuffer=new qe.l(e,this._vertexData,!0,t);let i=0;const n=this._vertexBuffer.createVertexBuffer(qe.o.PositionKind,i,3,this._vertexBufferSize,this._useInstancing);this._vertexBuffers[qe.o.PositionKind]=n,i+=3;const s=this._vertexBuffer.createVertexBuffer(qe.o.ColorKind,i,4,this._vertexBufferSize,this._useInstancing);this._vertexBuffers[qe.o.ColorKind]=s,i+=4;const r=this._vertexBuffer.createVertexBuffer("angle",i,1,this._vertexBufferSize,this._useInstancing);this._vertexBuffers.angle=r,i+=1;const o=this._vertexBuffer.createVertexBuffer("size",i,2,this._vertexBufferSize,this._useInstancing);if(this._vertexBuffers.size=o,i+=2,this._isAnimationSheetEnabled){const e=this._vertexBuffer.createVertexBuffer("cellIndex",i,1,this._vertexBufferSize,this._useInstancing);this._vertexBuffers.cellIndex=e,i+=1}if(!this._isBillboardBased||this.billboardMode===i_.BILLBOARDMODE_STRETCHED||this.billboardMode===i_.BILLBOARDMODE_STRETCHED_LOCAL){const e=this._vertexBuffer.createVertexBuffer("direction",i,3,this._vertexBufferSize,this._useInstancing);this._vertexBuffers.direction=e,i+=3}if(this._useRampGradients){const e=this._vertexBuffer.createVertexBuffer("remapData",i,4,this._vertexBufferSize,this._useInstancing);this._vertexBuffers.remapData=e,i+=4}let a;if(this._useInstancing){const t=new Float32Array([0,0,1,0,0,1,1,1]);this._spriteBuffer=new qe.l(e,t,!1,2),a=this._spriteBuffer.createVertexBuffer("offset",0,2)}else a=this._vertexBuffer.createVertexBuffer("offset",i,2,this._vertexBufferSize,this._useInstancing),i+=2;this._vertexBuffers.offset=a,this.resetDrawCache()}_createIndexBuffer(){if(this._useInstancing)return;const e=[];let t=0;for(let i=0;i<this._capacity;i++)e.push(t),e.push(t+1),e.push(t+2),e.push(t),e.push(t+2),e.push(t+3),t+=4;this._indexBuffer=this._engine.createIndexBuffer(e)}getCapacity(){return this._capacity}isAlive(){return this._alive}isStarted(){return this._started}_prepareSubEmitterInternalArray(){this._subEmitters=new Array,this.subEmitters&&this.subEmitters.forEach((e=>{e instanceof i_?this._subEmitters.push([new t_(e)]):e instanceof t_?this._subEmitters.push([e]):e instanceof Array&&this._subEmitters.push(e)}))}start(e=this.startDelay){var t;if(!this.targetStopDuration&&this._hasTargetStopDurationDependantGradient())throw"Particle system started with a targetStopDuration dependant gradient (eg. startSizeGradients) but no targetStopDuration set";if(e)setTimeout((()=>{this.start(0)}),e);else{if(this._prepareSubEmitterInternalArray(),this._started=!0,this._stopped=!1,this._actualFrame=0,this._subEmitters&&0!=this._subEmitters.length&&(this.activeSubSystems=new Array),this._emitRateGradients&&(this._emitRateGradients.length>0&&(this._currentEmitRateGradient=this._emitRateGradients[0],this._currentEmitRate1=this._currentEmitRateGradient.getFactor(),this._currentEmitRate2=this._currentEmitRate1),this._emitRateGradients.length>1&&(this._currentEmitRate2=this._emitRateGradients[1].getFactor())),this._startSizeGradients&&(this._startSizeGradients.length>0&&(this._currentStartSizeGradient=this._startSizeGradients[0],this._currentStartSize1=this._currentStartSizeGradient.getFactor(),this._currentStartSize2=this._currentStartSize1),this._startSizeGradients.length>1&&(this._currentStartSize2=this._startSizeGradients[1].getFactor())),this.preWarmCycles){-1!==(null===(t=this.emitter)||void 0===t?void 0:t.getClassName().indexOf("Mesh"))&&this.emitter.computeWorldMatrix(!0);const e=this.noiseTexture;if(e&&e.onGeneratedObservable)e.onGeneratedObservable.addOnce((()=>{setTimeout((()=>{for(let t=0;t<this.preWarmCycles;t++)this.animate(!0),e.render()}))}));else for(let e=0;e<this.preWarmCycles;e++)this.animate(!0)}this.beginAnimationOnStart&&this.animations&&this.animations.length>0&&this._scene&&this._scene.beginAnimation(this,this.beginAnimationFrom,this.beginAnimationTo,this.beginAnimationLoop)}}stop(e=!0){this._stopped||(this.onStoppedObservable.notifyObservers(this),this._stopped=!0,e&&this._stopSubEmitters())}reset(){this._stockParticles.length=0,this._particles.length=0}_appendParticleVertex(e,t,i,n){let s=e*this._vertexBufferSize;if(this._vertexData[s++]=t.position.x+this.worldOffset.x,this._vertexData[s++]=t.position.y+this.worldOffset.y,this._vertexData[s++]=t.position.z+this.worldOffset.z,this._vertexData[s++]=t.color.r,this._vertexData[s++]=t.color.g,this._vertexData[s++]=t.color.b,this._vertexData[s++]=t.color.a,this._vertexData[s++]=t.angle,this._vertexData[s++]=t.scale.x*t.size,this._vertexData[s++]=t.scale.y*t.size,this._isAnimationSheetEnabled&&(this._vertexData[s++]=t.cellIndex),this._isBillboardBased)this.billboardMode!==i_.BILLBOARDMODE_STRETCHED&&this.billboardMode!==i_.BILLBOARDMODE_STRETCHED_LOCAL||(this._vertexData[s++]=t.direction.x,this._vertexData[s++]=t.direction.y,this._vertexData[s++]=t.direction.z);else if(t._initialDirection){let e=t._initialDirection;this.isLocal&&(o.P.TransformNormalToRef(e,this._emitterWorldMatrix,o.jp.Vector3[0]),e=o.jp.Vector3[0]),0===e.x&&0===e.z&&(e.x=.001),this._vertexData[s++]=e.x,this._vertexData[s++]=e.y,this._vertexData[s++]=e.z}else{let e=t.direction;this.isLocal&&(o.P.TransformNormalToRef(e,this._emitterWorldMatrix,o.jp.Vector3[0]),e=o.jp.Vector3[0]),0===e.x&&0===e.z&&(e.x=.001),this._vertexData[s++]=e.x,this._vertexData[s++]=e.y,this._vertexData[s++]=e.z}this._useRampGradients&&t.remapData&&(this._vertexData[s++]=t.remapData.x,this._vertexData[s++]=t.remapData.y,this._vertexData[s++]=t.remapData.z,this._vertexData[s++]=t.remapData.w),this._useInstancing||(this._isAnimationSheetEnabled&&(0===i?i=this._epsilon:1===i&&(i=1-this._epsilon),0===n?n=this._epsilon:1===n&&(n=1-this._epsilon)),this._vertexData[s++]=i,this._vertexData[s++]=n)}_stopSubEmitters(){this.activeSubSystems&&(this.activeSubSystems.forEach((e=>{e.stop(!0)})),this.activeSubSystems=new Array)}_removeFromRoot(){if(!this._rootParticleSystem)return;const e=this._rootParticleSystem.activeSubSystems.indexOf(this);-1!==e&&this._rootParticleSystem.activeSubSystems.splice(e,1),this._rootParticleSystem=null}_update(e){if(this._alive=this._particles.length>0,this.emitter.position){const e=this.emitter;this._emitterWorldMatrix=e.getWorldMatrix()}else{const e=this.emitter;this._emitterWorldMatrix=o.y3.Translation(e.x,e.y,e.z)}let t;this._emitterWorldMatrix.invertToRef(this._emitterInverseWorldMatrix),this.updateFunction(this._particles);for(let i=0;i<e&&this._particles.length!==this._capacity;i++){if(t=this._createParticle(),this._particles.push(t),this.targetStopDuration&&this._lifeTimeGradients&&this._lifeTimeGradients.length>0){const e=lt.R.Clamp(this._actualFrame/this.targetStopDuration);Zf.GetCurrentGradient(e,this._lifeTimeGradients,((i,n)=>{const s=i,r=n,o=s.getFactor(),a=r.getFactor(),l=(e-s.gradient)/(r.gradient-s.gradient);t.lifeTime=lt.R.Lerp(o,a,l)}))}else t.lifeTime=lt.R.RandomRange(this.minLifeTime,this.maxLifeTime);const e=lt.R.RandomRange(this.minEmitPower,this.maxEmitPower);if(this.startPositionFunction?this.startPositionFunction(this._emitterWorldMatrix,t.position,t,this.isLocal):this.particleEmitterType.startPositionFunction(this._emitterWorldMatrix,t.position,t,this.isLocal),this.isLocal&&(t._localPosition?t._localPosition.copyFrom(t.position):t._localPosition=t.position.clone(),o.P.TransformCoordinatesToRef(t._localPosition,this._emitterWorldMatrix,t.position)),this.startDirectionFunction?this.startDirectionFunction(this._emitterWorldMatrix,t.direction,t,this.isLocal):this.particleEmitterType.startDirectionFunction(this._emitterWorldMatrix,t.direction,t,this.isLocal,this._emitterInverseWorldMatrix),0===e?t._initialDirection?t._initialDirection.copyFrom(t.direction):t._initialDirection=t.direction.clone():t._initialDirection=null,t.direction.scaleInPlace(e),this._sizeGradients&&0!==this._sizeGradients.length?(t._currentSizeGradient=this._sizeGradients[0],t._currentSize1=t._currentSizeGradient.getFactor(),t.size=t._currentSize1,this._sizeGradients.length>1?t._currentSize2=this._sizeGradients[1].getFactor():t._currentSize2=t._currentSize1):t.size=lt.R.RandomRange(this.minSize,this.maxSize),t.scale.copyFromFloats(lt.R.RandomRange(this.minScaleX,this.maxScaleX),lt.R.RandomRange(this.minScaleY,this.maxScaleY)),this._startSizeGradients&&this._startSizeGradients[0]&&this.targetStopDuration){const e=this._actualFrame/this.targetStopDuration;Zf.GetCurrentGradient(e,this._startSizeGradients,((e,i,n)=>{e!==this._currentStartSizeGradient&&(this._currentStartSize1=this._currentStartSize2,this._currentStartSize2=i.getFactor(),this._currentStartSizeGradient=e);const s=lt.R.Lerp(this._currentStartSize1,this._currentStartSize2,n);t.scale.scaleInPlace(s)}))}if(this._angularSpeedGradients&&0!==this._angularSpeedGradients.length?(t._currentAngularSpeedGradient=this._angularSpeedGradients[0],t.angularSpeed=t._currentAngularSpeedGradient.getFactor(),t._currentAngularSpeed1=t.angularSpeed,this._angularSpeedGradients.length>1?t._currentAngularSpeed2=this._angularSpeedGradients[1].getFactor():t._currentAngularSpeed2=t._currentAngularSpeed1):t.angularSpeed=lt.R.RandomRange(this.minAngularSpeed,this.maxAngularSpeed),t.angle=lt.R.RandomRange(this.minInitialRotation,this.maxInitialRotation),this._velocityGradients&&this._velocityGradients.length>0&&(t._currentVelocityGradient=this._velocityGradients[0],t._currentVelocity1=t._currentVelocityGradient.getFactor(),this._velocityGradients.length>1?t._currentVelocity2=this._velocityGradients[1].getFactor():t._currentVelocity2=t._currentVelocity1),this._limitVelocityGradients&&this._limitVelocityGradients.length>0&&(t._currentLimitVelocityGradient=this._limitVelocityGradients[0],t._currentLimitVelocity1=t._currentLimitVelocityGradient.getFactor(),this._limitVelocityGradients.length>1?t._currentLimitVelocity2=this._limitVelocityGradients[1].getFactor():t._currentLimitVelocity2=t._currentLimitVelocity1),this._dragGradients&&this._dragGradients.length>0&&(t._currentDragGradient=this._dragGradients[0],t._currentDrag1=t._currentDragGradient.getFactor(),this._dragGradients.length>1?t._currentDrag2=this._dragGradients[1].getFactor():t._currentDrag2=t._currentDrag1),this._colorGradients&&0!==this._colorGradients.length)t._currentColorGradient=this._colorGradients[0],t._currentColorGradient.getColorToRef(t.color),t._currentColor1.copyFrom(t.color),this._colorGradients.length>1?this._colorGradients[1].getColorToRef(t._currentColor2):t._currentColor2.copyFrom(t.color);else{const e=lt.R.RandomRange(0,1);a.HE.LerpToRef(this.color1,this.color2,e,t.color),this.colorDead.subtractToRef(t.color,this._colorDiff),this._colorDiff.scaleToRef(1/t.lifeTime,t.colorStep)}this._isAnimationSheetEnabled&&(t._initialStartSpriteCellID=this.startSpriteCellID,t._initialEndSpriteCellID=this.endSpriteCellID,t._initialSpriteCellLoop=this.spriteCellLoop),t.direction.addInPlace(this._inheritedVelocityOffset),this._useRampGradients&&(t.remapData=new o.Lt(0,1,0,1)),this.noiseTexture&&(t._randomNoiseCoordinates1?(t._randomNoiseCoordinates1.copyFromFloats(Math.random(),Math.random(),Math.random()),t._randomNoiseCoordinates2.copyFromFloats(Math.random(),Math.random(),Math.random())):(t._randomNoiseCoordinates1=new o.P(Math.random(),Math.random(),Math.random()),t._randomNoiseCoordinates2=new o.P(Math.random(),Math.random(),Math.random()))),t._inheritParticleInfoToSubEmitters()}}static _GetAttributeNamesOrOptions(e=!1,t=!1,i=!1){const n=[qe.o.PositionKind,qe.o.ColorKind,"angle","offset","size"];return e&&n.push("cellIndex"),t||n.push("direction"),i&&n.push("remapData"),n}static _GetEffectCreationOptions(e=!1,t=!1){const i=["invView","view","projection","textureMask","translationPivot","eyePosition"];return(0,Ga.qx)(i),e&&i.push("particlesInfos"),t&&i.push("logarithmicDepthConstant"),i}fillDefines(e,t){if(this._scene&&(0,Ga.lK)(this,this._scene,e),this._isAnimationSheetEnabled&&e.push("#define ANIMATESHEET"),this.useLogarithmicDepth&&e.push("#define LOGARITHMICDEPTH"),t===i_.BLENDMODE_MULTIPLY&&e.push("#define BLENDMULTIPLYMODE"),this._useRampGradients&&e.push("#define RAMPGRADIENT"),this._isBillboardBased)switch(e.push("#define BILLBOARD"),this.billboardMode){case i_.BILLBOARDMODE_Y:e.push("#define BILLBOARDY");break;case i_.BILLBOARDMODE_STRETCHED:case i_.BILLBOARDMODE_STRETCHED_LOCAL:e.push("#define BILLBOARDSTRETCHED"),this.billboardMode===i_.BILLBOARDMODE_STRETCHED_LOCAL&&e.push("#define BILLBOARDSTRETCHED_LOCAL");break;case i_.BILLBOARDMODE_ALL:e.push("#define BILLBOARDMODE_ALL")}this._imageProcessingConfiguration&&(this._imageProcessingConfiguration.prepareDefines(this._imageProcessingConfigurationDefines),e.push(this._imageProcessingConfigurationDefines.toString()))}fillUniformsAttributesAndSamplerNames(e,t,i){t.push(...i_._GetAttributeNamesOrOptions(this._isAnimationSheetEnabled,this._isBillboardBased&&this.billboardMode!==i_.BILLBOARDMODE_STRETCHED&&this.billboardMode!==i_.BILLBOARDMODE_STRETCHED_LOCAL,this._useRampGradients)),e.push(...i_._GetEffectCreationOptions(this._isAnimationSheetEnabled,this.useLogarithmicDepth)),i.push("diffuseSampler","rampSampler"),this._imageProcessingConfiguration&&(ki.$.PrepareUniforms(e,this._imageProcessingConfigurationDefines),ki.$.PrepareSamplers(i,this._imageProcessingConfigurationDefines))}_getWrapper(e){const t=this._getCustomDrawWrapper(e);if(null==t?void 0:t.effect)return t;const i=[];this.fillDefines(i,e);const n=this._engine._features.supportRenderPasses?this._engine.currentRenderPassId:0;let s=this._drawWrappers[n];s||(s=this._drawWrappers[n]=[]);let r=s[e];r||(r=new Ps.q(this._engine),r.drawContext&&(r.drawContext.useInstancing=this._useInstancing),s[e]=r);const o=i.join("\n");if(r.defines!==o){const e=[],t=[],i=[];this.fillUniformsAttributesAndSamplerNames(t,e,i),r.setEffect(this._engine.createEffect("particles",e,t,i,o),o)}return r}animate(e=!1){var t;if(!this._started)return;if(!e&&this._scene){if(!this.isReady())return;if(this._currentRenderId===this._scene.getFrameId())return;this._currentRenderId=this._scene.getFrameId()}let i;if(this._scaledUpdateSpeed=this.updateSpeed*(e?this.preWarmStepOffset:(null===(t=this._scene)||void 0===t?void 0:t.getAnimationRatio())||1),this.manualEmitCount>-1)i=this.manualEmitCount,this._newPartsExcess=0,this.manualEmitCount=0;else{let e=this.emitRate;if(this._emitRateGradients&&this._emitRateGradients.length>0&&this.targetStopDuration){const t=this._actualFrame/this.targetStopDuration;Zf.GetCurrentGradient(t,this._emitRateGradients,((t,i,n)=>{t!==this._currentEmitRateGradient&&(this._currentEmitRate1=this._currentEmitRate2,this._currentEmitRate2=i.getFactor(),this._currentEmitRateGradient=t),e=lt.R.Lerp(this._currentEmitRate1,this._currentEmitRate2,n)}))}i=e*this._scaledUpdateSpeed>>0,this._newPartsExcess+=e*this._scaledUpdateSpeed-i}if(this._newPartsExcess>1&&(i+=this._newPartsExcess>>0,this._newPartsExcess-=this._newPartsExcess>>0),this._alive=!1,this._stopped?i=0:(this._actualFrame+=this._scaledUpdateSpeed,this.targetStopDuration&&this._actualFrame>=this.targetStopDuration&&this.stop()),this._update(i),this._stopped&&(this._alive||(this._started=!1,this.onAnimationEnd&&this.onAnimationEnd(),this.disposeOnStop&&this._scene&&this._scene._toBeDisposed.push(this))),!e){let e=0;for(let t=0;t<this._particles.length;t++){const i=this._particles[t];this._appendParticleVertices(e,i),e+=this._useInstancing?1:4}this._vertexBuffer&&this._vertexBuffer.updateDirectly(this._vertexData,0,this._particles.length)}0===this.manualEmitCount&&this.disposeOnStop&&this.stop()}_appendParticleVertices(e,t){this._appendParticleVertex(e++,t,0,0),this._useInstancing||(this._appendParticleVertex(e++,t,1,0),this._appendParticleVertex(e++,t,1,1),this._appendParticleVertex(e++,t,0,1))}rebuild(){var e,t;this._engine.getCaps().vertexArrayObject&&(this._vertexArrayObject=null),this._createIndexBuffer(),null===(e=this._spriteBuffer)||void 0===e||e._rebuild(),null===(t=this._vertexBuffer)||void 0===t||t._rebuild();for(const e in this._vertexBuffers)this._vertexBuffers[e]._rebuild();this.resetDrawCache()}isReady(){if(!this.emitter||this._imageProcessingConfiguration&&!this._imageProcessingConfiguration.isReady()||!this.particleTexture||!this.particleTexture.isReady())return!1;if(this.blendMode!==i_.BLENDMODE_MULTIPLYADD){if(!this._getWrapper(this.blendMode).effect.isReady())return!1}else{if(!this._getWrapper(i_.BLENDMODE_MULTIPLY).effect.isReady())return!1;if(!this._getWrapper(i_.BLENDMODE_ADD).effect.isReady())return!1}return!0}_render(e){var t,i;const n=this._getWrapper(e),s=n.effect,r=this._engine;r.enableEffect(n);const a=null!==(t=this.defaultViewMatrix)&&void 0!==t?t:this._scene.getViewMatrix();if(s.setTexture("diffuseSampler",this.particleTexture),s.setMatrix("view",a),s.setMatrix("projection",null!==(i=this.defaultProjectionMatrix)&&void 0!==i?i:this._scene.getProjectionMatrix()),this._isAnimationSheetEnabled&&this.particleTexture){const e=this.particleTexture.getBaseSize();s.setFloat3("particlesInfos",this.spriteCellWidth/e.width,this.spriteCellHeight/e.height,this.spriteCellWidth/e.width)}if(s.setVector2("translationPivot",this.translationPivot),s.setFloat4("textureMask",this.textureMask.r,this.textureMask.g,this.textureMask.b,this.textureMask.a),this._isBillboardBased&&this._scene){const e=this._scene.activeCamera;s.setVector3("eyePosition",e.globalPosition)}this._rampGradientsTexture&&(this._rampGradients&&this._rampGradients.length||(this._rampGradientsTexture.dispose(),this._rampGradientsTexture=null),s.setTexture("rampSampler",this._rampGradientsTexture));const l=s.defines;switch(this._scene&&(0,Ga.an)(s,this,this._scene),l.indexOf("#define BILLBOARDMODE_ALL")>=0&&(a.invertToRef(o.jp.Matrix[0]),s.setMatrix("invView",o.jp.Matrix[0])),void 0!==this._vertexArrayObject?(this._vertexArrayObject||(this._vertexArrayObject=this._engine.recordVertexArrayObject(this._vertexBuffers,this._indexBuffer,s)),this._engine.bindVertexArrayObject(this._vertexArrayObject,this._indexBuffer)):r.bindBuffers(this._vertexBuffers,this._indexBuffer,s),this.useLogarithmicDepth&&this._scene&&La.G.BindLogDepth(l,s,this._scene),this._imageProcessingConfiguration&&!this._imageProcessingConfiguration.applyByPostProcess&&this._imageProcessingConfiguration.bind(s),e){case i_.BLENDMODE_ADD:r.setAlphaMode(1);break;case i_.BLENDMODE_ONEONE:r.setAlphaMode(6);break;case i_.BLENDMODE_STANDARD:r.setAlphaMode(2);break;case i_.BLENDMODE_MULTIPLY:r.setAlphaMode(4)}return this._onBeforeDrawParticlesObservable&&this._onBeforeDrawParticlesObservable.notifyObservers(s),this._useInstancing?r.drawArraysType(7,0,4,this._particles.length):r.drawElementsType(0,0,6*this._particles.length),this._particles.length}render(){if(!this.isReady()||!this._particles.length)return 0;const e=this._engine;e.setState&&(e.setState(!1),this.forceDepthWrite&&e.setDepthWrite(!0));let t=0;return t=this.blendMode===i_.BLENDMODE_MULTIPLYADD?this._render(i_.BLENDMODE_MULTIPLY)+this._render(i_.BLENDMODE_ADD):this._render(this.blendMode),this._engine.unbindInstanceAttributes(),this._engine.setAlphaMode(0),t}dispose(e=!0){if(this.resetDrawCache(),this._vertexBuffer&&(this._vertexBuffer.dispose(),this._vertexBuffer=null),this._spriteBuffer&&(this._spriteBuffer.dispose(),this._spriteBuffer=null),this._indexBuffer&&(this._engine._releaseBuffer(this._indexBuffer),this._indexBuffer=null),this._vertexArrayObject&&(this._engine.releaseVertexArrayObject(this._vertexArrayObject),this._vertexArrayObject=null),e&&this.particleTexture&&(this.particleTexture.dispose(),this.particleTexture=null),e&&this.noiseTexture&&(this.noiseTexture.dispose(),this.noiseTexture=null),this._rampGradientsTexture&&(this._rampGradientsTexture.dispose(),this._rampGradientsTexture=null),this._removeFromRoot(),this.subEmitters&&!this._subEmitters&&this._prepareSubEmitterInternalArray(),this._subEmitters&&this._subEmitters.length){for(let e=0;e<this._subEmitters.length;e++)for(const t of this._subEmitters[e])t.dispose();this._subEmitters=[],this.subEmitters=[]}if(this._disposeEmitterOnDispose&&this.emitter&&this.emitter.dispose&&this.emitter.dispose(!0),this._onBeforeDrawParticlesObservable&&this._onBeforeDrawParticlesObservable.clear(),this._scene){const e=this._scene.particleSystems.indexOf(this);e>-1&&this._scene.particleSystems.splice(e,1),this._scene._activeParticleSystems.dispose()}this.onDisposeObservable.notifyObservers(this),this.onDisposeObservable.clear(),this.onStoppedObservable.clear(),this.reset()}clone(e,t,i=!1){const n={...this._customWrappers};let s=null;const r=this._engine;if(r.createEffectForParticles&&null!=this.customShader){s=this.customShader;const e=s.shaderOptions.defines.length>0?s.shaderOptions.defines.join("\n"):"",t=r.createEffectForParticles(s.shaderPath.fragmentElement,s.shaderOptions.uniforms,s.shaderOptions.samplers,e);n[0]?n[0].effect=t:this.setCustomEffect(t,0)}const o=this.serialize(i),a=i_.Parse(o,this._scene||this._engine,this._rootUrl);return a.name=e,a.customShader=s,a._customWrappers=n,void 0===t&&(t=this.emitter),this.noiseTexture&&(a.noiseTexture=this.noiseTexture.clone()),a.emitter=t,this.preventAutoStart||a.start(),a}serialize(e=!1){const t={};if(i_._Serialize(t,this,e),t.textureMask=this.textureMask.asArray(),t.customShader=this.customShader,t.preventAutoStart=this.preventAutoStart,this.subEmitters){t.subEmitters=[],this._subEmitters||this._prepareSubEmitterInternalArray();for(const i of this._subEmitters){const n=[];for(const t of i)n.push(t.serialize(e));t.subEmitters.push(n)}}return t}static _Serialize(e,t,i){if(e.name=t.name,e.id=t.id,e.capacity=t.getCapacity(),e.disposeOnStop=t.disposeOnStop,e.manualEmitCount=t.manualEmitCount,t.emitter.position){const i=t.emitter;e.emitterId=i.id}else{const i=t.emitter;e.emitter=i.asArray()}t.particleEmitterType&&(e.particleEmitterType=t.particleEmitterType.serialize()),t.particleTexture&&(i?e.texture=t.particleTexture.serialize():(e.textureName=t.particleTexture.name,e.invertY=!!t.particleTexture._invertY)),e.isLocal=t.isLocal,Te.p4.AppendSerializedAnimations(t,e),e.beginAnimationOnStart=t.beginAnimationOnStart,e.beginAnimationFrom=t.beginAnimationFrom,e.beginAnimationTo=t.beginAnimationTo,e.beginAnimationLoop=t.beginAnimationLoop,e.startDelay=t.startDelay,e.renderingGroupId=t.renderingGroupId,e.isBillboardBased=t.isBillboardBased,e.billboardMode=t.billboardMode,e.minAngularSpeed=t.minAngularSpeed,e.maxAngularSpeed=t.maxAngularSpeed,e.minSize=t.minSize,e.maxSize=t.maxSize,e.minScaleX=t.minScaleX,e.maxScaleX=t.maxScaleX,e.minScaleY=t.minScaleY,e.maxScaleY=t.maxScaleY,e.minEmitPower=t.minEmitPower,e.maxEmitPower=t.maxEmitPower,e.minLifeTime=t.minLifeTime,e.maxLifeTime=t.maxLifeTime,e.emitRate=t.emitRate,e.gravity=t.gravity.asArray(),e.noiseStrength=t.noiseStrength.asArray(),e.color1=t.color1.asArray(),e.color2=t.color2.asArray(),e.colorDead=t.colorDead.asArray(),e.updateSpeed=t.updateSpeed,e.targetStopDuration=t.targetStopDuration,e.blendMode=t.blendMode,e.preWarmCycles=t.preWarmCycles,e.preWarmStepOffset=t.preWarmStepOffset,e.minInitialRotation=t.minInitialRotation,e.maxInitialRotation=t.maxInitialRotation,e.startSpriteCellID=t.startSpriteCellID,e.spriteCellLoop=t.spriteCellLoop,e.endSpriteCellID=t.endSpriteCellID,e.spriteCellChangeSpeed=t.spriteCellChangeSpeed,e.spriteCellWidth=t.spriteCellWidth,e.spriteCellHeight=t.spriteCellHeight,e.spriteRandomStartCell=t.spriteRandomStartCell,e.isAnimationSheetEnabled=t.isAnimationSheetEnabled,e.useLogarithmicDepth=t.useLogarithmicDepth;const n=t.getColorGradients();if(n){e.colorGradients=[];for(const t of n){const i={gradient:t.gradient,color1:t.color1.asArray()};t.color2?i.color2=t.color2.asArray():i.color2=t.color1.asArray(),e.colorGradients.push(i)}}const s=t.getRampGradients();if(s){e.rampGradients=[];for(const t of s){const i={gradient:t.gradient,color:t.color.asArray()};e.rampGradients.push(i)}e.useRampGradients=t.useRampGradients}const r=t.getColorRemapGradients();if(r){e.colorRemapGradients=[];for(const t of r){const i={gradient:t.gradient,factor1:t.factor1};void 0!==t.factor2?i.factor2=t.factor2:i.factor2=t.factor1,e.colorRemapGradients.push(i)}}const o=t.getAlphaRemapGradients();if(o){e.alphaRemapGradients=[];for(const t of o){const i={gradient:t.gradient,factor1:t.factor1};void 0!==t.factor2?i.factor2=t.factor2:i.factor2=t.factor1,e.alphaRemapGradients.push(i)}}const a=t.getSizeGradients();if(a){e.sizeGradients=[];for(const t of a){const i={gradient:t.gradient,factor1:t.factor1};void 0!==t.factor2?i.factor2=t.factor2:i.factor2=t.factor1,e.sizeGradients.push(i)}}const l=t.getAngularSpeedGradients();if(l){e.angularSpeedGradients=[];for(const t of l){const i={gradient:t.gradient,factor1:t.factor1};void 0!==t.factor2?i.factor2=t.factor2:i.factor2=t.factor1,e.angularSpeedGradients.push(i)}}const h=t.getVelocityGradients();if(h){e.velocityGradients=[];for(const t of h){const i={gradient:t.gradient,factor1:t.factor1};void 0!==t.factor2?i.factor2=t.factor2:i.factor2=t.factor1,e.velocityGradients.push(i)}}const c=t.getDragGradients();if(c){e.dragGradients=[];for(const t of c){const i={gradient:t.gradient,factor1:t.factor1};void 0!==t.factor2?i.factor2=t.factor2:i.factor2=t.factor1,e.dragGradients.push(i)}}const u=t.getEmitRateGradients();if(u){e.emitRateGradients=[];for(const t of u){const i={gradient:t.gradient,factor1:t.factor1};void 0!==t.factor2?i.factor2=t.factor2:i.factor2=t.factor1,e.emitRateGradients.push(i)}}const d=t.getStartSizeGradients();if(d){e.startSizeGradients=[];for(const t of d){const i={gradient:t.gradient,factor1:t.factor1};void 0!==t.factor2?i.factor2=t.factor2:i.factor2=t.factor1,e.startSizeGradients.push(i)}}const p=t.getLifeTimeGradients();if(p){e.lifeTimeGradients=[];for(const t of p){const i={gradient:t.gradient,factor1:t.factor1};void 0!==t.factor2?i.factor2=t.factor2:i.factor2=t.factor1,e.lifeTimeGradients.push(i)}}const f=t.getLimitVelocityGradients();if(f){e.limitVelocityGradients=[];for(const t of f){const i={gradient:t.gradient,factor1:t.factor1};void 0!==t.factor2?i.factor2=t.factor2:i.factor2=t.factor1,e.limitVelocityGradients.push(i)}e.limitVelocityDamping=t.limitVelocityDamping}t.noiseTexture&&(e.noiseTexture=t.noiseTexture.serialize())}static _Parse(e,t,i,n){var s,r,h;let c;c=i instanceof Rn.B?null:i;const u=(0,l.q)("BABYLON.Texture");if(u&&c&&(e.texture?t.particleTexture=u.Parse(e.texture,c,n):e.textureName&&(t.particleTexture=new u(n+e.textureName,c,!1,void 0===e.invertY||e.invertY),t.particleTexture.name=e.textureName)),e.emitterId||0===e.emitterId||void 0!==e.emitter?e.emitterId&&c?t.emitter=c.getLastMeshById(e.emitterId):t.emitter=o.P.FromArray(e.emitter):t.emitter=o.P.Zero(),t.isLocal=!!e.isLocal,void 0!==e.renderingGroupId&&(t.renderingGroupId=e.renderingGroupId),void 0!==e.isBillboardBased&&(t.isBillboardBased=e.isBillboardBased),void 0!==e.billboardMode&&(t.billboardMode=e.billboardMode),void 0!==e.useLogarithmicDepth&&(t.useLogarithmicDepth=e.useLogarithmicDepth),e.animations){for(let i=0;i<e.animations.length;i++){const n=e.animations[i],s=(0,l.q)("BABYLON.Animation");s&&t.animations.push(s.Parse(n))}t.beginAnimationOnStart=e.beginAnimationOnStart,t.beginAnimationFrom=e.beginAnimationFrom,t.beginAnimationTo=e.beginAnimationTo,t.beginAnimationLoop=e.beginAnimationLoop}if(e.autoAnimate&&c&&c.beginAnimation(t,e.autoAnimateFrom,e.autoAnimateTo,e.autoAnimateLoop,e.autoAnimateSpeed||1),t.startDelay=0|e.startDelay,t.minAngularSpeed=e.minAngularSpeed,t.maxAngularSpeed=e.maxAngularSpeed,t.minSize=e.minSize,t.maxSize=e.maxSize,e.minScaleX&&(t.minScaleX=e.minScaleX,t.maxScaleX=e.maxScaleX,t.minScaleY=e.minScaleY,t.maxScaleY=e.maxScaleY),void 0!==e.preWarmCycles&&(t.preWarmCycles=e.preWarmCycles,t.preWarmStepOffset=e.preWarmStepOffset),void 0!==e.minInitialRotation&&(t.minInitialRotation=e.minInitialRotation,t.maxInitialRotation=e.maxInitialRotation),t.minLifeTime=e.minLifeTime,t.maxLifeTime=e.maxLifeTime,t.minEmitPower=e.minEmitPower,t.maxEmitPower=e.maxEmitPower,t.emitRate=e.emitRate,t.gravity=o.P.FromArray(e.gravity),e.noiseStrength&&(t.noiseStrength=o.P.FromArray(e.noiseStrength)),t.color1=a.HE.FromArray(e.color1),t.color2=a.HE.FromArray(e.color2),t.colorDead=a.HE.FromArray(e.colorDead),t.updateSpeed=e.updateSpeed,t.targetStopDuration=e.targetStopDuration,t.blendMode=e.blendMode,e.colorGradients)for(const i of e.colorGradients)t.addColorGradient(i.gradient,a.HE.FromArray(i.color1),i.color2?a.HE.FromArray(i.color2):void 0);if(e.rampGradients){for(const i of e.rampGradients)t.addRampGradient(i.gradient,a.Wo.FromArray(i.color));t.useRampGradients=e.useRampGradients}if(e.colorRemapGradients)for(const i of e.colorRemapGradients)t.addColorRemapGradient(i.gradient,void 0!==i.factor1?i.factor1:i.factor,i.factor2);if(e.alphaRemapGradients)for(const i of e.alphaRemapGradients)t.addAlphaRemapGradient(i.gradient,void 0!==i.factor1?i.factor1:i.factor,i.factor2);if(e.sizeGradients)for(const i of e.sizeGradients)t.addSizeGradient(i.gradient,void 0!==i.factor1?i.factor1:i.factor,i.factor2);if(e.angularSpeedGradients)for(const i of e.angularSpeedGradients)t.addAngularSpeedGradient(i.gradient,void 0!==i.factor1?i.factor1:i.factor,i.factor2);if(e.velocityGradients)for(const i of e.velocityGradients)t.addVelocityGradient(i.gradient,void 0!==i.factor1?i.factor1:i.factor,i.factor2);if(e.dragGradients)for(const i of e.dragGradients)t.addDragGradient(i.gradient,void 0!==i.factor1?i.factor1:i.factor,i.factor2);if(e.emitRateGradients)for(const i of e.emitRateGradients)t.addEmitRateGradient(i.gradient,void 0!==i.factor1?i.factor1:i.factor,i.factor2);if(e.startSizeGradients)for(const i of e.startSizeGradients)t.addStartSizeGradient(i.gradient,void 0!==i.factor1?i.factor1:i.factor,i.factor2);if(e.lifeTimeGradients)for(const i of e.lifeTimeGradients)t.addLifeTimeGradient(i.gradient,void 0!==i.factor1?i.factor1:i.factor,i.factor2);if(e.limitVelocityGradients){for(const i of e.limitVelocityGradients)t.addLimitVelocityGradient(i.gradient,void 0!==i.factor1?i.factor1:i.factor,i.factor2);t.limitVelocityDamping=e.limitVelocityDamping}if(e.noiseTexture&&c){const i=(0,l.q)("BABYLON.ProceduralTexture");t.noiseTexture=i.Parse(e.noiseTexture,c,n)}let d;if(e.particleEmitterType){switch(e.particleEmitterType.type){case"SphereParticleEmitter":d=new Hf.Ai;break;case"SphereDirectedParticleEmitter":d=new Hf.cE;break;case"ConeEmitter":case"ConeParticleEmitter":d=new Hf.LV;break;case"CylinderParticleEmitter":d=new Hf.kT;break;case"CylinderDirectedParticleEmitter":d=new Hf.z;break;case"HemisphericParticleEmitter":d=new Hf.VD;break;case"PointParticleEmitter":d=new Hf.cl;break;case"MeshParticleEmitter":d=new Hf.F3;break;default:d=new Hf.S3}d.parse(e.particleEmitterType,c)}else d=new Hf.S3,d.parse(e,c);t.particleEmitterType=d,t.startSpriteCellID=e.startSpriteCellID,t.endSpriteCellID=e.endSpriteCellID,t.spriteCellLoop=null===(s=e.spriteCellLoop)||void 0===s||s,t.spriteCellWidth=e.spriteCellWidth,t.spriteCellHeight=e.spriteCellHeight,t.spriteCellChangeSpeed=e.spriteCellChangeSpeed,t.spriteRandomStartCell=e.spriteRandomStartCell,t.disposeOnStop=null!==(r=e.disposeOnStop)&&void 0!==r&&r,t.manualEmitCount=null!==(h=e.manualEmitCount)&&void 0!==h?h:-1}static Parse(e,t,i,n=!1,s){const r=e.name;let o,l,h=null,c=null;if(t instanceof Rn.B?o=t:(l=t,o=l.getEngine()),e.customShader&&o.createEffectForParticles){c=e.customShader;const t=c.shaderOptions.defines.length>0?c.shaderOptions.defines.join("\n"):"";h=o.createEffectForParticles(c.shaderPath.fragmentElement,c.shaderOptions.uniforms,c.shaderOptions.samplers,t)}const u=new i_(r,s||e.capacity,t,h,e.isAnimationSheetEnabled);if(u.customShader=c,u._rootUrl=i,e.id&&(u.id=e.id),e.subEmitters){u.subEmitters=[];for(const n of e.subEmitters){const e=[];for(const s of n)e.push(t_.Parse(s,t,i));u.subEmitters.push(e)}}return i_._Parse(e,u,t,i),e.textureMask&&(u.textureMask=a.HE.FromArray(e.textureMask)),e.preventAutoStart&&(u.preventAutoStart=e.preventAutoStart),n||u.preventAutoStart||u.start(),u}}i_.BILLBOARDMODE_Y=2,i_.BILLBOARDMODE_ALL=7,i_.BILLBOARDMODE_STRETCHED=8,i_.BILLBOARDMODE_STRETCHED_LOCAL=9,t_._ParseParticleSystem=i_.Parse;var n_=i(1499);si.v.IncludesShadersStore.clipPlaneFragmentDeclaration2="#ifdef CLIPPLANE\nin float fClipDistance;\n#endif\n#ifdef CLIPPLANE2\nin float fClipDistance2;\n#endif\n#ifdef CLIPPLANE3\nin float fClipDistance3;\n#endif\n#ifdef CLIPPLANE4\nin float fClipDistance4;\n#endif\n#ifdef CLIPPLANE5\nin float fClipDistance5;\n#endif\n#ifdef CLIPPLANE6\nin float fClipDistance6;\n#endif\n";si.v.ShadersStore.gpuRenderParticlesPixelShader="precision highp float;\n#ifdef LOGARITHMICDEPTH\n#extension GL_EXT_frag_depth : enable\n#endif\nuniform sampler2D diffuseSampler;\nvarying vec2 vUV;\nvarying vec4 vColor;\n#include<clipPlaneFragmentDeclaration2> \n#include<imageProcessingDeclaration>\n#include<logDepthDeclaration>\n#include<helperFunctions>\n#include<imageProcessingFunctions>\nvoid main() {\n#include<clipPlaneFragment> \nvec4 textureColor=texture2D(diffuseSampler,vUV);\ngl_FragColor=textureColor*vColor;\n#ifdef BLENDMULTIPLYMODE\nfloat alpha=vColor.a*textureColor.a;\ngl_FragColor.rgb=gl_FragColor.rgb*alpha+vec3(1.0)*(1.0-alpha);\n#endif \n#include<logDepthFragment>\n#ifdef IMAGEPROCESSINGPOSTPROCESS\ngl_FragColor.rgb=toLinearSpace(gl_FragColor.rgb);\n#else\n#ifdef IMAGEPROCESSING\ngl_FragColor.rgb=toLinearSpace(gl_FragColor.rgb);\ngl_FragColor=applyImageProcessing(gl_FragColor);\n#endif\n#endif\n}\n";si.v.IncludesShadersStore.clipPlaneVertexDeclaration2="#ifdef CLIPPLANE\nuniform vec4 vClipPlane;\nout float fClipDistance;\n#endif\n#ifdef CLIPPLANE2\nuniform vec4 vClipPlane2;\nout float fClipDistance2;\n#endif\n#ifdef CLIPPLANE3\nuniform vec4 vClipPlane3;\nout float fClipDistance3;\n#endif\n#ifdef CLIPPLANE4\nuniform vec4 vClipPlane4;\nout float fClipDistance4;\n#endif\n#ifdef CLIPPLANE5\nuniform vec4 vClipPlane5;\nout float fClipDistance5;\n#endif\n#ifdef CLIPPLANE6\nuniform vec4 vClipPlane6;\nout float fClipDistance6;\n#endif\n";si.v.ShadersStore.gpuRenderParticlesVertexShader="precision highp float;\nuniform mat4 view;\nuniform mat4 projection;\nuniform vec2 translationPivot;\nuniform vec3 worldOffset;\n#ifdef LOCAL\nuniform mat4 emitterWM;\n#endif\nattribute vec3 position;\nattribute float age;\nattribute float life;\nattribute vec3 size;\n#ifndef BILLBOARD\nattribute vec3 initialDirection;\n#endif\n#ifdef BILLBOARDSTRETCHED\nattribute vec3 direction;\n#endif\nattribute float angle;\n#ifdef ANIMATESHEET\nattribute float cellIndex;\n#endif\nattribute vec2 offset;\nattribute vec2 uv;\nvarying vec2 vUV;\nvarying vec4 vColor;\nvarying vec3 vPositionW;\n#if defined(BILLBOARD) && !defined(BILLBOARDY) && !defined(BILLBOARDSTRETCHED)\nuniform mat4 invView;\n#endif\n#include<clipPlaneVertexDeclaration2>\n#include<logDepthDeclaration>\n#ifdef COLORGRADIENTS\nuniform sampler2D colorGradientSampler;\n#else\nuniform vec4 colorDead;\nattribute vec4 color;\n#endif\n#ifdef ANIMATESHEET\nuniform vec3 sheetInfos;\n#endif\n#ifdef BILLBOARD\nuniform vec3 eyePosition;\n#endif\nvec3 rotate(vec3 yaxis,vec3 rotatedCorner) {\nvec3 xaxis=normalize(cross(vec3(0.,1.0,0.),yaxis));\nvec3 zaxis=normalize(cross(yaxis,xaxis));\nvec3 row0=vec3(xaxis.x,xaxis.y,xaxis.z);\nvec3 row1=vec3(yaxis.x,yaxis.y,yaxis.z);\nvec3 row2=vec3(zaxis.x,zaxis.y,zaxis.z);\nmat3 rotMatrix= mat3(row0,row1,row2);\nvec3 alignedCorner=rotMatrix*rotatedCorner;\n#ifdef LOCAL\nreturn ((emitterWM*vec4(position,1.0)).xyz+worldOffset)+alignedCorner;\n#else\nreturn (position+worldOffset)+alignedCorner;\n#endif\n}\n#ifdef BILLBOARDSTRETCHED\nvec3 rotateAlign(vec3 toCamera,vec3 rotatedCorner) {\nvec3 normalizedToCamera=normalize(toCamera);\nvec3 normalizedCrossDirToCamera=normalize(cross(normalize(direction),normalizedToCamera));\nvec3 crossProduct=normalize(cross(normalizedToCamera,normalizedCrossDirToCamera));\nvec3 row0=vec3(normalizedCrossDirToCamera.x,normalizedCrossDirToCamera.y,normalizedCrossDirToCamera.z);\nvec3 row1=vec3(crossProduct.x,crossProduct.y,crossProduct.z);\nvec3 row2=vec3(normalizedToCamera.x,normalizedToCamera.y,normalizedToCamera.z);\nmat3 rotMatrix= mat3(row0,row1,row2);\nvec3 alignedCorner=rotMatrix*rotatedCorner;\n#ifdef LOCAL\nreturn ((emitterWM*vec4(position,1.0)).xyz+worldOffset)+alignedCorner;\n#else\nreturn (position+worldOffset)+alignedCorner;\n#endif\n}\n#endif\nvoid main() {\n#ifdef ANIMATESHEET\nfloat rowOffset=floor(cellIndex/sheetInfos.z);\nfloat columnOffset=cellIndex-rowOffset*sheetInfos.z;\nvec2 uvScale=sheetInfos.xy;\nvec2 uvOffset=vec2(uv.x ,1.0-uv.y);\nvUV=(uvOffset+vec2(columnOffset,rowOffset))*uvScale;\n#else\nvUV=uv;\n#endif\nfloat ratio=age/life;\n#ifdef COLORGRADIENTS\nvColor=texture2D(colorGradientSampler,vec2(ratio,0));\n#else\nvColor=color*vec4(1.0-ratio)+colorDead*vec4(ratio);\n#endif\nvec2 cornerPos=(offset-translationPivot)*size.yz*size.x+translationPivot;\n#ifdef BILLBOARD\nvec4 rotatedCorner;\nrotatedCorner.w=0.;\n#ifdef BILLBOARDY\nrotatedCorner.x=cornerPos.x*cos(angle)-cornerPos.y*sin(angle);\nrotatedCorner.z=cornerPos.x*sin(angle)+cornerPos.y*cos(angle);\nrotatedCorner.y=0.;\nvec3 yaxis=(position+worldOffset)-eyePosition;\nyaxis.y=0.;\nvPositionW=rotate(normalize(yaxis),rotatedCorner.xyz);\nvec4 viewPosition=(view*vec4(vPositionW,1.0));\n#elif defined(BILLBOARDSTRETCHED)\nrotatedCorner.x=cornerPos.x*cos(angle)-cornerPos.y*sin(angle);\nrotatedCorner.y=cornerPos.x*sin(angle)+cornerPos.y*cos(angle);\nrotatedCorner.z=0.;\nvec3 toCamera=(position+worldOffset)-eyePosition;\nvPositionW=rotateAlign(toCamera,rotatedCorner.xyz);\nvec4 viewPosition=(view*vec4(vPositionW,1.0));\n#else\nrotatedCorner.x=cornerPos.x*cos(angle)-cornerPos.y*sin(angle);\nrotatedCorner.y=cornerPos.x*sin(angle)+cornerPos.y*cos(angle);\nrotatedCorner.z=0.;\n#ifdef LOCAL\nvec4 viewPosition=view*vec4(((emitterWM*vec4(position,1.0)).xyz+worldOffset),1.0)+rotatedCorner;\n#else\nvec4 viewPosition=view*vec4((position+worldOffset),1.0)+rotatedCorner;\n#endif\nvPositionW=(invView*viewPosition).xyz;\n#endif\n#else\nvec3 rotatedCorner;\nrotatedCorner.x=cornerPos.x*cos(angle)-cornerPos.y*sin(angle);\nrotatedCorner.y=0.;\nrotatedCorner.z=cornerPos.x*sin(angle)+cornerPos.y*cos(angle);\nvec3 yaxis=normalize(initialDirection);\nvPositionW=rotate(yaxis,rotatedCorner);\nvec4 viewPosition=view*vec4(vPositionW,1.0);\n#endif\ngl_Position=projection*viewPosition;\n#if defined(CLIPPLANE) || defined(CLIPPLANE2) || defined(CLIPPLANE3) || defined(CLIPPLANE4) || defined(CLIPPLANE5) || defined(CLIPPLANE6)\nvec4 worldPos=vec4(vPositionW,1.0);\n#endif\n#include<clipPlaneVertex>\n#include<logDepthVertex>\n}";class s_ extends Wf.U{static get IsSupported(){if(!A.l.LastCreatedEngine)return!1;const e=A.l.LastCreatedEngine.getCaps();return e.supportTransformFeedbacks||e.supportComputeShaders}getCapacity(){return this._capacity}get activeParticleCount(){return this._activeCount}set activeParticleCount(e){this._activeCount=Math.min(e,this._capacity)}isReady(){if(!this.emitter||this._imageProcessingConfiguration&&!this._imageProcessingConfiguration.isReady()||!this.particleTexture||!this.particleTexture.isReady())return!1;if(this.blendMode!==i_.BLENDMODE_MULTIPLYADD){if(!this._getWrapper(this.blendMode).effect.isReady())return!1}else{if(!this._getWrapper(i_.BLENDMODE_MULTIPLY).effect.isReady())return!1;if(!this._getWrapper(i_.BLENDMODE_ADD).effect.isReady())return!1}return this._platform.isUpdateBufferCreated()?this._platform.isUpdateBufferReady():(this._recreateUpdateEffect(),!1)}isStarted(){return this._started}isStopped(){return this._stopped}isStopping(){return!1}getActiveCount(){return this._currentActiveCount}start(e=this.startDelay){if(!this.targetStopDuration&&this._hasTargetStopDurationDependantGradient())throw"Particle system started with a targetStopDuration dependant gradient (eg. startSizeGradients) but no targetStopDuration set";e?setTimeout((()=>{this.start(0)}),e):(this._started=!0,this._stopped=!1,this._preWarmDone=!1,this.beginAnimationOnStart&&this.animations&&this.animations.length>0&&this._scene&&this._scene.beginAnimation(this,this.beginAnimationFrom,this.beginAnimationTo,this.beginAnimationLoop))}stop(){this._stopped||(this._stopped=!0)}reset(){this._releaseBuffers(),this._platform.releaseVertexBuffers(),this._currentActiveCount=0,this._targetIndex=0}getClassName(){return"GPUParticleSystem"}getCustomEffect(e=0){var t,i;return null!==(i=null===(t=this._customWrappers[e])||void 0===t?void 0:t.effect)&&void 0!==i?i:this._customWrappers[0].effect}_getCustomDrawWrapper(e=0){var t;return null!==(t=this._customWrappers[e])&&void 0!==t?t:this._customWrappers[0]}setCustomEffect(e,t=0){this._customWrappers[t]=new Ps.q(this._engine),this._customWrappers[t].effect=e}get onBeforeDrawParticlesObservable(){return this._onBeforeDrawParticlesObservable||(this._onBeforeDrawParticlesObservable=new r.y$),this._onBeforeDrawParticlesObservable}get vertexShaderName(){return"gpuRenderParticles"}get vertexBuffers(){return this._renderVertexBuffers[1^this._targetIndex]}get indexBuffer(){return null}_removeGradientAndTexture(e,t,i){return super._removeGradientAndTexture(e,t,i),this._releaseBuffers(),this}addColorGradient(e,t){this._colorGradients||(this._colorGradients=[]);const i=new Kf(e,t);return this._colorGradients.push(i),this._refreshColorGradient(!0),this._releaseBuffers(),this}_refreshColorGradient(e=!1){this._colorGradients&&(e&&this._colorGradients.sort(((e,t)=>e.gradient<t.gradient?-1:e.gradient>t.gradient?1:0)),this._colorGradientsTexture&&(this._colorGradientsTexture.dispose(),this._colorGradientsTexture=null))}forceRefreshGradients(){this._refreshColorGradient(),this._refreshFactorGradient(this._sizeGradients,"_sizeGradientsTexture"),this._refreshFactorGradient(this._angularSpeedGradients,"_angularSpeedGradientsTexture"),this._refreshFactorGradient(this._velocityGradients,"_velocityGradientsTexture"),this._refreshFactorGradient(this._limitVelocityGradients,"_limitVelocityGradientsTexture"),this._refreshFactorGradient(this._dragGradients,"_dragGradientsTexture"),this.reset()}removeColorGradient(e){return this._removeGradientAndTexture(e,this._colorGradients,this._colorGradientsTexture),this._colorGradientsTexture=null,this}resetDrawCache(){var e;for(const t in this._drawWrappers)null===(e=this._drawWrappers[t].drawContext)||void 0===e||e.reset()}_addFactorGradient(e,t,i){const n=new Qf(t,i);e.push(n),this._releaseBuffers()}addSizeGradient(e,t){return this._sizeGradients||(this._sizeGradients=[]),this._addFactorGradient(this._sizeGradients,e,t),this._refreshFactorGradient(this._sizeGradients,"_sizeGradientsTexture",!0),this._releaseBuffers(),this}removeSizeGradient(e){return this._removeGradientAndTexture(e,this._sizeGradients,this._sizeGradientsTexture),this._sizeGradientsTexture=null,this}_refreshFactorGradient(e,t,i=!1){if(!e)return;i&&e.sort(((e,t)=>e.gradient<t.gradient?-1:e.gradient>t.gradient?1:0));const n=this;n[t]&&(n[t].dispose(),n[t]=null)}addAngularSpeedGradient(e,t){return this._angularSpeedGradients||(this._angularSpeedGradients=[]),this._addFactorGradient(this._angularSpeedGradients,e,t),this._refreshFactorGradient(this._angularSpeedGradients,"_angularSpeedGradientsTexture",!0),this._releaseBuffers(),this}removeAngularSpeedGradient(e){return this._removeGradientAndTexture(e,this._angularSpeedGradients,this._angularSpeedGradientsTexture),this._angularSpeedGradientsTexture=null,this}addVelocityGradient(e,t){return this._velocityGradients||(this._velocityGradients=[]),this._addFactorGradient(this._velocityGradients,e,t),this._refreshFactorGradient(this._velocityGradients,"_velocityGradientsTexture",!0),this._releaseBuffers(),this}removeVelocityGradient(e){return this._removeGradientAndTexture(e,this._velocityGradients,this._velocityGradientsTexture),this._velocityGradientsTexture=null,this}addLimitVelocityGradient(e,t){return this._limitVelocityGradients||(this._limitVelocityGradients=[]),this._addFactorGradient(this._limitVelocityGradients,e,t),this._refreshFactorGradient(this._limitVelocityGradients,"_limitVelocityGradientsTexture",!0),this._releaseBuffers(),this}removeLimitVelocityGradient(e){return this._removeGradientAndTexture(e,this._limitVelocityGradients,this._limitVelocityGradientsTexture),this._limitVelocityGradientsTexture=null,this}addDragGradient(e,t){return this._dragGradients||(this._dragGradients=[]),this._addFactorGradient(this._dragGradients,e,t),this._refreshFactorGradient(this._dragGradients,"_dragGradientsTexture",!0),this._releaseBuffers(),this}removeDragGradient(e){return this._removeGradientAndTexture(e,this._dragGradients,this._dragGradientsTexture),this._dragGradientsTexture=null,this}addEmitRateGradient(){return this}removeEmitRateGradient(){return this}addStartSizeGradient(){return this}removeStartSizeGradient(){return this}addColorRemapGradient(){return this}removeColorRemapGradient(){return this}addAlphaRemapGradient(){return this}removeAlphaRemapGradient(){return this}addRampGradient(){return this}removeRampGradient(){return this}getRampGradients(){return null}get useRampGradients(){return!1}set useRampGradients(e){}addLifeTimeGradient(){return this}removeLifeTimeGradient(){return this}constructor(e,t,i,n=null,s=!1){if(super(e),this.layerMask=268435455,this._accumulatedCount=0,this._renderVertexBuffers=[],this._targetIndex=0,this._currentRenderId=-1,this._currentRenderingCameraUniqueId=-1,this._started=!1,this._stopped=!1,this._timeDelta=0,this.updateInAnimate=!1,this._actualFrame=0,this._rawTextureWidth=256,this.onDisposeObservable=new r.y$,this.onStoppedObservable=new r.y$,this.forceDepthWrite=!1,this._preWarmDone=!1,this.isLocal=!1,this.isGPU=!0,this._onBeforeDrawParticlesObservable=null,i&&"Scene"!==i.getClassName()?(this._engine=i,this.defaultProjectionMatrix=o.y3.PerspectiveFovLH(.8,1,.1,100,this._engine.isNDCHalfZRange)):(this._scene=i||A.l.LastCreatedScene,this._engine=this._scene.getEngine(),this.uniqueId=this._scene.getUniqueId(),this._scene.particleSystems.push(this)),this._engine.getCaps().supportComputeShaders){if(!(0,l.q)("BABYLON.ComputeShaderParticleSystem"))throw new Error("The ComputeShaderParticleSystem class is not available! Make sure you have imported it.");this._platform=new((0,l.q)("BABYLON.ComputeShaderParticleSystem"))(this,this._engine)}else{if(!(0,l.q)("BABYLON.WebGL2ParticleSystem"))throw new Error("The WebGL2ParticleSystem class is not available! Make sure you have imported it.");this._platform=new((0,l.q)("BABYLON.WebGL2ParticleSystem"))(this,this._engine)}this._customWrappers={0:new Ps.q(this._engine)},this._customWrappers[0].effect=n,this._drawWrappers={0:new Ps.q(this._engine)},this._drawWrappers[0].drawContext&&(this._drawWrappers[0].drawContext.useInstancing=!0),this._attachImageProcessingConfiguration(null),(t=null!=t?t:{}).randomTextureSize||delete t.randomTextureSize;const a={capacity:5e4,randomTextureSize:this._engine.getCaps().maxTextureSize,...t},h=t;isFinite(h)&&(a.capacity=h),this._capacity=a.capacity,this._activeCount=a.capacity,this._currentActiveCount=0,this._isAnimationSheetEnabled=s,this.particleEmitterType=new n_.S;const c=Math.min(this._engine.getCaps().maxTextureSize,a.randomTextureSize);let u=[];for(let e=0;e<c;++e)u.push(Math.random()),u.push(Math.random()),u.push(Math.random()),u.push(Math.random());this._randomTexture=new Ee.l(new Float32Array(u),c,1,5,i,!1,!1,1,1),this._randomTexture.name="GPUParticleSystem_random1",this._randomTexture.wrapU=1,this._randomTexture.wrapV=1,u=[];for(let e=0;e<c;++e)u.push(Math.random()),u.push(Math.random()),u.push(Math.random()),u.push(Math.random());this._randomTexture2=new Ee.l(new Float32Array(u),c,1,5,i,!1,!1,1,1),this._randomTexture2.name="GPUParticleSystem_random2",this._randomTexture2.wrapU=1,this._randomTexture2.wrapV=1,this._randomTextureSize=c}_reset(){this._releaseBuffers()}_createVertexBuffers(e,t,i){const n={};n.position=t.createVertexBuffer("position",0,3,this._attributesStrideSize,!0);let s=3;n.age=t.createVertexBuffer("age",s,1,this._attributesStrideSize,!0),s+=1,n.size=t.createVertexBuffer("size",s,3,this._attributesStrideSize,!0),s+=3,n.life=t.createVertexBuffer("life",s,1,this._attributesStrideSize,!0),s+=1,s+=4,this.billboardMode===i_.BILLBOARDMODE_STRETCHED&&(n.direction=t.createVertexBuffer("direction",s,3,this._attributesStrideSize,!0)),s+=3,this._platform.alignDataInBuffer&&(s+=1),this.particleEmitterType instanceof Xf.E&&(s+=3,this._platform.alignDataInBuffer&&(s+=1)),this._colorGradientsTexture||(n.color=t.createVertexBuffer("color",s,4,this._attributesStrideSize,!0),s+=4),this._isBillboardBased||(n.initialDirection=t.createVertexBuffer("initialDirection",s,3,this._attributesStrideSize,!0),s+=3,this._platform.alignDataInBuffer&&(s+=1)),this.noiseTexture&&(n.noiseCoordinates1=t.createVertexBuffer("noiseCoordinates1",s,3,this._attributesStrideSize,!0),s+=3,this._platform.alignDataInBuffer&&(s+=1),n.noiseCoordinates2=t.createVertexBuffer("noiseCoordinates2",s,3,this._attributesStrideSize,!0),s+=3,this._platform.alignDataInBuffer&&(s+=1)),n.angle=t.createVertexBuffer("angle",s,1,this._attributesStrideSize,!0),this._angularSpeedGradientsTexture?s++:s+=2,this._isAnimationSheetEnabled&&(n.cellIndex=t.createVertexBuffer("cellIndex",s,1,this._attributesStrideSize,!0),s+=1,this.spriteRandomStartCell&&(n.cellStartOffset=t.createVertexBuffer("cellStartOffset",s,1,this._attributesStrideSize,!0),s+=1)),n.offset=i.createVertexBuffer("offset",0,2),n.uv=i.createVertexBuffer("uv",2,2),this._renderVertexBuffers.push(n),this._platform.createVertexBuffers(e,n),this.resetDrawCache()}_initialize(e=!1){if(this._buffer0&&!e)return;const t=this._engine,i=new Array;this._attributesStrideSize=21,this._targetIndex=0,this._platform.alignDataInBuffer&&(this._attributesStrideSize+=1),this.particleEmitterType instanceof Xf.E&&(this._attributesStrideSize+=3,this._platform.alignDataInBuffer&&(this._attributesStrideSize+=1)),this.isBillboardBased||(this._attributesStrideSize+=3,this._platform.alignDataInBuffer&&(this._attributesStrideSize+=1)),this._colorGradientsTexture&&(this._attributesStrideSize-=4),this._angularSpeedGradientsTexture&&(this._attributesStrideSize-=1),this._isAnimationSheetEnabled&&(this._attributesStrideSize+=1,this.spriteRandomStartCell&&(this._attributesStrideSize+=1)),this.noiseTexture&&(this._attributesStrideSize+=6,this._platform.alignDataInBuffer&&(this._attributesStrideSize+=2)),this._platform.alignDataInBuffer&&(this._attributesStrideSize+=3-(this._attributesStrideSize+3&3));const n=this.particleEmitterType instanceof Xf.E,s=o.jp.Vector3[0];let r=0;for(let e=0;e<this._capacity;e++)if(i.push(0),i.push(0),i.push(0),i.push(0),i.push(0),i.push(0),i.push(0),i.push(0),i.push(Math.random()),i.push(Math.random()),i.push(Math.random()),i.push(Math.random()),n?(this.particleEmitterType.particleDestinationGenerator(e,null,s),i.push(s.x),i.push(s.y),i.push(s.z)):(i.push(0),i.push(0),i.push(0)),this._platform.alignDataInBuffer&&i.push(0),r+=16,n&&(this.particleEmitterType.particlePositionGenerator(e,null,s),i.push(s.x),i.push(s.y),i.push(s.z),this._platform.alignDataInBuffer&&i.push(0),r+=4),this._colorGradientsTexture||(i.push(0),i.push(0),i.push(0),i.push(0),r+=4),this.isBillboardBased||(i.push(0),i.push(0),i.push(0),this._platform.alignDataInBuffer&&i.push(0),r+=4),this.noiseTexture&&(i.push(Math.random()),i.push(Math.random()),i.push(Math.random()),this._platform.alignDataInBuffer&&i.push(0),i.push(Math.random()),i.push(Math.random()),i.push(Math.random()),this._platform.alignDataInBuffer&&i.push(0),r+=8),i.push(0),r+=1,this._angularSpeedGradientsTexture||(i.push(0),r+=1),this._isAnimationSheetEnabled&&(i.push(0),r+=1,this.spriteRandomStartCell&&(i.push(0),r+=1)),this._platform.alignDataInBuffer){let e=3-(r+3&3);for(r+=e;e-- >0;)i.push(0)}const a=new Float32Array([.5,.5,1,1,-.5,.5,0,1,.5,-.5,1,0,-.5,-.5,0,0]),l=this._platform.createParticleBuffer(i),h=this._platform.createParticleBuffer(i);this._buffer0=new qe.l(t,l,!1,this._attributesStrideSize),this._buffer1=new qe.l(t,h,!1,this._attributesStrideSize),this._spriteBuffer=new qe.l(t,a,!1,4),this._renderVertexBuffers=[],this._createVertexBuffers(this._buffer0,this._buffer1,this._spriteBuffer),this._createVertexBuffers(this._buffer1,this._buffer0,this._spriteBuffer),this._sourceBuffer=this._buffer0,this._targetBuffer=this._buffer1}_recreateUpdateEffect(){this._createColorGradientTexture(),this._createSizeGradientTexture(),this._createAngularSpeedGradientTexture(),this._createVelocityGradientTexture(),this._createLimitVelocityGradientTexture(),this._createDragGradientTexture();let e=this.particleEmitterType?this.particleEmitterType.getEffectDefines():"";return this._isBillboardBased&&(e+="\n#define BILLBOARD"),this._colorGradientsTexture&&(e+="\n#define COLORGRADIENTS"),this._sizeGradientsTexture&&(e+="\n#define SIZEGRADIENTS"),this._angularSpeedGradientsTexture&&(e+="\n#define ANGULARSPEEDGRADIENTS"),this._velocityGradientsTexture&&(e+="\n#define VELOCITYGRADIENTS"),this._limitVelocityGradientsTexture&&(e+="\n#define LIMITVELOCITYGRADIENTS"),this._dragGradientsTexture&&(e+="\n#define DRAGGRADIENTS"),this.isAnimationSheetEnabled&&(e+="\n#define ANIMATESHEET",this.spriteRandomStartCell&&(e+="\n#define ANIMATESHEETRANDOMSTART")),this.noiseTexture&&(e+="\n#define NOISE"),this.isLocal&&(e+="\n#define LOCAL"),!(!this._platform.isUpdateBufferCreated()||this._cachedUpdateDefines!==e)||(this._cachedUpdateDefines=e,this._updateBuffer=this._platform.createUpdateBuffer(e),this._platform.isUpdateBufferReady())}_getWrapper(e){const t=this._getCustomDrawWrapper(e);if(null==t?void 0:t.effect)return t;const i=[];this.fillDefines(i,e);let n=this._drawWrappers[e];n||(n=new Ps.q(this._engine),n.drawContext&&(n.drawContext.useInstancing=!0),this._drawWrappers[e]=n);const s=i.join("\n");if(n.defines!==s){const e=[],t=[],i=[];this.fillUniformsAttributesAndSamplerNames(t,e,i),n.setEffect(this._engine.createEffect("gpuRenderParticles",e,t,i,s),s)}return n}static _GetAttributeNamesOrOptions(e=!1,t=!1,i=!1,n=!1){const s=[qe.o.PositionKind,"age","life","size","angle"];return e||s.push(qe.o.ColorKind),t&&s.push("cellIndex"),i||s.push("initialDirection"),n||s.push("direction"),s.push("offset",qe.o.UVKind),s}static _GetEffectCreationOptions(e=!1,t=!1){const i=["emitterWM","worldOffset","view","projection","colorDead","invView","translationPivot","eyePosition"];return(0,Ga.qx)(i),e&&i.push("sheetInfos"),t&&i.push("logarithmicDepthConstant"),i}fillDefines(e,t=0){if(this._scene&&(0,Ga.lK)(this,this._scene,e),t===i_.BLENDMODE_MULTIPLY&&e.push("#define BLENDMULTIPLYMODE"),this.isLocal&&e.push("#define LOCAL"),this.useLogarithmicDepth&&e.push("#define LOGARITHMICDEPTH"),this._isBillboardBased)switch(e.push("#define BILLBOARD"),this.billboardMode){case i_.BILLBOARDMODE_Y:e.push("#define BILLBOARDY");break;case i_.BILLBOARDMODE_STRETCHED:e.push("#define BILLBOARDSTRETCHED");break;case i_.BILLBOARDMODE_ALL:e.push("#define BILLBOARDMODE_ALL")}this._colorGradientsTexture&&e.push("#define COLORGRADIENTS"),this.isAnimationSheetEnabled&&e.push("#define ANIMATESHEET"),this._imageProcessingConfiguration&&(this._imageProcessingConfiguration.prepareDefines(this._imageProcessingConfigurationDefines),e.push(""+this._imageProcessingConfigurationDefines.toString()))}fillUniformsAttributesAndSamplerNames(e,t,i){t.push(...s_._GetAttributeNamesOrOptions(!!this._colorGradientsTexture,this._isAnimationSheetEnabled,this._isBillboardBased,this._isBillboardBased&&this.billboardMode===i_.BILLBOARDMODE_STRETCHED)),e.push(...s_._GetEffectCreationOptions(this._isAnimationSheetEnabled,this.useLogarithmicDepth)),i.push("diffuseSampler","colorGradientSampler"),this._imageProcessingConfiguration&&(ki.$.PrepareUniforms(e,this._imageProcessingConfigurationDefines),ki.$.PrepareSamplers(i,this._imageProcessingConfigurationDefines))}animate(e=!1){var t;this._timeDelta=this.updateSpeed*(e?this.preWarmStepOffset:(null===(t=this._scene)||void 0===t?void 0:t.getAnimationRatio())||1),this._actualFrame+=this._timeDelta,this._stopped||this.targetStopDuration&&this._actualFrame>=this.targetStopDuration&&this.stop(),this.updateInAnimate&&this._update()}_createFactorGradientTexture(e,t){const i=this[t];if(!e||!e.length||i)return;const n=new Float32Array(this._rawTextureWidth);for(let t=0;t<this._rawTextureWidth;t++){const i=t/this._rawTextureWidth;Zf.GetCurrentGradient(i,e,((e,i,s)=>{n[t]=lt.R.Lerp(e.factor1,i.factor1,s)}))}this[t]=Ee.l.CreateRTexture(n,this._rawTextureWidth,1,this._scene||this._engine,!1,!1,1),this[t].name=t.substring(1)}_createSizeGradientTexture(){this._createFactorGradientTexture(this._sizeGradients,"_sizeGradientsTexture")}_createAngularSpeedGradientTexture(){this._createFactorGradientTexture(this._angularSpeedGradients,"_angularSpeedGradientsTexture")}_createVelocityGradientTexture(){this._createFactorGradientTexture(this._velocityGradients,"_velocityGradientsTexture")}_createLimitVelocityGradientTexture(){this._createFactorGradientTexture(this._limitVelocityGradients,"_limitVelocityGradientsTexture")}_createDragGradientTexture(){this._createFactorGradientTexture(this._dragGradients,"_dragGradientsTexture")}_createColorGradientTexture(){if(!this._colorGradients||!this._colorGradients.length||this._colorGradientsTexture)return;const e=new Uint8Array(4*this._rawTextureWidth),t=a.zZ.Color4[0];for(let i=0;i<this._rawTextureWidth;i++){const n=i/this._rawTextureWidth;Zf.GetCurrentGradient(n,this._colorGradients,((n,s,r)=>{a.HE.LerpToRef(n.color1,s.color1,r,t),e[4*i]=255*t.r,e[4*i+1]=255*t.g,e[4*i+2]=255*t.b,e[4*i+3]=255*t.a}))}this._colorGradientsTexture=Ee.l.CreateRGBATexture(e,this._rawTextureWidth,1,this._scene,!1,!1,1),this._colorGradientsTexture.name="colorGradients"}_render(e,t){var i,n;const s=this._getWrapper(e),r=s.effect;this._engine.enableEffect(s);const a=(null===(i=this._scene)||void 0===i?void 0:i.getViewMatrix())||o.y3.IdentityReadOnly;if(r.setMatrix("view",a),r.setMatrix("projection",null!==(n=this.defaultProjectionMatrix)&&void 0!==n?n:this._scene.getProjectionMatrix()),r.setTexture("diffuseSampler",this.particleTexture),r.setVector2("translationPivot",this.translationPivot),r.setVector3("worldOffset",this.worldOffset),this.isLocal&&r.setMatrix("emitterWM",t),this._colorGradientsTexture?r.setTexture("colorGradientSampler",this._colorGradientsTexture):r.setDirectColor4("colorDead",this.colorDead),this._isAnimationSheetEnabled&&this.particleTexture){const e=this.particleTexture.getBaseSize();r.setFloat3("sheetInfos",this.spriteCellWidth/e.width,this.spriteCellHeight/e.height,e.width/this.spriteCellWidth)}if(this._isBillboardBased&&this._scene){const e=this._scene.activeCamera;r.setVector3("eyePosition",e.globalPosition)}const l=r.defines;if(this._scene&&(0,Ga.an)(r,this,this._scene),l.indexOf("#define BILLBOARDMODE_ALL")>=0){const e=a.clone();e.invert(),r.setMatrix("invView",e)}switch(this.useLogarithmicDepth&&this._scene&&La.G.BindLogDepth(l,r,this._scene),this._imageProcessingConfiguration&&!this._imageProcessingConfiguration.applyByPostProcess&&this._imageProcessingConfiguration.bind(r),e){case i_.BLENDMODE_ADD:this._engine.setAlphaMode(1);break;case i_.BLENDMODE_ONEONE:this._engine.setAlphaMode(6);break;case i_.BLENDMODE_STANDARD:this._engine.setAlphaMode(2);break;case i_.BLENDMODE_MULTIPLY:this._engine.setAlphaMode(4)}return this._platform.bindDrawBuffers(this._targetIndex,r),this._onBeforeDrawParticlesObservable&&this._onBeforeDrawParticlesObservable.notifyObservers(r),this._engine.drawArraysType(7,0,4,this._currentActiveCount),this._engine.setAlphaMode(0),this._currentActiveCount}_update(e){if(!this.emitter||!this._targetBuffer)return;if(!this._recreateUpdateEffect())return;if(!e)if(this.emitter.position)e=this.emitter.getWorldMatrix();else{const t=this.emitter;e=o.jp.Matrix[0],o.y3.TranslationToRef(t.x,t.y,t.z,e)}this._platform.preUpdateParticleBuffer(),this._updateBuffer.setFloat("currentCount",this._currentActiveCount),this._updateBuffer.setFloat("timeDelta",this._timeDelta),this._updateBuffer.setFloat("stopFactor",this._stopped?0:1),this._updateBuffer.setInt("randomTextureSize",this._randomTextureSize),this._updateBuffer.setFloat2("lifeTime",this.minLifeTime,this.maxLifeTime),this._updateBuffer.setFloat2("emitPower",this.minEmitPower,this.maxEmitPower),this._colorGradientsTexture||(this._updateBuffer.setDirectColor4("color1",this.color1),this._updateBuffer.setDirectColor4("color2",this.color2)),this._updateBuffer.setFloat2("sizeRange",this.minSize,this.maxSize),this._updateBuffer.setFloat4("scaleRange",this.minScaleX,this.maxScaleX,this.minScaleY,this.maxScaleY),this._updateBuffer.setFloat4("angleRange",this.minAngularSpeed,this.maxAngularSpeed,this.minInitialRotation,this.maxInitialRotation),this._updateBuffer.setVector3("gravity",this.gravity),this._limitVelocityGradientsTexture&&this._updateBuffer.setFloat("limitVelocityDamping",this.limitVelocityDamping),this.particleEmitterType&&this.particleEmitterType.applyToShader(this._updateBuffer),this._isAnimationSheetEnabled&&this._updateBuffer.setFloat4("cellInfos",this.startSpriteCellID,this.endSpriteCellID,this.spriteCellChangeSpeed,this.spriteCellLoop?1:0),this.noiseTexture&&this._updateBuffer.setVector3("noiseStrength",this.noiseStrength),this.isLocal||this._updateBuffer.setMatrix("emitterWM",e),this._platform.updateParticleBuffer(this._targetIndex,this._targetBuffer,this._currentActiveCount),this._targetIndex++,2===this._targetIndex&&(this._targetIndex=0);const t=this._sourceBuffer;this._sourceBuffer=this._targetBuffer,this._targetBuffer=t}render(e=!1,t=!1){if(!this._started)return 0;if(!this.isReady())return 0;if(!e&&this._scene){if(!this._preWarmDone&&this.preWarmCycles){for(let e=0;e<this.preWarmCycles;e++)this.animate(!0),this.render(!0,!0);this._preWarmDone=!0}if(this._currentRenderId===this._scene.getRenderId()&&(!this._scene.activeCamera||this._scene.activeCamera&&this._currentRenderingCameraUniqueId===this._scene.activeCamera.uniqueId))return 0;this._currentRenderId=this._scene.getRenderId(),this._scene.activeCamera&&(this._currentRenderingCameraUniqueId=this._scene.activeCamera.uniqueId)}if(this._initialize(),this._accumulatedCount+=this.emitRate*this._timeDelta,this._accumulatedCount>1){const e=0|this._accumulatedCount;this._accumulatedCount-=e,this._currentActiveCount=Math.min(this._activeCount,this._currentActiveCount+e)}if(!this._currentActiveCount)return 0;let i;if(this.emitter.position)i=this.emitter.getWorldMatrix();else{const e=this.emitter;i=o.jp.Matrix[0],o.y3.TranslationToRef(e.x,e.y,e.z,i)}const n=this._engine;this.updateInAnimate||this._update(i);let s=0;return e||t||(n.setState(!1),this.forceDepthWrite&&n.setDepthWrite(!0),s=this.blendMode===i_.BLENDMODE_MULTIPLYADD?this._render(i_.BLENDMODE_MULTIPLY,i)+this._render(i_.BLENDMODE_ADD,i):this._render(this.blendMode,i),this._engine.setAlphaMode(0)),s}rebuild(){this._initialize(!0)}_releaseBuffers(){this._buffer0&&(this._buffer0.dispose(),this._buffer0=null),this._buffer1&&(this._buffer1.dispose(),this._buffer1=null),this._spriteBuffer&&(this._spriteBuffer.dispose(),this._spriteBuffer=null),this._platform.releaseBuffers()}dispose(e=!0){for(const e in this._drawWrappers)this._drawWrappers[e].dispose();if(this._drawWrappers={},this._scene){const e=this._scene.particleSystems.indexOf(this);e>-1&&this._scene.particleSystems.splice(e,1)}this._releaseBuffers(),this._platform.releaseVertexBuffers();for(let e=0;e<this._renderVertexBuffers.length;++e){const t=this._renderVertexBuffers[e];for(const e in t)t[e].dispose()}this._renderVertexBuffers=[],this._colorGradientsTexture&&(this._colorGradientsTexture.dispose(),this._colorGradientsTexture=null),this._sizeGradientsTexture&&(this._sizeGradientsTexture.dispose(),this._sizeGradientsTexture=null),this._angularSpeedGradientsTexture&&(this._angularSpeedGradientsTexture.dispose(),this._angularSpeedGradientsTexture=null),this._velocityGradientsTexture&&(this._velocityGradientsTexture.dispose(),this._velocityGradientsTexture=null),this._limitVelocityGradientsTexture&&(this._limitVelocityGradientsTexture.dispose(),this._limitVelocityGradientsTexture=null),this._dragGradientsTexture&&(this._dragGradientsTexture.dispose(),this._dragGradientsTexture=null),this._randomTexture&&(this._randomTexture.dispose(),this._randomTexture=null),this._randomTexture2&&(this._randomTexture2.dispose(),this._randomTexture2=null),e&&this.particleTexture&&(this.particleTexture.dispose(),this.particleTexture=null),e&&this.noiseTexture&&(this.noiseTexture.dispose(),this.noiseTexture=null),this.onStoppedObservable.clear(),this.onDisposeObservable.notifyObservers(this),this.onDisposeObservable.clear()}clone(e,t,i=!1){const n={...this._customWrappers};let s=null;const r=this._engine;if(r.createEffectForParticles&&null!=this.customShader){s=this.customShader;const e=s.shaderOptions.defines.length>0?s.shaderOptions.defines.join("\n"):"";n[0]=r.createEffectForParticles(s.shaderPath.fragmentElement,s.shaderOptions.uniforms,s.shaderOptions.samplers,e,void 0,void 0,void 0,this)}const o=this.serialize(i),a=s_.Parse(o,this._scene||this._engine,this._rootUrl);return a.name=e,a.customShader=s,a._customWrappers=n,void 0===t&&(t=this.emitter),this.noiseTexture&&(a.noiseTexture=this.noiseTexture.clone()),a.emitter=t,a}serialize(e=!1){const t={};return i_._Serialize(t,this,e),t.activeParticleCount=this.activeParticleCount,t.randomTextureSize=this._randomTextureSize,t.customShader=this.customShader,t}static Parse(e,t,i,n=!1,s){const r=e.name;let o,a;t instanceof Rn.B?o=t:(a=t,o=a.getEngine());const l=new s_(r,{capacity:s||e.capacity,randomTextureSize:e.randomTextureSize},t,null,e.isAnimationSheetEnabled);if(l._rootUrl=i,e.customShader&&o.createEffectForParticles){const t=e.customShader,i=t.shaderOptions.defines.length>0?t.shaderOptions.defines.join("\n"):"",n=o.createEffectForParticles(t.shaderPath.fragmentElement,t.shaderOptions.uniforms,t.shaderOptions.samplers,i,void 0,void 0,void 0,l);l.setCustomEffect(n,0),l.customShader=t}return e.id&&(l.id=e.id),e.activeParticleCount&&(l.activeParticleCount=e.activeParticleCount),i_._Parse(e,l,t,i),e.preventAutoStart&&(l.preventAutoStart=e.preventAutoStart),n||l.preventAutoStart||l.start(),l}}class r_{constructor(){this._emitterNodeIsOwned=!0,this.systems=new Array}get emitterNode(){return this._emitterNode}set emitterNode(e){this._emitterNodeIsOwned&&this._emitterNode&&(this._emitterNode.dispose&&this._emitterNode.dispose(),this._emitterNodeIsOwned=!1);for(const t of this.systems)t.emitter=e;this._emitterNode=e}setEmitterAsSphere(e,t,i){this._emitterNodeIsOwned&&this._emitterNode&&this._emitterNode.dispose&&this._emitterNode.dispose(),this._emitterNodeIsOwned=!0,this._emitterCreationOptions={kind:"Sphere",options:e,renderingGroupId:t};const n=Kn("emitterSphere",{diameter:e.diameter,segments:e.segments},i);n.renderingGroupId=t;const s=new Gi.K("emitterSphereMaterial",i);s.emissiveColor=e.color,n.material=s;for(const e of this.systems)e.emitter=n;this._emitterNode=n}start(e){for(const t of this.systems)e&&(t.emitter=e),t.start()}dispose(){for(const e of this.systems)e.dispose();this.systems.length=0,this._emitterNode&&(this._emitterNode.dispose&&this._emitterNode.dispose(),this._emitterNode=null)}serialize(e=!1){const t={systems:[]};for(const i of this.systems)t.systems.push(i.serialize(e));return this._emitterNode&&(t.emitter=this._emitterCreationOptions),t}static Parse(e,t,i=!1,n){const s=new r_,r=this.BaseAssetsUrl+"/textures/";t=t||A.l.LastCreatedScene;for(const o of e.systems)s.systems.push(i?s_.Parse(o,t,r,!0,n):i_.Parse(o,t,r,!0,n));if(e.emitter){const i=e.emitter.options;"Sphere"===e.emitter.kind&&s.setEmitterAsSphere({diameter:i.diameter,segments:i.segments,color:a.Wo.FromArray(i.color)},e.emitter.renderingGroupId,t)}return s}}r_.BaseAssetsUrl="https://assets.babylonjs.com/particles";class o_{static CreateDefault(e,t=500,i,n=!1){let s;return s=n?new s_("default system",{capacity:t},i):new i_("default system",t,i),s.emitter=e,s.particleTexture=new Ce.x("https://assets.babylonjs.com/textures/flare.png",s.getScene()),s.createConeEmitter(.1,Math.PI/4),s.color1=new a.HE(1,1,1,1),s.color2=new a.HE(1,1,1,1),s.colorDead=new a.HE(1,1,1,0),s.minSize=.1,s.maxSize=.1,s.minEmitPower=2,s.maxEmitPower=2,s.updateSpeed=1/60,s.emitRate=30,s}static CreateAsync(e,t,i=!1,n){t||(t=A.l.LastCreatedScene);const s={};return t.addPendingData(s),new Promise(((r,o)=>{if(i&&!s_.IsSupported)return t.removePendingData(s),o("Particle system with GPU is not supported.");de.w1.LoadFile(`${o_.BaseAssetsUrl}/systems/${e}.json`,(e=>{t.removePendingData(s);const o=JSON.parse(e.toString());return r(r_.Parse(o,t,i,n))}),void 0,void 0,void 0,(()=>(t.removePendingData(s),o(`An error occurred with the creation of your particle system. Check if your type '${e}' exists.`))))}))}static ExportSet(e){const t=new r_;for(const i of e)t.systems.push(i);return t}static ParseFromFileAsync(e,t,i,n=!1,s="",r){return new Promise(((o,a)=>{const l=new Kc.g;l.addEventListener("readystatechange",(()=>{if(4==l.readyState)if(200==l.status){const t=JSON.parse(l.responseText);let a;a=n?s_.Parse(t,i,s,!1,r):i_.Parse(t,i,s,!1,r),e&&(a.name=e),o(a)}else a("Unable to load the particle system")})),l.open("GET",t),l.send()}))}static ParseFromSnippetAsync(e,t,i=!1,n="",s){if("_BLANK"===e){const e=this.CreateDefault(null);return e.start(),Promise.resolve(e)}return new Promise(((r,o)=>{const a=new Kc.g;a.addEventListener("readystatechange",(()=>{if(4==a.readyState)if(200==a.status){const o=JSON.parse(JSON.parse(a.responseText).jsonPayload),l=JSON.parse(o.particleSystem);let h;h=i?s_.Parse(l,t,n,!1,s):i_.Parse(l,t,n,!1,s),h.snippetId=e,r(h)}else o("Unable to load the snippet "+e)})),a.open("GET",this.SnippetUrl+"/"+e.replace(/#/g,"/")),a.send()}))}}o_.BaseAssetsUrl=r_.BaseAssetsUrl,o_.SnippetUrl="https://snippet.babylonjs.com",o_.CreateFromSnippetAsync=o_.ParseFromSnippetAsync,n.p.AddParser(ve.l.NAME_PARTICLESYSTEM,((e,t,i,s)=>{const r=n.p.GetIndividualParser(ve.l.NAME_PARTICLESYSTEM);if(r&&void 0!==e.particleSystems&&null!==e.particleSystems)for(let n=0,o=e.particleSystems.length;n<o;n++){const o=e.particleSystems[n];i.particleSystems.push(r(o,t,s))}})),n.p.AddIndividualParser(ve.l.NAME_PARTICLESYSTEM,((e,t,i)=>e.activeParticleCount?s_.Parse(e,t,i):i_.Parse(e,t,i))),ue.D.prototype.createEffectForParticles=function(e,t=[],i=[],n="",s,r,o,a){var l;let h=[],c=[];const u=[];return a?a.fillUniformsAttributesAndSamplerNames(c,h,u):(h=i_._GetAttributeNamesOrOptions(),c=i_._GetEffectCreationOptions()),-1===n.indexOf(" BILLBOARD")&&(n+="\n#define BILLBOARD\n"),(null==a?void 0:a.isAnimationSheetEnabled)&&-1===n.indexOf(" ANIMATESHEET")&&(n+="\n#define ANIMATESHEET\n"),-1===i.indexOf("diffuseSampler")&&i.push("diffuseSampler"),this.createEffect({vertex:null!==(l=null==a?void 0:a.vertexShaderName)&&void 0!==l?l:"particles",fragmentElement:e},h,c.concat(t),u.concat(i),n,s,r,o)},Nt.Kj.prototype.getEmittedParticleSystems=function(){const e=new Array;for(let t=0;t<this.getScene().particleSystems.length;t++){const i=this.getScene().particleSystems[t];i.emitter===this&&e.push(i)}return e},Nt.Kj.prototype.getHierarchyEmittedParticleSystems=function(){const e=new Array,t=this.getDescendants();t.push(this);for(let i=0;i<this.getScene().particleSystems.length;i++){const n=this.getScene().particleSystems[i],s=n.emitter;s.position&&-1!==t.indexOf(s)&&e.push(n)}return e};class a_{getBoundingInfo(){return this._boundingInfo}get hasBoundingInfo(){return null!==this._boundingInfo}constructor(e,t,i,n,s,r,l,h,c=null,u=null){this.idx=0,this.id=0,this.color=new a.HE(1,1,1,1),this.position=o.P.Zero(),this.rotation=o.P.Zero(),this.scaling=o.P.One(),this.uvs=new o.Lt(0,0,1,1),this.velocity=o.P.Zero(),this.pivot=o.P.Zero(),this.translateFromPivot=!1,this.alive=!0,this.isVisible=!0,this._pos=0,this._ind=0,this.shapeId=0,this.idxInShape=0,this._stillInvisible=!1,this._rotationMatrix=[1,0,0,0,1,0,0,0,1],this.parentId=null,this.materialIndex=null,this.props=null,this.cullingStrategy=Un.x.CULLINGSTRATEGY_BOUNDINGSPHERE_ONLY,this._globalPosition=o.P.Zero(),this.idx=e,this.id=t,this._pos=i,this._ind=n,this._model=s,this.shapeId=r,this.idxInShape=l,this._sps=h,c&&(this._modelBoundingInfo=c,this._boundingInfo=new wn.j(c.minimum,c.maximum)),null!==u&&(this.materialIndex=u)}copyToRef(e){return e.position.copyFrom(this.position),e.rotation.copyFrom(this.rotation),this.rotationQuaternion&&(e.rotationQuaternion?e.rotationQuaternion.copyFrom(this.rotationQuaternion):e.rotationQuaternion=this.rotationQuaternion.clone()),e.scaling.copyFrom(this.scaling),this.color&&(e.color?e.color.copyFrom(this.color):e.color=this.color.clone()),e.uvs.copyFrom(this.uvs),e.velocity.copyFrom(this.velocity),e.pivot.copyFrom(this.pivot),e.translateFromPivot=this.translateFromPivot,e.alive=this.alive,e.isVisible=this.isVisible,e.parentId=this.parentId,e.cullingStrategy=this.cullingStrategy,null!==this.materialIndex&&(e.materialIndex=this.materialIndex),this}get scale(){return this.scaling}set scale(e){this.scaling=e}get quaternion(){return this.rotationQuaternion}set quaternion(e){this.rotationQuaternion=e}intersectsMesh(e){return!(!this._boundingInfo||!e.hasBoundingInfo)&&(this._sps._bSphereOnly?Nn.K.Intersects(this._boundingInfo.boundingSphere,e.getBoundingInfo().boundingSphere):this._boundingInfo.intersects(e.getBoundingInfo(),!1))}isInFrustum(e){return null!==this._boundingInfo&&this._boundingInfo.isInFrustum(e,this.cullingStrategy)}getRotationMatrix(e){let t;if(this.rotationQuaternion)t=this.rotationQuaternion;else{t=o.jp.Quaternion[0];const e=this.rotation;o._f.RotationYawPitchRollToRef(e.y,e.x,e.z,t)}t.toRotationMatrix(e)}}class l_{get shapeID(){return this.shapeId}set shapeID(e){this.shapeId=e}constructor(e,t,i,n,s,r,o,a,l){this._indicesLength=0,this.shapeId=e,this._shape=t,this._indices=i,this._indicesLength=i.length,this._shapeUV=r,this._shapeColors=s,this._normals=n,this._positionFunction=o,this._vertexFunction=a,this._material=l}}class h_{constructor(e,t,i,n){this.idx=0,this.ind=0,this.indicesLength=0,this.sqDistance=0,this.materialIndex=0,this.idx=e,this.ind=t,this.indicesLength=i,this.materialIndex=n}}class c_{constructor(){this.position=o.P.Zero(),this.color=new a.HE(1,1,1,1),this.uv=o.FM.Zero()}get x(){return this.position.x}set x(e){this.position.x=e}get y(){return this.position.y}set y(e){this.position.y=e}get z(){return this.position.z}set z(e){this.position.z=e}}class u_{constructor(e,t,i){this.particles=new Array,this.nbParticles=0,this.billboard=!1,this.recomputeNormals=!1,this.counter=0,this.vars={},this._bSphereOnly=!1,this._bSphereRadiusFactor=1,this._positions=new Array,this._indices=new Array,this._normals=new Array,this._colors=new Array,this._uvs=new Array,this._index=0,this._updatable=!0,this._pickable=!1,this._isVisibilityBoxLocked=!1,this._alwaysVisible=!1,this._depthSort=!1,this._expandable=!1,this._shapeCounter=0,this._copy=new a_(0,0,0,0,null,0,0,this),this._color=new a.HE(0,0,0,0),this._computeParticleColor=!0,this._computeParticleTexture=!0,this._computeParticleRotation=!0,this._computeParticleVertex=!1,this._computeBoundingBox=!1,this._autoFixFaceOrientation=!1,this._depthSortParticles=!0,this._mustUnrotateFixedNormals=!1,this._particlesIntersect=!1,this._needs32Bits=!1,this._isNotBuilt=!0,this._lastParticleId=0,this._idxOfId=[],this._multimaterialEnabled=!1,this._useModelMaterial=!1,this._depthSortFunction=(e,t)=>t.sqDistance-e.sqDistance,this._materialSortFunction=(e,t)=>e.materialIndex-t.materialIndex,this._autoUpdateSubMeshes=!1,this._recomputeInvisibles=!1,this.name=e,this._scene=t||A.l.LastCreatedScene,this._camera=t.activeCamera,this._pickable=!!i&&i.isPickable,this._depthSort=!!i&&i.enableDepthSort,this._multimaterialEnabled=!!i&&i.enableMultiMaterial,this._useModelMaterial=!!i&&i.useModelMaterial,this._multimaterialEnabled=!!this._useModelMaterial||this._multimaterialEnabled,this._expandable=!!i&&i.expandable,this._particlesIntersect=!!i&&i.particleIntersection,this._bSphereOnly=!!i&&i.boundingSphereOnly,this._bSphereRadiusFactor=i&&i.bSphereRadiusFactor?i.bSphereRadiusFactor:1,this._computeBoundingBox=!!(null==i?void 0:i.computeBoundingBox)&&i.computeBoundingBox,this._autoFixFaceOrientation=!!(null==i?void 0:i.autoFixFaceOrientation)&&i.autoFixFaceOrientation,i&&void 0!==i.updatable?this._updatable=i.updatable:this._updatable=!0,this._pickable&&(this.pickedBySubMesh=[[]],this.pickedParticles=this.pickedBySubMesh[0]),(this._depthSort||this._multimaterialEnabled)&&(this.depthSortedParticles=[]),this._multimaterialEnabled&&(this._multimaterial=new Ph.G(this.name+"MultiMaterial",this._scene),this._materials=[],this._materialIndexesById={}),this._tmpVertex=new c_}buildMesh(){if(!this._isNotBuilt&&this.mesh)return this.mesh;if(0===this.nbParticles&&!this.mesh){const e=Ca("",{radius:1,tessellation:3},this._scene);this.addShape(e,1),e.dispose()}if(this._indices32=this._needs32Bits?new Uint32Array(this._indices):new Uint16Array(this._indices),this._positions32=new Float32Array(this._positions),this._uvs32=new Float32Array(this._uvs),this._colors32=new Float32Array(this._colors),!this.mesh){const e=new Nt.Kj(this.name,this._scene);this.mesh=e}!this._updatable&&this._multimaterialEnabled&&this._sortParticlesByMaterial(),this.recomputeNormals&&sn.x.ComputeNormals(this._positions32,this._indices32,this._normals),this._normals32=new Float32Array(this._normals),this._fixedNormal32=new Float32Array(this._normals),this._mustUnrotateFixedNormals&&this._unrotateFixedNormals();const e=new sn.x;if(e.indices=this._depthSort?this._indices:this._indices32,e.set(this._positions32,qe.o.PositionKind),e.set(this._normals32,qe.o.NormalKind),this._uvs32.length>0&&e.set(this._uvs32,qe.o.UVKind),this._colors32.length>0&&e.set(this._colors32,qe.o.ColorKind),e.applyToMesh(this.mesh,this._updatable),this.mesh.isPickable=this._pickable,this._pickable){let e=0;for(let t=0;t<this.nbParticles;t++){const i=this.particles[t],n=i._model._indicesLength;for(let t=0;t<n;t++)if(0==t%3){const t={idx:i.idx,faceId:e};this.pickedParticles[e]=t,e++}}}return this._multimaterialEnabled&&this.setMultiMaterial(this._materials),this._expandable||(this._depthSort||this._multimaterialEnabled||this._autoFixFaceOrientation||(this._indices=null),this._positions=null,this._normals=null,this._uvs=null,this._colors=null,this._updatable||(this.particles.length=0)),this._isNotBuilt=!1,this.recomputeNormals=!1,this._recomputeInvisibles=!0,this.mesh}digest(e,t){let i=t&&t.facetNb||1,n=t&&t.number||0,s=t&&t.delta||0;const r=e.getVerticesData(qe.o.PositionKind),a=e.getIndices(),l=e.getVerticesData(qe.o.UVKind),h=e.getVerticesData(qe.o.ColorKind),c=e.getVerticesData(qe.o.NormalKind),u=t&&t.storage?t.storage:null;let d=0;const p=a.length/3;n?(n=n>p?p:n,i=Math.round(p/n),s=0):i=i>p?p:i;const f=[],_=[],m=[],g=[],v=[],y=o.P.Zero(),x=i;for(;d<p;){i=x+Math.floor((1+s)*Math.random()),d>p-i&&(i=p-d),f.length=0,_.length=0,m.length=0,g.length=0,v.length=0;let t=0;for(let e=3*d;e<3*(d+i);e++){m.push(t);const i=a[e],n=3*i;if(f.push(r[n],r[n+1],r[n+2]),_.push(c[n],c[n+1],c[n+2]),l){const e=2*i;g.push(l[e],l[e+1])}if(h){const e=4*i;v.push(h[e],h[e+1],h[e+2],h[e+3])}t++}let n=this.nbParticles;const b=this._posToShape(f),T=this._uvsToShapeUV(g),S=m.slice(),E=v.slice(),C=_.slice();let A;for(y.copyFromFloats(0,0,0),A=0;A<b.length;A++)y.addInPlace(b[A]);y.scaleInPlace(1/b.length);const P=new o.P(1/0,1/0,1/0),R=new o.P(-1/0,-1/0,-1/0);for(A=0;A<b.length;A++)b[A].subtractInPlace(y),P.minimizeInPlaceFromFloats(b[A].x,b[A].y,b[A].z),R.maximizeInPlaceFromFloats(b[A].x,b[A].y,b[A].z);let M;this._particlesIntersect&&(M=new wn.j(P,R));let I=null;this._useModelMaterial&&(I=e.material?e.material:this._setDefaultMaterial());const D=new l_(this._shapeCounter,b,S,C,E,T,null,null,I),O=this._positions.length,w=this._indices.length;this._meshBuilder(this._index,w,b,this._positions,S,this._indices,g,this._uvs,E,this._colors,C,this._normals,n,0,null,D),this._addParticle(n,this._lastParticleId,O,w,D,this._shapeCounter,0,M,u),this.particles[this.nbParticles].position.addInPlace(y),u||(this._index+=b.length,n++,this.nbParticles++,this._lastParticleId++),this._shapeCounter++,d+=i}return this._isNotBuilt=!0,this}_unrotateFixedNormals(){let e=0,t=0;const i=o.jp.Vector3[0],n=o.jp.Quaternion[0],s=o.jp.Matrix[0];for(let r=0;r<this.particles.length;r++){const a=this.particles[r],l=a._model._shape;if(a.rotationQuaternion)a.rotationQuaternion.conjugateToRef(n);else{const e=a.rotation;o._f.RotationYawPitchRollToRef(e.y,e.x,e.z,n),n.conjugateInPlace()}n.toRotationMatrix(s);for(let n=0;n<l.length;n++)t=e+3*n,o.P.TransformNormalFromFloatsToRef(this._normals32[t],this._normals32[t+1],this._normals32[t+2],s,i),i.toArray(this._fixedNormal32,t);e=t+3}}_resetCopy(){const e=this._copy;e.position.setAll(0),e.rotation.setAll(0),e.rotationQuaternion=null,e.scaling.setAll(1),e.uvs.copyFromFloats(0,0,1,1),e.color=null,e.translateFromPivot=!1,e.shapeId=0,e.materialIndex=null}_meshBuilder(e,t,i,n,s,r,a,l,h,c,u,d,p,f,_,m){let g,v=0,y=0,x=0;this._resetCopy();const b=this._copy,T=!(!_||!_.storage);if(b.idx=p,b.idxInShape=f,b.shapeId=m.shapeId,this._useModelMaterial){const e=m._material.uniqueId,t=this._materialIndexesById;Object.prototype.hasOwnProperty.call(t,e)||(t[e]=this._materials.length,this._materials.push(m._material));const i=t[e];b.materialIndex=i}if(_&&_.positionFunction&&(_.positionFunction(b,p,f),this._mustUnrotateFixedNormals=!0),T)return b;const S=o.jp.Matrix[0],E=this._tmpVertex,C=E.position,A=E.color,P=E.uv,R=o.jp.Vector3[1],M=o.jp.Vector3[2],I=o.jp.Vector3[3];o.y3.IdentityToRef(S),b.getRotationMatrix(S),b.pivot.multiplyToRef(b.scaling,I),b.translateFromPivot?M.setAll(0):M.copyFrom(I);const D=_&&_.vertexFunction;for(g=0;g<i.length;g++){if(C.copyFrom(i[g]),b.color&&A.copyFrom(b.color),a&&P.copyFromFloats(a[v],a[v+1]),D&&_.vertexFunction(b,E,g),C.multiplyInPlace(b.scaling).subtractInPlace(I),o.P.TransformCoordinatesToRef(C,S,R),R.addInPlace(M).addInPlace(b.position),n.push(R.x,R.y,R.z),a){const e=b.uvs;l.push((e.z-e.x)*P.x+e.x,(e.w-e.y)*P.y+e.y),v+=2}if(b.color)this._color.copyFrom(A);else{const e=this._color;h&&void 0!==h[y]?(e.r=h[y],e.g=h[y+1],e.b=h[y+2],e.a=h[y+3]):(e.r=1,e.g=1,e.b=1,e.a=1)}c.push(this._color.r,this._color.g,this._color.b,this._color.a),y+=4,!this.recomputeNormals&&u&&(o.P.TransformNormalFromFloatsToRef(u[x],u[x+1],u[x+2],S,C),d.push(C.x,C.y,C.z),x+=3)}for(g=0;g<s.length;g++){const t=e+s[g];r.push(t),t>65535&&(this._needs32Bits=!0)}if(this._depthSort||this._multimaterialEnabled){const e=null!==b.materialIndex?b.materialIndex:0;this.depthSortedParticles.push(new h_(p,t,s.length,e))}return b}_posToShape(e){const t=[];for(let i=0;i<e.length;i+=3)t.push(o.P.FromArray(e,i));return t}_uvsToShapeUV(e){const t=[];if(e)for(let i=0;i<e.length;i++)t.push(e[i]);return t}_addParticle(e,t,i,n,s,r,o,a=null,l=null){const h=new a_(e,t,i,n,s,r,o,this,a);return(l||this.particles).push(h),h}addShape(e,t,i){const n=e.getVerticesData(qe.o.PositionKind),s=e.getIndices(),r=e.getVerticesData(qe.o.UVKind),o=e.getVerticesData(qe.o.ColorKind),a=e.getVerticesData(qe.o.NormalKind);this.recomputeNormals=!a;const l=Array.from(s),h=Array.from(a),c=o?Array.from(o):[],u=i&&i.storage?i.storage:null;let d=null;this._particlesIntersect&&(d=e.getBoundingInfo());const p=this._posToShape(n),f=this._uvsToShapeUV(r),_=i?i.positionFunction:null,m=i?i.vertexFunction:null;let g=null;this._useModelMaterial&&(g=e.material?e.material:this._setDefaultMaterial());const v=new l_(this._shapeCounter,p,l,h,c,f,_,m,g);for(let e=0;e<t;e++)this._insertNewParticle(this.nbParticles,e,v,p,s,r,o,a,d,u,i);return this._shapeCounter++,this._isNotBuilt=!0,this._shapeCounter-1}_rebuildParticle(e,t=!1){this._resetCopy();const i=this._copy;e._model._positionFunction&&e._model._positionFunction(i,e.idx,e.idxInShape);const n=o.jp.Matrix[0],s=o.jp.Vector3[0],r=o.jp.Vector3[1],a=o.jp.Vector3[2],l=o.jp.Vector3[3];i.getRotationMatrix(n),e.pivot.multiplyToRef(e.scaling,l),i.translateFromPivot?a.copyFromFloats(0,0,0):a.copyFrom(l);const h=e._model._shape;for(let t=0;t<h.length;t++)s.copyFrom(h[t]),e._model._vertexFunction&&e._model._vertexFunction(i,s,t),s.multiplyInPlace(i.scaling).subtractInPlace(l),o.P.TransformCoordinatesToRef(s,n,r),r.addInPlace(a).addInPlace(i.position).toArray(this._positions32,e._pos+3*t);t&&(e.position.setAll(0),e.rotation.setAll(0),e.rotationQuaternion=null,e.scaling.setAll(1),e.uvs.setAll(0),e.pivot.setAll(0),e.translateFromPivot=!1,e.parentId=null)}rebuildMesh(e=!1){for(let t=0;t<this.particles.length;t++)this._rebuildParticle(this.particles[t],e);return this.mesh.updateVerticesData(qe.o.PositionKind,this._positions32,!1,!1),this}removeParticles(e,t){const i=t-e+1;if(!this._expandable||i<=0||i>=this.nbParticles||!this._updatable)return[];const n=this.particles,s=this.nbParticles;if(t<s-1){const i=t+1,r=n[i]._pos-n[e]._pos,o=n[i]._ind-n[e]._ind;for(let e=i;e<s;e++){const t=n[e];t._pos-=r,t._ind-=o}}const r=n.splice(e,i);this._positions.length=0,this._indices.length=0,this._colors.length=0,this._uvs.length=0,this._normals.length=0,this._index=0,this._idxOfId.length=0,(this._depthSort||this._multimaterialEnabled)&&(this.depthSortedParticles=[]);let o=0;const a=n.length;for(let e=0;e<a;e++){const t=n[e],i=t._model,s=i._shape,r=i._indices,a=i._normals,l=i._shapeColors,h=i._shapeUV;t.idx=e,this._idxOfId[t.id]=e,this._meshBuilder(this._index,o,s,this._positions,r,this._indices,h,this._uvs,l,this._colors,a,this._normals,t.idx,t.idxInShape,null,i),this._index+=s.length,o+=r.length}return this.nbParticles-=i,this._isNotBuilt=!0,r}insertParticlesFromArray(e){if(!this._expandable)return this;let t=0,i=e[0].shapeId;const n=e.length;for(let s=0;s<n;s++){const n=e[s],r=n._model,o=r._shape,a=r._indices,l=r._shapeUV,h=r._shapeColors,c=r._normals,u=!c;this.recomputeNormals=u||this.recomputeNormals;const d=n.getBoundingInfo(),p=this._insertNewParticle(this.nbParticles,t,r,o,a,l,h,c,d,null,null);n.copyToRef(p),t++,i!=n.shapeId&&(i=n.shapeId,t=0)}return this._isNotBuilt=!0,this}_insertNewParticle(e,t,i,n,s,r,o,a,l,h,c){const u=this._positions.length,d=this._indices.length,p=this._meshBuilder(this._index,d,n,this._positions,s,this._indices,r,this._uvs,o,this._colors,a,this._normals,e,t,c,i);let f=null;return this._updatable&&(f=this._addParticle(this.nbParticles,this._lastParticleId,u,d,i,this._shapeCounter,t,l,h),f.position.copyFrom(p.position),f.rotation.copyFrom(p.rotation),p.rotationQuaternion&&(f.rotationQuaternion?f.rotationQuaternion.copyFrom(p.rotationQuaternion):f.rotationQuaternion=p.rotationQuaternion.clone()),p.color&&(f.color?f.color.copyFrom(p.color):f.color=p.color.clone()),f.scaling.copyFrom(p.scaling),f.uvs.copyFrom(p.uvs),null!==p.materialIndex&&(f.materialIndex=p.materialIndex),this.expandable&&(this._idxOfId[f.id]=f.idx)),h||(this._index+=n.length,this.nbParticles++,this._lastParticleId++),f}setParticles(e=0,t=this.nbParticles-1,i=!0){if(!this._updatable||this._isNotBuilt)return this;this.beforeUpdateParticles(e,t,i);const n=o.jp.Matrix[0],s=o.jp.Matrix[1],r=this.mesh,a=this._colors32,l=this._positions32,h=this._normals32,c=this._uvs32,u=this._indices32,d=this._indices,p=this._fixedNormal32,f=this._depthSort&&this._depthSortParticles,_=o.jp.Vector3,m=_[5].copyFromFloats(1,0,0),g=_[6].copyFromFloats(0,1,0),v=_[7].copyFromFloats(0,0,1),y=_[8].setAll(Number.MAX_VALUE),x=_[9].setAll(-Number.MAX_VALUE),b=_[10].setAll(0),T=this._tmpVertex,S=T.position,E=T.color,C=T.uv;if((this.billboard||this._depthSort)&&(this.mesh.computeWorldMatrix(!0),this.mesh._worldMatrix.invertToRef(s)),this.billboard){const e=_[0];this._camera.getDirectionToRef(We.RD.Z,e),o.P.TransformNormalToRef(e,s,v),v.normalize();const t=this._camera.getViewMatrix(!0);o.P.TransformNormalFromFloatsToRef(t.m[1],t.m[5],t.m[9],s,g),o.P.CrossToRef(g,v,m),g.normalize(),m.normalize()}this._depthSort&&o.P.TransformCoordinatesToRef(this._camera.globalPosition,s,b),o.y3.IdentityToRef(n);let A=0,P=0,R=0,M=0,I=0,D=0,O=0;if(this.mesh.isFacetDataEnabled&&(this._computeBoundingBox=!0),t=t>=this.nbParticles?this.nbParticles-1:t,this._computeBoundingBox&&(0!=e||t!=this.nbParticles-1)){const e=this.mesh.getBoundingInfo();e&&(y.copyFrom(e.minimum),x.copyFrom(e.maximum))}P=this.particles[e]._pos;const w=P/3|0;M=4*w,D=2*w;for(let i=e;i<=t;i++){const e=this.particles[i];this.updateParticle(e);const t=e._model._shape,s=e._model._shapeUV,u=e._rotationMatrix,d=e.position,w=e.rotation,N=e.scaling,F=e._globalPosition;if(f){const t=this.depthSortedParticles[i];t.idx=e.idx,t.ind=e._ind,t.indicesLength=e._model._indicesLength,t.sqDistance=o.P.DistanceSquared(e.position,b)}if(e.alive&&(!e._stillInvisible||e.isVisible||this._recomputeInvisibles)){if(e.isVisible){e._stillInvisible=!1;const i=_[12];if(e.pivot.multiplyToRef(N,i),this.billboard&&(w.x=0,w.y=0),(this._computeParticleRotation||this.billboard)&&e.getRotationMatrix(n),null!==e.parentId){const t=this.getParticleById(e.parentId);if(t){const e=t._rotationMatrix,i=t._globalPosition,s=d.x*e[1]+d.y*e[4]+d.z*e[7],r=d.x*e[0]+d.y*e[3]+d.z*e[6],o=d.x*e[2]+d.y*e[5]+d.z*e[8];if(F.x=i.x+r,F.y=i.y+s,F.z=i.z+o,this._computeParticleRotation||this.billboard){const t=n.m;u[0]=t[0]*e[0]+t[1]*e[3]+t[2]*e[6],u[1]=t[0]*e[1]+t[1]*e[4]+t[2]*e[7],u[2]=t[0]*e[2]+t[1]*e[5]+t[2]*e[8],u[3]=t[4]*e[0]+t[5]*e[3]+t[6]*e[6],u[4]=t[4]*e[1]+t[5]*e[4]+t[6]*e[7],u[5]=t[4]*e[2]+t[5]*e[5]+t[6]*e[8],u[6]=t[8]*e[0]+t[9]*e[3]+t[10]*e[6],u[7]=t[8]*e[1]+t[9]*e[4]+t[10]*e[7],u[8]=t[8]*e[2]+t[9]*e[5]+t[10]*e[8]}}else e.parentId=null}else if(F.x=d.x,F.y=d.y,F.z=d.z,this._computeParticleRotation||this.billboard){const e=n.m;u[0]=e[0],u[1]=e[1],u[2]=e[2],u[3]=e[4],u[4]=e[5],u[5]=e[6],u[6]=e[8],u[7]=e[9],u[8]=e[10]}const r=_[11];for(e.translateFromPivot?r.setAll(0):r.copyFrom(i),O=0;O<t.length;O++){A=P+3*O,R=M+4*O,I=D+2*O;const n=2*O,o=n+1;S.copyFrom(t[O]),this._computeParticleColor&&e.color&&E.copyFrom(e.color),this._computeParticleTexture&&C.copyFromFloats(s[n],s[o]),this._computeParticleVertex&&this.updateParticleVertex(e,T,O);const a=S.x*N.x-i.x,d=S.y*N.y-i.y,f=S.z*N.z-i.z;let _=a*u[0]+d*u[3]+f*u[6],b=a*u[1]+d*u[4]+f*u[7],w=a*u[2]+d*u[5]+f*u[8];_+=r.x,b+=r.y,w+=r.z;const L=l[A]=F.x+m.x*_+g.x*b+v.x*w,B=l[A+1]=F.y+m.y*_+g.y*b+v.y*w,U=l[A+2]=F.z+m.z*_+g.z*b+v.z*w;if(this._computeBoundingBox&&(y.minimizeInPlaceFromFloats(L,B,U),x.maximizeInPlaceFromFloats(L,B,U)),!this._computeParticleVertex){const e=p[A],t=p[A+1],i=p[A+2],n=e*u[0]+t*u[3]+i*u[6],s=e*u[1]+t*u[4]+i*u[7],r=e*u[2]+t*u[5]+i*u[8];h[A]=m.x*n+g.x*s+v.x*r,h[A+1]=m.y*n+g.y*s+v.y*r,h[A+2]=m.z*n+g.z*s+v.z*r}if(this._computeParticleColor&&e.color){const e=this._colors32;e[R]=E.r,e[R+1]=E.g,e[R+2]=E.b,e[R+3]=E.a}if(this._computeParticleTexture){const t=e.uvs;c[I]=C.x*(t.z-t.x)+t.x,c[I+1]=C.y*(t.w-t.y)+t.y}}}else for(e._stillInvisible=!0,O=0;O<t.length;O++){if(A=P+3*O,R=M+4*O,I=D+2*O,l[A]=l[A+1]=l[A+2]=0,h[A]=h[A+1]=h[A+2]=0,this._computeParticleColor&&e.color){const t=e.color;a[R]=t.r,a[R+1]=t.g,a[R+2]=t.b,a[R+3]=t.a}if(this._computeParticleTexture){const t=e.uvs;c[I]=s[2*O]*(t.z-t.x)+t.x,c[I+1]=s[2*O+1]*(t.w-t.y)+t.y}}if(this._particlesIntersect){const t=e.getBoundingInfo(),i=t.boundingBox,n=t.boundingSphere,s=e._modelBoundingInfo;if(!this._bSphereOnly){const e=s.boundingBox.vectors,t=_[1],n=_[2];t.setAll(Number.MAX_VALUE),n.setAll(-Number.MAX_VALUE);for(let i=0;i<8;i++){const s=e[i].x*N.x,r=e[i].y*N.y,o=e[i].z*N.z,a=s*u[0]+r*u[3]+o*u[6],l=s*u[1]+r*u[4]+o*u[7],h=s*u[2]+r*u[5]+o*u[8],c=d.x+m.x*a+g.x*l+v.x*h,p=d.y+m.y*a+g.y*l+v.y*h,f=d.z+m.z*a+g.z*l+v.z*h;t.minimizeInPlaceFromFloats(c,p,f),n.maximizeInPlaceFromFloats(c,p,f)}i.reConstruct(t,n,r._worldMatrix)}const o=s.minimum.multiplyToRef(N,_[1]),a=s.maximum.multiplyToRef(N,_[2]),l=a.addToRef(o,_[3]).scaleInPlace(.5).addInPlace(F),h=a.subtractToRef(o,_[4]).scaleInPlace(.5*this._bSphereRadiusFactor),c=l.subtractToRef(h,_[1]),p=l.addToRef(h,_[2]);n.reConstruct(c,p,r._worldMatrix)}P=A+3,M=R+4,D=I+2}else O=t.length,P+=3*O,M+=4*O,D+=2*O}if(i){if(this._computeParticleColor){const e=r.getVertexBuffer(qe.o.ColorKind);e&&!r.isPickable?e.updateDirectly(a,0):r.updateVerticesData(qe.o.ColorKind,a,!1,!1)}if(this._computeParticleTexture){const e=r.getVertexBuffer(qe.o.UVKind);e&&!r.isPickable?e.updateDirectly(c,0):r.updateVerticesData(qe.o.UVKind,c,!1,!1)}const e=r.getVertexBuffer(qe.o.PositionKind);if(e&&!r.isPickable?e.updateDirectly(l,0):r.updateVerticesData(qe.o.PositionKind,l,!1,!1),!r.areNormalsFrozen||r.isFacetDataEnabled){if(this._computeParticleVertex||r.isFacetDataEnabled){const e=r.isFacetDataEnabled?r.getFacetDataParameters():null;sn.x.ComputeNormals(l,u,h,e);for(let e=0;e<h.length;e++)p[e]=h[e]}if(!r.areNormalsFrozen){const e=r.getVertexBuffer(qe.o.NormalKind);e&&!r.isPickable?e.updateDirectly(h,0):r.updateVerticesData(qe.o.NormalKind,h,!1,!1)}}if(f){const e=this.depthSortedParticles;e.sort(this._depthSortFunction);const t=e.length;let i=0,n=0;for(let s=0;s<t;s++){const t=e[s],r=t.indicesLength,o=t.ind;for(let e=0;e<r;e++)if(u[i]=d[o+e],i++,this._pickable&&0==e%3){const e=this.pickedParticles[n];e.idx=t.idx,e.faceId=n,n++}}}if(this._autoFixFaceOrientation){let e=0;for(let t=0;t<this.particles.length;t++){const i=f?this.particles[this.depthSortedParticles[t].idx]:this.particles[t];if(i.scale.x*i.scale.y*i.scale.z<0)for(let t=0;t<i._model._indicesLength;t+=3){const n=d[i._ind+t];u[e+t]=d[i._ind+t+1],u[e+t+1]=n}e+=i._model._indicesLength}}(f||this._autoFixFaceOrientation)&&r.updateIndices(u)}return this._computeBoundingBox&&(r.hasBoundingInfo?r.getBoundingInfo().reConstruct(y,x,r._worldMatrix):r.buildBoundingInfo(y,x,r._worldMatrix)),this._autoUpdateSubMeshes&&this.computeSubMeshes(),this._recomputeInvisibles=!1,this.afterUpdateParticles(e,t,i),this}dispose(){this.mesh.dispose(),this.vars=null,this._positions=null,this._indices=null,this._normals=null,this._uvs=null,this._colors=null,this._indices32=null,this._positions32=null,this._normals32=null,this._fixedNormal32=null,this._uvs32=null,this._colors32=null,this.pickedParticles=null,this.pickedBySubMesh=null,this._materials=null,this._materialIndexes=null,this._indicesByMaterial=null,this._idxOfId=null}pickedParticle(e){if(e.hit){const t=e.subMeshId,i=e.faceId-this.mesh.subMeshes[t].indexStart/3,n=this.pickedBySubMesh;if(n[t]&&n[t][i])return n[t][i]}return null}getParticleById(e){const t=this.particles[e];if(t&&t.id==e)return t;const i=this.particles,n=this._idxOfId[e];if(void 0!==n)return i[n];let s=0;const r=this.nbParticles;for(;s<r;){const t=i[s];if(t.id==e)return t;s++}return null}getParticlesByShapeId(e){const t=[];return this.getParticlesByShapeIdToRef(e,t),t}getParticlesByShapeIdToRef(e,t){t.length=0;for(let i=0;i<this.nbParticles;i++){const n=this.particles[i];n.shapeId==e&&t.push(n)}return this}computeSubMeshes(){if(!this.mesh||!this._multimaterialEnabled)return this;const e=this.depthSortedParticles;if(this.particles.length>0)for(let t=0;t<this.particles.length;t++){const i=this.particles[t];i.materialIndex||(i.materialIndex=0);const n=e[t];n.materialIndex=i.materialIndex,n.ind=i._ind,n.indicesLength=i._model._indicesLength,n.idx=i.idx}this._sortParticlesByMaterial();const t=this._indicesByMaterial,i=this._materialIndexes,n=this.mesh;n.subMeshes=[];const s=n.getTotalVertices();for(let e=0;e<i.length;e++){const r=t[e],o=t[e+1]-r,a=i[e];new Ll.P(a,0,s,r,o,n)}return this}_sortParticlesByMaterial(){const e=[0];this._indicesByMaterial=e;const t=[];this._materialIndexes=t;const i=this.depthSortedParticles;i.sort(this._materialSortFunction);const n=i.length,s=this._indices32,r=this._indices;let o=0,a=0,l=0,h=i[0].materialIndex;t.push(h),this._pickable&&(this.pickedBySubMesh=[[]],this.pickedParticles=this.pickedBySubMesh[0]);for(let c=0;c<n;c++){const n=i[c],u=n.indicesLength,d=n.ind;n.materialIndex!==h&&(h=n.materialIndex,e.push(l),t.push(h),this._pickable&&(o++,this.pickedBySubMesh[o]=[],a=0));let p=0;for(let e=0;e<u;e++){if(s[l]=r[d+e],this._pickable&&0==e%3){const e=this.pickedBySubMesh[o][a];e?(e.idx=n.idx,e.faceId=p):this.pickedBySubMesh[o][a]={idx:n.idx,faceId:p},a++,p++}l++}}return e.push(s.length),this._updatable&&this.mesh.updateIndices(s),this}_setMaterialIndexesById(){this._materialIndexesById={};for(let e=0;e<this._materials.length;e++){const t=this._materials[e].uniqueId;this._materialIndexesById[t]=e}}_filterUniqueMaterialId(e){return e.filter((function(e,t,i){return i.indexOf(e)===t}))}_setDefaultMaterial(){return this._defaultMaterial||(this._defaultMaterial=new Gi.K(this.name+"DefaultMaterial",this._scene)),this._defaultMaterial}refreshVisibleSize(){return this._isVisibilityBoxLocked||this.mesh.refreshBoundingInfo(),this}setVisibilityBox(e){const t=e/2;this.mesh.buildBoundingInfo(new o.P(-t,-t,-t),new o.P(t,t,t))}get isAlwaysVisible(){return this._alwaysVisible}set isAlwaysVisible(e){this._alwaysVisible=e,this.mesh.alwaysSelectAsActiveMesh=e}set isVisibilityBoxLocked(e){this._isVisibilityBoxLocked=e,this.mesh.getBoundingInfo().isLocked=e}get isVisibilityBoxLocked(){return this._isVisibilityBoxLocked}set computeParticleRotation(e){this._computeParticleRotation=e}set computeParticleColor(e){this._computeParticleColor=e}set computeParticleTexture(e){this._computeParticleTexture=e}set computeParticleVertex(e){this._computeParticleVertex=e}set computeBoundingBox(e){this._computeBoundingBox=e}set depthSortParticles(e){this._depthSortParticles=e}get computeParticleRotation(){return this._computeParticleRotation}get computeParticleColor(){return this._computeParticleColor}get computeParticleTexture(){return this._computeParticleTexture}get computeParticleVertex(){return this._computeParticleVertex}get computeBoundingBox(){return this._computeBoundingBox}get depthSortParticles(){return this._depthSortParticles}get expandable(){return this._expandable}get multimaterialEnabled(){return this._multimaterialEnabled}get useModelMaterial(){return this._useModelMaterial}get materials(){return this._materials}setMultiMaterial(e){this._materials=this._filterUniqueMaterialId(e),this._setMaterialIndexesById(),this._multimaterial&&this._multimaterial.dispose(),this._multimaterial=new Ph.G(this.name+"MultiMaterial",this._scene);for(let e=0;e<this._materials.length;e++)this._multimaterial.subMaterials.push(this._materials[e]);this.computeSubMeshes(),this.mesh.material=this._multimaterial}get multimaterial(){return this._multimaterial}set multimaterial(e){this._multimaterial=e}get autoUpdateSubMeshes(){return this._autoUpdateSubMeshes}set autoUpdateSubMeshes(e){this._autoUpdateSubMeshes=e}initParticles(){}recycleParticle(e){return e}updateParticle(e){return e}updateParticleVertex(e,t,i){return this}beforeUpdateParticles(e,t,i){}afterUpdateParticles(e,t,i){}}class d_{constructor(e,t,i,n,s){this.idx=0,this.color=new Gr.HE(1,1,1,1),this.position=Gr.P.Zero(),this.rotation=Gr.P.Zero(),this.uv=new Gr.FM(0,0),this.velocity=Gr.P.Zero(),this.pivot=Gr.P.Zero(),this.translateFromPivot=!1,this._pos=0,this._ind=0,this.groupId=0,this.idxInGroup=0,this._stillInvisible=!1,this._rotationMatrix=[1,0,0,0,1,0,0,0,1],this.parentId=null,this._globalPosition=Gr.P.Zero(),this.idx=e,this._group=t,this.groupId=i,this.idxInGroup=n,this._pcs=s}get size(){return this.size}set size(e){this.size=e}get quaternion(){return this.rotationQuaternion}set quaternion(e){this.rotationQuaternion=e}intersectsMesh(e,t){if(!e.hasBoundingInfo)return!1;if(!this._pcs.mesh)throw new Error("Point Cloud System doesnt contain the Mesh");if(t)return e.getBoundingInfo().boundingSphere.intersectsPoint(this.position.add(this._pcs.mesh.position));const i=e.getBoundingInfo().boundingBox,n=i.maximumWorld.x,s=i.minimumWorld.x,r=i.maximumWorld.y,o=i.minimumWorld.y,a=i.maximumWorld.z,l=i.minimumWorld.z,h=this.position.x+this._pcs.mesh.position.x,c=this.position.y+this._pcs.mesh.position.y,u=this.position.z+this._pcs.mesh.position.z;return s<=h&&h<=n&&o<=c&&c<=r&&l<=u&&u<=a}getRotationMatrix(e){let t;if(this.rotationQuaternion)t=this.rotationQuaternion;else{t=Gr.jp.Quaternion[0];const e=this.rotation;Gr._f.RotationYawPitchRollToRef(e.y,e.x,e.z,t)}t.toRotationMatrix(e)}}class p_{get groupID(){return this.groupId}set groupID(e){this.groupId=e}constructor(e,t){this.groupId=e,this._positionFunction=t}}var f_,__,m_,g_,v_,y_,x_,b_,T_,S_;!function(e){e[e.Color=2]="Color",e[e.UV=1]="UV",e[e.Random=0]="Random",e[e.Stated=3]="Stated"}(f_||(f_={}));class E_{get positions(){return this._positions32}get colors(){return this._colors32}get uvs(){return this._uvs32}constructor(e,t,i,n){this.particles=new Array,this.nbParticles=0,this.counter=0,this.vars={},this._promises=[],this._positions=new Array,this._indices=new Array,this._normals=new Array,this._colors=new Array,this._uvs=new Array,this._updatable=!0,this._isVisibilityBoxLocked=!1,this._alwaysVisible=!1,this._groups=new Array,this._groupCounter=0,this._computeParticleColor=!0,this._computeParticleTexture=!0,this._computeParticleRotation=!0,this._computeBoundingBox=!1,this._isReady=!1,this.name=e,this._size=t,this._scene=i||A.l.LastCreatedScene,n&&void 0!==n.updatable?this._updatable=n.updatable:this._updatable=!0}buildMeshAsync(e){return Promise.all(this._promises).then((()=>(this._isReady=!0,this._buildMesh(e))))}_buildMesh(e){0===this.nbParticles&&this.addPoints(1),this._positions32=new Float32Array(this._positions),this._uvs32=new Float32Array(this._uvs),this._colors32=new Float32Array(this._colors);const t=new sn.x;t.set(this._positions32,qe.o.PositionKind),this._uvs32.length>0&&t.set(this._uvs32,qe.o.UVKind);let i=0;this._colors32.length>0&&(i=1,t.set(this._colors32,qe.o.ColorKind));const n=new Nt.Kj(this.name,this._scene);t.applyToMesh(n,this._updatable),this.mesh=n,this._positions=null,this._uvs=null,this._colors=null,this._updatable||(this.particles.length=0);let s=e;return s||(s=new Gi.K("point cloud material",this._scene),s.emissiveColor=new Gr.Wo(i,i,i),s.disableLighting=!0,s.pointsCloud=!0,s.pointSize=this._size),n.material=s,new Promise((e=>e(n)))}_addParticle(e,t,i,n){const s=new d_(e,t,i,n,this);return this.particles.push(s),s}_randomUnitVector(e){e.position=new o.P(Math.random(),Math.random(),Math.random()),e.color=new Gr.HE(1,1,1,1)}_getColorIndicesForCoord(e,t,i,n){const s=e._groupImageData,r=i*(4*n)+4*t,o=[r,r+1,r+2,r+3],a=o[1],l=o[2],h=o[3],c=s[o[0]],u=s[a],d=s[l],p=s[h];return new Gr.HE(c/255,u/255,d/255,p)}_setPointsColorOrUV(e,t,i,n,s,r,a){i&&e.updateFacetData();const l=2*e.getBoundingInfo().boundingSphere.radius;let h=e.getVerticesData(qe.o.PositionKind);const c=e.getIndices(),u=e.getVerticesData(qe.o.UVKind),d=e.getVerticesData(qe.o.ColorKind),p=o.P.Zero();e.computeWorldMatrix();const f=e.getWorldMatrix();if(!f.isIdentity()){h=h.slice(0);for(let e=0;e<h.length/3;e++)o.P.TransformCoordinatesFromFloatsToRef(h[3*e],h[3*e+1],h[3*e+2],f,p),h[3*e]=p.x,h[3*e+1]=p.y,h[3*e+2]=p.z}let _=0,m=0,g=0,v=0,y=0,x=0,b=0,T=0,S=0,E=0,C=0,A=0,P=0;const R=o.P.Zero(),M=o.P.Zero(),I=o.P.Zero(),D=o.P.Zero(),O=o.P.Zero();let w=0,N=0,F=0,L=0,B=0,U=0;const V=o.FM.Zero(),k=o.FM.Zero(),G=o.FM.Zero(),z=o.FM.Zero(),W=o.FM.Zero();let H=0,X=0,j=0,Y=0,q=0,K=0,$=0,Q=0,Z=0,J=0,ee=0,te=0;const ie=o.Lt.Zero(),ne=o.Lt.Zero(),se=o.Lt.Zero(),re=o.Lt.Zero(),oe=o.Lt.Zero();let ae,le,he=0,ce=0;a=a||0;let ue=new o.Lt(0,0,0,0),de=o.P.Zero(),pe=o.P.Zero(),fe=o.P.Zero(),_e=0,me=o.P.Zero(),ge=0,ve=0;const ye=new Yt.z(o.P.Zero(),new o.P(1,0,0));let xe,be=o.P.Zero();for(let p=0;p<c.length/3;p++){let f,Te,Se,Ee,Ce,Ae,Pe,Re;m=c[3*p],g=c[3*p+1],v=c[3*p+2],y=h[3*m],x=h[3*m+1],b=h[3*m+2],T=h[3*g],S=h[3*g+1],E=h[3*g+2],C=h[3*v],A=h[3*v+1],P=h[3*v+2],R.set(y,x,b),M.set(T,S,E),I.set(C,A,P),M.subtractToRef(R,D),I.subtractToRef(M,O),u&&(w=u[2*m],N=u[2*m+1],F=u[2*g],L=u[2*g+1],B=u[2*v],U=u[2*v+1],V.set(w,N),k.set(F,L),G.set(B,U),k.subtractToRef(V,z),G.subtractToRef(k,W)),d&&n&&(H=d[4*m],X=d[4*m+1],j=d[4*m+2],Y=d[4*m+3],q=d[4*g],K=d[4*g+1],$=d[4*g+2],Q=d[4*g+3],Z=d[4*v],J=d[4*v+1],ee=d[4*v+2],te=d[4*v+3],ie.set(H,X,j,Y),ne.set(q,K,$,Q),se.set(Z,J,ee,te),ne.subtractToRef(ie,re),se.subtractToRef(ne,oe));const Me=new Gr.Wo(0,0,0),Ie=new Gr.Wo(0,0,0);let De,Oe;for(let h=0;h<t._groupDensity[p];h++)_=this.particles.length,this._addParticle(_,t,this._groupCounter,p+h),Oe=this.particles[_],he=lt.R.RandomRange(0,1),ce=lt.R.RandomRange(0,1),ae=R.add(D.scale(he)).add(O.scale(he*ce)),i&&(de=e.getFacetNormal(p).normalize().scale(-1),pe=D.clone().normalize(),fe=o.P.Cross(de,pe),_e=lt.R.RandomRange(0,2*Math.PI),me=pe.scale(Math.cos(_e)).add(fe.scale(Math.sin(_e))),_e=lt.R.RandomRange(.1,Math.PI/2),be=me.scale(Math.cos(_e)).add(de.scale(Math.sin(_e))),ye.origin=ae.add(be.scale(1e-5)),ye.direction=be,ye.length=l,xe=ye.intersectsMesh(e),xe.hit&&(ve=xe.pickedPoint.subtract(ae).length(),ge=lt.R.RandomRange(0,1)*ve,ae.addInPlace(be.scale(ge)))),Oe.position=ae.clone(),this._positions.push(Oe.position.x,Oe.position.y,Oe.position.z),void 0!==n?u&&(le=V.add(z.scale(he)).add(W.scale(he*ce)),n?s&&null!==t._groupImageData?(f=t._groupImgWidth,Te=t._groupImgHeight,De=this._getColorIndicesForCoord(t,Math.round(le.x*f),Math.round(le.y*Te),f),Oe.color=De,this._colors.push(De.r,De.g,De.b,De.a)):d?(ue=ie.add(re.scale(he)).add(oe.scale(he*ce)),Oe.color=new Gr.HE(ue.x,ue.y,ue.z,ue.w),this._colors.push(ue.x,ue.y,ue.z,ue.w)):(ue=ie.set(Math.random(),Math.random(),Math.random(),1),Oe.color=new Gr.HE(ue.x,ue.y,ue.z,ue.w),this._colors.push(ue.x,ue.y,ue.z,ue.w)):(Oe.uv=le.clone(),this._uvs.push(Oe.uv.x,Oe.uv.y))):(r?(Me.set(r.r,r.g,r.b),Se=lt.R.RandomRange(-a,a),Ee=lt.R.RandomRange(-a,a),Re=Me.toHSV(),Ce=Re.r,Ae=Re.g+Se,Pe=Re.b+Ee,Ae<0&&(Ae=0),Ae>1&&(Ae=1),Pe<0&&(Pe=0),Pe>1&&(Pe=1),Gr.Wo.HSVtoRGBToRef(Ce,Ae,Pe,Ie),ue.set(Ie.r,Ie.g,Ie.b,1)):ue=ie.set(Math.random(),Math.random(),Math.random(),1),Oe.color=new Gr.HE(ue.x,ue.y,ue.z,ue.w),this._colors.push(ue.x,ue.y,ue.z,ue.w))}}_colorFromTexture(e,t,i){if(null===e.material)return _.Y.Warn(e.name+"has no material."),t._groupImageData=null,void this._setPointsColorOrUV(e,t,i,!0,!1);const n=e.material.getActiveTextures();if(0===n.length)return _.Y.Warn(e.name+"has no usable texture."),t._groupImageData=null,void this._setPointsColorOrUV(e,t,i,!0,!1);const s=e.clone();s.setEnabled(!1),this._promises.push(new Promise((e=>{Oa.V.WhenAllReady(n,(()=>{let r=t._textureNb;r<0&&(r=0),r>n.length-1&&(r=n.length-1);const o=()=>{t._groupImgWidth=n[r].getSize().width,t._groupImgHeight=n[r].getSize().height,this._setPointsColorOrUV(s,t,i,!0,!0),s.dispose(),e()};t._groupImageData=null;const a=n[r].readPixels();a?a.then((e=>{t._groupImageData=e,o()})):o()}))})))}_calculateDensity(e,t,i){let n,s,r,a,l,h,c,u,d,p,f,_,m=new Array;const g=o.P.Zero(),v=o.P.Zero(),y=o.P.Zero(),x=o.P.Zero(),b=o.P.Zero(),T=o.P.Zero();let S,E,C,A,P;const R=new Array;let M=0;const I=i.length/3;for(let e=0;e<I;e++)n=i[3*e],s=i[3*e+1],r=i[3*e+2],a=t[3*n],l=t[3*n+1],h=t[3*n+2],c=t[3*s],u=t[3*s+1],d=t[3*s+2],p=t[3*r],f=t[3*r+1],_=t[3*r+2],g.set(a,l,h),v.set(c,u,d),y.set(p,f,_),v.subtractToRef(g,x),y.subtractToRef(v,b),y.subtractToRef(g,T),S=x.length(),E=b.length(),C=T.length(),A=(S+E+C)/2,P=Math.sqrt(A*(A-S)*(A-E)*(A-C)),M+=P,R[e]=P;let D=0;for(let t=0;t<I;t++)m[t]=Math.floor(e*R[t]/M),D+=m[t];const O=e-D,w=Math.floor(O/I),N=O%I;w>0&&(m=m.map((e=>e+w)));for(let e=0;e<N;e++)m[e]+=1;return m}addPoints(e,t=this._randomUnitVector){const i=new p_(this._groupCounter,t);let n,s=this.nbParticles;for(let t=0;t<e;t++)n=this._addParticle(s,i,this._groupCounter,t),i&&i._positionFunction&&i._positionFunction(n,s,t),this._positions.push(n.position.x,n.position.y,n.position.z),n.color&&this._colors.push(n.color.r,n.color.g,n.color.b,n.color.a),n.uv&&this._uvs.push(n.uv.x,n.uv.y),s++;return this.nbParticles+=e,this._groupCounter++,this._groupCounter}addSurfacePoints(e,t,i,n,s){let r=i||f_.Random;(isNaN(r)||r<0||r>3)&&(r=f_.Random);const o=e.getVerticesData(qe.o.PositionKind),a=e.getIndices();this._groups.push(this._groupCounter);const l=new p_(this._groupCounter,null);switch(l._groupDensity=this._calculateDensity(t,o,a),r===f_.Color?l._textureNb=n||0:n=n||new Gr.HE(1,1,1,1),r){case f_.Color:this._colorFromTexture(e,l,!1);break;case f_.UV:this._setPointsColorOrUV(e,l,!1,!1,!1);break;case f_.Random:this._setPointsColorOrUV(e,l,!1);break;case f_.Stated:this._setPointsColorOrUV(e,l,!1,void 0,void 0,n,s)}return this.nbParticles+=t,this._groupCounter++,this._groupCounter-1}addVolumePoints(e,t,i,n,s){let r=i||f_.Random;(isNaN(r)||r<0||r>3)&&(r=f_.Random);const o=e.getVerticesData(qe.o.PositionKind),a=e.getIndices();this._groups.push(this._groupCounter);const l=new p_(this._groupCounter,null);switch(l._groupDensity=this._calculateDensity(t,o,a),r===f_.Color?l._textureNb=n||0:n=n||new Gr.HE(1,1,1,1),r){case f_.Color:this._colorFromTexture(e,l,!0);break;case f_.UV:this._setPointsColorOrUV(e,l,!0,!1,!1);break;case f_.Random:this._setPointsColorOrUV(e,l,!0);break;case f_.Stated:this._setPointsColorOrUV(e,l,!0,void 0,void 0,n,s)}return this.nbParticles+=t,this._groupCounter++,this._groupCounter-1}setParticles(e=0,t=this.nbParticles-1,i=!0){var n,s;if(!this._updatable||!this._isReady)return this;this.beforeUpdateParticles(e,t,i);const r=o.jp.Matrix[0],a=this.mesh,l=this._colors32,h=this._positions32,c=this._uvs32,u=o.jp.Vector3,d=u[5].copyFromFloats(1,0,0),p=u[6].copyFromFloats(0,1,0),f=u[7].copyFromFloats(0,0,1),_=u[8].setAll(Number.MAX_VALUE),m=u[9].setAll(-Number.MAX_VALUE);o.y3.IdentityToRef(r);let g=0;if((null===(n=this.mesh)||void 0===n?void 0:n.isFacetDataEnabled)&&(this._computeBoundingBox=!0),t=t>=this.nbParticles?this.nbParticles-1:t,this._computeBoundingBox&&(0!=e||t!=this.nbParticles-1)){const e=null===(s=this.mesh)||void 0===s?void 0:s.getBoundingInfo();e&&(_.copyFrom(e.minimum),m.copyFrom(e.maximum))}g=0;let v=0,y=0,x=0;for(let i=e;i<=t;i++){const e=this.particles[i];g=e.idx,v=3*g,y=4*g,x=2*g,this.updateParticle(e);const t=e._rotationMatrix,n=e.position,s=e._globalPosition;if(this._computeParticleRotation&&e.getRotationMatrix(r),null!==e.parentId){const i=this.particles[e.parentId],o=i._rotationMatrix,a=i._globalPosition,l=n.x*o[1]+n.y*o[4]+n.z*o[7],h=n.x*o[0]+n.y*o[3]+n.z*o[6],c=n.x*o[2]+n.y*o[5]+n.z*o[8];if(s.x=a.x+h,s.y=a.y+l,s.z=a.z+c,this._computeParticleRotation){const e=r.m;t[0]=e[0]*o[0]+e[1]*o[3]+e[2]*o[6],t[1]=e[0]*o[1]+e[1]*o[4]+e[2]*o[7],t[2]=e[0]*o[2]+e[1]*o[5]+e[2]*o[8],t[3]=e[4]*o[0]+e[5]*o[3]+e[6]*o[6],t[4]=e[4]*o[1]+e[5]*o[4]+e[6]*o[7],t[5]=e[4]*o[2]+e[5]*o[5]+e[6]*o[8],t[6]=e[8]*o[0]+e[9]*o[3]+e[10]*o[6],t[7]=e[8]*o[1]+e[9]*o[4]+e[10]*o[7],t[8]=e[8]*o[2]+e[9]*o[5]+e[10]*o[8]}}else if(s.x=0,s.y=0,s.z=0,this._computeParticleRotation){const e=r.m;t[0]=e[0],t[1]=e[1],t[2]=e[2],t[3]=e[4],t[4]=e[5],t[5]=e[6],t[6]=e[8],t[7]=e[9],t[8]=e[10]}const o=u[11];e.translateFromPivot?o.setAll(0):o.copyFrom(e.pivot);const a=u[0];a.copyFrom(e.position);const l=a.x-e.pivot.x,c=a.y-e.pivot.y,b=a.z-e.pivot.z;let T=l*t[0]+c*t[3]+b*t[6],S=l*t[1]+c*t[4]+b*t[7],E=l*t[2]+c*t[5]+b*t[8];T+=o.x,S+=o.y,E+=o.z;const C=h[v]=s.x+d.x*T+p.x*S+f.x*E,A=h[v+1]=s.y+d.y*T+p.y*S+f.y*E,P=h[v+2]=s.z+d.z*T+p.z*S+f.z*E;if(this._computeBoundingBox&&(_.minimizeInPlaceFromFloats(C,A,P),m.maximizeInPlaceFromFloats(C,A,P)),this._computeParticleColor&&e.color){const t=e.color,i=this._colors32;i[y]=t.r,i[y+1]=t.g,i[y+2]=t.b,i[y+3]=t.a}if(this._computeParticleTexture&&e.uv){const t=e.uv,i=this._uvs32;i[x]=t.x,i[x+1]=t.y}}return a&&(i&&(this._computeParticleColor&&a.updateVerticesData(qe.o.ColorKind,l,!1,!1),this._computeParticleTexture&&a.updateVerticesData(qe.o.UVKind,c,!1,!1),a.updateVerticesData(qe.o.PositionKind,h,!1,!1)),this._computeBoundingBox&&(a.hasBoundingInfo?a.getBoundingInfo().reConstruct(_,m,a._worldMatrix):a.buildBoundingInfo(_,m,a._worldMatrix))),this.afterUpdateParticles(e,t,i),this}dispose(){var e;null===(e=this.mesh)||void 0===e||e.dispose(),this.vars=null,this._positions=null,this._indices=null,this._normals=null,this._uvs=null,this._colors=null,this._indices32=null,this._positions32=null,this._uvs32=null,this._colors32=null}refreshVisibleSize(){var e;return this._isVisibilityBoxLocked||null===(e=this.mesh)||void 0===e||e.refreshBoundingInfo(),this}setVisibilityBox(e){if(!this.mesh)return;const t=e/2;this.mesh.buildBoundingInfo(new o.P(-t,-t,-t),new o.P(t,t,t))}get isAlwaysVisible(){return this._alwaysVisible}set isAlwaysVisible(e){this.mesh&&(this._alwaysVisible=e,this.mesh.alwaysSelectAsActiveMesh=e)}set computeParticleRotation(e){this._computeParticleRotation=e}set computeParticleColor(e){this._computeParticleColor=e}set computeParticleTexture(e){this._computeParticleTexture=e}get computeParticleColor(){return this._computeParticleColor}get computeParticleTexture(){return this._computeParticleTexture}set computeBoundingBox(e){this._computeBoundingBox=e}get computeBoundingBox(){return this._computeBoundingBox}initParticles(){}recycleParticle(e){return e}updateParticle(e){return e}beforeUpdateParticles(e,t,i){}afterUpdateParticles(e,t,i){}}Object.defineProperty(Un.x.prototype,"physicsImpostor",{get:function(){return this._physicsImpostor},set:function(e){this._physicsImpostor!==e&&(this._disposePhysicsObserver&&this.onDisposeObservable.remove(this._disposePhysicsObserver),this._physicsImpostor=e,e&&(this._disposePhysicsObserver=this.onDisposeObservable.add((()=>{this.physicsImpostor&&(this.physicsImpostor.dispose(),this.physicsImpostor=null)}))))},enumerable:!0,configurable:!0}),Un.x.prototype.getPhysicsImpostor=function(){return this.physicsImpostor},Un.x.prototype.applyImpulse=function(e,t){return this.physicsImpostor?(this.physicsImpostor.applyImpulse(e,t),this):this},Un.x.prototype.setPhysicsLinkWith=function(e,t,i,n){return this.physicsImpostor&&e.physicsImpostor?(this.physicsImpostor.createJoint(e.physicsImpostor,Nh.q7.HingeJoint,{mainPivot:t,connectedPivot:i,nativeParams:n}),this):this};class C_{getPluginVersion(){return this._physicsPlugin.getPluginVersion()}static DefaultPluginFactory(){throw(0,Zl.S)("")}constructor(e,t=C_.DefaultPluginFactory()){this._physicsPlugin=t,this._physicsBodies=[],this._subTimeStep=0,e=e||new o.P(0,-9.807,0),this.setGravity(e),this.setTimeStep()}setGravity(e){this.gravity=e,this._physicsPlugin.setGravity(this.gravity)}setTimeStep(e=1/60){this._physicsPlugin.setTimeStep(e)}getTimeStep(){return this._physicsPlugin.getTimeStep()}setSubTimeStep(e=0){this._subTimeStep=e}getSubTimeStep(){return this._subTimeStep}dispose(){this._physicsPlugin.dispose()}getPhysicsPluginName(){return this._physicsPlugin.name}_step(e){e>.1?e=.1:e<=0&&(e=1/60),this._physicsPlugin.executeStep(e,this._physicsBodies)}addBody(e){this._physicsBodies.push(e)}removeBody(e){const t=this._physicsBodies.indexOf(e);t>-1&&this._physicsBodies.splice(t,1)}getBodies(){return this._physicsBodies}getPhysicsPlugin(){return this._physicsPlugin}raycastToRef(e,t,i){this._physicsPlugin.raycast(e,t,i)}raycast(e,t){const i=new Fh.d;return this._physicsPlugin.raycast(e,t,i),i}}class A_{constructor(e,t,i,n){if(this._pluginData=void 0,this._pluginDataInstances=[],this._collisionCBEnabled=!1,this.disablePreStep=!0,!n)return;const s=n.getPhysicsEngine();if(!s)throw new Error("No Physics Engine available.");if(this._physicsEngine=s,2!=s.getPluginVersion())throw new Error("Plugin version is incorrect. Expected version 2.");const r=s.getPhysicsPlugin();if(!r)throw new Error("No Physics Plugin available.");this._physicsPlugin=r,e.rotationQuaternion||(e.rotationQuaternion=o._f.FromEulerAngles(e.rotation.x,e.rotation.y,e.rotation.z)),this.startAsleep=i;const a=e;a.hasThinInstances?this._physicsPlugin.initBodyInstances(this,t,a):this._physicsPlugin.initBody(this,t,e.absolutePosition,e.absoluteRotationQuaternion),this.transformNode=e,e.physicsBody=this,s.addBody(this),this._nodeDisposeObserver=e.onDisposeObservable.add((()=>{this.dispose()}))}getClassName(){return"PhysicsBody"}clone(e){const t=new A_(e,this.getMotionType(),this.startAsleep,this.transformNode.getScene());return t.shape=this.shape,t}updateBodyInstances(){const e=this.transformNode;e.hasThinInstances&&this._physicsPlugin.updateBodyInstances(this,e)}get numInstances(){return this._pluginDataInstances.length}set shape(e){this._physicsPlugin.setShape(this,e)}get shape(){return this._physicsPlugin.getShape(this)}setEventMask(e,t){this._physicsPlugin.setEventMask(this,e,t)}getEventMask(e){return this._physicsPlugin.getEventMask(this,e)}setMotionType(e,t){this._physicsPlugin.setMotionType(this,e,t)}getMotionType(e){return this._physicsPlugin.getMotionType(this,e)}computeMassProperties(e){return this._physicsPlugin.computeMassProperties(this,e)}setMassProperties(e,t){this._physicsPlugin.setMassProperties(this,e,t)}getMassProperties(e){return this._physicsPlugin.getMassProperties(this,e)}setLinearDamping(e,t){this._physicsPlugin.setLinearDamping(this,e,t)}getLinearDamping(e){return this._physicsPlugin.getLinearDamping(this,e)}setAngularDamping(e,t){this._physicsPlugin.setAngularDamping(this,e,t)}getAngularDamping(e){return this._physicsPlugin.getAngularDamping(this,e)}setLinearVelocity(e,t){this._physicsPlugin.setLinearVelocity(this,e,t)}getLinearVelocityToRef(e,t){return this._physicsPlugin.getLinearVelocityToRef(this,e,t)}setAngularVelocity(e,t){this._physicsPlugin.setAngularVelocity(this,e,t)}getAngularVelocityToRef(e,t){return this._physicsPlugin.getAngularVelocityToRef(this,e,t)}applyImpulse(e,t,i){this._physicsPlugin.applyImpulse(this,e,t,i)}applyForce(e,t,i){this._physicsPlugin.applyForce(this,e,t,i)}getGeometry(){return this._physicsPlugin.getBodyGeometry(this)}getCollisionObservable(){return this._physicsPlugin.getCollisionObservable(this)}setCollisionCallbackEnabled(e){this._collisionCBEnabled=e,this._physicsPlugin.setCollisionCallbackEnabled(this,e)}getObjectCenterWorld(e){const t=new o.P;return this.getObjectCenterWorldToRef(t,e)}getObjectCenterWorldToRef(e,t){var i;if((null===(i=this._pluginDataInstances)||void 0===i?void 0:i.length)>0){const i=t||0,n=this.transformNode._thinInstanceDataStorage.matrixData;n&&e.set(n[16*i+12],n[16*i+13],n[16*i+14])}else e.copyFrom(this.transformNode.position);return e}addConstraint(e,t,i,n){this._physicsPlugin.addConstraint(this,e,t,i,n)}syncWithBone(e,t,i,n,s,r){const a=this.transformNode;if(a.rotationQuaternion)if(s){const i=o.jp.Quaternion[0];e.getRotationQuaternionToRef(We.T.WORLD,t,i),i.multiplyToRef(s,a.rotationQuaternion)}else e.getRotationQuaternionToRef(We.T.WORLD,t,a.rotationQuaternion);const l=o.jp.Vector3[0],h=o.jp.Vector3[1];r||((r=o.jp.Vector3[2]).x=0,r.y=1,r.z=0),e.getDirectionToRef(r,t,h),e.getAbsolutePositionToRef(t,l),null==n&&i&&(n=i.length()),null!=n&&(l.x+=h.x*n,l.y+=h.y*n,l.z+=h.z*n),a.setAbsolutePosition(l)}iterateOverAllInstances(e){var t;if((null===(t=this._pluginDataInstances)||void 0===t?void 0:t.length)>0)for(let t=0;t<this._pluginDataInstances.length;t++)e(this,t);else e(this,void 0)}setGravityFactor(e,t){this._physicsPlugin.setGravityFactor(this,e,t)}getGravityFactor(e){return this._physicsPlugin.getGravityFactor(this,e)}dispose(){this._collisionCBEnabled&&this.setCollisionCallbackEnabled(!1),this._nodeDisposeObserver&&(this.transformNode.onDisposeObservable.remove(this._nodeDisposeObserver),this._nodeDisposeObserver=null),this._physicsEngine.removeBody(this),this._physicsPlugin.removeBody(this),this._physicsPlugin.disposeBody(this),this._pluginData=null,this._pluginDataInstances.length=0}}!function(e){e[e.FREE=0]="FREE",e[e.LIMITED=1]="LIMITED",e[e.LOCKED=2]="LOCKED"}(__||(__={})),function(e){e[e.LINEAR_X=0]="LINEAR_X",e[e.LINEAR_Y=1]="LINEAR_Y",e[e.LINEAR_Z=2]="LINEAR_Z",e[e.ANGULAR_X=3]="ANGULAR_X",e[e.ANGULAR_Y=4]="ANGULAR_Y",e[e.ANGULAR_Z=5]="ANGULAR_Z",e[e.LINEAR_DISTANCE=6]="LINEAR_DISTANCE"}(m_||(m_={})),function(e){e[e.BALL_AND_SOCKET=1]="BALL_AND_SOCKET",e[e.DISTANCE=2]="DISTANCE",e[e.HINGE=3]="HINGE",e[e.SLIDER=4]="SLIDER",e[e.LOCK=5]="LOCK",e[e.PRISMATIC=6]="PRISMATIC",e[e.SIX_DOF=7]="SIX_DOF"}(g_||(g_={})),function(e){e[e.SPHERE=0]="SPHERE",e[e.CAPSULE=1]="CAPSULE",e[e.CYLINDER=2]="CYLINDER",e[e.BOX=3]="BOX",e[e.CONVEX_HULL=4]="CONVEX_HULL",e[e.CONTAINER=5]="CONTAINER",e[e.MESH=6]="MESH",e[e.HEIGHTFIELD=7]="HEIGHTFIELD"}(v_||(v_={})),function(e){e[e.NONE=0]="NONE",e[e.VELOCITY=1]="VELOCITY",e[e.POSITION=2]="POSITION"}(y_||(y_={})),function(e){e[e.STATIC=0]="STATIC",e[e.ANIMATED=1]="ANIMATED",e[e.DYNAMIC=2]="DYNAMIC"}(x_||(x_={}));class P_{constructor(e,t){var i;if(this._pluginData=void 0,!t)return;const n=t.getPhysicsEngine();if(!n)throw new Error("No Physics Engine available.");if(2!=n.getPluginVersion())throw new Error("Plugin version is incorrect. Expected version 2.");const s=n.getPhysicsPlugin();if(!s)throw new Error("No Physics Plugin available.");if(this._physicsPlugin=s,void 0!==e.pluginData&&null!==e.pluginData)this._pluginData=e.pluginData,this._type=this._physicsPlugin.getShapeType(this);else if(void 0!==e.type&&null!==e.type){this._type=e.type;const t=null!==(i=e.parameters)&&void 0!==i?i:{};this._physicsPlugin.initShape(this,e.type,t)}}getClassName(){return"PhysicsShape"}get type(){return this._type}set filterMembershipMask(e){this._physicsPlugin.setShapeFilterMembershipMask(this,e)}get filterMembershipMask(){return this._physicsPlugin.getShapeFilterMembershipMask(this)}set filterCollideMask(e){this._physicsPlugin.setShapeFilterCollideMask(this,e)}get filterCollideMask(){return this._physicsPlugin.getShapeFilterCollideMask(this)}set material(e){this._physicsPlugin.setMaterial(this,e),this._material=e}get material(){return this._material}set density(e){this._physicsPlugin.setDensity(this,e)}get density(){return this._physicsPlugin.getDensity(this)}addChildFromParent(e,t,i){const n=i.computeWorldMatrix(!0),s=e.computeWorldMatrix(!0),r=o.jp.Matrix[0];n.multiplyToRef(o.y3.Invert(s),r);const a=o.jp.Vector3[0],l=o.jp.Quaternion[0],h=o.jp.Vector3[1];r.decompose(h,l,a),this._physicsPlugin.addChild(this,t,a,l,h)}addChild(e,t,i,n){this._physicsPlugin.addChild(this,e,t,i,n)}removeChild(e){this._physicsPlugin.removeChild(this,e)}getNumChildren(){return this._physicsPlugin.getNumChildren(this)}getBoundingBox(){return this._physicsPlugin.getBoundingBox(this)}dispose(){this._physicsPlugin.disposeShape(this)}}class R_ extends P_{constructor(e,t,i){super({type:v_.SPHERE,parameters:{center:e,radius:t}},i)}static FromMesh(e){const t=e.getBoundingInfo(),i=t.boundingSphere.center,n=t.boundingBox.extendSize,s=Math.max(n.x,n.y,n.z);return new R_(i,s,e.getScene())}}class M_ extends P_{constructor(e,t,i,n){super({type:v_.CAPSULE,parameters:{pointA:e,pointB:t,radius:i}},n)}static FromMesh(e){const t=e.getBoundingInfo(),i=t.boundingBox.extendSize.x,n=new o.P(0,t.boundingBox.extendSize.y-i,0),s=t.boundingBox.center.add(n),r=t.boundingBox.center.subtract(n);return new M_(s,r,i,e.getScene())}}class I_ extends P_{constructor(e,t,i,n){super({type:v_.CYLINDER,parameters:{pointA:e,pointB:t,radius:i}},n)}static FromMesh(e){const t=e.getBoundingInfo(),i=t.boundingBox.extendSize.x,n=new o.P(0,t.boundingBox.extendSize.y,0),s=t.boundingBox.center.add(n),r=t.boundingBox.center.subtract(n);return new I_(s,r,i,e.getScene())}}class D_ extends P_{constructor(e,t,i,n){super({type:v_.BOX,parameters:{center:e,rotation:t,extents:i}},n)}static FromMesh(e){const t=e.getBoundingInfo(),i=t.boundingBox.center,n=t.boundingBox.extendSize.scale(2);return new D_(i,o._f.Identity(),n,e.getScene())}}class O_ extends P_{constructor(e,t){super({type:v_.CONVEX_HULL,parameters:{mesh:e}},t)}}class w_ extends P_{constructor(e,t){super({type:v_.MESH,parameters:{mesh:e}},t)}}class N_ extends P_{constructor(e){super({type:v_.CONTAINER,parameters:{}},e)}}class F_{constructor(e,t,i){if(this._pluginData=void 0,!i)throw new Error("Missing scene parameter for constraint constructor.");const n=i.getPhysicsEngine();if(!n)throw new Error("No Physics Engine available.");if(2!=n.getPluginVersion())throw new Error("Plugin version is incorrect. Expected version 2.");const s=n.getPhysicsPlugin();if(!s)throw new Error("No Physics Plugin available.");this._physicsPlugin=s,this._options=t,this._type=e}get type(){return this._type}get options(){return this._options}set isEnabled(e){this._physicsPlugin.setEnabled(this,e)}get isEnabled(){return this._physicsPlugin.getEnabled(this)}set isCollisionsEnabled(e){this._physicsPlugin.setCollisionsEnabled(this,e)}get isCollisionsEnabled(){return this._physicsPlugin.getCollisionsEnabled(this)}dispose(){this._physicsPlugin.disposeConstraint(this)}}class L_{}class B_ extends F_{constructor(e,t,i){super(g_.SIX_DOF,e,i),this.limits=t}setAxisFriction(e,t){this._physicsPlugin.setAxisFriction(this,e,t)}getAxisFriction(e){return this._physicsPlugin.getAxisFriction(this,e)}setAxisMode(e,t){this._physicsPlugin.setAxisMode(this,e,t)}getAxisMode(e){return this._physicsPlugin.getAxisMode(this,e)}setAxisMinLimit(e,t){this._physicsPlugin.setAxisMinLimit(this,e,t)}getAxisMinLimit(e){return this._physicsPlugin.getAxisMinLimit(this,e)}setAxisMaxLimit(e,t){this._physicsPlugin.setAxisMaxLimit(this,e,t)}getAxisMaxLimit(e){return this._physicsPlugin.getAxisMaxLimit(this,e)}setAxisMotorType(e,t){this._physicsPlugin.setAxisMotorType(this,e,t)}getAxisMotorType(e){return this._physicsPlugin.getAxisMotorType(this,e)}setAxisMotorTarget(e,t){this._physicsPlugin.setAxisMotorTarget(this,e,t)}getAxisMotorTarget(e){return this._physicsPlugin.getAxisMotorTarget(this,e)}setAxisMotorMaxForce(e,t){this._physicsPlugin.setAxisMotorMaxForce(this,e,t)}getAxisMotorMaxForce(e){return this._physicsPlugin.getAxisMotorMaxForce(this,e)}}class U_ extends F_{constructor(e,t,i,n,s){super(g_.BALL_AND_SOCKET,{pivotA:e,pivotB:t,axisA:i,axisB:n},s)}}class V_ extends F_{constructor(e,t){super(g_.DISTANCE,{maxDistance:e},t)}}class k_ extends F_{constructor(e,t,i,n,s){super(g_.HINGE,{pivotA:e,pivotB:t,axisA:i,axisB:n},s)}}class G_ extends F_{constructor(e,t,i,n,s){super(g_.SLIDER,{pivotA:e,pivotB:t,axisA:i,axisB:n},s)}}class z_ extends F_{constructor(e,t,i,n,s){super(g_.LOCK,{pivotA:e,pivotB:t,axisA:i,axisB:n},s)}}class W_ extends F_{constructor(e,t,i,n,s){super(g_.PRISMATIC,{pivotA:e,pivotB:t,axisA:i,axisB:n},s)}}!function(e){e[e.GEOMETRIC_MEAN=0]="GEOMETRIC_MEAN",e[e.MINIMUM=1]="MINIMUM",e[e.MAXIMUM=2]="MAXIMUM",e[e.ARITHMETIC_MEAN=3]="ARITHMETIC_MEAN",e[e.MULTIPLY=4]="MULTIPLY"}(b_||(b_={}));class H_{constructor(e,t,i={mass:0},n){var s;if(this.transformNode=e,this.type=t,this._options=i,this._scene=n,this._disposeShapeWhenDisposed=!0,!this.transformNode)return void _.Y.Error("No object was provided. A physics object is obligatory");const r=e;if(this.transformNode.parent&&0!==this._options.mass&&r.hasThinInstances&&_.Y.Warn("A physics body has been created for an object which has a parent and thin instances. Babylon physics currently works in local space so unexpected issues may occur."),!this._scene&&e.getScene&&(this._scene=e.getScene()),!this._scene)return;this._options.mass=void 0===i.mass?0:i.mass,this._options.friction=void 0===i.friction?.2:i.friction,this._options.restitution=void 0===i.restitution?.2:i.restitution;const o=0===this._options.mass?x_.STATIC:x_.DYNAMIC,a=null!==(s=this._options.startAsleep)&&void 0!==s&&s;this.body=new A_(e,o,a,this._scene),this._addSizeOptions(),t.getClassName&&"PhysicsShape"===t.getClassName()?(this.shape=t,this._disposeShapeWhenDisposed=!1):this.shape=new P_({type:t,parameters:this._options},this._scene),this.material={friction:this._options.friction,restitution:this._options.restitution},this.body.shape=this.shape,this.shape.material=this.material,this.body.setMassProperties({mass:this._options.mass}),this._nodeDisposeObserver=this.transformNode.onDisposeObservable.add((()=>{this.dispose()}))}_getObjectBoundingBox(){return this.transformNode.getRawBoundingInfo?this.transformNode.getRawBoundingInfo().boundingBox:new On.k(new o.P(-.5,-.5,-.5),new o.P(.5,.5,.5))}_addSizeOptions(){var e,t,i,n,s,r,a,l;this.transformNode.computeWorldMatrix(!0);const h=this._getObjectBoundingBox(),c=o.jp.Vector3[0];c.copyFrom(h.extendSize),c.scaleInPlace(2),c.multiplyInPlace(this.transformNode.scaling);const u=o.jp.Vector3[1];if(u.copyFrom(h.minimum),u.multiplyInPlace(this.transformNode.scaling),!this._options.center){const e=new o.P;e.copyFrom(h.center),e.multiplyInPlace(this.transformNode.scaling),this._options.center=e}switch(this.type){case v_.SPHERE:!this._options.radius&&lt.R.WithinEpsilon(c.x,c.y,1e-4)&&lt.R.WithinEpsilon(c.x,c.z,1e-4)?this._options.radius=c.x/2:this._options.radius||(_.Y.Warn("Non uniform scaling is unsupported for sphere shapes. Setting the radius to the biggest bounding box extent."),this._options.radius=Math.max(c.x,c.y,c.z)/2);break;case v_.CAPSULE:{const n=c.x/2;this._options.radius=null!==(e=this._options.radius)&&void 0!==e?e:n,this._options.pointA=null!==(t=this._options.pointA)&&void 0!==t?t:new o.P(0,u.y+n,0),this._options.pointB=null!==(i=this._options.pointB)&&void 0!==i?i:new o.P(0,u.y+c.y-n,0)}break;case v_.CYLINDER:{const e=c.x/2;this._options.radius=null!==(n=this._options.radius)&&void 0!==n?n:e,this._options.pointA=null!==(s=this._options.pointA)&&void 0!==s?s:new o.P(0,u.y,0),this._options.pointB=null!==(r=this._options.pointB)&&void 0!==r?r:new o.P(0,u.y+c.y,0)}break;case v_.MESH:case v_.CONVEX_HULL:if(this._options.mesh||"Mesh"!==this.transformNode.getClassName()&&"InstancedMesh"!==this.transformNode.getClassName()){if(!this._options.mesh||!this._options.mesh.getClassName||"Mesh"!==this._options.mesh.getClassName()&&"InstancedMesh"!==this._options.mesh.getClassName())throw new Error("No valid mesh was provided for mesh or convex hull shape parameter.")}else this._options.mesh=this.transformNode;break;case v_.BOX:this._options.extents=null!==(a=this._options.extents)&&void 0!==a?a:new o.P(c.x,c.y,c.z),this._options.rotation=null!==(l=this._options.rotation)&&void 0!==l?l:o._f.Identity()}}dispose(){this._nodeDisposeObserver&&(this.body.transformNode.onDisposeObservable.remove(this._nodeDisposeObserver),this._nodeDisposeObserver=null),this.body.dispose(),this._disposeShapeWhenDisposed&&this.shape.dispose()}}class X_{constructor(e,t,i){this._vertices=[],this._indices=[];const n=e.computeWorldMatrix(!0),s=new o.P,r=new o._f,a=new o.P;n.decompose(s,r,a),this._bodyFromWorld=o.y3.Compose(o.P.One(),e.rotationQuaternion?e.rotationQuaternion:o._f.Identity(),e.position),this._bodyFromWorld=this._bodyFromWorld.invert(),this._isRightHanded=i.useRightHandedSystem,this._collectIndices=t}addMesh(e,t){const i=this._vertices.length,n=e.computeWorldMatrix(!0).multiply(this._bodyFromWorld),s=e.getVerticesData(qe.o.PositionKind)||[],r=s.length/3;for(let e=0;e<r;e++){const t=new o.P(s[3*e+0],s[3*e+1],s[3*e+2]);this._vertices.push(o.P.TransformCoordinates(t,n))}if(this._collectIndices){const t=e.getIndices();if(t)for(let e=0;e<t.length;e+=3)this._isRightHanded?(this._indices.push(t[e+0]+i),this._indices.push(t[e+1]+i),this._indices.push(t[e+2]+i)):(this._indices.push(t[e+2]+i),this._indices.push(t[e+1]+i),this._indices.push(t[e+0]+i))}t&&e.getChildMeshes(!1).filter((e=>!e.physicsBody)).forEach((e=>this.addMesh(e,t)))}getVertices(e){const t=3*this._vertices.length,i=4*t,n=e._malloc(i),s=new Float32Array(e.HEAPU8.buffer,n,t);for(let e=0;e<this._vertices.length;e++)s[3*e+0]=this._vertices[e].x,s[3*e+1]=this._vertices[e].y,s[3*e+2]=this._vertices[e].z;return s}freeBuffer(e,t){e._free(t.byteOffset)}getTriangles(e){const t=4*this._indices.length,i=e._malloc(t),n=new Int32Array(e.HEAPU8.buffer,i,this._indices.length);for(let e=0;e<this._indices.length;e++)n[e]=this._indices[e];return n}}class j_{constructor(e){this.hpBodyId=e,this.userMassProps={centerOfMass:void 0,mass:void 0,inertia:void 0,inertiaOrientation:void 0}}}class Y_{constructor(){this.bodyId=BigInt(0),this.position=new o.P,this.normal=new o.P}}class q_{constructor(){this.contactOnA=new Y_,this.contactOnB=new Y_,this.impulseApplied=0}static readToRef(e,t,i){const n=new Int32Array(e,t),s=new Float32Array(e,t);i.contactOnA.bodyId=BigInt(n[2]),i.contactOnA.position.set(s[10],s[11],s[12]),i.contactOnA.normal.set(s[13],s[14],s[15]),i.contactOnB.bodyId=BigInt(n[18]),i.contactOnB.position.set(s[26],s[27],s[28]),i.contactOnB.normal.set(s[29],s[30],s[31]),i.impulseApplied=s[33]}}class K_{constructor(e=!0,t=HK){this._useDeltaForWorldStep=e,this._hknp={},this.name="HavokPlugin",this._fixedTimeStep=1/60,this._timeStep=1/60,this._tmpVec3=Xe.B.BuildArray(3,o.P.Zero),this._bodies=new Map,this._bodyCollisionObservable=new Map,this.onCollisionObservable=new r.y$,"function"!=typeof t?(this._hknp=t,this.isSupported()?(this.world=this._hknp.HP_World_Create()[1],this._queryCollector=this._hknp.HP_QueryCollector_Create(1)[1]):_.Y.Error("Havok is not available. Please make sure you included the js file.")):_.Y.Error("Havok is not ready. Please make sure you await HK() before using the plugin.")}isSupported(){return void 0!==this._hknp}setGravity(e){this._hknp.HP_World_SetGravity(this.world,this._bVecToV3(e))}setTimeStep(e){this._fixedTimeStep=e}getTimeStep(){return this._fixedTimeStep}executeStep(e,t){for(const e of t)e.disablePreStep||this.setPhysicsBodyTransformation(e,e.transformNode);this._hknp.HP_World_Step(this.world,this._useDeltaForWorldStep?e:this._timeStep),this._bodyBuffer=this._hknp.HP_World_GetBodyBuffer(this.world)[1];for(const e of t)this.sync(e);this._notifyCollisions()}getPluginVersion(){return 2}initBody(e,t,i,n){e._pluginData=new j_(this._hknp.HP_Body_Create()[1]),this._internalSetMotionType(e._pluginData,t);const s=[this._bVecToV3(i),this._bQuatToV4(n)];this._hknp.HP_Body_SetQTransform(e._pluginData.hpBodyId,s),this._hknp.HP_World_AddBody(this.world,e._pluginData.hpBodyId,e.startAsleep),this._bodies.set(e._pluginData.hpBodyId[0],{body:e,index:0})}removeBody(e){if(e._pluginDataInstances&&e._pluginDataInstances.length>0)for(const t of e._pluginDataInstances)this._bodyCollisionObservable.delete(t.hpBodyId[0]),this._hknp.HP_World_RemoveBody(this.world,t.hpBodyId);e._pluginData&&(this._bodyCollisionObservable.delete(e._pluginData.hpBodyId[0]),this._hknp.HP_World_RemoveBody(this.world,e._pluginData.hpBodyId))}initBodyInstances(e,t,i){var n,s;const r=null!==(s=null===(n=i._thinInstanceDataStorage)||void 0===n?void 0:n.instancesCount)&&void 0!==s?s:0,o=i._thinInstanceDataStorage.matrixData;o&&(this._createOrUpdateBodyInstances(e,t,o,0,r,!1),e._pluginDataInstances.forEach(((t,i)=>{this._bodies.set(t.hpBodyId[0],{body:e,index:i})})))}_createOrUpdateBodyInstances(e,t,i,n,s,r){const a=o.jp.Quaternion[0],l=o.y3.Identity();for(let h=n;h<s;h++){const n=[i[16*h+12],i[16*h+13],i[16*h+14]];let s;s=r?e._pluginDataInstances[h].hpBodyId:this._hknp.HP_Body_Create()[1],l.setRowFromFloats(0,i[16*h+0],i[16*h+1],i[16*h+2],0),l.setRowFromFloats(1,i[16*h+4],i[16*h+5],i[16*h+6],0),l.setRowFromFloats(2,i[16*h+8],i[16*h+9],i[16*h+10],0),o._f.FromRotationMatrixToRef(l,a);const c=[n,[a.x,a.y,a.z,a.w]];if(this._hknp.HP_Body_SetQTransform(s,c),!r){const i=new j_(s);e._pluginDataInstances.length&&(i.userMassProps=e._pluginDataInstances[0].userMassProps),this._internalSetMotionType(i,t),this._internalUpdateMassProperties(i),e._pluginDataInstances.push(i),this._hknp.HP_World_AddBody(this.world,s,e.startAsleep),i.worldTransformOffset=this._hknp.HP_Body_GetWorldTransformOffset(s)[1]}}}updateBodyInstances(e,t){var i,n;const s=null!==(n=null===(i=t._thinInstanceDataStorage)||void 0===i?void 0:i.instancesCount)&&void 0!==n?n:0,r=t._thinInstanceDataStorage.matrixData;if(!r)return;const o=e._pluginDataInstances.length,a=this.getMotionType(e);if(s>o){this._createOrUpdateBodyInstances(e,a,r,o,s,!1);const t=this._hknp.HP_Body_GetShape(e._pluginDataInstances[0].hpBodyId)[1];for(let i=o;i<s;i++)this._hknp.HP_Body_SetShape(e._pluginDataInstances[i].hpBodyId,t),this._internalUpdateMassProperties(e._pluginDataInstances[i]),this._bodies.set(e._pluginDataInstances[i].hpBodyId[0],{body:e,index:i})}else if(s<o){const t=o-s;for(let i=0;i<t;i++){const t=e._pluginDataInstances.pop();this._bodies.delete(t.hpBodyId[0]),this._hknp.HP_World_RemoveBody(this.world,t.hpBodyId),this._hknp.HP_Body_Release(t.hpBodyId)}this._createOrUpdateBodyInstances(e,a,r,0,s,!0)}}sync(e){this.syncTransform(e,e.transformNode)}syncTransform(e,t){if(e._pluginDataInstances.length){const i=t,n=i._thinInstanceDataStorage.matrixData;if(!n)return;const s=e._pluginDataInstances.length;for(let t=0;t<s;t++){const i=e._pluginDataInstances[t].worldTransformOffset,s=new Float32Array(this._hknp.HEAPU8.buffer,this._bodyBuffer+i,16),r=16*t;for(let e=0;e<15;e++)3!=(3&e)&&(n[r+e]=s[e]);n[r+15]=1}i.thinInstanceBufferUpdated("matrix")}else try{const i=this._hknp.HP_Body_GetQTransform(e._pluginData.hpBodyId)[1],n=i[0],s=i[1],r=o.jp.Quaternion[0];r.set(s[0],s[1],s[2],s[3]);const a=t.parent;if(a&&a.absoluteRotationQuaternion){o.jp.Vector3[2].set(n[0],n[1],n[2]),a.absoluteRotationQuaternion.conjugateToRef(o.jp.Quaternion[1]),r.multiplyInPlace(o.jp.Quaternion[1]),o.jp.Vector3[2].subtractToRef(a.absolutePosition,o.jp.Vector3[0]);const e=o.jp.Vector3[1];o.jp.Vector3[0].rotateByQuaternionToRef(o.jp.Quaternion[1],e),t.position.set(e.x,e.y,e.z)}else t.position.set(n[0],n[1],n[2]);t.rotationQuaternion?t.rotationQuaternion.copyFrom(r):r.toEulerAnglesToRef(t.rotation)}catch(e){console.log(`Syncing transform failed for node ${t.name}: ${e.message}...`)}}setShape(e,t){var i,n,s;const r=t&&t._pluginData?t._pluginData:BigInt(0);if(!(e.transformNode instanceof Nt.Kj&&(null===(i=e.transformNode._thinInstanceDataStorage)||void 0===i?void 0:i.matrixData)))return this._hknp.HP_Body_SetShape(e._pluginData.hpBodyId,r),void this._internalUpdateMassProperties(e._pluginData);const o=null!==(s=null===(n=e.transformNode._thinInstanceDataStorage)||void 0===n?void 0:n.instancesCount)&&void 0!==s?s:0;for(let t=0;t<o;t++)this._hknp.HP_Body_SetShape(e._pluginDataInstances[t].hpBodyId,r),this._internalUpdateMassProperties(e._pluginDataInstances[t])}_getPluginReference(e,t){var i;return(null===(i=e._pluginDataInstances)||void 0===i?void 0:i.length)?e._pluginDataInstances[null!=t?t:0]:e._pluginData}getShape(e){const t=this._getPluginReference(e),i=this._hknp.HP_Body_GetShape(t.hpBodyId)[1];if(0!=i){const t=e.transformNode.getScene();return new P_({pluginData:i},t)}return null}getShapeType(e){return e.type?e.type:this._hknp.HP_Shape_GetType(e._pluginData)}setEventMask(e,t,i){this._applyToBodyOrInstances(e,(e=>{this._hknp.HP_Body_SetEventMask(e.hpBodyId,t)}),i)}getEventMask(e,t){const i=this._getPluginReference(e,t);return this._hknp.HP_Body_GetEventMask(i)[1]}_fromMassPropertiesTuple(e){return{centerOfMass:o.P.FromArray(e[0]),mass:e[1],inertia:o.P.FromArray(e[2]),inertiaOrientation:o._f.FromArray(e[3])}}_internalUpdateMassProperties(e){const t=this._internalComputeMassProperties(e),i=e.userMassProps;i.centerOfMass&&(t[0]=i.centerOfMass.asArray()),null!=i.mass&&(t[1]=i.mass),i.inertia&&(t[2]=i.inertia.asArray()),i.inertiaOrientation&&(t[3]=i.inertiaOrientation.asArray()),this._hknp.HP_Body_SetMassProperties(e.hpBodyId,t)}_internalSetMotionType(e,t){switch(t){case x_.STATIC:this._hknp.HP_Body_SetMotionType(e.hpBodyId,this._hknp.MotionType.STATIC);break;case x_.ANIMATED:this._hknp.HP_Body_SetMotionType(e.hpBodyId,this._hknp.MotionType.KINEMATIC);break;case x_.DYNAMIC:this._hknp.HP_Body_SetMotionType(e.hpBodyId,this._hknp.MotionType.DYNAMIC)}}setMotionType(e,t,i){this._applyToBodyOrInstances(e,(e=>{this._internalSetMotionType(e,t)}),i)}getMotionType(e,t){const i=this._getPluginReference(e,t),n=this._hknp.HP_Body_GetMotionType(i.hpBodyId)[1];switch(n){case this._hknp.MotionType.STATIC:return x_.STATIC;case this._hknp.MotionType.KINEMATIC:return x_.ANIMATED;case this._hknp.MotionType.DYNAMIC:return x_.DYNAMIC}throw new Error("Unknown motion type: "+n)}_internalComputeMassProperties(e){const t=this._hknp.HP_Body_GetShape(e.hpBodyId);if(t[0]==this._hknp.Result.RESULT_OK){const e=this._hknp.HP_Shape_BuildMassProperties(t[1]);if(e[0]==this._hknp.Result.RESULT_OK)return e[1]}return[[0,0,0],1,[1,1,1],[0,0,0,1]]}computeMassProperties(e,t){const i=this._getPluginReference(e,t),n=this._internalComputeMassProperties(i);return this._fromMassPropertiesTuple(n)}setMassProperties(e,t,i){this._applyToBodyOrInstances(e,(e=>{e.userMassProps=t,this._internalUpdateMassProperties(e)}),i)}getMassProperties(e,t){const i=this._getPluginReference(e,t),n=this._hknp.HP_Body_GetMassProperties(i.hpBodyId)[1];return this._fromMassPropertiesTuple(n)}setLinearDamping(e,t,i){this._applyToBodyOrInstances(e,(e=>{this._hknp.HP_Body_SetLinearDamping(e.hpBodyId,t)}),i)}getLinearDamping(e,t){const i=this._getPluginReference(e,t);return this._hknp.HP_Body_GetLinearDamping(i.hpBodyId)[1]}setAngularDamping(e,t,i){this._applyToBodyOrInstances(e,(e=>{this._hknp.HP_Body_SetAngularDamping(e.hpBodyId,t)}),i)}getAngularDamping(e,t){const i=this._getPluginReference(e,t);return this._hknp.HP_Body_GetAngularDamping(i.hpBodyId)[1]}setLinearVelocity(e,t,i){this._applyToBodyOrInstances(e,(e=>{this._hknp.HP_Body_SetLinearVelocity(e.hpBodyId,this._bVecToV3(t))}),i)}getLinearVelocityToRef(e,t,i){const n=this._getPluginReference(e,i),s=this._hknp.HP_Body_GetLinearVelocity(n.hpBodyId)[1];this._v3ToBvecRef(s,t)}_applyToBodyOrInstances(e,t,i){var n;if((null===(n=e._pluginDataInstances)||void 0===n?void 0:n.length)>0&&void 0===i)for(let i=0;i<e._pluginDataInstances.length;i++)t(e._pluginDataInstances[i]);else t(this._getPluginReference(e,i))}applyImpulse(e,t,i,n){this._applyToBodyOrInstances(e,(e=>{this._hknp.HP_Body_ApplyImpulse(e.hpBodyId,this._bVecToV3(i),this._bVecToV3(t))}),n)}applyForce(e,t,i,n){t.scaleToRef(this.getTimeStep(),this._tmpVec3[0]),this.applyImpulse(e,this._tmpVec3[0],i,n)}setAngularVelocity(e,t,i){this._applyToBodyOrInstances(e,(e=>{this._hknp.HP_Body_SetAngularVelocity(e.hpBodyId,this._bVecToV3(t))}),i)}getAngularVelocityToRef(e,t,i){const n=this._getPluginReference(e,i),s=this._hknp.HP_Body_GetAngularVelocity(n.hpBodyId)[1];this._v3ToBvecRef(s,t)}setPhysicsBodyTransformation(e,t){const i=e.transformNode;if(e.numInstances>0){const t=i._thinInstanceDataStorage.matrixData;if(!t)return;const n=e.numInstances;this._createOrUpdateBodyInstances(e,e.getMotionType(),t,0,n,!0)}else this._hknp.HP_Body_SetQTransform(e._pluginData.hpBodyId,this._getTransformInfos(t))}setGravityFactor(e,t,i){this._applyToBodyOrInstances(e,(e=>{this._hknp.HP_Body_SetGravityFactor(e.hpBodyId,t)}),i)}getGravityFactor(e,t){const i=this._getPluginReference(e,t);return this._hknp.HP_Body_GetGravityFactor(i.hpBodyId)[1]}disposeBody(e){if(e._pluginDataInstances&&e._pluginDataInstances.length>0)for(const t of e._pluginDataInstances)this._hknp.HP_Body_Release(t.hpBodyId),t.hpBodyId=void 0;e._pluginData&&(this._hknp.HP_Body_Release(e._pluginData.hpBodyId),e._pluginData.hpBodyId=void 0)}initShape(e,t,i){switch(t){case v_.SPHERE:{const t=i.radius||1,n=i.center?this._bVecToV3(i.center):[0,0,0];e._pluginData=this._hknp.HP_Shape_CreateSphere(n,t)[1]}break;case v_.BOX:{const t=i.rotation?this._bQuatToV4(i.rotation):[0,0,0,1],n=i.extents?this._bVecToV3(i.extents):[1,1,1],s=i.center?this._bVecToV3(i.center):[0,0,0];e._pluginData=this._hknp.HP_Shape_CreateBox(s,t,n)[1]}break;case v_.CAPSULE:{const t=i.pointA?this._bVecToV3(i.pointA):[0,0,0],n=i.pointB?this._bVecToV3(i.pointB):[0,1,0],s=i.radius||0;e._pluginData=this._hknp.HP_Shape_CreateCapsule(t,n,s)[1]}break;case v_.CONTAINER:e._pluginData=this._hknp.HP_Shape_CreateContainer()[1];break;case v_.CYLINDER:{const t=i.pointA?this._bVecToV3(i.pointA):[0,0,0],n=i.pointB?this._bVecToV3(i.pointB):[0,1,0],s=i.radius||0;e._pluginData=this._hknp.HP_Shape_CreateCylinder(t,n,s)[1]}break;case v_.CONVEX_HULL:case v_.MESH:{const n=i.mesh;if(!n)throw new Error("No mesh provided to create physics shape.");{const s=!!i.includeChildMeshes,r=t!=v_.CONVEX_HULL,o=new X_(n,r,null==n?void 0:n.getScene());o.addMesh(n,s);const a=o.getVertices(this._hknp),l=a.length/3;if(t==v_.CONVEX_HULL)e._pluginData=this._hknp.HP_Shape_CreateConvexHull(a.byteOffset,l)[1];else{const t=o.getTriangles(this._hknp),i=t.length/3;e._pluginData=this._hknp.HP_Shape_CreateMesh(a.byteOffset,l,t.byteOffset,i)[1],o.freeBuffer(this._hknp,t)}o.freeBuffer(this._hknp,a)}}break;default:throw new Error("Unsupported Shape Type.")}}setShapeFilterMembershipMask(e,t){const i=this._hknp.HP_Shape_GetFilterInfo(e._pluginData)[1][1];this._hknp.HP_Shape_SetFilterInfo(e._pluginData,[t,i])}getShapeFilterMembershipMask(e){return this._hknp.HP_Shape_GetFilterInfo(e._pluginData)[1][0]}setShapeFilterCollideMask(e,t){const i=this._hknp.HP_Shape_GetFilterInfo(e._pluginData)[1][0];this._hknp.HP_Shape_SetFilterInfo(e._pluginData,[i,t])}getShapeFilterCollideMask(e){return this._hknp.HP_Shape_GetFilterInfo(e._pluginData)[1][1]}setMaterial(e,t){var i,n,s,r,o;const a=null!==(i=t.friction)&&void 0!==i?i:.5,l=null!==(n=t.staticFriction)&&void 0!==n?n:a,h=null!==(s=t.restitution)&&void 0!==s?s:0,c=null!==(r=t.frictionCombine)&&void 0!==r?r:b_.MINIMUM,u=null!==(o=t.restitutionCombine)&&void 0!==o?o:b_.MAXIMUM,d=[l,a,h,this._materialCombineToNative(c),this._materialCombineToNative(u)];this._hknp.HP_Shape_SetMaterial(e._pluginData,d)}setDensity(e,t){this._hknp.HP_Shape_SetDensity(e._pluginData,t)}getDensity(e){return this._hknp.HP_Shape_GetDensity(e._pluginData)[1]}_getTransformInfos(e){if(e.parent)return e.computeWorldMatrix(),[this._bVecToV3(e.absolutePosition),this._bQuatToV4(e.absoluteRotationQuaternion)];let t=o.jp.Quaternion[0];if(e.rotationQuaternion)t=e.rotationQuaternion;else{const i=e.rotation;o._f.FromEulerAnglesToRef(i.x,i.y,i.z,t)}return[this._bVecToV3(e.position),this._bQuatToV4(t)]}addChild(e,t,i,n,s){const r=[i?this._bVecToV3(i):[0,0,0],n?this._bQuatToV4(n):[0,0,0,1],s?this._bVecToV3(s):[1,1,1]];this._hknp.HP_Shape_AddChild(e._pluginData,t._pluginData,r)}removeChild(e,t){this._hknp.HP_Shape_RemoveChild(e._pluginData,t)}getNumChildren(e){return this._hknp.HP_Shape_GetNumChildren(e._pluginData)[1]}getBoundingBox(e){return{}}getBodyGeometry(e){var t;const i=(null===(t=e._pluginDataInstances)||void 0===t?void 0:t.length)>0?e._pluginDataInstances[0]:e._pluginData,n=this._hknp.HP_Body_GetShape(i.hpBodyId)[1],s=this._hknp.HP_Shape_CreateDebugDisplayGeometry(n);if(s[0]!=this._hknp.Result.RESULT_OK)return{positions:[],indices:[]};const r=this._hknp.HP_DebugGeometry_GetInfo(s[1])[1],o=new Float32Array(this._hknp.HEAPU8.buffer,r[0],3*r[1]),a=new Uint32Array(this._hknp.HEAPU8.buffer,r[2],3*r[3]),l=o.slice(0),h=a.slice(0);return this._hknp.HP_DebugGeometry_Release(s[1]),{positions:l,indices:h}}disposeShape(e){this._hknp.HP_Shape_Release(e._pluginData),e._pluginData=void 0}initConstraint(e,t,i,n,s){var r,a,l,h;const c=e.type,u=e.options;if(!c||!u)return void _.Y.Warn("No constraint type or options. Constraint is invalid.");if(t._pluginDataInstances.length>0&&void 0===n||i._pluginDataInstances.length>0&&void 0===s)return void _.Y.Warn("Body is instanced but no instance index was specified. Constraint will not be applied.");const d=this._hknp.HP_Constraint_Create()[1];e._pluginData=d;const p=this._getPluginReference(t,n).hpBodyId,f=this._getPluginReference(i,s).hpBodyId;this._hknp.HP_Constraint_SetParentBody(d,p),this._hknp.HP_Constraint_SetChildBody(d,f);const m=u.pivotA?this._bVecToV3(u.pivotA):this._bVecToV3(o.P.Zero()),g=null!==(r=u.axisA)&&void 0!==r?r:new o.P(1,0,0),v=this._tmpVec3[0];null==g||g.getNormalToRef(v),this._hknp.HP_Constraint_SetAnchorInParent(d,m,this._bVecToV3(g),this._bVecToV3(v));const y=u.pivotB?this._bVecToV3(u.pivotB):this._bVecToV3(o.P.Zero()),x=null!==(a=u.axisB)&&void 0!==a?a:new o.P(1,0,0),b=this._tmpVec3[0];if(x.getNormalToRef(b),this._hknp.HP_Constraint_SetAnchorInChild(d,y,this._bVecToV3(x),this._bVecToV3(b)),c==g_.LOCK)this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_X,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_Y,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_Z,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.ANGULAR_X,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.ANGULAR_Y,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.ANGULAR_Z,this._hknp.ConstraintAxisLimitMode.LOCKED);else if(c==g_.DISTANCE){const e=u.maxDistance||0,t=this._hknp.ConstraintAxis.LINEAR_DISTANCE;this._hknp.HP_Constraint_SetAxisMode(d,t,this._hknp.ConstraintAxisLimitMode.LIMITED),this._hknp.HP_Constraint_SetAxisMinLimit(d,t,e),this._hknp.HP_Constraint_SetAxisMaxLimit(d,t,e)}else if(c==g_.HINGE)this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_X,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_Y,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_Z,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.ANGULAR_Y,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.ANGULAR_Z,this._hknp.ConstraintAxisLimitMode.LOCKED);else if(c==g_.PRISMATIC)this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_Y,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_Z,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.ANGULAR_X,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.ANGULAR_Y,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.ANGULAR_Z,this._hknp.ConstraintAxisLimitMode.LOCKED);else if(c==g_.SLIDER)this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_Y,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_Z,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.ANGULAR_Y,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.ANGULAR_Z,this._hknp.ConstraintAxisLimitMode.LOCKED);else if(c==g_.BALL_AND_SOCKET)this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_X,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_Y,this._hknp.ConstraintAxisLimitMode.LOCKED),this._hknp.HP_Constraint_SetAxisMode(d,this._hknp.ConstraintAxis.LINEAR_Z,this._hknp.ConstraintAxisLimitMode.LOCKED);else{if(c!=g_.SIX_DOF)throw new Error("Unsupported Constraint Type.");{const t=e;for(const e of t.limits){const t=this._constraintAxisToNative(e.axis);0==(null!==(l=e.minLimit)&&void 0!==l?l:-1)&&0==(null!==(h=e.maxLimit)&&void 0!==h?h:-1)?this._hknp.HP_Constraint_SetAxisMode(d,t,this._hknp.ConstraintAxisLimitMode.LOCKED):(null!=e.minLimit&&(this._hknp.HP_Constraint_SetAxisMode(d,t,this._hknp.ConstraintAxisLimitMode.LIMITED),this._hknp.HP_Constraint_SetAxisMinLimit(d,t,e.minLimit)),null!=e.maxLimit&&(this._hknp.HP_Constraint_SetAxisMode(d,t,this._hknp.ConstraintAxisLimitMode.LIMITED),this._hknp.HP_Constraint_SetAxisMaxLimit(d,t,e.maxLimit)))}}}const T=!!u.collision;this._hknp.HP_Constraint_SetCollisionsEnabled(d,T),this._hknp.HP_Constraint_SetEnabled(d,!0)}addConstraint(e,t,i,n,s){this.initConstraint(i,e,t,n,s)}setEnabled(e,t){this._hknp.HP_Constraint_SetEnabled(e._pluginData,t)}getEnabled(e){return this._hknp.HP_Constraint_GetEnabled(e._pluginData)[1]}setCollisionsEnabled(e,t){this._hknp.HP_Constraint_SetCollisionsEnabled(e._pluginData,t)}getCollisionsEnabled(e){return this._hknp.HP_Constraint_GetCollisionsEnabled(e._pluginData)[1]}setAxisFriction(e,t,i){this._hknp.HP_Constraint_SetAxisFriction(e._pluginData,this._constraintAxisToNative(t),i)}getAxisFriction(e,t){return this._hknp.HP_Constraint_GetAxisFriction(e._pluginData,this._constraintAxisToNative(t))[1]}setAxisMode(e,t,i){this._hknp.HP_Constraint_SetAxisMode(e._pluginData,this._constraintAxisToNative(t),this._limitModeToNative(i))}getAxisMode(e,t){const i=this._hknp.HP_Constraint_GetAxisMode(e._pluginData,this._constraintAxisToNative(t))[1];return this._nativeToLimitMode(i)}setAxisMinLimit(e,t,i){this._hknp.HP_Constraint_SetAxisMinLimit(e._pluginData,this._constraintAxisToNative(t),i)}getAxisMinLimit(e,t){return this._hknp.HP_Constraint_GetAxisMinLimit(e._pluginData,this._constraintAxisToNative(t))[1]}setAxisMaxLimit(e,t,i){this._hknp.HP_Constraint_SetAxisMaxLimit(e._pluginData,this._constraintAxisToNative(t),i)}getAxisMaxLimit(e,t){return this._hknp.HP_Constraint_GetAxisMaxLimit(e._pluginData,this._constraintAxisToNative(t))[1]}setAxisMotorType(e,t,i){this._hknp.HP_Constraint_SetAxisMotorType(e._pluginData,this._constraintAxisToNative(t),this._constraintMotorTypeToNative(i))}getAxisMotorType(e,t){return this._nativeToMotorType(this._hknp.HP_Constraint_GetAxisMotorType(e._pluginData,this._constraintAxisToNative(t))[1])}setAxisMotorTarget(e,t,i){this._hknp.HP_Constraint_SetAxisMotorTarget(e._pluginData,this._constraintAxisToNative(t),i)}getAxisMotorTarget(e,t){return this._hknp.HP_Constraint_GetAxisMotorTarget(e._pluginData,this._constraintAxisToNative(t))[1]}setAxisMotorMaxForce(e,t,i){this._hknp.HP_Constraint_SetAxisMotorMaxForce(e._pluginData,this._constraintAxisToNative(t),i)}getAxisMotorMaxForce(e,t){return this._hknp.HP_Constraint_GetAxisMotorMaxForce(e._pluginData,this._constraintAxisToNative(t))[1]}disposeConstraint(e){const t=e._pluginData;this._hknp.HP_Constraint_SetEnabled(t,!1),this._hknp.HP_Constraint_Release(t),e._pluginData=void 0}raycast(e,t,i){i.reset(e,t);const n=[this._bVecToV3(e),this._bVecToV3(t),[-1,-1]];if(this._hknp.HP_World_CastRayWithCollector(this.world,this._queryCollector,n),this._hknp.HP_QueryCollector_GetNumHits(this._queryCollector)[1]>0){const e=this._hknp.HP_QueryCollector_GetCastRayResult(this._queryCollector,0)[1],t=e[1][3],n=e[1][4];i.setHitData({x:n[0],y:n[1],z:n[2]},{x:t[0],y:t[1],z:t[2]}),i.calculateHitDistance();const s=this._bodies.get(e[1][0][0]);i.body=null==s?void 0:s.body,i.bodyIndex=null==s?void 0:s.index}}getCollisionObservable(e){const t=e._pluginData.hpBodyId[0];let i=this._bodyCollisionObservable.get(t);return i||(i=new r.y$,this._bodyCollisionObservable.set(t,i)),i}setCollisionCallbackEnabled(e,t){const i=this._hknp.EventType.COLLISION_STARTED.value|this._hknp.EventType.COLLISION_CONTINUED.value|this._hknp.EventType.COLLISION_FINISHED.value;e._pluginDataInstances&&e._pluginDataInstances.length?e._pluginDataInstances.forEach((e=>{this._hknp.HP_Body_SetEventMask(e.hpBodyId,t?i:0)})):e._pluginData&&this._hknp.HP_Body_SetEventMask(e._pluginData.hpBodyId,t?i:0)}_notifyCollisions(){let e=this._hknp.HP_World_GetCollisionEvents(this.world)[1];const t=new q_,i=Number(this.world);for(;e;){q_.readToRef(this._hknp.HEAPU8.buffer,e,t),t.contactOnB.position.subtractToRef(t.contactOnA.position,this._tmpVec3[0]);const n=o.P.Dot(this._tmpVec3[0],t.contactOnA.normal),s=this._bodies.get(t.contactOnA.bodyId),r=this._bodies.get(t.contactOnB.bodyId),a={collider:s.body,colliderIndex:s.index,collidedAgainst:r.body,collidedAgainstIndex:r.index,point:t.contactOnA.position,distance:n,impulse:t.impulseApplied,normal:t.contactOnA.normal};if(this.onCollisionObservable.notifyObservers(a),this._bodyCollisionObservable.size){const e=this._bodyCollisionObservable.get(t.contactOnA.bodyId),i=this._bodyCollisionObservable.get(t.contactOnB.bodyId);e?e.notifyObservers(a):i&&(a.collider=r.body,a.colliderIndex=r.index,a.collidedAgainst=s.body,a.collidedAgainstIndex=s.index,a.normal=t.contactOnB.normal,i.notifyObservers(a))}e=this._hknp.HP_World_GetNextCollisionEvent(i,e)}}get numBodies(){return this._hknp.HP_World_GetNumBodies(this.world)[1]}dispose(){this._hknp.HP_QueryCollector_Release(this._queryCollector),this._queryCollector=BigInt(0),this._hknp.HP_World_Release(this.world),this.world=void 0}_v3ToBvecRef(e,t){t.set(e[0],e[1],e[2])}_bVecToV3(e){return[e._x,e._y,e._z]}_bQuatToV4(e){return[e._x,e._y,e._z,e._w]}_constraintMotorTypeToNative(e){switch(e){case y_.POSITION:return this._hknp.ConstraintMotorType.POSITION;case y_.VELOCITY:return this._hknp.ConstraintMotorType.VELOCITY}return this._hknp.ConstraintMotorType.NONE}_nativeToMotorType(e){switch(e){case this._hknp.ConstraintMotorType.POSITION:return y_.POSITION;case this._hknp.ConstraintMotorType.VELOCITY:return y_.VELOCITY}return y_.NONE}_materialCombineToNative(e){switch(e){case b_.GEOMETRIC_MEAN:return this._hknp.MaterialCombine.GEOMETRIC_MEAN;case b_.MINIMUM:return this._hknp.MaterialCombine.MINIMUM;case b_.MAXIMUM:return this._hknp.MaterialCombine.MAXIMUM;case b_.ARITHMETIC_MEAN:return this._hknp.MaterialCombine.ARITHMETIC_MEAN;case b_.MULTIPLY:return this._hknp.MaterialCombine.MULTIPLY}}_constraintAxisToNative(e){switch(e){case m_.LINEAR_X:return this._hknp.ConstraintAxis.LINEAR_X;case m_.LINEAR_Y:return this._hknp.ConstraintAxis.LINEAR_Y;case m_.LINEAR_Z:return this._hknp.ConstraintAxis.LINEAR_Z;case m_.ANGULAR_X:return this._hknp.ConstraintAxis.ANGULAR_X;case m_.ANGULAR_Y:return this._hknp.ConstraintAxis.ANGULAR_Y;case m_.ANGULAR_Z:return this._hknp.ConstraintAxis.ANGULAR_Z;case m_.LINEAR_DISTANCE:return this._hknp.ConstraintAxis.LINEAR_DISTANCE}}_nativeToLimitMode(e){switch(e){case this._hknp.ConstraintAxisLimitMode.FREE:return __.FREE;case this._hknp.ConstraintAxisLimitMode.LIMITED:return __.LIMITED;case this._hknp.ConstraintAxisLimitMode.LOCKED:return __.LOCKED}return __.FREE}_limitModeToNative(e){switch(e){case __.FREE:return this._hknp.ConstraintAxisLimitMode.FREE;case __.LIMITED:return this._hknp.ConstraintAxisLimitMode.LIMITED;case __.LOCKED:return this._hknp.ConstraintAxisLimitMode.LOCKED}}}k.x.prototype.getPhysicsEngine=function(){return this._physicsEngine},k.x.prototype.enablePhysics=function(e=null,t){if(this._physicsEngine)return!0;let i=this._getComponent(ve.l.NAME_PHYSICSENGINE);i||(i=new $_(this),this._addComponent(i));try{if(t&&1!==(null==t?void 0:t.getPluginVersion())){if(2!==(null==t?void 0:t.getPluginVersion()))throw new Error("Unsupported Physics plugin version.");this._physicsEngine=new C_(e,t)}else this._physicsEngine=new Lh.T(e,t);return this._physicsTimeAccumulator=0,!0}catch(e){return _.Y.Error(e.message),!1}},k.x.prototype.disablePhysicsEngine=function(){this._physicsEngine&&(this._physicsEngine.dispose(),this._physicsEngine=null)},k.x.prototype.isPhysicsEnabled=function(){return void 0!==this._physicsEngine},k.x.prototype.deleteCompoundImpostor=function(e){const t=e.parts[0].mesh;t.physicsImpostor&&(t.physicsImpostor.dispose(),t.physicsImpostor=null)},k.x.prototype._advancePhysicsEngineStep=function(e){if(this._physicsEngine){const t=this._physicsEngine.getSubTimeStep();if(t>0)for(this._physicsTimeAccumulator+=e;this._physicsTimeAccumulator>t;)this.onBeforePhysicsObservable.notifyObservers(this),this._physicsEngine._step(t/1e3),this.onAfterPhysicsObservable.notifyObservers(this),this._physicsTimeAccumulator-=t;else this.onBeforePhysicsObservable.notifyObservers(this),this._physicsEngine._step(e/1e3),this.onAfterPhysicsObservable.notifyObservers(this)}};class $_{constructor(e){this.name=ve.l.NAME_PHYSICSENGINE,this.scene=e,this.scene.onBeforePhysicsObservable=new r.y$,this.scene.onAfterPhysicsObservable=new r.y$,this.scene.getDeterministicFrameTime=()=>this.scene._physicsEngine?1e3*this.scene._physicsEngine.getTimeStep():1e3/60}register(){}rebuild(){}dispose(){this.scene.onBeforePhysicsObservable.clear(),this.scene.onAfterPhysicsObservable.clear(),this.scene._physicsEngine&&this.scene.disablePhysicsEngine()}}Object.defineProperty(yi.Y.prototype,"physicsBody",{get:function(){return this._physicsBody},set:function(e){this._physicsBody!==e&&(this._disposePhysicsObserver&&this.onDisposeObservable.remove(this._disposePhysicsObserver),this._physicsBody=e,e&&(this._disposePhysicsObserver=this.onDisposeObservable.add((()=>{this.physicsBody&&(this.physicsBody.dispose(),this.physicsBody=null)}))))},enumerable:!0,configurable:!0}),yi.Y.prototype.getPhysicsBody=function(){return this.physicsBody},yi.Y.prototype.applyImpulse=function(e,t){if(!this.physicsBody)throw new Error("No Physics Body for TransformNode");return this.physicsBody.applyImpulse(e,t),this};class Q_{static GetContactPointToRef(e,t,i,n,s){const r=e.getScene().getPhysicsEngine(),o=null==r?void 0:r.getPluginVersion();if(1===o){const s=new Yt.z(t,i).intersectsMesh(e);if(s.hit&&s.pickedPoint)return n.copyFrom(s.pickedPoint),!0}else if(2===o)return e.physicsBody.getObjectCenterWorldToRef(n,s),!0;return!1}static HasAppliedForces(e,t){var i,n,s;return e.getMotionType(t)===x_.STATIC||0===(null!==(n=null===(i=e.getMassProperties(t))||void 0===i?void 0:i.mass)&&void 0!==n?n:0)||0===(null===(s=e.transformNode)||void 0===s?void 0:s.getTotalVertices())}static IsInsideCylinder(e,t,i,n){const s=o.jp.Vector3[0];return e.subtractToRef(t,s),Math.abs(s.x)<=i&&Math.abs(s.z)<=i&&s.y>=0&&s.y<=n}}class Z_{constructor(e){this._hitData={force:new o.P,contactPoint:new o.P,distanceFromOrigin:0},this._scene=e,this._physicsEngine=this._scene.getPhysicsEngine(),this._physicsEngine||_.Y.Warn("Physics engine not enabled. Please enable the physics before you can use the methods.")}applyRadialExplosionImpulse(e,t,i,n){if(!this._physicsEngine)return _.Y.Warn("Physics engine not enabled. Please enable the physics before you call this method."),null;if(1===this._physicsEngine.getPluginVersion()&&0===this._physicsEngine.getImpostors().length)return null;if(2===this._physicsEngine.getPluginVersion()&&0===this._physicsEngine.getBodies().length)return null;let s=!1;if("number"==typeof t){const e=t;(t=new nm).radius=e,t.strength=null!=i?i:t.strength,t.falloff=null!=n?n:t.falloff}else s=!(!t.affectedImpostorsCallback&&!t.affectedBodiesCallback);const r=new J_(this._scene,t),o=this._hitData;if(1===this._physicsEngine.getPluginVersion()){const t=Array();this._physicsEngine.getImpostors().forEach((i=>{r.getImpostorHitData(i,e,o)&&(i.applyImpulse(o.force,o.contactPoint),s&&t.push({impostor:i,hitData:this._copyPhysicsHitData(o)}))})),r.triggerAffectedImpostorsCallback(t)}else this._applicationForBodies(r,e,o,s,((e,t)=>{e.applyImpulse(t.force,t.contactPoint,t.instanceIndex)}));return r.dispose(!1),r}applyRadialExplosionForce(e,t,i,n){if(!this._physicsEngine)return _.Y.Warn("Physics engine not enabled. Please enable the physics before you call the PhysicsHelper."),null;if(1===this._physicsEngine.getPluginVersion()&&0===this._physicsEngine.getImpostors().length)return null;if(2===this._physicsEngine.getPluginVersion()&&0===this._physicsEngine.getBodies().length)return null;let s=!1;if("number"==typeof t){const e=t;(t=new nm).radius=e,t.strength=null!=i?i:t.strength,t.falloff=null!=n?n:t.falloff}else s=!(!t.affectedImpostorsCallback&&!t.affectedBodiesCallback);const r=new J_(this._scene,t),o=this._hitData;if(1===this._physicsEngine.getPluginVersion()){const t=Array();this._physicsEngine.getImpostors().forEach((i=>{r.getImpostorHitData(i,e,o)&&(i.applyForce(o.force,o.contactPoint),s&&t.push({impostor:i,hitData:this._copyPhysicsHitData(o)}))})),r.triggerAffectedImpostorsCallback(t)}else this._applicationForBodies(r,e,o,s,((e,t)=>{e.applyForce(t.force,t.contactPoint,t.instanceIndex)}));return r.dispose(!1),r}_applicationForBodies(e,t,i,n,s){const r=Array(),o=this._physicsEngine.getBodies();for(const a of o)a.iterateOverAllInstances(((o,a)=>{e.getBodyHitData(o,t,i,a)&&(s(o,i),n&&r.push({body:o,hitData:this._copyPhysicsHitData(i)}))}));e.triggerAffectedBodiesCallback(r)}gravitationalField(e,t,i,n){if(!this._physicsEngine)return _.Y.Warn("Physics engine not enabled. Please enable the physics before you call the PhysicsHelper."),null;if(1===this._physicsEngine.getPluginVersion()&&0===this._physicsEngine.getImpostors().length)return null;if(2===this._physicsEngine.getPluginVersion()&&0===this._physicsEngine.getBodies().length)return null;if("number"==typeof t){const e=t;(t=new nm).radius=e,t.strength=null!=i?i:t.strength,t.falloff=null!=n?n:t.falloff}const s=new em(this,this._scene,e,t);return s.dispose(!1),s}updraft(e,t,i,n,s){if(!this._physicsEngine)return _.Y.Warn("Physics engine not enabled. Please enable the physics before you call the PhysicsHelper."),null;if(1===this._physicsEngine.getPluginVersion()&&0===this._physicsEngine.getImpostors().length)return null;if(2===this._physicsEngine.getPluginVersion()&&0===this._physicsEngine.getBodies().length)return null;if("number"==typeof t){const e=t;(t=new sm).radius=e,t.strength=null!=i?i:t.strength,t.height=null!=n?n:t.height,t.updraftMode=null!=s?s:t.updraftMode}const r=new tm(this._scene,e,t);return r.dispose(!1),r}vortex(e,t,i,n){if(!this._physicsEngine)return _.Y.Warn("Physics engine not enabled. Please enable the physics before you call the PhysicsHelper."),null;if(1===this._physicsEngine.getPluginVersion()&&0===this._physicsEngine.getImpostors().length)return null;if(2===this._physicsEngine.getPluginVersion()&&0===this._physicsEngine.getBodies().length)return null;if("number"==typeof t){const e=t;(t=new rm).radius=e,t.strength=null!=i?i:t.strength,t.height=null!=n?n:t.height}const s=new im(this._scene,e,t);return s.dispose(!1),s}_copyPhysicsHitData(e){return{force:e.force.clone(),contactPoint:e.contactPoint.clone(),distanceFromOrigin:e.distanceFromOrigin,instanceIndex:e.instanceIndex}}}class J_{constructor(e,t){this._scene=e,this._options=t,this._dataFetched=!1,this._options={...new nm,...this._options}}getData(){return this._dataFetched=!0,{sphere:this._sphere}}_getHitData(e,t,i,n){const s=o.jp.Vector3[0];s.copyFrom(t).subtractInPlace(i);const r=o.jp.Vector3[1];if(!Q_.GetContactPointToRef(e,i,s,r,n.instanceIndex))return!1;const a=o.P.Distance(i,r);if(a>this._options.radius)return!1;const l=this._options.falloff===T_.Constant?this._options.strength:this._options.strength*(1-a/this._options.radius);return s.scaleInPlace(l),n.force.copyFrom(s),n.contactPoint.copyFrom(r),n.distanceFromOrigin=a,!0}getBodyHitData(e,t,i,n){if(Q_.HasAppliedForces(e,n))return!1;const s=e.transformNode,r=e.getObjectCenterWorld(n);return i.instanceIndex=n,this._getHitData(s,r,t,i)}getImpostorHitData(e,t,i){if(0===e.mass)return!1;if("Mesh"!==e.object.getClassName()&&"InstancedMesh"!==e.object.getClassName())return!1;const n=e.object;if(!this._intersectsWithSphere(n,t,this._options.radius))return!1;const s=e.getObjectCenter();return this._getHitData(n,s,t,i),!0}triggerAffectedImpostorsCallback(e){this._options.affectedImpostorsCallback&&this._options.affectedImpostorsCallback(e)}triggerAffectedBodiesCallback(e){this._options.affectedBodiesCallback&&this._options.affectedBodiesCallback(e)}dispose(e=!0){this._sphere&&(e?this._sphere.dispose():setTimeout((()=>{this._dataFetched||this._sphere.dispose()}),0))}_prepareSphere(){this._sphere||(this._sphere=Kn("radialExplosionEventSphere",this._options.sphere,this._scene),this._sphere.isVisible=!1)}_intersectsWithSphere(e,t,i){return this._prepareSphere(),this._sphere.position=t,this._sphere.scaling.setAll(2*i),this._sphere._updateBoundingInfo(),this._sphere.computeWorldMatrix(!0),this._sphere.intersectsMesh(e,!0)}}class em{constructor(e,t,i,n){this._physicsHelper=e,this._scene=t,this._origin=i,this._options=n,this._dataFetched=!1,this._options={...new nm,...this._options},this._tickCallback=this._tick.bind(this),this._options.strength=-1*this._options.strength}getData(){return this._dataFetched=!0,{sphere:this._sphere}}enable(){this._tickCallback.call(this),this._scene.registerBeforeRender(this._tickCallback)}disable(){this._scene.unregisterBeforeRender(this._tickCallback)}dispose(e=!0){this._sphere&&(e?this._sphere.dispose():setTimeout((()=>{this._dataFetched||this._sphere.dispose()}),0))}_tick(){var e;if(this._sphere)this._physicsHelper.applyRadialExplosionForce(this._origin,this._options);else{const t=this._physicsHelper.applyRadialExplosionForce(this._origin,this._options);t&&(this._sphere=null===(e=t.getData().sphere)||void 0===e?void 0:e.clone("radialExplosionEventSphereClone"))}}}class tm{constructor(e,t,i){this._scene=e,this._origin=t,this._options=i,this._originTop=o.P.Zero(),this._originDirection=o.P.Zero(),this._cylinderPosition=o.P.Zero(),this._dataFetched=!1,this._physicsEngine=this._scene.getPhysicsEngine(),this._options={...new sm,...this._options},this._origin.addToRef(new o.P(0,this._options.height/2,0),this._cylinderPosition),this._origin.addToRef(new o.P(0,this._options.height,0),this._originTop),this._options.updraftMode===S_.Perpendicular&&(this._originDirection=this._origin.subtract(this._originTop).normalize()),this._tickCallback=this._tick.bind(this),1===this._physicsEngine.getPluginVersion()&&this._prepareCylinder()}getData(){return this._dataFetched=!0,{cylinder:this._cylinder}}enable(){this._tickCallback.call(this),this._scene.registerBeforeRender(this._tickCallback)}disable(){this._scene.unregisterBeforeRender(this._tickCallback)}dispose(e=!0){this._cylinder&&(e?(this._cylinder.dispose(),this._cylinder=void 0):setTimeout((()=>{!this._dataFetched&&this._cylinder&&(this._cylinder.dispose(),this._cylinder=void 0)}),0))}_getHitData(e,t){let i;i=this._options.updraftMode===S_.Perpendicular?this._originDirection:e.subtract(this._originTop);const n=o.P.Distance(this._origin,e),s=-1*this._options.strength,r=i.multiplyByFloats(s,s,s);t.force.copyFrom(r),t.contactPoint.copyFrom(e),t.distanceFromOrigin=n}_getBodyHitData(e,t,i){if(Q_.HasAppliedForces(e))return!1;const n=e.getObjectCenterWorld(i);return!!Q_.IsInsideCylinder(n,this._origin,this._options.radius,this._options.height)&&(t.instanceIndex=i,this._getHitData(n,t),!0)}_getImpostorHitData(e,t){if(0===e.mass)return!1;const i=e.object;if(!this._intersectsWithCylinder(i))return!1;const n=e.getObjectCenter();return this._getHitData(n,t),!0}_tick(){const e=tm._HitData;1===this._physicsEngine.getPluginVersion()?this._physicsEngine.getImpostors().forEach((t=>{this._getImpostorHitData(t,e)&&t.applyForce(e.force,e.contactPoint)})):this._physicsEngine.getBodies().forEach((t=>{t.iterateOverAllInstances(((t,i)=>{this._getBodyHitData(t,e,i)&&t.applyForce(e.force,e.contactPoint,e.instanceIndex)}))}))}_prepareCylinder(){this._cylinder||(this._cylinder=an("updraftEventCylinder",{height:this._options.height,diameter:2*this._options.radius},this._scene),this._cylinder.isVisible=!1)}_intersectsWithCylinder(e){return!!this._cylinder&&(this._cylinder.position=this._cylinderPosition,this._cylinder.intersectsMesh(e,!0))}}tm._HitData={force:new o.P,contactPoint:new o.P,distanceFromOrigin:0};class im{constructor(e,t,i){this._scene=e,this._origin=t,this._options=i,this._originTop=o.P.Zero(),this._cylinderPosition=o.P.Zero(),this._dataFetched=!1,this._physicsEngine=this._scene.getPhysicsEngine(),this._options={...new rm,...this._options},this._origin.addToRef(new o.P(0,this._options.height/2,0),this._cylinderPosition),this._origin.addToRef(new o.P(0,this._options.height,0),this._originTop),this._tickCallback=this._tick.bind(this),1===this._physicsEngine.getPluginVersion()&&this._prepareCylinder()}getData(){return this._dataFetched=!0,{cylinder:this._cylinder}}enable(){this._tickCallback.call(this),this._scene.registerBeforeRender(this._tickCallback)}disable(){this._scene.unregisterBeforeRender(this._tickCallback)}dispose(e=!0){this._cylinder&&(e?this._cylinder.dispose():setTimeout((()=>{this._dataFetched||this._cylinder.dispose()}),0))}_getHitData(e,t,i){const n=im.originOnPlane;n.set(this._origin.x,t.y,this._origin.z);const s=o.jp.Vector3[0];t.subtractToRef(n,s);const r=o.jp.Vector3[1];if(!Q_.GetContactPointToRef(e,n,s,r,i.instanceIndex))return!1;const a=o.P.Distance(r,n)/this._options.radius,l=o.jp.Vector3[2];let h,c,u;if(r.normalizeToRef(l),a>this._options.centripetalForceThreshold&&l.negateInPlace(),a>this._options.centripetalForceThreshold)h=l.x*this._options.centripetalForceMultiplier,c=l.y*this._options.updraftForceMultiplier,u=l.z*this._options.centripetalForceMultiplier;else{const e=o.P.Cross(n,t).normalize();h=(e.x+l.x)*this._options.centrifugalForceMultiplier,c=this._originTop.y*this._options.updraftForceMultiplier,u=(e.z+l.z)*this._options.centrifugalForceMultiplier}const d=o.jp.Vector3[3];return d.set(h,c,u),d.scaleInPlace(this._options.strength),i.force.copyFrom(d),i.contactPoint.copyFrom(t),i.distanceFromOrigin=a,!0}_getBodyHitData(e,t,i){if(Q_.HasAppliedForces(e,i))return!1;const n=e.transformNode,s=e.getObjectCenterWorld(i);return!!Q_.IsInsideCylinder(s,this._origin,this._options.radius,this._options.height)&&(t.instanceIndex=i,this._getHitData(n,s,t))}_getImpostorHitData(e,t){if(0===e.mass)return!1;if("Mesh"!==e.object.getClassName()&&"InstancedMesh"!==e.object.getClassName())return!1;const i=e.object;if(!this._intersectsWithCylinder(i))return!1;const n=e.getObjectCenter();return this._getHitData(i,n,t),!0}_tick(){const e=im.hitData;1===this._physicsEngine.getPluginVersion()?this._physicsEngine.getImpostors().forEach((t=>{this._getImpostorHitData(t,e)&&t.applyForce(e.force,e.contactPoint)})):this._physicsEngine.getBodies().forEach((t=>{t.iterateOverAllInstances(((t,i)=>{this._getBodyHitData(t,e,i)&&t.applyForce(e.force,e.contactPoint,e.instanceIndex)}))}))}_prepareCylinder(){this._cylinder||(this._cylinder=an("vortexEventCylinder",{height:this._options.height,diameter:2*this._options.radius},this._scene),this._cylinder.isVisible=!1)}_intersectsWithCylinder(e){return this._cylinder.position=this._cylinderPosition,this._cylinder.intersectsMesh(e,!0)}}im.originOnPlane=o.P.Zero(),im.hitData={force:new o.P,contactPoint:new o.P,distanceFromOrigin:0};class nm{constructor(){this.radius=5,this.strength=10,this.falloff=T_.Constant,this.sphere={segments:32,diameter:1}}}class sm{constructor(){this.radius=5,this.strength=10,this.height=10,this.updraftMode=S_.Center}}class rm{constructor(){this.radius=5,this.strength=10,this.height=10,this.centripetalForceThreshold=.7,this.centripetalForceMultiplier=5,this.centrifugalForceMultiplier=.5,this.updraftForceMultiplier=.02}}!function(e){e[e.Constant=0]="Constant",e[e.Linear=1]="Linear"}(T_||(T_={})),function(e){e[e.Center=0]="Center",e[e.Perpendicular=1]="Perpendicular"}(S_||(S_={}));si.v.ShadersStore.blackAndWhitePixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform float degree;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) \n{\nvec3 color=texture2D(textureSampler,vUV).rgb;\nfloat luminance=dot(color,vec3(0.3,0.59,0.11)); \nvec3 blackAndWhite=vec3(luminance,luminance,luminance);\ngl_FragColor=vec4(color-((color-blackAndWhite)*degree),1.0);\n}";class om extends ni.D{getClassName(){return"BlackAndWhitePostProcess"}constructor(e,t,i,n,s,r){super(e,"blackAndWhite",["degree"],null,t,i,n,s,r),this.degree=1,this.onApplyObservable.add((e=>{e.setFloat("degree",this.degree)}))}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new om(e.name,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.reusable)),e,i,n)}}(0,be.gn)([(0,Te.qC)()],om.prototype,"degree",void 0),(0,l.H)("BABYLON.BlackAndWhitePostProcess",om);class am{constructor(e,t,i,n){this._name=t,this._singleInstance=n||!0,this._getPostProcesses=i,this._cameras={},this._indicesForCamera={},this._postProcesses={}}get isSupported(){for(const e in this._postProcesses)if(Object.prototype.hasOwnProperty.call(this._postProcesses,e)){const t=this._postProcesses[e];for(let e=0;e<t.length;e++)if(!t[e].isSupported)return!1}return!0}_update(){}_attachCameras(e){let t;const i=de.w1.MakeArray(e||this._cameras);if(i)for(let e=0;e<i.length;e++){const n=i[e];if(!n)continue;const s=n.name;if(t=this._singleInstance?0:s,!this._postProcesses[t]){const e=this._getPostProcesses();e&&(this._postProcesses[t]=Array.isArray(e)?e:[e])}this._indicesForCamera[s]||(this._indicesForCamera[s]=[]),this._postProcesses[t].forEach((e=>{const t=n.attachPostProcess(e);this._indicesForCamera[s].push(t)})),this._cameras[s]||(this._cameras[s]=n)}}_detachCameras(e){const t=de.w1.MakeArray(e||this._cameras);if(t)for(let e=0;e<t.length;e++){const i=t[e],n=i.name,s=this._postProcesses[this._singleInstance?0:n];s&&s.forEach((e=>{i.detachPostProcess(e)})),this._cameras[n]&&(this._cameras[n]=null)}}_enable(e){const t=de.w1.MakeArray(e||this._cameras);if(t)for(let e=0;e<t.length;e++){const i=t[e],n=i.name;for(let s=0;s<this._indicesForCamera[n].length;s++)void 0!==i._postProcesses[this._indicesForCamera[n][s]]&&null!==i._postProcesses[this._indicesForCamera[n][s]]||this._postProcesses[this._singleInstance?0:n].forEach((i=>{t[e].attachPostProcess(i,this._indicesForCamera[n][s])}))}}_disable(e){const t=de.w1.MakeArray(e||this._cameras);if(t)for(let e=0;e<t.length;e++){const i=t[e],n=i.name;this._postProcesses[this._singleInstance?0:n].forEach((e=>{i.detachPostProcess(e)}))}}getPostProcesses(e){return this._singleInstance?this._postProcesses[0]:e?this._postProcesses[e.name]:null}}si.v.ShadersStore.extractHighlightsPixelShader="#include<helperFunctions>\nvarying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform float threshold;\nuniform float exposure;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) \n{\ngl_FragColor=texture2D(textureSampler,vUV);\nfloat luma=dot(LuminanceEncodeApprox,gl_FragColor.rgb*exposure);\ngl_FragColor.rgb=step(threshold,luma)*gl_FragColor.rgb;\n}";class lm extends ni.D{getClassName(){return"ExtractHighlightsPostProcess"}constructor(e,t,i,n,s,r,o=0,a=!1){super(e,"extractHighlights",["threshold","exposure"],null,t,i,n,s,r,null,o,void 0,null,a),this.threshold=.9,this._exposure=1,this._inputPostProcess=null,this.onApplyObservable.add((e=>{this.externalTextureSamplerBinding=!!this._inputPostProcess,this._inputPostProcess&&e.setTextureFromPostProcess("textureSampler",this._inputPostProcess),e.setFloat("threshold",Math.pow(this.threshold,Me.zp)),e.setFloat("exposure",this._exposure)}))}}(0,be.gn)([(0,Te.qC)()],lm.prototype,"threshold",void 0),(0,l.H)("BABYLON.ExtractHighlightsPostProcess",lm);si.v.ShadersStore.bloomMergePixelShader="uniform sampler2D textureSampler;\nuniform sampler2D bloomBlur;\nvarying vec2 vUV;\nuniform float bloomWeight;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\ngl_FragColor=texture2D(textureSampler,vUV);\nvec3 blurred=texture2D(bloomBlur,vUV).rgb;\ngl_FragColor.rgb=gl_FragColor.rgb+(blurred.rgb*bloomWeight); \n}\n";class hm extends ni.D{getClassName(){return"BloomMergePostProcess"}constructor(e,t,i,n,s,r,o,a,l,h=0,c=!1){super(e,"bloomMerge",["bloomWeight"],["bloomBlur"],s,r,o,a,l,null,h,void 0,null,!0),this.weight=1,this.weight=n,this.externalTextureSamplerBinding=!0,this.onApplyObservable.add((e=>{e.setTextureFromPostProcess("textureSampler",t),e.setTextureFromPostProcessOutput("bloomBlur",i),e.setFloat("bloomWeight",this.weight)})),c||this.updateEffect()}}(0,be.gn)([(0,Te.qC)()],hm.prototype,"weight",void 0),(0,l.H)("BABYLON.BloomMergePostProcess",hm);class cm extends am{get threshold(){return this._downscale.threshold}set threshold(e){this._downscale.threshold=e}get weight(){return this._merge.weight}set weight(e){this._merge.weight=e}get kernel(){return this._blurX.kernel/this._bloomScale}set kernel(e){this._blurX.kernel=e*this._bloomScale,this._blurY.kernel=e*this._bloomScale}constructor(e,t,i,n,s=0,r=!1){super(e.getEngine(),"bloom",(()=>this._effects),!0),this._bloomScale=t,this._effects=[],this._downscale=new lm("highlights",1,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,s,r),this._blurX=new wa("horizontal blur",new o.FM(1,0),10,t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,s,void 0,r),this._blurX.alwaysForcePOT=!0,this._blurX.autoClear=!1,this._blurY=new wa("vertical blur",new o.FM(0,1),10,t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,s,void 0,r),this._blurY.alwaysForcePOT=!0,this._blurY.autoClear=!1,this.kernel=n,this._effects=[this._downscale,this._blurX,this._blurY],this._merge=new hm("bloomMerge",this._downscale,this._blurY,i,t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,s,r),this._merge.autoClear=!1,this._effects.push(this._merge)}disposeEffects(e){for(let t=0;t<this._effects.length;t++)this._effects[t].dispose(e)}_updateEffects(){for(let e=0;e<this._effects.length;e++)this._effects[e].updateEffect()}_isReady(){for(let e=0;e<this._effects.length;e++)if(!this._effects[e].isReady())return!1;return!0}}si.v.ShadersStore.chromaticAberrationPixelShader="uniform sampler2D textureSampler; \nuniform float chromatic_aberration;\nuniform float radialIntensity;\nuniform vec2 direction;\nuniform vec2 centerPosition;\nuniform float screen_width;\nuniform float screen_height;\nvarying vec2 vUV;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nvec2 centered_screen_pos=vec2(vUV.x-centerPosition.x,vUV.y-centerPosition.y);\nvec2 directionOfEffect=direction;\nif(directionOfEffect.x==0. && directionOfEffect.y==0.){\ndirectionOfEffect=normalize(centered_screen_pos);\n}\nfloat radius2=centered_screen_pos.x*centered_screen_pos.x\n+ centered_screen_pos.y*centered_screen_pos.y;\nfloat radius=sqrt(radius2);\nvec4 original=texture2D(textureSampler,vUV);\nvec3 ref_indices=vec3(-0.3,0.0,0.3);\nfloat ref_shiftX=chromatic_aberration*pow(radius,radialIntensity)*directionOfEffect.x/screen_width;\nfloat ref_shiftY=chromatic_aberration*pow(radius,radialIntensity)*directionOfEffect.y/screen_height;\nvec2 ref_coords_r=vec2(vUV.x+ref_indices.r*ref_shiftX,vUV.y+ref_indices.r*ref_shiftY*0.5);\nvec2 ref_coords_g=vec2(vUV.x+ref_indices.g*ref_shiftX,vUV.y+ref_indices.g*ref_shiftY*0.5);\nvec2 ref_coords_b=vec2(vUV.x+ref_indices.b*ref_shiftX,vUV.y+ref_indices.b*ref_shiftY*0.5);\noriginal.r=texture2D(textureSampler,ref_coords_r).r;\noriginal.g=texture2D(textureSampler,ref_coords_g).g;\noriginal.b=texture2D(textureSampler,ref_coords_b).b;\noriginal.a=clamp(texture2D(textureSampler,ref_coords_r).a+texture2D(textureSampler,ref_coords_g).a+texture2D(textureSampler,ref_coords_b).a,0.,1.);\ngl_FragColor=original;\n}";class um extends ni.D{getClassName(){return"ChromaticAberrationPostProcess"}constructor(e,t,i,n,s,r,a,l,h=0,c=!1){super(e,"chromaticAberration",["chromatic_aberration","screen_width","screen_height","direction","radialIntensity","centerPosition"],[],n,s,r,a,l,null,h,void 0,null,c),this.aberrationAmount=30,this.radialIntensity=0,this.direction=new o.FM(.707,.707),this.centerPosition=new o.FM(.5,.5),this.screenWidth=t,this.screenHeight=i,this.onApplyObservable.add((e=>{e.setFloat("chromatic_aberration",this.aberrationAmount),e.setFloat("screen_width",t),e.setFloat("screen_height",i),e.setFloat("radialIntensity",this.radialIntensity),e.setFloat2("direction",this.direction.x,this.direction.y),e.setFloat2("centerPosition",this.centerPosition.x,this.centerPosition.y)}))}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new um(e.name,e.screenWidth,e.screenHeight,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.reusable,e.textureType,!1)),e,i,n)}}(0,be.gn)([(0,Te.qC)()],um.prototype,"aberrationAmount",void 0),(0,be.gn)([(0,Te.qC)()],um.prototype,"radialIntensity",void 0),(0,be.gn)([(0,Te.qC)()],um.prototype,"direction",void 0),(0,be.gn)([(0,Te.qC)()],um.prototype,"centerPosition",void 0),(0,be.gn)([(0,Te.qC)()],um.prototype,"screenWidth",void 0),(0,be.gn)([(0,Te.qC)()],um.prototype,"screenHeight",void 0),(0,l.H)("BABYLON.ChromaticAberrationPostProcess",um);si.v.ShadersStore.circleOfConfusionPixelShader="uniform sampler2D depthSampler;\nvarying vec2 vUV;\nuniform vec2 cameraMinMaxZ;\nuniform float focusDistance;\nuniform float cocPrecalculation;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nfloat depth=texture2D(depthSampler,vUV).r;\n#define CUSTOM_COC_DEPTH\nfloat pixelDistance=(cameraMinMaxZ.x+cameraMinMaxZ.y*depth)*1000.0; \n#define CUSTOM_COC_PIXELDISTANCE\nfloat coc=abs(cocPrecalculation*((focusDistance-pixelDistance)/pixelDistance));\ncoc=clamp(coc,0.0,1.0);\ngl_FragColor=vec4(coc,coc,coc,1.0);\n}\n";class dm extends ni.D{getClassName(){return"CircleOfConfusionPostProcess"}constructor(e,t,i,n,s,r,o,a=0,l=!1){super(e,"circleOfConfusion",["cameraMinMaxZ","focusDistance","cocPrecalculation"],["depthSampler"],i,n,s,r,o,null,a,void 0,null,l),this.lensSize=50,this.fStop=1.4,this.focusDistance=2e3,this.focalLength=50,this._depthTexture=null,this._depthTexture=t,this.onApplyObservable.add((e=>{if(!this._depthTexture)return void _.Y.Warn("No depth texture set on CircleOfConfusionPostProcess");e.setTexture("depthSampler",this._depthTexture);const t=this.lensSize/this.fStop*this.focalLength/(this.focusDistance-this.focalLength);e.setFloat("focusDistance",this.focusDistance),e.setFloat("cocPrecalculation",t);const i=this._depthTexture.activeCamera;e.setFloat2("cameraMinMaxZ",i.minZ,i.maxZ-i.minZ)}))}set depthTexture(e){this._depthTexture=e}}(0,be.gn)([(0,Te.qC)()],dm.prototype,"lensSize",void 0),(0,be.gn)([(0,Te.qC)()],dm.prototype,"fStop",void 0),(0,be.gn)([(0,Te.qC)()],dm.prototype,"focusDistance",void 0),(0,be.gn)([(0,Te.qC)()],dm.prototype,"focalLength",void 0),(0,l.H)("BABYLON.CircleOfConfusionPostProcess",dm);si.v.ShadersStore.colorCorrectionPixelShader="uniform sampler2D textureSampler; \nuniform sampler2D colorTable; \nvarying vec2 vUV;\nconst float SLICE_COUNT=16.0; \nvec4 sampleAs3DTexture(sampler2D textureSampler,vec3 uv,float width) {\nfloat sliceSize=1.0/width; \nfloat slicePixelSize=sliceSize/width; \nfloat sliceInnerSize=slicePixelSize*(width-1.0); \nfloat zSlice0=min(floor(uv.z*width),width-1.0);\nfloat zSlice1=min(zSlice0+1.0,width-1.0);\nfloat xOffset=slicePixelSize*0.5+uv.x*sliceInnerSize;\nfloat s0=xOffset+(zSlice0*sliceSize);\nfloat s1=xOffset+(zSlice1*sliceSize);\nvec4 slice0Color=texture2D(textureSampler,vec2(s0,uv.y));\nvec4 slice1Color=texture2D(textureSampler,vec2(s1,uv.y));\nfloat zOffset=mod(uv.z*width,1.0);\nvec4 result=mix(slice0Color,slice1Color,zOffset);\nreturn result;\n}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nvec4 screen_color=texture2D(textureSampler,vUV);\ngl_FragColor=sampleAs3DTexture(colorTable,screen_color.rgb,SLICE_COUNT);\n}";class pm extends ni.D{getClassName(){return"ColorCorrectionPostProcess"}constructor(e,t,i,n,s,r,o){super(e,"colorCorrection",null,["colorTable"],i,n,s,r,o);const a=(null==n?void 0:n.getScene())||null;this._colorTableTexture=new Ce.x(t,a,!0,!1,Ce.x.TRILINEAR_SAMPLINGMODE),this._colorTableTexture.anisotropicFilteringLevel=1,this._colorTableTexture.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._colorTableTexture.wrapV=Ce.x.CLAMP_ADDRESSMODE,this.colorTableUrl=t,this.onApply=e=>{e.setTexture("colorTable",this._colorTableTexture)}}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new pm(e.name,e.colorTableUrl,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.reusable)),e,i,n)}}(0,be.gn)([(0,Te.qC)()],pm.prototype,"colorTableUrl",void 0),(0,l.H)("BABYLON.ColorCorrectionPostProcess",pm);si.v.ShadersStore.convolutionPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform vec2 screenSize;\nuniform float kernel[9];\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nvec2 onePixel=vec2(1.0,1.0)/screenSize;\nvec4 colorSum =\ntexture2D(textureSampler,vUV+onePixel*vec2(-1,-1))*kernel[0] +\ntexture2D(textureSampler,vUV+onePixel*vec2(0,-1))*kernel[1] +\ntexture2D(textureSampler,vUV+onePixel*vec2(1,-1))*kernel[2] +\ntexture2D(textureSampler,vUV+onePixel*vec2(-1,0))*kernel[3] +\ntexture2D(textureSampler,vUV+onePixel*vec2(0,0))*kernel[4] +\ntexture2D(textureSampler,vUV+onePixel*vec2(1,0))*kernel[5] +\ntexture2D(textureSampler,vUV+onePixel*vec2(-1,1))*kernel[6] +\ntexture2D(textureSampler,vUV+onePixel*vec2(0,1))*kernel[7] +\ntexture2D(textureSampler,vUV+onePixel*vec2(1,1))*kernel[8];\nfloat kernelWeight =\nkernel[0] +\nkernel[1] +\nkernel[2] +\nkernel[3] +\nkernel[4] +\nkernel[5] +\nkernel[6] +\nkernel[7] +\nkernel[8];\nif (kernelWeight<=0.0) {\nkernelWeight=1.0;\n}\ngl_FragColor=vec4((colorSum/kernelWeight).rgb,1);\n}";class fm extends ni.D{getClassName(){return"ConvolutionPostProcess"}constructor(e,t,i,n,s,r,o,a=0){super(e,"convolution",["kernel","screenSize"],null,i,n,s,r,o,null,a),this.kernel=t,this.onApply=e=>{e.setFloat2("screenSize",this.width,this.height),e.setArray("kernel",this.kernel)}}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new fm(e.name,e.kernel,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.reusable,e.textureType)),e,i,n)}}fm.EdgeDetect0Kernel=[1,0,-1,0,0,0,-1,0,1],fm.EdgeDetect1Kernel=[0,1,0,1,-4,1,0,1,0],fm.EdgeDetect2Kernel=[-1,-1,-1,-1,8,-1,-1,-1,-1],fm.SharpenKernel=[0,-1,0,-1,5,-1,0,-1,0],fm.EmbossKernel=[-2,-1,0,-1,1,1,0,1,2],fm.GaussianKernel=[0,1,0,1,1,1,0,1,0],(0,be.gn)([(0,Te.qC)()],fm.prototype,"kernel",void 0),(0,l.H)("BABYLON.ConvolutionPostProcess",fm);class _m extends wa{getClassName(){return"DepthOfFieldBlurPostProcess"}constructor(e,t,i,n,s,r,o,a=null,l=Ce.x.BILINEAR_SAMPLINGMODE,h,c,u=0,d=!1,p=5){super(e,i,n,s,r,2,h,c,u,"#define DOF 1\r\n",d,p),this.direction=i,this.externalTextureSamplerBinding=!!a,this.onApplyObservable.add((e=>{null!=a&&e.setTextureFromPostProcess("textureSampler",a),e.setTextureFromPostProcessOutput("circleOfConfusionSampler",o)}))}}(0,be.gn)([(0,Te.qC)()],_m.prototype,"direction",void 0),(0,l.H)("BABYLON.DepthOfFieldBlurPostProcess",_m);si.v.ShadersStore.depthOfFieldMergePixelShader="#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\n#define TEXTUREFUNC(s,c,lod) texture2DLodEXT(s,c,lod)\n#else\n#define TEXTUREFUNC(s,c,bias) texture2D(s,c,bias)\n#endif\nuniform sampler2D textureSampler;\nvarying vec2 vUV;\nuniform sampler2D circleOfConfusionSampler;\nuniform sampler2D blurStep0;\n#if BLUR_LEVEL>0\nuniform sampler2D blurStep1;\n#endif\n#if BLUR_LEVEL>1\nuniform sampler2D blurStep2;\n#endif\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nfloat coc=TEXTUREFUNC(circleOfConfusionSampler,vUV,0.0).r;\n#if BLUR_LEVEL==0\nvec4 original=TEXTUREFUNC(textureSampler,vUV,0.0);\nvec4 blurred0=TEXTUREFUNC(blurStep0,vUV,0.0);\ngl_FragColor=mix(original,blurred0,coc);\n#endif\n#if BLUR_LEVEL==1\nif(coc<0.5){\nvec4 original=TEXTUREFUNC(textureSampler,vUV,0.0);\nvec4 blurred1=TEXTUREFUNC(blurStep1,vUV,0.0);\ngl_FragColor=mix(original,blurred1,coc/0.5);\n}else{\nvec4 blurred0=TEXTUREFUNC(blurStep0,vUV,0.0);\nvec4 blurred1=TEXTUREFUNC(blurStep1,vUV,0.0);\ngl_FragColor=mix(blurred1,blurred0,(coc-0.5)/0.5);\n}\n#endif\n#if BLUR_LEVEL==2\nif(coc<0.33){\nvec4 original=TEXTUREFUNC(textureSampler,vUV,0.0);\nvec4 blurred2=TEXTUREFUNC(blurStep2,vUV,0.0);\ngl_FragColor=mix(original,blurred2,coc/0.33);\n}else if(coc<0.66){\nvec4 blurred1=TEXTUREFUNC(blurStep1,vUV,0.0);\nvec4 blurred2=TEXTUREFUNC(blurStep2,vUV,0.0);\ngl_FragColor=mix(blurred2,blurred1,(coc-0.33)/0.33);\n}else{\nvec4 blurred0=TEXTUREFUNC(blurStep0,vUV,0.0);\nvec4 blurred1=TEXTUREFUNC(blurStep1,vUV,0.0);\ngl_FragColor=mix(blurred1,blurred0,(coc-0.66)/0.34);\n}\n#endif\n}\n";class mm extends ni.D{getClassName(){return"DepthOfFieldMergePostProcess"}constructor(e,t,i,n,s,r,o,a,l,h=0,c=!1){super(e,"depthOfFieldMerge",[],["circleOfConfusionSampler","blurStep0","blurStep1","blurStep2"],s,r,o,a,l,null,h,void 0,null,!0),this._blurSteps=n,this.externalTextureSamplerBinding=!0,this.onApplyObservable.add((e=>{e.setTextureFromPostProcess("textureSampler",t),e.setTextureFromPostProcessOutput("circleOfConfusionSampler",i),n.forEach(((t,i)=>{e.setTextureFromPostProcessOutput("blurStep"+(n.length-i-1),t)}))})),c||this.updateEffect()}updateEffect(e=null,t=null,i=null,n,s,r){e||(e="",e+="#define BLUR_LEVEL "+(this._blurSteps.length-1)+"\n"),super.updateEffect(e,t,i,n,s,r)}}var gm;!function(e){e[e.Low=0]="Low",e[e.Medium=1]="Medium",e[e.High=2]="High"}(gm||(gm={}));class vm extends am{set focalLength(e){this._circleOfConfusion.focalLength=e}get focalLength(){return this._circleOfConfusion.focalLength}set fStop(e){this._circleOfConfusion.fStop=e}get fStop(){return this._circleOfConfusion.fStop}set focusDistance(e){this._circleOfConfusion.focusDistance=e}get focusDistance(){return this._circleOfConfusion.focusDistance}set lensSize(e){this._circleOfConfusion.lensSize=e}get lensSize(){return this._circleOfConfusion.lensSize}constructor(e,t,i=gm.Low,n=0,s=!1){super(e.getEngine(),"depth of field",(()=>this._effects),!0),this._effects=[];const r=e.getEngine(),a=r.isWebGPU||r.webGLVersion>1?6:5;this._circleOfConfusion=new dm("circleOfConfusion",t,1,null,Ce.x.BILINEAR_SAMPLINGMODE,r,!1,n,s),this._depthOfFieldBlurY=[],this._depthOfFieldBlurX=[];let l=1,h=15;switch(i){case gm.High:l=3,h=51;break;case gm.Medium:l=2,h=31;break;default:h=15,l=1}const c=h/Math.pow(2,l-1);let u=1;for(let t=0;t<l;t++){const i=new _m("vertical blur",e,new o.FM(0,1),c,u,null,this._circleOfConfusion,0==t?this._circleOfConfusion:null,Ce.x.BILINEAR_SAMPLINGMODE,r,!1,n,s,0==t?a:5);i.autoClear=!1,u=.75/Math.pow(2,t);const l=new _m("horizontal blur",e,new o.FM(1,0),c,u,null,this._circleOfConfusion,null,Ce.x.BILINEAR_SAMPLINGMODE,r,!1,n,s);l.autoClear=!1,this._depthOfFieldBlurY.push(i),this._depthOfFieldBlurX.push(l)}this._effects=[this._circleOfConfusion];for(let e=0;e<this._depthOfFieldBlurX.length;e++)this._effects.push(this._depthOfFieldBlurY[e]),this._effects.push(this._depthOfFieldBlurX[e]);this._dofMerge=new mm("dofMerge",this._circleOfConfusion,this._circleOfConfusion,this._depthOfFieldBlurX,u,null,Ce.x.BILINEAR_SAMPLINGMODE,r,!1,n,s),this._dofMerge.autoClear=!1,this._effects.push(this._dofMerge)}getClassName(){return"DepthOfFieldEffect"}set depthTexture(e){this._circleOfConfusion.depthTexture=e}disposeEffects(e){for(let t=0;t<this._effects.length;t++)this._effects[t].dispose(e)}_updateEffects(){for(let e=0;e<this._effects.length;e++)this._effects[e].updateEffect()}_isReady(){for(let e=0;e<this._effects.length;e++)if(!this._effects[e].isReady())return!1;return!0}}si.v.ShadersStore.displayPassPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform sampler2D passSampler;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\ngl_FragColor=texture2D(passSampler,vUV);\n}";class ym extends ni.D{getClassName(){return"DisplayPassPostProcess"}constructor(e,t,i,n,s,r){super(e,"displayPass",["passSampler"],["passSampler"],t,i,n,s,r)}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new ym(e.name,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.reusable)),e,i,n)}}(0,l.H)("BABYLON.DisplayPassPostProcess",ym);si.v.ShadersStore.filterPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform mat4 kernelMatrix;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nvec3 baseColor=texture2D(textureSampler,vUV).rgb;\nvec3 updatedColor=(kernelMatrix*vec4(baseColor,1.0)).rgb;\ngl_FragColor=vec4(updatedColor,1.0);\n}";class xm extends ni.D{getClassName(){return"FilterPostProcess"}constructor(e,t,i,n,s,r,o){super(e,"filter",["kernelMatrix"],null,i,n,s,r,o),this.kernelMatrix=t,this.onApply=e=>{e.setMatrix("kernelMatrix",this.kernelMatrix)}}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new xm(e.name,e.kernelMatrix,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.reusable)),e,i,n)}}(0,be.gn)([(0,Te.oQ)()],xm.prototype,"kernelMatrix",void 0),(0,l.H)("BABYLON.FilterPostProcess",xm);si.v.ShadersStore.fxaaPixelShader="#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\n#define TEXTUREFUNC(s,c,l) texture2DLodEXT(s,c,l)\n#else\n#define TEXTUREFUNC(s,c,b) texture2D(s,c,b)\n#endif\nuniform sampler2D textureSampler;\nuniform vec2 texelSize;\nvarying vec2 vUV;\nvarying vec2 sampleCoordS;\nvarying vec2 sampleCoordE;\nvarying vec2 sampleCoordN;\nvarying vec2 sampleCoordW;\nvarying vec2 sampleCoordNW;\nvarying vec2 sampleCoordSE;\nvarying vec2 sampleCoordNE;\nvarying vec2 sampleCoordSW;\nconst float fxaaQualitySubpix=1.0;\nconst float fxaaQualityEdgeThreshold=0.166;\nconst float fxaaQualityEdgeThresholdMin=0.0833;\nconst vec3 kLumaCoefficients=vec3(0.2126,0.7152,0.0722);\n#define FxaaLuma(rgba) dot(rgba.rgb,kLumaCoefficients)\nvoid main(){\nvec2 posM;\nposM.x=vUV.x;\nposM.y=vUV.y;\nvec4 rgbyM=TEXTUREFUNC(textureSampler,vUV,0.0);\nfloat lumaM=FxaaLuma(rgbyM);\nfloat lumaS=FxaaLuma(TEXTUREFUNC(textureSampler,sampleCoordS,0.0));\nfloat lumaE=FxaaLuma(TEXTUREFUNC(textureSampler,sampleCoordE,0.0));\nfloat lumaN=FxaaLuma(TEXTUREFUNC(textureSampler,sampleCoordN,0.0));\nfloat lumaW=FxaaLuma(TEXTUREFUNC(textureSampler,sampleCoordW,0.0));\nfloat maxSM=max(lumaS,lumaM);\nfloat minSM=min(lumaS,lumaM);\nfloat maxESM=max(lumaE,maxSM);\nfloat minESM=min(lumaE,minSM);\nfloat maxWN=max(lumaN,lumaW);\nfloat minWN=min(lumaN,lumaW);\nfloat rangeMax=max(maxWN,maxESM);\nfloat rangeMin=min(minWN,minESM);\nfloat rangeMaxScaled=rangeMax*fxaaQualityEdgeThreshold;\nfloat range=rangeMax-rangeMin;\nfloat rangeMaxClamped=max(fxaaQualityEdgeThresholdMin,rangeMaxScaled);\n#ifndef MALI\nif(range<rangeMaxClamped) \n{\ngl_FragColor=rgbyM;\nreturn;\n}\n#endif\nfloat lumaNW=FxaaLuma(TEXTUREFUNC(textureSampler,sampleCoordNW,0.0));\nfloat lumaSE=FxaaLuma(TEXTUREFUNC(textureSampler,sampleCoordSE,0.0));\nfloat lumaNE=FxaaLuma(TEXTUREFUNC(textureSampler,sampleCoordNE,0.0));\nfloat lumaSW=FxaaLuma(TEXTUREFUNC(textureSampler,sampleCoordSW,0.0));\nfloat lumaNS=lumaN+lumaS;\nfloat lumaWE=lumaW+lumaE;\nfloat subpixRcpRange=1.0/range;\nfloat subpixNSWE=lumaNS+lumaWE;\nfloat edgeHorz1=(-2.0*lumaM)+lumaNS;\nfloat edgeVert1=(-2.0*lumaM)+lumaWE;\nfloat lumaNESE=lumaNE+lumaSE;\nfloat lumaNWNE=lumaNW+lumaNE;\nfloat edgeHorz2=(-2.0*lumaE)+lumaNESE;\nfloat edgeVert2=(-2.0*lumaN)+lumaNWNE;\nfloat lumaNWSW=lumaNW+lumaSW;\nfloat lumaSWSE=lumaSW+lumaSE;\nfloat edgeHorz4=(abs(edgeHorz1)*2.0)+abs(edgeHorz2);\nfloat edgeVert4=(abs(edgeVert1)*2.0)+abs(edgeVert2);\nfloat edgeHorz3=(-2.0*lumaW)+lumaNWSW;\nfloat edgeVert3=(-2.0*lumaS)+lumaSWSE;\nfloat edgeHorz=abs(edgeHorz3)+edgeHorz4;\nfloat edgeVert=abs(edgeVert3)+edgeVert4;\nfloat subpixNWSWNESE=lumaNWSW+lumaNESE;\nfloat lengthSign=texelSize.x;\nbool horzSpan=edgeHorz>=edgeVert;\nfloat subpixA=subpixNSWE*2.0+subpixNWSWNESE;\nif (!horzSpan)\n{\nlumaN=lumaW;\n}\nif (!horzSpan) \n{\nlumaS=lumaE;\n}\nif (horzSpan) \n{\nlengthSign=texelSize.y;\n}\nfloat subpixB=(subpixA*(1.0/12.0))-lumaM;\nfloat gradientN=lumaN-lumaM;\nfloat gradientS=lumaS-lumaM;\nfloat lumaNN=lumaN+lumaM;\nfloat lumaSS=lumaS+lumaM;\nbool pairN=abs(gradientN)>=abs(gradientS);\nfloat gradient=max(abs(gradientN),abs(gradientS));\nif (pairN)\n{\nlengthSign=-lengthSign;\n}\nfloat subpixC=clamp(abs(subpixB)*subpixRcpRange,0.0,1.0);\nvec2 posB;\nposB.x=posM.x;\nposB.y=posM.y;\nvec2 offNP;\noffNP.x=(!horzSpan) ? 0.0 : texelSize.x;\noffNP.y=(horzSpan) ? 0.0 : texelSize.y;\nif (!horzSpan) \n{\nposB.x+=lengthSign*0.5;\n}\nif (horzSpan)\n{\nposB.y+=lengthSign*0.5;\n}\nvec2 posN;\nposN.x=posB.x-offNP.x*1.5;\nposN.y=posB.y-offNP.y*1.5;\nvec2 posP;\nposP.x=posB.x+offNP.x*1.5;\nposP.y=posB.y+offNP.y*1.5;\nfloat subpixD=((-2.0)*subpixC)+3.0;\nfloat lumaEndN=FxaaLuma(TEXTUREFUNC(textureSampler,posN,0.0));\nfloat subpixE=subpixC*subpixC;\nfloat lumaEndP=FxaaLuma(TEXTUREFUNC(textureSampler,posP,0.0));\nif (!pairN) \n{\nlumaNN=lumaSS;\n}\nfloat gradientScaled=gradient*1.0/4.0;\nfloat lumaMM=lumaM-lumaNN*0.5;\nfloat subpixF=subpixD*subpixE;\nbool lumaMLTZero=lumaMM<0.0;\nlumaEndN-=lumaNN*0.5;\nlumaEndP-=lumaNN*0.5;\nbool doneN=abs(lumaEndN)>=gradientScaled;\nbool doneP=abs(lumaEndP)>=gradientScaled;\nif (!doneN) \n{\nposN.x-=offNP.x*3.0;\n}\nif (!doneN) \n{\nposN.y-=offNP.y*3.0;\n}\nbool doneNP=(!doneN) || (!doneP);\nif (!doneP) \n{\nposP.x+=offNP.x*3.0;\n}\nif (!doneP)\n{\nposP.y+=offNP.y*3.0;\n}\nif (doneNP)\n{\nif (!doneN) lumaEndN=FxaaLuma(TEXTUREFUNC(textureSampler,posN.xy,0.0));\nif (!doneP) lumaEndP=FxaaLuma(TEXTUREFUNC(textureSampler,posP.xy,0.0));\nif (!doneN) lumaEndN=lumaEndN-lumaNN*0.5;\nif (!doneP) lumaEndP=lumaEndP-lumaNN*0.5;\ndoneN=abs(lumaEndN)>=gradientScaled;\ndoneP=abs(lumaEndP)>=gradientScaled;\nif (!doneN) posN.x-=offNP.x*12.0;\nif (!doneN) posN.y-=offNP.y*12.0;\ndoneNP=(!doneN) || (!doneP);\nif (!doneP) posP.x+=offNP.x*12.0;\nif (!doneP) posP.y+=offNP.y*12.0;\n}\nfloat dstN=posM.x-posN.x;\nfloat dstP=posP.x-posM.x;\nif (!horzSpan)\n{\ndstN=posM.y-posN.y;\n}\nif (!horzSpan) \n{\ndstP=posP.y-posM.y;\n}\nbool goodSpanN=(lumaEndN<0.0) != lumaMLTZero;\nfloat spanLength=(dstP+dstN);\nbool goodSpanP=(lumaEndP<0.0) != lumaMLTZero;\nfloat spanLengthRcp=1.0/spanLength;\nbool directionN=dstN<dstP;\nfloat dst=min(dstN,dstP);\nbool goodSpan=directionN ? goodSpanN : goodSpanP;\nfloat subpixG=subpixF*subpixF;\nfloat pixelOffset=(dst*(-spanLengthRcp))+0.5;\nfloat subpixH=subpixG*fxaaQualitySubpix;\nfloat pixelOffsetGood=goodSpan ? pixelOffset : 0.0;\nfloat pixelOffsetSubpix=max(pixelOffsetGood,subpixH);\nif (!horzSpan)\n{\nposM.x+=pixelOffsetSubpix*lengthSign;\n}\nif (horzSpan)\n{\nposM.y+=pixelOffsetSubpix*lengthSign;\n}\n#ifdef MALI\nif(range<rangeMaxClamped) \n{\ngl_FragColor=rgbyM;\n}\nelse\n{\ngl_FragColor=TEXTUREFUNC(textureSampler,posM,0.0);\n}\n#else\ngl_FragColor=TEXTUREFUNC(textureSampler,posM,0.0);\n#endif\n}";si.v.ShadersStore.fxaaVertexShader="attribute vec2 position;\nuniform vec2 texelSize;\nvarying vec2 vUV;\nvarying vec2 sampleCoordS;\nvarying vec2 sampleCoordE;\nvarying vec2 sampleCoordN;\nvarying vec2 sampleCoordW;\nvarying vec2 sampleCoordNW;\nvarying vec2 sampleCoordSE;\nvarying vec2 sampleCoordNE;\nvarying vec2 sampleCoordSW;\nconst vec2 madd=vec2(0.5,0.5);\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nvUV=(position*madd+madd);\nsampleCoordS=vUV+vec2( 0.0,1.0)*texelSize;\nsampleCoordE=vUV+vec2( 1.0,0.0)*texelSize;\nsampleCoordN=vUV+vec2( 0.0,-1.0)*texelSize;\nsampleCoordW=vUV+vec2(-1.0,0.0)*texelSize;\nsampleCoordNW=vUV+vec2(-1.0,-1.0)*texelSize;\nsampleCoordSE=vUV+vec2( 1.0,1.0)*texelSize;\nsampleCoordNE=vUV+vec2( 1.0,-1.0)*texelSize;\nsampleCoordSW=vUV+vec2(-1.0,1.0)*texelSize;\ngl_Position=vec4(position,0.0,1.0);\n#define CUSTOM_VERTEX_MAIN_END\n}";class bm extends ni.D{getClassName(){return"FxaaPostProcess"}constructor(e,t,i=null,n,s,r,o=0){super(e,"fxaa",["texelSize"],null,t,i,n||Ce.x.BILINEAR_SAMPLINGMODE,s,r,null,o,"fxaa",void 0,!0);const a=this._getDefines();this.updateEffect(a),this.onApplyObservable.add((e=>{const t=this.texelSize;e.setFloat2("texelSize",t.x,t.y)}))}_getDefines(){const e=this.getEngine();if(!e)return null;const t=e.getGlInfo();return t&&t.renderer&&t.renderer.toLowerCase().indexOf("mali")>-1?"#define MALI 1\n":null}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new bm(e.name,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.reusable)),e,i,n)}}(0,l.H)("BABYLON.FxaaPostProcess",bm);si.v.ShadersStore.grainPixelShader="#include<helperFunctions>\nuniform sampler2D textureSampler; \nuniform float intensity;\nuniform float animatedSeed;\nvarying vec2 vUV;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\ngl_FragColor=texture2D(textureSampler,vUV);\nvec2 seed=vUV*(animatedSeed);\nfloat grain=dither(seed,intensity);\nfloat lum=getLuminance(gl_FragColor.rgb);\nfloat grainAmount=(cos(-PI+(lum*PI*2.))+1.)/2.;\ngl_FragColor.rgb+=grain*grainAmount;\ngl_FragColor.rgb=max(gl_FragColor.rgb,0.0);\n}";class Tm extends ni.D{getClassName(){return"GrainPostProcess"}constructor(e,t,i,n,s,r,o=0,a=!1){super(e,"grain",["intensity","animatedSeed"],[],t,i,n,s,r,null,o,void 0,null,a),this.intensity=30,this.animated=!1,this.onApplyObservable.add((e=>{e.setFloat("intensity",this.intensity),e.setFloat("animatedSeed",this.animated?Math.random()+1:1)}))}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new Tm(e.name,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.reusable)),e,i,n)}}(0,be.gn)([(0,Te.qC)()],Tm.prototype,"intensity",void 0),(0,be.gn)([(0,Te.qC)()],Tm.prototype,"animated",void 0),(0,l.H)("BABYLON.GrainPostProcess",Tm);si.v.ShadersStore.highlightsPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nconst vec3 RGBLuminanceCoefficients=vec3(0.2126,0.7152,0.0722);\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) \n{\nvec4 tex=texture2D(textureSampler,vUV);\nvec3 c=tex.rgb;\nfloat luma=dot(c.rgb,RGBLuminanceCoefficients);\ngl_FragColor=vec4(pow(c,vec3(25.0-luma*15.0)),tex.a); \n}";class Sm extends ni.D{getClassName(){return"HighlightsPostProcess"}constructor(e,t,i,n,s,r,o=0){super(e,"highlights",null,null,t,i,n,s,r,null,o)}}si.v.IncludesShadersStore.mrtFragmentDeclaration="#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\nlayout(location=0) out vec4 glFragData[{X}];\n#endif\n";si.v.ShadersStore.geometryPixelShader="#extension GL_EXT_draw_buffers : require\n#if defined(BUMP) || !defined(NORMAL)\n#extension GL_OES_standard_derivatives : enable\n#endif\nprecision highp float;\n#ifdef BUMP\nvarying mat4 vWorldView;\nvarying vec3 vNormalW;\n#else\nvarying vec3 vNormalV;\n#endif\nvarying vec4 vViewPos;\n#if defined(POSITION) || defined(BUMP)\nvarying vec3 vPositionW;\n#endif\n#ifdef VELOCITY\nvarying vec4 vCurrentPosition;\nvarying vec4 vPreviousPosition;\n#endif\n#ifdef NEED_UV\nvarying vec2 vUV;\n#endif\n#ifdef BUMP\nuniform vec3 vBumpInfos;\nuniform vec2 vTangentSpaceParams;\n#endif\n#if defined(REFLECTIVITY)\n#if defined(ORMTEXTURE) || defined(SPECULARGLOSSINESSTEXTURE) || defined(REFLECTIVITYTEXTURE)\nuniform sampler2D reflectivitySampler;\nvarying vec2 vReflectivityUV;\n#endif\n#ifdef ALBEDOTEXTURE\nvarying vec2 vAlbedoUV;\nuniform sampler2D albedoSampler;\n#endif\n#ifdef REFLECTIVITYCOLOR\nuniform vec3 reflectivityColor;\n#endif\n#ifdef ALBEDOCOLOR\nuniform vec3 albedoColor;\n#endif\n#ifdef METALLIC\nuniform float metallic;\n#endif\n#if defined(ROUGHNESS) || defined(GLOSSINESS)\nuniform float glossiness;\n#endif\n#endif\n#if defined(ALPHATEST) && defined(NEED_UV)\nuniform sampler2D diffuseSampler;\n#endif\n#include<clipPlaneFragmentDeclaration>\n#include<mrtFragmentDeclaration>[RENDER_TARGET_COUNT]\n#include<bumpFragmentMainFunctions>\n#include<bumpFragmentFunctions>\n#include<helperFunctions>\nvoid main() {\n#include<clipPlaneFragment>\n#ifdef ALPHATEST\nif (texture2D(diffuseSampler,vUV).a<0.4)\ndiscard;\n#endif\nvec3 normalOutput;\n#ifdef BUMP\nvec3 normalW=normalize(vNormalW);\n#include<bumpFragment>\nnormalOutput=normalize(vec3(vWorldView*vec4(normalW,0.0)));\n#else\nnormalOutput=normalize(vNormalV);\n#endif\n#ifdef PREPASS\n#ifdef PREPASS_DEPTH\ngl_FragData[DEPTH_INDEX]=vec4(vViewPos.z/vViewPos.w,0.0,0.0,1.0);\n#endif\n#ifdef PREPASS_NORMAL\ngl_FragData[NORMAL_INDEX]=vec4(normalOutput,1.0);\n#endif\n#else\ngl_FragData[0]=vec4(vViewPos.z/vViewPos.w,0.0,0.0,1.0);\ngl_FragData[1]=vec4(normalOutput,1.0);\n#endif\n#ifdef POSITION\ngl_FragData[POSITION_INDEX]=vec4(vPositionW,1.0);\n#endif\n#ifdef VELOCITY\nvec2 a=(vCurrentPosition.xy/vCurrentPosition.w)*0.5+0.5;\nvec2 b=(vPreviousPosition.xy/vPreviousPosition.w)*0.5+0.5;\nvec2 velocity=abs(a-b);\nvelocity=vec2(pow(velocity.x,1.0/3.0),pow(velocity.y,1.0/3.0))*sign(a-b)*0.5+0.5;\ngl_FragData[VELOCITY_INDEX]=vec4(velocity,0.0,1.0);\n#endif\n#ifdef REFLECTIVITY\nvec4 reflectivity=vec4(0.0,0.0,0.0,1.0);\n#ifdef METALLICWORKFLOW\nfloat metal=1.0;\nfloat roughness=1.0;\n#ifdef ORMTEXTURE\nmetal*=texture2D(reflectivitySampler,vReflectivityUV).b;\nroughness*=texture2D(reflectivitySampler,vReflectivityUV).g;\n#endif\n#ifdef METALLIC\nmetal*=metallic;\n#endif\n#ifdef ROUGHNESS\nroughness*=(1.0-glossiness); \n#endif\nreflectivity.a-=roughness;\nvec3 color=vec3(1.0);\n#ifdef ALBEDOTEXTURE\ncolor=texture2D(albedoSampler,vAlbedoUV).rgb;\n#ifdef GAMMAALBEDO\ncolor=toLinearSpace(color);\n#endif\n#endif\n#ifdef ALBEDOCOLOR\ncolor*=albedoColor.xyz;\n#endif\nreflectivity.rgb=mix(vec3(0.04),color,metal);\n#else\n#if defined(SPECULARGLOSSINESSTEXTURE) || defined(REFLECTIVITYTEXTURE)\nreflectivity=texture2D(reflectivitySampler,vReflectivityUV);\n#ifdef GAMMAREFLECTIVITYTEXTURE\nreflectivity.rgb=toLinearSpace(reflectivity.rgb);\n#endif\n#else \n#ifdef REFLECTIVITYCOLOR\nreflectivity.rgb=toLinearSpace(reflectivityColor.xyz);\nreflectivity.a=1.0;\n#endif\n#endif\n#ifdef GLOSSINESSS\nreflectivity.a*=glossiness; \n#endif\n#endif\ngl_FragData[REFLECTIVITY_INDEX]=reflectivity;\n#endif\n}\n";si.v.IncludesShadersStore.geometryVertexDeclaration="uniform mat4 viewProjection;\nuniform mat4 view;";si.v.IncludesShadersStore.geometryUboDeclaration="#include<sceneUboDeclaration>\n",i(6255);si.v.ShadersStore.geometryVertexShader="precision highp float;\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<morphTargetsVertexGlobalDeclaration>\n#include<morphTargetsVertexDeclaration>[0..maxSimultaneousMorphTargets]\n#include<instancesDeclaration>\n#include<__decl__geometryVertex>\n#include<clipPlaneVertexDeclaration>\nattribute vec3 position;\nattribute vec3 normal;\n#ifdef NEED_UV\nvarying vec2 vUV;\n#ifdef ALPHATEST\nuniform mat4 diffuseMatrix;\n#endif\n#ifdef BUMP\nuniform mat4 bumpMatrix;\nvarying vec2 vBumpUV;\n#endif\n#ifdef REFLECTIVITY\nuniform mat4 reflectivityMatrix;\nuniform mat4 albedoMatrix;\nvarying vec2 vReflectivityUV;\nvarying vec2 vAlbedoUV;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#endif\n#ifdef BUMP\nvarying mat4 vWorldView;\n#endif\n#ifdef BUMP\nvarying vec3 vNormalW;\n#else\nvarying vec3 vNormalV;\n#endif\nvarying vec4 vViewPos;\n#if defined(POSITION) || defined(BUMP)\nvarying vec3 vPositionW;\n#endif\n#ifdef VELOCITY\nuniform mat4 previousViewProjection;\nvarying vec4 vCurrentPosition;\nvarying vec4 vPreviousPosition;\n#endif\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void)\n{\nvec3 positionUpdated=position;\nvec3 normalUpdated=normal;\n#ifdef UV1\nvec2 uvUpdated=uv;\n#endif\n#include<morphTargetsVertexGlobal>\n#include<morphTargetsVertex>[0..maxSimultaneousMorphTargets]\n#include<instancesVertex>\n#if defined(VELOCITY) && !defined(BONES_VELOCITY_ENABLED)\nvCurrentPosition=viewProjection*finalWorld*vec4(positionUpdated,1.0);\nvPreviousPosition=previousViewProjection*finalPreviousWorld*vec4(positionUpdated,1.0);\n#endif\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=vec4(finalWorld*vec4(positionUpdated,1.0));\n#ifdef BUMP\nvWorldView=view*finalWorld;\nvNormalW=normalUpdated;\n#else\nvNormalV=normalize(vec3((view*finalWorld)*vec4(normalUpdated,0.0)));\n#endif\nvViewPos=view*worldPos;\n#if defined(VELOCITY) && defined(BONES_VELOCITY_ENABLED)\nvCurrentPosition=viewProjection*finalWorld*vec4(positionUpdated,1.0);\n#if NUM_BONE_INFLUENCERS>0\nmat4 previousInfluence;\npreviousInfluence=mPreviousBones[int(matricesIndices[0])]*matricesWeights[0];\n#if NUM_BONE_INFLUENCERS>1\npreviousInfluence+=mPreviousBones[int(matricesIndices[1])]*matricesWeights[1];\n#endif\n#if NUM_BONE_INFLUENCERS>2\npreviousInfluence+=mPreviousBones[int(matricesIndices[2])]*matricesWeights[2];\n#endif\n#if NUM_BONE_INFLUENCERS>3\npreviousInfluence+=mPreviousBones[int(matricesIndices[3])]*matricesWeights[3];\n#endif\n#if NUM_BONE_INFLUENCERS>4\npreviousInfluence+=mPreviousBones[int(matricesIndicesExtra[0])]*matricesWeightsExtra[0];\n#endif\n#if NUM_BONE_INFLUENCERS>5\npreviousInfluence+=mPreviousBones[int(matricesIndicesExtra[1])]*matricesWeightsExtra[1];\n#endif\n#if NUM_BONE_INFLUENCERS>6\npreviousInfluence+=mPreviousBones[int(matricesIndicesExtra[2])]*matricesWeightsExtra[2];\n#endif\n#if NUM_BONE_INFLUENCERS>7\npreviousInfluence+=mPreviousBones[int(matricesIndicesExtra[3])]*matricesWeightsExtra[3];\n#endif\nvPreviousPosition=previousViewProjection*finalPreviousWorld*previousInfluence*vec4(positionUpdated,1.0);\n#else\nvPreviousPosition=previousViewProjection*finalPreviousWorld*vec4(positionUpdated,1.0);\n#endif\n#endif\n#if defined(POSITION) || defined(BUMP)\nvPositionW=worldPos.xyz/worldPos.w;\n#endif\ngl_Position=viewProjection*finalWorld*vec4(positionUpdated,1.0);\n#include<clipPlaneVertex>\n#ifdef NEED_UV\n#ifdef UV1\n#if defined(ALPHATEST) && defined(ALPHATEST_UV1)\nvUV=vec2(diffuseMatrix*vec4(uvUpdated,1.0,0.0));\n#else\nvUV=uv;\n#endif\n#ifdef BUMP_UV1\nvBumpUV=vec2(bumpMatrix*vec4(uvUpdated,1.0,0.0));\n#endif\n#ifdef REFLECTIVITY_UV1\nvReflectivityUV=vec2(reflectivityMatrix*vec4(uvUpdated,1.0,0.0));\n#endif\n#ifdef ALBEDO_UV1\nvAlbedoUV=vec2(albedoMatrix*vec4(uvUpdated,1.0,0.0));\n#endif\n#endif\n#ifdef UV2\n#if defined(ALPHATEST) && defined(ALPHATEST_UV2)\nvUV=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));\n#else\nvUV=uv2;\n#endif\n#ifdef BUMP_UV2\nvBumpUV=vec2(bumpMatrix*vec4(uv2,1.0,0.0));\n#endif\n#ifdef REFLECTIVITY_UV2\nvReflectivityUV=vec2(reflectivityMatrix*vec4(uv2,1.0,0.0));\n#endif\n#ifdef ALBEDO_UV2\nvAlbedoUV=vec2(albedoMatrix*vec4(uv2,1.0,0.0));\n#endif\n#endif\n#endif\n#include<bumpVertex>\n}\n";const Em=["world","mBones","viewProjection","diffuseMatrix","view","previousWorld","previousViewProjection","mPreviousBones","bumpMatrix","reflectivityMatrix","albedoMatrix","reflectivityColor","albedoColor","metallic","glossiness","vTangentSpaceParams","vBumpInfos","morphTargetInfluences","morphTargetTextureInfo","morphTargetTextureIndices"];(0,Ga.qx)(Em);class Cm{_linkPrePassRenderer(e){this._linkedWithPrePass=!0,this._prePassRenderer=e,this._multiRenderTarget&&(this._multiRenderTarget.onClearObservable.clear(),this._multiRenderTarget.onClearObservable.add((()=>{})))}_unlinkPrePassRenderer(){this._linkedWithPrePass=!1,this._createRenderTargets()}_resetLayout(){this._enablePosition=!1,this._enableReflectivity=!1,this._enableVelocity=!1,this._attachmentsFromPrePass=[]}_forceTextureType(e,t){e===Cm.POSITION_TEXTURE_TYPE?(this._positionIndex=t,this._enablePosition=!0):e===Cm.VELOCITY_TEXTURE_TYPE?(this._velocityIndex=t,this._enableVelocity=!0):e===Cm.REFLECTIVITY_TEXTURE_TYPE?(this._reflectivityIndex=t,this._enableReflectivity=!0):e===Cm.DEPTH_TEXTURE_TYPE?this._depthIndex=t:e===Cm.NORMAL_TEXTURE_TYPE&&(this._normalIndex=t)}_setAttachments(e){this._attachmentsFromPrePass=e}_linkInternalTexture(e){this._multiRenderTarget.setInternalTexture(e,0,!1)}get renderList(){return this._multiRenderTarget.renderList}set renderList(e){this._multiRenderTarget.renderList=e}get isSupported(){return this._multiRenderTarget.isSupported}getTextureIndex(e){switch(e){case Cm.POSITION_TEXTURE_TYPE:return this._positionIndex;case Cm.VELOCITY_TEXTURE_TYPE:return this._velocityIndex;case Cm.REFLECTIVITY_TEXTURE_TYPE:return this._reflectivityIndex;default:return-1}}get enablePosition(){return this._enablePosition}set enablePosition(e){this._enablePosition=e,this._linkedWithPrePass||(this.dispose(),this._createRenderTargets())}get enableVelocity(){return this._enableVelocity}set enableVelocity(e){this._enableVelocity=e,e||(this._previousTransformationMatrices={}),this._linkedWithPrePass||(this.dispose(),this._createRenderTargets()),this._scene.needsPreviousWorldMatrices=e}get enableReflectivity(){return this._enableReflectivity}set enableReflectivity(e){this._enableReflectivity=e,this._linkedWithPrePass||(this.dispose(),this._createRenderTargets())}get scene(){return this._scene}get ratio(){return this._ratio}constructor(e,t=1,i=15){this._previousTransformationMatrices={},this._previousBonesTransformationMatrices={},this.excludedSkinnedMeshesFromVelocity=[],this.renderTransparentMeshes=!0,this._resizeObserver=null,this._enablePosition=!1,this._enableVelocity=!1,this._enableReflectivity=!1,this._clearColor=new a.HE(0,0,0,0),this._clearDepthColor=new a.HE(1e8,0,0,1),this._positionIndex=-1,this._velocityIndex=-1,this._reflectivityIndex=-1,this._depthIndex=-1,this._normalIndex=-1,this._linkedWithPrePass=!1,this.useSpecificClearForDepthTexture=!1,this._scene=e,this._ratio=t,this._useUbo=e.getEngine().supportsUniformBuffers,this._depthFormat=i,Cm._SceneComponentInitialization(this._scene),this._createRenderTargets()}isReady(e,t){const i=e.getMaterial();if(i&&i.disableDepthWrite)return!1;const n=[],s=[qe.o.PositionKind,qe.o.NormalKind],r=e.getMesh();if(i){let e=!1;if(i.needAlphaTesting()&&i.getAlphaTestTexture()&&(n.push("#define ALPHATEST"),n.push(`#define ALPHATEST_UV${i.getAlphaTestTexture().coordinatesIndex+1}`),e=!0),i.bumpTexture&&Va.k.BumpTextureEnabled&&(n.push("#define BUMP"),n.push(`#define BUMP_UV${i.bumpTexture.coordinatesIndex+1}`),e=!0),this._enableReflectivity){let t=!1;"PBRMetallicRoughnessMaterial"===i.getClassName()?(null!==i.metallicRoughnessTexture&&(n.push("#define ORMTEXTURE"),n.push(`#define REFLECTIVITY_UV${i.metallicRoughnessTexture.coordinatesIndex+1}`),n.push("#define METALLICWORKFLOW"),e=!0,t=!0),null!==i.metallic&&(n.push("#define METALLIC"),n.push("#define METALLICWORKFLOW"),t=!0),null!==i.roughness&&(n.push("#define ROUGHNESS"),n.push("#define METALLICWORKFLOW"),t=!0),t&&(null!==i.baseTexture&&(n.push("#define ALBEDOTEXTURE"),n.push(`#define ALBEDO_UV${i.baseTexture.coordinatesIndex+1}`),i.baseTexture.gammaSpace&&n.push("#define GAMMAALBEDO"),e=!0),null!==i.baseColor&&n.push("#define ALBEDOCOLOR"))):"PBRSpecularGlossinessMaterial"===i.getClassName()?(null!==i.specularGlossinessTexture?(n.push("#define SPECULARGLOSSINESSTEXTURE"),n.push(`#define REFLECTIVITY_UV${i.specularGlossinessTexture.coordinatesIndex+1}`),e=!0,i.specularGlossinessTexture.gammaSpace&&n.push("#define GAMMAREFLECTIVITYTEXTURE")):null!==i.specularColor&&n.push("#define REFLECTIVITYCOLOR"),null!==i.glossiness&&n.push("#define GLOSSINESSS")):"PBRMaterial"===i.getClassName()?(null!==i.metallicTexture&&(n.push("#define ORMTEXTURE"),n.push(`#define REFLECTIVITY_UV${i.metallicTexture.coordinatesIndex+1}`),n.push("#define METALLICWORKFLOW"),e=!0,t=!0),null!==i.metallic&&(n.push("#define METALLIC"),n.push("#define METALLICWORKFLOW"),t=!0),null!==i.roughness&&(n.push("#define ROUGHNESS"),n.push("#define METALLICWORKFLOW"),t=!0),t?(null!==i.albedoTexture&&(n.push("#define ALBEDOTEXTURE"),n.push(`#define ALBEDO_UV${i.albedoTexture.coordinatesIndex+1}`),i.albedoTexture.gammaSpace&&n.push("#define GAMMAALBEDO"),e=!0),null!==i.albedoColor&&n.push("#define ALBEDOCOLOR")):(null!==i.reflectivityTexture?(n.push("#define SPECULARGLOSSINESSTEXTURE"),n.push(`#define REFLECTIVITY_UV${i.reflectivityTexture.coordinatesIndex+1}`),i.reflectivityTexture.gammaSpace&&n.push("#define GAMMAREFLECTIVITYTEXTURE"),e=!0):null!==i.reflectivityColor&&n.push("#define REFLECTIVITYCOLOR"),null!==i.microSurface&&n.push("#define GLOSSINESSS"))):"StandardMaterial"===i.getClassName()&&(null!==i.specularTexture&&(n.push("#define REFLECTIVITYTEXTURE"),n.push(`#define REFLECTIVITY_UV${i.specularTexture.coordinatesIndex+1}`),i.specularTexture.gammaSpace&&n.push("#define GAMMAREFLECTIVITYTEXTURE"),e=!0),null!==i.specularColor&&n.push("#define REFLECTIVITYCOLOR"))}e&&(n.push("#define NEED_UV"),r.isVerticesDataPresent(qe.o.UVKind)&&(s.push(qe.o.UVKind),n.push("#define UV1")),r.isVerticesDataPresent(qe.o.UV2Kind)&&(s.push(qe.o.UV2Kind),n.push("#define UV2")))}this._linkedWithPrePass&&(n.push("#define PREPASS"),-1!==this._depthIndex&&(n.push("#define DEPTH_INDEX "+this._depthIndex),n.push("#define PREPASS_DEPTH")),-1!==this._normalIndex&&(n.push("#define NORMAL_INDEX "+this._normalIndex),n.push("#define PREPASS_NORMAL"))),this._enablePosition&&(n.push("#define POSITION"),n.push("#define POSITION_INDEX "+this._positionIndex)),this._enableVelocity&&(n.push("#define VELOCITY"),n.push("#define VELOCITY_INDEX "+this._velocityIndex),-1===this.excludedSkinnedMeshesFromVelocity.indexOf(r)&&n.push("#define BONES_VELOCITY_ENABLED")),this._enableReflectivity&&(n.push("#define REFLECTIVITY"),n.push("#define REFLECTIVITY_INDEX "+this._reflectivityIndex)),r.useBones&&r.computeBonesUsingShaders?(s.push(qe.o.MatricesIndicesKind),s.push(qe.o.MatricesWeightsKind),r.numBoneInfluencers>4&&(s.push(qe.o.MatricesIndicesExtraKind),s.push(qe.o.MatricesWeightsExtraKind)),n.push("#define NUM_BONE_INFLUENCERS "+r.numBoneInfluencers),n.push("#define BonesPerMesh "+(r.skeleton?r.skeleton.bones.length+1:0))):n.push("#define NUM_BONE_INFLUENCERS 0");const o=r.morphTargetManager;let a=0;o&&o.numInfluencers>0&&(a=o.numInfluencers,n.push("#define MORPHTARGETS"),n.push("#define NUM_MORPH_INFLUENCERS "+a),o.isUsingTextureForTargets&&n.push("#define MORPHTARGETS_TEXTURE"),La.G.PrepareAttributesForMorphTargetsInfluencers(s,r,a)),t&&(n.push("#define INSTANCES"),La.G.PushAttributesForInstances(s,this._enableVelocity),e.getRenderingMesh().hasThinInstances&&n.push("#define THIN_INSTANCES")),this._linkedWithPrePass?n.push("#define RENDER_TARGET_COUNT "+this._attachmentsFromPrePass.length):n.push("#define RENDER_TARGET_COUNT "+this._multiRenderTarget.textures.length),(0,Ga.lK)(i,this._scene,n);const l=this._scene.getEngine(),h=e._getDrawWrapper(void 0,!0),c=h.defines,u=n.join("\n");return c!==u&&h.setEffect(l.createEffect("geometry",{attributes:s,uniformsNames:Em,samplers:["diffuseSampler","bumpSampler","reflectivitySampler","albedoSampler","morphTargets"],defines:u,onCompiled:null,fallbacks:null,onError:null,uniformBuffersNames:["Scene"],indexParameters:{buffersCount:this._multiRenderTarget.textures.length-1,maxSimultaneousMorphTargets:a}},l),u),h.effect.isReady()}getGBuffer(){return this._multiRenderTarget}get samples(){return this._multiRenderTarget.samples}set samples(e){this._multiRenderTarget.samples=e}dispose(){this._resizeObserver&&(this._scene.getEngine().onResizeObservable.remove(this._resizeObserver),this._resizeObserver=null),this.getGBuffer().dispose()}_assignRenderTargetIndices(){const e=[];let t=2;return e.push("gBuffer_Depth","gBuffer_Normal"),this._enablePosition&&(this._positionIndex=t,t++,e.push("gBuffer_Position")),this._enableVelocity&&(this._velocityIndex=t,t++,e.push("gBuffer_Velocity")),this._enableReflectivity&&(this._reflectivityIndex=t,t++,e.push("gBuffer_Reflectivity")),[t,e]}_createRenderTargets(){const e=this._scene.getEngine(),[t,i]=this._assignRenderTargetIndices();let n=0;if(e._caps.textureFloat&&e._caps.textureFloatLinearFiltering?n=1:e._caps.textureHalfFloat&&e._caps.textureHalfFloatLinearFiltering&&(n=2),this._multiRenderTarget=new Xc("gBuffer",{width:e.getRenderWidth()*this._ratio,height:e.getRenderHeight()*this._ratio},t,this._scene,{generateMipMaps:!1,generateDepthTexture:!0,defaultType:n,depthTextureFormat:this._depthFormat},i.concat("gBuffer_DepthBuffer")),!this.isSupported)return;this._multiRenderTarget.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._multiRenderTarget.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._multiRenderTarget.refreshRate=1,this._multiRenderTarget.renderParticles=!1,this._multiRenderTarget.renderList=null;const s=[!0],r=[!1],a=[!0];for(let e=1;e<t;++e)s.push(!0),a.push(!1),r.push(!0);const l=e.buildTextureLayout(s),h=e.buildTextureLayout(r),c=e.buildTextureLayout(a);this._multiRenderTarget.onClearObservable.add((e=>{e.bindAttachments(this.useSpecificClearForDepthTexture?h:l),e.clear(this._clearColor,!0,!0,!0),this.useSpecificClearForDepthTexture&&(e.bindAttachments(c),e.clear(this._clearDepthColor,!0,!0,!0)),e.bindAttachments(l)})),this._resizeObserver=e.onResizeObservable.add((()=>{this._multiRenderTarget&&this._multiRenderTarget.resize({width:e.getRenderWidth()*this._ratio,height:e.getRenderHeight()*this._ratio})}));const u=e=>{const t=e.getRenderingMesh(),i=e.getEffectiveMesh(),n=this._scene,s=n.getEngine(),r=e.getMaterial();if(!r)return;if(i._internalAbstractMeshDataInfo._isActiveIntermediate=!1,this._enableVelocity&&!this._previousTransformationMatrices[i.uniqueId]&&(this._previousTransformationMatrices[i.uniqueId]={world:o.y3.Identity(),viewProjection:n.getTransformMatrix()},t.skeleton)){const e=t.skeleton.getTransformMatrices(t);this._previousBonesTransformationMatrices[t.uniqueId]=this._copyBonesTransformationMatrices(e,new Float32Array(e.length))}const a=t._getInstancesRenderList(e._id,!!e.getReplacementMesh());if(a.mustReturn)return;const l=s.getCaps().instancedArrays&&(null!==a.visibleInstances[e._id]||t.hasThinInstances),h=i.getWorldMatrix();if(this.isReady(e,l)){const o=e._getDrawWrapper();if(!o)return;const c=o.effect;let u;s.enableEffect(o),l||t._bind(e,c,r.fillMode),this._useUbo?(La.G.BindSceneUniformBuffer(c,this._scene.getSceneUniformBuffer()),this._scene.finalizeSceneUbo()):(c.setMatrix("viewProjection",n.getTransformMatrix()),c.setMatrix("view",n.getViewMatrix()));const d=t._instanceDataStorage;if(d.isFrozen||!r.backFaceCulling&&null===t.overrideMaterialSideOrientation)u=d.sideOrientation;else{const e=i._getWorldMatrixDeterminant();u=t.overrideMaterialSideOrientation,null===u&&(u=r.sideOrientation),e<0&&(u=u===cs.F.ClockWiseSideOrientation?cs.F.CounterClockWiseSideOrientation:cs.F.ClockWiseSideOrientation)}if(r._preBind(o,u),r.needAlphaTesting()){const e=r.getAlphaTestTexture();e&&(c.setTexture("diffuseSampler",e),c.setMatrix("diffuseMatrix",e.getTextureMatrix()))}r.bumpTexture&&n.getEngine().getCaps().standardDerivatives&&Va.k.BumpTextureEnabled&&(c.setFloat3("vBumpInfos",r.bumpTexture.coordinatesIndex,1/r.bumpTexture.level,r.parallaxScaleBias),c.setMatrix("bumpMatrix",r.bumpTexture.getTextureMatrix()),c.setTexture("bumpSampler",r.bumpTexture),c.setFloat2("vTangentSpaceParams",r.invertNormalMapX?-1:1,r.invertNormalMapY?-1:1)),this._enableReflectivity&&("PBRMetallicRoughnessMaterial"===r.getClassName()?(null!==r.metallicRoughnessTexture&&(c.setTexture("reflectivitySampler",r.metallicRoughnessTexture),c.setMatrix("reflectivityMatrix",r.metallicRoughnessTexture.getTextureMatrix())),null!==r.metallic&&c.setFloat("metallic",r.metallic),null!==r.roughness&&c.setFloat("glossiness",1-r.roughness),null!==r.baseTexture&&(c.setTexture("albedoSampler",r.baseTexture),c.setMatrix("albedoMatrix",r.baseTexture.getTextureMatrix())),null!==r.baseColor&&c.setColor3("albedoColor",r.baseColor)):"PBRSpecularGlossinessMaterial"===r.getClassName()?(null!==r.specularGlossinessTexture?(c.setTexture("reflectivitySampler",r.specularGlossinessTexture),c.setMatrix("reflectivityMatrix",r.specularGlossinessTexture.getTextureMatrix())):null!==r.specularColor&&c.setColor3("reflectivityColor",r.specularColor),null!==r.glossiness&&c.setFloat("glossiness",r.glossiness)):"PBRMaterial"===r.getClassName()?(null!==r.metallicTexture&&(c.setTexture("reflectivitySampler",r.metallicTexture),c.setMatrix("reflectivityMatrix",r.metallicTexture.getTextureMatrix())),null!==r.metallic&&c.setFloat("metallic",r.metallic),null!==r.roughness&&c.setFloat("glossiness",1-r.roughness),null!==r.roughness||null!==r.metallic||null!==r.metallicTexture?(null!==r.albedoTexture&&(c.setTexture("albedoSampler",r.albedoTexture),c.setMatrix("albedoMatrix",r.albedoTexture.getTextureMatrix())),null!==r.albedoColor&&c.setColor3("albedoColor",r.albedoColor)):(null!==r.reflectivityTexture?(c.setTexture("reflectivitySampler",r.reflectivityTexture),c.setMatrix("reflectivityMatrix",r.reflectivityTexture.getTextureMatrix())):null!==r.reflectivityColor&&c.setColor3("reflectivityColor",r.reflectivityColor),null!==r.microSurface&&c.setFloat("glossiness",r.microSurface))):"StandardMaterial"===r.getClassName()&&(null!==r.specularTexture&&(c.setTexture("reflectivitySampler",r.specularTexture),c.setMatrix("reflectivityMatrix",r.specularTexture.getTextureMatrix())),null!==r.specularColor&&c.setColor3("reflectivityColor",r.specularColor))),(0,Ga.an)(c,r,this._scene),t.useBones&&t.computeBonesUsingShaders&&t.skeleton&&(c.setMatrices("mBones",t.skeleton.getTransformMatrices(t)),this._enableVelocity&&c.setMatrices("mPreviousBones",this._previousBonesTransformationMatrices[t.uniqueId])),La.G.BindMorphTargetParameters(t,c),t.morphTargetManager&&t.morphTargetManager.isUsingTextureForTargets&&t.morphTargetManager._bind(c),this._enableVelocity&&(c.setMatrix("previousWorld",this._previousTransformationMatrices[i.uniqueId].world),c.setMatrix("previousViewProjection",this._previousTransformationMatrices[i.uniqueId].viewProjection)),l&&t.hasThinInstances&&c.setMatrix("world",h),t._processRendering(i,e,c,r.fillMode,a,l,((e,t)=>{e||c.setMatrix("world",t)}))}this._enableVelocity&&(this._previousTransformationMatrices[i.uniqueId].world=h.clone(),this._previousTransformationMatrices[i.uniqueId].viewProjection=this._scene.getTransformMatrix().clone(),t.skeleton&&this._copyBonesTransformationMatrices(t.skeleton.getTransformMatrices(t),this._previousBonesTransformationMatrices[i.uniqueId]))};this._multiRenderTarget.customIsReadyFunction=(t,i,n)=>{if((n||0===i)&&t.subMeshes)for(let i=0;i<t.subMeshes.length;++i){const n=t.subMeshes[i],s=n.getMaterial(),r=n.getRenderingMesh();if(!s)continue;const o=r._getInstancesRenderList(n._id,!!n.getReplacementMesh()),a=e.getCaps().instancedArrays&&(null!==o.visibleInstances[n._id]||r.hasThinInstances);if(!this.isReady(n,a))return!1}return!0},this._multiRenderTarget.customRenderFunction=(t,i,n,s)=>{let r;if(this._linkedWithPrePass){if(!this._prePassRenderer.enabled)return;this._scene.getEngine().bindAttachments(this._attachmentsFromPrePass)}if(s.length){for(e.setColorWrite(!1),r=0;r<s.length;r++)u(s.data[r]);e.setColorWrite(!0)}for(r=0;r<t.length;r++)u(t.data[r]);for(e.setDepthWrite(!1),r=0;r<i.length;r++)u(i.data[r]);if(this.renderTransparentMeshes)for(r=0;r<n.length;r++)u(n.data[r]);e.setDepthWrite(!0)}}_copyBonesTransformationMatrices(e,t){for(let i=0;i<e.length;i++)t[i]=e[i];return t}}Cm.DEPTH_TEXTURE_TYPE=0,Cm.NORMAL_TEXTURE_TYPE=1,Cm.POSITION_TEXTURE_TYPE=2,Cm.VELOCITY_TEXTURE_TYPE=3,Cm.REFLECTIVITY_TEXTURE_TYPE=4,Cm._SceneComponentInitialization=e=>{throw(0,Zl.S)("GeometryBufferRendererSceneComponent")};class Am{constructor(){this.enabled=!1,this.name="motionBlur",this.texturesRequired=[2]}}Object.defineProperty(k.x.prototype,"geometryBufferRenderer",{get:function(){return this._geometryBufferRenderer},set:function(e){e&&e.isSupported&&(this._geometryBufferRenderer=e)},enumerable:!0,configurable:!0}),k.x.prototype.enableGeometryBufferRenderer=function(e=1,t=15){return this._geometryBufferRenderer||(this._geometryBufferRenderer=new Cm(this,e,t),this._geometryBufferRenderer.isSupported||(this._geometryBufferRenderer=null)),this._geometryBufferRenderer},k.x.prototype.disableGeometryBufferRenderer=function(){this._geometryBufferRenderer&&(this._geometryBufferRenderer.dispose(),this._geometryBufferRenderer=null)};class Pm{constructor(e){this.name=ve.l.NAME_GEOMETRYBUFFERRENDERER,this.scene=e}register(){this.scene._gatherRenderTargetsStage.registerStep(ve.l.STEP_GATHERRENDERTARGETS_GEOMETRYBUFFERRENDERER,this,this._gatherRenderTargets)}rebuild(){}dispose(){}_gatherRenderTargets(e){this.scene._geometryBufferRenderer&&e.push(this.scene._geometryBufferRenderer.getGBuffer())}}Cm._SceneComponentInitialization=e=>{let t=e._getComponent(ve.l.NAME_GEOMETRYBUFFERRENDERER);t||(t=new Pm(e),e._addComponent(t))};si.v.ShadersStore.motionBlurPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform float motionStrength;\nuniform float motionScale;\nuniform vec2 screenSize;\n#ifdef OBJECT_BASED\nuniform sampler2D velocitySampler;\n#else\nuniform sampler2D depthSampler;\nuniform mat4 inverseViewProjection;\nuniform mat4 prevViewProjection;\nuniform mat4 projection;\n#endif\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\n#ifdef GEOMETRY_SUPPORTED\n#ifdef OBJECT_BASED\nvec2 texelSize=1.0/screenSize;\nvec4 velocityColor=texture2D(velocitySampler,vUV);\nvelocityColor.rg=velocityColor.rg*2.0-vec2(1.0);\nvec2 velocity=vec2(pow(velocityColor.r,3.0),pow(velocityColor.g,3.0))*velocityColor.a;\nvelocity*=motionScale*motionStrength;\nfloat speed=length(velocity/texelSize);\nint samplesCount=int(clamp(speed,1.0,SAMPLES));\nvelocity=normalize(velocity)*texelSize;\nfloat hlim=float(-samplesCount)*0.5+0.5;\nvec4 result=texture2D(textureSampler,vUV);\nfor (int i=1; i<int(SAMPLES); ++i)\n{\nif (i>=samplesCount)\nbreak;\nvec2 offset=vUV+velocity*(hlim+float(i));\n#if defined(WEBGPU)\nresult+=texture2DLodEXT(textureSampler,offset,0.0);\n#else\nresult+=texture2D(textureSampler,offset);\n#endif\n}\ngl_FragColor=result/float(samplesCount);\ngl_FragColor.a=1.0;\n#else\nvec2 texelSize=1.0/screenSize;\nfloat depth=texture2D(depthSampler,vUV).r;\ndepth=projection[2].z+projection[3].z/depth; \nvec4 cpos=vec4(vUV*2.0-1.0,depth,1.0);\ncpos=inverseViewProjection*cpos;\ncpos/=cpos.w;\nvec4 ppos=prevViewProjection*cpos;\nppos/=ppos.w;\nppos.xy=ppos.xy*0.5+0.5;\nvec2 velocity=(ppos.xy-vUV)*motionScale*motionStrength;\nfloat speed=length(velocity/texelSize);\nint nSamples=int(clamp(speed,1.0,SAMPLES));\nvec4 result=texture2D(textureSampler,vUV);\nfor (int i=1; i<int(SAMPLES); ++i) {\nif (i>=nSamples)\nbreak;\nvec2 offset1=vUV+velocity*(float(i)/float(nSamples-1)-0.5);\n#if defined(WEBGPU)\nresult+=texture2DLodEXT(textureSampler,offset1,0.0);\n#else\nresult+=texture2D(textureSampler,offset1);\n#endif\n}\ngl_FragColor=result/float(nSamples);\n#endif\n#else\ngl_FragColor=texture2D(textureSampler,vUV);\n#endif\n}\n";class Rm extends ni.D{get motionBlurSamples(){return this._motionBlurSamples}set motionBlurSamples(e){this._motionBlurSamples=e,this._updateEffect()}get isObjectBased(){return this._isObjectBased}set isObjectBased(e){this._isObjectBased!==e&&(this._isObjectBased=e,this._applyMode())}get _geometryBufferRenderer(){return this._forceGeometryBuffer?this._scene.geometryBufferRenderer:null}get _prePassRenderer(){return this._forceGeometryBuffer?null:this._scene.prePassRenderer}getClassName(){return"MotionBlurPostProcess"}constructor(e,t,i,n,s,r,o,a=0,l=!1,h=!1){super(e,"motionBlur",["motionStrength","motionScale","screenSize","inverseViewProjection","prevViewProjection","projection"],["velocitySampler","depthSampler"],i,n,s,r,o,"#define GEOMETRY_SUPPORTED\n#define SAMPLES 64.0\n#define OBJECT_BASED",a,void 0,null,l),this.motionStrength=1,this._motionBlurSamples=32,this._isObjectBased=!0,this._forceGeometryBuffer=!1,this._invViewProjection=null,this._previousViewProjection=null,this._forceGeometryBuffer=h,this._forceGeometryBuffer?(t.enableGeometryBufferRenderer(),this._geometryBufferRenderer&&(this._geometryBufferRenderer.enableVelocity=!0)):(t.enablePrePassRenderer(),this._prePassRenderer&&(this._prePassRenderer.markAsDirty(),this._prePassEffectConfiguration=new Am)),this._applyMode()}excludeSkinnedMesh(e){if(e.skeleton){let t;if(this._geometryBufferRenderer)t=this._geometryBufferRenderer.excludedSkinnedMeshesFromVelocity;else{if(!this._prePassRenderer)return;t=this._prePassRenderer.excludedSkinnedMesh}t.push(e)}}removeExcludedSkinnedMesh(e){if(e.skeleton){let t;if(this._geometryBufferRenderer)t=this._geometryBufferRenderer.excludedSkinnedMeshesFromVelocity;else{if(!this._prePassRenderer)return;t=this._prePassRenderer.excludedSkinnedMesh}const i=t.indexOf(e);-1!==i&&t.splice(i,1)}}dispose(e){this._geometryBufferRenderer&&(this._geometryBufferRenderer._previousTransformationMatrices={},this._geometryBufferRenderer._previousBonesTransformationMatrices={},this._geometryBufferRenderer.excludedSkinnedMeshesFromVelocity=[]),super.dispose(e)}_applyMode(){if(!this._geometryBufferRenderer&&!this._prePassRenderer)return _.Y.Warn("Multiple Render Target support needed to compute object based motion blur"),this.updateEffect();this._updateEffect(),this._invViewProjection=null,this._previousViewProjection=null,this.isObjectBased?(this._prePassRenderer&&this._prePassEffectConfiguration&&(this._prePassEffectConfiguration.texturesRequired[0]=2),this.onApply=e=>this._onApplyObjectBased(e)):(this._invViewProjection=o.y3.Identity(),this._previousViewProjection=this._scene.getTransformMatrix().clone(),this._prePassRenderer&&this._prePassEffectConfiguration&&(this._prePassEffectConfiguration.texturesRequired[0]=5),this.onApply=e=>this._onApplyScreenBased(e))}_onApplyObjectBased(e){if(e.setVector2("screenSize",new o.FM(this.width,this.height)),e.setFloat("motionScale",this._scene.getAnimationRatio()),e.setFloat("motionStrength",this.motionStrength),this._geometryBufferRenderer){const t=this._geometryBufferRenderer.getTextureIndex(Cm.VELOCITY_TEXTURE_TYPE);e.setTexture("velocitySampler",this._geometryBufferRenderer.getGBuffer().textures[t])}else if(this._prePassRenderer){const t=this._prePassRenderer.getIndex(2);e.setTexture("velocitySampler",this._prePassRenderer.getRenderTarget().textures[t])}}_onApplyScreenBased(e){const t=o.jp.Matrix[0];if(t.copyFrom(this._scene.getTransformMatrix()),t.invertToRef(this._invViewProjection),e.setMatrix("inverseViewProjection",this._invViewProjection),e.setMatrix("prevViewProjection",this._previousViewProjection),this._previousViewProjection.copyFrom(t),e.setMatrix("projection",this._scene.getProjectionMatrix()),e.setVector2("screenSize",new o.FM(this.width,this.height)),e.setFloat("motionScale",this._scene.getAnimationRatio()),e.setFloat("motionStrength",this.motionStrength),this._geometryBufferRenderer){const t=this._geometryBufferRenderer.getTextureIndex(Cm.DEPTH_TEXTURE_TYPE);e.setTexture("depthSampler",this._geometryBufferRenderer.getGBuffer().textures[t])}else if(this._prePassRenderer){const t=this._prePassRenderer.getIndex(5);e.setTexture("depthSampler",this._prePassRenderer.getRenderTarget().textures[t])}}_updateEffect(){if(this._geometryBufferRenderer||this._prePassRenderer){const e=["#define GEOMETRY_SUPPORTED","#define SAMPLES "+this._motionBlurSamples.toFixed(1),this._isObjectBased?"#define OBJECT_BASED":"#define SCREEN_BASED"];this.updateEffect(e.join("\n"))}}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new Rm(e.name,i,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.reusable,e.textureType,!1)),e,i,n)}}(0,be.gn)([(0,Te.qC)()],Rm.prototype,"motionStrength",void 0),(0,be.gn)([(0,Te.qC)()],Rm.prototype,"motionBlurSamples",null),(0,be.gn)([(0,Te.qC)()],Rm.prototype,"isObjectBased",null),(0,l.H)("BABYLON.MotionBlurPostProcess",Rm);si.v.ShadersStore.refractionPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform sampler2D refractionSampler;\nuniform vec3 baseColor;\nuniform float depth;\nuniform float colorLevel;\nvoid main() {\nfloat ref=1.0-texture2D(refractionSampler,vUV).r;\nvec2 uv=vUV-vec2(0.5);\nvec2 offset=uv*depth*ref;\nvec3 sourceColor=texture2D(textureSampler,vUV-offset).rgb;\ngl_FragColor=vec4(sourceColor+sourceColor*ref*colorLevel,1.0);\n}";class Mm extends ni.D{get refractionTexture(){return this._refTexture}set refractionTexture(e){this._refTexture&&this._ownRefractionTexture&&this._refTexture.dispose(),this._refTexture=e,this._ownRefractionTexture=!1}getClassName(){return"RefractionPostProcess"}constructor(e,t,i,n,s,r,o,a,l,h){super(e,"refraction",["baseColor","depth","colorLevel"],["refractionSampler"],r,o,a,l,h),this._ownRefractionTexture=!0,this.color=i,this.depth=n,this.colorLevel=s,this.refractionTextureUrl=t,this.onActivateObservable.add((e=>{this._refTexture=this._refTexture||new Ce.x(t,e.getScene())})),this.onApplyObservable.add((e=>{e.setColor3("baseColor",this.color),e.setFloat("depth",this.depth),e.setFloat("colorLevel",this.colorLevel),e.setTexture("refractionSampler",this._refTexture)}))}dispose(e){this._refTexture&&this._ownRefractionTexture&&(this._refTexture.dispose(),this._refTexture=null),super.dispose(e)}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new Mm(e.name,e.refractionTextureUrl,e.color,e.depth,e.colorLevel,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.reusable)),e,i,n)}}(0,be.gn)([(0,Te.qC)()],Mm.prototype,"color",void 0),(0,be.gn)([(0,Te.qC)()],Mm.prototype,"depth",void 0),(0,be.gn)([(0,Te.qC)()],Mm.prototype,"colorLevel",void 0),(0,be.gn)([(0,Te.qC)()],Mm.prototype,"refractionTextureUrl",void 0),(0,l.H)("BABYLON.RefractionPostProcess",Mm);si.v.ShadersStore.sharpenPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform vec2 screenSize;\nuniform vec2 sharpnessAmounts;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nvec2 onePixel=vec2(1.0,1.0)/screenSize;\nvec4 color=texture2D(textureSampler,vUV);\nvec4 edgeDetection=texture2D(textureSampler,vUV+onePixel*vec2(0,-1)) +\ntexture2D(textureSampler,vUV+onePixel*vec2(-1,0)) +\ntexture2D(textureSampler,vUV+onePixel*vec2(1,0)) +\ntexture2D(textureSampler,vUV+onePixel*vec2(0,1)) -\ncolor*4.0;\ngl_FragColor=max(vec4(color.rgb*sharpnessAmounts.y,color.a)-(sharpnessAmounts.x*vec4(edgeDetection.rgb,0)),0.);\n}";class Im extends ni.D{getClassName(){return"SharpenPostProcess"}constructor(e,t,i,n,s,r,o=0,a=!1){super(e,"sharpen",["sharpnessAmounts","screenSize"],null,t,i,n,s,r,null,o,void 0,null,a),this.colorAmount=1,this.edgeAmount=.3,this.onApply=e=>{e.setFloat2("screenSize",this.width,this.height),e.setFloat2("sharpnessAmounts",this.edgeAmount,this.colorAmount)}}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new Im(e.name,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.textureType,e.reusable)),e,i,n)}}(0,be.gn)([(0,Te.qC)()],Im.prototype,"colorAmount",void 0),(0,be.gn)([(0,Te.qC)()],Im.prototype,"edgeAmount",void 0),(0,l.H)("BABYLON.SharpenPostProcess",Im);class Dm{get name(){return this._name}get cameras(){return this._cameras}constructor(e,t){this._engine=e,this._name=t,this._renderEffects={},this._renderEffectsForIsolatedPass=new Array,this._cameras=[]}getClassName(){return"PostProcessRenderPipeline"}get isSupported(){for(const e in this._renderEffects)if(Object.prototype.hasOwnProperty.call(this._renderEffects,e)&&!this._renderEffects[e].isSupported)return!1;return!0}addEffect(e){this._renderEffects[e._name]=e}_rebuild(){}_enableEffect(e,t){const i=this._renderEffects[e];i&&i._enable(de.w1.MakeArray(t||this._cameras))}_disableEffect(e,t){const i=this._renderEffects[e];i&&i._disable(de.w1.MakeArray(t||this._cameras))}_attachCameras(e,t){const i=de.w1.MakeArray(e||this._cameras);if(!i)return;const n=[];let s;for(s=0;s<i.length;s++){const e=i[s];e&&(-1===this._cameras.indexOf(e)?this._cameras.push(e):t&&n.push(s))}for(s=0;s<n.length;s++)i.splice(n[s],1);for(const e in this._renderEffects)Object.prototype.hasOwnProperty.call(this._renderEffects,e)&&this._renderEffects[e]._attachCameras(i)}_detachCameras(e){const t=de.w1.MakeArray(e||this._cameras);if(t){for(const e in this._renderEffects)Object.prototype.hasOwnProperty.call(this._renderEffects,e)&&this._renderEffects[e]._detachCameras(t);for(let e=0;e<t.length;e++)this._cameras.splice(this._cameras.indexOf(t[e]),1)}}_update(){for(const e in this._renderEffects)Object.prototype.hasOwnProperty.call(this._renderEffects,e)&&this._renderEffects[e]._update();for(let e=0;e<this._cameras.length;e++){if(!this._cameras[e])continue;const t=this._cameras[e].name;this._renderEffectsForIsolatedPass[t]&&this._renderEffectsForIsolatedPass[t]._update()}}_reset(){this._renderEffects={},this._renderEffectsForIsolatedPass=new Array}_enableMSAAOnFirstPostProcess(e){if(!this._engine._features.supportMSAA)return!1;const t=Object.keys(this._renderEffects);if(t.length>0){const i=this._renderEffects[t[0]].getPostProcesses();i&&(i[0].samples=e)}return!0}setPrePassRenderer(e){return!1}dispose(){}}(0,be.gn)([(0,Te.qC)()],Dm.prototype,"_name",void 0);class Om{constructor(){this._renderPipelines={}}get supportedPipelines(){const e=[];for(const t in this._renderPipelines)if(Object.prototype.hasOwnProperty.call(this._renderPipelines,t)){const i=this._renderPipelines[t];i.isSupported&&e.push(i)}return e}addPipeline(e){this._renderPipelines[e._name]=e}removePipeline(e){delete this._renderPipelines[e]}attachCamerasToRenderPipeline(e,t,i=!1){const n=this._renderPipelines[e];n&&n._attachCameras(t,i)}detachCamerasFromRenderPipeline(e,t){const i=this._renderPipelines[e];i&&i._detachCameras(t)}enableEffectInPipeline(e,t,i){const n=this._renderPipelines[e];n&&n._enableEffect(t,i)}disableEffectInPipeline(e,t,i){const n=this._renderPipelines[e];n&&n._disableEffect(t,i)}update(){for(const e in this._renderPipelines)if(Object.prototype.hasOwnProperty.call(this._renderPipelines,e)){const t=this._renderPipelines[e];t.isSupported?t._update():(t.dispose(),delete this._renderPipelines[e])}}_rebuild(){for(const e in this._renderPipelines)Object.prototype.hasOwnProperty.call(this._renderPipelines,e)&&this._renderPipelines[e]._rebuild()}dispose(){for(const e in this._renderPipelines)Object.prototype.hasOwnProperty.call(this._renderPipelines,e)&&this._renderPipelines[e].dispose()}}Object.defineProperty(k.x.prototype,"postProcessRenderPipelineManager",{get:function(){if(!this._postProcessRenderPipelineManager){let e=this._getComponent(ve.l.NAME_POSTPROCESSRENDERPIPELINEMANAGER);e||(e=new wm(this),this._addComponent(e)),this._postProcessRenderPipelineManager=new Om}return this._postProcessRenderPipelineManager},enumerable:!0,configurable:!0});class wm{constructor(e){this.name=ve.l.NAME_POSTPROCESSRENDERPIPELINEMANAGER,this.scene=e}register(){this.scene._gatherRenderTargetsStage.registerStep(ve.l.STEP_GATHERRENDERTARGETS_POSTPROCESSRENDERPIPELINEMANAGER,this,this._gatherRenderTargets)}rebuild(){this.scene._postProcessRenderPipelineManager&&this.scene._postProcessRenderPipelineManager._rebuild()}dispose(){this.scene._postProcessRenderPipelineManager&&this.scene._postProcessRenderPipelineManager.dispose()}_gatherRenderTargets(){this.scene._postProcessRenderPipelineManager&&this.scene._postProcessRenderPipelineManager.update()}}class Nm extends Dm{get automaticBuild(){return this._buildAllowed}set automaticBuild(e){this._buildAllowed=e}get scene(){return this._scene}set sharpenEnabled(e){this._sharpenEnabled!==e&&(this._sharpenEnabled=e,this._buildPipeline())}get sharpenEnabled(){return this._sharpenEnabled}get bloomKernel(){return this._bloomKernel}set bloomKernel(e){this._bloomKernel=e,this.bloom.kernel=e/this._hardwareScaleLevel}set bloomWeight(e){this._bloomWeight!==e&&(this.bloom.weight=e,this._bloomWeight=e)}get bloomWeight(){return this._bloomWeight}set bloomThreshold(e){this._bloomThreshold!==e&&(this.bloom.threshold=e,this._bloomThreshold=e)}get bloomThreshold(){return this._bloomThreshold}set bloomScale(e){this._bloomScale!==e&&(this._bloomScale=e,this._rebuildBloom(),this._buildPipeline())}get bloomScale(){return this._bloomScale}set bloomEnabled(e){this._bloomEnabled!==e&&(this._bloomEnabled=e,this._buildPipeline())}get bloomEnabled(){return this._bloomEnabled}_rebuildBloom(){const e=this.bloom;this.bloom=new cm(this._scene,this.bloomScale,this._bloomWeight,this.bloomKernel/this._hardwareScaleLevel,this._defaultPipelineTextureType,!1),this.bloom.threshold=e.threshold;for(let t=0;t<this._cameras.length;t++)e.disposeEffects(this._cameras[t])}get depthOfFieldEnabled(){return this._depthOfFieldEnabled}set depthOfFieldEnabled(e){this._depthOfFieldEnabled!==e&&(this._depthOfFieldEnabled=e,this._buildPipeline())}get depthOfFieldBlurLevel(){return this._depthOfFieldBlurLevel}set depthOfFieldBlurLevel(e){if(this._depthOfFieldBlurLevel===e)return;this._depthOfFieldBlurLevel=e;const t=this.depthOfField;this.depthOfField=new vm(this._scene,null,this._depthOfFieldBlurLevel,this._defaultPipelineTextureType,!1),this.depthOfField.focalLength=t.focalLength,this.depthOfField.focusDistance=t.focusDistance,this.depthOfField.fStop=t.fStop,this.depthOfField.lensSize=t.lensSize;for(let e=0;e<this._cameras.length;e++)t.disposeEffects(this._cameras[e]);this._buildPipeline()}set fxaaEnabled(e){this._fxaaEnabled!==e&&(this._fxaaEnabled=e,this._buildPipeline())}get fxaaEnabled(){return this._fxaaEnabled}set samples(e){this._samples!==e&&(this._samples=e,this._buildPipeline())}get samples(){return this._samples}set imageProcessingEnabled(e){this._imageProcessingEnabled!==e&&(this._scene.imageProcessingConfiguration.isEnabled=e)}get imageProcessingEnabled(){return this._imageProcessingEnabled}set glowLayerEnabled(e){e&&!this._glowLayer?this._glowLayer=new th("",this._scene):!e&&this._glowLayer&&(this._glowLayer.dispose(),this._glowLayer=null)}get glowLayerEnabled(){return null!=this._glowLayer}get glowLayer(){return this._glowLayer}set chromaticAberrationEnabled(e){this._chromaticAberrationEnabled!==e&&(this._chromaticAberrationEnabled=e,this._buildPipeline())}get chromaticAberrationEnabled(){return this._chromaticAberrationEnabled}set grainEnabled(e){this._grainEnabled!==e&&(this._grainEnabled=e,this._buildPipeline())}get grainEnabled(){return this._grainEnabled}constructor(e="",t=!0,i=A.l.LastCreatedScene,n,s=!0){super(i.getEngine(),e),this._camerasToBeAttached=[],this.SharpenPostProcessId="SharpenPostProcessEffect",this.ImageProcessingPostProcessId="ImageProcessingPostProcessEffect",this.FxaaPostProcessId="FxaaPostProcessEffect",this.ChromaticAberrationPostProcessId="ChromaticAberrationPostProcessEffect",this.GrainPostProcessId="GrainPostProcessEffect",this._glowLayer=null,this.animations=[],this._imageProcessingConfigurationObserver=null,this._sharpenEnabled=!1,this._bloomEnabled=!1,this._depthOfFieldEnabled=!1,this._depthOfFieldBlurLevel=gm.Low,this._fxaaEnabled=!1,this._imageProcessingEnabled=!0,this._bloomScale=.5,this._chromaticAberrationEnabled=!1,this._grainEnabled=!1,this._buildAllowed=!0,this.onBuildObservable=new r.y$,this._resizeObserver=null,this._hardwareScaleLevel=1,this._bloomKernel=64,this._bloomWeight=.15,this._bloomThreshold=.9,this._samples=1,this._hasCleared=!1,this._prevPostProcess=null,this._prevPrevPostProcess=null,this._depthOfFieldSceneObserver=null,this._activeCameraChangedObserver=null,this._activeCamerasChangedObserver=null,this._cameras=n||i.cameras,this._cameras=this._cameras.slice(),this._camerasToBeAttached=this._cameras.slice(),this._buildAllowed=s,this._scene=i;const o=this._scene.getEngine().getCaps();this._hdr=t&&(o.textureHalfFloatRender||o.textureFloatRender),this._hdr?o.textureHalfFloatRender?this._defaultPipelineTextureType=2:o.textureFloatRender&&(this._defaultPipelineTextureType=1):this._defaultPipelineTextureType=0,i.postProcessRenderPipelineManager.addPipeline(this);const a=this._scene.getEngine();this.sharpen=new Im("sharpen",1,null,Ce.x.BILINEAR_SAMPLINGMODE,a,!1,this._defaultPipelineTextureType,!0),this._sharpenEffect=new am(a,this.SharpenPostProcessId,(()=>this.sharpen),!0),this.depthOfField=new vm(this._scene,null,this._depthOfFieldBlurLevel,this._defaultPipelineTextureType,!0),this._hardwareScaleLevel=a.getHardwareScalingLevel(),this._resizeObserver=a.onResizeObservable.add((()=>{this._hardwareScaleLevel=a.getHardwareScalingLevel(),this.bloomKernel=this._bloomKernel})),this.bloom=new cm(this._scene,this._bloomScale,this._bloomWeight,this.bloomKernel/this._hardwareScaleLevel,this._defaultPipelineTextureType,!0),this.chromaticAberration=new um("ChromaticAberration",a.getRenderWidth(),a.getRenderHeight(),1,null,Ce.x.BILINEAR_SAMPLINGMODE,a,!1,this._defaultPipelineTextureType,!0),this._chromaticAberrationEffect=new am(a,this.ChromaticAberrationPostProcessId,(()=>this.chromaticAberration),!0),this.grain=new Tm("Grain",1,null,Ce.x.BILINEAR_SAMPLINGMODE,a,!1,this._defaultPipelineTextureType,!0),this._grainEffect=new am(a,this.GrainPostProcessId,(()=>this.grain),!0),this._imageProcessingConfigurationObserver=this._scene.imageProcessingConfiguration.onUpdateParameters.add((()=>{this.bloom._downscale._exposure=this._scene.imageProcessingConfiguration.exposure,this.imageProcessingEnabled!==this._scene.imageProcessingConfiguration.isEnabled&&(this._imageProcessingEnabled=this._scene.imageProcessingConfiguration.isEnabled,de.w1.SetImmediate((()=>{this._buildPipeline()})))})),this._buildPipeline()}getClassName(){return"DefaultRenderingPipeline"}prepare(){const e=this._buildAllowed;this._buildAllowed=!0,this._buildPipeline(),this._buildAllowed=e}_setAutoClearAndTextureSharing(e,t=!1){this._hasCleared?e.autoClear=!1:(e.autoClear=!0,this._scene.autoClear=!1,this._hasCleared=!0),t||(this._prevPrevPostProcess?e.shareOutputWith(this._prevPrevPostProcess):e.useOwnOutput(),this._prevPostProcess&&(this._prevPrevPostProcess=this._prevPostProcess),this._prevPostProcess=e)}_buildPipeline(){if(!this._buildAllowed)return;this._scene.autoClear=!0;const e=this._scene.getEngine();if(this._disposePostProcesses(),null!==this._cameras&&(this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name,this._cameras),this._cameras=this._camerasToBeAttached.slice()),this._reset(),this._prevPostProcess=null,this._prevPrevPostProcess=null,this._hasCleared=!1,this.depthOfFieldEnabled){if(this._cameras.length>1){for(const e of this._cameras)this._scene.enableDepthRenderer(e).useOnlyInActiveCamera=!0;this._depthOfFieldSceneObserver=this._scene.onAfterRenderTargetsRenderObservable.add((e=>{this._cameras.indexOf(e.activeCamera)>-1&&(this.depthOfField.depthTexture=e.enableDepthRenderer(e.activeCamera).getDepthMap())}))}else{this._scene.onAfterRenderTargetsRenderObservable.remove(this._depthOfFieldSceneObserver);const e=this._scene.enableDepthRenderer(this._cameras[0]);this.depthOfField.depthTexture=e.getDepthMap()}this.depthOfField._isReady()||this.depthOfField._updateEffects(),this.addEffect(this.depthOfField),this._setAutoClearAndTextureSharing(this.depthOfField._effects[0],!0)}else this._scene.onAfterRenderTargetsRenderObservable.remove(this._depthOfFieldSceneObserver);this.bloomEnabled&&(this.bloom._isReady()||this.bloom._updateEffects(),this.addEffect(this.bloom),this._setAutoClearAndTextureSharing(this.bloom._effects[0],!0)),this._imageProcessingEnabled&&(this.imageProcessing=new Wi("imageProcessing",1,null,Ce.x.BILINEAR_SAMPLINGMODE,e,!1,this._defaultPipelineTextureType,this.scene.imageProcessingConfiguration),this._hdr?(this.addEffect(new am(e,this.ImageProcessingPostProcessId,(()=>this.imageProcessing),!0)),this._setAutoClearAndTextureSharing(this.imageProcessing)):this._scene.imageProcessingConfiguration.applyByPostProcess=!1,this._cameras&&0!==this._cameras.length||(this._scene.imageProcessingConfiguration.applyByPostProcess=!1),this.imageProcessing.getEffect()||this.imageProcessing._updateParameters()),this.sharpenEnabled&&(this.sharpen.isReady()||this.sharpen.updateEffect(),this.addEffect(this._sharpenEffect),this._setAutoClearAndTextureSharing(this.sharpen)),this.grainEnabled&&(this.grain.isReady()||this.grain.updateEffect(),this.addEffect(this._grainEffect),this._setAutoClearAndTextureSharing(this.grain)),this.chromaticAberrationEnabled&&(this.chromaticAberration.isReady()||this.chromaticAberration.updateEffect(),this.addEffect(this._chromaticAberrationEffect),this._setAutoClearAndTextureSharing(this.chromaticAberration)),this.fxaaEnabled&&(this.fxaa=new bm("fxaa",1,null,Ce.x.BILINEAR_SAMPLINGMODE,e,!1,this._defaultPipelineTextureType),this.addEffect(new am(e,this.FxaaPostProcessId,(()=>this.fxaa),!0)),this._setAutoClearAndTextureSharing(this.fxaa,!0)),null!==this._cameras&&this._scene.postProcessRenderPipelineManager.attachCamerasToRenderPipeline(this._name,this._cameras),(this._scene.activeCameras&&this._scene.activeCameras.length>1||this._scene.activeCamera&&-1===this._cameras.indexOf(this._scene.activeCamera))&&(this._scene.autoClear=!0),this._activeCameraChangedObserver||(this._activeCameraChangedObserver=this._scene.onActiveCameraChanged.add((()=>{this._scene.activeCamera&&-1===this._cameras.indexOf(this._scene.activeCamera)&&(this._scene.autoClear=!0)}))),this._activeCamerasChangedObserver||(this._activeCamerasChangedObserver=this._scene.onActiveCamerasChanged.add((()=>{this._scene.activeCameras&&this._scene.activeCameras.length>1&&(this._scene.autoClear=!0)}))),!this._enableMSAAOnFirstPostProcess(this.samples)&&this.samples>1&&_.Y.Warn("MSAA failed to enable, MSAA is only supported in browsers that support webGL >= 2.0"),this.onBuildObservable.notifyObservers(this)}_disposePostProcesses(e=!1){for(let t=0;t<this._cameras.length;t++){const i=this._cameras[t];this.imageProcessing&&this.imageProcessing.dispose(i),this.fxaa&&this.fxaa.dispose(i),e&&(this.sharpen&&this.sharpen.dispose(i),this.depthOfField&&(this._scene.onAfterRenderTargetsRenderObservable.remove(this._depthOfFieldSceneObserver),this.depthOfField.disposeEffects(i)),this.bloom&&this.bloom.disposeEffects(i),this.chromaticAberration&&this.chromaticAberration.dispose(i),this.grain&&this.grain.dispose(i),this._glowLayer&&this._glowLayer.dispose())}this.imageProcessing=null,this.fxaa=null,e&&(this.sharpen=null,this._sharpenEffect=null,this.depthOfField=null,this.bloom=null,this.chromaticAberration=null,this._chromaticAberrationEffect=null,this.grain=null,this._grainEffect=null,this._glowLayer=null)}addCamera(e){this._camerasToBeAttached.push(e),this._buildPipeline()}removeCamera(e){const t=this._camerasToBeAttached.indexOf(e);this._camerasToBeAttached.splice(t,1),this._buildPipeline()}dispose(){this._buildAllowed=!1,this.onBuildObservable.clear(),this._disposePostProcesses(!0),this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name,this._cameras),this._scene._postProcessRenderPipelineManager.removePipeline(this.name),this._scene.autoClear=!0,this._resizeObserver&&(this._scene.getEngine().onResizeObservable.remove(this._resizeObserver),this._resizeObserver=null),this._scene.onActiveCameraChanged.remove(this._activeCameraChangedObserver),this._scene.onActiveCamerasChanged.remove(this._activeCamerasChangedObserver),this._scene.imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingConfigurationObserver),super.dispose()}serialize(){const e=Te.p4.Serialize(this);return e.customType="DefaultRenderingPipeline",e}static Parse(e,t,i){return Te.p4.Parse((()=>new Nm(e._name,e._name._hdr,t)),e,t,i)}}(0,be.gn)([(0,Te.qC)()],Nm.prototype,"sharpenEnabled",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"bloomKernel",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"_bloomWeight",void 0),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"_bloomThreshold",void 0),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"_hdr",void 0),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"bloomWeight",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"bloomThreshold",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"bloomScale",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"bloomEnabled",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"depthOfFieldEnabled",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"depthOfFieldBlurLevel",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"fxaaEnabled",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"samples",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"imageProcessingEnabled",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"glowLayerEnabled",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"chromaticAberrationEnabled",null),(0,be.gn)([(0,Te.qC)()],Nm.prototype,"grainEnabled",null),(0,l.H)("BABYLON.DefaultRenderingPipeline",Nm);si.v.ShadersStore.lensHighlightsPixelShader="uniform sampler2D textureSampler; \nuniform float gain;\nuniform float threshold;\nuniform float screen_width;\nuniform float screen_height;\nvarying vec2 vUV;\nvec4 highlightColor(vec4 color) {\nvec4 highlight=color;\nfloat luminance=dot(highlight.rgb,vec3(0.2125,0.7154,0.0721));\nfloat lum_threshold;\nif (threshold>1.0) { lum_threshold=0.94+0.01*threshold; }\nelse { lum_threshold=0.5+0.44*threshold; }\nluminance=clamp((luminance-lum_threshold)*(1.0/(1.0-lum_threshold)),0.0,1.0);\nhighlight*=luminance*gain;\nhighlight.a=1.0;\nreturn highlight;\n}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\nvec4 original=texture2D(textureSampler,vUV);\nif (gain==-1.0) {\ngl_FragColor=vec4(0.0,0.0,0.0,1.0);\nreturn;\n}\nfloat w=2.0/screen_width;\nfloat h=2.0/screen_height;\nfloat weight=1.0;\nvec4 blurred=vec4(0.0,0.0,0.0,0.0);\n#ifdef PENTAGON\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-0.84*w,0.43*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(0.48*w,-1.29*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(0.61*w,1.51*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-1.55*w,-0.74*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.71*w,-0.52*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-0.94*w,1.59*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-0.40*w,-1.87*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.62*w,1.16*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.09*w,0.25*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.46*w,-1.71*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(0.08*w,2.42*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-1.85*w,-1.89*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(2.89*w,0.16*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.29*w,1.88*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(0.40*w,-2.81*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.54*w,2.26*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.60*w,-0.61*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(2.31*w,-1.30*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-0.83*w,2.53*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-1.12*w,-2.48*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(2.60*w,1.11*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.82*w,0.99*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.50*w,-2.81*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(0.85*w,3.33*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.94*w,-1.92*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(3.27*w,-0.53*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-1.95*w,2.48*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-0.23*w,-3.04*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(2.17*w,2.05*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.97*w,-0.04*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(2.25*w,-2.00*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-0.31*w,3.08*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-1.94*w,-2.59*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(3.37*w,0.64*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-3.13*w,1.93*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.03*w,-3.65*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.60*w,3.17*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-3.14*w,-1.19*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(3.00*w,-1.19*h)));\n#else\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-0.85*w,0.36*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(0.52*w,-1.14*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(0.46*w,1.42*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-1.46*w,-0.83*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.79*w,-0.42*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-1.11*w,1.62*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-0.29*w,-2.07*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.69*w,1.39*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.28*w,0.12*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.65*w,-1.69*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-0.08*w,2.44*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-1.63*w,-1.90*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(2.55*w,0.31*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.13*w,1.52*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(0.56*w,-2.61*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.38*w,2.34*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.64*w,-0.81*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(2.53*w,-1.21*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-1.06*w,2.63*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-1.00*w,-2.69*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(2.59*w,1.32*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.82*w,0.78*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.57*w,-2.50*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(0.54*w,2.93*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.39*w,-1.81*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(3.01*w,-0.28*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.04*w,2.25*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-0.02*w,-3.05*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(2.09*w,2.25*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-3.07*w,-0.25*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(2.44*w,-1.90*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-0.52*w,3.05*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-1.68*w,-2.61*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(3.01*w,0.79*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.76*w,1.46*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.05*w,-2.94*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(1.21*w,2.88*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(-2.84*w,-1.30*h)));\nblurred+=highlightColor(texture2D(textureSampler,vUV+vec2(2.98*w,-0.96*h)));\n#endif\nblurred/=39.0;\ngl_FragColor=blurred;\n}";si.v.ShadersStore.depthOfFieldPixelShader="uniform sampler2D textureSampler;\nuniform sampler2D highlightsSampler;\nuniform sampler2D depthSampler;\nuniform sampler2D grainSampler;\nuniform float grain_amount;\nuniform bool blur_noise;\nuniform float screen_width;\nuniform float screen_height;\nuniform float distortion;\nuniform bool dof_enabled;\nuniform float screen_distance; \nuniform float aperture;\nuniform float darken;\nuniform float edge_blur;\nuniform bool highlights;\nuniform float near;\nuniform float far;\nvarying vec2 vUV;\n#define PI 3.14159265\n#define TWOPI 6.28318530\n#define inverse_focal_length 0.1 \nvec2 centered_screen_pos;\nvec2 distorted_coords;\nfloat radius2;\nfloat radius;\nvec2 rand(vec2 co)\n{\nfloat noise1=(fract(sin(dot(co,vec2(12.9898,78.233)))*43758.5453));\nfloat noise2=(fract(sin(dot(co,vec2(12.9898,78.233)*2.0))*43758.5453));\nreturn clamp(vec2(noise1,noise2),0.0,1.0);\n}\nvec2 getDistortedCoords(vec2 coords) {\nif (distortion==0.0) { return coords; }\nvec2 direction=1.0*normalize(centered_screen_pos);\nvec2 dist_coords=vec2(0.5,0.5);\ndist_coords.x=0.5+direction.x*radius2*1.0;\ndist_coords.y=0.5+direction.y*radius2*1.0;\nfloat dist_amount=clamp(distortion*0.23,0.0,1.0);\ndist_coords=mix(coords,dist_coords,dist_amount);\nreturn dist_coords;\n}\nfloat sampleScreen(inout vec4 color,in vec2 offset,in float weight) {\nvec2 coords=distorted_coords;\nfloat angle=rand(coords*100.0).x*TWOPI;\ncoords+=vec2(offset.x*cos(angle)-offset.y*sin(angle),offset.x*sin(angle)+offset.y*cos(angle));\ncolor+=texture2D(textureSampler,coords)*weight;\nreturn weight;\n}\nfloat getBlurLevel(float size) {\nreturn min(3.0,ceil(size/1.0));\n}\nvec4 getBlurColor(float size) {\nvec4 col=texture2D(textureSampler,distorted_coords);\nfloat blur_level=getBlurLevel(size);\nfloat w=(size/screen_width);\nfloat h=(size/screen_height);\nfloat total_weight=1.0;\nvec2 sample_coords;\ntotal_weight+=sampleScreen(col,vec2(-0.50*w,0.24*h),0.93);\ntotal_weight+=sampleScreen(col,vec2(0.30*w,-0.75*h),0.90);\ntotal_weight+=sampleScreen(col,vec2(0.36*w,0.96*h),0.87);\ntotal_weight+=sampleScreen(col,vec2(-1.08*w,-0.55*h),0.85);\ntotal_weight+=sampleScreen(col,vec2(1.33*w,-0.37*h),0.83);\ntotal_weight+=sampleScreen(col,vec2(-0.82*w,1.31*h),0.80);\ntotal_weight+=sampleScreen(col,vec2(-0.31*w,-1.67*h),0.78);\ntotal_weight+=sampleScreen(col,vec2(1.47*w,1.11*h),0.76);\ntotal_weight+=sampleScreen(col,vec2(-1.97*w,0.19*h),0.74);\ntotal_weight+=sampleScreen(col,vec2(1.42*w,-1.57*h),0.72);\nif (blur_level>1.0) {\ntotal_weight+=sampleScreen(col,vec2(0.01*w,2.25*h),0.70);\ntotal_weight+=sampleScreen(col,vec2(-1.62*w,-1.74*h),0.67);\ntotal_weight+=sampleScreen(col,vec2(2.49*w,0.20*h),0.65);\ntotal_weight+=sampleScreen(col,vec2(-2.07*w,1.61*h),0.63);\ntotal_weight+=sampleScreen(col,vec2(0.46*w,-2.70*h),0.61);\ntotal_weight+=sampleScreen(col,vec2(1.55*w,2.40*h),0.59);\ntotal_weight+=sampleScreen(col,vec2(-2.88*w,-0.75*h),0.56);\ntotal_weight+=sampleScreen(col,vec2(2.73*w,-1.44*h),0.54);\ntotal_weight+=sampleScreen(col,vec2(-1.08*w,3.02*h),0.52);\ntotal_weight+=sampleScreen(col,vec2(-1.28*w,-3.05*h),0.49);\n}\nif (blur_level>2.0) {\ntotal_weight+=sampleScreen(col,vec2(3.11*w,1.43*h),0.46);\ntotal_weight+=sampleScreen(col,vec2(-3.36*w,1.08*h),0.44);\ntotal_weight+=sampleScreen(col,vec2(1.80*w,-3.16*h),0.41);\ntotal_weight+=sampleScreen(col,vec2(0.83*w,3.65*h),0.38);\ntotal_weight+=sampleScreen(col,vec2(-3.16*w,-2.19*h),0.34);\ntotal_weight+=sampleScreen(col,vec2(3.92*w,-0.53*h),0.31);\ntotal_weight+=sampleScreen(col,vec2(-2.59*w,3.12*h),0.26);\ntotal_weight+=sampleScreen(col,vec2(-0.20*w,-4.15*h),0.22);\ntotal_weight+=sampleScreen(col,vec2(3.02*w,3.00*h),0.15);\n}\ncol/=total_weight; \nif (darken>0.0) {\ncol.rgb*=clamp(0.3,1.0,1.05-size*0.5*darken);\n}\nreturn col;\n}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\ncentered_screen_pos=vec2(vUV.x-0.5,vUV.y-0.5);\nradius2=centered_screen_pos.x*centered_screen_pos.x+centered_screen_pos.y*centered_screen_pos.y;\nradius=sqrt(radius2);\ndistorted_coords=getDistortedCoords(vUV); \nvec2 texels_coords=vec2(vUV.x*screen_width,vUV.y*screen_height); \nfloat depth=texture2D(depthSampler,distorted_coords).r; \nfloat distance=near+(far-near)*depth; \nvec4 color=texture2D(textureSampler,vUV); \nfloat coc=abs(aperture*(screen_distance*(inverse_focal_length-1.0/distance)-1.0));\nif (dof_enabled==false || coc<0.07) { coc=0.0; }\nfloat edge_blur_amount=0.0;\nif (edge_blur>0.0) {\nedge_blur_amount=clamp((radius*2.0-1.0+0.15*edge_blur)*1.5,0.0,1.0)*1.3;\n}\nfloat blur_amount=max(edge_blur_amount,coc);\nif (blur_amount==0.0) {\ngl_FragColor=texture2D(textureSampler,distorted_coords);\n}\nelse {\ngl_FragColor=getBlurColor(blur_amount*1.7);\nif (highlights) {\ngl_FragColor.rgb+=clamp(coc,0.0,1.0)*texture2D(highlightsSampler,distorted_coords).rgb;\n}\nif (blur_noise) {\nvec2 noise=rand(distorted_coords)*0.01*blur_amount;\nvec2 blurred_coord=vec2(distorted_coords.x+noise.x,distorted_coords.y+noise.y);\ngl_FragColor=0.04*texture2D(textureSampler,blurred_coord)+0.96*gl_FragColor;\n}\n}\nif (grain_amount>0.0) {\nvec4 grain_color=texture2D(grainSampler,texels_coords*0.003);\ngl_FragColor.rgb+=(-0.5+grain_color.rgb)*0.30*grain_amount;\n}\n}\n";class Fm extends Dm{constructor(e,t,i,n=1,s){super(i.getEngine(),e),this.LensChromaticAberrationEffect="LensChromaticAberrationEffect",this.HighlightsEnhancingEffect="HighlightsEnhancingEffect",this.LensDepthOfFieldEffect="LensDepthOfFieldEffect",this._pentagonBokehIsEnabled=!1,this._scene=i,this._depthTexture=i.enableDepthRenderer().getDepthMap(),t.grain_texture?this._grainTexture=t.grain_texture:this._createGrainTexture(),this._edgeBlur=t.edge_blur?t.edge_blur:0,this._grainAmount=t.grain_amount?t.grain_amount:0,this._chromaticAberration=t.chromatic_aberration?t.chromatic_aberration:0,this._distortion=t.distortion?t.distortion:0,this._highlightsGain=void 0!==t.dof_gain?t.dof_gain:-1,this._highlightsThreshold=t.dof_threshold?t.dof_threshold:1,this._dofDistance=void 0!==t.dof_focus_distance?t.dof_focus_distance:-1,this._dofAperture=t.dof_aperture?t.dof_aperture:1,this._dofDarken=t.dof_darken?t.dof_darken:0,this._dofPentagon=void 0===t.dof_pentagon||t.dof_pentagon,this._blurNoise=void 0===t.blur_noise||t.blur_noise,this._createChromaticAberrationPostProcess(n),this._createHighlightsPostProcess(n),this._createDepthOfFieldPostProcess(n/4),this.addEffect(new am(i.getEngine(),this.LensChromaticAberrationEffect,(()=>this._chromaticAberrationPostProcess),!0)),this.addEffect(new am(i.getEngine(),this.HighlightsEnhancingEffect,(()=>this._highlightsPostProcess),!0)),this.addEffect(new am(i.getEngine(),this.LensDepthOfFieldEffect,(()=>this._depthOfFieldPostProcess),!0)),-1===this._highlightsGain&&this._disableEffect(this.HighlightsEnhancingEffect,null),i.postProcessRenderPipelineManager.addPipeline(this),s&&i.postProcessRenderPipelineManager.attachCamerasToRenderPipeline(e,s)}getClassName(){return"LensRenderingPipeline"}get scene(){return this._scene}get edgeBlur(){return this._edgeBlur}set edgeBlur(e){this.setEdgeBlur(e)}get grainAmount(){return this._grainAmount}set grainAmount(e){this.setGrainAmount(e)}get chromaticAberration(){return this._chromaticAberration}set chromaticAberration(e){this.setChromaticAberration(e)}get dofAperture(){return this._dofAperture}set dofAperture(e){this.setAperture(e)}get edgeDistortion(){return this._distortion}set edgeDistortion(e){this.setEdgeDistortion(e)}get dofDistortion(){return this._dofDistance}set dofDistortion(e){this.setFocusDistance(e)}get darkenOutOfFocus(){return this._dofDarken}set darkenOutOfFocus(e){this.setDarkenOutOfFocus(e)}get blurNoise(){return this._blurNoise}set blurNoise(e){this._blurNoise=e}get pentagonBokeh(){return this._pentagonBokehIsEnabled}set pentagonBokeh(e){e?this.enablePentagonBokeh():this.disablePentagonBokeh()}get highlightsGain(){return this._highlightsGain}set highlightsGain(e){this.setHighlightsGain(e)}get highlightsThreshold(){return this._highlightsThreshold}set highlightsThreshold(e){this.setHighlightsThreshold(e)}setEdgeBlur(e){this._edgeBlur=e}disableEdgeBlur(){this._edgeBlur=0}setGrainAmount(e){this._grainAmount=e}disableGrain(){this._grainAmount=0}setChromaticAberration(e){this._chromaticAberration=e}disableChromaticAberration(){this._chromaticAberration=0}setEdgeDistortion(e){this._distortion=e}disableEdgeDistortion(){this._distortion=0}setFocusDistance(e){this._dofDistance=e}disableDepthOfField(){this._dofDistance=-1}setAperture(e){this._dofAperture=e}setDarkenOutOfFocus(e){this._dofDarken=e}enablePentagonBokeh(){this._highlightsPostProcess.updateEffect("#define PENTAGON\n"),this._pentagonBokehIsEnabled=!0}disablePentagonBokeh(){this._pentagonBokehIsEnabled=!1,this._highlightsPostProcess.updateEffect()}enableNoiseBlur(){this._blurNoise=!0}disableNoiseBlur(){this._blurNoise=!1}setHighlightsGain(e){this._highlightsGain=e}setHighlightsThreshold(e){-1===this._highlightsGain&&(this._highlightsGain=1),this._highlightsThreshold=e}disableHighlights(){this._highlightsGain=-1}dispose(e=!1){this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name,this._scene.cameras),this._chromaticAberrationPostProcess=null,this._highlightsPostProcess=null,this._depthOfFieldPostProcess=null,this._grainTexture.dispose(),e&&this._scene.disableDepthRenderer()}_createChromaticAberrationPostProcess(e){this._chromaticAberrationPostProcess=new ni.D("LensChromaticAberration","chromaticAberration",["chromatic_aberration","screen_width","screen_height","direction","radialIntensity","centerPosition"],[],e,null,Ce.x.TRILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1),this._chromaticAberrationPostProcess.onApply=e=>{e.setFloat("chromatic_aberration",this._chromaticAberration),e.setFloat("screen_width",this._scene.getEngine().getRenderWidth()),e.setFloat("screen_height",this._scene.getEngine().getRenderHeight()),e.setFloat("radialIntensity",1),e.setFloat2("direction",17,17),e.setFloat2("centerPosition",.5,.5)}}_createHighlightsPostProcess(e){this._highlightsPostProcess=new ni.D("LensHighlights","lensHighlights",["gain","threshold","screen_width","screen_height"],[],e,null,Ce.x.TRILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,this._dofPentagon?"#define PENTAGON\n":""),this._highlightsPostProcess.externalTextureSamplerBinding=!0,this._highlightsPostProcess.onApply=e=>{e.setFloat("gain",this._highlightsGain),e.setFloat("threshold",this._highlightsThreshold),e.setTextureFromPostProcess("textureSampler",this._chromaticAberrationPostProcess),e.setFloat("screen_width",this._scene.getEngine().getRenderWidth()),e.setFloat("screen_height",this._scene.getEngine().getRenderHeight())}}_createDepthOfFieldPostProcess(e){this._depthOfFieldPostProcess=new ni.D("LensDepthOfField","depthOfField",["grain_amount","blur_noise","screen_width","screen_height","distortion","dof_enabled","screen_distance","aperture","darken","edge_blur","highlights","near","far"],["depthSampler","grainSampler","highlightsSampler"],e,null,Ce.x.TRILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1),this._depthOfFieldPostProcess.externalTextureSamplerBinding=!0,this._depthOfFieldPostProcess.onApply=e=>{e.setTexture("depthSampler",this._depthTexture),e.setTexture("grainSampler",this._grainTexture),e.setTextureFromPostProcess("textureSampler",this._highlightsPostProcess),e.setTextureFromPostProcess("highlightsSampler",this._depthOfFieldPostProcess),e.setFloat("grain_amount",this._grainAmount),e.setBool("blur_noise",this._blurNoise),e.setFloat("screen_width",this._scene.getEngine().getRenderWidth()),e.setFloat("screen_height",this._scene.getEngine().getRenderHeight()),e.setFloat("distortion",this._distortion),e.setBool("dof_enabled",-1!==this._dofDistance),e.setFloat("screen_distance",1/(.1-1/this._dofDistance)),e.setFloat("aperture",this._dofAperture),e.setFloat("darken",this._dofDarken),e.setFloat("edge_blur",this._edgeBlur),e.setBool("highlights",-1!==this._highlightsGain),this._scene.activeCamera&&(e.setFloat("near",this._scene.activeCamera.minZ),e.setFloat("far",this._scene.activeCamera.maxZ))}}_createGrainTexture(){this._grainTexture=new zi.c("LensNoiseTexture",512,this._scene,!1,Ce.x.BILINEAR_SAMPLINGMODE),this._grainTexture.wrapU=Ce.x.WRAP_ADDRESSMODE,this._grainTexture.wrapV=Ce.x.WRAP_ADDRESSMODE;const e=this._grainTexture.getContext();let t;for(let i=0;i<512;i++)for(let n=0;n<512;n++)t=Math.floor(255*(.42,.58,Math.random()*(.58-.42)+.42)),e.fillStyle="rgb("+t+", "+t+", "+t+")",e.fillRect(i,n,1,1);this._grainTexture.update(!1)}}class Lm{constructor(){this.enabled=!1,this.name="ssao2",this.texturesRequired=[6,5]}}si.v.ShadersStore.ssao2PixelShader="precision highp float;\nuniform sampler2D textureSampler;\nvarying vec2 vUV;\n#ifdef SSAO\nfloat scales[16]=float[16](\n0.1,\n0.11406250000000001,\n0.131640625,\n0.15625,\n0.187890625,\n0.2265625,\n0.272265625,\n0.325,\n0.384765625,\n0.4515625,\n0.525390625,\n0.60625,\n0.694140625,\n0.7890625,\n0.891015625,\n1.0\n);\nuniform float near;\nuniform float radius;\nuniform sampler2D depthSampler;\nuniform sampler2D randomSampler;\nuniform sampler2D normalSampler;\nuniform float randTextureTiles;\nuniform float samplesFactor;\nuniform vec3 sampleSphere[SAMPLES];\nuniform float totalStrength;\nuniform float base;\nuniform float xViewport;\nuniform float yViewport;\nuniform mat3 depthProjection;\nuniform float maxZ;\nuniform float minZAspect;\nuniform vec2 texelSize;\nuniform mat4 projection;\nvoid main()\n{\nvec3 random=textureLod(randomSampler,vUV*randTextureTiles,0.0).rgb;\nfloat depth=textureLod(depthSampler,vUV,0.0).r;\nfloat depthSign=depth/abs(depth);\ndepth=depth*depthSign;\nvec3 normal=textureLod(normalSampler,vUV,0.0).rgb;\nfloat occlusion=0.0;\nfloat correctedRadius=min(radius,minZAspect*depth/near);\nvec3 vViewRay=vec3((vUV.x*2.0-1.0)*xViewport,(vUV.y*2.0-1.0)*yViewport,depthSign);\nvec3 vDepthFactor=depthProjection*vec3(1.0,1.0,depth);\nvec3 origin=vViewRay*vDepthFactor;\nvec3 rvec=random*2.0-1.0;\nrvec.z=0.0;\nfloat dotProduct=dot(rvec,normal);\nrvec=1.0-abs(dotProduct)>1e-2 ? rvec : vec3(-rvec.y,0.0,rvec.x);\nvec3 tangent=normalize(rvec-normal*dot(rvec,normal));\nvec3 bitangent=cross(normal,tangent);\nmat3 tbn=mat3(tangent,bitangent,normal);\nfloat difference;\nfor (int i=0; i<SAMPLES; ++i) {\nvec3 samplePosition=scales[(i+int(random.x*16.0)) % 16]*tbn*sampleSphere[(i+int(random.y*16.0)) % 16];\nsamplePosition=samplePosition*correctedRadius+origin;\nvec4 offset=vec4(samplePosition,1.0);\noffset=projection*offset;\noffset.xyz/=offset.w;\noffset.xy=offset.xy*0.5+0.5;\nif (offset.x<0.0 || offset.y<0.0 || offset.x>1.0 || offset.y>1.0) {\ncontinue;\n}\nfloat sampleDepth=abs(textureLod(depthSampler,offset.xy,0.0).r);\ndifference=depthSign*samplePosition.z-sampleDepth;\nfloat rangeCheck=1.0-smoothstep(correctedRadius*0.5,correctedRadius,difference);\nocclusion+=step(EPSILON,difference)*rangeCheck;\n}\nocclusion=occlusion*(1.0-smoothstep(maxZ*0.75,maxZ,depth));\nfloat ao=1.0-totalStrength*occlusion*samplesFactor;\nfloat result=clamp(ao+base,0.0,1.0);\ngl_FragColor=vec4(vec3(result),1.0);\n}\n#endif\n#ifdef BLUR\nuniform float outSize;\nuniform float soften;\nuniform float tolerance;\nuniform int samples;\n#ifndef BLUR_BYPASS\nuniform sampler2D depthSampler;\n#ifdef BLUR_LEGACY\n#define inline\nfloat blur13Bilateral(sampler2D image,vec2 uv,vec2 step) {\nfloat result=0.0;\nvec2 off1=vec2(1.411764705882353)*step;\nvec2 off2=vec2(3.2941176470588234)*step;\nvec2 off3=vec2(5.176470588235294)*step;\nfloat compareDepth=abs(textureLod(depthSampler,uv,0.0).r);\nfloat sampleDepth;\nfloat weight;\nfloat weightSum=30.0;\nresult+=textureLod(image,uv,0.0).r*30.0;\nsampleDepth=abs(textureLod(depthSampler,uv+off1,0.0).r);\nweight=clamp(1.0/( 0.003+abs(compareDepth-sampleDepth)),0.0,30.0);\nweightSum+= weight;\nresult+=textureLod(image,uv+off1,0.0).r*weight;\nsampleDepth=abs(textureLod(depthSampler,uv-off1,0.0).r);\nweight=clamp(1.0/( 0.003+abs(compareDepth-sampleDepth)),0.0,30.0);\nweightSum+= weight;\nresult+=textureLod(image,uv-off1,0.0).r*weight;\nsampleDepth=abs(textureLod(depthSampler,uv+off2,0.0).r);\nweight=clamp(1.0/( 0.003+abs(compareDepth-sampleDepth)),0.0,30.0);\nweightSum+=weight;\nresult+=textureLod(image,uv+off2,0.0).r*weight;\nsampleDepth=abs(textureLod(depthSampler,uv-off2,0.0).r);\nweight=clamp(1.0/( 0.003+abs(compareDepth-sampleDepth)),0.0,30.0);\nweightSum+=weight;\nresult+=textureLod(image,uv-off2,0.0).r*weight;\nsampleDepth=abs(textureLod(depthSampler,uv+off3,0.0).r);\nweight=clamp(1.0/( 0.003+abs(compareDepth-sampleDepth)),0.0,30.0);\nweightSum+=weight;\nresult+=textureLod(image,uv+off3,0.0).r*weight;\nsampleDepth=abs(textureLod(depthSampler,uv-off3,0.0).r);\nweight=clamp(1.0/( 0.003+abs(compareDepth-sampleDepth)),0.0,30.0);\nweightSum+=weight;\nresult+=textureLod(image,uv-off3,0.0).r*weight;\nreturn result/weightSum;\n}\n#endif\n#endif\nvoid main()\n{\nfloat result=0.0;\n#ifdef BLUR_BYPASS\nresult=textureLod(textureSampler,vUV,0.0).r;\n#else\n#ifdef BLUR_H\nvec2 step=vec2(1.0/outSize,0.0);\n#else\nvec2 step=vec2(0.0,1.0/outSize);\n#endif\n#ifdef BLUR_LEGACY\nresult=blur13Bilateral(textureSampler,vUV,step);\n#else\nfloat compareDepth=abs(textureLod(depthSampler,vUV,0.0).r);\nfloat weightSum=0.0;\nfor (int i=-samples; i<samples; i+=2)\n{\nvec2 samplePos=vUV+step*(float(i)+0.5);\nfloat sampleDepth=abs(textureLod(depthSampler,samplePos,0.0).r);\nfloat falloff=smoothstep(0.0,\nfloat(samples),\nfloat(samples)-abs(float(i))*soften);\nfloat minDivider=tolerance*0.5+0.003;\nfloat weight=falloff/( minDivider+abs(compareDepth-sampleDepth));\nresult+=textureLod(textureSampler,samplePos,0.0).r*weight;\nweightSum+=weight;\n}\nresult/=weightSum;\n#endif\n#endif\ngl_FragColor.rgb=vec3(result);\ngl_FragColor.a=1.0;\n}\n#endif\n";si.v.ShadersStore.ssaoCombinePixelShader="uniform sampler2D textureSampler;\nuniform sampler2D originalColor;\nuniform vec4 viewport;\nvarying vec2 vUV;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\nvec4 ssaoColor=texture2D(textureSampler,viewport.xy+vUV*viewport.zw);\nvec4 sceneColor=texture2D(originalColor,vUV);\ngl_FragColor=sceneColor*ssaoColor;\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n";class Bm extends Dm{set epsilon(e){this._epsilon=e,this._ssaoPostProcess.updateEffect(this._getDefinesForSSAO())}get epsilon(){return this._epsilon}set samples(e){this._samples=e,this._ssaoPostProcess.updateEffect(this._getDefinesForSSAO()),this._sampleSphere=this._generateHemisphere()}get samples(){return this._samples}set textureSamples(e){this._textureSamples=e,this._prePassRenderer?this._prePassRenderer.samples=e:this._originalColorPostProcess.samples=e}get textureSamples(){return this._textureSamples}get _geometryBufferRenderer(){return this._forceGeometryBuffer?this._scene.geometryBufferRenderer:null}get _prePassRenderer(){return this._forceGeometryBuffer?null:this._scene.prePassRenderer}set bypassBlur(e){const t=this._getDefinesForBlur(this.expensiveBlur,e),i=this._getSamplersForBlur(e);this._blurHPostProcess.updateEffect(t.h,null,i),this._blurVPostProcess.updateEffect(t.v,null,i),this._bypassBlur=e}get bypassBlur(){return this._bypassBlur}set expensiveBlur(e){const t=this._getDefinesForBlur(e,this._bypassBlur);this._blurHPostProcess.updateEffect(t.h),this._blurVPostProcess.updateEffect(t.v),this._expensiveBlur=e}get expensiveBlur(){return this._expensiveBlur}static get IsSupported(){const e=A.l.LastCreatedEngine;return!!e&&e._features.supportSSAO2}get scene(){return this._scene}constructor(e,t,i,n,s=!1,r=0){if(super(t.getEngine(),e),this.SSAOOriginalSceneColorEffect="SSAOOriginalSceneColorEffect",this.SSAORenderEffect="SSAORenderEffect",this.SSAOBlurHRenderEffect="SSAOBlurHRenderEffect",this.SSAOBlurVRenderEffect="SSAOBlurVRenderEffect",this.SSAOCombineRenderEffect="SSAOCombineRenderEffect",this.totalStrength=1,this.maxZ=100,this.minZAspect=.2,this._epsilon=.02,this._samples=8,this._textureSamples=1,this._forceGeometryBuffer=!1,this.radius=2,this.base=0,this._bypassBlur=!1,this._expensiveBlur=!0,this.bilateralSamples=16,this.bilateralSoften=0,this.bilateralTolerance=0,this._bits=new Uint32Array(1),this._scene=t,this._ratio=i,this._textureType=r,this._forceGeometryBuffer=s,!this.isSupported)return void _.Y.Error("The current engine does not support SSAO 2.");const o=this._ratio.ssaoRatio||i,a=this._ratio.blurRatio||i;this._forceGeometryBuffer?t.enableGeometryBufferRenderer():t.enablePrePassRenderer(),this._createRandomTexture(),this._originalColorPostProcess=new ii.Q("SSAOOriginalSceneColor",1,null,Ce.x.BILINEAR_SAMPLINGMODE,t.getEngine(),void 0,this._textureType),this._originalColorPostProcess.samples=this.textureSamples,this._createSSAOPostProcess(1,r),this._createBlurPostProcess(o,a,this._textureType),this._createSSAOCombinePostProcess(a,this._textureType),this.addEffect(new am(t.getEngine(),this.SSAOOriginalSceneColorEffect,(()=>this._originalColorPostProcess),!0)),this.addEffect(new am(t.getEngine(),this.SSAORenderEffect,(()=>this._ssaoPostProcess),!0)),this.addEffect(new am(t.getEngine(),this.SSAOBlurHRenderEffect,(()=>this._blurHPostProcess),!0)),this.addEffect(new am(t.getEngine(),this.SSAOBlurVRenderEffect,(()=>this._blurVPostProcess),!0)),this.addEffect(new am(t.getEngine(),this.SSAOCombineRenderEffect,(()=>this._ssaoCombinePostProcess),!0)),t.postProcessRenderPipelineManager.addPipeline(this),n&&t.postProcessRenderPipelineManager.attachCamerasToRenderPipeline(e,n)}getClassName(){return"SSAO2RenderingPipeline"}dispose(e=!1){for(let e=0;e<this._scene.cameras.length;e++){const t=this._scene.cameras[e];this._originalColorPostProcess.dispose(t),this._ssaoPostProcess.dispose(t),this._blurHPostProcess.dispose(t),this._blurVPostProcess.dispose(t),this._ssaoCombinePostProcess.dispose(t)}this._randomTexture.dispose(),e&&this._scene.disableGeometryBufferRenderer(),this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name,this._scene.cameras),super.dispose()}_rebuild(){super._rebuild()}_getSamplersForBlur(e){return e?["textureSampler"]:["textureSampler","depthSampler"]}_getDefinesForBlur(e,t){let i="#define BLUR\n";return t&&(i+="#define BLUR_BYPASS\n"),e||(i+="#define BLUR_LEGACY\n"),{h:i+"#define BLUR_H\n",v:i}}_createBlurPostProcess(e,t,i){const n=this._getDefinesForBlur(this.expensiveBlur,this.bypassBlur),s=this._getSamplersForBlur(this.bypassBlur);this._blurHPostProcess=this._createBlurFilter("BlurH",s,e,n.h,i,!0),this._blurVPostProcess=this._createBlurFilter("BlurV",s,t,n.v,i,!1)}_createBlurFilter(e,t,i,n,s,r){const o=new ni.D(e,"ssao2",["outSize","samples","soften","tolerance"],t,i,null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,n,s);return o.onApply=e=>{if(!this._scene.activeCamera)return;const t=r?this._ssaoCombinePostProcess.width:this._ssaoCombinePostProcess.height,i=r?this._originalColorPostProcess.width:this._originalColorPostProcess.height;e.setFloat("outSize",t>0?t:i),e.setInt("samples",this.bilateralSamples),e.setFloat("soften",this.bilateralSoften),e.setFloat("tolerance",this.bilateralTolerance),this._geometryBufferRenderer?e.setTexture("depthSampler",this._geometryBufferRenderer.getGBuffer().textures[0]):this._prePassRenderer&&e.setTexture("depthSampler",this._prePassRenderer.getRenderTarget().textures[this._prePassRenderer.getIndex(5)])},o.samples=this.textureSamples,o}_radicalInverse_VdC(e){return this._bits[0]=e,this._bits[0]=(this._bits[0]<<16|this._bits[0]>>16)>>>0,this._bits[0]=(1431655765&this._bits[0])<<1|(2863311530&this._bits[0])>>>1>>>0,this._bits[0]=(858993459&this._bits[0])<<2|(3435973836&this._bits[0])>>>2>>>0,this._bits[0]=(252645135&this._bits[0])<<4|(4042322160&this._bits[0])>>>4>>>0,this._bits[0]=(16711935&this._bits[0])<<8|(4278255360&this._bits[0])>>>8>>>0,2.3283064365386963e-10*this._bits[0]}_hammersley(e,t){return[e/t,this._radicalInverse_VdC(e)]}_hemisphereSample_uniform(e,t){const i=2*t*Math.PI,n=1-.85*e,s=Math.sqrt(1-n*n);return new o.P(Math.cos(i)*s,Math.sin(i)*s,n)}_generateHemisphere(){const e=this.samples,t=[];let i,n=0;for(;n<e;){if(e<16)i=this._hemisphereSample_uniform(Math.random(),Math.random());else{const t=this._hammersley(n,e);i=this._hemisphereSample_uniform(t[0],t[1])}t.push(i.x,i.y,i.z),n++}return t}_getDefinesForSSAO(){return`#define SSAO\n#define SAMPLES ${this.samples}\n#define EPSILON ${this.epsilon.toFixed(4)}`}_createSSAOPostProcess(e,t){this._sampleSphere=this._generateHemisphere();const i=this._getDefinesForSSAO();this._ssaoPostProcess=new ni.D("ssao2","ssao2",["sampleSphere","samplesFactor","randTextureTiles","totalStrength","radius","base","range","projection","near","texelSize","xViewport","yViewport","maxZ","minZAspect","depthProjection"],["randomSampler","depthSampler","normalSampler"],e,null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,i,t),this._ssaoPostProcess.onApply=e=>{var t,i,n,s;if(this._scene.activeCamera){if(e.setArray3("sampleSphere",this._sampleSphere),e.setFloat("randTextureTiles",32),e.setFloat("samplesFactor",1/this.samples),e.setFloat("totalStrength",this.totalStrength),e.setFloat2("texelSize",1/this._ssaoPostProcess.width,1/this._ssaoPostProcess.height),e.setFloat("radius",this.radius),e.setFloat("maxZ",this.maxZ),e.setFloat("minZAspect",this.minZAspect),e.setFloat("base",this.base),e.setFloat("near",this._scene.activeCamera.minZ),this._scene.activeCamera.mode===Mt.V.PERSPECTIVE_CAMERA)e.setMatrix3x3("depthProjection",Bm.PERSPECTIVE_DEPTH_PROJECTION),e.setFloat("xViewport",Math.tan(this._scene.activeCamera.fov/2)*this._scene.getEngine().getAspectRatio(this._scene.activeCamera,!0)),e.setFloat("yViewport",Math.tan(this._scene.activeCamera.fov/2));else{const r=this._scene.getEngine().getRenderWidth()/2,o=this._scene.getEngine().getRenderHeight()/2,a=null!==(t=this._scene.activeCamera.orthoLeft)&&void 0!==t?t:-r,l=null!==(i=this._scene.activeCamera.orthoRight)&&void 0!==i?i:r,h=null!==(n=this._scene.activeCamera.orthoBottom)&&void 0!==n?n:-o,c=null!==(s=this._scene.activeCamera.orthoTop)&&void 0!==s?s:o;e.setMatrix3x3("depthProjection",Bm.ORTHO_DEPTH_PROJECTION),e.setFloat("xViewport",.5*(l-a)),e.setFloat("yViewport",.5*(c-h))}e.setMatrix("projection",this._scene.getProjectionMatrix()),this._geometryBufferRenderer?(e.setTexture("depthSampler",this._geometryBufferRenderer.getGBuffer().textures[0]),e.setTexture("normalSampler",this._geometryBufferRenderer.getGBuffer().textures[1])):this._prePassRenderer&&(e.setTexture("depthSampler",this._prePassRenderer.getRenderTarget().textures[this._prePassRenderer.getIndex(5)]),e.setTexture("normalSampler",this._prePassRenderer.getRenderTarget().textures[this._prePassRenderer.getIndex(6)])),e.setTexture("randomSampler",this._randomTexture)}},this._ssaoPostProcess.samples=this.textureSamples,this._forceGeometryBuffer||(this._ssaoPostProcess._prePassEffectConfiguration=new Lm)}_createSSAOCombinePostProcess(e,t){this._ssaoCombinePostProcess=new ni.D("ssaoCombine","ssaoCombine",[],["originalColor","viewport"],e,null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,void 0,t),this._ssaoCombinePostProcess.onApply=e=>{const t=this._scene.activeCamera.viewport;e.setVector4("viewport",o.jp.Vector4[0].copyFromFloats(t.x,t.y,t.width,t.height)),e.setTextureFromPostProcessOutput("originalColor",this._originalColorPostProcess)},this._ssaoCombinePostProcess.samples=this.textureSamples}_createRandomTexture(){this._randomTexture=new zi.c("SSAORandomTexture",128,this._scene,!1,Ce.x.BILINEAR_SAMPLINGMODE),this._randomTexture.wrapU=Ce.x.WRAP_ADDRESSMODE,this._randomTexture.wrapV=Ce.x.WRAP_ADDRESSMODE;const e=this._randomTexture.getContext(),t=(e,t)=>Math.random()*(t-e)+e,i=o.P.Zero();for(let n=0;n<128;n++)for(let s=0;s<128;s++)i.x=t(0,1),i.y=t(0,1),i.z=0,i.normalize(),i.scaleInPlace(255),i.x=Math.floor(i.x),i.y=Math.floor(i.y),e.fillStyle="rgb("+i.x+", "+i.y+", "+i.z+")",e.fillRect(n,s,1,1);this._randomTexture.update(!1)}serialize(){const e=Te.p4.Serialize(this);return e.customType="SSAO2RenderingPipeline",e}static Parse(e,t,i){return Te.p4.Parse((()=>new Bm(e._name,t,e._ratio,void 0,e._forceGeometryBuffer,e._textureType)),e,t,i)}}Bm.ORTHO_DEPTH_PROJECTION=[1,0,0,0,1,0,0,0,1],Bm.PERSPECTIVE_DEPTH_PROJECTION=[0,0,0,0,0,0,1,1,1],(0,be.gn)([(0,Te.qC)()],Bm.prototype,"totalStrength",void 0),(0,be.gn)([(0,Te.qC)()],Bm.prototype,"maxZ",void 0),(0,be.gn)([(0,Te.qC)()],Bm.prototype,"minZAspect",void 0),(0,be.gn)([(0,Te.qC)("epsilon")],Bm.prototype,"_epsilon",void 0),(0,be.gn)([(0,Te.qC)("samples")],Bm.prototype,"_samples",void 0),(0,be.gn)([(0,Te.qC)("textureSamples")],Bm.prototype,"_textureSamples",void 0),(0,be.gn)([(0,Te.qC)()],Bm.prototype,"_forceGeometryBuffer",void 0),(0,be.gn)([(0,Te.qC)()],Bm.prototype,"_ratio",void 0),(0,be.gn)([(0,Te.qC)()],Bm.prototype,"_textureType",void 0),(0,be.gn)([(0,Te.qC)()],Bm.prototype,"radius",void 0),(0,be.gn)([(0,Te.qC)()],Bm.prototype,"base",void 0),(0,be.gn)([(0,Te.qC)("bypassBlur")],Bm.prototype,"_bypassBlur",void 0),(0,be.gn)([(0,Te.qC)("expensiveBlur")],Bm.prototype,"_expensiveBlur",void 0),(0,be.gn)([(0,Te.qC)()],Bm.prototype,"bilateralSamples",void 0),(0,be.gn)([(0,Te.qC)()],Bm.prototype,"bilateralSoften",void 0),(0,be.gn)([(0,Te.qC)()],Bm.prototype,"bilateralTolerance",void 0),(0,l.H)("BABYLON.SSAO2RenderingPipeline",Bm);si.v.ShadersStore.ssaoPixelShader="uniform sampler2D textureSampler;\nvarying vec2 vUV;\n#ifdef SSAO\nuniform sampler2D randomSampler;\nuniform float randTextureTiles;\nuniform float samplesFactor;\nuniform vec3 sampleSphere[SAMPLES];\nuniform float totalStrength;\nuniform float radius;\nuniform float area;\nuniform float fallOff;\nuniform float base;\nvec3 normalFromDepth(float depth,vec2 coords)\n{\nvec2 offset1=vec2(0.0,radius);\nvec2 offset2=vec2(radius,0.0);\nfloat depth1=texture2D(textureSampler,coords+offset1).r;\nfloat depth2=texture2D(textureSampler,coords+offset2).r;\nvec3 p1=vec3(offset1,depth1-depth);\nvec3 p2=vec3(offset2,depth2-depth);\nvec3 normal=cross(p1,p2);\nnormal.z=-normal.z;\nreturn normalize(normal);\n}\nvoid main()\n{\nvec3 random=normalize(texture2D(randomSampler,vUV*randTextureTiles).rgb);\nfloat depth=texture2D(textureSampler,vUV).r;\nvec3 position=vec3(vUV,depth);\nvec3 normal=normalFromDepth(depth,vUV);\nfloat radiusDepth=radius/depth;\nfloat occlusion=0.0;\nvec3 ray;\nvec3 hemiRay;\nfloat occlusionDepth;\nfloat difference;\nfor (int i=0; i<SAMPLES; i++)\n{\nray=radiusDepth*reflect(sampleSphere[i],random);\nhemiRay=position+sign(dot(ray,normal))*ray;\nocclusionDepth=texture2D(textureSampler,clamp(hemiRay.xy,vec2(0.001,0.001),vec2(0.999,0.999))).r;\ndifference=depth-occlusionDepth;\nocclusion+=step(fallOff,difference)*(1.0-smoothstep(fallOff,area,difference));\n}\nfloat ao=1.0-totalStrength*occlusion*samplesFactor;\nfloat result=clamp(ao+base,0.0,1.0);\ngl_FragColor.r=result;\ngl_FragColor.g=result;\ngl_FragColor.b=result;\ngl_FragColor.a=1.0;\n}\n#endif\n";class Um extends Dm{get scene(){return this._scene}constructor(e,t,i,n){super(t.getEngine(),e),this.SSAOOriginalSceneColorEffect="SSAOOriginalSceneColorEffect",this.SSAORenderEffect="SSAORenderEffect",this.SSAOBlurHRenderEffect="SSAOBlurHRenderEffect",this.SSAOBlurVRenderEffect="SSAOBlurVRenderEffect",this.SSAOCombineRenderEffect="SSAOCombineRenderEffect",this.totalStrength=1,this.radius=1e-4,this.area=.0075,this.fallOff=1e-6,this.base=.5,this._firstUpdate=!0,this._scene=t,this._createRandomTexture();const s=i.ssaoRatio||i,r=i.combineRatio||i;this._originalColorPostProcess=new ii.Q("SSAOOriginalSceneColor",r,null,Ce.x.BILINEAR_SAMPLINGMODE,t.getEngine(),!1),this._createSSAOPostProcess(s),this._createBlurPostProcess(s),this._createSSAOCombinePostProcess(r),this.addEffect(new am(t.getEngine(),this.SSAOOriginalSceneColorEffect,(()=>this._originalColorPostProcess),!0)),this.addEffect(new am(t.getEngine(),this.SSAORenderEffect,(()=>this._ssaoPostProcess),!0)),this.addEffect(new am(t.getEngine(),this.SSAOBlurHRenderEffect,(()=>this._blurHPostProcess),!0)),this.addEffect(new am(t.getEngine(),this.SSAOBlurVRenderEffect,(()=>this._blurVPostProcess),!0)),this.addEffect(new am(t.getEngine(),this.SSAOCombineRenderEffect,(()=>this._ssaoCombinePostProcess),!0)),t.postProcessRenderPipelineManager.addPipeline(this),n&&t.postProcessRenderPipelineManager.attachCamerasToRenderPipeline(e,n)}_attachCameras(e,t){super._attachCameras(e,t);for(const e of this._cameras)this._scene.enableDepthRenderer(e).getDepthMap()}getClassName(){return"SSAORenderingPipeline"}dispose(e=!1){for(let e=0;e<this._scene.cameras.length;e++){const t=this._scene.cameras[e];this._originalColorPostProcess.dispose(t),this._ssaoPostProcess.dispose(t),this._blurHPostProcess.dispose(t),this._blurVPostProcess.dispose(t),this._ssaoCombinePostProcess.dispose(t)}this._randomTexture.dispose(),e&&this._scene.disableDepthRenderer(),this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name,this._scene.cameras),super.dispose()}_createBlurPostProcess(e){this._blurHPostProcess=new wa("BlurH",new o.FM(1,0),16,e,null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,0),this._blurVPostProcess=new wa("BlurV",new o.FM(0,1),16,e,null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,0),this._blurHPostProcess.onActivateObservable.add((()=>{const e=this._blurHPostProcess.width/this._scene.getEngine().getRenderWidth();this._blurHPostProcess.kernel=16*e})),this._blurVPostProcess.onActivateObservable.add((()=>{const e=this._blurVPostProcess.height/this._scene.getEngine().getRenderHeight();this._blurVPostProcess.kernel=16*e}))}_rebuild(){this._firstUpdate=!0,super._rebuild()}_createSSAOPostProcess(e){const t=[.5381,.1856,-.4319,.1379,.2486,.443,.3371,.5679,-.0057,-.6999,-.0451,-.0019,.0689,-.1598,-.8547,.056,.0069,-.1843,-.0146,.1402,.0762,.01,-.1924,-.0344,-.3577,-.5301,-.4358,-.3169,.1063,.0158,.0103,-.5869,.0046,-.0897,-.494,.3287,.7119,-.0154,-.0918,-.0533,.0596,-.5411,.0352,-.0631,.546,-.4776,.2847,-.0271];this._ssaoPostProcess=new ni.D("ssao","ssao",["sampleSphere","samplesFactor","randTextureTiles","totalStrength","radius","area","fallOff","base","range","viewport"],["randomSampler"],e,null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1,"#define SAMPLES 16\n#define SSAO"),this._ssaoPostProcess.externalTextureSamplerBinding=!0,this._ssaoPostProcess.onApply=e=>{this._firstUpdate&&(e.setArray3("sampleSphere",t),e.setFloat("samplesFactor",.0625),e.setFloat("randTextureTiles",4)),e.setFloat("totalStrength",this.totalStrength),e.setFloat("radius",this.radius),e.setFloat("area",this.area),e.setFloat("fallOff",this.fallOff),e.setFloat("base",this.base),e.setTexture("textureSampler",this._scene.enableDepthRenderer(this._scene.activeCamera).getDepthMap()),e.setTexture("randomSampler",this._randomTexture)}}_createSSAOCombinePostProcess(e){this._ssaoCombinePostProcess=new ni.D("ssaoCombine","ssaoCombine",[],["originalColor","viewport"],e,null,Ce.x.BILINEAR_SAMPLINGMODE,this._scene.getEngine(),!1),this._ssaoCombinePostProcess.onApply=e=>{e.setVector4("viewport",o.jp.Vector4[0].copyFromFloats(0,0,1,1)),e.setTextureFromPostProcess("originalColor",this._originalColorPostProcess)}}_createRandomTexture(){this._randomTexture=new zi.c("SSAORandomTexture",512,this._scene,!1,Ce.x.TRILINEAR_SAMPLINGMODE),this._randomTexture.wrapU=Ce.x.WRAP_ADDRESSMODE,this._randomTexture.wrapV=Ce.x.WRAP_ADDRESSMODE;const e=this._randomTexture.getContext(),t=(e,t)=>Math.random()*(t-e)+e,i=o.P.Zero();for(let n=0;n<512;n++)for(let s=0;s<512;s++)i.x=Math.floor(255*Math.max(0,t(-1,1))),i.y=Math.floor(255*Math.max(0,t(-1,1))),i.z=Math.floor(255*Math.max(0,t(-1,1))),e.fillStyle="rgb("+i.x+", "+i.y+", "+i.z+")",e.fillRect(n,s,1,1);this._randomTexture.update(!1)}}(0,be.gn)([(0,Te.qC)()],Um.prototype,"totalStrength",void 0),(0,be.gn)([(0,Te.qC)()],Um.prototype,"radius",void 0),(0,be.gn)([(0,Te.qC)()],Um.prototype,"area",void 0),(0,be.gn)([(0,Te.qC)()],Um.prototype,"fallOff",void 0),(0,be.gn)([(0,Te.qC)()],Um.prototype,"base",void 0);class Vm{constructor(){this.enabled=!1,this.name="screenSpaceReflections",this.texturesRequired=[6,3,1]}}si.v.ShadersStore.screenSpaceReflectionPixelShader="uniform sampler2D textureSampler;\n#ifdef SSR_SUPPORTED\nuniform sampler2D reflectivitySampler;\nuniform sampler2D normalSampler;\nuniform sampler2D positionSampler;\n#endif\nuniform mat4 view;\nuniform mat4 projection;\nuniform float stepSize;\nuniform float strength;\nuniform float threshold;\nuniform float roughnessFactor;\nuniform float reflectionSpecularFalloffExponent;\nvarying vec2 vUV;\n#ifdef SSR_SUPPORTED\nstruct ReflectionInfo {\nvec3 color;\nvec4 coords;\n};\n/**\n* According to specular,see https:\n*/\nvec3 fresnelSchlick(float cosTheta,vec3 F0)\n{\nreturn F0+(1.0-F0)*pow(1.0-cosTheta,5.0);\n}\n/**\n* Once the pixel's coordinates has been found,let's adjust (smooth) a little bit\n* by sampling multiple reflection pixels.\n*/\nReflectionInfo smoothReflectionInfo(vec3 dir,vec3 hitCoord)\n{\nReflectionInfo info;\ninfo.color=vec3(0.0);\nvec4 projectedCoord;\nfloat sampledDepth;\nfor(int i=0; i<SMOOTH_STEPS; i++)\n{\nprojectedCoord=projection*vec4(hitCoord,1.0);\nprojectedCoord.xy/=projectedCoord.w;\nprojectedCoord.xy=0.5*projectedCoord.xy+vec2(0.5);\nsampledDepth=(view*texture2D(positionSampler,projectedCoord.xy)).z;\nfloat depth=sampledDepth-hitCoord.z;\ndir*=0.5;\nif(depth>0.0)\nhitCoord-=dir;\nelse\nhitCoord+=dir;\ninfo.color+=texture2D(textureSampler,projectedCoord.xy).rgb;\n}\nprojectedCoord=projection*vec4(hitCoord,1.0);\nprojectedCoord.xy/=projectedCoord.w;\nprojectedCoord.xy=0.5*projectedCoord.xy+vec2(0.5);\ninfo.coords=vec4(projectedCoord.xy,sampledDepth,1.0);\ninfo.color+=texture2D(textureSampler,projectedCoord.xy).rgb;\ninfo.color/=float(SMOOTH_STEPS+1);\nreturn info;\n}\n/**\n* Tests the given world position (hitCoord) according to the given reflection vector (dir)\n* until it finds a collision (means that depth is enough close to say \"it's the pixel to sample!\").\n*/\nReflectionInfo getReflectionInfo(vec3 dir,vec3 hitCoord)\n{\nReflectionInfo info;\nvec4 projectedCoord;\nfloat sampledDepth;\ndir*=stepSize;\nfor(int i=0; i<REFLECTION_SAMPLES; i++)\n{\nhitCoord+=dir;\nprojectedCoord=projection*vec4(hitCoord,1.0);\nprojectedCoord.xy/=projectedCoord.w;\nprojectedCoord.xy=0.5*projectedCoord.xy+vec2(0.5);\nsampledDepth=(view*texture2D(positionSampler,projectedCoord.xy)).z;\nfloat depth=sampledDepth-hitCoord.z;\n#ifdef RIGHT_HANDED_SCENE\ndepth*=-1.0;\n#endif\nif(((depth-dir.z)<threshold) && depth<=0.0)\n{\n#ifdef ENABLE_SMOOTH_REFLECTIONS\nreturn smoothReflectionInfo(dir,hitCoord);\n#else\ninfo.color=texture2D(textureSampler,projectedCoord.xy).rgb;\ninfo.coords=vec4(projectedCoord.xy,sampledDepth,0.0);\nreturn info;\n#endif\n}\n}\ninfo.color=texture2D(textureSampler,projectedCoord.xy).rgb;\ninfo.coords=vec4(projectedCoord.xy,sampledDepth,0.0);\nreturn info;\n}\nvec3 hash(vec3 a)\n{\na=fract(a*0.8);\na+=dot(a,a.yxz+19.19);\nreturn fract((a.xxy+a.yxx)*a.zyx);\n}\n#endif\nvoid main()\n{\n#ifdef SSR_SUPPORTED\nvec4 albedoFull=texture2D(textureSampler,vUV);\nvec3 albedo=albedoFull.rgb;\nfloat spec=texture2D(reflectivitySampler,vUV).r;\nif (spec==0.0) {\ngl_FragColor=albedoFull;\nreturn;\n}\nvec3 normal=(texture2D(normalSampler,vUV)).xyz;\nvec3 position=(view*texture2D(positionSampler,vUV)).xyz;\nvec3 reflected=normalize(reflect(normalize(position),normalize(normal)));\nfloat roughness=1.0-texture2D(reflectivitySampler,vUV).a;\nvec3 jitt=mix(vec3(0.0),hash(position),roughness)*roughnessFactor;\nReflectionInfo info=getReflectionInfo(jitt+reflected,position);\nvec2 dCoords=smoothstep(0.2,0.6,abs(vec2(0.5,0.5)-info.coords.xy));\nfloat screenEdgefactor=clamp(1.0-(dCoords.x+dCoords.y),0.0,1.0);\nvec3 F0=vec3(0.04);\nF0 =mix(F0,albedo,spec);\nvec3 fresnel=fresnelSchlick(max(dot(normalize(normal),normalize(position)),0.0),F0);\n#ifdef RIGHT_HANDED_SCENE\nreflected.z*=-1.0;\n#endif\nfloat reflectionMultiplier=clamp(pow(spec*strength,reflectionSpecularFalloffExponent)*screenEdgefactor*reflected.z,0.0,0.9);\nfloat albedoMultiplier=1.0-reflectionMultiplier;\nvec3 SSR=info.color*fresnel;\ngl_FragColor=vec4((albedo*albedoMultiplier)+(SSR*reflectionMultiplier),albedoFull.a);\n#else\ngl_FragColor=texture2D(textureSampler,vUV);\n#endif\n}\n";class km extends ni.D{get _geometryBufferRenderer(){return this._forceGeometryBuffer?this._scene.geometryBufferRenderer:null}get _prePassRenderer(){return this._forceGeometryBuffer?null:this._scene.prePassRenderer}getClassName(){return"ScreenSpaceReflectionPostProcess"}constructor(e,t,i,n,s,r,o,a=0,l=!1,h=!1){if(super(e,"screenSpaceReflection",["projection","view","threshold","reflectionSpecularFalloffExponent","strength","stepSize","roughnessFactor"],["textureSampler","normalSampler","positionSampler","reflectivitySampler"],i,n,s,r,o,"#define SSR_SUPPORTED\n#define REFLECTION_SAMPLES 64\n#define SMOOTH_STEPS 5\n",a,void 0,null,l),this.threshold=1.2,this.strength=1,this.reflectionSpecularFalloffExponent=3,this.step=1,this.roughnessFactor=.2,this._forceGeometryBuffer=!1,this._enableSmoothReflections=!1,this._reflectionSamples=64,this._smoothSteps=5,this._forceGeometryBuffer=h,this._forceGeometryBuffer){const e=t.enableGeometryBufferRenderer();e&&e.isSupported&&(e.enablePosition=!0,e.enableReflectivity=!0)}else{const e=t.enablePrePassRenderer();null==e||e.markAsDirty(),this._prePassEffectConfiguration=new Vm}this._updateEffectDefines(),this.onApply=e=>{const i=this._geometryBufferRenderer,n=this._prePassRenderer;if(!n&&!i)return;if(i){const t=i.getTextureIndex(Cm.POSITION_TEXTURE_TYPE),n=i.getTextureIndex(Cm.REFLECTIVITY_TEXTURE_TYPE);e.setTexture("normalSampler",i.getGBuffer().textures[1]),e.setTexture("positionSampler",i.getGBuffer().textures[t]),e.setTexture("reflectivitySampler",i.getGBuffer().textures[n])}else if(n){const t=n.getIndex(1),i=n.getIndex(3),s=n.getIndex(6);e.setTexture("normalSampler",n.getRenderTarget().textures[s]),e.setTexture("positionSampler",n.getRenderTarget().textures[t]),e.setTexture("reflectivitySampler",n.getRenderTarget().textures[i])}const s=t.activeCamera;if(!s)return;const r=s.getViewMatrix(!0),o=s.getProjectionMatrix(!0);e.setMatrix("projection",o),e.setMatrix("view",r),e.setFloat("threshold",this.threshold),e.setFloat("reflectionSpecularFalloffExponent",this.reflectionSpecularFalloffExponent),e.setFloat("strength",this.strength),e.setFloat("stepSize",this.step),e.setFloat("roughnessFactor",this.roughnessFactor)},this._isSceneRightHanded=t.useRightHandedSystem}get enableSmoothReflections(){return this._enableSmoothReflections}set enableSmoothReflections(e){e!==this._enableSmoothReflections&&(this._enableSmoothReflections=e,this._updateEffectDefines())}get reflectionSamples(){return this._reflectionSamples}set reflectionSamples(e){e!==this._reflectionSamples&&(this._reflectionSamples=e,this._updateEffectDefines())}get smoothSteps(){return this._smoothSteps}set smoothSteps(e){e!==this._smoothSteps&&(this._smoothSteps=e,this._updateEffectDefines())}_updateEffectDefines(){const e=[];(this._geometryBufferRenderer||this._prePassRenderer)&&e.push("#define SSR_SUPPORTED"),this._enableSmoothReflections&&e.push("#define ENABLE_SMOOTH_REFLECTIONS"),this._isSceneRightHanded&&e.push("#define RIGHT_HANDED_SCENE"),e.push("#define REFLECTION_SAMPLES "+(this._reflectionSamples>>0)),e.push("#define SMOOTH_STEPS "+(this._smoothSteps>>0)),this.updateEffect(e.join("\n"))}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new km(e.name,i,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.textureType,e.reusable)),e,i,n)}}(0,be.gn)([(0,Te.qC)()],km.prototype,"threshold",void 0),(0,be.gn)([(0,Te.qC)()],km.prototype,"strength",void 0),(0,be.gn)([(0,Te.qC)()],km.prototype,"reflectionSpecularFalloffExponent",void 0),(0,be.gn)([(0,Te.qC)()],km.prototype,"step",void 0),(0,be.gn)([(0,Te.qC)()],km.prototype,"roughnessFactor",void 0),(0,be.gn)([(0,Te.qC)()],km.prototype,"enableSmoothReflections",null),(0,be.gn)([(0,Te.qC)()],km.prototype,"reflectionSamples",null),(0,be.gn)([(0,Te.qC)()],km.prototype,"smoothSteps",null),(0,l.H)("BABYLON.ScreenSpaceReflectionPostProcess",km);si.v.ShadersStore.standardPixelShader="uniform sampler2D textureSampler;\nvarying vec2 vUV;\n#define CUSTOM_FRAGMENT_DEFINITIONS\n#if defined(PASS_POST_PROCESS)\nvoid main(void)\n{\nvec4 color=texture2D(textureSampler,vUV);\ngl_FragColor=color;\n}\n#endif\n#if defined(DOWN_SAMPLE_X4)\nuniform vec2 dsOffsets[16];\nvoid main(void)\n{\nvec4 average=vec4(0.0,0.0,0.0,0.0);\naverage=texture2D(textureSampler,vUV+dsOffsets[0]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[1]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[2]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[3]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[4]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[5]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[6]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[7]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[8]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[9]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[10]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[11]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[12]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[13]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[14]);\naverage+=texture2D(textureSampler,vUV+dsOffsets[15]);\naverage/=16.0;\ngl_FragColor=average;\n}\n#endif\n#if defined(BRIGHT_PASS)\nuniform vec2 dsOffsets[4];\nuniform float brightThreshold;\nvoid main(void)\n{\nvec4 average=vec4(0.0,0.0,0.0,0.0);\naverage=texture2D(textureSampler,vUV+vec2(dsOffsets[0].x,dsOffsets[0].y));\naverage+=texture2D(textureSampler,vUV+vec2(dsOffsets[1].x,dsOffsets[1].y));\naverage+=texture2D(textureSampler,vUV+vec2(dsOffsets[2].x,dsOffsets[2].y));\naverage+=texture2D(textureSampler,vUV+vec2(dsOffsets[3].x,dsOffsets[3].y));\naverage*=0.25;\nfloat luminance=length(average.rgb);\nif (luminance<brightThreshold) {\naverage=vec4(0.0,0.0,0.0,1.0);\n}\ngl_FragColor=average;\n}\n#endif\n#if defined(TEXTURE_ADDER)\nuniform sampler2D otherSampler;\nuniform sampler2D lensSampler;\nuniform float exposure;\nvoid main(void)\n{\nvec3 colour=texture2D(textureSampler,vUV).rgb;\ncolour*=exposure;\nvec3 X=max(vec3(0.0,0.0,0.0),colour-0.004);\nvec3 retColor=(X*(6.2*X+0.5))/(X*(6.2*X+1.7)+0.06);\ncolour=retColor*retColor;\ncolour+=colour*texture2D(lensSampler,vUV).rgb;\nvec4 finalColor=vec4(colour.rgb,1.0)+texture2D(otherSampler,vUV);\ngl_FragColor=finalColor;\n}\n#endif\n#if defined(VLS)\n#define PI 3.1415926535897932384626433832795\nuniform mat4 shadowViewProjection;\nuniform mat4 lightWorld;\nuniform vec3 cameraPosition;\nuniform vec3 sunDirection;\nuniform vec3 sunColor;\nuniform vec2 depthValues;\nuniform float scatteringCoefficient;\nuniform float scatteringPower;\nuniform sampler2D shadowMapSampler;\nuniform sampler2D positionSampler;\nfloat computeScattering(float lightDotView)\n{\nfloat result=1.0-scatteringCoefficient*scatteringCoefficient;\nresult/=(4.0*PI*pow(1.0+scatteringCoefficient*scatteringCoefficient-(2.0*scatteringCoefficient)*lightDotView,1.5));\nreturn result;\n}\nvoid main(void)\n{\nvec3 worldPos=texture2D(positionSampler,vUV).rgb;\nvec3 startPosition=cameraPosition;\nvec3 rayVector=worldPos-startPosition;\nfloat rayLength=length(rayVector);\nvec3 rayDirection=rayVector/rayLength;\nfloat stepLength=rayLength/NB_STEPS;\nvec3 stepL=rayDirection*stepLength;\nvec3 currentPosition=startPosition;\nvec3 accumFog=vec3(0.0);\nfor (int i=0; i<int(NB_STEPS); i++)\n{\nvec4 worldInShadowCameraSpace=shadowViewProjection*vec4(currentPosition,1.0);\nfloat depthMetric= (worldInShadowCameraSpace.z+depthValues.x)/(depthValues.y);\nfloat shadowPixelDepth=clamp(depthMetric,0.0,1.0);\nworldInShadowCameraSpace.xyz/=worldInShadowCameraSpace.w;\nworldInShadowCameraSpace.xyz=0.5*worldInShadowCameraSpace.xyz+vec3(0.5);\nfloat shadowMapValue=texture2D(shadowMapSampler,worldInShadowCameraSpace.xy).r;\nif (shadowMapValue>shadowPixelDepth)\naccumFog+=sunColor*computeScattering(dot(rayDirection,sunDirection));\ncurrentPosition+=stepL;\n}\naccumFog/=NB_STEPS;\nvec3 color=accumFog*scatteringPower;\ngl_FragColor=vec4(color*exp(color) ,1.0);\n}\n#endif\n#if defined(VLSMERGE)\nuniform sampler2D originalSampler;\nvoid main(void)\n{\ngl_FragColor=texture2D(originalSampler,vUV)+texture2D(textureSampler,vUV);\n}\n#endif\n#if defined(LUMINANCE)\nuniform vec2 lumOffsets[4];\nvoid main()\n{\nfloat average=0.0;\nvec4 color=vec4(0.0);\nfloat maximum=-1e20;\nvec3 weight=vec3(0.299,0.587,0.114);\nfor (int i=0; i<4; i++)\n{\ncolor=texture2D(textureSampler,vUV+ lumOffsets[i]);\nfloat GreyValue=dot(color.rgb,vec3(0.33,0.33,0.33));\n#ifdef WEIGHTED_AVERAGE\nfloat GreyValue=dot(color.rgb,weight);\n#endif\n#ifdef BRIGHTNESS\nfloat GreyValue=max(color.r,max(color.g,color.b));\n#endif\n#ifdef HSL_COMPONENT\nfloat GreyValue=0.5*(max(color.r,max(color.g,color.b))+min(color.r,min(color.g,color.b)));\n#endif\n#ifdef MAGNITUDE\nfloat GreyValue=length(color.rgb);\n#endif\nmaximum=max(maximum,GreyValue);\naverage+=(0.25*log(1e-5+GreyValue));\n}\naverage=exp(average);\ngl_FragColor=vec4(average,maximum,0.0,1.0);\n}\n#endif\n#if defined(LUMINANCE_DOWN_SAMPLE)\nuniform vec2 dsOffsets[9];\nuniform float halfDestPixelSize;\n#ifdef FINAL_DOWN_SAMPLER\n#include<packingFunctions>\n#endif\nvoid main()\n{\nvec4 color=vec4(0.0);\nfloat average=0.0;\nfor (int i=0; i<9; i++)\n{\ncolor=texture2D(textureSampler,vUV+vec2(halfDestPixelSize,halfDestPixelSize)+dsOffsets[i]);\naverage+=color.r;\n}\naverage/=9.0;\n#ifdef FINAL_DOWN_SAMPLER\ngl_FragColor=pack(average);\n#else\ngl_FragColor=vec4(average,average,0.0,1.0);\n#endif\n}\n#endif\n#if defined(HDR)\nuniform sampler2D textureAdderSampler;\nuniform float averageLuminance;\nvoid main()\n{\nvec4 color=texture2D(textureAdderSampler,vUV);\n#ifndef AUTO_EXPOSURE\nvec4 adjustedColor=color/averageLuminance;\ncolor=adjustedColor;\ncolor.a=1.0;\n#endif\ngl_FragColor=color;\n}\n#endif\n#if defined(LENS_FLARE)\n#define GHOSTS 3\nuniform sampler2D lensColorSampler;\nuniform float strength;\nuniform float ghostDispersal;\nuniform float haloWidth;\nuniform vec2 resolution;\nuniform float distortionStrength;\nfloat hash(vec2 p)\n{\nfloat h=dot(p,vec2(127.1,311.7));\nreturn -1.0+2.0*fract(sin(h)*43758.5453123);\n}\nfloat noise(in vec2 p)\n{\nvec2 i=floor(p);\nvec2 f=fract(p);\nvec2 u=f*f*(3.0-2.0*f);\nreturn mix(mix(hash(i+vec2(0.0,0.0)),\nhash(i+vec2(1.0,0.0)),u.x),\nmix(hash(i+vec2(0.0,1.0)),\nhash(i+vec2(1.0,1.0)),u.x),u.y);\n}\nfloat fbm(vec2 p)\n{\nfloat f=0.0;\nf+=0.5000*noise(p); p*=2.02;\nf+=0.2500*noise(p); p*=2.03;\nf+=0.1250*noise(p); p*=2.01;\nf+=0.0625*noise(p); p*=2.04;\nf/=0.9375;\nreturn f;\n}\nvec3 pattern(vec2 uv)\n{\nvec2 p=-1.0+2.0*uv;\nfloat p2=dot(p,p);\nfloat f=fbm(vec2(15.0*p2))/2.0;\nfloat r=0.2+0.6*sin(12.5*length(uv-vec2(0.5)));\nfloat g=0.2+0.6*sin(20.5*length(uv-vec2(0.5)));\nfloat b=0.2+0.6*sin(17.2*length(uv-vec2(0.5)));\nreturn (1.0-f)*vec3(r,g,b);\n}\nfloat luminance(vec3 color)\n{\nreturn dot(color.rgb,vec3(0.2126,0.7152,0.0722));\n}\nvec4 textureDistorted(sampler2D tex,vec2 texcoord,vec2 direction,vec3 distortion)\n{\nreturn vec4(\ntexture2D(tex,texcoord+direction*distortion.r).r,\ntexture2D(tex,texcoord+direction*distortion.g).g,\ntexture2D(tex,texcoord+direction*distortion.b).b,\n1.0\n);\n}\nvoid main(void)\n{\nvec2 uv=-vUV+vec2(1.0);\nvec2 ghostDir=(vec2(0.5)-uv)*ghostDispersal;\nvec2 texelSize=1.0/resolution;\nvec3 distortion=vec3(-texelSize.x*distortionStrength,0.0,texelSize.x*distortionStrength);\nvec4 result=vec4(0.0);\nfloat ghostIndice=1.0;\nfor (int i=0; i<GHOSTS; ++i)\n{\nvec2 offset=fract(uv+ghostDir*ghostIndice);\nfloat weight=length(vec2(0.5)-offset)/length(vec2(0.5));\nweight=pow(1.0-weight,10.0);\nresult+=textureDistorted(textureSampler,offset,normalize(ghostDir),distortion)*weight*strength;\nghostIndice+=1.0;\n}\nvec2 haloVec=normalize(ghostDir)*haloWidth;\nfloat weight=length(vec2(0.5)-fract(uv+haloVec))/length(vec2(0.5));\nweight=pow(1.0-weight,10.0);\nresult+=textureDistorted(textureSampler,fract(uv+haloVec),normalize(ghostDir),distortion)*weight*strength;\nresult*=texture2D(lensColorSampler,vec2(length(vec2(0.5)-uv)/length(vec2(0.5))));\ngl_FragColor=result;\n}\n#endif\n#if defined(LENS_FLARE_COMPOSE)\nuniform sampler2D otherSampler;\nuniform sampler2D lensDirtSampler;\nuniform sampler2D lensStarSampler;\nuniform mat4 lensStarMatrix;\nvoid main(void)\n{\nvec2 lensFlareCoords=(lensStarMatrix*vec4(vUV,1.0,1.0)).xy;\nvec4 lensMod=texture2D(lensDirtSampler,vUV);\nlensMod+=texture2D(lensStarSampler,vUV/*lensFlareCoords*/);\nvec4 result=texture2D(textureSampler,vUV)*lensMod;\ngl_FragColor=texture2D(otherSampler,vUV)+result;\n}\n#endif\n#if defined(DEPTH_OF_FIELD)\nuniform sampler2D otherSampler;\nuniform sampler2D depthSampler;\nuniform float distance;\nvoid main(void)\n{\nvec4 sharp=texture2D(otherSampler,vUV);\nvec4 blur=texture2D(textureSampler,vUV);\nfloat dist=clamp(texture2D(depthSampler,vUV).r*distance,0.0,1.0);\nfloat factor=0.0;\nif (dist<0.05)\nfactor=1.0;\nelse if (dist<0.1)\nfactor=20.0*(0.1-dist);\nelse if (dist<0.5)\nfactor=0.0;\nelse\nfactor=2.0*(dist-0.5);\nfactor=clamp(factor,0.0,0.90);\ngl_FragColor=mix(sharp,blur,factor);\n}\n#endif\n#if defined(MOTION_BLUR)\nuniform mat4 inverseViewProjection;\nuniform mat4 prevViewProjection;\nuniform vec2 screenSize;\nuniform float motionScale;\nuniform float motionStrength;\nuniform sampler2D depthSampler;\nvoid main(void)\n{\nvec2 texelSize=1.0/screenSize;\nfloat depth=texture2D(depthSampler,vUV).r;\nvec4 cpos=vec4(vUV*2.0-1.0,depth,1.0);\ncpos=cpos*inverseViewProjection;\nvec4 ppos=cpos*prevViewProjection;\nppos.xyz/=ppos.w;\nppos.xy=ppos.xy*0.5+0.5;\nvec2 velocity=(ppos.xy-vUV)*motionScale*motionStrength;\nfloat speed=length(velocity/texelSize);\nint nSamples=int(clamp(speed,1.0,MAX_MOTION_SAMPLES));\nvec4 result=texture2D(textureSampler,vUV);\nfor (int i=1; i<int(MAX_MOTION_SAMPLES); ++i) {\nif (i>=nSamples)\nbreak;\nvec2 offset1=vUV+velocity*(float(i)/float(nSamples-1)-0.5);\nresult+=texture2D(textureSampler,offset1);\n}\ngl_FragColor=result/float(nSamples);\n}\n#endif\n";class Gm extends Dm{get exposure(){return this._fixedExposure}set exposure(e){this._fixedExposure=e,this._currentExposure=e}get hdrAutoExposure(){return this._hdrAutoExposure}set hdrAutoExposure(e){if(this._hdrAutoExposure=e,this.hdrPostProcess){const t=["#define HDR"];e&&t.push("#define AUTO_EXPOSURE"),this.hdrPostProcess.updateEffect(t.join("\n"))}}get motionStrength(){return this._motionStrength}set motionStrength(e){this._motionStrength=e,this._isObjectBasedMotionBlur&&this.motionBlurPostProcess&&(this.motionBlurPostProcess.motionStrength=e)}get objectBasedMotionBlur(){return this._isObjectBasedMotionBlur}set objectBasedMotionBlur(e){const t=this._isObjectBasedMotionBlur!==e;this._isObjectBasedMotionBlur=e,t&&this._buildPipeline()}get BloomEnabled(){return this._bloomEnabled}set BloomEnabled(e){this._bloomEnabled!==e&&(this._bloomEnabled=e,this._buildPipeline())}get DepthOfFieldEnabled(){return this._depthOfFieldEnabled}set DepthOfFieldEnabled(e){this._depthOfFieldEnabled!==e&&(this._depthOfFieldEnabled=e,this._buildPipeline())}get LensFlareEnabled(){return this._lensFlareEnabled}set LensFlareEnabled(e){this._lensFlareEnabled!==e&&(this._lensFlareEnabled=e,this._buildPipeline())}get HDREnabled(){return this._hdrEnabled}set HDREnabled(e){this._hdrEnabled!==e&&(this._hdrEnabled=e,this._buildPipeline())}get VLSEnabled(){return this._vlsEnabled}set VLSEnabled(e){if(this._vlsEnabled!==e){if(e&&!this._scene.enableGeometryBufferRenderer())return void _.Y.Warn("Geometry renderer is not supported, cannot create volumetric lights in Standard Rendering Pipeline");this._vlsEnabled=e,this._buildPipeline()}}get MotionBlurEnabled(){return this._motionBlurEnabled}set MotionBlurEnabled(e){this._motionBlurEnabled!==e&&(this._motionBlurEnabled=e,this._buildPipeline())}get fxaaEnabled(){return this._fxaaEnabled}set fxaaEnabled(e){this._fxaaEnabled!==e&&(this._fxaaEnabled=e,this._buildPipeline())}get screenSpaceReflectionsEnabled(){return this._screenSpaceReflectionsEnabled}set screenSpaceReflectionsEnabled(e){this._screenSpaceReflectionsEnabled!==e&&(this._screenSpaceReflectionsEnabled=e,this._buildPipeline())}get volumetricLightStepsCount(){return this._volumetricLightStepsCount}set volumetricLightStepsCount(e){this.volumetricLightPostProcess&&this.volumetricLightPostProcess.updateEffect("#define VLS\n#define NB_STEPS "+e.toFixed(1)),this._volumetricLightStepsCount=e}get motionBlurSamples(){return this._motionBlurSamples}set motionBlurSamples(e){this.motionBlurPostProcess&&(this._isObjectBasedMotionBlur?this.motionBlurPostProcess.motionBlurSamples=e:this.motionBlurPostProcess.updateEffect("#define MOTION_BLUR\n#define MAX_MOTION_SAMPLES "+e.toFixed(1))),this._motionBlurSamples=e}get samples(){return this._samples}set samples(e){this._samples!==e&&(this._samples=e,this._buildPipeline())}constructor(e,t,i,n=null,s){super(t.getEngine(),e),this.downSampleX4PostProcess=null,this.brightPassPostProcess=null,this.blurHPostProcesses=[],this.blurVPostProcesses=[],this.textureAdderPostProcess=null,this.volumetricLightPostProcess=null,this.volumetricLightSmoothXPostProcess=null,this.volumetricLightSmoothYPostProcess=null,this.volumetricLightMergePostProces=null,this.volumetricLightFinalPostProcess=null,this.luminancePostProcess=null,this.luminanceDownSamplePostProcesses=[],this.hdrPostProcess=null,this.textureAdderFinalPostProcess=null,this.lensFlareFinalPostProcess=null,this.hdrFinalPostProcess=null,this.lensFlarePostProcess=null,this.lensFlareComposePostProcess=null,this.motionBlurPostProcess=null,this.depthOfFieldPostProcess=null,this.fxaaPostProcess=null,this.screenSpaceReflectionPostProcess=null,this.brightThreshold=1,this.blurWidth=512,this.horizontalBlur=!1,this.lensTexture=null,this.volumetricLightCoefficient=.2,this.volumetricLightPower=4,this.volumetricLightBlurScale=64,this.sourceLight=null,this.hdrMinimumLuminance=1,this.hdrDecreaseRate=.5,this.hdrIncreaseRate=.5,this.lensColorTexture=null,this.lensFlareStrength=20,this.lensFlareGhostDispersal=1.4,this.lensFlareHaloWidth=.7,this.lensFlareDistortionStrength=16,this.lensFlareBlurWidth=512,this.lensStarTexture=null,this.lensFlareDirtTexture=null,this.depthOfFieldDistance=10,this.depthOfFieldBlurWidth=64,this.animations=[],this._currentDepthOfFieldSource=null,this._fixedExposure=1,this._currentExposure=1,this._hdrAutoExposure=!1,this._hdrCurrentLuminance=1,this._motionStrength=1,this._isObjectBasedMotionBlur=!1,this._camerasToBeAttached=[],this._bloomEnabled=!1,this._depthOfFieldEnabled=!1,this._vlsEnabled=!1,this._lensFlareEnabled=!1,this._hdrEnabled=!1,this._motionBlurEnabled=!1,this._fxaaEnabled=!1,this._screenSpaceReflectionsEnabled=!1,this._motionBlurSamples=64,this._volumetricLightStepsCount=50,this._samples=1,this._cameras=s||t.cameras,this._cameras=this._cameras.slice(),this._camerasToBeAttached=this._cameras.slice(),this._scene=t,this._basePostProcess=n,this._ratio=i,this._floatTextureType=t.getEngine().getCaps().textureFloatRender?1:2,t.postProcessRenderPipelineManager.addPipeline(this),this._buildPipeline()}_buildPipeline(){const e=this._ratio,t=this._scene;this._disposePostProcesses(),null!==this._cameras&&(this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name,this._cameras),this._cameras=this._camerasToBeAttached.slice()),this._reset(),this._screenSpaceReflectionsEnabled&&(this.screenSpaceReflectionPostProcess=new km("HDRPass",t,e,null,Ce.x.BILINEAR_SAMPLINGMODE,t.getEngine(),!1,this._floatTextureType),this.screenSpaceReflectionPostProcess.onApplyObservable.add((()=>{this._currentDepthOfFieldSource=this.screenSpaceReflectionPostProcess})),this.addEffect(new am(t.getEngine(),"HDRScreenSpaceReflections",(()=>this.screenSpaceReflectionPostProcess),!0))),this._basePostProcess?this.originalPostProcess=this._basePostProcess:this.originalPostProcess=new ni.D("HDRPass","standard",[],[],e,null,Ce.x.BILINEAR_SAMPLINGMODE,t.getEngine(),!1,"#define PASS_POST_PROCESS",this._floatTextureType),this.originalPostProcess.autoClear=!this.screenSpaceReflectionPostProcess,this.originalPostProcess.onApplyObservable.add((()=>{this._currentDepthOfFieldSource=this.originalPostProcess})),this.addEffect(new am(t.getEngine(),"HDRPassPostProcess",(()=>this.originalPostProcess),!0)),this._bloomEnabled&&(this._createDownSampleX4PostProcess(t,e/4),this._createBrightPassPostProcess(t,e/4),this._createBlurPostProcesses(t,e/4,1),this._createTextureAdderPostProcess(t,e),this.textureAdderFinalPostProcess=new ni.D("HDRDepthOfFieldSource","standard",[],[],e,null,Ce.x.BILINEAR_SAMPLINGMODE,t.getEngine(),!1,"#define PASS_POST_PROCESS",0),this.addEffect(new am(t.getEngine(),"HDRBaseDepthOfFieldSource",(()=>this.textureAdderFinalPostProcess),!0))),this._vlsEnabled&&(this._createVolumetricLightPostProcess(t,e),this.volumetricLightFinalPostProcess=new ni.D("HDRVLSFinal","standard",[],[],e,null,Ce.x.BILINEAR_SAMPLINGMODE,t.getEngine(),!1,"#define PASS_POST_PROCESS",0),this.addEffect(new am(t.getEngine(),"HDRVLSFinal",(()=>this.volumetricLightFinalPostProcess),!0))),this._lensFlareEnabled&&(this._createLensFlarePostProcess(t,e),this.lensFlareFinalPostProcess=new ni.D("HDRPostLensFlareDepthOfFieldSource","standard",[],[],e,null,Ce.x.BILINEAR_SAMPLINGMODE,t.getEngine(),!1,"#define PASS_POST_PROCESS",0),this.addEffect(new am(t.getEngine(),"HDRPostLensFlareDepthOfFieldSource",(()=>this.lensFlareFinalPostProcess),!0))),this._hdrEnabled&&(this._createLuminancePostProcesses(t,this._floatTextureType),this._createHdrPostProcess(t,e),this.hdrFinalPostProcess=new ni.D("HDRPostHDReDepthOfFieldSource","standard",[],[],e,null,Ce.x.BILINEAR_SAMPLINGMODE,t.getEngine(),!1,"#define PASS_POST_PROCESS",0),this.addEffect(new am(t.getEngine(),"HDRPostHDReDepthOfFieldSource",(()=>this.hdrFinalPostProcess),!0))),this._depthOfFieldEnabled&&(this._createBlurPostProcesses(t,e/2,3,"depthOfFieldBlurWidth"),this._createDepthOfFieldPostProcess(t,e)),this._motionBlurEnabled&&this._createMotionBlurPostProcess(t,e),this._fxaaEnabled&&(this.fxaaPostProcess=new bm("fxaa",1,null,Ce.x.BILINEAR_SAMPLINGMODE,t.getEngine(),!1,0),this.addEffect(new am(t.getEngine(),"HDRFxaa",(()=>this.fxaaPostProcess),!0))),null!==this._cameras&&this._scene.postProcessRenderPipelineManager.attachCamerasToRenderPipeline(this._name,this._cameras),!this._enableMSAAOnFirstPostProcess(this._samples)&&this._samples>1&&_.Y.Warn("MSAA failed to enable, MSAA is only supported in browsers that support webGL >= 2.0")}_createDownSampleX4PostProcess(e,t){const i=new Array(32);this.downSampleX4PostProcess=new ni.D("HDRDownSampleX4","standard",["dsOffsets"],[],t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,"#define DOWN_SAMPLE_X4",this._floatTextureType),this.downSampleX4PostProcess.onApply=e=>{let t=0;const n=this.downSampleX4PostProcess.width,s=this.downSampleX4PostProcess.height;for(let e=-2;e<2;e++)for(let r=-2;r<2;r++)i[t]=(e+.5)*(1/n),i[t+1]=(r+.5)*(1/s),t+=2;e.setArray2("dsOffsets",i)},this.addEffect(new am(e.getEngine(),"HDRDownSampleX4",(()=>this.downSampleX4PostProcess),!0))}_createBrightPassPostProcess(e,t){const i=new Array(8);this.brightPassPostProcess=new ni.D("HDRBrightPass","standard",["dsOffsets","brightThreshold"],[],t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,"#define BRIGHT_PASS",this._floatTextureType),this.brightPassPostProcess.onApply=e=>{const t=1/this.brightPassPostProcess.width,n=1/this.brightPassPostProcess.height;i[0]=-.5*t,i[1]=.5*n,i[2]=.5*t,i[3]=.5*n,i[4]=-.5*t,i[5]=-.5*n,i[6]=.5*t,i[7]=-.5*n,e.setArray2("dsOffsets",i),e.setFloat("brightThreshold",this.brightThreshold)},this.addEffect(new am(e.getEngine(),"HDRBrightPass",(()=>this.brightPassPostProcess),!0))}_createBlurPostProcesses(e,t,i,n="blurWidth"){const s=e.getEngine(),r=new wa("HDRBlurH_"+i,new o.FM(1,0),this[n],t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,this._floatTextureType),a=new wa("HDRBlurV_"+i,new o.FM(0,1),this[n],t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,this._floatTextureType);r.onActivateObservable.add((()=>{const e=r.width/s.getRenderWidth();r.kernel=this[n]*e})),a.onActivateObservable.add((()=>{const e=a.height/s.getRenderHeight();a.kernel=this.horizontalBlur?64*e:this[n]*e})),this.addEffect(new am(e.getEngine(),"HDRBlurH"+i,(()=>r),!0)),this.addEffect(new am(e.getEngine(),"HDRBlurV"+i,(()=>a),!0)),this.blurHPostProcesses.push(r),this.blurVPostProcesses.push(a)}_createTextureAdderPostProcess(e,t){this.textureAdderPostProcess=new ni.D("HDRTextureAdder","standard",["exposure"],["otherSampler","lensSampler"],t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,"#define TEXTURE_ADDER",this._floatTextureType),this.textureAdderPostProcess.onApply=e=>{e.setTextureFromPostProcess("otherSampler",this._vlsEnabled?this._currentDepthOfFieldSource:this.originalPostProcess),e.setTexture("lensSampler",this.lensTexture),e.setFloat("exposure",this._currentExposure),this._currentDepthOfFieldSource=this.textureAdderFinalPostProcess},this.addEffect(new am(e.getEngine(),"HDRTextureAdder",(()=>this.textureAdderPostProcess),!0))}_createVolumetricLightPostProcess(e,t){const i=e.enableGeometryBufferRenderer();i.enablePosition=!0;const n=i.getGBuffer();this.volumetricLightPostProcess=new ni.D("HDRVLS","standard",["shadowViewProjection","cameraPosition","sunDirection","sunColor","scatteringCoefficient","scatteringPower","depthValues"],["shadowMapSampler","positionSampler"],t/8,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,"#define VLS\n#define NB_STEPS "+this._volumetricLightStepsCount.toFixed(1));const s=o.FM.Zero();this.volumetricLightPostProcess.onApply=e=>{if(this.sourceLight&&this.sourceLight.getShadowGenerator()&&this._scene.activeCamera){const t=this.sourceLight.getShadowGenerator();e.setTexture("shadowMapSampler",t.getShadowMap()),e.setTexture("positionSampler",n.textures[2]),e.setColor3("sunColor",this.sourceLight.diffuse),e.setVector3("sunDirection",this.sourceLight.getShadowDirection()),e.setVector3("cameraPosition",this._scene.activeCamera.globalPosition),e.setMatrix("shadowViewProjection",t.getTransformMatrix()),e.setFloat("scatteringCoefficient",this.volumetricLightCoefficient),e.setFloat("scatteringPower",this.volumetricLightPower),s.x=this.sourceLight.getDepthMinZ(this._scene.activeCamera),s.y=this.sourceLight.getDepthMaxZ(this._scene.activeCamera),e.setVector2("depthValues",s)}},this.addEffect(new am(e.getEngine(),"HDRVLS",(()=>this.volumetricLightPostProcess),!0)),this._createBlurPostProcesses(e,t/4,0,"volumetricLightBlurScale"),this.volumetricLightMergePostProces=new ni.D("HDRVLSMerge","standard",[],["originalSampler"],t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,"#define VLSMERGE"),this.volumetricLightMergePostProces.onApply=e=>{e.setTextureFromPostProcess("originalSampler",this._bloomEnabled?this.textureAdderFinalPostProcess:this.originalPostProcess),this._currentDepthOfFieldSource=this.volumetricLightFinalPostProcess},this.addEffect(new am(e.getEngine(),"HDRVLSMerge",(()=>this.volumetricLightMergePostProces),!0))}_createLuminancePostProcesses(e,t){let i=Math.pow(3,Gm.LuminanceSteps);this.luminancePostProcess=new ni.D("HDRLuminance","standard",["lumOffsets"],[],{width:i,height:i},null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,"#define LUMINANCE",t);const n=[];this.luminancePostProcess.onApply=e=>{const t=1/this.luminancePostProcess.width,i=1/this.luminancePostProcess.height;n[0]=-.5*t,n[1]=.5*i,n[2]=.5*t,n[3]=.5*i,n[4]=-.5*t,n[5]=-.5*i,n[6]=.5*t,n[7]=-.5*i,e.setArray2("lumOffsets",n)},this.addEffect(new am(e.getEngine(),"HDRLuminance",(()=>this.luminancePostProcess),!0));for(let n=Gm.LuminanceSteps-1;n>=0;n--){i=Math.pow(3,n);let s="#define LUMINANCE_DOWN_SAMPLE\n";0===n&&(s+="#define FINAL_DOWN_SAMPLER");const r=new ni.D("HDRLuminanceDownSample"+n,"standard",["dsOffsets","halfDestPixelSize"],[],{width:i,height:i},null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,s,t);this.luminanceDownSamplePostProcesses.push(r)}let s=this.luminancePostProcess;this.luminanceDownSamplePostProcesses.forEach(((t,i)=>{const n=new Array(18);t.onApply=e=>{if(!s)return;let r=0;for(let e=-1;e<2;e++)for(let t=-1;t<2;t++)n[r]=e/s.width,n[r+1]=t/s.height,r+=2;e.setArray2("dsOffsets",n),e.setFloat("halfDestPixelSize",.5/s.width),s=i===this.luminanceDownSamplePostProcesses.length-1?this.luminancePostProcess:t},i===this.luminanceDownSamplePostProcesses.length-1&&(t.onAfterRender=()=>{const t=e.getEngine().readPixels(0,0,1,1),i=new o.Lt(1/16581375,1/65025,1/255,1);t.then((e=>{const t=new Uint8Array(e.buffer);this._hdrCurrentLuminance=(t[0]*i.x+t[1]*i.y+t[2]*i.z+t[3]*i.w)/100}))}),this.addEffect(new am(e.getEngine(),"HDRLuminanceDownSample"+i,(()=>t),!0))}))}_createHdrPostProcess(e,t){const i=["#define HDR"];this._hdrAutoExposure&&i.push("#define AUTO_EXPOSURE"),this.hdrPostProcess=new ni.D("HDR","standard",["averageLuminance"],["textureAdderSampler"],t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,i.join("\n"),0);let n=1,s=0,r=0;this.hdrPostProcess.onApply=t=>{if(t.setTextureFromPostProcess("textureAdderSampler",this._currentDepthOfFieldSource),s+=e.getEngine().getDeltaTime(),n<0)n=this._hdrCurrentLuminance;else{const e=(r-s)/1e3;this._hdrCurrentLuminance<n+this.hdrDecreaseRate*e?n+=this.hdrDecreaseRate*e:this._hdrCurrentLuminance>n-this.hdrIncreaseRate*e?n-=this.hdrIncreaseRate*e:n=this._hdrCurrentLuminance}this.hdrAutoExposure?this._currentExposure=this._fixedExposure/n:(n=lt.R.Clamp(n,this.hdrMinimumLuminance,1e20),t.setFloat("averageLuminance",n)),r=s,this._currentDepthOfFieldSource=this.hdrFinalPostProcess},this.addEffect(new am(e.getEngine(),"HDR",(()=>this.hdrPostProcess),!0))}_createLensFlarePostProcess(e,t){this.lensFlarePostProcess=new ni.D("HDRLensFlare","standard",["strength","ghostDispersal","haloWidth","resolution","distortionStrength"],["lensColorSampler"],t/2,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,"#define LENS_FLARE",0),this.addEffect(new am(e.getEngine(),"HDRLensFlare",(()=>this.lensFlarePostProcess),!0)),this._createBlurPostProcesses(e,t/4,2,"lensFlareBlurWidth"),this.lensFlareComposePostProcess=new ni.D("HDRLensFlareCompose","standard",["lensStarMatrix"],["otherSampler","lensDirtSampler","lensStarSampler"],t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,"#define LENS_FLARE_COMPOSE",0),this.addEffect(new am(e.getEngine(),"HDRLensFlareCompose",(()=>this.lensFlareComposePostProcess),!0));const i=new o.FM(0,0);this.lensFlarePostProcess.externalTextureSamplerBinding=!0,this.lensFlarePostProcess.onApply=e=>{e.setTextureFromPostProcess("textureSampler",this._bloomEnabled?this.blurHPostProcesses[0]:this.originalPostProcess),e.setTexture("lensColorSampler",this.lensColorTexture),e.setFloat("strength",this.lensFlareStrength),e.setFloat("ghostDispersal",this.lensFlareGhostDispersal),e.setFloat("haloWidth",this.lensFlareHaloWidth),i.x=this.lensFlarePostProcess.width,i.y=this.lensFlarePostProcess.height,e.setVector2("resolution",i),e.setFloat("distortionStrength",this.lensFlareDistortionStrength)};const n=o.y3.FromValues(2,0,-1,0,0,2,-1,0,0,0,1,0,0,0,0,1),s=o.y3.FromValues(.5,0,.5,0,0,.5,.5,0,0,0,1,0,0,0,0,1);this.lensFlareComposePostProcess.onApply=e=>{if(!this._scene.activeCamera)return;e.setTextureFromPostProcess("otherSampler",this.lensFlarePostProcess),e.setTexture("lensDirtSampler",this.lensFlareDirtTexture),e.setTexture("lensStarSampler",this.lensStarTexture);const t=this._scene.activeCamera.getViewMatrix().getRow(0),i=this._scene.activeCamera.getViewMatrix().getRow(2);let r=o.P.Dot(t.toVector3(),new o.P(1,0,0))+o.P.Dot(i.toVector3(),new o.P(0,0,1));r*=4;const a=o.y3.FromValues(.5*Math.cos(r),-Math.sin(r),0,0,Math.sin(r),.5*Math.cos(r),0,0,0,0,1,0,0,0,0,1),l=s.multiply(a).multiply(n);e.setMatrix("lensStarMatrix",l),this._currentDepthOfFieldSource=this.lensFlareFinalPostProcess}}_createDepthOfFieldPostProcess(e,t){this.depthOfFieldPostProcess=new ni.D("HDRDepthOfField","standard",["distance"],["otherSampler","depthSampler"],t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,"#define DEPTH_OF_FIELD",0),this.depthOfFieldPostProcess.onApply=e=>{e.setTextureFromPostProcess("otherSampler",this._currentDepthOfFieldSource),e.setTexture("depthSampler",this._getDepthTexture()),e.setFloat("distance",this.depthOfFieldDistance)},this.addEffect(new am(e.getEngine(),"HDRDepthOfField",(()=>this.depthOfFieldPostProcess),!0))}_createMotionBlurPostProcess(e,t){if(this._isObjectBasedMotionBlur){const i=new Rm("HDRMotionBlur",e,t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,0);i.motionStrength=this.motionStrength,i.motionBlurSamples=this.motionBlurSamples,this.motionBlurPostProcess=i}else{this.motionBlurPostProcess=new ni.D("HDRMotionBlur","standard",["inverseViewProjection","prevViewProjection","screenSize","motionScale","motionStrength"],["depthSampler"],t,null,Ce.x.BILINEAR_SAMPLINGMODE,e.getEngine(),!1,"#define MOTION_BLUR\n#define MAX_MOTION_SAMPLES "+this.motionBlurSamples.toFixed(1),0);let i=0,n=o.y3.Identity();const s=o.y3.Identity();let r=o.y3.Identity();const a=o.FM.Zero();this.motionBlurPostProcess.onApply=t=>{r=e.getProjectionMatrix().multiply(e.getViewMatrix()),r.invertToRef(s),t.setMatrix("inverseViewProjection",s),t.setMatrix("prevViewProjection",n),n=r,a.x=this.motionBlurPostProcess.width,a.y=this.motionBlurPostProcess.height,t.setVector2("screenSize",a),i=e.getEngine().getFps()/60,t.setFloat("motionScale",i),t.setFloat("motionStrength",this.motionStrength),t.setTexture("depthSampler",this._getDepthTexture())}}this.addEffect(new am(e.getEngine(),"HDRMotionBlur",(()=>this.motionBlurPostProcess),!0))}_getDepthTexture(){return this._scene.getEngine().getCaps().drawBuffersExtension?this._scene.enableGeometryBufferRenderer().getGBuffer().textures[0]:this._scene.enableDepthRenderer().getDepthMap()}_disposePostProcesses(){for(let e=0;e<this._cameras.length;e++){const t=this._cameras[e];this.originalPostProcess&&this.originalPostProcess.dispose(t),this.screenSpaceReflectionPostProcess&&this.screenSpaceReflectionPostProcess.dispose(t),this.downSampleX4PostProcess&&this.downSampleX4PostProcess.dispose(t),this.brightPassPostProcess&&this.brightPassPostProcess.dispose(t),this.textureAdderPostProcess&&this.textureAdderPostProcess.dispose(t),this.volumetricLightPostProcess&&this.volumetricLightPostProcess.dispose(t),this.volumetricLightSmoothXPostProcess&&this.volumetricLightSmoothXPostProcess.dispose(t),this.volumetricLightSmoothYPostProcess&&this.volumetricLightSmoothYPostProcess.dispose(t),this.volumetricLightMergePostProces&&this.volumetricLightMergePostProces.dispose(t),this.volumetricLightFinalPostProcess&&this.volumetricLightFinalPostProcess.dispose(t),this.lensFlarePostProcess&&this.lensFlarePostProcess.dispose(t),this.lensFlareComposePostProcess&&this.lensFlareComposePostProcess.dispose(t);for(let e=0;e<this.luminanceDownSamplePostProcesses.length;e++)this.luminanceDownSamplePostProcesses[e].dispose(t);this.luminancePostProcess&&this.luminancePostProcess.dispose(t),this.hdrPostProcess&&this.hdrPostProcess.dispose(t),this.hdrFinalPostProcess&&this.hdrFinalPostProcess.dispose(t),this.depthOfFieldPostProcess&&this.depthOfFieldPostProcess.dispose(t),this.motionBlurPostProcess&&this.motionBlurPostProcess.dispose(t),this.fxaaPostProcess&&this.fxaaPostProcess.dispose(t);for(let e=0;e<this.blurHPostProcesses.length;e++)this.blurHPostProcesses[e].dispose(t);for(let e=0;e<this.blurVPostProcesses.length;e++)this.blurVPostProcesses[e].dispose(t)}this.originalPostProcess=null,this.downSampleX4PostProcess=null,this.brightPassPostProcess=null,this.textureAdderPostProcess=null,this.textureAdderFinalPostProcess=null,this.volumetricLightPostProcess=null,this.volumetricLightSmoothXPostProcess=null,this.volumetricLightSmoothYPostProcess=null,this.volumetricLightMergePostProces=null,this.volumetricLightFinalPostProcess=null,this.lensFlarePostProcess=null,this.lensFlareComposePostProcess=null,this.luminancePostProcess=null,this.hdrPostProcess=null,this.hdrFinalPostProcess=null,this.depthOfFieldPostProcess=null,this.motionBlurPostProcess=null,this.fxaaPostProcess=null,this.screenSpaceReflectionPostProcess=null,this.luminanceDownSamplePostProcesses.length=0,this.blurHPostProcesses.length=0,this.blurVPostProcesses.length=0}dispose(){this._disposePostProcesses(),this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name,this._cameras),super.dispose()}serialize(){const e=Te.p4.Serialize(this);return this.sourceLight&&(e.sourceLightId=this.sourceLight.id),this.screenSpaceReflectionPostProcess&&(e.screenSpaceReflectionPostProcess=Te.p4.Serialize(this.screenSpaceReflectionPostProcess)),e.customType="StandardRenderingPipeline",e}static Parse(e,t,i){const n=Te.p4.Parse((()=>new Gm(e._name,t,e._ratio)),e,t,i);return e.sourceLightId&&(n.sourceLight=t.getLightById(e.sourceLightId)),e.screenSpaceReflectionPostProcess&&Te.p4.Parse((()=>n.screenSpaceReflectionPostProcess),e.screenSpaceReflectionPostProcess,t,i),n}}Gm.LuminanceSteps=6,(0,be.gn)([(0,Te.qC)()],Gm.prototype,"brightThreshold",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"blurWidth",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"horizontalBlur",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"exposure",null),(0,be.gn)([(0,Te.oU)("lensTexture")],Gm.prototype,"lensTexture",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"volumetricLightCoefficient",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"volumetricLightPower",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"volumetricLightBlurScale",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"hdrMinimumLuminance",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"hdrDecreaseRate",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"hdrIncreaseRate",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"hdrAutoExposure",null),(0,be.gn)([(0,Te.oU)("lensColorTexture")],Gm.prototype,"lensColorTexture",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"lensFlareStrength",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"lensFlareGhostDispersal",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"lensFlareHaloWidth",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"lensFlareDistortionStrength",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"lensFlareBlurWidth",void 0),(0,be.gn)([(0,Te.oU)("lensStarTexture")],Gm.prototype,"lensStarTexture",void 0),(0,be.gn)([(0,Te.oU)("lensFlareDirtTexture")],Gm.prototype,"lensFlareDirtTexture",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"depthOfFieldDistance",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"depthOfFieldBlurWidth",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"motionStrength",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"objectBasedMotionBlur",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"_ratio",void 0),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"BloomEnabled",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"DepthOfFieldEnabled",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"LensFlareEnabled",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"HDREnabled",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"VLSEnabled",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"MotionBlurEnabled",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"fxaaEnabled",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"screenSpaceReflectionsEnabled",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"volumetricLightStepsCount",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"motionBlurSamples",null),(0,be.gn)([(0,Te.qC)()],Gm.prototype,"samples",null),(0,l.H)("BABYLON.StandardRenderingPipeline",Gm);class zm{constructor(){this.enabled=!1,this.name="screenSpaceReflections2",this.texturesRequired=[6,3,5]}}si.v.IncludesShadersStore.screenSpaceRayTrace="float distanceSquared(vec2 a,vec2 b) { a-=b; return dot(a,a); }\n/**\nparam csOrigin Camera-space ray origin,which must be \nwithin the view volume and must have z>0.01 and project within the valid screen rectangle\nparam csDirection Unit length camera-space ray direction\nparam projectToPixelMatrix A projection matrix that maps to **pixel** coordinates \n(**not** [-1,+1] normalized device coordinates).\nparam csZBuffer The camera-space Z buffer\nparam csZBufferSize Dimensions of csZBuffer\nparam csZThickness Camera space csZThickness to ascribe to each pixel in the depth buffer\nparam nearPlaneZ Positive number. Doesn't have to be THE actual near plane,just a reasonable value\nfor clipping rays headed towards the camera\nparam stride Step in horizontal or vertical pixels between samples. This is a float\nbecause integer math is slow on GPUs,but should be set to an integer>=1\nparam jitterFraction Number between 0 and 1 for how far to bump the ray in stride units\nto conceal banding artifacts,plus the stride ray offset.\nparam maxSteps Maximum number of iterations. Higher gives better images but may be slow\nparam maxRayTraceDistance Maximum camera-space distance to trace before returning a miss\nparam selfCollisionNumSkip Number of steps to skip at start when raytracing to avoid self collisions.\n1 is a reasonable value,depending on the scene you may need to set this value to 2\nparam hitPixel Pixel coordinates of the first intersection with the scene\nparam numIterations number of iterations performed\nparam csHitPoint Camera space location of the ray hit\n*/\n#define inline\nbool traceScreenSpaceRay1(\nvec3 csOrigin,\nvec3 csDirection,\nmat4 projectToPixelMatrix,\nsampler2D csZBuffer,\nvec2 csZBufferSize,\n#ifdef SSRAYTRACE_USE_BACK_DEPTHBUFFER\nsampler2D csZBackBuffer,\nfloat csZBackSizeFactor,\n#endif\nfloat csZThickness,\nfloat nearPlaneZ,\nfloat stride,\nfloat jitterFraction,\nfloat maxSteps,\nfloat maxRayTraceDistance,\nfloat selfCollisionNumSkip,\nout vec2 startPixel,\nout vec2 hitPixel,\nout vec3 csHitPoint,\nout float numIterations\n#ifdef SSRAYTRACE_DEBUG\n,out vec3 debugColor\n#endif\n)\n{\n#ifdef SSRAYTRACE_RIGHT_HANDED_SCENE\nfloat rayLength=(csOrigin.z+csDirection.z*maxRayTraceDistance)>-nearPlaneZ ? (-nearPlaneZ-csOrigin.z)/csDirection.z : maxRayTraceDistance;\n#else\nfloat rayLength=(csOrigin.z+csDirection.z*maxRayTraceDistance)<nearPlaneZ ? (nearPlaneZ-csOrigin.z)/csDirection.z : maxRayTraceDistance;\n#endif\nvec3 csEndPoint=csOrigin+csDirection*rayLength;\nhitPixel=vec2(-1.0,-1.0);\nvec4 H0=projectToPixelMatrix*vec4(csOrigin,1.0);\nvec4 H1=projectToPixelMatrix*vec4(csEndPoint,1.0);\nfloat k0=1.0/H0.w;\nfloat k1=1.0/H1.w;\nvec3 Q0=csOrigin*k0;\nvec3 Q1=csEndPoint*k1;\nvec2 P0=H0.xy*k0;\nvec2 P1=H1.xy*k1;\n#ifdef SSRAYTRACE_CLIP_TO_FRUSTUM\nfloat xMax=csZBufferSize.x-0.5,xMin=0.5,yMax=csZBufferSize.y-0.5,yMin=0.5;\nfloat alpha=0.0;\nif ((P1.y>yMax) || (P1.y<yMin)) {\nalpha=(P1.y-((P1.y>yMax) ? yMax : yMin))/(P1.y-P0.y);\n}\nif ((P1.x>xMax) || (P1.x<xMin)) {\nalpha=max(alpha,(P1.x-((P1.x>xMax) ? xMax : xMin))/(P1.x-P0.x));\n}\nP1=mix(P1,P0,alpha); k1=mix(k1,k0,alpha); Q1=mix(Q1,Q0,alpha);\n#endif\nP1+=vec2((distanceSquared(P0,P1)<0.0001) ? 0.01 : 0.0);\nvec2 delta=P1-P0;\nbool permute=false;\nif (abs(delta.x)<abs(delta.y)) { \npermute=true;\ndelta=delta.yx;\nP0=P0.yx;\nP1=P1.yx; \n}\nfloat stepDirection=sign(delta.x);\nfloat invdx=stepDirection/delta.x;\nvec2 dP=vec2(stepDirection,delta.y*invdx);\nvec3 dQ=(Q1-Q0)*invdx;\nfloat dk=(k1-k0)*invdx;\nfloat zMin=min(csEndPoint.z,csOrigin.z);\nfloat zMax=max(csEndPoint.z,csOrigin.z);\ndP*=stride; dQ*=stride; dk*=stride;\nP0+=dP*jitterFraction; Q0+=dQ*jitterFraction; k0+=dk*jitterFraction;\nvec4 pqk=vec4(P0,Q0.z,k0);\nvec4 dPQK=vec4(dP,dQ.z,dk);\nstartPixel=permute ? P0.yx : P0.xy;\nfloat prevZMaxEstimate=csOrigin.z;\nfloat rayZMin=prevZMaxEstimate,rayZMax=prevZMaxEstimate;\nfloat sceneZMax=rayZMax+1e4;\nfloat end=P1.x*stepDirection;\nbool hit=false;\nfloat stepCount;\nfor (stepCount=0.0;\nstepCount<=selfCollisionNumSkip ||\n(pqk.x*stepDirection)<=end &&\nstepCount<maxSteps &&\n!hit &&\nsceneZMax != 0.0; \npqk+=dPQK,++stepCount)\n{\nhitPixel=permute ? pqk.yx : pqk.xy;\nrayZMin=prevZMaxEstimate;\nrayZMax=(dPQK.z*0.5+pqk.z)/(dPQK.w*0.5+pqk.w);\nrayZMax=clamp(rayZMax,zMin,zMax);\nprevZMaxEstimate=rayZMax;\nif (rayZMin>rayZMax) { \nfloat t=rayZMin; rayZMin=rayZMax; rayZMax=t;\n}\nsceneZMax=texelFetch(csZBuffer,ivec2(hitPixel),0).r;\n#ifdef SSRAYTRACE_RIGHT_HANDED_SCENE\n#ifdef SSRAYTRACE_USE_BACK_DEPTHBUFFER\nfloat sceneBackZ=texelFetch(csZBackBuffer,ivec2(hitPixel/csZBackSizeFactor),0).r;\nhit=(rayZMax>=sceneBackZ-csZThickness) && (rayZMin<=sceneZMax);\n#else\nhit=(rayZMax>=sceneZMax-csZThickness) && (rayZMin<=sceneZMax);\n#endif\n#else\n#ifdef SSRAYTRACE_USE_BACK_DEPTHBUFFER\nfloat sceneBackZ=texelFetch(csZBackBuffer,ivec2(hitPixel/csZBackSizeFactor),0).r;\nhit=(rayZMin<=sceneBackZ+csZThickness) && (rayZMax>=sceneZMax) && (sceneZMax != 0.0);\n#else\nhit=(rayZMin<=sceneZMax+csZThickness) && (rayZMax>=sceneZMax);\n#endif\n#endif\n}\npqk-=dPQK;\nstepCount-=1.0;\nif (((pqk.x+dPQK.x)*stepDirection)>end || (stepCount+1.0)>=maxSteps || sceneZMax==0.0) {\nhit=false;\n}\n#ifdef SSRAYTRACE_ENABLE_REFINEMENT\nif (stride>1.0 && hit) {\npqk-=dPQK;\nstepCount-=1.0;\nfloat invStride=1.0/stride;\ndPQK*=invStride;\nfloat refinementStepCount=0.0;\nprevZMaxEstimate=pqk.z/pqk.w;\nrayZMax=prevZMaxEstimate;\nsceneZMax=rayZMax+1e7;\nfor (;\nrefinementStepCount<=1.0 ||\n(refinementStepCount<=stride*1.4) &&\n(rayZMax<sceneZMax) && (sceneZMax != 0.0);\npqk+=dPQK,refinementStepCount+=1.0)\n{\nrayZMin=prevZMaxEstimate;\nrayZMax=(dPQK.z*0.5+pqk.z)/(dPQK.w*0.5+pqk.w);\nrayZMax=clamp(rayZMax,zMin,zMax);\nprevZMaxEstimate=rayZMax;\nrayZMax=max(rayZMax,rayZMin);\nhitPixel=permute ? pqk.yx : pqk.xy;\nsceneZMax=texelFetch(csZBuffer,ivec2(hitPixel),0).r;\n}\npqk-=dPQK;\nrefinementStepCount-=1.0;\nstepCount+=refinementStepCount/stride;\n}\n#endif\nQ0.xy+=dQ.xy*stepCount;\nQ0.z=pqk.z;\ncsHitPoint=Q0/pqk.w;\nnumIterations=stepCount+1.0;\n#ifdef SSRAYTRACE_DEBUG\nif (((pqk.x+dPQK.x)*stepDirection)>end) {\ndebugColor=vec3(0,0,1);\n} else if ((stepCount+1.0)>=maxSteps) {\ndebugColor=vec3(1,0,0);\n} else if (sceneZMax==0.0) {\ndebugColor=vec3(1,1,0);\n} else {\ndebugColor=vec3(0,stepCount/maxSteps,0);\n}\n#endif\nreturn hit;\n}\n";si.v.ShadersStore.screenSpaceReflection2PixelShader="#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\n#define TEXTUREFUNC(s,c,lod) texture2DLodEXT(s,c,lod)\n#define TEXTURECUBEFUNC(s,c,lod) textureLod(s,c,lod)\n#else\n#define TEXTUREFUNC(s,c,bias) texture2D(s,c,bias)\n#define TEXTURECUBEFUNC(s,c,bias) textureCube(s,c,bias)\n#endif\nuniform sampler2D textureSampler;\nvarying vec2 vUV;\n#ifdef SSR_SUPPORTED\nuniform sampler2D reflectivitySampler;\nuniform sampler2D normalSampler;\nuniform sampler2D depthSampler;\n#ifdef SSRAYTRACE_USE_BACK_DEPTHBUFFER\nuniform sampler2D backDepthSampler;\nuniform float backSizeFactor;\n#endif\n#ifdef SSR_USE_ENVIRONMENT_CUBE\nuniform samplerCube envCubeSampler;\n#ifdef SSR_USE_LOCAL_REFLECTIONMAP_CUBIC\nuniform vec3 vReflectionPosition;\nuniform vec3 vReflectionSize;\n#endif\n#endif\nuniform mat4 view;\nuniform mat4 invView;\nuniform mat4 projection;\nuniform mat4 invProjectionMatrix;\nuniform mat4 projectionPixel;\nuniform float nearPlaneZ;\nuniform float stepSize;\nuniform float maxSteps;\nuniform float strength;\nuniform float thickness;\nuniform float roughnessFactor;\nuniform float reflectionSpecularFalloffExponent;\nuniform float maxDistance;\nuniform float selfCollisionNumSkip;\nuniform float reflectivityThreshold;\n#include<helperFunctions>\n#include<screenSpaceRayTrace>\nvec3 fresnelSchlick(float cosTheta,vec3 F0)\n{\nreturn F0+(1.0-F0)*pow(1.0-cosTheta,5.0);\n}\nvec3 hash(vec3 a)\n{\na=fract(a*0.8);\na+=dot(a,a.yxz+19.19);\nreturn fract((a.xxy+a.yxx)*a.zyx);\n}\nvec3 computeViewPosFromUVDepth(vec2 texCoord,float depth) {\nvec4 ndc;\nndc.xy=texCoord*2.0-1.0;\n#ifdef SSRAYTRACE_RIGHT_HANDED_SCENE\nndc.z=-projection[2].z-projection[3].z/depth;\n#else\nndc.z=projection[2].z+projection[3].z/depth;\n#endif\nndc.w=1.0;\nvec4 eyePos=invProjectionMatrix*ndc;\neyePos.xyz/=eyePos.w;\nreturn eyePos.xyz;\n}\nfloat computeAttenuationForIntersection(ivec2 hitPixel,vec2 hitUV,vec3 vsRayOrigin,vec3 vsHitPoint,vec3 reflectionVector,float maxRayDistance,float numIterations) {\nfloat attenuation=1.0;\n#ifdef SSR_ATTENUATE_SCREEN_BORDERS\nvec2 dCoords=smoothstep(0.2,0.6,abs(vec2(0.5,0.5)-hitUV.xy));\nattenuation*=clamp(1.0-(dCoords.x+dCoords.y),0.0,1.0);\n#endif\n#ifdef SSR_ATTENUATE_INTERSECTION_DISTANCE\nattenuation*=1.0-clamp(distance(vsRayOrigin,vsHitPoint)/maxRayDistance,0.0,1.0);\n#endif\n#ifdef SSR_ATTENUATE_INTERSECTION_NUMITERATIONS\nattenuation*=1.0-(numIterations/maxSteps);\n#endif\n#ifdef SSR_ATTENUATE_BACKFACE_REFLECTION\nvec3 reflectionNormal=texelFetch(normalSampler,hitPixel,0).xyz;\nfloat directionBasedAttenuation=smoothstep(-0.17,0.0,dot(reflectionNormal,-reflectionVector));\nattenuation*=directionBasedAttenuation;\n#endif\nreturn attenuation;\n}\n#endif\nvoid main()\n{\n#ifdef SSR_SUPPORTED\nvec4 colorFull=TEXTUREFUNC(textureSampler,vUV,0.0);\nvec3 color=colorFull.rgb;\nvec4 reflectivity=TEXTUREFUNC(reflectivitySampler,vUV,0.0);\nif (max(reflectivity.r,max(reflectivity.g,reflectivity.b))<=reflectivityThreshold) {\n#ifdef SSR_USE_BLUR\ngl_FragColor=vec4(0.);\n#else\ngl_FragColor=colorFull;\n#endif\nreturn;\n}\n#ifdef SSR_INPUT_IS_GAMMA_SPACE\ncolor=toLinearSpace(color);\n#endif\nvec2 texSize=vec2(textureSize(depthSampler,0));\nvec3 csNormal=texelFetch(normalSampler,ivec2(vUV*texSize),0).xyz; \nfloat depth=texelFetch(depthSampler,ivec2(vUV*texSize),0).r;\nvec3 csPosition=computeViewPosFromUVDepth(vUV,depth);\nvec3 csViewDirection=normalize(csPosition);\nvec3 csReflectedVector=reflect(csViewDirection,csNormal);\n#ifdef SSR_USE_ENVIRONMENT_CUBE\nvec3 wReflectedVector=vec3(invView*vec4(csReflectedVector,0.0));\n#ifdef SSR_USE_LOCAL_REFLECTIONMAP_CUBIC\nvec4 worldPos=invView*vec4(csPosition,1.0);\nwReflectedVector=parallaxCorrectNormal(worldPos.xyz,normalize(wReflectedVector),vReflectionSize,vReflectionPosition);\n#endif\n#ifdef SSR_INVERTCUBICMAP\nwReflectedVector.y*=-1.0;\n#endif\n#ifdef SSRAYTRACE_RIGHT_HANDED_SCENE\nwReflectedVector.z*=-1.0;\n#endif\nvec3 envColor=TEXTURECUBEFUNC(envCubeSampler,wReflectedVector,0.0).xyz;\n#ifdef SSR_ENVIRONMENT_CUBE_IS_GAMMASPACE\nenvColor=toLinearSpace(envColor);\n#endif\n#else\nvec3 envColor=color;\n#endif\nfloat reflectionAttenuation=1.0;\nbool rayHasHit=false;\nvec2 startPixel;\nvec2 hitPixel;\nvec3 hitPoint;\nfloat numIterations;\n#ifdef SSRAYTRACE_DEBUG\nvec3 debugColor;\n#endif\n#ifdef SSR_ATTENUATE_FACING_CAMERA\nreflectionAttenuation*=1.0-smoothstep(0.25,0.5,dot(-csViewDirection,csReflectedVector));\n#endif\nif (reflectionAttenuation>0.0) {\n#ifdef SSR_USE_BLUR\nvec3 jitt=vec3(0.);\n#else\nfloat roughness=1.0-reflectivity.a;\nvec3 jitt=mix(vec3(0.0),hash(csPosition),roughness)*roughnessFactor; \n#endif\nvec2 uv2=vUV*texSize;\nfloat c=(uv2.x+uv2.y)*0.25;\nfloat jitter=mod(c,1.0); \nrayHasHit=traceScreenSpaceRay1(\ncsPosition,\nnormalize(csReflectedVector+jitt),\nprojectionPixel,\ndepthSampler,\ntexSize,\n#ifdef SSRAYTRACE_USE_BACK_DEPTHBUFFER\nbackDepthSampler,\nbackSizeFactor,\n#endif\nthickness,\nnearPlaneZ,\nstepSize,\njitter,\nmaxSteps,\nmaxDistance,\nselfCollisionNumSkip,\nstartPixel,\nhitPixel,\nhitPoint,\nnumIterations\n#ifdef SSRAYTRACE_DEBUG\n,debugColor\n#endif\n);\n}\n#ifdef SSRAYTRACE_DEBUG\ngl_FragColor=vec4(debugColor,1.);\nreturn;\n#endif\nvec3 F0=reflectivity.rgb;\nvec3 fresnel=fresnelSchlick(max(dot(csNormal,-csViewDirection),0.0),F0);\nvec3 SSR=envColor;\nif (rayHasHit) {\nvec3 reflectedColor=texelFetch(textureSampler,ivec2(hitPixel),0).rgb;\n#ifdef SSR_INPUT_IS_GAMMA_SPACE\nreflectedColor=toLinearSpace(reflectedColor);\n#endif\nreflectionAttenuation*=computeAttenuationForIntersection(ivec2(hitPixel),hitPixel/texSize,csPosition,hitPoint,csReflectedVector,maxDistance,numIterations);\nSSR=reflectedColor*reflectionAttenuation+(1.0-reflectionAttenuation)*envColor;\n}\nSSR*=fresnel;\n#ifdef SSR_USE_BLUR\nfloat blur_radius=0.0;\nfloat roughness=1.0-reflectivity.a*(1.0-roughnessFactor);\nif (roughness>0.001) {\nfloat cone_angle=min(roughness,0.999)*3.14159265*0.5;\nfloat cone_len=distance(startPixel,hitPixel);\nfloat op_len=2.0*tan(cone_angle)*cone_len; \nfloat a=op_len;\nfloat h=cone_len;\nfloat a2=a*a;\nfloat fh2=4.0f*h*h;\nblur_radius=(a*(sqrt(a2+fh2)-a))/(4.0f*h);\n}\ngl_FragColor=vec4(SSR,blur_radius/255.0); \n#else\nvec3 reflectionMultiplier=clamp(pow(reflectivity.rgb*strength,vec3(reflectionSpecularFalloffExponent)),0.0,1.0);\nvec3 colorMultiplier=1.0-reflectionMultiplier;\nvec3 finalColor=(color*colorMultiplier)+(SSR*reflectionMultiplier);\n#ifdef SSR_OUTPUT_IS_GAMMA_SPACE\nfinalColor=toGammaSpace(finalColor);\n#endif\ngl_FragColor=vec4(finalColor,colorFull.a);\n#endif\n#else\ngl_FragColor=TEXTUREFUNC(textureSampler,vUV,0.0);\n#endif\n}\n";si.v.ShadersStore.screenSpaceReflection2BlurPixelShader="#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\n#define TEXTUREFUNC(s,c,lod) texture2DLodEXT(s,c,lod)\n#else\n#define TEXTUREFUNC(s,c,bias) texture2D(s,c,bias)\n#endif\nuniform sampler2D textureSampler;\nvarying vec2 vUV;\nuniform vec2 texelOffsetScale;\nconst float weights[8]=float[8] (0.071303,0.131514,0.189879,0.321392,0.452906, 0.584419,0.715932,0.847445);\nvoid processSample(vec2 uv,float i,vec2 stepSize,inout vec4 accumulator,inout float denominator)\n{\nvec2 offsetUV=stepSize*i+uv;\nfloat coefficient=weights[int(2.0-abs(i))];\naccumulator+=TEXTUREFUNC(textureSampler,offsetUV,0.0)*coefficient;\ndenominator+=coefficient;\n}\nvoid main()\n{\nvec4 colorFull=TEXTUREFUNC(textureSampler,vUV,0.0);\nif (dot(colorFull,vec4(1.0))==0.0) {\ngl_FragColor=colorFull;\nreturn;\n}\nfloat blurRadius=colorFull.a*255.0; \nvec2 stepSize=texelOffsetScale.xy*blurRadius;\nvec4 accumulator=TEXTUREFUNC(textureSampler,vUV,0.0)*0.214607;\nfloat denominator=0.214607;\nprocessSample(vUV,1.0,stepSize,accumulator,denominator);\nprocessSample(vUV,1.0*0.2,stepSize,accumulator,denominator);\nprocessSample(vUV,1.0*0.4,stepSize,accumulator,denominator);\nprocessSample(vUV,1.0*0.6,stepSize,accumulator,denominator);\nprocessSample(vUV,1.0*0.8,stepSize,accumulator,denominator);\nprocessSample(vUV,1.0*1.2,stepSize,accumulator,denominator);\nprocessSample(vUV,1.0*1.4,stepSize,accumulator,denominator);\nprocessSample(vUV,1.0*1.6,stepSize,accumulator,denominator);\nprocessSample(vUV,1.0*1.8,stepSize,accumulator,denominator);\nprocessSample(vUV,1.0*2.0,stepSize,accumulator,denominator);\nprocessSample(vUV,-1.0,stepSize,accumulator,denominator);\nprocessSample(vUV,-1.0*0.2,stepSize,accumulator,denominator);\nprocessSample(vUV,-1.0*0.4,stepSize,accumulator,denominator);\nprocessSample(vUV,-1.0*0.6,stepSize,accumulator,denominator);\nprocessSample(vUV,-1.0*0.8,stepSize,accumulator,denominator);\nprocessSample(vUV,-1.0*1.2,stepSize,accumulator,denominator);\nprocessSample(vUV,-1.0*1.4,stepSize,accumulator,denominator);\nprocessSample(vUV,-1.0*1.6,stepSize,accumulator,denominator);\nprocessSample(vUV,-1.0*1.8,stepSize,accumulator,denominator);\nprocessSample(vUV,-1.0*2.0,stepSize,accumulator,denominator);\ngl_FragColor=vec4(accumulator.rgb/denominator,colorFull.a);\n}\n";si.v.ShadersStore.screenSpaceReflection2BlurCombinerPixelShader="uniform sampler2D textureSampler; \nuniform sampler2D mainSampler;\nuniform sampler2D reflectivitySampler;\nuniform float strength;\nuniform float reflectionSpecularFalloffExponent;\nuniform float reflectivityThreshold;\nvarying vec2 vUV;\n#include<helperFunctions>\nvoid main()\n{\n#ifdef SSRAYTRACE_DEBUG\ngl_FragColor=texture2D(textureSampler,vUV);\n#else\nvec3 SSR=texture2D(textureSampler,vUV).rgb;\nvec4 color=texture2D(mainSampler,vUV);\nvec4 reflectivity=texture2D(reflectivitySampler,vUV);\nif (max(reflectivity.r,max(reflectivity.g,reflectivity.b))<=reflectivityThreshold) {\ngl_FragColor=color;\nreturn;\n}\n#ifdef SSR_INPUT_IS_GAMMA_SPACE\ncolor=toLinearSpace(color);\n#endif\nvec3 reflectionMultiplier=clamp(pow(reflectivity.rgb*strength,vec3(reflectionSpecularFalloffExponent)),0.0,1.0);\nvec3 colorMultiplier=1.0-reflectionMultiplier;\nvec3 finalColor=(color.rgb*colorMultiplier)+(SSR*reflectionMultiplier);\n#ifdef SSR_OUTPUT_IS_GAMMA_SPACE\nfinalColor=toGammaSpace(finalColor);\n#endif\ngl_FragColor=vec4(finalColor,color.a);\n#endif\n}\n";const Wm=o.y3.Compose(new o.P(.5,.5,.5),o._f.Identity(),new o.P(.5,.5,.5)),Hm=o.y3.Compose(new o.P(.5,.5,1),o._f.Identity(),new o.P(.5,.5,0));class Xm extends Dm{set samples(e){this._samples!==e&&(this._samples=e,this._buildPipeline())}get samples(){return this._samples}get ssrDownsample(){return this._ssrDownsample}set ssrDownsample(e){e!==this._ssrDownsample&&(this._ssrDownsample=e,this._buildPipeline())}get blurDispersionStrength(){return this._blurDispersionStrength}set blurDispersionStrength(e){if(e===this._blurDispersionStrength)return;const t=0===e&&0!==this._blurDispersionStrength||0!==e&&0===this._blurDispersionStrength;this._blurDispersionStrength=e,t&&this._buildPipeline()}_useBlur(){return this._blurDispersionStrength>0}get blurDownsample(){return this._blurDownsample}set blurDownsample(e){e!==this._blurDownsample&&(this._blurDownsample=e,this._buildPipeline())}get enableSmoothReflections(){return this._enableSmoothReflections}set enableSmoothReflections(e){e!==this._enableSmoothReflections&&(this._enableSmoothReflections=e,this._updateEffectDefines())}get environmentTexture(){return this._environmentTexture}set environmentTexture(e){this._environmentTexture=e,this._updateEffectDefines()}get environmentTextureIsProbe(){return this._environmentTextureIsProbe}set environmentTextureIsProbe(e){this._environmentTextureIsProbe=e,this._updateEffectDefines()}get attenuateScreenBorders(){return this._attenuateScreenBorders}set attenuateScreenBorders(e){this._attenuateScreenBorders!==e&&(this._attenuateScreenBorders=e,this._updateEffectDefines())}get attenuateIntersectionDistance(){return this._attenuateIntersectionDistance}set attenuateIntersectionDistance(e){this._attenuateIntersectionDistance!==e&&(this._attenuateIntersectionDistance=e,this._updateEffectDefines())}get attenuateIntersectionIterations(){return this._attenuateIntersectionIterations}set attenuateIntersectionIterations(e){this._attenuateIntersectionIterations!==e&&(this._attenuateIntersectionIterations=e,this._updateEffectDefines())}get attenuateFacingCamera(){return this._attenuateFacingCamera}set attenuateFacingCamera(e){this._attenuateFacingCamera!==e&&(this._attenuateFacingCamera=e,this._updateEffectDefines())}get attenuateBackfaceReflection(){return this._attenuateBackfaceReflection}set attenuateBackfaceReflection(e){this._attenuateBackfaceReflection!==e&&(this._attenuateBackfaceReflection=e,this._updateEffectDefines())}get clipToFrustum(){return this._clipToFrustum}set clipToFrustum(e){this._clipToFrustum!==e&&(this._clipToFrustum=e,this._updateEffectDefines())}get enableAutomaticThicknessComputation(){return this._enableAutomaticThicknessComputation}set enableAutomaticThicknessComputation(e){this._enableAutomaticThicknessComputation!==e&&(this._enableAutomaticThicknessComputation=e,this._buildPipeline())}get backfaceDepthRenderer(){return this._depthRenderer}get backfaceDepthTextureDownsample(){return this._backfaceDepthTextureDownsample}set backfaceDepthTextureDownsample(e){this._backfaceDepthTextureDownsample!==e&&(this._backfaceDepthTextureDownsample=e,this._resizeDepthRenderer())}get backfaceForceDepthWriteTransparentMeshes(){return this._backfaceForceDepthWriteTransparentMeshes}set backfaceForceDepthWriteTransparentMeshes(e){this._backfaceForceDepthWriteTransparentMeshes!==e&&(this._backfaceForceDepthWriteTransparentMeshes=e,this._depthRenderer&&(this._depthRenderer.forceDepthWriteTransparentMeshes=e))}get isEnabled(){return this._isEnabled}set isEnabled(e){this._isEnabled!==e&&(this._isEnabled=e,e?e&&(this._isDirty?this._buildPipeline():null!==this._cameras&&this._scene.postProcessRenderPipelineManager.attachCamerasToRenderPipeline(this._name,this._cameras)):null!==this._cameras&&(this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name,this._cameras),this._cameras=this._camerasToBeAttached.slice()))}get inputTextureColorIsInGammaSpace(){return this._inputTextureColorIsInGammaSpace}set inputTextureColorIsInGammaSpace(e){this._inputTextureColorIsInGammaSpace!==e&&(this._inputTextureColorIsInGammaSpace=e,this._buildPipeline())}get generateOutputInGammaSpace(){return this._generateOutputInGammaSpace}set generateOutputInGammaSpace(e){this._generateOutputInGammaSpace!==e&&(this._generateOutputInGammaSpace=e,this._buildPipeline())}get debug(){return this._debug}set debug(e){this._debug!==e&&(this._debug=e,this._buildPipeline())}getScene(){return this._scene}get _geometryBufferRenderer(){return this._forceGeometryBuffer?this._scene.geometryBufferRenderer:null}get _prePassRenderer(){return this._forceGeometryBuffer?null:this._scene.prePassRenderer}get scene(){return this._scene}get isSupported(){const e=this._scene.getEngine().getCaps();return e.drawBuffersExtension&&e.texelFetch}constructor(e,t,i,n=!1,s=0){if(super(t.getEngine(),e),this.SSRRenderEffect="SSRRenderEffect",this.SSRBlurRenderEffect="SSRBlurRenderEffect",this.SSRCombineRenderEffect="SSRCombineRenderEffect",this._samples=1,this.maxDistance=1e3,this.step=1,this.thickness=.5,this.strength=1,this.reflectionSpecularFalloffExponent=1,this.maxSteps=1e3,this.roughnessFactor=.2,this.selfCollisionNumSkip=1,this.reflectivityThreshold=.04,this._ssrDownsample=0,this._blurDispersionStrength=.03,this._blurDownsample=0,this._enableSmoothReflections=!1,this._environmentTextureIsProbe=!1,this._attenuateScreenBorders=!0,this._attenuateIntersectionDistance=!0,this._attenuateIntersectionIterations=!0,this._attenuateFacingCamera=!1,this._attenuateBackfaceReflection=!1,this._clipToFrustum=!0,this._enableAutomaticThicknessComputation=!1,this._backfaceDepthTextureDownsample=0,this._backfaceForceDepthWriteTransparentMeshes=!0,this._isEnabled=!0,this._inputTextureColorIsInGammaSpace=!0,this._generateOutputInGammaSpace=!0,this._debug=!1,this._forceGeometryBuffer=!1,this._isDirty=!1,this._camerasToBeAttached=[],this._cameras=i||t.cameras,this._cameras=this._cameras.slice(),this._camerasToBeAttached=this._cameras.slice(),this._scene=t,this._textureType=s,this._forceGeometryBuffer=n,this.isSupported){if(t.postProcessRenderPipelineManager.addPipeline(this),this._forceGeometryBuffer){const e=t.enableGeometryBufferRenderer();e&&(e.enableReflectivity=!0,e.useSpecificClearForDepthTexture=!0)}else{const e=t.enablePrePassRenderer();e&&(e.useSpecificClearForDepthTexture=!0,e.markAsDirty())}this._buildPipeline()}}getClassName(){return"SSRRenderingPipeline"}addCamera(e){this._camerasToBeAttached.push(e),this._buildPipeline()}removeCamera(e){const t=this._camerasToBeAttached.indexOf(e);this._camerasToBeAttached.splice(t,1),this._buildPipeline()}dispose(e=!1){this._disposeDepthRenderer(),this._disposePostProcesses(),e&&this._scene.disableGeometryBufferRenderer(),this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name,this._cameras),super.dispose()}_getTextureSize(){var e,t;const i=this._scene.getEngine(),n=this._prePassRenderer;let s={width:i.getRenderWidth(),height:i.getRenderHeight()};if(n&&(null===(e=this._scene.activeCamera)||void 0===e?void 0:e._getFirstPostProcess())===this._ssrPostProcess){const e=n.getRenderTarget();e&&e.textures&&(s=e.textures[n.getIndex(4)].getSize())}else(null===(t=this._ssrPostProcess)||void 0===t?void 0:t.inputTexture)&&(s.width=this._ssrPostProcess.inputTexture.width,s.height=this._ssrPostProcess.inputTexture.height);return s}_updateEffectDefines(){var e;const t=[];(this._geometryBufferRenderer||this._prePassRenderer)&&t.push("#define SSR_SUPPORTED"),this._enableSmoothReflections&&t.push("#define SSRAYTRACE_ENABLE_REFINEMENT"),this._scene.useRightHandedSystem&&t.push("#define SSRAYTRACE_RIGHT_HANDED_SCENE"),this._environmentTexture&&(t.push("#define SSR_USE_ENVIRONMENT_CUBE"),this._environmentTexture.boundingBoxSize&&t.push("#define SSR_USE_LOCAL_REFLECTIONMAP_CUBIC"),this._environmentTexture.gammaSpace&&t.push("#define SSR_ENVIRONMENT_CUBE_IS_GAMMASPACE")),this._environmentTextureIsProbe&&t.push("#define SSR_INVERTCUBICMAP"),this._enableAutomaticThicknessComputation&&t.push("#define SSRAYTRACE_USE_BACK_DEPTHBUFFER"),this._attenuateScreenBorders&&t.push("#define SSR_ATTENUATE_SCREEN_BORDERS"),this._attenuateIntersectionDistance&&t.push("#define SSR_ATTENUATE_INTERSECTION_DISTANCE"),this._attenuateIntersectionIterations&&t.push("#define SSR_ATTENUATE_INTERSECTION_NUMITERATIONS"),this._attenuateFacingCamera&&t.push("#define SSR_ATTENUATE_FACING_CAMERA"),this._attenuateBackfaceReflection&&t.push("#define SSR_ATTENUATE_BACKFACE_REFLECTION"),this._clipToFrustum&&t.push("#define SSRAYTRACE_CLIP_TO_FRUSTUM"),this._useBlur()&&t.push("#define SSR_USE_BLUR"),this._debug&&t.push("#define SSRAYTRACE_DEBUG"),this._inputTextureColorIsInGammaSpace&&t.push("#define SSR_INPUT_IS_GAMMA_SPACE"),this._generateOutputInGammaSpace&&t.push("#define SSR_OUTPUT_IS_GAMMA_SPACE"),null===(e=this._ssrPostProcess)||void 0===e||e.updateEffect(t.join("\n"))}_buildPipeline(){var e;if(!this.isSupported)return;if(!this._isEnabled)return void(this._isDirty=!0);this._isDirty=!1;const t=this._scene.getEngine();if(this._disposeDepthRenderer(),this._disposePostProcesses(),null!==this._cameras&&(this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name,this._cameras),this._cameras=this._camerasToBeAttached.slice()),this._reset(),this._enableAutomaticThicknessComputation){const t=null===(e=this._cameras)||void 0===e?void 0:e[0];t&&(this._depthRendererCamera=t,this._depthRenderer=new ph(this._scene,void 0,void 0,void 0,1,!0,"SSRBackDepth"),this._depthRenderer.clearColor.r=1e8,this._depthRenderer.reverseCulling=!0,this._depthRenderer.getDepthMap().noPrePassRenderer=!0,this._depthRenderer.forceDepthWriteTransparentMeshes=this._backfaceForceDepthWriteTransparentMeshes,this._resizeDepthRenderer(),t.customRenderTargets.push(this._depthRenderer.getDepthMap()))}this._createSSRPostProcess(),this.addEffect(new am(t,this.SSRRenderEffect,(()=>this._ssrPostProcess),!0)),this._useBlur()&&(this._createBlurAndCombinerPostProcesses(),this.addEffect(new am(t,this.SSRBlurRenderEffect,(()=>[this._blurPostProcessX,this._blurPostProcessY]),!0)),this.addEffect(new am(t,this.SSRCombineRenderEffect,(()=>this._blurCombinerPostProcess),!0))),null!==this._cameras&&this._scene.postProcessRenderPipelineManager.attachCamerasToRenderPipeline(this._name,this._cameras)}_resizeDepthRenderer(){if(!this._depthRenderer)return;const e=this._getTextureSize(),t=this._depthRenderer.getDepthMap().getSize(),i=Math.floor(e.width/(this._backfaceDepthTextureDownsample+1)),n=Math.floor(e.height/(this._backfaceDepthTextureDownsample+1));t.width===i&&t.height===n||this._depthRenderer.getDepthMap().resize({width:i,height:n})}_disposeDepthRenderer(){var e;if(this._depthRenderer){if(this._depthRendererCamera){const t=null!==(e=this._depthRendererCamera.customRenderTargets.indexOf(this._depthRenderer.getDepthMap()))&&void 0!==e?e:-1;-1!==t&&this._depthRendererCamera.customRenderTargets.splice(t,1)}this._depthRendererCamera=null,this._depthRenderer.getDepthMap().dispose()}this._depthRenderer=null}_disposePostProcesses(){var e,t,i,n;for(let s=0;s<this._cameras.length;s++){const r=this._cameras[s];null===(e=this._ssrPostProcess)||void 0===e||e.dispose(r),null===(t=this._blurPostProcessX)||void 0===t||t.dispose(r),null===(i=this._blurPostProcessY)||void 0===i||i.dispose(r),null===(n=this._blurCombinerPostProcess)||void 0===n||n.dispose(r)}this._ssrPostProcess=null,this._blurPostProcessX=null,this._blurPostProcessY=null,this._blurCombinerPostProcess=null}_createSSRPostProcess(){this._ssrPostProcess=new ni.D("ssr","screenSpaceReflection2",["projection","invProjectionMatrix","view","invView","thickness","reflectionSpecularFalloffExponent","strength","stepSize","maxSteps","roughnessFactor","projectionPixel","nearPlaneZ","maxDistance","selfCollisionNumSkip","vReflectionPosition","vReflectionSize","backSizeFactor","reflectivityThreshold"],["textureSampler","normalSampler","reflectivitySampler","depthSampler","envCubeSampler","backDepthSampler"],1,null,this._textureType,this._scene.getEngine(),!1,"",this._textureType),this._updateEffectDefines(),this._ssrPostProcess.onApply=e=>{this._resizeDepthRenderer();const t=this._geometryBufferRenderer,i=this._prePassRenderer;if(!i&&!t)return;if(t){const i=t.getTextureIndex(Cm.REFLECTIVITY_TEXTURE_TYPE);e.setTexture("normalSampler",t.getGBuffer().textures[1]),e.setTexture("reflectivitySampler",t.getGBuffer().textures[i]),e.setTexture("depthSampler",t.getGBuffer().textures[0])}else if(i){const t=i.getIndex(5),n=i.getIndex(3),s=i.getIndex(6);e.setTexture("normalSampler",i.getRenderTarget().textures[s]),e.setTexture("depthSampler",i.getRenderTarget().textures[t]),e.setTexture("reflectivitySampler",i.getRenderTarget().textures[n])}this._enableAutomaticThicknessComputation&&this._depthRenderer&&(e.setTexture("backDepthSampler",this._depthRenderer.getDepthMap()),e.setFloat("backSizeFactor",this._backfaceDepthTextureDownsample+1));const n=this._scene.activeCamera;if(!n)return;const s=n.getViewMatrix(!0),r=n.getProjectionMatrix(!0);r.invertToRef(o.jp.Matrix[0]),s.invertToRef(o.jp.Matrix[1]),e.setMatrix("projection",r),e.setMatrix("view",s),e.setMatrix("invView",o.jp.Matrix[1]),e.setMatrix("invProjectionMatrix",o.jp.Matrix[0]),e.setFloat("thickness",this.thickness),e.setFloat("reflectionSpecularFalloffExponent",this.reflectionSpecularFalloffExponent),e.setFloat("strength",this.strength),e.setFloat("stepSize",this.step),e.setFloat("maxSteps",this.maxSteps),e.setFloat("roughnessFactor",this.roughnessFactor),e.setFloat("nearPlaneZ",n.minZ),e.setFloat("maxDistance",this.maxDistance),e.setFloat("selfCollisionNumSkip",this.selfCollisionNumSkip),e.setFloat("reflectivityThreshold",this.reflectivityThreshold);const a=this._getTextureSize();o.y3.ScalingToRef(a.width,a.height,1,o.jp.Matrix[2]),r.multiplyToRef(this._scene.getEngine().isWebGPU?Hm:Wm,o.jp.Matrix[3]),o.jp.Matrix[3].multiplyToRef(o.jp.Matrix[2],o.jp.Matrix[4]),e.setMatrix("projectionPixel",o.jp.Matrix[4]),this._environmentTexture&&(e.setTexture("envCubeSampler",this._environmentTexture),this._environmentTexture.boundingBoxSize&&(e.setVector3("vReflectionPosition",this._environmentTexture.boundingBoxPosition),e.setVector3("vReflectionSize",this._environmentTexture.boundingBoxSize)))},this._ssrPostProcess.samples=this.samples,this._forceGeometryBuffer||(this._ssrPostProcess._prePassEffectConfiguration=new zm)}_createBlurAndCombinerPostProcesses(){const e=this._scene.getEngine();this._blurPostProcessX=new ni.D("SSRblurX","screenSpaceReflection2Blur",["texelOffsetScale"],["textureSampler"],this._useBlur()?1/(this._ssrDownsample+1):1,null,2,e,!1,"",this._textureType),this._blurPostProcessX.autoClear=!1,this._blurPostProcessX.onApplyObservable.add((e=>{var t,i;const n=null!==(i=null===(t=this._blurPostProcessX)||void 0===t?void 0:t.inputTexture.width)&&void 0!==i?i:this._scene.getEngine().getRenderWidth();e.setFloat2("texelOffsetScale",this._blurDispersionStrength/n,0)})),this._blurPostProcessY=new ni.D("SSRblurY","screenSpaceReflection2Blur",["texelOffsetScale"],["textureSampler"],this._useBlur()?1/(this._blurDownsample+1):1,null,2,e,!1,"",this._textureType),this._blurPostProcessY.autoClear=!1,this._blurPostProcessY.onApplyObservable.add((e=>{var t,i;const n=null!==(i=null===(t=this._blurPostProcessY)||void 0===t?void 0:t.inputTexture.height)&&void 0!==i?i:this._scene.getEngine().getRenderHeight();e.setFloat2("texelOffsetScale",0,this._blurDispersionStrength/n)}));let t="";this._debug&&(t+="#define SSRAYTRACE_DEBUG\n"),this._inputTextureColorIsInGammaSpace&&(t+="#define SSR_INPUT_IS_GAMMA_SPACE\n"),this._generateOutputInGammaSpace&&(t+="#define SSR_OUTPUT_IS_GAMMA_SPACE\n"),this._blurCombinerPostProcess=new ni.D("SSRblurCombiner","screenSpaceReflection2BlurCombiner",["strength","reflectionSpecularFalloffExponent","reflectivityThreshold"],["textureSampler","mainSampler","reflectivitySampler"],this._useBlur()?1/(this._blurDownsample+1):1,null,1,e,!1,t,this._textureType),this._blurCombinerPostProcess.autoClear=!1,this._blurCombinerPostProcess.onApplyObservable.add((e=>{var t;const i=this._geometryBufferRenderer,n=this._prePassRenderer;if(n||i){if(n&&(null===(t=this._scene.activeCamera)||void 0===t?void 0:t._getFirstPostProcess())===this._ssrPostProcess){const t=n.getRenderTarget();t&&t.textures&&e.setTexture("mainSampler",t.textures[n.getIndex(4)])}else e.setTextureFromPostProcess("mainSampler",this._ssrPostProcess);if(i){const t=i.getTextureIndex(Cm.REFLECTIVITY_TEXTURE_TYPE);e.setTexture("reflectivitySampler",i.getGBuffer().textures[t])}else if(n){const t=n.getIndex(3);e.setTexture("reflectivitySampler",n.getRenderTarget().textures[t])}e.setFloat("strength",this.strength),e.setFloat("reflectionSpecularFalloffExponent",this.reflectionSpecularFalloffExponent),e.setFloat("reflectivityThreshold",this.reflectivityThreshold)}}))}serialize(){const e=Te.p4.Serialize(this);return e.customType="SSRRenderingPipeline",e}static Parse(e,t,i){return Te.p4.Parse((()=>new Xm(e._name,t,e._ratio)),e,t,i)}}(0,be.gn)([(0,Te.qC)()],Xm.prototype,"samples",null),(0,be.gn)([(0,Te.qC)()],Xm.prototype,"maxDistance",void 0),(0,be.gn)([(0,Te.qC)()],Xm.prototype,"step",void 0),(0,be.gn)([(0,Te.qC)()],Xm.prototype,"thickness",void 0),(0,be.gn)([(0,Te.qC)()],Xm.prototype,"strength",void 0),(0,be.gn)([(0,Te.qC)()],Xm.prototype,"reflectionSpecularFalloffExponent",void 0),(0,be.gn)([(0,Te.qC)()],Xm.prototype,"maxSteps",void 0),(0,be.gn)([(0,Te.qC)()],Xm.prototype,"roughnessFactor",void 0),(0,be.gn)([(0,Te.qC)()],Xm.prototype,"selfCollisionNumSkip",void 0),(0,be.gn)([(0,Te.qC)()],Xm.prototype,"reflectivityThreshold",void 0),(0,be.gn)([(0,Te.qC)("_ssrDownsample")],Xm.prototype,"_ssrDownsample",void 0),(0,be.gn)([(0,Te.qC)()],Xm.prototype,"ssrDownsample",null),(0,be.gn)([(0,Te.qC)("blurDispersionStrength")],Xm.prototype,"_blurDispersionStrength",void 0),(0,be.gn)([(0,Te.qC)("blurDownsample")],Xm.prototype,"_blurDownsample",void 0),(0,be.gn)([(0,Te.qC)("enableSmoothReflections")],Xm.prototype,"_enableSmoothReflections",void 0),(0,be.gn)([(0,Te.qC)("environmentTexture")],Xm.prototype,"_environmentTexture",void 0),(0,be.gn)([(0,Te.qC)("environmentTextureIsProbe")],Xm.prototype,"_environmentTextureIsProbe",void 0),(0,be.gn)([(0,Te.qC)("attenuateScreenBorders")],Xm.prototype,"_attenuateScreenBorders",void 0),(0,be.gn)([(0,Te.qC)("attenuateIntersectionDistance")],Xm.prototype,"_attenuateIntersectionDistance",void 0),(0,be.gn)([(0,Te.qC)("attenuateIntersectionIterations")],Xm.prototype,"_attenuateIntersectionIterations",void 0),(0,be.gn)([(0,Te.qC)("attenuateFacingCamera")],Xm.prototype,"_attenuateFacingCamera",void 0),(0,be.gn)([(0,Te.qC)("attenuateBackfaceReflection")],Xm.prototype,"_attenuateBackfaceReflection",void 0),(0,be.gn)([(0,Te.qC)("clipToFrustum")],Xm.prototype,"_clipToFrustum",void 0),(0,be.gn)([(0,Te.qC)("enableAutomaticThicknessComputation")],Xm.prototype,"_enableAutomaticThicknessComputation",void 0),(0,be.gn)([(0,Te.qC)("backfaceDepthTextureDownsample")],Xm.prototype,"_backfaceDepthTextureDownsample",void 0),(0,be.gn)([(0,Te.qC)("backfaceForceDepthWriteTransparentMeshes")],Xm.prototype,"_backfaceForceDepthWriteTransparentMeshes",void 0),(0,be.gn)([(0,Te.qC)("isEnabled")],Xm.prototype,"_isEnabled",void 0),(0,be.gn)([(0,Te.qC)("inputTextureColorIsInGammaSpace")],Xm.prototype,"_inputTextureColorIsInGammaSpace",void 0),(0,be.gn)([(0,Te.qC)("generateOutputInGammaSpace")],Xm.prototype,"_generateOutputInGammaSpace",void 0),(0,be.gn)([(0,Te.qC)("debug")],Xm.prototype,"_debug",void 0),(0,l.H)("BABYLON.SSRRenderingPipeline",Xm);var jm;si.v.ShadersStore.tonemapPixelShader="varying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform float _ExposureAdjustment;\n#if defined(HABLE_TONEMAPPING)\nconst float A=0.15;\nconst float B=0.50;\nconst float C=0.10;\nconst float D=0.20;\nconst float E=0.02;\nconst float F=0.30;\nconst float W=11.2;\n#endif\nfloat Luminance(vec3 c)\n{\nreturn dot(c,vec3(0.22,0.707,0.071));\n}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) \n{\nvec3 colour=texture2D(textureSampler,vUV).rgb;\n#if defined(REINHARD_TONEMAPPING)\nfloat lum=Luminance(colour.rgb); \nfloat lumTm=lum*_ExposureAdjustment;\nfloat scale=lumTm/(1.0+lumTm); \ncolour*=scale/lum;\n#elif defined(HABLE_TONEMAPPING)\ncolour*=_ExposureAdjustment;\nconst float ExposureBias=2.0;\nvec3 x=ExposureBias*colour;\nvec3 curr=((x*(A*x+C*B)+D*E)/(x*(A*x+B)+D*F))-E/F;\nx=vec3(W,W,W);\nvec3 whiteScale=1.0/(((x*(A*x+C*B)+D*E)/(x*(A*x+B)+D*F))-E/F);\ncolour=curr*whiteScale;\n#elif defined(OPTIMIZED_HEJIDAWSON_TONEMAPPING)\ncolour*=_ExposureAdjustment;\nvec3 X=max(vec3(0.0,0.0,0.0),colour-0.004);\nvec3 retColor=(X*(6.2*X+0.5))/(X*(6.2*X+1.7)+0.06);\ncolour=retColor*retColor;\n#elif defined(PHOTOGRAPHIC_TONEMAPPING)\ncolour= vec3(1.0,1.0,1.0)-exp2(-_ExposureAdjustment*colour);\n#endif\ngl_FragColor=vec4(colour.rgb,1.0);\n}",function(e){e[e.Hable=0]="Hable",e[e.Reinhard=1]="Reinhard",e[e.HejiDawson=2]="HejiDawson",e[e.Photographic=3]="Photographic"}(jm||(jm={}));class Ym extends ni.D{getClassName(){return"TonemapPostProcess"}constructor(e,t,i,n,s=2,r,o=0,a){super(e,"tonemap",["_ExposureAdjustment"],null,1,n,s,r,a,null,o),this._operator=t,this.exposureAdjustment=i;let l="#define ";this._operator===jm.Hable?l+="HABLE_TONEMAPPING":this._operator===jm.Reinhard?l+="REINHARD_TONEMAPPING":this._operator===jm.HejiDawson?l+="OPTIMIZED_HEJIDAWSON_TONEMAPPING":this._operator===jm.Photographic&&(l+="PHOTOGRAPHIC_TONEMAPPING"),this.updateEffect(l),this.onApply=e=>{e.setFloat("_ExposureAdjustment",this.exposureAdjustment)}}}si.v.ShadersStore.volumetricLightScatteringPixelShader="uniform sampler2D textureSampler;\nuniform sampler2D lightScatteringSampler;\nuniform float decay;\nuniform float exposure;\nuniform float weight;\nuniform float density;\nuniform vec2 meshPositionOnScreen;\nvarying vec2 vUV;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\nvec2 tc=vUV;\nvec2 deltaTexCoord=(tc-meshPositionOnScreen.xy);\ndeltaTexCoord*=1.0/float(NUM_SAMPLES)*density;\nfloat illuminationDecay=1.0;\nvec4 color=texture2D(lightScatteringSampler,tc)*0.4;\nfor(int i=0; i<NUM_SAMPLES; i++) {\ntc-=deltaTexCoord;\nvec4 dataSample=texture2D(lightScatteringSampler,tc)*0.4;\ndataSample*=illuminationDecay*weight;\ncolor+=dataSample;\nilluminationDecay*=decay;\n}\nvec4 realColor=texture2D(textureSampler,vUV);\ngl_FragColor=((vec4((vec3(color.r,color.g,color.b)*exposure),1))+(realColor*(1.5-0.4)));\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n";si.v.ShadersStore.volumetricLightScatteringPassVertexShader="attribute vec3 position;\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<morphTargetsVertexGlobalDeclaration>\n#include<morphTargetsVertexDeclaration>[0..maxSimultaneousMorphTargets]\n#include<instancesDeclaration>\nuniform mat4 viewProjection;\nuniform vec2 depthValues;\n#if defined(ALPHATEST) || defined(NEED_UV)\nvarying vec2 vUV;\nuniform mat4 diffuseMatrix;\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#endif\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void)\n{\nvec3 positionUpdated=position;\n#if (defined(ALPHATEST) || defined(NEED_UV)) && defined(UV1)\nvec2 uvUpdated=uv;\n#endif\n#include<morphTargetsVertexGlobal>\n#include<morphTargetsVertex>[0..maxSimultaneousMorphTargets]\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\ngl_Position=viewProjection*finalWorld*vec4(positionUpdated,1.0);\n#if defined(ALPHATEST) || defined(BASIC_RENDER)\n#ifdef UV1\nvUV=vec2(diffuseMatrix*vec4(uvUpdated,1.0,0.0));\n#endif\n#ifdef UV2\nvUV=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));\n#endif\n#endif\n}\n";si.v.ShadersStore.volumetricLightScatteringPassPixelShader="#if defined(ALPHATEST) || defined(NEED_UV)\nvarying vec2 vUV;\n#endif\n#if defined(ALPHATEST)\nuniform sampler2D diffuseSampler;\n#endif\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\n#if defined(ALPHATEST)\nvec4 diffuseColor=texture2D(diffuseSampler,vUV);\nif (diffuseColor.a<0.4)\ndiscard;\n#endif\ngl_FragColor=vec4(0.0,0.0,0.0,1.0);\n}\n";class qm extends ni.D{get useDiffuseColor(){return _.Y.Warn("VolumetricLightScatteringPostProcess.useDiffuseColor is no longer used, use the mesh material directly instead"),!1}set useDiffuseColor(e){_.Y.Warn("VolumetricLightScatteringPostProcess.useDiffuseColor is no longer used, use the mesh material directly instead")}constructor(e,t,i,n,s=100,r=Ce.x.BILINEAR_SAMPLINGMODE,a,l,h){var c,u;super(e,"volumetricLightScattering",["decay","exposure","weight","meshPositionOnScreen","density"],["lightScatteringSampler"],t.postProcessRatio||t,i,r,a,l,"#define NUM_SAMPLES "+s),this._screenCoordinates=o.FM.Zero(),this.customMeshPosition=o.P.Zero(),this.useCustomMeshPosition=!1,this.invert=!0,this.excludedMeshes=new Array,this.includedMeshes=new Array,this.exposure=.3,this.decay=.96815,this.weight=.58767,this.density=.926,a=(h=null!==(u=null!==(c=null==i?void 0:i.getScene())&&void 0!==c?c:h)&&void 0!==u?u:this._scene).getEngine(),this._viewPort=new ui.l(0,0,1,1).toGlobal(a.getRenderWidth(),a.getRenderHeight()),this.mesh=null!=n?n:qm.CreateDefaultMesh("VolumetricLightScatteringMesh",h),this._createPass(h,t.passRatio||t),this.onActivate=e=>{this.isSupported||this.dispose(e),this.onActivate=null},this.onApplyObservable.add((e=>{this._updateMeshScreenCoordinates(h),e.setTexture("lightScatteringSampler",this._volumetricLightScatteringRTT),e.setFloat("exposure",this.exposure),e.setFloat("decay",this.decay),e.setFloat("weight",this.weight),e.setFloat("density",this.density),e.setVector2("meshPositionOnScreen",this._screenCoordinates)}))}getClassName(){return"VolumetricLightScatteringPostProcess"}_isReady(e,t){var i;const n=e.getMesh();if(n===this.mesh&&n.material)return n.material.isReady(n);const s=null===(i=n._internalAbstractMeshDataInfo._materialForRenderPass)||void 0===i?void 0:i[this._scene.getEngine().currentRenderPassId];if(s)return s.isReadyForSubMesh(n,e,t);const r=[],o=[qe.o.PositionKind],a=e.getMaterial();a&&(a.needAlphaTesting()&&r.push("#define ALPHATEST"),n.isVerticesDataPresent(qe.o.UVKind)&&(o.push(qe.o.UVKind),r.push("#define UV1")),n.isVerticesDataPresent(qe.o.UV2Kind)&&(o.push(qe.o.UV2Kind),r.push("#define UV2"))),n.useBones&&n.computeBonesUsingShaders?(o.push(qe.o.MatricesIndicesKind),o.push(qe.o.MatricesWeightsKind),r.push("#define NUM_BONE_INFLUENCERS "+n.numBoneInfluencers),r.push("#define BonesPerMesh "+(n.skeleton?n.skeleton.bones.length+1:0))):r.push("#define NUM_BONE_INFLUENCERS 0"),t&&(r.push("#define INSTANCES"),La.G.PushAttributesForInstances(o),e.getRenderingMesh().hasThinInstances&&r.push("#define THIN_INSTANCES"));const l=e._getDrawWrapper(void 0,!0),h=l.defines,c=r.join("\n");return h!==c&&l.setEffect(n.getScene().getEngine().createEffect("volumetricLightScatteringPass",o,["world","mBones","viewProjection","diffuseMatrix"],["diffuseSampler"],c,void 0,void 0,void 0,{maxSimultaneousMorphTargets:n.numBoneInfluencers}),c),l.effect.isReady()}setCustomMeshPosition(e){this.customMeshPosition=e}getCustomMeshPosition(){return this.customMeshPosition}dispose(e){const t=e.getScene().customRenderTargets.indexOf(this._volumetricLightScatteringRTT);-1!==t&&e.getScene().customRenderTargets.splice(t,1),this._volumetricLightScatteringRTT.dispose(),super.dispose(e)}getPass(){return this._volumetricLightScatteringRTT}_meshExcluded(e){return this.includedMeshes.length>0&&-1===this.includedMeshes.indexOf(e)||this.excludedMeshes.length>0&&-1!==this.excludedMeshes.indexOf(e)}_createPass(e,t){const i=e.getEngine();this._volumetricLightScatteringRTT=new Ai._("volumetricLightScatteringMap",{width:i.getRenderWidth()*t,height:i.getRenderHeight()*t},e,!1,!0,0),this._volumetricLightScatteringRTT.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._volumetricLightScatteringRTT.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._volumetricLightScatteringRTT.renderList=null,this._volumetricLightScatteringRTT.renderParticles=!1,this._volumetricLightScatteringRTT.ignoreCameraViewport=!0;const n=this.getCamera();n?n.customRenderTargets.push(this._volumetricLightScatteringRTT):e.customRenderTargets.push(this._volumetricLightScatteringRTT);const s=e=>{var t;const i=e.getRenderingMesh(),n=e.getEffectiveMesh();if(this._meshExcluded(i))return;n._internalAbstractMeshDataInfo._isActiveIntermediate=!1;const s=e.getMaterial();if(!s)return;const r=i.getScene(),o=r.getEngine();o.setState(s.backFaceCulling,void 0,void 0,void 0,s.cullBackFaces);const a=i._getInstancesRenderList(e._id,!!e.getReplacementMesh());if(a.mustReturn)return;const l=o.getCaps().instancedArrays&&(null!==a.visibleInstances[e._id]||i.hasThinInstances);if(this._isReady(e,l)){const h=null===(t=n._internalAbstractMeshDataInfo._materialForRenderPass)||void 0===t?void 0:t[o.currentRenderPassId];let c=e._getDrawWrapper();if(i!==this.mesh||c||(c=s._getDrawWrapper()),!c)return;const u=c.effect;if(o.enableEffect(c),l||i._bind(e,u,s.fillMode),i===this.mesh)s.bind(n.getWorldMatrix(),i);else if(h)h.bindForSubMesh(n.getWorldMatrix(),n,e);else{if(u.setMatrix("viewProjection",r.getTransformMatrix()),s&&s.needAlphaTesting()){const e=s.getAlphaTestTexture();u.setTexture("diffuseSampler",e),e&&u.setMatrix("diffuseMatrix",e.getTextureMatrix())}i.useBones&&i.computeBonesUsingShaders&&i.skeleton&&u.setMatrices("mBones",i.skeleton.getTransformMatrices(i))}l&&i.hasThinInstances&&u.setMatrix("world",n.getWorldMatrix()),i._processRendering(n,e,u,cs.F.TriangleFillMode,a,l,((e,t)=>{e||u.setMatrix("world",t)}))}};let r;const o=new a.HE(0,0,0,1);this._volumetricLightScatteringRTT.onBeforeRenderObservable.add((()=>{r=e.clearColor,e.clearColor=o})),this._volumetricLightScatteringRTT.onAfterRenderObservable.add((()=>{e.clearColor=r})),this._volumetricLightScatteringRTT.customIsReadyFunction=(e,t,n)=>{if((n||0===t)&&e.subMeshes)for(let t=0;t<e.subMeshes.length;++t){const n=e.subMeshes[t],s=n.getMaterial(),r=n.getRenderingMesh();if(!s)continue;const o=r._getInstancesRenderList(n._id,!!n.getReplacementMesh()),a=i.getCaps().instancedArrays&&(null!==o.visibleInstances[n._id]||r.hasThinInstances);if(!this._isReady(n,a))return!1}return!0},this._volumetricLightScatteringRTT.customRenderFunction=(t,i,n,r)=>{const o=e.getEngine();let a;if(r.length){for(o.setColorWrite(!1),a=0;a<r.length;a++)s(r.data[a]);o.setColorWrite(!0)}for(a=0;a<t.length;a++)s(t.data[a]);for(a=0;a<i.length;a++)s(i.data[a]);if(n.length){for(a=0;a<n.length;a++){const t=n.data[a],i=t.getBoundingInfo();i&&e.activeCamera&&(t._alphaIndex=t.getMesh().alphaIndex,t._distanceToCamera=i.boundingSphere.centerWorld.subtract(e.activeCamera.position).length())}const t=n.data.slice(0,n.length);for(t.sort(((e,t)=>e._alphaIndex>t._alphaIndex?1:e._alphaIndex<t._alphaIndex?-1:e._distanceToCamera<t._distanceToCamera?1:e._distanceToCamera>t._distanceToCamera?-1:0)),o.setAlphaMode(2),a=0;a<t.length;a++)s(t[a]);o.setAlphaMode(0)}}}_updateMeshScreenCoordinates(e){const t=e.getTransformMatrix();let i;i=this.useCustomMeshPosition?this.customMeshPosition:this.attachedNode?this.attachedNode.position:this.mesh.parent?this.mesh.getAbsolutePosition():this.mesh.position;const n=o.P.Project(i,o.y3.Identity(),t,this._viewPort);this._screenCoordinates.x=n.x/this._viewPort.width,this._screenCoordinates.y=n.y/this._viewPort.height,this.invert&&(this._screenCoordinates.y=1-this._screenCoordinates.y)}static CreateDefaultMesh(e,t){const i=(0,pa.pT)(e,{size:1},t);i.billboardMode=Un.x.BILLBOARDMODE_ALL;const n=new Gi.K(e+"Material",t);return n.emissiveColor=new a.Wo(1,1,1),i.material=n,i}}(0,be.gn)([(0,Te.hd)()],qm.prototype,"customMeshPosition",void 0),(0,be.gn)([(0,Te.qC)()],qm.prototype,"useCustomMeshPosition",void 0),(0,be.gn)([(0,Te.qC)()],qm.prototype,"invert",void 0),(0,be.gn)([(0,Te.RR)()],qm.prototype,"mesh",void 0),(0,be.gn)([(0,Te.qC)()],qm.prototype,"excludedMeshes",void 0),(0,be.gn)([(0,Te.qC)()],qm.prototype,"includedMeshes",void 0),(0,be.gn)([(0,Te.qC)()],qm.prototype,"exposure",void 0),(0,be.gn)([(0,Te.qC)()],qm.prototype,"decay",void 0),(0,be.gn)([(0,Te.qC)()],qm.prototype,"weight",void 0),(0,be.gn)([(0,Te.qC)()],qm.prototype,"density",void 0),(0,l.H)("BABYLON.VolumetricLightScatteringPostProcess",qm);si.v.ShadersStore.screenSpaceCurvaturePixelShader="precision highp float;\nvarying vec2 vUV;\nuniform sampler2D textureSampler;\nuniform sampler2D normalSampler;\nuniform float curvature_ridge;\nuniform float curvature_valley;\n#ifndef CURVATURE_OFFSET\n#define CURVATURE_OFFSET 1\n#endif\nfloat curvature_soft_clamp(float curvature,float control)\n{\nif (curvature<0.5/control)\nreturn curvature*(1.0-curvature*control);\nreturn 0.25/control;\n}\nfloat calculate_curvature(ivec2 texel,float ridge,float valley)\n{\nvec2 normal_up =texelFetch(normalSampler,texel+ivec2(0, CURVATURE_OFFSET),0).rb;\nvec2 normal_down =texelFetch(normalSampler,texel+ivec2(0,-CURVATURE_OFFSET),0).rb;\nvec2 normal_left =texelFetch(normalSampler,texel+ivec2(-CURVATURE_OFFSET,0),0).rb;\nvec2 normal_right=texelFetch(normalSampler,texel+ivec2( CURVATURE_OFFSET,0),0).rb;\nfloat normal_diff=((normal_up.g-normal_down.g)+(normal_right.r-normal_left.r));\nif (normal_diff<0.0)\nreturn -2.0*curvature_soft_clamp(-normal_diff,valley);\nreturn 2.0*curvature_soft_clamp(normal_diff,ridge);\n}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) \n{\nivec2 texel=ivec2(gl_FragCoord.xy);\nvec4 baseColor=texture2D(textureSampler,vUV);\nfloat curvature=calculate_curvature(texel,curvature_ridge,curvature_valley);\nbaseColor.rgb*=curvature+1.0;\ngl_FragColor=baseColor;\n}";class Km extends ni.D{getClassName(){return"ScreenSpaceCurvaturePostProcess"}constructor(e,t,i,n,s,r,o,a=0,l=!1){super(e,"screenSpaceCurvature",["curvature_ridge","curvature_valley"],["textureSampler","normalSampler"],i,n,s,r,o,void 0,a,void 0,null,l),this.ridge=1,this.valley=1,this._geometryBufferRenderer=t.enableGeometryBufferRenderer(),this._geometryBufferRenderer?this.onApply=e=>{e.setFloat("curvature_ridge",.5/Math.max(this.ridge*this.ridge,1e-4)),e.setFloat("curvature_valley",.7/Math.max(this.valley*this.valley,1e-4));const t=this._geometryBufferRenderer.getGBuffer().textures[1];e.setTexture("normalSampler",t)}:_.Y.Error("Multiple Render Target support needed for screen space curvature post process. Please use IsSupported test first.")}static get IsSupported(){const e=A.l.LastCreatedEngine;return!!e&&e.getCaps().drawBuffersExtension}static _Parse(e,t,i,n){return Te.p4.Parse((()=>new Km(e.name,i,e.options,t,e.renderTargetSamplingMode,i.getEngine(),e.textureType,e.reusable)),e,i,n)}}(0,be.gn)([(0,Te.qC)()],Km.prototype,"ridge",void 0),(0,be.gn)([(0,Te.qC)()],Km.prototype,"valley",void 0),(0,l.H)("BABYLON.ScreenSpaceCurvaturePostProcess",Km);si.v.IncludesShadersStore.boundingBoxRendererFragmentDeclaration="uniform vec4 color;\n";si.v.IncludesShadersStore.boundingBoxRendererUboDeclaration="#ifdef WEBGL2\nuniform vec4 color;\nuniform mat4 world;\nuniform mat4 viewProjection;\n#ifdef MULTIVIEW\nuniform mat4 viewProjectionR;\n#endif\n#else\nlayout(std140,column_major) uniform;\nuniform BoundingBoxRenderer {\nvec4 color;\nmat4 world;\nmat4 viewProjection;\nmat4 viewProjectionR;\n};\n#endif\n";si.v.ShadersStore.boundingBoxRendererPixelShader="#include<__decl__boundingBoxRendererFragment>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\ngl_FragColor=color;\n#define CUSTOM_FRAGMENT_MAIN_END\n}";si.v.IncludesShadersStore.boundingBoxRendererVertexDeclaration="uniform mat4 world;\nuniform mat4 viewProjection;\n#ifdef MULTIVIEW\nuniform mat4 viewProjectionR;\n#endif\n";si.v.ShadersStore.boundingBoxRendererVertexShader="attribute vec3 position;\n#include<__decl__boundingBoxRendererVertex>\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nvec4 worldPos=world*vec4(position,1.0);\n#ifdef MULTIVIEW\nif (gl_ViewID_OVR==0u) {\ngl_Position=viewProjection*worldPos;\n} else {\ngl_Position=viewProjectionR*worldPos;\n}\n#else\ngl_Position=viewProjection*worldPos;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n",Object.defineProperty(k.x.prototype,"forceShowBoundingBoxes",{get:function(){return this._forceShowBoundingBoxes||!1},set:function(e){this._forceShowBoundingBoxes=e,e&&this.getBoundingBoxRenderer()},enumerable:!0,configurable:!0}),k.x.prototype.getBoundingBoxRenderer=function(){return this._boundingBoxRenderer||(this._boundingBoxRenderer=new $m(this)),this._boundingBoxRenderer},Object.defineProperty(Un.x.prototype,"showBoundingBox",{get:function(){return this._showBoundingBox||!1},set:function(e){this._showBoundingBox=e,e&&this.getScene().getBoundingBoxRenderer()},enumerable:!0,configurable:!0});class $m{constructor(e){this.name=ve.l.NAME_BOUNDINGBOXRENDERER,this.frontColor=new a.Wo(1,1,1),this.backColor=new a.Wo(.1,.1,.1),this.showBackLines=!0,this.onBeforeBoxRenderingObservable=new r.y$,this.onAfterBoxRenderingObservable=new r.y$,this.onResourcesReadyObservable=new r.y$,this.enabled=!0,this.renderList=new Fn.t(32),this._vertexBuffers={},this._fillIndexBuffer=null,this._fillIndexData=null,this.scene=e,e._addComponent(this),this._uniformBufferFront=new Ci.M(this.scene.getEngine(),void 0,void 0,"BoundingBoxRendererFront",!this.scene.getEngine().isWebGPU),this._buildUniformLayout(this._uniformBufferFront),this._uniformBufferBack=new Ci.M(this.scene.getEngine(),void 0,void 0,"BoundingBoxRendererBack",!this.scene.getEngine().isWebGPU),this._buildUniformLayout(this._uniformBufferBack)}_buildUniformLayout(e){e.addUniform("color",4),e.addUniform("world",16),e.addUniform("viewProjection",16),e.addUniform("viewProjectionR",16),e.create()}register(){this.scene._beforeEvaluateActiveMeshStage.registerStep(ve.l.STEP_BEFOREEVALUATEACTIVEMESH_BOUNDINGBOXRENDERER,this,this.reset),this.scene._preActiveMeshStage.registerStep(ve.l.STEP_PREACTIVEMESH_BOUNDINGBOXRENDERER,this,this._preActiveMesh),this.scene._evaluateSubMeshStage.registerStep(ve.l.STEP_EVALUATESUBMESH_BOUNDINGBOXRENDERER,this,this._evaluateSubMesh),this.scene._afterRenderingGroupDrawStage.registerStep(ve.l.STEP_AFTERRENDERINGGROUPDRAW_BOUNDINGBOXRENDERER,this,this.render)}_evaluateSubMesh(e,t){if(e.showSubMeshesBoundingBox){const i=t.getBoundingInfo();null!=i&&(i.boundingBox._tag=e.renderingGroupId,this.renderList.push(i.boundingBox))}}_preActiveMesh(e){if(e.showBoundingBox||this.scene.forceShowBoundingBoxes){const t=e.getBoundingInfo();t.boundingBox._tag=e.renderingGroupId,this.renderList.push(t.boundingBox)}}_prepareResources(){if(this._colorShader)return;this._colorShader=new us.j("colorShader",this.scene,"boundingBoxRenderer",{attributes:[qe.o.PositionKind],uniforms:["world","viewProjection","viewProjectionR","color"],uniformBuffers:["BoundingBoxRenderer"]},!1),this._colorShader.doNotSerialize=!0,this._colorShader.reservedDataStore={hidden:!0},this._colorShaderForOcclusionQuery=new us.j("colorShaderOccQuery",this.scene,"boundingBoxRenderer",{attributes:[qe.o.PositionKind],uniforms:["world","viewProjection","viewProjectionR","color"],uniformBuffers:["BoundingBoxRenderer"]},!0),this._colorShaderForOcclusionQuery.doNotSerialize=!0,this._colorShaderForOcclusionQuery.reservedDataStore={hidden:!0};const e=this.scene.getEngine(),t=(0,Yn.aR)({size:1});this._vertexBuffers[qe.o.PositionKind]=new qe.o(e,t.positions,qe.o.PositionKind,!1),this._createIndexBuffer(),this._fillIndexData=t.indices,this.onResourcesReadyObservable.notifyObservers(this)}_createIndexBuffer(){const e=this.scene.getEngine();this._indexBuffer=e.createIndexBuffer([0,1,1,2,2,3,3,0,4,5,5,6,6,7,7,4,0,7,1,6,2,5,3,4])}rebuild(){const e=this._vertexBuffers[qe.o.PositionKind];e&&e._rebuild(),this._createIndexBuffer()}reset(){this.renderList.reset()}render(e){var t,i;if(0===this.renderList.length||!this.enabled)return;if(this._prepareResources(),!this._colorShader.isReady())return;const n=this.scene.getEngine();n.setDepthWrite(!1);const s=this.frontColor.toColor4(),r=this.backColor.toColor4(),a=this.scene.getTransformMatrix();for(let l=0;l<this.renderList.length;l++){const h=this.renderList.data[l];if(h._tag!==e)continue;this._createWrappersForBoundingBox(h),this.onBeforeBoxRenderingObservable.notifyObservers(h);const c=h.minimum,u=h.maximum.subtract(c),d=c.add(u.scale(.5)),p=o.y3.Scaling(u.x,u.y,u.z).multiply(o.y3.Translation(d.x,d.y,d.z)).multiply(h.getWorldMatrix()),f=n.useReverseDepthBuffer;if(this.showBackLines){const e=null!==(t=h._drawWrapperBack)&&void 0!==t?t:this._colorShader._getDrawWrapper();this._colorShader._preBind(e),n.bindBuffers(this._vertexBuffers,this._indexBuffer,this._colorShader.getEffect()),f?n.setDepthFunctionToLessOrEqual():n.setDepthFunctionToGreaterOrEqual(),this._uniformBufferBack.bindToEffect(e.effect,"BoundingBoxRenderer"),this._uniformBufferBack.updateDirectColor4("color",r),this._uniformBufferBack.updateMatrix("world",p),this._uniformBufferBack.updateMatrix("viewProjection",a),this._uniformBufferBack.update(),n.drawElementsType(cs.F.LineListDrawMode,0,24)}const _=null!==(i=h._drawWrapperFront)&&void 0!==i?i:this._colorShader._getDrawWrapper();this._colorShader._preBind(_),n.bindBuffers(this._vertexBuffers,this._indexBuffer,this._colorShader.getEffect()),f?n.setDepthFunctionToGreater():n.setDepthFunctionToLess(),this._uniformBufferFront.bindToEffect(_.effect,"BoundingBoxRenderer"),this._uniformBufferFront.updateDirectColor4("color",s),this._uniformBufferFront.updateMatrix("world",p),this._uniformBufferFront.updateMatrix("viewProjection",a),this._uniformBufferFront.update(),n.drawElementsType(cs.F.LineListDrawMode,0,24),this.onAfterBoxRenderingObservable.notifyObservers(h)}this._colorShader.unbind(),n.setDepthFunctionToLessOrEqual(),n.setDepthWrite(!0)}_createWrappersForBoundingBox(e){if(!e._drawWrapperFront){const t=this.scene.getEngine();e._drawWrapperFront=new Ps.q(t),e._drawWrapperBack=new Ps.q(t),e._drawWrapperFront.setEffect(this._colorShader.getEffect()),e._drawWrapperBack.setEffect(this._colorShader.getEffect())}}renderOcclusionBoundingBox(e){const t=this.scene.getEngine();void 0===this._renderPassIdForOcclusionQuery&&(this._renderPassIdForOcclusionQuery=t.createRenderPassId("Render pass for occlusion query"));const i=t.currentRenderPassId;t.currentRenderPassId=this._renderPassIdForOcclusionQuery,this._prepareResources();const n=e.subMeshes[0];if(!this._colorShaderForOcclusionQuery.isReady(e,void 0,n)||!e.hasBoundingInfo)return void(t.currentRenderPassId=i);this._fillIndexBuffer||(this._fillIndexBuffer=t.createIndexBuffer(this._fillIndexData));const s=t.useReverseDepthBuffer;t.setDepthWrite(!1),t.setColorWrite(!1);const r=e.getBoundingInfo().boundingBox,a=r.minimum,l=r.maximum.subtract(a),h=a.add(l.scale(.5)),c=o.y3.Scaling(l.x,l.y,l.z).multiply(o.y3.Translation(h.x,h.y,h.z)).multiply(r.getWorldMatrix()),u=n._drawWrapper;this._colorShaderForOcclusionQuery._preBind(u),t.bindBuffers(this._vertexBuffers,this._fillIndexBuffer,u.effect),s?t.setDepthFunctionToGreater():t.setDepthFunctionToLess(),this.scene.resetCachedMaterial(),this._uniformBufferFront.bindToEffect(u.effect,"BoundingBoxRenderer"),this._uniformBufferFront.updateMatrix("world",c),this._uniformBufferFront.updateMatrix("viewProjection",this.scene.getTransformMatrix()),this._uniformBufferFront.update(),t.drawElementsType(cs.F.TriangleFillMode,0,36),this._colorShaderForOcclusionQuery.unbind(),t.setDepthFunctionToLessOrEqual(),t.setDepthWrite(!0),t.setColorWrite(!0),t.currentRenderPassId=i}dispose(){if(void 0!==this._renderPassIdForOcclusionQuery&&(this.scene.getEngine().releaseRenderPassId(this._renderPassIdForOcclusionQuery),this._renderPassIdForOcclusionQuery=void 0),!this._colorShader)return;this.onBeforeBoxRenderingObservable.clear(),this.onAfterBoxRenderingObservable.clear(),this.onResourcesReadyObservable.clear(),this.renderList.dispose(),this._colorShader.dispose(),this._colorShaderForOcclusionQuery.dispose(),this._uniformBufferFront.dispose(),this._uniformBufferBack.dispose();const e=this._vertexBuffers[qe.o.PositionKind];e&&(e.dispose(),this._vertexBuffers[qe.o.PositionKind]=null),this.scene.getEngine()._releaseBuffer(this._indexBuffer),this._fillIndexBuffer&&(this.scene.getEngine()._releaseBuffer(this._fillIndexBuffer),this._fillIndexBuffer=null)}}k.x.prototype.enableDepthRenderer=function(e,t=!1,i=!1,n=3,s=!1){if(!(e=e||this.activeCamera))throw"No camera available to enable depth renderer";if(this._depthRenderer||(this._depthRenderer={}),!this._depthRenderer[e.id]){const r=!!this.getEngine().getCaps().textureFloatRender;let o=0;o=!this.getEngine().getCaps().textureHalfFloatRender||i&&r?r?1:0:2,this._depthRenderer[e.id]=new ph(this,o,e,t,n,s)}return this._depthRenderer[e.id]},k.x.prototype.disableDepthRenderer=function(e){(e=e||this.activeCamera)&&this._depthRenderer&&this._depthRenderer[e.id]&&this._depthRenderer[e.id].dispose()};class Qm{constructor(e){this.name=ve.l.NAME_DEPTHRENDERER,this.scene=e}register(){this.scene._gatherRenderTargetsStage.registerStep(ve.l.STEP_GATHERRENDERTARGETS_DEPTHRENDERER,this,this._gatherRenderTargets),this.scene._gatherActiveCameraRenderTargetsStage.registerStep(ve.l.STEP_GATHERACTIVECAMERARENDERTARGETS_DEPTHRENDERER,this,this._gatherActiveCameraRenderTargets)}rebuild(){}dispose(){for(const e in this.scene._depthRenderer)this.scene._depthRenderer[e].dispose()}_gatherRenderTargets(e){if(this.scene._depthRenderer)for(const t in this.scene._depthRenderer){const i=this.scene._depthRenderer[t];i.enabled&&!i.useOnlyInActiveCamera&&e.push(i.getDepthMap())}}_gatherActiveCameraRenderTargets(e){if(this.scene._depthRenderer)for(const t in this.scene._depthRenderer){const i=this.scene._depthRenderer[t];i.enabled&&i.useOnlyInActiveCamera&&this.scene.activeCamera.id===t&&e.push(i.getDepthMap())}}}ph._SceneComponentInitialization=e=>{let t=e._getComponent(ve.l.NAME_DEPTHRENDERER);t||(t=new Qm(e),e._addComponent(t))};si.v.ShadersStore.oitFinalPixelShader="precision highp float;\nuniform sampler2D uFrontColor;\nuniform sampler2D uBackColor;\nvoid main() {\nivec2 fragCoord=ivec2(gl_FragCoord.xy);\nvec4 frontColor=texelFetch(uFrontColor,fragCoord,0);\nvec4 backColor=texelFetch(uBackColor,fragCoord,0);\nfloat alphaMultiplier=1.0-frontColor.a;\nglFragColor=vec4(\nfrontColor.rgb+alphaMultiplier*backColor.rgb,\nfrontColor.a+backColor.a\n);\n}";si.v.ShadersStore.oitBackBlendPixelShader="precision highp float;\nuniform sampler2D uBackColor;\nvoid main() {\nglFragColor=texelFetch(uBackColor,ivec2(gl_FragCoord.xy),0);\nif (glFragColor.a==0.0) { \ndiscard;\n}\n}";class Zm{constructor(){this.enabled=!0,this.name="depthPeeling",this.texturesRequired=[4]}}class Jm{get passCount(){return this._passCount}set passCount(e){this._passCount!==e&&(this._passCount=e,this._createRenderPassIds())}get useRenderPasses(){return this._useRenderPasses}set useRenderPasses(e){this._useRenderPasses!==e&&(this._useRenderPasses=e,this._createRenderPassIds())}addExcludedMesh(e){-1===this._excludedMeshes.indexOf(e.uniqueId)&&this._excludedMeshes.push(e.uniqueId)}removeExcludedMesh(e){const t=this._excludedMeshes.indexOf(e.uniqueId);-1!==t&&this._excludedMeshes.splice(t,1)}constructor(e,t=5){if(this._thinTextures=[],this._currentPingPongState=0,this._layoutCacheFormat=[[!0],[!0,!0],[!0,!0,!0]],this._layoutCache=[],this._candidateSubMeshes=new Fn.t(10),this._excludedSubMeshes=new Fn.t(10),this._excludedMeshes=[],this._colorCache=[new a.HE(Jm._DEPTH_CLEAR_VALUE,Jm._DEPTH_CLEAR_VALUE,0,0),new a.HE(-Jm._MIN_DEPTH,Jm._MAX_DEPTH,0,0),new a.HE(0,0,0,0)],this._scene=e,this._engine=e.getEngine(),this._passCount=t,e.enablePrePassRenderer()){for(let e=0;e<this._layoutCacheFormat.length;++e)this._layoutCache[e]=this._engine.buildTextureLayout(this._layoutCacheFormat[e]);this._renderPassIds=[],this.useRenderPasses=!1,this._prePassEffectConfiguration=new Zm,this._createTextures(),this._createEffects()}else _.Y.Warn("Depth peeling for order independant transparency could not enable PrePass, aborting.")}_createRenderPassIds(){if(this._releaseRenderPassIds(),this._useRenderPasses)for(let e=0;e<this._passCount+1;++e)this._renderPassIds[e]||(this._renderPassIds[e]=this._engine.createRenderPassId(`DepthPeelingRenderer - pass #${e}`))}_releaseRenderPassIds(){for(let e=0;e<this._renderPassIds.length;++e)this._engine.releaseRenderPassId(this._renderPassIds[e]);this._renderPassIds=[]}_createTextures(){const e={width:this._engine.getRenderWidth(),height:this._engine.getRenderHeight()};this._depthMrts=[new Xc("depthPeelingDepth0",e,3,this._scene),new Xc("depthPeelingDepth1",e,3,this._scene)],this._colorMrts=[new Xc("depthPeelingColor0",e,2,this._scene,{generateDepthBuffer:!1}),new Xc("depthPeelingColor1",e,2,this._scene,{generateDepthBuffer:!1})],this._blendBackMrt=new Xc("depthPeelingBack",e,1,this._scene,{generateDepthBuffer:!1}),this._outputRT=new Ai._("depthPeelingOutput",e,this._scene,!1);const t=[{format:7,samplingMode:1,type:this._engine.getCaps().textureFloatLinearFiltering?1:2,label:"DepthPeelingRenderer-DepthTexture"},{format:5,samplingMode:1,type:2,label:"DepthPeelingRenderer-ColorTexture"}];for(let i=0;i<2;i++){const n=this._engine._createInternalTexture(e,t[0],!1),s=this._engine._createInternalTexture(e,t[1],!1),r=this._engine._createInternalTexture(e,t[1],!1);this._depthMrts[i].setInternalTexture(n,0),this._depthMrts[i].setInternalTexture(s,1),this._depthMrts[i].setInternalTexture(r,2),this._colorMrts[i].setInternalTexture(s,0),this._colorMrts[i].setInternalTexture(r,1),this._thinTextures.push(new nu.g(n),new nu.g(s),new nu.g(r))}}_disposeTextures(){for(let e=0;e<this._thinTextures.length;e++)6!==e&&this._thinTextures[e].dispose();for(let e=0;e<2;e++)this._depthMrts[e].dispose(!0),this._colorMrts[e].dispose(!0),this._blendBackMrt.dispose(!0);this._outputRT.dispose(),this._thinTextures=[],this._colorMrts=[],this._depthMrts=[]}_updateTextures(){return this._depthMrts[0].getSize().width===this._engine.getRenderWidth()&&this._depthMrts[0].getSize().height===this._engine.getRenderHeight()||(this._disposeTextures(),this._createTextures()),this._updateTextureReferences()}_updateTextureReferences(){var e;const t=this._scene.prePassRenderer;if(!t)return!1;const i=t.getIndex(4),n=(null===(e=t.defaultRT.textures)||void 0===e?void 0:e.length)?t.defaultRT.textures[i].getInternalTexture():null;return!!n&&(this._blendBackTexture!==n&&(this._blendBackTexture=n,this._blendBackMrt.setInternalTexture(this._blendBackTexture,0),this._thinTextures[6]&&this._thinTextures[6].dispose(),this._thinTextures[6]=new nu.g(this._blendBackTexture),t.defaultRT.renderTarget._shareDepth(this._depthMrts[0].renderTarget)),!0)}_createEffects(){this._blendBackEffectWrapper=new Ih.H({fragmentShader:"oitBackBlend",useShaderStore:!0,engine:this._engine,samplerNames:["uBackColor"],uniformNames:[]}),this._blendBackEffectWrapperPingPong=new Ih.H({fragmentShader:"oitBackBlend",useShaderStore:!0,engine:this._engine,samplerNames:["uBackColor"],uniformNames:[]}),this._finalEffectWrapper=new Ih.H({fragmentShader:"oitFinal",useShaderStore:!0,engine:this._engine,samplerNames:["uFrontColor","uBackColor"],uniformNames:[]}),this._effectRenderer=new Ih.I(this._engine)}setPrePassRenderer(e){e.addEffectConfiguration(this._prePassEffectConfiguration)}bind(e){e.setTexture("oitDepthSampler",this._thinTextures[3*this._currentPingPongState]),e.setTexture("oitFrontColorSampler",this._thinTextures[3*this._currentPingPongState+1])}_renderSubMeshes(e){let t;this._useRenderPasses&&(t={});for(let i=0;i<e.length;i++){const n=e.data[i].getMaterial();let s=!0,r=!1;const o=e.data[i];let a,l=!1;if(this._useRenderPasses&&(a=o._getDrawWrapper(),l=!a),n&&(s=n.allowShaderHotSwapping,r=n.backFaceCulling,n.allowShaderHotSwapping=!1,n.backFaceCulling=!1),o.render(!1),l&&(a=o._getDrawWrapper(),a.materialContext)){let e=t[a.materialContext.uniqueId];e||(e=t[a.materialContext.uniqueId]=this._engine.createMaterialContext()),o._getDrawWrapper().materialContext=e}n&&(n.allowShaderHotSwapping=s,n.backFaceCulling=r)}}_finalCompose(e){var t;(null===(t=this._scene.prePassRenderer)||void 0===t?void 0:t.setCustomOutput(this._outputRT))?this._engine.bindFramebuffer(this._outputRT.renderTarget):this._engine.restoreDefaultFramebuffer(),this._engine.setAlphaMode(0),this._engine.applyStates(),this._engine.enableEffect(this._finalEffectWrapper._drawWrapper),this._finalEffectWrapper.effect.setTexture("uFrontColor",this._thinTextures[3*e+1]),this._finalEffectWrapper.effect.setTexture("uBackColor",this._thinTextures[6]),this._effectRenderer.render(this._finalEffectWrapper)}render(e){if(this._candidateSubMeshes.length=0,this._excludedSubMeshes.length=0,!(this._blendBackEffectWrapper.effect.isReady()&&this._blendBackEffectWrapperPingPong.effect.isReady()&&this._finalEffectWrapper.effect.isReady()&&this._updateTextures()))return this._excludedSubMeshes;for(let t=0;t<e.length;t++){const i=e.data[t],n=i.getMaterial(),s=n&&i.getRenderingMesh()._getRenderingFillMode(n.fillMode);!n||s!==cs.F.TriangleFanDrawMode&&s!==cs.F.TriangleFillMode&&s!==cs.F.TriangleStripDrawMode||-1!==this._excludedMeshes.indexOf(i.getMesh().uniqueId)?this._excludedSubMeshes.push(i):this._candidateSubMeshes.push(i)}if(!this._candidateSubMeshes.length)return this._engine.bindFramebuffer(this._colorMrts[1].renderTarget),this._engine.bindAttachments(this._layoutCache[1]),this._engine.clear(this._colorCache[2],!0,!1,!1),this._engine.unBindFramebuffer(this._colorMrts[1].renderTarget),this._finalCompose(1),this._excludedSubMeshes;const t=this._engine.currentRenderPassId;this._scene.prePassRenderer._enabled=!1,this._useRenderPasses&&(this._engine.currentRenderPassId=this._renderPassIds[0]),this._engine.bindFramebuffer(this._depthMrts[0].renderTarget),this._engine.bindAttachments(this._layoutCache[0]),this._engine.clear(this._colorCache[0],!0,!1,!1),this._engine.unBindFramebuffer(this._depthMrts[0].renderTarget),this._engine.bindFramebuffer(this._depthMrts[1].renderTarget),this._engine.bindAttachments(this._layoutCache[0]),this._engine.clear(this._colorCache[1],!0,!1,!1),this._engine.unBindFramebuffer(this._depthMrts[1].renderTarget),this._engine.bindFramebuffer(this._colorMrts[0].renderTarget),this._engine.bindAttachments(this._layoutCache[1]),this._engine.clear(this._colorCache[2],!0,!1,!1),this._engine.unBindFramebuffer(this._colorMrts[0].renderTarget),this._engine.bindFramebuffer(this._colorMrts[1].renderTarget),this._engine.bindAttachments(this._layoutCache[1]),this._engine.clear(this._colorCache[2],!0,!1,!1),this._engine.unBindFramebuffer(this._colorMrts[1].renderTarget),this._engine.bindFramebuffer(this._depthMrts[0].renderTarget),this._engine.bindAttachments(this._layoutCache[0]),this._engine.setAlphaMode(11),this._engine.setAlphaEquation(3),this._engine.depthCullingState.depthMask=!1,this._engine.depthCullingState.depthTest=!0,this._engine.applyStates(),this._currentPingPongState=1,this._renderSubMeshes(this._candidateSubMeshes),this._engine.unBindFramebuffer(this._depthMrts[0].renderTarget),this._scene.resetCachedMaterial();let i=0,n=0;for(let e=0;e<this._passCount;e++){i=e%2,n=1-i,this._currentPingPongState=i,this._useRenderPasses&&(this._engine.currentRenderPassId=this._renderPassIds[e+1]),this._engine.bindFramebuffer(this._depthMrts[n].renderTarget),this._engine.bindAttachments(this._layoutCache[0]),this._engine.clear(this._colorCache[0],!0,!1,!1),this._engine.unBindFramebuffer(this._depthMrts[n].renderTarget),this._engine.bindFramebuffer(this._colorMrts[n].renderTarget),this._engine.bindAttachments(this._layoutCache[1]),this._engine.clear(this._colorCache[2],!0,!1,!1),this._engine.unBindFramebuffer(this._colorMrts[n].renderTarget),this._engine.bindFramebuffer(this._depthMrts[n].renderTarget),this._engine.bindAttachments(this._layoutCache[2]),this._engine.setAlphaMode(11),this._engine.setAlphaEquation(3),this._engine.depthCullingState.depthTest=!1,this._engine.applyStates(),this._renderSubMeshes(this._candidateSubMeshes),this._engine.unBindFramebuffer(this._depthMrts[n].renderTarget),this._scene.resetCachedMaterial(),this._engine.bindFramebuffer(this._blendBackMrt.renderTarget),this._engine.bindAttachments(this._layoutCache[0]),this._engine.setAlphaEquation(0),this._engine.setAlphaMode(17),this._engine.applyStates();const t=0!==n&&this._useRenderPasses?this._blendBackEffectWrapperPingPong:this._blendBackEffectWrapper;this._engine.enableEffect(t._drawWrapper),t.effect.setTexture("uBackColor",this._thinTextures[3*n+2]),this._effectRenderer.render(t),this._engine.unBindFramebuffer(this._blendBackMrt.renderTarget)}return this._engine.currentRenderPassId=t,this._finalCompose(n),this._scene.prePassRenderer._enabled=!0,this._engine.depthCullingState.depthMask=!0,this._engine.depthCullingState.depthTest=!0,this._excludedSubMeshes}dispose(){this._disposeTextures(),this._blendBackEffectWrapper.dispose(),this._finalEffectWrapper.dispose(),this._effectRenderer.dispose(),this._releaseRenderPassIds()}}Jm._DEPTH_CLEAR_VALUE=-99999,Jm._MIN_DEPTH=0,Jm._MAX_DEPTH=1,Object.defineProperty(k.x.prototype,"depthPeelingRenderer",{get:function(){if(!this._depthPeelingRenderer){let e=this._getComponent(ve.l.NAME_DEPTHPEELINGRENDERER);e||(e=new eg(this),this._addComponent(e))}return this._depthPeelingRenderer},set:function(e){this._depthPeelingRenderer=e},enumerable:!0,configurable:!0}),Object.defineProperty(k.x.prototype,"useOrderIndependentTransparency",{get:function(){return this._useOrderIndependentTransparency},set:function(e){var t;this._useOrderIndependentTransparency!==e&&(this._useOrderIndependentTransparency=e,this.markAllMaterialsAsDirty(63),null===(t=this.prePassRenderer)||void 0===t||t.markAsDirty())},enumerable:!0,configurable:!0});class eg{constructor(e){this.name=ve.l.NAME_DEPTHPEELINGRENDERER,this.scene=e,e.depthPeelingRenderer=new Jm(e)}register(){}rebuild(){}dispose(){var e;null===(e=this.scene.depthPeelingRenderer)||void 0===e||e.dispose(),this.scene.depthPeelingRenderer=null}}si.v.ShadersStore.linePixelShader="#include<clipPlaneFragmentDeclaration>\nuniform vec4 color;\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\ngl_FragColor=color;\n#define CUSTOM_FRAGMENT_MAIN_END\n}";si.v.ShadersStore.lineVertexShader="#include<instancesDeclaration>\n#include<clipPlaneVertexDeclaration>\nattribute vec3 position;\nattribute vec4 normal;\nuniform mat4 viewProjection;\nuniform float width;\nuniform float aspectRatio;\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\nmat4 worldViewProjection=viewProjection*finalWorld;\nvec4 viewPosition=worldViewProjection*vec4(position,1.0);\nvec4 viewPositionNext=worldViewProjection*vec4(normal.xyz,1.0);\nvec2 currentScreen=viewPosition.xy/viewPosition.w;\nvec2 nextScreen=viewPositionNext.xy/viewPositionNext.w;\ncurrentScreen.x*=aspectRatio;\nnextScreen.x*=aspectRatio;\nvec2 dir=normalize(nextScreen-currentScreen);\nvec2 normalDir=vec2(-dir.y,dir.x);\nnormalDir*=width/2.0;\nnormalDir.x/=aspectRatio;\nvec4 offset=vec4(normalDir*normal.w,0.0,0.0);\ngl_Position=viewPosition+offset;\n#if defined(CLIPPLANE) || defined(CLIPPLANE2) || defined(CLIPPLANE3) || defined(CLIPPLANE4) || defined(CLIPPLANE5) || defined(CLIPPLANE6)\nvec4 worldPos=finalWorld*vec4(position,1.0);\n#include<clipPlaneVertex>\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}",Un.x.prototype.disableEdgesRendering=function(){return this._edgesRenderer&&(this._edgesRenderer.dispose(),this._edgesRenderer=null),this},Un.x.prototype.enableEdgesRendering=function(e=.95,t=!1,i){return this.disableEdgesRendering(),this._edgesRenderer=new ig(this,e,t,!0,i),this},Object.defineProperty(Un.x.prototype,"edgesRenderer",{get:function(){return this._edgesRenderer},enumerable:!0,configurable:!0}),is._.prototype.enableEdgesRendering=function(e=.95,t=!1){return this.disableEdgesRendering(),this._edgesRenderer=new ng(this,e,t),this},is.E.prototype.enableEdgesRendering=function(e=.95,t=!1){return is._.prototype.enableEdgesRendering.apply(this,arguments),this};class tg{constructor(){this.edges=new Array,this.edgesConnectedCount=0}}class ig{get linesPositions(){return this._linesPositions}get linesNormals(){return this._linesNormals}get linesIndices(){return this._linesIndices}get lineShader(){return this._lineShader}set lineShader(e){this._lineShader=e}static _GetShader(e){if(!e._edgeRenderLineShader){const t=new us.j("lineShader",e,"line",{attributes:["position","normal"],uniforms:["world","viewProjection","color","width","aspectRatio"]},!1);t.disableDepthWrite=!0,t.backFaceCulling=!1,t.checkReadyOnEveryCall=e.getEngine().isWebGPU,e._edgeRenderLineShader=t}return e._edgeRenderLineShader}constructor(e,t=.95,i=!1,n=!0,s){var r;this.edgesWidthScalerForOrthographic=1e3,this.edgesWidthScalerForPerspective=50,this._linesPositions=new Array,this._linesNormals=new Array,this._linesIndices=new Array,this._buffers={},this._buffersForInstances={},this._checkVerticesInsteadOfIndices=!1,this.isEnabled=!0,this.customInstances=new Fn.t(32),this._source=e,this._checkVerticesInsteadOfIndices=i,this._options=null!=s?s:null,this._epsilon=t,this._source.getScene().getEngine().isWebGPU&&(this._drawWrapper=new Ps.q(e.getEngine())),this._prepareRessources(),n&&(null===(r=null==s?void 0:s.useAlternateEdgeFinder)||void 0===r||r?this._generateEdgesLinesAlternate():this._generateEdgesLines()),this._meshRebuildObserver=this._source.onRebuildObservable.add((()=>{this._rebuild()})),this._meshDisposeObserver=this._source.onDisposeObservable.add((()=>{this.dispose()}))}_prepareRessources(){this._lineShader||(this._lineShader=ig._GetShader(this._source.getScene()))}_rebuild(){let e=this._buffers[qe.o.PositionKind];e&&e._rebuild(),e=this._buffers[qe.o.NormalKind],e&&e._rebuild();const t=this._source.getScene().getEngine();this._ib=t.createIndexBuffer(this._linesIndices)}dispose(){var e;this._source.onRebuildObservable.remove(this._meshRebuildObserver),this._source.onDisposeObservable.remove(this._meshDisposeObserver);let t=this._buffers[qe.o.PositionKind];t&&(t.dispose(),this._buffers[qe.o.PositionKind]=null),t=this._buffers[qe.o.NormalKind],t&&(t.dispose(),this._buffers[qe.o.NormalKind]=null),this._ib&&this._source.getScene().getEngine()._releaseBuffer(this._ib),this._lineShader.dispose(),null===(e=this._drawWrapper)||void 0===e||e.dispose()}_processEdgeForAdjacencies(e,t,i,n,s){return e===i&&t===n||e===n&&t===i?0:e===n&&t===s||e===s&&t===n?1:e===s&&t===i||e===i&&t===s?2:-1}_processEdgeForAdjacenciesWithVertices(e,t,i,n,s){const r=1e-10;return e.equalsWithEpsilon(i,r)&&t.equalsWithEpsilon(n,r)||e.equalsWithEpsilon(n,r)&&t.equalsWithEpsilon(i,r)?0:e.equalsWithEpsilon(n,r)&&t.equalsWithEpsilon(s,r)||e.equalsWithEpsilon(s,r)&&t.equalsWithEpsilon(n,r)?1:e.equalsWithEpsilon(s,r)&&t.equalsWithEpsilon(i,r)||e.equalsWithEpsilon(i,r)&&t.equalsWithEpsilon(s,r)?2:-1}_checkEdge(e,t,i,n,s){let r;r=void 0===t||o.P.Dot(i[e],i[t])<this._epsilon,r&&this.createLine(n,s,this._linesPositions.length/3)}createLine(e,t,i){this._linesPositions.push(e.x,e.y,e.z,e.x,e.y,e.z,t.x,t.y,t.z,t.x,t.y,t.z),this._linesNormals.push(t.x,t.y,t.z,-1,t.x,t.y,t.z,1,e.x,e.y,e.z,-1,e.x,e.y,e.z,1),this._linesIndices.push(i,i+1,i+2,i,i+2,i+3)}_tessellateTriangle(e,t,i,n){const s=(e,t,i)=>{i>=0&&t.push(i);for(let i=0;i<e.length;++i)t.push(e[i][0])};let r=0;e[1].length>=e[0].length&&e[1].length>=e[2].length?r=1:e[2].length>=e[0].length&&e[2].length>=e[1].length&&(r=2);for(let t=0;t<3;++t)t===r?e[t].sort(((e,t)=>e[1]<t[1]?-1:e[1]>t[1]?1:0)):e[t].sort(((e,t)=>e[1]>t[1]?-1:e[1]<t[1]?1:0));const o=[],a=[];s(e[r],o,-1);const l=o.length;for(let o=r+2;o>=r+1;--o)s(e[o%3],a,o!==r+2?n[i[t+(o+1)%3]]:-1);const h=a.length;i.push(n[i[t+r]],o[0],a[0]),i.push(n[i[t+(r+1)%3]],a[h-1],o[l-1]);const c=l<=h,u=c?l:h,d=c?h:l,p=c?l-1:h-1,f=c?0:1;let _=l+h-2,m=0,g=0;const v=c?o:a,y=c?a:o;let x=0;for(;_-- >0;){let e;f?i.push(v[m],y[g]):i.push(y[g],v[m]),x+=u,x>=d&&m<p?(e=v[++m],x-=d):e=y[++g],i.push(e)}i[t+0]=i[i.length-3],i[t+1]=i[i.length-2],i[t+2]=i[i.length-1],i.length=i.length-3}_generateEdgesLinesAlternate(){var e,t,i,n,s,r,a,l,h,c;const u=this._source.getVerticesData(qe.o.PositionKind);let d=this._source.getIndices();if(!d||!u)return;Array.isArray(d)||(d=Array.from(d));const p=null===(t=null===(e=this._options)||void 0===e?void 0:e.useFastVertexMerger)||void 0===t||t,f=p?Math.round(-Math.log(null!==(n=null===(i=this._options)||void 0===i?void 0:i.epsilonVertexMerge)&&void 0!==n?n:1e-6)/Math.log(10)):null!==(r=null===(s=this._options)||void 0===s?void 0:s.epsilonVertexMerge)&&void 0!==r?r:1e-6,_=[],m=[];if(p){const e={};for(let t=0;t<u.length;t+=3){const i=u[t+0],n=u[t+1],s=u[t+2],r=i.toFixed(f)+"|"+n.toFixed(f)+"|"+s.toFixed(f);if(void 0!==e[r])_.push(e[r]);else{const i=t/3;e[r]=i,_.push(i),m.push(i)}}}else for(let e=0;e<u.length;e+=3){const t=u[e+0],i=u[e+1],n=u[e+2];let s=!1;for(let r=0;r<e&&!s;r+=3){const e=u[r+0],o=u[r+1],a=u[r+2];if(Math.abs(t-e)<f&&Math.abs(i-o)<f&&Math.abs(n-a)<f){_.push(r/3),s=!0;break}}s||(_.push(e/3),m.push(e/3))}if(null===(a=this._options)||void 0===a?void 0:a.applyTessellation){const e=null!==(h=null===(l=this._options)||void 0===l?void 0:l.epsilonVertexAligned)&&void 0!==h?h:1e-6,t=[];for(let i=0;i<d.length;i+=3){let n;for(let s=0;s<3;++s){const r=_[d[i+s]],o=_[d[i+(s+1)%3]],a=_[d[i+(s+2)%3]];if(r===o)continue;const l=u[3*r+0],h=u[3*r+1],c=u[3*r+2],p=u[3*o+0],f=u[3*o+1],g=u[3*o+2],v=Math.sqrt((p-l)*(p-l)+(f-h)*(f-h)+(g-c)*(g-c));for(let d=0;d<m.length-1;d++){const _=m[d];if(_===r||_===o||_===a)continue;const y=u[3*_+0],x=u[3*_+1],b=u[3*_+2],T=Math.sqrt((y-l)*(y-l)+(x-h)*(x-h)+(b-c)*(b-c)),S=Math.sqrt((y-p)*(y-p)+(x-f)*(x-f)+(b-g)*(b-g));Math.abs(T+S-v)<e&&(n||(n={index:i,edgesPoints:[[],[],[]]},t.push(n)),n.edgesPoints[s].push([_,T]))}}}for(let e=0;e<t.length;++e){const i=t[e];this._tessellateTriangle(i.edgesPoints,i.index,d,_)}t.length=0}const g={};for(let e=0;e<d.length;e+=3){let t;for(let i=0;i<3;++i){let n=_[d[e+i]],s=_[d[e+(i+1)%3]];const r=_[d[e+(i+2)%3]];if(n===s||(n===r||s===r)&&(null===(c=this._options)||void 0===c?void 0:c.removeDegeneratedTriangles))continue;if(o.jp.Vector3[0].copyFromFloats(u[3*n+0],u[3*n+1],u[3*n+2]),o.jp.Vector3[1].copyFromFloats(u[3*s+0],u[3*s+1],u[3*s+2]),o.jp.Vector3[2].copyFromFloats(u[3*r+0],u[3*r+1],u[3*r+2]),t||(o.jp.Vector3[1].subtractToRef(o.jp.Vector3[0],o.jp.Vector3[3]),o.jp.Vector3[2].subtractToRef(o.jp.Vector3[1],o.jp.Vector3[4]),t=o.P.Cross(o.jp.Vector3[3],o.jp.Vector3[4]),t.normalize()),n>s){const e=n;n=s,s=e}const a=n+"_"+s,l=g[a];l?l.done||(o.P.Dot(t,l.normal)<this._epsilon&&this.createLine(o.jp.Vector3[0],o.jp.Vector3[1],this._linesPositions.length/3),l.done=!0):g[a]={normal:t,done:!1,index:e,i}}}for(const e in g){const t=g[e];if(!t.done){const e=_[d[t.index+t.i]],i=_[d[t.index+(t.i+1)%3]];o.jp.Vector3[0].copyFromFloats(u[3*e+0],u[3*e+1],u[3*e+2]),o.jp.Vector3[1].copyFromFloats(u[3*i+0],u[3*i+1],u[3*i+2]),this.createLine(o.jp.Vector3[0],o.jp.Vector3[1],this._linesPositions.length/3)}}const v=this._source.getScene().getEngine();this._buffers[qe.o.PositionKind]=new qe.o(v,this._linesPositions,qe.o.PositionKind,!1),this._buffers[qe.o.NormalKind]=new qe.o(v,this._linesNormals,qe.o.NormalKind,!1,!1,4),this._buffersForInstances[qe.o.PositionKind]=this._buffers[qe.o.PositionKind],this._buffersForInstances[qe.o.NormalKind]=this._buffers[qe.o.NormalKind],this._ib=v.createIndexBuffer(this._linesIndices),this._indicesCount=this._linesIndices.length}_generateEdgesLines(){const e=this._source.getVerticesData(qe.o.PositionKind),t=this._source.getIndices();if(!t||!e)return;const i=new Array,n=new Array;let s,r;for(s=0;s<t.length;s+=3){r=new tg;const a=t[s],l=t[s+1],h=t[s+2];r.p0=new o.P(e[3*a],e[3*a+1],e[3*a+2]),r.p1=new o.P(e[3*l],e[3*l+1],e[3*l+2]),r.p2=new o.P(e[3*h],e[3*h+1],e[3*h+2]);const c=o.P.Cross(r.p1.subtract(r.p0),r.p2.subtract(r.p1));c.normalize(),n.push(c),i.push(r)}for(s=0;s<i.length;s++){r=i[s];for(let e=s+1;e<i.length;e++){const n=i[e];if(3===r.edgesConnectedCount)break;if(3===n.edgesConnectedCount)continue;const o=t[3*e],a=t[3*e+1],l=t[3*e+2];for(let i=0;i<3;i++){let h=0;if(void 0===r.edges[i]){switch(i){case 0:h=this._checkVerticesInsteadOfIndices?this._processEdgeForAdjacenciesWithVertices(r.p0,r.p1,n.p0,n.p1,n.p2):this._processEdgeForAdjacencies(t[3*s],t[3*s+1],o,a,l);break;case 1:h=this._checkVerticesInsteadOfIndices?this._processEdgeForAdjacenciesWithVertices(r.p1,r.p2,n.p0,n.p1,n.p2):this._processEdgeForAdjacencies(t[3*s+1],t[3*s+2],o,a,l);break;case 2:h=this._checkVerticesInsteadOfIndices?this._processEdgeForAdjacenciesWithVertices(r.p2,r.p0,n.p0,n.p1,n.p2):this._processEdgeForAdjacencies(t[3*s+2],t[3*s],o,a,l)}if(-1!==h&&(r.edges[i]=e,n.edges[h]=s,r.edgesConnectedCount++,n.edgesConnectedCount++,3===r.edgesConnectedCount))break}}}}for(s=0;s<i.length;s++){const e=i[s];this._checkEdge(s,e.edges[0],n,e.p0,e.p1),this._checkEdge(s,e.edges[1],n,e.p1,e.p2),this._checkEdge(s,e.edges[2],n,e.p2,e.p0)}const a=this._source.getScene().getEngine();this._buffers[qe.o.PositionKind]=new qe.o(a,this._linesPositions,qe.o.PositionKind,!1),this._buffers[qe.o.NormalKind]=new qe.o(a,this._linesNormals,qe.o.NormalKind,!1,!1,4),this._buffersForInstances[qe.o.PositionKind]=this._buffers[qe.o.PositionKind],this._buffersForInstances[qe.o.NormalKind]=this._buffers[qe.o.NormalKind],this._ib=a.createIndexBuffer(this._linesIndices),this._indicesCount=this._linesIndices.length}isReady(){return this._lineShader.isReady(this._source,this._source.hasInstances&&this.customInstances.length>0||this._source.hasThinInstances)}render(){const e=this._source.getScene(),t=this._lineShader._getDrawWrapper();if(this._drawWrapper&&this._lineShader._setDrawWrapper(this._drawWrapper),!this.isReady()||!e.activeCamera)return void this._lineShader._setDrawWrapper(t);const i=this._source.hasInstances&&this.customInstances.length>0,n=i||this._source.hasThinInstances;let s=0;if(n)if(this._buffersForInstances.world0=this._source.getVertexBuffer("world0"),this._buffersForInstances.world1=this._source.getVertexBuffer("world1"),this._buffersForInstances.world2=this._source.getVertexBuffer("world2"),this._buffersForInstances.world3=this._source.getVertexBuffer("world3"),i){const e=this._source._instanceDataStorage;if(s=this.customInstances.length,!e.instancesData)return void(this._source.getScene()._activeMeshesFrozen||this.customInstances.reset());if(!e.isFrozen){let t=0;for(let i=0;i<s;++i)this.customInstances.data[i].copyToArray(e.instancesData,t),t+=16;e.instancesBuffer.updateDirectly(e.instancesData,0,s)}}else s=this._source.thinInstanceCount;const r=e.getEngine();this._lineShader._preBind(),1!==this._source.edgesColor.a?r.setAlphaMode(2):r.setAlphaMode(0),r.bindBuffers(n?this._buffersForInstances:this._buffers,this._ib,this._lineShader.getEffect()),e.resetCachedMaterial(),this._lineShader.setColor4("color",this._source.edgesColor),e.activeCamera.mode===Mt.V.ORTHOGRAPHIC_CAMERA?this._lineShader.setFloat("width",this._source.edgesWidth/this.edgesWidthScalerForOrthographic):this._lineShader.setFloat("width",this._source.edgesWidth/this.edgesWidthScalerForPerspective),this._lineShader.setFloat("aspectRatio",r.getAspectRatio(e.activeCamera)),this._lineShader.bind(this._source.getWorldMatrix()),r.drawElementsType(cs.F.TriangleFillMode,0,this._indicesCount,s),this._lineShader.unbind(),n&&r.unbindInstanceAttributes(),this._source.getScene()._activeMeshesFrozen||this.customInstances.reset(),this._lineShader._setDrawWrapper(t)}}class ng extends ig{constructor(e,t=.95,i=!1){super(e,t,i,!1),this._generateEdgesLines()}_generateEdgesLines(){const e=this._source.getVerticesData(qe.o.PositionKind),t=this._source.getIndices();if(!t||!e)return;const i=o.jp.Vector3[0],n=o.jp.Vector3[1],s=t.length-1;for(let r=0,a=0;r<s;r+=2,a+=4)o.P.FromArrayToRef(e,3*t[r],i),o.P.FromArrayToRef(e,3*t[r+1],n),this.createLine(i,n,a);const r=this._source.getScene().getEngine();this._buffers[qe.o.PositionKind]=new qe.o(r,this._linesPositions,qe.o.PositionKind,!1),this._buffers[qe.o.NormalKind]=new qe.o(r,this._linesNormals,qe.o.NormalKind,!1,!1,4),this._ib=r.createIndexBuffer(this._linesIndices),this._indicesCount=this._linesIndices.length}}class sg extends Xc{constructor(e,t,i,n,s,r){super(e,i,n,s,r),this._beforeCompositionPostProcesses=[],this._internalTextureDirty=!1,this.enabled=!1,this.renderTargetTexture=null,this.renderTargetTexture=t}_createCompositionEffect(){this.imageProcessingPostProcess=new Wi("prePassComposition",1,null,void 0,this._engine),this.imageProcessingPostProcess._updateParameters()}_checkSize(){const e=this._engine.getRenderWidth(!0),t=this._engine.getRenderHeight(!0),i=this.getRenderWidth(),n=this.getRenderHeight();i===e&&n===t||(this.resize({width:e,height:t}),this._internalTextureDirty=!0)}updateCount(e,t,i){super.updateCount(e,t,i),this._internalTextureDirty=!0}_resetPostProcessChain(){this._beforeCompositionPostProcesses.length=0}dispose(){const e=this._scene;if(super.dispose(),e&&e.prePassRenderer){const t=e.prePassRenderer.renderTargets.indexOf(this);-1!==t&&e.prePassRenderer.renderTargets.splice(t,1)}this.imageProcessingPostProcess&&this.imageProcessingPostProcess.dispose(),this.renderTargetTexture&&(this.renderTargetTexture._prePassRenderTarget=null),this._outputPostProcess&&(this._outputPostProcess.autoClear=!0,this._outputPostProcess.restoreDefaultInputTexture())}}class rg{getIndex(e){return this._textureIndices[e]}get samples(){return this.defaultRT.samples}set samples(e){this.defaultRT.samples=e}get useSpecificClearForDepthTexture(){return this._useSpecificClearForDepthTexture}set useSpecificClearForDepthTexture(e){this._useSpecificClearForDepthTexture!==e&&(this._useSpecificClearForDepthTexture=e,this._isDirty=!0)}getRenderTarget(){return this._currentTarget}_setRenderTarget(e){e?this._currentTarget=e:(this._currentTarget=this.defaultRT,this._engine.currentRenderPassId=this._currentTarget.renderPassId)}get currentRTisSceneRT(){return this._currentTarget===this.defaultRT}_refreshGeometryBufferRendererLink(){if(this.doNotUseGeometryRendererFallback)this._geometryBuffer&&this._geometryBuffer._unlinkPrePassRenderer(),this._geometryBuffer=null,this._scene.disableGeometryBufferRenderer();else{if(this._geometryBuffer=this._scene.enableGeometryBufferRenderer(),!this._geometryBuffer)return void(this.doNotUseGeometryRendererFallback=!0);this._geometryBuffer._linkPrePassRenderer(this)}}get enabled(){return this._enabled}constructor(e){this.excludedSkinnedMesh=[],this.excludedMaterials=[],this.mrtCount=0,this._mrtTypes=[],this._mrtFormats=[],this._mrtLayout=[],this._mrtNames=[],this._textureIndices=[],this._useSpecificClearForDepthTexture=!1,this._isDirty=!0,this._effectConfigurations=[],this.doNotUseGeometryRendererFallback=!0,this.renderTargets=[],this._clearColor=new a.HE(0,0,0,0),this._clearDepthColor=new a.HE(1e8,0,0,1),this._enabled=!1,this._needsCompositionForThisPass=!1,this.disableGammaTransform=!1,this._scene=e,this._engine=e.getEngine();let t=0;if(this._engine._caps.textureFloat&&this._engine._caps.textureFloatLinearFiltering?t=1:this._engine._caps.textureHalfFloat&&this._engine._caps.textureHalfFloatLinearFiltering&&(t=2),1!==t)for(let e=0;e<rg.TextureFormats.length;++e)1===rg.TextureFormats[e].type&&(rg.TextureFormats[5].type=t);rg._SceneComponentInitialization(this._scene),this.defaultRT=this._createRenderTarget("sceneprePassRT",null),this._currentTarget=this.defaultRT}_createRenderTarget(e,t){const i=new sg(e,t,{width:this._engine.getRenderWidth(),height:this._engine.getRenderHeight()},0,this._scene,{generateMipMaps:!1,generateStencilBuffer:this._engine.isStencilEnable,defaultType:0,types:[],drawOnlyOnFirstAttachmentByDefault:!0});return this.renderTargets.push(i),i}get isSupported(){return this._scene.getEngine().getCaps().drawBuffersExtension}bindAttachmentsForEffect(e,t){const i=t.getMaterial(),n=i&&i.isPrePassCapable,s=i&&-1!==this.excludedMaterials.indexOf(i);this.enabled&&this._currentTarget.enabled&&(e._multiTarget&&n&&!s?this._engine.bindAttachments(this._multiRenderAttachments):(this._engine._currentRenderTarget?this._engine.bindAttachments(this._defaultAttachments):this._engine.restoreSingleAttachment(),this._geometryBuffer&&this.currentRTisSceneRT&&!s&&this._geometryBuffer.renderList.push(t.getRenderingMesh())))}_reinitializeAttachments(){const e=[],t=[!1],i=[!1],n=[!0];for(let s=0;s<this.mrtCount;s++)e.push(!0),s>0&&(this._useSpecificClearForDepthTexture&&5===this._mrtLayout[s]?(t.push(!1),i.push(!0)):(t.push(!0),i.push(!1)),n.push(!1));this._multiRenderAttachments=this._engine.buildTextureLayout(e),this._clearAttachments=this._engine.buildTextureLayout(t),this._clearDepthAttachments=this._engine.buildTextureLayout(i),this._defaultAttachments=this._engine.buildTextureLayout(n)}_resetLayout(){for(let e=0;e<rg.TextureFormats.length;e++)this._textureIndices[rg.TextureFormats[e].purpose]=-1;this._textureIndices[4]=0,this._mrtLayout=[4],this._mrtTypes=[rg.TextureFormats[4].type],this._mrtFormats=[rg.TextureFormats[4].format],this._mrtNames=[rg.TextureFormats[4].name],this.mrtCount=1}_updateGeometryBufferLayout(){if(this._refreshGeometryBufferRendererLink(),this._geometryBuffer){this._geometryBuffer._resetLayout();const e=[];for(let t=0;t<this._mrtLayout.length;t++)e.push(!1);this._geometryBuffer._linkInternalTexture(this.defaultRT.getInternalTexture());const t=[{prePassConstant:5,geometryBufferConstant:Cm.DEPTH_TEXTURE_TYPE},{prePassConstant:6,geometryBufferConstant:Cm.NORMAL_TEXTURE_TYPE},{prePassConstant:1,geometryBufferConstant:Cm.POSITION_TEXTURE_TYPE},{prePassConstant:3,geometryBufferConstant:Cm.REFLECTIVITY_TEXTURE_TYPE},{prePassConstant:2,geometryBufferConstant:Cm.VELOCITY_TEXTURE_TYPE}];for(let i=0;i<t.length;i++){const n=this._mrtLayout.indexOf(t[i].prePassConstant);-1!==n&&(this._geometryBuffer._forceTextureType(t[i].geometryBufferConstant,n),e[n]=!0)}this._geometryBuffer._setAttachments(this._engine.buildTextureLayout(e))}}restoreAttachments(){this.enabled&&this._currentTarget.enabled&&this._defaultAttachments&&(this._engine._currentRenderTarget?this._engine.bindAttachments(this._defaultAttachments):this._engine.restoreSingleAttachment())}_beforeDraw(e,t,i){this._isDirty&&this._update(),this._enabled&&this._currentTarget.enabled&&(this._geometryBuffer&&(this._geometryBuffer.renderList=[]),this._setupOutputForThisPass(this._currentTarget,e))}_prepareFrame(e,t,i){e.renderTargetTexture?e.renderTargetTexture._prepareFrame(this._scene,t,i,e.renderTargetTexture.useCameraPostProcesses):this._postProcessesSourceForThisPass.length?this._scene.postProcessManager._prepareFrame():this._engine.restoreDefaultFramebuffer()}setCustomOutput(e){const t=this._postProcessesSourceForThisPass[0];return!!t&&(t.inputTexture=e.renderTarget,!0)}_renderPostProcesses(e,t){var i;const n=this._postProcessesSourceForThisPass[0],s=n?n.inputTexture:e.renderTargetTexture?e.renderTargetTexture.renderTarget:null;let r=this._currentTarget._beforeCompositionPostProcesses;this._needsCompositionForThisPass&&(r=r.concat([this._currentTarget.imageProcessingPostProcess])),r.length&&(this._scene.postProcessManager._prepareFrame(null===(i=this._currentTarget.renderTarget)||void 0===i?void 0:i.texture,r),this._scene.postProcessManager.directRender(r,s,!1,t))}_afterDraw(e,t){this._enabled&&this._currentTarget.enabled&&(this._prepareFrame(this._currentTarget,e,t),this._renderPostProcesses(this._currentTarget,e))}_clear(){this._enabled&&this._currentTarget.enabled&&(this._bindFrameBuffer(this._currentTarget),this._engine.bindAttachments(this._clearAttachments),this._engine.clear(this._clearColor,!0,!1,!1),this._useSpecificClearForDepthTexture&&(this._engine.bindAttachments(this._clearDepthAttachments),this._engine.clear(this._clearDepthColor,!0,!1,!1)),this._engine.bindAttachments(this._defaultAttachments))}_bindFrameBuffer(e){if(this._enabled&&this._currentTarget.enabled){this._currentTarget._checkSize();const e=this._currentTarget.renderTarget;e&&this._engine.bindFramebuffer(e)}}_setEnabled(e){this._enabled=e}_setRenderTargetEnabled(e,t){e.enabled=t,t||this._unlinkInternalTexture(e)}addEffectConfiguration(e){for(let t=0;t<this._effectConfigurations.length;t++)if(this._effectConfigurations[t].name===e.name)return this._effectConfigurations[t];return this._effectConfigurations.push(e),e}_enable(){const e=this.mrtCount;for(let e=0;e<this._effectConfigurations.length;e++)this._effectConfigurations[e].enabled&&this._enableTextures(this._effectConfigurations[e].texturesRequired);for(let t=0;t<this.renderTargets.length;t++){this.mrtCount===e&&this.renderTargets[t].count===this.mrtCount||this.renderTargets[t].updateCount(this.mrtCount,{types:this._mrtTypes,formats:this._mrtFormats},this._mrtNames.concat("prePass_DepthBuffer")),this.renderTargets[t]._resetPostProcessChain();for(let e=0;e<this._effectConfigurations.length;e++)this._effectConfigurations[e].enabled&&(!this._effectConfigurations[e].postProcess&&this._effectConfigurations[e].createPostProcess&&this._effectConfigurations[e].createPostProcess(),this._effectConfigurations[e].postProcess&&this.renderTargets[t]._beforeCompositionPostProcesses.push(this._effectConfigurations[e].postProcess))}this._reinitializeAttachments(),this._setEnabled(!0),this._updateGeometryBufferLayout()}_disable(){this._setEnabled(!1);for(let e=0;e<this.renderTargets.length;e++)this._setRenderTargetEnabled(this.renderTargets[e],!1);this._resetLayout();for(let e=0;e<this._effectConfigurations.length;e++)this._effectConfigurations[e].enabled=!1}_getPostProcessesSource(e,t){if(t)return t._postProcesses;if(e.renderTargetTexture){if(e.renderTargetTexture.useCameraPostProcesses){const t=e.renderTargetTexture.activeCamera?e.renderTargetTexture.activeCamera:this._scene.activeCamera;return t?t._postProcesses:[]}return e.renderTargetTexture.postProcesses?e.renderTargetTexture.postProcesses:[]}return this._scene.activeCamera?this._scene.activeCamera._postProcesses:[]}_setupOutputForThisPass(e,t){const i=t&&this._scene.activeCameras&&!!this._scene.activeCameras.length&&0!==this._scene.activeCameras.indexOf(t);this._postProcessesSourceForThisPass=this._getPostProcessesSource(e,t),this._postProcessesSourceForThisPass=this._postProcessesSourceForThisPass.filter((e=>null!=e)),this._scene.autoClear=!0;const n=this._hasImageProcessing(this._postProcessesSourceForThisPass);this._needsCompositionForThisPass=!n&&!this.disableGammaTransform&&this._needsImageProcessing()&&!i;const s=this._getFirstPostProcess(this._postProcessesSourceForThisPass),r=e._beforeCompositionPostProcesses&&e._beforeCompositionPostProcesses[0];let o=null;this._scene.imageProcessingConfiguration.applyByPostProcess=this._needsCompositionForThisPass||n,this._needsCompositionForThisPass&&!e.imageProcessingPostProcess&&e._createCompositionEffect(),r?o=r:this._needsCompositionForThisPass?o=e.imageProcessingPostProcess:s&&(o=s),this._bindFrameBuffer(e),this._linkInternalTexture(e,o)}_linkInternalTexture(e,t){t&&(t.autoClear=!1,t.inputTexture=e.renderTarget),e._outputPostProcess!==t&&(e._outputPostProcess&&this._unlinkInternalTexture(e),e._outputPostProcess=t),e._internalTextureDirty&&(this._updateGeometryBufferLayout(),e._internalTextureDirty=!1)}_unlinkInternalTexture(e){e._outputPostProcess&&(e._outputPostProcess.autoClear=!0,e._outputPostProcess.restoreDefaultInputTexture(),e._outputPostProcess=null)}_needsImageProcessing(){for(let e=0;e<this._effectConfigurations.length;e++)if(this._effectConfigurations[e].enabled&&this._effectConfigurations[e].needsImageProcessing)return!0;return!1}_hasImageProcessing(e){var t;let i=!1;if(e)for(let n=0;n<e.length;n++)if("ImageProcessingPostProcess"===(null===(t=e[n])||void 0===t?void 0:t.getClassName())){i=!0;break}return i}_getFirstPostProcess(e){for(let t=0;t<e.length;t++)if(null!==e[t])return e[t];return null}markAsDirty(){this._isDirty=!0}_enableTextures(e){this._scene.needsPreviousWorldMatrices=!1;for(let t=0;t<e.length;t++){const i=e[t];-1===this._textureIndices[i]&&(this._textureIndices[i]=this._mrtLayout.length,this._mrtLayout.push(i),this._mrtTypes.push(rg.TextureFormats[i].type),this._mrtFormats.push(rg.TextureFormats[i].format),this._mrtNames.push(rg.TextureFormats[i].name),this.mrtCount++),2===i&&(this._scene.needsPreviousWorldMatrices=!0)}}_update(){this._disable();let e,t=!1;this._scene.imageProcessingConfiguration.applyByPostProcess=!1,this._scene._depthPeelingRenderer&&this._scene.useOrderIndependentTransparency&&(this._scene._depthPeelingRenderer.setPrePassRenderer(this),t=!0);for(let e=0;e<this._scene.materials.length;e++)this._scene.materials[e].setPrePassRenderer(this)&&(t=!0);t&&this._setRenderTargetEnabled(this.defaultRT,!0);for(let i=0;i<this.renderTargets.length;i++){if(this.renderTargets[i].renderTargetTexture)e=this._getPostProcessesSource(this.renderTargets[i]);else{const t=this._scene.activeCamera;if(!t)continue;e=t._postProcesses}if(e&&(e=e.filter((e=>null!=e)),e)){for(let n=0;n<e.length;n++)e[n].setPrePassRenderer(this)&&(this._setRenderTargetEnabled(this.renderTargets[i],!0),t=!0);this._hasImageProcessing(e)&&(this._scene.imageProcessingConfiguration.applyByPostProcess=!0)}}this._markAllMaterialsAsPrePassDirty(),this._isDirty=!1,t&&this._enable()}_markAllMaterialsAsPrePassDirty(){const e=this._scene.materials;for(let t=0;t<e.length;t++)e[t].markAsDirty(cs.F.PrePassDirtyFlag)}dispose(){for(let e=this.renderTargets.length-1;e>=0;e--)this.renderTargets[e].dispose();for(let e=0;e<this._effectConfigurations.length;e++)this._effectConfigurations[e].dispose&&this._effectConfigurations[e].dispose()}}rg._SceneComponentInitialization=e=>{throw(0,Zl.S)("PrePassRendererSceneComponent")},rg.TextureFormats=[{purpose:0,type:2,format:5,name:"prePass_Irradiance"},{purpose:1,type:2,format:5,name:"prePass_Position"},{purpose:2,type:0,format:5,name:"prePass_Velocity"},{purpose:3,type:0,format:5,name:"prePass_Reflectivity"},{purpose:4,type:2,format:5,name:"prePass_Color"},{purpose:5,type:1,format:6,name:"prePass_Depth"},{purpose:6,type:2,format:5,name:"prePass_Normal"},{purpose:7,type:0,format:5,name:"prePass_Albedo"}],Object.defineProperty(k.x.prototype,"prePassRenderer",{get:function(){return this._prePassRenderer},set:function(e){e&&e.isSupported&&(this._prePassRenderer=e)},enumerable:!0,configurable:!0}),k.x.prototype.enablePrePassRenderer=function(){return this._prePassRenderer||(this._prePassRenderer=new rg(this),this._prePassRenderer.isSupported||(this._prePassRenderer=null,_.Y.Error("PrePassRenderer needs WebGL 2 support.\nMaybe you tried to use the following features that need the PrePassRenderer :\n + Subsurface Scattering"))),this._prePassRenderer},k.x.prototype.disablePrePassRenderer=function(){this._prePassRenderer&&(this._prePassRenderer.dispose(),this._prePassRenderer=null)};class og{constructor(e){this.name=ve.l.NAME_PREPASSRENDERER,this.scene=e}register(){this.scene._beforeCameraDrawStage.registerStep(ve.l.STEP_BEFORECAMERADRAW_PREPASS,this,this._beforeCameraDraw),this.scene._afterCameraDrawStage.registerStep(ve.l.STEP_AFTERCAMERADRAW_PREPASS,this,this._afterCameraDraw),this.scene._beforeRenderTargetDrawStage.registerStep(ve.l.STEP_BEFORERENDERTARGETDRAW_PREPASS,this,this._beforeRenderTargetDraw),this.scene._afterRenderTargetDrawStage.registerStep(ve.l.STEP_AFTERCAMERADRAW_PREPASS,this,this._afterRenderTargetDraw),this.scene._beforeClearStage.registerStep(ve.l.STEP_BEFORECLEAR_PREPASS,this,this._beforeClearStage),this.scene._beforeRenderTargetClearStage.registerStep(ve.l.STEP_BEFORERENDERTARGETCLEAR_PREPASS,this,this._beforeRenderTargetClearStage),this.scene._beforeRenderingMeshStage.registerStep(ve.l.STEP_BEFORERENDERINGMESH_PREPASS,this,this._beforeRenderingMeshStage),this.scene._afterRenderingMeshStage.registerStep(ve.l.STEP_AFTERRENDERINGMESH_PREPASS,this,this._afterRenderingMeshStage)}_beforeRenderTargetDraw(e,t,i){this.scene.prePassRenderer&&!e.noPrePassRenderer&&(this.scene.prePassRenderer._setRenderTarget(e._prePassRenderTarget),this.scene.prePassRenderer._beforeDraw(void 0,t,i))}_afterRenderTargetDraw(e,t,i){this.scene.prePassRenderer&&!e.noPrePassRenderer&&this.scene.prePassRenderer._afterDraw(t,i)}_beforeRenderTargetClearStage(e){this.scene.prePassRenderer&&!e.noPrePassRenderer&&(e._prePassRenderTarget||(e._prePassRenderTarget=this.scene.prePassRenderer._createRenderTarget(e.name+"_prePassRTT",e)),this.scene.prePassRenderer._setRenderTarget(e._prePassRenderTarget),this.scene.prePassRenderer._clear())}_beforeCameraDraw(e){this.scene.prePassRenderer&&(this.scene.prePassRenderer._setRenderTarget(null),this.scene.prePassRenderer._beforeDraw(e))}_afterCameraDraw(){this.scene.prePassRenderer&&this.scene.prePassRenderer._afterDraw()}_beforeClearStage(){this.scene.prePassRenderer&&(this.scene.prePassRenderer._setRenderTarget(null),this.scene.prePassRenderer._clear())}_beforeRenderingMeshStage(e,t,i,n){if(!n)return;const s=e.getScene();s.prePassRenderer&&s.prePassRenderer.bindAttachmentsForEffect(n,t)}_afterRenderingMeshStage(e){const t=e.getScene();t.prePassRenderer&&t.prePassRenderer.restoreAttachments()}rebuild(){this.scene.disablePrePassRenderer(),this.scene.enablePrePassRenderer()}dispose(){this.scene.disablePrePassRenderer()}}rg._SceneComponentInitialization=e=>{let t=e._getComponent(ve.l.NAME_PREPASSRENDERER);t||(t=new og(e),e._addComponent(t))};si.v.IncludesShadersStore.fibonacci="#define rcp(x) 1./x\n#define GOLDEN_RATIO 1.618033988749895\n#define TWO_PI 6.2831855\nvec2 Golden2dSeq(int i,float n)\n{\nreturn vec2(float(i)/n+(0.5/n),fract(float(i)*rcp(GOLDEN_RATIO)));\n}\nvec2 SampleDiskGolden(int i,int sampleCount)\n{\nvec2 f=Golden2dSeq(i,float(sampleCount));\nreturn vec2(sqrt(f.x),TWO_PI*f.y);\n}",i(4022);si.v.IncludesShadersStore.diffusionProfile="uniform vec3 diffusionS[5];\nuniform float diffusionD[5];\nuniform float filterRadii[5];";si.v.ShadersStore.subSurfaceScatteringPixelShader="#include<fibonacci>\n#include<helperFunctions>\n#include<subSurfaceScatteringFunctions>\n#include<diffusionProfile>\nvarying vec2 vUV;\nuniform vec2 texelSize;\nuniform sampler2D textureSampler;\nuniform sampler2D irradianceSampler;\nuniform sampler2D depthSampler;\nuniform sampler2D albedoSampler;\nuniform vec2 viewportSize;\nuniform float metersPerUnit;\nconst float LOG2_E=1.4426950408889634;\nconst float SSS_PIXELS_PER_SAMPLE=4.;\nconst int _SssSampleBudget=40;\n#define rcp(x) 1./x\n#define Sq(x) x*x\n#define SSS_BILATERAL_FILTER true\nvec3 EvalBurleyDiffusionProfile(float r,vec3 S)\n{\nvec3 exp_13=exp2(((LOG2_E*(-1.0/3.0))*r)*S); \nvec3 expSum=exp_13*(1.+exp_13*exp_13); \nreturn (S*rcp(8.*PI))*expSum; \n}\nvec2 SampleBurleyDiffusionProfile(float u,float rcpS)\n{\nu=1.-u; \nfloat g=1.+(4.*u)*(2.*u+sqrt(1.+(4.*u)*u));\nfloat n=exp2(log2(g)*(-1.0/3.0)); \nfloat p=(g*n)*n; \nfloat c=1.+p+n; \nfloat d=(3./LOG2_E*2.)+(3./LOG2_E)*log2(u); \nfloat x=(3./LOG2_E)*log2(c)-d; \nfloat rcpExp=((c*c)*c)*rcp((4.*u)*((c*c)+(4.*u)*(4.*u)));\nfloat r=x*rcpS;\nfloat rcpPdf=(8.*PI*rcpS)*rcpExp; \nreturn vec2(r,rcpPdf);\n}\nvec3 ComputeBilateralWeight(float xy2,float z,float mmPerUnit,vec3 S,float rcpPdf)\n{\n#ifndef SSS_BILATERAL_FILTER\nz=0.;\n#endif\nfloat r=sqrt(xy2+(z*mmPerUnit)*(z*mmPerUnit));\nfloat area=rcpPdf;\n#if SSS_CLAMP_ARTIFACT\nreturn clamp(EvalBurleyDiffusionProfile(r,S)*area,0.0,1.0);\n#else\nreturn EvalBurleyDiffusionProfile(r,S)*area;\n#endif\n}\nvoid EvaluateSample(int i,int n,vec3 S,float d,vec3 centerPosVS,float mmPerUnit,float pixelsPerMm,\nfloat phase,inout vec3 totalIrradiance,inout vec3 totalWeight)\n{\nfloat scale =rcp(float(n));\nfloat offset=rcp(float(n))*0.5;\nfloat sinPhase,cosPhase;\nsinPhase=sin(phase);\ncosPhase=cos(phase);\nvec2 bdp=SampleBurleyDiffusionProfile(float(i)*scale+offset,d);\nfloat r=bdp.x;\nfloat rcpPdf=bdp.y;\nfloat phi=SampleDiskGolden(i,n).y;\nfloat sinPhi,cosPhi;\nsinPhi=sin(phi);\ncosPhi=cos(phi);\nfloat sinPsi=cosPhase*sinPhi+sinPhase*cosPhi; \nfloat cosPsi=cosPhase*cosPhi-sinPhase*sinPhi; \nvec2 vec=r*vec2(cosPsi,sinPsi);\nvec2 position; \nfloat xy2;\nposition=vUV+round((pixelsPerMm*r)*vec2(cosPsi,sinPsi))*texelSize;\nxy2 =r*r;\nvec4 textureSample=texture2D(irradianceSampler,position);\nfloat viewZ=texture2D(depthSampler,position).r;\nvec3 irradiance =textureSample.rgb;\nif (testLightingForSSS(textureSample.a))\n{\nfloat relZ=viewZ-centerPosVS.z;\nvec3 weight=ComputeBilateralWeight(xy2,relZ,mmPerUnit,S,rcpPdf);\ntotalIrradiance+=weight*irradiance;\ntotalWeight +=weight;\n}\nelse\n{\n}\n}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) \n{\nvec4 irradianceAndDiffusionProfile =texture2D(irradianceSampler,vUV);\nvec3 centerIrradiance=irradianceAndDiffusionProfile.rgb;\nint diffusionProfileIndex=int(round(irradianceAndDiffusionProfile.a*255.));\nfloat centerDepth =0.;\nvec4 inputColor=texture2D(textureSampler,vUV);\nbool passedStencilTest=testLightingForSSS(irradianceAndDiffusionProfile.a);\nif (passedStencilTest)\n{\ncenterDepth=texture2D(depthSampler,vUV).r;\n}\nif (!passedStencilTest) { \ngl_FragColor=inputColor;\nreturn;\n}\nfloat distScale =1.;\nvec3 S =diffusionS[diffusionProfileIndex];\nfloat d =diffusionD[diffusionProfileIndex];\nfloat filterRadius=filterRadii[diffusionProfileIndex];\nvec2 centerPosNDC=vUV;\nvec2 cornerPosNDC=vUV+0.5*texelSize;\nvec3 centerPosVS =vec3(centerPosNDC*viewportSize,1.0)*centerDepth; \nvec3 cornerPosVS =vec3(cornerPosNDC*viewportSize,1.0)*centerDepth; \nfloat mmPerUnit =1000.*(metersPerUnit*rcp(distScale));\nfloat unitsPerMm=rcp(mmPerUnit);\nfloat unitsPerPixel=2.*abs(cornerPosVS.x-centerPosVS.x);\nfloat pixelsPerMm =rcp(unitsPerPixel)*unitsPerMm;\nfloat filterArea =PI*Sq(filterRadius*pixelsPerMm);\nint sampleCount =int(filterArea*rcp(SSS_PIXELS_PER_SAMPLE));\nint sampleBudget=_SssSampleBudget;\nint texturingMode=0;\nvec3 albedo =texture2D(albedoSampler,vUV).rgb;\nif (distScale==0. || sampleCount<1)\n{\n#ifdef DEBUG_SSS_SAMPLES\nvec3 green=vec3(0.,1.,0.);\ngl_FragColor=vec4(green,1.0);\nreturn;\n#endif\ngl_FragColor=vec4(inputColor.rgb+albedo*centerIrradiance,1.0);\nreturn;\n}\n#ifdef DEBUG_SSS_SAMPLES\nvec3 red =vec3(1.,0.,0.);\nvec3 blue=vec3(0.,0.,1.);\ngl_FragColor=vec4(mix(blue,red,clamp(float(sampleCount)/float(sampleBudget),0.0,1.0)),1.0);\nreturn;\n#endif\nfloat phase=0.;\nint n=min(sampleCount,sampleBudget);\nvec3 centerWeight =vec3(0.); \nvec3 totalIrradiance=vec3(0.);\nvec3 totalWeight =vec3(0.);\nfor (int i=0; i<n; i++)\n{\nEvaluateSample(i,n,S,d,centerPosVS,mmPerUnit,pixelsPerMm,\nphase,totalIrradiance,totalWeight);\n}\ntotalWeight=max(totalWeight,HALF_MIN);\ngl_FragColor=vec4(inputColor.rgb+albedo*max(totalIrradiance/totalWeight,vec3(0.0)),1.);\n}";class ag extends ni.D{getClassName(){return"SubSurfaceScatteringPostProcess"}constructor(e,t,i,n=null,s,r,o,a=0){super(e,"subSurfaceScattering",["texelSize","viewportSize","metersPerUnit"],["diffusionS","diffusionD","filterRadii","irradianceSampler","depthSampler","albedoSampler"],i,n,s||Ce.x.BILINEAR_SAMPLINGMODE,r,o,null,a,"postprocess",void 0,!0),this._scene=t,this.updateEffect(),this.onApplyObservable.add((e=>{if(!t.prePassRenderer||!t.subSurfaceConfiguration)return void _.Y.Error("PrePass and subsurface configuration needs to be enabled for subsurface scattering.");const i=this.texelSize;e.setFloat("metersPerUnit",t.subSurfaceConfiguration.metersPerUnit),e.setFloat2("texelSize",i.x,i.y),e.setTexture("irradianceSampler",t.prePassRenderer.getRenderTarget().textures[t.prePassRenderer.getIndex(0)]),e.setTexture("depthSampler",t.prePassRenderer.getRenderTarget().textures[t.prePassRenderer.getIndex(5)]),e.setTexture("albedoSampler",t.prePassRenderer.getRenderTarget().textures[t.prePassRenderer.getIndex(7)]),e.setFloat2("viewportSize",Math.tan(t.activeCamera.fov/2)*t.getEngine().getAspectRatio(t.activeCamera,!0),Math.tan(t.activeCamera.fov/2)),e.setArray3("diffusionS",t.subSurfaceConfiguration.ssDiffusionS),e.setArray("diffusionD",t.subSurfaceConfiguration.ssDiffusionD),e.setArray("filterRadii",t.subSurfaceConfiguration.ssFilterRadii)}))}}class lg{get ssDiffusionS(){return this._ssDiffusionS}get ssDiffusionD(){return this._ssDiffusionD}get ssFilterRadii(){return this._ssFilterRadii}constructor(e){this._ssDiffusionS=[],this._ssFilterRadii=[],this._ssDiffusionD=[],this.enabled=!1,this.needsImageProcessing=!0,this.name=ve.l.NAME_SUBSURFACE,this.ssDiffusionProfileColors=[],this.metersPerUnit=1,this.texturesRequired=[5,7,4,0],this.addDiffusionProfile(new a.Wo(1,1,1)),this._scene=e,lg._SceneComponentInitialization(this._scene)}addDiffusionProfile(e){if(this.ssDiffusionD.length>=5)return _.Y.Error("You already reached the maximum number of diffusion profiles."),0;for(let t=0;t<this._ssDiffusionS.length/3;t++)if(this._ssDiffusionS[3*t]===e.r&&this._ssDiffusionS[3*t+1]===e.g&&this._ssDiffusionS[3*t+2]===e.b)return t;return this._ssDiffusionS.push(e.r,e.b,e.g),this._ssDiffusionD.push(Math.max(Math.max(e.r,e.b),e.g)),this._ssFilterRadii.push(this.getDiffusionProfileParameters(e)),this.ssDiffusionProfileColors.push(e),this._ssDiffusionD.length-1}createPostProcess(){return this.postProcess=new ag("subSurfaceScattering",this._scene,1,null,void 0,this._scene.getEngine()),this.postProcess.autoClear=!1,this.postProcess}clearAllDiffusionProfiles(){this._ssDiffusionD=[],this._ssDiffusionS=[],this._ssFilterRadii=[],this.ssDiffusionProfileColors=[]}dispose(){this.clearAllDiffusionProfiles(),this.postProcess&&this.postProcess.dispose()}getDiffusionProfileParameters(e){const t=Math.max(e.r,e.g,e.b);return this._sampleBurleyDiffusionProfile(.997,t)}_sampleBurleyDiffusionProfile(e,t){const i=1+4*(e=1-e)*(2*e+Math.sqrt(1+4*e*e)),n=Math.pow(i,-1/3),s=1+i*n*n+n;return 3*Math.log(s/(4*e))*t}}lg._SceneComponentInitialization=e=>{throw(0,Zl.S)("SubSurfaceSceneComponent")},n.p.AddParser(ve.l.NAME_SUBSURFACE,((e,t)=>{if(void 0!==e.ssDiffusionProfileColors&&null!==e.ssDiffusionProfileColors&&(t.enableSubSurfaceForPrePass(),t.subSurfaceConfiguration))for(let i=0,n=e.ssDiffusionProfileColors.length;i<n;i++){const n=e.ssDiffusionProfileColors[i];t.subSurfaceConfiguration.addDiffusionProfile(new a.Wo(n.r,n.g,n.b))}})),Object.defineProperty(k.x.prototype,"subSurfaceConfiguration",{get:function(){return this._subSurfaceConfiguration},set:function(e){e&&this.enablePrePassRenderer()&&(this._subSurfaceConfiguration=e)},enumerable:!0,configurable:!0}),k.x.prototype.enableSubSurfaceForPrePass=function(){if(this._subSurfaceConfiguration)return this._subSurfaceConfiguration;const e=this.enablePrePassRenderer();return e?(this._subSurfaceConfiguration=new lg(this),e.addEffectConfiguration(this._subSurfaceConfiguration),this._subSurfaceConfiguration):null},k.x.prototype.disableSubSurfaceForPrePass=function(){this._subSurfaceConfiguration&&(this._subSurfaceConfiguration.dispose(),this._subSurfaceConfiguration=null)};class hg{constructor(e){this.name=ve.l.NAME_PREPASSRENDERER,this.scene=e}register(){}serialize(e){if(!this.scene.subSurfaceConfiguration)return;const t=this.scene.subSurfaceConfiguration.ssDiffusionProfileColors;e.ssDiffusionProfileColors=[];for(let i=0;i<t.length;i++)e.ssDiffusionProfileColors.push({r:t[i].r,g:t[i].g,b:t[i].b})}addFromContainer(){}removeFromContainer(){this.scene.prePassRenderer&&this.scene.subSurfaceConfiguration&&this.scene.subSurfaceConfiguration.clearAllDiffusionProfiles()}rebuild(){}dispose(){}}lg._SceneComponentInitialization=e=>{let t=e._getComponent(ve.l.NAME_SUBSURFACE);t||(t=new hg(e),e._addComponent(t))};si.v.ShadersStore.outlinePixelShader="#ifdef LOGARITHMICDEPTH\n#extension GL_EXT_frag_depth : enable\n#endif\nuniform vec4 color;\n#ifdef ALPHATEST\nvarying vec2 vUV;\nuniform sampler2D diffuseSampler;\n#endif\n#include<clipPlaneFragmentDeclaration>\n#include<logDepthDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\n#ifdef ALPHATEST\nif (texture2D(diffuseSampler,vUV).a<0.4)\ndiscard;\n#endif\n#include<logDepthFragment>\ngl_FragColor=color;\n#define CUSTOM_FRAGMENT_MAIN_END\n}";si.v.ShadersStore.outlineVertexShader="attribute vec3 position;\nattribute vec3 normal;\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<morphTargetsVertexGlobalDeclaration>\n#include<morphTargetsVertexDeclaration>[0..maxSimultaneousMorphTargets]\n#include<clipPlaneVertexDeclaration>\nuniform float offset;\n#include<instancesDeclaration>\nuniform mat4 viewProjection;\n#ifdef ALPHATEST\nvarying vec2 vUV;\nuniform mat4 diffuseMatrix;\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#endif\n#include<logDepthDeclaration>\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void)\n{\nvec3 positionUpdated=position;\nvec3 normalUpdated=normal;\n#ifdef UV1\nvec2 uvUpdated=uv;\n#endif\n#include<morphTargetsVertexGlobal>\n#include<morphTargetsVertex>[0..maxSimultaneousMorphTargets]\nvec3 offsetPosition=positionUpdated+(normalUpdated*offset);\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(offsetPosition,1.0);\ngl_Position=viewProjection*worldPos;\n#ifdef ALPHATEST\n#ifdef UV1\nvUV=vec2(diffuseMatrix*vec4(uvUpdated,1.0,0.0));\n#endif\n#ifdef UV2\nvUV=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));\n#endif\n#endif\n#include<clipPlaneVertex>\n#include<logDepthVertex>\n}\n",k.x.prototype.getOutlineRenderer=function(){return this._outlineRenderer||(this._outlineRenderer=new cg(this)),this._outlineRenderer},Object.defineProperty(Nt.Kj.prototype,"renderOutline",{get:function(){return this._renderOutline},set:function(e){e&&this.getScene().getOutlineRenderer(),this._renderOutline=e},enumerable:!0,configurable:!0}),Object.defineProperty(Nt.Kj.prototype,"renderOverlay",{get:function(){return this._renderOverlay},set:function(e){e&&this.getScene().getOutlineRenderer(),this._renderOverlay=e},enumerable:!0,configurable:!0});class cg{constructor(e){this.name=ve.l.NAME_OUTLINERENDERER,this.zOffset=1,this.zOffsetUnits=4,this.scene=e,this._engine=e.getEngine(),this.scene._addComponent(this),this._passIdForDrawWrapper=[];for(let e=0;e<4;++e)this._passIdForDrawWrapper[e]=this._engine.createRenderPassId(`Outline Renderer (${e})`)}register(){this.scene._beforeRenderingMeshStage.registerStep(ve.l.STEP_BEFORERENDERINGMESH_OUTLINE,this,this._beforeRenderingMesh),this.scene._afterRenderingMeshStage.registerStep(ve.l.STEP_AFTERRENDERINGMESH_OUTLINE,this,this._afterRenderingMesh)}rebuild(){}dispose(){for(let e=0;e<this._passIdForDrawWrapper.length;++e)this._engine.releaseRenderPassId(this._passIdForDrawWrapper[e])}render(e,t,i=!1,n){n=null!=n?n:this._passIdForDrawWrapper[0];const s=this.scene,r=s.getEngine(),o=r.getCaps().instancedArrays&&(null!==t.visibleInstances[e._id]&&void 0!==t.visibleInstances[e._id]||e.getRenderingMesh().hasThinInstances);if(!this.isReady(e,o,n))return;const a=e.getMesh(),l=a._internalAbstractMeshDataInfo._actAsRegularMesh?a:null,h=e.getRenderingMesh(),c=l||h,u=e.getMaterial();if(!u||!s.activeCamera)return;const d=e._getDrawWrapper(n),p=Ps.q.GetEffect(d);if(r.enableEffect(d),u.useLogarithmicDepth&&p.setFloat("logarithmicDepthConstant",2/(Math.log(s.activeCamera.maxZ+1)/Math.LN2)),p.setFloat("offset",i?0:h.outlineWidth),p.setColor4("color",i?h.overlayColor:h.outlineColor,i?h.overlayAlpha:u.alpha),p.setMatrix("viewProjection",s.getTransformMatrix()),p.setMatrix("world",c.getWorldMatrix()),h.useBones&&h.computeBonesUsingShaders&&h.skeleton&&p.setMatrices("mBones",h.skeleton.getTransformMatrices(h)),h.morphTargetManager&&h.morphTargetManager.isUsingTextureForTargets&&h.morphTargetManager._bind(p),La.G.BindMorphTargetParameters(h,p),o||h._bind(e,p,u.fillMode),u&&u.needAlphaTesting()){const e=u.getAlphaTestTexture();e&&(p.setTexture("diffuseSampler",e),p.setMatrix("diffuseMatrix",e.getTextureMatrix()))}(0,Ga.an)(p,u,s),r.setZOffset(-this.zOffset),r.setZOffsetUnits(-this.zOffsetUnits),h._processRendering(c,e,p,u.fillMode,t,o,((e,t)=>{p.setMatrix("world",t)})),r.setZOffset(0),r.setZOffsetUnits(0)}isReady(e,t,i){i=null!=i?i:this._passIdForDrawWrapper[0];const n=[],s=[qe.o.PositionKind,qe.o.NormalKind],r=e.getMesh(),o=e.getMaterial();if(!o)return!1;const a=r.getScene();o.needAlphaTesting()&&(n.push("#define ALPHATEST"),r.isVerticesDataPresent(qe.o.UVKind)&&(s.push(qe.o.UVKind),n.push("#define UV1")),r.isVerticesDataPresent(qe.o.UV2Kind)&&(s.push(qe.o.UV2Kind),n.push("#define UV2"))),o.useLogarithmicDepth&&n.push("#define LOGARITHMICDEPTH"),(0,Ga.lK)(o,a,n),r.useBones&&r.computeBonesUsingShaders?(s.push(qe.o.MatricesIndicesKind),s.push(qe.o.MatricesWeightsKind),r.numBoneInfluencers>4&&(s.push(qe.o.MatricesIndicesExtraKind),s.push(qe.o.MatricesWeightsExtraKind)),n.push("#define NUM_BONE_INFLUENCERS "+r.numBoneInfluencers),n.push("#define BonesPerMesh "+(r.skeleton?r.skeleton.bones.length+1:0))):n.push("#define NUM_BONE_INFLUENCERS 0");const l=r.morphTargetManager;let h=0;l&&l.numInfluencers>0&&(h=l.numInfluencers,n.push("#define MORPHTARGETS"),n.push("#define NUM_MORPH_INFLUENCERS "+h),l.isUsingTextureForTargets&&n.push("#define MORPHTARGETS_TEXTURE"),La.G.PrepareAttributesForMorphTargetsInfluencers(s,r,h)),t&&(n.push("#define INSTANCES"),La.G.PushAttributesForInstances(s),e.getRenderingMesh().hasThinInstances&&n.push("#define THIN_INSTANCES"));const c=e._getDrawWrapper(i,!0),u=c.defines,d=n.join("\n");if(u!==d){const e=["world","mBones","viewProjection","diffuseMatrix","offset","color","logarithmicDepthConstant","morphTargetInfluences","morphTargetTextureInfo","morphTargetTextureIndices"];(0,Ga.qx)(e),c.setEffect(this.scene.getEngine().createEffect("outline",s,e,["diffuseSampler","morphTargets"],d,void 0,void 0,void 0,{maxSimultaneousMorphTargets:h}),d)}return c.effect.isReady()}_beforeRenderingMesh(e,t,i){if(this._savedDepthWrite=this._engine.getDepthWrite(),e.renderOutline){const n=t.getMaterial();n&&n.needAlphaBlendingForMesh(e)&&(this._engine.cacheStencilState(),this._engine.setDepthWrite(!1),this._engine.setColorWrite(!1),this._engine.setStencilBuffer(!0),this._engine.setStencilOperationPass(7681),this._engine.setStencilFunction(519),this._engine.setStencilMask(cg._StencilReference),this._engine.setStencilFunctionReference(cg._StencilReference),this._engine.stencilStateComposer.useStencilGlobalOnly=!0,this.render(t,i,!0,this._passIdForDrawWrapper[1]),this._engine.setColorWrite(!0),this._engine.setStencilFunction(517)),this._engine.setDepthWrite(!1),this.render(t,i,!1,this._passIdForDrawWrapper[0]),this._engine.setDepthWrite(this._savedDepthWrite),n&&n.needAlphaBlendingForMesh(e)&&(this._engine.stencilStateComposer.useStencilGlobalOnly=!1,this._engine.restoreStencilState())}}_afterRenderingMesh(e,t,i){if(e.renderOverlay){const e=this._engine.getAlphaMode(),n=this._engine.alphaState.alphaBlend;this._engine.setAlphaMode(2),this.render(t,i,!0,this._passIdForDrawWrapper[3]),this._engine.setAlphaMode(e),this._engine.setDepthWrite(this._savedDepthWrite),this._engine.alphaState.alphaBlend=n}e.renderOutline&&this._savedDepthWrite&&(this._engine.setDepthWrite(!0),this._engine.setColorWrite(!1),this.render(t,i,!1,this._passIdForDrawWrapper[2]),this._engine.setColorWrite(!0))}}cg._StencilReference=4;var ug,dg=i(1617);class pg{get particleSize(){return this._particleSize}set particleSize(e){e!==this._particleSize&&(this._particleSize=e,this.onParticleSizeChanged.notifyObservers(this))}get useInstancing(){return!this.indexBuffer}get useVelocity(){return this._useVelocity}set useVelocity(e){this._useVelocity!==e&&this._hasVelocity()&&(this._useVelocity=e,this._effectsAreDirty=!0)}_hasVelocity(){var e;return!!(null===(e=this.vertexBuffers)||void 0===e?void 0:e.velocity)}get indexBuffer(){return null}getClassName(){return"FluidRenderingObject"}constructor(e){this.priority=0,this._particleSize=.1,this.onParticleSizeChanged=new r.y$,this.particleThicknessAlpha=.05,this._useVelocity=!1,this._scene=e,this._engine=e.getEngine(),this._effectsAreDirty=!0,this._depthEffectWrapper=null,this._thicknessEffectWrapper=null}_createEffects(){const e=["view","projection","particleRadius","size"],t=["position","offset"],i=[];this._effectsAreDirty=!1,this.useVelocity&&(t.push("velocity"),i.push("#define FLUIDRENDERING_VELOCITY")),this._scene.useRightHandedSystem&&i.push("#define FLUIDRENDERING_RHS"),this._depthEffectWrapper=new Ih.H({engine:this._engine,useShaderStore:!0,vertexShader:"fluidRenderingParticleDepth",fragmentShader:"fluidRenderingParticleDepth",attributeNames:t,uniformNames:e,samplerNames:[],defines:i}),e.push("particleAlpha"),this._thicknessEffectWrapper=new Ih.H({engine:this._engine,useShaderStore:!0,vertexShader:"fluidRenderingParticleThickness",fragmentShader:"fluidRenderingParticleThickness",attributeNames:["position","offset"],uniformNames:e,samplerNames:[]})}isReady(){if(this._effectsAreDirty&&this._createEffects(),!this._depthEffectWrapper||!this._thicknessEffectWrapper)return!1;const e=this._depthEffectWrapper._drawWrapper.effect,t=this._thicknessEffectWrapper._drawWrapper.effect;return e.isReady()&&t.isReady()}renderDepthTexture(){const e=this.numParticles;if(!this._depthEffectWrapper||0===e)return;const t=this._depthEffectWrapper._drawWrapper,i=t.effect;this._engine.enableEffect(t),this._engine.bindBuffers(this.vertexBuffers,this.indexBuffer,i),i.setMatrix("view",this._scene.getViewMatrix()),i.setMatrix("projection",this._scene.getProjectionMatrix()),i.setFloat2("size",this._particleSize,this._particleSize),i.setFloat("particleRadius",this._particleSize/2),this.useInstancing?this._engine.drawArraysType(7,0,4,e):this._engine.drawElementsType(0,0,e)}renderThicknessTexture(){const e=this.numParticles;if(!this._thicknessEffectWrapper||0===e)return;const t=this._thicknessEffectWrapper._drawWrapper,i=t.effect;this._engine.setAlphaMode(6),this._engine.setDepthWrite(!1),this._engine.enableEffect(t),this._engine.bindBuffers(this.vertexBuffers,this.indexBuffer,i),i.setMatrix("view",this._scene.getViewMatrix()),i.setMatrix("projection",this._scene.getProjectionMatrix()),i.setFloat("particleAlpha",this.particleThicknessAlpha),i.setFloat2("size",this._particleSize,this._particleSize),this.useInstancing?this._engine.drawArraysType(7,0,4,e):this._engine.drawElementsType(0,0,e),this._engine.setDepthWrite(!0),this._engine.setAlphaMode(0)}renderDiffuseTexture(){}dispose(){var e,t;null===(e=this._depthEffectWrapper)||void 0===e||e.dispose(),null===(t=this._thicknessEffectWrapper)||void 0===t||t.dispose()}}class fg extends pg{get particleSystem(){return this._particleSystem}getClassName(){return"FluidRenderingObjectParticleSystem"}get useTrueRenderingForDiffuseTexture(){return this._useTrueRenderingForDiffuseTexture}set useTrueRenderingForDiffuseTexture(e){this._useTrueRenderingForDiffuseTexture!==e&&(this._useTrueRenderingForDiffuseTexture=e,e?(this._particleSystem.blendMode=this._blendMode,this._particleSystem.onBeforeDrawParticlesObservable.remove(this._onBeforeDrawParticleObserver),this._onBeforeDrawParticleObserver=null):(this._particleSystem.blendMode=-1,this._onBeforeDrawParticleObserver=this._particleSystem.onBeforeDrawParticlesObservable.add((()=>{this._engine.setAlphaMode(2)}))))}get vertexBuffers(){return this._particleSystem.vertexBuffers}get indexBuffer(){return this._particleSystem.indexBuffer}constructor(e,t){super(e),this._useTrueRenderingForDiffuseTexture=!0,this._particleSystem=t,this._originalRender=t.render.bind(t),this._blendMode=t.blendMode,this._onBeforeDrawParticleObserver=null,this._updateInAnimate=this._particleSystem.updateInAnimate,this._particleSystem.updateInAnimate=!0,this._particleSystem.render=()=>0,this.particleSize=(t.minSize+t.maxSize)/2,this.useTrueRenderingForDiffuseTexture=!1}isReady(){return super.isReady()&&this._particleSystem.isReady()}get numParticles(){return this._particleSystem.getActiveCount()}renderDiffuseTexture(){this._originalRender()}dispose(){super.dispose(),this._particleSystem.onBeforeDrawParticlesObservable.remove(this._onBeforeDrawParticleObserver),this._onBeforeDrawParticleObserver=null,this._particleSystem.render=this._originalRender,this._particleSystem.blendMode=this._blendMode,this._particleSystem.updateInAnimate=this._updateInAnimate}}class _g{get blurNumIterations(){return this._blurNumIterations}set blurNumIterations(e){if(this._blurNumIterations!==e&&(this._blurNumIterations=e,null!==this._blurPostProcesses)){const e=this._blurPostProcesses[0],t=this._blurPostProcesses[1];this._blurPostProcesses=[];for(let i=0;i<2*this._blurNumIterations;++i)this._blurPostProcesses[i]=1&i?t:e}}get renderTarget(){return this._rt}get renderTargetBlur(){return this._rtBlur}get texture(){return this._texture}get textureBlur(){return this._textureBlurred}constructor(e,t,i,n,s,o,a=1,l=6,h=1,c=6,u=!1,d=null,p=!0,f=1){this.enableBlur=!0,this.blurSizeDivisor=1,this.blurFilterSize=7,this._blurNumIterations=3,this.blurMaxFilterSize=100,this.blurDepthScale=10,this.particleSize=.02,this.onDisposeObservable=new r.y$,this._name=e,this._scene=t,this._camera=d,this._engine=t.getEngine(),this._width=i,this._height=n,this._blurTextureSizeX=s,this._blurTextureSizeY=o,this._textureType=a,this._textureFormat=l,this._blurTextureType=h,this._blurTextureFormat=c,this._useStandardBlur=u,this._generateDepthBuffer=p,this._samples=f,this._postProcessRunningIndex=0,this.enableBlur=0!==s&&0!==o,this._rt=null,this._texture=null,this._rtBlur=null,this._textureBlurred=null,this._blurPostProcesses=null}initialize(){if(this.dispose(),this._createRenderTarget(),this.enableBlur&&this._texture){const[e,t,i]=this._createBlurPostProcesses(this._texture,this._blurTextureType,this._blurTextureFormat,this.blurSizeDivisor,this._name,this._useStandardBlur);this._rtBlur=e,this._textureBlurred=t,this._blurPostProcesses=i}}applyBlurPostProcesses(){this.enableBlur&&this._blurPostProcesses&&(this._postProcessRunningIndex=0,this._scene.postProcessManager.directRender(this._blurPostProcesses,this._rtBlur,!0),this._engine.unBindFramebuffer(this._rtBlur))}_createRenderTarget(){this._rt=this._engine.createRenderTargetTexture({width:this._width,height:this._height},{generateMipMaps:!1,type:this._textureType,format:this._textureFormat,samplingMode:1,generateDepthBuffer:this._generateDepthBuffer,generateStencilBuffer:!1,samples:this._samples,label:`FluidRenderingRTT-${this._name}`});const e=this._rt.texture;e.incrementReferences(),this._texture=new Ce.x(null,this._scene),this._texture.name="rtt"+this._name,this._texture._texture=e,this._texture.wrapU=Ce.x.CLAMP_ADDRESSMODE,this._texture.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._texture.anisotropicFilteringLevel=1}_createBlurPostProcesses(e,t,i,n,s,r=!1){const a=this._scene.getEngine(),l=new o.FM(Math.floor(this._blurTextureSizeX/n),Math.floor(this._blurTextureSizeY/n)),h=1===t&&a.getCaps().textureFloatLinearFiltering||2===t&&a.getCaps().textureHalfFloatLinearFiltering,c=this._engine.createRenderTargetTexture({width:l.x,height:l.y},{generateMipMaps:!1,type:t,format:i,samplingMode:h?2:1,generateDepthBuffer:!1,generateStencilBuffer:!1,samples:this._samples,label:`FluidRenderingRTTBlur-${s}`}),u=c.texture;u.incrementReferences();const d=new Ce.x(null,this._scene);if(d.name="rttBlurred"+s,d._texture=u,d.wrapU=Ce.x.CLAMP_ADDRESSMODE,d.wrapV=Ce.x.CLAMP_ADDRESSMODE,d.anisotropicFilteringLevel=1,r){const n=new ni.D("BilateralBlurX","fluidRenderingStandardBlur",["filterSize","blurDir"],null,1,null,1,a,!0,null,t,void 0,void 0,void 0,i);n.samples=this._samples,n.externalTextureSamplerBinding=!0,n.onApplyObservable.add((t=>{0===this._postProcessRunningIndex?t.setTexture("textureSampler",e):t._bindTexture("textureSampler",n.inputTexture.texture),t.setInt("filterSize",this.blurFilterSize),t.setFloat2("blurDir",1/this._blurTextureSizeX,0),this._postProcessRunningIndex++})),n.onSizeChangedObservable.add((()=>{n._textures.forEach((e=>{e.texture.wrapU=Ce.x.CLAMP_ADDRESSMODE,e.texture.wrapV=Ce.x.CLAMP_ADDRESSMODE}))})),this._fixReusablePostProcess(n);const s=new ni.D("BilateralBlurY","fluidRenderingStandardBlur",["filterSize","blurDir"],null,1,null,1,a,!0,null,t,void 0,void 0,void 0,i);s.samples=this._samples,s.onApplyObservable.add((e=>{e.setInt("filterSize",this.blurFilterSize),e.setFloat2("blurDir",0,1/this._blurTextureSizeY),this._postProcessRunningIndex++})),s.onSizeChangedObservable.add((()=>{s._textures.forEach((e=>{e.texture.wrapU=Ce.x.CLAMP_ADDRESSMODE,e.texture.wrapV=Ce.x.CLAMP_ADDRESSMODE}))})),this._fixReusablePostProcess(s),n.autoClear=!1,s.autoClear=!1;const r=[];for(let e=0;e<2*this._blurNumIterations;++e)r[e]=1&e?s:n;return[c,d,r]}{const n=["maxFilterSize","blurDir","projectedParticleConstant","depthThreshold"],s=new ni.D("BilateralBlurX","fluidRenderingBilateralBlur",n,null,1,null,1,a,!0,null,t,void 0,void 0,void 0,i);s.samples=this._samples,s.externalTextureSamplerBinding=!0,s.onApplyObservable.add((t=>{0===this._postProcessRunningIndex?t.setTexture("textureSampler",e):t._bindTexture("textureSampler",s.inputTexture.texture),t.setInt("maxFilterSize",this.blurMaxFilterSize),t.setFloat2("blurDir",1/this._blurTextureSizeX,0),t.setFloat("projectedParticleConstant",this._getProjectedParticleConstant()),t.setFloat("depthThreshold",this._getDepthThreshold()),this._postProcessRunningIndex++})),s.onSizeChangedObservable.add((()=>{s._textures.forEach((e=>{e.texture.wrapU=Ce.x.CLAMP_ADDRESSMODE,e.texture.wrapV=Ce.x.CLAMP_ADDRESSMODE}))})),this._fixReusablePostProcess(s);const r=new ni.D("BilateralBlurY","fluidRenderingBilateralBlur",n,null,1,null,1,a,!0,null,t,void 0,void 0,void 0,i);r.samples=this._samples,r.onApplyObservable.add((e=>{e.setInt("maxFilterSize",this.blurMaxFilterSize),e.setFloat2("blurDir",0,1/this._blurTextureSizeY),e.setFloat("projectedParticleConstant",this._getProjectedParticleConstant()),e.setFloat("depthThreshold",this._getDepthThreshold()),this._postProcessRunningIndex++})),r.onSizeChangedObservable.add((()=>{r._textures.forEach((e=>{e.texture.wrapU=Ce.x.CLAMP_ADDRESSMODE,e.texture.wrapV=Ce.x.CLAMP_ADDRESSMODE}))})),this._fixReusablePostProcess(r),s.autoClear=!1,r.autoClear=!1;const o=[];for(let e=0;e<2*this._blurNumIterations;++e)o[e]=1&e?r:s;return[c,d,o]}}_fixReusablePostProcess(e){e.isReusable()&&(e.onActivateObservable.add((()=>{e._currentRenderTextureInd=(e._currentRenderTextureInd+1)%2})),e.onApplyObservable.add((()=>{e._currentRenderTextureInd=(e._currentRenderTextureInd+1)%2})))}_getProjectedParticleConstant(){var e,t;return this.blurFilterSize*this.particleSize*.05*(this._height/2)/Math.tan((null!==(t=null===(e=this._camera)||void 0===e?void 0:e.fov)&&void 0!==t?t:45*Math.PI/180)/2)}_getDepthThreshold(){return this.particleSize/2*this.blurDepthScale}dispose(){var e,t,i,n;this.onDisposeObservable.hasObservers()&&this.onDisposeObservable.notifyObservers(this),null===(e=this._rt)||void 0===e||e.dispose(),this._rt=null,null===(t=this._texture)||void 0===t||t.dispose(),this._texture=null,null===(i=this._rtBlur)||void 0===i||i.dispose(),this._rtBlur=null,null===(n=this._textureBlurred)||void 0===n||n.dispose(),this._textureBlurred=null,this._blurPostProcesses&&(this._blurPostProcesses[0].dispose(),this._blurPostProcesses[1].dispose()),this._blurPostProcesses=null}}!function(e){e[e.DepthTexture=0]="DepthTexture",e[e.DepthBlurredTexture=1]="DepthBlurredTexture",e[e.ThicknessTexture=2]="ThicknessTexture",e[e.ThicknessBlurredTexture=3]="ThicknessBlurredTexture",e[e.DiffuseTexture=4]="DiffuseTexture",e[e.Normals=5]="Normals",e[e.DiffuseRendering=6]="DiffuseRendering"}(ug||(ug={}));class mg{get needInitialization(){return this._needInitialization}get generateDiffuseTexture(){return this._generateDiffuseTexture}set generateDiffuseTexture(e){this._generateDiffuseTexture!==e&&(this._generateDiffuseTexture=e,this._needInitialization=!0)}get debugFeature(){return this._debugFeature}set debugFeature(e){this._debugFeature!==e&&(this._needInitialization=!0,this._debugFeature=e)}get debug(){return this._debug}set debug(e){this._debug!==e&&(this._debug=e,this._needInitialization=!0)}get environmentMap(){return this._environmentMap}set environmentMap(e){this._environmentMap!==e&&(this._needInitialization=!0,this._environmentMap=e)}get enableBlurDepth(){return this._enableBlurDepth}set enableBlurDepth(e){this._enableBlurDepth!==e&&(this._enableBlurDepth=e,this._needInitialization=!0)}get blurDepthSizeDivisor(){return this._blurDepthSizeDivisor}set blurDepthSizeDivisor(e){this._blurDepthSizeDivisor!==e&&(this._blurDepthSizeDivisor=e,this._needInitialization=!0)}get blurDepthFilterSize(){return this._blurDepthFilterSize}set blurDepthFilterSize(e){this._blurDepthFilterSize!==e&&(this._blurDepthFilterSize=e,this._setBlurParameters())}get blurDepthNumIterations(){return this._blurDepthNumIterations}set blurDepthNumIterations(e){this._blurDepthNumIterations!==e&&(this._blurDepthNumIterations=e,this._setBlurParameters())}get blurDepthMaxFilterSize(){return this._blurDepthMaxFilterSize}set blurDepthMaxFilterSize(e){this._blurDepthMaxFilterSize!==e&&(this._blurDepthMaxFilterSize=e,this._setBlurParameters())}get blurDepthDepthScale(){return this._blurDepthDepthScale}set blurDepthDepthScale(e){this._blurDepthDepthScale!==e&&(this._blurDepthDepthScale=e,this._setBlurParameters())}get enableBlurThickness(){return this._enableBlurThickness}set enableBlurThickness(e){this._enableBlurThickness!==e&&(this._enableBlurThickness=e,this._needInitialization=!0)}get blurThicknessSizeDivisor(){return this._blurThicknessSizeDivisor}set blurThicknessSizeDivisor(e){this._blurThicknessSizeDivisor!==e&&(this._blurThicknessSizeDivisor=e,this._needInitialization=!0)}get blurThicknessFilterSize(){return this._blurThicknessFilterSize}set blurThicknessFilterSize(e){this._blurThicknessFilterSize!==e&&(this._blurThicknessFilterSize=e,this._setBlurParameters())}get blurThicknessNumIterations(){return this._blurThicknessNumIterations}set blurThicknessNumIterations(e){this._blurThicknessNumIterations!==e&&(this._blurThicknessNumIterations=e,this._setBlurParameters())}get useFixedThickness(){return this._useFixedThickness}set useFixedThickness(e){this._useFixedThickness!==e&&(this._useFixedThickness=e,this._needInitialization=!0)}get useVelocity(){return this._useVelocity}set useVelocity(e){this._useVelocity!==e&&(this._useVelocity=e,this._needInitialization=!0,this._onUseVelocityChanged.notifyObservers(this))}get depthMapSize(){return this._depthMapSize}set depthMapSize(e){this._depthMapSize!==e&&(this._depthMapSize=e,this._needInitialization=!0)}get thicknessMapSize(){return this._thicknessMapSize}set thicknessMapSize(e){this._thicknessMapSize!==e&&(this._thicknessMapSize=e,this._needInitialization=!0)}get diffuseMapSize(){return this._diffuseMapSize}set diffuseMapSize(e){this._diffuseMapSize!==e&&(this._diffuseMapSize=e,this._needInitialization=!0)}get samples(){return this._samples}set samples(e){this._samples!==e&&(this._samples=e,this._needInitialization=!0)}get camera(){return this._camera}constructor(e,t){this._generateDiffuseTexture=!1,this.fluidColor=new a.Wo(.085,.6375,.765),this.density=2,this.refractionStrength=.1,this.fresnelClamp=1,this.specularPower=250,this.minimumThickness=0,this.dirLight=new o.P(-2,-1,1).normalize(),this._debugFeature=ug.DepthBlurredTexture,this._debug=!1,this._enableBlurDepth=!0,this._blurDepthSizeDivisor=1,this._blurDepthFilterSize=7,this._blurDepthNumIterations=3,this._blurDepthMaxFilterSize=100,this._blurDepthDepthScale=10,this._enableBlurThickness=!0,this._blurThicknessSizeDivisor=1,this._blurThicknessFilterSize=5,this._blurThicknessNumIterations=1,this._useFixedThickness=!1,this._onUseVelocityChanged=new r.y$,this._useVelocity=!1,this._depthMapSize=null,this._thicknessMapSize=null,this._diffuseMapSize=null,this._samples=1,this._scene=e,this._engine=e.getEngine(),this._camera=null!=t?t:e.activeCamera,this._needInitialization=!0,this._bgDepthTexture=null,this._invProjectionMatrix=new o.y3,this._depthClearColor=new a.HE(1e6,1e6,1e6,1),this._thicknessClearColor=new a.HE(0,0,0,1),this._depthRenderTarget=null,this._diffuseRenderTarget=null,this._thicknessRenderTarget=null,this._renderPostProcess=null}_initialize(){var e,t,i;this.dispose(),this._needInitialization=!1;const n=null!==(e=this._depthMapSize)&&void 0!==e?e:this._engine.getRenderWidth(),s=null!==this._depthMapSize?Math.round(this._depthMapSize*this._engine.getRenderHeight()/this._engine.getRenderWidth()):this._engine.getRenderHeight();if(this._depthRenderTarget=new _g("Depth",this._scene,n,s,n,s,1,7,1,7,!1,this._camera,!0,this._samples),this._initializeRenderTarget(this._depthRenderTarget),this.generateDiffuseTexture){const e=null!==(t=this._diffuseMapSize)&&void 0!==t?t:this._engine.getRenderWidth(),i=null!==this._diffuseMapSize?Math.round(this._diffuseMapSize*this._engine.getRenderHeight()/this._engine.getRenderWidth()):this._engine.getRenderHeight();this._diffuseRenderTarget=new _g("Diffuse",this._scene,e,i,0,0,0,5,0,5,!0,this._camera,!0,this._samples),this._initializeRenderTarget(this._diffuseRenderTarget)}const r=null!==(i=this._thicknessMapSize)&&void 0!==i?i:this._engine.getRenderWidth(),o=null!==this._thicknessMapSize?Math.round(this._thicknessMapSize*this._engine.getRenderHeight()/this._engine.getRenderWidth()):this._engine.getRenderHeight();this._useFixedThickness||(this._thicknessRenderTarget=new _g("Thickness",this._scene,r,o,r,o,2,6,2,6,!0,this._camera,!1,this._samples),this._initializeRenderTarget(this._thicknessRenderTarget)),this._createLiquidRenderingPostProcess()}_setBlurParameters(e=null){null!==e&&e!==this._depthRenderTarget||this._setBlurDepthParameters(),null!==e&&e!==this._thicknessRenderTarget||this._setBlurThicknessParameters()}_setBlurDepthParameters(){this._depthRenderTarget&&(this._depthRenderTarget.blurFilterSize=this.blurDepthFilterSize,this._depthRenderTarget.blurMaxFilterSize=this.blurDepthMaxFilterSize,this._depthRenderTarget.blurNumIterations=this.blurDepthNumIterations,this._depthRenderTarget.blurDepthScale=this.blurDepthDepthScale)}_setBlurThicknessParameters(){this._thicknessRenderTarget&&(this._thicknessRenderTarget.blurFilterSize=this.blurThicknessFilterSize,this._thicknessRenderTarget.blurNumIterations=this.blurThicknessNumIterations)}_initializeRenderTarget(e){e!==this._diffuseRenderTarget&&(e.enableBlur=e===this._depthRenderTarget?this.enableBlurDepth:this.enableBlurThickness,e.blurSizeDivisor=e===this._depthRenderTarget?this.blurDepthSizeDivisor:this.blurThicknessSizeDivisor),this._setBlurParameters(e),e.initialize()}_createLiquidRenderingPostProcess(){var e;const t=this._scene.getEngine(),i=["viewMatrix","projectionMatrix","invProjectionMatrix","texelSize","dirLight","cameraFar","density","refractionStrength","fresnelClamp","specularPower"],n=["depthSampler"],s=[];if(this.dispose(!0),!this._camera)return;const r=this._depthRenderTarget.enableBlur?this._depthRenderTarget.textureBlur:this._depthRenderTarget.texture,a=new o.FM(1/r.getSize().width,1/r.getSize().height);this._scene.useRightHandedSystem&&s.push("#define FLUIDRENDERING_RHS"),null!==this._environmentMap&&(null!==(e=this._environmentMap)&&void 0!==e?e:this._scene.environmentTexture)&&(n.push("reflectionSampler"),s.push("#define FLUIDRENDERING_ENVIRONMENT")),this._diffuseRenderTarget?(n.push("diffuseSampler"),s.push("#define FLUIDRENDERING_DIFFUSETEXTURE")):i.push("diffuseColor"),this._useVelocity&&(n.push("velocitySampler"),s.push("#define FLUIDRENDERING_VELOCITY")),this._useFixedThickness?(i.push("thickness"),n.push("bgDepthSampler"),s.push("#define FLUIDRENDERING_FIXED_THICKNESS")):(i.push("minimumThickness"),n.push("thicknessSampler")),this._debug&&(s.push("#define FLUIDRENDERING_DEBUG"),this._debugFeature===ug.Normals?s.push("#define FLUIDRENDERING_DEBUG_SHOWNORMAL"):this._debugFeature===ug.DiffuseRendering?s.push("#define FLUIDRENDERING_DEBUG_DIFFUSERENDERING"):(s.push("#define FLUIDRENDERING_DEBUG_TEXTURE"),n.push("debugSampler"),this._debugFeature!==ug.DepthTexture&&this._debugFeature!==ug.DepthBlurredTexture||s.push("#define FLUIDRENDERING_DEBUG_DEPTH"))),this._renderPostProcess=new ni.D("FluidRendering","fluidRenderingRender",i,n,1,null,2,t,!1,null,0,void 0,void 0,!0,void 0),this._renderPostProcess.updateEffect(s.join("\n")),this._renderPostProcess.samples=this._samples,this._renderPostProcess.onApplyObservable.add((e=>{var i,n,s,r,o,l,h,c,u,d,p,f,_,m,g,v,y,x,b,T,S,E,C;if(this._invProjectionMatrix.copyFrom(this._scene.getProjectionMatrix()),this._invProjectionMatrix.invert(),t.isWebGPU&&e.setTextureSampler("textureSamplerSampler",this._renderPostProcess.inputTexture.texture),this._depthRenderTarget.enableBlur?(e.setTexture("depthSampler",this._depthRenderTarget.textureBlur),t.isWebGPU&&e.setTextureSampler("depthSamplerSampler",null!==(r=null===(s=this._depthRenderTarget.textureBlur)||void 0===s?void 0:s.getInternalTexture())&&void 0!==r?r:null)):(e.setTexture("depthSampler",this._depthRenderTarget.texture),t.isWebGPU&&e.setTextureSampler("depthSamplerSampler",null!==(n=null===(i=this._depthRenderTarget.texture)||void 0===i?void 0:i.getInternalTexture())&&void 0!==n?n:null)),this._diffuseRenderTarget?this._diffuseRenderTarget.enableBlur?(e.setTexture("diffuseSampler",this._diffuseRenderTarget.textureBlur),t.isWebGPU&&e.setTextureSampler("diffuseSamplerSampler",null!==(c=null===(h=this._diffuseRenderTarget.textureBlur)||void 0===h?void 0:h.getInternalTexture())&&void 0!==c?c:null)):(e.setTexture("diffuseSampler",this._diffuseRenderTarget.texture),t.isWebGPU&&e.setTextureSampler("diffuseSamplerSampler",null!==(l=null===(o=this._diffuseRenderTarget.texture)||void 0===o?void 0:o.getInternalTexture())&&void 0!==l?l:null)):e.setColor3("diffuseColor",this.fluidColor),this._useFixedThickness?(e.setFloat("thickness",this.minimumThickness),e._bindTexture("bgDepthSampler",this._bgDepthTexture),t.isWebGPU&&e.setTextureSampler("bgDepthSamplerSampler",null!==(u=this._bgDepthTexture)&&void 0!==u?u:null)):(this._thicknessRenderTarget.enableBlur?(e.setTexture("thicknessSampler",this._thicknessRenderTarget.textureBlur),t.isWebGPU&&e.setTextureSampler("thicknessSamplerSampler",null!==(_=null===(f=this._thicknessRenderTarget.textureBlur)||void 0===f?void 0:f.getInternalTexture())&&void 0!==_?_:null)):(e.setTexture("thicknessSampler",this._thicknessRenderTarget.texture),t.isWebGPU&&e.setTextureSampler("thicknessSamplerSampler",null!==(p=null===(d=this._thicknessRenderTarget.texture)||void 0===d?void 0:d.getInternalTexture())&&void 0!==p?p:null)),e.setFloat("minimumThickness",this.minimumThickness)),null!==this._environmentMap){const i=null!==(m=this._environmentMap)&&void 0!==m?m:this._scene.environmentTexture;i&&(e.setTexture("reflectionSampler",i),t.isWebGPU&&e.setTextureSampler("reflectionSamplerSampler",null!==(g=null==i?void 0:i.getInternalTexture())&&void 0!==g?g:null))}if(e.setMatrix("viewMatrix",this._scene.getViewMatrix()),e.setMatrix("invProjectionMatrix",this._invProjectionMatrix),e.setMatrix("projectionMatrix",this._scene.getProjectionMatrix()),e.setVector2("texelSize",a),e.setFloat("density",this.density),e.setFloat("refractionStrength",this.refractionStrength),e.setFloat("fresnelClamp",this.fresnelClamp),e.setFloat("specularPower",this.specularPower),e.setVector3("dirLight",this.dirLight),e.setFloat("cameraFar",this._camera.maxZ),this._debug){let i=null;switch(this._debugFeature){case ug.DepthTexture:i=this._depthRenderTarget.texture;break;case ug.DepthBlurredTexture:i=this._depthRenderTarget.enableBlur?this._depthRenderTarget.textureBlur:this._depthRenderTarget.texture;break;case ug.ThicknessTexture:i=null!==(y=null===(v=this._thicknessRenderTarget)||void 0===v?void 0:v.texture)&&void 0!==y?y:null;break;case ug.ThicknessBlurredTexture:i=(null===(x=this._thicknessRenderTarget)||void 0===x?void 0:x.enableBlur)?null!==(T=null===(b=this._thicknessRenderTarget)||void 0===b?void 0:b.textureBlur)&&void 0!==T?T:null:null!==(E=null===(S=this._thicknessRenderTarget)||void 0===S?void 0:S.texture)&&void 0!==E?E:null;break;case ug.DiffuseTexture:this._diffuseRenderTarget&&(i=this._diffuseRenderTarget.texture)}this._debugFeature!==ug.Normals&&(e.setTexture("debugSampler",i),t.isWebGPU&&e.setTextureSampler("debugSamplerSampler",null!==(C=null==i?void 0:i.getInternalTexture())&&void 0!==C?C:null))}}))}_clearTargets(){var e,t,i;(null===(e=this._depthRenderTarget)||void 0===e?void 0:e.renderTarget)&&(this._engine.bindFramebuffer(this._depthRenderTarget.renderTarget),this._engine.clear(this._depthClearColor,!0,!0,!1),this._engine.unBindFramebuffer(this._depthRenderTarget.renderTarget)),(null===(t=this._diffuseRenderTarget)||void 0===t?void 0:t.renderTarget)&&(this._engine.bindFramebuffer(this._diffuseRenderTarget.renderTarget),this._engine.clear(this._thicknessClearColor,!0,!0,!1),this._engine.unBindFramebuffer(this._diffuseRenderTarget.renderTarget)),(null===(i=this._thicknessRenderTarget)||void 0===i?void 0:i.renderTarget)&&(this._engine.bindFramebuffer(this._thicknessRenderTarget.renderTarget),this._engine.clear(this._thicknessClearColor,!0,!1,!1),this._engine.unBindFramebuffer(this._thicknessRenderTarget.renderTarget))}_render(e){var t,i,n,s,r,o;if(this._needInitialization||!e.isReady())return;const a=this._engine._currentRenderTarget;this._engine.setState(!1,void 0,void 0,void 0,!0),this._engine.setDepthBuffer(!0),this._engine.setDepthWrite(!0),this._engine.setAlphaMode(0),(null===(t=this._depthRenderTarget)||void 0===t?void 0:t.renderTarget)&&(this._engine.bindFramebuffer(this._depthRenderTarget.renderTarget),e.renderDepthTexture(),this._engine.unbindInstanceAttributes(),this._engine.unBindFramebuffer(this._depthRenderTarget.renderTarget)),(null===(i=this._diffuseRenderTarget)||void 0===i?void 0:i.renderTarget)&&(this._engine.bindFramebuffer(this._diffuseRenderTarget.renderTarget),e.renderDiffuseTexture(),this._engine.unbindInstanceAttributes(),this._engine.unBindFramebuffer(this._diffuseRenderTarget.renderTarget)),(null===(n=this._thicknessRenderTarget)||void 0===n?void 0:n.renderTarget)&&(this._engine.bindFramebuffer(this._thicknessRenderTarget.renderTarget),e.renderThicknessTexture(),this._engine.unbindInstanceAttributes(),this._engine.unBindFramebuffer(this._thicknessRenderTarget.renderTarget)),null===(s=this._depthRenderTarget)||void 0===s||s.applyBlurPostProcesses(),null===(r=this._diffuseRenderTarget)||void 0===r||r.applyBlurPostProcesses(),null===(o=this._thicknessRenderTarget)||void 0===o||o.applyBlurPostProcesses(),a&&this._engine.bindFramebuffer(a)}dispose(e=!1){var t,i,n,s;e||(null===(t=this._depthRenderTarget)||void 0===t||t.dispose(),this._depthRenderTarget=null,null===(i=this._diffuseRenderTarget)||void 0===i||i.dispose(),this._diffuseRenderTarget=null,null===(n=this._thicknessRenderTarget)||void 0===n||n.dispose(),this._thicknessRenderTarget=null),this._renderPostProcess&&this._camera&&this._camera.detachPostProcess(this._renderPostProcess),null===(s=this._renderPostProcess)||void 0===s||s.dispose(),this._renderPostProcess=null,this._needInitialization=!1}}class gg extends pg{getClassName(){return"FluidRenderingObjectCustomParticles"}get vertexBuffers(){return this._vertexBuffers}constructor(e,t,i){super(e),this._numParticles=i,this._diffuseEffectWrapper=null,this._vertexBuffers={},this.addBuffers(t)}addBuffers(e){for(const t in e){let i,n=!0;switch(t){case"velocity":i=3;break;case"offset":n=!1}this._vertexBuffers[t]=new qe.o(this._engine,e[t],t,!0,!1,i,n)}}_createEffects(){super._createEffects(),this._diffuseEffectWrapper=new Ih.H({engine:this._engine,useShaderStore:!0,vertexShader:"fluidRenderingParticleDiffuse",fragmentShader:"fluidRenderingParticleDiffuse",attributeNames:["position","offset","color"],uniformNames:["view","projection","size"],samplerNames:[]})}isReady(){var e,t;return this._vertexBuffers.offset||(this._vertexBuffers.offset=new qe.o(this._engine,[0,0,1,0,0,1,1,1],"offset",!1,!1,2)),super.isReady()&&null!==(t=null===(e=this._diffuseEffectWrapper)||void 0===e?void 0:e.effect.isReady())&&void 0!==t&&t}get numParticles(){return this._numParticles}setNumParticles(e){this._numParticles=e}renderDiffuseTexture(){const e=this.numParticles;if(!this._diffuseEffectWrapper||0===e)return;const t=this._diffuseEffectWrapper._drawWrapper,i=t.effect;this._engine.enableEffect(t),this._engine.bindBuffers(this.vertexBuffers,this.indexBuffer,i),i.setMatrix("view",this._scene.getViewMatrix()),i.setMatrix("projection",this._scene.getProjectionMatrix()),null!==this._particleSize&&i.setFloat2("size",this._particleSize,this._particleSize),this.useInstancing?this._engine.drawArraysType(7,0,4,e):this._engine.drawElementsType(0,0,e)}dispose(){var e;super.dispose(),null===(e=this._diffuseEffectWrapper)||void 0===e||e.dispose();for(const e in this._vertexBuffers)this._vertexBuffers[e].dispose();this._vertexBuffers={}}}var vg;si.v.ShadersStore.copyTextureToTexturePixelShader="uniform float conversion;\nuniform sampler2D textureSampler;\nvarying vec2 vUV;\n#include<helperFunctions>\nvoid main(void) \n{\nvec4 color=texture2D(textureSampler,vUV);\n#ifdef DEPTH_TEXTURE\ngl_FragDepth=color.r;\n#else\nif (conversion==1.) {\ncolor=toLinearSpace(color);\n} else if (conversion==2.) {\ncolor=toGammaSpace(color);\n}\ngl_FragColor=color;\n#endif\n}\n",function(e){e[e.None=0]="None",e[e.ToLinearSpace=1]="ToLinearSpace",e[e.ToGammaSpace=2]="ToGammaSpace"}(vg||(vg={}));class yg{_textureIsInternal(e){return void 0===e.getInternalTexture}constructor(e,t=!1){this._engine=e,this._isDepthTexture=t,this._renderer=new Ih.I(e),this._effectWrapper=new Ih.H({engine:e,name:"CopyTextureToTexture",fragmentShader:"copyTextureToTexture",useShaderStore:!0,uniformNames:["conversion"],samplerNames:["textureSampler"],defines:t?["#define DEPTH_TEXTURE"]:[]}),this._effectWrapper.onApplyObservable.add((()=>{t&&(e.setState(!1),e.setDepthBuffer(!0),e.depthCullingState.depthMask=!0,e.depthCullingState.depthFunc=519),this._textureIsInternal(this._source)?this._effectWrapper.effect._bindTexture("textureSampler",this._source):this._effectWrapper.effect.setTexture("textureSampler",this._source),this._effectWrapper.effect.setFloat("conversion",this._conversion)}))}isReady(){return this._effectWrapper.effect.isReady()}copy(e,t,i=vg.None){if(!this.isReady())return!1;this._source=e,this._conversion=i;const n=this._engine.depthCullingState.depthFunc;return this._renderer.render(this._effectWrapper,t),this._isDepthTexture&&n&&(this._engine.depthCullingState.depthFunc=n),!0}dispose(){this._effectWrapper.dispose(),this._renderer.dispose()}}class xg{get depthRTWrapper(){return this._depthRTWrapper}constructor(e,t,i,n=1){this._engine=e,this._copyTextureToTexture=new yg(e,!0),this._depthRTWrapper=this._engine.createRenderTargetTexture({width:t,height:i},{generateMipMaps:!1,type:0,format:6,samplingMode:1,generateDepthBuffer:!0,generateStencilBuffer:!1,samples:n,noColorAttachment:!0,label:"FluidRenderingDepthTextureCopyRTT"}),this._depthRTWrapper.createDepthStencilTexture(0,!1,!1,1,void 0,"FluidRenderingDepthTextureCopyRTTDepthStencil")}copy(e){return this._copyTextureToTexture.copy(e,this._depthRTWrapper)}dispose(){this._depthRTWrapper.dispose(),this._copyTextureToTexture.dispose()}}si.v.ShadersStore.fluidRenderingParticleDepthVertexShader="attribute vec3 position;\nattribute vec2 offset;\nuniform mat4 view;\nuniform mat4 projection;\nuniform vec2 size;\nvarying vec2 uv;\nvarying vec3 viewPos;\nvarying float sphereRadius;\n#ifdef FLUIDRENDERING_VELOCITY\nattribute vec3 velocity;\nvarying float velocityNorm;\n#endif\nvoid main(void) {\nvec3 cornerPos;\ncornerPos.xy=vec2(offset.x-0.5,offset.y-0.5)*size;\ncornerPos.z=0.0;\nviewPos=(view*vec4(position,1.0)).xyz;\ngl_Position=projection*vec4(viewPos+cornerPos,1.0);\nuv=offset;\nsphereRadius=size.x/2.0;\n#ifdef FLUIDRENDERING_VELOCITY\nvelocityNorm=length(velocity);\n#endif\n}\n";si.v.ShadersStore.fluidRenderingParticleDepthPixelShader="uniform mat4 projection;\nvarying vec2 uv;\nvarying vec3 viewPos;\nvarying float sphereRadius;\n#ifdef FLUIDRENDERING_VELOCITY\nvarying float velocityNorm;\n#endif\nvoid main(void) {\nvec3 normal;\nnormal.xy=uv*2.0-1.0;\nfloat r2=dot(normal.xy,normal.xy);\nif (r2>1.0) discard;\nnormal.z=sqrt(1.0-r2);\n#ifndef FLUIDRENDERING_RHS\nnormal.z=-normal.z;\n#endif\nvec4 realViewPos=vec4(viewPos+normal*sphereRadius,1.0);\nvec4 clipSpacePos=projection*realViewPos;\n#ifdef WEBGPU\ngl_FragDepth=clipSpacePos.z/clipSpacePos.w;\n#else\ngl_FragDepth=(clipSpacePos.z/clipSpacePos.w)*0.5+0.5;\n#endif\n#ifdef FLUIDRENDERING_RHS\nrealViewPos.z=-realViewPos.z;\n#endif\n#ifdef FLUIDRENDERING_VELOCITY\nglFragColor=vec4(realViewPos.z,velocityNorm,0.,1.);\n#else\nglFragColor=vec4(realViewPos.z,0.,0.,1.);\n#endif\n}\n";si.v.ShadersStore.fluidRenderingParticleThicknessVertexShader="attribute vec3 position;\nattribute vec2 offset;\nuniform mat4 view;\nuniform mat4 projection;\nuniform vec2 size;\nvarying vec2 uv;\nvoid main(void) {\nvec3 cornerPos;\ncornerPos.xy=vec2(offset.x-0.5,offset.y-0.5)*size;\ncornerPos.z=0.0;\nvec3 viewPos=(view*vec4(position,1.0)).xyz+cornerPos;\ngl_Position=projection*vec4(viewPos,1.0);\nuv=offset;\n}\n";si.v.ShadersStore.fluidRenderingParticleThicknessPixelShader="uniform float particleAlpha;\nvarying vec2 uv;\nvoid main(void) {\nvec3 normal;\nnormal.xy=uv*2.0-1.0;\nfloat r2=dot(normal.xy,normal.xy);\nif (r2>1.0) discard;\nfloat thickness=sqrt(1.0-r2);\nglFragColor=vec4(vec3(particleAlpha*thickness),1.0);\n}\n";si.v.ShadersStore.fluidRenderingParticleDiffuseVertexShader="attribute vec3 position;\nattribute vec2 offset;\nattribute vec4 color;\nuniform mat4 view;\nuniform mat4 projection;\nuniform vec2 size;\nvarying vec2 uv;\nvarying vec3 diffuseColor;\nvoid main(void) {\nvec3 cornerPos;\ncornerPos.xy=vec2(offset.x-0.5,offset.y-0.5)*size;\ncornerPos.z=0.0;\nvec3 viewPos=(view*vec4(position,1.0)).xyz+cornerPos;\ngl_Position=projection*vec4(viewPos,1.0);\nuv=offset;\ndiffuseColor=color.rgb;\n}\n";si.v.ShadersStore.fluidRenderingParticleDiffusePixelShader="uniform float particleAlpha;\nvarying vec2 uv;\nvarying vec3 diffuseColor;\nvoid main(void) {\nvec3 normal;\nnormal.xy=uv*2.0-1.0;\nfloat r2=dot(normal.xy,normal.xy);\nif (r2>1.0) discard;\nglFragColor=vec4(diffuseColor,1.0);\n}\n";si.v.ShadersStore.fluidRenderingBilateralBlurPixelShader="uniform sampler2D textureSampler;\nuniform int maxFilterSize;\nuniform vec2 blurDir;\nuniform float projectedParticleConstant;\nuniform float depthThreshold;\nvarying vec2 vUV;\nvoid main(void) {\nfloat depth=textureLod(textureSampler,vUV,0.).x;\nif (depth>=1e6 || depth<=0.) {\nglFragColor=vec4(vec3(depth),1.);\nreturn;\n}\nint filterSize=min(maxFilterSize,int(ceil(projectedParticleConstant/depth)));\nfloat sigma=float(filterSize)/3.0;\nfloat two_sigma2=2.0*sigma*sigma;\nfloat sigmaDepth=depthThreshold/3.0;\nfloat two_sigmaDepth2=2.0*sigmaDepth*sigmaDepth;\nfloat sum=0.;\nfloat wsum=0.;\nfloat sumVel=0.;\nfor (int x=-filterSize; x<=filterSize; ++x) {\nvec2 coords=vec2(x);\nvec2 sampleDepthVel=textureLod(textureSampler,vUV+coords*blurDir,0.).rg;\nfloat r=dot(coords,coords);\nfloat w=exp(-r/two_sigma2);\nfloat rDepth=sampleDepthVel.r-depth;\nfloat wd=exp(-rDepth*rDepth/two_sigmaDepth2);\nsum+=sampleDepthVel.r*w*wd;\nsumVel+=sampleDepthVel.g*w*wd;\nwsum+=w*wd;\n}\nglFragColor=vec4(sum/wsum,sumVel/wsum,0.,1.);\n}\n";si.v.ShadersStore.fluidRenderingStandardBlurPixelShader="uniform sampler2D textureSampler;\nuniform int filterSize;\nuniform vec2 blurDir;\nvarying vec2 vUV;\nvoid main(void) {\nvec4 s=textureLod(textureSampler,vUV,0.);\nif (s.r==0.) {\nglFragColor=vec4(0.,0.,0.,1.);\nreturn;\n}\nfloat sigma=float(filterSize)/3.0;\nfloat twoSigma2=2.0*sigma*sigma;\nvec4 sum=vec4(0.);\nfloat wsum=0.;\nfor (int x=-filterSize; x<=filterSize; ++x) {\nvec2 coords=vec2(x);\nvec4 sampl=textureLod(textureSampler,vUV+coords*blurDir,0.);\nfloat w=exp(-coords.x*coords.x/twoSigma2);\nsum+=sampl*w;\nwsum+=w;\n}\nsum/=wsum;\nglFragColor=vec4(sum.rgb,1.);\n}\n";function bg(e){return!!e.particleSystem}si.v.ShadersStore.fluidRenderingRenderPixelShader="/* disable_uniformity_analysis */\n#define IOR 1.333\n#define ETA 1.0/IOR\n#define F0 0.02\nuniform sampler2D textureSampler;\nuniform sampler2D depthSampler;\n#ifdef FLUIDRENDERING_DIFFUSETEXTURE\nuniform sampler2D diffuseSampler;\n#else\nuniform vec3 diffuseColor;\n#endif\n#ifdef FLUIDRENDERING_FIXED_THICKNESS\nuniform float thickness;\nuniform sampler2D bgDepthSampler;\n#else\nuniform float minimumThickness;\nuniform sampler2D thicknessSampler;\n#endif\n#ifdef FLUIDRENDERING_ENVIRONMENT\nuniform samplerCube reflectionSampler;\n#endif\n#if defined(FLUIDRENDERING_DEBUG) && defined(FLUIDRENDERING_DEBUG_TEXTURE)\nuniform sampler2D debugSampler;\n#endif\nuniform mat4 viewMatrix;\nuniform mat4 projectionMatrix;\nuniform mat4 invProjectionMatrix;\nuniform vec2 texelSize;\nuniform vec3 dirLight;\nuniform float cameraFar;\nuniform float density;\nuniform float refractionStrength;\nuniform float fresnelClamp;\nuniform float specularPower;\nvarying vec2 vUV;\nvec3 computeViewPosFromUVDepth(vec2 texCoord,float depth) {\nvec4 ndc;\nndc.xy=texCoord*2.0-1.0;\n#ifdef FLUIDRENDERING_RHS\nndc.z=-projectionMatrix[2].z+projectionMatrix[3].z/depth;\n#else\nndc.z=projectionMatrix[2].z+projectionMatrix[3].z/depth;\n#endif\nndc.w=1.0;\nvec4 eyePos=invProjectionMatrix*ndc;\neyePos.xyz/=eyePos.w;\nreturn eyePos.xyz;\n}\nvec3 getViewPosFromTexCoord(vec2 texCoord) {\nfloat depth=textureLod(depthSampler,texCoord,0.).x;\nreturn computeViewPosFromUVDepth(texCoord,depth);\n}\nvoid main(void) {\nvec2 texCoord=vUV;\n#if defined(FLUIDRENDERING_DEBUG) && defined(FLUIDRENDERING_DEBUG_TEXTURE)\nvec4 color=texture2D(debugSampler,texCoord);\n#ifdef FLUIDRENDERING_DEBUG_DEPTH\nglFragColor=vec4(color.rgb/vec3(2.0),1.);\nif (color.r>0.999 && color.g>0.999) {\nglFragColor=texture2D(textureSampler,texCoord);\n}\n#else\nglFragColor=vec4(color.rgb,1.);\nif (color.r<0.001 && color.g<0.001 && color.b<0.001) {\nglFragColor=texture2D(textureSampler,texCoord);\n}\n#endif\nreturn;\n#endif\nvec2 depthVel=textureLod(depthSampler,texCoord,0.).rg;\nfloat depth=depthVel.r;\n#ifndef FLUIDRENDERING_FIXED_THICKNESS\nfloat thickness=texture2D(thicknessSampler,texCoord).x;\n#else\nfloat bgDepth=texture2D(bgDepthSampler,texCoord).x;\nfloat depthNonLinear=projectionMatrix[2].z+projectionMatrix[3].z/depth;\ndepthNonLinear=depthNonLinear*0.5+0.5;\n#endif\nvec4 backColor=texture2D(textureSampler,texCoord);\n#ifndef FLUIDRENDERING_FIXED_THICKNESS\nif (depth>=cameraFar || depth<=0. || thickness<=minimumThickness) {\n#else\nif (depth>=cameraFar || depth<=0. || bgDepth<=depthNonLinear) {\n#endif\nglFragColor=backColor;\nreturn;\n}\nvec3 viewPos=computeViewPosFromUVDepth(texCoord,depth);\nvec3 ddx=getViewPosFromTexCoord(texCoord+vec2(texelSize.x,0.))-viewPos;\nvec3 ddy=getViewPosFromTexCoord(texCoord+vec2(0.,texelSize.y))-viewPos;\nvec3 ddx2=viewPos-getViewPosFromTexCoord(texCoord+vec2(-texelSize.x,0.));\nif (abs(ddx.z)>abs(ddx2.z)) {\nddx=ddx2;\n}\nvec3 ddy2=viewPos-getViewPosFromTexCoord(texCoord+vec2(0.,-texelSize.y));\nif (abs(ddy.z)>abs(ddy2.z)) {\nddy=ddy2;\n}\nvec3 normal=normalize(cross(ddy,ddx));\n#ifdef FLUIDRENDERING_RHS\nnormal=-normal;\n#endif\n#ifndef WEBGPU\nif(isnan(normal.x) || isnan(normal.y) || isnan(normal.z) || isinf(normal.x) || isinf(normal.y) || isinf(normal.z)) {\nnormal=vec3(0.,0.,-1.);\n}\n#endif\n#if defined(FLUIDRENDERING_DEBUG) && defined(FLUIDRENDERING_DEBUG_SHOWNORMAL)\nglFragColor=vec4(normal*0.5+0.5,1.0);\nreturn;\n#endif\nvec3 rayDir=normalize(viewPos); \n#ifdef FLUIDRENDERING_DIFFUSETEXTURE\nvec3 diffuseColor=textureLod(diffuseSampler,texCoord,0.0).rgb;\n#endif\nvec3 lightDir=normalize(vec3(viewMatrix*vec4(-dirLight,0.)));\nvec3 H =normalize(lightDir-rayDir);\nfloat specular=pow(max(0.0,dot(H,normal)),specularPower);\n#ifdef FLUIDRENDERING_DEBUG_DIFFUSERENDERING\nfloat diffuse =max(0.0,dot(lightDir,normal))*1.0;\nglFragColor=vec4(vec3(0.1) /*ambient*/+vec3(0.42,0.50,1.00)*diffuse+vec3(0,0,0.2)+specular,1.);\nreturn;\n#endif\nvec3 refractionDir=refract(rayDir,normal,ETA);\nvec4 transmitted=textureLod(textureSampler,vec2(texCoord+refractionDir.xy*thickness*refractionStrength),0.0);\nvec3 transmittance=exp(-density*thickness*(1.0-diffuseColor)); \nvec3 refractionColor=transmitted.rgb*transmittance;\n#ifdef FLUIDRENDERING_ENVIRONMENT\nvec3 reflectionDir=reflect(rayDir,normal);\nvec3 reflectionColor=(textureCube(reflectionSampler,reflectionDir).rgb);\nfloat fresnel=clamp(F0+(1.0-F0)*pow(1.0-dot(normal,-rayDir),5.0),0.,fresnelClamp);\nvec3 finalColor=mix(refractionColor,reflectionColor,fresnel)+specular;\n#else\nvec3 finalColor=refractionColor+specular;\n#endif\n#ifdef FLUIDRENDERING_VELOCITY\nfloat velocity=depthVel.g;\nfinalColor=mix(finalColor,vec3(1.0),smoothstep(0.3,1.0,velocity/6.0));\n#endif\nglFragColor=vec4(finalColor,transmitted.a);\n}\n",Object.defineProperty(k.x.prototype,"fluidRenderer",{get:function(){return this._fluidRenderer},set:function(e){this._fluidRenderer=e},enumerable:!0,configurable:!0}),k.x.prototype.enableFluidRenderer=function(){return this._fluidRenderer||(this._fluidRenderer=new Sg(this)),this._fluidRenderer},k.x.prototype.disableFluidRenderer=function(){var e;null===(e=this._fluidRenderer)||void 0===e||e.dispose(),this._fluidRenderer=null};class Tg{constructor(e){this.name=ve.l.NAME_FLUIDRENDERER,this.scene=e}register(){this.scene._gatherActiveCameraRenderTargetsStage.registerStep(ve.l.STEP_GATHERACTIVECAMERARENDERTARGETS_FLUIDRENDERER,this,this._gatherActiveCameraRenderTargets),this.scene._afterCameraDrawStage.registerStep(ve.l.STEP_AFTERCAMERADRAW_FLUIDRENDERER,this,this._afterCameraDraw)}_gatherActiveCameraRenderTargets(e){var t;null===(t=this.scene.fluidRenderer)||void 0===t||t._prepareRendering()}_afterCameraDraw(e){var t;null===(t=this.scene.fluidRenderer)||void 0===t||t._render(e)}rebuild(){this.scene._fluidRenderer&&(this.scene.disableFluidRenderer(),this.scene.enableFluidRenderer())}dispose(){this.scene.disableFluidRenderer()}}class Sg{static _SceneComponentInitialization(e){let t=e._getComponent(ve.l.NAME_FLUIDRENDERER);t||(t=new Tg(e),e._addComponent(t))}constructor(e){this._scene=e,this._engine=e.getEngine(),this._onEngineResizeObserver=null,this.renderObjects=[],this.targetRenderers=[],this._cameras=new Map,Sg._SceneComponentInitialization(this._scene),this._onEngineResizeObserver=this._engine.onResizeObservable.add((()=>{this._initialize()}))}recreate(){this._sortRenderingObjects(),this._initialize()}getRenderObjectFromParticleSystem(e){const t=this._getParticleSystemIndex(e);return-1!==t?this.renderObjects[t]:null}addParticleSystem(e,t,i,n){const s=new fg(this._scene,e);s.onParticleSizeChanged.add(this._setParticleSizeForRenderTargets.bind(this)),i||(i=new mg(this._scene,n),this.targetRenderers.push(i)),i._onUseVelocityChanged.hasObservers()||i._onUseVelocityChanged.add(this._setUseVelocityForRenderObject.bind(this)),void 0!==t&&(i.generateDiffuseTexture=t);const r={object:s,targetRenderer:i};return this.renderObjects.push(r),this._sortRenderingObjects(),this._setParticleSizeForRenderTargets(),r}addCustomParticles(e,t,i,n,s){const r=new gg(this._scene,e,t);r.onParticleSizeChanged.add(this._setParticleSizeForRenderTargets.bind(this)),n||(n=new mg(this._scene,s),this.targetRenderers.push(n)),n._onUseVelocityChanged.hasObservers()||n._onUseVelocityChanged.add(this._setUseVelocityForRenderObject.bind(this)),void 0!==i&&(n.generateDiffuseTexture=i);const o={object:r,targetRenderer:n};return this.renderObjects.push(o),this._sortRenderingObjects(),this._setParticleSizeForRenderTargets(),o}removeRenderObject(e,t=!0){const i=this.renderObjects.indexOf(e);return-1!==i&&(e.object.dispose(),this.renderObjects.splice(i,1),t&&this._removeUnusedTargetRenderers()?this._initialize():this._setParticleSizeForRenderTargets(),!0)}_sortRenderingObjects(){this.renderObjects.sort(((e,t)=>e.object.priority<t.object.priority?-1:e.object.priority>t.object.priority?1:0))}_removeUnusedTargetRenderers(){const e={};for(let t=0;t<this.renderObjects.length;++t){const i=this.renderObjects[t].targetRenderer;e[this.targetRenderers.indexOf(i)]=!0}let t=!1;const i=[];for(let n=0;n<this.targetRenderers.length;++n)e[n]?i.push(this.targetRenderers[n]):(this.targetRenderers[n].dispose(),t=!0);return t&&(this.targetRenderers.length=0,this.targetRenderers.push(...i)),t}_getParticleSystemIndex(e){for(let t=0;t<this.renderObjects.length;++t){const i=this.renderObjects[t].object;if(bg(i)&&i.particleSystem===e)return t}return-1}_initialize(){for(let e=0;e<this.targetRenderers.length;++e)this.targetRenderers[e].dispose();const e=new Map;for(let t=0;t<this.targetRenderers.length;++t){const i=this.targetRenderers[t];if(i._initialize(),i.camera&&i._renderPostProcess){let n=e.get(i.camera);n||(n=[[],{}],e.set(i.camera,n)),n[0].push(i),i.camera.attachPostProcess(i._renderPostProcess,t)}}let t=e.keys();for(let i=t.next();!0!==i.done;i=t.next()){const t=i.value,n=e.get(t),s=t._getFirstPostProcess();if(!s)continue;const[r,o]=n;s.onSizeChangedObservable.add((()=>{var e;s.inputTexture.depthStencilTexture||s.inputTexture.createDepthStencilTexture(0,!0,this._engine.isStencilEnable,r[0].samples,this._engine.isStencilEnable?13:14,`PostProcessRTTDepthStencil-${s.name}`);for(const t of r){const i=null===(e=t._thicknessRenderTarget)||void 0===e?void 0:e.renderTarget,n=null==i?void 0:i.texture;if(i&&n){const e=n.width+"_"+n.height;let t=o[e];t||(t=o[e]=new xg(this._engine,n.width,n.height)),t.depthRTWrapper._shareDepth(i)}}}))}t=this._cameras.keys();for(let i=t.next();!0!==i.done;i=t.next()){const t=i.value,n=this._cameras.get(t)[1],s=e.get(t);if(s)for(const e in n)s[1][e]||n[e].dispose();else for(const e in n)n[e].dispose()}this._cameras.clear(),this._cameras=e,this._setParticleSizeForRenderTargets()}_setParticleSizeForRenderTargets(){const e=new Map;for(let t=0;t<this.renderObjects.length;++t){const i=this.renderObjects[t];let n=e.get(i.targetRenderer);void 0===n&&(n=0),e.set(i.targetRenderer,Math.max(n,i.object.particleSize))}e.forEach(((e,t)=>{t._depthRenderTarget&&(t._depthRenderTarget.particleSize=e)}))}_setUseVelocityForRenderObject(){for(const e of this.renderObjects)e.object.useVelocity=e.targetRenderer.useVelocity}_prepareRendering(){for(const e of this.targetRenderers)if(e.needInitialization)return void this._initialize()}_render(e){var t;for(let t=0;t<this.targetRenderers.length;++t)e&&this.targetRenderers[t].camera!==e||this.targetRenderers[t]._clearTargets();const i=this._cameras.keys();for(let n=i.next();!0!==n.done;n=i.next()){const i=n.value,s=this._cameras.get(i);if(e&&i!==e)continue;const r=i._getFirstPostProcess();if(!r)continue;const o=null===(t=r.inputTexture)||void 0===t?void 0:t.depthStencilTexture;if(o){const[e,t]=s;for(const t of e)t._bgDepthTexture=o;for(const e in t)t[e].copy(o)}}for(let t=0;t<this.renderObjects.length;++t){const i=this.renderObjects[t];e&&i.targetRenderer.camera!==e||i.targetRenderer._render(i.object)}}dispose(){this._engine.onResizeObservable.remove(this._onEngineResizeObserver),this._onEngineResizeObserver=null;for(let e=0;e<this.renderObjects.length;++e)this.renderObjects[e].object.dispose();for(let e=0;e<this.targetRenderers.length;++e)this.targetRenderers[e].dispose();this._cameras.forEach((e=>{const t=e[1];for(const e in t)t[e].dispose()})),this.renderObjects=[],this.targetRenderers=[],this._cameras.clear()}}class Eg{get animationStarted(){return this._animationStarted}get fromIndex(){return this._fromIndex}get toIndex(){return this._toIndex}get loopAnimation(){return this._loopAnimation}get delay(){return Math.max(this._delay,1)}constructor(){this.width=1,this.height=1,this.angle=0,this.invertU=!1,this.invertV=!1,this.isVisible=!0,this._animationStarted=!1,this._loopAnimation=!1,this._fromIndex=0,this._toIndex=0,this._delay=0,this._direction=1,this._time=0,this._onBaseAnimationEnd=null,this.position={x:1,y:1,z:1},this.color={r:1,g:1,b:1,a:1}}playAnimation(e,t,i,n,s){this._fromIndex=e,this._toIndex=t,this._loopAnimation=i,this._delay=n||1,this._animationStarted=!0,this._onBaseAnimationEnd=s,e<t?this._direction=1:(this._direction=-1,this._toIndex=e,this._fromIndex=t),this.cellIndex=e,this._time=0}stopAnimation(){this._animationStarted=!1}_animate(e){this._animationStarted&&(this._time+=e,this._time>this._delay&&(this._time=this._time%this._delay,this.cellIndex+=this._direction,(this._direction>0&&this.cellIndex>this._toIndex||this._direction<0&&this.cellIndex<this._fromIndex)&&(this._loopAnimation?this.cellIndex=this._direction>0?this._fromIndex:this._toIndex:(this.cellIndex=this._toIndex,this._animationStarted=!1,this._onBaseAnimationEnd&&this._onBaseAnimationEnd()))))}}class Cg extends Eg{get size(){return this.width}set size(e){this.width=e,this.height=e}get manager(){return this._manager}constructor(e,t){super(),this.name=e,this.animations=new Array,this.isPickable=!1,this.useAlphaForPicking=!1,this.onDisposeObservable=new r.y$,this._onAnimationEnd=null,this._endAnimation=()=>{this._onAnimationEnd&&this._onAnimationEnd(),this.disposeWhenFinishedAnimating&&this.dispose()},this.color=new a.HE(1,1,1,1),this.position=o.P.Zero(),this._manager=t,this._manager.sprites.push(this),this.uniqueId=this._manager.scene.getUniqueId()}getClassName(){return"Sprite"}get fromIndex(){return this._fromIndex}set fromIndex(e){this.playAnimation(e,this._toIndex,this._loopAnimation,this._delay,this._onAnimationEnd)}get toIndex(){return this._toIndex}set toIndex(e){this.playAnimation(this._fromIndex,e,this._loopAnimation,this._delay,this._onAnimationEnd)}get loopAnimation(){return this._loopAnimation}set loopAnimation(e){this.playAnimation(this._fromIndex,this._toIndex,e,this._delay,this._onAnimationEnd)}get delay(){return Math.max(this._delay,1)}set delay(e){this.playAnimation(this._fromIndex,this._toIndex,this._loopAnimation,e,this._onAnimationEnd)}playAnimation(e,t,i,n,s=null){this._onAnimationEnd=s,super.playAnimation(e,t,i,n,this._endAnimation)}dispose(){for(let e=0;e<this._manager.sprites.length;e++)this._manager.sprites[e]==this&&this._manager.sprites.splice(e,1);this.onDisposeObservable.notifyObservers(this),this.onDisposeObservable.clear()}serialize(){const e={};return e.name=this.name,e.position=this.position.asArray(),e.color=this.color.asArray(),e.width=this.width,e.height=this.height,e.angle=this.angle,e.cellIndex=this.cellIndex,e.cellRef=this.cellRef,e.invertU=this.invertU,e.invertV=this.invertV,e.disposeWhenFinishedAnimating=this.disposeWhenFinishedAnimating,e.isPickable=this.isPickable,e.isVisible=this.isVisible,e.useAlphaForPicking=this.useAlphaForPicking,e.animationStarted=this.animationStarted,e.fromIndex=this.fromIndex,e.toIndex=this.toIndex,e.loopAnimation=this.loopAnimation,e.delay=this.delay,e}static Parse(e,t){const i=new Cg(e.name,t);return i.position=o.P.FromArray(e.position),i.color=a.HE.FromArray(e.color),i.width=e.width,i.height=e.height,i.angle=e.angle,i.cellIndex=e.cellIndex,i.cellRef=e.cellRef,i.invertU=e.invertU,i.invertV=e.invertV,i.disposeWhenFinishedAnimating=e.disposeWhenFinishedAnimating,i.isPickable=e.isPickable,i.isVisible=e.isVisible,i.useAlphaForPicking=e.useAlphaForPicking,i.fromIndex=e.fromIndex,i.toIndex=e.toIndex,i.loopAnimation=e.loopAnimation,i.delay=e.delay,e.animationStarted&&i.playAnimation(i.fromIndex,i.toIndex,i.loopAnimation,i.delay),i}}k.x.prototype._internalPickSprites=function(e,t,i,n){if(!bn.p)return null;let s=null;if(!n){if(!this.activeCamera)return null;n=this.activeCamera}if(this.spriteManagers&&this.spriteManagers.length>0)for(let r=0;r<this.spriteManagers.length;r++){const o=this.spriteManagers[r];if(!o.isPickable)continue;const a=o.intersects(e,n,t,i);if(a&&a.hit&&(i||null==s||!(a.distance>=s.distance))&&(s=a,i))break}return s||new bn.p},k.x.prototype._internalMultiPickSprites=function(e,t,i){if(!bn.p)return null;let n=new Array;if(!i){if(!this.activeCamera)return null;i=this.activeCamera}if(this.spriteManagers&&this.spriteManagers.length>0)for(let s=0;s<this.spriteManagers.length;s++){const r=this.spriteManagers[s];if(!r.isPickable)continue;const o=r.multiIntersects(e,i,t);null!==o&&(n=n.concat(o))}return n},k.x.prototype.pickSprite=function(e,t,i,n,s){if(!this._tempSpritePickingRay)return null;this.createPickingRayInCameraSpaceToRef(e,t,this._tempSpritePickingRay,s);const r=this._internalPickSprites(this._tempSpritePickingRay,i,n,s);return r&&(r.ray=this.createPickingRayInCameraSpace(e,t,s)),r},k.x.prototype.pickSpriteWithRay=function(e,t,i,n){if(!this._tempSpritePickingRay)return null;if(!n){if(!this.activeCamera)return null;n=this.activeCamera}Yt.z.TransformToRef(e,n.getViewMatrix(),this._tempSpritePickingRay);const s=this._internalPickSprites(this._tempSpritePickingRay,t,i,n);return s&&(s.ray=e),s},k.x.prototype.multiPickSprite=function(e,t,i,n){return this.createPickingRayInCameraSpaceToRef(e,t,this._tempSpritePickingRay,n),this._internalMultiPickSprites(this._tempSpritePickingRay,i,n)},k.x.prototype.multiPickSpriteWithRay=function(e,t,i){if(!this._tempSpritePickingRay)return null;if(!i){if(!this.activeCamera)return null;i=this.activeCamera}return Yt.z.TransformToRef(e,i.getViewMatrix(),this._tempSpritePickingRay),this._internalMultiPickSprites(this._tempSpritePickingRay,t,i)},k.x.prototype.setPointerOverSprite=function(e){this._pointerOverSprite!==e&&(this._pointerOverSprite&&this._pointerOverSprite.actionManager&&this._pointerOverSprite.actionManager.processTrigger(10,c.V.CreateNewFromSprite(this._pointerOverSprite,this)),this._pointerOverSprite=e,this._pointerOverSprite&&this._pointerOverSprite.actionManager&&this._pointerOverSprite.actionManager.processTrigger(9,c.V.CreateNewFromSprite(this._pointerOverSprite,this)))},k.x.prototype.getPointerOverSprite=function(){return this._pointerOverSprite};class Ag{constructor(e){this.name=ve.l.NAME_SPRITE,this.scene=e,this.scene.spriteManagers=new Array,this.scene._tempSpritePickingRay=Yt.z?Yt.z.Zero():null,this.scene.onBeforeSpritesRenderingObservable=new r.y$,this.scene.onAfterSpritesRenderingObservable=new r.y$,this._spritePredicate=e=>!!e.actionManager&&e.isPickable&&e.actionManager.hasPointerTriggers}register(){this.scene._pointerMoveStage.registerStep(ve.l.STEP_POINTERMOVE_SPRITE,this,this._pointerMove),this.scene._pointerDownStage.registerStep(ve.l.STEP_POINTERDOWN_SPRITE,this,this._pointerDown),this.scene._pointerUpStage.registerStep(ve.l.STEP_POINTERUP_SPRITE,this,this._pointerUp)}rebuild(){}dispose(){this.scene.onBeforeSpritesRenderingObservable.clear(),this.scene.onAfterSpritesRenderingObservable.clear();const e=this.scene.spriteManagers;if(e)for(;e.length;)e[0].dispose()}_pickSpriteButKeepRay(e,t,i,n,s){const r=this.scene.pickSprite(t,i,this._spritePredicate,n,s);return r&&(r.ray=e?e.ray:null),r}_pointerMove(e,t,i,n,s){const r=this.scene;return n?r.setPointerOverSprite(null):(i=this._pickSpriteButKeepRay(i,e,t,!1,r.cameraToUseForPointers||void 0))&&i.hit&&i.pickedSprite?(r.setPointerOverSprite(i.pickedSprite),!r.doNotHandleCursors&&s&&(r._pointerOverSprite&&r._pointerOverSprite.actionManager&&r._pointerOverSprite.actionManager.hoverCursor?s.style.cursor=r._pointerOverSprite.actionManager.hoverCursor:s.style.cursor=r.hoverCursor)):r.setPointerOverSprite(null),i}_pointerDown(e,t,i,n){const s=this.scene;if(s._pickedDownSprite=null,s.spriteManagers&&s.spriteManagers.length>0&&(i=s.pickSprite(e,t,this._spritePredicate,!1,s.cameraToUseForPointers||void 0))&&i.hit&&i.pickedSprite&&i.pickedSprite.actionManager){switch(s._pickedDownSprite=i.pickedSprite,n.button){case 0:i.pickedSprite.actionManager.processTrigger(2,c.V.CreateNewFromSprite(i.pickedSprite,s,n));break;case 1:i.pickedSprite.actionManager.processTrigger(4,c.V.CreateNewFromSprite(i.pickedSprite,s,n));break;case 2:i.pickedSprite.actionManager.processTrigger(3,c.V.CreateNewFromSprite(i.pickedSprite,s,n))}i.pickedSprite.actionManager&&i.pickedSprite.actionManager.processTrigger(5,c.V.CreateNewFromSprite(i.pickedSprite,s,n))}return i}_pointerUp(e,t,i,n,s){const r=this.scene;if(r.spriteManagers&&r.spriteManagers.length>0){const i=r.pickSprite(e,t,this._spritePredicate,!1,r.cameraToUseForPointers||void 0);i&&(i.hit&&i.pickedSprite&&i.pickedSprite.actionManager&&(i.pickedSprite.actionManager.processTrigger(7,c.V.CreateNewFromSprite(i.pickedSprite,r,n)),i.pickedSprite.actionManager&&(this.scene._inputManager._isPointerSwiping()||i.pickedSprite.actionManager.processTrigger(1,c.V.CreateNewFromSprite(i.pickedSprite,r,n)),s&&i.pickedSprite.actionManager.processTrigger(6,c.V.CreateNewFromSprite(i.pickedSprite,r,n)))),r._pickedDownSprite&&r._pickedDownSprite.actionManager&&r._pickedDownSprite!==i.pickedSprite&&r._pickedDownSprite.actionManager.processTrigger(16,c.V.CreateNewFromSprite(r._pickedDownSprite,r,n)))}return i}}i(689);si.v.ShadersStore.spritesPixelShader="uniform bool alphaTest;\nvarying vec4 vColor;\nvarying vec2 vUV;\nuniform sampler2D diffuseSampler;\n#include<fogFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\n#ifdef PIXEL_PERFECT\nvec2 uvPixelPerfect(vec2 uv) {\nvec2 res=vec2(textureSize(diffuseSampler,0));\nuv=uv*res;\nvec2 seam=floor(uv+0.5);\nuv=seam+clamp((uv-seam)/fwidth(uv),-0.5,0.5);\nreturn uv/res;\n}\n#endif\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#ifdef PIXEL_PERFECT\nvec2 uv=uvPixelPerfect(vUV);\n#else\nvec2 uv=vUV;\n#endif\nvec4 color=texture2D(diffuseSampler,uv);\nfloat fAlphaTest=float(alphaTest);\nif (fAlphaTest != 0.)\n{\nif (color.a<0.95)\ndiscard;\n}\ncolor*=vColor;\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}";si.v.ShadersStore.spritesVertexShader="attribute vec4 position;\nattribute vec2 options;\nattribute vec2 offsets;\nattribute vec2 inverts;\nattribute vec4 cellInfo;\nattribute vec4 color;\nuniform mat4 view;\nuniform mat4 projection;\nvarying vec2 vUV;\nvarying vec4 vColor;\n#include<fogVertexDeclaration>\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\nvec3 viewPos=(view*vec4(position.xyz,1.0)).xyz; \nvec2 cornerPos;\nfloat angle=position.w;\nvec2 size=vec2(options.x,options.y);\nvec2 offset=offsets.xy;\ncornerPos=vec2(offset.x-0.5,offset.y -0.5)*size;\nvec3 rotatedCorner;\nrotatedCorner.x=cornerPos.x*cos(angle)-cornerPos.y*sin(angle);\nrotatedCorner.y=cornerPos.x*sin(angle)+cornerPos.y*cos(angle);\nrotatedCorner.z=0.;\nviewPos+=rotatedCorner;\ngl_Position=projection*vec4(viewPos,1.0); \nvColor=color;\nvec2 uvOffset=vec2(abs(offset.x-inverts.x),abs(1.0-offset.y-inverts.y));\nvec2 uvPlace=cellInfo.xy;\nvec2 uvSize=cellInfo.zw;\nvUV.x=uvPlace.x+uvSize.x*uvOffset.x;\nvUV.y=uvPlace.y+uvSize.y*uvOffset.y;\n#ifdef FOG\nvFogDistance=viewPos;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}";class Pg{get capacity(){return this._capacity}get pixelPerfect(){return this._pixelPerfect}set pixelPerfect(e){this._pixelPerfect!==e&&(this._pixelPerfect=e,this._createEffects())}constructor(e,t,i=.01,n=null){this.blendMode=2,this.autoResetAlpha=!0,this.disableDepthWrite=!1,this.fogEnabled=!0,this._pixelPerfect=!1,this._useVAO=!1,this._useInstancing=!1,this._vertexBuffers={},this._capacity=t,this._epsilon=i,this._engine=e,this._useInstancing=e.getCaps().instancedArrays&&e._features.supportSpriteInstancing,this._useVAO=e.getCaps().vertexArrayObject&&!e.disableVertexArrayObjects,this._scene=n,this._useInstancing||this._buildIndexBuffer(),this._vertexBufferSize=this._useInstancing?16:18,this._vertexData=new Float32Array(t*this._vertexBufferSize*(this._useInstancing?1:4)),this._buffer=new qe.l(e,this._vertexData,!0,this._vertexBufferSize);const s=this._buffer.createVertexBuffer(qe.o.PositionKind,0,4,this._vertexBufferSize,this._useInstancing),r=this._buffer.createVertexBuffer("options",4,2,this._vertexBufferSize,this._useInstancing);let o,a=6;if(this._useInstancing){const t=new Float32Array([0,0,1,0,0,1,1,1]);this._spriteBuffer=new qe.l(e,t,!1,2),o=this._spriteBuffer.createVertexBuffer("offsets",0,2)}else o=this._buffer.createVertexBuffer("offsets",a,2,this._vertexBufferSize,this._useInstancing),a+=2;const l=this._buffer.createVertexBuffer("inverts",a,2,this._vertexBufferSize,this._useInstancing),h=this._buffer.createVertexBuffer("cellInfo",a+2,4,this._vertexBufferSize,this._useInstancing),c=this._buffer.createVertexBuffer(qe.o.ColorKind,a+6,4,this._vertexBufferSize,this._useInstancing);this._vertexBuffers[qe.o.PositionKind]=s,this._vertexBuffers.options=r,this._vertexBuffers.offsets=o,this._vertexBuffers.inverts=l,this._vertexBuffers.cellInfo=h,this._vertexBuffers[qe.o.ColorKind]=c,this._createEffects()}_createEffects(){var e,t,i,n;null===(e=this._drawWrapperBase)||void 0===e||e.dispose(),null===(t=this._drawWrapperFog)||void 0===t||t.dispose(),null===(i=this._drawWrapperDepth)||void 0===i||i.dispose(),null===(n=this._drawWrapperFogDepth)||void 0===n||n.dispose(),this._drawWrapperBase=new Ps.q(this._engine),this._drawWrapperFog=new Ps.q(this._engine),this._drawWrapperDepth=new Ps.q(this._engine,!1),this._drawWrapperFogDepth=new Ps.q(this._engine,!1),this._drawWrapperBase.drawContext&&(this._drawWrapperBase.drawContext.useInstancing=this._useInstancing),this._drawWrapperFog.drawContext&&(this._drawWrapperFog.drawContext.useInstancing=this._useInstancing),this._drawWrapperDepth.drawContext&&(this._drawWrapperDepth.drawContext.useInstancing=this._useInstancing),this._drawWrapperFogDepth.drawContext&&(this._drawWrapperFogDepth.drawContext.useInstancing=this._useInstancing);const s=this._pixelPerfect?"#define PIXEL_PERFECT\n":"";this._drawWrapperBase.effect=this._engine.createEffect("sprites",[qe.o.PositionKind,"options","offsets","inverts","cellInfo",qe.o.ColorKind],["view","projection","textureInfos","alphaTest"],["diffuseSampler"],s),this._drawWrapperDepth.effect=this._drawWrapperBase.effect,this._drawWrapperDepth.materialContext=this._drawWrapperBase.materialContext,this._scene&&(this._drawWrapperFog.effect=this._scene.getEngine().createEffect("sprites",[qe.o.PositionKind,"options","offsets","inverts","cellInfo",qe.o.ColorKind],["view","projection","textureInfos","alphaTest","vFogInfos","vFogColor"],["diffuseSampler"],s+"#define FOG"),this._drawWrapperFogDepth.effect=this._drawWrapperFog.effect,this._drawWrapperFogDepth.materialContext=this._drawWrapperFog.materialContext)}render(e,t,i,n,s=null){if(!this.texture||!this.texture.isReady()||!e.length)return;let r=this._drawWrapperBase,o=this._drawWrapperDepth,a=!1;this.fogEnabled&&this._scene&&this._scene.fogEnabled&&0!==this._scene.fogMode&&(r=this._drawWrapperFog,o=this._drawWrapperFogDepth,a=!0);const l=r.effect;if(!l.isReady())return;const h=this._engine,c=!(!this._scene||!this._scene.useRightHandedSystem),u=this.texture.getBaseSize(),d=Math.min(this._capacity,e.length);let p=0,f=!0;for(let i=0;i<d;i++){const n=e[i];n&&n.isVisible&&(f=!1,n._animate(t),this._appendSpriteVertex(p++,n,0,0,u,c,s),this._useInstancing||(this._appendSpriteVertex(p++,n,1,0,u,c,s),this._appendSpriteVertex(p++,n,1,1,u,c,s),this._appendSpriteVertex(p++,n,0,1,u,c,s)))}if(f)return;this._buffer.update(this._vertexData);const _=!!h.depthCullingState.cull,m=h.depthCullingState.zOffset,g=h.depthCullingState.zOffsetUnits;if(h.setState(_,m,!1,!1,void 0,void 0,g),h.enableEffect(r),l.setTexture("diffuseSampler",this.texture),l.setMatrix("view",i),l.setMatrix("projection",n),a){const e=this._scene;l.setFloat4("vFogInfos",e.fogMode,e.fogStart,e.fogEnd,e.fogDensity),l.setColor3("vFogColor",e.fogColor)}this._useVAO?(this._vertexArrayObject||(this._vertexArrayObject=h.recordVertexArrayObject(this._vertexBuffers,this._indexBuffer,l)),h.bindVertexArrayObject(this._vertexArrayObject,this._indexBuffer)):h.bindBuffers(this._vertexBuffers,this._indexBuffer,l),h.depthCullingState.depthFunc=h.useReverseDepthBuffer?518:515,this.disableDepthWrite||(l.setBool("alphaTest",!0),h.setColorWrite(!1),h.enableEffect(o),this._useInstancing?h.drawArraysType(7,0,4,p):h.drawElementsType(0,0,p/4*6),h.enableEffect(r),h.setColorWrite(!0),l.setBool("alphaTest",!1)),h.setAlphaMode(this.blendMode),this._useInstancing?h.drawArraysType(7,0,4,p):h.drawElementsType(0,0,p/4*6),this.autoResetAlpha&&h.setAlphaMode(0),c&&this._scene.getEngine().setState(_,m,!1,!0,void 0,void 0,g),h.unbindInstanceAttributes()}_appendSpriteVertex(e,t,i,n,s,r,o){let a=e*this._vertexBufferSize;if(0===i?i=this._epsilon:1===i&&(i=1-this._epsilon),0===n?n=this._epsilon:1===n&&(n=1-this._epsilon),o)o(t,s);else{t.cellIndex||(t.cellIndex=0);const e=s.width/this.cellWidth,i=t.cellIndex/e>>0;t._xOffset=(t.cellIndex-i*e)*this.cellWidth/s.width,t._yOffset=i*this.cellHeight/s.height,t._xSize=this.cellWidth,t._ySize=this.cellHeight}this._vertexData[a]=t.position.x,this._vertexData[a+1]=t.position.y,this._vertexData[a+2]=t.position.z,this._vertexData[a+3]=t.angle,this._vertexData[a+4]=t.width,this._vertexData[a+5]=t.height,this._useInstancing?a-=2:(this._vertexData[a+6]=i,this._vertexData[a+7]=n),this._vertexData[a+8]=r?t.invertU?0:1:t.invertU?1:0,this._vertexData[a+9]=t.invertV?1:0,this._vertexData[a+10]=t._xOffset,this._vertexData[a+11]=t._yOffset,this._vertexData[a+12]=t._xSize/s.width,this._vertexData[a+13]=t._ySize/s.height,this._vertexData[a+14]=t.color.r,this._vertexData[a+15]=t.color.g,this._vertexData[a+16]=t.color.b,this._vertexData[a+17]=t.color.a}_buildIndexBuffer(){const e=[];let t=0;for(let i=0;i<this._capacity;i++)e.push(t),e.push(t+1),e.push(t+2),e.push(t),e.push(t+2),e.push(t+3),t+=4;this._indexBuffer=this._engine.createIndexBuffer(e)}rebuild(){var e;this._indexBuffer&&this._buildIndexBuffer(),this._useVAO&&(this._vertexArrayObject=void 0),this._buffer._rebuild();for(const e in this._vertexBuffers)this._vertexBuffers[e]._rebuild();null===(e=this._spriteBuffer)||void 0===e||e._rebuild()}dispose(){this._buffer&&(this._buffer.dispose(),this._buffer=null),this._spriteBuffer&&(this._spriteBuffer.dispose(),this._spriteBuffer=null),this._indexBuffer&&(this._engine._releaseBuffer(this._indexBuffer),this._indexBuffer=null),this._vertexArrayObject&&(this._engine.releaseVertexArrayObject(this._vertexArrayObject),this._vertexArrayObject=null),this.texture&&(this.texture.dispose(),this.texture=null),this._drawWrapperBase.dispose(),this._drawWrapperFog.dispose(),this._drawWrapperDepth.dispose(),this._drawWrapperFogDepth.dispose()}}class Rg{set onDispose(e){this._onDisposeObserver&&this.onDisposeObservable.remove(this._onDisposeObserver),this._onDisposeObserver=this.onDisposeObservable.add(e)}get children(){return this.sprites}get scene(){return this._scene}get capacity(){return this._spriteRenderer.capacity}get texture(){return this._spriteRenderer.texture}set texture(e){e.wrapU=Ce.x.CLAMP_ADDRESSMODE,e.wrapV=Ce.x.CLAMP_ADDRESSMODE,this._spriteRenderer.texture=e,this._textureContent=null}get cellWidth(){return this._spriteRenderer.cellWidth}set cellWidth(e){this._spriteRenderer.cellWidth=e}get cellHeight(){return this._spriteRenderer.cellHeight}set cellHeight(e){this._spriteRenderer.cellHeight=e}get fogEnabled(){return this._spriteRenderer.fogEnabled}set fogEnabled(e){this._spriteRenderer.fogEnabled=e}get blendMode(){return this._spriteRenderer.blendMode}set blendMode(e){this._spriteRenderer.blendMode=e}get disableDepthWrite(){return this._disableDepthWrite}set disableDepthWrite(e){this._disableDepthWrite=e,this._spriteRenderer.disableDepthWrite=e}get pixelPerfect(){return this._spriteRenderer.pixelPerfect}set pixelPerfect(e){this._spriteRenderer.pixelPerfect=e,e&&3!==this.texture.samplingMode&&this.texture.updateSamplingMode(3)}constructor(e,t,i,n,s,o=.01,a=Ce.x.TRILINEAR_SAMPLINGMODE,l=!1,h=null){this.name=e,this.sprites=new Array,this.renderingGroupId=0,this.layerMask=268435455,this.isPickable=!1,this.metadata=null,this._wasDispatched=!1,this.onDisposeObservable=new r.y$,this._disableDepthWrite=!1,this._packedAndReady=!1,this._customUpdate=(e,t)=>{e.cellRef||(e.cellIndex=0);const i=e.cellIndex;"number"==typeof i&&isFinite(i)&&Math.floor(i)===i&&(e.cellRef=this._spriteMap[e.cellIndex]),e._xOffset=this._cellData[e.cellRef].frame.x/t.width,e._yOffset=this._cellData[e.cellRef].frame.y/t.height,e._xSize=this._cellData[e.cellRef].frame.w,e._ySize=this._cellData[e.cellRef].frame.h},s||(s=A.l.LastCreatedScene),s._getComponent(ve.l.NAME_SPRITE)||s._addComponent(new Ag(s)),this._fromPacked=l,this._scene=s;const c=this._scene.getEngine();if(this._spriteRenderer=new Pg(c,i,o,s),n.width&&n.height)this.cellWidth=n.width,this.cellHeight=n.height;else{if(void 0===n)return void(this._spriteRenderer=null);this.cellWidth=n,this.cellHeight=n}this._scene.spriteManagers&&this._scene.spriteManagers.push(this),this.uniqueId=this.scene.getUniqueId(),t&&(this.texture=new Ce.x(t,s,!0,!1,a)),this._fromPacked&&this._makePacked(t,h)}getClassName(){return"SpriteManager"}_makePacked(e,t){if(null!==t)try{let e;if(e="string"==typeof t?JSON.parse(t):t,e.frames.length){const t={};for(let i=0;i<e.frames.length;i++){const n=e.frames[i];if("string"!=typeof Object.keys(n)[0])throw new Error("Invalid JSON Format.  Check the frame values and make sure the name is the first parameter.");t[n[Object.keys(n)[0]]]=n}e.frames=t}const i=Reflect.ownKeys(e.frames);this._spriteMap=i,this._packedAndReady=!0,this._cellData=e.frames}catch(e){throw this._fromPacked=!1,this._packedAndReady=!1,new Error("Invalid JSON from string. Spritesheet managed with constant cell size.")}else{const t=/\./g;let i;do{i=t.lastIndex,t.test(e)}while(t.lastIndex>0);const n=e.substring(0,i-1)+".json",s=()=>{_.Y.Error("JSON ERROR: Unable to load JSON file."),this._fromPacked=!1,this._packedAndReady=!1},r=e=>{try{const t=JSON.parse(e),i=Reflect.ownKeys(t.frames);this._spriteMap=i,this._packedAndReady=!0,this._cellData=t.frames}catch(e){throw this._fromPacked=!1,this._packedAndReady=!1,new Error("Invalid JSON format. Please check documentation for format specifications.")}};de.w1.LoadFile(n,r,void 0,void 0,!1,s)}}_checkTextureAlpha(e,t,i,n,s){if(!e.useAlphaForPicking||!this.texture)return!0;const r=this.texture.getSize();this._textureContent||(this._textureContent=new Uint8Array(r.width*r.height*4),this.texture.readPixels(0,0,this._textureContent));const a=o.jp.Vector3[0];a.copyFrom(t.direction),a.normalize(),a.scaleInPlace(i),a.addInPlace(t.origin);const l=(a.x-n.x)/(s.x-n.x)-.5,h=1-(a.y-n.y)/(s.y-n.y)-.5,c=e.angle,u=l*Math.cos(c)-h*Math.sin(c)+.5,d=l*Math.sin(c)+h*Math.cos(c)+.5,p=e._xOffset*r.width+u*e._xSize|0,f=e._yOffset*r.height+d*e._ySize|0;return this._textureContent[4*(p+f*r.width)+3]>.5}intersects(e,t,i,n){const s=Math.min(this.capacity,this.sprites.length),r=o.P.Zero(),a=o.P.Zero();let l=Number.MAX_VALUE,h=null;const c=o.jp.Vector3[0],u=o.jp.Vector3[1],d=t.getViewMatrix();let p=e,f=e;for(let t=0;t<s;t++){const s=this.sprites[t];if(s){if(i){if(!i(s))continue}else if(!s.isPickable)continue;if(o.P.TransformCoordinatesToRef(s.position,d,u),s.angle?(o.y3.TranslationToRef(-u.x,-u.y,0,o.jp.Matrix[1]),o.y3.TranslationToRef(u.x,u.y,0,o.jp.Matrix[2]),o.y3.RotationZToRef(s.angle,o.jp.Matrix[3]),o.jp.Matrix[1].multiplyToRef(o.jp.Matrix[3],o.jp.Matrix[4]),o.jp.Matrix[4].multiplyToRef(o.jp.Matrix[2],o.jp.Matrix[0]),p=e.clone(),o.P.TransformCoordinatesToRef(e.origin,o.jp.Matrix[0],p.origin),o.P.TransformNormalToRef(e.direction,o.jp.Matrix[0],p.direction)):p=e,r.copyFromFloats(u.x-s.width/2,u.y-s.height/2,u.z),a.copyFromFloats(u.x+s.width/2,u.y+s.height/2,u.z),p.intersectsBoxMinMax(r,a)){const e=o.P.Distance(u,p.origin);if(l>e){if(!this._checkTextureAlpha(s,p,e,r,a))continue;if(f=p,l=e,h=s,n)break}}}}if(h){const e=new bn.p;d.invertToRef(o.jp.Matrix[0]),e.hit=!0,e.pickedSprite=h,e.distance=l;const t=o.jp.Vector3[2];return t.copyFrom(f.direction),t.normalize(),t.scaleInPlace(l),f.origin.addToRef(t,c),e.pickedPoint=o.P.TransformCoordinates(c,o.jp.Matrix[0]),e}return null}multiIntersects(e,t,i){const n=Math.min(this.capacity,this.sprites.length),s=o.P.Zero(),r=o.P.Zero();let a;const l=[],h=o.jp.Vector3[0].copyFromFloats(0,0,0),c=o.jp.Vector3[1].copyFromFloats(0,0,0),u=t.getViewMatrix();for(let t=0;t<n;t++){const n=this.sprites[t];if(n){if(i){if(!i(n))continue}else if(!n.isPickable)continue;if(o.P.TransformCoordinatesToRef(n.position,u,c),s.copyFromFloats(c.x-n.width/2,c.y-n.height/2,c.z),r.copyFromFloats(c.x+n.width/2,c.y+n.height/2,c.z),e.intersectsBoxMinMax(s,r)){if(a=o.P.Distance(c,e.origin),!this._checkTextureAlpha(n,e,a,s,r))continue;const t=new bn.p;l.push(t),u.invertToRef(o.jp.Matrix[0]),t.hit=!0,t.pickedSprite=n,t.distance=a;const i=o.jp.Vector3[2];i.copyFrom(e.direction),i.normalize(),i.scaleInPlace(a),e.origin.addToRef(i,h),t.pickedPoint=o.P.TransformCoordinates(h,o.jp.Matrix[0])}}}return l}render(){if(this._fromPacked&&(!this._packedAndReady||!this._spriteMap||!this._cellData))return;const e=this._scene.getEngine().getDeltaTime();this._packedAndReady?this._spriteRenderer.render(this.sprites,e,this._scene.getViewMatrix(),this._scene.getProjectionMatrix(),this._customUpdate):this._spriteRenderer.render(this.sprites,e,this._scene.getViewMatrix(),this._scene.getProjectionMatrix())}rebuild(){var e;null===(e=this._spriteRenderer)||void 0===e||e.rebuild()}dispose(){if(this._spriteRenderer&&(this._spriteRenderer.dispose(),this._spriteRenderer=null),this._textureContent=null,this._scene.spriteManagers){const e=this._scene.spriteManagers.indexOf(this);this._scene.spriteManagers.splice(e,1)}this.onDisposeObservable.notifyObservers(this),this.onDisposeObservable.clear(),this.metadata=null}serialize(e=!1){const t={};t.name=this.name,t.capacity=this.capacity,t.cellWidth=this.cellWidth,t.cellHeight=this.cellHeight,t.fogEnabled=this.fogEnabled,t.blendMode=this.blendMode,t.disableDepthWrite=this.disableDepthWrite,t.pixelPerfect=this.pixelPerfect,this.texture&&(e?t.texture=this.texture.serialize():(t.textureUrl=this.texture.name,t.invertY=this.texture._invertY)),t.sprites=[];for(const e of this.sprites)t.sprites.push(e.serialize());return t.metadata=this.metadata,t}static Parse(e,t,i){const n=new Rg(e.name,"",e.capacity,{width:e.cellWidth,height:e.cellHeight},t);void 0!==e.fogEnabled&&(n.fogEnabled=e.fogEnabled),void 0!==e.blendMode&&(n.blendMode=e.blendMode),void 0!==e.disableDepthWrite&&(n.disableDepthWrite=e.disableDepthWrite),void 0!==e.pixelPerfect&&(n.pixelPerfect=e.pixelPerfect),void 0!==e.metadata&&(n.metadata=e.metadata),e.texture?n.texture=Ce.x.Parse(e.texture,t,i):e.textureName&&(n.texture=new Ce.x(i+e.textureUrl,t,!1,void 0===e.invertY||e.invertY));for(const t of e.sprites)Cg.Parse(t,n);return n}static ParseFromFileAsync(e,t,i,n=""){return new Promise(((s,r)=>{const o=new Kc.g;o.addEventListener("readystatechange",(()=>{if(4==o.readyState)if(200==o.status){const t=JSON.parse(o.responseText),r=Rg.Parse(t,i||A.l.LastCreatedScene,n);e&&(r.name=e),s(r)}else r("Unable to load the sprite manager")})),o.open("GET",t),o.send()}))}static ParseFromSnippetAsync(e,t,i=""){return"_BLANK"===e?Promise.resolve(new Rg("Default sprite manager","//playground.babylonjs.com/textures/player.png",500,64,t)):new Promise(((n,s)=>{const r=new Kc.g;r.addEventListener("readystatechange",(()=>{if(4==r.readyState)if(200==r.status){const s=JSON.parse(JSON.parse(r.responseText).jsonPayload),o=JSON.parse(s.spriteManager),a=Rg.Parse(o,t||A.l.LastCreatedScene,i);a.snippetId=e,n(a)}else s("Unable to load the snippet "+e)})),r.open("GET",this.SnippetUrl+"/"+e.replace(/#/g,"/")),r.send()}))}}Rg.SnippetUrl="https://snippet.babylonjs.com",Rg.CreateFromSnippetAsync=Rg.ParseFromSnippetAsync;si.v.ShadersStore.spriteMapPixelShader="#if defined(WEBGL2) || defined(WEBGPU) || defined(NATIVE)\n#define TEXTUREFUNC(s,c,l) texture2DLodEXT(s,c,l)\n#else\n#define TEXTUREFUNC(s,c,b) texture2D(s,c,b)\n#endif\nprecision highp float;\nvarying vec3 vPosition;\nvarying vec2 vUV;\nvarying vec2 tUV;\nuniform float time;\nuniform float spriteCount;\nuniform sampler2D spriteSheet;\nuniform vec2 spriteMapSize;\nuniform vec2 outputSize;\nuniform vec2 stageSize;\nuniform sampler2D frameMap;\nuniform sampler2D tileMaps[LAYERS];\nuniform sampler2D animationMap;\nuniform vec3 colorMul;\nfloat mt;\nconst float fdStep=1./4.;\nconst float aFrameSteps=1./MAX_ANIMATION_FRAMES;\nmat4 getFrameData(float frameID){\nfloat fX=frameID/spriteCount;\nreturn mat4(\ntexture2D(frameMap,vec2(fX,0.),0.),\ntexture2D(frameMap,vec2(fX,fdStep*1.),0.),\ntexture2D(frameMap,vec2(fX,fdStep*2.),0.),\nvec4(0.)\n);\n}\nvoid main(){\nvec4 color=vec4(0.);\nvec2 tileUV=fract(tUV);\n#ifdef FLIPU\ntileUV.y=1.0-tileUV.y;\n#endif\nvec2 tileID=floor(tUV);\nvec2 sheetUnits=1./spriteMapSize;\nfloat spriteUnits=1./spriteCount;\nvec2 stageUnits=1./stageSize;\nfor(int i=0; i<LAYERS; i++) {\nfloat frameID;\n#define LAYER_ID_SWITCH\nvec4 animationData=TEXTUREFUNC(animationMap,vec2((frameID+0.5)/spriteCount,0.),0.);\nif(animationData.y>0.) {\nmt=mod(time*animationData.z,1.0);\nfor(float f=0.; f<MAX_ANIMATION_FRAMES; f++){\nif(animationData.y>mt){\nframeID=animationData.x;\nbreak;\n}\nanimationData=TEXTUREFUNC(animationMap,vec2((frameID+0.5)/spriteCount,aFrameSteps*f),0.);\n}\n}\nmat4 frameData=getFrameData(frameID+0.5);\nvec2 frameSize=(frameData[0].zw)/spriteMapSize;\nvec2 offset=frameData[0].xy*sheetUnits;\nvec2 ratio=frameData[2].xy/frameData[0].zw;\nif (frameData[2].z==1.){\ntileUV.xy=tileUV.yx;\n}\nvec4 nc=texture2D(spriteSheet,tileUV*frameSize+offset);\nif (i==0){\ncolor=nc;\n} else {\nfloat alpha=min(color.a+nc.a,1.0);\nvec3 mixed=mix(color.xyz,nc.xyz,nc.a);\ncolor=vec4(mixed,alpha);\n}\n}\ncolor.xyz*=colorMul;\ngl_FragColor=color;\n}";si.v.ShadersStore.spriteMapVertexShader="precision highp float;\nattribute vec3 position;\nattribute vec3 normal;\nattribute vec2 uv;\nvarying vec3 vPosition;\nvarying vec2 vUV;\nvarying vec2 tUV;\nvarying vec2 stageUnits;\nvarying vec2 levelUnits;\nvarying vec2 tileID;\nuniform float time;\nuniform mat4 worldViewProjection;\nuniform vec2 outputSize;\nuniform vec2 stageSize;\nuniform vec2 spriteMapSize;\nuniform float stageScale;\nvoid main() {\nvec4 p=vec4( position,1. );\nvPosition=p.xyz;\nvUV=uv;\ntUV=uv*stageSize; \ngl_Position=worldViewProjection*p;\n}";class Mg{get spriteCount(){return this.sprites.length}get position(){return this._output.position}set position(e){this._output.position=e}get rotation(){return this._output.rotation}set rotation(e){this._output.rotation=e}get animationMap(){return this._animationMap}set animationMap(e){const t=e._texture._bufferView,i=this._createTileAnimationBuffer(t);this._animationMap.dispose(),this._animationMap=i,this._material.setTexture("animationMap",this._animationMap)}constructor(e,t,i,n,s){this.name=e,this.sprites=[],this.atlasJSON=t,this.sprites=this.atlasJSON.frames,this.spriteSheet=i,this.options=n,n.stageSize=n.stageSize||new o.FM(1,1),n.outputSize=n.outputSize||n.stageSize,n.outputPosition=n.outputPosition||o.P.Zero(),n.outputRotation=n.outputRotation||o.P.Zero(),n.layerCount=n.layerCount||1,n.maxAnimationFrames=n.maxAnimationFrames||0,n.baseTile=n.baseTile||0,n.flipU=n.flipU||!1,n.colorMultiply=n.colorMultiply||new o.P(1,1,1),this._scene=s,this._frameMap=this._createFrameBuffer(),this._tileMaps=new Array;for(let e=0;e<n.layerCount;e++)this._tileMaps.push(this._createTileBuffer(null,e));this._animationMap=this._createTileAnimationBuffer(null);const r=[];r.push("#define LAYERS "+n.layerCount),n.flipU&&r.push("#define FLIPU"),r.push(`#define MAX_ANIMATION_FRAMES ${n.maxAnimationFrames}.0`);const a=ds.Q.ShadersStore.spriteMapPixelShader;let l;if(s.getEngine()._features.supportSwitchCaseInShader){l="switch(i) {";for(let e=0;e<n.layerCount;e++)l+="case "+e+" : frameID = texture(tileMaps["+e+"], (tileID + 0.5) / stageSize, 0.).x;",l+="break;";l+="}"}else{l="";for(let e=0;e<n.layerCount;e++)l+=`if (${e} == i) { frameID = texture2D(tileMaps[${e}], (tileID + 0.5) / stageSize, 0.).x; }`}ds.Q.ShadersStore["spriteMap"+this.name+"PixelShader"]=a.replace("#define LAYER_ID_SWITCH",l),this._material=new us.j("spriteMap:"+this.name,this._scene,{vertex:"spriteMap",fragment:"spriteMap"+this.name},{defines:r,attributes:["position","normal","uv"],uniforms:["worldViewProjection","time","stageSize","outputSize","spriteMapSize","spriteCount","time","colorMul","mousePosition","curTile","flipU"],samplers:["spriteSheet","frameMap","tileMaps","animationMap"],needAlphaBlending:!0}),this._time=0,this._material.setFloat("spriteCount",this.spriteCount),this._material.setVector2("stageSize",n.stageSize),this._material.setVector2("outputSize",n.outputSize),this._material.setTexture("spriteSheet",this.spriteSheet),this._material.setVector2("spriteMapSize",new o.FM(1,1)),this._material.setVector3("colorMul",n.colorMultiply);let h=0;const c=()=>{this.spriteSheet&&this.spriteSheet.isReady()&&this.spriteSheet._texture?this._material.setVector2("spriteMapSize",new o.FM(this.spriteSheet._texture.baseWidth||1,this.spriteSheet._texture.baseHeight||1)):h<100&&setTimeout((()=>{h++,c()}),100)};c(),this._material.setVector3("colorMul",n.colorMultiply),this._material.setTexture("frameMap",this._frameMap),this._material.setTextureArray("tileMaps",this._tileMaps),this._material.setTexture("animationMap",this._animationMap),this._material.setFloat("time",this._time),this._output=(0,pa.pT)(e+":output",{size:1,updatable:!0},s),this._output.scaling.x=n.outputSize.x,this._output.scaling.y=n.outputSize.y,this.position=n.outputPosition,this.rotation=n.outputRotation,this._scene.onBeforeRenderObservable.add((()=>{this._time+=this._scene.getEngine().getDeltaTime(),this._material.setFloat("time",this._time)})),this._output.material=this._material}getTileID(){const e=this.getMousePosition();return e.multiplyInPlace(this.options.stageSize||o.FM.Zero()),e.x=Math.floor(e.x),e.y=Math.floor(e.y),e}getMousePosition(){const e=this._output,t=this._scene.pick(this._scene.pointerX,this._scene.pointerY,(t=>t===e));if(!t||!t.hit||!t.getTextureCoordinates)return new o.FM(-1,-1);return t.getTextureCoordinates()||new o.FM(-1,-1)}_createFrameBuffer(){const e=new Array;for(let t=0;t<this.spriteCount;t++)e.push(0,0,0,0),e.push(0,0,0,0),e.push(0,0,0,0),e.push(0,0,0,0);for(let t=0;t<this.spriteCount;t++){const i=this.sprites[t].frame,n=this.sprites[t].spriteSourceSize,s=this.sprites[t].sourceSize,r=this.sprites[t].rotated?1:0,o=this.sprites[t].trimmed?1:0;e[4*t]=i.x,e[4*t+1]=i.y,e[4*t+2]=i.w,e[4*t+3]=i.h,e[4*t+4*this.spriteCount]=n.x,e[4*t+1+4*this.spriteCount]=n.y,e[4*t+3+4*this.spriteCount]=n.h,e[4*t+8*this.spriteCount]=s.w,e[4*t+1+8*this.spriteCount]=s.h,e[4*t+2+8*this.spriteCount]=r,e[4*t+3+8*this.spriteCount]=o}const t=new Float32Array(e);return Ee.l.CreateRGBATexture(t,this.spriteCount,4,this._scene,!1,!1,Ce.x.NEAREST_NEAREST,ue.D.TEXTURETYPE_FLOAT)}_createTileBuffer(e,t=0){let i=new Array;const n=this.options.stageSize.y||0,s=this.options.stageSize.x||0;if(e)i=e;else{let e=this.options.baseTile;0!=t&&(e=0);for(let t=0;t<n;t++)for(let t=0;t<4*s;t+=4)i.push(e,0,0,0)}const r=new Float32Array(i);return Ee.l.CreateRGBATexture(r,s,n,this._scene,!1,!1,Ce.x.NEAREST_NEAREST,ue.D.TEXTURETYPE_FLOAT)}changeTiles(e=0,t,i=0){const n=this._tileMaps[e]._texture._bufferView;if(null===n)return;let s=new Array;t instanceof o.FM?s.push(t):s=t;const r=this.options.stageSize.x||0;for(let e=0;e<s.length;e++){const t=s[e];t.x=Math.floor(t.x),t.y=Math.floor(t.y),n[4*t.x+t.y*(4*r)]=i}const a=this._createTileBuffer(n);this._tileMaps[e].dispose(),this._tileMaps[e]=a,this._material.setTextureArray("tileMap",this._tileMaps)}_createTileAnimationBuffer(e){const t=new Array;let i;if(e)i=e;else{for(let e=0;e<this.spriteCount;e++){t.push(0,0,0,0);let e=1;for(;e<(this.options.maxAnimationFrames||4);)t.push(0,0,0,0),e++}i=new Float32Array(t)}return Ee.l.CreateRGBATexture(i,this.spriteCount,this.options.maxAnimationFrames||4,this._scene,!1,!1,Ce.x.NEAREST_NEAREST,ue.D.TEXTURETYPE_FLOAT)}addAnimationToTile(e=0,t=0,i=0,n=0,s=1){const r=this._animationMap._texture._bufferView,o=4*e+4*this.spriteCount*t;if(!r)return;r[o]=i,r[o+1]=n,r[o+2]=s;const a=this._createTileAnimationBuffer(r);this._animationMap.dispose(),this._animationMap=a,this._material.setTexture("animationMap",this._animationMap)}saveTileMaps(){let e="";for(let t=0;t<this._tileMaps.length;t++)t>0&&(e+="\n\r"),e+=this._tileMaps[t]._texture._bufferView.toString();const t=document.createElement("a");t.href="data:octet/stream;charset=utf-8,"+encodeURI(e),t.target="_blank",t.download=this.name+".tilemaps",t.click(),t.remove()}loadTileMaps(e){const t=new XMLHttpRequest;t.open("GET",e);const i=this.options.layerCount||0;t.onload=()=>{const e=t.response.split("\n\r");for(let t=0;t<i;t++){const i=e[t].split(",").map(Number),n=this._createTileBuffer(i);this._tileMaps[t].dispose(),this._tileMaps[t]=n}this._material.setTextureArray("tileMap",this._tileMaps)},t.send()}dispose(){this._output.dispose(),this._material.dispose(),this._animationMap.dispose(),this._tileMaps.forEach((e=>{e.dispose()})),this._frameMap.dispose()}}class Ig extends Rg{constructor(e,t,i,n,s=null,r=.01,o=Ce.x.TRILINEAR_SAMPLINGMODE){super(e,t,i,64,n,r,o,!0,s),this.name=e}}var Dg,Og=i(4710),wg=i(8657),Ng=i(5559);!function(e){e[e.INIT=0]="INIT",e[e.RUNNING=1]="RUNNING",e[e.DONE=2]="DONE",e[e.ERROR=3]="ERROR"}(Dg||(Dg={}));class Fg{constructor(e){this.name=e,this._isCompleted=!1,this._taskState=Dg.INIT}get isCompleted(){return this._isCompleted}get taskState(){return this._taskState}get errorObject(){return this._errorObject}_setErrorObject(e,t){this._errorObject||(this._errorObject={message:e,exception:t})}run(e,t,i){this._taskState=Dg.RUNNING,this.runTask(e,(()=>{this._onDoneCallback(t,i)}),((e,t)=>{this._onErrorCallback(i,e,t)}))}runTask(e,t,i){throw new Error("runTask is not implemented")}reset(){this._taskState=Dg.INIT}_onErrorCallback(e,t,i){this._taskState=Dg.ERROR,this._errorObject={message:t,exception:i},this.onError&&this.onError(this,t,i),e()}_onDoneCallback(e,t){try{this._taskState=Dg.DONE,this._isCompleted=!0,this.onSuccess&&this.onSuccess(this),e()}catch(e){this._onErrorCallback(t,"Task is done, error executing success callback(s)",e)}}}class Lg{constructor(e,t,i){this.remainingCount=e,this.totalCount=t,this.task=i}}class Bg extends Fg{constructor(e,t,i,n,s){super(e),this.name=e,this.meshesNames=t,this.rootUrl=i,this.sceneFilename=n,this.extension=s}runTask(e,t,i){ta.n.LoadAssetContainer(this.rootUrl,this.sceneFilename,e,(e=>{this.loadedContainer=e,this.loadedMeshes=e.meshes,this.loadedTransformNodes=e.transformNodes,this.loadedParticleSystems=e.particleSystems,this.loadedSkeletons=e.skeletons,this.loadedAnimationGroups=e.animationGroups,t()}),null,((e,t,n)=>{i(t,n)}),this.extension)}}class Ug extends Fg{constructor(e,t,i,n,s){super(e),this.name=e,this.meshesNames=t,this.rootUrl=i,this.sceneFilename=n,this.extension=s}runTask(e,t,i){ta.n.ImportMesh(this.meshesNames,this.rootUrl,this.sceneFilename,e,((e,i,n,s,r)=>{this.loadedMeshes=e,this.loadedTransformNodes=r,this.loadedParticleSystems=i,this.loadedSkeletons=n,this.loadedAnimationGroups=s,t()}),null,((e,t,n)=>{i(t,n)}),this.extension)}}class Vg extends Fg{constructor(e,t){super(e),this.name=e,this.url=t}runTask(e,t,i){e._loadFile(this.url,(e=>{this.text=e,t()}),void 0,!1,!1,((e,t)=>{e&&i(e.status+" "+e.statusText,t)}))}}class kg extends Fg{constructor(e,t){super(e),this.name=e,this.url=t}runTask(e,t,i){e._loadFile(this.url,(e=>{this.data=e,t()}),void 0,!0,!0,((e,t)=>{e&&i(e.status+" "+e.statusText,t)}))}}class Gg extends Fg{constructor(e,t){super(e),this.name=e,this.url=t}runTask(e,t,i){const n=new Image;de.w1.SetCorsBehavior(this.url,n),n.onload=()=>{this.image=n,t()},n.onerror=e=>{i("Error loading image",e)},n.src=this.url}}class zg extends Fg{constructor(e,t,i,n=!0,s=Ce.x.TRILINEAR_SAMPLINGMODE){super(e),this.name=e,this.url=t,this.noMipmap=i,this.invertY=n,this.samplingMode=s}runTask(e,t,i){this.texture=new Ce.x(this.url,e,this.noMipmap,this.invertY,this.samplingMode,(()=>{t()}),((e,t)=>{i(e,t)}))}}class Wg extends Fg{constructor(e,t,i,n,s,r){super(e),this.name=e,this.url=t,this.extensions=i,this.noMipmap=n,this.files=s,this.prefiltered=r}runTask(e,t,i){this.texture=new Fa.B(this.url,e,this.extensions,this.noMipmap,this.files,(()=>{t()}),((e,t)=>{i(e,t)}),void 0,this.prefiltered)}}class Hg extends Fg{constructor(e,t,i,n=!1,s=!0,r=!1,o=!1){super(e),this.name=e,this.url=t,this.size=i,this.noMipmap=n,this.generateHarmonics=s,this.gammaSpace=r,this.reserved=o}runTask(e,t,i){this.texture=new Oh(this.url,e,this.size,this.noMipmap,this.generateHarmonics,this.gammaSpace,this.reserved,(()=>{t()}),((e,t)=>{i(e,t)}))}}class Xg extends Fg{constructor(e,t,i,n=!1,s=!0){super(e),this.name=e,this.url=t,this.size=i,this.noMipmap=n,this.gammaSpace=s}runTask(e,t,i){this.texture=new pc(this.url,e,this.size,this.noMipmap,this.gammaSpace,(()=>{t()}),((e,t)=>{i(e,t)}))}}class jg{constructor(e){this._isLoading=!1,this._tasks=new Array,this._waitingTasksCount=0,this._totalTasksCount=0,this.onTaskSuccessObservable=new r.y$,this.onTaskErrorObservable=new r.y$,this.onTasksDoneObservable=new r.y$,this.onProgressObservable=new r.y$,this.useDefaultLoadingScreen=!0,this.autoHideLoadingUI=!0,this._scene=e||A.l.LastCreatedScene}addContainerTask(e,t,i,n,s){const r=new Bg(e,t,i,n,s);return this._tasks.push(r),r}addMeshTask(e,t,i,n,s){const r=new Ug(e,t,i,n,s);return this._tasks.push(r),r}addTextFileTask(e,t){const i=new Vg(e,t);return this._tasks.push(i),i}addBinaryFileTask(e,t){const i=new kg(e,t);return this._tasks.push(i),i}addImageTask(e,t){const i=new Gg(e,t);return this._tasks.push(i),i}addTextureTask(e,t,i,n,s=Ce.x.TRILINEAR_SAMPLINGMODE){const r=new zg(e,t,i,n,s);return this._tasks.push(r),r}addCubeTextureTask(e,t,i,n,s,r){const o=new Wg(e,t,i,n,s,r);return this._tasks.push(o),o}addHDRCubeTextureTask(e,t,i,n=!1,s=!0,r=!1,o=!1){const a=new Hg(e,t,i,n,s,r,o);return this._tasks.push(a),a}addEquiRectangularCubeTextureAssetTask(e,t,i,n=!1,s=!0){const r=new Xg(e,t,i,n,s);return this._tasks.push(r),r}removeTask(e){const t=this._tasks.indexOf(e);t>-1&&this._tasks.splice(t,1)}_decreaseWaitingTasksCount(e){this._waitingTasksCount--;try{this.onProgress&&this.onProgress(this._waitingTasksCount,this._totalTasksCount,e),this.onProgressObservable.notifyObservers(new Lg(this._waitingTasksCount,this._totalTasksCount,e))}catch(e){_.Y.Error("Error running progress callbacks."),console.log(e)}if(0===this._waitingTasksCount){try{const e=this._tasks.slice();this.onFinish&&this.onFinish(e);for(const t of e)if(t.taskState===Dg.DONE){const e=this._tasks.indexOf(t);e>-1&&this._tasks.splice(e,1)}this.onTasksDoneObservable.notifyObservers(this._tasks)}catch(e){_.Y.Error("Error running tasks-done callbacks."),console.log(e)}this._isLoading=!1,this.autoHideLoadingUI&&this._scene.getEngine().hideLoadingUI()}}_runTask(e){const t=(t,i)=>{e._setErrorObject(t,i),this.onTaskError?this.onTaskError(e):e.onError||_.Y.Error(this._formatTaskErrorMessage(e)),this.onTaskErrorObservable.notifyObservers(e),this._decreaseWaitingTasksCount(e)};e.run(this._scene,(()=>{try{this.onTaskSuccess&&this.onTaskSuccess(e),this.onTaskSuccessObservable.notifyObservers(e),this._decreaseWaitingTasksCount(e)}catch(e){t("Error executing task success callbacks",e)}}),t)}_formatTaskErrorMessage(e){let t="Unable to complete task "+e.name;return e.errorObject.message&&(t+=`: ${e.errorObject.message}`),e.errorObject.exception&&(t+=`: ${e.errorObject.exception}`),t}reset(){return this._isLoading=!1,this._tasks=new Array,this}load(){if(this._isLoading)return this;if(this._isLoading=!0,this._waitingTasksCount=this._tasks.length,this._totalTasksCount=this._tasks.length,0===this._waitingTasksCount)return this._isLoading=!1,this.onFinish&&this.onFinish(this._tasks),this.onTasksDoneObservable.notifyObservers(this._tasks),this;this.useDefaultLoadingScreen&&this._scene.getEngine().displayLoadingUI();for(let e=0;e<this._tasks.length;e++){const t=this._tasks[e];t.taskState===Dg.INIT&&this._runTask(t)}return this}loadAsync(){return new Promise(((e,t)=>{this._isLoading?e():(this.onTasksDoneObservable.addOnce((i=>{i&&i.length?t(i):e()})),this.load())}))}}var Yg=i(7188);class qg{constructor(e,t){this._meshesOrigins=[],this._toCenterVectors=[],this._scaledDirection=new o.P(1,1,1),this._newPosition=o.P.Zero(),this._centerPosition=o.P.Zero(),this._meshes=e.slice(),t?this._centerMesh=t:this._setCenterMesh(),this._centerMesh.computeWorldMatrix(!0);const i=this._meshes.indexOf(this._centerMesh);i>=0&&this._meshes.splice(i,1),this._centerPosition=this._centerMesh.getAbsolutePosition().clone();for(let e=0;e<this._meshes.length;e++)if(this._meshes[e]){const t=this._meshes[e];this._meshesOrigins[e]=t.getAbsolutePosition().clone(),this._toCenterVectors[e]=o.P.Zero(),t.hasBoundingInfo&&this._centerMesh.hasBoundingInfo&&(t.computeWorldMatrix(!0),t.getBoundingInfo().boundingBox.centerWorld.subtractToRef(this._centerMesh.getBoundingInfo().boundingBox.centerWorld,this._toCenterVectors[e]))}}_setCenterMesh(){let e=o.P.Zero();const t=o.P.Zero();let i=Number.MAX_VALUE;for(let e=0;e<this._meshes.length;e++)if(this._meshes[e]){const i=this._meshes[e].getBoundingInfo();i&&t.addInPlace(i.boundingBox.centerWorld)}e=t.scale(1/this._meshes.length);for(let t=0;t<this._meshes.length;t++)if(this._meshes[t]){const n=this._meshes[t],s=n.getBoundingInfo();if(s){const t=s.boundingBox.centerWorld.subtract(e).lengthSquared();t<i&&(this._centerMesh=n,i=t)}}}getClassName(){return"MeshExploder"}getMeshes(){const e=this._meshes.slice();return e.unshift(this._centerMesh),e}explode(e=1){for(let t=0;t<this._meshes.length;t++)this._meshes[t]&&this._meshesOrigins[t]&&this._toCenterVectors[t]&&(this._toCenterVectors[t].scaleToRef(e,this._scaledDirection),this._meshesOrigins[t].addToRef(this._scaledDirection,this._newPosition),this._meshes[t].setAbsolutePosition(this._newPosition));this._centerMesh.setAbsolutePosition(this._centerPosition)}}var Kg=i(679);class $g{static get FilesToLoad(){return Kg.X.FilesToLoad}constructor(e,t,i,n,s,r,o,a,l,h=!1){this.useAppend=h,this.onProcessFileCallback=()=>!0,this.displyLoadingUI=!0,this.loadAsync=(e,t)=>this.useAppend?ta.n.AppendAsync("file:",e,this._currentScene,t):ta.n.LoadAsync("file:",e,this._engine,t),this._engine=e,this._currentScene=t,this._sceneLoadedCallback=i,this._progressCallback=n,this._additionalRenderLoopLogicCallback=s,this._textureLoadingCallback=r,this._startingProcessingFilesCallback=o,this._onReloadCallback=a,this._errorCallback=l}monitorElementForDragNDrop(e){e&&(this._elementToMonitor=e,this._dragEnterHandler=e=>{this._drag(e)},this._dragOverHandler=e=>{this._drag(e)},this._dropHandler=e=>{this._drop(e)},this._elementToMonitor.addEventListener("dragenter",this._dragEnterHandler,!1),this._elementToMonitor.addEventListener("dragover",this._dragOverHandler,!1),this._elementToMonitor.addEventListener("drop",this._dropHandler,!1))}get filesToLoad(){return this._filesToLoad}dispose(){this._elementToMonitor&&(this._elementToMonitor.removeEventListener("dragenter",this._dragEnterHandler),this._elementToMonitor.removeEventListener("dragover",this._dragOverHandler),this._elementToMonitor.removeEventListener("drop",this._dropHandler))}_renderFunction(){if(this._additionalRenderLoopLogicCallback&&this._additionalRenderLoopLogicCallback(),this._currentScene){if(this._textureLoadingCallback){const e=this._currentScene.getWaitingItemsCount();e>0&&this._textureLoadingCallback(e)}this._currentScene.render()}}_drag(e){e.stopPropagation(),e.preventDefault()}_drop(e){e.stopPropagation(),e.preventDefault(),this.loadFiles(e)}_traverseFolder(e,t,i,n){const s=e.createReader(),r=e.fullPath.replace(/^\//,"").replace(/(.+?)\/?$/,"$1/");s.readEntries((e=>{i.count+=e.length;for(const s of e)s.isFile?s.file((e=>{e.correctName=r+e.name,t.push(e),0==--i.count&&n()})):s.isDirectory&&this._traverseFolder(s,t,i,n);0==--i.count&&n()}))}_processFiles(e){for(let t=0;t<e.length;t++){const i=e[t].correctName.toLowerCase(),n=i.split(".").pop();this.onProcessFileCallback(e[t],i,n,(e=>this._sceneFileToLoad=e))&&(ta.n.IsPluginForExtensionAvailable("."+n)&&(this._sceneFileToLoad=e[t]),$g.FilesToLoad[i]=e[t])}}loadFiles(e){if(e&&e.dataTransfer&&e.dataTransfer.files&&(this._filesToLoad=e.dataTransfer.files),e&&e.target&&e.target.files&&(this._filesToLoad=e.target.files),this._filesToLoad&&0!==this._filesToLoad.length&&(this._startingProcessingFilesCallback&&this._startingProcessingFilesCallback(this._filesToLoad),this._filesToLoad&&this._filesToLoad.length>0)){const t=new Array,i=[],n=e.dataTransfer?e.dataTransfer.items:null;for(let e=0;e<this._filesToLoad.length;e++){const s=this._filesToLoad[e],r=s.name.toLowerCase();let o;if(s.correctName=r,n){const t=n[e];t.getAsEntry?o=t.getAsEntry():t.webkitGetAsEntry&&(o=t.webkitGetAsEntry())}o&&o.isDirectory?i.push(o):t.push(s)}if(0===i.length)this._processFiles(t),this._processReload();else{const e={count:i.length};for(const n of i)this._traverseFolder(n,t,e,(()=>{this._processFiles(t),0===e.count&&this._processReload()}))}}}_processReload(){this._onReloadCallback?this._onReloadCallback(this._sceneFileToLoad):this.reload()}reload(){this._sceneFileToLoad?(this.useAppend||this._currentScene&&(_.Y.errorsCount>0&&_.Y.ClearLogCache(),this._engine.stopRenderLoop()),ta.n.ShowLoadingScreen=!1,this.displyLoadingUI&&this._engine.displayLoadingUI(),this.loadAsync(this._sceneFileToLoad,this._progressCallback).then((e=>{this.useAppend?this.displyLoadingUI&&this._engine.hideLoadingUI():(this._currentScene&&this._currentScene.dispose(),this._currentScene=e,this._currentScene.executeWhenReady((()=>{this.displyLoadingUI&&this._engine.hideLoadingUI(),this._engine.runRenderLoop((()=>{this._renderFunction()}))}))),this._sceneLoadedCallback&&this._currentScene&&this._sceneLoadedCallback(this._sceneFileToLoad,this._currentScene)})).catch((e=>{this.displyLoadingUI&&this._engine.hideLoadingUI(),this._errorCallback&&this._errorCallback(this._sceneFileToLoad,this._currentScene,e.message)}))):_.Y.Error("Please provide a valid .babylon file.")}}class Qg{dispose(){if(this._observers&&this._observables)for(let e=0;e<this._observers.length;e++)this._observables[e].remove(this._observers[e]);this._observers=null,this._observables=null}static Watch(e,t,i=-1,n=null){const s=new Qg;s._observers=new Array,s._observables=e;for(const r of e){const e=r.add(t,i,!1,n);e&&s._observers.push(e)}return s}}r.y$.prototype.notifyObserversWithPromise=async function(e,t=-1,i,n,s){let r=Promise.resolve(e);if(!this.observers.length)return r;const o=this._eventState;return o.mask=t,o.target=i,o.currentTarget=n,o.skipNextObservers=!1,o.userInfo=s,this.observers.forEach((i=>{o.skipNextObservers||i._willBeUnregistered||i.mask&t&&(r=i.scope?r.then((t=>(o.lastReturnValue=t,i.callback.apply(i.scope,[e,o])))):r.then((t=>(o.lastReturnValue=t,i.callback(e,o)))),i.unregisterOnNextCall&&this._deferUnregister(i))})),await r,e};var Zg=i(4757);class Jg{getDescription(){return""}apply(e,t){return!0}constructor(e=0){this.priority=e}}class ev extends Jg{getDescription(){return"Reducing render target texture size to "+this.maximumSize}constructor(e=0,t=1024,i=.5){super(e),this.priority=e,this.maximumSize=t,this.step=i}apply(e,t){let i=!0;for(let t=0;t<e.textures.length;t++){const n=e.textures[t];if(!n.canRescale||n.getContext)continue;const s=n.getSize();Math.max(s.width,s.height)>this.maximumSize&&(n.scale(this.step),i=!1)}return i}}class tv extends Jg{getDescription(){return"Setting hardware scaling level to "+this._currentScale}constructor(e=0,t=2,i=.25){super(e),this.priority=e,this.maximumScale=t,this.step=i,this._currentScale=-1,this._directionOffset=1}apply(e,t){return-1===this._currentScale&&(this._currentScale=e.getEngine().getHardwareScalingLevel(),this._currentScale>this.maximumScale&&(this._directionOffset=-1)),this._currentScale+=this._directionOffset*this.step,e.getEngine().setHardwareScalingLevel(this._currentScale),1===this._directionOffset?this._currentScale>=this.maximumScale:this._currentScale<=this.maximumScale}}class iv extends Jg{getDescription(){return"Turning shadows on/off"}apply(e,t){return e.shadowsEnabled=t.isInImprovementMode,!0}}class nv extends Jg{getDescription(){return"Turning post-processes on/off"}apply(e,t){return e.postProcessesEnabled=t.isInImprovementMode,!0}}class sv extends Jg{getDescription(){return"Turning lens flares on/off"}apply(e,t){return e.lensFlaresEnabled=t.isInImprovementMode,!0}}class rv extends Jg{getDescription(){return this.onGetDescription?this.onGetDescription():"Running user defined callback"}apply(e,t){return!this.onApply||this.onApply(e,t)}}class ov extends Jg{getDescription(){return"Turning particles on/off"}apply(e,t){return e.particlesEnabled=t.isInImprovementMode,!0}}class av extends Jg{getDescription(){return"Turning render targets off"}apply(e,t){return e.renderTargetsEnabled=t.isInImprovementMode,!0}}class lv extends Jg{constructor(){super(...arguments),this._canBeMerged=e=>{if(!(e instanceof Nt.Kj))return!1;const t=e;return!(t.isDisposed()||!t.isVisible||!t.isEnabled()||t.instances.length>0||t.skeleton||t.hasLODLevels||0===t.getTotalVertices())}}static get UpdateSelectionTree(){return lv._UpdateSelectionTree}static set UpdateSelectionTree(e){lv._UpdateSelectionTree=e}getDescription(){return"Merging similar meshes together"}apply(e,t,i){const n=e.meshes.slice(0);let s=n.length;for(let e=0;e<s;e++){const t=new Array,i=n[e];if(this._canBeMerged(i)){t.push(i);for(let r=e+1;r<s;r++){const e=n[r];this._canBeMerged(e)&&e.material===i.material&&e.checkCollisions===i.checkCollisions&&(t.push(e),s--,n.splice(r,1),r--)}t.length<2||Nt.Kj.MergeMeshes(t,void 0,!0)}}const r=e;return r.createOrUpdateSelectionOctree&&(null!=i?i&&r.createOrUpdateSelectionOctree():lv.UpdateSelectionTree&&r.createOrUpdateSelectionOctree()),!0}}lv._UpdateSelectionTree=!1;class hv{constructor(e=60,t=2e3){this.targetFrameRate=e,this.trackerDuration=t,this.optimizations=new Array}addOptimization(e){return this.optimizations.push(e),this}addCustomOptimization(e,t,i=0){const n=new rv(i);return n.onApply=e,n.onGetDescription=t,this.optimizations.push(n),this}static LowDegradationAllowed(e){const t=new hv(e);let i=0;return t.addOptimization(new lv(i)),t.addOptimization(new iv(i)),t.addOptimization(new sv(i)),i++,t.addOptimization(new nv(i)),t.addOptimization(new ov(i)),i++,t.addOptimization(new ev(i,1024)),t}static ModerateDegradationAllowed(e){const t=new hv(e);let i=0;return t.addOptimization(new lv(i)),t.addOptimization(new iv(i)),t.addOptimization(new sv(i)),i++,t.addOptimization(new nv(i)),t.addOptimization(new ov(i)),i++,t.addOptimization(new ev(i,512)),i++,t.addOptimization(new av(i)),i++,t.addOptimization(new tv(i,2)),t}static HighDegradationAllowed(e){const t=new hv(e);let i=0;return t.addOptimization(new lv(i)),t.addOptimization(new iv(i)),t.addOptimization(new sv(i)),i++,t.addOptimization(new nv(i)),t.addOptimization(new ov(i)),i++,t.addOptimization(new ev(i,256)),i++,t.addOptimization(new av(i)),i++,t.addOptimization(new tv(i,4)),t}}class cv{get isInImprovementMode(){return this._improvementMode}set isInImprovementMode(e){this._improvementMode=e}get currentPriorityLevel(){return this._currentPriorityLevel}get currentFrameRate(){return this._currentFrameRate}get targetFrameRate(){return this._targetFrameRate}set targetFrameRate(e){this._targetFrameRate=e}get trackerDuration(){return this._trackerDuration}set trackerDuration(e){this._trackerDuration=e}get optimizations(){return this._options.optimizations}constructor(e,t,i=!0,n=!1){if(this._isRunning=!1,this._currentPriorityLevel=0,this._targetFrameRate=60,this._trackerDuration=2e3,this._currentFrameRate=0,this._improvementMode=!1,this.onSuccessObservable=new r.y$,this.onNewOptimizationAppliedObservable=new r.y$,this.onFailureObservable=new r.y$,this._options=t||new hv,this._options.targetFrameRate&&(this._targetFrameRate=this._options.targetFrameRate),this._options.trackerDuration&&(this._trackerDuration=this._options.trackerDuration),i){let e=0;for(const t of this._options.optimizations)t.priority=e++}this._improvementMode=n,this._scene=e||A.l.LastCreatedScene,this._sceneDisposeObserver=this._scene.onDisposeObservable.add((()=>{this._sceneDisposeObserver=null,this.dispose()}))}stop(){this._isRunning=!1}reset(){this._currentPriorityLevel=0}start(){this._isRunning||(this._isRunning=!0,this._scene.executeWhenReady((()=>{setTimeout((()=>{this._checkCurrentState()}),this._trackerDuration)})))}_checkCurrentState(){if(!this._isRunning)return;const e=this._scene,t=this._options;if(this._currentFrameRate=Math.round(e.getEngine().getFps()),this._improvementMode&&this._currentFrameRate<=this._targetFrameRate||!this._improvementMode&&this._currentFrameRate>=this._targetFrameRate)return this._isRunning=!1,void this.onSuccessObservable.notifyObservers(this);let i=!0,n=!0;for(let s=0;s<t.optimizations.length;s++){const r=t.optimizations[s];r.priority===this._currentPriorityLevel&&(n=!1,i=i&&r.apply(e,this),this.onNewOptimizationAppliedObservable.notifyObservers(r))}if(n)return this._isRunning=!1,void this.onFailureObservable.notifyObservers(this);i&&this._currentPriorityLevel++,e.executeWhenReady((()=>{setTimeout((()=>{this._checkCurrentState()}),this._trackerDuration)}))}dispose(){this.stop(),this.onSuccessObservable.clear(),this.onFailureObservable.clear(),this.onNewOptimizationAppliedObservable.clear(),this._sceneDisposeObserver&&this._scene.onDisposeObservable.remove(this._sceneDisposeObserver)}static OptimizeAsync(e,t,i,n){const s=new cv(e,t||hv.ModerateDegradationAllowed(),!1);return i&&s.onSuccessObservable.add((()=>{i()})),n&&s.onFailureObservable.add((()=>{n()})),s.start(),s}}let uv=[];const dv=(e,t)=>{e.doNotSerialize||(t.vertexData.push(e.serializeVerticeData()),uv[e.id]=!0)},pv=(e,t)=>{const i={},n=e._geometry;return n&&(e.getScene().getGeometryById(n.id)||dv(n,t.geometries)),e.serialize&&e.serialize(i),i};class fv{static ClearCache(){uv=[]}static Serialize(e){return fv._Serialize(e)}static _Serialize(e,t=!0){const i={};if(t&&!e.getEngine()._features.supportSyncTextureRead&&Ce.x.ForceSerializeBuffers&&console.warn("The serialization object may not contain the proper base64 encoded texture data! You should use the SerializeAsync method instead."),fv.ClearCache(),i.useDelayedTextureLoading=e.useDelayedTextureLoading,i.autoClear=e.autoClear,i.clearColor=e.clearColor.asArray(),i.ambientColor=e.ambientColor.asArray(),i.gravity=e.gravity.asArray(),i.collisionsEnabled=e.collisionsEnabled,i.useRightHandedSystem=e.useRightHandedSystem,e.fogMode&&0!==e.fogMode&&(i.fogMode=e.fogMode,i.fogColor=e.fogColor.asArray(),i.fogStart=e.fogStart,i.fogEnd=e.fogEnd,i.fogDensity=e.fogDensity),e.isPhysicsEnabled()){const t=e.getPhysicsEngine();t&&(i.physicsEnabled=!0,i.physicsGravity=t.gravity.asArray(),i.physicsEngine=t.getPhysicsPluginName())}e.metadata&&(i.metadata=e.metadata),i.morphTargetManagers=[];for(const t of e.meshes){const e=t.morphTargetManager;e&&i.morphTargetManagers.push(e.serialize())}let n,s,r;for(i.lights=[],n=0;n<e.lights.length;n++)s=e.lights[n],s.doNotSerialize||i.lights.push(s.serialize());for(i.cameras=[],n=0;n<e.cameras.length;n++){const t=e.cameras[n];t.doNotSerialize||i.cameras.push(t.serialize())}if(e.activeCamera&&(i.activeCameraID=e.activeCamera.id),Te.p4.AppendSerializedAnimations(e,i),e.animationGroups&&e.animationGroups.length>0){i.animationGroups=[];for(let t=0;t<e.animationGroups.length;t++){const n=e.animationGroups[t];i.animationGroups.push(n.serialize())}}if(e.reflectionProbes&&e.reflectionProbes.length>0)for(i.reflectionProbes=[],n=0;n<e.reflectionProbes.length;n++){const t=e.reflectionProbes[n];i.reflectionProbes.push(t.serialize())}for(i.materials=[],i.multiMaterials=[],n=0;n<e.materials.length;n++)r=e.materials[n],r.doNotSerialize||i.materials.push(r.serialize());for(i.multiMaterials=[],n=0;n<e.multiMaterials.length;n++){const t=e.multiMaterials[n];i.multiMaterials.push(t.serialize())}for(e.environmentTexture&&(e.environmentTexture._files?i.environmentTexture=e.environmentTexture.serialize():(i.environmentTexture=e.environmentTexture.name,i.environmentTextureRotationY=e.environmentTexture.rotationY)),i.environmentIntensity=e.environmentIntensity,i.skeletons=[],n=0;n<e.skeletons.length;n++){const t=e.skeletons[n];t.doNotSerialize||i.skeletons.push(t.serialize())}for(i.transformNodes=[],n=0;n<e.transformNodes.length;n++)e.transformNodes[n].doNotSerialize||i.transformNodes.push(e.transformNodes[n].serialize());i.geometries={},i.geometries.boxes=[],i.geometries.spheres=[],i.geometries.cylinders=[],i.geometries.toruses=[],i.geometries.grounds=[],i.geometries.planes=[],i.geometries.torusKnots=[],i.geometries.vertexData=[],uv=[];const o=e.getGeometries();for(n=0;n<o.length;n++){const e=o[n];e.isReady()&&dv(e,i.geometries)}for(i.meshes=[],n=0;n<e.meshes.length;n++){const t=e.meshes[n];if(t instanceof Nt.Kj){const e=t;e.doNotSerialize||1!==e.delayLoadState&&0!==e.delayLoadState||i.meshes.push(pv(e,i))}}for(i.particleSystems=[],n=0;n<e.particleSystems.length;n++)i.particleSystems.push(e.particleSystems[n].serialize(!1));for(i.postProcesses=[],n=0;n<e.postProcesses.length;n++)i.postProcesses.push(e.postProcesses[n].serialize());e.actionManager&&(i.actions=e.actionManager.serialize("scene"));for(const t of e._serializableComponents)t.serialize(i);return i}static SerializeAsync(e){const t=fv._Serialize(e,!1),i=[];return this._CollectPromises(t,i),Promise.all(i).then((()=>t))}static _CollectPromises(e,t){if(Array.isArray(e))for(let i=0;i<e.length;++i){const n=e[i];n instanceof Promise?t.push(n.then((t=>e[i]=t))):(n instanceof Object||Array.isArray(n))&&this._CollectPromises(n,t)}else if(e instanceof Object)for(const i in e)if(Object.prototype.hasOwnProperty.call(e,i)){const n=e[i];n instanceof Promise?t.push(n.then((t=>e[i]=t))):(n instanceof Object||Array.isArray(n))&&this._CollectPromises(n,t)}}static SerializeMesh(e,t=!1,i=!1){const n={};if(fv.ClearCache(),e=e instanceof Array?e:[e],t||i)for(let n=0;n<e.length;++n)i&&e[n].getDescendants().forEach((t=>{t instanceof Nt.Kj&&e.indexOf(t)<0&&!t.doNotSerialize&&e.push(t)})),t&&e[n].parent&&e.indexOf(e[n].parent)<0&&!e[n].parent.doNotSerialize&&e.push(e[n].parent);return e.forEach((e=>{((e,t)=>{if(1===e.delayLoadState||0===e.delayLoadState){const i=i=>{t.materials=t.materials||[],e.material&&!t.materials.some((t=>t.id===e.material.id))&&t.materials.push(i.serialize())};if(e.material&&!e.material.doNotSerialize)if(e.material instanceof Ph.G){if(t.multiMaterials=t.multiMaterials||[],!t.multiMaterials.some((t=>t.id===e.material.id))){t.multiMaterials.push(e.material.serialize());for(const t of e.material.subMaterials)t&&i(t)}}else i(e.material);else e.material||i(e.getScene().defaultMaterial);const n=e._geometry;n&&(t.geometries||(t.geometries={},t.geometries.boxes=[],t.geometries.spheres=[],t.geometries.cylinders=[],t.geometries.toruses=[],t.geometries.grounds=[],t.geometries.planes=[],t.geometries.torusKnots=[],t.geometries.vertexData=[]),dv(n,t.geometries)),e.skeleton&&!e.skeleton.doNotSerialize&&(t.skeletons=t.skeletons||[],t.skeletons.push(e.skeleton.serialize())),t.meshes=t.meshes||[],t.meshes.push(pv(e,t))}})(e,n)})),n}}var _v=i(4875);class mv{static IsSupported(e){const t=e.getRenderingCanvas();return!!t&&"function"==typeof t.captureStream}get isRecording(){return!!this._canvas&&this._canvas.isRecording}constructor(e,t={}){if(!mv.IsSupported(e))throw"Your browser does not support recording so far.";const i=e.getRenderingCanvas();if(!i)throw"The babylon engine must have a canvas to be recorded";this._canvas=i,this._canvas.isRecording=!1,this._options={...mv._DefaultOptions,...t};const n=this._canvas.captureStream(this._options.fps);if(this._options.audioTracks)for(const e of this._options.audioTracks)n.addTrack(e);this._mediaRecorder=new MediaRecorder(n,{mimeType:this._options.mimeType}),this._mediaRecorder.ondataavailable=this._handleDataAvailable.bind(this),this._mediaRecorder.onerror=this._handleError.bind(this),this._mediaRecorder.onstop=this._handleStop.bind(this)}stopRecording(){this._canvas&&this._mediaRecorder&&this.isRecording&&(this._canvas.isRecording=!1,this._mediaRecorder.stop())}startRecording(e="babylonjs.webm",t=7){if(!this._canvas||!this._mediaRecorder)throw"Recorder has already been disposed";if(this.isRecording)throw"Recording already in progress";return t>0&&setTimeout((()=>{this.stopRecording()}),1e3*t),this._fileName=e,this._recordedChunks=[],this._resolve=null,this._reject=null,this._canvas.isRecording=!0,this._mediaRecorder.start(this._options.recordChunckSize),new Promise(((e,t)=>{this._resolve=e,this._reject=t}))}dispose(){this._canvas=null,this._mediaRecorder=null,this._recordedChunks=[],this._fileName=null,this._resolve=null,this._reject=null}_handleDataAvailable(e){e.data.size>0&&this._recordedChunks.push(e.data)}_handleError(e){if(this.stopRecording(),!this._reject)throw new e.error;this._reject(e.error)}_handleStop(){this.stopRecording();const e=new Blob(this._recordedChunks);this._resolve&&this._resolve(e),window.URL.createObjectURL(e),this._fileName&&de.w1.Download(e,this._fileName)}}mv._DefaultOptions={mimeType:"video/webm",fps:25,recordChunckSize:3e3};var gv=i(2286);let vv=null;function yv(e,t,i,n,s="image/png",r=!1){const{height:o,width:a}=Ev(e,t,i);if(!o||!a)return void _.Y.Error("Invalid 'size' parameter !");vv||(vv=document.createElement("canvas")),vv.width=a,vv.height=o;const l=vv.getContext("2d"),h=e.getRenderWidth()/e.getRenderHeight();let c=a,u=c/h;u>o&&(u=o,c=u*h);const d=Math.max(0,a-c)/2,p=Math.max(0,o-u)/2;t.getScene().activeCamera!==t?Tv(e,t,i,(e=>{if(r){const t=new Blob([e]);de.w1.DownloadBlob(t),n&&n("")}else n&&n(e)}),s,1,e.getCreationOptions().antialias):e.onEndFrameObservable.addOnce((()=>{const t=e.getRenderingCanvas();l&&t&&l.drawImage(t,d,p,c,u),vv&&(r?(de.w1.EncodeScreenshotCanvasData(vv,void 0,s),n&&n("")):de.w1.EncodeScreenshotCanvasData(vv,n,s))}))}function xv(e,t,i,n="image/png"){return new Promise(((s,r)=>{yv(e,t,i,(e=>{void 0!==e?s(e):r(new Error("Data is undefined"))}),n)}))}function bv(e,t,i,n,s="image/png"){return new Promise((r=>{yv(e,t,{width:i,height:n},(()=>{r()}),s,!0)}))}function Tv(e,t,i,n,s="image/png",r=1,o=!1,a,l=!1,h=!1,c=!0){const{height:u,width:d,finalWidth:p,finalHeight:f}=Ev(e,t,i),m={width:d,height:u};if(!u||!d)return void _.Y.Error("Invalid 'size' parameter !");const g={width:e.getRenderWidth(),height:e.getRenderHeight()};e.setSize(d,u);const v=t.getScene(),y=new Ai._("screenShot",m,v,!1,!1,0,!1,Ce.x.BILINEAR_SAMPLINGMODE,void 0,h,void 0,void 0,void 0,r);y.renderList=v.meshes.slice(),y.samples=r,y.renderSprites=l,y.activeCamera=t,y.forceLayerMaskCheck=c;const x=()=>{e.onEndFrameObservable.addOnce((()=>{p===d&&f===u?y.readPixels(void 0,void 0,void 0,!1).then((e=>{gv.B.DumpData(d,u,e,n,s,a,!0),y.dispose()})):(0,ro.$0)("pass",y.getInternalTexture(),v,void 0,void 0,void 0,p,f).then((t=>{e._readTexturePixels(t,p,f,-1,0,null,!0,!1,0,0).then((e=>{gv.B.DumpData(p,f,e,n,s,a,!0),t.dispose()}))}))})),v.incrementRenderId(),v.resetCachedMaterial(),y.render(!0),v.incrementRenderId(),v.resetCachedMaterial(),e.setSize(g.width,g.height),t.getProjectionMatrix(!0),v.render()};if(o){const e=new bm("antialiasing",1,v.activeCamera);y.addPostProcess(e),e.getEffect().isReady()?x():e.getEffect().onCompiled=()=>{x()}}else x()}function Sv(e,t,i,n="image/png",s=1,r=!1,o,a=!1,l=!1,h=!0){return new Promise(((c,u)=>{Tv(e,t,i,(e=>{void 0!==e?c(e):u(new Error("Data is undefined"))}),n,s,r,o,a,l,h)}))}function Ev(e,t,i){let n=0,s=0,r=0,o=0;if("object"==typeof i){const a=i.precision?Math.abs(i.precision):1;i.width&&i.height?(n=i.height*a,s=i.width*a):i.width&&!i.height?(s=i.width*a,n=Math.round(s/e.getAspectRatio(t))):i.height&&!i.width?(n=i.height*a,s=Math.round(n*e.getAspectRatio(t))):(s=Math.round(e.getRenderWidth()*a),n=Math.round(s/e.getAspectRatio(t))),i.finalWidth&&i.finalHeight?(o=i.finalHeight,r=i.finalWidth):i.finalWidth&&!i.finalHeight?(r=i.finalWidth,o=Math.round(r/e.getAspectRatio(t))):i.finalHeight&&!i.finalWidth?(o=i.finalHeight,r=Math.round(o*e.getAspectRatio(t))):(r=s,o=n)}else isNaN(i)||(n=i,s=i,r=i,o=i);return s&&(s=Math.floor(s)),n&&(n=Math.floor(n)),r&&(r=Math.floor(r)),o&&(o=Math.floor(o)),{height:0|n,width:0|s,finalWidth:0|r,finalHeight:0|o}}const Cv={CreateScreenshot:yv,CreateScreenshotAsync:xv,CreateScreenshotWithResizeAsync:bv,CreateScreenshotUsingRenderTarget:Tv,CreateScreenshotUsingRenderTargetAsync:Sv};var Av;de.w1.CreateScreenshot=yv,de.w1.CreateScreenshotAsync=xv,de.w1.CreateScreenshotUsingRenderTarget=Tv,de.w1.CreateScreenshotUsingRenderTargetAsync=Sv,function(e){e[e.Checkbox=0]="Checkbox",e[e.Slider=1]="Slider",e[e.Vector3=2]="Vector3",e[e.Quaternion=3]="Quaternion",e[e.Color3=4]="Color3",e[e.String=5]="String",e[e.Button=6]="Button",e[e.Options=7]="Options",e[e.Tab=8]="Tab",e[e.FileButton=9]="FileButton",e[e.Vector2=10]="Vector2"}(Av||(Av={}));var Pv,Rv=i(8121),Mv=i(4918),Iv=i(1918);class Dv{static _GetStorage(){try{return localStorage.setItem("test",""),localStorage.removeItem("test"),localStorage}catch(e){const t={};return{getItem:e=>{const i=t[e];return void 0===i?null:i},setItem:(e,i)=>{t[e]=i}}}}static ReadString(e,t){const i=this._Storage.getItem(e);return null!==i?i:t}static WriteString(e,t){this._Storage.setItem(e,t)}static ReadBoolean(e,t){const i=this._Storage.getItem(e);return null!==i?"true"===i:t}static WriteBoolean(e,t){this._Storage.setItem(e,t?"true":"false")}static ReadNumber(e,t){const i=this._Storage.getItem(e);return null!==i?parseFloat(i):t}static WriteNumber(e,t){this._Storage.setItem(e,t.toString())}}Dv._Storage=Dv._GetStorage();class Ov{constructor(){this._trackedScene=null}track(e){this._trackedScene=e,Te.p4.AllowLoadingUniqueId=!0,this._savedJSON=fv.Serialize(e),Te.p4.AllowLoadingUniqueId=!1}getDelta(){if(!this._trackedScene)return null;const e=Ce.x.ForceSerializeBuffers;Ce.x.ForceSerializeBuffers=!1,Te.p4.AllowLoadingUniqueId=!0;const t=fv.Serialize(this._trackedScene);Te.p4.AllowLoadingUniqueId=!1;const i={};for(const e in t)this._compareCollections(e,this._savedJSON[e],t[e],i);return Ce.x.ForceSerializeBuffers=e,i}_compareArray(e,t,i,n){if(0===t.length&&0===i.length)return!0;if(t.length&&!isNaN(t[0])||i.length&&!isNaN(i[0])){if(t.length!==i.length)return!1;if(0===t.length)return!0;for(let s=0;s<t.length;s++)if(t[s]!==i[s])return n[e]=i,!1;return!0}const s=[];for(let r=0;r<t.length;r++){const o=t[r],a=o.uniqueId;s.push(a);const l=i.filter((e=>e.uniqueId===a));if(l.length){const t=l[0],i={};this._compareObjects(o,t,i)||(n[e]||(n[e]=[]),i.__state={id:t.id||t.name},n[e].push(i))}else{const t={__state:{deleteId:o.id||o.name}};n[e]||(n[e]=[]),n[e].push(t)}}for(let t=0;t<i.length;t++){const r=i[t],o=r.uniqueId;-1===s.indexOf(o)&&(n[e]||(n[e]=[]),n[e].push(r))}return!0}_compareObjects(e,t,i){let n=!1;for(const s in e){if(!Object.prototype.hasOwnProperty.call(e,s))continue;const r=e[s],o=t[s];let a=!1;if(Array.isArray(r))a=JSON.stringify(r)!==JSON.stringify(o);else if(isNaN(r)&&"[object String]"!=Object.prototype.toString.call(r)){if("object"==typeof r&&"object"==typeof o){const e={};this._compareObjects(r,o,e)||(i[s]=e,n=!0)}}else a=r!==o;a&&(n=!0,i[s]=o)}return!n}_compareCollections(e,t,i,n){if(t!==i&&t&&i)if(Array.isArray(t)&&Array.isArray(i)){if(this._compareArray(e,t,i,n))return}else if("object"==typeof t&&"object"==typeof i){const s={};return void(this._compareObjects(t,i,s)||(n[e]=s))}}static GetShadowGeneratorById(e,t){const i=e.lights.map((e=>e.getShadowGenerators()));for(const e of i)if(e){const i=e.values();for(let e=i.next();!0!==e.done;e=i.next()){const i=e.value;if(i&&i.id===t)return i}}return null}static ApplyDelta(e,t){"string"==typeof e&&(e=JSON.parse(e));const i=t;for(const n in e){const s=e[n],r=i[n];if(Array.isArray(r)||"shadowGenerators"===n)switch(n){case"cameras":this._ApplyDeltaForEntity(s,t,t.getCameraById.bind(t),(e=>Mt.V.Parse(e,t)));break;case"lights":this._ApplyDeltaForEntity(s,t,t.getLightById.bind(t),(e=>hh._.Parse(e,t)));break;case"shadowGenerators":this._ApplyDeltaForEntity(s,t,(e=>this.GetShadowGeneratorById(t,e)),(e=>dh.Parse(e,t)));break;case"meshes":this._ApplyDeltaForEntity(s,t,t.getMeshById.bind(t),(e=>Nt.Kj.Parse(e,t,"")));break;case"skeletons":this._ApplyDeltaForEntity(s,t,t.getSkeletonById.bind(t),(e=>Ye.O.Parse(e,t)));break;case"materials":this._ApplyDeltaForEntity(s,t,t.getMaterialById.bind(t),(e=>cs.F.Parse(e,t,"")));break;case"multiMaterials":this._ApplyDeltaForEntity(s,t,t.getMaterialById.bind(t),(e=>Ph.G.Parse(e,t,"")));break;case"transformNodes":this._ApplyDeltaForEntity(s,t,t.getTransformNodeById.bind(t),(e=>yi.Y.Parse(e,t,"")));break;case"particleSystems":this._ApplyDeltaForEntity(s,t,t.getParticleSystemById.bind(t),(e=>i_.Parse(e,t,"")));break;case"morphTargetManagers":this._ApplyDeltaForEntity(s,t,t.getMorphTargetById.bind(t),(e=>wh.O.Parse(e,t)));break;case"postProcesses":this._ApplyDeltaForEntity(s,t,t.getPostProcessByName.bind(t),(e=>ni.D.Parse(e,t,"")))}else isNaN(r)?r.fromArray&&r.fromArray(s):i[n]=s}}static _ApplyPropertiesToEntity(e,t){for(const i in e){const n=e[i],s=t[i];void 0!==s&&(!isNaN(s)||Array.isArray(s)?t[i]=n:s.fromArray?s.fromArray(n):"object"==typeof s&&null!==s&&this._ApplyPropertiesToEntity(n,s))}}static _ApplyDeltaForEntity(e,t,i,n){for(const s of e)if(s.__state&&void 0!==s.__state.id){const e=i(s.__state.id);e&&(this._ApplyPropertiesToEntity(s,e),Te.p4.ParseProperties(s,e,t,null))}else if(s.__state&&void 0!==s.__state.deleteId){const e=i(s.__state.deleteId);null==e||e.dispose()}else n(s)}}!function(e){class t{serialize(){const e={},t=new Array(this._characterToIdx.size);return this._characterToIdx.forEach(((e,i)=>{t[e]=i})),e.characters=t,e.insertionCosts=this._insertionCosts,e.deletionCosts=this._deletionCosts,e.substitutionCosts=this._substitutionCosts,JSON.stringify(e)}static Deserialize(e){const i=JSON.parse(e),n=new t(i.characters);return n._insertionCosts=i.insertionCosts,n._deletionCosts=i.deletionCosts,n._substitutionCosts=i.substitutionCosts,n}constructor(e,t=null,i=null,n=null){let s;t=null!=t?t:()=>1,i=null!=i?i:()=>1,n=null!=n?n:(e,t)=>e===t?0:1,this._characterToIdx=new Map,this._insertionCosts=new Array(e.length),this._deletionCosts=new Array(e.length),this._substitutionCosts=new Array(e.length);for(let r=0;r<e.length;++r){s=e[r],this._characterToIdx.set(s,r),this._insertionCosts[r]=t(s),this._deletionCosts[r]=i(s),this._substitutionCosts[r]=new Array(e.length);for(let t=r;t<e.length;++t)this._substitutionCosts[r][t]=n(s,e[t])}}getCharacterIdx(e){return this._characterToIdx.get(e)}getInsertionCost(e){return this._insertionCosts[e]}getDeletionCost(e){return this._deletionCosts[e]}getSubstitutionCost(e,t){const i=Math.min(e,t),n=Math.max(e,t);return this._substitutionCosts[i][n]}}e.Alphabet=t;class i{serialize(){return JSON.stringify(this._characters)}static Deserialize(e,t){const n=new i([],t);return n._characters=JSON.parse(e),n}constructor(e,t){if(e.length>i._MAX_SEQUENCE_LENGTH)throw new Error("Sequences longer than "+i._MAX_SEQUENCE_LENGTH+" not supported.");this._alphabet=t,this._characters=e.map((e=>this._alphabet.getCharacterIdx(e)))}distance(e){return i._Distance(this,e)}static _Distance(e,t){const n=e._alphabet;if(n!==t._alphabet)throw new Error("Cannot Levenshtein compare Sequences built from different alphabets.");const s=e._characters,r=t._characters,o=s.length,a=r.length,l=i._CostMatrix;l[0][0]=0;for(let e=0;e<o;++e)l[e+1][0]=l[e][0]+n.getInsertionCost(s[e]);for(let e=0;e<a;++e)l[0][e+1]=l[0][e]+n.getInsertionCost(r[e]);for(let e=0;e<o;++e)for(let t=0;t<a;++t)i._InsertionCost=l[e+1][t]+n.getInsertionCost(r[t]),i._DeletionCost=l[e][t+1]+n.getDeletionCost(s[e]),i._SubstitutionCost=l[e][t]+n.getSubstitutionCost(s[e],r[t]),l[e+1][t+1]=Math.min(i._InsertionCost,i._DeletionCost,i._SubstitutionCost);return l[o][a]}}i._MAX_SEQUENCE_LENGTH=256,i._CostMatrix=[...Array(i._MAX_SEQUENCE_LENGTH+1)].map((()=>new Array(i._MAX_SEQUENCE_LENGTH+1))),e.Sequence=i}(Pv||(Pv={}));class wv{serialize(){return JSON.stringify(this)}static Deserialize(e){const t=JSON.parse(e),i=new wv(t._segmentLength);return i._points=t._points.map((e=>new o.P(e._x,e._y,e._z))),i}constructor(e=.01){this._points=[],this._segmentLength=e}getLength(){return this._points.length*this._segmentLength}add(e){let t=this._points.length;if(0===t)this._points.push(e.clone());else{const i=()=>this._segmentLength/o.P.Distance(this._points[t-1],e);for(let n=i();n<=1;n=i()){const i=this._points[t-1].scale(1-n);e.scaleAndAddToRef(n,i),this._points.push(i),++t}}}resampleAtTargetResolution(e){const t=new wv(this.getLength()/e);return this._points.forEach((e=>{t.add(e)})),t}tokenize(e){const t=[],i=new o.P;for(let n=2;n<this._points.length;++n)wv._TransformSegmentDirToRef(this._points[n-2],this._points[n-1],this._points[n],i)&&t.push(wv._TokenizeSegment(i,e));return t}static _TransformSegmentDirToRef(e,t,i,n){return t.subtractToRef(e,wv._ForwardDir),wv._ForwardDir.normalize(),t.scaleToRef(-1,wv._InverseFromVec),wv._InverseFromVec.normalize(),!(Math.abs(o.P.Dot(wv._ForwardDir,wv._InverseFromVec))>.98||(o.P.CrossToRef(wv._ForwardDir,wv._InverseFromVec,wv._UpDir),wv._UpDir.normalize(),o.y3.LookAtLHToRef(e,t,wv._UpDir,wv._LookMatrix),i.subtractToRef(t,wv._FromToVec),wv._FromToVec.normalize(),o.P.TransformNormalToRef(wv._FromToVec,wv._LookMatrix,n),0))}static _TokenizeSegment(e,t){wv._BestMatch=0,wv._Score=o.P.Dot(e,t[0]),wv._BestScore=wv._Score;for(let i=1;i<t.length;++i)wv._Score=o.P.Dot(e,t[i]),wv._Score>wv._BestScore&&(wv._BestMatch=i,wv._BestScore=wv._Score);return wv._BestMatch}}wv._ForwardDir=new o.P,wv._InverseFromVec=new o.P,wv._UpDir=new o.P,wv._FromToVec=new o.P,wv._LookMatrix=new o.y3;class Nv{static Generate(e=64,t=256,i=.1,n=.001,s=[]){const r=new Nv(e);for(let t=0;t<e;++t)r.chars[t]=new o.P(Math.random()-.5,Math.random()-.5,Math.random()-.5),r.chars[t].normalize();for(let e=0;e<s.length;++e)r.chars[e].copyFrom(s[e]);let a,l;const h=new o.P,c=new o.P;for(let e=0;e<t;++e){a=(1-(u=e/(t-1)))*i+u*n;for(let e=s.length;e<r.chars.length;++e)h.copyFromFloats(0,0,0),r.chars.forEach((t=>{r.chars[e].subtractToRef(t,c),l=c.lengthSquared(),l>1e-6&&c.scaleAndAddToRef(1/(c.lengthSquared()*l),h)})),h.scaleInPlace(a),r.chars[e].addInPlace(h),r.chars[e].normalize()}var u;return r}serialize(){return JSON.stringify(this.chars)}static Deserialize(e){const t=JSON.parse(e),i=new Nv(t.length);for(let e=0;e<t.length;++e)i.chars[e]=new o.P(t[e]._x,t[e]._y,t[e]._z);return i}constructor(e){this.chars=new Array(e)}}class Fv{serialize(){return JSON.stringify(this._sequences.map((e=>e.serialize())))}static Deserialize(e,t){const i=new Fv;return i._sequences=JSON.parse(e).map((e=>Pv.Sequence.Deserialize(e,t))),i}static CreateFromTrajectory(e,t,i){return Fv.CreateFromTokenizationPyramid(Fv._GetTokenizationPyramid(e,t),i)}static CreateFromTokenizationPyramid(e,t){const i=new Fv;return i._sequences=e.map((e=>new Pv.Sequence(e,t))),i}constructor(){this._sequences=[]}static _GetTokenizationPyramid(e,t,i=Fv._FINEST_DESCRIPTOR_RESOLUTION){const n=[];for(let s=i;s>4;s=Math.floor(s/2))n.push(e.resampleAtTargetResolution(s).tokenize(t.chars));return n}distance(e){let t,i=0;for(let n=0;n<this._sequences.length;++n)t=Math.pow(2,n),i+=t*this._sequences[n].distance(e._sequences[n]);return i}}Fv._FINEST_DESCRIPTOR_RESOLUTION=32;class Lv{serialize(){const e={};return e.descriptors=this._descriptors.map((e=>e.serialize())),e.centroidIdx=this._centroidIdx,e.averageDistance=this._averageDistance,JSON.stringify(e)}static Deserialize(e,t){const i=JSON.parse(e),n=new Lv;return n._descriptors=i.descriptors.map((e=>Fv.Deserialize(e,t))),n._centroidIdx=i.centroidIdx,n._averageDistance=i.averageDistance,n}constructor(e=[]){this._descriptors=e,this._centroidIdx=-1,this._averageDistance=0,this._refreshDescription()}add(e){this._descriptors.push(e),this._refreshDescription()}getMatchCost(e){return e.distance(this._descriptors[this._centroidIdx])/this._averageDistance}getMatchMinimumDistance(e){return Math.min(...this._descriptors.map((t=>t.distance(e))))}_refreshDescription(){let e;this._centroidIdx=-1;const t=this._descriptors.map((t=>(e=0,this._descriptors.forEach((i=>{e+=t.distance(i)})),e)));for(let e=0;e<t.length;++e)(this._centroidIdx<0||t[e]<t[this._centroidIdx])&&(this._centroidIdx=e);this._averageDistance=0,this._descriptors.forEach((e=>{this._averageDistance+=e.distance(this._descriptors[this._centroidIdx])})),this._descriptors.length>0&&(this._averageDistance=Math.max(this._averageDistance/this._descriptors.length,Lv._MIN_AVERAGE_DISTANCE))}}Lv._MIN_AVERAGE_DISTANCE=1;class Bv{serialize(){const e={};return e.maximumAllowableMatchCost=this._maximumAllowableMatchCost,e.vector3Alphabet=this._vector3Alphabet.serialize(),e.levenshteinAlphabet=this._levenshteinAlphabet.serialize(),e.nameToDescribedTrajectory=[],this._nameToDescribedTrajectory.forEach(((t,i)=>{e.nameToDescribedTrajectory.push(i),e.nameToDescribedTrajectory.push(t.serialize())})),JSON.stringify(e)}static Deserialize(e){const t=JSON.parse(e),i=new Bv;i._maximumAllowableMatchCost=t.maximumAllowableMatchCost,i._vector3Alphabet=Nv.Deserialize(t.vector3Alphabet),i._levenshteinAlphabet=Pv.Alphabet.Deserialize(t.levenshteinAlphabet);for(let e=0;e<t.nameToDescribedTrajectory.length;e+=2)i._nameToDescribedTrajectory.set(t.nameToDescribedTrajectory[e],Lv.Deserialize(t.nameToDescribedTrajectory[e+1],i._levenshteinAlphabet));return i}static Generate(){const e=Nv.Generate(64,256,.1,.001,[o.P.Forward()]),t=new Array(e.chars.length);for(let e=0;e<t.length;++e)t[e]=e;const i=new Pv.Alphabet(t,(e=>0===e?0:1),(e=>0===e?0:1),((t,i)=>Math.min(1-o.P.Dot(e.chars[t],e.chars[i]),1))),n=new Bv;return n._vector3Alphabet=e,n._levenshteinAlphabet=i,n}constructor(){this._maximumAllowableMatchCost=4,this._nameToDescribedTrajectory=new Map}addTrajectoryToClassification(e,t){this._nameToDescribedTrajectory.has(t)||this._nameToDescribedTrajectory.set(t,new Lv),this._nameToDescribedTrajectory.get(t).add(Fv.CreateFromTrajectory(e,this._vector3Alphabet,this._levenshteinAlphabet))}deleteClassification(e){return this._nameToDescribedTrajectory.delete(e)}classifyTrajectory(e){const t=Fv.CreateFromTrajectory(e,this._vector3Alphabet,this._levenshteinAlphabet),i=[];if(this._nameToDescribedTrajectory.forEach(((e,n)=>{e.getMatchCost(t)<this._maximumAllowableMatchCost&&i.push(n)})),0===i.length)return null;let n,s=0,r=this._nameToDescribedTrajectory.get(i[s]).getMatchMinimumDistance(t);for(let e=0;e<i.length;++e)n=this._nameToDescribedTrajectory.get(i[e]).getMatchMinimumDistance(t),n<r&&(r=n,s=e);return i[s]}}var Uv=i(9703);class Vv{constructor(e,t,i){this._scene=e,_.Y.Log(`[Reflector] Connecting to ws://${t}:${i}`),this._webSocket=new WebSocket(`ws://${t}:${i}`),this._webSocket.onmessage=e=>{const t=e.data;if(t.startsWith(Vv._SERVER_PREFIX)){const e=t.substr(Vv._SERVER_PREFIX.length);return _.Y.Log(`[Reflector] Received server message: ${e.substr(0,64)}`),void this._handleServerMessage(e)}_.Y.Log(`[Reflector] Received client message: ${t.substr(0,64)}`),this._handleClientMessage()},this._webSocket.onclose=e=>{_.Y.Log(`[Reflector] Disconnected ${e.code} ${e.reason}`)}}close(){this._webSocket.close()}_handleServerMessage(e){"connected"===e&&fv.SerializeAsync(this._scene).then((e=>{this._webSocket.send(`load|${JSON.stringify(e)}`)}))}_handleClientMessage(){}}Vv._SERVER_PREFIX="$$";class kv{constructor(e){this._observer=null,this._currentState=[],this.onPressureChanged=new r.y$,kv.IsAvailable&&(this._observer=new PressureObserver((e=>{this._currentState=e,this.onPressureChanged.notifyObservers(e)}),e))}static get IsAvailable(){return"undefined"!=typeof PressureObserver&&PressureObserver.supportedSources.includes("cpu")}observe(e){var t;try{null===(t=this._observer)||void 0===t||t.observe(e),this.onPressureChanged.notifyObservers(this._currentState)}catch(e){}}unobserve(e){var t;try{null===(t=this._observer)||void 0===t||t.unobserve(e)}catch(e){}}dispose(){var e;null===(e=this._observer)||void 0===e||e.disconnect(),this._observer=null,this.onPressureChanged.clear()}}class Gv{constructor(e){this._view=new Float32Array(e),this._itemLength=0}get itemLength(){return this._itemLength}at(e){return e<0||e>=this._itemLength?NaN:this._view[e]}subarray(e,t){return e>=t||e<0?new Float32Array(0):(t>this._itemLength&&(t=this._itemLength),this._view.subarray(e,t))}push(e){this._view[this._itemLength]=e,this._itemLength++,this._itemLength>=this._view.length&&this._growArray()}_growArray(){const e=Math.floor(1.5*this._view.length),t=new Float32Array(e);t.set(this._view),this._view=t}}const zv=1800,Wv="timestamp",Hv="numPoints",Xv=/\r/g;class jv{static get SliceDataOffset(){return 2}static get NumberOfPointsOffset(){return 1}constructor(e,t){this._scene=e,this._collectDataAtFrame=()=>{const e=G.F.Now-this._startingTimestamp,t=this.datasets.ids.length,i=this.datasets.startingIndices.itemLength;let n=0;if(i>0){const e=this.datasets.startingIndices.at(i-1);n=e+this.datasets.data.at(e+jv.NumberOfPointsOffset)+jv.SliceDataOffset}if(this.datasets.startingIndices.push(n),this.datasets.data.push(e),this.datasets.data.push(t),this.datasets.ids.forEach((e=>{const t=this._strategies.get(e);t&&this.datasets.data.push(t.getData())})),this.datasetObservable.hasObservers()){const i=[e,t];for(let e=0;e<t;e++)i.push(this.datasets.data.at(n+jv.SliceDataOffset+e));this.datasetObservable.notifyObservers(i)}},this.datasets={ids:[],data:new Gv(zv),startingIndices:new Gv(zv)},this._strategies=new Map,this._datasetMeta=new Map,this._eventRestoreSet=new Set,this._customEventObservable=new r.y$,this.datasetObservable=new r.y$,this.metadataObservable=new r.y$((e=>e.callback(this._datasetMeta,new r.he(0)))),t&&this.addCollectionStrategies(...t)}registerEvent(e,t,i){var n;if(this._strategies.has(e)&&!t)return;this._strategies.has(e)&&t&&(null===(n=this._strategies.get(e))||void 0===n||n.dispose(),this._strategies.delete(e));const s={name:e};return this._eventRestoreSet.add(e),this.addCollectionStrategies({strategyCallback:t=>{let i=0,n=0;const s=t.onAfterRenderObservable.add((()=>{n=i,i=0})),r=this._customEventObservable.add((t=>{e===t.name&&(void 0!==t.value?i=t.value:i++)}));return{id:e,getData:()=>n,dispose:()=>{t.onAfterRenderObservable.remove(s),this._customEventObservable.remove(r)}}},category:i}),s}sendEvent(e){this._customEventObservable.notifyObservers(e)}_restoreStringEvents(){this._eventRestoreSet.size!==this._customEventObservable.observers.length&&this._eventRestoreSet.forEach((e=>{this.registerEvent(e,!0)}))}addCollectionStrategies(...e){for(let{strategyCallback:t,category:i,hidden:n}of e){const e=t(this._scene);this._strategies.has(e.id)?e.dispose():(this.datasets.ids.push(e.id),i&&(i=i.replace(new RegExp("@","g"),"")),this._datasetMeta.set(e.id,{color:this._getHexColorFromId(e.id),category:i,hidden:n}),this._strategies.set(e.id,e))}this.metadataObservable.notifyObservers(this._datasetMeta)}_getHexColorFromId(e){let t=0;for(let i=0;i<e.length;i++)t=e.charCodeAt(i)+((t<<5)-t);let i="#";for(let e=0;e<24;e+=8)i+=("0"+(t>>e&255).toString(16)).substr(-2);return i}getCurrentSlice(){const e=[G.F.Now-this._startingTimestamp,this.datasets.ids.length];this.datasets.ids.forEach((t=>{const i=this._strategies.get(t);i&&this.datasetObservable.hasObservers()&&e.push(i.getData())})),this.datasetObservable.hasObservers()&&this.datasetObservable.notifyObservers(e)}updateMetadata(e,t,i){const n=this._datasetMeta.get(e);n&&(n[t]=i,this.metadataObservable.notifyObservers(this._datasetMeta))}clear(e){this.datasets.data=new Gv(zv),this.datasets.ids.length=0,this.datasets.startingIndices=new Gv(zv),this._datasetMeta.clear(),this._strategies.forEach((e=>e.dispose())),this._strategies.clear(),e||this._eventRestoreSet.clear(),this._hasLoadedData=!1}get hasLoadedData(){return this._hasLoadedData}loadFromFileData(e,t){const i=e.replace(Xv,"").split("\n").map((e=>e.split(",").filter((e=>e.length>0)))).filter((e=>e.length>0)),n=jv.NumberOfPointsOffset;if(i.length<2)return!1;const s={ids:[],data:new Gv(zv),startingIndices:new Gv(zv)},[r,...o]=i;if(r.length<2||r[0]!==Wv||r[n]!==Hv)return!1;const a=new Map;for(let e=jv.SliceDataOffset;e<r.length;e++){const[t,i]=r[e].split("@");s.ids.push(t),a.set(t,i)}let l=0;for(const e of o){if(e.length<2)return!1;const t=parseFloat(e[0]),i=parseInt(e[n]);if(isNaN(i)||isNaN(t))return!1;if(s.data.push(t),s.data.push(i),i+jv.SliceDataOffset!==e.length)return!1;for(let t=jv.SliceDataOffset;t<e.length;t++){const i=parseFloat(e[t]);if(isNaN(i))return!1;s.data.push(i)}s.startingIndices.push(l),l+=e.length}if(this.datasets.ids=s.ids,this.datasets.data=s.data,this.datasets.startingIndices=s.startingIndices,t||this._datasetMeta.clear(),this._strategies.forEach((e=>e.dispose())),this._strategies.clear(),!t)for(const e of this.datasets.ids){const t=a.get(e);this._datasetMeta.set(e,{category:t,color:this._getHexColorFromId(e)})}return this.metadataObservable.notifyObservers(this._datasetMeta),this._hasLoadedData=!0,!0}exportDataToCsv(){let e="";e+=`${Wv},${Hv}`;for(let t=0;t<this.datasets.ids.length;t++)if(e+=`,${this.datasets.ids[t]}`,this._datasetMeta){const i=this._datasetMeta.get(this.datasets.ids[t]);(null==i?void 0:i.category)&&(e+=`@${i.category}`)}e+="\n";for(let t=0;t<this.datasets.startingIndices.itemLength;t++){const i=this.datasets.startingIndices.at(t),n=this.datasets.data.at(i),s=this.datasets.data.at(i+jv.NumberOfPointsOffset);e+=`${n},${s}`;for(let t=0;t<s;t++)e+=`,${this.datasets.data.at(i+jv.SliceDataOffset+t)}`;for(let t=0;t<this.datasets.ids.length-s;t++)e+=",";e+="\n"}const t=`${(new Date).toISOString()}-perfdata.csv`;de.w1.Download(new Blob([e],{type:"text/csv"}),t)}start(e){e?void 0===this._startingTimestamp&&(this._startingTimestamp=G.F.Now):(this.datasets.data=new Gv(zv),this.datasets.startingIndices=new Gv(zv),this._startingTimestamp=G.F.Now),this._scene.onAfterRenderObservable.add(this._collectDataAtFrame),this._restoreStringEvents(),this._isStarted=!0}stop(){this._scene.onAfterRenderObservable.removeCallback(this._collectDataAtFrame),this._isStarted=!1}get isStarted(){return this._isStarted}dispose(){this._scene.onAfterRenderObservable.removeCallback(this._collectDataAtFrame),this._datasetMeta.clear(),this._strategies.forEach((e=>{e.dispose()})),this.datasetObservable.clear(),this.metadataObservable.clear(),this._isStarted=!1,this.datasets=null}}const Yv=()=>{};class qv{static FpsStrategy(){return e=>{const t=e.getEngine();return{id:"FPS",getData:()=>t.getFps(),dispose:Yv}}}static ThermalStrategy(){return this._PressureStrategy("Thermal utilization","thermal")}static PowerSupplyStrategy(){return this._PressureStrategy("Power supply utilization","power-supply")}static PressureStrategy(){return this._PressureStrategy("Pressure")}static _PressureStrategy(e,t=null){return()=>{let i=0;const n=new kv;return n.observe("cpu"),n.onPressureChanged.add((e=>{for(const n of e)if(t&&n.factors.includes(t)||!t&&0===n.factors.length)switch(n.state){case"nominal":i=0;break;case"fair":i=.25;break;case"serious":i=.5;break;case"critical":i=1}})),{id:e,getData:()=>i,dispose:()=>n.dispose()}}}static TotalMeshesStrategy(){return e=>({id:"Total meshes",getData:()=>e.meshes.length,dispose:Yv})}static ActiveMeshesStrategy(){return e=>({id:"Active meshes",getData:()=>e.getActiveMeshes().length,dispose:Yv})}static ActiveIndicesStrategy(){return e=>({id:"Active indices",getData:()=>e.getActiveIndices(),dispose:Yv})}static ActiveFacesStrategy(){return e=>({id:"Active faces",getData:()=>e.getActiveIndices()/3,dispose:Yv})}static ActiveBonesStrategy(){return e=>({id:"Active bones",getData:()=>e.getActiveBones(),dispose:Yv})}static ActiveParticlesStrategy(){return e=>({id:"Active particles",getData:()=>e.getActiveParticles(),dispose:Yv})}static DrawCallsStrategy(){return e=>{let t=0;const i=e.onBeforeAnimationsObservable.add((()=>{e.getEngine()._drawCalls.fetchNewFrame()})),n=e.onAfterRenderObservable.add((()=>{t=e.getEngine()._drawCalls.current}));return{id:"Draw calls",getData:()=>t,dispose:()=>{e.onBeforeAnimationsObservable.remove(i),e.onAfterRenderObservable.remove(n)}}}}static TotalLightsStrategy(){return e=>({id:"Total lights",getData:()=>e.lights.length,dispose:Yv})}static TotalVerticesStrategy(){return e=>({id:"Total vertices",getData:()=>e.getTotalVertices(),dispose:Yv})}static TotalMaterialsStrategy(){return e=>({id:"Total materials",getData:()=>e.materials.length,dispose:Yv})}static TotalTexturesStrategy(){return e=>({id:"Total textures",getData:()=>e.textures.length,dispose:Yv})}static AbsoluteFpsStrategy(){return e=>{const t=new Ql(e);return t.captureFrameTime=!0,{id:"Absolute FPS",getData:()=>1e3/t.frameTimeCounter.lastSecAverage,dispose:Yv}}}static MeshesSelectionStrategy(){return e=>{let t=G.F.Now,i=0;const n=e.onBeforeActiveMeshesEvaluationObservable.add((()=>{t=G.F.Now})),s=e.onAfterActiveMeshesEvaluationObservable.add((()=>{i=G.F.Now-t}));return{id:"Meshes Selection",getData:()=>i,dispose:()=>{e.onBeforeActiveMeshesEvaluationObservable.remove(n),e.onAfterActiveMeshesEvaluationObservable.remove(s)}}}}static RenderTargetsStrategy(){return e=>{let t=G.F.Now,i=0;const n=e.onBeforeRenderTargetsRenderObservable.add((()=>{t=G.F.Now})),s=e.onAfterRenderTargetsRenderObservable.add((()=>{i=G.F.Now-t}));return{id:"Render Targets",getData:()=>i,dispose:()=>{e.onBeforeRenderTargetsRenderObservable.remove(n),e.onAfterRenderTargetsRenderObservable.remove(s)}}}}static ParticlesStrategy(){return e=>{let t=G.F.Now,i=0;const n=e.onBeforeParticlesRenderingObservable.add((()=>{t=G.F.Now})),s=e.onAfterParticlesRenderingObservable.add((()=>{i=G.F.Now-t}));return{id:"Particles",getData:()=>i,dispose:()=>{e.onBeforeParticlesRenderingObservable.remove(n),e.onAfterParticlesRenderingObservable.remove(s)}}}}static SpritesStrategy(){return e=>{var t,i;let n=G.F.Now,s=0;const r=null===(t=e.onBeforeSpritesRenderingObservable)||void 0===t?void 0:t.add((()=>{n=G.F.Now})),o=null===(i=e.onAfterSpritesRenderingObservable)||void 0===i?void 0:i.add((()=>{s=G.F.Now-n}));return{id:"Sprites",getData:()=>s,dispose:()=>{var t,i;null===(t=e.onBeforeSpritesRenderingObservable)||void 0===t||t.remove(r),null===(i=e.onAfterSpritesRenderingObservable)||void 0===i||i.remove(o)}}}}static AnimationsStrategy(){return e=>{let t=G.F.Now,i=0;const n=e.onBeforeAnimationsObservable.add((()=>{t=G.F.Now})),s=e.onAfterAnimationsObservable.add((()=>{i=G.F.Now-t}));return{id:"Animations",getData:()=>i,dispose:()=>{e.onBeforeAnimationsObservable.remove(n),e.onAfterAnimationsObservable.remove(s)}}}}static PhysicsStrategy(){return e=>{var t,i;let n=G.F.Now,s=0;const r=null===(t=e.onBeforePhysicsObservable)||void 0===t?void 0:t.add((()=>{n=G.F.Now})),o=null===(i=e.onAfterPhysicsObservable)||void 0===i?void 0:i.add((()=>{s=G.F.Now-n}));return{id:"Physics",getData:()=>s,dispose:()=>{var t,i;null===(t=e.onBeforePhysicsObservable)||void 0===t||t.remove(r),null===(i=e.onAfterPhysicsObservable)||void 0===i||i.remove(o)}}}}static RenderStrategy(){return e=>{let t=G.F.Now,i=0;const n=e.onBeforeDrawPhaseObservable.add((()=>{t=G.F.Now})),s=e.onAfterDrawPhaseObservable.add((()=>{i=G.F.Now-t}));return{id:"Render",getData:()=>i,dispose:()=>{e.onBeforeDrawPhaseObservable.remove(n),e.onAfterDrawPhaseObservable.remove(s)}}}}static FrameTotalStrategy(){return e=>{let t=G.F.Now,i=0;const n=e.onBeforeAnimationsObservable.add((()=>{t=G.F.Now})),s=e.onAfterRenderObservable.add((()=>{i=G.F.Now-t}));return{id:"Frame Total",getData:()=>i,dispose:()=>{e.onBeforeAnimationsObservable.remove(n),e.onAfterRenderObservable.remove(s)}}}}static InterFrameStrategy(){return e=>{let t=G.F.Now,i=0;const n=e.onBeforeAnimationsObservable.add((()=>{i=G.F.Now-t})),s=e.onAfterRenderObservable.add((()=>{t=G.F.Now}));return{id:"Inter-frame",getData:()=>i,dispose:()=>{e.onBeforeAnimationsObservable.remove(n),e.onAfterRenderObservable.remove(s)}}}}static GpuFrameTimeStrategy(){return e=>{const t=new $l(e.getEngine());return t.captureGPUFrameTime=!0,{id:"GPU frame time",getData:()=>Math.max(1e-6*t.gpuFrameTimeCounter.current,0),dispose:()=>{t.dispose()}}}}}k.x.prototype.getPerfCollector=function(){return this._perfCollector||(this._perfCollector=new jv(this)),this._perfCollector};var Kv=i(2697);r.y$.prototype.runCoroutineAsync=function(e){if(!this._coroutineScheduler){const e=function(e){const t=new Array,i=new Array,n=new Array,s=e.add((()=>{const e=t.length;for(let s=0;s<e;s++)(0,Kv.WP)(t.shift(),i.shift(),n.shift())}));return{scheduler:(e,s,r)=>{t.push(e),i.push(s),n.push(r)},dispose:()=>{e.remove(s)}}}(this);this._coroutineScheduler=e.scheduler,this._coroutineSchedulerDispose=e.dispose}return(0,Kv.sM)(e,this._coroutineScheduler)},r.y$.prototype.cancelAllCoroutines=function(){this._coroutineSchedulerDispose&&this._coroutineSchedulerDispose(),this._coroutineScheduler=void 0,this._coroutineSchedulerDispose=void 0};class $v extends Il.F{constructor(e,t={}){super(e),this.options=t,this._direction=new o.P(0,0,-1),this._mat=new o.y3,this._onSelectEnabled=!1,this._origin=new o.P(0,0,0),this.lastNativeXRHitResults=[],this.onHitTestResultObservable=new r.y$,this._onHitTestResults=e=>{const t=e.map((e=>{const t=o.y3.FromArray(e.hitMatrix);return this._xrSessionManager.scene.useRightHandedSystem||t.toggleModelMatrixHandInPlace(),this.options.worldParentNode&&t.multiplyToRef(this.options.worldParentNode.getWorldMatrix(),t),{xrHitResult:e,transformationMatrix:t}}));this.lastNativeXRHitResults=e,this.onHitTestResultObservable.notifyObservers(t)},this._onSelect=e=>{this._onSelectEnabled&&$v.XRHitTestWithSelectEvent(e,this._xrSessionManager.referenceSpace)},this.xrNativeFeatureName="hit-test",de.w1.Warn("A newer version of this plugin is available")}static XRHitTestWithRay(e,t,i,n){return e.requestHitTest(t,i).then((e=>{const t=n||(e=>!!e.hitMatrix);return e.filter(t)}))}static XRHitTestWithSelectEvent(e,t){const i=e.frame.getPose(e.inputSource.targetRaySpace,t);if(!i)return Promise.resolve([]);const n=new XRRay(i.transform);return this.XRHitTestWithRay(e.frame.session,n,t)}attach(){return!!super.attach()&&(this.options.testOnPointerDownOnly&&this._xrSessionManager.session.addEventListener("select",this._onSelect,!1),!0)}detach(){return!!super.detach()&&(this._onSelectEnabled=!1,this._xrSessionManager.session.removeEventListener("select",this._onSelect),!0)}dispose(){super.dispose(),this.onHitTestResultObservable.clear()}_onXRFrame(e){if(!this.attached||this.options.testOnPointerDownOnly)return;const t=e.getViewerPose(this._xrSessionManager.referenceSpace);if(!t)return;o.y3.FromArrayToRef(t.transform.matrix,0,this._mat),o.P.TransformCoordinatesFromFloatsToRef(0,0,0,this._mat,this._origin),o.P.TransformCoordinatesFromFloatsToRef(0,0,-1,this._mat,this._direction),this._direction.subtractInPlace(this._origin),this._direction.normalize();const i=new XRRay({x:this._origin.x,y:this._origin.y,z:this._origin.z,w:0},{x:this._direction.x,y:this._direction.y,z:this._direction.z,w:0});$v.XRHitTestWithRay(this._xrSessionManager.session,i,this._xrSessionManager.referenceSpace).then(this._onHitTestResults)}}$v.Name=vl.b.HIT_TEST,$v.Version=1,vl.d.AddWebXRFeature($v.Name,((e,t)=>()=>new $v(e,t)),$v.Version,!1);let Qv=0;class Zv extends Il.F{set referenceSpaceForFrameAnchors(e){this._referenceSpaceForFrameAnchors=e}constructor(e,t={}){super(e),this._options=t,this._lastFrameDetected=new Set,this._trackedAnchors=[],this._futureAnchors=[],this.onAnchorAddedObservable=new r.y$,this.onAnchorRemovedObservable=new r.y$,this.onAnchorUpdatedObservable=new r.y$,this._tmpVector=new o.P,this._tmpQuaternion=new o._f,this.xrNativeFeatureName="anchors"}_populateTmpTransformation(e,t){return this._tmpVector.copyFrom(e),this._tmpQuaternion.copyFrom(t),this._xrSessionManager.scene.useRightHandedSystem||(this._tmpVector.z*=-1,this._tmpQuaternion.z*=-1,this._tmpQuaternion.w*=-1),{position:this._tmpVector,rotationQuaternion:this._tmpQuaternion}}async addAnchorPointUsingHitTestResultAsync(e,t=new o.P,i=new o._f){this._populateTmpTransformation(t,i);const n=new XRRigidTransform({x:this._tmpVector.x,y:this._tmpVector.y,z:this._tmpVector.z},{x:this._tmpQuaternion.x,y:this._tmpQuaternion.y,z:this._tmpQuaternion.z,w:this._tmpQuaternion.w});if(!e.xrHitResult.createAnchor)throw this.detach(),new Error("Anchors not enabled in this environment/browser");try{const t=await e.xrHitResult.createAnchor(n);return new Promise(((e,i)=>{this._futureAnchors.push({nativeAnchor:t,resolved:!1,submitted:!0,xrTransformation:n,resolve:e,reject:i})}))}catch(e){throw new Error(e)}}async addAnchorAtPositionAndRotationAsync(e,t=new o._f,i=!1){this._populateTmpTransformation(e,t);const n=new XRRigidTransform({x:this._tmpVector.x,y:this._tmpVector.y,z:this._tmpVector.z},{x:this._tmpQuaternion.x,y:this._tmpQuaternion.y,z:this._tmpQuaternion.z,w:this._tmpQuaternion.w}),s=i&&this.attached&&this._xrSessionManager.currentFrame?await this._createAnchorAtTransformation(n,this._xrSessionManager.currentFrame):void 0;return new Promise(((e,t)=>{this._futureAnchors.push({nativeAnchor:s,resolved:!1,submitted:!1,xrTransformation:n,resolve:e,reject:t})}))}get anchors(){return this._trackedAnchors}detach(){if(!super.detach())return!1;if(!this._options.doNotRemoveAnchorsOnSessionEnded)for(;this._trackedAnchors.length;){const e=this._trackedAnchors.pop();if(e){try{e.remove()}catch(e){}this.onAnchorRemovedObservable.notifyObservers(e)}}return!0}dispose(){this._futureAnchors.length=0,super.dispose(),this.onAnchorAddedObservable.clear(),this.onAnchorRemovedObservable.clear(),this.onAnchorUpdatedObservable.clear()}_onXRFrame(e){if(!this.attached||!e)return;const t=e.trackedAnchors;if(t){const i=this._trackedAnchors.filter((e=>!t.has(e.xrAnchor))).map((e=>this._trackedAnchors.indexOf(e)));let n=0;i.forEach((e=>{const t=this._trackedAnchors.splice(e-n,1)[0];this.onAnchorRemovedObservable.notifyObservers(t),n++})),t.forEach((t=>{if(this._lastFrameDetected.has(t)){const i=this._findIndexInAnchorArray(t),n=this._trackedAnchors[i];try{this._updateAnchorWithXRFrame(t,n,e),n.attachedNode&&(n.attachedNode.rotationQuaternion=n.attachedNode.rotationQuaternion||new o._f,n.transformationMatrix.decompose(n.attachedNode.scaling,n.attachedNode.rotationQuaternion,n.attachedNode.position)),this.onAnchorUpdatedObservable.notifyObservers(n)}catch(e){de.w1.Warn("Anchor could not be updated")}}else{const i={id:Qv++,xrAnchor:t,remove:()=>t.delete()},n=this._updateAnchorWithXRFrame(t,i,e);this._trackedAnchors.push(n),this.onAnchorAddedObservable.notifyObservers(n);const s=this._futureAnchors.filter((e=>e.nativeAnchor===t))[0];s&&(s.resolve(n),s.resolved=!0)}})),this._lastFrameDetected=t}this._futureAnchors.forEach((t=>{t.resolved||t.submitted||(this._createAnchorAtTransformation(t.xrTransformation,e).then((e=>{t.nativeAnchor=e}),(e=>{t.resolved=!0,t.reject(e)})),t.submitted=!0)}))}_findIndexInAnchorArray(e){for(let t=0;t<this._trackedAnchors.length;++t)if(this._trackedAnchors[t].xrAnchor===e)return t;return-1}_updateAnchorWithXRFrame(e,t,i){const n=i.getPose(e.anchorSpace,this._xrSessionManager.referenceSpace);if(n){const e=t.transformationMatrix||new o.y3;o.y3.FromArrayToRef(n.transform.matrix,0,e),this._xrSessionManager.scene.useRightHandedSystem||e.toggleModelMatrixHandInPlace(),t.transformationMatrix=e,this._options.worldParentNode&&e.multiplyToRef(this._options.worldParentNode.getWorldMatrix(),e)}return t}async _createAnchorAtTransformation(e,t){var i;if(!t.createAnchor)throw this.detach(),new Error("Anchors are not enabled in your browser");try{return t.createAnchor(e,null!==(i=this._referenceSpaceForFrameAnchors)&&void 0!==i?i:this._xrSessionManager.referenceSpace)}catch(e){throw new Error(e)}}}Zv.Name=vl.b.ANCHOR_SYSTEM,Zv.Version=1,vl.d.AddWebXRFeature(Zv.Name,((e,t)=>()=>new Zv(e,t)),Zv.Version);let Jv=0;class ey extends Il.F{constructor(e,t={}){super(e),this._options=t,this._detectedPlanes=[],this._enabled=!1,this._lastFrameDetected=new Set,this.onPlaneAddedObservable=new r.y$,this.onPlaneRemovedObservable=new r.y$,this.onPlaneUpdatedObservable=new r.y$,this.xrNativeFeatureName="plane-detection",this._xrSessionManager.session?this._init():this._xrSessionManager.onXRSessionInit.addOnce((()=>{this._init()}))}detach(){if(!super.detach())return!1;if(!this._options.doNotRemovePlanesOnSessionEnded)for(;this._detectedPlanes.length;){const e=this._detectedPlanes.pop();e&&this.onPlaneRemovedObservable.notifyObservers(e)}return!0}dispose(){super.dispose(),this.onPlaneAddedObservable.clear(),this.onPlaneRemovedObservable.clear(),this.onPlaneUpdatedObservable.clear()}isCompatible(){return"undefined"!=typeof XRPlane}_onXRFrame(e){var t;if(!this.attached||!this._enabled||!e)return;const i=e.detectedPlanes||(null===(t=e.worldInformation)||void 0===t?void 0:t.detectedPlanes);if(i){for(let e=0;e<this._detectedPlanes.length;e++){const t=this._detectedPlanes[e];i.has(t.xrPlane)||(this._detectedPlanes.splice(e--,1),this.onPlaneRemovedObservable.notifyObservers(t))}i.forEach((t=>{if(this._lastFrameDetected.has(t)){if(t.lastChangedTime===this._xrSessionManager.currentTimestamp){const i=this._findIndexInPlaneArray(t),n=this._detectedPlanes[i];this._updatePlaneWithXRPlane(t,n,e),this.onPlaneUpdatedObservable.notifyObservers(n)}}else{const i={id:Jv++,xrPlane:t,polygonDefinition:[]},n=this._updatePlaneWithXRPlane(t,i,e);this._detectedPlanes.push(n),this.onPlaneAddedObservable.notifyObservers(n)}})),this._lastFrameDetected=i}}_init(){const e=()=>{this._enabled=!0,this._detectedPlanes.length&&(this._detectedPlanes.length=0)};this._xrSessionManager.isNative&&this._options.preferredDetectorOptions&&this._xrSessionManager.session.trySetPreferredPlaneDetectorOptions&&this._xrSessionManager.session.trySetPreferredPlaneDetectorOptions(this._options.preferredDetectorOptions),this._xrSessionManager.session.updateWorldTrackingState?(this._xrSessionManager.session.updateWorldTrackingState({planeDetectionState:{enabled:!0}}),e()):e()}_updatePlaneWithXRPlane(e,t,i){t.polygonDefinition=e.polygon.map((e=>{const t=this._xrSessionManager.scene.useRightHandedSystem?1:-1;return new o.P(e.x,e.y,e.z*t)}));const n=i.getPose(e.planeSpace,this._xrSessionManager.referenceSpace);if(n){const e=t.transformationMatrix||new o.y3;o.y3.FromArrayToRef(n.transform.matrix,0,e),this._xrSessionManager.scene.useRightHandedSystem||e.toggleModelMatrixHandInPlace(),t.transformationMatrix=e,this._options.worldParentNode&&e.multiplyToRef(this._options.worldParentNode.getWorldMatrix(),e)}return t}_findIndexInPlaneArray(e){for(let t=0;t<this._detectedPlanes.length;++t)if(this._detectedPlanes[t].xrPlane===e)return t;return-1}}ey.Name=vl.b.PLANE_DETECTION,ey.Version=1,vl.d.AddWebXRFeature(ey.Name,((e,t)=>()=>new ey(e,t)),ey.Version);class ty extends Il.F{constructor(e,t={}){super(e),this.options=t,this.onBackgroundStateChangedObservable=new r.y$}attach(){return this._setBackgroundState(!1),super.attach()}detach(){return this._setBackgroundState(!0),super.detach()}dispose(){super.dispose(),this.onBackgroundStateChangedObservable.clear()}_onXRFrame(e){}_setBackgroundState(e){const t=this._xrSessionManager.scene;if(!this.options.ignoreEnvironmentHelper)if(this.options.environmentHelperRemovalFlags){if(this.options.environmentHelperRemovalFlags.skyBox){const i=t.getMeshByName("BackgroundSkybox");i&&i.setEnabled(e)}if(this.options.environmentHelperRemovalFlags.ground){const i=t.getMeshByName("BackgroundPlane");i&&i.setEnabled(e)}}else{const i=t.getMeshByName("BackgroundHelper");i&&i.setEnabled(e)}this.options.backgroundMeshes&&this.options.backgroundMeshes.forEach((t=>t.setEnabled(e))),this.onBackgroundStateChangedObservable.notifyObservers(e)}}ty.Name=vl.b.BACKGROUND_REMOVER,ty.Version=1,vl.d.AddWebXRFeature(ty.Name,((e,t)=>()=>new ty(e,t)),ty.Version,!0);class iy{}class ny extends Il.F{_createPhysicsImpostor(e){const t=this._options.physicsProperties.impostorType||Qn.Q.SphereImpostor,i=this._options.physicsProperties.impostorSize||.1,n=Kn("impostor-mesh-"+e.uniqueId,{diameterX:"number"==typeof i?i:i.width,diameterY:"number"==typeof i?i:i.height,diameterZ:"number"==typeof i?i:i.depth});n.isVisible=this._debugMode,n.isPickable=!1,n.rotationQuaternion=new o._f;const s=e.grip||e.pointer;n.position.copyFrom(s.position),n.rotationQuaternion.copyFrom(s.rotationQuaternion);const r=new Qn.Q(n,t,{mass:0,...this._options.physicsProperties});this._controllers[e.uniqueId]={xrController:e,impostor:r,impostorMesh:n}}constructor(e,t){super(e),this._options=t,this._attachController=e=>{this._controllers[e.uniqueId]||(this._xrSessionManager.scene.isPhysicsEnabled()||_.Y.Warn("physics engine not enabled, skipped. Please add this controller manually."),this._options.physicsProperties.useControllerMesh&&e.inputSource.gamepad?e.onMotionControllerInitObservable.addOnce((t=>{t._doNotLoadControllerMesh?this._createPhysicsImpostor(e):t.onModelLoadedObservable.addOnce((()=>{const i=new Qn.Q(t.rootMesh,Qn.Q.MeshImpostor,{mass:0,...this._options.physicsProperties}),n=e.grip||e.pointer;this._controllers[e.uniqueId]={xrController:e,impostor:i,oldPos:n.position.clone(),oldRotation:n.rotationQuaternion.clone()}}))})):this._createPhysicsImpostor(e))},this._controllers={},this._debugMode=!1,this._delta=0,this._lastTimestamp=0,this._tmpQuaternion=new o._f,this._tmpVector=new o.P,this._options.physicsProperties||(this._options.physicsProperties={})}_enablePhysicsDebug(){this._debugMode=!0,Object.keys(this._controllers).forEach((e=>{const t=this._controllers[e];t.impostorMesh&&(t.impostorMesh.isVisible=!0)}))}addController(e){this._attachController(e)}attach(){if(!super.attach())return!1;if(!this._options.xrInput)return!0;if(this._options.xrInput.controllers.forEach(this._attachController),this._addNewAttachObserver(this._options.xrInput.onControllerAddedObservable,this._attachController),this._addNewAttachObserver(this._options.xrInput.onControllerRemovedObservable,(e=>{this._detachController(e.uniqueId)})),this._options.enableHeadsetImpostor){const e=this._options.headsetImpostorParams||{impostorType:Qn.Q.SphereImpostor,restitution:.8,impostorSize:.3},t=e.impostorSize||.3;this._headsetMesh=Kn("headset-mesh",{diameterX:"number"==typeof t?t:t.width,diameterY:"number"==typeof t?t:t.height,diameterZ:"number"==typeof t?t:t.depth}),this._headsetMesh.rotationQuaternion=new o._f,this._headsetMesh.isVisible=!1,this._headsetImpostor=new Qn.Q(this._headsetMesh,e.impostorType,{mass:0,...e})}return!0}detach(){return!!super.detach()&&(Object.keys(this._controllers).forEach((e=>{this._detachController(e)})),this._headsetMesh&&this._headsetMesh.dispose(),!0)}getHeadsetImpostor(){return this._headsetImpostor}getImpostorForController(e){const t="string"==typeof e?e:e.uniqueId;return this._controllers[t]?this._controllers[t].impostor:null}setPhysicsProperties(e){this._options.physicsProperties={...this._options.physicsProperties,...e}}_onXRFrame(e){var t,i;if(this._delta=this._xrSessionManager.currentTimestamp-this._lastTimestamp,this._lastTimestamp=this._xrSessionManager.currentTimestamp,this._headsetMesh&&this._headsetImpostor){if(this._headsetMesh.position.copyFrom(this._options.xrInput.xrCamera.globalPosition),this._headsetMesh.rotationQuaternion.copyFrom(this._options.xrInput.xrCamera.absoluteRotation),null===(t=this._options.xrInput.xrCamera._lastXRViewerPose)||void 0===t?void 0:t.linearVelocity){const e=this._options.xrInput.xrCamera._lastXRViewerPose.linearVelocity;this._tmpVector.set(e.x,e.y,e.z),this._headsetImpostor.setLinearVelocity(this._tmpVector)}if(null===(i=this._options.xrInput.xrCamera._lastXRViewerPose)||void 0===i?void 0:i.angularVelocity){const e=this._options.xrInput.xrCamera._lastXRViewerPose.angularVelocity;this._tmpVector.set(e.x,e.y,e.z),this._headsetImpostor.setAngularVelocity(this._tmpVector)}}Object.keys(this._controllers).forEach((e=>{var t,i;const n=this._controllers[e],s=n.xrController.grip||n.xrController.pointer,r=n.oldPos||n.impostorMesh.position;if(null===(t=n.xrController._lastXRPose)||void 0===t?void 0:t.linearVelocity){const e=n.xrController._lastXRPose.linearVelocity;this._tmpVector.set(e.x,e.y,e.z),n.impostor.setLinearVelocity(this._tmpVector)}else s.position.subtractToRef(r,this._tmpVector),this._tmpVector.scaleInPlace(1e3/this._delta),n.impostor.setLinearVelocity(this._tmpVector);r.copyFrom(s.position),this._debugMode&&console.log(this._tmpVector,"linear");const o=n.oldRotation||n.impostorMesh.rotationQuaternion;if(null===(i=n.xrController._lastXRPose)||void 0===i?void 0:i.angularVelocity){const e=n.xrController._lastXRPose.angularVelocity;this._tmpVector.set(e.x,e.y,e.z),n.impostor.setAngularVelocity(this._tmpVector)}else if(!o.equalsWithEpsilon(s.rotationQuaternion)){o.conjugateInPlace().multiplyToRef(s.rotationQuaternion,this._tmpQuaternion);const e=Math.sqrt(this._tmpQuaternion.x*this._tmpQuaternion.x+this._tmpQuaternion.y*this._tmpQuaternion.y+this._tmpQuaternion.z*this._tmpQuaternion.z);if(this._tmpVector.set(this._tmpQuaternion.x,this._tmpQuaternion.y,this._tmpQuaternion.z),e<.001)this._tmpVector.scaleInPlace(2);else{const t=2*Math.atan2(e,this._tmpQuaternion.w);this._tmpVector.scaleInPlace(t/(e*(this._delta/1e3)))}n.impostor.setAngularVelocity(this._tmpVector)}o.copyFrom(s.rotationQuaternion),this._debugMode&&console.log(this._tmpVector,this._tmpQuaternion,"angular")}))}_detachController(e){const t=this._controllers[e];t&&(t.impostorMesh&&t.impostorMesh.dispose(),delete this._controllers[e])}}ny.Name=vl.b.PHYSICS_CONTROLLERS,ny.Version=1,vl.d.AddWebXRFeature(ny.Name,((e,t)=>()=>new ny(e,t)),ny.Version,!0);class sy extends Il.F{constructor(e,t={}){super(e),this.options=t,this._tmpMat=new o.y3,this._tmpPos=new o.P,this._tmpQuat=new o._f,this._initHitTestSource=e=>{if(!e)return;const t=new XRRay(this.options.offsetRay||{}),i={space:this.options.useReferenceSpace?e:this._xrSessionManager.viewerReferenceSpace,offsetRay:t};this.options.entityTypes&&(i.entityTypes=this.options.entityTypes),i.space?this._xrSessionManager.session.requestHitTestSource(i).then((e=>{this._xrHitTestSource&&this._xrHitTestSource.cancel(),this._xrHitTestSource=e})):de.w1.Warn("waiting for viewer reference space to initialize")},this.autoCloneTransformation=!1,this.onHitTestResultObservable=new r.y$,this.paused=!1,this.xrNativeFeatureName="hit-test",de.w1.Warn("Hit test is an experimental and unstable feature.")}attach(){if(!super.attach())return!1;if(!this._xrSessionManager.session.requestHitTestSource)return!1;if(this.options.disablePermanentHitTest||(this._xrSessionManager.referenceSpace&&this._initHitTestSource(this._xrSessionManager.referenceSpace),this._xrSessionManager.onXRReferenceSpaceChanged.add(this._initHitTestSource)),this.options.enableTransientHitTest){const e=new XRRay(this.options.transientOffsetRay||{});this._xrSessionManager.session.requestHitTestSourceForTransientInput({profile:this.options.transientHitTestProfile||"generic-touchscreen",offsetRay:e,entityTypes:this.options.entityTypes}).then((e=>{this._transientXrHitTestSource=e}))}return!0}detach(){return!!super.detach()&&(this._xrHitTestSource&&(this._xrHitTestSource.cancel(),this._xrHitTestSource=null),this._xrSessionManager.onXRReferenceSpaceChanged.removeCallback(this._initHitTestSource),this._transientXrHitTestSource&&(this._transientXrHitTestSource.cancel(),this._transientXrHitTestSource=null),!0)}dispose(){super.dispose(),this.onHitTestResultObservable.clear()}_onXRFrame(e){if(this.attached&&!this.paused){if(this._xrHitTestSource){const t=e.getHitTestResults(this._xrHitTestSource);this._processWebXRHitTestResult(t)}this._transientXrHitTestSource&&e.getHitTestResultsForTransientInput(this._transientXrHitTestSource).forEach((e=>{this._processWebXRHitTestResult(e.results,e.inputSource)}))}}_processWebXRHitTestResult(e,t){const i=[];e.forEach((e=>{const n=e.getPose(this._xrSessionManager.referenceSpace);if(!n)return;const s=n.transform.position,r=n.transform.orientation;this._tmpPos.set(s.x,s.y,s.z),this._tmpQuat.set(r.x,r.y,r.z,r.w),o.y3.FromFloat32ArrayToRefScaled(n.transform.matrix,0,1,this._tmpMat),this._xrSessionManager.scene.useRightHandedSystem||(this._tmpPos.z*=-1,this._tmpQuat.z*=-1,this._tmpQuat.w*=-1,this._tmpMat.toggleModelMatrixHandInPlace());const a={position:this.autoCloneTransformation?this._tmpPos.clone():this._tmpPos,rotationQuaternion:this.autoCloneTransformation?this._tmpQuat.clone():this._tmpQuat,transformationMatrix:this.autoCloneTransformation?this._tmpMat.clone():this._tmpMat,inputSource:t,isTransient:!!t,xrHitResult:e};i.push(a)})),this.onHitTestResultObservable.notifyObservers(i)}}sy.Name=vl.b.HIT_TEST,sy.Version=2,vl.d.AddWebXRFeature(sy.Name,((e,t)=>()=>new sy(e,t)),sy.Version,!1);class ry extends Il.F{get featurePointCloud(){return this._featurePointCloud}constructor(e){super(e),this._enabled=!1,this._featurePointCloud=[],this.onFeaturePointsAddedObservable=new r.y$,this.onFeaturePointsUpdatedObservable=new r.y$,this.xrNativeFeatureName="bjsfeature-points",this._xrSessionManager.session?this._init():this._xrSessionManager.onXRSessionInit.addOnce((()=>{this._init()}))}detach(){return!!super.detach()&&(this.featurePointCloud.length=0,!0)}dispose(){super.dispose(),this._featurePointCloud.length=0,this.onFeaturePointsUpdatedObservable.clear(),this.onFeaturePointsAddedObservable.clear()}_onXRFrame(e){if(!this.attached||!this._enabled||!e)return;const t=e.featurePointCloud;if(t&&0!==t.length){if(t.length%5!=0)throw new Error("Received malformed feature point cloud of length: "+t.length);const e=t.length/5,i=new Array,n=new Array;for(let s=0;s<e;s++){const e=5*s,r=t[e+4];this._featurePointCloud[r]?i.push(r):(this._featurePointCloud[r]={position:new o.P,confidenceValue:0},n.push(r)),this._featurePointCloud[r].position.x=t[e],this._featurePointCloud[r].position.y=t[e+1],this._featurePointCloud[r].position.z=t[e+2],this._featurePointCloud[r].confidenceValue=t[e+3]}n.length>0&&this.onFeaturePointsAddedObservable.notifyObservers(n),i.length>0&&this.onFeaturePointsUpdatedObservable.notifyObservers(i)}}_init(){this._xrSessionManager.session.trySetFeaturePointCloudEnabled&&this._xrSessionManager.session.trySetFeaturePointCloudEnabled(!0)&&(this._enabled=!0)}}ry.Name=vl.b.FEATURE_POINTS,ry.Version=1,vl.d.AddWebXRFeature(ry.Name,(e=>()=>new ry(e)),ry.Version);var oy=i(9596);let ay=0;class ly extends Il.F{constructor(e,t={}){super(e),this._options=t,this._detectedMeshes=new Map,this.onMeshAddedObservable=new r.y$,this.onMeshRemovedObservable=new r.y$,this.onMeshUpdatedObservable=new r.y$,this.xrNativeFeatureName="mesh-detection",this._xrSessionManager.session?this._init():this._xrSessionManager.onXRSessionInit.addOnce((()=>{this._init()}))}detach(){return!!super.detach()&&(this._xrSessionManager.isNative&&this._xrSessionManager.session.trySetMeshDetectorEnabled&&this._xrSessionManager.session.trySetMeshDetectorEnabled(!1),this._options.doNotRemoveMeshesOnSessionEnded||(this._detectedMeshes.forEach((e=>{this.onMeshRemovedObservable.notifyObservers(e)})),this._detectedMeshes.clear()),!0)}dispose(){super.dispose(),this.onMeshAddedObservable.clear(),this.onMeshRemovedObservable.clear(),this.onMeshUpdatedObservable.clear()}_onXRFrame(e){var t;try{if(!this.attached||!e)return;const i=null===(t=e.worldInformation)||void 0===t?void 0:t.detectedMeshes;if(i){const t=new Set;this._detectedMeshes.forEach(((e,n)=>{i.has(n)||t.add(n)})),t.forEach((e=>{const t=this._detectedMeshes.get(e);t&&(this.onMeshRemovedObservable.notifyObservers(t),this._detectedMeshes.delete(e))})),i.forEach((t=>{if(this._detectedMeshes.has(t)){if(t.lastChangedTime===this._xrSessionManager.currentTimestamp){const i=this._detectedMeshes.get(t);i&&(this._updateVertexDataWithXRMesh(t,i,e),this.onMeshUpdatedObservable.notifyObservers(i))}}else{const i={id:ay++,xrMesh:t},n=this._updateVertexDataWithXRMesh(t,i,e);this._detectedMeshes.set(t,n),this.onMeshAddedObservable.notifyObservers(n)}}))}}catch(e){console.log(e.stack)}}_init(){this._xrSessionManager.isNative&&(this._xrSessionManager.session.trySetMeshDetectorEnabled&&this._xrSessionManager.session.trySetMeshDetectorEnabled(!0),this._options.preferredDetectorOptions&&this._xrSessionManager.session.trySetPreferredMeshDetectorOptions&&this._xrSessionManager.session.trySetPreferredMeshDetectorOptions(this._options.preferredDetectorOptions))}_updateVertexDataWithXRMesh(e,t,i){if(t.xrMesh=e,t.worldParentNode=this._options.worldParentNode,this._options.convertCoordinateSystems){if(this._xrSessionManager.scene.useRightHandedSystem)t.positions=e.positions,t.normals=e.normals;else{t.positions=new Float32Array(e.positions.length);for(let i=0;i<e.positions.length;i+=3)t.positions[i]=e.positions[i],t.positions[i+1]=e.positions[i+1],t.positions[i+2]=-1*e.positions[i+2];if(e.normals){t.normals=new Float32Array(e.normals.length);for(let i=0;i<e.normals.length;i+=3)t.normals[i]=e.normals[i],t.normals[i+1]=e.normals[i+1],t.normals[i+2]=-1*e.normals[i+2]}}t.indices=e.indices;const n=i.getPose(e.meshSpace,this._xrSessionManager.referenceSpace);if(n){const e=t.transformationMatrix||new Gr.y3;Gr.y3.FromArrayToRef(n.transform.matrix,0,e),this._xrSessionManager.scene.useRightHandedSystem||e.toggleModelMatrixHandInPlace(),t.transformationMatrix=e,this._options.worldParentNode&&e.multiplyToRef(this._options.worldParentNode.getWorldMatrix(),e)}}return t}}var hy;ly.Name=vl.b.MESH_DETECTION,ly.Version=1,vl.d.AddWebXRFeature(ly.Name,((e,t)=>()=>new ly(e,t)),ly.Version,!1),function(e){e[e.NotReceived=0]="NotReceived",e[e.Waiting=1]="Waiting",e[e.Received=2]="Received"}(hy||(hy={}));class cy extends Il.F{constructor(e,t){super(e),this.options=t,this.onUntrackableImageFoundObservable=new r.y$,this.onTrackableImageFoundObservable=new r.y$,this.onTrackedImageUpdatedObservable=new r.y$,this._trackableScoreStatus=hy.NotReceived,this._trackedImages=[],this.xrNativeFeatureName="image-tracking"}attach(){return super.attach()}detach(){return super.detach()}getTrackedImageById(e){return this._trackedImages[e]||null}dispose(){super.dispose(),this._trackedImages.forEach((e=>{e.originalBitmap.close()})),this._trackedImages.length=0,this.onTrackableImageFoundObservable.clear(),this.onUntrackableImageFoundObservable.clear(),this.onTrackedImageUpdatedObservable.clear()}async getXRSessionInitExtension(){if(!this.options.images||!this.options.images.length)return{};const e=this.options.images.map((e=>"string"==typeof e.src?this._xrSessionManager.scene.getEngine()._createImageBitmapFromSource(e.src):Promise.resolve(e.src)));try{const t=await Promise.all(e);return this._originalTrackingRequest=t.map(((e,t)=>({image:e,widthInMeters:this.options.images[t].estimatedRealWorldWidth}))),{trackedImages:this._originalTrackingRequest}}catch(e){return de.w1.Error("Error loading images for tracking, WebXRImageTracking disabled for this session."),{}}}_onXRFrame(e){if(!e.getImageTrackingResults||this._trackableScoreStatus===hy.Waiting)return;if(this._trackableScoreStatus===hy.NotReceived)return void this._checkScoresAsync();const t=e.getImageTrackingResults();for(const i of t){let t=!1;const n=i.index,s=this._trackedImages[n];if(!s)continue;s.xrTrackingResult=i,s.realWorldWidth!==i.measuredWidthInMeters&&(s.realWorldWidth=i.measuredWidthInMeters,t=!0);const r=e.getPose(i.imageSpace,this._xrSessionManager.referenceSpace);if(r){const e=s.transformationMatrix;o.y3.FromArrayToRef(r.transform.matrix,0,e),this._xrSessionManager.scene.useRightHandedSystem||e.toggleModelMatrixHandInPlace(),t=!0}const a="emulated"===i.trackingState;s.emulated!==a&&(s.emulated=a,t=!0),t&&this.onTrackedImageUpdatedObservable.notifyObservers(s)}}async _checkScoresAsync(){if(!this._xrSessionManager.session.getTrackedImageScores||this._trackableScoreStatus!==hy.NotReceived)return;this._trackableScoreStatus=hy.Waiting;const e=await this._xrSessionManager.session.getTrackedImageScores();if(e&&0!==e.length){for(let t=0;t<e.length;++t)if("untrackable"==e[t])this.onUntrackableImageFoundObservable.notifyObservers(t);else{const e=this._originalTrackingRequest[t].image,i={id:t,originalBitmap:e,transformationMatrix:new o.y3,ratio:e.width/e.height};this._trackedImages[t]=i,this.onTrackableImageFoundObservable.notifyObservers(i)}this._trackableScoreStatus=e.length>0?hy.Received:hy.NotReceived}else this._trackableScoreStatus=hy.NotReceived}}cy.Name=vl.b.IMAGE_TRACKING,cy.Version=1,vl.d.AddWebXRFeature(cy.Name,((e,t)=>()=>new cy(e,t)),cy.Version,!1);class uy extends Il.F{constructor(e,t){super(e),this.options=t,this._domOverlayType=null,this._beforeXRSelectListener=null,this._element=null,this.xrNativeFeatureName="dom-overlay",de.w1.Warn("dom-overlay is an experimental and unstable feature.")}attach(){return!(!super.attach()||!this._xrSessionManager.session.domOverlayState||null===this._xrSessionManager.session.domOverlayState.type||(this._domOverlayType=this._xrSessionManager.session.domOverlayState.type,null!==this._element&&!0===this.options.supressXRSelectEvents&&(this._beforeXRSelectListener=e=>{e.preventDefault()},this._element.addEventListener("beforexrselect",this._beforeXRSelectListener)),0))}get domOverlayType(){return this._domOverlayType}dispose(){super.dispose(),null!==this._element&&this._beforeXRSelectListener&&this._element.removeEventListener("beforexrselect",this._beforeXRSelectListener)}_onXRFrame(e){}async getXRSessionInitExtension(){if(void 0===this.options.element)return de.w1.Warn('"element" option must be provided to attach xr-dom-overlay feature.'),{};if("string"==typeof this.options.element){const e=document.querySelector(this.options.element);if(null===e)return de.w1.Warn(`element not found '${this.options.element}' (not requesting xr-dom-overlay)`),{};this._element=e}else this._element=this.options.element;return{domOverlay:{root:this._element}}}}uy.Name=vl.b.DOM_OVERLAY,uy.Version=1,vl.d.AddWebXRFeature(uy.Name,((e,t)=>()=>new uy(e,t)),uy.Version,!1);class dy extends Il.F{get movementDirection(){return this._movementDirection}get movementEnabled(){return this._featureContext.movementEnabled}set movementEnabled(e){this._featureContext.movementEnabled=e}get movementOrientationFollowsViewerPose(){return this._featureContext.movementOrientationFollowsViewerPose}set movementOrientationFollowsViewerPose(e){this._featureContext.movementOrientationFollowsViewerPose=e}get movementSpeed(){return this._featureContext.movementSpeed}set movementSpeed(e){this._featureContext.movementSpeed=e}get movementThreshold(){return this._featureContext.movementThreshold}set movementThreshold(e){this._featureContext.movementThreshold=e}get rotationEnabled(){return this._featureContext.rotationEnabled}set rotationEnabled(e){this._featureContext.rotationEnabled=e}get rotationSpeed(){return this._featureContext.rotationSpeed}set rotationSpeed(e){this._featureContext.rotationSpeed=e}get rotationThreshold(){return this._featureContext.rotationThreshold}set rotationThreshold(e){this._featureContext.rotationThreshold=e}constructor(e,t){var i,n,s,r,a,l;super(e),this._controllers={},this._currentRegistrationConfigurations=[],this._movementDirection=null,this._tmpRotationMatrix=o.y3.Identity(),this._tmpTranslationDirection=new o.P,this._tmpMovementTranslation=new o.P,this._attachController=e=>{if(this._controllers[e.uniqueId])return;this._controllers[e.uniqueId]={xrController:e,registeredComponents:[]};const t=this._controllers[e.uniqueId];if("tracked-pointer"===t.xrController.inputSource.targetRayMode&&t.xrController.inputSource.gamepad){const i=()=>{if(e.motionController)for(const i of this._currentRegistrationConfigurations){let n=null;if(i.allowedComponentTypes)for(const t of i.allowedComponentTypes){const i=e.motionController.getComponentOfType(t);if(null!==i){n=i;break}}if(i.mainComponentOnly){const t=e.motionController.getMainComponent();if(null===t)continue;n=t}if("function"==typeof i.componentSelectionPredicate&&(n=i.componentSelectionPredicate(e)),n&&i.forceHandedness&&e.inputSource.handedness!==i.forceHandedness)continue;if(null===n)continue;const s={registrationConfiguration:i,component:n};t.registeredComponents.push(s),"axisChangedHandler"in i&&(s.onAxisChangedObserver=n.onAxisValueChangedObservable.add((e=>{i.axisChangedHandler(e,this._movementState,this._featureContext,this._xrInput)}))),"buttonChangedhandler"in i&&(s.onButtonChangedObserver=n.onButtonStateChangedObservable.add((()=>{n.changes.pressed&&i.buttonChangedhandler(n.changes.pressed,this._movementState,this._featureContext,this._xrInput)})))}};e.motionController?i():e.onMotionControllerInitObservable.addOnce((()=>{i()}))}},t&&void 0!==t.xrInput?(Array.isArray(t.customRegistrationConfigurations)?this._currentRegistrationConfigurations=t.customRegistrationConfigurations:this._currentRegistrationConfigurations=dy.REGISTRATIONS.default,this._featureContext={movementEnabled:t.movementEnabled||!0,movementOrientationFollowsViewerPose:null===(i=t.movementOrientationFollowsViewerPose)||void 0===i||i,movementSpeed:null!==(n=t.movementSpeed)&&void 0!==n?n:1,movementThreshold:null!==(s=t.movementThreshold)&&void 0!==s?s:.25,rotationEnabled:null===(r=t.rotationEnabled)||void 0===r||r,rotationSpeed:null!==(a=t.rotationSpeed)&&void 0!==a?a:1,rotationThreshold:null!==(l=t.rotationThreshold)&&void 0!==l?l:.25},this._movementState={moveX:0,moveY:0,rotateX:0,rotateY:0},this._xrInput=t.xrInput):de.w1.Error('WebXRControllerMovement feature requires "xrInput" option.')}attach(){return!!super.attach()&&(this._xrInput.controllers.forEach(this._attachController),this._addNewAttachObserver(this._xrInput.onControllerAddedObservable,this._attachController),this._addNewAttachObserver(this._xrInput.onControllerRemovedObservable,(e=>{this._detachController(e.uniqueId)})),!0)}detach(){return!!super.detach()&&(Object.keys(this._controllers).forEach((e=>{this._detachController(e)})),this._controllers={},!0)}_onXRFrame(e){if(this.attach){if(null===this._movementDirection&&(this._movementDirection=this._xrInput.xrCamera.rotationQuaternion.clone()),0!==this._movementState.rotateX&&this._featureContext.rotationEnabled){const e=.001*this._xrSessionManager.scene.getEngine().getDeltaTime()*this._featureContext.rotationSpeed*this._movementState.rotateX*(this._xrSessionManager.scene.useRightHandedSystem?-1:1);!0===this._featureContext.movementOrientationFollowsViewerPose?(this._xrInput.xrCamera.cameraRotation.y+=e,this._movementDirection=this._xrInput.xrCamera.rotationQuaternion.multiply(o._f.RotationYawPitchRoll(e,0,0))):this._movementDirection.multiplyInPlace(o._f.RotationYawPitchRoll(3*e,0,0))}else!0===this._featureContext.movementOrientationFollowsViewerPose&&this._movementDirection.copyFrom(this._xrInput.xrCamera.rotationQuaternion);0===this._movementState.moveX&&0===this._movementState.moveY||!this._featureContext.movementEnabled||(o.y3.FromQuaternionToRef(this._movementDirection,this._tmpRotationMatrix),this._tmpTranslationDirection.set(this._movementState.moveX,0,this._movementState.moveY*(this._xrSessionManager.scene.useRightHandedSystem?1:-1)),o.P.TransformCoordinatesToRef(this._tmpTranslationDirection,this._tmpRotationMatrix,this._tmpMovementTranslation),this._tmpMovementTranslation.scaleInPlace(this._xrInput.xrCamera._computeLocalCameraSpeed()*this._featureContext.movementSpeed),this._xrInput.xrCamera.cameraDirection.addInPlace(this._tmpMovementTranslation))}}_detachController(e){const t=this._controllers[e];if(t){for(const e of t.registeredComponents)e.onAxisChangedObserver&&e.component.onAxisValueChangedObservable.remove(e.onAxisChangedObserver),e.onButtonChangedObserver&&e.component.onButtonStateChangedObservable.remove(e.onButtonChangedObserver);delete this._controllers[e]}}}dy.Name=vl.b.MOVEMENT,dy.REGISTRATIONS={default:[{allowedComponentTypes:[xl.THUMBSTICK_TYPE,xl.TOUCHPAD_TYPE],forceHandedness:"left",axisChangedHandler:(e,t,i)=>{t.rotateX=Math.abs(e.x)>i.rotationThreshold?e.x:0,t.rotateY=Math.abs(e.y)>i.rotationThreshold?e.y:0}},{allowedComponentTypes:[xl.THUMBSTICK_TYPE,xl.TOUCHPAD_TYPE],forceHandedness:"right",axisChangedHandler:(e,t,i)=>{t.moveX=Math.abs(e.x)>i.movementThreshold?e.x:0,t.moveY=Math.abs(e.y)>i.movementThreshold?e.y:0}}]},dy.Version=1,vl.d.AddWebXRFeature(dy.Name,((e,t)=>()=>new dy(e,t)),dy.Version,!0);var py=i(4185);class fy extends Il.F{constructor(e,t){super(e),this.options=t,this._canvasContext=null,this._reflectionCubeMap=null,this._xrLightEstimate=null,this._xrLightProbe=null,this._xrWebGLBinding=null,this._lightDirection=o.P.Up().negateInPlace(),this._lightColor=a.Wo.White(),this._intensity=1,this._sphericalHarmonics=new qa._,this._cubeMapPollTime=Date.now(),this._lightEstimationPollTime=Date.now(),this._reflectionCubeMapTextureSize=16,this.directionalLight=null,this.onReflectionCubeMapUpdatedObservable=new r.y$,this._updateReflectionCubeMap=()=>{var e;if(!this._xrLightProbe)return;if(this.options.cubeMapPollInterval){const e=Date.now();if(e-this._cubeMapPollTime<this.options.cubeMapPollInterval)return;this._cubeMapPollTime=e}const t=this._getXRGLBinding().getReflectionCubeMap(this._xrLightProbe);if(t&&this._reflectionCubeMap){if(this._reflectionCubeMap._texture)null===(e=this._reflectionCubeMap._texture._hardwareTexture)||void 0===e||e.set(t),this._reflectionCubeMap._texture.getEngine().resetTextureCache();else{const e=new Ei.l(this._xrSessionManager.scene.getEngine(),Ei.S.Unknown);e.isCube=!0,e.invertY=!1,e._useSRGBBuffer="srgba8"===this.options.reflectionFormat,e.format=5,e.generateMipMaps=!0,e.type="srgba8"!==this.options.reflectionFormat?2:0,e.samplingMode=3,e.width=this._reflectionCubeMapTextureSize,e.height=this._reflectionCubeMapTextureSize,e._cachedWrapU=1,e._cachedWrapV=1,e._hardwareTexture=new Yi.B(t,this._getCanvasContext()),this._reflectionCubeMap._texture=e}this._reflectionCubeMap._texture.isReady=!0,this._xrSessionManager.scene.markAllMaterialsAsDirty(1),this.onReflectionCubeMapUpdatedObservable.notifyObservers(this._reflectionCubeMap)}},this.xrNativeFeatureName="light-estimation",this.options.createDirectionalLightSource&&(this.directionalLight=new Sa.O("light estimation directional",this._lightDirection,this._xrSessionManager.scene),this.directionalLight.position=new o.P(0,8,0),this.directionalLight.intensity=0,this.directionalLight.falloffType=py.m.FALLOFF_GLTF),de.w1.Warn("light-estimation is an experimental and unstable feature.")}get reflectionCubeMapTexture(){return this._reflectionCubeMap}get xrLightingEstimate(){return this._xrLightEstimate?{lightColor:this._lightColor,lightDirection:this._lightDirection,lightIntensity:this._intensity,sphericalHarmonics:this._sphericalHarmonics}:this._xrLightEstimate}_getCanvasContext(){return null===this._canvasContext&&(this._canvasContext=this._xrSessionManager.scene.getEngine()._gl),this._canvasContext}_getXRGLBinding(){if(null===this._xrWebGLBinding){const e=this._getCanvasContext();this._xrWebGLBinding=new XRWebGLBinding(this._xrSessionManager.session,e)}return this._xrWebGLBinding}attach(){var e;if(!super.attach())return!1;const t=null!==(e=this.options.reflectionFormat)&&void 0!==e?e:this._xrSessionManager.session.preferredReflectionFormat||"srgba8";return this.options.reflectionFormat=t,this._xrSessionManager.session.requestLightProbe({reflectionFormat:t}).then((e=>{this._xrLightProbe=e,this.options.disableCubeMapReflection||(this._reflectionCubeMap||(this._reflectionCubeMap=new Oa.V(this._xrSessionManager.scene),this._reflectionCubeMap._isCube=!0,this._reflectionCubeMap.coordinatesMode=3,this.options.setSceneEnvironmentTexture&&(this._xrSessionManager.scene.environmentTexture=this._reflectionCubeMap)),this._xrLightProbe.addEventListener("reflectionchange",this._updateReflectionCubeMap))})),!0}detach(){const e=super.detach();return null===this._xrLightProbe||this.options.disableCubeMapReflection||(this._xrLightProbe.removeEventListener("reflectionchange",this._updateReflectionCubeMap),this._xrLightProbe=null),this._canvasContext=null,this._xrLightEstimate=null,this._xrWebGLBinding=null,e}dispose(){super.dispose(),this.onReflectionCubeMapUpdatedObservable.clear(),this.directionalLight&&(this.directionalLight.dispose(),this.directionalLight=null),null!==this._reflectionCubeMap&&(this._reflectionCubeMap._texture&&this._reflectionCubeMap._texture.dispose(),this._reflectionCubeMap.dispose(),this._reflectionCubeMap=null)}_onXRFrame(e){var t;if(null!==this._xrLightProbe){if(this.options.lightEstimationPollInterval){const e=Date.now();if(e-this._lightEstimationPollTime<this.options.lightEstimationPollInterval)return;this._lightEstimationPollTime=e}if(this._xrLightEstimate=e.getLightEstimate(this._xrLightProbe),this._xrLightEstimate){this._intensity=Math.max(1,this._xrLightEstimate.primaryLightIntensity.x,this._xrLightEstimate.primaryLightIntensity.y,this._xrLightEstimate.primaryLightIntensity.z);const e=this._xrSessionManager.scene.useRightHandedSystem?1:-1;this.options.disableVectorReuse&&(this._lightDirection=new o.P,this._lightColor=new a.Wo,this.directionalLight&&(this.directionalLight.direction=this._lightDirection,this.directionalLight.diffuse=this._lightColor)),this._lightDirection.copyFromFloats(this._xrLightEstimate.primaryLightDirection.x,this._xrLightEstimate.primaryLightDirection.y,this._xrLightEstimate.primaryLightDirection.z*e),this._lightColor.copyFromFloats(this._xrLightEstimate.primaryLightIntensity.x/this._intensity,this._xrLightEstimate.primaryLightIntensity.y/this._intensity,this._xrLightEstimate.primaryLightIntensity.z/this._intensity),this._sphericalHarmonics.updateFromFloatsArray(this._xrLightEstimate.sphericalHarmonicsCoefficients),this._reflectionCubeMap&&!this.options.disableSphericalPolynomial&&(this._reflectionCubeMap.sphericalPolynomial=this._reflectionCubeMap.sphericalPolynomial||new qa.i,null===(t=this._reflectionCubeMap.sphericalPolynomial)||void 0===t||t.updateFromHarmonics(this._sphericalHarmonics)),this._lightDirection.negateInPlace(),this.directionalLight&&(this.directionalLight.direction.copyFrom(this._lightDirection),this.directionalLight.intensity=Math.min(this._intensity,1),this.directionalLight.diffuse.copyFrom(this._lightColor))}}}}fy.Name=vl.b.LIGHT_ESTIMATION,fy.Version=1,vl.d.AddWebXRFeature(fy.Name,((e,t)=>()=>new fy(e,t)),fy.Version,!1);class _y extends Il.F{constructor(e){super(e),this.onEyeTrackingStartedObservable=new r.y$,this.onEyeTrackingEndedObservable=new r.y$,this.onEyeTrackingFrameUpdateObservable=new r.y$,this._eyeTrackingStartListener=e=>{this._latestEyeSpace=e.gazeSpace,this._gazeRay=new Yt.z(o.P.Zero(),o.P.Forward()),this.onEyeTrackingStartedObservable.notifyObservers(this._gazeRay)},this._eyeTrackingEndListener=()=>{this._latestEyeSpace=null,this._gazeRay=null,this.onEyeTrackingEndedObservable.notifyObservers()},this.xrNativeFeatureName="eye-tracking",this._xrSessionManager.session?this._init():this._xrSessionManager.onXRSessionInit.addOnce((()=>{this._init()}))}dispose(){super.dispose(),this._xrSessionManager.session.removeEventListener("eyetrackingstart",this._eyeTrackingStartListener),this._xrSessionManager.session.removeEventListener("eyetrackingend",this._eyeTrackingEndListener),this.onEyeTrackingStartedObservable.clear(),this.onEyeTrackingEndedObservable.clear(),this.onEyeTrackingFrameUpdateObservable.clear()}get isEyeGazeValid(){return!!this._gazeRay}getEyeGaze(){return this._gazeRay}_onXRFrame(e){if(this.attached&&e&&this._latestEyeSpace&&this._gazeRay){const t=e.getPose(this._latestEyeSpace,this._xrSessionManager.referenceSpace);if(t){this._gazeRay.origin.set(t.transform.position.x,t.transform.position.y,t.transform.position.z);const e=t.transform.orientation;o.jp.Quaternion[0].set(e.x,e.y,e.z,e.w),this._xrSessionManager.scene.useRightHandedSystem?o.P.RightHandedForwardReadOnly.rotateByQuaternionToRef(o.jp.Quaternion[0],this._gazeRay.direction):(this._gazeRay.origin.z*=-1,o.jp.Quaternion[0].z*=-1,o.jp.Quaternion[0].w*=-1,o.P.LeftHandedForwardReadOnly.rotateByQuaternionToRef(o.jp.Quaternion[0],this._gazeRay.direction)),this.onEyeTrackingFrameUpdateObservable.notifyObservers(this._gazeRay)}}}_init(){this._xrSessionManager.isNative&&(this._xrSessionManager.session.addEventListener("eyetrackingstart",this._eyeTrackingStartListener),this._xrSessionManager.session.addEventListener("eyetrackingend",this._eyeTrackingEndListener))}}_y.Name=vl.b.EYE_TRACKING,_y.Version=1,vl.d.AddWebXRFeature(_y.Name,(e=>()=>new _y(e)),_y.Version,!1);class my{constructor(e,t){this._samples=[],this._idx=0;for(let i=0;i<e;++i)this._samples.push(t?t():o.FM.Zero())}get length(){return this._samples.length}push(e,t){this._idx=(this._idx+this._samples.length-1)%this._samples.length,this.at(0).copyFromFloats(e,t)}at(e){if(e>=this._samples.length)throw new Error("Index out of bounds");return this._samples[(this._idx+e)%this._samples.length]}}class gy{constructor(){this._samples=new my(20),this._entropy=0,this.onFirstStepDetected=new r.y$}update(e,t,i,n){this._samples.push(e,t);const s=this._samples.at(0);if(this._entropy*=this._entropyDecayFactor,this._entropy+=o.FM.Distance(s,this._samples.at(1)),this._entropy>this._entropyThreshold)return;let r;for(r=this._samePointCheckStartIdx;r<this._samples.length&&!(o.FM.DistanceSquared(s,this._samples.at(r))<this._samePointSquaredDistanceThreshold);++r);if(r===this._samples.length)return;let a=-1,l=0;for(let e,t=1;t<r;++t)e=o.FM.DistanceSquared(s,this._samples.at(t)),e>a&&(l=t,a=e);if(a<this._apexSquaredDistanceThreshold)return;const h=this._samples.at(l),c=h.subtract(s);c.normalize();const u=o.jp.Vector2[0];let d,p,f=0;for(let e=1;e<r;++e)p=this._samples.at(e),p.subtractToRef(s,u),d=o.FM.Dot(c,u),f+=u.lengthSquared()-d*d;if(f>r*this._squaredProjectionDistanceThreshold)return;const _=o.jp.Vector3[0];_.set(i,n,0);const m=o.jp.Vector3[1];m.set(c.x,c.y,0);const g=o.P.Cross(_,m).z>0,v=s.clone(),y=s.clone();h.subtractToRef(s,c),g?(c.scaleAndAddToRef(this._axisToApexShrinkFactor,v),c.scaleAndAddToRef(this._axisToApexExtendFactor,y)):(c.scaleAndAddToRef(this._axisToApexExtendFactor,v),c.scaleAndAddToRef(this._axisToApexShrinkFactor,y)),this.onFirstStepDetected.notifyObservers({leftApex:v,rightApex:y,currentPosition:s,currentStepDirection:g?"right":"left"})}reset(){for(let e=0;e<this._samples.length;++e)this._samples.at(e).copyFromFloats(0,0)}get _samePointCheckStartIdx(){return Math.floor(this._samples.length/3)}get _samePointSquaredDistanceThreshold(){return 9e-4}get _apexSquaredDistanceThreshold(){return.0081}get _squaredProjectionDistanceThreshold(){return 9e-4}get _axisToApexShrinkFactor(){return.8}get _axisToApexExtendFactor(){return-1.6}get _entropyDecayFactor(){return.93}get _entropyThreshold(){return.4}}class vy{constructor(e,t,i,n){this._leftApex=new o.FM,this._rightApex=new o.FM,this._currentPosition=new o.FM,this._axis=new o.FM,this._axisLength=-1,this._forward=new o.FM,this._steppingLeft=!1,this._t=-1,this._maxT=-1,this._maxTPosition=new o.FM,this._vitality=0,this.onMovement=new r.y$,this.onFootfall=new r.y$,this._reset(e,t,i,"left"===n)}_reset(e,t,i,n){this._leftApex.copyFrom(e),this._rightApex.copyFrom(t),this._steppingLeft=n,this._steppingLeft?(this._leftApex.subtractToRef(this._rightApex,this._axis),this._forward.copyFromFloats(-this._axis.y,this._axis.x)):(this._rightApex.subtractToRef(this._leftApex,this._axis),this._forward.copyFromFloats(this._axis.y,-this._axis.x)),this._axisLength=this._axis.length(),this._forward.scaleInPlace(1/this._axisLength),this._updateTAndVitality(i.x,i.y),this._maxT=this._t,this._maxTPosition.copyFrom(i),this._vitality=1}_updateTAndVitality(e,t){this._currentPosition.copyFromFloats(e,t),this._steppingLeft?this._currentPosition.subtractInPlace(this._rightApex):this._currentPosition.subtractInPlace(this._leftApex);const i=this._t,n=o.FM.Dot(this._currentPosition,this._axis);this._t=n/(this._axisLength*this._axisLength);const s=this._currentPosition.lengthSquared()-n/this._axisLength*(n/this._axisLength);this._vitality*=.92-100*Math.max(s-.0016,0)+Math.max(this._t-i,0)}update(e,t){if(this._vitality<this._vitalityThreshold)return!1;const i=this._t;return this._updateTAndVitality(e,t),this._t>this._maxT&&(this._maxT=this._t,this._maxTPosition.copyFromFloats(e,t)),!(this._vitality<this._vitalityThreshold||(this._t>i&&(this.onMovement.notifyObservers({deltaT:this._t-i}),i<.5&&this._t>=.5&&this.onFootfall.notifyObservers({foot:this._steppingLeft?"left":"right"})),this._t<.95*this._maxT&&(this._currentPosition.copyFromFloats(e,t),this._steppingLeft?this._leftApex.copyFrom(this._maxTPosition):this._rightApex.copyFrom(this._maxTPosition),this._reset(this._leftApex,this._rightApex,this._currentPosition,!this._steppingLeft)),this._axisLength<.03))}get _vitalityThreshold(){return.1}get forward(){return this._forward}}class yy{static get _MillisecondsPerUpdate(){return 1e3/15}constructor(e){this._detector=new gy,this._walker=null,this._movement=new o.FM,this._millisecondsSinceLastUpdate=yy._MillisecondsPerUpdate,this.movementThisFrame=o.P.Zero(),this._engine=e,this._detector.onFirstStepDetected.add((e=>{this._walker||(this._walker=new vy(e.leftApex,e.rightApex,e.currentPosition,e.currentStepDirection),this._walker.onFootfall.add((()=>{console.log("Footfall!")})),this._walker.onMovement.add((e=>{this._walker.forward.scaleAndAddToRef(.024*e.deltaT,this._movement)})))}))}update(e,t){t.y=0,t.normalize(),this._millisecondsSinceLastUpdate+=this._engine.getDeltaTime(),this._millisecondsSinceLastUpdate>=yy._MillisecondsPerUpdate&&(this._millisecondsSinceLastUpdate-=yy._MillisecondsPerUpdate,this._detector.update(e.x,e.z,t.x,t.z),this._walker&&(this._walker.update(e.x,e.z)||(this._walker=null)),this._movement.scaleInPlace(.85)),this.movementThisFrame.set(this._movement.x,0,this._movement.y)}}class xy extends Il.F{static get Name(){return vl.b.WALKING_LOCOMOTION}static get Version(){return 1}get locomotionTarget(){return this._locomotionTarget}set locomotionTarget(e){this._locomotionTarget=e,this._isLocomotionTargetWebXRCamera="WebXRCamera"===this._locomotionTarget.getClassName()}constructor(e,t){super(e),this._up=new o.P,this._forward=new o.P,this._position=new o.P,this._movement=new o.P,this._sessionManager=e,this.locomotionTarget=t.locomotionTarget,this._isLocomotionTargetWebXRCamera&&_.Y.Warn("Using walking locomotion directly on a WebXRCamera may have unintended interactions with other XR techniques. Using an XR space parent is highly recommended")}isCompatible(){return void 0===this._sessionManager.sessionMode||"immersive-vr"===this._sessionManager.sessionMode}attach(){return!(!this.isCompatible||!super.attach()||(this._walker=new yy(this._sessionManager.scene.getEngine()),0))}detach(){return!!super.detach()&&(this._walker=null,!0)}_onXRFrame(e){const t=e.getViewerPose(this._sessionManager.baseReferenceSpace);if(!t)return;const i=this.locomotionTarget.getScene().useRightHandedSystem?1:-1,n=t.transform.matrix;this._up.copyFromFloats(n[4],n[5],i*n[6]),this._forward.copyFromFloats(n[8],n[9],i*n[10]),this._position.copyFromFloats(n[12],n[13],i*n[14]),this._forward.scaleAndAddToRef(.05,this._position),this._up.scaleAndAddToRef(-.05,this._position),this._walker.update(this._position,this._forward),this._movement.copyFrom(this._walker.movementThisFrame),this._isLocomotionTargetWebXRCamera||o.P.TransformNormalToRef(this._movement,this.locomotionTarget.getWorldMatrix(),this._movement),this.locomotionTarget.position.addInPlace(this._movement)}}vl.d.AddWebXRFeature(xy.Name,((e,t)=>()=>new xy(e,t)),xy.Version,!1);class by extends Hi{constructor(e,t,i,n,s,r){super(e,t,i,n,r),this.getWidth=e,this.getHeight=t,this.layer=i,this.layerType=n,this.isMultiview=s,this.createRTTProvider=r}}class Ty extends qi{constructor(e,t,i){super(e.scene,i),this._xrSessionManager=e,this._xrWebGLBinding=t,this.layerWrapper=i,this._lastSubImages=new Map,this._compositionLayer=i.layer}_getRenderTargetForSubImage(e,t){const i=this._lastSubImages.get(t),n="left"==t?0:1;return this._renderTargetTextures[n]&&(null==i?void 0:i.textureWidth)===e.textureWidth&&(null==i?void 0:i.textureHeight)==e.textureHeight||(this._renderTargetTextures[n]=this._createRenderTargetTexture(e.textureWidth,e.textureHeight,null,e.colorTexture,e.depthStencilTexture,this.layerWrapper.isMultiview),this._framebufferDimensions={framebufferWidth:e.textureWidth,framebufferHeight:e.textureHeight}),this._lastSubImages.set(t,e),this._renderTargetTextures[n]}_getSubImageForEye(e){const t=this._xrSessionManager.currentFrame;return t?this._xrWebGLBinding.getSubImage(this._compositionLayer,t,e):null}getRenderTargetTextureForEye(e){const t=this._getSubImageForEye(e);return t?this._getRenderTargetForSubImage(t,e):null}getRenderTargetTextureForView(e){return this.getRenderTargetTextureForEye(e.eye)}_setViewportForSubImage(e,t){const i=t.textureWidth,n=t.textureHeight,s=t.viewport;e.x=s.x/i,e.y=s.y/n,e.width=s.width/i,e.height=s.height/n}trySetViewportForView(e,t){const i=this._lastSubImages.get(t.eye)||this._getSubImageForEye(t.eye);return!!i&&(this._setViewportForSubImage(e,i),!0)}}class Sy extends by{constructor(e,t,i){super((()=>e.textureWidth),(()=>e.textureHeight),e,"XRProjectionLayer",t,(e=>new Ey(e,i,this))),this.layer=e}}class Ey extends Ty{constructor(e,t,i){super(e,t,i),this.layerWrapper=i,this._projectionLayer=i.layer}_getSubImageForView(e){return this._xrWebGLBinding.getViewSubImage(this._projectionLayer,e)}getRenderTargetTextureForView(e){return this._getRenderTargetForSubImage(this._getSubImageForView(e),e.eye)}getRenderTargetTextureForEye(e){const t=this._lastSubImages.get(e);return t?this._getRenderTargetForSubImage(t,e):null}trySetViewportForView(e,t){const i=this._lastSubImages.get(t.eye)||this._getSubImageForView(t);return!!i&&(this._setViewportForSubImage(e,i),!0)}}const Cy={},Ay={textureType:"texture",colorFormat:6408,depthFormat:35056,scaleFactor:1};class Py extends Il.F{constructor(e,t={}){super(e),this._options=t,this._existingLayers=[],this.xrNativeFeatureName="layers"}attach(){if(!super.attach())return!1;const e=this._xrSessionManager.scene.getEngine();this._glContext=e._gl,this._xrWebGLBinding=new XRWebGLBinding(this._xrSessionManager.session,this._glContext),this._existingLayers.length=0;const t={...Ay},i=this._options.preferMultiviewOnInit&&e.getCaps().multiview;return i&&(t.textureType="texture-array"),this.addXRSessionLayer(this.createProjectionLayer(t,i)),!0}detach(){return!!super.detach()&&(this._existingLayers.length=0,!0)}createXRWebGLLayer(e=Cy){const t=new XRWebGLLayer(this._xrSessionManager.session,this._glContext,e);return new Ki(t)}createProjectionLayer(e=Ay,t=!1){if(t&&"texture-array"!==e.textureType)throw new Error("Projection layers can only be made multiview if they use texture arrays. Set the textureType parameter to 'texture-array'.");if(!t&&"texture-array"===e.textureType)throw new Error("We currently only support multiview rendering when the textureType parameter is set to 'texture-array'.");const i=this._xrWebGLBinding.createProjectionLayer(e);return new Sy(i,t,this._xrWebGLBinding)}addXRSessionLayer(e){this.setXRSessionLayers([...this._existingLayers,e])}setXRSessionLayers(e){this._existingLayers=e;const t={...this._xrSessionManager.session.renderState};t.baseLayer=void 0,t.layers=e.map((e=>e.layer)),this._xrSessionManager.updateRenderState(t),this._xrSessionManager._setBaseLayerWrapper(e.length>0?e[0]:null)}isCompatible(){return!this._xrSessionManager.isNative&&"undefined"!=typeof XRWebGLBinding&&!!XRWebGLBinding.prototype.createProjectionLayer}dispose(){super.dispose()}_onXRFrame(e){}}Py.Name=vl.b.LAYERS,Py.Version=1,vl.d.AddWebXRFeature(Py.Name,((e,t)=>()=>new Py(e,t)),Py.Version,!1);class Ry extends Il.F{get width(){return this._width}get height(){return this._height}get rawValueToMeters(){return this._rawValueToMeters}get normDepthBufferFromNormView(){return this._normDepthBufferFromNormView}get depthUsage(){switch(this._xrSessionManager.session.depthUsage){case"cpu-optimized":return"cpu";case"gpu-optimized":return"gpu"}}get depthDataFormat(){switch(this._xrSessionManager.session.depthDataFormat){case"luminance-alpha":return"ushort";case"float32":return"float"}}get latestInternalTexture(){var e,t;if(!this._cachedWebGLTexture)return null;const i=this._xrSessionManager.scene.getEngine(),n=new Ei.l(i,Ei.S.Unknown);return n.isCube=!1,n.invertY=!1,n._useSRGBBuffer=!1,n.format="ushort"===this.depthDataFormat?2:5,n.generateMipMaps=!1,n.type="ushort"===this.depthDataFormat?5:1,n.samplingMode=7,n.width=null!==(e=this.width)&&void 0!==e?e:0,n.height=null!==(t=this.height)&&void 0!==t?t:0,n._cachedWrapU=1,n._cachedWrapV=1,n._hardwareTexture=new Yi.B(this._cachedWebGLTexture,i._gl),n}get latestDepthBuffer(){return this._cachedDepthBuffer?"ushort"===this.depthDataFormat?new Uint16Array(this._cachedDepthBuffer):new Float32Array(this._cachedDepthBuffer):null}get latestDepthImageTexture(){return this._cachedDepthImageTexture}constructor(e,t){super(e),this.options=t,this._width=null,this._height=null,this._rawValueToMeters=null,this._normDepthBufferFromNormView=null,this._cachedDepthBuffer=null,this._cachedWebGLTexture=null,this._cachedDepthImageTexture=null,this.onGetDepthInMetersAvailable=new r.y$,this.xrNativeFeatureName="depth-sensing",de.w1.Warn("depth-sensing is an experimental and unstable feature.")}attach(e){return!!super.attach(e)&&(null!=this._xrSessionManager.session.depthDataFormat&&null!=this._xrSessionManager.session.depthUsage&&(this._glBinding=new XRWebGLBinding(this._xrSessionManager.session,this._xrSessionManager.scene.getEngine()._gl),!0))}dispose(){var e;null===(e=this._cachedDepthImageTexture)||void 0===e||e.dispose()}_onXRFrame(e){const t=this._xrSessionManager.referenceSpace,i=e.getViewerPose(t);if(null!=i)for(const t of i.views)switch(this.depthUsage){case"cpu":this._updateDepthInformationAndTextureCPUDepthUsage(e,t,this.depthDataFormat);break;case"gpu":if(!this._glBinding)break;this._updateDepthInformationAndTextureWebGLDepthUsage(this._glBinding,t,this.depthDataFormat);break;default:de.w1.Error("Unknown depth usage"),this.detach()}}_updateDepthInformationAndTextureCPUDepthUsage(e,t,i){const n=e.getDepthInformation(t);if(null===n)return;const{data:s,width:r,height:o,rawValueToMeters:a,getDepthInMeters:l}=n;switch(this._width=r,this._height=o,this._rawValueToMeters=a,this._cachedDepthBuffer=s,this.onGetDepthInMetersAvailable.notifyObservers(l.bind(n)),this._cachedDepthImageTexture||(this._cachedDepthImageTexture=Ee.l.CreateRTexture(null,r,o,this._xrSessionManager.scene,!1,!0,Ce.x.NEAREST_SAMPLINGMODE,ue.D.TEXTURETYPE_FLOAT)),i){case"ushort":this._cachedDepthImageTexture.update(Float32Array.from(new Uint16Array(s)).map((e=>e*a)));break;case"float":this._cachedDepthImageTexture.update(new Float32Array(s).map((e=>e*a)))}}_updateDepthInformationAndTextureWebGLDepthUsage(e,t,i){const n=e.getDepthInformation(t);if(null===n)return;const{texture:s,width:r,height:o}=n;this._width=r,this._height=o,this._cachedWebGLTexture=s;const a=this._xrSessionManager.scene,l=a.getEngine().wrapWebGLTexture(s);this._cachedDepthImageTexture||(this._cachedDepthImageTexture=Ee.l.CreateRTexture(null,r,o,a,!1,!0,Ce.x.NEAREST_SAMPLINGMODE,"ushort"===i?ue.D.TEXTURETYPE_UNSIGNED_BYTE:ue.D.TEXTURETYPE_FLOAT)),this._cachedDepthImageTexture._texture=l}getXRSessionInitExtension(){const e=null!=this.options.usagePreference&&0!==this.options.usagePreference.length,t=null!=this.options.dataFormatPreference&&0!==this.options.dataFormatPreference.length;return new Promise((i=>{i(e&&t?{depthSensing:{usagePreference:this.options.usagePreference.map((e=>{switch(e){case"cpu":return"cpu-optimized";case"gpu":return"gpu-optimized"}})),dataFormatPreference:this.options.dataFormatPreference.map((e=>{switch(e){case"ushort":return"luminance-alpha";case"float":return"float32"}}))}}:{})}))}}Ry.Name=vl.b.DEPTH_SENSING,Ry.Version=1,vl.d.AddWebXRFeature(Ry.Name,((e,t)=>()=>new Ry(e,t)),Ry.Version,!1);class My extends bl{constructor(e,t,i){super(e,Iy[i],t,i,!0),this.profileId="generic-hand-select-grasp"}_getFilenameAndPath(){return{filename:"generic.babylon",path:"https://controllers.babylonjs.com/generic/"}}_getModelLoadingConstraints(){return!0}_processLoadedModel(e){}_setRootMesh(e){}_updateModel(){}}Al.RegisterController("generic-hand-select-grasp",((e,t)=>new My(t,e.gamepad,e.handedness)));const Iy={left:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr-standard-trigger",visualResponses:{}},grasp:{type:"trigger",gamepadIndices:{button:4},rootNodeName:"grasp",visualResponses:{}}},gamepadMapping:"xr-standard",rootNodeName:"generic-hand-select-grasp-left",assetPath:"left.glb"},right:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr-standard-trigger",visualResponses:{}},grasp:{type:"trigger",gamepadIndices:{button:4},rootNodeName:"grasp",visualResponses:{}}},gamepadMapping:"xr-standard",rootNodeName:"generic-hand-select-grasp-right",assetPath:"right.glb"},none:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr-standard-trigger",visualResponses:{}},grasp:{type:"trigger",gamepadIndices:{button:4},rootNodeName:"grasp",visualResponses:{}}},gamepadMapping:"xr-standard",rootNodeName:"generic-hand-select-grasp-none",assetPath:"none.glb"}};class Dy extends bl{constructor(e,t,i){super(e,Oy["left-right"],t,i),this._mapping={defaultButton:{valueNodeName:"VALUE",unpressedNodeName:"UNPRESSED",pressedNodeName:"PRESSED"},defaultAxis:{valueNodeName:"VALUE",minNodeName:"MIN",maxNodeName:"MAX"},buttons:{"xr-standard-trigger":{rootNodeName:"SELECT",componentProperty:"button",states:["default","touched","pressed"]},"xr-standard-squeeze":{rootNodeName:"GRASP",componentProperty:"state",states:["pressed"]},"xr-standard-touchpad":{rootNodeName:"TOUCHPAD_PRESS",labelAnchorNodeName:"squeeze-label",touchPointNodeName:"TOUCH"},"xr-standard-thumbstick":{rootNodeName:"THUMBSTICK_PRESS",componentProperty:"state",states:["pressed"]}},axes:{"xr-standard-touchpad":{"x-axis":{rootNodeName:"TOUCHPAD_TOUCH_X"},"y-axis":{rootNodeName:"TOUCHPAD_TOUCH_Y"}},"xr-standard-thumbstick":{"x-axis":{rootNodeName:"THUMBSTICK_X"},"y-axis":{rootNodeName:"THUMBSTICK_Y"}}}},this.profileId="microsoft-mixed-reality"}_getFilenameAndPath(){let e="";return e="left"===this.handedness?Dy.MODEL_LEFT_FILENAME:Dy.MODEL_RIGHT_FILENAME,{filename:e,path:Dy.MODEL_BASE_URL+"default/"}}_getModelLoadingConstraints(){const e=ta.n.IsPluginForExtensionAvailable(".glb");return e||_.Y.Warn("glTF / glb loaded was not registered, using generic controller instead"),e}_processLoadedModel(e){this.rootMesh&&(this.getComponentIds().forEach(((e,t)=>{if(!this.disableAnimation&&e&&this.rootMesh){const i=this._mapping.buttons[e],n=i.rootNodeName;if(!n)return void _.Y.Log("Skipping unknown button at index: "+t+" with mapped name: "+e);const s=this._getChildByName(this.rootMesh,n);if(!s)return void _.Y.Warn("Missing button mesh with name: "+n);if(i.valueMesh=this._getImmediateChildByName(s,this._mapping.defaultButton.valueNodeName),i.pressedMesh=this._getImmediateChildByName(s,this._mapping.defaultButton.pressedNodeName),i.unpressedMesh=this._getImmediateChildByName(s,this._mapping.defaultButton.unpressedNodeName),i.valueMesh&&i.pressedMesh&&i.unpressedMesh){const t=this.getComponent(e);t&&t.onButtonStateChangedObservable.add((e=>{this._lerpTransform(i,e.value)}),void 0,!0)}else _.Y.Warn("Missing button submesh under mesh with name: "+n)}})),this.getComponentIds().forEach((e=>{const t=this.getComponent(e);t.isAxes()&&["x-axis","y-axis"].forEach((i=>{if(!this.rootMesh)return;const n=this._mapping.axes[e][i],s=this._getChildByName(this.rootMesh,n.rootNodeName);s?(n.valueMesh=this._getImmediateChildByName(s,this._mapping.defaultAxis.valueNodeName),n.minMesh=this._getImmediateChildByName(s,this._mapping.defaultAxis.minNodeName),n.maxMesh=this._getImmediateChildByName(s,this._mapping.defaultAxis.maxNodeName),n.valueMesh&&n.minMesh&&n.maxMesh?t&&t.onAxisValueChangedObservable.add((e=>{const t="x-axis"===i?e.x:e.y;this._lerpTransform(n,t,!0)}),void 0,!0):_.Y.Warn("Missing axis submesh under mesh with name: "+n.rootNodeName)):_.Y.Warn("Missing axis mesh with name: "+n.rootNodeName)}))})))}_setRootMesh(e){let t;this.rootMesh=new Nt.Kj(this.profileId+" "+this.handedness,this.scene),this.rootMesh.isPickable=!1;for(let i=0;i<e.length;i++){const n=e[i];n.isPickable=!1,n.parent||(t=n)}t&&t.setParent(this.rootMesh),this.scene.useRightHandedSystem||(this.rootMesh.rotationQuaternion=o._f.FromEulerAngles(0,Math.PI,0))}_updateModel(){}}Dy.MODEL_BASE_URL="https://controllers.babylonjs.com/microsoft/",Dy.MODEL_LEFT_FILENAME="left.glb",Dy.MODEL_RIGHT_FILENAME="right.glb",Al.RegisterController("windows-mixed-reality",((e,t)=>new Dy(t,e.gamepad,e.handedness)));const Oy={left:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr_standard_trigger",visualResponses:{xr_standard_trigger_pressed:{componentProperty:"button",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_trigger_pressed_value",minNodeName:"xr_standard_trigger_pressed_min",maxNodeName:"xr_standard_trigger_pressed_max"}}},"xr-standard-squeeze":{type:"squeeze",gamepadIndices:{button:1},rootNodeName:"xr_standard_squeeze",visualResponses:{xr_standard_squeeze_pressed:{componentProperty:"button",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_squeeze_pressed_value",minNodeName:"xr_standard_squeeze_pressed_min",maxNodeName:"xr_standard_squeeze_pressed_max"}}},"xr-standard-touchpad":{type:"touchpad",gamepadIndices:{button:2,xAxis:0,yAxis:1},rootNodeName:"xr_standard_touchpad",visualResponses:{xr_standard_touchpad_pressed:{componentProperty:"button",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_touchpad_pressed_value",minNodeName:"xr_standard_touchpad_pressed_min",maxNodeName:"xr_standard_touchpad_pressed_max"},xr_standard_touchpad_xaxis_pressed:{componentProperty:"xAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_touchpad_xaxis_pressed_value",minNodeName:"xr_standard_touchpad_xaxis_pressed_min",maxNodeName:"xr_standard_touchpad_xaxis_pressed_max"},xr_standard_touchpad_yaxis_pressed:{componentProperty:"yAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_touchpad_yaxis_pressed_value",minNodeName:"xr_standard_touchpad_yaxis_pressed_min",maxNodeName:"xr_standard_touchpad_yaxis_pressed_max"},xr_standard_touchpad_xaxis_touched:{componentProperty:"xAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_touchpad_xaxis_touched_value",minNodeName:"xr_standard_touchpad_xaxis_touched_min",maxNodeName:"xr_standard_touchpad_xaxis_touched_max"},xr_standard_touchpad_yaxis_touched:{componentProperty:"yAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_touchpad_yaxis_touched_value",minNodeName:"xr_standard_touchpad_yaxis_touched_min",maxNodeName:"xr_standard_touchpad_yaxis_touched_max"},xr_standard_touchpad_axes_touched:{componentProperty:"state",states:["touched","pressed"],valueNodeProperty:"visibility",valueNodeName:"xr_standard_touchpad_axes_touched_value"}},touchPointNodeName:"xr_standard_touchpad_axes_touched_value"},"xr-standard-thumbstick":{type:"thumbstick",gamepadIndices:{button:3,xAxis:2,yAxis:3},rootNodeName:"xr_standard_thumbstick",visualResponses:{xr_standard_thumbstick_pressed:{componentProperty:"button",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_thumbstick_pressed_value",minNodeName:"xr_standard_thumbstick_pressed_min",maxNodeName:"xr_standard_thumbstick_pressed_max"},xr_standard_thumbstick_xaxis_pressed:{componentProperty:"xAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_thumbstick_xaxis_pressed_value",minNodeName:"xr_standard_thumbstick_xaxis_pressed_min",maxNodeName:"xr_standard_thumbstick_xaxis_pressed_max"},xr_standard_thumbstick_yaxis_pressed:{componentProperty:"yAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_thumbstick_yaxis_pressed_value",minNodeName:"xr_standard_thumbstick_yaxis_pressed_min",maxNodeName:"xr_standard_thumbstick_yaxis_pressed_max"}}}},gamepadMapping:"xr-standard",rootNodeName:"microsoft-mixed-reality-left",assetPath:"left.glb"},right:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr_standard_trigger",visualResponses:{xr_standard_trigger_pressed:{componentProperty:"button",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_trigger_pressed_value",minNodeName:"xr_standard_trigger_pressed_min",maxNodeName:"xr_standard_trigger_pressed_max"}}},"xr-standard-squeeze":{type:"squeeze",gamepadIndices:{button:1},rootNodeName:"xr_standard_squeeze",visualResponses:{xr_standard_squeeze_pressed:{componentProperty:"button",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_squeeze_pressed_value",minNodeName:"xr_standard_squeeze_pressed_min",maxNodeName:"xr_standard_squeeze_pressed_max"}}},"xr-standard-touchpad":{type:"touchpad",gamepadIndices:{button:2,xAxis:0,yAxis:1},rootNodeName:"xr_standard_touchpad",visualResponses:{xr_standard_touchpad_pressed:{componentProperty:"button",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_touchpad_pressed_value",minNodeName:"xr_standard_touchpad_pressed_min",maxNodeName:"xr_standard_touchpad_pressed_max"},xr_standard_touchpad_xaxis_pressed:{componentProperty:"xAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_touchpad_xaxis_pressed_value",minNodeName:"xr_standard_touchpad_xaxis_pressed_min",maxNodeName:"xr_standard_touchpad_xaxis_pressed_max"},xr_standard_touchpad_yaxis_pressed:{componentProperty:"yAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_touchpad_yaxis_pressed_value",minNodeName:"xr_standard_touchpad_yaxis_pressed_min",maxNodeName:"xr_standard_touchpad_yaxis_pressed_max"},xr_standard_touchpad_xaxis_touched:{componentProperty:"xAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_touchpad_xaxis_touched_value",minNodeName:"xr_standard_touchpad_xaxis_touched_min",maxNodeName:"xr_standard_touchpad_xaxis_touched_max"},xr_standard_touchpad_yaxis_touched:{componentProperty:"yAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_touchpad_yaxis_touched_value",minNodeName:"xr_standard_touchpad_yaxis_touched_min",maxNodeName:"xr_standard_touchpad_yaxis_touched_max"},xr_standard_touchpad_axes_touched:{componentProperty:"state",states:["touched","pressed"],valueNodeProperty:"visibility",valueNodeName:"xr_standard_touchpad_axes_touched_value"}},touchPointNodeName:"xr_standard_touchpad_axes_touched_value"},"xr-standard-thumbstick":{type:"thumbstick",gamepadIndices:{button:3,xAxis:2,yAxis:3},rootNodeName:"xr_standard_thumbstick",visualResponses:{xr_standard_thumbstick_pressed:{componentProperty:"button",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_thumbstick_pressed_value",minNodeName:"xr_standard_thumbstick_pressed_min",maxNodeName:"xr_standard_thumbstick_pressed_max"},xr_standard_thumbstick_xaxis_pressed:{componentProperty:"xAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_thumbstick_xaxis_pressed_value",minNodeName:"xr_standard_thumbstick_xaxis_pressed_min",maxNodeName:"xr_standard_thumbstick_xaxis_pressed_max"},xr_standard_thumbstick_yaxis_pressed:{componentProperty:"yAxis",states:["default","touched","pressed"],valueNodeProperty:"transform",valueNodeName:"xr_standard_thumbstick_yaxis_pressed_value",minNodeName:"xr_standard_thumbstick_yaxis_pressed_min",maxNodeName:"xr_standard_thumbstick_yaxis_pressed_max"}}}},gamepadMapping:"xr-standard",rootNodeName:"microsoft-mixed-reality-right",assetPath:"right.glb"}};class wy extends bl{constructor(e,t,i,n=!1,s=!1){super(e,Ny[i],t,i),this._forceLegacyControllers=s,this.profileId="oculus-touch"}_getFilenameAndPath(){let e="";return e="left"===this.handedness?wy.MODEL_LEFT_FILENAME:wy.MODEL_RIGHT_FILENAME,{filename:e,path:this._isQuest()?wy.QUEST_MODEL_BASE_URL:wy.MODEL_BASE_URL}}_getModelLoadingConstraints(){return!0}_processLoadedModel(e){const t=this._isQuest(),i="right"===this.handedness?-1:1;this.getComponentIds().forEach((e=>{const n=e&&this.getComponent(e);n&&n.onButtonStateChangedObservable.add((n=>{if(this.rootMesh&&!this.disableAnimation)switch(e){case"xr-standard-trigger":return void(t||(this._modelRootNode.getChildren()[3].rotation.x=.2*-n.value,this._modelRootNode.getChildren()[3].position.y=.005*-n.value,this._modelRootNode.getChildren()[3].position.z=.005*-n.value));case"xr-standard-squeeze":return void(t||(this._modelRootNode.getChildren()[4].position.x=i*n.value*.0035));case"xr-standard-thumbstick":return;case"a-button":case"x-button":return void(t||(n.pressed?this._modelRootNode.getChildren()[1].position.y=-.001:this._modelRootNode.getChildren()[1].position.y=0));case"b-button":case"y-button":return void(t||(n.pressed?this._modelRootNode.getChildren()[2].position.y=-.001:this._modelRootNode.getChildren()[2].position.y=0))}}),void 0,!0)}))}_setRootMesh(e){this.rootMesh=new Nt.Kj(this.profileId+" "+this.handedness,this.scene),this.scene.useRightHandedSystem||(this.rootMesh.rotationQuaternion=o._f.FromEulerAngles(0,Math.PI,0)),e.forEach((e=>{e.isPickable=!1})),this._isQuest()?this._modelRootNode=e[0]:(this._modelRootNode=e[1],this.rootMesh.position.y=.034,this.rootMesh.position.z=.052),this._modelRootNode.parent=this.rootMesh}_updateModel(){}_isQuest(){return!!navigator.userAgent.match(/Quest/gi)&&!this._forceLegacyControllers}}wy.MODEL_BASE_URL="https://controllers.babylonjs.com/oculus/",wy.MODEL_LEFT_FILENAME="left.babylon",wy.MODEL_RIGHT_FILENAME="right.babylon",wy.QUEST_MODEL_BASE_URL="https://controllers.babylonjs.com/oculusQuest/",Al.RegisterController("oculus-touch",((e,t)=>new wy(t,e.gamepad,e.handedness))),Al.RegisterController("oculus-touch-legacy",((e,t)=>new wy(t,e.gamepad,e.handedness,!0)));const Ny={left:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr_standard_trigger",visualResponses:{}},"xr-standard-squeeze":{type:"squeeze",gamepadIndices:{button:1},rootNodeName:"xr_standard_squeeze",visualResponses:{}},"xr-standard-thumbstick":{type:"thumbstick",gamepadIndices:{button:3,xAxis:2,yAxis:3},rootNodeName:"xr_standard_thumbstick",visualResponses:{}},"x-button":{type:"button",gamepadIndices:{button:4},rootNodeName:"x_button",visualResponses:{}},"y-button":{type:"button",gamepadIndices:{button:5},rootNodeName:"y_button",visualResponses:{}},thumbrest:{type:"button",gamepadIndices:{button:6},rootNodeName:"thumbrest",visualResponses:{}}},gamepadMapping:"xr-standard",rootNodeName:"oculus-touch-v2-left",assetPath:"left.glb"},right:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr_standard_trigger",visualResponses:{}},"xr-standard-squeeze":{type:"squeeze",gamepadIndices:{button:1},rootNodeName:"xr_standard_squeeze",visualResponses:{}},"xr-standard-thumbstick":{type:"thumbstick",gamepadIndices:{button:3,xAxis:2,yAxis:3},rootNodeName:"xr_standard_thumbstick",visualResponses:{}},"a-button":{type:"button",gamepadIndices:{button:4},rootNodeName:"a_button",visualResponses:{}},"b-button":{type:"button",gamepadIndices:{button:5},rootNodeName:"b_button",visualResponses:{}},thumbrest:{type:"button",gamepadIndices:{button:6},rootNodeName:"thumbrest",visualResponses:{}}},gamepadMapping:"xr-standard",rootNodeName:"oculus-touch-v2-right",assetPath:"right.glb"}};class Fy extends bl{constructor(e,t,i){super(e,Ly[i],t,i),this.profileId="htc-vive"}_getFilenameAndPath(){return{filename:Fy.MODEL_FILENAME,path:Fy.MODEL_BASE_URL}}_getModelLoadingConstraints(){return!0}_processLoadedModel(e){this.getComponentIds().forEach((e=>{const t=e&&this.getComponent(e);t&&t.onButtonStateChangedObservable.add((t=>{if(this.rootMesh&&!this.disableAnimation)switch(e){case"xr-standard-trigger":return void(this._modelRootNode.getChildren()[6].rotation.x=.15*-t.value);case"xr-standard-touchpad":case"xr-standard-squeeze":return}}),void 0,!0)}))}_setRootMesh(e){this.rootMesh=new Nt.Kj(this.profileId+" "+this.handedness,this.scene),e.forEach((e=>{e.isPickable=!1})),this._modelRootNode=e[1],this._modelRootNode.parent=this.rootMesh,this.scene.useRightHandedSystem||(this.rootMesh.rotationQuaternion=o._f.FromEulerAngles(0,Math.PI,0))}_updateModel(){}}Fy.MODEL_BASE_URL="https://controllers.babylonjs.com/vive/",Fy.MODEL_FILENAME="wand.babylon",Al.RegisterController("htc-vive",((e,t)=>new Fy(t,e.gamepad,e.handedness)));const Ly={left:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr_standard_trigger",visualResponses:{}},"xr-standard-squeeze":{type:"squeeze",gamepadIndices:{button:1},rootNodeName:"xr_standard_squeeze",visualResponses:{}},"xr-standard-touchpad":{type:"touchpad",gamepadIndices:{button:2,xAxis:0,yAxis:1},rootNodeName:"xr_standard_touchpad",visualResponses:{}},menu:{type:"button",gamepadIndices:{button:4},rootNodeName:"menu",visualResponses:{}}},gamepadMapping:"xr-standard",rootNodeName:"htc_vive_none",assetPath:"none.glb"},right:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr_standard_trigger",visualResponses:{}},"xr-standard-squeeze":{type:"squeeze",gamepadIndices:{button:1},rootNodeName:"xr_standard_squeeze",visualResponses:{}},"xr-standard-touchpad":{type:"touchpad",gamepadIndices:{button:2,xAxis:0,yAxis:1},rootNodeName:"xr_standard_touchpad",visualResponses:{}},menu:{type:"button",gamepadIndices:{button:4},rootNodeName:"menu",visualResponses:{}}},gamepadMapping:"xr-standard",rootNodeName:"htc_vive_none",assetPath:"none.glb"},none:{selectComponentId:"xr-standard-trigger",components:{"xr-standard-trigger":{type:"trigger",gamepadIndices:{button:0},rootNodeName:"xr_standard_trigger",visualResponses:{}},"xr-standard-squeeze":{type:"squeeze",gamepadIndices:{button:1},rootNodeName:"xr_standard_squeeze",visualResponses:{}},"xr-standard-touchpad":{type:"touchpad",gamepadIndices:{button:2,xAxis:0,yAxis:1},rootNodeName:"xr_standard_touchpad",visualResponses:{}},menu:{type:"button",gamepadIndices:{button:4},rootNodeName:"menu",visualResponses:{}}},gamepadMapping:"xr-standard",rootNodeName:"htc-vive-none",assetPath:"none.glb"}};class By{get session(){return this._nativeImpl.session}constructor(e){this._nativeImpl=e,this._xrTransform=new XRRigidTransform,this._xrPose={transform:this._xrTransform,emulatedPosition:!1},this._xrPoseVectorData=new Float32Array(8),this.fillPoses=this._nativeImpl.fillPoses.bind(this._nativeImpl),this.getViewerPose=this._nativeImpl.getViewerPose.bind(this._nativeImpl),this.getHitTestResults=this._nativeImpl.getHitTestResults.bind(this._nativeImpl),this.getHitTestResultsForTransientInput=()=>{throw new Error("XRFrame.getHitTestResultsForTransientInput not supported on native.")},this.createAnchor=this._nativeImpl.createAnchor.bind(this._nativeImpl),this.getJointPose=this._nativeImpl.getJointPose.bind(this._nativeImpl),this.fillJointRadii=this._nativeImpl.fillJointRadii.bind(this._nativeImpl),this.getLightEstimate=()=>{throw new Error("XRFrame.getLightEstimate not supported on native.")},this.getImageTrackingResults=()=>{var e;return null!==(e=this._nativeImpl._imageTrackingResults)&&void 0!==e?e:[]}}getPose(e,t){if(!this._nativeImpl.getPoseData(e,t,this._xrPoseVectorData.buffer,this._xrTransform.matrix.buffer))return;const i=this._xrTransform.position;i.x=this._xrPoseVectorData[0],i.y=this._xrPoseVectorData[1],i.z=this._xrPoseVectorData[2],i.w=this._xrPoseVectorData[3];const n=this._xrTransform.orientation;return n.x=this._xrPoseVectorData[4],n.y=this._xrPoseVectorData[5],n.z=this._xrPoseVectorData[6],n.w=this._xrPoseVectorData[7],this._xrPose}get trackedAnchors(){return this._nativeImpl.trackedAnchors}get worldInformation(){return this._nativeImpl.worldInformation}get detectedPlanes(){return this._nativeImpl.detectedPlanes}get featurePointCloud(){return this._nativeImpl.featurePointCloud}getDepthInformation(e){throw new Error("This function is not available in Babylon Native")}}$s("NativeXRFrame",By)},9257:(e,t,i)=>{i.d(t,{N:()=>c});var n=i(9472),s=i(4141),r=i(3956),o=i(5757),a=i(1431),l=i(4934);class h{constructor(){this._doNotSerialize=!1,this._isDisposed=!1,this._sceneRootNodesIndex=-1,this._isEnabled=!0,this._isParentEnabled=!0,this._isReady=!0,this._onEnabledStateChangedObservable=new o.y$,this._onClonedObservable=new o.y$}}class c{static AddNodeConstructor(e,t){this._NodeConstructors[e]=t}static Construct(e,t,i,n){const s=this._NodeConstructors[e];return s?s(t,i,n):null}set accessibilityTag(e){this._accessibilityTag=e,this.onAccessibilityTagChangedObservable.notifyObservers(e)}get accessibilityTag(){return this._accessibilityTag}get doNotSerialize(){return!!this._nodeDataStorage._doNotSerialize||!!this._parentNode&&this._parentNode.doNotSerialize}set doNotSerialize(e){this._nodeDataStorage._doNotSerialize=e}isDisposed(){return this._nodeDataStorage._isDisposed}set parent(e){if(this._parentNode===e)return;const t=this._parentNode;if(this._parentNode&&void 0!==this._parentNode._children&&null!==this._parentNode._children){const t=this._parentNode._children.indexOf(this);-1!==t&&this._parentNode._children.splice(t,1),e||this._nodeDataStorage._isDisposed||this._addToSceneRootNodes()}this._parentNode=e,this._parentNode&&(void 0!==this._parentNode._children&&null!==this._parentNode._children||(this._parentNode._children=new Array),this._parentNode._children.push(this),t||this._removeFromSceneRootNodes()),this._syncParentEnabledState()}get parent(){return this._parentNode}_serializeAsParent(e){e.parentId=this.uniqueId}_addToSceneRootNodes(){-1===this._nodeDataStorage._sceneRootNodesIndex&&(this._nodeDataStorage._sceneRootNodesIndex=this._scene.rootNodes.length,this._scene.rootNodes.push(this))}_removeFromSceneRootNodes(){if(-1!==this._nodeDataStorage._sceneRootNodesIndex){const e=this._scene.rootNodes,t=e.length-1;e[this._nodeDataStorage._sceneRootNodesIndex]=e[t],e[this._nodeDataStorage._sceneRootNodesIndex]._nodeDataStorage._sceneRootNodesIndex=this._nodeDataStorage._sceneRootNodesIndex,this._scene.rootNodes.pop(),this._nodeDataStorage._sceneRootNodesIndex=-1}}get animationPropertiesOverride(){return this._animationPropertiesOverride?this._animationPropertiesOverride:this._scene.animationPropertiesOverride}set animationPropertiesOverride(e){this._animationPropertiesOverride=e}getClassName(){return"Node"}set onDispose(e){this._onDisposeObserver&&this.onDisposeObservable.remove(this._onDisposeObserver),this._onDisposeObserver=this.onDisposeObservable.add(e)}get onEnabledStateChangedObservable(){return this._nodeDataStorage._onEnabledStateChangedObservable}get onClonedObservable(){return this._nodeDataStorage._onClonedObservable}constructor(e,t=null){this._isDirty=!1,this._nodeDataStorage=new h,this.state="",this.metadata=null,this.reservedDataStore=null,this._accessibilityTag=null,this.onAccessibilityTagChangedObservable=new o.y$,this._parentContainer=null,this.animations=new Array,this._ranges={},this.onReady=null,this._currentRenderId=-1,this._parentUpdateId=-1,this._childUpdateId=-1,this._waitingParentId=null,this._waitingParentInstanceIndex=null,this._waitingParsedUniqueId=null,this._cache={},this._parentNode=null,this._children=null,this._worldMatrix=s.y3.Identity(),this._worldMatrixDeterminant=0,this._worldMatrixDeterminantIsDirty=!0,this._animationPropertiesOverride=null,this._isNode=!0,this.onDisposeObservable=new o.y$,this._onDisposeObserver=null,this._behaviors=new Array,this.name=e,this.id=e,this._scene=t||a.l.LastCreatedScene,this.uniqueId=this._scene.getUniqueId(),this._initCache()}getScene(){return this._scene}getEngine(){return this._scene.getEngine()}addBehavior(e,t=!1){return-1!==this._behaviors.indexOf(e)||(e.init(),this._scene.isLoading&&!t?this._scene.onDataLoadedObservable.addOnce((()=>{e.attach(this)})):e.attach(this),this._behaviors.push(e)),this}removeBehavior(e){const t=this._behaviors.indexOf(e);return-1===t||(this._behaviors[t].detach(),this._behaviors.splice(t,1)),this}get behaviors(){return this._behaviors}getBehaviorByName(e){for(const t of this._behaviors)if(t.name===e)return t;return null}getWorldMatrix(){return this._currentRenderId!==this._scene.getRenderId()&&this.computeWorldMatrix(),this._worldMatrix}_getWorldMatrixDeterminant(){return this._worldMatrixDeterminantIsDirty&&(this._worldMatrixDeterminantIsDirty=!1,this._worldMatrixDeterminant=this._worldMatrix.determinant()),this._worldMatrixDeterminant}get worldMatrixFromCache(){return this._worldMatrix}_initCache(){this._cache={},this._cache.parent=void 0}updateCache(e){!e&&this.isSynchronized()||(this._cache.parent=this.parent,this._updateCache())}_getActionManagerForTrigger(e,t=!0){return this.parent?this.parent._getActionManagerForTrigger(e,!1):null}_updateCache(e){}_isSynchronized(){return!0}_markSyncedWithParent(){this._parentNode&&(this._parentUpdateId=this._parentNode._childUpdateId)}isSynchronizedWithParent(){return!this._parentNode||!this._parentNode._isDirty&&this._parentUpdateId===this._parentNode._childUpdateId&&this._parentNode.isSynchronized()}isSynchronized(){return this._cache.parent!==this._parentNode?(this._cache.parent=this._parentNode,!1):!(this._parentNode&&!this.isSynchronizedWithParent())&&this._isSynchronized()}isReady(e=!1){return this._nodeDataStorage._isReady}markAsDirty(e){return this._currentRenderId=Number.MAX_VALUE,this._isDirty=!0,this}isEnabled(e=!0){return!1===e?this._nodeDataStorage._isEnabled:!!this._nodeDataStorage._isEnabled&&this._nodeDataStorage._isParentEnabled}_syncParentEnabledState(){this._nodeDataStorage._isParentEnabled=!this._parentNode||this._parentNode.isEnabled(),this._children&&this._children.forEach((e=>{e._syncParentEnabledState()}))}setEnabled(e){this._nodeDataStorage._isEnabled!==e&&(this._nodeDataStorage._isEnabled=e,this._syncParentEnabledState(),this._nodeDataStorage._onEnabledStateChangedObservable.notifyObservers(e))}isDescendantOf(e){return!!this.parent&&(this.parent===e||this.parent.isDescendantOf(e))}_getDescendants(e,t=!1,i){if(this._children)for(let n=0;n<this._children.length;n++){const s=this._children[n];i&&!i(s)||e.push(s),t||s._getDescendants(e,!1,i)}}getDescendants(e,t){const i=new Array;return this._getDescendants(i,e,t),i}getChildMeshes(e,t){const i=[];return this._getDescendants(i,e,(e=>(!t||t(e))&&void 0!==e.cullingStrategy)),i}getChildren(e,t=!0){return this.getDescendants(t,e)}_setReady(e){e!==this._nodeDataStorage._isReady&&(e?(this.onReady&&this.onReady(this),this._nodeDataStorage._isReady=!0):this._nodeDataStorage._isReady=!1)}getAnimationByName(e){for(let t=0;t<this.animations.length;t++){const i=this.animations[t];if(i.name===e)return i}return null}createAnimationRange(e,t,i){if(!this._ranges[e]){this._ranges[e]=c._AnimationRangeFactory(e,t,i);for(let n=0,s=this.animations.length;n<s;n++)this.animations[n]&&this.animations[n].createRange(e,t,i)}}deleteAnimationRange(e,t=!0){for(let i=0,n=this.animations.length;i<n;i++)this.animations[i]&&this.animations[i].deleteRange(e,t);this._ranges[e]=null}getAnimationRange(e){return this._ranges[e]||null}clone(e,t,i){const n=r.p4.Clone((()=>new c(e,this.getScene())),this);if(t&&(n.parent=t),!i){const t=this.getDescendants(!0);for(let i=0;i<t.length;i++){const s=t[i];s.clone(e+"."+s.name,n)}}return n}getAnimationRanges(){const e=[];let t;for(t in this._ranges)e.push(this._ranges[t]);return e}beginAnimation(e,t,i,n){const s=this.getAnimationRange(e);return s?this._scene.beginAnimation(this,s.from,s.to,t,i,n):null}serializeAnimationRanges(){const e=[];for(const t in this._ranges){const i=this._ranges[t];if(!i)continue;const n={};n.name=t,n.from=i.from,n.to=i.to,e.push(n)}return e}computeWorldMatrix(e){return this._worldMatrix||(this._worldMatrix=s.y3.Identity()),this._worldMatrix}dispose(e,t=!1){if(this._nodeDataStorage._isDisposed=!0,!e){const i=this.getDescendants(!0);for(const n of i)n.dispose(e,t)}this.parent?this.parent=null:this._removeFromSceneRootNodes(),this.onDisposeObservable.notifyObservers(this),this.onDisposeObservable.clear(),this.onEnabledStateChangedObservable.clear(),this.onClonedObservable.clear();for(const e of this._behaviors)e.detach();this._behaviors.length=0,this.metadata=null}static ParseAnimationRanges(e,t,i){if(t.ranges)for(let i=0;i<t.ranges.length;i++){const n=t.ranges[i];e.createAnimationRange(n.name,n.from,n.to)}}getHierarchyBoundingVectors(e=!0,t=null){let i,n;this.getScene().incrementRenderId(),this.computeWorldMatrix(!0);const r=this;if(r.getBoundingInfo&&r.subMeshes){const e=r.getBoundingInfo();i=e.boundingBox.minimumWorld.clone(),n=e.boundingBox.maximumWorld.clone()}else i=new s.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),n=new s.P(-Number.MAX_VALUE,-Number.MAX_VALUE,-Number.MAX_VALUE);if(e){const e=this.getDescendants(!1);for(const r of e){const e=r;if(e.computeWorldMatrix(!0),t&&!t(e))continue;if(!e.getBoundingInfo||0===e.getTotalVertices())continue;const o=e.getBoundingInfo().boundingBox,a=o.minimumWorld,l=o.maximumWorld;s.P.CheckExtends(a,i,n),s.P.CheckExtends(l,i,n)}}return{min:i,max:n}}}c._AnimationRangeFactory=(e,t,i)=>{throw(0,l.S)("AnimationRange")},c._NodeConstructors={},(0,n.gn)([(0,r.qC)()],c.prototype,"name",void 0),(0,n.gn)([(0,r.qC)()],c.prototype,"id",void 0),(0,n.gn)([(0,r.qC)()],c.prototype,"uniqueId",void 0),(0,n.gn)([(0,r.qC)()],c.prototype,"state",void 0),(0,n.gn)([(0,r.qC)()],c.prototype,"metadata",void 0)},1057:(e,t,i)=>{i.d(t,{x:()=>L,a:()=>R});var n=i(7257),s=i(8108),r=i(5757),o=i(5363),a=i(7090),l=i(4875),h=i(4141),c=i(5655),u=i(4475),d=i(3743),p=i(5670),f=i(2633),_=i(727),m=i(4221),g=i(2333),v=i(6797),y=i(1431),x=i(4934),b=i(1903),T=i(1803),S=i(2925),E=i(3255),C=i(3739);class A{constructor(){this._singleClick=!1,this._doubleClick=!1,this._hasSwiped=!1,this._ignore=!1}get singleClick(){return this._singleClick}get doubleClick(){return this._doubleClick}get hasSwiped(){return this._hasSwiped}get ignore(){return this._ignore}set singleClick(e){this._singleClick=e}set doubleClick(e){this._doubleClick=e}set hasSwiped(e){this._hasSwiped=e}set ignore(e){this._ignore=e}}class P{constructor(e){this._alreadyAttached=!1,this._meshPickProceed=!1,this._currentPickResult=null,this._previousPickResult=null,this._totalPointersPressed=0,this._doubleClickOccured=!1,this._isSwiping=!1,this._swipeButtonPressed=-1,this._skipPointerTap=!1,this._isMultiTouchGesture=!1,this._pointerX=0,this._pointerY=0,this._startingPointerPosition=new h.FM(0,0),this._previousStartingPointerPosition=new h.FM(0,0),this._startingPointerTime=0,this._previousStartingPointerTime=0,this._pointerCaptures={},this._meshUnderPointerId={},this._movePointerInfo=null,this._cameraObserverCount=0,this._delayedClicks=[null,null,null,null,null],this._deviceSourceManager=null,this._scene=e||y.l.LastCreatedScene,this._scene}get meshUnderPointer(){return this._movePointerInfo&&(this._movePointerInfo._generatePickInfo(),this._movePointerInfo=null),this._pointerOverMesh}getMeshUnderPointerByPointerId(e){return this._meshUnderPointerId[e]||null}get unTranslatedPointer(){return new h.FM(this._unTranslatedPointerX,this._unTranslatedPointerY)}get pointerX(){return this._pointerX}set pointerX(e){this._pointerX=e}get pointerY(){return this._pointerY}set pointerY(e){this._pointerY=e}_updatePointerPosition(e){const t=this._scene.getEngine().getInputElementClientRect();t&&(this._pointerX=e.clientX-t.left,this._pointerY=e.clientY-t.top,this._unTranslatedPointerX=this._pointerX,this._unTranslatedPointerY=this._pointerY)}_processPointerMove(e,t){const i=this._scene,n=i.getEngine(),s=n.getInputElement();s&&(s.tabIndex=n.canvasTabIndex,i.doNotHandleCursors||(s.style.cursor=i.defaultCursor)),this._setCursorAndPointerOverMesh(e,t,i);for(const t of i._pointerMoveStage){const i=!!(null==e?void 0:e.pickedMesh);e=t.action(this._unTranslatedPointerX,this._unTranslatedPointerY,e,i,s)}const r=t.inputIndex>=E.Fz.MouseWheelX&&t.inputIndex<=E.Fz.MouseWheelZ?b.kD.POINTERWHEEL:b.kD.POINTERMOVE;let o;i.onPointerMove&&(e=e||this._pickMove(t),i.onPointerMove(t,e,r)),e?(o=new b.R5(r,t,e),this._setRayOnPointerInfo(e,t)):(o=new b.R5(r,t,null,this),this._movePointerInfo=o),i.onPointerObservable.hasObservers()&&i.onPointerObservable.notifyObservers(o,r)}_setRayOnPointerInfo(e,t){const i=this._scene;e&&i._pickingAvailable&&(e.ray||(e.ray=i.createPickingRay(t.offsetX,t.offsetY,h.y3.Identity(),i.activeCamera)))}_addCameraPointerObserver(e,t){return this._cameraObserverCount++,this._scene.onPointerObservable.add(e,t)}_removeCameraPointerObserver(e){return this._cameraObserverCount--,this._scene.onPointerObservable.remove(e)}_checkForPicking(){return!!(this._scene.onPointerObservable.observers.length>this._cameraObserverCount||this._scene.onPointerPick)}_checkPrePointerObservable(e,t,i){const n=this._scene,s=new b.FV(i,t,this._unTranslatedPointerX,this._unTranslatedPointerY);return e&&(s.originalPickingInfo=e,s.ray=e.ray,e.originMesh&&(s.nearInteractionPickingInfo=e)),n.onPrePointerObservable.notifyObservers(s,i),!!s.skipOnPointerObservable}_pickMove(e){const t=this._scene,i=t.pick(this._unTranslatedPointerX,this._unTranslatedPointerY,t.pointerMovePredicate,!1,t.cameraToUseForPointers,t.pointerMoveTrianglePredicate);return this._setCursorAndPointerOverMesh(i,e,t),i}_setCursorAndPointerOverMesh(e,t,i){const n=i.getEngine().getInputElement();if(null==e?void 0:e.pickedMesh){if(this.setPointerOverMesh(e.pickedMesh,t.pointerId,e,t),!i.doNotHandleCursors&&n&&this._pointerOverMesh){const e=this._pointerOverMesh._getActionManagerForTrigger();e&&e.hasPointerTriggers&&(n.style.cursor=e.hoverCursor||i.hoverCursor)}}else this.setPointerOverMesh(null,t.pointerId,e,t)}simulatePointerMove(e,t){const i=new PointerEvent("pointermove",t);i.inputIndex=E.Fz.Move,this._checkPrePointerObservable(e,i,b.kD.POINTERMOVE)||this._processPointerMove(e,i)}simulatePointerDown(e,t){const i=new PointerEvent("pointerdown",t);i.inputIndex=i.button+2,this._checkPrePointerObservable(e,i,b.kD.POINTERDOWN)||this._processPointerDown(e,i)}_processPointerDown(e,t){const i=this._scene;if(null==e?void 0:e.pickedMesh){this._pickedDownMesh=e.pickedMesh;const n=e.pickedMesh._getActionManagerForTrigger();if(n){if(n.hasPickTriggers)switch(n.processTrigger(5,f.V.CreateNew(e.pickedMesh,t)),t.button){case 0:n.processTrigger(2,f.V.CreateNew(e.pickedMesh,t));break;case 1:n.processTrigger(4,f.V.CreateNew(e.pickedMesh,t));break;case 2:n.processTrigger(3,f.V.CreateNew(e.pickedMesh,t))}n.hasSpecificTrigger(8)&&window.setTimeout((()=>{const e=i.pick(this._unTranslatedPointerX,this._unTranslatedPointerY,(e=>e.isPickable&&e.isVisible&&e.isReady()&&e.actionManager&&e.actionManager.hasSpecificTrigger(8)&&e===this._pickedDownMesh),!1,i.cameraToUseForPointers);(null==e?void 0:e.pickedMesh)&&n&&0!==this._totalPointersPressed&&Date.now()-this._startingPointerTime>P.LongPressDelay&&!this._isPointerSwiping()&&(this._startingPointerTime=0,n.processTrigger(8,f.V.CreateNew(e.pickedMesh,t)))}),P.LongPressDelay)}}else for(const n of i._pointerDownStage)e=n.action(this._unTranslatedPointerX,this._unTranslatedPointerY,e,t,!1);let n;const s=b.kD.POINTERDOWN;e?(i.onPointerDown&&i.onPointerDown(t,e,s),n=new b.R5(s,t,e),this._setRayOnPointerInfo(e,t)):n=new b.R5(s,t,null,this),i.onPointerObservable.hasObservers()&&i.onPointerObservable.notifyObservers(n,s)}_isPointerSwiping(){return this._isSwiping}simulatePointerUp(e,t,i){const n=new PointerEvent("pointerup",t);n.inputIndex=E.Fz.Move;const s=new A;i?s.doubleClick=!0:s.singleClick=!0,this._checkPrePointerObservable(e,n,b.kD.POINTERUP)||this._processPointerUp(e,n,s)}_processPointerUp(e,t,i){const n=this._scene;if(null==e?void 0:e.pickedMesh){if(this._pickedUpMesh=e.pickedMesh,this._pickedDownMesh===this._pickedUpMesh&&(n.onPointerPick&&n.onPointerPick(t,e),i.singleClick&&!i.ignore&&n.onPointerObservable.observers.length>this._cameraObserverCount)){const i=b.kD.POINTERPICK,s=new b.R5(i,t,e);this._setRayOnPointerInfo(e,t),n.onPointerObservable.notifyObservers(s,i)}const s=e.pickedMesh._getActionManagerForTrigger();if(s&&!i.ignore){s.processTrigger(7,f.V.CreateNew(e.pickedMesh,t,e)),!i.hasSwiped&&i.singleClick&&s.processTrigger(1,f.V.CreateNew(e.pickedMesh,t,e));const n=e.pickedMesh._getActionManagerForTrigger(6);i.doubleClick&&n&&n.processTrigger(6,f.V.CreateNew(e.pickedMesh,t,e))}}else if(!i.ignore)for(const s of n._pointerUpStage)e=s.action(this._unTranslatedPointerX,this._unTranslatedPointerY,e,t,i.doubleClick);if(this._pickedDownMesh&&this._pickedDownMesh!==this._pickedUpMesh){const e=this._pickedDownMesh._getActionManagerForTrigger(16);e&&e.processTrigger(16,f.V.CreateNew(this._pickedDownMesh,t))}if(!i.ignore){const s=new b.R5(b.kD.POINTERUP,t,e);if(this._setRayOnPointerInfo(e,t),n.onPointerObservable.notifyObservers(s,b.kD.POINTERUP),n.onPointerUp&&n.onPointerUp(t,e,b.kD.POINTERUP),!i.hasSwiped&&!this._skipPointerTap&&!this._isMultiTouchGesture){let s=0;if(i.singleClick?s=b.kD.POINTERTAP:i.doubleClick&&(s=b.kD.POINTERDOUBLETAP),s){const i=new b.R5(s,t,e);n.onPointerObservable.hasObservers()&&n.onPointerObservable.hasSpecificMask(s)&&n.onPointerObservable.notifyObservers(i,s)}}}}isPointerCaptured(e=0){return this._pointerCaptures[e]}attachControl(e=!0,t=!0,i=!0,n=null){const s=this._scene,r=s.getEngine();n||(n=r.getInputElement()),this._alreadyAttached&&this.detachControl(),n&&(this._alreadyAttachedTo=n),this._deviceSourceManager=new C.U(r),this._initActionManager=e=>{if(!this._meshPickProceed){const t=s.skipPointerUpPicking||0===s._registeredActions&&!this._checkForPicking()&&!s.onPointerUp?null:s.pick(this._unTranslatedPointerX,this._unTranslatedPointerY,s.pointerUpPredicate,!1,s.cameraToUseForPointers);this._currentPickResult=t,t&&(e=t.hit&&t.pickedMesh?t.pickedMesh._getActionManagerForTrigger():null),this._meshPickProceed=!0}return e},this._delayedSimpleClick=(e,t,i)=>{if((Date.now()-this._previousStartingPointerTime>P.DoubleClickDelay&&!this._doubleClickOccured||e!==this._previousButtonPressed)&&(this._doubleClickOccured=!1,t.singleClick=!0,t.ignore=!1,this._delayedClicks[e])){const t=this._delayedClicks[e].evt,i=b.kD.POINTERTAP,n=new b.R5(i,t,this._currentPickResult);s.onPointerObservable.hasObservers()&&s.onPointerObservable.hasSpecificMask(i)&&s.onPointerObservable.notifyObservers(n,i),this._delayedClicks[e]=null}},this._initClickEvent=(e,t,i,n)=>{var s,r;const o=new A;this._currentPickResult=null;let a=null,l=e.hasSpecificMask(b.kD.POINTERPICK)||t.hasSpecificMask(b.kD.POINTERPICK)||e.hasSpecificMask(b.kD.POINTERTAP)||t.hasSpecificMask(b.kD.POINTERTAP)||e.hasSpecificMask(b.kD.POINTERDOUBLETAP)||t.hasSpecificMask(b.kD.POINTERDOUBLETAP);!l&&T.O&&(a=this._initActionManager(a,o),a&&(l=a.hasPickTriggers));let h=!1;if(l){const l=i.button;if(o.hasSwiped=this._isPointerSwiping(),!o.hasSwiped){let c=!P.ExclusiveDoubleClickMode;if(c||(c=!e.hasSpecificMask(b.kD.POINTERDOUBLETAP)&&!t.hasSpecificMask(b.kD.POINTERDOUBLETAP),c&&!T.O.HasSpecificTrigger(6)&&(a=this._initActionManager(a,o),a&&(c=!a.hasSpecificTrigger(6)))),c)(Date.now()-this._previousStartingPointerTime>P.DoubleClickDelay||l!==this._previousButtonPressed)&&(o.singleClick=!0,n(o,this._currentPickResult),h=!0);else{const e={evt:i,clickInfo:o,timeoutId:window.setTimeout(this._delayedSimpleClick.bind(this,l,o,n),P.DoubleClickDelay)};this._delayedClicks[l]=e}let u=e.hasSpecificMask(b.kD.POINTERDOUBLETAP)||t.hasSpecificMask(b.kD.POINTERDOUBLETAP);!u&&T.O.HasSpecificTrigger(6)&&(a=this._initActionManager(a,o),a&&(u=a.hasSpecificTrigger(6))),u&&(l===this._previousButtonPressed&&Date.now()-this._previousStartingPointerTime<P.DoubleClickDelay&&!this._doubleClickOccured?(o.hasSwiped||this._isPointerSwiping()?(this._doubleClickOccured=!1,this._previousStartingPointerTime=this._startingPointerTime,this._previousStartingPointerPosition.x=this._startingPointerPosition.x,this._previousStartingPointerPosition.y=this._startingPointerPosition.y,this._previousButtonPressed=l,P.ExclusiveDoubleClickMode?(this._delayedClicks[l]&&(clearTimeout(null===(r=this._delayedClicks[l])||void 0===r?void 0:r.timeoutId),this._delayedClicks[l]=null),n(o,this._previousPickResult)):n(o,this._currentPickResult)):(this._previousStartingPointerTime=0,this._doubleClickOccured=!0,o.doubleClick=!0,o.ignore=!1,P.ExclusiveDoubleClickMode&&this._delayedClicks[l]&&(clearTimeout(null===(s=this._delayedClicks[l])||void 0===s?void 0:s.timeoutId),this._delayedClicks[l]=null),n(o,this._currentPickResult)),h=!0):(this._doubleClickOccured=!1,this._previousStartingPointerTime=this._startingPointerTime,this._previousStartingPointerPosition.x=this._startingPointerPosition.x,this._previousStartingPointerPosition.y=this._startingPointerPosition.y,this._previousButtonPressed=l))}}h||n(o,this._currentPickResult)},this._onPointerMove=e=>{if(this._updatePointerPosition(e),this._isSwiping||-1===this._swipeButtonPressed||(this._isSwiping=Math.abs(this._startingPointerPosition.x-this._pointerX)>P.DragMovementThreshold||Math.abs(this._startingPointerPosition.y-this._pointerY)>P.DragMovementThreshold),r.isPointerLock&&r._verifyPointerLock(),this._checkPrePointerObservable(null,e,e.inputIndex>=E.Fz.MouseWheelX&&e.inputIndex<=E.Fz.MouseWheelZ?b.kD.POINTERWHEEL:b.kD.POINTERMOVE))return;if(!s.cameraToUseForPointers&&!s.activeCamera)return;if(s.skipPointerMovePicking)return void this._processPointerMove(new p.p,e);s.pointerMovePredicate||(s.pointerMovePredicate=e=>e.isPickable&&e.isVisible&&e.isReady()&&e.isEnabled()&&(e.enablePointerMoveEvents||s.constantlyUpdateMeshUnderPointer||null!==e._getActionManagerForTrigger())&&(!s.cameraToUseForPointers||0!=(s.cameraToUseForPointers.layerMask&e.layerMask)));const t=s._registeredActions>0?this._pickMove(e):null;this._processPointerMove(t,e)},this._onPointerDown=e=>{var t;if(this._totalPointersPressed++,this._pickedDownMesh=null,this._meshPickProceed=!1,P.ExclusiveDoubleClickMode)for(let i=0;i<this._delayedClicks.length;i++)if(this._delayedClicks[i])if(e.button===i)clearTimeout(null===(t=this._delayedClicks[i])||void 0===t?void 0:t.timeoutId);else{const e=this._delayedClicks[i].clickInfo;this._doubleClickOccured=!1,e.singleClick=!0,e.ignore=!1;const t=this._delayedClicks[i].evt,n=b.kD.POINTERTAP,r=new b.R5(n,t,this._currentPickResult);s.onPointerObservable.hasObservers()&&s.onPointerObservable.hasSpecificMask(n)&&s.onPointerObservable.notifyObservers(r,n),this._delayedClicks[i]=null}if(this._updatePointerPosition(e),-1===this._swipeButtonPressed&&(this._swipeButtonPressed=e.button),s.preventDefaultOnPointerDown&&n&&(e.preventDefault(),n.focus()),this._startingPointerPosition.x=this._pointerX,this._startingPointerPosition.y=this._pointerY,this._startingPointerTime=Date.now(),this._checkPrePointerObservable(null,e,b.kD.POINTERDOWN))return;if(!s.cameraToUseForPointers&&!s.activeCamera)return;let i;this._pointerCaptures[e.pointerId]=!0,s.pointerDownPredicate||(s.pointerDownPredicate=e=>e.isPickable&&e.isVisible&&e.isReady()&&e.isEnabled()&&(!s.cameraToUseForPointers||0!=(s.cameraToUseForPointers.layerMask&e.layerMask))),this._pickedDownMesh=null,i=s.skipPointerDownPicking||0===s._registeredActions&&!this._checkForPicking()&&!s.onPointerDown?new p.p:s.pick(this._unTranslatedPointerX,this._unTranslatedPointerY,s.pointerDownPredicate,!1,s.cameraToUseForPointers),this._processPointerDown(i,e)},this._onPointerUp=e=>{0!==this._totalPointersPressed&&(this._totalPointersPressed--,this._pickedUpMesh=null,this._meshPickProceed=!1,this._updatePointerPosition(e),s.preventDefaultOnPointerUp&&n&&(e.preventDefault(),n.focus()),this._initClickEvent(s.onPrePointerObservable,s.onPointerObservable,e,((t,i)=>{if(s.onPrePointerObservable.hasObservers()&&(this._skipPointerTap=!1,!t.ignore)){if(this._checkPrePointerObservable(null,e,b.kD.POINTERUP))return void(this._swipeButtonPressed===e.button&&(this._isSwiping=!1,this._swipeButtonPressed=-1));t.hasSwiped||(t.singleClick&&s.onPrePointerObservable.hasSpecificMask(b.kD.POINTERTAP)&&this._checkPrePointerObservable(null,e,b.kD.POINTERTAP)&&(this._skipPointerTap=!0),t.doubleClick&&s.onPrePointerObservable.hasSpecificMask(b.kD.POINTERDOUBLETAP)&&this._checkPrePointerObservable(null,e,b.kD.POINTERDOUBLETAP)&&(this._skipPointerTap=!0))}this._pointerCaptures[e.pointerId]?(0===e.buttons&&(this._pointerCaptures[e.pointerId]=!1),(s.cameraToUseForPointers||s.activeCamera)&&(s.pointerUpPredicate||(s.pointerUpPredicate=e=>e.isPickable&&e.isVisible&&e.isReady()&&e.isEnabled()&&(!s.cameraToUseForPointers||0!=(s.cameraToUseForPointers.layerMask&e.layerMask))),!this._meshPickProceed&&(T.O&&T.O.HasTriggers||this._checkForPicking()||s.onPointerUp)&&this._initActionManager(null,t),i||(i=this._currentPickResult),this._processPointerUp(i,e,t),this._previousPickResult=this._currentPickResult,this._swipeButtonPressed===e.button&&(this._isSwiping=!1,this._swipeButtonPressed=-1))):this._swipeButtonPressed===e.button&&(this._isSwiping=!1,this._swipeButtonPressed=-1)})))},this._onKeyDown=e=>{const t=S.OG.KEYDOWN;if(s.onPreKeyboardObservable.hasObservers()){const i=new S.WZ(t,e);if(s.onPreKeyboardObservable.notifyObservers(i,t),i.skipOnKeyboardObservable)return}if(s.onKeyboardObservable.hasObservers()){const i=new S.NG(t,e);s.onKeyboardObservable.notifyObservers(i,t)}s.actionManager&&s.actionManager.processTrigger(14,f.V.CreateNewFromScene(s,e))},this._onKeyUp=e=>{const t=S.OG.KEYUP;if(s.onPreKeyboardObservable.hasObservers()){const i=new S.WZ(t,e);if(s.onPreKeyboardObservable.notifyObservers(i,t),i.skipOnKeyboardObservable)return}if(s.onKeyboardObservable.hasObservers()){const i=new S.NG(t,e);s.onKeyboardObservable.notifyObservers(i,t)}s.actionManager&&s.actionManager.processTrigger(15,f.V.CreateNewFromScene(s,e))},this._deviceSourceManager.onDeviceConnectedObservable.add((n=>{n.deviceType===E.Yi.Mouse?n.onInputChangedObservable.add((s=>{s.inputIndex===E.Fz.LeftClick||s.inputIndex===E.Fz.MiddleClick||s.inputIndex===E.Fz.RightClick||s.inputIndex===E.Fz.BrowserBack||s.inputIndex===E.Fz.BrowserForward?t&&1===n.getInput(s.inputIndex)?this._onPointerDown(s):e&&0===n.getInput(s.inputIndex)&&this._onPointerUp(s):i&&(s.inputIndex===E.Fz.Move?this._onPointerMove(s):s.inputIndex!==E.Fz.MouseWheelX&&s.inputIndex!==E.Fz.MouseWheelY&&s.inputIndex!==E.Fz.MouseWheelZ||this._onPointerMove(s))})):n.deviceType===E.Yi.Touch?n.onInputChangedObservable.add((s=>{s.inputIndex===E.Fz.LeftClick&&(t&&1===n.getInput(s.inputIndex)?(this._onPointerDown(s),this._totalPointersPressed>1&&(this._isMultiTouchGesture=!0)):e&&0===n.getInput(s.inputIndex)&&(this._onPointerUp(s),0===this._totalPointersPressed&&(this._isMultiTouchGesture=!1))),i&&s.inputIndex===E.Fz.Move&&this._onPointerMove(s)})):n.deviceType===E.Yi.Keyboard&&n.onInputChangedObservable.add((e=>{"keydown"===e.type?this._onKeyDown(e):"keyup"===e.type&&this._onKeyUp(e)}))})),this._alreadyAttached=!0}detachControl(){this._alreadyAttached&&(this._deviceSourceManager.dispose(),this._deviceSourceManager=null,this._alreadyAttachedTo&&!this._scene.doNotHandleCursors&&(this._alreadyAttachedTo.style.cursor=this._scene.defaultCursor),this._alreadyAttached=!1,this._alreadyAttachedTo=null)}setPointerOverMesh(e,t=0,i,n){if(!(this._meshUnderPointerId[t]!==e||e&&e._internalAbstractMeshDataInfo._pointerOverDisableMeshTesting))return;const s=this._meshUnderPointerId[t];let r;s&&(r=s._getActionManagerForTrigger(10),r&&r.processTrigger(10,f.V.CreateNew(s,n,{pointerId:t}))),e?(this._meshUnderPointerId[t]=e,this._pointerOverMesh=e,r=e._getActionManagerForTrigger(9),r&&r.processTrigger(9,f.V.CreateNew(e,n,{pointerId:t,pickResult:i}))):(delete this._meshUnderPointerId[t],this._pointerOverMesh=null)}getPointerOverMesh(){return this.meshUnderPointer}_invalidateMesh(e){this._pointerOverMesh===e&&(this._pointerOverMesh=null),this._pickedDownMesh===e&&(this._pickedDownMesh=null),this._pickedUpMesh===e&&(this._pickedUpMesh=null);for(const t in this._meshUnderPointerId)this._meshUnderPointerId[t]===e&&delete this._meshUnderPointerId[t]}}P.DragMovementThreshold=10,P.LongPressDelay=500,P.DoubleClickDelay=300,P.ExclusiveDoubleClickMode=!1;var R,M=i(8215),I=i(4649),D=i(1560),O=i(8718),w=i(5661),N=i(4185),F=i(5860);!function(e){e[e.BackwardCompatible=0]="BackwardCompatible",e[e.Intermediate=1]="Intermediate",e[e.Aggressive=2]="Aggressive"}(R||(R={}));class L extends c.p{static DefaultMaterialFactory(e){throw(0,x.S)("StandardMaterial")}static CollisionCoordinatorFactory(){throw(0,x.S)("DefaultCollisionCoordinator")}get environmentTexture(){return this._environmentTexture}set environmentTexture(e){this._environmentTexture!==e&&(this._environmentTexture=e,this.markAllMaterialsAsDirty(1))}get imageProcessingConfiguration(){return this._imageProcessingConfiguration}get performancePriority(){return this._performancePriority}set performancePriority(e){if(e!==this._performancePriority){switch(this._performancePriority=e,e){case R.BackwardCompatible:this.skipFrustumClipping=!1,this._renderingManager.maintainStateBetweenFrames=!1,this.skipPointerMovePicking=!1,this.autoClear=!0;break;case R.Intermediate:this.skipFrustumClipping=!1,this._renderingManager.maintainStateBetweenFrames=!1,this.skipPointerMovePicking=!0,this.autoClear=!1;break;case R.Aggressive:this.skipFrustumClipping=!0,this._renderingManager.maintainStateBetweenFrames=!0,this.skipPointerMovePicking=!0,this.autoClear=!1}this.onScenePerformancePriorityChangedObservable.notifyObservers(e)}}set forceWireframe(e){this._forceWireframe!==e&&(this._forceWireframe=e,this.markAllMaterialsAsDirty(16))}get forceWireframe(){return this._forceWireframe}set skipFrustumClipping(e){this._skipFrustumClipping!==e&&(this._skipFrustumClipping=e)}get skipFrustumClipping(){return this._skipFrustumClipping}set forcePointsCloud(e){this._forcePointsCloud!==e&&(this._forcePointsCloud=e,this.markAllMaterialsAsDirty(16))}get forcePointsCloud(){return this._forcePointsCloud}get animationPropertiesOverride(){return this._animationPropertiesOverride}set animationPropertiesOverride(e){this._animationPropertiesOverride=e}set onDispose(e){this._onDisposeObserver&&this.onDisposeObservable.remove(this._onDisposeObserver),this._onDisposeObserver=this.onDisposeObservable.add(e)}set beforeRender(e){this._onBeforeRenderObserver&&this.onBeforeRenderObservable.remove(this._onBeforeRenderObserver),e&&(this._onBeforeRenderObserver=this.onBeforeRenderObservable.add(e))}set afterRender(e){this._onAfterRenderObserver&&this.onAfterRenderObservable.remove(this._onAfterRenderObserver),e&&(this._onAfterRenderObserver=this.onAfterRenderObservable.add(e))}set beforeCameraRender(e){this._onBeforeCameraRenderObserver&&this.onBeforeCameraRenderObservable.remove(this._onBeforeCameraRenderObserver),this._onBeforeCameraRenderObserver=this.onBeforeCameraRenderObservable.add(e)}set afterCameraRender(e){this._onAfterCameraRenderObserver&&this.onAfterCameraRenderObservable.remove(this._onAfterCameraRenderObserver),this._onAfterCameraRenderObserver=this.onAfterCameraRenderObservable.add(e)}get unTranslatedPointer(){return this._inputManager.unTranslatedPointer}static get DragMovementThreshold(){return P.DragMovementThreshold}static set DragMovementThreshold(e){P.DragMovementThreshold=e}static get LongPressDelay(){return P.LongPressDelay}static set LongPressDelay(e){P.LongPressDelay=e}static get DoubleClickDelay(){return P.DoubleClickDelay}static set DoubleClickDelay(e){P.DoubleClickDelay=e}static get ExclusiveDoubleClickMode(){return P.ExclusiveDoubleClickMode}static set ExclusiveDoubleClickMode(e){P.ExclusiveDoubleClickMode=e}bindEyePosition(e,t="vEyePosition",i=!1){var n;const s=this._forcedViewPosition?this._forcedViewPosition:this._mirroredCameraPosition?this._mirroredCameraPosition:null!==(n=this.activeCamera.globalPosition)&&void 0!==n?n:this.activeCamera.devicePosition,r=this.useRightHandedSystem===(null!=this._mirroredCameraPosition);return h.jp.Vector4[0].set(s.x,s.y,s.z,r?-1:1),e&&(i?e.setFloat3(t,h.jp.Vector4[0].x,h.jp.Vector4[0].y,h.jp.Vector4[0].z):e.setVector4(t,h.jp.Vector4[0])),h.jp.Vector4[0]}finalizeSceneUbo(){const e=this.getSceneUniformBuffer(),t=this.bindEyePosition(null);return e.updateFloat4("vEyePosition",t.x,t.y,t.z,t.w),e.update(),e}set useRightHandedSystem(e){this._useRightHandedSystem!==e&&(this._useRightHandedSystem=e,this.markAllMaterialsAsDirty(16))}get useRightHandedSystem(){return this._useRightHandedSystem}setStepId(e){this._currentStepId=e}getStepId(){return this._currentStepId}getInternalStep(){return this._currentInternalStep}set fogEnabled(e){this._fogEnabled!==e&&(this._fogEnabled=e,this.markAllMaterialsAsDirty(16))}get fogEnabled(){return this._fogEnabled}set fogMode(e){this._fogMode!==e&&(this._fogMode=e,this.markAllMaterialsAsDirty(16))}get fogMode(){return this._fogMode}get prePass(){return!!this.prePassRenderer&&this.prePassRenderer.defaultRT.enabled}set shadowsEnabled(e){this._shadowsEnabled!==e&&(this._shadowsEnabled=e,this.markAllMaterialsAsDirty(2))}get shadowsEnabled(){return this._shadowsEnabled}set lightsEnabled(e){this._lightsEnabled!==e&&(this._lightsEnabled=e,this.markAllMaterialsAsDirty(2))}get lightsEnabled(){return this._lightsEnabled}get activeCameras(){return this._activeCameras}set activeCameras(e){this._unObserveActiveCameras&&(this._unObserveActiveCameras(),this._unObserveActiveCameras=null),e&&(this._unObserveActiveCameras=(0,F.M)(e,(()=>{this.onActiveCamerasChanged.notifyObservers(this)}))),this._activeCameras=e}get activeCamera(){return this._activeCamera}set activeCamera(e){e!==this._activeCamera&&(this._activeCamera=e,this.onActiveCameraChanged.notifyObservers(this))}get defaultMaterial(){return this._defaultMaterial||(this._defaultMaterial=L.DefaultMaterialFactory(this)),this._defaultMaterial}set defaultMaterial(e){this._defaultMaterial=e}set texturesEnabled(e){this._texturesEnabled!==e&&(this._texturesEnabled=e,this.markAllMaterialsAsDirty(1))}get texturesEnabled(){return this._texturesEnabled}set skeletonsEnabled(e){this._skeletonsEnabled!==e&&(this._skeletonsEnabled=e,this.markAllMaterialsAsDirty(8))}get skeletonsEnabled(){return this._skeletonsEnabled}get collisionCoordinator(){return this._collisionCoordinator||(this._collisionCoordinator=L.CollisionCoordinatorFactory(),this._collisionCoordinator.init(this)),this._collisionCoordinator}get renderingManager(){return this._renderingManager}get frustumPlanes(){return this._frustumPlanes}_registerTransientComponents(){if(this._transientComponents.length>0){for(const e of this._transientComponents)e.register();this._transientComponents.length=0}}_addComponent(e){this._components.push(e),this._transientComponents.push(e);const t=e;t.addFromContainer&&t.serialize&&this._serializableComponents.push(t)}_getComponent(e){for(const t of this._components)if(t.name===e)return t;return null}constructor(e,t){super(),this._inputManager=new P(this),this.cameraToUseForPointers=null,this._isScene=!0,this._blockEntityCollection=!1,this.autoClear=!0,this.autoClearDepthAndStencil=!0,this.clearColor=new I.HE(.2,.2,.3,1),this.ambientColor=new I.Wo(0,0,0),this.environmentIntensity=1,this._performancePriority=R.BackwardCompatible,this.onScenePerformancePriorityChangedObservable=new r.y$,this._forceWireframe=!1,this._skipFrustumClipping=!1,this._forcePointsCloud=!1,this.animationsEnabled=!0,this._animationPropertiesOverride=null,this.useConstantAnimationDeltaTime=!1,this.constantlyUpdateMeshUnderPointer=!1,this.hoverCursor="pointer",this.defaultCursor="",this.doNotHandleCursors=!1,this.preventDefaultOnPointerDown=!0,this.preventDefaultOnPointerUp=!0,this.metadata=null,this.reservedDataStore=null,this.disableOfflineSupportExceptionRules=new Array,this.onDisposeObservable=new r.y$,this._onDisposeObserver=null,this.onBeforeRenderObservable=new r.y$,this._onBeforeRenderObserver=null,this.onAfterRenderObservable=new r.y$,this.onAfterRenderCameraObservable=new r.y$,this._onAfterRenderObserver=null,this.onBeforeAnimationsObservable=new r.y$,this.onAfterAnimationsObservable=new r.y$,this.onBeforeDrawPhaseObservable=new r.y$,this.onAfterDrawPhaseObservable=new r.y$,this.onReadyObservable=new r.y$,this.onBeforeCameraRenderObservable=new r.y$,this._onBeforeCameraRenderObserver=null,this.onAfterCameraRenderObservable=new r.y$,this._onAfterCameraRenderObserver=null,this.onBeforeActiveMeshesEvaluationObservable=new r.y$,this.onAfterActiveMeshesEvaluationObservable=new r.y$,this.onBeforeParticlesRenderingObservable=new r.y$,this.onAfterParticlesRenderingObservable=new r.y$,this.onDataLoadedObservable=new r.y$,this.onNewCameraAddedObservable=new r.y$,this.onCameraRemovedObservable=new r.y$,this.onNewLightAddedObservable=new r.y$,this.onLightRemovedObservable=new r.y$,this.onNewGeometryAddedObservable=new r.y$,this.onGeometryRemovedObservable=new r.y$,this.onNewTransformNodeAddedObservable=new r.y$,this.onTransformNodeRemovedObservable=new r.y$,this.onNewMeshAddedObservable=new r.y$,this.onMeshRemovedObservable=new r.y$,this.onNewSkeletonAddedObservable=new r.y$,this.onSkeletonRemovedObservable=new r.y$,this.onNewMaterialAddedObservable=new r.y$,this.onNewMultiMaterialAddedObservable=new r.y$,this.onMaterialRemovedObservable=new r.y$,this.onMultiMaterialRemovedObservable=new r.y$,this.onNewTextureAddedObservable=new r.y$,this.onTextureRemovedObservable=new r.y$,this.onBeforeRenderTargetsRenderObservable=new r.y$,this.onAfterRenderTargetsRenderObservable=new r.y$,this.onBeforeStepObservable=new r.y$,this.onAfterStepObservable=new r.y$,this.onActiveCameraChanged=new r.y$,this.onActiveCamerasChanged=new r.y$,this.onBeforeRenderingGroupObservable=new r.y$,this.onAfterRenderingGroupObservable=new r.y$,this.onMeshImportedObservable=new r.y$,this.onAnimationFileImportedObservable=new r.y$,this._registeredForLateAnimationBindings=new o.f(256),this.skipPointerMovePicking=!1,this.skipPointerDownPicking=!1,this.skipPointerUpPicking=!1,this.onPrePointerObservable=new r.y$,this.onPointerObservable=new r.y$,this.onPreKeyboardObservable=new r.y$,this.onKeyboardObservable=new r.y$,this._useRightHandedSystem=!1,this._timeAccumulator=0,this._currentStepId=0,this._currentInternalStep=0,this._fogEnabled=!0,this._fogMode=L.FOGMODE_NONE,this.fogColor=new I.Wo(.2,.2,.3),this.fogDensity=.1,this.fogStart=0,this.fogEnd=1e3,this.needsPreviousWorldMatrices=!1,this._shadowsEnabled=!0,this._lightsEnabled=!0,this._unObserveActiveCameras=null,this._texturesEnabled=!0,this.physicsEnabled=!0,this.particlesEnabled=!0,this.spritesEnabled=!0,this._skeletonsEnabled=!0,this.lensFlaresEnabled=!0,this.collisionsEnabled=!0,this.gravity=new h.P(0,-9.807,0),this.postProcessesEnabled=!0,this.renderTargetsEnabled=!0,this.dumpNextRenderTargets=!1,this.customRenderTargets=new Array,this.importedMeshesFiles=new Array,this.probesEnabled=!0,this._meshesForIntersections=new o.f(256),this.proceduralTexturesEnabled=!0,this._totalVertices=new M.z,this._activeIndices=new M.z,this._activeParticles=new M.z,this._activeBones=new M.z,this._animationTime=0,this.animationTimeScale=1,this._renderId=0,this._frameId=0,this._executeWhenReadyTimeoutId=null,this._intermediateRendering=!1,this._defaultFrameBufferCleared=!1,this._viewUpdateFlag=-1,this._projectionUpdateFlag=-1,this._toBeDisposed=new Array(256),this._activeRequests=new Array,this._pendingData=new Array,this._isDisposed=!1,this.dispatchAllSubMeshesOfActiveMeshes=!1,this._activeMeshes=new o.t(256),this._processedMaterials=new o.t(256),this._renderTargets=new o.f(256),this._materialsRenderTargets=new o.f(256),this._activeParticleSystems=new o.t(256),this._activeSkeletons=new o.f(32),this._softwareSkinnedMeshes=new o.f(32),this._activeAnimatables=new Array,this._transformMatrix=h.y3.Zero(),this.requireLightSorting=!1,this._components=[],this._serializableComponents=[],this._transientComponents=[],this._beforeCameraUpdateStage=g.H.Create(),this._beforeClearStage=g.H.Create(),this._beforeRenderTargetClearStage=g.H.Create(),this._gatherRenderTargetsStage=g.H.Create(),this._gatherActiveCameraRenderTargetsStage=g.H.Create(),this._isReadyForMeshStage=g.H.Create(),this._beforeEvaluateActiveMeshStage=g.H.Create(),this._evaluateSubMeshStage=g.H.Create(),this._preActiveMeshStage=g.H.Create(),this._cameraDrawRenderTargetStage=g.H.Create(),this._beforeCameraDrawStage=g.H.Create(),this._beforeRenderTargetDrawStage=g.H.Create(),this._beforeRenderingGroupDrawStage=g.H.Create(),this._beforeRenderingMeshStage=g.H.Create(),this._afterRenderingMeshStage=g.H.Create(),this._afterRenderingGroupDrawStage=g.H.Create(),this._afterCameraDrawStage=g.H.Create(),this._afterCameraPostProcessStage=g.H.Create(),this._afterRenderTargetDrawStage=g.H.Create(),this._afterRenderTargetPostProcessStage=g.H.Create(),this._afterRenderStage=g.H.Create(),this._pointerMoveStage=g.H.Create(),this._pointerDownStage=g.H.Create(),this._pointerUpStage=g.H.Create(),this._geometriesByUniqueId=null,this._defaultMeshCandidates={data:[],length:0},this._defaultSubMeshCandidates={data:[],length:0},this._preventFreeActiveMeshesAndRenderingGroups=!1,this._activeMeshesFrozen=!1,this._activeMeshesFrozenButKeepClipping=!1,this._skipEvaluateActiveMeshesCompletely=!1,this._allowPostProcessClearColor=!0,this.getDeterministicFrameTime=()=>this._engine.getTimeStep(),this._registeredActions=0,this._blockMaterialDirtyMechanism=!1,this._perfCollector=null,this.activeCameras=new Array;const i={useGeometryUniqueIdsMap:!0,useMaterialMeshMap:!0,useClonedMeshMap:!0,virtual:!1,...t};this._engine=e||y.l.LastCreatedEngine,i.virtual?this._engine._virtualScenes.push(this):(y.l._LastCreatedScene=this,this._engine.scenes.push(this)),this._uid=null,this._renderingManager=new m.$(this),_.O&&(this.postProcessManager=new _.O(this)),(0,v.CG)()&&this.attachControl(),this._createUbo(),u.$&&(this._imageProcessingConfiguration=new u.$),this.setDefaultCandidateProviders(),i.useGeometryUniqueIdsMap&&(this._geometriesByUniqueId={}),this.useMaterialMeshMap=i.useMaterialMeshMap,this.useClonedMeshMap=i.useClonedMeshMap,t&&t.virtual||this._engine.onNewSceneAddedObservable.notifyObservers(this)}getClassName(){return"Scene"}_getDefaultMeshCandidates(){return this._defaultMeshCandidates.data=this.meshes,this._defaultMeshCandidates.length=this.meshes.length,this._defaultMeshCandidates}_getDefaultSubMeshCandidates(e){return this._defaultSubMeshCandidates.data=e.subMeshes,this._defaultSubMeshCandidates.length=e.subMeshes.length,this._defaultSubMeshCandidates}setDefaultCandidateProviders(){this.getActiveMeshCandidates=this._getDefaultMeshCandidates.bind(this),this.getActiveSubMeshCandidates=this._getDefaultSubMeshCandidates.bind(this),this.getIntersectingSubMeshCandidates=this._getDefaultSubMeshCandidates.bind(this),this.getCollidingSubMeshCandidates=this._getDefaultSubMeshCandidates.bind(this)}get meshUnderPointer(){return this._inputManager.meshUnderPointer}get pointerX(){return this._inputManager.pointerX}set pointerX(e){this._inputManager.pointerX=e}get pointerY(){return this._inputManager.pointerY}set pointerY(e){this._inputManager.pointerY=e}getCachedMaterial(){return this._cachedMaterial}getCachedEffect(){return this._cachedEffect}getCachedVisibility(){return this._cachedVisibility}isCachedMaterialInvalid(e,t,i=1){return this._cachedEffect!==t||this._cachedMaterial!==e||this._cachedVisibility!==i}getEngine(){return this._engine}getTotalVertices(){return this._totalVertices.current}get totalVerticesPerfCounter(){return this._totalVertices}getActiveIndices(){return this._activeIndices.current}get totalActiveIndicesPerfCounter(){return this._activeIndices}getActiveParticles(){return this._activeParticles.current}get activeParticlesPerfCounter(){return this._activeParticles}getActiveBones(){return this._activeBones.current}get activeBonesPerfCounter(){return this._activeBones}getActiveMeshes(){return this._activeMeshes}getAnimationRatio(){return void 0!==this._animationRatio?this._animationRatio:1}getRenderId(){return this._renderId}getFrameId(){return this._frameId}incrementRenderId(){this._renderId++}_createUbo(){this.setSceneUniformBuffer(this.createSceneUniformBuffer())}simulatePointerMove(e,t){return this._inputManager.simulatePointerMove(e,t),this}simulatePointerDown(e,t){return this._inputManager.simulatePointerDown(e,t),this}simulatePointerUp(e,t,i){return this._inputManager.simulatePointerUp(e,t,i),this}isPointerCaptured(e=0){return this._inputManager.isPointerCaptured(e)}attachControl(e=!0,t=!0,i=!0){this._inputManager.attachControl(e,t,i)}detachControl(){this._inputManager.detachControl()}isReady(e=!0){if(this._isDisposed)return!1;let t;const i=this.getEngine();let n=!0;for(this._pendingData.length>0&&(n=!1),e&&(this._processedMaterials.reset(),this._materialsRenderTargets.reset()),t=0;t<this.meshes.length;t++){const s=this.meshes[t];if(!s.subMeshes||0===s.subMeshes.length)continue;if(!s.isReady(!0)){n=!1;continue}const r=s.hasThinInstances||"InstancedMesh"===s.getClassName()||"InstancedLinesMesh"===s.getClassName()||i.getCaps().instancedArrays&&s.instances.length>0;for(const e of this._isReadyForMeshStage)e.action(s,r)||(n=!1);if(!e)continue;const o=s.material||this.defaultMaterial;if(o)if(o._storeEffectOnSubMeshes)for(const e of s.subMeshes){const t=e.getMaterial();t&&t.hasRenderTargetTextures&&null!=t.getRenderTargetTextures&&-1===this._processedMaterials.indexOf(t)&&(this._processedMaterials.push(t),this._materialsRenderTargets.concatWithNoDuplicate(t.getRenderTargetTextures()))}else o.hasRenderTargetTextures&&null!=o.getRenderTargetTextures&&-1===this._processedMaterials.indexOf(o)&&(this._processedMaterials.push(o),this._materialsRenderTargets.concatWithNoDuplicate(o.getRenderTargetTextures()))}if(!n)return!1;if(!i.areAllEffectsReady())return!1;if(e)for(t=0;t<this._materialsRenderTargets.length;++t)if(!this._materialsRenderTargets.data[t].isReadyForRendering())return!1;for(t=0;t<this.geometries.length;t++)if(2===this.geometries[t].delayLoadState)return!1;if(this.activeCameras&&this.activeCameras.length>0){for(const e of this.activeCameras)if(!e.isReady(!0))return!1}else if(this.activeCamera&&!this.activeCamera.isReady(!0))return!1;for(const e of this.particleSystems)if(!e.isReady())return!1;return!0}resetCachedMaterial(){this._cachedMaterial=null,this._cachedEffect=null,this._cachedVisibility=null}registerBeforeRender(e){this.onBeforeRenderObservable.add(e)}unregisterBeforeRender(e){this.onBeforeRenderObservable.removeCallback(e)}registerAfterRender(e){this.onAfterRenderObservable.add(e)}unregisterAfterRender(e){this.onAfterRenderObservable.removeCallback(e)}_executeOnceBeforeRender(e){const t=()=>{e(),setTimeout((()=>{this.unregisterBeforeRender(t)}))};this.registerBeforeRender(t)}executeOnceBeforeRender(e,t){void 0!==t?setTimeout((()=>{this._executeOnceBeforeRender(e)}),t):this._executeOnceBeforeRender(e)}addPendingData(e){this._pendingData.push(e)}removePendingData(e){const t=this.isLoading,i=this._pendingData.indexOf(e);-1!==i&&this._pendingData.splice(i,1),t&&!this.isLoading&&this.onDataLoadedObservable.notifyObservers(this)}getWaitingItemsCount(){return this._pendingData.length}get isLoading(){return this._pendingData.length>0}executeWhenReady(e,t=!1){this.onReadyObservable.addOnce(e),null===this._executeWhenReadyTimeoutId&&this._checkIsReady(t)}whenReadyAsync(e=!1){return new Promise((t=>{this.executeWhenReady((()=>{t()}),e)}))}_checkIsReady(e=!1){return this._registerTransientComponents(),this.isReady(e)?(this.onReadyObservable.notifyObservers(this),this.onReadyObservable.clear(),void(this._executeWhenReadyTimeoutId=null)):this._isDisposed?(this.onReadyObservable.clear(),void(this._executeWhenReadyTimeoutId=null)):void(this._executeWhenReadyTimeoutId=setTimeout((()=>{this.incrementRenderId(),this._checkIsReady(e)}),100))}get animatables(){return this._activeAnimatables}resetLastAnimationTimeFrame(){this._animationTimeLast=s.F.Now}getViewMatrix(){return this._viewMatrix}getProjectionMatrix(){return this._projectionMatrix}getTransformMatrix(){return this._transformMatrix}setTransformMatrix(e,t,i,n){i||n||!this._multiviewSceneUbo||(this._multiviewSceneUbo.dispose(),this._multiviewSceneUbo=null),this._viewUpdateFlag===e.updateFlag&&this._projectionUpdateFlag===t.updateFlag||(this._viewUpdateFlag=e.updateFlag,this._projectionUpdateFlag=t.updateFlag,this._viewMatrix=e,this._projectionMatrix=t,this._viewMatrix.multiplyToRef(this._projectionMatrix,this._transformMatrix),this._frustumPlanes?D.i.GetPlanesToRef(this._transformMatrix,this._frustumPlanes):this._frustumPlanes=D.i.GetPlanes(this._transformMatrix),this._multiviewSceneUbo&&this._multiviewSceneUbo.useUbo?this._updateMultiviewUbo(i,n):this._sceneUbo.useUbo&&(this._sceneUbo.updateMatrix("viewProjection",this._transformMatrix),this._sceneUbo.updateMatrix("view",this._viewMatrix),this._sceneUbo.updateMatrix("projection",this._projectionMatrix)))}getSceneUniformBuffer(){return this._multiviewSceneUbo?this._multiviewSceneUbo:this._sceneUbo}createSceneUniformBuffer(e){const t=new d.M(this._engine,void 0,!1,null!=e?e:"scene");return t.addUniform("viewProjection",16),t.addUniform("view",16),t.addUniform("projection",16),t.addUniform("vEyePosition",4),t}setSceneUniformBuffer(e){this._sceneUbo=e,this._viewUpdateFlag=-1,this._projectionUpdateFlag=-1}getUniqueId(){return O.K.UniqueId}addMesh(e,t=!1){this._blockEntityCollection||(this.meshes.push(e),e._resyncLightSources(),e.parent||e._addToSceneRootNodes(),this.onNewMeshAddedObservable.notifyObservers(e),t&&e.getChildMeshes().forEach((e=>{this.addMesh(e)})))}removeMesh(e,t=!1){const i=this.meshes.indexOf(e);return-1!==i&&(this.meshes[i]=this.meshes[this.meshes.length-1],this.meshes.pop(),e.parent||e._removeFromSceneRootNodes()),this._inputManager._invalidateMesh(e),this.onMeshRemovedObservable.notifyObservers(e),t&&e.getChildMeshes().forEach((e=>{this.removeMesh(e)})),i}addTransformNode(e){this._blockEntityCollection||e.getScene()===this&&-1!==e._indexInSceneTransformNodesArray||(e._indexInSceneTransformNodesArray=this.transformNodes.length,this.transformNodes.push(e),e.parent||e._addToSceneRootNodes(),this.onNewTransformNodeAddedObservable.notifyObservers(e))}removeTransformNode(e){const t=e._indexInSceneTransformNodesArray;if(-1!==t){if(t!==this.transformNodes.length-1){const e=this.transformNodes[this.transformNodes.length-1];this.transformNodes[t]=e,e._indexInSceneTransformNodesArray=t}e._indexInSceneTransformNodesArray=-1,this.transformNodes.pop(),e.parent||e._removeFromSceneRootNodes()}return this.onTransformNodeRemovedObservable.notifyObservers(e),t}removeSkeleton(e){const t=this.skeletons.indexOf(e);return-1!==t&&(this.skeletons.splice(t,1),this.onSkeletonRemovedObservable.notifyObservers(e),this._executeActiveContainerCleanup(this._activeSkeletons)),t}removeMorphTargetManager(e){const t=this.morphTargetManagers.indexOf(e);return-1!==t&&this.morphTargetManagers.splice(t,1),t}removeLight(e){const t=this.lights.indexOf(e);if(-1!==t){for(const t of this.meshes)t._removeLightSource(e,!1);this.lights.splice(t,1),this.sortLightsByPriority(),e.parent||e._removeFromSceneRootNodes()}return this.onLightRemovedObservable.notifyObservers(e),t}removeCamera(e){const t=this.cameras.indexOf(e);if(-1!==t&&(this.cameras.splice(t,1),e.parent||e._removeFromSceneRootNodes()),this.activeCameras){const t=this.activeCameras.indexOf(e);-1!==t&&this.activeCameras.splice(t,1)}return this.activeCamera===e&&(this.cameras.length>0?this.activeCamera=this.cameras[0]:this.activeCamera=null),this.onCameraRemovedObservable.notifyObservers(e),t}removeParticleSystem(e){const t=this.particleSystems.indexOf(e);return-1!==t&&(this.particleSystems.splice(t,1),this._executeActiveContainerCleanup(this._activeParticleSystems)),t}removeAnimation(e){const t=this.animations.indexOf(e);return-1!==t&&this.animations.splice(t,1),t}stopAnimation(e,t,i){}removeAnimationGroup(e){const t=this.animationGroups.indexOf(e);return-1!==t&&this.animationGroups.splice(t,1),t}removeMultiMaterial(e){const t=this.multiMaterials.indexOf(e);return-1!==t&&this.multiMaterials.splice(t,1),this.onMultiMaterialRemovedObservable.notifyObservers(e),t}removeMaterial(e){const t=e._indexInSceneMaterialArray;if(-1!==t&&t<this.materials.length){if(t!==this.materials.length-1){const e=this.materials[this.materials.length-1];this.materials[t]=e,e._indexInSceneMaterialArray=t}e._indexInSceneMaterialArray=-1,this.materials.pop()}return this.onMaterialRemovedObservable.notifyObservers(e),t}removeActionManager(e){const t=this.actionManagers.indexOf(e);return-1!==t&&this.actionManagers.splice(t,1),t}removeTexture(e){const t=this.textures.indexOf(e);return-1!==t&&this.textures.splice(t,1),this.onTextureRemovedObservable.notifyObservers(e),t}addLight(e){if(!this._blockEntityCollection){this.lights.push(e),this.sortLightsByPriority(),e.parent||e._addToSceneRootNodes();for(const t of this.meshes)-1===t.lightSources.indexOf(e)&&(t.lightSources.push(e),t._resyncLightSources());this.onNewLightAddedObservable.notifyObservers(e)}}sortLightsByPriority(){this.requireLightSorting&&this.lights.sort(N.m.CompareLightsPriority)}addCamera(e){this._blockEntityCollection||(this.cameras.push(e),this.onNewCameraAddedObservable.notifyObservers(e),e.parent||e._addToSceneRootNodes())}addSkeleton(e){this._blockEntityCollection||(this.skeletons.push(e),this.onNewSkeletonAddedObservable.notifyObservers(e))}addParticleSystem(e){this._blockEntityCollection||this.particleSystems.push(e)}addAnimation(e){this._blockEntityCollection||this.animations.push(e)}addAnimationGroup(e){this._blockEntityCollection||this.animationGroups.push(e)}addMultiMaterial(e){this._blockEntityCollection||(this.multiMaterials.push(e),this.onNewMultiMaterialAddedObservable.notifyObservers(e))}addMaterial(e){this._blockEntityCollection||e.getScene()===this&&-1!==e._indexInSceneMaterialArray||(e._indexInSceneMaterialArray=this.materials.length,this.materials.push(e),this.onNewMaterialAddedObservable.notifyObservers(e))}addMorphTargetManager(e){this._blockEntityCollection||this.morphTargetManagers.push(e)}addGeometry(e){this._blockEntityCollection||(this._geometriesByUniqueId&&(this._geometriesByUniqueId[e.uniqueId]=this.geometries.length),this.geometries.push(e))}addActionManager(e){this.actionManagers.push(e)}addTexture(e){this._blockEntityCollection||(this.textures.push(e),this.onNewTextureAddedObservable.notifyObservers(e))}switchActiveCamera(e,t=!0){this._engine.getInputElement()&&(this.activeCamera&&this.activeCamera.detachControl(),this.activeCamera=e,t&&e.attachControl())}setActiveCameraById(e){const t=this.getCameraById(e);return t?(this.activeCamera=t,t):null}setActiveCameraByName(e){const t=this.getCameraByName(e);return t?(this.activeCamera=t,t):null}getAnimationGroupByName(e){for(let t=0;t<this.animationGroups.length;t++)if(this.animationGroups[t].name===e)return this.animationGroups[t];return null}_getMaterial(e,t){for(let e=0;e<this.materials.length;e++){const i=this.materials[e];if(t(i))return i}if(e)for(let e=0;e<this.multiMaterials.length;e++){const i=this.multiMaterials[e];if(t(i))return i}return null}getMaterialByUniqueID(e,t=!1){return this._getMaterial(t,(t=>t.uniqueId===e))}getMaterialById(e,t=!1){return this._getMaterial(t,(t=>t.id===e))}getMaterialByName(e,t=!1){return this._getMaterial(t,(t=>t.name===e))}getLastMaterialById(e,t=!1){for(let t=this.materials.length-1;t>=0;t--)if(this.materials[t].id===e)return this.materials[t];if(t)for(let t=this.multiMaterials.length-1;t>=0;t--)if(this.multiMaterials[t].id===e)return this.multiMaterials[t];return null}getTextureByUniqueId(e){for(let t=0;t<this.textures.length;t++)if(this.textures[t].uniqueId===e)return this.textures[t];return null}getTextureByName(e){for(let t=0;t<this.textures.length;t++)if(this.textures[t].name===e)return this.textures[t];return null}getCameraById(e){for(let t=0;t<this.cameras.length;t++)if(this.cameras[t].id===e)return this.cameras[t];return null}getCameraByUniqueId(e){for(let t=0;t<this.cameras.length;t++)if(this.cameras[t].uniqueId===e)return this.cameras[t];return null}getCameraByName(e){for(let t=0;t<this.cameras.length;t++)if(this.cameras[t].name===e)return this.cameras[t];return null}getBoneById(e){for(let t=0;t<this.skeletons.length;t++){const i=this.skeletons[t];for(let t=0;t<i.bones.length;t++)if(i.bones[t].id===e)return i.bones[t]}return null}getBoneByName(e){for(let t=0;t<this.skeletons.length;t++){const i=this.skeletons[t];for(let t=0;t<i.bones.length;t++)if(i.bones[t].name===e)return i.bones[t]}return null}getLightByName(e){for(let t=0;t<this.lights.length;t++)if(this.lights[t].name===e)return this.lights[t];return null}getLightById(e){for(let t=0;t<this.lights.length;t++)if(this.lights[t].id===e)return this.lights[t];return null}getLightByUniqueId(e){for(let t=0;t<this.lights.length;t++)if(this.lights[t].uniqueId===e)return this.lights[t];return null}getParticleSystemById(e){for(let t=0;t<this.particleSystems.length;t++)if(this.particleSystems[t].id===e)return this.particleSystems[t];return null}getGeometryById(e){for(let t=0;t<this.geometries.length;t++)if(this.geometries[t].id===e)return this.geometries[t];return null}_getGeometryByUniqueId(e){if(this._geometriesByUniqueId){const t=this._geometriesByUniqueId[e];if(void 0!==t)return this.geometries[t]}else for(let t=0;t<this.geometries.length;t++)if(this.geometries[t].uniqueId===e)return this.geometries[t];return null}pushGeometry(e,t){return!(!t&&this._getGeometryByUniqueId(e.uniqueId)||(this.addGeometry(e),this.onNewGeometryAddedObservable.notifyObservers(e),0))}removeGeometry(e){let t;if(this._geometriesByUniqueId){if(t=this._geometriesByUniqueId[e.uniqueId],void 0===t)return!1}else if(t=this.geometries.indexOf(e),t<0)return!1;if(t!==this.geometries.length-1){const e=this.geometries[this.geometries.length-1];e&&(this.geometries[t]=e,this._geometriesByUniqueId&&(this._geometriesByUniqueId[e.uniqueId]=t))}return this._geometriesByUniqueId&&(this._geometriesByUniqueId[e.uniqueId]=void 0),this.geometries.pop(),this.onGeometryRemovedObservable.notifyObservers(e),!0}getGeometries(){return this.geometries}getMeshById(e){for(let t=0;t<this.meshes.length;t++)if(this.meshes[t].id===e)return this.meshes[t];return null}getMeshesById(e){return this.meshes.filter((function(t){return t.id===e}))}getTransformNodeById(e){for(let t=0;t<this.transformNodes.length;t++)if(this.transformNodes[t].id===e)return this.transformNodes[t];return null}getTransformNodeByUniqueId(e){for(let t=0;t<this.transformNodes.length;t++)if(this.transformNodes[t].uniqueId===e)return this.transformNodes[t];return null}getTransformNodesById(e){return this.transformNodes.filter((function(t){return t.id===e}))}getMeshByUniqueId(e){for(let t=0;t<this.meshes.length;t++)if(this.meshes[t].uniqueId===e)return this.meshes[t];return null}getLastMeshById(e){for(let t=this.meshes.length-1;t>=0;t--)if(this.meshes[t].id===e)return this.meshes[t];return null}getLastEntryById(e){let t;for(t=this.meshes.length-1;t>=0;t--)if(this.meshes[t].id===e)return this.meshes[t];for(t=this.transformNodes.length-1;t>=0;t--)if(this.transformNodes[t].id===e)return this.transformNodes[t];for(t=this.cameras.length-1;t>=0;t--)if(this.cameras[t].id===e)return this.cameras[t];for(t=this.lights.length-1;t>=0;t--)if(this.lights[t].id===e)return this.lights[t];return null}getNodeById(e){const t=this.getMeshById(e);if(t)return t;const i=this.getTransformNodeById(e);if(i)return i;const n=this.getLightById(e);if(n)return n;const s=this.getCameraById(e);if(s)return s;return this.getBoneById(e)||null}getNodeByName(e){const t=this.getMeshByName(e);if(t)return t;const i=this.getTransformNodeByName(e);if(i)return i;const n=this.getLightByName(e);if(n)return n;const s=this.getCameraByName(e);if(s)return s;return this.getBoneByName(e)||null}getMeshByName(e){for(let t=0;t<this.meshes.length;t++)if(this.meshes[t].name===e)return this.meshes[t];return null}getTransformNodeByName(e){for(let t=0;t<this.transformNodes.length;t++)if(this.transformNodes[t].name===e)return this.transformNodes[t];return null}getLastSkeletonById(e){for(let t=this.skeletons.length-1;t>=0;t--)if(this.skeletons[t].id===e)return this.skeletons[t];return null}getSkeletonByUniqueId(e){for(let t=0;t<this.skeletons.length;t++)if(this.skeletons[t].uniqueId===e)return this.skeletons[t];return null}getSkeletonById(e){for(let t=0;t<this.skeletons.length;t++)if(this.skeletons[t].id===e)return this.skeletons[t];return null}getSkeletonByName(e){for(let t=0;t<this.skeletons.length;t++)if(this.skeletons[t].name===e)return this.skeletons[t];return null}getMorphTargetManagerById(e){for(let t=0;t<this.morphTargetManagers.length;t++)if(this.morphTargetManagers[t].uniqueId===e)return this.morphTargetManagers[t];return null}getMorphTargetById(e){for(let t=0;t<this.morphTargetManagers.length;++t){const i=this.morphTargetManagers[t];for(let t=0;t<i.numTargets;++t){const n=i.getTarget(t);if(n.id===e)return n}}return null}getMorphTargetByName(e){for(let t=0;t<this.morphTargetManagers.length;++t){const i=this.morphTargetManagers[t];for(let t=0;t<i.numTargets;++t){const n=i.getTarget(t);if(n.name===e)return n}}return null}getPostProcessByName(e){for(let t=0;t<this.postProcesses.length;++t){const i=this.postProcesses[t];if(i.name===e)return i}return null}isActiveMesh(e){return-1!==this._activeMeshes.indexOf(e)}get uid(){return this._uid||(this._uid=n.w1.RandomId()),this._uid}addExternalData(e,t){return this._externalData||(this._externalData=new a.x),this._externalData.add(e,t)}getExternalData(e){return this._externalData?this._externalData.get(e):null}getOrAddExternalDataWithFactory(e,t){return this._externalData||(this._externalData=new a.x),this._externalData.getOrAddWithFactory(e,t)}removeExternalData(e){return this._externalData.remove(e)}_evaluateSubMesh(e,t,i,n){if(n||e.isInFrustum(this._frustumPlanes)){for(const i of this._evaluateSubMeshStage)i.action(t,e);const i=e.getMaterial();null!=i&&(i.hasRenderTargetTextures&&null!=i.getRenderTargetTextures&&-1===this._processedMaterials.indexOf(i)&&(this._processedMaterials.push(i),this._materialsRenderTargets.concatWithNoDuplicate(i.getRenderTargetTextures())),this._renderingManager.dispatch(e,t,i))}}freeProcessedMaterials(){this._processedMaterials.dispose()}get blockfreeActiveMeshesAndRenderingGroups(){return this._preventFreeActiveMeshesAndRenderingGroups}set blockfreeActiveMeshesAndRenderingGroups(e){this._preventFreeActiveMeshesAndRenderingGroups!==e&&(e&&(this.freeActiveMeshes(),this.freeRenderingGroups()),this._preventFreeActiveMeshesAndRenderingGroups=e)}freeActiveMeshes(){if(!this.blockfreeActiveMeshesAndRenderingGroups&&(this._activeMeshes.dispose(),this.activeCamera&&this.activeCamera._activeMeshes&&this.activeCamera._activeMeshes.dispose(),this.activeCameras))for(let e=0;e<this.activeCameras.length;e++){const t=this.activeCameras[e];t&&t._activeMeshes&&t._activeMeshes.dispose()}}freeRenderingGroups(){if(!this.blockfreeActiveMeshesAndRenderingGroups&&(this._renderingManager&&this._renderingManager.freeRenderingGroups(),this.textures))for(let e=0;e<this.textures.length;e++){const t=this.textures[e];t&&t.renderList&&t.freeRenderingGroups()}}_isInIntermediateRendering(){return this._intermediateRendering}freezeActiveMeshes(e=!1,t,i,n=!0,s=!1){return this.executeWhenReady((()=>{if(this.activeCamera){if(this._frustumPlanes||this.updateTransformMatrix(),this._evaluateActiveMeshes(),this._activeMeshesFrozen=!0,this._activeMeshesFrozenButKeepClipping=s,this._skipEvaluateActiveMeshesCompletely=e,n)for(let e=0;e<this._activeMeshes.length;e++)this._activeMeshes.data[e]._freeze();t&&t()}else i&&i("No active camera found")})),this}unfreezeActiveMeshes(){for(let e=0;e<this.meshes.length;e++){const t=this.meshes[e];t._internalAbstractMeshDataInfo&&(t._internalAbstractMeshDataInfo._isActive=!1)}for(let e=0;e<this._activeMeshes.length;e++)this._activeMeshes.data[e]._unFreeze();return this._activeMeshesFrozen=!1,this}_executeActiveContainerCleanup(e){(!this._engine.snapshotRendering||1!==this._engine.snapshotRenderingMode)&&this._activeMeshesFrozen&&this._activeMeshes.length||this.onBeforeRenderObservable.addOnce((()=>e.dispose()))}_evaluateActiveMeshes(){var e;if(this._engine.snapshotRendering&&1===this._engine.snapshotRenderingMode)return void(this._activeMeshes.length>0&&(null===(e=this.activeCamera)||void 0===e||e._activeMeshes.reset(),this._activeMeshes.reset(),this._renderingManager.reset(),this._processedMaterials.reset(),this._activeParticleSystems.reset(),this._activeSkeletons.reset(),this._softwareSkinnedMeshes.reset()));if(this._activeMeshesFrozen&&this._activeMeshes.length){if(!this._skipEvaluateActiveMeshesCompletely){const e=this._activeMeshes.length;for(let t=0;t<e;t++)this._activeMeshes.data[t].computeWorldMatrix()}if(this._activeParticleSystems){const e=this._activeParticleSystems.length;for(let t=0;t<e;t++)this._activeParticleSystems.data[t].animate()}return void this._renderingManager.resetSprites()}if(!this.activeCamera)return;this.onBeforeActiveMeshesEvaluationObservable.notifyObservers(this),this.activeCamera._activeMeshes.reset(),this._activeMeshes.reset(),this._renderingManager.reset(),this._processedMaterials.reset(),this._activeParticleSystems.reset(),this._activeSkeletons.reset(),this._softwareSkinnedMeshes.reset(),this._materialsRenderTargets.reset();for(const e of this._beforeEvaluateActiveMeshStage)e.action();const t=this.getActiveMeshCandidates(),i=t.length;for(let e=0;e<i;e++){const i=t.data[e];if(i._internalAbstractMeshDataInfo._currentLODIsUpToDate=!1,i.isBlocked)continue;if(this._totalVertices.addCount(i.getTotalVertices(),!1),!i.isReady()||!i.isEnabled()||i.scaling.hasAZeroComponent)continue;i.computeWorldMatrix(),i.actionManager&&i.actionManager.hasSpecificTriggers2(12,13)&&this._meshesForIntersections.pushNoDuplicate(i);let n=this.customLODSelector?this.customLODSelector(i,this.activeCamera):i.getLOD(this.activeCamera);if(i._internalAbstractMeshDataInfo._currentLOD=n,i._internalAbstractMeshDataInfo._currentLODIsUpToDate=!0,null!=n&&(n!==i&&0!==n.billboardMode&&n.computeWorldMatrix(),i._preActivate(),i.isVisible&&i.visibility>0&&0!=(i.layerMask&this.activeCamera.layerMask)&&(this._skipFrustumClipping||i.alwaysSelectAsActiveMesh||i.isInFrustum(this._frustumPlanes)))){this._activeMeshes.push(i),this.activeCamera._activeMeshes.push(i),n!==i&&n._activate(this._renderId,!1);for(const e of this._preActiveMeshStage)e.action(i);i._activate(this._renderId,!1)&&(i.isAnInstance?i._internalAbstractMeshDataInfo._actAsRegularMesh&&(n=i):n._internalAbstractMeshDataInfo._onlyForInstances=!1,n._internalAbstractMeshDataInfo._isActive=!0,this._activeMesh(i,n)),i._postActivate()}}if(this.particlesEnabled){this.onBeforeParticlesRenderingObservable.notifyObservers(this);for(let e=0;e<this.particleSystems.length;e++){const t=this.particleSystems[e];if(!t.isStarted()||!t.emitter)continue;const i=t.emitter;i.position&&!i.isEnabled()||(this._activeParticleSystems.push(t),t.animate(),this._renderingManager.dispatchParticles(t))}this.onAfterParticlesRenderingObservable.notifyObservers(this)}}_activeMesh(e,t){this._skeletonsEnabled&&null!==t.skeleton&&void 0!==t.skeleton&&(this._activeSkeletons.pushNoDuplicate(t.skeleton)&&(t.skeleton.prepare(),this._activeBones.addCount(t.skeleton.bones.length,!1)),t.computeBonesUsingShaders||this._softwareSkinnedMeshes.pushNoDuplicate(t));let i=e.hasInstances||e.isAnInstance||this.dispatchAllSubMeshesOfActiveMeshes||this._skipFrustumClipping||t.alwaysSelectAsActiveMesh;if(t&&t.subMeshes&&t.subMeshes.length>0){const n=this.getActiveSubMeshCandidates(t),s=n.length;i=i||1===s;for(let r=0;r<s;r++){const s=n.data[r];this._evaluateSubMesh(s,t,e,i)}}}updateTransformMatrix(e){if(this.activeCamera)if(this.activeCamera._renderingMultiview){const t=this.activeCamera._rigCameras[0],i=this.activeCamera._rigCameras[1];this.setTransformMatrix(t.getViewMatrix(),t.getProjectionMatrix(e),i.getViewMatrix(),i.getProjectionMatrix(e))}else this.setTransformMatrix(this.activeCamera.getViewMatrix(),this.activeCamera.getProjectionMatrix(e))}_bindFrameBuffer(e,t=!0){e&&e._multiviewTexture?e._multiviewTexture._bindFrameBuffer():e&&e.outputRenderTarget?e.outputRenderTarget._bindFrameBuffer():this._engine._currentFrameBufferIsDefaultFrameBuffer()||this._engine.restoreDefaultFramebuffer(),t&&this._clearFrameBuffer(e)}_clearFrameBuffer(e){if(e&&e._multiviewTexture);else if(e&&e.outputRenderTarget&&!e._renderingMultiview){const t=e.outputRenderTarget;t.onClearObservable.hasObservers()?t.onClearObservable.notifyObservers(this._engine):t.skipInitialClear||(this.autoClear&&this._engine.clear(t.clearColor||this.clearColor,!t._cleared,!0,!0),t._cleared=!0)}else this._defaultFrameBufferCleared?this._engine.clear(null,!1,!0,!0):(this._defaultFrameBufferCleared=!0,this._clear())}_renderForCamera(e,t,i=!0){var s,r,o;if(e&&e._skipRendering)return;const a=this._engine;if(this._activeCamera=e,!this.activeCamera)throw new Error("Active camera not set");if(a.setViewport(this.activeCamera.viewport),this.resetCachedMaterial(),this._renderId++,!this.prePass&&i){let t=!0;e._renderingMultiview&&e.outputRenderTarget&&(t=e.outputRenderTarget.skipInitialClear,this.autoClear&&(this._defaultFrameBufferCleared=!1,e.outputRenderTarget.skipInitialClear=!1)),this._bindFrameBuffer(this._activeCamera),e._renderingMultiview&&e.outputRenderTarget&&(e.outputRenderTarget.skipInitialClear=t)}this.updateTransformMatrix(),this.onBeforeCameraRenderObservable.notifyObservers(this.activeCamera),this._evaluateActiveMeshes();for(let e=0;e<this._softwareSkinnedMeshes.length;e++){const t=this._softwareSkinnedMeshes.data[e];t.applySkeleton(t.skeleton)}this.onBeforeRenderTargetsRenderObservable.notifyObservers(this),this._renderTargets.concatWithNoDuplicate(this._materialsRenderTargets),e.customRenderTargets&&e.customRenderTargets.length>0&&this._renderTargets.concatWithNoDuplicate(e.customRenderTargets),t&&t.customRenderTargets&&t.customRenderTargets.length>0&&this._renderTargets.concatWithNoDuplicate(t.customRenderTargets),this.environmentTexture&&this.environmentTexture.isRenderTarget&&this._renderTargets.pushNoDuplicate(this.environmentTexture);for(const e of this._gatherActiveCameraRenderTargetsStage)e.action(this._renderTargets);let l=!1;if(this.renderTargetsEnabled){if(this._intermediateRendering=!0,this._renderTargets.length>0){n.w1.StartPerformanceCounter("Render targets",this._renderTargets.length>0);for(let e=0;e<this._renderTargets.length;e++){const t=this._renderTargets.data[e];if(t._shouldRender()){this._renderId++;const e=t.activeCamera&&t.activeCamera!==this.activeCamera;t.render(e,this.dumpNextRenderTargets),l=!0}}n.w1.EndPerformanceCounter("Render targets",this._renderTargets.length>0),this._renderId++}for(const e of this._cameraDrawRenderTargetStage)l=e.action(this.activeCamera)||l;this._intermediateRendering=!1}this._engine.currentRenderPassId=null!==(o=null!==(r=null===(s=e.outputRenderTarget)||void 0===s?void 0:s.renderPassId)&&void 0!==r?r:e.renderPassId)&&void 0!==o?o:0,l&&!this.prePass&&this._bindFrameBuffer(this._activeCamera,!1),this.onAfterRenderTargetsRenderObservable.notifyObservers(this),!this.postProcessManager||e._multiviewTexture||this.prePass||this.postProcessManager._prepareFrame();for(const e of this._beforeCameraDrawStage)e.action(this.activeCamera);this.onBeforeDrawPhaseObservable.notifyObservers(this),a.snapshotRendering&&1===a.snapshotRenderingMode&&this.finalizeSceneUbo(),this._renderingManager.render(null,null,!0,!0),this.onAfterDrawPhaseObservable.notifyObservers(this);for(const e of this._afterCameraDrawStage)e.action(this.activeCamera);if(this.postProcessManager&&!e._multiviewTexture){const t=e.outputRenderTarget?e.outputRenderTarget.renderTarget:void 0;this.postProcessManager._finalizeFrame(e.isIntermediate,t)}for(const e of this._afterCameraPostProcessStage)e.action(this.activeCamera);this._renderTargets.reset(),this.onAfterCameraRenderObservable.notifyObservers(this.activeCamera)}_processSubCameras(e,t=!0){if(0===e.cameraRigMode||e._renderingMultiview)return e._renderingMultiview&&!this._multiviewSceneUbo&&this._createMultiviewUbo(),this._renderForCamera(e,void 0,t),void this.onAfterRenderCameraObservable.notifyObservers(e);if(e._useMultiviewToSingleView)this._renderMultiviewToSingleView(e);else{this.onBeforeCameraRenderObservable.notifyObservers(e);for(let t=0;t<e._rigCameras.length;t++)this._renderForCamera(e._rigCameras[t],e)}this._activeCamera=e,this.updateTransformMatrix(),this.onAfterRenderCameraObservable.notifyObservers(e)}_checkIntersections(){for(let e=0;e<this._meshesForIntersections.length;e++){const t=this._meshesForIntersections.data[e];if(t.actionManager)for(let e=0;t.actionManager&&e<t.actionManager.actions.length;e++){const i=t.actionManager.actions[e];if(12===i.trigger||13===i.trigger){const e=i.getTriggerParameter(),n=e.mesh?e.mesh:e,s=n.intersectsMesh(t,e.usePreciseIntersection),r=t._intersectionsInProgress.indexOf(n);s&&-1===r?12===i.trigger?(i._executeCurrent(f.V.CreateNew(t,void 0,n)),t._intersectionsInProgress.push(n)):13===i.trigger&&t._intersectionsInProgress.push(n):!s&&r>-1&&(13===i.trigger&&i._executeCurrent(f.V.CreateNew(t,void 0,n)),t.actionManager.hasSpecificTrigger(13,(e=>{const t=e.mesh?e.mesh:e;return n===t}))&&13!==i.trigger||t._intersectionsInProgress.splice(r,1))}}}}_advancePhysicsEngineStep(e){}_animate(){}animate(){if(this._engine.isDeterministicLockStep()){let e=Math.max(L.MinDeltaTime,Math.min(this._engine.getDeltaTime(),L.MaxDeltaTime))+this._timeAccumulator;const t=this._engine.getTimeStep(),i=1e3/t/1e3;let n=0;const s=this._engine.getLockstepMaxSteps();let r=Math.floor(e/t);for(r=Math.min(r,s);e>0&&n<r;)this.onBeforeStepObservable.notifyObservers(this),this._animationRatio=t*i,this._animate(),this.onAfterAnimationsObservable.notifyObservers(this),this.physicsEnabled&&this._advancePhysicsEngineStep(t),this.onAfterStepObservable.notifyObservers(this),this._currentStepId++,n++,e-=t;this._timeAccumulator=e<0?0:e}else{const e=this.useConstantAnimationDeltaTime?16:Math.max(L.MinDeltaTime,Math.min(this._engine.getDeltaTime(),L.MaxDeltaTime));this._animationRatio=.06*e,this._animate(),this.onAfterAnimationsObservable.notifyObservers(this),this.physicsEnabled&&this._advancePhysicsEngineStep(e)}}_clear(){(this.autoClearDepthAndStencil||this.autoClear)&&this._engine.clear(this.clearColor,this.autoClear||this.forceWireframe||this.forcePointsCloud,this.autoClearDepthAndStencil,this.autoClearDepthAndStencil)}_checkCameraRenderTarget(e){var t;if((null==e?void 0:e.outputRenderTarget)&&!(null==e?void 0:e.isRigCamera)&&(e.outputRenderTarget._cleared=!1),null===(t=null==e?void 0:e.rigCameras)||void 0===t?void 0:t.length)for(let t=0;t<e.rigCameras.length;++t){const i=e.rigCameras[t].outputRenderTarget;i&&(i._cleared=!1)}}resetDrawCache(e){if(this.meshes)for(const t of this.meshes)t.resetDrawCache(e)}render(e=!0,t=!1){var i,s,r;if(this.isDisposed)return;this.onReadyObservable.hasObservers()&&null===this._executeWhenReadyTimeoutId&&this._checkIsReady(),this._frameId++,this._defaultFrameBufferCleared=!1,this._checkCameraRenderTarget(this.activeCamera),(null===(i=this.activeCameras)||void 0===i?void 0:i.length)&&this.activeCameras.forEach(this._checkCameraRenderTarget),this._registerTransientComponents(),this._activeParticles.fetchNewFrame(),this._totalVertices.fetchNewFrame(),this._activeIndices.fetchNewFrame(),this._activeBones.fetchNewFrame(),this._meshesForIntersections.reset(),this.resetCachedMaterial(),this.onBeforeAnimationsObservable.notifyObservers(this),this.actionManager&&this.actionManager.processTrigger(11),t||this.animate();for(const e of this._beforeCameraUpdateStage)e.action();if(e)if(this.activeCameras&&this.activeCameras.length>0)for(let e=0;e<this.activeCameras.length;e++){const t=this.activeCameras[e];if(t.update(),0!==t.cameraRigMode)for(let e=0;e<t._rigCameras.length;e++)t._rigCameras[e].update()}else if(this.activeCamera&&(this.activeCamera.update(),0!==this.activeCamera.cameraRigMode))for(let e=0;e<this.activeCamera._rigCameras.length;e++)this.activeCamera._rigCameras[e].update();this.onBeforeRenderObservable.notifyObservers(this);const o=this.getEngine();this.onBeforeRenderTargetsRenderObservable.notifyObservers(this);const a=(null===(s=this.activeCameras)||void 0===s?void 0:s.length)?this.activeCameras[0]:this.activeCamera;if(this.renderTargetsEnabled){n.w1.StartPerformanceCounter("Custom render targets",this.customRenderTargets.length>0),this._intermediateRendering=!0;for(let e=0;e<this.customRenderTargets.length;e++){const t=this.customRenderTargets[e];if(t._shouldRender()){if(this._renderId++,this.activeCamera=t.activeCamera||this.activeCamera,!this.activeCamera)throw new Error("Active camera not set");o.setViewport(this.activeCamera.viewport),this.updateTransformMatrix(),t.render(a!==this.activeCamera,this.dumpNextRenderTargets)}}n.w1.EndPerformanceCounter("Custom render targets",this.customRenderTargets.length>0),this._intermediateRendering=!1,this._renderId++}this._engine.currentRenderPassId=null!==(r=null==a?void 0:a.renderPassId)&&void 0!==r?r:0,this.activeCamera=a,this._activeCamera&&22!==this._activeCamera.cameraRigMode&&!this.prePass&&this._bindFrameBuffer(this._activeCamera,!1),this.onAfterRenderTargetsRenderObservable.notifyObservers(this);for(const e of this._beforeClearStage)e.action();this._clearFrameBuffer(this.activeCamera);for(const e of this._gatherRenderTargetsStage)e.action(this._renderTargets);if(this.activeCameras&&this.activeCameras.length>0)for(let e=0;e<this.activeCameras.length;e++)this._processSubCameras(this.activeCameras[e],e>0);else{if(!this.activeCamera)throw new Error("No camera defined");this._processSubCameras(this.activeCamera,!!this.activeCamera.outputRenderTarget)}this._checkIntersections();for(const e of this._afterRenderStage)e.action();if(this.afterRender&&this.afterRender(),this.onAfterRenderObservable.notifyObservers(this),this._toBeDisposed.length){for(let e=0;e<this._toBeDisposed.length;e++){const t=this._toBeDisposed[e];t&&t.dispose()}this._toBeDisposed.length=0}this.dumpNextRenderTargets&&(this.dumpNextRenderTargets=!1),this._activeBones.addCount(0,!0),this._activeIndices.addCount(0,!0),this._activeParticles.addCount(0,!0),this._engine.restoreDefaultFramebuffer()}freezeMaterials(){for(let e=0;e<this.materials.length;e++)this.materials[e].freeze()}unfreezeMaterials(){for(let e=0;e<this.materials.length;e++)this.materials[e].unfreeze()}dispose(){if(this.isDisposed)return;this.beforeRender=null,this.afterRender=null,this.metadata=null,this.skeletons.length=0,this.morphTargetManagers.length=0,this._transientComponents.length=0,this._isReadyForMeshStage.clear(),this._beforeEvaluateActiveMeshStage.clear(),this._evaluateSubMeshStage.clear(),this._preActiveMeshStage.clear(),this._cameraDrawRenderTargetStage.clear(),this._beforeCameraDrawStage.clear(),this._beforeRenderTargetDrawStage.clear(),this._beforeRenderingGroupDrawStage.clear(),this._beforeRenderingMeshStage.clear(),this._afterRenderingMeshStage.clear(),this._afterRenderingGroupDrawStage.clear(),this._afterCameraDrawStage.clear(),this._afterRenderTargetDrawStage.clear(),this._afterRenderStage.clear(),this._beforeCameraUpdateStage.clear(),this._beforeClearStage.clear(),this._gatherRenderTargetsStage.clear(),this._gatherActiveCameraRenderTargetsStage.clear(),this._pointerMoveStage.clear(),this._pointerDownStage.clear(),this._pointerUpStage.clear(),this.importedMeshesFiles=new Array,this.stopAllAnimations&&this.stopAllAnimations(),this.resetCachedMaterial(),this.activeCamera&&(this.activeCamera._activeMeshes.dispose(),this.activeCamera=null),this.activeCameras=null,this._activeMeshes.dispose(),this._renderingManager.dispose(),this._processedMaterials.dispose(),this._activeParticleSystems.dispose(),this._activeSkeletons.dispose(),this._softwareSkinnedMeshes.dispose(),this._renderTargets.dispose(),this._materialsRenderTargets.dispose(),this._registeredForLateAnimationBindings.dispose(),this._meshesForIntersections.dispose(),this._toBeDisposed.length=0;const e=this._activeRequests.slice();for(const t of e)t.abort();this._activeRequests.length=0;try{this.onDisposeObservable.notifyObservers(this)}catch(e){console.error("An error occurred while calling onDisposeObservable!",e)}if(this.detachControl(),this._engine.getInputElement())for(let e=0;e<this.cameras.length;e++)this.cameras[e].detachControl();this._disposeList(this.animationGroups),this._disposeList(this.lights),this._disposeList(this.meshes,(e=>e.dispose(!0))),this._disposeList(this.transformNodes,(e=>e.dispose(!0)));const t=this.cameras;this._disposeList(t),this._defaultMaterial&&this._defaultMaterial.dispose(),this._disposeList(this.multiMaterials),this._disposeList(this.materials),this._disposeList(this.particleSystems),this._disposeList(this.postProcesses),this._disposeList(this.textures),this._disposeList(this.morphTargetManagers),this._sceneUbo.dispose(),this._multiviewSceneUbo&&this._multiviewSceneUbo.dispose(),this.postProcessManager.dispose(),this._disposeList(this._components);let i=this._engine.scenes.indexOf(this);i>-1&&this._engine.scenes.splice(i,1),y.l._LastCreatedScene===this&&(this._engine.scenes.length>0?y.l._LastCreatedScene=this._engine.scenes[this._engine.scenes.length-1]:y.l._LastCreatedScene=null),i=this._engine._virtualScenes.indexOf(this),i>-1&&this._engine._virtualScenes.splice(i,1),this._engine.wipeCaches(!0),this.onDisposeObservable.clear(),this.onBeforeRenderObservable.clear(),this.onAfterRenderObservable.clear(),this.onBeforeRenderTargetsRenderObservable.clear(),this.onAfterRenderTargetsRenderObservable.clear(),this.onAfterStepObservable.clear(),this.onBeforeStepObservable.clear(),this.onBeforeActiveMeshesEvaluationObservable.clear(),this.onAfterActiveMeshesEvaluationObservable.clear(),this.onBeforeParticlesRenderingObservable.clear(),this.onAfterParticlesRenderingObservable.clear(),this.onBeforeDrawPhaseObservable.clear(),this.onAfterDrawPhaseObservable.clear(),this.onBeforeAnimationsObservable.clear(),this.onAfterAnimationsObservable.clear(),this.onDataLoadedObservable.clear(),this.onBeforeRenderingGroupObservable.clear(),this.onAfterRenderingGroupObservable.clear(),this.onMeshImportedObservable.clear(),this.onBeforeCameraRenderObservable.clear(),this.onAfterCameraRenderObservable.clear(),this.onAfterRenderCameraObservable.clear(),this.onReadyObservable.clear(),this.onNewCameraAddedObservable.clear(),this.onCameraRemovedObservable.clear(),this.onNewLightAddedObservable.clear(),this.onLightRemovedObservable.clear(),this.onNewGeometryAddedObservable.clear(),this.onGeometryRemovedObservable.clear(),this.onNewTransformNodeAddedObservable.clear(),this.onTransformNodeRemovedObservable.clear(),this.onNewMeshAddedObservable.clear(),this.onMeshRemovedObservable.clear(),this.onNewSkeletonAddedObservable.clear(),this.onSkeletonRemovedObservable.clear(),this.onNewMaterialAddedObservable.clear(),this.onNewMultiMaterialAddedObservable.clear(),this.onMaterialRemovedObservable.clear(),this.onMultiMaterialRemovedObservable.clear(),this.onNewTextureAddedObservable.clear(),this.onTextureRemovedObservable.clear(),this.onPrePointerObservable.clear(),this.onPointerObservable.clear(),this.onPreKeyboardObservable.clear(),this.onKeyboardObservable.clear(),this.onActiveCameraChanged.clear(),this.onScenePerformancePriorityChangedObservable.clear(),this._isDisposed=!0}_disposeList(e,t){const i=e.slice(0);t=null!=t?t:e=>e.dispose();for(const e of i)t(e);e.length=0}get isDisposed(){return this._isDisposed}clearCachedVertexData(){for(let e=0;e<this.meshes.length;e++){const t=this.meshes[e].geometry;t&&t.clearCachedData()}}cleanCachedTextureBuffer(){for(const e of this.textures)e._buffer&&(e._buffer=null)}getWorldExtends(e){const t=new h.P(Number.MAX_VALUE,Number.MAX_VALUE,Number.MAX_VALUE),i=new h.P(-Number.MAX_VALUE,-Number.MAX_VALUE,-Number.MAX_VALUE);return e=e||(()=>!0),this.meshes.filter(e).forEach((e=>{if(e.computeWorldMatrix(!0),!e.subMeshes||0===e.subMeshes.length||e.infiniteDistance)return;const n=e.getBoundingInfo(),s=n.boundingBox.minimumWorld,r=n.boundingBox.maximumWorld;h.P.CheckExtends(s,t,i),h.P.CheckExtends(r,t,i)})),{min:t,max:i}}createPickingRay(e,t,i,n,s=!1){throw(0,x.S)("Ray")}createPickingRayToRef(e,t,i,n,s,r=!1,o=!1){throw(0,x.S)("Ray")}createPickingRayInCameraSpace(e,t,i){throw(0,x.S)("Ray")}createPickingRayInCameraSpaceToRef(e,t,i,n){throw(0,x.S)("Ray")}get _pickingAvailable(){return!1}pick(e,t,i,n,s,r){return new p.p}pickWithBoundingInfo(e,t,i,n,s){return new p.p}pickWithRay(e,t,i,n){throw(0,x.S)("Ray")}multiPick(e,t,i,n,s){throw(0,x.S)("Ray")}multiPickWithRay(e,t,i){throw(0,x.S)("Ray")}setPointerOverMesh(e,t,i){this._inputManager.setPointerOverMesh(e,t,i)}getPointerOverMesh(){return this._inputManager.getPointerOverMesh()}_rebuildGeometries(){for(const e of this.geometries)e._rebuild();for(const e of this.meshes)e._rebuild();this.postProcessManager&&this.postProcessManager._rebuild();for(const e of this._components)e.rebuild();for(const e of this.particleSystems)e.rebuild();if(this.spriteManagers)for(const e of this.spriteManagers)e.rebuild()}_rebuildTextures(){for(const e of this.textures)e._rebuild();this.markAllMaterialsAsDirty(1)}_getByTags(e,t,i){if(void 0===t)return e;const n=[];i=i||(e=>{});for(const s in e){const r=e[s];l.$&&l.$.MatchesQuery(r,t)&&(n.push(r),i(r))}return n}getMeshesByTags(e,t){return this._getByTags(this.meshes,e,t)}getCamerasByTags(e,t){return this._getByTags(this.cameras,e,t)}getLightsByTags(e,t){return this._getByTags(this.lights,e,t)}getMaterialByTags(e,t){return this._getByTags(this.materials,e,t).concat(this._getByTags(this.multiMaterials,e,t))}getTransformNodesByTags(e,t){return this._getByTags(this.transformNodes,e,t)}setRenderingOrder(e,t=null,i=null,n=null){this._renderingManager.setRenderingOrder(e,t,i,n)}setRenderingAutoClearDepthStencil(e,t,i=!0,n=!0){this._renderingManager.setRenderingAutoClearDepthStencil(e,t,i,n)}getAutoClearDepthStencilSetup(e){return this._renderingManager.getAutoClearDepthStencilSetup(e)}get blockMaterialDirtyMechanism(){return this._blockMaterialDirtyMechanism}set blockMaterialDirtyMechanism(e){this._blockMaterialDirtyMechanism!==e&&(this._blockMaterialDirtyMechanism=e,e||this.markAllMaterialsAsDirty(63))}markAllMaterialsAsDirty(e,t){if(!this._blockMaterialDirtyMechanism)for(const i of this.materials)t&&!t(i)||i.markAsDirty(e)}_loadFile(e,t,i,n,s,r,o){const a=(0,w.vP)(e,t,i,n?this.offlineProvider:void 0,s,r,o);return this._activeRequests.push(a),a.onCompleteObservable.add((e=>{this._activeRequests.splice(this._activeRequests.indexOf(e),1)})),a}_loadFileAsync(e,t,i,n,s){return new Promise(((r,o)=>{this._loadFile(e,(e=>{r(e)}),t,i,n,((e,t)=>{o(t)}),s)}))}_requestFile(e,t,i,n,s,r,o){const a=(0,w.FV)(e,t,i,n?this.offlineProvider:void 0,s,r,o);return this._activeRequests.push(a),a.onCompleteObservable.add((e=>{this._activeRequests.splice(this._activeRequests.indexOf(e),1)})),a}_requestFileAsync(e,t,i,n,s){return new Promise(((r,o)=>{this._requestFile(e,(e=>{r(e)}),t,i,n,(e=>{o(e)}),s)}))}_readFile(e,t,i,n,s){const r=(0,w.Ip)(e,t,i,n,s);return this._activeRequests.push(r),r.onCompleteObservable.add((e=>{this._activeRequests.splice(this._activeRequests.indexOf(e),1)})),r}_readFileAsync(e,t,i){return new Promise(((n,s)=>{this._readFile(e,(e=>{n(e)}),t,i,(e=>{s(e)}))}))}getPerfCollector(){throw(0,x.S)("performanceViewerSceneExtension")}}L.FOGMODE_NONE=0,L.FOGMODE_EXP=1,L.FOGMODE_EXP2=2,L.FOGMODE_LINEAR=3,L.MinDeltaTime=1,L.MaxDeltaTime=1e3,L.prototype.setActiveCameraByID=function(e){return this.setActiveCameraById(e)},L.prototype.getLastMaterialByID=function(e){return this.getLastMaterialById(e)},L.prototype.getMaterialByID=function(e){return this.getMaterialById(e)},L.prototype.getTextureByUniqueID=function(e){return this.getTextureByUniqueId(e)},L.prototype.getCameraByID=function(e){return this.getCameraById(e)},L.prototype.getCameraByUniqueID=function(e){return this.getCameraByUniqueId(e)},L.prototype.getBoneByID=function(e){return this.getBoneById(e)},L.prototype.getLightByID=function(e){return this.getLightById(e)},L.prototype.getLightByUniqueID=function(e){return this.getLightByUniqueId(e)},L.prototype.getParticleSystemByID=function(e){return this.getParticleSystemById(e)},L.prototype.getGeometryByID=function(e){return this.getGeometryById(e)},L.prototype.getMeshByID=function(e){return this.getMeshById(e)},L.prototype.getMeshesByID=function(e){return this.getMeshesById(e)},L.prototype.getTransformNodeByID=function(e){return this.getTransformNodeById(e)},L.prototype.getTransformNodeByUniqueID=function(e){return this.getTransformNodeByUniqueId(e)},L.prototype.getTransformNodesByID=function(e){return this.getTransformNodesById(e)},L.prototype.getMeshByUniqueID=function(e){return this.getMeshByUniqueId(e)},L.prototype.getLastMeshByID=function(e){return this.getLastMeshById(e)},L.prototype.getLastEntryByID=function(e){return this.getLastEntryById(e)},L.prototype.getNodeByID=function(e){return this.getNodeById(e)},L.prototype.getLastSkeletonByID=function(e){return this.getLastSkeletonById(e)}},2333:(e,t,i)=>{i.d(t,{H:()=>s,l:()=>n});class n{}n.NAME_EFFECTLAYER="EffectLayer",n.NAME_LAYER="Layer",n.NAME_LENSFLARESYSTEM="LensFlareSystem",n.NAME_BOUNDINGBOXRENDERER="BoundingBoxRenderer",n.NAME_PARTICLESYSTEM="ParticleSystem",n.NAME_GAMEPAD="Gamepad",n.NAME_SIMPLIFICATIONQUEUE="SimplificationQueue",n.NAME_GEOMETRYBUFFERRENDERER="GeometryBufferRenderer",n.NAME_PREPASSRENDERER="PrePassRenderer",n.NAME_DEPTHRENDERER="DepthRenderer",n.NAME_DEPTHPEELINGRENDERER="DepthPeelingRenderer",n.NAME_POSTPROCESSRENDERPIPELINEMANAGER="PostProcessRenderPipelineManager",n.NAME_SPRITE="Sprite",n.NAME_SUBSURFACE="SubSurface",n.NAME_OUTLINERENDERER="Outline",n.NAME_PROCEDURALTEXTURE="ProceduralTexture",n.NAME_SHADOWGENERATOR="ShadowGenerator",n.NAME_OCTREE="Octree",n.NAME_PHYSICSENGINE="PhysicsEngine",n.NAME_AUDIO="Audio",n.NAME_FLUIDRENDERER="FluidRenderer",n.STEP_ISREADYFORMESH_EFFECTLAYER=0,n.STEP_BEFOREEVALUATEACTIVEMESH_BOUNDINGBOXRENDERER=0,n.STEP_EVALUATESUBMESH_BOUNDINGBOXRENDERER=0,n.STEP_PREACTIVEMESH_BOUNDINGBOXRENDERER=0,n.STEP_CAMERADRAWRENDERTARGET_EFFECTLAYER=1,n.STEP_BEFORECAMERADRAW_PREPASS=0,n.STEP_BEFORECAMERADRAW_EFFECTLAYER=1,n.STEP_BEFORECAMERADRAW_LAYER=2,n.STEP_BEFORERENDERTARGETDRAW_PREPASS=0,n.STEP_BEFORERENDERTARGETDRAW_LAYER=1,n.STEP_BEFORERENDERINGMESH_PREPASS=0,n.STEP_BEFORERENDERINGMESH_OUTLINE=1,n.STEP_AFTERRENDERINGMESH_PREPASS=0,n.STEP_AFTERRENDERINGMESH_OUTLINE=1,n.STEP_AFTERRENDERINGGROUPDRAW_EFFECTLAYER_DRAW=0,n.STEP_AFTERRENDERINGGROUPDRAW_BOUNDINGBOXRENDERER=1,n.STEP_BEFORECAMERAUPDATE_SIMPLIFICATIONQUEUE=0,n.STEP_BEFORECAMERAUPDATE_GAMEPAD=1,n.STEP_BEFORECLEAR_PROCEDURALTEXTURE=0,n.STEP_BEFORECLEAR_PREPASS=1,n.STEP_BEFORERENDERTARGETCLEAR_PREPASS=0,n.STEP_AFTERRENDERTARGETDRAW_PREPASS=0,n.STEP_AFTERRENDERTARGETDRAW_LAYER=1,n.STEP_AFTERCAMERADRAW_PREPASS=0,n.STEP_AFTERCAMERADRAW_EFFECTLAYER=1,n.STEP_AFTERCAMERADRAW_LENSFLARESYSTEM=2,n.STEP_AFTERCAMERADRAW_EFFECTLAYER_DRAW=3,n.STEP_AFTERCAMERADRAW_LAYER=4,n.STEP_AFTERCAMERADRAW_FLUIDRENDERER=5,n.STEP_AFTERCAMERAPOSTPROCESS_LAYER=0,n.STEP_AFTERRENDERTARGETPOSTPROCESS_LAYER=0,n.STEP_AFTERRENDER_AUDIO=0,n.STEP_GATHERRENDERTARGETS_DEPTHRENDERER=0,n.STEP_GATHERRENDERTARGETS_GEOMETRYBUFFERRENDERER=1,n.STEP_GATHERRENDERTARGETS_SHADOWGENERATOR=2,n.STEP_GATHERRENDERTARGETS_POSTPROCESSRENDERPIPELINEMANAGER=3,n.STEP_GATHERACTIVECAMERARENDERTARGETS_DEPTHRENDERER=0,n.STEP_GATHERACTIVECAMERARENDERTARGETS_FLUIDRENDERER=1,n.STEP_POINTERMOVE_SPRITE=0,n.STEP_POINTERDOWN_SPRITE=0,n.STEP_POINTERUP_SPRITE=0;class s extends Array{constructor(e){super(...e)}static Create(){return Object.create(s.prototype)}registerStep(e,t,i){let n=0,s=Number.MAX_VALUE;for(;n<this.length&&(s=this[n].index,!(e<s));n++);this.splice(n,0,{index:e,component:t,action:i.bind(t)})}clear(){this.length=0}}},9472:(e,t,i)=>{function n(e,t,i,n){var s,r=arguments.length,o=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,i):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(e,t,i,n);else for(var a=e.length-1;a>=0;a--)(s=e[a])&&(o=(r<3?s(o):r>3?s(t,i,o):s(t,i))||o);return r>3&&o&&Object.defineProperty(t,i,o),o}i.d(t,{gn:()=>n}),Object.create,Object.create},2318:(e,t,i)=>{i.r(t),i.d(t,{GLTF1:()=>n,GLTF2:()=>s,GLTFFileLoader:()=>R,GLTFLoaderAnimationStartMode:()=>_,GLTFLoaderCoordinateSystemMode:()=>f,GLTFLoaderState:()=>m,GLTFValidation:()=>p,MTLFileLoader:()=>di,OBJFileLoader:()=>fi,STLFileLoader:()=>_i,SolidParser:()=>pi});var n={};i.r(n),i.d(n,{EBlendingFunction:()=>E,EComponentType:()=>g,ECullingType:()=>S,EParameterType:()=>y,EShaderType:()=>v,ETextureFilterType:()=>b,ETextureFormat:()=>T,ETextureWrapMode:()=>x,GLTFBinaryExtension:()=>Ee,GLTFLoader:()=>Te,GLTFLoaderBase:()=>be,GLTFLoaderExtension:()=>Se,GLTFMaterialsCommonExtension:()=>Ce,GLTFUtils:()=>Z});var s={};i.r(s),i.d(s,{ArrayItem:()=>Ve,EXT_lights_image_based:()=>Xe,EXT_mesh_gpu_instancing:()=>Ye,EXT_meshopt_compression:()=>$e,EXT_texture_webp:()=>Ze,ExtrasAsMetadata:()=>ui,GLTFLoader:()=>ke,KHR_animation_pointer:()=>Zt,KHR_draco_mesh_compression:()=>tt,KHR_lights:()=>st,KHR_materials_clearcoat:()=>ct,KHR_materials_emissive_strength:()=>ft,KHR_materials_ior:()=>xt,KHR_materials_iridescence:()=>dt,KHR_materials_pbrSpecularGlossiness:()=>ot,KHR_materials_sheen:()=>mt,KHR_materials_specular:()=>vt,KHR_materials_translucency:()=>Rt,KHR_materials_transmission:()=>At,KHR_materials_unlit:()=>lt,KHR_materials_variants:()=>Tt,KHR_materials_volume:()=>It,KHR_mesh_quantization:()=>Ot,KHR_texture_basisu:()=>Nt,KHR_texture_transform:()=>Lt,KHR_xmp_json_ld:()=>Ut,MSFT_audio_emitter:()=>ni,MSFT_lod:()=>ri,MSFT_minecraftMesh:()=>ai,MSFT_sRGBFactors:()=>hi});var r=i(5757),o=i(7257),a=i(9953),l=i(1468),h=i(2722),c=i(1918);function u(e,t,i,n){const s={externalResourceFunction:e=>n(e).then((e=>new Uint8Array(e)))};return i&&(s.uri="file:"===t?i:t+i),e instanceof ArrayBuffer?GLTFValidator.validateBytes(new Uint8Array(e),s):GLTFValidator.validateString(e,s)}function d(){const e=[];onmessage=t=>{const i=t.data;switch(i.id){case"init":importScripts(i.url);break;case"validate":u(i.data,i.rootUrl,i.fileName,(t=>new Promise(((i,n)=>{const s=e.length;e.push({resolve:i,reject:n}),postMessage({id:"getExternalResource",index:s,uri:t})})))).then((e=>{postMessage({id:"validate.resolve",value:e})}),(e=>{postMessage({id:"validate.reject",reason:e})}));break;case"getExternalResource.resolve":e[i.index].resolve(i.value);break;case"getExternalResource.reject":e[i.index].reject(i.reason)}}}class p{static ValidateAsync(e,t,i,n){return"function"==typeof Worker?new Promise(((s,r)=>{const o=`${u}(${d})()`,a=URL.createObjectURL(new Blob([o],{type:"application/javascript"})),l=new Worker(a),h=e=>{l.removeEventListener("error",h),l.removeEventListener("message",c),r(e)},c=e=>{const t=e.data;switch(t.id){case"getExternalResource":n(t.uri).then((e=>{l.postMessage({id:"getExternalResource.resolve",index:t.index,value:e},[e])}),(e=>{l.postMessage({id:"getExternalResource.reject",index:t.index,reason:e})}));break;case"validate.resolve":l.removeEventListener("error",h),l.removeEventListener("message",c),s(t.value),l.terminate();break;case"validate.reject":l.removeEventListener("error",h),l.removeEventListener("message",c),r(t.reason),l.terminate()}};l.addEventListener("error",h),l.addEventListener("message",c),l.postMessage({id:"init",url:this.Configuration.url}),l.postMessage({id:"validate",data:e,rootUrl:t,fileName:i})})):(this._LoadScriptPromise||(this._LoadScriptPromise=o.w1.LoadScriptAsync(this.Configuration.url)),this._LoadScriptPromise.then((()=>u(e,t,i,n))))}}p.Configuration={url:"https://preview.babylonjs.com/gltf_validator.js"};var f,_,m,g,v,y,x,b,T,S,E,C=i(5661),A=i(1722);function P(e,t,i){try{return Promise.resolve(new Uint8Array(e,t,i))}catch(e){return Promise.reject(e)}}!function(e){e[e.AUTO=0]="AUTO",e[e.FORCE_RIGHT_HANDED=1]="FORCE_RIGHT_HANDED"}(f||(f={})),function(e){e[e.NONE=0]="NONE",e[e.FIRST=1]="FIRST",e[e.ALL=2]="ALL"}(_||(_={})),function(e){e[e.LOADING=0]="LOADING",e[e.READY=1]="READY",e[e.COMPLETE=2]="COMPLETE"}(m||(m={}));class R{constructor(){this.onParsedObservable=new r.y$,this.coordinateSystemMode=f.AUTO,this.animationStartMode=_.FIRST,this.compileMaterials=!1,this.useClipPlane=!1,this.compileShadowGenerators=!1,this.transparencyAsCoverage=!1,this.useRangeRequests=!1,this.createInstances=!0,this.alwaysComputeBoundingBox=!1,this.loadAllMaterials=!1,this.loadOnlyMaterials=!1,this.skipMaterials=!1,this.useSRGBBuffers=!0,this.targetFps=60,this.alwaysComputeSkeletonRootNode=!1,this.preprocessUrlAsync=e=>Promise.resolve(e),this.onMeshLoadedObservable=new r.y$,this.onSkinLoadedObservable=new r.y$,this.onTextureLoadedObservable=new r.y$,this.onMaterialLoadedObservable=new r.y$,this.onCameraLoadedObservable=new r.y$,this.onCompleteObservable=new r.y$,this.onErrorObservable=new r.y$,this.onDisposeObservable=new r.y$,this.onExtensionLoadedObservable=new r.y$,this.validate=!1,this.onValidatedObservable=new r.y$,this._loader=null,this._state=null,this._requests=new Array,this.name="gltf",this.extensions={".gltf":{isBinary:!1},".glb":{isBinary:!0}},this.onLoaderStateChangedObservable=new r.y$,this._logIndentLevel=0,this._loggingEnabled=!1,this._log=this._logDisabled,this._capturePerformanceCounters=!1,this._startPerformanceCounter=this._startPerformanceCounterDisabled,this._endPerformanceCounter=this._endPerformanceCounterDisabled}set onParsed(e){this._onParsedObserver&&this.onParsedObservable.remove(this._onParsedObserver),this._onParsedObserver=this.onParsedObservable.add(e)}set onMeshLoaded(e){this._onMeshLoadedObserver&&this.onMeshLoadedObservable.remove(this._onMeshLoadedObserver),this._onMeshLoadedObserver=this.onMeshLoadedObservable.add(e)}set onTextureLoaded(e){this._onTextureLoadedObserver&&this.onTextureLoadedObservable.remove(this._onTextureLoadedObserver),this._onTextureLoadedObserver=this.onTextureLoadedObservable.add(e)}set onMaterialLoaded(e){this._onMaterialLoadedObserver&&this.onMaterialLoadedObservable.remove(this._onMaterialLoadedObserver),this._onMaterialLoadedObserver=this.onMaterialLoadedObservable.add(e)}set onCameraLoaded(e){this._onCameraLoadedObserver&&this.onCameraLoadedObservable.remove(this._onCameraLoadedObserver),this._onCameraLoadedObserver=this.onCameraLoadedObservable.add(e)}set onComplete(e){this._onCompleteObserver&&this.onCompleteObservable.remove(this._onCompleteObserver),this._onCompleteObserver=this.onCompleteObservable.add(e)}set onError(e){this._onErrorObserver&&this.onErrorObservable.remove(this._onErrorObserver),this._onErrorObserver=this.onErrorObservable.add(e)}set onDispose(e){this._onDisposeObserver&&this.onDisposeObservable.remove(this._onDisposeObserver),this._onDisposeObserver=this.onDisposeObservable.add(e)}set onExtensionLoaded(e){this._onExtensionLoadedObserver&&this.onExtensionLoadedObservable.remove(this._onExtensionLoadedObserver),this._onExtensionLoadedObserver=this.onExtensionLoadedObservable.add(e)}get loggingEnabled(){return this._loggingEnabled}set loggingEnabled(e){this._loggingEnabled!==e&&(this._loggingEnabled=e,this._loggingEnabled?this._log=this._logEnabled:this._log=this._logDisabled)}get capturePerformanceCounters(){return this._capturePerformanceCounters}set capturePerformanceCounters(e){this._capturePerformanceCounters!==e&&(this._capturePerformanceCounters=e,this._capturePerformanceCounters?(this._startPerformanceCounter=this._startPerformanceCounterEnabled,this._endPerformanceCounter=this._endPerformanceCounterEnabled):(this._startPerformanceCounter=this._startPerformanceCounterDisabled,this._endPerformanceCounter=this._endPerformanceCounterDisabled))}set onValidated(e){this._onValidatedObserver&&this.onValidatedObservable.remove(this._onValidatedObserver),this._onValidatedObserver=this.onValidatedObservable.add(e)}dispose(){this._loader&&(this._loader.dispose(),this._loader=null);for(const e of this._requests)e.abort();this._requests.length=0,delete this._progressCallback,this.preprocessUrlAsync=e=>Promise.resolve(e),this.onMeshLoadedObservable.clear(),this.onSkinLoadedObservable.clear(),this.onTextureLoadedObservable.clear(),this.onMaterialLoadedObservable.clear(),this.onCameraLoadedObservable.clear(),this.onCompleteObservable.clear(),this.onExtensionLoadedObservable.clear(),this.onDisposeObservable.notifyObservers(void 0),this.onDisposeObservable.clear()}loadFile(e,t,i,n,s,a){this._progressCallback=n;const l=t.name?"file:":o.w1.GetFolderPath(t),u=t.name||o.w1.GetFilename(t);if(s){if(this.useRangeRequests){this.validate&&h.Y.Warn("glTF validation is not supported when range requests are enabled");const n={abort:()=>{},onCompleteObservable:new r.y$},s={readAsync:(i,n)=>new Promise(((s,r)=>{this._loadFile(e,t,(e=>{s(new Uint8Array(e))}),!0,(e=>{r(e)}),(e=>{e.setRequestHeader("Range",`bytes=${i}-${i+n-1}`)}))})),byteLength:0};return this._unpackBinaryAsync(new c.d(s)).then((e=>{n.onCompleteObservable.notifyObservers(n),i(e)}),a?e=>a(void 0,e):void 0),n}return this._loadFile(e,t,(t=>{this._validate(e,t,l,u),this._unpackBinaryAsync(new c.d({readAsync:(e,i)=>P(t,e,i),byteLength:t.byteLength})).then((e=>{i(e)}),a?e=>a(void 0,e):void 0)}),!0,a)}return this._loadFile(e,t,(t=>{this._validate(e,t,l,u),i({json:this._parseJson(t)})}),s,a)}importMeshAsync(e,t,i,n,s,r){return Promise.resolve().then((()=>(this.onParsedObservable.notifyObservers(i),this.onParsedObservable.clear(),this._log(`Loading ${r||""}`),this._loader=this._getLoader(i),this._loader.importMeshAsync(e,t,null,i,n,s,r))))}loadAsync(e,t,i,n,s){return Promise.resolve().then((()=>(this.onParsedObservable.notifyObservers(t),this.onParsedObservable.clear(),this._log(`Loading ${s||""}`),this._loader=this._getLoader(t),this._loader.loadAsync(e,t,i,n,s))))}loadAssetContainerAsync(e,t,i,n,s){return Promise.resolve().then((()=>{this.onParsedObservable.notifyObservers(t),this.onParsedObservable.clear(),this._log(`Loading ${s||""}`),this._loader=this._getLoader(t);const r=new l.TJ(e),o=[];this.onMaterialLoadedObservable.add((e=>{o.push(e)}));const a=[];this.onTextureLoadedObservable.add((e=>{a.push(e)}));const h=[];this.onCameraLoadedObservable.add((e=>{h.push(e)}));const c=[];return this.onMeshLoadedObservable.add((e=>{e.morphTargetManager&&c.push(e.morphTargetManager)})),this._loader.importMeshAsync(null,e,r,t,i,n,s).then((e=>(Array.prototype.push.apply(r.geometries,e.geometries),Array.prototype.push.apply(r.meshes,e.meshes),Array.prototype.push.apply(r.particleSystems,e.particleSystems),Array.prototype.push.apply(r.skeletons,e.skeletons),Array.prototype.push.apply(r.animationGroups,e.animationGroups),Array.prototype.push.apply(r.materials,o),Array.prototype.push.apply(r.textures,a),Array.prototype.push.apply(r.lights,e.lights),Array.prototype.push.apply(r.transformNodes,e.transformNodes),Array.prototype.push.apply(r.cameras,h),Array.prototype.push.apply(r.morphTargetManagers,c),r)))}))}canDirectLoad(e){return-1!==e.indexOf("asset")&&-1!==e.indexOf("version")||e.startsWith("data:base64,"+R._MagicBase64Encoded)||e.startsWith("data:;base64,"+R._MagicBase64Encoded)||e.startsWith("data:application/octet-stream;base64,"+R._MagicBase64Encoded)||e.startsWith("data:model/gltf-binary;base64,"+R._MagicBase64Encoded)}directLoad(e,t){if(t.startsWith("base64,"+R._MagicBase64Encoded)||t.startsWith(";base64,"+R._MagicBase64Encoded)||t.startsWith("application/octet-stream;base64,"+R._MagicBase64Encoded)||t.startsWith("model/gltf-binary;base64,"+R._MagicBase64Encoded)){const i=(0,C.$K)(t);return this._validate(e,i),this._unpackBinaryAsync(new c.d({readAsync:(e,t)=>P(i,e,t),byteLength:i.byteLength}))}return this._validate(e,t),Promise.resolve({json:this._parseJson(t)})}createPlugin(){return new R}get loaderState(){return this._state}whenCompleteAsync(){return new Promise(((e,t)=>{this.onCompleteObservable.addOnce((()=>{e()})),this.onErrorObservable.addOnce((e=>{t(e)}))}))}_setState(e){this._state!==e&&(this._state=e,this.onLoaderStateChangedObservable.notifyObservers(this._state),this._log(m[this._state]))}_loadFile(e,t,i,n,s,r){const o=e._loadFile(t,i,(e=>{this._onProgress(e,o)}),!0,n,s,r);return o.onCompleteObservable.add((e=>{this._requests.splice(this._requests.indexOf(e),1)})),this._requests.push(o),o}_onProgress(e,t){if(!this._progressCallback)return;t._lengthComputable=e.lengthComputable,t._loaded=e.loaded,t._total=e.total;let i=!0,n=0,s=0;for(const e of this._requests){if(void 0===e._lengthComputable||void 0===e._loaded||void 0===e._total)return;i=i&&e._lengthComputable,n+=e._loaded,s+=e._total}this._progressCallback({lengthComputable:i,loaded:n,total:i?s:0})}_validate(e,t,i="",n=""){this.validate&&(this._startPerformanceCounter("Validate JSON"),p.ValidateAsync(t,i,n,(t=>this.preprocessUrlAsync(i+t).then((t=>e._loadFileAsync(t,void 0,!0,!0))))).then((e=>{this._endPerformanceCounter("Validate JSON"),this.onValidatedObservable.notifyObservers(e),this.onValidatedObservable.clear()}),(e=>{this._endPerformanceCounter("Validate JSON"),o.w1.Warn(`Failed to validate: ${e.message}`),this.onValidatedObservable.clear()})))}_getLoader(e){const t=e.json.asset||{};this._log(`Asset version: ${t.version}`),t.minVersion&&this._log(`Asset minimum version: ${t.minVersion}`),t.generator&&this._log(`Asset generator: ${t.generator}`);const i=R._parseVersion(t.version);if(!i)throw new Error("Invalid version: "+t.version);if(void 0!==t.minVersion){const e=R._parseVersion(t.minVersion);if(!e)throw new Error("Invalid minimum version: "+t.minVersion);if(R._compareVersion(e,{major:2,minor:0})>0)throw new Error("Incompatible minimum version: "+t.minVersion)}const n={1:R._CreateGLTF1Loader,2:R._CreateGLTF2Loader}[i.major];if(!n)throw new Error("Unsupported version: "+t.version);return n(this)}_parseJson(e){this._startPerformanceCounter("Parse JSON"),this._log(`JSON length: ${e.length}`);const t=JSON.parse(e);return this._endPerformanceCounter("Parse JSON"),t}_unpackBinaryAsync(e){return this._startPerformanceCounter("Unpack Binary"),e.loadAsync(20).then((()=>{const t=e.readUint32();if(1179937895!==t)throw new A.LH("Unexpected magic: "+t,A.SM.GLTFLoaderUnexpectedMagicError);const i=e.readUint32();this.loggingEnabled&&this._log(`Binary version: ${i}`);const n=e.readUint32();let s;switch(this.useRangeRequests||n===e.buffer.byteLength||h.Y.Warn(`Length in header does not match actual data length: ${n} != ${e.buffer.byteLength}`),i){case 1:s=this._unpackBinaryV1Async(e,n);break;case 2:s=this._unpackBinaryV2Async(e,n);break;default:throw new Error("Unsupported version: "+i)}return this._endPerformanceCounter("Unpack Binary"),s}))}_unpackBinaryV1Async(e,t){const i=e.readUint32(),n=e.readUint32();if(0!==n)throw new Error(`Unexpected content format: ${n}`);const s=t-e.byteOffset,r={json:this._parseJson(e.readString(i)),bin:null};if(0!==s){const t=e.byteOffset;r.bin={readAsync:(i,n)=>e.buffer.readAsync(t+i,n),byteLength:s}}return Promise.resolve(r)}_unpackBinaryV2Async(e,t){const i=1313821514,n=e.readUint32();if(e.readUint32()!==i)throw new Error("First chunk format is not JSON");return e.byteOffset+n===t?e.loadAsync(n).then((()=>({json:this._parseJson(e.readString(n)),bin:null}))):e.loadAsync(n+8).then((()=>{const s={json:this._parseJson(e.readString(n)),bin:null},r=()=>{const n=e.readUint32();switch(e.readUint32()){case i:throw new Error("Unexpected JSON chunk");case 5130562:{const t=e.byteOffset;s.bin={readAsync:(i,n)=>e.buffer.readAsync(t+i,n),byteLength:n},e.skipBytes(n);break}default:e.skipBytes(n)}return e.byteOffset!==t?e.loadAsync(8).then(r):Promise.resolve(s)};return r()}))}static _parseVersion(e){if("1.0"===e||"1.0.1"===e)return{major:1,minor:0};const t=(e+"").match(/^(\d+)\.(\d+)/);return t?{major:parseInt(t[1]),minor:parseInt(t[2])}:null}static _compareVersion(e,t){return e.major>t.major?1:e.major<t.major?-1:e.minor>t.minor?1:e.minor<t.minor?-1:0}_logOpen(e){this._log(e),this._logIndentLevel++}_logClose(){--this._logIndentLevel}_logEnabled(e){const t=R._logSpaces.substr(0,2*this._logIndentLevel);h.Y.Log(`${t}${e}`)}_logDisabled(e){}_startPerformanceCounterEnabled(e){o.w1.StartPerformanceCounter(e)}_startPerformanceCounterDisabled(e){}_endPerformanceCounterEnabled(e){o.w1.EndPerformanceCounter(e)}_endPerformanceCounterDisabled(e){}}R.IncrementalLoading=!0,R.HomogeneousCoordinates=!1,R._MagicBase64Encoded="Z2xURg",R._logSpaces="                                ",a.n&&a.n.RegisterPlugin(new R),function(e){e[e.BYTE=5120]="BYTE",e[e.UNSIGNED_BYTE=5121]="UNSIGNED_BYTE",e[e.SHORT=5122]="SHORT",e[e.UNSIGNED_SHORT=5123]="UNSIGNED_SHORT",e[e.FLOAT=5126]="FLOAT"}(g||(g={})),function(e){e[e.FRAGMENT=35632]="FRAGMENT",e[e.VERTEX=35633]="VERTEX"}(v||(v={})),function(e){e[e.BYTE=5120]="BYTE",e[e.UNSIGNED_BYTE=5121]="UNSIGNED_BYTE",e[e.SHORT=5122]="SHORT",e[e.UNSIGNED_SHORT=5123]="UNSIGNED_SHORT",e[e.INT=5124]="INT",e[e.UNSIGNED_INT=5125]="UNSIGNED_INT",e[e.FLOAT=5126]="FLOAT",e[e.FLOAT_VEC2=35664]="FLOAT_VEC2",e[e.FLOAT_VEC3=35665]="FLOAT_VEC3",e[e.FLOAT_VEC4=35666]="FLOAT_VEC4",e[e.INT_VEC2=35667]="INT_VEC2",e[e.INT_VEC3=35668]="INT_VEC3",e[e.INT_VEC4=35669]="INT_VEC4",e[e.BOOL=35670]="BOOL",e[e.BOOL_VEC2=35671]="BOOL_VEC2",e[e.BOOL_VEC3=35672]="BOOL_VEC3",e[e.BOOL_VEC4=35673]="BOOL_VEC4",e[e.FLOAT_MAT2=35674]="FLOAT_MAT2",e[e.FLOAT_MAT3=35675]="FLOAT_MAT3",e[e.FLOAT_MAT4=35676]="FLOAT_MAT4",e[e.SAMPLER_2D=35678]="SAMPLER_2D"}(y||(y={})),function(e){e[e.CLAMP_TO_EDGE=33071]="CLAMP_TO_EDGE",e[e.MIRRORED_REPEAT=33648]="MIRRORED_REPEAT",e[e.REPEAT=10497]="REPEAT"}(x||(x={})),function(e){e[e.NEAREST=9728]="NEAREST",e[e.LINEAR=9728]="LINEAR",e[e.NEAREST_MIPMAP_NEAREST=9984]="NEAREST_MIPMAP_NEAREST",e[e.LINEAR_MIPMAP_NEAREST=9985]="LINEAR_MIPMAP_NEAREST",e[e.NEAREST_MIPMAP_LINEAR=9986]="NEAREST_MIPMAP_LINEAR",e[e.LINEAR_MIPMAP_LINEAR=9987]="LINEAR_MIPMAP_LINEAR"}(b||(b={})),function(e){e[e.ALPHA=6406]="ALPHA",e[e.RGB=6407]="RGB",e[e.RGBA=6408]="RGBA",e[e.LUMINANCE=6409]="LUMINANCE",e[e.LUMINANCE_ALPHA=6410]="LUMINANCE_ALPHA"}(T||(T={})),function(e){e[e.FRONT=1028]="FRONT",e[e.BACK=1029]="BACK",e[e.FRONT_AND_BACK=1032]="FRONT_AND_BACK"}(S||(S={})),function(e){e[e.ZERO=0]="ZERO",e[e.ONE=1]="ONE",e[e.SRC_COLOR=768]="SRC_COLOR",e[e.ONE_MINUS_SRC_COLOR=769]="ONE_MINUS_SRC_COLOR",e[e.DST_COLOR=774]="DST_COLOR",e[e.ONE_MINUS_DST_COLOR=775]="ONE_MINUS_DST_COLOR",e[e.SRC_ALPHA=770]="SRC_ALPHA",e[e.ONE_MINUS_SRC_ALPHA=771]="ONE_MINUS_SRC_ALPHA",e[e.DST_ALPHA=772]="DST_ALPHA",e[e.ONE_MINUS_DST_ALPHA=773]="ONE_MINUS_DST_ALPHA",e[e.CONSTANT_COLOR=32769]="CONSTANT_COLOR",e[e.ONE_MINUS_CONSTANT_COLOR=32770]="ONE_MINUS_CONSTANT_COLOR",e[e.CONSTANT_ALPHA=32771]="CONSTANT_ALPHA",e[e.ONE_MINUS_CONSTANT_ALPHA=32772]="ONE_MINUS_CONSTANT_ALPHA",e[e.SRC_ALPHA_SATURATE=776]="SRC_ALPHA_SATURATE"}(E||(E={}));var M=i(4141),I=i(4649),D=i(2704),O=i(8482),w=i(4676),N=i(4026),F=i(5047),L=i(1979),B=i(7104),U=i(9828),V=i(252),k=i(8097),G=i(2262),z=i(2101),W=i(708),H=i(7321),X=i(9401),j=i(1795),Y=i(4496),q=i(7616),K=i(7951),$=i(5520),Q=i(6317);class Z{static SetMatrix(e,t,i,n,s){let r=null;if("MODEL"===i.semantic?r=t.getWorldMatrix():"PROJECTION"===i.semantic?r=e.getProjectionMatrix():"VIEW"===i.semantic?r=e.getViewMatrix():"MODELVIEWINVERSETRANSPOSE"===i.semantic?r=M.y3.Transpose(t.getWorldMatrix().multiply(e.getViewMatrix()).invert()):"MODELVIEW"===i.semantic?r=t.getWorldMatrix().multiply(e.getViewMatrix()):"MODELVIEWPROJECTION"===i.semantic?r=t.getWorldMatrix().multiply(e.getTransformMatrix()):"MODELINVERSE"===i.semantic?r=t.getWorldMatrix().invert():"VIEWINVERSE"===i.semantic?r=e.getViewMatrix().invert():"PROJECTIONINVERSE"===i.semantic?r=e.getProjectionMatrix().invert():"MODELVIEWINVERSE"===i.semantic?r=t.getWorldMatrix().multiply(e.getViewMatrix()).invert():"MODELVIEWPROJECTIONINVERSE"===i.semantic?r=t.getWorldMatrix().multiply(e.getTransformMatrix()).invert():"MODELINVERSETRANSPOSE"===i.semantic&&(r=M.y3.Transpose(t.getWorldMatrix().invert())),r)switch(i.type){case y.FLOAT_MAT2:s.setMatrix2x2(n,M.y3.GetAsMatrix2x2(r));break;case y.FLOAT_MAT3:s.setMatrix3x3(n,M.y3.GetAsMatrix3x3(r));break;case y.FLOAT_MAT4:s.setMatrix(n,r)}}static SetUniform(e,t,i,n){switch(n){case y.FLOAT:return e.setFloat(t,i),!0;case y.FLOAT_VEC2:return e.setVector2(t,M.FM.FromArray(i)),!0;case y.FLOAT_VEC3:return e.setVector3(t,M.P.FromArray(i)),!0;case y.FLOAT_VEC4:return e.setVector4(t,M.Lt.FromArray(i)),!0;default:return!1}}static GetWrapMode(e){switch(e){case x.CLAMP_TO_EDGE:return G.x.CLAMP_ADDRESSMODE;case x.MIRRORED_REPEAT:return G.x.MIRROR_ADDRESSMODE;case x.REPEAT:default:return G.x.WRAP_ADDRESSMODE}}static GetByteStrideFromType(e){switch(e.type){case"VEC2":return 2;case"VEC3":return 3;case"VEC4":case"MAT2":return 4;case"MAT3":return 9;case"MAT4":return 16;default:return 1}}static GetTextureFilterMode(e){switch(e){case b.LINEAR:case b.LINEAR_MIPMAP_NEAREST:case b.LINEAR_MIPMAP_LINEAR:return G.x.TRILINEAR_SAMPLINGMODE;case b.NEAREST:case b.NEAREST_MIPMAP_NEAREST:return G.x.NEAREST_SAMPLINGMODE;default:return G.x.BILINEAR_SAMPLINGMODE}}static GetBufferFromBufferView(e,t,i,n,s){i=t.byteOffset+i;const r=e.loadedBufferViews[t.buffer];if(i+n>r.byteLength)throw new Error("Buffer access is out of range");const o=r.buffer;switch(i+=r.byteOffset,s){case g.BYTE:return new Int8Array(o,i,n);case g.UNSIGNED_BYTE:return new Uint8Array(o,i,n);case g.SHORT:return new Int16Array(o,i,n);case g.UNSIGNED_SHORT:return new Uint16Array(o,i,n);default:return new Float32Array(o,i,n)}}static GetBufferFromAccessor(e,t){const i=e.bufferViews[t.bufferView],n=t.count*Z.GetByteStrideFromType(t);return Z.GetBufferFromBufferView(e,i,t.byteOffset,n,t.componentType)}static DecodeBufferToText(e){let t="";const i=e.byteLength;for(let n=0;n<i;++n)t+=String.fromCharCode(e[n]);return t}static GetDefaultMaterial(e){if(!Z._DefaultMaterial){L.Q.ShadersStore.GLTFDefaultMaterialVertexShader=["precision highp float;","","uniform mat4 worldView;","uniform mat4 projection;","","attribute vec3 position;","","void main(void)","{","    gl_Position = projection * worldView * vec4(position, 1.0);","}"].join("\n"),L.Q.ShadersStore.GLTFDefaultMaterialPixelShader=["precision highp float;","","uniform vec4 u_emission;","","void main(void)","{","    gl_FragColor = u_emission;","}"].join("\n");const t={vertex:"GLTFDefaultMaterial",fragment:"GLTFDefaultMaterial"},i={attributes:["position"],uniforms:["worldView","projection","u_emission"],samplers:new Array,needAlphaBlending:!1};Z._DefaultMaterial=new k.j("GLTFDefaultMaterial",e,t,i),Z._DefaultMaterial.setColor4("u_emission",new I.HE(.5,.5,.5,1))}return Z._DefaultMaterial}}Z._DefaultMaterial=null;var J,ee=i(7458);!function(e){e[e.IDENTIFIER=1]="IDENTIFIER",e[e.UNKNOWN=2]="UNKNOWN",e[e.END_OF_INPUT=3]="END_OF_INPUT"}(J||(J={}));class te{constructor(e){this._pos=0,this.currentToken=J.UNKNOWN,this.currentIdentifier="",this.currentString="",this.isLetterOrDigitPattern=/^[a-zA-Z0-9]+$/,this._toParse=e,this._maxPos=e.length}getNextToken(){if(this.isEnd())return J.END_OF_INPUT;if(this.currentString=this.read(),this.currentToken=J.UNKNOWN,"_"===this.currentString||this.isLetterOrDigitPattern.test(this.currentString))for(this.currentToken=J.IDENTIFIER,this.currentIdentifier=this.currentString;!this.isEnd()&&(this.isLetterOrDigitPattern.test(this.currentString=this.peek())||"_"===this.currentString);)this.currentIdentifier+=this.currentString,this.forward();return this.currentToken}peek(){return this._toParse[this._pos]}read(){return this._toParse[this._pos++]}forward(){this._pos++}isEnd(){return this._pos>=this._maxPos}}const ie=["MODEL","VIEW","PROJECTION","MODELVIEW","MODELVIEWPROJECTION","JOINTMATRIX"],ne=["world","view","projection","worldView","worldViewProjection","mBones"],se=["translation","rotation","scale"],re=["position","rotationQuaternion","scaling"],oe=(e,t,i)=>{for(const n in e){const s=e[n];i[t][n]=s}},ae=e=>{if(e)for(let t=0;t<e.length/2;t++)e[2*t+1]=1-e[2*t+1]},le=e=>{if("NORMAL"===e.semantic)return"normal";if("POSITION"===e.semantic)return"position";if("JOINT"===e.semantic)return"matricesIndices";if("WEIGHT"===e.semantic)return"matricesWeights";if("COLOR"===e.semantic)return"color";if(e.semantic&&-1!==e.semantic.indexOf("TEXCOORD_")){const t=Number(e.semantic.split("_")[1]);return"uv"+(0===t?"":t+1)}return null},he=e=>{let t=null;if(e.translation||e.rotation||e.scale){const i=M.P.FromArray(e.scale||[1,1,1]),n=M._f.FromArray(e.rotation||[0,0,0,1]),s=M.P.FromArray(e.translation||[0,0,0]);t=M.y3.Compose(i,n,s)}else t=M.y3.FromArray(e.matrix);return t},ce=(e,t,i,n)=>{for(let e=0;e<n.bones.length;e++)if(n.bones[e].name===i)return n.bones[e];const s=e.nodes;for(const r in s){const o=s[r];if(!o.jointName)continue;const a=o.children;for(let s=0;s<a.length;s++){const l=e.nodes[a[s]];if(l.jointName&&l.jointName===i){const i=he(o),s=new N.N(o.name||"",n,ce(e,t,o.jointName,n),i);return s.id=r,s}}}return null},ue=(e,t)=>{for(let i=0;i<e.length;i++){const n=e[i];for(let e=0;e<n.node.children.length;e++)if(n.node.children[e]===t)return n.bone}return null},de=(e,t)=>{const i=e.nodes;let n=i[t];if(n)return{node:n,id:t};for(const e in i)if(n=i[e],n.jointName===t)return{node:n,id:e};return null},pe=(e,t)=>{for(let i=0;i<e.jointNames.length;i++)if(e.jointNames[i]===t)return!0;return!1},fe=(e,t,i,n,s)=>{if(s||(e.scene._blockEntityCollection=!!e.assetContainer,(s=new Y.Kj(t.name||"",e.scene))._parentContainer=e.assetContainer,e.scene._blockEntityCollection=!1,s.id=n),!t.babylonNode)return s;const r=[];let o=null;const a=new Array,l=new Array,h=new Array,c=new Array;for(let t=0;t<i.length;t++){const n=i[t],s=e.meshes[n];if(s)for(let t=0;t<s.primitives.length;t++){const i=new z.x,n=s.primitives[t];n.mode;const u=n.attributes;let d=null,p=null;for(const t in u)if(d=e.accessors[u[t]],p=Z.GetBufferFromAccessor(e,d),"NORMAL"===t)i.normals=new Float32Array(p.length),i.normals.set(p);else if("POSITION"===t){if(R.HomogeneousCoordinates){i.positions=new Float32Array(p.length-p.length/4);for(let e=0;e<p.length;e+=4)i.positions[e]=p[e],i.positions[e+1]=p[e+1],i.positions[e+2]=p[e+2]}else i.positions=new Float32Array(p.length),i.positions.set(p);l.push(i.positions.length)}else if(-1!==t.indexOf("TEXCOORD_")){const e=Number(t.split("_")[1]),n=W.o.UVKind+(0===e?"":e+1),s=new Float32Array(p.length);s.set(p),ae(s),i.set(s,n)}else"JOINT"===t?(i.matricesIndices=new Float32Array(p.length),i.matricesIndices.set(p)):"WEIGHT"===t?(i.matricesWeights=new Float32Array(p.length),i.matricesWeights.set(p)):"COLOR"===t&&(i.colors=new Float32Array(p.length),i.colors.set(p));if(d=e.accessors[n.indices],d)p=Z.GetBufferFromAccessor(e,d),i.indices=new Int32Array(p.length),i.indices.set(p),c.push(i.indices.length);else{const e=[];for(let t=0;t<i.positions.length/3;t++)e.push(t);i.indices=new Int32Array(e),c.push(i.indices.length)}o?o.merge(i):o=i;const f=e.scene.getMaterialById(n.material);r.push(null===f?Z.GetDefaultMaterial(e.scene):f),a.push(0===a.length?0:a[a.length-1]+l[l.length-2]),h.push(0===h.length?0:h[h.length-1]+c[c.length-2])}}let u;e.scene._blockEntityCollection=!!e.assetContainer,r.length>1?(u=new U.G("multimat"+n,e.scene),u.subMaterials=r):u=new V.K("multimat"+n,e.scene),1===r.length&&(u=r[0]),u._parentContainer=e.assetContainer,s.material||(s.material=u),new H.Z(n,e.scene,o,!1,s),s.computeWorldMatrix(!0),e.scene._blockEntityCollection=!1,s.subMeshes=[];let d=0;for(let t=0;t<i.length;t++){const n=i[t],r=e.meshes[n];if(r)for(let e=0;e<r.primitives.length;e++)r.primitives[e].mode,X.P.AddToMesh(d,a[d],l[d],h[d],c[d],s,s,!0),d++}return s},_e=(e,t,i,n)=>{e.position&&(e.position=t),(e.rotationQuaternion||e.rotation)&&(e.rotationQuaternion=i),e.scaling&&(e.scaling=n)},me=(e,t,i)=>{let n=null;if(e.importOnlyMeshes&&(t.skin||t.meshes)&&e.importMeshesNames&&e.importMeshesNames.length>0&&-1===e.importMeshesNames.indexOf(t.name||""))return null;if(t.skin){if(t.meshes){const s=e.skins[t.skin],r=fe(e,t,t.meshes,i,t.babylonNode);r.skeleton=e.scene.getLastSkeletonById(t.skin),null===r.skeleton&&(r.skeleton=((e,t,i,n)=>{if(n||(n=new F.O(t.name||"","",e.scene)),!t.babylonSkeleton)return n;const s=[],r=[];((e,t,i,n)=>{for(const s in e.nodes){const r=e.nodes[s],o=s;if(!r.jointName||pe(i,r.jointName))continue;const a=he(r),l=new N.N(r.name||"",t,null,a);l.id=o,n.push({bone:l,node:r,id:o})}for(let e=0;e<n.length;e++){const t=n[e],i=t.node.children;for(let e=0;e<i.length;e++){let s=null;for(let t=0;t<n.length;t++)if(n[t].id===i[e]){s=n[t];break}s&&(s.bone._parent=t.bone,t.bone.children.push(s.bone))}}})(e,n,t,s),n.bones=[];for(let i=0;i<t.jointNames.length;i++){const a=de(e,t.jointNames[i]);if(!a)continue;const l=a.node;if(!l){o.w1.Warn("Joint named "+t.jointNames[i]+" does not exist");continue}const h=a.id,c=e.scene.getBoneById(h);if(c){n.bones.push(c);continue}let u=!1,d=null;for(let s=0;s<i;s++){const i=de(e,t.jointNames[s]);if(!i)continue;const r=i.node;if(!r){o.w1.Warn("Joint named "+t.jointNames[s]+" does not exist when looking for parent");continue}const a=r.children;if(a){u=!1;for(let i=0;i<a.length;i++)if(a[i]===h){d=ce(e,t,t.jointNames[s],n),u=!0;break}if(u)break}}const p=he(l);!d&&s.length>0&&(d=ue(s,h),d&&-1===r.indexOf(d)&&r.push(d)),new N.N(l.jointName||"",n,d,p).id=h}const a=n.bones;n.bones=[];for(let i=0;i<t.jointNames.length;i++){const s=de(e,t.jointNames[i]);if(s)for(let e=0;e<a.length;e++)if(a[e].id===s.id){n.bones.push(a[e]);break}}n.prepare();for(let e=0;e<r.length;e++)n.bones.push(r[e]);return n})(e,s,0,s.babylonSkeleton),s.babylonSkeleton||(s.babylonSkeleton=r.skeleton)),n=r}}else if(t.meshes)n=fe(e,t,t.mesh?[t.mesh]:t.meshes,i,t.babylonNode);else if(!t.light||t.babylonNode||e.importOnlyMeshes){if(t.camera&&!t.babylonNode&&!e.importOnlyMeshes){const i=e.cameras[t.camera];if(i){if(e.scene._blockEntityCollection=!!e.assetContainer,"orthographic"===i.type){const i=new O.c(t.camera,M.P.Zero(),e.scene,!1);i.name=t.name||"",i.mode=D.V.ORTHOGRAPHIC_CAMERA,i.attachControl(),n=i,i._parentContainer=e.assetContainer}else if("perspective"===i.type){const s=i[i.type],r=new O.c(t.camera,M.P.Zero(),e.scene,!1);r.name=t.name||"",r.attachControl(),s.aspectRatio||(s.aspectRatio=e.scene.getEngine().getRenderWidth()/e.scene.getEngine().getRenderHeight()),s.znear&&s.zfar&&(r.maxZ=s.zfar,r.minZ=s.znear),n=r,r._parentContainer=e.assetContainer}e.scene._blockEntityCollection=!1}}}else{const i=e.lights[t.light];if(i)if("ambient"===i.type){const s=i[i.type],r=new q.e(t.light,M.P.Zero(),e.scene);r.name=t.name||"",s.color&&(r.diffuse=I.Wo.FromArray(s.color)),n=r}else if("directional"===i.type){const s=i[i.type],r=new K.O(t.light,M.P.Zero(),e.scene);r.name=t.name||"",s.color&&(r.diffuse=I.Wo.FromArray(s.color)),n=r}else if("point"===i.type){const s=i[i.type],r=new $.c(t.light,M.P.Zero(),e.scene);r.name=t.name||"",s.color&&(r.diffuse=I.Wo.FromArray(s.color)),n=r}else if("spot"===i.type){const s=i[i.type],r=new Q.P(t.light,M.P.Zero(),M.P.Zero(),0,0,e.scene);r.name=t.name||"",s.color&&(r.diffuse=I.Wo.FromArray(s.color)),s.fallOfAngle&&(r.angle=s.fallOfAngle),s.fallOffExponent&&(r.exponent=s.fallOffExponent),n=r}}if(!t.jointName){if(t.babylonNode)return t.babylonNode;if(null===n){e.scene._blockEntityCollection=!!e.assetContainer;const i=new Y.Kj(t.name||"",e.scene);i._parentContainer=e.assetContainer,e.scene._blockEntityCollection=!1,t.babylonNode=i,n=i}}if(null!==n){if(t.matrix&&n instanceof Y.Kj)((e,t)=>{if(t.matrix){const i=new M.P(0,0,0),n=new M._f,s=new M.P(0,0,0);M.y3.FromArray(t.matrix).decompose(s,n,i),_e(e,i,n,s)}else t.translation&&t.rotation&&t.scale&&_e(e,M.P.FromArray(t.translation),M._f.FromArray(t.rotation),M.P.FromArray(t.scale));e.computeWorldMatrix(!0)})(n,t);else{const e=t.translation||[0,0,0],i=t.rotation||[0,0,0,1],s=t.scale||[1,1,1];_e(n,M.P.FromArray(e),M._f.FromArray(i),M.P.FromArray(s))}n.updateCache(!0),t.babylonNode=n}return n},ge=(e,t,i,n=!1)=>{const s=e.nodes[t];let r=null;if(n=!(e.importOnlyMeshes&&!n&&e.importMeshesNames)||-1!==e.importMeshesNames.indexOf(s.name||"")||0===e.importMeshesNames.length,!s.jointName&&n&&(r=me(e,s,t),null!==r&&(r.id=t,r.parent=i)),s.children)for(let t=0;t<s.children.length;t++)ge(e,s.children[t],r,n)},ve=e=>{let t=e.currentScene;if(t)for(let i=0;i<t.nodes.length;i++)ge(e,t.nodes[i],null);else for(const i in e.scenes){t=e.scenes[i];for(let i=0;i<t.nodes.length;i++)ge(e,t.nodes[i],null)}(e=>{for(const t in e.animations){const i=e.animations[t];if(!i.channels||!i.samplers)continue;let n=null;for(let s=0;s<i.channels.length;s++){const r=i.channels[s],a=i.samplers[r.sampler];if(!a)continue;let l=null,h=null;i.parameters?(l=i.parameters[a.input],h=i.parameters[a.output]):(l=a.input,h=a.output);const c=Z.GetBufferFromAccessor(e,e.accessors[l]),u=Z.GetBufferFromAccessor(e,e.accessors[h]),d=r.target.id;let p=e.scene.getNodeById(d);if(null===p&&(p=e.scene.getNodeByName(d)),null===p){o.w1.Warn("Creating animation named "+t+". But cannot find node named "+d+" to attach to");continue}const f=p instanceof N.N;let _=r.target.path;const m=se.indexOf(_);-1!==m&&(_=re[m]);let g=w.f.ANIMATIONTYPE_MATRIX;f||("rotationQuaternion"===_?(g=w.f.ANIMATIONTYPE_QUATERNION,p.rotationQuaternion=new M._f):g=w.f.ANIMATIONTYPE_VECTOR3);let v=null;const y=[];let x=0,b=!1;f&&n&&n.getKeys().length===c.length&&(v=n,b=!0),b||(e.scene._blockEntityCollection=!!e.assetContainer,v=new w.f(t,f?"_matrix":_,1,g,w.f.ANIMATIONLOOPMODE_CYCLE),e.scene._blockEntityCollection=!1);for(let e=0;e<c.length;e++){let t=null;if("rotationQuaternion"===_?(t=M._f.FromArray([u[x],u[x+1],u[x+2],u[x+3]]),x+=4):(t=M.P.FromArray([u[x],u[x+1],u[x+2]]),x+=3),f){const i=p;let s=M.P.Zero(),r=new M._f,o=M.P.Zero(),a=i.getBaseMatrix();b&&n&&(a=n.getKeys()[e].value),a.decompose(o,r,s),"position"===_?s=t:"rotationQuaternion"===_?r=t:o=t,t=M.y3.Compose(o,r,s)}b?n&&(n.getKeys()[e].value=t):y.push({frame:c[e],value:t})}!b&&v&&(v.setKeys(y),p.animations.push(v)),n=v,e.scene.stopAnimation(p),e.scene.beginAnimation(p,0,c[c.length-1],!0,1)}}})(e);for(let t=0;t<e.scene.skeletons.length;t++){const i=e.scene.skeletons[t];e.scene.beginAnimation(i,0,Number.MAX_VALUE,!0,1)}},ye=(e,t,i)=>{for(const n in t.uniforms){const s=t.uniforms[n],r=t.parameters[s];if(e.currentIdentifier===n&&r.semantic&&!r.source&&!r.node){const e=ie.indexOf(r.semantic);if(-1!==e)return delete i[n],ne[e]}}return e.currentIdentifier},xe=e=>{for(const t in e.materials)Se.LoadMaterialAsync(e,t,(()=>{}),(()=>{}))};class be{static CreateRuntime(e,t,i){const n={extensions:{},accessors:{},buffers:{},bufferViews:{},meshes:{},lights:{},cameras:{},nodes:{},images:{},textures:{},shaders:{},programs:{},samplers:{},techniques:{},materials:{},animations:{},skins:{},extensionsUsed:[],scenes:{},buffersCount:0,shaderscount:0,scene:t,rootUrl:i,loadedBufferCount:0,loadedBufferViews:{},loadedShaderCount:0,importOnlyMeshes:!1,dummyNodes:[],assetContainer:null};return e.extensions&&oe(e.extensions,"extensions",n),e.extensionsUsed&&oe(e.extensionsUsed,"extensionsUsed",n),e.buffers&&((e,t)=>{for(const i in e){const n=e[i];t.buffers[i]=n,t.buffersCount++}})(e.buffers,n),e.bufferViews&&oe(e.bufferViews,"bufferViews",n),e.accessors&&oe(e.accessors,"accessors",n),e.meshes&&oe(e.meshes,"meshes",n),e.lights&&oe(e.lights,"lights",n),e.cameras&&oe(e.cameras,"cameras",n),e.nodes&&oe(e.nodes,"nodes",n),e.images&&oe(e.images,"images",n),e.textures&&oe(e.textures,"textures",n),e.shaders&&((e,t)=>{for(const i in e){const n=e[i];t.shaders[i]=n,t.shaderscount++}})(e.shaders,n),e.programs&&oe(e.programs,"programs",n),e.samplers&&oe(e.samplers,"samplers",n),e.techniques&&oe(e.techniques,"techniques",n),e.materials&&oe(e.materials,"materials",n),e.animations&&oe(e.animations,"animations",n),e.skins&&oe(e.skins,"skins",n),e.scenes&&(n.scenes=e.scenes),e.scene&&e.scenes&&(n.currentScene=e.scenes[e.scene]),n}static LoadBufferAsync(e,t,i,n,s){const r=e.buffers[t];o.w1.IsBase64(r.uri)?setTimeout((()=>i(new Uint8Array(o.w1.DecodeBase64(r.uri))))):o.w1.LoadFile(e.rootUrl+r.uri,(e=>i(new Uint8Array(e))),s,void 0,!0,(e=>{e&&n(e.status+" "+e.statusText)}))}static LoadTextureBufferAsync(e,t,i,n){const s=e.textures[t];if(!s||!s.source)return void n("");if(s.babylonTexture)return void i(null);const r=e.images[s.source];o.w1.IsBase64(r.uri)?setTimeout((()=>i(new Uint8Array(o.w1.DecodeBase64(r.uri))))):o.w1.LoadFile(e.rootUrl+r.uri,(e=>i(new Uint8Array(e))),void 0,void 0,!0,(e=>{e&&n(e.status+" "+e.statusText)}))}static CreateTextureAsync(e,t,i,n){const s=e.textures[t];if(s.babylonTexture)return void n(s.babylonTexture);const r=e.samplers[s.sampler],o=r.minFilter===b.NEAREST_MIPMAP_NEAREST||r.minFilter===b.NEAREST_MIPMAP_LINEAR||r.minFilter===b.LINEAR_MIPMAP_NEAREST||r.minFilter===b.LINEAR_MIPMAP_LINEAR,a=G.x.BILINEAR_SAMPLINGMODE,l=null==i?new Blob:new Blob([i]),h=URL.createObjectURL(l),c=()=>URL.revokeObjectURL(h),u=new G.x(h,e.scene,!o,!0,a,c,c);void 0!==r.wrapS&&(u.wrapU=Z.GetWrapMode(r.wrapS)),void 0!==r.wrapT&&(u.wrapV=Z.GetWrapMode(r.wrapT)),u.name=t,s.babylonTexture=u,n(u)}static LoadShaderStringAsync(e,t,i,n){const s=e.shaders[t];if(o.w1.IsBase64(s.uri)){const e=atob(s.uri.split(",")[1]);i&&i(e)}else o.w1.LoadFile(e.rootUrl+s.uri,i,void 0,void 0,!1,(e=>{e&&n&&n(e.status+" "+e.statusText)}))}static LoadMaterialAsync(e,t,i,n){const s=e.materials[t];if(!s.technique)return void(n&&n("No technique found."));const r=e.techniques[s.technique];if(!r){e.scene._blockEntityCollection=!!e.assetContainer;const n=new V.K(t,e.scene);return n._parentContainer=e.assetContainer,e.scene._blockEntityCollection=!1,n.diffuseColor=new I.Wo(.5,.5,.5),n.sideOrientation=B.F.CounterClockWiseSideOrientation,void i(n)}const o=e.programs[r.program],a=r.states,l=L.Q.ShadersStore[o.vertexShader+"VertexShader"],h=L.Q.ShadersStore[o.fragmentShader+"PixelShader"];let c="",u="";const d=new te(l),p=new te(h),f={},_=[],m=[],g=[];for(const e in r.uniforms){const t=r.uniforms[e],i=r.parameters[t];if(f[e]=i,!i.semantic||i.node||i.source)i.type===y.SAMPLER_2D?g.push(e):_.push(e);else{const t=ie.indexOf(i.semantic);-1!==t?(_.push(ne[t]),delete f[e]):_.push(e)}}for(const e in r.attributes){const t=r.attributes[e],i=r.parameters[t];if(i.semantic){const e=le(i);e&&m.push(e)}}for(;!d.isEnd()&&d.getNextToken();){if(d.currentToken!==J.IDENTIFIER){c+=d.currentString;continue}let e=!1;for(const t in r.attributes){const i=r.attributes[t],n=r.parameters[i];if(d.currentIdentifier===t&&n.semantic){c+=le(n),e=!0;break}}e||(c+=ye(d,r,f))}for(;!p.isEnd()&&p.getNextToken();)p.currentToken===J.IDENTIFIER?u+=ye(p,r,f):u+=p.currentString;const v={vertex:o.vertexShader+t,fragment:o.fragmentShader+t},x={attributes:m,uniforms:_,samplers:g,needAlphaBlending:a&&a.enable&&-1!==a.enable.indexOf(3042)};L.Q.ShadersStore[o.vertexShader+t+"VertexShader"]=c,L.Q.ShadersStore[o.fragmentShader+t+"PixelShader"]=u;const b=new k.j(t,e.scene,v,x);if(b.onError=((e,t,i)=>(n,s)=>{t.dispose(!0),i("Cannot compile program named "+e.name+". Error: "+s+". Default material will be applied")})(o,b,n),b.onCompiled=((e,t,i,n,s,r)=>o=>{((e,t,i,n,s)=>{const r=n.values||i.parameters,o=i.uniforms;for(const i in s){const a=s[i],l=a.type;let h=r[o[i]];if(void 0===h&&(h=a.value),!h)continue;const c=e=>i=>{a.value&&e&&(t.setTexture(e,i),delete s[e])};l===y.SAMPLER_2D?Se.LoadTextureAsync(e,n.values?h:a.value,c(i),(()=>c(null))):a.value&&Z.SetUniform(t,i,n.values?h:a.value,l)&&delete s[i]}})(e,t,i,n,s),t.onBind=o=>{((e,t,i,n,s,r,o)=>{const a=r.values||s.parameters;for(const o in i){const l=i[o],h=l.type;if(h===y.FLOAT_MAT2||h===y.FLOAT_MAT3||h===y.FLOAT_MAT4)if(!l.semantic||l.source||l.node){if(l.semantic&&(l.source||l.node)){let e=t.scene.getNodeByName(l.source||l.node||"");if(null===e&&(e=t.scene.getNodeById(l.source||l.node||"")),null===e)continue;Z.SetMatrix(t.scene,e,l,o,n.getEffect())}}else Z.SetMatrix(t.scene,e,l,o,n.getEffect());else{const e=a[s.uniforms[o]];if(!e)continue;if(h===y.SAMPLER_2D){const i=t.textures[r.values?e:l.value].babylonTexture;if(null==i)continue;n.getEffect().setTexture(o,i)}else Z.SetUniform(n.getEffect(),o,e,h)}}o(n)})(o,e,s,t,i,n,r)}})(e,b,r,s,f,i),b.sideOrientation=B.F.CounterClockWiseSideOrientation,a&&a.functions){const e=a.functions;e.cullFace&&e.cullFace[0]!==S.BACK&&(b.backFaceCulling=!1);const t=e.blendFuncSeparate;t&&(t[0]===E.SRC_ALPHA&&t[1]===E.ONE_MINUS_SRC_ALPHA&&t[2]===E.ONE&&t[3]===E.ONE?b.alphaMode=ee.g.ALPHA_COMBINE:t[0]===E.ONE&&t[1]===E.ONE&&t[2]===E.ZERO&&t[3]===E.ONE?b.alphaMode=ee.g.ALPHA_ONEONE:t[0]===E.SRC_ALPHA&&t[1]===E.ONE&&t[2]===E.ZERO&&t[3]===E.ONE?b.alphaMode=ee.g.ALPHA_ADD:t[0]===E.ZERO&&t[1]===E.ONE_MINUS_SRC_COLOR&&t[2]===E.ONE&&t[3]===E.ONE?b.alphaMode=ee.g.ALPHA_SUBTRACT:t[0]===E.DST_COLOR&&t[1]===E.ZERO&&t[2]===E.ONE&&t[3]===E.ONE?b.alphaMode=ee.g.ALPHA_MULTIPLY:t[0]===E.SRC_ALPHA&&t[1]===E.ONE_MINUS_SRC_COLOR&&t[2]===E.ONE&&t[3]===E.ONE&&(b.alphaMode=ee.g.ALPHA_MAXIMIZED))}}}class Te{static RegisterExtension(e){Te.Extensions[e.name]?o.w1.Error('Tool with the same name "'+e.name+'" already exists'):Te.Extensions[e.name]=e}dispose(){}_importMeshAsync(e,t,i,n,s,r,a,l){return t.useRightHandedSystem=!0,Se.LoadRuntimeAsync(t,i,n,(t=>{t.assetContainer=s,t.importOnlyMeshes=!0,""===e?t.importMeshesNames=[]:"string"==typeof e?t.importMeshesNames=[e]:!e||e instanceof Array?(t.importMeshesNames=[],o.w1.Warn("Argument meshesNames must be of type string or string[]")):t.importMeshesNames=[e],this._createNodes(t);const i=new Array,n=new Array;for(const e in t.nodes){const n=t.nodes[e];n.babylonNode instanceof j.x&&i.push(n.babylonNode)}for(const e in t.skins){const i=t.skins[e];i.babylonSkeleton instanceof F.O&&n.push(i.babylonSkeleton)}this._loadBuffersAsync(t,(()=>{this._loadShadersAsync(t,(()=>{xe(t),ve(t),!R.IncrementalLoading&&r&&r(i,n)}))})),R.IncrementalLoading&&r&&r(i,n)}),l),!0}importMeshAsync(e,t,i,n,s,r){return new Promise(((o,a)=>{this._importMeshAsync(e,t,n,s,i,((e,t)=>{o({meshes:e,particleSystems:[],skeletons:t,animationGroups:[],lights:[],transformNodes:[],geometries:[]})}),r,(e=>{a(new Error(e))}))}))}_loadAsync(e,t,i,n,s,r){e.useRightHandedSystem=!0,Se.LoadRuntimeAsync(e,t,i,(e=>{Se.LoadRuntimeExtensionsAsync(e,(()=>{this._createNodes(e),this._loadBuffersAsync(e,(()=>{this._loadShadersAsync(e,(()=>{xe(e),ve(e),R.IncrementalLoading||n()}))})),R.IncrementalLoading&&n()}),r)}),r)}loadAsync(e,t,i,n){return new Promise(((s,r)=>{this._loadAsync(e,t,i,(()=>{s()}),n,(e=>{r(new Error(e))}))}))}_loadShadersAsync(e,t){let i=!1;const n=(i,n)=>{Se.LoadShaderStringAsync(e,i,(s=>{s instanceof ArrayBuffer||(e.loadedShaderCount++,s&&(L.Q.ShadersStore[i+(n.type===v.VERTEX?"VertexShader":"PixelShader")]=s),e.loadedShaderCount===e.shaderscount&&t())}),(()=>{o.w1.Error("Error when loading shader program named "+i+" located at "+n.uri)}))};for(const t in e.shaders){i=!0;const s=e.shaders[t];s?n.bind(this,t,s)():o.w1.Error("No shader named: "+t)}i||t()}_loadBuffersAsync(e,t){let i=!1;const n=(i,n)=>{Se.LoadBufferAsync(e,i,(s=>{e.loadedBufferCount++,s&&(s.byteLength!=e.buffers[i].byteLength&&o.w1.Error("Buffer named "+i+" is length "+s.byteLength+". Expected: "+n.byteLength),e.loadedBufferViews[i]=s),e.loadedBufferCount===e.buffersCount&&t()}),(()=>{o.w1.Error("Error when loading buffer named "+i+" located at "+n.uri)}))};for(const t in e.buffers){i=!0;const s=e.buffers[t];s?n.bind(this,t,s)():o.w1.Error("No buffer named: "+t)}i||t()}_createNodes(e){let t=e.currentScene;if(t)for(let i=0;i<t.nodes.length;i++)ge(e,t.nodes[i],null);else for(const i in e.scenes){t=e.scenes[i];for(let i=0;i<t.nodes.length;i++)ge(e,t.nodes[i],null)}}}Te.Extensions={};class Se{constructor(e){this._name=e}get name(){return this._name}loadRuntimeAsync(e,t,i,n,s){return!1}loadRuntimeExtensionsAsync(e,t,i){return!1}loadBufferAsync(e,t,i,n,s){return!1}loadTextureBufferAsync(e,t,i,n){return!1}createTextureAsync(e,t,i,n,s){return!1}loadShaderStringAsync(e,t,i,n){return!1}loadMaterialAsync(e,t,i,n){return!1}static LoadRuntimeAsync(e,t,i,n,s){Se._ApplyExtensions((r=>r.loadRuntimeAsync(e,t,i,n,s)),(()=>{setTimeout((()=>{n&&n(be.CreateRuntime(t.json,e,i))}))}))}static LoadRuntimeExtensionsAsync(e,t,i){Se._ApplyExtensions((n=>n.loadRuntimeExtensionsAsync(e,t,i)),(()=>{setTimeout((()=>{t()}))}))}static LoadBufferAsync(e,t,i,n,s){Se._ApplyExtensions((r=>r.loadBufferAsync(e,t,i,n,s)),(()=>{be.LoadBufferAsync(e,t,i,n,s)}))}static LoadTextureAsync(e,t,i,n){Se._LoadTextureBufferAsync(e,t,(s=>{s&&Se._CreateTextureAsync(e,t,s,i,n)}),n)}static LoadShaderStringAsync(e,t,i,n){Se._ApplyExtensions((s=>s.loadShaderStringAsync(e,t,i,n)),(()=>{be.LoadShaderStringAsync(e,t,i,n)}))}static LoadMaterialAsync(e,t,i,n){Se._ApplyExtensions((s=>s.loadMaterialAsync(e,t,i,n)),(()=>{be.LoadMaterialAsync(e,t,i,n)}))}static _LoadTextureBufferAsync(e,t,i,n){Se._ApplyExtensions((s=>s.loadTextureBufferAsync(e,t,i,n)),(()=>{be.LoadTextureBufferAsync(e,t,i,n)}))}static _CreateTextureAsync(e,t,i,n,s){Se._ApplyExtensions((r=>r.createTextureAsync(e,t,i,n,s)),(()=>{be.CreateTextureAsync(e,t,i,n)}))}static _ApplyExtensions(e,t){for(const t in Te.Extensions)if(e(Te.Extensions[t]))return;t()}}R._CreateGLTF1Loader=()=>new Te;class Ee extends Se{constructor(){super("KHR_binary_glTF")}loadRuntimeAsync(e,t,i,n){const s=t.json.extensionsUsed;return!(!s||-1===s.indexOf(this.name)||!t.bin||(this._bin=t.bin,n(be.CreateRuntime(t.json,e,i)),0))}loadBufferAsync(e,t,i,n){return-1!==e.extensionsUsed.indexOf(this.name)&&"binary_glTF"===t&&(this._bin.readAsync(0,this._bin.byteLength).then(i,(e=>n(e.message))),!0)}loadTextureBufferAsync(e,t,i){const n=e.textures[t],s=e.images[n.source];if(!s.extensions||!(this.name in s.extensions))return!1;const r=s.extensions[this.name],o=e.bufferViews[r.bufferView];return i(Z.GetBufferFromBufferView(e,o,0,o.byteLength,g.UNSIGNED_BYTE)),!0}loadShaderStringAsync(e,t,i){const n=e.shaders[t];if(!n.extensions||!(this.name in n.extensions))return!1;const s=n.extensions[this.name],r=e.bufferViews[s.bufferView],o=Z.GetBufferFromBufferView(e,r,0,r.byteLength,g.UNSIGNED_BYTE);return setTimeout((()=>{const e=Z.DecodeBufferToText(o);i(e)})),!0}}Te.RegisterExtension(new Ee);class Ce extends Se{constructor(){super("KHR_materials_common")}loadRuntimeExtensionsAsync(e){if(!e.extensions)return!1;const t=e.extensions[this.name];if(!t)return!1;const i=t.lights;if(i)for(const t in i){const n=i[t];switch(n.type){case"ambient":{const t=new q.e(n.name,new M.P(0,1,0),e.scene),i=n.ambient;i&&(t.diffuse=I.Wo.FromArray(i.color||[1,1,1]));break}case"point":{const t=new $.c(n.name,new M.P(10,10,10),e.scene),i=n.point;i&&(t.diffuse=I.Wo.FromArray(i.color||[1,1,1]));break}case"directional":{const t=new K.O(n.name,new M.P(0,-1,0),e.scene),i=n.directional;i&&(t.diffuse=I.Wo.FromArray(i.color||[1,1,1]));break}case"spot":{const t=n.spot;t&&(new Q.P(n.name,new M.P(0,10,0),new M.P(0,-1,0),t.fallOffAngle||Math.PI,t.fallOffExponent||0,e.scene).diffuse=I.Wo.FromArray(t.color||[1,1,1]));break}default:o.w1.Warn('GLTF Material Common extension: light type "'+n.type+"” not supported")}}return!1}loadMaterialAsync(e,t,i,n){const s=e.materials[t];if(!s||!s.extensions)return!1;const r=s.extensions[this.name];if(!r)return!1;const o=new V.K(t,e.scene);return o.sideOrientation=B.F.CounterClockWiseSideOrientation,"CONSTANT"===r.technique&&(o.disableLighting=!0),o.backFaceCulling=void 0!==r.doubleSided&&!r.doubleSided,o.alpha=void 0===r.values.transparency?1:r.values.transparency,o.specularPower=void 0===r.values.shininess?0:r.values.shininess,"string"==typeof r.values.ambient?this._loadTexture(e,r.values.ambient,o,"ambientTexture",n):o.ambientColor=I.Wo.FromArray(r.values.ambient||[0,0,0]),"string"==typeof r.values.diffuse?this._loadTexture(e,r.values.diffuse,o,"diffuseTexture",n):o.diffuseColor=I.Wo.FromArray(r.values.diffuse||[0,0,0]),"string"==typeof r.values.emission?this._loadTexture(e,r.values.emission,o,"emissiveTexture",n):o.emissiveColor=I.Wo.FromArray(r.values.emission||[0,0,0]),"string"==typeof r.values.specular?this._loadTexture(e,r.values.specular,o,"specularTexture",n):o.specularColor=I.Wo.FromArray(r.values.specular||[0,0,0]),!0}_loadTexture(e,t,i,n,s){be.LoadTextureBufferAsync(e,t,(s=>{be.CreateTextureAsync(e,t,s,(e=>i[n]=e))}),s)}}Te.RegisterExtension(new Ce);var Ae=i(7188),Pe=i(4173),Re=i(2323),Me=i(9500),Ie=i(4674),De=i(7780),Oe=i(4702),we=i(3722);function Ne(e,t,i,n){return M.P.FromArray(t,i).scaleInPlace(n)}class Fe{constructor(e,t,i,n){this.type=e,this.name=t,this.getValue=i,this.getStride=n}_buildAnimation(e,t,i){const n=new w.f(e,this.name,t,this.type);return n.setKeys(i),n}}class Le extends Fe{buildAnimations(e,t,i,n,s){s(e._babylonTransformNode,this._buildAnimation(t,i,n))}}const Be={translation:[new Le(w.f.ANIMATIONTYPE_VECTOR3,"position",Ne,(()=>3))],rotation:[new Le(w.f.ANIMATIONTYPE_QUATERNION,"rotationQuaternion",(function(e,t,i,n){return M._f.FromArray(t,i).scaleInPlace(n)}),(()=>4))],scale:[new Le(w.f.ANIMATIONTYPE_VECTOR3,"scaling",Ne,(()=>3))],weights:[new class extends Fe{buildAnimations(e,t,i,n,s){if(e._numMorphTargets)for(let r=0;r<e._numMorphTargets;r++){const o=new w.f(`${t}_${r}`,this.name,i,this.type);if(o.setKeys(n.map((e=>({frame:e.frame,inTangent:e.inTangent?e.inTangent[r]:void 0,value:e.value[r],outTangent:e.outTangent?e.outTangent[r]:void 0,interpolation:e.interpolation})))),e._primitiveBabylonMeshes)for(const t of e._primitiveBabylonMeshes)if(t.morphTargetManager){const e=t.morphTargetManager.getTarget(r),i=o.clone();e.animations.push(i),s(e,i)}}}}(w.f.ANIMATIONTYPE_FLOAT,"influence",(function(e,t,i,n){const s=new Array(e._numMorphTargets);for(let e=0;e<s.length;e++)s[e]=t[i++]*n;return s}),(e=>e._numMorphTargets))]};function Ue(...e){const t=e=>e&&"object"==typeof e;return e.reduce(((e,i)=>(Object.keys(i).forEach((n=>{const s=e[n],r=i[n];Array.isArray(s)&&Array.isArray(r)?e[n]=s.concat(...r):t(s)&&t(r)?e[n]=Ue(s,r):e[n]=r})),e)),{})}class Ve{static Get(e,t,i){if(!t||null==i||!t[i])throw new Error(`${e}: Failed to find index (${i})`);return t[i]}static Assign(e){if(e)for(let t=0;t<e.length;t++)e[t].index=t}}class ke{static RegisterExtension(e,t){ke.UnregisterExtension(e)&&h.Y.Warn(`Extension with the name '${e}' already exists`),ke._RegisteredExtensions[e]={factory:t}}static UnregisterExtension(e){return!!ke._RegisteredExtensions[e]&&(delete ke._RegisteredExtensions[e],!0)}get gltf(){if(!this._gltf)throw new Error("glTF JSON is not available");return this._gltf}get bin(){return this._bin}get parent(){return this._parent}get babylonScene(){if(!this._babylonScene)throw new Error("Scene is not available");return this._babylonScene}get rootBabylonMesh(){return this._rootBabylonMesh}constructor(e){this._completePromises=new Array,this._assetContainer=null,this._babylonLights=[],this._disableInstancedMesh=0,this._extensions=new Array,this._disposed=!1,this._rootUrl=null,this._fileName=null,this._uniqueRootUrl=null,this._bin=null,this._rootBabylonMesh=null,this._defaultBabylonMaterialData={},this._postSceneLoadActions=new Array,this._parent=e}dispose(){this._disposed||(this._disposed=!0,this._completePromises.length=0,this._extensions.forEach((e=>e.dispose&&e.dispose())),this._extensions.length=0,this._gltf=null,this._bin=null,this._babylonScene=null,this._rootBabylonMesh=null,this._defaultBabylonMaterialData={},this._postSceneLoadActions.length=0,this._parent.dispose())}importMeshAsync(e,t,i,n,s,r,o=""){return Promise.resolve().then((()=>{this._babylonScene=t,this._assetContainer=i,this._loadData(n);let r=null;if(e){const t={};if(this._gltf.nodes)for(const e of this._gltf.nodes)e.name&&(t[e.name]=e.index);r=(e instanceof Array?e:[e]).map((e=>{const i=t[e];if(void 0===i)throw new Error(`Failed to find node '${e}'`);return i}))}return this._loadAsync(s,o,r,(()=>({meshes:this._getMeshes(),particleSystems:[],skeletons:this._getSkeletons(),animationGroups:this._getAnimationGroups(),lights:this._babylonLights,transformNodes:this._getTransformNodes(),geometries:this._getGeometries()})))}))}loadAsync(e,t,i,n,s=""){return Promise.resolve().then((()=>(this._babylonScene=e,this._loadData(t),this._loadAsync(i,s,null,(()=>{})))))}_loadAsync(e,t,i,n){return Promise.resolve().then((()=>{this._rootUrl=e,this._uniqueRootUrl=!e.startsWith("file:")&&t?e:`${e}${Date.now()}/`,this._fileName=t,this._loadExtensions(),this._checkExtensions();const s=`${m[m.LOADING]} => ${m[m.READY]}`,r=`${m[m.LOADING]} => ${m[m.COMPLETE]}`;this._parent._startPerformanceCounter(s),this._parent._startPerformanceCounter(r),this._parent._setState(m.LOADING),this._extensionsOnLoading();const a=new Array,l=this._babylonScene.blockMaterialDirtyMechanism;if(this._babylonScene.blockMaterialDirtyMechanism=!0,!this.parent.loadOnlyMaterials)if(i)a.push(this.loadSceneAsync("/nodes",{nodes:i,index:-1}));else if(null!=this._gltf.scene||this._gltf.scenes&&this._gltf.scenes[0]){const e=Ve.Get("/scene",this._gltf.scenes,this._gltf.scene||0);a.push(this.loadSceneAsync(`/scenes/${e.index}`,e))}if(!this.parent.skipMaterials&&this.parent.loadAllMaterials&&this._gltf.materials)for(let e=0;e<this._gltf.materials.length;++e){const t=this._gltf.materials[e],i="/materials/"+e,n=B.F.TriangleFillMode;a.push(this._loadMaterialAsync(i,t,null,n,(()=>{})))}return this._babylonScene.blockMaterialDirtyMechanism=l,this._parent.compileMaterials&&a.push(this._compileMaterialsAsync()),this._parent.compileShadowGenerators&&a.push(this._compileShadowGeneratorsAsync()),Promise.all(a).then((()=>(this._rootBabylonMesh&&this._rootBabylonMesh.setEnabled(!0),this._extensionsOnReady(),this._parent._setState(m.READY),this._startAnimations(),n()))).then((e=>(this._parent._endPerformanceCounter(s),o.w1.SetImmediate((()=>{this._disposed||Promise.all(this._completePromises).then((()=>{this._parent._endPerformanceCounter(r),this._parent._setState(m.COMPLETE),this._parent.onCompleteObservable.notifyObservers(void 0),this._parent.onCompleteObservable.clear(),this.dispose()}),(e=>{this._parent.onErrorObservable.notifyObservers(e),this._parent.onErrorObservable.clear(),this.dispose()}))})),e)))})).catch((e=>{throw this._disposed||(this._parent.onErrorObservable.notifyObservers(e),this._parent.onErrorObservable.clear(),this.dispose()),e}))}_loadData(e){if(this._gltf=e.json,this._setupData(),e.bin){const t=this._gltf.buffers;if(t&&t[0]&&!t[0].uri){const i=t[0];(i.byteLength<e.bin.byteLength-3||i.byteLength>e.bin.byteLength)&&h.Y.Warn(`Binary buffer length (${i.byteLength}) from JSON does not match chunk length (${e.bin.byteLength})`),this._bin=e.bin}else h.Y.Warn("Unexpected BIN chunk")}}_setupData(){if(Ve.Assign(this._gltf.accessors),Ve.Assign(this._gltf.animations),Ve.Assign(this._gltf.buffers),Ve.Assign(this._gltf.bufferViews),Ve.Assign(this._gltf.cameras),Ve.Assign(this._gltf.images),Ve.Assign(this._gltf.materials),Ve.Assign(this._gltf.meshes),Ve.Assign(this._gltf.nodes),Ve.Assign(this._gltf.samplers),Ve.Assign(this._gltf.scenes),Ve.Assign(this._gltf.skins),Ve.Assign(this._gltf.textures),this._gltf.nodes){const e={};for(const t of this._gltf.nodes)if(t.children)for(const i of t.children)e[i]=t.index;const t=this._createRootNode();for(const i of this._gltf.nodes){const n=e[i.index];i.parent=void 0===n?t:this._gltf.nodes[n]}}}_loadExtensions(){for(const e in ke._RegisteredExtensions){const t=ke._RegisteredExtensions[e].factory(this);t.name!==e&&h.Y.Warn(`The name of the glTF loader extension instance does not match the registered name: ${t.name} !== ${e}`),this._extensions.push(t),this._parent.onExtensionLoadedObservable.notifyObservers(t)}this._extensions.sort(((e,t)=>(e.order||Number.MAX_VALUE)-(t.order||Number.MAX_VALUE))),this._parent.onExtensionLoadedObservable.clear()}_checkExtensions(){if(this._gltf.extensionsRequired)for(const e of this._gltf.extensionsRequired)if(!this._extensions.some((t=>t.name===e&&t.enabled)))throw new Error(`Require extension ${e} is not available`)}_createRootNode(){this._babylonScene._blockEntityCollection=!!this._assetContainer,this._rootBabylonMesh=new Y.Kj("__root__",this._babylonScene),this._rootBabylonMesh._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1,this._rootBabylonMesh.setEnabled(!1);const e={_babylonTransformNode:this._rootBabylonMesh,index:-1};switch(this._parent.coordinateSystemMode){case f.AUTO:this._babylonScene.useRightHandedSystem||(e.rotation=[0,1,0,0],e.scale=[1,1,-1],ke._LoadTransform(e,this._rootBabylonMesh));break;case f.FORCE_RIGHT_HANDED:this._babylonScene.useRightHandedSystem=!0;break;default:throw new Error(`Invalid coordinate system mode (${this._parent.coordinateSystemMode})`)}return this._parent.onMeshLoadedObservable.notifyObservers(this._rootBabylonMesh),e}loadSceneAsync(e,t){const i=this._extensionsLoadSceneAsync(e,t);if(i)return i;const n=new Array;if(this.logOpen(`${e} ${t.name||""}`),t.nodes)for(const i of t.nodes){const t=Ve.Get(`${e}/nodes/${i}`,this._gltf.nodes,i);n.push(this.loadNodeAsync(`/nodes/${t.index}`,t,(e=>{e.parent=this._rootBabylonMesh})))}for(const e of this._postSceneLoadActions)e();return n.push(this._loadAnimationsAsync()),this.logClose(),Promise.all(n).then((()=>{}))}_forEachPrimitive(e,t){if(e._primitiveBabylonMeshes)for(const i of e._primitiveBabylonMeshes)t(i)}_getGeometries(){const e=new Array,t=this._gltf.nodes;if(t)for(const i of t)this._forEachPrimitive(i,(t=>{const i=t.geometry;i&&-1===e.indexOf(i)&&e.push(i)}));return e}_getMeshes(){const e=new Array;this._rootBabylonMesh&&e.push(this._rootBabylonMesh);const t=this._gltf.nodes;if(t)for(const i of t)this._forEachPrimitive(i,(t=>{e.push(t)}));return e}_getTransformNodes(){const e=new Array,t=this._gltf.nodes;if(t)for(const i of t)i._babylonTransformNode&&"TransformNode"===i._babylonTransformNode.getClassName()&&e.push(i._babylonTransformNode),i._babylonTransformNodeForSkin&&e.push(i._babylonTransformNodeForSkin);return e}_getSkeletons(){const e=new Array,t=this._gltf.skins;if(t)for(const i of t)i._data&&e.push(i._data.babylonSkeleton);return e}_getAnimationGroups(){const e=new Array,t=this._gltf.animations;if(t)for(const i of t)i._babylonAnimationGroup&&e.push(i._babylonAnimationGroup);return e}_startAnimations(){switch(this._parent.animationStartMode){case _.NONE:break;case _.FIRST:{const e=this._getAnimationGroups();0!==e.length&&e[0].start(!0);break}case _.ALL:{const e=this._getAnimationGroups();for(const t of e)t.start(!0);break}default:return void h.Y.Error(`Invalid animation start mode (${this._parent.animationStartMode})`)}}loadNodeAsync(e,t,i=(()=>{})){const n=this._extensionsLoadNodeAsync(e,t,i);if(n)return n;if(t._babylonTransformNode)throw new Error(`${e}: Invalid recursive node hierarchy`);const s=new Array;this.logOpen(`${e} ${t.name||""}`);const r=n=>{if(ke.AddPointerMetadata(n,e),ke._LoadTransform(t,n),null!=t.camera){const i=Ve.Get(`${e}/camera`,this._gltf.cameras,t.camera);s.push(this.loadCameraAsync(`/cameras/${i.index}`,i,(e=>{e.parent=n})))}if(t.children)for(const i of t.children){const t=Ve.Get(`${e}/children/${i}`,this._gltf.nodes,i);s.push(this.loadNodeAsync(`/nodes/${t.index}`,t,(e=>{e.parent=n})))}i(n)};if(null==t.mesh||null!=t.skin){const e=t.name||`node${t.index}`;this._babylonScene._blockEntityCollection=!!this._assetContainer;const i=new Ie.Y(e,this._babylonScene);i._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1,null==t.mesh?t._babylonTransformNode=i:t._babylonTransformNodeForSkin=i,r(i)}if(null!=t.mesh)if(null==t.skin){const i=Ve.Get(`${e}/mesh`,this._gltf.meshes,t.mesh);s.push(this._loadMeshAsync(`/meshes/${i.index}`,t,i,r))}else{const i=Ve.Get(`${e}/mesh`,this._gltf.meshes,t.mesh);s.push(this._loadMeshAsync(`/meshes/${i.index}`,t,i,(i=>{const n=t._babylonTransformNodeForSkin;i.metadata=Ue(n.metadata,i.metadata||{});const r=Ve.Get(`${e}/skin`,this._gltf.skins,t.skin);s.push(this._loadSkinAsync(`/skins/${r.index}`,t,r,(e=>{this._forEachPrimitive(t,(t=>{t.skeleton=e})),this._postSceneLoadActions.push((()=>{if(null!=r.skeleton){const e=Ve.Get(`/skins/${r.index}/skeleton`,this._gltf.nodes,r.skeleton).parent;t.index===e.index?i.parent=n.parent:i.parent=e._babylonTransformNode}else i.parent=this._rootBabylonMesh;this._parent.onSkinLoadedObservable.notifyObservers({node:n,skinnedNode:i})}))})))})))}return this.logClose(),Promise.all(s).then((()=>(this._forEachPrimitive(t,(e=>{e.geometry&&e.geometry.useBoundingInfoFromGeometry?e._updateBoundingInfo():e.refreshBoundingInfo(!0)})),t._babylonTransformNode)))}_loadMeshAsync(e,t,i,n){const s=i.primitives;if(!s||!s.length)throw new Error(`${e}: Primitives are missing`);null==s[0].index&&Ve.Assign(s);const r=new Array;this.logOpen(`${e} ${i.name||""}`);const o=t.name||`node${t.index}`;if(1===s.length){const n=i.primitives[0];r.push(this._loadMeshPrimitiveAsync(`${e}/primitives/${n.index}`,o,t,i,n,(e=>{t._babylonTransformNode=e,t._primitiveBabylonMeshes=[e]})))}else{this._babylonScene._blockEntityCollection=!!this._assetContainer,t._babylonTransformNode=new Ie.Y(o,this._babylonScene),t._babylonTransformNode._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1,t._primitiveBabylonMeshes=[];for(const n of s)r.push(this._loadMeshPrimitiveAsync(`${e}/primitives/${n.index}`,`${o}_primitive${n.index}`,t,i,n,(e=>{e.parent=t._babylonTransformNode,t._primitiveBabylonMeshes.push(e)})))}return n(t._babylonTransformNode),this.logClose(),Promise.all(r).then((()=>t._babylonTransformNode))}_loadMeshPrimitiveAsync(e,t,i,n,s,r){const o=this._extensionsLoadMeshPrimitiveAsync(e,t,i,n,s,r);if(o)return o;this.logOpen(`${e}`);const a=0===this._disableInstancedMesh&&this._parent.createInstances&&null==i.skin&&!n.primitives[0].targets;let l,h;if(a&&s._instanceData)this._babylonScene._blockEntityCollection=!!this._assetContainer,l=s._instanceData.babylonSourceMesh.createInstance(t),l._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1,h=s._instanceData.promise;else{const r=new Array;this._babylonScene._blockEntityCollection=!!this._assetContainer;const o=new Y.Kj(t,this._babylonScene);o._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1,o.overrideMaterialSideOrientation=this._babylonScene.useRightHandedSystem?B.F.CounterClockWiseSideOrientation:B.F.ClockWiseSideOrientation,this._createMorphTargets(e,i,n,s,o),r.push(this._loadVertexDataAsync(e,s,o).then((t=>this._loadMorphTargetsAsync(e,s,o,t).then((()=>{this._disposed||(this._babylonScene._blockEntityCollection=!!this._assetContainer,t.applyToMesh(o),t._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1)})))));const c=ke._GetDrawMode(e,s.mode);if(null==s.material){let e=this._defaultBabylonMaterialData[c];e||(e=this._createDefaultMaterial("__GLTFLoader._default",c),this._parent.onMaterialLoadedObservable.notifyObservers(e),this._defaultBabylonMaterialData[c]=e),o.material=e}else if(!this.parent.skipMaterials){const t=Ve.Get(`${e}/material`,this._gltf.materials,s.material);r.push(this._loadMaterialAsync(`/materials/${t.index}`,t,o,c,(e=>{o.material=e})))}h=Promise.all(r),a&&(s._instanceData={babylonSourceMesh:o,promise:h}),l=o}return ke.AddPointerMetadata(l,e),this._parent.onMeshLoadedObservable.notifyObservers(l),r(l),this.logClose(),h.then((()=>l))}_loadVertexDataAsync(e,t,i){const n=this._extensionsLoadVertexDataAsync(e,t,i);if(n)return n;const s=t.attributes;if(!s)throw new Error(`${e}: Attributes are missing`);const r=new Array,o=new H.Z(i.name,this._babylonScene);if(null==t.indices)i.isUnIndexed=!0;else{const i=Ve.Get(`${e}/indices`,this._gltf.accessors,t.indices);r.push(this._loadIndicesAccessorAsync(`/accessors/${i.index}`,i).then((e=>{o.setIndices(e)})))}const a=(t,n,a)=>{if(null==s[t])return;i._delayInfo=i._delayInfo||[],-1===i._delayInfo.indexOf(n)&&i._delayInfo.push(n);const l=Ve.Get(`${e}/attributes/${t}`,this._gltf.accessors,s[t]);r.push(this._loadVertexAccessorAsync(`/accessors/${l.index}`,l,n).then((e=>{if(e.getKind()===W.o.PositionKind&&!this.parent.alwaysComputeBoundingBox&&!i.skeleton&&l.min&&l.max){const e=M.jp.Vector3[0].copyFromFloats(...l.min),t=M.jp.Vector3[1].copyFromFloats(...l.max);if(l.normalized&&5126!==l.componentType){let i=1;switch(l.componentType){case 5120:i=127;break;case 5121:i=255;break;case 5122:i=32767;break;case 5123:i=65535}const n=1/i;e.scaleInPlace(n),t.scaleInPlace(n)}o._boundingInfo=new we.j(e,t),o.useBoundingInfoFromGeometry=!0}o.setVerticesBuffer(e,l.count)}))),n==W.o.MatricesIndicesExtraKind&&(i.numBoneInfluencers=8),a&&a(l)};return a("POSITION",W.o.PositionKind),a("NORMAL",W.o.NormalKind),a("TANGENT",W.o.TangentKind),a("TEXCOORD_0",W.o.UVKind),a("TEXCOORD_1",W.o.UV2Kind),a("TEXCOORD_2",W.o.UV3Kind),a("TEXCOORD_3",W.o.UV4Kind),a("TEXCOORD_4",W.o.UV5Kind),a("TEXCOORD_5",W.o.UV6Kind),a("JOINTS_0",W.o.MatricesIndicesKind),a("WEIGHTS_0",W.o.MatricesWeightsKind),a("JOINTS_1",W.o.MatricesIndicesExtraKind),a("WEIGHTS_1",W.o.MatricesWeightsExtraKind),a("COLOR_0",W.o.ColorKind,(e=>{"VEC4"===e.type&&(i.hasVertexAlpha=!0)})),Promise.all(r).then((()=>o))}_createMorphTargets(e,t,i,n,s){if(!n.targets)return;if(null==t._numMorphTargets)t._numMorphTargets=n.targets.length;else if(n.targets.length!==t._numMorphTargets)throw new Error(`${e}: Primitives do not have the same number of targets`);const r=i.extras?i.extras.targetNames:null;this._babylonScene._blockEntityCollection=!!this._assetContainer,s.morphTargetManager=new Oe.O(this._babylonScene),s.morphTargetManager._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1,s.morphTargetManager.areUpdatesFrozen=!0;for(let e=0;e<n.targets.length;e++){const n=t.weights?t.weights[e]:i.weights?i.weights[e]:0,o=r?r[e]:`morphTarget${e}`;s.morphTargetManager.addTarget(new De.Y(o,n,s.getScene()))}}_loadMorphTargetsAsync(e,t,i,n){if(!t.targets)return Promise.resolve();const s=new Array,r=i.morphTargetManager;for(let i=0;i<r.numTargets;i++){const o=r.getTarget(i);s.push(this._loadMorphTargetVertexDataAsync(`${e}/targets/${i}`,n,t.targets[i],o))}return Promise.all(s).then((()=>{r.areUpdatesFrozen=!1}))}_loadMorphTargetVertexDataAsync(e,t,i,n){const s=new Array,r=(n,r,o)=>{if(null==i[n])return;const a=t.getVertexBuffer(r);if(!a)return;const l=Ve.Get(`${e}/${n}`,this._gltf.accessors,i[n]);s.push(this._loadFloatAccessorAsync(`/accessors/${l.index}`,l).then((e=>{o(a,e)})))};return r("POSITION",W.o.PositionKind,((e,t)=>{const i=new Float32Array(t.length);e.forEach(t.length,((e,n)=>{i[n]=t[n]+e})),n.setPositions(i)})),r("NORMAL",W.o.NormalKind,((e,t)=>{const i=new Float32Array(t.length);e.forEach(i.length,((e,n)=>{i[n]=t[n]+e})),n.setNormals(i)})),r("TANGENT",W.o.TangentKind,((e,t)=>{const i=new Float32Array(t.length/3*4);let s=0;e.forEach(t.length/3*4,((e,n)=>{(n+1)%4!=0&&(i[s]=t[s]+e,s++)})),n.setTangents(i)})),Promise.all(s).then((()=>{}))}static _LoadTransform(e,t){if(null!=e.skin)return;let i=M.P.Zero(),n=M._f.Identity(),s=M.P.One();e.matrix?M.y3.FromArray(e.matrix).decompose(s,n,i):(e.translation&&(i=M.P.FromArray(e.translation)),e.rotation&&(n=M._f.FromArray(e.rotation)),e.scale&&(s=M.P.FromArray(e.scale))),t.position=i,t.rotationQuaternion=n,t.scaling=s}_loadSkinAsync(e,t,i,n){const s=this._extensionsLoadSkinAsync(e,t,i);if(s)return s;if(i._data)return n(i._data.babylonSkeleton),i._data.promise;const r=`skeleton${i.index}`;this._babylonScene._blockEntityCollection=!!this._assetContainer;const o=new F.O(i.name||r,r,this._babylonScene);o._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1,this._loadBones(e,i,o);const a=this._loadSkinInverseBindMatricesDataAsync(e,i).then((e=>{this._updateBoneMatrices(o,e)}));return i._data={babylonSkeleton:o,promise:a},n(o),a}_loadBones(e,t,i){if(null==t.skeleton||this._parent.alwaysComputeSkeletonRootNode){const i=this._findSkeletonRootNode(`${e}/joints`,t.joints);if(i)if(void 0===t.skeleton)t.skeleton=i.index;else{const n=(e,t)=>{for(;t.parent;t=t.parent)if(t.parent===e)return!0;return!1},s=Ve.Get(`${e}/skeleton`,this._gltf.nodes,t.skeleton);s===i||n(s,i)||(h.Y.Warn(`${e}/skeleton: Overriding with nearest common ancestor as skeleton node is not a common root`),t.skeleton=i.index)}else h.Y.Warn(`${e}: Failed to find common root`)}const n={};for(const s of t.joints){const r=Ve.Get(`${e}/joints/${s}`,this._gltf.nodes,s);this._loadBone(r,t,i,n)}}_findSkeletonRootNode(e,t){if(0===t.length)return null;const i={};for(const n of t){const t=new Array;let s=Ve.Get(`${e}/${n}`,this._gltf.nodes,n);for(;-1!==s.index;)t.unshift(s),s=s.parent;i[n]=t}let n=null;for(let e=0;;++e){let s=i[t[0]];if(e>=s.length)return n;const r=s[e];for(let o=1;o<t.length;++o)if(s=i[t[o]],e>=s.length||r!==s[e])return n;n=r}}_loadBone(e,t,i,n){let s=n[e.index];if(s)return s;let r=null;e.index!==t.skeleton&&(e.parent&&-1!==e.parent.index?r=this._loadBone(e.parent,t,i,n):void 0!==t.skeleton&&h.Y.Warn(`/skins/${t.index}/skeleton: Skeleton node is not a common root`));const o=t.joints.indexOf(e.index);return s=new N.N(e.name||`joint${e.index}`,i,r,this._getNodeMatrix(e),null,null,o),n[e.index]=s,this._postSceneLoadActions.push((()=>{s.linkTransformNode(e._babylonTransformNode)})),s}_loadSkinInverseBindMatricesDataAsync(e,t){if(null==t.inverseBindMatrices)return Promise.resolve(null);const i=Ve.Get(`${e}/inverseBindMatrices`,this._gltf.accessors,t.inverseBindMatrices);return this._loadFloatAccessorAsync(`/accessors/${i.index}`,i)}_updateBoneMatrices(e,t){for(const i of e.bones){const e=M.y3.Identity(),n=i._index;t&&-1!==n&&(M.y3.FromArrayToRef(t,16*n,e),e.invertToRef(e));const s=i.getParent();s&&e.multiplyToRef(s.getInvertedAbsoluteTransform(),e),i.updateMatrix(e,!1,!1),i._updateDifferenceMatrix(void 0,!1)}}_getNodeMatrix(e){return e.matrix?M.y3.FromArray(e.matrix):M.y3.Compose(e.scale?M.P.FromArray(e.scale):M.P.One(),e.rotation?M._f.FromArray(e.rotation):M._f.Identity(),e.translation?M.P.FromArray(e.translation):M.P.Zero())}loadCameraAsync(e,t,i=(()=>{})){const n=this._extensionsLoadCameraAsync(e,t,i);if(n)return n;const s=new Array;this.logOpen(`${e} ${t.name||""}`),this._babylonScene._blockEntityCollection=!!this._assetContainer;const r=new O.c(t.name||`camera${t.index}`,M.P.Zero(),this._babylonScene,!1);switch(r._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1,r.ignoreParentScaling=!0,t._babylonCamera=r,r.rotation=new M.P(0,Math.PI,0),t.type){case"perspective":{const i=t.perspective;if(!i)throw new Error(`${e}: Camera perspective properties are missing`);r.fov=i.yfov,r.minZ=i.znear,r.maxZ=i.zfar||0;break}case"orthographic":if(!t.orthographic)throw new Error(`${e}: Camera orthographic properties are missing`);r.mode=D.V.ORTHOGRAPHIC_CAMERA,r.orthoLeft=-t.orthographic.xmag,r.orthoRight=t.orthographic.xmag,r.orthoBottom=-t.orthographic.ymag,r.orthoTop=t.orthographic.ymag,r.minZ=t.orthographic.znear,r.maxZ=t.orthographic.zfar;break;default:throw new Error(`${e}: Invalid camera type (${t.type})`)}return ke.AddPointerMetadata(r,e),this._parent.onCameraLoadedObservable.notifyObservers(r),i(r),this.logClose(),Promise.all(s).then((()=>r))}_loadAnimationsAsync(){const e=this._gltf.animations;if(!e)return Promise.resolve();const t=new Array;for(let i=0;i<e.length;i++){const n=e[i];t.push(this.loadAnimationAsync(`/animations/${n.index}`,n).then((e=>{0===e.targetedAnimations.length&&e.dispose()})))}return Promise.all(t).then((()=>{}))}loadAnimationAsync(e,t){const i=this._extensionsLoadAnimationAsync(e,t);if(i)return i;this._babylonScene._blockEntityCollection=!!this._assetContainer;const n=new Re.O(t.name||`animation${t.index}`,this._babylonScene);n._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1,t._babylonAnimationGroup=n;const s=new Array;Ve.Assign(t.channels),Ve.Assign(t.samplers);for(const i of t.channels)s.push(this._loadAnimationChannelAsync(`${e}/channels/${i.index}`,e,t,i,((e,t)=>{e.animations=e.animations||[],e.animations.push(t),n.addTargetedAnimation(t,e)})));return Promise.all(s).then((()=>(n.normalize(0),n)))}_loadAnimationChannelAsync(e,t,i,n,s){const r=this._extensionsLoadAnimationChannelAsync(e,t,i,n,s);if(r)return r;if(null==n.target.node)return Promise.resolve();const o=Ve.Get(`${e}/target/node`,this._gltf.nodes,n.target.node);if("weights"===n.target.path&&!o._numMorphTargets||"weights"!==n.target.path&&!o._babylonTransformNode)return Promise.resolve();let a;switch(n.target.path){case"translation":a=Be.translation;break;case"rotation":a=Be.rotation;break;case"scale":a=Be.scale;break;case"weights":a=Be.weights;break;default:throw new Error(`${e}/target/path: Invalid value (${n.target.path})`)}const l={target:o,properties:a};return this._loadAnimationChannelFromTargetInfoAsync(e,t,i,n,l,s)}_loadAnimationChannelFromTargetInfoAsync(e,t,i,n,s,r){const o=this.parent.targetFps,a=1/o,l=Ve.Get(`${e}/sampler`,i.samplers,n.sampler);return this._loadAnimationSamplerAsync(`${t}/samplers/${n.sampler}`,l).then((e=>{let t=0;for(const l of s.properties){const h=l.getStride(s.target),c=e.input,u=e.output,d=new Array(c.length);let p=0;switch(e.interpolation){case"STEP":for(let e=0;e<c.length;e++){const t=l.getValue(s.target,u,p,1);p+=h,d[e]={frame:c[e]*o,value:t,interpolation:Pe.N.STEP}}break;case"CUBICSPLINE":for(let e=0;e<c.length;e++){const t=l.getValue(s.target,u,p,a);p+=h;const i=l.getValue(s.target,u,p,1);p+=h;const n=l.getValue(s.target,u,p,a);p+=h,d[e]={frame:c[e]*o,inTangent:t,value:i,outTangent:n}}break;case"LINEAR":for(let e=0;e<c.length;e++){const t=l.getValue(s.target,u,p,1);p+=h,d[e]={frame:c[e]*o,value:t}}}if(p>0){const e=`${i.name||`animation${i.index}`}_channel${n.index}_${t}`;l.buildAnimations(s.target,e,o,d,((e,i)=>{++t,r(e,i)}))}}}))}_loadAnimationSamplerAsync(e,t){if(t._data)return t._data;const i=t.interpolation||"LINEAR";switch(i){case"STEP":case"LINEAR":case"CUBICSPLINE":break;default:throw new Error(`${e}/interpolation: Invalid value (${t.interpolation})`)}const n=Ve.Get(`${e}/input`,this._gltf.accessors,t.input),s=Ve.Get(`${e}/output`,this._gltf.accessors,t.output);return t._data=Promise.all([this._loadFloatAccessorAsync(`/accessors/${n.index}`,n),this._loadFloatAccessorAsync(`/accessors/${s.index}`,s)]).then((([e,t])=>({input:e,interpolation:i,output:t}))),t._data}loadBufferAsync(e,t,i,n){const s=this._extensionsLoadBufferAsync(e,t,i,n);if(s)return s;if(!t._data)if(t.uri)t._data=this.loadUriAsync(`${e}/uri`,t,t.uri);else{if(!this._bin)throw new Error(`${e}: Uri is missing or the binary glTF is missing its binary chunk`);t._data=this._bin.readAsync(0,t.byteLength)}return t._data.then((t=>{try{return new Uint8Array(t.buffer,t.byteOffset+i,n)}catch(t){throw new Error(`${e}: ${t.message}`)}}))}loadBufferViewAsync(e,t){const i=this._extensionsLoadBufferViewAsync(e,t);if(i)return i;if(t._data)return t._data;const n=Ve.Get(`${e}/buffer`,this._gltf.buffers,t.buffer);return t._data=this.loadBufferAsync(`/buffers/${n.index}`,n,t.byteOffset||0,t.byteLength),t._data}_loadAccessorAsync(e,t,i){if(t._data)return t._data;const n=ke._GetNumComponents(e,t.type),s=n*W.o.GetTypeByteLength(t.componentType),r=n*t.count;if(null==t.bufferView)t._data=Promise.resolve(new i(r));else{const o=Ve.Get(`${e}/bufferView`,this._gltf.bufferViews,t.bufferView);t._data=this.loadBufferViewAsync(`/bufferViews/${o.index}`,o).then((a=>{if(5126!==t.componentType||t.normalized||o.byteStride&&o.byteStride!==s){const e=new i(r);return W.o.ForEach(a,t.byteOffset||0,o.byteStride||s,n,t.componentType,e.length,t.normalized||!1,((t,i)=>{e[i]=t})),e}return ke._GetTypedArray(e,t.componentType,a,t.byteOffset,r)}))}if(t.sparse){const r=t.sparse;t._data=t._data.then((o=>{const a=o,l=Ve.Get(`${e}/sparse/indices/bufferView`,this._gltf.bufferViews,r.indices.bufferView),h=Ve.Get(`${e}/sparse/values/bufferView`,this._gltf.bufferViews,r.values.bufferView);return Promise.all([this.loadBufferViewAsync(`/bufferViews/${l.index}`,l),this.loadBufferViewAsync(`/bufferViews/${h.index}`,h)]).then((([o,l])=>{const h=ke._GetTypedArray(`${e}/sparse/indices`,r.indices.componentType,o,r.indices.byteOffset,r.count),c=n*r.count;let u;if(5126!==t.componentType||t.normalized){const o=ke._GetTypedArray(`${e}/sparse/values`,t.componentType,l,r.values.byteOffset,c);u=new i(c),W.o.ForEach(o,0,s,n,t.componentType,u.length,t.normalized||!1,((e,t)=>{u[t]=e}))}else u=ke._GetTypedArray(`${e}/sparse/values`,t.componentType,l,r.values.byteOffset,c);let d=0;for(let e=0;e<h.length;e++){let t=h[e]*n;for(let e=0;e<n;e++)a[t++]=u[d++]}return a}))}))}return t._data}_loadFloatAccessorAsync(e,t){return this._loadAccessorAsync(e,t,Float32Array)}_loadIndicesAccessorAsync(e,t){if("SCALAR"!==t.type)throw new Error(`${e}/type: Invalid value ${t.type}`);if(5121!==t.componentType&&5123!==t.componentType&&5125!==t.componentType)throw new Error(`${e}/componentType: Invalid value ${t.componentType}`);if(t._data)return t._data;if(t.sparse){const i=ke._GetTypedArrayConstructor(`${e}/componentType`,t.componentType);t._data=this._loadAccessorAsync(e,t,i)}else{const i=Ve.Get(`${e}/bufferView`,this._gltf.bufferViews,t.bufferView);t._data=this.loadBufferViewAsync(`/bufferViews/${i.index}`,i).then((i=>ke._GetTypedArray(e,t.componentType,i,t.byteOffset,t.count)))}return t._data}_loadVertexBufferViewAsync(e){if(e._babylonBuffer)return e._babylonBuffer;const t=this._babylonScene.getEngine();return e._babylonBuffer=this.loadBufferViewAsync(`/bufferViews/${e.index}`,e).then((e=>new W.l(t,e,!1))),e._babylonBuffer}_loadVertexAccessorAsync(e,t,i){var n;if(null===(n=t._babylonVertexBuffer)||void 0===n?void 0:n[i])return t._babylonVertexBuffer[i];t._babylonVertexBuffer||(t._babylonVertexBuffer={});const s=this._babylonScene.getEngine();if(t.sparse)t._babylonVertexBuffer[i]=this._loadFloatAccessorAsync(e,t).then((e=>new W.o(s,e,i,!1)));else if(i===W.o.MatricesIndicesKind||i===W.o.MatricesIndicesExtraKind)t._babylonVertexBuffer[i]=this._loadFloatAccessorAsync(e,t).then((e=>new W.o(s,e,i,!1)));else{const n=Ve.Get(`${e}/bufferView`,this._gltf.bufferViews,t.bufferView);t._babylonVertexBuffer[i]=this._loadVertexBufferViewAsync(n).then((r=>{const o=ke._GetNumComponents(e,t.type);return new W.o(s,r,i,!1,!1,n.byteStride,!1,t.byteOffset,o,t.componentType,t.normalized,!0,1,!0)}))}return t._babylonVertexBuffer[i]}_loadMaterialMetallicRoughnessPropertiesAsync(e,t,i){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);const n=new Array;return t&&(t.baseColorFactor?(i.albedoColor=I.Wo.FromArray(t.baseColorFactor),i.alpha=t.baseColorFactor[3]):i.albedoColor=I.Wo.White(),i.metallic=null==t.metallicFactor?1:t.metallicFactor,i.roughness=null==t.roughnessFactor?1:t.roughnessFactor,t.baseColorTexture&&n.push(this.loadTextureInfoAsync(`${e}/baseColorTexture`,t.baseColorTexture,(e=>{e.name=`${i.name} (Base Color)`,i.albedoTexture=e}))),t.metallicRoughnessTexture&&(t.metallicRoughnessTexture.nonColorData=!0,n.push(this.loadTextureInfoAsync(`${e}/metallicRoughnessTexture`,t.metallicRoughnessTexture,(e=>{e.name=`${i.name} (Metallic Roughness)`,i.metallicTexture=e}))),i.useMetallnessFromMetallicTextureBlue=!0,i.useRoughnessFromMetallicTextureGreen=!0,i.useRoughnessFromMetallicTextureAlpha=!1)),Promise.all(n).then((()=>{}))}_loadMaterialAsync(e,t,i,n,s=(()=>{})){const r=this._extensionsLoadMaterialAsync(e,t,i,n,s);if(r)return r;t._data=t._data||{};let o=t._data[n];if(!o){this.logOpen(`${e} ${t.name||""}`);const i=this.createMaterial(e,t,n);o={babylonMaterial:i,babylonMeshes:[],promise:this.loadMaterialPropertiesAsync(e,t,i)},t._data[n]=o,ke.AddPointerMetadata(i,e),this._parent.onMaterialLoadedObservable.notifyObservers(i),this.logClose()}return i&&(o.babylonMeshes.push(i),i.onDisposeObservable.addOnce((()=>{const e=o.babylonMeshes.indexOf(i);-1!==e&&o.babylonMeshes.splice(e,1)}))),s(o.babylonMaterial),o.promise.then((()=>o.babylonMaterial))}_createDefaultMaterial(e,t){this._babylonScene._blockEntityCollection=!!this._assetContainer;const i=new Me.Y(e,this._babylonScene);return i._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1,i.fillMode=t,i.enableSpecularAntiAliasing=!0,i.useRadianceOverAlpha=!this._parent.transparencyAsCoverage,i.useSpecularOverAlpha=!this._parent.transparencyAsCoverage,i.transparencyMode=Me.Y.PBRMATERIAL_OPAQUE,i.metallic=1,i.roughness=1,i}createMaterial(e,t,i){const n=this._extensionsCreateMaterial(e,t,i);if(n)return n;const s=t.name||`material${t.index}`;return this._createDefaultMaterial(s,i)}loadMaterialPropertiesAsync(e,t,i){const n=this._extensionsLoadMaterialPropertiesAsync(e,t,i);if(n)return n;const s=new Array;return s.push(this.loadMaterialBasePropertiesAsync(e,t,i)),t.pbrMetallicRoughness&&s.push(this._loadMaterialMetallicRoughnessPropertiesAsync(`${e}/pbrMetallicRoughness`,t.pbrMetallicRoughness,i)),this.loadMaterialAlphaProperties(e,t,i),Promise.all(s).then((()=>{}))}loadMaterialBasePropertiesAsync(e,t,i){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);const n=new Array;return i.emissiveColor=t.emissiveFactor?I.Wo.FromArray(t.emissiveFactor):new I.Wo(0,0,0),t.doubleSided&&(i.backFaceCulling=!1,i.twoSidedLighting=!0),t.normalTexture&&(t.normalTexture.nonColorData=!0,n.push(this.loadTextureInfoAsync(`${e}/normalTexture`,t.normalTexture,(e=>{e.name=`${i.name} (Normal)`,i.bumpTexture=e}))),i.invertNormalMapX=!this._babylonScene.useRightHandedSystem,i.invertNormalMapY=this._babylonScene.useRightHandedSystem,null!=t.normalTexture.scale&&i.bumpTexture&&(i.bumpTexture.level=t.normalTexture.scale),i.forceIrradianceInFragment=!0),t.occlusionTexture&&(t.occlusionTexture.nonColorData=!0,n.push(this.loadTextureInfoAsync(`${e}/occlusionTexture`,t.occlusionTexture,(e=>{e.name=`${i.name} (Occlusion)`,i.ambientTexture=e}))),i.useAmbientInGrayScale=!0,null!=t.occlusionTexture.strength&&(i.ambientTextureStrength=t.occlusionTexture.strength)),t.emissiveTexture&&n.push(this.loadTextureInfoAsync(`${e}/emissiveTexture`,t.emissiveTexture,(e=>{e.name=`${i.name} (Emissive)`,i.emissiveTexture=e}))),Promise.all(n).then((()=>{}))}loadMaterialAlphaProperties(e,t,i){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);switch(t.alphaMode||"OPAQUE"){case"OPAQUE":i.transparencyMode=Me.Y.PBRMATERIAL_OPAQUE;break;case"MASK":i.transparencyMode=Me.Y.PBRMATERIAL_ALPHATEST,i.alphaCutOff=null==t.alphaCutoff?.5:t.alphaCutoff,i.albedoTexture&&(i.albedoTexture.hasAlpha=!0);break;case"BLEND":i.transparencyMode=Me.Y.PBRMATERIAL_ALPHABLEND,i.albedoTexture&&(i.albedoTexture.hasAlpha=!0,i.useAlphaFromAlbedoTexture=!0);break;default:throw new Error(`${e}/alphaMode: Invalid value (${t.alphaMode})`)}}loadTextureInfoAsync(e,t,i=(()=>{})){const n=this._extensionsLoadTextureInfoAsync(e,t,i);if(n)return n;if(this.logOpen(`${e}`),t.texCoord>=6)throw new Error(`${e}/texCoord: Invalid value (${t.texCoord})`);const s=Ve.Get(`${e}/index`,this._gltf.textures,t.index);s._textureInfo=t;const r=this._loadTextureAsync(`/textures/${t.index}`,s,(n=>{n.coordinatesIndex=t.texCoord||0,ke.AddPointerMetadata(n,e),this._parent.onTextureLoadedObservable.notifyObservers(n),i(n)}));return this.logClose(),r}_loadTextureAsync(e,t,i=(()=>{})){const n=this._extensionsLoadTextureAsync(e,t,i);if(n)return n;this.logOpen(`${e} ${t.name||""}`);const s=null==t.sampler?ke.DefaultSampler:Ve.Get(`${e}/sampler`,this._gltf.samplers,t.sampler),r=Ve.Get(`${e}/source`,this._gltf.images,t.source),o=this._createTextureAsync(e,s,r,i,void 0,!t._textureInfo.nonColorData);return this.logClose(),o}_createTextureAsync(e,t,i,n=(()=>{}),s,r){const o=this._loadSampler(`/samplers/${t.index}`,t),a=new Array,l=new Ae.B;this._babylonScene._blockEntityCollection=!!this._assetContainer;const h={noMipmap:o.noMipMaps,invertY:!1,samplingMode:o.samplingMode,onLoad:()=>{this._disposed||l.resolve()},onError:(t,i)=>{this._disposed||l.reject(new Error(`${e}: ${i&&i.message?i.message:t||"Failed to load texture"}`))},mimeType:i.mimeType,loaderOptions:s,useSRGBBuffer:!!r&&this._parent.useSRGBBuffers},c=new G.x(null,this._babylonScene,h);return c._parentContainer=this._assetContainer,this._babylonScene._blockEntityCollection=!1,a.push(l.promise),a.push(this.loadImageAsync(`/images/${i.index}`,i).then((e=>{const t=i.uri||`${this._fileName}#image${i.index}`,n=`data:${this._uniqueRootUrl}${t}`;c.updateURL(n,e)}))),c.wrapU=o.wrapU,c.wrapV=o.wrapV,n(c),Promise.all(a).then((()=>c))}_loadSampler(e,t){return t._data||(t._data={noMipMaps:9728===t.minFilter||9729===t.minFilter,samplingMode:ke._GetTextureSamplingMode(e,t),wrapU:ke._GetTextureWrapMode(`${e}/wrapS`,t.wrapS),wrapV:ke._GetTextureWrapMode(`${e}/wrapT`,t.wrapT)}),t._data}loadImageAsync(e,t){if(!t._data){if(this.logOpen(`${e} ${t.name||""}`),t.uri)t._data=this.loadUriAsync(`${e}/uri`,t,t.uri);else{const i=Ve.Get(`${e}/bufferView`,this._gltf.bufferViews,t.bufferView);t._data=this.loadBufferViewAsync(`/bufferViews/${i.index}`,i)}this.logClose()}return t._data}loadUriAsync(e,t,i){const n=this._extensionsLoadUriAsync(e,t,i);if(n)return n;if(!ke._ValidateUri(i))throw new Error(`${e}: '${i}' is invalid`);if((0,C.VL)(i)){const t=new Uint8Array((0,C.$K)(i));return this.log(`${e}: Decoded ${i.substr(0,64)}... (${t.length} bytes)`),Promise.resolve(t)}return this.log(`${e}: Loading ${i}`),this._parent.preprocessUrlAsync(this._rootUrl+i).then((t=>new Promise(((n,s)=>{this._parent._loadFile(this._babylonScene,t,(t=>{this._disposed||(this.log(`${e}: Loaded ${i} (${t.byteLength} bytes)`),n(new Uint8Array(t)))}),!0,(t=>{s(new C.eh(`${e}: Failed to load '${i}'${t?": "+t.status+" "+t.statusText:""}`,t))}))}))))}static AddPointerMetadata(e,t){e.metadata=e.metadata||{};const i=e._internalMetadata=e._internalMetadata||{},n=i.gltf=i.gltf||{};(n.pointers=n.pointers||[]).push(t)}static _GetTextureWrapMode(e,t){switch(t=null==t?10497:t){case 33071:return G.x.CLAMP_ADDRESSMODE;case 33648:return G.x.MIRROR_ADDRESSMODE;case 10497:return G.x.WRAP_ADDRESSMODE;default:return h.Y.Warn(`${e}: Invalid value (${t})`),G.x.WRAP_ADDRESSMODE}}static _GetTextureSamplingMode(e,t){const i=null==t.magFilter?9729:t.magFilter,n=null==t.minFilter?9987:t.minFilter;if(9729===i)switch(n){case 9728:return G.x.LINEAR_NEAREST;case 9729:return G.x.LINEAR_LINEAR;case 9984:return G.x.LINEAR_NEAREST_MIPNEAREST;case 9985:return G.x.LINEAR_LINEAR_MIPNEAREST;case 9986:return G.x.LINEAR_NEAREST_MIPLINEAR;case 9987:return G.x.LINEAR_LINEAR_MIPLINEAR;default:return h.Y.Warn(`${e}/minFilter: Invalid value (${n})`),G.x.LINEAR_LINEAR_MIPLINEAR}else switch(9728!==i&&h.Y.Warn(`${e}/magFilter: Invalid value (${i})`),n){case 9728:return G.x.NEAREST_NEAREST;case 9729:return G.x.NEAREST_LINEAR;case 9984:return G.x.NEAREST_NEAREST_MIPNEAREST;case 9985:return G.x.NEAREST_LINEAR_MIPNEAREST;case 9986:return G.x.NEAREST_NEAREST_MIPLINEAR;case 9987:return G.x.NEAREST_LINEAR_MIPLINEAR;default:return h.Y.Warn(`${e}/minFilter: Invalid value (${n})`),G.x.NEAREST_NEAREST_MIPNEAREST}}static _GetTypedArrayConstructor(e,t){switch(t){case 5120:return Int8Array;case 5121:return Uint8Array;case 5122:return Int16Array;case 5123:return Uint16Array;case 5125:return Uint32Array;case 5126:return Float32Array;default:throw new Error(`${e}: Invalid component type ${t}`)}}static _GetTypedArray(e,t,i,n,s){const r=i.buffer;n=i.byteOffset+(n||0);const o=ke._GetTypedArrayConstructor(`${e}/componentType`,t),a=W.o.GetTypeByteLength(t);return n%a!=0?(h.Y.Warn(`${e}: Copying buffer as byte offset (${n}) is not a multiple of component type byte length (${a})`),new o(r.slice(n,n+s*a),0)):new o(r,n,s)}static _GetNumComponents(e,t){switch(t){case"SCALAR":return 1;case"VEC2":return 2;case"VEC3":return 3;case"VEC4":case"MAT2":return 4;case"MAT3":return 9;case"MAT4":return 16}throw new Error(`${e}: Invalid type (${t})`)}static _ValidateUri(e){return o.w1.IsBase64(e)||-1===e.indexOf("..")}static _GetDrawMode(e,t){switch(null==t&&(t=4),t){case 0:return B.F.PointListDrawMode;case 1:return B.F.LineListDrawMode;case 2:return B.F.LineLoopDrawMode;case 3:return B.F.LineStripDrawMode;case 4:return B.F.TriangleFillMode;case 5:return B.F.TriangleStripDrawMode;case 6:return B.F.TriangleFanDrawMode}throw new Error(`${e}: Invalid mesh primitive mode (${t})`)}_compileMaterialsAsync(){this._parent._startPerformanceCounter("Compile materials");const e=new Array;if(this._gltf.materials)for(const t of this._gltf.materials)if(t._data)for(const i in t._data){const n=t._data[i];for(const t of n.babylonMeshes){t.computeWorldMatrix(!0);const i=n.babylonMaterial;e.push(i.forceCompilationAsync(t)),e.push(i.forceCompilationAsync(t,{useInstances:!0})),this._parent.useClipPlane&&(e.push(i.forceCompilationAsync(t,{clipPlane:!0})),e.push(i.forceCompilationAsync(t,{clipPlane:!0,useInstances:!0})))}}return Promise.all(e).then((()=>{this._parent._endPerformanceCounter("Compile materials")}))}_compileShadowGeneratorsAsync(){this._parent._startPerformanceCounter("Compile shadow generators");const e=new Array,t=this._babylonScene.lights;for(const i of t){const t=i.getShadowGenerator();t&&e.push(t.forceCompilationAsync())}return Promise.all(e).then((()=>{this._parent._endPerformanceCounter("Compile shadow generators")}))}_forEachExtensions(e){for(const t of this._extensions)t.enabled&&e(t)}_applyExtensions(e,t,i){for(const n of this._extensions)if(n.enabled){const s=`${n.name}.${t}`,r=e;r._activeLoaderExtensionFunctions=r._activeLoaderExtensionFunctions||{};const o=r._activeLoaderExtensionFunctions;if(!o[s]){o[s]=!0;try{const e=i(n);if(e)return e}finally{delete o[s]}}}return null}_extensionsOnLoading(){this._forEachExtensions((e=>e.onLoading&&e.onLoading()))}_extensionsOnReady(){this._forEachExtensions((e=>e.onReady&&e.onReady()))}_extensionsLoadSceneAsync(e,t){return this._applyExtensions(t,"loadScene",(i=>i.loadSceneAsync&&i.loadSceneAsync(e,t)))}_extensionsLoadNodeAsync(e,t,i){return this._applyExtensions(t,"loadNode",(n=>n.loadNodeAsync&&n.loadNodeAsync(e,t,i)))}_extensionsLoadCameraAsync(e,t,i){return this._applyExtensions(t,"loadCamera",(n=>n.loadCameraAsync&&n.loadCameraAsync(e,t,i)))}_extensionsLoadVertexDataAsync(e,t,i){return this._applyExtensions(t,"loadVertexData",(n=>n._loadVertexDataAsync&&n._loadVertexDataAsync(e,t,i)))}_extensionsLoadMeshPrimitiveAsync(e,t,i,n,s,r){return this._applyExtensions(s,"loadMeshPrimitive",(o=>o._loadMeshPrimitiveAsync&&o._loadMeshPrimitiveAsync(e,t,i,n,s,r)))}_extensionsLoadMaterialAsync(e,t,i,n,s){return this._applyExtensions(t,"loadMaterial",(r=>r._loadMaterialAsync&&r._loadMaterialAsync(e,t,i,n,s)))}_extensionsCreateMaterial(e,t,i){return this._applyExtensions(t,"createMaterial",(n=>n.createMaterial&&n.createMaterial(e,t,i)))}_extensionsLoadMaterialPropertiesAsync(e,t,i){return this._applyExtensions(t,"loadMaterialProperties",(n=>n.loadMaterialPropertiesAsync&&n.loadMaterialPropertiesAsync(e,t,i)))}_extensionsLoadTextureInfoAsync(e,t,i){return this._applyExtensions(t,"loadTextureInfo",(n=>n.loadTextureInfoAsync&&n.loadTextureInfoAsync(e,t,i)))}_extensionsLoadTextureAsync(e,t,i){return this._applyExtensions(t,"loadTexture",(n=>n._loadTextureAsync&&n._loadTextureAsync(e,t,i)))}_extensionsLoadAnimationAsync(e,t){return this._applyExtensions(t,"loadAnimation",(i=>i.loadAnimationAsync&&i.loadAnimationAsync(e,t)))}_extensionsLoadAnimationChannelAsync(e,t,i,n,s){return this._applyExtensions(i,"loadAnimationChannel",(r=>r._loadAnimationChannelAsync&&r._loadAnimationChannelAsync(e,t,i,n,s)))}_extensionsLoadSkinAsync(e,t,i){return this._applyExtensions(i,"loadSkin",(n=>n._loadSkinAsync&&n._loadSkinAsync(e,t,i)))}_extensionsLoadUriAsync(e,t,i){return this._applyExtensions(t,"loadUri",(n=>n._loadUriAsync&&n._loadUriAsync(e,t,i)))}_extensionsLoadBufferViewAsync(e,t){return this._applyExtensions(t,"loadBufferView",(i=>i.loadBufferViewAsync&&i.loadBufferViewAsync(e,t)))}_extensionsLoadBufferAsync(e,t,i,n){return this._applyExtensions(t,"loadBuffer",(s=>s.loadBufferAsync&&s.loadBufferAsync(e,t,i,n)))}static LoadExtensionAsync(e,t,i,n){if(!t.extensions)return null;const s=t.extensions[i];return s?n(`${e}/extensions/${i}`,s):null}static LoadExtraAsync(e,t,i,n){if(!t.extras)return null;const s=t.extras[i];return s?n(`${e}/extras/${i}`,s):null}isExtensionUsed(e){return!!this._gltf.extensionsUsed&&-1!==this._gltf.extensionsUsed.indexOf(e)}logOpen(e){this._parent._logOpen(e)}logClose(){this._parent._logClose()}log(e){this._parent._log(e)}startPerformanceCounter(e){this._parent._startPerformanceCounter(e)}endPerformanceCounter(e){this._parent._endPerformanceCounter(e)}}ke._RegisteredExtensions={},ke.DefaultSampler={index:-1},R._CreateGLTF2Loader=e=>new ke(e);var Ge=i(1128),ze=i(6113),We=i(9630);const He="EXT_lights_image_based";class Xe{constructor(e){this.name=He,this._loader=e,this.enabled=this._loader.isExtensionUsed(He)}dispose(){this._loader=null,delete this._lights}onLoading(){const e=this._loader.gltf.extensions;if(e&&e[this.name]){const t=e[this.name];this._lights=t.lights}}loadSceneAsync(e,t){return ke.LoadExtensionAsync(e,t,this.name,((i,n)=>{const s=new Array;s.push(this._loader.loadSceneAsync(e,t)),this._loader.logOpen(`${i}`);const r=Ve.Get(`${i}/light`,this._lights,n.light);return s.push(this._loadLightAsync(`/extensions/${this.name}/lights/${n.light}`,r).then((e=>{this._loader.babylonScene.environmentTexture=e}))),this._loader.logClose(),Promise.all(s).then((()=>{}))}))}_loadLightAsync(e,t){if(!t._loaded){const i=new Array;this._loader.logOpen(`${e}`);const n=new Array(t.specularImages.length);for(let s=0;s<t.specularImages.length;s++){const r=t.specularImages[s];n[s]=new Array(r.length);for(let t=0;t<r.length;t++){const o=`${e}/specularImages/${s}/${t}`;this._loader.logOpen(`${o}`);const a=r[t],l=Ve.Get(o,this._loader.gltf.images,a);i.push(this._loader.loadImageAsync(`/images/${a}`,l).then((e=>{n[s][t]=e}))),this._loader.logClose()}}this._loader.logClose(),t._loaded=Promise.all(i).then((()=>{const i=new We.N(this._loader.babylonScene,null,t.specularImageSize);if(i.name=t.name||"environment",t._babylonTexture=i,null!=t.intensity&&(i.level=t.intensity),t.rotation){let e=M._f.FromArray(t.rotation);this._loader.babylonScene.useRightHandedSystem||(e=M._f.Inverse(e)),M.y3.FromQuaternionToRef(e,i.getReflectionTextureMatrix())}if(!t.irradianceCoefficients)throw new Error(`${e}: Irradiance coefficients are missing`);const s=ze._.FromArray(t.irradianceCoefficients);s.scaleInPlace(t.intensity),s.convertIrradianceToLambertianRadiance();const r=ze.i.FromHarmonics(s),o=(n.length-1)/Ge.R.Log2(t.specularImageSize);return i.updateRGBDAsync(n,r,o)}))}return t._loaded.then((()=>t._babylonTexture))}}ke.RegisterExtension(He,(e=>new Xe(e))),i(2708);const je="EXT_mesh_gpu_instancing";class Ye{constructor(e){this.name=je,this._loader=e,this.enabled=this._loader.isExtensionUsed(je)}dispose(){this._loader=null}loadNodeAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((e,n)=>{this._loader._disableInstancedMesh++;const s=this._loader.loadNodeAsync(`/nodes/${t.index}`,t,i);if(this._loader._disableInstancedMesh--,!t._primitiveBabylonMeshes)return s;const r=new Array;let o=0;const a=t=>{if(null==n.attributes[t])return void r.push(Promise.resolve(null));const i=Ve.Get(`${e}/attributes/${t}`,this._loader.gltf.accessors,n.attributes[t]);if(r.push(this._loader._loadFloatAccessorAsync(`/accessors/${i.bufferView}`,i)),0===o)o=i.count;else if(o!==i.count)throw new Error(`${e}/attributes: Instance buffer accessors do not have the same count.`)};return a("TRANSLATION"),a("ROTATION"),a("SCALE"),s.then((e=>Promise.all(r).then((([i,n,s])=>{const r=new Float32Array(16*o);M.jp.Vector3[0].copyFromFloats(0,0,0),M.jp.Quaternion[0].copyFromFloats(0,0,0,1),M.jp.Vector3[1].copyFromFloats(1,1,1);for(let e=0;e<o;++e)i&&M.P.FromArrayToRef(i,3*e,M.jp.Vector3[0]),n&&M._f.FromArrayToRef(n,4*e,M.jp.Quaternion[0]),s&&M.P.FromArrayToRef(s,3*e,M.jp.Vector3[1]),M.y3.ComposeToRef(M.jp.Vector3[1],M.jp.Quaternion[0],M.jp.Vector3[0],M.jp.Matrix[0]),M.jp.Matrix[0].copyToArray(r,16*e);for(const e of t._primitiveBabylonMeshes)e.thinInstanceSetBuffer("matrix",r,16,!0);return e}))))}))}}ke.RegisterExtension(je,(e=>new Ye(e)));var qe=i(9481);const Ke="EXT_meshopt_compression";class $e{constructor(e){this.name=Ke,this.enabled=e.isExtensionUsed(Ke),this._loader=e}dispose(){this._loader=null}loadBufferViewAsync(e,t){return ke.LoadExtensionAsync(e,t,this.name,((i,n)=>{const s=t;if(s._meshOptData)return s._meshOptData;const r=Ve.Get(`${e}/buffer`,this._loader.gltf.buffers,n.buffer);return s._meshOptData=this._loader.loadBufferAsync(`/buffers/${r.index}`,r,n.byteOffset||0,n.byteLength).then((e=>qe.K.Default.decodeGltfBufferAsync(e,n.count,n.byteStride,n.mode,n.filter))),s._meshOptData}))}}ke.RegisterExtension(Ke,(e=>new $e(e)));const Qe="EXT_texture_webp";class Ze{constructor(e){this.name=Qe,this._loader=e,this.enabled=e.isExtensionUsed(Qe)}dispose(){this._loader=null}_loadTextureAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{const r=null==t.sampler?ke.DefaultSampler:Ve.Get(`${e}/sampler`,this._loader.gltf.samplers,t.sampler),o=Ve.Get(`${n}/source`,this._loader.gltf.images,s.source);return this._loader._createTextureAsync(e,r,o,(e=>{i(e)}),void 0,!t._textureInfo.nonColorData)}))}}ke.RegisterExtension(Qe,(e=>new Ze(e)));var Je=i(1500);const et="KHR_draco_mesh_compression";class tt{constructor(e){this.name=et,this._loader=e,this.enabled=Je.J.DecoderAvailable&&this._loader.isExtensionUsed(et)}dispose(){delete this.dracoCompression,this._loader=null}_loadVertexDataAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{if(null!=t.mode){if(5!==t.mode&&4!==t.mode)throw new Error(`${e}: Unsupported mode ${t.mode}`);if(5===t.mode)throw new Error(`${e}: Mode ${t.mode} is not currently supported`)}const r={},o={},a=(n,a)=>{const l=s.attributes[n];if(void 0===l||void 0===t.attributes[n])return;r[a]=l;const h=Ve.Get(`${e}/attributes/${n}`,this._loader.gltf.accessors,t.attributes[n]);if(h.normalized&&5126!==h.componentType){let e=1;switch(h.componentType){case 5120:e=127;break;case 5121:e=255;break;case 5122:e=32767;break;case 5123:e=65535}o[a]=e}i._delayInfo=i._delayInfo||[],-1===i._delayInfo.indexOf(a)&&i._delayInfo.push(a)};a("POSITION",W.o.PositionKind),a("NORMAL",W.o.NormalKind),a("TANGENT",W.o.TangentKind),a("TEXCOORD_0",W.o.UVKind),a("TEXCOORD_1",W.o.UV2Kind),a("TEXCOORD_2",W.o.UV3Kind),a("TEXCOORD_3",W.o.UV4Kind),a("TEXCOORD_4",W.o.UV5Kind),a("TEXCOORD_5",W.o.UV6Kind),a("JOINTS_0",W.o.MatricesIndicesKind),a("WEIGHTS_0",W.o.MatricesWeightsKind),a("COLOR_0",W.o.ColorKind);const l=Ve.Get(n,this._loader.gltf.bufferViews,s.bufferView);return l._dracoBabylonGeometry||(l._dracoBabylonGeometry=this._loader.loadBufferViewAsync(`/bufferViews/${l.index}`,l).then((t=>(this.dracoCompression||Je.J.Default).decodeMeshAsync(t,r,o).then((e=>{const t=new H.Z(i.name,this._loader.babylonScene);return e.applyToGeometry(t),t})).catch((t=>{throw new Error(`${e}: ${t.message}`)}))))),l._dracoBabylonGeometry}))}}ke.RegisterExtension(et,(e=>new tt(e)));var it=i(9311);const nt="KHR_lights_punctual";class st{constructor(e){this.name=nt,this._loader=e,this.enabled=this._loader.isExtensionUsed(nt)}dispose(){this._loader=null,delete this._lights}onLoading(){const e=this._loader.gltf.extensions;if(e&&e[this.name]){const t=e[this.name];this._lights=t.lights,Ve.Assign(this._lights)}}loadNodeAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>this._loader.loadNodeAsync(e,t,(e=>{let t;const r=Ve.Get(n,this._lights,s.light),o=r.name||e.name;switch(this._loader.babylonScene._blockEntityCollection=!!this._loader._assetContainer,r.type){case"directional":t=new K.O(o,M.P.Backward(),this._loader.babylonScene);break;case"point":t=new $.c(o,M.P.Zero(),this._loader.babylonScene);break;case"spot":{const e=new Q.P(o,M.P.Zero(),M.P.Backward(),0,1,this._loader.babylonScene);e.angle=2*(r.spot&&r.spot.outerConeAngle||Math.PI/4),e.innerAngle=2*(r.spot&&r.spot.innerConeAngle||0),t=e;break}default:throw this._loader.babylonScene._blockEntityCollection=!1,new Error(`${n}: Invalid light type (${r.type})`)}t._parentContainer=this._loader._assetContainer,this._loader.babylonScene._blockEntityCollection=!1,r._babylonLight=t,t.falloffType=it._.FALLOFF_GLTF,t.diffuse=r.color?I.Wo.FromArray(r.color):I.Wo.White(),t.intensity=null==r.intensity?1:r.intensity,t.range=null==r.range?Number.MAX_VALUE:r.range,t.parent=e,this._loader._babylonLights.push(t),ke.AddPointerMetadata(t,n),i(e)}))))}}ke.RegisterExtension(nt,(e=>new st(e)));const rt="KHR_materials_pbrSpecularGlossiness";class ot{constructor(e){this.name=rt,this.order=200,this._loader=e,this.enabled=this._loader.isExtensionUsed(rt)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{const r=new Array;return r.push(this._loader.loadMaterialBasePropertiesAsync(e,t,i)),r.push(this._loadSpecularGlossinessPropertiesAsync(n,t,s,i)),this._loader.loadMaterialAlphaProperties(e,t,i),Promise.all(r).then((()=>{}))}))}_loadSpecularGlossinessPropertiesAsync(e,t,i,n){if(!(n instanceof Me.Y))throw new Error(`${e}: Material type not supported`);const s=new Array;return n.metallic=null,n.roughness=null,i.diffuseFactor?(n.albedoColor=I.Wo.FromArray(i.diffuseFactor),n.alpha=i.diffuseFactor[3]):n.albedoColor=I.Wo.White(),n.reflectivityColor=i.specularFactor?I.Wo.FromArray(i.specularFactor):I.Wo.White(),n.microSurface=null==i.glossinessFactor?1:i.glossinessFactor,i.diffuseTexture&&s.push(this._loader.loadTextureInfoAsync(`${e}/diffuseTexture`,i.diffuseTexture,(e=>{e.name=`${n.name} (Diffuse)`,n.albedoTexture=e}))),i.specularGlossinessTexture&&(s.push(this._loader.loadTextureInfoAsync(`${e}/specularGlossinessTexture`,i.specularGlossinessTexture,(e=>{e.name=`${n.name} (Specular Glossiness)`,n.reflectivityTexture=e,n.reflectivityTexture.hasAlpha=!0}))),n.useMicroSurfaceFromReflectivityMapAlpha=!0),Promise.all(s).then((()=>{}))}}ke.RegisterExtension(rt,(e=>new ot(e)));const at="KHR_materials_unlit";class lt{constructor(e){this.name=at,this.order=210,this._loader=e,this.enabled=this._loader.isExtensionUsed(at)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,(()=>this._loadUnlitPropertiesAsync(e,t,i)))}_loadUnlitPropertiesAsync(e,t,i){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);const n=new Array;i.unlit=!0;const s=t.pbrMetallicRoughness;return s&&(s.baseColorFactor?(i.albedoColor=I.Wo.FromArray(s.baseColorFactor),i.alpha=s.baseColorFactor[3]):i.albedoColor=I.Wo.White(),s.baseColorTexture&&n.push(this._loader.loadTextureInfoAsync(`${e}/baseColorTexture`,s.baseColorTexture,(e=>{e.name=`${i.name} (Base Color)`,i.albedoTexture=e})))),t.doubleSided&&(i.backFaceCulling=!1,i.twoSidedLighting=!0),this._loader.loadMaterialAlphaProperties(e,t,i),Promise.all(n).then((()=>{}))}}ke.RegisterExtension(at,(e=>new lt(e)));const ht="KHR_materials_clearcoat";class ct{constructor(e){this.name=ht,this.order=190,this._loader=e,this.enabled=this._loader.isExtensionUsed(ht)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{const r=new Array;return r.push(this._loader.loadMaterialPropertiesAsync(e,t,i)),r.push(this._loadClearCoatPropertiesAsync(n,s,i)),Promise.all(r).then((()=>{}))}))}_loadClearCoatPropertiesAsync(e,t,i){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);const n=new Array;return i.clearCoat.isEnabled=!0,i.clearCoat.useRoughnessFromMainTexture=!1,i.clearCoat.remapF0OnInterfaceChange=!1,null!=t.clearcoatFactor?i.clearCoat.intensity=t.clearcoatFactor:i.clearCoat.intensity=0,t.clearcoatTexture&&n.push(this._loader.loadTextureInfoAsync(`${e}/clearcoatTexture`,t.clearcoatTexture,(e=>{e.name=`${i.name} (ClearCoat Intensity)`,i.clearCoat.texture=e}))),null!=t.clearcoatRoughnessFactor?i.clearCoat.roughness=t.clearcoatRoughnessFactor:i.clearCoat.roughness=0,t.clearcoatRoughnessTexture&&(t.clearcoatRoughnessTexture.nonColorData=!0,n.push(this._loader.loadTextureInfoAsync(`${e}/clearcoatRoughnessTexture`,t.clearcoatRoughnessTexture,(e=>{e.name=`${i.name} (ClearCoat Roughness)`,i.clearCoat.textureRoughness=e})))),t.clearcoatNormalTexture&&(t.clearcoatNormalTexture.nonColorData=!0,n.push(this._loader.loadTextureInfoAsync(`${e}/clearcoatNormalTexture`,t.clearcoatNormalTexture,(e=>{e.name=`${i.name} (ClearCoat Normal)`,i.clearCoat.bumpTexture=e}))),i.invertNormalMapX=!i.getScene().useRightHandedSystem,i.invertNormalMapY=i.getScene().useRightHandedSystem,null!=t.clearcoatNormalTexture.scale&&(i.clearCoat.bumpTexture.level=t.clearcoatNormalTexture.scale)),Promise.all(n).then((()=>{}))}}ke.RegisterExtension(ht,(e=>new ct(e)));const ut="KHR_materials_iridescence";class dt{constructor(e){this.name=ut,this.order=195,this._loader=e,this.enabled=this._loader.isExtensionUsed(ut)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{const r=new Array;return r.push(this._loader.loadMaterialPropertiesAsync(e,t,i)),r.push(this._loadIridescencePropertiesAsync(n,s,i)),Promise.all(r).then((()=>{}))}))}_loadIridescencePropertiesAsync(e,t,i){var n,s,r,o,a;if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);const l=new Array;return i.iridescence.isEnabled=!0,i.iridescence.intensity=null!==(n=t.iridescenceFactor)&&void 0!==n?n:0,i.iridescence.indexOfRefraction=null!==(r=null!==(s=t.iridescenceIor)&&void 0!==s?s:t.iridescenceIOR)&&void 0!==r?r:1.3,i.iridescence.minimumThickness=null!==(o=t.iridescenceThicknessMinimum)&&void 0!==o?o:100,i.iridescence.maximumThickness=null!==(a=t.iridescenceThicknessMaximum)&&void 0!==a?a:400,t.iridescenceTexture&&l.push(this._loader.loadTextureInfoAsync(`${e}/iridescenceTexture`,t.iridescenceTexture,(e=>{e.name=`${i.name} (Iridescence Intensity)`,i.iridescence.texture=e}))),t.iridescenceThicknessTexture&&l.push(this._loader.loadTextureInfoAsync(`${e}/iridescenceThicknessTexture`,t.iridescenceThicknessTexture,(e=>{e.name=`${i.name} (Iridescence Thickness)`,i.iridescence.thicknessTexture=e}))),Promise.all(l).then((()=>{}))}}ke.RegisterExtension(ut,(e=>new dt(e)));const pt="KHR_materials_emissive_strength";class ft{constructor(e){this.name=pt,this.order=170,this._loader=e,this.enabled=this._loader.isExtensionUsed(pt)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>this._loader.loadMaterialPropertiesAsync(e,t,i).then((()=>{this._loadEmissiveProperties(n,s,i)}))))}_loadEmissiveProperties(e,t,i){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);void 0!==t.emissiveStrength&&i.emissiveColor.scaleToRef(t.emissiveStrength,i.emissiveColor)}}ke.RegisterExtension(pt,(e=>new ft(e)));const _t="KHR_materials_sheen";class mt{constructor(e){this.name=_t,this.order=190,this._loader=e,this.enabled=this._loader.isExtensionUsed(_t)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{const r=new Array;return r.push(this._loader.loadMaterialPropertiesAsync(e,t,i)),r.push(this._loadSheenPropertiesAsync(n,s,i)),Promise.all(r).then((()=>{}))}))}_loadSheenPropertiesAsync(e,t,i){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);const n=new Array;return i.sheen.isEnabled=!0,i.sheen.intensity=1,null!=t.sheenColorFactor?i.sheen.color=I.Wo.FromArray(t.sheenColorFactor):i.sheen.color=I.Wo.Black(),t.sheenColorTexture&&n.push(this._loader.loadTextureInfoAsync(`${e}/sheenColorTexture`,t.sheenColorTexture,(e=>{e.name=`${i.name} (Sheen Color)`,i.sheen.texture=e}))),void 0!==t.sheenRoughnessFactor?i.sheen.roughness=t.sheenRoughnessFactor:i.sheen.roughness=0,t.sheenRoughnessTexture&&(t.sheenRoughnessTexture.nonColorData=!0,n.push(this._loader.loadTextureInfoAsync(`${e}/sheenRoughnessTexture`,t.sheenRoughnessTexture,(e=>{e.name=`${i.name} (Sheen Roughness)`,i.sheen.textureRoughness=e})))),i.sheen.albedoScaling=!0,i.sheen.useRoughnessFromMainTexture=!1,Promise.all(n).then((()=>{}))}}ke.RegisterExtension(_t,(e=>new mt(e)));const gt="KHR_materials_specular";class vt{constructor(e){this.name=gt,this.order=190,this._loader=e,this.enabled=this._loader.isExtensionUsed(gt)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{const r=new Array;return r.push(this._loader.loadMaterialPropertiesAsync(e,t,i)),r.push(this._loadSpecularPropertiesAsync(n,s,i)),Promise.all(r).then((()=>{}))}))}_loadSpecularPropertiesAsync(e,t,i){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);const n=new Array;return void 0!==t.specularFactor&&(i.metallicF0Factor=t.specularFactor),void 0!==t.specularColorFactor&&(i.metallicReflectanceColor=I.Wo.FromArray(t.specularColorFactor)),t.specularTexture&&(t.specularTexture.nonColorData=!0,n.push(this._loader.loadTextureInfoAsync(`${e}/specularTexture`,t.specularTexture,(e=>{e.name=`${i.name} (Specular F0 Strength)`,i.metallicReflectanceTexture=e,i.useOnlyMetallicFromMetallicReflectanceTexture=!0})))),t.specularColorTexture&&n.push(this._loader.loadTextureInfoAsync(`${e}/specularColorTexture`,t.specularColorTexture,(e=>{e.name=`${i.name} (Specular F0 Color)`,i.reflectanceTexture=e}))),Promise.all(n).then((()=>{}))}}ke.RegisterExtension(gt,(e=>new vt(e)));const yt="KHR_materials_ior";class xt{constructor(e){this.name=yt,this.order=180,this._loader=e,this.enabled=this._loader.isExtensionUsed(yt)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{const r=new Array;return r.push(this._loader.loadMaterialPropertiesAsync(e,t,i)),r.push(this._loadIorPropertiesAsync(n,s,i)),Promise.all(r).then((()=>{}))}))}_loadIorPropertiesAsync(e,t,i){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);return void 0!==t.ior?i.indexOfRefraction=t.ior:i.indexOfRefraction=xt._DEFAULT_IOR,Promise.resolve()}}xt._DEFAULT_IOR=1.5,ke.RegisterExtension(yt,(e=>new xt(e)));const bt="KHR_materials_variants";class Tt{constructor(e){this.name=bt,this._loader=e,this.enabled=this._loader.isExtensionUsed(bt)}dispose(){this._loader=null}static GetAvailableVariants(e){const t=this._GetExtensionMetadata(e);return t?Object.keys(t.variants):[]}getAvailableVariants(e){return Tt.GetAvailableVariants(e)}static SelectVariant(e,t){const i=this._GetExtensionMetadata(e);if(!i)throw new Error(`Cannot select variant on a glTF mesh that does not have the ${bt} extension`);const n=e=>{const t=i.variants[e];if(t)for(const e of t)e.mesh.material=e.material};if(t instanceof Array)for(const e of t)n(e);else n(t);i.lastSelected=t}selectVariant(e,t){return Tt.SelectVariant(e,t)}static Reset(e){const t=this._GetExtensionMetadata(e);if(!t)throw new Error(`Cannot reset on a glTF mesh that does not have the ${bt} extension`);for(const e of t.original)e.mesh.material=e.material;t.lastSelected=null}reset(e){return Tt.Reset(e)}static GetLastSelectedVariant(e){const t=this._GetExtensionMetadata(e);if(!t)throw new Error(`Cannot get the last selected variant on a glTF mesh that does not have the ${bt} extension`);return t.lastSelected}getLastSelectedVariant(e){return Tt.GetLastSelectedVariant(e)}static _GetExtensionMetadata(e){var t,i;return(null===(i=null===(t=null==e?void 0:e._internalMetadata)||void 0===t?void 0:t.gltf)||void 0===i?void 0:i[bt])||null}onLoading(){const e=this._loader.gltf.extensions;if(e&&e[this.name]){const t=e[this.name];this._variants=t.variants}}_loadMeshPrimitiveAsync(e,t,i,n,s,r){return ke.LoadExtensionAsync(e,s,this.name,((o,a)=>{const l=new Array;return l.push(this._loader._loadMeshPrimitiveAsync(e,t,i,n,s,(t=>{if(r(t),t instanceof Y.Kj){const i=ke._GetDrawMode(e,s.mode),n=this._loader.rootBabylonMesh,r=n?n._internalMetadata=n._internalMetadata||{}:{},h=r.gltf=r.gltf||{},c=h[bt]=h[bt]||{lastSelected:null,original:[],variants:{}};c.original.push({mesh:t,material:t.material});for(let e=0;e<a.mappings.length;++e){const s=a.mappings[e],r=Ve.Get(`${o}/mappings/${e}/material`,this._loader.gltf.materials,s.material);l.push(this._loader._loadMaterialAsync(`#/materials/${s.material}`,r,t,i,(e=>{for(let i=0;i<s.variants.length;++i){const r=s.variants[i],o=Ve.Get(`/extensions/${bt}/variants/${r}`,this._variants,r);c.variants[o.name]=c.variants[o.name]||[],c.variants[o.name].push({mesh:t,material:e}),t.onClonedObservable.add((e=>{const i=e;let s=null,r=i;do{if(r=r.parent,!r)return;s=Tt._GetExtensionMetadata(r)}while(null===s);if(n&&s===Tt._GetExtensionMetadata(n)){r._internalMetadata={};for(const e in n._internalMetadata)r._internalMetadata[e]=n._internalMetadata[e];r._internalMetadata.gltf=[];for(const e in n._internalMetadata.gltf)r._internalMetadata.gltf[e]=n._internalMetadata.gltf[e];r._internalMetadata.gltf[bt]={lastSelected:null,original:[],variants:{}};for(const e of s.original)r._internalMetadata.gltf[bt].original.push({mesh:e.mesh,material:e.material});for(const e in s.variants)if(Object.prototype.hasOwnProperty.call(s.variants,e)){r._internalMetadata.gltf[bt].variants[e]=[];for(const t of s.variants[e])r._internalMetadata.gltf[bt].variants[e].push({mesh:t.mesh,material:t.material})}s=r._internalMetadata.gltf[bt]}for(const e of s.original)e.mesh===t&&(e.mesh=i);for(const e of s.variants[o.name])e.mesh===t&&(e.mesh=i)}))}})))}}}))),Promise.all(l).then((([e])=>e))}))}}ke.RegisterExtension(bt,(e=>new Tt(e)));var St=i(4246);class Et{static _GetDefaultOptions(){return{renderSize:1024,samples:4,lodGenerationScale:1,lodGenerationOffset:-4,renderTargetTextureType:ee.g.TEXTURETYPE_HALF_FLOAT,generateMipmaps:!0}}constructor(e,t){this._opaqueRenderTarget=null,this._opaqueMeshesCache=[],this._transparentMeshesCache=[],this._materialObservers={},this._options={...Et._GetDefaultOptions(),...e},this._scene=t,this._scene._transmissionHelper=this,this.onErrorObservable=new r.y$,this._scene.onDisposeObservable.addOnce((()=>{this.dispose()})),this._parseScene(),this._setupRenderTargets()}updateOptions(e){if(!Object.keys(e).filter((t=>this._options[t]!==e[t])).length)return;const t={...this._options,...e},i=this._options;this._options=t,t.renderSize===i.renderSize&&t.renderTargetTextureType===i.renderTargetTextureType&&t.generateMipmaps===i.generateMipmaps&&this._opaqueRenderTarget?(this._opaqueRenderTarget.samples=t.samples,this._opaqueRenderTarget.lodGenerationScale=t.lodGenerationScale,this._opaqueRenderTarget.lodGenerationOffset=t.lodGenerationOffset):this._setupRenderTargets()}getOpaqueTarget(){return this._opaqueRenderTarget}_shouldRenderAsTransmission(e){return!!e&&!!(e instanceof Me.Y&&e.subSurface.isRefractionEnabled)}_addMesh(e){this._materialObservers[e.uniqueId]=e.onMaterialChangedObservable.add(this._onMeshMaterialChanged.bind(this)),o.w1.SetImmediate((()=>{this._shouldRenderAsTransmission(e.material)?(e.material.refractionTexture=this._opaqueRenderTarget,-1===this._transparentMeshesCache.indexOf(e)&&this._transparentMeshesCache.push(e)):-1===this._opaqueMeshesCache.indexOf(e)&&this._opaqueMeshesCache.push(e)}))}_removeMesh(e){e.onMaterialChangedObservable.remove(this._materialObservers[e.uniqueId]),delete this._materialObservers[e.uniqueId];let t=this._transparentMeshesCache.indexOf(e);-1!==t&&this._transparentMeshesCache.splice(t,1),t=this._opaqueMeshesCache.indexOf(e),-1!==t&&this._opaqueMeshesCache.splice(t,1)}_parseScene(){this._scene.meshes.forEach(this._addMesh.bind(this)),this._scene.onNewMeshAddedObservable.add(this._addMesh.bind(this)),this._scene.onMeshRemovedObservable.add(this._removeMesh.bind(this))}_onMeshMaterialChanged(e){const t=this._transparentMeshesCache.indexOf(e),i=this._opaqueMeshesCache.indexOf(e);this._shouldRenderAsTransmission(e.material)?(e.material instanceof Me.Y&&(e.material.subSurface.refractionTexture=this._opaqueRenderTarget),-1!==i?(this._opaqueMeshesCache.splice(i,1),this._transparentMeshesCache.push(e)):-1===t&&this._transparentMeshesCache.push(e)):-1!==t?(this._transparentMeshesCache.splice(t,1),this._opaqueMeshesCache.push(e)):-1===i&&this._opaqueMeshesCache.push(e)}_setupRenderTargets(){var e,t;let i,n;this._opaqueRenderTarget&&this._opaqueRenderTarget.dispose(),this._opaqueRenderTarget=new St._("opaqueSceneTexture",this._options.renderSize,this._scene,this._options.generateMipmaps,void 0,this._options.renderTargetTextureType),this._opaqueRenderTarget.ignoreCameraViewport=!0,this._opaqueRenderTarget.renderList=this._opaqueMeshesCache,this._opaqueRenderTarget.clearColor=null!==(t=null===(e=this._options.clearColor)||void 0===e?void 0:e.clone())&&void 0!==t?t:this._scene.clearColor.clone(),this._opaqueRenderTarget.gammaSpace=!1,this._opaqueRenderTarget.lodGenerationScale=this._options.lodGenerationScale,this._opaqueRenderTarget.lodGenerationOffset=this._options.lodGenerationOffset,this._opaqueRenderTarget.samples=this._options.samples,this._opaqueRenderTarget.onBeforeBindObservable.add((e=>{n=this._scene.environmentIntensity,this._scene.environmentIntensity=1,i=this._scene.imageProcessingConfiguration.applyByPostProcess,this._options.clearColor?e.clearColor.copyFrom(this._options.clearColor):this._scene.clearColor.toLinearSpaceToRef(e.clearColor,this._scene.getEngine().useExactSrgbConversions),this._scene.imageProcessingConfiguration._applyByPostProcess=!0})),this._opaqueRenderTarget.onAfterUnbindObservable.add((()=>{this._scene.environmentIntensity=n,this._scene.imageProcessingConfiguration._applyByPostProcess=i})),this._transparentMeshesCache.forEach((e=>{this._shouldRenderAsTransmission(e.material)&&(e.material.refractionTexture=this._opaqueRenderTarget)}))}dispose(){this._scene._transmissionHelper=void 0,this._opaqueRenderTarget&&(this._opaqueRenderTarget.dispose(),this._opaqueRenderTarget=null),this._transparentMeshesCache=[],this._opaqueMeshesCache=[]}}const Ct="KHR_materials_transmission";class At{constructor(e){this.name=Ct,this.order=175,this._loader=e,this.enabled=this._loader.isExtensionUsed(Ct),this.enabled&&(e.parent.transparencyAsCoverage=!0)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{const r=new Array;return r.push(this._loader.loadMaterialBasePropertiesAsync(e,t,i)),r.push(this._loader.loadMaterialPropertiesAsync(e,t,i)),r.push(this._loadTransparentPropertiesAsync(n,t,i,s)),Promise.all(r).then((()=>{}))}))}_loadTransparentPropertiesAsync(e,t,i,n){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);const s=i;if(s.subSurface.isRefractionEnabled=!0,s.subSurface.volumeIndexOfRefraction=1,s.subSurface.useAlbedoToTintRefraction=!0,void 0===n.transmissionFactor)return s.subSurface.refractionIntensity=0,s.subSurface.isRefractionEnabled=!1,Promise.resolve();{s.subSurface.refractionIntensity=n.transmissionFactor;const e=s.getScene();s.subSurface.refractionIntensity&&!e._transmissionHelper&&new Et({},s.getScene())}return s.subSurface.minimumThickness=0,s.subSurface.maximumThickness=0,n.transmissionTexture?(n.transmissionTexture.nonColorData=!0,this._loader.loadTextureInfoAsync(`${e}/transmissionTexture`,n.transmissionTexture,void 0).then((e=>{s.subSurface.refractionIntensityTexture=e,s.subSurface.useGltfStyleTextures=!0}))):Promise.resolve()}}ke.RegisterExtension(Ct,(e=>new At(e)));const Pt="KHR_materials_translucency";class Rt{constructor(e){this.name=Pt,this.order=174,this._loader=e,this.enabled=this._loader.isExtensionUsed(Pt),this.enabled&&(e.parent.transparencyAsCoverage=!0)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{const r=new Array;return r.push(this._loader.loadMaterialBasePropertiesAsync(e,t,i)),r.push(this._loader.loadMaterialPropertiesAsync(e,t,i)),r.push(this._loadTranslucentPropertiesAsync(n,t,i,s)),Promise.all(r).then((()=>{}))}))}_loadTranslucentPropertiesAsync(e,t,i,n){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);const s=i;return s.subSurface.isTranslucencyEnabled=!0,s.subSurface.volumeIndexOfRefraction=1,s.subSurface.minimumThickness=0,s.subSurface.maximumThickness=0,s.subSurface.useAlbedoToTintTranslucency=!0,void 0===n.translucencyFactor?(s.subSurface.translucencyIntensity=0,s.subSurface.isTranslucencyEnabled=!1,Promise.resolve()):(s.subSurface.translucencyIntensity=n.translucencyFactor,n.translucencyTexture?(n.translucencyTexture.nonColorData=!0,this._loader.loadTextureInfoAsync(`${e}/translucencyTexture`,n.translucencyTexture).then((e=>{s.subSurface.translucencyIntensityTexture=e}))):Promise.resolve())}}ke.RegisterExtension(Pt,(e=>new Rt(e)));const Mt="KHR_materials_volume";class It{constructor(e){this.name=Mt,this.order=173,this._loader=e,this.enabled=this._loader.isExtensionUsed(Mt),this.enabled&&this._loader._disableInstancedMesh++}dispose(){this.enabled&&this._loader._disableInstancedMesh--,this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{const r=new Array;return r.push(this._loader.loadMaterialBasePropertiesAsync(e,t,i)),r.push(this._loader.loadMaterialPropertiesAsync(e,t,i)),r.push(this._loadVolumePropertiesAsync(n,t,i,s)),Promise.all(r).then((()=>{}))}))}_loadVolumePropertiesAsync(e,t,i,n){if(!(i instanceof Me.Y))throw new Error(`${e}: Material type not supported`);if(!i.subSurface.isRefractionEnabled&&!i.subSurface.isTranslucencyEnabled||!n.thicknessFactor)return Promise.resolve();i.subSurface.volumeIndexOfRefraction=i.indexOfRefraction;const s=void 0!==n.attenuationDistance?n.attenuationDistance:Number.MAX_VALUE;return i.subSurface.tintColorAtDistance=s,void 0!==n.attenuationColor&&3==n.attenuationColor.length&&i.subSurface.tintColor.copyFromFloats(n.attenuationColor[0],n.attenuationColor[1],n.attenuationColor[2]),i.subSurface.minimumThickness=0,i.subSurface.maximumThickness=n.thicknessFactor,i.subSurface.useThicknessAsDepth=!0,n.thicknessTexture?(n.thicknessTexture.nonColorData=!0,this._loader.loadTextureInfoAsync(`${e}/thicknessTexture`,n.thicknessTexture).then((e=>{i.subSurface.thicknessTexture=e,i.subSurface.useGltfStyleTextures=!0}))):Promise.resolve()}}ke.RegisterExtension(Mt,(e=>new It(e)));const Dt="KHR_mesh_quantization";class Ot{constructor(e){this.name=Dt,this.enabled=e.isExtensionUsed(Dt)}dispose(){}}ke.RegisterExtension(Dt,(e=>new Ot(e)));const wt="KHR_texture_basisu";class Nt{constructor(e){this.name=wt,this._loader=e,this.enabled=e.isExtensionUsed(wt)}dispose(){this._loader=null}_loadTextureAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>{const r=null==t.sampler?ke.DefaultSampler:Ve.Get(`${e}/sampler`,this._loader.gltf.samplers,t.sampler),o=Ve.Get(`${n}/source`,this._loader.gltf.images,s.source);return this._loader._createTextureAsync(e,r,o,(e=>{i(e)}),t._textureInfo.nonColorData?{useRGBAIfASTCBC7NotAvailableWhenUASTC:!0}:void 0,!t._textureInfo.nonColorData)}))}}ke.RegisterExtension(wt,(e=>new Nt(e)));const Ft="KHR_texture_transform";class Lt{constructor(e){this.name=Ft,this._loader=e,this.enabled=this._loader.isExtensionUsed(Ft)}dispose(){this._loader=null}loadTextureInfoAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((n,s)=>this._loader.loadTextureInfoAsync(e,t,(e=>{if(!(e instanceof G.x))throw new Error(`${n}: Texture type not supported`);s.offset&&(e.uOffset=s.offset[0],e.vOffset=s.offset[1]),e.uRotationCenter=0,e.vRotationCenter=0,s.rotation&&(e.wAng=-s.rotation),s.scale&&(e.uScale=s.scale[0],e.vScale=s.scale[1]),null!=s.texCoord&&(e.coordinatesIndex=s.texCoord),i(e)}))))}}ke.RegisterExtension(Ft,(e=>new Lt(e)));const Bt="KHR_xmp_json_ld";class Ut{constructor(e){this.name=Bt,this.order=100,this._loader=e,this.enabled=this._loader.isExtensionUsed(Bt)}dispose(){this._loader=null}onLoading(){var e,t,i;if(null===this._loader.rootBabylonMesh)return;const n=null===(e=this._loader.gltf.extensions)||void 0===e?void 0:e.KHR_xmp_json_ld,s=null===(i=null===(t=this._loader.gltf.asset)||void 0===t?void 0:t.extensions)||void 0===i?void 0:i.KHR_xmp_json_ld;if(n&&s){const e=+s.packet;n.packets&&e<n.packets.length&&(this._loader.rootBabylonMesh.metadata=this._loader.rootBabylonMesh.metadata||{},this._loader.rootBabylonMesh.metadata.xmp=n.packets[e])}}}function Vt(e,t,i,n){return I.Wo.FromArray(t,i).scale(n)}function kt(e,t,i,n){return t[i]*n}function Gt(e,t,i,n){return-t[i]*n}function zt(e,t,i,n){return t[i+1]*n}function Wt(e,t,i,n){return t[i]*n*2}function Ht(e){return{scale:[new jt(w.f.ANIMATIONTYPE_FLOAT,`${e}.uScale`,kt,(()=>2)),new jt(w.f.ANIMATIONTYPE_FLOAT,`${e}.vScale`,zt,(()=>2))],offset:[new jt(w.f.ANIMATIONTYPE_FLOAT,`${e}.uOffset`,kt,(()=>2)),new jt(w.f.ANIMATIONTYPE_FLOAT,`${e}.vOffset`,zt,(()=>2))],rotation:[new jt(w.f.ANIMATIONTYPE_FLOAT,`${e}.wAng`,Gt,(()=>1))]}}ke.RegisterExtension(Bt,(e=>new Ut(e)));class Xt extends Fe{buildAnimations(e,t,i,n,s){s(e._babylonCamera,this._buildAnimation(t,i,n))}}class jt extends Fe{buildAnimations(e,t,i,n,s){for(const r in e._data)s(e._data[r].babylonMaterial,this._buildAnimation(t,i,n))}}class Yt extends Fe{buildAnimations(e,t,i,n,s){s(e._babylonLight,this._buildAnimation(t,i,n))}}const qt={__array__:{__target__:!0,...Be}},Kt={__array__:{__target__:!0,orthographic:{xmag:[new Xt(w.f.ANIMATIONTYPE_FLOAT,"orthoLeft",Gt,(()=>1)),new Xt(w.f.ANIMATIONTYPE_FLOAT,"orthoRight",zt,(()=>1))],ymag:[new Xt(w.f.ANIMATIONTYPE_FLOAT,"orthoBottom",Gt,(()=>1)),new Xt(w.f.ANIMATIONTYPE_FLOAT,"orthoTop",zt,(()=>1))],zfar:[new Xt(w.f.ANIMATIONTYPE_FLOAT,"maxZ",kt,(()=>1))],znear:[new Xt(w.f.ANIMATIONTYPE_FLOAT,"minZ",kt,(()=>1))]},perspective:{yfov:[new Xt(w.f.ANIMATIONTYPE_FLOAT,"fov",kt,(()=>1))],zfar:[new Xt(w.f.ANIMATIONTYPE_FLOAT,"maxZ",kt,(()=>1))],znear:[new Xt(w.f.ANIMATIONTYPE_FLOAT,"minZ",kt,(()=>1))]}}},$t={nodes:qt,materials:{__array__:{__target__:!0,pbrMetallicRoughness:{baseColorFactor:[new jt(w.f.ANIMATIONTYPE_COLOR3,"albedoColor",Vt,(()=>4)),new jt(w.f.ANIMATIONTYPE_FLOAT,"alpha",(function(e,t,i,n){return t[i+3]*n}),(()=>4))],metallicFactor:[new jt(w.f.ANIMATIONTYPE_FLOAT,"metallic",kt,(()=>1))],roughnessFactor:[new jt(w.f.ANIMATIONTYPE_FLOAT,"roughness",kt,(()=>1))],baseColorTexture:{extensions:{KHR_texture_transform:Ht("albedoTexture")}}},emissiveFactor:[new jt(w.f.ANIMATIONTYPE_COLOR3,"emissiveColor",Vt,(()=>3))],normalTexture:{scale:[new jt(w.f.ANIMATIONTYPE_FLOAT,"bumpTexture.level",kt,(()=>1))]},occlusionTexture:{strength:[new jt(w.f.ANIMATIONTYPE_FLOAT,"ambientTextureStrength",kt,(()=>1))],extensions:{KHR_texture_transform:Ht("ambientTexture")}},emissiveTexture:{extensions:{KHR_texture_transform:Ht("emissiveTexture")}},extensions:{KHR_materials_ior:{ior:[new jt(w.f.ANIMATIONTYPE_FLOAT,"indexOfRefraction",kt,(()=>1))]},KHR_materials_clearcoat:{clearcoatFactor:[new jt(w.f.ANIMATIONTYPE_FLOAT,"clearCoat.intensity",kt,(()=>1))],clearcoatRoughnessFactor:[new jt(w.f.ANIMATIONTYPE_FLOAT,"clearCoat.roughness",kt,(()=>1))]},KHR_materials_sheen:{sheenColorFactor:[new jt(w.f.ANIMATIONTYPE_COLOR3,"sheen.color",Vt,(()=>3))],sheenRoughnessFactor:[new jt(w.f.ANIMATIONTYPE_FLOAT,"sheen.roughness",kt,(()=>1))]},KHR_materials_specular:{specularFactor:[new jt(w.f.ANIMATIONTYPE_FLOAT,"metallicF0Factor",kt,(()=>1))],specularColorFactor:[new jt(w.f.ANIMATIONTYPE_COLOR3,"metallicReflectanceColor",Vt,(()=>3))]},KHR_materials_emissive_strength:{emissiveStrength:[new jt(w.f.ANIMATIONTYPE_FLOAT,"emissiveIntensity",kt,(()=>1))]},KHR_materials_transmission:{transmissionFactor:[new jt(w.f.ANIMATIONTYPE_FLOAT,"subSurface.refractionIntensity",kt,(()=>1))]},KHR_materials_volume:{attenuationColor:[new jt(w.f.ANIMATIONTYPE_COLOR3,"subSurface.tintColor",Vt,(()=>3))],attenuationDistance:[new jt(w.f.ANIMATIONTYPE_FLOAT,"subSurface.tintColorAtDistance",kt,(()=>1))],thicknessFactor:[new jt(w.f.ANIMATIONTYPE_FLOAT,"subSurface.maximumThickness",kt,(()=>1))]},KHR_materials_iridescence:{iridescenceFactor:[new jt(w.f.ANIMATIONTYPE_FLOAT,"iridescence.intensity",kt,(()=>1))],iridescenceIor:[new jt(w.f.ANIMATIONTYPE_FLOAT,"iridescence.indexOfRefraction",kt,(()=>1))],iridescenceThicknessMinimum:[new jt(w.f.ANIMATIONTYPE_FLOAT,"iridescence.minimumThickness",kt,(()=>1))],iridescenceThicknessMaximum:[new jt(w.f.ANIMATIONTYPE_FLOAT,"iridescence.maximumThickness",kt,(()=>1))]}}}},cameras:Kt,extensions:{KHR_lights_punctual:{lights:{__array__:{__target__:!0,color:[new Yt(w.f.ANIMATIONTYPE_COLOR3,"diffuse",Vt,(()=>3))],intensity:[new Yt(w.f.ANIMATIONTYPE_FLOAT,"intensity",kt,(()=>1))],range:[new Yt(w.f.ANIMATIONTYPE_FLOAT,"range",kt,(()=>1))],spot:{innerConeAngle:[new Yt(w.f.ANIMATIONTYPE_FLOAT,"innerAngle",Wt,(()=>1))],outerConeAngle:[new Yt(w.f.ANIMATIONTYPE_FLOAT,"angle",Wt,(()=>1))]}}}}}},Qt="KHR_animation_pointer";class Zt{constructor(e){this.name=Qt,this._loader=e}get enabled(){return this._loader.isExtensionUsed(Qt)}dispose(){this._loader=null}_loadAnimationChannelAsync(e,t,i,n,s){var r;const o=null===(r=n.target.extensions)||void 0===r?void 0:r.KHR_animation_pointer;if(!o)return null;"pointer"!==n.target.path&&h.Y.Warn(`${e}/target/path: Value (${n.target.path}) must be (pointer) when using the ${this.name} extension`),null!=n.target.node&&h.Y.Warn(`${e}/target/node: Value (${n.target.node}) must not be present when using the ${this.name} extension`);const a=`${e}/extensions/${this.name}`,l=o.pointer;if(!l)throw new Error(`${a}: Pointer is missing`);const c=this._parseAnimationPointer(`${a}/pointer`,l);return c?this._loader._loadAnimationChannelFromTargetInfoAsync(e,t,i,n,c,s):(h.Y.Warn(`${a}/pointer: Invalid pointer (${l}) skipped`),null)}_parseAnimationPointer(e,t){if(!t.startsWith("/"))return h.Y.Warn(`${e}: Value (${t}) must start with a slash`),null;const i=t.split("/");i.shift();let n,s=$t,r=this._loader.gltf;for(const e of i){if(s.__array__)s=s.__array__;else if(s=s[e],!s)return null;r=r&&r[e],s.__target__&&(n=r)}return n&&Array.isArray(s)?{target:n,properties:s}:null}}ke.RegisterExtension(Qt,(e=>new Zt(e)));var Jt=i(8117),ei=i(3642),ti=i(710);const ii="MSFT_audio_emitter";class ni{constructor(e){this.name=ii,this._loader=e,this.enabled=this._loader.isExtensionUsed(ii)}dispose(){this._loader=null,this._clips=null,this._emitters=null}onLoading(){const e=this._loader.gltf.extensions;if(e&&e[this.name]){const t=e[this.name];this._clips=t.clips,this._emitters=t.emitters,Ve.Assign(this._clips),Ve.Assign(this._emitters)}}loadSceneAsync(e,t){return ke.LoadExtensionAsync(e,t,this.name,((i,n)=>{const s=new Array;s.push(this._loader.loadSceneAsync(e,t));for(const e of n.emitters){const t=Ve.Get(`${i}/emitters`,this._emitters,e);if(null!=t.refDistance||null!=t.maxDistance||null!=t.rolloffFactor||null!=t.distanceModel||null!=t.innerAngle||null!=t.outerAngle)throw new Error(`${i}: Direction or Distance properties are not allowed on emitters attached to a scene`);s.push(this._loadEmitterAsync(`${i}/emitters/${t.index}`,t))}return Promise.all(s).then((()=>{}))}))}loadNodeAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((e,n)=>{const s=new Array;return this._loader.loadNodeAsync(e,t,(t=>{for(const i of n.emitters){const n=Ve.Get(`${e}/emitters`,this._emitters,i);s.push(this._loadEmitterAsync(`${e}/emitters/${n.index}`,n).then((()=>{for(const e of n._babylonSounds)e.attachToMesh(t),null==n.innerAngle&&null==n.outerAngle||(e.setLocalDirectionToMesh(M.P.Forward()),e.setDirectionalCone(2*o.w1.ToDegrees(null==n.innerAngle?Math.PI:n.innerAngle),2*o.w1.ToDegrees(null==n.outerAngle?Math.PI:n.outerAngle),0))})))}i(t)})).then((e=>Promise.all(s).then((()=>e))))}))}loadAnimationAsync(e,t){return ke.LoadExtensionAsync(e,t,this.name,((i,n)=>this._loader.loadAnimationAsync(e,t).then((s=>{const r=new Array;Ve.Assign(n.events);for(const o of n.events)r.push(this._loadAnimationEventAsync(`${i}/events/${o.index}`,e,t,o,s));return Promise.all(r).then((()=>s))}))))}_loadClipAsync(e,t){if(t._objectURL)return t._objectURL;let i;if(t.uri)i=this._loader.loadUriAsync(e,t,t.uri);else{const n=Ve.Get(`${e}/bufferView`,this._loader.gltf.bufferViews,t.bufferView);i=this._loader.loadBufferViewAsync(`/bufferViews/${n.index}`,n)}return t._objectURL=i.then((e=>URL.createObjectURL(new Blob([e],{type:t.mimeType})))),t._objectURL}_loadEmitterAsync(e,t){if(t._babylonSounds=t._babylonSounds||[],!t._babylonData){const e=new Array,i=t.name||`emitter${t.index}`,n={loop:!1,autoplay:!1,volume:null==t.volume?1:t.volume};for(let s=0;s<t.clips.length;s++){const r=`/extensions/${this.name}/clips`,o=Ve.Get(r,this._clips,t.clips[s].clip);e.push(this._loadClipAsync(`${r}/${t.clips[s].clip}`,o).then((e=>{const r=t._babylonSounds[s]=new ei.$(i,e,this._loader.babylonScene,null,n);r.refDistance=t.refDistance||1,r.maxDistance=t.maxDistance||256,r.rolloffFactor=t.rolloffFactor||1,r.distanceModel=t.distanceModel||"exponential"})))}const s=Promise.all(e).then((()=>{const e=t.clips.map((e=>e.weight||1)),i=new ti.s(t.loop||!1,t._babylonSounds,e);t.innerAngle&&(i.directionalConeInnerAngle=2*o.w1.ToDegrees(t.innerAngle)),t.outerAngle&&(i.directionalConeOuterAngle=2*o.w1.ToDegrees(t.outerAngle)),t.volume&&(i.volume=t.volume),t._babylonData.sound=i}));t._babylonData={loaded:s}}return t._babylonData.loaded}_getEventAction(e,t,i,n,s){switch(i){case"play":return e=>{const i=(s||0)+(e-n);t.play(i)};case"stop":return()=>{t.stop()};case"pause":return()=>{t.pause()};default:throw new Error(`${e}: Unsupported action ${i}`)}}_loadAnimationEventAsync(e,t,i,n,s){if(0==s.targetedAnimations.length)return Promise.resolve();const r=s.targetedAnimations[0],o=n.emitter,a=Ve.Get(`/extensions/${this.name}/emitters`,this._emitters,o);return this._loadEmitterAsync(e,a).then((()=>{const t=a._babylonData.sound;if(t){const i=new Jt.O(n.time,this._getEventAction(e,t,n.action,n.time,n.startOffset));r.animation.addEvent(i),s.onAnimationGroupEndObservable.add((()=>{t.stop()})),s.onAnimationGroupPauseObservable.add((()=>{t.pause()}))}}))}}ke.RegisterExtension(ii,(e=>new ni(e)));const si="MSFT_lod";class ri{constructor(e){this.name=si,this.order=100,this.maxLODsToLoad=10,this.onNodeLODsLoadedObservable=new r.y$,this.onMaterialLODsLoadedObservable=new r.y$,this._bufferLODs=new Array,this._nodeIndexLOD=null,this._nodeSignalLODs=new Array,this._nodePromiseLODs=new Array,this._nodeBufferLODs=new Array,this._materialIndexLOD=null,this._materialSignalLODs=new Array,this._materialPromiseLODs=new Array,this._materialBufferLODs=new Array,this._loader=e,this.enabled=this._loader.isExtensionUsed(si)}dispose(){this._loader=null,this._nodeIndexLOD=null,this._nodeSignalLODs.length=0,this._nodePromiseLODs.length=0,this._nodeBufferLODs.length=0,this._materialIndexLOD=null,this._materialSignalLODs.length=0,this._materialPromiseLODs.length=0,this._materialBufferLODs.length=0,this.onMaterialLODsLoadedObservable.clear(),this.onNodeLODsLoadedObservable.clear()}onReady(){for(let e=0;e<this._nodePromiseLODs.length;e++){const t=Promise.all(this._nodePromiseLODs[e]).then((()=>{0!==e&&(this._loader.endPerformanceCounter(`Node LOD ${e}`),this._loader.log(`Loaded node LOD ${e}`)),this.onNodeLODsLoadedObservable.notifyObservers(e),e!==this._nodePromiseLODs.length-1&&(this._loader.startPerformanceCounter(`Node LOD ${e+1}`),this._loadBufferLOD(this._nodeBufferLODs,e+1),this._nodeSignalLODs[e]&&this._nodeSignalLODs[e].resolve())}));this._loader._completePromises.push(t)}for(let e=0;e<this._materialPromiseLODs.length;e++){const t=Promise.all(this._materialPromiseLODs[e]).then((()=>{0!==e&&(this._loader.endPerformanceCounter(`Material LOD ${e}`),this._loader.log(`Loaded material LOD ${e}`)),this.onMaterialLODsLoadedObservable.notifyObservers(e),e!==this._materialPromiseLODs.length-1&&(this._loader.startPerformanceCounter(`Material LOD ${e+1}`),this._loadBufferLOD(this._materialBufferLODs,e+1),this._materialSignalLODs[e]&&this._materialSignalLODs[e].resolve())}));this._loader._completePromises.push(t)}}loadSceneAsync(e,t){const i=this._loader.loadSceneAsync(e,t);return this._loadBufferLOD(this._bufferLODs,0),i}loadNodeAsync(e,t,i){return ke.LoadExtensionAsync(e,t,this.name,((e,n)=>{let s;const r=this._getLODs(e,t,this._loader.gltf.nodes,n.ids);this._loader.logOpen(`${e}`);for(let e=0;e<r.length;e++){const t=r[e];0!==e&&(this._nodeIndexLOD=e,this._nodeSignalLODs[e]=this._nodeSignalLODs[e]||new Ae.B);const n=e=>{i(e),e.setEnabled(!1)},o=this._loader.loadNodeAsync(`/nodes/${t.index}`,t,n).then((t=>{if(0!==e){const t=r[e-1];t._babylonTransformNode&&(this._disposeTransformNode(t._babylonTransformNode),delete t._babylonTransformNode)}return t.setEnabled(!0),t}));this._nodePromiseLODs[e]=this._nodePromiseLODs[e]||[],0===e?s=o:(this._nodeIndexLOD=null,this._nodePromiseLODs[e].push(o))}return this._loader.logClose(),s}))}_loadMaterialAsync(e,t,i,n,s){return this._nodeIndexLOD?null:ke.LoadExtensionAsync(e,t,this.name,((e,r)=>{let o;const a=this._getLODs(e,t,this._loader.gltf.materials,r.ids);this._loader.logOpen(`${e}`);for(let e=0;e<a.length;e++){const t=a[e];0!==e&&(this._materialIndexLOD=e);const r=this._loader._loadMaterialAsync(`/materials/${t.index}`,t,i,n,(t=>{0===e&&s(t)})).then((t=>{if(0!==e){s(t);const i=a[e-1]._data;i[n]&&(this._disposeMaterials([i[n].babylonMaterial]),delete i[n])}return t}));this._materialPromiseLODs[e]=this._materialPromiseLODs[e]||[],0===e?o=r:(this._materialIndexLOD=null,this._materialPromiseLODs[e].push(r))}return this._loader.logClose(),o}))}_loadUriAsync(e,t,i){if(null!==this._nodeIndexLOD){this._loader.log("deferred");const n=this._nodeIndexLOD-1;return this._nodeSignalLODs[n]=this._nodeSignalLODs[n]||new Ae.B,this._nodeSignalLODs[this._nodeIndexLOD-1].promise.then((()=>this._loader.loadUriAsync(e,t,i)))}if(null!==this._materialIndexLOD){this._loader.log("deferred");const n=this._materialIndexLOD-1;return this._materialSignalLODs[n]=this._materialSignalLODs[n]||new Ae.B,this._materialSignalLODs[n].promise.then((()=>this._loader.loadUriAsync(e,t,i)))}return null}loadBufferAsync(e,t,i,n){if(this._loader.parent.useRangeRequests&&!t.uri){if(!this._loader.bin)throw new Error(`${e}: Uri is missing or the binary glTF is missing its binary chunk`);const t=(e,t)=>{const s=i,r=s+n-1;let o=e[t];return o?(o.start=Math.min(o.start,s),o.end=Math.max(o.end,r)):(o={start:s,end:r,loaded:new Ae.B},e[t]=o),o.loaded.promise.then((e=>new Uint8Array(e.buffer,e.byteOffset+i-o.start,n)))};return this._loader.log("deferred"),null!==this._nodeIndexLOD?t(this._nodeBufferLODs,this._nodeIndexLOD):null!==this._materialIndexLOD?t(this._materialBufferLODs,this._materialIndexLOD):t(this._bufferLODs,0)}return null}_loadBufferLOD(e,t){const i=e[t];i&&(this._loader.log(`Loading buffer range [${i.start}-${i.end}]`),this._loader.bin.readAsync(i.start,i.end-i.start+1).then((e=>{i.loaded.resolve(e)}),(e=>{i.loaded.reject(e)})))}_getLODs(e,t,i,n){if(this.maxLODsToLoad<=0)throw new Error("maxLODsToLoad must be greater than zero");const s=new Array;for(let t=n.length-1;t>=0;t--)if(s.push(Ve.Get(`${e}/ids/${n[t]}`,i,n[t])),s.length===this.maxLODsToLoad)return s;return s.push(t),s}_disposeTransformNode(e){const t=new Array,i=e.material;i&&t.push(i);for(const i of e.getChildMeshes())i.material&&t.push(i.material);e.dispose();const n=t.filter((e=>this._loader.babylonScene.meshes.every((t=>t.material!=e))));this._disposeMaterials(n)}_disposeMaterials(e){const t={};for(const i of e){for(const e of i.getActiveTextures())t[e.uniqueId]=e;i.dispose()}for(const e in t)for(const i of this._loader.babylonScene.materials)i.hasTexture(t[e])&&delete t[e];for(const e in t)t[e].dispose()}}ke.RegisterExtension(si,(e=>new ri(e)));const oi="MSFT_minecraftMesh";class ai{constructor(e){this.name=oi,this._loader=e,this.enabled=this._loader.isExtensionUsed(oi)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtraAsync(e,t,this.name,((n,s)=>{if(s){if(!(i instanceof Me.Y))throw new Error(`${n}: Material type not supported`);const s=this._loader.loadMaterialPropertiesAsync(e,t,i);return i.needAlphaBlending()&&(i.forceDepthWrite=!0,i.separateCullingPass=!0),i.backFaceCulling=i.forceDepthWrite,i.twoSidedLighting=!0,s}return null}))}}ke.RegisterExtension(oi,(e=>new ai(e)));const li="MSFT_sRGBFactors";class hi{constructor(e){this.name=li,this._loader=e,this.enabled=this._loader.isExtensionUsed(li)}dispose(){this._loader=null}loadMaterialPropertiesAsync(e,t,i){return ke.LoadExtraAsync(e,t,this.name,((n,s)=>{if(s){if(!(i instanceof Me.Y))throw new Error(`${n}: Material type not supported`);const s=this._loader.loadMaterialPropertiesAsync(e,t,i),r=i.getScene().getEngine().useExactSrgbConversions;return i.albedoTexture||i.albedoColor.toLinearSpaceToRef(i.albedoColor,r),i.reflectivityTexture||i.reflectivityColor.toLinearSpaceToRef(i.reflectivityColor,r),s}return null}))}}ke.RegisterExtension(li,(e=>new hi(e)));const ci="ExtrasAsMetadata";class ui{_assignExtras(e,t){if(t.extras&&Object.keys(t.extras).length>0){const i=e.metadata=e.metadata||{};(i.gltf=i.gltf||{}).extras=t.extras}}constructor(e){this.name=ci,this.enabled=!0,this._loader=e}dispose(){this._loader=null}loadNodeAsync(e,t,i){return this._loader.loadNodeAsync(e,t,(e=>{this._assignExtras(e,t),i(e)}))}loadCameraAsync(e,t,i){return this._loader.loadCameraAsync(e,t,(e=>{this._assignExtras(e,t),i(e)}))}createMaterial(e,t,i){const n=this._loader.createMaterial(e,t,i);return this._assignExtras(n,t),n}}ke.RegisterExtension(ci,(e=>new ui(e)));class di{constructor(){this.materials=[]}parseMTL(e,t,i,n){if(t instanceof ArrayBuffer)return;const s=t.split("\n"),r=/\s+/;let o,a=null;for(let t=0;t<s.length;t++){const l=s[t].trim();if(0===l.length||"#"===l.charAt(0))continue;const h=l.indexOf(" ");let c=h>=0?l.substring(0,h):l;c=c.toLowerCase();const u=h>=0?l.substring(h+1).trim():"";if("newmtl"===c)a&&this.materials.push(a),e._blockEntityCollection=!!n,a=new V.K(u,e),a._parentContainer=n,e._blockEntityCollection=!1;else if("kd"===c&&a)o=u.split(r,3).map(parseFloat),a.diffuseColor=I.Wo.FromArray(o);else if("ka"===c&&a)o=u.split(r,3).map(parseFloat),a.ambientColor=I.Wo.FromArray(o);else if("ks"===c&&a)o=u.split(r,3).map(parseFloat),a.specularColor=I.Wo.FromArray(o);else if("ke"===c&&a)o=u.split(r,3).map(parseFloat),a.emissiveColor=I.Wo.FromArray(o);else if("ns"===c&&a)a.specularPower=parseFloat(u);else if("d"===c&&a)a.alpha=parseFloat(u);else if("map_ka"===c&&a)a.ambientTexture=di._GetTexture(i,u,e);else if("map_kd"===c&&a)a.diffuseTexture=di._GetTexture(i,u,e);else if("map_ks"===c&&a)a.specularTexture=di._GetTexture(i,u,e);else if("map_ns"===c);else if("map_bump"===c&&a){const t=u.split(r),n=t.indexOf("-bm");let s=null;n>=0&&(s=t[n+1],t.splice(n,2)),a.bumpTexture=di._GetTexture(i,t.join(" "),e),a.bumpTexture&&null!==s&&(a.bumpTexture.level=parseFloat(s))}else"map_d"===c&&a&&(a.opacityTexture=di._GetTexture(i,u,e))}a&&this.materials.push(a)}static _GetTexture(e,t,i){if(!t)return null;let n=e;if("file:"===e){let e=t.lastIndexOf("\\");-1===e&&(e=t.lastIndexOf("/")),n+=e>-1?t.substr(e+1):t}else n+=t;return new G.x(n,i,!1,di.INVERT_TEXTURE_Y)}}di.INVERT_TEXTURE_Y=!0;class pi{constructor(e,t,i){this._positions=[],this._normals=[],this._uvs=[],this._colors=[],this._meshesFromObj=[],this._indicesForBabylon=[],this._wrappedPositionForBabylon=[],this._wrappedUvsForBabylon=[],this._wrappedColorsForBabylon=[],this._wrappedNormalsForBabylon=[],this._tuplePosNorm=[],this._curPositionInIndices=0,this._hasMeshes=!1,this._unwrappedPositionsForBabylon=[],this._unwrappedColorsForBabylon=[],this._unwrappedNormalsForBabylon=[],this._unwrappedUVForBabylon=[],this._triangles=[],this._materialNameFromObj="",this._objMeshName="",this._increment=1,this._isFirstMaterial=!0,this._grayColor=new I.HE(.5,.5,.5,1),this._materialToUse=e,this._babylonMeshesArray=t,this._loadingOptions=i}_isInArray(e,t){e[t[0]]||(e[t[0]]={normals:[],idx:[]});const i=e[t[0]].normals.indexOf(t[1]);return-1===i?-1:e[t[0]].idx[i]}_isInArrayUV(e,t){e[t[0]]||(e[t[0]]={normals:[],idx:[],uv:[]});const i=e[t[0]].normals.indexOf(t[1]);return 1!=i&&t[2]===e[t[0]].uv[i]?e[t[0]].idx[i]:-1}_setData(e,t,i,n,s,r,o){let a;a=this._loadingOptions.optimizeWithUV?this._isInArrayUV(this._tuplePosNorm,[e,i,t]):this._isInArray(this._tuplePosNorm,[e,i]),-1===a?(this._indicesForBabylon.push(this._wrappedPositionForBabylon.length),this._wrappedPositionForBabylon.push(n),this._wrappedUvsForBabylon.push(s),this._wrappedNormalsForBabylon.push(r),void 0!==o&&this._wrappedColorsForBabylon.push(o),this._tuplePosNorm[e].normals.push(i),this._tuplePosNorm[e].idx.push(this._curPositionInIndices++),this._loadingOptions.optimizeWithUV&&this._tuplePosNorm[e].uv.push(t)):this._indicesForBabylon.push(a)}_unwrapData(){for(let e=0;e<this._wrappedPositionForBabylon.length;e++)this._unwrappedPositionsForBabylon.push(this._wrappedPositionForBabylon[e].x,this._wrappedPositionForBabylon[e].y,this._wrappedPositionForBabylon[e].z),this._unwrappedNormalsForBabylon.push(this._wrappedNormalsForBabylon[e].x,this._wrappedNormalsForBabylon[e].y,this._wrappedNormalsForBabylon[e].z),this._unwrappedUVForBabylon.push(this._wrappedUvsForBabylon[e].x,this._wrappedUvsForBabylon[e].y),this._loadingOptions.importVertexColors&&this._unwrappedColorsForBabylon.push(this._wrappedColorsForBabylon[e].r,this._wrappedColorsForBabylon[e].g,this._wrappedColorsForBabylon[e].b,this._wrappedColorsForBabylon[e].a);this._wrappedPositionForBabylon.length=0,this._wrappedNormalsForBabylon.length=0,this._wrappedUvsForBabylon.length=0,this._wrappedColorsForBabylon.length=0,this._tuplePosNorm.length=0,this._curPositionInIndices=0}_getTriangles(e,t){for(let i=t;i<e.length-1;i++)this._triangles.push(e[0],e[i],e[i+1])}_setDataForCurrentFaceWithPattern1(e,t){this._getTriangles(e,t);for(let e=0;e<this._triangles.length;e++){const t=parseInt(this._triangles[e])-1;this._setData(t,0,0,this._positions[t],M.FM.Zero(),M.P.Up(),this._loadingOptions.importVertexColors?this._colors[t]:void 0)}this._triangles.length=0}_setDataForCurrentFaceWithPattern2(e,t){this._getTriangles(e,t);for(let e=0;e<this._triangles.length;e++){const t=this._triangles[e].split("/"),i=parseInt(t[0])-1,n=parseInt(t[1])-1;this._setData(i,n,0,this._positions[i],this._uvs[n],M.P.Up(),this._loadingOptions.importVertexColors?this._colors[i]:void 0)}this._triangles.length=0}_setDataForCurrentFaceWithPattern3(e,t){this._getTriangles(e,t);for(let e=0;e<this._triangles.length;e++){const t=this._triangles[e].split("/"),i=parseInt(t[0])-1,n=parseInt(t[1])-1,s=parseInt(t[2])-1;this._setData(i,n,s,this._positions[i],this._uvs[n],this._normals[s])}this._triangles.length=0}_setDataForCurrentFaceWithPattern4(e,t){this._getTriangles(e,t);for(let e=0;e<this._triangles.length;e++){const t=this._triangles[e].split("//"),i=parseInt(t[0])-1,n=parseInt(t[1])-1;this._setData(i,1,n,this._positions[i],M.FM.Zero(),this._normals[n],this._loadingOptions.importVertexColors?this._colors[i]:void 0)}this._triangles.length=0}_setDataForCurrentFaceWithPattern5(e,t){this._getTriangles(e,t);for(let e=0;e<this._triangles.length;e++){const t=this._triangles[e].split("/"),i=this._positions.length+parseInt(t[0]),n=this._uvs.length+parseInt(t[1]),s=this._normals.length+parseInt(t[2]);this._setData(i,n,s,this._positions[i],this._uvs[n],this._normals[s],this._loadingOptions.importVertexColors?this._colors[i]:void 0)}this._triangles.length=0}_addPreviousObjMesh(){this._meshesFromObj.length>0&&(this._handledMesh=this._meshesFromObj[this._meshesFromObj.length-1],this._unwrapData(),this._indicesForBabylon.reverse(),this._handledMesh.indices=this._indicesForBabylon.slice(),this._handledMesh.positions=this._unwrappedPositionsForBabylon.slice(),this._handledMesh.normals=this._unwrappedNormalsForBabylon.slice(),this._handledMesh.uvs=this._unwrappedUVForBabylon.slice(),this._loadingOptions.importVertexColors&&(this._handledMesh.colors=this._unwrappedColorsForBabylon.slice()),this._indicesForBabylon.length=0,this._unwrappedPositionsForBabylon.length=0,this._unwrappedColorsForBabylon.length=0,this._unwrappedNormalsForBabylon.length=0,this._unwrappedUVForBabylon.length=0)}_optimizeNormals(e){const t=e.getVerticesData(W.o.PositionKind),i=e.getVerticesData(W.o.NormalKind),n={};if(!t||!i)return;for(let e=0;e<t.length/3;e++){const i=t[3*e+0]+"_"+t[3*e+1]+"_"+t[3*e+2];let s=n[i];s||(s=[],n[i]=s),s.push(e)}const s=new M.P;for(const e in n){const t=n[e];if(t.length<2)continue;const r=t[0];for(let e=1;e<t.length;++e){const n=t[e];i[3*r+0]+=i[3*n+0],i[3*r+1]+=i[3*n+1],i[3*r+2]+=i[3*n+2]}s.copyFromFloats(i[3*r+0],i[3*r+1],i[3*r+2]),s.normalize();for(let e=0;e<t.length;++e){const n=t[e];i[3*n+0]=s.x,i[3*n+1]=s.y,i[3*n+2]=s.z}}e.setVerticesData(W.o.NormalKind,i)}parse(e,t,i,n,s){var r;const o=t.split("\n");for(let e=0;e<o.length;e++){const t=o[e].trim().replace(/\s\s/g," ");let i;if(0!==t.length&&"#"!==t.charAt(0))if(pi.VertexPattern.test(t)){if(i=t.match(/[^ ]+/g),this._positions.push(new M.P(parseFloat(i[1]),parseFloat(i[2]),parseFloat(i[3]))),this._loadingOptions.importVertexColors)if(i.length>=7){const e=parseFloat(i[4]),t=parseFloat(i[5]),n=parseFloat(i[6]);this._colors.push(new I.HE(e>1?e/255:e,t>1?t/255:t,n>1?n/255:n,7===i.length||void 0===i[7]?1:parseFloat(i[7])))}else this._colors.push(this._grayColor)}else if(null!==(i=pi.NormalPattern.exec(t)))this._normals.push(new M.P(parseFloat(i[1]),parseFloat(i[2]),parseFloat(i[3])));else if(null!==(i=pi.UVPattern.exec(t)))this._uvs.push(new M.FM(parseFloat(i[1])*this._loadingOptions.UVScaling.x,parseFloat(i[2])*this._loadingOptions.UVScaling.y));else if(null!==(i=pi.FacePattern3.exec(t)))this._setDataForCurrentFaceWithPattern3(i[1].trim().split(" "),1);else if(null!==(i=pi.FacePattern4.exec(t)))this._setDataForCurrentFaceWithPattern4(i[1].trim().split(" "),1);else if(null!==(i=pi.FacePattern5.exec(t)))this._setDataForCurrentFaceWithPattern5(i[1].trim().split(" "),1);else if(null!==(i=pi.FacePattern2.exec(t)))this._setDataForCurrentFaceWithPattern2(i[1].trim().split(" "),1);else if(null!==(i=pi.FacePattern1.exec(t)))this._setDataForCurrentFaceWithPattern1(i[1].trim().split(" "),1);else if(pi.GroupDescriptor.test(t)||pi.ObjectDescriptor.test(t)){const e={name:t.substring(2).trim(),indices:void 0,positions:void 0,normals:void 0,uvs:void 0,colors:void 0,materialName:this._materialNameFromObj};this._addPreviousObjMesh(),this._meshesFromObj.push(e),this._hasMeshes=!0,this._isFirstMaterial=!0,this._increment=1}else if(pi.UseMtlDescriptor.test(t)){if(this._materialNameFromObj=t.substring(7).trim(),!this._isFirstMaterial||!this._hasMeshes){this._addPreviousObjMesh();const e={name:(this._objMeshName||"mesh")+"_mm"+this._increment.toString(),indices:void 0,positions:void 0,normals:void 0,uvs:void 0,colors:void 0,materialName:this._materialNameFromObj};this._increment++,this._meshesFromObj.push(e),this._hasMeshes=!0}this._hasMeshes&&this._isFirstMaterial&&(this._meshesFromObj[this._meshesFromObj.length-1].materialName=this._materialNameFromObj,this._isFirstMaterial=!1)}else pi.MtlLibGroupDescriptor.test(t)?s(t.substring(7).trim()):pi.SmoothDescriptor.test(t)||console.log("Unhandled expression at line : "+t)}if(this._hasMeshes&&(this._handledMesh=this._meshesFromObj[this._meshesFromObj.length-1],this._indicesForBabylon.reverse(),this._unwrapData(),this._handledMesh.indices=this._indicesForBabylon,this._handledMesh.positions=this._unwrappedPositionsForBabylon,this._handledMesh.normals=this._unwrappedNormalsForBabylon,this._handledMesh.uvs=this._unwrappedUVForBabylon,this._loadingOptions.importVertexColors&&(this._handledMesh.colors=this._unwrappedColorsForBabylon)),!this._hasMeshes){let e=null;if(this._indicesForBabylon.length)this._indicesForBabylon.reverse(),this._unwrapData();else{for(const e of this._positions)this._unwrappedPositionsForBabylon.push(e.x,e.y,e.z);if(this._normals.length)for(const e of this._normals)this._unwrappedNormalsForBabylon.push(e.x,e.y,e.z);if(this._uvs.length)for(const e of this._uvs)this._unwrappedUVForBabylon.push(e.x,e.y);if(this._colors.length)for(const e of this._colors)this._unwrappedColorsForBabylon.push(e.r,e.g,e.b,e.a);this._materialNameFromObj||(e=new V.K(H.Z.RandomId(),i),e.pointsCloud=!0,this._materialNameFromObj=e.name,this._normals.length||(e.disableLighting=!0,e.emissiveColor=I.Wo.White()))}this._meshesFromObj.push({name:H.Z.RandomId(),indices:this._indicesForBabylon,positions:this._unwrappedPositionsForBabylon,colors:this._unwrappedColorsForBabylon,normals:this._unwrappedNormalsForBabylon,uvs:this._unwrappedUVForBabylon,materialName:this._materialNameFromObj,directMaterial:e})}for(let t=0;t<this._meshesFromObj.length;t++){if(e&&this._meshesFromObj[t].name)if(e instanceof Array){if(-1===e.indexOf(this._meshesFromObj[t].name))continue}else if(this._meshesFromObj[t].name!==e)continue;this._handledMesh=this._meshesFromObj[t],i._blockEntityCollection=!!n;const s=new Y.Kj(this._meshesFromObj[t].name,i);if(s._parentContainer=n,i._blockEntityCollection=!1,this._materialToUse.push(this._meshesFromObj[t].materialName),0===(null===(r=this._handledMesh.positions)||void 0===r?void 0:r.length)){this._babylonMeshesArray.push(s);continue}const o=new z.x;if(o.uvs=this._handledMesh.uvs,o.indices=this._handledMesh.indices,o.positions=this._handledMesh.positions,this._loadingOptions.computeNormals){const e=new Array;z.x.ComputeNormals(this._handledMesh.positions,this._handledMesh.indices,e),o.normals=e}else o.normals=this._handledMesh.normals;this._loadingOptions.importVertexColors&&(o.colors=this._handledMesh.colors),o.applyToMesh(s),this._loadingOptions.invertY&&(s.scaling.y*=-1),this._loadingOptions.optimizeNormals&&this._optimizeNormals(s),this._babylonMeshesArray.push(s),this._handledMesh.directMaterial&&(s.material=this._handledMesh.directMaterial)}}}pi.ObjectDescriptor=/^o/,pi.GroupDescriptor=/^g/,pi.MtlLibGroupDescriptor=/^mtllib /,pi.UseMtlDescriptor=/^usemtl /,pi.SmoothDescriptor=/^s /,pi.VertexPattern=/v(\s+[\d|.|+|\-|e|E]+){3,7}/,pi.NormalPattern=/vn(\s+[\d|.|+|\-|e|E]+)( +[\d|.|+|\-|e|E]+)( +[\d|.|+|\-|e|E]+)/,pi.UVPattern=/vt(\s+[\d|.|+|\-|e|E]+)( +[\d|.|+|\-|e|E]+)/,pi.FacePattern1=/f\s+(([\d]{1,}[\s]?){3,})+/,pi.FacePattern2=/f\s+((([\d]{1,}\/[\d]{1,}[\s]?){3,})+)/,pi.FacePattern3=/f\s+((([\d]{1,}\/[\d]{1,}\/[\d]{1,}[\s]?){3,})+)/,pi.FacePattern4=/f\s+((([\d]{1,}\/\/[\d]{1,}[\s]?){3,})+)/,pi.FacePattern5=/f\s+(((-[\d]{1,}\/-[\d]{1,}\/-[\d]{1,}[\s]?){3,})+)/;class fi{static get INVERT_TEXTURE_Y(){return di.INVERT_TEXTURE_Y}static set INVERT_TEXTURE_Y(e){di.INVERT_TEXTURE_Y=e}constructor(e){this.name="obj",this.extensions=".obj",this._assetContainer=null,this._loadingOptions=e||fi._DefaultLoadingOptions}static get _DefaultLoadingOptions(){return{computeNormals:fi.COMPUTE_NORMALS,optimizeNormals:fi.OPTIMIZE_NORMALS,importVertexColors:fi.IMPORT_VERTEX_COLORS,invertY:fi.INVERT_Y,invertTextureY:fi.INVERT_TEXTURE_Y,UVScaling:fi.UV_SCALING,materialLoadingFailsSilently:fi.MATERIAL_LOADING_FAILS_SILENTLY,optimizeWithUV:fi.OPTIMIZE_WITH_UV,skipMaterials:fi.SKIP_MATERIALS}}_loadMTL(e,t,i,n){const s=t+e;o.w1.LoadFile(s,i,void 0,void 0,!1,((e,t)=>{n(s,t)}))}createPlugin(){return new fi(fi._DefaultLoadingOptions)}canDirectLoad(){return!1}importMeshAsync(e,t,i,n){return this._parseSolid(e,t,i,n).then((e=>({meshes:e,particleSystems:[],skeletons:[],animationGroups:[],transformNodes:[],geometries:[],lights:[]})))}loadAsync(e,t,i){return this.importMeshAsync(null,e,t,i).then((()=>{}))}loadAssetContainerAsync(e,t,i){const n=new l.TJ(e);return this._assetContainer=n,this.importMeshAsync(null,e,t,i).then((e=>(e.meshes.forEach((e=>n.meshes.push(e))),e.meshes.forEach((e=>{const t=e.material;t&&-1==n.materials.indexOf(t)&&(n.materials.push(t),t.getActiveTextures().forEach((e=>{-1==n.textures.indexOf(e)&&n.textures.push(e)})))})),this._assetContainer=null,n))).catch((e=>{throw this._assetContainer=null,e}))}_parseSolid(e,t,i,n){let s="";const r=new di,a=new Array,l=[];new pi(a,l,this._loadingOptions).parse(e,i,t,this._assetContainer,(e=>{s=e}));const h=[];return""===s||this._loadingOptions.skipMaterials||h.push(new Promise(((e,i)=>{this._loadMTL(s,n,(h=>{try{r.parseMTL(t,h,n,this._assetContainer);for(let e=0;e<r.materials.length;e++){let t=0;const i=[];let n;for(;(n=a.indexOf(r.materials[e].name,t))>-1;)i.push(n),t=n+1;if(-1===n&&0===i.length)r.materials[e].dispose();else for(let t=0;t<i.length;t++){const n=l[i[t]],s=r.materials[e];n.material=s,n.getTotalIndices()||(s.pointsCloud=!0)}}e()}catch(t){o.w1.Warn(`Error processing MTL file: '${s}'`),this._loadingOptions.materialLoadingFailsSilently?e():i(t)}}),((t,n)=>{o.w1.Warn(`Error downloading MTL file: '${s}'`),this._loadingOptions.materialLoadingFailsSilently?e():i(n)}))}))),Promise.all(h).then((()=>l))}}fi.OPTIMIZE_WITH_UV=!0,fi.INVERT_Y=!1,fi.IMPORT_VERTEX_COLORS=!1,fi.COMPUTE_NORMALS=!1,fi.OPTIMIZE_NORMALS=!1,fi.UV_SCALING=new M.FM(1,1),fi.SKIP_MATERIALS=!1,fi.MATERIAL_LOADING_FAILS_SILENTLY=!0,a.n&&a.n.RegisterPlugin(new fi);class _i{constructor(){this.solidPattern=/solid (\S*)([\S\s]*?)endsolid[ ]*(\S*)/g,this.facetsPattern=/facet([\s\S]*?)endfacet/g,this.normalPattern=/normal[\s]+([-+]?[0-9]+\.?[0-9]*([eE][-+]?[0-9]+)?)+[\s]+([-+]?[0-9]*\.?[0-9]+([eE][-+]?[0-9]+)?)+[\s]+([-+]?[0-9]*\.?[0-9]+([eE][-+]?[0-9]+)?)+/g,this.vertexPattern=/vertex[\s]+([-+]?[0-9]+\.?[0-9]*([eE][-+]?[0-9]+)?)+[\s]+([-+]?[0-9]*\.?[0-9]+([eE][-+]?[0-9]+)?)+[\s]+([-+]?[0-9]*\.?[0-9]+([eE][-+]?[0-9]+)?)+/g,this.name="stl",this.extensions={".stl":{isBinary:!0}}}importMesh(e,t,i,n,s){let r;if("string"!=typeof i){if(this._isBinary(i)){const e=new Y.Kj("stlmesh",t);return this._parseBinary(e,i),s&&s.push(e),!0}const e=new Uint8Array(i);let n="";for(let t=0;t<i.byteLength;t++)n+=String.fromCharCode(e[t]);i=n}for(;r=this.solidPattern.exec(i);){let i=r[1];const n=r[3];if(n&&i!=n)return o.w1.Error("Error in STL, solid name != endsolid name"),!1;if(e&&i)if(e instanceof Array){if(!e.indexOf(i))continue}else if(i!==e)continue;i=i||"stlmesh";const a=new Y.Kj(i,t);this._parseASCII(a,r[2]),s&&s.push(a)}return!0}load(e,t,i){return this.importMesh(null,e,t,i,null)}loadAssetContainer(e,t,i){const n=new l.TJ(e);return e._blockEntityCollection=!0,this.importMesh(null,e,t,i,n.meshes),e._blockEntityCollection=!1,n}_isBinary(e){const t=new DataView(e);if(t.byteLength<=80)return!1;if(84+50*t.getUint32(80,!0)===t.byteLength)return!0;const i=[115,111,108,105,100];for(let e=0;e<5;e++)if(t.getUint8(e)!==i[e])return!0;return!1}_parseBinary(e,t){const i=new DataView(t),n=i.getUint32(80,!0);let s=0;const r=new Float32Array(3*n*3),o=new Float32Array(3*n*3),a=new Uint32Array(3*n);let l=0;for(let e=0;e<n;e++){const t=84+50*e,n=i.getFloat32(t,!0),h=i.getFloat32(t+4,!0),c=i.getFloat32(t+8,!0);for(let e=1;e<=3;e++){const a=t+12*e;r[s]=i.getFloat32(a,!0),o[s]=n,_i.DO_NOT_ALTER_FILE_COORDINATES?(r[s+1]=i.getFloat32(a+4,!0),r[s+2]=i.getFloat32(a+8,!0),o[s+1]=h,o[s+2]=c):(r[s+2]=i.getFloat32(a+4,!0),r[s+1]=i.getFloat32(a+8,!0),o[s+2]=h,o[s+1]=c),s+=3}_i.DO_NOT_ALTER_FILE_COORDINATES?(a[l]=l,a[l+1]=l+2,a[l+2]=l+1,l+=3):(a[l]=l++,a[l]=l++,a[l]=l++)}e.setVerticesData(W.o.PositionKind,r),e.setVerticesData(W.o.NormalKind,o),e.setIndices(a),e.computeWorldMatrix(!0)}_parseASCII(e,t){const i=[],n=[],s=[];let r,o=0;for(;r=this.facetsPattern.exec(t);){const e=r[1],t=this.normalPattern.exec(e);if(this.normalPattern.lastIndex=0,!t)continue;const a=[Number(t[1]),Number(t[5]),Number(t[3])];let l;for(;l=this.vertexPattern.exec(e);)_i.DO_NOT_ALTER_FILE_COORDINATES?(i.push(Number(l[1]),Number(l[3]),Number(l[5])),n.push(a[0],a[2],a[1])):(i.push(Number(l[1]),Number(l[5]),Number(l[3])),n.push(a[0],a[1],a[2]));_i.DO_NOT_ALTER_FILE_COORDINATES?(s.push(o,o+2,o+1),o+=3):s.push(o++,o++,o++),this.vertexPattern.lastIndex=0}this.facetsPattern.lastIndex=0,e.setVerticesData(W.o.PositionKind,i),e.setVerticesData(W.o.NormalKind,n),e.setIndices(s),e.computeWorldMatrix(!0)}}_i.DO_NOT_ALTER_FILE_COORDINATES=!1,a.n&&a.n.RegisterPlugin(new _i)},3849:(e,t,i)=>{i.r(t),i.d(t,{CellMaterial:()=>g,CustomMaterial:()=>T,CustomShaderStructure:()=>x,FireMaterial:()=>I,FurMaterial:()=>N,GradientMaterial:()=>L,GridMaterial:()=>U,LavaMaterial:()=>k,MixMaterial:()=>z,NormalMaterial:()=>H,PBRCustomMaterial:()=>A,ShaderAlebdoParts:()=>C,ShaderSpecialParts:()=>b,ShadowOnlyMaterial:()=>j,SimpleMaterial:()=>q,SkyMaterial:()=>$,TerrainMaterial:()=>Z,TriPlanarMaterial:()=>ee,WaterMaterial:()=>le});var n=i(9472),s=i(3956),r=i(4649),o=i(1917),a=i(5346),l=i(580),h=i(85),c=i(708),u=i(1057),d=i(2208),p=i(8104);i(1423),i(2557),i(3756),i(6568),i(3996),i(6390),i(9519),i(5791),i(783),i(9490),i(6043),i(689);p.v.ShadersStore.cellPixelShader="precision highp float;\nuniform vec4 vEyePosition;\nuniform vec4 vDiffuseColor;\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<helperFunctions>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;\nuniform sampler2D diffuseSampler;\nuniform vec2 vDiffuseInfos;\n#endif\n#include<clipPlaneFragmentDeclaration>\n#include<fogFragmentDeclaration>\nvec3 computeCustomDiffuseLighting(lightingInfo info,vec3 diffuseBase,float shadow)\n{\ndiffuseBase=info.diffuse*shadow;\n#ifdef CELLBASIC\nfloat level=1.0;\nif (info.ndl<0.5)\nlevel=0.5;\ndiffuseBase.rgb*vec3(level,level,level);\n#else\nfloat ToonThresholds[4];\nToonThresholds[0]=0.95;\nToonThresholds[1]=0.5;\nToonThresholds[2]=0.2;\nToonThresholds[3]=0.03;\nfloat ToonBrightnessLevels[5];\nToonBrightnessLevels[0]=1.0;\nToonBrightnessLevels[1]=0.8;\nToonBrightnessLevels[2]=0.6;\nToonBrightnessLevels[3]=0.35;\nToonBrightnessLevels[4]=0.2;\nif (info.ndl>ToonThresholds[0])\n{\ndiffuseBase.rgb*=ToonBrightnessLevels[0];\n}\nelse if (info.ndl>ToonThresholds[1])\n{\ndiffuseBase.rgb*=ToonBrightnessLevels[1];\n}\nelse if (info.ndl>ToonThresholds[2])\n{\ndiffuseBase.rgb*=ToonBrightnessLevels[2];\n}\nelse if (info.ndl>ToonThresholds[3])\n{\ndiffuseBase.rgb*=ToonBrightnessLevels[3];\n}\nelse\n{\ndiffuseBase.rgb*=ToonBrightnessLevels[4];\n}\n#endif\nreturn max(diffuseBase,vec3(0.2));\n}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void)\n{\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\nvec4 baseColor=vec4(1.,1.,1.,1.);\nvec3 diffuseColor=vDiffuseColor.rgb;\nfloat alpha=vDiffuseColor.a;\n#ifdef DIFFUSE\nbaseColor=texture2D(diffuseSampler,vDiffuseUV);\n#ifdef ALPHATEST\nif (baseColor.a<0.4)\ndiscard;\n#endif\n#include<depthPrePass>\nbaseColor.rgb*=vDiffuseInfos.y;\n#endif\n#ifdef VERTEXCOLOR\nbaseColor.rgb*=vColor.rgb;\n#endif\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=vec3(1.0,1.0,1.0);\n#endif\nlightingInfo info;\nvec3 diffuseBase=vec3(0.,0.,0.);\nfloat shadow=1.;\nfloat glossiness=0.;\n#ifdef SPECULARTERM\nvec3 specularBase=vec3(0.,0.,0.);\n#endif \n#include<lightFragment>[0..maxSimultaneousLights]\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\nvec3 finalDiffuse=clamp(diffuseBase*diffuseColor,0.0,1.0)*baseColor.rgb;\nvec4 color=vec4(finalDiffuse,alpha);\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}",i(7520),i(493),i(1063),i(6343),i(9042),i(6883),i(6655),i(3206),i(5215),i(962),i(1101),i(9025);p.v.ShadersStore.cellVertexShader="precision highp float;\nattribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nuniform mat4 view;\nuniform mat4 viewProjection;\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;\nuniform mat4 diffuseMatrix;\nuniform vec2 vDiffuseInfos;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(position,1.0);\ngl_Position=viewProjection*worldPos;\nvPositionW=vec3(worldPos);\n#ifdef NORMAL\nvNormalW=normalize(vec3(finalWorld*vec4(normal,0.0)));\n#endif\n#ifndef UV1\nvec2 uv=vec2(0.,0.);\n#endif\n#ifndef UV2\nvec2 uv2=vec2(0.,0.);\n#endif\n#ifdef DIFFUSE\nif (vDiffuseInfos.x==0.)\n{\nvDiffuseUV=vec2(diffuseMatrix*vec4(uv,1.0,0.0));\n}\nelse\n{\nvDiffuseUV=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));\n}\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#include<vertexColorMixing>\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";var f=i(1434),_=i(99);class m extends o.H{constructor(){super(),this.DIFFUSE=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.POINTSIZE=!1,this.FOG=!1,this.NORMAL=!1,this.UV1=!1,this.UV2=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.INSTANCESCOLOR=!1,this.NDOTL=!0,this.CUSTOMUSERLIGHTING=!0,this.CELLBASIC=!0,this.DEPTHPREPASS=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class g extends l.a{constructor(e,t){super(e,t),this.diffuseColor=new r.Wo(1,1,1),this._computeHighLevel=!1,this._disableLighting=!1,this._maxSimultaneousLights=4}needAlphaBlending(){return this.alpha<1}needAlphaTesting(){return!1}getAlphaTestTexture(){return null}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new m);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;const r=s.getEngine();if(n._areTexturesDirty&&(n._needUVs=!1,s.texturesEnabled&&this._diffuseTexture&&h.k.DiffuseTextureEnabled)){if(!this._diffuseTexture.isReady())return!1;n._needUVs=!0,n.DIFFUSE=!0}if(n.CELLBASIC=!this.computeHighLevel,a.G.PrepareDefinesForMisc(e,s,!1,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),n),n._needNormals=a.G.PrepareDefinesForLights(s,e,n,!1,this._maxSimultaneousLights,this._disableLighting),a.G.PrepareDefinesForFrameBoundValues(s,r,this,n,!!i),a.G.PrepareDefinesForAttributes(e,n,!0,!0),n.isDirty){n.markAsProcessed(),s.resetCachedMaterial();const i=new f.L;n.FOG&&i.addFallback(1,"FOG"),a.G.HandleFallbacksForShadows(n,i,this.maxSimultaneousLights),n.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e),n.IMAGEPROCESSINGPOSTPROCESS=s.imageProcessingConfiguration.applyByPostProcess;const o=[c.o.PositionKind];n.NORMAL&&o.push(c.o.NormalKind),n.UV1&&o.push(c.o.UVKind),n.UV2&&o.push(c.o.UV2Kind),n.VERTEXCOLOR&&o.push(c.o.ColorKind),a.G.PrepareAttributesForBones(o,e,n,i),a.G.PrepareAttributesForInstances(o,n);const l="cell",h=n.toString(),u=["world","view","viewProjection","vEyePosition","vLightsType","vDiffuseColor","vFogInfos","vFogColor","pointSize","vDiffuseInfos","mBones","diffuseMatrix"],d=["diffuseSampler"],p=new Array;(0,_.qx)(u),a.G.PrepareUniformsAndSamplersList({uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:n,maxSimultaneousLights:this.maxSimultaneousLights}),t.setEffect(s.getEngine().createEffect(l,{attributes:o,uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:h,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:this.maxSimultaneousLights-1}},r),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;r&&(this._activeEffect=r,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,this._activeEffect),this._mustRebind(n,r)&&(this._diffuseTexture&&h.k.DiffuseTextureEnabled&&(this._activeEffect.setTexture("diffuseSampler",this._diffuseTexture),this._activeEffect.setFloat2("vDiffuseInfos",this._diffuseTexture.coordinatesIndex,this._diffuseTexture.level),this._activeEffect.setMatrix("diffuseMatrix",this._diffuseTexture.getTextureMatrix())),(0,_.an)(this._activeEffect,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),n.bindEyePosition(r)),this._activeEffect.setColor4("vDiffuseColor",this.diffuseColor,this.alpha*t.visibility),n.lightsEnabled&&!this.disableLighting&&a.G.BindLights(n,t,this._activeEffect,s,this._maxSimultaneousLights),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),this._afterBind(t,this._activeEffect))}getAnimatables(){const e=[];return this._diffuseTexture&&this._diffuseTexture.animations&&this._diffuseTexture.animations.length>0&&e.push(this._diffuseTexture),e}getActiveTextures(){const e=super.getActiveTextures();return this._diffuseTexture&&e.push(this._diffuseTexture),e}hasTexture(e){return!!super.hasTexture(e)||this._diffuseTexture===e}dispose(e){this._diffuseTexture&&this._diffuseTexture.dispose(),super.dispose(e)}getClassName(){return"CellMaterial"}clone(e){return s.p4.Clone((()=>new g(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.CellMaterial",e}static Parse(e,t,i){return s.p4.Parse((()=>new g(e.name,t)),e,t,i)}}(0,n.gn)([(0,s.oU)("diffuseTexture")],g.prototype,"_diffuseTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],g.prototype,"diffuseTexture",void 0),(0,n.gn)([(0,s.n9)("diffuse")],g.prototype,"diffuseColor",void 0),(0,n.gn)([(0,s.qC)("computeHighLevel")],g.prototype,"_computeHighLevel",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],g.prototype,"computeHighLevel",void 0),(0,n.gn)([(0,s.qC)("disableLighting")],g.prototype,"_disableLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],g.prototype,"disableLighting",void 0),(0,n.gn)([(0,s.qC)("maxSimultaneousLights")],g.prototype,"_maxSimultaneousLights",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],g.prototype,"maxSimultaneousLights",void 0),(0,d.H)("BABYLON.CellMaterial",g);var v=i(1979),y=i(252);class x{constructor(){}}class b{constructor(){}}class T extends y.K{AttachAfterBind(e,t){if(this._newUniformInstances)for(const e in this._newUniformInstances){const i=e.toString().split("-");"vec2"==i[0]?t.setVector2(i[1],this._newUniformInstances[e]):"vec3"==i[0]?t.setVector3(i[1],this._newUniformInstances[e]):"vec4"==i[0]?t.setVector4(i[1],this._newUniformInstances[e]):"mat4"==i[0]?t.setMatrix(i[1],this._newUniformInstances[e]):"float"==i[0]&&t.setFloat(i[1],this._newUniformInstances[e])}if(this._newSamplerInstances)for(const e in this._newSamplerInstances){const i=e.toString().split("-");"sampler2D"==i[0]&&this._newSamplerInstances[e].isReady&&this._newSamplerInstances[e].isReady()&&t.setTexture(i[1],this._newSamplerInstances[e])}}ReviewUniform(e,t){if("uniform"==e&&this._newUniforms)for(let e=0;e<this._newUniforms.length;e++)-1==this._customUniform[e].indexOf("sampler")&&t.push(this._newUniforms[e].replace(/\[\d*\]/g,""));if("sampler"==e&&this._newUniforms)for(let e=0;e<this._newUniforms.length;e++)-1!=this._customUniform[e].indexOf("sampler")&&t.push(this._newUniforms[e].replace(/\[\d*\]/g,""));return t}Builder(e,t,i,n,s,r){if(r&&this._customAttributes&&this._customAttributes.length>0&&r.push(...this._customAttributes),this.ReviewUniform("uniform",t),this.ReviewUniform("sampler",n),this._isCreatedShader)return this._createdShaderName;this._isCreatedShader=!1,T.ShaderIndexer++;const o="custom_"+T.ShaderIndexer,a=this._afterBind.bind(this);return this._afterBind=(e,t)=>{if(t){this.AttachAfterBind(e,t);try{a(e,t)}catch(t){}}},v.Q.ShadersStore[o+"VertexShader"]=this.VertexShader.replace("#define CUSTOM_VERTEX_BEGIN",this.CustomParts.Vertex_Begin?this.CustomParts.Vertex_Begin:"").replace("#define CUSTOM_VERTEX_DEFINITIONS",(this._customUniform?this._customUniform.join("\n"):"")+(this.CustomParts.Vertex_Definitions?this.CustomParts.Vertex_Definitions:"")).replace("#define CUSTOM_VERTEX_MAIN_BEGIN",this.CustomParts.Vertex_MainBegin?this.CustomParts.Vertex_MainBegin:"").replace("#define CUSTOM_VERTEX_UPDATE_POSITION",this.CustomParts.Vertex_Before_PositionUpdated?this.CustomParts.Vertex_Before_PositionUpdated:"").replace("#define CUSTOM_VERTEX_UPDATE_NORMAL",this.CustomParts.Vertex_Before_NormalUpdated?this.CustomParts.Vertex_Before_NormalUpdated:"").replace("#define CUSTOM_VERTEX_MAIN_END",this.CustomParts.Vertex_MainEnd?this.CustomParts.Vertex_MainEnd:""),this.CustomParts.Vertex_After_WorldPosComputed&&(v.Q.ShadersStore[o+"VertexShader"]=v.Q.ShadersStore[o+"VertexShader"].replace("#define CUSTOM_VERTEX_UPDATE_WORLDPOS",this.CustomParts.Vertex_After_WorldPosComputed)),v.Q.ShadersStore[o+"PixelShader"]=this.FragmentShader.replace("#define CUSTOM_FRAGMENT_BEGIN",this.CustomParts.Fragment_Begin?this.CustomParts.Fragment_Begin:"").replace("#define CUSTOM_FRAGMENT_MAIN_BEGIN",this.CustomParts.Fragment_MainBegin?this.CustomParts.Fragment_MainBegin:"").replace("#define CUSTOM_FRAGMENT_DEFINITIONS",(this._customUniform?this._customUniform.join("\n"):"")+(this.CustomParts.Fragment_Definitions?this.CustomParts.Fragment_Definitions:"")).replace("#define CUSTOM_FRAGMENT_UPDATE_DIFFUSE",this.CustomParts.Fragment_Custom_Diffuse?this.CustomParts.Fragment_Custom_Diffuse:"").replace("#define CUSTOM_FRAGMENT_UPDATE_ALPHA",this.CustomParts.Fragment_Custom_Alpha?this.CustomParts.Fragment_Custom_Alpha:"").replace("#define CUSTOM_FRAGMENT_BEFORE_LIGHTS",this.CustomParts.Fragment_Before_Lights?this.CustomParts.Fragment_Before_Lights:"").replace("#define CUSTOM_FRAGMENT_BEFORE_FRAGCOLOR",this.CustomParts.Fragment_Before_FragColor?this.CustomParts.Fragment_Before_FragColor:"").replace("#define CUSTOM_FRAGMENT_MAIN_END",this.CustomParts.Fragment_MainEnd?this.CustomParts.Fragment_MainEnd:""),this.CustomParts.Fragment_Before_Fog&&(v.Q.ShadersStore[o+"PixelShader"]=v.Q.ShadersStore[o+"PixelShader"].replace("#define CUSTOM_FRAGMENT_BEFORE_FOG",this.CustomParts.Fragment_Before_Fog)),this._isCreatedShader=!0,this._createdShaderName=o,o}constructor(e,t){super(e,t),this.CustomParts=new b,this.customShaderNameResolve=this.Builder,this.FragmentShader=v.Q.ShadersStore.defaultPixelShader,this.VertexShader=v.Q.ShadersStore.defaultVertexShader}AddUniform(e,t,i){return this._customUniform||(this._customUniform=new Array,this._newUniforms=new Array,this._newSamplerInstances={},this._newUniformInstances={}),i&&(-1!=t.indexOf("sampler")?this._newSamplerInstances[t+"-"+e]=i:this._newUniformInstances[t+"-"+e]=i),this._customUniform.push("uniform "+t+" "+e+";"),this._newUniforms.push(e),this}AddAttribute(e){return this._customAttributes||(this._customAttributes=[]),this._customAttributes.push(e),this}Fragment_Begin(e){return this.CustomParts.Fragment_Begin=e,this}Fragment_Definitions(e){return this.CustomParts.Fragment_Definitions=e,this}Fragment_MainBegin(e){return this.CustomParts.Fragment_MainBegin=e,this}Fragment_MainEnd(e){return this.CustomParts.Fragment_MainEnd=e,this}Fragment_Custom_Diffuse(e){return this.CustomParts.Fragment_Custom_Diffuse=e.replace("result","diffuseColor"),this}Fragment_Custom_Alpha(e){return this.CustomParts.Fragment_Custom_Alpha=e.replace("result","alpha"),this}Fragment_Before_Lights(e){return this.CustomParts.Fragment_Before_Lights=e,this}Fragment_Before_Fog(e){return this.CustomParts.Fragment_Before_Fog=e,this}Fragment_Before_FragColor(e){return this.CustomParts.Fragment_Before_FragColor=e.replace("result","color"),this}Vertex_Begin(e){return this.CustomParts.Vertex_Begin=e,this}Vertex_Definitions(e){return this.CustomParts.Vertex_Definitions=e,this}Vertex_MainBegin(e){return this.CustomParts.Vertex_MainBegin=e,this}Vertex_Before_PositionUpdated(e){return this.CustomParts.Vertex_Before_PositionUpdated=e.replace("result","positionUpdated"),this}Vertex_Before_NormalUpdated(e){return this.CustomParts.Vertex_Before_NormalUpdated=e.replace("result","normalUpdated"),this}Vertex_After_WorldPosComputed(e){return this.CustomParts.Vertex_After_WorldPosComputed=e,this}Vertex_MainEnd(e){return this.CustomParts.Vertex_MainEnd=e,this}}T.ShaderIndexer=1,(0,d.H)("BABYLON.CustomMaterial",T);var S=i(9500),E=i(6430);class C{constructor(){}}class A extends S.Y{AttachAfterBind(e,t){if(this._newUniformInstances)for(const e in this._newUniformInstances){const i=e.toString().split("-");"vec2"==i[0]?t.setVector2(i[1],this._newUniformInstances[e]):"vec3"==i[0]?t.setVector3(i[1],this._newUniformInstances[e]):"vec4"==i[0]?t.setVector4(i[1],this._newUniformInstances[e]):"mat4"==i[0]?t.setMatrix(i[1],this._newUniformInstances[e]):"float"==i[0]&&t.setFloat(i[1],this._newUniformInstances[e])}if(this._newSamplerInstances)for(const e in this._newSamplerInstances){const i=e.toString().split("-");"sampler2D"==i[0]&&this._newSamplerInstances[e].isReady&&this._newSamplerInstances[e].isReady()&&t.setTexture(i[1],this._newSamplerInstances[e])}}ReviewUniform(e,t){if("uniform"==e&&this._newUniforms)for(let e=0;e<this._newUniforms.length;e++)-1==this._customUniform[e].indexOf("sampler")&&t.push(this._newUniforms[e].replace(/\[\d*\]/g,""));if("sampler"==e&&this._newUniforms)for(let e=0;e<this._newUniforms.length;e++)-1!=this._customUniform[e].indexOf("sampler")&&t.push(this._newUniforms[e].replace(/\[\d*\]/g,""));return t}Builder(e,t,i,n,s,r,o){if(o){const e=o.processFinalCode;o.processFinalCode=(t,i)=>{if("vertex"===t)return e?e(t,i):i;const n=new E.Z(i);return n.inlineToken="#define pbr_inline",n.processCode(),e?e(t,n.code):n.code}}if(r&&this._customAttributes&&this._customAttributes.length>0&&r.push(...this._customAttributes),this.ReviewUniform("uniform",t),this.ReviewUniform("sampler",n),this._isCreatedShader)return this._createdShaderName;this._isCreatedShader=!1,A.ShaderIndexer++;const a="custom_"+A.ShaderIndexer,l=this._afterBind.bind(this);return this._afterBind=(e,t)=>{if(t){this.AttachAfterBind(e,t);try{l(e,t)}catch(t){}}},v.Q.ShadersStore[a+"VertexShader"]=this.VertexShader.replace("#define CUSTOM_VERTEX_BEGIN",this.CustomParts.Vertex_Begin?this.CustomParts.Vertex_Begin:"").replace("#define CUSTOM_VERTEX_DEFINITIONS",(this._customUniform?this._customUniform.join("\n"):"")+(this.CustomParts.Vertex_Definitions?this.CustomParts.Vertex_Definitions:"")).replace("#define CUSTOM_VERTEX_MAIN_BEGIN",this.CustomParts.Vertex_MainBegin?this.CustomParts.Vertex_MainBegin:"").replace("#define CUSTOM_VERTEX_UPDATE_POSITION",this.CustomParts.Vertex_Before_PositionUpdated?this.CustomParts.Vertex_Before_PositionUpdated:"").replace("#define CUSTOM_VERTEX_UPDATE_NORMAL",this.CustomParts.Vertex_Before_NormalUpdated?this.CustomParts.Vertex_Before_NormalUpdated:"").replace("#define CUSTOM_VERTEX_MAIN_END",this.CustomParts.Vertex_MainEnd?this.CustomParts.Vertex_MainEnd:""),this.CustomParts.Vertex_After_WorldPosComputed&&(v.Q.ShadersStore[a+"VertexShader"]=v.Q.ShadersStore[a+"VertexShader"].replace("#define CUSTOM_VERTEX_UPDATE_WORLDPOS",this.CustomParts.Vertex_After_WorldPosComputed)),v.Q.ShadersStore[a+"PixelShader"]=this.FragmentShader.replace("#define CUSTOM_FRAGMENT_BEGIN",this.CustomParts.Fragment_Begin?this.CustomParts.Fragment_Begin:"").replace("#define CUSTOM_FRAGMENT_MAIN_BEGIN",this.CustomParts.Fragment_MainBegin?this.CustomParts.Fragment_MainBegin:"").replace("#define CUSTOM_FRAGMENT_DEFINITIONS",(this._customUniform?this._customUniform.join("\n"):"")+(this.CustomParts.Fragment_Definitions?this.CustomParts.Fragment_Definitions:"")).replace("#define CUSTOM_FRAGMENT_UPDATE_ALBEDO",this.CustomParts.Fragment_Custom_Albedo?this.CustomParts.Fragment_Custom_Albedo:"").replace("#define CUSTOM_FRAGMENT_UPDATE_ALPHA",this.CustomParts.Fragment_Custom_Alpha?this.CustomParts.Fragment_Custom_Alpha:"").replace("#define CUSTOM_FRAGMENT_BEFORE_LIGHTS",this.CustomParts.Fragment_Before_Lights?this.CustomParts.Fragment_Before_Lights:"").replace("#define CUSTOM_FRAGMENT_UPDATE_METALLICROUGHNESS",this.CustomParts.Fragment_Custom_MetallicRoughness?this.CustomParts.Fragment_Custom_MetallicRoughness:"").replace("#define CUSTOM_FRAGMENT_UPDATE_MICROSURFACE",this.CustomParts.Fragment_Custom_MicroSurface?this.CustomParts.Fragment_Custom_MicroSurface:"").replace("#define CUSTOM_FRAGMENT_BEFORE_FINALCOLORCOMPOSITION",this.CustomParts.Fragment_Before_FinalColorComposition?this.CustomParts.Fragment_Before_FinalColorComposition:"").replace("#define CUSTOM_FRAGMENT_BEFORE_FRAGCOLOR",this.CustomParts.Fragment_Before_FragColor?this.CustomParts.Fragment_Before_FragColor:"").replace("#define CUSTOM_FRAGMENT_MAIN_END",this.CustomParts.Fragment_MainEnd?this.CustomParts.Fragment_MainEnd:""),this.CustomParts.Fragment_Before_Fog&&(v.Q.ShadersStore[a+"PixelShader"]=v.Q.ShadersStore[a+"PixelShader"].replace("#define CUSTOM_FRAGMENT_BEFORE_FOG",this.CustomParts.Fragment_Before_Fog)),this._isCreatedShader=!0,this._createdShaderName=a,a}constructor(e,t){super(e,t),this.CustomParts=new C,this.customShaderNameResolve=this.Builder,this.FragmentShader=v.Q.ShadersStore.pbrPixelShader,this.VertexShader=v.Q.ShadersStore.pbrVertexShader,this.FragmentShader=this.FragmentShader.replace(/#include<pbrBlockAlbedoOpacity>/g,v.Q.IncludesShadersStore.pbrBlockAlbedoOpacity),this.FragmentShader=this.FragmentShader.replace(/#include<pbrBlockReflectivity>/g,v.Q.IncludesShadersStore.pbrBlockReflectivity),this.FragmentShader=this.FragmentShader.replace(/#include<pbrBlockFinalColorComposition>/g,v.Q.IncludesShadersStore.pbrBlockFinalColorComposition)}AddUniform(e,t,i){return this._customUniform||(this._customUniform=new Array,this._newUniforms=new Array,this._newSamplerInstances={},this._newUniformInstances={}),i&&(-1!=t.indexOf("sampler")?this._newSamplerInstances[t+"-"+e]=i:this._newUniformInstances[t+"-"+e]=i),this._customUniform.push("uniform "+t+" "+e+";"),this._newUniforms.push(e),this}AddAttribute(e){return this._customAttributes||(this._customAttributes=[]),this._customAttributes.push(e),this}Fragment_Begin(e){return this.CustomParts.Fragment_Begin=e,this}Fragment_Definitions(e){return this.CustomParts.Fragment_Definitions=e,this}Fragment_MainBegin(e){return this.CustomParts.Fragment_MainBegin=e,this}Fragment_Custom_Albedo(e){return this.CustomParts.Fragment_Custom_Albedo=e.replace("result","surfaceAlbedo"),this}Fragment_Custom_Alpha(e){return this.CustomParts.Fragment_Custom_Alpha=e.replace("result","alpha"),this}Fragment_Before_Lights(e){return this.CustomParts.Fragment_Before_Lights=e,this}Fragment_Custom_MetallicRoughness(e){return this.CustomParts.Fragment_Custom_MetallicRoughness=e,this}Fragment_Custom_MicroSurface(e){return this.CustomParts.Fragment_Custom_MicroSurface=e,this}Fragment_Before_Fog(e){return this.CustomParts.Fragment_Before_Fog=e,this}Fragment_Before_FinalColorComposition(e){return this.CustomParts.Fragment_Before_FinalColorComposition=e,this}Fragment_Before_FragColor(e){return this.CustomParts.Fragment_Before_FragColor=e.replace("result","color"),this}Fragment_MainEnd(e){return this.CustomParts.Fragment_MainEnd=e,this}Vertex_Begin(e){return this.CustomParts.Vertex_Begin=e,this}Vertex_Definitions(e){return this.CustomParts.Vertex_Definitions=e,this}Vertex_MainBegin(e){return this.CustomParts.Vertex_MainBegin=e,this}Vertex_Before_PositionUpdated(e){return this.CustomParts.Vertex_Before_PositionUpdated=e.replace("result","positionUpdated"),this}Vertex_Before_NormalUpdated(e){return this.CustomParts.Vertex_Before_NormalUpdated=e.replace("result","normalUpdated"),this}Vertex_After_WorldPosComputed(e){return this.CustomParts.Vertex_After_WorldPosComputed=e,this}Vertex_MainEnd(e){return this.CustomParts.Vertex_MainEnd=e,this}}A.ShaderIndexer=1,(0,d.H)("BABYLON.PBRCustomMaterial",A);var P=i(4875),R=i(2262);p.v.ShadersStore.firePixelShader="precision highp float;uniform vec4 vEyePosition;varying vec3 vPositionW;\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;uniform sampler2D diffuseSampler;uniform vec2 vDiffuseInfos;\n#endif\nuniform sampler2D distortionSampler;uniform sampler2D opacitySampler;\n#ifdef DIFFUSE\nvarying vec2 vDistortionCoords1;varying vec2 vDistortionCoords2;varying vec2 vDistortionCoords3;\n#endif\n#include<clipPlaneFragmentDeclaration>\n#include<fogFragmentDeclaration>\nvec4 bx2(vec4 x)\n{return vec4(2.0)*x-vec4(1.0);}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);vec4 baseColor=vec4(1.,1.,1.,1.);float alpha=1.0;\n#ifdef DIFFUSE\nconst float distortionAmount0 =0.092;const float distortionAmount1 =0.092;const float distortionAmount2 =0.092;vec2 heightAttenuation=vec2(0.3,0.39);vec4 noise0=texture2D(distortionSampler,vDistortionCoords1);vec4 noise1=texture2D(distortionSampler,vDistortionCoords2);vec4 noise2=texture2D(distortionSampler,vDistortionCoords3);vec4 noiseSum=bx2(noise0)*distortionAmount0+bx2(noise1)*distortionAmount1+bx2(noise2)*distortionAmount2;vec4 perturbedBaseCoords=vec4(vDiffuseUV,0.0,1.0)+noiseSum*(vDiffuseUV.y*heightAttenuation.x+heightAttenuation.y);vec4 opacityColor=texture2D(opacitySampler,perturbedBaseCoords.xy);\n#ifdef ALPHATEST\nif (opacityColor.r<0.1)\ndiscard;\n#endif\n#include<depthPrePass>\nbaseColor=texture2D(diffuseSampler,perturbedBaseCoords.xy)*2.0;baseColor*=opacityColor;baseColor.rgb*=vDiffuseInfos.y;\n#endif\n#ifdef VERTEXCOLOR\nbaseColor.rgb*=vColor.rgb;\n#endif\nvec3 diffuseBase=vec3(1.0,1.0,1.0);\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\nvec4 color=vec4(baseColor.rgb,alpha);\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}";p.v.ShadersStore.fireVertexShader="precision highp float;attribute vec3 position;\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nuniform mat4 view;uniform mat4 viewProjection;\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\nuniform float time;uniform float speed;\n#ifdef DIFFUSE\nvarying vec2 vDistortionCoords1;varying vec2 vDistortionCoords2;varying vec2 vDistortionCoords3;\n#endif\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(position,1.0);gl_Position=viewProjection*worldPos;vPositionW=vec3(worldPos);\n#ifdef DIFFUSE\nvDiffuseUV=uv;vDiffuseUV.y-=0.2;\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<vertexColorMixing>\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#ifdef DIFFUSE\nvec3 layerSpeed=vec3(-0.2,-0.52,-0.1)*speed;vDistortionCoords1.x=uv.x;vDistortionCoords1.y=uv.y+layerSpeed.x*time/1000.0;vDistortionCoords2.x=uv.x;vDistortionCoords2.y=uv.y+layerSpeed.y*time/1000.0;vDistortionCoords3.x=uv.x;vDistortionCoords3.y=uv.y+layerSpeed.z*time/1000.0;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";class M extends o.H{constructor(){super(),this.DIFFUSE=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.POINTSIZE=!1,this.FOG=!1,this.UV1=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.BonesPerMesh=0,this.NUM_BONE_INFLUENCERS=0,this.INSTANCES=!1,this.INSTANCESCOLOR=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class I extends l.a{constructor(e,t){super(e,t),this.diffuseColor=new r.Wo(1,1,1),this.speed=1,this._scaledDiffuse=new r.Wo,this._lastTime=0}needAlphaBlending(){return!1}needAlphaTesting(){return!0}getAlphaTestTexture(){return null}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new M);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;const r=s.getEngine();if(n._areTexturesDirty&&(n._needUVs=!1,this._diffuseTexture&&h.k.DiffuseTextureEnabled)){if(!this._diffuseTexture.isReady())return!1;n._needUVs=!0,n.DIFFUSE=!0}if(n.ALPHATEST=!!this._opacityTexture,n._areMiscDirty&&(n.POINTSIZE=this.pointsCloud||s.forcePointsCloud,n.FOG=s.fogEnabled&&e.applyFog&&s.fogMode!==u.x.FOGMODE_NONE&&this.fogEnabled),a.G.PrepareDefinesForFrameBoundValues(s,r,this,n,!!i),a.G.PrepareDefinesForAttributes(e,n,!1,!0),n.isDirty){n.markAsProcessed(),s.resetCachedMaterial();const i=new f.L;n.FOG&&i.addFallback(1,"FOG"),n.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e),n.IMAGEPROCESSINGPOSTPROCESS=s.imageProcessingConfiguration.applyByPostProcess;const o=[c.o.PositionKind];n.UV1&&o.push(c.o.UVKind),n.VERTEXCOLOR&&o.push(c.o.ColorKind),a.G.PrepareAttributesForBones(o,e,n,i),a.G.PrepareAttributesForInstances(o,n);const l="fire",h=["world","view","viewProjection","vEyePosition","vFogInfos","vFogColor","pointSize","vDiffuseInfos","mBones","diffuseMatrix","time","speed"];(0,_.qx)(h);const u=n.toString();t.setEffect(s.getEngine().createEffect(l,{attributes:o,uniformsNames:h,uniformBuffersNames:[],samplers:["diffuseSampler","distortionSampler","opacitySampler"],defines:u,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:null,maxSimultaneousLights:4,transformFeedbackVaryings:null},r),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene();if(!i.materialDefines)return;const s=i.effect;s&&(this._activeEffect=s,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,this._activeEffect),this._mustRebind(n,s)&&(this._diffuseTexture&&h.k.DiffuseTextureEnabled&&(this._activeEffect.setTexture("diffuseSampler",this._diffuseTexture),this._activeEffect.setFloat2("vDiffuseInfos",this._diffuseTexture.coordinatesIndex,this._diffuseTexture.level),this._activeEffect.setMatrix("diffuseMatrix",this._diffuseTexture.getTextureMatrix()),this._activeEffect.setTexture("distortionSampler",this._distortionTexture),this._activeEffect.setTexture("opacitySampler",this._opacityTexture)),(0,_.an)(this._activeEffect,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),n.bindEyePosition(s)),this._activeEffect.setColor4("vDiffuseColor",this._scaledDiffuse,this.alpha*t.visibility),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),this._lastTime+=n.getEngine().getDeltaTime(),this._activeEffect.setFloat("time",this._lastTime),this._activeEffect.setFloat("speed",this.speed),this._afterBind(t,this._activeEffect))}getAnimatables(){const e=[];return this._diffuseTexture&&this._diffuseTexture.animations&&this._diffuseTexture.animations.length>0&&e.push(this._diffuseTexture),this._distortionTexture&&this._distortionTexture.animations&&this._distortionTexture.animations.length>0&&e.push(this._distortionTexture),this._opacityTexture&&this._opacityTexture.animations&&this._opacityTexture.animations.length>0&&e.push(this._opacityTexture),e}getActiveTextures(){const e=super.getActiveTextures();return this._diffuseTexture&&e.push(this._diffuseTexture),this._distortionTexture&&e.push(this._distortionTexture),this._opacityTexture&&e.push(this._opacityTexture),e}hasTexture(e){return!!super.hasTexture(e)||this._diffuseTexture===e||this._distortionTexture===e||this._opacityTexture===e}getClassName(){return"FireMaterial"}dispose(e){this._diffuseTexture&&this._diffuseTexture.dispose(),this._distortionTexture&&this._distortionTexture.dispose(),super.dispose(e)}clone(e){return s.p4.Clone((()=>new I(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.FireMaterial",e.diffuseColor=this.diffuseColor.asArray(),e.speed=this.speed,this._diffuseTexture&&(e._diffuseTexture=this._diffuseTexture.serialize()),this._distortionTexture&&(e._distortionTexture=this._distortionTexture.serialize()),this._opacityTexture&&(e._opacityTexture=this._opacityTexture.serialize()),e}static Parse(e,t,i){const n=new I(e.name,t);return n.diffuseColor=r.Wo.FromArray(e.diffuseColor),n.speed=e.speed,n.alpha=e.alpha,n.id=e.id,P.$.AddTagsTo(n,e.tags),n.backFaceCulling=e.backFaceCulling,n.wireframe=e.wireframe,e._diffuseTexture&&(n._diffuseTexture=R.x.Parse(e._diffuseTexture,t,i)),e._distortionTexture&&(n._distortionTexture=R.x.Parse(e._distortionTexture,t,i)),e._opacityTexture&&(n._opacityTexture=R.x.Parse(e._opacityTexture,t,i)),n}}(0,n.gn)([(0,s.oU)("diffuseTexture")],I.prototype,"_diffuseTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],I.prototype,"diffuseTexture",void 0),(0,n.gn)([(0,s.oU)("distortionTexture")],I.prototype,"_distortionTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],I.prototype,"distortionTexture",void 0),(0,n.gn)([(0,s.oU)("opacityTexture")],I.prototype,"_opacityTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],I.prototype,"opacityTexture",void 0),(0,n.gn)([(0,s.n9)("diffuse")],I.prototype,"diffuseColor",void 0),(0,n.gn)([(0,s.qC)()],I.prototype,"speed",void 0),(0,d.H)("BABYLON.FireMaterial",I);var D=i(4141),O=i(4160);p.v.ShadersStore.furPixelShader="precision highp float;uniform vec4 vEyePosition;uniform vec4 vDiffuseColor;uniform vec4 furColor;uniform float furLength;varying vec3 vPositionW;varying float vfur_length;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<helperFunctions>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;uniform sampler2D diffuseSampler;uniform vec2 vDiffuseInfos;\n#endif\n#ifdef HIGHLEVEL\nuniform float furOffset;uniform float furOcclusion;uniform sampler2D furTexture;varying vec2 vFurUV;\n#endif\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#include<fogFragmentDeclaration>\n#include<clipPlaneFragmentDeclaration>\nfloat Rand(vec3 rv) {float x=dot(rv,vec3(12.9898,78.233,24.65487));return fract(sin(x)*43758.5453);}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);vec4 baseColor=furColor;vec3 diffuseColor=vDiffuseColor.rgb;float alpha=vDiffuseColor.a;\n#ifdef DIFFUSE\nbaseColor*=texture2D(diffuseSampler,vDiffuseUV);\n#ifdef ALPHATEST\nif (baseColor.a<0.4)\ndiscard;\n#endif\n#include<depthPrePass>\nbaseColor.rgb*=vDiffuseInfos.y;\n#endif\n#ifdef VERTEXCOLOR\nbaseColor.rgb*=vColor.rgb;\n#endif\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=vec3(1.0,1.0,1.0);\n#endif\n#ifdef HIGHLEVEL\nvec4 furTextureColor=texture2D(furTexture,vec2(vFurUV.x,vFurUV.y));if (furTextureColor.a<=0.0 || furTextureColor.g<furOffset) {discard;}\nfloat occlusion=mix(0.0,furTextureColor.b*1.2,furOffset);baseColor=vec4(baseColor.xyz*max(occlusion,furOcclusion),1.1-furOffset);\n#endif\nvec3 diffuseBase=vec3(0.,0.,0.);lightingInfo info;float shadow=1.;float glossiness=0.;\n#ifdef SPECULARTERM\nvec3 specularBase=vec3(0.,0.,0.);\n#endif\n#include<lightFragment>[0..maxSimultaneousLights]\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\nvec3 finalDiffuse=clamp(diffuseBase.rgb*baseColor.rgb,0.0,1.0);\n#ifdef HIGHLEVEL\nvec4 color=vec4(finalDiffuse,alpha);\n#else\nfloat r=vfur_length/furLength*0.5;vec4 color=vec4(finalDiffuse*(0.5+r),alpha);\n#endif\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}";p.v.ShadersStore.furVertexShader="precision highp float;attribute vec3 position;attribute vec3 normal;\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\nuniform float furLength;uniform float furAngle;\n#ifdef HIGHLEVEL\nuniform float furOffset;uniform vec3 furGravity;uniform float furTime;uniform float furSpacing;uniform float furDensity;\n#endif\n#ifdef HEIGHTMAP\nuniform sampler2D heightTexture;\n#endif\n#ifdef HIGHLEVEL\nvarying vec2 vFurUV;\n#endif\n#include<instancesDeclaration>\nuniform mat4 view;uniform mat4 viewProjection;\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;uniform mat4 diffuseMatrix;uniform vec2 vDiffuseInfos;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\nvarying float vfur_length;\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\nfloat Rand(vec3 rv) {float x=dot(rv,vec3(12.9898,78.233,24.65487));return fract(sin(x)*43758.5453);}\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nfloat r=Rand(position);\n#ifdef HEIGHTMAP\n#if __VERSION__>100\nvfur_length=furLength*texture(heightTexture,uv).x;\n#else\nvfur_length=furLength*texture2D(heightTexture,uv).r;\n#endif\n#else \nvfur_length=(furLength*r);\n#endif\nvec3 tangent1=vec3(normal.y,-normal.x,0);vec3 tangent2=vec3(-normal.z,0,normal.x);r=Rand(tangent1*r);float J=(2.0+4.0*r);r=Rand(tangent2*r);float K=(2.0+2.0*r);tangent1=tangent1*J+tangent2*K;tangent1=normalize(tangent1);vec3 newPosition=position+normal*vfur_length*cos(furAngle)+tangent1*vfur_length*sin(furAngle);\n#ifdef HIGHLEVEL\nvec3 forceDirection=vec3(0.0,0.0,0.0);forceDirection.x=sin(furTime+position.x*0.05)*0.2;forceDirection.y=cos(furTime*0.7+position.y*0.04)*0.2;forceDirection.z=sin(furTime*0.7+position.z*0.04)*0.2;vec3 displacement=vec3(0.0,0.0,0.0);displacement=furGravity+forceDirection;float displacementFactor=pow(furOffset,3.0);vec3 aNormal=normal;aNormal.xyz+=displacement*displacementFactor;newPosition=vec3(newPosition.x,newPosition.y,newPosition.z)+(normalize(aNormal)*furOffset*furSpacing);\n#endif\n#ifdef NORMAL\nvNormalW=normalize(vec3(finalWorld*vec4(normal,0.0)));\n#endif\ngl_Position=viewProjection*finalWorld*vec4(newPosition,1.0);vec4 worldPos=finalWorld*vec4(newPosition,1.0);vPositionW=vec3(worldPos);\n#ifndef UV1\nvec2 uv=vec2(0.,0.);\n#endif\n#ifndef UV2\nvec2 uv2=vec2(0.,0.);\n#endif\n#ifdef DIFFUSE\nif (vDiffuseInfos.x==0.)\n{vDiffuseUV=vec2(diffuseMatrix*vec4(uv,1.0,0.0));}\nelse\n{vDiffuseUV=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));}\n#ifdef HIGHLEVEL\nvFurUV=vDiffuseUV*furDensity;\n#endif\n#else\n#ifdef HIGHLEVEL\nvFurUV=uv*furDensity;\n#endif\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#include<vertexColorMixing>\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";class w extends o.H{constructor(){super(),this.DIFFUSE=!1,this.HEIGHTMAP=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.POINTSIZE=!1,this.FOG=!1,this.NORMAL=!1,this.UV1=!1,this.UV2=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.INSTANCESCOLOR=!1,this.HIGHLEVEL=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class N extends l.a{constructor(e,t){super(e,t),this.diffuseColor=new r.Wo(1,1,1),this.furLength=1,this.furAngle=0,this.furColor=new r.Wo(.44,.21,.02),this.furOffset=0,this.furSpacing=12,this.furGravity=new D.P(0,0,0),this.furSpeed=100,this.furDensity=20,this.furOcclusion=0,this._disableLighting=!1,this._maxSimultaneousLights=4,this.highLevelFur=!0,this._furTime=0}get furTime(){return this._furTime}set furTime(e){this._furTime=e}needAlphaBlending(){return this.alpha<1}needAlphaTesting(){return!1}getAlphaTestTexture(){return null}updateFur(){for(let e=1;e<this._meshes.length;e++){const t=this._meshes[e].material;t.furLength=this.furLength,t.furAngle=this.furAngle,t.furGravity=this.furGravity,t.furSpacing=this.furSpacing,t.furSpeed=this.furSpeed,t.furColor=this.furColor,t.diffuseTexture=this.diffuseTexture,t.furTexture=this.furTexture,t.highLevelFur=this.highLevelFur,t.furTime=this.furTime,t.furDensity=this.furDensity}}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new w);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;const r=s.getEngine();if(n._areTexturesDirty&&s.texturesEnabled){if(this.diffuseTexture&&h.k.DiffuseTextureEnabled){if(!this.diffuseTexture.isReady())return!1;n._needUVs=!0,n.DIFFUSE=!0}if(this.heightTexture&&r.getCaps().maxVertexTextureImageUnits){if(!this.heightTexture.isReady())return!1;n._needUVs=!0,n.HEIGHTMAP=!0}}if(this.highLevelFur!==n.HIGHLEVEL&&(n.HIGHLEVEL=!0,n.markAsUnprocessed()),a.G.PrepareDefinesForMisc(e,s,!1,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),n),n._needNormals=a.G.PrepareDefinesForLights(s,e,n,!1,this._maxSimultaneousLights,this._disableLighting),a.G.PrepareDefinesForFrameBoundValues(s,r,this,n,!!i),a.G.PrepareDefinesForAttributes(e,n,!0,!0),n.isDirty){n.markAsProcessed(),s.resetCachedMaterial();const i=new f.L;n.FOG&&i.addFallback(1,"FOG"),a.G.HandleFallbacksForShadows(n,i,this.maxSimultaneousLights),n.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e),n.IMAGEPROCESSINGPOSTPROCESS=s.imageProcessingConfiguration.applyByPostProcess;const o=[c.o.PositionKind];n.NORMAL&&o.push(c.o.NormalKind),n.UV1&&o.push(c.o.UVKind),n.UV2&&o.push(c.o.UV2Kind),n.VERTEXCOLOR&&o.push(c.o.ColorKind),a.G.PrepareAttributesForBones(o,e,n,i),a.G.PrepareAttributesForInstances(o,n);const l="fur",h=n.toString(),u=["world","view","viewProjection","vEyePosition","vLightsType","vDiffuseColor","vFogInfos","vFogColor","pointSize","vDiffuseInfos","mBones","diffuseMatrix","furLength","furAngle","furColor","furOffset","furGravity","furTime","furSpacing","furDensity","furOcclusion"];(0,_.qx)(u);const d=["diffuseSampler","heightTexture","furTexture"],p=new Array;a.G.PrepareUniformsAndSamplersList({uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:n,maxSimultaneousLights:this.maxSimultaneousLights}),t.setEffect(s.getEngine().createEffect(l,{attributes:o,uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:h,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:this.maxSimultaneousLights}},r),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;r&&(this._activeEffect=r,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,this._activeEffect),n.getCachedMaterial()!==this&&(this._diffuseTexture&&h.k.DiffuseTextureEnabled&&(this._activeEffect.setTexture("diffuseSampler",this._diffuseTexture),this._activeEffect.setFloat2("vDiffuseInfos",this._diffuseTexture.coordinatesIndex,this._diffuseTexture.level),this._activeEffect.setMatrix("diffuseMatrix",this._diffuseTexture.getTextureMatrix())),this._heightTexture&&this._activeEffect.setTexture("heightTexture",this._heightTexture),(0,_.an)(this._activeEffect,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),n.bindEyePosition(r)),this._activeEffect.setColor4("vDiffuseColor",this.diffuseColor,this.alpha*t.visibility),n.lightsEnabled&&!this.disableLighting&&a.G.BindLights(n,t,this._activeEffect,s,this.maxSimultaneousLights),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),this._activeEffect.setFloat("furLength",this.furLength),this._activeEffect.setFloat("furAngle",this.furAngle),this._activeEffect.setColor4("furColor",this.furColor,1),this.highLevelFur&&(this._activeEffect.setVector3("furGravity",this.furGravity),this._activeEffect.setFloat("furOffset",this.furOffset),this._activeEffect.setFloat("furSpacing",this.furSpacing),this._activeEffect.setFloat("furDensity",this.furDensity),this._activeEffect.setFloat("furOcclusion",this.furOcclusion),this._furTime+=this.getScene().getEngine().getDeltaTime()/this.furSpeed,this._activeEffect.setFloat("furTime",this._furTime),this._activeEffect.setTexture("furTexture",this.furTexture)),this._afterBind(t,this._activeEffect))}getAnimatables(){const e=[];return this.diffuseTexture&&this.diffuseTexture.animations&&this.diffuseTexture.animations.length>0&&e.push(this.diffuseTexture),this.heightTexture&&this.heightTexture.animations&&this.heightTexture.animations.length>0&&e.push(this.heightTexture),e}getActiveTextures(){const e=super.getActiveTextures();return this._diffuseTexture&&e.push(this._diffuseTexture),this._heightTexture&&e.push(this._heightTexture),e}hasTexture(e){return!!super.hasTexture(e)||this.diffuseTexture===e||this._heightTexture===e}dispose(e){if(this.diffuseTexture&&this.diffuseTexture.dispose(),this._meshes)for(let t=1;t<this._meshes.length;t++){const i=this._meshes[t].material;i&&i.dispose(e),this._meshes[t].dispose()}super.dispose(e)}clone(e){return s.p4.Clone((()=>new N(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.FurMaterial",this._meshes&&(e.sourceMeshName=this._meshes[0].name,e.quality=this._meshes.length),e}getClassName(){return"FurMaterial"}static Parse(e,t,i){const n=s.p4.Parse((()=>new N(e.name,t)),e,t,i);return e.sourceMeshName&&n.highLevelFur&&t.executeWhenReady((()=>{const i=t.getMeshByName(e.sourceMeshName);if(i){const s=N.GenerateTexture("Fur Texture",t);n.furTexture=s,N.FurifyMesh(i,e.quality)}})),n}static GenerateTexture(e,t){const i=new O.c("FurTexture "+e,256,t,!0),n=i.getContext();for(let e=0;e<2e4;++e)n.fillStyle="rgba(255, "+Math.floor(255*Math.random())+", "+Math.floor(255*Math.random())+", 1)",n.fillRect(Math.random()*i.getSize().width,Math.random()*i.getSize().height,2,2);return i.update(!1),i.wrapU=R.x.WRAP_ADDRESSMODE,i.wrapV=R.x.WRAP_ADDRESSMODE,i}static FurifyMesh(e,t){const i=[e],n=e.material;let s;if(!(n instanceof N))throw"The material of the source mesh must be a Fur Material";for(s=1;s<t;s++){const r=new N(n.name+s,e.getScene());e.getScene().materials.pop(),P.$.EnableFor(r),P.$.AddTagsTo(r,"furShellMaterial"),r.furLength=n.furLength,r.furAngle=n.furAngle,r.furGravity=n.furGravity,r.furSpacing=n.furSpacing,r.furSpeed=n.furSpeed,r.furColor=n.furColor,r.diffuseTexture=n.diffuseTexture,r.furOffset=s/t,r.furTexture=n.furTexture,r.highLevelFur=n.highLevelFur,r.furTime=n.furTime,r.furDensity=n.furDensity;const o=e.clone(e.name+s);o.material=r,o.skeleton=e.skeleton,o.position=D.P.Zero(),i.push(o)}for(s=1;s<i.length;s++)i[s].parent=e;return e.material._meshes=i,i}}(0,n.gn)([(0,s.oU)("diffuseTexture")],N.prototype,"_diffuseTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],N.prototype,"diffuseTexture",void 0),(0,n.gn)([(0,s.oU)("heightTexture")],N.prototype,"_heightTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],N.prototype,"heightTexture",void 0),(0,n.gn)([(0,s.n9)()],N.prototype,"diffuseColor",void 0),(0,n.gn)([(0,s.qC)()],N.prototype,"furLength",void 0),(0,n.gn)([(0,s.qC)()],N.prototype,"furAngle",void 0),(0,n.gn)([(0,s.n9)()],N.prototype,"furColor",void 0),(0,n.gn)([(0,s.qC)()],N.prototype,"furOffset",void 0),(0,n.gn)([(0,s.qC)()],N.prototype,"furSpacing",void 0),(0,n.gn)([(0,s.hd)()],N.prototype,"furGravity",void 0),(0,n.gn)([(0,s.qC)()],N.prototype,"furSpeed",void 0),(0,n.gn)([(0,s.qC)()],N.prototype,"furDensity",void 0),(0,n.gn)([(0,s.qC)()],N.prototype,"furOcclusion",void 0),(0,n.gn)([(0,s.qC)("disableLighting")],N.prototype,"_disableLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],N.prototype,"disableLighting",void 0),(0,n.gn)([(0,s.qC)("maxSimultaneousLights")],N.prototype,"_maxSimultaneousLights",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],N.prototype,"maxSimultaneousLights",void 0),(0,n.gn)([(0,s.qC)()],N.prototype,"highLevelFur",void 0),(0,n.gn)([(0,s.qC)()],N.prototype,"furTime",null),(0,d.H)("BABYLON.FurMaterial",N);p.v.ShadersStore.gradientPixelShader="precision highp float;\nuniform vec4 vEyePosition;\nuniform vec4 topColor;\nuniform vec4 bottomColor;\nuniform float offset;\nuniform float scale;\nuniform float smoothness;\nvarying vec3 vPositionW;\nvarying vec3 vPosition;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<helperFunctions>\n#include<__decl__lightFragment>[0]\n#include<__decl__lightFragment>[1]\n#include<__decl__lightFragment>[2]\n#include<__decl__lightFragment>[3]\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#include<clipPlaneFragmentDeclaration>\n#include<fogFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\nfloat h=vPosition.y*scale+offset;\nfloat mysmoothness=clamp(smoothness,0.01,max(smoothness,10.));\nvec4 baseColor=mix(bottomColor,topColor,max(pow(max(h,0.0),mysmoothness),0.0));\nvec3 diffuseColor=baseColor.rgb;\nfloat alpha=baseColor.a;\n#ifdef ALPHATEST\nif (baseColor.a<0.4)\ndiscard;\n#endif\n#include<depthPrePass>\n#ifdef VERTEXCOLOR\nbaseColor.rgb*=vColor.rgb;\n#endif\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=vec3(1.0,1.0,1.0);\n#endif\n#ifdef EMISSIVE\nvec3 diffuseBase=baseColor.rgb;\n#else\nvec3 diffuseBase=vec3(0.,0.,0.);\n#endif\nlightingInfo info;\nfloat shadow=1.;\nfloat glossiness=0.;\n#include<lightFragment>[0..maxSimultaneousLights]\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\nvec3 finalDiffuse=clamp(diffuseBase*diffuseColor,0.0,1.0)*baseColor.rgb;\nvec4 color=vec4(finalDiffuse,alpha);\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n";p.v.ShadersStore.gradientVertexShader="precision highp float;\nattribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nuniform mat4 view;\nuniform mat4 viewProjection;\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\nvarying vec3 vPosition;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(position,1.0);\ngl_Position=viewProjection*worldPos;\nvPositionW=vec3(worldPos);\nvPosition=position;\n#ifdef NORMAL\nvNormalW=normalize(vec3(finalWorld*vec4(normal,0.0)));\n#endif\n#ifndef UV1\nvec2 uv=vec2(0.,0.);\n#endif\n#ifndef UV2\nvec2 uv2=vec2(0.,0.);\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#include<vertexColorMixing>\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";class F extends o.H{constructor(){super(),this.EMISSIVE=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.POINTSIZE=!1,this.FOG=!1,this.NORMAL=!1,this.UV1=!1,this.UV2=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.INSTANCESCOLOR=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class L extends l.a{constructor(e,t){super(e,t),this._maxSimultaneousLights=4,this.topColor=new r.Wo(1,0,0),this.topColorAlpha=1,this.bottomColor=new r.Wo(0,0,1),this.bottomColorAlpha=1,this.offset=0,this.scale=1,this.smoothness=1,this._disableLighting=!1}needAlphaBlending(){return this.alpha<1||this.topColorAlpha<1||this.bottomColorAlpha<1}needAlphaTesting(){return!0}getAlphaTestTexture(){return null}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new F);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;const r=s.getEngine();if(a.G.PrepareDefinesForFrameBoundValues(s,r,this,n,!!i),a.G.PrepareDefinesForMisc(e,s,!1,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),n),n._needNormals=a.G.PrepareDefinesForLights(s,e,n,!1,this._maxSimultaneousLights,this._disableLighting),n.EMISSIVE=this._disableLighting,a.G.PrepareDefinesForAttributes(e,n,!1,!0),n.isDirty){n.markAsProcessed(),s.resetCachedMaterial();const i=new f.L;n.FOG&&i.addFallback(1,"FOG"),a.G.HandleFallbacksForShadows(n,i),n.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e),n.IMAGEPROCESSINGPOSTPROCESS=s.imageProcessingConfiguration.applyByPostProcess;const o=[c.o.PositionKind];n.NORMAL&&o.push(c.o.NormalKind),n.UV1&&o.push(c.o.UVKind),n.UV2&&o.push(c.o.UV2Kind),n.VERTEXCOLOR&&o.push(c.o.ColorKind),a.G.PrepareAttributesForBones(o,e,n,i),a.G.PrepareAttributesForInstances(o,n);const l="gradient",h=n.toString(),u=["world","view","viewProjection","vEyePosition","vLightsType","vFogInfos","vFogColor","pointSize","mBones","topColor","bottomColor","offset","smoothness","scale"];(0,_.qx)(u);const d=[],p=new Array;a.G.PrepareUniformsAndSamplersList({uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:n,maxSimultaneousLights:4}),t.setEffect(s.getEngine().createEffect(l,{attributes:o,uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:h,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:4}},r),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;r&&(this._activeEffect=r,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,r),this._mustRebind(n,r)&&((0,_.an)(r,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),n.bindEyePosition(r)),n.lightsEnabled&&!this.disableLighting&&a.G.BindLights(n,t,this._activeEffect,s,this.maxSimultaneousLights),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),this._activeEffect.setColor4("topColor",this.topColor,this.topColorAlpha),this._activeEffect.setColor4("bottomColor",this.bottomColor,this.bottomColorAlpha),this._activeEffect.setFloat("offset",this.offset),this._activeEffect.setFloat("scale",this.scale),this._activeEffect.setFloat("smoothness",this.smoothness),this._afterBind(t,this._activeEffect))}getAnimatables(){return[]}dispose(e){super.dispose(e)}clone(e){return s.p4.Clone((()=>new L(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.GradientMaterial",e}getClassName(){return"GradientMaterial"}static Parse(e,t,i){return s.p4.Parse((()=>new L(e.name,t)),e,t,i)}}(0,n.gn)([(0,s.qC)("maxSimultaneousLights")],L.prototype,"_maxSimultaneousLights",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],L.prototype,"maxSimultaneousLights",void 0),(0,n.gn)([(0,s.n9)()],L.prototype,"topColor",void 0),(0,n.gn)([(0,s.qC)()],L.prototype,"topColorAlpha",void 0),(0,n.gn)([(0,s.n9)()],L.prototype,"bottomColor",void 0),(0,n.gn)([(0,s.qC)()],L.prototype,"bottomColorAlpha",void 0),(0,n.gn)([(0,s.qC)()],L.prototype,"offset",void 0),(0,n.gn)([(0,s.qC)()],L.prototype,"scale",void 0),(0,n.gn)([(0,s.qC)()],L.prototype,"smoothness",void 0),(0,n.gn)([(0,s.qC)("disableLighting")],L.prototype,"_disableLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],L.prototype,"disableLighting",void 0),(0,d.H)("BABYLON.GradientMaterial",L);p.v.ShadersStore.gridPixelShader="#extension GL_OES_standard_derivatives : enable\n#define SQRT2 1.41421356\n#define PI 3.14159\nprecision highp float;\nuniform float visibility;\nuniform vec3 mainColor;\nuniform vec3 lineColor;\nuniform vec4 gridControl;\nuniform vec3 gridOffset;\nvarying vec3 vPosition;\nvarying vec3 vNormal;\n#include<fogFragmentDeclaration>\n#ifdef OPACITY\nvarying vec2 vOpacityUV;\nuniform sampler2D opacitySampler;\nuniform vec2 vOpacityInfos;\n#endif\nfloat getDynamicVisibility(float position) {\nfloat majorGridFrequency=gridControl.y;\nif (floor(position+0.5)==floor(position/majorGridFrequency+0.5)*majorGridFrequency)\n{\nreturn 1.0;\n} \nreturn gridControl.z;\n}\nfloat getAnisotropicAttenuation(float differentialLength) {\nconst float maxNumberOfLines=10.0;\nreturn clamp(1.0/(differentialLength+1.0)-1.0/maxNumberOfLines,0.0,1.0);\n}\nfloat isPointOnLine(float position,float differentialLength) {\nfloat fractionPartOfPosition=position-floor(position+0.5); \nfractionPartOfPosition/=differentialLength; \nfractionPartOfPosition=clamp(fractionPartOfPosition,-1.,1.);\nfloat result=0.5+0.5*cos(fractionPartOfPosition*PI); \nreturn result; \n}\nfloat contributionOnAxis(float position) {\nfloat differentialLength=length(vec2(dFdx(position),dFdy(position)));\ndifferentialLength*=SQRT2; \nfloat result=isPointOnLine(position,differentialLength);\nfloat dynamicVisibility=getDynamicVisibility(position);\nresult*=dynamicVisibility;\nfloat anisotropicAttenuation=getAnisotropicAttenuation(differentialLength);\nresult*=anisotropicAttenuation;\nreturn result;\n}\nfloat normalImpactOnAxis(float x) {\nfloat normalImpact=clamp(1.0-3.0*abs(x*x*x),0.0,1.0);\nreturn normalImpact;\n}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\nfloat gridRatio=gridControl.x;\nvec3 gridPos=(vPosition+gridOffset.xyz)/gridRatio;\nfloat x=contributionOnAxis(gridPos.x);\nfloat y=contributionOnAxis(gridPos.y);\nfloat z=contributionOnAxis(gridPos.z);\nvec3 normal=normalize(vNormal);\nx*=normalImpactOnAxis(normal.x);\ny*=normalImpactOnAxis(normal.y);\nz*=normalImpactOnAxis(normal.z);\n#ifdef MAX_LINE \nfloat grid=clamp(max(max(x,y),z),0.,1.);\n#else\nfloat grid=clamp(x+y+z,0.,1.);\n#endif\nvec3 color=mix(mainColor,lineColor,grid);\n#ifdef FOG\n#include<fogFragment>\n#endif\nfloat opacity=1.0;\n#ifdef TRANSPARENT\nopacity=clamp(grid,0.08,gridControl.w*grid);\n#endif \n#ifdef OPACITY\nopacity*=texture2D(opacitySampler,vOpacityUV).a;\n#endif \ngl_FragColor=vec4(color.rgb,opacity*visibility);\n#ifdef TRANSPARENT\n#ifdef PREMULTIPLYALPHA\ngl_FragColor.rgb*=opacity;\n#endif\n#else \n#endif\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n";p.v.ShadersStore.gridVertexShader="precision highp float;\nattribute vec3 position;\nattribute vec3 normal;\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#include<instancesDeclaration>\nuniform mat4 projection;\nuniform mat4 view;\nvarying vec3 vPosition;\nvarying vec3 vNormal;\n#include<fogVertexDeclaration>\n#ifdef OPACITY\nvarying vec2 vOpacityUV;\nuniform mat4 opacityMatrix;\nuniform vec2 vOpacityInfos;\n#endif\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\nvec4 worldPos=finalWorld*vec4(position,1.0);\n#include<fogVertex>\nvec4 cameraSpacePosition=view*worldPos;\ngl_Position=projection*cameraSpacePosition;\n#ifdef OPACITY\n#ifndef UV1\nvec2 uv=vec2(0.,0.);\n#endif\n#ifndef UV2\nvec2 uv2=vec2(0.,0.);\n#endif\nif (vOpacityInfos.x==0.)\n{\nvOpacityUV=vec2(opacityMatrix*vec4(uv,1.0,0.0));\n}\nelse\n{\nvOpacityUV=vec2(opacityMatrix*vec4(uv2,1.0,0.0));\n}\n#endif \nvPosition=position;\nvNormal=normal;\n#define CUSTOM_VERTEX_MAIN_END\n}";class B extends o.H{constructor(){super(),this.OPACITY=!1,this.TRANSPARENT=!1,this.FOG=!1,this.PREMULTIPLYALPHA=!1,this.MAX_LINE=!1,this.UV1=!1,this.UV2=!1,this.INSTANCES=!1,this.THIN_INSTANCES=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class U extends l.a{constructor(e,t){super(e,t),this.mainColor=r.Wo.Black(),this.lineColor=r.Wo.Teal(),this.gridRatio=1,this.gridOffset=D.P.Zero(),this.majorUnitFrequency=10,this.minorUnitVisibility=.33,this.opacity=1,this.preMultiplyAlpha=!1,this.useMaxLine=!1,this._gridControl=new D.Lt(this.gridRatio,this.majorUnitFrequency,this.minorUnitVisibility,this.opacity)}needAlphaBlending(){return this.opacity<1||this._opacityTexture&&this._opacityTexture.isReady()}needAlphaBlendingForMesh(e){return e.visibility<1||this.needAlphaBlending()}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new B);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;if(n.TRANSPARENT!==this.opacity<1&&(n.TRANSPARENT=!n.TRANSPARENT,n.markAsUnprocessed()),n.PREMULTIPLYALPHA!=this.preMultiplyAlpha&&(n.PREMULTIPLYALPHA=!n.PREMULTIPLYALPHA,n.markAsUnprocessed()),n.MAX_LINE!==this.useMaxLine&&(n.MAX_LINE=!n.MAX_LINE,n.markAsUnprocessed()),n._areTexturesDirty&&(n._needUVs=!1,s.texturesEnabled&&this._opacityTexture&&h.k.OpacityTextureEnabled)){if(!this._opacityTexture.isReady())return!1;n._needUVs=!0,n.OPACITY=!0}if(a.G.PrepareDefinesForMisc(e,s,!1,!1,this.fogEnabled,!1,n),a.G.PrepareDefinesForFrameBoundValues(s,s.getEngine(),this,n,!!i),n.isDirty){n.markAsProcessed(),s.resetCachedMaterial(),a.G.PrepareDefinesForAttributes(e,n,!1,!1);const i=[c.o.PositionKind,c.o.NormalKind];n.UV1&&i.push(c.o.UVKind),n.UV2&&i.push(c.o.UV2Kind),n.IMAGEPROCESSINGPOSTPROCESS=s.imageProcessingConfiguration.applyByPostProcess,a.G.PrepareAttributesForInstances(i,n);const r=n.toString();t.setEffect(s.getEngine().createEffect("grid",i,["projection","mainColor","lineColor","gridControl","gridOffset","vFogInfos","vFogColor","world","view","opacityMatrix","vOpacityInfos","visibility"],["opacitySampler"],r,void 0,this.onCompiled,this.onError),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;r&&(this._activeEffect=r,this._activeEffect.setFloat("visibility",t.visibility),s.INSTANCES&&!s.THIN_INSTANCE||this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("view",n.getViewMatrix()),this._activeEffect.setMatrix("projection",n.getProjectionMatrix()),this._mustRebind(n,r)&&(this._activeEffect.setColor3("mainColor",this.mainColor),this._activeEffect.setColor3("lineColor",this.lineColor),this._activeEffect.setVector3("gridOffset",this.gridOffset),this._gridControl.x=this.gridRatio,this._gridControl.y=Math.round(this.majorUnitFrequency),this._gridControl.z=this.minorUnitVisibility,this._gridControl.w=this.opacity,this._activeEffect.setVector4("gridControl",this._gridControl),this._opacityTexture&&h.k.OpacityTextureEnabled&&(this._activeEffect.setTexture("opacitySampler",this._opacityTexture),this._activeEffect.setFloat2("vOpacityInfos",this._opacityTexture.coordinatesIndex,this._opacityTexture.level),this._activeEffect.setMatrix("opacityMatrix",this._opacityTexture.getTextureMatrix()))),a.G.BindFogParameters(n,t,this._activeEffect),this._afterBind(t,this._activeEffect))}dispose(e){super.dispose(e)}clone(e){return s.p4.Clone((()=>new U(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.GridMaterial",e}getClassName(){return"GridMaterial"}static Parse(e,t,i){return s.p4.Parse((()=>new U(e.name,t)),e,t,i)}}(0,n.gn)([(0,s.n9)()],U.prototype,"mainColor",void 0),(0,n.gn)([(0,s.n9)()],U.prototype,"lineColor",void 0),(0,n.gn)([(0,s.qC)()],U.prototype,"gridRatio",void 0),(0,n.gn)([(0,s.hd)()],U.prototype,"gridOffset",void 0),(0,n.gn)([(0,s.qC)()],U.prototype,"majorUnitFrequency",void 0),(0,n.gn)([(0,s.qC)()],U.prototype,"minorUnitVisibility",void 0),(0,n.gn)([(0,s.qC)()],U.prototype,"opacity",void 0),(0,n.gn)([(0,s.qC)()],U.prototype,"preMultiplyAlpha",void 0),(0,n.gn)([(0,s.qC)()],U.prototype,"useMaxLine",void 0),(0,n.gn)([(0,s.oU)("opacityTexture")],U.prototype,"_opacityTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],U.prototype,"opacityTexture",void 0),(0,d.H)("BABYLON.GridMaterial",U);p.v.ShadersStore.lavaPixelShader="precision highp float;uniform vec4 vEyePosition;uniform vec4 vDiffuseColor;varying vec3 vPositionW;uniform float time;uniform float speed;uniform float movingSpeed;uniform vec3 fogColor;uniform sampler2D noiseTexture;uniform float fogDensity;varying float noise;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<helperFunctions>\n#include<__decl__lightFragment>[0]\n#include<__decl__lightFragment>[1]\n#include<__decl__lightFragment>[2]\n#include<__decl__lightFragment>[3]\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;uniform sampler2D diffuseSampler;uniform vec2 vDiffuseInfos;\n#endif\n#include<clipPlaneFragmentDeclaration>\n#include<fogFragmentDeclaration>\nfloat random( vec3 scale,float seed ){return fract( sin( dot( gl_FragCoord.xyz+seed,scale ) )*43758.5453+seed ) ;}\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);vec4 baseColor=vec4(1.,1.,1.,1.);vec3 diffuseColor=vDiffuseColor.rgb;float alpha=vDiffuseColor.a;\n#ifdef DIFFUSE\nvec4 noiseTex=texture2D( noiseTexture,vDiffuseUV );vec2 T1=vDiffuseUV+vec2( 1.5,-1.5 )*time *0.02;vec2 T2=vDiffuseUV+vec2( -0.5,2.0 )*time*0.01*speed;T1.x+=noiseTex.x*2.0;T1.y+=noiseTex.y*2.0;T2.x-=noiseTex.y*0.2+time*0.001*movingSpeed;T2.y+=noiseTex.z*0.2+time*0.002*movingSpeed;float p=texture2D( noiseTexture,T1*3.0 ).a;vec4 lavaColor=texture2D( diffuseSampler,T2*4.0);vec4 temp=lavaColor*( vec4( p,p,p,p )*2. )+( lavaColor*lavaColor-0.1 );baseColor=temp;float depth=gl_FragCoord.z*4.0;const float LOG2=1.442695;float fogFactor=exp2(-fogDensity*fogDensity*depth*depth*LOG2 );fogFactor=1.0-clamp( fogFactor,0.0,1.0 );baseColor=mix( baseColor,vec4( fogColor,baseColor.w ),fogFactor );diffuseColor=baseColor.rgb;\n#ifdef ALPHATEST\nif (baseColor.a<0.4)\ndiscard;\n#endif\n#include<depthPrePass>\nbaseColor.rgb*=vDiffuseInfos.y;\n#endif\n#ifdef VERTEXCOLOR\nbaseColor.rgb*=vColor.rgb;\n#endif\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=vec3(1.0,1.0,1.0);\n#endif\n#ifdef UNLIT\nvec3 diffuseBase=vec3(1.,1.,1.);\n#else\nvec3 diffuseBase=vec3(0.,0.,0.);lightingInfo info;float shadow=1.;float glossiness=0.;\n#include<lightFragment>[0]\n#include<lightFragment>[1]\n#include<lightFragment>[2]\n#include<lightFragment>[3]\n#endif\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\nvec3 finalDiffuse=clamp(diffuseBase*diffuseColor,0.0,1.0)*baseColor.rgb;vec4 color=vec4(finalDiffuse,alpha);\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}";p.v.ShadersStore.lavaVertexShader="precision highp float;uniform float time;uniform float lowFrequencySpeed;varying float noise;attribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nuniform mat4 view;uniform mat4 viewProjection;\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;uniform mat4 diffuseMatrix;uniform vec2 vDiffuseInfos;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n/* NOISE FUNCTIONS */\nvec3 mod289(vec3 x)\n{return x-floor(x*(1.0/289.0))*289.0;}\nvec4 mod289(vec4 x)\n{return x-floor(x*(1.0/289.0))*289.0;}\nvec4 permute(vec4 x)\n{return mod289(((x*34.0)+1.0)*x);}\nvec4 taylorInvSqrt(vec4 r)\n{return 1.79284291400159-0.85373472095314*r;}\nvec3 fade(vec3 t) {return t*t*t*(t*(t*6.0-15.0)+10.0);}\nfloat pnoise(vec3 P,vec3 rep)\n{vec3 Pi0=mod(floor(P),rep); \nvec3 Pi1=mod(Pi0+vec3(1.0),rep); \nPi0=mod289(Pi0);Pi1=mod289(Pi1);vec3 Pf0=fract(P); \nvec3 Pf1=Pf0-vec3(1.0); \nvec4 ix=vec4(Pi0.x,Pi1.x,Pi0.x,Pi1.x);vec4 iy=vec4(Pi0.yy,Pi1.yy);vec4 iz0=Pi0.zzzz;vec4 iz1=Pi1.zzzz;vec4 ixy=permute(permute(ix)+iy);vec4 ixy0=permute(ixy+iz0);vec4 ixy1=permute(ixy+iz1);vec4 gx0=ixy0*(1.0/7.0);vec4 gy0=fract(floor(gx0)*(1.0/7.0))-0.5;gx0=fract(gx0);vec4 gz0=vec4(0.5)-abs(gx0)-abs(gy0);vec4 sz0=step(gz0,vec4(0.0));gx0-=sz0*(step(0.0,gx0)-0.5);gy0-=sz0*(step(0.0,gy0)-0.5);vec4 gx1=ixy1*(1.0/7.0);vec4 gy1=fract(floor(gx1)*(1.0/7.0))-0.5;gx1=fract(gx1);vec4 gz1=vec4(0.5)-abs(gx1)-abs(gy1);vec4 sz1=step(gz1,vec4(0.0));gx1-=sz1*(step(0.0,gx1)-0.5);gy1-=sz1*(step(0.0,gy1)-0.5);vec3 g000=vec3(gx0.x,gy0.x,gz0.x);vec3 g100=vec3(gx0.y,gy0.y,gz0.y);vec3 g010=vec3(gx0.z,gy0.z,gz0.z);vec3 g110=vec3(gx0.w,gy0.w,gz0.w);vec3 g001=vec3(gx1.x,gy1.x,gz1.x);vec3 g101=vec3(gx1.y,gy1.y,gz1.y);vec3 g011=vec3(gx1.z,gy1.z,gz1.z);vec3 g111=vec3(gx1.w,gy1.w,gz1.w);vec4 norm0=taylorInvSqrt(vec4(dot(g000,g000),dot(g010,g010),dot(g100,g100),dot(g110,g110)));g000*=norm0.x;g010*=norm0.y;g100*=norm0.z;g110*=norm0.w;vec4 norm1=taylorInvSqrt(vec4(dot(g001,g001),dot(g011,g011),dot(g101,g101),dot(g111,g111)));g001*=norm1.x;g011*=norm1.y;g101*=norm1.z;g111*=norm1.w;float n000=dot(g000,Pf0);float n100=dot(g100,vec3(Pf1.x,Pf0.yz));float n010=dot(g010,vec3(Pf0.x,Pf1.y,Pf0.z));float n110=dot(g110,vec3(Pf1.xy,Pf0.z));float n001=dot(g001,vec3(Pf0.xy,Pf1.z));float n101=dot(g101,vec3(Pf1.x,Pf0.y,Pf1.z));float n011=dot(g011,vec3(Pf0.x,Pf1.yz));float n111=dot(g111,Pf1);vec3 fade_xyz=fade(Pf0);vec4 n_z=mix(vec4(n000,n100,n010,n110),vec4(n001,n101,n011,n111),fade_xyz.z);vec2 n_yz=mix(n_z.xy,n_z.zw,fade_xyz.y);float n_xyz=mix(n_yz.x,n_yz.y,fade_xyz.x);return 2.2*n_xyz;}\n/* END FUNCTION */\nfloat turbulence( vec3 p ) {float w=100.0;float t=-.5;for (float f=1.0 ; f<=10.0 ; f++ ){float power=pow( 2.0,f );t+=abs( pnoise( vec3( power*p ),vec3( 10.0,10.0,10.0 ) )/power );}\nreturn t;}\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\n#ifdef NORMAL\nnoise=10.0* -.10*turbulence( .5*normal+time*1.15 );float b=lowFrequencySpeed*5.0*pnoise( 0.05*position +vec3(time*1.025),vec3( 100.0 ) );float displacement=- 1.5*noise+b;vec3 newPosition=position+normal*displacement;gl_Position=viewProjection*finalWorld*vec4( newPosition,1.0 );vec4 worldPos=finalWorld*vec4(newPosition,1.0);vPositionW=vec3(worldPos);vNormalW=normalize(vec3(finalWorld*vec4(normal,0.0)));\n#endif\n#ifndef UV1\nvec2 uv=vec2(0.,0.);\n#endif\n#ifndef UV2\nvec2 uv2=vec2(0.,0.);\n#endif\n#ifdef DIFFUSE\nif (vDiffuseInfos.x==0.)\n{vDiffuseUV=vec2(diffuseMatrix*vec4(uv,1.0,0.0));}\nelse\n{vDiffuseUV=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));}\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#include<vertexColorMixing>\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}";class V extends o.H{constructor(){super(),this.DIFFUSE=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.POINTSIZE=!1,this.FOG=!1,this.LIGHT0=!1,this.LIGHT1=!1,this.LIGHT2=!1,this.LIGHT3=!1,this.SPOTLIGHT0=!1,this.SPOTLIGHT1=!1,this.SPOTLIGHT2=!1,this.SPOTLIGHT3=!1,this.HEMILIGHT0=!1,this.HEMILIGHT1=!1,this.HEMILIGHT2=!1,this.HEMILIGHT3=!1,this.DIRLIGHT0=!1,this.DIRLIGHT1=!1,this.DIRLIGHT2=!1,this.DIRLIGHT3=!1,this.POINTLIGHT0=!1,this.POINTLIGHT1=!1,this.POINTLIGHT2=!1,this.POINTLIGHT3=!1,this.SHADOW0=!1,this.SHADOW1=!1,this.SHADOW2=!1,this.SHADOW3=!1,this.SHADOWS=!1,this.SHADOWESM0=!1,this.SHADOWESM1=!1,this.SHADOWESM2=!1,this.SHADOWESM3=!1,this.SHADOWPOISSON0=!1,this.SHADOWPOISSON1=!1,this.SHADOWPOISSON2=!1,this.SHADOWPOISSON3=!1,this.SHADOWPCF0=!1,this.SHADOWPCF1=!1,this.SHADOWPCF2=!1,this.SHADOWPCF3=!1,this.SHADOWPCSS0=!1,this.SHADOWPCSS1=!1,this.SHADOWPCSS2=!1,this.SHADOWPCSS3=!1,this.NORMAL=!1,this.UV1=!1,this.UV2=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.INSTANCESCOLOR=!1,this.UNLIT=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class k extends l.a{constructor(e,t){super(e,t),this.speed=1,this.movingSpeed=1,this.lowFrequencySpeed=1,this.fogDensity=.15,this._lastTime=0,this.diffuseColor=new r.Wo(1,1,1),this._disableLighting=!1,this._unlit=!1,this._maxSimultaneousLights=4,this._scaledDiffuse=new r.Wo}needAlphaBlending(){return this.alpha<1}needAlphaTesting(){return!1}getAlphaTestTexture(){return null}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new V);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;const r=s.getEngine();if(n._areTexturesDirty&&(n._needUVs=!1,s.texturesEnabled&&this._diffuseTexture&&h.k.DiffuseTextureEnabled)){if(!this._diffuseTexture.isReady())return!1;n._needUVs=!0,n.DIFFUSE=!0}if(a.G.PrepareDefinesForMisc(e,s,!1,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),n),n._needNormals=!0,a.G.PrepareDefinesForLights(s,e,n,!1,this._maxSimultaneousLights,this._disableLighting),a.G.PrepareDefinesForFrameBoundValues(s,r,this,n,!!i),a.G.PrepareDefinesForAttributes(e,n,!0,!0),n.isDirty){n.markAsProcessed(),s.resetCachedMaterial();const i=new f.L;n.FOG&&i.addFallback(1,"FOG"),a.G.HandleFallbacksForShadows(n,i),n.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e),n.IMAGEPROCESSINGPOSTPROCESS=s.imageProcessingConfiguration.applyByPostProcess;const o=[c.o.PositionKind];n.NORMAL&&o.push(c.o.NormalKind),n.UV1&&o.push(c.o.UVKind),n.UV2&&o.push(c.o.UV2Kind),n.VERTEXCOLOR&&o.push(c.o.ColorKind),a.G.PrepareAttributesForBones(o,e,n,i),a.G.PrepareAttributesForInstances(o,n);const l="lava",h=n.toString(),u=["world","view","viewProjection","vEyePosition","vLightsType","vDiffuseColor","vFogInfos","vFogColor","pointSize","vDiffuseInfos","mBones","diffuseMatrix","time","speed","movingSpeed","fogColor","fogDensity","lowFrequencySpeed"];(0,_.qx)(u);const d=["diffuseSampler","noiseTexture"],p=new Array;a.G.PrepareUniformsAndSamplersList({uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:n,maxSimultaneousLights:this.maxSimultaneousLights}),t.setEffect(s.getEngine().createEffect(l,{attributes:o,uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:h,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:this.maxSimultaneousLights}},r),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const o=i.effect;o&&(this._activeEffect=o,s.UNLIT=this._unlit,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,this._activeEffect),this._mustRebind(n,o)&&(this.diffuseTexture&&h.k.DiffuseTextureEnabled&&(this._activeEffect.setTexture("diffuseSampler",this.diffuseTexture),this._activeEffect.setFloat2("vDiffuseInfos",this.diffuseTexture.coordinatesIndex,this.diffuseTexture.level),this._activeEffect.setMatrix("diffuseMatrix",this.diffuseTexture.getTextureMatrix())),this.noiseTexture&&this._activeEffect.setTexture("noiseTexture",this.noiseTexture),(0,_.an)(o,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),n.bindEyePosition(o)),this._activeEffect.setColor4("vDiffuseColor",this._scaledDiffuse,this.alpha*t.visibility),n.lightsEnabled&&!this.disableLighting&&a.G.BindLights(n,t,this._activeEffect,s),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),this._lastTime+=n.getEngine().getDeltaTime(),this._activeEffect.setFloat("time",this._lastTime*this.speed/1e3),this.fogColor||(this.fogColor=r.Wo.Black()),this._activeEffect.setColor3("fogColor",this.fogColor),this._activeEffect.setFloat("fogDensity",this.fogDensity),this._activeEffect.setFloat("lowFrequencySpeed",this.lowFrequencySpeed),this._activeEffect.setFloat("movingSpeed",this.movingSpeed),this._afterBind(t,this._activeEffect))}getAnimatables(){const e=[];return this.diffuseTexture&&this.diffuseTexture.animations&&this.diffuseTexture.animations.length>0&&e.push(this.diffuseTexture),this.noiseTexture&&this.noiseTexture.animations&&this.noiseTexture.animations.length>0&&e.push(this.noiseTexture),e}getActiveTextures(){const e=super.getActiveTextures();return this._diffuseTexture&&e.push(this._diffuseTexture),e}hasTexture(e){return!!super.hasTexture(e)||this.diffuseTexture===e}dispose(e){this.diffuseTexture&&this.diffuseTexture.dispose(),this.noiseTexture&&this.noiseTexture.dispose(),super.dispose(e)}clone(e){return s.p4.Clone((()=>new k(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.LavaMaterial",e}getClassName(){return"LavaMaterial"}static Parse(e,t,i){return s.p4.Parse((()=>new k(e.name,t)),e,t,i)}}(0,n.gn)([(0,s.oU)("diffuseTexture")],k.prototype,"_diffuseTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],k.prototype,"diffuseTexture",void 0),(0,n.gn)([(0,s.oU)()],k.prototype,"noiseTexture",void 0),(0,n.gn)([(0,s.n9)()],k.prototype,"fogColor",void 0),(0,n.gn)([(0,s.qC)()],k.prototype,"speed",void 0),(0,n.gn)([(0,s.qC)()],k.prototype,"movingSpeed",void 0),(0,n.gn)([(0,s.qC)()],k.prototype,"lowFrequencySpeed",void 0),(0,n.gn)([(0,s.qC)()],k.prototype,"fogDensity",void 0),(0,n.gn)([(0,s.n9)()],k.prototype,"diffuseColor",void 0),(0,n.gn)([(0,s.qC)("disableLighting")],k.prototype,"_disableLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],k.prototype,"disableLighting",void 0),(0,n.gn)([(0,s.qC)("unlit")],k.prototype,"_unlit",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],k.prototype,"unlit",void 0),(0,n.gn)([(0,s.qC)("maxSimultaneousLights")],k.prototype,"_maxSimultaneousLights",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],k.prototype,"maxSimultaneousLights",void 0),(0,d.H)("BABYLON.LavaMaterial",k);p.v.ShadersStore.mixPixelShader="precision highp float;\nuniform vec4 vEyePosition;\nuniform vec4 vDiffuseColor;\n#ifdef SPECULARTERM\nuniform vec4 vSpecularColor;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<helperFunctions>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#ifdef DIFFUSE\nvarying vec2 vTextureUV;\nuniform sampler2D mixMap1Sampler;\nuniform vec2 vTextureInfos;\n#ifdef MIXMAP2\nuniform sampler2D mixMap2Sampler;\n#endif\nuniform sampler2D diffuse1Sampler;\nuniform sampler2D diffuse2Sampler;\nuniform sampler2D diffuse3Sampler;\nuniform sampler2D diffuse4Sampler;\nuniform vec2 diffuse1Infos;\nuniform vec2 diffuse2Infos;\nuniform vec2 diffuse3Infos;\nuniform vec2 diffuse4Infos;\n#ifdef MIXMAP2\nuniform sampler2D diffuse5Sampler;\nuniform sampler2D diffuse6Sampler;\nuniform sampler2D diffuse7Sampler;\nuniform sampler2D diffuse8Sampler;\nuniform vec2 diffuse5Infos;\nuniform vec2 diffuse6Infos;\nuniform vec2 diffuse7Infos;\nuniform vec2 diffuse8Infos;\n#endif\n#endif\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#include<clipPlaneFragmentDeclaration>\n#include<fogFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\nvec4 finalMixColor=vec4(1.,1.,1.,1.);\nvec3 diffuseColor=vDiffuseColor.rgb;\n#ifdef MIXMAP2\nvec4 mixColor2=vec4(1.,1.,1.,1.);\n#endif\n#ifdef SPECULARTERM\nfloat glossiness=vSpecularColor.a;\nvec3 specularColor=vSpecularColor.rgb;\n#else\nfloat glossiness=0.;\n#endif\nfloat alpha=vDiffuseColor.a;\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=vec3(1.0,1.0,1.0);\n#endif\n#ifdef DIFFUSE\nvec4 mixColor=texture2D(mixMap1Sampler,vTextureUV);\n#include<depthPrePass>\nmixColor.rgb*=vTextureInfos.y;\nvec4 diffuse1Color=texture2D(diffuse1Sampler,vTextureUV*diffuse1Infos);\nvec4 diffuse2Color=texture2D(diffuse2Sampler,vTextureUV*diffuse2Infos);\nvec4 diffuse3Color=texture2D(diffuse3Sampler,vTextureUV*diffuse3Infos);\nvec4 diffuse4Color=texture2D(diffuse4Sampler,vTextureUV*diffuse4Infos);\ndiffuse1Color.rgb*=mixColor.r;\ndiffuse2Color.rgb=mix(diffuse1Color.rgb,diffuse2Color.rgb,mixColor.g);\ndiffuse3Color.rgb=mix(diffuse2Color.rgb,diffuse3Color.rgb,mixColor.b);\nfinalMixColor.rgb=mix(diffuse3Color.rgb,diffuse4Color.rgb,1.0-mixColor.a);\n#ifdef MIXMAP2\nmixColor=texture2D(mixMap2Sampler,vTextureUV);\nmixColor.rgb*=vTextureInfos.y;\nvec4 diffuse5Color=texture2D(diffuse5Sampler,vTextureUV*diffuse5Infos);\nvec4 diffuse6Color=texture2D(diffuse6Sampler,vTextureUV*diffuse6Infos);\nvec4 diffuse7Color=texture2D(diffuse7Sampler,vTextureUV*diffuse7Infos);\nvec4 diffuse8Color=texture2D(diffuse8Sampler,vTextureUV*diffuse8Infos);\ndiffuse5Color.rgb=mix(finalMixColor.rgb,diffuse5Color.rgb,mixColor.r);\ndiffuse6Color.rgb=mix(diffuse5Color.rgb,diffuse6Color.rgb,mixColor.g);\ndiffuse7Color.rgb=mix(diffuse6Color.rgb,diffuse7Color.rgb,mixColor.b);\nfinalMixColor.rgb=mix(diffuse7Color.rgb,diffuse8Color.rgb,1.0-mixColor.a);\n#endif\n#endif\n#ifdef VERTEXCOLOR\nfinalMixColor.rgb*=vColor.rgb;\n#endif\nvec3 diffuseBase=vec3(0.,0.,0.);\nlightingInfo info;\nfloat shadow=1.;\n#ifdef SPECULARTERM\nvec3 specularBase=vec3(0.,0.,0.);\n#endif\n#include<lightFragment>[0..maxSimultaneousLights]\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\n#ifdef SPECULARTERM\nvec3 finalSpecular=specularBase*specularColor;\n#else\nvec3 finalSpecular=vec3(0.0);\n#endif\nvec3 finalDiffuse=clamp(diffuseBase*diffuseColor*finalMixColor.rgb,0.0,1.0);\nvec4 color=vec4(finalDiffuse+finalSpecular,alpha);\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n";p.v.ShadersStore.mixVertexShader="precision highp float;attribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nuniform mat4 view;uniform mat4 viewProjection;\n#ifdef DIFFUSE\nvarying vec2 vTextureUV;uniform mat4 textureMatrix;uniform vec2 vTextureInfos;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(position,1.0);gl_Position=viewProjection*worldPos;vPositionW=vec3(worldPos);\n#ifdef NORMAL\nvNormalW=normalize(vec3(finalWorld*vec4(normal,0.0)));\n#endif\n#ifndef UV1\nvec2 uv=vec2(0.,0.);\n#endif\n#ifndef UV2\nvec2 uv2=vec2(0.,0.);\n#endif\n#ifdef DIFFUSE\nif (vTextureInfos.x==0.)\n{vTextureUV=vec2(textureMatrix*vec4(uv,1.0,0.0));}\nelse\n{vTextureUV=vec2(textureMatrix*vec4(uv2,1.0,0.0));}\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#include<vertexColorMixing>\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";class G extends o.H{constructor(){super(),this.DIFFUSE=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.POINTSIZE=!1,this.FOG=!1,this.SPECULARTERM=!1,this.NORMAL=!1,this.UV1=!1,this.UV2=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.INSTANCESCOLOR=!1,this.MIXMAP2=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class z extends l.a{constructor(e,t){super(e,t),this.diffuseColor=new r.Wo(1,1,1),this.specularColor=new r.Wo(0,0,0),this.specularPower=64,this._disableLighting=!1,this._maxSimultaneousLights=4}needAlphaBlending(){return this.alpha<1}needAlphaTesting(){return!1}getAlphaTestTexture(){return null}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new G);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;const r=s.getEngine();if(s.texturesEnabled){if(!this._mixTexture1||!this._mixTexture1.isReady())return!1;if(n._needUVs=!0,h.k.DiffuseTextureEnabled){if(!this._diffuseTexture1||!this._diffuseTexture1.isReady())return!1;if(n.DIFFUSE=!0,!this._diffuseTexture2||!this._diffuseTexture2.isReady())return!1;if(!this._diffuseTexture3||!this._diffuseTexture3.isReady())return!1;if(!this._diffuseTexture4||!this._diffuseTexture4.isReady())return!1;if(this._mixTexture2){if(!this._mixTexture2.isReady())return!1;if(n.MIXMAP2=!0,!this._diffuseTexture5||!this._diffuseTexture5.isReady())return!1;if(!this._diffuseTexture6||!this._diffuseTexture6.isReady())return!1;if(!this._diffuseTexture7||!this._diffuseTexture7.isReady())return!1;if(!this._diffuseTexture8||!this._diffuseTexture8.isReady())return!1}}}if(a.G.PrepareDefinesForMisc(e,s,!1,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),n),n._needNormals=a.G.PrepareDefinesForLights(s,e,n,!1,this._maxSimultaneousLights,this._disableLighting),a.G.PrepareDefinesForFrameBoundValues(s,r,this,n,!!i),a.G.PrepareDefinesForAttributes(e,n,!0,!0),n.isDirty){n.markAsProcessed(),s.resetCachedMaterial();const i=new f.L;n.FOG&&i.addFallback(1,"FOG"),a.G.HandleFallbacksForShadows(n,i,this.maxSimultaneousLights),n.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e),n.IMAGEPROCESSINGPOSTPROCESS=s.imageProcessingConfiguration.applyByPostProcess;const o=[c.o.PositionKind];n.NORMAL&&o.push(c.o.NormalKind),n.UV1&&o.push(c.o.UVKind),n.UV2&&o.push(c.o.UV2Kind),n.VERTEXCOLOR&&o.push(c.o.ColorKind),a.G.PrepareAttributesForBones(o,e,n,i),a.G.PrepareAttributesForInstances(o,n);const l="mix",h=n.toString(),u=["world","view","viewProjection","vEyePosition","vLightsType","vDiffuseColor","vSpecularColor","vFogInfos","vFogColor","pointSize","vTextureInfos","mBones","textureMatrix","diffuse1Infos","diffuse2Infos","diffuse3Infos","diffuse4Infos","diffuse5Infos","diffuse6Infos","diffuse7Infos","diffuse8Infos"],d=["mixMap1Sampler","mixMap2Sampler","diffuse1Sampler","diffuse2Sampler","diffuse3Sampler","diffuse4Sampler","diffuse5Sampler","diffuse6Sampler","diffuse7Sampler","diffuse8Sampler"],p=new Array;(0,_.qx)(u),a.G.PrepareUniformsAndSamplersList({uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:n,maxSimultaneousLights:this.maxSimultaneousLights}),t.setEffect(s.getEngine().createEffect(l,{attributes:o,uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:h,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:this.maxSimultaneousLights}},r),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;r&&(this._activeEffect=r,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,this._activeEffect),this._mustRebind(n,r)&&(this._mixTexture1&&(this._activeEffect.setTexture("mixMap1Sampler",this._mixTexture1),this._activeEffect.setFloat2("vTextureInfos",this._mixTexture1.coordinatesIndex,this._mixTexture1.level),this._activeEffect.setMatrix("textureMatrix",this._mixTexture1.getTextureMatrix()),h.k.DiffuseTextureEnabled&&(this._diffuseTexture1&&(this._activeEffect.setTexture("diffuse1Sampler",this._diffuseTexture1),this._activeEffect.setFloat2("diffuse1Infos",this._diffuseTexture1.uScale,this._diffuseTexture1.vScale)),this._diffuseTexture2&&(this._activeEffect.setTexture("diffuse2Sampler",this._diffuseTexture2),this._activeEffect.setFloat2("diffuse2Infos",this._diffuseTexture2.uScale,this._diffuseTexture2.vScale)),this._diffuseTexture3&&(this._activeEffect.setTexture("diffuse3Sampler",this._diffuseTexture3),this._activeEffect.setFloat2("diffuse3Infos",this._diffuseTexture3.uScale,this._diffuseTexture3.vScale)),this._diffuseTexture4&&(this._activeEffect.setTexture("diffuse4Sampler",this._diffuseTexture4),this._activeEffect.setFloat2("diffuse4Infos",this._diffuseTexture4.uScale,this._diffuseTexture4.vScale)))),this._mixTexture2&&(this._activeEffect.setTexture("mixMap2Sampler",this._mixTexture2),h.k.DiffuseTextureEnabled&&(this._diffuseTexture5&&(this._activeEffect.setTexture("diffuse5Sampler",this._diffuseTexture5),this._activeEffect.setFloat2("diffuse5Infos",this._diffuseTexture5.uScale,this._diffuseTexture5.vScale)),this._diffuseTexture6&&(this._activeEffect.setTexture("diffuse6Sampler",this._diffuseTexture6),this._activeEffect.setFloat2("diffuse6Infos",this._diffuseTexture6.uScale,this._diffuseTexture6.vScale)),this._diffuseTexture7&&(this._activeEffect.setTexture("diffuse7Sampler",this._diffuseTexture7),this._activeEffect.setFloat2("diffuse7Infos",this._diffuseTexture7.uScale,this._diffuseTexture7.vScale)),this._diffuseTexture8&&(this._activeEffect.setTexture("diffuse8Sampler",this._diffuseTexture8),this._activeEffect.setFloat2("diffuse8Infos",this._diffuseTexture8.uScale,this._diffuseTexture8.vScale)))),(0,_.an)(r,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),n.bindEyePosition(r)),this._activeEffect.setColor4("vDiffuseColor",this.diffuseColor,this.alpha*t.visibility),s.SPECULARTERM&&this._activeEffect.setColor4("vSpecularColor",this.specularColor,this.specularPower),n.lightsEnabled&&!this.disableLighting&&a.G.BindLights(n,t,this._activeEffect,s,this.maxSimultaneousLights),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),this._afterBind(t,this._activeEffect))}getAnimatables(){const e=[];return this._mixTexture1&&this._mixTexture1.animations&&this._mixTexture1.animations.length>0&&e.push(this._mixTexture1),this._mixTexture2&&this._mixTexture2.animations&&this._mixTexture2.animations.length>0&&e.push(this._mixTexture2),e}getActiveTextures(){const e=super.getActiveTextures();return this._mixTexture1&&e.push(this._mixTexture1),this._diffuseTexture1&&e.push(this._diffuseTexture1),this._diffuseTexture2&&e.push(this._diffuseTexture2),this._diffuseTexture3&&e.push(this._diffuseTexture3),this._diffuseTexture4&&e.push(this._diffuseTexture4),this._mixTexture2&&e.push(this._mixTexture2),this._diffuseTexture5&&e.push(this._diffuseTexture5),this._diffuseTexture6&&e.push(this._diffuseTexture6),this._diffuseTexture7&&e.push(this._diffuseTexture7),this._diffuseTexture8&&e.push(this._diffuseTexture8),e}hasTexture(e){return!!super.hasTexture(e)||this._mixTexture1===e||this._diffuseTexture1===e||this._diffuseTexture2===e||this._diffuseTexture3===e||this._diffuseTexture4===e||this._mixTexture2===e||this._diffuseTexture5===e||this._diffuseTexture6===e||this._diffuseTexture7===e||this._diffuseTexture8===e}dispose(e){this._mixTexture1&&this._mixTexture1.dispose(),super.dispose(e)}clone(e){return s.p4.Clone((()=>new z(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.MixMaterial",e}getClassName(){return"MixMaterial"}static Parse(e,t,i){return s.p4.Parse((()=>new z(e.name,t)),e,t,i)}}(0,n.gn)([(0,s.oU)("mixTexture1")],z.prototype,"_mixTexture1",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],z.prototype,"mixTexture1",void 0),(0,n.gn)([(0,s.oU)("mixTexture2")],z.prototype,"_mixTexture2",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],z.prototype,"mixTexture2",void 0),(0,n.gn)([(0,s.oU)("diffuseTexture1")],z.prototype,"_diffuseTexture1",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],z.prototype,"diffuseTexture1",void 0),(0,n.gn)([(0,s.oU)("diffuseTexture2")],z.prototype,"_diffuseTexture2",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],z.prototype,"diffuseTexture2",void 0),(0,n.gn)([(0,s.oU)("diffuseTexture3")],z.prototype,"_diffuseTexture3",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],z.prototype,"diffuseTexture3",void 0),(0,n.gn)([(0,s.oU)("diffuseTexture4")],z.prototype,"_diffuseTexture4",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],z.prototype,"diffuseTexture4",void 0),(0,n.gn)([(0,s.oU)("diffuseTexture1")],z.prototype,"_diffuseTexture5",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],z.prototype,"diffuseTexture5",void 0),(0,n.gn)([(0,s.oU)("diffuseTexture2")],z.prototype,"_diffuseTexture6",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],z.prototype,"diffuseTexture6",void 0),(0,n.gn)([(0,s.oU)("diffuseTexture3")],z.prototype,"_diffuseTexture7",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],z.prototype,"diffuseTexture7",void 0),(0,n.gn)([(0,s.oU)("diffuseTexture4")],z.prototype,"_diffuseTexture8",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],z.prototype,"diffuseTexture8",void 0),(0,n.gn)([(0,s.n9)()],z.prototype,"diffuseColor",void 0),(0,n.gn)([(0,s.n9)()],z.prototype,"specularColor",void 0),(0,n.gn)([(0,s.qC)()],z.prototype,"specularPower",void 0),(0,n.gn)([(0,s.qC)("disableLighting")],z.prototype,"_disableLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],z.prototype,"disableLighting",void 0),(0,n.gn)([(0,s.qC)("maxSimultaneousLights")],z.prototype,"_maxSimultaneousLights",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],z.prototype,"maxSimultaneousLights",void 0),(0,d.H)("BABYLON.MixMaterial",z);p.v.ShadersStore.normalPixelShader="precision highp float;\nuniform vec4 vEyePosition;\nuniform vec4 vDiffuseColor;\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef LIGHTING\n#include<helperFunctions>\n#include<__decl__lightFragment>[0]\n#include<__decl__lightFragment>[1]\n#include<__decl__lightFragment>[2]\n#include<__decl__lightFragment>[3]\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#endif\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;\nuniform sampler2D diffuseSampler;\nuniform vec2 vDiffuseInfos;\n#endif\n#include<clipPlaneFragmentDeclaration>\n#include<fogFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\nvec4 baseColor=vec4(1.,1.,1.,1.);\nvec3 diffuseColor=vDiffuseColor.rgb;\nfloat alpha=vDiffuseColor.a;\n#ifdef DIFFUSE\nbaseColor=texture2D(diffuseSampler,vDiffuseUV);\n#ifdef ALPHATEST\nif (baseColor.a<0.4)\ndiscard;\n#endif\n#include<depthPrePass>\nbaseColor.rgb*=vDiffuseInfos.y;\n#endif\n#ifdef NORMAL\nbaseColor=mix(baseColor,vec4(vNormalW,1.0),0.5);\n#endif\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=vec3(1.0,1.0,1.0);\n#endif\n#ifdef LIGHTING\nvec3 diffuseBase=vec3(0.,0.,0.);\nlightingInfo info;\nfloat shadow=1.;\nfloat glossiness=0.;\n#include<lightFragment>[0]\n#include<lightFragment>[1]\n#include<lightFragment>[2]\n#include<lightFragment>[3]\nvec3 finalDiffuse=clamp(diffuseBase*diffuseColor,0.0,1.0)*baseColor.rgb;\n#else\nvec3 finalDiffuse= baseColor.rgb;\n#endif\nvec4 color=vec4(finalDiffuse,alpha);\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}";p.v.ShadersStore.normalVertexShader="precision highp float;\nattribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nuniform mat4 view;\nuniform mat4 viewProjection;\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;\nuniform mat4 diffuseMatrix;\nuniform vec2 vDiffuseInfos;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(position,1.0);\ngl_Position=viewProjection*worldPos;\nvPositionW=vec3(worldPos);\n#ifdef NORMAL\nvNormalW=normalize(vec3(finalWorld*vec4(normal,0.0)));\n#endif\n#ifndef UV1\nvec2 uv=vec2(0.,0.);\n#endif\n#ifndef UV2\nvec2 uv2=vec2(0.,0.);\n#endif\n#ifdef DIFFUSE\nif (vDiffuseInfos.x==0.)\n{\nvDiffuseUV=vec2(diffuseMatrix*vec4(uv,1.0,0.0));\n}\nelse\n{\nvDiffuseUV=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));\n}\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";class W extends o.H{constructor(){super(),this.DIFFUSE=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.POINTSIZE=!1,this.FOG=!1,this.LIGHT0=!1,this.LIGHT1=!1,this.LIGHT2=!1,this.LIGHT3=!1,this.SPOTLIGHT0=!1,this.SPOTLIGHT1=!1,this.SPOTLIGHT2=!1,this.SPOTLIGHT3=!1,this.HEMILIGHT0=!1,this.HEMILIGHT1=!1,this.HEMILIGHT2=!1,this.HEMILIGHT3=!1,this.DIRLIGHT0=!1,this.DIRLIGHT1=!1,this.DIRLIGHT2=!1,this.DIRLIGHT3=!1,this.POINTLIGHT0=!1,this.POINTLIGHT1=!1,this.POINTLIGHT2=!1,this.POINTLIGHT3=!1,this.SHADOW0=!1,this.SHADOW1=!1,this.SHADOW2=!1,this.SHADOW3=!1,this.SHADOWS=!1,this.SHADOWESM0=!1,this.SHADOWESM1=!1,this.SHADOWESM2=!1,this.SHADOWESM3=!1,this.SHADOWPOISSON0=!1,this.SHADOWPOISSON1=!1,this.SHADOWPOISSON2=!1,this.SHADOWPOISSON3=!1,this.SHADOWPCF0=!1,this.SHADOWPCF1=!1,this.SHADOWPCF2=!1,this.SHADOWPCF3=!1,this.SHADOWPCSS0=!1,this.SHADOWPCSS1=!1,this.SHADOWPCSS2=!1,this.SHADOWPCSS3=!1,this.NORMAL=!1,this.UV1=!1,this.UV2=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.LIGHTING=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class H extends l.a{constructor(e,t){super(e,t),this.diffuseColor=new r.Wo(1,1,1),this._disableLighting=!1,this._maxSimultaneousLights=4}needAlphaBlending(){return this.alpha<1}needAlphaBlendingForMesh(e){return this.needAlphaBlending()||e.visibility<1}needAlphaTesting(){return!1}getAlphaTestTexture(){return null}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new W);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;const r=s.getEngine();if(n._areTexturesDirty&&(n._needUVs=!1,s.texturesEnabled&&this._diffuseTexture&&h.k.DiffuseTextureEnabled)){if(!this._diffuseTexture.isReady())return!1;n._needUVs=!0,n.DIFFUSE=!0}if(a.G.PrepareDefinesForMisc(e,s,!1,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),n),n._needNormals=!0,a.G.PrepareDefinesForLights(s,e,n,!1,this._maxSimultaneousLights,this._disableLighting),a.G.PrepareDefinesForFrameBoundValues(s,r,this,n,!!i),n.LIGHTING=!this._disableLighting,a.G.PrepareDefinesForAttributes(e,n,!0,!0),n.isDirty){n.markAsProcessed(),s.resetCachedMaterial();const i=new f.L;n.FOG&&i.addFallback(1,"FOG"),a.G.HandleFallbacksForShadows(n,i),n.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e),n.IMAGEPROCESSINGPOSTPROCESS=s.imageProcessingConfiguration.applyByPostProcess;const o=[c.o.PositionKind];n.NORMAL&&o.push(c.o.NormalKind),n.UV1&&o.push(c.o.UVKind),n.UV2&&o.push(c.o.UV2Kind),a.G.PrepareAttributesForBones(o,e,n,i),a.G.PrepareAttributesForInstances(o,n);const l="normal",h=n.toString(),u=["world","view","viewProjection","vEyePosition","vLightsType","vDiffuseColor","vFogInfos","vFogColor","pointSize","vDiffuseInfos","mBones","diffuseMatrix"],d=["diffuseSampler"],p=new Array;(0,_.qx)(u),a.G.PrepareUniformsAndSamplersList({uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:n,maxSimultaneousLights:4}),t.setEffect(s.getEngine().createEffect(l,{attributes:o,uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:h,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:4}},r),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;r&&(this._activeEffect=r,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,this._activeEffect),this._mustRebind(n,r)&&(this.diffuseTexture&&h.k.DiffuseTextureEnabled&&(this._activeEffect.setTexture("diffuseSampler",this.diffuseTexture),this._activeEffect.setFloat2("vDiffuseInfos",this.diffuseTexture.coordinatesIndex,this.diffuseTexture.level),this._activeEffect.setMatrix("diffuseMatrix",this.diffuseTexture.getTextureMatrix())),(0,_.an)(r,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),n.bindEyePosition(r)),this._activeEffect.setColor4("vDiffuseColor",this.diffuseColor,this.alpha*t.visibility),n.lightsEnabled&&!this.disableLighting&&a.G.BindLights(n,t,this._activeEffect,s),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),this._afterBind(t,this._activeEffect))}getAnimatables(){const e=[];return this.diffuseTexture&&this.diffuseTexture.animations&&this.diffuseTexture.animations.length>0&&e.push(this.diffuseTexture),e}getActiveTextures(){const e=super.getActiveTextures();return this._diffuseTexture&&e.push(this._diffuseTexture),e}hasTexture(e){return!!super.hasTexture(e)||this.diffuseTexture===e}dispose(e){this.diffuseTexture&&this.diffuseTexture.dispose(),super.dispose(e)}clone(e){return s.p4.Clone((()=>new H(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.NormalMaterial",e}getClassName(){return"NormalMaterial"}static Parse(e,t,i){return s.p4.Parse((()=>new H(e.name,t)),e,t,i)}}(0,n.gn)([(0,s.oU)("diffuseTexture")],H.prototype,"_diffuseTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],H.prototype,"diffuseTexture",void 0),(0,n.gn)([(0,s.n9)()],H.prototype,"diffuseColor",void 0),(0,n.gn)([(0,s.qC)("disableLighting")],H.prototype,"_disableLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],H.prototype,"disableLighting",void 0),(0,n.gn)([(0,s.qC)("maxSimultaneousLights")],H.prototype,"_maxSimultaneousLights",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],H.prototype,"maxSimultaneousLights",void 0),(0,d.H)("BABYLON.NormalMaterial",H);p.v.ShadersStore.shadowOnlyPixelShader="precision highp float;\nuniform vec4 vEyePosition;\nuniform float alpha;\nuniform vec3 shadowColor;\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#include<helperFunctions>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#include<clipPlaneFragmentDeclaration>\n#include<fogFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=vec3(1.0,1.0,1.0);\n#endif\nvec3 diffuseBase=vec3(0.,0.,0.);\nlightingInfo info;\nfloat shadow=1.;\nfloat glossiness=0.;\n#include<lightFragment>[0..1]\nvec4 color=vec4(shadowColor,(1.0-clamp(shadow,0.,1.))*alpha);\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}";p.v.ShadersStore.shadowOnlyVertexShader="precision highp float;\nattribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nuniform mat4 view;\nuniform mat4 viewProjection;\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(position,1.0);\ngl_Position=viewProjection*worldPos;\nvPositionW=vec3(worldPos);\n#ifdef NORMAL\nvNormalW=normalize(vec3(finalWorld*vec4(normal,0.0)));\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";class X extends o.H{constructor(){super(),this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.POINTSIZE=!1,this.FOG=!1,this.NORMAL=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class j extends l.a{constructor(e,t){super(e,t),this._needAlphaBlending=!0,this.shadowColor=r.Wo.Black()}needAlphaBlending(){return this._needAlphaBlending}needAlphaTesting(){return!1}getAlphaTestTexture(){return null}get activeLight(){return this._activeLight}set activeLight(e){this._activeLight=e}_getFirstShadowLightForMesh(e){for(const t of e.lightSources)if(t.shadowEnabled)return t;return null}isReadyForSubMesh(e,t,i){var n;if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new X);const s=t.materialDefines,r=this.getScene();if(this._isReadyForSubMesh(t))return!0;const o=r.getEngine();if(this._activeLight)for(const t of e.lightSources)if(t.shadowEnabled){if(this._activeLight===t)break;const i=e.lightSources.indexOf(this._activeLight);-1!==i&&(e.lightSources.splice(i,1),e.lightSources.splice(0,0,this._activeLight));break}a.G.PrepareDefinesForFrameBoundValues(r,o,this,s,!!i),a.G.PrepareDefinesForMisc(e,r,!1,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),s),s._needNormals=a.G.PrepareDefinesForLights(r,e,s,!1,1);const l=null===(n=this._getFirstShadowLightForMesh(e))||void 0===n?void 0:n.getShadowGenerator();if(this._needAlphaBlending=!0,l&&l.getClassName&&"CascadedShadowGenerator"===l.getClassName()){const e=l;this._needAlphaBlending=!e.autoCalcDepthBounds}if(a.G.PrepareDefinesForAttributes(e,s,!1,!0),s.isDirty){s.markAsProcessed(),r.resetCachedMaterial();const i=new f.L;s.FOG&&i.addFallback(1,"FOG"),a.G.HandleFallbacksForShadows(s,i,1),s.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e),s.IMAGEPROCESSINGPOSTPROCESS=r.imageProcessingConfiguration.applyByPostProcess;const n=[c.o.PositionKind];s.NORMAL&&n.push(c.o.NormalKind),a.G.PrepareAttributesForBones(n,e,s,i),a.G.PrepareAttributesForInstances(n,s);const l="shadowOnly",h=s.toString(),u=["world","view","viewProjection","vEyePosition","vLightsType","vFogInfos","vFogColor","pointSize","alpha","shadowColor","mBones"],d=new Array,p=new Array;(0,_.qx)(u),a.G.PrepareUniformsAndSamplersList({uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:s,maxSimultaneousLights:1}),t.setEffect(r.getEngine().createEffect(l,{attributes:n,uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:h,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:1}},o),s,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(s._renderId=r.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;if(r){if(this._activeEffect=r,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,this._activeEffect),this._mustRebind(n,r)&&((0,_.an)(r,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),this._activeEffect.setFloat("alpha",this.alpha),this._activeEffect.setColor3("shadowColor",this.shadowColor),n.bindEyePosition(r)),n.lightsEnabled){a.G.BindLights(n,t,this._activeEffect,s,1);const e=this._getFirstShadowLightForMesh(t);e&&(e._renderId=-1)}(n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE||s.SHADOWCSM0)&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),this._afterBind(t,this._activeEffect)}}clone(e){return s.p4.Clone((()=>new j(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.ShadowOnlyMaterial",e}getClassName(){return"ShadowOnlyMaterial"}static Parse(e,t,i){return s.p4.Parse((()=>new j(e.name,t)),e,t,i)}}(0,d.H)("BABYLON.ShadowOnlyMaterial",j);p.v.ShadersStore.simplePixelShader="precision highp float;\nuniform vec4 vEyePosition;\nuniform vec4 vDiffuseColor;\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#include<helperFunctions>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;\nuniform sampler2D diffuseSampler;\nuniform vec2 vDiffuseInfos;\n#endif\n#include<clipPlaneFragmentDeclaration>\n#include<fogFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\nvec4 baseColor=vec4(1.,1.,1.,1.);\nvec3 diffuseColor=vDiffuseColor.rgb;\nfloat alpha=vDiffuseColor.a;\n#ifdef DIFFUSE\nbaseColor=texture2D(diffuseSampler,vDiffuseUV);\n#ifdef ALPHATEST\nif (baseColor.a<0.4)\ndiscard;\n#endif\n#include<depthPrePass>\nbaseColor.rgb*=vDiffuseInfos.y;\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nbaseColor.rgb*=vColor.rgb;\n#endif\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=vec3(1.0,1.0,1.0);\n#endif\nvec3 diffuseBase=vec3(0.,0.,0.);\nlightingInfo info;\nfloat shadow=1.;\nfloat glossiness=0.;\n#ifdef SPECULARTERM\nvec3 specularBase=vec3(0.,0.,0.);\n#endif \n#include<lightFragment>[0..maxSimultaneousLights]\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\nvec3 finalDiffuse=clamp(diffuseBase*diffuseColor,0.0,1.0)*baseColor.rgb;\nvec4 color=vec4(finalDiffuse,alpha);\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}";p.v.ShadersStore.simpleVertexShader="precision highp float;\nattribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nuniform mat4 view;\nuniform mat4 viewProjection;\n#ifdef DIFFUSE\nvarying vec2 vDiffuseUV;\nuniform mat4 diffuseMatrix;\nuniform vec2 vDiffuseInfos;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(position,1.0);\ngl_Position=viewProjection*worldPos;\nvPositionW=vec3(worldPos);\n#ifdef NORMAL\nvNormalW=normalize(vec3(finalWorld*vec4(normal,0.0)));\n#endif\n#ifndef UV1\nvec2 uv=vec2(0.,0.);\n#endif\n#ifndef UV2\nvec2 uv2=vec2(0.,0.);\n#endif\n#ifdef DIFFUSE\nif (vDiffuseInfos.x==0.)\n{\nvDiffuseUV=vec2(diffuseMatrix*vec4(uv,1.0,0.0));\n}\nelse\n{\nvDiffuseUV=vec2(diffuseMatrix*vec4(uv2,1.0,0.0));\n}\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#include<vertexColorMixing>\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";class Y extends o.H{constructor(){super(),this.DIFFUSE=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.POINTSIZE=!1,this.FOG=!1,this.NORMAL=!1,this.UV1=!1,this.UV2=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.INSTANCESCOLOR=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class q extends l.a{constructor(e,t){super(e,t),this.diffuseColor=new r.Wo(1,1,1),this._disableLighting=!1,this._maxSimultaneousLights=4}needAlphaBlending(){return this.alpha<1}needAlphaTesting(){return!1}getAlphaTestTexture(){return null}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new Y);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;const r=s.getEngine();if(n._areTexturesDirty&&(n._needUVs=!1,s.texturesEnabled&&this._diffuseTexture&&h.k.DiffuseTextureEnabled)){if(!this._diffuseTexture.isReady())return!1;n._needUVs=!0,n.DIFFUSE=!0}if(a.G.PrepareDefinesForMisc(e,s,!1,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),n),n._needNormals=a.G.PrepareDefinesForLights(s,e,n,!1,this._maxSimultaneousLights,this._disableLighting),a.G.PrepareDefinesForFrameBoundValues(s,r,this,n,!!i),a.G.PrepareDefinesForAttributes(e,n,!0,!0),n.isDirty){n.markAsProcessed(),s.resetCachedMaterial();const i=new f.L;n.FOG&&i.addFallback(1,"FOG"),a.G.HandleFallbacksForShadows(n,i,this.maxSimultaneousLights),n.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e),n.IMAGEPROCESSINGPOSTPROCESS=s.imageProcessingConfiguration.applyByPostProcess;const o=[c.o.PositionKind];n.NORMAL&&o.push(c.o.NormalKind),n.UV1&&o.push(c.o.UVKind),n.UV2&&o.push(c.o.UV2Kind),n.VERTEXCOLOR&&o.push(c.o.ColorKind),a.G.PrepareAttributesForBones(o,e,n,i),a.G.PrepareAttributesForInstances(o,n);const l="simple",h=n.toString(),u=["world","view","viewProjection","vEyePosition","vLightsType","vDiffuseColor","vFogInfos","vFogColor","pointSize","vDiffuseInfos","mBones","diffuseMatrix"],d=["diffuseSampler"],p=new Array;(0,_.qx)(u),a.G.PrepareUniformsAndSamplersList({uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:n,maxSimultaneousLights:this.maxSimultaneousLights}),t.setEffect(s.getEngine().createEffect(l,{attributes:o,uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:h,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:this._maxSimultaneousLights-1}},r),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;r&&(this._activeEffect=r,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,this._activeEffect),this._mustRebind(n,r)&&(this._diffuseTexture&&h.k.DiffuseTextureEnabled&&(this._activeEffect.setTexture("diffuseSampler",this._diffuseTexture),this._activeEffect.setFloat2("vDiffuseInfos",this._diffuseTexture.coordinatesIndex,this._diffuseTexture.level),this._activeEffect.setMatrix("diffuseMatrix",this._diffuseTexture.getTextureMatrix())),(0,_.an)(r,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),n.bindEyePosition(r)),this._activeEffect.setColor4("vDiffuseColor",this.diffuseColor,this.alpha*t.visibility),n.lightsEnabled&&!this.disableLighting&&a.G.BindLights(n,t,this._activeEffect,s,this.maxSimultaneousLights),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),this._afterBind(t,this._activeEffect))}getAnimatables(){const e=[];return this._diffuseTexture&&this._diffuseTexture.animations&&this._diffuseTexture.animations.length>0&&e.push(this._diffuseTexture),e}getActiveTextures(){const e=super.getActiveTextures();return this._diffuseTexture&&e.push(this._diffuseTexture),e}hasTexture(e){return!!super.hasTexture(e)||this.diffuseTexture===e}dispose(e){this._diffuseTexture&&this._diffuseTexture.dispose(),super.dispose(e)}clone(e){return s.p4.Clone((()=>new q(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.SimpleMaterial",e}getClassName(){return"SimpleMaterial"}static Parse(e,t,i){return s.p4.Parse((()=>new q(e.name,t)),e,t,i)}}(0,n.gn)([(0,s.oU)("diffuseTexture")],q.prototype,"_diffuseTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],q.prototype,"diffuseTexture",void 0),(0,n.gn)([(0,s.n9)("diffuse")],q.prototype,"diffuseColor",void 0),(0,n.gn)([(0,s.qC)("disableLighting")],q.prototype,"_disableLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],q.prototype,"disableLighting",void 0),(0,n.gn)([(0,s.qC)("maxSimultaneousLights")],q.prototype,"_maxSimultaneousLights",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],q.prototype,"maxSimultaneousLights",void 0),(0,d.H)("BABYLON.SimpleMaterial",q);p.v.ShadersStore.skyPixelShader="precision highp float;\nvarying vec3 vPositionW;\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<clipPlaneFragmentDeclaration>\nuniform vec3 cameraPosition;\nuniform vec3 cameraOffset;\nuniform vec3 up;\nuniform float luminance;\nuniform float turbidity;\nuniform float rayleigh;\nuniform float mieCoefficient;\nuniform float mieDirectionalG;\nuniform vec3 sunPosition;\n#include<fogFragmentDeclaration>\nconst float e=2.71828182845904523536028747135266249775724709369995957;\nconst float pi=3.141592653589793238462643383279502884197169;\nconst float n=1.0003;\nconst float N=2.545E25;\nconst float pn=0.035;\nconst vec3 lambda=vec3(680E-9,550E-9,450E-9);\nconst vec3 K=vec3(0.686,0.678,0.666);\nconst float v=4.0;\nconst float rayleighZenithLength=8.4E3;\nconst float mieZenithLength=1.25E3;\nconst float EE=1000.0;\nconst float sunAngularDiameterCos=0.999956676946448443553574619906976478926848692873900859324;\nconst float cutoffAngle=pi/1.95;\nconst float steepness=1.5;\nvec3 totalRayleigh(vec3 lambda)\n{\nreturn (8.0*pow(pi,3.0)*pow(pow(n,2.0)-1.0,2.0)*(6.0+3.0*pn))/(3.0*N*pow(lambda,vec3(4.0))*(6.0-7.0*pn));\n}\nvec3 simplifiedRayleigh()\n{\nreturn 0.0005/vec3(94,40,18);\n}\nfloat rayleighPhase(float cosTheta)\n{ \nreturn (3.0/(16.0*pi))*(1.0+pow(cosTheta,2.0));\n}\nvec3 totalMie(vec3 lambda,vec3 K,float T)\n{\nfloat c=(0.2*T )*10E-18;\nreturn 0.434*c*pi*pow((2.0*pi)/lambda,vec3(v-2.0))*K;\n}\nfloat hgPhase(float cosTheta,float g)\n{\nreturn (1.0/(4.0*pi))*((1.0-pow(g,2.0))/pow(1.0-2.0*g*cosTheta+pow(g,2.0),1.5));\n}\nfloat sunIntensity(float zenithAngleCos)\n{\nreturn EE*max(0.0,1.0-exp((-(cutoffAngle-acos(zenithAngleCos))/steepness)));\n}\nfloat A=0.15;\nfloat B=0.50;\nfloat C=0.10;\nfloat D=0.20;\nfloat EEE=0.02;\nfloat F=0.30;\nfloat W=1000.0;\nvec3 Uncharted2Tonemap(vec3 x)\n{\nreturn ((x*(A*x+C*B)+D*EEE)/(x*(A*x+B)+D*F))-EEE/F;\n}\n#if DITHER\n#include<helperFunctions>\n#endif\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\n/**\n*--------------------------------------------------------------------------------------------------\n* Sky Color\n*--------------------------------------------------------------------------------------------------\n*/\nfloat sunfade=1.0-clamp(1.0-exp((sunPosition.y/450000.0)),0.0,1.0);\nfloat rayleighCoefficient=rayleigh-(1.0*(1.0-sunfade));\nvec3 sunDirection=normalize(sunPosition);\nfloat sunE=sunIntensity(dot(sunDirection,up));\nvec3 betaR=simplifiedRayleigh()*rayleighCoefficient;\nvec3 betaM=totalMie(lambda,K,turbidity)*mieCoefficient;\nfloat zenithAngle=acos(max(0.0,dot(up,normalize(vPositionW-cameraPosition+cameraOffset))));\nfloat sR=rayleighZenithLength/(cos(zenithAngle)+0.15*pow(93.885-((zenithAngle*180.0)/pi),-1.253));\nfloat sM=mieZenithLength/(cos(zenithAngle)+0.15*pow(93.885-((zenithAngle*180.0)/pi),-1.253));\nvec3 Fex=exp(-(betaR*sR+betaM*sM));\nfloat cosTheta=dot(normalize(vPositionW-cameraPosition),sunDirection);\nfloat rPhase=rayleighPhase(cosTheta*0.5+0.5);\nvec3 betaRTheta=betaR*rPhase;\nfloat mPhase=hgPhase(cosTheta,mieDirectionalG);\nvec3 betaMTheta=betaM*mPhase;\nvec3 Lin=pow(sunE*((betaRTheta+betaMTheta)/(betaR+betaM))*(1.0-Fex),vec3(1.5));\nLin*=mix(vec3(1.0),pow(sunE*((betaRTheta+betaMTheta)/(betaR+betaM))*Fex,vec3(1.0/2.0)),clamp(pow(1.0-dot(up,sunDirection),5.0),0.0,1.0));\nvec3 direction=normalize(vPositionW-cameraPosition);\nfloat theta=acos(direction.y);\nfloat phi=atan(direction.z,direction.x);\nvec2 uv=vec2(phi,theta)/vec2(2.0*pi,pi)+vec2(0.5,0.0);\nvec3 L0=vec3(0.1)*Fex;\nfloat sundisk=smoothstep(sunAngularDiameterCos,sunAngularDiameterCos+0.00002,cosTheta);\nL0+=(sunE*19000.0*Fex)*sundisk;\nvec3 whiteScale=1.0/Uncharted2Tonemap(vec3(W));\nvec3 texColor=(Lin+L0);\ntexColor*=0.04 ;\ntexColor+=vec3(0.0,0.001,0.0025)*0.3;\nfloat g_fMaxLuminance=1.0;\nfloat fLumScaled=0.1/luminance; \nfloat fLumCompressed=(fLumScaled*(1.0+(fLumScaled/(g_fMaxLuminance*g_fMaxLuminance))))/(1.0+fLumScaled); \nfloat ExposureBias=fLumCompressed;\nvec3 curr=Uncharted2Tonemap((log2(2.0/pow(luminance,4.0)))*texColor);\nvec3 retColor=curr*whiteScale;\n/**\n*--------------------------------------------------------------------------------------------------\n* Sky Color\n*--------------------------------------------------------------------------------------------------\n*/\nfloat alpha=1.0;\n#ifdef VERTEXCOLOR\nretColor.rgb*=vColor.rgb;\n#endif\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\n#if DITHER\nretColor.rgb+=dither(gl_FragCoord.xy,0.5);\n#endif\nvec4 color=clamp(vec4(retColor.rgb,alpha),0.0,1.0);\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n";p.v.ShadersStore.skyVertexShader="precision highp float;\nattribute vec3 position;\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\nuniform mat4 world;\nuniform mat4 view;\nuniform mat4 viewProjection;\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef VERTEXCOLOR\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\ngl_Position=viewProjection*world*vec4(position,1.0);\nvec4 worldPos=world*vec4(position,1.0);\nvPositionW=vec3(worldPos);\n#include<clipPlaneVertex>\n#include<fogVertex>\n#ifdef VERTEXCOLOR\nvColor=color;\n#endif\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";class K extends o.H{constructor(){super(),this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.POINTSIZE=!1,this.FOG=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.DITHER=!1,this.rebuild()}}class $ extends l.a{constructor(e,t){super(e,t),this.luminance=1,this.turbidity=10,this.rayleigh=2,this.mieCoefficient=.005,this.mieDirectionalG=.8,this.distance=500,this.inclination=.49,this.azimuth=.25,this.sunPosition=new D.P(0,100,0),this.useSunPosition=!1,this.cameraOffset=D.P.Zero(),this.up=D.P.Up(),this.dithering=!1,this._cameraPosition=D.P.Zero(),this._skyOrientation=new D._f}needAlphaBlending(){return this.alpha<1}needAlphaTesting(){return!1}getAlphaTestTexture(){return null}isReadyForSubMesh(e,t){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady)return!0;t.materialDefines||(t.materialDefines=new K);const i=t.materialDefines,n=this.getScene();if(this._isReadyForSubMesh(t))return!0;if(a.G.PrepareDefinesForMisc(e,n,!1,this.pointsCloud,this.fogEnabled,!1,i),a.G.PrepareDefinesForAttributes(e,i,!0,!1),i.IMAGEPROCESSINGPOSTPROCESS!==n.imageProcessingConfiguration.applyByPostProcess&&i.markAsMiscDirty(),i.DITHER!==this.dithering&&i.markAsMiscDirty(),i.isDirty){i.markAsProcessed(),n.resetCachedMaterial();const e=new f.L;i.FOG&&e.addFallback(1,"FOG"),i.IMAGEPROCESSINGPOSTPROCESS=n.imageProcessingConfiguration.applyByPostProcess,i.DITHER=this.dithering;const s=[c.o.PositionKind];i.VERTEXCOLOR&&s.push(c.o.ColorKind);const r="sky",o=["world","viewProjection","view","vFogInfos","vFogColor","pointSize","luminance","turbidity","rayleigh","mieCoefficient","mieDirectionalG","sunPosition","cameraPosition","cameraOffset","up"];(0,_.qx)(o);const a=i.toString();t.setEffect(n.getEngine().createEffect(r,s,o,[],a,e,this.onCompiled,this.onError),i,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(i._renderId=n.getRenderId(),t.effect._wasPreviouslyReady=!0,0))}bindForSubMesh(e,t,i){const n=this.getScene();if(!i.materialDefines)return;const s=i.effect;if(!s)return;this._activeEffect=s,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),this._mustRebind(n,s)&&((0,_.an)(s,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize)),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect);const r=n.activeCamera;if(r){const e=r.getWorldMatrix();this._cameraPosition.x=e.m[12],this._cameraPosition.y=e.m[13],this._cameraPosition.z=e.m[14],this._activeEffect.setVector3("cameraPosition",this._cameraPosition)}if(this._activeEffect.setVector3("cameraOffset",this.cameraOffset),this._activeEffect.setVector3("up",this.up),this.luminance>0&&this._activeEffect.setFloat("luminance",this.luminance),this._activeEffect.setFloat("turbidity",this.turbidity),this._activeEffect.setFloat("rayleigh",this.rayleigh),this._activeEffect.setFloat("mieCoefficient",this.mieCoefficient),this._activeEffect.setFloat("mieDirectionalG",this.mieDirectionalG),!this.useSunPosition){const e=Math.PI*(this.inclination-.5),t=2*Math.PI*(this.azimuth-.5);this.sunPosition.x=this.distance*Math.cos(t)*Math.cos(e),this.sunPosition.y=this.distance*Math.sin(-e),this.sunPosition.z=this.distance*Math.sin(t)*Math.cos(e),D._f.FromUnitVectorsToRef(D.P.UpReadOnly,this.up,this._skyOrientation),this.sunPosition.rotateByQuaternionToRef(this._skyOrientation,this.sunPosition)}this._activeEffect.setVector3("sunPosition",this.sunPosition),this._afterBind(t,this._activeEffect)}getAnimatables(){return[]}dispose(e){super.dispose(e)}clone(e){return s.p4.Clone((()=>new $(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.SkyMaterial",e}getClassName(){return"SkyMaterial"}static Parse(e,t,i){return s.p4.Parse((()=>new $(e.name,t)),e,t,i)}}(0,n.gn)([(0,s.qC)()],$.prototype,"luminance",void 0),(0,n.gn)([(0,s.qC)()],$.prototype,"turbidity",void 0),(0,n.gn)([(0,s.qC)()],$.prototype,"rayleigh",void 0),(0,n.gn)([(0,s.qC)()],$.prototype,"mieCoefficient",void 0),(0,n.gn)([(0,s.qC)()],$.prototype,"mieDirectionalG",void 0),(0,n.gn)([(0,s.qC)()],$.prototype,"distance",void 0),(0,n.gn)([(0,s.qC)()],$.prototype,"inclination",void 0),(0,n.gn)([(0,s.qC)()],$.prototype,"azimuth",void 0),(0,n.gn)([(0,s.hd)()],$.prototype,"sunPosition",void 0),(0,n.gn)([(0,s.qC)()],$.prototype,"useSunPosition",void 0),(0,n.gn)([(0,s.hd)()],$.prototype,"cameraOffset",void 0),(0,n.gn)([(0,s.hd)()],$.prototype,"up",void 0),(0,n.gn)([(0,s.qC)()],$.prototype,"dithering",void 0),(0,d.H)("BABYLON.SkyMaterial",$);p.v.ShadersStore.terrainPixelShader="precision highp float;\nuniform vec4 vEyePosition;\nuniform vec4 vDiffuseColor;\n#ifdef SPECULARTERM\nuniform vec4 vSpecularColor;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#include<helperFunctions>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#ifdef DIFFUSE\nvarying vec2 vTextureUV;\nuniform sampler2D textureSampler;\nuniform vec2 vTextureInfos;\nuniform sampler2D diffuse1Sampler;\nuniform sampler2D diffuse2Sampler;\nuniform sampler2D diffuse3Sampler;\nuniform vec2 diffuse1Infos;\nuniform vec2 diffuse2Infos;\nuniform vec2 diffuse3Infos;\n#endif\n#ifdef BUMP\nuniform sampler2D bump1Sampler;\nuniform sampler2D bump2Sampler;\nuniform sampler2D bump3Sampler;\n#endif\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#include<clipPlaneFragmentDeclaration>\n#include<fogFragmentDeclaration>\n#ifdef BUMP\n#extension GL_OES_standard_derivatives : enable\nmat3 cotangent_frame(vec3 normal,vec3 p,vec2 uv)\n{\nvec3 dp1=dFdx(p);\nvec3 dp2=dFdy(p);\nvec2 duv1=dFdx(uv);\nvec2 duv2=dFdy(uv);\nvec3 dp2perp=cross(dp2,normal);\nvec3 dp1perp=cross(normal,dp1);\nvec3 tangent=dp2perp*duv1.x+dp1perp*duv2.x;\nvec3 binormal=dp2perp*duv1.y+dp1perp*duv2.y;\nfloat invmax=inversesqrt(max(dot(tangent,tangent),dot(binormal,binormal)));\nreturn mat3(tangent*invmax,binormal*invmax,normal);\n}\nvec3 perturbNormal(vec3 viewDir,vec3 mixColor)\n{\nvec3 bump1Color=texture2D(bump1Sampler,vTextureUV*diffuse1Infos).xyz;\nvec3 bump2Color=texture2D(bump2Sampler,vTextureUV*diffuse2Infos).xyz;\nvec3 bump3Color=texture2D(bump3Sampler,vTextureUV*diffuse3Infos).xyz;\nbump1Color.rgb*=mixColor.r;\nbump2Color.rgb=mix(bump1Color.rgb,bump2Color.rgb,mixColor.g);\nvec3 map=mix(bump2Color.rgb,bump3Color.rgb,mixColor.b);\nmap=map*255./127.-128./127.;\nmat3 TBN=cotangent_frame(vNormalW*vTextureInfos.y,-viewDir,vTextureUV);\nreturn normalize(TBN*map);\n}\n#endif\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\nvec4 baseColor=vec4(1.,1.,1.,1.);\nvec3 diffuseColor=vDiffuseColor.rgb;\n#ifdef SPECULARTERM\nfloat glossiness=vSpecularColor.a;\nvec3 specularColor=vSpecularColor.rgb;\n#else\nfloat glossiness=0.;\n#endif\nfloat alpha=vDiffuseColor.a;\n#ifdef NORMAL\nvec3 normalW=normalize(vNormalW);\n#else\nvec3 normalW=vec3(1.0,1.0,1.0);\n#endif\n#ifdef DIFFUSE\nbaseColor=texture2D(textureSampler,vTextureUV);\n#if defined(BUMP) && defined(DIFFUSE)\nnormalW=perturbNormal(viewDirectionW,baseColor.rgb);\n#endif\n#ifdef ALPHATEST\nif (baseColor.a<0.4)\ndiscard;\n#endif\n#include<depthPrePass>\nbaseColor.rgb*=vTextureInfos.y;\nvec4 diffuse1Color=texture2D(diffuse1Sampler,vTextureUV*diffuse1Infos);\nvec4 diffuse2Color=texture2D(diffuse2Sampler,vTextureUV*diffuse2Infos);\nvec4 diffuse3Color=texture2D(diffuse3Sampler,vTextureUV*diffuse3Infos);\ndiffuse1Color.rgb*=baseColor.r;\ndiffuse2Color.rgb=mix(diffuse1Color.rgb,diffuse2Color.rgb,baseColor.g);\nbaseColor.rgb=mix(diffuse2Color.rgb,diffuse3Color.rgb,baseColor.b);\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nbaseColor.rgb*=vColor.rgb;\n#endif\nvec3 diffuseBase=vec3(0.,0.,0.);\nlightingInfo info;\nfloat shadow=1.;\n#ifdef SPECULARTERM\nvec3 specularBase=vec3(0.,0.,0.);\n#endif\n#include<lightFragment>[0..maxSimultaneousLights]\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\n#ifdef SPECULARTERM\nvec3 finalSpecular=specularBase*specularColor;\n#else\nvec3 finalSpecular=vec3(0.0);\n#endif\nvec3 finalDiffuse=clamp(diffuseBase*diffuseColor*baseColor.rgb,0.0,1.0);\nvec4 color=vec4(finalDiffuse+finalSpecular,alpha);\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n";p.v.ShadersStore.terrainVertexShader="precision highp float;attribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nuniform mat4 view;uniform mat4 viewProjection;\n#ifdef DIFFUSE\nvarying vec2 vTextureUV;uniform mat4 textureMatrix;uniform vec2 vTextureInfos;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(position,1.0);gl_Position=viewProjection*worldPos;vPositionW=vec3(worldPos);\n#ifdef NORMAL\nvNormalW=normalize(vec3(finalWorld*vec4(normal,0.0)));\n#endif\n#ifndef UV1\nvec2 uv=vec2(0.,0.);\n#endif\n#ifndef UV2\nvec2 uv2=vec2(0.,0.);\n#endif\n#ifdef DIFFUSE\nif (vTextureInfos.x==0.)\n{vTextureUV=vec2(textureMatrix*vec4(uv,1.0,0.0));}\nelse\n{vTextureUV=vec2(textureMatrix*vec4(uv2,1.0,0.0));}\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#include<vertexColorMixing>\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";class Q extends o.H{constructor(){super(),this.DIFFUSE=!1,this.BUMP=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.POINTSIZE=!1,this.FOG=!1,this.SPECULARTERM=!1,this.NORMAL=!1,this.UV1=!1,this.UV2=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.INSTANCESCOLOR=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class Z extends l.a{constructor(e,t){super(e,t),this.diffuseColor=new r.Wo(1,1,1),this.specularColor=new r.Wo(0,0,0),this.specularPower=64,this._disableLighting=!1,this._maxSimultaneousLights=4}needAlphaBlending(){return this.alpha<1}needAlphaTesting(){return!1}getAlphaTestTexture(){return null}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new Q);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;const r=s.getEngine();if(s.texturesEnabled){if(!this.mixTexture||!this.mixTexture.isReady())return!1;if(n._needUVs=!0,h.k.DiffuseTextureEnabled){if(!this.diffuseTexture1||!this.diffuseTexture1.isReady())return!1;if(!this.diffuseTexture2||!this.diffuseTexture2.isReady())return!1;if(!this.diffuseTexture3||!this.diffuseTexture3.isReady())return!1;n.DIFFUSE=!0}if(this.bumpTexture1&&this.bumpTexture2&&this.bumpTexture3&&h.k.BumpTextureEnabled){if(!this.bumpTexture1.isReady())return!1;if(!this.bumpTexture2.isReady())return!1;if(!this.bumpTexture3.isReady())return!1;n._needNormals=!0,n.BUMP=!0}}if(a.G.PrepareDefinesForMisc(e,s,!1,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),n),n._needNormals=a.G.PrepareDefinesForLights(s,e,n,!1,this._maxSimultaneousLights,this._disableLighting),a.G.PrepareDefinesForFrameBoundValues(s,r,this,n,!!i),a.G.PrepareDefinesForAttributes(e,n,!0,!0),n.isDirty){n.markAsProcessed(),s.resetCachedMaterial();const i=new f.L;n.FOG&&i.addFallback(1,"FOG"),a.G.HandleFallbacksForShadows(n,i,this.maxSimultaneousLights),n.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e),n.IMAGEPROCESSINGPOSTPROCESS=s.imageProcessingConfiguration.applyByPostProcess;const o=[c.o.PositionKind];n.NORMAL&&o.push(c.o.NormalKind),n.UV1&&o.push(c.o.UVKind),n.UV2&&o.push(c.o.UV2Kind),n.VERTEXCOLOR&&o.push(c.o.ColorKind),a.G.PrepareAttributesForBones(o,e,n,i),a.G.PrepareAttributesForInstances(o,n);const l="terrain",h=n.toString(),u=["world","view","viewProjection","vEyePosition","vLightsType","vDiffuseColor","vSpecularColor","vFogInfos","vFogColor","pointSize","vTextureInfos","mBones","textureMatrix","diffuse1Infos","diffuse2Infos","diffuse3Infos"],d=["textureSampler","diffuse1Sampler","diffuse2Sampler","diffuse3Sampler","bump1Sampler","bump2Sampler","bump3Sampler"],p=new Array;(0,_.qx)(u),a.G.PrepareUniformsAndSamplersList({uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:n,maxSimultaneousLights:this.maxSimultaneousLights}),t.setEffect(s.getEngine().createEffect(l,{attributes:o,uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:h,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:this.maxSimultaneousLights}},r),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;r&&(this._activeEffect=r,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,this._activeEffect),this._mustRebind(n,r)&&(this.mixTexture&&(this._activeEffect.setTexture("textureSampler",this._mixTexture),this._activeEffect.setFloat2("vTextureInfos",this._mixTexture.coordinatesIndex,this._mixTexture.level),this._activeEffect.setMatrix("textureMatrix",this._mixTexture.getTextureMatrix()),h.k.DiffuseTextureEnabled&&(this._diffuseTexture1&&(this._activeEffect.setTexture("diffuse1Sampler",this._diffuseTexture1),this._activeEffect.setFloat2("diffuse1Infos",this._diffuseTexture1.uScale,this._diffuseTexture1.vScale)),this._diffuseTexture2&&(this._activeEffect.setTexture("diffuse2Sampler",this._diffuseTexture2),this._activeEffect.setFloat2("diffuse2Infos",this._diffuseTexture2.uScale,this._diffuseTexture2.vScale)),this._diffuseTexture3&&(this._activeEffect.setTexture("diffuse3Sampler",this._diffuseTexture3),this._activeEffect.setFloat2("diffuse3Infos",this._diffuseTexture3.uScale,this._diffuseTexture3.vScale))),h.k.BumpTextureEnabled&&n.getEngine().getCaps().standardDerivatives&&(this._bumpTexture1&&this._activeEffect.setTexture("bump1Sampler",this._bumpTexture1),this._bumpTexture2&&this._activeEffect.setTexture("bump2Sampler",this._bumpTexture2),this._bumpTexture3&&this._activeEffect.setTexture("bump3Sampler",this._bumpTexture3))),(0,_.an)(r,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),n.bindEyePosition(r)),this._activeEffect.setColor4("vDiffuseColor",this.diffuseColor,this.alpha*t.visibility),s.SPECULARTERM&&this._activeEffect.setColor4("vSpecularColor",this.specularColor,this.specularPower),n.lightsEnabled&&!this.disableLighting&&a.G.BindLights(n,t,this._activeEffect,s,this.maxSimultaneousLights),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),this._afterBind(t,this._activeEffect))}getAnimatables(){const e=[];return this.mixTexture&&this.mixTexture.animations&&this.mixTexture.animations.length>0&&e.push(this.mixTexture),e}getActiveTextures(){const e=super.getActiveTextures();return this._mixTexture&&e.push(this._mixTexture),this._diffuseTexture1&&e.push(this._diffuseTexture1),this._diffuseTexture2&&e.push(this._diffuseTexture2),this._diffuseTexture3&&e.push(this._diffuseTexture3),this._bumpTexture1&&e.push(this._bumpTexture1),this._bumpTexture2&&e.push(this._bumpTexture2),this._bumpTexture3&&e.push(this._bumpTexture3),e}hasTexture(e){return!!super.hasTexture(e)||this._mixTexture===e||this._diffuseTexture1===e||this._diffuseTexture2===e||this._diffuseTexture3===e||this._bumpTexture1===e||this._bumpTexture2===e||this._bumpTexture3===e}dispose(e){this.mixTexture&&this.mixTexture.dispose(),super.dispose(e)}clone(e){return s.p4.Clone((()=>new Z(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.TerrainMaterial",e}getClassName(){return"TerrainMaterial"}static Parse(e,t,i){return s.p4.Parse((()=>new Z(e.name,t)),e,t,i)}}(0,n.gn)([(0,s.oU)("mixTexture")],Z.prototype,"_mixTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],Z.prototype,"mixTexture",void 0),(0,n.gn)([(0,s.oU)("diffuseTexture1")],Z.prototype,"_diffuseTexture1",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],Z.prototype,"diffuseTexture1",void 0),(0,n.gn)([(0,s.oU)("diffuseTexture2")],Z.prototype,"_diffuseTexture2",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],Z.prototype,"diffuseTexture2",void 0),(0,n.gn)([(0,s.oU)("diffuseTexture3")],Z.prototype,"_diffuseTexture3",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],Z.prototype,"diffuseTexture3",void 0),(0,n.gn)([(0,s.oU)("bumpTexture1")],Z.prototype,"_bumpTexture1",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],Z.prototype,"bumpTexture1",void 0),(0,n.gn)([(0,s.oU)("bumpTexture2")],Z.prototype,"_bumpTexture2",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],Z.prototype,"bumpTexture2",void 0),(0,n.gn)([(0,s.oU)("bumpTexture3")],Z.prototype,"_bumpTexture3",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],Z.prototype,"bumpTexture3",void 0),(0,n.gn)([(0,s.n9)()],Z.prototype,"diffuseColor",void 0),(0,n.gn)([(0,s.n9)()],Z.prototype,"specularColor",void 0),(0,n.gn)([(0,s.qC)()],Z.prototype,"specularPower",void 0),(0,n.gn)([(0,s.qC)("disableLighting")],Z.prototype,"_disableLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],Z.prototype,"disableLighting",void 0),(0,n.gn)([(0,s.qC)("maxSimultaneousLights")],Z.prototype,"_maxSimultaneousLights",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],Z.prototype,"maxSimultaneousLights",void 0),(0,d.H)("BABYLON.TerrainMaterial",Z);p.v.ShadersStore.triplanarPixelShader="precision highp float;\nuniform vec4 vEyePosition;\nuniform vec4 vDiffuseColor;\n#ifdef SPECULARTERM\nuniform vec4 vSpecularColor;\n#endif\nvarying vec3 vPositionW;\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#include<helperFunctions>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#ifdef DIFFUSEX\nvarying vec2 vTextureUVX;\nuniform sampler2D diffuseSamplerX;\n#ifdef BUMPX\nuniform sampler2D normalSamplerX;\n#endif\n#endif\n#ifdef DIFFUSEY\nvarying vec2 vTextureUVY;\nuniform sampler2D diffuseSamplerY;\n#ifdef BUMPY\nuniform sampler2D normalSamplerY;\n#endif\n#endif\n#ifdef DIFFUSEZ\nvarying vec2 vTextureUVZ;\nuniform sampler2D diffuseSamplerZ;\n#ifdef BUMPZ\nuniform sampler2D normalSamplerZ;\n#endif\n#endif\n#ifdef NORMAL\nvarying mat3 tangentSpace;\n#endif\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#include<clipPlaneFragmentDeclaration>\n#include<fogFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\nvec4 baseColor=vec4(0.,0.,0.,1.);\nvec3 diffuseColor=vDiffuseColor.rgb;\nfloat alpha=vDiffuseColor.a;\n#ifdef NORMAL\nvec3 normalW=tangentSpace[2];\n#else\nvec3 normalW=vec3(1.0,1.0,1.0);\n#endif\nvec4 baseNormal=vec4(0.0,0.0,0.0,1.0);\nnormalW*=normalW;\n#ifdef DIFFUSEX\nbaseColor+=texture2D(diffuseSamplerX,vTextureUVX)*normalW.x;\n#ifdef BUMPX\nbaseNormal+=texture2D(normalSamplerX,vTextureUVX)*normalW.x;\n#endif\n#endif\n#ifdef DIFFUSEY\nbaseColor+=texture2D(diffuseSamplerY,vTextureUVY)*normalW.y;\n#ifdef BUMPY\nbaseNormal+=texture2D(normalSamplerY,vTextureUVY)*normalW.y;\n#endif\n#endif\n#ifdef DIFFUSEZ\nbaseColor+=texture2D(diffuseSamplerZ,vTextureUVZ)*normalW.z;\n#ifdef BUMPZ\nbaseNormal+=texture2D(normalSamplerZ,vTextureUVZ)*normalW.z;\n#endif\n#endif\n#ifdef NORMAL\nnormalW=normalize((2.0*baseNormal.xyz-1.0)*tangentSpace);\n#endif\n#ifdef ALPHATEST\nif (baseColor.a<0.4)\ndiscard;\n#endif\n#include<depthPrePass>\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nbaseColor.rgb*=vColor.rgb;\n#endif\nvec3 diffuseBase=vec3(0.,0.,0.);\nlightingInfo info;\nfloat shadow=1.;\n#ifdef SPECULARTERM\nfloat glossiness=vSpecularColor.a;\nvec3 specularBase=vec3(0.,0.,0.);\nvec3 specularColor=vSpecularColor.rgb;\n#else\nfloat glossiness=0.;\n#endif\n#include<lightFragment>[0..maxSimultaneousLights]\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\n#ifdef SPECULARTERM\nvec3 finalSpecular=specularBase*specularColor;\n#else\nvec3 finalSpecular=vec3(0.0);\n#endif\nvec3 finalDiffuse=clamp(diffuseBase*diffuseColor,0.0,1.0)*baseColor.rgb;\nvec4 color=vec4(finalDiffuse+finalSpecular,alpha);\n#include<fogFragment>\ngl_FragColor=color;\n#include<imageProcessingCompatibility>\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n";p.v.ShadersStore.triplanarVertexShader="precision highp float;\nattribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nuniform mat4 view;\nuniform mat4 viewProjection;\n#ifdef DIFFUSEX\nvarying vec2 vTextureUVX;\n#endif\n#ifdef DIFFUSEY\nvarying vec2 vTextureUVY;\n#endif\n#ifdef DIFFUSEZ\nvarying vec2 vTextureUVZ;\n#endif\nuniform float tileSize;\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying mat3 tangentSpace;\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void)\n{\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(position,1.0);\ngl_Position=viewProjection*worldPos;\nvPositionW=vec3(worldPos);\n#ifdef DIFFUSEX\nvTextureUVX=worldPos.zy/tileSize;\n#endif\n#ifdef DIFFUSEY\nvTextureUVY=worldPos.xz/tileSize;\n#endif\n#ifdef DIFFUSEZ\nvTextureUVZ=worldPos.xy/tileSize;\n#endif\n#ifdef NORMAL\nvec3 xtan=vec3(0,0,1);\nvec3 xbin=vec3(0,1,0);\nvec3 ytan=vec3(1,0,0);\nvec3 ybin=vec3(0,0,1);\nvec3 ztan=vec3(1,0,0);\nvec3 zbin=vec3(0,1,0);\nvec3 normalizedNormal=normalize(normal);\nnormalizedNormal*=normalizedNormal;\nvec3 worldBinormal=normalize(xbin*normalizedNormal.x+ybin*normalizedNormal.y+zbin*normalizedNormal.z);\nvec3 worldTangent=normalize(xtan*normalizedNormal.x+ytan*normalizedNormal.y+ztan*normalizedNormal.z);\nworldTangent=(world*vec4(worldTangent,0.0)).xyz;\nworldBinormal=(world*vec4(worldBinormal,0.0)).xyz;\nvec3 worldNormal=(world*vec4(normalize(normal),0.0)).xyz;\ntangentSpace[0]=worldTangent;\ntangentSpace[1]=worldBinormal;\ntangentSpace[2]=worldNormal;\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#include<vertexColorMixing>\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\n#define CUSTOM_VERTEX_MAIN_END\n}\n";class J extends o.H{constructor(){super(),this.DIFFUSEX=!1,this.DIFFUSEY=!1,this.DIFFUSEZ=!1,this.BUMPX=!1,this.BUMPY=!1,this.BUMPZ=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.POINTSIZE=!1,this.FOG=!1,this.SPECULARTERM=!1,this.NORMAL=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.INSTANCESCOLOR=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class ee extends l.a{constructor(e,t){super(e,t),this.tileSize=1,this.diffuseColor=new r.Wo(1,1,1),this.specularColor=new r.Wo(.2,.2,.2),this.specularPower=64,this._disableLighting=!1,this._maxSimultaneousLights=4}needAlphaBlending(){return this.alpha<1}needAlphaTesting(){return!1}getAlphaTestTexture(){return null}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new J);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;const r=s.getEngine();if(n._areTexturesDirty&&s.texturesEnabled){if(h.k.DiffuseTextureEnabled){const e=[this.diffuseTextureX,this.diffuseTextureY,this.diffuseTextureZ],t=["DIFFUSEX","DIFFUSEY","DIFFUSEZ"];for(let i=0;i<e.length;i++)if(e[i]){if(!e[i].isReady())return!1;n[t[i]]=!0}}if(h.k.BumpTextureEnabled){const e=[this.normalTextureX,this.normalTextureY,this.normalTextureZ],t=["BUMPX","BUMPY","BUMPZ"];for(let i=0;i<e.length;i++)if(e[i]){if(!e[i].isReady())return!1;n[t[i]]=!0}}}if(a.G.PrepareDefinesForMisc(e,s,!1,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),n),n._needNormals=a.G.PrepareDefinesForLights(s,e,n,!1,this._maxSimultaneousLights,this._disableLighting),a.G.PrepareDefinesForFrameBoundValues(s,r,this,n,!!i),a.G.PrepareDefinesForAttributes(e,n,!0,!0),n.isDirty){n.markAsProcessed(),s.resetCachedMaterial();const i=new f.L;n.FOG&&i.addFallback(1,"FOG"),a.G.HandleFallbacksForShadows(n,i,this.maxSimultaneousLights),n.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e),n.IMAGEPROCESSINGPOSTPROCESS=s.imageProcessingConfiguration.applyByPostProcess;const o=[c.o.PositionKind];n.NORMAL&&o.push(c.o.NormalKind),n.VERTEXCOLOR&&o.push(c.o.ColorKind),a.G.PrepareAttributesForBones(o,e,n,i),a.G.PrepareAttributesForInstances(o,n);const l="triplanar",h=n.toString(),u=["world","view","viewProjection","vEyePosition","vLightsType","vDiffuseColor","vSpecularColor","vFogInfos","vFogColor","pointSize","mBones","tileSize"],d=["diffuseSamplerX","diffuseSamplerY","diffuseSamplerZ","normalSamplerX","normalSamplerY","normalSamplerZ"],p=new Array;(0,_.qx)(u),a.G.PrepareUniformsAndSamplersList({uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:n,maxSimultaneousLights:this.maxSimultaneousLights}),t.setEffect(s.getEngine().createEffect(l,{attributes:o,uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:h,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:this.maxSimultaneousLights}},r),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;r&&(this._activeEffect=r,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,this._activeEffect),this._activeEffect.setFloat("tileSize",this.tileSize),n.getCachedMaterial()!==this&&(this.diffuseTextureX&&this._activeEffect.setTexture("diffuseSamplerX",this.diffuseTextureX),this.diffuseTextureY&&this._activeEffect.setTexture("diffuseSamplerY",this.diffuseTextureY),this.diffuseTextureZ&&this._activeEffect.setTexture("diffuseSamplerZ",this.diffuseTextureZ),this.normalTextureX&&this._activeEffect.setTexture("normalSamplerX",this.normalTextureX),this.normalTextureY&&this._activeEffect.setTexture("normalSamplerY",this.normalTextureY),this.normalTextureZ&&this._activeEffect.setTexture("normalSamplerZ",this.normalTextureZ),(0,_.an)(r,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),n.bindEyePosition(r)),this._activeEffect.setColor4("vDiffuseColor",this.diffuseColor,this.alpha*t.visibility),s.SPECULARTERM&&this._activeEffect.setColor4("vSpecularColor",this.specularColor,this.specularPower),n.lightsEnabled&&!this.disableLighting&&a.G.BindLights(n,t,this._activeEffect,s,this.maxSimultaneousLights),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),this._afterBind(t,this._activeEffect))}getAnimatables(){const e=[];return this.mixTexture&&this.mixTexture.animations&&this.mixTexture.animations.length>0&&e.push(this.mixTexture),e}getActiveTextures(){const e=super.getActiveTextures();return this._diffuseTextureX&&e.push(this._diffuseTextureX),this._diffuseTextureY&&e.push(this._diffuseTextureY),this._diffuseTextureZ&&e.push(this._diffuseTextureZ),this._normalTextureX&&e.push(this._normalTextureX),this._normalTextureY&&e.push(this._normalTextureY),this._normalTextureZ&&e.push(this._normalTextureZ),e}hasTexture(e){return!!super.hasTexture(e)||this._diffuseTextureX===e||this._diffuseTextureY===e||this._diffuseTextureZ===e||this._normalTextureX===e||this._normalTextureY===e||this._normalTextureZ===e}dispose(e){this.mixTexture&&this.mixTexture.dispose(),super.dispose(e)}clone(e){return s.p4.Clone((()=>new ee(e,this.getScene())),this)}serialize(){const e=super.serialize();return e.customType="BABYLON.TriPlanarMaterial",e}getClassName(){return"TriPlanarMaterial"}static Parse(e,t,i){return s.p4.Parse((()=>new ee(e.name,t)),e,t,i)}}(0,n.gn)([(0,s.oU)()],ee.prototype,"mixTexture",void 0),(0,n.gn)([(0,s.oU)("diffuseTextureX")],ee.prototype,"_diffuseTextureX",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],ee.prototype,"diffuseTextureX",void 0),(0,n.gn)([(0,s.oU)("diffuseTexturY")],ee.prototype,"_diffuseTextureY",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],ee.prototype,"diffuseTextureY",void 0),(0,n.gn)([(0,s.oU)("diffuseTextureZ")],ee.prototype,"_diffuseTextureZ",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],ee.prototype,"diffuseTextureZ",void 0),(0,n.gn)([(0,s.oU)("normalTextureX")],ee.prototype,"_normalTextureX",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],ee.prototype,"normalTextureX",void 0),(0,n.gn)([(0,s.oU)("normalTextureY")],ee.prototype,"_normalTextureY",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],ee.prototype,"normalTextureY",void 0),(0,n.gn)([(0,s.oU)("normalTextureZ")],ee.prototype,"_normalTextureZ",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],ee.prototype,"normalTextureZ",void 0),(0,n.gn)([(0,s.qC)()],ee.prototype,"tileSize",void 0),(0,n.gn)([(0,s.n9)()],ee.prototype,"diffuseColor",void 0),(0,n.gn)([(0,s.n9)()],ee.prototype,"specularColor",void 0),(0,n.gn)([(0,s.qC)()],ee.prototype,"specularPower",void 0),(0,n.gn)([(0,s.qC)("disableLighting")],ee.prototype,"_disableLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],ee.prototype,"disableLighting",void 0),(0,n.gn)([(0,s.qC)("maxSimultaneousLights")],ee.prototype,"_maxSimultaneousLights",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],ee.prototype,"maxSimultaneousLights",void 0),(0,d.H)("BABYLON.TriPlanarMaterial",ee);var te=i(142),ie=i(7458),ne=i(5363),se=i(4246),re=i(4475);i(5141),i(3660),i(1030),i(8773);p.v.ShadersStore.waterPixelShader="#ifdef LOGARITHMICDEPTH\n#extension GL_EXT_frag_depth : enable\n#endif\nprecision highp float;\nuniform vec4 vEyePosition;\nuniform vec4 vDiffuseColor;\n#ifdef SPECULARTERM\nuniform vec4 vSpecularColor;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#include<helperFunctions>\n#include<imageProcessingDeclaration>\n#include<imageProcessingFunctions>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#include<lightsFragmentFunctions>\n#include<shadowsFragmentFunctions>\n#ifdef BUMP\nvarying vec2 vNormalUV;\n#ifdef BUMPSUPERIMPOSE\nvarying vec2 vNormalUV2;\n#endif\nuniform sampler2D normalSampler;\nuniform vec2 vNormalInfos;\n#endif\nuniform sampler2D refractionSampler;\nuniform sampler2D reflectionSampler;\nconst float LOG2=1.442695;\nuniform vec3 cameraPosition;\nuniform vec4 waterColor;\nuniform float colorBlendFactor;\nuniform vec4 waterColor2;\nuniform float colorBlendFactor2;\nuniform float bumpHeight;\nuniform float time;\nvarying vec3 vRefractionMapTexCoord;\nvarying vec3 vReflectionMapTexCoord;\nvarying vec3 vPosition;\n#include<clipPlaneFragmentDeclaration>\n#include<logDepthDeclaration>\n#include<fogFragmentDeclaration>\n#define CUSTOM_FRAGMENT_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_FRAGMENT_MAIN_BEGIN\n#include<clipPlaneFragment>\nvec3 viewDirectionW=normalize(vEyePosition.xyz-vPositionW);\nvec4 baseColor=vec4(1.,1.,1.,1.);\nvec3 diffuseColor=vDiffuseColor.rgb;\nfloat alpha=vDiffuseColor.a;\n#ifdef BUMP\n#ifdef BUMPSUPERIMPOSE\nbaseColor=0.6*texture2D(normalSampler,vNormalUV)+0.4*texture2D(normalSampler,vec2(vNormalUV2.x,vNormalUV2.y));\n#else\nbaseColor=texture2D(normalSampler,vNormalUV);\n#endif\nvec3 bumpColor=baseColor.rgb;\n#ifdef ALPHATEST\nif (baseColor.a<0.4)\ndiscard;\n#endif\nbaseColor.rgb*=vNormalInfos.y;\n#else\nvec3 bumpColor=vec3(1.0);\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nbaseColor.rgb*=vColor.rgb;\n#endif\n#ifdef NORMAL\nvec2 perturbation=bumpHeight*(baseColor.rg-0.5);\n#ifdef BUMPAFFECTSREFLECTION\nvec3 normalW=normalize(vNormalW+vec3(perturbation.x*8.0,0.0,perturbation.y*8.0));\nif (normalW.y<0.0) {\nnormalW.y=-normalW.y;\n}\n#else\nvec3 normalW=normalize(vNormalW);\n#endif\n#else\nvec3 normalW=vec3(1.0,1.0,1.0);\nvec2 perturbation=bumpHeight*(vec2(1.0,1.0)-0.5);\n#endif\n#ifdef FRESNELSEPARATE\n#ifdef REFLECTION\nvec2 projectedRefractionTexCoords=clamp(vRefractionMapTexCoord.xy/vRefractionMapTexCoord.z+perturbation*0.5,0.0,1.0);\nvec4 refractiveColor=texture2D(refractionSampler,projectedRefractionTexCoords);\n#ifdef IS_REFRACTION_LINEAR\nrefractiveColor.rgb=toGammaSpace(refractiveColor.rgb);\n#endif\nvec2 projectedReflectionTexCoords=clamp(vec2(\nvReflectionMapTexCoord.x/vReflectionMapTexCoord.z+perturbation.x*0.3,\nvReflectionMapTexCoord.y/vReflectionMapTexCoord.z+perturbation.y\n),0.0,1.0);\nvec4 reflectiveColor=texture2D(reflectionSampler,projectedReflectionTexCoords);\n#ifdef IS_REFLECTION_LINEAR\nreflectiveColor.rgb=toGammaSpace(reflectiveColor.rgb);\n#endif\nvec3 upVector=vec3(0.0,1.0,0.0);\nfloat fresnelTerm=clamp(abs(pow(dot(viewDirectionW,upVector),3.0)),0.05,0.65);\nfloat IfresnelTerm=1.0-fresnelTerm;\nrefractiveColor=colorBlendFactor*waterColor+(1.0-colorBlendFactor)*refractiveColor;\nreflectiveColor=IfresnelTerm*colorBlendFactor2*waterColor+(1.0-colorBlendFactor2*IfresnelTerm)*reflectiveColor;\nvec4 combinedColor=refractiveColor*fresnelTerm+reflectiveColor*IfresnelTerm;\nbaseColor=combinedColor;\n#endif\nvec3 diffuseBase=vec3(0.,0.,0.);\nlightingInfo info;\nfloat shadow=1.;\n#ifdef SPECULARTERM\nfloat glossiness=vSpecularColor.a;\nvec3 specularBase=vec3(0.,0.,0.);\nvec3 specularColor=vSpecularColor.rgb;\n#else\nfloat glossiness=0.;\n#endif\n#include<lightFragment>[0..maxSimultaneousLights]\nvec3 finalDiffuse=clamp(baseColor.rgb,0.0,1.0);\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\n#ifdef SPECULARTERM\nvec3 finalSpecular=specularBase*specularColor;\n#else\nvec3 finalSpecular=vec3(0.0);\n#endif\n#else \n#ifdef REFLECTION\nvec2 projectedRefractionTexCoords=clamp(vRefractionMapTexCoord.xy/vRefractionMapTexCoord.z+perturbation,0.0,1.0);\nvec4 refractiveColor=texture2D(refractionSampler,projectedRefractionTexCoords);\n#ifdef IS_REFRACTION_LINEAR\nrefractiveColor.rgb=toGammaSpace(refractiveColor.rgb);\n#endif\nvec2 projectedReflectionTexCoords=clamp(vReflectionMapTexCoord.xy/vReflectionMapTexCoord.z+perturbation,0.0,1.0);\nvec4 reflectiveColor=texture2D(reflectionSampler,projectedReflectionTexCoords);\n#ifdef IS_REFLECTION_LINEAR\nreflectiveColor.rgb=toGammaSpace(reflectiveColor.rgb);\n#endif\nvec3 upVector=vec3(0.0,1.0,0.0);\nfloat fresnelTerm=max(dot(viewDirectionW,upVector),0.0);\nvec4 combinedColor=refractiveColor*fresnelTerm+reflectiveColor*(1.0-fresnelTerm);\nbaseColor=colorBlendFactor*waterColor+(1.0-colorBlendFactor)*combinedColor;\n#endif\nvec3 diffuseBase=vec3(0.,0.,0.);\nlightingInfo info;\nfloat shadow=1.;\n#ifdef SPECULARTERM\nfloat glossiness=vSpecularColor.a;\nvec3 specularBase=vec3(0.,0.,0.);\nvec3 specularColor=vSpecularColor.rgb;\n#else\nfloat glossiness=0.;\n#endif\n#include<lightFragment>[0..maxSimultaneousLights]\nvec3 finalDiffuse=clamp(baseColor.rgb,0.0,1.0);\n#if defined(VERTEXALPHA) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nalpha*=vColor.a;\n#endif\n#ifdef SPECULARTERM\nvec3 finalSpecular=specularBase*specularColor;\n#else\nvec3 finalSpecular=vec3(0.0);\n#endif\n#endif\nvec4 color=vec4(finalDiffuse+finalSpecular,alpha);\n#include<logDepthFragment>\n#include<fogFragment>\n#ifdef IMAGEPROCESSINGPOSTPROCESS\ncolor.rgb=toLinearSpace(color.rgb);\n#elif defined(IMAGEPROCESSING)\ncolor.rgb=toLinearSpace(color.rgb);\ncolor=applyImageProcessing(color);\n#endif\ngl_FragColor=color;\n#define CUSTOM_FRAGMENT_MAIN_END\n}\n",i(5501);p.v.ShadersStore.waterVertexShader="precision highp float;\nattribute vec3 position;\n#ifdef NORMAL\nattribute vec3 normal;\n#endif\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#ifdef VERTEXCOLOR\nattribute vec4 color;\n#endif\n#include<bonesDeclaration>\n#include<bakedVertexAnimationDeclaration>\n#include<instancesDeclaration>\nuniform mat4 view;\nuniform mat4 viewProjection;\n#ifdef BUMP\nvarying vec2 vNormalUV;\n#ifdef BUMPSUPERIMPOSE\nvarying vec2 vNormalUV2;\n#endif\nuniform mat4 normalMatrix;\nuniform vec2 vNormalInfos;\n#endif\n#ifdef POINTSIZE\nuniform float pointSize;\n#endif\nvarying vec3 vPositionW;\n#ifdef NORMAL\nvarying vec3 vNormalW;\n#endif\n#if defined(VERTEXCOLOR) || defined(INSTANCESCOLOR) && defined(INSTANCES)\nvarying vec4 vColor;\n#endif\n#include<clipPlaneVertexDeclaration>\n#include<fogVertexDeclaration>\n#include<__decl__lightFragment>[0..maxSimultaneousLights]\n#include<logDepthDeclaration>\nuniform mat4 worldReflectionViewProjection;\nuniform vec2 windDirection;\nuniform float waveLength;\nuniform float time;\nuniform float windForce;\nuniform float waveHeight;\nuniform float waveSpeed;\nuniform float waveCount;\nvarying vec3 vPosition;\nvarying vec3 vRefractionMapTexCoord;\nvarying vec3 vReflectionMapTexCoord;\n#define CUSTOM_VERTEX_DEFINITIONS\nvoid main(void) {\n#define CUSTOM_VERTEX_MAIN_BEGIN\n#include<instancesVertex>\n#include<bonesVertex>\n#include<bakedVertexAnimation>\nvec4 worldPos=finalWorld*vec4(position,1.0);\nvPositionW=vec3(worldPos);\n#ifdef NORMAL\nvNormalW=normalize(vec3(finalWorld*vec4(normal,0.0)));\n#endif\n#ifndef UV1\nvec2 uv=vec2(0.,0.);\n#endif\n#ifndef UV2\nvec2 uv2=vec2(0.,0.);\n#endif\n#ifdef BUMP\nif (vNormalInfos.x==0.)\n{\nvNormalUV=vec2(normalMatrix*vec4((uv*1.0)/waveLength+time*windForce*windDirection,1.0,0.0));\n#ifdef BUMPSUPERIMPOSE\nvNormalUV2=vec2(normalMatrix*vec4((uv*0.721)/waveLength+time*1.2*windForce*windDirection,1.0,0.0));\n#endif\n}\nelse\n{\nvNormalUV=vec2(normalMatrix*vec4((uv2*1.0)/waveLength+time*windForce*windDirection ,1.0,0.0));\n#ifdef BUMPSUPERIMPOSE\nvNormalUV2=vec2(normalMatrix*vec4((uv2*0.721)/waveLength+time*1.2*windForce*windDirection ,1.0,0.0));\n#endif\n}\n#endif\n#include<clipPlaneVertex>\n#include<fogVertex>\n#include<shadowsVertex>[0..maxSimultaneousLights]\n#include<vertexColorMixing>\n#if defined(POINTSIZE) && !defined(WEBGPU)\ngl_PointSize=pointSize;\n#endif\nfloat finalWaveCount=1.0/(waveCount*0.5);\nvec3 p=position;\nfloat newY=(sin(((p.x/finalWaveCount)+time*waveSpeed))*waveHeight*windDirection.x*5.0)\n+ (cos(((p.z/finalWaveCount)+ time*waveSpeed))*waveHeight*windDirection.y*5.0);\np.y+=abs(newY);\ngl_Position=viewProjection*finalWorld*vec4(p,1.0);\n#ifdef REFLECTION\nworldPos=viewProjection*finalWorld*vec4(p,1.0);\nvPosition=position;\nvRefractionMapTexCoord.x=0.5*(worldPos.w+worldPos.x);\nvRefractionMapTexCoord.y=0.5*(worldPos.w+worldPos.y);\nvRefractionMapTexCoord.z=worldPos.w;\nworldPos=worldReflectionViewProjection*vec4(position,1.0);\nvReflectionMapTexCoord.x=0.5*(worldPos.w+worldPos.x);\nvReflectionMapTexCoord.y=0.5*(worldPos.w+worldPos.y);\nvReflectionMapTexCoord.z=worldPos.w;\n#endif\n#include<logDepthVertex>\n#define CUSTOM_VERTEX_MAIN_END\n}\n";var oe=i(8027);class ae extends o.H{constructor(){super(),this.BUMP=!1,this.REFLECTION=!1,this.CLIPPLANE=!1,this.CLIPPLANE2=!1,this.CLIPPLANE3=!1,this.CLIPPLANE4=!1,this.CLIPPLANE5=!1,this.CLIPPLANE6=!1,this.ALPHATEST=!1,this.DEPTHPREPASS=!1,this.POINTSIZE=!1,this.FOG=!1,this.NORMAL=!1,this.UV1=!1,this.UV2=!1,this.VERTEXCOLOR=!1,this.VERTEXALPHA=!1,this.NUM_BONE_INFLUENCERS=0,this.BonesPerMesh=0,this.INSTANCES=!1,this.INSTANCESCOLOR=!1,this.SPECULARTERM=!1,this.LOGARITHMICDEPTH=!1,this.USE_REVERSE_DEPTHBUFFER=!1,this.FRESNELSEPARATE=!1,this.BUMPSUPERIMPOSE=!1,this.BUMPAFFECTSREFLECTION=!1,this.IMAGEPROCESSING=!1,this.VIGNETTE=!1,this.VIGNETTEBLENDMODEMULTIPLY=!1,this.VIGNETTEBLENDMODEOPAQUE=!1,this.TONEMAPPING=!1,this.TONEMAPPING_ACES=!1,this.CONTRAST=!1,this.EXPOSURE=!1,this.COLORCURVES=!1,this.COLORGRADING=!1,this.COLORGRADING3D=!1,this.SAMPLER3DGREENDEPTH=!1,this.SAMPLER3DBGRMAP=!1,this.DITHER=!1,this.IMAGEPROCESSINGPOSTPROCESS=!1,this.SKIPFINALCOLORCLAMP=!1,this.rebuild()}}class le extends l.a{get hasRenderTargetTextures(){return!0}constructor(e,t,i=new D.FM(512,512)){super(e,t),this.renderTargetSize=i,this.diffuseColor=new r.Wo(1,1,1),this.specularColor=new r.Wo(0,0,0),this.specularPower=64,this._disableLighting=!1,this._maxSimultaneousLights=4,this.windForce=6,this.windDirection=new D.FM(0,1),this.waveHeight=.4,this.bumpHeight=.4,this._bumpSuperimpose=!1,this._fresnelSeparate=!1,this._bumpAffectsReflection=!1,this.waterColor=new r.Wo(.1,.1,.6),this.colorBlendFactor=.2,this.waterColor2=new r.Wo(.1,.1,.6),this.colorBlendFactor2=.2,this.waveLength=.1,this.waveSpeed=1,this.waveCount=20,this.disableClipPlane=!1,this._renderTargets=new ne.t(16),this._mesh=null,this._reflectionTransform=D.y3.Zero(),this._lastTime=0,this._lastDeltaTime=0,this._createRenderTargets(this.getScene(),i),this.getRenderTargetTextures=()=>(this._renderTargets.reset(),this._renderTargets.push(this._reflectionRTT),this._renderTargets.push(this._refractionRTT),this._renderTargets),this._imageProcessingConfiguration=this.getScene().imageProcessingConfiguration,this._imageProcessingConfiguration&&(this._imageProcessingObserver=this._imageProcessingConfiguration.onUpdateParameters.add((()=>{this._markAllSubMeshesAsImageProcessingDirty()})))}get useLogarithmicDepth(){return this._useLogarithmicDepth}set useLogarithmicDepth(e){this._useLogarithmicDepth=e&&this.getScene().getEngine().getCaps().fragmentDepthSupported,this._markAllSubMeshesAsMiscDirty()}get refractionTexture(){return this._refractionRTT}get reflectionTexture(){return this._reflectionRTT}addToRenderList(e){this._refractionRTT&&this._refractionRTT.renderList&&this._refractionRTT.renderList.push(e),this._reflectionRTT&&this._reflectionRTT.renderList&&this._reflectionRTT.renderList.push(e)}enableRenderTargets(e){const t=e?1:0;this._refractionRTT&&(this._refractionRTT.refreshRate=t),this._reflectionRTT&&(this._reflectionRTT.refreshRate=t)}getRenderList(){return this._refractionRTT?this._refractionRTT.renderList:[]}get renderTargetsEnabled(){return!(this._refractionRTT&&0===this._refractionRTT.refreshRate)}needAlphaBlending(){return this.alpha<1}needAlphaTesting(){return!1}getAlphaTestTexture(){return null}isReadyForSubMesh(e,t,i){if(this.isFrozen&&t.effect&&t.effect._wasPreviouslyReady&&t.effect._wasPreviouslyUsingInstances===i)return!0;t.materialDefines||(t.materialDefines=new ae);const n=t.materialDefines,s=this.getScene();if(this._isReadyForSubMesh(t))return!0;const r=s.getEngine();if(n._areTexturesDirty&&(n._needUVs=!1,s.texturesEnabled)){if(this.bumpTexture&&h.k.BumpTextureEnabled){if(!this.bumpTexture.isReady())return!1;n._needUVs=!0,n.BUMP=!0}h.k.ReflectionTextureEnabled&&(n.REFLECTION=!0)}if(a.G.PrepareDefinesForFrameBoundValues(s,r,this,n,!!i),a.G.PrepareDefinesForMisc(e,s,this._useLogarithmicDepth,this.pointsCloud,this.fogEnabled,this._shouldTurnAlphaTestOn(e),n),n._areMiscDirty&&(this._fresnelSeparate&&(n.FRESNELSEPARATE=!0),this._bumpSuperimpose&&(n.BUMPSUPERIMPOSE=!0),this._bumpAffectsReflection&&(n.BUMPAFFECTSREFLECTION=!0)),n._needNormals=a.G.PrepareDefinesForLights(s,e,n,!0,this._maxSimultaneousLights,this._disableLighting),n._areImageProcessingDirty&&this._imageProcessingConfiguration){if(!this._imageProcessingConfiguration.isReady())return!1;this._imageProcessingConfiguration.prepareDefines(n),n.IS_REFLECTION_LINEAR=null!=this.reflectionTexture&&!this.reflectionTexture.gammaSpace,n.IS_REFRACTION_LINEAR=null!=this.refractionTexture&&!this.refractionTexture.gammaSpace}if(a.G.PrepareDefinesForAttributes(e,n,!0,!0),this._mesh=e,this._waitingRenderList){for(let e=0;e<this._waitingRenderList.length;e++)this.addToRenderList(s.getNodeById(this._waitingRenderList[e]));this._waitingRenderList=null}if(n.isDirty){n.markAsProcessed(),s.resetCachedMaterial();const i=new f.L;n.FOG&&i.addFallback(1,"FOG"),n.LOGARITHMICDEPTH&&i.addFallback(0,"LOGARITHMICDEPTH"),a.G.HandleFallbacksForShadows(n,i,this.maxSimultaneousLights),n.NUM_BONE_INFLUENCERS>0&&i.addCPUSkinningFallback(0,e);const o=[c.o.PositionKind];n.NORMAL&&o.push(c.o.NormalKind),n.UV1&&o.push(c.o.UVKind),n.UV2&&o.push(c.o.UV2Kind),n.VERTEXCOLOR&&o.push(c.o.ColorKind),a.G.PrepareAttributesForBones(o,e,n,i),a.G.PrepareAttributesForInstances(o,n);const l="water",h=n.toString(),u=["world","view","viewProjection","vEyePosition","vLightsType","vDiffuseColor","vSpecularColor","vFogInfos","vFogColor","pointSize","vNormalInfos","mBones","normalMatrix","logarithmicDepthConstant","worldReflectionViewProjection","windDirection","waveLength","time","windForce","cameraPosition","bumpHeight","waveHeight","waterColor","waterColor2","colorBlendFactor","colorBlendFactor2","waveSpeed","waveCount"],d=["normalSampler","refractionSampler","reflectionSampler"],p=new Array;re.$&&(re.$.PrepareUniforms(u,n),re.$.PrepareSamplers(d,n)),(0,_.qx)(u),a.G.PrepareUniformsAndSamplersList({uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:n,maxSimultaneousLights:this.maxSimultaneousLights}),t.setEffect(s.getEngine().createEffect(l,{attributes:o,uniformsNames:u,uniformBuffersNames:p,samplers:d,defines:h,fallbacks:i,onCompiled:this.onCompiled,onError:this.onError,indexParameters:{maxSimultaneousLights:this._maxSimultaneousLights}},r),n,this._materialContext)}return!(!t.effect||!t.effect.isReady()||(n._renderId=s.getRenderId(),t.effect._wasPreviouslyReady=!0,t.effect._wasPreviouslyUsingInstances=!!i,0))}bindForSubMesh(e,t,i){const n=this.getScene(),s=i.materialDefines;if(!s)return;const r=i.effect;if(!r||!this._mesh)return;this._activeEffect=r,this.bindOnlyWorldMatrix(e),this._activeEffect.setMatrix("viewProjection",n.getTransformMatrix()),a.G.BindBonesParameters(t,this._activeEffect),this._mustRebind(n,r)&&(this.bumpTexture&&h.k.BumpTextureEnabled&&(this._activeEffect.setTexture("normalSampler",this.bumpTexture),this._activeEffect.setFloat2("vNormalInfos",this.bumpTexture.coordinatesIndex,this.bumpTexture.level),this._activeEffect.setMatrix("normalMatrix",this.bumpTexture.getTextureMatrix())),(0,_.an)(r,this,n),this.pointsCloud&&this._activeEffect.setFloat("pointSize",this.pointSize),n.bindEyePosition(r)),this._activeEffect.setColor4("vDiffuseColor",this.diffuseColor,this.alpha*t.visibility),s.SPECULARTERM&&this._activeEffect.setColor4("vSpecularColor",this.specularColor,this.specularPower),n.lightsEnabled&&!this.disableLighting&&a.G.BindLights(n,t,this._activeEffect,s,this.maxSimultaneousLights),n.fogEnabled&&t.applyFog&&n.fogMode!==u.x.FOGMODE_NONE&&this._activeEffect.setMatrix("view",n.getViewMatrix()),a.G.BindFogParameters(n,t,this._activeEffect),a.G.BindLogDepth(s,this._activeEffect,n),h.k.ReflectionTextureEnabled&&(this._activeEffect.setTexture("refractionSampler",this._refractionRTT),this._activeEffect.setTexture("reflectionSampler",this._reflectionRTT));const o=this._mesh.getWorldMatrix().multiply(this._reflectionTransform).multiply(n.getProjectionMatrix()),l=n.getEngine().getDeltaTime();l!==this._lastDeltaTime&&(this._lastDeltaTime=l,this._lastTime+=this._lastDeltaTime),this._activeEffect.setMatrix("worldReflectionViewProjection",o),this._activeEffect.setVector2("windDirection",this.windDirection),this._activeEffect.setFloat("waveLength",this.waveLength),this._activeEffect.setFloat("time",this._lastTime/1e5),this._activeEffect.setFloat("windForce",this.windForce),this._activeEffect.setFloat("waveHeight",this.waveHeight),this._activeEffect.setFloat("bumpHeight",this.bumpHeight),this._activeEffect.setColor4("waterColor",this.waterColor,1),this._activeEffect.setFloat("colorBlendFactor",this.colorBlendFactor),this._activeEffect.setColor4("waterColor2",this.waterColor2,1),this._activeEffect.setFloat("colorBlendFactor2",this.colorBlendFactor2),this._activeEffect.setFloat("waveSpeed",this.waveSpeed),this._activeEffect.setFloat("waveCount",this.waveCount),this._imageProcessingConfiguration&&!this._imageProcessingConfiguration.applyByPostProcess&&this._imageProcessingConfiguration.bind(this._activeEffect),this._afterBind(t,this._activeEffect)}_createRenderTargets(e,t){let i;this._refractionRTT=new se._(name+"_refraction",{width:t.x,height:t.y},e,!1,!0),this._refractionRTT.wrapU=ie.g.TEXTURE_MIRROR_ADDRESSMODE,this._refractionRTT.wrapV=ie.g.TEXTURE_MIRROR_ADDRESSMODE,this._refractionRTT.ignoreCameraViewport=!0,this._reflectionRTT=new se._(name+"_reflection",{width:t.x,height:t.y},e,!1,!0),this._reflectionRTT.wrapU=ie.g.TEXTURE_MIRROR_ADDRESSMODE,this._reflectionRTT.wrapV=ie.g.TEXTURE_MIRROR_ADDRESSMODE,this._reflectionRTT.ignoreCameraViewport=!0;let n,s=null;const r=D.y3.Zero();this._refractionRTT.onBeforeRender=()=>{if(this._mesh&&(i=this._mesh.isVisible,this._mesh.isVisible=!1),!this.disableClipPlane){s=e.clipPlane;const t=this._mesh?this._mesh.absolutePosition.y:0;e.clipPlane=te.J.FromPositionAndNormal(new D.P(0,t+.05,0),new D.P(0,1,0))}},this._refractionRTT.onAfterRender=()=>{this._mesh&&(this._mesh.isVisible=i),this.disableClipPlane||(e.clipPlane=s)},this._reflectionRTT.onBeforeRender=()=>{if(this._mesh&&(i=this._mesh.isVisible,this._mesh.isVisible=!1),!this.disableClipPlane){s=e.clipPlane;const t=this._mesh?this._mesh.absolutePosition.y:0;e.clipPlane=te.J.FromPositionAndNormal(new D.P(0,t-.05,0),new D.P(0,-1,0)),D.y3.ReflectionToRef(e.clipPlane,r)}n=e.getViewMatrix(),r.multiplyToRef(n,this._reflectionTransform),e.setTransformMatrix(this._reflectionTransform,e.getProjectionMatrix()),e._mirroredCameraPosition=D.P.TransformCoordinates(e.activeCamera.position,r)},this._reflectionRTT.onAfterRender=()=>{this._mesh&&(this._mesh.isVisible=i),e.clipPlane=s,e.setTransformMatrix(n,e.getProjectionMatrix()),e._mirroredCameraPosition=null}}getAnimatables(){const e=[];return this.bumpTexture&&this.bumpTexture.animations&&this.bumpTexture.animations.length>0&&e.push(this.bumpTexture),this._reflectionRTT&&this._reflectionRTT.animations&&this._reflectionRTT.animations.length>0&&e.push(this._reflectionRTT),this._refractionRTT&&this._refractionRTT.animations&&this._refractionRTT.animations.length>0&&e.push(this._refractionRTT),e}getActiveTextures(){const e=super.getActiveTextures();return this._bumpTexture&&e.push(this._bumpTexture),e}hasTexture(e){return!!super.hasTexture(e)||this._bumpTexture===e}dispose(e){this.bumpTexture&&this.bumpTexture.dispose();let t=this.getScene().customRenderTargets.indexOf(this._refractionRTT);-1!=t&&this.getScene().customRenderTargets.splice(t,1),t=-1,t=this.getScene().customRenderTargets.indexOf(this._reflectionRTT),-1!=t&&this.getScene().customRenderTargets.splice(t,1),this._reflectionRTT&&this._reflectionRTT.dispose(),this._refractionRTT&&this._refractionRTT.dispose(),this._imageProcessingConfiguration&&this._imageProcessingObserver&&this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver),super.dispose(e)}clone(e){return s.p4.Clone((()=>new le(e,this.getScene())),this)}serialize(){const e=super.serialize();if(e.customType="BABYLON.WaterMaterial",e.renderList=[],this._refractionRTT&&this._refractionRTT.renderList)for(let t=0;t<this._refractionRTT.renderList.length;t++)e.renderList.push(this._refractionRTT.renderList[t].id);return e}getClassName(){return"WaterMaterial"}static Parse(e,t,i){const n=s.p4.Parse((()=>new le(e.name,t)),e,t,i);return n._waitingRenderList=e.renderList,n}static CreateDefaultMesh(e,t){return(0,oe.$6)(e,{width:512,height:512,subdivisions:32,updatable:!1},t)}}(0,n.gn)([(0,s.oU)("bumpTexture")],le.prototype,"_bumpTexture",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsTexturesDirty")],le.prototype,"bumpTexture",void 0),(0,n.gn)([(0,s.n9)()],le.prototype,"diffuseColor",void 0),(0,n.gn)([(0,s.n9)()],le.prototype,"specularColor",void 0),(0,n.gn)([(0,s.qC)()],le.prototype,"specularPower",void 0),(0,n.gn)([(0,s.qC)("disableLighting")],le.prototype,"_disableLighting",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],le.prototype,"disableLighting",void 0),(0,n.gn)([(0,s.qC)("maxSimultaneousLights")],le.prototype,"_maxSimultaneousLights",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsLightsDirty")],le.prototype,"maxSimultaneousLights",void 0),(0,n.gn)([(0,s.qC)()],le.prototype,"windForce",void 0),(0,n.gn)([(0,s.QC)()],le.prototype,"windDirection",void 0),(0,n.gn)([(0,s.qC)()],le.prototype,"waveHeight",void 0),(0,n.gn)([(0,s.qC)()],le.prototype,"bumpHeight",void 0),(0,n.gn)([(0,s.qC)("bumpSuperimpose")],le.prototype,"_bumpSuperimpose",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsMiscDirty")],le.prototype,"bumpSuperimpose",void 0),(0,n.gn)([(0,s.qC)("fresnelSeparate")],le.prototype,"_fresnelSeparate",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsMiscDirty")],le.prototype,"fresnelSeparate",void 0),(0,n.gn)([(0,s.qC)("bumpAffectsReflection")],le.prototype,"_bumpAffectsReflection",void 0),(0,n.gn)([(0,s.wz)("_markAllSubMeshesAsMiscDirty")],le.prototype,"bumpAffectsReflection",void 0),(0,n.gn)([(0,s.n9)()],le.prototype,"waterColor",void 0),(0,n.gn)([(0,s.qC)()],le.prototype,"colorBlendFactor",void 0),(0,n.gn)([(0,s.n9)()],le.prototype,"waterColor2",void 0),(0,n.gn)([(0,s.qC)()],le.prototype,"colorBlendFactor2",void 0),(0,n.gn)([(0,s.qC)()],le.prototype,"waveLength",void 0),(0,n.gn)([(0,s.qC)()],le.prototype,"waveSpeed",void 0),(0,n.gn)([(0,s.qC)()],le.prototype,"waveCount",void 0),(0,n.gn)([(0,s.qC)()],le.prototype,"disableClipPlane",void 0),(0,n.gn)([(0,s.qC)()],le.prototype,"useLogarithmicDepth",null),(0,d.H)("BABYLON.WaterMaterial",le)}},r={};function o(e){var t=r[e];if(void 0!==t)return t.exports;var i=r[e]={exports:{}};return s[e].call(i.exports,i,i.exports,o),i.exports}o.m=s,o.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return o.d(t,{a:t}),t},t=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,o.t=function(i,n){if(1&n&&(i=this(i)),8&n)return i;if("object"==typeof i&&i){if(4&n&&i.__esModule)return i;if(16&n&&"function"==typeof i.then)return i}var s=Object.create(null);o.r(s);var r={};e=e||[null,t({}),t([]),t(t)];for(var a=2&n&&i;"object"==typeof a&&!~e.indexOf(a);a=t(a))Object.getOwnPropertyNames(a).forEach((e=>r[e]=()=>i[e]));return r.default=()=>i,o.d(s,r),s},o.d=(e,t)=>{for(var i in t)o.o(t,i)&&!o.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},o.f={},o.e=e=>Promise.all(Object.keys(o.f).reduce(((t,i)=>(o.f[i](e,t),t)),[])),o.u=e=>e+".js",o.miniCssF=e=>{},o.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),i={},n="@dndbeyond/dice:",o.l=(e,t,s,r)=>{if(i[e])i[e].push(t);else{var a,l;if(void 0!==s)for(var h=document.getElementsByTagName("script"),c=0;c<h.length;c++){var u=h[c];if(u.getAttribute("src")==e||u.getAttribute("data-webpack")==n+s){a=u;break}}a||(l=!0,(a=document.createElement("script")).type="module",a.charset="utf-8",a.timeout=120,o.nc&&a.setAttribute("nonce",o.nc),a.setAttribute("data-webpack",n+s),a.src=e),i[e]=[t];var d=(t,n)=>{a.onerror=a.onload=null,clearTimeout(p);var s=i[e];if(delete i[e],a.parentNode&&a.parentNode.removeChild(a),s&&s.forEach((e=>e(n))),t)return t(n)},p=setTimeout(d.bind(null,void 0,{type:"timeout",target:a}),12e4);a.onerror=d.bind(null,a.onerror),a.onload=d.bind(null,a.onload),l&&document.head.appendChild(a)}},o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.p="/dist/",(()=>{var e={585:0};o.f.j=(t,i)=>{var n=o.o(e,t)?e[t]:void 0;if(0!==n)if(n)i.push(n[2]);else{var s=new Promise(((i,s)=>n=e[t]=[i,s]));i.push(n[2]=s);var r=o.p+o.u(t),a=new Error;o.l(r,(i=>{if(o.o(e,t)&&(0!==(n=e[t])&&(e[t]=void 0),n)){var s=i&&("load"===i.type?"missing":i.type),r=i&&i.target&&i.target.src;a.message="Loading chunk "+t+" failed.\n("+s+": "+r+")",a.name="ChunkLoadError",a.type=s,a.request=r,n[1](a)}}),"chunk-"+t,t)}};var t=(t,i)=>{var n,s,[r,a,l]=i,h=0;if(r.some((t=>0!==e[t]))){for(n in a)o.o(a,n)&&(o.m[n]=a[n]);l&&l(o)}for(t&&t(i);h<r.length;h++)s=r[h],o.o(e,s)&&e[s]&&e[s][0](),e[s]=0},i=self.webpackChunk_dndbeyond_dice=self.webpackChunk_dndbeyond_dice||[];i.forEach(t.bind(null,0)),i.push=t.bind(null,i.push.bind(i))})();var a={};(()=>{o.d(a,{cp:()=>At,rq:()=>i,bV:()=>Kt,jx:()=>n,m8:()=>Mt,w$:()=>C,f4:()=>s,ZM:()=>A,S_:()=>$t,lD:()=>r,hi:()=>l,cU:()=>Rt,DI:()=>t,ro:()=>e,Yd:()=>oe,_w:()=>c,LM:()=>Dt,Gs:()=>It,ee:()=>d});var e={DICE_Advanced:"Dice-CharacterSheet",DICE_Menu:"Dice Menu",DICE_Toolbar:"Dice Toolbar",DICE_Settings:"Dice Settings",DICE_Result:"Dice Result"},t={DICE_Roll:"Roll from Click",DICE_Shake:"Roll from Shake",DICE_Custom_D20_Added:"D20 has been Added",DICE_Custom_D12_Added:"D12 has been Added",DICE_Custom_D10_Added:"D10 has been Added",DICE_Custom_D8_Added:"D8 has been Added",DICE_Custom_D6_Added:"D6 has been Added",DICE_Custom_D4_Added:"D4 has been Added",DICE_Custom_D100_Added:"D100 has been Added",DICE_Custom_D20_Removed:"D20 has been Removed",DICE_Custom_D12_Removed:"D12 has been Removed",DICE_Custom_D10_Removed:"D10 has been Removed",DICE_Custom_D8_Removed:"D8 has been Removed",DICE_Custom_D6_Removed:"D6 has been Removed",DICE_Custom_D4_Removed:"D4 has been Removed",DICE_Custom_D100_Removed:"D100 has been Removed",DICE_Toolbar_Open:"Dice Toolbar Opened",DICE_Toolbar_Close:"Dice Toolbar Opened",DICE_Enabled:"Dice Enabled",DICE_Disabled:"Dice Disabled",DICE_Modal:"Dice Modal Shown",DICE_Menu_Roll:"Dice Menu Roll",DICE_Menu_Advantage:"Dice Menu Roll Advantage",DICE_Menu_Disadvantage:"Dice Menu Roll Disadvantage",DICE_Menu_Critical:"Dice Menu Roll Critical"},i={id:"",manifestUrl:"/bundles/basic/default.json",familyId:"",setId:"",settings:{volume:1,vibrationEnabled:!0,particlesEnabled:!0,shadowQuality:3}},n=function(e){return e.ROLL="dice-roll",e.CLEAR="dice-clear",e}({}),s=function(e){return e[e.Sum=0]="Sum",e[e.Min=1]="Min",e[e.Max=2]="Max",e}({}),r=function(e){return e.d4="d4",e.d6="d6",e.d8="d8",e.d10="d10",e.d12="d12",e.d20="d20",e.d100="d100",e}({}),l=[r.d20,r.d12,r.d10,r.d100,r.d8,r.d6,r.d4],h=function(e){return e.None="",e.Advantage="advantage",e.Disadvantage="disadvantage",e.CriticalHit="critical hit",e}(h||{});const c=h;var u=function(e){return e.Roll="roll",e.ToHit="to hit",e.Damage="damage",e.Heal="heal",e.Spell="spell",e.Save="save",e.Check="check",e}(u||{});const d=u;function p(e,t,i,n,s,r,o){try{var a=e[r](o),l=a.value}catch(e){return void i(e)}a.done?t(l):Promise.resolve(l).then(n,s)}function f(e){return function(){var t=this,i=arguments;return new Promise((function(n,s){var r=e.apply(t,i);function o(e){p(r,n,s,o,a,"next",e)}function a(e){p(r,n,s,o,a,"throw",e)}o(void 0)}))}}function _(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function m(e){return m="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},m(e)}function g(e){var t=function(e,t){if("object"!==m(e)||null===e)return e;var i=e[Symbol.toPrimitive];if(void 0!==i){var n=i.call(e,"string");if("object"!==m(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"===m(t)?t:String(t)}function v(e,t){for(var i=0;i<t.length;i++){var n=t[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,g(n.key),n)}}function y(e,t,i){return t&&v(e.prototype,t),i&&v(e,i),Object.defineProperty(e,"prototype",{writable:!1}),e}function x(e,t,i){return(t=g(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}var b=o(2841),T=o.n(b),S=o(7126),E=o.n(S),C=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:3;_(this,e),x(this,"_resultHistory",void 0),x(this,"_animationIn",void 0),x(this,"_animationOut",void 0),x(this,"_historyMode",void 0),x(this,"historySize",void 0),x(this,"_enabled",void 0),this._resultHistory=[],this._enabled=!0,this._animationIn="animated faster bounceInUp",this._animationOut="animated faster bounceOutRight",this._historyMode="uncollapse",this.historySize=t,E().setMaxVisible(this.historySize)}return y(e,[{key:"setEnabled",value:function(e){this._enabled=e}},{key:"showDiceNotification",value:function(e,t){if(this._enabled){this.trimHistory();for(var i=e.rolls.length,n="",s=0;s<i;s++){var r=e.rolls[s],o=this._getMostCommonDie(r),a=r.rollType.replace(/[^a-z0-9]/gi,""),l="";o&&(l='\n                    <span class="dice-icon-die dice-icon-die--'.concat(o,'" alt=""></span>\n                '));var h="",u="";switch(r.rollKind){case c.Advantage:h='<span class="dice_result__total-header dice_result__total-header--advantage">+ADV</span>';break;case c.Disadvantage:h='<span class="dice_result__total-header dice_result__total-header--disadvantage">-DIS</span>';break;case c.CriticalHit:h='<span class="dice_result__total-header dice_result__total-header--crit">CRIT</span>',u="dice_result--crit"}var d="string"==typeof e.context.messageTarget?parseInt(e.context.messageTarget):e.context.messageTarget;n+='\n                <div class="dice_result '.concat(u,'">\n                    <div class="dice_result__info">\n                        <div class="dice_result__info__title">\n                            <span class="dice_result__info__rolldetail">').concat(e.action,': </span><span class="dice_result__rolltype rolltype_').concat(a,'">').concat(r.rollType,"</span>\n                        </div>\n                        ").concat("userId"===e.context.messageScope?'<div class="dice_result__info__title">\n                                <span class="dice_result__info__targetdetail">TO:'.concat(" ",t===d?"SELF":"DM","\n                                </span>\n                            </div>"):"",'\n                        <div class="dice_result__info__results">\n                            ').concat(l,'\n                            <span class="dice_result__info__breakdown" title="').concat(r.result.text,'">').concat(r.result.text,'</span>\n                        </div>\n                        <span class="dice_result__info__dicenotation" title="').concat(r.getDiceNotationString(),'">').concat(r.getDiceNotationString(),'</span>\n                    </div>\n                    <span class="dice_result__divider dice_result__divider--').concat("userId"===e.context.messageScope?"target":"",'"></span>\n                    <div class="dice_result__total-container">\n                        ').concat(h,'\n                        <span class="dice_result__total-result dice_result__total-result-').concat("userId"===e.context.messageScope?"target":"",'">').concat(r.result.total,"</span>\n                    </div>\n                </div>\n            ")}var p=new(E())({text:n,layout:"bottomRight",progressBar:!1,animation:{open:this._animationIn,close:this._animationOut}});p.setTheme("valhalla",!0),p.show(),this._resultHistory.unshift(p);for(var f=1;f<this._resultHistory.length;f++)this._resultHistory[f].setTheme("valhalla-min",!0);this.createNotificationControls()}}},{key:"_getMostCommonDie",value:function(e){for(var t=[],i={dieType:"d20",count:0},n=0;n<(null===(s=e.diceNotation.set)||void 0===s?void 0:s.length);n++){var s,r=e.diceNotation.set[n];r.dieType in t?t[r.dieType]+=r.count:t[r.dieType]=r.count,t[r.dieType]>i.count&&(i.count=t[r.dieType],i.dieType=r.dieType)}return i.dieType}},{key:"createNotificationControls",value:function(){var e=this,t='\n        <div class="dice_notification_control dice_notification_controls__clear"><span>Clear All</span><i></i></div>\n        <div class="dice_notification_control dice_notification_controls__'.concat(this._historyMode,'"><i></i></div>\n        '),i=document.querySelector(".noty_layout");if(i){i.classList.add(this._historyMode);var n=i.getElementsByClassName("dice_notification_controls");if(n.length>0)return void i.appendChild(n[0]);var s=document.createElement("div");s.className="dice_notification_controls",s.innerHTML=t,s.getElementsByClassName("dice_notification_controls__clear")[0].addEventListener("click",(function(t){return e.clearNotifications(t)})),s.getElementsByClassName("dice_notification_controls__".concat(this._historyMode))[0].addEventListener("click",(function(t){return e.toggleHistory(t)})),i.appendChild(s)}}},{key:"toggleHistory",value:function(e){var t=document.querySelector(".noty_layout");e.currentTarget.classList.remove("dice_notification_controls__".concat(this._historyMode)),"collapse"===this._historyMode?(this._historyMode="uncollapse",t.classList.replace("collapse","uncollapse")):(this._historyMode="collapse",t.classList.replace("uncollapse","collapse")),e.currentTarget.classList.add("dice_notification_controls__".concat(this._historyMode))}},{key:"trimHistory",value:function(){for(;this._resultHistory.length>this.historySize-1;)this._resultHistory.pop().close()}},{key:"clearNotifications",value:function(e){var t,i;null==e||e.stopPropagation(),null===(t=document.querySelector(".dice_notification_controls"))||void 0===t||t.classList.add("animated","bounceOutRight"),E().closeAll(),this._historyMode="uncollapse",null===(i=document.querySelector(".noty_layout"))||void 0===i||i.classList.remove("collapse","uncollapse")}}]),e}(),A=function(){function e(t,i){_(this,e),x(this,"_diceManager",void 0),x(this,"_context",void 0),this._diceManager=t,this._context=i}return y(e,[{key:"roll",value:function(e,t,i){return e.context=this._context,this._diceManager.roll(e,t,i)}}]),e}();function P(e,t){(null==t||t>e.length)&&(t=e.length);for(var i=0,n=new Array(t);i<t;i++)n[i]=e[i];return n}function R(e){return function(e){if(Array.isArray(e))return P(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(e){if("string"==typeof e)return P(e,t);var i=Object.prototype.toString.call(e).slice(8,-1);return"Object"===i&&e.constructor&&(i=e.constructor.name),"Map"===i||"Set"===i?Array.from(e):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?P(e,t):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var M=o(8099);const I=Symbol.for("@dndbeyond/message-broker-lib");var D,O;const w=new URLSearchParams(location.search),N="true"===w.get("disableMb")&&"true"===w.get("disableLayout")&&w.has("userId");window.mobileApp||(window.mobileApp={}),window.mobileApp.subscribers||(window.mobileApp.subscribers=new Set),window.mobileApp.gameLogCallback||(window.mobileApp.gameLogCallback=e=>{var t,i;return null===(i=null===(t=window.mobileApp)||void 0===t?void 0:t.subscribers)||void 0===i?void 0:i.forEach((t=>t(e)))});const F={gameId:null!==(D=w.get("gameId"))&&void 0!==D?D:"0",userId:null!==(O=w.get("userId"))&&void 0!==O?O:"0",source:"",connectUrl:"",getMessagesUrl:"",fetchHistory:()=>Promise.resolve(),subscribe:e=>{var t,i;return null===(i=null===(t=window.mobileApp)||void 0===t?void 0:t.subscribers)||void 0===i||i.add(e),()=>{var t,i;return null===(i=null===(t=window.mobileApp)||void 0===t?void 0:t.subscribers)||void 0===i?void 0:i.delete(e)}},dispatch:e=>(e=>{var t,i,n,s,r,o;(null===(i=null===(t=window.webkit)||void 0===t?void 0:t.messageHandlers.mobileApp)||void 0===i?void 0:i.postMessage)?null===(s=null===(n=window.webkit)||void 0===n?void 0:n.messageHandlers.mobileApp)||void 0===s||s.postMessage(e):(null===(r=window.mobileApp)||void 0===r?void 0:r.postMessage)&&(null===(o=window.mobileApp)||void 0===o||o.postMessage(e))})(JSON.stringify(Object.assign({type:"gameLog"},e)))};var L,B;o(1932),function(e){e.Disconnected="disconnected",e.Connecting="connecting",e.Open="open",e.Closing="closing",e.Closed="closed"}(L||(L={})),new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,new WeakMap,function(e){e.Pending="pending",e.Fulfilled="fulfilled",e.Rejected="rejected"}(B||(B={}));var U,V=o(1297),k=o.n(V),G=new Uint8Array(16);function z(){if(!U&&!(U="undefined"!=typeof crypto&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto)||"undefined"!=typeof msCrypto&&"function"==typeof msCrypto.getRandomValues&&msCrypto.getRandomValues.bind(msCrypto)))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return U(G)}const W=/^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;for(var H=[],X=0;X<256;++X)H.push((X+256).toString(16).substr(1));const j=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,i=(H[e[t+0]]+H[e[t+1]]+H[e[t+2]]+H[e[t+3]]+"-"+H[e[t+4]]+H[e[t+5]]+"-"+H[e[t+6]]+H[e[t+7]]+"-"+H[e[t+8]]+H[e[t+9]]+"-"+H[e[t+10]]+H[e[t+11]]+H[e[t+12]]+H[e[t+13]]+H[e[t+14]]+H[e[t+15]]).toLowerCase();if(!function(e){return"string"==typeof e&&W.test(e)}(i))throw TypeError("Stringified UUID is invalid");return i},Y=function(e,t,i){var n=(e=e||{}).random||(e.rng||z)();if(n[6]=15&n[6]|64,n[8]=63&n[8]|128,t){i=i||0;for(var s=0;s<16;++s)t[i+s]=n[s];return t}return j(n)},q={d4:{dieType:r.d4,meshName:"d4",size:.1,meshSizeMultiplier:1.6,tab:-.1,af:7*Math.PI/6,chamfer:.96,vertices:[[1,1,1],[-1,-1,1],[-1,1,-1],[1,-1,-1]],faces:[[1,0,2,1],[0,1,3,2],[0,3,2,3],[1,2,3,4]],scaleFactor:1.2,values:4,faceTexts:[[],["0","0","0"],["2","4","3"],["1","3","4"],["2","1","4"],["1","2","3"]],textMargin:0,numberValues:{1:1,2:3,3:2,4:4},mass:6,inertia:5,invertUpside:!0,textureName:"d4_texture",baseRotation:{x:-35.26,y:28,z:45},baseHeight:.25},d6:{dieType:r.d6,meshName:"d6",size:.1,meshSizeMultiplier:1.3,tab:.1,af:Math.PI/4,chamfer:.96,vertices:[[-1,-1,-1],[1,-1,-1],[1,1,-1],[-1,1,-1],[-1,-1,1],[1,-1,1],[1,1,1],[-1,1,1]],faces:[[0,3,2,1,1],[1,2,6,5,2],[0,1,5,4,3],[3,7,6,2,4],[0,4,7,3,5],[4,5,6,7,6]],scaleFactor:.9,values:6,faceTexts:[" ","0","1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20"],numberValues:{1:4,2:5,3:1,4:6,5:2,6:3},textMargin:1,mass:6,inertia:13,invertUpside:!1,textureName:"d6_texture",baseRotation:{x:0,y:90,z:0},baseHeight:.25},d8:{dieType:r.d8,meshName:"d8",size:.1,meshSizeMultiplier:1.4,tab:0,af:-Math.PI/4/2,chamfer:.965,vertices:[[1,0,0],[-1,0,0],[0,1,0],[0,-1,0],[0,0,1],[0,0,-1]],faces:[[0,2,4,1],[0,4,3,2],[0,3,5,3],[0,5,2,4],[1,3,4,5],[1,4,2,6],[1,2,5,7],[1,5,3,8]],scaleFactor:1.6,values:8,faceTexts:[" ","0","1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20"],numberValues:{0:0,1:4,2:2,3:7,4:1,5:8,6:6,7:3,8:5},textMargin:1.2,mass:6.8,inertia:10,invertUpside:!1,textureName:"d8_texture",baseRotation:{x:-35.26,y:149.4,z:-135},baseHeight:.15},d10:{dieType:r.d10,meshName:"d10",size:.1,meshSizeMultiplier:1.4,tab:0,af:6*Math.PI/5,chamfer:.945,vertices:[[1,0,-.105],[.8090169943749475,.5877852522924731,.105],[.30901699437494745,.9510565162951535,-.105],[-.30901699437494734,.9510565162951536,.105],[-.8090169943749473,.5877852522924732,-.105],[-1,12246467991473532e-32,.105],[-.8090169943749475,-.587785252292473,-.105],[-.30901699437494756,-.9510565162951535,.105],[.30901699437494723,-.9510565162951536,-.105],[.8090169943749473,-.5877852522924734,.105],[0,0,-1],[0,0,1]],faces:[[5,7,11,0],[4,2,10,1],[1,3,11,2],[0,8,10,3],[7,9,11,4],[8,6,10,5],[9,1,11,6],[2,0,10,7],[3,5,11,8],[6,4,10,9],[1,0,2,-1],[1,2,3,-1],[3,2,4,-1],[3,4,5,-1],[5,4,6,-1],[5,6,7,-1],[7,6,8,-1],[7,8,9,-1],[9,8,0,-1],[9,0,1,-1]],scaleFactor:1.6,values:10,faceTexts:[" ","0","1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20"],numberValues:{0:6,1:7,2:10,3:5,4:2,5:9,6:8,7:3,8:4,9:1},textMargin:1,mass:7,inertia:9,invertUpside:!1,textureName:"d10_texture",baseRotation:{x:-42.14,y:271.7,z:17.92},baseHeight:.25},d12:{dieType:r.d12,meshName:"d12",size:.1,meshSizeMultiplier:1.7,tab:.2,af:-Math.PI/4/2,chamfer:.968,vertices:[[0,.6180339887498948,1.618033988749895],[0,.6180339887498948,-1.618033988749895],[0,-.6180339887498948,1.618033988749895],[0,-.6180339887498948,-1.618033988749895],[1.618033988749895,0,.6180339887498948],[1.618033988749895,0,-.6180339887498948],[-1.618033988749895,0,.6180339887498948],[-1.618033988749895,0,-.6180339887498948],[.6180339887498948,1.618033988749895,0],[.6180339887498948,-1.618033988749895,0],[-.6180339887498948,1.618033988749895,0],[-.6180339887498948,-1.618033988749895,0],[1,1,1],[1,1,-1],[1,-1,1],[1,-1,-1],[-1,1,1],[-1,1,-1],[-1,-1,1],[-1,-1,-1]],faces:[[2,14,4,12,0,1],[15,9,11,19,3,2],[16,10,17,7,6,3],[6,7,19,11,18,4],[6,18,2,0,16,5],[18,11,9,14,2,6],[1,17,10,8,13,7],[1,13,5,15,3,8],[13,8,12,4,5,9],[5,4,14,9,15,10],[0,12,8,10,16,11],[3,19,7,17,1,12]],scaleFactor:.9,values:12,faceTexts:[" ","0","1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20"],numberValues:{1:5,2:11,3:8,4:7,5:9,6:10,7:2,8:3,9:1,10:4,11:6,12:12},textMargin:1,mass:7,inertia:8,invertUpside:!1,textureName:"d12_texture",baseRotation:{x:58.28,y:343,z:-90},baseHeight:.25},d20:{dieType:r.d20,meshName:"d20",size:.1,meshSizeMultiplier:1.7,tab:-.2,af:-Math.PI/4/2,chamfer:.955,vertices:[[-1,1.618033988749895,0],[1,1.618033988749895,0],[-1,-1.618033988749895,0],[1,-1.618033988749895,0],[0,-1,1.618033988749895],[0,1,1.618033988749895],[0,-1,-1.618033988749895],[0,1,-1.618033988749895],[1.618033988749895,0,-1],[1.618033988749895,0,1],[-1.618033988749895,0,-1],[-1.618033988749895,0,1]],faces:[[0,11,5,1],[0,5,1,2],[0,1,7,3],[0,7,10,4],[0,10,11,5],[1,5,9,6],[5,11,4,7],[11,10,2,8],[10,7,6,9],[7,1,8,10],[3,9,4,11],[3,4,2,12],[3,2,6,13],[3,6,8,14],[3,8,9,15],[4,9,5,16],[2,4,11,17],[6,2,10,18],[8,6,7,19],[9,8,1,20]],scaleFactor:1,values:20,faceTexts:[" ","0","1","2","3","4","5","6","7","8","9","10","11","12","13","14","15","16","17","18","19","20"],numberValues:{1:18,2:4,3:11,4:13,5:5,6:14,7:2,8:15,9:1,10:9,11:8,12:10,13:17,14:3,15:16,16:20,17:12,18:7,19:19,20:6},textMargin:1,mass:8,inertia:6,invertUpside:!1,textureName:"d20_texture",baseRotation:{x:-69.09,y:-29,z:90},baseHeight:.25},d100:{dieType:r.d100,meshName:"d10",size:.1,meshSizeMultiplier:1.4,tab:0,af:6*Math.PI/5,chamfer:.945,vertices:[[1,0,-.105],[.8090169943749475,.5877852522924731,.105],[.30901699437494745,.9510565162951535,-.105],[-.30901699437494734,.9510565162951536,.105],[-.8090169943749473,.5877852522924732,-.105],[-1,12246467991473532e-32,.105],[-.8090169943749475,-.587785252292473,-.105],[-.30901699437494756,-.9510565162951535,.105],[.30901699437494723,-.9510565162951536,-.105],[.8090169943749473,-.5877852522924734,.105],[0,0,-1],[0,0,1]],faces:[[5,7,11,0],[4,2,10,1],[1,3,11,2],[0,8,10,3],[7,9,11,4],[8,6,10,5],[9,1,11,6],[2,0,10,7],[3,5,11,8],[6,4,10,9],[1,0,2,-1],[1,2,3,-1],[3,2,4,-1],[3,4,5,-1],[5,4,6,-1],[5,6,7,-1],[7,6,8,-1],[7,8,9,-1],[9,8,0,-1],[9,0,1,-1]],scaleFactor:1.6,values:100,faceTexts:[" ","00","10","20","30","40","50","60","70","80","90","100","11","12","13","14","15","16","17","18","19","20"],numberValues:{0:60,1:70,2:0,3:50,4:20,5:90,6:80,7:30,8:40,9:10},textMargin:1,mass:7,inertia:9,invertUpside:!1,textureName:"d100_texture",baseRotation:{x:-42.14,y:271.7,z:17.92},baseHeight:.25}};var K=function(e){return e[e.None=0]="None",e[e.Low=1]="Low",e[e.Medium=2]="Medium",e[e.High=3]="High",e}({});const $={SoundEnabled:!1,MasterVolume:1,Vibrate:!1,Particles:!0,Aliasing:!0,clearRender:!0,Shadow:K.High,GlowIntensity:.75,AutoClearSeconds:7.5,CameraStartHeight:7.2,CameraFOV:.35,CameraUpperBetaLimit:Math.PI/2,CameraLowerBetaLimit:-Math.PI/2,CameraUpperRadiusLimit:5,CameraLowerRadiusLimit:.4,CameraWheelPrecision:75,CameraMinZ:.01,PreviewCameraStartHeight:1,PreviewCameraFOV:.8,ShadowFrustumSize:5,environmentTexture:"environmentSpecular.env"};var Q=function(e){return e[e.rollBegin=0]="rollBegin",e[e.collision=1]="collision",e[e.rollComplete=2]="rollComplete",e[e.minRoll=3]="minRoll",e[e.maxRoll=4]="maxRoll",e[e.dieRemoved=5]="dieRemoved",e}({}),Z=function(e){return e[e.NONE=0]="NONE",e[e.START=1]="START",e[e.STOP=2]="STOP",e[e.RESET=3]="RESET",e}({}),J=function(e){return e[e.DistanceBetween=.35]="DistanceBetween",e[e.StartHeight=1]="StartHeight",e[e.BaseStrength=5]="BaseStrength",e[e.AddPerDieStrength=.2]="AddPerDieStrength",e[e.StrengthHeight=1]="StrengthHeight",e[e.Gravity=-9.82]="Gravity",e[e.DiceFriction=.01]="DiceFriction",e[e.DiceRestitution=.9]="DiceRestitution",e[e.FloorFriction=.4]="FloorFriction",e[e.FloorRestitution=.15]="FloorRestitution",e[e.BarrierFriction=.25]="BarrierFriction",e[e.BarrierRestitution=.15]="BarrierRestitution",e}(J||{});const ee=J;function te(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function ie(e,t){return ie=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},ie(e,t)}function ne(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&ie(e,t)}function se(e,t){if(t&&("object"===m(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return te(e)}function re(e){return re=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},re(e)}const oe=function(){function e(t){if(_(this,e),x(this,"memory",void 0),x(this,"Console",void 0),x(this,"attachedObject",void 0),this.attachedObject=t,this.isDebugMode())for(var i in console)"function"==typeof console[i]&&(this[i]=console[i].bind(window.console,"🎲[".concat(this.attachedObject.constructor.name,"] ")))}return y(e,[{key:"assert",value:function(e,t){}},{key:"clear",value:function(){}},{key:"count",value:function(e){}},{key:"debug",value:function(e){}},{key:"dir",value:function(e,t){}},{key:"dirxml",value:function(){}},{key:"error",value:function(e){}},{key:"exception",value:function(e){}},{key:"group",value:function(){}},{key:"groupCollapsed",value:function(){}},{key:"groupEnd",value:function(){}},{key:"info",value:function(e){}},{key:"log",value:function(e){}},{key:"markTimeline",value:function(e){}},{key:"profile",value:function(e){}},{key:"profileEnd",value:function(e){}},{key:"table",value:function(e,t){}},{key:"time",value:function(e){}},{key:"timeEnd",value:function(e){}},{key:"timeStamp",value:function(e){}},{key:"timeline",value:function(e){}},{key:"timelineEnd",value:function(e){}},{key:"trace",value:function(e){}},{key:"warn",value:function(e){}},{key:"countReset",value:function(e){}},{key:"timeLog",value:function(e){}},{key:"isDebugMode",value:function(){return!!(window.location.search&&window.location.search.indexOf("dice-debug")>0)}}]),e}();function ae(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var i,n=re(e);if(t){var s=re(this).constructor;i=Reflect.construct(n,arguments,s)}else i=n.apply(this,arguments);return se(this,i)}}var le=y((function e(t,i){_(this,e),x(this,"type",void 0),x(this,"key",void 0),x(this,"resourceUrl",void 0),this.key=t,this.resourceUrl=i})),he=function(e){ne(i,e);var t=ae(i);function i(e,n){var s;return _(this,i),(s=t.call(this,e,n)).type="mesh",s}return y(i)}(le),ce=y((function e(t,i){_(this,e),x(this,"key",void 0),x(this,"sound",void 0),x(this,"type",void 0),this.key=t,this.sound=i,this.type="sound"})),ue=function(e){ne(i,e);var t=ae(i);function i(e,n){var s;return _(this,i),(s=t.call(this,e,n)).type="texture",s}return y(i)}(le),de=function(e){ne(i,e);var t=ae(i);function i(e,n){var s;return _(this,i),(s=t.call(this,e,n)).type="particleSystem",s}return y(i)}(le),pe=function(e){ne(i,e);var t=ae(i);function i(e,n,s){var r;return _(this,i),x(te(r=t.call(this,e,n)),"clones",void 0),r.clones=s,r.type="animationGroup",r}return y(i)}(le),fe=function(){function e(){_(this,e),x(this,"textures",void 0),x(this,"sounds",void 0),x(this,"shaders",void 0),x(this,"particleSystems",void 0),x(this,"animationGroups",void 0),x(this,"assetContainers",void 0),x(this,"logger",void 0),this.logger=new oe(this),this.textures=new Map,this.sounds=new Map,this.shaders=new Map,this.particleSystems=new Map,this.animationGroups=new Map,this.assetContainers=new Map}return y(e,[{key:"instantiateContainer",value:function(e){var t=this.assetContainers[e];return t?t.instantiateModelsToScene((function(e){return"".concat(e)}),!0):null}},{key:"createShaderMaterial",value:function(e,t,i,n){var s=["world","worldView","worldViewProjection","view","projection","iGlobalTime","dieType","lastEvent","lastEventTime"];n&&s.push.apply(s,R(Object.keys(n)));var r=new M.ShaderMaterial(e,null,{vertex:i.key,fragment:i.key},{attributes:["position","normal","uv"],uniforms:s});return r.setFloat("iGlobalTime",0),r.setInt("lastEvent",0),r.setFloat("lastEventTime",0),r.setInt("dieType",0),this.deserializeUniforms(n,t).forEach((function(e){return e(r)})),r}},{key:"deserializeUniforms",value:function(e,t){var i=this,n=[];return e&&Object.keys(e).forEach((function(s){var r=e[s];if("texture"===r.type){var o=i.getTexture(r.value,t);if(!o)return void i.logger.warn("Could not load texture ".concat(r.value," for uniform ").concat(s));o.isReady||i.logger.warn("tex ".concat(o.name," not ready")),n.push((function(e){return e.setTexture(s,o)}))}else if("color"===r.type){var a=M.Color3.FromHexString(r.value);n.push((function(e){return e.setColor3(s,a)}))}else if("number"===r.type||"float"===r.type)n.push((function(e){return e.setFloat(s,r.value)}));else{if("int"!==r.type)throw"Unsupported uniform type ".concat(r.type);n.push((function(e){return e.setInt(s,r.value)}))}})),n}},{key:"getTexture",value:function(e,t){return this.textures[e]||null}},{key:"getSound",value:function(e){return this.sounds[e]||null}},{key:"getShader",value:function(e){return this.shaders[e]||null}},{key:"getParticleSystem",value:function(e,t){var i=this.particleSystems[e];return i?i.clone(i.name,t):null}},{key:"getAnimationGroup",value:function(e,t,i){var n=this.animationGroups[e];if(!n)return null;var s=JSON.parse(n);if(!s)return null;if(s.targetedAnimations&&s.targetedAnimations.length>0)for(var r=function(){var e,t,n=s.targetedAnimations[o],r=n.targetId,a="".concat(i.uniqueId,"-").concat(r),l=i.getChildMeshes(!1,(function(e){return e.id==r||e.id==a}));l&&1===l.length&&(l[0].id=a,n.targetId=a),null===(e=n.animation)||void 0===e||null===(t=e.keys)||void 0===t||t.forEach((function(e){var t;e.values=null===(t=e.values)||void 0===t?void 0:t.map((function(e){return"randomRotation"===e&&(e=Math.random()*Math.PI*2),e}))}))},o=0;o<s.targetedAnimations.length;o++)r();return M.AnimationGroup.Parse(s,t)}},{key:"clearTextureCache",value:function(){var e=this;Object.keys(this.textures).forEach((function(t){e.textures[t].dispose()})),this.textures.clear()}},{key:"addToTextureCache",value:function(e,t){this.textures[e]=t}},{key:"addToSoundCache",value:function(e,t){this.sounds[e]=t}},{key:"addToShaderCache",value:function(e,t){this.shaders[e]=t}},{key:"addToParticleSystemCache",value:function(e,t){this.particleSystems[e]=t}},{key:"addToAnimationGroupCache",value:function(e,t){this.animationGroups[e]=t}},{key:"addAssetContainer",value:function(e,t){this.assetContainers[e]=t}}]),e}();const _e=new fe;var me=function(e){ne(s,e);var t,i,n=(t=s,i=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,n=re(t);if(i){var s=re(this).constructor;e=Reflect.construct(n,arguments,s)}else e=n.apply(this,arguments);return se(this,e)});function s(e,t,i){var r;_(this,s);var o=_e.getShader(i);return x(te(r=n.call(this,"DepthDieMaterial",e,{fragmentSource:o.key,vertexSource:o.key})),"dissolveMap",void 0),x(te(r),"dissolveValue",void 0),r}return y(s)}(M.ShaderMaterial),ge=function(){function e(t,i){_(this,e),x(this,"velocity",new M.Vector3),x(this,"angularVelocity",new M.Vector3),x(this,"maxWobble",.13),x(this,"wobbleSpeed",1),x(this,"recovery",2),x(this,"wobbleAmountX",0),x(this,"wobbleAmountZ",0),x(this,"wobbleAmountToAddX",0),x(this,"wobbleAmountToAddZ",0),x(this,"pulse",0),x(this,"lastPos",new M.Vector3),x(this,"lastRot",new M.Vector3),x(this,"time",0),x(this,"deltaTime",0),x(this,"objectPositionName",void 0),x(this,"cutName",void 0),x(this,"wobbleXName",void 0),x(this,"wobbleZName",void 0),x(this,"mesh",void 0),x(this,"rootMesh",void 0),this.mesh=t,this.rootMesh=i,this.objectPositionName=this.mesh.material.getBlockByName("ObjectPosition").output.associatedVariableName,this.cutName=this.mesh.material.getBlockByName("Cut").output.associatedVariableName,this.mesh.material.Cut=this.mesh.material.getBlockByName("Cut"),this.wobbleXName=this.mesh.material.getBlockByName("WobbleX").output.associatedVariableName,this.wobbleZName=this.mesh.material.getBlockByName("WobbleZ").output.associatedVariableName}return y(e,[{key:"lerp",value:function(e,t,i){return e*(1-i)+t*i}},{key:"clamp",value:function(e,t,i){return e<=t?t:e>=i?i:e}},{key:"Update",value:function(e){this.deltaTime=e,this.time+=this.deltaTime,this.wobbleAmountToAddX=this.lerp(this.wobbleAmountToAddX,0,this.deltaTime*this.recovery),this.wobbleAmountToAddZ=this.lerp(this.wobbleAmountToAddZ,0,this.deltaTime*this.recovery),this.pulse=2*Math.PI*this.wobbleSpeed,this.wobbleAmountX=this.wobbleAmountToAddX*Math.sin(this.pulse*this.time),this.wobbleAmountZ=this.wobbleAmountToAddZ*Math.sin(this.pulse*this.time);var t=this.mesh.material.getEffect();t.setFloat(this.wobbleXName,this.wobbleAmountX),t.setFloat(this.wobbleZName,this.wobbleAmountZ),t.setVector3(this.objectPositionName,this.rootMesh.position),this.velocity=this.lastPos.subtract(this.rootMesh.position).divide(new M.Vector3(this.deltaTime,this.deltaTime,this.deltaTime)),this.angularVelocity=this.rootMesh.rotation.subtract(this.lastRot),this.wobbleAmountToAddX+=this.clamp((this.velocity.x+.2*this.angularVelocity.z)*this.maxWobble,-this.maxWobble,this.maxWobble),this.wobbleAmountToAddZ+=this.clamp((this.velocity.z+.2*this.angularVelocity.x)*this.maxWobble,-this.maxWobble,this.maxWobble),this.lastPos=this.rootMesh.position.clone(),this.lastRot=this.rootMesh.rotation.clone()}}]),e}();function ve(e,t,i,n){i&&Object.defineProperty(e,t,{enumerable:i.enumerable,configurable:i.configurable,writable:i.writable,value:i.initializer?i.initializer.call(n):void 0})}function ye(){return ye="undefined"!=typeof Reflect&&Reflect.get?Reflect.get.bind():function(e,t,i){var n=function(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=re(e)););return e}(e,t);if(n){var s=Object.getOwnPropertyDescriptor(n,t);return s.get?s.get.call(arguments.length<3?e:i):s.value}},ye.apply(this,arguments)}function xe(e,t,i,n,s){var r={};return Object.keys(n).forEach((function(e){r[e]=n[e]})),r.enumerable=!!r.enumerable,r.configurable=!!r.configurable,("value"in r||r.initializer)&&(r.writable=!0),r=i.slice().reverse().reduce((function(i,n){return n(e,t,i)||i}),r),s&&void 0!==r.initializer&&(r.value=r.initializer?r.initializer.call(s):void 0,r.initializer=void 0),void 0===r.initializer&&(Object.defineProperty(e,t,r),r=null),r}var be=o(4649),Te=o(4141);const Se="\n\nvarying vec3 vPosition;\n\n\n";var Ee=o(1979),Ce=o(9500),Ae=o(2208);var Pe,Re,Me,Ie,De,Oe,we,Ne,Fe,Le,Be,Ue,Ve,ke,Ge,ze,We,He,Xe,je,Ye,qe,Ke,$e,Qe,Ze,Je,et,tt,it,nt,st,rt,ot=y((function e(){_(this,e),x(this,"Fragment_Begin",void 0),x(this,"Fragment_Definitions",void 0),x(this,"Fragment_MainBegin",void 0),x(this,"Fragment_Custom_Albedo",void 0),x(this,"Fragment_Before_Lights",void 0),x(this,"Fragment_Custom_MetallicRoughness",void 0),x(this,"Fragment_Custom_MicroSurface",void 0),x(this,"Fragment_Before_Fog",void 0),x(this,"Fragment_Custom_Alpha",void 0),x(this,"Fragment_Before_FragColor",void 0),x(this,"Vertex_Begin",void 0),x(this,"Vertex_Definitions",void 0),x(this,"Vertex_MainBegin",void 0),x(this,"Vertex_Before_PositionUpdated",void 0),x(this,"Vertex_Before_NormalUpdated",void 0),x(this,"Vertex_MainEnd",void 0)})),at=function(e){ne(s,e);var t,i,n=(t=s,i=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,n=re(t);if(i){var s=re(this).constructor;e=Reflect.construct(n,arguments,s)}else e=n.apply(this,arguments);return se(this,e)});function s(e,t){var i;return _(this,s),x(te(i=n.call(this,e,t)),"CustomParts",void 0),x(te(i),"_isCreatedShader",void 0),x(te(i),"_createdShaderName",void 0),x(te(i),"_customUniform",void 0),x(te(i),"_newUniforms",void 0),x(te(i),"_newUniformInstances",void 0),x(te(i),"_newSamplerInstances",void 0),x(te(i),"_customAttributes",void 0),x(te(i),"FragmentShader",void 0),x(te(i),"VertexShader",void 0),i.CustomParts=new ot,i.customShaderNameResolve=i.Builder,i.FragmentShader=Ee.Q.ShadersStore.pbrPixelShader,i.VertexShader=Ee.Q.ShadersStore.pbrVertexShader,i}return y(s,[{key:"AttachAfterBind",value:function(e,t){for(var i=0;i<this._newUniformInstances.length;i++)"vec2"==(n=i.toString().split("-"))[0]?t.setVector2(n[1],this._newUniformInstances[i]):"vec3"==n[0]?t.setVector3(n[1],this._newUniformInstances[i]):"vec4"==n[0]?t.setVector4(n[1],this._newUniformInstances[i]):"mat4"==n[0]?t.setMatrix(n[1],this._newUniformInstances[i]):"float"==n[0]&&t.setFloat(n[1],this._newUniformInstances[i]);for(i=0;i<this._newSamplerInstances.length;i++){var n;"sampler2D"==(n=i.toString().split("-"))[0]&&this._newSamplerInstances[i].isReady&&this._newSamplerInstances[i].isReady()&&t.setTexture(n[1],this._newSamplerInstances[i])}}},{key:"ReviewUniform",value:function(e,t){if("uniform"==e)for(var i=0;i<this._newUniforms.length;i++)-1==this._customUniform[i].indexOf("sampler")&&t.push(this._newUniforms[i]);if("sampler"==e)for(i=0;i<this._newUniforms.length;i++)-1!=this._customUniform[i].indexOf("sampler")&&t.push(this._newUniforms[i]);return t}},{key:"Builder",value:function(e,t,i,n,r,o){var a=this;if(o&&this._customAttributes&&this._customAttributes.length>0&&o.push.apply(o,R(this._customAttributes)),this.ReviewUniform("uniform",t),this.ReviewUniform("sampler",n),this._isCreatedShader)return this._createdShaderName;this._isCreatedShader=!1,s.ShaderIndexer++;var l="custom_"+s.ShaderIndexer,h=this._afterBind.bind(this);return this._afterBind=function(e,t){if(t){a.AttachAfterBind(e,t);try{h(e,t)}catch(t){}}},Ee.Q.ShadersStore[l+"VertexShader"]=this.VertexShader.replace("#define CUSTOM_VERTEX_BEGIN",this.CustomParts.Vertex_Begin?this.CustomParts.Vertex_Begin:"").replace("#define CUSTOM_VERTEX_DEFINITIONS",(this._customUniform?this._customUniform.join("\n"):"")+(this.CustomParts.Vertex_Definitions?this.CustomParts.Vertex_Definitions:"")).replace("#define CUSTOM_VERTEX_MAIN_BEGIN",this.CustomParts.Vertex_MainBegin?this.CustomParts.Vertex_MainBegin:"").replace("#define CUSTOM_VERTEX_UPDATE_POSITION",this.CustomParts.Vertex_Before_PositionUpdated?this.CustomParts.Vertex_Before_PositionUpdated:"").replace("#define CUSTOM_VERTEX_UPDATE_NORMAL",this.CustomParts.Vertex_Before_NormalUpdated?this.CustomParts.Vertex_Before_NormalUpdated:"").replace("#define CUSTOM_VERTEX_MAIN_END",this.CustomParts.Vertex_MainEnd?this.CustomParts.Vertex_MainEnd:""),Ee.Q.ShadersStore[l+"PixelShader"]=this.FragmentShader.replace("#define CUSTOM_FRAGMENT_BEGIN",this.CustomParts.Fragment_Begin?this.CustomParts.Fragment_Begin:"").replace("#define CUSTOM_FRAGMENT_MAIN_BEGIN",this.CustomParts.Fragment_MainBegin?this.CustomParts.Fragment_MainBegin:"").replace("#define CUSTOM_FRAGMENT_DEFINITIONS",(this._customUniform?this._customUniform.join("\n"):"")+(this.CustomParts.Fragment_Definitions?this.CustomParts.Fragment_Definitions:"")).replace("#define CUSTOM_FRAGMENT_UPDATE_ALBEDO",this.CustomParts.Fragment_Custom_Albedo?this.CustomParts.Fragment_Custom_Albedo:"").replace("#define CUSTOM_FRAGMENT_UPDATE_ALPHA",this.CustomParts.Fragment_Custom_Alpha?this.CustomParts.Fragment_Custom_Alpha:"").replace("#define CUSTOM_FRAGMENT_BEFORE_LIGHTS",this.CustomParts.Fragment_Before_Lights?this.CustomParts.Fragment_Before_Lights:"").replace("#define CUSTOM_FRAGMENT_UPDATE_METALLICROUGHNESS",this.CustomParts.Fragment_Custom_MetallicRoughness?this.CustomParts.Fragment_Custom_MetallicRoughness:"").replace("#define CUSTOM_FRAGMENT_UPDATE_MICROSURFACE",this.CustomParts.Fragment_Custom_MicroSurface?this.CustomParts.Fragment_Custom_MicroSurface:"").replace("#define CUSTOM_FRAGMENT_BEFORE_FOG",this.CustomParts.Fragment_Before_Fog?this.CustomParts.Fragment_Before_Fog:"").replace("#define CUSTOM_FRAGMENT_BEFORE_FRAGCOLOR",this.CustomParts.Fragment_Before_FragColor?this.CustomParts.Fragment_Before_FragColor:""),this._isCreatedShader=!0,this._createdShaderName=l,l}},{key:"AddUniform",value:function(e,t,i){return this._customUniform||(this._customUniform=new Array,this._newUniforms=new Array,this._newSamplerInstances=new Array,this._newUniformInstances=new Array),i&&(t.indexOf("sampler"),this._newUniformInstances[t+"-"+e]=i),this._customUniform.push("uniform "+t+" "+e+";"),this._newUniforms.push(e),this}},{key:"AddAttribute",value:function(e){return this._customAttributes||(this._customAttributes=[]),this._customAttributes.push(e),this}},{key:"Fragment_Begin",value:function(e){return this.CustomParts.Fragment_Begin=e,this}},{key:"Fragment_Definitions",value:function(e){return this.CustomParts.Fragment_Definitions=e,this}},{key:"Fragment_MainBegin",value:function(e){return this.CustomParts.Fragment_MainBegin=e,this}},{key:"Fragment_Custom_Albedo",value:function(e){return this.CustomParts.Fragment_Custom_Albedo=e.replace("result","surfaceAlbedo"),this}},{key:"Fragment_Custom_Alpha",value:function(e){return this.CustomParts.Fragment_Custom_Alpha=e.replace("result","alpha"),this}},{key:"Fragment_Before_Lights",value:function(e){return this.CustomParts.Fragment_Before_Lights=e,this}},{key:"Fragment_Custom_MetallicRoughness",value:function(e){return this.CustomParts.Fragment_Custom_MetallicRoughness=e,this}},{key:"Fragment_Custom_MicroSurface",value:function(e){return this.CustomParts.Fragment_Custom_MicroSurface=e,this}},{key:"Fragment_Before_Fog",value:function(e){return this.CustomParts.Fragment_Before_Fog=e,this}},{key:"Fragment_Before_FragColor",value:function(e){return this.CustomParts.Fragment_Before_FragColor=e.replace("result","color"),this}},{key:"Vertex_Begin",value:function(e){return this.CustomParts.Vertex_Begin=e,this}},{key:"Vertex_Definitions",value:function(e){return this.CustomParts.Vertex_Definitions=e,this}},{key:"Vertex_MainBegin",value:function(e){return this.CustomParts.Vertex_MainBegin=e,this}},{key:"Vertex_Before_PositionUpdated",value:function(e){return this.CustomParts.Vertex_Before_PositionUpdated=e.replace("result","positionUpdated"),this}},{key:"Vertex_Before_NormalUpdated",value:function(e){return this.CustomParts.Vertex_Before_NormalUpdated=e.replace("result","normalUpdated"),this}},{key:"Vertex_MainEnd",value:function(e){return this.CustomParts.Vertex_MainEnd=e,this}}]),s}(Ce.Y);x(at,"ShaderIndexer",1),(0,Ae.H)("BABYLON.PBRCustomMaterial",at);var lt=(Pe=(0,M.serialize)(),Re=(0,M.serializeAsTexture)("numberTexture"),Me=(0,M.serializeAsColor3)("numberColor"),Ie=(0,M.serializeAsColor3)("numberHighlightColor"),De=(0,M.serialize)(),Oe=(0,M.serializeAsTexture)("dissolveTexture"),we=(0,M.serialize)(),Ne=(0,M.serializeAsTexture)("glitterNoiseTexture"),Fe=(0,M.serializeAsTexture)("glitterPatternTexture"),Le=(0,M.serialize)(),Be=(0,M.serialize)(),Ue=(0,M.serialize)(),Ve=(0,M.serialize)(),ke=(0,M.serialize)(),Ge=(0,M.serialize)(),ze=(0,M.serialize)(),We=function(e){ne(s,e);var t,i,n=(t=s,i=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,n=re(t);if(i){var s=re(this).constructor;e=Reflect.construct(n,arguments,s)}else e=n.apply(this,arguments);return se(this,e)});function s(e,t){var i;return _(this,s),ve(te(i=n.call(this,e,t)),"dieType",He,te(i)),ve(te(i),"numberTexture",Xe,te(i)),ve(te(i),"numberColor",je,te(i)),ve(te(i),"numberHighlightColor",Ye,te(i)),ve(te(i),"numberBumpScale",qe,te(i)),ve(te(i),"dissolveTexture",Ke,te(i)),ve(te(i),"glitterScale",$e,te(i)),ve(te(i),"glitterNoiseTexture",Qe,te(i)),ve(te(i),"glitterPatternTexture",Ze,te(i)),ve(te(i),"dissolveValue",Je,te(i)),ve(te(i),"useNumbers",et,te(i)),ve(te(i),"marbleAmplitude",tt,te(i)),ve(te(i),"marbleTiming",it,te(i)),ve(te(i),"marbleZoom",nt,te(i)),ve(te(i),"numbersMode",st,te(i)),ve(te(i),"fadeSpeed",rt,te(i)),i.AddUniform("iGlobalTime","float",0),i.AddUniform("dieType","lowp int",0),i.AddUniform("numberTexture","sampler2D",null),i.AddUniform("numberBumpScale","float",-i.numberBumpScale),i.AddUniform("numberColor","vec3",new Te.P(.8,.8,.8)),i.AddUniform("numberHighlightColor","vec3",new Te.P(1,1,1)),i.AddUniform("numberFadeCutoff","float",i.useNumbers?1:.11),i.AddUniform("numbersMode","lowp int",0),i.AddUniform("fadeSpeed","float",0),i.AddUniform("topFaceNormal","vec3",null),i.AddUniform("dissolveTexture","sampler2D",null),i.AddUniform("dissolveEdgeColor","vec3",new Te.P(.8,.8,.8)),i.AddUniform("dissolveValue","float",0),i.AddUniform("lastEvent","lowp int",0),i.AddUniform("lastEventTime","float",0),i.AddUniform("dieValue","lowp int",0),i.AddUniform("glitterScale","float",0),i.AddUniform("glitterNoiseTexture","sampler2D",null),i.AddUniform("glitterPatternTexture","sampler2D",null),i.AddUniform("marbleNoiseTexture","sampler2D",null),i.AddUniform("marbleAmplitude","float",0),i.AddUniform("marbleTiming","float",.025),i.AddUniform("marbleZoom","float",.5),i.invertNormalMapX=!1,i.invertNormalMapY=!1,i.onBind=function(){return i.updateUniforms()},i.allowShaderHotSwapping=!0,i.customShaderNameResolve=i.Builder,i.setCustomInspectableProperties(),i}return y(s,[{key:"Builder",value:function(e,t,i,n,r){var o,a=this;null===(o=this.glitterNoiseTexture)||void 0===o||o.updateSamplingMode(1);var l=this.name;this.ReviewUniform("uniform",t),this.ReviewUniform("sampler",n);var h=this._afterBind.bind(this);this._afterBind=function(e,t){if(t){a.AttachAfterBind(e,t);try{h(e,t)}catch(t){}}};var c=[];return this.numberTexture&&c.push("#define USE_NUMBERS"),this.marbleAmplitude>0&&this.albedoTexture&&c.push("#define USE_MARBLE"),this.Fragment_Definitions("\n"+c.join("\n")+"\n#ifdef USE_NUMBERS\n\n#define NUMBERS_DEFAULT 1\n#define NUMBERS_HIGHLIGHT_TOPFACE 2\n\n#define NUMBERS_PULSE 1\n#define NUMBERS_FADE_IN 2\n\n#define NUMBER_PULSE_SPEED 1.5\n#define D4_Y_CUTOFF 0.09\n\n// This controls how fine the number fadeouts are (zoom factor into noise map)\n#define NUMBER_FADE_FREQ 4.0\n\n#define vNumbersUV vBumpUV\n\nvec4 sampleNumbersTexture(vec2 coords) {\n    // Invert colors so the numbers are white on black\n    vec3 numText = texture2D(numberTexture, coords).rgb;\n    return vec4(1.0 - numText, numText.r);\n}\n\nvec4 stampNumbers(vec3 normal, int mode) {\n    if (gl_FrontFacing == false) {\n        return vec4(0.0);\n    }\n\n    // Controls mix between number color and number highlight color\n    lowp float glowAmount = 0.0;\n\n    if (lastEvent >= 2 && (mode == NUMBERS_HIGHLIGHT_TOPFACE || mode == NUMBERS_PULSE || mode == NUMBERS_FADE_IN)) {\n        if (dieType == 4) {\n            glowAmount = vPositionW.y > D4_Y_CUTOFF ? 1.0 : 0.0;\n        } else {\n            // topFaceNormal refers to the normal of the face that is used as the roll result.\n            // Determine how similar it is to the normal of the current pixel being processed.\n            // If they are very similar, this pixel is on the top face. Make it glow!\n            // We want the dotproduct to be between [-1.0,1.0] so normalize the two vectors.\n            float dotY = dot(normalize(topFaceNormal), normalize(normal));\n            if (dotY > 0.99) {\n                glowAmount = 1.0;\n            }\n        }\n    }\n\n    // Get raw number texture\n    vec2 numTex = sampleNumbersTexture(vec2(vNumbersUV)).xz;\n\n    numTex.y *= numberFadeCutoff;\n\n    if (mode == NUMBERS_PULSE) {\n        glowAmount = glowAmount * (0.5 + 0.5*sin(NUMBER_PULSE_SPEED * iGlobalTime));\n    } else if (mode == NUMBERS_FADE_IN) {\n        float delta = lastEvent < 2 ? 0.0 : (iGlobalTime - lastEventTime);\n        glowAmount = glowAmount * (1.0 - exp(-1.0 * pow((delta / fadeSpeed), 4.0)));\n    }\n    return vec4(numTex.x * mix(numberColor, numberHighlightColor, glowAmount), numTex.y);\n}\n\nvec2 computeNumbersDerivative() {\n    vec2 dSTdx = dFdx( vNumbersUV );\n    vec2 dSTdy = dFdy( vNumbersUV );\n    float Hll = numberBumpScale * sampleNumbersTexture(vNumbersUV).x;\n    float dBx = (numberBumpScale * sampleNumbersTexture(vNumbersUV + dSTdx ).x) - Hll;\n    float dBy = (numberBumpScale * sampleNumbersTexture(vNumbersUV + dSTdy ).x) - Hll;\n    return vec2( dBx, dBy );\n}\n\nvec3 perturbNormalArb2( vec3 surf_pos, vec3 surf_norm, vec2 dHdxy ) {\n    vec3 vSigmaX = vec3( dFdx( surf_pos.x ), dFdx( surf_pos.y ), dFdx( surf_pos.z ) );\n    vec3 vSigmaY = vec3( dFdy( surf_pos.x ), dFdy( surf_pos.y ), dFdy( surf_pos.z ) );\n    vec3 vN = surf_norm;\n    vec3 R1 = cross( vSigmaY, vN );\n    vec3 R2 = cross( vN, vSigmaX );\n    float fDet = dot( vSigmaX, R1 );\n    fDet *= ( float( gl_FrontFacing ) * 2.0 - 1.0 );\n    vec3 vGrad = sign( fDet ) * ( dHdxy.x * R1 + dHdxy.y * R2 );\n    return normalize( abs( fDet ) * surf_norm - vGrad );\n}\n\nvec3 bumpNumbers(vec3 normal) {\n    return perturbNormalArb2(vPositionW, normal, computeNumbersDerivative());\n}\n#endif\n\n#ifdef USE_MARBLE\n#define NUM_OCTAVES 20\nvec2 domainWarp(vec2 coords) {\n    float amplitude = marbleAmplitude;\n    float accumulatedNoise = 0.0;\n    vec2 noiseCoords = coords + float(dieType);\n    for (int i = 0; i<NUM_OCTAVES; i++) {\n        noiseCoords += iGlobalTime * marbleTiming;\n        accumulatedNoise += amplitude * texture2D(marbleNoiseTexture, noiseCoords).r;\n        amplitude *= marbleAmplitude;\n        noiseCoords *= 2.0;\n    }\n    coords = vec2(coords.x, coords.y + accumulatedNoise);\n    return coords;\n}\n\n#endif\n"+Se),this.Vertex_Definitions("\n"+Se+"\n"),this.Vertex_Before_NormalUpdated("\n\nvPosition = positionUpdated.xzy;\n\n\n"),this.Fragment_Before_Lights("#ifdef USE_NUMBERS\n    normalW   = bumpNumbers(normalW );\n#endif\n"),this.Fragment_Custom_Alpha("#ifdef USE_MARBLE\n\nvec2 warpUv = mix(\n    vPosition.xy,\n    vPosition.zx,\n    vPosition.z\n)*marbleZoom;\nsurfaceAlbedo = toLinearSpace(texture2D(albedoSampler, domainWarp(warpUv)).rgb);\n\n#endif"),this.Fragment_Before_FragColor("\n#define vGlitterUV vBumpUV\nif (glitterScale > 0.0) {\n    vec2 glitterNormalCoords = vGlitterUV * glitterScale;\n\n    // This should be viewDirection in object space\n    mat3 invTBN = transposeMat3(TBN);\n    vec3 tanViewDir = invTBN * viewDirectionW;\n\n    float glitterDepthScale = 1.0;\n    float height = texture2D(glitterNoiseTexture, glitterNormalCoords).r;\n    vec2 glitterUVOffset = -glitterDepthScale * tanViewDir.xy * height;\n\n    // The normal for the piece of glitter you'd see at this angle\n    vec3 glitterNormalMap = texture2D(glitterNoiseTexture, glitterNormalCoords + glitterUVOffset).rgb;\n    // [0, 1] => [-0.5, 0.5] \n    glitterNormalMap = glitterNormalMap -= 0.5;\n\n    vec3 glitterColor = vec3(0.0);\n    if (length(glitterNormalMap) > 0.1) {\n        // then normalize to [-1, 1]\n        glitterNormalMap = normalize(glitterNormalMap);\n\n        vec3 l = -vPositionW.xyz;\n        vec3 r = normalize(reflect(l, glitterNormalMap));\n        float glitterReflectance = max(0., dot(viewDirectionW, r));\n        glitterReflectance = pow(glitterReflectance, 2.0);\n        //glitterReflectance = dot(viewDirectionW, glitterNormalMap);\n        \n        if (glitterReflectance > 0.0) {\n            glitterColor = texture2D(glitterPatternTexture, glitterNormalCoords).rgb;\n            glitterColor = (1.0 - height) * glitterReflectance * glitterColor;\n        }\n\n        finalColor = vec4(finalColor.rgb + glitterColor, finalColor.a);\n    }\n}\n#ifdef USE_NUMBERS\n    vec4 numColor = stampNumbers(vNormalW, numbersMode);\n    \n    // For pixels beyond a certain alpha value, add the number color to a mixed version of the current color\n    // attenuated by the inverse of the number alpha  We don't use mix() as that would premultiply the alpha \n    // into the number color, and it already has been\n    if (numColor.a > 0.1) {\n        finalColor = vec4(numColor.rgb, max(numColor.a, finalColor.a));\n    }\n    \n    if (gl_FrontFacing == true) {\n        finalColor.a = max(finalColor.a, numColor.a);\n    } \n    \n#endif\n\nif (gl_FrontFacing == false) {\n    finalColor.a *= 0.1;\n}\n\n#define vDissolveUV vBumpUV\n\n\nif (lastEvent > 4) {\n    float n = texture2D(dissolveTexture,  vPositionW.xz).x - dissolveValue;\n    if(n < 0.0) { discard; }\n    #ifdef USE_DISSOLVE_EDGE\n        if(n < 0.05) { gl_FragColor.rgb = dissolveEdgeColor; }\n    #endif\n}"),s.isDieShaderCreated(l)||(M.Effect.ShadersStore[l+"VertexShader"]=this.VertexShader.replace("#define CUSTOM_VERTEX_BEGIN",this.CustomParts.Vertex_Begin?this.CustomParts.Vertex_Begin:"").replace("#define CUSTOM_VERTEX_DEFINITIONS",(this._customUniform?this._customUniform.join("\n"):"")+(this.CustomParts.Vertex_Definitions?this.CustomParts.Vertex_Definitions:"")).replace("#define CUSTOM_VERTEX_MAIN_BEGIN",this.CustomParts.Vertex_MainBegin?this.CustomParts.Vertex_MainBegin:"").replace("#define CUSTOM_VERTEX_UPDATE_POSITION",this.CustomParts.Vertex_Before_PositionUpdated?this.CustomParts.Vertex_Before_PositionUpdated:"").replace("#define CUSTOM_VERTEX_UPDATE_NORMAL",this.CustomParts.Vertex_Before_NormalUpdated?this.CustomParts.Vertex_Before_NormalUpdated:"").replace("#define CUSTOM_VERTEX_MAIN_END",this.CustomParts.Vertex_MainEnd?this.CustomParts.Vertex_MainEnd:""),M.Effect.ShadersStore[l+"PixelShader"]=this.FragmentShader.replace("#define CUSTOM_FRAGMENT_BEGIN",this.CustomParts.Fragment_Begin?this.CustomParts.Fragment_Begin:"").replace("#define CUSTOM_FRAGMENT_MAIN_BEGIN",this.CustomParts.Fragment_MainBegin?this.CustomParts.Fragment_MainBegin:"").replace("#define CUSTOM_FRAGMENT_DEFINITIONS",(this._customUniform?this._customUniform.join("\n"):"")+(this.CustomParts.Fragment_Definitions?this.CustomParts.Fragment_Definitions:"")).replace("#define CUSTOM_FRAGMENT_UPDATE_ALBEDO",this.CustomParts.Fragment_Custom_Albedo?this.CustomParts.Fragment_Custom_Albedo:"").replace("#define CUSTOM_FRAGMENT_UPDATE_ALPHA",this.CustomParts.Fragment_Custom_Alpha?this.CustomParts.Fragment_Custom_Alpha:"").replace("#define CUSTOM_FRAGMENT_BEFORE_LIGHTS",this.CustomParts.Fragment_Before_Lights?this.CustomParts.Fragment_Before_Lights:"").replace("#define CUSTOM_FRAGMENT_UPDATE_METALLICROUGHNESS",this.CustomParts.Fragment_Custom_MetallicRoughness?this.CustomParts.Fragment_Custom_MetallicRoughness:"").replace("#define CUSTOM_FRAGMENT_UPDATE_MICROSURFACE",this.CustomParts.Fragment_Custom_MicroSurface?this.CustomParts.Fragment_Custom_MicroSurface:"").replace("#define CUSTOM_FRAGMENT_BEFORE_FOG",this.CustomParts.Fragment_Before_Fog?this.CustomParts.Fragment_Before_Fog:"").replace("#define CUSTOM_FRAGMENT_BEFORE_FRAGCOLOR",this.CustomParts.Fragment_Before_FragColor?this.CustomParts.Fragment_Before_FragColor:"")),l}},{key:"setCustomInspectableProperties",value:function(){this.inspectableCustomProperties=[{label:"Number Bump Scale",propertyName:"numberBumpScale",type:M.InspectableType.Slider},{label:"Number Color",propertyName:"numberColor",type:M.InspectableType.Color3},{label:"Number Highlight Color",propertyName:"numberHighlightColor",type:M.InspectableType.Color3},{label:"Glitter Scale",propertyName:"glitterScale",type:M.InspectableType.Slider}]}},{key:"updateUniforms",value:function(){var e=this.getEffect();e.setInt("dieType",this.dieType),e.setTexture("numberTexture",this.numberTexture),e.setFloat("numberBumpScale",-this.numberBumpScale),e.setColor3("numberColor",this.numberColor),e.setColor3("numberHighlightColor",this.numberHighlightColor),e.setFloat("numberFadeCutoff",this.useNumbers?1:0),e.setInt("numbersMode",this.numbersMode),e.setFloat("fadeSpeed",this.fadeSpeed),e.setTexture("dissolveTexture",this.dissolveTexture),e.setFloat("dissolveValue",0),e.setFloat("glitterScale",this.glitterScale),this.glitterNoiseTexture&&e.setTexture("glitterNoiseTexture",this.glitterNoiseTexture),this.glitterPatternTexture&&e.setTexture("glitterPatternTexture",this.glitterPatternTexture),e.setTexture("marbleNoiseTexture",this.dissolveTexture),e.setFloat("marbleAmplitude",this.marbleAmplitude),e.setFloat("marbleTiming",this.marbleTiming),e.setFloat("marbleZoom",this.marbleZoom)}},{key:"hasTexture",value:function(e){return!!ye(re(s.prototype),"hasTexture",this).call(this,e)||this.numberTexture==e||this.dissolveTexture==e||this.glitterNoiseTexture==e||this.glitterPatternTexture==e}},{key:"getActiveTextures",value:function(){var e=ye(re(s.prototype),"getActiveTextures",this).call(this);return this.numberTexture&&e.push(this.numberTexture),this.dissolveTexture&&e.push(this.dissolveTexture),this.glitterNoiseTexture&&e.push(this.glitterNoiseTexture),this.glitterPatternTexture&&e.push(this.glitterPatternTexture),e}},{key:"clone",value:function(e){var t=this,i=M.SerializationHelper.Clone((function(){return new s(e,t.getScene())}),this);return i.id=e,i.name=e,i.numberBumpScale=this.numberBumpScale,i.useNumbers=this.useNumbers,this.clearCoat.copyTo(i.clearCoat),this.anisotropy.copyTo(i.anisotropy),this.brdf.copyTo(i.brdf),this.sheen.copyTo(i.sheen),this.subSurface.copyTo(i.subSurface),i}},{key:"dispose",value:function(e,t){t&&(this.numberTexture&&this.numberTexture.dispose(),this.dissolveTexture&&this.dissolveTexture.dispose(),this.glitterNoiseTexture&&this.glitterNoiseTexture.dispose(),this.glitterPatternTexture&&this.glitterPatternTexture.dispose()),ye(re(s.prototype),"dispose",this).call(this,e,t)}}],[{key:"isDieShaderCreated",value:function(e){var t=!!M.Effect.ShadersStore[e+"VertexShader"],i=!!M.Effect.ShadersStore[e+"PixelShader"];return t||i}}]),s}(at),He=xe(We.prototype,"dieType",[Pe],{configurable:!0,enumerable:!0,writable:!0,initializer:null}),Xe=xe(We.prototype,"numberTexture",[Re],{configurable:!0,enumerable:!0,writable:!0,initializer:null}),je=xe(We.prototype,"numberColor",[Me],{configurable:!0,enumerable:!0,writable:!0,initializer:function(){return be.Wo.FromHexString("#880000")}}),Ye=xe(We.prototype,"numberHighlightColor",[Ie],{configurable:!0,enumerable:!0,writable:!0,initializer:function(){return be.Wo.FromHexString("#FF0000")}}),qe=xe(We.prototype,"numberBumpScale",[De],{configurable:!0,enumerable:!0,writable:!0,initializer:function(){return.1}}),Ke=xe(We.prototype,"dissolveTexture",[Oe],{configurable:!0,enumerable:!0,writable:!0,initializer:null}),$e=xe(We.prototype,"glitterScale",[we],{configurable:!0,enumerable:!0,writable:!0,initializer:function(){return 0}}),Qe=xe(We.prototype,"glitterNoiseTexture",[Ne],{configurable:!0,enumerable:!0,writable:!0,initializer:null}),Ze=xe(We.prototype,"glitterPatternTexture",[Fe],{configurable:!0,enumerable:!0,writable:!0,initializer:null}),Je=xe(We.prototype,"dissolveValue",[Le],{configurable:!0,enumerable:!0,writable:!0,initializer:function(){return 0}}),et=xe(We.prototype,"useNumbers",[Be],{configurable:!0,enumerable:!0,writable:!0,initializer:function(){return!0}}),tt=xe(We.prototype,"marbleAmplitude",[Ue],{configurable:!0,enumerable:!0,writable:!0,initializer:function(){return 0}}),it=xe(We.prototype,"marbleTiming",[Ve],{configurable:!0,enumerable:!0,writable:!0,initializer:function(){return.025}}),nt=xe(We.prototype,"marbleZoom",[ke],{configurable:!0,enumerable:!0,writable:!0,initializer:function(){return.5}}),st=xe(We.prototype,"numbersMode",[Ge],{configurable:!0,enumerable:!0,writable:!0,initializer:function(){return 1}}),rt=xe(We.prototype,"fadeSpeed",[ze],{configurable:!0,enumerable:!0,writable:!0,initializer:function(){return 2}}),We);var ht=function(e){ne(s,e);var t,i,n=(t=s,i=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}(),function(){var e,n=re(t);if(i){var s=re(this).constructor;e=Reflect.construct(n,arguments,s)}else e=n.apply(this,arguments);return se(this,e)});function s(e,t,i,r,o,a){var l;return _(this,s),(l=n.call(this,e,i,null,r,o,a)).setFragment(t),l}return y(s,[{key:"isReady",value:function(){return ye(re(s.prototype),"isReady",this).call(this)&&Object.values(this._textures).every((function(e){return e.isReady()}))}}]),s}(M.ProceduralTexture),ct=function(e,t){var i=e.x,n=e.y,s=e.z,r=t.x,o=t.y,a=t.z,l=t.w,h=l*i+o*s-a*n,c=l*n+a*i-r*s,u=l*s+r*n-o*i,d=-r*i-o*n-a*s;return e.x=h*l+d*-r+c*-a-u*-o,e.y=c*l+d*-o+u*-r-h*-a,e.z=u*l+d*-a+h*-o-c*-r,e},ut=function(e){return e.x*e.x+e.y*e.y+e.z*e.z},dt=function(e,t){var i=Math.sqrt(ut(e)*ut(t));0===i&&console.error("angleTo() can't handle zero length vectors.");var n,s=function(e,t){return e.x*t.x+e.y*t.y+e.z*t.z}(e,t)/i;return Math.acos((n=s,-1,1,Math.max(-1,Math.min(1,n))))};var pt=function(e){return e[e.INT_TYPE=0]="INT_TYPE",e[e.FLOAT_TYPE=1]="FLOAT_TYPE",e[e.VEC3_TYPE=2]="VEC3_TYPE",e}(pt||{}),ft=function(){function e(){_(this,e),x(this,"_uniforms",new Map)}return y(e,[{key:"setInt",value:function(e,t){this._uniforms.set(e,{type:pt.INT_TYPE,value:t})}},{key:"setFloat",value:function(e,t){this._uniforms.set(e,{type:pt.FLOAT_TYPE,value:t})}},{key:"setVec3",value:function(e,t){this._uniforms.set(e,{type:pt.VEC3_TYPE,value:t})}},{key:"applyUniforms",value:function(e){this._uniforms.forEach((function(t,i){var n=t.value;switch(t.type){case pt.INT_TYPE:e.setInt(i,n);break;case pt.FLOAT_TYPE:e.setFloat(i,Math.fround(n));break;case pt.VEC3_TYPE:n&&e.setVector3(i,n)}}))}}]),e}();const _t=function(e){return new Promise((function(t){return setTimeout(t,e)}))};var mt=function(){function e(t,i){_(this,e),x(this,"options",void 0),x(this,"DiceManager",void 0),x(this,"meshParent",void 0),x(this,"object",void 0),x(this,"onEventObservable",new M.Observable),x(this,"animationGroups",void 0),x(this,"animationStates",void 0),x(this,"rollIndex",void 0),x(this,"particleSystems",void 0),x(this,"events",void 0),x(this,"pairedDie",void 0),x(this,"globalTime",0),x(this,"logger",void 0),x(this,"collisionSounds",void 0),x(this,"uniformContainer",void 0),x(this,"proceduralTextures",void 0),x(this,"currentEvent",null),x(this,"faceValue",void 0),x(this,"result",{value:0,normal:M.Vector3.Up(),angle:0}),this.logger=new oe(this),this.options=i,this.DiceManager=t,this.object=null,this.animationGroups=null,this.animationStates=null,this.particleSystems=[],this.events=new Map,this.uniformContainer=new ft,this.proceduralTextures=[]}var t;return y(e,[{key:"create",value:function(e,t){var i,n=this,s=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],r=e[t],o=_e.instantiateContainer(r.modelFile);this.meshParent=o.rootNodes[0],this.setEnabled(!1);var a=this.DiceManager.SceneManager.scene;this._setupProceduralTextures(o.rootNodes,e,a),this.animationGroups=new Map,this.animationStates=new Map,o.animationGroups.map((function(e){n.animationGroups[e.name]=e,n.animationStates[e.name]=Z.NONE})),this.meshParent.position.y=this.options.baseHeight,this.updateSceneMeshChildren(this.meshParent,r),this.meshParent.scalingDeterminant=this.options.size*this.options.meshSizeMultiplier*(null!==(i=r.scale)&&void 0!==i?i:1),this.DiceManager.PhysicsManager.add(this.meshParent,this.options,r),s&&this._configureCollisionHandler(),this.instantiateParticleSystems(r),this.configureAnimations(r),this.configureSounds(r),r.siblingNodes&&this.instantiateSiblingNodes(r.siblingNodes,e)}},{key:"instantiateSiblingNodes",value:function(e,t){var i=this;e.forEach((function(e,n){var s,r,o,a,l,h=_e.instantiateContainer(e),c=h.rootNodes[0];c.parent=i.meshParent,c.scalingDeterminant=null!==(s=null===(r=t[e])||void 0===r?void 0:r.scale)&&void 0!==s?s:1,null!==(o=t[e])&&void 0!==o&&o.randomRotation&&(c.rotation=new M.Vector3(0,2*Math.random()*Math.PI,0)),h.animationGroups.forEach((function(e){i.animationGroups[e.name]=e,i.animationStates[e.name]=Z.NONE})),null!==(a=t[e])&&void 0!==a&&a.enforceBoundaries&&i.enforceBoundaries(c),null!==(l=t[e])&&void 0!==l&&l.stackSiblings&&i.stackSibling(c,t[e].stackSiblings),i.configureAnimations(t[e])}))}},{key:"enforceBoundaries",value:function(e){if(!this.DiceManager.previewDie){var t=e.getScene(),i=t.getMeshByName("wall1").position,n=t.getMeshByName("wall2").position,s=t.getMeshByName("wall3").position,r=t.getMeshByName("wall4").position,o=function(){var t=e.getHierarchyBoundingVectors(),o=t.min,a=t.max;o.z<i.z&&(e.position.z+=.05),a.z>n.z&&(e.position.z-=.05),a.x>s.x&&(e.position.x-=.05),o.x<r.x&&(e.position.x+=.05)};this.onEventObservable.add((function(e){"dieRemoved"===e&&t.unregisterBeforeRender(o)})),t.registerBeforeRender(o)}}},{key:"stackSibling",value:function(e,t){var i=this;this.onEventObservable.add((function(n){"rollComplete"===n&&(e.position.y+=i.DiceManager.stackOrder++*t),"dieRemoved"===n&&--i.DiceManager.stackOrder}))}},{key:"_setupProceduralTextures",value:function(e,t,i){var n=this;e.forEach((function(e){return e.getChildMeshes().forEach((function(e){n._setupProceduralTexturesOnObject(e.material,t,i),e.material instanceof M.PBRMaterial&&e.material.clearCoat&&n._setupProceduralTexturesOnObject(e.material.clearCoat,t,i)}))}))}},{key:"_setupProceduralTexturesOnObject",value:function(e,t,i){var n=this;e&&Object.keys(e).forEach((function(s){var r=e[s];if(r instanceof ht){var o=r.clone();e[s]=o,n.proceduralTextures.push(o);var a=t.resources.textures[o.name].uniforms;_e.deserializeUniforms(a,i).forEach((function(e){return e(o)})),n.logger.log("Cloning ".concat(r.name," for ").concat(s))}}))}},{key:"isFinished",value:function(){return e=this.meshParent.physicsImpostor.getAngularVelocity(),t=this.meshParent.physicsImpostor.getLinearVelocity(),e.lengthSquared()<.1&&t.lengthSquared()<.1;var e,t}},{key:"getUpsideValue",value:function(){var e=function(e,t,i,n){for(var s,r,o=new M.Vector3(0,e?-1:1),a=2*Math.PI,l=0;l<i.length;++l)if(-1!==n[l]){var h=new M.Vector3(i[l].x,i[l].y,i[l].z),c=ct(h,t),u=dt(c,o);u<a&&(a=u,r=c,s=n[l])}return{closest_face:s,closest_normal:r,closest_angle:a}}(this.options.invertUpside,this.meshParent.physicsImpostor.physicsBody.quaternion,this.meshParent.physicsImpostor.physicsBody.shapes[0].faceNormals,this.options.faces.map((function(e){return e[e.length-1]}))),t=e.closest_face,i=e.closest_normal,n=e.closest_angle;void 0!==this.options.numberValues&&(t=this.options.numberValues[t]);var s=t;if(this.options.dieType===r.d100&&this.pairedDie&&this.options.dieType>this.pairedDie.options.dieType){var o=this.pairedDie.getUpsideValue();10===o.result&&(o.result=0),s+=o.result,this.options.dieType===r.d100&&0===s&&(s=100)}return this.faceValue=t,this.result.angle=n,this.result.normal=i,this.result.value=s,{result:s,dieValue:t}}},{key:"disablePhysics",value:function(){this.meshParent.physicsImpostor.dispose()}},{key:"getDepthMaterial",value:function(e,t){return new me(this.DiceManager.SceneManager.scene,e,t.materials.defaultDepth.fragmentShader)}},{key:"instantiateParticleSystems",value:function(e){var t=this;$.Particles&&e.particleSystems&&e.particleSystems.forEach((function(e){var i=_e.getParticleSystem(e.definition,t.meshParent);if(i){var n;t.particleSystems.push(i);var s=null===(n=t.DiceManager.diceManifest.resources)||void 0===n?void 0:n.particleSystems[e.definition],r=i.getCustomEffect(i.blendMode);if(r){var o=_e.deserializeUniforms(s.uniforms,t.DiceManager.SceneManager.scene);r.onBind=function(){o.forEach((function(e){return e(r)})),r.setFloat("time",t.globalTime),r.setVector3("origin",t.meshParent.position)}}if(s.particleTexture){var a=_e.getTexture(s.particleTexture,t.DiceManager.SceneManager.scene);i.particleTexture=a.clone()}t.onEventObservable.add((function(n){t.handleTrigger(n,e,(function(e){e.loop||(i.targetStopDuration=.05),i.start()}),(function(e){i.stop()}))}))}}))}},{key:"setEnabled",value:function(e){this.meshParent.setEnabled(e)}},{key:"handleTrigger",value:function(e,t,i,n,s){t.triggerReverse&&(e==t.triggerReverse||t.triggerReverse.indexOf(e)>=0)&&s(t),t.triggerStart==e?i(t):t.triggerStop&&(e==t.triggerStop||t.triggerStop.indexOf(e)>=0)&&n(t)}},{key:"configureAnimations",value:function(e){var t,i=this;null===(t=e.animations)||void 0===t||t.forEach((function(e){Array.isArray(e)?i.handleRandomAnimation(e):i.configureAnimation(e)}))}},{key:"handleRandomAnimation",value:function(e){var t=this,i=e.length,n=e[Math.floor(Math.random()*i)];Array.isArray(n)?n.forEach((function(e){t.configureAnimation(e)})):this.configureAnimation(n)}},{key:"configureAnimation",value:function(e){var t=this;try{var i=this.animationGroups[e.definition];if(!i){var n=_e.getAnimationGroup(e.definition,this.DiceManager.SceneManager.scene,this.meshParent);if(!n)return;this.animationGroups[e.definition]=n,i=n}this.onEventObservable.add((function(n,s){try{t.handleTrigger(n,e,(function(e){var r;(s.currentTarget===e.value||"rollComplete"===n&&void 0===e.value)&&(i.stop(),null!==(r=i.metadata)&&void 0!==r&&r.uvOffsets&&t.configureUvAnimation(i),i.start(e.loop,1,0,i.to),t.animationStates[e.definition]=Z.START,t.onEventObservable.notifyObservers(e.definition,void 0,void 0,void 0))}),(function(e){i.stop(),t.animationStates[e.definition]=Z.STOP}),(function(e){s.currentTarget!==e.value&&[Z.START,Z.STOP].includes(t.animationStates[e.definition])&&(i.stop(),i.start(e.loop,1,i.to,0),t.animationStates[e.definition]=Z.RESET)}))}catch(e){t.logger.error(e)}}))}catch(e){this.logger.error(e)}}},{key:"configureUvAnimation",value:function(e){var t=this.result.value;this.options.dieType===r.d100?t=this.faceValue?this.faceValue/10:0:this.options.dieType===r.d10&&10===this.faceValue&&(t=0),e.targetedAnimations.forEach((function(i){var n;if(i.animation.targetProperty.indexOf("uOffset")>0)i.animation.setKeys([{frame:0,value:null===(n=e.metadata)||void 0===n?void 0:n.uvOffsets[t][0]}]);else if(i.animation.targetProperty.indexOf("vOffset")>0){var s;i.animation.setKeys([{frame:0,value:null===(s=e.metadata)||void 0===s?void 0:s.uvOffsets[t][1]}])}}))}},{key:"configureSounds",value:function(e){var t=this;e.sounds&&e.sounds.forEach((function(e){try{if(e.triggerStart){var i=_e.getSound(e.definition);i&&t.onEventObservable.add((function(n){t.DiceManager.SceneManager.scene.audioEnabled&&t.handleTrigger(n,e,(function(e){i.isPlaying||(i.setPosition(t.DiceManager.SceneManager.camera.position),i.setVolume(1),i.play())}),(function(e){return i.stop()}))}))}}catch(e){t.logger.error(e)}}))}},{key:"isReady",value:function(){return this.meshParent.isReady(!0)}},{key:"_configureCollisionHandler",value:function(){var e=this;this.collisionSounds=[];for(var t=0;t<3;t++){var i=_e.getSound("collision".concat(t+1));i&&this.collisionSounds.push(i.clone())}this.DiceManager.PhysicsManager.collisionEvent(this.meshParent,(function(t){if(e.DiceManager.throwRunning){e._processEvent("collision");var i=Math.abs(t.contact.getImpactVelocityAlongNormal());if(e.DiceManager.SceneManager.scene.audioEnabled){var n=e.collisionSounds[Math.floor(Math.random()*e.collisionSounds.length)];if(n&&!n.isPlaying){var s=M.Scalar.Clamp(i,0,1);n.attachToMesh(e.meshParent),n.setVolume(s),n.play(),n.detachFromMesh()}}$.Vibrate&&navigator.vibrate&&navigator.vibrate(i/2)}}))}},{key:"updateSceneMeshChildren",value:function(e,t){var i=this;this.uniformContainer.setInt("dieType",this.options.values),this.uniformContainer.setInt("dieValue",0),this.DiceManager.SceneManager.scene.onBeforeRenderObservable.add((function(){i.updateProceduralTextureUniforms()})),e.getChildMeshes(!1).forEach((function(n){var s,r,o=new Map;if(((null===(s=t.materials[(null===(r=n.material)||void 0===r?void 0:r.name)||"default"])||void 0===s?void 0:s.snippets)||[]).forEach((function(t){"liquid"===t&&o.set("liquid",new ge(n,e))})),n.material.onBindObservable.add((function(e,t){o.forEach((function(e,t){e.Update(i.DiceManager.SceneManager.scene.deltaTime/1e3)})),i.updateMaterialUniforms(n.material)})),$.Shadow>K.None){var a,l,h=!(null!==(a=t.materials[(null===(l=n.material)||void 0===l?void 0:l.name)||"default"])&&void 0!==a&&a.disableShadow);h?i.DiceManager.SceneManager.shadowGenerator.addShadowCaster(n,!1):i.logger.log("".concat(n.name," shadows disabled due to material config")),n.receiveShadows=h}}))}},{key:"updateMaterialUniforms",value:function(e){var t=null==e?void 0:e.getEffect();t&&this.uniformContainer.applyUniforms(t)}},{key:"updateProceduralTextureUniforms",value:function(){var e=this;this.proceduralTextures.forEach((function(t){e.uniformContainer.applyUniforms(t)}))}},{key:"updateGlobalTimeUniform",value:function(e){this.globalTime+=e/1e3,this.uniformContainer.setFloat("iGlobalTime",this.globalTime)}},{key:"update",value:function(e){this.updateGlobalTimeUniform(e)}},{key:"_processEvent",value:function(e,t){this.onEventObservable.notifyObservers(e,void 0,void 0,t),(!this.currentEvent||Q[e]>=this.currentEvent)&&(this.currentEvent=Q[e],this.uniformContainer.setInt("lastEvent",Q[e]),this.uniformContainer.setFloat("lastEventTime",this.globalTime))}},{key:"onRollBegin",value:function(){this._processEvent("rollBegin")}},{key:"onRollComplete",value:function(e){this._processEvent("rollComplete",e),this.options.dieType===r.d100?this.uniformContainer.setInt("dieValue",0===e?10:e/10):this.uniformContainer.setInt("dieValue",e),this.uniformContainer.setVec3("topFaceNormal",this.result.normal)}},{key:"onMinRoll",value:function(){this._processEvent("minRoll")}},{key:"onMaxRoll",value:function(){this._processEvent("maxRoll")}},{key:"onDieRemoved",value:function(){this._processEvent("dieRemoved"),this.result.value===this.options.values?this._processEvent("critDieRemoved"):1===this.result.value?this._processEvent("failDieRemoved"):this._processEvent("nonCritNonFailDieRemoved")}},{key:"runRemoval",value:function(){var e=this;this.DiceManager.PhysicsManager.remove(this.meshParent);var t=Date.now()+3e3;this.update=function(i){var n=.001*(t-Date.now());e.meshParent.getChildMeshes().forEach((function(e){e.material&&e.material instanceof lt&&(e.material.dissolveValue=3-n)})),e.uniformContainer.setFloat("dissolveValue",3-n),e.updateGlobalTimeUniform(i),n<=0&&(e.update=function(){},e.dispose(),e.particleSystems.forEach((function(e){return e.dispose()})))}}},{key:"dispose",value:function(){var e=this;try{this.particleSystems.forEach((function(e){return e.dispose(!0)})),this.meshParent.getChildMeshes().forEach((function(e){var t,i,n;null==e||null===(t=e.material)||void 0===t||t.unbind(),(null==e?void 0:e.material)instanceof M.ShaderMaterial?null==e||null===(i=e.material)||void 0===i||i.dispose(!1,!1,!0):null==e||null===(n=e.material)||void 0===n||n.dispose(!1,!0,!0)})),this.meshParent.dispose(!1,!1),Object.keys(this.animationGroups).forEach((function(t){e.animationGroups[t].dispose(),delete e.animationGroups[t]}))}catch(e){this.logger.error(e)}}},{key:"roll",value:(t=f(T().mark((function e(t,i,n,s){var r;return T().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return(r={x:0,z:0}).x=n<3?-(n-1)*ee.DistanceBetween/2:-2*ee.DistanceBetween/2,r.z=n<9?-Math.floor((n-1)%9/3)*ee.DistanceBetween/2:-2*ee.DistanceBetween/2,this.onRollBegin(),this.setEnabled(!0),this.meshParent.position.set(i%3*ee.DistanceBetween+t.x+r.x,ee.StartHeight+Math.floor(i/9)*ee.DistanceBetween,Math.floor(i%9/3)*ee.DistanceBetween+t.z+r.z),this.meshParent.physicsImpostor.sleep(),this.meshParent.rotate(M.Axis.X,Math.random()*(2*Math.PI),M.Space.WORLD),this.meshParent.rotate(M.Axis.Y,Math.random()*(2*Math.PI),M.Space.WORLD),this.meshParent.rotate(M.Axis.Z,Math.random()*(2*Math.PI),M.Space.WORLD),e.next=12,_t(5);case 12:this.meshParent.physicsImpostor.wakeUp(),this.meshParent.physicsImpostor.setAngularVelocity(new M.Vector3(20*Math.random()-10,20*Math.random()-10,20*Math.random()-10)),this.meshParent.physicsImpostor.setLinearVelocity(s);case 15:case"end":return e.stop()}}),e,this)}))),function(e,i,n,s){return t.apply(this,arguments)})},{key:"toJSON",value:function(){return{dieType:this.options.dieType,dieValue:this.result.value}}}],[{key:"CreateRandomVelocity",value:function(e){var t=ee.BaseStrength+e*ee.AddPerDieStrength,i=Math.random()*t,n=t-i;return i*=Math.random()>=.5?1:-1,n*=Math.random()>=.5?1:-1,new M.Vector3(i,ee.StrengthHeight,n)}}]),e}(),gt=o(2318),vt=y((function e(t,i,n,s){var r=arguments.length>4&&void 0!==arguments[4]?arguments[4]:void 0,o=arguments.length>5&&void 0!==arguments[5]?arguments[5]:void 0,a=arguments.length>6&&void 0!==arguments[6]?arguments[6]:void 0;_(this,e),x(this,"key",void 0),x(this,"type",void 0),x(this,"vertexUrl",void 0),x(this,"fragmentUrl",void 0),x(this,"vertexText",void 0),x(this,"fragmentText",void 0),x(this,"pixelUrl",void 0),x(this,"pixelText",void 0),this.key=t,this.type="shader",this.vertexUrl=i,this.fragmentUrl=n,this.vertexText=r,this.fragmentText=o,this.pixelUrl=s,this.pixelText=a}));const yt=vt;function xt(e,t){return e&&!e.startsWith("http")&&(e=(e="".concat(t,"/").concat(e)).replace(/([^:]\/|^\/)\/+/g,"$1")),e}function bt(e,t){var i="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!i){if(Array.isArray(e)||(i=function(e,t){if(e){if("string"==typeof e)return Tt(e,t);var i=Object.prototype.toString.call(e).slice(8,-1);return"Object"===i&&e.constructor&&(i=e.constructor.name),"Map"===i||"Set"===i?Array.from(e):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?Tt(e,t):void 0}}(e))||t&&e&&"number"==typeof e.length){i&&(e=i);var n=0,s=function(){};return{s,n:function(){return n>=e.length?{done:!0}:{done:!1,value:e[n++]}},e:function(e){throw e},f:s}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var r,o=!0,a=!1;return{s:function(){i=i.call(e)},n:function(){var e=i.next();return o=e.done,e},e:function(e){a=!0,r=e},f:function(){try{o||null==i.return||i.return()}finally{if(a)throw r}}}}function Tt(e,t){(null==t||t>e.length)&&(t=e.length);for(var i=0,n=new Array(t);i<t;i++)n[i]=e[i];return n}var St=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",i=arguments.length>1?arguments[1]:void 0,n=arguments.length>2?arguments[2]:void 0;_(this,e),x(this,"baseLocation",void 0),x(this,"manifestRelativeLocation",void 0),x(this,"scene",void 0),x(this,"logger",void 0),x(this,"bundle",void 0),x(this,"manifest",void 0),this.logger=new oe(this),this.baseLocation=t,this.scene=i,this.bundle=n,M.SceneLoader.ShowLoadingScreen=!1,M.SceneLoader.OnPluginActivatedObservable.add((function(e){e instanceof gt.GLTFFileLoader&&(e.animationStartMode=gt.GLTFLoaderAnimationStartMode.NONE,gt.GLTFFileLoader.IncrementalLoading=!1)}),void 0,void 0,void 0,!0)}var t,i;return y(e,[{key:"createAssetsManager",value:function(){var e=this,t=new M.AssetsManager(this.scene);return t.useDefaultLoadingScreen=!1,t.onTaskErrorObservable.add((function(t){e.logger.error("AssetManager task failed",t.errorObject.message,t.errorObject.exception)})),t.onTaskSuccessObservable.add((function(t){e.logger.info("AssetManager task ".concat(t.name," complete"))})),t}},{key:"resolveUrl",value:function(e){var t=this;return new Promise((function(i){if(t.bundle){var n=t.bundle.file(e);return n||(t.logger.warn("".concat(e," not found in bundle")),i(xt(e,t.baseLocation))),n.async("blob").then((function(e){var t=URL.createObjectURL(e);i(t)}))}e.startsWith("/")?i(xt(e,t.baseLocation)):i(xt(e,t.baseLocation+t.manifestRelativeLocation))}))}},{key:"loadManifest",value:function(e){var t=this,i=this.createAssetsManager();return new Promise(function(){var n=f(T().mark((function n(s,r){var o;return T().wrap((function(n){for(;;)switch(n.prev=n.next){case 0:return(o=i.addTextFileTask("manifest",e)).onSuccess=function(i){try{t.logger.debug("Manifest ".concat(i.url," loaded"));var n=JSON.parse(o.text);t.logger.debug("Manifest parsed");var a=e.substring(t.baseLocation.length);a=a.substring(0,a.lastIndexOf("/")+1),t.manifestRelativeLocation=a,t.manifest=n,s(n)}catch(e){r(e)}},n.next=4,i.loadAsync();case 4:case"end":return n.stop()}}),n)})));return function(e,t){return n.apply(this,arguments)}}())}},{key:"loadAssets",value:function(){var e=this;return new Promise(function(){var t=f(T().mark((function t(i){var n,s,r;return T().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:return n=e.createAssetsManager(),e.logger.groupCollapsed("Loading Assets"),n.onTasksDoneObservable.add((function(t){e.logger.groupEnd()})),s=e.getLoadableAssets(),r=[],s.map((function(t){t instanceof ue?r.push(e._loadTexture(t,n)):t instanceof yt?(t.vertexUrl||(t.vertexUrl="/shaders/default.vert"),r.push(e._loadShader(t,n))):t instanceof ce&&r.push(e.loadSound(t,n))})),t.next=8,Promise.all(r);case 8:return t.next=10,n.loadAsync();case 10:return e.logger.log("AssetManager.loadAsync() First Stage"),r=[],s.map((function(t){e.logger.log("Create load promise for ".concat(t.key)),t instanceof he?r.push(e._loadMesh(t,n)):t instanceof de?r.push(e._loadParticleSystem(t,n)):t instanceof pe&&r.push(e._loadAnimationGroup(t,n))})),e.logger.log("Waiting on ".concat(r.length," resources to load")),t.next=16,Promise.all(r);case 16:return t.next=18,n.loadAsync();case 18:e.logger.log("AssetManager.loadAsync() complete"),i();case 20:case"end":return t.stop()}}),t)})));return function(e){return t.apply(this,arguments)}}())}},{key:"_loadShader",value:function(e,t){var i=this;return e.pixelUrl?this.resolveUrl(e.pixelUrl).then((function(i){_e.addToShaderCache(e.key,new yt(e.key,null,null,null)),i&&(t.addTextFileTask("shader-".concat(e.key,"-pixel"),i).onSuccess=function(t){var i=_e.getShader(e.key);i.pixelText=t.text,i.pixelUrl=t.url,M.Effect.ShadersStore["".concat(e.key,"PixelShader")]=t.text})})):this.resolveUrl(e.vertexUrl).then((function(n){i.resolveUrl(e.fragmentUrl).then((function(i){_e.addToShaderCache(e.key,new yt(e.key,null,null,null)),n&&(t.addTextFileTask("shader-".concat(e.key,"-vert"),n).onSuccess=function(t){var i=_e.getShader(e.key);i.vertexText=t.text,i.vertexUrl=t.url,M.Effect.ShadersStore["".concat(e.key,"VertexShader")]=t.text}),i&&(t.addTextFileTask("shader-".concat(e.key,"-frag"),i).onSuccess=function(t){var i=_e.getShader(e.key);i.fragmentText=t.text,i.fragmentUrl=t.url,M.Effect.ShadersStore["".concat(e.key,"FragmentShader")]=t.text})}))}))}},{key:"loadSound",value:function(e,t){var i=this;return this.resolveUrl(e.sound).then((function(n){var s=t.addBinaryFileTask("sound-".concat(e.key),n);s.onError=function(e,t){i.logger.error(t)},s.onSuccess=function(t){var n=new M.Sound(e.key,t.data,i.scene,null,{spatialSound:!0,distanceModel:"linear",rolloffFactor:1});_e.addToSoundCache(e.key,n)}}))}},{key:"_loadParticleSystem",value:function(e,t){var i=this;return this.resolveUrl(e.resourceUrl).then((function(n){var s=t.addTextFileTask("particle-".concat(e.key),n);s.onError=function(e,t){i.logger.error(t)},s.onSuccess=function(t){try{var n=JSON.parse(t.text);if(n&&n.systems&&n.systems.length>0){var s=M.ParticleSystem.Parse(n.systems[0],i.scene,"",!0);_e.addToParticleSystemCache(e.key,s)}}catch(e){i.logger.error("Could not parse particle system: "+e)}}}))}},{key:"_loadAnimationGroup",value:function(e,t){var i=this;return this.resolveUrl(e.resourceUrl).then((function(n){var s=t.addTextFileTask("anim-".concat(e.key),n);s.onError=function(e,t){i.logger.error(t)},s.onSuccess=function(t){try{if(e.clones)for(var n=function(){var i=r[s],n=e.clones[i],o=JSON.parse(t.text);o.name=n.name,n.targetedAnimations.forEach((function(e,t){for(var i=0,n=Object.keys(e);i<n.length;i++){var s=n[i];o.targetedAnimations[t][s]=e[s]}})),_e.addToAnimationGroupCache(i,JSON.stringify(o))},s=0,r=Object.keys(e.clones);s<r.length;s++)n();else _e.addToAnimationGroupCache(e.key,t.text)}catch(e){i.logger.error("Could not parse animation group: "+e)}}}))}},{key:"_loadTexture",value:function(e,t){var i=this;return this.resolveUrl(e.resourceUrl).then((function(n){var s=t.addTextureTask("texture-".concat(e.key),n,null,!1);s.onError=function(e,t){i.logger.error(t)},s.onSuccess=function(t){_e.addToTextureCache(e.key,t.texture)}}))}},{key:"_loadMesh",value:function(e,t){var i=this;return new Promise(function(){var t=f(T().mark((function t(n,s){var r,o,a,l;return T().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:return t.prev=0,t.next=3,i.resolveUrl(e.resourceUrl);case 3:return r=t.sent,o=e.resourceUrl.substr(e.resourceUrl.lastIndexOf(".")),i.logger.log("Loading AssetContainer ".concat(r)),t.next=8,M.SceneLoader.LoadAssetContainerAsync(r,null,i.scene,null,o);case 8:(a=t.sent).animationGroups.forEach((function(e){e.stop()})),a.meshes.forEach((function(e){e.parent||(l=e)})),l.name=e.key,_e.addAssetContainer(e.key,a),i.logger.log("LoadAssetContainerAsync complete ".concat(e.key)),n(),t.next=21;break;case 17:t.prev=17,t.t0=t.catch(0),i.logger.error(t.t0),s();case 21:case"end":return t.stop()}}),t,null,[[0,17]])})));return function(e,i){return t.apply(this,arguments)}}())}},{key:"correlateResources",value:(i=f(T().mark((function e(t){var i,n,s,r=this;return T().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:i=T().mark((function e(){var i,o,a,l;return T().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(i=s[n],(o=r.manifest[i])&&o.materials){e.next=4;break}return e.abrupt("return","continue");case 4:if(r.logger.groupCollapsed("Correlating resources for ".concat(i)),o.materials&&Object.keys(o.materials).forEach((function(e){if(r._isMaterialManifest(o.materials[e])){var i=r._getMaterialDefinition(e,o.materials);i.properties=r._deserializeMaterialProperties(i.properties,t)}})),!o.modelFile){e.next=12;break}return a=_e.assetContainers[o.modelFile],l=a.meshes[0],o.billboardMode&&(l.billboardMode=o.billboardMode),e.next=12,r._updateMaterials(i,l,o.materials);case 12:r.logger.groupEnd();case 13:case"end":return e.stop()}}),e)})),n=0,s=Object.keys(this.manifest);case 2:if(!(n<s.length)){e.next=10;break}return e.delegateYield(i(),"t0",4);case 4:if("continue"!==e.t0){e.next=7;break}return e.abrupt("continue",7);case 7:n++,e.next=2;break;case 10:case"end":return e.stop()}}),e,this)}))),function(e){return i.apply(this,arguments)})},{key:"_deserializeMaterialProperties",value:function(e,t){var i=this;if(e)return["sheen"].forEach((function(t){delete e[t]})),Object.keys(e).forEach((function(n){if(n.endsWith("Color")){var s=M.Color3.FromHexString(e[n]);e[n]=s}else if(n.endsWith("Texture")){var r=e[n],o="string"==typeof r?r:r.name,a=_e.getTexture(o,t);if(a)a.hasAlpha=!0,e[n]=a;else{var l=i.manifest.resources.textures[r];if(l&&"string"!=typeof l){var h=l,c=new ht(o,h.shader,h.size||512,t);_e.deserializeUniforms(h.uniforms,t).forEach((function(e){return e(c)})),e[n]=c}else delete e[n]}if("string"!=typeof r&&e[n]){var u=e[n].clone();Object.keys(r).forEach((function(e){u[e]=r[e]})),e[n]=u}}})),e}},{key:"_isMaterialManifest",value:function(e){return"string"!=typeof e}},{key:"_getMaterialDefinition",value:function(e,t){var i=t[e];return this._isMaterialManifest(i)?i:this.manifest.resources.materials[i]}},{key:"_updateMaterials",value:(t=f(T().mark((function e(t,i,n){var s,r,o,a=this;return T().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(!n){e.next=17;break}s=bt(i.getChildMeshes(!1)),e.prev=2,o=T().mark((function e(){var i,s,o,l,h,c,u,d,p,f;return T().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(s=r.value,a.logger.log("Updating Materials for ".concat(s.name," (").concat(null===(i=s.material)||void 0===i?void 0:i.name,")")),!s.material){e.next=32;break}if("__GLTFLoader._default"==(o=s.material.name||"default")&&(o="default"),!(l=a._getMaterialDefinition(o,n))||null==l||!l.shader||"default"==(null==l?void 0:l.shader)){e.next=11;break}(h=_e.getShader(l.shader))&&(c=s.material,s.material=_e.createShaderMaterial(o,a.scene,h,l.uniforms),a.scene.removeMaterial(c),c.dispose()),e.next=28;break;case 11:if(!(l&&null!=l&&l.nodeSnippet||null!=l&&l.nodeJson)){e.next=27;break}if(!l.nodeSnippet){e.next=18;break}return e.next=15,M.NodeMaterial.ParseFromSnippetAsync(l.nodeSnippet,a.scene);case 15:u=e.sent,e.next=24;break;case 18:return e.next=20,a.resolveUrl(l.nodeJson);case 20:return d=e.sent,e.next=23,M.NodeMaterial.ParseFromFileAsync(o,d,a.scene);case 23:u=e.sent;case 24:s.material=u,e.next=28;break;case 27:"default"===o&&(p=s.material,s.material=a.getDefaultMaterial(parseInt(t.substring(1)),a.manifest.setName),a.scene.removeMaterial(p),p.dispose(!0,!0));case 28:f=["anisotropy","brdf","clearCoat","detailMap","sheen","subSurface","iridescence","brdf"],l&&l.properties&&Object.keys(l.properties).forEach((function(e){f.includes(e)||(s.material[e]=l.properties[e])})),s.material instanceof M.PBRMaterial&&l&&l.properties&&(l.properties.sheenColor instanceof M.Color3&&(s.material.sheen.isEnabled=!0,s.material.sheen.color=l.properties.sheenColor),l.properties.clearCoatTexture instanceof M.Texture&&(s.material.clearCoat.isEnabled=!0,s.material.clearCoat.texture=l.properties.clearCoatTexture),l.properties.clearCoatBumpTexture instanceof M.Texture&&(s.material.clearCoat.isEnabled=!0,s.material.clearCoat.bumpTexture=l.properties.clearCoatBumpTexture),l.properties.clearCoatTintColor instanceof M.Color3&&(s.material.clearCoat.isEnabled=!0,s.material.clearCoat.isTintEnabled=!0,s.material.clearCoat.tintColor=l.properties.clearCoatTintColor),l.properties.clearCoatTintThickness&&(s.material.clearCoat.isEnabled=!0,s.material.clearCoat.tintThickness=l.properties.clearCoatTintThickness),l.properties.clearCoatRoughness&&(s.material.clearCoat.isEnabled=!0,s.material.clearCoat.roughness=l.properties.clearCoatRoughness),l.properties.clearCoatIOR&&(s.material.clearCoat.isEnabled=!0,s.material.clearCoat.indexOfRefraction=l.properties.clearCoatIOR),f.forEach((function(e){a._updateMaterialSubconfiguration(l,e,s.material)}))),s.material.sideOrientation=M.Mesh.DOUBLESIDE;case 32:case"end":return e.stop()}}),e)})),s.s();case 5:if((r=s.n()).done){e.next=9;break}return e.delegateYield(o(),"t0",7);case 7:e.next=5;break;case 9:e.next=14;break;case 11:e.prev=11,e.t1=e.catch(2),s.e(e.t1);case 14:return e.prev=14,s.f(),e.finish(14);case 17:case"end":return e.stop()}}),e,null,[[2,11,14,17]])}))),function(e,i,n){return t.apply(this,arguments)})},{key:"_updateMaterialSubconfiguration",value:function(e,t,i){var n=e.properties[t];n&&(this._deserializeMaterialProperties(n,this.scene),Object.keys(n).forEach((function(e){console.error(e),i[t][e]=n[e]})))}},{key:"getDefaultMaterial",value:function(e,t){var i="".concat(t,"-d").concat(e,"DieMaterial"),n=this.scene.getMaterialByName(i);return n||((n=new lt(i,this.scene)).dieType=e),n}},{key:"getLoadableAssets",value:function(){var e=this.manifest,t=[];if(e.resources){var i;e.resources.models&&Object.keys(e.resources.models).forEach((function(i){var n=e.resources.models[i];t.push(new he(i,n))})),e.resources.shaders&&Object.keys(e.resources.shaders).forEach((function(i){var n=e.resources.shaders[i];t.push(new yt(i,n.vertextShader,n.fragmentShader,n.pixelShader))})),e.resources.textures&&Object.keys(e.resources.textures).forEach((function(i){var n=e.resources.textures[i];"string"==typeof n&&t.push(new ue(i,n))})),e.resources.particleSystems&&Object.keys(e.resources.particleSystems).forEach((function(i){var n=e.resources.particleSystems[i];null!=n&&n.particleJson?t.push(new de(i,n.particleJson)):t.push(new de(i,n))})),e.resources.animationGroups&&Object.keys(e.resources.animationGroups).forEach((function(i){var n=e.resources.animationGroups[i];null!=n&&n.animationJson?t.push(new pe(i,n.animationJson,n.animationClones)):t.push(new pe(i,n))}));var n=null!==(i=e.resources.sounds)&&void 0!==i?i:{collision1:"/sounds/collision-1.wav",collision2:"/sounds/collision-2.wav",collision3:"/sounds/collision-3.wav"};Object.keys(n).forEach((function(e){var i=n[e];t.push(new ce(e,i))}))}return t}}]),e}();const Et=St;var Ct=function(){function e(){_(this,e),x(this,"SessionName",void 0)}return y(e,[{key:"init",value:function(e,t){this.SessionName=t,"function"!=typeof window.ga&&function(e,t,i,n,s,r,o){e.GoogleAnalyticsObject=s,e[s]=e[s]||function(){(e[s].q=e[s].q||[]).push(arguments)},e[s].l=1*new Date,r=t.createElement(i),o=t.getElementsByTagName(i)[0],r.async=1,r.src="https://www.google-analytics.com/analytics.js",o.parentNode.insertBefore(r,o)}(window,document,"script",0,"ga"),window.ga("create",e,"auto",t)}},{key:"log",value:function(e,t,i,n){window.ga("".concat(this.SessionName,".send"),"event",e,t,i,n)}}]),e}();const At=new Ct,Pt=function(e,t,i,n){var s=new M.Vector3,r=new M.Vector3;s.set(e,t,0),s=function(e,t,i,n){var s=t.viewport.toGlobal(i,n);return M.Vector3.Unproject(e,s.width,s.height,M.Matrix.Identity(),t.getViewMatrix(),t.getProjectionMatrix())}(s,i,n.width,n.height),s=s.subtract(i.position).normalize();var o=-i.position.y/s.y;return r.copyFrom(i.position).add(s.multiply((new M.Vector3).setAll(o)))};var Rt=function(){function e(t,i){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:s.Sum,r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:0;if(_(this,e),x(this,"count",void 0),x(this,"dieType",void 0),x(this,"dice",[]),x(this,"operation",void 0),x(this,"operand",void 0),this.count=t,this.dieType=i,this.operation=n,this.operation===s.Min||this.operation===s.Max){if(r<1)throw"Operand must be > 0 for Min or Max operations";this.operand=r}}return y(e,[{key:"toString",value:function(){switch(this.operation){case s.Min:return"".concat(this.count).concat(this.dieType,"kl").concat(this.operand);case s.Max:return"".concat(this.count).concat(this.dieType,"kh").concat(this.operand);default:return"".concat(this.count).concat(this.dieType)}}},{key:"getResult",value:function(){switch(this.operation){case s.Sum:return this.dice.reduce((function(e,t){return e+t.result.value}),0);case s.Min:return this.dice.map((function(e){return e.result.value})).sort((function(e,t){return e-t})).slice(0,this.operand).reduce((function(e,t){return e+t}));case s.Max:return this.dice.map((function(e){return e.result.value})).sort((function(e,t){return t-e})).slice(0,this.operand).reduce((function(e,t){return e+t}))}}},{key:"getResultStr",value:function(){switch(this.operation){case s.Sum:return this.dice.map((function(e){return e.result.value})).join("+");case s.Min:case s.Max:return"(".concat(this.dice.map((function(e){return e.result.value})).join(","),")")}}}]),e}(),Mt=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:void 0,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;_(this,e),x(this,"set",void 0),x(this,"constant",void 0),this.set=t||[],this.constant=i}return y(e,[{key:"toDiceNotationString",value:function(){var e="";return this.set&&this.set.length>0&&(e=this.set.map((function(e){return e.toString()})).join("+")),0!=this.constant&&(this.set.length>0?e+=this.constant>0?"+".concat(this.constant):this.constant:e="".concat(this.constant)),e}}],[{key:"parseDiceNotation",value:function(t){var i,n=l,o=t.split("@"),a=/\s*(\d*)d(\d+)((k[hl])(\d+))?(\s*(\+|\-)\s*(\d+)){0,1}\s*(\+|$)/gi,h=new e;if(!isNaN(Number(t)))return h.constant=Number(t),h;for(;i=a.exec(o[0]);){var c={count:i[1],dieType:i[2],opModifier:i[4],opConstant:i[5],constantOperation:i[7],constant:i[8]},u=parseInt(c.count);""===c.count&&(u=1);var d=r["d"+c.dieType];if(-1===n.indexOf(d))throw"Unknown die type ".concat(d);var p=new Rt(u,d);"kh"===c.opModifier?p.operation=s.Max:"kl"===c.opModifier&&(p.operation=s.Min),c.opConstant&&(p.operand=parseInt(c.opConstant)),h.set.push(p),c.constant&&c.constantOperation&&("+"===c.constantOperation?h.constant+=parseInt(c.constant):h.constant-=parseInt(c.constant))}if(h.set.length<1)throw"No dice specified";return h}}]),e}(),It=function(){function e(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:d.Roll,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:c.None;_(this,e),x(this,"diceNotation",void 0),x(this,"rollType",void 0),x(this,"rollKind",void 0),x(this,"result",void 0),this.diceNotation=t instanceof Mt?t:Mt.parseDiceNotation(t),this.rollType=i,this.rollKind=n}return y(e,[{key:"getDiceNotationString",value:function(){return this.diceNotation.toDiceNotationString()}}]),e}(),Dt=y((function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"custom",i=arguments.length>1?arguments[1]:void 0,n=arguments.length>2?arguments[2]:void 0;_(this,e),x(this,"context",void 0),x(this,"rollId",void 0),x(this,"action",void 0),x(this,"rolls",[]),x(this,"setId",void 0),this.action=t,this.context=n,i&&this.rolls.push(new It(i))})),Ot=o(8401),wt=o(708),Nt=o(2722),Ft=o(934),Lt=o(4389),Bt=o(58),Ut=o(4453);function Vt(e,t){(null==t||t>e.length)&&(t=e.length);for(var i=0,n=new Array(t);i<t;i++)n[i]=e[i];return n}var kt=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:10,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:CANNON;_(this,e),x(this,"_physicsMaterials",new Array),x(this,"_fixedTimeStep",1/60),x(this,"_cannonRaycastResult",void 0),x(this,"_raycastResult",void 0),x(this,"_physicsBodysToRemoveAfterStep",new Array),x(this,"_firstFrame",!0),x(this,"_useDeltaForWorldStep",!0),x(this,"BJSCANNON",void 0),x(this,"world",void 0),x(this,"name","customCannonJs"),x(this,"_minus90X",new Te._f(-.7071067811865475,0,0,.7071067811865475)),x(this,"_plus90X",new Te._f(.7071067811865475,0,0,.7071067811865475)),x(this,"_tmpPosition",Te.P.Zero()),x(this,"_tmpDeltaPosition",Te.P.Zero()),x(this,"_tmpUnityRotation",new Te._f),this.BJSCANNON=i,this.isSupported()?(this.world=new this.BJSCANNON.World,this.world.broadphase=new this.BJSCANNON.NaiveBroadphase,this.world.solver.iterations=t,this._cannonRaycastResult=new this.BJSCANNON.RaycastResult,this._raycastResult=new Ut.d):Nt.Y.Error("CannonJS is not available. Please make sure you included the js file.")}return y(e,[{key:"getPluginVersion",value:function(){return 1}},{key:"getBodyPressure",value:function(e){throw new Error("Method not implemented.")}},{key:"setBodyPressure",value:function(e,t){throw new Error("Method not implemented.")}},{key:"getBodyStiffness",value:function(e){throw new Error("Method not implemented.")}},{key:"setBodyStiffness",value:function(e,t){throw new Error("Method not implemented.")}},{key:"getBodyVelocityIterations",value:function(e){throw new Error("Method not implemented.")}},{key:"setBodyVelocityIterations",value:function(e,t){throw new Error("Method not implemented.")}},{key:"getBodyPositionIterations",value:function(e){throw new Error("Method not implemented.")}},{key:"setBodyPositionIterations",value:function(e,t){throw new Error("Method not implemented.")}},{key:"appendAnchor",value:function(e,t,i,n,s,r){throw new Error("Method not implemented.")}},{key:"appendHook",value:function(e,t,i,n,s){throw new Error("Method not implemented.")}},{key:"raycastToRef",value:function(e,t,i){throw new Error("Method not implemented.")}},{key:"setGravity",value:function(e){var t=e;this.world.gravity.set(t.x,t.y,t.z)}},{key:"setTimeStep",value:function(e){}},{key:"getTimeStep",value:function(){return this._fixedTimeStep}},{key:"executeStep",value:function(e,t){if(this._firstFrame){this._firstFrame=!1;var i,n=function(e,t){var i="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!i){if(Array.isArray(e)||(i=function(e,t){if(e){if("string"==typeof e)return Vt(e,t);var i=Object.prototype.toString.call(e).slice(8,-1);return"Object"===i&&e.constructor&&(i=e.constructor.name),"Map"===i||"Set"===i?Array.from(e):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?Vt(e,t):void 0}}(e))||t&&e&&"number"==typeof e.length){i&&(e=i);var n=0,s=function(){};return{s,n:function(){return n>=e.length?{done:!0}:{done:!1,value:e[n++]}},e:function(e){throw e},f:s}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var r,o=!0,a=!1;return{s:function(){i=i.call(e)},n:function(){var e=i.next();return o=e.done,e},e:function(e){a=!0,r=e},f:function(){try{o||null==i.return||i.return()}finally{if(a)throw r}}}}(t);try{for(n.s();!(i=n.n()).done;){var s=i.value;s.type!=Lt.Q.HeightmapImpostor&&s.type!==Lt.Q.PlaneImpostor&&s.beforeStep()}}catch(e){n.e(e)}finally{n.f()}}this.world.step(this._fixedTimeStep,this._useDeltaForWorldStep?e:0,3),this._removeMarkedPhysicsBodiesFromWorld()}},{key:"_removeMarkedPhysicsBodiesFromWorld",value:function(){var e=this;this._physicsBodysToRemoveAfterStep.length>0&&(this._physicsBodysToRemoveAfterStep.forEach((function(t){e.world.remove(t)})),this._physicsBodysToRemoveAfterStep=[])}},{key:"applyImpulse",value:function(e,t,i){var n=new this.BJSCANNON.Vec3(i.x,i.y,i.z),s=new this.BJSCANNON.Vec3(t.x,t.y,t.z);e.physicsBody.applyImpulse(s,n)}},{key:"applyForce",value:function(e,t,i){var n=new this.BJSCANNON.Vec3(i.x,i.y,i.z),s=new this.BJSCANNON.Vec3(t.x,t.y,t.z);e.physicsBody.applyForce(s,n)}},{key:"generatePhysicsBody",value:function(e){if(this._removeMarkedPhysicsBodiesFromWorld(),e.parent)e.physicsBody&&(this.removePhysicsBody(e),e.forceUpdate());else{if(e.isBodyInitRequired()){var t=this._createShape(e),i=e.physicsBody;i&&this.removePhysicsBody(e);var n=this._addMaterial("mat-"+e.uniqueId,e.getParam("friction"),e.getParam("restitution")),s={mass:e.getParam("mass"),material:n},r=e.getParam("nativeOptions");for(var o in r)r.hasOwnProperty(o)&&(s[o]=r[o]);e.physicsBody=new this.BJSCANNON.Body(s),e.physicsBody.addEventListener("collide",e.onCollide),this.world.addEventListener("preStep",e.beforeStep),this.world.addEventListener("postStep",e.afterStep),e.physicsBody.addShape(t),this.world.add(e.physicsBody),i&&["force","torque","velocity","angularVelocity"].forEach((function(t){var n=i[t];e.physicsBody[t].set(n.x,n.y,n.z)})),this._processChildMeshes(e)}this._updatePhysicsBodyTransformation(e)}}},{key:"_processChildMeshes",value:function(e){var t=this,i=e.object.getChildMeshes?e.object.getChildMeshes(!0):[],n=e.object.rotationQuaternion;i.length&&i.filter((function(e){return!!e.physicsImpostor})).forEach(function i(s,r){if(n&&r.rotationQuaternion){var o=r.getPhysicsImpostor();if(o&&o.parent!==e){var a=r.position.clone();o.physicsBody&&(t.removePhysicsBody(o),o.physicsBody=null),o.parent=e,o.resetUpdateFlags(),e.physicsBody.addShape(t._createShape(o),new t.BJSCANNON.Vec3(a.x,a.y,a.z)),e.physicsBody.mass+=o.getParam("mass")}n.multiplyInPlace(r.rotationQuaternion),r.getChildMeshes(!0).filter((function(e){return!!e.physicsImpostor})).forEach(i.bind(t,r.getAbsolutePosition()))}}.bind(this,e.object.getAbsolutePosition()))}},{key:"removePhysicsBody",value:function(e){e.physicsBody.removeEventListener("collide",e.onCollide),this.world.removeEventListener("preStep",e.beforeStep),this.world.removeEventListener("postStep",e.afterStep),-1===this._physicsBodysToRemoveAfterStep.indexOf(e.physicsBody)&&this._physicsBodysToRemoveAfterStep.push(e.physicsBody)}},{key:"generateJoint",value:function(e){var t=e.mainImpostor.physicsBody,i=e.connectedImpostor.physicsBody;if(t&&i){var n,s=e.joint.jointData,r={pivotA:s.mainPivot?(new this.BJSCANNON.Vec3).set(s.mainPivot.x,s.mainPivot.y,s.mainPivot.z):null,pivotB:s.connectedPivot?(new this.BJSCANNON.Vec3).set(s.connectedPivot.x,s.connectedPivot.y,s.connectedPivot.z):null,axisA:s.mainAxis?(new this.BJSCANNON.Vec3).set(s.mainAxis.x,s.mainAxis.y,s.mainAxis.z):null,axisB:s.connectedAxis?(new this.BJSCANNON.Vec3).set(s.connectedAxis.x,s.connectedAxis.y,s.connectedAxis.z):null,maxForce:s.nativeParams.maxForce,collideConnected:!!s.collision};switch(e.joint.type){case Bt.q7.HingeJoint:case Bt.q7.Hinge2Joint:n=new this.BJSCANNON.HingeConstraint(t,i,r);break;case Bt.q7.DistanceJoint:n=new this.BJSCANNON.DistanceConstraint(t,i,s.maxDistance||2);break;case Bt.q7.SpringJoint:var o=s;n=new this.BJSCANNON.Spring(t,i,{restLength:o.length,stiffness:o.stiffness,damping:o.damping,localAnchorA:r.pivotA,localAnchorB:r.pivotB});break;case Bt.q7.LockJoint:n=new this.BJSCANNON.LockConstraint(t,i,r);break;case Bt.q7.PointToPointJoint:case Bt.q7.BallAndSocketJoint:default:n=new this.BJSCANNON.PointToPointConstraint(t,r.pivotA,i,r.pivotB,r.maxForce)}n.collideConnected=!!s.collision,e.joint.physicsJoint=n,e.joint.type!==Bt.q7.SpringJoint?this.world.addConstraint(n):(e.joint.jointData.forceApplicationCallback=e.joint.jointData.forceApplicationCallback||function(){n.applyForce()},e.mainImpostor.registerAfterPhysicsStep(e.joint.jointData.forceApplicationCallback))}}},{key:"removeJoint",value:function(e){e.joint.type!==Bt.q7.SpringJoint?this.world.removeConstraint(e.joint.physicsJoint):e.mainImpostor.unregisterAfterPhysicsStep(e.joint.jointData.forceApplicationCallback)}},{key:"_addMaterial",value:function(e,t,i){var n,s;for(n=0;n<this._physicsMaterials.length;n++)if((s=this._physicsMaterials[n]).friction===t&&s.restitution===i)return s;var r=new this.BJSCANNON.Material(e);return r.friction=t,r.restitution=i,this._physicsMaterials.push(r),r}},{key:"_checkWithEpsilon",value:function(e){return e<M.Epsilon?M.Epsilon:e}},{key:"_createShape",value:function(e){var t,i=e.object,n=e.getObjectExtents();switch(e.type){case Lt.Q.SphereImpostor:var s=n.x,r=n.y,o=n.z;t=new this.BJSCANNON.Sphere(Math.max(this._checkWithEpsilon(s),this._checkWithEpsilon(r),this._checkWithEpsilon(o))/2);break;case Lt.Q.CylinderImpostor:var a=e.getParam("nativeOptions");a||(a={});var l=void 0!==a.radiusTop?a.radiusTop:this._checkWithEpsilon(n.x)/2,h=void 0!==a.radiusBottom?a.radiusBottom:this._checkWithEpsilon(n.x)/2,c=void 0!==a.height?a.height:this._checkWithEpsilon(n.y),u=void 0!==a.numSegments?a.numSegments:16;t=new this.BJSCANNON.Cylinder(l,h,c,u);var d=new this.BJSCANNON.Quaternion;d.setFromAxisAngle(new this.BJSCANNON.Vec3(1,0,0),-Math.PI/2);var p=new this.BJSCANNON.Vec3(0,0,0);t.transformAllPoints(p,d);break;case Lt.Q.BoxImpostor:var f=n.scale(.5);t=new this.BJSCANNON.Box(new this.BJSCANNON.Vec3(this._checkWithEpsilon(f.x),this._checkWithEpsilon(f.y),this._checkWithEpsilon(f.z)));break;case Lt.Q.PlaneImpostor:t=new this.BJSCANNON.Plane;break;case Lt.Q.MeshImpostor:var _=i.getVerticesData?i.getVerticesData(wt.o.PositionKind):[],m=i.getIndices?i.getIndices():[];if(!_)return;var g=i.position.clone(),v=i.rotation&&i.rotation.clone(),y=i.rotationQuaternion&&i.rotationQuaternion.clone();i.position.copyFromFloats(0,0,0),i.rotation&&i.rotation.copyFromFloats(0,0,0),i.rotationQuaternion&&i.rotationQuaternion.copyFrom(e.getParentsRotation()),i.rotationQuaternion&&i.parent&&i.rotationQuaternion.conjugateInPlace();var x,b=i.computeWorldMatrix(!0),T=new Array;for(x=0;x<_.length;x+=3)Te.P.TransformCoordinates(Te.P.FromArray(_,x),b).toArray(T,x);Nt.Y.Warn("MeshImpostor only collides against spheres."),t=new this.BJSCANNON.Trimesh(T,m),i.position.copyFrom(g),v&&i.rotation&&i.rotation.copyFrom(v),y&&i.rotationQuaternion&&i.rotationQuaternion.copyFrom(y);break;case Lt.Q.HeightmapImpostor:var S=i.position.clone(),E=i.rotation&&i.rotation.clone(),C=i.rotationQuaternion&&i.rotationQuaternion.clone();i.position.copyFromFloats(0,0,0),i.rotation&&i.rotation.copyFromFloats(0,0,0),i.rotationQuaternion&&i.rotationQuaternion.copyFrom(e.getParentsRotation()),i.rotationQuaternion&&i.parent&&i.rotationQuaternion.conjugateInPlace(),i.rotationQuaternion&&i.rotationQuaternion.multiplyInPlace(this._minus90X),t=this._createHeightmap(i),i.position.copyFrom(S),E&&i.rotation&&i.rotation.copyFrom(E),C&&i.rotationQuaternion&&i.rotationQuaternion.copyFrom(C),i.computeWorldMatrix(!0);break;case Lt.Q.ParticleImpostor:t=new this.BJSCANNON.Particle;break;case Lt.Q.NoImpostor:t=new this.BJSCANNON.Box(new this.BJSCANNON.Vec3(0,0,0));break;case Lt.Q.ConvexHullImpostor:for(var A=e.getParam("shape"),P=A.vertices,R=A.faces,M=A.size*A.scaleFactor,I=new Array(P.length),D=new Array(R.length),O=0;O<P.length;++O){var w=P[O];I[O]=new this.BJSCANNON.Vec3(w[0]*M,w[1]*M,w[2]*M)}for(var N=0;N<R.length;++N)D[N]=R[N].slice(0,R[N].length-1);t=new this.BJSCANNON.ConvexPolyhedron(I,D)}return t}},{key:"_createHeightmap",value:function(e,t){var i,n=e.getVerticesData(wt.o.PositionKind),s=e.computeWorldMatrix(!0),r=new Array;for(i=0;i<n.length;i+=3)Te.P.TransformCoordinates(Te.P.FromArray(n,i),s).toArray(r,i);n=r;for(var o=new Array,a=t||~~(Math.sqrt(n.length/3)-1),l=e.getBoundingInfo(),h=Math.min(l.boundingBox.extendSizeWorld.x,l.boundingBox.extendSizeWorld.y),c=l.boundingBox.extendSizeWorld.z,u=2*h/a,d=0;d<n.length;d+=3){var p=Math.round(n[d+0]/u+a/2),f=Math.round(-1*(n[d+1]/u-a/2)),_=-n[d+2]+c;o[p]||(o[p]=[]),o[p][f]||(o[p][f]=_),o[p][f]=Math.max(_,o[p][f])}for(p=0;p<=a;++p){if(!o[p]){for(var m=1;!o[(p+m)%a];)m++;o[p]=o[(p+m)%a].slice()}for(f=0;f<=a;++f)if(!o[p][f]){var g;for(m=1;void 0===g;)g=o[p][(f+m++)%a];o[p][f]=g}}var v=new this.BJSCANNON.Heightfield(o,{elementSize:u});return v.minY=c,v}},{key:"_updatePhysicsBodyTransformation",value:function(e){var t=e.object;if(t.computeWorldMatrix&&t.computeWorldMatrix(!0),t.getBoundingInfo()){var i=e.getObjectCenter();this._tmpDeltaPosition.copyFrom(t.getAbsolutePivotPoint().subtract(i)),this._tmpDeltaPosition.divideInPlace(e.object.scaling),this._tmpPosition.copyFrom(i);var n=t.rotationQuaternion;if(n){if(e.type!==Lt.Q.PlaneImpostor&&e.type!==Lt.Q.HeightmapImpostor||(n=n.multiply(this._minus90X),e.setDeltaRotation(this._plus90X)),e.type===Lt.Q.HeightmapImpostor){var s=t,r=s.getBoundingInfo(),o=s.rotationQuaternion;s.rotationQuaternion=this._tmpUnityRotation,s.computeWorldMatrix(!0);var a=i.clone(),l=s.getPivotMatrix();l=l?l.clone():Te.y3.Identity();var h=Te.y3.Translation(r.boundingBox.extendSizeWorld.x,0,-r.boundingBox.extendSizeWorld.z);s.setPreTransformMatrix(h),s.computeWorldMatrix(!0);var c=r.boundingBox.centerWorld.subtract(i).subtract(s.position).negate();this._tmpPosition.copyFromFloats(c.x,c.y-r.boundingBox.extendSizeWorld.y,c.z),this._tmpDeltaPosition.copyFrom(r.boundingBox.centerWorld.subtract(a)),this._tmpDeltaPosition.y+=r.boundingBox.extendSizeWorld.y,s.rotationQuaternion=o,s.setPreTransformMatrix(l),s.computeWorldMatrix(!0)}else e.type===Lt.Q.MeshImpostor&&this._tmpDeltaPosition.copyFromFloats(0,0,0);e.setDeltaPosition(this._tmpDeltaPosition),e.physicsBody.position.set(this._tmpPosition.x,this._tmpPosition.y,this._tmpPosition.z),e.physicsBody.quaternion.set(n.x,n.y,n.z,n.w)}}}},{key:"setTransformationFromPhysicsBody",value:function(e){if(e.object.position.set(e.physicsBody.position.x,e.physicsBody.position.y,e.physicsBody.position.z),e.object.rotationQuaternion){var t=e.physicsBody.quaternion;e.object.rotationQuaternion.set(t.x,t.y,t.z,t.w)}}},{key:"setPhysicsBodyTransformation",value:function(e,t,i){e.physicsBody.position.set(t.x,t.y,t.z),e.physicsBody.quaternion.set(i.x,i.y,i.z,i.w)}},{key:"isSupported",value:function(){return void 0!==this.BJSCANNON}},{key:"setLinearVelocity",value:function(e,t){e.physicsBody.velocity.set(t.x,t.y,t.z)}},{key:"setAngularVelocity",value:function(e,t){e.physicsBody.angularVelocity.set(t.x,t.y,t.z)}},{key:"getLinearVelocity",value:function(e){var t=e.physicsBody.velocity;return t?new Te.P(t.x,t.y,t.z):null}},{key:"getAngularVelocity",value:function(e){var t=e.physicsBody.angularVelocity;return t?new Te.P(t.x,t.y,t.z):null}},{key:"setBodyMass",value:function(e,t){e.physicsBody.mass=t,e.physicsBody.updateMassProperties()}},{key:"getBodyMass",value:function(e){return e.physicsBody.mass}},{key:"getBodyFriction",value:function(e){return e.physicsBody.material.friction}},{key:"setBodyFriction",value:function(e,t){e.physicsBody.material.friction=t}},{key:"getBodyRestitution",value:function(e){return e.physicsBody.material.restitution}},{key:"setBodyRestitution",value:function(e,t){e.physicsBody.material.restitution=t}},{key:"sleepBody",value:function(e){e.physicsBody.sleep()}},{key:"wakeUpBody",value:function(e){e.physicsBody.wakeUp()}},{key:"updateDistanceJoint",value:function(e,t){e.physicsJoint.distance=t}},{key:"setMotor",value:function(e,t,i,n){n||(e.physicsJoint.enableMotor(),e.physicsJoint.setMotorSpeed(t),i&&this.setLimit(e,i))}},{key:"setLimit",value:function(e,t,i){e.physicsJoint.motorEquation.maxForce=t,e.physicsJoint.motorEquation.minForce=void 0===i?-t:i}},{key:"syncMeshWithImpostor",value:function(e,t){var i=t.physicsBody;e.position.x=i.position.x,e.position.y=i.position.y,e.position.z=i.position.z,e.rotationQuaternion&&(e.rotationQuaternion.x=i.quaternion.x,e.rotationQuaternion.y=i.quaternion.y,e.rotationQuaternion.z=i.quaternion.z,e.rotationQuaternion.w=i.quaternion.w)}},{key:"getRadius",value:function(e){return e.physicsBody.shapes[0].boundingSphereRadius}},{key:"getBoxSizeToRef",value:function(e,t){var i=e.physicsBody.shapes[0];t.x=2*i.halfExtents.x,t.y=2*i.halfExtents.y,t.z=2*i.halfExtents.z}},{key:"dispose",value:function(){}},{key:"raycast",value:function(e,t){return this._cannonRaycastResult.reset(),this.world.raycastClosest(e,t,{},this._cannonRaycastResult),this._raycastResult.reset(e,t),this._cannonRaycastResult.hasHit&&(this._raycastResult.setHitData({x:this._cannonRaycastResult.hitNormalWorld.x,y:this._cannonRaycastResult.hitNormalWorld.y,z:this._cannonRaycastResult.hitNormalWorld.z},{x:this._cannonRaycastResult.hitPointWorld.x,y:this._cannonRaycastResult.hitPointWorld.y,z:this._cannonRaycastResult.hitPointWorld.z}),this._raycastResult.setHitDistance(this._cannonRaycastResult.distance)),this._raycastResult}}]),e}();Ft.T.DefaultPluginFactory=function(){return new kt};var Gt=function(){function e(t){_(this,e);var i=new kt(16,Ot),n=new Ot.Vec3(0,ee.Gravity,0);t.scene.enablePhysics(n,i)}return y(e,[{key:"remove",value:function(e){var t;null===(t=e.physicsImpostor)||void 0===t||t.dispose()}},{key:"collisionEvent",value:function(e,t){e.physicsImpostor.physicsBody.addEventListener("collide",(function(e){return t(e)}))}},{key:"add",value:function(e,t,i){var n,s,r;return e.physicsImpostor=new M.PhysicsImpostor(e,M.PhysicsImpostor.ConvexHullImpostor,{shape:t,mass:null!==(n=i.mass)&&void 0!==n?n:t.mass,friction:null!==(s=i.friction)&&void 0!==s?s:ee.DiceFriction,restitution:null!==(r=i.restitution)&&void 0!==r?r:ee.DiceRestitution,nativeOptions:{contactEquationStiffness:1e7,contactEquationRelaxation:3,frictionEquationStiffness:1e7,frictionEquationRelaxation:3}}),e.physicsImpostor.collisionFilterGroup=2,e.physicsImpostor.collisionFilterMask=3,e}},{key:"AddFloor",value:function(e){return e.physicsImpostor=new M.PhysicsImpostor(e,M.PhysicsImpostor.PlaneImpostor,{mass:0,friction:ee.FloorFriction,restitution:ee.FloorRestitution,nativeOptions:{contactEquationStiffness:1e7,contactEquationRelaxation:3,frictionEquationStiffness:1e7,frictionEquationRelaxation:3}}),e.physicsImpostor.collisionFilterGroup=1,e.physicsImpostor.collisionFilterMask=2,e}},{key:"AddBarriers",value:function(e){return e.physicsImpostor=new M.PhysicsImpostor(e,M.PhysicsImpostor.PlaneImpostor,{mass:0,friction:ee.BarrierFriction,restitution:ee.BarrierRestitution,nativeOptions:{contactEquationStiffness:1e7,contactEquationRelaxation:3,frictionEquationStiffness:1e7,frictionEquationRelaxation:3}}),e.physicsImpostor.collisionFilterGroup=1,e.physicsImpostor.collisionFilterMask=2,e}}]),e}(),zt=o(3849),Wt=function(){function e(t){var i=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=arguments.length>2?arguments[2]:void 0,s=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};_(this,e),x(this,"logger",void 0),x(this,"PhysicsManager",void 0),x(this,"floor",void 0),x(this,"floorOffset",void 0),x(this,"scene",void 0),x(this,"SCREEN_WIDTH",void 0),x(this,"SCREEN_HEIGHT",void 0),x(this,"VIEW_ANGLE",void 0),x(this,"ASPECT",void 0),x(this,"NEAR",void 0),x(this,"FAR",void 0),x(this,"barriers",void 0),x(this,"camera",void 0),x(this,"engine",void 0),x(this,"canvas",void 0),x(this,"w",void 0),x(this,"h",void 0),x(this,"wh",void 0),x(this,"cw",void 0),x(this,"ch",void 0),x(this,"aspect",void 0),x(this,"scale",void 0),x(this,"stats",void 0),x(this,"bloomPass",void 0),x(this,"shadowGenerator",void 0),x(this,"environment",void 0),x(this,"assetBaseLocation",void 0),x(this,"previewMode",void 0),this.logger=new oe(this),this.scene=null,this.canvas=t,this.w=this.canvas.clientWidth/2,this.h=this.canvas.clientHeight/2,this.SCREEN_WIDTH=window.innerWidth,this.SCREEN_HEIGHT=window.innerHeight,this.VIEW_ANGLE=35,this.ASPECT=this.SCREEN_WIDTH/this.SCREEN_HEIGHT,this.NEAR=1,this.FAR=2e3,this.barriers=[],this.assetBaseLocation=n,this.previewMode=i,this.initEngine(this.canvas,this.previewMode,s),this.addCamera($.CameraStartHeight,$.CameraFOV);var r=this.addLights();this.setShadowQuality(r),this.enableSound($.SoundEnabled)}var t;return y(e,[{key:"addPhysics",value:function(e){this.scene.physicsEnabled=!0,this.PhysicsManager=e,this.addFloor(),this.previewMode||this.addBarriers()}},{key:"initEngine",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};i.xrCompatible=!1,this.engine=new M.Engine(e,!/OS 15_4/i.test(navigator.userAgent)||!("maxTouchPoints"in navigator&&navigator.maxTouchPoints>0||"matchMedia"in window&&window.matchMedia("(pointer:coarse)").matches||"orientation"in window||/\b(BlackBerry|webOS|iPhone|IEMobile)\b/i.test(navigator.userAgent)||/\b(Android|Windows Phone|iPad|iPod)\b/i.test(navigator.userAgent)),i),this.engine.getCaps().parallelShaderCompile=void 0,this.scene=new M.Scene(this.engine),this.scene.useRightHandedSystem=!0,this.scene.clearColor=new M.Color4(0,0,0,.01),this.scene.ambientColor=new M.Color3(1,1,1);var n;n=$.environmentTexture.endsWith("/")?new M.CubeTexture("".concat(this.assetBaseLocation,"/images/common/").concat($.environmentTexture),this.scene):M.CubeTexture.CreateFromPrefilteredData("".concat(this.assetBaseLocation,"/images/common/").concat($.environmentTexture),this.scene),this.environment=this.scene.createDefaultEnvironment({createSkybox:t,enableGroundMirror:!1,createGround:!0,groundSize:20,enableGroundShadow:!0,skyboxSize:50,environmentTexture:n,groundTexture:"".concat(this.assetBaseLocation,"/images/common/backgroundGround.png")}),this.environment.ground.isVisible=!1,this.scene.environmentTexture=n,M.Effect.ShadersStore.particlesVertexShader="// Attributes\nattribute vec3 position;\nattribute vec4 color;\nattribute float angle;\nattribute vec2 size;\n#ifdef ANIMATESHEET\nattribute float cellIndex;\n#endif\n#ifndef BILLBOARD\nattribute vec3 direction;\n#endif\n#ifdef BILLBOARDSTRETCHED\nattribute vec3 direction;\n#endif\n#ifdef RAMPGRADIENT\nattribute vec4 remapData;\n#endif\nattribute vec2 offset;\n\n// Uniforms\nuniform mat4 view;\nuniform mat4 projection;\nuniform vec2 translationPivot;\n\nuniform vec3 origin;\n\n#ifdef ANIMATESHEET\nuniform vec3 particlesInfos; // x (number of rows) y(number of columns) z(rowSize)\n#endif\n\n// Output\nvarying vec2 vUV;\nvarying vec4 vColor;\nvarying vec4 vWorldPos;\n\n#ifdef RAMPGRADIENT\nvarying vec4 remapRanges;\n#endif\n\n#if defined(CLIPPLANE) || defined(CLIPPLANE2) || defined(CLIPPLANE3) || defined(CLIPPLANE4) || defined(CLIPPLANE5) || defined(CLIPPLANE6)\nuniform mat4 invView;\n#endif\n#include<clipPlaneVertexDeclaration>\n\n#ifdef BILLBOARD\n\tuniform vec3 eyePosition;\n#endif\n\nvec3 rotate(vec3 yaxis, vec3 rotatedCorner) {\n\tvec3 xaxis = normalize(cross(vec3(0., 1.0, 0.), yaxis));\n\tvec3 zaxis = normalize(cross(yaxis, xaxis));\n\n\tvec3 row0 = vec3(xaxis.x, xaxis.y, xaxis.z);\n\tvec3 row1 = vec3(yaxis.x, yaxis.y, yaxis.z);\n\tvec3 row2 = vec3(zaxis.x, zaxis.y, zaxis.z);\n\n\tmat3 rotMatrix =  mat3(row0, row1, row2);\n\n\tvec3 alignedCorner = rotMatrix * rotatedCorner;\n\treturn position + alignedCorner;\n}\n\n#ifdef BILLBOARDSTRETCHED\nvec3 rotateAlign(vec3 toCamera, vec3 rotatedCorner) {\n\tvec3 normalizedToCamera = normalize(toCamera);\n\tvec3 normalizedCrossDirToCamera = normalize(cross(normalize(direction), normalizedToCamera));\n\tvec3 crossProduct = normalize(cross(normalizedToCamera, normalizedCrossDirToCamera));\n\n\tvec3 row0 = vec3(normalizedCrossDirToCamera.x, normalizedCrossDirToCamera.y, normalizedCrossDirToCamera.z);\n\tvec3 row1 = vec3(crossProduct.x, crossProduct.y, crossProduct.z);\n\tvec3 row2 = vec3(normalizedToCamera.x, normalizedToCamera.y, normalizedToCamera.z);\n\n\tmat3 rotMatrix =  mat3(row0, row1, row2);\n\n\tvec3 alignedCorner = rotMatrix * rotatedCorner;\n\treturn position + alignedCorner;\n}\n#endif\n\nvoid main(void) {\n\tvec2 cornerPos;\n\n\tcornerPos = (vec2(offset.x - 0.5, offset.y  - 0.5) - translationPivot) * size + translationPivot;\n#ifdef BILLBOARD\n\t// Rotate\n\tvec3 rotatedCorner;\n\n\t#ifdef BILLBOARDY\n\t\trotatedCorner.x = cornerPos.x * cos(angle) - cornerPos.y * sin(angle);\n\t\trotatedCorner.z = cornerPos.x * sin(angle) + cornerPos.y * cos(angle);\n\t\trotatedCorner.y = 0.;\n\n\t\tvec3 yaxis = position - eyePosition;\n\t\tyaxis.y = 0.;\n\n\t\tvec3 worldPos = rotate(normalize(yaxis), rotatedCorner);\n\n\t\tvec3 viewPos = (view * vec4(worldPos, 1.0)).xyz;\n\t#elif defined(BILLBOARDSTRETCHED)\n\t\trotatedCorner.x = cornerPos.x * cos(angle) - cornerPos.y * sin(angle);\n\t\trotatedCorner.y = cornerPos.x * sin(angle) + cornerPos.y * cos(angle);\n\t\trotatedCorner.z = 0.;\n\n\t\tvec3 toCamera = position - eyePosition;\n\t\tvec3 worldPos = rotateAlign(toCamera, rotatedCorner);\n\n\t\tvec3 viewPos = (view * vec4(worldPos, 1.0)).xyz;\n\t#else\n\t\trotatedCorner.x = cornerPos.x * cos(angle) - cornerPos.y * sin(angle);\n\t\trotatedCorner.y = cornerPos.x * sin(angle) + cornerPos.y * cos(angle);\n\t\trotatedCorner.z = 0.;\n\n\t\tvec3 viewPos = (view * vec4(position, 1.0)).xyz + rotatedCorner;\n\t\tvWorldPos = vec4((view * vec4(position - origin, 1.0)).xyz + rotatedCorner, 1.0);\n\n\t#endif\n\n\t#ifdef RAMPGRADIENT\n\t\tremapRanges = remapData;\n\t#endif\n\n\t// Position\n\tgl_Position = projection * vec4(viewPos, 1.0);\n\n#else\n\t// Rotate\n\tvec3 rotatedCorner;\n\trotatedCorner.x = cornerPos.x * cos(angle) - cornerPos.y * sin(angle);\n\trotatedCorner.z = cornerPos.x * sin(angle) + cornerPos.y * cos(angle);\n\trotatedCorner.y = 0.;\n\n\tvec3 yaxis = normalize(direction);\n\tvec3 worldPos = rotate(yaxis, rotatedCorner);\n\tgl_Position = projection * view * vec4(worldPos, 1.0);\n#endif\n\tvColor = color;\n\n\t#ifdef ANIMATESHEET\n\t\tfloat rowOffset = floor(cellIndex / particlesInfos.z);\n\t\tfloat columnOffset = cellIndex - rowOffset * particlesInfos.z;\n\n\t\tvec2 uvScale = particlesInfos.xy;\n\t\tvec2 uvOffset = vec2(offset.x , 1.0 - offset.y);\n\t\tvUV = (uvOffset + vec2(columnOffset, rowOffset)) * uvScale;\n\t#else\n\t\tvUV = offset;\n\t#endif\n\n\t// Clip plane\n#if defined(CLIPPLANE) || defined(CLIPPLANE2) || defined(CLIPPLANE3) || defined(CLIPPLANE4) || defined(CLIPPLANE5) || defined(CLIPPLANE6)\n\tvec4 worldPos = invView * vec4(viewPos, 1.0);\n#endif\n\t#include<clipPlaneVertex>\n\n\t\t//vWorldPos.w = 1.0;\n\n\n}"}},{key:"isSceneIdle",value:function(){return this.scene.meshes.filter((function(e){return!(e instanceof M.GroundMesh||e.name.startsWith("ground")||e.name.startsWith("Background"))})).length<1}},{key:"enableRenderLoop",value:function(e,t){var i=this;e?(this.logger.log("Enabling render loop"),this.engine.runRenderLoop((function(){var e=isNaN(i.scene.deltaTime)?0:i.scene.deltaTime;t&&t(e),i.scene.render()}))):(this.logger.log("Disabling render loop"),this.engine.stopRenderLoop())}},{key:"enableSceneDebugger",value:(t=f(T().mark((function e(){return T().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,o.e(273).then(o.t.bind(o,6273,23));case 2:this.scene.debugLayer.show({overlay:!0});case 3:case"end":return e.stop()}}),e,this)}))),function(){return t.apply(this,arguments)})},{key:"addCamera",value:function(e,t,i){var n;this.camera&&this.camera.dispose(),i?(n=i.meshParent.position).y=.5*i.options.baseHeight:n=M.Vector3.Zero();var s=new M.ArcRotateCamera("mainCamera",0,0,e,n,this.scene);i&&(s.upperBetaLimit=$.CameraUpperBetaLimit,s.lowerBetaLimit=$.CameraLowerBetaLimit,s.upperRadiusLimit=$.CameraUpperRadiusLimit,s.lowerRadiusLimit=$.CameraLowerRadiusLimit,s.wheelPrecision=$.CameraWheelPrecision,s.minZ=$.CameraMinZ,s.attachControl(this.canvas,!0)),this.camera=s,this.camera.fov=t,this.camera.attachControl(this.canvas,!0)}},{key:"setFloorOffset",value:function(){this.floor.position.y=this.floorOffset}},{key:"addLights",value:function(){var e=new M.DirectionalLight("dirLight",new M.Vector3(5,-10,5),this.scene);return e.direction.normalize(),e.shadowMinZ=-30,e.shadowMaxZ=30,e.position=new M.Vector3(0,0,0),e.shadowEnabled=!0,e.autoUpdateExtends=!1,e.shadowFrustumSize=$.ShadowFrustumSize,new M.HemisphericLight("hemiLight",new M.Vector3(-.2,1,-.2),this.scene).intensity=.5,$.GlowIntensity>0&&(new M.GlowLayer("glow",this.scene,{mainTextureSamples:4}).intensity=$.GlowIntensity),e}},{key:"setShadowQuality",value:function(e){switch($.Shadow>K.None&&(this.shadowGenerator=new M.ShadowGenerator([0,1024,2048,2048][$.Shadow],e),this.shadowGenerator.bias=.001,this.shadowGenerator.normalBias=.01,this.shadowGenerator.darkness=.5,this.shadowGenerator.blurScale=2,this.shadowGenerator.frustumEdgeFalloff=.5,this.shadowGenerator.transparencyShadow=!0),$.Shadow){case K.None:this.scene.shadowsEnabled=!1;break;case K.Low:this.scene.shadowsEnabled=!0;break;case K.Medium:this.shadowGenerator.useExponentialShadowMap=!0,this.shadowGenerator.depthScale=10,this.scene.shadowsEnabled=!0;break;case K.High:this.shadowGenerator.useBlurExponentialShadowMap=!0,this.shadowGenerator.depthScale=10,this.shadowGenerator.useKernelBlur=!0,this.shadowGenerator.blurKernel=15,this.scene.shadowsEnabled=!0}this.setupCustomShadowShader()}},{key:"setupCustomShadowShader",value:function(){var e;M.Effect.ShadersStore.customShadowVertexShader="// This file seems to heavily influenced from\n// https://github.com/BabylonJS/Babylon.js/blob/master/packages/dev/core/src/Shaders/shadowMap.vertex.fx,\n// so if something goes wrong check what's changed there first.\n\n//Attribute\nattribute vec3 position;\n\n#ifdef NORMAL\n    attribute vec3 normal;\n#endif\n\n#include<bonesDeclaration>\n\n#include<morphTargetsVertexGlobalDeclaration>\n#include<morphTargetsVertexDeclaration>[0..maxSimultaneousMorphTargets]\n\n#include<__decl__sceneVertex>\n#include<__decl__meshVertex>\n\n// Uniforms\n#include<helperFunctions>\n\nvarying vec3 vPositionW;\n\n#ifdef ALPHATEXTURE\nvarying vec2 vUV;\nuniform mat4 diffuseMatrix;\n#ifdef UV1\nattribute vec2 uv;\n#endif\n#ifdef UV2\nattribute vec2 uv2;\n#endif\n#endif\n\n#include<shadowMapVertexExtraDeclaration>\n\n#include<clipPlaneVertexDeclaration>\n\nvoid main(void)\n{\nvec3 positionUpdated = position;\n#ifdef UV1\n    vec2 uvUpdated = uv;\n#endif  \n#ifdef NORMAL\t\n\tvec3 normalUpdated = normal;\n#endif\n\n#include<morphTargetsVertex>[0..maxSimultaneousMorphTargets]\n\n#include<instancesVertex>\n#include<bonesVertex>\n\nvec4 worldPos = finalWorld * vec4(positionUpdated, 1.0);\nvPositionW = worldPos.xyz;\n#ifdef NORMAL\n    mat3 normWorldSM = mat3(finalWorld);\n\n    #if defined(INSTANCES) && defined(THIN_INSTANCES)\n        vec3 vNormalW = normalUpdated / vec3(dot(normWorldSM[0], normWorldSM[0]), dot(normWorldSM[1], normWorldSM[1]), dot(normWorldSM[2], normWorldSM[2]));\n        vNormalW = normalize(normWorldSM * vNormalW);\n    #else\n        #ifdef NONUNIFORMSCALING\n            normWorldSM = transposeMat3(inverseMat3(normWorldSM));\n        #endif\n\n        vec3 vNormalW = normalize(normWorldSM * normalUpdated);\n    #endif\n#endif\n\n#include<shadowMapVertexNormalBias>\n\n// Projection.\ngl_Position = viewProjection * worldPos;\n\n#include<shadowMapVertexMetric>\n\n    #ifdef UV1\n        vUV = vec2(diffuseMatrix * vec4(uvUpdated, 1.0, 0.0));\n    #endif\n    #ifdef UV2\n        vUV = vec2(diffuseMatrix * vec4(uv2, 1.0, 0.0));\n    #endif\n\n#include<clipPlaneVertex>\n\n}\n",M.Effect.ShadersStore.customShadowFragmentShader="#include<shadowMapFragmentExtraDeclaration>\n\n\nvarying vec3 vPositionW;\n#ifdef ALPHATEST\nvarying vec2 vUV;\nuniform sampler2D diffuseSampler;\n#endif\nuniform float dissolve;\nuniform sampler2D noise;\n#include<clipPlaneFragmentDeclaration>\n\nvoid main(void)\n{\n#include<clipPlaneFragment>\n\n#ifdef ALPHATEST\n    float alphaFromAlphaTexture = texture2D(diffuseSampler, vUV).a;\n    if (alphaFromAlphaTexture < 0.4)\n        discard;\n#endif\n\n    float n = texture2D(noise,  vPositionW.xz).x - dissolve;\n    if (n < 0.0) { discard; }\n\n#if SM_SOFTTRANSPARENTSHADOW == 1\n    #ifdef ALPHATEST\n        if ((bayerDither8(floor(mod(gl_FragCoord.xy, 8.0)))) / 64.0 >= softTransparentShadowSM * alphaFromAlphaTexture) discard;\n    #else\n        if ((bayerDither8(floor(mod(gl_FragCoord.xy, 8.0)))) / 64.0 >= softTransparentShadowSM) discard;\n    #endif\n#endif\n\n#include<shadowMapFragment>\n}\n",this.shadowGenerator.customShaderOptions={shaderName:"customShadow",attributes:["uv"],uniforms:["dissolve"],samplers:["noise"]},this.shadowGenerator.onBeforeShadowMapRenderMeshObservable.add((function(t){return e=t})),this.shadowGenerator.onBeforeShadowMapRenderObservable.add((function(t){e.material&&(e.material instanceof lt?(t.setFloat("dissolve",e.material.dissolveValue),t.setTexture("noise",e.material.dissolveTexture)):(t.setFloat("dissolve",0),t.setTexture("noise",null)))}))}},{key:"enableSound",value:function(e){var t,i=this;this.scene.audioEnabled=e,this.scene.audioListenerPositionProvider=function(){return i.camera.position},null===(t=M.Engine.audioEngine)||void 0===t||t.setGlobalVolume($.MasterVolume)}},{key:"addFloor",value:function(){var e=M.Mesh.CreatePlane("ground",120,this.scene,!0);this.PhysicsManager.AddFloor(e),e.isVisible=!1;var t=M.Mesh.CreatePlane("groundShadow",120,this.scene,!0);t.isVisible=!0;var i=new zt.ShadowOnlyMaterial("shadow",this.scene);i.sideOrientation=M.Mesh.DOUBLESIDE,i.transparencyMode=M.Material.MATERIAL_ALPHABLEND,i.alphaMode=M.Engine.ALPHA_MAXIMIZED,t.receiveShadows=!0,t.rotation.x=-Math.PI/2,t.material=i}},{key:"addBarriers",value:function(){this.barriers.push(this.addBarrier("wall1",new M.Vector3(0,0,.06*-this.h),M.Axis.X,Math.PI/2),this.addBarrier("wall2",new M.Vector3(0,0,.06*this.h),M.Axis.X,-Math.PI/2),this.addBarrier("wall3",new M.Vector3(.04*this.w,0,0),M.Axis.Z,Math.PI/2),this.addBarrier("wall4",new M.Vector3(.04*-this.w,0,0),M.Axis.Z,-Math.PI/2))}},{key:"addBarrier",value:function(e,t,i,n){var s=M.Mesh.CreateGround(e,20,20,2,this.scene);return s.position=t,s.rotate(i,n,M.Space.WORLD),s.isVisible=!1,this.PhysicsManager.AddBarriers(s),s}},{key:"reInit",value:function(e,t){this.cw=this.canvas.clientWidth/2,this.ch=this.canvas.clientHeight/2,e?(this.w=e.w,this.h=e.h):(this.w=this.cw,this.h=this.ch),this.aspect=Math.min(this.cw/this.w,this.ch/this.h),this.scale=Math.sqrt(this.w*this.w+this.h*this.h)/13,this.wh=this.ch/this.aspect/Math.tan(10*Math.PI/180),t&&this.resetBarrierPositions(),this.engine.resize()}},{key:"resetBarrierPositions",value:function(){var e=this.canvas.getBoundingClientRect();if(this.barriers.length>0){var t=Pt(e.width,e.height/2,this.camera,e);this.barriers[0].position=new M.Vector3(t.x,t.y,t.z),t=Pt(0,e.height/2,this.camera,e),this.barriers[1].position=new M.Vector3(t.x,t.y,t.z),t=Pt(e.width/2,e.height,this.camera,e),this.barriers[2].position=new M.Vector3(t.x,t.y,t.z),t=Pt(e.width/2,0,this.camera,e),this.barriers[3].position=new M.Vector3(t.x,t.y,t.z)}}}]),e}(),Ht=y((function e(t,i){_(this,e),x(this,"dice",void 0),x(this,"value",void 0),x(this,"stableCount",void 0),x(this,"result",void 0),this.dice=t,this.value=i,this.stableCount=0,this.result=null})),Xt=function(){function i(){_(this,i),x(this,"currentCollisionEffectDice",0),x(this,"maxCollisionEffectDice",20),x(this,"reInitTimeout",void 0),x(this,"dice",void 0),x(this,"diceRemoved",void 0),x(this,"diceConstant",void 0),x(this,"diceNotation",void 0),x(this,"SceneManager",void 0),x(this,"baseLocation",void 0),x(this,"PhysicsManager",void 0),x(this,"_isRolling",void 0),x(this,"rollRequest",void 0),x(this,"diceValues",void 0),x(this,"throwRunning",void 0),x(this,"stableCount",void 0),x(this,"result",void 0),x(this,"diceManifest",void 0),x(this,"diceAutoClearTimeout",void 0),x(this,"enableAutoClear",!0),x(this,"animationEnabled",!1),x(this,"logger",void 0),x(this,"previewDie",void 0),x(this,"assetsReadyPromise",void 0),x(this,"diceUserConfig",void 0),x(this,"_eventObservables",new Map),x(this,"_updateView",!1),x(this,"dimensions",void 0),x(this,"_messageBroker",void 0),x(this,"stackOrder",0),this.dice=[],this.diceRemoved=[],this.diceConstant=0,this.SceneManager=null,this.baseLocation="",this.baseLocation="https://stg.dndbeyond.com/dice",this.logger=new oe(this),this._eventObservables[n.ROLL]=new M.Observable,this._eventObservables[n.CLEAR]=new M.Observable}var o,a,l,h;return y(i,[{key:"analyticsInit",value:function(e,t){At.init(e,t)}},{key:"updateSettings",value:function(e){this.diceUserConfig=e;var t=e.settings;$.SoundEnabled=0!=t.volume,$.MasterVolume=t.volume,$.Shadow=t.shadowQuality,$.Particles=t.particlesEnabled,$.Vibrate=t.vibrationEnabled}},{key:"init",value:(h=f(T().mark((function e(t){var i,n,s,r,o,a,l;return T().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return i=t.assetBaseLocation,n=t.diceUserConfig,s=t.canvas,r=t.previewMode,o=t.isDebug,a=t.engineOptions,i&&(this.baseLocation=t.assetBaseLocation),this.updateSettings(n),this.SceneManager=new Wt(s,r,this.baseLocation,a),this.PhysicsManager=new Gt(this.SceneManager),this.SceneManager.addPhysics(this.PhysicsManager),s||this.logger.error("Canvas must be a valid HTMLCanvasElement"),l={w:s.clientWidth,h:s.clientHeight},this.SceneManager.reInit(l,!0),o&&this.SceneManager.enableSceneDebugger(),e.prev=10,e.next=13,new Promise(((e,t)=>function i(){const n=N?F:window[I];void 0===n?"complete"!==document.readyState&&"interactive"!==document.readyState?setTimeout(i,100):t(new Error("A message broker was never instantiated in this document")):e(n)}()));case 13:this._messageBroker=e.sent,e.next=19;break;case 16:e.prev=16,e.t0=e.catch(10),this.logger.log(e.t0);case 19:return e.abrupt("return",new Promise((function(e){return e()})));case 20:case"end":return e.stop()}}),e,this,[[10,16]])}))),function(e){return h.apply(this,arguments)})},{key:"_removeCurrentMaterialsAndTextures",value:function(){var e=this,t=["BackgroundPlaneMaterial","BackgroundSkyboxMaterial","default material","shadow"];_e.clearTextureCache();for(var i=1;i>0;)i=0,this.SceneManager.scene.materials.forEach((function(n){t.includes(n.name)||(i++,n.unbind(),e.SceneManager.scene.removeMaterial(n),n.dispose())}))}},{key:"load",value:function(e){var t=this;return this.clear(),this.previewDie&&this.previewDie.dispose(),this._removeCurrentMaterialsAndTextures(),this.assetsReadyPromise=new Promise(function(){var i=f(T().mark((function i(n){var s,r,o;return T().wrap((function(i){for(;;)switch(i.prev=i.next){case 0:return s="".concat(t.baseLocation).concat(e),i.prev=1,r=new Et(t.baseLocation,t.SceneManager.scene),i.next=5,r.loadManifest(s);case 5:return o=i.sent,t.diceManifest=o,i.next=9,r.loadAssets();case 9:return t.logger.debug("Assets loaded"),i.next=12,r.correlateResources(t.SceneManager.scene);case 12:t.logger.debug("Assets correlated"),n(o),i.next=19;break;case 16:i.prev=16,i.t0=i.catch(1),t.logger.error("Error loading manifest ".concat(s,": ").concat(i.t0));case 19:case"end":return i.stop()}}),i,null,[[1,16]])})));return function(e){return i.apply(this,arguments)}}()),this.assetsReadyPromise}},{key:"loadBundle",value:function(e){var t=this;return this.assetsReadyPromise=new Promise(function(){var i=f(T().mark((function i(n){var s,r,o,a,l;return T().wrap((function(i){for(;;)switch(i.prev=i.next){case 0:return i.prev=0,s=new(k()),i.next=4,s.loadAsync(e);case 4:return r=i.sent,i.next=7,r.file("manifest.json").async("text");case 7:return o=i.sent,a=new Et(t.baseLocation,t.SceneManager.scene,r),l=JSON.parse(o),t.diceManifest=l,a.manifest=l,i.next=14,a.loadAssets();case 14:return i.next=16,a.correlateResources(t.SceneManager.scene);case 16:n(t.diceManifest),i.next=22;break;case 19:i.prev=19,i.t0=i.catch(0),t.logger.error(i.t0);case 22:case"end":return i.stop()}}),i,null,[[0,19]])})));return function(e){return i.apply(this,arguments)}}()),this.assetsReadyPromise}},{key:"reInit",value:function(e){this.dimensions=e,this._updateView=!0,this.SceneManager.reInit(e,!1)}},{key:"_resetView",value:function(){this.dimensions=void 0,this._updateView=!1,this.SceneManager.reInit(this.dimensions,!0)}},{key:"clear",value:function(){if(!this._isRolling&&0!==this.dice.length){for(var e=0;e<this.diceRemoved.length;e++)this.diceRemoved[e].dispose();this.diceRemoved=[];for(var t=0;t<this.dice.length;t++){var i=this.dice[t];i.onDieRemoved(),this.dice[t].runRemoval(),this.dice.splice(t,1),this.diceRemoved.push(i),t--}this.dice=[],this.diceConstant=0,this.rollRequest=void 0,this.currentCollisionEffectDice=0,this._processEvent(n.CLEAR,void 0)}}},{key:"readyToRoll",value:function(){return this.assetsReadyPromise||Promise.reject("No assets loaded")}},{key:"_processRollKind",value:function(e){switch(e.rollKind){case c.Advantage:e.diceNotation.set.forEach((function(e){e.dieType===r.d20&&(e.count+=1,e.operation=s.Max,e.operand=1)}));break;case c.Disadvantage:e.diceNotation.set.forEach((function(e){e.dieType===r.d20&&(e.count+=1,e.operation=s.Min,e.operand=1)}));break;case c.CriticalHit:e.diceNotation.set.forEach((function(e){return e.count*=2}))}}},{key:"roll",value:(l=f(T().mark((function i(s,r,o){var a,l,h=this;return T().wrap((function(i){for(;;)switch(i.prev=i.next){case 0:return l="string"==typeof s?new Dt("custom",s):s,null===(a=M.Engine.audioEngine)||void 0===a||a.unlock(),this._updateView&&this._resetView(),i.next=5,this.readyToRoll();case 5:return l.setId=this.diceUserConfig.setId,l.rollId=Y(),i.abrupt("return",new Promise(function(){var i=f(T().mark((function i(s,a){var c,u,d,p,f,_,m,g;return T().wrap((function(i){for(;;)switch(i.prev=i.next){case 0:if(i.prev=0,clearTimeout(h.diceAutoClearTimeout),h.enableAnimation(!0),!h._isRolling){i.next=6;break}return a(new Error("There is already a roll in progress.")),i.abrupt("return");case 6:"custom"===l.action?At.log(e.DICE_Toolbar,t.DICE_Roll):At.log(e.DICE_Advanced,t.DICE_Roll,l.action),h.clear(),h._isRolling=!0,h.rollRequest=l,c=0;case 11:if(!(c<h.rollRequest.rolls.length)){i.next=25;break}if(u=h.rollRequest.rolls[c],h._processRollKind(u),h.addDice(u.diceNotation,c),0!=u.diceNotation.set.length){i.next=22;break}return h._isRolling=!1,h.throwRunning=!1,h.result=h._getResultConstant(),h.broadcastRollMessage(h.result,"fulfilled"),s(h.result),i.abrupt("return");case 22:c++,i.next=11;break;case 25:return h.broadcastRollMessage(l,"pending"),i.next=28,h._waitForDiceMeshesReady();case 28:for(h.diceValues=[],d=h.SceneManager.canvas.getBoundingClientRect(),void 0===r&&(r=d.width/2+d.left),void 0===o&&(o=d.height/2+d.top),p=mt.CreateRandomVelocity(h.dice.length),f=[],_=0;_<h.dice.length;_++)f.push(h.dice[_].roll(Pt(r-d.left,o-d.top,h.SceneManager.camera,h.SceneManager.canvas.getBoundingClientRect()),_,h.dice.length,p)),h.diceValues.push(new Ht(h.dice[_],1));return i.next=37,Promise.all(f);case 37:!h.throwRunning&&h.dice&&h.dice.length>0&&h._prepareValues(),h.result=null,m=0,g=setInterval((function(){h.result?(h._isRolling=!1,h._startAutoClear(),h.broadcastRollMessage(h.result,"fulfilled"),s(h.result),clearInterval(g),h._processEvent(n.ROLL,h.result)):(m+=500)>=1e4&&(h._isRolling=!1,h.throwRunning=!1,h.diceValues.forEach((function(e){var t=e.dice.getUpsideValue().dieValue;e.result!==t&&(e.result=t,e.dice.onRollComplete(t))})),h._setResult(),h._startAutoClear(),h.broadcastRollMessage(h.result,"fulfilled"),s(h.result),clearInterval(g),h._processEvent(n.ROLL,h.result))}),500),setInterval((function(){return h.checkForIdleScene()}),1e3),i.next=50;break;case 46:i.prev=46,i.t0=i.catch(0),h.broadcastRollMessage(l,"rejected"),a(new Error(i.t0));case 50:case"end":return i.stop()}}),i,null,[[0,46]])})));return function(e,t){return i.apply(this,arguments)}}()));case 8:case"end":return i.stop()}}),i,this)}))),function(e,t,i){return l.apply(this,arguments)})},{key:"broadcastRollMessage",value:(a=f(T().mark((function e(t,i){var n,s,r,o,a,l,h,c,u,d;return T().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:null===(n=this._messageBroker)||void 0===n||n.dispatch({data:t,entityId:null===(s=t.context)||void 0===s||null===(r=s.entityId)||void 0===r?void 0:r.toString(),entityType:null===(o=t.context)||void 0===o||null===(a=o.entityType)||void 0===a?void 0:a.toString(),eventType:"dice/roll/".concat(i),persist:"fulfilled"===i,messageScope:null!==(l=null===(h=t.context)||void 0===h?void 0:h.messageScope)&&void 0!==l?l:"gameId",messageTarget:null!==(c=null===(u=t.context)||void 0===u||null===(d=u.messageTarget)||void 0===d?void 0:d.toString())&&void 0!==c?c:this._messageBroker.gameId});case 1:case"end":return e.stop()}}),e,this)}))),function(e,t){return a.apply(this,arguments)})},{key:"_startAutoClear",value:function(){var e=this;this.enableAutoClear&&(this.diceAutoClearTimeout=setTimeout((function(){return e.clear()}),1e3*$.AutoClearSeconds))}},{key:"_waitForDiceMeshesReady",value:function(){var e=this;return new Promise((function(t){var i=setInterval((function(){var n=e.dice.filter((function(e){return!e.isReady()})).length;n<1?(e.logger.log("All Dice Ready"),clearInterval(i),t()):e.logger.log("".concat(n," assets not yet ready"))}),10)}))}},{key:"_instantiateDie",value:function(e){var t=new mt(this,q[e]);return t.create(this.diceManifest,e,this.currentCollisionEffectDice++<this.maxCollisionEffectDice),t}},{key:"showDicePreview",value:(o=f(T().mark((function e(t){var i,n,s,o=arguments;return T().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return i=!(o.length>1&&void 0!==o[1])||o[1],e.next=3,this.readyToRoll();case 3:return this.previewDie&&(this.previewDie.runRemoval(),this.previewDie.dispose()),n=this._instantiateDie(t),this.previewDie=n,n.onRollBegin(),this._addDie(this.previewDie),e.next=10,this._waitForDiceMeshesReady();case 10:this.SceneManager.addCamera($.PreviewCameraStartHeight,$.PreviewCameraFOV,this.previewDie),this.SceneManager.environment.ground.isVisible=i,this.SceneManager.floor&&(this.SceneManager.floor.isVisible=!1),this.previewDie.meshParent.addRotation(M.Tools.ToRadians(q[t].baseRotation.x),M.Tools.ToRadians(q[t].baseRotation.y),M.Tools.ToRadians(q[t].baseRotation.z)),this.enableAnimation(!0),s=t==r.d100?0:this.previewDie.options.values,this.previewDie.onRollComplete(s),this.previewDie.setEnabled(!0);case 18:case"end":return e.stop()}}),e,this)}))),function(e){return o.apply(this,arguments)})},{key:"addDice",value:function(e,t){for(var i=0;i<e.set.length;i++){var n=e.set[i];n.dice=[];for(var s=0;s<n.count;s++)if(n.dieType===r.d100){var o=this._instantiateDie(n.dieType);o.rollIndex=t,this._addDie(o),n.dice.push(o);var a=this._instantiateDie("d10");a.rollIndex=t,this._addDie(a),o.pairedDie=a,a.pairedDie=o}else{var l=this._instantiateDie(n.dieType);l.rollIndex=t,this._addDie(l),n.dice.push(l)}}this.diceConstant+=e.constant}},{key:"_addDie",value:function(e){this.dice.push(e)}},{key:"checkForIdleScene",value:function(){this.animationEnabled&&this.SceneManager.isSceneIdle()&&this.enableAnimation(!1)}},{key:"enableAnimation",value:function(e){var t=this;this.animationEnabled!=e&&(this.SceneManager.enableRenderLoop(e,(function(e){t.animationEnabled&&t.update(e)})),this.animationEnabled=e,this.logger.debug("Animation ".concat(this.animationEnabled?"enabled":"disabled")))}},{key:"update",value:function(e){for(var t=0;t<this.dice.length;t++)null!=this.dice[t]&&this.dice[t].update(e);for(var i=0;i<this.diceRemoved.length;i++)null!=this.diceRemoved[i]&&this.diceRemoved[i].update(e);if(this.throwRunning){for(var n=!0,s=0;s<this.diceValues.length;s++){if(this.diceValues[s].dice.isFinished()){if(0===this.diceValues[s].stableCount){var r=this.diceValues[s].dice.getUpsideValue().dieValue;this.diceValues[s].result!==r&&(this.diceValues[s].result=r,this.diceValues[s].dice.onRollComplete(r))}this.diceValues[s].stableCount++}else this.diceValues[s].stableCount=0;this.diceValues[s].stableCount<20&&(n=!1)}n&&this._setResult()}}},{key:"_processEvent",value:function(e,t){var i=this._eventObservables[e];i&&i.notifyObservers(t)}},{key:"addEventListener",value:function(e,t){var i=this._eventObservables[e];if(!i)throw new Error("Unknown eventType ".concat(e));i.add(t)}},{key:"removeEventListener",value:function(e,t){var i=this._eventObservables[e];if(!i)throw new Error("Unknown eventType ".concat(e));i.removeCallback(t)}},{key:"_setResult",value:function(){var e=this;this.throwRunning=!1,this.result=this.rollRequest;for(var t=function(){var t,n=e.result.rolls[i];n.result={},n.result.constant=n.diceNotation.constant,n.result.values=[];for(var s=0;s<n.diceNotation.set.length;s++)n.diceNotation.set[s].dice.forEach((function(e){var t=e.getUpsideValue().result;e.disablePhysics(),e.pairedDie&&e.pairedDie.disablePhysics(),1===t?(e.onMinRoll(),e.pairedDie&&e.pairedDie.onMinRoll()):t===e.options.values&&(e.onMaxRoll(),e.pairedDie&&e.pairedDie.onMaxRoll()),n.result.values.push(t)}));(t=[]).concat.apply(t,R(e.result.rolls.map((function(e){var t;return(t=[]).concat.apply(t,R(e.diceNotation.set.map((function(e){return e.dice}))))})))).forEach((function(e){e.uniformContainer.setVec3("topFaceNormal",e.result.normal),e.pairedDie&&e.pairedDie.uniformContainer.setVec3("topFaceNormal",e.pairedDie.result.normal)}));var r=n.diceNotation.set.reduce((function(e,t){return e+t.getResult()}),0);n.result.total=r+n.diceNotation.constant;var o=0==n.diceNotation.constant?"":"+".concat(n.diceNotation.constant),a=n.diceNotation.set.map((function(e){return e.getResultStr()})).join("+");n.result.text="".concat(a).concat(o)},i=0;i<this.result.rolls.length;i++)t()}},{key:"_getResultConstant",value:function(){for(var e=this.rollRequest,t=0;t<e.rolls.length;t++){var i=e.rolls[t];i.result={},i.result.constant=i.diceNotation.constant,i.result.total=i.diceNotation.constant,i.result.values=[]}return e}},{key:"_prepareValues",value:function(){this.throwRunning=!0;for(var e=0;e<this.diceValues.length;e++)this.diceValues[e].stableCount=0}}]),i}();function jt(e,t){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),i.push.apply(i,n)}return i}function Yt(e){for(var t=1;t<arguments.length;t++){var i=null!=arguments[t]?arguments[t]:{};t%2?jt(Object(i),!0).forEach((function(t){x(e,t,i[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(i)):jt(Object(i)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(i,t))}))}return e}var qt=function(){function n(){_(this,n),x(this,"defaultDiceManifestUrl","/bundles/basic/default.json"),x(this,"_diceManager",void 0),x(this,"_notifier",void 0),x(this,"_initializationPromise",void 0),x(this,"_error",void 0),x(this,"trackingId",void 0),x(this,"sessionName",void 0),this._diceManager=new Xt}var s,r;return y(n,[{key:"init",value:function(e){var t=this;if(this._initializationPromise)return this._initializationPromise;var n=Yt(Yt(Yt({},{assetBaseLocation:"./",notifier:new C,diceUserConfig:i}),e),{},{isDebug:window.location.search.includes("dice-debug")});return this.analyticsInit(n.trackingId,n.sessionName),this.checkWebGl()?(window.location.search&&window.location.search.indexOf("dice-noclear")>0&&(this._diceManager.enableAutoClear=!1),this._notifier=n.notifier,this._initializationPromise=this._diceManager.init(n).then((function(){return window.addEventListener("resize",(function(){return t._diceManager.reInit(null)})),t.load(n.diceUserConfig.manifestUrl)})),this._initializationPromise):(this._error=new Error("Failed to load WebGL"),new Promise((function(){throw t._error})))}},{key:"analyticsInit",value:function(e,t){this.trackingId=e,this.sessionName=t,this._diceManager.analyticsInit(e,t)}},{key:"checkWebGl",value:function(){var e=document.createElement("canvas"),t=e.getContext("webgl")||e.getContext("experimental-webgl");return t&&t instanceof WebGLRenderingContext}},{key:"load",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:void 0;return this._error?new Promise((function(){throw e._error})):(t||(t=this._diceManager.diceUserConfig.manifestUrl),this._diceManager.load(t))}},{key:"clear",value:function(){this._error||this._diceManager.clear()}},{key:"updateDiceUserConfig",value:function(e){this._diceManager.updateSettings(e)}},{key:"getRoller",value:(r=f(T().mark((function e(t){return T().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.next=2,null==this?void 0:this._initializationPromise;case 2:return e.abrupt("return",new A(this._diceManager,t));case 3:case"end":return e.stop()}}),e,this)}))),function(e){return r.apply(this,arguments)})},{key:"roll",value:(s=f(T().mark((function e(t,i,n){var s=this;return T().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:if(!this._error){e.next=2;break}return e.abrupt("return",new Promise((function(){throw s._error})));case 2:return e.abrupt("return",this._diceManager.roll(t,i,n));case 3:case"end":return e.stop()}}),e,this)}))),function(e,t,i){return s.apply(this,arguments)})},{key:"showDiceNotification",value:function(e,t){this._error||this._notifier&&this._notifier.showDiceNotification(e,t)}},{key:"setDiceNotificationEnabled",value:function(e){void 0!==this._notifier&&(e||this._notifier.clearNotifications(null),this._notifier.setEnabled(e))}},{key:"addEventListener",value:function(e,t){this._diceManager.addEventListener(e,t)}},{key:"removeEventListener",value:function(e,t){this._diceManager.removeEventListener(e,t)}},{key:"showDicePreview",value:function(e){this._error||this._diceManager.showDicePreview(e)}},{key:"previewEvent",value:function(e,t){var i,n;this._error||("rollComplete"===e?null===(i=this._diceManager.previewDie)||void 0===i||i.onRollComplete(t):null===(n=this._diceManager.previewDie)||void 0===n||n._processEvent(e,t))}},{key:"setEnabled",value:function(i){i?At.log(e.DICE_Settings,t.DICE_Enabled):At.log(e.DICE_Settings,t.DICE_Disabled)}},{key:"logModalShown",value:function(i){At.log(e.DICE_Settings,t.DICE_Modal,i?"subscriber":"non-subscriber")}}]),n}();x(qt,"ManifestLocalStorageKey","DefaultManifest");const Kt=new qt;var $t=function(){function e(){_(this,e)}return y(e,null,[{key:"CustomD20",value:function(e){var t="+";return 0===e?r.d20:(e<0&&(t=""),"".concat(r.d20).concat(t).concat(e))}}]),e}()})();var l=a.cp,h=a.rq,c=a.bV,u=a.jx,d=a.m8,p=a.w$,f=a.f4,_=a.ZM,m=a.S_,g=a.lD,v=a.hi,y=a.cU,x=a.DI,b=a.ro,T=a.Yd,S=a._w,E=a.LM,C=a.Gs,A=a.ee;export{l as Analytics,h as DefaultDiceUserConfig,c as Dice,u as DiceEvent,d as DiceNotation,p as DiceNotifier,f as DiceOperation,_ as DiceRoller,m as DiceTools,g as DiceType,v as DiceTypes,y as DieTerm,x as EventActions,b as EventCategories,T as Logger,S as RollKind,E as RollRequest,C as RollRequestRoll,A as RollType};
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/brands/youtube.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/brands/youtube.svg
new file mode 100644
index 0000000..3f04754
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/brands/youtube.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgYoutube(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 576 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgYoutube);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/light/pen.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/light/pen.svg
new file mode 100644
index 0000000..adf353d
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/light/pen.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgPen(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M395.8 39.6c9.4-9.4 24.6-9.4 33.9 0l42.6 42.6c9.4 9.4 9.4 24.6 0 33.9L417.6 171 341 94.4l54.8-54.8zM318.4 117L395 193.6 159.6 428.9c-7.6 7.6-16.9 13.1-27.2 16.1L39.6 472.4l27.3-92.8c3-10.3 8.6-19.6 16.1-27.2L318.4 117zM452.4 17c-21.9-21.9-57.3-21.9-79.2 0L60.4 329.7c-11.4 11.4-19.7 25.4-24.2 40.8L.7 491.5c-1.7 5.6-.1 11.7 4 15.8s10.2 5.7 15.8 4l121-35.6c15.4-4.5 29.4-12.9 40.8-24.2L495 138.8c21.9-21.9 21.9-57.3 0-79.2L452.4 17z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgPen);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/angle-down.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/angle-down.svg
new file mode 100644
index 0000000..4d7a943
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/angle-down.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgAngleDown(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 448 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M241 337c-9.4 9.4-24.6 9.4-33.9 0L47 177c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l143 143L367 143c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9L241 337z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgAngleDown);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/arrow-down-to-line.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/arrow-down-to-line.svg
new file mode 100644
index 0000000..e798191
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/arrow-down-to-line.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgArrowDownToLine(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 384 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M360 480c13.3 0 24-10.7 24-24s-10.7-24-24-24L24 432c-13.3 0-24 10.7-24 24s10.7 24 24 24l336 0zM174.5 344.4c4.5 4.8 10.9 7.6 17.5 7.6s12.9-2.7 17.5-7.6l128-136c9.1-9.7 8.6-24.8-1-33.9s-24.8-8.6-33.9 1L216 267.5l0-83.5 0-128c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 128 0 83.5L81.5 175.6c-9.1-9.7-24.3-10.1-33.9-1s-10.1 24.3-1 33.9l128 136z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgArrowDownToLine);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/arrow-right.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/arrow-right.svg
new file mode 100644
index 0000000..86aa417
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/arrow-right.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgArrowRight(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 448 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M440.6 273.4c4.7-4.5 7.4-10.8 7.4-17.4s-2.7-12.8-7.4-17.4l-176-168c-9.6-9.2-24.8-8.8-33.9 .8s-8.8 24.8 .8 33.9L364.1 232 24 232c-13.3 0-24 10.7-24 24s10.7 24 24 24l340.1 0L231.4 406.6c-9.6 9.2-9.9 24.3-.8 33.9s24.3 9.9 33.9 .8l176-168z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgArrowRight);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/circle-info.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/circle-info.svg
new file mode 100644
index 0000000..d6f0a1c
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/circle-info.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgCircleInfo(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24h80c13.3 0 24-10.7 24-24s-10.7-24-24-24h-8V248c0-13.3-10.7-24-24-24H216c-13.3 0-24 10.7-24 24s10.7 24 24 24h24v64H216zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgCircleInfo);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/dice-d6.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/dice-d6.svg
new file mode 100644
index 0000000..d9dea1a
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/dice-d6.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgDiceD6(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 448 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M243.9 7.7c-12.4-7-27.6-6.9-39.9 .3L19.8 115.6C7.5 122.8 0 135.9 0 150.1V366.6c0 14.5 7.8 27.8 20.5 34.9l184 103c12.1 6.8 26.9 6.8 39.1 0l184-103c12.6-7.1 20.5-20.4 20.5-34.9V146.8c0-14.4-7.7-27.7-20.3-34.8L243.9 7.7zM71.8 140.8L224.2 51.7l152 86.2L223.8 228.2l-152-87.4zM48 182.4l152 87.4V447.1L48 361.9V182.4zM248 447.1V269.7l152-90.1V361.9L248 447.1z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgDiceD6);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/gear.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/gear.svg
new file mode 100644
index 0000000..3d9e7db
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/gear.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgGear(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M256 0c17 0 33.6 1.7 49.8 4.8c7.9 1.5 21.8 6.1 29.4 20.1c2 3.7 3.6 7.6 4.6 11.8l9.3 38.5C350.5 81 360.3 86.7 366 85l38-11.2c4-1.2 8.1-1.8 12.2-1.9c16.1-.5 27 9.4 32.3 15.4c22.1 25.1 39.1 54.6 49.9 86.3c2.6 7.6 5.6 21.8-2.7 35.4c-2.2 3.6-4.9 7-8 10L459 246.3c-4.2 4-4.2 15.5 0 19.5l28.7 27.3c3.1 3 5.8 6.4 8 10c8.2 13.6 5.2 27.8 2.7 35.4c-10.8 31.7-27.8 61.1-49.9 86.3c-5.3 6-16.3 15.9-32.3 15.4c-4.1-.1-8.2-.8-12.2-1.9L366 427c-5.7-1.7-15.5 4-16.9 9.8l-9.3 38.5c-1 4.2-2.6 8.2-4.6 11.8c-7.7 14-21.6 18.5-29.4 20.1C289.6 510.3 273 512 256 512s-33.6-1.7-49.8-4.8c-7.9-1.5-21.8-6.1-29.4-20.1c-2-3.7-3.6-7.6-4.6-11.8l-9.3-38.5c-1.4-5.8-11.2-11.5-16.9-9.8l-38 11.2c-4 1.2-8.1 1.8-12.2 1.9c-16.1 .5-27-9.4-32.3-15.4c-22-25.1-39.1-54.6-49.9-86.3c-2.6-7.6-5.6-21.8 2.7-35.4c2.2-3.6 4.9-7 8-10L53 265.7c4.2-4 4.2-15.5 0-19.5L24.2 218.9c-3.1-3-5.8-6.4-8-10C8 195.3 11 181.1 13.6 173.6c10.8-31.7 27.8-61.1 49.9-86.3c5.3-6 16.3-15.9 32.3-15.4c4.1 .1 8.2 .8 12.2 1.9L146 85c5.7 1.7 15.5-4 16.9-9.8l9.3-38.5c1-4.2 2.6-8.2 4.6-11.8c7.7-14 21.6-18.5 29.4-20.1C222.4 1.7 239 0 256 0zM218.1 51.4l-8.5 35.1c-7.8 32.3-45.3 53.9-77.2 44.6L97.9 120.9c-16.5 19.3-29.5 41.7-38 65.7l26.2 24.9c24 22.8 24 66.2 0 89L59.9 325.4c8.5 24 21.5 46.4 38 65.7l34.6-10.2c31.8-9.4 69.4 12.3 77.2 44.6l8.5 35.1c24.6 4.5 51.3 4.5 75.9 0l8.5-35.1c7.8-32.3 45.3-53.9 77.2-44.6l34.6 10.2c16.5-19.3 29.5-41.7 38-65.7l-26.2-24.9c-24-22.8-24-66.2 0-89l26.2-24.9c-8.5-24-21.5-46.4-38-65.7l-34.6 10.2c-31.8 9.4-69.4-12.3-77.2-44.6l-8.5-35.1c-24.6-4.5-51.3-4.5-75.9 0zM208 256a48 48 0 1 0 96 0 48 48 0 1 0 -96 0zm48 96a96 96 0 1 1 0-192 96 96 0 1 1 0 192z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgGear);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/lock.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/lock.svg
new file mode 100644
index 0000000..6e1dab3
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/lock.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgLock(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 448 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M144 128v64H304V128c0-44.2-35.8-80-80-80s-80 35.8-80 80zM96 192V128C96 57.3 153.3 0 224 0s128 57.3 128 128v64h32c35.3 0 64 28.7 64 64V448c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V256c0-35.3 28.7-64 64-64H96zM48 256V448c0 8.8 7.2 16 16 16H384c8.8 0 16-7.2 16-16V256c0-8.8-7.2-16-16-16H64c-8.8 0-16 7.2-16 16z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgLock);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/magnifying-glass.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/magnifying-glass.svg
new file mode 100644
index 0000000..e4a532d
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/magnifying-glass.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgMagnifyingGlass(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M368 208A160 160 0 1 0 48 208a160 160 0 1 0 320 0zM337.1 371.1C301.7 399.2 256.8 416 208 416C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208c0 48.8-16.8 93.7-44.9 129.1L505 471c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0L337.1 371.1z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgMagnifyingGlass);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/spinner-third.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/spinner-third.svg
new file mode 100644
index 0000000..27cdd3c
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/spinner-third.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgSpinnerThird(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M457 372c11.5 6.6 26.3 2.7 31.8-9.3C503.7 330.2 512 294.1 512 256C512 122.7 410.1 13.2 280 1.1C266.8-.1 256 10.7 256 24v0c0 13.3 10.8 23.9 24 25.4C383.5 61.2 464 149.2 464 256c0 29.3-6.1 57.3-17 82.6c-5.3 12.2-1.5 26.8 10 33.5v0z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgSpinnerThird);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/triangle-exclamation.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/triangle-exclamation.svg
new file mode 100644
index 0000000..06e8d4d
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/triangle-exclamation.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgTriangleExclamation(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M248.4 84.3c1.6-2.7 4.5-4.3 7.6-4.3s6 1.6 7.6 4.3L461.9 410c1.4 2.3 2.1 4.9 2.1 7.5c0 8-6.5 14.5-14.5 14.5H62.5c-8 0-14.5-6.5-14.5-14.5c0-2.7 .7-5.3 2.1-7.5L248.4 84.3zm-41-25L9.1 385c-6 9.8-9.1 21-9.1 32.5C0 452 28 480 62.5 480h387c34.5 0 62.5-28 62.5-62.5c0-11.5-3.2-22.7-9.1-32.5L304.6 59.3C294.3 42.4 275.9 32 256 32s-38.3 10.4-48.6 27.3zM288 368a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zm-8-184c0-13.3-10.7-24-24-24s-24 10.7-24 24v96c0 13.3 10.7 24 24 24s24-10.7 24-24V184z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgTriangleExclamation);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/wrench.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/wrench.svg
new file mode 100644
index 0000000..bed0bc0
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/wrench.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgWrench(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M322.3 268c9.4 2.6 19.3 4 29.7 4c60.5 0 109.8-48 111.9-108l-25.3 25.3c-12 12-28.3 18.7-45.3 18.7H368c-35.3 0-64-28.7-64-64V118.6c0-17 6.7-33.3 18.7-45.3l0 0L348 48.1C288 50.1 240 99.5 240 160c0 10.3 1.4 20.3 4 29.7c4.6 16.6-.2 34.4-12.4 46.6L57.1 410.7c-5.9 5.8-9.1 13.8-9.1 22.1C48 450 62 464 79.2 464c8.3 0 16.2-3.3 22.1-9.1L275.7 280.4c12.2-12.2 30-16.9 46.6-12.4zM424.6 39.4l-67.9 67.9c-3 3-4.7 7.1-4.7 11.3V144c0 8.8 7.2 16 16 16h25.4c4.2 0 8.3-1.7 11.3-4.7l67.9-67.9c7.2-7.2 19.3-5.9 23.7 3.3c10.1 21 15.7 44.5 15.7 69.3c0 88.4-71.6 160-160 160c-14.7 0-28.9-2-42.3-5.7L135.2 488.8c-14.9 14.9-35 23.2-56 23.2C35.5 512 0 476.5 0 432.8c0-21 8.3-41.1 23.2-56L197.7 202.3C194 188.9 192 174.7 192 160C192 71.6 263.6 0 352 0c24.8 0 48.3 5.7 69.3 15.7c9.2 4.4 10.5 16.5 3.3 23.7zM88 408a16 16 0 1 1 0 32 16 16 0 1 1 0-32z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgWrench);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/xmark.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/xmark.svg
new file mode 100644
index 0000000..8f93667
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/regular/xmark.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgXmark(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 384 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M345 137c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-119 119L73 103c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l119 119L39 375c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l119-119L311 409c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-119-119L345 137z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgXmark);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/sharp-regular/check.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/sharp-regular/check.svg
new file mode 100644
index 0000000..00bc593
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/sharp-regular/check.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgCheck(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 448 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M448 130L431 147 177.5 399.2l-16.9 16.9-16.9-16.9L17 273.1 0 256.2l33.9-34 17 16.9L160.6 348.3 397.1 112.9l17-16.9L448 130z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgCheck);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/arrow-right.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/arrow-right.svg
new file mode 100644
index 0000000..508d143
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/arrow-right.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgArrowRight(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 448 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgArrowRight);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/chevron-down.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/chevron-down.svg
new file mode 100644
index 0000000..3ad60d7
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/chevron-down.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgChevronDown(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgChevronDown);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/chevron-left.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/chevron-left.svg
new file mode 100644
index 0000000..eb79b60
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/chevron-left.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgChevronLeft(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 320 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgChevronLeft);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/chevron-right.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/chevron-right.svg
new file mode 100644
index 0000000..9f559c7
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/chevron-right.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgChevronRight(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 320 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgChevronRight);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/circle-exclamation.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/circle-exclamation.svg
new file mode 100644
index 0000000..8175917
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/circle-exclamation.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgCircleExclamation(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24V264c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgCircleExclamation);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/circle-xmark.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/circle-xmark.svg
new file mode 100644
index 0000000..c6fc554
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/circle-xmark.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgCircleXmark(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM175 175c9.4-9.4 24.6-9.4 33.9 0l47 47 47-47c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9l-47 47 47 47c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0l-47-47-47 47c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l47-47-47-47c-9.4-9.4-9.4-24.6 0-33.9z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgCircleXmark);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/grid.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/grid.svg
new file mode 100644
index 0000000..5bf04c2
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/grid.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgGrid(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 448 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M0 72C0 49.9 17.9 32 40 32H88c22.1 0 40 17.9 40 40v48c0 22.1-17.9 40-40 40H40c-22.1 0-40-17.9-40-40V72zM0 232c0-22.1 17.9-40 40-40H88c22.1 0 40 17.9 40 40v48c0 22.1-17.9 40-40 40H40c-22.1 0-40-17.9-40-40V232zM128 392v48c0 22.1-17.9 40-40 40H40c-22.1 0-40-17.9-40-40V392c0-22.1 17.9-40 40-40H88c22.1 0 40 17.9 40 40zM160 72c0-22.1 17.9-40 40-40h48c22.1 0 40 17.9 40 40v48c0 22.1-17.9 40-40 40H200c-22.1 0-40-17.9-40-40V72zM288 232v48c0 22.1-17.9 40-40 40H200c-22.1 0-40-17.9-40-40V232c0-22.1 17.9-40 40-40h48c22.1 0 40 17.9 40 40zM160 392c0-22.1 17.9-40 40-40h48c22.1 0 40 17.9 40 40v48c0 22.1-17.9 40-40 40H200c-22.1 0-40-17.9-40-40V392zM448 72v48c0 22.1-17.9 40-40 40H360c-22.1 0-40-17.9-40-40V72c0-22.1 17.9-40 40-40h48c22.1 0 40 17.9 40 40zM320 232c0-22.1 17.9-40 40-40h48c22.1 0 40 17.9 40 40v48c0 22.1-17.9 40-40 40H360c-22.1 0-40-17.9-40-40V232zM448 392v48c0 22.1-17.9 40-40 40H360c-22.1 0-40-17.9-40-40V392c0-22.1 17.9-40 40-40h48c22.1 0 40 17.9 40 40z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgGrid);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/lock.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/lock.svg
new file mode 100644
index 0000000..7a656e7
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/lock.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgLock(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 448 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M144 144v48H304V144c0-44.2-35.8-80-80-80s-80 35.8-80 80zM80 192V144C80 64.5 144.5 0 224 0s144 64.5 144 144v48h16c35.3 0 64 28.7 64 64V448c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V256c0-35.3 28.7-64 64-64H80z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgLock);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/magnifying-glass.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/magnifying-glass.svg
new file mode 100644
index 0000000..4aa6dc1
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/magnifying-glass.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgMagnifyingGlass(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgMagnifyingGlass);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/shuffle.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/shuffle.svg
new file mode 100644
index 0000000..afeb628
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/shuffle.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgShuffle(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M403.8 34.4c12-5 25.7-2.2 34.9 6.9l64 64c6 6 9.4 14.1 9.4 22.6s-3.4 16.6-9.4 22.6l-64 64c-9.2 9.2-22.9 11.9-34.9 6.9s-19.8-16.6-19.8-29.6V160H352c-10.1 0-19.6 4.7-25.6 12.8L284 229.3 244 176l31.2-41.6C293.3 110.2 321.8 96 352 96h32V64c0-12.9 7.8-24.6 19.8-29.6zM164 282.7L204 336l-31.2 41.6C154.7 401.8 126.2 416 96 416H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H96c10.1 0 19.6-4.7 25.6-12.8L164 282.7zm274.6 188c-9.2 9.2-22.9 11.9-34.9 6.9s-19.8-16.6-19.8-29.6V416H352c-30.2 0-58.7-14.2-76.8-38.4L121.6 172.8c-6-8.1-15.5-12.8-25.6-12.8H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H96c30.2 0 58.7 14.2 76.8 38.4L326.4 339.2c6 8.1 15.5 12.8 25.6 12.8h32V320c0-12.9 7.8-24.6 19.8-29.6s25.7-2.2 34.9 6.9l64 64c6 6 9.4 14.1 9.4 22.6s-3.4 16.6-9.4 22.6l-64 64z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgShuffle);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/spinner-third.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/spinner-third.svg
new file mode 100644
index 0000000..96fcd60
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/spinner-third.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgSpinnerThird(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 512 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M224 32c0-17.7 14.3-32 32-32C397.4 0 512 114.6 512 256c0 46.6-12.5 90.4-34.3 128c-8.8 15.3-28.4 20.5-43.7 11.7s-20.5-28.4-11.7-43.7c16.3-28.2 25.7-61 25.7-96c0-106-86-192-192-192c-17.7 0-32-14.3-32-32z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgSpinnerThird);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/star.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/star.svg
new file mode 100644
index 0000000..b33fd08
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/star.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgStar(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 576 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgStar);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/unlock.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/unlock.svg
new file mode 100644
index 0000000..6cfa582
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/unlock.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgUnlock(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 448 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M144 144c0-44.2 35.8-80 80-80c31.9 0 59.4 18.6 72.3 45.7c7.6 16 26.7 22.8 42.6 15.2s22.8-26.7 15.2-42.6C331 33.7 281.5 0 224 0C144.5 0 80 64.5 80 144v48H64c-35.3 0-64 28.7-64 64V448c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V256c0-35.3-28.7-64-64-64H144V144z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgUnlock);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/x.svg b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/x.svg
new file mode 100644
index 0000000..f24e862
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/fontawesome-cache/svgs/solid/x.svg
@@ -0,0 +1,24 @@
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from "react";
+function SvgX(_ref, svgRef) {
+  let {
+    title,
+    titleId,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 384 512",
+    width: "1em",
+    height: "1em",
+    ref: svgRef,
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    d: "M376.6 84.5c11.3-13.6 9.5-33.8-4.1-45.1s-33.8-9.5-45.1 4.1L192 206 56.6 43.5C45.3 29.9 25.1 28.1 11.5 39.4S-3.9 70.9 7.4 84.5L150.3 256 7.4 427.5c-11.3 13.6-9.5 33.8 4.1 45.1s33.8 9.5 45.1-4.1L192 306 327.4 468.5c11.3 13.6 31.5 15.4 45.1 4.1s15.4-31.5 4.1-45.1L233.7 256 376.6 84.5z"
+  })));
+}
+const ForwardRef = /*#__PURE__*/React.forwardRef(SvgX);
+export default ForwardRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/ftui-components/index.esm.js b/ddb_main/node_modules/@dndbeyond/ftui-components/index.esm.js
new file mode 100644
index 0000000..ab84779
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ftui-components/index.esm.js
@@ -0,0 +1,3879 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import React, { useState, useMemo } from 'react';
+import { styled, Box, ListItemButton, Avatar, ListItemText, ListItemSecondaryAction, unstable_composeClasses, Stack, IconButton, TextField, InputAdornment, Chip, List, ListItemAvatar, OutlinedInput, InputLabel, Select, Checkbox, MenuItem, Typography, Button, FormControl, FormLabel, FormGroup, FormControlLabel, Slider, AppBar, Container, Toolbar, Menu, Paper, Card, CardHeader, CardContent, CardActions, Grid } from '@mui/material';
+import TuneIcon from '@mui/icons-material/Tune';
+import SearchIcon from '@mui/icons-material/Search';
+import HighlightOffOutlinedIcon from '@mui/icons-material/HighlightOffOutlined';
+import { useThemeProps as useThemeProps$1, css } from '@mui/system';
+import { createDarkTheme, getThemeValue } from '@dndbeyond/ddb-theme';
+import CloseIcon from '@mui/icons-material/Close';
+import GlobalStyles from '@mui/material/GlobalStyles';
+import MoreIcon from '@mui/icons-material/MoreVert';
+import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
+import Box$1 from '@mui/material/Box';
+import Chip$1 from '@mui/material/Chip';
+import Tooltip from '@mui/material/Tooltip';
+import VolumeUpIcon from '@mui/icons-material/VolumeUp';
+
+var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+var check = function (it) {
+  return it && it.Math == Math && it;
+};
+
+// https://github.com/zloirock/core-js/issues/86#issuecomment-115759028
+var global$v =
+  // eslint-disable-next-line es-x/no-global-this -- safe
+  check(typeof globalThis == 'object' && globalThis) ||
+  check(typeof window == 'object' && window) ||
+  // eslint-disable-next-line no-restricted-globals -- safe
+  check(typeof self == 'object' && self) ||
+  check(typeof commonjsGlobal == 'object' && commonjsGlobal) ||
+  // eslint-disable-next-line no-new-func -- fallback
+  (function () { return this; })() || Function('return this')();
+
+var objectGetOwnPropertyDescriptor = {};
+
+var fails$e = function (exec) {
+  try {
+    return !!exec();
+  } catch (error) {
+    return true;
+  }
+};
+
+var fails$d = fails$e;
+
+// Detect IE8's incomplete defineProperty implementation
+var descriptors = !fails$d(function () {
+  // eslint-disable-next-line es-x/no-object-defineproperty -- required for testing
+  return Object.defineProperty({}, 1, { get: function () { return 7; } })[1] != 7;
+});
+
+var fails$c = fails$e;
+
+var functionBindNative = !fails$c(function () {
+  // eslint-disable-next-line es-x/no-function-prototype-bind -- safe
+  var test = (function () { /* empty */ }).bind();
+  // eslint-disable-next-line no-prototype-builtins -- safe
+  return typeof test != 'function' || test.hasOwnProperty('prototype');
+});
+
+var NATIVE_BIND$1 = functionBindNative;
+
+var call$6 = Function.prototype.call;
+
+var functionCall = NATIVE_BIND$1 ? call$6.bind(call$6) : function () {
+  return call$6.apply(call$6, arguments);
+};
+
+var objectPropertyIsEnumerable = {};
+
+var $propertyIsEnumerable = {}.propertyIsEnumerable;
+// eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
+var getOwnPropertyDescriptor$1 = Object.getOwnPropertyDescriptor;
+
+// Nashorn ~ JDK8 bug
+var NASHORN_BUG = getOwnPropertyDescriptor$1 && !$propertyIsEnumerable.call({ 1: 2 }, 1);
+
+// `Object.prototype.propertyIsEnumerable` method implementation
+// https://tc39.es/ecma262/#sec-object.prototype.propertyisenumerable
+objectPropertyIsEnumerable.f = NASHORN_BUG ? function propertyIsEnumerable(V) {
+  var descriptor = getOwnPropertyDescriptor$1(this, V);
+  return !!descriptor && descriptor.enumerable;
+} : $propertyIsEnumerable;
+
+var createPropertyDescriptor$3 = function (bitmap, value) {
+  return {
+    enumerable: !(bitmap & 1),
+    configurable: !(bitmap & 2),
+    writable: !(bitmap & 4),
+    value: value
+  };
+};
+
+var NATIVE_BIND = functionBindNative;
+
+var FunctionPrototype$1 = Function.prototype;
+var bind = FunctionPrototype$1.bind;
+var call$5 = FunctionPrototype$1.call;
+var uncurryThis$f = NATIVE_BIND && bind.bind(call$5, call$5);
+
+var functionUncurryThis = NATIVE_BIND ? function (fn) {
+  return fn && uncurryThis$f(fn);
+} : function (fn) {
+  return fn && function () {
+    return call$5.apply(fn, arguments);
+  };
+};
+
+var uncurryThis$e = functionUncurryThis;
+
+var toString$6 = uncurryThis$e({}.toString);
+var stringSlice$1 = uncurryThis$e(''.slice);
+
+var classofRaw$1 = function (it) {
+  return stringSlice$1(toString$6(it), 8, -1);
+};
+
+var global$u = global$v;
+var uncurryThis$d = functionUncurryThis;
+var fails$b = fails$e;
+var classof$4 = classofRaw$1;
+
+var Object$5 = global$u.Object;
+var split = uncurryThis$d(''.split);
+
+// fallback for non-array-like ES3 and non-enumerable old V8 strings
+var indexedObject = fails$b(function () {
+  // throws an error in rhino, see https://github.com/mozilla/rhino/issues/346
+  // eslint-disable-next-line no-prototype-builtins -- safe
+  return !Object$5('z').propertyIsEnumerable(0);
+}) ? function (it) {
+  return classof$4(it) == 'String' ? split(it, '') : Object$5(it);
+} : Object$5;
+
+var global$t = global$v;
+
+var TypeError$a = global$t.TypeError;
+
+// `RequireObjectCoercible` abstract operation
+// https://tc39.es/ecma262/#sec-requireobjectcoercible
+var requireObjectCoercible$4 = function (it) {
+  if (it == undefined) throw TypeError$a("Can't call method on " + it);
+  return it;
+};
+
+// toObject with fallback for non-array-like ES3 strings
+var IndexedObject$2 = indexedObject;
+var requireObjectCoercible$3 = requireObjectCoercible$4;
+
+var toIndexedObject$5 = function (it) {
+  return IndexedObject$2(requireObjectCoercible$3(it));
+};
+
+// `IsCallable` abstract operation
+// https://tc39.es/ecma262/#sec-iscallable
+var isCallable$g = function (argument) {
+  return typeof argument == 'function';
+};
+
+var isCallable$f = isCallable$g;
+
+var isObject$6 = function (it) {
+  return typeof it == 'object' ? it !== null : isCallable$f(it);
+};
+
+var global$s = global$v;
+var isCallable$e = isCallable$g;
+
+var aFunction = function (argument) {
+  return isCallable$e(argument) ? argument : undefined;
+};
+
+var getBuiltIn$4 = function (namespace, method) {
+  return arguments.length < 2 ? aFunction(global$s[namespace]) : global$s[namespace] && global$s[namespace][method];
+};
+
+var uncurryThis$c = functionUncurryThis;
+
+var objectIsPrototypeOf = uncurryThis$c({}.isPrototypeOf);
+
+var getBuiltIn$3 = getBuiltIn$4;
+
+var engineUserAgent = getBuiltIn$3('navigator', 'userAgent') || '';
+
+var global$r = global$v;
+var userAgent = engineUserAgent;
+
+var process = global$r.process;
+var Deno = global$r.Deno;
+var versions = process && process.versions || Deno && Deno.version;
+var v8 = versions && versions.v8;
+var match, version;
+
+if (v8) {
+  match = v8.split('.');
+  // in old Chrome, versions of V8 isn't V8 = Chrome / 10
+  // but their correct versions are not interesting for us
+  version = match[0] > 0 && match[0] < 4 ? 1 : +(match[0] + match[1]);
+}
+
+// BrowserFS NodeJS `process` polyfill incorrectly set `.v8` to `0.0`
+// so check `userAgent` even if `.v8` exists, but 0
+if (!version && userAgent) {
+  match = userAgent.match(/Edge\/(\d+)/);
+  if (!match || match[1] >= 74) {
+    match = userAgent.match(/Chrome\/(\d+)/);
+    if (match) version = +match[1];
+  }
+}
+
+var engineV8Version = version;
+
+/* eslint-disable es-x/no-symbol -- required for testing */
+
+var V8_VERSION = engineV8Version;
+var fails$a = fails$e;
+
+// eslint-disable-next-line es-x/no-object-getownpropertysymbols -- required for testing
+var nativeSymbol = !!Object.getOwnPropertySymbols && !fails$a(function () {
+  var symbol = Symbol();
+  // Chrome 38 Symbol has incorrect toString conversion
+  // `get-own-property-symbols` polyfill symbols converted to object are not Symbol instances
+  return !String(symbol) || !(Object(symbol) instanceof Symbol) ||
+    // Chrome 38-40 symbols are not inherited from DOM collections prototypes to instances
+    !Symbol.sham && V8_VERSION && V8_VERSION < 41;
+});
+
+/* eslint-disable es-x/no-symbol -- required for testing */
+
+var NATIVE_SYMBOL$2 = nativeSymbol;
+
+var useSymbolAsUid = NATIVE_SYMBOL$2
+  && !Symbol.sham
+  && typeof Symbol.iterator == 'symbol';
+
+var global$q = global$v;
+var getBuiltIn$2 = getBuiltIn$4;
+var isCallable$d = isCallable$g;
+var isPrototypeOf$1 = objectIsPrototypeOf;
+var USE_SYMBOL_AS_UID$1 = useSymbolAsUid;
+
+var Object$4 = global$q.Object;
+
+var isSymbol$2 = USE_SYMBOL_AS_UID$1 ? function (it) {
+  return typeof it == 'symbol';
+} : function (it) {
+  var $Symbol = getBuiltIn$2('Symbol');
+  return isCallable$d($Symbol) && isPrototypeOf$1($Symbol.prototype, Object$4(it));
+};
+
+var global$p = global$v;
+
+var String$4 = global$p.String;
+
+var tryToString$1 = function (argument) {
+  try {
+    return String$4(argument);
+  } catch (error) {
+    return 'Object';
+  }
+};
+
+var global$o = global$v;
+var isCallable$c = isCallable$g;
+var tryToString = tryToString$1;
+
+var TypeError$9 = global$o.TypeError;
+
+// `Assert: IsCallable(argument) is true`
+var aCallable$2 = function (argument) {
+  if (isCallable$c(argument)) return argument;
+  throw TypeError$9(tryToString(argument) + ' is not a function');
+};
+
+var aCallable$1 = aCallable$2;
+
+// `GetMethod` abstract operation
+// https://tc39.es/ecma262/#sec-getmethod
+var getMethod$1 = function (V, P) {
+  var func = V[P];
+  return func == null ? undefined : aCallable$1(func);
+};
+
+var global$n = global$v;
+var call$4 = functionCall;
+var isCallable$b = isCallable$g;
+var isObject$5 = isObject$6;
+
+var TypeError$8 = global$n.TypeError;
+
+// `OrdinaryToPrimitive` abstract operation
+// https://tc39.es/ecma262/#sec-ordinarytoprimitive
+var ordinaryToPrimitive$1 = function (input, pref) {
+  var fn, val;
+  if (pref === 'string' && isCallable$b(fn = input.toString) && !isObject$5(val = call$4(fn, input))) return val;
+  if (isCallable$b(fn = input.valueOf) && !isObject$5(val = call$4(fn, input))) return val;
+  if (pref !== 'string' && isCallable$b(fn = input.toString) && !isObject$5(val = call$4(fn, input))) return val;
+  throw TypeError$8("Can't convert object to primitive value");
+};
+
+var shared$3 = {exports: {}};
+
+var global$m = global$v;
+
+// eslint-disable-next-line es-x/no-object-defineproperty -- safe
+var defineProperty$5 = Object.defineProperty;
+
+var setGlobal$3 = function (key, value) {
+  try {
+    defineProperty$5(global$m, key, { value: value, configurable: true, writable: true });
+  } catch (error) {
+    global$m[key] = value;
+  } return value;
+};
+
+var global$l = global$v;
+var setGlobal$2 = setGlobal$3;
+
+var SHARED = '__core-js_shared__';
+var store$3 = global$l[SHARED] || setGlobal$2(SHARED, {});
+
+var sharedStore = store$3;
+
+var store$2 = sharedStore;
+
+(shared$3.exports = function (key, value) {
+  return store$2[key] || (store$2[key] = value !== undefined ? value : {});
+})('versions', []).push({
+  version: '3.22.4',
+  mode: 'global',
+  copyright: '© 2014-2022 Denis Pushkarev (zloirock.ru)',
+  license: 'https://github.com/zloirock/core-js/blob/v3.22.4/LICENSE',
+  source: 'https://github.com/zloirock/core-js'
+});
+
+var global$k = global$v;
+var requireObjectCoercible$2 = requireObjectCoercible$4;
+
+var Object$3 = global$k.Object;
+
+// `ToObject` abstract operation
+// https://tc39.es/ecma262/#sec-toobject
+var toObject$4 = function (argument) {
+  return Object$3(requireObjectCoercible$2(argument));
+};
+
+var uncurryThis$b = functionUncurryThis;
+var toObject$3 = toObject$4;
+
+var hasOwnProperty = uncurryThis$b({}.hasOwnProperty);
+
+// `HasOwnProperty` abstract operation
+// https://tc39.es/ecma262/#sec-hasownproperty
+// eslint-disable-next-line es-x/no-object-hasown -- safe
+var hasOwnProperty_1 = Object.hasOwn || function hasOwn(it, key) {
+  return hasOwnProperty(toObject$3(it), key);
+};
+
+var uncurryThis$a = functionUncurryThis;
+
+var id = 0;
+var postfix = Math.random();
+var toString$5 = uncurryThis$a(1.0.toString);
+
+var uid$2 = function (key) {
+  return 'Symbol(' + (key === undefined ? '' : key) + ')_' + toString$5(++id + postfix, 36);
+};
+
+var global$j = global$v;
+var shared$2 = shared$3.exports;
+var hasOwn$9 = hasOwnProperty_1;
+var uid$1 = uid$2;
+var NATIVE_SYMBOL$1 = nativeSymbol;
+var USE_SYMBOL_AS_UID = useSymbolAsUid;
+
+var WellKnownSymbolsStore = shared$2('wks');
+var Symbol$2 = global$j.Symbol;
+var symbolFor = Symbol$2 && Symbol$2['for'];
+var createWellKnownSymbol = USE_SYMBOL_AS_UID ? Symbol$2 : Symbol$2 && Symbol$2.withoutSetter || uid$1;
+
+var wellKnownSymbol$a = function (name) {
+  if (!hasOwn$9(WellKnownSymbolsStore, name) || !(NATIVE_SYMBOL$1 || typeof WellKnownSymbolsStore[name] == 'string')) {
+    var description = 'Symbol.' + name;
+    if (NATIVE_SYMBOL$1 && hasOwn$9(Symbol$2, name)) {
+      WellKnownSymbolsStore[name] = Symbol$2[name];
+    } else if (USE_SYMBOL_AS_UID && symbolFor) {
+      WellKnownSymbolsStore[name] = symbolFor(description);
+    } else {
+      WellKnownSymbolsStore[name] = createWellKnownSymbol(description);
+    }
+  } return WellKnownSymbolsStore[name];
+};
+
+var global$i = global$v;
+var call$3 = functionCall;
+var isObject$4 = isObject$6;
+var isSymbol$1 = isSymbol$2;
+var getMethod = getMethod$1;
+var ordinaryToPrimitive = ordinaryToPrimitive$1;
+var wellKnownSymbol$9 = wellKnownSymbol$a;
+
+var TypeError$7 = global$i.TypeError;
+var TO_PRIMITIVE = wellKnownSymbol$9('toPrimitive');
+
+// `ToPrimitive` abstract operation
+// https://tc39.es/ecma262/#sec-toprimitive
+var toPrimitive$1 = function (input, pref) {
+  if (!isObject$4(input) || isSymbol$1(input)) return input;
+  var exoticToPrim = getMethod(input, TO_PRIMITIVE);
+  var result;
+  if (exoticToPrim) {
+    if (pref === undefined) pref = 'default';
+    result = call$3(exoticToPrim, input, pref);
+    if (!isObject$4(result) || isSymbol$1(result)) return result;
+    throw TypeError$7("Can't convert object to primitive value");
+  }
+  if (pref === undefined) pref = 'number';
+  return ordinaryToPrimitive(input, pref);
+};
+
+var toPrimitive = toPrimitive$1;
+var isSymbol = isSymbol$2;
+
+// `ToPropertyKey` abstract operation
+// https://tc39.es/ecma262/#sec-topropertykey
+var toPropertyKey$2 = function (argument) {
+  var key = toPrimitive(argument, 'string');
+  return isSymbol(key) ? key : key + '';
+};
+
+var global$h = global$v;
+var isObject$3 = isObject$6;
+
+var document$1 = global$h.document;
+// typeof document.createElement is 'object' in old IE
+var EXISTS$1 = isObject$3(document$1) && isObject$3(document$1.createElement);
+
+var documentCreateElement$2 = function (it) {
+  return EXISTS$1 ? document$1.createElement(it) : {};
+};
+
+var DESCRIPTORS$9 = descriptors;
+var fails$9 = fails$e;
+var createElement = documentCreateElement$2;
+
+// Thanks to IE8 for its funny defineProperty
+var ie8DomDefine = !DESCRIPTORS$9 && !fails$9(function () {
+  // eslint-disable-next-line es-x/no-object-defineproperty -- required for testing
+  return Object.defineProperty(createElement('div'), 'a', {
+    get: function () { return 7; }
+  }).a != 7;
+});
+
+var DESCRIPTORS$8 = descriptors;
+var call$2 = functionCall;
+var propertyIsEnumerableModule$1 = objectPropertyIsEnumerable;
+var createPropertyDescriptor$2 = createPropertyDescriptor$3;
+var toIndexedObject$4 = toIndexedObject$5;
+var toPropertyKey$1 = toPropertyKey$2;
+var hasOwn$8 = hasOwnProperty_1;
+var IE8_DOM_DEFINE$1 = ie8DomDefine;
+
+// eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
+var $getOwnPropertyDescriptor$1 = Object.getOwnPropertyDescriptor;
+
+// `Object.getOwnPropertyDescriptor` method
+// https://tc39.es/ecma262/#sec-object.getownpropertydescriptor
+objectGetOwnPropertyDescriptor.f = DESCRIPTORS$8 ? $getOwnPropertyDescriptor$1 : function getOwnPropertyDescriptor(O, P) {
+  O = toIndexedObject$4(O);
+  P = toPropertyKey$1(P);
+  if (IE8_DOM_DEFINE$1) try {
+    return $getOwnPropertyDescriptor$1(O, P);
+  } catch (error) { /* empty */ }
+  if (hasOwn$8(O, P)) return createPropertyDescriptor$2(!call$2(propertyIsEnumerableModule$1.f, O, P), O[P]);
+};
+
+var objectDefineProperty = {};
+
+var DESCRIPTORS$7 = descriptors;
+var fails$8 = fails$e;
+
+// V8 ~ Chrome 36-
+// https://bugs.chromium.org/p/v8/issues/detail?id=3334
+var v8PrototypeDefineBug = DESCRIPTORS$7 && fails$8(function () {
+  // eslint-disable-next-line es-x/no-object-defineproperty -- required for testing
+  return Object.defineProperty(function () { /* empty */ }, 'prototype', {
+    value: 42,
+    writable: false
+  }).prototype != 42;
+});
+
+var global$g = global$v;
+var isObject$2 = isObject$6;
+
+var String$3 = global$g.String;
+var TypeError$6 = global$g.TypeError;
+
+// `Assert: Type(argument) is Object`
+var anObject$5 = function (argument) {
+  if (isObject$2(argument)) return argument;
+  throw TypeError$6(String$3(argument) + ' is not an object');
+};
+
+var global$f = global$v;
+var DESCRIPTORS$6 = descriptors;
+var IE8_DOM_DEFINE = ie8DomDefine;
+var V8_PROTOTYPE_DEFINE_BUG$1 = v8PrototypeDefineBug;
+var anObject$4 = anObject$5;
+var toPropertyKey = toPropertyKey$2;
+
+var TypeError$5 = global$f.TypeError;
+// eslint-disable-next-line es-x/no-object-defineproperty -- safe
+var $defineProperty = Object.defineProperty;
+// eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
+var $getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
+var ENUMERABLE = 'enumerable';
+var CONFIGURABLE$1 = 'configurable';
+var WRITABLE = 'writable';
+
+// `Object.defineProperty` method
+// https://tc39.es/ecma262/#sec-object.defineproperty
+objectDefineProperty.f = DESCRIPTORS$6 ? V8_PROTOTYPE_DEFINE_BUG$1 ? function defineProperty(O, P, Attributes) {
+  anObject$4(O);
+  P = toPropertyKey(P);
+  anObject$4(Attributes);
+  if (typeof O === 'function' && P === 'prototype' && 'value' in Attributes && WRITABLE in Attributes && !Attributes[WRITABLE]) {
+    var current = $getOwnPropertyDescriptor(O, P);
+    if (current && current[WRITABLE]) {
+      O[P] = Attributes.value;
+      Attributes = {
+        configurable: CONFIGURABLE$1 in Attributes ? Attributes[CONFIGURABLE$1] : current[CONFIGURABLE$1],
+        enumerable: ENUMERABLE in Attributes ? Attributes[ENUMERABLE] : current[ENUMERABLE],
+        writable: false
+      };
+    }
+  } return $defineProperty(O, P, Attributes);
+} : $defineProperty : function defineProperty(O, P, Attributes) {
+  anObject$4(O);
+  P = toPropertyKey(P);
+  anObject$4(Attributes);
+  if (IE8_DOM_DEFINE) try {
+    return $defineProperty(O, P, Attributes);
+  } catch (error) { /* empty */ }
+  if ('get' in Attributes || 'set' in Attributes) throw TypeError$5('Accessors not supported');
+  if ('value' in Attributes) O[P] = Attributes.value;
+  return O;
+};
+
+var DESCRIPTORS$5 = descriptors;
+var definePropertyModule$3 = objectDefineProperty;
+var createPropertyDescriptor$1 = createPropertyDescriptor$3;
+
+var createNonEnumerableProperty$5 = DESCRIPTORS$5 ? function (object, key, value) {
+  return definePropertyModule$3.f(object, key, createPropertyDescriptor$1(1, value));
+} : function (object, key, value) {
+  object[key] = value;
+  return object;
+};
+
+var makeBuiltIn$2 = {exports: {}};
+
+var DESCRIPTORS$4 = descriptors;
+var hasOwn$7 = hasOwnProperty_1;
+
+var FunctionPrototype = Function.prototype;
+// eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
+var getDescriptor = DESCRIPTORS$4 && Object.getOwnPropertyDescriptor;
+
+var EXISTS = hasOwn$7(FunctionPrototype, 'name');
+// additional protection from minified / mangled / dropped function names
+var PROPER = EXISTS && (function something() { /* empty */ }).name === 'something';
+var CONFIGURABLE = EXISTS && (!DESCRIPTORS$4 || (DESCRIPTORS$4 && getDescriptor(FunctionPrototype, 'name').configurable));
+
+var functionName = {
+  EXISTS: EXISTS,
+  PROPER: PROPER,
+  CONFIGURABLE: CONFIGURABLE
+};
+
+var uncurryThis$9 = functionUncurryThis;
+var isCallable$a = isCallable$g;
+var store$1 = sharedStore;
+
+var functionToString = uncurryThis$9(Function.toString);
+
+// this helper broken in `core-js@3.4.1-3.4.4`, so we can't use `shared` helper
+if (!isCallable$a(store$1.inspectSource)) {
+  store$1.inspectSource = function (it) {
+    return functionToString(it);
+  };
+}
+
+var inspectSource$2 = store$1.inspectSource;
+
+var global$e = global$v;
+var isCallable$9 = isCallable$g;
+var inspectSource$1 = inspectSource$2;
+
+var WeakMap$1 = global$e.WeakMap;
+
+var nativeWeakMap = isCallable$9(WeakMap$1) && /native code/.test(inspectSource$1(WeakMap$1));
+
+var shared$1 = shared$3.exports;
+var uid = uid$2;
+
+var keys = shared$1('keys');
+
+var sharedKey$3 = function (key) {
+  return keys[key] || (keys[key] = uid(key));
+};
+
+var hiddenKeys$4 = {};
+
+var NATIVE_WEAK_MAP = nativeWeakMap;
+var global$d = global$v;
+var uncurryThis$8 = functionUncurryThis;
+var isObject$1 = isObject$6;
+var createNonEnumerableProperty$4 = createNonEnumerableProperty$5;
+var hasOwn$6 = hasOwnProperty_1;
+var shared = sharedStore;
+var sharedKey$2 = sharedKey$3;
+var hiddenKeys$3 = hiddenKeys$4;
+
+var OBJECT_ALREADY_INITIALIZED = 'Object already initialized';
+var TypeError$4 = global$d.TypeError;
+var WeakMap = global$d.WeakMap;
+var set, get, has;
+
+var enforce = function (it) {
+  return has(it) ? get(it) : set(it, {});
+};
+
+var getterFor = function (TYPE) {
+  return function (it) {
+    var state;
+    if (!isObject$1(it) || (state = get(it)).type !== TYPE) {
+      throw TypeError$4('Incompatible receiver, ' + TYPE + ' required');
+    } return state;
+  };
+};
+
+if (NATIVE_WEAK_MAP || shared.state) {
+  var store = shared.state || (shared.state = new WeakMap());
+  var wmget = uncurryThis$8(store.get);
+  var wmhas = uncurryThis$8(store.has);
+  var wmset = uncurryThis$8(store.set);
+  set = function (it, metadata) {
+    if (wmhas(store, it)) throw new TypeError$4(OBJECT_ALREADY_INITIALIZED);
+    metadata.facade = it;
+    wmset(store, it, metadata);
+    return metadata;
+  };
+  get = function (it) {
+    return wmget(store, it) || {};
+  };
+  has = function (it) {
+    return wmhas(store, it);
+  };
+} else {
+  var STATE = sharedKey$2('state');
+  hiddenKeys$3[STATE] = true;
+  set = function (it, metadata) {
+    if (hasOwn$6(it, STATE)) throw new TypeError$4(OBJECT_ALREADY_INITIALIZED);
+    metadata.facade = it;
+    createNonEnumerableProperty$4(it, STATE, metadata);
+    return metadata;
+  };
+  get = function (it) {
+    return hasOwn$6(it, STATE) ? it[STATE] : {};
+  };
+  has = function (it) {
+    return hasOwn$6(it, STATE);
+  };
+}
+
+var internalState = {
+  set: set,
+  get: get,
+  has: has,
+  enforce: enforce,
+  getterFor: getterFor
+};
+
+var fails$7 = fails$e;
+var isCallable$8 = isCallable$g;
+var hasOwn$5 = hasOwnProperty_1;
+var defineProperty$4 = objectDefineProperty.f;
+var CONFIGURABLE_FUNCTION_NAME$1 = functionName.CONFIGURABLE;
+var inspectSource = inspectSource$2;
+var InternalStateModule$1 = internalState;
+
+var enforceInternalState = InternalStateModule$1.enforce;
+var getInternalState$1 = InternalStateModule$1.get;
+
+var CONFIGURABLE_LENGTH = !fails$7(function () {
+  return defineProperty$4(function () { /* empty */ }, 'length', { value: 8 }).length !== 8;
+});
+
+var TEMPLATE = String(String).split('String');
+
+var makeBuiltIn$1 = makeBuiltIn$2.exports = function (value, name, options) {
+  if (String(name).slice(0, 7) === 'Symbol(') {
+    name = '[' + String(name).replace(/^Symbol\(([^)]*)\)/, '$1') + ']';
+  }
+  if (options && options.getter) name = 'get ' + name;
+  if (options && options.setter) name = 'set ' + name;
+  if (!hasOwn$5(value, 'name') || (CONFIGURABLE_FUNCTION_NAME$1 && value.name !== name)) {
+    defineProperty$4(value, 'name', { value: name, configurable: true });
+  }
+  if (CONFIGURABLE_LENGTH && options && hasOwn$5(options, 'arity') && value.length !== options.arity) {
+    defineProperty$4(value, 'length', { value: options.arity });
+  }
+  var state = enforceInternalState(value);
+  if (!hasOwn$5(state, 'source')) {
+    state.source = TEMPLATE.join(typeof name == 'string' ? name : '');
+  } return value;
+};
+
+// add fake Function#toString for correct work wrapped methods / constructors with methods like LoDash isNative
+// eslint-disable-next-line no-extend-native -- required
+Function.prototype.toString = makeBuiltIn$1(function toString() {
+  return isCallable$8(this) && getInternalState$1(this).source || inspectSource(this);
+}, 'toString');
+
+var global$c = global$v;
+var isCallable$7 = isCallable$g;
+var createNonEnumerableProperty$3 = createNonEnumerableProperty$5;
+var makeBuiltIn = makeBuiltIn$2.exports;
+var setGlobal$1 = setGlobal$3;
+
+var defineBuiltIn$3 = function (O, key, value, options) {
+  var unsafe = options ? !!options.unsafe : false;
+  var simple = options ? !!options.enumerable : false;
+  var noTargetGet = options ? !!options.noTargetGet : false;
+  var name = options && options.name !== undefined ? options.name : key;
+  if (isCallable$7(value)) makeBuiltIn(value, name, options);
+  if (O === global$c) {
+    if (simple) O[key] = value;
+    else setGlobal$1(key, value);
+    return O;
+  } else if (!unsafe) {
+    delete O[key];
+  } else if (!noTargetGet && O[key]) {
+    simple = true;
+  }
+  if (simple) O[key] = value;
+  else createNonEnumerableProperty$3(O, key, value);
+  return O;
+};
+
+var objectGetOwnPropertyNames = {};
+
+var ceil = Math.ceil;
+var floor = Math.floor;
+
+// `ToIntegerOrInfinity` abstract operation
+// https://tc39.es/ecma262/#sec-tointegerorinfinity
+var toIntegerOrInfinity$2 = function (argument) {
+  var number = +argument;
+  // eslint-disable-next-line no-self-compare -- safe
+  return number !== number || number === 0 ? 0 : (number > 0 ? floor : ceil)(number);
+};
+
+var toIntegerOrInfinity$1 = toIntegerOrInfinity$2;
+
+var max = Math.max;
+var min$1 = Math.min;
+
+// Helper for a popular repeating case of the spec:
+// Let integer be ? ToInteger(index).
+// If integer < 0, let result be max((length + integer), 0); else let result be min(integer, length).
+var toAbsoluteIndex$1 = function (index, length) {
+  var integer = toIntegerOrInfinity$1(index);
+  return integer < 0 ? max(integer + length, 0) : min$1(integer, length);
+};
+
+var toIntegerOrInfinity = toIntegerOrInfinity$2;
+
+var min = Math.min;
+
+// `ToLength` abstract operation
+// https://tc39.es/ecma262/#sec-tolength
+var toLength$1 = function (argument) {
+  return argument > 0 ? min(toIntegerOrInfinity(argument), 0x1FFFFFFFFFFFFF) : 0; // 2 ** 53 - 1 == 9007199254740991
+};
+
+var toLength = toLength$1;
+
+// `LengthOfArrayLike` abstract operation
+// https://tc39.es/ecma262/#sec-lengthofarraylike
+var lengthOfArrayLike$2 = function (obj) {
+  return toLength(obj.length);
+};
+
+var toIndexedObject$3 = toIndexedObject$5;
+var toAbsoluteIndex = toAbsoluteIndex$1;
+var lengthOfArrayLike$1 = lengthOfArrayLike$2;
+
+// `Array.prototype.{ indexOf, includes }` methods implementation
+var createMethod$2 = function (IS_INCLUDES) {
+  return function ($this, el, fromIndex) {
+    var O = toIndexedObject$3($this);
+    var length = lengthOfArrayLike$1(O);
+    var index = toAbsoluteIndex(fromIndex, length);
+    var value;
+    // Array#includes uses SameValueZero equality algorithm
+    // eslint-disable-next-line no-self-compare -- NaN check
+    if (IS_INCLUDES && el != el) while (length > index) {
+      value = O[index++];
+      // eslint-disable-next-line no-self-compare -- NaN check
+      if (value != value) return true;
+    // Array#indexOf ignores holes, Array#includes - not
+    } else for (;length > index; index++) {
+      if ((IS_INCLUDES || index in O) && O[index] === el) return IS_INCLUDES || index || 0;
+    } return !IS_INCLUDES && -1;
+  };
+};
+
+var arrayIncludes = {
+  // `Array.prototype.includes` method
+  // https://tc39.es/ecma262/#sec-array.prototype.includes
+  includes: createMethod$2(true),
+  // `Array.prototype.indexOf` method
+  // https://tc39.es/ecma262/#sec-array.prototype.indexof
+  indexOf: createMethod$2(false)
+};
+
+var uncurryThis$7 = functionUncurryThis;
+var hasOwn$4 = hasOwnProperty_1;
+var toIndexedObject$2 = toIndexedObject$5;
+var indexOf = arrayIncludes.indexOf;
+var hiddenKeys$2 = hiddenKeys$4;
+
+var push = uncurryThis$7([].push);
+
+var objectKeysInternal = function (object, names) {
+  var O = toIndexedObject$2(object);
+  var i = 0;
+  var result = [];
+  var key;
+  for (key in O) !hasOwn$4(hiddenKeys$2, key) && hasOwn$4(O, key) && push(result, key);
+  // Don't enum bug & hidden keys
+  while (names.length > i) if (hasOwn$4(O, key = names[i++])) {
+    ~indexOf(result, key) || push(result, key);
+  }
+  return result;
+};
+
+// IE8- don't enum bug keys
+var enumBugKeys$3 = [
+  'constructor',
+  'hasOwnProperty',
+  'isPrototypeOf',
+  'propertyIsEnumerable',
+  'toLocaleString',
+  'toString',
+  'valueOf'
+];
+
+var internalObjectKeys$1 = objectKeysInternal;
+var enumBugKeys$2 = enumBugKeys$3;
+
+var hiddenKeys$1 = enumBugKeys$2.concat('length', 'prototype');
+
+// `Object.getOwnPropertyNames` method
+// https://tc39.es/ecma262/#sec-object.getownpropertynames
+// eslint-disable-next-line es-x/no-object-getownpropertynames -- safe
+objectGetOwnPropertyNames.f = Object.getOwnPropertyNames || function getOwnPropertyNames(O) {
+  return internalObjectKeys$1(O, hiddenKeys$1);
+};
+
+var objectGetOwnPropertySymbols = {};
+
+// eslint-disable-next-line es-x/no-object-getownpropertysymbols -- safe
+objectGetOwnPropertySymbols.f = Object.getOwnPropertySymbols;
+
+var getBuiltIn$1 = getBuiltIn$4;
+var uncurryThis$6 = functionUncurryThis;
+var getOwnPropertyNamesModule = objectGetOwnPropertyNames;
+var getOwnPropertySymbolsModule$1 = objectGetOwnPropertySymbols;
+var anObject$3 = anObject$5;
+
+var concat$1 = uncurryThis$6([].concat);
+
+// all object keys, includes non-enumerable and symbols
+var ownKeys$1 = getBuiltIn$1('Reflect', 'ownKeys') || function ownKeys(it) {
+  var keys = getOwnPropertyNamesModule.f(anObject$3(it));
+  var getOwnPropertySymbols = getOwnPropertySymbolsModule$1.f;
+  return getOwnPropertySymbols ? concat$1(keys, getOwnPropertySymbols(it)) : keys;
+};
+
+var hasOwn$3 = hasOwnProperty_1;
+var ownKeys = ownKeys$1;
+var getOwnPropertyDescriptorModule = objectGetOwnPropertyDescriptor;
+var definePropertyModule$2 = objectDefineProperty;
+
+var copyConstructorProperties$2 = function (target, source, exceptions) {
+  var keys = ownKeys(source);
+  var defineProperty = definePropertyModule$2.f;
+  var getOwnPropertyDescriptor = getOwnPropertyDescriptorModule.f;
+  for (var i = 0; i < keys.length; i++) {
+    var key = keys[i];
+    if (!hasOwn$3(target, key) && !(exceptions && hasOwn$3(exceptions, key))) {
+      defineProperty(target, key, getOwnPropertyDescriptor(source, key));
+    }
+  }
+};
+
+var fails$6 = fails$e;
+var isCallable$6 = isCallable$g;
+
+var replacement = /#|\.prototype\./;
+
+var isForced$1 = function (feature, detection) {
+  var value = data[normalize(feature)];
+  return value == POLYFILL ? true
+    : value == NATIVE ? false
+    : isCallable$6(detection) ? fails$6(detection)
+    : !!detection;
+};
+
+var normalize = isForced$1.normalize = function (string) {
+  return String(string).replace(replacement, '.').toLowerCase();
+};
+
+var data = isForced$1.data = {};
+var NATIVE = isForced$1.NATIVE = 'N';
+var POLYFILL = isForced$1.POLYFILL = 'P';
+
+var isForced_1 = isForced$1;
+
+var global$b = global$v;
+var getOwnPropertyDescriptor = objectGetOwnPropertyDescriptor.f;
+var createNonEnumerableProperty$2 = createNonEnumerableProperty$5;
+var defineBuiltIn$2 = defineBuiltIn$3;
+var setGlobal = setGlobal$3;
+var copyConstructorProperties$1 = copyConstructorProperties$2;
+var isForced = isForced_1;
+
+/*
+  options.target      - name of the target object
+  options.global      - target is the global object
+  options.stat        - export as static methods of target
+  options.proto       - export as prototype methods of target
+  options.real        - real prototype method for the `pure` version
+  options.forced      - export even if the native feature is available
+  options.bind        - bind methods to the target, required for the `pure` version
+  options.wrap        - wrap constructors to preventing global pollution, required for the `pure` version
+  options.unsafe      - use the simple assignment of property instead of delete + defineProperty
+  options.sham        - add a flag to not completely full polyfills
+  options.enumerable  - export as enumerable property
+  options.noTargetGet - prevent calling a getter on target
+  options.name        - the .name of the function if it does not match the key
+*/
+var _export = function (options, source) {
+  var TARGET = options.target;
+  var GLOBAL = options.global;
+  var STATIC = options.stat;
+  var FORCED, target, key, targetProperty, sourceProperty, descriptor;
+  if (GLOBAL) {
+    target = global$b;
+  } else if (STATIC) {
+    target = global$b[TARGET] || setGlobal(TARGET, {});
+  } else {
+    target = (global$b[TARGET] || {}).prototype;
+  }
+  if (target) for (key in source) {
+    sourceProperty = source[key];
+    if (options.noTargetGet) {
+      descriptor = getOwnPropertyDescriptor(target, key);
+      targetProperty = descriptor && descriptor.value;
+    } else targetProperty = target[key];
+    FORCED = isForced(GLOBAL ? key : TARGET + (STATIC ? '.' : '#') + key, options.forced);
+    // contained in target
+    if (!FORCED && targetProperty !== undefined) {
+      if (typeof sourceProperty == typeof targetProperty) continue;
+      copyConstructorProperties$1(sourceProperty, targetProperty);
+    }
+    // add a flag to not completely full polyfills
+    if (options.sham || (targetProperty && targetProperty.sham)) {
+      createNonEnumerableProperty$2(sourceProperty, 'sham', true);
+    }
+    defineBuiltIn$2(target, key, sourceProperty, options);
+  }
+};
+
+var internalObjectKeys = objectKeysInternal;
+var enumBugKeys$1 = enumBugKeys$3;
+
+// `Object.keys` method
+// https://tc39.es/ecma262/#sec-object.keys
+// eslint-disable-next-line es-x/no-object-keys -- safe
+var objectKeys$2 = Object.keys || function keys(O) {
+  return internalObjectKeys(O, enumBugKeys$1);
+};
+
+var DESCRIPTORS$3 = descriptors;
+var uncurryThis$5 = functionUncurryThis;
+var call$1 = functionCall;
+var fails$5 = fails$e;
+var objectKeys$1 = objectKeys$2;
+var getOwnPropertySymbolsModule = objectGetOwnPropertySymbols;
+var propertyIsEnumerableModule = objectPropertyIsEnumerable;
+var toObject$2 = toObject$4;
+var IndexedObject$1 = indexedObject;
+
+// eslint-disable-next-line es-x/no-object-assign -- safe
+var $assign = Object.assign;
+// eslint-disable-next-line es-x/no-object-defineproperty -- required for testing
+var defineProperty$3 = Object.defineProperty;
+var concat = uncurryThis$5([].concat);
+
+// `Object.assign` method
+// https://tc39.es/ecma262/#sec-object.assign
+var objectAssign = !$assign || fails$5(function () {
+  // should have correct order of operations (Edge bug)
+  if (DESCRIPTORS$3 && $assign({ b: 1 }, $assign(defineProperty$3({}, 'a', {
+    enumerable: true,
+    get: function () {
+      defineProperty$3(this, 'b', {
+        value: 3,
+        enumerable: false
+      });
+    }
+  }), { b: 2 })).b !== 1) return true;
+  // should work with symbols and should have deterministic property order (V8 bug)
+  var A = {};
+  var B = {};
+  // eslint-disable-next-line es-x/no-symbol -- safe
+  var symbol = Symbol();
+  var alphabet = 'abcdefghijklmnopqrst';
+  A[symbol] = 7;
+  alphabet.split('').forEach(function (chr) { B[chr] = chr; });
+  return $assign({}, A)[symbol] != 7 || objectKeys$1($assign({}, B)).join('') != alphabet;
+}) ? function assign(target, source) { // eslint-disable-line no-unused-vars -- required for `.length`
+  var T = toObject$2(target);
+  var argumentsLength = arguments.length;
+  var index = 1;
+  var getOwnPropertySymbols = getOwnPropertySymbolsModule.f;
+  var propertyIsEnumerable = propertyIsEnumerableModule.f;
+  while (argumentsLength > index) {
+    var S = IndexedObject$1(arguments[index++]);
+    var keys = getOwnPropertySymbols ? concat(objectKeys$1(S), getOwnPropertySymbols(S)) : objectKeys$1(S);
+    var length = keys.length;
+    var j = 0;
+    var key;
+    while (length > j) {
+      key = keys[j++];
+      if (!DESCRIPTORS$3 || call$1(propertyIsEnumerable, S, key)) T[key] = S[key];
+    }
+  } return T;
+} : $assign;
+
+var $$6 = _export;
+var assign = objectAssign;
+
+// `Object.assign` method
+// https://tc39.es/ecma262/#sec-object.assign
+// eslint-disable-next-line es-x/no-object-assign -- required for testing
+$$6({ target: 'Object', stat: true, arity: 2, forced: Object.assign !== assign }, {
+  assign: assign
+});
+
+var wellKnownSymbol$8 = wellKnownSymbol$a;
+
+var TO_STRING_TAG$3 = wellKnownSymbol$8('toStringTag');
+var test = {};
+
+test[TO_STRING_TAG$3] = 'z';
+
+var toStringTagSupport = String(test) === '[object z]';
+
+var global$a = global$v;
+var TO_STRING_TAG_SUPPORT = toStringTagSupport;
+var isCallable$5 = isCallable$g;
+var classofRaw = classofRaw$1;
+var wellKnownSymbol$7 = wellKnownSymbol$a;
+
+var TO_STRING_TAG$2 = wellKnownSymbol$7('toStringTag');
+var Object$2 = global$a.Object;
+
+// ES3 wrong here
+var CORRECT_ARGUMENTS = classofRaw(function () { return arguments; }()) == 'Arguments';
+
+// fallback for IE11 Script Access Denied error
+var tryGet = function (it, key) {
+  try {
+    return it[key];
+  } catch (error) { /* empty */ }
+};
+
+// getting tag from ES6+ `Object.prototype.toString`
+var classof$3 = TO_STRING_TAG_SUPPORT ? classofRaw : function (it) {
+  var O, tag, result;
+  return it === undefined ? 'Undefined' : it === null ? 'Null'
+    // @@toStringTag case
+    : typeof (tag = tryGet(O = Object$2(it), TO_STRING_TAG$2)) == 'string' ? tag
+    // builtinTag case
+    : CORRECT_ARGUMENTS ? classofRaw(O)
+    // ES3 arguments fallback
+    : (result = classofRaw(O)) == 'Object' && isCallable$5(O.callee) ? 'Arguments' : result;
+};
+
+var global$9 = global$v;
+var classof$2 = classof$3;
+
+var String$2 = global$9.String;
+
+var toString$4 = function (argument) {
+  if (classof$2(argument) === 'Symbol') throw TypeError('Cannot convert a Symbol value to a string');
+  return String$2(argument);
+};
+
+var $$5 = _export;
+var DESCRIPTORS$2 = descriptors;
+var global$8 = global$v;
+var uncurryThis$4 = functionUncurryThis;
+var hasOwn$2 = hasOwnProperty_1;
+var isCallable$4 = isCallable$g;
+var isPrototypeOf = objectIsPrototypeOf;
+var toString$3 = toString$4;
+var defineProperty$2 = objectDefineProperty.f;
+var copyConstructorProperties = copyConstructorProperties$2;
+
+var NativeSymbol = global$8.Symbol;
+var SymbolPrototype = NativeSymbol && NativeSymbol.prototype;
+
+if (DESCRIPTORS$2 && isCallable$4(NativeSymbol) && (!('description' in SymbolPrototype) ||
+  // Safari 12 bug
+  NativeSymbol().description !== undefined
+)) {
+  var EmptyStringDescriptionStore = {};
+  // wrap Symbol constructor for correct work with undefined description
+  var SymbolWrapper = function Symbol() {
+    var description = arguments.length < 1 || arguments[0] === undefined ? undefined : toString$3(arguments[0]);
+    var result = isPrototypeOf(SymbolPrototype, this)
+      ? new NativeSymbol(description)
+      // in Edge 13, String(Symbol(undefined)) === 'Symbol(undefined)'
+      : description === undefined ? NativeSymbol() : NativeSymbol(description);
+    if (description === '') EmptyStringDescriptionStore[result] = true;
+    return result;
+  };
+
+  copyConstructorProperties(SymbolWrapper, NativeSymbol);
+  SymbolWrapper.prototype = SymbolPrototype;
+  SymbolPrototype.constructor = SymbolWrapper;
+
+  var NATIVE_SYMBOL = String(NativeSymbol('test')) == 'Symbol(test)';
+  var symbolToString = uncurryThis$4(SymbolPrototype.toString);
+  var symbolValueOf = uncurryThis$4(SymbolPrototype.valueOf);
+  var regexp = /^Symbol\((.*)\)[^)]+$/;
+  var replace$1 = uncurryThis$4(''.replace);
+  var stringSlice = uncurryThis$4(''.slice);
+
+  defineProperty$2(SymbolPrototype, 'description', {
+    configurable: true,
+    get: function description() {
+      var symbol = symbolValueOf(this);
+      var string = symbolToString(symbol);
+      if (hasOwn$2(EmptyStringDescriptionStore, symbol)) return '';
+      var desc = NATIVE_SYMBOL ? stringSlice(string, 7, -1) : replace$1(string, regexp, '$1');
+      return desc === '' ? undefined : desc;
+    }
+  });
+
+  $$5({ global: true, forced: true }, {
+    Symbol: SymbolWrapper
+  });
+}
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+function __rest(s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+function toVal(mix) {
+	var k, y, str='';
+
+	if (typeof mix === 'string' || typeof mix === 'number') {
+		str += mix;
+	} else if (typeof mix === 'object') {
+		if (Array.isArray(mix)) {
+			for (k=0; k < mix.length; k++) {
+				if (mix[k]) {
+					if (y = toVal(mix[k])) {
+						str && (str += ' ');
+						str += y;
+					}
+				}
+			}
+		} else {
+			for (k in mix) {
+				if (mix[k]) {
+					str && (str += ' ');
+					str += k;
+				}
+			}
+		}
+	}
+
+	return str;
+}
+
+function clsx () {
+	var i=0, tmp, x, str='';
+	while (i < arguments.length) {
+		if (tmp = arguments[i++]) {
+			if (x = toVal(tmp)) {
+				str && (str += ' ');
+				str += x;
+			}
+		}
+	}
+	return str;
+}
+
+const defaultGenerator = componentName => componentName;
+
+const createClassNameGenerator = () => {
+  let generate = defaultGenerator;
+  return {
+    configure(generator) {
+      generate = generator;
+    },
+
+    generate(componentName) {
+      return generate(componentName);
+    },
+
+    reset() {
+      generate = defaultGenerator;
+    }
+
+  };
+};
+
+const ClassNameGenerator = createClassNameGenerator();
+var ClassNameGenerator$1 = ClassNameGenerator;
+
+const globalStateClassesMapping = {
+  active: 'Mui-active',
+  checked: 'Mui-checked',
+  completed: 'Mui-completed',
+  disabled: 'Mui-disabled',
+  error: 'Mui-error',
+  expanded: 'Mui-expanded',
+  focused: 'Mui-focused',
+  focusVisible: 'Mui-focusVisible',
+  required: 'Mui-required',
+  selected: 'Mui-selected'
+};
+function generateUtilityClass(componentName, slot) {
+  const globalStateClass = globalStateClassesMapping[slot];
+  return globalStateClass || `${ClassNameGenerator$1.generate(componentName)}-${slot}`;
+}
+
+function generateUtilityClasses(componentName, slots) {
+  const result = {};
+  slots.forEach(slot => {
+    result[slot] = generateUtilityClass(componentName, slot);
+  });
+  return result;
+}
+
+const componentName$7 = 'FtuiFilterableListView';
+
+function getFilterableListViewUtilityClass(slot) {
+  return generateUtilityClass(componentName$7, slot);
+}
+const filterableListViewClasses = generateUtilityClasses(componentName$7, ['root', 'item', 'itemAvatar', 'imageSizeSmall', 'imageSizeMedium', 'itemText', 'itemActions']);
+
+function useThemeProps({
+  props,
+  name
+}) {
+  return useThemeProps$1({
+    props,
+    name,
+    defaultTheme: Object.assign(Object.assign({}, createDarkTheme()), {
+      components: {}
+    })
+  });
+}
+
+const useUtilityClasses$a = ownerState => {
+  const {
+    imageSize
+  } = ownerState;
+  const slots = {
+    root: ['root'],
+    item: ['item'],
+    itemAvatar: ['itemAvatar', imageSize === 'small' && 'imageSizeSmall', imageSize === 'medium' && 'imageSizeMedium'],
+    itemText: ['itemText'],
+    itemActions: ['itemActions']
+  };
+  return unstable_composeClasses(slots, getFilterableListViewUtilityClass, {});
+};
+
+const FilterableListViewRoot = styled(Box, {
+  name: componentName$7,
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => ({
+  color: theme.palette.text.primary,
+  maxHeight: '100vh',
+  minWidth: 320,
+  width: '100%',
+  overflow: 'auto'
+}));
+const Item = styled(ListItemButton, {
+  name: componentName$7,
+  slot: 'Item'
+})(({
+  theme
+}) => ({
+  justifyContent: 'flex-start',
+  alignItems: 'center',
+  boxShadow: `0px 16px 1px -16px ${theme.palette.text.secondary}`,
+  ':hover': {
+    background: theme.palette.action.hover
+  },
+  '&.Mui-selected': {
+    background: theme.palette.action.selected
+  }
+}));
+const ItemAvatar = styled(Avatar, {
+  name: componentName$7,
+  slot: 'ItemAvatar',
+  overridesResolver: (props, styles) => styles.itemAvatar
+})(({
+  theme,
+  ownerState
+}) => ({
+  height: 56,
+  width: 56,
+  marginRight: 12,
+  [`&.${filterableListViewClasses.imageSizeSmall}`]: {
+    height: 40,
+    width: 40
+  }
+}));
+const ItemText = styled(ListItemText, {
+  name: componentName$7,
+  slot: 'ItemText',
+  overridesResolver: (props, styles) => styles.itemText
+})(({
+  theme
+}) => ({
+  '.Mui-selected &': {
+    '.MuiListItemText-primary': {
+      fontWeight: theme.typography.fontWeightBold
+    }
+  },
+  '.MuiListItemText-secondary': {
+    overflow: 'hidden',
+    textOverflow: 'ellipsis',
+    whiteSpace: 'nowrap'
+  }
+}));
+const ItemActions = styled(ListItemSecondaryAction, {
+  name: componentName$7,
+  slot: 'ItemActions',
+  overridesResolver: (props, styles) => styles.itemActions
+})({
+  position: 'relative',
+  top: 'auto',
+  right: 'auto',
+  display: 'flex',
+  flexDirection: 'column',
+  justifyContent: 'center',
+  alignItems: 'center',
+  transform: 'none',
+  margin: 'auto 0'
+});
+const FilterableListView = /*#__PURE__*/React.forwardRef(function FilterableListView(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: componentName$7
+  });
+
+  const {
+    endRef,
+    className,
+    filterButtonAlign = 'left',
+    filters,
+    imageSize = 'medium',
+    items = [],
+    onSearch,
+    onToggleFilters,
+    searchLabel = 'Search',
+    showImages = true,
+    selected = 0
+  } = props,
+        other = __rest(props, ["endRef", "className", "filterButtonAlign", "filters", "imageSize", "items", "onSearch", "onToggleFilters", "searchLabel", "showImages", "selected"]);
+
+  const ownerState = Object.assign({
+    imageSize
+  }, props);
+  const classes = useUtilityClasses$a(ownerState);
+  return jsxs(FilterableListViewRoot, Object.assign({
+    className: clsx(classes.root, className),
+    ownerState: ownerState
+  }, other, {
+    children: [jsxs(Stack, Object.assign({
+      direction: filterButtonAlign === 'left' ? 'row' : 'row-reverse',
+      sx: {
+        p: 1
+      }
+    }, {
+      children: [onToggleFilters && jsx(IconButton, Object.assign({
+        onClick: onToggleFilters,
+        "aria-label": "Show Filters"
+      }, {
+        children: jsx(TuneIcon, {}, void 0)
+      }), void 0), onSearch && jsx(TextField, {
+        variant: "outlined",
+        size: "small",
+        placeholder: searchLabel,
+        onChange: e => onSearch(e),
+        InputProps: {
+          startAdornment: jsx(InputAdornment, Object.assign({
+            position: "start"
+          }, {
+            children: jsx(SearchIcon, {}, void 0)
+          }), void 0)
+        },
+        sx: {
+          flex: 1
+        }
+      }, void 0)]
+    }), void 0), filters && jsx(Stack, Object.assign({
+      direction: "row",
+      spacing: 1,
+      sx: {
+        p: 1
+      }
+    }, {
+      children: filters.map(filter => jsx(Chip, {
+        label: filter.label,
+        onDelete: filter.onDelete,
+        deleteIcon: jsx(HighlightOffOutlinedIcon, {}, void 0),
+        sx: {
+          backgroundColor: 'background.paper',
+          borderWidth: 1,
+          borderStyle: 'solid',
+          borderColor: 'text.disabled'
+        }
+      }, filter.label))
+    }), void 0), jsx(List, Object.assign({
+      sx: {
+        width: '100%'
+      }
+    }, {
+      children: items.map((item, i) => jsxs(Item, Object.assign({
+        className: clsx(classes.item, className),
+        onClick: () => item.onClick(item, i),
+        alignItems: "flex-start",
+        selected: selected === i,
+        ref: endRef && i === items.length - 1 ? endRef : null
+      }, {
+        children: [showImages && jsx(ListItemAvatar, {
+          children: jsx(ItemAvatar, {
+            className: clsx(classes.itemAvatar, className),
+            variant: "rounded",
+            alt: item.name,
+            src: item.image,
+            ownerState: ownerState
+          }, void 0)
+        }, void 0), jsx(ItemText, {
+          className: clsx(classes.itemText, className),
+          primary: jsxs(Fragment, {
+            children: [item.name, item.isLegacy && jsx(Chip, {
+              label: "Legacy",
+              size: "small",
+              sx: {
+                borderRadius: 1,
+                ml: 1
+              }
+            }, void 0)]
+          }, void 0),
+          secondary: item.description
+        }, void 0), jsx(ItemActions, {
+          className: clsx(classes.itemActions, className),
+          children: item.actions
+        }, void 0)]
+      }), `${item.name}-${i}`))
+    }), void 0)]
+  }), void 0);
+});
+
+var objectDefineProperties = {};
+
+var DESCRIPTORS$1 = descriptors;
+var V8_PROTOTYPE_DEFINE_BUG = v8PrototypeDefineBug;
+var definePropertyModule$1 = objectDefineProperty;
+var anObject$2 = anObject$5;
+var toIndexedObject$1 = toIndexedObject$5;
+var objectKeys = objectKeys$2;
+
+// `Object.defineProperties` method
+// https://tc39.es/ecma262/#sec-object.defineproperties
+// eslint-disable-next-line es-x/no-object-defineproperties -- safe
+objectDefineProperties.f = DESCRIPTORS$1 && !V8_PROTOTYPE_DEFINE_BUG ? Object.defineProperties : function defineProperties(O, Properties) {
+  anObject$2(O);
+  var props = toIndexedObject$1(Properties);
+  var keys = objectKeys(Properties);
+  var length = keys.length;
+  var index = 0;
+  var key;
+  while (length > index) definePropertyModule$1.f(O, key = keys[index++], props[key]);
+  return O;
+};
+
+var getBuiltIn = getBuiltIn$4;
+
+var html$1 = getBuiltIn('document', 'documentElement');
+
+/* global ActiveXObject -- old IE, WSH */
+
+var anObject$1 = anObject$5;
+var definePropertiesModule = objectDefineProperties;
+var enumBugKeys = enumBugKeys$3;
+var hiddenKeys = hiddenKeys$4;
+var html = html$1;
+var documentCreateElement$1 = documentCreateElement$2;
+var sharedKey$1 = sharedKey$3;
+
+var GT = '>';
+var LT = '<';
+var PROTOTYPE = 'prototype';
+var SCRIPT = 'script';
+var IE_PROTO$1 = sharedKey$1('IE_PROTO');
+
+var EmptyConstructor = function () { /* empty */ };
+
+var scriptTag = function (content) {
+  return LT + SCRIPT + GT + content + LT + '/' + SCRIPT + GT;
+};
+
+// Create object with fake `null` prototype: use ActiveX Object with cleared prototype
+var NullProtoObjectViaActiveX = function (activeXDocument) {
+  activeXDocument.write(scriptTag(''));
+  activeXDocument.close();
+  var temp = activeXDocument.parentWindow.Object;
+  activeXDocument = null; // avoid memory leak
+  return temp;
+};
+
+// Create object with fake `null` prototype: use iframe Object with cleared prototype
+var NullProtoObjectViaIFrame = function () {
+  // Thrash, waste and sodomy: IE GC bug
+  var iframe = documentCreateElement$1('iframe');
+  var JS = 'java' + SCRIPT + ':';
+  var iframeDocument;
+  iframe.style.display = 'none';
+  html.appendChild(iframe);
+  // https://github.com/zloirock/core-js/issues/475
+  iframe.src = String(JS);
+  iframeDocument = iframe.contentWindow.document;
+  iframeDocument.open();
+  iframeDocument.write(scriptTag('document.F=Object'));
+  iframeDocument.close();
+  return iframeDocument.F;
+};
+
+// Check for document.domain and active x support
+// No need to use active x approach when document.domain is not set
+// see https://github.com/es-shims/es5-shim/issues/150
+// variation of https://github.com/kitcambridge/es5-shim/commit/4f738ac066346
+// avoid IE GC bug
+var activeXDocument;
+var NullProtoObject = function () {
+  try {
+    activeXDocument = new ActiveXObject('htmlfile');
+  } catch (error) { /* ignore */ }
+  NullProtoObject = typeof document != 'undefined'
+    ? document.domain && activeXDocument
+      ? NullProtoObjectViaActiveX(activeXDocument) // old IE
+      : NullProtoObjectViaIFrame()
+    : NullProtoObjectViaActiveX(activeXDocument); // WSH
+  var length = enumBugKeys.length;
+  while (length--) delete NullProtoObject[PROTOTYPE][enumBugKeys[length]];
+  return NullProtoObject();
+};
+
+hiddenKeys[IE_PROTO$1] = true;
+
+// `Object.create` method
+// https://tc39.es/ecma262/#sec-object.create
+// eslint-disable-next-line es-x/no-object-create -- safe
+var objectCreate = Object.create || function create(O, Properties) {
+  var result;
+  if (O !== null) {
+    EmptyConstructor[PROTOTYPE] = anObject$1(O);
+    result = new EmptyConstructor();
+    EmptyConstructor[PROTOTYPE] = null;
+    // add "__proto__" for Object.getPrototypeOf polyfill
+    result[IE_PROTO$1] = O;
+  } else result = NullProtoObject();
+  return Properties === undefined ? result : definePropertiesModule.f(result, Properties);
+};
+
+var wellKnownSymbol$6 = wellKnownSymbol$a;
+var create$1 = objectCreate;
+var definePropertyModule = objectDefineProperty;
+
+var UNSCOPABLES = wellKnownSymbol$6('unscopables');
+var ArrayPrototype = Array.prototype;
+
+// Array.prototype[@@unscopables]
+// https://tc39.es/ecma262/#sec-array.prototype-@@unscopables
+if (ArrayPrototype[UNSCOPABLES] == undefined) {
+  definePropertyModule.f(ArrayPrototype, UNSCOPABLES, {
+    configurable: true,
+    value: create$1(null)
+  });
+}
+
+// add a key to Array.prototype[@@unscopables]
+var addToUnscopables$2 = function (key) {
+  ArrayPrototype[UNSCOPABLES][key] = true;
+};
+
+var $$4 = _export;
+var $includes = arrayIncludes.includes;
+var fails$4 = fails$e;
+var addToUnscopables$1 = addToUnscopables$2;
+
+// FF99+ bug
+var BROKEN_ON_SPARSE = fails$4(function () {
+  return !Array(1).includes();
+});
+
+// `Array.prototype.includes` method
+// https://tc39.es/ecma262/#sec-array.prototype.includes
+$$4({ target: 'Array', proto: true, forced: BROKEN_ON_SPARSE }, {
+  includes: function includes(el /* , fromIndex = 0 */) {
+    return $includes(this, el, arguments.length > 1 ? arguments[1] : undefined);
+  }
+});
+
+// https://tc39.es/ecma262/#sec-array.prototype-@@unscopables
+addToUnscopables$1('includes');
+
+var isObject = isObject$6;
+var classof$1 = classofRaw$1;
+var wellKnownSymbol$5 = wellKnownSymbol$a;
+
+var MATCH$1 = wellKnownSymbol$5('match');
+
+// `IsRegExp` abstract operation
+// https://tc39.es/ecma262/#sec-isregexp
+var isRegexp = function (it) {
+  var isRegExp;
+  return isObject(it) && ((isRegExp = it[MATCH$1]) !== undefined ? !!isRegExp : classof$1(it) == 'RegExp');
+};
+
+var global$7 = global$v;
+var isRegExp = isRegexp;
+
+var TypeError$3 = global$7.TypeError;
+
+var notARegexp = function (it) {
+  if (isRegExp(it)) {
+    throw TypeError$3("The method doesn't accept regular expressions");
+  } return it;
+};
+
+var wellKnownSymbol$4 = wellKnownSymbol$a;
+
+var MATCH = wellKnownSymbol$4('match');
+
+var correctIsRegexpLogic = function (METHOD_NAME) {
+  var regexp = /./;
+  try {
+    '/./'[METHOD_NAME](regexp);
+  } catch (error1) {
+    try {
+      regexp[MATCH] = false;
+      return '/./'[METHOD_NAME](regexp);
+    } catch (error2) { /* empty */ }
+  } return false;
+};
+
+var $$3 = _export;
+var uncurryThis$3 = functionUncurryThis;
+var notARegExp = notARegexp;
+var requireObjectCoercible$1 = requireObjectCoercible$4;
+var toString$2 = toString$4;
+var correctIsRegExpLogic = correctIsRegexpLogic;
+
+var stringIndexOf = uncurryThis$3(''.indexOf);
+
+// `String.prototype.includes` method
+// https://tc39.es/ecma262/#sec-string.prototype.includes
+$$3({ target: 'String', proto: true, forced: !correctIsRegExpLogic('includes') }, {
+  includes: function includes(searchString /* , position = 0 */) {
+    return !!~stringIndexOf(
+      toString$2(requireObjectCoercible$1(this)),
+      toString$2(notARegExp(searchString)),
+      arguments.length > 1 ? arguments[1] : undefined
+    );
+  }
+});
+
+// a string of all valid unicode whitespaces
+var whitespaces$2 = '\u0009\u000A\u000B\u000C\u000D\u0020\u00A0\u1680\u2000\u2001\u2002' +
+  '\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200A\u202F\u205F\u3000\u2028\u2029\uFEFF';
+
+var uncurryThis$2 = functionUncurryThis;
+var requireObjectCoercible = requireObjectCoercible$4;
+var toString$1 = toString$4;
+var whitespaces$1 = whitespaces$2;
+
+var replace = uncurryThis$2(''.replace);
+var whitespace = '[' + whitespaces$1 + ']';
+var ltrim = RegExp('^' + whitespace + whitespace + '*');
+var rtrim = RegExp(whitespace + whitespace + '*$');
+
+// `String.prototype.{ trim, trimStart, trimEnd, trimLeft, trimRight }` methods implementation
+var createMethod$1 = function (TYPE) {
+  return function ($this) {
+    var string = toString$1(requireObjectCoercible($this));
+    if (TYPE & 1) string = replace(string, ltrim, '');
+    if (TYPE & 2) string = replace(string, rtrim, '');
+    return string;
+  };
+};
+
+var stringTrim = {
+  // `String.prototype.{ trimLeft, trimStart }` methods
+  // https://tc39.es/ecma262/#sec-string.prototype.trimstart
+  start: createMethod$1(1),
+  // `String.prototype.{ trimRight, trimEnd }` methods
+  // https://tc39.es/ecma262/#sec-string.prototype.trimend
+  end: createMethod$1(2),
+  // `String.prototype.trim` method
+  // https://tc39.es/ecma262/#sec-string.prototype.trim
+  trim: createMethod$1(3)
+};
+
+var global$6 = global$v;
+var fails$3 = fails$e;
+var uncurryThis$1 = functionUncurryThis;
+var toString = toString$4;
+var trim = stringTrim.trim;
+var whitespaces = whitespaces$2;
+
+var $parseInt$1 = global$6.parseInt;
+var Symbol$1 = global$6.Symbol;
+var ITERATOR$3 = Symbol$1 && Symbol$1.iterator;
+var hex = /^[+-]?0x/i;
+var exec = uncurryThis$1(hex.exec);
+var FORCED = $parseInt$1(whitespaces + '08') !== 8 || $parseInt$1(whitespaces + '0x16') !== 22
+  // MS Edge 18- broken with boxed symbols
+  || (ITERATOR$3 && !fails$3(function () { $parseInt$1(Object(ITERATOR$3)); }));
+
+// `parseInt` method
+// https://tc39.es/ecma262/#sec-parseint-string-radix
+var numberParseInt = FORCED ? function parseInt(string, radix) {
+  var S = trim(toString(string));
+  return $parseInt$1(S, (radix >>> 0) || (exec(hex, S) ? 16 : 10));
+} : $parseInt$1;
+
+var $$2 = _export;
+var $parseInt = numberParseInt;
+
+// `parseInt` method
+// https://tc39.es/ecma262/#sec-parseint-string-radix
+$$2({ global: true, forced: parseInt != $parseInt }, {
+  parseInt: $parseInt
+});
+
+const componentName$6 = 'FtuiFilterInput';
+
+function getFilterInputUtilityClass(slot) {
+  return generateUtilityClass(componentName$6, slot);
+}
+generateUtilityClasses(componentName$6, ['root', 'input', 'chipbox', 'chip', 'icon', 'label']);
+
+const useUtilityClasses$9 = ownerState => {
+  const slots = {
+    root: ['root'],
+    input: ['input'],
+    chipbox: ['chipbox'],
+    chip: ['chip'],
+    icon: ['icon'],
+    label: ['label']
+  };
+  return unstable_composeClasses(slots, getFilterInputUtilityClass, {});
+};
+
+const FilterInputInput = styled(OutlinedInput, {
+  name: componentName$6,
+  slot: 'Input',
+  overridesResolver: (props, styles) => styles.input
+})(({
+  theme,
+  ownerState
+}) => ({// color: theme.palette.text.primary,
+}));
+const FilterInputLabel = styled(InputLabel, {
+  name: componentName$6,
+  slot: 'Label',
+  overridesResolver: (props, styles) => styles.label
+})(({
+  theme,
+  ownerState
+}) => ({
+  '&.MuiInputLabel-shrink:not(.Mui-error, .Mui-disabled)': {
+    color: getThemeValue(theme, ownerState.color) || theme.palette.text.primary
+  }
+}));
+const FilterInputChipBox = styled(Box, {
+  name: componentName$6,
+  slot: 'Chipbox',
+  overridesResolver: (props, styles) => styles.chipbox
+})(({
+  theme,
+  ownerState
+}) => ({
+  display: 'flex',
+  flexWrap: 'wrap',
+  gap: 8,
+  marginTop: -5,
+  marginBottom: -5
+}));
+const FilterInputChip = styled(Chip, {
+  name: componentName$6,
+  slot: 'Chip',
+  overridesResolver: (props, styles) => styles.chip
+})(({
+  theme,
+  ownerState
+}) => ({
+  color: theme.palette.text.secondary,
+  borderWidth: 1,
+  borderColor: theme.palette.grey[500],
+  borderStyle: 'solid',
+  backgroundColor: theme.palette.grey[200]
+}));
+const FilterInputDeleteIcon = styled(CloseIcon, {
+  name: componentName$6,
+  slot: 'Icon',
+  overridesResolver: (props, styles) => styles.icon
+})(({
+  theme,
+  ownerState
+}) => ({
+  fill: theme.palette.grey[500],
+  '&:hover': {
+    fill: theme.palette.grey[700]
+  }
+}));
+const FilterInputRoot = styled(Select, {
+  name: componentName$6,
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => ({
+  '.MuiSelect-icon': {
+    color: getThemeValue(theme, ownerState.color) || theme.palette.grey[700]
+  },
+  '.MuiOutlinedInput-notchedOutline': {
+    borderColor: getThemeValue(theme, ownerState.color) || theme.palette.grey[900]
+  },
+  '&:hover:not(.Mui-error, .Mui-disabled) .MuiOutlinedInput-notchedOutline': {
+    borderColor: getThemeValue(theme, ownerState.color) || theme.palette.grey[900]
+  },
+  '&.Mui-focused:not(.Mui-error, .Mui-disabled) .MuiOutlinedInput-notchedOutline': {
+    borderColor: getThemeValue(theme, ownerState.color) || theme.palette.grey[900]
+  }
+}));
+const FilterInput = /*#__PURE__*/React.forwardRef(function FilterInput(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: componentName$6
+  });
+
+  const {
+    className,
+    children,
+    label = '',
+    value,
+    multiple = false,
+    onChipDelete,
+    color
+  } = props,
+        other = __rest(props, ["className", "children", "label", "value", "multiple", "onChipDelete", "color"]);
+
+  const ownerState = Object.assign(Object.assign({}, props), {
+    color,
+    multiple,
+    label
+  });
+  const classes = useUtilityClasses$9();
+
+  const handleDelete = (e, value) => {
+    if (typeof onChipDelete === 'function') {
+      onChipDelete(e, value);
+    }
+  };
+
+  return jsxs(Fragment, {
+    children: [jsx(FilterInputLabel, Object.assign({
+      className: clsx(classes.label, className),
+      ownerState: ownerState,
+      id: "filter-input-label"
+    }, {
+      children: label
+    }), void 0), jsx(FilterInputRoot, Object.assign({
+      className: clsx(classes.root, className),
+      ownerState: ownerState
+    }, other, {
+      labelId: "filter-input-label",
+      value: value,
+      multiple: multiple,
+      input: jsx(FilterInputInput, {
+        className: clsx(classes.input, className),
+        ownerState: ownerState,
+        label: label
+      }, void 0),
+      renderValue: selected => jsx(FilterInputChipBox, Object.assign({
+        className: clsx(classes.chipbox, className),
+        ownerState: ownerState
+      }, {
+        children: Array.isArray(selected) && multiple ? selected.map(value => jsx(FilterInputChip, {
+          className: clsx(classes.chip, className),
+          ownerState: ownerState,
+          label: value,
+          onMouseDown: e => {
+            e.stopPropagation();
+          },
+          onDelete: e => handleDelete(e, value),
+          deleteIcon: jsx(FilterInputDeleteIcon, {
+            className: clsx(classes.icon, className),
+            ownerState: ownerState
+          }, void 0)
+        }, value)) : selected
+      }), void 0)
+    }, {
+      children: children
+    }), void 0)]
+  }, void 0);
+});
+
+const componentName$5 = 'FtuiFilterInput';
+
+function getFilterInputItemUtilityClass(slot) {
+  return generateUtilityClass(componentName$5, slot);
+}
+generateUtilityClasses(componentName$5, ['root', 'checkbox', 'text']);
+
+const useUtilityClasses$8 = ownerState => {
+  const slots = {
+    root: ['root'],
+    checkbox: ['checkbox'],
+    text: ['text']
+  };
+  return unstable_composeClasses(slots, getFilterInputItemUtilityClass, {});
+};
+
+const FilterInputItemText = styled(ListItemText, {
+  name: componentName$5,
+  slot: 'Text',
+  overridesResolver: (props, styles) => styles.input
+})(({
+  theme,
+  ownerState
+}) => ({// color: theme.palette.text.primary,
+}));
+const FilterInputItemCheckbox = styled(Checkbox, {
+  name: componentName$5,
+  slot: 'Checkbox',
+  overridesResolver: (props, styles) => styles.input
+})(({
+  theme,
+  ownerState
+}) => ({// color: theme.palette.text.primary,
+}));
+const FilterInputItemRoot = styled(MenuItem, {
+  name: componentName$5,
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => ({// color: theme.palette.text.primary,
+  // background: theme.palette.background.scroll,
+}));
+const FilterInputItem = /*#__PURE__*/React.forwardRef(function FilterInputItem(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: componentName$5
+  });
+
+  const {
+    className,
+    children,
+    label = '',
+    value = '',
+    checked = false,
+    hideCheckbox = false
+  } = props,
+        other = __rest(props, ["className", "children", "label", "value", "checked", "hideCheckbox"]);
+
+  const ownerState = Object.assign(Object.assign({}, props), {
+    label,
+    value,
+    checked,
+    hideCheckbox
+  });
+  const classes = useUtilityClasses$8();
+  return jsxs(FilterInputItemRoot, Object.assign({
+    className: clsx(classes.root, className),
+    ownerState: ownerState
+  }, other, {
+    children: [jsx(FilterInputItemText, {
+      className: clsx(classes.text, className),
+      ownerState: ownerState,
+      primary: label
+    }, void 0), !hideCheckbox && jsx(FilterInputItemCheckbox, {
+      className: clsx(classes.checkbox, className),
+      ownerState: ownerState,
+      checked: checked
+    }, void 0)]
+  }), void 0);
+});
+
+const FilterPanel = ({
+  filters,
+  onClearFilters,
+  sx
+}) => jsxs(Box, Object.assign({
+  sx: Object.assign({
+    width: 320,
+    mb: 20
+  }, sx)
+}, {
+  children: [jsxs(Stack, Object.assign({
+    direction: "row",
+    justifyContent: "space-between",
+    alignItems: "center"
+  }, {
+    children: [jsx(Typography, Object.assign({
+      variant: "h5",
+      component: "p",
+      sx: {
+        fontVariant: 'small-caps'
+      }
+    }, {
+      children: "Filters"
+    }), void 0), jsx(Button, Object.assign({
+      color: "secondary",
+      size: "small",
+      onClick: onClearFilters
+    }, {
+      children: "Clear Filters"
+    }), void 0)]
+  }), void 0),
+  /* eslint-disable-next-line array-callback-return */
+  filters.map(filter => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+
+    switch (filter.type) {
+      case 'select':
+        {
+          return jsx(FormControl, Object.assign({
+            fullWidth: true,
+            sx: {
+              mb: 2
+            }
+          }, {
+            children: jsx(FilterInput, Object.assign({
+              label: filter.label,
+              name: filter.name,
+              onChange: filter.onSelect,
+              value: filter.value,
+              color: "text.disabled"
+            }, {
+              children: filter.options.map(({
+                value,
+                label
+              }) => {
+                var _a;
+
+                return jsx(FilterInputItem, {
+                  value: label,
+                  label: label,
+                  checked: (_a = filter === null || filter === void 0 ? void 0 : filter.value) === null || _a === void 0 ? void 0 : _a.includes(value)
+                }, value);
+              })
+            }), void 0)
+          }), filter === null || filter === void 0 ? void 0 : filter.name);
+        }
+
+      case 'multiselect':
+        {
+          return jsx(FormControl, Object.assign({
+            fullWidth: true,
+            sx: {
+              mb: 2
+            }
+          }, {
+            children: jsx(FilterInput, Object.assign({
+              multiple: true,
+              label: filter.label,
+              name: filter.name,
+              onChange: filter.onSelect,
+              value: filter.value,
+              onChipDelete: (e, value) => filter.onDelete(filter.name, value),
+              color: "text.disabled"
+            }, {
+              children: filter.options.map(({
+                value,
+                label
+              }) => {
+                var _a;
+
+                return jsx(FilterInputItem, {
+                  value: label,
+                  label: label,
+                  checked: (_a = filter === null || filter === void 0 ? void 0 : filter.value) === null || _a === void 0 ? void 0 : _a.includes(value)
+                }, value);
+              })
+            }), void 0)
+          }), filter === null || filter === void 0 ? void 0 : filter.name);
+        }
+
+      case 'slider':
+        {
+          const minMax = (filter === null || filter === void 0 ? void 0 : filter.options) ? [(_b = (_a = filter === null || filter === void 0 ? void 0 : filter.options) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.value, (_e = (_c = filter === null || filter === void 0 ? void 0 : filter.options) === null || _c === void 0 ? void 0 : _c[((_d = filter === null || filter === void 0 ? void 0 : filter.options) === null || _d === void 0 ? void 0 : _d.length) - 1]) === null || _e === void 0 ? void 0 : _e.value] : [];
+          const sliderValue = filter === null || filter === void 0 ? void 0 : filter.value;
+          const marks = (filter === null || filter === void 0 ? void 0 : filter.marks) || false;
+          return jsxs(Box, Object.assign({
+            sx: {
+              mb: 2
+            }
+          }, {
+            children: [jsxs(Stack, Object.assign({
+              direction: "row",
+              justifyContent: "space-between"
+            }, {
+              children: [jsxs(Typography, {
+                children: [filter === null || filter === void 0 ? void 0 : filter.label, ' ', (filter === null || filter === void 0 ? void 0 : filter.subLabel) && jsx(Typography, Object.assign({
+                  component: "span",
+                  sx: {
+                    color: 'GrayText'
+                  }
+                }, {
+                  children: filter === null || filter === void 0 ? void 0 : filter.subLabel
+                }), void 0)]
+              }, void 0), jsxs(Box, {
+                children: [jsx(Typography, Object.assign({
+                  component: "span",
+                  color: "secondary",
+                  sx: {
+                    fontWeight: 'bold',
+                    mr: 1
+                  }
+                }, {
+                  children: (_g = (_f = filter === null || filter === void 0 ? void 0 : filter.options) === null || _f === void 0 ? void 0 : _f[sliderValue === null || sliderValue === void 0 ? void 0 : sliderValue[0]]) === null || _g === void 0 ? void 0 : _g.label
+                }), void 0), "-", jsx(Typography, Object.assign({
+                  component: "span",
+                  color: "secondary",
+                  sx: {
+                    fontWeight: 'bold',
+                    ml: 1
+                  }
+                }, {
+                  children: (_j = (_h = filter === null || filter === void 0 ? void 0 : filter.options) === null || _h === void 0 ? void 0 : _h[sliderValue === null || sliderValue === void 0 ? void 0 : sliderValue[1]]) === null || _j === void 0 ? void 0 : _j.label
+                }), void 0)]
+              }, void 0)]
+            }), void 0), jsx(Slider, {
+              color: "secondary",
+              size: "small",
+              defaultValue: minMax,
+              getAriaLabel: () => filter.label,
+              value: sliderValue,
+              onChange: e => filter === null || filter === void 0 ? void 0 : filter.onSlide(e, filter.name),
+              valueLabelDisplay: "off",
+              marks: filter.options.map((opt, i) => ({
+                value: opt.value,
+                label: i === 0 ? opt.label : i === filter.options.length - 1 ? opt.label : null
+              })) || [],
+              step: null,
+              sx: {
+                '.MuiSlider-mark': {
+                  opacity: marks ? 0.8 : 0
+                },
+                '.MuiSlider-markLabel': {
+                  transform: 'none'
+                },
+                '.MuiSlider-markLabel[data-index="0"]': {
+                  marginLeft: '-5px'
+                },
+                [`.MuiSlider-markLabel[data-index="${filter.options.length - 1}"]`]: {
+                  marginRight: '-5px',
+                  left: 'auto !important',
+                  right: 0
+                }
+              },
+              min: minMax[0],
+              max: minMax[1],
+              disableSwap: true
+            }, void 0)]
+          }), filter === null || filter === void 0 ? void 0 : filter.name);
+        }
+
+      case 'checkbox':
+        {
+          const updateArray = value => {
+            const arr = filter.value;
+
+            if (arr.includes(value)) {
+              arr.splice(arr.indexOf(value), 1);
+            } else {
+              arr.push(value);
+            }
+
+            return arr;
+          };
+
+          return jsx(Box, {
+            children: jsxs(FormControl, Object.assign({
+              sx: {
+                mb: 2
+              },
+              component: "fieldset",
+              variant: "standard"
+            }, {
+              children: [jsx(FormLabel, Object.assign({
+                component: "legend"
+              }, {
+                children: filter.label
+              }), void 0), jsx(FormGroup, {
+                children: filter.options.map(({
+                  value,
+                  label
+                }) => {
+                  return jsx(FormControlLabel, {
+                    control: jsx(Checkbox, {
+                      checked: filter.value.includes(value),
+                      onChange: e => filter.onCheck(filter.name, updateArray(e.target.name)),
+                      name: value
+                    }, void 0),
+                    label: label
+                  }, value);
+                })
+              }, void 0)]
+            }), void 0)
+          }, filter === null || filter === void 0 ? void 0 : filter.name);
+        }
+
+      case 'radio':
+        {
+          return jsx(Box, {
+            children: jsxs(FormControl, Object.assign({
+              sx: {
+                mb: 2
+              },
+              component: "fieldset",
+              variant: "standard"
+            }, {
+              children: [jsx(FormLabel, Object.assign({
+                component: "legend"
+              }, {
+                children: filter.label
+              }), void 0), jsx(FormGroup, {
+                children: filter.options.map(({
+                  value,
+                  label
+                }) => {
+                  return jsx(FormControlLabel, {
+                    control: jsx(Checkbox, {
+                      checked: filter.value.includes(value),
+                      onChange: e => filter.onCheck(filter.name, e.target.name),
+                      name: value
+                    }, void 0),
+                    label: label
+                  }, value);
+                })
+              }, void 0)]
+            }), void 0)
+          }, filter === null || filter === void 0 ? void 0 : filter.name);
+        }
+
+      case 'minmax':
+        {
+          const updateValues = (i, value) => {
+            const arr = filter.value;
+            arr.splice(i, 1, parseInt(value));
+            return arr;
+          };
+
+          return jsx(Box, {
+            children: jsx(FormControl, Object.assign({
+              sx: {
+                mb: 2
+              }
+            }, {
+              children: jsxs(Stack, Object.assign({
+                direction: "row",
+                spacing: 2
+              }, {
+                children: [jsx(TextField, {
+                  inputProps: {
+                    inputMode: 'numeric',
+                    pattern: '[0-9]*'
+                  },
+                  label: `Min ${filter.label}`,
+                  value: filter.value[0] >= 0 ? filter.value[0] : '',
+                  onChange: e => filter.onChange(filter.name, updateValues(0, e.target.value))
+                }, void 0), jsx(TextField, {
+                  inputProps: {
+                    inputMode: 'numeric',
+                    pattern: '[0-9]*'
+                  },
+                  label: `Max ${filter.label}`,
+                  value: filter.value[1] >= 0 ? filter.value[1] : '',
+                  onChange: e => filter.onChange(filter.name, updateValues(1, e.target.value))
+                }, void 0)]
+              }), void 0)
+            }), void 0)
+          }, filter === null || filter === void 0 ? void 0 : filter.name);
+        }
+
+      default:
+        {
+          return jsx(Box, {}, void 0);
+        }
+    }
+  })]
+}), void 0);
+
+var global$5 = global$v;
+var aCallable = aCallable$2;
+var toObject$1 = toObject$4;
+var IndexedObject = indexedObject;
+var lengthOfArrayLike = lengthOfArrayLike$2;
+
+var TypeError$2 = global$5.TypeError;
+
+// `Array.prototype.{ reduce, reduceRight }` methods implementation
+var createMethod = function (IS_RIGHT) {
+  return function (that, callbackfn, argumentsLength, memo) {
+    aCallable(callbackfn);
+    var O = toObject$1(that);
+    var self = IndexedObject(O);
+    var length = lengthOfArrayLike(O);
+    var index = IS_RIGHT ? length - 1 : 0;
+    var i = IS_RIGHT ? -1 : 1;
+    if (argumentsLength < 2) while (true) {
+      if (index in self) {
+        memo = self[index];
+        index += i;
+        break;
+      }
+      index += i;
+      if (IS_RIGHT ? index < 0 : length <= index) {
+        throw TypeError$2('Reduce of empty array with no initial value');
+      }
+    }
+    for (;IS_RIGHT ? index >= 0 : length > index; index += i) if (index in self) {
+      memo = callbackfn(memo, self[index], index, O);
+    }
+    return memo;
+  };
+};
+
+var arrayReduce = {
+  // `Array.prototype.reduce` method
+  // https://tc39.es/ecma262/#sec-array.prototype.reduce
+  left: createMethod(false),
+  // `Array.prototype.reduceRight` method
+  // https://tc39.es/ecma262/#sec-array.prototype.reduceright
+  right: createMethod(true)
+};
+
+var fails$2 = fails$e;
+
+var arrayMethodIsStrict$1 = function (METHOD_NAME, argument) {
+  var method = [][METHOD_NAME];
+  return !!method && fails$2(function () {
+    // eslint-disable-next-line no-useless-call -- required for testing
+    method.call(null, argument || function () { return 1; }, 1);
+  });
+};
+
+var classof = classofRaw$1;
+var global$4 = global$v;
+
+var engineIsNode = classof(global$4.process) == 'process';
+
+var $$1 = _export;
+var $reduce = arrayReduce.left;
+var arrayMethodIsStrict = arrayMethodIsStrict$1;
+var CHROME_VERSION = engineV8Version;
+var IS_NODE = engineIsNode;
+
+var STRICT_METHOD = arrayMethodIsStrict('reduce');
+// Chrome 80-82 has a critical bug
+// https://bugs.chromium.org/p/chromium/issues/detail?id=1049982
+var CHROME_BUG = !IS_NODE && CHROME_VERSION > 79 && CHROME_VERSION < 83;
+
+// `Array.prototype.reduce` method
+// https://tc39.es/ecma262/#sec-array.prototype.reduce
+$$1({ target: 'Array', proto: true, forced: !STRICT_METHOD || CHROME_BUG }, {
+  reduce: function reduce(callbackfn /* , initialValue */) {
+    var length = arguments.length;
+    return $reduce(this, callbackfn, length, length > 1 ? arguments[1] : undefined);
+  }
+});
+
+let _ = t => t,
+    _t;
+
+const FontProvider = ({
+  fonts
+}) => {
+  return jsx(GlobalStyles, {
+    styles: theme => {
+      const fontFaces = fonts.reduce((acc, font) => {
+        return `${acc}@font-face { font-family: '${font.family}'; src: url('${font.url}') format('${font.type}'); }\n`;
+      }, '');
+      return css(_t || (_t = _`
+					${0}
+				`), fontFaces);
+    }
+  }, void 0);
+};
+
+const componentName$4 = 'FtuiHeader';
+
+function getHeaderUtilityClass(slot) {
+  return generateUtilityClass(componentName$4, slot);
+}
+generateUtilityClasses(componentName$4, ['root']);
+
+const useUtilityClasses$7 = () => {
+  const slots = {
+    root: ['root']
+  };
+  return unstable_composeClasses(slots, getHeaderUtilityClass, {});
+};
+
+const HeaderRoot = styled(AppBar, {
+  name: componentName$4,
+  slot: 'Root',
+  overridesResolver: styles => styles.root
+})(({
+  theme
+}) => ({
+  color: theme.palette.text.primary,
+  background: theme.palette.background.scroll
+}));
+const Header = function Header(inProps) {
+  const props = useThemeProps({
+    props: inProps,
+    name: componentName$4
+  });
+
+  const {
+    className,
+    children,
+    maxWidth = 'xl'
+  } = props,
+        other = __rest(props, ["className", "children", "maxWidth"]);
+
+  const ownerState = Object.assign({}, props);
+  const classes = useUtilityClasses$7();
+  return jsx(HeaderRoot, Object.assign({
+    className: clsx(classes.root, className),
+    ownerState: ownerState
+  }, other, {
+    children: jsx(Container, Object.assign({
+      maxWidth: maxWidth
+    }, {
+      children: jsx(Toolbar, {
+        children: children
+      }, void 0)
+    }), void 0)
+  }), void 0);
+};
+
+var iterators = {};
+
+var fails$1 = fails$e;
+
+var correctPrototypeGetter = !fails$1(function () {
+  function F() { /* empty */ }
+  F.prototype.constructor = null;
+  // eslint-disable-next-line es-x/no-object-getprototypeof -- required for testing
+  return Object.getPrototypeOf(new F()) !== F.prototype;
+});
+
+var global$3 = global$v;
+var hasOwn$1 = hasOwnProperty_1;
+var isCallable$3 = isCallable$g;
+var toObject = toObject$4;
+var sharedKey = sharedKey$3;
+var CORRECT_PROTOTYPE_GETTER = correctPrototypeGetter;
+
+var IE_PROTO = sharedKey('IE_PROTO');
+var Object$1 = global$3.Object;
+var ObjectPrototype = Object$1.prototype;
+
+// `Object.getPrototypeOf` method
+// https://tc39.es/ecma262/#sec-object.getprototypeof
+var objectGetPrototypeOf = CORRECT_PROTOTYPE_GETTER ? Object$1.getPrototypeOf : function (O) {
+  var object = toObject(O);
+  if (hasOwn$1(object, IE_PROTO)) return object[IE_PROTO];
+  var constructor = object.constructor;
+  if (isCallable$3(constructor) && object instanceof constructor) {
+    return constructor.prototype;
+  } return object instanceof Object$1 ? ObjectPrototype : null;
+};
+
+var fails = fails$e;
+var isCallable$2 = isCallable$g;
+var getPrototypeOf$1 = objectGetPrototypeOf;
+var defineBuiltIn$1 = defineBuiltIn$3;
+var wellKnownSymbol$3 = wellKnownSymbol$a;
+
+var ITERATOR$2 = wellKnownSymbol$3('iterator');
+var BUGGY_SAFARI_ITERATORS$1 = false;
+
+// `%IteratorPrototype%` object
+// https://tc39.es/ecma262/#sec-%iteratorprototype%-object
+var IteratorPrototype$2, PrototypeOfArrayIteratorPrototype, arrayIterator;
+
+/* eslint-disable es-x/no-array-prototype-keys -- safe */
+if ([].keys) {
+  arrayIterator = [].keys();
+  // Safari 8 has buggy iterators w/o `next`
+  if (!('next' in arrayIterator)) BUGGY_SAFARI_ITERATORS$1 = true;
+  else {
+    PrototypeOfArrayIteratorPrototype = getPrototypeOf$1(getPrototypeOf$1(arrayIterator));
+    if (PrototypeOfArrayIteratorPrototype !== Object.prototype) IteratorPrototype$2 = PrototypeOfArrayIteratorPrototype;
+  }
+}
+
+var NEW_ITERATOR_PROTOTYPE = IteratorPrototype$2 == undefined || fails(function () {
+  var test = {};
+  // FF44- legacy iterators case
+  return IteratorPrototype$2[ITERATOR$2].call(test) !== test;
+});
+
+if (NEW_ITERATOR_PROTOTYPE) IteratorPrototype$2 = {};
+
+// `%IteratorPrototype%[@@iterator]()` method
+// https://tc39.es/ecma262/#sec-%iteratorprototype%-@@iterator
+if (!isCallable$2(IteratorPrototype$2[ITERATOR$2])) {
+  defineBuiltIn$1(IteratorPrototype$2, ITERATOR$2, function () {
+    return this;
+  });
+}
+
+var iteratorsCore = {
+  IteratorPrototype: IteratorPrototype$2,
+  BUGGY_SAFARI_ITERATORS: BUGGY_SAFARI_ITERATORS$1
+};
+
+var defineProperty$1 = objectDefineProperty.f;
+var hasOwn = hasOwnProperty_1;
+var wellKnownSymbol$2 = wellKnownSymbol$a;
+
+var TO_STRING_TAG$1 = wellKnownSymbol$2('toStringTag');
+
+var setToStringTag$2 = function (target, TAG, STATIC) {
+  if (target && !STATIC) target = target.prototype;
+  if (target && !hasOwn(target, TO_STRING_TAG$1)) {
+    defineProperty$1(target, TO_STRING_TAG$1, { configurable: true, value: TAG });
+  }
+};
+
+var IteratorPrototype$1 = iteratorsCore.IteratorPrototype;
+var create = objectCreate;
+var createPropertyDescriptor = createPropertyDescriptor$3;
+var setToStringTag$1 = setToStringTag$2;
+var Iterators$2 = iterators;
+
+var returnThis$1 = function () { return this; };
+
+var createIteratorConstructor$1 = function (IteratorConstructor, NAME, next, ENUMERABLE_NEXT) {
+  var TO_STRING_TAG = NAME + ' Iterator';
+  IteratorConstructor.prototype = create(IteratorPrototype$1, { next: createPropertyDescriptor(+!ENUMERABLE_NEXT, next) });
+  setToStringTag$1(IteratorConstructor, TO_STRING_TAG, false);
+  Iterators$2[TO_STRING_TAG] = returnThis$1;
+  return IteratorConstructor;
+};
+
+var global$2 = global$v;
+var isCallable$1 = isCallable$g;
+
+var String$1 = global$2.String;
+var TypeError$1 = global$2.TypeError;
+
+var aPossiblePrototype$1 = function (argument) {
+  if (typeof argument == 'object' || isCallable$1(argument)) return argument;
+  throw TypeError$1("Can't set " + String$1(argument) + ' as a prototype');
+};
+
+/* eslint-disable no-proto -- safe */
+
+var uncurryThis = functionUncurryThis;
+var anObject = anObject$5;
+var aPossiblePrototype = aPossiblePrototype$1;
+
+// `Object.setPrototypeOf` method
+// https://tc39.es/ecma262/#sec-object.setprototypeof
+// Works with __proto__ only. Old v8 can't work with null proto objects.
+// eslint-disable-next-line es-x/no-object-setprototypeof -- safe
+var objectSetPrototypeOf = Object.setPrototypeOf || ('__proto__' in {} ? function () {
+  var CORRECT_SETTER = false;
+  var test = {};
+  var setter;
+  try {
+    // eslint-disable-next-line es-x/no-object-getownpropertydescriptor -- safe
+    setter = uncurryThis(Object.getOwnPropertyDescriptor(Object.prototype, '__proto__').set);
+    setter(test, []);
+    CORRECT_SETTER = test instanceof Array;
+  } catch (error) { /* empty */ }
+  return function setPrototypeOf(O, proto) {
+    anObject(O);
+    aPossiblePrototype(proto);
+    if (CORRECT_SETTER) setter(O, proto);
+    else O.__proto__ = proto;
+    return O;
+  };
+}() : undefined);
+
+var $ = _export;
+var call = functionCall;
+var FunctionName = functionName;
+var isCallable = isCallable$g;
+var createIteratorConstructor = createIteratorConstructor$1;
+var getPrototypeOf = objectGetPrototypeOf;
+var setPrototypeOf = objectSetPrototypeOf;
+var setToStringTag = setToStringTag$2;
+var createNonEnumerableProperty$1 = createNonEnumerableProperty$5;
+var defineBuiltIn = defineBuiltIn$3;
+var wellKnownSymbol$1 = wellKnownSymbol$a;
+var Iterators$1 = iterators;
+var IteratorsCore = iteratorsCore;
+
+var PROPER_FUNCTION_NAME = FunctionName.PROPER;
+var CONFIGURABLE_FUNCTION_NAME = FunctionName.CONFIGURABLE;
+var IteratorPrototype = IteratorsCore.IteratorPrototype;
+var BUGGY_SAFARI_ITERATORS = IteratorsCore.BUGGY_SAFARI_ITERATORS;
+var ITERATOR$1 = wellKnownSymbol$1('iterator');
+var KEYS = 'keys';
+var VALUES = 'values';
+var ENTRIES = 'entries';
+
+var returnThis = function () { return this; };
+
+var defineIterator$1 = function (Iterable, NAME, IteratorConstructor, next, DEFAULT, IS_SET, FORCED) {
+  createIteratorConstructor(IteratorConstructor, NAME, next);
+
+  var getIterationMethod = function (KIND) {
+    if (KIND === DEFAULT && defaultIterator) return defaultIterator;
+    if (!BUGGY_SAFARI_ITERATORS && KIND in IterablePrototype) return IterablePrototype[KIND];
+    switch (KIND) {
+      case KEYS: return function keys() { return new IteratorConstructor(this, KIND); };
+      case VALUES: return function values() { return new IteratorConstructor(this, KIND); };
+      case ENTRIES: return function entries() { return new IteratorConstructor(this, KIND); };
+    } return function () { return new IteratorConstructor(this); };
+  };
+
+  var TO_STRING_TAG = NAME + ' Iterator';
+  var INCORRECT_VALUES_NAME = false;
+  var IterablePrototype = Iterable.prototype;
+  var nativeIterator = IterablePrototype[ITERATOR$1]
+    || IterablePrototype['@@iterator']
+    || DEFAULT && IterablePrototype[DEFAULT];
+  var defaultIterator = !BUGGY_SAFARI_ITERATORS && nativeIterator || getIterationMethod(DEFAULT);
+  var anyNativeIterator = NAME == 'Array' ? IterablePrototype.entries || nativeIterator : nativeIterator;
+  var CurrentIteratorPrototype, methods, KEY;
+
+  // fix native
+  if (anyNativeIterator) {
+    CurrentIteratorPrototype = getPrototypeOf(anyNativeIterator.call(new Iterable()));
+    if (CurrentIteratorPrototype !== Object.prototype && CurrentIteratorPrototype.next) {
+      if (getPrototypeOf(CurrentIteratorPrototype) !== IteratorPrototype) {
+        if (setPrototypeOf) {
+          setPrototypeOf(CurrentIteratorPrototype, IteratorPrototype);
+        } else if (!isCallable(CurrentIteratorPrototype[ITERATOR$1])) {
+          defineBuiltIn(CurrentIteratorPrototype, ITERATOR$1, returnThis);
+        }
+      }
+      // Set @@toStringTag to native iterators
+      setToStringTag(CurrentIteratorPrototype, TO_STRING_TAG, true);
+    }
+  }
+
+  // fix Array.prototype.{ values, @@iterator }.name in V8 / FF
+  if (PROPER_FUNCTION_NAME && DEFAULT == VALUES && nativeIterator && nativeIterator.name !== VALUES) {
+    if (CONFIGURABLE_FUNCTION_NAME) {
+      createNonEnumerableProperty$1(IterablePrototype, 'name', VALUES);
+    } else {
+      INCORRECT_VALUES_NAME = true;
+      defaultIterator = function values() { return call(nativeIterator, this); };
+    }
+  }
+
+  // export additional methods
+  if (DEFAULT) {
+    methods = {
+      values: getIterationMethod(VALUES),
+      keys: IS_SET ? defaultIterator : getIterationMethod(KEYS),
+      entries: getIterationMethod(ENTRIES)
+    };
+    if (FORCED) for (KEY in methods) {
+      if (BUGGY_SAFARI_ITERATORS || INCORRECT_VALUES_NAME || !(KEY in IterablePrototype)) {
+        defineBuiltIn(IterablePrototype, KEY, methods[KEY]);
+      }
+    } else $({ target: NAME, proto: true, forced: BUGGY_SAFARI_ITERATORS || INCORRECT_VALUES_NAME }, methods);
+  }
+
+  // define iterator
+  if (IterablePrototype[ITERATOR$1] !== defaultIterator) {
+    defineBuiltIn(IterablePrototype, ITERATOR$1, defaultIterator, { name: DEFAULT });
+  }
+  Iterators$1[NAME] = defaultIterator;
+
+  return methods;
+};
+
+var toIndexedObject = toIndexedObject$5;
+var addToUnscopables = addToUnscopables$2;
+var Iterators = iterators;
+var InternalStateModule = internalState;
+var defineProperty = objectDefineProperty.f;
+var defineIterator = defineIterator$1;
+var DESCRIPTORS = descriptors;
+
+var ARRAY_ITERATOR = 'Array Iterator';
+var setInternalState = InternalStateModule.set;
+var getInternalState = InternalStateModule.getterFor(ARRAY_ITERATOR);
+
+// `Array.prototype.entries` method
+// https://tc39.es/ecma262/#sec-array.prototype.entries
+// `Array.prototype.keys` method
+// https://tc39.es/ecma262/#sec-array.prototype.keys
+// `Array.prototype.values` method
+// https://tc39.es/ecma262/#sec-array.prototype.values
+// `Array.prototype[@@iterator]` method
+// https://tc39.es/ecma262/#sec-array.prototype-@@iterator
+// `CreateArrayIterator` internal method
+// https://tc39.es/ecma262/#sec-createarrayiterator
+var es_array_iterator = defineIterator(Array, 'Array', function (iterated, kind) {
+  setInternalState(this, {
+    type: ARRAY_ITERATOR,
+    target: toIndexedObject(iterated), // target
+    index: 0,                          // next index
+    kind: kind                         // kind
+  });
+// `%ArrayIteratorPrototype%.next` method
+// https://tc39.es/ecma262/#sec-%arrayiteratorprototype%.next
+}, function () {
+  var state = getInternalState(this);
+  var target = state.target;
+  var kind = state.kind;
+  var index = state.index++;
+  if (!target || index >= target.length) {
+    state.target = undefined;
+    return { value: undefined, done: true };
+  }
+  if (kind == 'keys') return { value: index, done: false };
+  if (kind == 'values') return { value: target[index], done: false };
+  return { value: [index, target[index]], done: false };
+}, 'values');
+
+// argumentsList[@@iterator] is %ArrayProto_values%
+// https://tc39.es/ecma262/#sec-createunmappedargumentsobject
+// https://tc39.es/ecma262/#sec-createmappedargumentsobject
+var values = Iterators.Arguments = Iterators.Array;
+
+// https://tc39.es/ecma262/#sec-array.prototype-@@unscopables
+addToUnscopables('keys');
+addToUnscopables('values');
+addToUnscopables('entries');
+
+// V8 ~ Chrome 45- bug
+if (DESCRIPTORS && values.name !== 'values') try {
+  defineProperty(values, 'name', { value: 'values' });
+} catch (error) { /* empty */ }
+
+// iterable DOM collections
+// flag - `iterable` interface - 'entries', 'keys', 'values', 'forEach' methods
+var domIterables = {
+  CSSRuleList: 0,
+  CSSStyleDeclaration: 0,
+  CSSValueList: 0,
+  ClientRectList: 0,
+  DOMRectList: 0,
+  DOMStringList: 0,
+  DOMTokenList: 1,
+  DataTransferItemList: 0,
+  FileList: 0,
+  HTMLAllCollection: 0,
+  HTMLCollection: 0,
+  HTMLFormElement: 0,
+  HTMLSelectElement: 0,
+  MediaList: 0,
+  MimeTypeArray: 0,
+  NamedNodeMap: 0,
+  NodeList: 1,
+  PaintRequestList: 0,
+  Plugin: 0,
+  PluginArray: 0,
+  SVGLengthList: 0,
+  SVGNumberList: 0,
+  SVGPathSegList: 0,
+  SVGPointList: 0,
+  SVGStringList: 0,
+  SVGTransformList: 0,
+  SourceBufferList: 0,
+  StyleSheetList: 0,
+  TextTrackCueList: 0,
+  TextTrackList: 0,
+  TouchList: 0
+};
+
+// in old WebKit versions, `element.classList` is not an instance of global `DOMTokenList`
+var documentCreateElement = documentCreateElement$2;
+
+var classList = documentCreateElement('span').classList;
+var DOMTokenListPrototype$1 = classList && classList.constructor && classList.constructor.prototype;
+
+var domTokenListPrototype = DOMTokenListPrototype$1 === Object.prototype ? undefined : DOMTokenListPrototype$1;
+
+var global$1 = global$v;
+var DOMIterables = domIterables;
+var DOMTokenListPrototype = domTokenListPrototype;
+var ArrayIteratorMethods = es_array_iterator;
+var createNonEnumerableProperty = createNonEnumerableProperty$5;
+var wellKnownSymbol = wellKnownSymbol$a;
+
+var ITERATOR = wellKnownSymbol('iterator');
+var TO_STRING_TAG = wellKnownSymbol('toStringTag');
+var ArrayValues = ArrayIteratorMethods.values;
+
+var handlePrototype = function (CollectionPrototype, COLLECTION_NAME) {
+  if (CollectionPrototype) {
+    // some Chrome versions have non-configurable methods on DOMTokenList
+    if (CollectionPrototype[ITERATOR] !== ArrayValues) try {
+      createNonEnumerableProperty(CollectionPrototype, ITERATOR, ArrayValues);
+    } catch (error) {
+      CollectionPrototype[ITERATOR] = ArrayValues;
+    }
+    if (!CollectionPrototype[TO_STRING_TAG]) {
+      createNonEnumerableProperty(CollectionPrototype, TO_STRING_TAG, COLLECTION_NAME);
+    }
+    if (DOMIterables[COLLECTION_NAME]) for (var METHOD_NAME in ArrayIteratorMethods) {
+      // some Chrome versions have non-configurable methods on DOMTokenList
+      if (CollectionPrototype[METHOD_NAME] !== ArrayIteratorMethods[METHOD_NAME]) try {
+        createNonEnumerableProperty(CollectionPrototype, METHOD_NAME, ArrayIteratorMethods[METHOD_NAME]);
+      } catch (error) {
+        CollectionPrototype[METHOD_NAME] = ArrayIteratorMethods[METHOD_NAME];
+      }
+    }
+  }
+};
+
+for (var COLLECTION_NAME in DOMIterables) {
+  handlePrototype(global$1[COLLECTION_NAME] && global$1[COLLECTION_NAME].prototype, COLLECTION_NAME);
+}
+
+handlePrototype(DOMTokenListPrototype, 'DOMTokenList');
+
+const componentName$3 = 'FtuiHeaderButtonBar';
+
+function getHeaderButtonBarUtilityClass(slot) {
+  return generateUtilityClass(componentName$3, slot);
+}
+generateUtilityClasses(componentName$3, ['root', 'menu']);
+
+const useUtilityClasses$6 = ownerState => {
+  const slots = {
+    root: ['root'],
+    menu: ['menu']
+  };
+  return unstable_composeClasses(slots, getHeaderButtonBarUtilityClass, {});
+};
+
+const HeaderButtonBarMenu = styled(Menu, {
+  name: componentName$3,
+  slot: 'Menu',
+  overridesResolver: (props, styles) => styles.button
+})(({
+  theme,
+  ownerState
+}) => ({
+  [`.MuiPaper-root`]: {
+    background: theme.palette.background.scroll,
+    color: theme.palette.secondary.main,
+    fontSize: 15
+  }
+}));
+
+const mobileChildrenWithOnClick = (children, onClick) => {
+  return React.Children.map(children, child => {
+    if ( /*#__PURE__*/React.isValidElement(child)) {
+      return /*#__PURE__*/React.createElement(MenuItem, Object.assign(Object.assign({}, child.props), {
+        onClick: () => {
+          if (typeof child.props.onClick === 'function') {
+            child.props.onClick();
+          }
+
+          onClick();
+        }
+      }));
+    }
+  });
+};
+
+const HeaderButtonBarRoot = styled('div', {
+  name: componentName$3,
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => ({
+  [`.MuiButton-root`]: {
+    color: theme.palette.secondary.main,
+    borderColor: theme.palette.secondary.main,
+    fontSize: 15,
+    [`&:hover`]: {
+      borderColor: theme.palette.secondary.dark
+    }
+  }
+}));
+const HeaderButtonBar = /*#__PURE__*/React.forwardRef(function HeaderButtonBar(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: componentName$3
+  });
+
+  const {
+    className,
+    component = 'div',
+    children,
+    componentsProps = {}
+  } = props,
+        other = __rest(props, ["className", "component", "children", "componentsProps"]);
+
+  const ComponentProp = component;
+  const ownerState = Object.assign(Object.assign({}, props), {
+    component
+  });
+  const classes = useUtilityClasses$6();
+  const [mobileMoreAnchorEl, setMobileMoreAnchorEl] = React.useState(null);
+  const isMobileMenuOpen = Boolean(mobileMoreAnchorEl);
+
+  const handleMobileMenuOpen = event => {
+    setMobileMoreAnchorEl(event.currentTarget);
+  };
+
+  const handleMobileMenuClose = () => {
+    setMobileMoreAnchorEl(null);
+  };
+
+  const mobileMenuId = 'header-button-bar-mobile-menu';
+
+  const renderMobileMenu = jsx(HeaderButtonBarMenu, Object.assign({}, componentsProps.menu, {
+    ownerState: ownerState,
+    id: mobileMenuId,
+    anchorEl: mobileMoreAnchorEl,
+    anchorOrigin: {
+      vertical: 'bottom',
+      horizontal: 'left'
+    },
+    keepMounted: true,
+    transformOrigin: {
+      vertical: 'top',
+      horizontal: 'left'
+    },
+    open: isMobileMenuOpen,
+    onClose: handleMobileMenuClose
+  }, {
+    children: mobileChildrenWithOnClick(children, handleMobileMenuClose)
+  }), void 0);
+
+  return jsxs(HeaderButtonBarRoot, Object.assign({
+    as: ComponentProp,
+    className: clsx(classes.root, className),
+    ownerState: ownerState
+  }, other, {
+    children: [jsx(Box, Object.assign({
+      sx: {
+        display: {
+          xs: 'none',
+          md: 'flex'
+        }
+      }
+    }, {
+      children: children
+    }), void 0), jsx(Box, Object.assign({
+      sx: {
+        display: {
+          xs: 'flex',
+          md: 'none'
+        }
+      }
+    }, {
+      children: jsx(IconButton, Object.assign({
+        size: "large",
+        "aria-label": "show more",
+        "aria-controls": mobileMenuId,
+        "aria-haspopup": "true",
+        onClick: handleMobileMenuOpen
+      }, {
+        children: jsx(MoreIcon, {}, void 0)
+      }), void 0)
+    }), void 0), renderMobileMenu]
+  }), void 0);
+});
+
+const componentName$2 = 'FtuiHeaderTitle';
+
+function getHeaderTitleUtilityClass(slot) {
+  return generateUtilityClass(componentName$2, slot);
+}
+generateUtilityClasses(componentName$2, ['root', 'button', 'menu']);
+
+const useUtilityClasses$5 = ownerState => {
+  const slots = {
+    root: ['root'],
+    button: ['button'],
+    menu: ['menu']
+  };
+  return unstable_composeClasses(slots, getHeaderTitleUtilityClass, {});
+};
+
+const HeaderTitleButton = styled(Button, {
+  name: componentName$2,
+  slot: 'Button',
+  overridesResolver: (props, styles) => styles.button
+})(({
+  theme,
+  ownerState
+}) => ({
+  fontWeight: 700,
+  fontSize: 28,
+  textTransform: 'none'
+}));
+const HeaderTitleMenu = styled(Menu, {
+  name: componentName$2,
+  slot: 'Menu',
+  overridesResolver: (props, styles) => styles.button
+})(({
+  theme,
+  ownerState
+}) => ({
+  [`.MuiPaper-root`]: {
+    background: theme.palette.background.scroll
+  }
+}));
+
+const childrenWithOnClick = (children, onClick) => {
+  return React.Children.map(children, child => {
+    if ( /*#__PURE__*/React.isValidElement(child)) {
+      return /*#__PURE__*/React.cloneElement(child, {
+        onClick: () => {
+          if (typeof child.props.onClick === 'function') {
+            child.props.onClick();
+          }
+
+          onClick();
+        }
+      });
+    }
+  });
+};
+
+const HeaderTitleRoot = styled('div', {
+  name: componentName$2,
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => ({
+  color: theme.palette.text.primary,
+  flexGrow: 1
+}));
+const HeaderTitle = /*#__PURE__*/React.forwardRef(function HeaderTitle(inProps, ref) {
+  var _a;
+
+  const props = useThemeProps({
+    props: inProps,
+    name: componentName$2
+  });
+
+  const {
+    className,
+    component = 'div',
+    componentsProps = {},
+    label,
+    children
+  } = props,
+        other = __rest(props, ["className", "component", "componentsProps", "label", "children"]);
+
+  const ComponentProp = component;
+  const ownerState = Object.assign(Object.assign({}, props), {
+    component
+  });
+  const classes = useUtilityClasses$5();
+  const [anchorEl, setAnchorEl] = React.useState(null);
+  const isMenuOpen = Boolean(anchorEl);
+
+  const handleMenuOpen = event => {
+    setAnchorEl(event.currentTarget);
+  };
+
+  const handleMenuClose = () => {
+    setAnchorEl(null);
+  };
+
+  const menuId = 'header-title-menu';
+
+  const renderMenu = jsx(HeaderTitleMenu, Object.assign({}, componentsProps.menu, {
+    ownerState: ownerState,
+    id: menuId,
+    anchorEl: anchorEl,
+    anchorOrigin: {
+      vertical: 'bottom',
+      horizontal: 'left'
+    },
+    keepMounted: true,
+    transformOrigin: {
+      vertical: 'top',
+      horizontal: 'left'
+    },
+    open: isMenuOpen,
+    onClose: handleMenuClose
+  }, {
+    children: childrenWithOnClick(children, handleMenuClose)
+  }), void 0);
+
+  return jsxs(HeaderTitleRoot, Object.assign({
+    as: ComponentProp,
+    className: clsx(classes.root, className),
+    ownerState: ownerState
+  }, other, {
+    children: [jsx(HeaderTitleButton, Object.assign({}, componentsProps.button, {
+      ownerState: ownerState,
+      className: clsx(classes.button, (_a = componentsProps.button) === null || _a === void 0 ? void 0 : _a.className),
+      "aria-controls": isMenuOpen ? menuId : undefined,
+      "aria-haspopup": "true",
+      "aria-expanded": isMenuOpen ? 'true' : undefined,
+      variant: "text",
+      disableElevation: true,
+      onClick: handleMenuOpen,
+      endIcon: jsx(ArrowDropDownIcon, {}, void 0)
+    }, {
+      children: label
+    }), void 0), renderMenu]
+  }), void 0);
+});
+
+function getInfoItemUtilityClass(slot) {
+  return generateUtilityClass('FtuiInfoItem', slot);
+}
+const infoItemClasses = generateUtilityClasses('FtuiInfoItem', ['root', 'label', 'align', 'color', 'italic', 'inline']);
+
+const useUtilityClasses$4 = ownerState => {
+  const {
+    align,
+    color,
+    labelProps
+  } = ownerState;
+  const slots = {
+    root: ['root', color && 'color', (labelProps === null || labelProps === void 0 ? void 0 : labelProps.inline) && 'inline'],
+    label: ['label', align && 'align', color && 'color', (labelProps === null || labelProps === void 0 ? void 0 : labelProps.inline) && 'inline', (labelProps === null || labelProps === void 0 ? void 0 : labelProps.italic) && 'italic'],
+    content: ['content', color && 'color']
+  };
+  return unstable_composeClasses(slots, getInfoItemUtilityClass, {});
+};
+
+const InfoItemRoot = styled('div', {
+  name: 'FtuiInfoItem',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => {
+  return {
+    display: 'block'
+  };
+});
+const InfoItemLabel = styled(Typography, {
+  name: 'FtuiInfoItem',
+  slot: 'Label',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => {
+  return {
+    color: theme.palette.text.primary,
+    display: 'block',
+    fontSize: theme.typography.body1.fontSize,
+    fontWeight: theme.typography.fontWeightBold,
+    marginRight: 0,
+    [`&.${infoItemClasses.color}`]: {
+      color: getThemeValue(theme, ownerState.color)
+    },
+    [`&.${infoItemClasses.inline}`]: {
+      display: 'inline-block',
+      fontSize: theme.typography.body2.fontSize,
+      marginRight: 5
+    },
+    [`&.${infoItemClasses.italic}`]: {
+      fontStyle: 'italic'
+    }
+  };
+});
+const InfoItemContent = styled('div', {
+  name: 'FtuiInfoItem',
+  slot: 'Content',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => {
+  return {
+    color: theme.palette.text.secondary,
+    display: 'inline-block',
+    fontSize: theme.typography.body2.fontSize,
+    [`svg`]: {
+      verticalAlign: 'bottom'
+    },
+    [`&.${infoItemClasses.color}`]: {
+      color: getThemeValue(theme, ownerState.color)
+    },
+    [`&.${infoItemClasses.inline}:not(.${infoItemClasses.color})`]: {
+      color: theme.palette.text.primary
+    }
+  };
+});
+const InfoItem = /*#__PURE__*/React.forwardRef(function InfoItem(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'FtuiInfoItem'
+  });
+
+  const {
+    children,
+    className,
+    color,
+    label,
+    labelProps
+  } = props,
+        other = __rest(props, ["children", "className", "color", "label", "labelProps"]);
+
+  const ownerState = Object.assign(Object.assign({}, props), {
+    color,
+    labelProps
+  });
+  const classes = useUtilityClasses$4(ownerState);
+  return jsxs(InfoItemRoot, Object.assign({
+    className: clsx(classes.root, className),
+    ownerState: ownerState
+  }, other, {
+    children: [jsx(InfoItemLabel, Object.assign({
+      as: "span",
+      className: clsx(classes.label, className),
+      ownerState: ownerState
+    }, other, {
+      children: label
+    }), void 0), typeof children === 'string' ? jsx(InfoItemContent, {
+      className: clsx(classes.content, className),
+      ownerState: ownerState,
+      dangerouslySetInnerHTML: {
+        __html: children
+      }
+    }, void 0) : jsx(InfoItemContent, {
+      className: clsx(classes.content, className),
+      ownerState: ownerState,
+      children: children
+    }, void 0)]
+  }), void 0);
+});
+
+const InfoItemList = ({
+  items: _items = [],
+  inline: _inline = true
+}) => jsx(Fragment, {
+  children: _items.map(({
+    label,
+    children
+  }, i) => jsx(InfoItem, Object.assign({
+    label: label,
+    labelProps: {
+      inline: _inline
+    }
+  }, {
+    children: children
+  }), i))
+}, void 0);
+
+const TooltipBox = styled(Box$1)(({
+  theme
+}) => Object.assign(Object.assign({}, theme.typography.body2), {
+  alignItems: 'center',
+  background: theme.palette.grey[700],
+  borderRadius: '2px',
+  color: theme.palette.primary.contrastText,
+  display: 'flex',
+  flexDirection: 'row',
+  margin: theme.spacing(0.5, 0),
+  padding: theme.spacing(0.75, 1.5),
+  textAlign: 'center'
+}));
+const TextChip = styled(Chip$1)(({
+  theme
+}) => ({
+  borderRadius: theme.shape.borderRadius,
+  backgroundColor: theme.palette.action.selected,
+  height: 'auto',
+  ':hover': {
+    backgroundColor: theme.palette.action.focus
+  },
+  '& .MuiChip-label': Object.assign(Object.assign({}, theme.typography.caption), {
+    padding: theme.spacing(0, 0.8125)
+  })
+}));
+const LabelChip = _a => {
+  var {
+    tooltip
+  } = _a,
+      props = __rest(_a, ["tooltip"]);
+
+  return tooltip ? jsx(Tooltip, Object.assign({
+    title: tooltip,
+    components: {
+      Tooltip: TooltipBox
+    }
+  }, {
+    children: jsx(TextChip, Object.assign({
+      size: "small"
+    }, props), void 0)
+  }), void 0) : jsx(TextChip, Object.assign({
+    size: "small"
+  }, props), void 0);
+};
+
+const componentName$1 = 'FtuiPaywallScrollBlock';
+
+function getPaywallScrollBlockUtilityClass(slot) {
+  return generateUtilityClass(componentName$1, slot);
+}
+generateUtilityClasses(componentName$1, ['root']);
+
+function getScrollUtilityClass(slot) {
+  return generateUtilityClass('FtuiScroll', slot);
+}
+generateUtilityClasses('FtuiScroll', ['root']);
+
+const useUtilityClasses$3 = ownerState => {
+  const slots = {
+    root: ['root']
+  };
+  return unstable_composeClasses(slots, getScrollUtilityClass, ownerState.classes);
+};
+
+const ScrollRoot = styled(Paper, {
+  name: 'FtuiScroll',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => {
+  return {
+    borderTop: `3px solid ${getThemeValue(theme, ownerState.color) || theme.palette.grey[700]}`,
+    borderLeft: `none`,
+    borderRight: `none`,
+    borderBottom: `2px solid ${getThemeValue(theme, ownerState.color) || theme.palette.grey[700]}`,
+    borderRadius: `0`,
+    background: `linear-gradient(to right, transparent 4px, ${getThemeValue(theme, 'background.scroll')} 4px, ${getThemeValue(theme, 'background.scroll')} calc(100% - 4px), transparent 4px)`,
+    padding: `16px`
+  };
+});
+const Scroll = /*#__PURE__*/React.forwardRef(function Scroll(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'FtuiScroll'
+  });
+
+  const {
+    className,
+    color,
+    component = 'div'
+  } = props,
+        other = __rest(props, ["className", "color", "component"]);
+
+  const ownerState = Object.assign(Object.assign({}, props), {
+    color,
+    component
+  });
+  const classes = useUtilityClasses$3(ownerState);
+  return jsx(ScrollRoot, Object.assign({
+    className: clsx(classes.root, className),
+    component: component,
+    ownerState: ownerState,
+    elevation: 0
+  }, other, {
+    children: props.children
+  }), void 0);
+});
+
+function getScrollBlockUtilityClass(slot) {
+  return generateUtilityClass('FtuiScrollBlock', slot);
+}
+generateUtilityClasses('FtuiScrollBlock', ['root']);
+
+const useUtilityClasses$2 = ownerState => unstable_composeClasses({
+  root: ['root'],
+  header: ['header'],
+  title: ['title'],
+  subtitle: ['subtitle'],
+  detailButton: ['detailButton'],
+  footer: ['footer']
+}, getScrollBlockUtilityClass, ownerState.classes);
+
+const ScrollBlockRoot = styled(Card, {
+  name: 'FtuiScrollBlock',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => ({
+  background: 'none',
+  maxWidth: 656
+}));
+const ScrollBlockHeader = styled(CardHeader, {
+  name: 'FtuiScrollBlock',
+  slot: 'Header',
+  overridesResolver: (props, styles) => styles.header
+})(({
+  theme,
+  ownerState
+}) => ({
+  [`.FtuiScrollBlock-title`]: {
+    display: `inline-block`
+  },
+  [`.MuiCardHeader-action`]: {
+    alignSelf: 'flex-end'
+  }
+}));
+const ScrollBlockTitle = styled(Typography, {
+  name: 'FtuiScrollBlock',
+  slot: 'Title',
+  overridesResolver: (props, styles) => styles.title
+})(({
+  theme,
+  ownerState
+}) => ({
+  fontWeight: 700
+}));
+const ScrollBlockSubtitle = styled(Typography, {
+  name: 'FtuiScrollBlock',
+  slot: 'Subtitle',
+  overridesResolver: (props, styles) => styles.subtitle
+})(({
+  theme,
+  ownerState
+}) => ({
+  fontSize: 12,
+  fontStyle: `italic`
+}));
+const ScrollBlockDetailButton = styled(Button, {
+  name: 'FtuiScrollBlock',
+  slot: 'DetailButton',
+  overridesResolver: (props, styles) => styles.detailButton
+})(({
+  theme,
+  ownerState
+}) => ({}));
+const ScrollBlockContent = styled(CardContent, {
+  name: 'FtuiScrollBlock',
+  slot: 'Content',
+  overridesResolver: (props, styles) => styles.content
+})(({
+  theme,
+  ownerState
+}) => ({
+  paddingTop: 0,
+  paddingBottom: 0
+}));
+const ScrollBlockFooter = styled(CardActions, {
+  name: 'FtuiScrollBlock',
+  slot: 'Footer',
+  overridesResolver: (props, styles) => styles.footer
+})(({
+  theme,
+  ownerState
+}) => ({
+  padding: '8px 32px 16px',
+  display: 'flex',
+  justifyContent: 'space-between',
+  fontStyle: 'italic'
+}));
+const ScrollBlock = /*#__PURE__*/React.forwardRef(function ScrollBlock(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'FtuiScrollBlock'
+  });
+
+  const {
+    className,
+    color,
+    component = 'div',
+    detailUrl,
+    notes,
+    pronunciation,
+    source,
+    subtitle = '',
+    title = ''
+  } = props,
+        other = __rest(props, ["className", "color", "component", "detailUrl", "notes", "pronunciation", "source", "subtitle", "title"]);
+
+  const ownerState = Object.assign(Object.assign({}, props), {
+    color,
+    component,
+    subtitle,
+    title
+  });
+  const classes = useUtilityClasses$2(ownerState);
+  const [playing, setPlaying] = useState(false);
+  const audio = useMemo(() => new Audio(pronunciation), [pronunciation]);
+
+  audio.onplay = () => setPlaying(true);
+
+  audio.onended = () => setPlaying(false);
+
+  return jsxs(ScrollBlockRoot, Object.assign({
+    className: clsx(classes.root, className),
+    component: component,
+    ownerState: ownerState,
+    elevation: 0
+  }, other, {
+    children: [jsx(ScrollBlockHeader, {
+      disableTypography: true,
+      title: jsxs(Fragment, {
+        children: [jsx(ScrollBlockTitle, Object.assign({
+          component: "h2",
+          variant: "h3",
+          gutterBottom: false,
+          className: clsx(classes.title, className),
+          ownerState: ownerState
+        }, {
+          children: title
+        }), void 0), pronunciation && jsx(IconButton, Object.assign({
+          size: "small",
+          sx: {
+            margin: `-10px 0 0 2px`
+          },
+          onClick: () => audio.play(),
+          disabled: playing
+        }, {
+          children: jsx(VolumeUpIcon, {}, void 0)
+        }), void 0)]
+      }, void 0),
+      subheader: jsx(ScrollBlockSubtitle, Object.assign({
+        component: "p",
+        variant: "subtitle1",
+        color: "text.secondary",
+        gutterBottom: false,
+        className: clsx(classes.subtitle, className),
+        ownerState: ownerState
+      }, {
+        children: subtitle
+      }), void 0),
+      action: detailUrl && jsx(ScrollBlockDetailButton, Object.assign({
+        component: "a",
+        color: "secondary",
+        href: detailUrl,
+        className: clsx(classes.detailButton, className),
+        ownerState: ownerState
+      }, {
+        children: "View Details"
+      }), void 0),
+      className: clsx(classes.header, className),
+      component: component,
+      ownerState: ownerState
+    }, void 0), jsx(ScrollBlockContent, Object.assign({
+      className: clsx(classes.header, className),
+      component: component,
+      ownerState: ownerState
+    }, {
+      children: jsx(Scroll, Object.assign({
+        color: color
+      }, {
+        children: props.children
+      }), void 0)
+    }), void 0), jsxs(ScrollBlockFooter, Object.assign({
+      component: "footer",
+      className: clsx(classes.header, className),
+      ownerState: ownerState
+    }, {
+      children: [notes && jsxs(Typography, Object.assign({
+        variant: "body2",
+        color: "text.secondary"
+      }, {
+        children: ["Notes: ", notes]
+      }), void 0), source && jsxs(Typography, Object.assign({
+        variant: "body2",
+        color: "text.secondary"
+      }, {
+        children: ["Source: ", source]
+      }), void 0)]
+    }), void 0)]
+  }), void 0);
+});
+
+/**
+ * Build classes for slots based on props
+ */
+
+const useUtilityClasses$1 = ownerState => {
+  const slots = {
+    root: ['root'],
+    sourceImage: ['sourceImage'],
+    sourceTitle: ['sourceTitle'],
+    sourceDescription: ['sourceDescription']
+  };
+  return unstable_composeClasses(slots, getPaywallScrollBlockUtilityClass, {});
+};
+/**
+ * Root component and overrides
+ */
+
+
+const PaywallScrollBlockRoot = styled(ScrollBlock, {
+  name: componentName$1,
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => ({}));
+/**
+ * Source Image component and overrides
+ */
+
+const PaywallScrollBlockSourceImage = styled('img', {
+  name: componentName$1,
+  slot: 'SourceImage',
+  overridesResolver: (props, styles) => styles.sourceImage
+})(() => ({
+  maxWidth: '100%',
+  display: 'block',
+  margin: '0 auto'
+}));
+/**
+ * Source Title component and overrides
+ */
+
+const PaywallScrollBlockSourceTitle = styled(Typography, {
+  name: componentName$1,
+  slot: 'SourceTitle',
+  overridesResolver: (props, styles) => styles.sourceTitle
+})(({
+  theme
+}) => ({
+  fontFamily: theme.typography.fontFamily,
+  fontWeight: theme.typography.fontWeightBold,
+  fontSize: theme.typography.h4.fontSize,
+  fontStyle: 'italic',
+  marginBottom: 30
+}));
+/**
+ * Source Description component and overrides
+ */
+
+const PaywallScrollBlockSourceDescription = styled('p', {
+  name: componentName$1,
+  slot: 'SourceDescription',
+  overridesResolver: (props, styles) => styles.sourceDescription
+})(({
+  theme
+}) => ({
+  fontSize: theme.typography.body2.fontSize,
+  fontWeight: theme.typography.fontWeightBold,
+  letterSpacing: '0.46px',
+  marginBottom: 30
+}));
+/**
+ * Create component to be
+ */
+
+const PaywallScrollBlock = /*#__PURE__*/React.forwardRef(function PaywallScrollBlock(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: componentName$1
+  });
+
+  const {
+    className,
+    name,
+    description,
+    color,
+    sourceImage,
+    sourceTitle,
+    sourceDescription,
+    sourceLink
+  } = props,
+        other = __rest(props, ["className", "name", "description", "color", "sourceImage", "sourceTitle", "sourceDescription", "sourceLink"]);
+
+  const ownerState = props;
+  const classes = useUtilityClasses$1();
+  return jsx(PaywallScrollBlockRoot, Object.assign({
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    title: name,
+    subtitle: description,
+    color: color
+  }, other, {
+    children: jsxs(Grid, Object.assign({
+      container: true,
+      rowSpacing: 2,
+      columnSpacing: 2
+    }, {
+      children: [jsx(Grid, Object.assign({
+        item: true,
+        xs: 12,
+        sm: 4
+      }, {
+        children: jsx("a", Object.assign({
+          href: sourceLink
+        }, {
+          children: jsx(PaywallScrollBlockSourceImage, {
+            className: clsx(classes.sourceImage, className),
+            src: sourceImage,
+            alt: sourceTitle,
+            ownerState: ownerState
+          }, void 0)
+        }), void 0)
+      }), void 0), jsxs(Grid, Object.assign({
+        item: true,
+        xs: 12,
+        sm: 8
+      }, {
+        children: [jsx(PaywallScrollBlockSourceTitle, Object.assign({
+          className: clsx(classes.sourceTitle, className),
+          ownerState: ownerState
+        }, {
+          children: sourceTitle
+        }), void 0), jsx(PaywallScrollBlockSourceDescription, Object.assign({
+          className: clsx(classes.sourceDescription, className),
+          ownerState: ownerState
+        }, {
+          children: sourceDescription
+        }), void 0), jsx(Button, Object.assign({
+          component: "a",
+          href: sourceLink,
+          variant: "contained",
+          color: "secondary"
+        }, {
+          children: "View Purchase Options"
+        }), void 0)]
+      }), void 0)]
+    }), void 0)
+  }), void 0);
+});
+
+const componentName = 'FtuiSampleComponent';
+
+function getSampleComponentUtilityClass(slot) {
+  return generateUtilityClass(componentName, slot);
+}
+const sampleComponentClasses = generateUtilityClasses(componentName, ['root', 'fullWidth', 'text']);
+
+const useUtilityClasses = ownerState => {
+  const {
+    fullWidth
+  } = ownerState;
+  const slots = {
+    root: ['root'],
+    text: ['text', fullWidth && 'fullWidth']
+  };
+  return unstable_composeClasses(slots, getSampleComponentUtilityClass, {});
+};
+
+const SampleComponentText = styled('span', {
+  name: componentName,
+  slot: 'Text',
+  overridesResolver: (props, styles) => styles.text
+})(() => ({
+  fontStyle: 'italic',
+  [`&.${sampleComponentClasses.fullWidth}`]: {
+    display: 'block'
+  }
+}));
+const SampleComponentRoot = styled('div', {
+  name: componentName,
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme,
+  ownerState
+}) => ({
+  color: theme.palette.text.primary
+}));
+const SampleComponent = /*#__PURE__*/React.forwardRef(function SampleComponent(inProps, ref) {
+  var _a;
+
+  const props = useThemeProps({
+    props: inProps,
+    name: componentName
+  });
+
+  const {
+    className,
+    component = 'div',
+    variant = 'contained',
+    fullWidth = false,
+    componentsProps = {}
+  } = props,
+        other = __rest(props, ["className", "component", "variant", "fullWidth", "componentsProps"]);
+
+  const ComponentProp = component;
+  const ownerState = Object.assign(Object.assign({}, props), {
+    component,
+    fullWidth,
+    variant
+  });
+  const classes = useUtilityClasses(ownerState);
+  return jsx(SampleComponentRoot, Object.assign({
+    as: ComponentProp,
+    className: clsx(classes.root, className),
+    ownerState: ownerState
+  }, other, {
+    children: jsx(SampleComponentText, Object.assign({}, componentsProps.text, {
+      ownerState: ownerState,
+      className: clsx(classes.text, (_a = componentsProps.text) === null || _a === void 0 ? void 0 : _a.className)
+    }, {
+      children: "Sample Component!"
+    }), void 0)
+  }), void 0);
+});
+
+export { FilterInput, FilterInputItem, FilterPanel, FilterableListView, FontProvider, Header, HeaderButtonBar, HeaderTitle, InfoItem, InfoItemList, LabelChip, PaywallScrollBlock, SampleComponent, Scroll, ScrollBlock };
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/addLeadingZeros/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/addLeadingZeros/index.js
new file mode 100644
index 0000000..e16dacb
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/addLeadingZeros/index.js
@@ -0,0 +1,8 @@
+export default function addLeadingZeros(number, targetLength) {
+  var sign = number < 0 ? '-' : '';
+  var output = Math.abs(number).toString();
+  while (output.length < targetLength) {
+    output = '0' + output;
+  }
+  return sign + output;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/assign/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/assign/index.js
new file mode 100644
index 0000000..227bd88
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/assign/index.js
@@ -0,0 +1,12 @@
+export default function assign(target, object) {
+  if (target == null) {
+    throw new TypeError('assign requires that input parameter not be null or undefined');
+  }
+  for (var property in object) {
+    if (Object.prototype.hasOwnProperty.call(object, property)) {
+      ;
+      target[property] = object[property];
+    }
+  }
+  return target;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/cloneObject/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/cloneObject/index.js
new file mode 100644
index 0000000..632e94e
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/cloneObject/index.js
@@ -0,0 +1,4 @@
+import assign from "../assign/index.js";
+export default function cloneObject(object) {
+  return assign({}, object);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/defaultLocale/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/defaultLocale/index.js
new file mode 100644
index 0000000..0e30a13
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/defaultLocale/index.js
@@ -0,0 +1,2 @@
+import defaultLocale from "../../locale/en-US/index.js";
+export default defaultLocale;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/defaultOptions/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/defaultOptions/index.js
new file mode 100644
index 0000000..4489fa6
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/defaultOptions/index.js
@@ -0,0 +1,7 @@
+var defaultOptions = {};
+export function getDefaultOptions() {
+  return defaultOptions;
+}
+export function setDefaultOptions(newOptions) {
+  defaultOptions = newOptions;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/format/lightFormatters/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/format/lightFormatters/index.js
new file mode 100644
index 0000000..98c9308
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/format/lightFormatters/index.js
@@ -0,0 +1,80 @@
+import addLeadingZeros from "../../addLeadingZeros/index.js";
+/*
+ * |     | Unit                           |     | Unit                           |
+ * |-----|--------------------------------|-----|--------------------------------|
+ * |  a  | AM, PM                         |  A* |                                |
+ * |  d  | Day of month                   |  D  |                                |
+ * |  h  | Hour [1-12]                    |  H  | Hour [0-23]                    |
+ * |  m  | Minute                         |  M  | Month                          |
+ * |  s  | Second                         |  S  | Fraction of second             |
+ * |  y  | Year (abs)                     |  Y  |                                |
+ *
+ * Letters marked by * are not implemented but reserved by Unicode standard.
+ */
+var formatters = {
+  // Year
+  y: function y(date, token) {
+    // From http://www.unicode.org/reports/tr35/tr35-31/tr35-dates.html#Date_Format_tokens
+    // | Year     |     y | yy |   yyy |  yyyy | yyyyy |
+    // |----------|-------|----|-------|-------|-------|
+    // | AD 1     |     1 | 01 |   001 |  0001 | 00001 |
+    // | AD 12    |    12 | 12 |   012 |  0012 | 00012 |
+    // | AD 123   |   123 | 23 |   123 |  0123 | 00123 |
+    // | AD 1234  |  1234 | 34 |  1234 |  1234 | 01234 |
+    // | AD 12345 | 12345 | 45 | 12345 | 12345 | 12345 |
+
+    var signedYear = date.getUTCFullYear();
+    // Returns 1 for 1 BC (which is year 0 in JavaScript)
+    var year = signedYear > 0 ? signedYear : 1 - signedYear;
+    return addLeadingZeros(token === 'yy' ? year % 100 : year, token.length);
+  },
+  // Month
+  M: function M(date, token) {
+    var month = date.getUTCMonth();
+    return token === 'M' ? String(month + 1) : addLeadingZeros(month + 1, 2);
+  },
+  // Day of the month
+  d: function d(date, token) {
+    return addLeadingZeros(date.getUTCDate(), token.length);
+  },
+  // AM or PM
+  a: function a(date, token) {
+    var dayPeriodEnumValue = date.getUTCHours() / 12 >= 1 ? 'pm' : 'am';
+    switch (token) {
+      case 'a':
+      case 'aa':
+        return dayPeriodEnumValue.toUpperCase();
+      case 'aaa':
+        return dayPeriodEnumValue;
+      case 'aaaaa':
+        return dayPeriodEnumValue[0];
+      case 'aaaa':
+      default:
+        return dayPeriodEnumValue === 'am' ? 'a.m.' : 'p.m.';
+    }
+  },
+  // Hour [1-12]
+  h: function h(date, token) {
+    return addLeadingZeros(date.getUTCHours() % 12 || 12, token.length);
+  },
+  // Hour [0-23]
+  H: function H(date, token) {
+    return addLeadingZeros(date.getUTCHours(), token.length);
+  },
+  // Minute
+  m: function m(date, token) {
+    return addLeadingZeros(date.getUTCMinutes(), token.length);
+  },
+  // Second
+  s: function s(date, token) {
+    return addLeadingZeros(date.getUTCSeconds(), token.length);
+  },
+  // Fraction of second
+  S: function S(date, token) {
+    var numberOfDigits = token.length;
+    var milliseconds = date.getUTCMilliseconds();
+    var fractionalSeconds = Math.floor(milliseconds * Math.pow(10, numberOfDigits - 3));
+    return addLeadingZeros(fractionalSeconds, token.length);
+  }
+};
+export default formatters;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/getTimezoneOffsetInMilliseconds/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/getTimezoneOffsetInMilliseconds/index.js
new file mode 100644
index 0000000..65b6e1b
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/getTimezoneOffsetInMilliseconds/index.js
@@ -0,0 +1,16 @@
+/**
+ * Google Chrome as of 67.0.3396.87 introduced timezones with offset that includes seconds.
+ * They usually appear for dates that denote time before the timezones were introduced
+ * (e.g. for 'Europe/Prague' timezone the offset is GMT+00:57:44 before 1 October 1891
+ * and GMT+01:00:00 after that date)
+ *
+ * Date#getTimezoneOffset returns the offset in minutes and would return 57 for the example above,
+ * which would lead to incorrect calculations.
+ *
+ * This function returns the timezone offset in milliseconds that takes seconds in account.
+ */
+export default function getTimezoneOffsetInMilliseconds(date) {
+  var utcDate = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), date.getMilliseconds()));
+  utcDate.setUTCFullYear(date.getFullYear());
+  return date.getTime() - utcDate.getTime();
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/requiredArgs/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/requiredArgs/index.js
new file mode 100644
index 0000000..46d9179
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/requiredArgs/index.js
@@ -0,0 +1,5 @@
+export default function requiredArgs(required, args) {
+  if (args.length < required) {
+    throw new TypeError(required + ' argument' + (required > 1 ? 's' : '') + ' required, but only ' + args.length + ' present');
+  }
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/roundingMethods/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/roundingMethods/index.js
new file mode 100644
index 0000000..2791267
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/roundingMethods/index.js
@@ -0,0 +1,13 @@
+var roundingMap = {
+  ceil: Math.ceil,
+  round: Math.round,
+  floor: Math.floor,
+  trunc: function trunc(value) {
+    return value < 0 ? Math.ceil(value) : Math.floor(value);
+  } // Math.trunc is not supported by IE
+};
+
+var defaultRoundingMethod = 'trunc';
+export function getRoundingMethod(method) {
+  return method ? roundingMap[method] : roundingMap[defaultRoundingMethod];
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/toInteger/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/toInteger/index.js
new file mode 100644
index 0000000..7809a87
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/_lib/toInteger/index.js
@@ -0,0 +1,10 @@
+export default function toInteger(dirtyNumber) {
+  if (dirtyNumber === null || dirtyNumber === true || dirtyNumber === false) {
+    return NaN;
+  }
+  var number = Number(dirtyNumber);
+  if (isNaN(number)) {
+    return number;
+  }
+  return number < 0 ? Math.ceil(number) : Math.floor(number);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/addMilliseconds/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/addMilliseconds/index.js
new file mode 100644
index 0000000..9ed4071
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/addMilliseconds/index.js
@@ -0,0 +1,27 @@
+import toInteger from "../_lib/toInteger/index.js";
+import toDate from "../toDate/index.js";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+/**
+ * @name addMilliseconds
+ * @category Millisecond Helpers
+ * @summary Add the specified number of milliseconds to the given date.
+ *
+ * @description
+ * Add the specified number of milliseconds to the given date.
+ *
+ * @param {Date|Number} date - the date to be changed
+ * @param {Number} amount - the amount of milliseconds to be added. Positive decimals will be rounded using `Math.floor`, decimals less than zero will be rounded using `Math.ceil`.
+ * @returns {Date} the new date with the milliseconds added
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // Add 750 milliseconds to 10 July 2014 12:45:30.000:
+ * const result = addMilliseconds(new Date(2014, 6, 10, 12, 45, 30, 0), 750)
+ * //=> Thu Jul 10 2014 12:45:30.750
+ */
+export default function addMilliseconds(dirtyDate, dirtyAmount) {
+  requiredArgs(2, arguments);
+  var timestamp = toDate(dirtyDate).getTime();
+  var amount = toInteger(dirtyAmount);
+  return new Date(timestamp + amount);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/compareAsc/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/compareAsc/index.js
new file mode 100644
index 0000000..60d057e
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/compareAsc/index.js
@@ -0,0 +1,48 @@
+import toDate from "../toDate/index.js";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+/**
+ * @name compareAsc
+ * @category Common Helpers
+ * @summary Compare the two dates and return -1, 0 or 1.
+ *
+ * @description
+ * Compare the two dates and return 1 if the first date is after the second,
+ * -1 if the first date is before the second or 0 if dates are equal.
+ *
+ * @param {Date|Number} dateLeft - the first date to compare
+ * @param {Date|Number} dateRight - the second date to compare
+ * @returns {Number} the result of the comparison
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // Compare 11 February 1987 and 10 July 1989:
+ * const result = compareAsc(new Date(1987, 1, 11), new Date(1989, 6, 10))
+ * //=> -1
+ *
+ * @example
+ * // Sort the array of dates:
+ * const result = [
+ *   new Date(1995, 6, 2),
+ *   new Date(1987, 1, 11),
+ *   new Date(1989, 6, 10)
+ * ].sort(compareAsc)
+ * //=> [
+ * //   Wed Feb 11 1987 00:00:00,
+ * //   Mon Jul 10 1989 00:00:00,
+ * //   Sun Jul 02 1995 00:00:00
+ * // ]
+ */
+export default function compareAsc(dirtyDateLeft, dirtyDateRight) {
+  requiredArgs(2, arguments);
+  var dateLeft = toDate(dirtyDateLeft);
+  var dateRight = toDate(dirtyDateRight);
+  var diff = dateLeft.getTime() - dateRight.getTime();
+  if (diff < 0) {
+    return -1;
+  } else if (diff > 0) {
+    return 1;
+    // Return 0 if diff is 0; return NaN if diff is NaN
+  } else {
+    return diff;
+  }
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/constants/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/constants/index.js
new file mode 100644
index 0000000..74a6f25
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/constants/index.js
@@ -0,0 +1,183 @@
+/**
+ * Days in 1 week.
+ *
+ * @name daysInWeek
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var daysInWeek = 7;
+
+/**
+ * Days in 1 year
+ * One years equals 365.2425 days according to the formula:
+ *
+ * > Leap year occures every 4 years, except for years that are divisable by 100 and not divisable by 400.
+ * > 1 mean year = (365+1/4-1/100+1/400) days = 365.2425 days
+ *
+ * @name daysInYear
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var daysInYear = 365.2425;
+
+/**
+ * Maximum allowed time.
+ *
+ * @name maxTime
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var maxTime = Math.pow(10, 8) * 24 * 60 * 60 * 1000;
+
+/**
+ * Milliseconds in 1 minute
+ *
+ * @name millisecondsInMinute
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var millisecondsInMinute = 60000;
+
+/**
+ * Milliseconds in 1 hour
+ *
+ * @name millisecondsInHour
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var millisecondsInHour = 3600000;
+
+/**
+ * Milliseconds in 1 second
+ *
+ * @name millisecondsInSecond
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var millisecondsInSecond = 1000;
+
+/**
+ * Minimum allowed time.
+ *
+ * @name minTime
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var minTime = -maxTime;
+
+/**
+ * Minutes in 1 hour
+ *
+ * @name minutesInHour
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var minutesInHour = 60;
+
+/**
+ * Months in 1 quarter
+ *
+ * @name monthsInQuarter
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var monthsInQuarter = 3;
+
+/**
+ * Months in 1 year
+ *
+ * @name monthsInYear
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var monthsInYear = 12;
+
+/**
+ * Quarters in 1 year
+ *
+ * @name quartersInYear
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var quartersInYear = 4;
+
+/**
+ * Seconds in 1 hour
+ *
+ * @name secondsInHour
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var secondsInHour = 3600;
+
+/**
+ * Seconds in 1 minute
+ *
+ * @name secondsInMinute
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var secondsInMinute = 60;
+
+/**
+ * Seconds in 1 day
+ *
+ * @name secondsInDay
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var secondsInDay = secondsInHour * 24;
+
+/**
+ * Seconds in 1 week
+ *
+ * @name secondsInWeek
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var secondsInWeek = secondsInDay * 7;
+
+/**
+ * Seconds in 1 year
+ *
+ * @name secondsInYear
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var secondsInYear = secondsInDay * daysInYear;
+
+/**
+ * Seconds in 1 month
+ *
+ * @name secondsInMonth
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var secondsInMonth = secondsInYear / 12;
+
+/**
+ * Seconds in 1 quarter
+ *
+ * @name secondsInQuarter
+ * @constant
+ * @type {number}
+ * @default
+ */
+export var secondsInQuarter = secondsInMonth * 3;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInHours/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInHours/index.js
new file mode 100644
index 0000000..d2996c9
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInHours/index.js
@@ -0,0 +1,32 @@
+import { millisecondsInHour } from "../constants/index.js";
+import differenceInMilliseconds from "../differenceInMilliseconds/index.js";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+import { getRoundingMethod } from "../_lib/roundingMethods/index.js";
+/**
+ * @name differenceInHours
+ * @category Hour Helpers
+ * @summary Get the number of hours between the given dates.
+ *
+ * @description
+ * Get the number of hours between the given dates.
+ *
+ * @param {Date|Number} dateLeft - the later date
+ * @param {Date|Number} dateRight - the earlier date
+ * @param {Object} [options] - an object with options.
+ * @param {String} [options.roundingMethod='trunc'] - a rounding method (`ceil`, `floor`, `round` or `trunc`)
+ * @returns {Number} the number of hours
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // How many hours are between 2 July 2014 06:50:00 and 2 July 2014 19:00:00?
+ * const result = differenceInHours(
+ *   new Date(2014, 6, 2, 19, 0),
+ *   new Date(2014, 6, 2, 6, 50)
+ * )
+ * //=> 12
+ */
+export default function differenceInHours(dateLeft, dateRight, options) {
+  requiredArgs(2, arguments);
+  var diff = differenceInMilliseconds(dateLeft, dateRight) / millisecondsInHour;
+  return getRoundingMethod(options === null || options === void 0 ? void 0 : options.roundingMethod)(diff);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInMilliseconds/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInMilliseconds/index.js
new file mode 100644
index 0000000..2edb008
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInMilliseconds/index.js
@@ -0,0 +1,28 @@
+import toDate from "../toDate/index.js";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+/**
+ * @name differenceInMilliseconds
+ * @category Millisecond Helpers
+ * @summary Get the number of milliseconds between the given dates.
+ *
+ * @description
+ * Get the number of milliseconds between the given dates.
+ *
+ * @param {Date|Number} dateLeft - the later date
+ * @param {Date|Number} dateRight - the earlier date
+ * @returns {Number} the number of milliseconds
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // How many milliseconds are between
+ * // 2 July 2014 12:30:20.600 and 2 July 2014 12:30:21.700?
+ * const result = differenceInMilliseconds(
+ *   new Date(2014, 6, 2, 12, 30, 21, 700),
+ *   new Date(2014, 6, 2, 12, 30, 20, 600)
+ * )
+ * //=> 1100
+ */
+export default function differenceInMilliseconds(dateLeft, dateRight) {
+  requiredArgs(2, arguments);
+  return toDate(dateLeft).getTime() - toDate(dateRight).getTime();
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInMinutes/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInMinutes/index.js
new file mode 100644
index 0000000..64730e7
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInMinutes/index.js
@@ -0,0 +1,40 @@
+import { millisecondsInMinute } from "../constants/index.js";
+import differenceInMilliseconds from "../differenceInMilliseconds/index.js";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+import { getRoundingMethod } from "../_lib/roundingMethods/index.js";
+/**
+ * @name differenceInMinutes
+ * @category Minute Helpers
+ * @summary Get the number of minutes between the given dates.
+ *
+ * @description
+ * Get the signed number of full (rounded towards 0) minutes between the given dates.
+ *
+ * @param {Date|Number} dateLeft - the later date
+ * @param {Date|Number} dateRight - the earlier date
+ * @param {Object} [options] - an object with options.
+ * @param {String} [options.roundingMethod='trunc'] - a rounding method (`ceil`, `floor`, `round` or `trunc`)
+ * @returns {Number} the number of minutes
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // How many minutes are between 2 July 2014 12:07:59 and 2 July 2014 12:20:00?
+ * const result = differenceInMinutes(
+ *   new Date(2014, 6, 2, 12, 20, 0),
+ *   new Date(2014, 6, 2, 12, 7, 59)
+ * )
+ * //=> 12
+ *
+ * @example
+ * // How many minutes are between 10:01:59 and 10:00:00
+ * const result = differenceInMinutes(
+ *   new Date(2000, 0, 1, 10, 0, 0),
+ *   new Date(2000, 0, 1, 10, 1, 59)
+ * )
+ * //=> -1
+ */
+export default function differenceInMinutes(dateLeft, dateRight, options) {
+  requiredArgs(2, arguments);
+  var diff = differenceInMilliseconds(dateLeft, dateRight) / millisecondsInMinute;
+  return getRoundingMethod(options === null || options === void 0 ? void 0 : options.roundingMethod)(diff);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInSeconds/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInSeconds/index.js
new file mode 100644
index 0000000..eaa9f95
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/differenceInSeconds/index.js
@@ -0,0 +1,32 @@
+import differenceInMilliseconds from "../differenceInMilliseconds/index.js";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+import { getRoundingMethod } from "../_lib/roundingMethods/index.js";
+/**
+ * @name differenceInSeconds
+ * @category Second Helpers
+ * @summary Get the number of seconds between the given dates.
+ *
+ * @description
+ * Get the number of seconds between the given dates.
+ *
+ * @param {Date|Number} dateLeft - the later date
+ * @param {Date|Number} dateRight - the earlier date
+ * @param {Object} [options] - an object with options.
+ * @param {String} [options.roundingMethod='trunc'] - a rounding method (`ceil`, `floor`, `round` or `trunc`)
+ * @returns {Number} the number of seconds
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // How many seconds are between
+ * // 2 July 2014 12:30:07.999 and 2 July 2014 12:30:20.000?
+ * const result = differenceInSeconds(
+ *   new Date(2014, 6, 2, 12, 30, 20, 0),
+ *   new Date(2014, 6, 2, 12, 30, 7, 999)
+ * )
+ * //=> 12
+ */
+export default function differenceInSeconds(dateLeft, dateRight, options) {
+  requiredArgs(2, arguments);
+  var diff = differenceInMilliseconds(dateLeft, dateRight) / 1000;
+  return getRoundingMethod(options === null || options === void 0 ? void 0 : options.roundingMethod)(diff);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/formatDistanceStrict/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/formatDistanceStrict/index.js
new file mode 100644
index 0000000..277c29d
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/formatDistanceStrict/index.js
@@ -0,0 +1,190 @@
+import { getDefaultOptions } from "../_lib/defaultOptions/index.js";
+import getTimezoneOffsetInMilliseconds from "../_lib/getTimezoneOffsetInMilliseconds/index.js";
+import compareAsc from "../compareAsc/index.js";
+import toDate from "../toDate/index.js";
+import cloneObject from "../_lib/cloneObject/index.js";
+import assign from "../_lib/assign/index.js";
+import defaultLocale from "../_lib/defaultLocale/index.js";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+var MILLISECONDS_IN_MINUTE = 1000 * 60;
+var MINUTES_IN_DAY = 60 * 24;
+var MINUTES_IN_MONTH = MINUTES_IN_DAY * 30;
+var MINUTES_IN_YEAR = MINUTES_IN_DAY * 365;
+
+/**
+ * @name formatDistanceStrict
+ * @category Common Helpers
+ * @summary Return the distance between the given dates in words.
+ *
+ * @description
+ * Return the distance between the given dates in words, using strict units.
+ * This is like `formatDistance`, but does not use helpers like 'almost', 'over',
+ * 'less than' and the like.
+ *
+ * | Distance between dates | Result              |
+ * |------------------------|---------------------|
+ * | 0 ... 59 secs          | [0..59] seconds     |
+ * | 1 ... 59 mins          | [1..59] minutes     |
+ * | 1 ... 23 hrs           | [1..23] hours       |
+ * | 1 ... 29 days          | [1..29] days        |
+ * | 1 ... 11 months        | [1..11] months      |
+ * | 1 ... N years          | [1..N]  years       |
+ *
+ * @param {Date|Number} date - the date
+ * @param {Date|Number} baseDate - the date to compare with
+ * @param {Object} [options] - an object with options.
+ * @param {Boolean} [options.addSuffix=false] - result indicates if the second date is earlier or later than the first
+ * @param {'second'|'minute'|'hour'|'day'|'month'|'year'} [options.unit] - if specified, will force a unit
+ * @param {'floor'|'ceil'|'round'} [options.roundingMethod='round'] - which way to round partial units
+ * @param {Locale} [options.locale=defaultLocale] - the locale object. See [Locale]{@link https://date-fns.org/docs/Locale}
+ * @returns {String} the distance in words
+ * @throws {TypeError} 2 arguments required
+ * @throws {RangeError} `date` must not be Invalid Date
+ * @throws {RangeError} `baseDate` must not be Invalid Date
+ * @throws {RangeError} `options.roundingMethod` must be 'floor', 'ceil' or 'round'
+ * @throws {RangeError} `options.unit` must be 'second', 'minute', 'hour', 'day', 'month' or 'year'
+ * @throws {RangeError} `options.locale` must contain `formatDistance` property
+ *
+ * @example
+ * // What is the distance between 2 July 2014 and 1 January 2015?
+ * const result = formatDistanceStrict(new Date(2014, 6, 2), new Date(2015, 0, 2))
+ * //=> '6 months'
+ *
+ * @example
+ * // What is the distance between 1 January 2015 00:00:15
+ * // and 1 January 2015 00:00:00?
+ * const result = formatDistanceStrict(
+ *   new Date(2015, 0, 1, 0, 0, 15),
+ *   new Date(2015, 0, 1, 0, 0, 0)
+ * )
+ * //=> '15 seconds'
+ *
+ * @example
+ * // What is the distance from 1 January 2016
+ * // to 1 January 2015, with a suffix?
+ * const result = formatDistanceStrict(new Date(2015, 0, 1), new Date(2016, 0, 1), {
+ *   addSuffix: true
+ * })
+ * //=> '1 year ago'
+ *
+ * @example
+ * // What is the distance from 1 January 2016
+ * // to 1 January 2015, in minutes?
+ * const result = formatDistanceStrict(new Date(2016, 0, 1), new Date(2015, 0, 1), {
+ *   unit: 'minute'
+ * })
+ * //=> '525600 minutes'
+ *
+ * @example
+ * // What is the distance from 1 January 2015
+ * // to 28 January 2015, in months, rounded up?
+ * const result = formatDistanceStrict(new Date(2015, 0, 28), new Date(2015, 0, 1), {
+ *   unit: 'month',
+ *   roundingMethod: 'ceil'
+ * })
+ * //=> '1 month'
+ *
+ * @example
+ * // What is the distance between 1 August 2016 and 1 January 2015 in Esperanto?
+ * import { eoLocale } from 'date-fns/locale/eo'
+ * const result = formatDistanceStrict(new Date(2016, 7, 1), new Date(2015, 0, 1), {
+ *   locale: eoLocale
+ * })
+ * //=> '1 jaro'
+ */
+
+export default function formatDistanceStrict(dirtyDate, dirtyBaseDate, options) {
+  var _ref, _options$locale, _options$roundingMeth;
+  requiredArgs(2, arguments);
+  var defaultOptions = getDefaultOptions();
+  var locale = (_ref = (_options$locale = options === null || options === void 0 ? void 0 : options.locale) !== null && _options$locale !== void 0 ? _options$locale : defaultOptions.locale) !== null && _ref !== void 0 ? _ref : defaultLocale;
+  if (!locale.formatDistance) {
+    throw new RangeError('locale must contain localize.formatDistance property');
+  }
+  var comparison = compareAsc(dirtyDate, dirtyBaseDate);
+  if (isNaN(comparison)) {
+    throw new RangeError('Invalid time value');
+  }
+  var localizeOptions = assign(cloneObject(options), {
+    addSuffix: Boolean(options === null || options === void 0 ? void 0 : options.addSuffix),
+    comparison: comparison
+  });
+  var dateLeft;
+  var dateRight;
+  if (comparison > 0) {
+    dateLeft = toDate(dirtyBaseDate);
+    dateRight = toDate(dirtyDate);
+  } else {
+    dateLeft = toDate(dirtyDate);
+    dateRight = toDate(dirtyBaseDate);
+  }
+  var roundingMethod = String((_options$roundingMeth = options === null || options === void 0 ? void 0 : options.roundingMethod) !== null && _options$roundingMeth !== void 0 ? _options$roundingMeth : 'round');
+  var roundingMethodFn;
+  if (roundingMethod === 'floor') {
+    roundingMethodFn = Math.floor;
+  } else if (roundingMethod === 'ceil') {
+    roundingMethodFn = Math.ceil;
+  } else if (roundingMethod === 'round') {
+    roundingMethodFn = Math.round;
+  } else {
+    throw new RangeError("roundingMethod must be 'floor', 'ceil' or 'round'");
+  }
+  var milliseconds = dateRight.getTime() - dateLeft.getTime();
+  var minutes = milliseconds / MILLISECONDS_IN_MINUTE;
+  var timezoneOffset = getTimezoneOffsetInMilliseconds(dateRight) - getTimezoneOffsetInMilliseconds(dateLeft);
+
+  // Use DST-normalized difference in minutes for years, months and days;
+  // use regular difference in minutes for hours, minutes and seconds.
+  var dstNormalizedMinutes = (milliseconds - timezoneOffset) / MILLISECONDS_IN_MINUTE;
+  var defaultUnit = options === null || options === void 0 ? void 0 : options.unit;
+  var unit;
+  if (!defaultUnit) {
+    if (minutes < 1) {
+      unit = 'second';
+    } else if (minutes < 60) {
+      unit = 'minute';
+    } else if (minutes < MINUTES_IN_DAY) {
+      unit = 'hour';
+    } else if (dstNormalizedMinutes < MINUTES_IN_MONTH) {
+      unit = 'day';
+    } else if (dstNormalizedMinutes < MINUTES_IN_YEAR) {
+      unit = 'month';
+    } else {
+      unit = 'year';
+    }
+  } else {
+    unit = String(defaultUnit);
+  }
+
+  // 0 up to 60 seconds
+  if (unit === 'second') {
+    var seconds = roundingMethodFn(milliseconds / 1000);
+    return locale.formatDistance('xSeconds', seconds, localizeOptions);
+
+    // 1 up to 60 mins
+  } else if (unit === 'minute') {
+    var roundedMinutes = roundingMethodFn(minutes);
+    return locale.formatDistance('xMinutes', roundedMinutes, localizeOptions);
+
+    // 1 up to 24 hours
+  } else if (unit === 'hour') {
+    var hours = roundingMethodFn(minutes / 60);
+    return locale.formatDistance('xHours', hours, localizeOptions);
+
+    // 1 up to 30 days
+  } else if (unit === 'day') {
+    var days = roundingMethodFn(dstNormalizedMinutes / MINUTES_IN_DAY);
+    return locale.formatDistance('xDays', days, localizeOptions);
+
+    // 1 up to 12 months
+  } else if (unit === 'month') {
+    var months = roundingMethodFn(dstNormalizedMinutes / MINUTES_IN_MONTH);
+    return months === 12 && defaultUnit !== 'month' ? locale.formatDistance('xYears', 1, localizeOptions) : locale.formatDistance('xMonths', months, localizeOptions);
+
+    // 1 year up to max Date
+  } else if (unit === 'year') {
+    var years = roundingMethodFn(dstNormalizedMinutes / MINUTES_IN_YEAR);
+    return locale.formatDistance('xYears', years, localizeOptions);
+  }
+  throw new RangeError("unit must be 'second', 'minute', 'hour', 'day', 'month' or 'year'");
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/formatISO/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/formatISO/index.js
new file mode 100644
index 0000000..9697075
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/formatISO/index.js
@@ -0,0 +1,100 @@
+import toDate from "../toDate/index.js";
+import addLeadingZeros from "../_lib/addLeadingZeros/index.js";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+/**
+ * @name formatISO
+ * @category Common Helpers
+ * @summary Format the date according to the ISO 8601 standard (https://support.sas.com/documentation/cdl/en/lrdict/64316/HTML/default/viewer.htm#a003169814.htm).
+ *
+ * @description
+ * Return the formatted date string in ISO 8601 format. Options may be passed to control the parts and notations of the date.
+ *
+ * @param {Date|Number} date - the original date
+ * @param {Object} [options] - an object with options.
+ * @param {'extended'|'basic'} [options.format='extended'] - if 'basic', hide delimiters between date and time values.
+ * @param {'complete'|'date'|'time'} [options.representation='complete'] - format date, time with local time zone, or both.
+ * @returns {String} the formatted date string (in local time zone)
+ * @throws {TypeError} 1 argument required
+ * @throws {RangeError} `date` must not be Invalid Date
+ * @throws {RangeError} `options.format` must be 'extended' or 'basic'
+ * @throws {RangeError} `options.representation` must be 'date', 'time' or 'complete'
+ *
+ * @example
+ * // Represent 18 September 2019 in ISO 8601 format (local time zone is UTC):
+ * const result = formatISO(new Date(2019, 8, 18, 19, 0, 52))
+ * //=> '2019-09-18T19:00:52Z'
+ *
+ * @example
+ * // Represent 18 September 2019 in ISO 8601, short format (local time zone is UTC):
+ * const result = formatISO(new Date(2019, 8, 18, 19, 0, 52), { format: 'basic' })
+ * //=> '20190918T190052'
+ *
+ * @example
+ * // Represent 18 September 2019 in ISO 8601 format, date only:
+ * const result = formatISO(new Date(2019, 8, 18, 19, 0, 52), { representation: 'date' })
+ * //=> '2019-09-18'
+ *
+ * @example
+ * // Represent 18 September 2019 in ISO 8601 format, time only (local time zone is UTC):
+ * const result = formatISO(new Date(2019, 8, 18, 19, 0, 52), { representation: 'time' })
+ * //=> '19:00:52Z'
+ */
+export default function formatISO(date, options) {
+  var _options$format, _options$representati;
+  requiredArgs(1, arguments);
+  var originalDate = toDate(date);
+  if (isNaN(originalDate.getTime())) {
+    throw new RangeError('Invalid time value');
+  }
+  var format = String((_options$format = options === null || options === void 0 ? void 0 : options.format) !== null && _options$format !== void 0 ? _options$format : 'extended');
+  var representation = String((_options$representati = options === null || options === void 0 ? void 0 : options.representation) !== null && _options$representati !== void 0 ? _options$representati : 'complete');
+  if (format !== 'extended' && format !== 'basic') {
+    throw new RangeError("format must be 'extended' or 'basic'");
+  }
+  if (representation !== 'date' && representation !== 'time' && representation !== 'complete') {
+    throw new RangeError("representation must be 'date', 'time', or 'complete'");
+  }
+  var result = '';
+  var tzOffset = '';
+  var dateDelimiter = format === 'extended' ? '-' : '';
+  var timeDelimiter = format === 'extended' ? ':' : '';
+
+  // Representation is either 'date' or 'complete'
+  if (representation !== 'time') {
+    var day = addLeadingZeros(originalDate.getDate(), 2);
+    var month = addLeadingZeros(originalDate.getMonth() + 1, 2);
+    var year = addLeadingZeros(originalDate.getFullYear(), 4);
+
+    // yyyyMMdd or yyyy-MM-dd.
+    result = "".concat(year).concat(dateDelimiter).concat(month).concat(dateDelimiter).concat(day);
+  }
+
+  // Representation is either 'time' or 'complete'
+  if (representation !== 'date') {
+    // Add the timezone.
+    var offset = originalDate.getTimezoneOffset();
+    if (offset !== 0) {
+      var absoluteOffset = Math.abs(offset);
+      var hourOffset = addLeadingZeros(Math.floor(absoluteOffset / 60), 2);
+      var minuteOffset = addLeadingZeros(absoluteOffset % 60, 2);
+      // If less than 0, the sign is +, because it is ahead of time.
+      var sign = offset < 0 ? '+' : '-';
+      tzOffset = "".concat(sign).concat(hourOffset, ":").concat(minuteOffset);
+    } else {
+      tzOffset = 'Z';
+    }
+    var hour = addLeadingZeros(originalDate.getHours(), 2);
+    var minute = addLeadingZeros(originalDate.getMinutes(), 2);
+    var second = addLeadingZeros(originalDate.getSeconds(), 2);
+
+    // If there's also date, separate it with time with 'T'
+    var separator = result === '' ? '' : 'T';
+
+    // Creates a time string consisting of hour, minute, and second, separated by delimiters, if defined.
+    var time = [hour, minute, second].join(timeDelimiter);
+
+    // HHmmss or HH:mm:ss.
+    result = "".concat(result).concat(separator).concat(time).concat(tzOffset);
+  }
+  return result;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/isDate/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/isDate/index.js
new file mode 100644
index 0000000..d15cc6a
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/isDate/index.js
@@ -0,0 +1,38 @@
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+/**
+ * @name isDate
+ * @category Common Helpers
+ * @summary Is the given value a date?
+ *
+ * @description
+ * Returns true if the given value is an instance of Date. The function works for dates transferred across iframes.
+ *
+ * @param {*} value - the value to check
+ * @returns {boolean} true if the given value is a date
+ * @throws {TypeError} 1 arguments required
+ *
+ * @example
+ * // For a valid date:
+ * const result = isDate(new Date())
+ * //=> true
+ *
+ * @example
+ * // For an invalid date:
+ * const result = isDate(new Date(NaN))
+ * //=> true
+ *
+ * @example
+ * // For some value:
+ * const result = isDate('2014-02-31')
+ * //=> false
+ *
+ * @example
+ * // For an object:
+ * const result = isDate({})
+ * //=> false
+ */
+export default function isDate(value) {
+  requiredArgs(1, arguments);
+  return value instanceof Date || _typeof(value) === 'object' && Object.prototype.toString.call(value) === '[object Date]';
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/isValid/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/isValid/index.js
new file mode 100644
index 0000000..2d9e471
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/isValid/index.js
@@ -0,0 +1,42 @@
+import isDate from "../isDate/index.js";
+import toDate from "../toDate/index.js";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+/**
+ * @name isValid
+ * @category Common Helpers
+ * @summary Is the given date valid?
+ *
+ * @description
+ * Returns false if argument is Invalid Date and true otherwise.
+ * Argument is converted to Date using `toDate`. See [toDate]{@link https://date-fns.org/docs/toDate}
+ * Invalid Date is a Date, whose time value is NaN.
+ *
+ * Time value of Date: http://es5.github.io/#x15.9.1.1
+ *
+ * @param {*} date - the date to check
+ * @returns {Boolean} the date is valid
+ * @throws {TypeError} 1 argument required
+ *
+ * @example
+ * // For the valid date:
+ * const result = isValid(new Date(2014, 1, 31))
+ * //=> true
+ *
+ * @example
+ * // For the value, convertable into a date:
+ * const result = isValid(1393804800000)
+ * //=> true
+ *
+ * @example
+ * // For the invalid date:
+ * const result = isValid(new Date(''))
+ * //=> false
+ */
+export default function isValid(dirtyDate) {
+  requiredArgs(1, arguments);
+  if (!isDate(dirtyDate) && typeof dirtyDate !== 'number') {
+    return false;
+  }
+  var date = toDate(dirtyDate);
+  return !isNaN(Number(date));
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/lightFormat/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/lightFormat/index.js
new file mode 100644
index 0000000..919f3ad
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/lightFormat/index.js
@@ -0,0 +1,118 @@
+import toDate from "../toDate/index.js";
+import formatters from "../_lib/format/lightFormatters/index.js";
+import getTimezoneOffsetInMilliseconds from "../_lib/getTimezoneOffsetInMilliseconds/index.js";
+import isValid from "../isValid/index.js";
+import subMilliseconds from "../subMilliseconds/index.js";
+import requiredArgs from "../_lib/requiredArgs/index.js"; // This RegExp consists of three parts separated by `|`:
+// - (\w)\1* matches any sequences of the same letter
+// - '' matches two quote characters in a row
+// - '(''|[^'])+('|$) matches anything surrounded by two quote characters ('),
+//   except a single quote symbol, which ends the sequence.
+//   Two quote characters do not end the sequence.
+//   If there is no matching single quote
+//   then the sequence will continue until the end of the string.
+// - . matches any single character unmatched by previous parts of the RegExps
+var formattingTokensRegExp = /(\w)\1*|''|'(''|[^'])+('|$)|./g;
+var escapedStringRegExp = /^'([^]*?)'?$/;
+var doubleQuoteRegExp = /''/g;
+var unescapedLatinCharacterRegExp = /[a-zA-Z]/;
+
+/**
+ * @name lightFormat
+ * @category Common Helpers
+ * @summary Format the date.
+ *
+ * @description
+ * Return the formatted date string in the given format. Unlike `format`,
+ * `lightFormat` doesn't use locales and outputs date using the most popular tokens.
+ *
+ * > ⚠️ Please note that the `lightFormat` tokens differ from Moment.js and other libraries.
+ * > See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
+ *
+ * The characters wrapped between two single quotes characters (') are escaped.
+ * Two single quotes in a row, whether inside or outside a quoted sequence, represent a 'real' single quote.
+ *
+ * Format of the string is based on Unicode Technical Standard #35:
+ * https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table
+ *
+ * Accepted patterns:
+ * | Unit                            | Pattern | Result examples                   |
+ * |---------------------------------|---------|-----------------------------------|
+ * | AM, PM                          | a..aaa  | AM, PM                            |
+ * |                                 | aaaa    | a.m., p.m.                        |
+ * |                                 | aaaaa   | a, p                              |
+ * | Calendar year                   | y       | 44, 1, 1900, 2017                 |
+ * |                                 | yy      | 44, 01, 00, 17                    |
+ * |                                 | yyy     | 044, 001, 000, 017                |
+ * |                                 | yyyy    | 0044, 0001, 1900, 2017            |
+ * | Month (formatting)              | M       | 1, 2, ..., 12                     |
+ * |                                 | MM      | 01, 02, ..., 12                   |
+ * | Day of month                    | d       | 1, 2, ..., 31                     |
+ * |                                 | dd      | 01, 02, ..., 31                   |
+ * | Hour [1-12]                     | h       | 1, 2, ..., 11, 12                 |
+ * |                                 | hh      | 01, 02, ..., 11, 12               |
+ * | Hour [0-23]                     | H       | 0, 1, 2, ..., 23                  |
+ * |                                 | HH      | 00, 01, 02, ..., 23               |
+ * | Minute                          | m       | 0, 1, ..., 59                     |
+ * |                                 | mm      | 00, 01, ..., 59                   |
+ * | Second                          | s       | 0, 1, ..., 59                     |
+ * |                                 | ss      | 00, 01, ..., 59                   |
+ * | Fraction of second              | S       | 0, 1, ..., 9                      |
+ * |                                 | SS      | 00, 01, ..., 99                   |
+ * |                                 | SSS     | 000, 001, ..., 999                |
+ * |                                 | SSSS    | ...                               |
+ *
+ * @param {Date|Number} date - the original date
+ * @param {String} format - the string of tokens
+ * @returns {String} the formatted date string
+ * @throws {TypeError} 2 arguments required
+ * @throws {RangeError} format string contains an unescaped latin alphabet character
+ *
+ * @example
+ * const result = lightFormat(new Date(2014, 1, 11), 'yyyy-MM-dd')
+ * //=> '2014-02-11'
+ */
+
+export default function lightFormat(dirtyDate, formatStr) {
+  requiredArgs(2, arguments);
+  var originalDate = toDate(dirtyDate);
+  if (!isValid(originalDate)) {
+    throw new RangeError('Invalid time value');
+  }
+
+  // Convert the date in system timezone to the same date in UTC+00:00 timezone.
+  // This ensures that when UTC functions will be implemented, locales will be compatible with them.
+  // See an issue about UTC functions: https://github.com/date-fns/date-fns/issues/376
+  var timezoneOffset = getTimezoneOffsetInMilliseconds(originalDate);
+  var utcDate = subMilliseconds(originalDate, timezoneOffset);
+  var tokens = formatStr.match(formattingTokensRegExp);
+
+  // The only case when formattingTokensRegExp doesn't match the string is when it's empty
+  if (!tokens) return '';
+  var result = tokens.map(function (substring) {
+    // Replace two single quote characters with one single quote character
+    if (substring === "''") {
+      return "'";
+    }
+    var firstCharacter = substring[0];
+    if (firstCharacter === "'") {
+      return cleanEscapedString(substring);
+    }
+    var formatter = formatters[firstCharacter];
+    if (formatter) {
+      return formatter(utcDate, substring);
+    }
+    if (firstCharacter.match(unescapedLatinCharacterRegExp)) {
+      throw new RangeError('Format string contains an unescaped latin alphabet character `' + firstCharacter + '`');
+    }
+    return substring;
+  }).join('');
+  return result;
+}
+function cleanEscapedString(input) {
+  var matches = input.match(escapedStringRegExp);
+  if (!matches) {
+    return input;
+  }
+  return matches[1].replace(doubleQuoteRegExp, "'");
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildFormatLongFn/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildFormatLongFn/index.js
new file mode 100644
index 0000000..1e67299
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildFormatLongFn/index.js
@@ -0,0 +1,9 @@
+export default function buildFormatLongFn(args) {
+  return function () {
+    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    // TODO: Remove String()
+    var width = options.width ? String(options.width) : args.defaultWidth;
+    var format = args.formats[width] || args.formats[args.defaultWidth];
+    return format;
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildLocalizeFn/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildLocalizeFn/index.js
new file mode 100644
index 0000000..e5af8f8
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildLocalizeFn/index.js
@@ -0,0 +1,18 @@
+export default function buildLocalizeFn(args) {
+  return function (dirtyIndex, options) {
+    var context = options !== null && options !== void 0 && options.context ? String(options.context) : 'standalone';
+    var valuesArray;
+    if (context === 'formatting' && args.formattingValues) {
+      var defaultWidth = args.defaultFormattingWidth || args.defaultWidth;
+      var width = options !== null && options !== void 0 && options.width ? String(options.width) : defaultWidth;
+      valuesArray = args.formattingValues[width] || args.formattingValues[defaultWidth];
+    } else {
+      var _defaultWidth = args.defaultWidth;
+      var _width = options !== null && options !== void 0 && options.width ? String(options.width) : args.defaultWidth;
+      valuesArray = args.values[_width] || args.values[_defaultWidth];
+    }
+    var index = args.argumentCallback ? args.argumentCallback(dirtyIndex) : dirtyIndex;
+    // @ts-ignore: For some reason TypeScript just don't want to match it, no matter how hard we try. I challenge you to try to remove it!
+    return valuesArray[index];
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildMatchFn/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildMatchFn/index.js
new file mode 100644
index 0000000..ac158b0
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildMatchFn/index.js
@@ -0,0 +1,42 @@
+export default function buildMatchFn(args) {
+  return function (string) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var width = options.width;
+    var matchPattern = width && args.matchPatterns[width] || args.matchPatterns[args.defaultMatchWidth];
+    var matchResult = string.match(matchPattern);
+    if (!matchResult) {
+      return null;
+    }
+    var matchedString = matchResult[0];
+    var parsePatterns = width && args.parsePatterns[width] || args.parsePatterns[args.defaultParseWidth];
+    var key = Array.isArray(parsePatterns) ? findIndex(parsePatterns, function (pattern) {
+      return pattern.test(matchedString);
+    }) : findKey(parsePatterns, function (pattern) {
+      return pattern.test(matchedString);
+    });
+    var value;
+    value = args.valueCallback ? args.valueCallback(key) : key;
+    value = options.valueCallback ? options.valueCallback(value) : value;
+    var rest = string.slice(matchedString.length);
+    return {
+      value: value,
+      rest: rest
+    };
+  };
+}
+function findKey(object, predicate) {
+  for (var key in object) {
+    if (object.hasOwnProperty(key) && predicate(object[key])) {
+      return key;
+    }
+  }
+  return undefined;
+}
+function findIndex(array, predicate) {
+  for (var key = 0; key < array.length; key++) {
+    if (predicate(array[key])) {
+      return key;
+    }
+  }
+  return undefined;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildMatchPatternFn/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildMatchPatternFn/index.js
new file mode 100644
index 0000000..8532087
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/_lib/buildMatchPatternFn/index.js
@@ -0,0 +1,17 @@
+export default function buildMatchPatternFn(args) {
+  return function (string) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var matchResult = string.match(args.matchPattern);
+    if (!matchResult) return null;
+    var matchedString = matchResult[0];
+    var parseResult = string.match(args.parsePattern);
+    if (!parseResult) return null;
+    var value = args.valueCallback ? args.valueCallback(parseResult[0]) : parseResult[0];
+    value = options.valueCallback ? options.valueCallback(value) : value;
+    var rest = string.slice(matchedString.length);
+    return {
+      value: value,
+      rest: rest
+    };
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/formatDistance/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/formatDistance/index.js
new file mode 100644
index 0000000..b877831
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/formatDistance/index.js
@@ -0,0 +1,83 @@
+var formatDistanceLocale = {
+  lessThanXSeconds: {
+    one: 'less than a second',
+    other: 'less than {{count}} seconds'
+  },
+  xSeconds: {
+    one: '1 second',
+    other: '{{count}} seconds'
+  },
+  halfAMinute: 'half a minute',
+  lessThanXMinutes: {
+    one: 'less than a minute',
+    other: 'less than {{count}} minutes'
+  },
+  xMinutes: {
+    one: '1 minute',
+    other: '{{count}} minutes'
+  },
+  aboutXHours: {
+    one: 'about 1 hour',
+    other: 'about {{count}} hours'
+  },
+  xHours: {
+    one: '1 hour',
+    other: '{{count}} hours'
+  },
+  xDays: {
+    one: '1 day',
+    other: '{{count}} days'
+  },
+  aboutXWeeks: {
+    one: 'about 1 week',
+    other: 'about {{count}} weeks'
+  },
+  xWeeks: {
+    one: '1 week',
+    other: '{{count}} weeks'
+  },
+  aboutXMonths: {
+    one: 'about 1 month',
+    other: 'about {{count}} months'
+  },
+  xMonths: {
+    one: '1 month',
+    other: '{{count}} months'
+  },
+  aboutXYears: {
+    one: 'about 1 year',
+    other: 'about {{count}} years'
+  },
+  xYears: {
+    one: '1 year',
+    other: '{{count}} years'
+  },
+  overXYears: {
+    one: 'over 1 year',
+    other: 'over {{count}} years'
+  },
+  almostXYears: {
+    one: 'almost 1 year',
+    other: 'almost {{count}} years'
+  }
+};
+var formatDistance = function formatDistance(token, count, options) {
+  var result;
+  var tokenValue = formatDistanceLocale[token];
+  if (typeof tokenValue === 'string') {
+    result = tokenValue;
+  } else if (count === 1) {
+    result = tokenValue.one;
+  } else {
+    result = tokenValue.other.replace('{{count}}', count.toString());
+  }
+  if (options !== null && options !== void 0 && options.addSuffix) {
+    if (options.comparison && options.comparison > 0) {
+      return 'in ' + result;
+    } else {
+      return result + ' ago';
+    }
+  }
+  return result;
+};
+export default formatDistance;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/formatLong/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/formatLong/index.js
new file mode 100644
index 0000000..2921883
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/formatLong/index.js
@@ -0,0 +1,34 @@
+import buildFormatLongFn from "../../../_lib/buildFormatLongFn/index.js";
+var dateFormats = {
+  full: 'EEEE, MMMM do, y',
+  long: 'MMMM do, y',
+  medium: 'MMM d, y',
+  short: 'MM/dd/yyyy'
+};
+var timeFormats = {
+  full: 'h:mm:ss a zzzz',
+  long: 'h:mm:ss a z',
+  medium: 'h:mm:ss a',
+  short: 'h:mm a'
+};
+var dateTimeFormats = {
+  full: "{{date}} 'at' {{time}}",
+  long: "{{date}} 'at' {{time}}",
+  medium: '{{date}}, {{time}}',
+  short: '{{date}}, {{time}}'
+};
+var formatLong = {
+  date: buildFormatLongFn({
+    formats: dateFormats,
+    defaultWidth: 'full'
+  }),
+  time: buildFormatLongFn({
+    formats: timeFormats,
+    defaultWidth: 'full'
+  }),
+  dateTime: buildFormatLongFn({
+    formats: dateTimeFormats,
+    defaultWidth: 'full'
+  })
+};
+export default formatLong;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/formatRelative/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/formatRelative/index.js
new file mode 100644
index 0000000..41853a8
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/formatRelative/index.js
@@ -0,0 +1,12 @@
+var formatRelativeLocale = {
+  lastWeek: "'last' eeee 'at' p",
+  yesterday: "'yesterday at' p",
+  today: "'today at' p",
+  tomorrow: "'tomorrow at' p",
+  nextWeek: "eeee 'at' p",
+  other: 'P'
+};
+var formatRelative = function formatRelative(token, _date, _baseDate, _options) {
+  return formatRelativeLocale[token];
+};
+export default formatRelative;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/localize/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/localize/index.js
new file mode 100644
index 0000000..ba43bc6
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/localize/index.js
@@ -0,0 +1,143 @@
+import buildLocalizeFn from "../../../_lib/buildLocalizeFn/index.js";
+var eraValues = {
+  narrow: ['B', 'A'],
+  abbreviated: ['BC', 'AD'],
+  wide: ['Before Christ', 'Anno Domini']
+};
+var quarterValues = {
+  narrow: ['1', '2', '3', '4'],
+  abbreviated: ['Q1', 'Q2', 'Q3', 'Q4'],
+  wide: ['1st quarter', '2nd quarter', '3rd quarter', '4th quarter']
+};
+
+// Note: in English, the names of days of the week and months are capitalized.
+// If you are making a new locale based on this one, check if the same is true for the language you're working on.
+// Generally, formatted dates should look like they are in the middle of a sentence,
+// e.g. in Spanish language the weekdays and months should be in the lowercase.
+var monthValues = {
+  narrow: ['J', 'F', 'M', 'A', 'M', 'J', 'J', 'A', 'S', 'O', 'N', 'D'],
+  abbreviated: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
+  wide: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
+};
+var dayValues = {
+  narrow: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
+  short: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
+  abbreviated: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
+  wide: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']
+};
+var dayPeriodValues = {
+  narrow: {
+    am: 'a',
+    pm: 'p',
+    midnight: 'mi',
+    noon: 'n',
+    morning: 'morning',
+    afternoon: 'afternoon',
+    evening: 'evening',
+    night: 'night'
+  },
+  abbreviated: {
+    am: 'AM',
+    pm: 'PM',
+    midnight: 'midnight',
+    noon: 'noon',
+    morning: 'morning',
+    afternoon: 'afternoon',
+    evening: 'evening',
+    night: 'night'
+  },
+  wide: {
+    am: 'a.m.',
+    pm: 'p.m.',
+    midnight: 'midnight',
+    noon: 'noon',
+    morning: 'morning',
+    afternoon: 'afternoon',
+    evening: 'evening',
+    night: 'night'
+  }
+};
+var formattingDayPeriodValues = {
+  narrow: {
+    am: 'a',
+    pm: 'p',
+    midnight: 'mi',
+    noon: 'n',
+    morning: 'in the morning',
+    afternoon: 'in the afternoon',
+    evening: 'in the evening',
+    night: 'at night'
+  },
+  abbreviated: {
+    am: 'AM',
+    pm: 'PM',
+    midnight: 'midnight',
+    noon: 'noon',
+    morning: 'in the morning',
+    afternoon: 'in the afternoon',
+    evening: 'in the evening',
+    night: 'at night'
+  },
+  wide: {
+    am: 'a.m.',
+    pm: 'p.m.',
+    midnight: 'midnight',
+    noon: 'noon',
+    morning: 'in the morning',
+    afternoon: 'in the afternoon',
+    evening: 'in the evening',
+    night: 'at night'
+  }
+};
+var ordinalNumber = function ordinalNumber(dirtyNumber, _options) {
+  var number = Number(dirtyNumber);
+
+  // If ordinal numbers depend on context, for example,
+  // if they are different for different grammatical genders,
+  // use `options.unit`.
+  //
+  // `unit` can be 'year', 'quarter', 'month', 'week', 'date', 'dayOfYear',
+  // 'day', 'hour', 'minute', 'second'.
+
+  var rem100 = number % 100;
+  if (rem100 > 20 || rem100 < 10) {
+    switch (rem100 % 10) {
+      case 1:
+        return number + 'st';
+      case 2:
+        return number + 'nd';
+      case 3:
+        return number + 'rd';
+    }
+  }
+  return number + 'th';
+};
+var localize = {
+  ordinalNumber: ordinalNumber,
+  era: buildLocalizeFn({
+    values: eraValues,
+    defaultWidth: 'wide'
+  }),
+  quarter: buildLocalizeFn({
+    values: quarterValues,
+    defaultWidth: 'wide',
+    argumentCallback: function argumentCallback(quarter) {
+      return quarter - 1;
+    }
+  }),
+  month: buildLocalizeFn({
+    values: monthValues,
+    defaultWidth: 'wide'
+  }),
+  day: buildLocalizeFn({
+    values: dayValues,
+    defaultWidth: 'wide'
+  }),
+  dayPeriod: buildLocalizeFn({
+    values: dayPeriodValues,
+    defaultWidth: 'wide',
+    formattingValues: formattingDayPeriodValues,
+    defaultFormattingWidth: 'wide'
+  })
+};
+export default localize;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/match/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/match/index.js
new file mode 100644
index 0000000..155d717
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/_lib/match/index.js
@@ -0,0 +1,98 @@
+import buildMatchFn from "../../../_lib/buildMatchFn/index.js";
+import buildMatchPatternFn from "../../../_lib/buildMatchPatternFn/index.js";
+var matchOrdinalNumberPattern = /^(\d+)(th|st|nd|rd)?/i;
+var parseOrdinalNumberPattern = /\d+/i;
+var matchEraPatterns = {
+  narrow: /^(b|a)/i,
+  abbreviated: /^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i,
+  wide: /^(before christ|before common era|anno domini|common era)/i
+};
+var parseEraPatterns = {
+  any: [/^b/i, /^(a|c)/i]
+};
+var matchQuarterPatterns = {
+  narrow: /^[1234]/i,
+  abbreviated: /^q[1234]/i,
+  wide: /^[1234](th|st|nd|rd)? quarter/i
+};
+var parseQuarterPatterns = {
+  any: [/1/i, /2/i, /3/i, /4/i]
+};
+var matchMonthPatterns = {
+  narrow: /^[jfmasond]/i,
+  abbreviated: /^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i,
+  wide: /^(january|february|march|april|may|june|july|august|september|october|november|december)/i
+};
+var parseMonthPatterns = {
+  narrow: [/^j/i, /^f/i, /^m/i, /^a/i, /^m/i, /^j/i, /^j/i, /^a/i, /^s/i, /^o/i, /^n/i, /^d/i],
+  any: [/^ja/i, /^f/i, /^mar/i, /^ap/i, /^may/i, /^jun/i, /^jul/i, /^au/i, /^s/i, /^o/i, /^n/i, /^d/i]
+};
+var matchDayPatterns = {
+  narrow: /^[smtwf]/i,
+  short: /^(su|mo|tu|we|th|fr|sa)/i,
+  abbreviated: /^(sun|mon|tue|wed|thu|fri|sat)/i,
+  wide: /^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i
+};
+var parseDayPatterns = {
+  narrow: [/^s/i, /^m/i, /^t/i, /^w/i, /^t/i, /^f/i, /^s/i],
+  any: [/^su/i, /^m/i, /^tu/i, /^w/i, /^th/i, /^f/i, /^sa/i]
+};
+var matchDayPeriodPatterns = {
+  narrow: /^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i,
+  any: /^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i
+};
+var parseDayPeriodPatterns = {
+  any: {
+    am: /^a/i,
+    pm: /^p/i,
+    midnight: /^mi/i,
+    noon: /^no/i,
+    morning: /morning/i,
+    afternoon: /afternoon/i,
+    evening: /evening/i,
+    night: /night/i
+  }
+};
+var match = {
+  ordinalNumber: buildMatchPatternFn({
+    matchPattern: matchOrdinalNumberPattern,
+    parsePattern: parseOrdinalNumberPattern,
+    valueCallback: function valueCallback(value) {
+      return parseInt(value, 10);
+    }
+  }),
+  era: buildMatchFn({
+    matchPatterns: matchEraPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseEraPatterns,
+    defaultParseWidth: 'any'
+  }),
+  quarter: buildMatchFn({
+    matchPatterns: matchQuarterPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseQuarterPatterns,
+    defaultParseWidth: 'any',
+    valueCallback: function valueCallback(index) {
+      return index + 1;
+    }
+  }),
+  month: buildMatchFn({
+    matchPatterns: matchMonthPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseMonthPatterns,
+    defaultParseWidth: 'any'
+  }),
+  day: buildMatchFn({
+    matchPatterns: matchDayPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseDayPatterns,
+    defaultParseWidth: 'any'
+  }),
+  dayPeriod: buildMatchFn({
+    matchPatterns: matchDayPeriodPatterns,
+    defaultMatchWidth: 'any',
+    parsePatterns: parseDayPeriodPatterns,
+    defaultParseWidth: 'any'
+  })
+};
+export default match;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/index.js
new file mode 100644
index 0000000..6e687bf
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/locale/en-US/index.js
@@ -0,0 +1,27 @@
+import formatDistance from "./_lib/formatDistance/index.js";
+import formatLong from "./_lib/formatLong/index.js";
+import formatRelative from "./_lib/formatRelative/index.js";
+import localize from "./_lib/localize/index.js";
+import match from "./_lib/match/index.js";
+/**
+ * @type {Locale}
+ * @category Locales
+ * @summary English locale (United States).
+ * @language English
+ * @iso-639-2 eng
+ * @author Sasha Koss [@kossnocorp]{@link https://github.com/kossnocorp}
+ * @author Lesha Koss [@leshakoss]{@link https://github.com/leshakoss}
+ */
+var locale = {
+  code: 'en-US',
+  formatDistance: formatDistance,
+  formatLong: formatLong,
+  formatRelative: formatRelative,
+  localize: localize,
+  match: match,
+  options: {
+    weekStartsOn: 0 /* Sunday */,
+    firstWeekContainsDate: 1
+  }
+};
+export default locale;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/subMilliseconds/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/subMilliseconds/index.js
new file mode 100644
index 0000000..a770051
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/subMilliseconds/index.js
@@ -0,0 +1,26 @@
+import addMilliseconds from "../addMilliseconds/index.js";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+import toInteger from "../_lib/toInteger/index.js";
+/**
+ * @name subMilliseconds
+ * @category Millisecond Helpers
+ * @summary Subtract the specified number of milliseconds from the given date.
+ *
+ * @description
+ * Subtract the specified number of milliseconds from the given date.
+ *
+ * @param {Date|Number} date - the date to be changed
+ * @param {Number} amount - the amount of milliseconds to be subtracted. Positive decimals will be rounded using `Math.floor`, decimals less than zero will be rounded using `Math.ceil`.
+ * @returns {Date} the new date with the milliseconds subtracted
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // Subtract 750 milliseconds from 10 July 2014 12:45:30.000:
+ * const result = subMilliseconds(new Date(2014, 6, 10, 12, 45, 30, 0), 750)
+ * //=> Thu Jul 10 2014 12:45:29.250
+ */
+export default function subMilliseconds(dirtyDate, dirtyAmount) {
+  requiredArgs(2, arguments);
+  var amount = toInteger(dirtyAmount);
+  return addMilliseconds(dirtyDate, -amount);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/toDate/index.js b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/toDate/index.js
new file mode 100644
index 0000000..c2e31d4
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/game-log-components/node_modules/date-fns/esm/toDate/index.js
@@ -0,0 +1,52 @@
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import requiredArgs from "../_lib/requiredArgs/index.js";
+/**
+ * @name toDate
+ * @category Common Helpers
+ * @summary Convert the given argument to an instance of Date.
+ *
+ * @description
+ * Convert the given argument to an instance of Date.
+ *
+ * If the argument is an instance of Date, the function returns its clone.
+ *
+ * If the argument is a number, it is treated as a timestamp.
+ *
+ * If the argument is none of the above, the function returns Invalid Date.
+ *
+ * **Note**: *all* Date arguments passed to any *date-fns* function is processed by `toDate`.
+ *
+ * @param {Date|Number} argument - the value to convert
+ * @returns {Date} the parsed date in the local time zone
+ * @throws {TypeError} 1 argument required
+ *
+ * @example
+ * // Clone the date:
+ * const result = toDate(new Date(2014, 1, 11, 11, 30, 30))
+ * //=> Tue Feb 11 2014 11:30:30
+ *
+ * @example
+ * // Convert the timestamp to date:
+ * const result = toDate(1392098430000)
+ * //=> Tue Feb 11 2014 11:30:30
+ */
+export default function toDate(argument) {
+  requiredArgs(1, arguments);
+  var argStr = Object.prototype.toString.call(argument);
+
+  // Clone the date
+  if (argument instanceof Date || _typeof(argument) === 'object' && argStr === '[object Date]') {
+    // Prevent the date to lose the milliseconds when passed to new Date() in IE10
+    return new Date(argument.getTime());
+  } else if (typeof argument === 'number' || argStr === '[object Number]') {
+    return new Date(argument);
+  } else {
+    if ((typeof argument === 'string' || argStr === '[object String]') && typeof console !== 'undefined') {
+      // eslint-disable-next-line no-console
+      console.warn("Starting with v2.0.0-beta.1 date-fns doesn't accept strings as date arguments. Please use `parseISO` to parse strings. See: https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#string-arguments");
+      // eslint-disable-next-line no-console
+      console.warn(new Error().stack);
+    }
+    return new Date(NaN);
+  }
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/components/Button/Button.tsx b/ddb_main/node_modules/@dndbeyond/ttui/components/Button/Button.tsx
new file mode 100644
index 0000000..15bec58
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/components/Button/Button.tsx
@@ -0,0 +1,51 @@
+"use client";
+
+import clsx from "clsx";
+import type {
+  AllHTMLAttributes,
+  ButtonHTMLAttributes,
+  FC,
+  PropsWithChildren,
+} from "react";
+import styles from "./styles/Button.module.css";
+import sizeStyles from "./styles/ButtonSizes.module.css";
+import variantStyles from "./styles/ButtonVariants.module.css";
+
+export interface ButtonProps
+  extends PropsWithChildren,
+    Omit<
+      AllHTMLAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLDivElement>,
+      "size" | "type"
+    >,
+    Pick<ButtonHTMLAttributes<HTMLButtonElement>, "type"> {
+  className?: string;
+  color?: "primary" | "secondary" | "success" | "info" | "warning" | "error";
+  variant?: "solid" | "outline" | "text";
+  size?: "x-small" | "small" | "medium" | "large" | "x-large";
+  isDiv?: boolean;
+}
+
+export const Button: FC<ButtonProps> = ({
+  className,
+  color = "primary",
+  variant = "solid",
+  size = "medium",
+  isDiv,
+  ...props
+}) => {
+  const Element = props.href ? "a" : isDiv ? "div" : "button";
+
+  return (
+    <Element
+      className={clsx([
+        styles.button,
+        color && variantStyles[color],
+        variant && variantStyles[variant],
+        size && sizeStyles[size],
+        className,
+      ])}
+      aria-disabled={props.disabled}
+      {...props}
+    />
+  );
+};
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/components/Checkbox/Checkbox.tsx b/ddb_main/node_modules/@dndbeyond/ttui/components/Checkbox/Checkbox.tsx
new file mode 100644
index 0000000..4d16158
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/components/Checkbox/Checkbox.tsx
@@ -0,0 +1,64 @@
+import clsx from "clsx";
+import type { ChangeEvent, FC, ReactNode } from "react";
+import styles from "./Checkbox.module.css";
+
+export interface CheckboxProps {
+  id?: string;
+  label?: ReactNode;
+  defaultChecked?: boolean;
+  checked?: boolean;
+  value?: string | number | readonly string[];
+  name?: string;
+  disabled?: boolean;
+  onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+  className?: string;
+}
+
+export const Checkbox: FC<CheckboxProps> = ({
+  id,
+  label,
+  defaultChecked,
+  checked,
+  value,
+  name,
+  disabled,
+  onChange,
+  className,
+}) => (
+  <div className={clsx([styles.container, className])}>
+    <span className={clsx(styles.inputContainer)}>
+      <input
+        className={styles.checkbox}
+        id={id}
+        type="checkbox"
+        defaultChecked={defaultChecked}
+        checked={checked}
+        value={value}
+        name={name}
+        aria-disabled={disabled}
+        onChange={onChange ? (e) => !disabled && onChange?.(e) : undefined}
+      />
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="16"
+        height="16"
+        fill="none"
+      >
+        <path
+          stroke="currentColor"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          d="M3.5 7.47 6.833 11 12.5 5"
+        />
+      </svg>
+    </span>
+    {label && (
+      <label
+        className={clsx([styles.label, disabled && styles.disabled])}
+        htmlFor={id}
+      >
+        {label}
+      </label>
+    )}
+  </div>
+);
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/components/Dialog/Dialog.tsx b/ddb_main/node_modules/@dndbeyond/ttui/components/Dialog/Dialog.tsx
new file mode 100644
index 0000000..21cd71d
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/components/Dialog/Dialog.tsx
@@ -0,0 +1,98 @@
+import clsx from "clsx";
+import { useEffect, useRef, type HTMLAttributes, type MouseEvent } from "react";
+
+import styles from "./Dialog.module.css";
+
+/**
+ * A generic dialog component to display content in a dialog (non-blocking) or
+ * a modal (blocking) way. This has built-in functionality like backdrop
+ * clicking and escape key handling. It also accepts a trigger element which
+ * will open the dialog when clicked. This is to allow focus to be returned to
+ * the trigger when the element is closed (for accessibility).
+ */
+
+export interface DialogProps extends HTMLAttributes<HTMLDialogElement> {
+  open: boolean;
+  onClose: (e?: MouseEvent) => void;
+  modal?: boolean;
+}
+
+export const Dialog: React.FC<DialogProps> = ({
+  open,
+  onClose,
+  modal,
+  children,
+  className,
+  ...props
+}) => {
+  const dialogRef = useRef<HTMLDialogElement>(null);
+  const triggerRef = useRef<Element | null>(null);
+
+  const handleClose = () => {
+    onClose();
+    dialogRef.current?.close();
+    // Returns focus to trigger after close for accessibility
+    (triggerRef.current as HTMLButtonElement)?.focus();
+  };
+
+  const handleClickBackdrop = (e?: MouseEvent) => {
+    if (!e) return;
+
+    const rect = dialogRef.current?.getBoundingClientRect();
+    const isClickInDialog =
+      rect &&
+      rect.top <= e.clientY &&
+      e.clientY <= rect.top + rect.height &&
+      rect.left <= e.clientX &&
+      e.clientX <= rect.left + rect.width;
+
+    if (!isClickInDialog) handleClose();
+  };
+
+  const handleEsc = (e: KeyboardEvent) => {
+    if (e.key === "Escape" && open) {
+      handleClose();
+    }
+  };
+
+  useEffect(
+    () => {
+      // Get the element that was clicked to open the dialog
+      triggerRef.current = document.activeElement;
+
+      if (modal && open) dialogRef.current?.showModal();
+      if (open) dialogRef.current?.focus();
+
+      if (!open) {
+        handleClose();
+      }
+    },
+    //eslint-disable-next-line react-hooks/exhaustive-deps
+    [dialogRef.current, open, modal],
+  );
+
+  useEffect(
+    () => {
+      document.addEventListener("keydown", handleEsc);
+
+      return () => {
+        document.removeEventListener("keydown", handleEsc);
+      };
+    },
+    //eslint-disable-next-line react-hooks/exhaustive-deps
+    [modal, open],
+  );
+
+  return (
+    <dialog
+      className={clsx([styles.dialog, className])}
+      ref={dialogRef}
+      onClick={modal ? handleClickBackdrop : undefined}
+      open={modal ? undefined : open}
+      aria-modal={modal}
+      {...props}
+    >
+      {children}
+    </dialog>
+  );
+};
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/components/InfoItem/InfoItem.tsx b/ddb_main/node_modules/@dndbeyond/ttui/components/InfoItem/InfoItem.tsx
new file mode 100644
index 0000000..d4cd180
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/components/InfoItem/InfoItem.tsx
@@ -0,0 +1,49 @@
+import clsx from "clsx";
+import type { FC, HTMLAttributes } from "react";
+import styles from "./InfoItem.module.css";
+
+interface InfoItemProps extends HTMLAttributes<HTMLDivElement> {
+  center?: boolean;
+  color?: "primary" | "secondary" | "success" | "info" | "warning" | "error";
+  label: string;
+  inline?: boolean;
+  italic?: boolean;
+}
+
+export const InfoItem: FC<InfoItemProps> = ({
+  center,
+  color,
+  className,
+  inline,
+  italic,
+  label,
+  children,
+  ...props
+}) => (
+  <div
+    className={clsx([
+      center && styles.center,
+      inline && styles.inline,
+      className,
+    ])}
+    {...props}
+  >
+    <p
+      className={clsx([
+        styles.label,
+        color && styles[color],
+        italic && styles.italic,
+      ])}
+    >
+      {label}
+    </p>
+    {typeof children === "string" ? (
+      <p
+        className={clsx([styles.value, color && styles[color]])}
+        dangerouslySetInnerHTML={{ __html: children }}
+      />
+    ) : (
+      <p className={clsx([styles.value, color && styles[color]])}>{children}</p>
+    )}
+  </div>
+);
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/components/LabelChip/LabelChip.tsx b/ddb_main/node_modules/@dndbeyond/ttui/components/LabelChip/LabelChip.tsx
new file mode 100644
index 0000000..11de159
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/components/LabelChip/LabelChip.tsx
@@ -0,0 +1,28 @@
+import clsx from "clsx";
+import type { HTMLAttributes, ReactNode } from "react";
+import { Tooltip } from "../Tooltip";
+import styles from "./LabelChip.module.css";
+
+interface LabelChipProps extends HTMLAttributes<HTMLSpanElement> {
+  tooltipContent?: ReactNode;
+  tooltipClickable?: boolean;
+}
+
+export const LabelChip = ({
+  className = "",
+  children,
+  tooltipContent,
+  tooltipClickable,
+  ...props
+}: LabelChipProps) => (
+  <>
+    <span className={clsx([styles.labelChip, className])} {...props}>
+      {children}
+    </span>
+    {props["data-tooltip-id"] && (
+      <Tooltip id={props["data-tooltip-id"]} clickable={tooltipClickable}>
+        {tooltipContent}
+      </Tooltip>
+    )}
+  </>
+);
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/components/MegaMenu/MegaMenuGameRulesPanel/MegaMenuGameRulesPanelData.ts b/ddb_main/node_modules/@dndbeyond/ttui/components/MegaMenu/MegaMenuGameRulesPanel/MegaMenuGameRulesPanelData.ts
new file mode 100644
index 0000000..949f51e
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/components/MegaMenu/MegaMenuGameRulesPanel/MegaMenuGameRulesPanelData.ts
@@ -0,0 +1,45 @@
+const ddbImageBase = "https://media.dndbeyond.com/mega-menu";
+
+export const cardList = [
+  {
+    label: "Classes",
+    imageUrl: `${ddbImageBase}/aef3e4b2ac24457aa251c761d41ff07b.jpg`,
+    link: "https://www.dndbeyond.com/classes",
+  },
+  {
+    label: "Backgrounds",
+    imageUrl: `${ddbImageBase}/6e31ff6ea1f04ca2af9896f3f6d1b383.jpg`,
+    link: "https://www.dndbeyond.com/backgrounds",
+  },
+  {
+    label: "Species",
+    imageUrl: `${ddbImageBase}/8b551f9a1c2c4db09d65cdd7c139f9d5.jpg`,
+    link: `https://www.dndbeyond.com/species`,
+  },
+  {
+    label: "Feats",
+    imageUrl: `${ddbImageBase}/a69ab5bf67b03308893b582dbef700e9.jpg`,
+    link: "https://www.dndbeyond.com/feats",
+  },
+  {
+    label: "Spells",
+    imageUrl: `${ddbImageBase}/a9eac9081b6240ca8d6325ca4766345e.png`,
+    link: "https://www.dndbeyond.com/spells",
+  },
+  {
+    label: "Equipment",
+    imageUrl: `${ddbImageBase}/b778ff3ca3f18e5f75ad4b348615cab5.jpg`,
+    link: "https://www.dndbeyond.com/equipment",
+  },
+  {
+    label: "Magic Items",
+    imageUrl: `${ddbImageBase}/c06b79eae8ee234d1cea4688e117152b.jpg`,
+    link: "https://www.dndbeyond.com/magic-items",
+  },
+  {
+    label: "Monsters",
+    imageUrl: `${ddbImageBase}/36ee49066331fc36e3b37147d123463a.jpg`,
+    imagePosition: "center 11%",
+    link: "https://www.dndbeyond.com/monsters",
+  },
+];
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/components/MegaMenu/MegaMenuMediaPanel/MegaMenuMediaPanelData.ts b/ddb_main/node_modules/@dndbeyond/ttui/components/MegaMenu/MegaMenuMediaPanel/MegaMenuMediaPanelData.ts
new file mode 100644
index 0000000..adb72a2
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/components/MegaMenu/MegaMenuMediaPanel/MegaMenuMediaPanelData.ts
@@ -0,0 +1,26 @@
+import { twitchUrl, youtubeUrl } from "../../../shared/constants";
+
+const ddbImageBase = "https://media.dndbeyond.com/mega-menu";
+
+export const primaryItems = [
+  {
+    label: "Community Update",
+    imageUrl: `${ddbImageBase}/c2979f81837d8ee7c113a874da2909db.png`,
+    link: "https://www.dndbeyond.com/community-update",
+  },
+  {
+    label: "Twitch",
+    imageUrl: `${ddbImageBase}/443085c3173d345e90d29881d8442a59.png`,
+    link: twitchUrl,
+  },
+  {
+    label: "Youtube",
+    imageUrl: `${ddbImageBase}/d5e1b6d07482834ebfcbc1f04bd6476d.png`,
+    link: youtubeUrl,
+  },
+  {
+    label: "Changelog",
+    imageUrl: `${ddbImageBase}/4af3d4c196428ab0809cf71d332d540d.png`,
+    link: "https://www.dndbeyond.com/changelog",
+  },
+];
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/components/MegaMenu/MegaMenuToolsPanel/MegaMenuToolsData.ts b/ddb_main/node_modules/@dndbeyond/ttui/components/MegaMenu/MegaMenuToolsPanel/MegaMenuToolsData.ts
new file mode 100644
index 0000000..601c0c0
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/components/MegaMenu/MegaMenuToolsPanel/MegaMenuToolsData.ts
@@ -0,0 +1,37 @@
+import type { MegaMenuCardProps } from "../MegaMenuCard";
+
+const ddbImageBase = "https://media.dndbeyond.com/mega-menu";
+
+export const characterBuilder: MegaMenuCardProps = {
+  label: "Character Builder",
+  imageUrl: `${ddbImageBase}/323a928e32eff87dee85dfbe0793ce12.jpg`,
+  link: "https://www.dndbeyond.com/characters/builder",
+};
+
+export const primaryItems: MegaMenuCardProps[] = [
+  {
+    label: "Maps",
+    imageUrl: `${ddbImageBase}/049ddb9085342521d25c5230451cfd45.jpg`,
+    link: "https://www.dndbeyond.com/games",
+    flags: [{ label: "Beta", variant: "info" }],
+  },
+  {
+    label: "Encounters",
+    imageUrl: `${ddbImageBase}/e434a8385f9619f0d52480c3c3987059.jpg`,
+    link: "https://www.dndbeyond.com/encounter-builder",
+    flags: [{ label: "Beta", variant: "info" }],
+  },
+];
+
+export const secondaryItems: MegaMenuCardProps[] = [
+  {
+    label: "Mobile App",
+    imageUrl: `${ddbImageBase}/3aa58aac2d02bb52d62204e158b48ce6.jpg`,
+    link: "https://www.dndbeyond.com/player-app",
+  },
+  {
+    label: "Avrae Discord Bot",
+    imageUrl: `${ddbImageBase}/28d923cd45ad209411ef1ff07993721b.jpg`,
+    link: "https://avrae.io/",
+  },
+];
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/components/Select/Select.tsx b/ddb_main/node_modules/@dndbeyond/ttui/components/Select/Select.tsx
new file mode 100644
index 0000000..443cb6a
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/components/Select/Select.tsx
@@ -0,0 +1,129 @@
+"use client";
+
+import AngleDown from "@dndbeyond/fontawesome-cache/svgs/regular/angle-down.svg";
+import XMark from "@dndbeyond/fontawesome-cache/svgs/regular/xmark.svg";
+import clsx from "clsx";
+import type { FC, MouseEvent, SelectHTMLAttributes } from "react";
+import { useIsVisible } from "../../hooks/useIsVisible/useIsVisible";
+import { Checkbox } from "../Checkbox";
+import styles from "./Select.module.css";
+
+interface Option {
+  value: string | number;
+  label: string;
+}
+
+interface SelectProps
+  extends Omit<SelectHTMLAttributes<HTMLDivElement>, "value"> {
+  label: string;
+  options: Array<Option>;
+  value: string | string[] | number[];
+  placeholder?: string;
+  onDelete?: (e: MouseEvent) => void;
+  error?: string;
+}
+
+export const Select: FC<SelectProps> = ({
+  className = "",
+  placeholder,
+  name,
+  label,
+  onChange,
+  onDelete,
+  options,
+  value,
+  disabled,
+  error,
+  ...props
+}) => {
+  const { ref, isVisible, setIsVisible } = useIsVisible(false);
+  const multiple = Array.isArray(value) || false;
+  const handleDelete = (e: MouseEvent) => {
+    if (onDelete) {
+      e.stopPropagation();
+      onDelete(e);
+    }
+  };
+  const getDisplay = () => {
+    // If value is an array, show tags
+    if (multiple && Array.isArray(value) && value.length) {
+      return (
+        <span className={styles.tags}>
+          {value.map((v) => (
+            <span
+              className={styles.tag}
+              onClick={(e: MouseEvent) => handleDelete(e)}
+              key={v}
+            >
+              {v}
+              <XMark />
+            </span>
+          ))}
+        </span>
+      );
+    }
+    // If value is string, show string
+    else if (!multiple && value) {
+      return value;
+    }
+    // If there is no value, show the placeholder
+    else {
+      return <span className={styles.placeholder}>{placeholder}</span>;
+    }
+  };
+
+  return (
+    <>
+      <div ref={ref} className={clsx([styles.container, className])} {...props}>
+        <label id={`${name}Label`}>{label}</label>
+        <button
+          className={clsx([styles.button, error && styles.buttonError])}
+          id={`${name}Button`}
+          onClick={() => setIsVisible(!isVisible)}
+          role="combobox"
+          aria-haspopup="listbox"
+          aria-controls={`${name}Dropdown`}
+          aria-labelledby={`${name}Label`}
+          aria-expanded={isVisible}
+          tabIndex={0}
+          disabled={disabled || false}
+        >
+          {getDisplay()}
+          <AngleDown />
+        </button>
+        <div
+          className={styles.options}
+          role="group"
+          id={`${name}Dropdown`}
+          tabIndex={-1}
+        >
+          {options.map((option) =>
+            multiple ? (
+              <Checkbox
+                id={`checkbox-${option.value}`}
+                label={option.label}
+                key={option.value}
+                name={name}
+                value={option.value}
+                onChange={(e) => onChange?.(e)}
+                checked={value.includes(option.value as never)}
+              />
+            ) : (
+              <label className={styles.option} key={option.value}>
+                <input
+                  type="radio"
+                  name={name}
+                  value={option.value}
+                  onChange={(e) => onChange?.(e)}
+                  checked={value === option.value}
+                />
+                {option.label}
+              </label>
+            ),
+          )}
+        </div>
+      </div>
+      {error && <p className={styles.error}>{error}</p>}
+    </>
+  );
+};
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/components/Toast/Toast.tsx b/ddb_main/node_modules/@dndbeyond/ttui/components/Toast/Toast.tsx
new file mode 100644
index 0000000..3eb0890
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/components/Toast/Toast.tsx
@@ -0,0 +1,66 @@
+import clsx from "clsx";
+import { useEffect, useRef, type DialogHTMLAttributes, type FC } from "react";
+import styles from "./Toast.module.css";
+
+/**
+ * Toast Usage
+ * const [open, setOpen] = useState(false);
+ *
+ * const onClick = () => {
+ *  setOpen(true);
+ * };
+ *
+ * const onClose = () => {
+ *  setOpen(false);
+ * };
+ *
+ * <Button onClick={onClick}>Toast</Button>
+ * <Toast
+ *  open={open}
+ *  autoHideDuration={6000}
+ *  onClose={onClose}
+ *  message="Note Archived"
+ * />
+ **/
+
+interface ToastProps extends DialogHTMLAttributes<HTMLDialogElement> {
+  align?: "left" | "right";
+  autoHideDuration?: number;
+  onClose: () => void;
+}
+
+let timer: NodeJS.Timeout | undefined;
+
+export const Toast: FC<ToastProps> = ({
+  align = "left",
+  autoHideDuration = 6000,
+  children,
+  className,
+  onClose,
+  open,
+  ...props
+}) => {
+  const ref = useRef<HTMLDialogElement | null>(null);
+
+  useEffect(() => {
+    if (open) {
+      // Prevent the Toast from grabbing focus
+      ref.current?.setAttribute("open", "open");
+      timer = setTimeout(onClose, autoHideDuration);
+    } else {
+      ref.current?.close?.();
+      timer = undefined;
+    }
+    return () => clearTimeout(timer);
+  }, [autoHideDuration, onClose, open]);
+
+  return (
+    <dialog
+      className={clsx([styles.toast, styles[align], className])}
+      ref={ref}
+      {...props}
+    >
+      {children}
+    </dialog>
+  );
+};
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/components/Tooltip/Tooltip.tsx b/ddb_main/node_modules/@dndbeyond/ttui/components/Tooltip/Tooltip.tsx
new file mode 100644
index 0000000..151ec45
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/components/Tooltip/Tooltip.tsx
@@ -0,0 +1,28 @@
+"use client";
+
+import type { FC } from "react";
+import { Tooltip as ReactTooltip, type ITooltip } from "react-tooltip";
+import styles from "./Tooltip.module.css";
+
+export interface TooltipProps extends ITooltip {
+  id: string;
+  "data-testid"?: string;
+}
+
+export const Tooltip: FC<TooltipProps> = ({
+  id,
+  "data-testid": testId,
+  children,
+  ...props
+}) => {
+  return (
+    <div
+      className={styles.container}
+      {...(testId && { "data-testid": testId })}
+    >
+      <ReactTooltip id={id} className={styles.tooltip} {...props}>
+        {children}
+      </ReactTooltip>
+    </div>
+  );
+};
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/hooks/useIsVisible/useIsVisible.ts b/ddb_main/node_modules/@dndbeyond/ttui/hooks/useIsVisible/useIsVisible.ts
new file mode 100644
index 0000000..db98812
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/hooks/useIsVisible/useIsVisible.ts
@@ -0,0 +1,46 @@
+import { useEffect, useRef, useState, type MutableRefObject } from "react";
+
+/**
+ * A hook to use for determining open and closed states
+ * @param initialValue Whether the component should start visible or not
+ *
+ * @returns {ref} A ref to be given to parent object
+ * @returns {isVisible} Boolean value to decide whether to show
+ * element or not
+ * @returns {setIsVisible} Dispatch function to update the value of
+ * isVisible
+ */
+
+interface Return<T> {
+  ref: MutableRefObject<T | null>;
+  isVisible: boolean;
+  setIsVisible: (value: boolean) => void;
+}
+
+export const useIsVisible = <T = HTMLDivElement>(
+  initialValue: boolean,
+): Return<T> => {
+  const [isVisible, setIsVisible] = useState(initialValue);
+  const ref = useRef<T | null>(null);
+
+  // Handles clicks outside the parent ref
+  const handleClickOutside = (e: MouseEvent) => {
+    const containsElement =
+      e.composedPath().indexOf(ref.current as EventTarget) !== -1;
+
+    if (ref.current && !containsElement) setIsVisible(false);
+  };
+
+  useEffect(
+    () => {
+      document.addEventListener("click", handleClickOutside, true);
+      return () => {
+        document.removeEventListener("click", handleClickOutside, true);
+      };
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [],
+  );
+
+  return { ref, isVisible, setIsVisible };
+};
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/components.ts b/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/components.ts
new file mode 100644
index 0000000..b2cd9a0
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/components.ts
@@ -0,0 +1,77 @@
+import { ThemeOptions } from "@mui/material";
+
+export const components: ThemeOptions["components"] = {
+  MuiButtonBase: {
+    defaultProps: {
+      disableRipple: true,
+    },
+  },
+  MuiDialog: {
+    styleOverrides: {
+      paper: ({ theme }) => ({
+        minWidth: 320,
+        "&.MuiPaper-rounded": {
+          borderRadius: "8px",
+        },
+        "&.MuiPaper-outlined": {
+          borderColor: theme.palette.primary.main,
+        },
+      }),
+    },
+  },
+  MuiGrid: {
+    styleOverrides: {
+      root: {
+        /**
+         * n.b. this is a workaround for bad types on the DialogTitle component,
+         * what I really want there is a Grid, but I don't want to enforce these
+         * styles on any other Grid components that might be passed in, so I add
+         * the className "DdbDialogTitle-root" to target this specific component
+         */
+        "&.DdbDialogTitle-root": {
+          padding: "16px 20px 8px",
+          "& .MuiIconButton-root": {
+            padding: "4px",
+            marginRight: "-8px",
+          },
+        },
+      },
+    },
+  },
+  MuiIconButton: {
+    styleOverrides: {
+      root: {
+        transition: "none",
+        "&:hover": {
+          transition: "none",
+          borderRadius: "3px",
+        },
+      },
+    },
+  },
+  MuiDialogContent: {
+    styleOverrides: {
+      root: {
+        padding: "16px 20px 0",
+      },
+    },
+  },
+  MuiDialogContentText: {
+    styleOverrides: {
+      root: ({ theme }) => ({
+        color: theme.palette.text.primary,
+        letterSpacing: "0.15px",
+        marginBottom: "12px",
+      }),
+    },
+  },
+  MuiButton: {
+    styleOverrides: {
+      root: {
+        fontSize: "15px",
+        lineHeight: 26 / 15,
+        letterSpacing: "0.45px",
+      },
+    },
+  },
+};
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/palette-dark.ts b/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/palette-dark.ts
new file mode 100644
index 0000000..28e2bbb
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/palette-dark.ts
@@ -0,0 +1,95 @@
+import { ThemeOptions } from "@mui/material";
+
+export const palette: ThemeOptions["palette"] = {
+  mode: "dark",
+  text: {
+    primary: "#ecedeeff",
+    secondary: "#ecedeea3",
+    disabled: "#ecedee5c",
+  },
+  primary: {
+    main: "#dcdfe1ff",
+    dark: "#75838bff",
+    light: "#f9fafaff",
+    contrastText: "#000000ff",
+  },
+  secondary: {
+    main: "#00daa6ff",
+    dark: "#00b674ff",
+    light: "#b3efd9ff",
+    contrastText: "#000000ff",
+  },
+  action: {
+    active: "#dcdfe1a3",
+    hover: "#dcdfe11f",
+    selected: "#dcdfe12e",
+    disabled: "#dcdfe166",
+    disabledBackground: "#dcdfe133",
+    focus: "#dcdfe133",
+  },
+  error: {
+    main: "#ed6c02ff",
+    dark: "#c77700ff",
+    light: "#ffb547ff",
+    contrastText: "#ffffffff",
+  },
+  warning: {
+    main: "#ed6c02ff",
+    dark: "#c77700ff",
+    light: "#ffb547ff",
+    contrastText: "#ffffffff",
+  },
+  info: {
+    main: "#2196f3ff",
+    dark: "#0b79d0ff",
+    light: "#64b6f7ff",
+    contrastText: "#ffffffff",
+  },
+  success: {
+    main: "#4caf50ff",
+    dark: "#3b873eff",
+    light: "#7bc67eff",
+    contrastText: "#ffffffff",
+  },
+  background: {
+    paper: "#12181cff",
+    default: "#232b2fff",
+    pane: "#12181cdb",
+  },
+  common: { white: "#ffffffff", black: "#000000ff" },
+  grey: {
+    "50": "#f4f5f5ff",
+    "100": "#ecedeeff",
+    "200": "#dcdfe1ff",
+    "300": "#c4cbceff",
+    "400": "#a2acb2ff",
+    "500": "#75838bff",
+    "600": "#525c63ff",
+    "700": "#374045ff",
+    "800": "#232b2fff",
+    "900": "#12181cff",
+  },
+  rarity: {
+    uncommon: "#7ebe15ff",
+    rare: "#41a9f2ff",
+    veryRare: "#c364e7ff",
+    legendary: "#ffb62aff",
+    artifact: "#f77558ff",
+    contrastText: "#000000ff",
+  },
+  reference: {
+    magicItem: "#41a9f2ff",
+    monster: "#f77558ff",
+    skill: "#7ebe15ff",
+    spell: "#c364e7ff",
+    contrastText: "#000000ff",
+  },
+  message: {
+    check: "#c364e7ff",
+    custom: "#ecedeea3",
+    damage: "#f77558ff",
+    healSave: "#7ebe15ff",
+    initiative: "#ffb62aff",
+    toHit: "#41a9f2ff",
+  },
+};
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/palette-light.ts b/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/palette-light.ts
new file mode 100644
index 0000000..be5d745
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/palette-light.ts
@@ -0,0 +1,89 @@
+import { ThemeOptions } from "@mui/material";
+
+export const palette: ThemeOptions["palette"] = {
+  mode: "light",
+  text: {
+    primary: "#12181cff",
+    secondary: "#12181ca3",
+    disabled: "#12181c5c",
+  },
+  primary: {
+    main: "#374045ff",
+    dark: "#12181cff",
+    light: "#75838bff",
+    contrastText: "#ffffffff",
+  },
+  secondary: {
+    main: "#e40712ff",
+    dark: "#9f271dff",
+    light: "#f77558ff",
+    contrastText: "#ffffffff",
+  },
+  action: {
+    active: "#12181ca3",
+    hover: "#12181c14",
+    selected: "#12181c1f",
+    disabled: "#12181c5c",
+    disabledBackground: "#12181c29",
+    focus: "#12181c29",
+  },
+  error: {
+    main: "#ed6c02ff",
+    dark: "#c77700ff",
+    light: "#ffb547ff",
+    contrastText: "#ffffffff",
+  },
+  warning: {
+    main: "#ed6c02ff",
+    dark: "#c77700ff",
+    light: "#ffb547ff",
+    contrastText: "#ffffffff",
+  },
+  info: {
+    main: "#2196f3ff",
+    dark: "#0b79d0ff",
+    light: "#64b6f7ff",
+    contrastText: "#ffffffff",
+  },
+  success: {
+    main: "#4caf50ff",
+    dark: "#3b873eff",
+    light: "#7bc67eff",
+    contrastText: "#ffffffff",
+  },
+  background: {
+    paper: "#ffffffff",
+    default: "#f4f5f5ff",
+    parchment: "#f9f6efff",
+    scroll: "#eee8dbff",
+  },
+  common: { white: "#ffffffff", black: "#000000ff" },
+  grey: {
+    "50": "#f4f5f5ff",
+    "100": "#ecedeeff",
+    "200": "#dcdfe1ff",
+    "300": "#c4cbceff",
+    "400": "#a2acb2ff",
+    "500": "#75838bff",
+    "600": "#525c63ff",
+    "700": "#374045ff",
+    "800": "#232b2fff",
+    "900": "#12181cff",
+  },
+  rarity: {
+    uncommon: "#009158ff",
+    rare: "#077bd0ff",
+    veryRare: "#9605d4ff",
+    legendary: "#ae5e21ff",
+    artifact: "#c81e18ff",
+    contrastText: "#ffffffff",
+  },
+  reference: {
+    character: "#ee8600ff",
+    magicItem: "#077bd0ff",
+    monster: "#c60000ff",
+    skill: "#009158ff",
+    spell: "#9605d4ff",
+    contrastText: "#ffffffff",
+  },
+};
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/typography.ts b/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/typography.ts
new file mode 100644
index 0000000..b5939ad
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/config/typography.ts
@@ -0,0 +1,113 @@
+import { ThemeOptions } from "@mui/material";
+
+export const typography: ThemeOptions["typography"] = {
+  h1: {
+    fontSize: "64px",
+    fontFamily: "Tiamat Condensed SC",
+    fontWeight: 400,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: 1,
+    lineHeight: "64px",
+  },
+  h2: {
+    fontSize: "48px",
+    fontFamily: "Roboto",
+    fontWeight: 400,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: "normal",
+    lineHeight: "52.8px",
+  },
+  h3: {
+    fontSize: "36px",
+    fontFamily: "Roboto",
+    fontWeight: 400,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: "normal",
+    lineHeight: "43.2px",
+  },
+  h4: {
+    fontSize: "26px",
+    fontFamily: "Roboto",
+    fontWeight: 400,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: "normal",
+    lineHeight: "32.5px",
+  },
+  h5: {
+    fontSize: "20px",
+    fontFamily: "Roboto",
+    fontWeight: 500,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: "normal",
+    lineHeight: "25px",
+  },
+  h6: {
+    fontSize: "16px",
+    fontFamily: "Roboto",
+    fontWeight: 500,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: "normal",
+    lineHeight: "22.4px",
+  },
+  body1: {
+    fontSize: "16px",
+    fontFamily: "Roboto",
+    fontWeight: 400,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: 0.15,
+    lineHeight: "24px",
+  },
+  body2: {
+    fontSize: "14px",
+    fontFamily: "Roboto",
+    fontWeight: 400,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: 0.15,
+    lineHeight: "20.02px",
+  },
+  subtitle1: {
+    fontSize: "16px",
+    fontFamily: "Roboto",
+    fontWeight: 400,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: 0.15,
+    lineHeight: "28px",
+  },
+  subtitle2: {
+    fontSize: "14px",
+    fontFamily: "Roboto",
+    fontWeight: 500,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: 0.1,
+    lineHeight: "21.98px",
+  },
+  overline: {
+    fontSize: "12px",
+    fontFamily: "Roboto",
+    fontWeight: 400,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: 1,
+    lineHeight: "31.92px",
+    textTransform: "uppercase",
+  },
+  caption: {
+    fontSize: "12px",
+    fontFamily: "Roboto",
+    fontWeight: 400,
+    fontStyle: "normal",
+    fontStretch: "normal",
+    letterSpacing: 0.4,
+    lineHeight: "19.92px",
+  },
+};
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/createTheme.ts b/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/createTheme.ts
new file mode 100644
index 0000000..6de2b1e
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/mui/theme/createTheme.ts
@@ -0,0 +1,30 @@
+import { createTheme, ThemeOptions } from "@mui/material";
+import { deepmerge } from "@mui/utils";
+import { components } from "./config/components";
+import { palette as darkThemePalette } from "./config/palette-dark";
+import { palette as lightThemePalette } from "./config/palette-light";
+import { typography } from "./config/typography";
+
+export const createLightTheme = (options: ThemeOptions = {}) =>
+  createTheme(
+    deepmerge(
+      {
+        components,
+        palette: lightThemePalette,
+        typography,
+      },
+      options,
+    ),
+  );
+
+export const createDarkTheme = (options: ThemeOptions = {}) =>
+  createTheme(
+    deepmerge(
+      {
+        components,
+        palette: darkThemePalette,
+        typography,
+      },
+      options,
+    ),
+  );
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/shared/constants.ts b/ddb_main/node_modules/@dndbeyond/ttui/shared/constants.ts
new file mode 100644
index 0000000..5fa2489
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/shared/constants.ts
@@ -0,0 +1,17 @@
+export const signInLabel = "Sign In";
+export const signUpLabel = "Sign Up";
+export const signOutLabel = "Sign Out";
+
+// Social Media Links
+export const discordUrl = "https://www.dndbeyond.com/discord";
+export const facebookUrl = "https://www.facebook.com/dndbeyond";
+export const instagramUrl = "https://www.instagram.com/dndbeyond";
+export const tiktokUrl = "https://www.tiktok.com/@dnd_beyond";
+export const twitchUrl = "https://www.twitch.tv/dndbeyond";
+export const twitterUrl = "https://twitter.com/dndbeyond";
+export const youtubeUrl =
+  "https://www.youtube.com/channel/UCPy-338BEVgDkQade0qJmkw";
+export const googleStoreUrl =
+  "https://play.google.com/store/apps/details?id=com.fandom.playercompanion";
+export const appleStoreUrl =
+  "https://apps.apple.com/us/app/d-d-beyond/id1501810129";
diff --git a/ddb_main/node_modules/@dndbeyond/ttui/themes/wayOfLight.ts b/ddb_main/node_modules/@dndbeyond/ttui/themes/wayOfLight.ts
new file mode 100644
index 0000000..2e8929a
--- /dev/null
+++ b/ddb_main/node_modules/@dndbeyond/ttui/themes/wayOfLight.ts
@@ -0,0 +1,75 @@
+// this implementation is temporary until we can natively dynamically import css files
+// ref: https://react.dev/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022#asset-loading
+const wayOfLight = /* css */ `
+  :root {
+    --ttui_color-primary--main: #374045;
+    --ttui_color-primary--dark: #12181c;
+    --ttui_color-primary--light: #75838b;
+    --ttui_color-primary--contrast: #ffffff;
+
+    --ttui_color-secondary--main: var(--ttui_red-500);
+    --ttui_color-secondary--dark: var(--ttui_red-700);
+    --ttui_color-secondary--light: var(--ttui_red-300);
+    --ttui_color-secondary--contrast: var(--ttui_common-0);
+
+    --ttui_color-error--main: #ed6c02;
+    --ttui_color-error--dark: #c77700;
+    --ttui_color-error--light: #ffb547;
+    --ttui_color-error--contrast: #ffffff;
+
+    --ttui_color-warning--main: #ed6c02;
+    --ttui_color-warning--dark: #c77700;
+    --ttui_color-warning--light: #ffb547;
+    --ttui_color-warning--contrast: #ffffff;
+
+    --ttui_color-info--main: #2196f3;
+    --ttui_color-info--dark: #0b79d0;
+    --ttui_color-info--light: #64b6f7;
+    --ttui_color-info--contrast: #ffffff;
+
+    --ttui_color-success--main: #4caf50;
+    --ttui_color-success--dark: #3b873e;
+    --ttui_color-success--light: #7bc67e;
+    --ttui_color-success--contrast: #ffffff;
+
+    --ttui_color-bg--paper: #ffffff;
+    --ttui_color-bg--default: #f4f5f5;
+    --ttui_color-bg--pane: #f9f6ef;
+    --ttui_color-bg--scroll: #eee8db;
+
+    --ttui_color-rarity--uncommon: #7ebe15;
+    --ttui_color-rarity--rare: #41a9f2;
+    --ttui_color-rarity--veryRare: #c364e7;
+    --ttui_color-rarity--legendary: #ffb62a;
+    --ttui_color-rarity--artifact: #f77558;
+    --ttui_color-rarity--contrast: #000000;
+
+    --ttui_color-reference--character: #ee8600;
+    --ttui_color-reference--magicItem: #41a9f2;
+    --ttui_color-reference--monster: #c60000;
+    --ttui_color-reference--skill: #7ebe15;
+    --ttui_color-reference--spell: #c364e7;
+    --ttui_color-reference--contrast: #000000;
+
+    --ttui_color-message--check: #c364e7;
+    --ttui_color-message--custom: #ecedee;
+    --ttui_color-message--damage: #f77558;
+    --ttui_color-message--healSave: #7ebe15;
+    --ttui_color-message--initiative: #ffb62a;
+    --ttui_color-message--toHit: #41a9f2;
+
+    --ttui_color-text--primary: #12181cff;
+    --ttui_color-text--secondary: #12181ca3;
+    --ttui_color-text--disabled: #12181c5c;
+
+    --ttui_color-action--hover: var(--ttui_grey-100);
+    --ttui_color-action--active: var(--ttui_grey-200);
+    --ttui_color-action--selected: var(--ttui_grey-200);
+
+    --ttui_color-megamenu--main: #26282a;
+    --ttui_color-megamenu--dark: #1c1d1e;
+    --ttui_color-megamenu--contrast: var(--ttui_common-0);
+  }
+`;
+
+export default wayOfLight;
diff --git a/ddb_main/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js b/ddb_main/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
new file mode 100644
index 0000000..e9f84ed
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js
@@ -0,0 +1,583 @@
+import { StyleSheet } from '@emotion/sheet';
+import { dealloc, alloc, next, token, from, peek, delimit, slice, position, RULESET, combine, match, serialize, copy, replace, WEBKIT, MOZ, MS, KEYFRAMES, DECLARATION, hash, charat, strlen, indexof, stringify, COMMENT, rulesheet, middleware, compile } from 'stylis';
+import '@emotion/weak-memoize';
+import '@emotion/memoize';
+
+var identifierWithPointTracking = function identifierWithPointTracking(begin, points, index) {
+  var previous = 0;
+  var character = 0;
+
+  while (true) {
+    previous = character;
+    character = peek(); // &\f
+
+    if (previous === 38 && character === 12) {
+      points[index] = 1;
+    }
+
+    if (token(character)) {
+      break;
+    }
+
+    next();
+  }
+
+  return slice(begin, position);
+};
+
+var toRules = function toRules(parsed, points) {
+  // pretend we've started with a comma
+  var index = -1;
+  var character = 44;
+
+  do {
+    switch (token(character)) {
+      case 0:
+        // &\f
+        if (character === 38 && peek() === 12) {
+          // this is not 100% correct, we don't account for literal sequences here - like for example quoted strings
+          // stylis inserts \f after & to know when & where it should replace this sequence with the context selector
+          // and when it should just concatenate the outer and inner selectors
+          // it's very unlikely for this sequence to actually appear in a different context, so we just leverage this fact here
+          points[index] = 1;
+        }
+
+        parsed[index] += identifierWithPointTracking(position - 1, points, index);
+        break;
+
+      case 2:
+        parsed[index] += delimit(character);
+        break;
+
+      case 4:
+        // comma
+        if (character === 44) {
+          // colon
+          parsed[++index] = peek() === 58 ? '&\f' : '';
+          points[index] = parsed[index].length;
+          break;
+        }
+
+      // fallthrough
+
+      default:
+        parsed[index] += from(character);
+    }
+  } while (character = next());
+
+  return parsed;
+};
+
+var getRules = function getRules(value, points) {
+  return dealloc(toRules(alloc(value), points));
+}; // WeakSet would be more appropriate, but only WeakMap is supported in IE11
+
+
+var fixedElements = /* #__PURE__ */new WeakMap();
+var compat = function compat(element) {
+  if (element.type !== 'rule' || !element.parent || // positive .length indicates that this rule contains pseudo
+  // negative .length indicates that this rule has been already prefixed
+  element.length < 1) {
+    return;
+  }
+
+  var value = element.value,
+      parent = element.parent;
+  var isImplicitRule = element.column === parent.column && element.line === parent.line;
+
+  while (parent.type !== 'rule') {
+    parent = parent.parent;
+    if (!parent) return;
+  } // short-circuit for the simplest case
+
+
+  if (element.props.length === 1 && value.charCodeAt(0) !== 58
+  /* colon */
+  && !fixedElements.get(parent)) {
+    return;
+  } // if this is an implicitly inserted rule (the one eagerly inserted at the each new nested level)
+  // then the props has already been manipulated beforehand as they that array is shared between it and its "rule parent"
+
+
+  if (isImplicitRule) {
+    return;
+  }
+
+  fixedElements.set(element, true);
+  var points = [];
+  var rules = getRules(value, points);
+  var parentRules = parent.props;
+
+  for (var i = 0, k = 0; i < rules.length; i++) {
+    for (var j = 0; j < parentRules.length; j++, k++) {
+      element.props[k] = points[i] ? rules[i].replace(/&\f/g, parentRules[j]) : parentRules[j] + " " + rules[i];
+    }
+  }
+};
+var removeLabel = function removeLabel(element) {
+  if (element.type === 'decl') {
+    var value = element.value;
+
+    if ( // charcode for l
+    value.charCodeAt(0) === 108 && // charcode for b
+    value.charCodeAt(2) === 98) {
+      // this ignores label
+      element["return"] = '';
+      element.value = '';
+    }
+  }
+};
+var ignoreFlag = 'emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason';
+
+var isIgnoringComment = function isIgnoringComment(element) {
+  return element.type === 'comm' && element.children.indexOf(ignoreFlag) > -1;
+};
+
+var createUnsafeSelectorsAlarm = function createUnsafeSelectorsAlarm(cache) {
+  return function (element, index, children) {
+    if (element.type !== 'rule' || cache.compat) return;
+    var unsafePseudoClasses = element.value.match(/(:first|:nth|:nth-last)-child/g);
+
+    if (unsafePseudoClasses) {
+      var isNested = !!element.parent; // in nested rules comments become children of the "auto-inserted" rule and that's always the `element.parent`
+      //
+      // considering this input:
+      // .a {
+      //   .b /* comm */ {}
+      //   color: hotpink;
+      // }
+      // we get output corresponding to this:
+      // .a {
+      //   & {
+      //     /* comm */
+      //     color: hotpink;
+      //   }
+      //   .b {}
+      // }
+
+      var commentContainer = isNested ? element.parent.children : // global rule at the root level
+      children;
+
+      for (var i = commentContainer.length - 1; i >= 0; i--) {
+        var node = commentContainer[i];
+
+        if (node.line < element.line) {
+          break;
+        } // it is quite weird but comments are *usually* put at `column: element.column - 1`
+        // so we seek *from the end* for the node that is earlier than the rule's `element` and check that
+        // this will also match inputs like this:
+        // .a {
+        //   /* comm */
+        //   .b {}
+        // }
+        //
+        // but that is fine
+        //
+        // it would be the easiest to change the placement of the comment to be the first child of the rule:
+        // .a {
+        //   .b { /* comm */ }
+        // }
+        // with such inputs we wouldn't have to search for the comment at all
+        // TODO: consider changing this comment placement in the next major version
+
+
+        if (node.column < element.column) {
+          if (isIgnoringComment(node)) {
+            return;
+          }
+
+          break;
+        }
+      }
+
+      unsafePseudoClasses.forEach(function (unsafePseudoClass) {
+        console.error("The pseudo class \"" + unsafePseudoClass + "\" is potentially unsafe when doing server-side rendering. Try changing it to \"" + unsafePseudoClass.split('-child')[0] + "-of-type\".");
+      });
+    }
+  };
+};
+
+var isImportRule = function isImportRule(element) {
+  return element.type.charCodeAt(1) === 105 && element.type.charCodeAt(0) === 64;
+};
+
+var isPrependedWithRegularRules = function isPrependedWithRegularRules(index, children) {
+  for (var i = index - 1; i >= 0; i--) {
+    if (!isImportRule(children[i])) {
+      return true;
+    }
+  }
+
+  return false;
+}; // use this to remove incorrect elements from further processing
+// so they don't get handed to the `sheet` (or anything else)
+// as that could potentially lead to additional logs which in turn could be overhelming to the user
+
+
+var nullifyElement = function nullifyElement(element) {
+  element.type = '';
+  element.value = '';
+  element["return"] = '';
+  element.children = '';
+  element.props = '';
+};
+
+var incorrectImportAlarm = function incorrectImportAlarm(element, index, children) {
+  if (!isImportRule(element)) {
+    return;
+  }
+
+  if (element.parent) {
+    console.error("`@import` rules can't be nested inside other rules. Please move it to the top level and put it before regular rules. Keep in mind that they can only be used within global styles.");
+    nullifyElement(element);
+  } else if (isPrependedWithRegularRules(index, children)) {
+    console.error("`@import` rules can't be after other rules. Please put your `@import` rules before your other rules.");
+    nullifyElement(element);
+  }
+};
+
+/* eslint-disable no-fallthrough */
+
+function prefix(value, length) {
+  switch (hash(value, length)) {
+    // color-adjust
+    case 5103:
+      return WEBKIT + 'print-' + value + value;
+    // animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)
+
+    case 5737:
+    case 4201:
+    case 3177:
+    case 3433:
+    case 1641:
+    case 4457:
+    case 2921: // text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break
+
+    case 5572:
+    case 6356:
+    case 5844:
+    case 3191:
+    case 6645:
+    case 3005: // mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,
+
+    case 6391:
+    case 5879:
+    case 5623:
+    case 6135:
+    case 4599:
+    case 4855: // background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)
+
+    case 4215:
+    case 6389:
+    case 5109:
+    case 5365:
+    case 5621:
+    case 3829:
+      return WEBKIT + value + value;
+    // appearance, user-select, transform, hyphens, text-size-adjust
+
+    case 5349:
+    case 4246:
+    case 4810:
+    case 6968:
+    case 2756:
+      return WEBKIT + value + MOZ + value + MS + value + value;
+    // flex, flex-direction
+
+    case 6828:
+    case 4268:
+      return WEBKIT + value + MS + value + value;
+    // order
+
+    case 6165:
+      return WEBKIT + value + MS + 'flex-' + value + value;
+    // align-items
+
+    case 5187:
+      return WEBKIT + value + replace(value, /(\w+).+(:[^]+)/, WEBKIT + 'box-$1$2' + MS + 'flex-$1$2') + value;
+    // align-self
+
+    case 5443:
+      return WEBKIT + value + MS + 'flex-item-' + replace(value, /flex-|-self/, '') + value;
+    // align-content
+
+    case 4675:
+      return WEBKIT + value + MS + 'flex-line-pack' + replace(value, /align-content|flex-|-self/, '') + value;
+    // flex-shrink
+
+    case 5548:
+      return WEBKIT + value + MS + replace(value, 'shrink', 'negative') + value;
+    // flex-basis
+
+    case 5292:
+      return WEBKIT + value + MS + replace(value, 'basis', 'preferred-size') + value;
+    // flex-grow
+
+    case 6060:
+      return WEBKIT + 'box-' + replace(value, '-grow', '') + WEBKIT + value + MS + replace(value, 'grow', 'positive') + value;
+    // transition
+
+    case 4554:
+      return WEBKIT + replace(value, /([^-])(transform)/g, '$1' + WEBKIT + '$2') + value;
+    // cursor
+
+    case 6187:
+      return replace(replace(replace(value, /(zoom-|grab)/, WEBKIT + '$1'), /(image-set)/, WEBKIT + '$1'), value, '') + value;
+    // background, background-image
+
+    case 5495:
+    case 3959:
+      return replace(value, /(image-set\([^]*)/, WEBKIT + '$1' + '$`$1');
+    // justify-content
+
+    case 4968:
+      return replace(replace(value, /(.+:)(flex-)?(.*)/, WEBKIT + 'box-pack:$3' + MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + WEBKIT + value + value;
+    // (margin|padding)-inline-(start|end)
+
+    case 4095:
+    case 3583:
+    case 4068:
+    case 2532:
+      return replace(value, /(.+)-inline(.+)/, WEBKIT + '$1$2') + value;
+    // (min|max)?(width|height|inline-size|block-size)
+
+    case 8116:
+    case 7059:
+    case 5753:
+    case 5535:
+    case 5445:
+    case 5701:
+    case 4933:
+    case 4677:
+    case 5533:
+    case 5789:
+    case 5021:
+    case 4765:
+      // stretch, max-content, min-content, fill-available
+      if (strlen(value) - 1 - length > 6) switch (charat(value, length + 1)) {
+        // (m)ax-content, (m)in-content
+        case 109:
+          // -
+          if (charat(value, length + 4) !== 45) break;
+        // (f)ill-available, (f)it-content
+
+        case 102:
+          return replace(value, /(.+:)(.+)-([^]+)/, '$1' + WEBKIT + '$2-$3' + '$1' + MOZ + (charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value;
+        // (s)tretch
+
+        case 115:
+          return ~indexof(value, 'stretch') ? prefix(replace(value, 'stretch', 'fill-available'), length) + value : value;
+      }
+      break;
+    // position: sticky
+
+    case 4949:
+      // (s)ticky?
+      if (charat(value, length + 1) !== 115) break;
+    // display: (flex|inline-flex)
+
+    case 6444:
+      switch (charat(value, strlen(value) - 3 - (~indexof(value, '!important') && 10))) {
+        // stic(k)y
+        case 107:
+          return replace(value, ':', ':' + WEBKIT) + value;
+        // (inline-)?fl(e)x
+
+        case 101:
+          return replace(value, /(.+:)([^;!]+)(;|!.+)?/, '$1' + WEBKIT + (charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + WEBKIT + '$2$3' + '$1' + MS + '$2box$3') + value;
+      }
+
+      break;
+    // writing-mode
+
+    case 5936:
+      switch (charat(value, length + 11)) {
+        // vertical-l(r)
+        case 114:
+          return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'tb') + value;
+        // vertical-r(l)
+
+        case 108:
+          return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'tb-rl') + value;
+        // horizontal(-)tb
+
+        case 45:
+          return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'lr') + value;
+      }
+
+      return WEBKIT + value + MS + value + value;
+  }
+
+  return value;
+}
+
+var prefixer = function prefixer(element, index, children, callback) {
+  if (element.length > -1) if (!element["return"]) switch (element.type) {
+    case DECLARATION:
+      element["return"] = prefix(element.value, element.length);
+      break;
+
+    case KEYFRAMES:
+      return serialize([copy(element, {
+        value: replace(element.value, '@', '@' + WEBKIT)
+      })], callback);
+
+    case RULESET:
+      if (element.length) return combine(element.props, function (value) {
+        switch (match(value, /(::plac\w+|:read-\w+)/)) {
+          // :read-(only|write)
+          case ':read-only':
+          case ':read-write':
+            return serialize([copy(element, {
+              props: [replace(value, /:(read-\w+)/, ':' + MOZ + '$1')]
+            })], callback);
+          // :placeholder
+
+          case '::placeholder':
+            return serialize([copy(element, {
+              props: [replace(value, /:(plac\w+)/, ':' + WEBKIT + 'input-$1')]
+            }), copy(element, {
+              props: [replace(value, /:(plac\w+)/, ':' + MOZ + '$1')]
+            }), copy(element, {
+              props: [replace(value, /:(plac\w+)/, MS + 'input-$1')]
+            })], callback);
+        }
+
+        return '';
+      });
+  }
+};
+
+var defaultStylisPlugins = [prefixer];
+
+var createCache = function createCache(options) {
+  var key = options.key;
+
+  if (process.env.NODE_ENV !== 'production' && !key) {
+    throw new Error("You have to configure `key` for your cache. Please make sure it's unique (and not equal to 'css') as it's used for linking styles to your cache.\n" + "If multiple caches share the same key they might \"fight\" for each other's style elements.");
+  }
+
+  if (key === 'css') {
+    var ssrStyles = document.querySelectorAll("style[data-emotion]:not([data-s])"); // get SSRed styles out of the way of React's hydration
+    // document.head is a safe place to move them to(though note document.head is not necessarily the last place they will be)
+    // note this very very intentionally targets all style elements regardless of the key to ensure
+    // that creating a cache works inside of render of a React component
+
+    Array.prototype.forEach.call(ssrStyles, function (node) {
+      // we want to only move elements which have a space in the data-emotion attribute value
+      // because that indicates that it is an Emotion 11 server-side rendered style elements
+      // while we will already ignore Emotion 11 client-side inserted styles because of the :not([data-s]) part in the selector
+      // Emotion 10 client-side inserted styles did not have data-s (but importantly did not have a space in their data-emotion attributes)
+      // so checking for the space ensures that loading Emotion 11 after Emotion 10 has inserted some styles
+      // will not result in the Emotion 10 styles being destroyed
+      var dataEmotionAttribute = node.getAttribute('data-emotion');
+
+      if (dataEmotionAttribute.indexOf(' ') === -1) {
+        return;
+      }
+      document.head.appendChild(node);
+      node.setAttribute('data-s', '');
+    });
+  }
+
+  var stylisPlugins = options.stylisPlugins || defaultStylisPlugins;
+
+  if (process.env.NODE_ENV !== 'production') {
+    // $FlowFixMe
+    if (/[^a-z-]/.test(key)) {
+      throw new Error("Emotion key must only contain lower case alphabetical characters and - but \"" + key + "\" was passed");
+    }
+  }
+
+  var inserted = {};
+  var container;
+  var nodesToHydrate = [];
+
+  {
+    container = options.container || document.head;
+    Array.prototype.forEach.call( // this means we will ignore elements which don't have a space in them which
+    // means that the style elements we're looking at are only Emotion 11 server-rendered style elements
+    document.querySelectorAll("style[data-emotion^=\"" + key + " \"]"), function (node) {
+      var attrib = node.getAttribute("data-emotion").split(' '); // $FlowFixMe
+
+      for (var i = 1; i < attrib.length; i++) {
+        inserted[attrib[i]] = true;
+      }
+
+      nodesToHydrate.push(node);
+    });
+  }
+
+  var _insert;
+
+  var omnipresentPlugins = [compat, removeLabel];
+
+  if (process.env.NODE_ENV !== 'production') {
+    omnipresentPlugins.push(createUnsafeSelectorsAlarm({
+      get compat() {
+        return cache.compat;
+      }
+
+    }), incorrectImportAlarm);
+  }
+
+  {
+    var currentSheet;
+    var finalizingPlugins = [stringify, process.env.NODE_ENV !== 'production' ? function (element) {
+      if (!element.root) {
+        if (element["return"]) {
+          currentSheet.insert(element["return"]);
+        } else if (element.value && element.type !== COMMENT) {
+          // insert empty rule in non-production environments
+          // so @emotion/jest can grab `key` from the (JS)DOM for caches without any rules inserted yet
+          currentSheet.insert(element.value + "{}");
+        }
+      }
+    } : rulesheet(function (rule) {
+      currentSheet.insert(rule);
+    })];
+    var serializer = middleware(omnipresentPlugins.concat(stylisPlugins, finalizingPlugins));
+
+    var stylis = function stylis(styles) {
+      return serialize(compile(styles), serializer);
+    };
+
+    _insert = function insert(selector, serialized, sheet, shouldCache) {
+      currentSheet = sheet;
+
+      if (process.env.NODE_ENV !== 'production' && serialized.map !== undefined) {
+        currentSheet = {
+          insert: function insert(rule) {
+            sheet.insert(rule + serialized.map);
+          }
+        };
+      }
+
+      stylis(selector ? selector + "{" + serialized.styles + "}" : serialized.styles);
+
+      if (shouldCache) {
+        cache.inserted[serialized.name] = true;
+      }
+    };
+  }
+
+  var cache = {
+    key: key,
+    sheet: new StyleSheet({
+      key: key,
+      container: container,
+      nonce: options.nonce,
+      speedy: options.speedy,
+      prepend: options.prepend,
+      insertionPoint: options.insertionPoint
+    }),
+    nonce: options.nonce,
+    inserted: inserted,
+    registered: {},
+    insert: _insert
+  };
+  cache.sheet.hydrate(nodesToHydrate);
+  return cache;
+};
+
+export { createCache as default };
diff --git a/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Enum.js b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Enum.js
new file mode 100644
index 0000000..77f2cef
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Enum.js
@@ -0,0 +1,21 @@
+export var MS = '-ms-'
+export var MOZ = '-moz-'
+export var WEBKIT = '-webkit-'
+
+export var COMMENT = 'comm'
+export var RULESET = 'rule'
+export var DECLARATION = 'decl'
+
+export var PAGE = '@page'
+export var MEDIA = '@media'
+export var IMPORT = '@import'
+export var CHARSET = '@charset'
+export var VIEWPORT = '@viewport'
+export var SUPPORTS = '@supports'
+export var DOCUMENT = '@document'
+export var NAMESPACE = '@namespace'
+export var KEYFRAMES = '@keyframes'
+export var FONT_FACE = '@font-face'
+export var COUNTER_STYLE = '@counter-style'
+export var FONT_FEATURE_VALUES = '@font-feature-values'
+export var LAYER = '@layer'
diff --git a/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Middleware.js b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Middleware.js
new file mode 100644
index 0000000..faf234f
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Middleware.js
@@ -0,0 +1,108 @@
+import {MS, MOZ, WEBKIT, RULESET, KEYFRAMES, DECLARATION} from './Enum.js'
+import {match, charat, substr, strlen, sizeof, replace, combine} from './Utility.js'
+import {copy, tokenize} from './Tokenizer.js'
+import {serialize} from './Serializer.js'
+import {prefix} from './Prefixer.js'
+
+/**
+ * @param {function[]} collection
+ * @return {function}
+ */
+export function middleware (collection) {
+	var length = sizeof(collection)
+
+	return function (element, index, children, callback) {
+		var output = ''
+
+		for (var i = 0; i < length; i++)
+			output += collection[i](element, index, children, callback) || ''
+
+		return output
+	}
+}
+
+/**
+ * @param {function} callback
+ * @return {function}
+ */
+export function rulesheet (callback) {
+	return function (element) {
+		if (!element.root)
+			if (element = element.return)
+				callback(element)
+	}
+}
+
+/**
+ * @param {object} element
+ * @param {number} index
+ * @param {object[]} children
+ * @param {function} callback
+ */
+export function prefixer (element, index, children, callback) {
+	if (element.length > -1)
+		if (!element.return)
+			switch (element.type) {
+				case DECLARATION: element.return = prefix(element.value, element.length, children)
+					return
+				case KEYFRAMES:
+					return serialize([copy(element, {value: replace(element.value, '@', '@' + WEBKIT)})], callback)
+				case RULESET:
+					if (element.length)
+						return combine(element.props, function (value) {
+							switch (match(value, /(::plac\w+|:read-\w+)/)) {
+								// :read-(only|write)
+								case ':read-only': case ':read-write':
+									return serialize([copy(element, {props: [replace(value, /:(read-\w+)/, ':' + MOZ + '$1')]})], callback)
+								// :placeholder
+								case '::placeholder':
+									return serialize([
+										copy(element, {props: [replace(value, /:(plac\w+)/, ':' + WEBKIT + 'input-$1')]}),
+										copy(element, {props: [replace(value, /:(plac\w+)/, ':' + MOZ + '$1')]}),
+										copy(element, {props: [replace(value, /:(plac\w+)/, MS + 'input-$1')]})
+									], callback)
+							}
+
+							return ''
+						})
+			}
+}
+
+/**
+ * @param {object} element
+ * @param {number} index
+ * @param {object[]} children
+ */
+export function namespace (element) {
+	switch (element.type) {
+		case RULESET:
+			element.props = element.props.map(function (value) {
+				return combine(tokenize(value), function (value, index, children) {
+					switch (charat(value, 0)) {
+						// \f
+						case 12:
+							return substr(value, 1, strlen(value))
+						// \0 ( + > ~
+						case 0: case 40: case 43: case 62: case 126:
+							return value
+						// :
+						case 58:
+							if (children[++index] === 'global')
+								children[index] = '', children[++index] = '\f' + substr(children[index], index = 1, -1)
+						// \s
+						case 32:
+							return index === 1 ? '' : value
+						default:
+							switch (index) {
+								case 0: element = value
+									return sizeof(children) > 1 ? '' : value
+								case index = sizeof(children) - 1: case 2:
+									return index === 2 ? value + element + element : value + element
+								default:
+									return value
+							}
+					}
+				})
+			})
+	}
+}
diff --git a/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Parser.js b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Parser.js
new file mode 100644
index 0000000..68c5c02
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Parser.js
@@ -0,0 +1,191 @@
+import {COMMENT, RULESET, DECLARATION} from './Enum.js'
+import {abs, charat, trim, from, sizeof, strlen, substr, append, replace, indexof} from './Utility.js'
+import {node, char, prev, next, peek, caret, alloc, dealloc, delimit, whitespace, escaping, identifier, commenter} from './Tokenizer.js'
+
+/**
+ * @param {string} value
+ * @return {object[]}
+ */
+export function compile (value) {
+	return dealloc(parse('', null, null, null, [''], value = alloc(value), 0, [0], value))
+}
+
+/**
+ * @param {string} value
+ * @param {object} root
+ * @param {object?} parent
+ * @param {string[]} rule
+ * @param {string[]} rules
+ * @param {string[]} rulesets
+ * @param {number[]} pseudo
+ * @param {number[]} points
+ * @param {string[]} declarations
+ * @return {object}
+ */
+export function parse (value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {
+	var index = 0
+	var offset = 0
+	var length = pseudo
+	var atrule = 0
+	var property = 0
+	var previous = 0
+	var variable = 1
+	var scanning = 1
+	var ampersand = 1
+	var character = 0
+	var type = ''
+	var props = rules
+	var children = rulesets
+	var reference = rule
+	var characters = type
+
+	while (scanning)
+		switch (previous = character, character = next()) {
+			// (
+			case 40:
+				if (previous != 108 && charat(characters, length - 1) == 58) {
+					if (indexof(characters += replace(delimit(character), '&', '&\f'), '&\f') != -1)
+						ampersand = -1
+					break
+				}
+			// " ' [
+			case 34: case 39: case 91:
+				characters += delimit(character)
+				break
+			// \t \n \r \s
+			case 9: case 10: case 13: case 32:
+				characters += whitespace(previous)
+				break
+			// \
+			case 92:
+				characters += escaping(caret() - 1, 7)
+				continue
+			// /
+			case 47:
+				switch (peek()) {
+					case 42: case 47:
+						append(comment(commenter(next(), caret()), root, parent), declarations)
+						break
+					default:
+						characters += '/'
+				}
+				break
+			// {
+			case 123 * variable:
+				points[index++] = strlen(characters) * ampersand
+			// } ; \0
+			case 125 * variable: case 59: case 0:
+				switch (character) {
+					// \0 }
+					case 0: case 125: scanning = 0
+					// ;
+					case 59 + offset: if (ampersand == -1) characters = replace(characters, /\f/g, '')
+						if (property > 0 && (strlen(characters) - length))
+							append(property > 32 ? declaration(characters + ';', rule, parent, length - 1) : declaration(replace(characters, ' ', '') + ';', rule, parent, length - 2), declarations)
+						break
+					// @ ;
+					case 59: characters += ';'
+					// { rule/at-rule
+					default:
+						append(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length), rulesets)
+
+						if (character === 123)
+							if (offset === 0)
+								parse(characters, root, reference, reference, props, rulesets, length, points, children)
+							else
+								switch (atrule === 99 && charat(characters, 3) === 110 ? 100 : atrule) {
+									// d l m s
+									case 100: case 108: case 109: case 115:
+										parse(value, reference, reference, rule && append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length), children), rules, children, length, points, rule ? props : children)
+										break
+									default:
+										parse(characters, reference, reference, reference, [''], children, 0, points, children)
+								}
+				}
+
+				index = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo
+				break
+			// :
+			case 58:
+				length = 1 + strlen(characters), property = previous
+			default:
+				if (variable < 1)
+					if (character == 123)
+						--variable
+					else if (character == 125 && variable++ == 0 && prev() == 125)
+						continue
+
+				switch (characters += from(character), character * variable) {
+					// &
+					case 38:
+						ampersand = offset > 0 ? 1 : (characters += '\f', -1)
+						break
+					// ,
+					case 44:
+						points[index++] = (strlen(characters) - 1) * ampersand, ampersand = 1
+						break
+					// @
+					case 64:
+						// -
+						if (peek() === 45)
+							characters += delimit(next())
+
+						atrule = peek(), offset = length = strlen(type = characters += identifier(caret())), character++
+						break
+					// -
+					case 45:
+						if (previous === 45 && strlen(characters) == 2)
+							variable = 0
+				}
+		}
+
+	return rulesets
+}
+
+/**
+ * @param {string} value
+ * @param {object} root
+ * @param {object?} parent
+ * @param {number} index
+ * @param {number} offset
+ * @param {string[]} rules
+ * @param {number[]} points
+ * @param {string} type
+ * @param {string[]} props
+ * @param {string[]} children
+ * @param {number} length
+ * @return {object}
+ */
+export function ruleset (value, root, parent, index, offset, rules, points, type, props, children, length) {
+	var post = offset - 1
+	var rule = offset === 0 ? rules : ['']
+	var size = sizeof(rule)
+
+	for (var i = 0, j = 0, k = 0; i < index; ++i)
+		for (var x = 0, y = substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x)
+			if (z = trim(j > 0 ? rule[x] + ' ' + y : replace(y, /&\f/g, rule[x])))
+				props[k++] = z
+
+	return node(value, root, parent, offset === 0 ? RULESET : type, props, children, length)
+}
+
+/**
+ * @param {number} value
+ * @param {object} root
+ * @param {object?} parent
+ * @return {object}
+ */
+export function comment (value, root, parent) {
+	return node(value, root, parent, COMMENT, from(char()), substr(value, 2, -2), 0)
+}
+
+/**
+ * @param {string} value
+ * @param {object} root
+ * @param {object?} parent
+ * @param {number} length
+ * @return {object}
+ */
+export function declaration (value, root, parent, length) {
+	return node(value, root, parent, DECLARATION, substr(value, 0, length), substr(value, length + 1, -1), length)
+}
diff --git a/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Serializer.js b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Serializer.js
new file mode 100644
index 0000000..0c1ffa3
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Serializer.js
@@ -0,0 +1,36 @@
+import {IMPORT, LAYER, COMMENT, RULESET, DECLARATION, KEYFRAMES} from './Enum.js'
+import {strlen, sizeof} from './Utility.js'
+
+/**
+ * @param {object[]} children
+ * @param {function} callback
+ * @return {string}
+ */
+export function serialize (children, callback) {
+	var output = ''
+	var length = sizeof(children)
+
+	for (var i = 0; i < length; i++)
+		output += callback(children[i], i, children, callback) || ''
+
+	return output
+}
+
+/**
+ * @param {object} element
+ * @param {number} index
+ * @param {object[]} children
+ * @param {function} callback
+ * @return {string}
+ */
+export function stringify (element, index, children, callback) {
+	switch (element.type) {
+		case LAYER: if (element.children.length) break
+		case IMPORT: case DECLARATION: return element.return = element.return || element.value
+		case COMMENT: return ''
+		case KEYFRAMES: return element.return = element.value + '{' + serialize(element.children, callback) + '}'
+		case RULESET: element.value = element.props.join(',')
+	}
+
+	return strlen(children = serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : ''
+}
diff --git a/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Tokenizer.js b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Tokenizer.js
new file mode 100644
index 0000000..dd482ce
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Tokenizer.js
@@ -0,0 +1,246 @@
+import {from, trim, charat, strlen, substr, append, assign} from './Utility.js'
+
+export var line = 1
+export var column = 1
+export var length = 0
+export var position = 0
+export var character = 0
+export var characters = ''
+
+/**
+ * @param {string} value
+ * @param {object | null} root
+ * @param {object | null} parent
+ * @param {string} type
+ * @param {string[] | string} props
+ * @param {object[] | string} children
+ * @param {number} length
+ */
+export function node (value, root, parent, type, props, children, length) {
+	return {value: value, root: root, parent: parent, type: type, props: props, children: children, line: line, column: column, length: length, return: ''}
+}
+
+/**
+ * @param {object} root
+ * @param {object} props
+ * @return {object}
+ */
+export function copy (root, props) {
+	return assign(node('', null, null, '', null, null, 0), root, {length: -root.length}, props)
+}
+
+/**
+ * @return {number}
+ */
+export function char () {
+	return character
+}
+
+/**
+ * @return {number}
+ */
+export function prev () {
+	character = position > 0 ? charat(characters, --position) : 0
+
+	if (column--, character === 10)
+		column = 1, line--
+
+	return character
+}
+
+/**
+ * @return {number}
+ */
+export function next () {
+	character = position < length ? charat(characters, position++) : 0
+
+	if (column++, character === 10)
+		column = 1, line++
+
+	return character
+}
+
+/**
+ * @return {number}
+ */
+export function peek () {
+	return charat(characters, position)
+}
+
+/**
+ * @return {number}
+ */
+export function caret () {
+	return position
+}
+
+/**
+ * @param {number} begin
+ * @param {number} end
+ * @return {string}
+ */
+export function slice (begin, end) {
+	return substr(characters, begin, end)
+}
+
+/**
+ * @param {number} type
+ * @return {number}
+ */
+export function token (type) {
+	switch (type) {
+		// \0 \t \n \r \s whitespace token
+		case 0: case 9: case 10: case 13: case 32:
+			return 5
+		// ! + , / > @ ~ isolate token
+		case 33: case 43: case 44: case 47: case 62: case 64: case 126:
+		// ; { } breakpoint token
+		case 59: case 123: case 125:
+			return 4
+		// : accompanied token
+		case 58:
+			return 3
+		// " ' ( [ opening delimit token
+		case 34: case 39: case 40: case 91:
+			return 2
+		// ) ] closing delimit token
+		case 41: case 93:
+			return 1
+	}
+
+	return 0
+}
+
+/**
+ * @param {string} value
+ * @return {any[]}
+ */
+export function alloc (value) {
+	return line = column = 1, length = strlen(characters = value), position = 0, []
+}
+
+/**
+ * @param {any} value
+ * @return {any}
+ */
+export function dealloc (value) {
+	return characters = '', value
+}
+
+/**
+ * @param {number} type
+ * @return {string}
+ */
+export function delimit (type) {
+	return trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)))
+}
+
+/**
+ * @param {string} value
+ * @return {string[]}
+ */
+export function tokenize (value) {
+	return dealloc(tokenizer(alloc(value)))
+}
+
+/**
+ * @param {number} type
+ * @return {string}
+ */
+export function whitespace (type) {
+	while (character = peek())
+		if (character < 33)
+			next()
+		else
+			break
+
+	return token(type) > 2 || token(character) > 3 ? '' : ' '
+}
+
+/**
+ * @param {string[]} children
+ * @return {string[]}
+ */
+export function tokenizer (children) {
+	while (next())
+		switch (token(character)) {
+			case 0: append(identifier(position - 1), children)
+				break
+			case 2: append(delimit(character), children)
+				break
+			default: append(from(character), children)
+		}
+
+	return children
+}
+
+/**
+ * @param {number} index
+ * @param {number} count
+ * @return {string}
+ */
+export function escaping (index, count) {
+	while (--count && next())
+		// not 0-9 A-F a-f
+		if (character < 48 || character > 102 || (character > 57 && character < 65) || (character > 70 && character < 97))
+			break
+
+	return slice(index, caret() + (count < 6 && peek() == 32 && next() == 32))
+}
+
+/**
+ * @param {number} type
+ * @return {number}
+ */
+export function delimiter (type) {
+	while (next())
+		switch (character) {
+			// ] ) " '
+			case type:
+				return position
+			// " '
+			case 34: case 39:
+				if (type !== 34 && type !== 39)
+					delimiter(character)
+				break
+			// (
+			case 40:
+				if (type === 41)
+					delimiter(type)
+				break
+			// \
+			case 92:
+				next()
+				break
+		}
+
+	return position
+}
+
+/**
+ * @param {number} type
+ * @param {number} index
+ * @return {number}
+ */
+export function commenter (type, index) {
+	while (next())
+		// //
+		if (type + character === 47 + 10)
+			break
+		// /*
+		else if (type + character === 42 + 42 && peek() === 47)
+			break
+
+	return '/*' + slice(index, position - 1) + '*' + from(type === 47 ? type : next())
+}
+
+/**
+ * @param {number} index
+ * @return {string}
+ */
+export function identifier (index) {
+	while (!token(peek()))
+		next()
+
+	return slice(index, position)
+}
diff --git a/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Utility.js b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Utility.js
new file mode 100644
index 0000000..702fe6e
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/cache/node_modules/stylis/src/Utility.js
@@ -0,0 +1,115 @@
+/**
+ * @param {number}
+ * @return {number}
+ */
+export var abs = Math.abs
+
+/**
+ * @param {number}
+ * @return {string}
+ */
+export var from = String.fromCharCode
+
+/**
+ * @param {object}
+ * @return {object}
+ */
+export var assign = Object.assign
+
+/**
+ * @param {string} value
+ * @param {number} length
+ * @return {number}
+ */
+export function hash (value, length) {
+	return charat(value, 0) ^ 45 ? (((((((length << 2) ^ charat(value, 0)) << 2) ^ charat(value, 1)) << 2) ^ charat(value, 2)) << 2) ^ charat(value, 3) : 0
+}
+
+/**
+ * @param {string} value
+ * @return {string}
+ */
+export function trim (value) {
+	return value.trim()
+}
+
+/**
+ * @param {string} value
+ * @param {RegExp} pattern
+ * @return {string?}
+ */
+export function match (value, pattern) {
+	return (value = pattern.exec(value)) ? value[0] : value
+}
+
+/**
+ * @param {string} value
+ * @param {(string|RegExp)} pattern
+ * @param {string} replacement
+ * @return {string}
+ */
+export function replace (value, pattern, replacement) {
+	return value.replace(pattern, replacement)
+}
+
+/**
+ * @param {string} value
+ * @param {string} search
+ * @return {number}
+ */
+export function indexof (value, search) {
+	return value.indexOf(search)
+}
+
+/**
+ * @param {string} value
+ * @param {number} index
+ * @return {number}
+ */
+export function charat (value, index) {
+	return value.charCodeAt(index) | 0
+}
+
+/**
+ * @param {string} value
+ * @param {number} begin
+ * @param {number} end
+ * @return {string}
+ */
+export function substr (value, begin, end) {
+	return value.slice(begin, end)
+}
+
+/**
+ * @param {string} value
+ * @return {number}
+ */
+export function strlen (value) {
+	return value.length
+}
+
+/**
+ * @param {any[]} value
+ * @return {number}
+ */
+export function sizeof (value) {
+	return value.length
+}
+
+/**
+ * @param {any} value
+ * @param {any[]} array
+ * @return {any}
+ */
+export function append (value, array) {
+	return array.push(value), value
+}
+
+/**
+ * @param {string[]} array
+ * @param {function} callback
+ * @return {string}
+ */
+export function combine (array, callback) {
+	return array.map(callback).join('')
+}
diff --git a/ddb_main/node_modules/@emotion/hash/dist/emotion-hash.esm.js b/ddb_main/node_modules/@emotion/hash/dist/emotion-hash.esm.js
new file mode 100644
index 0000000..f80e8a0
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/hash/dist/emotion-hash.esm.js
@@ -0,0 +1,55 @@
+/* eslint-disable */
+// Inspired by https://github.com/garycourt/murmurhash-js
+// Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86
+function murmur2(str) {
+  // 'm' and 'r' are mixing constants generated offline.
+  // They're not really 'magic', they just happen to work well.
+  // const m = 0x5bd1e995;
+  // const r = 24;
+  // Initialize the hash
+  var h = 0; // Mix 4 bytes at a time into the hash
+
+  var k,
+      i = 0,
+      len = str.length;
+
+  for (; len >= 4; ++i, len -= 4) {
+    k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24;
+    k =
+    /* Math.imul(k, m): */
+    (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16);
+    k ^=
+    /* k >>> r: */
+    k >>> 24;
+    h =
+    /* Math.imul(k, m): */
+    (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16) ^
+    /* Math.imul(h, m): */
+    (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
+  } // Handle the last few bytes of the input array
+
+
+  switch (len) {
+    case 3:
+      h ^= (str.charCodeAt(i + 2) & 0xff) << 16;
+
+    case 2:
+      h ^= (str.charCodeAt(i + 1) & 0xff) << 8;
+
+    case 1:
+      h ^= str.charCodeAt(i) & 0xff;
+      h =
+      /* Math.imul(h, m): */
+      (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
+  } // Do a few final mixes of the hash to ensure the last few
+  // bytes are well-incorporated.
+
+
+  h ^= h >>> 13;
+  h =
+  /* Math.imul(h, m): */
+  (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
+  return ((h ^ h >>> 15) >>> 0).toString(36);
+}
+
+export { murmur2 as default };
diff --git a/ddb_main/node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js b/ddb_main/node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js
new file mode 100644
index 0000000..f3453ce
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js
@@ -0,0 +1,15 @@
+import memoize from '@emotion/memoize';
+
+var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|disableRemotePlayback|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23
+
+var isPropValid = /* #__PURE__ */memoize(function (prop) {
+  return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111
+  /* o */
+  && prop.charCodeAt(1) === 110
+  /* n */
+  && prop.charCodeAt(2) < 91;
+}
+/* Z+1 */
+);
+
+export { isPropValid as default };
diff --git a/ddb_main/node_modules/@emotion/memoize/dist/emotion-memoize.esm.js b/ddb_main/node_modules/@emotion/memoize/dist/emotion-memoize.esm.js
new file mode 100644
index 0000000..2bffef4
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/memoize/dist/emotion-memoize.esm.js
@@ -0,0 +1,9 @@
+function memoize(fn) {
+  var cache = Object.create(null);
+  return function (arg) {
+    if (cache[arg] === undefined) cache[arg] = fn(arg);
+    return cache[arg];
+  };
+}
+
+export { memoize as default };
diff --git a/ddb_main/node_modules/@emotion/react/_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js b/ddb_main/node_modules/@emotion/react/_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js
new file mode 100644
index 0000000..321fe46
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/react/_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js
@@ -0,0 +1,11 @@
+import hoistNonReactStatics$1 from 'hoist-non-react-statics';
+
+// this file isolates this package that is not tree-shakeable
+// and if this module doesn't actually contain any logic of its own
+// then Rollup just use 'hoist-non-react-statics' directly in other chunks
+
+var hoistNonReactStatics = (function (targetComponent, sourceComponent) {
+  return hoistNonReactStatics$1(targetComponent, sourceComponent);
+});
+
+export { hoistNonReactStatics as default };
diff --git a/ddb_main/node_modules/@emotion/react/dist/emotion-element-43c6fea0.browser.esm.js b/ddb_main/node_modules/@emotion/react/dist/emotion-element-43c6fea0.browser.esm.js
new file mode 100644
index 0000000..a9d6059
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/react/dist/emotion-element-43c6fea0.browser.esm.js
@@ -0,0 +1,262 @@
+import * as React from 'react';
+import { useContext, forwardRef } from 'react';
+import createCache from '@emotion/cache';
+import _extends from '@babel/runtime/helpers/esm/extends';
+import weakMemoize from '@emotion/weak-memoize';
+import hoistNonReactStatics from '../_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js';
+import { getRegisteredStyles, registerStyles, insertStyles } from '@emotion/utils';
+import { serializeStyles } from '@emotion/serialize';
+import { useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks';
+
+var isBrowser = "object" !== 'undefined';
+var hasOwn = {}.hasOwnProperty;
+
+var EmotionCacheContext = /* #__PURE__ */React.createContext( // we're doing this to avoid preconstruct's dead code elimination in this one case
+// because this module is primarily intended for the browser and node
+// but it's also required in react native and similar environments sometimes
+// and we could have a special build just for that
+// but this is much easier and the native packages
+// might use a different theme context in the future anyway
+typeof HTMLElement !== 'undefined' ? /* #__PURE__ */createCache({
+  key: 'css'
+}) : null);
+
+if (process.env.NODE_ENV !== 'production') {
+  EmotionCacheContext.displayName = 'EmotionCacheContext';
+}
+
+var CacheProvider = EmotionCacheContext.Provider;
+var __unsafe_useEmotionCache = function useEmotionCache() {
+  return useContext(EmotionCacheContext);
+};
+
+var withEmotionCache = function withEmotionCache(func) {
+  // $FlowFixMe
+  return /*#__PURE__*/forwardRef(function (props, ref) {
+    // the cache will never be null in the browser
+    var cache = useContext(EmotionCacheContext);
+    return func(props, cache, ref);
+  });
+};
+
+if (!isBrowser) {
+  withEmotionCache = function withEmotionCache(func) {
+    return function (props) {
+      var cache = useContext(EmotionCacheContext);
+
+      if (cache === null) {
+        // yes, we're potentially creating this on every render
+        // it doesn't actually matter though since it's only on the server
+        // so there will only every be a single render
+        // that could change in the future because of suspense and etc. but for now,
+        // this works and i don't want to optimise for a future thing that we aren't sure about
+        cache = createCache({
+          key: 'css'
+        });
+        return /*#__PURE__*/React.createElement(EmotionCacheContext.Provider, {
+          value: cache
+        }, func(props, cache));
+      } else {
+        return func(props, cache);
+      }
+    };
+  };
+}
+
+var ThemeContext = /* #__PURE__ */React.createContext({});
+
+if (process.env.NODE_ENV !== 'production') {
+  ThemeContext.displayName = 'EmotionThemeContext';
+}
+
+var useTheme = function useTheme() {
+  return React.useContext(ThemeContext);
+};
+
+var getTheme = function getTheme(outerTheme, theme) {
+  if (typeof theme === 'function') {
+    var mergedTheme = theme(outerTheme);
+
+    if (process.env.NODE_ENV !== 'production' && (mergedTheme == null || typeof mergedTheme !== 'object' || Array.isArray(mergedTheme))) {
+      throw new Error('[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!');
+    }
+
+    return mergedTheme;
+  }
+
+  if (process.env.NODE_ENV !== 'production' && (theme == null || typeof theme !== 'object' || Array.isArray(theme))) {
+    throw new Error('[ThemeProvider] Please make your theme prop a plain object');
+  }
+
+  return _extends({}, outerTheme, theme);
+};
+
+var createCacheWithTheme = /* #__PURE__ */weakMemoize(function (outerTheme) {
+  return weakMemoize(function (theme) {
+    return getTheme(outerTheme, theme);
+  });
+});
+var ThemeProvider = function ThemeProvider(props) {
+  var theme = React.useContext(ThemeContext);
+
+  if (props.theme !== theme) {
+    theme = createCacheWithTheme(theme)(props.theme);
+  }
+
+  return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
+    value: theme
+  }, props.children);
+};
+function withTheme(Component) {
+  var componentName = Component.displayName || Component.name || 'Component';
+
+  var render = function render(props, ref) {
+    var theme = React.useContext(ThemeContext);
+    return /*#__PURE__*/React.createElement(Component, _extends({
+      theme: theme,
+      ref: ref
+    }, props));
+  }; // $FlowFixMe
+
+
+  var WithTheme = /*#__PURE__*/React.forwardRef(render);
+  WithTheme.displayName = "WithTheme(" + componentName + ")";
+  return hoistNonReactStatics(WithTheme, Component);
+}
+
+var getLastPart = function getLastPart(functionName) {
+  // The match may be something like 'Object.createEmotionProps' or
+  // 'Loader.prototype.render'
+  var parts = functionName.split('.');
+  return parts[parts.length - 1];
+};
+
+var getFunctionNameFromStackTraceLine = function getFunctionNameFromStackTraceLine(line) {
+  // V8
+  var match = /^\s+at\s+([A-Za-z0-9$.]+)\s/.exec(line);
+  if (match) return getLastPart(match[1]); // Safari / Firefox
+
+  match = /^([A-Za-z0-9$.]+)@/.exec(line);
+  if (match) return getLastPart(match[1]);
+  return undefined;
+};
+
+var internalReactFunctionNames = /* #__PURE__ */new Set(['renderWithHooks', 'processChild', 'finishClassComponent', 'renderToString']); // These identifiers come from error stacks, so they have to be valid JS
+// identifiers, thus we only need to replace what is a valid character for JS,
+// but not for CSS.
+
+var sanitizeIdentifier = function sanitizeIdentifier(identifier) {
+  return identifier.replace(/\$/g, '-');
+};
+
+var getLabelFromStackTrace = function getLabelFromStackTrace(stackTrace) {
+  if (!stackTrace) return undefined;
+  var lines = stackTrace.split('\n');
+
+  for (var i = 0; i < lines.length; i++) {
+    var functionName = getFunctionNameFromStackTraceLine(lines[i]); // The first line of V8 stack traces is just "Error"
+
+    if (!functionName) continue; // If we reach one of these, we have gone too far and should quit
+
+    if (internalReactFunctionNames.has(functionName)) break; // The component name is the first function in the stack that starts with an
+    // uppercase letter
+
+    if (/^[A-Z]/.test(functionName)) return sanitizeIdentifier(functionName);
+  }
+
+  return undefined;
+};
+
+var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';
+var labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';
+var createEmotionProps = function createEmotionProps(type, props) {
+  if (process.env.NODE_ENV !== 'production' && typeof props.css === 'string' && // check if there is a css declaration
+  props.css.indexOf(':') !== -1) {
+    throw new Error("Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css`" + props.css + "`");
+  }
+
+  var newProps = {};
+
+  for (var key in props) {
+    if (hasOwn.call(props, key)) {
+      newProps[key] = props[key];
+    }
+  }
+
+  newProps[typePropName] = type; // For performance, only call getLabelFromStackTrace in development and when
+  // the label hasn't already been computed
+
+  if (process.env.NODE_ENV !== 'production' && !!props.css && (typeof props.css !== 'object' || typeof props.css.name !== 'string' || props.css.name.indexOf('-') === -1)) {
+    var label = getLabelFromStackTrace(new Error().stack);
+    if (label) newProps[labelPropName] = label;
+  }
+
+  return newProps;
+};
+
+var Insertion = function Insertion(_ref) {
+  var cache = _ref.cache,
+      serialized = _ref.serialized,
+      isStringTag = _ref.isStringTag;
+  registerStyles(cache, serialized, isStringTag);
+  useInsertionEffectAlwaysWithSyncFallback(function () {
+    return insertStyles(cache, serialized, isStringTag);
+  });
+
+  return null;
+};
+
+var Emotion = /* #__PURE__ */withEmotionCache(function (props, cache, ref) {
+  var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works
+  // not passing the registered cache to serializeStyles because it would
+  // make certain babel optimisations not possible
+
+  if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {
+    cssProp = cache.registered[cssProp];
+  }
+
+  var WrappedComponent = props[typePropName];
+  var registeredStyles = [cssProp];
+  var className = '';
+
+  if (typeof props.className === 'string') {
+    className = getRegisteredStyles(cache.registered, registeredStyles, props.className);
+  } else if (props.className != null) {
+    className = props.className + " ";
+  }
+
+  var serialized = serializeStyles(registeredStyles, undefined, React.useContext(ThemeContext));
+
+  if (process.env.NODE_ENV !== 'production' && serialized.name.indexOf('-') === -1) {
+    var labelFromStack = props[labelPropName];
+
+    if (labelFromStack) {
+      serialized = serializeStyles([serialized, 'label:' + labelFromStack + ';']);
+    }
+  }
+
+  className += cache.key + "-" + serialized.name;
+  var newProps = {};
+
+  for (var key in props) {
+    if (hasOwn.call(props, key) && key !== 'css' && key !== typePropName && (process.env.NODE_ENV === 'production' || key !== labelPropName)) {
+      newProps[key] = props[key];
+    }
+  }
+
+  newProps.ref = ref;
+  newProps.className = className;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Insertion, {
+    cache: cache,
+    serialized: serialized,
+    isStringTag: typeof WrappedComponent === 'string'
+  }), /*#__PURE__*/React.createElement(WrappedComponent, newProps));
+});
+
+if (process.env.NODE_ENV !== 'production') {
+  Emotion.displayName = 'EmotionCssPropInternal';
+}
+
+var Emotion$1 = Emotion;
+
+export { CacheProvider as C, Emotion$1 as E, ThemeContext as T, __unsafe_useEmotionCache as _, ThemeProvider as a, withTheme as b, createEmotionProps as c, hasOwn as h, isBrowser as i, useTheme as u, withEmotionCache as w };
diff --git a/ddb_main/node_modules/@emotion/react/dist/emotion-react.browser.esm.js b/ddb_main/node_modules/@emotion/react/dist/emotion-react.browser.esm.js
new file mode 100644
index 0000000..be0819e
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/react/dist/emotion-react.browser.esm.js
@@ -0,0 +1,442 @@
+import { h as hasOwn, E as Emotion, c as createEmotionProps, w as withEmotionCache, T as ThemeContext, i as isBrowser$1 } from './emotion-element-43c6fea0.browser.esm.js';
+export { C as CacheProvider, T as ThemeContext, a as ThemeProvider, _ as __unsafe_useEmotionCache, u as useTheme, w as withEmotionCache, b as withTheme } from './emotion-element-43c6fea0.browser.esm.js';
+import * as React from 'react';
+import { insertStyles, registerStyles, getRegisteredStyles } from '@emotion/utils';
+import { useInsertionEffectWithLayoutFallback, useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks';
+import { serializeStyles } from '@emotion/serialize';
+import '@emotion/cache';
+import '@babel/runtime/helpers/extends';
+import '@emotion/weak-memoize';
+import '../_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js';
+import 'hoist-non-react-statics';
+
+var pkg = {
+	name: "@emotion/react",
+	version: "11.11.4",
+	main: "dist/emotion-react.cjs.js",
+	module: "dist/emotion-react.esm.js",
+	browser: {
+		"./dist/emotion-react.esm.js": "./dist/emotion-react.browser.esm.js"
+	},
+	exports: {
+		".": {
+			module: {
+				worker: "./dist/emotion-react.worker.esm.js",
+				browser: "./dist/emotion-react.browser.esm.js",
+				"default": "./dist/emotion-react.esm.js"
+			},
+			"import": "./dist/emotion-react.cjs.mjs",
+			"default": "./dist/emotion-react.cjs.js"
+		},
+		"./jsx-runtime": {
+			module: {
+				worker: "./jsx-runtime/dist/emotion-react-jsx-runtime.worker.esm.js",
+				browser: "./jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js",
+				"default": "./jsx-runtime/dist/emotion-react-jsx-runtime.esm.js"
+			},
+			"import": "./jsx-runtime/dist/emotion-react-jsx-runtime.cjs.mjs",
+			"default": "./jsx-runtime/dist/emotion-react-jsx-runtime.cjs.js"
+		},
+		"./_isolated-hnrs": {
+			module: {
+				worker: "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.worker.esm.js",
+				browser: "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js",
+				"default": "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.esm.js"
+			},
+			"import": "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.cjs.mjs",
+			"default": "./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.cjs.js"
+		},
+		"./jsx-dev-runtime": {
+			module: {
+				worker: "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.worker.esm.js",
+				browser: "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.browser.esm.js",
+				"default": "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.esm.js"
+			},
+			"import": "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.mjs",
+			"default": "./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.js"
+		},
+		"./package.json": "./package.json",
+		"./types/css-prop": "./types/css-prop.d.ts",
+		"./macro": {
+			types: {
+				"import": "./macro.d.mts",
+				"default": "./macro.d.ts"
+			},
+			"default": "./macro.js"
+		}
+	},
+	types: "types/index.d.ts",
+	files: [
+		"src",
+		"dist",
+		"jsx-runtime",
+		"jsx-dev-runtime",
+		"_isolated-hnrs",
+		"types/*.d.ts",
+		"macro.*"
+	],
+	sideEffects: false,
+	author: "Emotion Contributors",
+	license: "MIT",
+	scripts: {
+		"test:typescript": "dtslint types"
+	},
+	dependencies: {
+		"@babel/runtime": "^7.18.3",
+		"@emotion/babel-plugin": "^11.11.0",
+		"@emotion/cache": "^11.11.0",
+		"@emotion/serialize": "^1.1.3",
+		"@emotion/use-insertion-effect-with-fallbacks": "^1.0.1",
+		"@emotion/utils": "^1.2.1",
+		"@emotion/weak-memoize": "^0.3.1",
+		"hoist-non-react-statics": "^3.3.1"
+	},
+	peerDependencies: {
+		react: ">=16.8.0"
+	},
+	peerDependenciesMeta: {
+		"@types/react": {
+			optional: true
+		}
+	},
+	devDependencies: {
+		"@definitelytyped/dtslint": "0.0.112",
+		"@emotion/css": "11.11.2",
+		"@emotion/css-prettifier": "1.1.3",
+		"@emotion/server": "11.11.0",
+		"@emotion/styled": "11.11.0",
+		"html-tag-names": "^1.1.2",
+		react: "16.14.0",
+		"svg-tag-names": "^1.1.1",
+		typescript: "^4.5.5"
+	},
+	repository: "https://github.com/emotion-js/emotion/tree/main/packages/react",
+	publishConfig: {
+		access: "public"
+	},
+	"umd:main": "dist/emotion-react.umd.min.js",
+	preconstruct: {
+		entrypoints: [
+			"./index.js",
+			"./jsx-runtime.js",
+			"./jsx-dev-runtime.js",
+			"./_isolated-hnrs.js"
+		],
+		umdName: "emotionReact",
+		exports: {
+			envConditions: [
+				"browser",
+				"worker"
+			],
+			extra: {
+				"./types/css-prop": "./types/css-prop.d.ts",
+				"./macro": {
+					types: {
+						"import": "./macro.d.mts",
+						"default": "./macro.d.ts"
+					},
+					"default": "./macro.js"
+				}
+			}
+		}
+	}
+};
+
+var jsx = function jsx(type, props) {
+  var args = arguments;
+
+  if (props == null || !hasOwn.call(props, 'css')) {
+    // $FlowFixMe
+    return React.createElement.apply(undefined, args);
+  }
+
+  var argsLength = args.length;
+  var createElementArgArray = new Array(argsLength);
+  createElementArgArray[0] = Emotion;
+  createElementArgArray[1] = createEmotionProps(type, props);
+
+  for (var i = 2; i < argsLength; i++) {
+    createElementArgArray[i] = args[i];
+  } // $FlowFixMe
+
+
+  return React.createElement.apply(null, createElementArgArray);
+};
+
+var warnedAboutCssPropForGlobal = false; // maintain place over rerenders.
+// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild
+// initial client-side render from SSR, use place of hydrating tag
+
+var Global = /* #__PURE__ */withEmotionCache(function (props, cache) {
+  if (process.env.NODE_ENV !== 'production' && !warnedAboutCssPropForGlobal && ( // check for className as well since the user is
+  // probably using the custom createElement which
+  // means it will be turned into a className prop
+  // $FlowFixMe I don't really want to add it to the type since it shouldn't be used
+  props.className || props.css)) {
+    console.error("It looks like you're using the css prop on Global, did you mean to use the styles prop instead?");
+    warnedAboutCssPropForGlobal = true;
+  }
+
+  var styles = props.styles;
+  var serialized = serializeStyles([styles], undefined, React.useContext(ThemeContext));
+
+  if (!isBrowser$1) {
+    var _ref;
+
+    var serializedNames = serialized.name;
+    var serializedStyles = serialized.styles;
+    var next = serialized.next;
+
+    while (next !== undefined) {
+      serializedNames += ' ' + next.name;
+      serializedStyles += next.styles;
+      next = next.next;
+    }
+
+    var shouldCache = cache.compat === true;
+    var rules = cache.insert("", {
+      name: serializedNames,
+      styles: serializedStyles
+    }, cache.sheet, shouldCache);
+
+    if (shouldCache) {
+      return null;
+    }
+
+    return /*#__PURE__*/React.createElement("style", (_ref = {}, _ref["data-emotion"] = cache.key + "-global " + serializedNames, _ref.dangerouslySetInnerHTML = {
+      __html: rules
+    }, _ref.nonce = cache.sheet.nonce, _ref));
+  } // yes, i know these hooks are used conditionally
+  // but it is based on a constant that will never change at runtime
+  // it's effectively like having two implementations and switching them out
+  // so it's not actually breaking anything
+
+
+  var sheetRef = React.useRef();
+  useInsertionEffectWithLayoutFallback(function () {
+    var key = cache.key + "-global"; // use case of https://github.com/emotion-js/emotion/issues/2675
+
+    var sheet = new cache.sheet.constructor({
+      key: key,
+      nonce: cache.sheet.nonce,
+      container: cache.sheet.container,
+      speedy: cache.sheet.isSpeedy
+    });
+    var rehydrating = false; // $FlowFixMe
+
+    var node = document.querySelector("style[data-emotion=\"" + key + " " + serialized.name + "\"]");
+
+    if (cache.sheet.tags.length) {
+      sheet.before = cache.sheet.tags[0];
+    }
+
+    if (node !== null) {
+      rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other <Global/>s
+
+      node.setAttribute('data-emotion', key);
+      sheet.hydrate([node]);
+    }
+
+    sheetRef.current = [sheet, rehydrating];
+    return function () {
+      sheet.flush();
+    };
+  }, [cache]);
+  useInsertionEffectWithLayoutFallback(function () {
+    var sheetRefCurrent = sheetRef.current;
+    var sheet = sheetRefCurrent[0],
+        rehydrating = sheetRefCurrent[1];
+
+    if (rehydrating) {
+      sheetRefCurrent[1] = false;
+      return;
+    }
+
+    if (serialized.next !== undefined) {
+      // insert keyframes
+      insertStyles(cache, serialized.next, true);
+    }
+
+    if (sheet.tags.length) {
+      // if this doesn't exist then it will be null so the style element will be appended
+      var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;
+      sheet.before = element;
+      sheet.flush();
+    }
+
+    cache.insert("", serialized, sheet, false);
+  }, [cache, serialized.name]);
+  return null;
+});
+
+if (process.env.NODE_ENV !== 'production') {
+  Global.displayName = 'EmotionGlobal';
+}
+
+function css() {
+  for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+    args[_key] = arguments[_key];
+  }
+
+  return serializeStyles(args);
+}
+
+var keyframes = function keyframes() {
+  var insertable = css.apply(void 0, arguments);
+  var name = "animation-" + insertable.name; // $FlowFixMe
+
+  return {
+    name: name,
+    styles: "@keyframes " + name + "{" + insertable.styles + "}",
+    anim: 1,
+    toString: function toString() {
+      return "_EMO_" + this.name + "_" + this.styles + "_EMO_";
+    }
+  };
+};
+
+var classnames = function classnames(args) {
+  var len = args.length;
+  var i = 0;
+  var cls = '';
+
+  for (; i < len; i++) {
+    var arg = args[i];
+    if (arg == null) continue;
+    var toAdd = void 0;
+
+    switch (typeof arg) {
+      case 'boolean':
+        break;
+
+      case 'object':
+        {
+          if (Array.isArray(arg)) {
+            toAdd = classnames(arg);
+          } else {
+            if (process.env.NODE_ENV !== 'production' && arg.styles !== undefined && arg.name !== undefined) {
+              console.error('You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n' + '`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component.');
+            }
+
+            toAdd = '';
+
+            for (var k in arg) {
+              if (arg[k] && k) {
+                toAdd && (toAdd += ' ');
+                toAdd += k;
+              }
+            }
+          }
+
+          break;
+        }
+
+      default:
+        {
+          toAdd = arg;
+        }
+    }
+
+    if (toAdd) {
+      cls && (cls += ' ');
+      cls += toAdd;
+    }
+  }
+
+  return cls;
+};
+
+function merge(registered, css, className) {
+  var registeredStyles = [];
+  var rawClassName = getRegisteredStyles(registered, registeredStyles, className);
+
+  if (registeredStyles.length < 2) {
+    return className;
+  }
+
+  return rawClassName + css(registeredStyles);
+}
+
+var Insertion = function Insertion(_ref) {
+  var cache = _ref.cache,
+      serializedArr = _ref.serializedArr;
+  useInsertionEffectAlwaysWithSyncFallback(function () {
+
+    for (var i = 0; i < serializedArr.length; i++) {
+      insertStyles(cache, serializedArr[i], false);
+    }
+  });
+
+  return null;
+};
+
+var ClassNames = /* #__PURE__ */withEmotionCache(function (props, cache) {
+  var hasRendered = false;
+  var serializedArr = [];
+
+  var css = function css() {
+    if (hasRendered && process.env.NODE_ENV !== 'production') {
+      throw new Error('css can only be used during render');
+    }
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    var serialized = serializeStyles(args, cache.registered);
+    serializedArr.push(serialized); // registration has to happen here as the result of this might get consumed by `cx`
+
+    registerStyles(cache, serialized, false);
+    return cache.key + "-" + serialized.name;
+  };
+
+  var cx = function cx() {
+    if (hasRendered && process.env.NODE_ENV !== 'production') {
+      throw new Error('cx can only be used during render');
+    }
+
+    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+      args[_key2] = arguments[_key2];
+    }
+
+    return merge(cache.registered, css, classnames(args));
+  };
+
+  var content = {
+    css: css,
+    cx: cx,
+    theme: React.useContext(ThemeContext)
+  };
+  var ele = props.children(content);
+  hasRendered = true;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Insertion, {
+    cache: cache,
+    serializedArr: serializedArr
+  }), ele);
+});
+
+if (process.env.NODE_ENV !== 'production') {
+  ClassNames.displayName = 'EmotionClassNames';
+}
+
+if (process.env.NODE_ENV !== 'production') {
+  var isBrowser = "object" !== 'undefined'; // #1727, #2905 for some reason Jest and Vitest evaluate modules twice if some consuming module gets mocked
+
+  var isTestEnv = typeof jest !== 'undefined' || typeof vi !== 'undefined';
+
+  if (isBrowser && !isTestEnv) {
+    // globalThis has wide browser support - https://caniuse.com/?search=globalThis, Node.js 12 and later
+    var globalContext = // $FlowIgnore
+    typeof globalThis !== 'undefined' ? globalThis // eslint-disable-line no-undef
+    : isBrowser ? window : global;
+    var globalKey = "__EMOTION_REACT_" + pkg.version.split('.')[0] + "__";
+
+    if (globalContext[globalKey]) {
+      console.warn('You are loading @emotion/react when it is already loaded. Running ' + 'multiple instances may cause problems. This can happen if multiple ' + 'versions are used, or if multiple builds of the same version are ' + 'used.');
+    }
+
+    globalContext[globalKey] = true;
+  }
+}
+
+export { ClassNames, Global, jsx as createElement, css, jsx, keyframes };
diff --git a/ddb_main/node_modules/@emotion/serialize/dist/emotion-serialize.browser.esm.js b/ddb_main/node_modules/@emotion/serialize/dist/emotion-serialize.browser.esm.js
new file mode 100644
index 0000000..eace05a
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/serialize/dist/emotion-serialize.browser.esm.js
@@ -0,0 +1,316 @@
+import hashString from '@emotion/hash';
+import unitless from '@emotion/unitless';
+import memoize from '@emotion/memoize';
+
+var ILLEGAL_ESCAPE_SEQUENCE_ERROR = "You have illegal escape sequence in your template literal, most likely inside content's property value.\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \"content: '\\00d7';\" should become \"content: '\\\\00d7';\".\nYou can read more about this here:\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences";
+var UNDEFINED_AS_OBJECT_KEY_ERROR = "You have passed in falsy value as style object's key (can happen when in example you pass unexported component as computed key).";
+var hyphenateRegex = /[A-Z]|^ms/g;
+var animationRegex = /_EMO_([^_]+?)_([^]*?)_EMO_/g;
+
+var isCustomProperty = function isCustomProperty(property) {
+  return property.charCodeAt(1) === 45;
+};
+
+var isProcessableValue = function isProcessableValue(value) {
+  return value != null && typeof value !== 'boolean';
+};
+
+var processStyleName = /* #__PURE__ */memoize(function (styleName) {
+  return isCustomProperty(styleName) ? styleName : styleName.replace(hyphenateRegex, '-$&').toLowerCase();
+});
+
+var processStyleValue = function processStyleValue(key, value) {
+  switch (key) {
+    case 'animation':
+    case 'animationName':
+      {
+        if (typeof value === 'string') {
+          return value.replace(animationRegex, function (match, p1, p2) {
+            cursor = {
+              name: p1,
+              styles: p2,
+              next: cursor
+            };
+            return p1;
+          });
+        }
+      }
+  }
+
+  if (unitless[key] !== 1 && !isCustomProperty(key) && typeof value === 'number' && value !== 0) {
+    return value + 'px';
+  }
+
+  return value;
+};
+
+if (process.env.NODE_ENV !== 'production') {
+  var contentValuePattern = /(var|attr|counters?|url|element|(((repeating-)?(linear|radial))|conic)-gradient)\(|(no-)?(open|close)-quote/;
+  var contentValues = ['normal', 'none', 'initial', 'inherit', 'unset'];
+  var oldProcessStyleValue = processStyleValue;
+  var msPattern = /^-ms-/;
+  var hyphenPattern = /-(.)/g;
+  var hyphenatedCache = {};
+
+  processStyleValue = function processStyleValue(key, value) {
+    if (key === 'content') {
+      if (typeof value !== 'string' || contentValues.indexOf(value) === -1 && !contentValuePattern.test(value) && (value.charAt(0) !== value.charAt(value.length - 1) || value.charAt(0) !== '"' && value.charAt(0) !== "'")) {
+        throw new Error("You seem to be using a value for 'content' without quotes, try replacing it with `content: '\"" + value + "\"'`");
+      }
+    }
+
+    var processed = oldProcessStyleValue(key, value);
+
+    if (processed !== '' && !isCustomProperty(key) && key.indexOf('-') !== -1 && hyphenatedCache[key] === undefined) {
+      hyphenatedCache[key] = true;
+      console.error("Using kebab-case for css properties in objects is not supported. Did you mean " + key.replace(msPattern, 'ms-').replace(hyphenPattern, function (str, _char) {
+        return _char.toUpperCase();
+      }) + "?");
+    }
+
+    return processed;
+  };
+}
+
+var noComponentSelectorMessage = 'Component selectors can only be used in conjunction with ' + '@emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware ' + 'compiler transform.';
+
+function handleInterpolation(mergedProps, registered, interpolation) {
+  if (interpolation == null) {
+    return '';
+  }
+
+  if (interpolation.__emotion_styles !== undefined) {
+    if (process.env.NODE_ENV !== 'production' && interpolation.toString() === 'NO_COMPONENT_SELECTOR') {
+      throw new Error(noComponentSelectorMessage);
+    }
+
+    return interpolation;
+  }
+
+  switch (typeof interpolation) {
+    case 'boolean':
+      {
+        return '';
+      }
+
+    case 'object':
+      {
+        if (interpolation.anim === 1) {
+          cursor = {
+            name: interpolation.name,
+            styles: interpolation.styles,
+            next: cursor
+          };
+          return interpolation.name;
+        }
+
+        if (interpolation.styles !== undefined) {
+          var next = interpolation.next;
+
+          if (next !== undefined) {
+            // not the most efficient thing ever but this is a pretty rare case
+            // and there will be very few iterations of this generally
+            while (next !== undefined) {
+              cursor = {
+                name: next.name,
+                styles: next.styles,
+                next: cursor
+              };
+              next = next.next;
+            }
+          }
+
+          var styles = interpolation.styles + ";";
+
+          if (process.env.NODE_ENV !== 'production' && interpolation.map !== undefined) {
+            styles += interpolation.map;
+          }
+
+          return styles;
+        }
+
+        return createStringFromObject(mergedProps, registered, interpolation);
+      }
+
+    case 'function':
+      {
+        if (mergedProps !== undefined) {
+          var previousCursor = cursor;
+          var result = interpolation(mergedProps);
+          cursor = previousCursor;
+          return handleInterpolation(mergedProps, registered, result);
+        } else if (process.env.NODE_ENV !== 'production') {
+          console.error('Functions that are interpolated in css calls will be stringified.\n' + 'If you want to have a css call based on props, create a function that returns a css call like this\n' + 'let dynamicStyle = (props) => css`color: ${props.color}`\n' + 'It can be called directly with props or interpolated in a styled call like this\n' + "let SomeComponent = styled('div')`${dynamicStyle}`");
+        }
+
+        break;
+      }
+
+    case 'string':
+      if (process.env.NODE_ENV !== 'production') {
+        var matched = [];
+        var replaced = interpolation.replace(animationRegex, function (match, p1, p2) {
+          var fakeVarName = "animation" + matched.length;
+          matched.push("const " + fakeVarName + " = keyframes`" + p2.replace(/^@keyframes animation-\w+/, '') + "`");
+          return "${" + fakeVarName + "}";
+        });
+
+        if (matched.length) {
+          console.error('`keyframes` output got interpolated into plain string, please wrap it with `css`.\n\n' + 'Instead of doing this:\n\n' + [].concat(matched, ["`" + replaced + "`"]).join('\n') + '\n\nYou should wrap it with `css` like this:\n\n' + ("css`" + replaced + "`"));
+        }
+      }
+
+      break;
+  } // finalize string values (regular strings and functions interpolated into css calls)
+
+
+  if (registered == null) {
+    return interpolation;
+  }
+
+  var cached = registered[interpolation];
+  return cached !== undefined ? cached : interpolation;
+}
+
+function createStringFromObject(mergedProps, registered, obj) {
+  var string = '';
+
+  if (Array.isArray(obj)) {
+    for (var i = 0; i < obj.length; i++) {
+      string += handleInterpolation(mergedProps, registered, obj[i]) + ";";
+    }
+  } else {
+    for (var _key in obj) {
+      var value = obj[_key];
+
+      if (typeof value !== 'object') {
+        if (registered != null && registered[value] !== undefined) {
+          string += _key + "{" + registered[value] + "}";
+        } else if (isProcessableValue(value)) {
+          string += processStyleName(_key) + ":" + processStyleValue(_key, value) + ";";
+        }
+      } else {
+        if (_key === 'NO_COMPONENT_SELECTOR' && process.env.NODE_ENV !== 'production') {
+          throw new Error(noComponentSelectorMessage);
+        }
+
+        if (Array.isArray(value) && typeof value[0] === 'string' && (registered == null || registered[value[0]] === undefined)) {
+          for (var _i = 0; _i < value.length; _i++) {
+            if (isProcessableValue(value[_i])) {
+              string += processStyleName(_key) + ":" + processStyleValue(_key, value[_i]) + ";";
+            }
+          }
+        } else {
+          var interpolated = handleInterpolation(mergedProps, registered, value);
+
+          switch (_key) {
+            case 'animation':
+            case 'animationName':
+              {
+                string += processStyleName(_key) + ":" + interpolated + ";";
+                break;
+              }
+
+            default:
+              {
+                if (process.env.NODE_ENV !== 'production' && _key === 'undefined') {
+                  console.error(UNDEFINED_AS_OBJECT_KEY_ERROR);
+                }
+
+                string += _key + "{" + interpolated + "}";
+              }
+          }
+        }
+      }
+    }
+  }
+
+  return string;
+}
+
+var labelPattern = /label:\s*([^\s;\n{]+)\s*(;|$)/g;
+var sourceMapPattern;
+
+if (process.env.NODE_ENV !== 'production') {
+  sourceMapPattern = /\/\*#\ssourceMappingURL=data:application\/json;\S+\s+\*\//g;
+} // this is the cursor for keyframes
+// keyframes are stored on the SerializedStyles object as a linked list
+
+
+var cursor;
+var serializeStyles = function serializeStyles(args, registered, mergedProps) {
+  if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null && args[0].styles !== undefined) {
+    return args[0];
+  }
+
+  var stringMode = true;
+  var styles = '';
+  cursor = undefined;
+  var strings = args[0];
+
+  if (strings == null || strings.raw === undefined) {
+    stringMode = false;
+    styles += handleInterpolation(mergedProps, registered, strings);
+  } else {
+    if (process.env.NODE_ENV !== 'production' && strings[0] === undefined) {
+      console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);
+    }
+
+    styles += strings[0];
+  } // we start at 1 since we've already handled the first arg
+
+
+  for (var i = 1; i < args.length; i++) {
+    styles += handleInterpolation(mergedProps, registered, args[i]);
+
+    if (stringMode) {
+      if (process.env.NODE_ENV !== 'production' && strings[i] === undefined) {
+        console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);
+      }
+
+      styles += strings[i];
+    }
+  }
+
+  var sourceMap;
+
+  if (process.env.NODE_ENV !== 'production') {
+    styles = styles.replace(sourceMapPattern, function (match) {
+      sourceMap = match;
+      return '';
+    });
+  } // using a global regex with .exec is stateful so lastIndex has to be reset each time
+
+
+  labelPattern.lastIndex = 0;
+  var identifierName = '';
+  var match; // https://esbench.com/bench/5b809c2cf2949800a0f61fb5
+
+  while ((match = labelPattern.exec(styles)) !== null) {
+    identifierName += '-' + // $FlowFixMe we know it's not null
+    match[1];
+  }
+
+  var name = hashString(styles) + identifierName;
+
+  if (process.env.NODE_ENV !== 'production') {
+    // $FlowFixMe SerializedStyles type doesn't have toString property (and we don't want to add it)
+    return {
+      name: name,
+      styles: styles,
+      map: sourceMap,
+      next: cursor,
+      toString: function toString() {
+        return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
+      }
+    };
+  }
+
+  return {
+    name: name,
+    styles: styles,
+    next: cursor
+  };
+};
+
+export { serializeStyles };
diff --git a/ddb_main/node_modules/@emotion/sheet/dist/emotion-sheet.browser.esm.js b/ddb_main/node_modules/@emotion/sheet/dist/emotion-sheet.browser.esm.js
new file mode 100644
index 0000000..e82547b
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/sheet/dist/emotion-sheet.browser.esm.js
@@ -0,0 +1,154 @@
+/*
+
+Based off glamor's StyleSheet, thanks Sunil ❤️
+
+high performance StyleSheet for css-in-js systems
+
+- uses multiple style tags behind the scenes for millions of rules
+- uses `insertRule` for appending in production for *much* faster performance
+
+// usage
+
+import { StyleSheet } from '@emotion/sheet'
+
+let styleSheet = new StyleSheet({ key: '', container: document.head })
+
+styleSheet.insert('#box { border: 1px solid red; }')
+- appends a css rule into the stylesheet
+
+styleSheet.flush()
+- empties the stylesheet of all its contents
+
+*/
+// $FlowFixMe
+function sheetForTag(tag) {
+  if (tag.sheet) {
+    // $FlowFixMe
+    return tag.sheet;
+  } // this weirdness brought to you by firefox
+
+  /* istanbul ignore next */
+
+
+  for (var i = 0; i < document.styleSheets.length; i++) {
+    if (document.styleSheets[i].ownerNode === tag) {
+      // $FlowFixMe
+      return document.styleSheets[i];
+    }
+  }
+}
+
+function createStyleElement(options) {
+  var tag = document.createElement('style');
+  tag.setAttribute('data-emotion', options.key);
+
+  if (options.nonce !== undefined) {
+    tag.setAttribute('nonce', options.nonce);
+  }
+
+  tag.appendChild(document.createTextNode(''));
+  tag.setAttribute('data-s', '');
+  return tag;
+}
+
+var StyleSheet = /*#__PURE__*/function () {
+  // Using Node instead of HTMLElement since container may be a ShadowRoot
+  function StyleSheet(options) {
+    var _this = this;
+
+    this._insertTag = function (tag) {
+      var before;
+
+      if (_this.tags.length === 0) {
+        if (_this.insertionPoint) {
+          before = _this.insertionPoint.nextSibling;
+        } else if (_this.prepend) {
+          before = _this.container.firstChild;
+        } else {
+          before = _this.before;
+        }
+      } else {
+        before = _this.tags[_this.tags.length - 1].nextSibling;
+      }
+
+      _this.container.insertBefore(tag, before);
+
+      _this.tags.push(tag);
+    };
+
+    this.isSpeedy = options.speedy === undefined ? process.env.NODE_ENV === 'production' : options.speedy;
+    this.tags = [];
+    this.ctr = 0;
+    this.nonce = options.nonce; // key is the value of the data-emotion attribute, it's used to identify different sheets
+
+    this.key = options.key;
+    this.container = options.container;
+    this.prepend = options.prepend;
+    this.insertionPoint = options.insertionPoint;
+    this.before = null;
+  }
+
+  var _proto = StyleSheet.prototype;
+
+  _proto.hydrate = function hydrate(nodes) {
+    nodes.forEach(this._insertTag);
+  };
+
+  _proto.insert = function insert(rule) {
+    // the max length is how many rules we have per style tag, it's 65000 in speedy mode
+    // it's 1 in dev because we insert source maps that map a single rule to a location
+    // and you can only have one source map per style tag
+    if (this.ctr % (this.isSpeedy ? 65000 : 1) === 0) {
+      this._insertTag(createStyleElement(this));
+    }
+
+    var tag = this.tags[this.tags.length - 1];
+
+    if (process.env.NODE_ENV !== 'production') {
+      var isImportRule = rule.charCodeAt(0) === 64 && rule.charCodeAt(1) === 105;
+
+      if (isImportRule && this._alreadyInsertedOrderInsensitiveRule) {
+        // this would only cause problem in speedy mode
+        // but we don't want enabling speedy to affect the observable behavior
+        // so we report this error at all times
+        console.error("You're attempting to insert the following rule:\n" + rule + '\n\n`@import` rules must be before all other types of rules in a stylesheet but other rules have already been inserted. Please ensure that `@import` rules are before all other rules.');
+      }
+      this._alreadyInsertedOrderInsensitiveRule = this._alreadyInsertedOrderInsensitiveRule || !isImportRule;
+    }
+
+    if (this.isSpeedy) {
+      var sheet = sheetForTag(tag);
+
+      try {
+        // this is the ultrafast version, works across browsers
+        // the big drawback is that the css won't be editable in devtools
+        sheet.insertRule(rule, sheet.cssRules.length);
+      } catch (e) {
+        if (process.env.NODE_ENV !== 'production' && !/:(-moz-placeholder|-moz-focus-inner|-moz-focusring|-ms-input-placeholder|-moz-read-write|-moz-read-only|-ms-clear|-ms-expand|-ms-reveal){/.test(rule)) {
+          console.error("There was a problem inserting the following rule: \"" + rule + "\"", e);
+        }
+      }
+    } else {
+      tag.appendChild(document.createTextNode(rule));
+    }
+
+    this.ctr++;
+  };
+
+  _proto.flush = function flush() {
+    // $FlowFixMe
+    this.tags.forEach(function (tag) {
+      return tag.parentNode && tag.parentNode.removeChild(tag);
+    });
+    this.tags = [];
+    this.ctr = 0;
+
+    if (process.env.NODE_ENV !== 'production') {
+      this._alreadyInsertedOrderInsensitiveRule = false;
+    }
+  };
+
+  return StyleSheet;
+}();
+
+export { StyleSheet };
diff --git a/ddb_main/node_modules/@emotion/styled/base/dist/emotion-styled-base.browser.esm.js b/ddb_main/node_modules/@emotion/styled/base/dist/emotion-styled-base.browser.esm.js
new file mode 100644
index 0000000..e2894b0
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/styled/base/dist/emotion-styled-base.browser.esm.js
@@ -0,0 +1,177 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import isPropValid from '@emotion/is-prop-valid';
+import { withEmotionCache, ThemeContext } from '@emotion/react';
+import { getRegisteredStyles, registerStyles, insertStyles } from '@emotion/utils';
+import { serializeStyles } from '@emotion/serialize';
+import { useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks';
+
+var testOmitPropsOnStringTag = isPropValid;
+
+var testOmitPropsOnComponent = function testOmitPropsOnComponent(key) {
+  return key !== 'theme';
+};
+
+var getDefaultShouldForwardProp = function getDefaultShouldForwardProp(tag) {
+  return typeof tag === 'string' && // 96 is one less than the char code
+  // for "a" so this is checking that
+  // it's a lowercase character
+  tag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
+};
+var composeShouldForwardProps = function composeShouldForwardProps(tag, options, isReal) {
+  var shouldForwardProp;
+
+  if (options) {
+    var optionsShouldForwardProp = options.shouldForwardProp;
+    shouldForwardProp = tag.__emotion_forwardProp && optionsShouldForwardProp ? function (propName) {
+      return tag.__emotion_forwardProp(propName) && optionsShouldForwardProp(propName);
+    } : optionsShouldForwardProp;
+  }
+
+  if (typeof shouldForwardProp !== 'function' && isReal) {
+    shouldForwardProp = tag.__emotion_forwardProp;
+  }
+
+  return shouldForwardProp;
+};
+
+var ILLEGAL_ESCAPE_SEQUENCE_ERROR = "You have illegal escape sequence in your template literal, most likely inside content's property value.\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \"content: '\\00d7';\" should become \"content: '\\\\00d7';\".\nYou can read more about this here:\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences";
+
+var Insertion = function Insertion(_ref) {
+  var cache = _ref.cache,
+      serialized = _ref.serialized,
+      isStringTag = _ref.isStringTag;
+  registerStyles(cache, serialized, isStringTag);
+  useInsertionEffectAlwaysWithSyncFallback(function () {
+    return insertStyles(cache, serialized, isStringTag);
+  });
+
+  return null;
+};
+
+var createStyled = function createStyled(tag, options) {
+  if (process.env.NODE_ENV !== 'production') {
+    if (tag === undefined) {
+      throw new Error('You are trying to create a styled element with an undefined component.\nYou may have forgotten to import it.');
+    }
+  }
+
+  var isReal = tag.__emotion_real === tag;
+  var baseTag = isReal && tag.__emotion_base || tag;
+  var identifierName;
+  var targetClassName;
+
+  if (options !== undefined) {
+    identifierName = options.label;
+    targetClassName = options.target;
+  }
+
+  var shouldForwardProp = composeShouldForwardProps(tag, options, isReal);
+  var defaultShouldForwardProp = shouldForwardProp || getDefaultShouldForwardProp(baseTag);
+  var shouldUseAs = !defaultShouldForwardProp('as');
+  return function () {
+    var args = arguments;
+    var styles = isReal && tag.__emotion_styles !== undefined ? tag.__emotion_styles.slice(0) : [];
+
+    if (identifierName !== undefined) {
+      styles.push("label:" + identifierName + ";");
+    }
+
+    if (args[0] == null || args[0].raw === undefined) {
+      styles.push.apply(styles, args);
+    } else {
+      if (process.env.NODE_ENV !== 'production' && args[0][0] === undefined) {
+        console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);
+      }
+
+      styles.push(args[0][0]);
+      var len = args.length;
+      var i = 1;
+
+      for (; i < len; i++) {
+        if (process.env.NODE_ENV !== 'production' && args[0][i] === undefined) {
+          console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);
+        }
+
+        styles.push(args[i], args[0][i]);
+      }
+    } // $FlowFixMe: we need to cast StatelessFunctionalComponent to our PrivateStyledComponent class
+
+
+    var Styled = withEmotionCache(function (props, cache, ref) {
+      var FinalTag = shouldUseAs && props.as || baseTag;
+      var className = '';
+      var classInterpolations = [];
+      var mergedProps = props;
+
+      if (props.theme == null) {
+        mergedProps = {};
+
+        for (var key in props) {
+          mergedProps[key] = props[key];
+        }
+
+        mergedProps.theme = React.useContext(ThemeContext);
+      }
+
+      if (typeof props.className === 'string') {
+        className = getRegisteredStyles(cache.registered, classInterpolations, props.className);
+      } else if (props.className != null) {
+        className = props.className + " ";
+      }
+
+      var serialized = serializeStyles(styles.concat(classInterpolations), cache.registered, mergedProps);
+      className += cache.key + "-" + serialized.name;
+
+      if (targetClassName !== undefined) {
+        className += " " + targetClassName;
+      }
+
+      var finalShouldForwardProp = shouldUseAs && shouldForwardProp === undefined ? getDefaultShouldForwardProp(FinalTag) : defaultShouldForwardProp;
+      var newProps = {};
+
+      for (var _key in props) {
+        if (shouldUseAs && _key === 'as') continue;
+
+        if ( // $FlowFixMe
+        finalShouldForwardProp(_key)) {
+          newProps[_key] = props[_key];
+        }
+      }
+
+      newProps.className = className;
+      newProps.ref = ref;
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Insertion, {
+        cache: cache,
+        serialized: serialized,
+        isStringTag: typeof FinalTag === 'string'
+      }), /*#__PURE__*/React.createElement(FinalTag, newProps));
+    });
+    Styled.displayName = identifierName !== undefined ? identifierName : "Styled(" + (typeof baseTag === 'string' ? baseTag : baseTag.displayName || baseTag.name || 'Component') + ")";
+    Styled.defaultProps = tag.defaultProps;
+    Styled.__emotion_real = Styled;
+    Styled.__emotion_base = baseTag;
+    Styled.__emotion_styles = styles;
+    Styled.__emotion_forwardProp = shouldForwardProp;
+    Object.defineProperty(Styled, 'toString', {
+      value: function value() {
+        if (targetClassName === undefined && process.env.NODE_ENV !== 'production') {
+          return 'NO_COMPONENT_SELECTOR';
+        } // $FlowFixMe: coerce undefined to string
+
+
+        return "." + targetClassName;
+      }
+    });
+
+    Styled.withComponent = function (nextTag, nextOptions) {
+      return createStyled(nextTag, _extends({}, options, nextOptions, {
+        shouldForwardProp: composeShouldForwardProps(Styled, nextOptions, true)
+      })).apply(void 0, styles);
+    };
+
+    return Styled;
+  };
+};
+
+export { createStyled as default };
diff --git a/ddb_main/node_modules/@emotion/styled/dist/emotion-styled.browser.esm.js b/ddb_main/node_modules/@emotion/styled/dist/emotion-styled.browser.esm.js
new file mode 100644
index 0000000..d334f1c
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/styled/dist/emotion-styled.browser.esm.js
@@ -0,0 +1,19 @@
+import createStyled from '../base/dist/emotion-styled-base.browser.esm.js';
+import '@babel/runtime/helpers/extends';
+import 'react';
+import '@emotion/is-prop-valid';
+import '@emotion/react';
+import '@emotion/utils';
+import '@emotion/serialize';
+import '@emotion/use-insertion-effect-with-fallbacks';
+
+var tags = ['a', 'abbr', 'address', 'area', 'article', 'aside', 'audio', 'b', 'base', 'bdi', 'bdo', 'big', 'blockquote', 'body', 'br', 'button', 'canvas', 'caption', 'cite', 'code', 'col', 'colgroup', 'data', 'datalist', 'dd', 'del', 'details', 'dfn', 'dialog', 'div', 'dl', 'dt', 'em', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr', 'html', 'i', 'iframe', 'img', 'input', 'ins', 'kbd', 'keygen', 'label', 'legend', 'li', 'link', 'main', 'map', 'mark', 'marquee', 'menu', 'menuitem', 'meta', 'meter', 'nav', 'noscript', 'object', 'ol', 'optgroup', 'option', 'output', 'p', 'param', 'picture', 'pre', 'progress', 'q', 'rp', 'rt', 'ruby', 's', 'samp', 'script', 'section', 'select', 'small', 'source', 'span', 'strong', 'style', 'sub', 'summary', 'sup', 'table', 'tbody', 'td', 'textarea', 'tfoot', 'th', 'thead', 'time', 'title', 'tr', 'track', 'u', 'ul', 'var', 'video', 'wbr', // SVG
+'circle', 'clipPath', 'defs', 'ellipse', 'foreignObject', 'g', 'image', 'line', 'linearGradient', 'mask', 'path', 'pattern', 'polygon', 'polyline', 'radialGradient', 'rect', 'stop', 'svg', 'text', 'tspan'];
+
+var newStyled = createStyled.bind();
+tags.forEach(function (tagName) {
+  // $FlowFixMe: we can ignore this because its exposed type is defined by the CreateStyled type
+  newStyled[tagName] = newStyled(tagName);
+});
+
+export { newStyled as default };
diff --git a/ddb_main/node_modules/@emotion/stylis/dist/stylis.browser.esm.js b/ddb_main/node_modules/@emotion/stylis/dist/stylis.browser.esm.js
new file mode 100644
index 0000000..b2bc6a1
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/stylis/dist/stylis.browser.esm.js
@@ -0,0 +1,615 @@
+function stylis_min (W) {
+  function M(d, c, e, h, a) {
+    for (var m = 0, b = 0, v = 0, n = 0, q, g, x = 0, K = 0, k, u = k = q = 0, l = 0, r = 0, I = 0, t = 0, B = e.length, J = B - 1, y, f = '', p = '', F = '', G = '', C; l < B;) {
+      g = e.charCodeAt(l);
+      l === J && 0 !== b + n + v + m && (0 !== b && (g = 47 === b ? 10 : 47), n = v = m = 0, B++, J++);
+
+      if (0 === b + n + v + m) {
+        if (l === J && (0 < r && (f = f.replace(N, '')), 0 < f.trim().length)) {
+          switch (g) {
+            case 32:
+            case 9:
+            case 59:
+            case 13:
+            case 10:
+              break;
+
+            default:
+              f += e.charAt(l);
+          }
+
+          g = 59;
+        }
+
+        switch (g) {
+          case 123:
+            f = f.trim();
+            q = f.charCodeAt(0);
+            k = 1;
+
+            for (t = ++l; l < B;) {
+              switch (g = e.charCodeAt(l)) {
+                case 123:
+                  k++;
+                  break;
+
+                case 125:
+                  k--;
+                  break;
+
+                case 47:
+                  switch (g = e.charCodeAt(l + 1)) {
+                    case 42:
+                    case 47:
+                      a: {
+                        for (u = l + 1; u < J; ++u) {
+                          switch (e.charCodeAt(u)) {
+                            case 47:
+                              if (42 === g && 42 === e.charCodeAt(u - 1) && l + 2 !== u) {
+                                l = u + 1;
+                                break a;
+                              }
+
+                              break;
+
+                            case 10:
+                              if (47 === g) {
+                                l = u + 1;
+                                break a;
+                              }
+
+                          }
+                        }
+
+                        l = u;
+                      }
+
+                  }
+
+                  break;
+
+                case 91:
+                  g++;
+
+                case 40:
+                  g++;
+
+                case 34:
+                case 39:
+                  for (; l++ < J && e.charCodeAt(l) !== g;) {
+                  }
+
+              }
+
+              if (0 === k) break;
+              l++;
+            }
+
+            k = e.substring(t, l);
+            0 === q && (q = (f = f.replace(ca, '').trim()).charCodeAt(0));
+
+            switch (q) {
+              case 64:
+                0 < r && (f = f.replace(N, ''));
+                g = f.charCodeAt(1);
+
+                switch (g) {
+                  case 100:
+                  case 109:
+                  case 115:
+                  case 45:
+                    r = c;
+                    break;
+
+                  default:
+                    r = O;
+                }
+
+                k = M(c, r, k, g, a + 1);
+                t = k.length;
+                0 < A && (r = X(O, f, I), C = H(3, k, r, c, D, z, t, g, a, h), f = r.join(''), void 0 !== C && 0 === (t = (k = C.trim()).length) && (g = 0, k = ''));
+                if (0 < t) switch (g) {
+                  case 115:
+                    f = f.replace(da, ea);
+
+                  case 100:
+                  case 109:
+                  case 45:
+                    k = f + '{' + k + '}';
+                    break;
+
+                  case 107:
+                    f = f.replace(fa, '$1 $2');
+                    k = f + '{' + k + '}';
+                    k = 1 === w || 2 === w && L('@' + k, 3) ? '@-webkit-' + k + '@' + k : '@' + k;
+                    break;
+
+                  default:
+                    k = f + k, 112 === h && (k = (p += k, ''));
+                } else k = '';
+                break;
+
+              default:
+                k = M(c, X(c, f, I), k, h, a + 1);
+            }
+
+            F += k;
+            k = I = r = u = q = 0;
+            f = '';
+            g = e.charCodeAt(++l);
+            break;
+
+          case 125:
+          case 59:
+            f = (0 < r ? f.replace(N, '') : f).trim();
+            if (1 < (t = f.length)) switch (0 === u && (q = f.charCodeAt(0), 45 === q || 96 < q && 123 > q) && (t = (f = f.replace(' ', ':')).length), 0 < A && void 0 !== (C = H(1, f, c, d, D, z, p.length, h, a, h)) && 0 === (t = (f = C.trim()).length) && (f = '\x00\x00'), q = f.charCodeAt(0), g = f.charCodeAt(1), q) {
+              case 0:
+                break;
+
+              case 64:
+                if (105 === g || 99 === g) {
+                  G += f + e.charAt(l);
+                  break;
+                }
+
+              default:
+                58 !== f.charCodeAt(t - 1) && (p += P(f, q, g, f.charCodeAt(2)));
+            }
+            I = r = u = q = 0;
+            f = '';
+            g = e.charCodeAt(++l);
+        }
+      }
+
+      switch (g) {
+        case 13:
+        case 10:
+          47 === b ? b = 0 : 0 === 1 + q && 107 !== h && 0 < f.length && (r = 1, f += '\x00');
+          0 < A * Y && H(0, f, c, d, D, z, p.length, h, a, h);
+          z = 1;
+          D++;
+          break;
+
+        case 59:
+        case 125:
+          if (0 === b + n + v + m) {
+            z++;
+            break;
+          }
+
+        default:
+          z++;
+          y = e.charAt(l);
+
+          switch (g) {
+            case 9:
+            case 32:
+              if (0 === n + m + b) switch (x) {
+                case 44:
+                case 58:
+                case 9:
+                case 32:
+                  y = '';
+                  break;
+
+                default:
+                  32 !== g && (y = ' ');
+              }
+              break;
+
+            case 0:
+              y = '\\0';
+              break;
+
+            case 12:
+              y = '\\f';
+              break;
+
+            case 11:
+              y = '\\v';
+              break;
+
+            case 38:
+              0 === n + b + m && (r = I = 1, y = '\f' + y);
+              break;
+
+            case 108:
+              if (0 === n + b + m + E && 0 < u) switch (l - u) {
+                case 2:
+                  112 === x && 58 === e.charCodeAt(l - 3) && (E = x);
+
+                case 8:
+                  111 === K && (E = K);
+              }
+              break;
+
+            case 58:
+              0 === n + b + m && (u = l);
+              break;
+
+            case 44:
+              0 === b + v + n + m && (r = 1, y += '\r');
+              break;
+
+            case 34:
+            case 39:
+              0 === b && (n = n === g ? 0 : 0 === n ? g : n);
+              break;
+
+            case 91:
+              0 === n + b + v && m++;
+              break;
+
+            case 93:
+              0 === n + b + v && m--;
+              break;
+
+            case 41:
+              0 === n + b + m && v--;
+              break;
+
+            case 40:
+              if (0 === n + b + m) {
+                if (0 === q) switch (2 * x + 3 * K) {
+                  case 533:
+                    break;
+
+                  default:
+                    q = 1;
+                }
+                v++;
+              }
+
+              break;
+
+            case 64:
+              0 === b + v + n + m + u + k && (k = 1);
+              break;
+
+            case 42:
+            case 47:
+              if (!(0 < n + m + v)) switch (b) {
+                case 0:
+                  switch (2 * g + 3 * e.charCodeAt(l + 1)) {
+                    case 235:
+                      b = 47;
+                      break;
+
+                    case 220:
+                      t = l, b = 42;
+                  }
+
+                  break;
+
+                case 42:
+                  47 === g && 42 === x && t + 2 !== l && (33 === e.charCodeAt(t + 2) && (p += e.substring(t, l + 1)), y = '', b = 0);
+              }
+          }
+
+          0 === b && (f += y);
+      }
+
+      K = x;
+      x = g;
+      l++;
+    }
+
+    t = p.length;
+
+    if (0 < t) {
+      r = c;
+      if (0 < A && (C = H(2, p, r, d, D, z, t, h, a, h), void 0 !== C && 0 === (p = C).length)) return G + p + F;
+      p = r.join(',') + '{' + p + '}';
+
+      if (0 !== w * E) {
+        2 !== w || L(p, 2) || (E = 0);
+
+        switch (E) {
+          case 111:
+            p = p.replace(ha, ':-moz-$1') + p;
+            break;
+
+          case 112:
+            p = p.replace(Q, '::-webkit-input-$1') + p.replace(Q, '::-moz-$1') + p.replace(Q, ':-ms-input-$1') + p;
+        }
+
+        E = 0;
+      }
+    }
+
+    return G + p + F;
+  }
+
+  function X(d, c, e) {
+    var h = c.trim().split(ia);
+    c = h;
+    var a = h.length,
+        m = d.length;
+
+    switch (m) {
+      case 0:
+      case 1:
+        var b = 0;
+
+        for (d = 0 === m ? '' : d[0] + ' '; b < a; ++b) {
+          c[b] = Z(d, c[b], e).trim();
+        }
+
+        break;
+
+      default:
+        var v = b = 0;
+
+        for (c = []; b < a; ++b) {
+          for (var n = 0; n < m; ++n) {
+            c[v++] = Z(d[n] + ' ', h[b], e).trim();
+          }
+        }
+
+    }
+
+    return c;
+  }
+
+  function Z(d, c, e) {
+    var h = c.charCodeAt(0);
+    33 > h && (h = (c = c.trim()).charCodeAt(0));
+
+    switch (h) {
+      case 38:
+        return c.replace(F, '$1' + d.trim());
+
+      case 58:
+        return d.trim() + c.replace(F, '$1' + d.trim());
+
+      default:
+        if (0 < 1 * e && 0 < c.indexOf('\f')) return c.replace(F, (58 === d.charCodeAt(0) ? '' : '$1') + d.trim());
+    }
+
+    return d + c;
+  }
+
+  function P(d, c, e, h) {
+    var a = d + ';',
+        m = 2 * c + 3 * e + 4 * h;
+
+    if (944 === m) {
+      d = a.indexOf(':', 9) + 1;
+      var b = a.substring(d, a.length - 1).trim();
+      b = a.substring(0, d).trim() + b + ';';
+      return 1 === w || 2 === w && L(b, 1) ? '-webkit-' + b + b : b;
+    }
+
+    if (0 === w || 2 === w && !L(a, 1)) return a;
+
+    switch (m) {
+      case 1015:
+        return 97 === a.charCodeAt(10) ? '-webkit-' + a + a : a;
+
+      case 951:
+        return 116 === a.charCodeAt(3) ? '-webkit-' + a + a : a;
+
+      case 963:
+        return 110 === a.charCodeAt(5) ? '-webkit-' + a + a : a;
+
+      case 1009:
+        if (100 !== a.charCodeAt(4)) break;
+
+      case 969:
+      case 942:
+        return '-webkit-' + a + a;
+
+      case 978:
+        return '-webkit-' + a + '-moz-' + a + a;
+
+      case 1019:
+      case 983:
+        return '-webkit-' + a + '-moz-' + a + '-ms-' + a + a;
+
+      case 883:
+        if (45 === a.charCodeAt(8)) return '-webkit-' + a + a;
+        if (0 < a.indexOf('image-set(', 11)) return a.replace(ja, '$1-webkit-$2') + a;
+        break;
+
+      case 932:
+        if (45 === a.charCodeAt(4)) switch (a.charCodeAt(5)) {
+          case 103:
+            return '-webkit-box-' + a.replace('-grow', '') + '-webkit-' + a + '-ms-' + a.replace('grow', 'positive') + a;
+
+          case 115:
+            return '-webkit-' + a + '-ms-' + a.replace('shrink', 'negative') + a;
+
+          case 98:
+            return '-webkit-' + a + '-ms-' + a.replace('basis', 'preferred-size') + a;
+        }
+        return '-webkit-' + a + '-ms-' + a + a;
+
+      case 964:
+        return '-webkit-' + a + '-ms-flex-' + a + a;
+
+      case 1023:
+        if (99 !== a.charCodeAt(8)) break;
+        b = a.substring(a.indexOf(':', 15)).replace('flex-', '').replace('space-between', 'justify');
+        return '-webkit-box-pack' + b + '-webkit-' + a + '-ms-flex-pack' + b + a;
+
+      case 1005:
+        return ka.test(a) ? a.replace(aa, ':-webkit-') + a.replace(aa, ':-moz-') + a : a;
+
+      case 1e3:
+        b = a.substring(13).trim();
+        c = b.indexOf('-') + 1;
+
+        switch (b.charCodeAt(0) + b.charCodeAt(c)) {
+          case 226:
+            b = a.replace(G, 'tb');
+            break;
+
+          case 232:
+            b = a.replace(G, 'tb-rl');
+            break;
+
+          case 220:
+            b = a.replace(G, 'lr');
+            break;
+
+          default:
+            return a;
+        }
+
+        return '-webkit-' + a + '-ms-' + b + a;
+
+      case 1017:
+        if (-1 === a.indexOf('sticky', 9)) break;
+
+      case 975:
+        c = (a = d).length - 10;
+        b = (33 === a.charCodeAt(c) ? a.substring(0, c) : a).substring(d.indexOf(':', 7) + 1).trim();
+
+        switch (m = b.charCodeAt(0) + (b.charCodeAt(7) | 0)) {
+          case 203:
+            if (111 > b.charCodeAt(8)) break;
+
+          case 115:
+            a = a.replace(b, '-webkit-' + b) + ';' + a;
+            break;
+
+          case 207:
+          case 102:
+            a = a.replace(b, '-webkit-' + (102 < m ? 'inline-' : '') + 'box') + ';' + a.replace(b, '-webkit-' + b) + ';' + a.replace(b, '-ms-' + b + 'box') + ';' + a;
+        }
+
+        return a + ';';
+
+      case 938:
+        if (45 === a.charCodeAt(5)) switch (a.charCodeAt(6)) {
+          case 105:
+            return b = a.replace('-items', ''), '-webkit-' + a + '-webkit-box-' + b + '-ms-flex-' + b + a;
+
+          case 115:
+            return '-webkit-' + a + '-ms-flex-item-' + a.replace(ba, '') + a;
+
+          default:
+            return '-webkit-' + a + '-ms-flex-line-pack' + a.replace('align-content', '').replace(ba, '') + a;
+        }
+        break;
+
+      case 973:
+      case 989:
+        if (45 !== a.charCodeAt(3) || 122 === a.charCodeAt(4)) break;
+
+      case 931:
+      case 953:
+        if (!0 === la.test(d)) return 115 === (b = d.substring(d.indexOf(':') + 1)).charCodeAt(0) ? P(d.replace('stretch', 'fill-available'), c, e, h).replace(':fill-available', ':stretch') : a.replace(b, '-webkit-' + b) + a.replace(b, '-moz-' + b.replace('fill-', '')) + a;
+        break;
+
+      case 962:
+        if (a = '-webkit-' + a + (102 === a.charCodeAt(5) ? '-ms-' + a : '') + a, 211 === e + h && 105 === a.charCodeAt(13) && 0 < a.indexOf('transform', 10)) return a.substring(0, a.indexOf(';', 27) + 1).replace(ma, '$1-webkit-$2') + a;
+    }
+
+    return a;
+  }
+
+  function L(d, c) {
+    var e = d.indexOf(1 === c ? ':' : '{'),
+        h = d.substring(0, 3 !== c ? e : 10);
+    e = d.substring(e + 1, d.length - 1);
+    return R(2 !== c ? h : h.replace(na, '$1'), e, c);
+  }
+
+  function ea(d, c) {
+    var e = P(c, c.charCodeAt(0), c.charCodeAt(1), c.charCodeAt(2));
+    return e !== c + ';' ? e.replace(oa, ' or ($1)').substring(4) : '(' + c + ')';
+  }
+
+  function H(d, c, e, h, a, m, b, v, n, q) {
+    for (var g = 0, x = c, w; g < A; ++g) {
+      switch (w = S[g].call(B, d, x, e, h, a, m, b, v, n, q)) {
+        case void 0:
+        case !1:
+        case !0:
+        case null:
+          break;
+
+        default:
+          x = w;
+      }
+    }
+
+    if (x !== c) return x;
+  }
+
+  function T(d) {
+    switch (d) {
+      case void 0:
+      case null:
+        A = S.length = 0;
+        break;
+
+      default:
+        if ('function' === typeof d) S[A++] = d;else if ('object' === typeof d) for (var c = 0, e = d.length; c < e; ++c) {
+          T(d[c]);
+        } else Y = !!d | 0;
+    }
+
+    return T;
+  }
+
+  function U(d) {
+    d = d.prefix;
+    void 0 !== d && (R = null, d ? 'function' !== typeof d ? w = 1 : (w = 2, R = d) : w = 0);
+    return U;
+  }
+
+  function B(d, c) {
+    var e = d;
+    33 > e.charCodeAt(0) && (e = e.trim());
+    V = e;
+    e = [V];
+
+    if (0 < A) {
+      var h = H(-1, c, e, e, D, z, 0, 0, 0, 0);
+      void 0 !== h && 'string' === typeof h && (c = h);
+    }
+
+    var a = M(O, e, c, 0, 0);
+    0 < A && (h = H(-2, a, e, e, D, z, a.length, 0, 0, 0), void 0 !== h && (a = h));
+    V = '';
+    E = 0;
+    z = D = 1;
+    return a;
+  }
+
+  var ca = /^\0+/g,
+      N = /[\0\r\f]/g,
+      aa = /: */g,
+      ka = /zoo|gra/,
+      ma = /([,: ])(transform)/g,
+      ia = /,\r+?/g,
+      F = /([\t\r\n ])*\f?&/g,
+      fa = /@(k\w+)\s*(\S*)\s*/,
+      Q = /::(place)/g,
+      ha = /:(read-only)/g,
+      G = /[svh]\w+-[tblr]{2}/,
+      da = /\(\s*(.*)\s*\)/g,
+      oa = /([\s\S]*?);/g,
+      ba = /-self|flex-/g,
+      na = /[^]*?(:[rp][el]a[\w-]+)[^]*/,
+      la = /stretch|:\s*\w+\-(?:conte|avail)/,
+      ja = /([^-])(image-set\()/,
+      z = 1,
+      D = 1,
+      E = 0,
+      w = 1,
+      O = [],
+      S = [],
+      A = 0,
+      R = null,
+      Y = 0,
+      V = '';
+  B.use = T;
+  B.set = U;
+  void 0 !== W && U(W);
+  return B;
+}
+
+export default stylis_min;
diff --git a/ddb_main/node_modules/@emotion/unitless/dist/emotion-unitless.esm.js b/ddb_main/node_modules/@emotion/unitless/dist/emotion-unitless.esm.js
new file mode 100644
index 0000000..e98c789
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/unitless/dist/emotion-unitless.esm.js
@@ -0,0 +1,51 @@
+var unitlessKeys = {
+  animationIterationCount: 1,
+  aspectRatio: 1,
+  borderImageOutset: 1,
+  borderImageSlice: 1,
+  borderImageWidth: 1,
+  boxFlex: 1,
+  boxFlexGroup: 1,
+  boxOrdinalGroup: 1,
+  columnCount: 1,
+  columns: 1,
+  flex: 1,
+  flexGrow: 1,
+  flexPositive: 1,
+  flexShrink: 1,
+  flexNegative: 1,
+  flexOrder: 1,
+  gridRow: 1,
+  gridRowEnd: 1,
+  gridRowSpan: 1,
+  gridRowStart: 1,
+  gridColumn: 1,
+  gridColumnEnd: 1,
+  gridColumnSpan: 1,
+  gridColumnStart: 1,
+  msGridRow: 1,
+  msGridRowSpan: 1,
+  msGridColumn: 1,
+  msGridColumnSpan: 1,
+  fontWeight: 1,
+  lineHeight: 1,
+  opacity: 1,
+  order: 1,
+  orphans: 1,
+  tabSize: 1,
+  widows: 1,
+  zIndex: 1,
+  zoom: 1,
+  WebkitLineClamp: 1,
+  // SVG-related properties
+  fillOpacity: 1,
+  floodOpacity: 1,
+  stopOpacity: 1,
+  strokeDasharray: 1,
+  strokeDashoffset: 1,
+  strokeMiterlimit: 1,
+  strokeOpacity: 1,
+  strokeWidth: 1
+};
+
+export { unitlessKeys as default };
diff --git a/ddb_main/node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.browser.esm.js b/ddb_main/node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.browser.esm.js
new file mode 100644
index 0000000..1b0e17d
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.browser.esm.js
@@ -0,0 +1,11 @@
+import * as React from 'react';
+
+var syncFallback = function syncFallback(create) {
+  return create();
+};
+
+var useInsertionEffect = React['useInsertion' + 'Effect'] ? React['useInsertion' + 'Effect'] : false;
+var useInsertionEffectAlwaysWithSyncFallback = useInsertionEffect || syncFallback;
+var useInsertionEffectWithLayoutFallback = useInsertionEffect || React.useLayoutEffect;
+
+export { useInsertionEffectAlwaysWithSyncFallback, useInsertionEffectWithLayoutFallback };
diff --git a/ddb_main/node_modules/@emotion/utils/dist/emotion-utils.browser.esm.js b/ddb_main/node_modules/@emotion/utils/dist/emotion-utils.browser.esm.js
new file mode 100644
index 0000000..5d39b1a
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/utils/dist/emotion-utils.browser.esm.js
@@ -0,0 +1,44 @@
+var isBrowser = "object" !== 'undefined';
+function getRegisteredStyles(registered, registeredStyles, classNames) {
+  var rawClassName = '';
+  classNames.split(' ').forEach(function (className) {
+    if (registered[className] !== undefined) {
+      registeredStyles.push(registered[className] + ";");
+    } else {
+      rawClassName += className + " ";
+    }
+  });
+  return rawClassName;
+}
+var registerStyles = function registerStyles(cache, serialized, isStringTag) {
+  var className = cache.key + "-" + serialized.name;
+
+  if ( // we only need to add the styles to the registered cache if the
+  // class name could be used further down
+  // the tree but if it's a string tag, we know it won't
+  // so we don't have to add it to registered cache.
+  // this improves memory usage since we can avoid storing the whole style string
+  (isStringTag === false || // we need to always store it if we're in compat mode and
+  // in node since emotion-server relies on whether a style is in
+  // the registered cache to know whether a style is global or not
+  // also, note that this check will be dead code eliminated in the browser
+  isBrowser === false ) && cache.registered[className] === undefined) {
+    cache.registered[className] = serialized.styles;
+  }
+};
+var insertStyles = function insertStyles(cache, serialized, isStringTag) {
+  registerStyles(cache, serialized, isStringTag);
+  var className = cache.key + "-" + serialized.name;
+
+  if (cache.inserted[serialized.name] === undefined) {
+    var current = serialized;
+
+    do {
+      cache.insert(serialized === current ? "." + className : '', current, cache.sheet, true);
+
+      current = current.next;
+    } while (current !== undefined);
+  }
+};
+
+export { getRegisteredStyles, insertStyles, registerStyles };
diff --git a/ddb_main/node_modules/@emotion/weak-memoize/dist/emotion-weak-memoize.esm.js b/ddb_main/node_modules/@emotion/weak-memoize/dist/emotion-weak-memoize.esm.js
new file mode 100644
index 0000000..1939dad
--- /dev/null
+++ b/ddb_main/node_modules/@emotion/weak-memoize/dist/emotion-weak-memoize.esm.js
@@ -0,0 +1,16 @@
+var weakMemoize = function weakMemoize(func) {
+  // $FlowFixMe flow doesn't include all non-primitive types as allowed for weakmaps
+  var cache = new WeakMap();
+  return function (arg) {
+    if (cache.has(arg)) {
+      // $FlowFixMe
+      return cache.get(arg);
+    }
+
+    var ret = func(arg);
+    cache.set(arg, ret);
+    return ret;
+  };
+};
+
+export { weakMemoize as default };
diff --git a/ddb_main/node_modules/@floating-ui/core/dist/floating-ui.core.mjs b/ddb_main/node_modules/@floating-ui/core/dist/floating-ui.core.mjs
new file mode 100644
index 0000000..74f6fd5
--- /dev/null
+++ b/ddb_main/node_modules/@floating-ui/core/dist/floating-ui.core.mjs
@@ -0,0 +1,1025 @@
+import { getSideAxis, getAlignmentAxis, getAxisLength, getSide, getAlignment, evaluate, getPaddingObject, rectToClientRect, min, clamp, placements, getAlignmentSides, getOppositeAlignmentPlacement, getOppositePlacement, getExpandedPlacements, getOppositeAxisPlacements, sides, max, getOppositeAxis } from '@floating-ui/utils';
+export { rectToClientRect } from '@floating-ui/utils';
+
+function computeCoordsFromPlacement(_ref, placement, rtl) {
+  let {
+    reference,
+    floating
+  } = _ref;
+  const sideAxis = getSideAxis(placement);
+  const alignmentAxis = getAlignmentAxis(placement);
+  const alignLength = getAxisLength(alignmentAxis);
+  const side = getSide(placement);
+  const isVertical = sideAxis === 'y';
+  const commonX = reference.x + reference.width / 2 - floating.width / 2;
+  const commonY = reference.y + reference.height / 2 - floating.height / 2;
+  const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
+  let coords;
+  switch (side) {
+    case 'top':
+      coords = {
+        x: commonX,
+        y: reference.y - floating.height
+      };
+      break;
+    case 'bottom':
+      coords = {
+        x: commonX,
+        y: reference.y + reference.height
+      };
+      break;
+    case 'right':
+      coords = {
+        x: reference.x + reference.width,
+        y: commonY
+      };
+      break;
+    case 'left':
+      coords = {
+        x: reference.x - floating.width,
+        y: commonY
+      };
+      break;
+    default:
+      coords = {
+        x: reference.x,
+        y: reference.y
+      };
+  }
+  switch (getAlignment(placement)) {
+    case 'start':
+      coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
+      break;
+    case 'end':
+      coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
+      break;
+  }
+  return coords;
+}
+
+/**
+ * Computes the `x` and `y` coordinates that will place the floating element
+ * next to a given reference element.
+ *
+ * This export does not have any `platform` interface logic. You will need to
+ * write one for the platform you are using Floating UI with.
+ */
+const computePosition = async (reference, floating, config) => {
+  const {
+    placement = 'bottom',
+    strategy = 'absolute',
+    middleware = [],
+    platform
+  } = config;
+  const validMiddleware = middleware.filter(Boolean);
+  const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
+  let rects = await platform.getElementRects({
+    reference,
+    floating,
+    strategy
+  });
+  let {
+    x,
+    y
+  } = computeCoordsFromPlacement(rects, placement, rtl);
+  let statefulPlacement = placement;
+  let middlewareData = {};
+  let resetCount = 0;
+  for (let i = 0; i < validMiddleware.length; i++) {
+    const {
+      name,
+      fn
+    } = validMiddleware[i];
+    const {
+      x: nextX,
+      y: nextY,
+      data,
+      reset
+    } = await fn({
+      x,
+      y,
+      initialPlacement: placement,
+      placement: statefulPlacement,
+      strategy,
+      middlewareData,
+      rects,
+      platform,
+      elements: {
+        reference,
+        floating
+      }
+    });
+    x = nextX != null ? nextX : x;
+    y = nextY != null ? nextY : y;
+    middlewareData = {
+      ...middlewareData,
+      [name]: {
+        ...middlewareData[name],
+        ...data
+      }
+    };
+    if (reset && resetCount <= 50) {
+      resetCount++;
+      if (typeof reset === 'object') {
+        if (reset.placement) {
+          statefulPlacement = reset.placement;
+        }
+        if (reset.rects) {
+          rects = reset.rects === true ? await platform.getElementRects({
+            reference,
+            floating,
+            strategy
+          }) : reset.rects;
+        }
+        ({
+          x,
+          y
+        } = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
+      }
+      i = -1;
+    }
+  }
+  return {
+    x,
+    y,
+    placement: statefulPlacement,
+    strategy,
+    middlewareData
+  };
+};
+
+/**
+ * Resolves with an object of overflow side offsets that determine how much the
+ * element is overflowing a given clipping boundary on each side.
+ * - positive = overflowing the boundary by that number of pixels
+ * - negative = how many pixels left before it will overflow
+ * - 0 = lies flush with the boundary
+ * @see https://floating-ui.com/docs/detectOverflow
+ */
+async function detectOverflow(state, options) {
+  var _await$platform$isEle;
+  if (options === void 0) {
+    options = {};
+  }
+  const {
+    x,
+    y,
+    platform,
+    rects,
+    elements,
+    strategy
+  } = state;
+  const {
+    boundary = 'clippingAncestors',
+    rootBoundary = 'viewport',
+    elementContext = 'floating',
+    altBoundary = false,
+    padding = 0
+  } = evaluate(options, state);
+  const paddingObject = getPaddingObject(padding);
+  const altContext = elementContext === 'floating' ? 'reference' : 'floating';
+  const element = elements[altBoundary ? altContext : elementContext];
+  const clippingClientRect = rectToClientRect(await platform.getClippingRect({
+    element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating))),
+    boundary,
+    rootBoundary,
+    strategy
+  }));
+  const rect = elementContext === 'floating' ? {
+    x,
+    y,
+    width: rects.floating.width,
+    height: rects.floating.height
+  } : rects.reference;
+  const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
+  const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
+    x: 1,
+    y: 1
+  } : {
+    x: 1,
+    y: 1
+  };
+  const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
+    elements,
+    rect,
+    offsetParent,
+    strategy
+  }) : rect);
+  return {
+    top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
+    bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
+    left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
+    right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
+  };
+}
+
+/**
+ * Provides data to position an inner element of the floating element so that it
+ * appears centered to the reference element.
+ * @see https://floating-ui.com/docs/arrow
+ */
+const arrow = options => ({
+  name: 'arrow',
+  options,
+  async fn(state) {
+    const {
+      x,
+      y,
+      placement,
+      rects,
+      platform,
+      elements,
+      middlewareData
+    } = state;
+    // Since `element` is required, we don't Partial<> the type.
+    const {
+      element,
+      padding = 0
+    } = evaluate(options, state) || {};
+    if (element == null) {
+      return {};
+    }
+    const paddingObject = getPaddingObject(padding);
+    const coords = {
+      x,
+      y
+    };
+    const axis = getAlignmentAxis(placement);
+    const length = getAxisLength(axis);
+    const arrowDimensions = await platform.getDimensions(element);
+    const isYAxis = axis === 'y';
+    const minProp = isYAxis ? 'top' : 'left';
+    const maxProp = isYAxis ? 'bottom' : 'right';
+    const clientProp = isYAxis ? 'clientHeight' : 'clientWidth';
+    const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
+    const startDiff = coords[axis] - rects.reference[axis];
+    const arrowOffsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(element));
+    let clientSize = arrowOffsetParent ? arrowOffsetParent[clientProp] : 0;
+
+    // DOM platform can return `window` as the `offsetParent`.
+    if (!clientSize || !(await (platform.isElement == null ? void 0 : platform.isElement(arrowOffsetParent)))) {
+      clientSize = elements.floating[clientProp] || rects.floating[length];
+    }
+    const centerToReference = endDiff / 2 - startDiff / 2;
+
+    // If the padding is large enough that it causes the arrow to no longer be
+    // centered, modify the padding so that it is centered.
+    const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
+    const minPadding = min(paddingObject[minProp], largestPossiblePadding);
+    const maxPadding = min(paddingObject[maxProp], largestPossiblePadding);
+
+    // Make sure the arrow doesn't overflow the floating element if the center
+    // point is outside the floating element's bounds.
+    const min$1 = minPadding;
+    const max = clientSize - arrowDimensions[length] - maxPadding;
+    const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
+    const offset = clamp(min$1, center, max);
+
+    // If the reference is small enough that the arrow's padding causes it to
+    // to point to nothing for an aligned placement, adjust the offset of the
+    // floating element itself. To ensure `shift()` continues to take action,
+    // a single reset is performed when this is true.
+    const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
+    const alignmentOffset = shouldAddOffset ? center < min$1 ? center - min$1 : center - max : 0;
+    return {
+      [axis]: coords[axis] + alignmentOffset,
+      data: {
+        [axis]: offset,
+        centerOffset: center - offset - alignmentOffset,
+        ...(shouldAddOffset && {
+          alignmentOffset
+        })
+      },
+      reset: shouldAddOffset
+    };
+  }
+});
+
+function getPlacementList(alignment, autoAlignment, allowedPlacements) {
+  const allowedPlacementsSortedByAlignment = alignment ? [...allowedPlacements.filter(placement => getAlignment(placement) === alignment), ...allowedPlacements.filter(placement => getAlignment(placement) !== alignment)] : allowedPlacements.filter(placement => getSide(placement) === placement);
+  return allowedPlacementsSortedByAlignment.filter(placement => {
+    if (alignment) {
+      return getAlignment(placement) === alignment || (autoAlignment ? getOppositeAlignmentPlacement(placement) !== placement : false);
+    }
+    return true;
+  });
+}
+/**
+ * Optimizes the visibility of the floating element by choosing the placement
+ * that has the most space available automatically, without needing to specify a
+ * preferred placement. Alternative to `flip`.
+ * @see https://floating-ui.com/docs/autoPlacement
+ */
+const autoPlacement = function (options) {
+  if (options === void 0) {
+    options = {};
+  }
+  return {
+    name: 'autoPlacement',
+    options,
+    async fn(state) {
+      var _middlewareData$autoP, _middlewareData$autoP2, _placementsThatFitOnE;
+      const {
+        rects,
+        middlewareData,
+        placement,
+        platform,
+        elements
+      } = state;
+      const {
+        crossAxis = false,
+        alignment,
+        allowedPlacements = placements,
+        autoAlignment = true,
+        ...detectOverflowOptions
+      } = evaluate(options, state);
+      const placements$1 = alignment !== undefined || allowedPlacements === placements ? getPlacementList(alignment || null, autoAlignment, allowedPlacements) : allowedPlacements;
+      const overflow = await detectOverflow(state, detectOverflowOptions);
+      const currentIndex = ((_middlewareData$autoP = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP.index) || 0;
+      const currentPlacement = placements$1[currentIndex];
+      if (currentPlacement == null) {
+        return {};
+      }
+      const alignmentSides = getAlignmentSides(currentPlacement, rects, await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating)));
+
+      // Make `computeCoords` start from the right place.
+      if (placement !== currentPlacement) {
+        return {
+          reset: {
+            placement: placements$1[0]
+          }
+        };
+      }
+      const currentOverflows = [overflow[getSide(currentPlacement)], overflow[alignmentSides[0]], overflow[alignmentSides[1]]];
+      const allOverflows = [...(((_middlewareData$autoP2 = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP2.overflows) || []), {
+        placement: currentPlacement,
+        overflows: currentOverflows
+      }];
+      const nextPlacement = placements$1[currentIndex + 1];
+
+      // There are more placements to check.
+      if (nextPlacement) {
+        return {
+          data: {
+            index: currentIndex + 1,
+            overflows: allOverflows
+          },
+          reset: {
+            placement: nextPlacement
+          }
+        };
+      }
+      const placementsSortedByMostSpace = allOverflows.map(d => {
+        const alignment = getAlignment(d.placement);
+        return [d.placement, alignment && crossAxis ?
+        // Check along the mainAxis and main crossAxis side.
+        d.overflows.slice(0, 2).reduce((acc, v) => acc + v, 0) :
+        // Check only the mainAxis.
+        d.overflows[0], d.overflows];
+      }).sort((a, b) => a[1] - b[1]);
+      const placementsThatFitOnEachSide = placementsSortedByMostSpace.filter(d => d[2].slice(0,
+      // Aligned placements should not check their opposite crossAxis
+      // side.
+      getAlignment(d[0]) ? 2 : 3).every(v => v <= 0));
+      const resetPlacement = ((_placementsThatFitOnE = placementsThatFitOnEachSide[0]) == null ? void 0 : _placementsThatFitOnE[0]) || placementsSortedByMostSpace[0][0];
+      if (resetPlacement !== placement) {
+        return {
+          data: {
+            index: currentIndex + 1,
+            overflows: allOverflows
+          },
+          reset: {
+            placement: resetPlacement
+          }
+        };
+      }
+      return {};
+    }
+  };
+};
+
+/**
+ * Optimizes the visibility of the floating element by flipping the `placement`
+ * in order to keep it in view when the preferred placement(s) will overflow the
+ * clipping boundary. Alternative to `autoPlacement`.
+ * @see https://floating-ui.com/docs/flip
+ */
+const flip = function (options) {
+  if (options === void 0) {
+    options = {};
+  }
+  return {
+    name: 'flip',
+    options,
+    async fn(state) {
+      var _middlewareData$arrow, _middlewareData$flip;
+      const {
+        placement,
+        middlewareData,
+        rects,
+        initialPlacement,
+        platform,
+        elements
+      } = state;
+      const {
+        mainAxis: checkMainAxis = true,
+        crossAxis: checkCrossAxis = true,
+        fallbackPlacements: specifiedFallbackPlacements,
+        fallbackStrategy = 'bestFit',
+        fallbackAxisSideDirection = 'none',
+        flipAlignment = true,
+        ...detectOverflowOptions
+      } = evaluate(options, state);
+
+      // If a reset by the arrow was caused due to an alignment offset being
+      // added, we should skip any logic now since `flip()` has already done its
+      // work.
+      // https://github.com/floating-ui/floating-ui/issues/2549#issuecomment-1719601643
+      if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
+        return {};
+      }
+      const side = getSide(placement);
+      const isBasePlacement = getSide(initialPlacement) === initialPlacement;
+      const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
+      const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
+      if (!specifiedFallbackPlacements && fallbackAxisSideDirection !== 'none') {
+        fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
+      }
+      const placements = [initialPlacement, ...fallbackPlacements];
+      const overflow = await detectOverflow(state, detectOverflowOptions);
+      const overflows = [];
+      let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
+      if (checkMainAxis) {
+        overflows.push(overflow[side]);
+      }
+      if (checkCrossAxis) {
+        const sides = getAlignmentSides(placement, rects, rtl);
+        overflows.push(overflow[sides[0]], overflow[sides[1]]);
+      }
+      overflowsData = [...overflowsData, {
+        placement,
+        overflows
+      }];
+
+      // One or more sides is overflowing.
+      if (!overflows.every(side => side <= 0)) {
+        var _middlewareData$flip2, _overflowsData$filter;
+        const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
+        const nextPlacement = placements[nextIndex];
+        if (nextPlacement) {
+          // Try next placement and re-run the lifecycle.
+          return {
+            data: {
+              index: nextIndex,
+              overflows: overflowsData
+            },
+            reset: {
+              placement: nextPlacement
+            }
+          };
+        }
+
+        // First, find the candidates that fit on the mainAxis side of overflow,
+        // then find the placement that fits the best on the main crossAxis side.
+        let resetPlacement = (_overflowsData$filter = overflowsData.filter(d => d.overflows[0] <= 0).sort((a, b) => a.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement;
+
+        // Otherwise fallback.
+        if (!resetPlacement) {
+          switch (fallbackStrategy) {
+            case 'bestFit':
+              {
+                var _overflowsData$map$so;
+                const placement = (_overflowsData$map$so = overflowsData.map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$map$so[0];
+                if (placement) {
+                  resetPlacement = placement;
+                }
+                break;
+              }
+            case 'initialPlacement':
+              resetPlacement = initialPlacement;
+              break;
+          }
+        }
+        if (placement !== resetPlacement) {
+          return {
+            reset: {
+              placement: resetPlacement
+            }
+          };
+        }
+      }
+      return {};
+    }
+  };
+};
+
+function getSideOffsets(overflow, rect) {
+  return {
+    top: overflow.top - rect.height,
+    right: overflow.right - rect.width,
+    bottom: overflow.bottom - rect.height,
+    left: overflow.left - rect.width
+  };
+}
+function isAnySideFullyClipped(overflow) {
+  return sides.some(side => overflow[side] >= 0);
+}
+/**
+ * Provides data to hide the floating element in applicable situations, such as
+ * when it is not in the same clipping context as the reference element.
+ * @see https://floating-ui.com/docs/hide
+ */
+const hide = function (options) {
+  if (options === void 0) {
+    options = {};
+  }
+  return {
+    name: 'hide',
+    options,
+    async fn(state) {
+      const {
+        rects
+      } = state;
+      const {
+        strategy = 'referenceHidden',
+        ...detectOverflowOptions
+      } = evaluate(options, state);
+      switch (strategy) {
+        case 'referenceHidden':
+          {
+            const overflow = await detectOverflow(state, {
+              ...detectOverflowOptions,
+              elementContext: 'reference'
+            });
+            const offsets = getSideOffsets(overflow, rects.reference);
+            return {
+              data: {
+                referenceHiddenOffsets: offsets,
+                referenceHidden: isAnySideFullyClipped(offsets)
+              }
+            };
+          }
+        case 'escaped':
+          {
+            const overflow = await detectOverflow(state, {
+              ...detectOverflowOptions,
+              altBoundary: true
+            });
+            const offsets = getSideOffsets(overflow, rects.floating);
+            return {
+              data: {
+                escapedOffsets: offsets,
+                escaped: isAnySideFullyClipped(offsets)
+              }
+            };
+          }
+        default:
+          {
+            return {};
+          }
+      }
+    }
+  };
+};
+
+function getBoundingRect(rects) {
+  const minX = min(...rects.map(rect => rect.left));
+  const minY = min(...rects.map(rect => rect.top));
+  const maxX = max(...rects.map(rect => rect.right));
+  const maxY = max(...rects.map(rect => rect.bottom));
+  return {
+    x: minX,
+    y: minY,
+    width: maxX - minX,
+    height: maxY - minY
+  };
+}
+function getRectsByLine(rects) {
+  const sortedRects = rects.slice().sort((a, b) => a.y - b.y);
+  const groups = [];
+  let prevRect = null;
+  for (let i = 0; i < sortedRects.length; i++) {
+    const rect = sortedRects[i];
+    if (!prevRect || rect.y - prevRect.y > prevRect.height / 2) {
+      groups.push([rect]);
+    } else {
+      groups[groups.length - 1].push(rect);
+    }
+    prevRect = rect;
+  }
+  return groups.map(rect => rectToClientRect(getBoundingRect(rect)));
+}
+/**
+ * Provides improved positioning for inline reference elements that can span
+ * over multiple lines, such as hyperlinks or range selections.
+ * @see https://floating-ui.com/docs/inline
+ */
+const inline = function (options) {
+  if (options === void 0) {
+    options = {};
+  }
+  return {
+    name: 'inline',
+    options,
+    async fn(state) {
+      const {
+        placement,
+        elements,
+        rects,
+        platform,
+        strategy
+      } = state;
+      // A MouseEvent's client{X,Y} coords can be up to 2 pixels off a
+      // ClientRect's bounds, despite the event listener being triggered. A
+      // padding of 2 seems to handle this issue.
+      const {
+        padding = 2,
+        x,
+        y
+      } = evaluate(options, state);
+      const nativeClientRects = Array.from((await (platform.getClientRects == null ? void 0 : platform.getClientRects(elements.reference))) || []);
+      const clientRects = getRectsByLine(nativeClientRects);
+      const fallback = rectToClientRect(getBoundingRect(nativeClientRects));
+      const paddingObject = getPaddingObject(padding);
+      function getBoundingClientRect() {
+        // There are two rects and they are disjoined.
+        if (clientRects.length === 2 && clientRects[0].left > clientRects[1].right && x != null && y != null) {
+          // Find the first rect in which the point is fully inside.
+          return clientRects.find(rect => x > rect.left - paddingObject.left && x < rect.right + paddingObject.right && y > rect.top - paddingObject.top && y < rect.bottom + paddingObject.bottom) || fallback;
+        }
+
+        // There are 2 or more connected rects.
+        if (clientRects.length >= 2) {
+          if (getSideAxis(placement) === 'y') {
+            const firstRect = clientRects[0];
+            const lastRect = clientRects[clientRects.length - 1];
+            const isTop = getSide(placement) === 'top';
+            const top = firstRect.top;
+            const bottom = lastRect.bottom;
+            const left = isTop ? firstRect.left : lastRect.left;
+            const right = isTop ? firstRect.right : lastRect.right;
+            const width = right - left;
+            const height = bottom - top;
+            return {
+              top,
+              bottom,
+              left,
+              right,
+              width,
+              height,
+              x: left,
+              y: top
+            };
+          }
+          const isLeftSide = getSide(placement) === 'left';
+          const maxRight = max(...clientRects.map(rect => rect.right));
+          const minLeft = min(...clientRects.map(rect => rect.left));
+          const measureRects = clientRects.filter(rect => isLeftSide ? rect.left === minLeft : rect.right === maxRight);
+          const top = measureRects[0].top;
+          const bottom = measureRects[measureRects.length - 1].bottom;
+          const left = minLeft;
+          const right = maxRight;
+          const width = right - left;
+          const height = bottom - top;
+          return {
+            top,
+            bottom,
+            left,
+            right,
+            width,
+            height,
+            x: left,
+            y: top
+          };
+        }
+        return fallback;
+      }
+      const resetRects = await platform.getElementRects({
+        reference: {
+          getBoundingClientRect
+        },
+        floating: elements.floating,
+        strategy
+      });
+      if (rects.reference.x !== resetRects.reference.x || rects.reference.y !== resetRects.reference.y || rects.reference.width !== resetRects.reference.width || rects.reference.height !== resetRects.reference.height) {
+        return {
+          reset: {
+            rects: resetRects
+          }
+        };
+      }
+      return {};
+    }
+  };
+};
+
+// For type backwards-compatibility, the `OffsetOptions` type was also
+// Derivable.
+
+async function convertValueToCoords(state, options) {
+  const {
+    placement,
+    platform,
+    elements
+  } = state;
+  const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
+  const side = getSide(placement);
+  const alignment = getAlignment(placement);
+  const isVertical = getSideAxis(placement) === 'y';
+  const mainAxisMulti = ['left', 'top'].includes(side) ? -1 : 1;
+  const crossAxisMulti = rtl && isVertical ? -1 : 1;
+  const rawValue = evaluate(options, state);
+
+  // eslint-disable-next-line prefer-const
+  let {
+    mainAxis,
+    crossAxis,
+    alignmentAxis
+  } = typeof rawValue === 'number' ? {
+    mainAxis: rawValue,
+    crossAxis: 0,
+    alignmentAxis: null
+  } : {
+    mainAxis: 0,
+    crossAxis: 0,
+    alignmentAxis: null,
+    ...rawValue
+  };
+  if (alignment && typeof alignmentAxis === 'number') {
+    crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
+  }
+  return isVertical ? {
+    x: crossAxis * crossAxisMulti,
+    y: mainAxis * mainAxisMulti
+  } : {
+    x: mainAxis * mainAxisMulti,
+    y: crossAxis * crossAxisMulti
+  };
+}
+
+/**
+ * Modifies the placement by translating the floating element along the
+ * specified axes.
+ * A number (shorthand for `mainAxis` or distance), or an axes configuration
+ * object may be passed.
+ * @see https://floating-ui.com/docs/offset
+ */
+const offset = function (options) {
+  if (options === void 0) {
+    options = 0;
+  }
+  return {
+    name: 'offset',
+    options,
+    async fn(state) {
+      var _middlewareData$offse, _middlewareData$arrow;
+      const {
+        x,
+        y,
+        placement,
+        middlewareData
+      } = state;
+      const diffCoords = await convertValueToCoords(state, options);
+
+      // If the placement is the same and the arrow caused an alignment offset
+      // then we don't need to change the positioning coordinates.
+      if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
+        return {};
+      }
+      return {
+        x: x + diffCoords.x,
+        y: y + diffCoords.y,
+        data: {
+          ...diffCoords,
+          placement
+        }
+      };
+    }
+  };
+};
+
+/**
+ * Optimizes the visibility of the floating element by shifting it in order to
+ * keep it in view when it will overflow the clipping boundary.
+ * @see https://floating-ui.com/docs/shift
+ */
+const shift = function (options) {
+  if (options === void 0) {
+    options = {};
+  }
+  return {
+    name: 'shift',
+    options,
+    async fn(state) {
+      const {
+        x,
+        y,
+        placement
+      } = state;
+      const {
+        mainAxis: checkMainAxis = true,
+        crossAxis: checkCrossAxis = false,
+        limiter = {
+          fn: _ref => {
+            let {
+              x,
+              y
+            } = _ref;
+            return {
+              x,
+              y
+            };
+          }
+        },
+        ...detectOverflowOptions
+      } = evaluate(options, state);
+      const coords = {
+        x,
+        y
+      };
+      const overflow = await detectOverflow(state, detectOverflowOptions);
+      const crossAxis = getSideAxis(getSide(placement));
+      const mainAxis = getOppositeAxis(crossAxis);
+      let mainAxisCoord = coords[mainAxis];
+      let crossAxisCoord = coords[crossAxis];
+      if (checkMainAxis) {
+        const minSide = mainAxis === 'y' ? 'top' : 'left';
+        const maxSide = mainAxis === 'y' ? 'bottom' : 'right';
+        const min = mainAxisCoord + overflow[minSide];
+        const max = mainAxisCoord - overflow[maxSide];
+        mainAxisCoord = clamp(min, mainAxisCoord, max);
+      }
+      if (checkCrossAxis) {
+        const minSide = crossAxis === 'y' ? 'top' : 'left';
+        const maxSide = crossAxis === 'y' ? 'bottom' : 'right';
+        const min = crossAxisCoord + overflow[minSide];
+        const max = crossAxisCoord - overflow[maxSide];
+        crossAxisCoord = clamp(min, crossAxisCoord, max);
+      }
+      const limitedCoords = limiter.fn({
+        ...state,
+        [mainAxis]: mainAxisCoord,
+        [crossAxis]: crossAxisCoord
+      });
+      return {
+        ...limitedCoords,
+        data: {
+          x: limitedCoords.x - x,
+          y: limitedCoords.y - y
+        }
+      };
+    }
+  };
+};
+/**
+ * Built-in `limiter` that will stop `shift()` at a certain point.
+ */
+const limitShift = function (options) {
+  if (options === void 0) {
+    options = {};
+  }
+  return {
+    options,
+    fn(state) {
+      const {
+        x,
+        y,
+        placement,
+        rects,
+        middlewareData
+      } = state;
+      const {
+        offset = 0,
+        mainAxis: checkMainAxis = true,
+        crossAxis: checkCrossAxis = true
+      } = evaluate(options, state);
+      const coords = {
+        x,
+        y
+      };
+      const crossAxis = getSideAxis(placement);
+      const mainAxis = getOppositeAxis(crossAxis);
+      let mainAxisCoord = coords[mainAxis];
+      let crossAxisCoord = coords[crossAxis];
+      const rawOffset = evaluate(offset, state);
+      const computedOffset = typeof rawOffset === 'number' ? {
+        mainAxis: rawOffset,
+        crossAxis: 0
+      } : {
+        mainAxis: 0,
+        crossAxis: 0,
+        ...rawOffset
+      };
+      if (checkMainAxis) {
+        const len = mainAxis === 'y' ? 'height' : 'width';
+        const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis;
+        const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis;
+        if (mainAxisCoord < limitMin) {
+          mainAxisCoord = limitMin;
+        } else if (mainAxisCoord > limitMax) {
+          mainAxisCoord = limitMax;
+        }
+      }
+      if (checkCrossAxis) {
+        var _middlewareData$offse, _middlewareData$offse2;
+        const len = mainAxis === 'y' ? 'width' : 'height';
+        const isOriginSide = ['top', 'left'].includes(getSide(placement));
+        const limitMin = rects.reference[crossAxis] - rects.floating[len] + (isOriginSide ? ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse[crossAxis]) || 0 : 0) + (isOriginSide ? 0 : computedOffset.crossAxis);
+        const limitMax = rects.reference[crossAxis] + rects.reference[len] + (isOriginSide ? 0 : ((_middlewareData$offse2 = middlewareData.offset) == null ? void 0 : _middlewareData$offse2[crossAxis]) || 0) - (isOriginSide ? computedOffset.crossAxis : 0);
+        if (crossAxisCoord < limitMin) {
+          crossAxisCoord = limitMin;
+        } else if (crossAxisCoord > limitMax) {
+          crossAxisCoord = limitMax;
+        }
+      }
+      return {
+        [mainAxis]: mainAxisCoord,
+        [crossAxis]: crossAxisCoord
+      };
+    }
+  };
+};
+
+/**
+ * Provides data that allows you to change the size of the floating element —
+ * for instance, prevent it from overflowing the clipping boundary or match the
+ * width of the reference element.
+ * @see https://floating-ui.com/docs/size
+ */
+const size = function (options) {
+  if (options === void 0) {
+    options = {};
+  }
+  return {
+    name: 'size',
+    options,
+    async fn(state) {
+      const {
+        placement,
+        rects,
+        platform,
+        elements
+      } = state;
+      const {
+        apply = () => {},
+        ...detectOverflowOptions
+      } = evaluate(options, state);
+      const overflow = await detectOverflow(state, detectOverflowOptions);
+      const side = getSide(placement);
+      const alignment = getAlignment(placement);
+      const isYAxis = getSideAxis(placement) === 'y';
+      const {
+        width,
+        height
+      } = rects.floating;
+      let heightSide;
+      let widthSide;
+      if (side === 'top' || side === 'bottom') {
+        heightSide = side;
+        widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
+      } else {
+        widthSide = side;
+        heightSide = alignment === 'end' ? 'top' : 'bottom';
+      }
+      const maximumClippingHeight = height - overflow.top - overflow.bottom;
+      const maximumClippingWidth = width - overflow.left - overflow.right;
+      const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
+      const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
+      const noShift = !state.middlewareData.shift;
+      let availableHeight = overflowAvailableHeight;
+      let availableWidth = overflowAvailableWidth;
+      if (isYAxis) {
+        availableWidth = alignment || noShift ? min(overflowAvailableWidth, maximumClippingWidth) : maximumClippingWidth;
+      } else {
+        availableHeight = alignment || noShift ? min(overflowAvailableHeight, maximumClippingHeight) : maximumClippingHeight;
+      }
+      if (noShift && !alignment) {
+        const xMin = max(overflow.left, 0);
+        const xMax = max(overflow.right, 0);
+        const yMin = max(overflow.top, 0);
+        const yMax = max(overflow.bottom, 0);
+        if (isYAxis) {
+          availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
+        } else {
+          availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
+        }
+      }
+      await apply({
+        ...state,
+        availableWidth,
+        availableHeight
+      });
+      const nextDimensions = await platform.getDimensions(elements.floating);
+      if (width !== nextDimensions.width || height !== nextDimensions.height) {
+        return {
+          reset: {
+            rects: true
+          }
+        };
+      }
+      return {};
+    }
+  };
+};
+
+export { arrow, autoPlacement, computePosition, detectOverflow, flip, hide, inline, limitShift, offset, shift, size };
diff --git a/ddb_main/node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs b/ddb_main/node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
new file mode 100644
index 0000000..0b076ed
--- /dev/null
+++ b/ddb_main/node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
@@ -0,0 +1,715 @@
+import { rectToClientRect, detectOverflow as detectOverflow$1, offset as offset$1, autoPlacement as autoPlacement$1, shift as shift$1, flip as flip$1, size as size$1, hide as hide$1, arrow as arrow$1, inline as inline$1, limitShift as limitShift$1, computePosition as computePosition$1 } from '@floating-ui/core';
+import { round, createCoords, max, min, floor } from '@floating-ui/utils';
+import { getComputedStyle, isHTMLElement, isElement, getWindow, isWebKit, getDocumentElement, getNodeName, isOverflowElement, getNodeScroll, getOverflowAncestors, getParentNode, isLastTraversableNode, isContainingBlock, isTableElement, getContainingBlock } from '@floating-ui/utils/dom';
+export { getOverflowAncestors } from '@floating-ui/utils/dom';
+
+function getCssDimensions(element) {
+  const css = getComputedStyle(element);
+  // In testing environments, the `width` and `height` properties are empty
+  // strings for SVG elements, returning NaN. Fallback to `0` in this case.
+  let width = parseFloat(css.width) || 0;
+  let height = parseFloat(css.height) || 0;
+  const hasOffset = isHTMLElement(element);
+  const offsetWidth = hasOffset ? element.offsetWidth : width;
+  const offsetHeight = hasOffset ? element.offsetHeight : height;
+  const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
+  if (shouldFallback) {
+    width = offsetWidth;
+    height = offsetHeight;
+  }
+  return {
+    width,
+    height,
+    $: shouldFallback
+  };
+}
+
+function unwrapElement(element) {
+  return !isElement(element) ? element.contextElement : element;
+}
+
+function getScale(element) {
+  const domElement = unwrapElement(element);
+  if (!isHTMLElement(domElement)) {
+    return createCoords(1);
+  }
+  const rect = domElement.getBoundingClientRect();
+  const {
+    width,
+    height,
+    $
+  } = getCssDimensions(domElement);
+  let x = ($ ? round(rect.width) : rect.width) / width;
+  let y = ($ ? round(rect.height) : rect.height) / height;
+
+  // 0, NaN, or Infinity should always fallback to 1.
+
+  if (!x || !Number.isFinite(x)) {
+    x = 1;
+  }
+  if (!y || !Number.isFinite(y)) {
+    y = 1;
+  }
+  return {
+    x,
+    y
+  };
+}
+
+const noOffsets = /*#__PURE__*/createCoords(0);
+function getVisualOffsets(element) {
+  const win = getWindow(element);
+  if (!isWebKit() || !win.visualViewport) {
+    return noOffsets;
+  }
+  return {
+    x: win.visualViewport.offsetLeft,
+    y: win.visualViewport.offsetTop
+  };
+}
+function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
+  if (isFixed === void 0) {
+    isFixed = false;
+  }
+  if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
+    return false;
+  }
+  return isFixed;
+}
+
+function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
+  if (includeScale === void 0) {
+    includeScale = false;
+  }
+  if (isFixedStrategy === void 0) {
+    isFixedStrategy = false;
+  }
+  const clientRect = element.getBoundingClientRect();
+  const domElement = unwrapElement(element);
+  let scale = createCoords(1);
+  if (includeScale) {
+    if (offsetParent) {
+      if (isElement(offsetParent)) {
+        scale = getScale(offsetParent);
+      }
+    } else {
+      scale = getScale(element);
+    }
+  }
+  const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
+  let x = (clientRect.left + visualOffsets.x) / scale.x;
+  let y = (clientRect.top + visualOffsets.y) / scale.y;
+  let width = clientRect.width / scale.x;
+  let height = clientRect.height / scale.y;
+  if (domElement) {
+    const win = getWindow(domElement);
+    const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
+    let currentWin = win;
+    let currentIFrame = currentWin.frameElement;
+    while (currentIFrame && offsetParent && offsetWin !== currentWin) {
+      const iframeScale = getScale(currentIFrame);
+      const iframeRect = currentIFrame.getBoundingClientRect();
+      const css = getComputedStyle(currentIFrame);
+      const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
+      const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
+      x *= iframeScale.x;
+      y *= iframeScale.y;
+      width *= iframeScale.x;
+      height *= iframeScale.y;
+      x += left;
+      y += top;
+      currentWin = getWindow(currentIFrame);
+      currentIFrame = currentWin.frameElement;
+    }
+  }
+  return rectToClientRect({
+    width,
+    height,
+    x,
+    y
+  });
+}
+
+const topLayerSelectors = [':popover-open', ':modal'];
+function isTopLayer(element) {
+  return topLayerSelectors.some(selector => {
+    try {
+      return element.matches(selector);
+    } catch (e) {
+      return false;
+    }
+  });
+}
+
+function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
+  let {
+    elements,
+    rect,
+    offsetParent,
+    strategy
+  } = _ref;
+  const isFixed = strategy === 'fixed';
+  const documentElement = getDocumentElement(offsetParent);
+  const topLayer = elements ? isTopLayer(elements.floating) : false;
+  if (offsetParent === documentElement || topLayer && isFixed) {
+    return rect;
+  }
+  let scroll = {
+    scrollLeft: 0,
+    scrollTop: 0
+  };
+  let scale = createCoords(1);
+  const offsets = createCoords(0);
+  const isOffsetParentAnElement = isHTMLElement(offsetParent);
+  if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
+    if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
+      scroll = getNodeScroll(offsetParent);
+    }
+    if (isHTMLElement(offsetParent)) {
+      const offsetRect = getBoundingClientRect(offsetParent);
+      scale = getScale(offsetParent);
+      offsets.x = offsetRect.x + offsetParent.clientLeft;
+      offsets.y = offsetRect.y + offsetParent.clientTop;
+    }
+  }
+  return {
+    width: rect.width * scale.x,
+    height: rect.height * scale.y,
+    x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
+    y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
+  };
+}
+
+function getClientRects(element) {
+  return Array.from(element.getClientRects());
+}
+
+function getWindowScrollBarX(element) {
+  // If <html> has a CSS width greater than the viewport, then this will be
+  // incorrect for RTL.
+  return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft;
+}
+
+// Gets the entire size of the scrollable document area, even extending outside
+// of the `<html>` and `<body>` rect bounds if horizontally scrollable.
+function getDocumentRect(element) {
+  const html = getDocumentElement(element);
+  const scroll = getNodeScroll(element);
+  const body = element.ownerDocument.body;
+  const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
+  const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
+  let x = -scroll.scrollLeft + getWindowScrollBarX(element);
+  const y = -scroll.scrollTop;
+  if (getComputedStyle(body).direction === 'rtl') {
+    x += max(html.clientWidth, body.clientWidth) - width;
+  }
+  return {
+    width,
+    height,
+    x,
+    y
+  };
+}
+
+function getViewportRect(element, strategy) {
+  const win = getWindow(element);
+  const html = getDocumentElement(element);
+  const visualViewport = win.visualViewport;
+  let width = html.clientWidth;
+  let height = html.clientHeight;
+  let x = 0;
+  let y = 0;
+  if (visualViewport) {
+    width = visualViewport.width;
+    height = visualViewport.height;
+    const visualViewportBased = isWebKit();
+    if (!visualViewportBased || visualViewportBased && strategy === 'fixed') {
+      x = visualViewport.offsetLeft;
+      y = visualViewport.offsetTop;
+    }
+  }
+  return {
+    width,
+    height,
+    x,
+    y
+  };
+}
+
+// Returns the inner client rect, subtracting scrollbars if present.
+function getInnerBoundingClientRect(element, strategy) {
+  const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
+  const top = clientRect.top + element.clientTop;
+  const left = clientRect.left + element.clientLeft;
+  const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
+  const width = element.clientWidth * scale.x;
+  const height = element.clientHeight * scale.y;
+  const x = left * scale.x;
+  const y = top * scale.y;
+  return {
+    width,
+    height,
+    x,
+    y
+  };
+}
+function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
+  let rect;
+  if (clippingAncestor === 'viewport') {
+    rect = getViewportRect(element, strategy);
+  } else if (clippingAncestor === 'document') {
+    rect = getDocumentRect(getDocumentElement(element));
+  } else if (isElement(clippingAncestor)) {
+    rect = getInnerBoundingClientRect(clippingAncestor, strategy);
+  } else {
+    const visualOffsets = getVisualOffsets(element);
+    rect = {
+      ...clippingAncestor,
+      x: clippingAncestor.x - visualOffsets.x,
+      y: clippingAncestor.y - visualOffsets.y
+    };
+  }
+  return rectToClientRect(rect);
+}
+function hasFixedPositionAncestor(element, stopNode) {
+  const parentNode = getParentNode(element);
+  if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
+    return false;
+  }
+  return getComputedStyle(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
+}
+
+// A "clipping ancestor" is an `overflow` element with the characteristic of
+// clipping (or hiding) child elements. This returns all clipping ancestors
+// of the given element up the tree.
+function getClippingElementAncestors(element, cache) {
+  const cachedResult = cache.get(element);
+  if (cachedResult) {
+    return cachedResult;
+  }
+  let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
+  let currentContainingBlockComputedStyle = null;
+  const elementIsFixed = getComputedStyle(element).position === 'fixed';
+  let currentNode = elementIsFixed ? getParentNode(element) : element;
+
+  // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
+  while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
+    const computedStyle = getComputedStyle(currentNode);
+    const currentNodeIsContaining = isContainingBlock(currentNode);
+    if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
+      currentContainingBlockComputedStyle = null;
+    }
+    const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
+    if (shouldDropCurrentNode) {
+      // Drop non-containing blocks.
+      result = result.filter(ancestor => ancestor !== currentNode);
+    } else {
+      // Record last containing block for next iteration.
+      currentContainingBlockComputedStyle = computedStyle;
+    }
+    currentNode = getParentNode(currentNode);
+  }
+  cache.set(element, result);
+  return result;
+}
+
+// Gets the maximum area that the element is visible in due to any number of
+// clipping ancestors.
+function getClippingRect(_ref) {
+  let {
+    element,
+    boundary,
+    rootBoundary,
+    strategy
+  } = _ref;
+  const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
+  const clippingAncestors = [...elementClippingAncestors, rootBoundary];
+  const firstClippingAncestor = clippingAncestors[0];
+  const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
+    const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
+    accRect.top = max(rect.top, accRect.top);
+    accRect.right = min(rect.right, accRect.right);
+    accRect.bottom = min(rect.bottom, accRect.bottom);
+    accRect.left = max(rect.left, accRect.left);
+    return accRect;
+  }, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
+  return {
+    width: clippingRect.right - clippingRect.left,
+    height: clippingRect.bottom - clippingRect.top,
+    x: clippingRect.left,
+    y: clippingRect.top
+  };
+}
+
+function getDimensions(element) {
+  const {
+    width,
+    height
+  } = getCssDimensions(element);
+  return {
+    width,
+    height
+  };
+}
+
+function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
+  const isOffsetParentAnElement = isHTMLElement(offsetParent);
+  const documentElement = getDocumentElement(offsetParent);
+  const isFixed = strategy === 'fixed';
+  const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
+  let scroll = {
+    scrollLeft: 0,
+    scrollTop: 0
+  };
+  const offsets = createCoords(0);
+  if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
+    if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
+      scroll = getNodeScroll(offsetParent);
+    }
+    if (isOffsetParentAnElement) {
+      const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
+      offsets.x = offsetRect.x + offsetParent.clientLeft;
+      offsets.y = offsetRect.y + offsetParent.clientTop;
+    } else if (documentElement) {
+      offsets.x = getWindowScrollBarX(documentElement);
+    }
+  }
+  const x = rect.left + scroll.scrollLeft - offsets.x;
+  const y = rect.top + scroll.scrollTop - offsets.y;
+  return {
+    x,
+    y,
+    width: rect.width,
+    height: rect.height
+  };
+}
+
+function isStaticPositioned(element) {
+  return getComputedStyle(element).position === 'static';
+}
+
+function getTrueOffsetParent(element, polyfill) {
+  if (!isHTMLElement(element) || getComputedStyle(element).position === 'fixed') {
+    return null;
+  }
+  if (polyfill) {
+    return polyfill(element);
+  }
+  return element.offsetParent;
+}
+
+// Gets the closest ancestor positioned element. Handles some edge cases,
+// such as table ancestors and cross browser bugs.
+function getOffsetParent(element, polyfill) {
+  const win = getWindow(element);
+  if (isTopLayer(element)) {
+    return win;
+  }
+  if (!isHTMLElement(element)) {
+    let svgOffsetParent = getParentNode(element);
+    while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
+      if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
+        return svgOffsetParent;
+      }
+      svgOffsetParent = getParentNode(svgOffsetParent);
+    }
+    return win;
+  }
+  let offsetParent = getTrueOffsetParent(element, polyfill);
+  while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
+    offsetParent = getTrueOffsetParent(offsetParent, polyfill);
+  }
+  if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
+    return win;
+  }
+  return offsetParent || getContainingBlock(element) || win;
+}
+
+const getElementRects = async function (data) {
+  const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
+  const getDimensionsFn = this.getDimensions;
+  const floatingDimensions = await getDimensionsFn(data.floating);
+  return {
+    reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
+    floating: {
+      x: 0,
+      y: 0,
+      width: floatingDimensions.width,
+      height: floatingDimensions.height
+    }
+  };
+};
+
+function isRTL(element) {
+  return getComputedStyle(element).direction === 'rtl';
+}
+
+const platform = {
+  convertOffsetParentRelativeRectToViewportRelativeRect,
+  getDocumentElement,
+  getClippingRect,
+  getOffsetParent,
+  getElementRects,
+  getClientRects,
+  getDimensions,
+  getScale,
+  isElement,
+  isRTL
+};
+
+// https://samthor.au/2021/observing-dom/
+function observeMove(element, onMove) {
+  let io = null;
+  let timeoutId;
+  const root = getDocumentElement(element);
+  function cleanup() {
+    var _io;
+    clearTimeout(timeoutId);
+    (_io = io) == null || _io.disconnect();
+    io = null;
+  }
+  function refresh(skip, threshold) {
+    if (skip === void 0) {
+      skip = false;
+    }
+    if (threshold === void 0) {
+      threshold = 1;
+    }
+    cleanup();
+    const {
+      left,
+      top,
+      width,
+      height
+    } = element.getBoundingClientRect();
+    if (!skip) {
+      onMove();
+    }
+    if (!width || !height) {
+      return;
+    }
+    const insetTop = floor(top);
+    const insetRight = floor(root.clientWidth - (left + width));
+    const insetBottom = floor(root.clientHeight - (top + height));
+    const insetLeft = floor(left);
+    const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
+    const options = {
+      rootMargin,
+      threshold: max(0, min(1, threshold)) || 1
+    };
+    let isFirstUpdate = true;
+    function handleObserve(entries) {
+      const ratio = entries[0].intersectionRatio;
+      if (ratio !== threshold) {
+        if (!isFirstUpdate) {
+          return refresh();
+        }
+        if (!ratio) {
+          // If the reference is clipped, the ratio is 0. Throttle the refresh
+          // to prevent an infinite loop of updates.
+          timeoutId = setTimeout(() => {
+            refresh(false, 1e-7);
+          }, 1000);
+        } else {
+          refresh(false, ratio);
+        }
+      }
+      isFirstUpdate = false;
+    }
+
+    // Older browsers don't support a `document` as the root and will throw an
+    // error.
+    try {
+      io = new IntersectionObserver(handleObserve, {
+        ...options,
+        // Handle <iframe>s
+        root: root.ownerDocument
+      });
+    } catch (e) {
+      io = new IntersectionObserver(handleObserve, options);
+    }
+    io.observe(element);
+  }
+  refresh(true);
+  return cleanup;
+}
+
+/**
+ * Automatically updates the position of the floating element when necessary.
+ * Should only be called when the floating element is mounted on the DOM or
+ * visible on the screen.
+ * @returns cleanup function that should be invoked when the floating element is
+ * removed from the DOM or hidden from the screen.
+ * @see https://floating-ui.com/docs/autoUpdate
+ */
+function autoUpdate(reference, floating, update, options) {
+  if (options === void 0) {
+    options = {};
+  }
+  const {
+    ancestorScroll = true,
+    ancestorResize = true,
+    elementResize = typeof ResizeObserver === 'function',
+    layoutShift = typeof IntersectionObserver === 'function',
+    animationFrame = false
+  } = options;
+  const referenceEl = unwrapElement(reference);
+  const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...getOverflowAncestors(floating)] : [];
+  ancestors.forEach(ancestor => {
+    ancestorScroll && ancestor.addEventListener('scroll', update, {
+      passive: true
+    });
+    ancestorResize && ancestor.addEventListener('resize', update);
+  });
+  const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
+  let reobserveFrame = -1;
+  let resizeObserver = null;
+  if (elementResize) {
+    resizeObserver = new ResizeObserver(_ref => {
+      let [firstEntry] = _ref;
+      if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
+        // Prevent update loops when using the `size` middleware.
+        // https://github.com/floating-ui/floating-ui/issues/1740
+        resizeObserver.unobserve(floating);
+        cancelAnimationFrame(reobserveFrame);
+        reobserveFrame = requestAnimationFrame(() => {
+          var _resizeObserver;
+          (_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
+        });
+      }
+      update();
+    });
+    if (referenceEl && !animationFrame) {
+      resizeObserver.observe(referenceEl);
+    }
+    resizeObserver.observe(floating);
+  }
+  let frameId;
+  let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
+  if (animationFrame) {
+    frameLoop();
+  }
+  function frameLoop() {
+    const nextRefRect = getBoundingClientRect(reference);
+    if (prevRefRect && (nextRefRect.x !== prevRefRect.x || nextRefRect.y !== prevRefRect.y || nextRefRect.width !== prevRefRect.width || nextRefRect.height !== prevRefRect.height)) {
+      update();
+    }
+    prevRefRect = nextRefRect;
+    frameId = requestAnimationFrame(frameLoop);
+  }
+  update();
+  return () => {
+    var _resizeObserver2;
+    ancestors.forEach(ancestor => {
+      ancestorScroll && ancestor.removeEventListener('scroll', update);
+      ancestorResize && ancestor.removeEventListener('resize', update);
+    });
+    cleanupIo == null || cleanupIo();
+    (_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
+    resizeObserver = null;
+    if (animationFrame) {
+      cancelAnimationFrame(frameId);
+    }
+  };
+}
+
+/**
+ * Resolves with an object of overflow side offsets that determine how much the
+ * element is overflowing a given clipping boundary on each side.
+ * - positive = overflowing the boundary by that number of pixels
+ * - negative = how many pixels left before it will overflow
+ * - 0 = lies flush with the boundary
+ * @see https://floating-ui.com/docs/detectOverflow
+ */
+const detectOverflow = detectOverflow$1;
+
+/**
+ * Modifies the placement by translating the floating element along the
+ * specified axes.
+ * A number (shorthand for `mainAxis` or distance), or an axes configuration
+ * object may be passed.
+ * @see https://floating-ui.com/docs/offset
+ */
+const offset = offset$1;
+
+/**
+ * Optimizes the visibility of the floating element by choosing the placement
+ * that has the most space available automatically, without needing to specify a
+ * preferred placement. Alternative to `flip`.
+ * @see https://floating-ui.com/docs/autoPlacement
+ */
+const autoPlacement = autoPlacement$1;
+
+/**
+ * Optimizes the visibility of the floating element by shifting it in order to
+ * keep it in view when it will overflow the clipping boundary.
+ * @see https://floating-ui.com/docs/shift
+ */
+const shift = shift$1;
+
+/**
+ * Optimizes the visibility of the floating element by flipping the `placement`
+ * in order to keep it in view when the preferred placement(s) will overflow the
+ * clipping boundary. Alternative to `autoPlacement`.
+ * @see https://floating-ui.com/docs/flip
+ */
+const flip = flip$1;
+
+/**
+ * Provides data that allows you to change the size of the floating element —
+ * for instance, prevent it from overflowing the clipping boundary or match the
+ * width of the reference element.
+ * @see https://floating-ui.com/docs/size
+ */
+const size = size$1;
+
+/**
+ * Provides data to hide the floating element in applicable situations, such as
+ * when it is not in the same clipping context as the reference element.
+ * @see https://floating-ui.com/docs/hide
+ */
+const hide = hide$1;
+
+/**
+ * Provides data to position an inner element of the floating element so that it
+ * appears centered to the reference element.
+ * @see https://floating-ui.com/docs/arrow
+ */
+const arrow = arrow$1;
+
+/**
+ * Provides improved positioning for inline reference elements that can span
+ * over multiple lines, such as hyperlinks or range selections.
+ * @see https://floating-ui.com/docs/inline
+ */
+const inline = inline$1;
+
+/**
+ * Built-in `limiter` that will stop `shift()` at a certain point.
+ */
+const limitShift = limitShift$1;
+
+/**
+ * Computes the `x` and `y` coordinates that will place the floating element
+ * next to a given reference element.
+ */
+const computePosition = (reference, floating, options) => {
+  // This caches the expensive `getClippingElementAncestors` function so that
+  // multiple lifecycle resets re-use the same result. It only lives for a
+  // single call. If other functions become expensive, we can add them as well.
+  const cache = new Map();
+  const mergedOptions = {
+    platform,
+    ...options
+  };
+  const platformWithCache = {
+    ...mergedOptions.platform,
+    _c: cache
+  };
+  return computePosition$1(reference, floating, {
+    ...mergedOptions,
+    platform: platformWithCache
+  });
+};
+
+export { arrow, autoPlacement, autoUpdate, computePosition, detectOverflow, flip, hide, inline, limitShift, offset, platform, shift, size };
diff --git a/ddb_main/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs b/ddb_main/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs
new file mode 100644
index 0000000..d3ba2a9
--- /dev/null
+++ b/ddb_main/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs
@@ -0,0 +1,127 @@
+function getNodeName(node) {
+  if (isNode(node)) {
+    return (node.nodeName || '').toLowerCase();
+  }
+  // Mocked nodes in testing environments may not be instances of Node. By
+  // returning `#document` an infinite loop won't occur.
+  // https://github.com/floating-ui/floating-ui/issues/2317
+  return '#document';
+}
+function getWindow(node) {
+  var _node$ownerDocument;
+  return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
+}
+function getDocumentElement(node) {
+  var _ref;
+  return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
+}
+function isNode(value) {
+  return value instanceof Node || value instanceof getWindow(value).Node;
+}
+function isElement(value) {
+  return value instanceof Element || value instanceof getWindow(value).Element;
+}
+function isHTMLElement(value) {
+  return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
+}
+function isShadowRoot(value) {
+  // Browsers without `ShadowRoot` support.
+  if (typeof ShadowRoot === 'undefined') {
+    return false;
+  }
+  return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
+}
+function isOverflowElement(element) {
+  const {
+    overflow,
+    overflowX,
+    overflowY,
+    display
+  } = getComputedStyle(element);
+  return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !['inline', 'contents'].includes(display);
+}
+function isTableElement(element) {
+  return ['table', 'td', 'th'].includes(getNodeName(element));
+}
+function isContainingBlock(element) {
+  const webkit = isWebKit();
+  const css = getComputedStyle(element);
+
+  // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
+  return css.transform !== 'none' || css.perspective !== 'none' || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || ['transform', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value));
+}
+function getContainingBlock(element) {
+  let currentNode = getParentNode(element);
+  while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
+    if (isContainingBlock(currentNode)) {
+      return currentNode;
+    }
+    currentNode = getParentNode(currentNode);
+  }
+  return null;
+}
+function isWebKit() {
+  if (typeof CSS === 'undefined' || !CSS.supports) return false;
+  return CSS.supports('-webkit-backdrop-filter', 'none');
+}
+function isLastTraversableNode(node) {
+  return ['html', 'body', '#document'].includes(getNodeName(node));
+}
+function getComputedStyle(element) {
+  return getWindow(element).getComputedStyle(element);
+}
+function getNodeScroll(element) {
+  if (isElement(element)) {
+    return {
+      scrollLeft: element.scrollLeft,
+      scrollTop: element.scrollTop
+    };
+  }
+  return {
+    scrollLeft: element.pageXOffset,
+    scrollTop: element.pageYOffset
+  };
+}
+function getParentNode(node) {
+  if (getNodeName(node) === 'html') {
+    return node;
+  }
+  const result =
+  // Step into the shadow DOM of the parent of a slotted node.
+  node.assignedSlot ||
+  // DOM Element detected.
+  node.parentNode ||
+  // ShadowRoot detected.
+  isShadowRoot(node) && node.host ||
+  // Fallback.
+  getDocumentElement(node);
+  return isShadowRoot(result) ? result.host : result;
+}
+function getNearestOverflowAncestor(node) {
+  const parentNode = getParentNode(node);
+  if (isLastTraversableNode(parentNode)) {
+    return node.ownerDocument ? node.ownerDocument.body : node.body;
+  }
+  if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
+    return parentNode;
+  }
+  return getNearestOverflowAncestor(parentNode);
+}
+function getOverflowAncestors(node, list, traverseIframes) {
+  var _node$ownerDocument2;
+  if (list === void 0) {
+    list = [];
+  }
+  if (traverseIframes === void 0) {
+    traverseIframes = true;
+  }
+  const scrollableAncestor = getNearestOverflowAncestor(node);
+  const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
+  const win = getWindow(scrollableAncestor);
+  if (isBody) {
+    return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], win.frameElement && traverseIframes ? getOverflowAncestors(win.frameElement) : []);
+  }
+  return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
+}
+
+export { getComputedStyle, getContainingBlock, getDocumentElement, getNearestOverflowAncestor, getNodeName, getNodeScroll, getOverflowAncestors, getParentNode, getWindow, isContainingBlock, isElement, isHTMLElement, isLastTraversableNode, isNode, isOverflowElement, isShadowRoot, isTableElement, isWebKit };
diff --git a/ddb_main/node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs b/ddb_main/node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs
new file mode 100644
index 0000000..4812430
--- /dev/null
+++ b/ddb_main/node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs
@@ -0,0 +1,138 @@
+/**
+ * Custom positioning reference element.
+ * @see https://floating-ui.com/docs/virtual-elements
+ */
+
+const sides = ['top', 'right', 'bottom', 'left'];
+const alignments = ['start', 'end'];
+const placements = /*#__PURE__*/sides.reduce((acc, side) => acc.concat(side, side + "-" + alignments[0], side + "-" + alignments[1]), []);
+const min = Math.min;
+const max = Math.max;
+const round = Math.round;
+const floor = Math.floor;
+const createCoords = v => ({
+  x: v,
+  y: v
+});
+const oppositeSideMap = {
+  left: 'right',
+  right: 'left',
+  bottom: 'top',
+  top: 'bottom'
+};
+const oppositeAlignmentMap = {
+  start: 'end',
+  end: 'start'
+};
+function clamp(start, value, end) {
+  return max(start, min(value, end));
+}
+function evaluate(value, param) {
+  return typeof value === 'function' ? value(param) : value;
+}
+function getSide(placement) {
+  return placement.split('-')[0];
+}
+function getAlignment(placement) {
+  return placement.split('-')[1];
+}
+function getOppositeAxis(axis) {
+  return axis === 'x' ? 'y' : 'x';
+}
+function getAxisLength(axis) {
+  return axis === 'y' ? 'height' : 'width';
+}
+function getSideAxis(placement) {
+  return ['top', 'bottom'].includes(getSide(placement)) ? 'y' : 'x';
+}
+function getAlignmentAxis(placement) {
+  return getOppositeAxis(getSideAxis(placement));
+}
+function getAlignmentSides(placement, rects, rtl) {
+  if (rtl === void 0) {
+    rtl = false;
+  }
+  const alignment = getAlignment(placement);
+  const alignmentAxis = getAlignmentAxis(placement);
+  const length = getAxisLength(alignmentAxis);
+  let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
+  if (rects.reference[length] > rects.floating[length]) {
+    mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
+  }
+  return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
+}
+function getExpandedPlacements(placement) {
+  const oppositePlacement = getOppositePlacement(placement);
+  return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
+}
+function getOppositeAlignmentPlacement(placement) {
+  return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
+}
+function getSideList(side, isStart, rtl) {
+  const lr = ['left', 'right'];
+  const rl = ['right', 'left'];
+  const tb = ['top', 'bottom'];
+  const bt = ['bottom', 'top'];
+  switch (side) {
+    case 'top':
+    case 'bottom':
+      if (rtl) return isStart ? rl : lr;
+      return isStart ? lr : rl;
+    case 'left':
+    case 'right':
+      return isStart ? tb : bt;
+    default:
+      return [];
+  }
+}
+function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
+  const alignment = getAlignment(placement);
+  let list = getSideList(getSide(placement), direction === 'start', rtl);
+  if (alignment) {
+    list = list.map(side => side + "-" + alignment);
+    if (flipAlignment) {
+      list = list.concat(list.map(getOppositeAlignmentPlacement));
+    }
+  }
+  return list;
+}
+function getOppositePlacement(placement) {
+  return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
+}
+function expandPaddingObject(padding) {
+  return {
+    top: 0,
+    right: 0,
+    bottom: 0,
+    left: 0,
+    ...padding
+  };
+}
+function getPaddingObject(padding) {
+  return typeof padding !== 'number' ? expandPaddingObject(padding) : {
+    top: padding,
+    right: padding,
+    bottom: padding,
+    left: padding
+  };
+}
+function rectToClientRect(rect) {
+  const {
+    x,
+    y,
+    width,
+    height
+  } = rect;
+  return {
+    width,
+    height,
+    top: y,
+    left: x,
+    right: x + width,
+    bottom: y + height,
+    x,
+    y
+  };
+}
+
+export { alignments, clamp, createCoords, evaluate, expandPaddingObject, floor, getAlignment, getAlignmentAxis, getAlignmentSides, getAxisLength, getExpandedPlacements, getOppositeAlignmentPlacement, getOppositeAxis, getOppositeAxisPlacements, getOppositePlacement, getPaddingObject, getSide, getSideAxis, max, min, placements, rectToClientRect, round, sides };
diff --git a/ddb_main/node_modules/@mui/base/FocusTrap/FocusTrap.js b/ddb_main/node_modules/@mui/base/FocusTrap/FocusTrap.js
new file mode 100644
index 0000000..5aaa242
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/FocusTrap/FocusTrap.js
@@ -0,0 +1,340 @@
+'use client';
+
+/* eslint-disable consistent-return, jsx-a11y/no-noninteractive-tabindex */
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { exactProp, elementAcceptingRef, unstable_useForkRef as useForkRef, unstable_ownerDocument as ownerDocument } from '@mui/utils';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+// Inspired by https://github.com/focus-trap/tabbable
+const candidatesSelector = ['input', 'select', 'textarea', 'a[href]', 'button', '[tabindex]', 'audio[controls]', 'video[controls]', '[contenteditable]:not([contenteditable="false"])'].join(',');
+function getTabIndex(node) {
+  const tabindexAttr = parseInt(node.getAttribute('tabindex') || '', 10);
+  if (!Number.isNaN(tabindexAttr)) {
+    return tabindexAttr;
+  }
+
+  // Browsers do not return `tabIndex` correctly for contentEditable nodes;
+  // https://bugs.chromium.org/p/chromium/issues/detail?id=661108&q=contenteditable%20tabindex&can=2
+  // so if they don't have a tabindex attribute specifically set, assume it's 0.
+  // in Chrome, <details/>, <audio controls/> and <video controls/> elements get a default
+  //  `tabIndex` of -1 when the 'tabindex' attribute isn't specified in the DOM,
+  //  yet they are still part of the regular tab order; in FF, they get a default
+  //  `tabIndex` of 0; since Chrome still puts those elements in the regular tab
+  //  order, consider their tab index to be 0.
+  if (node.contentEditable === 'true' || (node.nodeName === 'AUDIO' || node.nodeName === 'VIDEO' || node.nodeName === 'DETAILS') && node.getAttribute('tabindex') === null) {
+    return 0;
+  }
+  return node.tabIndex;
+}
+function isNonTabbableRadio(node) {
+  if (node.tagName !== 'INPUT' || node.type !== 'radio') {
+    return false;
+  }
+  if (!node.name) {
+    return false;
+  }
+  const getRadio = selector => node.ownerDocument.querySelector(`input[type="radio"]${selector}`);
+  let roving = getRadio(`[name="${node.name}"]:checked`);
+  if (!roving) {
+    roving = getRadio(`[name="${node.name}"]`);
+  }
+  return roving !== node;
+}
+function isNodeMatchingSelectorFocusable(node) {
+  if (node.disabled || node.tagName === 'INPUT' && node.type === 'hidden' || isNonTabbableRadio(node)) {
+    return false;
+  }
+  return true;
+}
+function defaultGetTabbable(root) {
+  const regularTabNodes = [];
+  const orderedTabNodes = [];
+  Array.from(root.querySelectorAll(candidatesSelector)).forEach((node, i) => {
+    const nodeTabIndex = getTabIndex(node);
+    if (nodeTabIndex === -1 || !isNodeMatchingSelectorFocusable(node)) {
+      return;
+    }
+    if (nodeTabIndex === 0) {
+      regularTabNodes.push(node);
+    } else {
+      orderedTabNodes.push({
+        documentOrder: i,
+        tabIndex: nodeTabIndex,
+        node: node
+      });
+    }
+  });
+  return orderedTabNodes.sort((a, b) => a.tabIndex === b.tabIndex ? a.documentOrder - b.documentOrder : a.tabIndex - b.tabIndex).map(a => a.node).concat(regularTabNodes);
+}
+function defaultIsEnabled() {
+  return true;
+}
+
+/**
+ * Utility component that locks focus inside the component.
+ *
+ * Demos:
+ *
+ * - [Focus Trap](https://mui.com/base-ui/react-focus-trap/)
+ *
+ * API:
+ *
+ * - [FocusTrap API](https://mui.com/base-ui/react-focus-trap/components-api/#focus-trap)
+ */
+function FocusTrap(props) {
+  const {
+    children,
+    disableAutoFocus = false,
+    disableEnforceFocus = false,
+    disableRestoreFocus = false,
+    getTabbable = defaultGetTabbable,
+    isEnabled = defaultIsEnabled,
+    open
+  } = props;
+  const ignoreNextEnforceFocus = React.useRef(false);
+  const sentinelStart = React.useRef(null);
+  const sentinelEnd = React.useRef(null);
+  const nodeToRestore = React.useRef(null);
+  const reactFocusEventTarget = React.useRef(null);
+  // This variable is useful when disableAutoFocus is true.
+  // It waits for the active element to move into the component to activate.
+  const activated = React.useRef(false);
+  const rootRef = React.useRef(null);
+  // @ts-expect-error TODO upstream fix
+  const handleRef = useForkRef(children.ref, rootRef);
+  const lastKeydown = React.useRef(null);
+  React.useEffect(() => {
+    // We might render an empty child.
+    if (!open || !rootRef.current) {
+      return;
+    }
+    activated.current = !disableAutoFocus;
+  }, [disableAutoFocus, open]);
+  React.useEffect(() => {
+    // We might render an empty child.
+    if (!open || !rootRef.current) {
+      return;
+    }
+    const doc = ownerDocument(rootRef.current);
+    if (!rootRef.current.contains(doc.activeElement)) {
+      if (!rootRef.current.hasAttribute('tabIndex')) {
+        if (process.env.NODE_ENV !== 'production') {
+          console.error(['MUI: The modal content node does not accept focus.', 'For the benefit of assistive technologies, ' + 'the tabIndex of the node is being set to "-1".'].join('\n'));
+        }
+        rootRef.current.setAttribute('tabIndex', '-1');
+      }
+      if (activated.current) {
+        rootRef.current.focus();
+      }
+    }
+    return () => {
+      // restoreLastFocus()
+      if (!disableRestoreFocus) {
+        // In IE11 it is possible for document.activeElement to be null resulting
+        // in nodeToRestore.current being null.
+        // Not all elements in IE11 have a focus method.
+        // Once IE11 support is dropped the focus() call can be unconditional.
+        if (nodeToRestore.current && nodeToRestore.current.focus) {
+          ignoreNextEnforceFocus.current = true;
+          nodeToRestore.current.focus();
+        }
+        nodeToRestore.current = null;
+      }
+    };
+    // Missing `disableRestoreFocus` which is fine.
+    // We don't support changing that prop on an open FocusTrap
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [open]);
+  React.useEffect(() => {
+    // We might render an empty child.
+    if (!open || !rootRef.current) {
+      return;
+    }
+    const doc = ownerDocument(rootRef.current);
+    const loopFocus = nativeEvent => {
+      lastKeydown.current = nativeEvent;
+      if (disableEnforceFocus || !isEnabled() || nativeEvent.key !== 'Tab') {
+        return;
+      }
+
+      // Make sure the next tab starts from the right place.
+      // doc.activeElement refers to the origin.
+      if (doc.activeElement === rootRef.current && nativeEvent.shiftKey) {
+        // We need to ignore the next contain as
+        // it will try to move the focus back to the rootRef element.
+        ignoreNextEnforceFocus.current = true;
+        if (sentinelEnd.current) {
+          sentinelEnd.current.focus();
+        }
+      }
+    };
+    const contain = () => {
+      const rootElement = rootRef.current;
+
+      // Cleanup functions are executed lazily in React 17.
+      // Contain can be called between the component being unmounted and its cleanup function being run.
+      if (rootElement === null) {
+        return;
+      }
+      if (!doc.hasFocus() || !isEnabled() || ignoreNextEnforceFocus.current) {
+        ignoreNextEnforceFocus.current = false;
+        return;
+      }
+
+      // The focus is already inside
+      if (rootElement.contains(doc.activeElement)) {
+        return;
+      }
+
+      // The disableEnforceFocus is set and the focus is outside of the focus trap (and sentinel nodes)
+      if (disableEnforceFocus && doc.activeElement !== sentinelStart.current && doc.activeElement !== sentinelEnd.current) {
+        return;
+      }
+
+      // if the focus event is not coming from inside the children's react tree, reset the refs
+      if (doc.activeElement !== reactFocusEventTarget.current) {
+        reactFocusEventTarget.current = null;
+      } else if (reactFocusEventTarget.current !== null) {
+        return;
+      }
+      if (!activated.current) {
+        return;
+      }
+      let tabbable = [];
+      if (doc.activeElement === sentinelStart.current || doc.activeElement === sentinelEnd.current) {
+        tabbable = getTabbable(rootRef.current);
+      }
+
+      // one of the sentinel nodes was focused, so move the focus
+      // to the first/last tabbable element inside the focus trap
+      if (tabbable.length > 0) {
+        var _lastKeydown$current, _lastKeydown$current2;
+        const isShiftTab = Boolean(((_lastKeydown$current = lastKeydown.current) == null ? void 0 : _lastKeydown$current.shiftKey) && ((_lastKeydown$current2 = lastKeydown.current) == null ? void 0 : _lastKeydown$current2.key) === 'Tab');
+        const focusNext = tabbable[0];
+        const focusPrevious = tabbable[tabbable.length - 1];
+        if (typeof focusNext !== 'string' && typeof focusPrevious !== 'string') {
+          if (isShiftTab) {
+            focusPrevious.focus();
+          } else {
+            focusNext.focus();
+          }
+        }
+        // no tabbable elements in the trap focus or the focus was outside of the focus trap
+      } else {
+        rootElement.focus();
+      }
+    };
+    doc.addEventListener('focusin', contain);
+    doc.addEventListener('keydown', loopFocus, true);
+
+    // With Edge, Safari and Firefox, no focus related events are fired when the focused area stops being a focused area.
+    // for example https://bugzilla.mozilla.org/show_bug.cgi?id=559561.
+    // Instead, we can look if the active element was restored on the BODY element.
+    //
+    // The whatwg spec defines how the browser should behave but does not explicitly mention any events:
+    // https://html.spec.whatwg.org/multipage/interaction.html#focus-fixup-rule.
+    const interval = setInterval(() => {
+      if (doc.activeElement && doc.activeElement.tagName === 'BODY') {
+        contain();
+      }
+    }, 50);
+    return () => {
+      clearInterval(interval);
+      doc.removeEventListener('focusin', contain);
+      doc.removeEventListener('keydown', loopFocus, true);
+    };
+  }, [disableAutoFocus, disableEnforceFocus, disableRestoreFocus, isEnabled, open, getTabbable]);
+  const onFocus = event => {
+    if (nodeToRestore.current === null) {
+      nodeToRestore.current = event.relatedTarget;
+    }
+    activated.current = true;
+    reactFocusEventTarget.current = event.target;
+    const childrenPropsHandler = children.props.onFocus;
+    if (childrenPropsHandler) {
+      childrenPropsHandler(event);
+    }
+  };
+  const handleFocusSentinel = event => {
+    if (nodeToRestore.current === null) {
+      nodeToRestore.current = event.relatedTarget;
+    }
+    activated.current = true;
+  };
+  return /*#__PURE__*/_jsxs(React.Fragment, {
+    children: [/*#__PURE__*/_jsx("div", {
+      tabIndex: open ? 0 : -1,
+      onFocus: handleFocusSentinel,
+      ref: sentinelStart,
+      "data-testid": "sentinelStart"
+    }), /*#__PURE__*/React.cloneElement(children, {
+      ref: handleRef,
+      onFocus
+    }), /*#__PURE__*/_jsx("div", {
+      tabIndex: open ? 0 : -1,
+      onFocus: handleFocusSentinel,
+      ref: sentinelEnd,
+      "data-testid": "sentinelEnd"
+    })]
+  });
+}
+process.env.NODE_ENV !== "production" ? FocusTrap.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * A single child content element.
+   */
+  children: elementAcceptingRef,
+  /**
+   * If `true`, the focus trap will not automatically shift focus to itself when it opens, and
+   * replace it to the last focused element when it closes.
+   * This also works correctly with any focus trap children that have the `disableAutoFocus` prop.
+   *
+   * Generally this should never be set to `true` as it makes the focus trap less
+   * accessible to assistive technologies, like screen readers.
+   * @default false
+   */
+  disableAutoFocus: PropTypes.bool,
+  /**
+   * If `true`, the focus trap will not prevent focus from leaving the focus trap while open.
+   *
+   * Generally this should never be set to `true` as it makes the focus trap less
+   * accessible to assistive technologies, like screen readers.
+   * @default false
+   */
+  disableEnforceFocus: PropTypes.bool,
+  /**
+   * If `true`, the focus trap will not restore focus to previously focused element once
+   * focus trap is hidden or unmounted.
+   * @default false
+   */
+  disableRestoreFocus: PropTypes.bool,
+  /**
+   * Returns an array of ordered tabbable nodes (i.e. in tab order) within the root.
+   * For instance, you can provide the "tabbable" npm dependency.
+   * @param {HTMLElement} root
+   */
+  getTabbable: PropTypes.func,
+  /**
+   * This prop extends the `open` prop.
+   * It allows to toggle the open state without having to wait for a rerender when changing the `open` prop.
+   * This prop should be memoized.
+   * It can be used to support multiple focus trap mounted at the same time.
+   * @default function defaultIsEnabled(): boolean {
+   *   return true;
+   * }
+   */
+  isEnabled: PropTypes.func,
+  /**
+   * If `true`, focus is locked.
+   */
+  open: PropTypes.bool.isRequired
+} : void 0;
+if (process.env.NODE_ENV !== 'production') {
+  // eslint-disable-next-line
+  FocusTrap['propTypes' + ''] = exactProp(FocusTrap.propTypes);
+}
+export { FocusTrap };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/base/Portal/Portal.js b/ddb_main/node_modules/@mui/base/Portal/Portal.js
new file mode 100644
index 0000000..55bea9d
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/Portal/Portal.js
@@ -0,0 +1,92 @@
+'use client';
+
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+import PropTypes from 'prop-types';
+import { exactProp, HTMLElementType, unstable_useEnhancedEffect as useEnhancedEffect, unstable_useForkRef as useForkRef, unstable_setRef as setRef } from '@mui/utils';
+import { jsx as _jsx } from "react/jsx-runtime";
+function getContainer(container) {
+  return typeof container === 'function' ? container() : container;
+}
+
+/**
+ * Portals provide a first-class way to render children into a DOM node
+ * that exists outside the DOM hierarchy of the parent component.
+ *
+ * Demos:
+ *
+ * - [Portal](https://mui.com/base-ui/react-portal/)
+ *
+ * API:
+ *
+ * - [Portal API](https://mui.com/base-ui/react-portal/components-api/#portal)
+ */
+const Portal = /*#__PURE__*/React.forwardRef(function Portal(props, forwardedRef) {
+  const {
+    children,
+    container,
+    disablePortal = false
+  } = props;
+  const [mountNode, setMountNode] = React.useState(null);
+  // @ts-expect-error TODO upstream fix
+  const handleRef = useForkRef( /*#__PURE__*/React.isValidElement(children) ? children.ref : null, forwardedRef);
+  useEnhancedEffect(() => {
+    if (!disablePortal) {
+      setMountNode(getContainer(container) || document.body);
+    }
+  }, [container, disablePortal]);
+  useEnhancedEffect(() => {
+    if (mountNode && !disablePortal) {
+      setRef(forwardedRef, mountNode);
+      return () => {
+        setRef(forwardedRef, null);
+      };
+    }
+    return undefined;
+  }, [forwardedRef, mountNode, disablePortal]);
+  if (disablePortal) {
+    if ( /*#__PURE__*/React.isValidElement(children)) {
+      const newProps = {
+        ref: handleRef
+      };
+      return /*#__PURE__*/React.cloneElement(children, newProps);
+    }
+    return /*#__PURE__*/_jsx(React.Fragment, {
+      children: children
+    });
+  }
+  return /*#__PURE__*/_jsx(React.Fragment, {
+    children: mountNode ? /*#__PURE__*/ReactDOM.createPortal(children, mountNode) : mountNode
+  });
+});
+process.env.NODE_ENV !== "production" ? Portal.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The children to render into the `container`.
+   */
+  children: PropTypes.node,
+  /**
+   * An HTML element or function that returns one.
+   * The `container` will have the portal children appended to it.
+   *
+   * You can also provide a callback, which is called in a React layout effect.
+   * This lets you set the container from a ref, and also makes server-side rendering possible.
+   *
+   * By default, it uses the body of the top-level document object,
+   * so it's simply `document.body` most of the time.
+   */
+  container: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([HTMLElementType, PropTypes.func]),
+  /**
+   * The `children` will be under the DOM hierarchy of the parent component.
+   * @default false
+   */
+  disablePortal: PropTypes.bool
+} : void 0;
+if (process.env.NODE_ENV !== 'production') {
+  // eslint-disable-next-line
+  Portal['propTypes' + ''] = exactProp(Portal.propTypes);
+}
+export { Portal };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/base/TextareaAutosize/TextareaAutosize.js b/ddb_main/node_modules/@mui/base/TextareaAutosize/TextareaAutosize.js
new file mode 100644
index 0000000..646cf56
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/TextareaAutosize/TextareaAutosize.js
@@ -0,0 +1,219 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["onChange", "maxRows", "minRows", "style", "value"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { unstable_debounce as debounce, unstable_useForkRef as useForkRef, unstable_useEnhancedEffect as useEnhancedEffect, unstable_ownerWindow as ownerWindow } from '@mui/utils';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+function getStyleValue(value) {
+  return parseInt(value, 10) || 0;
+}
+const styles = {
+  shadow: {
+    // Visibility needed to hide the extra text area on iPads
+    visibility: 'hidden',
+    // Remove from the content flow
+    position: 'absolute',
+    // Ignore the scrollbar width
+    overflow: 'hidden',
+    height: 0,
+    top: 0,
+    left: 0,
+    // Create a new layer, increase the isolation of the computed values
+    transform: 'translateZ(0)'
+  }
+};
+function isEmpty(obj) {
+  return obj === undefined || obj === null || Object.keys(obj).length === 0 || obj.outerHeightStyle === 0 && !obj.overflowing;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Textarea Autosize](https://mui.com/base-ui/react-textarea-autosize/)
+ * - [Textarea Autosize](https://mui.com/material-ui/react-textarea-autosize/)
+ *
+ * API:
+ *
+ * - [TextareaAutosize API](https://mui.com/base-ui/react-textarea-autosize/components-api/#textarea-autosize)
+ */
+const TextareaAutosize = /*#__PURE__*/React.forwardRef(function TextareaAutosize(props, forwardedRef) {
+  const {
+      onChange,
+      maxRows,
+      minRows = 1,
+      style,
+      value
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const {
+    current: isControlled
+  } = React.useRef(value != null);
+  const inputRef = React.useRef(null);
+  const handleRef = useForkRef(forwardedRef, inputRef);
+  const shadowRef = React.useRef(null);
+  const calculateTextareaStyles = React.useCallback(() => {
+    const input = inputRef.current;
+    const containerWindow = ownerWindow(input);
+    const computedStyle = containerWindow.getComputedStyle(input);
+
+    // If input's width is shrunk and it's not visible, don't sync height.
+    if (computedStyle.width === '0px') {
+      return {
+        outerHeightStyle: 0,
+        overflowing: false
+      };
+    }
+    const inputShallow = shadowRef.current;
+    inputShallow.style.width = computedStyle.width;
+    inputShallow.value = input.value || props.placeholder || 'x';
+    if (inputShallow.value.slice(-1) === '\n') {
+      // Certain fonts which overflow the line height will cause the textarea
+      // to report a different scrollHeight depending on whether the last line
+      // is empty. Make it non-empty to avoid this issue.
+      inputShallow.value += ' ';
+    }
+    const boxSizing = computedStyle.boxSizing;
+    const padding = getStyleValue(computedStyle.paddingBottom) + getStyleValue(computedStyle.paddingTop);
+    const border = getStyleValue(computedStyle.borderBottomWidth) + getStyleValue(computedStyle.borderTopWidth);
+
+    // The height of the inner content
+    const innerHeight = inputShallow.scrollHeight;
+
+    // Measure height of a textarea with a single row
+    inputShallow.value = 'x';
+    const singleRowHeight = inputShallow.scrollHeight;
+
+    // The height of the outer content
+    let outerHeight = innerHeight;
+    if (minRows) {
+      outerHeight = Math.max(Number(minRows) * singleRowHeight, outerHeight);
+    }
+    if (maxRows) {
+      outerHeight = Math.min(Number(maxRows) * singleRowHeight, outerHeight);
+    }
+    outerHeight = Math.max(outerHeight, singleRowHeight);
+
+    // Take the box sizing into account for applying this value as a style.
+    const outerHeightStyle = outerHeight + (boxSizing === 'border-box' ? padding + border : 0);
+    const overflowing = Math.abs(outerHeight - innerHeight) <= 1;
+    return {
+      outerHeightStyle,
+      overflowing
+    };
+  }, [maxRows, minRows, props.placeholder]);
+  const syncHeight = React.useCallback(() => {
+    const textareaStyles = calculateTextareaStyles();
+    if (isEmpty(textareaStyles)) {
+      return;
+    }
+    const input = inputRef.current;
+    input.style.height = `${textareaStyles.outerHeightStyle}px`;
+    input.style.overflow = textareaStyles.overflowing ? 'hidden' : '';
+  }, [calculateTextareaStyles]);
+  useEnhancedEffect(() => {
+    const handleResize = () => {
+      syncHeight();
+    };
+    // Workaround a "ResizeObserver loop completed with undelivered notifications" error
+    // in test.
+    // Note that we might need to use this logic in production per https://github.com/WICG/resize-observer/issues/38
+    // Also see https://github.com/mui/mui-x/issues/8733
+    let rAF;
+    const rAFHandleResize = () => {
+      cancelAnimationFrame(rAF);
+      rAF = requestAnimationFrame(() => {
+        handleResize();
+      });
+    };
+    const debounceHandleResize = debounce(handleResize);
+    const input = inputRef.current;
+    const containerWindow = ownerWindow(input);
+    containerWindow.addEventListener('resize', debounceHandleResize);
+    let resizeObserver;
+    if (typeof ResizeObserver !== 'undefined') {
+      resizeObserver = new ResizeObserver(process.env.NODE_ENV === 'test' ? rAFHandleResize : handleResize);
+      resizeObserver.observe(input);
+    }
+    return () => {
+      debounceHandleResize.clear();
+      cancelAnimationFrame(rAF);
+      containerWindow.removeEventListener('resize', debounceHandleResize);
+      if (resizeObserver) {
+        resizeObserver.disconnect();
+      }
+    };
+  }, [calculateTextareaStyles, syncHeight]);
+  useEnhancedEffect(() => {
+    syncHeight();
+  });
+  const handleChange = event => {
+    if (!isControlled) {
+      syncHeight();
+    }
+    if (onChange) {
+      onChange(event);
+    }
+  };
+  return /*#__PURE__*/_jsxs(React.Fragment, {
+    children: [/*#__PURE__*/_jsx("textarea", _extends({
+      value: value,
+      onChange: handleChange,
+      ref: handleRef
+      // Apply the rows prop to get a "correct" first SSR paint
+      ,
+      rows: minRows,
+      style: style
+    }, other)), /*#__PURE__*/_jsx("textarea", {
+      "aria-hidden": true,
+      className: props.className,
+      readOnly: true,
+      ref: shadowRef,
+      tabIndex: -1,
+      style: _extends({}, styles.shadow, style, {
+        paddingTop: 0,
+        paddingBottom: 0
+      })
+    })]
+  });
+});
+process.env.NODE_ENV !== "production" ? TextareaAutosize.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * Maximum number of rows to display.
+   */
+  maxRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * Minimum number of rows to display.
+   * @default 1
+   */
+  minRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * @ignore
+   */
+  onChange: PropTypes.func,
+  /**
+   * @ignore
+   */
+  placeholder: PropTypes.string,
+  /**
+   * @ignore
+   */
+  style: PropTypes.object,
+  /**
+   * @ignore
+   */
+  value: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.number, PropTypes.string])
+} : void 0;
+export { TextareaAutosize };
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/base/unstable_useModal/ModalManager.js b/ddb_main/node_modules/@mui/base/unstable_useModal/ModalManager.js
new file mode 100644
index 0000000..5c7d9c6
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/unstable_useModal/ModalManager.js
@@ -0,0 +1,213 @@
+import { unstable_ownerWindow as ownerWindow, unstable_ownerDocument as ownerDocument, unstable_getScrollbarSize as getScrollbarSize } from '@mui/utils';
+// Is a vertical scrollbar displayed?
+function isOverflowing(container) {
+  const doc = ownerDocument(container);
+  if (doc.body === container) {
+    return ownerWindow(container).innerWidth > doc.documentElement.clientWidth;
+  }
+  return container.scrollHeight > container.clientHeight;
+}
+export function ariaHidden(element, show) {
+  if (show) {
+    element.setAttribute('aria-hidden', 'true');
+  } else {
+    element.removeAttribute('aria-hidden');
+  }
+}
+function getPaddingRight(element) {
+  return parseInt(ownerWindow(element).getComputedStyle(element).paddingRight, 10) || 0;
+}
+function isAriaHiddenForbiddenOnElement(element) {
+  // The forbidden HTML tags are the ones from ARIA specification that
+  // can be children of body and can't have aria-hidden attribute.
+  // cf. https://www.w3.org/TR/html-aria/#docconformance
+  const forbiddenTagNames = ['TEMPLATE', 'SCRIPT', 'STYLE', 'LINK', 'MAP', 'META', 'NOSCRIPT', 'PICTURE', 'COL', 'COLGROUP', 'PARAM', 'SLOT', 'SOURCE', 'TRACK'];
+  const isForbiddenTagName = forbiddenTagNames.indexOf(element.tagName) !== -1;
+  const isInputHidden = element.tagName === 'INPUT' && element.getAttribute('type') === 'hidden';
+  return isForbiddenTagName || isInputHidden;
+}
+function ariaHiddenSiblings(container, mountElement, currentElement, elementsToExclude, show) {
+  const blacklist = [mountElement, currentElement, ...elementsToExclude];
+  [].forEach.call(container.children, element => {
+    const isNotExcludedElement = blacklist.indexOf(element) === -1;
+    const isNotForbiddenElement = !isAriaHiddenForbiddenOnElement(element);
+    if (isNotExcludedElement && isNotForbiddenElement) {
+      ariaHidden(element, show);
+    }
+  });
+}
+function findIndexOf(items, callback) {
+  let idx = -1;
+  items.some((item, index) => {
+    if (callback(item)) {
+      idx = index;
+      return true;
+    }
+    return false;
+  });
+  return idx;
+}
+function handleContainer(containerInfo, props) {
+  const restoreStyle = [];
+  const container = containerInfo.container;
+  if (!props.disableScrollLock) {
+    if (isOverflowing(container)) {
+      // Compute the size before applying overflow hidden to avoid any scroll jumps.
+      const scrollbarSize = getScrollbarSize(ownerDocument(container));
+      restoreStyle.push({
+        value: container.style.paddingRight,
+        property: 'padding-right',
+        el: container
+      });
+      // Use computed style, here to get the real padding to add our scrollbar width.
+      container.style.paddingRight = `${getPaddingRight(container) + scrollbarSize}px`;
+
+      // .mui-fixed is a global helper.
+      const fixedElements = ownerDocument(container).querySelectorAll('.mui-fixed');
+      [].forEach.call(fixedElements, element => {
+        restoreStyle.push({
+          value: element.style.paddingRight,
+          property: 'padding-right',
+          el: element
+        });
+        element.style.paddingRight = `${getPaddingRight(element) + scrollbarSize}px`;
+      });
+    }
+    let scrollContainer;
+    if (container.parentNode instanceof DocumentFragment) {
+      scrollContainer = ownerDocument(container).body;
+    } else {
+      // Support html overflow-y: auto for scroll stability between pages
+      // https://css-tricks.com/snippets/css/force-vertical-scrollbar/
+      const parent = container.parentElement;
+      const containerWindow = ownerWindow(container);
+      scrollContainer = (parent == null ? void 0 : parent.nodeName) === 'HTML' && containerWindow.getComputedStyle(parent).overflowY === 'scroll' ? parent : container;
+    }
+
+    // Block the scroll even if no scrollbar is visible to account for mobile keyboard
+    // screensize shrink.
+    restoreStyle.push({
+      value: scrollContainer.style.overflow,
+      property: 'overflow',
+      el: scrollContainer
+    }, {
+      value: scrollContainer.style.overflowX,
+      property: 'overflow-x',
+      el: scrollContainer
+    }, {
+      value: scrollContainer.style.overflowY,
+      property: 'overflow-y',
+      el: scrollContainer
+    });
+    scrollContainer.style.overflow = 'hidden';
+  }
+  const restore = () => {
+    restoreStyle.forEach(({
+      value,
+      el,
+      property
+    }) => {
+      if (value) {
+        el.style.setProperty(property, value);
+      } else {
+        el.style.removeProperty(property);
+      }
+    });
+  };
+  return restore;
+}
+function getHiddenSiblings(container) {
+  const hiddenSiblings = [];
+  [].forEach.call(container.children, element => {
+    if (element.getAttribute('aria-hidden') === 'true') {
+      hiddenSiblings.push(element);
+    }
+  });
+  return hiddenSiblings;
+}
+/**
+ * @ignore - do not document.
+ *
+ * Proper state management for containers and the modals in those containers.
+ * Simplified, but inspired by react-overlay's ModalManager class.
+ * Used by the Modal to ensure proper styling of containers.
+ */
+export class ModalManager {
+  constructor() {
+    this.containers = void 0;
+    this.modals = void 0;
+    this.modals = [];
+    this.containers = [];
+  }
+  add(modal, container) {
+    let modalIndex = this.modals.indexOf(modal);
+    if (modalIndex !== -1) {
+      return modalIndex;
+    }
+    modalIndex = this.modals.length;
+    this.modals.push(modal);
+
+    // If the modal we are adding is already in the DOM.
+    if (modal.modalRef) {
+      ariaHidden(modal.modalRef, false);
+    }
+    const hiddenSiblings = getHiddenSiblings(container);
+    ariaHiddenSiblings(container, modal.mount, modal.modalRef, hiddenSiblings, true);
+    const containerIndex = findIndexOf(this.containers, item => item.container === container);
+    if (containerIndex !== -1) {
+      this.containers[containerIndex].modals.push(modal);
+      return modalIndex;
+    }
+    this.containers.push({
+      modals: [modal],
+      container,
+      restore: null,
+      hiddenSiblings
+    });
+    return modalIndex;
+  }
+  mount(modal, props) {
+    const containerIndex = findIndexOf(this.containers, item => item.modals.indexOf(modal) !== -1);
+    const containerInfo = this.containers[containerIndex];
+    if (!containerInfo.restore) {
+      containerInfo.restore = handleContainer(containerInfo, props);
+    }
+  }
+  remove(modal, ariaHiddenState = true) {
+    const modalIndex = this.modals.indexOf(modal);
+    if (modalIndex === -1) {
+      return modalIndex;
+    }
+    const containerIndex = findIndexOf(this.containers, item => item.modals.indexOf(modal) !== -1);
+    const containerInfo = this.containers[containerIndex];
+    containerInfo.modals.splice(containerInfo.modals.indexOf(modal), 1);
+    this.modals.splice(modalIndex, 1);
+
+    // If that was the last modal in a container, clean up the container.
+    if (containerInfo.modals.length === 0) {
+      // The modal might be closed before it had the chance to be mounted in the DOM.
+      if (containerInfo.restore) {
+        containerInfo.restore();
+      }
+      if (modal.modalRef) {
+        // In case the modal wasn't in the DOM yet.
+        ariaHidden(modal.modalRef, ariaHiddenState);
+      }
+      ariaHiddenSiblings(containerInfo.container, modal.mount, modal.modalRef, containerInfo.hiddenSiblings, false);
+      this.containers.splice(containerIndex, 1);
+    } else {
+      // Otherwise make sure the next top modal is visible to a screen reader.
+      const nextTop = containerInfo.modals[containerInfo.modals.length - 1];
+      // as soon as a modal is adding its modalRef is undefined. it can't set
+      // aria-hidden because the dom element doesn't exist either
+      // when modal was unmounted before modalRef gets null
+      if (nextTop.modalRef) {
+        ariaHidden(nextTop.modalRef, false);
+      }
+    }
+    return modalIndex;
+  }
+  isTopModal(modal) {
+    return this.modals.length > 0 && this.modals[this.modals.length - 1] === modal;
+  }
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/base/unstable_useModal/useModal.js b/ddb_main/node_modules/@mui/base/unstable_useModal/useModal.js
new file mode 100644
index 0000000..70f1af1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/unstable_useModal/useModal.js
@@ -0,0 +1,194 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { unstable_ownerDocument as ownerDocument, unstable_useForkRef as useForkRef, unstable_useEventCallback as useEventCallback, unstable_createChainedFunction as createChainedFunction } from '@mui/utils';
+import { extractEventHandlers } from '../utils';
+import { ModalManager, ariaHidden } from './ModalManager';
+function getContainer(container) {
+  return typeof container === 'function' ? container() : container;
+}
+function getHasTransition(children) {
+  return children ? children.props.hasOwnProperty('in') : false;
+}
+
+// A modal manager used to track and manage the state of open Modals.
+// Modals don't open on the server so this won't conflict with concurrent requests.
+const defaultManager = new ModalManager();
+/**
+ *
+ * Demos:
+ *
+ * - [Modal](https://mui.com/base-ui/react-modal/#hook)
+ *
+ * API:
+ *
+ * - [useModal API](https://mui.com/base-ui/react-modal/hooks-api/#use-modal)
+ */
+export function useModal(parameters) {
+  const {
+    container,
+    disableEscapeKeyDown = false,
+    disableScrollLock = false,
+    // @ts-ignore internal logic - Base UI supports the manager as a prop too
+    manager = defaultManager,
+    closeAfterTransition = false,
+    onTransitionEnter,
+    onTransitionExited,
+    children,
+    onClose,
+    open,
+    rootRef
+  } = parameters;
+
+  // @ts-ignore internal logic
+  const modal = React.useRef({});
+  const mountNodeRef = React.useRef(null);
+  const modalRef = React.useRef(null);
+  const handleRef = useForkRef(modalRef, rootRef);
+  const [exited, setExited] = React.useState(!open);
+  const hasTransition = getHasTransition(children);
+  let ariaHiddenProp = true;
+  if (parameters['aria-hidden'] === 'false' || parameters['aria-hidden'] === false) {
+    ariaHiddenProp = false;
+  }
+  const getDoc = () => ownerDocument(mountNodeRef.current);
+  const getModal = () => {
+    modal.current.modalRef = modalRef.current;
+    modal.current.mount = mountNodeRef.current;
+    return modal.current;
+  };
+  const handleMounted = () => {
+    manager.mount(getModal(), {
+      disableScrollLock
+    });
+
+    // Fix a bug on Chrome where the scroll isn't initially 0.
+    if (modalRef.current) {
+      modalRef.current.scrollTop = 0;
+    }
+  };
+  const handleOpen = useEventCallback(() => {
+    const resolvedContainer = getContainer(container) || getDoc().body;
+    manager.add(getModal(), resolvedContainer);
+
+    // The element was already mounted.
+    if (modalRef.current) {
+      handleMounted();
+    }
+  });
+  const isTopModal = React.useCallback(() => manager.isTopModal(getModal()), [manager]);
+  const handlePortalRef = useEventCallback(node => {
+    mountNodeRef.current = node;
+    if (!node) {
+      return;
+    }
+    if (open && isTopModal()) {
+      handleMounted();
+    } else if (modalRef.current) {
+      ariaHidden(modalRef.current, ariaHiddenProp);
+    }
+  });
+  const handleClose = React.useCallback(() => {
+    manager.remove(getModal(), ariaHiddenProp);
+  }, [ariaHiddenProp, manager]);
+  React.useEffect(() => {
+    return () => {
+      handleClose();
+    };
+  }, [handleClose]);
+  React.useEffect(() => {
+    if (open) {
+      handleOpen();
+    } else if (!hasTransition || !closeAfterTransition) {
+      handleClose();
+    }
+  }, [open, handleClose, hasTransition, closeAfterTransition, handleOpen]);
+  const createHandleKeyDown = otherHandlers => event => {
+    var _otherHandlers$onKeyD;
+    (_otherHandlers$onKeyD = otherHandlers.onKeyDown) == null || _otherHandlers$onKeyD.call(otherHandlers, event);
+
+    // The handler doesn't take event.defaultPrevented into account:
+    //
+    // event.preventDefault() is meant to stop default behaviors like
+    // clicking a checkbox to check it, hitting a button to submit a form,
+    // and hitting left arrow to move the cursor in a text input etc.
+    // Only special HTML elements have these default behaviors.
+    if (event.key !== 'Escape' || event.which === 229 ||
+    // Wait until IME is settled.
+    !isTopModal()) {
+      return;
+    }
+    if (!disableEscapeKeyDown) {
+      // Swallow the event, in case someone is listening for the escape key on the body.
+      event.stopPropagation();
+      if (onClose) {
+        onClose(event, 'escapeKeyDown');
+      }
+    }
+  };
+  const createHandleBackdropClick = otherHandlers => event => {
+    var _otherHandlers$onClic;
+    (_otherHandlers$onClic = otherHandlers.onClick) == null || _otherHandlers$onClic.call(otherHandlers, event);
+    if (event.target !== event.currentTarget) {
+      return;
+    }
+    if (onClose) {
+      onClose(event, 'backdropClick');
+    }
+  };
+  const getRootProps = (otherHandlers = {}) => {
+    const propsEventHandlers = extractEventHandlers(parameters);
+
+    // The custom event handlers shouldn't be spread on the root element
+    delete propsEventHandlers.onTransitionEnter;
+    delete propsEventHandlers.onTransitionExited;
+    const externalEventHandlers = _extends({}, propsEventHandlers, otherHandlers);
+    return _extends({
+      role: 'presentation'
+    }, externalEventHandlers, {
+      onKeyDown: createHandleKeyDown(externalEventHandlers),
+      ref: handleRef
+    });
+  };
+  const getBackdropProps = (otherHandlers = {}) => {
+    const externalEventHandlers = otherHandlers;
+    return _extends({
+      'aria-hidden': true
+    }, externalEventHandlers, {
+      onClick: createHandleBackdropClick(externalEventHandlers),
+      open
+    });
+  };
+  const getTransitionProps = () => {
+    const handleEnter = () => {
+      setExited(false);
+      if (onTransitionEnter) {
+        onTransitionEnter();
+      }
+    };
+    const handleExited = () => {
+      setExited(true);
+      if (onTransitionExited) {
+        onTransitionExited();
+      }
+      if (closeAfterTransition) {
+        handleClose();
+      }
+    };
+    return {
+      onEnter: createChainedFunction(handleEnter, children == null ? void 0 : children.props.onEnter),
+      onExited: createChainedFunction(handleExited, children == null ? void 0 : children.props.onExited)
+    };
+  };
+  return {
+    getRootProps,
+    getBackdropProps,
+    getTransitionProps,
+    rootRef: handleRef,
+    portalRef: handlePortalRef,
+    isTopModal,
+    exited,
+    hasTransition
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/base/utils/appendOwnerState.js b/ddb_main/node_modules/@mui/base/utils/appendOwnerState.js
new file mode 100644
index 0000000..a34a573
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/utils/appendOwnerState.js
@@ -0,0 +1,24 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { isHostComponent } from './isHostComponent';
+
+/**
+ * Type of the ownerState based on the type of an element it applies to.
+ * This resolves to the provided OwnerState for React components and `undefined` for host components.
+ * Falls back to `OwnerState | undefined` when the exact type can't be determined in development time.
+ */
+
+/**
+ * Appends the ownerState object to the props, merging with the existing one if necessary.
+ *
+ * @param elementType Type of the element that owns the `existingProps`. If the element is a DOM node or undefined, `ownerState` is not applied.
+ * @param otherProps Props of the element.
+ * @param ownerState
+ */
+export function appendOwnerState(elementType, otherProps, ownerState) {
+  if (elementType === undefined || isHostComponent(elementType)) {
+    return otherProps;
+  }
+  return _extends({}, otherProps, {
+    ownerState: _extends({}, otherProps.ownerState, ownerState)
+  });
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/base/utils/extractEventHandlers.js b/ddb_main/node_modules/@mui/base/utils/extractEventHandlers.js
new file mode 100644
index 0000000..8d7e060
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/utils/extractEventHandlers.js
@@ -0,0 +1,17 @@
+/**
+ * Extracts event handlers from a given object.
+ * A prop is considered an event handler if it is a function and its name starts with `on`.
+ *
+ * @param object An object to extract event handlers from.
+ * @param excludeKeys An array of keys to exclude from the returned object.
+ */
+export function extractEventHandlers(object, excludeKeys = []) {
+  if (object === undefined) {
+    return {};
+  }
+  const result = {};
+  Object.keys(object).filter(prop => prop.match(/^on[A-Z]/) && typeof object[prop] === 'function' && !excludeKeys.includes(prop)).forEach(prop => {
+    result[prop] = object[prop];
+  });
+  return result;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/base/utils/isHostComponent.js b/ddb_main/node_modules/@mui/base/utils/isHostComponent.js
new file mode 100644
index 0000000..ee851bb
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/utils/isHostComponent.js
@@ -0,0 +1,6 @@
+/**
+ * Determines if a given element is a DOM element name (i.e. not a React component).
+ */
+export function isHostComponent(element) {
+  return typeof element === 'string';
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/base/utils/mergeSlotProps.js b/ddb_main/node_modules/@mui/base/utils/mergeSlotProps.js
new file mode 100644
index 0000000..76ebff2
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/utils/mergeSlotProps.js
@@ -0,0 +1,69 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import clsx from 'clsx';
+import { extractEventHandlers } from './extractEventHandlers';
+import { omitEventHandlers } from './omitEventHandlers';
+/**
+ * Merges the slot component internal props (usually coming from a hook)
+ * with the externally provided ones.
+ *
+ * The merge order is (the latter overrides the former):
+ * 1. The internal props (specified as a getter function to work with get*Props hook result)
+ * 2. Additional props (specified internally on a Base UI component)
+ * 3. External props specified on the owner component. These should only be used on a root slot.
+ * 4. External props specified in the `slotProps.*` prop.
+ * 5. The `className` prop - combined from all the above.
+ * @param parameters
+ * @returns
+ */
+export function mergeSlotProps(parameters) {
+  const {
+    getSlotProps,
+    additionalProps,
+    externalSlotProps,
+    externalForwardedProps,
+    className
+  } = parameters;
+  if (!getSlotProps) {
+    // The simpler case - getSlotProps is not defined, so no internal event handlers are defined,
+    // so we can simply merge all the props without having to worry about extracting event handlers.
+    const joinedClasses = clsx(additionalProps == null ? void 0 : additionalProps.className, className, externalForwardedProps == null ? void 0 : externalForwardedProps.className, externalSlotProps == null ? void 0 : externalSlotProps.className);
+    const mergedStyle = _extends({}, additionalProps == null ? void 0 : additionalProps.style, externalForwardedProps == null ? void 0 : externalForwardedProps.style, externalSlotProps == null ? void 0 : externalSlotProps.style);
+    const props = _extends({}, additionalProps, externalForwardedProps, externalSlotProps);
+    if (joinedClasses.length > 0) {
+      props.className = joinedClasses;
+    }
+    if (Object.keys(mergedStyle).length > 0) {
+      props.style = mergedStyle;
+    }
+    return {
+      props,
+      internalRef: undefined
+    };
+  }
+
+  // In this case, getSlotProps is responsible for calling the external event handlers.
+  // We don't need to include them in the merged props because of this.
+
+  const eventHandlers = extractEventHandlers(_extends({}, externalForwardedProps, externalSlotProps));
+  const componentsPropsWithoutEventHandlers = omitEventHandlers(externalSlotProps);
+  const otherPropsWithoutEventHandlers = omitEventHandlers(externalForwardedProps);
+  const internalSlotProps = getSlotProps(eventHandlers);
+
+  // The order of classes is important here.
+  // Emotion (that we use in libraries consuming Base UI) depends on this order
+  // to properly override style. It requires the most important classes to be last
+  // (see https://github.com/mui/material-ui/pull/33205) for the related discussion.
+  const joinedClasses = clsx(internalSlotProps == null ? void 0 : internalSlotProps.className, additionalProps == null ? void 0 : additionalProps.className, className, externalForwardedProps == null ? void 0 : externalForwardedProps.className, externalSlotProps == null ? void 0 : externalSlotProps.className);
+  const mergedStyle = _extends({}, internalSlotProps == null ? void 0 : internalSlotProps.style, additionalProps == null ? void 0 : additionalProps.style, externalForwardedProps == null ? void 0 : externalForwardedProps.style, externalSlotProps == null ? void 0 : externalSlotProps.style);
+  const props = _extends({}, internalSlotProps, additionalProps, otherPropsWithoutEventHandlers, componentsPropsWithoutEventHandlers);
+  if (joinedClasses.length > 0) {
+    props.className = joinedClasses;
+  }
+  if (Object.keys(mergedStyle).length > 0) {
+    props.style = mergedStyle;
+  }
+  return {
+    props,
+    internalRef: internalSlotProps.ref
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/base/utils/omitEventHandlers.js b/ddb_main/node_modules/@mui/base/utils/omitEventHandlers.js
new file mode 100644
index 0000000..137d802
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/utils/omitEventHandlers.js
@@ -0,0 +1,17 @@
+/**
+ * Removes event handlers from the given object.
+ * A field is considered an event handler if it is a function with a name beginning with `on`.
+ *
+ * @param object Object to remove event handlers from.
+ * @returns Object with event handlers removed.
+ */
+export function omitEventHandlers(object) {
+  if (object === undefined) {
+    return {};
+  }
+  const result = {};
+  Object.keys(object).filter(prop => !(prop.match(/^on[A-Z]/) && typeof object[prop] === 'function')).forEach(prop => {
+    result[prop] = object[prop];
+  });
+  return result;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/base/utils/resolveComponentProps.js b/ddb_main/node_modules/@mui/base/utils/resolveComponentProps.js
new file mode 100644
index 0000000..c4faca4
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/utils/resolveComponentProps.js
@@ -0,0 +1,10 @@
+/**
+ * If `componentProps` is a function, calls it with the provided `ownerState`.
+ * Otherwise, just returns `componentProps`.
+ */
+export function resolveComponentProps(componentProps, ownerState, slotState) {
+  if (typeof componentProps === 'function') {
+    return componentProps(ownerState, slotState);
+  }
+  return componentProps;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/base/utils/useSlotProps.js b/ddb_main/node_modules/@mui/base/utils/useSlotProps.js
new file mode 100644
index 0000000..1a2af57
--- /dev/null
+++ b/ddb_main/node_modules/@mui/base/utils/useSlotProps.js
@@ -0,0 +1,39 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["elementType", "externalSlotProps", "ownerState", "skipResolvingSlotProps"];
+import { unstable_useForkRef as useForkRef } from '@mui/utils';
+import { appendOwnerState } from './appendOwnerState';
+import { mergeSlotProps } from './mergeSlotProps';
+import { resolveComponentProps } from './resolveComponentProps';
+/**
+ * @ignore - do not document.
+ * Builds the props to be passed into the slot of an unstyled component.
+ * It merges the internal props of the component with the ones supplied by the user, allowing to customize the behavior.
+ * If the slot component is not a host component, it also merges in the `ownerState`.
+ *
+ * @param parameters.getSlotProps - A function that returns the props to be passed to the slot component.
+ */
+export function useSlotProps(parameters) {
+  var _parameters$additiona;
+  const {
+      elementType,
+      externalSlotProps,
+      ownerState,
+      skipResolvingSlotProps = false
+    } = parameters,
+    rest = _objectWithoutPropertiesLoose(parameters, _excluded);
+  const resolvedComponentsProps = skipResolvingSlotProps ? {} : resolveComponentProps(externalSlotProps, ownerState);
+  const {
+    props: mergedProps,
+    internalRef
+  } = mergeSlotProps(_extends({}, rest, {
+    externalSlotProps: resolvedComponentsProps
+  }));
+  const ref = useForkRef(internalRef, resolvedComponentsProps == null ? void 0 : resolvedComponentsProps.ref, (_parameters$additiona = parameters.additionalProps) == null ? void 0 : _parameters$additiona.ref);
+  const props = appendOwnerState(elementType, _extends({}, mergedProps, {
+    ref
+  }), ownerState);
+  return props;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/Add.js b/ddb_main/node_modules/@mui/icons-material/Add.js
new file mode 100644
index 0000000..e2f15d8
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/Add.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
+}), 'Add');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/ArrowForwardIos.js b/ddb_main/node_modules/@mui/icons-material/ArrowForwardIos.js
new file mode 100644
index 0000000..1d4199a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/ArrowForwardIos.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M6.23 20.23 8 22l10-10L8 2 6.23 3.77 14.46 12z"
+}), 'ArrowForwardIos');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/ArrowRightAlt.js b/ddb_main/node_modules/@mui/icons-material/ArrowRightAlt.js
new file mode 100644
index 0000000..16200be
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/ArrowRightAlt.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M16.01 11H4v2h12.01v3L20 12l-3.99-4z"
+}), 'ArrowRightAlt');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/ChevronRight.js b/ddb_main/node_modules/@mui/icons-material/ChevronRight.js
new file mode 100644
index 0000000..f33f9ba
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/ChevronRight.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"
+}), 'ChevronRight');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/Close.js b/ddb_main/node_modules/@mui/icons-material/Close.js
new file mode 100644
index 0000000..1e51319
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/Close.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
+}), 'Close');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/KeyboardArrowDown.js b/ddb_main/node_modules/@mui/icons-material/KeyboardArrowDown.js
new file mode 100644
index 0000000..e03e01d
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/KeyboardArrowDown.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z"
+}), 'KeyboardArrowDown');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/QuestionMark.js b/ddb_main/node_modules/@mui/icons-material/QuestionMark.js
new file mode 100644
index 0000000..258058c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/QuestionMark.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M11.07 12.85c.77-1.39 2.25-2.21 3.11-3.44.91-1.29.4-3.7-2.18-3.7-1.69 0-2.52 1.28-2.87 2.34L6.54 6.96C7.25 4.83 9.18 3 11.99 3c2.35 0 3.96 1.07 4.78 2.41.7 1.15 1.11 3.3.03 4.9-1.2 1.77-2.35 2.31-2.97 3.45-.25.46-.35.76-.35 2.24h-2.89c-.01-.78-.13-2.05.48-3.15M14 20c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2"
+}), 'QuestionMark');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/Remove.js b/ddb_main/node_modules/@mui/icons-material/Remove.js
new file mode 100644
index 0000000..800a34c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/Remove.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M19 13H5v-2h14z"
+}), 'Remove');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/Settings.js b/ddb_main/node_modules/@mui/icons-material/Settings.js
new file mode 100644
index 0000000..f193658
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/Settings.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.09.63-.09.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6"
+}), 'Settings');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/SettingsOutlined.js b/ddb_main/node_modules/@mui/icons-material/SettingsOutlined.js
new file mode 100644
index 0000000..1caac62
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/SettingsOutlined.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M19.43 12.98c.04-.32.07-.64.07-.98 0-.34-.03-.66-.07-.98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46c-.09-.16-.26-.25-.44-.25-.06 0-.12.01-.17.03l-2.49 1c-.52-.4-1.08-.73-1.69-.98l-.38-2.65C14.46 2.18 14.25 2 14 2h-4c-.25 0-.46.18-.49.42l-.38 2.65c-.61.25-1.17.59-1.69.98l-2.49-1c-.06-.02-.12-.03-.18-.03-.17 0-.34.09-.43.25l-2 3.46c-.13.22-.07.49.12.64l2.11 1.65c-.04.32-.07.65-.07.98 0 .33.03.66.07.98l-2.11 1.65c-.19.15-.24.42-.12.64l2 3.46c.09.16.26.25.44.25.06 0 .12-.01.17-.03l2.49-1c.52.4 1.08.73 1.69.98l.38 2.65c.03.24.24.42.49.42h4c.25 0 .46-.18.49-.42l.38-2.65c.61-.25 1.17-.59 1.69-.98l2.49 1c.06.02.12.03.18.03.17 0 .34-.09.43-.25l2-3.46c.12-.22.07-.49-.12-.64zm-1.98-1.71c.04.31.05.52.05.73 0 .21-.02.43-.05.73l-.14 1.13.89.7 1.08.84-.7 1.21-1.27-.51-1.04-.42-.9.68c-.43.32-.84.56-1.25.73l-1.06.43-.16 1.13-.2 1.35h-1.4l-.19-1.35-.16-1.13-1.06-.43c-.43-.18-.83-.41-1.23-.71l-.91-.7-1.06.43-1.27.51-.7-1.21 1.08-.84.89-.7-.14-1.13c-.03-.31-.05-.54-.05-.74s.02-.43.05-.73l.14-1.13-.89-.7-1.08-.84.7-1.21 1.27.51 1.04.42.9-.68c.43-.32.84-.56 1.25-.73l1.06-.43.16-1.13.2-1.35h1.39l.19 1.35.16 1.13 1.06.43c.43.18.83.41 1.23.71l.91.7 1.06-.43 1.27-.51.7 1.21-1.07.85-.89.7zM12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4m0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2"
+}), 'SettingsOutlined');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/Videocam.js b/ddb_main/node_modules/@mui/icons-material/Videocam.js
new file mode 100644
index 0000000..e2a0ce3
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/Videocam.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M17 10.5V7c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11z"
+}), 'Videocam');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/VolumeUp.js b/ddb_main/node_modules/@mui/icons-material/VolumeUp.js
new file mode 100644
index 0000000..6f738e6
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/VolumeUp.js
@@ -0,0 +1,13 @@
+"use strict";
+"use client";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _createSvgIcon = _interopRequireDefault(require("./utils/createSvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M3 9v6h4l5 5V4L7 9zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02M14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77"
+}), 'VolumeUp');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/esm/ExpandLessRounded.js b/ddb_main/node_modules/@mui/icons-material/esm/ExpandLessRounded.js
new file mode 100644
index 0000000..1c38d14
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/esm/ExpandLessRounded.js
@@ -0,0 +1,7 @@
+"use client";
+
+import createSvgIcon from './utils/createSvgIcon';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M11.29 8.71 6.7 13.3c-.39.39-.39 1.02 0 1.41.39.39 1.02.39 1.41 0L12 10.83l3.88 3.88c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L12.7 8.71c-.38-.39-1.02-.39-1.41 0"
+}), 'ExpandLessRounded');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/esm/ExpandMoreRounded.js b/ddb_main/node_modules/@mui/icons-material/esm/ExpandMoreRounded.js
new file mode 100644
index 0000000..b59d192
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/esm/ExpandMoreRounded.js
@@ -0,0 +1,7 @@
+"use client";
+
+import createSvgIcon from './utils/createSvgIcon';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M15.88 9.29 12 13.17 8.12 9.29a.9959.9959 0 0 0-1.41 0c-.39.39-.39 1.02 0 1.41l4.59 4.59c.39.39 1.02.39 1.41 0l4.59-4.59c.39-.39.39-1.02 0-1.41-.39-.38-1.03-.39-1.42 0"
+}), 'ExpandMoreRounded');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/esm/RestartAlt.js b/ddb_main/node_modules/@mui/icons-material/esm/RestartAlt.js
new file mode 100644
index 0000000..20f61fb
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/esm/RestartAlt.js
@@ -0,0 +1,7 @@
+"use client";
+
+import createSvgIcon from './utils/createSvgIcon';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M12 5V2L8 6l4 4V7c3.31 0 6 2.69 6 6 0 2.97-2.17 5.43-5 5.91v2.02c3.95-.49 7-3.85 7-7.93 0-4.42-3.58-8-8-8m-6 8c0-1.65.67-3.15 1.76-4.24L6.34 7.34C4.9 8.79 4 10.79 4 13c0 4.08 3.05 7.44 7 7.93v-2.02c-2.83-.48-5-2.94-5-5.91"
+}), 'RestartAlt');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/icons-material/utils/createSvgIcon.js b/ddb_main/node_modules/@mui/icons-material/utils/createSvgIcon.js
new file mode 100644
index 0000000..d622e28
--- /dev/null
+++ b/ddb_main/node_modules/@mui/icons-material/utils/createSvgIcon.js
@@ -0,0 +1,13 @@
+"use strict";
+'use client';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _utils.createSvgIcon;
+  }
+});
+var _utils = require("@mui/material/utils");
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Alert/Alert.js b/ddb_main/node_modules/@mui/material/Alert/Alert.js
new file mode 100644
index 0000000..dfbad45
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Alert/Alert.js
@@ -0,0 +1,348 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["action", "children", "className", "closeText", "color", "components", "componentsProps", "icon", "iconMapping", "onClose", "role", "severity", "slotProps", "slots", "variant"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import { darken, lighten } from '@mui/system/colorManipulator';
+import { styled, createUseThemeProps } from '../zero-styled';
+import useSlot from '../utils/useSlot';
+import capitalize from '../utils/capitalize';
+import Paper from '../Paper';
+import alertClasses, { getAlertUtilityClass } from './alertClasses';
+import IconButton from '../IconButton';
+import SuccessOutlinedIcon from '../internal/svg-icons/SuccessOutlined';
+import ReportProblemOutlinedIcon from '../internal/svg-icons/ReportProblemOutlined';
+import ErrorOutlineIcon from '../internal/svg-icons/ErrorOutline';
+import InfoOutlinedIcon from '../internal/svg-icons/InfoOutlined';
+import CloseIcon from '../internal/svg-icons/Close';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useThemeProps = createUseThemeProps('MuiAlert');
+const useUtilityClasses = ownerState => {
+  const {
+    variant,
+    color,
+    severity,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', `color${capitalize(color || severity)}`, `${variant}${capitalize(color || severity)}`, `${variant}`],
+    icon: ['icon'],
+    message: ['message'],
+    action: ['action']
+  };
+  return composeClasses(slots, getAlertUtilityClass, classes);
+};
+const AlertRoot = styled(Paper, {
+  name: 'MuiAlert',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, styles[ownerState.variant], styles[`${ownerState.variant}${capitalize(ownerState.color || ownerState.severity)}`]];
+  }
+})(({
+  theme
+}) => {
+  const getColor = theme.palette.mode === 'light' ? darken : lighten;
+  const getBackgroundColor = theme.palette.mode === 'light' ? lighten : darken;
+  return _extends({}, theme.typography.body2, {
+    backgroundColor: 'transparent',
+    display: 'flex',
+    padding: '6px 16px',
+    variants: [...Object.entries(theme.palette).filter(([, value]) => value.main && value.light).map(([color]) => ({
+      props: {
+        colorSeverity: color,
+        variant: 'standard'
+      },
+      style: {
+        color: theme.vars ? theme.vars.palette.Alert[`${color}Color`] : getColor(theme.palette[color].light, 0.6),
+        backgroundColor: theme.vars ? theme.vars.palette.Alert[`${color}StandardBg`] : getBackgroundColor(theme.palette[color].light, 0.9),
+        [`& .${alertClasses.icon}`]: theme.vars ? {
+          color: theme.vars.palette.Alert[`${color}IconColor`]
+        } : {
+          color: theme.palette[color].main
+        }
+      }
+    })), ...Object.entries(theme.palette).filter(([, value]) => value.main && value.light).map(([color]) => ({
+      props: {
+        colorSeverity: color,
+        variant: 'outlined'
+      },
+      style: {
+        color: theme.vars ? theme.vars.palette.Alert[`${color}Color`] : getColor(theme.palette[color].light, 0.6),
+        border: `1px solid ${(theme.vars || theme).palette[color].light}`,
+        [`& .${alertClasses.icon}`]: theme.vars ? {
+          color: theme.vars.palette.Alert[`${color}IconColor`]
+        } : {
+          color: theme.palette[color].main
+        }
+      }
+    })), ...Object.entries(theme.palette).filter(([, value]) => value.main && value.dark).map(([color]) => ({
+      props: {
+        colorSeverity: color,
+        variant: 'filled'
+      },
+      style: _extends({
+        fontWeight: theme.typography.fontWeightMedium
+      }, theme.vars ? {
+        color: theme.vars.palette.Alert[`${color}FilledColor`],
+        backgroundColor: theme.vars.palette.Alert[`${color}FilledBg`]
+      } : {
+        backgroundColor: theme.palette.mode === 'dark' ? theme.palette[color].dark : theme.palette[color].main,
+        color: theme.palette.getContrastText(theme.palette[color].main)
+      })
+    }))]
+  });
+});
+const AlertIcon = styled('div', {
+  name: 'MuiAlert',
+  slot: 'Icon',
+  overridesResolver: (props, styles) => styles.icon
+})({
+  marginRight: 12,
+  padding: '7px 0',
+  display: 'flex',
+  fontSize: 22,
+  opacity: 0.9
+});
+const AlertMessage = styled('div', {
+  name: 'MuiAlert',
+  slot: 'Message',
+  overridesResolver: (props, styles) => styles.message
+})({
+  padding: '8px 0',
+  minWidth: 0,
+  overflow: 'auto'
+});
+const AlertAction = styled('div', {
+  name: 'MuiAlert',
+  slot: 'Action',
+  overridesResolver: (props, styles) => styles.action
+})({
+  display: 'flex',
+  alignItems: 'flex-start',
+  padding: '4px 0 0 16px',
+  marginLeft: 'auto',
+  marginRight: -8
+});
+const defaultIconMapping = {
+  success: /*#__PURE__*/_jsx(SuccessOutlinedIcon, {
+    fontSize: "inherit"
+  }),
+  warning: /*#__PURE__*/_jsx(ReportProblemOutlinedIcon, {
+    fontSize: "inherit"
+  }),
+  error: /*#__PURE__*/_jsx(ErrorOutlineIcon, {
+    fontSize: "inherit"
+  }),
+  info: /*#__PURE__*/_jsx(InfoOutlinedIcon, {
+    fontSize: "inherit"
+  })
+};
+const Alert = /*#__PURE__*/React.forwardRef(function Alert(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiAlert'
+  });
+  const {
+      action,
+      children,
+      className,
+      closeText = 'Close',
+      color,
+      components = {},
+      componentsProps = {},
+      icon,
+      iconMapping = defaultIconMapping,
+      onClose,
+      role = 'alert',
+      severity = 'success',
+      slotProps = {},
+      slots = {},
+      variant = 'standard'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    color,
+    severity,
+    variant,
+    colorSeverity: color || severity
+  });
+  const classes = useUtilityClasses(ownerState);
+  const externalForwardedProps = {
+    slots: _extends({
+      closeButton: components.CloseButton,
+      closeIcon: components.CloseIcon
+    }, slots),
+    slotProps: _extends({}, componentsProps, slotProps)
+  };
+  const [CloseButtonSlot, closeButtonProps] = useSlot('closeButton', {
+    elementType: IconButton,
+    externalForwardedProps,
+    ownerState
+  });
+  const [CloseIconSlot, closeIconProps] = useSlot('closeIcon', {
+    elementType: CloseIcon,
+    externalForwardedProps,
+    ownerState
+  });
+  return /*#__PURE__*/_jsxs(AlertRoot, _extends({
+    role: role,
+    elevation: 0,
+    ownerState: ownerState,
+    className: clsx(classes.root, className),
+    ref: ref
+  }, other, {
+    children: [icon !== false ? /*#__PURE__*/_jsx(AlertIcon, {
+      ownerState: ownerState,
+      className: classes.icon,
+      children: icon || iconMapping[severity] || defaultIconMapping[severity]
+    }) : null, /*#__PURE__*/_jsx(AlertMessage, {
+      ownerState: ownerState,
+      className: classes.message,
+      children: children
+    }), action != null ? /*#__PURE__*/_jsx(AlertAction, {
+      ownerState: ownerState,
+      className: classes.action,
+      children: action
+    }) : null, action == null && onClose ? /*#__PURE__*/_jsx(AlertAction, {
+      ownerState: ownerState,
+      className: classes.action,
+      children: /*#__PURE__*/_jsx(CloseButtonSlot, _extends({
+        size: "small",
+        "aria-label": closeText,
+        title: closeText,
+        color: "inherit",
+        onClick: onClose
+      }, closeButtonProps, {
+        children: /*#__PURE__*/_jsx(CloseIconSlot, _extends({
+          fontSize: "small"
+        }, closeIconProps))
+      }))
+    }) : null]
+  }));
+});
+process.env.NODE_ENV !== "production" ? Alert.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The action to display. It renders after the message, at the end of the alert.
+   */
+  action: PropTypes.node,
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * Override the default label for the *close popup* icon button.
+   *
+   * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
+   * @default 'Close'
+   */
+  closeText: PropTypes.string,
+  /**
+   * The color of the component. Unless provided, the value is taken from the `severity` prop.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * The components used for each slot inside.
+   *
+   * @deprecated use the `slots` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
+   *
+   * @default {}
+   */
+  components: PropTypes.shape({
+    CloseButton: PropTypes.elementType,
+    CloseIcon: PropTypes.elementType
+  }),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
+   *
+   * @default {}
+   */
+  componentsProps: PropTypes.shape({
+    closeButton: PropTypes.object,
+    closeIcon: PropTypes.object
+  }),
+  /**
+   * Override the icon displayed before the children.
+   * Unless provided, the icon is mapped to the value of the `severity` prop.
+   * Set to `false` to remove the `icon`.
+   */
+  icon: PropTypes.node,
+  /**
+   * The component maps the `severity` prop to a range of different icons,
+   * for instance success to `<SuccessOutlined>`.
+   * If you wish to change this mapping, you can provide your own.
+   * Alternatively, you can use the `icon` prop to override the icon displayed.
+   */
+  iconMapping: PropTypes.shape({
+    error: PropTypes.node,
+    info: PropTypes.node,
+    success: PropTypes.node,
+    warning: PropTypes.node
+  }),
+  /**
+   * Callback fired when the component requests to be closed.
+   * When provided and no `action` prop is set, a close icon button is displayed that triggers the callback when clicked.
+   * @param {React.SyntheticEvent} event The event source of the callback.
+   */
+  onClose: PropTypes.func,
+  /**
+   * The ARIA role attribute of the element.
+   * @default 'alert'
+   */
+  role: PropTypes.string,
+  /**
+   * The severity of the alert. This defines the color and icon used.
+   * @default 'success'
+   */
+  severity: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    closeButton: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    closeIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    closeButton: PropTypes.elementType,
+    closeIcon: PropTypes.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The variant to use.
+   * @default 'standard'
+   */
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['filled', 'outlined', 'standard']), PropTypes.string])
+} : void 0;
+export default Alert;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Alert/alertClasses.js b/ddb_main/node_modules/@mui/material/Alert/alertClasses.js
new file mode 100644
index 0000000..6808613
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Alert/alertClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getAlertUtilityClass(slot) {
+  return generateUtilityClass('MuiAlert', slot);
+}
+const alertClasses = generateUtilityClasses('MuiAlert', ['root', 'action', 'icon', 'message', 'filled', 'colorSuccess', 'colorInfo', 'colorWarning', 'colorError', 'filledSuccess', 'filledInfo', 'filledWarning', 'filledError', 'outlined', 'outlinedSuccess', 'outlinedInfo', 'outlinedWarning', 'outlinedError', 'standard', 'standardSuccess', 'standardInfo', 'standardWarning', 'standardError']);
+export default alertClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/AppBar/AppBar.js b/ddb_main/node_modules/@mui/material/AppBar/AppBar.js
new file mode 100644
index 0000000..c75d4f2
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/AppBar/AppBar.js
@@ -0,0 +1,178 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "color", "enableColorOnDark", "position"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import capitalize from '../utils/capitalize';
+import Paper from '../Paper';
+import { getAppBarUtilityClass } from './appBarClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    color,
+    position,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', `color${capitalize(color)}`, `position${capitalize(position)}`]
+  };
+  return composeClasses(slots, getAppBarUtilityClass, classes);
+};
+
+// var2 is the fallback.
+// Ex. var1: 'var(--a)', var2: 'var(--b)'; return: 'var(--a, var(--b))'
+const joinVars = (var1, var2) => var1 ? `${var1 == null ? void 0 : var1.replace(')', '')}, ${var2})` : var2;
+const AppBarRoot = styled(Paper, {
+  name: 'MuiAppBar',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, styles[`position${capitalize(ownerState.position)}`], styles[`color${capitalize(ownerState.color)}`]];
+  }
+})(({
+  theme,
+  ownerState
+}) => {
+  const backgroundColorDefault = theme.palette.mode === 'light' ? theme.palette.grey[100] : theme.palette.grey[900];
+  return _extends({
+    display: 'flex',
+    flexDirection: 'column',
+    width: '100%',
+    boxSizing: 'border-box',
+    // Prevent padding issue with the Modal and fixed positioned AppBar.
+    flexShrink: 0
+  }, ownerState.position === 'fixed' && {
+    position: 'fixed',
+    zIndex: (theme.vars || theme).zIndex.appBar,
+    top: 0,
+    left: 'auto',
+    right: 0,
+    '@media print': {
+      // Prevent the app bar to be visible on each printed page.
+      position: 'absolute'
+    }
+  }, ownerState.position === 'absolute' && {
+    position: 'absolute',
+    zIndex: (theme.vars || theme).zIndex.appBar,
+    top: 0,
+    left: 'auto',
+    right: 0
+  }, ownerState.position === 'sticky' && {
+    // ⚠️ sticky is not supported by IE11.
+    position: 'sticky',
+    zIndex: (theme.vars || theme).zIndex.appBar,
+    top: 0,
+    left: 'auto',
+    right: 0
+  }, ownerState.position === 'static' && {
+    position: 'static'
+  }, ownerState.position === 'relative' && {
+    position: 'relative'
+  }, !theme.vars && _extends({}, ownerState.color === 'default' && {
+    backgroundColor: backgroundColorDefault,
+    color: theme.palette.getContrastText(backgroundColorDefault)
+  }, ownerState.color && ownerState.color !== 'default' && ownerState.color !== 'inherit' && ownerState.color !== 'transparent' && {
+    backgroundColor: theme.palette[ownerState.color].main,
+    color: theme.palette[ownerState.color].contrastText
+  }, ownerState.color === 'inherit' && {
+    color: 'inherit'
+  }, theme.palette.mode === 'dark' && !ownerState.enableColorOnDark && {
+    backgroundColor: null,
+    color: null
+  }, ownerState.color === 'transparent' && _extends({
+    backgroundColor: 'transparent',
+    color: 'inherit'
+  }, theme.palette.mode === 'dark' && {
+    backgroundImage: 'none'
+  })), theme.vars && _extends({}, ownerState.color === 'default' && {
+    '--AppBar-background': ownerState.enableColorOnDark ? theme.vars.palette.AppBar.defaultBg : joinVars(theme.vars.palette.AppBar.darkBg, theme.vars.palette.AppBar.defaultBg),
+    '--AppBar-color': ownerState.enableColorOnDark ? theme.vars.palette.text.primary : joinVars(theme.vars.palette.AppBar.darkColor, theme.vars.palette.text.primary)
+  }, ownerState.color && !ownerState.color.match(/^(default|inherit|transparent)$/) && {
+    '--AppBar-background': ownerState.enableColorOnDark ? theme.vars.palette[ownerState.color].main : joinVars(theme.vars.palette.AppBar.darkBg, theme.vars.palette[ownerState.color].main),
+    '--AppBar-color': ownerState.enableColorOnDark ? theme.vars.palette[ownerState.color].contrastText : joinVars(theme.vars.palette.AppBar.darkColor, theme.vars.palette[ownerState.color].contrastText)
+  }, {
+    backgroundColor: 'var(--AppBar-background)',
+    color: ownerState.color === 'inherit' ? 'inherit' : 'var(--AppBar-color)'
+  }, ownerState.color === 'transparent' && {
+    backgroundImage: 'none',
+    backgroundColor: 'transparent',
+    color: 'inherit'
+  }));
+});
+const AppBar = /*#__PURE__*/React.forwardRef(function AppBar(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiAppBar'
+  });
+  const {
+      className,
+      color = 'primary',
+      enableColorOnDark = false,
+      position = 'fixed'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    color,
+    position,
+    enableColorOnDark
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(AppBarRoot, _extends({
+    square: true,
+    component: "header",
+    ownerState: ownerState,
+    elevation: 4,
+    className: clsx(classes.root, className, position === 'fixed' && 'mui-fixed'),
+    ref: ref
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? AppBar.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'primary'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['default', 'inherit', 'primary', 'secondary', 'transparent', 'error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * If true, the `color` prop is applied in dark mode.
+   * @default false
+   */
+  enableColorOnDark: PropTypes.bool,
+  /**
+   * The positioning type. The behavior of the different options is described
+   * [in the MDN web docs](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Positioning).
+   * Note: `sticky` is not universally supported and will fall back to `static` when unavailable.
+   * @default 'fixed'
+   */
+  position: PropTypes.oneOf(['absolute', 'fixed', 'relative', 'static', 'sticky']),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default AppBar;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/AppBar/appBarClasses.js b/ddb_main/node_modules/@mui/material/AppBar/appBarClasses.js
new file mode 100644
index 0000000..136a317
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/AppBar/appBarClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getAppBarUtilityClass(slot) {
+  return generateUtilityClass('MuiAppBar', slot);
+}
+const appBarClasses = generateUtilityClasses('MuiAppBar', ['root', 'positionFixed', 'positionAbsolute', 'positionSticky', 'positionStatic', 'positionRelative', 'colorDefault', 'colorPrimary', 'colorSecondary', 'colorInherit', 'colorTransparent', 'colorError', 'colorInfo', 'colorSuccess', 'colorWarning']);
+export default appBarClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Avatar/Avatar.js b/ddb_main/node_modules/@mui/material/Avatar/Avatar.js
new file mode 100644
index 0000000..863771c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Avatar/Avatar.js
@@ -0,0 +1,289 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["alt", "children", "className", "component", "slots", "slotProps", "imgProps", "sizes", "src", "srcSet", "variant"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import { styled, createUseThemeProps } from '../zero-styled';
+import Person from '../internal/svg-icons/Person';
+import { getAvatarUtilityClass } from './avatarClasses';
+import useSlot from '../utils/useSlot';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useThemeProps = createUseThemeProps('MuiAvatar');
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    variant,
+    colorDefault
+  } = ownerState;
+  const slots = {
+    root: ['root', variant, colorDefault && 'colorDefault'],
+    img: ['img'],
+    fallback: ['fallback']
+  };
+  return composeClasses(slots, getAvatarUtilityClass, classes);
+};
+const AvatarRoot = styled('div', {
+  name: 'MuiAvatar',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, styles[ownerState.variant], ownerState.colorDefault && styles.colorDefault];
+  }
+})(({
+  theme
+}) => ({
+  position: 'relative',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  flexShrink: 0,
+  width: 40,
+  height: 40,
+  fontFamily: theme.typography.fontFamily,
+  fontSize: theme.typography.pxToRem(20),
+  lineHeight: 1,
+  borderRadius: '50%',
+  overflow: 'hidden',
+  userSelect: 'none',
+  variants: [{
+    props: {
+      variant: 'rounded'
+    },
+    style: {
+      borderRadius: (theme.vars || theme).shape.borderRadius
+    }
+  }, {
+    props: {
+      variant: 'square'
+    },
+    style: {
+      borderRadius: 0
+    }
+  }, {
+    props: {
+      colorDefault: true
+    },
+    style: _extends({
+      color: (theme.vars || theme).palette.background.default
+    }, theme.vars ? {
+      backgroundColor: theme.vars.palette.Avatar.defaultBg
+    } : _extends({
+      backgroundColor: theme.palette.grey[400]
+    }, theme.applyStyles('dark', {
+      backgroundColor: theme.palette.grey[600]
+    })))
+  }]
+}));
+const AvatarImg = styled('img', {
+  name: 'MuiAvatar',
+  slot: 'Img',
+  overridesResolver: (props, styles) => styles.img
+})({
+  width: '100%',
+  height: '100%',
+  textAlign: 'center',
+  // Handle non-square image. The property isn't supported by IE11.
+  objectFit: 'cover',
+  // Hide alt text.
+  color: 'transparent',
+  // Hide the image broken icon, only works on Chrome.
+  textIndent: 10000
+});
+const AvatarFallback = styled(Person, {
+  name: 'MuiAvatar',
+  slot: 'Fallback',
+  overridesResolver: (props, styles) => styles.fallback
+})({
+  width: '75%',
+  height: '75%'
+});
+function useLoaded({
+  crossOrigin,
+  referrerPolicy,
+  src,
+  srcSet
+}) {
+  const [loaded, setLoaded] = React.useState(false);
+  React.useEffect(() => {
+    if (!src && !srcSet) {
+      return undefined;
+    }
+    setLoaded(false);
+    let active = true;
+    const image = new Image();
+    image.onload = () => {
+      if (!active) {
+        return;
+      }
+      setLoaded('loaded');
+    };
+    image.onerror = () => {
+      if (!active) {
+        return;
+      }
+      setLoaded('error');
+    };
+    image.crossOrigin = crossOrigin;
+    image.referrerPolicy = referrerPolicy;
+    image.src = src;
+    if (srcSet) {
+      image.srcset = srcSet;
+    }
+    return () => {
+      active = false;
+    };
+  }, [crossOrigin, referrerPolicy, src, srcSet]);
+  return loaded;
+}
+const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiAvatar'
+  });
+  const {
+      alt,
+      children: childrenProp,
+      className,
+      component = 'div',
+      slots = {},
+      slotProps = {},
+      imgProps,
+      sizes,
+      src,
+      srcSet,
+      variant = 'circular'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  let children = null;
+
+  // Use a hook instead of onError on the img element to support server-side rendering.
+  const loaded = useLoaded(_extends({}, imgProps, {
+    src,
+    srcSet
+  }));
+  const hasImg = src || srcSet;
+  const hasImgNotFailing = hasImg && loaded !== 'error';
+  const ownerState = _extends({}, props, {
+    colorDefault: !hasImgNotFailing,
+    component,
+    variant
+  });
+  const classes = useUtilityClasses(ownerState);
+  const [ImgSlot, imgSlotProps] = useSlot('img', {
+    className: classes.img,
+    elementType: AvatarImg,
+    externalForwardedProps: {
+      slots,
+      slotProps: {
+        img: _extends({}, imgProps, slotProps.img)
+      }
+    },
+    additionalProps: {
+      alt,
+      src,
+      srcSet,
+      sizes
+    },
+    ownerState
+  });
+  if (hasImgNotFailing) {
+    children = /*#__PURE__*/_jsx(ImgSlot, _extends({}, imgSlotProps));
+    // We only render valid children, non valid children are rendered with a fallback
+    // We consider that invalid children are all falsy values, except 0, which is valid.
+  } else if (!!childrenProp || childrenProp === 0) {
+    children = childrenProp;
+  } else if (hasImg && alt) {
+    children = alt[0];
+  } else {
+    children = /*#__PURE__*/_jsx(AvatarFallback, {
+      ownerState: ownerState,
+      className: classes.fallback
+    });
+  }
+  return /*#__PURE__*/_jsx(AvatarRoot, _extends({
+    as: component,
+    ownerState: ownerState,
+    className: clsx(classes.root, className),
+    ref: ref
+  }, other, {
+    children: children
+  }));
+});
+process.env.NODE_ENV !== "production" ? Avatar.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Used in combination with `src` or `srcSet` to
+   * provide an alt attribute for the rendered `img` element.
+   */
+  alt: PropTypes.string,
+  /**
+   * Used to render icon or text elements inside the Avatar if `src` is not set.
+   * This can be an element, or just a string.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.
+   * It can be used to listen for the loading error event.
+   * @deprecated Use `slotProps.img` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
+   */
+  imgProps: PropTypes.object,
+  /**
+   * The `sizes` attribute for the `img` element.
+   */
+  sizes: PropTypes.string,
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    img: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    img: PropTypes.elementType
+  }),
+  /**
+   * The `src` attribute for the `img` element.
+   */
+  src: PropTypes.string,
+  /**
+   * The `srcSet` attribute for the `img` element.
+   * Use this attribute for responsive image display.
+   */
+  srcSet: PropTypes.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The shape of the avatar.
+   * @default 'circular'
+   */
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['circular', 'rounded', 'square']), PropTypes.string])
+} : void 0;
+export default Avatar;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Avatar/avatarClasses.js b/ddb_main/node_modules/@mui/material/Avatar/avatarClasses.js
new file mode 100644
index 0000000..8ba7eeb
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Avatar/avatarClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getAvatarUtilityClass(slot) {
+  return generateUtilityClass('MuiAvatar', slot);
+}
+const avatarClasses = generateUtilityClasses('MuiAvatar', ['root', 'colorDefault', 'circular', 'rounded', 'square', 'img', 'fallback']);
+export default avatarClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Backdrop/Backdrop.js b/ddb_main/node_modules/@mui/material/Backdrop/Backdrop.js
new file mode 100644
index 0000000..7d5bc86
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Backdrop/Backdrop.js
@@ -0,0 +1,188 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "className", "component", "components", "componentsProps", "invisible", "open", "slotProps", "slots", "TransitionComponent", "transitionDuration"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import Fade from '../Fade';
+import { getBackdropUtilityClass } from './backdropClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    invisible
+  } = ownerState;
+  const slots = {
+    root: ['root', invisible && 'invisible']
+  };
+  return composeClasses(slots, getBackdropUtilityClass, classes);
+};
+const BackdropRoot = styled('div', {
+  name: 'MuiBackdrop',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.invisible && styles.invisible];
+  }
+})(({
+  ownerState
+}) => _extends({
+  position: 'fixed',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  right: 0,
+  bottom: 0,
+  top: 0,
+  left: 0,
+  backgroundColor: 'rgba(0, 0, 0, 0.5)',
+  WebkitTapHighlightColor: 'transparent'
+}, ownerState.invisible && {
+  backgroundColor: 'transparent'
+}));
+const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(inProps, ref) {
+  var _slotProps$root, _ref, _slots$root;
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiBackdrop'
+  });
+  const {
+      children,
+      className,
+      component = 'div',
+      components = {},
+      componentsProps = {},
+      invisible = false,
+      open,
+      slotProps = {},
+      slots = {},
+      TransitionComponent = Fade,
+      transitionDuration
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    component,
+    invisible
+  });
+  const classes = useUtilityClasses(ownerState);
+  const rootSlotProps = (_slotProps$root = slotProps.root) != null ? _slotProps$root : componentsProps.root;
+  return /*#__PURE__*/_jsx(TransitionComponent, _extends({
+    in: open,
+    timeout: transitionDuration
+  }, other, {
+    children: /*#__PURE__*/_jsx(BackdropRoot, _extends({
+      "aria-hidden": true
+    }, rootSlotProps, {
+      as: (_ref = (_slots$root = slots.root) != null ? _slots$root : components.Root) != null ? _ref : component,
+      className: clsx(classes.root, className, rootSlotProps == null ? void 0 : rootSlotProps.className),
+      ownerState: _extends({}, ownerState, rootSlotProps == null ? void 0 : rootSlotProps.ownerState),
+      classes: classes,
+      ref: ref,
+      children: children
+    }))
+  }));
+});
+process.env.NODE_ENV !== "production" ? Backdrop.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `slots` prop.
+   * It's recommended to use the `slots` prop instead.
+   *
+   * @default {}
+   */
+  components: PropTypes.shape({
+    Root: PropTypes.elementType
+  }),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `slotProps` prop.
+   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   *
+   * @default {}
+   */
+  componentsProps: PropTypes.shape({
+    root: PropTypes.object
+  }),
+  /**
+   * If `true`, the backdrop is invisible.
+   * It can be used when rendering a popover or a custom select component.
+   * @default false
+   */
+  invisible: PropTypes.bool,
+  /**
+   * If `true`, the component is shown.
+   */
+  open: PropTypes.bool.isRequired,
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    root: PropTypes.object
+  }),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `components` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    root: PropTypes.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The component used for the transition.
+   * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
+   * @default Fade
+   */
+  TransitionComponent: PropTypes.elementType,
+  /**
+   * The duration for the transition, in milliseconds.
+   * You may specify a single timeout for all transitions, or individually with an object.
+   */
+  transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+    appear: PropTypes.number,
+    enter: PropTypes.number,
+    exit: PropTypes.number
+  })])
+} : void 0;
+export default Backdrop;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Backdrop/backdropClasses.js b/ddb_main/node_modules/@mui/material/Backdrop/backdropClasses.js
new file mode 100644
index 0000000..68af6cf
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Backdrop/backdropClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getBackdropUtilityClass(slot) {
+  return generateUtilityClass('MuiBackdrop', slot);
+}
+const backdropClasses = generateUtilityClasses('MuiBackdrop', ['root', 'invisible']);
+export default backdropClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Box/Box.js b/ddb_main/node_modules/@mui/material/Box/Box.js
new file mode 100644
index 0000000..4b2fdc7
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Box/Box.js
@@ -0,0 +1,35 @@
+'use client';
+
+import { createBox } from '@mui/system';
+import PropTypes from 'prop-types';
+import { unstable_ClassNameGenerator as ClassNameGenerator } from '../className';
+import { createTheme } from '../styles';
+import THEME_ID from '../styles/identifier';
+import boxClasses from './boxClasses';
+const defaultTheme = createTheme();
+const Box = createBox({
+  themeId: THEME_ID,
+  defaultTheme,
+  defaultClassName: boxClasses.root,
+  generateClassName: ClassNameGenerator.generate
+});
+process.env.NODE_ENV !== "production" ? Box.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  children: PropTypes.node,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default Box;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Box/boxClasses.js b/ddb_main/node_modules/@mui/material/Box/boxClasses.js
new file mode 100644
index 0000000..b318977
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Box/boxClasses.js
@@ -0,0 +1,3 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+const boxClasses = generateUtilityClasses('MuiBox', ['root']);
+export default boxClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Button/Button.js b/ddb_main/node_modules/@mui/material/Button/Button.js
new file mode 100644
index 0000000..cb4c347
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Button/Button.js
@@ -0,0 +1,379 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "color", "component", "className", "disabled", "disableElevation", "disableFocusRipple", "endIcon", "focusVisibleClassName", "fullWidth", "size", "startIcon", "type", "variant"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import resolveProps from '@mui/utils/resolveProps';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha } from '@mui/system/colorManipulator';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import ButtonBase from '../ButtonBase';
+import capitalize from '../utils/capitalize';
+import buttonClasses, { getButtonUtilityClass } from './buttonClasses';
+import ButtonGroupContext from '../ButtonGroup/ButtonGroupContext';
+import ButtonGroupButtonContext from '../ButtonGroup/ButtonGroupButtonContext';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    color,
+    disableElevation,
+    fullWidth,
+    size,
+    variant,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', variant, `${variant}${capitalize(color)}`, `size${capitalize(size)}`, `${variant}Size${capitalize(size)}`, `color${capitalize(color)}`, disableElevation && 'disableElevation', fullWidth && 'fullWidth'],
+    label: ['label'],
+    startIcon: ['icon', 'startIcon', `iconSize${capitalize(size)}`],
+    endIcon: ['icon', 'endIcon', `iconSize${capitalize(size)}`]
+  };
+  const composedClasses = composeClasses(slots, getButtonUtilityClass, classes);
+  return _extends({}, classes, composedClasses);
+};
+const commonIconStyles = ownerState => _extends({}, ownerState.size === 'small' && {
+  '& > *:nth-of-type(1)': {
+    fontSize: 18
+  }
+}, ownerState.size === 'medium' && {
+  '& > *:nth-of-type(1)': {
+    fontSize: 20
+  }
+}, ownerState.size === 'large' && {
+  '& > *:nth-of-type(1)': {
+    fontSize: 22
+  }
+});
+const ButtonRoot = styled(ButtonBase, {
+  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
+  name: 'MuiButton',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, styles[ownerState.variant], styles[`${ownerState.variant}${capitalize(ownerState.color)}`], styles[`size${capitalize(ownerState.size)}`], styles[`${ownerState.variant}Size${capitalize(ownerState.size)}`], ownerState.color === 'inherit' && styles.colorInherit, ownerState.disableElevation && styles.disableElevation, ownerState.fullWidth && styles.fullWidth];
+  }
+})(({
+  theme,
+  ownerState
+}) => {
+  var _theme$palette$getCon, _theme$palette;
+  const inheritContainedBackgroundColor = theme.palette.mode === 'light' ? theme.palette.grey[300] : theme.palette.grey[800];
+  const inheritContainedHoverBackgroundColor = theme.palette.mode === 'light' ? theme.palette.grey.A100 : theme.palette.grey[700];
+  return _extends({}, theme.typography.button, {
+    minWidth: 64,
+    padding: '6px 16px',
+    borderRadius: (theme.vars || theme).shape.borderRadius,
+    transition: theme.transitions.create(['background-color', 'box-shadow', 'border-color', 'color'], {
+      duration: theme.transitions.duration.short
+    }),
+    '&:hover': _extends({
+      textDecoration: 'none',
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.text.primaryChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.text.primary, theme.palette.action.hoverOpacity),
+      // Reset on touch devices, it doesn't add specificity
+      '@media (hover: none)': {
+        backgroundColor: 'transparent'
+      }
+    }, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
+      // Reset on touch devices, it doesn't add specificity
+      '@media (hover: none)': {
+        backgroundColor: 'transparent'
+      }
+    }, ownerState.variant === 'outlined' && ownerState.color !== 'inherit' && {
+      border: `1px solid ${(theme.vars || theme).palette[ownerState.color].main}`,
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
+      // Reset on touch devices, it doesn't add specificity
+      '@media (hover: none)': {
+        backgroundColor: 'transparent'
+      }
+    }, ownerState.variant === 'contained' && {
+      backgroundColor: theme.vars ? theme.vars.palette.Button.inheritContainedHoverBg : inheritContainedHoverBackgroundColor,
+      boxShadow: (theme.vars || theme).shadows[4],
+      // Reset on touch devices, it doesn't add specificity
+      '@media (hover: none)': {
+        boxShadow: (theme.vars || theme).shadows[2],
+        backgroundColor: (theme.vars || theme).palette.grey[300]
+      }
+    }, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {
+      backgroundColor: (theme.vars || theme).palette[ownerState.color].dark,
+      // Reset on touch devices, it doesn't add specificity
+      '@media (hover: none)': {
+        backgroundColor: (theme.vars || theme).palette[ownerState.color].main
+      }
+    }),
+    '&:active': _extends({}, ownerState.variant === 'contained' && {
+      boxShadow: (theme.vars || theme).shadows[8]
+    }),
+    [`&.${buttonClasses.focusVisible}`]: _extends({}, ownerState.variant === 'contained' && {
+      boxShadow: (theme.vars || theme).shadows[6]
+    }),
+    [`&.${buttonClasses.disabled}`]: _extends({
+      color: (theme.vars || theme).palette.action.disabled
+    }, ownerState.variant === 'outlined' && {
+      border: `1px solid ${(theme.vars || theme).palette.action.disabledBackground}`
+    }, ownerState.variant === 'contained' && {
+      color: (theme.vars || theme).palette.action.disabled,
+      boxShadow: (theme.vars || theme).shadows[0],
+      backgroundColor: (theme.vars || theme).palette.action.disabledBackground
+    })
+  }, ownerState.variant === 'text' && {
+    padding: '6px 8px'
+  }, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {
+    color: (theme.vars || theme).palette[ownerState.color].main
+  }, ownerState.variant === 'outlined' && {
+    padding: '5px 15px',
+    border: '1px solid currentColor'
+  }, ownerState.variant === 'outlined' && ownerState.color !== 'inherit' && {
+    color: (theme.vars || theme).palette[ownerState.color].main,
+    border: theme.vars ? `1px solid rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.5)` : `1px solid ${alpha(theme.palette[ownerState.color].main, 0.5)}`
+  }, ownerState.variant === 'contained' && {
+    color: theme.vars ?
+    // this is safe because grey does not change between default light/dark mode
+    theme.vars.palette.text.primary : (_theme$palette$getCon = (_theme$palette = theme.palette).getContrastText) == null ? void 0 : _theme$palette$getCon.call(_theme$palette, theme.palette.grey[300]),
+    backgroundColor: theme.vars ? theme.vars.palette.Button.inheritContainedBg : inheritContainedBackgroundColor,
+    boxShadow: (theme.vars || theme).shadows[2]
+  }, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {
+    color: (theme.vars || theme).palette[ownerState.color].contrastText,
+    backgroundColor: (theme.vars || theme).palette[ownerState.color].main
+  }, ownerState.color === 'inherit' && {
+    color: 'inherit',
+    borderColor: 'currentColor'
+  }, ownerState.size === 'small' && ownerState.variant === 'text' && {
+    padding: '4px 5px',
+    fontSize: theme.typography.pxToRem(13)
+  }, ownerState.size === 'large' && ownerState.variant === 'text' && {
+    padding: '8px 11px',
+    fontSize: theme.typography.pxToRem(15)
+  }, ownerState.size === 'small' && ownerState.variant === 'outlined' && {
+    padding: '3px 9px',
+    fontSize: theme.typography.pxToRem(13)
+  }, ownerState.size === 'large' && ownerState.variant === 'outlined' && {
+    padding: '7px 21px',
+    fontSize: theme.typography.pxToRem(15)
+  }, ownerState.size === 'small' && ownerState.variant === 'contained' && {
+    padding: '4px 10px',
+    fontSize: theme.typography.pxToRem(13)
+  }, ownerState.size === 'large' && ownerState.variant === 'contained' && {
+    padding: '8px 22px',
+    fontSize: theme.typography.pxToRem(15)
+  }, ownerState.fullWidth && {
+    width: '100%'
+  });
+}, ({
+  ownerState
+}) => ownerState.disableElevation && {
+  boxShadow: 'none',
+  '&:hover': {
+    boxShadow: 'none'
+  },
+  [`&.${buttonClasses.focusVisible}`]: {
+    boxShadow: 'none'
+  },
+  '&:active': {
+    boxShadow: 'none'
+  },
+  [`&.${buttonClasses.disabled}`]: {
+    boxShadow: 'none'
+  }
+});
+const ButtonStartIcon = styled('span', {
+  name: 'MuiButton',
+  slot: 'StartIcon',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.startIcon, styles[`iconSize${capitalize(ownerState.size)}`]];
+  }
+})(({
+  ownerState
+}) => _extends({
+  display: 'inherit',
+  marginRight: 8,
+  marginLeft: -4
+}, ownerState.size === 'small' && {
+  marginLeft: -2
+}, commonIconStyles(ownerState)));
+const ButtonEndIcon = styled('span', {
+  name: 'MuiButton',
+  slot: 'EndIcon',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.endIcon, styles[`iconSize${capitalize(ownerState.size)}`]];
+  }
+})(({
+  ownerState
+}) => _extends({
+  display: 'inherit',
+  marginRight: -4,
+  marginLeft: 8
+}, ownerState.size === 'small' && {
+  marginRight: -2
+}, commonIconStyles(ownerState)));
+const Button = /*#__PURE__*/React.forwardRef(function Button(inProps, ref) {
+  // props priority: `inProps` > `contextProps` > `themeDefaultProps`
+  const contextProps = React.useContext(ButtonGroupContext);
+  const buttonGroupButtonContextPositionClassName = React.useContext(ButtonGroupButtonContext);
+  const resolvedProps = resolveProps(contextProps, inProps);
+  const props = useThemeProps({
+    props: resolvedProps,
+    name: 'MuiButton'
+  });
+  const {
+      children,
+      color = 'primary',
+      component = 'button',
+      className,
+      disabled = false,
+      disableElevation = false,
+      disableFocusRipple = false,
+      endIcon: endIconProp,
+      focusVisibleClassName,
+      fullWidth = false,
+      size = 'medium',
+      startIcon: startIconProp,
+      type,
+      variant = 'text'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    color,
+    component,
+    disabled,
+    disableElevation,
+    disableFocusRipple,
+    fullWidth,
+    size,
+    type,
+    variant
+  });
+  const classes = useUtilityClasses(ownerState);
+  const startIcon = startIconProp && /*#__PURE__*/_jsx(ButtonStartIcon, {
+    className: classes.startIcon,
+    ownerState: ownerState,
+    children: startIconProp
+  });
+  const endIcon = endIconProp && /*#__PURE__*/_jsx(ButtonEndIcon, {
+    className: classes.endIcon,
+    ownerState: ownerState,
+    children: endIconProp
+  });
+  const positionClassName = buttonGroupButtonContextPositionClassName || '';
+  return /*#__PURE__*/_jsxs(ButtonRoot, _extends({
+    ownerState: ownerState,
+    className: clsx(contextProps.className, classes.root, className, positionClassName),
+    component: component,
+    disabled: disabled,
+    focusRipple: !disableFocusRipple,
+    focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName),
+    ref: ref,
+    type: type
+  }, other, {
+    classes: classes,
+    children: [startIcon, children, endIcon]
+  }));
+});
+process.env.NODE_ENV !== "production" ? Button.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'primary'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'primary', 'secondary', 'success', 'error', 'info', 'warning']), PropTypes.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, no elevation is used.
+   * @default false
+   */
+  disableElevation: PropTypes.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: PropTypes.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   *
+   * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
+   * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
+   * @default false
+   */
+  disableRipple: PropTypes.bool,
+  /**
+   * Element placed after the children.
+   */
+  endIcon: PropTypes.node,
+  /**
+   * @ignore
+   */
+  focusVisibleClassName: PropTypes.string,
+  /**
+   * If `true`, the button will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: PropTypes.bool,
+  /**
+   * The URL to link to when the button is clicked.
+   * If defined, an `a` element will be used as the root node.
+   */
+  href: PropTypes.string,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense button styling.
+   * @default 'medium'
+   */
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['small', 'medium', 'large']), PropTypes.string]),
+  /**
+   * Element placed before the children.
+   */
+  startIcon: PropTypes.node,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * @ignore
+   */
+  type: PropTypes.oneOfType([PropTypes.oneOf(['button', 'reset', 'submit']), PropTypes.string]),
+  /**
+   * The variant to use.
+   * @default 'text'
+   */
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['contained', 'outlined', 'text']), PropTypes.string])
+} : void 0;
+export default Button;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Button/buttonClasses.js b/ddb_main/node_modules/@mui/material/Button/buttonClasses.js
new file mode 100644
index 0000000..f43eb22
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Button/buttonClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getButtonUtilityClass(slot) {
+  return generateUtilityClass('MuiButton', slot);
+}
+const buttonClasses = generateUtilityClasses('MuiButton', ['root', 'text', 'textInherit', 'textPrimary', 'textSecondary', 'textSuccess', 'textError', 'textInfo', 'textWarning', 'outlined', 'outlinedInherit', 'outlinedPrimary', 'outlinedSecondary', 'outlinedSuccess', 'outlinedError', 'outlinedInfo', 'outlinedWarning', 'contained', 'containedInherit', 'containedPrimary', 'containedSecondary', 'containedSuccess', 'containedError', 'containedInfo', 'containedWarning', 'disableElevation', 'focusVisible', 'disabled', 'colorInherit', 'colorPrimary', 'colorSecondary', 'colorSuccess', 'colorError', 'colorInfo', 'colorWarning', 'textSizeSmall', 'textSizeMedium', 'textSizeLarge', 'outlinedSizeSmall', 'outlinedSizeMedium', 'outlinedSizeLarge', 'containedSizeSmall', 'containedSizeMedium', 'containedSizeLarge', 'sizeMedium', 'sizeSmall', 'sizeLarge', 'fullWidth', 'startIcon', 'endIcon', 'icon', 'iconSizeSmall', 'iconSizeMedium', 'iconSizeLarge']);
+export default buttonClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ButtonBase/ButtonBase.js b/ddb_main/node_modules/@mui/material/ButtonBase/ButtonBase.js
new file mode 100644
index 0000000..076a570
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ButtonBase/ButtonBase.js
@@ -0,0 +1,477 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["action", "centerRipple", "children", "className", "component", "disabled", "disableRipple", "disableTouchRipple", "focusRipple", "focusVisibleClassName", "LinkComponent", "onBlur", "onClick", "onContextMenu", "onDragLeave", "onFocus", "onFocusVisible", "onKeyDown", "onKeyUp", "onMouseDown", "onMouseLeave", "onMouseUp", "onTouchEnd", "onTouchMove", "onTouchStart", "tabIndex", "TouchRippleProps", "touchRippleRef", "type"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import refType from '@mui/utils/refType';
+import elementTypeAcceptingRef from '@mui/utils/elementTypeAcceptingRef';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import useForkRef from '../utils/useForkRef';
+import useEventCallback from '../utils/useEventCallback';
+import useIsFocusVisible from '../utils/useIsFocusVisible';
+import TouchRipple from './TouchRipple';
+import buttonBaseClasses, { getButtonBaseUtilityClass } from './buttonBaseClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    disabled,
+    focusVisible,
+    focusVisibleClassName,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', disabled && 'disabled', focusVisible && 'focusVisible']
+  };
+  const composedClasses = composeClasses(slots, getButtonBaseUtilityClass, classes);
+  if (focusVisible && focusVisibleClassName) {
+    composedClasses.root += ` ${focusVisibleClassName}`;
+  }
+  return composedClasses;
+};
+export const ButtonBaseRoot = styled('button', {
+  name: 'MuiButtonBase',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})({
+  display: 'inline-flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  position: 'relative',
+  boxSizing: 'border-box',
+  WebkitTapHighlightColor: 'transparent',
+  backgroundColor: 'transparent',
+  // Reset default value
+  // We disable the focus ring for mouse, touch and keyboard users.
+  outline: 0,
+  border: 0,
+  margin: 0,
+  // Remove the margin in Safari
+  borderRadius: 0,
+  padding: 0,
+  // Remove the padding in Firefox
+  cursor: 'pointer',
+  userSelect: 'none',
+  verticalAlign: 'middle',
+  MozAppearance: 'none',
+  // Reset
+  WebkitAppearance: 'none',
+  // Reset
+  textDecoration: 'none',
+  // So we take precedent over the style of a native <a /> element.
+  color: 'inherit',
+  '&::-moz-focus-inner': {
+    borderStyle: 'none' // Remove Firefox dotted outline.
+  },
+  [`&.${buttonBaseClasses.disabled}`]: {
+    pointerEvents: 'none',
+    // Disable link interactions
+    cursor: 'default'
+  },
+  '@media print': {
+    colorAdjust: 'exact'
+  }
+});
+
+/**
+ * `ButtonBase` contains as few styles as possible.
+ * It aims to be a simple building block for creating a button.
+ * It contains a load of style reset and some focus/ripple logic.
+ */
+const ButtonBase = /*#__PURE__*/React.forwardRef(function ButtonBase(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiButtonBase'
+  });
+  const {
+      action,
+      centerRipple = false,
+      children,
+      className,
+      component = 'button',
+      disabled = false,
+      disableRipple = false,
+      disableTouchRipple = false,
+      focusRipple = false,
+      LinkComponent = 'a',
+      onBlur,
+      onClick,
+      onContextMenu,
+      onDragLeave,
+      onFocus,
+      onFocusVisible,
+      onKeyDown,
+      onKeyUp,
+      onMouseDown,
+      onMouseLeave,
+      onMouseUp,
+      onTouchEnd,
+      onTouchMove,
+      onTouchStart,
+      tabIndex = 0,
+      TouchRippleProps,
+      touchRippleRef,
+      type
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const buttonRef = React.useRef(null);
+  const rippleRef = React.useRef(null);
+  const handleRippleRef = useForkRef(rippleRef, touchRippleRef);
+  const {
+    isFocusVisibleRef,
+    onFocus: handleFocusVisible,
+    onBlur: handleBlurVisible,
+    ref: focusVisibleRef
+  } = useIsFocusVisible();
+  const [focusVisible, setFocusVisible] = React.useState(false);
+  if (disabled && focusVisible) {
+    setFocusVisible(false);
+  }
+  React.useImperativeHandle(action, () => ({
+    focusVisible: () => {
+      setFocusVisible(true);
+      buttonRef.current.focus();
+    }
+  }), []);
+  const [mountedState, setMountedState] = React.useState(false);
+  React.useEffect(() => {
+    setMountedState(true);
+  }, []);
+  const enableTouchRipple = mountedState && !disableRipple && !disabled;
+  React.useEffect(() => {
+    if (focusVisible && focusRipple && !disableRipple && mountedState) {
+      rippleRef.current.pulsate();
+    }
+  }, [disableRipple, focusRipple, focusVisible, mountedState]);
+  function useRippleHandler(rippleAction, eventCallback, skipRippleAction = disableTouchRipple) {
+    return useEventCallback(event => {
+      if (eventCallback) {
+        eventCallback(event);
+      }
+      const ignore = skipRippleAction;
+      if (!ignore && rippleRef.current) {
+        rippleRef.current[rippleAction](event);
+      }
+      return true;
+    });
+  }
+  const handleMouseDown = useRippleHandler('start', onMouseDown);
+  const handleContextMenu = useRippleHandler('stop', onContextMenu);
+  const handleDragLeave = useRippleHandler('stop', onDragLeave);
+  const handleMouseUp = useRippleHandler('stop', onMouseUp);
+  const handleMouseLeave = useRippleHandler('stop', event => {
+    if (focusVisible) {
+      event.preventDefault();
+    }
+    if (onMouseLeave) {
+      onMouseLeave(event);
+    }
+  });
+  const handleTouchStart = useRippleHandler('start', onTouchStart);
+  const handleTouchEnd = useRippleHandler('stop', onTouchEnd);
+  const handleTouchMove = useRippleHandler('stop', onTouchMove);
+  const handleBlur = useRippleHandler('stop', event => {
+    handleBlurVisible(event);
+    if (isFocusVisibleRef.current === false) {
+      setFocusVisible(false);
+    }
+    if (onBlur) {
+      onBlur(event);
+    }
+  }, false);
+  const handleFocus = useEventCallback(event => {
+    // Fix for https://github.com/facebook/react/issues/7769
+    if (!buttonRef.current) {
+      buttonRef.current = event.currentTarget;
+    }
+    handleFocusVisible(event);
+    if (isFocusVisibleRef.current === true) {
+      setFocusVisible(true);
+      if (onFocusVisible) {
+        onFocusVisible(event);
+      }
+    }
+    if (onFocus) {
+      onFocus(event);
+    }
+  });
+  const isNonNativeButton = () => {
+    const button = buttonRef.current;
+    return component && component !== 'button' && !(button.tagName === 'A' && button.href);
+  };
+
+  /**
+   * IE11 shim for https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/repeat
+   */
+  const keydownRef = React.useRef(false);
+  const handleKeyDown = useEventCallback(event => {
+    // Check if key is already down to avoid repeats being counted as multiple activations
+    if (focusRipple && !keydownRef.current && focusVisible && rippleRef.current && event.key === ' ') {
+      keydownRef.current = true;
+      rippleRef.current.stop(event, () => {
+        rippleRef.current.start(event);
+      });
+    }
+    if (event.target === event.currentTarget && isNonNativeButton() && event.key === ' ') {
+      event.preventDefault();
+    }
+    if (onKeyDown) {
+      onKeyDown(event);
+    }
+
+    // Keyboard accessibility for non interactive elements
+    if (event.target === event.currentTarget && isNonNativeButton() && event.key === 'Enter' && !disabled) {
+      event.preventDefault();
+      if (onClick) {
+        onClick(event);
+      }
+    }
+  });
+  const handleKeyUp = useEventCallback(event => {
+    // calling preventDefault in keyUp on a <button> will not dispatch a click event if Space is pressed
+    // https://codesandbox.io/p/sandbox/button-keyup-preventdefault-dn7f0
+    if (focusRipple && event.key === ' ' && rippleRef.current && focusVisible && !event.defaultPrevented) {
+      keydownRef.current = false;
+      rippleRef.current.stop(event, () => {
+        rippleRef.current.pulsate(event);
+      });
+    }
+    if (onKeyUp) {
+      onKeyUp(event);
+    }
+
+    // Keyboard accessibility for non interactive elements
+    if (onClick && event.target === event.currentTarget && isNonNativeButton() && event.key === ' ' && !event.defaultPrevented) {
+      onClick(event);
+    }
+  });
+  let ComponentProp = component;
+  if (ComponentProp === 'button' && (other.href || other.to)) {
+    ComponentProp = LinkComponent;
+  }
+  const buttonProps = {};
+  if (ComponentProp === 'button') {
+    buttonProps.type = type === undefined ? 'button' : type;
+    buttonProps.disabled = disabled;
+  } else {
+    if (!other.href && !other.to) {
+      buttonProps.role = 'button';
+    }
+    if (disabled) {
+      buttonProps['aria-disabled'] = disabled;
+    }
+  }
+  const handleRef = useForkRef(ref, focusVisibleRef, buttonRef);
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useEffect(() => {
+      if (enableTouchRipple && !rippleRef.current) {
+        console.error(['MUI: The `component` prop provided to ButtonBase is invalid.', 'Please make sure the children prop is rendered in this custom component.'].join('\n'));
+      }
+    }, [enableTouchRipple]);
+  }
+  const ownerState = _extends({}, props, {
+    centerRipple,
+    component,
+    disabled,
+    disableRipple,
+    disableTouchRipple,
+    focusRipple,
+    tabIndex,
+    focusVisible
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsxs(ButtonBaseRoot, _extends({
+    as: ComponentProp,
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    onBlur: handleBlur,
+    onClick: onClick,
+    onContextMenu: handleContextMenu,
+    onFocus: handleFocus,
+    onKeyDown: handleKeyDown,
+    onKeyUp: handleKeyUp,
+    onMouseDown: handleMouseDown,
+    onMouseLeave: handleMouseLeave,
+    onMouseUp: handleMouseUp,
+    onDragLeave: handleDragLeave,
+    onTouchEnd: handleTouchEnd,
+    onTouchMove: handleTouchMove,
+    onTouchStart: handleTouchStart,
+    ref: handleRef,
+    tabIndex: disabled ? -1 : tabIndex,
+    type: type
+  }, buttonProps, other, {
+    children: [children, enableTouchRipple ?
+    /*#__PURE__*/
+    /* TouchRipple is only needed client-side, x2 boost on the server. */
+    _jsx(TouchRipple, _extends({
+      ref: handleRippleRef,
+      center: centerRipple
+    }, TouchRippleProps)) : null]
+  }));
+});
+process.env.NODE_ENV !== "production" ? ButtonBase.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * A ref for imperative actions.
+   * It currently only supports `focusVisible()` action.
+   */
+  action: refType,
+  /**
+   * If `true`, the ripples are centered.
+   * They won't start at the cursor interaction position.
+   * @default false
+   */
+  centerRipple: PropTypes.bool,
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: elementTypeAcceptingRef,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   *
+   * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
+   * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
+   * @default false
+   */
+  disableRipple: PropTypes.bool,
+  /**
+   * If `true`, the touch ripple effect is disabled.
+   * @default false
+   */
+  disableTouchRipple: PropTypes.bool,
+  /**
+   * If `true`, the base button will have a keyboard focus ripple.
+   * @default false
+   */
+  focusRipple: PropTypes.bool,
+  /**
+   * This prop can help identify which element has keyboard focus.
+   * The class name will be applied when the element gains the focus through keyboard interaction.
+   * It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).
+   * The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md).
+   * A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components
+   * if needed.
+   */
+  focusVisibleClassName: PropTypes.string,
+  /**
+   * @ignore
+   */
+  href: PropTypes /* @typescript-to-proptypes-ignore */.any,
+  /**
+   * The component used to render a link when the `href` prop is provided.
+   * @default 'a'
+   */
+  LinkComponent: PropTypes.elementType,
+  /**
+   * @ignore
+   */
+  onBlur: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onClick: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onContextMenu: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onDragLeave: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onFocus: PropTypes.func,
+  /**
+   * Callback fired when the component is focused with a keyboard.
+   * We trigger a `onFocus` callback too.
+   */
+  onFocusVisible: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onKeyDown: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onKeyUp: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onMouseDown: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onMouseLeave: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onMouseUp: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onTouchEnd: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onTouchMove: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onTouchStart: PropTypes.func,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * @default 0
+   */
+  tabIndex: PropTypes.number,
+  /**
+   * Props applied to the `TouchRipple` element.
+   */
+  TouchRippleProps: PropTypes.object,
+  /**
+   * A ref that points to the `TouchRipple` element.
+   */
+  touchRippleRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
+    current: PropTypes.shape({
+      pulsate: PropTypes.func.isRequired,
+      start: PropTypes.func.isRequired,
+      stop: PropTypes.func.isRequired
+    })
+  })]),
+  /**
+   * @ignore
+   */
+  type: PropTypes.oneOfType([PropTypes.oneOf(['button', 'reset', 'submit']), PropTypes.string])
+} : void 0;
+export default ButtonBase;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ButtonBase/Ripple.js b/ddb_main/node_modules/@mui/material/ButtonBase/Ripple.js
new file mode 100644
index 0000000..8b80d39
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ButtonBase/Ripple.js
@@ -0,0 +1,88 @@
+'use client';
+
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+function Ripple(props) {
+  const {
+    className,
+    classes,
+    pulsate = false,
+    rippleX,
+    rippleY,
+    rippleSize,
+    in: inProp,
+    onExited,
+    timeout
+  } = props;
+  const [leaving, setLeaving] = React.useState(false);
+  const rippleClassName = clsx(className, classes.ripple, classes.rippleVisible, pulsate && classes.ripplePulsate);
+  const rippleStyles = {
+    width: rippleSize,
+    height: rippleSize,
+    top: -(rippleSize / 2) + rippleY,
+    left: -(rippleSize / 2) + rippleX
+  };
+  const childClassName = clsx(classes.child, leaving && classes.childLeaving, pulsate && classes.childPulsate);
+  if (!inProp && !leaving) {
+    setLeaving(true);
+  }
+  React.useEffect(() => {
+    if (!inProp && onExited != null) {
+      // react-transition-group#onExited
+      const timeoutId = setTimeout(onExited, timeout);
+      return () => {
+        clearTimeout(timeoutId);
+      };
+    }
+    return undefined;
+  }, [onExited, inProp, timeout]);
+  return /*#__PURE__*/_jsx("span", {
+    className: rippleClassName,
+    style: rippleStyles,
+    children: /*#__PURE__*/_jsx("span", {
+      className: childClassName
+    })
+  });
+}
+process.env.NODE_ENV !== "production" ? Ripple.propTypes = {
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object.isRequired,
+  className: PropTypes.string,
+  /**
+   * @ignore - injected from TransitionGroup
+   */
+  in: PropTypes.bool,
+  /**
+   * @ignore - injected from TransitionGroup
+   */
+  onExited: PropTypes.func,
+  /**
+   * If `true`, the ripple pulsates, typically indicating the keyboard focus state of an element.
+   */
+  pulsate: PropTypes.bool,
+  /**
+   * Diameter of the ripple.
+   */
+  rippleSize: PropTypes.number,
+  /**
+   * Horizontal position of the ripple center.
+   */
+  rippleX: PropTypes.number,
+  /**
+   * Vertical position of the ripple center.
+   */
+  rippleY: PropTypes.number,
+  /**
+   * exit delay
+   */
+  timeout: PropTypes.number.isRequired
+} : void 0;
+export default Ripple;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ButtonBase/TouchRipple.js b/ddb_main/node_modules/@mui/material/ButtonBase/TouchRipple.js
new file mode 100644
index 0000000..e69559c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ButtonBase/TouchRipple.js
@@ -0,0 +1,333 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["center", "classes", "className"];
+let _ = t => t,
+  _t,
+  _t2,
+  _t3,
+  _t4;
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { TransitionGroup } from 'react-transition-group';
+import clsx from 'clsx';
+import { keyframes } from '@mui/system';
+import useTimeout from '@mui/utils/useTimeout';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import Ripple from './Ripple';
+import touchRippleClasses from './touchRippleClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const DURATION = 550;
+export const DELAY_RIPPLE = 80;
+const enterKeyframe = keyframes(_t || (_t = _`
+  0% {
+    transform: scale(0);
+    opacity: 0.1;
+  }
+
+  100% {
+    transform: scale(1);
+    opacity: 0.3;
+  }
+`));
+const exitKeyframe = keyframes(_t2 || (_t2 = _`
+  0% {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+  }
+`));
+const pulsateKeyframe = keyframes(_t3 || (_t3 = _`
+  0% {
+    transform: scale(1);
+  }
+
+  50% {
+    transform: scale(0.92);
+  }
+
+  100% {
+    transform: scale(1);
+  }
+`));
+export const TouchRippleRoot = styled('span', {
+  name: 'MuiTouchRipple',
+  slot: 'Root'
+})({
+  overflow: 'hidden',
+  pointerEvents: 'none',
+  position: 'absolute',
+  zIndex: 0,
+  top: 0,
+  right: 0,
+  bottom: 0,
+  left: 0,
+  borderRadius: 'inherit'
+});
+
+// This `styled()` function invokes keyframes. `styled-components` only supports keyframes
+// in string templates. Do not convert these styles in JS object as it will break.
+export const TouchRippleRipple = styled(Ripple, {
+  name: 'MuiTouchRipple',
+  slot: 'Ripple'
+})(_t4 || (_t4 = _`
+  opacity: 0;
+  position: absolute;
+
+  &.${0} {
+    opacity: 0.3;
+    transform: scale(1);
+    animation-name: ${0};
+    animation-duration: ${0}ms;
+    animation-timing-function: ${0};
+  }
+
+  &.${0} {
+    animation-duration: ${0}ms;
+  }
+
+  & .${0} {
+    opacity: 1;
+    display: block;
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+    background-color: currentColor;
+  }
+
+  & .${0} {
+    opacity: 0;
+    animation-name: ${0};
+    animation-duration: ${0}ms;
+    animation-timing-function: ${0};
+  }
+
+  & .${0} {
+    position: absolute;
+    /* @noflip */
+    left: 0px;
+    top: 0;
+    animation-name: ${0};
+    animation-duration: 2500ms;
+    animation-timing-function: ${0};
+    animation-iteration-count: infinite;
+    animation-delay: 200ms;
+  }
+`), touchRippleClasses.rippleVisible, enterKeyframe, DURATION, ({
+  theme
+}) => theme.transitions.easing.easeInOut, touchRippleClasses.ripplePulsate, ({
+  theme
+}) => theme.transitions.duration.shorter, touchRippleClasses.child, touchRippleClasses.childLeaving, exitKeyframe, DURATION, ({
+  theme
+}) => theme.transitions.easing.easeInOut, touchRippleClasses.childPulsate, pulsateKeyframe, ({
+  theme
+}) => theme.transitions.easing.easeInOut);
+
+/**
+ * @ignore - internal component.
+ *
+ * TODO v5: Make private
+ */
+const TouchRipple = /*#__PURE__*/React.forwardRef(function TouchRipple(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiTouchRipple'
+  });
+  const {
+      center: centerProp = false,
+      classes = {},
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const [ripples, setRipples] = React.useState([]);
+  const nextKey = React.useRef(0);
+  const rippleCallback = React.useRef(null);
+  React.useEffect(() => {
+    if (rippleCallback.current) {
+      rippleCallback.current();
+      rippleCallback.current = null;
+    }
+  }, [ripples]);
+
+  // Used to filter out mouse emulated events on mobile.
+  const ignoringMouseDown = React.useRef(false);
+  // We use a timer in order to only show the ripples for touch "click" like events.
+  // We don't want to display the ripple for touch scroll events.
+  const startTimer = useTimeout();
+
+  // This is the hook called once the previous timeout is ready.
+  const startTimerCommit = React.useRef(null);
+  const container = React.useRef(null);
+  const startCommit = React.useCallback(params => {
+    const {
+      pulsate,
+      rippleX,
+      rippleY,
+      rippleSize,
+      cb
+    } = params;
+    setRipples(oldRipples => [...oldRipples, /*#__PURE__*/_jsx(TouchRippleRipple, {
+      classes: {
+        ripple: clsx(classes.ripple, touchRippleClasses.ripple),
+        rippleVisible: clsx(classes.rippleVisible, touchRippleClasses.rippleVisible),
+        ripplePulsate: clsx(classes.ripplePulsate, touchRippleClasses.ripplePulsate),
+        child: clsx(classes.child, touchRippleClasses.child),
+        childLeaving: clsx(classes.childLeaving, touchRippleClasses.childLeaving),
+        childPulsate: clsx(classes.childPulsate, touchRippleClasses.childPulsate)
+      },
+      timeout: DURATION,
+      pulsate: pulsate,
+      rippleX: rippleX,
+      rippleY: rippleY,
+      rippleSize: rippleSize
+    }, nextKey.current)]);
+    nextKey.current += 1;
+    rippleCallback.current = cb;
+  }, [classes]);
+  const start = React.useCallback((event = {}, options = {}, cb = () => {}) => {
+    const {
+      pulsate = false,
+      center = centerProp || options.pulsate,
+      fakeElement = false // For test purposes
+    } = options;
+    if ((event == null ? void 0 : event.type) === 'mousedown' && ignoringMouseDown.current) {
+      ignoringMouseDown.current = false;
+      return;
+    }
+    if ((event == null ? void 0 : event.type) === 'touchstart') {
+      ignoringMouseDown.current = true;
+    }
+    const element = fakeElement ? null : container.current;
+    const rect = element ? element.getBoundingClientRect() : {
+      width: 0,
+      height: 0,
+      left: 0,
+      top: 0
+    };
+
+    // Get the size of the ripple
+    let rippleX;
+    let rippleY;
+    let rippleSize;
+    if (center || event === undefined || event.clientX === 0 && event.clientY === 0 || !event.clientX && !event.touches) {
+      rippleX = Math.round(rect.width / 2);
+      rippleY = Math.round(rect.height / 2);
+    } else {
+      const {
+        clientX,
+        clientY
+      } = event.touches && event.touches.length > 0 ? event.touches[0] : event;
+      rippleX = Math.round(clientX - rect.left);
+      rippleY = Math.round(clientY - rect.top);
+    }
+    if (center) {
+      rippleSize = Math.sqrt((2 * rect.width ** 2 + rect.height ** 2) / 3);
+
+      // For some reason the animation is broken on Mobile Chrome if the size is even.
+      if (rippleSize % 2 === 0) {
+        rippleSize += 1;
+      }
+    } else {
+      const sizeX = Math.max(Math.abs((element ? element.clientWidth : 0) - rippleX), rippleX) * 2 + 2;
+      const sizeY = Math.max(Math.abs((element ? element.clientHeight : 0) - rippleY), rippleY) * 2 + 2;
+      rippleSize = Math.sqrt(sizeX ** 2 + sizeY ** 2);
+    }
+
+    // Touche devices
+    if (event != null && event.touches) {
+      // check that this isn't another touchstart due to multitouch
+      // otherwise we will only clear a single timer when unmounting while two
+      // are running
+      if (startTimerCommit.current === null) {
+        // Prepare the ripple effect.
+        startTimerCommit.current = () => {
+          startCommit({
+            pulsate,
+            rippleX,
+            rippleY,
+            rippleSize,
+            cb
+          });
+        };
+        // Delay the execution of the ripple effect.
+        // We have to make a tradeoff with this delay value.
+        startTimer.start(DELAY_RIPPLE, () => {
+          if (startTimerCommit.current) {
+            startTimerCommit.current();
+            startTimerCommit.current = null;
+          }
+        });
+      }
+    } else {
+      startCommit({
+        pulsate,
+        rippleX,
+        rippleY,
+        rippleSize,
+        cb
+      });
+    }
+  }, [centerProp, startCommit, startTimer]);
+  const pulsate = React.useCallback(() => {
+    start({}, {
+      pulsate: true
+    });
+  }, [start]);
+  const stop = React.useCallback((event, cb) => {
+    startTimer.clear();
+
+    // The touch interaction occurs too quickly.
+    // We still want to show ripple effect.
+    if ((event == null ? void 0 : event.type) === 'touchend' && startTimerCommit.current) {
+      startTimerCommit.current();
+      startTimerCommit.current = null;
+      startTimer.start(0, () => {
+        stop(event, cb);
+      });
+      return;
+    }
+    startTimerCommit.current = null;
+    setRipples(oldRipples => {
+      if (oldRipples.length > 0) {
+        return oldRipples.slice(1);
+      }
+      return oldRipples;
+    });
+    rippleCallback.current = cb;
+  }, [startTimer]);
+  React.useImperativeHandle(ref, () => ({
+    pulsate,
+    start,
+    stop
+  }), [pulsate, start, stop]);
+  return /*#__PURE__*/_jsx(TouchRippleRoot, _extends({
+    className: clsx(touchRippleClasses.root, classes.root, className),
+    ref: container
+  }, other, {
+    children: /*#__PURE__*/_jsx(TransitionGroup, {
+      component: null,
+      exit: true,
+      children: ripples
+    })
+  }));
+});
+process.env.NODE_ENV !== "production" ? TouchRipple.propTypes = {
+  /**
+   * If `true`, the ripple starts at the center of the component
+   * rather than at the point of interaction.
+   */
+  center: PropTypes.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string
+} : void 0;
+export default TouchRipple;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ButtonBase/buttonBaseClasses.js b/ddb_main/node_modules/@mui/material/ButtonBase/buttonBaseClasses.js
new file mode 100644
index 0000000..a05cb60
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ButtonBase/buttonBaseClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getButtonBaseUtilityClass(slot) {
+  return generateUtilityClass('MuiButtonBase', slot);
+}
+const buttonBaseClasses = generateUtilityClasses('MuiButtonBase', ['root', 'disabled', 'focusVisible']);
+export default buttonBaseClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ButtonBase/touchRippleClasses.js b/ddb_main/node_modules/@mui/material/ButtonBase/touchRippleClasses.js
new file mode 100644
index 0000000..9281a1e
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ButtonBase/touchRippleClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getTouchRippleUtilityClass(slot) {
+  return generateUtilityClass('MuiTouchRipple', slot);
+}
+const touchRippleClasses = generateUtilityClasses('MuiTouchRipple', ['root', 'ripple', 'rippleVisible', 'ripplePulsate', 'child', 'childLeaving', 'childPulsate']);
+export default touchRippleClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ButtonGroup/ButtonGroupButtonContext.js b/ddb_main/node_modules/@mui/material/ButtonGroup/ButtonGroupButtonContext.js
new file mode 100644
index 0000000..bbfd3df
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ButtonGroup/ButtonGroupButtonContext.js
@@ -0,0 +1,9 @@
+import * as React from 'react';
+/**
+ * @ignore - internal component.
+ */
+const ButtonGroupButtonContext = /*#__PURE__*/React.createContext(undefined);
+if (process.env.NODE_ENV !== 'production') {
+  ButtonGroupButtonContext.displayName = 'ButtonGroupButtonContext';
+}
+export default ButtonGroupButtonContext;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ButtonGroup/ButtonGroupContext.js b/ddb_main/node_modules/@mui/material/ButtonGroup/ButtonGroupContext.js
new file mode 100644
index 0000000..5f6857a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ButtonGroup/ButtonGroupContext.js
@@ -0,0 +1,9 @@
+import * as React from 'react';
+/**
+ * @ignore - internal component.
+ */
+const ButtonGroupContext = /*#__PURE__*/React.createContext({});
+if (process.env.NODE_ENV !== 'production') {
+  ButtonGroupContext.displayName = 'ButtonGroupContext';
+}
+export default ButtonGroupContext;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Card/Card.js b/ddb_main/node_modules/@mui/material/Card/Card.js
new file mode 100644
index 0000000..8697322
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Card/Card.js
@@ -0,0 +1,87 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className", "raised"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import chainPropTypes from '@mui/utils/chainPropTypes';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import Paper from '../Paper';
+import { getCardUtilityClass } from './cardClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root']
+  };
+  return composeClasses(slots, getCardUtilityClass, classes);
+};
+const CardRoot = styled(Paper, {
+  name: 'MuiCard',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(() => {
+  return {
+    overflow: 'hidden'
+  };
+});
+const Card = /*#__PURE__*/React.forwardRef(function Card(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiCard'
+  });
+  const {
+      className,
+      raised = false
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    raised
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(CardRoot, _extends({
+    className: clsx(classes.root, className),
+    elevation: raised ? 8 : undefined,
+    ref: ref,
+    ownerState: ownerState
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? Card.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * If `true`, the card will use raised styling.
+   * @default false
+   */
+  raised: chainPropTypes(PropTypes.bool, props => {
+    if (props.raised && props.variant === 'outlined') {
+      return new Error('MUI: Combining `raised={true}` with `variant="outlined"` has no effect.');
+    }
+    return null;
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default Card;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Card/cardClasses.js b/ddb_main/node_modules/@mui/material/Card/cardClasses.js
new file mode 100644
index 0000000..ac8c8ac
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Card/cardClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getCardUtilityClass(slot) {
+  return generateUtilityClass('MuiCard', slot);
+}
+const cardClasses = generateUtilityClasses('MuiCard', ['root']);
+export default cardClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/CardActionArea/CardActionArea.js b/ddb_main/node_modules/@mui/material/CardActionArea/CardActionArea.js
new file mode 100644
index 0000000..8984e43
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/CardActionArea/CardActionArea.js
@@ -0,0 +1,120 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["children", "className", "focusVisibleClassName"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import useThemeProps from '../styles/useThemeProps';
+import styled from '../styles/styled';
+import cardActionAreaClasses, { getCardActionAreaUtilityClass } from './cardActionAreaClasses';
+import ButtonBase from '../ButtonBase';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root'],
+    focusHighlight: ['focusHighlight']
+  };
+  return composeClasses(slots, getCardActionAreaUtilityClass, classes);
+};
+const CardActionAreaRoot = styled(ButtonBase, {
+  name: 'MuiCardActionArea',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme
+}) => ({
+  display: 'block',
+  textAlign: 'inherit',
+  borderRadius: 'inherit',
+  // for Safari to work https://github.com/mui/material-ui/issues/36285.
+  width: '100%',
+  [`&:hover .${cardActionAreaClasses.focusHighlight}`]: {
+    opacity: (theme.vars || theme).palette.action.hoverOpacity,
+    '@media (hover: none)': {
+      opacity: 0
+    }
+  },
+  [`&.${cardActionAreaClasses.focusVisible} .${cardActionAreaClasses.focusHighlight}`]: {
+    opacity: (theme.vars || theme).palette.action.focusOpacity
+  }
+}));
+const CardActionAreaFocusHighlight = styled('span', {
+  name: 'MuiCardActionArea',
+  slot: 'FocusHighlight',
+  overridesResolver: (props, styles) => styles.focusHighlight
+})(({
+  theme
+}) => ({
+  overflow: 'hidden',
+  pointerEvents: 'none',
+  position: 'absolute',
+  top: 0,
+  right: 0,
+  bottom: 0,
+  left: 0,
+  borderRadius: 'inherit',
+  opacity: 0,
+  backgroundColor: 'currentcolor',
+  transition: theme.transitions.create('opacity', {
+    duration: theme.transitions.duration.short
+  })
+}));
+const CardActionArea = /*#__PURE__*/React.forwardRef(function CardActionArea(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiCardActionArea'
+  });
+  const {
+      children,
+      className,
+      focusVisibleClassName
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = props;
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsxs(CardActionAreaRoot, _extends({
+    className: clsx(classes.root, className),
+    focusVisibleClassName: clsx(focusVisibleClassName, classes.focusVisible),
+    ref: ref,
+    ownerState: ownerState
+  }, other, {
+    children: [children, /*#__PURE__*/_jsx(CardActionAreaFocusHighlight, {
+      className: classes.focusHighlight,
+      ownerState: ownerState
+    })]
+  }));
+});
+process.env.NODE_ENV !== "production" ? CardActionArea.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * @ignore
+   */
+  focusVisibleClassName: PropTypes.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default CardActionArea;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/CardActionArea/cardActionAreaClasses.js b/ddb_main/node_modules/@mui/material/CardActionArea/cardActionAreaClasses.js
new file mode 100644
index 0000000..3ece38c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/CardActionArea/cardActionAreaClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getCardActionAreaUtilityClass(slot) {
+  return generateUtilityClass('MuiCardActionArea', slot);
+}
+const cardActionAreaClasses = generateUtilityClasses('MuiCardActionArea', ['root', 'focusVisible', 'focusHighlight']);
+export default cardActionAreaClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/CardActions/CardActions.js b/ddb_main/node_modules/@mui/material/CardActions/CardActions.js
new file mode 100644
index 0000000..0240ead
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/CardActions/CardActions.js
@@ -0,0 +1,91 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["disableSpacing", "className"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import { getCardActionsUtilityClass } from './cardActionsClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    disableSpacing
+  } = ownerState;
+  const slots = {
+    root: ['root', !disableSpacing && 'spacing']
+  };
+  return composeClasses(slots, getCardActionsUtilityClass, classes);
+};
+const CardActionsRoot = styled('div', {
+  name: 'MuiCardActions',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, !ownerState.disableSpacing && styles.spacing];
+  }
+})(({
+  ownerState
+}) => _extends({
+  display: 'flex',
+  alignItems: 'center',
+  padding: 8
+}, !ownerState.disableSpacing && {
+  '& > :not(style) ~ :not(style)': {
+    marginLeft: 8
+  }
+}));
+const CardActions = /*#__PURE__*/React.forwardRef(function CardActions(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiCardActions'
+  });
+  const {
+      disableSpacing = false,
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    disableSpacing
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(CardActionsRoot, _extends({
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? CardActions.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * If `true`, the actions do not have additional margin.
+   * @default false
+   */
+  disableSpacing: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default CardActions;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/CardActions/cardActionsClasses.js b/ddb_main/node_modules/@mui/material/CardActions/cardActionsClasses.js
new file mode 100644
index 0000000..1e446e2
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/CardActions/cardActionsClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getCardActionsUtilityClass(slot) {
+  return generateUtilityClass('MuiCardActions', slot);
+}
+const cardActionsClasses = generateUtilityClasses('MuiCardActions', ['root', 'spacing']);
+export default cardActionsClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/CardContent/CardContent.js b/ddb_main/node_modules/@mui/material/CardContent/CardContent.js
new file mode 100644
index 0000000..e475e67
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/CardContent/CardContent.js
@@ -0,0 +1,83 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className", "component"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import { getCardContentUtilityClass } from './cardContentClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root']
+  };
+  return composeClasses(slots, getCardContentUtilityClass, classes);
+};
+const CardContentRoot = styled('div', {
+  name: 'MuiCardContent',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(() => {
+  return {
+    padding: 16,
+    '&:last-child': {
+      paddingBottom: 24
+    }
+  };
+});
+const CardContent = /*#__PURE__*/React.forwardRef(function CardContent(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiCardContent'
+  });
+  const {
+      className,
+      component = 'div'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    component
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(CardContentRoot, _extends({
+    as: component,
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? CardContent.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default CardContent;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/CardContent/cardContentClasses.js b/ddb_main/node_modules/@mui/material/CardContent/cardContentClasses.js
new file mode 100644
index 0000000..7544ffb
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/CardContent/cardContentClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getCardContentUtilityClass(slot) {
+  return generateUtilityClass('MuiCardContent', slot);
+}
+const cardContentClasses = generateUtilityClasses('MuiCardContent', ['root']);
+export default cardContentClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/CardHeader/CardHeader.js b/ddb_main/node_modules/@mui/material/CardHeader/CardHeader.js
new file mode 100644
index 0000000..8ed6047
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/CardHeader/CardHeader.js
@@ -0,0 +1,196 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["action", "avatar", "className", "component", "disableTypography", "subheader", "subheaderTypographyProps", "title", "titleTypographyProps"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import Typography from '../Typography';
+import useThemeProps from '../styles/useThemeProps';
+import styled from '../styles/styled';
+import cardHeaderClasses, { getCardHeaderUtilityClass } from './cardHeaderClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root'],
+    avatar: ['avatar'],
+    action: ['action'],
+    content: ['content'],
+    title: ['title'],
+    subheader: ['subheader']
+  };
+  return composeClasses(slots, getCardHeaderUtilityClass, classes);
+};
+const CardHeaderRoot = styled('div', {
+  name: 'MuiCardHeader',
+  slot: 'Root',
+  overridesResolver: (props, styles) => _extends({
+    [`& .${cardHeaderClasses.title}`]: styles.title,
+    [`& .${cardHeaderClasses.subheader}`]: styles.subheader
+  }, styles.root)
+})({
+  display: 'flex',
+  alignItems: 'center',
+  padding: 16
+});
+const CardHeaderAvatar = styled('div', {
+  name: 'MuiCardHeader',
+  slot: 'Avatar',
+  overridesResolver: (props, styles) => styles.avatar
+})({
+  display: 'flex',
+  flex: '0 0 auto',
+  marginRight: 16
+});
+const CardHeaderAction = styled('div', {
+  name: 'MuiCardHeader',
+  slot: 'Action',
+  overridesResolver: (props, styles) => styles.action
+})({
+  flex: '0 0 auto',
+  alignSelf: 'flex-start',
+  marginTop: -4,
+  marginRight: -8,
+  marginBottom: -4
+});
+const CardHeaderContent = styled('div', {
+  name: 'MuiCardHeader',
+  slot: 'Content',
+  overridesResolver: (props, styles) => styles.content
+})({
+  flex: '1 1 auto'
+});
+const CardHeader = /*#__PURE__*/React.forwardRef(function CardHeader(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiCardHeader'
+  });
+  const {
+      action,
+      avatar,
+      className,
+      component = 'div',
+      disableTypography = false,
+      subheader: subheaderProp,
+      subheaderTypographyProps,
+      title: titleProp,
+      titleTypographyProps
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    component,
+    disableTypography
+  });
+  const classes = useUtilityClasses(ownerState);
+  let title = titleProp;
+  if (title != null && title.type !== Typography && !disableTypography) {
+    title = /*#__PURE__*/_jsx(Typography, _extends({
+      variant: avatar ? 'body2' : 'h5',
+      className: classes.title,
+      component: "span",
+      display: "block"
+    }, titleTypographyProps, {
+      children: title
+    }));
+  }
+  let subheader = subheaderProp;
+  if (subheader != null && subheader.type !== Typography && !disableTypography) {
+    subheader = /*#__PURE__*/_jsx(Typography, _extends({
+      variant: avatar ? 'body2' : 'body1',
+      className: classes.subheader,
+      color: "text.secondary",
+      component: "span",
+      display: "block"
+    }, subheaderTypographyProps, {
+      children: subheader
+    }));
+  }
+  return /*#__PURE__*/_jsxs(CardHeaderRoot, _extends({
+    className: clsx(classes.root, className),
+    as: component,
+    ref: ref,
+    ownerState: ownerState
+  }, other, {
+    children: [avatar && /*#__PURE__*/_jsx(CardHeaderAvatar, {
+      className: classes.avatar,
+      ownerState: ownerState,
+      children: avatar
+    }), /*#__PURE__*/_jsxs(CardHeaderContent, {
+      className: classes.content,
+      ownerState: ownerState,
+      children: [title, subheader]
+    }), action && /*#__PURE__*/_jsx(CardHeaderAction, {
+      className: classes.action,
+      ownerState: ownerState,
+      children: action
+    })]
+  }));
+});
+process.env.NODE_ENV !== "production" ? CardHeader.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The action to display in the card header.
+   */
+  action: PropTypes.node,
+  /**
+   * The Avatar element to display.
+   */
+  avatar: PropTypes.node,
+  /**
+   * @ignore
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * If `true`, `subheader` and `title` won't be wrapped by a Typography component.
+   * This can be useful to render an alternative Typography variant by wrapping
+   * the `title` text, and optional `subheader` text
+   * with the Typography component.
+   * @default false
+   */
+  disableTypography: PropTypes.bool,
+  /**
+   * The content of the component.
+   */
+  subheader: PropTypes.node,
+  /**
+   * These props will be forwarded to the subheader
+   * (as long as disableTypography is not `true`).
+   */
+  subheaderTypographyProps: PropTypes.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The content of the component.
+   */
+  title: PropTypes.node,
+  /**
+   * These props will be forwarded to the title
+   * (as long as disableTypography is not `true`).
+   */
+  titleTypographyProps: PropTypes.object
+} : void 0;
+export default CardHeader;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/CardHeader/cardHeaderClasses.js b/ddb_main/node_modules/@mui/material/CardHeader/cardHeaderClasses.js
new file mode 100644
index 0000000..0fb1e30
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/CardHeader/cardHeaderClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getCardHeaderUtilityClass(slot) {
+  return generateUtilityClass('MuiCardHeader', slot);
+}
+const cardHeaderClasses = generateUtilityClasses('MuiCardHeader', ['root', 'avatar', 'action', 'content', 'title', 'subheader']);
+export default cardHeaderClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Checkbox/Checkbox.js b/ddb_main/node_modules/@mui/material/Checkbox/Checkbox.js
new file mode 100644
index 0000000..86e3b3c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Checkbox/Checkbox.js
@@ -0,0 +1,212 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["checkedIcon", "color", "icon", "indeterminate", "indeterminateIcon", "inputProps", "size", "className"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import refType from '@mui/utils/refType';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha } from '@mui/system/colorManipulator';
+import SwitchBase from '../internal/SwitchBase';
+import CheckBoxOutlineBlankIcon from '../internal/svg-icons/CheckBoxOutlineBlank';
+import CheckBoxIcon from '../internal/svg-icons/CheckBox';
+import IndeterminateCheckBoxIcon from '../internal/svg-icons/IndeterminateCheckBox';
+import capitalize from '../utils/capitalize';
+import useThemeProps from '../styles/useThemeProps';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import checkboxClasses, { getCheckboxUtilityClass } from './checkboxClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    indeterminate,
+    color,
+    size
+  } = ownerState;
+  const slots = {
+    root: ['root', indeterminate && 'indeterminate', `color${capitalize(color)}`, `size${capitalize(size)}`]
+  };
+  const composedClasses = composeClasses(slots, getCheckboxUtilityClass, classes);
+  return _extends({}, classes, composedClasses);
+};
+const CheckboxRoot = styled(SwitchBase, {
+  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
+  name: 'MuiCheckbox',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.indeterminate && styles.indeterminate, styles[`size${capitalize(ownerState.size)}`], ownerState.color !== 'default' && styles[`color${capitalize(ownerState.color)}`]];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  color: (theme.vars || theme).palette.text.secondary
+}, !ownerState.disableRipple && {
+  '&:hover': {
+    backgroundColor: theme.vars ? `rgba(${ownerState.color === 'default' ? theme.vars.palette.action.activeChannel : theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(ownerState.color === 'default' ? theme.palette.action.active : theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      backgroundColor: 'transparent'
+    }
+  }
+}, ownerState.color !== 'default' && {
+  [`&.${checkboxClasses.checked}, &.${checkboxClasses.indeterminate}`]: {
+    color: (theme.vars || theme).palette[ownerState.color].main
+  },
+  [`&.${checkboxClasses.disabled}`]: {
+    color: (theme.vars || theme).palette.action.disabled
+  }
+}));
+const defaultCheckedIcon = /*#__PURE__*/_jsx(CheckBoxIcon, {});
+const defaultIcon = /*#__PURE__*/_jsx(CheckBoxOutlineBlankIcon, {});
+const defaultIndeterminateIcon = /*#__PURE__*/_jsx(IndeterminateCheckBoxIcon, {});
+const Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(inProps, ref) {
+  var _icon$props$fontSize, _indeterminateIcon$pr;
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiCheckbox'
+  });
+  const {
+      checkedIcon = defaultCheckedIcon,
+      color = 'primary',
+      icon: iconProp = defaultIcon,
+      indeterminate = false,
+      indeterminateIcon: indeterminateIconProp = defaultIndeterminateIcon,
+      inputProps,
+      size = 'medium',
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const icon = indeterminate ? indeterminateIconProp : iconProp;
+  const indeterminateIcon = indeterminate ? indeterminateIconProp : checkedIcon;
+  const ownerState = _extends({}, props, {
+    color,
+    indeterminate,
+    size
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(CheckboxRoot, _extends({
+    type: "checkbox",
+    inputProps: _extends({
+      'data-indeterminate': indeterminate
+    }, inputProps),
+    icon: /*#__PURE__*/React.cloneElement(icon, {
+      fontSize: (_icon$props$fontSize = icon.props.fontSize) != null ? _icon$props$fontSize : size
+    }),
+    checkedIcon: /*#__PURE__*/React.cloneElement(indeterminateIcon, {
+      fontSize: (_indeterminateIcon$pr = indeterminateIcon.props.fontSize) != null ? _indeterminateIcon$pr : size
+    }),
+    ownerState: ownerState,
+    ref: ref,
+    className: clsx(classes.root, className)
+  }, other, {
+    classes: classes
+  }));
+});
+process.env.NODE_ENV !== "production" ? Checkbox.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: PropTypes.bool,
+  /**
+   * The icon to display when the component is checked.
+   * @default <CheckBoxIcon />
+   */
+  checkedIcon: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'primary'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * The default checked state. Use when the component is not controlled.
+   */
+  defaultChecked: PropTypes.bool,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   * @default false
+   */
+  disableRipple: PropTypes.bool,
+  /**
+   * The icon to display when the component is unchecked.
+   * @default <CheckBoxOutlineBlankIcon />
+   */
+  icon: PropTypes.node,
+  /**
+   * The id of the `input` element.
+   */
+  id: PropTypes.string,
+  /**
+   * If `true`, the component appears indeterminate.
+   * This does not set the native input element to indeterminate due
+   * to inconsistent behavior across browsers.
+   * However, we set a `data-indeterminate` attribute on the `input`.
+   * @default false
+   */
+  indeterminate: PropTypes.bool,
+  /**
+   * The icon to display when the component is indeterminate.
+   * @default <IndeterminateCheckBoxIcon />
+   */
+  indeterminateIcon: PropTypes.node,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   */
+  inputProps: PropTypes.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: refType,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: PropTypes.func,
+  /**
+   * If `true`, the `input` element is required.
+   * @default false
+   */
+  required: PropTypes.bool,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense checkbox styling.
+   * @default 'medium'
+   */
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The value of the component. The DOM API casts this to a string.
+   * The browser uses "on" as the default value.
+   */
+  value: PropTypes.any
+} : void 0;
+export default Checkbox;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Checkbox/checkboxClasses.js b/ddb_main/node_modules/@mui/material/Checkbox/checkboxClasses.js
new file mode 100644
index 0000000..a2ac184
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Checkbox/checkboxClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getCheckboxUtilityClass(slot) {
+  return generateUtilityClass('MuiCheckbox', slot);
+}
+const checkboxClasses = generateUtilityClasses('MuiCheckbox', ['root', 'checked', 'disabled', 'indeterminate', 'colorPrimary', 'colorSecondary', 'sizeSmall', 'sizeMedium']);
+export default checkboxClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Chip/Chip.js b/ddb_main/node_modules/@mui/material/Chip/Chip.js
new file mode 100644
index 0000000..5f9d12e
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Chip/Chip.js
@@ -0,0 +1,506 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["avatar", "className", "clickable", "color", "component", "deleteIcon", "disabled", "icon", "label", "onClick", "onDelete", "onKeyDown", "onKeyUp", "size", "variant", "tabIndex", "skipFocusWhenDisabled"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha } from '@mui/system/colorManipulator';
+import CancelIcon from '../internal/svg-icons/Cancel';
+import useForkRef from '../utils/useForkRef';
+import unsupportedProp from '../utils/unsupportedProp';
+import capitalize from '../utils/capitalize';
+import ButtonBase from '../ButtonBase';
+import useThemeProps from '../styles/useThemeProps';
+import styled from '../styles/styled';
+import chipClasses, { getChipUtilityClass } from './chipClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    disabled,
+    size,
+    color,
+    iconColor,
+    onDelete,
+    clickable,
+    variant
+  } = ownerState;
+  const slots = {
+    root: ['root', variant, disabled && 'disabled', `size${capitalize(size)}`, `color${capitalize(color)}`, clickable && 'clickable', clickable && `clickableColor${capitalize(color)}`, onDelete && 'deletable', onDelete && `deletableColor${capitalize(color)}`, `${variant}${capitalize(color)}`],
+    label: ['label', `label${capitalize(size)}`],
+    avatar: ['avatar', `avatar${capitalize(size)}`, `avatarColor${capitalize(color)}`],
+    icon: ['icon', `icon${capitalize(size)}`, `iconColor${capitalize(iconColor)}`],
+    deleteIcon: ['deleteIcon', `deleteIcon${capitalize(size)}`, `deleteIconColor${capitalize(color)}`, `deleteIcon${capitalize(variant)}Color${capitalize(color)}`]
+  };
+  return composeClasses(slots, getChipUtilityClass, classes);
+};
+const ChipRoot = styled('div', {
+  name: 'MuiChip',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    const {
+      color,
+      iconColor,
+      clickable,
+      onDelete,
+      size,
+      variant
+    } = ownerState;
+    return [{
+      [`& .${chipClasses.avatar}`]: styles.avatar
+    }, {
+      [`& .${chipClasses.avatar}`]: styles[`avatar${capitalize(size)}`]
+    }, {
+      [`& .${chipClasses.avatar}`]: styles[`avatarColor${capitalize(color)}`]
+    }, {
+      [`& .${chipClasses.icon}`]: styles.icon
+    }, {
+      [`& .${chipClasses.icon}`]: styles[`icon${capitalize(size)}`]
+    }, {
+      [`& .${chipClasses.icon}`]: styles[`iconColor${capitalize(iconColor)}`]
+    }, {
+      [`& .${chipClasses.deleteIcon}`]: styles.deleteIcon
+    }, {
+      [`& .${chipClasses.deleteIcon}`]: styles[`deleteIcon${capitalize(size)}`]
+    }, {
+      [`& .${chipClasses.deleteIcon}`]: styles[`deleteIconColor${capitalize(color)}`]
+    }, {
+      [`& .${chipClasses.deleteIcon}`]: styles[`deleteIcon${capitalize(variant)}Color${capitalize(color)}`]
+    }, styles.root, styles[`size${capitalize(size)}`], styles[`color${capitalize(color)}`], clickable && styles.clickable, clickable && color !== 'default' && styles[`clickableColor${capitalize(color)})`], onDelete && styles.deletable, onDelete && color !== 'default' && styles[`deletableColor${capitalize(color)}`], styles[variant], styles[`${variant}${capitalize(color)}`]];
+  }
+})(({
+  theme,
+  ownerState
+}) => {
+  const textColor = theme.palette.mode === 'light' ? theme.palette.grey[700] : theme.palette.grey[300];
+  return _extends({
+    maxWidth: '100%',
+    fontFamily: theme.typography.fontFamily,
+    fontSize: theme.typography.pxToRem(13),
+    display: 'inline-flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    height: 32,
+    color: (theme.vars || theme).palette.text.primary,
+    backgroundColor: (theme.vars || theme).palette.action.selected,
+    borderRadius: 32 / 2,
+    whiteSpace: 'nowrap',
+    transition: theme.transitions.create(['background-color', 'box-shadow']),
+    // reset cursor explicitly in case ButtonBase is used
+    cursor: 'unset',
+    // We disable the focus ring for mouse, touch and keyboard users.
+    outline: 0,
+    textDecoration: 'none',
+    border: 0,
+    // Remove `button` border
+    padding: 0,
+    // Remove `button` padding
+    verticalAlign: 'middle',
+    boxSizing: 'border-box',
+    [`&.${chipClasses.disabled}`]: {
+      opacity: (theme.vars || theme).palette.action.disabledOpacity,
+      pointerEvents: 'none'
+    },
+    [`& .${chipClasses.avatar}`]: {
+      marginLeft: 5,
+      marginRight: -6,
+      width: 24,
+      height: 24,
+      color: theme.vars ? theme.vars.palette.Chip.defaultAvatarColor : textColor,
+      fontSize: theme.typography.pxToRem(12)
+    },
+    [`& .${chipClasses.avatarColorPrimary}`]: {
+      color: (theme.vars || theme).palette.primary.contrastText,
+      backgroundColor: (theme.vars || theme).palette.primary.dark
+    },
+    [`& .${chipClasses.avatarColorSecondary}`]: {
+      color: (theme.vars || theme).palette.secondary.contrastText,
+      backgroundColor: (theme.vars || theme).palette.secondary.dark
+    },
+    [`& .${chipClasses.avatarSmall}`]: {
+      marginLeft: 4,
+      marginRight: -4,
+      width: 18,
+      height: 18,
+      fontSize: theme.typography.pxToRem(10)
+    },
+    [`& .${chipClasses.icon}`]: _extends({
+      marginLeft: 5,
+      marginRight: -6
+    }, ownerState.size === 'small' && {
+      fontSize: 18,
+      marginLeft: 4,
+      marginRight: -4
+    }, ownerState.iconColor === ownerState.color && _extends({
+      color: theme.vars ? theme.vars.palette.Chip.defaultIconColor : textColor
+    }, ownerState.color !== 'default' && {
+      color: 'inherit'
+    })),
+    [`& .${chipClasses.deleteIcon}`]: _extends({
+      WebkitTapHighlightColor: 'transparent',
+      color: theme.vars ? `rgba(${theme.vars.palette.text.primaryChannel} / 0.26)` : alpha(theme.palette.text.primary, 0.26),
+      fontSize: 22,
+      cursor: 'pointer',
+      margin: '0 5px 0 -6px',
+      '&:hover': {
+        color: theme.vars ? `rgba(${theme.vars.palette.text.primaryChannel} / 0.4)` : alpha(theme.palette.text.primary, 0.4)
+      }
+    }, ownerState.size === 'small' && {
+      fontSize: 16,
+      marginRight: 4,
+      marginLeft: -4
+    }, ownerState.color !== 'default' && {
+      color: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].contrastTextChannel} / 0.7)` : alpha(theme.palette[ownerState.color].contrastText, 0.7),
+      '&:hover, &:active': {
+        color: (theme.vars || theme).palette[ownerState.color].contrastText
+      }
+    })
+  }, ownerState.size === 'small' && {
+    height: 24
+  }, ownerState.color !== 'default' && {
+    backgroundColor: (theme.vars || theme).palette[ownerState.color].main,
+    color: (theme.vars || theme).palette[ownerState.color].contrastText
+  }, ownerState.onDelete && {
+    [`&.${chipClasses.focusVisible}`]: {
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
+    }
+  }, ownerState.onDelete && ownerState.color !== 'default' && {
+    [`&.${chipClasses.focusVisible}`]: {
+      backgroundColor: (theme.vars || theme).palette[ownerState.color].dark
+    }
+  });
+}, ({
+  theme,
+  ownerState
+}) => _extends({}, ownerState.clickable && {
+  userSelect: 'none',
+  WebkitTapHighlightColor: 'transparent',
+  cursor: 'pointer',
+  '&:hover': {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.hoverOpacity}))` : alpha(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity)
+  },
+  [`&.${chipClasses.focusVisible}`]: {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
+  },
+  '&:active': {
+    boxShadow: (theme.vars || theme).shadows[1]
+  }
+}, ownerState.clickable && ownerState.color !== 'default' && {
+  [`&:hover, &.${chipClasses.focusVisible}`]: {
+    backgroundColor: (theme.vars || theme).palette[ownerState.color].dark
+  }
+}), ({
+  theme,
+  ownerState
+}) => _extends({}, ownerState.variant === 'outlined' && {
+  backgroundColor: 'transparent',
+  border: theme.vars ? `1px solid ${theme.vars.palette.Chip.defaultBorder}` : `1px solid ${theme.palette.mode === 'light' ? theme.palette.grey[400] : theme.palette.grey[700]}`,
+  [`&.${chipClasses.clickable}:hover`]: {
+    backgroundColor: (theme.vars || theme).palette.action.hover
+  },
+  [`&.${chipClasses.focusVisible}`]: {
+    backgroundColor: (theme.vars || theme).palette.action.focus
+  },
+  [`& .${chipClasses.avatar}`]: {
+    marginLeft: 4
+  },
+  [`& .${chipClasses.avatarSmall}`]: {
+    marginLeft: 2
+  },
+  [`& .${chipClasses.icon}`]: {
+    marginLeft: 4
+  },
+  [`& .${chipClasses.iconSmall}`]: {
+    marginLeft: 2
+  },
+  [`& .${chipClasses.deleteIcon}`]: {
+    marginRight: 5
+  },
+  [`& .${chipClasses.deleteIconSmall}`]: {
+    marginRight: 3
+  }
+}, ownerState.variant === 'outlined' && ownerState.color !== 'default' && {
+  color: (theme.vars || theme).palette[ownerState.color].main,
+  border: `1px solid ${theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.7)` : alpha(theme.palette[ownerState.color].main, 0.7)}`,
+  [`&.${chipClasses.clickable}:hover`]: {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity)
+  },
+  [`&.${chipClasses.focusVisible}`]: {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.focusOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.focusOpacity)
+  },
+  [`& .${chipClasses.deleteIcon}`]: {
+    color: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.7)` : alpha(theme.palette[ownerState.color].main, 0.7),
+    '&:hover, &:active': {
+      color: (theme.vars || theme).palette[ownerState.color].main
+    }
+  }
+}));
+const ChipLabel = styled('span', {
+  name: 'MuiChip',
+  slot: 'Label',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    const {
+      size
+    } = ownerState;
+    return [styles.label, styles[`label${capitalize(size)}`]];
+  }
+})(({
+  ownerState
+}) => _extends({
+  overflow: 'hidden',
+  textOverflow: 'ellipsis',
+  paddingLeft: 12,
+  paddingRight: 12,
+  whiteSpace: 'nowrap'
+}, ownerState.variant === 'outlined' && {
+  paddingLeft: 11,
+  paddingRight: 11
+}, ownerState.size === 'small' && {
+  paddingLeft: 8,
+  paddingRight: 8
+}, ownerState.size === 'small' && ownerState.variant === 'outlined' && {
+  paddingLeft: 7,
+  paddingRight: 7
+}));
+function isDeleteKeyboardEvent(keyboardEvent) {
+  return keyboardEvent.key === 'Backspace' || keyboardEvent.key === 'Delete';
+}
+
+/**
+ * Chips represent complex entities in small blocks, such as a contact.
+ */
+const Chip = /*#__PURE__*/React.forwardRef(function Chip(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiChip'
+  });
+  const {
+      avatar: avatarProp,
+      className,
+      clickable: clickableProp,
+      color = 'default',
+      component: ComponentProp,
+      deleteIcon: deleteIconProp,
+      disabled = false,
+      icon: iconProp,
+      label,
+      onClick,
+      onDelete,
+      onKeyDown,
+      onKeyUp,
+      size = 'medium',
+      variant = 'filled',
+      tabIndex,
+      skipFocusWhenDisabled = false // TODO v6: Rename to `focusableWhenDisabled`.
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const chipRef = React.useRef(null);
+  const handleRef = useForkRef(chipRef, ref);
+  const handleDeleteIconClick = event => {
+    // Stop the event from bubbling up to the `Chip`
+    event.stopPropagation();
+    if (onDelete) {
+      onDelete(event);
+    }
+  };
+  const handleKeyDown = event => {
+    // Ignore events from children of `Chip`.
+    if (event.currentTarget === event.target && isDeleteKeyboardEvent(event)) {
+      // Will be handled in keyUp, otherwise some browsers
+      // might init navigation
+      event.preventDefault();
+    }
+    if (onKeyDown) {
+      onKeyDown(event);
+    }
+  };
+  const handleKeyUp = event => {
+    // Ignore events from children of `Chip`.
+    if (event.currentTarget === event.target) {
+      if (onDelete && isDeleteKeyboardEvent(event)) {
+        onDelete(event);
+      } else if (event.key === 'Escape' && chipRef.current) {
+        chipRef.current.blur();
+      }
+    }
+    if (onKeyUp) {
+      onKeyUp(event);
+    }
+  };
+  const clickable = clickableProp !== false && onClick ? true : clickableProp;
+  const component = clickable || onDelete ? ButtonBase : ComponentProp || 'div';
+  const ownerState = _extends({}, props, {
+    component,
+    disabled,
+    size,
+    color,
+    iconColor: /*#__PURE__*/React.isValidElement(iconProp) ? iconProp.props.color || color : color,
+    onDelete: !!onDelete,
+    clickable,
+    variant
+  });
+  const classes = useUtilityClasses(ownerState);
+  const moreProps = component === ButtonBase ? _extends({
+    component: ComponentProp || 'div',
+    focusVisibleClassName: classes.focusVisible
+  }, onDelete && {
+    disableRipple: true
+  }) : {};
+  let deleteIcon = null;
+  if (onDelete) {
+    deleteIcon = deleteIconProp && /*#__PURE__*/React.isValidElement(deleteIconProp) ? ( /*#__PURE__*/React.cloneElement(deleteIconProp, {
+      className: clsx(deleteIconProp.props.className, classes.deleteIcon),
+      onClick: handleDeleteIconClick
+    })) : /*#__PURE__*/_jsx(CancelIcon, {
+      className: clsx(classes.deleteIcon),
+      onClick: handleDeleteIconClick
+    });
+  }
+  let avatar = null;
+  if (avatarProp && /*#__PURE__*/React.isValidElement(avatarProp)) {
+    avatar = /*#__PURE__*/React.cloneElement(avatarProp, {
+      className: clsx(classes.avatar, avatarProp.props.className)
+    });
+  }
+  let icon = null;
+  if (iconProp && /*#__PURE__*/React.isValidElement(iconProp)) {
+    icon = /*#__PURE__*/React.cloneElement(iconProp, {
+      className: clsx(classes.icon, iconProp.props.className)
+    });
+  }
+  if (process.env.NODE_ENV !== 'production') {
+    if (avatar && icon) {
+      console.error('MUI: The Chip component can not handle the avatar ' + 'and the icon prop at the same time. Pick one.');
+    }
+  }
+  return /*#__PURE__*/_jsxs(ChipRoot, _extends({
+    as: component,
+    className: clsx(classes.root, className),
+    disabled: clickable && disabled ? true : undefined,
+    onClick: onClick,
+    onKeyDown: handleKeyDown,
+    onKeyUp: handleKeyUp,
+    ref: handleRef,
+    tabIndex: skipFocusWhenDisabled && disabled ? -1 : tabIndex,
+    ownerState: ownerState
+  }, moreProps, other, {
+    children: [avatar || icon, /*#__PURE__*/_jsx(ChipLabel, {
+      className: clsx(classes.label),
+      ownerState: ownerState,
+      children: label
+    }), deleteIcon]
+  }));
+});
+process.env.NODE_ENV !== "production" ? Chip.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The Avatar element to display.
+   */
+  avatar: PropTypes.element,
+  /**
+   * This prop isn't supported.
+   * Use the `component` prop if you need to change the children structure.
+   */
+  children: unsupportedProp,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * If `true`, the chip will appear clickable, and will raise when pressed,
+   * even if the onClick prop is not defined.
+   * If `false`, the chip will not appear clickable, even if onClick prop is defined.
+   * This can be used, for example,
+   * along with the component prop to indicate an anchor Chip is clickable.
+   * Note: this controls the UI and does not affect the onClick event.
+   */
+  clickable: PropTypes.bool,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'default'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * Override the default delete icon element. Shown only if `onDelete` is set.
+   */
+  deleteIcon: PropTypes.element,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: PropTypes.bool,
+  /**
+   * Icon element.
+   */
+  icon: PropTypes.element,
+  /**
+   * The content of the component.
+   */
+  label: PropTypes.node,
+  /**
+   * @ignore
+   */
+  onClick: PropTypes.func,
+  /**
+   * Callback fired when the delete icon is clicked.
+   * If set, the delete icon will be shown.
+   */
+  onDelete: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onKeyDown: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onKeyUp: PropTypes.func,
+  /**
+   * The size of the component.
+   * @default 'medium'
+   */
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),
+  /**
+   * If `true`, allows the disabled chip to escape focus.
+   * If `false`, allows the disabled chip to receive focus.
+   * @default false
+   */
+  skipFocusWhenDisabled: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * @ignore
+   */
+  tabIndex: PropTypes.number,
+  /**
+   * The variant to use.
+   * @default 'filled'
+   */
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['filled', 'outlined']), PropTypes.string])
+} : void 0;
+export default Chip;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Chip/chipClasses.js b/ddb_main/node_modules/@mui/material/Chip/chipClasses.js
new file mode 100644
index 0000000..b222f5d
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Chip/chipClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getChipUtilityClass(slot) {
+  return generateUtilityClass('MuiChip', slot);
+}
+const chipClasses = generateUtilityClasses('MuiChip', ['root', 'sizeSmall', 'sizeMedium', 'colorError', 'colorInfo', 'colorPrimary', 'colorSecondary', 'colorSuccess', 'colorWarning', 'disabled', 'clickable', 'clickableColorPrimary', 'clickableColorSecondary', 'deletable', 'deletableColorPrimary', 'deletableColorSecondary', 'outlined', 'filled', 'outlinedPrimary', 'outlinedSecondary', 'filledPrimary', 'filledSecondary', 'avatar', 'avatarSmall', 'avatarMedium', 'avatarColorPrimary', 'avatarColorSecondary', 'icon', 'iconSmall', 'iconMedium', 'iconColorPrimary', 'iconColorSecondary', 'label', 'labelSmall', 'labelMedium', 'deleteIcon', 'deleteIconSmall', 'deleteIconMedium', 'deleteIconColorPrimary', 'deleteIconColorSecondary', 'deleteIconOutlinedColorPrimary', 'deleteIconOutlinedColorSecondary', 'deleteIconFilledColorPrimary', 'deleteIconFilledColorSecondary', 'focusVisible']);
+export default chipClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Dialog/Dialog.js b/ddb_main/node_modules/@mui/material/Dialog/Dialog.js
new file mode 100644
index 0000000..0c785c1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Dialog/Dialog.js
@@ -0,0 +1,401 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["aria-describedby", "aria-labelledby", "BackdropComponent", "BackdropProps", "children", "className", "disableEscapeKeyDown", "fullScreen", "fullWidth", "maxWidth", "onBackdropClick", "onClick", "onClose", "open", "PaperComponent", "PaperProps", "scroll", "TransitionComponent", "transitionDuration", "TransitionProps"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import useId from '@mui/utils/useId';
+import capitalize from '../utils/capitalize';
+import Modal from '../Modal';
+import Fade from '../Fade';
+import Paper from '../Paper';
+import useThemeProps from '../styles/useThemeProps';
+import styled from '../styles/styled';
+import dialogClasses, { getDialogUtilityClass } from './dialogClasses';
+import DialogContext from './DialogContext';
+import Backdrop from '../Backdrop';
+import useTheme from '../styles/useTheme';
+import { jsx as _jsx } from "react/jsx-runtime";
+const DialogBackdrop = styled(Backdrop, {
+  name: 'MuiDialog',
+  slot: 'Backdrop',
+  overrides: (props, styles) => styles.backdrop
+})({
+  // Improve scrollable dialog support.
+  zIndex: -1
+});
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    scroll,
+    maxWidth,
+    fullWidth,
+    fullScreen
+  } = ownerState;
+  const slots = {
+    root: ['root'],
+    container: ['container', `scroll${capitalize(scroll)}`],
+    paper: ['paper', `paperScroll${capitalize(scroll)}`, `paperWidth${capitalize(String(maxWidth))}`, fullWidth && 'paperFullWidth', fullScreen && 'paperFullScreen']
+  };
+  return composeClasses(slots, getDialogUtilityClass, classes);
+};
+const DialogRoot = styled(Modal, {
+  name: 'MuiDialog',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})({
+  '@media print': {
+    // Use !important to override the Modal inline-style.
+    position: 'absolute !important'
+  }
+});
+const DialogContainer = styled('div', {
+  name: 'MuiDialog',
+  slot: 'Container',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.container, styles[`scroll${capitalize(ownerState.scroll)}`]];
+  }
+})(({
+  ownerState
+}) => _extends({
+  height: '100%',
+  '@media print': {
+    height: 'auto'
+  },
+  // We disable the focus ring for mouse, touch and keyboard users.
+  outline: 0
+}, ownerState.scroll === 'paper' && {
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center'
+}, ownerState.scroll === 'body' && {
+  overflowY: 'auto',
+  overflowX: 'hidden',
+  textAlign: 'center',
+  '&::after': {
+    content: '""',
+    display: 'inline-block',
+    verticalAlign: 'middle',
+    height: '100%',
+    width: '0'
+  }
+}));
+const DialogPaper = styled(Paper, {
+  name: 'MuiDialog',
+  slot: 'Paper',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.paper, styles[`scrollPaper${capitalize(ownerState.scroll)}`], styles[`paperWidth${capitalize(String(ownerState.maxWidth))}`], ownerState.fullWidth && styles.paperFullWidth, ownerState.fullScreen && styles.paperFullScreen];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  margin: 32,
+  position: 'relative',
+  overflowY: 'auto',
+  // Fix IE11 issue, to remove at some point.
+  '@media print': {
+    overflowY: 'visible',
+    boxShadow: 'none'
+  }
+}, ownerState.scroll === 'paper' && {
+  display: 'flex',
+  flexDirection: 'column',
+  maxHeight: 'calc(100% - 64px)'
+}, ownerState.scroll === 'body' && {
+  display: 'inline-block',
+  verticalAlign: 'middle',
+  textAlign: 'left' // 'initial' doesn't work on IE11
+}, !ownerState.maxWidth && {
+  maxWidth: 'calc(100% - 64px)'
+}, ownerState.maxWidth === 'xs' && {
+  maxWidth: theme.breakpoints.unit === 'px' ? Math.max(theme.breakpoints.values.xs, 444) : `max(${theme.breakpoints.values.xs}${theme.breakpoints.unit}, 444px)`,
+  [`&.${dialogClasses.paperScrollBody}`]: {
+    [theme.breakpoints.down(Math.max(theme.breakpoints.values.xs, 444) + 32 * 2)]: {
+      maxWidth: 'calc(100% - 64px)'
+    }
+  }
+}, ownerState.maxWidth && ownerState.maxWidth !== 'xs' && {
+  maxWidth: `${theme.breakpoints.values[ownerState.maxWidth]}${theme.breakpoints.unit}`,
+  [`&.${dialogClasses.paperScrollBody}`]: {
+    [theme.breakpoints.down(theme.breakpoints.values[ownerState.maxWidth] + 32 * 2)]: {
+      maxWidth: 'calc(100% - 64px)'
+    }
+  }
+}, ownerState.fullWidth && {
+  width: 'calc(100% - 64px)'
+}, ownerState.fullScreen && {
+  margin: 0,
+  width: '100%',
+  maxWidth: '100%',
+  height: '100%',
+  maxHeight: 'none',
+  borderRadius: 0,
+  [`&.${dialogClasses.paperScrollBody}`]: {
+    margin: 0,
+    maxWidth: '100%'
+  }
+}));
+
+/**
+ * Dialogs are overlaid modal paper based components with a backdrop.
+ */
+const Dialog = /*#__PURE__*/React.forwardRef(function Dialog(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiDialog'
+  });
+  const theme = useTheme();
+  const defaultTransitionDuration = {
+    enter: theme.transitions.duration.enteringScreen,
+    exit: theme.transitions.duration.leavingScreen
+  };
+  const {
+      'aria-describedby': ariaDescribedby,
+      'aria-labelledby': ariaLabelledbyProp,
+      BackdropComponent,
+      BackdropProps,
+      children,
+      className,
+      disableEscapeKeyDown = false,
+      fullScreen = false,
+      fullWidth = false,
+      maxWidth = 'sm',
+      onBackdropClick,
+      onClick,
+      onClose,
+      open,
+      PaperComponent = Paper,
+      PaperProps = {},
+      scroll = 'paper',
+      TransitionComponent = Fade,
+      transitionDuration = defaultTransitionDuration,
+      TransitionProps
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    disableEscapeKeyDown,
+    fullScreen,
+    fullWidth,
+    maxWidth,
+    scroll
+  });
+  const classes = useUtilityClasses(ownerState);
+  const backdropClick = React.useRef();
+  const handleMouseDown = event => {
+    // We don't want to close the dialog when clicking the dialog content.
+    // Make sure the event starts and ends on the same DOM element.
+    backdropClick.current = event.target === event.currentTarget;
+  };
+  const handleBackdropClick = event => {
+    if (onClick) {
+      onClick(event);
+    }
+
+    // Ignore the events not coming from the "backdrop".
+    if (!backdropClick.current) {
+      return;
+    }
+    backdropClick.current = null;
+    if (onBackdropClick) {
+      onBackdropClick(event);
+    }
+    if (onClose) {
+      onClose(event, 'backdropClick');
+    }
+  };
+  const ariaLabelledby = useId(ariaLabelledbyProp);
+  const dialogContextValue = React.useMemo(() => {
+    return {
+      titleId: ariaLabelledby
+    };
+  }, [ariaLabelledby]);
+  return /*#__PURE__*/_jsx(DialogRoot, _extends({
+    className: clsx(classes.root, className),
+    closeAfterTransition: true,
+    components: {
+      Backdrop: DialogBackdrop
+    },
+    componentsProps: {
+      backdrop: _extends({
+        transitionDuration,
+        as: BackdropComponent
+      }, BackdropProps)
+    },
+    disableEscapeKeyDown: disableEscapeKeyDown,
+    onClose: onClose,
+    open: open,
+    ref: ref,
+    onClick: handleBackdropClick,
+    ownerState: ownerState
+  }, other, {
+    children: /*#__PURE__*/_jsx(TransitionComponent, _extends({
+      appear: true,
+      in: open,
+      timeout: transitionDuration,
+      role: "presentation"
+    }, TransitionProps, {
+      children: /*#__PURE__*/_jsx(DialogContainer, {
+        className: clsx(classes.container),
+        onMouseDown: handleMouseDown,
+        ownerState: ownerState,
+        children: /*#__PURE__*/_jsx(DialogPaper, _extends({
+          as: PaperComponent,
+          elevation: 24,
+          role: "dialog",
+          "aria-describedby": ariaDescribedby,
+          "aria-labelledby": ariaLabelledby
+        }, PaperProps, {
+          className: clsx(classes.paper, PaperProps.className),
+          ownerState: ownerState,
+          children: /*#__PURE__*/_jsx(DialogContext.Provider, {
+            value: dialogContextValue,
+            children: children
+          })
+        }))
+      })
+    }))
+  }));
+});
+process.env.NODE_ENV !== "production" ? Dialog.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The id(s) of the element(s) that describe the dialog.
+   */
+  'aria-describedby': PropTypes.string,
+  /**
+   * The id(s) of the element(s) that label the dialog.
+   */
+  'aria-labelledby': PropTypes.string,
+  /**
+   * A backdrop component. This prop enables custom backdrop rendering.
+   * @deprecated Use `slots.backdrop` instead. While this prop currently works, it will be removed in the next major version.
+   * Use the `slots.backdrop` prop to make your application ready for the next version of Material UI.
+   * @default styled(Backdrop, {
+   *   name: 'MuiModal',
+   *   slot: 'Backdrop',
+   *   overridesResolver: (props, styles) => {
+   *     return styles.backdrop;
+   *   },
+   * })({
+   *   zIndex: -1,
+   * })
+   */
+  BackdropComponent: PropTypes.elementType,
+  /**
+   * @ignore
+   */
+  BackdropProps: PropTypes.object,
+  /**
+   * Dialog children, usually the included sub-components.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * If `true`, hitting escape will not fire the `onClose` callback.
+   * @default false
+   */
+  disableEscapeKeyDown: PropTypes.bool,
+  /**
+   * If `true`, the dialog is full-screen.
+   * @default false
+   */
+  fullScreen: PropTypes.bool,
+  /**
+   * If `true`, the dialog stretches to `maxWidth`.
+   *
+   * Notice that the dialog width grow is limited by the default margin.
+   * @default false
+   */
+  fullWidth: PropTypes.bool,
+  /**
+   * Determine the max-width of the dialog.
+   * The dialog width grows with the size of the screen.
+   * Set to `false` to disable `maxWidth`.
+   * @default 'sm'
+   */
+  maxWidth: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl', false]), PropTypes.string]),
+  /**
+   * Callback fired when the backdrop is clicked.
+   * @deprecated Use the `onClose` prop with the `reason` argument to handle the `backdropClick` events.
+   */
+  onBackdropClick: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onClick: PropTypes.func,
+  /**
+   * Callback fired when the component requests to be closed.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {string} reason Can be: `"escapeKeyDown"`, `"backdropClick"`.
+   */
+  onClose: PropTypes.func,
+  /**
+   * If `true`, the component is shown.
+   */
+  open: PropTypes.bool.isRequired,
+  /**
+   * The component used to render the body of the dialog.
+   * @default Paper
+   */
+  PaperComponent: PropTypes.elementType,
+  /**
+   * Props applied to the [`Paper`](/material-ui/api/paper/) element.
+   * @default {}
+   */
+  PaperProps: PropTypes.object,
+  /**
+   * Determine the container for scrolling the dialog.
+   * @default 'paper'
+   */
+  scroll: PropTypes.oneOf(['body', 'paper']),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The component used for the transition.
+   * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
+   * @default Fade
+   */
+  TransitionComponent: PropTypes.elementType,
+  /**
+   * The duration for the transition, in milliseconds.
+   * You may specify a single timeout for all transitions, or individually with an object.
+   * @default {
+   *   enter: theme.transitions.duration.enteringScreen,
+   *   exit: theme.transitions.duration.leavingScreen,
+   * }
+   */
+  transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+    appear: PropTypes.number,
+    enter: PropTypes.number,
+    exit: PropTypes.number
+  })]),
+  /**
+   * Props applied to the transition element.
+   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
+   */
+  TransitionProps: PropTypes.object
+} : void 0;
+export default Dialog;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Dialog/DialogContext.js b/ddb_main/node_modules/@mui/material/Dialog/DialogContext.js
new file mode 100644
index 0000000..0c4d8b7
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Dialog/DialogContext.js
@@ -0,0 +1,6 @@
+import * as React from 'react';
+const DialogContext = /*#__PURE__*/React.createContext({});
+if (process.env.NODE_ENV !== 'production') {
+  DialogContext.displayName = 'DialogContext';
+}
+export default DialogContext;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Dialog/dialogClasses.js b/ddb_main/node_modules/@mui/material/Dialog/dialogClasses.js
new file mode 100644
index 0000000..11e8ea9
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Dialog/dialogClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getDialogUtilityClass(slot) {
+  return generateUtilityClass('MuiDialog', slot);
+}
+const dialogClasses = generateUtilityClasses('MuiDialog', ['root', 'scrollPaper', 'scrollBody', 'container', 'paper', 'paperScrollPaper', 'paperScrollBody', 'paperWidthFalse', 'paperWidthXs', 'paperWidthSm', 'paperWidthMd', 'paperWidthLg', 'paperWidthXl', 'paperFullWidth', 'paperFullScreen']);
+export default dialogClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/DialogActions/DialogActions.js b/ddb_main/node_modules/@mui/material/DialogActions/DialogActions.js
new file mode 100644
index 0000000..f23bc97
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/DialogActions/DialogActions.js
@@ -0,0 +1,93 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "disableSpacing"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import { getDialogActionsUtilityClass } from './dialogActionsClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    disableSpacing
+  } = ownerState;
+  const slots = {
+    root: ['root', !disableSpacing && 'spacing']
+  };
+  return composeClasses(slots, getDialogActionsUtilityClass, classes);
+};
+const DialogActionsRoot = styled('div', {
+  name: 'MuiDialogActions',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, !ownerState.disableSpacing && styles.spacing];
+  }
+})(({
+  ownerState
+}) => _extends({
+  display: 'flex',
+  alignItems: 'center',
+  padding: 8,
+  justifyContent: 'flex-end',
+  flex: '0 0 auto'
+}, !ownerState.disableSpacing && {
+  '& > :not(style) ~ :not(style)': {
+    marginLeft: 8
+  }
+}));
+const DialogActions = /*#__PURE__*/React.forwardRef(function DialogActions(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiDialogActions'
+  });
+  const {
+      className,
+      disableSpacing = false
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    disableSpacing
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(DialogActionsRoot, _extends({
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? DialogActions.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * If `true`, the actions do not have additional margin.
+   * @default false
+   */
+  disableSpacing: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default DialogActions;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/DialogActions/dialogActionsClasses.js b/ddb_main/node_modules/@mui/material/DialogActions/dialogActionsClasses.js
new file mode 100644
index 0000000..f95d6d3
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/DialogActions/dialogActionsClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getDialogActionsUtilityClass(slot) {
+  return generateUtilityClass('MuiDialogActions', slot);
+}
+const dialogActionsClasses = generateUtilityClasses('MuiDialogActions', ['root', 'spacing']);
+export default dialogActionsClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/DialogContent/DialogContent.js b/ddb_main/node_modules/@mui/material/DialogContent/DialogContent.js
new file mode 100644
index 0000000..2a87746
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/DialogContent/DialogContent.js
@@ -0,0 +1,99 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "dividers"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import { getDialogContentUtilityClass } from './dialogContentClasses';
+import dialogTitleClasses from '../DialogTitle/dialogTitleClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    dividers
+  } = ownerState;
+  const slots = {
+    root: ['root', dividers && 'dividers']
+  };
+  return composeClasses(slots, getDialogContentUtilityClass, classes);
+};
+const DialogContentRoot = styled('div', {
+  name: 'MuiDialogContent',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.dividers && styles.dividers];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  flex: '1 1 auto',
+  // Add iOS momentum scrolling for iOS < 13.0
+  WebkitOverflowScrolling: 'touch',
+  overflowY: 'auto',
+  padding: '20px 24px'
+}, ownerState.dividers ? {
+  padding: '16px 24px',
+  borderTop: `1px solid ${(theme.vars || theme).palette.divider}`,
+  borderBottom: `1px solid ${(theme.vars || theme).palette.divider}`
+} : {
+  [`.${dialogTitleClasses.root} + &`]: {
+    paddingTop: 0
+  }
+}));
+const DialogContent = /*#__PURE__*/React.forwardRef(function DialogContent(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiDialogContent'
+  });
+  const {
+      className,
+      dividers = false
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    dividers
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(DialogContentRoot, _extends({
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? DialogContent.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * Display the top and bottom dividers.
+   * @default false
+   */
+  dividers: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default DialogContent;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/DialogContent/dialogContentClasses.js b/ddb_main/node_modules/@mui/material/DialogContent/dialogContentClasses.js
new file mode 100644
index 0000000..1e6059e
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/DialogContent/dialogContentClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getDialogContentUtilityClass(slot) {
+  return generateUtilityClass('MuiDialogContent', slot);
+}
+const dialogContentClasses = generateUtilityClasses('MuiDialogContent', ['root', 'dividers']);
+export default dialogContentClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/DialogContentText/DialogContentText.js b/ddb_main/node_modules/@mui/material/DialogContentText/DialogContentText.js
new file mode 100644
index 0000000..2b96c9c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/DialogContentText/DialogContentText.js
@@ -0,0 +1,74 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "className"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import Typography from '../Typography';
+import { getDialogContentTextUtilityClass } from './dialogContentTextClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root']
+  };
+  const composedClasses = composeClasses(slots, getDialogContentTextUtilityClass, classes);
+  return _extends({}, classes, composedClasses);
+};
+const DialogContentTextRoot = styled(Typography, {
+  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
+  name: 'MuiDialogContentText',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})({});
+const DialogContentText = /*#__PURE__*/React.forwardRef(function DialogContentText(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiDialogContentText'
+  });
+  const {
+      className
+    } = props,
+    ownerState = _objectWithoutPropertiesLoose(props, _excluded);
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(DialogContentTextRoot, _extends({
+    component: "p",
+    variant: "body1",
+    color: "text.secondary",
+    ref: ref,
+    ownerState: ownerState,
+    className: clsx(classes.root, className)
+  }, props, {
+    classes: classes
+  }));
+});
+process.env.NODE_ENV !== "production" ? DialogContentText.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default DialogContentText;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/DialogContentText/dialogContentTextClasses.js b/ddb_main/node_modules/@mui/material/DialogContentText/dialogContentTextClasses.js
new file mode 100644
index 0000000..24df443
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/DialogContentText/dialogContentTextClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getDialogContentTextUtilityClass(slot) {
+  return generateUtilityClass('MuiDialogContentText', slot);
+}
+const dialogContentTextClasses = generateUtilityClasses('MuiDialogContentText', ['root']);
+export default dialogContentTextClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/DialogTitle/DialogTitle.js b/ddb_main/node_modules/@mui/material/DialogTitle/DialogTitle.js
new file mode 100644
index 0000000..f2889c1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/DialogTitle/DialogTitle.js
@@ -0,0 +1,83 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className", "id"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import Typography from '../Typography';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import { getDialogTitleUtilityClass } from './dialogTitleClasses';
+import DialogContext from '../Dialog/DialogContext';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root']
+  };
+  return composeClasses(slots, getDialogTitleUtilityClass, classes);
+};
+const DialogTitleRoot = styled(Typography, {
+  name: 'MuiDialogTitle',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})({
+  padding: '16px 24px',
+  flex: '0 0 auto'
+});
+const DialogTitle = /*#__PURE__*/React.forwardRef(function DialogTitle(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiDialogTitle'
+  });
+  const {
+      className,
+      id: idProp
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = props;
+  const classes = useUtilityClasses(ownerState);
+  const {
+    titleId = idProp
+  } = React.useContext(DialogContext);
+  return /*#__PURE__*/_jsx(DialogTitleRoot, _extends({
+    component: "h2",
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref,
+    variant: "h6",
+    id: idProp != null ? idProp : titleId
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? DialogTitle.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * @ignore
+   */
+  id: PropTypes.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default DialogTitle;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/DialogTitle/dialogTitleClasses.js b/ddb_main/node_modules/@mui/material/DialogTitle/dialogTitleClasses.js
new file mode 100644
index 0000000..16a14a1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/DialogTitle/dialogTitleClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getDialogTitleUtilityClass(slot) {
+  return generateUtilityClass('MuiDialogTitle', slot);
+}
+const dialogTitleClasses = generateUtilityClasses('MuiDialogTitle', ['root']);
+export default dialogTitleClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Divider/dividerClasses.js b/ddb_main/node_modules/@mui/material/Divider/dividerClasses.js
new file mode 100644
index 0000000..8198070
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Divider/dividerClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getDividerUtilityClass(slot) {
+  return generateUtilityClass('MuiDivider', slot);
+}
+const dividerClasses = generateUtilityClasses('MuiDivider', ['root', 'absolute', 'fullWidth', 'inset', 'middle', 'flexItem', 'light', 'vertical', 'withChildren', 'withChildrenVertical', 'textAlignRight', 'textAlignLeft', 'wrapper', 'wrapperVertical']);
+export default dividerClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Fade/Fade.js b/ddb_main/node_modules/@mui/material/Fade/Fade.js
new file mode 100644
index 0000000..5ee7220
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Fade/Fade.js
@@ -0,0 +1,205 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { Transition } from 'react-transition-group';
+import elementAcceptingRef from '@mui/utils/elementAcceptingRef';
+import useTheme from '../styles/useTheme';
+import { reflow, getTransitionProps } from '../transitions/utils';
+import useForkRef from '../utils/useForkRef';
+import { jsx as _jsx } from "react/jsx-runtime";
+const styles = {
+  entering: {
+    opacity: 1
+  },
+  entered: {
+    opacity: 1
+  }
+};
+
+/**
+ * The Fade transition is used by the [Modal](/material-ui/react-modal/) component.
+ * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.
+ */
+const Fade = /*#__PURE__*/React.forwardRef(function Fade(props, ref) {
+  const theme = useTheme();
+  const defaultTimeout = {
+    enter: theme.transitions.duration.enteringScreen,
+    exit: theme.transitions.duration.leavingScreen
+  };
+  const {
+      addEndListener,
+      appear = true,
+      children,
+      easing,
+      in: inProp,
+      onEnter,
+      onEntered,
+      onEntering,
+      onExit,
+      onExited,
+      onExiting,
+      style,
+      timeout = defaultTimeout,
+      // eslint-disable-next-line react/prop-types
+      TransitionComponent = Transition
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const enableStrictModeCompat = true;
+  const nodeRef = React.useRef(null);
+  const handleRef = useForkRef(nodeRef, children.ref, ref);
+  const normalizedTransitionCallback = callback => maybeIsAppearing => {
+    if (callback) {
+      const node = nodeRef.current;
+
+      // onEnterXxx and onExitXxx callbacks have a different arguments.length value.
+      if (maybeIsAppearing === undefined) {
+        callback(node);
+      } else {
+        callback(node, maybeIsAppearing);
+      }
+    }
+  };
+  const handleEntering = normalizedTransitionCallback(onEntering);
+  const handleEnter = normalizedTransitionCallback((node, isAppearing) => {
+    reflow(node); // So the animation always start from the start.
+
+    const transitionProps = getTransitionProps({
+      style,
+      timeout,
+      easing
+    }, {
+      mode: 'enter'
+    });
+    node.style.webkitTransition = theme.transitions.create('opacity', transitionProps);
+    node.style.transition = theme.transitions.create('opacity', transitionProps);
+    if (onEnter) {
+      onEnter(node, isAppearing);
+    }
+  });
+  const handleEntered = normalizedTransitionCallback(onEntered);
+  const handleExiting = normalizedTransitionCallback(onExiting);
+  const handleExit = normalizedTransitionCallback(node => {
+    const transitionProps = getTransitionProps({
+      style,
+      timeout,
+      easing
+    }, {
+      mode: 'exit'
+    });
+    node.style.webkitTransition = theme.transitions.create('opacity', transitionProps);
+    node.style.transition = theme.transitions.create('opacity', transitionProps);
+    if (onExit) {
+      onExit(node);
+    }
+  });
+  const handleExited = normalizedTransitionCallback(onExited);
+  const handleAddEndListener = next => {
+    if (addEndListener) {
+      // Old call signature before `react-transition-group` implemented `nodeRef`
+      addEndListener(nodeRef.current, next);
+    }
+  };
+  return /*#__PURE__*/_jsx(TransitionComponent, _extends({
+    appear: appear,
+    in: inProp,
+    nodeRef: enableStrictModeCompat ? nodeRef : undefined,
+    onEnter: handleEnter,
+    onEntered: handleEntered,
+    onEntering: handleEntering,
+    onExit: handleExit,
+    onExited: handleExited,
+    onExiting: handleExiting,
+    addEndListener: handleAddEndListener,
+    timeout: timeout
+  }, other, {
+    children: (state, childProps) => {
+      return /*#__PURE__*/React.cloneElement(children, _extends({
+        style: _extends({
+          opacity: 0,
+          visibility: state === 'exited' && !inProp ? 'hidden' : undefined
+        }, styles[state], style, children.props.style),
+        ref: handleRef
+      }, childProps));
+    }
+  }));
+});
+process.env.NODE_ENV !== "production" ? Fade.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Add a custom transition end trigger. Called with the transitioning DOM
+   * node and a done callback. Allows for more fine grained transition end
+   * logic. Note: Timeouts are still used as a fallback if provided.
+   */
+  addEndListener: PropTypes.func,
+  /**
+   * Perform the enter transition when it first mounts if `in` is also `true`.
+   * Set this to `false` to disable this behavior.
+   * @default true
+   */
+  appear: PropTypes.bool,
+  /**
+   * A single child content element.
+   */
+  children: elementAcceptingRef.isRequired,
+  /**
+   * The transition timing function.
+   * You may specify a single easing or a object containing enter and exit values.
+   */
+  easing: PropTypes.oneOfType([PropTypes.shape({
+    enter: PropTypes.string,
+    exit: PropTypes.string
+  }), PropTypes.string]),
+  /**
+   * If `true`, the component will transition in.
+   */
+  in: PropTypes.bool,
+  /**
+   * @ignore
+   */
+  onEnter: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onEntered: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onEntering: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onExit: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onExited: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onExiting: PropTypes.func,
+  /**
+   * @ignore
+   */
+  style: PropTypes.object,
+  /**
+   * The duration for the transition, in milliseconds.
+   * You may specify a single timeout for all transitions, or individually with an object.
+   * @default {
+   *   enter: theme.transitions.duration.enteringScreen,
+   *   exit: theme.transitions.duration.leavingScreen,
+   * }
+   */
+  timeout: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+    appear: PropTypes.number,
+    enter: PropTypes.number,
+    exit: PropTypes.number
+  })])
+} : void 0;
+export default Fade;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FilledInput/FilledInput.js b/ddb_main/node_modules/@mui/material/FilledInput/FilledInput.js
new file mode 100644
index 0000000..ce375e6
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FilledInput/FilledInput.js
@@ -0,0 +1,429 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["disableUnderline", "components", "componentsProps", "fullWidth", "hiddenLabel", "inputComponent", "multiline", "slotProps", "slots", "type"];
+import * as React from 'react';
+import deepmerge from '@mui/utils/deepmerge';
+import refType from '@mui/utils/refType';
+import PropTypes from 'prop-types';
+import composeClasses from '@mui/utils/composeClasses';
+import InputBase from '../InputBase';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import filledInputClasses, { getFilledInputUtilityClass } from './filledInputClasses';
+import { rootOverridesResolver as inputBaseRootOverridesResolver, inputOverridesResolver as inputBaseInputOverridesResolver, InputBaseRoot, InputBaseComponent as InputBaseInput } from '../InputBase/InputBase';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    disableUnderline
+  } = ownerState;
+  const slots = {
+    root: ['root', !disableUnderline && 'underline'],
+    input: ['input']
+  };
+  const composedClasses = composeClasses(slots, getFilledInputUtilityClass, classes);
+  return _extends({}, classes, composedClasses);
+};
+const FilledInputRoot = styled(InputBaseRoot, {
+  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
+  name: 'MuiFilledInput',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [...inputBaseRootOverridesResolver(props, styles), !ownerState.disableUnderline && styles.underline];
+  }
+})(({
+  theme,
+  ownerState
+}) => {
+  var _palette;
+  const light = theme.palette.mode === 'light';
+  const bottomLineColor = light ? 'rgba(0, 0, 0, 0.42)' : 'rgba(255, 255, 255, 0.7)';
+  const backgroundColor = light ? 'rgba(0, 0, 0, 0.06)' : 'rgba(255, 255, 255, 0.09)';
+  const hoverBackground = light ? 'rgba(0, 0, 0, 0.09)' : 'rgba(255, 255, 255, 0.13)';
+  const disabledBackground = light ? 'rgba(0, 0, 0, 0.12)' : 'rgba(255, 255, 255, 0.12)';
+  return _extends({
+    position: 'relative',
+    backgroundColor: theme.vars ? theme.vars.palette.FilledInput.bg : backgroundColor,
+    borderTopLeftRadius: (theme.vars || theme).shape.borderRadius,
+    borderTopRightRadius: (theme.vars || theme).shape.borderRadius,
+    transition: theme.transitions.create('background-color', {
+      duration: theme.transitions.duration.shorter,
+      easing: theme.transitions.easing.easeOut
+    }),
+    '&:hover': {
+      backgroundColor: theme.vars ? theme.vars.palette.FilledInput.hoverBg : hoverBackground,
+      // Reset on touch devices, it doesn't add specificity
+      '@media (hover: none)': {
+        backgroundColor: theme.vars ? theme.vars.palette.FilledInput.bg : backgroundColor
+      }
+    },
+    [`&.${filledInputClasses.focused}`]: {
+      backgroundColor: theme.vars ? theme.vars.palette.FilledInput.bg : backgroundColor
+    },
+    [`&.${filledInputClasses.disabled}`]: {
+      backgroundColor: theme.vars ? theme.vars.palette.FilledInput.disabledBg : disabledBackground
+    }
+  }, !ownerState.disableUnderline && {
+    '&::after': {
+      borderBottom: `2px solid ${(_palette = (theme.vars || theme).palette[ownerState.color || 'primary']) == null ? void 0 : _palette.main}`,
+      left: 0,
+      bottom: 0,
+      // Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
+      content: '""',
+      position: 'absolute',
+      right: 0,
+      transform: 'scaleX(0)',
+      transition: theme.transitions.create('transform', {
+        duration: theme.transitions.duration.shorter,
+        easing: theme.transitions.easing.easeOut
+      }),
+      pointerEvents: 'none' // Transparent to the hover style.
+    },
+    [`&.${filledInputClasses.focused}:after`]: {
+      // translateX(0) is a workaround for Safari transform scale bug
+      // See https://github.com/mui/material-ui/issues/31766
+      transform: 'scaleX(1) translateX(0)'
+    },
+    [`&.${filledInputClasses.error}`]: {
+      '&::before, &::after': {
+        borderBottomColor: (theme.vars || theme).palette.error.main
+      }
+    },
+    '&::before': {
+      borderBottom: `1px solid ${theme.vars ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / ${theme.vars.opacity.inputUnderline})` : bottomLineColor}`,
+      left: 0,
+      bottom: 0,
+      // Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
+      content: '"\\00a0"',
+      position: 'absolute',
+      right: 0,
+      transition: theme.transitions.create('border-bottom-color', {
+        duration: theme.transitions.duration.shorter
+      }),
+      pointerEvents: 'none' // Transparent to the hover style.
+    },
+    [`&:hover:not(.${filledInputClasses.disabled}, .${filledInputClasses.error}):before`]: {
+      borderBottom: `1px solid ${(theme.vars || theme).palette.text.primary}`
+    },
+    [`&.${filledInputClasses.disabled}:before`]: {
+      borderBottomStyle: 'dotted'
+    }
+  }, ownerState.startAdornment && {
+    paddingLeft: 12
+  }, ownerState.endAdornment && {
+    paddingRight: 12
+  }, ownerState.multiline && _extends({
+    padding: '25px 12px 8px'
+  }, ownerState.size === 'small' && {
+    paddingTop: 21,
+    paddingBottom: 4
+  }, ownerState.hiddenLabel && {
+    paddingTop: 16,
+    paddingBottom: 17
+  }, ownerState.hiddenLabel && ownerState.size === 'small' && {
+    paddingTop: 8,
+    paddingBottom: 9
+  }));
+});
+const FilledInputInput = styled(InputBaseInput, {
+  name: 'MuiFilledInput',
+  slot: 'Input',
+  overridesResolver: inputBaseInputOverridesResolver
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  paddingTop: 25,
+  paddingRight: 12,
+  paddingBottom: 8,
+  paddingLeft: 12
+}, !theme.vars && {
+  '&:-webkit-autofill': {
+    WebkitBoxShadow: theme.palette.mode === 'light' ? null : '0 0 0 100px #266798 inset',
+    WebkitTextFillColor: theme.palette.mode === 'light' ? null : '#fff',
+    caretColor: theme.palette.mode === 'light' ? null : '#fff',
+    borderTopLeftRadius: 'inherit',
+    borderTopRightRadius: 'inherit'
+  }
+}, theme.vars && {
+  '&:-webkit-autofill': {
+    borderTopLeftRadius: 'inherit',
+    borderTopRightRadius: 'inherit'
+  },
+  [theme.getColorSchemeSelector('dark')]: {
+    '&:-webkit-autofill': {
+      WebkitBoxShadow: '0 0 0 100px #266798 inset',
+      WebkitTextFillColor: '#fff',
+      caretColor: '#fff'
+    }
+  }
+}, ownerState.size === 'small' && {
+  paddingTop: 21,
+  paddingBottom: 4
+}, ownerState.hiddenLabel && {
+  paddingTop: 16,
+  paddingBottom: 17
+}, ownerState.startAdornment && {
+  paddingLeft: 0
+}, ownerState.endAdornment && {
+  paddingRight: 0
+}, ownerState.hiddenLabel && ownerState.size === 'small' && {
+  paddingTop: 8,
+  paddingBottom: 9
+}, ownerState.multiline && {
+  paddingTop: 0,
+  paddingBottom: 0,
+  paddingLeft: 0,
+  paddingRight: 0
+}));
+const FilledInput = /*#__PURE__*/React.forwardRef(function FilledInput(inProps, ref) {
+  var _ref, _slots$root, _ref2, _slots$input;
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiFilledInput'
+  });
+  const {
+      components = {},
+      componentsProps: componentsPropsProp,
+      fullWidth = false,
+      // declare here to prevent spreading to DOM
+      inputComponent = 'input',
+      multiline = false,
+      slotProps,
+      slots = {},
+      type = 'text'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    fullWidth,
+    inputComponent,
+    multiline,
+    type
+  });
+  const classes = useUtilityClasses(props);
+  const filledInputComponentsProps = {
+    root: {
+      ownerState
+    },
+    input: {
+      ownerState
+    }
+  };
+  const componentsProps = (slotProps != null ? slotProps : componentsPropsProp) ? deepmerge(filledInputComponentsProps, slotProps != null ? slotProps : componentsPropsProp) : filledInputComponentsProps;
+  const RootSlot = (_ref = (_slots$root = slots.root) != null ? _slots$root : components.Root) != null ? _ref : FilledInputRoot;
+  const InputSlot = (_ref2 = (_slots$input = slots.input) != null ? _slots$input : components.Input) != null ? _ref2 : FilledInputInput;
+  return /*#__PURE__*/_jsx(InputBase, _extends({
+    slots: {
+      root: RootSlot,
+      input: InputSlot
+    },
+    componentsProps: componentsProps,
+    fullWidth: fullWidth,
+    inputComponent: inputComponent,
+    multiline: multiline,
+    ref: ref,
+    type: type
+  }, other, {
+    classes: classes
+  }));
+});
+process.env.NODE_ENV !== "production" ? FilledInput.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * This prop helps users to fill forms faster, especially on mobile devices.
+   * The name can be confusing, as it's more like an autofill.
+   * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).
+   */
+  autoComplete: PropTypes.string,
+  /**
+   * If `true`, the `input` element is focused during the first mount.
+   */
+  autoFocus: PropTypes.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * The prop defaults to the value (`'primary'`) inherited from the parent FormControl component.
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['primary', 'secondary']), PropTypes.string]),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `slots` prop.
+   * It's recommended to use the `slots` prop instead.
+   *
+   * @default {}
+   */
+  components: PropTypes.shape({
+    Input: PropTypes.elementType,
+    Root: PropTypes.elementType
+  }),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `slotProps` prop.
+   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   *
+   * @default {}
+   */
+  componentsProps: PropTypes.shape({
+    input: PropTypes.object,
+    root: PropTypes.object
+  }),
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue: PropTypes.any,
+  /**
+   * If `true`, the component is disabled.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the input will not have an underline.
+   */
+  disableUnderline: PropTypes.bool,
+  /**
+   * End `InputAdornment` for this component.
+   */
+  endAdornment: PropTypes.node,
+  /**
+   * If `true`, the `input` will indicate an error.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  error: PropTypes.bool,
+  /**
+   * If `true`, the `input` will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: PropTypes.bool,
+  /**
+   * If `true`, the label is hidden.
+   * This is used to increase density for a `FilledInput`.
+   * Be sure to add `aria-label` to the `input` element.
+   * @default false
+   */
+  hiddenLabel: PropTypes.bool,
+  /**
+   * The id of the `input` element.
+   */
+  id: PropTypes.string,
+  /**
+   * The component used for the `input` element.
+   * Either a string to use a HTML element or a component.
+   * @default 'input'
+   */
+  inputComponent: PropTypes.elementType,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   * @default {}
+   */
+  inputProps: PropTypes.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: refType,
+  /**
+   * If `dense`, will adjust vertical spacing. This is normally obtained via context from
+   * FormControl.
+   * The prop defaults to the value (`'none'`) inherited from the parent FormControl component.
+   */
+  margin: PropTypes.oneOf(['dense', 'none']),
+  /**
+   * Maximum number of rows to display when multiline option is set to true.
+   */
+  maxRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * Minimum number of rows to display when multiline option is set to true.
+   */
+  minRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered.
+   * @default false
+   */
+  multiline: PropTypes.bool,
+  /**
+   * Name attribute of the `input` element.
+   */
+  name: PropTypes.string,
+  /**
+   * Callback fired when the value is changed.
+   *
+   * @param {React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   */
+  onChange: PropTypes.func,
+  /**
+   * The short hint displayed in the `input` before the user enters a value.
+   */
+  placeholder: PropTypes.string,
+  /**
+   * It prevents the user from changing the value of the field
+   * (not from interacting with the field).
+   */
+  readOnly: PropTypes.bool,
+  /**
+   * If `true`, the `input` element is required.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  required: PropTypes.bool,
+  /**
+   * Number of rows to display when multiline option is set to true.
+   */
+  rows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    input: PropTypes.object,
+    root: PropTypes.object
+  }),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `components` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    input: PropTypes.elementType,
+    root: PropTypes.elementType
+  }),
+  /**
+   * Start `InputAdornment` for this component.
+   */
+  startAdornment: PropTypes.node,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).
+   * @default 'text'
+   */
+  type: PropTypes.string,
+  /**
+   * The value of the `input` element, required for a controlled component.
+   */
+  value: PropTypes.any
+} : void 0;
+FilledInput.muiName = 'Input';
+export default FilledInput;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FilledInput/filledInputClasses.js b/ddb_main/node_modules/@mui/material/FilledInput/filledInputClasses.js
new file mode 100644
index 0000000..c5368cd
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FilledInput/filledInputClasses.js
@@ -0,0 +1,9 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import { inputBaseClasses } from '../InputBase';
+export function getFilledInputUtilityClass(slot) {
+  return generateUtilityClass('MuiFilledInput', slot);
+}
+const filledInputClasses = _extends({}, inputBaseClasses, generateUtilityClasses('MuiFilledInput', ['root', 'underline', 'input']));
+export default filledInputClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FormControl/FormControl.js b/ddb_main/node_modules/@mui/material/FormControl/FormControl.js
new file mode 100644
index 0000000..dffeb21
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FormControl/FormControl.js
@@ -0,0 +1,290 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "className", "color", "component", "disabled", "error", "focused", "fullWidth", "hiddenLabel", "margin", "required", "size", "variant"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import useThemeProps from '../styles/useThemeProps';
+import styled from '../styles/styled';
+import { isFilled, isAdornedStart } from '../InputBase/utils';
+import capitalize from '../utils/capitalize';
+import isMuiElement from '../utils/isMuiElement';
+import FormControlContext from './FormControlContext';
+import { getFormControlUtilityClasses } from './formControlClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    margin,
+    fullWidth
+  } = ownerState;
+  const slots = {
+    root: ['root', margin !== 'none' && `margin${capitalize(margin)}`, fullWidth && 'fullWidth']
+  };
+  return composeClasses(slots, getFormControlUtilityClasses, classes);
+};
+const FormControlRoot = styled('div', {
+  name: 'MuiFormControl',
+  slot: 'Root',
+  overridesResolver: ({
+    ownerState
+  }, styles) => {
+    return _extends({}, styles.root, styles[`margin${capitalize(ownerState.margin)}`], ownerState.fullWidth && styles.fullWidth);
+  }
+})(({
+  ownerState
+}) => _extends({
+  display: 'inline-flex',
+  flexDirection: 'column',
+  position: 'relative',
+  // Reset fieldset default style.
+  minWidth: 0,
+  padding: 0,
+  margin: 0,
+  border: 0,
+  verticalAlign: 'top'
+}, ownerState.margin === 'normal' && {
+  marginTop: 16,
+  marginBottom: 8
+}, ownerState.margin === 'dense' && {
+  marginTop: 8,
+  marginBottom: 4
+}, ownerState.fullWidth && {
+  width: '100%'
+}));
+
+/**
+ * Provides context such as filled/focused/error/required for form inputs.
+ * Relying on the context provides high flexibility and ensures that the state always stays
+ * consistent across the children of the `FormControl`.
+ * This context is used by the following components:
+ *
+ *  - FormLabel
+ *  - FormHelperText
+ *  - Input
+ *  - InputLabel
+ *
+ * You can find one composition example below and more going to [the demos](/material-ui/react-text-field/#components).
+ *
+ * ```jsx
+ * <FormControl>
+ *   <InputLabel htmlFor="my-input">Email address</InputLabel>
+ *   <Input id="my-input" aria-describedby="my-helper-text" />
+ *   <FormHelperText id="my-helper-text">We'll never share your email.</FormHelperText>
+ * </FormControl>
+ * ```
+ *
+ * ⚠️ Only one `InputBase` can be used within a FormControl because it creates visual inconsistencies.
+ * For instance, only one input can be focused at the same time, the state shouldn't be shared.
+ */
+const FormControl = /*#__PURE__*/React.forwardRef(function FormControl(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiFormControl'
+  });
+  const {
+      children,
+      className,
+      color = 'primary',
+      component = 'div',
+      disabled = false,
+      error = false,
+      focused: visuallyFocused,
+      fullWidth = false,
+      hiddenLabel = false,
+      margin = 'none',
+      required = false,
+      size = 'medium',
+      variant = 'outlined'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    color,
+    component,
+    disabled,
+    error,
+    fullWidth,
+    hiddenLabel,
+    margin,
+    required,
+    size,
+    variant
+  });
+  const classes = useUtilityClasses(ownerState);
+  const [adornedStart, setAdornedStart] = React.useState(() => {
+    // We need to iterate through the children and find the Input in order
+    // to fully support server-side rendering.
+    let initialAdornedStart = false;
+    if (children) {
+      React.Children.forEach(children, child => {
+        if (!isMuiElement(child, ['Input', 'Select'])) {
+          return;
+        }
+        const input = isMuiElement(child, ['Select']) ? child.props.input : child;
+        if (input && isAdornedStart(input.props)) {
+          initialAdornedStart = true;
+        }
+      });
+    }
+    return initialAdornedStart;
+  });
+  const [filled, setFilled] = React.useState(() => {
+    // We need to iterate through the children and find the Input in order
+    // to fully support server-side rendering.
+    let initialFilled = false;
+    if (children) {
+      React.Children.forEach(children, child => {
+        if (!isMuiElement(child, ['Input', 'Select'])) {
+          return;
+        }
+        if (isFilled(child.props, true) || isFilled(child.props.inputProps, true)) {
+          initialFilled = true;
+        }
+      });
+    }
+    return initialFilled;
+  });
+  const [focusedState, setFocused] = React.useState(false);
+  if (disabled && focusedState) {
+    setFocused(false);
+  }
+  const focused = visuallyFocused !== undefined && !disabled ? visuallyFocused : focusedState;
+  let registerEffect;
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const registeredInput = React.useRef(false);
+    registerEffect = () => {
+      if (registeredInput.current) {
+        console.error(['MUI: There are multiple `InputBase` components inside a FormControl.', 'This creates visual inconsistencies, only use one `InputBase`.'].join('\n'));
+      }
+      registeredInput.current = true;
+      return () => {
+        registeredInput.current = false;
+      };
+    };
+  }
+  const childContext = React.useMemo(() => {
+    return {
+      adornedStart,
+      setAdornedStart,
+      color,
+      disabled,
+      error,
+      filled,
+      focused,
+      fullWidth,
+      hiddenLabel,
+      size,
+      onBlur: () => {
+        setFocused(false);
+      },
+      onEmpty: () => {
+        setFilled(false);
+      },
+      onFilled: () => {
+        setFilled(true);
+      },
+      onFocus: () => {
+        setFocused(true);
+      },
+      registerEffect,
+      required,
+      variant
+    };
+  }, [adornedStart, color, disabled, error, filled, focused, fullWidth, hiddenLabel, registerEffect, required, size, variant]);
+  return /*#__PURE__*/_jsx(FormControlContext.Provider, {
+    value: childContext,
+    children: /*#__PURE__*/_jsx(FormControlRoot, _extends({
+      as: component,
+      ownerState: ownerState,
+      className: clsx(classes.root, className),
+      ref: ref
+    }, other, {
+      children: children
+    }))
+  });
+});
+process.env.NODE_ENV !== "production" ? FormControl.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'primary'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * If `true`, the label, input and helper text should be displayed in a disabled state.
+   * @default false
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the label is displayed in an error state.
+   * @default false
+   */
+  error: PropTypes.bool,
+  /**
+   * If `true`, the component is displayed in focused state.
+   */
+  focused: PropTypes.bool,
+  /**
+   * If `true`, the component will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: PropTypes.bool,
+  /**
+   * If `true`, the label is hidden.
+   * This is used to increase density for a `FilledInput`.
+   * Be sure to add `aria-label` to the `input` element.
+   * @default false
+   */
+  hiddenLabel: PropTypes.bool,
+  /**
+   * If `dense` or `normal`, will adjust vertical spacing of this and contained components.
+   * @default 'none'
+   */
+  margin: PropTypes.oneOf(['dense', 'none', 'normal']),
+  /**
+   * If `true`, the label will indicate that the `input` is required.
+   * @default false
+   */
+  required: PropTypes.bool,
+  /**
+   * The size of the component.
+   * @default 'medium'
+   */
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The variant to use.
+   * @default 'outlined'
+   */
+  variant: PropTypes.oneOf(['filled', 'outlined', 'standard'])
+} : void 0;
+export default FormControl;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FormControl/FormControlContext.js b/ddb_main/node_modules/@mui/material/FormControl/FormControlContext.js
new file mode 100644
index 0000000..d9f49d4
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FormControl/FormControlContext.js
@@ -0,0 +1,9 @@
+import * as React from 'react';
+/**
+ * @ignore - internal component.
+ */
+const FormControlContext = /*#__PURE__*/React.createContext(undefined);
+if (process.env.NODE_ENV !== 'production') {
+  FormControlContext.displayName = 'FormControlContext';
+}
+export default FormControlContext;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FormControl/formControlClasses.js b/ddb_main/node_modules/@mui/material/FormControl/formControlClasses.js
new file mode 100644
index 0000000..c7936f3
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FormControl/formControlClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getFormControlUtilityClasses(slot) {
+  return generateUtilityClass('MuiFormControl', slot);
+}
+const formControlClasses = generateUtilityClasses('MuiFormControl', ['root', 'marginNone', 'marginNormal', 'marginDense', 'fullWidth', 'disabled']);
+export default formControlClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FormControl/formControlState.js b/ddb_main/node_modules/@mui/material/FormControl/formControlState.js
new file mode 100644
index 0000000..b71a0d1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FormControl/formControlState.js
@@ -0,0 +1,15 @@
+export default function formControlState({
+  props,
+  states,
+  muiFormControl
+}) {
+  return states.reduce((acc, state) => {
+    acc[state] = props[state];
+    if (muiFormControl) {
+      if (typeof props[state] === 'undefined') {
+        acc[state] = muiFormControl[state];
+      }
+    }
+    return acc;
+  }, {});
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FormControl/useFormControl.js b/ddb_main/node_modules/@mui/material/FormControl/useFormControl.js
new file mode 100644
index 0000000..6f051a2
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FormControl/useFormControl.js
@@ -0,0 +1,7 @@
+'use client';
+
+import * as React from 'react';
+import FormControlContext from './FormControlContext';
+export default function useFormControl() {
+  return React.useContext(FormControlContext);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FormControlLabel/FormControlLabel.js b/ddb_main/node_modules/@mui/material/FormControlLabel/FormControlLabel.js
new file mode 100644
index 0000000..01433ce
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FormControlLabel/FormControlLabel.js
@@ -0,0 +1,245 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["checked", "className", "componentsProps", "control", "disabled", "disableTypography", "inputRef", "label", "labelPlacement", "name", "onChange", "required", "slotProps", "value"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import refType from '@mui/utils/refType';
+import composeClasses from '@mui/utils/composeClasses';
+import { useFormControl } from '../FormControl';
+import Stack from '../Stack';
+import Typography from '../Typography';
+import capitalize from '../utils/capitalize';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import formControlLabelClasses, { getFormControlLabelUtilityClasses } from './formControlLabelClasses';
+import formControlState from '../FormControl/formControlState';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    disabled,
+    labelPlacement,
+    error,
+    required
+  } = ownerState;
+  const slots = {
+    root: ['root', disabled && 'disabled', `labelPlacement${capitalize(labelPlacement)}`, error && 'error', required && 'required'],
+    label: ['label', disabled && 'disabled'],
+    asterisk: ['asterisk', error && 'error']
+  };
+  return composeClasses(slots, getFormControlLabelUtilityClasses, classes);
+};
+export const FormControlLabelRoot = styled('label', {
+  name: 'MuiFormControlLabel',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [{
+      [`& .${formControlLabelClasses.label}`]: styles.label
+    }, styles.root, styles[`labelPlacement${capitalize(ownerState.labelPlacement)}`]];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  display: 'inline-flex',
+  alignItems: 'center',
+  cursor: 'pointer',
+  // For correct alignment with the text.
+  verticalAlign: 'middle',
+  WebkitTapHighlightColor: 'transparent',
+  marginLeft: -11,
+  marginRight: 16,
+  // used for row presentation of radio/checkbox
+  [`&.${formControlLabelClasses.disabled}`]: {
+    cursor: 'default'
+  }
+}, ownerState.labelPlacement === 'start' && {
+  flexDirection: 'row-reverse',
+  marginLeft: 16,
+  // used for row presentation of radio/checkbox
+  marginRight: -11
+}, ownerState.labelPlacement === 'top' && {
+  flexDirection: 'column-reverse',
+  marginLeft: 16
+}, ownerState.labelPlacement === 'bottom' && {
+  flexDirection: 'column',
+  marginLeft: 16
+}, {
+  [`& .${formControlLabelClasses.label}`]: {
+    [`&.${formControlLabelClasses.disabled}`]: {
+      color: (theme.vars || theme).palette.text.disabled
+    }
+  }
+}));
+const AsteriskComponent = styled('span', {
+  name: 'MuiFormControlLabel',
+  slot: 'Asterisk',
+  overridesResolver: (props, styles) => styles.asterisk
+})(({
+  theme
+}) => ({
+  [`&.${formControlLabelClasses.error}`]: {
+    color: (theme.vars || theme).palette.error.main
+  }
+}));
+
+/**
+ * Drop-in replacement of the `Radio`, `Switch` and `Checkbox` component.
+ * Use this component if you want to display an extra label.
+ */
+const FormControlLabel = /*#__PURE__*/React.forwardRef(function FormControlLabel(inProps, ref) {
+  var _ref, _slotProps$typography;
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiFormControlLabel'
+  });
+  const {
+      className,
+      componentsProps = {},
+      control,
+      disabled: disabledProp,
+      disableTypography,
+      label: labelProp,
+      labelPlacement = 'end',
+      required: requiredProp,
+      slotProps = {}
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const muiFormControl = useFormControl();
+  const disabled = (_ref = disabledProp != null ? disabledProp : control.props.disabled) != null ? _ref : muiFormControl == null ? void 0 : muiFormControl.disabled;
+  const required = requiredProp != null ? requiredProp : control.props.required;
+  const controlProps = {
+    disabled,
+    required
+  };
+  ['checked', 'name', 'onChange', 'value', 'inputRef'].forEach(key => {
+    if (typeof control.props[key] === 'undefined' && typeof props[key] !== 'undefined') {
+      controlProps[key] = props[key];
+    }
+  });
+  const fcs = formControlState({
+    props,
+    muiFormControl,
+    states: ['error']
+  });
+  const ownerState = _extends({}, props, {
+    disabled,
+    labelPlacement,
+    required,
+    error: fcs.error
+  });
+  const classes = useUtilityClasses(ownerState);
+  const typographySlotProps = (_slotProps$typography = slotProps.typography) != null ? _slotProps$typography : componentsProps.typography;
+  let label = labelProp;
+  if (label != null && label.type !== Typography && !disableTypography) {
+    label = /*#__PURE__*/_jsx(Typography, _extends({
+      component: "span"
+    }, typographySlotProps, {
+      className: clsx(classes.label, typographySlotProps == null ? void 0 : typographySlotProps.className),
+      children: label
+    }));
+  }
+  return /*#__PURE__*/_jsxs(FormControlLabelRoot, _extends({
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref
+  }, other, {
+    children: [/*#__PURE__*/React.cloneElement(control, controlProps), required ? /*#__PURE__*/_jsxs(Stack, {
+      display: "block",
+      children: [label, /*#__PURE__*/_jsxs(AsteriskComponent, {
+        ownerState: ownerState,
+        "aria-hidden": true,
+        className: classes.asterisk,
+        children: ["\u2009", '*']
+      })]
+    }) : label]
+  }));
+});
+process.env.NODE_ENV !== "production" ? FormControlLabel.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the component appears selected.
+   */
+  checked: PropTypes.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  componentsProps: PropTypes.shape({
+    typography: PropTypes.object
+  }),
+  /**
+   * A control element. For instance, it can be a `Radio`, a `Switch` or a `Checkbox`.
+   */
+  control: PropTypes.element.isRequired,
+  /**
+   * If `true`, the control is disabled.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the label is rendered as it is passed without an additional typography node.
+   */
+  disableTypography: PropTypes.bool,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: refType,
+  /**
+   * A text or an element to be used in an enclosing label element.
+   */
+  label: PropTypes.node,
+  /**
+   * The position of the label.
+   * @default 'end'
+   */
+  labelPlacement: PropTypes.oneOf(['bottom', 'end', 'start', 'top']),
+  /**
+   * @ignore
+   */
+  name: PropTypes.string,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {React.SyntheticEvent} event The event source of the callback.
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: PropTypes.func,
+  /**
+   * If `true`, the label will indicate that the `input` is required.
+   */
+  required: PropTypes.bool,
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    typography: PropTypes.object
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The value of the component.
+   */
+  value: PropTypes.any
+} : void 0;
+export default FormControlLabel;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FormControlLabel/formControlLabelClasses.js b/ddb_main/node_modules/@mui/material/FormControlLabel/formControlLabelClasses.js
new file mode 100644
index 0000000..a75132f
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FormControlLabel/formControlLabelClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getFormControlLabelUtilityClasses(slot) {
+  return generateUtilityClass('MuiFormControlLabel', slot);
+}
+const formControlLabelClasses = generateUtilityClasses('MuiFormControlLabel', ['root', 'labelPlacementStart', 'labelPlacementTop', 'labelPlacementBottom', 'disabled', 'label', 'error', 'required', 'asterisk']);
+export default formControlLabelClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FormGroup/FormGroup.js b/ddb_main/node_modules/@mui/material/FormGroup/FormGroup.js
new file mode 100644
index 0000000..a71da6a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FormGroup/FormGroup.js
@@ -0,0 +1,105 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "row"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import { getFormGroupUtilityClass } from './formGroupClasses';
+import useFormControl from '../FormControl/useFormControl';
+import formControlState from '../FormControl/formControlState';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    row,
+    error
+  } = ownerState;
+  const slots = {
+    root: ['root', row && 'row', error && 'error']
+  };
+  return composeClasses(slots, getFormGroupUtilityClass, classes);
+};
+const FormGroupRoot = styled('div', {
+  name: 'MuiFormGroup',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.row && styles.row];
+  }
+})(({
+  ownerState
+}) => _extends({
+  display: 'flex',
+  flexDirection: 'column',
+  flexWrap: 'wrap'
+}, ownerState.row && {
+  flexDirection: 'row'
+}));
+
+/**
+ * `FormGroup` wraps controls such as `Checkbox` and `Switch`.
+ * It provides compact row layout.
+ * For the `Radio`, you should be using the `RadioGroup` component instead of this one.
+ */
+const FormGroup = /*#__PURE__*/React.forwardRef(function FormGroup(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiFormGroup'
+  });
+  const {
+      className,
+      row = false
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const muiFormControl = useFormControl();
+  const fcs = formControlState({
+    props,
+    muiFormControl,
+    states: ['error']
+  });
+  const ownerState = _extends({}, props, {
+    row,
+    error: fcs.error
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(FormGroupRoot, _extends({
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? FormGroup.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * Display group of elements in a compact row.
+   * @default false
+   */
+  row: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default FormGroup;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FormGroup/formGroupClasses.js b/ddb_main/node_modules/@mui/material/FormGroup/formGroupClasses.js
new file mode 100644
index 0000000..87f6031
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FormGroup/formGroupClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getFormGroupUtilityClass(slot) {
+  return generateUtilityClass('MuiFormGroup', slot);
+}
+const formGroupClasses = generateUtilityClasses('MuiFormGroup', ['root', 'row', 'error']);
+export default formGroupClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FormLabel/FormLabel.js b/ddb_main/node_modules/@mui/material/FormLabel/FormLabel.js
new file mode 100644
index 0000000..13829b9
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FormLabel/FormLabel.js
@@ -0,0 +1,165 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "className", "color", "component", "disabled", "error", "filled", "focused", "required"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import formControlState from '../FormControl/formControlState';
+import useFormControl from '../FormControl/useFormControl';
+import capitalize from '../utils/capitalize';
+import useThemeProps from '../styles/useThemeProps';
+import styled from '../styles/styled';
+import formLabelClasses, { getFormLabelUtilityClasses } from './formLabelClasses';
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    color,
+    focused,
+    disabled,
+    error,
+    filled,
+    required
+  } = ownerState;
+  const slots = {
+    root: ['root', `color${capitalize(color)}`, disabled && 'disabled', error && 'error', filled && 'filled', focused && 'focused', required && 'required'],
+    asterisk: ['asterisk', error && 'error']
+  };
+  return composeClasses(slots, getFormLabelUtilityClasses, classes);
+};
+export const FormLabelRoot = styled('label', {
+  name: 'MuiFormLabel',
+  slot: 'Root',
+  overridesResolver: ({
+    ownerState
+  }, styles) => {
+    return _extends({}, styles.root, ownerState.color === 'secondary' && styles.colorSecondary, ownerState.filled && styles.filled);
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  color: (theme.vars || theme).palette.text.secondary
+}, theme.typography.body1, {
+  lineHeight: '1.4375em',
+  padding: 0,
+  position: 'relative',
+  [`&.${formLabelClasses.focused}`]: {
+    color: (theme.vars || theme).palette[ownerState.color].main
+  },
+  [`&.${formLabelClasses.disabled}`]: {
+    color: (theme.vars || theme).palette.text.disabled
+  },
+  [`&.${formLabelClasses.error}`]: {
+    color: (theme.vars || theme).palette.error.main
+  }
+}));
+const AsteriskComponent = styled('span', {
+  name: 'MuiFormLabel',
+  slot: 'Asterisk',
+  overridesResolver: (props, styles) => styles.asterisk
+})(({
+  theme
+}) => ({
+  [`&.${formLabelClasses.error}`]: {
+    color: (theme.vars || theme).palette.error.main
+  }
+}));
+const FormLabel = /*#__PURE__*/React.forwardRef(function FormLabel(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiFormLabel'
+  });
+  const {
+      children,
+      className,
+      component = 'label'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const muiFormControl = useFormControl();
+  const fcs = formControlState({
+    props,
+    muiFormControl,
+    states: ['color', 'required', 'focused', 'disabled', 'error', 'filled']
+  });
+  const ownerState = _extends({}, props, {
+    color: fcs.color || 'primary',
+    component,
+    disabled: fcs.disabled,
+    error: fcs.error,
+    filled: fcs.filled,
+    focused: fcs.focused,
+    required: fcs.required
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsxs(FormLabelRoot, _extends({
+    as: component,
+    ownerState: ownerState,
+    className: clsx(classes.root, className),
+    ref: ref
+  }, other, {
+    children: [children, fcs.required && /*#__PURE__*/_jsxs(AsteriskComponent, {
+      ownerState: ownerState,
+      "aria-hidden": true,
+      className: classes.asterisk,
+      children: ["\u2009", '*']
+    })]
+  }));
+});
+process.env.NODE_ENV !== "production" ? FormLabel.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['error', 'info', 'primary', 'secondary', 'success', 'warning']), PropTypes.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * If `true`, the label should be displayed in a disabled state.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the label is displayed in an error state.
+   */
+  error: PropTypes.bool,
+  /**
+   * If `true`, the label should use filled classes key.
+   */
+  filled: PropTypes.bool,
+  /**
+   * If `true`, the input of this label is focused (used by `FormGroup` components).
+   */
+  focused: PropTypes.bool,
+  /**
+   * If `true`, the label will indicate that the `input` is required.
+   */
+  required: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default FormLabel;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/FormLabel/formLabelClasses.js b/ddb_main/node_modules/@mui/material/FormLabel/formLabelClasses.js
new file mode 100644
index 0000000..04aaf60
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/FormLabel/formLabelClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getFormLabelUtilityClasses(slot) {
+  return generateUtilityClass('MuiFormLabel', slot);
+}
+const formLabelClasses = generateUtilityClasses('MuiFormLabel', ['root', 'colorSecondary', 'focused', 'disabled', 'error', 'filled', 'required', 'asterisk']);
+export default formLabelClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/GlobalStyles/GlobalStyles.js b/ddb_main/node_modules/@mui/material/GlobalStyles/GlobalStyles.js
new file mode 100644
index 0000000..bafeccd
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/GlobalStyles/GlobalStyles.js
@@ -0,0 +1,26 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { GlobalStyles as SystemGlobalStyles } from '@mui/system';
+import defaultTheme from '../styles/defaultTheme';
+import THEME_ID from '../styles/identifier';
+import { jsx as _jsx } from "react/jsx-runtime";
+function GlobalStyles(props) {
+  return /*#__PURE__*/_jsx(SystemGlobalStyles, _extends({}, props, {
+    defaultTheme: defaultTheme,
+    themeId: THEME_ID
+  }));
+}
+process.env.NODE_ENV !== "production" ? GlobalStyles.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The styles you want to apply globally.
+   */
+  styles: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.array, PropTypes.func, PropTypes.number, PropTypes.object, PropTypes.string, PropTypes.bool])
+} : void 0;
+export default GlobalStyles;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Grid/Grid.js b/ddb_main/node_modules/@mui/material/Grid/Grid.js
new file mode 100644
index 0000000..2cae453
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Grid/Grid.js
@@ -0,0 +1,569 @@
+'use client';
+
+// A grid component using the following libs as inspiration.
+//
+// For the implementation:
+// - https://getbootstrap.com/docs/4.3/layout/grid/
+// - https://github.com/kristoferjoseph/flexboxgrid/blob/master/src/css/flexboxgrid.css
+// - https://github.com/roylee0704/react-flexbox-grid
+// - https://material.angularjs.org/latest/layout/introduction
+//
+// Follow this flexbox Guide to better understand the underlying model:
+// - https://css-tricks.com/snippets/css/a-guide-to-flexbox/
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "columns", "columnSpacing", "component", "container", "direction", "item", "rowSpacing", "spacing", "wrap", "zeroMinWidth"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { handleBreakpoints, unstable_resolveBreakpointValues as resolveBreakpointValues } from '@mui/system';
+import { extendSxProp } from '@mui/system/styleFunctionSx';
+import composeClasses from '@mui/utils/composeClasses';
+import requirePropFactory from '../utils/requirePropFactory';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import useTheme from '../styles/useTheme';
+import GridContext from './GridContext';
+import gridClasses, { getGridUtilityClass } from './gridClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+function getOffset(val) {
+  const parse = parseFloat(val);
+  return `${parse}${String(val).replace(String(parse), '') || 'px'}`;
+}
+export function generateGrid({
+  theme,
+  ownerState
+}) {
+  let size;
+  return theme.breakpoints.keys.reduce((globalStyles, breakpoint) => {
+    // Use side effect over immutability for better performance.
+    let styles = {};
+    if (ownerState[breakpoint]) {
+      size = ownerState[breakpoint];
+    }
+    if (!size) {
+      return globalStyles;
+    }
+    if (size === true) {
+      // For the auto layouting
+      styles = {
+        flexBasis: 0,
+        flexGrow: 1,
+        maxWidth: '100%'
+      };
+    } else if (size === 'auto') {
+      styles = {
+        flexBasis: 'auto',
+        flexGrow: 0,
+        flexShrink: 0,
+        maxWidth: 'none',
+        width: 'auto'
+      };
+    } else {
+      const columnsBreakpointValues = resolveBreakpointValues({
+        values: ownerState.columns,
+        breakpoints: theme.breakpoints.values
+      });
+      const columnValue = typeof columnsBreakpointValues === 'object' ? columnsBreakpointValues[breakpoint] : columnsBreakpointValues;
+      if (columnValue === undefined || columnValue === null) {
+        return globalStyles;
+      }
+      // Keep 7 significant numbers.
+      const width = `${Math.round(size / columnValue * 10e7) / 10e5}%`;
+      let more = {};
+      if (ownerState.container && ownerState.item && ownerState.columnSpacing !== 0) {
+        const themeSpacing = theme.spacing(ownerState.columnSpacing);
+        if (themeSpacing !== '0px') {
+          const fullWidth = `calc(${width} + ${getOffset(themeSpacing)})`;
+          more = {
+            flexBasis: fullWidth,
+            maxWidth: fullWidth
+          };
+        }
+      }
+
+      // Close to the bootstrap implementation:
+      // https://github.com/twbs/bootstrap/blob/8fccaa2439e97ec72a4b7dc42ccc1f649790adb0/scss/mixins/_grid.scss#L41
+      styles = _extends({
+        flexBasis: width,
+        flexGrow: 0,
+        maxWidth: width
+      }, more);
+    }
+
+    // No need for a media query for the first size.
+    if (theme.breakpoints.values[breakpoint] === 0) {
+      Object.assign(globalStyles, styles);
+    } else {
+      globalStyles[theme.breakpoints.up(breakpoint)] = styles;
+    }
+    return globalStyles;
+  }, {});
+}
+export function generateDirection({
+  theme,
+  ownerState
+}) {
+  const directionValues = resolveBreakpointValues({
+    values: ownerState.direction,
+    breakpoints: theme.breakpoints.values
+  });
+  return handleBreakpoints({
+    theme
+  }, directionValues, propValue => {
+    const output = {
+      flexDirection: propValue
+    };
+    if (propValue.indexOf('column') === 0) {
+      output[`& > .${gridClasses.item}`] = {
+        maxWidth: 'none'
+      };
+    }
+    return output;
+  });
+}
+
+/**
+ * Extracts zero value breakpoint keys before a non-zero value breakpoint key.
+ * @example { xs: 0, sm: 0, md: 2, lg: 0, xl: 0 } or [0, 0, 2, 0, 0]
+ * @returns [xs, sm]
+ */
+function extractZeroValueBreakpointKeys({
+  breakpoints,
+  values
+}) {
+  let nonZeroKey = '';
+  Object.keys(values).forEach(key => {
+    if (nonZeroKey !== '') {
+      return;
+    }
+    if (values[key] !== 0) {
+      nonZeroKey = key;
+    }
+  });
+  const sortedBreakpointKeysByValue = Object.keys(breakpoints).sort((a, b) => {
+    return breakpoints[a] - breakpoints[b];
+  });
+  return sortedBreakpointKeysByValue.slice(0, sortedBreakpointKeysByValue.indexOf(nonZeroKey));
+}
+export function generateRowGap({
+  theme,
+  ownerState
+}) {
+  const {
+    container,
+    rowSpacing
+  } = ownerState;
+  let styles = {};
+  if (container && rowSpacing !== 0) {
+    const rowSpacingValues = resolveBreakpointValues({
+      values: rowSpacing,
+      breakpoints: theme.breakpoints.values
+    });
+    let zeroValueBreakpointKeys;
+    if (typeof rowSpacingValues === 'object') {
+      zeroValueBreakpointKeys = extractZeroValueBreakpointKeys({
+        breakpoints: theme.breakpoints.values,
+        values: rowSpacingValues
+      });
+    }
+    styles = handleBreakpoints({
+      theme
+    }, rowSpacingValues, (propValue, breakpoint) => {
+      var _zeroValueBreakpointK;
+      const themeSpacing = theme.spacing(propValue);
+      if (themeSpacing !== '0px') {
+        return {
+          marginTop: `-${getOffset(themeSpacing)}`,
+          [`& > .${gridClasses.item}`]: {
+            paddingTop: getOffset(themeSpacing)
+          }
+        };
+      }
+      if ((_zeroValueBreakpointK = zeroValueBreakpointKeys) != null && _zeroValueBreakpointK.includes(breakpoint)) {
+        return {};
+      }
+      return {
+        marginTop: 0,
+        [`& > .${gridClasses.item}`]: {
+          paddingTop: 0
+        }
+      };
+    });
+  }
+  return styles;
+}
+export function generateColumnGap({
+  theme,
+  ownerState
+}) {
+  const {
+    container,
+    columnSpacing
+  } = ownerState;
+  let styles = {};
+  if (container && columnSpacing !== 0) {
+    const columnSpacingValues = resolveBreakpointValues({
+      values: columnSpacing,
+      breakpoints: theme.breakpoints.values
+    });
+    let zeroValueBreakpointKeys;
+    if (typeof columnSpacingValues === 'object') {
+      zeroValueBreakpointKeys = extractZeroValueBreakpointKeys({
+        breakpoints: theme.breakpoints.values,
+        values: columnSpacingValues
+      });
+    }
+    styles = handleBreakpoints({
+      theme
+    }, columnSpacingValues, (propValue, breakpoint) => {
+      var _zeroValueBreakpointK2;
+      const themeSpacing = theme.spacing(propValue);
+      if (themeSpacing !== '0px') {
+        return {
+          width: `calc(100% + ${getOffset(themeSpacing)})`,
+          marginLeft: `-${getOffset(themeSpacing)}`,
+          [`& > .${gridClasses.item}`]: {
+            paddingLeft: getOffset(themeSpacing)
+          }
+        };
+      }
+      if ((_zeroValueBreakpointK2 = zeroValueBreakpointKeys) != null && _zeroValueBreakpointK2.includes(breakpoint)) {
+        return {};
+      }
+      return {
+        width: '100%',
+        marginLeft: 0,
+        [`& > .${gridClasses.item}`]: {
+          paddingLeft: 0
+        }
+      };
+    });
+  }
+  return styles;
+}
+export function resolveSpacingStyles(spacing, breakpoints, styles = {}) {
+  // undefined/null or `spacing` <= 0
+  if (!spacing || spacing <= 0) {
+    return [];
+  }
+  // in case of string/number `spacing`
+  if (typeof spacing === 'string' && !Number.isNaN(Number(spacing)) || typeof spacing === 'number') {
+    return [styles[`spacing-xs-${String(spacing)}`]];
+  }
+  // in case of object `spacing`
+  const spacingStyles = [];
+  breakpoints.forEach(breakpoint => {
+    const value = spacing[breakpoint];
+    if (Number(value) > 0) {
+      spacingStyles.push(styles[`spacing-${breakpoint}-${String(value)}`]);
+    }
+  });
+  return spacingStyles;
+}
+
+// Default CSS values
+// flex: '0 1 auto',
+// flexDirection: 'row',
+// alignItems: 'flex-start',
+// flexWrap: 'nowrap',
+// justifyContent: 'flex-start',
+const GridRoot = styled('div', {
+  name: 'MuiGrid',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    const {
+      container,
+      direction,
+      item,
+      spacing,
+      wrap,
+      zeroMinWidth,
+      breakpoints
+    } = ownerState;
+    let spacingStyles = [];
+
+    // in case of grid item
+    if (container) {
+      spacingStyles = resolveSpacingStyles(spacing, breakpoints, styles);
+    }
+    const breakpointsStyles = [];
+    breakpoints.forEach(breakpoint => {
+      const value = ownerState[breakpoint];
+      if (value) {
+        breakpointsStyles.push(styles[`grid-${breakpoint}-${String(value)}`]);
+      }
+    });
+    return [styles.root, container && styles.container, item && styles.item, zeroMinWidth && styles.zeroMinWidth, ...spacingStyles, direction !== 'row' && styles[`direction-xs-${String(direction)}`], wrap !== 'wrap' && styles[`wrap-xs-${String(wrap)}`], ...breakpointsStyles];
+  }
+})(({
+  ownerState
+}) => _extends({
+  boxSizing: 'border-box'
+}, ownerState.container && {
+  display: 'flex',
+  flexWrap: 'wrap',
+  width: '100%'
+}, ownerState.item && {
+  margin: 0 // For instance, it's useful when used with a `figure` element.
+}, ownerState.zeroMinWidth && {
+  minWidth: 0
+}, ownerState.wrap !== 'wrap' && {
+  flexWrap: ownerState.wrap
+}), generateDirection, generateRowGap, generateColumnGap, generateGrid);
+export function resolveSpacingClasses(spacing, breakpoints) {
+  // undefined/null or `spacing` <= 0
+  if (!spacing || spacing <= 0) {
+    return [];
+  }
+  // in case of string/number `spacing`
+  if (typeof spacing === 'string' && !Number.isNaN(Number(spacing)) || typeof spacing === 'number') {
+    return [`spacing-xs-${String(spacing)}`];
+  }
+  // in case of object `spacing`
+  const classes = [];
+  breakpoints.forEach(breakpoint => {
+    const value = spacing[breakpoint];
+    if (Number(value) > 0) {
+      const className = `spacing-${breakpoint}-${String(value)}`;
+      classes.push(className);
+    }
+  });
+  return classes;
+}
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    container,
+    direction,
+    item,
+    spacing,
+    wrap,
+    zeroMinWidth,
+    breakpoints
+  } = ownerState;
+  let spacingClasses = [];
+
+  // in case of grid item
+  if (container) {
+    spacingClasses = resolveSpacingClasses(spacing, breakpoints);
+  }
+  const breakpointsClasses = [];
+  breakpoints.forEach(breakpoint => {
+    const value = ownerState[breakpoint];
+    if (value) {
+      breakpointsClasses.push(`grid-${breakpoint}-${String(value)}`);
+    }
+  });
+  const slots = {
+    root: ['root', container && 'container', item && 'item', zeroMinWidth && 'zeroMinWidth', ...spacingClasses, direction !== 'row' && `direction-xs-${String(direction)}`, wrap !== 'wrap' && `wrap-xs-${String(wrap)}`, ...breakpointsClasses]
+  };
+  return composeClasses(slots, getGridUtilityClass, classes);
+};
+const Grid = /*#__PURE__*/React.forwardRef(function Grid(inProps, ref) {
+  const themeProps = useThemeProps({
+    props: inProps,
+    name: 'MuiGrid'
+  });
+  const {
+    breakpoints
+  } = useTheme();
+  const props = extendSxProp(themeProps);
+  const {
+      className,
+      columns: columnsProp,
+      columnSpacing: columnSpacingProp,
+      component = 'div',
+      container = false,
+      direction = 'row',
+      item = false,
+      rowSpacing: rowSpacingProp,
+      spacing = 0,
+      wrap = 'wrap',
+      zeroMinWidth = false
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const rowSpacing = rowSpacingProp || spacing;
+  const columnSpacing = columnSpacingProp || spacing;
+  const columnsContext = React.useContext(GridContext);
+
+  // columns set with default breakpoint unit of 12
+  const columns = container ? columnsProp || 12 : columnsContext;
+  const breakpointsValues = {};
+  const otherFiltered = _extends({}, other);
+  breakpoints.keys.forEach(breakpoint => {
+    if (other[breakpoint] != null) {
+      breakpointsValues[breakpoint] = other[breakpoint];
+      delete otherFiltered[breakpoint];
+    }
+  });
+  const ownerState = _extends({}, props, {
+    columns,
+    container,
+    direction,
+    item,
+    rowSpacing,
+    columnSpacing,
+    wrap,
+    zeroMinWidth,
+    spacing
+  }, breakpointsValues, {
+    breakpoints: breakpoints.keys
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(GridContext.Provider, {
+    value: columns,
+    children: /*#__PURE__*/_jsx(GridRoot, _extends({
+      ownerState: ownerState,
+      className: clsx(classes.root, className),
+      as: component,
+      ref: ref
+    }, otherFiltered))
+  });
+});
+process.env.NODE_ENV !== "production" ? Grid.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The number of columns.
+   * @default 12
+   */
+  columns: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.number, PropTypes.object]),
+  /**
+   * Defines the horizontal space between the type `item` components.
+   * It overrides the value of the `spacing` prop.
+   */
+  columnSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * If `true`, the component will have the flex *container* behavior.
+   * You should be wrapping *items* with a *container*.
+   * @default false
+   */
+  container: PropTypes.bool,
+  /**
+   * Defines the `flex-direction` style property.
+   * It is applied for all screen sizes.
+   * @default 'row'
+   */
+  direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
+  /**
+   * If `true`, the component will have the flex *item* behavior.
+   * You should be wrapping *items* with a *container*.
+   * @default false
+   */
+  item: PropTypes.bool,
+  /**
+   * If a number, it sets the number of columns the grid item uses.
+   * It can't be greater than the total number of columns of the container (12 by default).
+   * If 'auto', the grid item's width matches its content.
+   * If false, the prop is ignored.
+   * If true, the grid item's width grows to use the space available in the grid container.
+   * The value is applied for the `lg` breakpoint and wider screens if not overridden.
+   * @default false
+   */
+  lg: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
+  /**
+   * If a number, it sets the number of columns the grid item uses.
+   * It can't be greater than the total number of columns of the container (12 by default).
+   * If 'auto', the grid item's width matches its content.
+   * If false, the prop is ignored.
+   * If true, the grid item's width grows to use the space available in the grid container.
+   * The value is applied for the `md` breakpoint and wider screens if not overridden.
+   * @default false
+   */
+  md: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
+  /**
+   * Defines the vertical space between the type `item` components.
+   * It overrides the value of the `spacing` prop.
+   */
+  rowSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
+  /**
+   * If a number, it sets the number of columns the grid item uses.
+   * It can't be greater than the total number of columns of the container (12 by default).
+   * If 'auto', the grid item's width matches its content.
+   * If false, the prop is ignored.
+   * If true, the grid item's width grows to use the space available in the grid container.
+   * The value is applied for the `sm` breakpoint and wider screens if not overridden.
+   * @default false
+   */
+  sm: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
+  /**
+   * Defines the space between the type `item` components.
+   * It can only be used on a type `container` component.
+   * @default 0
+   */
+  spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * Defines the `flex-wrap` style property.
+   * It's applied for all screen sizes.
+   * @default 'wrap'
+   */
+  wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap']),
+  /**
+   * If a number, it sets the number of columns the grid item uses.
+   * It can't be greater than the total number of columns of the container (12 by default).
+   * If 'auto', the grid item's width matches its content.
+   * If false, the prop is ignored.
+   * If true, the grid item's width grows to use the space available in the grid container.
+   * The value is applied for the `xl` breakpoint and wider screens if not overridden.
+   * @default false
+   */
+  xl: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
+  /**
+   * If a number, it sets the number of columns the grid item uses.
+   * It can't be greater than the total number of columns of the container (12 by default).
+   * If 'auto', the grid item's width matches its content.
+   * If false, the prop is ignored.
+   * If true, the grid item's width grows to use the space available in the grid container.
+   * The value is applied for all the screen sizes with the lowest priority.
+   * @default false
+   */
+  xs: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
+  /**
+   * If `true`, it sets `min-width: 0` on the item.
+   * Refer to the limitations section of the documentation to better understand the use case.
+   * @default false
+   */
+  zeroMinWidth: PropTypes.bool
+} : void 0;
+if (process.env.NODE_ENV !== 'production') {
+  const requireProp = requirePropFactory('Grid', Grid);
+  // eslint-disable-next-line no-useless-concat
+  Grid['propTypes' + ''] = _extends({}, Grid.propTypes, {
+    direction: requireProp('container'),
+    lg: requireProp('item'),
+    md: requireProp('item'),
+    sm: requireProp('item'),
+    spacing: requireProp('container'),
+    wrap: requireProp('container'),
+    xs: requireProp('item'),
+    zeroMinWidth: requireProp('item')
+  });
+}
+export default Grid;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Grid/GridContext.js b/ddb_main/node_modules/@mui/material/Grid/GridContext.js
new file mode 100644
index 0000000..9a76ccd
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Grid/GridContext.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+
+/**
+ * @ignore - internal component.
+ */
+const GridContext = /*#__PURE__*/React.createContext();
+if (process.env.NODE_ENV !== 'production') {
+  GridContext.displayName = 'GridContext';
+}
+export default GridContext;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Grid/gridClasses.js b/ddb_main/node_modules/@mui/material/Grid/gridClasses.js
new file mode 100644
index 0000000..838d3ac
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Grid/gridClasses.js
@@ -0,0 +1,19 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getGridUtilityClass(slot) {
+  return generateUtilityClass('MuiGrid', slot);
+}
+const SPACINGS = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
+const DIRECTIONS = ['column-reverse', 'column', 'row-reverse', 'row'];
+const WRAPS = ['nowrap', 'wrap-reverse', 'wrap'];
+const GRID_SIZES = ['auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
+const gridClasses = generateUtilityClasses('MuiGrid', ['root', 'container', 'item', 'zeroMinWidth',
+// spacings
+...SPACINGS.map(spacing => `spacing-xs-${spacing}`),
+// direction values
+...DIRECTIONS.map(direction => `direction-xs-${direction}`),
+// wrap values
+...WRAPS.map(wrap => `wrap-xs-${wrap}`),
+// grid sizes for all breakpoints
+...GRID_SIZES.map(size => `grid-xs-${size}`), ...GRID_SIZES.map(size => `grid-sm-${size}`), ...GRID_SIZES.map(size => `grid-md-${size}`), ...GRID_SIZES.map(size => `grid-lg-${size}`), ...GRID_SIZES.map(size => `grid-xl-${size}`)]);
+export default gridClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Grow/Grow.js b/ddb_main/node_modules/@mui/material/Grow/Grow.js
new file mode 100644
index 0000000..2bd33b7
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Grow/Grow.js
@@ -0,0 +1,255 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["addEndListener", "appear", "children", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "style", "timeout", "TransitionComponent"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import useTimeout from '@mui/utils/useTimeout';
+import elementAcceptingRef from '@mui/utils/elementAcceptingRef';
+import { Transition } from 'react-transition-group';
+import useTheme from '../styles/useTheme';
+import { getTransitionProps, reflow } from '../transitions/utils';
+import useForkRef from '../utils/useForkRef';
+import { jsx as _jsx } from "react/jsx-runtime";
+function getScale(value) {
+  return `scale(${value}, ${value ** 2})`;
+}
+const styles = {
+  entering: {
+    opacity: 1,
+    transform: getScale(1)
+  },
+  entered: {
+    opacity: 1,
+    transform: 'none'
+  }
+};
+
+/*
+ TODO v6: remove
+ Conditionally apply a workaround for the CSS transition bug in Safari 15.4 / WebKit browsers.
+ */
+const isWebKit154 = typeof navigator !== 'undefined' && /^((?!chrome|android).)*(safari|mobile)/i.test(navigator.userAgent) && /(os |version\/)15(.|_)4/i.test(navigator.userAgent);
+
+/**
+ * The Grow transition is used by the [Tooltip](/material-ui/react-tooltip/) and
+ * [Popover](/material-ui/react-popover/) components.
+ * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.
+ */
+const Grow = /*#__PURE__*/React.forwardRef(function Grow(props, ref) {
+  const {
+      addEndListener,
+      appear = true,
+      children,
+      easing,
+      in: inProp,
+      onEnter,
+      onEntered,
+      onEntering,
+      onExit,
+      onExited,
+      onExiting,
+      style,
+      timeout = 'auto',
+      // eslint-disable-next-line react/prop-types
+      TransitionComponent = Transition
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const timer = useTimeout();
+  const autoTimeout = React.useRef();
+  const theme = useTheme();
+  const nodeRef = React.useRef(null);
+  const handleRef = useForkRef(nodeRef, children.ref, ref);
+  const normalizedTransitionCallback = callback => maybeIsAppearing => {
+    if (callback) {
+      const node = nodeRef.current;
+
+      // onEnterXxx and onExitXxx callbacks have a different arguments.length value.
+      if (maybeIsAppearing === undefined) {
+        callback(node);
+      } else {
+        callback(node, maybeIsAppearing);
+      }
+    }
+  };
+  const handleEntering = normalizedTransitionCallback(onEntering);
+  const handleEnter = normalizedTransitionCallback((node, isAppearing) => {
+    reflow(node); // So the animation always start from the start.
+
+    const {
+      duration: transitionDuration,
+      delay,
+      easing: transitionTimingFunction
+    } = getTransitionProps({
+      style,
+      timeout,
+      easing
+    }, {
+      mode: 'enter'
+    });
+    let duration;
+    if (timeout === 'auto') {
+      duration = theme.transitions.getAutoHeightDuration(node.clientHeight);
+      autoTimeout.current = duration;
+    } else {
+      duration = transitionDuration;
+    }
+    node.style.transition = [theme.transitions.create('opacity', {
+      duration,
+      delay
+    }), theme.transitions.create('transform', {
+      duration: isWebKit154 ? duration : duration * 0.666,
+      delay,
+      easing: transitionTimingFunction
+    })].join(',');
+    if (onEnter) {
+      onEnter(node, isAppearing);
+    }
+  });
+  const handleEntered = normalizedTransitionCallback(onEntered);
+  const handleExiting = normalizedTransitionCallback(onExiting);
+  const handleExit = normalizedTransitionCallback(node => {
+    const {
+      duration: transitionDuration,
+      delay,
+      easing: transitionTimingFunction
+    } = getTransitionProps({
+      style,
+      timeout,
+      easing
+    }, {
+      mode: 'exit'
+    });
+    let duration;
+    if (timeout === 'auto') {
+      duration = theme.transitions.getAutoHeightDuration(node.clientHeight);
+      autoTimeout.current = duration;
+    } else {
+      duration = transitionDuration;
+    }
+    node.style.transition = [theme.transitions.create('opacity', {
+      duration,
+      delay
+    }), theme.transitions.create('transform', {
+      duration: isWebKit154 ? duration : duration * 0.666,
+      delay: isWebKit154 ? delay : delay || duration * 0.333,
+      easing: transitionTimingFunction
+    })].join(',');
+    node.style.opacity = 0;
+    node.style.transform = getScale(0.75);
+    if (onExit) {
+      onExit(node);
+    }
+  });
+  const handleExited = normalizedTransitionCallback(onExited);
+  const handleAddEndListener = next => {
+    if (timeout === 'auto') {
+      timer.start(autoTimeout.current || 0, next);
+    }
+    if (addEndListener) {
+      // Old call signature before `react-transition-group` implemented `nodeRef`
+      addEndListener(nodeRef.current, next);
+    }
+  };
+  return /*#__PURE__*/_jsx(TransitionComponent, _extends({
+    appear: appear,
+    in: inProp,
+    nodeRef: nodeRef,
+    onEnter: handleEnter,
+    onEntered: handleEntered,
+    onEntering: handleEntering,
+    onExit: handleExit,
+    onExited: handleExited,
+    onExiting: handleExiting,
+    addEndListener: handleAddEndListener,
+    timeout: timeout === 'auto' ? null : timeout
+  }, other, {
+    children: (state, childProps) => {
+      return /*#__PURE__*/React.cloneElement(children, _extends({
+        style: _extends({
+          opacity: 0,
+          transform: getScale(0.75),
+          visibility: state === 'exited' && !inProp ? 'hidden' : undefined
+        }, styles[state], style, children.props.style),
+        ref: handleRef
+      }, childProps));
+    }
+  }));
+});
+process.env.NODE_ENV !== "production" ? Grow.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Add a custom transition end trigger. Called with the transitioning DOM
+   * node and a done callback. Allows for more fine grained transition end
+   * logic. Note: Timeouts are still used as a fallback if provided.
+   */
+  addEndListener: PropTypes.func,
+  /**
+   * Perform the enter transition when it first mounts if `in` is also `true`.
+   * Set this to `false` to disable this behavior.
+   * @default true
+   */
+  appear: PropTypes.bool,
+  /**
+   * A single child content element.
+   */
+  children: elementAcceptingRef.isRequired,
+  /**
+   * The transition timing function.
+   * You may specify a single easing or a object containing enter and exit values.
+   */
+  easing: PropTypes.oneOfType([PropTypes.shape({
+    enter: PropTypes.string,
+    exit: PropTypes.string
+  }), PropTypes.string]),
+  /**
+   * If `true`, the component will transition in.
+   */
+  in: PropTypes.bool,
+  /**
+   * @ignore
+   */
+  onEnter: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onEntered: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onEntering: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onExit: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onExited: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onExiting: PropTypes.func,
+  /**
+   * @ignore
+   */
+  style: PropTypes.object,
+  /**
+   * The duration for the transition, in milliseconds.
+   * You may specify a single timeout for all transitions, or individually with an object.
+   *
+   * Set to 'auto' to automatically calculate transition time based on height.
+   * @default 'auto'
+   */
+  timeout: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.shape({
+    appear: PropTypes.number,
+    enter: PropTypes.number,
+    exit: PropTypes.number
+  })])
+} : void 0;
+Grow.muiSupportAuto = true;
+export default Grow;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/IconButton/IconButton.js b/ddb_main/node_modules/@mui/material/IconButton/IconButton.js
new file mode 100644
index 0000000..af782f8
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/IconButton/IconButton.js
@@ -0,0 +1,205 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["edge", "children", "className", "color", "disabled", "disableFocusRipple", "size"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import chainPropTypes from '@mui/utils/chainPropTypes';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha } from '@mui/system/colorManipulator';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import ButtonBase from '../ButtonBase';
+import capitalize from '../utils/capitalize';
+import iconButtonClasses, { getIconButtonUtilityClass } from './iconButtonClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    disabled,
+    color,
+    edge,
+    size
+  } = ownerState;
+  const slots = {
+    root: ['root', disabled && 'disabled', color !== 'default' && `color${capitalize(color)}`, edge && `edge${capitalize(edge)}`, `size${capitalize(size)}`]
+  };
+  return composeClasses(slots, getIconButtonUtilityClass, classes);
+};
+const IconButtonRoot = styled(ButtonBase, {
+  name: 'MuiIconButton',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.color !== 'default' && styles[`color${capitalize(ownerState.color)}`], ownerState.edge && styles[`edge${capitalize(ownerState.edge)}`], styles[`size${capitalize(ownerState.size)}`]];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  textAlign: 'center',
+  flex: '0 0 auto',
+  fontSize: theme.typography.pxToRem(24),
+  padding: 8,
+  borderRadius: '50%',
+  overflow: 'visible',
+  // Explicitly set the default value to solve a bug on IE11.
+  color: (theme.vars || theme).palette.action.active,
+  transition: theme.transitions.create('background-color', {
+    duration: theme.transitions.duration.shortest
+  })
+}, !ownerState.disableRipple && {
+  '&:hover': {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.activeChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.action.active, theme.palette.action.hoverOpacity),
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      backgroundColor: 'transparent'
+    }
+  }
+}, ownerState.edge === 'start' && {
+  marginLeft: ownerState.size === 'small' ? -3 : -12
+}, ownerState.edge === 'end' && {
+  marginRight: ownerState.size === 'small' ? -3 : -12
+}), ({
+  theme,
+  ownerState
+}) => {
+  var _palette;
+  const palette = (_palette = (theme.vars || theme).palette) == null ? void 0 : _palette[ownerState.color];
+  return _extends({}, ownerState.color === 'inherit' && {
+    color: 'inherit'
+  }, ownerState.color !== 'inherit' && ownerState.color !== 'default' && _extends({
+    color: palette == null ? void 0 : palette.main
+  }, !ownerState.disableRipple && {
+    '&:hover': _extends({}, palette && {
+      backgroundColor: theme.vars ? `rgba(${palette.mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(palette.main, theme.palette.action.hoverOpacity)
+    }, {
+      // Reset on touch devices, it doesn't add specificity
+      '@media (hover: none)': {
+        backgroundColor: 'transparent'
+      }
+    })
+  }), ownerState.size === 'small' && {
+    padding: 5,
+    fontSize: theme.typography.pxToRem(18)
+  }, ownerState.size === 'large' && {
+    padding: 12,
+    fontSize: theme.typography.pxToRem(28)
+  }, {
+    [`&.${iconButtonClasses.disabled}`]: {
+      backgroundColor: 'transparent',
+      color: (theme.vars || theme).palette.action.disabled
+    }
+  });
+});
+
+/**
+ * Refer to the [Icons](/material-ui/icons/) section of the documentation
+ * regarding the available icon options.
+ */
+const IconButton = /*#__PURE__*/React.forwardRef(function IconButton(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiIconButton'
+  });
+  const {
+      edge = false,
+      children,
+      className,
+      color = 'default',
+      disabled = false,
+      disableFocusRipple = false,
+      size = 'medium'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    edge,
+    color,
+    disabled,
+    disableFocusRipple,
+    size
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(IconButtonRoot, _extends({
+    className: clsx(classes.root, className),
+    centerRipple: true,
+    focusRipple: !disableFocusRipple,
+    disabled: disabled,
+    ref: ref
+  }, other, {
+    ownerState: ownerState,
+    children: children
+  }));
+});
+process.env.NODE_ENV !== "production" ? IconButton.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The icon to display.
+   */
+  children: chainPropTypes(PropTypes.node, props => {
+    const found = React.Children.toArray(props.children).some(child => /*#__PURE__*/React.isValidElement(child) && child.props.onClick);
+    if (found) {
+      return new Error(['MUI: You are providing an onClick event listener to a child of a button element.', 'Prefer applying it to the IconButton directly.', 'This guarantees that the whole <button> will be responsive to click events.'].join('\n'));
+    }
+    return null;
+  }),
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'default'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'default', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: PropTypes.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   *
+   * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
+   * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
+   * @default false
+   */
+  disableRipple: PropTypes.bool,
+  /**
+   * If given, uses a negative margin to counteract the padding on one
+   * side (this is often helpful for aligning the left or right
+   * side of the icon with content above or below, without ruining the border
+   * size and shape).
+   * @default false
+   */
+  edge: PropTypes.oneOf(['end', 'start', false]),
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense button styling.
+   * @default 'medium'
+   */
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['small', 'medium', 'large']), PropTypes.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default IconButton;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/IconButton/iconButtonClasses.js b/ddb_main/node_modules/@mui/material/IconButton/iconButtonClasses.js
new file mode 100644
index 0000000..9813ba7
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/IconButton/iconButtonClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getIconButtonUtilityClass(slot) {
+  return generateUtilityClass('MuiIconButton', slot);
+}
+const iconButtonClasses = generateUtilityClasses('MuiIconButton', ['root', 'disabled', 'colorInherit', 'colorPrimary', 'colorSecondary', 'colorError', 'colorInfo', 'colorSuccess', 'colorWarning', 'edgeStart', 'edgeEnd', 'sizeSmall', 'sizeMedium', 'sizeLarge']);
+export default iconButtonClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Input/Input.js b/ddb_main/node_modules/@mui/material/Input/Input.js
new file mode 100644
index 0000000..0cdfa37
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Input/Input.js
@@ -0,0 +1,342 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["disableUnderline", "components", "componentsProps", "fullWidth", "inputComponent", "multiline", "slotProps", "slots", "type"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import composeClasses from '@mui/utils/composeClasses';
+import deepmerge from '@mui/utils/deepmerge';
+import refType from '@mui/utils/refType';
+import InputBase from '../InputBase';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import inputClasses, { getInputUtilityClass } from './inputClasses';
+import { rootOverridesResolver as inputBaseRootOverridesResolver, inputOverridesResolver as inputBaseInputOverridesResolver, InputBaseRoot, InputBaseComponent as InputBaseInput } from '../InputBase/InputBase';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    disableUnderline
+  } = ownerState;
+  const slots = {
+    root: ['root', !disableUnderline && 'underline'],
+    input: ['input']
+  };
+  const composedClasses = composeClasses(slots, getInputUtilityClass, classes);
+  return _extends({}, classes, composedClasses);
+};
+const InputRoot = styled(InputBaseRoot, {
+  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
+  name: 'MuiInput',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [...inputBaseRootOverridesResolver(props, styles), !ownerState.disableUnderline && styles.underline];
+  }
+})(({
+  theme,
+  ownerState
+}) => {
+  const light = theme.palette.mode === 'light';
+  let bottomLineColor = light ? 'rgba(0, 0, 0, 0.42)' : 'rgba(255, 255, 255, 0.7)';
+  if (theme.vars) {
+    bottomLineColor = `rgba(${theme.vars.palette.common.onBackgroundChannel} / ${theme.vars.opacity.inputUnderline})`;
+  }
+  return _extends({
+    position: 'relative'
+  }, ownerState.formControl && {
+    'label + &': {
+      marginTop: 16
+    }
+  }, !ownerState.disableUnderline && {
+    '&::after': {
+      borderBottom: `2px solid ${(theme.vars || theme).palette[ownerState.color].main}`,
+      left: 0,
+      bottom: 0,
+      // Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
+      content: '""',
+      position: 'absolute',
+      right: 0,
+      transform: 'scaleX(0)',
+      transition: theme.transitions.create('transform', {
+        duration: theme.transitions.duration.shorter,
+        easing: theme.transitions.easing.easeOut
+      }),
+      pointerEvents: 'none' // Transparent to the hover style.
+    },
+    [`&.${inputClasses.focused}:after`]: {
+      // translateX(0) is a workaround for Safari transform scale bug
+      // See https://github.com/mui/material-ui/issues/31766
+      transform: 'scaleX(1) translateX(0)'
+    },
+    [`&.${inputClasses.error}`]: {
+      '&::before, &::after': {
+        borderBottomColor: (theme.vars || theme).palette.error.main
+      }
+    },
+    '&::before': {
+      borderBottom: `1px solid ${bottomLineColor}`,
+      left: 0,
+      bottom: 0,
+      // Doing the other way around crash on IE11 "''" https://github.com/cssinjs/jss/issues/242
+      content: '"\\00a0"',
+      position: 'absolute',
+      right: 0,
+      transition: theme.transitions.create('border-bottom-color', {
+        duration: theme.transitions.duration.shorter
+      }),
+      pointerEvents: 'none' // Transparent to the hover style.
+    },
+    [`&:hover:not(.${inputClasses.disabled}, .${inputClasses.error}):before`]: {
+      borderBottom: `2px solid ${(theme.vars || theme).palette.text.primary}`,
+      // Reset on touch devices, it doesn't add specificity
+      '@media (hover: none)': {
+        borderBottom: `1px solid ${bottomLineColor}`
+      }
+    },
+    [`&.${inputClasses.disabled}:before`]: {
+      borderBottomStyle: 'dotted'
+    }
+  });
+});
+const InputInput = styled(InputBaseInput, {
+  name: 'MuiInput',
+  slot: 'Input',
+  overridesResolver: inputBaseInputOverridesResolver
+})({});
+const Input = /*#__PURE__*/React.forwardRef(function Input(inProps, ref) {
+  var _ref, _slots$root, _ref2, _slots$input;
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiInput'
+  });
+  const {
+      disableUnderline,
+      components = {},
+      componentsProps: componentsPropsProp,
+      fullWidth = false,
+      inputComponent = 'input',
+      multiline = false,
+      slotProps,
+      slots = {},
+      type = 'text'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const classes = useUtilityClasses(props);
+  const ownerState = {
+    disableUnderline
+  };
+  const inputComponentsProps = {
+    root: {
+      ownerState
+    }
+  };
+  const componentsProps = (slotProps != null ? slotProps : componentsPropsProp) ? deepmerge(slotProps != null ? slotProps : componentsPropsProp, inputComponentsProps) : inputComponentsProps;
+  const RootSlot = (_ref = (_slots$root = slots.root) != null ? _slots$root : components.Root) != null ? _ref : InputRoot;
+  const InputSlot = (_ref2 = (_slots$input = slots.input) != null ? _slots$input : components.Input) != null ? _ref2 : InputInput;
+  return /*#__PURE__*/_jsx(InputBase, _extends({
+    slots: {
+      root: RootSlot,
+      input: InputSlot
+    },
+    slotProps: componentsProps,
+    fullWidth: fullWidth,
+    inputComponent: inputComponent,
+    multiline: multiline,
+    ref: ref,
+    type: type
+  }, other, {
+    classes: classes
+  }));
+});
+process.env.NODE_ENV !== "production" ? Input.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * This prop helps users to fill forms faster, especially on mobile devices.
+   * The name can be confusing, as it's more like an autofill.
+   * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).
+   */
+  autoComplete: PropTypes.string,
+  /**
+   * If `true`, the `input` element is focused during the first mount.
+   */
+  autoFocus: PropTypes.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * The prop defaults to the value (`'primary'`) inherited from the parent FormControl component.
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['primary', 'secondary']), PropTypes.string]),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `slots` prop.
+   * It's recommended to use the `slots` prop instead.
+   *
+   * @default {}
+   */
+  components: PropTypes.shape({
+    Input: PropTypes.elementType,
+    Root: PropTypes.elementType
+  }),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `slotProps` prop.
+   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   *
+   * @default {}
+   */
+  componentsProps: PropTypes.shape({
+    input: PropTypes.object,
+    root: PropTypes.object
+  }),
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue: PropTypes.any,
+  /**
+   * If `true`, the component is disabled.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the `input` will not have an underline.
+   */
+  disableUnderline: PropTypes.bool,
+  /**
+   * End `InputAdornment` for this component.
+   */
+  endAdornment: PropTypes.node,
+  /**
+   * If `true`, the `input` will indicate an error.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  error: PropTypes.bool,
+  /**
+   * If `true`, the `input` will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: PropTypes.bool,
+  /**
+   * The id of the `input` element.
+   */
+  id: PropTypes.string,
+  /**
+   * The component used for the `input` element.
+   * Either a string to use a HTML element or a component.
+   * @default 'input'
+   */
+  inputComponent: PropTypes.elementType,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   * @default {}
+   */
+  inputProps: PropTypes.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: refType,
+  /**
+   * If `dense`, will adjust vertical spacing. This is normally obtained via context from
+   * FormControl.
+   * The prop defaults to the value (`'none'`) inherited from the parent FormControl component.
+   */
+  margin: PropTypes.oneOf(['dense', 'none']),
+  /**
+   * Maximum number of rows to display when multiline option is set to true.
+   */
+  maxRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * Minimum number of rows to display when multiline option is set to true.
+   */
+  minRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered.
+   * @default false
+   */
+  multiline: PropTypes.bool,
+  /**
+   * Name attribute of the `input` element.
+   */
+  name: PropTypes.string,
+  /**
+   * Callback fired when the value is changed.
+   *
+   * @param {React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   */
+  onChange: PropTypes.func,
+  /**
+   * The short hint displayed in the `input` before the user enters a value.
+   */
+  placeholder: PropTypes.string,
+  /**
+   * It prevents the user from changing the value of the field
+   * (not from interacting with the field).
+   */
+  readOnly: PropTypes.bool,
+  /**
+   * If `true`, the `input` element is required.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  required: PropTypes.bool,
+  /**
+   * Number of rows to display when multiline option is set to true.
+   */
+  rows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    input: PropTypes.object,
+    root: PropTypes.object
+  }),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `components` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    input: PropTypes.elementType,
+    root: PropTypes.elementType
+  }),
+  /**
+   * Start `InputAdornment` for this component.
+   */
+  startAdornment: PropTypes.node,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).
+   * @default 'text'
+   */
+  type: PropTypes.string,
+  /**
+   * The value of the `input` element, required for a controlled component.
+   */
+  value: PropTypes.any
+} : void 0;
+Input.muiName = 'Input';
+export default Input;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Input/inputClasses.js b/ddb_main/node_modules/@mui/material/Input/inputClasses.js
new file mode 100644
index 0000000..1c1902e
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Input/inputClasses.js
@@ -0,0 +1,9 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import { inputBaseClasses } from '../InputBase';
+export function getInputUtilityClass(slot) {
+  return generateUtilityClass('MuiInput', slot);
+}
+const inputClasses = _extends({}, inputBaseClasses, generateUtilityClasses('MuiInput', ['root', 'underline', 'input']));
+export default inputClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/InputBase/InputBase.js b/ddb_main/node_modules/@mui/material/InputBase/InputBase.js
new file mode 100644
index 0000000..ce431e4
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/InputBase/InputBase.js
@@ -0,0 +1,710 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
+const _excluded = ["aria-describedby", "autoComplete", "autoFocus", "className", "color", "components", "componentsProps", "defaultValue", "disabled", "disableInjectingGlobalStyles", "endAdornment", "error", "fullWidth", "id", "inputComponent", "inputProps", "inputRef", "margin", "maxRows", "minRows", "multiline", "name", "onBlur", "onChange", "onClick", "onFocus", "onKeyDown", "onKeyUp", "placeholder", "readOnly", "renderSuffix", "rows", "size", "slotProps", "slots", "startAdornment", "type", "value"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import elementTypeAcceptingRef from '@mui/utils/elementTypeAcceptingRef';
+import refType from '@mui/utils/refType';
+import { TextareaAutosize } from '@mui/base';
+import { isHostComponent } from '@mui/base/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import formControlState from '../FormControl/formControlState';
+import FormControlContext from '../FormControl/FormControlContext';
+import useFormControl from '../FormControl/useFormControl';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import capitalize from '../utils/capitalize';
+import useForkRef from '../utils/useForkRef';
+import useEnhancedEffect from '../utils/useEnhancedEffect';
+import GlobalStyles from '../GlobalStyles';
+import { isFilled } from './utils';
+import inputBaseClasses, { getInputBaseUtilityClass } from './inputBaseClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export const rootOverridesResolver = (props, styles) => {
+  const {
+    ownerState
+  } = props;
+  return [styles.root, ownerState.formControl && styles.formControl, ownerState.startAdornment && styles.adornedStart, ownerState.endAdornment && styles.adornedEnd, ownerState.error && styles.error, ownerState.size === 'small' && styles.sizeSmall, ownerState.multiline && styles.multiline, ownerState.color && styles[`color${capitalize(ownerState.color)}`], ownerState.fullWidth && styles.fullWidth, ownerState.hiddenLabel && styles.hiddenLabel];
+};
+export const inputOverridesResolver = (props, styles) => {
+  const {
+    ownerState
+  } = props;
+  return [styles.input, ownerState.size === 'small' && styles.inputSizeSmall, ownerState.multiline && styles.inputMultiline, ownerState.type === 'search' && styles.inputTypeSearch, ownerState.startAdornment && styles.inputAdornedStart, ownerState.endAdornment && styles.inputAdornedEnd, ownerState.hiddenLabel && styles.inputHiddenLabel];
+};
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    color,
+    disabled,
+    error,
+    endAdornment,
+    focused,
+    formControl,
+    fullWidth,
+    hiddenLabel,
+    multiline,
+    readOnly,
+    size,
+    startAdornment,
+    type
+  } = ownerState;
+  const slots = {
+    root: ['root', `color${capitalize(color)}`, disabled && 'disabled', error && 'error', fullWidth && 'fullWidth', focused && 'focused', formControl && 'formControl', size && size !== 'medium' && `size${capitalize(size)}`, multiline && 'multiline', startAdornment && 'adornedStart', endAdornment && 'adornedEnd', hiddenLabel && 'hiddenLabel', readOnly && 'readOnly'],
+    input: ['input', disabled && 'disabled', type === 'search' && 'inputTypeSearch', multiline && 'inputMultiline', size === 'small' && 'inputSizeSmall', hiddenLabel && 'inputHiddenLabel', startAdornment && 'inputAdornedStart', endAdornment && 'inputAdornedEnd', readOnly && 'readOnly']
+  };
+  return composeClasses(slots, getInputBaseUtilityClass, classes);
+};
+export const InputBaseRoot = styled('div', {
+  name: 'MuiInputBase',
+  slot: 'Root',
+  overridesResolver: rootOverridesResolver
+})(({
+  theme,
+  ownerState
+}) => _extends({}, theme.typography.body1, {
+  color: (theme.vars || theme).palette.text.primary,
+  lineHeight: '1.4375em',
+  // 23px
+  boxSizing: 'border-box',
+  // Prevent padding issue with fullWidth.
+  position: 'relative',
+  cursor: 'text',
+  display: 'inline-flex',
+  alignItems: 'center',
+  [`&.${inputBaseClasses.disabled}`]: {
+    color: (theme.vars || theme).palette.text.disabled,
+    cursor: 'default'
+  }
+}, ownerState.multiline && _extends({
+  padding: '4px 0 5px'
+}, ownerState.size === 'small' && {
+  paddingTop: 1
+}), ownerState.fullWidth && {
+  width: '100%'
+}));
+export const InputBaseComponent = styled('input', {
+  name: 'MuiInputBase',
+  slot: 'Input',
+  overridesResolver: inputOverridesResolver
+})(({
+  theme,
+  ownerState
+}) => {
+  const light = theme.palette.mode === 'light';
+  const placeholder = _extends({
+    color: 'currentColor'
+  }, theme.vars ? {
+    opacity: theme.vars.opacity.inputPlaceholder
+  } : {
+    opacity: light ? 0.42 : 0.5
+  }, {
+    transition: theme.transitions.create('opacity', {
+      duration: theme.transitions.duration.shorter
+    })
+  });
+  const placeholderHidden = {
+    opacity: '0 !important'
+  };
+  const placeholderVisible = theme.vars ? {
+    opacity: theme.vars.opacity.inputPlaceholder
+  } : {
+    opacity: light ? 0.42 : 0.5
+  };
+  return _extends({
+    font: 'inherit',
+    letterSpacing: 'inherit',
+    color: 'currentColor',
+    padding: '4px 0 5px',
+    border: 0,
+    boxSizing: 'content-box',
+    background: 'none',
+    height: '1.4375em',
+    // Reset 23pxthe native input line-height
+    margin: 0,
+    // Reset for Safari
+    WebkitTapHighlightColor: 'transparent',
+    display: 'block',
+    // Make the flex item shrink with Firefox
+    minWidth: 0,
+    width: '100%',
+    // Fix IE11 width issue
+    animationName: 'mui-auto-fill-cancel',
+    animationDuration: '10ms',
+    '&::-webkit-input-placeholder': placeholder,
+    '&::-moz-placeholder': placeholder,
+    // Firefox 19+
+    '&:-ms-input-placeholder': placeholder,
+    // IE11
+    '&::-ms-input-placeholder': placeholder,
+    // Edge
+    '&:focus': {
+      outline: 0
+    },
+    // Reset Firefox invalid required input style
+    '&:invalid': {
+      boxShadow: 'none'
+    },
+    '&::-webkit-search-decoration': {
+      // Remove the padding when type=search.
+      WebkitAppearance: 'none'
+    },
+    // Show and hide the placeholder logic
+    [`label[data-shrink=false] + .${inputBaseClasses.formControl} &`]: {
+      '&::-webkit-input-placeholder': placeholderHidden,
+      '&::-moz-placeholder': placeholderHidden,
+      // Firefox 19+
+      '&:-ms-input-placeholder': placeholderHidden,
+      // IE11
+      '&::-ms-input-placeholder': placeholderHidden,
+      // Edge
+      '&:focus::-webkit-input-placeholder': placeholderVisible,
+      '&:focus::-moz-placeholder': placeholderVisible,
+      // Firefox 19+
+      '&:focus:-ms-input-placeholder': placeholderVisible,
+      // IE11
+      '&:focus::-ms-input-placeholder': placeholderVisible // Edge
+    },
+    [`&.${inputBaseClasses.disabled}`]: {
+      opacity: 1,
+      // Reset iOS opacity
+      WebkitTextFillColor: (theme.vars || theme).palette.text.disabled // Fix opacity Safari bug
+    },
+    '&:-webkit-autofill': {
+      animationDuration: '5000s',
+      animationName: 'mui-auto-fill'
+    }
+  }, ownerState.size === 'small' && {
+    paddingTop: 1
+  }, ownerState.multiline && {
+    height: 'auto',
+    resize: 'none',
+    padding: 0,
+    paddingTop: 0
+  }, ownerState.type === 'search' && {
+    // Improve type search style.
+    MozAppearance: 'textfield'
+  });
+});
+const inputGlobalStyles = /*#__PURE__*/_jsx(GlobalStyles, {
+  styles: {
+    '@keyframes mui-auto-fill': {
+      from: {
+        display: 'block'
+      }
+    },
+    '@keyframes mui-auto-fill-cancel': {
+      from: {
+        display: 'block'
+      }
+    }
+  }
+});
+
+/**
+ * `InputBase` contains as few styles as possible.
+ * It aims to be a simple building block for creating an input.
+ * It contains a load of style reset and some state logic.
+ */
+const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref) {
+  var _slotProps$input;
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiInputBase'
+  });
+  const {
+      'aria-describedby': ariaDescribedby,
+      autoComplete,
+      autoFocus,
+      className,
+      components = {},
+      componentsProps = {},
+      defaultValue,
+      disabled,
+      disableInjectingGlobalStyles,
+      endAdornment,
+      fullWidth = false,
+      id,
+      inputComponent = 'input',
+      inputProps: inputPropsProp = {},
+      inputRef: inputRefProp,
+      maxRows,
+      minRows,
+      multiline = false,
+      name,
+      onBlur,
+      onChange,
+      onClick,
+      onFocus,
+      onKeyDown,
+      onKeyUp,
+      placeholder,
+      readOnly,
+      renderSuffix,
+      rows,
+      slotProps = {},
+      slots = {},
+      startAdornment,
+      type = 'text',
+      value: valueProp
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const value = inputPropsProp.value != null ? inputPropsProp.value : valueProp;
+  const {
+    current: isControlled
+  } = React.useRef(value != null);
+  const inputRef = React.useRef();
+  const handleInputRefWarning = React.useCallback(instance => {
+    if (process.env.NODE_ENV !== 'production') {
+      if (instance && instance.nodeName !== 'INPUT' && !instance.focus) {
+        console.error(['MUI: You have provided a `inputComponent` to the input component', 'that does not correctly handle the `ref` prop.', 'Make sure the `ref` prop is called with a HTMLInputElement.'].join('\n'));
+      }
+    }
+  }, []);
+  const handleInputRef = useForkRef(inputRef, inputRefProp, inputPropsProp.ref, handleInputRefWarning);
+  const [focused, setFocused] = React.useState(false);
+  const muiFormControl = useFormControl();
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useEffect(() => {
+      if (muiFormControl) {
+        return muiFormControl.registerEffect();
+      }
+      return undefined;
+    }, [muiFormControl]);
+  }
+  const fcs = formControlState({
+    props,
+    muiFormControl,
+    states: ['color', 'disabled', 'error', 'hiddenLabel', 'size', 'required', 'filled']
+  });
+  fcs.focused = muiFormControl ? muiFormControl.focused : focused;
+
+  // The blur won't fire when the disabled state is set on a focused input.
+  // We need to book keep the focused state manually.
+  React.useEffect(() => {
+    if (!muiFormControl && disabled && focused) {
+      setFocused(false);
+      if (onBlur) {
+        onBlur();
+      }
+    }
+  }, [muiFormControl, disabled, focused, onBlur]);
+  const onFilled = muiFormControl && muiFormControl.onFilled;
+  const onEmpty = muiFormControl && muiFormControl.onEmpty;
+  const checkDirty = React.useCallback(obj => {
+    if (isFilled(obj)) {
+      if (onFilled) {
+        onFilled();
+      }
+    } else if (onEmpty) {
+      onEmpty();
+    }
+  }, [onFilled, onEmpty]);
+  useEnhancedEffect(() => {
+    if (isControlled) {
+      checkDirty({
+        value
+      });
+    }
+  }, [value, checkDirty, isControlled]);
+  const handleFocus = event => {
+    // Fix a bug with IE11 where the focus/blur events are triggered
+    // while the component is disabled.
+    if (fcs.disabled) {
+      event.stopPropagation();
+      return;
+    }
+    if (onFocus) {
+      onFocus(event);
+    }
+    if (inputPropsProp.onFocus) {
+      inputPropsProp.onFocus(event);
+    }
+    if (muiFormControl && muiFormControl.onFocus) {
+      muiFormControl.onFocus(event);
+    } else {
+      setFocused(true);
+    }
+  };
+  const handleBlur = event => {
+    if (onBlur) {
+      onBlur(event);
+    }
+    if (inputPropsProp.onBlur) {
+      inputPropsProp.onBlur(event);
+    }
+    if (muiFormControl && muiFormControl.onBlur) {
+      muiFormControl.onBlur(event);
+    } else {
+      setFocused(false);
+    }
+  };
+  const handleChange = (event, ...args) => {
+    if (!isControlled) {
+      const element = event.target || inputRef.current;
+      if (element == null) {
+        throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Expected valid input target. Did you use a custom \`inputComponent\` and forget to forward refs? See https://mui.com/r/input-component-ref-interface for more info.` : _formatMuiErrorMessage(1));
+      }
+      checkDirty({
+        value: element.value
+      });
+    }
+    if (inputPropsProp.onChange) {
+      inputPropsProp.onChange(event, ...args);
+    }
+
+    // Perform in the willUpdate
+    if (onChange) {
+      onChange(event, ...args);
+    }
+  };
+
+  // Check the input state on mount, in case it was filled by the user
+  // or auto filled by the browser before the hydration (for SSR).
+  React.useEffect(() => {
+    checkDirty(inputRef.current);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  const handleClick = event => {
+    if (inputRef.current && event.currentTarget === event.target) {
+      inputRef.current.focus();
+    }
+    if (onClick) {
+      onClick(event);
+    }
+  };
+  let InputComponent = inputComponent;
+  let inputProps = inputPropsProp;
+  if (multiline && InputComponent === 'input') {
+    if (rows) {
+      if (process.env.NODE_ENV !== 'production') {
+        if (minRows || maxRows) {
+          console.warn('MUI: You can not use the `minRows` or `maxRows` props when the input `rows` prop is set.');
+        }
+      }
+      inputProps = _extends({
+        type: undefined,
+        minRows: rows,
+        maxRows: rows
+      }, inputProps);
+    } else {
+      inputProps = _extends({
+        type: undefined,
+        maxRows,
+        minRows
+      }, inputProps);
+    }
+    InputComponent = TextareaAutosize;
+  }
+  const handleAutoFill = event => {
+    // Provide a fake value as Chrome might not let you access it for security reasons.
+    checkDirty(event.animationName === 'mui-auto-fill-cancel' ? inputRef.current : {
+      value: 'x'
+    });
+  };
+  React.useEffect(() => {
+    if (muiFormControl) {
+      muiFormControl.setAdornedStart(Boolean(startAdornment));
+    }
+  }, [muiFormControl, startAdornment]);
+  const ownerState = _extends({}, props, {
+    color: fcs.color || 'primary',
+    disabled: fcs.disabled,
+    endAdornment,
+    error: fcs.error,
+    focused: fcs.focused,
+    formControl: muiFormControl,
+    fullWidth,
+    hiddenLabel: fcs.hiddenLabel,
+    multiline,
+    size: fcs.size,
+    startAdornment,
+    type
+  });
+  const classes = useUtilityClasses(ownerState);
+  const Root = slots.root || components.Root || InputBaseRoot;
+  const rootProps = slotProps.root || componentsProps.root || {};
+  const Input = slots.input || components.Input || InputBaseComponent;
+  inputProps = _extends({}, inputProps, (_slotProps$input = slotProps.input) != null ? _slotProps$input : componentsProps.input);
+  return /*#__PURE__*/_jsxs(React.Fragment, {
+    children: [!disableInjectingGlobalStyles && inputGlobalStyles, /*#__PURE__*/_jsxs(Root, _extends({}, rootProps, !isHostComponent(Root) && {
+      ownerState: _extends({}, ownerState, rootProps.ownerState)
+    }, {
+      ref: ref,
+      onClick: handleClick
+    }, other, {
+      className: clsx(classes.root, rootProps.className, className, readOnly && 'MuiInputBase-readOnly'),
+      children: [startAdornment, /*#__PURE__*/_jsx(FormControlContext.Provider, {
+        value: null,
+        children: /*#__PURE__*/_jsx(Input, _extends({
+          ownerState: ownerState,
+          "aria-invalid": fcs.error,
+          "aria-describedby": ariaDescribedby,
+          autoComplete: autoComplete,
+          autoFocus: autoFocus,
+          defaultValue: defaultValue,
+          disabled: fcs.disabled,
+          id: id,
+          onAnimationStart: handleAutoFill,
+          name: name,
+          placeholder: placeholder,
+          readOnly: readOnly,
+          required: fcs.required,
+          rows: rows,
+          value: value,
+          onKeyDown: onKeyDown,
+          onKeyUp: onKeyUp,
+          type: type
+        }, inputProps, !isHostComponent(Input) && {
+          as: InputComponent,
+          ownerState: _extends({}, ownerState, inputProps.ownerState)
+        }, {
+          ref: handleInputRef,
+          className: clsx(classes.input, inputProps.className, readOnly && 'MuiInputBase-readOnly'),
+          onBlur: handleBlur,
+          onChange: handleChange,
+          onFocus: handleFocus
+        }))
+      }), endAdornment, renderSuffix ? renderSuffix(_extends({}, fcs, {
+        startAdornment
+      })) : null]
+    }))]
+  });
+});
+process.env.NODE_ENV !== "production" ? InputBase.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  'aria-describedby': PropTypes.string,
+  /**
+   * This prop helps users to fill forms faster, especially on mobile devices.
+   * The name can be confusing, as it's more like an autofill.
+   * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).
+   */
+  autoComplete: PropTypes.string,
+  /**
+   * If `true`, the `input` element is focused during the first mount.
+   */
+  autoFocus: PropTypes.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * The prop defaults to the value (`'primary'`) inherited from the parent FormControl component.
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `slots` prop.
+   * It's recommended to use the `slots` prop instead.
+   *
+   * @default {}
+   */
+  components: PropTypes.shape({
+    Input: PropTypes.elementType,
+    Root: PropTypes.elementType
+  }),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `slotProps` prop.
+   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   *
+   * @default {}
+   */
+  componentsProps: PropTypes.shape({
+    input: PropTypes.object,
+    root: PropTypes.object
+  }),
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue: PropTypes.any,
+  /**
+   * If `true`, the component is disabled.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, GlobalStyles for the auto-fill keyframes will not be injected/removed on mount/unmount. Make sure to inject them at the top of your application.
+   * This option is intended to help with boosting the initial rendering performance if you are loading a big amount of Input components at once.
+   * @default false
+   */
+  disableInjectingGlobalStyles: PropTypes.bool,
+  /**
+   * End `InputAdornment` for this component.
+   */
+  endAdornment: PropTypes.node,
+  /**
+   * If `true`, the `input` will indicate an error.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  error: PropTypes.bool,
+  /**
+   * If `true`, the `input` will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: PropTypes.bool,
+  /**
+   * The id of the `input` element.
+   */
+  id: PropTypes.string,
+  /**
+   * The component used for the `input` element.
+   * Either a string to use a HTML element or a component.
+   * @default 'input'
+   */
+  inputComponent: elementTypeAcceptingRef,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   * @default {}
+   */
+  inputProps: PropTypes.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: refType,
+  /**
+   * If `dense`, will adjust vertical spacing. This is normally obtained via context from
+   * FormControl.
+   * The prop defaults to the value (`'none'`) inherited from the parent FormControl component.
+   */
+  margin: PropTypes.oneOf(['dense', 'none']),
+  /**
+   * Maximum number of rows to display when multiline option is set to true.
+   */
+  maxRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * Minimum number of rows to display when multiline option is set to true.
+   */
+  minRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered.
+   * @default false
+   */
+  multiline: PropTypes.bool,
+  /**
+   * Name attribute of the `input` element.
+   */
+  name: PropTypes.string,
+  /**
+   * Callback fired when the `input` is blurred.
+   *
+   * Notice that the first argument (event) might be undefined.
+   */
+  onBlur: PropTypes.func,
+  /**
+   * Callback fired when the value is changed.
+   *
+   * @param {React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   */
+  onChange: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onClick: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onFocus: PropTypes.func,
+  /**
+   * Callback fired when the `input` doesn't satisfy its constraints.
+   */
+  onInvalid: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onKeyDown: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onKeyUp: PropTypes.func,
+  /**
+   * The short hint displayed in the `input` before the user enters a value.
+   */
+  placeholder: PropTypes.string,
+  /**
+   * It prevents the user from changing the value of the field
+   * (not from interacting with the field).
+   */
+  readOnly: PropTypes.bool,
+  /**
+   * @ignore
+   */
+  renderSuffix: PropTypes.func,
+  /**
+   * If `true`, the `input` element is required.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  required: PropTypes.bool,
+  /**
+   * Number of rows to display when multiline option is set to true.
+   */
+  rows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * The size of the component.
+   */
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    input: PropTypes.object,
+    root: PropTypes.object
+  }),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `components` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    input: PropTypes.elementType,
+    root: PropTypes.elementType
+  }),
+  /**
+   * Start `InputAdornment` for this component.
+   */
+  startAdornment: PropTypes.node,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).
+   * @default 'text'
+   */
+  type: PropTypes.string,
+  /**
+   * The value of the `input` element, required for a controlled component.
+   */
+  value: PropTypes.any
+} : void 0;
+export default InputBase;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/InputBase/inputBaseClasses.js b/ddb_main/node_modules/@mui/material/InputBase/inputBaseClasses.js
new file mode 100644
index 0000000..6a314b8
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/InputBase/inputBaseClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getInputBaseUtilityClass(slot) {
+  return generateUtilityClass('MuiInputBase', slot);
+}
+const inputBaseClasses = generateUtilityClasses('MuiInputBase', ['root', 'formControl', 'focused', 'disabled', 'adornedStart', 'adornedEnd', 'error', 'sizeSmall', 'multiline', 'colorSecondary', 'fullWidth', 'hiddenLabel', 'readOnly', 'input', 'inputSizeSmall', 'inputMultiline', 'inputTypeSearch', 'inputAdornedStart', 'inputAdornedEnd', 'inputHiddenLabel']);
+export default inputBaseClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/InputBase/utils.js b/ddb_main/node_modules/@mui/material/InputBase/utils.js
new file mode 100644
index 0000000..2fdc5f8
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/InputBase/utils.js
@@ -0,0 +1,30 @@
+// Supports determination of isControlled().
+// Controlled input accepts its current value as a prop.
+//
+// @see https://facebook.github.io/react/docs/forms.html#controlled-components
+// @param value
+// @returns {boolean} true if string (including '') or number (including zero)
+export function hasValue(value) {
+  return value != null && !(Array.isArray(value) && value.length === 0);
+}
+
+// Determine if field is empty or filled.
+// Response determines if label is presented above field or as placeholder.
+//
+// @param obj
+// @param SSR
+// @returns {boolean} False when not present or empty string.
+//                    True when any number or string with length.
+export function isFilled(obj, SSR = false) {
+  return obj && (hasValue(obj.value) && obj.value !== '' || SSR && hasValue(obj.defaultValue) && obj.defaultValue !== '');
+}
+
+// Determine if an Input is adorned on start.
+// It's corresponding to the left with LTR.
+//
+// @param obj
+// @returns {boolean} False when no adornments.
+//                    True when adorned at the start.
+export function isAdornedStart(obj) {
+  return obj.startAdornment;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/InputLabel/InputLabel.js b/ddb_main/node_modules/@mui/material/InputLabel/InputLabel.js
new file mode 100644
index 0000000..9714aa5
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/InputLabel/InputLabel.js
@@ -0,0 +1,216 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["disableAnimation", "margin", "shrink", "variant", "className"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import composeClasses from '@mui/utils/composeClasses';
+import clsx from 'clsx';
+import formControlState from '../FormControl/formControlState';
+import useFormControl from '../FormControl/useFormControl';
+import FormLabel, { formLabelClasses } from '../FormLabel';
+import useThemeProps from '../styles/useThemeProps';
+import capitalize from '../utils/capitalize';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import { getInputLabelUtilityClasses } from './inputLabelClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    formControl,
+    size,
+    shrink,
+    disableAnimation,
+    variant,
+    required
+  } = ownerState;
+  const slots = {
+    root: ['root', formControl && 'formControl', !disableAnimation && 'animated', shrink && 'shrink', size && size !== 'normal' && `size${capitalize(size)}`, variant],
+    asterisk: [required && 'asterisk']
+  };
+  const composedClasses = composeClasses(slots, getInputLabelUtilityClasses, classes);
+  return _extends({}, classes, composedClasses);
+};
+const InputLabelRoot = styled(FormLabel, {
+  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
+  name: 'MuiInputLabel',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [{
+      [`& .${formLabelClasses.asterisk}`]: styles.asterisk
+    }, styles.root, ownerState.formControl && styles.formControl, ownerState.size === 'small' && styles.sizeSmall, ownerState.shrink && styles.shrink, !ownerState.disableAnimation && styles.animated, ownerState.focused && styles.focused, styles[ownerState.variant]];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  display: 'block',
+  transformOrigin: 'top left',
+  whiteSpace: 'nowrap',
+  overflow: 'hidden',
+  textOverflow: 'ellipsis',
+  maxWidth: '100%'
+}, ownerState.formControl && {
+  position: 'absolute',
+  left: 0,
+  top: 0,
+  // slight alteration to spec spacing to match visual spec result
+  transform: 'translate(0, 20px) scale(1)'
+}, ownerState.size === 'small' && {
+  // Compensation for the `Input.inputSizeSmall` style.
+  transform: 'translate(0, 17px) scale(1)'
+}, ownerState.shrink && {
+  transform: 'translate(0, -1.5px) scale(0.75)',
+  transformOrigin: 'top left',
+  maxWidth: '133%'
+}, !ownerState.disableAnimation && {
+  transition: theme.transitions.create(['color', 'transform', 'max-width'], {
+    duration: theme.transitions.duration.shorter,
+    easing: theme.transitions.easing.easeOut
+  })
+}, ownerState.variant === 'filled' && _extends({
+  // Chrome's autofill feature gives the input field a yellow background.
+  // Since the input field is behind the label in the HTML tree,
+  // the input field is drawn last and hides the label with an opaque background color.
+  // zIndex: 1 will raise the label above opaque background-colors of input.
+  zIndex: 1,
+  pointerEvents: 'none',
+  transform: 'translate(12px, 16px) scale(1)',
+  maxWidth: 'calc(100% - 24px)'
+}, ownerState.size === 'small' && {
+  transform: 'translate(12px, 13px) scale(1)'
+}, ownerState.shrink && _extends({
+  userSelect: 'none',
+  pointerEvents: 'auto',
+  transform: 'translate(12px, 7px) scale(0.75)',
+  maxWidth: 'calc(133% - 24px)'
+}, ownerState.size === 'small' && {
+  transform: 'translate(12px, 4px) scale(0.75)'
+})), ownerState.variant === 'outlined' && _extends({
+  // see comment above on filled.zIndex
+  zIndex: 1,
+  pointerEvents: 'none',
+  transform: 'translate(14px, 16px) scale(1)',
+  maxWidth: 'calc(100% - 24px)'
+}, ownerState.size === 'small' && {
+  transform: 'translate(14px, 9px) scale(1)'
+}, ownerState.shrink && {
+  userSelect: 'none',
+  pointerEvents: 'auto',
+  // Theoretically, we should have (8+5)*2/0.75 = 34px
+  // but it feels a better when it bleeds a bit on the left, so 32px.
+  maxWidth: 'calc(133% - 32px)',
+  transform: 'translate(14px, -9px) scale(0.75)'
+})));
+const InputLabel = /*#__PURE__*/React.forwardRef(function InputLabel(inProps, ref) {
+  const props = useThemeProps({
+    name: 'MuiInputLabel',
+    props: inProps
+  });
+  const {
+      disableAnimation = false,
+      shrink: shrinkProp,
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const muiFormControl = useFormControl();
+  let shrink = shrinkProp;
+  if (typeof shrink === 'undefined' && muiFormControl) {
+    shrink = muiFormControl.filled || muiFormControl.focused || muiFormControl.adornedStart;
+  }
+  const fcs = formControlState({
+    props,
+    muiFormControl,
+    states: ['size', 'variant', 'required', 'focused']
+  });
+  const ownerState = _extends({}, props, {
+    disableAnimation,
+    formControl: muiFormControl,
+    shrink,
+    size: fcs.size,
+    variant: fcs.variant,
+    required: fcs.required,
+    focused: fcs.focused
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(InputLabelRoot, _extends({
+    "data-shrink": shrink,
+    ownerState: ownerState,
+    ref: ref,
+    className: clsx(classes.root, className)
+  }, other, {
+    classes: classes
+  }));
+});
+process.env.NODE_ENV !== "production" ? InputLabel.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['error', 'info', 'primary', 'secondary', 'success', 'warning']), PropTypes.string]),
+  /**
+   * If `true`, the transition animation is disabled.
+   * @default false
+   */
+  disableAnimation: PropTypes.bool,
+  /**
+   * If `true`, the component is disabled.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the label is displayed in an error state.
+   */
+  error: PropTypes.bool,
+  /**
+   * If `true`, the `input` of this label is focused.
+   */
+  focused: PropTypes.bool,
+  /**
+   * If `dense`, will adjust vertical spacing. This is normally obtained via context from
+   * FormControl.
+   */
+  margin: PropTypes.oneOf(['dense']),
+  /**
+   * if `true`, the label will indicate that the `input` is required.
+   */
+  required: PropTypes.bool,
+  /**
+   * If `true`, the label is shrunk.
+   */
+  shrink: PropTypes.bool,
+  /**
+   * The size of the component.
+   * @default 'normal'
+   */
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['normal', 'small']), PropTypes.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The variant to use.
+   */
+  variant: PropTypes.oneOf(['filled', 'outlined', 'standard'])
+} : void 0;
+export default InputLabel;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/InputLabel/inputLabelClasses.js b/ddb_main/node_modules/@mui/material/InputLabel/inputLabelClasses.js
new file mode 100644
index 0000000..31b5fa3
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/InputLabel/inputLabelClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getInputLabelUtilityClasses(slot) {
+  return generateUtilityClass('MuiInputLabel', slot);
+}
+const inputLabelClasses = generateUtilityClasses('MuiInputLabel', ['root', 'focused', 'disabled', 'error', 'required', 'asterisk', 'formControl', 'sizeSmall', 'shrink', 'animated', 'standard', 'filled', 'outlined']);
+export default inputLabelClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Link/Link.js b/ddb_main/node_modules/@mui/material/Link/Link.js
new file mode 100644
index 0000000..84ee5f2
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Link/Link.js
@@ -0,0 +1,211 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "color", "component", "onBlur", "onFocus", "TypographyClasses", "underline", "variant", "sx"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import elementTypeAcceptingRef from '@mui/utils/elementTypeAcceptingRef';
+import composeClasses from '@mui/utils/composeClasses';
+import capitalize from '../utils/capitalize';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import useIsFocusVisible from '../utils/useIsFocusVisible';
+import useForkRef from '../utils/useForkRef';
+import Typography from '../Typography';
+import linkClasses, { getLinkUtilityClass } from './linkClasses';
+import getTextDecoration, { colorTransformations } from './getTextDecoration';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    component,
+    focusVisible,
+    underline
+  } = ownerState;
+  const slots = {
+    root: ['root', `underline${capitalize(underline)}`, component === 'button' && 'button', focusVisible && 'focusVisible']
+  };
+  return composeClasses(slots, getLinkUtilityClass, classes);
+};
+const LinkRoot = styled(Typography, {
+  name: 'MuiLink',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, styles[`underline${capitalize(ownerState.underline)}`], ownerState.component === 'button' && styles.button];
+  }
+})(({
+  theme,
+  ownerState
+}) => {
+  return _extends({}, ownerState.underline === 'none' && {
+    textDecoration: 'none'
+  }, ownerState.underline === 'hover' && {
+    textDecoration: 'none',
+    '&:hover': {
+      textDecoration: 'underline'
+    }
+  }, ownerState.underline === 'always' && _extends({
+    textDecoration: 'underline'
+  }, ownerState.color !== 'inherit' && {
+    textDecorationColor: getTextDecoration({
+      theme,
+      ownerState
+    })
+  }, {
+    '&:hover': {
+      textDecorationColor: 'inherit'
+    }
+  }), ownerState.component === 'button' && {
+    position: 'relative',
+    WebkitTapHighlightColor: 'transparent',
+    backgroundColor: 'transparent',
+    // Reset default value
+    // We disable the focus ring for mouse, touch and keyboard users.
+    outline: 0,
+    border: 0,
+    margin: 0,
+    // Remove the margin in Safari
+    borderRadius: 0,
+    padding: 0,
+    // Remove the padding in Firefox
+    cursor: 'pointer',
+    userSelect: 'none',
+    verticalAlign: 'middle',
+    MozAppearance: 'none',
+    // Reset
+    WebkitAppearance: 'none',
+    // Reset
+    '&::-moz-focus-inner': {
+      borderStyle: 'none' // Remove Firefox dotted outline.
+    },
+    [`&.${linkClasses.focusVisible}`]: {
+      outline: 'auto'
+    }
+  });
+});
+const Link = /*#__PURE__*/React.forwardRef(function Link(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiLink'
+  });
+  const {
+      className,
+      color = 'primary',
+      component = 'a',
+      onBlur,
+      onFocus,
+      TypographyClasses,
+      underline = 'always',
+      variant = 'inherit',
+      sx
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const {
+    isFocusVisibleRef,
+    onBlur: handleBlurVisible,
+    onFocus: handleFocusVisible,
+    ref: focusVisibleRef
+  } = useIsFocusVisible();
+  const [focusVisible, setFocusVisible] = React.useState(false);
+  const handlerRef = useForkRef(ref, focusVisibleRef);
+  const handleBlur = event => {
+    handleBlurVisible(event);
+    if (isFocusVisibleRef.current === false) {
+      setFocusVisible(false);
+    }
+    if (onBlur) {
+      onBlur(event);
+    }
+  };
+  const handleFocus = event => {
+    handleFocusVisible(event);
+    if (isFocusVisibleRef.current === true) {
+      setFocusVisible(true);
+    }
+    if (onFocus) {
+      onFocus(event);
+    }
+  };
+  const ownerState = _extends({}, props, {
+    color,
+    component,
+    focusVisible,
+    underline,
+    variant
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(LinkRoot, _extends({
+    color: color,
+    className: clsx(classes.root, className),
+    classes: TypographyClasses,
+    component: component,
+    onBlur: handleBlur,
+    onFocus: handleFocus,
+    ref: handlerRef,
+    ownerState: ownerState,
+    variant: variant,
+    sx: [...(!Object.keys(colorTransformations).includes(color) ? [{
+      color
+    }] : []), ...(Array.isArray(sx) ? sx : [sx])]
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? Link.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the link.
+   * @default 'primary'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.any,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: elementTypeAcceptingRef,
+  /**
+   * @ignore
+   */
+  onBlur: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onFocus: PropTypes.func,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * `classes` prop applied to the [`Typography`](/material-ui/api/typography/) element.
+   */
+  TypographyClasses: PropTypes.object,
+  /**
+   * Controls when the link should have an underline.
+   * @default 'always'
+   */
+  underline: PropTypes.oneOf(['always', 'hover', 'none']),
+  /**
+   * Applies the theme typography styles.
+   * @default 'inherit'
+   */
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['body1', 'body2', 'button', 'caption', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'inherit', 'overline', 'subtitle1', 'subtitle2']), PropTypes.string])
+} : void 0;
+export default Link;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Link/getTextDecoration.js b/ddb_main/node_modules/@mui/material/Link/getTextDecoration.js
new file mode 100644
index 0000000..414d5f3
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Link/getTextDecoration.js
@@ -0,0 +1,25 @@
+import { getPath } from '@mui/system';
+import { alpha } from '@mui/system/colorManipulator';
+export const colorTransformations = {
+  primary: 'primary.main',
+  textPrimary: 'text.primary',
+  secondary: 'secondary.main',
+  textSecondary: 'text.secondary',
+  error: 'error.main'
+};
+const transformDeprecatedColors = color => {
+  return colorTransformations[color] || color;
+};
+const getTextDecoration = ({
+  theme,
+  ownerState
+}) => {
+  const transformedColor = transformDeprecatedColors(ownerState.color);
+  const color = getPath(theme, `palette.${transformedColor}`, false) || ownerState.color;
+  const channelColor = getPath(theme, `palette.${transformedColor}Channel`);
+  if ('vars' in theme && channelColor) {
+    return `rgba(${channelColor} / 0.4)`;
+  }
+  return alpha(color, 0.4);
+};
+export default getTextDecoration;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Link/linkClasses.js b/ddb_main/node_modules/@mui/material/Link/linkClasses.js
new file mode 100644
index 0000000..ac38c74
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Link/linkClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getLinkUtilityClass(slot) {
+  return generateUtilityClass('MuiLink', slot);
+}
+const linkClasses = generateUtilityClasses('MuiLink', ['root', 'underlineNone', 'underlineHover', 'underlineAlways', 'button', 'focusVisible']);
+export default linkClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/List/List.js b/ddb_main/node_modules/@mui/material/List/List.js
new file mode 100644
index 0000000..3e905a6
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/List/List.js
@@ -0,0 +1,128 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "className", "component", "dense", "disablePadding", "subheader"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import ListContext from './ListContext';
+import { getListUtilityClass } from './listClasses';
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    disablePadding,
+    dense,
+    subheader
+  } = ownerState;
+  const slots = {
+    root: ['root', !disablePadding && 'padding', dense && 'dense', subheader && 'subheader']
+  };
+  return composeClasses(slots, getListUtilityClass, classes);
+};
+const ListRoot = styled('ul', {
+  name: 'MuiList',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, !ownerState.disablePadding && styles.padding, ownerState.dense && styles.dense, ownerState.subheader && styles.subheader];
+  }
+})(({
+  ownerState
+}) => _extends({
+  listStyle: 'none',
+  margin: 0,
+  padding: 0,
+  position: 'relative'
+}, !ownerState.disablePadding && {
+  paddingTop: 8,
+  paddingBottom: 8
+}, ownerState.subheader && {
+  paddingTop: 0
+}));
+const List = /*#__PURE__*/React.forwardRef(function List(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiList'
+  });
+  const {
+      children,
+      className,
+      component = 'ul',
+      dense = false,
+      disablePadding = false,
+      subheader
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const context = React.useMemo(() => ({
+    dense
+  }), [dense]);
+  const ownerState = _extends({}, props, {
+    component,
+    dense,
+    disablePadding
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(ListContext.Provider, {
+    value: context,
+    children: /*#__PURE__*/_jsxs(ListRoot, _extends({
+      as: component,
+      className: clsx(classes.root, className),
+      ref: ref,
+      ownerState: ownerState
+    }, other, {
+      children: [subheader, children]
+    }))
+  });
+});
+process.env.NODE_ENV !== "production" ? List.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * If `true`, compact vertical padding designed for keyboard and mouse input is used for
+   * the list and list items.
+   * The prop is available to descendant components as the `dense` context.
+   * @default false
+   */
+  dense: PropTypes.bool,
+  /**
+   * If `true`, vertical padding is removed from the list.
+   * @default false
+   */
+  disablePadding: PropTypes.bool,
+  /**
+   * The content of the subheader, normally `ListSubheader`.
+   */
+  subheader: PropTypes.node,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default List;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/List/ListContext.js b/ddb_main/node_modules/@mui/material/List/ListContext.js
new file mode 100644
index 0000000..0d1107a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/List/ListContext.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+
+/**
+ * @ignore - internal component.
+ */
+const ListContext = /*#__PURE__*/React.createContext({});
+if (process.env.NODE_ENV !== 'production') {
+  ListContext.displayName = 'ListContext';
+}
+export default ListContext;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/List/listClasses.js b/ddb_main/node_modules/@mui/material/List/listClasses.js
new file mode 100644
index 0000000..d048199
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/List/listClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getListUtilityClass(slot) {
+  return generateUtilityClass('MuiList', slot);
+}
+const listClasses = generateUtilityClasses('MuiList', ['root', 'padding', 'dense', 'subheader']);
+export default listClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListItem/ListItem.js b/ddb_main/node_modules/@mui/material/ListItem/ListItem.js
new file mode 100644
index 0000000..a77178c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListItem/ListItem.js
@@ -0,0 +1,422 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className"],
+  _excluded2 = ["alignItems", "autoFocus", "button", "children", "className", "component", "components", "componentsProps", "ContainerComponent", "ContainerProps", "dense", "disabled", "disableGutters", "disablePadding", "divider", "focusVisibleClassName", "secondaryAction", "selected", "slotProps", "slots"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { isHostComponent } from '@mui/base/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import elementTypeAcceptingRef from '@mui/utils/elementTypeAcceptingRef';
+import chainPropTypes from '@mui/utils/chainPropTypes';
+import { alpha } from '@mui/system/colorManipulator';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import ButtonBase from '../ButtonBase';
+import isMuiElement from '../utils/isMuiElement';
+import useEnhancedEffect from '../utils/useEnhancedEffect';
+import useForkRef from '../utils/useForkRef';
+import ListContext from '../List/ListContext';
+import listItemClasses, { getListItemUtilityClass } from './listItemClasses';
+import { listItemButtonClasses } from '../ListItemButton';
+import ListItemSecondaryAction from '../ListItemSecondaryAction';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export const overridesResolver = (props, styles) => {
+  const {
+    ownerState
+  } = props;
+  return [styles.root, ownerState.dense && styles.dense, ownerState.alignItems === 'flex-start' && styles.alignItemsFlexStart, ownerState.divider && styles.divider, !ownerState.disableGutters && styles.gutters, !ownerState.disablePadding && styles.padding, ownerState.button && styles.button, ownerState.hasSecondaryAction && styles.secondaryAction];
+};
+const useUtilityClasses = ownerState => {
+  const {
+    alignItems,
+    button,
+    classes,
+    dense,
+    disabled,
+    disableGutters,
+    disablePadding,
+    divider,
+    hasSecondaryAction,
+    selected
+  } = ownerState;
+  const slots = {
+    root: ['root', dense && 'dense', !disableGutters && 'gutters', !disablePadding && 'padding', divider && 'divider', disabled && 'disabled', button && 'button', alignItems === 'flex-start' && 'alignItemsFlexStart', hasSecondaryAction && 'secondaryAction', selected && 'selected'],
+    container: ['container']
+  };
+  return composeClasses(slots, getListItemUtilityClass, classes);
+};
+export const ListItemRoot = styled('div', {
+  name: 'MuiListItem',
+  slot: 'Root',
+  overridesResolver
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  display: 'flex',
+  justifyContent: 'flex-start',
+  alignItems: 'center',
+  position: 'relative',
+  textDecoration: 'none',
+  width: '100%',
+  boxSizing: 'border-box',
+  textAlign: 'left'
+}, !ownerState.disablePadding && _extends({
+  paddingTop: 8,
+  paddingBottom: 8
+}, ownerState.dense && {
+  paddingTop: 4,
+  paddingBottom: 4
+}, !ownerState.disableGutters && {
+  paddingLeft: 16,
+  paddingRight: 16
+}, !!ownerState.secondaryAction && {
+  // Add some space to avoid collision as `ListItemSecondaryAction`
+  // is absolutely positioned.
+  paddingRight: 48
+}), !!ownerState.secondaryAction && {
+  [`& > .${listItemButtonClasses.root}`]: {
+    paddingRight: 48
+  }
+}, {
+  [`&.${listItemClasses.focusVisible}`]: {
+    backgroundColor: (theme.vars || theme).palette.action.focus
+  },
+  [`&.${listItemClasses.selected}`]: {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity),
+    [`&.${listItemClasses.focusVisible}`]: {
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
+    }
+  },
+  [`&.${listItemClasses.disabled}`]: {
+    opacity: (theme.vars || theme).palette.action.disabledOpacity
+  }
+}, ownerState.alignItems === 'flex-start' && {
+  alignItems: 'flex-start'
+}, ownerState.divider && {
+  borderBottom: `1px solid ${(theme.vars || theme).palette.divider}`,
+  backgroundClip: 'padding-box'
+}, ownerState.button && {
+  transition: theme.transitions.create('background-color', {
+    duration: theme.transitions.duration.shortest
+  }),
+  '&:hover': {
+    textDecoration: 'none',
+    backgroundColor: (theme.vars || theme).palette.action.hover,
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      backgroundColor: 'transparent'
+    }
+  },
+  [`&.${listItemClasses.selected}:hover`]: {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.hoverOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity),
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity)
+    }
+  }
+}, ownerState.hasSecondaryAction && {
+  // Add some space to avoid collision as `ListItemSecondaryAction`
+  // is absolutely positioned.
+  paddingRight: 48
+}));
+const ListItemContainer = styled('li', {
+  name: 'MuiListItem',
+  slot: 'Container',
+  overridesResolver: (props, styles) => styles.container
+})({
+  position: 'relative'
+});
+
+/**
+ * Uses an additional container component if `ListItemSecondaryAction` is the last child.
+ */
+const ListItem = /*#__PURE__*/React.forwardRef(function ListItem(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiListItem'
+  });
+  const {
+      alignItems = 'center',
+      autoFocus = false,
+      button = false,
+      children: childrenProp,
+      className,
+      component: componentProp,
+      components = {},
+      componentsProps = {},
+      ContainerComponent = 'li',
+      ContainerProps: {
+        className: ContainerClassName
+      } = {},
+      dense = false,
+      disabled = false,
+      disableGutters = false,
+      disablePadding = false,
+      divider = false,
+      focusVisibleClassName,
+      secondaryAction,
+      selected = false,
+      slotProps = {},
+      slots = {}
+    } = props,
+    ContainerProps = _objectWithoutPropertiesLoose(props.ContainerProps, _excluded),
+    other = _objectWithoutPropertiesLoose(props, _excluded2);
+  const context = React.useContext(ListContext);
+  const childContext = React.useMemo(() => ({
+    dense: dense || context.dense || false,
+    alignItems,
+    disableGutters
+  }), [alignItems, context.dense, dense, disableGutters]);
+  const listItemRef = React.useRef(null);
+  useEnhancedEffect(() => {
+    if (autoFocus) {
+      if (listItemRef.current) {
+        listItemRef.current.focus();
+      } else if (process.env.NODE_ENV !== 'production') {
+        console.error('MUI: Unable to set focus to a ListItem whose component has not been rendered.');
+      }
+    }
+  }, [autoFocus]);
+  const children = React.Children.toArray(childrenProp);
+
+  // v4 implementation, deprecated in v5, will be removed in v6
+  const hasSecondaryAction = children.length && isMuiElement(children[children.length - 1], ['ListItemSecondaryAction']);
+  const ownerState = _extends({}, props, {
+    alignItems,
+    autoFocus,
+    button,
+    dense: childContext.dense,
+    disabled,
+    disableGutters,
+    disablePadding,
+    divider,
+    hasSecondaryAction,
+    selected
+  });
+  const classes = useUtilityClasses(ownerState);
+  const handleRef = useForkRef(listItemRef, ref);
+  const Root = slots.root || components.Root || ListItemRoot;
+  const rootProps = slotProps.root || componentsProps.root || {};
+  const componentProps = _extends({
+    className: clsx(classes.root, rootProps.className, className),
+    disabled
+  }, other);
+  let Component = componentProp || 'li';
+  if (button) {
+    componentProps.component = componentProp || 'div';
+    componentProps.focusVisibleClassName = clsx(listItemClasses.focusVisible, focusVisibleClassName);
+    Component = ButtonBase;
+  }
+
+  // v4 implementation, deprecated in v5, will be removed in v6
+  if (hasSecondaryAction) {
+    // Use div by default.
+    Component = !componentProps.component && !componentProp ? 'div' : Component;
+
+    // Avoid nesting of li > li.
+    if (ContainerComponent === 'li') {
+      if (Component === 'li') {
+        Component = 'div';
+      } else if (componentProps.component === 'li') {
+        componentProps.component = 'div';
+      }
+    }
+    return /*#__PURE__*/_jsx(ListContext.Provider, {
+      value: childContext,
+      children: /*#__PURE__*/_jsxs(ListItemContainer, _extends({
+        as: ContainerComponent,
+        className: clsx(classes.container, ContainerClassName),
+        ref: handleRef,
+        ownerState: ownerState
+      }, ContainerProps, {
+        children: [/*#__PURE__*/_jsx(Root, _extends({}, rootProps, !isHostComponent(Root) && {
+          as: Component,
+          ownerState: _extends({}, ownerState, rootProps.ownerState)
+        }, componentProps, {
+          children: children
+        })), children.pop()]
+      }))
+    });
+  }
+  return /*#__PURE__*/_jsx(ListContext.Provider, {
+    value: childContext,
+    children: /*#__PURE__*/_jsxs(Root, _extends({}, rootProps, {
+      as: Component,
+      ref: handleRef
+    }, !isHostComponent(Root) && {
+      ownerState: _extends({}, ownerState, rootProps.ownerState)
+    }, componentProps, {
+      children: [children, secondaryAction && /*#__PURE__*/_jsx(ListItemSecondaryAction, {
+        children: secondaryAction
+      })]
+    }))
+  });
+});
+process.env.NODE_ENV !== "production" ? ListItem.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Defines the `align-items` style property.
+   * @default 'center'
+   */
+  alignItems: PropTypes.oneOf(['center', 'flex-start']),
+  /**
+   * If `true`, the list item is focused during the first mount.
+   * Focus will also be triggered if the value changes from false to true.
+   * @default false
+   * @deprecated checkout [ListItemButton](/material-ui/api/list-item-button/) instead
+   */
+  autoFocus: PropTypes.bool,
+  /**
+   * If `true`, the list item is a button (using `ButtonBase`). Props intended
+   * for `ButtonBase` can then be applied to `ListItem`.
+   * @default false
+   * @deprecated checkout [ListItemButton](/material-ui/api/list-item-button/) instead
+   */
+  button: PropTypes.bool,
+  /**
+   * The content of the component if a `ListItemSecondaryAction` is used it must
+   * be the last child.
+   */
+  children: chainPropTypes(PropTypes.node, props => {
+    const children = React.Children.toArray(props.children);
+
+    // React.Children.toArray(props.children).findLastIndex(isListItemSecondaryAction)
+    let secondaryActionIndex = -1;
+    for (let i = children.length - 1; i >= 0; i -= 1) {
+      const child = children[i];
+      if (isMuiElement(child, ['ListItemSecondaryAction'])) {
+        secondaryActionIndex = i;
+        break;
+      }
+    }
+
+    //  is ListItemSecondaryAction the last child of ListItem
+    if (secondaryActionIndex !== -1 && secondaryActionIndex !== children.length - 1) {
+      return new Error('MUI: You used an element after ListItemSecondaryAction. ' + 'For ListItem to detect that it has a secondary action ' + 'you must pass it as the last child to ListItem.');
+    }
+    return null;
+  }),
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `slots` prop.
+   * It's recommended to use the `slots` prop instead.
+   *
+   * @default {}
+   */
+  components: PropTypes.shape({
+    Root: PropTypes.elementType
+  }),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `slotProps` prop.
+   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   *
+   * @default {}
+   */
+  componentsProps: PropTypes.shape({
+    root: PropTypes.object
+  }),
+  /**
+   * The container component used when a `ListItemSecondaryAction` is the last child.
+   * @default 'li'
+   * @deprecated
+   */
+  ContainerComponent: elementTypeAcceptingRef,
+  /**
+   * Props applied to the container component if used.
+   * @default {}
+   * @deprecated
+   */
+  ContainerProps: PropTypes.object,
+  /**
+   * If `true`, compact vertical padding designed for keyboard and mouse input is used.
+   * The prop defaults to the value inherited from the parent List component.
+   * @default false
+   */
+  dense: PropTypes.bool,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   * @deprecated checkout [ListItemButton](/material-ui/api/list-item-button/) instead
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the left and right padding is removed.
+   * @default false
+   */
+  disableGutters: PropTypes.bool,
+  /**
+   * If `true`, all padding is removed.
+   * @default false
+   */
+  disablePadding: PropTypes.bool,
+  /**
+   * If `true`, a 1px light border is added to the bottom of the list item.
+   * @default false
+   */
+  divider: PropTypes.bool,
+  /**
+   * @ignore
+   */
+  focusVisibleClassName: PropTypes.string,
+  /**
+   * The element to display at the end of ListItem.
+   */
+  secondaryAction: PropTypes.node,
+  /**
+   * Use to apply selected styling.
+   * @default false
+   * @deprecated checkout [ListItemButton](/material-ui/api/list-item-button/) instead
+   */
+  selected: PropTypes.bool,
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    root: PropTypes.object
+  }),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `components` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    root: PropTypes.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default ListItem;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListItem/listItemClasses.js b/ddb_main/node_modules/@mui/material/ListItem/listItemClasses.js
new file mode 100644
index 0000000..10d37d1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListItem/listItemClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getListItemUtilityClass(slot) {
+  return generateUtilityClass('MuiListItem', slot);
+}
+const listItemClasses = generateUtilityClasses('MuiListItem', ['root', 'container', 'focusVisible', 'dense', 'alignItemsFlexStart', 'disabled', 'divider', 'gutters', 'padding', 'button', 'secondaryAction', 'selected']);
+export default listItemClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListItemButton/ListItemButton.js b/ddb_main/node_modules/@mui/material/ListItemButton/ListItemButton.js
new file mode 100644
index 0000000..29242e5
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListItemButton/ListItemButton.js
@@ -0,0 +1,241 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["alignItems", "autoFocus", "component", "children", "dense", "disableGutters", "divider", "focusVisibleClassName", "selected", "className"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha } from '@mui/system/colorManipulator';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import ButtonBase from '../ButtonBase';
+import useEnhancedEffect from '../utils/useEnhancedEffect';
+import useForkRef from '../utils/useForkRef';
+import ListContext from '../List/ListContext';
+import listItemButtonClasses, { getListItemButtonUtilityClass } from './listItemButtonClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const overridesResolver = (props, styles) => {
+  const {
+    ownerState
+  } = props;
+  return [styles.root, ownerState.dense && styles.dense, ownerState.alignItems === 'flex-start' && styles.alignItemsFlexStart, ownerState.divider && styles.divider, !ownerState.disableGutters && styles.gutters];
+};
+const useUtilityClasses = ownerState => {
+  const {
+    alignItems,
+    classes,
+    dense,
+    disabled,
+    disableGutters,
+    divider,
+    selected
+  } = ownerState;
+  const slots = {
+    root: ['root', dense && 'dense', !disableGutters && 'gutters', divider && 'divider', disabled && 'disabled', alignItems === 'flex-start' && 'alignItemsFlexStart', selected && 'selected']
+  };
+  const composedClasses = composeClasses(slots, getListItemButtonUtilityClass, classes);
+  return _extends({}, classes, composedClasses);
+};
+const ListItemButtonRoot = styled(ButtonBase, {
+  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
+  name: 'MuiListItemButton',
+  slot: 'Root',
+  overridesResolver
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  display: 'flex',
+  flexGrow: 1,
+  justifyContent: 'flex-start',
+  alignItems: 'center',
+  position: 'relative',
+  textDecoration: 'none',
+  minWidth: 0,
+  boxSizing: 'border-box',
+  textAlign: 'left',
+  paddingTop: 8,
+  paddingBottom: 8,
+  transition: theme.transitions.create('background-color', {
+    duration: theme.transitions.duration.shortest
+  }),
+  '&:hover': {
+    textDecoration: 'none',
+    backgroundColor: (theme.vars || theme).palette.action.hover,
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      backgroundColor: 'transparent'
+    }
+  },
+  [`&.${listItemButtonClasses.selected}`]: {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity),
+    [`&.${listItemButtonClasses.focusVisible}`]: {
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
+    }
+  },
+  [`&.${listItemButtonClasses.selected}:hover`]: {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.hoverOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity),
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity)
+    }
+  },
+  [`&.${listItemButtonClasses.focusVisible}`]: {
+    backgroundColor: (theme.vars || theme).palette.action.focus
+  },
+  [`&.${listItemButtonClasses.disabled}`]: {
+    opacity: (theme.vars || theme).palette.action.disabledOpacity
+  }
+}, ownerState.divider && {
+  borderBottom: `1px solid ${(theme.vars || theme).palette.divider}`,
+  backgroundClip: 'padding-box'
+}, ownerState.alignItems === 'flex-start' && {
+  alignItems: 'flex-start'
+}, !ownerState.disableGutters && {
+  paddingLeft: 16,
+  paddingRight: 16
+}, ownerState.dense && {
+  paddingTop: 4,
+  paddingBottom: 4
+}));
+const ListItemButton = /*#__PURE__*/React.forwardRef(function ListItemButton(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiListItemButton'
+  });
+  const {
+      alignItems = 'center',
+      autoFocus = false,
+      component = 'div',
+      children,
+      dense = false,
+      disableGutters = false,
+      divider = false,
+      focusVisibleClassName,
+      selected = false,
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const context = React.useContext(ListContext);
+  const childContext = React.useMemo(() => ({
+    dense: dense || context.dense || false,
+    alignItems,
+    disableGutters
+  }), [alignItems, context.dense, dense, disableGutters]);
+  const listItemRef = React.useRef(null);
+  useEnhancedEffect(() => {
+    if (autoFocus) {
+      if (listItemRef.current) {
+        listItemRef.current.focus();
+      } else if (process.env.NODE_ENV !== 'production') {
+        console.error('MUI: Unable to set focus to a ListItemButton whose component has not been rendered.');
+      }
+    }
+  }, [autoFocus]);
+  const ownerState = _extends({}, props, {
+    alignItems,
+    dense: childContext.dense,
+    disableGutters,
+    divider,
+    selected
+  });
+  const classes = useUtilityClasses(ownerState);
+  const handleRef = useForkRef(listItemRef, ref);
+  return /*#__PURE__*/_jsx(ListContext.Provider, {
+    value: childContext,
+    children: /*#__PURE__*/_jsx(ListItemButtonRoot, _extends({
+      ref: handleRef,
+      href: other.href || other.to
+      // `ButtonBase` processes `href` or `to` if `component` is set to 'button'
+      ,
+      component: (other.href || other.to) && component === 'div' ? 'button' : component,
+      focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName),
+      ownerState: ownerState,
+      className: clsx(classes.root, className)
+    }, other, {
+      classes: classes,
+      children: children
+    }))
+  });
+});
+process.env.NODE_ENV !== "production" ? ListItemButton.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Defines the `align-items` style property.
+   * @default 'center'
+   */
+  alignItems: PropTypes.oneOf(['center', 'flex-start']),
+  /**
+   * If `true`, the list item is focused during the first mount.
+   * Focus will also be triggered if the value changes from false to true.
+   * @default false
+   */
+  autoFocus: PropTypes.bool,
+  /**
+   * The content of the component if a `ListItemSecondaryAction` is used it must
+   * be the last child.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * If `true`, compact vertical padding designed for keyboard and mouse input is used.
+   * The prop defaults to the value inherited from the parent List component.
+   * @default false
+   */
+  dense: PropTypes.bool,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the left and right padding is removed.
+   * @default false
+   */
+  disableGutters: PropTypes.bool,
+  /**
+   * If `true`, a 1px light border is added to the bottom of the list item.
+   * @default false
+   */
+  divider: PropTypes.bool,
+  /**
+   * This prop can help identify which element has keyboard focus.
+   * The class name will be applied when the element gains the focus through keyboard interaction.
+   * It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).
+   * The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md).
+   * A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components
+   * if needed.
+   */
+  focusVisibleClassName: PropTypes.string,
+  /**
+   * @ignore
+   */
+  href: PropTypes.string,
+  /**
+   * Use to apply selected styling.
+   * @default false
+   */
+  selected: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default ListItemButton;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListItemButton/listItemButtonClasses.js b/ddb_main/node_modules/@mui/material/ListItemButton/listItemButtonClasses.js
new file mode 100644
index 0000000..fe5625f
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListItemButton/listItemButtonClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getListItemButtonUtilityClass(slot) {
+  return generateUtilityClass('MuiListItemButton', slot);
+}
+const listItemButtonClasses = generateUtilityClasses('MuiListItemButton', ['root', 'focusVisible', 'dense', 'alignItemsFlexStart', 'disabled', 'divider', 'gutters', 'selected']);
+export default listItemButtonClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListItemIcon/ListItemIcon.js b/ddb_main/node_modules/@mui/material/ListItemIcon/ListItemIcon.js
new file mode 100644
index 0000000..8ca5efe
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListItemIcon/ListItemIcon.js
@@ -0,0 +1,92 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import { getListItemIconUtilityClass } from './listItemIconClasses';
+import ListContext from '../List/ListContext';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    alignItems,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', alignItems === 'flex-start' && 'alignItemsFlexStart']
+  };
+  return composeClasses(slots, getListItemIconUtilityClass, classes);
+};
+const ListItemIconRoot = styled('div', {
+  name: 'MuiListItemIcon',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.alignItems === 'flex-start' && styles.alignItemsFlexStart];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  minWidth: 56,
+  color: (theme.vars || theme).palette.action.active,
+  flexShrink: 0,
+  display: 'inline-flex'
+}, ownerState.alignItems === 'flex-start' && {
+  marginTop: 8
+}));
+
+/**
+ * A simple wrapper to apply `List` styles to an `Icon` or `SvgIcon`.
+ */
+const ListItemIcon = /*#__PURE__*/React.forwardRef(function ListItemIcon(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiListItemIcon'
+  });
+  const {
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const context = React.useContext(ListContext);
+  const ownerState = _extends({}, props, {
+    alignItems: context.alignItems
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(ListItemIconRoot, _extends({
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? ListItemIcon.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component, normally `Icon`, `SvgIcon`,
+   * or a `@mui/icons-material` SVG icon element.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default ListItemIcon;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListItemIcon/listItemIconClasses.js b/ddb_main/node_modules/@mui/material/ListItemIcon/listItemIconClasses.js
new file mode 100644
index 0000000..726bac5
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListItemIcon/listItemIconClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getListItemIconUtilityClass(slot) {
+  return generateUtilityClass('MuiListItemIcon', slot);
+}
+const listItemIconClasses = generateUtilityClasses('MuiListItemIcon', ['root', 'alignItemsFlexStart']);
+export default listItemIconClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListItemSecondaryAction/ListItemSecondaryAction.js b/ddb_main/node_modules/@mui/material/ListItemSecondaryAction/ListItemSecondaryAction.js
new file mode 100644
index 0000000..0bd8173
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListItemSecondaryAction/ListItemSecondaryAction.js
@@ -0,0 +1,91 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import ListContext from '../List/ListContext';
+import { getListItemSecondaryActionClassesUtilityClass } from './listItemSecondaryActionClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    disableGutters,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', disableGutters && 'disableGutters']
+  };
+  return composeClasses(slots, getListItemSecondaryActionClassesUtilityClass, classes);
+};
+const ListItemSecondaryActionRoot = styled('div', {
+  name: 'MuiListItemSecondaryAction',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.disableGutters && styles.disableGutters];
+  }
+})(({
+  ownerState
+}) => _extends({
+  position: 'absolute',
+  right: 16,
+  top: '50%',
+  transform: 'translateY(-50%)'
+}, ownerState.disableGutters && {
+  right: 0
+}));
+
+/**
+ * Must be used as the last child of ListItem to function properly.
+ */
+const ListItemSecondaryAction = /*#__PURE__*/React.forwardRef(function ListItemSecondaryAction(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiListItemSecondaryAction'
+  });
+  const {
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const context = React.useContext(ListContext);
+  const ownerState = _extends({}, props, {
+    disableGutters: context.disableGutters
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(ListItemSecondaryActionRoot, _extends({
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? ListItemSecondaryAction.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component, normally an `IconButton` or selection control.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+ListItemSecondaryAction.muiName = 'ListItemSecondaryAction';
+export default ListItemSecondaryAction;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListItemSecondaryAction/listItemSecondaryActionClasses.js b/ddb_main/node_modules/@mui/material/ListItemSecondaryAction/listItemSecondaryActionClasses.js
new file mode 100644
index 0000000..c04edbe
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListItemSecondaryAction/listItemSecondaryActionClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getListItemSecondaryActionClassesUtilityClass(slot) {
+  return generateUtilityClass('MuiListItemSecondaryAction', slot);
+}
+const listItemSecondaryActionClasses = generateUtilityClasses('MuiListItemSecondaryAction', ['root', 'disableGutters']);
+export default listItemSecondaryActionClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListItemText/ListItemText.js b/ddb_main/node_modules/@mui/material/ListItemText/ListItemText.js
new file mode 100644
index 0000000..8f3760d
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListItemText/ListItemText.js
@@ -0,0 +1,169 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "className", "disableTypography", "inset", "primary", "primaryTypographyProps", "secondary", "secondaryTypographyProps"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import Typography from '../Typography';
+import ListContext from '../List/ListContext';
+import useThemeProps from '../styles/useThemeProps';
+import styled from '../styles/styled';
+import listItemTextClasses, { getListItemTextUtilityClass } from './listItemTextClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    inset,
+    primary,
+    secondary,
+    dense
+  } = ownerState;
+  const slots = {
+    root: ['root', inset && 'inset', dense && 'dense', primary && secondary && 'multiline'],
+    primary: ['primary'],
+    secondary: ['secondary']
+  };
+  return composeClasses(slots, getListItemTextUtilityClass, classes);
+};
+const ListItemTextRoot = styled('div', {
+  name: 'MuiListItemText',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [{
+      [`& .${listItemTextClasses.primary}`]: styles.primary
+    }, {
+      [`& .${listItemTextClasses.secondary}`]: styles.secondary
+    }, styles.root, ownerState.inset && styles.inset, ownerState.primary && ownerState.secondary && styles.multiline, ownerState.dense && styles.dense];
+  }
+})(({
+  ownerState
+}) => _extends({
+  flex: '1 1 auto',
+  minWidth: 0,
+  marginTop: 4,
+  marginBottom: 4
+}, ownerState.primary && ownerState.secondary && {
+  marginTop: 6,
+  marginBottom: 6
+}, ownerState.inset && {
+  paddingLeft: 56
+}));
+const ListItemText = /*#__PURE__*/React.forwardRef(function ListItemText(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiListItemText'
+  });
+  const {
+      children,
+      className,
+      disableTypography = false,
+      inset = false,
+      primary: primaryProp,
+      primaryTypographyProps,
+      secondary: secondaryProp,
+      secondaryTypographyProps
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const {
+    dense
+  } = React.useContext(ListContext);
+  let primary = primaryProp != null ? primaryProp : children;
+  let secondary = secondaryProp;
+  const ownerState = _extends({}, props, {
+    disableTypography,
+    inset,
+    primary: !!primary,
+    secondary: !!secondary,
+    dense
+  });
+  const classes = useUtilityClasses(ownerState);
+  if (primary != null && primary.type !== Typography && !disableTypography) {
+    primary = /*#__PURE__*/_jsx(Typography, _extends({
+      variant: dense ? 'body2' : 'body1',
+      className: classes.primary,
+      component: primaryTypographyProps != null && primaryTypographyProps.variant ? undefined : 'span',
+      display: "block"
+    }, primaryTypographyProps, {
+      children: primary
+    }));
+  }
+  if (secondary != null && secondary.type !== Typography && !disableTypography) {
+    secondary = /*#__PURE__*/_jsx(Typography, _extends({
+      variant: "body2",
+      className: classes.secondary,
+      color: "text.secondary",
+      display: "block"
+    }, secondaryTypographyProps, {
+      children: secondary
+    }));
+  }
+  return /*#__PURE__*/_jsxs(ListItemTextRoot, _extends({
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref
+  }, other, {
+    children: [primary, secondary]
+  }));
+});
+process.env.NODE_ENV !== "production" ? ListItemText.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Alias for the `primary` prop.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * If `true`, the children won't be wrapped by a Typography component.
+   * This can be useful to render an alternative Typography variant by wrapping
+   * the `children` (or `primary`) text, and optional `secondary` text
+   * with the Typography component.
+   * @default false
+   */
+  disableTypography: PropTypes.bool,
+  /**
+   * If `true`, the children are indented.
+   * This should be used if there is no left avatar or left icon.
+   * @default false
+   */
+  inset: PropTypes.bool,
+  /**
+   * The main content element.
+   */
+  primary: PropTypes.node,
+  /**
+   * These props will be forwarded to the primary typography component
+   * (as long as disableTypography is not `true`).
+   */
+  primaryTypographyProps: PropTypes.object,
+  /**
+   * The secondary content element.
+   */
+  secondary: PropTypes.node,
+  /**
+   * These props will be forwarded to the secondary typography component
+   * (as long as disableTypography is not `true`).
+   */
+  secondaryTypographyProps: PropTypes.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default ListItemText;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListItemText/listItemTextClasses.js b/ddb_main/node_modules/@mui/material/ListItemText/listItemTextClasses.js
new file mode 100644
index 0000000..057a02a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListItemText/listItemTextClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getListItemTextUtilityClass(slot) {
+  return generateUtilityClass('MuiListItemText', slot);
+}
+const listItemTextClasses = generateUtilityClasses('MuiListItemText', ['root', 'multiline', 'dense', 'inset', 'primary', 'secondary']);
+export default listItemTextClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListSubheader/ListSubheader.js b/ddb_main/node_modules/@mui/material/ListSubheader/ListSubheader.js
new file mode 100644
index 0000000..111e0c9
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListSubheader/ListSubheader.js
@@ -0,0 +1,140 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "color", "component", "disableGutters", "disableSticky", "inset"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import capitalize from '../utils/capitalize';
+import { getListSubheaderUtilityClass } from './listSubheaderClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    color,
+    disableGutters,
+    inset,
+    disableSticky
+  } = ownerState;
+  const slots = {
+    root: ['root', color !== 'default' && `color${capitalize(color)}`, !disableGutters && 'gutters', inset && 'inset', !disableSticky && 'sticky']
+  };
+  return composeClasses(slots, getListSubheaderUtilityClass, classes);
+};
+const ListSubheaderRoot = styled('li', {
+  name: 'MuiListSubheader',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.color !== 'default' && styles[`color${capitalize(ownerState.color)}`], !ownerState.disableGutters && styles.gutters, ownerState.inset && styles.inset, !ownerState.disableSticky && styles.sticky];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  boxSizing: 'border-box',
+  lineHeight: '48px',
+  listStyle: 'none',
+  color: (theme.vars || theme).palette.text.secondary,
+  fontFamily: theme.typography.fontFamily,
+  fontWeight: theme.typography.fontWeightMedium,
+  fontSize: theme.typography.pxToRem(14)
+}, ownerState.color === 'primary' && {
+  color: (theme.vars || theme).palette.primary.main
+}, ownerState.color === 'inherit' && {
+  color: 'inherit'
+}, !ownerState.disableGutters && {
+  paddingLeft: 16,
+  paddingRight: 16
+}, ownerState.inset && {
+  paddingLeft: 72
+}, !ownerState.disableSticky && {
+  position: 'sticky',
+  top: 0,
+  zIndex: 1,
+  backgroundColor: (theme.vars || theme).palette.background.paper
+}));
+const ListSubheader = /*#__PURE__*/React.forwardRef(function ListSubheader(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiListSubheader'
+  });
+  const {
+      className,
+      color = 'default',
+      component = 'li',
+      disableGutters = false,
+      disableSticky = false,
+      inset = false
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    color,
+    component,
+    disableGutters,
+    disableSticky,
+    inset
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(ListSubheaderRoot, _extends({
+    as: component,
+    className: clsx(classes.root, className),
+    ref: ref,
+    ownerState: ownerState
+  }, other));
+});
+ListSubheader.muiSkipListHighlight = true;
+process.env.NODE_ENV !== "production" ? ListSubheader.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component. It supports those theme colors that make sense for this component.
+   * @default 'default'
+   */
+  color: PropTypes.oneOf(['default', 'inherit', 'primary']),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * If `true`, the List Subheader will not have gutters.
+   * @default false
+   */
+  disableGutters: PropTypes.bool,
+  /**
+   * If `true`, the List Subheader will not stick to the top during scroll.
+   * @default false
+   */
+  disableSticky: PropTypes.bool,
+  /**
+   * If `true`, the List Subheader is indented.
+   * @default false
+   */
+  inset: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default ListSubheader;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ListSubheader/listSubheaderClasses.js b/ddb_main/node_modules/@mui/material/ListSubheader/listSubheaderClasses.js
new file mode 100644
index 0000000..86c0e44
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ListSubheader/listSubheaderClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getListSubheaderUtilityClass(slot) {
+  return generateUtilityClass('MuiListSubheader', slot);
+}
+const listSubheaderClasses = generateUtilityClasses('MuiListSubheader', ['root', 'colorPrimary', 'colorInherit', 'gutters', 'inset', 'sticky']);
+export default listSubheaderClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Menu/Menu.js b/ddb_main/node_modules/@mui/material/Menu/Menu.js
new file mode 100644
index 0000000..ea7ca6a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Menu/Menu.js
@@ -0,0 +1,307 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["onEntering"],
+  _excluded2 = ["autoFocus", "children", "className", "disableAutoFocusItem", "MenuListProps", "onClose", "open", "PaperProps", "PopoverClasses", "transitionDuration", "TransitionProps", "variant", "slots", "slotProps"];
+import * as React from 'react';
+import { isFragment } from 'react-is';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import { useSlotProps } from '@mui/base/utils';
+import HTMLElementType from '@mui/utils/HTMLElementType';
+import { useRtl } from '@mui/system/RtlProvider';
+import MenuList from '../MenuList';
+import Popover, { PopoverPaper } from '../Popover';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import { getMenuUtilityClass } from './menuClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const RTL_ORIGIN = {
+  vertical: 'top',
+  horizontal: 'right'
+};
+const LTR_ORIGIN = {
+  vertical: 'top',
+  horizontal: 'left'
+};
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root'],
+    paper: ['paper'],
+    list: ['list']
+  };
+  return composeClasses(slots, getMenuUtilityClass, classes);
+};
+const MenuRoot = styled(Popover, {
+  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
+  name: 'MuiMenu',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})({});
+export const MenuPaper = styled(PopoverPaper, {
+  name: 'MuiMenu',
+  slot: 'Paper',
+  overridesResolver: (props, styles) => styles.paper
+})({
+  // specZ: The maximum height of a simple menu should be one or more rows less than the view
+  // height. This ensures a tappable area outside of the simple menu with which to dismiss
+  // the menu.
+  maxHeight: 'calc(100% - 96px)',
+  // Add iOS momentum scrolling for iOS < 13.0
+  WebkitOverflowScrolling: 'touch'
+});
+const MenuMenuList = styled(MenuList, {
+  name: 'MuiMenu',
+  slot: 'List',
+  overridesResolver: (props, styles) => styles.list
+})({
+  // We disable the focus ring for mouse, touch and keyboard users.
+  outline: 0
+});
+const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
+  var _slots$paper, _slotProps$paper;
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiMenu'
+  });
+  const {
+      autoFocus = true,
+      children,
+      className,
+      disableAutoFocusItem = false,
+      MenuListProps = {},
+      onClose,
+      open,
+      PaperProps = {},
+      PopoverClasses,
+      transitionDuration = 'auto',
+      TransitionProps: {
+        onEntering
+      } = {},
+      variant = 'selectedMenu',
+      slots = {},
+      slotProps = {}
+    } = props,
+    TransitionProps = _objectWithoutPropertiesLoose(props.TransitionProps, _excluded),
+    other = _objectWithoutPropertiesLoose(props, _excluded2);
+  const isRtl = useRtl();
+  const ownerState = _extends({}, props, {
+    autoFocus,
+    disableAutoFocusItem,
+    MenuListProps,
+    onEntering,
+    PaperProps,
+    transitionDuration,
+    TransitionProps,
+    variant
+  });
+  const classes = useUtilityClasses(ownerState);
+  const autoFocusItem = autoFocus && !disableAutoFocusItem && open;
+  const menuListActionsRef = React.useRef(null);
+  const handleEntering = (element, isAppearing) => {
+    if (menuListActionsRef.current) {
+      menuListActionsRef.current.adjustStyleForScrollbar(element, {
+        direction: isRtl ? 'rtl' : 'ltr'
+      });
+    }
+    if (onEntering) {
+      onEntering(element, isAppearing);
+    }
+  };
+  const handleListKeyDown = event => {
+    if (event.key === 'Tab') {
+      event.preventDefault();
+      if (onClose) {
+        onClose(event, 'tabKeyDown');
+      }
+    }
+  };
+
+  /**
+   * the index of the item should receive focus
+   * in a `variant="selectedMenu"` it's the first `selected` item
+   * otherwise it's the very first item.
+   */
+  let activeItemIndex = -1;
+  // since we inject focus related props into children we have to do a lookahead
+  // to check if there is a `selected` item. We're looking for the last `selected`
+  // item and use the first valid item as a fallback
+  React.Children.map(children, (child, index) => {
+    if (! /*#__PURE__*/React.isValidElement(child)) {
+      return;
+    }
+    if (process.env.NODE_ENV !== 'production') {
+      if (isFragment(child)) {
+        console.error(["MUI: The Menu component doesn't accept a Fragment as a child.", 'Consider providing an array instead.'].join('\n'));
+      }
+    }
+    if (!child.props.disabled) {
+      if (variant === 'selectedMenu' && child.props.selected) {
+        activeItemIndex = index;
+      } else if (activeItemIndex === -1) {
+        activeItemIndex = index;
+      }
+    }
+  });
+  const PaperSlot = (_slots$paper = slots.paper) != null ? _slots$paper : MenuPaper;
+  const paperExternalSlotProps = (_slotProps$paper = slotProps.paper) != null ? _slotProps$paper : PaperProps;
+  const rootSlotProps = useSlotProps({
+    elementType: slots.root,
+    externalSlotProps: slotProps.root,
+    ownerState,
+    className: [classes.root, className]
+  });
+  const paperSlotProps = useSlotProps({
+    elementType: PaperSlot,
+    externalSlotProps: paperExternalSlotProps,
+    ownerState,
+    className: classes.paper
+  });
+  return /*#__PURE__*/_jsx(MenuRoot, _extends({
+    onClose: onClose,
+    anchorOrigin: {
+      vertical: 'bottom',
+      horizontal: isRtl ? 'right' : 'left'
+    },
+    transformOrigin: isRtl ? RTL_ORIGIN : LTR_ORIGIN,
+    slots: {
+      paper: PaperSlot,
+      root: slots.root
+    },
+    slotProps: {
+      root: rootSlotProps,
+      paper: paperSlotProps
+    },
+    open: open,
+    ref: ref,
+    transitionDuration: transitionDuration,
+    TransitionProps: _extends({
+      onEntering: handleEntering
+    }, TransitionProps),
+    ownerState: ownerState
+  }, other, {
+    classes: PopoverClasses,
+    children: /*#__PURE__*/_jsx(MenuMenuList, _extends({
+      onKeyDown: handleListKeyDown,
+      actions: menuListActionsRef,
+      autoFocus: autoFocus && (activeItemIndex === -1 || disableAutoFocusItem),
+      autoFocusItem: autoFocusItem,
+      variant: variant
+    }, MenuListProps, {
+      className: clsx(classes.list, MenuListProps.className),
+      children: children
+    }))
+  }));
+});
+process.env.NODE_ENV !== "production" ? Menu.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * An HTML element, or a function that returns one.
+   * It's used to set the position of the menu.
+   */
+  anchorEl: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([HTMLElementType, PropTypes.func]),
+  /**
+   * If `true` (Default) will focus the `[role="menu"]` if no focusable child is found. Disabled
+   * children are not focusable. If you set this prop to `false` focus will be placed
+   * on the parent modal container. This has severe accessibility implications
+   * and should only be considered if you manage focus otherwise.
+   * @default true
+   */
+  autoFocus: PropTypes.bool,
+  /**
+   * Menu contents, normally `MenuItem`s.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * When opening the menu will not focus the active item but the `[role="menu"]`
+   * unless `autoFocus` is also set to `false`. Not using the default means not
+   * following WAI-ARIA authoring practices. Please be considerate about possible
+   * accessibility implications.
+   * @default false
+   */
+  disableAutoFocusItem: PropTypes.bool,
+  /**
+   * Props applied to the [`MenuList`](/material-ui/api/menu-list/) element.
+   * @default {}
+   */
+  MenuListProps: PropTypes.object,
+  /**
+   * Callback fired when the component requests to be closed.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {string} reason Can be: `"escapeKeyDown"`, `"backdropClick"`, `"tabKeyDown"`.
+   */
+  onClose: PropTypes.func,
+  /**
+   * If `true`, the component is shown.
+   */
+  open: PropTypes.bool.isRequired,
+  /**
+   * @ignore
+   */
+  PaperProps: PropTypes.object,
+  /**
+   * `classes` prop applied to the [`Popover`](/material-ui/api/popover/) element.
+   */
+  PopoverClasses: PropTypes.object,
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    paper: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   *
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    paper: PropTypes.elementType,
+    root: PropTypes.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The length of the transition in `ms`, or 'auto'
+   * @default 'auto'
+   */
+  transitionDuration: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.shape({
+    appear: PropTypes.number,
+    enter: PropTypes.number,
+    exit: PropTypes.number
+  })]),
+  /**
+   * Props applied to the transition element.
+   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
+   * @default {}
+   */
+  TransitionProps: PropTypes.object,
+  /**
+   * The variant to use. Use `menu` to prevent selected items from impacting the initial focus.
+   * @default 'selectedMenu'
+   */
+  variant: PropTypes.oneOf(['menu', 'selectedMenu'])
+} : void 0;
+export default Menu;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Menu/menuClasses.js b/ddb_main/node_modules/@mui/material/Menu/menuClasses.js
new file mode 100644
index 0000000..93c50ce
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Menu/menuClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getMenuUtilityClass(slot) {
+  return generateUtilityClass('MuiMenu', slot);
+}
+const menuClasses = generateUtilityClasses('MuiMenu', ['root', 'paper', 'list']);
+export default menuClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/MenuItem/MenuItem.js b/ddb_main/node_modules/@mui/material/MenuItem/MenuItem.js
new file mode 100644
index 0000000..8d8d41e
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/MenuItem/MenuItem.js
@@ -0,0 +1,260 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["autoFocus", "component", "dense", "divider", "disableGutters", "focusVisibleClassName", "role", "tabIndex", "className"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha } from '@mui/system/colorManipulator';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import ListContext from '../List/ListContext';
+import ButtonBase from '../ButtonBase';
+import useEnhancedEffect from '../utils/useEnhancedEffect';
+import useForkRef from '../utils/useForkRef';
+import { dividerClasses } from '../Divider';
+import { listItemIconClasses } from '../ListItemIcon';
+import { listItemTextClasses } from '../ListItemText';
+import menuItemClasses, { getMenuItemUtilityClass } from './menuItemClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const overridesResolver = (props, styles) => {
+  const {
+    ownerState
+  } = props;
+  return [styles.root, ownerState.dense && styles.dense, ownerState.divider && styles.divider, !ownerState.disableGutters && styles.gutters];
+};
+const useUtilityClasses = ownerState => {
+  const {
+    disabled,
+    dense,
+    divider,
+    disableGutters,
+    selected,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', dense && 'dense', disabled && 'disabled', !disableGutters && 'gutters', divider && 'divider', selected && 'selected']
+  };
+  const composedClasses = composeClasses(slots, getMenuItemUtilityClass, classes);
+  return _extends({}, classes, composedClasses);
+};
+const MenuItemRoot = styled(ButtonBase, {
+  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
+  name: 'MuiMenuItem',
+  slot: 'Root',
+  overridesResolver
+})(({
+  theme,
+  ownerState
+}) => _extends({}, theme.typography.body1, {
+  display: 'flex',
+  justifyContent: 'flex-start',
+  alignItems: 'center',
+  position: 'relative',
+  textDecoration: 'none',
+  minHeight: 48,
+  paddingTop: 6,
+  paddingBottom: 6,
+  boxSizing: 'border-box',
+  whiteSpace: 'nowrap'
+}, !ownerState.disableGutters && {
+  paddingLeft: 16,
+  paddingRight: 16
+}, ownerState.divider && {
+  borderBottom: `1px solid ${(theme.vars || theme).palette.divider}`,
+  backgroundClip: 'padding-box'
+}, {
+  '&:hover': {
+    textDecoration: 'none',
+    backgroundColor: (theme.vars || theme).palette.action.hover,
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      backgroundColor: 'transparent'
+    }
+  },
+  [`&.${menuItemClasses.selected}`]: {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity),
+    [`&.${menuItemClasses.focusVisible}`]: {
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
+    }
+  },
+  [`&.${menuItemClasses.selected}:hover`]: {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.hoverOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity),
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity)
+    }
+  },
+  [`&.${menuItemClasses.focusVisible}`]: {
+    backgroundColor: (theme.vars || theme).palette.action.focus
+  },
+  [`&.${menuItemClasses.disabled}`]: {
+    opacity: (theme.vars || theme).palette.action.disabledOpacity
+  },
+  [`& + .${dividerClasses.root}`]: {
+    marginTop: theme.spacing(1),
+    marginBottom: theme.spacing(1)
+  },
+  [`& + .${dividerClasses.inset}`]: {
+    marginLeft: 52
+  },
+  [`& .${listItemTextClasses.root}`]: {
+    marginTop: 0,
+    marginBottom: 0
+  },
+  [`& .${listItemTextClasses.inset}`]: {
+    paddingLeft: 36
+  },
+  [`& .${listItemIconClasses.root}`]: {
+    minWidth: 36
+  }
+}, !ownerState.dense && {
+  [theme.breakpoints.up('sm')]: {
+    minHeight: 'auto'
+  }
+}, ownerState.dense && _extends({
+  minHeight: 32,
+  // https://m2.material.io/components/menus#specs > Dense
+  paddingTop: 4,
+  paddingBottom: 4
+}, theme.typography.body2, {
+  [`& .${listItemIconClasses.root} svg`]: {
+    fontSize: '1.25rem'
+  }
+})));
+const MenuItem = /*#__PURE__*/React.forwardRef(function MenuItem(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiMenuItem'
+  });
+  const {
+      autoFocus = false,
+      component = 'li',
+      dense = false,
+      divider = false,
+      disableGutters = false,
+      focusVisibleClassName,
+      role = 'menuitem',
+      tabIndex: tabIndexProp,
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const context = React.useContext(ListContext);
+  const childContext = React.useMemo(() => ({
+    dense: dense || context.dense || false,
+    disableGutters
+  }), [context.dense, dense, disableGutters]);
+  const menuItemRef = React.useRef(null);
+  useEnhancedEffect(() => {
+    if (autoFocus) {
+      if (menuItemRef.current) {
+        menuItemRef.current.focus();
+      } else if (process.env.NODE_ENV !== 'production') {
+        console.error('MUI: Unable to set focus to a MenuItem whose component has not been rendered.');
+      }
+    }
+  }, [autoFocus]);
+  const ownerState = _extends({}, props, {
+    dense: childContext.dense,
+    divider,
+    disableGutters
+  });
+  const classes = useUtilityClasses(props);
+  const handleRef = useForkRef(menuItemRef, ref);
+  let tabIndex;
+  if (!props.disabled) {
+    tabIndex = tabIndexProp !== undefined ? tabIndexProp : -1;
+  }
+  return /*#__PURE__*/_jsx(ListContext.Provider, {
+    value: childContext,
+    children: /*#__PURE__*/_jsx(MenuItemRoot, _extends({
+      ref: handleRef,
+      role: role,
+      tabIndex: tabIndex,
+      component: component,
+      focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName),
+      className: clsx(classes.root, className)
+    }, other, {
+      ownerState: ownerState,
+      classes: classes
+    }))
+  });
+});
+process.env.NODE_ENV !== "production" ? MenuItem.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the list item is focused during the first mount.
+   * Focus will also be triggered if the value changes from false to true.
+   * @default false
+   */
+  autoFocus: PropTypes.bool,
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * If `true`, compact vertical padding designed for keyboard and mouse input is used.
+   * The prop defaults to the value inherited from the parent Menu component.
+   * @default false
+   */
+  dense: PropTypes.bool,
+  /**
+   * @ignore
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the left and right padding is removed.
+   * @default false
+   */
+  disableGutters: PropTypes.bool,
+  /**
+   * If `true`, a 1px light border is added to the bottom of the menu item.
+   * @default false
+   */
+  divider: PropTypes.bool,
+  /**
+   * This prop can help identify which element has keyboard focus.
+   * The class name will be applied when the element gains the focus through keyboard interaction.
+   * It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).
+   * The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md).
+   * A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components
+   * if needed.
+   */
+  focusVisibleClassName: PropTypes.string,
+  /**
+   * @ignore
+   */
+  role: PropTypes /* @typescript-to-proptypes-ignore */.string,
+  /**
+   * If `true`, the component is selected.
+   * @default false
+   */
+  selected: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * @default 0
+   */
+  tabIndex: PropTypes.number
+} : void 0;
+export default MenuItem;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/MenuItem/menuItemClasses.js b/ddb_main/node_modules/@mui/material/MenuItem/menuItemClasses.js
new file mode 100644
index 0000000..db912c9
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/MenuItem/menuItemClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getMenuItemUtilityClass(slot) {
+  return generateUtilityClass('MuiMenuItem', slot);
+}
+const menuItemClasses = generateUtilityClasses('MuiMenuItem', ['root', 'focusVisible', 'dense', 'disabled', 'divider', 'gutters', 'selected']);
+export default menuItemClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/MenuList/MenuList.js b/ddb_main/node_modules/@mui/material/MenuList/MenuList.js
new file mode 100644
index 0000000..6c05501
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/MenuList/MenuList.js
@@ -0,0 +1,284 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["actions", "autoFocus", "autoFocusItem", "children", "className", "disabledItemsFocusable", "disableListWrap", "onKeyDown", "variant"];
+import * as React from 'react';
+import { isFragment } from 'react-is';
+import PropTypes from 'prop-types';
+import ownerDocument from '../utils/ownerDocument';
+import List from '../List';
+import getScrollbarSize from '../utils/getScrollbarSize';
+import useForkRef from '../utils/useForkRef';
+import useEnhancedEffect from '../utils/useEnhancedEffect';
+import { jsx as _jsx } from "react/jsx-runtime";
+function nextItem(list, item, disableListWrap) {
+  if (list === item) {
+    return list.firstChild;
+  }
+  if (item && item.nextElementSibling) {
+    return item.nextElementSibling;
+  }
+  return disableListWrap ? null : list.firstChild;
+}
+function previousItem(list, item, disableListWrap) {
+  if (list === item) {
+    return disableListWrap ? list.firstChild : list.lastChild;
+  }
+  if (item && item.previousElementSibling) {
+    return item.previousElementSibling;
+  }
+  return disableListWrap ? null : list.lastChild;
+}
+function textCriteriaMatches(nextFocus, textCriteria) {
+  if (textCriteria === undefined) {
+    return true;
+  }
+  let text = nextFocus.innerText;
+  if (text === undefined) {
+    // jsdom doesn't support innerText
+    text = nextFocus.textContent;
+  }
+  text = text.trim().toLowerCase();
+  if (text.length === 0) {
+    return false;
+  }
+  if (textCriteria.repeating) {
+    return text[0] === textCriteria.keys[0];
+  }
+  return text.indexOf(textCriteria.keys.join('')) === 0;
+}
+function moveFocus(list, currentFocus, disableListWrap, disabledItemsFocusable, traversalFunction, textCriteria) {
+  let wrappedOnce = false;
+  let nextFocus = traversalFunction(list, currentFocus, currentFocus ? disableListWrap : false);
+  while (nextFocus) {
+    // Prevent infinite loop.
+    if (nextFocus === list.firstChild) {
+      if (wrappedOnce) {
+        return false;
+      }
+      wrappedOnce = true;
+    }
+
+    // Same logic as useAutocomplete.js
+    const nextFocusDisabled = disabledItemsFocusable ? false : nextFocus.disabled || nextFocus.getAttribute('aria-disabled') === 'true';
+    if (!nextFocus.hasAttribute('tabindex') || !textCriteriaMatches(nextFocus, textCriteria) || nextFocusDisabled) {
+      // Move to the next element.
+      nextFocus = traversalFunction(list, nextFocus, disableListWrap);
+    } else {
+      nextFocus.focus();
+      return true;
+    }
+  }
+  return false;
+}
+
+/**
+ * A permanently displayed menu following https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/.
+ * It's exposed to help customization of the [`Menu`](/material-ui/api/menu/) component if you
+ * use it separately you need to move focus into the component manually. Once
+ * the focus is placed inside the component it is fully keyboard accessible.
+ */
+const MenuList = /*#__PURE__*/React.forwardRef(function MenuList(props, ref) {
+  const {
+      // private
+      // eslint-disable-next-line react/prop-types
+      actions,
+      autoFocus = false,
+      autoFocusItem = false,
+      children,
+      className,
+      disabledItemsFocusable = false,
+      disableListWrap = false,
+      onKeyDown,
+      variant = 'selectedMenu'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const listRef = React.useRef(null);
+  const textCriteriaRef = React.useRef({
+    keys: [],
+    repeating: true,
+    previousKeyMatched: true,
+    lastTime: null
+  });
+  useEnhancedEffect(() => {
+    if (autoFocus) {
+      listRef.current.focus();
+    }
+  }, [autoFocus]);
+  React.useImperativeHandle(actions, () => ({
+    adjustStyleForScrollbar: (containerElement, {
+      direction
+    }) => {
+      // Let's ignore that piece of logic if users are already overriding the width
+      // of the menu.
+      const noExplicitWidth = !listRef.current.style.width;
+      if (containerElement.clientHeight < listRef.current.clientHeight && noExplicitWidth) {
+        const scrollbarSize = `${getScrollbarSize(ownerDocument(containerElement))}px`;
+        listRef.current.style[direction === 'rtl' ? 'paddingLeft' : 'paddingRight'] = scrollbarSize;
+        listRef.current.style.width = `calc(100% + ${scrollbarSize})`;
+      }
+      return listRef.current;
+    }
+  }), []);
+  const handleKeyDown = event => {
+    const list = listRef.current;
+    const key = event.key;
+    /**
+     * @type {Element} - will always be defined since we are in a keydown handler
+     * attached to an element. A keydown event is either dispatched to the activeElement
+     * or document.body or document.documentElement. Only the first case will
+     * trigger this specific handler.
+     */
+    const currentFocus = ownerDocument(list).activeElement;
+    if (key === 'ArrowDown') {
+      // Prevent scroll of the page
+      event.preventDefault();
+      moveFocus(list, currentFocus, disableListWrap, disabledItemsFocusable, nextItem);
+    } else if (key === 'ArrowUp') {
+      event.preventDefault();
+      moveFocus(list, currentFocus, disableListWrap, disabledItemsFocusable, previousItem);
+    } else if (key === 'Home') {
+      event.preventDefault();
+      moveFocus(list, null, disableListWrap, disabledItemsFocusable, nextItem);
+    } else if (key === 'End') {
+      event.preventDefault();
+      moveFocus(list, null, disableListWrap, disabledItemsFocusable, previousItem);
+    } else if (key.length === 1) {
+      const criteria = textCriteriaRef.current;
+      const lowerKey = key.toLowerCase();
+      const currTime = performance.now();
+      if (criteria.keys.length > 0) {
+        // Reset
+        if (currTime - criteria.lastTime > 500) {
+          criteria.keys = [];
+          criteria.repeating = true;
+          criteria.previousKeyMatched = true;
+        } else if (criteria.repeating && lowerKey !== criteria.keys[0]) {
+          criteria.repeating = false;
+        }
+      }
+      criteria.lastTime = currTime;
+      criteria.keys.push(lowerKey);
+      const keepFocusOnCurrent = currentFocus && !criteria.repeating && textCriteriaMatches(currentFocus, criteria);
+      if (criteria.previousKeyMatched && (keepFocusOnCurrent || moveFocus(list, currentFocus, false, disabledItemsFocusable, nextItem, criteria))) {
+        event.preventDefault();
+      } else {
+        criteria.previousKeyMatched = false;
+      }
+    }
+    if (onKeyDown) {
+      onKeyDown(event);
+    }
+  };
+  const handleRef = useForkRef(listRef, ref);
+
+  /**
+   * the index of the item should receive focus
+   * in a `variant="selectedMenu"` it's the first `selected` item
+   * otherwise it's the very first item.
+   */
+  let activeItemIndex = -1;
+  // since we inject focus related props into children we have to do a lookahead
+  // to check if there is a `selected` item. We're looking for the last `selected`
+  // item and use the first valid item as a fallback
+  React.Children.forEach(children, (child, index) => {
+    if (! /*#__PURE__*/React.isValidElement(child)) {
+      if (activeItemIndex === index) {
+        activeItemIndex += 1;
+        if (activeItemIndex >= children.length) {
+          // there are no focusable items within the list.
+          activeItemIndex = -1;
+        }
+      }
+      return;
+    }
+    if (process.env.NODE_ENV !== 'production') {
+      if (isFragment(child)) {
+        console.error(["MUI: The Menu component doesn't accept a Fragment as a child.", 'Consider providing an array instead.'].join('\n'));
+      }
+    }
+    if (!child.props.disabled) {
+      if (variant === 'selectedMenu' && child.props.selected) {
+        activeItemIndex = index;
+      } else if (activeItemIndex === -1) {
+        activeItemIndex = index;
+      }
+    }
+    if (activeItemIndex === index && (child.props.disabled || child.props.muiSkipListHighlight || child.type.muiSkipListHighlight)) {
+      activeItemIndex += 1;
+      if (activeItemIndex >= children.length) {
+        // there are no focusable items within the list.
+        activeItemIndex = -1;
+      }
+    }
+  });
+  const items = React.Children.map(children, (child, index) => {
+    if (index === activeItemIndex) {
+      const newChildProps = {};
+      if (autoFocusItem) {
+        newChildProps.autoFocus = true;
+      }
+      if (child.props.tabIndex === undefined && variant === 'selectedMenu') {
+        newChildProps.tabIndex = 0;
+      }
+      return /*#__PURE__*/React.cloneElement(child, newChildProps);
+    }
+    return child;
+  });
+  return /*#__PURE__*/_jsx(List, _extends({
+    role: "menu",
+    ref: handleRef,
+    className: className,
+    onKeyDown: handleKeyDown,
+    tabIndex: autoFocus ? 0 : -1
+  }, other, {
+    children: items
+  }));
+});
+process.env.NODE_ENV !== "production" ? MenuList.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, will focus the `[role="menu"]` container and move into tab order.
+   * @default false
+   */
+  autoFocus: PropTypes.bool,
+  /**
+   * If `true`, will focus the first menuitem if `variant="menu"` or selected item
+   * if `variant="selectedMenu"`.
+   * @default false
+   */
+  autoFocusItem: PropTypes.bool,
+  /**
+   * MenuList contents, normally `MenuItem`s.
+   */
+  children: PropTypes.node,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * If `true`, will allow focus on disabled items.
+   * @default false
+   */
+  disabledItemsFocusable: PropTypes.bool,
+  /**
+   * If `true`, the menu items will not wrap focus.
+   * @default false
+   */
+  disableListWrap: PropTypes.bool,
+  /**
+   * @ignore
+   */
+  onKeyDown: PropTypes.func,
+  /**
+   * The variant to use. Use `menu` to prevent selected items from impacting the initial focus
+   * and the vertical alignment relative to the anchor element.
+   * @default 'selectedMenu'
+   */
+  variant: PropTypes.oneOf(['menu', 'selectedMenu'])
+} : void 0;
+export default MenuList;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Modal/Modal.js b/ddb_main/node_modules/@mui/material/Modal/Modal.js
new file mode 100644
index 0000000..a9dd598
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Modal/Modal.js
@@ -0,0 +1,385 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["BackdropComponent", "BackdropProps", "classes", "className", "closeAfterTransition", "children", "container", "component", "components", "componentsProps", "disableAutoFocus", "disableEnforceFocus", "disableEscapeKeyDown", "disablePortal", "disableRestoreFocus", "disableScrollLock", "hideBackdrop", "keepMounted", "onBackdropClick", "onClose", "onTransitionEnter", "onTransitionExited", "open", "slotProps", "slots", "theme"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import HTMLElementType from '@mui/utils/HTMLElementType';
+import elementAcceptingRef from '@mui/utils/elementAcceptingRef';
+import { useSlotProps } from '@mui/base/utils';
+import { unstable_useModal as useModal } from '@mui/base/unstable_useModal';
+import composeClasses from '@mui/utils/composeClasses';
+import FocusTrap from '../Unstable_TrapFocus';
+import Portal from '../Portal';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import Backdrop from '../Backdrop';
+import { getModalUtilityClass } from './modalClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    open,
+    exited,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', !open && exited && 'hidden'],
+    backdrop: ['backdrop']
+  };
+  return composeClasses(slots, getModalUtilityClass, classes);
+};
+const ModalRoot = styled('div', {
+  name: 'MuiModal',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, !ownerState.open && ownerState.exited && styles.hidden];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  position: 'fixed',
+  zIndex: (theme.vars || theme).zIndex.modal,
+  right: 0,
+  bottom: 0,
+  top: 0,
+  left: 0
+}, !ownerState.open && ownerState.exited && {
+  visibility: 'hidden'
+}));
+const ModalBackdrop = styled(Backdrop, {
+  name: 'MuiModal',
+  slot: 'Backdrop',
+  overridesResolver: (props, styles) => {
+    return styles.backdrop;
+  }
+})({
+  zIndex: -1
+});
+
+/**
+ * Modal is a lower-level construct that is leveraged by the following components:
+ *
+ * - [Dialog](/material-ui/api/dialog/)
+ * - [Drawer](/material-ui/api/drawer/)
+ * - [Menu](/material-ui/api/menu/)
+ * - [Popover](/material-ui/api/popover/)
+ *
+ * If you are creating a modal dialog, you probably want to use the [Dialog](/material-ui/api/dialog/) component
+ * rather than directly using Modal.
+ *
+ * This component shares many concepts with [react-overlays](https://react-bootstrap.github.io/react-overlays/#modals).
+ */
+const Modal = /*#__PURE__*/React.forwardRef(function Modal(inProps, ref) {
+  var _ref, _slots$root, _ref2, _slots$backdrop, _slotProps$root, _slotProps$backdrop;
+  const props = useThemeProps({
+    name: 'MuiModal',
+    props: inProps
+  });
+  const {
+      BackdropComponent = ModalBackdrop,
+      BackdropProps,
+      className,
+      closeAfterTransition = false,
+      children,
+      container,
+      component,
+      components = {},
+      componentsProps = {},
+      disableAutoFocus = false,
+      disableEnforceFocus = false,
+      disableEscapeKeyDown = false,
+      disablePortal = false,
+      disableRestoreFocus = false,
+      disableScrollLock = false,
+      hideBackdrop = false,
+      keepMounted = false,
+      onBackdropClick,
+      open,
+      slotProps,
+      slots
+      // eslint-disable-next-line react/prop-types
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const propsWithDefaults = _extends({}, props, {
+    closeAfterTransition,
+    disableAutoFocus,
+    disableEnforceFocus,
+    disableEscapeKeyDown,
+    disablePortal,
+    disableRestoreFocus,
+    disableScrollLock,
+    hideBackdrop,
+    keepMounted
+  });
+  const {
+    getRootProps,
+    getBackdropProps,
+    getTransitionProps,
+    portalRef,
+    isTopModal,
+    exited,
+    hasTransition
+  } = useModal(_extends({}, propsWithDefaults, {
+    rootRef: ref
+  }));
+  const ownerState = _extends({}, propsWithDefaults, {
+    exited
+  });
+  const classes = useUtilityClasses(ownerState);
+  const childProps = {};
+  if (children.props.tabIndex === undefined) {
+    childProps.tabIndex = '-1';
+  }
+
+  // It's a Transition like component
+  if (hasTransition) {
+    const {
+      onEnter,
+      onExited
+    } = getTransitionProps();
+    childProps.onEnter = onEnter;
+    childProps.onExited = onExited;
+  }
+  const RootSlot = (_ref = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components.Root) != null ? _ref : ModalRoot;
+  const BackdropSlot = (_ref2 = (_slots$backdrop = slots == null ? void 0 : slots.backdrop) != null ? _slots$backdrop : components.Backdrop) != null ? _ref2 : BackdropComponent;
+  const rootSlotProps = (_slotProps$root = slotProps == null ? void 0 : slotProps.root) != null ? _slotProps$root : componentsProps.root;
+  const backdropSlotProps = (_slotProps$backdrop = slotProps == null ? void 0 : slotProps.backdrop) != null ? _slotProps$backdrop : componentsProps.backdrop;
+  const rootProps = useSlotProps({
+    elementType: RootSlot,
+    externalSlotProps: rootSlotProps,
+    externalForwardedProps: other,
+    getSlotProps: getRootProps,
+    additionalProps: {
+      ref,
+      as: component
+    },
+    ownerState,
+    className: clsx(className, rootSlotProps == null ? void 0 : rootSlotProps.className, classes == null ? void 0 : classes.root, !ownerState.open && ownerState.exited && (classes == null ? void 0 : classes.hidden))
+  });
+  const backdropProps = useSlotProps({
+    elementType: BackdropSlot,
+    externalSlotProps: backdropSlotProps,
+    additionalProps: BackdropProps,
+    getSlotProps: otherHandlers => {
+      return getBackdropProps(_extends({}, otherHandlers, {
+        onClick: e => {
+          if (onBackdropClick) {
+            onBackdropClick(e);
+          }
+          if (otherHandlers != null && otherHandlers.onClick) {
+            otherHandlers.onClick(e);
+          }
+        }
+      }));
+    },
+    className: clsx(backdropSlotProps == null ? void 0 : backdropSlotProps.className, BackdropProps == null ? void 0 : BackdropProps.className, classes == null ? void 0 : classes.backdrop),
+    ownerState
+  });
+  if (!keepMounted && !open && (!hasTransition || exited)) {
+    return null;
+  }
+  return /*#__PURE__*/_jsx(Portal, {
+    ref: portalRef,
+    container: container,
+    disablePortal: disablePortal,
+    children: /*#__PURE__*/_jsxs(RootSlot, _extends({}, rootProps, {
+      children: [!hideBackdrop && BackdropComponent ? /*#__PURE__*/_jsx(BackdropSlot, _extends({}, backdropProps)) : null, /*#__PURE__*/_jsx(FocusTrap, {
+        disableEnforceFocus: disableEnforceFocus,
+        disableAutoFocus: disableAutoFocus,
+        disableRestoreFocus: disableRestoreFocus,
+        isEnabled: isTopModal,
+        open: open,
+        children: /*#__PURE__*/React.cloneElement(children, childProps)
+      })]
+    }))
+  });
+});
+process.env.NODE_ENV !== "production" ? Modal.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * A backdrop component. This prop enables custom backdrop rendering.
+   * @deprecated Use `slots.backdrop` instead. While this prop currently works, it will be removed in the next major version.
+   * Use the `slots.backdrop` prop to make your application ready for the next version of Material UI.
+   * @default styled(Backdrop, {
+   *   name: 'MuiModal',
+   *   slot: 'Backdrop',
+   *   overridesResolver: (props, styles) => {
+   *     return styles.backdrop;
+   *   },
+   * })({
+   *   zIndex: -1,
+   * })
+   */
+  BackdropComponent: PropTypes.elementType,
+  /**
+   * Props applied to the [`Backdrop`](/material-ui/api/backdrop/) element.
+   * @deprecated Use `slotProps.backdrop` instead.
+   */
+  BackdropProps: PropTypes.object,
+  /**
+   * A single child content element.
+   */
+  children: elementAcceptingRef.isRequired,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * When set to true the Modal waits until a nested Transition is completed before closing.
+   * @default false
+   */
+  closeAfterTransition: PropTypes.bool,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `slots` prop.
+   * It's recommended to use the `slots` prop instead.
+   *
+   * @default {}
+   */
+  components: PropTypes.shape({
+    Backdrop: PropTypes.elementType,
+    Root: PropTypes.elementType
+  }),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * This prop is an alias for the `slotProps` prop.
+   * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
+   *
+   * @default {}
+   */
+  componentsProps: PropTypes.shape({
+    backdrop: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * An HTML element or function that returns one.
+   * The `container` will have the portal children appended to it.
+   *
+   * You can also provide a callback, which is called in a React layout effect.
+   * This lets you set the container from a ref, and also makes server-side rendering possible.
+   *
+   * By default, it uses the body of the top-level document object,
+   * so it's simply `document.body` most of the time.
+   */
+  container: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([HTMLElementType, PropTypes.func]),
+  /**
+   * If `true`, the modal will not automatically shift focus to itself when it opens, and
+   * replace it to the last focused element when it closes.
+   * This also works correctly with any modal children that have the `disableAutoFocus` prop.
+   *
+   * Generally this should never be set to `true` as it makes the modal less
+   * accessible to assistive technologies, like screen readers.
+   * @default false
+   */
+  disableAutoFocus: PropTypes.bool,
+  /**
+   * If `true`, the modal will not prevent focus from leaving the modal while open.
+   *
+   * Generally this should never be set to `true` as it makes the modal less
+   * accessible to assistive technologies, like screen readers.
+   * @default false
+   */
+  disableEnforceFocus: PropTypes.bool,
+  /**
+   * If `true`, hitting escape will not fire the `onClose` callback.
+   * @default false
+   */
+  disableEscapeKeyDown: PropTypes.bool,
+  /**
+   * The `children` will be under the DOM hierarchy of the parent component.
+   * @default false
+   */
+  disablePortal: PropTypes.bool,
+  /**
+   * If `true`, the modal will not restore focus to previously focused element once
+   * modal is hidden or unmounted.
+   * @default false
+   */
+  disableRestoreFocus: PropTypes.bool,
+  /**
+   * Disable the scroll lock behavior.
+   * @default false
+   */
+  disableScrollLock: PropTypes.bool,
+  /**
+   * If `true`, the backdrop is not rendered.
+   * @default false
+   */
+  hideBackdrop: PropTypes.bool,
+  /**
+   * Always keep the children in the DOM.
+   * This prop can be useful in SEO situation or
+   * when you want to maximize the responsiveness of the Modal.
+   * @default false
+   */
+  keepMounted: PropTypes.bool,
+  /**
+   * Callback fired when the backdrop is clicked.
+   * @deprecated Use the `onClose` prop with the `reason` argument to handle the `backdropClick` events.
+   */
+  onBackdropClick: PropTypes.func,
+  /**
+   * Callback fired when the component requests to be closed.
+   * The `reason` parameter can optionally be used to control the response to `onClose`.
+   *
+   * @param {object} event The event source of the callback.
+   * @param {string} reason Can be: `"escapeKeyDown"`, `"backdropClick"`.
+   */
+  onClose: PropTypes.func,
+  /**
+   * A function called when a transition enters.
+   */
+  onTransitionEnter: PropTypes.func,
+  /**
+   * A function called when a transition has exited.
+   */
+  onTransitionExited: PropTypes.func,
+  /**
+   * If `true`, the component is shown.
+   */
+  open: PropTypes.bool.isRequired,
+  /**
+   * The props used for each slot inside the Modal.
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    backdrop: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * The components used for each slot inside the Modal.
+   * Either a string to use a HTML element or a component.
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    backdrop: PropTypes.elementType,
+    root: PropTypes.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default Modal;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Modal/modalClasses.js b/ddb_main/node_modules/@mui/material/Modal/modalClasses.js
new file mode 100644
index 0000000..68d16c8
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Modal/modalClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getModalUtilityClass(slot) {
+  return generateUtilityClass('MuiModal', slot);
+}
+const modalClasses = generateUtilityClasses('MuiModal', ['root', 'hidden', 'backdrop']);
+export default modalClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/NativeSelect/NativeSelectInput.js b/ddb_main/node_modules/@mui/material/NativeSelect/NativeSelectInput.js
new file mode 100644
index 0000000..5e8f4a1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/NativeSelect/NativeSelectInput.js
@@ -0,0 +1,217 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "disabled", "error", "IconComponent", "inputRef", "variant"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import refType from '@mui/utils/refType';
+import composeClasses from '@mui/utils/composeClasses';
+import capitalize from '../utils/capitalize';
+import nativeSelectClasses, { getNativeSelectUtilityClasses } from './nativeSelectClasses';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    variant,
+    disabled,
+    multiple,
+    open,
+    error
+  } = ownerState;
+  const slots = {
+    select: ['select', variant, disabled && 'disabled', multiple && 'multiple', error && 'error'],
+    icon: ['icon', `icon${capitalize(variant)}`, open && 'iconOpen', disabled && 'disabled']
+  };
+  return composeClasses(slots, getNativeSelectUtilityClasses, classes);
+};
+export const nativeSelectSelectStyles = ({
+  ownerState,
+  theme
+}) => _extends({
+  MozAppearance: 'none',
+  // Reset
+  WebkitAppearance: 'none',
+  // Reset
+  // When interacting quickly, the text can end up selected.
+  // Native select can't be selected either.
+  userSelect: 'none',
+  borderRadius: 0,
+  // Reset
+  cursor: 'pointer',
+  '&:focus': _extends({}, theme.vars ? {
+    backgroundColor: `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.05)`
+  } : {
+    backgroundColor: theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.05)' : 'rgba(255, 255, 255, 0.05)'
+  }, {
+    borderRadius: 0 // Reset Chrome style
+  }),
+  // Remove IE11 arrow
+  '&::-ms-expand': {
+    display: 'none'
+  },
+  [`&.${nativeSelectClasses.disabled}`]: {
+    cursor: 'default'
+  },
+  '&[multiple]': {
+    height: 'auto'
+  },
+  '&:not([multiple]) option, &:not([multiple]) optgroup': {
+    backgroundColor: (theme.vars || theme).palette.background.paper
+  },
+  // Bump specificity to allow extending custom inputs
+  '&&&': {
+    paddingRight: 24,
+    minWidth: 16 // So it doesn't collapse.
+  }
+}, ownerState.variant === 'filled' && {
+  '&&&': {
+    paddingRight: 32
+  }
+}, ownerState.variant === 'outlined' && {
+  borderRadius: (theme.vars || theme).shape.borderRadius,
+  '&:focus': {
+    borderRadius: (theme.vars || theme).shape.borderRadius // Reset the reset for Chrome style
+  },
+  '&&&': {
+    paddingRight: 32
+  }
+});
+const NativeSelectSelect = styled('select', {
+  name: 'MuiNativeSelect',
+  slot: 'Select',
+  shouldForwardProp: rootShouldForwardProp,
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.select, styles[ownerState.variant], ownerState.error && styles.error, {
+      [`&.${nativeSelectClasses.multiple}`]: styles.multiple
+    }];
+  }
+})(nativeSelectSelectStyles);
+export const nativeSelectIconStyles = ({
+  ownerState,
+  theme
+}) => _extends({
+  // We use a position absolute over a flexbox in order to forward the pointer events
+  // to the input and to support wrapping tags..
+  position: 'absolute',
+  right: 0,
+  top: 'calc(50% - .5em)',
+  // Center vertically, height is 1em
+  pointerEvents: 'none',
+  // Don't block pointer events on the select under the icon.
+  color: (theme.vars || theme).palette.action.active,
+  [`&.${nativeSelectClasses.disabled}`]: {
+    color: (theme.vars || theme).palette.action.disabled
+  }
+}, ownerState.open && {
+  transform: 'rotate(180deg)'
+}, ownerState.variant === 'filled' && {
+  right: 7
+}, ownerState.variant === 'outlined' && {
+  right: 7
+});
+const NativeSelectIcon = styled('svg', {
+  name: 'MuiNativeSelect',
+  slot: 'Icon',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.icon, ownerState.variant && styles[`icon${capitalize(ownerState.variant)}`], ownerState.open && styles.iconOpen];
+  }
+})(nativeSelectIconStyles);
+
+/**
+ * @ignore - internal component.
+ */
+const NativeSelectInput = /*#__PURE__*/React.forwardRef(function NativeSelectInput(props, ref) {
+  const {
+      className,
+      disabled,
+      error,
+      IconComponent,
+      inputRef,
+      variant = 'standard'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    disabled,
+    variant,
+    error
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsxs(React.Fragment, {
+    children: [/*#__PURE__*/_jsx(NativeSelectSelect, _extends({
+      ownerState: ownerState,
+      className: clsx(classes.select, className),
+      disabled: disabled,
+      ref: inputRef || ref
+    }, other)), props.multiple ? null : /*#__PURE__*/_jsx(NativeSelectIcon, {
+      as: IconComponent,
+      ownerState: ownerState,
+      className: classes.icon
+    })]
+  });
+});
+process.env.NODE_ENV !== "production" ? NativeSelectInput.propTypes = {
+  /**
+   * The option elements to populate the select with.
+   * Can be some `<option>` elements.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * The CSS class name of the select element.
+   */
+  className: PropTypes.string,
+  /**
+   * If `true`, the select is disabled.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the `select input` will indicate an error.
+   */
+  error: PropTypes.bool,
+  /**
+   * The icon that displays the arrow.
+   */
+  IconComponent: PropTypes.elementType.isRequired,
+  /**
+   * Use that prop to pass a ref to the native select element.
+   * @deprecated
+   */
+  inputRef: refType,
+  /**
+   * @ignore
+   */
+  multiple: PropTypes.bool,
+  /**
+   * Name attribute of the `select` or hidden `input` element.
+   */
+  name: PropTypes.string,
+  /**
+   * Callback fired when a menu item is selected.
+   *
+   * @param {object} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   */
+  onChange: PropTypes.func,
+  /**
+   * The input value.
+   */
+  value: PropTypes.any,
+  /**
+   * The variant to use.
+   */
+  variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])
+} : void 0;
+export default NativeSelectInput;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/NativeSelect/nativeSelectClasses.js b/ddb_main/node_modules/@mui/material/NativeSelect/nativeSelectClasses.js
new file mode 100644
index 0000000..ac78a67
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/NativeSelect/nativeSelectClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getNativeSelectUtilityClasses(slot) {
+  return generateUtilityClass('MuiNativeSelect', slot);
+}
+const nativeSelectClasses = generateUtilityClasses('MuiNativeSelect', ['root', 'select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput', 'error']);
+export default nativeSelectClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/OutlinedInput/NotchedOutline.js b/ddb_main/node_modules/@mui/material/OutlinedInput/NotchedOutline.js
new file mode 100644
index 0000000..d26e6c3
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/OutlinedInput/NotchedOutline.js
@@ -0,0 +1,135 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+var _span;
+const _excluded = ["children", "classes", "className", "label", "notched"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import { jsx as _jsx } from "react/jsx-runtime";
+const NotchedOutlineRoot = styled('fieldset', {
+  shouldForwardProp: rootShouldForwardProp
+})({
+  textAlign: 'left',
+  position: 'absolute',
+  bottom: 0,
+  right: 0,
+  top: -5,
+  left: 0,
+  margin: 0,
+  padding: '0 8px',
+  pointerEvents: 'none',
+  borderRadius: 'inherit',
+  borderStyle: 'solid',
+  borderWidth: 1,
+  overflow: 'hidden',
+  minWidth: '0%'
+});
+const NotchedOutlineLegend = styled('legend', {
+  shouldForwardProp: rootShouldForwardProp
+})(({
+  ownerState,
+  theme
+}) => _extends({
+  float: 'unset',
+  // Fix conflict with bootstrap
+  width: 'auto',
+  // Fix conflict with bootstrap
+  overflow: 'hidden'
+}, !ownerState.withLabel && {
+  padding: 0,
+  lineHeight: '11px',
+  // sync with `height` in `legend` styles
+  transition: theme.transitions.create('width', {
+    duration: 150,
+    easing: theme.transitions.easing.easeOut
+  })
+}, ownerState.withLabel && _extends({
+  display: 'block',
+  // Fix conflict with normalize.css and sanitize.css
+  padding: 0,
+  height: 11,
+  // sync with `lineHeight` in `legend` styles
+  fontSize: '0.75em',
+  visibility: 'hidden',
+  maxWidth: 0.01,
+  transition: theme.transitions.create('max-width', {
+    duration: 50,
+    easing: theme.transitions.easing.easeOut
+  }),
+  whiteSpace: 'nowrap',
+  '& > span': {
+    paddingLeft: 5,
+    paddingRight: 5,
+    display: 'inline-block',
+    opacity: 0,
+    visibility: 'visible'
+  }
+}, ownerState.notched && {
+  maxWidth: '100%',
+  transition: theme.transitions.create('max-width', {
+    duration: 100,
+    easing: theme.transitions.easing.easeOut,
+    delay: 50
+  })
+})));
+
+/**
+ * @ignore - internal component.
+ */
+export default function NotchedOutline(props) {
+  const {
+      className,
+      label,
+      notched
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const withLabel = label != null && label !== '';
+  const ownerState = _extends({}, props, {
+    notched,
+    withLabel
+  });
+  return /*#__PURE__*/_jsx(NotchedOutlineRoot, _extends({
+    "aria-hidden": true,
+    className: className,
+    ownerState: ownerState
+  }, other, {
+    children: /*#__PURE__*/_jsx(NotchedOutlineLegend, {
+      ownerState: ownerState,
+      children: withLabel ? /*#__PURE__*/_jsx("span", {
+        children: label
+      }) : // notranslate needed while Google Translate will not fix zero-width space issue
+      _span || (_span = /*#__PURE__*/_jsx("span", {
+        className: "notranslate",
+        children: "\u200B"
+      }))
+    })
+  }));
+}
+process.env.NODE_ENV !== "production" ? NotchedOutline.propTypes = {
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The label.
+   */
+  label: PropTypes.node,
+  /**
+   * If `true`, the outline is notched to accommodate the label.
+   */
+  notched: PropTypes.bool.isRequired,
+  /**
+   * @ignore
+   */
+  style: PropTypes.object
+} : void 0;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/OutlinedInput/OutlinedInput.js b/ddb_main/node_modules/@mui/material/OutlinedInput/OutlinedInput.js
new file mode 100644
index 0000000..e917f06
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/OutlinedInput/OutlinedInput.js
@@ -0,0 +1,350 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["components", "fullWidth", "inputComponent", "label", "multiline", "notched", "slots", "type"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import refType from '@mui/utils/refType';
+import composeClasses from '@mui/utils/composeClasses';
+import NotchedOutline from './NotchedOutline';
+import useFormControl from '../FormControl/useFormControl';
+import formControlState from '../FormControl/formControlState';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import outlinedInputClasses, { getOutlinedInputUtilityClass } from './outlinedInputClasses';
+import InputBase, { rootOverridesResolver as inputBaseRootOverridesResolver, inputOverridesResolver as inputBaseInputOverridesResolver, InputBaseRoot, InputBaseComponent as InputBaseInput } from '../InputBase/InputBase';
+import useThemeProps from '../styles/useThemeProps';
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root'],
+    notchedOutline: ['notchedOutline'],
+    input: ['input']
+  };
+  const composedClasses = composeClasses(slots, getOutlinedInputUtilityClass, classes);
+  return _extends({}, classes, composedClasses);
+};
+const OutlinedInputRoot = styled(InputBaseRoot, {
+  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
+  name: 'MuiOutlinedInput',
+  slot: 'Root',
+  overridesResolver: inputBaseRootOverridesResolver
+})(({
+  theme,
+  ownerState
+}) => {
+  const borderColor = theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)';
+  return _extends({
+    position: 'relative',
+    borderRadius: (theme.vars || theme).shape.borderRadius,
+    [`&:hover .${outlinedInputClasses.notchedOutline}`]: {
+      borderColor: (theme.vars || theme).palette.text.primary
+    },
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      [`&:hover .${outlinedInputClasses.notchedOutline}`]: {
+        borderColor: theme.vars ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : borderColor
+      }
+    },
+    [`&.${outlinedInputClasses.focused} .${outlinedInputClasses.notchedOutline}`]: {
+      borderColor: (theme.vars || theme).palette[ownerState.color].main,
+      borderWidth: 2
+    },
+    [`&.${outlinedInputClasses.error} .${outlinedInputClasses.notchedOutline}`]: {
+      borderColor: (theme.vars || theme).palette.error.main
+    },
+    [`&.${outlinedInputClasses.disabled} .${outlinedInputClasses.notchedOutline}`]: {
+      borderColor: (theme.vars || theme).palette.action.disabled
+    }
+  }, ownerState.startAdornment && {
+    paddingLeft: 14
+  }, ownerState.endAdornment && {
+    paddingRight: 14
+  }, ownerState.multiline && _extends({
+    padding: '16.5px 14px'
+  }, ownerState.size === 'small' && {
+    padding: '8.5px 14px'
+  }));
+});
+const NotchedOutlineRoot = styled(NotchedOutline, {
+  name: 'MuiOutlinedInput',
+  slot: 'NotchedOutline',
+  overridesResolver: (props, styles) => styles.notchedOutline
+})(({
+  theme
+}) => {
+  const borderColor = theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)';
+  return {
+    borderColor: theme.vars ? `rgba(${theme.vars.palette.common.onBackgroundChannel} / 0.23)` : borderColor
+  };
+});
+const OutlinedInputInput = styled(InputBaseInput, {
+  name: 'MuiOutlinedInput',
+  slot: 'Input',
+  overridesResolver: inputBaseInputOverridesResolver
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  padding: '16.5px 14px'
+}, !theme.vars && {
+  '&:-webkit-autofill': {
+    WebkitBoxShadow: theme.palette.mode === 'light' ? null : '0 0 0 100px #266798 inset',
+    WebkitTextFillColor: theme.palette.mode === 'light' ? null : '#fff',
+    caretColor: theme.palette.mode === 'light' ? null : '#fff',
+    borderRadius: 'inherit'
+  }
+}, theme.vars && {
+  '&:-webkit-autofill': {
+    borderRadius: 'inherit'
+  },
+  [theme.getColorSchemeSelector('dark')]: {
+    '&:-webkit-autofill': {
+      WebkitBoxShadow: '0 0 0 100px #266798 inset',
+      WebkitTextFillColor: '#fff',
+      caretColor: '#fff'
+    }
+  }
+}, ownerState.size === 'small' && {
+  padding: '8.5px 14px'
+}, ownerState.multiline && {
+  padding: 0
+}, ownerState.startAdornment && {
+  paddingLeft: 0
+}, ownerState.endAdornment && {
+  paddingRight: 0
+}));
+const OutlinedInput = /*#__PURE__*/React.forwardRef(function OutlinedInput(inProps, ref) {
+  var _ref, _slots$root, _ref2, _slots$input, _React$Fragment;
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiOutlinedInput'
+  });
+  const {
+      components = {},
+      fullWidth = false,
+      inputComponent = 'input',
+      label,
+      multiline = false,
+      notched,
+      slots = {},
+      type = 'text'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const classes = useUtilityClasses(props);
+  const muiFormControl = useFormControl();
+  const fcs = formControlState({
+    props,
+    muiFormControl,
+    states: ['color', 'disabled', 'error', 'focused', 'hiddenLabel', 'size', 'required']
+  });
+  const ownerState = _extends({}, props, {
+    color: fcs.color || 'primary',
+    disabled: fcs.disabled,
+    error: fcs.error,
+    focused: fcs.focused,
+    formControl: muiFormControl,
+    fullWidth,
+    hiddenLabel: fcs.hiddenLabel,
+    multiline,
+    size: fcs.size,
+    type
+  });
+  const RootSlot = (_ref = (_slots$root = slots.root) != null ? _slots$root : components.Root) != null ? _ref : OutlinedInputRoot;
+  const InputSlot = (_ref2 = (_slots$input = slots.input) != null ? _slots$input : components.Input) != null ? _ref2 : OutlinedInputInput;
+  return /*#__PURE__*/_jsx(InputBase, _extends({
+    slots: {
+      root: RootSlot,
+      input: InputSlot
+    },
+    renderSuffix: state => /*#__PURE__*/_jsx(NotchedOutlineRoot, {
+      ownerState: ownerState,
+      className: classes.notchedOutline,
+      label: label != null && label !== '' && fcs.required ? _React$Fragment || (_React$Fragment = /*#__PURE__*/_jsxs(React.Fragment, {
+        children: [label, "\u2009", '*']
+      })) : label,
+      notched: typeof notched !== 'undefined' ? notched : Boolean(state.startAdornment || state.filled || state.focused)
+    }),
+    fullWidth: fullWidth,
+    inputComponent: inputComponent,
+    multiline: multiline,
+    ref: ref,
+    type: type
+  }, other, {
+    classes: _extends({}, classes, {
+      notchedOutline: null
+    })
+  }));
+});
+process.env.NODE_ENV !== "production" ? OutlinedInput.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * This prop helps users to fill forms faster, especially on mobile devices.
+   * The name can be confusing, as it's more like an autofill.
+   * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).
+   */
+  autoComplete: PropTypes.string,
+  /**
+   * If `true`, the `input` element is focused during the first mount.
+   */
+  autoFocus: PropTypes.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * The prop defaults to the value (`'primary'`) inherited from the parent FormControl component.
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['primary', 'secondary']), PropTypes.string]),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `slots` prop.
+   * It's recommended to use the `slots` prop instead.
+   *
+   * @default {}
+   */
+  components: PropTypes.shape({
+    Input: PropTypes.elementType,
+    Root: PropTypes.elementType
+  }),
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue: PropTypes.any,
+  /**
+   * If `true`, the component is disabled.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * End `InputAdornment` for this component.
+   */
+  endAdornment: PropTypes.node,
+  /**
+   * If `true`, the `input` will indicate an error.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  error: PropTypes.bool,
+  /**
+   * If `true`, the `input` will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: PropTypes.bool,
+  /**
+   * The id of the `input` element.
+   */
+  id: PropTypes.string,
+  /**
+   * The component used for the `input` element.
+   * Either a string to use a HTML element or a component.
+   * @default 'input'
+   */
+  inputComponent: PropTypes.elementType,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   * @default {}
+   */
+  inputProps: PropTypes.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: refType,
+  /**
+   * The label of the `input`. It is only used for layout. The actual labelling
+   * is handled by `InputLabel`.
+   */
+  label: PropTypes.node,
+  /**
+   * If `dense`, will adjust vertical spacing. This is normally obtained via context from
+   * FormControl.
+   * The prop defaults to the value (`'none'`) inherited from the parent FormControl component.
+   */
+  margin: PropTypes.oneOf(['dense', 'none']),
+  /**
+   * Maximum number of rows to display when multiline option is set to true.
+   */
+  maxRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * Minimum number of rows to display when multiline option is set to true.
+   */
+  minRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered.
+   * @default false
+   */
+  multiline: PropTypes.bool,
+  /**
+   * Name attribute of the `input` element.
+   */
+  name: PropTypes.string,
+  /**
+   * If `true`, the outline is notched to accommodate the label.
+   */
+  notched: PropTypes.bool,
+  /**
+   * Callback fired when the value is changed.
+   *
+   * @param {React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   */
+  onChange: PropTypes.func,
+  /**
+   * The short hint displayed in the `input` before the user enters a value.
+   */
+  placeholder: PropTypes.string,
+  /**
+   * It prevents the user from changing the value of the field
+   * (not from interacting with the field).
+   */
+  readOnly: PropTypes.bool,
+  /**
+   * If `true`, the `input` element is required.
+   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
+   */
+  required: PropTypes.bool,
+  /**
+   * Number of rows to display when multiline option is set to true.
+   */
+  rows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `components` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    input: PropTypes.elementType,
+    root: PropTypes.elementType
+  }),
+  /**
+   * Start `InputAdornment` for this component.
+   */
+  startAdornment: PropTypes.node,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).
+   * @default 'text'
+   */
+  type: PropTypes.string,
+  /**
+   * The value of the `input` element, required for a controlled component.
+   */
+  value: PropTypes.any
+} : void 0;
+OutlinedInput.muiName = 'Input';
+export default OutlinedInput;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/OutlinedInput/outlinedInputClasses.js b/ddb_main/node_modules/@mui/material/OutlinedInput/outlinedInputClasses.js
new file mode 100644
index 0000000..3e879ee
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/OutlinedInput/outlinedInputClasses.js
@@ -0,0 +1,9 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import { inputBaseClasses } from '../InputBase';
+export function getOutlinedInputUtilityClass(slot) {
+  return generateUtilityClass('MuiOutlinedInput', slot);
+}
+const outlinedInputClasses = _extends({}, inputBaseClasses, generateUtilityClasses('MuiOutlinedInput', ['root', 'notchedOutline', 'input']));
+export default outlinedInputClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Paper/Paper.js b/ddb_main/node_modules/@mui/material/Paper/Paper.js
new file mode 100644
index 0000000..cace667
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Paper/Paper.js
@@ -0,0 +1,147 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "component", "elevation", "square", "variant"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import integerPropType from '@mui/utils/integerPropType';
+import chainPropTypes from '@mui/utils/chainPropTypes';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha } from '@mui/system/colorManipulator';
+import styled from '../styles/styled';
+import getOverlayAlpha from '../styles/getOverlayAlpha';
+import useThemeProps from '../styles/useThemeProps';
+import useTheme from '../styles/useTheme';
+import { getPaperUtilityClass } from './paperClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    square,
+    elevation,
+    variant,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', variant, !square && 'rounded', variant === 'elevation' && `elevation${elevation}`]
+  };
+  return composeClasses(slots, getPaperUtilityClass, classes);
+};
+const PaperRoot = styled('div', {
+  name: 'MuiPaper',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, styles[ownerState.variant], !ownerState.square && styles.rounded, ownerState.variant === 'elevation' && styles[`elevation${ownerState.elevation}`]];
+  }
+})(({
+  theme,
+  ownerState
+}) => {
+  var _theme$vars$overlays;
+  return _extends({
+    backgroundColor: (theme.vars || theme).palette.background.paper,
+    color: (theme.vars || theme).palette.text.primary,
+    transition: theme.transitions.create('box-shadow')
+  }, !ownerState.square && {
+    borderRadius: theme.shape.borderRadius
+  }, ownerState.variant === 'outlined' && {
+    border: `1px solid ${(theme.vars || theme).palette.divider}`
+  }, ownerState.variant === 'elevation' && _extends({
+    boxShadow: (theme.vars || theme).shadows[ownerState.elevation]
+  }, !theme.vars && theme.palette.mode === 'dark' && {
+    backgroundImage: `linear-gradient(${alpha('#fff', getOverlayAlpha(ownerState.elevation))}, ${alpha('#fff', getOverlayAlpha(ownerState.elevation))})`
+  }, theme.vars && {
+    backgroundImage: (_theme$vars$overlays = theme.vars.overlays) == null ? void 0 : _theme$vars$overlays[ownerState.elevation]
+  }));
+});
+const Paper = /*#__PURE__*/React.forwardRef(function Paper(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiPaper'
+  });
+  const {
+      className,
+      component = 'div',
+      elevation = 1,
+      square = false,
+      variant = 'elevation'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    component,
+    elevation,
+    square,
+    variant
+  });
+  const classes = useUtilityClasses(ownerState);
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const theme = useTheme();
+    if (theme.shadows[elevation] === undefined) {
+      console.error([`MUI: The elevation provided <Paper elevation={${elevation}}> is not available in the theme.`, `Please make sure that \`theme.shadows[${elevation}]\` is defined.`].join('\n'));
+    }
+  }
+  return /*#__PURE__*/_jsx(PaperRoot, _extends({
+    as: component,
+    ownerState: ownerState,
+    className: clsx(classes.root, className),
+    ref: ref
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? Paper.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * Shadow depth, corresponds to `dp` in the spec.
+   * It accepts values between 0 and 24 inclusive.
+   * @default 1
+   */
+  elevation: chainPropTypes(integerPropType, props => {
+    const {
+      elevation,
+      variant
+    } = props;
+    if (elevation > 0 && variant === 'outlined') {
+      return new Error(`MUI: Combining \`elevation={${elevation}}\` with \`variant="${variant}"\` has no effect. Either use \`elevation={0}\` or use a different \`variant\`.`);
+    }
+    return null;
+  }),
+  /**
+   * If `true`, rounded corners are disabled.
+   * @default false
+   */
+  square: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The variant to use.
+   * @default 'elevation'
+   */
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['elevation', 'outlined']), PropTypes.string])
+} : void 0;
+export default Paper;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Paper/paperClasses.js b/ddb_main/node_modules/@mui/material/Paper/paperClasses.js
new file mode 100644
index 0000000..47ccbd0
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Paper/paperClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getPaperUtilityClass(slot) {
+  return generateUtilityClass('MuiPaper', slot);
+}
+const paperClasses = generateUtilityClasses('MuiPaper', ['root', 'rounded', 'outlined', 'elevation', 'elevation0', 'elevation1', 'elevation2', 'elevation3', 'elevation4', 'elevation5', 'elevation6', 'elevation7', 'elevation8', 'elevation9', 'elevation10', 'elevation11', 'elevation12', 'elevation13', 'elevation14', 'elevation15', 'elevation16', 'elevation17', 'elevation18', 'elevation19', 'elevation20', 'elevation21', 'elevation22', 'elevation23', 'elevation24']);
+export default paperClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Popover/Popover.js b/ddb_main/node_modules/@mui/material/Popover/Popover.js
new file mode 100644
index 0000000..76a12c5
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Popover/Popover.js
@@ -0,0 +1,536 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["onEntering"],
+  _excluded2 = ["action", "anchorEl", "anchorOrigin", "anchorPosition", "anchorReference", "children", "className", "container", "elevation", "marginThreshold", "open", "PaperProps", "slots", "slotProps", "transformOrigin", "TransitionComponent", "transitionDuration", "TransitionProps", "disableScrollLock"],
+  _excluded3 = ["slotProps"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { useSlotProps, isHostComponent } from '@mui/base/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import HTMLElementType from '@mui/utils/HTMLElementType';
+import refType from '@mui/utils/refType';
+import elementTypeAcceptingRef from '@mui/utils/elementTypeAcceptingRef';
+import integerPropType from '@mui/utils/integerPropType';
+import chainPropTypes from '@mui/utils/chainPropTypes';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import debounce from '../utils/debounce';
+import ownerDocument from '../utils/ownerDocument';
+import ownerWindow from '../utils/ownerWindow';
+import useForkRef from '../utils/useForkRef';
+import Grow from '../Grow';
+import Modal from '../Modal';
+import PaperBase from '../Paper';
+import { getPopoverUtilityClass } from './popoverClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+export function getOffsetTop(rect, vertical) {
+  let offset = 0;
+  if (typeof vertical === 'number') {
+    offset = vertical;
+  } else if (vertical === 'center') {
+    offset = rect.height / 2;
+  } else if (vertical === 'bottom') {
+    offset = rect.height;
+  }
+  return offset;
+}
+export function getOffsetLeft(rect, horizontal) {
+  let offset = 0;
+  if (typeof horizontal === 'number') {
+    offset = horizontal;
+  } else if (horizontal === 'center') {
+    offset = rect.width / 2;
+  } else if (horizontal === 'right') {
+    offset = rect.width;
+  }
+  return offset;
+}
+function getTransformOriginValue(transformOrigin) {
+  return [transformOrigin.horizontal, transformOrigin.vertical].map(n => typeof n === 'number' ? `${n}px` : n).join(' ');
+}
+function resolveAnchorEl(anchorEl) {
+  return typeof anchorEl === 'function' ? anchorEl() : anchorEl;
+}
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root'],
+    paper: ['paper']
+  };
+  return composeClasses(slots, getPopoverUtilityClass, classes);
+};
+export const PopoverRoot = styled(Modal, {
+  name: 'MuiPopover',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})({});
+export const PopoverPaper = styled(PaperBase, {
+  name: 'MuiPopover',
+  slot: 'Paper',
+  overridesResolver: (props, styles) => styles.paper
+})({
+  position: 'absolute',
+  overflowY: 'auto',
+  overflowX: 'hidden',
+  // So we see the popover when it's empty.
+  // It's most likely on issue on userland.
+  minWidth: 16,
+  minHeight: 16,
+  maxWidth: 'calc(100% - 32px)',
+  maxHeight: 'calc(100% - 32px)',
+  // We disable the focus ring for mouse, touch and keyboard users.
+  outline: 0
+});
+const Popover = /*#__PURE__*/React.forwardRef(function Popover(inProps, ref) {
+  var _slotProps$paper, _slots$root, _slots$paper;
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiPopover'
+  });
+  const {
+      action,
+      anchorEl,
+      anchorOrigin = {
+        vertical: 'top',
+        horizontal: 'left'
+      },
+      anchorPosition,
+      anchorReference = 'anchorEl',
+      children,
+      className,
+      container: containerProp,
+      elevation = 8,
+      marginThreshold = 16,
+      open,
+      PaperProps: PaperPropsProp = {},
+      slots,
+      slotProps,
+      transformOrigin = {
+        vertical: 'top',
+        horizontal: 'left'
+      },
+      TransitionComponent = Grow,
+      transitionDuration: transitionDurationProp = 'auto',
+      TransitionProps: {
+        onEntering
+      } = {},
+      disableScrollLock = false
+    } = props,
+    TransitionProps = _objectWithoutPropertiesLoose(props.TransitionProps, _excluded),
+    other = _objectWithoutPropertiesLoose(props, _excluded2);
+  const externalPaperSlotProps = (_slotProps$paper = slotProps == null ? void 0 : slotProps.paper) != null ? _slotProps$paper : PaperPropsProp;
+  const paperRef = React.useRef();
+  const handlePaperRef = useForkRef(paperRef, externalPaperSlotProps.ref);
+  const ownerState = _extends({}, props, {
+    anchorOrigin,
+    anchorReference,
+    elevation,
+    marginThreshold,
+    externalPaperSlotProps,
+    transformOrigin,
+    TransitionComponent,
+    transitionDuration: transitionDurationProp,
+    TransitionProps
+  });
+  const classes = useUtilityClasses(ownerState);
+
+  // Returns the top/left offset of the position
+  // to attach to on the anchor element (or body if none is provided)
+  const getAnchorOffset = React.useCallback(() => {
+    if (anchorReference === 'anchorPosition') {
+      if (process.env.NODE_ENV !== 'production') {
+        if (!anchorPosition) {
+          console.error('MUI: You need to provide a `anchorPosition` prop when using ' + '<Popover anchorReference="anchorPosition" />.');
+        }
+      }
+      return anchorPosition;
+    }
+    const resolvedAnchorEl = resolveAnchorEl(anchorEl);
+
+    // If an anchor element wasn't provided, just use the parent body element of this Popover
+    const anchorElement = resolvedAnchorEl && resolvedAnchorEl.nodeType === 1 ? resolvedAnchorEl : ownerDocument(paperRef.current).body;
+    const anchorRect = anchorElement.getBoundingClientRect();
+    if (process.env.NODE_ENV !== 'production') {
+      const box = anchorElement.getBoundingClientRect();
+      if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
+        console.warn(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
+      }
+    }
+    return {
+      top: anchorRect.top + getOffsetTop(anchorRect, anchorOrigin.vertical),
+      left: anchorRect.left + getOffsetLeft(anchorRect, anchorOrigin.horizontal)
+    };
+  }, [anchorEl, anchorOrigin.horizontal, anchorOrigin.vertical, anchorPosition, anchorReference]);
+
+  // Returns the base transform origin using the element
+  const getTransformOrigin = React.useCallback(elemRect => {
+    return {
+      vertical: getOffsetTop(elemRect, transformOrigin.vertical),
+      horizontal: getOffsetLeft(elemRect, transformOrigin.horizontal)
+    };
+  }, [transformOrigin.horizontal, transformOrigin.vertical]);
+  const getPositioningStyle = React.useCallback(element => {
+    const elemRect = {
+      width: element.offsetWidth,
+      height: element.offsetHeight
+    };
+
+    // Get the transform origin point on the element itself
+    const elemTransformOrigin = getTransformOrigin(elemRect);
+    if (anchorReference === 'none') {
+      return {
+        top: null,
+        left: null,
+        transformOrigin: getTransformOriginValue(elemTransformOrigin)
+      };
+    }
+
+    // Get the offset of the anchoring element
+    const anchorOffset = getAnchorOffset();
+
+    // Calculate element positioning
+    let top = anchorOffset.top - elemTransformOrigin.vertical;
+    let left = anchorOffset.left - elemTransformOrigin.horizontal;
+    const bottom = top + elemRect.height;
+    const right = left + elemRect.width;
+
+    // Use the parent window of the anchorEl if provided
+    const containerWindow = ownerWindow(resolveAnchorEl(anchorEl));
+
+    // Window thresholds taking required margin into account
+    const heightThreshold = containerWindow.innerHeight - marginThreshold;
+    const widthThreshold = containerWindow.innerWidth - marginThreshold;
+
+    // Check if the vertical axis needs shifting
+    if (marginThreshold !== null && top < marginThreshold) {
+      const diff = top - marginThreshold;
+      top -= diff;
+      elemTransformOrigin.vertical += diff;
+    } else if (marginThreshold !== null && bottom > heightThreshold) {
+      const diff = bottom - heightThreshold;
+      top -= diff;
+      elemTransformOrigin.vertical += diff;
+    }
+    if (process.env.NODE_ENV !== 'production') {
+      if (elemRect.height > heightThreshold && elemRect.height && heightThreshold) {
+        console.error(['MUI: The popover component is too tall.', `Some part of it can not be seen on the screen (${elemRect.height - heightThreshold}px).`, 'Please consider adding a `max-height` to improve the user-experience.'].join('\n'));
+      }
+    }
+
+    // Check if the horizontal axis needs shifting
+    if (marginThreshold !== null && left < marginThreshold) {
+      const diff = left - marginThreshold;
+      left -= diff;
+      elemTransformOrigin.horizontal += diff;
+    } else if (right > widthThreshold) {
+      const diff = right - widthThreshold;
+      left -= diff;
+      elemTransformOrigin.horizontal += diff;
+    }
+    return {
+      top: `${Math.round(top)}px`,
+      left: `${Math.round(left)}px`,
+      transformOrigin: getTransformOriginValue(elemTransformOrigin)
+    };
+  }, [anchorEl, anchorReference, getAnchorOffset, getTransformOrigin, marginThreshold]);
+  const [isPositioned, setIsPositioned] = React.useState(open);
+  const setPositioningStyles = React.useCallback(() => {
+    const element = paperRef.current;
+    if (!element) {
+      return;
+    }
+    const positioning = getPositioningStyle(element);
+    if (positioning.top !== null) {
+      element.style.top = positioning.top;
+    }
+    if (positioning.left !== null) {
+      element.style.left = positioning.left;
+    }
+    element.style.transformOrigin = positioning.transformOrigin;
+    setIsPositioned(true);
+  }, [getPositioningStyle]);
+  React.useEffect(() => {
+    if (disableScrollLock) {
+      window.addEventListener('scroll', setPositioningStyles);
+    }
+    return () => window.removeEventListener('scroll', setPositioningStyles);
+  }, [anchorEl, disableScrollLock, setPositioningStyles]);
+  const handleEntering = (element, isAppearing) => {
+    if (onEntering) {
+      onEntering(element, isAppearing);
+    }
+    setPositioningStyles();
+  };
+  const handleExited = () => {
+    setIsPositioned(false);
+  };
+  React.useEffect(() => {
+    if (open) {
+      setPositioningStyles();
+    }
+  });
+  React.useImperativeHandle(action, () => open ? {
+    updatePosition: () => {
+      setPositioningStyles();
+    }
+  } : null, [open, setPositioningStyles]);
+  React.useEffect(() => {
+    if (!open) {
+      return undefined;
+    }
+    const handleResize = debounce(() => {
+      setPositioningStyles();
+    });
+    const containerWindow = ownerWindow(anchorEl);
+    containerWindow.addEventListener('resize', handleResize);
+    return () => {
+      handleResize.clear();
+      containerWindow.removeEventListener('resize', handleResize);
+    };
+  }, [anchorEl, open, setPositioningStyles]);
+  let transitionDuration = transitionDurationProp;
+  if (transitionDurationProp === 'auto' && !TransitionComponent.muiSupportAuto) {
+    transitionDuration = undefined;
+  }
+
+  // If the container prop is provided, use that
+  // If the anchorEl prop is provided, use its parent body element as the container
+  // If neither are provided let the Modal take care of choosing the container
+  const container = containerProp || (anchorEl ? ownerDocument(resolveAnchorEl(anchorEl)).body : undefined);
+  const RootSlot = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : PopoverRoot;
+  const PaperSlot = (_slots$paper = slots == null ? void 0 : slots.paper) != null ? _slots$paper : PopoverPaper;
+  const paperProps = useSlotProps({
+    elementType: PaperSlot,
+    externalSlotProps: _extends({}, externalPaperSlotProps, {
+      style: isPositioned ? externalPaperSlotProps.style : _extends({}, externalPaperSlotProps.style, {
+        opacity: 0
+      })
+    }),
+    additionalProps: {
+      elevation,
+      ref: handlePaperRef
+    },
+    ownerState,
+    className: clsx(classes.paper, externalPaperSlotProps == null ? void 0 : externalPaperSlotProps.className)
+  });
+  const _useSlotProps = useSlotProps({
+      elementType: RootSlot,
+      externalSlotProps: (slotProps == null ? void 0 : slotProps.root) || {},
+      externalForwardedProps: other,
+      additionalProps: {
+        ref,
+        slotProps: {
+          backdrop: {
+            invisible: true
+          }
+        },
+        container,
+        open
+      },
+      ownerState,
+      className: clsx(classes.root, className)
+    }),
+    {
+      slotProps: rootSlotPropsProp
+    } = _useSlotProps,
+    rootProps = _objectWithoutPropertiesLoose(_useSlotProps, _excluded3);
+  return /*#__PURE__*/_jsx(RootSlot, _extends({}, rootProps, !isHostComponent(RootSlot) && {
+    slotProps: rootSlotPropsProp,
+    disableScrollLock
+  }, {
+    children: /*#__PURE__*/_jsx(TransitionComponent, _extends({
+      appear: true,
+      in: open,
+      onEntering: handleEntering,
+      onExited: handleExited,
+      timeout: transitionDuration
+    }, TransitionProps, {
+      children: /*#__PURE__*/_jsx(PaperSlot, _extends({}, paperProps, {
+        children: children
+      }))
+    }))
+  }));
+});
+process.env.NODE_ENV !== "production" ? Popover.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * A ref for imperative actions.
+   * It currently only supports updatePosition() action.
+   */
+  action: refType,
+  /**
+   * An HTML element, [PopoverVirtualElement](/material-ui/react-popover/#virtual-element),
+   * or a function that returns either.
+   * It's used to set the position of the popover.
+   */
+  anchorEl: chainPropTypes(PropTypes.oneOfType([HTMLElementType, PropTypes.func]), props => {
+    if (props.open && (!props.anchorReference || props.anchorReference === 'anchorEl')) {
+      const resolvedAnchorEl = resolveAnchorEl(props.anchorEl);
+      if (resolvedAnchorEl && resolvedAnchorEl.nodeType === 1) {
+        const box = resolvedAnchorEl.getBoundingClientRect();
+        if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
+          return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
+        }
+      } else {
+        return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', `It should be an Element or PopoverVirtualElement instance but it's \`${resolvedAnchorEl}\` instead.`].join('\n'));
+      }
+    }
+    return null;
+  }),
+  /**
+   * This is the point on the anchor where the popover's
+   * `anchorEl` will attach to. This is not used when the
+   * anchorReference is 'anchorPosition'.
+   *
+   * Options:
+   * vertical: [top, center, bottom];
+   * horizontal: [left, center, right].
+   * @default {
+   *   vertical: 'top',
+   *   horizontal: 'left',
+   * }
+   */
+  anchorOrigin: PropTypes.shape({
+    horizontal: PropTypes.oneOfType([PropTypes.oneOf(['center', 'left', 'right']), PropTypes.number]).isRequired,
+    vertical: PropTypes.oneOfType([PropTypes.oneOf(['bottom', 'center', 'top']), PropTypes.number]).isRequired
+  }),
+  /**
+   * This is the position that may be used to set the position of the popover.
+   * The coordinates are relative to the application's client area.
+   */
+  anchorPosition: PropTypes.shape({
+    left: PropTypes.number.isRequired,
+    top: PropTypes.number.isRequired
+  }),
+  /**
+   * This determines which anchor prop to refer to when setting
+   * the position of the popover.
+   * @default 'anchorEl'
+   */
+  anchorReference: PropTypes.oneOf(['anchorEl', 'anchorPosition', 'none']),
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * An HTML element, component instance, or function that returns either.
+   * The `container` will passed to the Modal component.
+   *
+   * By default, it uses the body of the anchorEl's top-level document object,
+   * so it's simply `document.body` most of the time.
+   */
+  container: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([HTMLElementType, PropTypes.func]),
+  /**
+   * Disable the scroll lock behavior.
+   * @default false
+   */
+  disableScrollLock: PropTypes.bool,
+  /**
+   * The elevation of the popover.
+   * @default 8
+   */
+  elevation: integerPropType,
+  /**
+   * Specifies how close to the edge of the window the popover can appear.
+   * If null, the popover will not be constrained by the window.
+   * @default 16
+   */
+  marginThreshold: PropTypes.number,
+  /**
+   * Callback fired when the component requests to be closed.
+   * The `reason` parameter can optionally be used to control the response to `onClose`.
+   */
+  onClose: PropTypes.func,
+  /**
+   * If `true`, the component is shown.
+   */
+  open: PropTypes.bool.isRequired,
+  /**
+   * Props applied to the [`Paper`](/material-ui/api/paper/) element.
+   *
+   * This prop is an alias for `slotProps.paper` and will be overriden by it if both are used.
+   * @deprecated Use `slotProps.paper` instead.
+   *
+   * @default {}
+   */
+  PaperProps: PropTypes /* @typescript-to-proptypes-ignore */.shape({
+    component: elementTypeAcceptingRef
+  }),
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   *
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    paper: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   *
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    paper: PropTypes.elementType,
+    root: PropTypes.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * This is the point on the popover which
+   * will attach to the anchor's origin.
+   *
+   * Options:
+   * vertical: [top, center, bottom, x(px)];
+   * horizontal: [left, center, right, x(px)].
+   * @default {
+   *   vertical: 'top',
+   *   horizontal: 'left',
+   * }
+   */
+  transformOrigin: PropTypes.shape({
+    horizontal: PropTypes.oneOfType([PropTypes.oneOf(['center', 'left', 'right']), PropTypes.number]).isRequired,
+    vertical: PropTypes.oneOfType([PropTypes.oneOf(['bottom', 'center', 'top']), PropTypes.number]).isRequired
+  }),
+  /**
+   * The component used for the transition.
+   * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
+   * @default Grow
+   */
+  TransitionComponent: PropTypes.elementType,
+  /**
+   * Set to 'auto' to automatically calculate transition time based on height.
+   * @default 'auto'
+   */
+  transitionDuration: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.shape({
+    appear: PropTypes.number,
+    enter: PropTypes.number,
+    exit: PropTypes.number
+  })]),
+  /**
+   * Props applied to the transition element.
+   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
+   * @default {}
+   */
+  TransitionProps: PropTypes.object
+} : void 0;
+export default Popover;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Popover/popoverClasses.js b/ddb_main/node_modules/@mui/material/Popover/popoverClasses.js
new file mode 100644
index 0000000..421e95b
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Popover/popoverClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getPopoverUtilityClass(slot) {
+  return generateUtilityClass('MuiPopover', slot);
+}
+const popoverClasses = generateUtilityClasses('MuiPopover', ['root', 'paper']);
+export default popoverClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Radio/Radio.js b/ddb_main/node_modules/@mui/material/Radio/Radio.js
new file mode 100644
index 0000000..b63cff8
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Radio/Radio.js
@@ -0,0 +1,214 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["checked", "checkedIcon", "color", "icon", "name", "onChange", "size", "className"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import refType from '@mui/utils/refType';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha } from '@mui/system/colorManipulator';
+import SwitchBase from '../internal/SwitchBase';
+import useThemeProps from '../styles/useThemeProps';
+import RadioButtonIcon from './RadioButtonIcon';
+import capitalize from '../utils/capitalize';
+import createChainedFunction from '../utils/createChainedFunction';
+import useRadioGroup from '../RadioGroup/useRadioGroup';
+import radioClasses, { getRadioUtilityClass } from './radioClasses';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    color,
+    size
+  } = ownerState;
+  const slots = {
+    root: ['root', `color${capitalize(color)}`, size !== 'medium' && `size${capitalize(size)}`]
+  };
+  return _extends({}, classes, composeClasses(slots, getRadioUtilityClass, classes));
+};
+const RadioRoot = styled(SwitchBase, {
+  shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
+  name: 'MuiRadio',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.size !== 'medium' && styles[`size${capitalize(ownerState.size)}`], styles[`color${capitalize(ownerState.color)}`]];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  color: (theme.vars || theme).palette.text.secondary
+}, !ownerState.disableRipple && {
+  '&:hover': {
+    backgroundColor: theme.vars ? `rgba(${ownerState.color === 'default' ? theme.vars.palette.action.activeChannel : theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(ownerState.color === 'default' ? theme.palette.action.active : theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      backgroundColor: 'transparent'
+    }
+  }
+}, ownerState.color !== 'default' && {
+  [`&.${radioClasses.checked}`]: {
+    color: (theme.vars || theme).palette[ownerState.color].main
+  }
+}, {
+  [`&.${radioClasses.disabled}`]: {
+    color: (theme.vars || theme).palette.action.disabled
+  }
+}));
+function areEqualValues(a, b) {
+  if (typeof b === 'object' && b !== null) {
+    return a === b;
+  }
+
+  // The value could be a number, the DOM will stringify it anyway.
+  return String(a) === String(b);
+}
+const defaultCheckedIcon = /*#__PURE__*/_jsx(RadioButtonIcon, {
+  checked: true
+});
+const defaultIcon = /*#__PURE__*/_jsx(RadioButtonIcon, {});
+const Radio = /*#__PURE__*/React.forwardRef(function Radio(inProps, ref) {
+  var _defaultIcon$props$fo, _defaultCheckedIcon$p;
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiRadio'
+  });
+  const {
+      checked: checkedProp,
+      checkedIcon = defaultCheckedIcon,
+      color = 'primary',
+      icon = defaultIcon,
+      name: nameProp,
+      onChange: onChangeProp,
+      size = 'medium',
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    color,
+    size
+  });
+  const classes = useUtilityClasses(ownerState);
+  const radioGroup = useRadioGroup();
+  let checked = checkedProp;
+  const onChange = createChainedFunction(onChangeProp, radioGroup && radioGroup.onChange);
+  let name = nameProp;
+  if (radioGroup) {
+    if (typeof checked === 'undefined') {
+      checked = areEqualValues(radioGroup.value, props.value);
+    }
+    if (typeof name === 'undefined') {
+      name = radioGroup.name;
+    }
+  }
+  return /*#__PURE__*/_jsx(RadioRoot, _extends({
+    type: "radio",
+    icon: /*#__PURE__*/React.cloneElement(icon, {
+      fontSize: (_defaultIcon$props$fo = defaultIcon.props.fontSize) != null ? _defaultIcon$props$fo : size
+    }),
+    checkedIcon: /*#__PURE__*/React.cloneElement(checkedIcon, {
+      fontSize: (_defaultCheckedIcon$p = defaultCheckedIcon.props.fontSize) != null ? _defaultCheckedIcon$p : size
+    }),
+    ownerState: ownerState,
+    classes: classes,
+    name: name,
+    checked: checked,
+    onChange: onChange,
+    ref: ref,
+    className: clsx(classes.root, className)
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? Radio.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: PropTypes.bool,
+  /**
+   * The icon to display when the component is checked.
+   * @default <RadioButtonIcon checked />
+   */
+  checkedIcon: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'primary'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * If `true`, the component is disabled.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   * @default false
+   */
+  disableRipple: PropTypes.bool,
+  /**
+   * The icon to display when the component is unchecked.
+   * @default <RadioButtonIcon />
+   */
+  icon: PropTypes.node,
+  /**
+   * The id of the `input` element.
+   */
+  id: PropTypes.string,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   */
+  inputProps: PropTypes.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: refType,
+  /**
+   * Name attribute of the `input` element.
+   */
+  name: PropTypes.string,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: PropTypes.func,
+  /**
+   * If `true`, the `input` element is required.
+   * @default false
+   */
+  required: PropTypes.bool,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense radio styling.
+   * @default 'medium'
+   */
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The value of the component. The DOM API casts this to a string.
+   */
+  value: PropTypes.any
+} : void 0;
+export default Radio;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Radio/RadioButtonIcon.js b/ddb_main/node_modules/@mui/material/Radio/RadioButtonIcon.js
new file mode 100644
index 0000000..8de5fb1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Radio/RadioButtonIcon.js
@@ -0,0 +1,81 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import RadioButtonUncheckedIcon from '../internal/svg-icons/RadioButtonUnchecked';
+import RadioButtonCheckedIcon from '../internal/svg-icons/RadioButtonChecked';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const RadioButtonIconRoot = styled('span', {
+  shouldForwardProp: rootShouldForwardProp
+})({
+  position: 'relative',
+  display: 'flex'
+});
+const RadioButtonIconBackground = styled(RadioButtonUncheckedIcon)({
+  // Scale applied to prevent dot misalignment in Safari
+  transform: 'scale(1)'
+});
+const RadioButtonIconDot = styled(RadioButtonCheckedIcon)(({
+  theme,
+  ownerState
+}) => _extends({
+  left: 0,
+  position: 'absolute',
+  transform: 'scale(0)',
+  transition: theme.transitions.create('transform', {
+    easing: theme.transitions.easing.easeIn,
+    duration: theme.transitions.duration.shortest
+  })
+}, ownerState.checked && {
+  transform: 'scale(1)',
+  transition: theme.transitions.create('transform', {
+    easing: theme.transitions.easing.easeOut,
+    duration: theme.transitions.duration.shortest
+  })
+}));
+
+/**
+ * @ignore - internal component.
+ */
+function RadioButtonIcon(props) {
+  const {
+    checked = false,
+    classes = {},
+    fontSize
+  } = props;
+  const ownerState = _extends({}, props, {
+    checked
+  });
+  return /*#__PURE__*/_jsxs(RadioButtonIconRoot, {
+    className: classes.root,
+    ownerState: ownerState,
+    children: [/*#__PURE__*/_jsx(RadioButtonIconBackground, {
+      fontSize: fontSize,
+      className: classes.background,
+      ownerState: ownerState
+    }), /*#__PURE__*/_jsx(RadioButtonIconDot, {
+      fontSize: fontSize,
+      className: classes.dot,
+      ownerState: ownerState
+    })]
+  });
+}
+process.env.NODE_ENV !== "production" ? RadioButtonIcon.propTypes = {
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: PropTypes.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense radio styling.
+   */
+  fontSize: PropTypes.oneOf(['small', 'medium'])
+} : void 0;
+export default RadioButtonIcon;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Radio/radioClasses.js b/ddb_main/node_modules/@mui/material/Radio/radioClasses.js
new file mode 100644
index 0000000..d9223d7
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Radio/radioClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getRadioUtilityClass(slot) {
+  return generateUtilityClass('MuiRadio', slot);
+}
+const radioClasses = generateUtilityClasses('MuiRadio', ['root', 'checked', 'disabled', 'colorPrimary', 'colorSecondary', 'sizeSmall']);
+export default radioClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/RadioGroup/RadioGroup.js b/ddb_main/node_modules/@mui/material/RadioGroup/RadioGroup.js
new file mode 100644
index 0000000..1450d54
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/RadioGroup/RadioGroup.js
@@ -0,0 +1,117 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["actions", "children", "className", "defaultValue", "name", "onChange", "value"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import FormGroup from '../FormGroup';
+import { getRadioGroupUtilityClass } from './radioGroupClasses';
+import useForkRef from '../utils/useForkRef';
+import useControlled from '../utils/useControlled';
+import RadioGroupContext from './RadioGroupContext';
+import useId from '../utils/useId';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = props => {
+  const {
+    classes,
+    row,
+    error
+  } = props;
+  const slots = {
+    root: ['root', row && 'row', error && 'error']
+  };
+  return composeClasses(slots, getRadioGroupUtilityClass, classes);
+};
+const RadioGroup = /*#__PURE__*/React.forwardRef(function RadioGroup(props, ref) {
+  const {
+      // private
+      // eslint-disable-next-line react/prop-types
+      actions,
+      children,
+      className,
+      defaultValue,
+      name: nameProp,
+      onChange,
+      value: valueProp
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const rootRef = React.useRef(null);
+  const classes = useUtilityClasses(props);
+  const [value, setValueState] = useControlled({
+    controlled: valueProp,
+    default: defaultValue,
+    name: 'RadioGroup'
+  });
+  React.useImperativeHandle(actions, () => ({
+    focus: () => {
+      let input = rootRef.current.querySelector('input:not(:disabled):checked');
+      if (!input) {
+        input = rootRef.current.querySelector('input:not(:disabled)');
+      }
+      if (input) {
+        input.focus();
+      }
+    }
+  }), []);
+  const handleRef = useForkRef(ref, rootRef);
+  const name = useId(nameProp);
+  const contextValue = React.useMemo(() => ({
+    name,
+    onChange(event) {
+      setValueState(event.target.value);
+      if (onChange) {
+        onChange(event, event.target.value);
+      }
+    },
+    value
+  }), [name, onChange, setValueState, value]);
+  return /*#__PURE__*/_jsx(RadioGroupContext.Provider, {
+    value: contextValue,
+    children: /*#__PURE__*/_jsx(FormGroup, _extends({
+      role: "radiogroup",
+      ref: handleRef,
+      className: clsx(classes.root, className)
+    }, other, {
+      children: children
+    }))
+  });
+});
+process.env.NODE_ENV !== "production" ? RadioGroup.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue: PropTypes.any,
+  /**
+   * The name used to reference the value of the control.
+   * If you don't provide this prop, it falls back to a randomly generated name.
+   */
+  name: PropTypes.string,
+  /**
+   * Callback fired when a radio button is selected.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * @param {string} value The value of the selected radio button.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   */
+  onChange: PropTypes.func,
+  /**
+   * Value of the selected radio button. The DOM API casts this to a string.
+   */
+  value: PropTypes.any
+} : void 0;
+export default RadioGroup;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/RadioGroup/RadioGroupContext.js b/ddb_main/node_modules/@mui/material/RadioGroup/RadioGroupContext.js
new file mode 100644
index 0000000..5659534
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/RadioGroup/RadioGroupContext.js
@@ -0,0 +1,9 @@
+import * as React from 'react';
+/**
+ * @ignore - internal component.
+ */
+const RadioGroupContext = /*#__PURE__*/React.createContext(undefined);
+if (process.env.NODE_ENV !== 'production') {
+  RadioGroupContext.displayName = 'RadioGroupContext';
+}
+export default RadioGroupContext;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/RadioGroup/radioGroupClasses.js b/ddb_main/node_modules/@mui/material/RadioGroup/radioGroupClasses.js
new file mode 100644
index 0000000..aefdd7c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/RadioGroup/radioGroupClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getRadioGroupUtilityClass(slot) {
+  return generateUtilityClass('MuiRadioGroup', slot);
+}
+const radioGroupClasses = generateUtilityClasses('MuiRadioGroup', ['root', 'row', 'error']);
+export default radioGroupClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/RadioGroup/useRadioGroup.js b/ddb_main/node_modules/@mui/material/RadioGroup/useRadioGroup.js
new file mode 100644
index 0000000..ec496a3
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/RadioGroup/useRadioGroup.js
@@ -0,0 +1,7 @@
+'use client';
+
+import * as React from 'react';
+import RadioGroupContext from './RadioGroupContext';
+export default function useRadioGroup() {
+  return React.useContext(RadioGroupContext);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Select/Select.js b/ddb_main/node_modules/@mui/material/Select/Select.js
new file mode 100644
index 0000000..84d37b9
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Select/Select.js
@@ -0,0 +1,283 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["autoWidth", "children", "classes", "className", "defaultOpen", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"],
+  _excluded2 = ["root"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import deepmerge from '@mui/utils/deepmerge';
+import SelectInput from './SelectInput';
+import formControlState from '../FormControl/formControlState';
+import useFormControl from '../FormControl/useFormControl';
+import ArrowDropDownIcon from '../internal/svg-icons/ArrowDropDown';
+import Input from '../Input';
+import NativeSelectInput from '../NativeSelect/NativeSelectInput';
+import FilledInput from '../FilledInput';
+import OutlinedInput from '../OutlinedInput';
+import useThemeProps from '../styles/useThemeProps';
+import useForkRef from '../utils/useForkRef';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  return classes;
+};
+const styledRootConfig = {
+  name: 'MuiSelect',
+  overridesResolver: (props, styles) => styles.root,
+  shouldForwardProp: prop => rootShouldForwardProp(prop) && prop !== 'variant',
+  slot: 'Root'
+};
+const StyledInput = styled(Input, styledRootConfig)('');
+const StyledOutlinedInput = styled(OutlinedInput, styledRootConfig)('');
+const StyledFilledInput = styled(FilledInput, styledRootConfig)('');
+const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
+  const props = useThemeProps({
+    name: 'MuiSelect',
+    props: inProps
+  });
+  const {
+      autoWidth = false,
+      children,
+      classes: classesProp = {},
+      className,
+      defaultOpen = false,
+      displayEmpty = false,
+      IconComponent = ArrowDropDownIcon,
+      id,
+      input,
+      inputProps,
+      label,
+      labelId,
+      MenuProps,
+      multiple = false,
+      native = false,
+      onClose,
+      onOpen,
+      open,
+      renderValue,
+      SelectDisplayProps,
+      variant: variantProp = 'outlined'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const inputComponent = native ? NativeSelectInput : SelectInput;
+  const muiFormControl = useFormControl();
+  const fcs = formControlState({
+    props,
+    muiFormControl,
+    states: ['variant', 'error']
+  });
+  const variant = fcs.variant || variantProp;
+  const ownerState = _extends({}, props, {
+    variant,
+    classes: classesProp
+  });
+  const classes = useUtilityClasses(ownerState);
+  const restOfClasses = _objectWithoutPropertiesLoose(classes, _excluded2);
+  const InputComponent = input || {
+    standard: /*#__PURE__*/_jsx(StyledInput, {
+      ownerState: ownerState
+    }),
+    outlined: /*#__PURE__*/_jsx(StyledOutlinedInput, {
+      label: label,
+      ownerState: ownerState
+    }),
+    filled: /*#__PURE__*/_jsx(StyledFilledInput, {
+      ownerState: ownerState
+    })
+  }[variant];
+  const inputComponentRef = useForkRef(ref, InputComponent.ref);
+  return /*#__PURE__*/_jsx(React.Fragment, {
+    children: /*#__PURE__*/React.cloneElement(InputComponent, _extends({
+      // Most of the logic is implemented in `SelectInput`.
+      // The `Select` component is a simple API wrapper to expose something better to play with.
+      inputComponent,
+      inputProps: _extends({
+        children,
+        error: fcs.error,
+        IconComponent,
+        variant,
+        type: undefined,
+        // We render a select. We can ignore the type provided by the `Input`.
+        multiple
+      }, native ? {
+        id
+      } : {
+        autoWidth,
+        defaultOpen,
+        displayEmpty,
+        labelId,
+        MenuProps,
+        onClose,
+        onOpen,
+        open,
+        renderValue,
+        SelectDisplayProps: _extends({
+          id
+        }, SelectDisplayProps)
+      }, inputProps, {
+        classes: inputProps ? deepmerge(restOfClasses, inputProps.classes) : restOfClasses
+      }, input ? input.props.inputProps : {})
+    }, (multiple && native || displayEmpty) && variant === 'outlined' ? {
+      notched: true
+    } : {}, {
+      ref: inputComponentRef,
+      className: clsx(InputComponent.props.className, className, classes.root)
+    }, !input && {
+      variant
+    }, other))
+  });
+});
+process.env.NODE_ENV !== "production" ? Select.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the width of the popover will automatically be set according to the items inside the
+   * menu, otherwise it will be at least the width of the select input.
+   * @default false
+   */
+  autoWidth: PropTypes.bool,
+  /**
+   * The option elements to populate the select with.
+   * Can be some `MenuItem` when `native` is false and `option` when `native` is true.
+   *
+   * ⚠️The `MenuItem` elements **must** be direct descendants when `native` is false.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   * @default {}
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * If `true`, the component is initially open. Use when the component open state is not controlled (i.e. the `open` prop is not defined).
+   * You can only use it when the `native` prop is `false` (default).
+   * @default false
+   */
+  defaultOpen: PropTypes.bool,
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue: PropTypes.any,
+  /**
+   * If `true`, a value is displayed even if no items are selected.
+   *
+   * In order to display a meaningful value, a function can be passed to the `renderValue` prop which
+   * returns the value to be displayed when no items are selected.
+   *
+   * ⚠️ When using this prop, make sure the label doesn't overlap with the empty displayed value.
+   * The label should either be hidden or forced to a shrunk state.
+   * @default false
+   */
+  displayEmpty: PropTypes.bool,
+  /**
+   * The icon that displays the arrow.
+   * @default ArrowDropDownIcon
+   */
+  IconComponent: PropTypes.elementType,
+  /**
+   * The `id` of the wrapper element or the `select` element when `native`.
+   */
+  id: PropTypes.string,
+  /**
+   * An `Input` element; does not have to be a material-ui specific `Input`.
+   */
+  input: PropTypes.element,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   * When `native` is `true`, the attributes are applied on the `select` element.
+   */
+  inputProps: PropTypes.object,
+  /**
+   * See [OutlinedInput#label](/material-ui/api/outlined-input/#props)
+   */
+  label: PropTypes.node,
+  /**
+   * The ID of an element that acts as an additional label. The Select will
+   * be labelled by the additional label and the selected value.
+   */
+  labelId: PropTypes.string,
+  /**
+   * Props applied to the [`Menu`](/material-ui/api/menu/) element.
+   */
+  MenuProps: PropTypes.object,
+  /**
+   * If `true`, `value` must be an array and the menu will support multiple selections.
+   * @default false
+   */
+  multiple: PropTypes.bool,
+  /**
+   * If `true`, the component uses a native `select` element.
+   * @default false
+   */
+  native: PropTypes.bool,
+  /**
+   * Callback fired when a menu item is selected.
+   *
+   * @param {SelectChangeEvent<Value>} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (any).
+   * **Warning**: This is a generic event, not a change event, unless the change event is caused by browser autofill.
+   * @param {object} [child] The react element that was selected when `native` is `false` (default).
+   */
+  onChange: PropTypes.func,
+  /**
+   * Callback fired when the component requests to be closed.
+   * Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select collapses).
+   *
+   * @param {object} event The event source of the callback.
+   */
+  onClose: PropTypes.func,
+  /**
+   * Callback fired when the component requests to be opened.
+   * Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select expands).
+   *
+   * @param {object} event The event source of the callback.
+   */
+  onOpen: PropTypes.func,
+  /**
+   * If `true`, the component is shown.
+   * You can only use it when the `native` prop is `false` (default).
+   */
+  open: PropTypes.bool,
+  /**
+   * Render the selected value.
+   * You can only use it when the `native` prop is `false` (default).
+   *
+   * @param {any} value The `value` provided to the component.
+   * @returns {ReactNode}
+   */
+  renderValue: PropTypes.func,
+  /**
+   * Props applied to the clickable div element.
+   */
+  SelectDisplayProps: PropTypes.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The `input` value. Providing an empty string will select no options.
+   * Set to an empty string `''` if you don't want any of the available options to be selected.
+   *
+   * If the value is an object it must have reference equality with the option in order to be selected.
+   * If the value is not an object, the string representation must match with the string representation of the option in order to be selected.
+   */
+  value: PropTypes.oneOfType([PropTypes.oneOf(['']), PropTypes.any]),
+  /**
+   * The variant to use.
+   * @default 'outlined'
+   */
+  variant: PropTypes.oneOf(['filled', 'outlined', 'standard'])
+} : void 0;
+Select.muiName = 'Select';
+export default Select;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Select/SelectInput.js b/ddb_main/node_modules/@mui/material/Select/SelectInput.js
new file mode 100644
index 0000000..e6971d5
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Select/SelectInput.js
@@ -0,0 +1,657 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
+var _span;
+const _excluded = ["aria-describedby", "aria-label", "autoFocus", "autoWidth", "children", "className", "defaultOpen", "defaultValue", "disabled", "displayEmpty", "error", "IconComponent", "inputRef", "labelId", "MenuProps", "multiple", "name", "onBlur", "onChange", "onClose", "onFocus", "onOpen", "open", "readOnly", "renderValue", "SelectDisplayProps", "tabIndex", "type", "value", "variant"];
+import * as React from 'react';
+import { isFragment } from 'react-is';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import useId from '@mui/utils/useId';
+import refType from '@mui/utils/refType';
+import ownerDocument from '../utils/ownerDocument';
+import capitalize from '../utils/capitalize';
+import Menu from '../Menu/Menu';
+import { nativeSelectSelectStyles, nativeSelectIconStyles } from '../NativeSelect/NativeSelectInput';
+import { isFilled } from '../InputBase/utils';
+import styled, { slotShouldForwardProp } from '../styles/styled';
+import useForkRef from '../utils/useForkRef';
+import useControlled from '../utils/useControlled';
+import selectClasses, { getSelectUtilityClasses } from './selectClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const SelectSelect = styled('div', {
+  name: 'MuiSelect',
+  slot: 'Select',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [
+    // Win specificity over the input base
+    {
+      [`&.${selectClasses.select}`]: styles.select
+    }, {
+      [`&.${selectClasses.select}`]: styles[ownerState.variant]
+    }, {
+      [`&.${selectClasses.error}`]: styles.error
+    }, {
+      [`&.${selectClasses.multiple}`]: styles.multiple
+    }];
+  }
+})(nativeSelectSelectStyles, {
+  // Win specificity over the input base
+  [`&.${selectClasses.select}`]: {
+    height: 'auto',
+    // Resets for multiple select with chips
+    minHeight: '1.4375em',
+    // Required for select\text-field height consistency
+    textOverflow: 'ellipsis',
+    whiteSpace: 'nowrap',
+    overflow: 'hidden'
+  }
+});
+const SelectIcon = styled('svg', {
+  name: 'MuiSelect',
+  slot: 'Icon',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.icon, ownerState.variant && styles[`icon${capitalize(ownerState.variant)}`], ownerState.open && styles.iconOpen];
+  }
+})(nativeSelectIconStyles);
+const SelectNativeInput = styled('input', {
+  shouldForwardProp: prop => slotShouldForwardProp(prop) && prop !== 'classes',
+  name: 'MuiSelect',
+  slot: 'NativeInput',
+  overridesResolver: (props, styles) => styles.nativeInput
+})({
+  bottom: 0,
+  left: 0,
+  position: 'absolute',
+  opacity: 0,
+  pointerEvents: 'none',
+  width: '100%',
+  boxSizing: 'border-box'
+});
+function areEqualValues(a, b) {
+  if (typeof b === 'object' && b !== null) {
+    return a === b;
+  }
+
+  // The value could be a number, the DOM will stringify it anyway.
+  return String(a) === String(b);
+}
+function isEmpty(display) {
+  return display == null || typeof display === 'string' && !display.trim();
+}
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    variant,
+    disabled,
+    multiple,
+    open,
+    error
+  } = ownerState;
+  const slots = {
+    select: ['select', variant, disabled && 'disabled', multiple && 'multiple', error && 'error'],
+    icon: ['icon', `icon${capitalize(variant)}`, open && 'iconOpen', disabled && 'disabled'],
+    nativeInput: ['nativeInput']
+  };
+  return composeClasses(slots, getSelectUtilityClasses, classes);
+};
+
+/**
+ * @ignore - internal component.
+ */
+const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, ref) {
+  var _MenuProps$slotProps;
+  const {
+      'aria-describedby': ariaDescribedby,
+      'aria-label': ariaLabel,
+      autoFocus,
+      autoWidth,
+      children,
+      className,
+      defaultOpen,
+      defaultValue,
+      disabled,
+      displayEmpty,
+      error = false,
+      IconComponent,
+      inputRef: inputRefProp,
+      labelId,
+      MenuProps = {},
+      multiple,
+      name,
+      onBlur,
+      onChange,
+      onClose,
+      onFocus,
+      onOpen,
+      open: openProp,
+      readOnly,
+      renderValue,
+      SelectDisplayProps = {},
+      tabIndex: tabIndexProp
+      // catching `type` from Input which makes no sense for SelectInput
+      ,
+
+      value: valueProp,
+      variant = 'standard'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const [value, setValueState] = useControlled({
+    controlled: valueProp,
+    default: defaultValue,
+    name: 'Select'
+  });
+  const [openState, setOpenState] = useControlled({
+    controlled: openProp,
+    default: defaultOpen,
+    name: 'Select'
+  });
+  const inputRef = React.useRef(null);
+  const displayRef = React.useRef(null);
+  const [displayNode, setDisplayNode] = React.useState(null);
+  const {
+    current: isOpenControlled
+  } = React.useRef(openProp != null);
+  const [menuMinWidthState, setMenuMinWidthState] = React.useState();
+  const handleRef = useForkRef(ref, inputRefProp);
+  const handleDisplayRef = React.useCallback(node => {
+    displayRef.current = node;
+    if (node) {
+      setDisplayNode(node);
+    }
+  }, []);
+  const anchorElement = displayNode == null ? void 0 : displayNode.parentNode;
+  React.useImperativeHandle(handleRef, () => ({
+    focus: () => {
+      displayRef.current.focus();
+    },
+    node: inputRef.current,
+    value
+  }), [value]);
+
+  // Resize menu on `defaultOpen` automatic toggle.
+  React.useEffect(() => {
+    if (defaultOpen && openState && displayNode && !isOpenControlled) {
+      setMenuMinWidthState(autoWidth ? null : anchorElement.clientWidth);
+      displayRef.current.focus();
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [displayNode, autoWidth]);
+  // `isOpenControlled` is ignored because the component should never switch between controlled and uncontrolled modes.
+  // `defaultOpen` and `openState` are ignored to avoid unnecessary callbacks.
+  React.useEffect(() => {
+    if (autoFocus) {
+      displayRef.current.focus();
+    }
+  }, [autoFocus]);
+  React.useEffect(() => {
+    if (!labelId) {
+      return undefined;
+    }
+    const label = ownerDocument(displayRef.current).getElementById(labelId);
+    if (label) {
+      const handler = () => {
+        if (getSelection().isCollapsed) {
+          displayRef.current.focus();
+        }
+      };
+      label.addEventListener('click', handler);
+      return () => {
+        label.removeEventListener('click', handler);
+      };
+    }
+    return undefined;
+  }, [labelId]);
+  const update = (open, event) => {
+    if (open) {
+      if (onOpen) {
+        onOpen(event);
+      }
+    } else if (onClose) {
+      onClose(event);
+    }
+    if (!isOpenControlled) {
+      setMenuMinWidthState(autoWidth ? null : anchorElement.clientWidth);
+      setOpenState(open);
+    }
+  };
+  const handleMouseDown = event => {
+    // Ignore everything but left-click
+    if (event.button !== 0) {
+      return;
+    }
+    // Hijack the default focus behavior.
+    event.preventDefault();
+    displayRef.current.focus();
+    update(true, event);
+  };
+  const handleClose = event => {
+    update(false, event);
+  };
+  const childrenArray = React.Children.toArray(children);
+
+  // Support autofill.
+  const handleChange = event => {
+    const child = childrenArray.find(childItem => childItem.props.value === event.target.value);
+    if (child === undefined) {
+      return;
+    }
+    setValueState(child.props.value);
+    if (onChange) {
+      onChange(event, child);
+    }
+  };
+  const handleItemClick = child => event => {
+    let newValue;
+
+    // We use the tabindex attribute to signal the available options.
+    if (!event.currentTarget.hasAttribute('tabindex')) {
+      return;
+    }
+    if (multiple) {
+      newValue = Array.isArray(value) ? value.slice() : [];
+      const itemIndex = value.indexOf(child.props.value);
+      if (itemIndex === -1) {
+        newValue.push(child.props.value);
+      } else {
+        newValue.splice(itemIndex, 1);
+      }
+    } else {
+      newValue = child.props.value;
+    }
+    if (child.props.onClick) {
+      child.props.onClick(event);
+    }
+    if (value !== newValue) {
+      setValueState(newValue);
+      if (onChange) {
+        // Redefine target to allow name and value to be read.
+        // This allows seamless integration with the most popular form libraries.
+        // https://github.com/mui/material-ui/issues/13485#issuecomment-676048492
+        // Clone the event to not override `target` of the original event.
+        const nativeEvent = event.nativeEvent || event;
+        const clonedEvent = new nativeEvent.constructor(nativeEvent.type, nativeEvent);
+        Object.defineProperty(clonedEvent, 'target', {
+          writable: true,
+          value: {
+            value: newValue,
+            name
+          }
+        });
+        onChange(clonedEvent, child);
+      }
+    }
+    if (!multiple) {
+      update(false, event);
+    }
+  };
+  const handleKeyDown = event => {
+    if (!readOnly) {
+      const validKeys = [' ', 'ArrowUp', 'ArrowDown',
+      // The native select doesn't respond to enter on macOS, but it's recommended by
+      // https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-select-only/
+      'Enter'];
+      if (validKeys.indexOf(event.key) !== -1) {
+        event.preventDefault();
+        update(true, event);
+      }
+    }
+  };
+  const open = displayNode !== null && openState;
+  const handleBlur = event => {
+    // if open event.stopImmediatePropagation
+    if (!open && onBlur) {
+      // Preact support, target is read only property on a native event.
+      Object.defineProperty(event, 'target', {
+        writable: true,
+        value: {
+          value,
+          name
+        }
+      });
+      onBlur(event);
+    }
+  };
+  delete other['aria-invalid'];
+  let display;
+  let displaySingle;
+  const displayMultiple = [];
+  let computeDisplay = false;
+  let foundMatch = false;
+
+  // No need to display any value if the field is empty.
+  if (isFilled({
+    value
+  }) || displayEmpty) {
+    if (renderValue) {
+      display = renderValue(value);
+    } else {
+      computeDisplay = true;
+    }
+  }
+  const items = childrenArray.map(child => {
+    if (! /*#__PURE__*/React.isValidElement(child)) {
+      return null;
+    }
+    if (process.env.NODE_ENV !== 'production') {
+      if (isFragment(child)) {
+        console.error(["MUI: The Select component doesn't accept a Fragment as a child.", 'Consider providing an array instead.'].join('\n'));
+      }
+    }
+    let selected;
+    if (multiple) {
+      if (!Array.isArray(value)) {
+        throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The \`value\` prop must be an array when using the \`Select\` component with \`multiple\`.` : _formatMuiErrorMessage(2));
+      }
+      selected = value.some(v => areEqualValues(v, child.props.value));
+      if (selected && computeDisplay) {
+        displayMultiple.push(child.props.children);
+      }
+    } else {
+      selected = areEqualValues(value, child.props.value);
+      if (selected && computeDisplay) {
+        displaySingle = child.props.children;
+      }
+    }
+    if (selected) {
+      foundMatch = true;
+    }
+    return /*#__PURE__*/React.cloneElement(child, {
+      'aria-selected': selected ? 'true' : 'false',
+      onClick: handleItemClick(child),
+      onKeyUp: event => {
+        if (event.key === ' ') {
+          // otherwise our MenuItems dispatches a click event
+          // it's not behavior of the native <option> and causes
+          // the select to close immediately since we open on space keydown
+          event.preventDefault();
+        }
+        if (child.props.onKeyUp) {
+          child.props.onKeyUp(event);
+        }
+      },
+      role: 'option',
+      selected,
+      value: undefined,
+      // The value is most likely not a valid HTML attribute.
+      'data-value': child.props.value // Instead, we provide it as a data attribute.
+    });
+  });
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useEffect(() => {
+      if (!foundMatch && !multiple && value !== '') {
+        const values = childrenArray.map(child => child.props.value);
+        console.warn([`MUI: You have provided an out-of-range value \`${value}\` for the select ${name ? `(name="${name}") ` : ''}component.`, "Consider providing a value that matches one of the available options or ''.", `The available values are ${values.filter(x => x != null).map(x => `\`${x}\``).join(', ') || '""'}.`].join('\n'));
+      }
+    }, [foundMatch, childrenArray, multiple, name, value]);
+  }
+  if (computeDisplay) {
+    if (multiple) {
+      if (displayMultiple.length === 0) {
+        display = null;
+      } else {
+        display = displayMultiple.reduce((output, child, index) => {
+          output.push(child);
+          if (index < displayMultiple.length - 1) {
+            output.push(', ');
+          }
+          return output;
+        }, []);
+      }
+    } else {
+      display = displaySingle;
+    }
+  }
+
+  // Avoid performing a layout computation in the render method.
+  let menuMinWidth = menuMinWidthState;
+  if (!autoWidth && isOpenControlled && displayNode) {
+    menuMinWidth = anchorElement.clientWidth;
+  }
+  let tabIndex;
+  if (typeof tabIndexProp !== 'undefined') {
+    tabIndex = tabIndexProp;
+  } else {
+    tabIndex = disabled ? null : 0;
+  }
+  const buttonId = SelectDisplayProps.id || (name ? `mui-component-select-${name}` : undefined);
+  const ownerState = _extends({}, props, {
+    variant,
+    value,
+    open,
+    error
+  });
+  const classes = useUtilityClasses(ownerState);
+  const paperProps = _extends({}, MenuProps.PaperProps, (_MenuProps$slotProps = MenuProps.slotProps) == null ? void 0 : _MenuProps$slotProps.paper);
+  const listboxId = useId();
+  return /*#__PURE__*/_jsxs(React.Fragment, {
+    children: [/*#__PURE__*/_jsx(SelectSelect, _extends({
+      ref: handleDisplayRef,
+      tabIndex: tabIndex,
+      role: "combobox",
+      "aria-controls": listboxId,
+      "aria-disabled": disabled ? 'true' : undefined,
+      "aria-expanded": open ? 'true' : 'false',
+      "aria-haspopup": "listbox",
+      "aria-label": ariaLabel,
+      "aria-labelledby": [labelId, buttonId].filter(Boolean).join(' ') || undefined,
+      "aria-describedby": ariaDescribedby,
+      onKeyDown: handleKeyDown,
+      onMouseDown: disabled || readOnly ? null : handleMouseDown,
+      onBlur: handleBlur,
+      onFocus: onFocus
+    }, SelectDisplayProps, {
+      ownerState: ownerState,
+      className: clsx(SelectDisplayProps.className, classes.select, className)
+      // The id is required for proper a11y
+      ,
+      id: buttonId,
+      children: isEmpty(display) ? // notranslate needed while Google Translate will not fix zero-width space issue
+      _span || (_span = /*#__PURE__*/_jsx("span", {
+        className: "notranslate",
+        children: "\u200B"
+      })) : display
+    })), /*#__PURE__*/_jsx(SelectNativeInput, _extends({
+      "aria-invalid": error,
+      value: Array.isArray(value) ? value.join(',') : value,
+      name: name,
+      ref: inputRef,
+      "aria-hidden": true,
+      onChange: handleChange,
+      tabIndex: -1,
+      disabled: disabled,
+      className: classes.nativeInput,
+      autoFocus: autoFocus,
+      ownerState: ownerState
+    }, other)), /*#__PURE__*/_jsx(SelectIcon, {
+      as: IconComponent,
+      className: classes.icon,
+      ownerState: ownerState
+    }), /*#__PURE__*/_jsx(Menu, _extends({
+      id: `menu-${name || ''}`,
+      anchorEl: anchorElement,
+      open: open,
+      onClose: handleClose,
+      anchorOrigin: {
+        vertical: 'bottom',
+        horizontal: 'center'
+      },
+      transformOrigin: {
+        vertical: 'top',
+        horizontal: 'center'
+      }
+    }, MenuProps, {
+      MenuListProps: _extends({
+        'aria-labelledby': labelId,
+        role: 'listbox',
+        'aria-multiselectable': multiple ? 'true' : undefined,
+        disableListWrap: true,
+        id: listboxId
+      }, MenuProps.MenuListProps),
+      slotProps: _extends({}, MenuProps.slotProps, {
+        paper: _extends({}, paperProps, {
+          style: _extends({
+            minWidth: menuMinWidth
+          }, paperProps != null ? paperProps.style : null)
+        })
+      }),
+      children: items
+    }))]
+  });
+});
+process.env.NODE_ENV !== "production" ? SelectInput.propTypes = {
+  /**
+   * @ignore
+   */
+  'aria-describedby': PropTypes.string,
+  /**
+   * @ignore
+   */
+  'aria-label': PropTypes.string,
+  /**
+   * @ignore
+   */
+  autoFocus: PropTypes.bool,
+  /**
+   * If `true`, the width of the popover will automatically be set according to the items inside the
+   * menu, otherwise it will be at least the width of the select input.
+   */
+  autoWidth: PropTypes.bool,
+  /**
+   * The option elements to populate the select with.
+   * Can be some `<MenuItem>` elements.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * The CSS class name of the select element.
+   */
+  className: PropTypes.string,
+  /**
+   * If `true`, the component is toggled on mount. Use when the component open state is not controlled.
+   * You can only use it when the `native` prop is `false` (default).
+   */
+  defaultOpen: PropTypes.bool,
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue: PropTypes.any,
+  /**
+   * If `true`, the select is disabled.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the selected item is displayed even if its value is empty.
+   */
+  displayEmpty: PropTypes.bool,
+  /**
+   * If `true`, the `select input` will indicate an error.
+   */
+  error: PropTypes.bool,
+  /**
+   * The icon that displays the arrow.
+   */
+  IconComponent: PropTypes.elementType.isRequired,
+  /**
+   * Imperative handle implementing `{ value: T, node: HTMLElement, focus(): void }`
+   * Equivalent to `ref`
+   */
+  inputRef: refType,
+  /**
+   * The ID of an element that acts as an additional label. The Select will
+   * be labelled by the additional label and the selected value.
+   */
+  labelId: PropTypes.string,
+  /**
+   * Props applied to the [`Menu`](/material-ui/api/menu/) element.
+   */
+  MenuProps: PropTypes.object,
+  /**
+   * If `true`, `value` must be an array and the menu will support multiple selections.
+   */
+  multiple: PropTypes.bool,
+  /**
+   * Name attribute of the `select` or hidden `input` element.
+   */
+  name: PropTypes.string,
+  /**
+   * @ignore
+   */
+  onBlur: PropTypes.func,
+  /**
+   * Callback fired when a menu item is selected.
+   *
+   * @param {object} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (any).
+   * @param {object} [child] The react element that was selected.
+   */
+  onChange: PropTypes.func,
+  /**
+   * Callback fired when the component requests to be closed.
+   * Use in controlled mode (see open).
+   *
+   * @param {object} event The event source of the callback.
+   */
+  onClose: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onFocus: PropTypes.func,
+  /**
+   * Callback fired when the component requests to be opened.
+   * Use in controlled mode (see open).
+   *
+   * @param {object} event The event source of the callback.
+   */
+  onOpen: PropTypes.func,
+  /**
+   * If `true`, the component is shown.
+   */
+  open: PropTypes.bool,
+  /**
+   * @ignore
+   */
+  readOnly: PropTypes.bool,
+  /**
+   * Render the selected value.
+   *
+   * @param {any} value The `value` provided to the component.
+   * @returns {ReactNode}
+   */
+  renderValue: PropTypes.func,
+  /**
+   * Props applied to the clickable div element.
+   */
+  SelectDisplayProps: PropTypes.object,
+  /**
+   * @ignore
+   */
+  tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * @ignore
+   */
+  type: PropTypes.any,
+  /**
+   * The input value.
+   */
+  value: PropTypes.any,
+  /**
+   * The variant to use.
+   */
+  variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])
+} : void 0;
+export default SelectInput;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Select/selectClasses.js b/ddb_main/node_modules/@mui/material/Select/selectClasses.js
new file mode 100644
index 0000000..d957165
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Select/selectClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getSelectUtilityClasses(slot) {
+  return generateUtilityClass('MuiSelect', slot);
+}
+const selectClasses = generateUtilityClasses('MuiSelect', ['root', 'select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'focused', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput', 'error']);
+export default selectClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Stack/Stack.js b/ddb_main/node_modules/@mui/material/Stack/Stack.js
new file mode 100644
index 0000000..6577b12
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Stack/Stack.js
@@ -0,0 +1,62 @@
+'use client';
+
+import PropTypes from 'prop-types';
+import { createStack } from '@mui/system';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+const Stack = createStack({
+  createStyledComponent: styled('div', {
+    name: 'MuiStack',
+    slot: 'Root',
+    overridesResolver: (props, styles) => styles.root
+  }),
+  useThemeProps: inProps => useThemeProps({
+    props: inProps,
+    name: 'MuiStack'
+  })
+});
+process.env.NODE_ENV !== "production" ? Stack.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * Defines the `flex-direction` style property.
+   * It is applied for all screen sizes.
+   * @default 'column'
+   */
+  direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
+  /**
+   * Add an element between each child.
+   */
+  divider: PropTypes.node,
+  /**
+   * Defines the space between immediate children.
+   * @default 0
+   */
+  spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
+  /**
+   * The system prop, which allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.
+   *
+   * While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack/#limitations),
+   * it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.
+   *
+   * To enable this flag globally, follow the [theme's default props](https://mui.com/material-ui/customization/theme-components/#default-props) configuration.
+   * @default false
+   */
+  useFlexGap: PropTypes.bool
+} : void 0;
+export default Stack;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/SvgIcon/SvgIcon.js b/ddb_main/node_modules/@mui/material/SvgIcon/SvgIcon.js
new file mode 100644
index 0000000..db4509c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/SvgIcon/SvgIcon.js
@@ -0,0 +1,187 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import capitalize from '../utils/capitalize';
+import useThemeProps from '../styles/useThemeProps';
+import styled from '../styles/styled';
+import { getSvgIconUtilityClass } from './svgIconClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    color,
+    fontSize,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', color !== 'inherit' && `color${capitalize(color)}`, `fontSize${capitalize(fontSize)}`]
+  };
+  return composeClasses(slots, getSvgIconUtilityClass, classes);
+};
+const SvgIconRoot = styled('svg', {
+  name: 'MuiSvgIcon',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.color !== 'inherit' && styles[`color${capitalize(ownerState.color)}`], styles[`fontSize${capitalize(ownerState.fontSize)}`]];
+  }
+})(({
+  theme,
+  ownerState
+}) => {
+  var _theme$transitions, _theme$transitions$cr, _theme$transitions2, _theme$typography, _theme$typography$pxT, _theme$typography2, _theme$typography2$px, _theme$typography3, _theme$typography3$px, _palette$ownerState$c, _palette, _palette2, _palette3;
+  return {
+    userSelect: 'none',
+    width: '1em',
+    height: '1em',
+    display: 'inline-block',
+    // the <svg> will define the property that has `currentColor`
+    // for example heroicons uses fill="none" and stroke="currentColor"
+    fill: ownerState.hasSvgAsChild ? undefined : 'currentColor',
+    flexShrink: 0,
+    transition: (_theme$transitions = theme.transitions) == null || (_theme$transitions$cr = _theme$transitions.create) == null ? void 0 : _theme$transitions$cr.call(_theme$transitions, 'fill', {
+      duration: (_theme$transitions2 = theme.transitions) == null || (_theme$transitions2 = _theme$transitions2.duration) == null ? void 0 : _theme$transitions2.shorter
+    }),
+    fontSize: {
+      inherit: 'inherit',
+      small: ((_theme$typography = theme.typography) == null || (_theme$typography$pxT = _theme$typography.pxToRem) == null ? void 0 : _theme$typography$pxT.call(_theme$typography, 20)) || '1.25rem',
+      medium: ((_theme$typography2 = theme.typography) == null || (_theme$typography2$px = _theme$typography2.pxToRem) == null ? void 0 : _theme$typography2$px.call(_theme$typography2, 24)) || '1.5rem',
+      large: ((_theme$typography3 = theme.typography) == null || (_theme$typography3$px = _theme$typography3.pxToRem) == null ? void 0 : _theme$typography3$px.call(_theme$typography3, 35)) || '2.1875rem'
+    }[ownerState.fontSize],
+    // TODO v5 deprecate, v6 remove for sx
+    color: (_palette$ownerState$c = (_palette = (theme.vars || theme).palette) == null || (_palette = _palette[ownerState.color]) == null ? void 0 : _palette.main) != null ? _palette$ownerState$c : {
+      action: (_palette2 = (theme.vars || theme).palette) == null || (_palette2 = _palette2.action) == null ? void 0 : _palette2.active,
+      disabled: (_palette3 = (theme.vars || theme).palette) == null || (_palette3 = _palette3.action) == null ? void 0 : _palette3.disabled,
+      inherit: undefined
+    }[ownerState.color]
+  };
+});
+const SvgIcon = /*#__PURE__*/React.forwardRef(function SvgIcon(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiSvgIcon'
+  });
+  const {
+      children,
+      className,
+      color = 'inherit',
+      component = 'svg',
+      fontSize = 'medium',
+      htmlColor,
+      inheritViewBox = false,
+      titleAccess,
+      viewBox = '0 0 24 24'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const hasSvgAsChild = /*#__PURE__*/React.isValidElement(children) && children.type === 'svg';
+  const ownerState = _extends({}, props, {
+    color,
+    component,
+    fontSize,
+    instanceFontSize: inProps.fontSize,
+    inheritViewBox,
+    viewBox,
+    hasSvgAsChild
+  });
+  const more = {};
+  if (!inheritViewBox) {
+    more.viewBox = viewBox;
+  }
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsxs(SvgIconRoot, _extends({
+    as: component,
+    className: clsx(classes.root, className),
+    focusable: "false",
+    color: htmlColor,
+    "aria-hidden": titleAccess ? undefined : true,
+    role: titleAccess ? 'img' : undefined,
+    ref: ref
+  }, more, other, hasSvgAsChild && children.props, {
+    ownerState: ownerState,
+    children: [hasSvgAsChild ? children.props.children : children, titleAccess ? /*#__PURE__*/_jsx("title", {
+      children: titleAccess
+    }) : null]
+  }));
+});
+process.env.NODE_ENV !== "production" ? SvgIcon.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Node passed into the SVG element.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * You can use the `htmlColor` prop to apply a color attribute to the SVG element.
+   * @default 'inherit'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'action', 'disabled', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size.
+   * @default 'medium'
+   */
+  fontSize: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'large', 'medium', 'small']), PropTypes.string]),
+  /**
+   * Applies a color attribute to the SVG element.
+   */
+  htmlColor: PropTypes.string,
+  /**
+   * If `true`, the root node will inherit the custom `component`'s viewBox and the `viewBox`
+   * prop will be ignored.
+   * Useful when you want to reference a custom `component` and have `SvgIcon` pass that
+   * `component`'s viewBox to the root node.
+   * @default false
+   */
+  inheritViewBox: PropTypes.bool,
+  /**
+   * The shape-rendering attribute. The behavior of the different options is described on the
+   * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/shape-rendering).
+   * If you are having issues with blurry icons you should investigate this prop.
+   */
+  shapeRendering: PropTypes.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * Provides a human-readable title for the element that contains it.
+   * https://www.w3.org/TR/SVG-access/#Equivalent
+   */
+  titleAccess: PropTypes.string,
+  /**
+   * Allows you to redefine what the coordinates without units mean inside an SVG element.
+   * For example, if the SVG element is 500 (width) by 200 (height),
+   * and you pass viewBox="0 0 50 20",
+   * this means that the coordinates inside the SVG will go from the top left corner (0,0)
+   * to bottom right (50,20) and each unit will be worth 10px.
+   * @default '0 0 24 24'
+   */
+  viewBox: PropTypes.string
+} : void 0;
+SvgIcon.muiName = 'SvgIcon';
+export default SvgIcon;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/SvgIcon/svgIconClasses.js b/ddb_main/node_modules/@mui/material/SvgIcon/svgIconClasses.js
new file mode 100644
index 0000000..626a3b6
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/SvgIcon/svgIconClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getSvgIconUtilityClass(slot) {
+  return generateUtilityClass('MuiSvgIcon', slot);
+}
+const svgIconClasses = generateUtilityClasses('MuiSvgIcon', ['root', 'colorPrimary', 'colorSecondary', 'colorAction', 'colorError', 'colorDisabled', 'fontSizeInherit', 'fontSizeSmall', 'fontSizeMedium', 'fontSizeLarge']);
+export default svgIconClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Switch/Switch.js b/ddb_main/node_modules/@mui/material/Switch/Switch.js
new file mode 100644
index 0000000..239a508
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Switch/Switch.js
@@ -0,0 +1,339 @@
+'use client';
+
+// @inheritedComponent IconButton
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "color", "edge", "size", "sx"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import refType from '@mui/utils/refType';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha, darken, lighten } from '@mui/system/colorManipulator';
+import capitalize from '../utils/capitalize';
+import SwitchBase from '../internal/SwitchBase';
+import { styled, createUseThemeProps } from '../zero-styled';
+import switchClasses, { getSwitchUtilityClass } from './switchClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useThemeProps = createUseThemeProps('MuiSwitch');
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    edge,
+    size,
+    color,
+    checked,
+    disabled
+  } = ownerState;
+  const slots = {
+    root: ['root', edge && `edge${capitalize(edge)}`, `size${capitalize(size)}`],
+    switchBase: ['switchBase', `color${capitalize(color)}`, checked && 'checked', disabled && 'disabled'],
+    thumb: ['thumb'],
+    track: ['track'],
+    input: ['input']
+  };
+  const composedClasses = composeClasses(slots, getSwitchUtilityClass, classes);
+  return _extends({}, classes, composedClasses);
+};
+const SwitchRoot = styled('span', {
+  name: 'MuiSwitch',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.edge && styles[`edge${capitalize(ownerState.edge)}`], styles[`size${capitalize(ownerState.size)}`]];
+  }
+})({
+  display: 'inline-flex',
+  width: 34 + 12 * 2,
+  height: 14 + 12 * 2,
+  overflow: 'hidden',
+  padding: 12,
+  boxSizing: 'border-box',
+  position: 'relative',
+  flexShrink: 0,
+  zIndex: 0,
+  // Reset the stacking context.
+  verticalAlign: 'middle',
+  // For correct alignment with the text.
+  '@media print': {
+    colorAdjust: 'exact'
+  },
+  variants: [{
+    props: {
+      edge: 'start'
+    },
+    style: {
+      marginLeft: -8
+    }
+  }, {
+    props: {
+      edge: 'end'
+    },
+    style: {
+      marginRight: -8
+    }
+  }, {
+    props: {
+      size: 'small'
+    },
+    style: {
+      width: 40,
+      height: 24,
+      padding: 7,
+      [`& .${switchClasses.thumb}`]: {
+        width: 16,
+        height: 16
+      },
+      [`& .${switchClasses.switchBase}`]: {
+        padding: 4,
+        [`&.${switchClasses.checked}`]: {
+          transform: 'translateX(16px)'
+        }
+      }
+    }
+  }]
+});
+const SwitchSwitchBase = styled(SwitchBase, {
+  name: 'MuiSwitch',
+  slot: 'SwitchBase',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.switchBase, {
+      [`& .${switchClasses.input}`]: styles.input
+    }, ownerState.color !== 'default' && styles[`color${capitalize(ownerState.color)}`]];
+  }
+})(({
+  theme
+}) => ({
+  position: 'absolute',
+  top: 0,
+  left: 0,
+  zIndex: 1,
+  // Render above the focus ripple.
+  color: theme.vars ? theme.vars.palette.Switch.defaultColor : `${theme.palette.mode === 'light' ? theme.palette.common.white : theme.palette.grey[300]}`,
+  transition: theme.transitions.create(['left', 'transform'], {
+    duration: theme.transitions.duration.shortest
+  }),
+  [`&.${switchClasses.checked}`]: {
+    transform: 'translateX(20px)'
+  },
+  [`&.${switchClasses.disabled}`]: {
+    color: theme.vars ? theme.vars.palette.Switch.defaultDisabledColor : `${theme.palette.mode === 'light' ? theme.palette.grey[100] : theme.palette.grey[600]}`
+  },
+  [`&.${switchClasses.checked} + .${switchClasses.track}`]: {
+    opacity: 0.5
+  },
+  [`&.${switchClasses.disabled} + .${switchClasses.track}`]: {
+    opacity: theme.vars ? theme.vars.opacity.switchTrackDisabled : `${theme.palette.mode === 'light' ? 0.12 : 0.2}`
+  },
+  [`& .${switchClasses.input}`]: {
+    left: '-100%',
+    width: '300%'
+  }
+}), ({
+  theme
+}) => ({
+  '&:hover': {
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.activeChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.action.active, theme.palette.action.hoverOpacity),
+    // Reset on touch devices, it doesn't add specificity
+    '@media (hover: none)': {
+      backgroundColor: 'transparent'
+    }
+  },
+  variants: [...Object.entries(theme.palette).filter(([, value]) => value.main && value.light) // check all the used fields in the style below
+  .map(([color]) => ({
+    props: {
+      color
+    },
+    style: {
+      [`&.${switchClasses.checked}`]: {
+        color: (theme.vars || theme).palette[color].main,
+        '&:hover': {
+          backgroundColor: theme.vars ? `rgba(${theme.vars.palette[color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[color].main, theme.palette.action.hoverOpacity),
+          '@media (hover: none)': {
+            backgroundColor: 'transparent'
+          }
+        },
+        [`&.${switchClasses.disabled}`]: {
+          color: theme.vars ? theme.vars.palette.Switch[`${color}DisabledColor`] : `${theme.palette.mode === 'light' ? lighten(theme.palette[color].main, 0.62) : darken(theme.palette[color].main, 0.55)}`
+        }
+      },
+      [`&.${switchClasses.checked} + .${switchClasses.track}`]: {
+        backgroundColor: (theme.vars || theme).palette[color].main
+      }
+    }
+  }))]
+}));
+const SwitchTrack = styled('span', {
+  name: 'MuiSwitch',
+  slot: 'Track',
+  overridesResolver: (props, styles) => styles.track
+})(({
+  theme
+}) => ({
+  height: '100%',
+  width: '100%',
+  borderRadius: 14 / 2,
+  zIndex: -1,
+  transition: theme.transitions.create(['opacity', 'background-color'], {
+    duration: theme.transitions.duration.shortest
+  }),
+  backgroundColor: theme.vars ? theme.vars.palette.common.onBackground : `${theme.palette.mode === 'light' ? theme.palette.common.black : theme.palette.common.white}`,
+  opacity: theme.vars ? theme.vars.opacity.switchTrack : `${theme.palette.mode === 'light' ? 0.38 : 0.3}`
+}));
+const SwitchThumb = styled('span', {
+  name: 'MuiSwitch',
+  slot: 'Thumb',
+  overridesResolver: (props, styles) => styles.thumb
+})(({
+  theme
+}) => ({
+  boxShadow: (theme.vars || theme).shadows[1],
+  backgroundColor: 'currentColor',
+  width: 20,
+  height: 20,
+  borderRadius: '50%'
+}));
+const Switch = /*#__PURE__*/React.forwardRef(function Switch(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiSwitch'
+  });
+  const {
+      className,
+      color = 'primary',
+      edge = false,
+      size = 'medium',
+      sx
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    color,
+    edge,
+    size
+  });
+  const classes = useUtilityClasses(ownerState);
+  const icon = /*#__PURE__*/_jsx(SwitchThumb, {
+    className: classes.thumb,
+    ownerState: ownerState
+  });
+  return /*#__PURE__*/_jsxs(SwitchRoot, {
+    className: clsx(classes.root, className),
+    sx: sx,
+    ownerState: ownerState,
+    children: [/*#__PURE__*/_jsx(SwitchSwitchBase, _extends({
+      type: "checkbox",
+      icon: icon,
+      checkedIcon: icon,
+      ref: ref,
+      ownerState: ownerState
+    }, other, {
+      classes: _extends({}, classes, {
+        root: classes.switchBase
+      })
+    })), /*#__PURE__*/_jsx(SwitchTrack, {
+      className: classes.track,
+      ownerState: ownerState
+    })]
+  });
+});
+process.env.NODE_ENV !== "production" ? Switch.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: PropTypes.bool,
+  /**
+   * The icon to display when the component is checked.
+   */
+  checkedIcon: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'primary'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['default', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * The default checked state. Use when the component is not controlled.
+   */
+  defaultChecked: PropTypes.bool,
+  /**
+   * If `true`, the component is disabled.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   * @default false
+   */
+  disableRipple: PropTypes.bool,
+  /**
+   * If given, uses a negative margin to counteract the padding on one
+   * side (this is often helpful for aligning the left or right
+   * side of the icon with content above or below, without ruining the border
+   * size and shape).
+   * @default false
+   */
+  edge: PropTypes.oneOf(['end', 'start', false]),
+  /**
+   * The icon to display when the component is unchecked.
+   */
+  icon: PropTypes.node,
+  /**
+   * The id of the `input` element.
+   */
+  id: PropTypes.string,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   */
+  inputProps: PropTypes.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: refType,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: PropTypes.func,
+  /**
+   * If `true`, the `input` element is required.
+   * @default false
+   */
+  required: PropTypes.bool,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense switch styling.
+   * @default 'medium'
+   */
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The value of the component. The DOM API casts this to a string.
+   * The browser uses "on" as the default value.
+   */
+  value: PropTypes.any
+} : void 0;
+export default Switch;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Switch/switchClasses.js b/ddb_main/node_modules/@mui/material/Switch/switchClasses.js
new file mode 100644
index 0000000..b0f2631
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Switch/switchClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getSwitchUtilityClass(slot) {
+  return generateUtilityClass('MuiSwitch', slot);
+}
+const switchClasses = generateUtilityClasses('MuiSwitch', ['root', 'edgeStart', 'edgeEnd', 'switchBase', 'colorPrimary', 'colorSecondary', 'sizeSmall', 'sizeMedium', 'checked', 'disabled', 'input', 'thumb', 'track']);
+export default switchClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Tab/Tab.js b/ddb_main/node_modules/@mui/material/Tab/Tab.js
new file mode 100644
index 0000000..1fe17b8
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Tab/Tab.js
@@ -0,0 +1,262 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "disabled", "disableFocusRipple", "fullWidth", "icon", "iconPosition", "indicator", "label", "onChange", "onClick", "onFocus", "selected", "selectionFollowsFocus", "textColor", "value", "wrapped"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import ButtonBase from '../ButtonBase';
+import capitalize from '../utils/capitalize';
+import useThemeProps from '../styles/useThemeProps';
+import styled from '../styles/styled';
+import unsupportedProp from '../utils/unsupportedProp';
+import tabClasses, { getTabUtilityClass } from './tabClasses';
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    textColor,
+    fullWidth,
+    wrapped,
+    icon,
+    label,
+    selected,
+    disabled
+  } = ownerState;
+  const slots = {
+    root: ['root', icon && label && 'labelIcon', `textColor${capitalize(textColor)}`, fullWidth && 'fullWidth', wrapped && 'wrapped', selected && 'selected', disabled && 'disabled'],
+    iconWrapper: ['iconWrapper']
+  };
+  return composeClasses(slots, getTabUtilityClass, classes);
+};
+const TabRoot = styled(ButtonBase, {
+  name: 'MuiTab',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.label && ownerState.icon && styles.labelIcon, styles[`textColor${capitalize(ownerState.textColor)}`], ownerState.fullWidth && styles.fullWidth, ownerState.wrapped && styles.wrapped];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({}, theme.typography.button, {
+  maxWidth: 360,
+  minWidth: 90,
+  position: 'relative',
+  minHeight: 48,
+  flexShrink: 0,
+  padding: '12px 16px',
+  overflow: 'hidden',
+  whiteSpace: 'normal',
+  textAlign: 'center'
+}, ownerState.label && {
+  flexDirection: ownerState.iconPosition === 'top' || ownerState.iconPosition === 'bottom' ? 'column' : 'row'
+}, {
+  lineHeight: 1.25
+}, ownerState.icon && ownerState.label && {
+  minHeight: 72,
+  paddingTop: 9,
+  paddingBottom: 9,
+  [`& > .${tabClasses.iconWrapper}`]: _extends({}, ownerState.iconPosition === 'top' && {
+    marginBottom: 6
+  }, ownerState.iconPosition === 'bottom' && {
+    marginTop: 6
+  }, ownerState.iconPosition === 'start' && {
+    marginRight: theme.spacing(1)
+  }, ownerState.iconPosition === 'end' && {
+    marginLeft: theme.spacing(1)
+  })
+}, ownerState.textColor === 'inherit' && {
+  color: 'inherit',
+  opacity: 0.6,
+  // same opacity as theme.palette.text.secondary
+  [`&.${tabClasses.selected}`]: {
+    opacity: 1
+  },
+  [`&.${tabClasses.disabled}`]: {
+    opacity: (theme.vars || theme).palette.action.disabledOpacity
+  }
+}, ownerState.textColor === 'primary' && {
+  color: (theme.vars || theme).palette.text.secondary,
+  [`&.${tabClasses.selected}`]: {
+    color: (theme.vars || theme).palette.primary.main
+  },
+  [`&.${tabClasses.disabled}`]: {
+    color: (theme.vars || theme).palette.text.disabled
+  }
+}, ownerState.textColor === 'secondary' && {
+  color: (theme.vars || theme).palette.text.secondary,
+  [`&.${tabClasses.selected}`]: {
+    color: (theme.vars || theme).palette.secondary.main
+  },
+  [`&.${tabClasses.disabled}`]: {
+    color: (theme.vars || theme).palette.text.disabled
+  }
+}, ownerState.fullWidth && {
+  flexShrink: 1,
+  flexGrow: 1,
+  flexBasis: 0,
+  maxWidth: 'none'
+}, ownerState.wrapped && {
+  fontSize: theme.typography.pxToRem(12)
+}));
+const Tab = /*#__PURE__*/React.forwardRef(function Tab(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiTab'
+  });
+  const {
+      className,
+      disabled = false,
+      disableFocusRipple = false,
+      // eslint-disable-next-line react/prop-types
+      fullWidth,
+      icon: iconProp,
+      iconPosition = 'top',
+      // eslint-disable-next-line react/prop-types
+      indicator,
+      label,
+      onChange,
+      onClick,
+      onFocus,
+      // eslint-disable-next-line react/prop-types
+      selected,
+      // eslint-disable-next-line react/prop-types
+      selectionFollowsFocus,
+      // eslint-disable-next-line react/prop-types
+      textColor = 'inherit',
+      value,
+      wrapped = false
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    disabled,
+    disableFocusRipple,
+    selected,
+    icon: !!iconProp,
+    iconPosition,
+    label: !!label,
+    fullWidth,
+    textColor,
+    wrapped
+  });
+  const classes = useUtilityClasses(ownerState);
+  const icon = iconProp && label && /*#__PURE__*/React.isValidElement(iconProp) ? /*#__PURE__*/React.cloneElement(iconProp, {
+    className: clsx(classes.iconWrapper, iconProp.props.className)
+  }) : iconProp;
+  const handleClick = event => {
+    if (!selected && onChange) {
+      onChange(event, value);
+    }
+    if (onClick) {
+      onClick(event);
+    }
+  };
+  const handleFocus = event => {
+    if (selectionFollowsFocus && !selected && onChange) {
+      onChange(event, value);
+    }
+    if (onFocus) {
+      onFocus(event);
+    }
+  };
+  return /*#__PURE__*/_jsxs(TabRoot, _extends({
+    focusRipple: !disableFocusRipple,
+    className: clsx(classes.root, className),
+    ref: ref,
+    role: "tab",
+    "aria-selected": selected,
+    disabled: disabled,
+    onClick: handleClick,
+    onFocus: handleFocus,
+    ownerState: ownerState,
+    tabIndex: selected ? 0 : -1
+  }, other, {
+    children: [iconPosition === 'top' || iconPosition === 'start' ? /*#__PURE__*/_jsxs(React.Fragment, {
+      children: [icon, label]
+    }) : /*#__PURE__*/_jsxs(React.Fragment, {
+      children: [label, icon]
+    }), indicator]
+  }));
+});
+process.env.NODE_ENV !== "production" ? Tab.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * This prop isn't supported.
+   * Use the `component` prop if you need to change the children structure.
+   */
+  children: unsupportedProp,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: PropTypes.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   *
+   * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
+   * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
+   * @default false
+   */
+  disableRipple: PropTypes.bool,
+  /**
+   * The icon to display.
+   */
+  icon: PropTypes.oneOfType([PropTypes.element, PropTypes.string]),
+  /**
+   * The position of the icon relative to the label.
+   * @default 'top'
+   */
+  iconPosition: PropTypes.oneOf(['bottom', 'end', 'start', 'top']),
+  /**
+   * The label element.
+   */
+  label: PropTypes.node,
+  /**
+   * @ignore
+   */
+  onChange: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onClick: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onFocus: PropTypes.func,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * You can provide your own value. Otherwise, we fallback to the child position index.
+   */
+  value: PropTypes.any,
+  /**
+   * Tab labels appear in a single row.
+   * They can use a second line if needed.
+   * @default false
+   */
+  wrapped: PropTypes.bool
+} : void 0;
+export default Tab;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Tab/tabClasses.js b/ddb_main/node_modules/@mui/material/Tab/tabClasses.js
new file mode 100644
index 0000000..315f32d
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Tab/tabClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getTabUtilityClass(slot) {
+  return generateUtilityClass('MuiTab', slot);
+}
+const tabClasses = generateUtilityClasses('MuiTab', ['root', 'labelIcon', 'textColorInherit', 'textColorPrimary', 'textColorSecondary', 'selected', 'disabled', 'fullWidth', 'wrapped', 'iconWrapper']);
+export default tabClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/TabScrollButton/TabScrollButton.js b/ddb_main/node_modules/@mui/material/TabScrollButton/TabScrollButton.js
new file mode 100644
index 0000000..668776a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/TabScrollButton/TabScrollButton.js
@@ -0,0 +1,155 @@
+'use client';
+
+/* eslint-disable jsx-a11y/aria-role */
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "slots", "slotProps", "direction", "orientation", "disabled"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { useSlotProps } from '@mui/base/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import { useRtl } from '@mui/system/RtlProvider';
+import KeyboardArrowLeft from '../internal/svg-icons/KeyboardArrowLeft';
+import KeyboardArrowRight from '../internal/svg-icons/KeyboardArrowRight';
+import ButtonBase from '../ButtonBase';
+import useThemeProps from '../styles/useThemeProps';
+import styled from '../styles/styled';
+import tabScrollButtonClasses, { getTabScrollButtonUtilityClass } from './tabScrollButtonClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    orientation,
+    disabled
+  } = ownerState;
+  const slots = {
+    root: ['root', orientation, disabled && 'disabled']
+  };
+  return composeClasses(slots, getTabScrollButtonUtilityClass, classes);
+};
+const TabScrollButtonRoot = styled(ButtonBase, {
+  name: 'MuiTabScrollButton',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.orientation && styles[ownerState.orientation]];
+  }
+})(({
+  ownerState
+}) => _extends({
+  width: 40,
+  flexShrink: 0,
+  opacity: 0.8,
+  [`&.${tabScrollButtonClasses.disabled}`]: {
+    opacity: 0
+  }
+}, ownerState.orientation === 'vertical' && {
+  width: '100%',
+  height: 40,
+  '& svg': {
+    transform: `rotate(${ownerState.isRtl ? -90 : 90}deg)`
+  }
+}));
+const TabScrollButton = /*#__PURE__*/React.forwardRef(function TabScrollButton(inProps, ref) {
+  var _slots$StartScrollBut, _slots$EndScrollButto;
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiTabScrollButton'
+  });
+  const {
+      className,
+      slots = {},
+      slotProps = {},
+      direction
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const isRtl = useRtl();
+  const ownerState = _extends({
+    isRtl
+  }, props);
+  const classes = useUtilityClasses(ownerState);
+  const StartButtonIcon = (_slots$StartScrollBut = slots.StartScrollButtonIcon) != null ? _slots$StartScrollBut : KeyboardArrowLeft;
+  const EndButtonIcon = (_slots$EndScrollButto = slots.EndScrollButtonIcon) != null ? _slots$EndScrollButto : KeyboardArrowRight;
+  const startButtonIconProps = useSlotProps({
+    elementType: StartButtonIcon,
+    externalSlotProps: slotProps.startScrollButtonIcon,
+    additionalProps: {
+      fontSize: 'small'
+    },
+    ownerState
+  });
+  const endButtonIconProps = useSlotProps({
+    elementType: EndButtonIcon,
+    externalSlotProps: slotProps.endScrollButtonIcon,
+    additionalProps: {
+      fontSize: 'small'
+    },
+    ownerState
+  });
+  return /*#__PURE__*/_jsx(TabScrollButtonRoot, _extends({
+    component: "div",
+    className: clsx(classes.root, className),
+    ref: ref,
+    role: null,
+    ownerState: ownerState,
+    tabIndex: null
+  }, other, {
+    children: direction === 'left' ? /*#__PURE__*/_jsx(StartButtonIcon, _extends({}, startButtonIconProps)) : /*#__PURE__*/_jsx(EndButtonIcon, _extends({}, endButtonIconProps))
+  }));
+});
+process.env.NODE_ENV !== "production" ? TabScrollButton.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The direction the button should indicate.
+   */
+  direction: PropTypes.oneOf(['left', 'right']).isRequired,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: PropTypes.bool,
+  /**
+   * The component orientation (layout flow direction).
+   */
+  orientation: PropTypes.oneOf(['horizontal', 'vertical']).isRequired,
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    endScrollButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    startScrollButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    EndScrollButtonIcon: PropTypes.elementType,
+    StartScrollButtonIcon: PropTypes.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default TabScrollButton;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/TabScrollButton/tabScrollButtonClasses.js b/ddb_main/node_modules/@mui/material/TabScrollButton/tabScrollButtonClasses.js
new file mode 100644
index 0000000..c02151f
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/TabScrollButton/tabScrollButtonClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getTabScrollButtonUtilityClass(slot) {
+  return generateUtilityClass('MuiTabScrollButton', slot);
+}
+const tabScrollButtonClasses = generateUtilityClasses('MuiTabScrollButton', ['root', 'vertical', 'horizontal', 'disabled']);
+export default tabScrollButtonClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Tabs/ScrollbarSize.js b/ddb_main/node_modules/@mui/material/Tabs/ScrollbarSize.js
new file mode 100644
index 0000000..234e516
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Tabs/ScrollbarSize.js
@@ -0,0 +1,60 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["onChange"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import debounce from '../utils/debounce';
+import { ownerWindow, unstable_useEnhancedEffect as useEnhancedEffect } from '../utils';
+import { jsx as _jsx } from "react/jsx-runtime";
+const styles = {
+  width: 99,
+  height: 99,
+  position: 'absolute',
+  top: -9999,
+  overflow: 'scroll'
+};
+
+/**
+ * @ignore - internal component.
+ * The component originates from https://github.com/STORIS/react-scrollbar-size.
+ * It has been moved into the core in order to minimize the bundle size.
+ */
+export default function ScrollbarSize(props) {
+  const {
+      onChange
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const scrollbarHeight = React.useRef();
+  const nodeRef = React.useRef(null);
+  const setMeasurements = () => {
+    scrollbarHeight.current = nodeRef.current.offsetHeight - nodeRef.current.clientHeight;
+  };
+  useEnhancedEffect(() => {
+    const handleResize = debounce(() => {
+      const prevHeight = scrollbarHeight.current;
+      setMeasurements();
+      if (prevHeight !== scrollbarHeight.current) {
+        onChange(scrollbarHeight.current);
+      }
+    });
+    const containerWindow = ownerWindow(nodeRef.current);
+    containerWindow.addEventListener('resize', handleResize);
+    return () => {
+      handleResize.clear();
+      containerWindow.removeEventListener('resize', handleResize);
+    };
+  }, [onChange]);
+  React.useEffect(() => {
+    setMeasurements();
+    onChange(scrollbarHeight.current);
+  }, [onChange]);
+  return /*#__PURE__*/_jsx("div", _extends({
+    style: styles,
+    ref: nodeRef
+  }, other));
+}
+process.env.NODE_ENV !== "production" ? ScrollbarSize.propTypes = {
+  onChange: PropTypes.func.isRequired
+} : void 0;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Tabs/Tabs.js b/ddb_main/node_modules/@mui/material/Tabs/Tabs.js
new file mode 100644
index 0000000..9887039
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Tabs/Tabs.js
@@ -0,0 +1,840 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["aria-label", "aria-labelledby", "action", "centered", "children", "className", "component", "allowScrollButtonsMobile", "indicatorColor", "onChange", "orientation", "ScrollButtonComponent", "scrollButtons", "selectionFollowsFocus", "slots", "slotProps", "TabIndicatorProps", "TabScrollButtonProps", "textColor", "value", "variant", "visibleScrollbar"];
+import * as React from 'react';
+import { isFragment } from 'react-is';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import refType from '@mui/utils/refType';
+import { useSlotProps } from '@mui/base/utils';
+import composeClasses from '@mui/utils/composeClasses';
+import { useRtl } from '@mui/system/RtlProvider';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import useTheme from '../styles/useTheme';
+import debounce from '../utils/debounce';
+import { getNormalizedScrollLeft, detectScrollType } from '../utils/scrollLeft';
+import animate from '../internal/animate';
+import ScrollbarSize from './ScrollbarSize';
+import TabScrollButton from '../TabScrollButton';
+import useEventCallback from '../utils/useEventCallback';
+import tabsClasses, { getTabsUtilityClass } from './tabsClasses';
+import ownerDocument from '../utils/ownerDocument';
+import ownerWindow from '../utils/ownerWindow';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const nextItem = (list, item) => {
+  if (list === item) {
+    return list.firstChild;
+  }
+  if (item && item.nextElementSibling) {
+    return item.nextElementSibling;
+  }
+  return list.firstChild;
+};
+const previousItem = (list, item) => {
+  if (list === item) {
+    return list.lastChild;
+  }
+  if (item && item.previousElementSibling) {
+    return item.previousElementSibling;
+  }
+  return list.lastChild;
+};
+const moveFocus = (list, currentFocus, traversalFunction) => {
+  let wrappedOnce = false;
+  let nextFocus = traversalFunction(list, currentFocus);
+  while (nextFocus) {
+    // Prevent infinite loop.
+    if (nextFocus === list.firstChild) {
+      if (wrappedOnce) {
+        return;
+      }
+      wrappedOnce = true;
+    }
+
+    // Same logic as useAutocomplete.js
+    const nextFocusDisabled = nextFocus.disabled || nextFocus.getAttribute('aria-disabled') === 'true';
+    if (!nextFocus.hasAttribute('tabindex') || nextFocusDisabled) {
+      // Move to the next element.
+      nextFocus = traversalFunction(list, nextFocus);
+    } else {
+      nextFocus.focus();
+      return;
+    }
+  }
+};
+const useUtilityClasses = ownerState => {
+  const {
+    vertical,
+    fixed,
+    hideScrollbar,
+    scrollableX,
+    scrollableY,
+    centered,
+    scrollButtonsHideMobile,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', vertical && 'vertical'],
+    scroller: ['scroller', fixed && 'fixed', hideScrollbar && 'hideScrollbar', scrollableX && 'scrollableX', scrollableY && 'scrollableY'],
+    flexContainer: ['flexContainer', vertical && 'flexContainerVertical', centered && 'centered'],
+    indicator: ['indicator'],
+    scrollButtons: ['scrollButtons', scrollButtonsHideMobile && 'scrollButtonsHideMobile'],
+    scrollableX: [scrollableX && 'scrollableX'],
+    hideScrollbar: [hideScrollbar && 'hideScrollbar']
+  };
+  return composeClasses(slots, getTabsUtilityClass, classes);
+};
+const TabsRoot = styled('div', {
+  name: 'MuiTabs',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [{
+      [`& .${tabsClasses.scrollButtons}`]: styles.scrollButtons
+    }, {
+      [`& .${tabsClasses.scrollButtons}`]: ownerState.scrollButtonsHideMobile && styles.scrollButtonsHideMobile
+    }, styles.root, ownerState.vertical && styles.vertical];
+  }
+})(({
+  ownerState,
+  theme
+}) => _extends({
+  overflow: 'hidden',
+  minHeight: 48,
+  // Add iOS momentum scrolling for iOS < 13.0
+  WebkitOverflowScrolling: 'touch',
+  display: 'flex'
+}, ownerState.vertical && {
+  flexDirection: 'column'
+}, ownerState.scrollButtonsHideMobile && {
+  [`& .${tabsClasses.scrollButtons}`]: {
+    [theme.breakpoints.down('sm')]: {
+      display: 'none'
+    }
+  }
+}));
+const TabsScroller = styled('div', {
+  name: 'MuiTabs',
+  slot: 'Scroller',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.scroller, ownerState.fixed && styles.fixed, ownerState.hideScrollbar && styles.hideScrollbar, ownerState.scrollableX && styles.scrollableX, ownerState.scrollableY && styles.scrollableY];
+  }
+})(({
+  ownerState
+}) => _extends({
+  position: 'relative',
+  display: 'inline-block',
+  flex: '1 1 auto',
+  whiteSpace: 'nowrap'
+}, ownerState.fixed && {
+  overflowX: 'hidden',
+  width: '100%'
+}, ownerState.hideScrollbar && {
+  // Hide dimensionless scrollbar on macOS
+  scrollbarWidth: 'none',
+  // Firefox
+  '&::-webkit-scrollbar': {
+    display: 'none' // Safari + Chrome
+  }
+}, ownerState.scrollableX && {
+  overflowX: 'auto',
+  overflowY: 'hidden'
+}, ownerState.scrollableY && {
+  overflowY: 'auto',
+  overflowX: 'hidden'
+}));
+const FlexContainer = styled('div', {
+  name: 'MuiTabs',
+  slot: 'FlexContainer',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.flexContainer, ownerState.vertical && styles.flexContainerVertical, ownerState.centered && styles.centered];
+  }
+})(({
+  ownerState
+}) => _extends({
+  display: 'flex'
+}, ownerState.vertical && {
+  flexDirection: 'column'
+}, ownerState.centered && {
+  justifyContent: 'center'
+}));
+const TabsIndicator = styled('span', {
+  name: 'MuiTabs',
+  slot: 'Indicator',
+  overridesResolver: (props, styles) => styles.indicator
+})(({
+  ownerState,
+  theme
+}) => _extends({
+  position: 'absolute',
+  height: 2,
+  bottom: 0,
+  width: '100%',
+  transition: theme.transitions.create()
+}, ownerState.indicatorColor === 'primary' && {
+  backgroundColor: (theme.vars || theme).palette.primary.main
+}, ownerState.indicatorColor === 'secondary' && {
+  backgroundColor: (theme.vars || theme).palette.secondary.main
+}, ownerState.vertical && {
+  height: '100%',
+  width: 2,
+  right: 0
+}));
+const TabsScrollbarSize = styled(ScrollbarSize)({
+  overflowX: 'auto',
+  overflowY: 'hidden',
+  // Hide dimensionless scrollbar on macOS
+  scrollbarWidth: 'none',
+  // Firefox
+  '&::-webkit-scrollbar': {
+    display: 'none' // Safari + Chrome
+  }
+});
+const defaultIndicatorStyle = {};
+let warnedOnceTabPresent = false;
+const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiTabs'
+  });
+  const theme = useTheme();
+  const isRtl = useRtl();
+  const {
+      'aria-label': ariaLabel,
+      'aria-labelledby': ariaLabelledBy,
+      action,
+      centered = false,
+      children: childrenProp,
+      className,
+      component = 'div',
+      allowScrollButtonsMobile = false,
+      indicatorColor = 'primary',
+      onChange,
+      orientation = 'horizontal',
+      ScrollButtonComponent = TabScrollButton,
+      scrollButtons = 'auto',
+      selectionFollowsFocus,
+      slots = {},
+      slotProps = {},
+      TabIndicatorProps = {},
+      TabScrollButtonProps = {},
+      textColor = 'primary',
+      value,
+      variant = 'standard',
+      visibleScrollbar = false
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const scrollable = variant === 'scrollable';
+  const vertical = orientation === 'vertical';
+  const scrollStart = vertical ? 'scrollTop' : 'scrollLeft';
+  const start = vertical ? 'top' : 'left';
+  const end = vertical ? 'bottom' : 'right';
+  const clientSize = vertical ? 'clientHeight' : 'clientWidth';
+  const size = vertical ? 'height' : 'width';
+  const ownerState = _extends({}, props, {
+    component,
+    allowScrollButtonsMobile,
+    indicatorColor,
+    orientation,
+    vertical,
+    scrollButtons,
+    textColor,
+    variant,
+    visibleScrollbar,
+    fixed: !scrollable,
+    hideScrollbar: scrollable && !visibleScrollbar,
+    scrollableX: scrollable && !vertical,
+    scrollableY: scrollable && vertical,
+    centered: centered && !scrollable,
+    scrollButtonsHideMobile: !allowScrollButtonsMobile
+  });
+  const classes = useUtilityClasses(ownerState);
+  const startScrollButtonIconProps = useSlotProps({
+    elementType: slots.StartScrollButtonIcon,
+    externalSlotProps: slotProps.startScrollButtonIcon,
+    ownerState
+  });
+  const endScrollButtonIconProps = useSlotProps({
+    elementType: slots.EndScrollButtonIcon,
+    externalSlotProps: slotProps.endScrollButtonIcon,
+    ownerState
+  });
+  if (process.env.NODE_ENV !== 'production') {
+    if (centered && scrollable) {
+      console.error('MUI: You can not use the `centered={true}` and `variant="scrollable"` properties ' + 'at the same time on a `Tabs` component.');
+    }
+  }
+  const [mounted, setMounted] = React.useState(false);
+  const [indicatorStyle, setIndicatorStyle] = React.useState(defaultIndicatorStyle);
+  const [displayStartScroll, setDisplayStartScroll] = React.useState(false);
+  const [displayEndScroll, setDisplayEndScroll] = React.useState(false);
+  const [updateScrollObserver, setUpdateScrollObserver] = React.useState(false);
+  const [scrollerStyle, setScrollerStyle] = React.useState({
+    overflow: 'hidden',
+    scrollbarWidth: 0
+  });
+  const valueToIndex = new Map();
+  const tabsRef = React.useRef(null);
+  const tabListRef = React.useRef(null);
+  const getTabsMeta = () => {
+    const tabsNode = tabsRef.current;
+    let tabsMeta;
+    if (tabsNode) {
+      const rect = tabsNode.getBoundingClientRect();
+      // create a new object with ClientRect class props + scrollLeft
+      tabsMeta = {
+        clientWidth: tabsNode.clientWidth,
+        scrollLeft: tabsNode.scrollLeft,
+        scrollTop: tabsNode.scrollTop,
+        scrollLeftNormalized: getNormalizedScrollLeft(tabsNode, isRtl ? 'rtl' : 'ltr'),
+        scrollWidth: tabsNode.scrollWidth,
+        top: rect.top,
+        bottom: rect.bottom,
+        left: rect.left,
+        right: rect.right
+      };
+    }
+    let tabMeta;
+    if (tabsNode && value !== false) {
+      const children = tabListRef.current.children;
+      if (children.length > 0) {
+        const tab = children[valueToIndex.get(value)];
+        if (process.env.NODE_ENV !== 'production') {
+          if (!tab) {
+            console.error([`MUI: The \`value\` provided to the Tabs component is invalid.`, `None of the Tabs' children match with "${value}".`, valueToIndex.keys ? `You can provide one of the following values: ${Array.from(valueToIndex.keys()).join(', ')}.` : null].join('\n'));
+          }
+        }
+        tabMeta = tab ? tab.getBoundingClientRect() : null;
+        if (process.env.NODE_ENV !== 'production') {
+          if (process.env.NODE_ENV !== 'test' && !warnedOnceTabPresent && tabMeta && tabMeta.width === 0 && tabMeta.height === 0 &&
+          // if the whole Tabs component is hidden, don't warn
+          tabsMeta.clientWidth !== 0) {
+            tabsMeta = null;
+            console.error(['MUI: The `value` provided to the Tabs component is invalid.', `The Tab with this \`value\` ("${value}") is not part of the document layout.`, "Make sure the tab item is present in the document or that it's not `display: none`."].join('\n'));
+            warnedOnceTabPresent = true;
+          }
+        }
+      }
+    }
+    return {
+      tabsMeta,
+      tabMeta
+    };
+  };
+  const updateIndicatorState = useEventCallback(() => {
+    const {
+      tabsMeta,
+      tabMeta
+    } = getTabsMeta();
+    let startValue = 0;
+    let startIndicator;
+    if (vertical) {
+      startIndicator = 'top';
+      if (tabMeta && tabsMeta) {
+        startValue = tabMeta.top - tabsMeta.top + tabsMeta.scrollTop;
+      }
+    } else {
+      startIndicator = isRtl ? 'right' : 'left';
+      if (tabMeta && tabsMeta) {
+        const correction = isRtl ? tabsMeta.scrollLeftNormalized + tabsMeta.clientWidth - tabsMeta.scrollWidth : tabsMeta.scrollLeft;
+        startValue = (isRtl ? -1 : 1) * (tabMeta[startIndicator] - tabsMeta[startIndicator] + correction);
+      }
+    }
+    const newIndicatorStyle = {
+      [startIndicator]: startValue,
+      // May be wrong until the font is loaded.
+      [size]: tabMeta ? tabMeta[size] : 0
+    };
+
+    // IE11 support, replace with Number.isNaN
+    // eslint-disable-next-line no-restricted-globals
+    if (isNaN(indicatorStyle[startIndicator]) || isNaN(indicatorStyle[size])) {
+      setIndicatorStyle(newIndicatorStyle);
+    } else {
+      const dStart = Math.abs(indicatorStyle[startIndicator] - newIndicatorStyle[startIndicator]);
+      const dSize = Math.abs(indicatorStyle[size] - newIndicatorStyle[size]);
+      if (dStart >= 1 || dSize >= 1) {
+        setIndicatorStyle(newIndicatorStyle);
+      }
+    }
+  });
+  const scroll = (scrollValue, {
+    animation = true
+  } = {}) => {
+    if (animation) {
+      animate(scrollStart, tabsRef.current, scrollValue, {
+        duration: theme.transitions.duration.standard
+      });
+    } else {
+      tabsRef.current[scrollStart] = scrollValue;
+    }
+  };
+  const moveTabsScroll = delta => {
+    let scrollValue = tabsRef.current[scrollStart];
+    if (vertical) {
+      scrollValue += delta;
+    } else {
+      scrollValue += delta * (isRtl ? -1 : 1);
+      // Fix for Edge
+      scrollValue *= isRtl && detectScrollType() === 'reverse' ? -1 : 1;
+    }
+    scroll(scrollValue);
+  };
+  const getScrollSize = () => {
+    const containerSize = tabsRef.current[clientSize];
+    let totalSize = 0;
+    const children = Array.from(tabListRef.current.children);
+    for (let i = 0; i < children.length; i += 1) {
+      const tab = children[i];
+      if (totalSize + tab[clientSize] > containerSize) {
+        // If the first item is longer than the container size, then only scroll
+        // by the container size.
+        if (i === 0) {
+          totalSize = containerSize;
+        }
+        break;
+      }
+      totalSize += tab[clientSize];
+    }
+    return totalSize;
+  };
+  const handleStartScrollClick = () => {
+    moveTabsScroll(-1 * getScrollSize());
+  };
+  const handleEndScrollClick = () => {
+    moveTabsScroll(getScrollSize());
+  };
+
+  // TODO Remove <ScrollbarSize /> as browser support for hiding the scrollbar
+  // with CSS improves.
+  const handleScrollbarSizeChange = React.useCallback(scrollbarWidth => {
+    setScrollerStyle({
+      overflow: null,
+      scrollbarWidth
+    });
+  }, []);
+  const getConditionalElements = () => {
+    const conditionalElements = {};
+    conditionalElements.scrollbarSizeListener = scrollable ? /*#__PURE__*/_jsx(TabsScrollbarSize, {
+      onChange: handleScrollbarSizeChange,
+      className: clsx(classes.scrollableX, classes.hideScrollbar)
+    }) : null;
+    const scrollButtonsActive = displayStartScroll || displayEndScroll;
+    const showScrollButtons = scrollable && (scrollButtons === 'auto' && scrollButtonsActive || scrollButtons === true);
+    conditionalElements.scrollButtonStart = showScrollButtons ? /*#__PURE__*/_jsx(ScrollButtonComponent, _extends({
+      slots: {
+        StartScrollButtonIcon: slots.StartScrollButtonIcon
+      },
+      slotProps: {
+        startScrollButtonIcon: startScrollButtonIconProps
+      },
+      orientation: orientation,
+      direction: isRtl ? 'right' : 'left',
+      onClick: handleStartScrollClick,
+      disabled: !displayStartScroll
+    }, TabScrollButtonProps, {
+      className: clsx(classes.scrollButtons, TabScrollButtonProps.className)
+    })) : null;
+    conditionalElements.scrollButtonEnd = showScrollButtons ? /*#__PURE__*/_jsx(ScrollButtonComponent, _extends({
+      slots: {
+        EndScrollButtonIcon: slots.EndScrollButtonIcon
+      },
+      slotProps: {
+        endScrollButtonIcon: endScrollButtonIconProps
+      },
+      orientation: orientation,
+      direction: isRtl ? 'left' : 'right',
+      onClick: handleEndScrollClick,
+      disabled: !displayEndScroll
+    }, TabScrollButtonProps, {
+      className: clsx(classes.scrollButtons, TabScrollButtonProps.className)
+    })) : null;
+    return conditionalElements;
+  };
+  const scrollSelectedIntoView = useEventCallback(animation => {
+    const {
+      tabsMeta,
+      tabMeta
+    } = getTabsMeta();
+    if (!tabMeta || !tabsMeta) {
+      return;
+    }
+    if (tabMeta[start] < tabsMeta[start]) {
+      // left side of button is out of view
+      const nextScrollStart = tabsMeta[scrollStart] + (tabMeta[start] - tabsMeta[start]);
+      scroll(nextScrollStart, {
+        animation
+      });
+    } else if (tabMeta[end] > tabsMeta[end]) {
+      // right side of button is out of view
+      const nextScrollStart = tabsMeta[scrollStart] + (tabMeta[end] - tabsMeta[end]);
+      scroll(nextScrollStart, {
+        animation
+      });
+    }
+  });
+  const updateScrollButtonState = useEventCallback(() => {
+    if (scrollable && scrollButtons !== false) {
+      setUpdateScrollObserver(!updateScrollObserver);
+    }
+  });
+  React.useEffect(() => {
+    const handleResize = debounce(() => {
+      // If the Tabs component is replaced by Suspense with a fallback, the last
+      // ResizeObserver's handler that runs because of the change in the layout is trying to
+      // access a dom node that is no longer there (as the fallback component is being shown instead).
+      // See https://github.com/mui/material-ui/issues/33276
+      // TODO: Add tests that will ensure the component is not failing when
+      // replaced by Suspense with a fallback, once React is updated to version 18
+      if (tabsRef.current) {
+        updateIndicatorState();
+      }
+    });
+    let resizeObserver;
+
+    /**
+     * @type {MutationCallback}
+     */
+    const handleMutation = records => {
+      records.forEach(record => {
+        record.removedNodes.forEach(item => {
+          var _resizeObserver;
+          (_resizeObserver = resizeObserver) == null || _resizeObserver.unobserve(item);
+        });
+        record.addedNodes.forEach(item => {
+          var _resizeObserver2;
+          (_resizeObserver2 = resizeObserver) == null || _resizeObserver2.observe(item);
+        });
+      });
+      handleResize();
+      updateScrollButtonState();
+    };
+    const win = ownerWindow(tabsRef.current);
+    win.addEventListener('resize', handleResize);
+    let mutationObserver;
+    if (typeof ResizeObserver !== 'undefined') {
+      resizeObserver = new ResizeObserver(handleResize);
+      Array.from(tabListRef.current.children).forEach(child => {
+        resizeObserver.observe(child);
+      });
+    }
+    if (typeof MutationObserver !== 'undefined') {
+      mutationObserver = new MutationObserver(handleMutation);
+      mutationObserver.observe(tabListRef.current, {
+        childList: true
+      });
+    }
+    return () => {
+      var _mutationObserver, _resizeObserver3;
+      handleResize.clear();
+      win.removeEventListener('resize', handleResize);
+      (_mutationObserver = mutationObserver) == null || _mutationObserver.disconnect();
+      (_resizeObserver3 = resizeObserver) == null || _resizeObserver3.disconnect();
+    };
+  }, [updateIndicatorState, updateScrollButtonState]);
+
+  /**
+   * Toggle visibility of start and end scroll buttons
+   * Using IntersectionObserver on first and last Tabs.
+   */
+  React.useEffect(() => {
+    const tabListChildren = Array.from(tabListRef.current.children);
+    const length = tabListChildren.length;
+    if (typeof IntersectionObserver !== 'undefined' && length > 0 && scrollable && scrollButtons !== false) {
+      const firstTab = tabListChildren[0];
+      const lastTab = tabListChildren[length - 1];
+      const observerOptions = {
+        root: tabsRef.current,
+        threshold: 0.99
+      };
+      const handleScrollButtonStart = entries => {
+        setDisplayStartScroll(!entries[0].isIntersecting);
+      };
+      const firstObserver = new IntersectionObserver(handleScrollButtonStart, observerOptions);
+      firstObserver.observe(firstTab);
+      const handleScrollButtonEnd = entries => {
+        setDisplayEndScroll(!entries[0].isIntersecting);
+      };
+      const lastObserver = new IntersectionObserver(handleScrollButtonEnd, observerOptions);
+      lastObserver.observe(lastTab);
+      return () => {
+        firstObserver.disconnect();
+        lastObserver.disconnect();
+      };
+    }
+    return undefined;
+  }, [scrollable, scrollButtons, updateScrollObserver, childrenProp == null ? void 0 : childrenProp.length]);
+  React.useEffect(() => {
+    setMounted(true);
+  }, []);
+  React.useEffect(() => {
+    updateIndicatorState();
+  });
+  React.useEffect(() => {
+    // Don't animate on the first render.
+    scrollSelectedIntoView(defaultIndicatorStyle !== indicatorStyle);
+  }, [scrollSelectedIntoView, indicatorStyle]);
+  React.useImperativeHandle(action, () => ({
+    updateIndicator: updateIndicatorState,
+    updateScrollButtons: updateScrollButtonState
+  }), [updateIndicatorState, updateScrollButtonState]);
+  const indicator = /*#__PURE__*/_jsx(TabsIndicator, _extends({}, TabIndicatorProps, {
+    className: clsx(classes.indicator, TabIndicatorProps.className),
+    ownerState: ownerState,
+    style: _extends({}, indicatorStyle, TabIndicatorProps.style)
+  }));
+  let childIndex = 0;
+  const children = React.Children.map(childrenProp, child => {
+    if (! /*#__PURE__*/React.isValidElement(child)) {
+      return null;
+    }
+    if (process.env.NODE_ENV !== 'production') {
+      if (isFragment(child)) {
+        console.error(["MUI: The Tabs component doesn't accept a Fragment as a child.", 'Consider providing an array instead.'].join('\n'));
+      }
+    }
+    const childValue = child.props.value === undefined ? childIndex : child.props.value;
+    valueToIndex.set(childValue, childIndex);
+    const selected = childValue === value;
+    childIndex += 1;
+    return /*#__PURE__*/React.cloneElement(child, _extends({
+      fullWidth: variant === 'fullWidth',
+      indicator: selected && !mounted && indicator,
+      selected,
+      selectionFollowsFocus,
+      onChange,
+      textColor,
+      value: childValue
+    }, childIndex === 1 && value === false && !child.props.tabIndex ? {
+      tabIndex: 0
+    } : {}));
+  });
+  const handleKeyDown = event => {
+    const list = tabListRef.current;
+    const currentFocus = ownerDocument(list).activeElement;
+    // Keyboard navigation assumes that [role="tab"] are siblings
+    // though we might warn in the future about nested, interactive elements
+    // as a a11y violation
+    const role = currentFocus.getAttribute('role');
+    if (role !== 'tab') {
+      return;
+    }
+    let previousItemKey = orientation === 'horizontal' ? 'ArrowLeft' : 'ArrowUp';
+    let nextItemKey = orientation === 'horizontal' ? 'ArrowRight' : 'ArrowDown';
+    if (orientation === 'horizontal' && isRtl) {
+      // swap previousItemKey with nextItemKey
+      previousItemKey = 'ArrowRight';
+      nextItemKey = 'ArrowLeft';
+    }
+    switch (event.key) {
+      case previousItemKey:
+        event.preventDefault();
+        moveFocus(list, currentFocus, previousItem);
+        break;
+      case nextItemKey:
+        event.preventDefault();
+        moveFocus(list, currentFocus, nextItem);
+        break;
+      case 'Home':
+        event.preventDefault();
+        moveFocus(list, null, nextItem);
+        break;
+      case 'End':
+        event.preventDefault();
+        moveFocus(list, null, previousItem);
+        break;
+      default:
+        break;
+    }
+  };
+  const conditionalElements = getConditionalElements();
+  return /*#__PURE__*/_jsxs(TabsRoot, _extends({
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    ref: ref,
+    as: component
+  }, other, {
+    children: [conditionalElements.scrollButtonStart, conditionalElements.scrollbarSizeListener, /*#__PURE__*/_jsxs(TabsScroller, {
+      className: classes.scroller,
+      ownerState: ownerState,
+      style: {
+        overflow: scrollerStyle.overflow,
+        [vertical ? `margin${isRtl ? 'Left' : 'Right'}` : 'marginBottom']: visibleScrollbar ? undefined : -scrollerStyle.scrollbarWidth
+      },
+      ref: tabsRef,
+      children: [/*#__PURE__*/_jsx(FlexContainer, {
+        "aria-label": ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        "aria-orientation": orientation === 'vertical' ? 'vertical' : null,
+        className: classes.flexContainer,
+        ownerState: ownerState,
+        onKeyDown: handleKeyDown,
+        ref: tabListRef,
+        role: "tablist",
+        children: children
+      }), mounted && indicator]
+    }), conditionalElements.scrollButtonEnd]
+  }));
+});
+process.env.NODE_ENV !== "production" ? Tabs.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Callback fired when the component mounts.
+   * This is useful when you want to trigger an action programmatically.
+   * It supports two actions: `updateIndicator()` and `updateScrollButtons()`
+   *
+   * @param {object} actions This object contains all possible actions
+   * that can be triggered programmatically.
+   */
+  action: refType,
+  /**
+   * If `true`, the scroll buttons aren't forced hidden on mobile.
+   * By default the scroll buttons are hidden on mobile and takes precedence over `scrollButtons`.
+   * @default false
+   */
+  allowScrollButtonsMobile: PropTypes.bool,
+  /**
+   * The label for the Tabs as a string.
+   */
+  'aria-label': PropTypes.string,
+  /**
+   * An id or list of ids separated by a space that label the Tabs.
+   */
+  'aria-labelledby': PropTypes.string,
+  /**
+   * If `true`, the tabs are centered.
+   * This prop is intended for large views.
+   * @default false
+   */
+  centered: PropTypes.bool,
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * Determines the color of the indicator.
+   * @default 'primary'
+   */
+  indicatorColor: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['primary', 'secondary']), PropTypes.string]),
+  /**
+   * Callback fired when the value changes.
+   *
+   * @param {React.SyntheticEvent} event The event source of the callback. **Warning**: This is a generic event not a change event.
+   * @param {any} value We default to the index of the child (number)
+   */
+  onChange: PropTypes.func,
+  /**
+   * The component orientation (layout flow direction).
+   * @default 'horizontal'
+   */
+  orientation: PropTypes.oneOf(['horizontal', 'vertical']),
+  /**
+   * The component used to render the scroll buttons.
+   * @default TabScrollButton
+   */
+  ScrollButtonComponent: PropTypes.elementType,
+  /**
+   * Determine behavior of scroll buttons when tabs are set to scroll:
+   *
+   * - `auto` will only present them when not all the items are visible.
+   * - `true` will always present them.
+   * - `false` will never present them.
+   *
+   * By default the scroll buttons are hidden on mobile.
+   * This behavior can be disabled with `allowScrollButtonsMobile`.
+   * @default 'auto'
+   */
+  scrollButtons: PropTypes /* @typescript-to-proptypes-ignore */.oneOf(['auto', false, true]),
+  /**
+   * If `true` the selected tab changes on focus. Otherwise it only
+   * changes on activation.
+   */
+  selectionFollowsFocus: PropTypes.bool,
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    endScrollButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    startScrollButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    EndScrollButtonIcon: PropTypes.elementType,
+    StartScrollButtonIcon: PropTypes.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * Props applied to the tab indicator element.
+   * @default  {}
+   */
+  TabIndicatorProps: PropTypes.object,
+  /**
+   * Props applied to the [`TabScrollButton`](/material-ui/api/tab-scroll-button/) element.
+   * @default {}
+   */
+  TabScrollButtonProps: PropTypes.object,
+  /**
+   * Determines the color of the `Tab`.
+   * @default 'primary'
+   */
+  textColor: PropTypes.oneOf(['inherit', 'primary', 'secondary']),
+  /**
+   * The value of the currently selected `Tab`.
+   * If you don't want any selected `Tab`, you can set this prop to `false`.
+   */
+  value: PropTypes.any,
+  /**
+   * Determines additional display behavior of the tabs:
+   *
+   *  - `scrollable` will invoke scrolling properties and allow for horizontally
+   *  scrolling (or swiping) of the tab bar.
+   *  - `fullWidth` will make the tabs grow to use all the available space,
+   *  which should be used for small views, like on mobile.
+   *  - `standard` will render the default state.
+   * @default 'standard'
+   */
+  variant: PropTypes.oneOf(['fullWidth', 'scrollable', 'standard']),
+  /**
+   * If `true`, the scrollbar is visible. It can be useful when displaying
+   * a long vertical list of tabs.
+   * @default false
+   */
+  visibleScrollbar: PropTypes.bool
+} : void 0;
+export default Tabs;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Tabs/tabsClasses.js b/ddb_main/node_modules/@mui/material/Tabs/tabsClasses.js
new file mode 100644
index 0000000..a5cb516
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Tabs/tabsClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getTabsUtilityClass(slot) {
+  return generateUtilityClass('MuiTabs', slot);
+}
+const tabsClasses = generateUtilityClasses('MuiTabs', ['root', 'vertical', 'flexContainer', 'flexContainerVertical', 'centered', 'scroller', 'fixed', 'scrollableX', 'scrollableY', 'hideScrollbar', 'scrollButtons', 'scrollButtonsHideMobile', 'indicator']);
+export default tabsClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ToggleButton/ToggleButton.js b/ddb_main/node_modules/@mui/material/ToggleButton/ToggleButton.js
new file mode 100644
index 0000000..f6bd952
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ToggleButton/ToggleButton.js
@@ -0,0 +1,239 @@
+'use client';
+
+// @inheritedComponent ButtonBase
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["value"],
+  _excluded2 = ["children", "className", "color", "disabled", "disableFocusRipple", "fullWidth", "onChange", "onClick", "selected", "size", "value"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import resolveProps from '@mui/utils/resolveProps';
+import composeClasses from '@mui/utils/composeClasses';
+import { alpha } from '../styles';
+import ButtonBase from '../ButtonBase';
+import capitalize from '../utils/capitalize';
+import useThemeProps from '../styles/useThemeProps';
+import styled from '../styles/styled';
+import toggleButtonClasses, { getToggleButtonUtilityClass } from './toggleButtonClasses';
+import ToggleButtonGroupContext from '../ToggleButtonGroup/ToggleButtonGroupContext';
+import ToggleButtonGroupButtonContext from '../ToggleButtonGroup/ToggleButtonGroupButtonContext';
+import isValueSelected from '../ToggleButtonGroup/isValueSelected';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    fullWidth,
+    selected,
+    disabled,
+    size,
+    color
+  } = ownerState;
+  const slots = {
+    root: ['root', selected && 'selected', disabled && 'disabled', fullWidth && 'fullWidth', `size${capitalize(size)}`, color]
+  };
+  return composeClasses(slots, getToggleButtonUtilityClass, classes);
+};
+const ToggleButtonRoot = styled(ButtonBase, {
+  name: 'MuiToggleButton',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, styles[`size${capitalize(ownerState.size)}`]];
+  }
+})(({
+  theme,
+  ownerState
+}) => {
+  let selectedColor = ownerState.color === 'standard' ? theme.palette.text.primary : theme.palette[ownerState.color].main;
+  let selectedColorChannel;
+  if (theme.vars) {
+    selectedColor = ownerState.color === 'standard' ? theme.vars.palette.text.primary : theme.vars.palette[ownerState.color].main;
+    selectedColorChannel = ownerState.color === 'standard' ? theme.vars.palette.text.primaryChannel : theme.vars.palette[ownerState.color].mainChannel;
+  }
+  return _extends({}, theme.typography.button, {
+    borderRadius: (theme.vars || theme).shape.borderRadius,
+    padding: 11,
+    border: `1px solid ${(theme.vars || theme).palette.divider}`,
+    color: (theme.vars || theme).palette.action.active
+  }, ownerState.fullWidth && {
+    width: '100%'
+  }, {
+    [`&.${toggleButtonClasses.disabled}`]: {
+      color: (theme.vars || theme).palette.action.disabled,
+      border: `1px solid ${(theme.vars || theme).palette.action.disabledBackground}`
+    },
+    '&:hover': {
+      textDecoration: 'none',
+      // Reset on mouse devices
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.text.primaryChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.text.primary, theme.palette.action.hoverOpacity),
+      '@media (hover: none)': {
+        backgroundColor: 'transparent'
+      }
+    },
+    [`&.${toggleButtonClasses.selected}`]: {
+      color: selectedColor,
+      backgroundColor: theme.vars ? `rgba(${selectedColorChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(selectedColor, theme.palette.action.selectedOpacity),
+      '&:hover': {
+        backgroundColor: theme.vars ? `rgba(${selectedColorChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.hoverOpacity}))` : alpha(selectedColor, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity),
+        // Reset on touch devices, it doesn't add specificity
+        '@media (hover: none)': {
+          backgroundColor: theme.vars ? `rgba(${selectedColorChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(selectedColor, theme.palette.action.selectedOpacity)
+        }
+      }
+    }
+  }, ownerState.size === 'small' && {
+    padding: 7,
+    fontSize: theme.typography.pxToRem(13)
+  }, ownerState.size === 'large' && {
+    padding: 15,
+    fontSize: theme.typography.pxToRem(15)
+  });
+});
+const ToggleButton = /*#__PURE__*/React.forwardRef(function ToggleButton(inProps, ref) {
+  // props priority: `inProps` > `contextProps` > `themeDefaultProps`
+  const _React$useContext = React.useContext(ToggleButtonGroupContext),
+    {
+      value: contextValue
+    } = _React$useContext,
+    contextProps = _objectWithoutPropertiesLoose(_React$useContext, _excluded);
+  const toggleButtonGroupButtonContextPositionClassName = React.useContext(ToggleButtonGroupButtonContext);
+  const resolvedProps = resolveProps(_extends({}, contextProps, {
+    selected: isValueSelected(inProps.value, contextValue)
+  }), inProps);
+  const props = useThemeProps({
+    props: resolvedProps,
+    name: 'MuiToggleButton'
+  });
+  const {
+      children,
+      className,
+      color = 'standard',
+      disabled = false,
+      disableFocusRipple = false,
+      fullWidth = false,
+      onChange,
+      onClick,
+      selected,
+      size = 'medium',
+      value
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded2);
+  const ownerState = _extends({}, props, {
+    color,
+    disabled,
+    disableFocusRipple,
+    fullWidth,
+    size
+  });
+  const classes = useUtilityClasses(ownerState);
+  const handleChange = event => {
+    if (onClick) {
+      onClick(event, value);
+      if (event.defaultPrevented) {
+        return;
+      }
+    }
+    if (onChange) {
+      onChange(event, value);
+    }
+  };
+  const positionClassName = toggleButtonGroupButtonContextPositionClassName || '';
+  return /*#__PURE__*/_jsx(ToggleButtonRoot, _extends({
+    className: clsx(contextProps.className, classes.root, className, positionClassName),
+    disabled: disabled,
+    focusRipple: !disableFocusRipple,
+    ref: ref,
+    onClick: handleChange,
+    onChange: onChange,
+    value: value,
+    ownerState: ownerState,
+    "aria-pressed": selected
+  }, other, {
+    children: children
+  }));
+});
+process.env.NODE_ENV !== "production" ? ToggleButton.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the button when it is in an active state.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'standard'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['standard', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: PropTypes.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   *
+   * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
+   * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
+   * @default false
+   */
+  disableRipple: PropTypes.bool,
+  /**
+   * If `true`, the button will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: PropTypes.bool,
+  /**
+   * Callback fired when the state changes.
+   *
+   * @param {React.MouseEvent<HTMLElement>} event The event source of the callback.
+   * @param {any} value of the selected button.
+   */
+  onChange: PropTypes.func,
+  /**
+   * Callback fired when the button is clicked.
+   *
+   * @param {React.MouseEvent<HTMLElement>} event The event source of the callback.
+   * @param {any} value of the selected button.
+   */
+  onClick: PropTypes.func,
+  /**
+   * If `true`, the button is rendered in an active state.
+   */
+  selected: PropTypes.bool,
+  /**
+   * The size of the component.
+   * The prop defaults to the value inherited from the parent ToggleButtonGroup component.
+   * @default 'medium'
+   */
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['small', 'medium', 'large']), PropTypes.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The value to associate with the button when selected in a
+   * ToggleButtonGroup.
+   */
+  value: PropTypes /* @typescript-to-proptypes-ignore */.any.isRequired
+} : void 0;
+export default ToggleButton;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ToggleButton/toggleButtonClasses.js b/ddb_main/node_modules/@mui/material/ToggleButton/toggleButtonClasses.js
new file mode 100644
index 0000000..f67c177
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ToggleButton/toggleButtonClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getToggleButtonUtilityClass(slot) {
+  return generateUtilityClass('MuiToggleButton', slot);
+}
+const toggleButtonClasses = generateUtilityClasses('MuiToggleButton', ['root', 'disabled', 'selected', 'standard', 'primary', 'secondary', 'sizeSmall', 'sizeMedium', 'sizeLarge', 'fullWidth']);
+export default toggleButtonClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroup.js b/ddb_main/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroup.js
new file mode 100644
index 0000000..111bb53
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroup.js
@@ -0,0 +1,270 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "className", "color", "disabled", "exclusive", "fullWidth", "onChange", "orientation", "size", "value"];
+import * as React from 'react';
+import { isFragment } from 'react-is';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import composeClasses from '@mui/utils/composeClasses';
+import getValidReactChildren from '@mui/utils/getValidReactChildren';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import capitalize from '../utils/capitalize';
+import toggleButtonGroupClasses, { getToggleButtonGroupUtilityClass } from './toggleButtonGroupClasses';
+import ToggleButtonGroupContext from './ToggleButtonGroupContext';
+import ToggleButtonGroupButtonContext from './ToggleButtonGroupButtonContext';
+import toggleButtonClasses from '../ToggleButton/toggleButtonClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    orientation,
+    fullWidth,
+    disabled
+  } = ownerState;
+  const slots = {
+    root: ['root', orientation === 'vertical' && 'vertical', fullWidth && 'fullWidth'],
+    grouped: ['grouped', `grouped${capitalize(orientation)}`, disabled && 'disabled'],
+    firstButton: ['firstButton'],
+    lastButton: ['lastButton'],
+    middleButton: ['middleButton']
+  };
+  return composeClasses(slots, getToggleButtonGroupUtilityClass, classes);
+};
+const ToggleButtonGroupRoot = styled('div', {
+  name: 'MuiToggleButtonGroup',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [{
+      [`& .${toggleButtonGroupClasses.grouped}`]: styles.grouped
+    }, {
+      [`& .${toggleButtonGroupClasses.grouped}`]: styles[`grouped${capitalize(ownerState.orientation)}`]
+    }, {
+      [`& .${toggleButtonGroupClasses.firstButton}`]: styles.firstButton
+    }, {
+      [`& .${toggleButtonGroupClasses.lastButton}`]: styles.lastButton
+    }, {
+      [`& .${toggleButtonGroupClasses.middleButton}`]: styles.middleButton
+    }, styles.root, ownerState.orientation === 'vertical' && styles.vertical, ownerState.fullWidth && styles.fullWidth];
+  }
+})(({
+  ownerState,
+  theme
+}) => _extends({
+  display: 'inline-flex',
+  borderRadius: (theme.vars || theme).shape.borderRadius
+}, ownerState.orientation === 'vertical' && {
+  flexDirection: 'column'
+}, ownerState.fullWidth && {
+  width: '100%'
+}, {
+  [`& .${toggleButtonGroupClasses.grouped}`]: _extends({}, ownerState.orientation === 'horizontal' ? {
+    [`&.${toggleButtonGroupClasses.selected} + .${toggleButtonGroupClasses.grouped}.${toggleButtonGroupClasses.selected}`]: {
+      borderLeft: 0,
+      marginLeft: 0
+    }
+  } : {
+    [`&.${toggleButtonGroupClasses.selected} + .${toggleButtonGroupClasses.grouped}.${toggleButtonGroupClasses.selected}`]: {
+      borderTop: 0,
+      marginTop: 0
+    }
+  })
+}, ownerState.orientation === 'horizontal' ? {
+  [`& .${toggleButtonGroupClasses.firstButton},& .${toggleButtonGroupClasses.middleButton}`]: {
+    borderTopRightRadius: 0,
+    borderBottomRightRadius: 0
+  },
+  [`& .${toggleButtonGroupClasses.lastButton},& .${toggleButtonGroupClasses.middleButton}`]: {
+    marginLeft: -1,
+    borderLeft: '1px solid transparent',
+    borderTopLeftRadius: 0,
+    borderBottomLeftRadius: 0
+  }
+} : {
+  [`& .${toggleButtonGroupClasses.firstButton},& .${toggleButtonGroupClasses.middleButton}`]: {
+    borderBottomLeftRadius: 0,
+    borderBottomRightRadius: 0
+  },
+  [`& .${toggleButtonGroupClasses.lastButton},& .${toggleButtonGroupClasses.middleButton}`]: {
+    marginTop: -1,
+    borderTop: '1px solid transparent',
+    borderTopLeftRadius: 0,
+    borderTopRightRadius: 0
+  }
+}, ownerState.orientation === 'horizontal' ? {
+  [`& .${toggleButtonGroupClasses.lastButton}.${toggleButtonClasses.disabled},& .${toggleButtonGroupClasses.middleButton}.${toggleButtonClasses.disabled}`]: {
+    borderLeft: '1px solid transparent'
+  }
+} : {
+  [`& .${toggleButtonGroupClasses.lastButton}.${toggleButtonClasses.disabled},& .${toggleButtonGroupClasses.middleButton}.${toggleButtonClasses.disabled}`]: {
+    borderTop: '1px solid transparent'
+  }
+}));
+const ToggleButtonGroup = /*#__PURE__*/React.forwardRef(function ToggleButtonGroup(inProps, ref) {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiToggleButtonGroup'
+  });
+  const {
+      children,
+      className,
+      color = 'standard',
+      disabled = false,
+      exclusive = false,
+      fullWidth = false,
+      onChange,
+      orientation = 'horizontal',
+      size = 'medium',
+      value
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    disabled,
+    fullWidth,
+    orientation,
+    size
+  });
+  const classes = useUtilityClasses(ownerState);
+  const handleChange = React.useCallback((event, buttonValue) => {
+    if (!onChange) {
+      return;
+    }
+    const index = value && value.indexOf(buttonValue);
+    let newValue;
+    if (value && index >= 0) {
+      newValue = value.slice();
+      newValue.splice(index, 1);
+    } else {
+      newValue = value ? value.concat(buttonValue) : [buttonValue];
+    }
+    onChange(event, newValue);
+  }, [onChange, value]);
+  const handleExclusiveChange = React.useCallback((event, buttonValue) => {
+    if (!onChange) {
+      return;
+    }
+    onChange(event, value === buttonValue ? null : buttonValue);
+  }, [onChange, value]);
+  const context = React.useMemo(() => ({
+    className: classes.grouped,
+    onChange: exclusive ? handleExclusiveChange : handleChange,
+    value,
+    size,
+    fullWidth,
+    color,
+    disabled
+  }), [classes.grouped, exclusive, handleExclusiveChange, handleChange, value, size, fullWidth, color, disabled]);
+  const validChildren = getValidReactChildren(children);
+  const childrenCount = validChildren.length;
+  const getButtonPositionClassName = index => {
+    const isFirstButton = index === 0;
+    const isLastButton = index === childrenCount - 1;
+    if (isFirstButton && isLastButton) {
+      return '';
+    }
+    if (isFirstButton) {
+      return classes.firstButton;
+    }
+    if (isLastButton) {
+      return classes.lastButton;
+    }
+    return classes.middleButton;
+  };
+  return /*#__PURE__*/_jsx(ToggleButtonGroupRoot, _extends({
+    role: "group",
+    className: clsx(classes.root, className),
+    ref: ref,
+    ownerState: ownerState
+  }, other, {
+    children: /*#__PURE__*/_jsx(ToggleButtonGroupContext.Provider, {
+      value: context,
+      children: validChildren.map((child, index) => {
+        if (process.env.NODE_ENV !== 'production') {
+          if (isFragment(child)) {
+            console.error(["MUI: The ToggleButtonGroup component doesn't accept a Fragment as a child.", 'Consider providing an array instead.'].join('\n'));
+          }
+        }
+        return /*#__PURE__*/_jsx(ToggleButtonGroupButtonContext.Provider, {
+          value: getButtonPositionClassName(index),
+          children: child
+        }, index);
+      })
+    })
+  }));
+});
+process.env.NODE_ENV !== "production" ? ToggleButtonGroup.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the button when it is selected.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'standard'
+   */
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['standard', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),
+  /**
+   * If `true`, the component is disabled. This implies that all ToggleButton children will be disabled.
+   * @default false
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, only allow one of the child ToggleButton values to be selected.
+   * @default false
+   */
+  exclusive: PropTypes.bool,
+  /**
+   * If `true`, the button group will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: PropTypes.bool,
+  /**
+   * Callback fired when the value changes.
+   *
+   * @param {React.MouseEvent<HTMLElement>} event The event source of the callback.
+   * @param {any} value of the selected buttons. When `exclusive` is true
+   * this is a single value; when false an array of selected values. If no value
+   * is selected and `exclusive` is true the value is null; when false an empty array.
+   */
+  onChange: PropTypes.func,
+  /**
+   * The component orientation (layout flow direction).
+   * @default 'horizontal'
+   */
+  orientation: PropTypes.oneOf(['horizontal', 'vertical']),
+  /**
+   * The size of the component.
+   * @default 'medium'
+   */
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['small', 'medium', 'large']), PropTypes.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The currently selected value within the group or an array of selected
+   * values when `exclusive` is false.
+   *
+   * The value must have reference equality with the option in order to be selected.
+   */
+  value: PropTypes.any
+} : void 0;
+export default ToggleButtonGroup;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroupButtonContext.js b/ddb_main/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroupButtonContext.js
new file mode 100644
index 0000000..c1739c8
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroupButtonContext.js
@@ -0,0 +1,9 @@
+import * as React from 'react';
+/**
+ * @ignore - internal component.
+ */
+const ToggleButtonGroupButtonContext = /*#__PURE__*/React.createContext(undefined);
+if (process.env.NODE_ENV !== 'production') {
+  ToggleButtonGroupButtonContext.displayName = 'ToggleButtonGroupButtonContext';
+}
+export default ToggleButtonGroupButtonContext;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroupContext.js b/ddb_main/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroupContext.js
new file mode 100644
index 0000000..0086b49
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroupContext.js
@@ -0,0 +1,9 @@
+import * as React from 'react';
+/**
+ * @ignore - internal component.
+ */
+const ToggleButtonGroupContext = /*#__PURE__*/React.createContext({});
+if (process.env.NODE_ENV !== 'production') {
+  ToggleButtonGroupContext.displayName = 'ToggleButtonGroupContext';
+}
+export default ToggleButtonGroupContext;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ToggleButtonGroup/isValueSelected.js b/ddb_main/node_modules/@mui/material/ToggleButtonGroup/isValueSelected.js
new file mode 100644
index 0000000..4db7c30
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ToggleButtonGroup/isValueSelected.js
@@ -0,0 +1,11 @@
+// Determine if the toggle button value matches, or is contained in, the
+// candidate group value.
+export default function isValueSelected(value, candidate) {
+  if (candidate === undefined || value === undefined) {
+    return false;
+  }
+  if (Array.isArray(candidate)) {
+    return candidate.indexOf(value) >= 0;
+  }
+  return value === candidate;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/ToggleButtonGroup/toggleButtonGroupClasses.js b/ddb_main/node_modules/@mui/material/ToggleButtonGroup/toggleButtonGroupClasses.js
new file mode 100644
index 0000000..d4c225d
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/ToggleButtonGroup/toggleButtonGroupClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getToggleButtonGroupUtilityClass(slot) {
+  return generateUtilityClass('MuiToggleButtonGroup', slot);
+}
+const toggleButtonGroupClasses = generateUtilityClasses('MuiToggleButtonGroup', ['root', 'selected', 'horizontal', 'vertical', 'disabled', 'grouped', 'groupedHorizontal', 'groupedVertical', 'fullWidth', 'firstButton', 'lastButton', 'middleButton']);
+export default toggleButtonGroupClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Typography/Typography.js b/ddb_main/node_modules/@mui/material/Typography/Typography.js
new file mode 100644
index 0000000..bdf724b
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Typography/Typography.js
@@ -0,0 +1,198 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["align", "className", "component", "gutterBottom", "noWrap", "paragraph", "variant", "variantMapping"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { extendSxProp } from '@mui/system/styleFunctionSx';
+import composeClasses from '@mui/utils/composeClasses';
+import styled from '../styles/styled';
+import useThemeProps from '../styles/useThemeProps';
+import capitalize from '../utils/capitalize';
+import { getTypographyUtilityClass } from './typographyClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    align,
+    gutterBottom,
+    noWrap,
+    paragraph,
+    variant,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['root', variant, ownerState.align !== 'inherit' && `align${capitalize(align)}`, gutterBottom && 'gutterBottom', noWrap && 'noWrap', paragraph && 'paragraph']
+  };
+  return composeClasses(slots, getTypographyUtilityClass, classes);
+};
+export const TypographyRoot = styled('span', {
+  name: 'MuiTypography',
+  slot: 'Root',
+  overridesResolver: (props, styles) => {
+    const {
+      ownerState
+    } = props;
+    return [styles.root, ownerState.variant && styles[ownerState.variant], ownerState.align !== 'inherit' && styles[`align${capitalize(ownerState.align)}`], ownerState.noWrap && styles.noWrap, ownerState.gutterBottom && styles.gutterBottom, ownerState.paragraph && styles.paragraph];
+  }
+})(({
+  theme,
+  ownerState
+}) => _extends({
+  margin: 0
+}, ownerState.variant === 'inherit' && {
+  // Some elements, like <button> on Chrome have default font that doesn't inherit, reset this.
+  font: 'inherit'
+}, ownerState.variant !== 'inherit' && theme.typography[ownerState.variant], ownerState.align !== 'inherit' && {
+  textAlign: ownerState.align
+}, ownerState.noWrap && {
+  overflow: 'hidden',
+  textOverflow: 'ellipsis',
+  whiteSpace: 'nowrap'
+}, ownerState.gutterBottom && {
+  marginBottom: '0.35em'
+}, ownerState.paragraph && {
+  marginBottom: 16
+}));
+const defaultVariantMapping = {
+  h1: 'h1',
+  h2: 'h2',
+  h3: 'h3',
+  h4: 'h4',
+  h5: 'h5',
+  h6: 'h6',
+  subtitle1: 'h6',
+  subtitle2: 'h6',
+  body1: 'p',
+  body2: 'p',
+  inherit: 'p'
+};
+
+// TODO v6: deprecate these color values in v5.x and remove the transformation in v6
+const colorTransformations = {
+  primary: 'primary.main',
+  textPrimary: 'text.primary',
+  secondary: 'secondary.main',
+  textSecondary: 'text.secondary',
+  error: 'error.main'
+};
+const transformDeprecatedColors = color => {
+  return colorTransformations[color] || color;
+};
+const Typography = /*#__PURE__*/React.forwardRef(function Typography(inProps, ref) {
+  const themeProps = useThemeProps({
+    props: inProps,
+    name: 'MuiTypography'
+  });
+  const color = transformDeprecatedColors(themeProps.color);
+  const props = extendSxProp(_extends({}, themeProps, {
+    color
+  }));
+  const {
+      align = 'inherit',
+      className,
+      component,
+      gutterBottom = false,
+      noWrap = false,
+      paragraph = false,
+      variant = 'body1',
+      variantMapping = defaultVariantMapping
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
+    align,
+    color,
+    className,
+    component,
+    gutterBottom,
+    noWrap,
+    paragraph,
+    variant,
+    variantMapping
+  });
+  const Component = component || (paragraph ? 'p' : variantMapping[variant] || defaultVariantMapping[variant]) || 'span';
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsx(TypographyRoot, _extends({
+    as: Component,
+    ref: ref,
+    ownerState: ownerState,
+    className: clsx(classes.root, className)
+  }, other));
+});
+process.env.NODE_ENV !== "production" ? Typography.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Set the text-align on the component.
+   * @default 'inherit'
+   */
+  align: PropTypes.oneOf(['center', 'inherit', 'justify', 'left', 'right']),
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * If `true`, the text will have a bottom margin.
+   * @default false
+   */
+  gutterBottom: PropTypes.bool,
+  /**
+   * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.
+   *
+   * Note that text overflow can only happen with block or inline-block level elements
+   * (the element needs to have a width in order to overflow).
+   * @default false
+   */
+  noWrap: PropTypes.bool,
+  /**
+   * If `true`, the element will be a paragraph element.
+   * @default false
+   */
+  paragraph: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * Applies the theme typography styles.
+   * @default 'body1'
+   */
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['body1', 'body2', 'button', 'caption', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'inherit', 'overline', 'subtitle1', 'subtitle2']), PropTypes.string]),
+  /**
+   * The component maps the variant prop to a range of different HTML element types.
+   * For instance, subtitle1 to `<h6>`.
+   * If you wish to change that mapping, you can provide your own.
+   * Alternatively, you can use the `component` prop.
+   * @default {
+   *   h1: 'h1',
+   *   h2: 'h2',
+   *   h3: 'h3',
+   *   h4: 'h4',
+   *   h5: 'h5',
+   *   h6: 'h6',
+   *   subtitle1: 'h6',
+   *   subtitle2: 'h6',
+   *   body1: 'p',
+   *   body2: 'p',
+   *   inherit: 'p',
+   * }
+   */
+  variantMapping: PropTypes /* @typescript-to-proptypes-ignore */.object
+} : void 0;
+export default Typography;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/Typography/typographyClasses.js b/ddb_main/node_modules/@mui/material/Typography/typographyClasses.js
new file mode 100644
index 0000000..649f46f
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/Typography/typographyClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getTypographyUtilityClass(slot) {
+  return generateUtilityClass('MuiTypography', slot);
+}
+const typographyClasses = generateUtilityClasses('MuiTypography', ['root', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'subtitle1', 'subtitle2', 'body1', 'body2', 'inherit', 'button', 'caption', 'overline', 'alignLeft', 'alignRight', 'alignCenter', 'alignJustify', 'noWrap', 'gutterBottom', 'paragraph']);
+export default typographyClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/colors/blue.js b/ddb_main/node_modules/@mui/material/colors/blue.js
new file mode 100644
index 0000000..01ba098
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/colors/blue.js
@@ -0,0 +1,17 @@
+const blue = {
+  50: '#e3f2fd',
+  100: '#bbdefb',
+  200: '#90caf9',
+  300: '#64b5f6',
+  400: '#42a5f5',
+  500: '#2196f3',
+  600: '#1e88e5',
+  700: '#1976d2',
+  800: '#1565c0',
+  900: '#0d47a1',
+  A100: '#82b1ff',
+  A200: '#448aff',
+  A400: '#2979ff',
+  A700: '#2962ff'
+};
+export default blue;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/colors/common.js b/ddb_main/node_modules/@mui/material/colors/common.js
new file mode 100644
index 0000000..34b2857
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/colors/common.js
@@ -0,0 +1,5 @@
+const common = {
+  black: '#000',
+  white: '#fff'
+};
+export default common;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/colors/green.js b/ddb_main/node_modules/@mui/material/colors/green.js
new file mode 100644
index 0000000..ab896a1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/colors/green.js
@@ -0,0 +1,17 @@
+const green = {
+  50: '#e8f5e9',
+  100: '#c8e6c9',
+  200: '#a5d6a7',
+  300: '#81c784',
+  400: '#66bb6a',
+  500: '#4caf50',
+  600: '#43a047',
+  700: '#388e3c',
+  800: '#2e7d32',
+  900: '#1b5e20',
+  A100: '#b9f6ca',
+  A200: '#69f0ae',
+  A400: '#00e676',
+  A700: '#00c853'
+};
+export default green;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/colors/grey.js b/ddb_main/node_modules/@mui/material/colors/grey.js
new file mode 100644
index 0000000..f87fb2e
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/colors/grey.js
@@ -0,0 +1,17 @@
+const grey = {
+  50: '#fafafa',
+  100: '#f5f5f5',
+  200: '#eeeeee',
+  300: '#e0e0e0',
+  400: '#bdbdbd',
+  500: '#9e9e9e',
+  600: '#757575',
+  700: '#616161',
+  800: '#424242',
+  900: '#212121',
+  A100: '#f5f5f5',
+  A200: '#eeeeee',
+  A400: '#bdbdbd',
+  A700: '#616161'
+};
+export default grey;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/colors/lightBlue.js b/ddb_main/node_modules/@mui/material/colors/lightBlue.js
new file mode 100644
index 0000000..97890a1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/colors/lightBlue.js
@@ -0,0 +1,17 @@
+const lightBlue = {
+  50: '#e1f5fe',
+  100: '#b3e5fc',
+  200: '#81d4fa',
+  300: '#4fc3f7',
+  400: '#29b6f6',
+  500: '#03a9f4',
+  600: '#039be5',
+  700: '#0288d1',
+  800: '#0277bd',
+  900: '#01579b',
+  A100: '#80d8ff',
+  A200: '#40c4ff',
+  A400: '#00b0ff',
+  A700: '#0091ea'
+};
+export default lightBlue;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/colors/orange.js b/ddb_main/node_modules/@mui/material/colors/orange.js
new file mode 100644
index 0000000..df488d3
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/colors/orange.js
@@ -0,0 +1,17 @@
+const orange = {
+  50: '#fff3e0',
+  100: '#ffe0b2',
+  200: '#ffcc80',
+  300: '#ffb74d',
+  400: '#ffa726',
+  500: '#ff9800',
+  600: '#fb8c00',
+  700: '#f57c00',
+  800: '#ef6c00',
+  900: '#e65100',
+  A100: '#ffd180',
+  A200: '#ffab40',
+  A400: '#ff9100',
+  A700: '#ff6d00'
+};
+export default orange;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/colors/purple.js b/ddb_main/node_modules/@mui/material/colors/purple.js
new file mode 100644
index 0000000..7df859b
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/colors/purple.js
@@ -0,0 +1,17 @@
+const purple = {
+  50: '#f3e5f5',
+  100: '#e1bee7',
+  200: '#ce93d8',
+  300: '#ba68c8',
+  400: '#ab47bc',
+  500: '#9c27b0',
+  600: '#8e24aa',
+  700: '#7b1fa2',
+  800: '#6a1b9a',
+  900: '#4a148c',
+  A100: '#ea80fc',
+  A200: '#e040fb',
+  A400: '#d500f9',
+  A700: '#aa00ff'
+};
+export default purple;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/colors/red.js b/ddb_main/node_modules/@mui/material/colors/red.js
new file mode 100644
index 0000000..92bc4e4
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/colors/red.js
@@ -0,0 +1,17 @@
+const red = {
+  50: '#ffebee',
+  100: '#ffcdd2',
+  200: '#ef9a9a',
+  300: '#e57373',
+  400: '#ef5350',
+  500: '#f44336',
+  600: '#e53935',
+  700: '#d32f2f',
+  800: '#c62828',
+  900: '#b71c1c',
+  A100: '#ff8a80',
+  A200: '#ff5252',
+  A400: '#ff1744',
+  A700: '#d50000'
+};
+export default red;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/SwitchBase.js b/ddb_main/node_modules/@mui/material/internal/SwitchBase.js
new file mode 100644
index 0000000..6e101e5
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/SwitchBase.js
@@ -0,0 +1,273 @@
+'use client';
+
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["autoFocus", "checked", "checkedIcon", "className", "defaultChecked", "disabled", "disableFocusRipple", "edge", "icon", "id", "inputProps", "inputRef", "name", "onBlur", "onChange", "onFocus", "readOnly", "required", "tabIndex", "type", "value"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import refType from '@mui/utils/refType';
+import composeClasses from '@mui/utils/composeClasses';
+import capitalize from '../utils/capitalize';
+import styled, { rootShouldForwardProp } from '../styles/styled';
+import useControlled from '../utils/useControlled';
+import useFormControl from '../FormControl/useFormControl';
+import ButtonBase from '../ButtonBase';
+import { getSwitchBaseUtilityClass } from './switchBaseClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    checked,
+    disabled,
+    edge
+  } = ownerState;
+  const slots = {
+    root: ['root', checked && 'checked', disabled && 'disabled', edge && `edge${capitalize(edge)}`],
+    input: ['input']
+  };
+  return composeClasses(slots, getSwitchBaseUtilityClass, classes);
+};
+const SwitchBaseRoot = styled(ButtonBase)(({
+  ownerState
+}) => _extends({
+  padding: 9,
+  borderRadius: '50%'
+}, ownerState.edge === 'start' && {
+  marginLeft: ownerState.size === 'small' ? -3 : -12
+}, ownerState.edge === 'end' && {
+  marginRight: ownerState.size === 'small' ? -3 : -12
+}));
+const SwitchBaseInput = styled('input', {
+  shouldForwardProp: rootShouldForwardProp
+})({
+  cursor: 'inherit',
+  position: 'absolute',
+  opacity: 0,
+  width: '100%',
+  height: '100%',
+  top: 0,
+  left: 0,
+  margin: 0,
+  padding: 0,
+  zIndex: 1
+});
+
+/**
+ * @ignore - internal component.
+ */
+const SwitchBase = /*#__PURE__*/React.forwardRef(function SwitchBase(props, ref) {
+  const {
+      autoFocus,
+      checked: checkedProp,
+      checkedIcon,
+      className,
+      defaultChecked,
+      disabled: disabledProp,
+      disableFocusRipple = false,
+      edge = false,
+      icon,
+      id,
+      inputProps,
+      inputRef,
+      name,
+      onBlur,
+      onChange,
+      onFocus,
+      readOnly,
+      required = false,
+      tabIndex,
+      type,
+      value
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const [checked, setCheckedState] = useControlled({
+    controlled: checkedProp,
+    default: Boolean(defaultChecked),
+    name: 'SwitchBase',
+    state: 'checked'
+  });
+  const muiFormControl = useFormControl();
+  const handleFocus = event => {
+    if (onFocus) {
+      onFocus(event);
+    }
+    if (muiFormControl && muiFormControl.onFocus) {
+      muiFormControl.onFocus(event);
+    }
+  };
+  const handleBlur = event => {
+    if (onBlur) {
+      onBlur(event);
+    }
+    if (muiFormControl && muiFormControl.onBlur) {
+      muiFormControl.onBlur(event);
+    }
+  };
+  const handleInputChange = event => {
+    // Workaround for https://github.com/facebook/react/issues/9023
+    if (event.nativeEvent.defaultPrevented) {
+      return;
+    }
+    const newChecked = event.target.checked;
+    setCheckedState(newChecked);
+    if (onChange) {
+      // TODO v6: remove the second argument.
+      onChange(event, newChecked);
+    }
+  };
+  let disabled = disabledProp;
+  if (muiFormControl) {
+    if (typeof disabled === 'undefined') {
+      disabled = muiFormControl.disabled;
+    }
+  }
+  const hasLabelFor = type === 'checkbox' || type === 'radio';
+  const ownerState = _extends({}, props, {
+    checked,
+    disabled,
+    disableFocusRipple,
+    edge
+  });
+  const classes = useUtilityClasses(ownerState);
+  return /*#__PURE__*/_jsxs(SwitchBaseRoot, _extends({
+    component: "span",
+    className: clsx(classes.root, className),
+    centerRipple: true,
+    focusRipple: !disableFocusRipple,
+    disabled: disabled,
+    tabIndex: null,
+    role: undefined,
+    onFocus: handleFocus,
+    onBlur: handleBlur,
+    ownerState: ownerState,
+    ref: ref
+  }, other, {
+    children: [/*#__PURE__*/_jsx(SwitchBaseInput, _extends({
+      autoFocus: autoFocus,
+      checked: checkedProp,
+      defaultChecked: defaultChecked,
+      className: classes.input,
+      disabled: disabled,
+      id: hasLabelFor ? id : undefined,
+      name: name,
+      onChange: handleInputChange,
+      readOnly: readOnly,
+      ref: inputRef,
+      required: required,
+      ownerState: ownerState,
+      tabIndex: tabIndex,
+      type: type
+    }, type === 'checkbox' && value === undefined ? {} : {
+      value
+    }, inputProps)), checked ? checkedIcon : icon]
+  }));
+});
+
+// NB: If changed, please update Checkbox, Switch and Radio
+// so that the API documentation is updated.
+process.env.NODE_ENV !== "production" ? SwitchBase.propTypes = {
+  /**
+   * If `true`, the `input` element is focused during the first mount.
+   */
+  autoFocus: PropTypes.bool,
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: PropTypes.bool,
+  /**
+   * The icon to display when the component is checked.
+   */
+  checkedIcon: PropTypes.node.isRequired,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * @ignore
+   */
+  defaultChecked: PropTypes.bool,
+  /**
+   * If `true`, the component is disabled.
+   */
+  disabled: PropTypes.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: PropTypes.bool,
+  /**
+   * If given, uses a negative margin to counteract the padding on one
+   * side (this is often helpful for aligning the left or right
+   * side of the icon with content above or below, without ruining the border
+   * size and shape).
+   * @default false
+   */
+  edge: PropTypes.oneOf(['end', 'start', false]),
+  /**
+   * The icon to display when the component is unchecked.
+   */
+  icon: PropTypes.node.isRequired,
+  /**
+   * The id of the `input` element.
+   */
+  id: PropTypes.string,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   */
+  inputProps: PropTypes.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: refType,
+  /*
+   * @ignore
+   */
+  name: PropTypes.string,
+  /**
+   * @ignore
+   */
+  onBlur: PropTypes.func,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {object} event The event source of the callback.
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: PropTypes.func,
+  /**
+   * @ignore
+   */
+  onFocus: PropTypes.func,
+  /**
+   * It prevents the user from changing the value of the field
+   * (not from interacting with the field).
+   */
+  readOnly: PropTypes.bool,
+  /**
+   * If `true`, the `input` element is required.
+   */
+  required: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.object,
+  /**
+   * @ignore
+   */
+  tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * The input component prop `type`.
+   */
+  type: PropTypes.string.isRequired,
+  /**
+   * The value of the component.
+   */
+  value: PropTypes.any
+} : void 0;
+export default SwitchBase;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/animate.js b/ddb_main/node_modules/@mui/material/internal/animate.js
new file mode 100644
index 0000000..800e6fa
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/animate.js
@@ -0,0 +1,39 @@
+function easeInOutSin(time) {
+  return (1 + Math.sin(Math.PI * time - Math.PI / 2)) / 2;
+}
+export default function animate(property, element, to, options = {}, cb = () => {}) {
+  const {
+    ease = easeInOutSin,
+    duration = 300 // standard
+  } = options;
+  let start = null;
+  const from = element[property];
+  let cancelled = false;
+  const cancel = () => {
+    cancelled = true;
+  };
+  const step = timestamp => {
+    if (cancelled) {
+      cb(new Error('Animation cancelled'));
+      return;
+    }
+    if (start === null) {
+      start = timestamp;
+    }
+    const time = Math.min(1, (timestamp - start) / duration);
+    element[property] = ease(time) * (to - from) + from;
+    if (time >= 1) {
+      requestAnimationFrame(() => {
+        cb(null);
+      });
+      return;
+    }
+    requestAnimationFrame(step);
+  };
+  if (from === to) {
+    cb(new Error('Element already at target position'));
+    return cancel;
+  }
+  requestAnimationFrame(step);
+  return cancel;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/ArrowDropDown.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/ArrowDropDown.js
new file mode 100644
index 0000000..ad9ea02
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/ArrowDropDown.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M7 10l5 5 5-5z"
+}), 'ArrowDropDown');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/Cancel.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/Cancel.js
new file mode 100644
index 0000000..12333e3
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/Cancel.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z"
+}), 'Cancel');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/CheckBox.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/CheckBox.js
new file mode 100644
index 0000000..5f69c8c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/CheckBox.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
+}), 'CheckBox');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/CheckBoxOutlineBlank.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/CheckBoxOutlineBlank.js
new file mode 100644
index 0000000..7b2d64a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/CheckBoxOutlineBlank.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
+}), 'CheckBoxOutlineBlank');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/Close.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/Close.js
new file mode 100644
index 0000000..de025cf
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/Close.js
@@ -0,0 +1,14 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ *
+ * Alias to `Clear`.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
+}), 'Close');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/ErrorOutline.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/ErrorOutline.js
new file mode 100644
index 0000000..e190116
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/ErrorOutline.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M11 15h2v2h-2zm0-8h2v6h-2zm.99-5C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"
+}), 'ErrorOutline');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/IndeterminateCheckBox.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/IndeterminateCheckBox.js
new file mode 100644
index 0000000..683fa2f
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/IndeterminateCheckBox.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10H7v-2h10v2z"
+}), 'IndeterminateCheckBox');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/InfoOutlined.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/InfoOutlined.js
new file mode 100644
index 0000000..4683e88
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/InfoOutlined.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20, 12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10, 10 0 0,0 12,2M11,17H13V11H11V17Z"
+}), 'InfoOutlined');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/KeyboardArrowLeft.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/KeyboardArrowLeft.js
new file mode 100644
index 0000000..dd8d83f
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/KeyboardArrowLeft.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"
+}), 'KeyboardArrowLeft');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/KeyboardArrowRight.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/KeyboardArrowRight.js
new file mode 100644
index 0000000..9c8d49f
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/KeyboardArrowRight.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"
+}), 'KeyboardArrowRight');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/Person.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/Person.js
new file mode 100644
index 0000000..9ffeeab
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/Person.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
+}), 'Person');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/RadioButtonChecked.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/RadioButtonChecked.js
new file mode 100644
index 0000000..b7ee949
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/RadioButtonChecked.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M8.465 8.465C9.37 7.56 10.62 7 12 7C14.76 7 17 9.24 17 12C17 13.38 16.44 14.63 15.535 15.535C14.63 16.44 13.38 17 12 17C9.24 17 7 14.76 7 12C7 10.62 7.56 9.37 8.465 8.465Z"
+}), 'RadioButtonChecked');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/RadioButtonUnchecked.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/RadioButtonUnchecked.js
new file mode 100644
index 0000000..8a2936d
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/RadioButtonUnchecked.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"
+}), 'RadioButtonUnchecked');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/ReportProblemOutlined.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/ReportProblemOutlined.js
new file mode 100644
index 0000000..fa3af80
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/ReportProblemOutlined.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M12 5.99L19.53 19H4.47L12 5.99M12 2L1 21h22L12 2zm1 14h-2v2h2v-2zm0-6h-2v4h2v-4z"
+}), 'ReportProblemOutlined');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/svg-icons/SuccessOutlined.js b/ddb_main/node_modules/@mui/material/internal/svg-icons/SuccessOutlined.js
new file mode 100644
index 0000000..5205e3e
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/svg-icons/SuccessOutlined.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import createSvgIcon from '../../utils/createSvgIcon';
+
+/**
+ * @ignore - internal component.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.76,4 13.5,4.11 14.2, 4.31L15.77,2.74C14.61,2.26 13.34,2 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0, 0 22,12M7.91,10.08L6.5,11.5L11,16L21,6L19.59,4.58L11,13.17L7.91,10.08Z"
+}), 'SuccessOutlined');
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/internal/switchBaseClasses.js b/ddb_main/node_modules/@mui/material/internal/switchBaseClasses.js
new file mode 100644
index 0000000..915c093
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/internal/switchBaseClasses.js
@@ -0,0 +1,7 @@
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+export function getSwitchBaseUtilityClass(slot) {
+  return generateUtilityClass('PrivateSwitchBase', slot);
+}
+const switchBaseClasses = generateUtilityClasses('PrivateSwitchBase', ['root', 'checked', 'disabled', 'input', 'edgeStart', 'edgeEnd']);
+export default switchBaseClasses;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/ThemeProvider.js b/ddb_main/node_modules/@mui/material/styles/ThemeProvider.js
new file mode 100644
index 0000000..47d5c75
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/ThemeProvider.js
@@ -0,0 +1,31 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["theme"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { ThemeProvider as SystemThemeProvider } from '@mui/system';
+import THEME_ID from './identifier';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function ThemeProvider(_ref) {
+  let {
+      theme: themeInput
+    } = _ref,
+    props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  const scopedTheme = themeInput[THEME_ID];
+  return /*#__PURE__*/_jsx(SystemThemeProvider, _extends({}, props, {
+    themeId: scopedTheme ? THEME_ID : undefined,
+    theme: scopedTheme || themeInput
+  }));
+}
+process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes = {
+  /**
+   * Your component tree.
+   */
+  children: PropTypes.node,
+  /**
+   * A theme object. You can provide a function to extend the outer theme.
+   */
+  theme: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).isRequired
+} : void 0;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/createMixins.js b/ddb_main/node_modules/@mui/material/styles/createMixins.js
new file mode 100644
index 0000000..485aff5
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/createMixins.js
@@ -0,0 +1,16 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+export default function createMixins(breakpoints, mixins) {
+  return _extends({
+    toolbar: {
+      minHeight: 56,
+      [breakpoints.up('xs')]: {
+        '@media (orientation: landscape)': {
+          minHeight: 48
+        }
+      },
+      [breakpoints.up('sm')]: {
+        minHeight: 64
+      }
+    }
+  }, mixins);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/createPalette.js b/ddb_main/node_modules/@mui/material/styles/createPalette.js
new file mode 100644
index 0000000..07b43a5
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/createPalette.js
@@ -0,0 +1,305 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
+const _excluded = ["mode", "contrastThreshold", "tonalOffset"];
+import deepmerge from '@mui/utils/deepmerge';
+import { darken, getContrastRatio, lighten } from '@mui/system/colorManipulator';
+import common from '../colors/common';
+import grey from '../colors/grey';
+import purple from '../colors/purple';
+import red from '../colors/red';
+import orange from '../colors/orange';
+import blue from '../colors/blue';
+import lightBlue from '../colors/lightBlue';
+import green from '../colors/green';
+export const light = {
+  // The colors used to style the text.
+  text: {
+    // The most important text.
+    primary: 'rgba(0, 0, 0, 0.87)',
+    // Secondary text.
+    secondary: 'rgba(0, 0, 0, 0.6)',
+    // Disabled text have even lower visual prominence.
+    disabled: 'rgba(0, 0, 0, 0.38)'
+  },
+  // The color used to divide different elements.
+  divider: 'rgba(0, 0, 0, 0.12)',
+  // The background colors used to style the surfaces.
+  // Consistency between these values is important.
+  background: {
+    paper: common.white,
+    default: common.white
+  },
+  // The colors used to style the action elements.
+  action: {
+    // The color of an active action like an icon button.
+    active: 'rgba(0, 0, 0, 0.54)',
+    // The color of an hovered action.
+    hover: 'rgba(0, 0, 0, 0.04)',
+    hoverOpacity: 0.04,
+    // The color of a selected action.
+    selected: 'rgba(0, 0, 0, 0.08)',
+    selectedOpacity: 0.08,
+    // The color of a disabled action.
+    disabled: 'rgba(0, 0, 0, 0.26)',
+    // The background color of a disabled action.
+    disabledBackground: 'rgba(0, 0, 0, 0.12)',
+    disabledOpacity: 0.38,
+    focus: 'rgba(0, 0, 0, 0.12)',
+    focusOpacity: 0.12,
+    activatedOpacity: 0.12
+  }
+};
+export const dark = {
+  text: {
+    primary: common.white,
+    secondary: 'rgba(255, 255, 255, 0.7)',
+    disabled: 'rgba(255, 255, 255, 0.5)',
+    icon: 'rgba(255, 255, 255, 0.5)'
+  },
+  divider: 'rgba(255, 255, 255, 0.12)',
+  background: {
+    paper: '#121212',
+    default: '#121212'
+  },
+  action: {
+    active: common.white,
+    hover: 'rgba(255, 255, 255, 0.08)',
+    hoverOpacity: 0.08,
+    selected: 'rgba(255, 255, 255, 0.16)',
+    selectedOpacity: 0.16,
+    disabled: 'rgba(255, 255, 255, 0.3)',
+    disabledBackground: 'rgba(255, 255, 255, 0.12)',
+    disabledOpacity: 0.38,
+    focus: 'rgba(255, 255, 255, 0.12)',
+    focusOpacity: 0.12,
+    activatedOpacity: 0.24
+  }
+};
+function addLightOrDark(intent, direction, shade, tonalOffset) {
+  const tonalOffsetLight = tonalOffset.light || tonalOffset;
+  const tonalOffsetDark = tonalOffset.dark || tonalOffset * 1.5;
+  if (!intent[direction]) {
+    if (intent.hasOwnProperty(shade)) {
+      intent[direction] = intent[shade];
+    } else if (direction === 'light') {
+      intent.light = lighten(intent.main, tonalOffsetLight);
+    } else if (direction === 'dark') {
+      intent.dark = darken(intent.main, tonalOffsetDark);
+    }
+  }
+}
+function getDefaultPrimary(mode = 'light') {
+  if (mode === 'dark') {
+    return {
+      main: blue[200],
+      light: blue[50],
+      dark: blue[400]
+    };
+  }
+  return {
+    main: blue[700],
+    light: blue[400],
+    dark: blue[800]
+  };
+}
+function getDefaultSecondary(mode = 'light') {
+  if (mode === 'dark') {
+    return {
+      main: purple[200],
+      light: purple[50],
+      dark: purple[400]
+    };
+  }
+  return {
+    main: purple[500],
+    light: purple[300],
+    dark: purple[700]
+  };
+}
+function getDefaultError(mode = 'light') {
+  if (mode === 'dark') {
+    return {
+      main: red[500],
+      light: red[300],
+      dark: red[700]
+    };
+  }
+  return {
+    main: red[700],
+    light: red[400],
+    dark: red[800]
+  };
+}
+function getDefaultInfo(mode = 'light') {
+  if (mode === 'dark') {
+    return {
+      main: lightBlue[400],
+      light: lightBlue[300],
+      dark: lightBlue[700]
+    };
+  }
+  return {
+    main: lightBlue[700],
+    light: lightBlue[500],
+    dark: lightBlue[900]
+  };
+}
+function getDefaultSuccess(mode = 'light') {
+  if (mode === 'dark') {
+    return {
+      main: green[400],
+      light: green[300],
+      dark: green[700]
+    };
+  }
+  return {
+    main: green[800],
+    light: green[500],
+    dark: green[900]
+  };
+}
+function getDefaultWarning(mode = 'light') {
+  if (mode === 'dark') {
+    return {
+      main: orange[400],
+      light: orange[300],
+      dark: orange[700]
+    };
+  }
+  return {
+    main: '#ed6c02',
+    // closest to orange[800] that pass 3:1.
+    light: orange[500],
+    dark: orange[900]
+  };
+}
+export default function createPalette(palette) {
+  const {
+      mode = 'light',
+      contrastThreshold = 3,
+      tonalOffset = 0.2
+    } = palette,
+    other = _objectWithoutPropertiesLoose(palette, _excluded);
+  const primary = palette.primary || getDefaultPrimary(mode);
+  const secondary = palette.secondary || getDefaultSecondary(mode);
+  const error = palette.error || getDefaultError(mode);
+  const info = palette.info || getDefaultInfo(mode);
+  const success = palette.success || getDefaultSuccess(mode);
+  const warning = palette.warning || getDefaultWarning(mode);
+
+  // Use the same logic as
+  // Bootstrap: https://github.com/twbs/bootstrap/blob/1d6e3710dd447de1a200f29e8fa521f8a0908f70/scss/_functions.scss#L59
+  // and material-components-web https://github.com/material-components/material-components-web/blob/ac46b8863c4dab9fc22c4c662dc6bd1b65dd652f/packages/mdc-theme/_functions.scss#L54
+  function getContrastText(background) {
+    const contrastText = getContrastRatio(background, dark.text.primary) >= contrastThreshold ? dark.text.primary : light.text.primary;
+    if (process.env.NODE_ENV !== 'production') {
+      const contrast = getContrastRatio(background, contrastText);
+      if (contrast < 3) {
+        console.error([`MUI: The contrast ratio of ${contrast}:1 for ${contrastText} on ${background}`, 'falls below the WCAG recommended absolute minimum contrast ratio of 3:1.', 'https://www.w3.org/TR/2008/REC-WCAG20-20081211/#visual-audio-contrast-contrast'].join('\n'));
+      }
+    }
+    return contrastText;
+  }
+  const augmentColor = ({
+    color,
+    name,
+    mainShade = 500,
+    lightShade = 300,
+    darkShade = 700
+  }) => {
+    color = _extends({}, color);
+    if (!color.main && color[mainShade]) {
+      color.main = color[mainShade];
+    }
+    if (!color.hasOwnProperty('main')) {
+      throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The color${name ? ` (${name})` : ''} provided to augmentColor(color) is invalid.
+The color object needs to have a \`main\` property or a \`${mainShade}\` property.` : _formatMuiErrorMessage(11, name ? ` (${name})` : '', mainShade));
+    }
+    if (typeof color.main !== 'string') {
+      throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The color${name ? ` (${name})` : ''} provided to augmentColor(color) is invalid.
+\`color.main\` should be a string, but \`${JSON.stringify(color.main)}\` was provided instead.
+
+Did you intend to use one of the following approaches?
+
+import { green } from "@mui/material/colors";
+
+const theme1 = createTheme({ palette: {
+  primary: green,
+} });
+
+const theme2 = createTheme({ palette: {
+  primary: { main: green[500] },
+} });` : _formatMuiErrorMessage(12, name ? ` (${name})` : '', JSON.stringify(color.main)));
+    }
+    addLightOrDark(color, 'light', lightShade, tonalOffset);
+    addLightOrDark(color, 'dark', darkShade, tonalOffset);
+    if (!color.contrastText) {
+      color.contrastText = getContrastText(color.main);
+    }
+    return color;
+  };
+  const modes = {
+    dark,
+    light
+  };
+  if (process.env.NODE_ENV !== 'production') {
+    if (!modes[mode]) {
+      console.error(`MUI: The palette mode \`${mode}\` is not supported.`);
+    }
+  }
+  const paletteOutput = deepmerge(_extends({
+    // A collection of common colors.
+    common: _extends({}, common),
+    // prevent mutable object.
+    // The palette mode, can be light or dark.
+    mode,
+    // The colors used to represent primary interface elements for a user.
+    primary: augmentColor({
+      color: primary,
+      name: 'primary'
+    }),
+    // The colors used to represent secondary interface elements for a user.
+    secondary: augmentColor({
+      color: secondary,
+      name: 'secondary',
+      mainShade: 'A400',
+      lightShade: 'A200',
+      darkShade: 'A700'
+    }),
+    // The colors used to represent interface elements that the user should be made aware of.
+    error: augmentColor({
+      color: error,
+      name: 'error'
+    }),
+    // The colors used to represent potentially dangerous actions or important messages.
+    warning: augmentColor({
+      color: warning,
+      name: 'warning'
+    }),
+    // The colors used to present information to the user that is neutral and not necessarily important.
+    info: augmentColor({
+      color: info,
+      name: 'info'
+    }),
+    // The colors used to indicate the successful completion of an action that user triggered.
+    success: augmentColor({
+      color: success,
+      name: 'success'
+    }),
+    // The grey colors.
+    grey,
+    // Used by `getContrastText()` to maximize the contrast between
+    // the background and the text.
+    contrastThreshold,
+    // Takes a background color and returns the text color that maximizes the contrast.
+    getContrastText,
+    // Generate a rich color object.
+    augmentColor,
+    // Used by the functions below to shift a color's luminance by approximately
+    // two indexes within its tonal palette.
+    // E.g., shift from Red 500 to Red 300 or Red 700.
+    tonalOffset
+  }, modes[mode]), other);
+  return paletteOutput;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/createTheme.js b/ddb_main/node_modules/@mui/material/styles/createTheme.js
new file mode 100644
index 0000000..d083059
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/createTheme.js
@@ -0,0 +1,89 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
+const _excluded = ["breakpoints", "mixins", "spacing", "palette", "transitions", "typography", "shape"];
+import deepmerge from '@mui/utils/deepmerge';
+import styleFunctionSx, { unstable_defaultSxConfig as defaultSxConfig } from '@mui/system/styleFunctionSx';
+import systemCreateTheme from '@mui/system/createTheme';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import createMixins from './createMixins';
+import createPalette from './createPalette';
+import createTypography from './createTypography';
+import shadows from './shadows';
+import createTransitions from './createTransitions';
+import zIndex from './zIndex';
+function createTheme(options = {}, ...args) {
+  const {
+      mixins: mixinsInput = {},
+      palette: paletteInput = {},
+      transitions: transitionsInput = {},
+      typography: typographyInput = {}
+    } = options,
+    other = _objectWithoutPropertiesLoose(options, _excluded);
+  if (options.vars) {
+    throw new Error(process.env.NODE_ENV !== "production" ? `MUI: \`vars\` is a private field used for CSS variables support.
+Please use another name.` : _formatMuiErrorMessage(18));
+  }
+  const palette = createPalette(paletteInput);
+  const systemTheme = systemCreateTheme(options);
+  let muiTheme = deepmerge(systemTheme, {
+    mixins: createMixins(systemTheme.breakpoints, mixinsInput),
+    palette,
+    // Don't use [...shadows] until you've verified its transpiled code is not invoking the iterator protocol.
+    shadows: shadows.slice(),
+    typography: createTypography(palette, typographyInput),
+    transitions: createTransitions(transitionsInput),
+    zIndex: _extends({}, zIndex)
+  });
+  muiTheme = deepmerge(muiTheme, other);
+  muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
+  if (process.env.NODE_ENV !== 'production') {
+    // TODO v6: Refactor to use globalStateClassesMapping from @mui/utils once `readOnly` state class is used in Rating component.
+    const stateClasses = ['active', 'checked', 'completed', 'disabled', 'error', 'expanded', 'focused', 'focusVisible', 'required', 'selected'];
+    const traverse = (node, component) => {
+      let key;
+
+      // eslint-disable-next-line guard-for-in, no-restricted-syntax
+      for (key in node) {
+        const child = node[key];
+        if (stateClasses.indexOf(key) !== -1 && Object.keys(child).length > 0) {
+          if (process.env.NODE_ENV !== 'production') {
+            const stateClass = generateUtilityClass('', key);
+            console.error([`MUI: The \`${component}\` component increases ` + `the CSS specificity of the \`${key}\` internal state.`, 'You can not override it like this: ', JSON.stringify(node, null, 2), '', `Instead, you need to use the '&.${stateClass}' syntax:`, JSON.stringify({
+              root: {
+                [`&.${stateClass}`]: child
+              }
+            }, null, 2), '', 'https://mui.com/r/state-classes-guide'].join('\n'));
+          }
+          // Remove the style to prevent global conflicts.
+          node[key] = {};
+        }
+      }
+    };
+    Object.keys(muiTheme.components).forEach(component => {
+      const styleOverrides = muiTheme.components[component].styleOverrides;
+      if (styleOverrides && component.indexOf('Mui') === 0) {
+        traverse(styleOverrides, component);
+      }
+    });
+  }
+  muiTheme.unstable_sxConfig = _extends({}, defaultSxConfig, other == null ? void 0 : other.unstable_sxConfig);
+  muiTheme.unstable_sx = function sx(props) {
+    return styleFunctionSx({
+      sx: props,
+      theme: this
+    });
+  };
+  return muiTheme;
+}
+let warnedOnce = false;
+export function createMuiTheme(...args) {
+  if (process.env.NODE_ENV !== 'production') {
+    if (!warnedOnce) {
+      warnedOnce = true;
+      console.error(['MUI: the createMuiTheme function was renamed to createTheme.', '', "You should use `import { createTheme } from '@mui/material/styles'`"].join('\n'));
+    }
+  }
+  return createTheme(...args);
+}
+export default createTheme;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/createTransitions.js b/ddb_main/node_modules/@mui/material/styles/createTransitions.js
new file mode 100644
index 0000000..f65ecc3
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/createTransitions.js
@@ -0,0 +1,88 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["duration", "easing", "delay"];
+// Follow https://material.google.com/motion/duration-easing.html#duration-easing-natural-easing-curves
+// to learn the context in which each easing should be used.
+export const easing = {
+  // This is the most common easing curve.
+  easeInOut: 'cubic-bezier(0.4, 0, 0.2, 1)',
+  // Objects enter the screen at full velocity from off-screen and
+  // slowly decelerate to a resting point.
+  easeOut: 'cubic-bezier(0.0, 0, 0.2, 1)',
+  // Objects leave the screen at full velocity. They do not decelerate when off-screen.
+  easeIn: 'cubic-bezier(0.4, 0, 1, 1)',
+  // The sharp curve is used by objects that may return to the screen at any time.
+  sharp: 'cubic-bezier(0.4, 0, 0.6, 1)'
+};
+
+// Follow https://m2.material.io/guidelines/motion/duration-easing.html#duration-easing-common-durations
+// to learn when use what timing
+export const duration = {
+  shortest: 150,
+  shorter: 200,
+  short: 250,
+  // most basic recommended timing
+  standard: 300,
+  // this is to be used in complex animations
+  complex: 375,
+  // recommended when something is entering screen
+  enteringScreen: 225,
+  // recommended when something is leaving screen
+  leavingScreen: 195
+};
+function formatMs(milliseconds) {
+  return `${Math.round(milliseconds)}ms`;
+}
+function getAutoHeightDuration(height) {
+  if (!height) {
+    return 0;
+  }
+  const constant = height / 36;
+
+  // https://www.wolframalpha.com/input/?i=(4+%2B+15+*+(x+%2F+36+)+**+0.25+%2B+(x+%2F+36)+%2F+5)+*+10
+  return Math.round((4 + 15 * constant ** 0.25 + constant / 5) * 10);
+}
+export default function createTransitions(inputTransitions) {
+  const mergedEasing = _extends({}, easing, inputTransitions.easing);
+  const mergedDuration = _extends({}, duration, inputTransitions.duration);
+  const create = (props = ['all'], options = {}) => {
+    const {
+        duration: durationOption = mergedDuration.standard,
+        easing: easingOption = mergedEasing.easeInOut,
+        delay = 0
+      } = options,
+      other = _objectWithoutPropertiesLoose(options, _excluded);
+    if (process.env.NODE_ENV !== 'production') {
+      const isString = value => typeof value === 'string';
+      // IE11 support, replace with Number.isNaN
+      // eslint-disable-next-line no-restricted-globals
+      const isNumber = value => !isNaN(parseFloat(value));
+      if (!isString(props) && !Array.isArray(props)) {
+        console.error('MUI: Argument "props" must be a string or Array.');
+      }
+      if (!isNumber(durationOption) && !isString(durationOption)) {
+        console.error(`MUI: Argument "duration" must be a number or a string but found ${durationOption}.`);
+      }
+      if (!isString(easingOption)) {
+        console.error('MUI: Argument "easing" must be a string.');
+      }
+      if (!isNumber(delay) && !isString(delay)) {
+        console.error('MUI: Argument "delay" must be a number or a string.');
+      }
+      if (typeof options !== 'object') {
+        console.error(['MUI: Secong argument of transition.create must be an object.', "Arguments should be either `create('prop1', options)` or `create(['prop1', 'prop2'], options)`"].join('\n'));
+      }
+      if (Object.keys(other).length !== 0) {
+        console.error(`MUI: Unrecognized argument(s) [${Object.keys(other).join(',')}].`);
+      }
+    }
+    return (Array.isArray(props) ? props : [props]).map(animatedProp => `${animatedProp} ${typeof durationOption === 'string' ? durationOption : formatMs(durationOption)} ${easingOption} ${typeof delay === 'string' ? delay : formatMs(delay)}`).join(',');
+  };
+  return _extends({
+    getAutoHeightDuration,
+    create
+  }, inputTransitions, {
+    easing: mergedEasing,
+    duration: mergedDuration
+  });
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/createTypography.js b/ddb_main/node_modules/@mui/material/styles/createTypography.js
new file mode 100644
index 0000000..d0a9cec
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/createTypography.js
@@ -0,0 +1,90 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"];
+import deepmerge from '@mui/utils/deepmerge';
+function round(value) {
+  return Math.round(value * 1e5) / 1e5;
+}
+const caseAllCaps = {
+  textTransform: 'uppercase'
+};
+const defaultFontFamily = '"Roboto", "Helvetica", "Arial", sans-serif';
+
+/**
+ * @see @link{https://m2.material.io/design/typography/the-type-system.html}
+ * @see @link{https://m2.material.io/design/typography/understanding-typography.html}
+ */
+export default function createTypography(palette, typography) {
+  const _ref = typeof typography === 'function' ? typography(palette) : typography,
+    {
+      fontFamily = defaultFontFamily,
+      // The default font size of the Material Specification.
+      fontSize = 14,
+      // px
+      fontWeightLight = 300,
+      fontWeightRegular = 400,
+      fontWeightMedium = 500,
+      fontWeightBold = 700,
+      // Tell MUI what's the font-size on the html element.
+      // 16px is the default font-size used by browsers.
+      htmlFontSize = 16,
+      // Apply the CSS properties to all the variants.
+      allVariants,
+      pxToRem: pxToRem2
+    } = _ref,
+    other = _objectWithoutPropertiesLoose(_ref, _excluded);
+  if (process.env.NODE_ENV !== 'production') {
+    if (typeof fontSize !== 'number') {
+      console.error('MUI: `fontSize` is required to be a number.');
+    }
+    if (typeof htmlFontSize !== 'number') {
+      console.error('MUI: `htmlFontSize` is required to be a number.');
+    }
+  }
+  const coef = fontSize / 14;
+  const pxToRem = pxToRem2 || (size => `${size / htmlFontSize * coef}rem`);
+  const buildVariant = (fontWeight, size, lineHeight, letterSpacing, casing) => _extends({
+    fontFamily,
+    fontWeight,
+    fontSize: pxToRem(size),
+    // Unitless following https://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/
+    lineHeight
+  }, fontFamily === defaultFontFamily ? {
+    letterSpacing: `${round(letterSpacing / size)}em`
+  } : {}, casing, allVariants);
+  const variants = {
+    h1: buildVariant(fontWeightLight, 96, 1.167, -1.5),
+    h2: buildVariant(fontWeightLight, 60, 1.2, -0.5),
+    h3: buildVariant(fontWeightRegular, 48, 1.167, 0),
+    h4: buildVariant(fontWeightRegular, 34, 1.235, 0.25),
+    h5: buildVariant(fontWeightRegular, 24, 1.334, 0),
+    h6: buildVariant(fontWeightMedium, 20, 1.6, 0.15),
+    subtitle1: buildVariant(fontWeightRegular, 16, 1.75, 0.15),
+    subtitle2: buildVariant(fontWeightMedium, 14, 1.57, 0.1),
+    body1: buildVariant(fontWeightRegular, 16, 1.5, 0.15),
+    body2: buildVariant(fontWeightRegular, 14, 1.43, 0.15),
+    button: buildVariant(fontWeightMedium, 14, 1.75, 0.4, caseAllCaps),
+    caption: buildVariant(fontWeightRegular, 12, 1.66, 0.4),
+    overline: buildVariant(fontWeightRegular, 12, 2.66, 1, caseAllCaps),
+    // TODO v6: Remove handling of 'inherit' variant from the theme as it is already handled in Material UI's Typography component. Also, remember to remove the associated types.
+    inherit: {
+      fontFamily: 'inherit',
+      fontWeight: 'inherit',
+      fontSize: 'inherit',
+      lineHeight: 'inherit',
+      letterSpacing: 'inherit'
+    }
+  };
+  return deepmerge(_extends({
+    htmlFontSize,
+    pxToRem,
+    fontFamily,
+    fontSize,
+    fontWeightLight,
+    fontWeightRegular,
+    fontWeightMedium,
+    fontWeightBold
+  }, variants), other, {
+    clone: false // No need to clone deep
+  });
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/defaultTheme.js b/ddb_main/node_modules/@mui/material/styles/defaultTheme.js
new file mode 100644
index 0000000..8260b72
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/defaultTheme.js
@@ -0,0 +1,5 @@
+'use client';
+
+import createTheme from './createTheme';
+const defaultTheme = createTheme();
+export default defaultTheme;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/getOverlayAlpha.js b/ddb_main/node_modules/@mui/material/styles/getOverlayAlpha.js
new file mode 100644
index 0000000..f5b56f2
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/getOverlayAlpha.js
@@ -0,0 +1,11 @@
+// Inspired by https://github.com/material-components/material-components-ios/blob/bca36107405594d5b7b16265a5b0ed698f85a5ee/components/Elevation/src/UIColor%2BMaterialElevation.m#L61
+const getOverlayAlpha = elevation => {
+  let alphaValue;
+  if (elevation < 1) {
+    alphaValue = 5.11916 * elevation ** 2;
+  } else {
+    alphaValue = 4.5 * Math.log(elevation + 1) + 2;
+  }
+  return (alphaValue / 100).toFixed(2);
+};
+export default getOverlayAlpha;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/identifier.js b/ddb_main/node_modules/@mui/material/styles/identifier.js
new file mode 100644
index 0000000..f490a23
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/identifier.js
@@ -0,0 +1 @@
+export default '$$material';
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/rootShouldForwardProp.js b/ddb_main/node_modules/@mui/material/styles/rootShouldForwardProp.js
new file mode 100644
index 0000000..668f8c4
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/rootShouldForwardProp.js
@@ -0,0 +1,3 @@
+import slotShouldForwardProp from './slotShouldForwardProp';
+const rootShouldForwardProp = prop => slotShouldForwardProp(prop) && prop !== 'classes';
+export default rootShouldForwardProp;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/shadows.js b/ddb_main/node_modules/@mui/material/styles/shadows.js
new file mode 100644
index 0000000..37cba28
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/shadows.js
@@ -0,0 +1,10 @@
+const shadowKeyUmbraOpacity = 0.2;
+const shadowKeyPenumbraOpacity = 0.14;
+const shadowAmbientShadowOpacity = 0.12;
+function createShadow(...px) {
+  return [`${px[0]}px ${px[1]}px ${px[2]}px ${px[3]}px rgba(0,0,0,${shadowKeyUmbraOpacity})`, `${px[4]}px ${px[5]}px ${px[6]}px ${px[7]}px rgba(0,0,0,${shadowKeyPenumbraOpacity})`, `${px[8]}px ${px[9]}px ${px[10]}px ${px[11]}px rgba(0,0,0,${shadowAmbientShadowOpacity})`].join(',');
+}
+
+// Values from https://github.com/material-components/material-components-web/blob/be8747f94574669cb5e7add1a7c54fa41a89cec7/packages/mdc-elevation/_variables.scss
+const shadows = ['none', createShadow(0, 2, 1, -1, 0, 1, 1, 0, 0, 1, 3, 0), createShadow(0, 3, 1, -2, 0, 2, 2, 0, 0, 1, 5, 0), createShadow(0, 3, 3, -2, 0, 3, 4, 0, 0, 1, 8, 0), createShadow(0, 2, 4, -1, 0, 4, 5, 0, 0, 1, 10, 0), createShadow(0, 3, 5, -1, 0, 5, 8, 0, 0, 1, 14, 0), createShadow(0, 3, 5, -1, 0, 6, 10, 0, 0, 1, 18, 0), createShadow(0, 4, 5, -2, 0, 7, 10, 1, 0, 2, 16, 1), createShadow(0, 5, 5, -3, 0, 8, 10, 1, 0, 3, 14, 2), createShadow(0, 5, 6, -3, 0, 9, 12, 1, 0, 3, 16, 2), createShadow(0, 6, 6, -3, 0, 10, 14, 1, 0, 4, 18, 3), createShadow(0, 6, 7, -4, 0, 11, 15, 1, 0, 4, 20, 3), createShadow(0, 7, 8, -4, 0, 12, 17, 2, 0, 5, 22, 4), createShadow(0, 7, 8, -4, 0, 13, 19, 2, 0, 5, 24, 4), createShadow(0, 7, 9, -4, 0, 14, 21, 2, 0, 5, 26, 4), createShadow(0, 8, 9, -5, 0, 15, 22, 2, 0, 6, 28, 5), createShadow(0, 8, 10, -5, 0, 16, 24, 2, 0, 6, 30, 5), createShadow(0, 8, 11, -5, 0, 17, 26, 2, 0, 6, 32, 5), createShadow(0, 9, 11, -5, 0, 18, 28, 2, 0, 7, 34, 6), createShadow(0, 9, 12, -6, 0, 19, 29, 2, 0, 7, 36, 6), createShadow(0, 10, 13, -6, 0, 20, 31, 3, 0, 8, 38, 7), createShadow(0, 10, 13, -6, 0, 21, 33, 3, 0, 8, 40, 7), createShadow(0, 10, 14, -6, 0, 22, 35, 3, 0, 8, 42, 7), createShadow(0, 11, 14, -7, 0, 23, 36, 3, 0, 9, 44, 8), createShadow(0, 11, 15, -7, 0, 24, 38, 3, 0, 9, 46, 8)];
+export default shadows;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/slotShouldForwardProp.js b/ddb_main/node_modules/@mui/material/styles/slotShouldForwardProp.js
new file mode 100644
index 0000000..17f0b1d
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/slotShouldForwardProp.js
@@ -0,0 +1,5 @@
+// copied from @mui/system/createStyled
+function slotShouldForwardProp(prop) {
+  return prop !== 'ownerState' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';
+}
+export default slotShouldForwardProp;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/styled.js b/ddb_main/node_modules/@mui/material/styles/styled.js
new file mode 100644
index 0000000..5ba03d1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/styled.js
@@ -0,0 +1,14 @@
+'use client';
+
+import createStyled from '@mui/system/createStyled';
+import defaultTheme from './defaultTheme';
+import THEME_ID from './identifier';
+import rootShouldForwardProp from './rootShouldForwardProp';
+export { default as slotShouldForwardProp } from './slotShouldForwardProp';
+export { default as rootShouldForwardProp } from './rootShouldForwardProp';
+const styled = createStyled({
+  themeId: THEME_ID,
+  defaultTheme,
+  rootShouldForwardProp
+});
+export default styled;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/useTheme.js b/ddb_main/node_modules/@mui/material/styles/useTheme.js
new file mode 100644
index 0000000..6284a21
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/useTheme.js
@@ -0,0 +1,14 @@
+'use client';
+
+import * as React from 'react';
+import { useTheme as useThemeSystem } from '@mui/system';
+import defaultTheme from './defaultTheme';
+import THEME_ID from './identifier';
+export default function useTheme() {
+  const theme = useThemeSystem(defaultTheme);
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useDebugValue(theme);
+  }
+  return theme[THEME_ID] || theme;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/useThemeProps.js b/ddb_main/node_modules/@mui/material/styles/useThemeProps.js
new file mode 100644
index 0000000..9cb5952
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/useThemeProps.js
@@ -0,0 +1,16 @@
+'use client';
+
+import systemUseThemeProps from '@mui/system/useThemeProps';
+import defaultTheme from './defaultTheme';
+import THEME_ID from './identifier';
+export default function useThemeProps({
+  props,
+  name
+}) {
+  return systemUseThemeProps({
+    props,
+    name,
+    defaultTheme,
+    themeId: THEME_ID
+  });
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/styles/zIndex.js b/ddb_main/node_modules/@mui/material/styles/zIndex.js
new file mode 100644
index 0000000..9e14e82
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/styles/zIndex.js
@@ -0,0 +1,13 @@
+// We need to centralize the zIndex definitions as they work
+// like global values in the browser.
+const zIndex = {
+  mobileStepper: 1000,
+  fab: 1050,
+  speedDial: 1050,
+  appBar: 1100,
+  drawer: 1200,
+  modal: 1300,
+  snackbar: 1400,
+  tooltip: 1500
+};
+export default zIndex;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/transitions/utils.js b/ddb_main/node_modules/@mui/material/transitions/utils.js
new file mode 100644
index 0000000..c880620
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/transitions/utils.js
@@ -0,0 +1,14 @@
+export const reflow = node => node.scrollTop;
+export function getTransitionProps(props, options) {
+  var _style$transitionDura, _style$transitionTimi;
+  const {
+    timeout,
+    easing,
+    style = {}
+  } = props;
+  return {
+    duration: (_style$transitionDura = style.transitionDuration) != null ? _style$transitionDura : typeof timeout === 'number' ? timeout : timeout[options.mode] || 0,
+    easing: (_style$transitionTimi = style.transitionTimingFunction) != null ? _style$transitionTimi : typeof easing === 'object' ? easing[options.mode] : easing,
+    delay: style.transitionDelay
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/capitalize.js b/ddb_main/node_modules/@mui/material/utils/capitalize.js
new file mode 100644
index 0000000..34d74b6
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/capitalize.js
@@ -0,0 +1,2 @@
+import capitalize from '@mui/utils/capitalize';
+export default capitalize;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/createChainedFunction.js b/ddb_main/node_modules/@mui/material/utils/createChainedFunction.js
new file mode 100644
index 0000000..4763774
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/createChainedFunction.js
@@ -0,0 +1,2 @@
+import createChainedFunction from '@mui/utils/createChainedFunction';
+export default createChainedFunction;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/createSvgIcon.js b/ddb_main/node_modules/@mui/material/utils/createSvgIcon.js
new file mode 100644
index 0000000..c0134e6
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/createSvgIcon.js
@@ -0,0 +1,27 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import SvgIcon from '../SvgIcon';
+
+/**
+ * Private module reserved for @mui packages.
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function createSvgIcon(path, displayName) {
+  function Component(props, ref) {
+    return /*#__PURE__*/_jsx(SvgIcon, _extends({
+      "data-testid": `${displayName}Icon`,
+      ref: ref
+    }, props, {
+      children: path
+    }));
+  }
+  if (process.env.NODE_ENV !== 'production') {
+    // Need to set `displayName` on the inner component for React.memo.
+    // React prior to 16.14 ignores `displayName` on the wrapper.
+    Component.displayName = `${displayName}Icon`;
+  }
+  Component.muiName = SvgIcon.muiName;
+  return /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(Component));
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/debounce.js b/ddb_main/node_modules/@mui/material/utils/debounce.js
new file mode 100644
index 0000000..d2ebe87
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/debounce.js
@@ -0,0 +1,2 @@
+import debounce from '@mui/utils/debounce';
+export default debounce;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/deprecatedPropType.js b/ddb_main/node_modules/@mui/material/utils/deprecatedPropType.js
new file mode 100644
index 0000000..e7bc552
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/deprecatedPropType.js
@@ -0,0 +1,2 @@
+import deprecatedPropType from '@mui/utils/deprecatedPropType';
+export default deprecatedPropType;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/getScrollbarSize.js b/ddb_main/node_modules/@mui/material/utils/getScrollbarSize.js
new file mode 100644
index 0000000..de62cf9
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/getScrollbarSize.js
@@ -0,0 +1,2 @@
+import getScrollbarSize from '@mui/utils/getScrollbarSize';
+export default getScrollbarSize;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/index.js b/ddb_main/node_modules/@mui/material/utils/index.js
new file mode 100644
index 0000000..7a3c007
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/index.js
@@ -0,0 +1,30 @@
+'use client';
+
+import { unstable_ClassNameGenerator as ClassNameGenerator } from '@mui/base/ClassNameGenerator';
+export { default as capitalize } from './capitalize';
+export { default as createChainedFunction } from './createChainedFunction';
+export { default as createSvgIcon } from './createSvgIcon';
+export { default as debounce } from './debounce';
+export { default as deprecatedPropType } from './deprecatedPropType';
+export { default as isMuiElement } from './isMuiElement';
+export { default as ownerDocument } from './ownerDocument';
+export { default as ownerWindow } from './ownerWindow';
+export { default as requirePropFactory } from './requirePropFactory';
+export { default as setRef } from './setRef';
+export { default as unstable_useEnhancedEffect } from './useEnhancedEffect';
+export { default as unstable_useId } from './useId';
+export { default as unsupportedProp } from './unsupportedProp';
+export { default as useControlled } from './useControlled';
+export { default as useEventCallback } from './useEventCallback';
+export { default as useForkRef } from './useForkRef';
+export { default as useIsFocusVisible } from './useIsFocusVisible';
+// TODO: remove this export once ClassNameGenerator is stable
+// eslint-disable-next-line @typescript-eslint/naming-convention
+export const unstable_ClassNameGenerator = {
+  configure: generator => {
+    if (process.env.NODE_ENV !== 'production') {
+      console.warn(['MUI: `ClassNameGenerator` import from `@mui/material/utils` is outdated and might cause unexpected issues.', '', "You should use `import { unstable_ClassNameGenerator } from '@mui/material/className'` instead", '', 'The detail of the issue: https://github.com/mui/material-ui/issues/30011#issuecomment-1024993401', '', 'The updated documentation: https://mui.com/guides/classname-generator/'].join('\n'));
+    }
+    ClassNameGenerator.configure(generator);
+  }
+};
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/isMuiElement.js b/ddb_main/node_modules/@mui/material/utils/isMuiElement.js
new file mode 100644
index 0000000..f1ad431
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/isMuiElement.js
@@ -0,0 +1,2 @@
+import isMuiElement from '@mui/utils/isMuiElement';
+export default isMuiElement;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/ownerDocument.js b/ddb_main/node_modules/@mui/material/utils/ownerDocument.js
new file mode 100644
index 0000000..64c7856
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/ownerDocument.js
@@ -0,0 +1,2 @@
+import ownerDocument from '@mui/utils/ownerDocument';
+export default ownerDocument;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/ownerWindow.js b/ddb_main/node_modules/@mui/material/utils/ownerWindow.js
new file mode 100644
index 0000000..98716fb
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/ownerWindow.js
@@ -0,0 +1,2 @@
+import ownerWindow from '@mui/utils/ownerWindow';
+export default ownerWindow;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/requirePropFactory.js b/ddb_main/node_modules/@mui/material/utils/requirePropFactory.js
new file mode 100644
index 0000000..f6829ed
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/requirePropFactory.js
@@ -0,0 +1,2 @@
+import requirePropFactory from '@mui/utils/requirePropFactory';
+export default requirePropFactory;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/setRef.js b/ddb_main/node_modules/@mui/material/utils/setRef.js
new file mode 100644
index 0000000..8168603
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/setRef.js
@@ -0,0 +1,2 @@
+import setRef from '@mui/utils/setRef';
+export default setRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/unsupportedProp.js b/ddb_main/node_modules/@mui/material/utils/unsupportedProp.js
new file mode 100644
index 0000000..2dd0ecb
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/unsupportedProp.js
@@ -0,0 +1,2 @@
+import unsupportedProp from '@mui/utils/unsupportedProp';
+export default unsupportedProp;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/useControlled.js b/ddb_main/node_modules/@mui/material/utils/useControlled.js
new file mode 100644
index 0000000..311bb25
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/useControlled.js
@@ -0,0 +1,4 @@
+'use client';
+
+import useControlled from '@mui/utils/useControlled';
+export default useControlled;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/useEnhancedEffect.js b/ddb_main/node_modules/@mui/material/utils/useEnhancedEffect.js
new file mode 100644
index 0000000..29aa1d8
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/useEnhancedEffect.js
@@ -0,0 +1,4 @@
+'use client';
+
+import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
+export default useEnhancedEffect;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/useEventCallback.js b/ddb_main/node_modules/@mui/material/utils/useEventCallback.js
new file mode 100644
index 0000000..7f13ea0
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/useEventCallback.js
@@ -0,0 +1,4 @@
+'use client';
+
+import useEventCallback from '@mui/utils/useEventCallback';
+export default useEventCallback;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/useForkRef.js b/ddb_main/node_modules/@mui/material/utils/useForkRef.js
new file mode 100644
index 0000000..b3608f9
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/useForkRef.js
@@ -0,0 +1,4 @@
+'use client';
+
+import useForkRef from '@mui/utils/useForkRef';
+export default useForkRef;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/useId.js b/ddb_main/node_modules/@mui/material/utils/useId.js
new file mode 100644
index 0000000..2329b39
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/useId.js
@@ -0,0 +1,4 @@
+'use client';
+
+import useId from '@mui/utils/useId';
+export default useId;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/useIsFocusVisible.js b/ddb_main/node_modules/@mui/material/utils/useIsFocusVisible.js
new file mode 100644
index 0000000..4259737
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/useIsFocusVisible.js
@@ -0,0 +1,4 @@
+'use client';
+
+import useIsFocusVisible from '@mui/utils/useIsFocusVisible';
+export default useIsFocusVisible;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/utils/useSlot.js b/ddb_main/node_modules/@mui/material/utils/useSlot.js
new file mode 100644
index 0000000..8160bbc
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/utils/useSlot.js
@@ -0,0 +1,82 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className", "elementType", "ownerState", "externalForwardedProps", "getSlotOwnerState", "internalForwardedProps"],
+  _excluded2 = ["component", "slots", "slotProps"],
+  _excluded3 = ["component"];
+import useForkRef from '@mui/utils/useForkRef';
+import { appendOwnerState, resolveComponentProps, mergeSlotProps } from '@mui/base/utils';
+/**
+ * An internal function to create a Material UI slot.
+ *
+ * This is an advanced version of Base UI `useSlotProps` because Material UI allows leaf component to be customized via `component` prop
+ * while Base UI does not need to support leaf component customization.
+ *
+ * @param {string} name: name of the slot
+ * @param {object} parameters
+ * @returns {[Slot, slotProps]} The slot's React component and the slot's props
+ *
+ * Note: the returned slot's props
+ * - will never contain `component` prop.
+ * - might contain `as` prop.
+ */
+export default function useSlot(
+/**
+ * The slot's name. All Material UI components should have `root` slot.
+ *
+ * If the name is `root`, the logic behaves differently from other slots,
+ * e.g. the `externalForwardedProps` are spread to `root` slot but not other slots.
+ */
+name, parameters) {
+  const {
+      className,
+      elementType: initialElementType,
+      ownerState,
+      externalForwardedProps,
+      getSlotOwnerState,
+      internalForwardedProps
+    } = parameters,
+    useSlotPropsParams = _objectWithoutPropertiesLoose(parameters, _excluded);
+  const {
+      component: rootComponent,
+      slots = {
+        [name]: undefined
+      },
+      slotProps = {
+        [name]: undefined
+      }
+    } = externalForwardedProps,
+    other = _objectWithoutPropertiesLoose(externalForwardedProps, _excluded2);
+  const elementType = slots[name] || initialElementType;
+
+  // `slotProps[name]` can be a callback that receives the component's ownerState.
+  // `resolvedComponentsProps` is always a plain object.
+  const resolvedComponentsProps = resolveComponentProps(slotProps[name], ownerState);
+  const _mergeSlotProps = mergeSlotProps(_extends({
+      className
+    }, useSlotPropsParams, {
+      externalForwardedProps: name === 'root' ? other : undefined,
+      externalSlotProps: resolvedComponentsProps
+    })),
+    {
+      props: {
+        component: slotComponent
+      },
+      internalRef
+    } = _mergeSlotProps,
+    mergedProps = _objectWithoutPropertiesLoose(_mergeSlotProps.props, _excluded3);
+  const ref = useForkRef(internalRef, resolvedComponentsProps == null ? void 0 : resolvedComponentsProps.ref, parameters.ref);
+  const slotOwnerState = getSlotOwnerState ? getSlotOwnerState(mergedProps) : {};
+  const finalOwnerState = _extends({}, ownerState, slotOwnerState);
+  const LeafComponent = name === 'root' ? slotComponent || rootComponent : slotComponent;
+  const props = appendOwnerState(elementType, _extends({}, name === 'root' && !rootComponent && !slots[name] && internalForwardedProps, name !== 'root' && !slots[name] && internalForwardedProps, mergedProps, LeafComponent && {
+    as: LeafComponent
+  }, {
+    ref
+  }), finalOwnerState);
+  Object.keys(slotOwnerState).forEach(propName => {
+    delete props[propName];
+  });
+  return [elementType, props];
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/material/zero-styled/index.js b/ddb_main/node_modules/@mui/material/zero-styled/index.js
new file mode 100644
index 0000000..ee123a9
--- /dev/null
+++ b/ddb_main/node_modules/@mui/material/zero-styled/index.js
@@ -0,0 +1,7 @@
+import useThemeProps from '../styles/useThemeProps';
+export { default as styled } from '../styles/styled';
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export function createUseThemeProps(name) {
+  return useThemeProps;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/private-theming/ThemeProvider/ThemeProvider.js b/ddb_main/node_modules/@mui/private-theming/ThemeProvider/ThemeProvider.js
new file mode 100644
index 0000000..db7f7c0
--- /dev/null
+++ b/ddb_main/node_modules/@mui/private-theming/ThemeProvider/ThemeProvider.js
@@ -0,0 +1,65 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { exactProp } from '@mui/utils';
+import ThemeContext from '../useTheme/ThemeContext';
+import useTheme from '../useTheme';
+import nested from './nested';
+
+// To support composition of theme.
+import { jsx as _jsx } from "react/jsx-runtime";
+function mergeOuterLocalTheme(outerTheme, localTheme) {
+  if (typeof localTheme === 'function') {
+    const mergedTheme = localTheme(outerTheme);
+    if (process.env.NODE_ENV !== 'production') {
+      if (!mergedTheme) {
+        console.error(['MUI: You should return an object from your theme function, i.e.', '<ThemeProvider theme={() => ({})} />'].join('\n'));
+      }
+    }
+    return mergedTheme;
+  }
+  return _extends({}, outerTheme, localTheme);
+}
+
+/**
+ * This component takes a `theme` prop.
+ * It makes the `theme` available down the React tree thanks to React context.
+ * This component should preferably be used at **the root of your component tree**.
+ */
+function ThemeProvider(props) {
+  const {
+    children,
+    theme: localTheme
+  } = props;
+  const outerTheme = useTheme();
+  if (process.env.NODE_ENV !== 'production') {
+    if (outerTheme === null && typeof localTheme === 'function') {
+      console.error(['MUI: You are providing a theme function prop to the ThemeProvider component:', '<ThemeProvider theme={outerTheme => outerTheme} />', '', 'However, no outer theme is present.', 'Make sure a theme is already injected higher in the React tree ' + 'or provide a theme object.'].join('\n'));
+    }
+  }
+  const theme = React.useMemo(() => {
+    const output = outerTheme === null ? localTheme : mergeOuterLocalTheme(outerTheme, localTheme);
+    if (output != null) {
+      output[nested] = outerTheme !== null;
+    }
+    return output;
+  }, [localTheme, outerTheme]);
+  return /*#__PURE__*/_jsx(ThemeContext.Provider, {
+    value: theme,
+    children: children
+  });
+}
+process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes = {
+  /**
+   * Your component tree.
+   */
+  children: PropTypes.node,
+  /**
+   * A theme object. You can provide a function to extend the outer theme.
+   */
+  theme: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).isRequired
+} : void 0;
+if (process.env.NODE_ENV !== 'production') {
+  process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes = exactProp(ThemeProvider.propTypes) : void 0;
+}
+export default ThemeProvider;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/private-theming/ThemeProvider/nested.js b/ddb_main/node_modules/@mui/private-theming/ThemeProvider/nested.js
new file mode 100644
index 0000000..4227926
--- /dev/null
+++ b/ddb_main/node_modules/@mui/private-theming/ThemeProvider/nested.js
@@ -0,0 +1,2 @@
+const hasSymbol = typeof Symbol === 'function' && Symbol.for;
+export default hasSymbol ? Symbol.for('mui.nested') : '__THEME_NESTED__';
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/private-theming/useTheme/ThemeContext.js b/ddb_main/node_modules/@mui/private-theming/useTheme/ThemeContext.js
new file mode 100644
index 0000000..081ef11
--- /dev/null
+++ b/ddb_main/node_modules/@mui/private-theming/useTheme/ThemeContext.js
@@ -0,0 +1,6 @@
+import * as React from 'react';
+const ThemeContext = /*#__PURE__*/React.createContext(null);
+if (process.env.NODE_ENV !== 'production') {
+  ThemeContext.displayName = 'ThemeContext';
+}
+export default ThemeContext;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/private-theming/useTheme/useTheme.js b/ddb_main/node_modules/@mui/private-theming/useTheme/useTheme.js
new file mode 100644
index 0000000..1cce08c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/private-theming/useTheme/useTheme.js
@@ -0,0 +1,10 @@
+import * as React from 'react';
+import ThemeContext from './ThemeContext';
+export default function useTheme() {
+  const theme = React.useContext(ThemeContext);
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useDebugValue(theme);
+  }
+  return theme;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/styled-engine/GlobalStyles/GlobalStyles.js b/ddb_main/node_modules/@mui/styled-engine/GlobalStyles/GlobalStyles.js
new file mode 100644
index 0000000..eac13af
--- /dev/null
+++ b/ddb_main/node_modules/@mui/styled-engine/GlobalStyles/GlobalStyles.js
@@ -0,0 +1,23 @@
+'use client';
+
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { Global } from '@emotion/react';
+import { jsx as _jsx } from "react/jsx-runtime";
+function isEmpty(obj) {
+  return obj === undefined || obj === null || Object.keys(obj).length === 0;
+}
+export default function GlobalStyles(props) {
+  const {
+    styles,
+    defaultTheme = {}
+  } = props;
+  const globalStyles = typeof styles === 'function' ? themeInput => styles(isEmpty(themeInput) ? defaultTheme : themeInput) : styles;
+  return /*#__PURE__*/_jsx(Global, {
+    styles: globalStyles
+  });
+}
+process.env.NODE_ENV !== "production" ? GlobalStyles.propTypes = {
+  defaultTheme: PropTypes.object,
+  styles: PropTypes.oneOfType([PropTypes.array, PropTypes.string, PropTypes.object, PropTypes.func])
+} : void 0;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/styled-engine/StyledEngineProvider/StyledEngineProvider.js b/ddb_main/node_modules/@mui/styled-engine/StyledEngineProvider/StyledEngineProvider.js
new file mode 100644
index 0000000..2a6dc16
--- /dev/null
+++ b/ddb_main/node_modules/@mui/styled-engine/StyledEngineProvider/StyledEngineProvider.js
@@ -0,0 +1,39 @@
+'use client';
+
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { CacheProvider } from '@emotion/react';
+import createCache from '@emotion/cache';
+
+// prepend: true moves MUI styles to the top of the <head> so they're loaded first.
+// It allows developers to easily override MUI styles with other styling solutions, like CSS modules.
+import { jsx as _jsx } from "react/jsx-runtime";
+let cache;
+if (typeof document === 'object') {
+  cache = createCache({
+    key: 'css',
+    prepend: true
+  });
+}
+export default function StyledEngineProvider(props) {
+  const {
+    injectFirst,
+    children
+  } = props;
+  return injectFirst && cache ? /*#__PURE__*/_jsx(CacheProvider, {
+    value: cache,
+    children: children
+  }) : children;
+}
+process.env.NODE_ENV !== "production" ? StyledEngineProvider.propTypes = {
+  /**
+   * Your component tree.
+   */
+  children: PropTypes.node,
+  /**
+   * By default, the styles are injected last in the <head> element of the page.
+   * As a result, they gain more specificity than any other style sheet.
+   * If you want to override MUI's styles, set this prop.
+   */
+  injectFirst: PropTypes.bool
+} : void 0;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/styled-engine/index.js b/ddb_main/node_modules/@mui/styled-engine/index.js
new file mode 100644
index 0000000..e4ec0bd
--- /dev/null
+++ b/ddb_main/node_modules/@mui/styled-engine/index.js
@@ -0,0 +1,38 @@
+/**
+ * @mui/styled-engine v5.15.14
+ *
+ * @license MIT
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use client';
+
+/* eslint-disable no-underscore-dangle */
+import emStyled from '@emotion/styled';
+export default function styled(tag, options) {
+  const stylesFactory = emStyled(tag, options);
+  if (process.env.NODE_ENV !== 'production') {
+    return (...styles) => {
+      const component = typeof tag === 'string' ? `"${tag}"` : 'component';
+      if (styles.length === 0) {
+        console.error([`MUI: Seems like you called \`styled(${component})()\` without a \`style\` argument.`, 'You must provide a `styles` argument: `styled("div")(styleYouForgotToPass)`.'].join('\n'));
+      } else if (styles.some(style => style === undefined)) {
+        console.error(`MUI: the styled(${component})(...args) API requires all its args to be defined.`);
+      }
+      return stylesFactory(...styles);
+    };
+  }
+  return stylesFactory;
+}
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+export const internal_processStyles = (tag, processor) => {
+  // Emotion attaches all the styles as `__emotion_styles`.
+  // Ref: https://github.com/emotion-js/emotion/blob/16d971d0da229596d6bcc39d282ba9753c9ee7cf/packages/styled/src/base.js#L186
+  if (Array.isArray(tag.__emotion_styles)) {
+    tag.__emotion_styles = processor(tag.__emotion_styles);
+  }
+};
+export { ThemeContext, keyframes, css } from '@emotion/react';
+export { default as StyledEngineProvider } from './StyledEngineProvider';
+export { default as GlobalStyles } from './GlobalStyles';
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/styles/StylesProvider/StylesProvider.js b/ddb_main/node_modules/@mui/styles/StylesProvider/StylesProvider.js
new file mode 100644
index 0000000..63606ed
--- /dev/null
+++ b/ddb_main/node_modules/@mui/styles/StylesProvider/StylesProvider.js
@@ -0,0 +1,151 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["children", "injectFirst", "disableGeneration"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { exactProp } from '@mui/utils';
+import { create } from 'jss';
+import createGenerateClassName from '../createGenerateClassName';
+import jssPreset from '../jssPreset';
+
+// Default JSS instance.
+import { jsx as _jsx } from "react/jsx-runtime";
+const defaultJSS = create(jssPreset());
+
+// Use a singleton or the provided one by the context.
+//
+// The counter-based approach doesn't tolerate any mistake.
+// It's much safer to use the same counter everywhere.
+const defaultGenerateClassName = createGenerateClassName();
+const defaultSheetsManager = new Map();
+// Exported for test purposes
+export { defaultSheetsManager as sheetsManager };
+const defaultOptions = {
+  disableGeneration: false,
+  generateClassName: defaultGenerateClassName,
+  jss: defaultJSS,
+  sheetsCache: null,
+  sheetsManager: defaultSheetsManager,
+  sheetsRegistry: null
+};
+export const StylesContext = /*#__PURE__*/React.createContext(defaultOptions);
+if (process.env.NODE_ENV !== 'production') {
+  StylesContext.displayName = 'StylesContext';
+}
+let injectFirstNode;
+export default function StylesProvider(props) {
+  const {
+      children,
+      injectFirst = false,
+      disableGeneration = false
+    } = props,
+    localOptions = _objectWithoutPropertiesLoose(props, _excluded);
+  const outerOptions = React.useContext(StylesContext);
+  const {
+    generateClassName,
+    jss,
+    serverGenerateClassName,
+    sheetsCache,
+    sheetsManager,
+    sheetsRegistry
+  } = _extends({}, outerOptions, localOptions);
+  if (process.env.NODE_ENV !== 'production') {
+    if (injectFirst && localOptions.jss) {
+      console.error('MUI: You cannot use the jss and injectFirst props at the same time.');
+    }
+  }
+  const value = React.useMemo(() => {
+    const context = {
+      disableGeneration,
+      generateClassName,
+      jss,
+      serverGenerateClassName,
+      sheetsCache,
+      sheetsManager,
+      sheetsRegistry
+    };
+    if (process.env.NODE_ENV !== 'production') {
+      if (typeof window === 'undefined' && !context.sheetsManager) {
+        console.error('MUI: You need to use the ServerStyleSheets API when rendering on the server.');
+      }
+    }
+    if (process.env.NODE_ENV !== 'production') {
+      if (context.jss.options.insertionPoint && injectFirst) {
+        console.error('MUI: You cannot use a custom insertionPoint and <StylesContext injectFirst> at the same time.');
+      }
+    }
+    if (!context.jss.options.insertionPoint && injectFirst && typeof window !== 'undefined') {
+      if (!injectFirstNode) {
+        const head = document.head;
+        injectFirstNode = document.createComment('mui-inject-first');
+        head.insertBefore(injectFirstNode, head.firstChild);
+      }
+      context.jss = create({
+        plugins: jssPreset().plugins,
+        insertionPoint: injectFirstNode
+      });
+    }
+    return context;
+  }, [injectFirst, disableGeneration, generateClassName, jss, serverGenerateClassName, sheetsCache, sheetsManager, sheetsRegistry]);
+  return /*#__PURE__*/_jsx(StylesContext.Provider, {
+    value: value,
+    children: children
+  });
+}
+process.env.NODE_ENV !== "production" ? StylesProvider.propTypes = {
+  /**
+   * Your component tree.
+   */
+  children: PropTypes.node,
+  /**
+   * You can disable the generation of the styles with this option.
+   * It can be useful when traversing the React tree outside of the HTML
+   * rendering step on the server.
+   * Let's say you are using react-apollo to extract all
+   * the queries made by the interface server-side - you can significantly speed up the traversal with this prop.
+   */
+  disableGeneration: PropTypes.bool,
+  /**
+   * JSS's class name generator.
+   */
+  generateClassName: PropTypes.func,
+  /**
+   * By default, the styles are injected last in the <head> element of the page.
+   * As a result, they gain more specificity than any other style sheet.
+   * If you want to override MUI's styles, set this prop.
+   */
+  injectFirst: PropTypes.bool,
+  /**
+   * JSS's instance.
+   */
+  jss: PropTypes.object,
+  /**
+   * @ignore
+   */
+  serverGenerateClassName: PropTypes.func,
+  /**
+   * @ignore
+   *
+   * Beta feature.
+   *
+   * Cache for the sheets.
+   */
+  sheetsCache: PropTypes.object,
+  /**
+   * @ignore
+   *
+   * The sheetsManager is used to deduplicate style sheet injection in the page.
+   * It's deduplicating using the (theme, styles) couple.
+   * On the server, you should provide a new instance for each request.
+   */
+  sheetsManager: PropTypes.object,
+  /**
+   * @ignore
+   *
+   * Collect the sheets.
+   */
+  sheetsRegistry: PropTypes.object
+} : void 0;
+if (process.env.NODE_ENV !== 'production') {
+  process.env.NODE_ENV !== "production" ? StylesProvider.propTypes = exactProp(StylesProvider.propTypes) : void 0;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/styles/createGenerateClassName/createGenerateClassName.js b/ddb_main/node_modules/@mui/styles/createGenerateClassName/createGenerateClassName.js
new file mode 100644
index 0000000..e0c0c88
--- /dev/null
+++ b/ddb_main/node_modules/@mui/styles/createGenerateClassName/createGenerateClassName.js
@@ -0,0 +1,63 @@
+import { unstable_nested as nested } from '@mui/private-theming/ThemeProvider';
+
+/**
+ * This is the list of the style rule name we use as drop in replacement for the built-in
+ * pseudo classes (:checked, :disabled, :focused, etc.).
+ *
+ * Why do they exist in the first place?
+ * These classes are used at a specificity of 2.
+ * It allows them to override previously defined styles as well as
+ * being untouched by simple user overrides.
+ */
+const stateClasses = ['checked', 'disabled', 'error', 'focused', 'focusVisible', 'required', 'expanded', 'selected'];
+
+// Returns a function which generates unique class names based on counters.
+// When new generator function is created, rule counter is reset.
+// We need to reset the rule counter for SSR for each request.
+//
+// It's inspired by
+// https://github.com/cssinjs/jss/blob/4e6a05dd3f7b6572fdd3ab216861d9e446c20331/src/utils/createGenerateClassName.js
+export default function createGenerateClassName(options = {}) {
+  const {
+    disableGlobal = false,
+    productionPrefix = 'jss',
+    seed = ''
+  } = options;
+  const seedPrefix = seed === '' ? '' : `${seed}-`;
+  let ruleCounter = 0;
+  const getNextCounterId = () => {
+    ruleCounter += 1;
+    if (process.env.NODE_ENV !== 'production') {
+      if (ruleCounter >= 1e10) {
+        console.warn(['MUI: You might have a memory leak.', 'The ruleCounter is not supposed to grow that much.'].join(''));
+      }
+    }
+    return ruleCounter;
+  };
+  return (rule, styleSheet) => {
+    const name = styleSheet.options.name;
+
+    // Is a global static MUI style?
+    if (name && name.indexOf('Mui') === 0 && !styleSheet.options.link && !disableGlobal) {
+      // We can use a shorthand class name, we never use the keys to style the components.
+      if (stateClasses.indexOf(rule.key) !== -1) {
+        return `Mui-${rule.key}`;
+      }
+      const prefix = `${seedPrefix}${name}-${rule.key}`;
+      if (!styleSheet.options.theme[nested] || seed !== '') {
+        return prefix;
+      }
+      return `${prefix}-${getNextCounterId()}`;
+    }
+    if (process.env.NODE_ENV === 'production') {
+      return `${seedPrefix}${productionPrefix}${getNextCounterId()}`;
+    }
+    const suffix = `${rule.key}-${getNextCounterId()}`;
+
+    // Help with debuggability.
+    if (styleSheet.options.classNamePrefix) {
+      return `${seedPrefix}${styleSheet.options.classNamePrefix}-${suffix}`;
+    }
+    return `${seedPrefix}${suffix}`;
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/styles/jssPreset/jssPreset.js b/ddb_main/node_modules/@mui/styles/jssPreset/jssPreset.js
new file mode 100644
index 0000000..2d1d8c5
--- /dev/null
+++ b/ddb_main/node_modules/@mui/styles/jssPreset/jssPreset.js
@@ -0,0 +1,18 @@
+import functions from 'jss-plugin-rule-value-function';
+import global from 'jss-plugin-global';
+import nested from 'jss-plugin-nested';
+import camelCase from 'jss-plugin-camel-case';
+import defaultUnit from 'jss-plugin-default-unit';
+import vendorPrefixer from 'jss-plugin-vendor-prefixer';
+import propsSort from 'jss-plugin-props-sort';
+
+// Subset of jss-preset-default with only the plugins the MUI components are using.
+export default function jssPreset() {
+  return {
+    plugins: [functions(), global(), nested(), camelCase(), defaultUnit(),
+    // Disable the vendor prefixer server-side, it does nothing.
+    // This way, we can get a performance boost.
+    // In the documentation, we are using `autoprefixer` to solve this problem.
+    typeof window === 'undefined' ? null : vendorPrefixer(), propsSort()]
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/colorManipulator.js b/ddb_main/node_modules/@mui/system/colorManipulator.js
new file mode 100644
index 0000000..38d41e7
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/colorManipulator.js
@@ -0,0 +1,372 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.alpha = alpha;
+exports.blend = blend;
+exports.colorChannel = void 0;
+exports.darken = darken;
+exports.decomposeColor = decomposeColor;
+exports.emphasize = emphasize;
+exports.getContrastRatio = getContrastRatio;
+exports.getLuminance = getLuminance;
+exports.hexToRgb = hexToRgb;
+exports.hslToRgb = hslToRgb;
+exports.lighten = lighten;
+exports.private_safeAlpha = private_safeAlpha;
+exports.private_safeColorChannel = void 0;
+exports.private_safeDarken = private_safeDarken;
+exports.private_safeEmphasize = private_safeEmphasize;
+exports.private_safeLighten = private_safeLighten;
+exports.recomposeColor = recomposeColor;
+exports.rgbToHex = rgbToHex;
+var _formatMuiErrorMessage2 = _interopRequireDefault(require("@mui/utils/formatMuiErrorMessage"));
+var _clamp = _interopRequireDefault(require("@mui/utils/clamp"));
+/* eslint-disable @typescript-eslint/naming-convention */
+
+/**
+ * Returns a number whose value is limited to the given range.
+ * @param {number} value The value to be clamped
+ * @param {number} min The lower boundary of the output range
+ * @param {number} max The upper boundary of the output range
+ * @returns {number} A number in the range [min, max]
+ */
+function clampWrapper(value, min = 0, max = 1) {
+  if (process.env.NODE_ENV !== 'production') {
+    if (value < min || value > max) {
+      console.error(`MUI: The value provided ${value} is out of range [${min}, ${max}].`);
+    }
+  }
+  return (0, _clamp.default)(value, min, max);
+}
+
+/**
+ * Converts a color from CSS hex format to CSS rgb format.
+ * @param {string} color - Hex color, i.e. #nnn or #nnnnnn
+ * @returns {string} A CSS rgb color string
+ */
+function hexToRgb(color) {
+  color = color.slice(1);
+  const re = new RegExp(`.{1,${color.length >= 6 ? 2 : 1}}`, 'g');
+  let colors = color.match(re);
+  if (colors && colors[0].length === 1) {
+    colors = colors.map(n => n + n);
+  }
+  return colors ? `rgb${colors.length === 4 ? 'a' : ''}(${colors.map((n, index) => {
+    return index < 3 ? parseInt(n, 16) : Math.round(parseInt(n, 16) / 255 * 1000) / 1000;
+  }).join(', ')})` : '';
+}
+function intToHex(int) {
+  const hex = int.toString(16);
+  return hex.length === 1 ? `0${hex}` : hex;
+}
+
+/**
+ * Returns an object with the type and values of a color.
+ *
+ * Note: Does not support rgb % values.
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @returns {object} - A MUI color object: {type: string, values: number[]}
+ */
+function decomposeColor(color) {
+  // Idempotent
+  if (color.type) {
+    return color;
+  }
+  if (color.charAt(0) === '#') {
+    return decomposeColor(hexToRgb(color));
+  }
+  const marker = color.indexOf('(');
+  const type = color.substring(0, marker);
+  if (['rgb', 'rgba', 'hsl', 'hsla', 'color'].indexOf(type) === -1) {
+    throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Unsupported \`${color}\` color.
+The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().` : (0, _formatMuiErrorMessage2.default)(9, color));
+  }
+  let values = color.substring(marker + 1, color.length - 1);
+  let colorSpace;
+  if (type === 'color') {
+    values = values.split(' ');
+    colorSpace = values.shift();
+    if (values.length === 4 && values[3].charAt(0) === '/') {
+      values[3] = values[3].slice(1);
+    }
+    if (['srgb', 'display-p3', 'a98-rgb', 'prophoto-rgb', 'rec-2020'].indexOf(colorSpace) === -1) {
+      throw new Error(process.env.NODE_ENV !== "production" ? `MUI: unsupported \`${colorSpace}\` color space.
+The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.` : (0, _formatMuiErrorMessage2.default)(10, colorSpace));
+    }
+  } else {
+    values = values.split(',');
+  }
+  values = values.map(value => parseFloat(value));
+  return {
+    type,
+    values,
+    colorSpace
+  };
+}
+
+/**
+ * Returns a channel created from the input color.
+ *
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @returns {string} - The channel for the color, that can be used in rgba or hsla colors
+ */
+const colorChannel = color => {
+  const decomposedColor = decomposeColor(color);
+  return decomposedColor.values.slice(0, 3).map((val, idx) => decomposedColor.type.indexOf('hsl') !== -1 && idx !== 0 ? `${val}%` : val).join(' ');
+};
+exports.colorChannel = colorChannel;
+const private_safeColorChannel = (color, warning) => {
+  try {
+    return colorChannel(color);
+  } catch (error) {
+    if (warning && process.env.NODE_ENV !== 'production') {
+      console.warn(warning);
+    }
+    return color;
+  }
+};
+
+/**
+ * Converts a color object with type and values to a string.
+ * @param {object} color - Decomposed color
+ * @param {string} color.type - One of: 'rgb', 'rgba', 'hsl', 'hsla', 'color'
+ * @param {array} color.values - [n,n,n] or [n,n,n,n]
+ * @returns {string} A CSS color string
+ */
+exports.private_safeColorChannel = private_safeColorChannel;
+function recomposeColor(color) {
+  const {
+    type,
+    colorSpace
+  } = color;
+  let {
+    values
+  } = color;
+  if (type.indexOf('rgb') !== -1) {
+    // Only convert the first 3 values to int (i.e. not alpha)
+    values = values.map((n, i) => i < 3 ? parseInt(n, 10) : n);
+  } else if (type.indexOf('hsl') !== -1) {
+    values[1] = `${values[1]}%`;
+    values[2] = `${values[2]}%`;
+  }
+  if (type.indexOf('color') !== -1) {
+    values = `${colorSpace} ${values.join(' ')}`;
+  } else {
+    values = `${values.join(', ')}`;
+  }
+  return `${type}(${values})`;
+}
+
+/**
+ * Converts a color from CSS rgb format to CSS hex format.
+ * @param {string} color - RGB color, i.e. rgb(n, n, n)
+ * @returns {string} A CSS rgb color string, i.e. #nnnnnn
+ */
+function rgbToHex(color) {
+  // Idempotent
+  if (color.indexOf('#') === 0) {
+    return color;
+  }
+  const {
+    values
+  } = decomposeColor(color);
+  return `#${values.map((n, i) => intToHex(i === 3 ? Math.round(255 * n) : n)).join('')}`;
+}
+
+/**
+ * Converts a color from hsl format to rgb format.
+ * @param {string} color - HSL color values
+ * @returns {string} rgb color values
+ */
+function hslToRgb(color) {
+  color = decomposeColor(color);
+  const {
+    values
+  } = color;
+  const h = values[0];
+  const s = values[1] / 100;
+  const l = values[2] / 100;
+  const a = s * Math.min(l, 1 - l);
+  const f = (n, k = (n + h / 30) % 12) => l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+  let type = 'rgb';
+  const rgb = [Math.round(f(0) * 255), Math.round(f(8) * 255), Math.round(f(4) * 255)];
+  if (color.type === 'hsla') {
+    type += 'a';
+    rgb.push(values[3]);
+  }
+  return recomposeColor({
+    type,
+    values: rgb
+  });
+}
+/**
+ * The relative brightness of any point in a color space,
+ * normalized to 0 for darkest black and 1 for lightest white.
+ *
+ * Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @returns {number} The relative brightness of the color in the range 0 - 1
+ */
+function getLuminance(color) {
+  color = decomposeColor(color);
+  let rgb = color.type === 'hsl' || color.type === 'hsla' ? decomposeColor(hslToRgb(color)).values : color.values;
+  rgb = rgb.map(val => {
+    if (color.type !== 'color') {
+      val /= 255; // normalized
+    }
+    return val <= 0.03928 ? val / 12.92 : ((val + 0.055) / 1.055) ** 2.4;
+  });
+
+  // Truncate at 3 digits
+  return Number((0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]).toFixed(3));
+}
+
+/**
+ * Calculates the contrast ratio between two colors.
+ *
+ * Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ * @param {string} foreground - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
+ * @param {string} background - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
+ * @returns {number} A contrast ratio value in the range 0 - 21.
+ */
+function getContrastRatio(foreground, background) {
+  const lumA = getLuminance(foreground);
+  const lumB = getLuminance(background);
+  return (Math.max(lumA, lumB) + 0.05) / (Math.min(lumA, lumB) + 0.05);
+}
+
+/**
+ * Sets the absolute transparency of a color.
+ * Any existing alpha values are overwritten.
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @param {number} value - value to set the alpha channel to in the range 0 - 1
+ * @returns {string} A CSS color string. Hex input values are returned as rgb
+ */
+function alpha(color, value) {
+  color = decomposeColor(color);
+  value = clampWrapper(value);
+  if (color.type === 'rgb' || color.type === 'hsl') {
+    color.type += 'a';
+  }
+  if (color.type === 'color') {
+    color.values[3] = `/${value}`;
+  } else {
+    color.values[3] = value;
+  }
+  return recomposeColor(color);
+}
+function private_safeAlpha(color, value, warning) {
+  try {
+    return alpha(color, value);
+  } catch (error) {
+    if (warning && process.env.NODE_ENV !== 'production') {
+      console.warn(warning);
+    }
+    return color;
+  }
+}
+
+/**
+ * Darkens a color.
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @param {number} coefficient - multiplier in the range 0 - 1
+ * @returns {string} A CSS color string. Hex input values are returned as rgb
+ */
+function darken(color, coefficient) {
+  color = decomposeColor(color);
+  coefficient = clampWrapper(coefficient);
+  if (color.type.indexOf('hsl') !== -1) {
+    color.values[2] *= 1 - coefficient;
+  } else if (color.type.indexOf('rgb') !== -1 || color.type.indexOf('color') !== -1) {
+    for (let i = 0; i < 3; i += 1) {
+      color.values[i] *= 1 - coefficient;
+    }
+  }
+  return recomposeColor(color);
+}
+function private_safeDarken(color, coefficient, warning) {
+  try {
+    return darken(color, coefficient);
+  } catch (error) {
+    if (warning && process.env.NODE_ENV !== 'production') {
+      console.warn(warning);
+    }
+    return color;
+  }
+}
+
+/**
+ * Lightens a color.
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @param {number} coefficient - multiplier in the range 0 - 1
+ * @returns {string} A CSS color string. Hex input values are returned as rgb
+ */
+function lighten(color, coefficient) {
+  color = decomposeColor(color);
+  coefficient = clampWrapper(coefficient);
+  if (color.type.indexOf('hsl') !== -1) {
+    color.values[2] += (100 - color.values[2]) * coefficient;
+  } else if (color.type.indexOf('rgb') !== -1) {
+    for (let i = 0; i < 3; i += 1) {
+      color.values[i] += (255 - color.values[i]) * coefficient;
+    }
+  } else if (color.type.indexOf('color') !== -1) {
+    for (let i = 0; i < 3; i += 1) {
+      color.values[i] += (1 - color.values[i]) * coefficient;
+    }
+  }
+  return recomposeColor(color);
+}
+function private_safeLighten(color, coefficient, warning) {
+  try {
+    return lighten(color, coefficient);
+  } catch (error) {
+    if (warning && process.env.NODE_ENV !== 'production') {
+      console.warn(warning);
+    }
+    return color;
+  }
+}
+
+/**
+ * Darken or lighten a color, depending on its luminance.
+ * Light colors are darkened, dark colors are lightened.
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @param {number} coefficient=0.15 - multiplier in the range 0 - 1
+ * @returns {string} A CSS color string. Hex input values are returned as rgb
+ */
+function emphasize(color, coefficient = 0.15) {
+  return getLuminance(color) > 0.5 ? darken(color, coefficient) : lighten(color, coefficient);
+}
+function private_safeEmphasize(color, coefficient, warning) {
+  try {
+    return emphasize(color, coefficient);
+  } catch (error) {
+    if (warning && process.env.NODE_ENV !== 'production') {
+      console.warn(warning);
+    }
+    return color;
+  }
+}
+
+/**
+ * Blend a transparent overlay color with a background color, resulting in a single
+ * RGB color.
+ * @param {string} background - CSS color
+ * @param {string} overlay - CSS color
+ * @param {number} opacity - Opacity multiplier in the range 0 - 1
+ * @param {number} [gamma=1.0] - Gamma correction factor. For gamma-correct blending, 2.2 is usual.
+ */
+function blend(background, overlay, opacity, gamma = 1.0) {
+  const blendChannel = (b, o) => Math.round((b ** (1 / gamma) * (1 - opacity) + o ** (1 / gamma) * opacity) ** gamma);
+  const backgroundColor = decomposeColor(background);
+  const overlayColor = decomposeColor(overlay);
+  const rgb = [blendChannel(backgroundColor.values[0], overlayColor.values[0]), blendChannel(backgroundColor.values[1], overlayColor.values[1]), blendChannel(backgroundColor.values[2], overlayColor.values[2])];
+  return recomposeColor({
+    type: 'rgb',
+    values: rgb
+  });
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/createStyled.js b/ddb_main/node_modules/@mui/system/createStyled.js
new file mode 100644
index 0000000..e3c75b0
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/createStyled.js
@@ -0,0 +1,251 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = createStyled;
+exports.shouldForwardProp = shouldForwardProp;
+exports.systemDefaultTheme = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _styledEngine = _interopRequireWildcard(require("@mui/styled-engine"));
+var _deepmerge = require("@mui/utils/deepmerge");
+var _capitalize = _interopRequireDefault(require("@mui/utils/capitalize"));
+var _getDisplayName = _interopRequireDefault(require("@mui/utils/getDisplayName"));
+var _createTheme = _interopRequireDefault(require("./createTheme"));
+var _styleFunctionSx = _interopRequireDefault(require("./styleFunctionSx"));
+const _excluded = ["ownerState"],
+  _excluded2 = ["variants"],
+  _excluded3 = ["name", "slot", "skipVariantsResolver", "skipSx", "overridesResolver"];
+/* eslint-disable no-underscore-dangle */
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function isEmpty(obj) {
+  return Object.keys(obj).length === 0;
+}
+
+// https://github.com/emotion-js/emotion/blob/26ded6109fcd8ca9875cc2ce4564fee678a3f3c5/packages/styled/src/utils.js#L40
+function isStringTag(tag) {
+  return typeof tag === 'string' &&
+  // 96 is one less than the char code
+  // for "a" so this is checking that
+  // it's a lowercase character
+  tag.charCodeAt(0) > 96;
+}
+
+// Update /system/styled/#api in case if this changes
+function shouldForwardProp(prop) {
+  return prop !== 'ownerState' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';
+}
+const systemDefaultTheme = exports.systemDefaultTheme = (0, _createTheme.default)();
+const lowercaseFirstLetter = string => {
+  if (!string) {
+    return string;
+  }
+  return string.charAt(0).toLowerCase() + string.slice(1);
+};
+function resolveTheme({
+  defaultTheme,
+  theme,
+  themeId
+}) {
+  return isEmpty(theme) ? defaultTheme : theme[themeId] || theme;
+}
+function defaultOverridesResolver(slot) {
+  if (!slot) {
+    return null;
+  }
+  return (props, styles) => styles[slot];
+}
+function processStyleArg(callableStyle, _ref) {
+  let {
+      ownerState
+    } = _ref,
+    props = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
+  const resolvedStylesArg = typeof callableStyle === 'function' ? callableStyle((0, _extends2.default)({
+    ownerState
+  }, props)) : callableStyle;
+  if (Array.isArray(resolvedStylesArg)) {
+    return resolvedStylesArg.flatMap(resolvedStyle => processStyleArg(resolvedStyle, (0, _extends2.default)({
+      ownerState
+    }, props)));
+  }
+  if (!!resolvedStylesArg && typeof resolvedStylesArg === 'object' && Array.isArray(resolvedStylesArg.variants)) {
+    const {
+        variants = []
+      } = resolvedStylesArg,
+      otherStyles = (0, _objectWithoutPropertiesLoose2.default)(resolvedStylesArg, _excluded2);
+    let result = otherStyles;
+    variants.forEach(variant => {
+      let isMatch = true;
+      if (typeof variant.props === 'function') {
+        isMatch = variant.props((0, _extends2.default)({
+          ownerState
+        }, props, ownerState));
+      } else {
+        Object.keys(variant.props).forEach(key => {
+          if ((ownerState == null ? void 0 : ownerState[key]) !== variant.props[key] && props[key] !== variant.props[key]) {
+            isMatch = false;
+          }
+        });
+      }
+      if (isMatch) {
+        if (!Array.isArray(result)) {
+          result = [result];
+        }
+        result.push(typeof variant.style === 'function' ? variant.style((0, _extends2.default)({
+          ownerState
+        }, props, ownerState)) : variant.style);
+      }
+    });
+    return result;
+  }
+  return resolvedStylesArg;
+}
+function createStyled(input = {}) {
+  const {
+    themeId,
+    defaultTheme = systemDefaultTheme,
+    rootShouldForwardProp = shouldForwardProp,
+    slotShouldForwardProp = shouldForwardProp
+  } = input;
+  const systemSx = props => {
+    return (0, _styleFunctionSx.default)((0, _extends2.default)({}, props, {
+      theme: resolveTheme((0, _extends2.default)({}, props, {
+        defaultTheme,
+        themeId
+      }))
+    }));
+  };
+  systemSx.__mui_systemSx = true;
+  return (tag, inputOptions = {}) => {
+    // Filter out the `sx` style function from the previous styled component to prevent unnecessary styles generated by the composite components.
+    (0, _styledEngine.internal_processStyles)(tag, styles => styles.filter(style => !(style != null && style.__mui_systemSx)));
+    const {
+        name: componentName,
+        slot: componentSlot,
+        skipVariantsResolver: inputSkipVariantsResolver,
+        skipSx: inputSkipSx,
+        // TODO v6: remove `lowercaseFirstLetter()` in the next major release
+        // For more details: https://github.com/mui/material-ui/pull/37908
+        overridesResolver = defaultOverridesResolver(lowercaseFirstLetter(componentSlot))
+      } = inputOptions,
+      options = (0, _objectWithoutPropertiesLoose2.default)(inputOptions, _excluded3);
+
+    // if skipVariantsResolver option is defined, take the value, otherwise, true for root and false for other slots.
+    const skipVariantsResolver = inputSkipVariantsResolver !== undefined ? inputSkipVariantsResolver :
+    // TODO v6: remove `Root` in the next major release
+    // For more details: https://github.com/mui/material-ui/pull/37908
+    componentSlot && componentSlot !== 'Root' && componentSlot !== 'root' || false;
+    const skipSx = inputSkipSx || false;
+    let label;
+    if (process.env.NODE_ENV !== 'production') {
+      if (componentName) {
+        // TODO v6: remove `lowercaseFirstLetter()` in the next major release
+        // For more details: https://github.com/mui/material-ui/pull/37908
+        label = `${componentName}-${lowercaseFirstLetter(componentSlot || 'Root')}`;
+      }
+    }
+    let shouldForwardPropOption = shouldForwardProp;
+
+    // TODO v6: remove `Root` in the next major release
+    // For more details: https://github.com/mui/material-ui/pull/37908
+    if (componentSlot === 'Root' || componentSlot === 'root') {
+      shouldForwardPropOption = rootShouldForwardProp;
+    } else if (componentSlot) {
+      // any other slot specified
+      shouldForwardPropOption = slotShouldForwardProp;
+    } else if (isStringTag(tag)) {
+      // for string (html) tag, preserve the behavior in emotion & styled-components.
+      shouldForwardPropOption = undefined;
+    }
+    const defaultStyledResolver = (0, _styledEngine.default)(tag, (0, _extends2.default)({
+      shouldForwardProp: shouldForwardPropOption,
+      label
+    }, options));
+    const transformStyleArg = stylesArg => {
+      // On the server Emotion doesn't use React.forwardRef for creating components, so the created
+      // component stays as a function. This condition makes sure that we do not interpolate functions
+      // which are basically components used as a selectors.
+      if (typeof stylesArg === 'function' && stylesArg.__emotion_real !== stylesArg || (0, _deepmerge.isPlainObject)(stylesArg)) {
+        return props => processStyleArg(stylesArg, (0, _extends2.default)({}, props, {
+          theme: resolveTheme({
+            theme: props.theme,
+            defaultTheme,
+            themeId
+          })
+        }));
+      }
+      return stylesArg;
+    };
+    const muiStyledResolver = (styleArg, ...expressions) => {
+      let transformedStyleArg = transformStyleArg(styleArg);
+      const expressionsWithDefaultTheme = expressions ? expressions.map(transformStyleArg) : [];
+      if (componentName && overridesResolver) {
+        expressionsWithDefaultTheme.push(props => {
+          const theme = resolveTheme((0, _extends2.default)({}, props, {
+            defaultTheme,
+            themeId
+          }));
+          if (!theme.components || !theme.components[componentName] || !theme.components[componentName].styleOverrides) {
+            return null;
+          }
+          const styleOverrides = theme.components[componentName].styleOverrides;
+          const resolvedStyleOverrides = {};
+          // TODO: v7 remove iteration and use `resolveStyleArg(styleOverrides[slot])` directly
+          Object.entries(styleOverrides).forEach(([slotKey, slotStyle]) => {
+            resolvedStyleOverrides[slotKey] = processStyleArg(slotStyle, (0, _extends2.default)({}, props, {
+              theme
+            }));
+          });
+          return overridesResolver(props, resolvedStyleOverrides);
+        });
+      }
+      if (componentName && !skipVariantsResolver) {
+        expressionsWithDefaultTheme.push(props => {
+          var _theme$components;
+          const theme = resolveTheme((0, _extends2.default)({}, props, {
+            defaultTheme,
+            themeId
+          }));
+          const themeVariants = theme == null || (_theme$components = theme.components) == null || (_theme$components = _theme$components[componentName]) == null ? void 0 : _theme$components.variants;
+          return processStyleArg({
+            variants: themeVariants
+          }, (0, _extends2.default)({}, props, {
+            theme
+          }));
+        });
+      }
+      if (!skipSx) {
+        expressionsWithDefaultTheme.push(systemSx);
+      }
+      const numOfCustomFnsApplied = expressionsWithDefaultTheme.length - expressions.length;
+      if (Array.isArray(styleArg) && numOfCustomFnsApplied > 0) {
+        const placeholders = new Array(numOfCustomFnsApplied).fill('');
+        // If the type is array, than we need to add placeholders in the template for the overrides, variants and the sx styles.
+        transformedStyleArg = [...styleArg, ...placeholders];
+        transformedStyleArg.raw = [...styleArg.raw, ...placeholders];
+      }
+      const Component = defaultStyledResolver(transformedStyleArg, ...expressionsWithDefaultTheme);
+      if (process.env.NODE_ENV !== 'production') {
+        let displayName;
+        if (componentName) {
+          displayName = `${componentName}${(0, _capitalize.default)(componentSlot || '')}`;
+        }
+        if (displayName === undefined) {
+          displayName = `Styled(${(0, _getDisplayName.default)(tag)})`;
+        }
+        Component.displayName = displayName;
+      }
+      if (tag.muiName) {
+        Component.muiName = tag.muiName;
+      }
+      return Component;
+    };
+    if (defaultStyledResolver.withConfig) {
+      muiStyledResolver.withConfig = defaultStyledResolver.withConfig;
+    }
+    return muiStyledResolver;
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/GlobalStyles/GlobalStyles.js b/ddb_main/node_modules/@mui/system/esm/GlobalStyles/GlobalStyles.js
new file mode 100644
index 0000000..b261980
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/GlobalStyles/GlobalStyles.js
@@ -0,0 +1,37 @@
+'use client';
+
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { GlobalStyles as MuiGlobalStyles } from '@mui/styled-engine';
+import useTheme from '../useTheme';
+import { jsx as _jsx } from "react/jsx-runtime";
+function GlobalStyles({
+  styles,
+  themeId,
+  defaultTheme = {}
+}) {
+  const upperTheme = useTheme(defaultTheme);
+  const globalStyles = typeof styles === 'function' ? styles(themeId ? upperTheme[themeId] || upperTheme : upperTheme) : styles;
+  return /*#__PURE__*/_jsx(MuiGlobalStyles, {
+    styles: globalStyles
+  });
+}
+process.env.NODE_ENV !== "production" ? GlobalStyles.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  defaultTheme: PropTypes.object,
+  /**
+   * @ignore
+   */
+  styles: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.array, PropTypes.func, PropTypes.number, PropTypes.object, PropTypes.string, PropTypes.bool]),
+  /**
+   * @ignore
+   */
+  themeId: PropTypes.string
+} : void 0;
+export default GlobalStyles;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/RtlProvider/index.js b/ddb_main/node_modules/@mui/system/esm/RtlProvider/index.js
new file mode 100644
index 0000000..9a47d15
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/RtlProvider/index.js
@@ -0,0 +1,25 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["value"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { jsx as _jsx } from "react/jsx-runtime";
+const RtlContext = /*#__PURE__*/React.createContext();
+function RtlProvider(_ref) {
+  let {
+      value
+    } = _ref,
+    props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  return /*#__PURE__*/_jsx(RtlContext.Provider, _extends({
+    value: value != null ? value : true
+  }, props));
+}
+process.env.NODE_ENV !== "production" ? RtlProvider.propTypes = {
+  children: PropTypes.node,
+  value: PropTypes.bool
+} : void 0;
+export const useRtl = () => {
+  const value = React.useContext(RtlContext);
+  return value != null ? value : false;
+};
+export default RtlProvider;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/Stack/createStack.js b/ddb_main/node_modules/@mui/system/esm/Stack/createStack.js
new file mode 100644
index 0000000..78b4ee6
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/Stack/createStack.js
@@ -0,0 +1,173 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["component", "direction", "spacing", "divider", "children", "className", "useFlexGap"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import deepmerge from '@mui/utils/deepmerge';
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import composeClasses from '@mui/utils/composeClasses';
+import systemStyled from '../styled';
+import useThemePropsSystem from '../useThemeProps';
+import { extendSxProp } from '../styleFunctionSx';
+import createTheme from '../createTheme';
+import { handleBreakpoints, mergeBreakpointsInOrder, resolveBreakpointValues } from '../breakpoints';
+import { createUnarySpacing, getValue } from '../spacing';
+import { jsx as _jsx } from "react/jsx-runtime";
+const defaultTheme = createTheme();
+// widening Theme to any so that the consumer can own the theme structure.
+const defaultCreateStyledComponent = systemStyled('div', {
+  name: 'MuiStack',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+});
+function useThemePropsDefault(props) {
+  return useThemePropsSystem({
+    props,
+    name: 'MuiStack',
+    defaultTheme
+  });
+}
+
+/**
+ * Return an array with the separator React element interspersed between
+ * each React node of the input children.
+ *
+ * > joinChildren([1,2,3], 0)
+ * [1,0,2,0,3]
+ */
+function joinChildren(children, separator) {
+  const childrenArray = React.Children.toArray(children).filter(Boolean);
+  return childrenArray.reduce((output, child, index) => {
+    output.push(child);
+    if (index < childrenArray.length - 1) {
+      output.push( /*#__PURE__*/React.cloneElement(separator, {
+        key: `separator-${index}`
+      }));
+    }
+    return output;
+  }, []);
+}
+const getSideFromDirection = direction => {
+  return {
+    row: 'Left',
+    'row-reverse': 'Right',
+    column: 'Top',
+    'column-reverse': 'Bottom'
+  }[direction];
+};
+export const style = ({
+  ownerState,
+  theme
+}) => {
+  let styles = _extends({
+    display: 'flex',
+    flexDirection: 'column'
+  }, handleBreakpoints({
+    theme
+  }, resolveBreakpointValues({
+    values: ownerState.direction,
+    breakpoints: theme.breakpoints.values
+  }), propValue => ({
+    flexDirection: propValue
+  })));
+  if (ownerState.spacing) {
+    const transformer = createUnarySpacing(theme);
+    const base = Object.keys(theme.breakpoints.values).reduce((acc, breakpoint) => {
+      if (typeof ownerState.spacing === 'object' && ownerState.spacing[breakpoint] != null || typeof ownerState.direction === 'object' && ownerState.direction[breakpoint] != null) {
+        acc[breakpoint] = true;
+      }
+      return acc;
+    }, {});
+    const directionValues = resolveBreakpointValues({
+      values: ownerState.direction,
+      base
+    });
+    const spacingValues = resolveBreakpointValues({
+      values: ownerState.spacing,
+      base
+    });
+    if (typeof directionValues === 'object') {
+      Object.keys(directionValues).forEach((breakpoint, index, breakpoints) => {
+        const directionValue = directionValues[breakpoint];
+        if (!directionValue) {
+          const previousDirectionValue = index > 0 ? directionValues[breakpoints[index - 1]] : 'column';
+          directionValues[breakpoint] = previousDirectionValue;
+        }
+      });
+    }
+    const styleFromPropValue = (propValue, breakpoint) => {
+      if (ownerState.useFlexGap) {
+        return {
+          gap: getValue(transformer, propValue)
+        };
+      }
+      return {
+        // The useFlexGap={false} implement relies on each child to give up control of the margin.
+        // We need to reset the margin to avoid double spacing.
+        '& > :not(style):not(style)': {
+          margin: 0
+        },
+        '& > :not(style) ~ :not(style)': {
+          [`margin${getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)}`]: getValue(transformer, propValue)
+        }
+      };
+    };
+    styles = deepmerge(styles, handleBreakpoints({
+      theme
+    }, spacingValues, styleFromPropValue));
+  }
+  styles = mergeBreakpointsInOrder(theme.breakpoints, styles);
+  return styles;
+};
+export default function createStack(options = {}) {
+  const {
+    // This will allow adding custom styled fn (for example for custom sx style function)
+    createStyledComponent = defaultCreateStyledComponent,
+    useThemeProps = useThemePropsDefault,
+    componentName = 'MuiStack'
+  } = options;
+  const useUtilityClasses = () => {
+    const slots = {
+      root: ['root']
+    };
+    return composeClasses(slots, slot => generateUtilityClass(componentName, slot), {});
+  };
+  const StackRoot = createStyledComponent(style);
+  const Stack = /*#__PURE__*/React.forwardRef(function Grid(inProps, ref) {
+    const themeProps = useThemeProps(inProps);
+    const props = extendSxProp(themeProps); // `color` type conflicts with html color attribute.
+    const {
+        component = 'div',
+        direction = 'column',
+        spacing = 0,
+        divider,
+        children,
+        className,
+        useFlexGap = false
+      } = props,
+      other = _objectWithoutPropertiesLoose(props, _excluded);
+    const ownerState = {
+      direction,
+      spacing,
+      useFlexGap
+    };
+    const classes = useUtilityClasses();
+    return /*#__PURE__*/_jsx(StackRoot, _extends({
+      as: component,
+      ownerState: ownerState,
+      ref: ref,
+      className: clsx(classes.root, className)
+    }, other, {
+      children: divider ? joinChildren(children, divider) : children
+    }));
+  });
+  process.env.NODE_ENV !== "production" ? Stack.propTypes /* remove-proptypes */ = {
+    children: PropTypes.node,
+    direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
+    divider: PropTypes.node,
+    spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
+    sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+  } : void 0;
+  return Stack;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/ThemeProvider/ThemeProvider.js b/ddb_main/node_modules/@mui/system/esm/ThemeProvider/ThemeProvider.js
new file mode 100644
index 0000000..96547c7
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/ThemeProvider/ThemeProvider.js
@@ -0,0 +1,89 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { ThemeProvider as MuiThemeProvider, useTheme as usePrivateTheme } from '@mui/private-theming';
+import exactProp from '@mui/utils/exactProp';
+import { ThemeContext as StyledEngineThemeContext } from '@mui/styled-engine';
+import useThemeWithoutDefault from '../useThemeWithoutDefault';
+import RtlProvider from '../RtlProvider';
+import { jsx as _jsx } from "react/jsx-runtime";
+const EMPTY_THEME = {};
+function useThemeScoping(themeId, upperTheme, localTheme, isPrivate = false) {
+  return React.useMemo(() => {
+    const resolvedTheme = themeId ? upperTheme[themeId] || upperTheme : upperTheme;
+    if (typeof localTheme === 'function') {
+      const mergedTheme = localTheme(resolvedTheme);
+      const result = themeId ? _extends({}, upperTheme, {
+        [themeId]: mergedTheme
+      }) : mergedTheme;
+      // must return a function for the private theme to NOT merge with the upper theme.
+      // see the test case "use provided theme from a callback" in ThemeProvider.test.js
+      if (isPrivate) {
+        return () => result;
+      }
+      return result;
+    }
+    return themeId ? _extends({}, upperTheme, {
+      [themeId]: localTheme
+    }) : _extends({}, upperTheme, localTheme);
+  }, [themeId, upperTheme, localTheme, isPrivate]);
+}
+
+/**
+ * This component makes the `theme` available down the React tree.
+ * It should preferably be used at **the root of your component tree**.
+ *
+ * <ThemeProvider theme={theme}> // existing use case
+ * <ThemeProvider theme={{ id: theme }}> // theme scoping
+ */
+function ThemeProvider(props) {
+  const {
+    children,
+    theme: localTheme,
+    themeId
+  } = props;
+  const upperTheme = useThemeWithoutDefault(EMPTY_THEME);
+  const upperPrivateTheme = usePrivateTheme() || EMPTY_THEME;
+  if (process.env.NODE_ENV !== 'production') {
+    if (upperTheme === null && typeof localTheme === 'function' || themeId && upperTheme && !upperTheme[themeId] && typeof localTheme === 'function') {
+      console.error(['MUI: You are providing a theme function prop to the ThemeProvider component:', '<ThemeProvider theme={outerTheme => outerTheme} />', '', 'However, no outer theme is present.', 'Make sure a theme is already injected higher in the React tree ' + 'or provide a theme object.'].join('\n'));
+    }
+  }
+  const engineTheme = useThemeScoping(themeId, upperTheme, localTheme);
+  const privateTheme = useThemeScoping(themeId, upperPrivateTheme, localTheme, true);
+  const rtlValue = engineTheme.direction === 'rtl';
+  return /*#__PURE__*/_jsx(MuiThemeProvider, {
+    theme: privateTheme,
+    children: /*#__PURE__*/_jsx(StyledEngineThemeContext.Provider, {
+      value: engineTheme,
+      children: /*#__PURE__*/_jsx(RtlProvider, {
+        value: rtlValue,
+        children: children
+      })
+    })
+  });
+}
+process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Your component tree.
+   */
+  children: PropTypes.node,
+  /**
+   * A theme object. You can provide a function to extend the outer theme.
+   */
+  theme: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).isRequired,
+  /**
+   * The design system's unique id for getting the corresponded theme when there are multiple design systems.
+   */
+  themeId: PropTypes.string
+} : void 0;
+if (process.env.NODE_ENV !== 'production') {
+  process.env.NODE_ENV !== "production" ? ThemeProvider.propTypes = exactProp(ThemeProvider.propTypes) : void 0;
+}
+export default ThemeProvider;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/borders.js b/ddb_main/node_modules/@mui/system/esm/borders.js
new file mode 100644
index 0000000..f8e8cf4
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/borders.js
@@ -0,0 +1,49 @@
+import responsivePropType from './responsivePropType';
+import style from './style';
+import compose from './compose';
+import { createUnaryUnit, getValue } from './spacing';
+import { handleBreakpoints } from './breakpoints';
+export function borderTransform(value) {
+  if (typeof value !== 'number') {
+    return value;
+  }
+  return `${value}px solid`;
+}
+function createBorderStyle(prop, transform) {
+  return style({
+    prop,
+    themeKey: 'borders',
+    transform
+  });
+}
+export const border = createBorderStyle('border', borderTransform);
+export const borderTop = createBorderStyle('borderTop', borderTransform);
+export const borderRight = createBorderStyle('borderRight', borderTransform);
+export const borderBottom = createBorderStyle('borderBottom', borderTransform);
+export const borderLeft = createBorderStyle('borderLeft', borderTransform);
+export const borderColor = createBorderStyle('borderColor');
+export const borderTopColor = createBorderStyle('borderTopColor');
+export const borderRightColor = createBorderStyle('borderRightColor');
+export const borderBottomColor = createBorderStyle('borderBottomColor');
+export const borderLeftColor = createBorderStyle('borderLeftColor');
+export const outline = createBorderStyle('outline', borderTransform);
+export const outlineColor = createBorderStyle('outlineColor');
+
+// false positive
+// eslint-disable-next-line react/function-component-definition
+export const borderRadius = props => {
+  if (props.borderRadius !== undefined && props.borderRadius !== null) {
+    const transformer = createUnaryUnit(props.theme, 'shape.borderRadius', 4, 'borderRadius');
+    const styleFromPropValue = propValue => ({
+      borderRadius: getValue(transformer, propValue)
+    });
+    return handleBreakpoints(props, props.borderRadius, styleFromPropValue);
+  }
+  return null;
+};
+borderRadius.propTypes = process.env.NODE_ENV !== 'production' ? {
+  borderRadius: responsivePropType
+} : {};
+borderRadius.filterProps = ['borderRadius'];
+const borders = compose(border, borderTop, borderRight, borderBottom, borderLeft, borderColor, borderTopColor, borderRightColor, borderBottomColor, borderLeftColor, borderRadius, outline, outlineColor);
+export default borders;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/breakpoints.js b/ddb_main/node_modules/@mui/system/esm/breakpoints.js
new file mode 100644
index 0000000..c31ed05
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/breakpoints.js
@@ -0,0 +1,153 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import PropTypes from 'prop-types';
+import deepmerge from '@mui/utils/deepmerge';
+import merge from './merge';
+
+// The breakpoint **start** at this value.
+// For instance with the first breakpoint xs: [xs, sm[.
+export const values = {
+  xs: 0,
+  // phone
+  sm: 600,
+  // tablet
+  md: 900,
+  // small laptop
+  lg: 1200,
+  // desktop
+  xl: 1536 // large screen
+};
+const defaultBreakpoints = {
+  // Sorted ASC by size. That's important.
+  // It can't be configured as it's used statically for propTypes.
+  keys: ['xs', 'sm', 'md', 'lg', 'xl'],
+  up: key => `@media (min-width:${values[key]}px)`
+};
+export function handleBreakpoints(props, propValue, styleFromPropValue) {
+  const theme = props.theme || {};
+  if (Array.isArray(propValue)) {
+    const themeBreakpoints = theme.breakpoints || defaultBreakpoints;
+    return propValue.reduce((acc, item, index) => {
+      acc[themeBreakpoints.up(themeBreakpoints.keys[index])] = styleFromPropValue(propValue[index]);
+      return acc;
+    }, {});
+  }
+  if (typeof propValue === 'object') {
+    const themeBreakpoints = theme.breakpoints || defaultBreakpoints;
+    return Object.keys(propValue).reduce((acc, breakpoint) => {
+      // key is breakpoint
+      if (Object.keys(themeBreakpoints.values || values).indexOf(breakpoint) !== -1) {
+        const mediaKey = themeBreakpoints.up(breakpoint);
+        acc[mediaKey] = styleFromPropValue(propValue[breakpoint], breakpoint);
+      } else {
+        const cssKey = breakpoint;
+        acc[cssKey] = propValue[cssKey];
+      }
+      return acc;
+    }, {});
+  }
+  const output = styleFromPropValue(propValue);
+  return output;
+}
+function breakpoints(styleFunction) {
+  // false positive
+  // eslint-disable-next-line react/function-component-definition
+  const newStyleFunction = props => {
+    const theme = props.theme || {};
+    const base = styleFunction(props);
+    const themeBreakpoints = theme.breakpoints || defaultBreakpoints;
+    const extended = themeBreakpoints.keys.reduce((acc, key) => {
+      if (props[key]) {
+        acc = acc || {};
+        acc[themeBreakpoints.up(key)] = styleFunction(_extends({
+          theme
+        }, props[key]));
+      }
+      return acc;
+    }, null);
+    return merge(base, extended);
+  };
+  newStyleFunction.propTypes = process.env.NODE_ENV !== 'production' ? _extends({}, styleFunction.propTypes, {
+    xs: PropTypes.object,
+    sm: PropTypes.object,
+    md: PropTypes.object,
+    lg: PropTypes.object,
+    xl: PropTypes.object
+  }) : {};
+  newStyleFunction.filterProps = ['xs', 'sm', 'md', 'lg', 'xl', ...styleFunction.filterProps];
+  return newStyleFunction;
+}
+export function createEmptyBreakpointObject(breakpointsInput = {}) {
+  var _breakpointsInput$key;
+  const breakpointsInOrder = (_breakpointsInput$key = breakpointsInput.keys) == null ? void 0 : _breakpointsInput$key.reduce((acc, key) => {
+    const breakpointStyleKey = breakpointsInput.up(key);
+    acc[breakpointStyleKey] = {};
+    return acc;
+  }, {});
+  return breakpointsInOrder || {};
+}
+export function removeUnusedBreakpoints(breakpointKeys, style) {
+  return breakpointKeys.reduce((acc, key) => {
+    const breakpointOutput = acc[key];
+    const isBreakpointUnused = !breakpointOutput || Object.keys(breakpointOutput).length === 0;
+    if (isBreakpointUnused) {
+      delete acc[key];
+    }
+    return acc;
+  }, style);
+}
+export function mergeBreakpointsInOrder(breakpointsInput, ...styles) {
+  const emptyBreakpoints = createEmptyBreakpointObject(breakpointsInput);
+  const mergedOutput = [emptyBreakpoints, ...styles].reduce((prev, next) => deepmerge(prev, next), {});
+  return removeUnusedBreakpoints(Object.keys(emptyBreakpoints), mergedOutput);
+}
+
+// compute base for responsive values; e.g.,
+// [1,2,3] => {xs: true, sm: true, md: true}
+// {xs: 1, sm: 2, md: 3} => {xs: true, sm: true, md: true}
+export function computeBreakpointsBase(breakpointValues, themeBreakpoints) {
+  // fixed value
+  if (typeof breakpointValues !== 'object') {
+    return {};
+  }
+  const base = {};
+  const breakpointsKeys = Object.keys(themeBreakpoints);
+  if (Array.isArray(breakpointValues)) {
+    breakpointsKeys.forEach((breakpoint, i) => {
+      if (i < breakpointValues.length) {
+        base[breakpoint] = true;
+      }
+    });
+  } else {
+    breakpointsKeys.forEach(breakpoint => {
+      if (breakpointValues[breakpoint] != null) {
+        base[breakpoint] = true;
+      }
+    });
+  }
+  return base;
+}
+export function resolveBreakpointValues({
+  values: breakpointValues,
+  breakpoints: themeBreakpoints,
+  base: customBase
+}) {
+  const base = customBase || computeBreakpointsBase(breakpointValues, themeBreakpoints);
+  const keys = Object.keys(base);
+  if (keys.length === 0) {
+    return breakpointValues;
+  }
+  let previous;
+  return keys.reduce((acc, breakpoint, i) => {
+    if (Array.isArray(breakpointValues)) {
+      acc[breakpoint] = breakpointValues[i] != null ? breakpointValues[i] : breakpointValues[previous];
+      previous = i;
+    } else if (typeof breakpointValues === 'object') {
+      acc[breakpoint] = breakpointValues[breakpoint] != null ? breakpointValues[breakpoint] : breakpointValues[previous];
+      previous = breakpoint;
+    } else {
+      acc[breakpoint] = breakpointValues;
+    }
+    return acc;
+  }, {});
+}
+export default breakpoints;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/colorManipulator.js b/ddb_main/node_modules/@mui/system/esm/colorManipulator.js
new file mode 100644
index 0000000..8be6603
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/colorManipulator.js
@@ -0,0 +1,345 @@
+import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
+/* eslint-disable @typescript-eslint/naming-convention */
+import clamp from '@mui/utils/clamp';
+/**
+ * Returns a number whose value is limited to the given range.
+ * @param {number} value The value to be clamped
+ * @param {number} min The lower boundary of the output range
+ * @param {number} max The upper boundary of the output range
+ * @returns {number} A number in the range [min, max]
+ */
+function clampWrapper(value, min = 0, max = 1) {
+  if (process.env.NODE_ENV !== 'production') {
+    if (value < min || value > max) {
+      console.error(`MUI: The value provided ${value} is out of range [${min}, ${max}].`);
+    }
+  }
+  return clamp(value, min, max);
+}
+
+/**
+ * Converts a color from CSS hex format to CSS rgb format.
+ * @param {string} color - Hex color, i.e. #nnn or #nnnnnn
+ * @returns {string} A CSS rgb color string
+ */
+export function hexToRgb(color) {
+  color = color.slice(1);
+  const re = new RegExp(`.{1,${color.length >= 6 ? 2 : 1}}`, 'g');
+  let colors = color.match(re);
+  if (colors && colors[0].length === 1) {
+    colors = colors.map(n => n + n);
+  }
+  return colors ? `rgb${colors.length === 4 ? 'a' : ''}(${colors.map((n, index) => {
+    return index < 3 ? parseInt(n, 16) : Math.round(parseInt(n, 16) / 255 * 1000) / 1000;
+  }).join(', ')})` : '';
+}
+function intToHex(int) {
+  const hex = int.toString(16);
+  return hex.length === 1 ? `0${hex}` : hex;
+}
+
+/**
+ * Returns an object with the type and values of a color.
+ *
+ * Note: Does not support rgb % values.
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @returns {object} - A MUI color object: {type: string, values: number[]}
+ */
+export function decomposeColor(color) {
+  // Idempotent
+  if (color.type) {
+    return color;
+  }
+  if (color.charAt(0) === '#') {
+    return decomposeColor(hexToRgb(color));
+  }
+  const marker = color.indexOf('(');
+  const type = color.substring(0, marker);
+  if (['rgb', 'rgba', 'hsl', 'hsla', 'color'].indexOf(type) === -1) {
+    throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Unsupported \`${color}\` color.
+The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().` : _formatMuiErrorMessage(9, color));
+  }
+  let values = color.substring(marker + 1, color.length - 1);
+  let colorSpace;
+  if (type === 'color') {
+    values = values.split(' ');
+    colorSpace = values.shift();
+    if (values.length === 4 && values[3].charAt(0) === '/') {
+      values[3] = values[3].slice(1);
+    }
+    if (['srgb', 'display-p3', 'a98-rgb', 'prophoto-rgb', 'rec-2020'].indexOf(colorSpace) === -1) {
+      throw new Error(process.env.NODE_ENV !== "production" ? `MUI: unsupported \`${colorSpace}\` color space.
+The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.` : _formatMuiErrorMessage(10, colorSpace));
+    }
+  } else {
+    values = values.split(',');
+  }
+  values = values.map(value => parseFloat(value));
+  return {
+    type,
+    values,
+    colorSpace
+  };
+}
+
+/**
+ * Returns a channel created from the input color.
+ *
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @returns {string} - The channel for the color, that can be used in rgba or hsla colors
+ */
+export const colorChannel = color => {
+  const decomposedColor = decomposeColor(color);
+  return decomposedColor.values.slice(0, 3).map((val, idx) => decomposedColor.type.indexOf('hsl') !== -1 && idx !== 0 ? `${val}%` : val).join(' ');
+};
+export const private_safeColorChannel = (color, warning) => {
+  try {
+    return colorChannel(color);
+  } catch (error) {
+    if (warning && process.env.NODE_ENV !== 'production') {
+      console.warn(warning);
+    }
+    return color;
+  }
+};
+
+/**
+ * Converts a color object with type and values to a string.
+ * @param {object} color - Decomposed color
+ * @param {string} color.type - One of: 'rgb', 'rgba', 'hsl', 'hsla', 'color'
+ * @param {array} color.values - [n,n,n] or [n,n,n,n]
+ * @returns {string} A CSS color string
+ */
+export function recomposeColor(color) {
+  const {
+    type,
+    colorSpace
+  } = color;
+  let {
+    values
+  } = color;
+  if (type.indexOf('rgb') !== -1) {
+    // Only convert the first 3 values to int (i.e. not alpha)
+    values = values.map((n, i) => i < 3 ? parseInt(n, 10) : n);
+  } else if (type.indexOf('hsl') !== -1) {
+    values[1] = `${values[1]}%`;
+    values[2] = `${values[2]}%`;
+  }
+  if (type.indexOf('color') !== -1) {
+    values = `${colorSpace} ${values.join(' ')}`;
+  } else {
+    values = `${values.join(', ')}`;
+  }
+  return `${type}(${values})`;
+}
+
+/**
+ * Converts a color from CSS rgb format to CSS hex format.
+ * @param {string} color - RGB color, i.e. rgb(n, n, n)
+ * @returns {string} A CSS rgb color string, i.e. #nnnnnn
+ */
+export function rgbToHex(color) {
+  // Idempotent
+  if (color.indexOf('#') === 0) {
+    return color;
+  }
+  const {
+    values
+  } = decomposeColor(color);
+  return `#${values.map((n, i) => intToHex(i === 3 ? Math.round(255 * n) : n)).join('')}`;
+}
+
+/**
+ * Converts a color from hsl format to rgb format.
+ * @param {string} color - HSL color values
+ * @returns {string} rgb color values
+ */
+export function hslToRgb(color) {
+  color = decomposeColor(color);
+  const {
+    values
+  } = color;
+  const h = values[0];
+  const s = values[1] / 100;
+  const l = values[2] / 100;
+  const a = s * Math.min(l, 1 - l);
+  const f = (n, k = (n + h / 30) % 12) => l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+  let type = 'rgb';
+  const rgb = [Math.round(f(0) * 255), Math.round(f(8) * 255), Math.round(f(4) * 255)];
+  if (color.type === 'hsla') {
+    type += 'a';
+    rgb.push(values[3]);
+  }
+  return recomposeColor({
+    type,
+    values: rgb
+  });
+}
+/**
+ * The relative brightness of any point in a color space,
+ * normalized to 0 for darkest black and 1 for lightest white.
+ *
+ * Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @returns {number} The relative brightness of the color in the range 0 - 1
+ */
+export function getLuminance(color) {
+  color = decomposeColor(color);
+  let rgb = color.type === 'hsl' || color.type === 'hsla' ? decomposeColor(hslToRgb(color)).values : color.values;
+  rgb = rgb.map(val => {
+    if (color.type !== 'color') {
+      val /= 255; // normalized
+    }
+    return val <= 0.03928 ? val / 12.92 : ((val + 0.055) / 1.055) ** 2.4;
+  });
+
+  // Truncate at 3 digits
+  return Number((0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]).toFixed(3));
+}
+
+/**
+ * Calculates the contrast ratio between two colors.
+ *
+ * Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
+ * @param {string} foreground - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
+ * @param {string} background - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
+ * @returns {number} A contrast ratio value in the range 0 - 21.
+ */
+export function getContrastRatio(foreground, background) {
+  const lumA = getLuminance(foreground);
+  const lumB = getLuminance(background);
+  return (Math.max(lumA, lumB) + 0.05) / (Math.min(lumA, lumB) + 0.05);
+}
+
+/**
+ * Sets the absolute transparency of a color.
+ * Any existing alpha values are overwritten.
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @param {number} value - value to set the alpha channel to in the range 0 - 1
+ * @returns {string} A CSS color string. Hex input values are returned as rgb
+ */
+export function alpha(color, value) {
+  color = decomposeColor(color);
+  value = clampWrapper(value);
+  if (color.type === 'rgb' || color.type === 'hsl') {
+    color.type += 'a';
+  }
+  if (color.type === 'color') {
+    color.values[3] = `/${value}`;
+  } else {
+    color.values[3] = value;
+  }
+  return recomposeColor(color);
+}
+export function private_safeAlpha(color, value, warning) {
+  try {
+    return alpha(color, value);
+  } catch (error) {
+    if (warning && process.env.NODE_ENV !== 'production') {
+      console.warn(warning);
+    }
+    return color;
+  }
+}
+
+/**
+ * Darkens a color.
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @param {number} coefficient - multiplier in the range 0 - 1
+ * @returns {string} A CSS color string. Hex input values are returned as rgb
+ */
+export function darken(color, coefficient) {
+  color = decomposeColor(color);
+  coefficient = clampWrapper(coefficient);
+  if (color.type.indexOf('hsl') !== -1) {
+    color.values[2] *= 1 - coefficient;
+  } else if (color.type.indexOf('rgb') !== -1 || color.type.indexOf('color') !== -1) {
+    for (let i = 0; i < 3; i += 1) {
+      color.values[i] *= 1 - coefficient;
+    }
+  }
+  return recomposeColor(color);
+}
+export function private_safeDarken(color, coefficient, warning) {
+  try {
+    return darken(color, coefficient);
+  } catch (error) {
+    if (warning && process.env.NODE_ENV !== 'production') {
+      console.warn(warning);
+    }
+    return color;
+  }
+}
+
+/**
+ * Lightens a color.
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @param {number} coefficient - multiplier in the range 0 - 1
+ * @returns {string} A CSS color string. Hex input values are returned as rgb
+ */
+export function lighten(color, coefficient) {
+  color = decomposeColor(color);
+  coefficient = clampWrapper(coefficient);
+  if (color.type.indexOf('hsl') !== -1) {
+    color.values[2] += (100 - color.values[2]) * coefficient;
+  } else if (color.type.indexOf('rgb') !== -1) {
+    for (let i = 0; i < 3; i += 1) {
+      color.values[i] += (255 - color.values[i]) * coefficient;
+    }
+  } else if (color.type.indexOf('color') !== -1) {
+    for (let i = 0; i < 3; i += 1) {
+      color.values[i] += (1 - color.values[i]) * coefficient;
+    }
+  }
+  return recomposeColor(color);
+}
+export function private_safeLighten(color, coefficient, warning) {
+  try {
+    return lighten(color, coefficient);
+  } catch (error) {
+    if (warning && process.env.NODE_ENV !== 'production') {
+      console.warn(warning);
+    }
+    return color;
+  }
+}
+
+/**
+ * Darken or lighten a color, depending on its luminance.
+ * Light colors are darkened, dark colors are lightened.
+ * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
+ * @param {number} coefficient=0.15 - multiplier in the range 0 - 1
+ * @returns {string} A CSS color string. Hex input values are returned as rgb
+ */
+export function emphasize(color, coefficient = 0.15) {
+  return getLuminance(color) > 0.5 ? darken(color, coefficient) : lighten(color, coefficient);
+}
+export function private_safeEmphasize(color, coefficient, warning) {
+  try {
+    return emphasize(color, coefficient);
+  } catch (error) {
+    if (warning && process.env.NODE_ENV !== 'production') {
+      console.warn(warning);
+    }
+    return color;
+  }
+}
+
+/**
+ * Blend a transparent overlay color with a background color, resulting in a single
+ * RGB color.
+ * @param {string} background - CSS color
+ * @param {string} overlay - CSS color
+ * @param {number} opacity - Opacity multiplier in the range 0 - 1
+ * @param {number} [gamma=1.0] - Gamma correction factor. For gamma-correct blending, 2.2 is usual.
+ */
+export function blend(background, overlay, opacity, gamma = 1.0) {
+  const blendChannel = (b, o) => Math.round((b ** (1 / gamma) * (1 - opacity) + o ** (1 / gamma) * opacity) ** gamma);
+  const backgroundColor = decomposeColor(background);
+  const overlayColor = decomposeColor(overlay);
+  const rgb = [blendChannel(backgroundColor.values[0], overlayColor.values[0]), blendChannel(backgroundColor.values[1], overlayColor.values[1]), blendChannel(backgroundColor.values[2], overlayColor.values[2])];
+  return recomposeColor({
+    type: 'rgb',
+    values: rgb
+  });
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/compose.js b/ddb_main/node_modules/@mui/system/esm/compose.js
new file mode 100644
index 0000000..8b2883a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/compose.js
@@ -0,0 +1,24 @@
+import merge from './merge';
+function compose(...styles) {
+  const handlers = styles.reduce((acc, style) => {
+    style.filterProps.forEach(prop => {
+      acc[prop] = style;
+    });
+    return acc;
+  }, {});
+
+  // false positive
+  // eslint-disable-next-line react/function-component-definition
+  const fn = props => {
+    return Object.keys(props).reduce((acc, prop) => {
+      if (handlers[prop]) {
+        return merge(acc, handlers[prop](props));
+      }
+      return acc;
+    }, {});
+  };
+  fn.propTypes = process.env.NODE_ENV !== 'production' ? styles.reduce((acc, style) => Object.assign(acc, style.propTypes), {}) : {};
+  fn.filterProps = styles.reduce((acc, style) => acc.concat(style.filterProps), []);
+  return fn;
+}
+export default compose;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/createBox.js b/ddb_main/node_modules/@mui/system/esm/createBox.js
new file mode 100644
index 0000000..a217f71
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/createBox.js
@@ -0,0 +1,38 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className", "component"];
+import * as React from 'react';
+import clsx from 'clsx';
+import styled from '@mui/styled-engine';
+import styleFunctionSx, { extendSxProp } from './styleFunctionSx';
+import useTheme from './useTheme';
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function createBox(options = {}) {
+  const {
+    themeId,
+    defaultTheme,
+    defaultClassName = 'MuiBox-root',
+    generateClassName
+  } = options;
+  const BoxRoot = styled('div', {
+    shouldForwardProp: prop => prop !== 'theme' && prop !== 'sx' && prop !== 'as'
+  })(styleFunctionSx);
+  const Box = /*#__PURE__*/React.forwardRef(function Box(inProps, ref) {
+    const theme = useTheme(defaultTheme);
+    const _extendSxProp = extendSxProp(inProps),
+      {
+        className,
+        component = 'div'
+      } = _extendSxProp,
+      other = _objectWithoutPropertiesLoose(_extendSxProp, _excluded);
+    return /*#__PURE__*/_jsx(BoxRoot, _extends({
+      as: component,
+      ref: ref,
+      className: clsx(className, generateClassName ? generateClassName(defaultClassName) : defaultClassName),
+      theme: themeId ? theme[themeId] || theme : theme
+    }, other));
+  });
+  return Box;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/createStyled.js b/ddb_main/node_modules/@mui/system/esm/createStyled.js
new file mode 100644
index 0000000..3cde22a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/createStyled.js
@@ -0,0 +1,240 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["ownerState"],
+  _excluded2 = ["variants"],
+  _excluded3 = ["name", "slot", "skipVariantsResolver", "skipSx", "overridesResolver"];
+/* eslint-disable no-underscore-dangle */
+import styledEngineStyled, { internal_processStyles as processStyles } from '@mui/styled-engine';
+import { isPlainObject } from '@mui/utils/deepmerge';
+import capitalize from '@mui/utils/capitalize';
+import getDisplayName from '@mui/utils/getDisplayName';
+import createTheme from './createTheme';
+import styleFunctionSx from './styleFunctionSx';
+function isEmpty(obj) {
+  return Object.keys(obj).length === 0;
+}
+
+// https://github.com/emotion-js/emotion/blob/26ded6109fcd8ca9875cc2ce4564fee678a3f3c5/packages/styled/src/utils.js#L40
+function isStringTag(tag) {
+  return typeof tag === 'string' &&
+  // 96 is one less than the char code
+  // for "a" so this is checking that
+  // it's a lowercase character
+  tag.charCodeAt(0) > 96;
+}
+
+// Update /system/styled/#api in case if this changes
+export function shouldForwardProp(prop) {
+  return prop !== 'ownerState' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';
+}
+export const systemDefaultTheme = createTheme();
+const lowercaseFirstLetter = string => {
+  if (!string) {
+    return string;
+  }
+  return string.charAt(0).toLowerCase() + string.slice(1);
+};
+function resolveTheme({
+  defaultTheme,
+  theme,
+  themeId
+}) {
+  return isEmpty(theme) ? defaultTheme : theme[themeId] || theme;
+}
+function defaultOverridesResolver(slot) {
+  if (!slot) {
+    return null;
+  }
+  return (props, styles) => styles[slot];
+}
+function processStyleArg(callableStyle, _ref) {
+  let {
+      ownerState
+    } = _ref,
+    props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  const resolvedStylesArg = typeof callableStyle === 'function' ? callableStyle(_extends({
+    ownerState
+  }, props)) : callableStyle;
+  if (Array.isArray(resolvedStylesArg)) {
+    return resolvedStylesArg.flatMap(resolvedStyle => processStyleArg(resolvedStyle, _extends({
+      ownerState
+    }, props)));
+  }
+  if (!!resolvedStylesArg && typeof resolvedStylesArg === 'object' && Array.isArray(resolvedStylesArg.variants)) {
+    const {
+        variants = []
+      } = resolvedStylesArg,
+      otherStyles = _objectWithoutPropertiesLoose(resolvedStylesArg, _excluded2);
+    let result = otherStyles;
+    variants.forEach(variant => {
+      let isMatch = true;
+      if (typeof variant.props === 'function') {
+        isMatch = variant.props(_extends({
+          ownerState
+        }, props, ownerState));
+      } else {
+        Object.keys(variant.props).forEach(key => {
+          if ((ownerState == null ? void 0 : ownerState[key]) !== variant.props[key] && props[key] !== variant.props[key]) {
+            isMatch = false;
+          }
+        });
+      }
+      if (isMatch) {
+        if (!Array.isArray(result)) {
+          result = [result];
+        }
+        result.push(typeof variant.style === 'function' ? variant.style(_extends({
+          ownerState
+        }, props, ownerState)) : variant.style);
+      }
+    });
+    return result;
+  }
+  return resolvedStylesArg;
+}
+export default function createStyled(input = {}) {
+  const {
+    themeId,
+    defaultTheme = systemDefaultTheme,
+    rootShouldForwardProp = shouldForwardProp,
+    slotShouldForwardProp = shouldForwardProp
+  } = input;
+  const systemSx = props => {
+    return styleFunctionSx(_extends({}, props, {
+      theme: resolveTheme(_extends({}, props, {
+        defaultTheme,
+        themeId
+      }))
+    }));
+  };
+  systemSx.__mui_systemSx = true;
+  return (tag, inputOptions = {}) => {
+    // Filter out the `sx` style function from the previous styled component to prevent unnecessary styles generated by the composite components.
+    processStyles(tag, styles => styles.filter(style => !(style != null && style.__mui_systemSx)));
+    const {
+        name: componentName,
+        slot: componentSlot,
+        skipVariantsResolver: inputSkipVariantsResolver,
+        skipSx: inputSkipSx,
+        // TODO v6: remove `lowercaseFirstLetter()` in the next major release
+        // For more details: https://github.com/mui/material-ui/pull/37908
+        overridesResolver = defaultOverridesResolver(lowercaseFirstLetter(componentSlot))
+      } = inputOptions,
+      options = _objectWithoutPropertiesLoose(inputOptions, _excluded3);
+
+    // if skipVariantsResolver option is defined, take the value, otherwise, true for root and false for other slots.
+    const skipVariantsResolver = inputSkipVariantsResolver !== undefined ? inputSkipVariantsResolver :
+    // TODO v6: remove `Root` in the next major release
+    // For more details: https://github.com/mui/material-ui/pull/37908
+    componentSlot && componentSlot !== 'Root' && componentSlot !== 'root' || false;
+    const skipSx = inputSkipSx || false;
+    let label;
+    if (process.env.NODE_ENV !== 'production') {
+      if (componentName) {
+        // TODO v6: remove `lowercaseFirstLetter()` in the next major release
+        // For more details: https://github.com/mui/material-ui/pull/37908
+        label = `${componentName}-${lowercaseFirstLetter(componentSlot || 'Root')}`;
+      }
+    }
+    let shouldForwardPropOption = shouldForwardProp;
+
+    // TODO v6: remove `Root` in the next major release
+    // For more details: https://github.com/mui/material-ui/pull/37908
+    if (componentSlot === 'Root' || componentSlot === 'root') {
+      shouldForwardPropOption = rootShouldForwardProp;
+    } else if (componentSlot) {
+      // any other slot specified
+      shouldForwardPropOption = slotShouldForwardProp;
+    } else if (isStringTag(tag)) {
+      // for string (html) tag, preserve the behavior in emotion & styled-components.
+      shouldForwardPropOption = undefined;
+    }
+    const defaultStyledResolver = styledEngineStyled(tag, _extends({
+      shouldForwardProp: shouldForwardPropOption,
+      label
+    }, options));
+    const transformStyleArg = stylesArg => {
+      // On the server Emotion doesn't use React.forwardRef for creating components, so the created
+      // component stays as a function. This condition makes sure that we do not interpolate functions
+      // which are basically components used as a selectors.
+      if (typeof stylesArg === 'function' && stylesArg.__emotion_real !== stylesArg || isPlainObject(stylesArg)) {
+        return props => processStyleArg(stylesArg, _extends({}, props, {
+          theme: resolveTheme({
+            theme: props.theme,
+            defaultTheme,
+            themeId
+          })
+        }));
+      }
+      return stylesArg;
+    };
+    const muiStyledResolver = (styleArg, ...expressions) => {
+      let transformedStyleArg = transformStyleArg(styleArg);
+      const expressionsWithDefaultTheme = expressions ? expressions.map(transformStyleArg) : [];
+      if (componentName && overridesResolver) {
+        expressionsWithDefaultTheme.push(props => {
+          const theme = resolveTheme(_extends({}, props, {
+            defaultTheme,
+            themeId
+          }));
+          if (!theme.components || !theme.components[componentName] || !theme.components[componentName].styleOverrides) {
+            return null;
+          }
+          const styleOverrides = theme.components[componentName].styleOverrides;
+          const resolvedStyleOverrides = {};
+          // TODO: v7 remove iteration and use `resolveStyleArg(styleOverrides[slot])` directly
+          Object.entries(styleOverrides).forEach(([slotKey, slotStyle]) => {
+            resolvedStyleOverrides[slotKey] = processStyleArg(slotStyle, _extends({}, props, {
+              theme
+            }));
+          });
+          return overridesResolver(props, resolvedStyleOverrides);
+        });
+      }
+      if (componentName && !skipVariantsResolver) {
+        expressionsWithDefaultTheme.push(props => {
+          var _theme$components;
+          const theme = resolveTheme(_extends({}, props, {
+            defaultTheme,
+            themeId
+          }));
+          const themeVariants = theme == null || (_theme$components = theme.components) == null || (_theme$components = _theme$components[componentName]) == null ? void 0 : _theme$components.variants;
+          return processStyleArg({
+            variants: themeVariants
+          }, _extends({}, props, {
+            theme
+          }));
+        });
+      }
+      if (!skipSx) {
+        expressionsWithDefaultTheme.push(systemSx);
+      }
+      const numOfCustomFnsApplied = expressionsWithDefaultTheme.length - expressions.length;
+      if (Array.isArray(styleArg) && numOfCustomFnsApplied > 0) {
+        const placeholders = new Array(numOfCustomFnsApplied).fill('');
+        // If the type is array, than we need to add placeholders in the template for the overrides, variants and the sx styles.
+        transformedStyleArg = [...styleArg, ...placeholders];
+        transformedStyleArg.raw = [...styleArg.raw, ...placeholders];
+      }
+      const Component = defaultStyledResolver(transformedStyleArg, ...expressionsWithDefaultTheme);
+      if (process.env.NODE_ENV !== 'production') {
+        let displayName;
+        if (componentName) {
+          displayName = `${componentName}${capitalize(componentSlot || '')}`;
+        }
+        if (displayName === undefined) {
+          displayName = `Styled(${getDisplayName(tag)})`;
+        }
+        Component.displayName = displayName;
+      }
+      if (tag.muiName) {
+        Component.muiName = tag.muiName;
+      }
+      return Component;
+    };
+    if (defaultStyledResolver.withConfig) {
+      muiStyledResolver.withConfig = defaultStyledResolver.withConfig;
+    }
+    return muiStyledResolver;
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/createTheme/applyStyles.js b/ddb_main/node_modules/@mui/system/esm/createTheme/applyStyles.js
new file mode 100644
index 0000000..bbb77bb
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/createTheme/applyStyles.js
@@ -0,0 +1,74 @@
+/**
+ * A universal utility to style components with multiple color modes. Always use it from the theme object.
+ * It works with:
+ *  - [Basic theme](https://mui.com/material-ui/customization/dark-mode/)
+ *  - [CSS theme variables](https://mui.com/material-ui/experimental-api/css-theme-variables/overview/)
+ *  - Zero-runtime engine
+ *
+ * Tips: Use an array over object spread and place `theme.applyStyles()` last.
+ *
+ * ✅ [{ background: '#e5e5e5' }, theme.applyStyles('dark', { background: '#1c1c1c' })]
+ *
+ * 🚫 { background: '#e5e5e5', ...theme.applyStyles('dark', { background: '#1c1c1c' })}
+ *
+ * @example
+ * 1. using with `styled`:
+ * ```jsx
+ *   const Component = styled('div')(({ theme }) => [
+ *     { background: '#e5e5e5' },
+ *     theme.applyStyles('dark', {
+ *       background: '#1c1c1c',
+ *       color: '#fff',
+ *     }),
+ *   ]);
+ * ```
+ *
+ * @example
+ * 2. using with `sx` prop:
+ * ```jsx
+ *   <Box sx={theme => [
+ *     { background: '#e5e5e5' },
+ *     theme.applyStyles('dark', {
+ *        background: '#1c1c1c',
+ *        color: '#fff',
+ *      }),
+ *     ]}
+ *   />
+ * ```
+ *
+ * @example
+ * 3. theming a component:
+ * ```jsx
+ *   extendTheme({
+ *     components: {
+ *       MuiButton: {
+ *         styleOverrides: {
+ *           root: ({ theme }) => [
+ *             { background: '#e5e5e5' },
+ *             theme.applyStyles('dark', {
+ *               background: '#1c1c1c',
+ *               color: '#fff',
+ *             }),
+ *           ],
+ *         },
+ *       }
+ *     }
+ *   })
+ *```
+ */
+export default function applyStyles(key, styles) {
+  // @ts-expect-error this is 'any' type
+  const theme = this;
+  if (theme.vars && typeof theme.getColorSchemeSelector === 'function') {
+    // If CssVarsProvider is used as a provider,
+    // returns '* :where([data-mui-color-scheme="light|dark"]) &'
+    const selector = theme.getColorSchemeSelector(key).replace(/(\[[^\]]+\])/, '*:where($1)');
+    return {
+      [selector]: styles
+    };
+  }
+  if (theme.palette.mode === key) {
+    return styles;
+  }
+  return {};
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/createTheme/createBreakpoints.js b/ddb_main/node_modules/@mui/system/esm/createTheme/createBreakpoints.js
new file mode 100644
index 0000000..0c95d32
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/createTheme/createBreakpoints.js
@@ -0,0 +1,82 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["values", "unit", "step"];
+// Sorted ASC by size. That's important.
+// It can't be configured as it's used statically for propTypes.
+export const breakpointKeys = ['xs', 'sm', 'md', 'lg', 'xl'];
+const sortBreakpointsValues = values => {
+  const breakpointsAsArray = Object.keys(values).map(key => ({
+    key,
+    val: values[key]
+  })) || [];
+  // Sort in ascending order
+  breakpointsAsArray.sort((breakpoint1, breakpoint2) => breakpoint1.val - breakpoint2.val);
+  return breakpointsAsArray.reduce((acc, obj) => {
+    return _extends({}, acc, {
+      [obj.key]: obj.val
+    });
+  }, {});
+};
+
+// Keep in mind that @media is inclusive by the CSS specification.
+export default function createBreakpoints(breakpoints) {
+  const {
+      // The breakpoint **start** at this value.
+      // For instance with the first breakpoint xs: [xs, sm).
+      values = {
+        xs: 0,
+        // phone
+        sm: 600,
+        // tablet
+        md: 900,
+        // small laptop
+        lg: 1200,
+        // desktop
+        xl: 1536 // large screen
+      },
+      unit = 'px',
+      step = 5
+    } = breakpoints,
+    other = _objectWithoutPropertiesLoose(breakpoints, _excluded);
+  const sortedValues = sortBreakpointsValues(values);
+  const keys = Object.keys(sortedValues);
+  function up(key) {
+    const value = typeof values[key] === 'number' ? values[key] : key;
+    return `@media (min-width:${value}${unit})`;
+  }
+  function down(key) {
+    const value = typeof values[key] === 'number' ? values[key] : key;
+    return `@media (max-width:${value - step / 100}${unit})`;
+  }
+  function between(start, end) {
+    const endIndex = keys.indexOf(end);
+    return `@media (min-width:${typeof values[start] === 'number' ? values[start] : start}${unit}) and ` + `(max-width:${(endIndex !== -1 && typeof values[keys[endIndex]] === 'number' ? values[keys[endIndex]] : end) - step / 100}${unit})`;
+  }
+  function only(key) {
+    if (keys.indexOf(key) + 1 < keys.length) {
+      return between(key, keys[keys.indexOf(key) + 1]);
+    }
+    return up(key);
+  }
+  function not(key) {
+    // handle first and last key separately, for better readability
+    const keyIndex = keys.indexOf(key);
+    if (keyIndex === 0) {
+      return up(keys[1]);
+    }
+    if (keyIndex === keys.length - 1) {
+      return down(keys[keyIndex]);
+    }
+    return between(key, keys[keys.indexOf(key) + 1]).replace('@media', '@media not all and');
+  }
+  return _extends({
+    keys,
+    values: sortedValues,
+    up,
+    down,
+    between,
+    only,
+    not,
+    unit
+  }, other);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/createTheme/createSpacing.js b/ddb_main/node_modules/@mui/system/esm/createTheme/createSpacing.js
new file mode 100644
index 0000000..6c527dc
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/createTheme/createSpacing.js
@@ -0,0 +1,32 @@
+import { createUnarySpacing } from '../spacing';
+
+// The different signatures imply different meaning for their arguments that can't be expressed structurally.
+// We express the difference with variable names.
+
+export default function createSpacing(spacingInput = 8) {
+  // Already transformed.
+  if (spacingInput.mui) {
+    return spacingInput;
+  }
+
+  // Material Design layouts are visually balanced. Most measurements align to an 8dp grid, which aligns both spacing and the overall layout.
+  // Smaller components, such as icons, can align to a 4dp grid.
+  // https://m2.material.io/design/layout/understanding-layout.html
+  const transform = createUnarySpacing({
+    spacing: spacingInput
+  });
+  const spacing = (...argsInput) => {
+    if (process.env.NODE_ENV !== 'production') {
+      if (!(argsInput.length <= 4)) {
+        console.error(`MUI: Too many arguments provided, expected between 0 and 4, got ${argsInput.length}`);
+      }
+    }
+    const args = argsInput.length === 0 ? [1] : argsInput;
+    return args.map(argument => {
+      const output = transform(argument);
+      return typeof output === 'number' ? `${output}px` : output;
+    }).join(' ');
+  };
+  spacing.mui = true;
+  return spacing;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/createTheme/createTheme.js b/ddb_main/node_modules/@mui/system/esm/createTheme/createTheme.js
new file mode 100644
index 0000000..62bfdd0
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/createTheme/createTheme.js
@@ -0,0 +1,43 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["breakpoints", "palette", "spacing", "shape"];
+import deepmerge from '@mui/utils/deepmerge';
+import createBreakpoints from './createBreakpoints';
+import shape from './shape';
+import createSpacing from './createSpacing';
+import styleFunctionSx from '../styleFunctionSx/styleFunctionSx';
+import defaultSxConfig from '../styleFunctionSx/defaultSxConfig';
+import applyStyles from './applyStyles';
+function createTheme(options = {}, ...args) {
+  const {
+      breakpoints: breakpointsInput = {},
+      palette: paletteInput = {},
+      spacing: spacingInput,
+      shape: shapeInput = {}
+    } = options,
+    other = _objectWithoutPropertiesLoose(options, _excluded);
+  const breakpoints = createBreakpoints(breakpointsInput);
+  const spacing = createSpacing(spacingInput);
+  let muiTheme = deepmerge({
+    breakpoints,
+    direction: 'ltr',
+    components: {},
+    // Inject component definitions.
+    palette: _extends({
+      mode: 'light'
+    }, paletteInput),
+    spacing,
+    shape: _extends({}, shape, shapeInput)
+  }, other);
+  muiTheme.applyStyles = applyStyles;
+  muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
+  muiTheme.unstable_sxConfig = _extends({}, defaultSxConfig, other == null ? void 0 : other.unstable_sxConfig);
+  muiTheme.unstable_sx = function sx(props) {
+    return styleFunctionSx({
+      sx: props,
+      theme: this
+    });
+  };
+  return muiTheme;
+}
+export default createTheme;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/createTheme/shape.js b/ddb_main/node_modules/@mui/system/esm/createTheme/shape.js
new file mode 100644
index 0000000..d781443
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/createTheme/shape.js
@@ -0,0 +1,4 @@
+const shape = {
+  borderRadius: 4
+};
+export default shape;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/cssGrid.js b/ddb_main/node_modules/@mui/system/esm/cssGrid.js
new file mode 100644
index 0000000..ef744b2
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/cssGrid.js
@@ -0,0 +1,85 @@
+import style from './style';
+import compose from './compose';
+import { createUnaryUnit, getValue } from './spacing';
+import { handleBreakpoints } from './breakpoints';
+import responsivePropType from './responsivePropType';
+
+// false positive
+// eslint-disable-next-line react/function-component-definition
+export const gap = props => {
+  if (props.gap !== undefined && props.gap !== null) {
+    const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'gap');
+    const styleFromPropValue = propValue => ({
+      gap: getValue(transformer, propValue)
+    });
+    return handleBreakpoints(props, props.gap, styleFromPropValue);
+  }
+  return null;
+};
+gap.propTypes = process.env.NODE_ENV !== 'production' ? {
+  gap: responsivePropType
+} : {};
+gap.filterProps = ['gap'];
+
+// false positive
+// eslint-disable-next-line react/function-component-definition
+export const columnGap = props => {
+  if (props.columnGap !== undefined && props.columnGap !== null) {
+    const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'columnGap');
+    const styleFromPropValue = propValue => ({
+      columnGap: getValue(transformer, propValue)
+    });
+    return handleBreakpoints(props, props.columnGap, styleFromPropValue);
+  }
+  return null;
+};
+columnGap.propTypes = process.env.NODE_ENV !== 'production' ? {
+  columnGap: responsivePropType
+} : {};
+columnGap.filterProps = ['columnGap'];
+
+// false positive
+// eslint-disable-next-line react/function-component-definition
+export const rowGap = props => {
+  if (props.rowGap !== undefined && props.rowGap !== null) {
+    const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'rowGap');
+    const styleFromPropValue = propValue => ({
+      rowGap: getValue(transformer, propValue)
+    });
+    return handleBreakpoints(props, props.rowGap, styleFromPropValue);
+  }
+  return null;
+};
+rowGap.propTypes = process.env.NODE_ENV !== 'production' ? {
+  rowGap: responsivePropType
+} : {};
+rowGap.filterProps = ['rowGap'];
+export const gridColumn = style({
+  prop: 'gridColumn'
+});
+export const gridRow = style({
+  prop: 'gridRow'
+});
+export const gridAutoFlow = style({
+  prop: 'gridAutoFlow'
+});
+export const gridAutoColumns = style({
+  prop: 'gridAutoColumns'
+});
+export const gridAutoRows = style({
+  prop: 'gridAutoRows'
+});
+export const gridTemplateColumns = style({
+  prop: 'gridTemplateColumns'
+});
+export const gridTemplateRows = style({
+  prop: 'gridTemplateRows'
+});
+export const gridTemplateAreas = style({
+  prop: 'gridTemplateAreas'
+});
+export const gridArea = style({
+  prop: 'gridArea'
+});
+const grid = compose(gap, columnGap, rowGap, gridColumn, gridRow, gridAutoFlow, gridAutoColumns, gridAutoRows, gridTemplateColumns, gridTemplateRows, gridTemplateAreas, gridArea);
+export default grid;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/memoize.js b/ddb_main/node_modules/@mui/system/esm/memoize.js
new file mode 100644
index 0000000..610300f
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/memoize.js
@@ -0,0 +1,9 @@
+export default function memoize(fn) {
+  const cache = {};
+  return arg => {
+    if (cache[arg] === undefined) {
+      cache[arg] = fn(arg);
+    }
+    return cache[arg];
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/merge.js b/ddb_main/node_modules/@mui/system/esm/merge.js
new file mode 100644
index 0000000..e0b617d
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/merge.js
@@ -0,0 +1,10 @@
+import deepmerge from '@mui/utils/deepmerge';
+function merge(acc, item) {
+  if (!item) {
+    return acc;
+  }
+  return deepmerge(acc, item, {
+    clone: false // No need to clone deep, it's way faster.
+  });
+}
+export default merge;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/palette.js b/ddb_main/node_modules/@mui/system/esm/palette.js
new file mode 100644
index 0000000..f0cb720
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/palette.js
@@ -0,0 +1,26 @@
+import style from './style';
+import compose from './compose';
+export function paletteTransform(value, userValue) {
+  if (userValue === 'grey') {
+    return userValue;
+  }
+  return value;
+}
+export const color = style({
+  prop: 'color',
+  themeKey: 'palette',
+  transform: paletteTransform
+});
+export const bgcolor = style({
+  prop: 'bgcolor',
+  cssProperty: 'backgroundColor',
+  themeKey: 'palette',
+  transform: paletteTransform
+});
+export const backgroundColor = style({
+  prop: 'backgroundColor',
+  themeKey: 'palette',
+  transform: paletteTransform
+});
+const palette = compose(color, bgcolor, backgroundColor);
+export default palette;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/sizing.js b/ddb_main/node_modules/@mui/system/esm/sizing.js
new file mode 100644
index 0000000..383a2a9
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/sizing.js
@@ -0,0 +1,65 @@
+import style from './style';
+import compose from './compose';
+import { handleBreakpoints, values as breakpointsValues } from './breakpoints';
+export function sizingTransform(value) {
+  return value <= 1 && value !== 0 ? `${value * 100}%` : value;
+}
+export const width = style({
+  prop: 'width',
+  transform: sizingTransform
+});
+export const maxWidth = props => {
+  if (props.maxWidth !== undefined && props.maxWidth !== null) {
+    const styleFromPropValue = propValue => {
+      var _props$theme, _props$theme2;
+      const breakpoint = ((_props$theme = props.theme) == null || (_props$theme = _props$theme.breakpoints) == null || (_props$theme = _props$theme.values) == null ? void 0 : _props$theme[propValue]) || breakpointsValues[propValue];
+      if (!breakpoint) {
+        return {
+          maxWidth: sizingTransform(propValue)
+        };
+      }
+      if (((_props$theme2 = props.theme) == null || (_props$theme2 = _props$theme2.breakpoints) == null ? void 0 : _props$theme2.unit) !== 'px') {
+        return {
+          maxWidth: `${breakpoint}${props.theme.breakpoints.unit}`
+        };
+      }
+      return {
+        maxWidth: breakpoint
+      };
+    };
+    return handleBreakpoints(props, props.maxWidth, styleFromPropValue);
+  }
+  return null;
+};
+maxWidth.filterProps = ['maxWidth'];
+export const minWidth = style({
+  prop: 'minWidth',
+  transform: sizingTransform
+});
+export const height = style({
+  prop: 'height',
+  transform: sizingTransform
+});
+export const maxHeight = style({
+  prop: 'maxHeight',
+  transform: sizingTransform
+});
+export const minHeight = style({
+  prop: 'minHeight',
+  transform: sizingTransform
+});
+export const sizeWidth = style({
+  prop: 'size',
+  cssProperty: 'width',
+  transform: sizingTransform
+});
+export const sizeHeight = style({
+  prop: 'size',
+  cssProperty: 'height',
+  transform: sizingTransform
+});
+export const boxSizing = style({
+  prop: 'boxSizing'
+});
+const sizing = compose(width, maxWidth, minWidth, height, maxHeight, minHeight, boxSizing);
+export default sizing;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/spacing.js b/ddb_main/node_modules/@mui/system/esm/spacing.js
new file mode 100644
index 0000000..7d73a9a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/spacing.js
@@ -0,0 +1,146 @@
+import responsivePropType from './responsivePropType';
+import { handleBreakpoints } from './breakpoints';
+import { getPath } from './style';
+import merge from './merge';
+import memoize from './memoize';
+const properties = {
+  m: 'margin',
+  p: 'padding'
+};
+const directions = {
+  t: 'Top',
+  r: 'Right',
+  b: 'Bottom',
+  l: 'Left',
+  x: ['Left', 'Right'],
+  y: ['Top', 'Bottom']
+};
+const aliases = {
+  marginX: 'mx',
+  marginY: 'my',
+  paddingX: 'px',
+  paddingY: 'py'
+};
+
+// memoize() impact:
+// From 300,000 ops/sec
+// To 350,000 ops/sec
+const getCssProperties = memoize(prop => {
+  // It's not a shorthand notation.
+  if (prop.length > 2) {
+    if (aliases[prop]) {
+      prop = aliases[prop];
+    } else {
+      return [prop];
+    }
+  }
+  const [a, b] = prop.split('');
+  const property = properties[a];
+  const direction = directions[b] || '';
+  return Array.isArray(direction) ? direction.map(dir => property + dir) : [property + direction];
+});
+export const marginKeys = ['m', 'mt', 'mr', 'mb', 'ml', 'mx', 'my', 'margin', 'marginTop', 'marginRight', 'marginBottom', 'marginLeft', 'marginX', 'marginY', 'marginInline', 'marginInlineStart', 'marginInlineEnd', 'marginBlock', 'marginBlockStart', 'marginBlockEnd'];
+export const paddingKeys = ['p', 'pt', 'pr', 'pb', 'pl', 'px', 'py', 'padding', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft', 'paddingX', 'paddingY', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd'];
+const spacingKeys = [...marginKeys, ...paddingKeys];
+export function createUnaryUnit(theme, themeKey, defaultValue, propName) {
+  var _getPath;
+  const themeSpacing = (_getPath = getPath(theme, themeKey, false)) != null ? _getPath : defaultValue;
+  if (typeof themeSpacing === 'number') {
+    return abs => {
+      if (typeof abs === 'string') {
+        return abs;
+      }
+      if (process.env.NODE_ENV !== 'production') {
+        if (typeof abs !== 'number') {
+          console.error(`MUI: Expected ${propName} argument to be a number or a string, got ${abs}.`);
+        }
+      }
+      return themeSpacing * abs;
+    };
+  }
+  if (Array.isArray(themeSpacing)) {
+    return abs => {
+      if (typeof abs === 'string') {
+        return abs;
+      }
+      if (process.env.NODE_ENV !== 'production') {
+        if (!Number.isInteger(abs)) {
+          console.error([`MUI: The \`theme.${themeKey}\` array type cannot be combined with non integer values.` + `You should either use an integer value that can be used as index, or define the \`theme.${themeKey}\` as a number.`].join('\n'));
+        } else if (abs > themeSpacing.length - 1) {
+          console.error([`MUI: The value provided (${abs}) overflows.`, `The supported values are: ${JSON.stringify(themeSpacing)}.`, `${abs} > ${themeSpacing.length - 1}, you need to add the missing values.`].join('\n'));
+        }
+      }
+      return themeSpacing[abs];
+    };
+  }
+  if (typeof themeSpacing === 'function') {
+    return themeSpacing;
+  }
+  if (process.env.NODE_ENV !== 'production') {
+    console.error([`MUI: The \`theme.${themeKey}\` value (${themeSpacing}) is invalid.`, 'It should be a number, an array or a function.'].join('\n'));
+  }
+  return () => undefined;
+}
+export function createUnarySpacing(theme) {
+  return createUnaryUnit(theme, 'spacing', 8, 'spacing');
+}
+export function getValue(transformer, propValue) {
+  if (typeof propValue === 'string' || propValue == null) {
+    return propValue;
+  }
+  const abs = Math.abs(propValue);
+  const transformed = transformer(abs);
+  if (propValue >= 0) {
+    return transformed;
+  }
+  if (typeof transformed === 'number') {
+    return -transformed;
+  }
+  return `-${transformed}`;
+}
+export function getStyleFromPropValue(cssProperties, transformer) {
+  return propValue => cssProperties.reduce((acc, cssProperty) => {
+    acc[cssProperty] = getValue(transformer, propValue);
+    return acc;
+  }, {});
+}
+function resolveCssProperty(props, keys, prop, transformer) {
+  // Using a hash computation over an array iteration could be faster, but with only 28 items,
+  // it's doesn't worth the bundle size.
+  if (keys.indexOf(prop) === -1) {
+    return null;
+  }
+  const cssProperties = getCssProperties(prop);
+  const styleFromPropValue = getStyleFromPropValue(cssProperties, transformer);
+  const propValue = props[prop];
+  return handleBreakpoints(props, propValue, styleFromPropValue);
+}
+function style(props, keys) {
+  const transformer = createUnarySpacing(props.theme);
+  return Object.keys(props).map(prop => resolveCssProperty(props, keys, prop, transformer)).reduce(merge, {});
+}
+export function margin(props) {
+  return style(props, marginKeys);
+}
+margin.propTypes = process.env.NODE_ENV !== 'production' ? marginKeys.reduce((obj, key) => {
+  obj[key] = responsivePropType;
+  return obj;
+}, {}) : {};
+margin.filterProps = marginKeys;
+export function padding(props) {
+  return style(props, paddingKeys);
+}
+padding.propTypes = process.env.NODE_ENV !== 'production' ? paddingKeys.reduce((obj, key) => {
+  obj[key] = responsivePropType;
+  return obj;
+}, {}) : {};
+padding.filterProps = paddingKeys;
+function spacing(props) {
+  return style(props, spacingKeys);
+}
+spacing.propTypes = process.env.NODE_ENV !== 'production' ? spacingKeys.reduce((obj, key) => {
+  obj[key] = responsivePropType;
+  return obj;
+}, {}) : {};
+spacing.filterProps = spacingKeys;
+export default spacing;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/style.js b/ddb_main/node_modules/@mui/system/esm/style.js
new file mode 100644
index 0000000..6a645b1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/style.js
@@ -0,0 +1,75 @@
+import capitalize from '@mui/utils/capitalize';
+import responsivePropType from './responsivePropType';
+import { handleBreakpoints } from './breakpoints';
+export function getPath(obj, path, checkVars = true) {
+  if (!path || typeof path !== 'string') {
+    return null;
+  }
+
+  // Check if CSS variables are used
+  if (obj && obj.vars && checkVars) {
+    const val = `vars.${path}`.split('.').reduce((acc, item) => acc && acc[item] ? acc[item] : null, obj);
+    if (val != null) {
+      return val;
+    }
+  }
+  return path.split('.').reduce((acc, item) => {
+    if (acc && acc[item] != null) {
+      return acc[item];
+    }
+    return null;
+  }, obj);
+}
+export function getStyleValue(themeMapping, transform, propValueFinal, userValue = propValueFinal) {
+  let value;
+  if (typeof themeMapping === 'function') {
+    value = themeMapping(propValueFinal);
+  } else if (Array.isArray(themeMapping)) {
+    value = themeMapping[propValueFinal] || userValue;
+  } else {
+    value = getPath(themeMapping, propValueFinal) || userValue;
+  }
+  if (transform) {
+    value = transform(value, userValue, themeMapping);
+  }
+  return value;
+}
+function style(options) {
+  const {
+    prop,
+    cssProperty = options.prop,
+    themeKey,
+    transform
+  } = options;
+
+  // false positive
+  // eslint-disable-next-line react/function-component-definition
+  const fn = props => {
+    if (props[prop] == null) {
+      return null;
+    }
+    const propValue = props[prop];
+    const theme = props.theme;
+    const themeMapping = getPath(theme, themeKey) || {};
+    const styleFromPropValue = propValueFinal => {
+      let value = getStyleValue(themeMapping, transform, propValueFinal);
+      if (propValueFinal === value && typeof propValueFinal === 'string') {
+        // Haven't found value
+        value = getStyleValue(themeMapping, transform, `${prop}${propValueFinal === 'default' ? '' : capitalize(propValueFinal)}`, propValueFinal);
+      }
+      if (cssProperty === false) {
+        return value;
+      }
+      return {
+        [cssProperty]: value
+      };
+    };
+    return handleBreakpoints(props, propValue, styleFromPropValue);
+  };
+  fn.propTypes = process.env.NODE_ENV !== 'production' ? {
+    [prop]: responsivePropType
+  } : {};
+  fn.filterProps = [prop];
+  return fn;
+}
+export default style;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/styleFunctionSx/defaultSxConfig.js b/ddb_main/node_modules/@mui/system/esm/styleFunctionSx/defaultSxConfig.js
new file mode 100644
index 0000000..6f8ed61
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/styleFunctionSx/defaultSxConfig.js
@@ -0,0 +1,291 @@
+import { padding, margin } from '../spacing';
+import { borderRadius, borderTransform } from '../borders';
+import { gap, rowGap, columnGap } from '../cssGrid';
+import { paletteTransform } from '../palette';
+import { maxWidth, sizingTransform } from '../sizing';
+const defaultSxConfig = {
+  // borders
+  border: {
+    themeKey: 'borders',
+    transform: borderTransform
+  },
+  borderTop: {
+    themeKey: 'borders',
+    transform: borderTransform
+  },
+  borderRight: {
+    themeKey: 'borders',
+    transform: borderTransform
+  },
+  borderBottom: {
+    themeKey: 'borders',
+    transform: borderTransform
+  },
+  borderLeft: {
+    themeKey: 'borders',
+    transform: borderTransform
+  },
+  borderColor: {
+    themeKey: 'palette'
+  },
+  borderTopColor: {
+    themeKey: 'palette'
+  },
+  borderRightColor: {
+    themeKey: 'palette'
+  },
+  borderBottomColor: {
+    themeKey: 'palette'
+  },
+  borderLeftColor: {
+    themeKey: 'palette'
+  },
+  outline: {
+    themeKey: 'borders',
+    transform: borderTransform
+  },
+  outlineColor: {
+    themeKey: 'palette'
+  },
+  borderRadius: {
+    themeKey: 'shape.borderRadius',
+    style: borderRadius
+  },
+  // palette
+  color: {
+    themeKey: 'palette',
+    transform: paletteTransform
+  },
+  bgcolor: {
+    themeKey: 'palette',
+    cssProperty: 'backgroundColor',
+    transform: paletteTransform
+  },
+  backgroundColor: {
+    themeKey: 'palette',
+    transform: paletteTransform
+  },
+  // spacing
+  p: {
+    style: padding
+  },
+  pt: {
+    style: padding
+  },
+  pr: {
+    style: padding
+  },
+  pb: {
+    style: padding
+  },
+  pl: {
+    style: padding
+  },
+  px: {
+    style: padding
+  },
+  py: {
+    style: padding
+  },
+  padding: {
+    style: padding
+  },
+  paddingTop: {
+    style: padding
+  },
+  paddingRight: {
+    style: padding
+  },
+  paddingBottom: {
+    style: padding
+  },
+  paddingLeft: {
+    style: padding
+  },
+  paddingX: {
+    style: padding
+  },
+  paddingY: {
+    style: padding
+  },
+  paddingInline: {
+    style: padding
+  },
+  paddingInlineStart: {
+    style: padding
+  },
+  paddingInlineEnd: {
+    style: padding
+  },
+  paddingBlock: {
+    style: padding
+  },
+  paddingBlockStart: {
+    style: padding
+  },
+  paddingBlockEnd: {
+    style: padding
+  },
+  m: {
+    style: margin
+  },
+  mt: {
+    style: margin
+  },
+  mr: {
+    style: margin
+  },
+  mb: {
+    style: margin
+  },
+  ml: {
+    style: margin
+  },
+  mx: {
+    style: margin
+  },
+  my: {
+    style: margin
+  },
+  margin: {
+    style: margin
+  },
+  marginTop: {
+    style: margin
+  },
+  marginRight: {
+    style: margin
+  },
+  marginBottom: {
+    style: margin
+  },
+  marginLeft: {
+    style: margin
+  },
+  marginX: {
+    style: margin
+  },
+  marginY: {
+    style: margin
+  },
+  marginInline: {
+    style: margin
+  },
+  marginInlineStart: {
+    style: margin
+  },
+  marginInlineEnd: {
+    style: margin
+  },
+  marginBlock: {
+    style: margin
+  },
+  marginBlockStart: {
+    style: margin
+  },
+  marginBlockEnd: {
+    style: margin
+  },
+  // display
+  displayPrint: {
+    cssProperty: false,
+    transform: value => ({
+      '@media print': {
+        display: value
+      }
+    })
+  },
+  display: {},
+  overflow: {},
+  textOverflow: {},
+  visibility: {},
+  whiteSpace: {},
+  // flexbox
+  flexBasis: {},
+  flexDirection: {},
+  flexWrap: {},
+  justifyContent: {},
+  alignItems: {},
+  alignContent: {},
+  order: {},
+  flex: {},
+  flexGrow: {},
+  flexShrink: {},
+  alignSelf: {},
+  justifyItems: {},
+  justifySelf: {},
+  // grid
+  gap: {
+    style: gap
+  },
+  rowGap: {
+    style: rowGap
+  },
+  columnGap: {
+    style: columnGap
+  },
+  gridColumn: {},
+  gridRow: {},
+  gridAutoFlow: {},
+  gridAutoColumns: {},
+  gridAutoRows: {},
+  gridTemplateColumns: {},
+  gridTemplateRows: {},
+  gridTemplateAreas: {},
+  gridArea: {},
+  // positions
+  position: {},
+  zIndex: {
+    themeKey: 'zIndex'
+  },
+  top: {},
+  right: {},
+  bottom: {},
+  left: {},
+  // shadows
+  boxShadow: {
+    themeKey: 'shadows'
+  },
+  // sizing
+  width: {
+    transform: sizingTransform
+  },
+  maxWidth: {
+    style: maxWidth
+  },
+  minWidth: {
+    transform: sizingTransform
+  },
+  height: {
+    transform: sizingTransform
+  },
+  maxHeight: {
+    transform: sizingTransform
+  },
+  minHeight: {
+    transform: sizingTransform
+  },
+  boxSizing: {},
+  // typography
+  fontFamily: {
+    themeKey: 'typography'
+  },
+  fontSize: {
+    themeKey: 'typography'
+  },
+  fontStyle: {
+    themeKey: 'typography'
+  },
+  fontWeight: {
+    themeKey: 'typography'
+  },
+  letterSpacing: {},
+  textTransform: {},
+  lineHeight: {},
+  textAlign: {},
+  typography: {
+    cssProperty: false,
+    themeKey: 'typography'
+  }
+};
+export default defaultSxConfig;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/styleFunctionSx/extendSxProp.js b/ddb_main/node_modules/@mui/system/esm/styleFunctionSx/extendSxProp.js
new file mode 100644
index 0000000..5c6dcb2
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/styleFunctionSx/extendSxProp.js
@@ -0,0 +1,48 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["sx"];
+import { isPlainObject } from '@mui/utils/deepmerge';
+import defaultSxConfig from './defaultSxConfig';
+const splitProps = props => {
+  var _props$theme$unstable, _props$theme;
+  const result = {
+    systemProps: {},
+    otherProps: {}
+  };
+  const config = (_props$theme$unstable = props == null || (_props$theme = props.theme) == null ? void 0 : _props$theme.unstable_sxConfig) != null ? _props$theme$unstable : defaultSxConfig;
+  Object.keys(props).forEach(prop => {
+    if (config[prop]) {
+      result.systemProps[prop] = props[prop];
+    } else {
+      result.otherProps[prop] = props[prop];
+    }
+  });
+  return result;
+};
+export default function extendSxProp(props) {
+  const {
+      sx: inSx
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const {
+    systemProps,
+    otherProps
+  } = splitProps(other);
+  let finalSx;
+  if (Array.isArray(inSx)) {
+    finalSx = [systemProps, ...inSx];
+  } else if (typeof inSx === 'function') {
+    finalSx = (...args) => {
+      const result = inSx(...args);
+      if (!isPlainObject(result)) {
+        return systemProps;
+      }
+      return _extends({}, systemProps, result);
+    };
+  } else {
+    finalSx = _extends({}, systemProps, inSx);
+  }
+  return _extends({}, otherProps, {
+    sx: finalSx
+  });
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/styleFunctionSx/styleFunctionSx.js b/ddb_main/node_modules/@mui/system/esm/styleFunctionSx/styleFunctionSx.js
new file mode 100644
index 0000000..02d0c02
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/styleFunctionSx/styleFunctionSx.js
@@ -0,0 +1,127 @@
+import capitalize from '@mui/utils/capitalize';
+import merge from '../merge';
+import { getPath, getStyleValue as getValue } from '../style';
+import { handleBreakpoints, createEmptyBreakpointObject, removeUnusedBreakpoints } from '../breakpoints';
+import defaultSxConfig from './defaultSxConfig';
+function objectsHaveSameKeys(...objects) {
+  const allKeys = objects.reduce((keys, object) => keys.concat(Object.keys(object)), []);
+  const union = new Set(allKeys);
+  return objects.every(object => union.size === Object.keys(object).length);
+}
+function callIfFn(maybeFn, arg) {
+  return typeof maybeFn === 'function' ? maybeFn(arg) : maybeFn;
+}
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+export function unstable_createStyleFunctionSx() {
+  function getThemeValue(prop, val, theme, config) {
+    const props = {
+      [prop]: val,
+      theme
+    };
+    const options = config[prop];
+    if (!options) {
+      return {
+        [prop]: val
+      };
+    }
+    const {
+      cssProperty = prop,
+      themeKey,
+      transform,
+      style
+    } = options;
+    if (val == null) {
+      return null;
+    }
+
+    // TODO v6: remove, see https://github.com/mui/material-ui/pull/38123
+    if (themeKey === 'typography' && val === 'inherit') {
+      return {
+        [prop]: val
+      };
+    }
+    const themeMapping = getPath(theme, themeKey) || {};
+    if (style) {
+      return style(props);
+    }
+    const styleFromPropValue = propValueFinal => {
+      let value = getValue(themeMapping, transform, propValueFinal);
+      if (propValueFinal === value && typeof propValueFinal === 'string') {
+        // Haven't found value
+        value = getValue(themeMapping, transform, `${prop}${propValueFinal === 'default' ? '' : capitalize(propValueFinal)}`, propValueFinal);
+      }
+      if (cssProperty === false) {
+        return value;
+      }
+      return {
+        [cssProperty]: value
+      };
+    };
+    return handleBreakpoints(props, val, styleFromPropValue);
+  }
+  function styleFunctionSx(props) {
+    var _theme$unstable_sxCon;
+    const {
+      sx,
+      theme = {}
+    } = props || {};
+    if (!sx) {
+      return null; // Emotion & styled-components will neglect null
+    }
+    const config = (_theme$unstable_sxCon = theme.unstable_sxConfig) != null ? _theme$unstable_sxCon : defaultSxConfig;
+
+    /*
+     * Receive `sxInput` as object or callback
+     * and then recursively check keys & values to create media query object styles.
+     * (the result will be used in `styled`)
+     */
+    function traverse(sxInput) {
+      let sxObject = sxInput;
+      if (typeof sxInput === 'function') {
+        sxObject = sxInput(theme);
+      } else if (typeof sxInput !== 'object') {
+        // value
+        return sxInput;
+      }
+      if (!sxObject) {
+        return null;
+      }
+      const emptyBreakpoints = createEmptyBreakpointObject(theme.breakpoints);
+      const breakpointsKeys = Object.keys(emptyBreakpoints);
+      let css = emptyBreakpoints;
+      Object.keys(sxObject).forEach(styleKey => {
+        const value = callIfFn(sxObject[styleKey], theme);
+        if (value !== null && value !== undefined) {
+          if (typeof value === 'object') {
+            if (config[styleKey]) {
+              css = merge(css, getThemeValue(styleKey, value, theme, config));
+            } else {
+              const breakpointsValues = handleBreakpoints({
+                theme
+              }, value, x => ({
+                [styleKey]: x
+              }));
+              if (objectsHaveSameKeys(breakpointsValues, value)) {
+                css[styleKey] = styleFunctionSx({
+                  sx: value,
+                  theme
+                });
+              } else {
+                css = merge(css, breakpointsValues);
+              }
+            }
+          } else {
+            css = merge(css, getThemeValue(styleKey, value, theme, config));
+          }
+        }
+      });
+      return removeUnusedBreakpoints(breakpointsKeys, css);
+    }
+    return Array.isArray(sx) ? sx.map(traverse) : traverse(sx);
+  }
+  return styleFunctionSx;
+}
+const styleFunctionSx = unstable_createStyleFunctionSx();
+styleFunctionSx.filterProps = ['sx'];
+export default styleFunctionSx;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/styled.js b/ddb_main/node_modules/@mui/system/esm/styled.js
new file mode 100644
index 0000000..c7f670e
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/styled.js
@@ -0,0 +1,3 @@
+import createStyled from './createStyled';
+const styled = createStyled();
+export default styled;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/useMediaQuery/useMediaQuery.js b/ddb_main/node_modules/@mui/system/esm/useMediaQuery/useMediaQuery.js
new file mode 100644
index 0000000..6fa78f1
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/useMediaQuery/useMediaQuery.js
@@ -0,0 +1,126 @@
+'use client';
+
+import * as React from 'react';
+import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
+import { getThemeProps } from '../useThemeProps';
+import useTheme from '../useThemeWithoutDefault';
+
+/**
+ * @deprecated Not used internally. Use `MediaQueryListEvent` from lib.dom.d.ts instead.
+ */
+
+/**
+ * @deprecated Not used internally. Use `MediaQueryList` from lib.dom.d.ts instead.
+ */
+
+/**
+ * @deprecated Not used internally. Use `(event: MediaQueryListEvent) => void` instead.
+ */
+
+function useMediaQueryOld(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr) {
+  const [match, setMatch] = React.useState(() => {
+    if (noSsr && matchMedia) {
+      return matchMedia(query).matches;
+    }
+    if (ssrMatchMedia) {
+      return ssrMatchMedia(query).matches;
+    }
+
+    // Once the component is mounted, we rely on the
+    // event listeners to return the correct matches value.
+    return defaultMatches;
+  });
+  useEnhancedEffect(() => {
+    let active = true;
+    if (!matchMedia) {
+      return undefined;
+    }
+    const queryList = matchMedia(query);
+    const updateMatch = () => {
+      // Workaround Safari wrong implementation of matchMedia
+      // TODO can we remove it?
+      // https://github.com/mui/material-ui/pull/17315#issuecomment-528286677
+      if (active) {
+        setMatch(queryList.matches);
+      }
+    };
+    updateMatch();
+    // TODO: Use `addEventListener` once support for Safari < 14 is dropped
+    queryList.addListener(updateMatch);
+    return () => {
+      active = false;
+      queryList.removeListener(updateMatch);
+    };
+  }, [query, matchMedia]);
+  return match;
+}
+
+// eslint-disable-next-line no-useless-concat -- Workaround for https://github.com/webpack/webpack/issues/14814
+const maybeReactUseSyncExternalStore = React['useSyncExternalStore' + ''];
+function useMediaQueryNew(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr) {
+  const getDefaultSnapshot = React.useCallback(() => defaultMatches, [defaultMatches]);
+  const getServerSnapshot = React.useMemo(() => {
+    if (noSsr && matchMedia) {
+      return () => matchMedia(query).matches;
+    }
+    if (ssrMatchMedia !== null) {
+      const {
+        matches
+      } = ssrMatchMedia(query);
+      return () => matches;
+    }
+    return getDefaultSnapshot;
+  }, [getDefaultSnapshot, query, ssrMatchMedia, noSsr, matchMedia]);
+  const [getSnapshot, subscribe] = React.useMemo(() => {
+    if (matchMedia === null) {
+      return [getDefaultSnapshot, () => () => {}];
+    }
+    const mediaQueryList = matchMedia(query);
+    return [() => mediaQueryList.matches, notify => {
+      // TODO: Use `addEventListener` once support for Safari < 14 is dropped
+      mediaQueryList.addListener(notify);
+      return () => {
+        mediaQueryList.removeListener(notify);
+      };
+    }];
+  }, [getDefaultSnapshot, matchMedia, query]);
+  const match = maybeReactUseSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+  return match;
+}
+export default function useMediaQuery(queryInput, options = {}) {
+  const theme = useTheme();
+  // Wait for jsdom to support the match media feature.
+  // All the browsers MUI support have this built-in.
+  // This defensive check is here for simplicity.
+  // Most of the time, the match media logic isn't central to people tests.
+  const supportMatchMedia = typeof window !== 'undefined' && typeof window.matchMedia !== 'undefined';
+  const {
+    defaultMatches = false,
+    matchMedia = supportMatchMedia ? window.matchMedia : null,
+    ssrMatchMedia = null,
+    noSsr = false
+  } = getThemeProps({
+    name: 'MuiUseMediaQuery',
+    props: options,
+    theme
+  });
+  if (process.env.NODE_ENV !== 'production') {
+    if (typeof queryInput === 'function' && theme === null) {
+      console.error(['MUI: The `query` argument provided is invalid.', 'You are providing a function without a theme in the context.', 'One of the parent elements needs to use a ThemeProvider.'].join('\n'));
+    }
+  }
+  let query = typeof queryInput === 'function' ? queryInput(theme) : queryInput;
+  query = query.replace(/^@media( ?)/m, '');
+
+  // TODO: Drop `useMediaQueryOld` and use  `use-sync-external-store` shim in `useMediaQueryNew` once the package is stable
+  const useMediaQueryImplementation = maybeReactUseSyncExternalStore !== undefined ? useMediaQueryNew : useMediaQueryOld;
+  const match = useMediaQueryImplementation(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr);
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useDebugValue({
+      query,
+      match
+    });
+  }
+  return match;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/useTheme.js b/ddb_main/node_modules/@mui/system/esm/useTheme.js
new file mode 100644
index 0000000..7e9004a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/useTheme.js
@@ -0,0 +1,9 @@
+'use client';
+
+import createTheme from './createTheme';
+import useThemeWithoutDefault from './useThemeWithoutDefault';
+export const systemDefaultTheme = createTheme();
+function useTheme(defaultTheme = systemDefaultTheme) {
+  return useThemeWithoutDefault(defaultTheme);
+}
+export default useTheme;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/useThemeProps/getThemeProps.js b/ddb_main/node_modules/@mui/system/esm/useThemeProps/getThemeProps.js
new file mode 100644
index 0000000..ede1266
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/useThemeProps/getThemeProps.js
@@ -0,0 +1,12 @@
+import resolveProps from '@mui/utils/resolveProps';
+export default function getThemeProps(params) {
+  const {
+    theme,
+    name,
+    props
+  } = params;
+  if (!theme || !theme.components || !theme.components[name] || !theme.components[name].defaultProps) {
+    return props;
+  }
+  return resolveProps(theme.components[name].defaultProps, props);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/useThemeProps/useThemeProps.js b/ddb_main/node_modules/@mui/system/esm/useThemeProps/useThemeProps.js
new file mode 100644
index 0000000..545f227
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/useThemeProps/useThemeProps.js
@@ -0,0 +1,21 @@
+'use client';
+
+import getThemeProps from './getThemeProps';
+import useTheme from '../useTheme';
+export default function useThemeProps({
+  props,
+  name,
+  defaultTheme,
+  themeId
+}) {
+  let theme = useTheme(defaultTheme);
+  if (themeId) {
+    theme = theme[themeId] || theme;
+  }
+  const mergedProps = getThemeProps({
+    theme,
+    name,
+    props
+  });
+  return mergedProps;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/system/esm/useThemeWithoutDefault.js b/ddb_main/node_modules/@mui/system/esm/useThemeWithoutDefault.js
new file mode 100644
index 0000000..6f94dda
--- /dev/null
+++ b/ddb_main/node_modules/@mui/system/esm/useThemeWithoutDefault.js
@@ -0,0 +1,12 @@
+'use client';
+
+import * as React from 'react';
+import { ThemeContext } from '@mui/styled-engine';
+function isObjectEmpty(obj) {
+  return Object.keys(obj).length === 0;
+}
+function useTheme(defaultTheme = null) {
+  const contextTheme = React.useContext(ThemeContext);
+  return !contextTheme || isObjectEmpty(contextTheme) ? defaultTheme : contextTheme;
+}
+export default useTheme;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/ClassNameGenerator/ClassNameGenerator.js b/ddb_main/node_modules/@mui/utils/ClassNameGenerator/ClassNameGenerator.js
new file mode 100644
index 0000000..f4057f4
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/ClassNameGenerator/ClassNameGenerator.js
@@ -0,0 +1,17 @@
+const defaultGenerator = componentName => componentName;
+const createClassNameGenerator = () => {
+  let generate = defaultGenerator;
+  return {
+    configure(generator) {
+      generate = generator;
+    },
+    generate(componentName) {
+      return generate(componentName);
+    },
+    reset() {
+      generate = defaultGenerator;
+    }
+  };
+};
+const ClassNameGenerator = createClassNameGenerator();
+export default ClassNameGenerator;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/capitalize/capitalize.js b/ddb_main/node_modules/@mui/utils/capitalize/capitalize.js
new file mode 100644
index 0000000..f830e7b
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/capitalize/capitalize.js
@@ -0,0 +1,11 @@
+import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
+// It should to be noted that this function isn't equivalent to `text-transform: capitalize`.
+//
+// A strict capitalization should uppercase the first letter of each word in the sentence.
+// We only handle the first word.
+export default function capitalize(string) {
+  if (typeof string !== 'string') {
+    throw new Error(process.env.NODE_ENV !== "production" ? `MUI: \`capitalize(string)\` expects a string argument.` : _formatMuiErrorMessage(7));
+  }
+  return string.charAt(0).toUpperCase() + string.slice(1);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/clamp/clamp.js b/ddb_main/node_modules/@mui/utils/clamp/clamp.js
new file mode 100644
index 0000000..acf806c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/clamp/clamp.js
@@ -0,0 +1,4 @@
+function clamp(val, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER) {
+  return Math.max(min, Math.min(val, max));
+}
+export default clamp;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/composeClasses/composeClasses.js b/ddb_main/node_modules/@mui/utils/composeClasses/composeClasses.js
new file mode 100644
index 0000000..3effa00
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/composeClasses/composeClasses.js
@@ -0,0 +1,21 @@
+export default function composeClasses(slots, getUtilityClass, classes = undefined) {
+  const output = {};
+  Object.keys(slots).forEach(
+  // `Object.keys(slots)` can't be wider than `T` because we infer `T` from `slots`.
+  // @ts-expect-error https://github.com/microsoft/TypeScript/pull/12253#issuecomment-263132208
+  slot => {
+    output[slot] = slots[slot].reduce((acc, key) => {
+      if (key) {
+        const utilityClass = getUtilityClass(key);
+        if (utilityClass !== '') {
+          acc.push(utilityClass);
+        }
+        if (classes && classes[key]) {
+          acc.push(classes[key]);
+        }
+      }
+      return acc;
+    }, []).join(' ');
+  });
+  return output;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/createChainedFunction/createChainedFunction.js b/ddb_main/node_modules/@mui/utils/createChainedFunction/createChainedFunction.js
new file mode 100644
index 0000000..d50de6f
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/createChainedFunction/createChainedFunction.js
@@ -0,0 +1,17 @@
+/**
+ * Safe chained function.
+ *
+ * Will only create a new function if needed,
+ * otherwise will pass back existing functions or null.
+ */
+export default function createChainedFunction(...funcs) {
+  return funcs.reduce((acc, func) => {
+    if (func == null) {
+      return acc;
+    }
+    return function chainedFunction(...args) {
+      acc.apply(this, args);
+      func.apply(this, args);
+    };
+  }, () => {});
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/debounce/debounce.js b/ddb_main/node_modules/@mui/utils/debounce/debounce.js
new file mode 100644
index 0000000..20b932d
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/debounce/debounce.js
@@ -0,0 +1,17 @@
+// Corresponds to 10 frames at 60 Hz.
+// A few bytes payload overhead when lodash/debounce is ~3 kB and debounce ~300 B.
+export default function debounce(func, wait = 166) {
+  let timeout;
+  function debounced(...args) {
+    const later = () => {
+      // @ts-ignore
+      func.apply(this, args);
+    };
+    clearTimeout(timeout);
+    timeout = setTimeout(later, wait);
+  }
+  debounced.clear = () => {
+    clearTimeout(timeout);
+  };
+  return debounced;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/deepmerge/deepmerge.js b/ddb_main/node_modules/@mui/utils/deepmerge/deepmerge.js
new file mode 100644
index 0000000..e8c7c12
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/deepmerge/deepmerge.js
@@ -0,0 +1,41 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+// https://github.com/sindresorhus/is-plain-obj/blob/main/index.js
+export function isPlainObject(item) {
+  if (typeof item !== 'object' || item === null) {
+    return false;
+  }
+  const prototype = Object.getPrototypeOf(item);
+  return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in item) && !(Symbol.iterator in item);
+}
+function deepClone(source) {
+  if (!isPlainObject(source)) {
+    return source;
+  }
+  const output = {};
+  Object.keys(source).forEach(key => {
+    output[key] = deepClone(source[key]);
+  });
+  return output;
+}
+export default function deepmerge(target, source, options = {
+  clone: true
+}) {
+  const output = options.clone ? _extends({}, target) : target;
+  if (isPlainObject(target) && isPlainObject(source)) {
+    Object.keys(source).forEach(key => {
+      // Avoid prototype pollution
+      if (key === '__proto__') {
+        return;
+      }
+      if (isPlainObject(source[key]) && key in target && isPlainObject(target[key])) {
+        // Since `output` is a clone of `target` and we have narrowed `target` in this block we can cast to the same type.
+        output[key] = deepmerge(target[key], source[key], options);
+      } else if (options.clone) {
+        output[key] = isPlainObject(source[key]) ? deepClone(source[key]) : source[key];
+      } else {
+        output[key] = source[key];
+      }
+    });
+  }
+  return output;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/deprecatedPropType/deprecatedPropType.js b/ddb_main/node_modules/@mui/utils/deprecatedPropType/deprecatedPropType.js
new file mode 100644
index 0000000..64c31d6
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/deprecatedPropType/deprecatedPropType.js
@@ -0,0 +1,13 @@
+export default function deprecatedPropType(validator, reason) {
+  if (process.env.NODE_ENV === 'production') {
+    return () => null;
+  }
+  return (props, propName, componentName, location, propFullName) => {
+    const componentNameSafe = componentName || '<<anonymous>>';
+    const propFullNameSafe = propFullName || propName;
+    if (typeof props[propName] !== 'undefined') {
+      return new Error(`The ${location} \`${propFullNameSafe}\` of ` + `\`${componentNameSafe}\` is deprecated. ${reason}`);
+    }
+    return null;
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/formatMuiErrorMessage/formatMuiErrorMessage.js b/ddb_main/node_modules/@mui/utils/formatMuiErrorMessage/formatMuiErrorMessage.js
new file mode 100644
index 0000000..8fb5413
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/formatMuiErrorMessage/formatMuiErrorMessage.js
@@ -0,0 +1,19 @@
+/**
+ * WARNING: Don't import this directly.
+ * Use `MuiError` from `@mui/internal-babel-macros/MuiError.macro` instead.
+ * @param {number} code
+ */
+export default function formatMuiErrorMessage(code) {
+  // Apply babel-plugin-transform-template-literals in loose mode
+  // loose mode is safe if we're concatenating primitives
+  // see https://babeljs.io/docs/en/babel-plugin-transform-template-literals#loose
+  /* eslint-disable prefer-template */
+  let url = 'https://mui.com/production-error/?code=' + code;
+  for (let i = 1; i < arguments.length; i += 1) {
+    // rest params over-transpile for this case
+    // eslint-disable-next-line prefer-rest-params
+    url += '&args[]=' + encodeURIComponent(arguments[i]);
+  }
+  return 'Minified MUI error #' + code + '; visit ' + url + ' for the full message.';
+  /* eslint-enable prefer-template */
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/generateUtilityClass/generateUtilityClass.js b/ddb_main/node_modules/@mui/utils/generateUtilityClass/generateUtilityClass.js
new file mode 100644
index 0000000..bf5342a
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/generateUtilityClass/generateUtilityClass.js
@@ -0,0 +1,22 @@
+import ClassNameGenerator from '../ClassNameGenerator';
+export const globalStateClasses = {
+  active: 'active',
+  checked: 'checked',
+  completed: 'completed',
+  disabled: 'disabled',
+  error: 'error',
+  expanded: 'expanded',
+  focused: 'focused',
+  focusVisible: 'focusVisible',
+  open: 'open',
+  readOnly: 'readOnly',
+  required: 'required',
+  selected: 'selected'
+};
+export default function generateUtilityClass(componentName, slot, globalStatePrefix = 'Mui') {
+  const globalStateClass = globalStateClasses[slot];
+  return globalStateClass ? `${globalStatePrefix}-${globalStateClass}` : `${ClassNameGenerator.generate(componentName)}-${slot}`;
+}
+export function isGlobalState(slot) {
+  return globalStateClasses[slot] !== undefined;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/generateUtilityClasses/generateUtilityClasses.js b/ddb_main/node_modules/@mui/utils/generateUtilityClasses/generateUtilityClasses.js
new file mode 100644
index 0000000..8f4f646
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/generateUtilityClasses/generateUtilityClasses.js
@@ -0,0 +1,8 @@
+import generateUtilityClass from '../generateUtilityClass';
+export default function generateUtilityClasses(componentName, slots, globalStatePrefix = 'Mui') {
+  const result = {};
+  slots.forEach(slot => {
+    result[slot] = generateUtilityClass(componentName, slot, globalStatePrefix);
+  });
+  return result;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/getDisplayName/getDisplayName.js b/ddb_main/node_modules/@mui/utils/getDisplayName/getDisplayName.js
new file mode 100644
index 0000000..f4e7d6f
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/getDisplayName/getDisplayName.js
@@ -0,0 +1,47 @@
+import { ForwardRef, Memo } from 'react-is';
+
+// Simplified polyfill for IE11 support
+// https://github.com/JamesMGreene/Function.name/blob/58b314d4a983110c3682f1228f845d39ccca1817/Function.name.js#L3
+const fnNameMatchRegex = /^\s*function(?:\s|\s*\/\*.*\*\/\s*)+([^(\s/]*)\s*/;
+export function getFunctionName(fn) {
+  const match = `${fn}`.match(fnNameMatchRegex);
+  const name = match && match[1];
+  return name || '';
+}
+function getFunctionComponentName(Component, fallback = '') {
+  return Component.displayName || Component.name || getFunctionName(Component) || fallback;
+}
+function getWrappedName(outerType, innerType, wrapperName) {
+  const functionName = getFunctionComponentName(innerType);
+  return outerType.displayName || (functionName !== '' ? `${wrapperName}(${functionName})` : wrapperName);
+}
+
+/**
+ * cherry-pick from
+ * https://github.com/facebook/react/blob/769b1f270e1251d9dbdce0fcbd9e92e502d059b8/packages/shared/getComponentName.js
+ * originally forked from recompose/getDisplayName with added IE11 support
+ */
+export default function getDisplayName(Component) {
+  if (Component == null) {
+    return undefined;
+  }
+  if (typeof Component === 'string') {
+    return Component;
+  }
+  if (typeof Component === 'function') {
+    return getFunctionComponentName(Component, 'Component');
+  }
+
+  // TypeScript can't have components as objects but they exist in the form of `memo` or `Suspense`
+  if (typeof Component === 'object') {
+    switch (Component.$$typeof) {
+      case ForwardRef:
+        return getWrappedName(Component, Component.render, 'ForwardRef');
+      case Memo:
+        return getWrappedName(Component, Component.type, 'memo');
+      default:
+        return undefined;
+    }
+  }
+  return undefined;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/getScrollbarSize/getScrollbarSize.js b/ddb_main/node_modules/@mui/utils/getScrollbarSize/getScrollbarSize.js
new file mode 100644
index 0000000..7dff947
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/getScrollbarSize/getScrollbarSize.js
@@ -0,0 +1,7 @@
+// A change of the browser zoom change the scrollbar size.
+// Credit https://github.com/twbs/bootstrap/blob/488fd8afc535ca3a6ad4dc581f5e89217b6a36ac/js/src/util/scrollbar.js#L14-L18
+export default function getScrollbarSize(doc) {
+  // https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth#usage_notes
+  const documentWidth = doc.documentElement.clientWidth;
+  return Math.abs(window.innerWidth - documentWidth);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/getValidReactChildren/getValidReactChildren.js b/ddb_main/node_modules/@mui/utils/getValidReactChildren/getValidReactChildren.js
new file mode 100644
index 0000000..8c80e24
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/getValidReactChildren/getValidReactChildren.js
@@ -0,0 +1,11 @@
+import * as React from 'react';
+
+/**
+ * Gets only the valid children of a component,
+ * and ignores any nullish or falsy child.
+ *
+ * @param children the children
+ */
+export default function getValidReactChildren(children) {
+  return React.Children.toArray(children).filter(child => /*#__PURE__*/React.isValidElement(child));
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/isMuiElement/isMuiElement.js b/ddb_main/node_modules/@mui/utils/isMuiElement/isMuiElement.js
new file mode 100644
index 0000000..006bd2e
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/isMuiElement/isMuiElement.js
@@ -0,0 +1,8 @@
+import * as React from 'react';
+export default function isMuiElement(element, muiNames) {
+  var _muiName, _element$type;
+  return /*#__PURE__*/React.isValidElement(element) && muiNames.indexOf( // For server components `muiName` is avaialble in element.type._payload.value.muiName
+  // relevant info - https://github.com/facebook/react/blob/2807d781a08db8e9873687fccc25c0f12b4fb3d4/packages/react/src/ReactLazy.js#L45
+  // eslint-disable-next-line no-underscore-dangle
+  (_muiName = element.type.muiName) != null ? _muiName : (_element$type = element.type) == null || (_element$type = _element$type._payload) == null || (_element$type = _element$type.value) == null ? void 0 : _element$type.muiName) !== -1;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/ownerDocument/ownerDocument.js b/ddb_main/node_modules/@mui/utils/ownerDocument/ownerDocument.js
new file mode 100644
index 0000000..4879b65
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/ownerDocument/ownerDocument.js
@@ -0,0 +1,3 @@
+export default function ownerDocument(node) {
+  return node && node.ownerDocument || document;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/ownerWindow/ownerWindow.js b/ddb_main/node_modules/@mui/utils/ownerWindow/ownerWindow.js
new file mode 100644
index 0000000..b7e664c
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/ownerWindow/ownerWindow.js
@@ -0,0 +1,5 @@
+import ownerDocument from '../ownerDocument';
+export default function ownerWindow(node) {
+  const doc = ownerDocument(node);
+  return doc.defaultView || window;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/requirePropFactory/requirePropFactory.js b/ddb_main/node_modules/@mui/utils/requirePropFactory/requirePropFactory.js
new file mode 100644
index 0000000..7ecca17
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/requirePropFactory/requirePropFactory.js
@@ -0,0 +1,24 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+export default function requirePropFactory(componentNameInError, Component) {
+  if (process.env.NODE_ENV === 'production') {
+    return () => null;
+  }
+
+  // eslint-disable-next-line react/forbid-foreign-prop-types
+  const prevPropTypes = Component ? _extends({}, Component.propTypes) : null;
+  const requireProp = requiredProp => (props, propName, componentName, location, propFullName, ...args) => {
+    const propFullNameSafe = propFullName || propName;
+    const defaultTypeChecker = prevPropTypes == null ? void 0 : prevPropTypes[propFullNameSafe];
+    if (defaultTypeChecker) {
+      const typeCheckerResult = defaultTypeChecker(props, propName, componentName, location, propFullName, ...args);
+      if (typeCheckerResult) {
+        return typeCheckerResult;
+      }
+    }
+    if (typeof props[propName] !== 'undefined' && !props[requiredProp]) {
+      return new Error(`The prop \`${propFullNameSafe}\` of ` + `\`${componentNameInError}\` can only be used together with the \`${requiredProp}\` prop.`);
+    }
+    return null;
+  };
+  return requireProp;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/resolveProps/resolveProps.js b/ddb_main/node_modules/@mui/utils/resolveProps/resolveProps.js
new file mode 100644
index 0000000..24f58b6
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/resolveProps/resolveProps.js
@@ -0,0 +1,34 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+/**
+ * Add keys, values of `defaultProps` that does not exist in `props`
+ * @param {object} defaultProps
+ * @param {object} props
+ * @returns {object} resolved props
+ */
+export default function resolveProps(defaultProps, props) {
+  const output = _extends({}, props);
+  Object.keys(defaultProps).forEach(propName => {
+    if (propName.toString().match(/^(components|slots)$/)) {
+      output[propName] = _extends({}, defaultProps[propName], output[propName]);
+    } else if (propName.toString().match(/^(componentsProps|slotProps)$/)) {
+      const defaultSlotProps = defaultProps[propName] || {};
+      const slotProps = props[propName];
+      output[propName] = {};
+      if (!slotProps || !Object.keys(slotProps)) {
+        // Reduce the iteration if the slot props is empty
+        output[propName] = defaultSlotProps;
+      } else if (!defaultSlotProps || !Object.keys(defaultSlotProps)) {
+        // Reduce the iteration if the default slot props is empty
+        output[propName] = slotProps;
+      } else {
+        output[propName] = _extends({}, slotProps);
+        Object.keys(defaultSlotProps).forEach(slotPropName => {
+          output[propName][slotPropName] = resolveProps(defaultSlotProps[slotPropName], slotProps[slotPropName]);
+        });
+      }
+    } else if (output[propName] === undefined) {
+      output[propName] = defaultProps[propName];
+    }
+  });
+  return output;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/scrollLeft/scrollLeft.js b/ddb_main/node_modules/@mui/utils/scrollLeft/scrollLeft.js
new file mode 100644
index 0000000..6e60644
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/scrollLeft/scrollLeft.js
@@ -0,0 +1,70 @@
+// Source from https://github.com/alitaheri/normalize-scroll-left
+let cachedType;
+
+/**
+ * Based on the jquery plugin https://github.com/othree/jquery.rtl-scroll-type
+ *
+ * Types of scrollLeft, assuming scrollWidth=100 and direction is rtl.
+ *
+ * Type             | <- Most Left | Most Right -> | Initial
+ * ---------------- | ------------ | ------------- | -------
+ * default          | 0            | 100           | 100
+ * negative (spec*) | -100         | 0             | 0
+ * reverse          | 100          | 0             | 0
+ *
+ * Edge 85: default
+ * Safari 14: negative
+ * Chrome 85: negative
+ * Firefox 81: negative
+ * IE11: reverse
+ *
+ * spec* https://drafts.csswg.org/cssom-view/#dom-window-scroll
+ */
+export function detectScrollType() {
+  if (cachedType) {
+    return cachedType;
+  }
+  const dummy = document.createElement('div');
+  const container = document.createElement('div');
+  container.style.width = '10px';
+  container.style.height = '1px';
+  dummy.appendChild(container);
+  dummy.dir = 'rtl';
+  dummy.style.fontSize = '14px';
+  dummy.style.width = '4px';
+  dummy.style.height = '1px';
+  dummy.style.position = 'absolute';
+  dummy.style.top = '-1000px';
+  dummy.style.overflow = 'scroll';
+  document.body.appendChild(dummy);
+  cachedType = 'reverse';
+  if (dummy.scrollLeft > 0) {
+    cachedType = 'default';
+  } else {
+    dummy.scrollLeft = 1;
+    if (dummy.scrollLeft === 0) {
+      cachedType = 'negative';
+    }
+  }
+  document.body.removeChild(dummy);
+  return cachedType;
+}
+
+// Based on https://stackoverflow.com/a/24394376
+export function getNormalizedScrollLeft(element, direction) {
+  const scrollLeft = element.scrollLeft;
+
+  // Perform the calculations only when direction is rtl to avoid messing up the ltr behavior
+  if (direction !== 'rtl') {
+    return scrollLeft;
+  }
+  const type = detectScrollType();
+  switch (type) {
+    case 'negative':
+      return element.scrollWidth - element.clientWidth + scrollLeft;
+    case 'reverse':
+      return element.scrollWidth - element.clientWidth - scrollLeft;
+    default:
+      return scrollLeft;
+  }
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/setRef/setRef.js b/ddb_main/node_modules/@mui/utils/setRef/setRef.js
new file mode 100644
index 0000000..3a53825
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/setRef/setRef.js
@@ -0,0 +1,20 @@
+/**
+ * TODO v5: consider making it private
+ *
+ * passes {value} to {ref}
+ *
+ * WARNING: Be sure to only call this inside a callback that is passed as a ref.
+ * Otherwise, make sure to cleanup the previous {ref} if it changes. See
+ * https://github.com/mui/material-ui/issues/13539
+ *
+ * Useful if you want to expose the ref of an inner component to the public API
+ * while still using it inside the component.
+ * @param ref A ref callback or ref object. If anything falsy, this is a no-op.
+ */
+export default function setRef(ref, value) {
+  if (typeof ref === 'function') {
+    ref(value);
+  } else if (ref) {
+    ref.current = value;
+  }
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/unsupportedProp/unsupportedProp.js b/ddb_main/node_modules/@mui/utils/unsupportedProp/unsupportedProp.js
new file mode 100644
index 0000000..e545f09
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/unsupportedProp/unsupportedProp.js
@@ -0,0 +1,10 @@
+export default function unsupportedProp(props, propName, componentName, location, propFullName) {
+  if (process.env.NODE_ENV === 'production') {
+    return null;
+  }
+  const propFullNameSafe = propFullName || propName;
+  if (typeof props[propName] !== 'undefined') {
+    return new Error(`The prop \`${propFullNameSafe}\` is not supported. Please remove it.`);
+  }
+  return null;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/useControlled/useControlled.js b/ddb_main/node_modules/@mui/utils/useControlled/useControlled.js
new file mode 100644
index 0000000..8091d89
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/useControlled/useControlled.js
@@ -0,0 +1,38 @@
+'use client';
+
+/* eslint-disable react-hooks/rules-of-hooks, react-hooks/exhaustive-deps */
+import * as React from 'react';
+export default function useControlled({
+  controlled,
+  default: defaultProp,
+  name,
+  state = 'value'
+}) {
+  // isControlled is ignored in the hook dependency lists as it should never change.
+  const {
+    current: isControlled
+  } = React.useRef(controlled !== undefined);
+  const [valueState, setValue] = React.useState(defaultProp);
+  const value = isControlled ? controlled : valueState;
+  if (process.env.NODE_ENV !== 'production') {
+    React.useEffect(() => {
+      if (isControlled !== (controlled !== undefined)) {
+        console.error([`MUI: A component is changing the ${isControlled ? '' : 'un'}controlled ${state} state of ${name} to be ${isControlled ? 'un' : ''}controlled.`, 'Elements should not switch from uncontrolled to controlled (or vice versa).', `Decide between using a controlled or uncontrolled ${name} ` + 'element for the lifetime of the component.', "The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.", 'More info: https://fb.me/react-controlled-components'].join('\n'));
+      }
+    }, [state, name, controlled]);
+    const {
+      current: defaultValue
+    } = React.useRef(defaultProp);
+    React.useEffect(() => {
+      if (!isControlled && defaultValue !== defaultProp) {
+        console.error([`MUI: A component is changing the default ${state} state of an uncontrolled ${name} after being initialized. ` + `To suppress this warning opt to use a controlled ${name}.`].join('\n'));
+      }
+    }, [JSON.stringify(defaultProp)]);
+  }
+  const setValueIfUncontrolled = React.useCallback(newValue => {
+    if (!isControlled) {
+      setValue(newValue);
+    }
+  }, []);
+  return [value, setValueIfUncontrolled];
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/useEnhancedEffect/useEnhancedEffect.js b/ddb_main/node_modules/@mui/utils/useEnhancedEffect/useEnhancedEffect.js
new file mode 100644
index 0000000..49eae06
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/useEnhancedEffect/useEnhancedEffect.js
@@ -0,0 +1,13 @@
+'use client';
+
+import * as React from 'react';
+
+/**
+ * A version of `React.useLayoutEffect` that does not show a warning when server-side rendering.
+ * This is useful for effects that are only needed for client-side rendering but not for SSR.
+ *
+ * Before you use this hook, make sure to read https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85
+ * and confirm it doesn't apply to your use-case.
+ */
+const useEnhancedEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
+export default useEnhancedEffect;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/useEventCallback/useEventCallback.js b/ddb_main/node_modules/@mui/utils/useEventCallback/useEventCallback.js
new file mode 100644
index 0000000..2ee8273
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/useEventCallback/useEventCallback.js
@@ -0,0 +1,20 @@
+'use client';
+
+import * as React from 'react';
+import useEnhancedEffect from '../useEnhancedEffect';
+
+/**
+ * Inspired by https://github.com/facebook/react/issues/14099#issuecomment-440013892
+ * See RFC in https://github.com/reactjs/rfcs/pull/220
+ */
+
+function useEventCallback(fn) {
+  const ref = React.useRef(fn);
+  useEnhancedEffect(() => {
+    ref.current = fn;
+  });
+  return React.useRef((...args) =>
+  // @ts-expect-error hide `this`
+  (0, ref.current)(...args)).current;
+}
+export default useEventCallback;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/useForkRef/useForkRef.js b/ddb_main/node_modules/@mui/utils/useForkRef/useForkRef.js
new file mode 100644
index 0000000..ef53a89
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/useForkRef/useForkRef.js
@@ -0,0 +1,22 @@
+'use client';
+
+import * as React from 'react';
+import setRef from '../setRef';
+export default function useForkRef(...refs) {
+  /**
+   * This will create a new function if the refs passed to this hook change and are all defined.
+   * This means react will call the old forkRef with `null` and the new forkRef
+   * with the ref. Cleanup naturally emerges from this behavior.
+   */
+  return React.useMemo(() => {
+    if (refs.every(ref => ref == null)) {
+      return null;
+    }
+    return instance => {
+      refs.forEach(ref => {
+        setRef(ref, instance);
+      });
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, refs);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/useId/useId.js b/ddb_main/node_modules/@mui/utils/useId/useId.js
new file mode 100644
index 0000000..f858929
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/useId/useId.js
@@ -0,0 +1,36 @@
+'use client';
+
+import * as React from 'react';
+let globalId = 0;
+function useGlobalId(idOverride) {
+  const [defaultId, setDefaultId] = React.useState(idOverride);
+  const id = idOverride || defaultId;
+  React.useEffect(() => {
+    if (defaultId == null) {
+      // Fallback to this default id when possible.
+      // Use the incrementing value for client-side rendering only.
+      // We can't use it server-side.
+      // If you want to use random values please consider the Birthday Problem: https://en.wikipedia.org/wiki/Birthday_problem
+      globalId += 1;
+      setDefaultId(`mui-${globalId}`);
+    }
+  }, [defaultId]);
+  return id;
+}
+
+// downstream bundlers may remove unnecessary concatenation, but won't remove toString call -- Workaround for https://github.com/webpack/webpack/issues/14814
+const maybeReactUseId = React['useId'.toString()];
+/**
+ *
+ * @example <div id={useId()} />
+ * @param idOverride
+ * @returns {string}
+ */
+export default function useId(idOverride) {
+  if (maybeReactUseId !== undefined) {
+    const reactId = maybeReactUseId();
+    return idOverride != null ? idOverride : reactId;
+  }
+  // eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.
+  return useGlobalId(idOverride);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/useIsFocusVisible/useIsFocusVisible.js b/ddb_main/node_modules/@mui/utils/useIsFocusVisible/useIsFocusVisible.js
new file mode 100644
index 0000000..c2005fb
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/useIsFocusVisible/useIsFocusVisible.js
@@ -0,0 +1,163 @@
+'use client';
+
+// based on https://github.com/WICG/focus-visible/blob/v4.1.5/src/focus-visible.js
+import * as React from 'react';
+import { Timeout } from '../useTimeout/useTimeout';
+let hadKeyboardEvent = true;
+let hadFocusVisibleRecently = false;
+const hadFocusVisibleRecentlyTimeout = new Timeout();
+const inputTypesWhitelist = {
+  text: true,
+  search: true,
+  url: true,
+  tel: true,
+  email: true,
+  password: true,
+  number: true,
+  date: true,
+  month: true,
+  week: true,
+  time: true,
+  datetime: true,
+  'datetime-local': true
+};
+
+/**
+ * Computes whether the given element should automatically trigger the
+ * `focus-visible` class being added, i.e. whether it should always match
+ * `:focus-visible` when focused.
+ * @param {Element} node
+ * @returns {boolean}
+ */
+function focusTriggersKeyboardModality(node) {
+  const {
+    type,
+    tagName
+  } = node;
+  if (tagName === 'INPUT' && inputTypesWhitelist[type] && !node.readOnly) {
+    return true;
+  }
+  if (tagName === 'TEXTAREA' && !node.readOnly) {
+    return true;
+  }
+  if (node.isContentEditable) {
+    return true;
+  }
+  return false;
+}
+
+/**
+ * Keep track of our keyboard modality state with `hadKeyboardEvent`.
+ * If the most recent user interaction was via the keyboard;
+ * and the key press did not include a meta, alt/option, or control key;
+ * then the modality is keyboard. Otherwise, the modality is not keyboard.
+ * @param {KeyboardEvent} event
+ */
+function handleKeyDown(event) {
+  if (event.metaKey || event.altKey || event.ctrlKey) {
+    return;
+  }
+  hadKeyboardEvent = true;
+}
+
+/**
+ * If at any point a user clicks with a pointing device, ensure that we change
+ * the modality away from keyboard.
+ * This avoids the situation where a user presses a key on an already focused
+ * element, and then clicks on a different element, focusing it with a
+ * pointing device, while we still think we're in keyboard modality.
+ */
+function handlePointerDown() {
+  hadKeyboardEvent = false;
+}
+function handleVisibilityChange() {
+  if (this.visibilityState === 'hidden') {
+    // If the tab becomes active again, the browser will handle calling focus
+    // on the element (Safari actually calls it twice).
+    // If this tab change caused a blur on an element with focus-visible,
+    // re-apply the class when the user switches back to the tab.
+    if (hadFocusVisibleRecently) {
+      hadKeyboardEvent = true;
+    }
+  }
+}
+function prepare(doc) {
+  doc.addEventListener('keydown', handleKeyDown, true);
+  doc.addEventListener('mousedown', handlePointerDown, true);
+  doc.addEventListener('pointerdown', handlePointerDown, true);
+  doc.addEventListener('touchstart', handlePointerDown, true);
+  doc.addEventListener('visibilitychange', handleVisibilityChange, true);
+}
+export function teardown(doc) {
+  doc.removeEventListener('keydown', handleKeyDown, true);
+  doc.removeEventListener('mousedown', handlePointerDown, true);
+  doc.removeEventListener('pointerdown', handlePointerDown, true);
+  doc.removeEventListener('touchstart', handlePointerDown, true);
+  doc.removeEventListener('visibilitychange', handleVisibilityChange, true);
+}
+function isFocusVisible(event) {
+  const {
+    target
+  } = event;
+  try {
+    return target.matches(':focus-visible');
+  } catch (error) {
+    // Browsers not implementing :focus-visible will throw a SyntaxError.
+    // We use our own heuristic for those browsers.
+    // Rethrow might be better if it's not the expected error but do we really
+    // want to crash if focus-visible malfunctioned?
+  }
+
+  // No need for validFocusTarget check. The user does that by attaching it to
+  // focusable events only.
+  return hadKeyboardEvent || focusTriggersKeyboardModality(target);
+}
+export default function useIsFocusVisible() {
+  const ref = React.useCallback(node => {
+    if (node != null) {
+      prepare(node.ownerDocument);
+    }
+  }, []);
+  const isFocusVisibleRef = React.useRef(false);
+
+  /**
+   * Should be called if a blur event is fired
+   */
+  function handleBlurVisible() {
+    // checking against potential state variable does not suffice if we focus and blur synchronously.
+    // React wouldn't have time to trigger a re-render so `focusVisible` would be stale.
+    // Ideally we would adjust `isFocusVisible(event)` to look at `relatedTarget` for blur events.
+    // This doesn't work in IE11 due to https://github.com/facebook/react/issues/3751
+    // TODO: check again if React releases their internal changes to focus event handling (https://github.com/facebook/react/pull/19186).
+    if (isFocusVisibleRef.current) {
+      // To detect a tab/window switch, we look for a blur event followed
+      // rapidly by a visibility change.
+      // If we don't see a visibility change within 100ms, it's probably a
+      // regular focus change.
+      hadFocusVisibleRecently = true;
+      hadFocusVisibleRecentlyTimeout.start(100, () => {
+        hadFocusVisibleRecently = false;
+      });
+      isFocusVisibleRef.current = false;
+      return true;
+    }
+    return false;
+  }
+
+  /**
+   * Should be called if a blur event is fired
+   */
+  function handleFocusVisible(event) {
+    if (isFocusVisible(event)) {
+      isFocusVisibleRef.current = true;
+      return true;
+    }
+    return false;
+  }
+  return {
+    isFocusVisibleRef,
+    onFocus: handleFocusVisible,
+    onBlur: handleBlurVisible,
+    ref
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/useLazyRef/useLazyRef.js b/ddb_main/node_modules/@mui/utils/useLazyRef/useLazyRef.js
new file mode 100644
index 0000000..4f3623d
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/useLazyRef/useLazyRef.js
@@ -0,0 +1,19 @@
+'use client';
+
+import * as React from 'react';
+const UNINITIALIZED = {};
+
+/**
+ * A React.useRef() that is initialized lazily with a function. Note that it accepts an optional
+ * initialization argument, so the initialization function doesn't need to be an inline closure.
+ *
+ * @usage
+ *   const ref = useLazyRef(sortColumns, columns)
+ */
+export default function useLazyRef(init, initArg) {
+  const ref = React.useRef(UNINITIALIZED);
+  if (ref.current === UNINITIALIZED) {
+    ref.current = init(initArg);
+  }
+  return ref;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/useOnMount/useOnMount.js b/ddb_main/node_modules/@mui/utils/useOnMount/useOnMount.js
new file mode 100644
index 0000000..a02ebf5
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/useOnMount/useOnMount.js
@@ -0,0 +1,13 @@
+'use client';
+
+import * as React from 'react';
+const EMPTY = [];
+
+/**
+ * A React.useEffect equivalent that runs once, when the component is mounted.
+ */
+export default function useOnMount(fn) {
+  /* eslint-disable react-hooks/exhaustive-deps */
+  React.useEffect(fn, EMPTY);
+  /* eslint-enable react-hooks/exhaustive-deps */
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/useTimeout/useTimeout.js b/ddb_main/node_modules/@mui/utils/useTimeout/useTimeout.js
new file mode 100644
index 0000000..fc750aa
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/useTimeout/useTimeout.js
@@ -0,0 +1,36 @@
+'use client';
+
+import useLazyRef from '../useLazyRef/useLazyRef';
+import useOnMount from '../useOnMount/useOnMount';
+export class Timeout {
+  constructor() {
+    this.currentId = null;
+    this.clear = () => {
+      if (this.currentId !== null) {
+        clearTimeout(this.currentId);
+        this.currentId = null;
+      }
+    };
+    this.disposeEffect = () => {
+      return this.clear;
+    };
+  }
+  static create() {
+    return new Timeout();
+  }
+  /**
+   * Executes `fn` after `delay`, clearing any previously scheduled call.
+   */
+  start(delay, fn) {
+    this.clear();
+    this.currentId = setTimeout(() => {
+      this.currentId = null;
+      fn();
+    }, delay);
+  }
+}
+export default function useTimeout() {
+  const timeout = useLazyRef(Timeout.create).current;
+  useOnMount(timeout.disposeEffect);
+  return timeout;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@mui/utils/visuallyHidden/visuallyHidden.js b/ddb_main/node_modules/@mui/utils/visuallyHidden/visuallyHidden.js
new file mode 100644
index 0000000..805d6b9
--- /dev/null
+++ b/ddb_main/node_modules/@mui/utils/visuallyHidden/visuallyHidden.js
@@ -0,0 +1,12 @@
+const visuallyHidden = {
+  border: 0,
+  clip: 'rect(0 0 0 0)',
+  height: '1px',
+  margin: '-1px',
+  overflow: 'hidden',
+  padding: 0,
+  position: 'absolute',
+  whiteSpace: 'nowrap',
+  width: '1px'
+};
+export default visuallyHidden;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@reactour/mask/dist/index.mjs b/ddb_main/node_modules/@reactour/mask/dist/index.mjs
new file mode 100644
index 0000000..dc746ff
--- /dev/null
+++ b/ddb_main/node_modules/@reactour/mask/dist/index.mjs
@@ -0,0 +1,190 @@
+// Mask.tsx
+import React from "react";
+
+// styles.tsx
+var defaultStyles = {
+  maskWrapper: () => ({
+    opacity: 0.7,
+    left: 0,
+    top: 0,
+    position: "fixed",
+    zIndex: 99999,
+    pointerEvents: "none",
+    color: "#000"
+  }),
+  svgWrapper: ({ windowWidth, windowHeight, wpt, wpl }) => ({
+    width: windowWidth,
+    height: windowHeight,
+    left: Number(wpl),
+    top: Number(wpt),
+    position: "fixed"
+  }),
+  maskArea: ({ x, y, width, height }) => ({
+    x,
+    y,
+    width,
+    height,
+    fill: "black",
+    rx: 0
+  }),
+  maskRect: ({ windowWidth, windowHeight, maskID }) => ({
+    x: 0,
+    y: 0,
+    width: windowWidth,
+    height: windowHeight,
+    fill: "currentColor",
+    mask: `url(#${maskID})`
+  }),
+  clickArea: ({ windowWidth, windowHeight, clipID }) => ({
+    x: 0,
+    y: 0,
+    width: windowWidth,
+    height: windowHeight,
+    fill: "currentcolor",
+    pointerEvents: "auto",
+    clipPath: `url(#${clipID})`
+  }),
+  highlightedArea: ({ x, y, width, height }) => ({
+    x,
+    y,
+    width,
+    height,
+    pointerEvents: "auto",
+    fill: "transparent",
+    display: "none"
+  })
+};
+function stylesMatcher(styles) {
+  return (key, state) => {
+    const base = defaultStyles[key](state);
+    const custom = styles[key];
+    return custom ? custom(base, state) : base;
+  };
+}
+
+// Mask.tsx
+import { safe, getWindow, getPadding } from "@reactour/utils";
+var Mask = ({
+  padding = 10,
+  wrapperPadding = 0,
+  onClick,
+  onClickHighlighted,
+  styles = {},
+  sizes,
+  className,
+  highlightedAreaClassName,
+  maskId,
+  clipId
+}) => {
+  const maskID = maskId || uniqueId("mask__");
+  const clipID = clipId || uniqueId("clip__");
+  const getStyles = stylesMatcher(styles);
+  const [pt, pr, pb, pl] = getPadding(padding);
+  const [wpt, wpr, wpb, wpl] = getPadding(wrapperPadding);
+  const { w, h } = getWindow();
+  const width = safe((sizes == null ? void 0 : sizes.width) + pl + pr);
+  const height = safe((sizes == null ? void 0 : sizes.height) + pt + pb);
+  const top = safe((sizes == null ? void 0 : sizes.top) - pt - wpt);
+  const left = safe((sizes == null ? void 0 : sizes.left) - pl - wpl);
+  const windowWidth = w - wpl - wpr;
+  const windowHeight = h - wpt - wpb;
+  const maskAreaStyles = getStyles("maskArea", {
+    x: left,
+    y: top,
+    width,
+    height
+  });
+  const highlightedAreaStyles = getStyles("highlightedArea", {
+    x: left,
+    y: top,
+    width,
+    height
+  });
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      style: getStyles("maskWrapper", {}),
+      onClick,
+      className
+    },
+    /* @__PURE__ */ React.createElement(
+      "svg",
+      {
+        width: windowWidth,
+        height: windowHeight,
+        xmlns: "http://www.w3.org/2000/svg",
+        style: getStyles("svgWrapper", {
+          windowWidth,
+          windowHeight,
+          wpt,
+          wpl
+        })
+      },
+      /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("mask", { id: maskID }, /* @__PURE__ */ React.createElement(
+        "rect",
+        {
+          x: 0,
+          y: 0,
+          width: windowWidth,
+          height: windowHeight,
+          fill: "white"
+        }
+      ), /* @__PURE__ */ React.createElement(
+        "rect",
+        {
+          style: maskAreaStyles,
+          rx: maskAreaStyles.rx ? 1 : void 0
+        }
+      )), /* @__PURE__ */ React.createElement("clipPath", { id: clipID }, /* @__PURE__ */ React.createElement(
+        "polygon",
+        {
+          points: `0 0, 0 ${windowHeight}, ${left} ${windowHeight}, ${left} ${top}, ${left + width} ${top}, ${left + width} ${top + height}, ${left} ${top + height}, ${left} ${windowHeight}, ${windowWidth} ${windowHeight}, ${windowWidth} 0`
+        }
+      ))),
+      /* @__PURE__ */ React.createElement(
+        "rect",
+        {
+          style: getStyles("maskRect", {
+            windowWidth,
+            windowHeight,
+            maskID
+          })
+        }
+      ),
+      /* @__PURE__ */ React.createElement(
+        "rect",
+        {
+          style: getStyles("clickArea", {
+            windowWidth,
+            windowHeight,
+            top,
+            left,
+            width,
+            height,
+            clipID
+          })
+        }
+      ),
+      /* @__PURE__ */ React.createElement(
+        "rect",
+        {
+          style: highlightedAreaStyles,
+          className: highlightedAreaClassName,
+          onClick: onClickHighlighted,
+          rx: highlightedAreaStyles.rx ? 1 : void 0
+        }
+      )
+    )
+  );
+};
+var Mask_default = Mask;
+function uniqueId(prefix) {
+  return prefix + Math.random().toString(36).substring(2, 16);
+}
+
+// index.tsx
+var mask_default = Mask_default;
+export {
+  Mask_default as Mask,
+  mask_default as default
+};
diff --git a/ddb_main/node_modules/@reactour/popover/dist/index.mjs b/ddb_main/node_modules/@reactour/popover/dist/index.mjs
new file mode 100644
index 0000000..a2190bd
--- /dev/null
+++ b/ddb_main/node_modules/@reactour/popover/dist/index.mjs
@@ -0,0 +1,217 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+
+// Popover.tsx
+import React, { useRef } from "react";
+import {
+  useRect,
+  bestPositionOf,
+  isOutsideX,
+  isOutsideY,
+  getWindow,
+  getPadding
+} from "@reactour/utils";
+
+// styles.tsx
+var defaultStyles = {
+  popover: () => ({
+    position: "fixed",
+    maxWidth: 353,
+    backgroundColor: "#fff",
+    padding: "24px 30px",
+    boxShadow: "0 0.5em 3em rgba(0, 0, 0, 0.3)",
+    color: "inherit",
+    zIndex: 1e5,
+    transition: "transform 0.3s",
+    top: 0,
+    left: 0
+  })
+};
+function stylesMatcher(styles) {
+  return (key, state) => {
+    const base = defaultStyles[key](state);
+    const custom = styles[key];
+    return custom ? custom(base, state) : base;
+  };
+}
+
+// Popover.tsx
+var Popover = (_a) => {
+  var _b = _a, {
+    children,
+    position: providedPosition = "bottom",
+    padding = 10,
+    styles = {},
+    sizes,
+    refresher
+  } = _b, props = __objRest(_b, [
+    "children",
+    "position",
+    "padding",
+    "styles",
+    "sizes",
+    "refresher"
+  ]);
+  const helperRef = useRef(null);
+  const positionRef = useRef("");
+  const verticalAlignRef = useRef("");
+  const horizontalAlignRef = useRef("");
+  const { w: windowWidth, h: windowHeight } = getWindow();
+  const getStyles = stylesMatcher(styles);
+  const helperRect = useRect(helperRef, refresher);
+  const { width: helperWidth, height: helperHeight } = helperRect;
+  const targetLeft = sizes == null ? void 0 : sizes.left;
+  const targetTop = sizes == null ? void 0 : sizes.top;
+  const targetRight = sizes == null ? void 0 : sizes.right;
+  const targetBottom = sizes == null ? void 0 : sizes.bottom;
+  const position = providedPosition && typeof providedPosition === "function" ? providedPosition(
+    {
+      width: helperWidth,
+      height: helperHeight,
+      windowWidth,
+      windowHeight,
+      top: targetTop,
+      left: targetLeft,
+      right: targetRight,
+      bottom: targetBottom,
+      x: sizes.x,
+      y: sizes.y
+    },
+    helperRect
+  ) : providedPosition;
+  const available = {
+    left: targetLeft,
+    right: windowWidth - targetRight,
+    top: targetTop,
+    bottom: windowHeight - targetBottom
+  };
+  const [pt, pr, pb, pl] = getPadding(padding);
+  const couldPositionAt = (position2, isOutsideX2, isOutsideY2) => {
+    switch (position2) {
+      case "top":
+        return available.top > helperHeight + pb;
+      case "right":
+        return isOutsideX2 ? false : available.right > helperWidth + pl;
+      case "bottom":
+        return isOutsideY2 ? false : available.bottom > helperHeight + pt;
+      case "left":
+        return available.left > helperWidth + pr;
+      default:
+        return false;
+    }
+  };
+  const autoPosition = (coords, outX, outY) => {
+    const positionsOrder = bestPositionOf(
+      available,
+      outY ? ["right", "left"] : outX ? ["top", "bottom"] : []
+    );
+    for (let j = 0; j < positionsOrder.length; j++) {
+      if (couldPositionAt(positionsOrder[j], outX, outY)) {
+        positionRef.current = positionsOrder[j];
+        return coords[positionsOrder[j]];
+      }
+    }
+    positionRef.current = "center";
+    return coords.center;
+  };
+  const pos = (helperPosition) => {
+    if (Array.isArray(helperPosition)) {
+      const isOutX = isOutsideX(helperPosition[0], windowWidth);
+      const isOutY = isOutsideY(helperPosition[1], windowHeight);
+      positionRef.current = "custom";
+      return [
+        isOutX ? windowWidth / 2 - helperWidth / 2 : helperPosition[0],
+        isOutY ? windowHeight / 2 - helperHeight / 2 : helperPosition[1]
+      ];
+    }
+    const isHelperOutsideX = isOutsideX(targetLeft + helperWidth, windowWidth);
+    const isHelperOutsideY = isOutsideY(
+      targetBottom + helperHeight,
+      windowHeight
+    );
+    const x = isHelperOutsideX ? Math.min(targetLeft, windowWidth - helperWidth) : Math.max(targetLeft, 0);
+    const y = isHelperOutsideY ? helperHeight > available.bottom ? Math.max(targetBottom - helperHeight, 0) : Math.max(targetTop, 0) : targetTop;
+    if (isHelperOutsideY) {
+      if (helperHeight > available.bottom) {
+        verticalAlignRef.current = "bottom";
+      } else {
+        verticalAlignRef.current = "top";
+      }
+    } else {
+      verticalAlignRef.current = "top";
+    }
+    if (isHelperOutsideX) {
+      horizontalAlignRef.current = "left";
+    } else {
+      horizontalAlignRef.current = "right";
+    }
+    const coords = {
+      top: [x - pl, targetTop - helperHeight - pb],
+      right: [targetRight + pl, y - pt],
+      bottom: [x - pl, targetBottom + pt],
+      left: [targetLeft - helperWidth - pr, y - pt],
+      center: [
+        windowWidth / 2 - helperWidth / 2,
+        windowHeight / 2 - helperHeight / 2
+      ]
+    };
+    if (helperPosition === "center" || couldPositionAt(helperPosition, isHelperOutsideX, isHelperOutsideY) && !isHelperOutsideX && !isHelperOutsideY) {
+      positionRef.current = helperPosition;
+      return coords[helperPosition];
+    }
+    return autoPosition(coords, isHelperOutsideX, isHelperOutsideY);
+  };
+  const p = pos(position);
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    __spreadValues({
+      className: "reactour__popover",
+      style: __spreadProps(__spreadValues({}, getStyles("popover", {
+        position: positionRef.current,
+        verticalAlign: verticalAlignRef.current,
+        horizontalAlign: horizontalAlignRef.current
+      })), {
+        transform: `translate(${Math.round(p[0])}px, ${Math.round(p[1])}px)`
+      }),
+      ref: helperRef
+    }, props),
+    children
+  );
+};
+var Popover_default = Popover;
+
+// index.tsx
+var popover_default = Popover_default;
+export {
+  Popover_default as Popover,
+  popover_default as default
+};
diff --git a/ddb_main/node_modules/@reactour/tour/dist/index.mjs b/ddb_main/node_modules/@reactour/tour/dist/index.mjs
new file mode 100644
index 0000000..a646f2a
--- /dev/null
+++ b/ddb_main/node_modules/@reactour/tour/dist/index.mjs
@@ -0,0 +1,978 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+
+// Tour.tsx
+import React6, { useEffect as useEffect3 } from "react";
+import { Observables } from "@reactour/utils";
+import { Mask } from "@reactour/mask";
+import { Popover } from "@reactour/popover";
+
+// hooks.tsx
+import { useEffect, useCallback, useState } from "react";
+import { inView, smoothScroll, getWindow, getRect } from "@reactour/utils";
+var initialState = {
+  bottom: 0,
+  height: 0,
+  left: 0,
+  right: 0,
+  top: 0,
+  width: 0,
+  windowWidth: 0,
+  windowHeight: 0,
+  x: 0,
+  y: 0
+};
+function useSizes(step, scrollOptions = {
+  block: "center",
+  behavior: "smooth",
+  inViewThreshold: 0
+}) {
+  const [transition, setTransition] = useState(false);
+  const [observing, setObserving] = useState(false);
+  const [isHighlightingObserved, setIsHighlightingObserved] = useState(false);
+  const [refresher, setRefresher] = useState(null);
+  const [dimensions, setDimensions] = useState(initialState);
+  const target = (step == null ? void 0 : step.selector) instanceof Element ? step == null ? void 0 : step.selector : document.querySelector(step == null ? void 0 : step.selector);
+  const handleResize = useCallback(() => {
+    const _a = getHighlightedRect(
+      target,
+      step == null ? void 0 : step.highlightedSelectors,
+      step == null ? void 0 : step.bypassElem
+    ), { hasHighligtedElems } = _a, newDimensions = __objRest(_a, ["hasHighligtedElems"]);
+    if (Object.entries(dimensions).some(
+      ([key, value]) => newDimensions[key] !== value
+    )) {
+      setDimensions(newDimensions);
+    }
+  }, [target, step == null ? void 0 : step.highlightedSelectors, dimensions]);
+  useEffect(() => {
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, [target, step == null ? void 0 : step.highlightedSelectors, refresher]);
+  useEffect(() => {
+    const isInView = inView(__spreadProps(__spreadValues({}, dimensions), {
+      threshold: scrollOptions.inViewThreshold
+    }));
+    if (!isInView && target) {
+      setTransition(true);
+      smoothScroll(target, scrollOptions).then(() => {
+        if (!observing)
+          setRefresher(Date.now());
+      }).finally(() => {
+        setTransition(false);
+      });
+    }
+  }, [dimensions]);
+  const observableRefresher = useCallback(() => {
+    setObserving(true);
+    const _a = getHighlightedRect(
+      target,
+      step == null ? void 0 : step.highlightedSelectors,
+      step == null ? void 0 : step.bypassElem
+    ), { hasHighligtedElems } = _a, dimesions = __objRest(_a, ["hasHighligtedElems"]);
+    setIsHighlightingObserved(hasHighligtedElems);
+    setDimensions(dimesions);
+    setObserving(false);
+  }, [target, step == null ? void 0 : step.highlightedSelectors, dimensions]);
+  return {
+    sizes: dimensions,
+    transition,
+    target,
+    observableRefresher,
+    isHighlightingObserved
+  };
+}
+function getHighlightedRect(node, highlightedSelectors = [], bypassElem = true) {
+  let hasHighligtedElems = false;
+  const { w: windowWidth, h: windowHeight } = getWindow();
+  if (!highlightedSelectors) {
+    return __spreadProps(__spreadValues({}, getRect(node)), {
+      windowWidth,
+      windowHeight,
+      hasHighligtedElems: false
+    });
+  }
+  let attrs = getRect(node);
+  let altAttrs = {
+    bottom: 0,
+    height: 0,
+    left: windowWidth,
+    right: 0,
+    top: windowHeight,
+    width: 0
+  };
+  for (const selector of highlightedSelectors) {
+    const element = document.querySelector(selector);
+    if (!element || element.style.display === "none" || element.style.visibility === "hidden") {
+      continue;
+    }
+    const rect = getRect(element);
+    hasHighligtedElems = true;
+    if (bypassElem || !node) {
+      if (rect.top < altAttrs.top) {
+        altAttrs.top = rect.top;
+      }
+      if (rect.right > altAttrs.right) {
+        altAttrs.right = rect.right;
+      }
+      if (rect.bottom > altAttrs.bottom) {
+        altAttrs.bottom = rect.bottom;
+      }
+      if (rect.left < altAttrs.left) {
+        altAttrs.left = rect.left;
+      }
+      altAttrs.width = altAttrs.right - altAttrs.left;
+      altAttrs.height = altAttrs.bottom - altAttrs.top;
+    } else {
+      if (rect.top < attrs.top) {
+        attrs.top = rect.top;
+      }
+      if (rect.right > attrs.right) {
+        attrs.right = rect.right;
+      }
+      if (rect.bottom > attrs.bottom) {
+        attrs.bottom = rect.bottom;
+      }
+      if (rect.left < attrs.left) {
+        attrs.left = rect.left;
+      }
+      attrs.width = attrs.right - attrs.left;
+      attrs.height = attrs.bottom - attrs.top;
+    }
+  }
+  const bypassable = bypassElem || !node ? altAttrs.width > 0 && altAttrs.height > 0 : false;
+  return {
+    left: (bypassable ? altAttrs : attrs).left,
+    top: (bypassable ? altAttrs : attrs).top,
+    right: (bypassable ? altAttrs : attrs).right,
+    bottom: (bypassable ? altAttrs : attrs).bottom,
+    width: (bypassable ? altAttrs : attrs).width,
+    height: (bypassable ? altAttrs : attrs).height,
+    windowWidth,
+    windowHeight,
+    hasHighligtedElems,
+    x: attrs.x,
+    y: attrs.y
+  };
+}
+
+// Keyboard.tsx
+import { useEffect as useEffect2 } from "react";
+var Keyboard = ({
+  disableKeyboardNavigation,
+  setCurrentStep,
+  currentStep,
+  setIsOpen,
+  stepsLength,
+  disable,
+  rtl,
+  clickProps,
+  keyboardHandler
+}) => {
+  function keyDownHandler(e) {
+    e.stopPropagation();
+    if (disableKeyboardNavigation === true || disable) {
+      return;
+    }
+    let isEscDisabled, isRightDisabled, isLeftDisabled;
+    if (disableKeyboardNavigation) {
+      isEscDisabled = disableKeyboardNavigation.includes("esc");
+      isRightDisabled = disableKeyboardNavigation.includes("right");
+      isLeftDisabled = disableKeyboardNavigation.includes("left");
+    }
+    function next() {
+      setCurrentStep(Math.min(currentStep + 1, stepsLength - 1));
+    }
+    function prev() {
+      setCurrentStep(Math.max(currentStep - 1, 0));
+    }
+    if (keyboardHandler && typeof keyboardHandler === "function") {
+      keyboardHandler(e, clickProps, {
+        isEscDisabled,
+        isRightDisabled,
+        isLeftDisabled
+      });
+    } else {
+      if (e.keyCode === 27 && !isEscDisabled) {
+        e.preventDefault();
+        setIsOpen(false);
+      }
+      if (e.keyCode === 39 && !isRightDisabled) {
+        e.preventDefault();
+        if (rtl) {
+          prev();
+        } else {
+          next();
+        }
+      }
+      if (e.keyCode === 37 && !isLeftDisabled) {
+        e.preventDefault();
+        if (rtl) {
+          next();
+        } else {
+          prev();
+        }
+      }
+    }
+  }
+  useEffect2(() => {
+    window.addEventListener("keydown", keyDownHandler, false);
+    return () => {
+      window.removeEventListener("keydown", keyDownHandler);
+    };
+  }, [disable, setCurrentStep, currentStep]);
+  return null;
+};
+var Keyboard_default = Keyboard;
+
+// components/PopoverContent.tsx
+import React5 from "react";
+
+// components/Badge.tsx
+import React2 from "react";
+
+// styles.tsx
+var defaultStyles = {
+  badge: () => ({
+    position: "absolute",
+    fontFamily: "monospace",
+    background: "var(--reactour-accent,#007aff)",
+    height: "1.875em",
+    lineHeight: 2,
+    paddingLeft: "0.8125em",
+    paddingRight: "0.8125em",
+    fontSize: "1em",
+    borderRadius: "1.625em",
+    color: "white",
+    textAlign: "center",
+    boxShadow: "0 0.25em 0.5em rgba(0, 0, 0, 0.3)",
+    top: "-0.8125em",
+    left: "-0.8125em"
+  }),
+  controls: () => ({
+    display: "flex",
+    marginTop: 24,
+    alignItems: "center",
+    justifyContent: "space-between"
+  }),
+  navigation: () => ({
+    counterReset: "dot",
+    display: "flex",
+    justifyContent: "space-between",
+    alignItems: "center",
+    flexWrap: "wrap"
+  }),
+  button: ({ disabled }) => ({
+    display: "block",
+    padding: 0,
+    border: 0,
+    background: "none",
+    cursor: disabled ? "not-allowed" : "pointer"
+  }),
+  arrow: ({ disabled }) => ({
+    color: disabled ? "#caccce" : "#646464",
+    width: 16,
+    height: 12,
+    flex: "0 0 16px"
+    // '&:hover': {
+    //   color: disabled ? '#caccce' : '#000',
+    // },
+  }),
+  dot: ({ current, disabled, showNumber }) => ({
+    counterIncrement: "dot",
+    width: 8,
+    height: 8,
+    border: current ? "0" : "1px solid #caccce",
+    borderRadius: "100%",
+    padding: 0,
+    display: "block",
+    margin: 4,
+    transition: "opacity 0.3s, transform 0.3s",
+    cursor: disabled ? "not-allowed" : "pointer",
+    transform: `scale(${current ? 1.25 : 1})`,
+    color: current ? "var(--reactour-accent, #007aff)" : "#caccce",
+    background: current ? "var(--reactour-accent, #007aff)" : "none"
+    // '&:before': {
+    //   content: 'counter(dot)',
+    //   position: 'absolute',
+    //   bottom: 'calc(100% + 0.25em)',
+    //   left: '50%',
+    //   opacity: 0,
+    //   transform: 'translate(-50%, 1em)',
+    //   transition: '0.3s',
+    //   display: showNumber ? 'block' : 'none',
+    // },
+    // '&:hover': {
+    //   backgroundColor: 'currentColor',
+    //   '&:before': {
+    //     opacity: 0.5,
+    //     transform: 'translate(-50%, -2px)',
+    //   },
+    // },
+  }),
+  close: ({ disabled }) => ({
+    position: "absolute",
+    top: 22,
+    right: 22,
+    width: 9,
+    height: 9,
+    "--rt-close-btn": disabled ? "#caccce" : "#5e5e5e",
+    "--rt-close-btn-disabled": disabled ? "#caccce" : "#000"
+  }),
+  svg: () => ({
+    display: "block"
+  })
+};
+function stylesMatcher(styles) {
+  return (key, state) => {
+    const base = defaultStyles[key](state);
+    const custom = styles[key];
+    return custom ? custom(base, state) : base;
+  };
+}
+
+// components/Badge.tsx
+var Badge = ({
+  styles = {},
+  children
+}) => {
+  const getStyles = stylesMatcher(styles);
+  return /* @__PURE__ */ React2.createElement("span", { style: getStyles("badge", {}) }, children);
+};
+var Badge_default = Badge;
+
+// components/Close.tsx
+import React3 from "react";
+var Close = (_a) => {
+  var _b = _a, {
+    styles = {},
+    onClick,
+    disabled
+  } = _b, props = __objRest(_b, [
+    "styles",
+    "onClick",
+    "disabled"
+  ]);
+  const getStyles = stylesMatcher(styles);
+  return /* @__PURE__ */ React3.createElement(
+    "button",
+    __spreadValues({
+      className: "reactour__close-button",
+      style: __spreadValues(__spreadValues({}, getStyles("button", {})), getStyles("close", { disabled })),
+      onClick
+    }, props),
+    /* @__PURE__ */ React3.createElement(
+      "svg",
+      {
+        viewBox: "0 0 9.1 9.1",
+        "aria-hidden": true,
+        role: "presentation",
+        style: __spreadValues({}, getStyles("svg", {}))
+      },
+      /* @__PURE__ */ React3.createElement(
+        "path",
+        {
+          fill: "currentColor",
+          d: "M5.9 4.5l2.8-2.8c.4-.4.4-1 0-1.4-.4-.4-1-.4-1.4 0L4.5 3.1 1.7.3C1.3-.1.7-.1.3.3c-.4.4-.4 1 0 1.4l2.8 2.8L.3 7.4c-.4.4-.4 1 0 1.4.2.2.4.3.7.3s.5-.1.7-.3L4.5 6l2.8 2.8c.3.2.5.3.8.3s.5-.1.7-.3c.4-.4.4-1 0-1.4L5.9 4.5z"
+        }
+      )
+    )
+  );
+};
+var Close_default = Close;
+
+// components/Content.tsx
+var Content = ({
+  content,
+  setCurrentStep,
+  transition,
+  isHighlightingObserved,
+  currentStep,
+  setIsOpen
+}) => {
+  return typeof content === "function" ? content({
+    setCurrentStep,
+    transition,
+    isHighlightingObserved,
+    currentStep,
+    setIsOpen
+  }) : content;
+};
+var Content_default = Content;
+
+// components/Navigation.tsx
+import React4 from "react";
+var Navigation = ({
+  styles = {},
+  steps,
+  setCurrentStep,
+  currentStep,
+  setIsOpen,
+  nextButton,
+  prevButton,
+  disableDots,
+  hideDots,
+  hideButtons,
+  disableAll,
+  rtl,
+  Arrow = DefaultArrow
+}) => {
+  const stepsLength = steps.length;
+  const getStyles = stylesMatcher(styles);
+  const Button = ({
+    onClick,
+    kind = "next",
+    children,
+    hideArrow
+  }) => {
+    function clickHandler() {
+      if (!disableAll) {
+        if (onClick && typeof onClick === "function") {
+          onClick();
+        } else {
+          if (kind === "next") {
+            setCurrentStep(Math.min(currentStep + 1, stepsLength - 1));
+          } else {
+            setCurrentStep(Math.max(currentStep - 1, 0));
+          }
+        }
+      }
+    }
+    return /* @__PURE__ */ React4.createElement(
+      "button",
+      {
+        style: getStyles("button", {
+          kind,
+          disabled: disableAll ? disableAll : kind === "next" ? stepsLength - 1 === currentStep : currentStep === 0
+        }),
+        onClick: clickHandler,
+        "aria-label": `Go to ${kind} step`
+      },
+      !hideArrow ? /* @__PURE__ */ React4.createElement(
+        Arrow,
+        {
+          styles,
+          inverted: rtl ? kind === "prev" : kind === "next",
+          disabled: disableAll ? disableAll : kind === "next" ? stepsLength - 1 === currentStep : currentStep === 0
+        }
+      ) : null,
+      children
+    );
+  };
+  return /* @__PURE__ */ React4.createElement("div", { style: getStyles("controls", {}), dir: rtl ? "rtl" : "ltr" }, !hideButtons ? prevButton && typeof prevButton === "function" ? prevButton({
+    Button,
+    setCurrentStep,
+    currentStep,
+    stepsLength,
+    setIsOpen,
+    steps
+  }) : /* @__PURE__ */ React4.createElement(Button, { kind: "prev" }) : null, !hideDots ? /* @__PURE__ */ React4.createElement("div", { style: getStyles("navigation", {}) }, Array.from({ length: stepsLength }, (_, i) => i).map((index) => {
+    var _a;
+    return /* @__PURE__ */ React4.createElement(
+      "button",
+      {
+        style: getStyles("dot", {
+          current: index === currentStep,
+          disabled: disableDots || disableAll
+        }),
+        onClick: () => {
+          if (!disableDots && !disableAll)
+            setCurrentStep(index);
+        },
+        key: `navigation_dot_${index}`,
+        "aria-label": ((_a = steps[index]) == null ? void 0 : _a.navDotAriaLabel) || `Go to step ${index + 1}`
+      }
+    );
+  })) : null, !hideButtons ? nextButton && typeof nextButton === "function" ? nextButton({
+    Button,
+    setCurrentStep,
+    currentStep,
+    stepsLength,
+    setIsOpen,
+    steps
+  }) : /* @__PURE__ */ React4.createElement(Button, null) : null);
+};
+var Navigation_default = Navigation;
+var DefaultArrow = ({
+  styles = {},
+  inverted = false,
+  disabled
+}) => {
+  const getStyles = stylesMatcher(styles);
+  return /* @__PURE__ */ React4.createElement(
+    "svg",
+    {
+      viewBox: "0 0 18.4 14.4",
+      style: getStyles("arrow", { inverted, disabled })
+    },
+    /* @__PURE__ */ React4.createElement(
+      "path",
+      {
+        d: inverted ? "M17 7.2H1M10.8 1L17 7.2l-6.2 6.2" : "M1.4 7.2h16M7.6 1L1.4 7.2l6.2 6.2",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeMiterlimit: "10"
+      }
+    )
+  );
+};
+
+// components/index.tsx
+var components = {
+  Badge: Badge_default,
+  Close: Close_default,
+  Content: Content_default,
+  Navigation: Navigation_default,
+  Arrow: DefaultArrow
+};
+var defaultComponents = (comps) => __spreadValues(__spreadValues({}, components), comps);
+
+// components/PopoverContent.tsx
+var PopoverContent = ({
+  styles,
+  components: components2 = {},
+  badgeContent,
+  accessibilityOptions,
+  disabledActions,
+  onClickClose,
+  steps,
+  setCurrentStep,
+  currentStep,
+  transition,
+  isHighlightingObserved,
+  setIsOpen,
+  nextButton,
+  prevButton,
+  disableDotsNavigation,
+  rtl,
+  showPrevNextButtons = true,
+  showCloseButton = true,
+  showNavigation = true,
+  showBadge = true,
+  showDots = true,
+  meta,
+  setMeta,
+  setSteps
+}) => {
+  const step = steps[currentStep];
+  const { Badge: Badge2, Close: Close2, Content: Content2, Navigation: Navigation2, Arrow } = defaultComponents(components2);
+  const badge = badgeContent && typeof badgeContent === "function" ? badgeContent({
+    currentStep,
+    totalSteps: steps.length,
+    transition
+  }) : currentStep + 1;
+  function closeClickHandler() {
+    if (!disabledActions) {
+      if (onClickClose && typeof onClickClose === "function") {
+        onClickClose({
+          setCurrentStep,
+          setIsOpen,
+          currentStep,
+          steps,
+          meta,
+          setMeta,
+          setSteps
+        });
+      } else {
+        setIsOpen(false);
+      }
+    }
+  }
+  return /* @__PURE__ */ React5.createElement(React5.Fragment, null, showBadge ? /* @__PURE__ */ React5.createElement(Badge2, { styles }, badge) : null, showCloseButton ? /* @__PURE__ */ React5.createElement(
+    Close2,
+    {
+      styles,
+      "aria-label": accessibilityOptions == null ? void 0 : accessibilityOptions.closeButtonAriaLabel,
+      disabled: disabledActions,
+      onClick: closeClickHandler
+    }
+  ) : null, /* @__PURE__ */ React5.createElement(
+    Content2,
+    {
+      content: step == null ? void 0 : step.content,
+      setCurrentStep,
+      currentStep,
+      transition,
+      isHighlightingObserved,
+      setIsOpen
+    }
+  ), showNavigation ? /* @__PURE__ */ React5.createElement(
+    Navigation2,
+    {
+      setCurrentStep,
+      currentStep,
+      setIsOpen,
+      steps,
+      styles,
+      "aria-hidden": !(accessibilityOptions == null ? void 0 : accessibilityOptions.showNavigationScreenReaders),
+      nextButton,
+      prevButton,
+      disableDots: disableDotsNavigation,
+      hideButtons: !showPrevNextButtons,
+      hideDots: !showDots,
+      disableAll: disabledActions,
+      rtl,
+      Arrow
+    }
+  ) : null);
+};
+var PopoverContent_default = PopoverContent;
+
+// Tour.tsx
+var Tour = (_a) => {
+  var _b = _a, {
+    currentStep,
+    setCurrentStep,
+    setIsOpen,
+    steps = [],
+    setSteps,
+    styles: globalStyles = {},
+    scrollSmooth,
+    afterOpen,
+    beforeClose,
+    padding = 10,
+    position,
+    onClickMask,
+    onClickHighlighted,
+    keyboardHandler,
+    className = "reactour__popover",
+    maskClassName = "reactour__mask",
+    highlightedMaskClassName,
+    clipId,
+    maskId,
+    disableInteraction,
+    disableKeyboardNavigation: disableKeyboardNavigation,
+    inViewThreshold,
+    disabledActions,
+    setDisabledActions,
+    disableWhenSelectorFalsy,
+    rtl,
+    accessibilityOptions = {
+      closeButtonAriaLabel: "Close Tour",
+      showNavigationScreenReaders: true
+    },
+    ContentComponent,
+    Wrapper,
+    meta,
+    setMeta,
+    onTransition = () => {
+      return "center";
+    }
+  } = _b, popoverProps = __objRest(_b, [
+    "currentStep",
+    "setCurrentStep",
+    "setIsOpen",
+    "steps",
+    "setSteps",
+    "styles",
+    "scrollSmooth",
+    "afterOpen",
+    "beforeClose",
+    "padding",
+    "position",
+    "onClickMask",
+    "onClickHighlighted",
+    "keyboardHandler",
+    "className",
+    "maskClassName",
+    "highlightedMaskClassName",
+    "clipId",
+    "maskId",
+    "disableInteraction",
+    // disableFocusLock,
+    "disableKeyboardNavigation",
+    "inViewThreshold",
+    "disabledActions",
+    "setDisabledActions",
+    "disableWhenSelectorFalsy",
+    "rtl",
+    "accessibilityOptions",
+    "ContentComponent",
+    "Wrapper",
+    "meta",
+    "setMeta",
+    "onTransition"
+  ]);
+  var _a2;
+  const step = steps[currentStep];
+  const styles = __spreadValues(__spreadValues({}, globalStyles), step == null ? void 0 : step.styles);
+  const {
+    sizes,
+    transition,
+    observableRefresher,
+    isHighlightingObserved,
+    target
+  } = useSizes(step, {
+    block: "center",
+    behavior: scrollSmooth ? "smooth" : "auto",
+    inViewThreshold
+  });
+  useEffect3(() => {
+    if (afterOpen && typeof afterOpen === "function") {
+      afterOpen(target);
+    }
+    return () => {
+      if (beforeClose && typeof beforeClose === "function") {
+        beforeClose(target);
+      }
+    };
+  }, []);
+  const { maskPadding, popoverPadding, wrapperPadding } = getPadding(
+    (_a2 = step == null ? void 0 : step.padding) != null ? _a2 : padding
+  );
+  const clickProps = {
+    setCurrentStep,
+    setIsOpen,
+    currentStep,
+    setSteps,
+    steps,
+    setMeta,
+    meta
+  };
+  function maskClickHandler() {
+    if (!disabledActions) {
+      if (onClickMask && typeof onClickMask === "function") {
+        onClickMask(clickProps);
+      } else {
+        setIsOpen(false);
+      }
+    }
+  }
+  const doDisableInteraction = typeof (step == null ? void 0 : step.stepInteraction) === "boolean" ? !(step == null ? void 0 : step.stepInteraction) : disableInteraction ? typeof disableInteraction === "boolean" ? disableInteraction : disableInteraction(clickProps) : false;
+  useEffect3(() => {
+    if ((step == null ? void 0 : step.action) && typeof (step == null ? void 0 : step.action) === "function") {
+      step == null ? void 0 : step.action(target);
+    }
+    if ((step == null ? void 0 : step.disableActions) !== void 0) {
+      setDisabledActions(step == null ? void 0 : step.disableActions);
+    }
+    return () => {
+      if ((step == null ? void 0 : step.actionAfter) && typeof (step == null ? void 0 : step.actionAfter) === "function") {
+        step == null ? void 0 : step.actionAfter(target);
+      }
+    };
+  }, [step]);
+  const popoverPosition = transition ? onTransition : (step == null ? void 0 : step.position) ? step == null ? void 0 : step.position : position;
+  const TourWrapper = Wrapper ? Wrapper : React6.Fragment;
+  return step ? /* @__PURE__ */ React6.createElement(TourWrapper, null, /* @__PURE__ */ React6.createElement(
+    Observables,
+    {
+      mutationObservables: step == null ? void 0 : step.mutationObservables,
+      resizeObservables: step == null ? void 0 : step.resizeObservables,
+      refresh: observableRefresher
+    }
+  ), /* @__PURE__ */ React6.createElement(
+    Keyboard_default,
+    {
+      setCurrentStep,
+      currentStep,
+      setIsOpen,
+      stepsLength: steps.length,
+      disableKeyboardNavigation,
+      disable: disabledActions,
+      rtl,
+      clickProps,
+      keyboardHandler
+    }
+  ), (!disableWhenSelectorFalsy || target) && /* @__PURE__ */ React6.createElement(
+    Mask,
+    {
+      sizes: transition ? initialState2 : sizes,
+      onClick: maskClickHandler,
+      styles: __spreadValues({
+        highlightedArea: (base) => __spreadProps(__spreadValues({}, base), {
+          display: doDisableInteraction ? "block" : "none"
+        })
+      }, styles),
+      padding: transition ? 0 : maskPadding,
+      highlightedAreaClassName: highlightedMaskClassName,
+      className: maskClassName,
+      onClickHighlighted: (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        if (onClickHighlighted)
+          onClickHighlighted(e, clickProps);
+      },
+      wrapperPadding,
+      clipId,
+      maskId
+    }
+  ), (!disableWhenSelectorFalsy || target) && /* @__PURE__ */ React6.createElement(
+    Popover,
+    {
+      sizes,
+      styles,
+      position: popoverPosition,
+      padding: popoverPadding,
+      "aria-labelledby": accessibilityOptions == null ? void 0 : accessibilityOptions.ariaLabelledBy,
+      className,
+      refresher: currentStep
+    },
+    ContentComponent ? /* @__PURE__ */ React6.createElement(
+      ContentComponent,
+      __spreadValues({
+        styles,
+        setCurrentStep,
+        currentStep,
+        setIsOpen,
+        steps,
+        accessibilityOptions,
+        disabledActions,
+        transition,
+        isHighlightingObserved,
+        rtl
+      }, popoverProps)
+    ) : /* @__PURE__ */ React6.createElement(
+      PopoverContent_default,
+      __spreadValues({
+        styles,
+        setCurrentStep,
+        currentStep,
+        setIsOpen,
+        steps,
+        setSteps,
+        accessibilityOptions,
+        disabledActions,
+        transition,
+        isHighlightingObserved,
+        rtl,
+        meta,
+        setMeta
+      }, popoverProps)
+    )
+  )) : null;
+};
+var Tour_default = Tour;
+function getPadding(padding) {
+  if (typeof padding === "object" && padding !== null) {
+    return {
+      maskPadding: padding.mask,
+      popoverPadding: padding.popover,
+      wrapperPadding: padding.wrapper
+    };
+  }
+  return {
+    maskPadding: padding,
+    popoverPadding: padding,
+    wrapperPadding: 0
+  };
+}
+var initialState2 = {
+  bottom: 0,
+  height: 0,
+  left: 0,
+  right: 0,
+  top: 0,
+  width: 0,
+  x: 0,
+  y: 0
+};
+
+// Context.tsx
+import React7, { useState as useState2, useContext } from "react";
+var defaultState = {
+  isOpen: false,
+  setIsOpen: () => false,
+  currentStep: 0,
+  setCurrentStep: () => 0,
+  steps: [],
+  setSteps: () => [],
+  setMeta: () => "",
+  disabledActions: false,
+  setDisabledActions: () => false,
+  components: {}
+};
+var TourContext = React7.createContext(defaultState);
+var TourProvider = (_a) => {
+  var _b = _a, {
+    children,
+    defaultOpen = false,
+    startAt = 0,
+    steps: defaultSteps,
+    setCurrentStep: customSetCurrentStep,
+    currentStep: customCurrentStep
+  } = _b, props = __objRest(_b, [
+    "children",
+    "defaultOpen",
+    "startAt",
+    "steps",
+    "setCurrentStep",
+    "currentStep"
+  ]);
+  const [isOpen, setIsOpen] = useState2(defaultOpen);
+  const [currentStep, setCurrentStep] = useState2(startAt);
+  const [steps, setSteps] = useState2(defaultSteps);
+  const [meta, setMeta] = useState2("");
+  const [disabledActions, setDisabledActions] = useState2(false);
+  const value = __spreadValues({
+    isOpen,
+    setIsOpen,
+    currentStep: customCurrentStep || currentStep,
+    setCurrentStep: customSetCurrentStep && typeof customSetCurrentStep === "function" ? customSetCurrentStep : setCurrentStep,
+    steps,
+    setSteps,
+    disabledActions,
+    setDisabledActions,
+    meta,
+    setMeta
+  }, props);
+  return /* @__PURE__ */ React7.createElement(TourContext.Provider, { value }, children, isOpen ? /* @__PURE__ */ React7.createElement(Tour_default, __spreadValues({}, value)) : null);
+};
+var Context_default = TourContext;
+function useTour() {
+  return useContext(TourContext);
+}
+
+// withTour.tsx
+import React8 from "react";
+function withTour(WrappedComponent) {
+  const ComponentWithTour = (props) => {
+    const tourProps = useTour();
+    return /* @__PURE__ */ React8.createElement(WrappedComponent, __spreadValues(__spreadValues({}, props), tourProps));
+  };
+  return ComponentWithTour;
+}
+
+// index.tsx
+var tour_default = Tour_default;
+export {
+  Tour_default as Tour,
+  Context_default as TourContext,
+  TourProvider,
+  components,
+  tour_default as default,
+  useTour,
+  withTour
+};
diff --git a/ddb_main/node_modules/@reactour/utils/dist/index.mjs b/ddb_main/node_modules/@reactour/utils/dist/index.mjs
new file mode 100644
index 0000000..7d0acb3
--- /dev/null
+++ b/ddb_main/node_modules/@reactour/utils/dist/index.mjs
@@ -0,0 +1,270 @@
+// Observables.tsx
+import { useRef, useEffect, useState } from "react";
+import useMutationObserver from "@rooks/use-mutation-observer";
+import ResizeObserver from "resize-observer-polyfill";
+var Observables = ({
+  mutationObservables,
+  resizeObservables,
+  refresh
+}) => {
+  const [mutationsCounter, setMutationsCounter] = useState(0);
+  const ref = useRef(document.documentElement || document.body);
+  function refreshHighlightedRegionIfObservable(nodes) {
+    const posibleNodes = Array.from(nodes);
+    for (const node of posibleNodes) {
+      if (mutationObservables) {
+        if (!node.attributes) {
+          continue;
+        }
+        const found = mutationObservables.find(
+          (observable) => node.matches(observable)
+        );
+        if (found) {
+          refresh(true);
+        }
+      }
+    }
+  }
+  function incrementMutationsCounterIfObservable(nodes) {
+    const posibleNodes = Array.from(nodes);
+    for (const node of posibleNodes) {
+      if (resizeObservables) {
+        if (!node.attributes) {
+          continue;
+        }
+        const found = resizeObservables.find(
+          (observable) => node.matches(observable)
+        );
+        if (found)
+          setMutationsCounter(mutationsCounter + 1);
+      }
+    }
+  }
+  useMutationObserver(
+    ref,
+    (mutationList) => {
+      for (const mutation of mutationList) {
+        if (mutation.addedNodes.length !== 0) {
+          refreshHighlightedRegionIfObservable(mutation.addedNodes);
+          incrementMutationsCounterIfObservable(mutation.addedNodes);
+        }
+        if (mutation.removedNodes.length !== 0) {
+          refreshHighlightedRegionIfObservable(mutation.removedNodes);
+          incrementMutationsCounterIfObservable(mutation.removedNodes);
+        }
+      }
+    },
+    { childList: true, subtree: true }
+  );
+  useEffect(() => {
+    if (!resizeObservables) {
+      return;
+    }
+    const resizeObserver = new ResizeObserver(() => {
+      refresh();
+    });
+    for (const observable of resizeObservables) {
+      const element = document.querySelector(observable);
+      if (element) {
+        resizeObserver.observe(element);
+      }
+    }
+    return () => {
+      resizeObserver.disconnect();
+    };
+  }, [resizeObservables, mutationsCounter]);
+  return null;
+};
+var Observables_default = Observables;
+
+// useRect.tsx
+import { useEffect as useEffect2, useCallback, useState as useState2 } from "react";
+function getRect(element) {
+  let rect = initialState;
+  if (element) {
+    const domRect = element.getBoundingClientRect();
+    rect = domRect;
+  }
+  return rect;
+}
+function useRect(ref, refresher) {
+  const [dimensions, setDimensions] = useState2(initialState);
+  const handleResize = useCallback(() => {
+    if (!(ref == null ? void 0 : ref.current))
+      return;
+    setDimensions(getRect(ref == null ? void 0 : ref.current));
+  }, [ref == null ? void 0 : ref.current]);
+  useEffect2(() => {
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, [ref == null ? void 0 : ref.current, refresher]);
+  return dimensions;
+}
+function useElemRect(elem, refresher) {
+  const [dimensions, setDimensions] = useState2(initialState);
+  const handleResize = useCallback(() => {
+    if (!elem)
+      return;
+    setDimensions(getRect(elem));
+  }, [elem]);
+  useEffect2(() => {
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, [elem, refresher]);
+  return dimensions;
+}
+var initialState = {
+  bottom: 0,
+  height: 0,
+  left: 0,
+  right: 0,
+  top: 0,
+  width: 0,
+  x: 0,
+  y: 0
+};
+
+// smoothScroll.tsx
+function smoothScroll(elem, options) {
+  return new Promise((resolve) => {
+    if (!(elem instanceof Element)) {
+      throw new TypeError("Argument 1 must be an Element");
+    }
+    let same = 0;
+    let lastPos = null;
+    const scrollOptions = Object.assign({ behavior: "smooth" }, options);
+    elem.scrollIntoView(scrollOptions);
+    requestAnimationFrame(check);
+    function check() {
+      const newPos = elem == null ? void 0 : elem.getBoundingClientRect().top;
+      if (newPos === lastPos) {
+        if (same++ > 2) {
+          return resolve(null);
+        }
+      } else {
+        same = 0;
+        lastPos = newPos;
+      }
+      requestAnimationFrame(check);
+    }
+  });
+}
+
+// useIntersectionObserver.tsx
+import { useEffect as useEffect3, useState as useState3 } from "react";
+function useIntersectionObserver(elementRef, {
+  threshold = 0,
+  root = null,
+  rootMargin = "0%",
+  freezeOnceVisible = false
+}) {
+  const [entry, setEntry] = useState3();
+  const frozen = (entry == null ? void 0 : entry.isIntersecting) && freezeOnceVisible;
+  const updateEntry = ([entry2]) => {
+    setEntry(entry2);
+  };
+  useEffect3(() => {
+    const node = elementRef == null ? void 0 : elementRef.current;
+    const hasIOSupport = !!window.IntersectionObserver;
+    if (!hasIOSupport || frozen || !node)
+      return;
+    const observerParams = { threshold, root, rootMargin };
+    const observer = new IntersectionObserver(updateEntry, observerParams);
+    observer.observe(node);
+    return () => observer.disconnect();
+  }, [elementRef, JSON.stringify(threshold), root, rootMargin, frozen]);
+  return entry;
+}
+
+// helpers.tsx
+function safe(sum) {
+  return sum < 0 ? 0 : sum;
+}
+function getInViewThreshold(threshold) {
+  if (typeof threshold === "object" && threshold !== null) {
+    return {
+      thresholdX: threshold.x || 0,
+      thresholdY: threshold.y || 0
+    };
+  }
+  return {
+    thresholdX: threshold || 0,
+    thresholdY: threshold || 0
+  };
+}
+function getWindow() {
+  const w = Math.max(
+    document.documentElement.clientWidth,
+    window.innerWidth || 0
+  );
+  const h = Math.max(
+    document.documentElement.clientHeight,
+    window.innerHeight || 0
+  );
+  return { w, h };
+}
+function inView({
+  top,
+  right,
+  bottom,
+  left,
+  threshold
+}) {
+  const { w: windowWidth, h: windowHeight } = getWindow();
+  const { thresholdX, thresholdY } = getInViewThreshold(threshold);
+  return top < 0 && bottom - top > windowHeight ? true : top >= 0 + thresholdY && left >= 0 + thresholdX && bottom <= windowHeight - thresholdY && right <= windowWidth - thresholdX;
+}
+var isHoriz = (pos) => /(left|right)/.test(pos);
+var isOutsideX = (val, windowWidth) => {
+  return val > windowWidth;
+};
+var isOutsideY = (val, windowHeight) => {
+  return val > windowHeight;
+};
+function bestPositionOf(positions, filters = []) {
+  const compareFn = (a, b) => filters.includes(a) ? 1 : filters.includes(b) ? -1 : 0;
+  return Object.keys(positions).map((p) => {
+    return {
+      position: p,
+      value: positions[p]
+    };
+  }).sort((a, b) => b.value - a.value).sort((a, b) => compareFn(a.position, b.position)).filter((p) => p.value > 0).map((p) => p.position);
+}
+var defaultPadding = 10;
+function getPadding(padding = defaultPadding) {
+  if (Array.isArray(padding)) {
+    if (padding.length === 1) {
+      return [padding[0], padding[0], padding[0], padding[0]];
+    }
+    if (padding.length === 2) {
+      return [padding[1], padding[0], padding[1], padding[0]];
+    }
+    if (padding.length === 3) {
+      return [padding[0], padding[1], padding[2], padding[1]];
+    }
+    if (padding.length > 3) {
+      return [padding[0], padding[1], padding[2], padding[3]];
+    }
+    return [defaultPadding, defaultPadding];
+  }
+  return [padding, padding, padding, padding];
+}
+export {
+  Observables_default as Observables,
+  bestPositionOf,
+  getInViewThreshold,
+  getPadding,
+  getRect,
+  getWindow,
+  inView,
+  isHoriz,
+  isOutsideX,
+  isOutsideY,
+  safe,
+  smoothScroll,
+  useElemRect,
+  useIntersectionObserver,
+  useRect
+};
diff --git a/ddb_main/node_modules/@redux-saga/core/dist/io-22ea0cf9.js b/ddb_main/node_modules/@redux-saga/core/dist/io-22ea0cf9.js
new file mode 100644
index 0000000..b7281bd
--- /dev/null
+++ b/ddb_main/node_modules/@redux-saga/core/dist/io-22ea0cf9.js
@@ -0,0 +1,713 @@
+import { TASK_CANCEL, TERMINATE, SAGA_LOCATION, SAGA_ACTION, IO, SELF_CANCELLATION } from '@redux-saga/symbols';
+import _extends from '@babel/runtime/helpers/esm/extends';
+import { array, notUndef, pattern, multicast, channel, undef, effect, task, func, buffer, string, object } from '@redux-saga/is';
+import delayP from '@redux-saga/delay-p';
+
+var konst = function konst(v) {
+  return function () {
+    return v;
+  };
+};
+var kTrue =
+/*#__PURE__*/
+konst(true);
+
+var noop = function noop() {};
+
+if (process.env.NODE_ENV !== 'production' && typeof Proxy !== 'undefined') {
+  noop =
+  /*#__PURE__*/
+  new Proxy(noop, {
+    set: function set() {
+      throw internalErr('There was an attempt to assign a property to internal `noop` function.');
+    }
+  });
+}
+var identity = function identity(v) {
+  return v;
+};
+var hasSymbol = typeof Symbol === 'function';
+var asyncIteratorSymbol = hasSymbol && Symbol.asyncIterator ? Symbol.asyncIterator : '@@asyncIterator';
+function check(value, predicate, error) {
+  if (!predicate(value)) {
+    throw new Error(error);
+  }
+}
+var assignWithSymbols = function assignWithSymbols(target, source) {
+  _extends(target, source);
+
+  if (Object.getOwnPropertySymbols) {
+    Object.getOwnPropertySymbols(source).forEach(function (s) {
+      target[s] = source[s];
+    });
+  }
+};
+var flatMap = function flatMap(mapper, arr) {
+  var _ref;
+
+  return (_ref = []).concat.apply(_ref, arr.map(mapper));
+};
+function remove(array, item) {
+  var index = array.indexOf(item);
+
+  if (index >= 0) {
+    array.splice(index, 1);
+  }
+}
+function once(fn) {
+  var called = false;
+  return function () {
+    if (called) {
+      return;
+    }
+
+    called = true;
+    fn();
+  };
+}
+
+var kThrow = function kThrow(err) {
+  throw err;
+};
+
+var kReturn = function kReturn(value) {
+  return {
+    value: value,
+    done: true
+  };
+};
+
+function makeIterator(next, thro, name) {
+  if (thro === void 0) {
+    thro = kThrow;
+  }
+
+  if (name === void 0) {
+    name = 'iterator';
+  }
+
+  var iterator = {
+    meta: {
+      name: name
+    },
+    next: next,
+    throw: thro,
+    return: kReturn,
+    isSagaIterator: true
+  };
+
+  if (typeof Symbol !== 'undefined') {
+    iterator[Symbol.iterator] = function () {
+      return iterator;
+    };
+  }
+
+  return iterator;
+}
+function logError(error, _ref2) {
+  var sagaStack = _ref2.sagaStack;
+
+  /*eslint-disable no-console*/
+  console.error(error);
+  console.error(sagaStack);
+}
+var internalErr = function internalErr(err) {
+  return new Error("\n  redux-saga: Error checking hooks detected an inconsistent state. This is likely a bug\n  in redux-saga code and not yours. Thanks for reporting this in the project's github repo.\n  Error: " + err + "\n");
+};
+var createSetContextWarning = function createSetContextWarning(ctx, props) {
+  return (ctx ? ctx + '.' : '') + "setContext(props): argument " + props + " is not a plain object";
+};
+var FROZEN_ACTION_ERROR = "You can't put (a.k.a. dispatch from saga) frozen actions.\nWe have to define a special non-enumerable property on those actions for scheduling purposes.\nOtherwise you wouldn't be able to communicate properly between sagas & other subscribers (action ordering would become far less predictable).\nIf you are using redux and you care about this behaviour (frozen actions),\nthen you might want to switch to freezing actions in a middleware rather than in action creator.\nExample implementation:\n\nconst freezeActions = store => next => action => next(Object.freeze(action))\n"; // creates empty, but not-holey array
+
+var createEmptyArray = function createEmptyArray(n) {
+  return Array.apply(null, new Array(n));
+};
+var wrapSagaDispatch = function wrapSagaDispatch(dispatch) {
+  return function (action) {
+    if (process.env.NODE_ENV !== 'production') {
+      check(action, function (ac) {
+        return !Object.isFrozen(ac);
+      }, FROZEN_ACTION_ERROR);
+    }
+
+    return dispatch(Object.defineProperty(action, SAGA_ACTION, {
+      value: true
+    }));
+  };
+};
+var shouldTerminate = function shouldTerminate(res) {
+  return res === TERMINATE;
+};
+var shouldCancel = function shouldCancel(res) {
+  return res === TASK_CANCEL;
+};
+var shouldComplete = function shouldComplete(res) {
+  return shouldTerminate(res) || shouldCancel(res);
+};
+function createAllStyleChildCallbacks(shape, parentCallback) {
+  var keys = Object.keys(shape);
+  var totalCount = keys.length;
+
+  if (process.env.NODE_ENV !== 'production') {
+    check(totalCount, function (c) {
+      return c > 0;
+    }, 'createAllStyleChildCallbacks: get an empty array or object');
+  }
+
+  var completedCount = 0;
+  var completed;
+  var results = array(shape) ? createEmptyArray(totalCount) : {};
+  var childCallbacks = {};
+
+  function checkEnd() {
+    if (completedCount === totalCount) {
+      completed = true;
+      parentCallback(results);
+    }
+  }
+
+  keys.forEach(function (key) {
+    var chCbAtKey = function chCbAtKey(res, isErr) {
+      if (completed) {
+        return;
+      }
+
+      if (isErr || shouldComplete(res)) {
+        parentCallback.cancel();
+        parentCallback(res, isErr);
+      } else {
+        results[key] = res;
+        completedCount++;
+        checkEnd();
+      }
+    };
+
+    chCbAtKey.cancel = noop;
+    childCallbacks[key] = chCbAtKey;
+  });
+
+  parentCallback.cancel = function () {
+    if (!completed) {
+      completed = true;
+      keys.forEach(function (key) {
+        return childCallbacks[key].cancel();
+      });
+    }
+  };
+
+  return childCallbacks;
+}
+function getMetaInfo(fn) {
+  return {
+    name: fn.name || 'anonymous',
+    location: getLocation(fn)
+  };
+}
+function getLocation(instrumented) {
+  return instrumented[SAGA_LOCATION];
+}
+function compose() {
+  for (var _len = arguments.length, funcs = new Array(_len), _key = 0; _key < _len; _key++) {
+    funcs[_key] = arguments[_key];
+  }
+
+  if (funcs.length === 0) {
+    return function (arg) {
+      return arg;
+    };
+  }
+
+  if (funcs.length === 1) {
+    return funcs[0];
+  }
+
+  return funcs.reduce(function (a, b) {
+    return function () {
+      return a(b.apply(void 0, arguments));
+    };
+  });
+}
+
+var BUFFER_OVERFLOW = "Channel's Buffer overflow!";
+var ON_OVERFLOW_THROW = 1;
+var ON_OVERFLOW_DROP = 2;
+var ON_OVERFLOW_SLIDE = 3;
+var ON_OVERFLOW_EXPAND = 4;
+var zeroBuffer = {
+  isEmpty: kTrue,
+  put: noop,
+  take: noop
+};
+
+function ringBuffer(limit, overflowAction) {
+  if (limit === void 0) {
+    limit = 10;
+  }
+
+  var arr = new Array(limit);
+  var length = 0;
+  var pushIndex = 0;
+  var popIndex = 0;
+
+  var push = function push(it) {
+    arr[pushIndex] = it;
+    pushIndex = (pushIndex + 1) % limit;
+    length++;
+  };
+
+  var take = function take() {
+    if (length != 0) {
+      var it = arr[popIndex];
+      arr[popIndex] = null;
+      length--;
+      popIndex = (popIndex + 1) % limit;
+      return it;
+    }
+  };
+
+  var flush = function flush() {
+    var items = [];
+
+    while (length) {
+      items.push(take());
+    }
+
+    return items;
+  };
+
+  return {
+    isEmpty: function isEmpty() {
+      return length == 0;
+    },
+    put: function put(it) {
+      if (length < limit) {
+        push(it);
+      } else {
+        var doubledLimit;
+
+        switch (overflowAction) {
+          case ON_OVERFLOW_THROW:
+            throw new Error(BUFFER_OVERFLOW);
+
+          case ON_OVERFLOW_SLIDE:
+            arr[pushIndex] = it;
+            pushIndex = (pushIndex + 1) % limit;
+            popIndex = pushIndex;
+            break;
+
+          case ON_OVERFLOW_EXPAND:
+            doubledLimit = 2 * limit;
+            arr = flush();
+            length = arr.length;
+            pushIndex = arr.length;
+            popIndex = 0;
+            arr.length = doubledLimit;
+            limit = doubledLimit;
+            push(it);
+            break;
+
+          default: // DROP
+
+        }
+      }
+    },
+    take: take,
+    flush: flush
+  };
+}
+
+var none = function none() {
+  return zeroBuffer;
+};
+var fixed = function fixed(limit) {
+  return ringBuffer(limit, ON_OVERFLOW_THROW);
+};
+var dropping = function dropping(limit) {
+  return ringBuffer(limit, ON_OVERFLOW_DROP);
+};
+var sliding = function sliding(limit) {
+  return ringBuffer(limit, ON_OVERFLOW_SLIDE);
+};
+var expanding = function expanding(initialSize) {
+  return ringBuffer(initialSize, ON_OVERFLOW_EXPAND);
+};
+
+var buffers = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  none: none,
+  fixed: fixed,
+  dropping: dropping,
+  sliding: sliding,
+  expanding: expanding
+});
+
+var TAKE = 'TAKE';
+var PUT = 'PUT';
+var ALL = 'ALL';
+var RACE = 'RACE';
+var CALL = 'CALL';
+var CPS = 'CPS';
+var FORK = 'FORK';
+var JOIN = 'JOIN';
+var CANCEL = 'CANCEL';
+var SELECT = 'SELECT';
+var ACTION_CHANNEL = 'ACTION_CHANNEL';
+var CANCELLED = 'CANCELLED';
+var FLUSH = 'FLUSH';
+var GET_CONTEXT = 'GET_CONTEXT';
+var SET_CONTEXT = 'SET_CONTEXT';
+
+var effectTypes = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  TAKE: TAKE,
+  PUT: PUT,
+  ALL: ALL,
+  RACE: RACE,
+  CALL: CALL,
+  CPS: CPS,
+  FORK: FORK,
+  JOIN: JOIN,
+  CANCEL: CANCEL,
+  SELECT: SELECT,
+  ACTION_CHANNEL: ACTION_CHANNEL,
+  CANCELLED: CANCELLED,
+  FLUSH: FLUSH,
+  GET_CONTEXT: GET_CONTEXT,
+  SET_CONTEXT: SET_CONTEXT
+});
+
+var TEST_HINT = '\n(HINT: if you are getting these errors in tests, consider using createMockTask from @redux-saga/testing-utils)';
+
+var makeEffect = function makeEffect(type, payload) {
+  var _ref;
+
+  return _ref = {}, _ref[IO] = true, _ref.combinator = false, _ref.type = type, _ref.payload = payload, _ref;
+};
+
+var isForkEffect = function isForkEffect(eff) {
+  return effect(eff) && eff.type === FORK;
+};
+
+var detach = function detach(eff) {
+  if (process.env.NODE_ENV !== 'production') {
+    check(eff, isForkEffect, 'detach(eff): argument must be a fork effect');
+  }
+
+  return makeEffect(FORK, _extends({}, eff.payload, {
+    detached: true
+  }));
+};
+function take(patternOrChannel, multicastPattern) {
+  if (patternOrChannel === void 0) {
+    patternOrChannel = '*';
+  }
+
+  if (process.env.NODE_ENV !== 'production' && arguments.length) {
+    check(arguments[0], notUndef, 'take(patternOrChannel): patternOrChannel is undefined');
+  }
+
+  if (pattern(patternOrChannel)) {
+    if (notUndef(multicastPattern)) {
+      /* eslint-disable no-console */
+      console.warn("take(pattern) takes one argument but two were provided. Consider passing an array for listening to several action types");
+    }
+
+    return makeEffect(TAKE, {
+      pattern: patternOrChannel
+    });
+  }
+
+  if (multicast(patternOrChannel) && notUndef(multicastPattern) && pattern(multicastPattern)) {
+    return makeEffect(TAKE, {
+      channel: patternOrChannel,
+      pattern: multicastPattern
+    });
+  }
+
+  if (channel(patternOrChannel)) {
+    if (notUndef(multicastPattern)) {
+      /* eslint-disable no-console */
+      console.warn("take(channel) takes one argument but two were provided. Second argument is ignored.");
+    }
+
+    return makeEffect(TAKE, {
+      channel: patternOrChannel
+    });
+  }
+
+  if (process.env.NODE_ENV !== 'production') {
+    throw new Error("take(patternOrChannel): argument " + patternOrChannel + " is not valid channel or a valid pattern");
+  }
+}
+var takeMaybe = function takeMaybe() {
+  var eff = take.apply(void 0, arguments);
+  eff.payload.maybe = true;
+  return eff;
+};
+function put(channel$1, action) {
+  if (process.env.NODE_ENV !== 'production') {
+    if (arguments.length > 1) {
+      check(channel$1, notUndef, 'put(channel, action): argument channel is undefined');
+      check(channel$1, channel, "put(channel, action): argument " + channel$1 + " is not a valid channel");
+      check(action, notUndef, 'put(channel, action): argument action is undefined');
+    } else {
+      check(channel$1, notUndef, 'put(action): argument action is undefined');
+    }
+  }
+
+  if (undef(action)) {
+    action = channel$1; // `undefined` instead of `null` to make default parameter work
+
+    channel$1 = undefined;
+  }
+
+  return makeEffect(PUT, {
+    channel: channel$1,
+    action: action
+  });
+}
+var putResolve = function putResolve() {
+  var eff = put.apply(void 0, arguments);
+  eff.payload.resolve = true;
+  return eff;
+};
+function all(effects) {
+  var eff = makeEffect(ALL, effects);
+  eff.combinator = true;
+  return eff;
+}
+function race(effects) {
+  var eff = makeEffect(RACE, effects);
+  eff.combinator = true;
+  return eff;
+} // this match getFnCallDescriptor logic
+
+var validateFnDescriptor = function validateFnDescriptor(effectName, fnDescriptor) {
+  check(fnDescriptor, notUndef, effectName + ": argument fn is undefined or null");
+
+  if (func(fnDescriptor)) {
+    return;
+  }
+
+  var context = null;
+  var fn;
+
+  if (array(fnDescriptor)) {
+    context = fnDescriptor[0];
+    fn = fnDescriptor[1];
+    check(fn, notUndef, effectName + ": argument of type [context, fn] has undefined or null `fn`");
+  } else if (object(fnDescriptor)) {
+    context = fnDescriptor.context;
+    fn = fnDescriptor.fn;
+    check(fn, notUndef, effectName + ": argument of type {context, fn} has undefined or null `fn`");
+  } else {
+    check(fnDescriptor, func, effectName + ": argument fn is not function");
+    return;
+  }
+
+  if (context && string(fn)) {
+    check(context[fn], func, effectName + ": context arguments has no such method - \"" + fn + "\"");
+    return;
+  }
+
+  check(fn, func, effectName + ": unpacked fn argument (from [context, fn] or {context, fn}) is not a function");
+};
+
+function getFnCallDescriptor(fnDescriptor, args) {
+  var context = null;
+  var fn;
+
+  if (func(fnDescriptor)) {
+    fn = fnDescriptor;
+  } else {
+    if (array(fnDescriptor)) {
+      context = fnDescriptor[0];
+      fn = fnDescriptor[1];
+    } else {
+      context = fnDescriptor.context;
+      fn = fnDescriptor.fn;
+    }
+
+    if (context && string(fn) && func(context[fn])) {
+      fn = context[fn];
+    }
+  }
+
+  return {
+    context: context,
+    fn: fn,
+    args: args
+  };
+}
+
+var isNotDelayEffect = function isNotDelayEffect(fn) {
+  return fn !== delay;
+};
+
+function call(fnDescriptor) {
+  for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    args[_key - 1] = arguments[_key];
+  }
+
+  if (process.env.NODE_ENV !== 'production') {
+    var arg0 = typeof args[0] === 'number' ? args[0] : 'ms';
+    check(fnDescriptor, isNotDelayEffect, "instead of writing `yield call(delay, " + arg0 + ")` where delay is an effect from `redux-saga/effects` you should write `yield delay(" + arg0 + ")`");
+    validateFnDescriptor('call', fnDescriptor);
+  }
+
+  return makeEffect(CALL, getFnCallDescriptor(fnDescriptor, args));
+}
+function apply(context, fn, args) {
+  if (args === void 0) {
+    args = [];
+  }
+
+  var fnDescriptor = [context, fn];
+
+  if (process.env.NODE_ENV !== 'production') {
+    validateFnDescriptor('apply', fnDescriptor);
+  }
+
+  return makeEffect(CALL, getFnCallDescriptor([context, fn], args));
+}
+function cps(fnDescriptor) {
+  if (process.env.NODE_ENV !== 'production') {
+    validateFnDescriptor('cps', fnDescriptor);
+  }
+
+  for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
+    args[_key2 - 1] = arguments[_key2];
+  }
+
+  return makeEffect(CPS, getFnCallDescriptor(fnDescriptor, args));
+}
+function fork(fnDescriptor) {
+  if (process.env.NODE_ENV !== 'production') {
+    validateFnDescriptor('fork', fnDescriptor);
+    check(fnDescriptor, function (arg) {
+      return !effect(arg);
+    }, 'fork: argument must not be an effect');
+  }
+
+  for (var _len3 = arguments.length, args = new Array(_len3 > 1 ? _len3 - 1 : 0), _key3 = 1; _key3 < _len3; _key3++) {
+    args[_key3 - 1] = arguments[_key3];
+  }
+
+  return makeEffect(FORK, getFnCallDescriptor(fnDescriptor, args));
+}
+function spawn(fnDescriptor) {
+  if (process.env.NODE_ENV !== 'production') {
+    validateFnDescriptor('spawn', fnDescriptor);
+  }
+
+  for (var _len4 = arguments.length, args = new Array(_len4 > 1 ? _len4 - 1 : 0), _key4 = 1; _key4 < _len4; _key4++) {
+    args[_key4 - 1] = arguments[_key4];
+  }
+
+  return detach(fork.apply(void 0, [fnDescriptor].concat(args)));
+}
+function join(taskOrTasks) {
+  if (process.env.NODE_ENV !== 'production') {
+    if (arguments.length > 1) {
+      throw new Error('join(...tasks) is not supported any more. Please use join([...tasks]) to join multiple tasks.');
+    }
+
+    if (array(taskOrTasks)) {
+      taskOrTasks.forEach(function (t) {
+        check(t, task, "join([...tasks]): argument " + t + " is not a valid Task object " + TEST_HINT);
+      });
+    } else {
+      check(taskOrTasks, task, "join(task): argument " + taskOrTasks + " is not a valid Task object " + TEST_HINT);
+    }
+  }
+
+  return makeEffect(JOIN, taskOrTasks);
+}
+function cancel(taskOrTasks) {
+  if (taskOrTasks === void 0) {
+    taskOrTasks = SELF_CANCELLATION;
+  }
+
+  if (process.env.NODE_ENV !== 'production') {
+    if (arguments.length > 1) {
+      throw new Error('cancel(...tasks) is not supported any more. Please use cancel([...tasks]) to cancel multiple tasks.');
+    }
+
+    if (array(taskOrTasks)) {
+      taskOrTasks.forEach(function (t) {
+        check(t, task, "cancel([...tasks]): argument " + t + " is not a valid Task object " + TEST_HINT);
+      });
+    } else if (taskOrTasks !== SELF_CANCELLATION && notUndef(taskOrTasks)) {
+      check(taskOrTasks, task, "cancel(task): argument " + taskOrTasks + " is not a valid Task object " + TEST_HINT);
+    }
+  }
+
+  return makeEffect(CANCEL, taskOrTasks);
+}
+function select(selector) {
+  if (selector === void 0) {
+    selector = identity;
+  }
+
+  for (var _len5 = arguments.length, args = new Array(_len5 > 1 ? _len5 - 1 : 0), _key5 = 1; _key5 < _len5; _key5++) {
+    args[_key5 - 1] = arguments[_key5];
+  }
+
+  if (process.env.NODE_ENV !== 'production' && arguments.length) {
+    check(arguments[0], notUndef, 'select(selector, [...]): argument selector is undefined');
+    check(selector, func, "select(selector, [...]): argument " + selector + " is not a function");
+  }
+
+  return makeEffect(SELECT, {
+    selector: selector,
+    args: args
+  });
+}
+/**
+  channel(pattern, [buffer])    => creates a proxy channel for store actions
+**/
+
+function actionChannel(pattern$1, buffer$1) {
+  if (process.env.NODE_ENV !== 'production') {
+    check(pattern$1, pattern, 'actionChannel(pattern,...): argument pattern is not valid');
+
+    if (arguments.length > 1) {
+      check(buffer$1, notUndef, 'actionChannel(pattern, buffer): argument buffer is undefined');
+      check(buffer$1, buffer, "actionChannel(pattern, buffer): argument " + buffer$1 + " is not a valid buffer");
+    }
+  }
+
+  return makeEffect(ACTION_CHANNEL, {
+    pattern: pattern$1,
+    buffer: buffer$1
+  });
+}
+function cancelled() {
+  return makeEffect(CANCELLED, {});
+}
+function flush(channel$1) {
+  if (process.env.NODE_ENV !== 'production') {
+    check(channel$1, channel, "flush(channel): argument " + channel$1 + " is not valid channel");
+  }
+
+  return makeEffect(FLUSH, channel$1);
+}
+function getContext(prop) {
+  if (process.env.NODE_ENV !== 'production') {
+    check(prop, string, "getContext(prop): argument " + prop + " is not a string");
+  }
+
+  return makeEffect(GET_CONTEXT, prop);
+}
+function setContext(props) {
+  if (process.env.NODE_ENV !== 'production') {
+    check(props, object, createSetContextWarning(null, props));
+  }
+
+  return makeEffect(SET_CONTEXT, props);
+}
+var delay =
+/*#__PURE__*/
+call.bind(null, delayP);
+
+export { all as $, ALL as A, compose as B, CALL as C, logError as D, wrapSagaDispatch as E, FORK as F, GET_CONTEXT as G, identity as H, buffers as I, JOIN as J, detach as K, take as L, fork as M, cancel as N, call as O, PUT as P, delay as Q, RACE as R, SELECT as S, TAKE as T, actionChannel as U, sliding as V, race as W, effectTypes as X, takeMaybe as Y, put as Z, putResolve as _, CPS as a, apply as a0, cps as a1, spawn as a2, join as a3, select as a4, cancelled as a5, flush as a6, getContext as a7, setContext as a8, CANCEL as b, check as c, ACTION_CHANNEL as d, expanding as e, CANCELLED as f, FLUSH as g, SET_CONTEXT as h, internalErr as i, getMetaInfo as j, kTrue as k, createAllStyleChildCallbacks as l, createEmptyArray as m, none as n, once as o, assignWithSymbols as p, makeIterator as q, remove as r, shouldComplete as s, noop as t, flatMap as u, getLocation as v, createSetContextWarning as w, asyncIteratorSymbol as x, shouldCancel as y, shouldTerminate as z };
diff --git a/ddb_main/node_modules/@redux-saga/core/dist/redux-saga-core.esm.js b/ddb_main/node_modules/@redux-saga/core/dist/redux-saga-core.esm.js
new file mode 100644
index 0000000..5333a05
--- /dev/null
+++ b/ddb_main/node_modules/@redux-saga/core/dist/redux-saga-core.esm.js
@@ -0,0 +1,1437 @@
+import { CHANNEL_END_TYPE, MULTICAST, MATCH, SAGA_ACTION, CANCEL, SELF_CANCELLATION, TERMINATE, TASK, TASK_CANCEL, IO } from '@redux-saga/symbols';
+export { CANCEL, SAGA_LOCATION } from '@redux-saga/symbols';
+import _extends from '@babel/runtime/helpers/esm/extends';
+import _objectWithoutPropertiesLoose from '@babel/runtime/helpers/esm/objectWithoutPropertiesLoose';
+import { string as string$1, array as array$1, stringableFunc, func, symbol as symbol$1, buffer, notUndef, promise, iterator, undef, object, channel as channel$1 } from '@redux-saga/is';
+import { k as kTrue, e as expanding, c as check, o as once, r as remove, n as none, i as internalErr, T as TAKE, P as PUT, A as ALL, R as RACE, C as CALL, a as CPS, F as FORK, J as JOIN, b as CANCEL$1, S as SELECT, d as ACTION_CHANNEL, f as CANCELLED$1, g as FLUSH, G as GET_CONTEXT, h as SET_CONTEXT, j as getMetaInfo, l as createAllStyleChildCallbacks, m as createEmptyArray, p as assignWithSymbols, q as makeIterator, s as shouldComplete, t as noop, u as flatMap, v as getLocation, w as createSetContextWarning, x as asyncIteratorSymbol, y as shouldCancel, z as shouldTerminate, B as compose, D as logError, E as wrapSagaDispatch, H as identity } from './io-22ea0cf9.js';
+export { I as buffers, K as detach } from './io-22ea0cf9.js';
+import deferred from '@redux-saga/deferred';
+import '@redux-saga/delay-p';
+
+var queue = [];
+/**
+  Variable to hold a counting semaphore
+  - Incrementing adds a lock and puts the scheduler in a `suspended` state (if it's not
+    already suspended)
+  - Decrementing releases a lock. Zero locks puts the scheduler in a `released` state. This
+    triggers flushing the queued tasks.
+**/
+
+var semaphore = 0;
+/**
+  Executes a task 'atomically'. Tasks scheduled during this execution will be queued
+  and flushed after this task has finished (assuming the scheduler endup in a released
+  state).
+**/
+
+function exec(task) {
+  try {
+    suspend();
+    task();
+  } finally {
+    release();
+  }
+}
+/**
+  Executes or queues a task depending on the state of the scheduler (`suspended` or `released`)
+**/
+
+
+function asap(task) {
+  queue.push(task);
+
+  if (!semaphore) {
+    suspend();
+    flush();
+  }
+}
+/**
+ * Puts the scheduler in a `suspended` state and executes a task immediately.
+ */
+
+function immediately(task) {
+  try {
+    suspend();
+    return task();
+  } finally {
+    flush();
+  }
+}
+/**
+  Puts the scheduler in a `suspended` state. Scheduled tasks will be queued until the
+  scheduler is released.
+**/
+
+function suspend() {
+  semaphore++;
+}
+/**
+  Puts the scheduler in a `released` state.
+**/
+
+
+function release() {
+  semaphore--;
+}
+/**
+  Releases the current lock. Executes all queued tasks if the scheduler is in the released state.
+**/
+
+
+function flush() {
+  release();
+  var task;
+
+  while (!semaphore && (task = queue.shift()) !== undefined) {
+    exec(task);
+  }
+}
+
+var array = function array(patterns) {
+  return function (input) {
+    return patterns.some(function (p) {
+      return matcher(p)(input);
+    });
+  };
+};
+var predicate = function predicate(_predicate) {
+  return function (input) {
+    return _predicate(input);
+  };
+};
+var string = function string(pattern) {
+  return function (input) {
+    return input.type === String(pattern);
+  };
+};
+var symbol = function symbol(pattern) {
+  return function (input) {
+    return input.type === pattern;
+  };
+};
+var wildcard = function wildcard() {
+  return kTrue;
+};
+function matcher(pattern) {
+  // prettier-ignore
+  var matcherCreator = pattern === '*' ? wildcard : string$1(pattern) ? string : array$1(pattern) ? array : stringableFunc(pattern) ? string : func(pattern) ? predicate : symbol$1(pattern) ? symbol : null;
+
+  if (matcherCreator === null) {
+    throw new Error("invalid pattern: " + pattern);
+  }
+
+  return matcherCreator(pattern);
+}
+
+var END = {
+  type: CHANNEL_END_TYPE
+};
+var isEnd = function isEnd(a) {
+  return a && a.type === CHANNEL_END_TYPE;
+};
+var CLOSED_CHANNEL_WITH_TAKERS = 'Cannot have a closed channel with pending takers';
+var INVALID_BUFFER = 'invalid buffer passed to channel factory function';
+var UNDEFINED_INPUT_ERROR = "Saga or channel was provided with an undefined action\nHints:\n  - check that your Action Creator returns a non-undefined value\n  - if the Saga was started using runSaga, check that your subscribe source provides the action to its listeners";
+function channel(buffer$1) {
+  if (buffer$1 === void 0) {
+    buffer$1 = expanding();
+  }
+
+  var closed = false;
+  var takers = [];
+
+  if (process.env.NODE_ENV !== 'production') {
+    check(buffer$1, buffer, INVALID_BUFFER);
+  }
+
+  function checkForbiddenStates() {
+    if (closed && takers.length) {
+      throw internalErr(CLOSED_CHANNEL_WITH_TAKERS);
+    }
+
+    if (takers.length && !buffer$1.isEmpty()) {
+      throw internalErr('Cannot have pending takers with non empty buffer');
+    }
+  }
+
+  function put(input) {
+    if (process.env.NODE_ENV !== 'production') {
+      checkForbiddenStates();
+      check(input, notUndef, UNDEFINED_INPUT_ERROR);
+    }
+
+    if (closed) {
+      return;
+    }
+
+    if (takers.length === 0) {
+      return buffer$1.put(input);
+    }
+
+    var cb = takers.shift();
+    cb(input);
+  }
+
+  function take(cb) {
+    if (process.env.NODE_ENV !== 'production') {
+      checkForbiddenStates();
+      check(cb, func, "channel.take's callback must be a function");
+    }
+
+    if (closed && buffer$1.isEmpty()) {
+      cb(END);
+    } else if (!buffer$1.isEmpty()) {
+      cb(buffer$1.take());
+    } else {
+      takers.push(cb);
+
+      cb.cancel = function () {
+        remove(takers, cb);
+      };
+    }
+  }
+
+  function flush(cb) {
+    if (process.env.NODE_ENV !== 'production') {
+      checkForbiddenStates();
+      check(cb, func, "channel.flush' callback must be a function");
+    }
+
+    if (closed && buffer$1.isEmpty()) {
+      cb(END);
+      return;
+    }
+
+    cb(buffer$1.flush());
+  }
+
+  function close() {
+    if (process.env.NODE_ENV !== 'production') {
+      checkForbiddenStates();
+    }
+
+    if (closed) {
+      return;
+    }
+
+    closed = true;
+    var arr = takers;
+    takers = [];
+
+    for (var i = 0, len = arr.length; i < len; i++) {
+      var taker = arr[i];
+      taker(END);
+    }
+  }
+
+  return {
+    take: take,
+    put: put,
+    flush: flush,
+    close: close
+  };
+}
+function eventChannel(subscribe, buffer) {
+  if (buffer === void 0) {
+    buffer = none();
+  }
+
+  var closed = false;
+  var unsubscribe;
+  var chan = channel(buffer);
+
+  var close = function close() {
+    if (closed) {
+      return;
+    }
+
+    closed = true;
+
+    if (func(unsubscribe)) {
+      unsubscribe();
+    }
+
+    chan.close();
+  };
+
+  unsubscribe = subscribe(function (input) {
+    if (isEnd(input)) {
+      close();
+      return;
+    }
+
+    chan.put(input);
+  });
+
+  if (process.env.NODE_ENV !== 'production') {
+    check(unsubscribe, func, 'in eventChannel: subscribe should return a function to unsubscribe');
+  }
+
+  unsubscribe = once(unsubscribe);
+
+  if (closed) {
+    unsubscribe();
+  }
+
+  return {
+    take: chan.take,
+    flush: chan.flush,
+    close: close
+  };
+}
+function multicastChannel() {
+  var _ref;
+
+  var closed = false;
+  var currentTakers = [];
+  var nextTakers = currentTakers;
+
+  function checkForbiddenStates() {
+    if (closed && nextTakers.length) {
+      throw internalErr(CLOSED_CHANNEL_WITH_TAKERS);
+    }
+  }
+
+  var ensureCanMutateNextTakers = function ensureCanMutateNextTakers() {
+    if (nextTakers !== currentTakers) {
+      return;
+    }
+
+    nextTakers = currentTakers.slice();
+  };
+
+  var close = function close() {
+    if (process.env.NODE_ENV !== 'production') {
+      checkForbiddenStates();
+    }
+
+    closed = true;
+    var takers = currentTakers = nextTakers;
+    nextTakers = [];
+    takers.forEach(function (taker) {
+      taker(END);
+    });
+  };
+
+  return _ref = {}, _ref[MULTICAST] = true, _ref.put = function put(input) {
+    if (process.env.NODE_ENV !== 'production') {
+      checkForbiddenStates();
+      check(input, notUndef, UNDEFINED_INPUT_ERROR);
+    }
+
+    if (closed) {
+      return;
+    }
+
+    if (isEnd(input)) {
+      close();
+      return;
+    }
+
+    var takers = currentTakers = nextTakers;
+
+    for (var i = 0, len = takers.length; i < len; i++) {
+      var taker = takers[i];
+
+      if (taker[MATCH](input)) {
+        taker.cancel();
+        taker(input);
+      }
+    }
+  }, _ref.take = function take(cb, matcher) {
+    if (matcher === void 0) {
+      matcher = wildcard;
+    }
+
+    if (process.env.NODE_ENV !== 'production') {
+      checkForbiddenStates();
+    }
+
+    if (closed) {
+      cb(END);
+      return;
+    }
+
+    cb[MATCH] = matcher;
+    ensureCanMutateNextTakers();
+    nextTakers.push(cb);
+    cb.cancel = once(function () {
+      ensureCanMutateNextTakers();
+      remove(nextTakers, cb);
+    });
+  }, _ref.close = close, _ref;
+}
+function stdChannel() {
+  var chan = multicastChannel();
+  var put = chan.put;
+
+  chan.put = function (input) {
+    if (input[SAGA_ACTION]) {
+      put(input);
+      return;
+    }
+
+    asap(function () {
+      put(input);
+    });
+  };
+
+  return chan;
+}
+
+var RUNNING = 0;
+var CANCELLED = 1;
+var ABORTED = 2;
+var DONE = 3;
+
+function resolvePromise(promise, cb) {
+  var cancelPromise = promise[CANCEL];
+
+  if (func(cancelPromise)) {
+    cb.cancel = cancelPromise;
+  }
+
+  promise.then(cb, function (error) {
+    cb(error, true);
+  });
+}
+
+var current = 0;
+var nextSagaId = (function () {
+  return ++current;
+});
+
+var _effectRunnerMap;
+
+function getIteratorMetaInfo(iterator, fn) {
+  if (iterator.isSagaIterator) {
+    return {
+      name: iterator.meta.name
+    };
+  }
+
+  return getMetaInfo(fn);
+}
+
+function createTaskIterator(_ref) {
+  var context = _ref.context,
+      fn = _ref.fn,
+      args = _ref.args;
+
+  // catch synchronous failures; see #152 and #441
+  try {
+    var result = fn.apply(context, args); // i.e. a generator function returns an iterator
+
+    if (iterator(result)) {
+      return result;
+    }
+
+    var resolved = false;
+
+    var next = function next(arg) {
+      if (!resolved) {
+        resolved = true; // Only promises returned from fork will be interpreted. See #1573
+
+        return {
+          value: result,
+          done: !promise(result)
+        };
+      } else {
+        return {
+          value: arg,
+          done: true
+        };
+      }
+    };
+
+    return makeIterator(next);
+  } catch (err) {
+    // do not bubble up synchronous failures for detached forks
+    // instead create a failed task. See #152 and #441
+    return makeIterator(function () {
+      throw err;
+    });
+  }
+}
+
+function runPutEffect(env, _ref2, cb) {
+  var channel = _ref2.channel,
+      action = _ref2.action,
+      resolve = _ref2.resolve;
+
+  /**
+   Schedule the put in case another saga is holding a lock.
+   The put will be executed atomically. ie nested puts will execute after
+   this put has terminated.
+   **/
+  asap(function () {
+    var result;
+
+    try {
+      result = (channel ? channel.put : env.dispatch)(action);
+    } catch (error) {
+      cb(error, true);
+      return;
+    }
+
+    if (resolve && promise(result)) {
+      resolvePromise(result, cb);
+    } else {
+      cb(result);
+    }
+  }); // Put effects are non cancellables
+}
+
+function runTakeEffect(env, _ref3, cb) {
+  var _ref3$channel = _ref3.channel,
+      channel = _ref3$channel === void 0 ? env.channel : _ref3$channel,
+      pattern = _ref3.pattern,
+      maybe = _ref3.maybe;
+
+  var takeCb = function takeCb(input) {
+    if (input instanceof Error) {
+      cb(input, true);
+      return;
+    }
+
+    if (isEnd(input) && !maybe) {
+      cb(TERMINATE);
+      return;
+    }
+
+    cb(input);
+  };
+
+  try {
+    channel.take(takeCb, notUndef(pattern) ? matcher(pattern) : null);
+  } catch (err) {
+    cb(err, true);
+    return;
+  }
+
+  cb.cancel = takeCb.cancel;
+}
+
+function runCallEffect(env, _ref4, cb, _ref5) {
+  var context = _ref4.context,
+      fn = _ref4.fn,
+      args = _ref4.args;
+  var task = _ref5.task;
+
+  // catch synchronous failures; see #152
+  try {
+    var result = fn.apply(context, args);
+
+    if (promise(result)) {
+      resolvePromise(result, cb);
+      return;
+    }
+
+    if (iterator(result)) {
+      // resolve iterator
+      proc(env, result, task.context, current, getMetaInfo(fn),
+      /* isRoot */
+      false, cb);
+      return;
+    }
+
+    cb(result);
+  } catch (error) {
+    cb(error, true);
+  }
+}
+
+function runCPSEffect(env, _ref6, cb) {
+  var context = _ref6.context,
+      fn = _ref6.fn,
+      args = _ref6.args;
+
+  // CPS (ie node style functions) can define their own cancellation logic
+  // by setting cancel field on the cb
+  // catch synchronous failures; see #152
+  try {
+    var cpsCb = function cpsCb(err, res) {
+      if (undef(err)) {
+        cb(res);
+      } else {
+        cb(err, true);
+      }
+    };
+
+    fn.apply(context, args.concat(cpsCb));
+
+    if (cpsCb.cancel) {
+      cb.cancel = cpsCb.cancel;
+    }
+  } catch (error) {
+    cb(error, true);
+  }
+}
+
+function runForkEffect(env, _ref7, cb, _ref8) {
+  var context = _ref7.context,
+      fn = _ref7.fn,
+      args = _ref7.args,
+      detached = _ref7.detached;
+  var parent = _ref8.task;
+  var taskIterator = createTaskIterator({
+    context: context,
+    fn: fn,
+    args: args
+  });
+  var meta = getIteratorMetaInfo(taskIterator, fn);
+  immediately(function () {
+    var child = proc(env, taskIterator, parent.context, current, meta, detached, undefined);
+
+    if (detached) {
+      cb(child);
+    } else {
+      if (child.isRunning()) {
+        parent.queue.addTask(child);
+        cb(child);
+      } else if (child.isAborted()) {
+        parent.queue.abort(child.error());
+      } else {
+        cb(child);
+      }
+    }
+  }); // Fork effects are non cancellables
+}
+
+function runJoinEffect(env, taskOrTasks, cb, _ref9) {
+  var task = _ref9.task;
+
+  var joinSingleTask = function joinSingleTask(taskToJoin, cb) {
+    if (taskToJoin.isRunning()) {
+      var joiner = {
+        task: task,
+        cb: cb
+      };
+
+      cb.cancel = function () {
+        if (taskToJoin.isRunning()) remove(taskToJoin.joiners, joiner);
+      };
+
+      taskToJoin.joiners.push(joiner);
+    } else {
+      if (taskToJoin.isAborted()) {
+        cb(taskToJoin.error(), true);
+      } else {
+        cb(taskToJoin.result());
+      }
+    }
+  };
+
+  if (array$1(taskOrTasks)) {
+    if (taskOrTasks.length === 0) {
+      cb([]);
+      return;
+    }
+
+    var childCallbacks = createAllStyleChildCallbacks(taskOrTasks, cb);
+    taskOrTasks.forEach(function (t, i) {
+      joinSingleTask(t, childCallbacks[i]);
+    });
+  } else {
+    joinSingleTask(taskOrTasks, cb);
+  }
+}
+
+function cancelSingleTask(taskToCancel) {
+  if (taskToCancel.isRunning()) {
+    taskToCancel.cancel();
+  }
+}
+
+function runCancelEffect(env, taskOrTasks, cb, _ref10) {
+  var task = _ref10.task;
+
+  if (taskOrTasks === SELF_CANCELLATION) {
+    cancelSingleTask(task);
+  } else if (array$1(taskOrTasks)) {
+    taskOrTasks.forEach(cancelSingleTask);
+  } else {
+    cancelSingleTask(taskOrTasks);
+  }
+
+  cb(); // cancel effects are non cancellables
+}
+
+function runAllEffect(env, effects, cb, _ref11) {
+  var digestEffect = _ref11.digestEffect;
+  var effectId = current;
+  var keys = Object.keys(effects);
+
+  if (keys.length === 0) {
+    cb(array$1(effects) ? [] : {});
+    return;
+  }
+
+  var childCallbacks = createAllStyleChildCallbacks(effects, cb);
+  keys.forEach(function (key) {
+    digestEffect(effects[key], effectId, childCallbacks[key], key);
+  });
+}
+
+function runRaceEffect(env, effects, cb, _ref12) {
+  var digestEffect = _ref12.digestEffect;
+  var effectId = current;
+  var keys = Object.keys(effects);
+  var response = array$1(effects) ? createEmptyArray(keys.length) : {};
+  var childCbs = {};
+  var completed = false;
+  keys.forEach(function (key) {
+    var chCbAtKey = function chCbAtKey(res, isErr) {
+      if (completed) {
+        return;
+      }
+
+      if (isErr || shouldComplete(res)) {
+        // Race Auto cancellation
+        cb.cancel();
+        cb(res, isErr);
+      } else {
+        cb.cancel();
+        completed = true;
+        response[key] = res;
+        cb(response);
+      }
+    };
+
+    chCbAtKey.cancel = noop;
+    childCbs[key] = chCbAtKey;
+  });
+
+  cb.cancel = function () {
+    // prevents unnecessary cancellation
+    if (!completed) {
+      completed = true;
+      keys.forEach(function (key) {
+        return childCbs[key].cancel();
+      });
+    }
+  };
+
+  keys.forEach(function (key) {
+    if (completed) {
+      return;
+    }
+
+    digestEffect(effects[key], effectId, childCbs[key], key);
+  });
+}
+
+function runSelectEffect(env, _ref13, cb) {
+  var selector = _ref13.selector,
+      args = _ref13.args;
+
+  try {
+    var state = selector.apply(void 0, [env.getState()].concat(args));
+    cb(state);
+  } catch (error) {
+    cb(error, true);
+  }
+}
+
+function runChannelEffect(env, _ref14, cb) {
+  var pattern = _ref14.pattern,
+      buffer = _ref14.buffer;
+  var chan = channel(buffer);
+  var match = matcher(pattern);
+
+  var taker = function taker(action) {
+    if (!isEnd(action)) {
+      env.channel.take(taker, match);
+    }
+
+    chan.put(action);
+  };
+
+  var close = chan.close;
+
+  chan.close = function () {
+    taker.cancel();
+    close();
+  };
+
+  env.channel.take(taker, match);
+  cb(chan);
+}
+
+function runCancelledEffect(env, data, cb, _ref15) {
+  var task = _ref15.task;
+  cb(task.isCancelled());
+}
+
+function runFlushEffect(env, channel, cb) {
+  channel.flush(cb);
+}
+
+function runGetContextEffect(env, prop, cb, _ref16) {
+  var task = _ref16.task;
+  cb(task.context[prop]);
+}
+
+function runSetContextEffect(env, props, cb, _ref17) {
+  var task = _ref17.task;
+  assignWithSymbols(task.context, props);
+  cb();
+}
+
+var effectRunnerMap = (_effectRunnerMap = {}, _effectRunnerMap[TAKE] = runTakeEffect, _effectRunnerMap[PUT] = runPutEffect, _effectRunnerMap[ALL] = runAllEffect, _effectRunnerMap[RACE] = runRaceEffect, _effectRunnerMap[CALL] = runCallEffect, _effectRunnerMap[CPS] = runCPSEffect, _effectRunnerMap[FORK] = runForkEffect, _effectRunnerMap[JOIN] = runJoinEffect, _effectRunnerMap[CANCEL$1] = runCancelEffect, _effectRunnerMap[SELECT] = runSelectEffect, _effectRunnerMap[ACTION_CHANNEL] = runChannelEffect, _effectRunnerMap[CANCELLED$1] = runCancelledEffect, _effectRunnerMap[FLUSH] = runFlushEffect, _effectRunnerMap[GET_CONTEXT] = runGetContextEffect, _effectRunnerMap[SET_CONTEXT] = runSetContextEffect, _effectRunnerMap);
+
+/**
+ Used to track a parent task and its forks
+ In the fork model, forked tasks are attached by default to their parent
+ We model this using the concept of Parent task && main Task
+ main task is the main flow of the current Generator, the parent tasks is the
+ aggregation of the main tasks + all its forked tasks.
+ Thus the whole model represents an execution tree with multiple branches (vs the
+ linear execution tree in sequential (non parallel) programming)
+
+ A parent tasks has the following semantics
+ - It completes if all its forks either complete or all cancelled
+ - If it's cancelled, all forks are cancelled as well
+ - It aborts if any uncaught error bubbles up from forks
+ - If it completes, the return value is the one returned by the main task
+ **/
+
+function forkQueue(mainTask, onAbort, cont) {
+  var tasks = [];
+  var result;
+  var completed = false;
+  addTask(mainTask);
+
+  var getTasks = function getTasks() {
+    return tasks;
+  };
+
+  function abort(err) {
+    onAbort();
+    cancelAll();
+    cont(err, true);
+  }
+
+  function addTask(task) {
+    tasks.push(task);
+
+    task.cont = function (res, isErr) {
+      if (completed) {
+        return;
+      }
+
+      remove(tasks, task);
+      task.cont = noop;
+
+      if (isErr) {
+        abort(res);
+      } else {
+        if (task === mainTask) {
+          result = res;
+        }
+
+        if (!tasks.length) {
+          completed = true;
+          cont(result);
+        }
+      }
+    };
+  }
+
+  function cancelAll() {
+    if (completed) {
+      return;
+    }
+
+    completed = true;
+    tasks.forEach(function (t) {
+      t.cont = noop;
+      t.cancel();
+    });
+    tasks = [];
+  }
+
+  return {
+    addTask: addTask,
+    cancelAll: cancelAll,
+    abort: abort,
+    getTasks: getTasks
+  };
+}
+
+// there can be only a single saga error created at any given moment
+
+function formatLocation(fileName, lineNumber) {
+  return fileName + "?" + lineNumber;
+}
+
+function effectLocationAsString(effect) {
+  var location = getLocation(effect);
+
+  if (location) {
+    var code = location.code,
+        fileName = location.fileName,
+        lineNumber = location.lineNumber;
+    var source = code + "  " + formatLocation(fileName, lineNumber);
+    return source;
+  }
+
+  return '';
+}
+
+function sagaLocationAsString(sagaMeta) {
+  var name = sagaMeta.name,
+      location = sagaMeta.location;
+
+  if (location) {
+    return name + "  " + formatLocation(location.fileName, location.lineNumber);
+  }
+
+  return name;
+}
+
+function cancelledTasksAsString(sagaStack) {
+  var cancelledTasks = flatMap(function (i) {
+    return i.cancelledTasks;
+  }, sagaStack);
+
+  if (!cancelledTasks.length) {
+    return '';
+  }
+
+  return ['Tasks cancelled due to error:'].concat(cancelledTasks).join('\n');
+}
+
+var crashedEffect = null;
+var sagaStack = [];
+var addSagaFrame = function addSagaFrame(frame) {
+  frame.crashedEffect = crashedEffect;
+  sagaStack.push(frame);
+};
+var clear = function clear() {
+  crashedEffect = null;
+  sagaStack.length = 0;
+}; // this sets crashed effect for the soon-to-be-reported saga frame
+// this slightly streatches the singleton nature of this module into wrong direction
+// as it's even less obvious what's the data flow here, but it is what it is for now
+
+var setCrashedEffect = function setCrashedEffect(effect) {
+  crashedEffect = effect;
+};
+/**
+  @returns {string}
+
+  @example
+  The above error occurred in task errorInPutSaga {pathToFile}
+  when executing effect put({type: 'REDUCER_ACTION_ERROR_IN_PUT'}) {pathToFile}
+      created by fetchSaga {pathToFile}
+      created by rootSaga {pathToFile}
+*/
+
+var toString = function toString() {
+  var firstSaga = sagaStack[0],
+      otherSagas = sagaStack.slice(1);
+  var crashedEffectLocation = firstSaga.crashedEffect ? effectLocationAsString(firstSaga.crashedEffect) : null;
+  var errorMessage = "The above error occurred in task " + sagaLocationAsString(firstSaga.meta) + (crashedEffectLocation ? " \n when executing effect " + crashedEffectLocation : '');
+  return [errorMessage].concat(otherSagas.map(function (s) {
+    return "    created by " + sagaLocationAsString(s.meta);
+  }), [cancelledTasksAsString(sagaStack)]).join('\n');
+};
+
+function newTask(env, mainTask, parentContext, parentEffectId, meta, isRoot, cont) {
+  var _task;
+
+  if (cont === void 0) {
+    cont = noop;
+  }
+
+  var status = RUNNING;
+  var taskResult;
+  var taskError;
+  var deferredEnd = null;
+  var cancelledDueToErrorTasks = [];
+  var context = Object.create(parentContext);
+  var queue = forkQueue(mainTask, function onAbort() {
+    cancelledDueToErrorTasks.push.apply(cancelledDueToErrorTasks, queue.getTasks().map(function (t) {
+      return t.meta.name;
+    }));
+  }, end);
+  /**
+   This may be called by a parent generator to trigger/propagate cancellation
+   cancel all pending tasks (including the main task), then end the current task.
+    Cancellation propagates down to the whole execution tree held by this Parent task
+   It's also propagated to all joiners of this task and their execution tree/joiners
+    Cancellation is noop for terminated/Cancelled tasks tasks
+   **/
+
+  function cancel() {
+    if (status === RUNNING) {
+      // Setting status to CANCELLED does not necessarily mean that the task/iterators are stopped
+      // effects in the iterator's finally block will still be executed
+      status = CANCELLED;
+      queue.cancelAll(); // Ending with a TASK_CANCEL will propagate the Cancellation to all joiners
+
+      end(TASK_CANCEL, false);
+    }
+  }
+
+  function end(result, isErr) {
+    if (!isErr) {
+      // The status here may be RUNNING or CANCELLED
+      // If the status is CANCELLED, then we do not need to change it here
+      if (result === TASK_CANCEL) {
+        status = CANCELLED;
+      } else if (status !== CANCELLED) {
+        status = DONE;
+      }
+
+      taskResult = result;
+      deferredEnd && deferredEnd.resolve(result);
+    } else {
+      status = ABORTED;
+      addSagaFrame({
+        meta: meta,
+        cancelledTasks: cancelledDueToErrorTasks
+      });
+
+      if (task.isRoot) {
+        var sagaStack = toString(); // we've dumped the saga stack to string and are passing it to user's code
+        // we know that it won't be needed anymore and we need to clear it
+
+        clear();
+        env.onError(result, {
+          sagaStack: sagaStack
+        });
+      }
+
+      taskError = result;
+      deferredEnd && deferredEnd.reject(result);
+    }
+
+    task.cont(result, isErr);
+    task.joiners.forEach(function (joiner) {
+      joiner.cb(result, isErr);
+    });
+    task.joiners = null;
+  }
+
+  function setContext(props) {
+    if (process.env.NODE_ENV !== 'production') {
+      check(props, object, createSetContextWarning('task', props));
+    }
+
+    assignWithSymbols(context, props);
+  }
+
+  function toPromise() {
+    if (deferredEnd) {
+      return deferredEnd.promise;
+    }
+
+    deferredEnd = deferred();
+
+    if (status === ABORTED) {
+      deferredEnd.reject(taskError);
+    } else if (status !== RUNNING) {
+      deferredEnd.resolve(taskResult);
+    }
+
+    return deferredEnd.promise;
+  }
+
+  var task = (_task = {}, _task[TASK] = true, _task.id = parentEffectId, _task.meta = meta, _task.isRoot = isRoot, _task.context = context, _task.joiners = [], _task.queue = queue, _task.cancel = cancel, _task.cont = cont, _task.end = end, _task.setContext = setContext, _task.toPromise = toPromise, _task.isRunning = function isRunning() {
+    return status === RUNNING;
+  }, _task.isCancelled = function isCancelled() {
+    return status === CANCELLED || status === RUNNING && mainTask.status === CANCELLED;
+  }, _task.isAborted = function isAborted() {
+    return status === ABORTED;
+  }, _task.result = function result() {
+    return taskResult;
+  }, _task.error = function error() {
+    return taskError;
+  }, _task);
+  return task;
+}
+
+function proc(env, iterator$1, parentContext, parentEffectId, meta, isRoot, cont) {
+  if (process.env.NODE_ENV !== 'production' && iterator$1[asyncIteratorSymbol]) {
+    throw new Error("redux-saga doesn't support async generators, please use only regular ones");
+  }
+
+  var finalRunEffect = env.finalizeRunEffect(runEffect);
+  /**
+    Tracks the current effect cancellation
+    Each time the generator progresses. calling runEffect will set a new value
+    on it. It allows propagating cancellation to child effects
+  **/
+
+  next.cancel = noop;
+  /** Creates a main task to track the main flow */
+
+  var mainTask = {
+    meta: meta,
+    cancel: cancelMain,
+    status: RUNNING
+  };
+  /**
+   Creates a new task descriptor for this generator.
+   A task is the aggregation of it's mainTask and all it's forked tasks.
+   **/
+
+  var task = newTask(env, mainTask, parentContext, parentEffectId, meta, isRoot, cont);
+  var executingContext = {
+    task: task,
+    digestEffect: digestEffect
+  };
+  /**
+    cancellation of the main task. We'll simply resume the Generator with a TASK_CANCEL
+  **/
+
+  function cancelMain() {
+    if (mainTask.status === RUNNING) {
+      mainTask.status = CANCELLED;
+      next(TASK_CANCEL);
+    }
+  }
+  /**
+    attaches cancellation logic to this task's continuation
+    this will permit cancellation to propagate down the call chain
+  **/
+
+
+  if (cont) {
+    cont.cancel = task.cancel;
+  } // kicks up the generator
+
+
+  next(); // then return the task descriptor to the caller
+
+  return task;
+  /**
+   * This is the generator driver
+   * It's a recursive async/continuation function which calls itself
+   * until the generator terminates or throws
+   * @param {internal commands(TASK_CANCEL | TERMINATE) | any} arg - value, generator will be resumed with.
+   * @param {boolean} isErr - the flag shows if effect finished with an error
+   *
+   * receives either (command | effect result, false) or (any thrown thing, true)
+   */
+
+  function next(arg, isErr) {
+    try {
+      var result;
+
+      if (isErr) {
+        result = iterator$1.throw(arg); // user handled the error, we can clear bookkept values
+
+        clear();
+      } else if (shouldCancel(arg)) {
+        /**
+          getting TASK_CANCEL automatically cancels the main task
+          We can get this value here
+           - By cancelling the parent task manually
+          - By joining a Cancelled task
+        **/
+        mainTask.status = CANCELLED;
+        /**
+          Cancels the current effect; this will propagate the cancellation down to any called tasks
+        **/
+
+        next.cancel();
+        /**
+          If this Generator has a `return` method then invokes it
+          This will jump to the finally block
+        **/
+
+        result = func(iterator$1.return) ? iterator$1.return(TASK_CANCEL) : {
+          done: true,
+          value: TASK_CANCEL
+        };
+      } else if (shouldTerminate(arg)) {
+        // We get TERMINATE flag, i.e. by taking from a channel that ended using `take` (and not `takem` used to trap End of channels)
+        result = func(iterator$1.return) ? iterator$1.return() : {
+          done: true
+        };
+      } else {
+        result = iterator$1.next(arg);
+      }
+
+      if (!result.done) {
+        digestEffect(result.value, parentEffectId, next);
+      } else {
+        /**
+          This Generator has ended, terminate the main task and notify the fork queue
+        **/
+        if (mainTask.status !== CANCELLED) {
+          mainTask.status = DONE;
+        }
+
+        mainTask.cont(result.value);
+      }
+    } catch (error) {
+      if (mainTask.status === CANCELLED) {
+        throw error;
+      }
+
+      mainTask.status = ABORTED;
+      mainTask.cont(error, true);
+    }
+  }
+
+  function runEffect(effect, effectId, currCb) {
+    /**
+      each effect runner must attach its own logic of cancellation to the provided callback
+      it allows this generator to propagate cancellation downward.
+       ATTENTION! effect runners must setup the cancel logic by setting cb.cancel = [cancelMethod]
+      And the setup must occur before calling the callback
+       This is a sort of inversion of control: called async functions are responsible
+      of completing the flow by calling the provided continuation; while caller functions
+      are responsible for aborting the current flow by calling the attached cancel function
+       Library users can attach their own cancellation logic to promises by defining a
+      promise[CANCEL] method in their returned promises
+      ATTENTION! calling cancel must have no effect on an already completed or cancelled effect
+    **/
+    if (promise(effect)) {
+      resolvePromise(effect, currCb);
+    } else if (iterator(effect)) {
+      // resolve iterator
+      proc(env, effect, task.context, effectId, meta,
+      /* isRoot */
+      false, currCb);
+    } else if (effect && effect[IO]) {
+      var effectRunner = effectRunnerMap[effect.type];
+      effectRunner(env, effect.payload, currCb, executingContext);
+    } else {
+      // anything else returned as is
+      currCb(effect);
+    }
+  }
+
+  function digestEffect(effect, parentEffectId, cb, label) {
+    if (label === void 0) {
+      label = '';
+    }
+
+    var effectId = nextSagaId();
+    env.sagaMonitor && env.sagaMonitor.effectTriggered({
+      effectId: effectId,
+      parentEffectId: parentEffectId,
+      label: label,
+      effect: effect
+    });
+    /**
+      completion callback and cancel callback are mutually exclusive
+      We can't cancel an already completed effect
+      And We can't complete an already cancelled effectId
+    **/
+
+    var effectSettled; // Completion callback passed to the appropriate effect runner
+
+    function currCb(res, isErr) {
+      if (effectSettled) {
+        return;
+      }
+
+      effectSettled = true;
+      cb.cancel = noop; // defensive measure
+
+      if (env.sagaMonitor) {
+        if (isErr) {
+          env.sagaMonitor.effectRejected(effectId, res);
+        } else {
+          env.sagaMonitor.effectResolved(effectId, res);
+        }
+      }
+
+      if (isErr) {
+        setCrashedEffect(effect);
+      }
+
+      cb(res, isErr);
+    } // tracks down the current cancel
+
+
+    currCb.cancel = noop; // setup cancellation logic on the parent cb
+
+    cb.cancel = function () {
+      // prevents cancelling an already completed effect
+      if (effectSettled) {
+        return;
+      }
+
+      effectSettled = true;
+      currCb.cancel(); // propagates cancel downward
+
+      currCb.cancel = noop; // defensive measure
+
+      env.sagaMonitor && env.sagaMonitor.effectCancelled(effectId);
+    };
+
+    finalRunEffect(effect, effectId, currCb);
+  }
+}
+
+var RUN_SAGA_SIGNATURE = 'runSaga(options, saga, ...args)';
+var NON_GENERATOR_ERR = RUN_SAGA_SIGNATURE + ": saga argument must be a Generator function!";
+function runSaga(_ref, saga) {
+  var _ref$channel = _ref.channel,
+      channel = _ref$channel === void 0 ? stdChannel() : _ref$channel,
+      dispatch = _ref.dispatch,
+      getState = _ref.getState,
+      _ref$context = _ref.context,
+      context = _ref$context === void 0 ? {} : _ref$context,
+      sagaMonitor = _ref.sagaMonitor,
+      effectMiddlewares = _ref.effectMiddlewares,
+      _ref$onError = _ref.onError,
+      onError = _ref$onError === void 0 ? logError : _ref$onError;
+
+  if (process.env.NODE_ENV !== 'production') {
+    check(saga, func, NON_GENERATOR_ERR);
+  }
+
+  for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+    args[_key - 2] = arguments[_key];
+  }
+
+  var iterator$1 = saga.apply(void 0, args);
+
+  if (process.env.NODE_ENV !== 'production') {
+    check(iterator$1, iterator, NON_GENERATOR_ERR);
+  }
+
+  var effectId = nextSagaId();
+
+  if (sagaMonitor) {
+    // monitors are expected to have a certain interface, let's fill-in any missing ones
+    sagaMonitor.rootSagaStarted = sagaMonitor.rootSagaStarted || noop;
+    sagaMonitor.effectTriggered = sagaMonitor.effectTriggered || noop;
+    sagaMonitor.effectResolved = sagaMonitor.effectResolved || noop;
+    sagaMonitor.effectRejected = sagaMonitor.effectRejected || noop;
+    sagaMonitor.effectCancelled = sagaMonitor.effectCancelled || noop;
+    sagaMonitor.actionDispatched = sagaMonitor.actionDispatched || noop;
+    sagaMonitor.rootSagaStarted({
+      effectId: effectId,
+      saga: saga,
+      args: args
+    });
+  }
+
+  if (process.env.NODE_ENV !== 'production') {
+    if (notUndef(dispatch)) {
+      check(dispatch, func, 'dispatch must be a function');
+    }
+
+    if (notUndef(getState)) {
+      check(getState, func, 'getState must be a function');
+    }
+
+    if (notUndef(effectMiddlewares)) {
+      var MIDDLEWARE_TYPE_ERROR = 'effectMiddlewares must be an array of functions';
+      check(effectMiddlewares, array$1, MIDDLEWARE_TYPE_ERROR);
+      effectMiddlewares.forEach(function (effectMiddleware) {
+        return check(effectMiddleware, func, MIDDLEWARE_TYPE_ERROR);
+      });
+    }
+
+    check(onError, func, 'onError passed to the redux-saga is not a function!');
+  }
+
+  var finalizeRunEffect;
+
+  if (effectMiddlewares) {
+    var middleware = compose.apply(void 0, effectMiddlewares);
+
+    finalizeRunEffect = function finalizeRunEffect(runEffect) {
+      return function (effect, effectId, currCb) {
+        var plainRunEffect = function plainRunEffect(eff) {
+          return runEffect(eff, effectId, currCb);
+        };
+
+        return middleware(plainRunEffect)(effect);
+      };
+    };
+  } else {
+    finalizeRunEffect = identity;
+  }
+
+  var env = {
+    channel: channel,
+    dispatch: wrapSagaDispatch(dispatch),
+    getState: getState,
+    sagaMonitor: sagaMonitor,
+    onError: onError,
+    finalizeRunEffect: finalizeRunEffect
+  };
+  return immediately(function () {
+    var task = proc(env, iterator$1, context, effectId, getMetaInfo(saga),
+    /* isRoot */
+    true, undefined);
+
+    if (sagaMonitor) {
+      sagaMonitor.effectResolved(effectId, task);
+    }
+
+    return task;
+  });
+}
+
+function sagaMiddlewareFactory(_temp) {
+  var _ref = _temp === void 0 ? {} : _temp,
+      _ref$context = _ref.context,
+      context = _ref$context === void 0 ? {} : _ref$context,
+      _ref$channel = _ref.channel,
+      channel = _ref$channel === void 0 ? stdChannel() : _ref$channel,
+      sagaMonitor = _ref.sagaMonitor,
+      options = _objectWithoutPropertiesLoose(_ref, ["context", "channel", "sagaMonitor"]);
+
+  var boundRunSaga;
+
+  if (process.env.NODE_ENV !== 'production') {
+    check(channel, channel$1, 'options.channel passed to the Saga middleware is not a channel');
+  }
+
+  function sagaMiddleware(_ref2) {
+    var getState = _ref2.getState,
+        dispatch = _ref2.dispatch;
+    boundRunSaga = runSaga.bind(null, _extends({}, options, {
+      context: context,
+      channel: channel,
+      dispatch: dispatch,
+      getState: getState,
+      sagaMonitor: sagaMonitor
+    }));
+    return function (next) {
+      return function (action) {
+        if (sagaMonitor && sagaMonitor.actionDispatched) {
+          sagaMonitor.actionDispatched(action);
+        }
+
+        var result = next(action); // hit reducers
+
+        channel.put(action);
+        return result;
+      };
+    };
+  }
+
+  sagaMiddleware.run = function () {
+    if (process.env.NODE_ENV !== 'production' && !boundRunSaga) {
+      throw new Error('Before running a Saga, you must mount the Saga middleware on the Store using applyMiddleware');
+    }
+
+    return boundRunSaga.apply(void 0, arguments);
+  };
+
+  sagaMiddleware.setContext = function (props) {
+    if (process.env.NODE_ENV !== 'production') {
+      check(props, object, createSetContextWarning('sagaMiddleware', props));
+    }
+
+    assignWithSymbols(context, props);
+  };
+
+  return sagaMiddleware;
+}
+
+export default sagaMiddlewareFactory;
+export { END, channel, eventChannel, isEnd, multicastChannel, runSaga, stdChannel };
diff --git a/ddb_main/node_modules/@redux-saga/core/dist/redux-saga-effects.esm.js b/ddb_main/node_modules/@redux-saga/core/dist/redux-saga-effects.esm.js
new file mode 100644
index 0000000..bbfa8a5
--- /dev/null
+++ b/ddb_main/node_modules/@redux-saga/core/dist/redux-saga-effects.esm.js
@@ -0,0 +1,452 @@
+import '@redux-saga/symbols';
+import '@babel/runtime/helpers/esm/extends';
+import { channel, stringableFunc, func, notUndef } from '@redux-saga/is';
+import { q as makeIterator, L as take, M as fork, N as cancel, O as call, Q as delay, U as actionChannel, V as sliding, W as race, c as check } from './io-22ea0cf9.js';
+export { U as actionChannel, $ as all, a0 as apply, O as call, N as cancel, a5 as cancelled, a1 as cps, Q as delay, X as effectTypes, a6 as flush, M as fork, a7 as getContext, a3 as join, Z as put, _ as putResolve, W as race, a4 as select, a8 as setContext, a2 as spawn, L as take, Y as takeMaybe } from './io-22ea0cf9.js';
+import '@redux-saga/delay-p';
+
+var done = function done(value) {
+  return {
+    done: true,
+    value: value
+  };
+};
+
+var qEnd = {};
+function safeName(patternOrChannel) {
+  if (channel(patternOrChannel)) {
+    return 'channel';
+  }
+
+  if (stringableFunc(patternOrChannel)) {
+    return String(patternOrChannel);
+  }
+
+  if (func(patternOrChannel)) {
+    return patternOrChannel.name;
+  }
+
+  return String(patternOrChannel);
+}
+function fsmIterator(fsm, startState, name) {
+  var stateUpdater,
+      errorState,
+      effect,
+      nextState = startState;
+
+  function next(arg, error) {
+    if (nextState === qEnd) {
+      return done(arg);
+    }
+
+    if (error && !errorState) {
+      nextState = qEnd;
+      throw error;
+    } else {
+      stateUpdater && stateUpdater(arg);
+      var currentState = error ? fsm[errorState](error) : fsm[nextState]();
+      nextState = currentState.nextState;
+      effect = currentState.effect;
+      stateUpdater = currentState.stateUpdater;
+      errorState = currentState.errorState;
+      return nextState === qEnd ? done(arg) : effect;
+    }
+  }
+
+  return makeIterator(next, function (error) {
+    return next(null, error);
+  }, name);
+}
+
+function takeEvery(patternOrChannel, worker) {
+  for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+    args[_key - 2] = arguments[_key];
+  }
+
+  var yTake = {
+    done: false,
+    value: take(patternOrChannel)
+  };
+
+  var yFork = function yFork(ac) {
+    return {
+      done: false,
+      value: fork.apply(void 0, [worker].concat(args, [ac]))
+    };
+  };
+
+  var action,
+      setAction = function setAction(ac) {
+    return action = ac;
+  };
+
+  return fsmIterator({
+    q1: function q1() {
+      return {
+        nextState: 'q2',
+        effect: yTake,
+        stateUpdater: setAction
+      };
+    },
+    q2: function q2() {
+      return {
+        nextState: 'q1',
+        effect: yFork(action)
+      };
+    }
+  }, 'q1', "takeEvery(" + safeName(patternOrChannel) + ", " + worker.name + ")");
+}
+
+function takeLatest(patternOrChannel, worker) {
+  for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+    args[_key - 2] = arguments[_key];
+  }
+
+  var yTake = {
+    done: false,
+    value: take(patternOrChannel)
+  };
+
+  var yFork = function yFork(ac) {
+    return {
+      done: false,
+      value: fork.apply(void 0, [worker].concat(args, [ac]))
+    };
+  };
+
+  var yCancel = function yCancel(task) {
+    return {
+      done: false,
+      value: cancel(task)
+    };
+  };
+
+  var task, action;
+
+  var setTask = function setTask(t) {
+    return task = t;
+  };
+
+  var setAction = function setAction(ac) {
+    return action = ac;
+  };
+
+  return fsmIterator({
+    q1: function q1() {
+      return {
+        nextState: 'q2',
+        effect: yTake,
+        stateUpdater: setAction
+      };
+    },
+    q2: function q2() {
+      return task ? {
+        nextState: 'q3',
+        effect: yCancel(task)
+      } : {
+        nextState: 'q1',
+        effect: yFork(action),
+        stateUpdater: setTask
+      };
+    },
+    q3: function q3() {
+      return {
+        nextState: 'q1',
+        effect: yFork(action),
+        stateUpdater: setTask
+      };
+    }
+  }, 'q1', "takeLatest(" + safeName(patternOrChannel) + ", " + worker.name + ")");
+}
+
+function takeLeading(patternOrChannel, worker) {
+  for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+    args[_key - 2] = arguments[_key];
+  }
+
+  var yTake = {
+    done: false,
+    value: take(patternOrChannel)
+  };
+
+  var yCall = function yCall(ac) {
+    return {
+      done: false,
+      value: call.apply(void 0, [worker].concat(args, [ac]))
+    };
+  };
+
+  var action;
+
+  var setAction = function setAction(ac) {
+    return action = ac;
+  };
+
+  return fsmIterator({
+    q1: function q1() {
+      return {
+        nextState: 'q2',
+        effect: yTake,
+        stateUpdater: setAction
+      };
+    },
+    q2: function q2() {
+      return {
+        nextState: 'q1',
+        effect: yCall(action)
+      };
+    }
+  }, 'q1', "takeLeading(" + safeName(patternOrChannel) + ", " + worker.name + ")");
+}
+
+function throttle(delayLength, patternOrChannel, worker) {
+  for (var _len = arguments.length, args = new Array(_len > 3 ? _len - 3 : 0), _key = 3; _key < _len; _key++) {
+    args[_key - 3] = arguments[_key];
+  }
+
+  var action, channel$1;
+
+  var yTake = function yTake() {
+    return {
+      done: false,
+      value: take(channel$1)
+    };
+  };
+
+  var yFork = function yFork(ac) {
+    return {
+      done: false,
+      value: fork.apply(void 0, [worker].concat(args, [ac]))
+    };
+  };
+
+  var yDelay = {
+    done: false,
+    value: delay(delayLength)
+  };
+
+  var setAction = function setAction(ac) {
+    return action = ac;
+  };
+
+  var setChannel = function setChannel(ch) {
+    return channel$1 = ch;
+  };
+
+  var needsChannel = !channel(patternOrChannel);
+
+  if (!needsChannel) {
+    setChannel(patternOrChannel);
+  }
+
+  return fsmIterator({
+    q1: function q1() {
+      var yActionChannel = {
+        done: false,
+        value: actionChannel(patternOrChannel, sliding(1))
+      };
+      return {
+        nextState: 'q2',
+        effect: yActionChannel,
+        stateUpdater: setChannel
+      };
+    },
+    q2: function q2() {
+      return {
+        nextState: 'q3',
+        effect: yTake(),
+        stateUpdater: setAction
+      };
+    },
+    q3: function q3() {
+      return {
+        nextState: 'q4',
+        effect: yFork(action)
+      };
+    },
+    q4: function q4() {
+      return {
+        nextState: 'q2',
+        effect: yDelay
+      };
+    }
+  }, needsChannel ? 'q1' : 'q2', "throttle(" + safeName(patternOrChannel) + ", " + worker.name + ")");
+}
+
+function retry(maxTries, delayLength, fn) {
+  var counter = maxTries;
+
+  for (var _len = arguments.length, args = new Array(_len > 3 ? _len - 3 : 0), _key = 3; _key < _len; _key++) {
+    args[_key - 3] = arguments[_key];
+  }
+
+  var yCall = {
+    done: false,
+    value: call.apply(void 0, [fn].concat(args))
+  };
+  var yDelay = {
+    done: false,
+    value: delay(delayLength)
+  };
+  return fsmIterator({
+    q1: function q1() {
+      return {
+        nextState: 'q2',
+        effect: yCall,
+        errorState: 'q10'
+      };
+    },
+    q2: function q2() {
+      return {
+        nextState: qEnd
+      };
+    },
+    q10: function q10(error) {
+      counter -= 1;
+
+      if (counter <= 0) {
+        throw error;
+      }
+
+      return {
+        nextState: 'q1',
+        effect: yDelay
+      };
+    }
+  }, 'q1', "retry(" + fn.name + ")");
+}
+
+function debounceHelper(delayLength, patternOrChannel, worker) {
+  for (var _len = arguments.length, args = new Array(_len > 3 ? _len - 3 : 0), _key = 3; _key < _len; _key++) {
+    args[_key - 3] = arguments[_key];
+  }
+
+  var action, raceOutput;
+  var yTake = {
+    done: false,
+    value: take(patternOrChannel)
+  };
+  var yRace = {
+    done: false,
+    value: race({
+      action: take(patternOrChannel),
+      debounce: delay(delayLength)
+    })
+  };
+
+  var yFork = function yFork(ac) {
+    return {
+      done: false,
+      value: fork.apply(void 0, [worker].concat(args, [ac]))
+    };
+  };
+
+  var yNoop = function yNoop(value) {
+    return {
+      done: false,
+      value: value
+    };
+  };
+
+  var setAction = function setAction(ac) {
+    return action = ac;
+  };
+
+  var setRaceOutput = function setRaceOutput(ro) {
+    return raceOutput = ro;
+  };
+
+  return fsmIterator({
+    q1: function q1() {
+      return {
+        nextState: 'q2',
+        effect: yTake,
+        stateUpdater: setAction
+      };
+    },
+    q2: function q2() {
+      return {
+        nextState: 'q3',
+        effect: yRace,
+        stateUpdater: setRaceOutput
+      };
+    },
+    q3: function q3() {
+      return raceOutput.debounce ? {
+        nextState: 'q1',
+        effect: yFork(action)
+      } : {
+        nextState: 'q2',
+        effect: yNoop(raceOutput.action),
+        stateUpdater: setAction
+      };
+    }
+  }, 'q1', "debounce(" + safeName(patternOrChannel) + ", " + worker.name + ")");
+}
+
+var validateTakeEffect = function validateTakeEffect(fn, patternOrChannel, worker) {
+  check(patternOrChannel, notUndef, fn.name + " requires a pattern or channel");
+  check(worker, notUndef, fn.name + " requires a saga parameter");
+};
+
+function takeEvery$1(patternOrChannel, worker) {
+  if (process.env.NODE_ENV !== 'production') {
+    validateTakeEffect(takeEvery$1, patternOrChannel, worker);
+  }
+
+  for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+    args[_key - 2] = arguments[_key];
+  }
+
+  return fork.apply(void 0, [takeEvery, patternOrChannel, worker].concat(args));
+}
+function takeLatest$1(patternOrChannel, worker) {
+  if (process.env.NODE_ENV !== 'production') {
+    validateTakeEffect(takeLatest$1, patternOrChannel, worker);
+  }
+
+  for (var _len2 = arguments.length, args = new Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) {
+    args[_key2 - 2] = arguments[_key2];
+  }
+
+  return fork.apply(void 0, [takeLatest, patternOrChannel, worker].concat(args));
+}
+function takeLeading$1(patternOrChannel, worker) {
+  if (process.env.NODE_ENV !== 'production') {
+    validateTakeEffect(takeLeading$1, patternOrChannel, worker);
+  }
+
+  for (var _len3 = arguments.length, args = new Array(_len3 > 2 ? _len3 - 2 : 0), _key3 = 2; _key3 < _len3; _key3++) {
+    args[_key3 - 2] = arguments[_key3];
+  }
+
+  return fork.apply(void 0, [takeLeading, patternOrChannel, worker].concat(args));
+}
+function throttle$1(ms, patternOrChannel, worker) {
+  if (process.env.NODE_ENV !== 'production') {
+    check(patternOrChannel, notUndef, "throttle requires a pattern or channel");
+    check(worker, notUndef, 'throttle requires a saga parameter');
+  }
+
+  for (var _len4 = arguments.length, args = new Array(_len4 > 3 ? _len4 - 3 : 0), _key4 = 3; _key4 < _len4; _key4++) {
+    args[_key4 - 3] = arguments[_key4];
+  }
+
+  return fork.apply(void 0, [throttle, ms, patternOrChannel, worker].concat(args));
+}
+function retry$1(maxTries, delayLength, worker) {
+  for (var _len5 = arguments.length, args = new Array(_len5 > 3 ? _len5 - 3 : 0), _key5 = 3; _key5 < _len5; _key5++) {
+    args[_key5 - 3] = arguments[_key5];
+  }
+
+  return call.apply(void 0, [retry, maxTries, delayLength, worker].concat(args));
+}
+function debounce(delayLength, pattern, worker) {
+  for (var _len6 = arguments.length, args = new Array(_len6 > 3 ? _len6 - 3 : 0), _key6 = 3; _key6 < _len6; _key6++) {
+    args[_key6 - 3] = arguments[_key6];
+  }
+
+  return fork.apply(void 0, [debounceHelper, delayLength, pattern, worker].concat(args));
+}
+
+export { debounce, retry$1 as retry, takeEvery$1 as takeEvery, takeLatest$1 as takeLatest, takeLeading$1 as takeLeading, throttle$1 as throttle };
diff --git a/ddb_main/node_modules/@redux-saga/deferred/dist/redux-saga-deferred.esm.js b/ddb_main/node_modules/@redux-saga/deferred/dist/redux-saga-deferred.esm.js
new file mode 100644
index 0000000..380a3a4
--- /dev/null
+++ b/ddb_main/node_modules/@redux-saga/deferred/dist/redux-saga-deferred.esm.js
@@ -0,0 +1,20 @@
+function deferred() {
+  var def = {};
+  def.promise = new Promise(function (resolve, reject) {
+    def.resolve = resolve;
+    def.reject = reject;
+  });
+  return def;
+}
+function arrayOfDeferred(length) {
+  var arr = [];
+
+  for (var i = 0; i < length; i++) {
+    arr.push(deferred());
+  }
+
+  return arr;
+}
+
+export default deferred;
+export { arrayOfDeferred };
diff --git a/ddb_main/node_modules/@redux-saga/is/dist/redux-saga-is.esm.js b/ddb_main/node_modules/@redux-saga/is/dist/redux-saga-is.esm.js
new file mode 100644
index 0000000..b13c787
--- /dev/null
+++ b/ddb_main/node_modules/@redux-saga/is/dist/redux-saga-is.esm.js
@@ -0,0 +1,62 @@
+import { TASK, SAGA_ACTION, MULTICAST, IO } from '@redux-saga/symbols';
+
+var undef = function undef(v) {
+  return v === null || v === undefined;
+};
+var notUndef = function notUndef(v) {
+  return v !== null && v !== undefined;
+};
+var func = function func(f) {
+  return typeof f === 'function';
+};
+var number = function number(n) {
+  return typeof n === 'number';
+};
+var string = function string(s) {
+  return typeof s === 'string';
+};
+var array = Array.isArray;
+var object = function object(obj) {
+  return obj && !array(obj) && typeof obj === 'object';
+};
+var promise = function promise(p) {
+  return p && func(p.then);
+};
+var iterator = function iterator(it) {
+  return it && func(it.next) && func(it.throw);
+};
+var iterable = function iterable(it) {
+  return it && func(Symbol) ? func(it[Symbol.iterator]) : array(it);
+};
+var task = function task(t) {
+  return t && t[TASK];
+};
+var sagaAction = function sagaAction(a) {
+  return Boolean(a && a[SAGA_ACTION]);
+};
+var observable = function observable(ob) {
+  return ob && func(ob.subscribe);
+};
+var buffer = function buffer(buf) {
+  return buf && func(buf.isEmpty) && func(buf.take) && func(buf.put);
+};
+var pattern = function pattern(pat) {
+  return pat && (string(pat) || symbol(pat) || func(pat) || array(pat) && pat.every(pattern));
+};
+var channel = function channel(ch) {
+  return ch && func(ch.take) && func(ch.close);
+};
+var stringableFunc = function stringableFunc(f) {
+  return func(f) && f.hasOwnProperty('toString');
+};
+var symbol = function symbol(sym) {
+  return Boolean(sym) && typeof Symbol === 'function' && sym.constructor === Symbol && sym !== Symbol.prototype;
+};
+var multicast = function multicast(ch) {
+  return channel(ch) && ch[MULTICAST];
+};
+var effect = function effect(eff) {
+  return eff && eff[IO];
+};
+
+export { array, buffer, channel, effect, func, iterable, iterator, multicast, notUndef, number, object, observable, pattern, promise, sagaAction, string, stringableFunc, symbol, task, undef };
diff --git a/ddb_main/node_modules/@redux-saga/symbols/dist/redux-saga-symbols.esm.js b/ddb_main/node_modules/@redux-saga/symbols/dist/redux-saga-symbols.esm.js
new file mode 100644
index 0000000..faf5615
--- /dev/null
+++ b/ddb_main/node_modules/@redux-saga/symbols/dist/redux-saga-symbols.esm.js
@@ -0,0 +1,39 @@
+var createSymbol = function createSymbol(name) {
+  return "@@redux-saga/" + name;
+};
+
+var CANCEL =
+/*#__PURE__*/
+createSymbol('CANCEL_PROMISE');
+var CHANNEL_END_TYPE =
+/*#__PURE__*/
+createSymbol('CHANNEL_END');
+var IO =
+/*#__PURE__*/
+createSymbol('IO');
+var MATCH =
+/*#__PURE__*/
+createSymbol('MATCH');
+var MULTICAST =
+/*#__PURE__*/
+createSymbol('MULTICAST');
+var SAGA_ACTION =
+/*#__PURE__*/
+createSymbol('SAGA_ACTION');
+var SELF_CANCELLATION =
+/*#__PURE__*/
+createSymbol('SELF_CANCELLATION');
+var TASK =
+/*#__PURE__*/
+createSymbol('TASK');
+var TASK_CANCEL =
+/*#__PURE__*/
+createSymbol('TASK_CANCEL');
+var TERMINATE =
+/*#__PURE__*/
+createSymbol('TERMINATE');
+var SAGA_LOCATION =
+/*#__PURE__*/
+createSymbol('LOCATION');
+
+export { CANCEL, CHANNEL_END_TYPE, IO, MATCH, MULTICAST, SAGA_ACTION, SAGA_LOCATION, SELF_CANCELLATION, TASK, TASK_CANCEL, TERMINATE };
diff --git a/ddb_main/node_modules/@remix-run/router/history.ts b/ddb_main/node_modules/@remix-run/router/history.ts
new file mode 100644
index 0000000..335645d
--- /dev/null
+++ b/ddb_main/node_modules/@remix-run/router/history.ts
@@ -0,0 +1,746 @@
+////////////////////////////////////////////////////////////////////////////////
+//#region Types and Constants
+////////////////////////////////////////////////////////////////////////////////
+
+/**
+ * Actions represent the type of change to a location value.
+ */
+export enum Action {
+  /**
+   * A POP indicates a change to an arbitrary index in the history stack, such
+   * as a back or forward navigation. It does not describe the direction of the
+   * navigation, only that the current index changed.
+   *
+   * Note: This is the default action for newly created history objects.
+   */
+  Pop = "POP",
+
+  /**
+   * A PUSH indicates a new entry being added to the history stack, such as when
+   * a link is clicked and a new page loads. When this happens, all subsequent
+   * entries in the stack are lost.
+   */
+  Push = "PUSH",
+
+  /**
+   * A REPLACE indicates the entry at the current index in the history stack
+   * being replaced by a new one.
+   */
+  Replace = "REPLACE",
+}
+
+/**
+ * The pathname, search, and hash values of a URL.
+ */
+export interface Path {
+  /**
+   * A URL pathname, beginning with a /.
+   */
+  pathname: string;
+
+  /**
+   * A URL search string, beginning with a ?.
+   */
+  search: string;
+
+  /**
+   * A URL fragment identifier, beginning with a #.
+   */
+  hash: string;
+}
+
+// TODO: (v7) Change the Location generic default from `any` to `unknown` and
+// remove Remix `useLocation` wrapper.
+
+/**
+ * An entry in a history stack. A location contains information about the
+ * URL path, as well as possibly some arbitrary state and a key.
+ */
+export interface Location<State = any> extends Path {
+  /**
+   * A value of arbitrary data associated with this location.
+   */
+  state: State;
+
+  /**
+   * A unique string associated with this location. May be used to safely store
+   * and retrieve data in some other storage API, like `localStorage`.
+   *
+   * Note: This value is always "default" on the initial location.
+   */
+  key: string;
+}
+
+/**
+ * A change to the current location.
+ */
+export interface Update {
+  /**
+   * The action that triggered the change.
+   */
+  action: Action;
+
+  /**
+   * The new location.
+   */
+  location: Location;
+
+  /**
+   * The delta between this location and the former location in the history stack
+   */
+  delta: number | null;
+}
+
+/**
+ * A function that receives notifications about location changes.
+ */
+export interface Listener {
+  (update: Update): void;
+}
+
+/**
+ * Describes a location that is the destination of some navigation, either via
+ * `history.push` or `history.replace`. This may be either a URL or the pieces
+ * of a URL path.
+ */
+export type To = string | Partial<Path>;
+
+/**
+ * A history is an interface to the navigation stack. The history serves as the
+ * source of truth for the current location, as well as provides a set of
+ * methods that may be used to change it.
+ *
+ * It is similar to the DOM's `window.history` object, but with a smaller, more
+ * focused API.
+ */
+export interface History {
+  /**
+   * The last action that modified the current location. This will always be
+   * Action.Pop when a history instance is first created. This value is mutable.
+   */
+  readonly action: Action;
+
+  /**
+   * The current location. This value is mutable.
+   */
+  readonly location: Location;
+
+  /**
+   * Returns a valid href for the given `to` value that may be used as
+   * the value of an <a href> attribute.
+   *
+   * @param to - The destination URL
+   */
+  createHref(to: To): string;
+
+  /**
+   * Returns a URL for the given `to` value
+   *
+   * @param to - The destination URL
+   */
+  createURL(to: To): URL;
+
+  /**
+   * Encode a location the same way window.history would do (no-op for memory
+   * history) so we ensure our PUSH/REPLACE navigations for data routers
+   * behave the same as POP
+   *
+   * @param to Unencoded path
+   */
+  encodeLocation(to: To): Path;
+
+  /**
+   * Pushes a new location onto the history stack, increasing its length by one.
+   * If there were any entries in the stack after the current one, they are
+   * lost.
+   *
+   * @param to - The new URL
+   * @param state - Data to associate with the new location
+   */
+  push(to: To, state?: any): void;
+
+  /**
+   * Replaces the current location in the history stack with a new one.  The
+   * location that was replaced will no longer be available.
+   *
+   * @param to - The new URL
+   * @param state - Data to associate with the new location
+   */
+  replace(to: To, state?: any): void;
+
+  /**
+   * Navigates `n` entries backward/forward in the history stack relative to the
+   * current index. For example, a "back" navigation would use go(-1).
+   *
+   * @param delta - The delta in the stack index
+   */
+  go(delta: number): void;
+
+  /**
+   * Sets up a listener that will be called whenever the current location
+   * changes.
+   *
+   * @param listener - A function that will be called when the location changes
+   * @returns unlisten - A function that may be used to stop listening
+   */
+  listen(listener: Listener): () => void;
+}
+
+type HistoryState = {
+  usr: any;
+  key?: string;
+  idx: number;
+};
+
+const PopStateEventType = "popstate";
+//#endregion
+
+////////////////////////////////////////////////////////////////////////////////
+//#region Memory History
+////////////////////////////////////////////////////////////////////////////////
+
+/**
+ * A user-supplied object that describes a location. Used when providing
+ * entries to `createMemoryHistory` via its `initialEntries` option.
+ */
+export type InitialEntry = string | Partial<Location>;
+
+export type MemoryHistoryOptions = {
+  initialEntries?: InitialEntry[];
+  initialIndex?: number;
+  v5Compat?: boolean;
+};
+
+/**
+ * A memory history stores locations in memory. This is useful in stateful
+ * environments where there is no web browser, such as node tests or React
+ * Native.
+ */
+export interface MemoryHistory extends History {
+  /**
+   * The current index in the history stack.
+   */
+  readonly index: number;
+}
+
+/**
+ * Memory history stores the current location in memory. It is designed for use
+ * in stateful non-browser environments like tests and React Native.
+ */
+export function createMemoryHistory(
+  options: MemoryHistoryOptions = {}
+): MemoryHistory {
+  let { initialEntries = ["/"], initialIndex, v5Compat = false } = options;
+  let entries: Location[]; // Declare so we can access from createMemoryLocation
+  entries = initialEntries.map((entry, index) =>
+    createMemoryLocation(
+      entry,
+      typeof entry === "string" ? null : entry.state,
+      index === 0 ? "default" : undefined
+    )
+  );
+  let index = clampIndex(
+    initialIndex == null ? entries.length - 1 : initialIndex
+  );
+  let action = Action.Pop;
+  let listener: Listener | null = null;
+
+  function clampIndex(n: number): number {
+    return Math.min(Math.max(n, 0), entries.length - 1);
+  }
+  function getCurrentLocation(): Location {
+    return entries[index];
+  }
+  function createMemoryLocation(
+    to: To,
+    state: any = null,
+    key?: string
+  ): Location {
+    let location = createLocation(
+      entries ? getCurrentLocation().pathname : "/",
+      to,
+      state,
+      key
+    );
+    warning(
+      location.pathname.charAt(0) === "/",
+      `relative pathnames are not supported in memory history: ${JSON.stringify(
+        to
+      )}`
+    );
+    return location;
+  }
+
+  function createHref(to: To) {
+    return typeof to === "string" ? to : createPath(to);
+  }
+
+  let history: MemoryHistory = {
+    get index() {
+      return index;
+    },
+    get action() {
+      return action;
+    },
+    get location() {
+      return getCurrentLocation();
+    },
+    createHref,
+    createURL(to) {
+      return new URL(createHref(to), "http://localhost");
+    },
+    encodeLocation(to: To) {
+      let path = typeof to === "string" ? parsePath(to) : to;
+      return {
+        pathname: path.pathname || "",
+        search: path.search || "",
+        hash: path.hash || "",
+      };
+    },
+    push(to, state) {
+      action = Action.Push;
+      let nextLocation = createMemoryLocation(to, state);
+      index += 1;
+      entries.splice(index, entries.length, nextLocation);
+      if (v5Compat && listener) {
+        listener({ action, location: nextLocation, delta: 1 });
+      }
+    },
+    replace(to, state) {
+      action = Action.Replace;
+      let nextLocation = createMemoryLocation(to, state);
+      entries[index] = nextLocation;
+      if (v5Compat && listener) {
+        listener({ action, location: nextLocation, delta: 0 });
+      }
+    },
+    go(delta) {
+      action = Action.Pop;
+      let nextIndex = clampIndex(index + delta);
+      let nextLocation = entries[nextIndex];
+      index = nextIndex;
+      if (listener) {
+        listener({ action, location: nextLocation, delta });
+      }
+    },
+    listen(fn: Listener) {
+      listener = fn;
+      return () => {
+        listener = null;
+      };
+    },
+  };
+
+  return history;
+}
+//#endregion
+
+////////////////////////////////////////////////////////////////////////////////
+//#region Browser History
+////////////////////////////////////////////////////////////////////////////////
+
+/**
+ * A browser history stores the current location in regular URLs in a web
+ * browser environment. This is the standard for most web apps and provides the
+ * cleanest URLs the browser's address bar.
+ *
+ * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#browserhistory
+ */
+export interface BrowserHistory extends UrlHistory {}
+
+export type BrowserHistoryOptions = UrlHistoryOptions;
+
+/**
+ * Browser history stores the location in regular URLs. This is the standard for
+ * most web apps, but it requires some configuration on the server to ensure you
+ * serve the same app at multiple URLs.
+ *
+ * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#createbrowserhistory
+ */
+export function createBrowserHistory(
+  options: BrowserHistoryOptions = {}
+): BrowserHistory {
+  function createBrowserLocation(
+    window: Window,
+    globalHistory: Window["history"]
+  ) {
+    let { pathname, search, hash } = window.location;
+    return createLocation(
+      "",
+      { pathname, search, hash },
+      // state defaults to `null` because `window.history.state` does
+      (globalHistory.state && globalHistory.state.usr) || null,
+      (globalHistory.state && globalHistory.state.key) || "default"
+    );
+  }
+
+  function createBrowserHref(window: Window, to: To) {
+    return typeof to === "string" ? to : createPath(to);
+  }
+
+  return getUrlBasedHistory(
+    createBrowserLocation,
+    createBrowserHref,
+    null,
+    options
+  );
+}
+//#endregion
+
+////////////////////////////////////////////////////////////////////////////////
+//#region Hash History
+////////////////////////////////////////////////////////////////////////////////
+
+/**
+ * A hash history stores the current location in the fragment identifier portion
+ * of the URL in a web browser environment.
+ *
+ * This is ideal for apps that do not control the server for some reason
+ * (because the fragment identifier is never sent to the server), including some
+ * shared hosting environments that do not provide fine-grained controls over
+ * which pages are served at which URLs.
+ *
+ * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#hashhistory
+ */
+export interface HashHistory extends UrlHistory {}
+
+export type HashHistoryOptions = UrlHistoryOptions;
+
+/**
+ * Hash history stores the location in window.location.hash. This makes it ideal
+ * for situations where you don't want to send the location to the server for
+ * some reason, either because you do cannot configure it or the URL space is
+ * reserved for something else.
+ *
+ * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#createhashhistory
+ */
+export function createHashHistory(
+  options: HashHistoryOptions = {}
+): HashHistory {
+  function createHashLocation(
+    window: Window,
+    globalHistory: Window["history"]
+  ) {
+    let {
+      pathname = "/",
+      search = "",
+      hash = "",
+    } = parsePath(window.location.hash.substr(1));
+
+    // Hash URL should always have a leading / just like window.location.pathname
+    // does, so if an app ends up at a route like /#something then we add a
+    // leading slash so all of our path-matching behaves the same as if it would
+    // in a browser router.  This is particularly important when there exists a
+    // root splat route (<Route path="*">) since that matches internally against
+    // "/*" and we'd expect /#something to 404 in a hash router app.
+    if (!pathname.startsWith("/") && !pathname.startsWith(".")) {
+      pathname = "/" + pathname;
+    }
+
+    return createLocation(
+      "",
+      { pathname, search, hash },
+      // state defaults to `null` because `window.history.state` does
+      (globalHistory.state && globalHistory.state.usr) || null,
+      (globalHistory.state && globalHistory.state.key) || "default"
+    );
+  }
+
+  function createHashHref(window: Window, to: To) {
+    let base = window.document.querySelector("base");
+    let href = "";
+
+    if (base && base.getAttribute("href")) {
+      let url = window.location.href;
+      let hashIndex = url.indexOf("#");
+      href = hashIndex === -1 ? url : url.slice(0, hashIndex);
+    }
+
+    return href + "#" + (typeof to === "string" ? to : createPath(to));
+  }
+
+  function validateHashLocation(location: Location, to: To) {
+    warning(
+      location.pathname.charAt(0) === "/",
+      `relative pathnames are not supported in hash history.push(${JSON.stringify(
+        to
+      )})`
+    );
+  }
+
+  return getUrlBasedHistory(
+    createHashLocation,
+    createHashHref,
+    validateHashLocation,
+    options
+  );
+}
+//#endregion
+
+////////////////////////////////////////////////////////////////////////////////
+//#region UTILS
+////////////////////////////////////////////////////////////////////////////////
+
+/**
+ * @private
+ */
+export function invariant(value: boolean, message?: string): asserts value;
+export function invariant<T>(
+  value: T | null | undefined,
+  message?: string
+): asserts value is T;
+export function invariant(value: any, message?: string) {
+  if (value === false || value === null || typeof value === "undefined") {
+    throw new Error(message);
+  }
+}
+
+export function warning(cond: any, message: string) {
+  if (!cond) {
+    // eslint-disable-next-line no-console
+    if (typeof console !== "undefined") console.warn(message);
+
+    try {
+      // Welcome to debugging history!
+      //
+      // This error is thrown as a convenience, so you can more easily
+      // find the source for a warning that appears in the console by
+      // enabling "pause on exceptions" in your JavaScript debugger.
+      throw new Error(message);
+      // eslint-disable-next-line no-empty
+    } catch (e) {}
+  }
+}
+
+function createKey() {
+  return Math.random().toString(36).substr(2, 8);
+}
+
+/**
+ * For browser-based histories, we combine the state and key into an object
+ */
+function getHistoryState(location: Location, index: number): HistoryState {
+  return {
+    usr: location.state,
+    key: location.key,
+    idx: index,
+  };
+}
+
+/**
+ * Creates a Location object with a unique key from the given Path
+ */
+export function createLocation(
+  current: string | Location,
+  to: To,
+  state: any = null,
+  key?: string
+): Readonly<Location> {
+  let location: Readonly<Location> = {
+    pathname: typeof current === "string" ? current : current.pathname,
+    search: "",
+    hash: "",
+    ...(typeof to === "string" ? parsePath(to) : to),
+    state,
+    // TODO: This could be cleaned up.  push/replace should probably just take
+    // full Locations now and avoid the need to run through this flow at all
+    // But that's a pretty big refactor to the current test suite so going to
+    // keep as is for the time being and just let any incoming keys take precedence
+    key: (to && (to as Location).key) || key || createKey(),
+  };
+  return location;
+}
+
+/**
+ * Creates a string URL path from the given pathname, search, and hash components.
+ */
+export function createPath({
+  pathname = "/",
+  search = "",
+  hash = "",
+}: Partial<Path>) {
+  if (search && search !== "?")
+    pathname += search.charAt(0) === "?" ? search : "?" + search;
+  if (hash && hash !== "#")
+    pathname += hash.charAt(0) === "#" ? hash : "#" + hash;
+  return pathname;
+}
+
+/**
+ * Parses a string URL path into its separate pathname, search, and hash components.
+ */
+export function parsePath(path: string): Partial<Path> {
+  let parsedPath: Partial<Path> = {};
+
+  if (path) {
+    let hashIndex = path.indexOf("#");
+    if (hashIndex >= 0) {
+      parsedPath.hash = path.substr(hashIndex);
+      path = path.substr(0, hashIndex);
+    }
+
+    let searchIndex = path.indexOf("?");
+    if (searchIndex >= 0) {
+      parsedPath.search = path.substr(searchIndex);
+      path = path.substr(0, searchIndex);
+    }
+
+    if (path) {
+      parsedPath.pathname = path;
+    }
+  }
+
+  return parsedPath;
+}
+
+export interface UrlHistory extends History {}
+
+export type UrlHistoryOptions = {
+  window?: Window;
+  v5Compat?: boolean;
+};
+
+function getUrlBasedHistory(
+  getLocation: (window: Window, globalHistory: Window["history"]) => Location,
+  createHref: (window: Window, to: To) => string,
+  validateLocation: ((location: Location, to: To) => void) | null,
+  options: UrlHistoryOptions = {}
+): UrlHistory {
+  let { window = document.defaultView!, v5Compat = false } = options;
+  let globalHistory = window.history;
+  let action = Action.Pop;
+  let listener: Listener | null = null;
+
+  let index = getIndex()!;
+  // Index should only be null when we initialize. If not, it's because the
+  // user called history.pushState or history.replaceState directly, in which
+  // case we should log a warning as it will result in bugs.
+  if (index == null) {
+    index = 0;
+    globalHistory.replaceState({ ...globalHistory.state, idx: index }, "");
+  }
+
+  function getIndex(): number {
+    let state = globalHistory.state || { idx: null };
+    return state.idx;
+  }
+
+  function handlePop() {
+    action = Action.Pop;
+    let nextIndex = getIndex();
+    let delta = nextIndex == null ? null : nextIndex - index;
+    index = nextIndex;
+    if (listener) {
+      listener({ action, location: history.location, delta });
+    }
+  }
+
+  function push(to: To, state?: any) {
+    action = Action.Push;
+    let location = createLocation(history.location, to, state);
+    if (validateLocation) validateLocation(location, to);
+
+    index = getIndex() + 1;
+    let historyState = getHistoryState(location, index);
+    let url = history.createHref(location);
+
+    // try...catch because iOS limits us to 100 pushState calls :/
+    try {
+      globalHistory.pushState(historyState, "", url);
+    } catch (error) {
+      // If the exception is because `state` can't be serialized, let that throw
+      // outwards just like a replace call would so the dev knows the cause
+      // https://html.spec.whatwg.org/multipage/nav-history-apis.html#shared-history-push/replace-state-steps
+      // https://html.spec.whatwg.org/multipage/structured-data.html#structuredserializeinternal
+      if (error instanceof DOMException && error.name === "DataCloneError") {
+        throw error;
+      }
+      // They are going to lose state here, but there is no real
+      // way to warn them about it since the page will refresh...
+      window.location.assign(url);
+    }
+
+    if (v5Compat && listener) {
+      listener({ action, location: history.location, delta: 1 });
+    }
+  }
+
+  function replace(to: To, state?: any) {
+    action = Action.Replace;
+    let location = createLocation(history.location, to, state);
+    if (validateLocation) validateLocation(location, to);
+
+    index = getIndex();
+    let historyState = getHistoryState(location, index);
+    let url = history.createHref(location);
+    globalHistory.replaceState(historyState, "", url);
+
+    if (v5Compat && listener) {
+      listener({ action, location: history.location, delta: 0 });
+    }
+  }
+
+  function createURL(to: To): URL {
+    // window.location.origin is "null" (the literal string value) in Firefox
+    // under certain conditions, notably when serving from a local HTML file
+    // See https://bugzilla.mozilla.org/show_bug.cgi?id=878297
+    let base =
+      window.location.origin !== "null"
+        ? window.location.origin
+        : window.location.href;
+
+    let href = typeof to === "string" ? to : createPath(to);
+    // Treating this as a full URL will strip any trailing spaces so we need to
+    // pre-encode them since they might be part of a matching splat param from
+    // an ancestor route
+    href = href.replace(/ $/, "%20");
+    invariant(
+      base,
+      `No window.location.(origin|href) available to create URL for href: ${href}`
+    );
+    return new URL(href, base);
+  }
+
+  let history: History = {
+    get action() {
+      return action;
+    },
+    get location() {
+      return getLocation(window, globalHistory);
+    },
+    listen(fn: Listener) {
+      if (listener) {
+        throw new Error("A history only accepts one active listener");
+      }
+      window.addEventListener(PopStateEventType, handlePop);
+      listener = fn;
+
+      return () => {
+        window.removeEventListener(PopStateEventType, handlePop);
+        listener = null;
+      };
+    },
+    createHref(to) {
+      return createHref(window, to);
+    },
+    createURL,
+    encodeLocation(to) {
+      // Encode a Location the same way window.location would
+      let url = createURL(to);
+      return {
+        pathname: url.pathname,
+        search: url.search,
+        hash: url.hash,
+      };
+    },
+    push,
+    replace,
+    go(n) {
+      return globalHistory.go(n);
+    },
+  };
+
+  return history;
+}
+
+//#endregion
diff --git a/ddb_main/node_modules/@remix-run/router/router.ts b/ddb_main/node_modules/@remix-run/router/router.ts
new file mode 100644
index 0000000..b72cb70
--- /dev/null
+++ b/ddb_main/node_modules/@remix-run/router/router.ts
@@ -0,0 +1,5247 @@
+import type { History, Location, Path, To } from "./history";
+import {
+  Action as HistoryAction,
+  createLocation,
+  createPath,
+  invariant,
+  parsePath,
+  warning,
+} from "./history";
+import type {
+  AgnosticDataRouteMatch,
+  AgnosticDataRouteObject,
+  DataStrategyMatch,
+  AgnosticRouteObject,
+  DataResult,
+  DataStrategyFunction,
+  DataStrategyFunctionArgs,
+  DeferredData,
+  DeferredResult,
+  DetectErrorBoundaryFunction,
+  ErrorResult,
+  FormEncType,
+  FormMethod,
+  HTMLFormMethod,
+  HandlerResult,
+  ImmutableRouteKey,
+  MapRoutePropertiesFunction,
+  MutationFormMethod,
+  RedirectResult,
+  RouteData,
+  RouteManifest,
+  ShouldRevalidateFunctionArgs,
+  Submission,
+  SuccessResult,
+  UIMatch,
+  V7_FormMethod,
+  V7_MutationFormMethod,
+} from "./utils";
+import {
+  ErrorResponseImpl,
+  ResultType,
+  convertRouteMatchToUiMatch,
+  convertRoutesToDataRoutes,
+  getPathContributingMatches,
+  getResolveToMatches,
+  immutableRouteKeys,
+  isRouteErrorResponse,
+  joinPaths,
+  matchRoutes,
+  resolveTo,
+  stripBasename,
+} from "./utils";
+
+////////////////////////////////////////////////////////////////////////////////
+//#region Types and Constants
+////////////////////////////////////////////////////////////////////////////////
+
+/**
+ * A Router instance manages all navigation and data loading/mutations
+ */
+export interface Router {
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Return the basename for the router
+   */
+  get basename(): RouterInit["basename"];
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Return the future config for the router
+   */
+  get future(): FutureConfig;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Return the current state of the router
+   */
+  get state(): RouterState;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Return the routes for this router instance
+   */
+  get routes(): AgnosticDataRouteObject[];
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Return the window associated with the router
+   */
+  get window(): RouterInit["window"];
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Initialize the router, including adding history listeners and kicking off
+   * initial data fetches.  Returns a function to cleanup listeners and abort
+   * any in-progress loads
+   */
+  initialize(): Router;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Subscribe to router.state updates
+   *
+   * @param fn function to call with the new state
+   */
+  subscribe(fn: RouterSubscriber): () => void;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Enable scroll restoration behavior in the router
+   *
+   * @param savedScrollPositions Object that will manage positions, in case
+   *                             it's being restored from sessionStorage
+   * @param getScrollPosition    Function to get the active Y scroll position
+   * @param getKey               Function to get the key to use for restoration
+   */
+  enableScrollRestoration(
+    savedScrollPositions: Record<string, number>,
+    getScrollPosition: GetScrollPositionFunction,
+    getKey?: GetScrollRestorationKeyFunction
+  ): () => void;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Navigate forward/backward in the history stack
+   * @param to Delta to move in the history stack
+   */
+  navigate(to: number): Promise<void>;
+
+  /**
+   * Navigate to the given path
+   * @param to Path to navigate to
+   * @param opts Navigation options (method, submission, etc.)
+   */
+  navigate(to: To | null, opts?: RouterNavigateOptions): Promise<void>;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Trigger a fetcher load/submission
+   *
+   * @param key     Fetcher key
+   * @param routeId Route that owns the fetcher
+   * @param href    href to fetch
+   * @param opts    Fetcher options, (method, submission, etc.)
+   */
+  fetch(
+    key: string,
+    routeId: string,
+    href: string | null,
+    opts?: RouterFetchOptions
+  ): void;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Trigger a revalidation of all current route loaders and fetcher loads
+   */
+  revalidate(): void;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Utility function to create an href for the given location
+   * @param location
+   */
+  createHref(location: Location | URL): string;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Utility function to URL encode a destination path according to the internal
+   * history implementation
+   * @param to
+   */
+  encodeLocation(to: To): Path;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Get/create a fetcher for the given key
+   * @param key
+   */
+  getFetcher<TData = any>(key: string): Fetcher<TData>;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Delete the fetcher for a given key
+   * @param key
+   */
+  deleteFetcher(key: string): void;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Cleanup listeners and abort any in-progress loads
+   */
+  dispose(): void;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Get a navigation blocker
+   * @param key The identifier for the blocker
+   * @param fn The blocker function implementation
+   */
+  getBlocker(key: string, fn: BlockerFunction): Blocker;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Delete a navigation blocker
+   * @param key The identifier for the blocker
+   */
+  deleteBlocker(key: string): void;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * HMR needs to pass in-flight route updates to React Router
+   * TODO: Replace this with granular route update APIs (addRoute, updateRoute, deleteRoute)
+   */
+  _internalSetRoutes(routes: AgnosticRouteObject[]): void;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Internal fetch AbortControllers accessed by unit tests
+   */
+  _internalFetchControllers: Map<string, AbortController>;
+
+  /**
+   * @internal
+   * PRIVATE - DO NOT USE
+   *
+   * Internal pending DeferredData instances accessed by unit tests
+   */
+  _internalActiveDeferreds: Map<string, DeferredData>;
+}
+
+/**
+ * State maintained internally by the router.  During a navigation, all states
+ * reflect the the "old" location unless otherwise noted.
+ */
+export interface RouterState {
+  /**
+   * The action of the most recent navigation
+   */
+  historyAction: HistoryAction;
+
+  /**
+   * The current location reflected by the router
+   */
+  location: Location;
+
+  /**
+   * The current set of route matches
+   */
+  matches: AgnosticDataRouteMatch[];
+
+  /**
+   * Tracks whether we've completed our initial data load
+   */
+  initialized: boolean;
+
+  /**
+   * Current scroll position we should start at for a new view
+   *  - number -> scroll position to restore to
+   *  - false -> do not restore scroll at all (used during submissions)
+   *  - null -> don't have a saved position, scroll to hash or top of page
+   */
+  restoreScrollPosition: number | false | null;
+
+  /**
+   * Indicate whether this navigation should skip resetting the scroll position
+   * if we are unable to restore the scroll position
+   */
+  preventScrollReset: boolean;
+
+  /**
+   * Tracks the state of the current navigation
+   */
+  navigation: Navigation;
+
+  /**
+   * Tracks any in-progress revalidations
+   */
+  revalidation: RevalidationState;
+
+  /**
+   * Data from the loaders for the current matches
+   */
+  loaderData: RouteData;
+
+  /**
+   * Data from the action for the current matches
+   */
+  actionData: RouteData | null;
+
+  /**
+   * Errors caught from loaders for the current matches
+   */
+  errors: RouteData | null;
+
+  /**
+   * Map of current fetchers
+   */
+  fetchers: Map<string, Fetcher>;
+
+  /**
+   * Map of current blockers
+   */
+  blockers: Map<string, Blocker>;
+}
+
+/**
+ * Data that can be passed into hydrate a Router from SSR
+ */
+export type HydrationState = Partial<
+  Pick<RouterState, "loaderData" | "actionData" | "errors">
+>;
+
+/**
+ * Future flags to toggle new feature behavior
+ */
+export interface FutureConfig {
+  v7_fetcherPersist: boolean;
+  v7_normalizeFormMethod: boolean;
+  v7_partialHydration: boolean;
+  v7_prependBasename: boolean;
+  v7_relativeSplatPath: boolean;
+  unstable_skipActionErrorRevalidation: boolean;
+}
+
+/**
+ * Initialization options for createRouter
+ */
+export interface RouterInit {
+  routes: AgnosticRouteObject[];
+  history: History;
+  basename?: string;
+  /**
+   * @deprecated Use `mapRouteProperties` instead
+   */
+  detectErrorBoundary?: DetectErrorBoundaryFunction;
+  mapRouteProperties?: MapRoutePropertiesFunction;
+  future?: Partial<FutureConfig>;
+  hydrationData?: HydrationState;
+  window?: Window;
+  unstable_dataStrategy?: DataStrategyFunction;
+}
+
+/**
+ * State returned from a server-side query() call
+ */
+export interface StaticHandlerContext {
+  basename: Router["basename"];
+  location: RouterState["location"];
+  matches: RouterState["matches"];
+  loaderData: RouterState["loaderData"];
+  actionData: RouterState["actionData"];
+  errors: RouterState["errors"];
+  statusCode: number;
+  loaderHeaders: Record<string, Headers>;
+  actionHeaders: Record<string, Headers>;
+  activeDeferreds: Record<string, DeferredData> | null;
+  _deepestRenderedBoundaryId?: string | null;
+}
+
+/**
+ * A StaticHandler instance manages a singular SSR navigation/fetch event
+ */
+export interface StaticHandler {
+  dataRoutes: AgnosticDataRouteObject[];
+  query(
+    request: Request,
+    opts?: {
+      requestContext?: unknown;
+      skipLoaderErrorBubbling?: boolean;
+      unstable_dataStrategy?: DataStrategyFunction;
+    }
+  ): Promise<StaticHandlerContext | Response>;
+  queryRoute(
+    request: Request,
+    opts?: {
+      routeId?: string;
+      requestContext?: unknown;
+      unstable_dataStrategy?: DataStrategyFunction;
+    }
+  ): Promise<any>;
+}
+
+type ViewTransitionOpts = {
+  currentLocation: Location;
+  nextLocation: Location;
+};
+
+/**
+ * Subscriber function signature for changes to router state
+ */
+export interface RouterSubscriber {
+  (
+    state: RouterState,
+    opts: {
+      deletedFetchers: string[];
+      unstable_viewTransitionOpts?: ViewTransitionOpts;
+      unstable_flushSync: boolean;
+    }
+  ): void;
+}
+
+/**
+ * Function signature for determining the key to be used in scroll restoration
+ * for a given location
+ */
+export interface GetScrollRestorationKeyFunction {
+  (location: Location, matches: UIMatch[]): string | null;
+}
+
+/**
+ * Function signature for determining the current scroll position
+ */
+export interface GetScrollPositionFunction {
+  (): number;
+}
+
+export type RelativeRoutingType = "route" | "path";
+
+// Allowed for any navigation or fetch
+type BaseNavigateOrFetchOptions = {
+  preventScrollReset?: boolean;
+  relative?: RelativeRoutingType;
+  unstable_flushSync?: boolean;
+};
+
+// Only allowed for navigations
+type BaseNavigateOptions = BaseNavigateOrFetchOptions & {
+  replace?: boolean;
+  state?: any;
+  fromRouteId?: string;
+  unstable_viewTransition?: boolean;
+};
+
+// Only allowed for submission navigations
+type BaseSubmissionOptions = {
+  formMethod?: HTMLFormMethod;
+  formEncType?: FormEncType;
+} & (
+  | { formData: FormData; body?: undefined }
+  | { formData?: undefined; body: any }
+);
+
+/**
+ * Options for a navigate() call for a normal (non-submission) navigation
+ */
+type LinkNavigateOptions = BaseNavigateOptions;
+
+/**
+ * Options for a navigate() call for a submission navigation
+ */
+type SubmissionNavigateOptions = BaseNavigateOptions & BaseSubmissionOptions;
+
+/**
+ * Options to pass to navigate() for a navigation
+ */
+export type RouterNavigateOptions =
+  | LinkNavigateOptions
+  | SubmissionNavigateOptions;
+
+/**
+ * Options for a fetch() load
+ */
+type LoadFetchOptions = BaseNavigateOrFetchOptions;
+
+/**
+ * Options for a fetch() submission
+ */
+type SubmitFetchOptions = BaseNavigateOrFetchOptions & BaseSubmissionOptions;
+
+/**
+ * Options to pass to fetch()
+ */
+export type RouterFetchOptions = LoadFetchOptions | SubmitFetchOptions;
+
+/**
+ * Potential states for state.navigation
+ */
+export type NavigationStates = {
+  Idle: {
+    state: "idle";
+    location: undefined;
+    formMethod: undefined;
+    formAction: undefined;
+    formEncType: undefined;
+    formData: undefined;
+    json: undefined;
+    text: undefined;
+  };
+  Loading: {
+    state: "loading";
+    location: Location;
+    formMethod: Submission["formMethod"] | undefined;
+    formAction: Submission["formAction"] | undefined;
+    formEncType: Submission["formEncType"] | undefined;
+    formData: Submission["formData"] | undefined;
+    json: Submission["json"] | undefined;
+    text: Submission["text"] | undefined;
+  };
+  Submitting: {
+    state: "submitting";
+    location: Location;
+    formMethod: Submission["formMethod"];
+    formAction: Submission["formAction"];
+    formEncType: Submission["formEncType"];
+    formData: Submission["formData"];
+    json: Submission["json"];
+    text: Submission["text"];
+  };
+};
+
+export type Navigation = NavigationStates[keyof NavigationStates];
+
+export type RevalidationState = "idle" | "loading";
+
+/**
+ * Potential states for fetchers
+ */
+type FetcherStates<TData = any> = {
+  Idle: {
+    state: "idle";
+    formMethod: undefined;
+    formAction: undefined;
+    formEncType: undefined;
+    text: undefined;
+    formData: undefined;
+    json: undefined;
+    data: TData | undefined;
+  };
+  Loading: {
+    state: "loading";
+    formMethod: Submission["formMethod"] | undefined;
+    formAction: Submission["formAction"] | undefined;
+    formEncType: Submission["formEncType"] | undefined;
+    text: Submission["text"] | undefined;
+    formData: Submission["formData"] | undefined;
+    json: Submission["json"] | undefined;
+    data: TData | undefined;
+  };
+  Submitting: {
+    state: "submitting";
+    formMethod: Submission["formMethod"];
+    formAction: Submission["formAction"];
+    formEncType: Submission["formEncType"];
+    text: Submission["text"];
+    formData: Submission["formData"];
+    json: Submission["json"];
+    data: TData | undefined;
+  };
+};
+
+export type Fetcher<TData = any> =
+  FetcherStates<TData>[keyof FetcherStates<TData>];
+
+interface BlockerBlocked {
+  state: "blocked";
+  reset(): void;
+  proceed(): void;
+  location: Location;
+}
+
+interface BlockerUnblocked {
+  state: "unblocked";
+  reset: undefined;
+  proceed: undefined;
+  location: undefined;
+}
+
+interface BlockerProceeding {
+  state: "proceeding";
+  reset: undefined;
+  proceed: undefined;
+  location: Location;
+}
+
+export type Blocker = BlockerUnblocked | BlockerBlocked | BlockerProceeding;
+
+export type BlockerFunction = (args: {
+  currentLocation: Location;
+  nextLocation: Location;
+  historyAction: HistoryAction;
+}) => boolean;
+
+interface ShortCircuitable {
+  /**
+   * startNavigation does not need to complete the navigation because we
+   * redirected or got interrupted
+   */
+  shortCircuited?: boolean;
+}
+
+type PendingActionResult = [string, SuccessResult | ErrorResult];
+
+interface HandleActionResult extends ShortCircuitable {
+  /**
+   * Tuple for the returned or thrown value from the current action.  The routeId
+   * is the action route for success and the bubbled boundary route for errors.
+   */
+  pendingActionResult?: PendingActionResult;
+}
+
+interface HandleLoadersResult extends ShortCircuitable {
+  /**
+   * loaderData returned from the current set of loaders
+   */
+  loaderData?: RouterState["loaderData"];
+  /**
+   * errors thrown from the current set of loaders
+   */
+  errors?: RouterState["errors"];
+}
+
+/**
+ * Cached info for active fetcher.load() instances so they can participate
+ * in revalidation
+ */
+interface FetchLoadMatch {
+  routeId: string;
+  path: string;
+}
+
+/**
+ * Identified fetcher.load() calls that need to be revalidated
+ */
+interface RevalidatingFetcher extends FetchLoadMatch {
+  key: string;
+  match: AgnosticDataRouteMatch | null;
+  matches: AgnosticDataRouteMatch[] | null;
+  controller: AbortController | null;
+}
+
+const validMutationMethodsArr: MutationFormMethod[] = [
+  "post",
+  "put",
+  "patch",
+  "delete",
+];
+const validMutationMethods = new Set<MutationFormMethod>(
+  validMutationMethodsArr
+);
+
+const validRequestMethodsArr: FormMethod[] = [
+  "get",
+  ...validMutationMethodsArr,
+];
+const validRequestMethods = new Set<FormMethod>(validRequestMethodsArr);
+
+const redirectStatusCodes = new Set([301, 302, 303, 307, 308]);
+const redirectPreserveMethodStatusCodes = new Set([307, 308]);
+
+export const IDLE_NAVIGATION: NavigationStates["Idle"] = {
+  state: "idle",
+  location: undefined,
+  formMethod: undefined,
+  formAction: undefined,
+  formEncType: undefined,
+  formData: undefined,
+  json: undefined,
+  text: undefined,
+};
+
+export const IDLE_FETCHER: FetcherStates["Idle"] = {
+  state: "idle",
+  data: undefined,
+  formMethod: undefined,
+  formAction: undefined,
+  formEncType: undefined,
+  formData: undefined,
+  json: undefined,
+  text: undefined,
+};
+
+export const IDLE_BLOCKER: BlockerUnblocked = {
+  state: "unblocked",
+  proceed: undefined,
+  reset: undefined,
+  location: undefined,
+};
+
+const ABSOLUTE_URL_REGEX = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i;
+
+const defaultMapRouteProperties: MapRoutePropertiesFunction = (route) => ({
+  hasErrorBoundary: Boolean(route.hasErrorBoundary),
+});
+
+const TRANSITIONS_STORAGE_KEY = "remix-router-transitions";
+
+//#endregion
+
+////////////////////////////////////////////////////////////////////////////////
+//#region createRouter
+////////////////////////////////////////////////////////////////////////////////
+
+/**
+ * Create a router and listen to history POP navigations
+ */
+export function createRouter(init: RouterInit): Router {
+  const routerWindow = init.window
+    ? init.window
+    : typeof window !== "undefined"
+    ? window
+    : undefined;
+  const isBrowser =
+    typeof routerWindow !== "undefined" &&
+    typeof routerWindow.document !== "undefined" &&
+    typeof routerWindow.document.createElement !== "undefined";
+  const isServer = !isBrowser;
+
+  invariant(
+    init.routes.length > 0,
+    "You must provide a non-empty routes array to createRouter"
+  );
+
+  let mapRouteProperties: MapRoutePropertiesFunction;
+  if (init.mapRouteProperties) {
+    mapRouteProperties = init.mapRouteProperties;
+  } else if (init.detectErrorBoundary) {
+    // If they are still using the deprecated version, wrap it with the new API
+    let detectErrorBoundary = init.detectErrorBoundary;
+    mapRouteProperties = (route) => ({
+      hasErrorBoundary: detectErrorBoundary(route),
+    });
+  } else {
+    mapRouteProperties = defaultMapRouteProperties;
+  }
+
+  // Routes keyed by ID
+  let manifest: RouteManifest = {};
+  // Routes in tree format for matching
+  let dataRoutes = convertRoutesToDataRoutes(
+    init.routes,
+    mapRouteProperties,
+    undefined,
+    manifest
+  );
+  let inFlightDataRoutes: AgnosticDataRouteObject[] | undefined;
+  let basename = init.basename || "/";
+  let dataStrategyImpl = init.unstable_dataStrategy || defaultDataStrategy;
+  // Config driven behavior flags
+  let future: FutureConfig = {
+    v7_fetcherPersist: false,
+    v7_normalizeFormMethod: false,
+    v7_partialHydration: false,
+    v7_prependBasename: false,
+    v7_relativeSplatPath: false,
+    unstable_skipActionErrorRevalidation: false,
+    ...init.future,
+  };
+  // Cleanup function for history
+  let unlistenHistory: (() => void) | null = null;
+  // Externally-provided functions to call on all state changes
+  let subscribers = new Set<RouterSubscriber>();
+  // Externally-provided object to hold scroll restoration locations during routing
+  let savedScrollPositions: Record<string, number> | null = null;
+  // Externally-provided function to get scroll restoration keys
+  let getScrollRestorationKey: GetScrollRestorationKeyFunction | null = null;
+  // Externally-provided function to get current scroll position
+  let getScrollPosition: GetScrollPositionFunction | null = null;
+  // One-time flag to control the initial hydration scroll restoration.  Because
+  // we don't get the saved positions from <ScrollRestoration /> until _after_
+  // the initial render, we need to manually trigger a separate updateState to
+  // send along the restoreScrollPosition
+  // Set to true if we have `hydrationData` since we assume we were SSR'd and that
+  // SSR did the initial scroll restoration.
+  let initialScrollRestored = init.hydrationData != null;
+
+  let initialMatches = matchRoutes(dataRoutes, init.history.location, basename);
+  let initialErrors: RouteData | null = null;
+
+  if (initialMatches == null) {
+    // If we do not match a user-provided-route, fall back to the root
+    // to allow the error boundary to take over
+    let error = getInternalRouterError(404, {
+      pathname: init.history.location.pathname,
+    });
+    let { matches, route } = getShortCircuitMatches(dataRoutes);
+    initialMatches = matches;
+    initialErrors = { [route.id]: error };
+  }
+
+  let initialized: boolean;
+  let hasLazyRoutes = initialMatches.some((m) => m.route.lazy);
+  let hasLoaders = initialMatches.some((m) => m.route.loader);
+  if (hasLazyRoutes) {
+    // All initialMatches need to be loaded before we're ready.  If we have lazy
+    // functions around still then we'll need to run them in initialize()
+    initialized = false;
+  } else if (!hasLoaders) {
+    // If we've got no loaders to run, then we're good to go
+    initialized = true;
+  } else if (future.v7_partialHydration) {
+    // If partial hydration is enabled, we're initialized so long as we were
+    // provided with hydrationData for every route with a loader, and no loaders
+    // were marked for explicit hydration
+    let loaderData = init.hydrationData ? init.hydrationData.loaderData : null;
+    let errors = init.hydrationData ? init.hydrationData.errors : null;
+    let isRouteInitialized = (m: AgnosticDataRouteMatch) => {
+      // No loader, nothing to initialize
+      if (!m.route.loader) {
+        return true;
+      }
+      // Explicitly opting-in to running on hydration
+      if (
+        typeof m.route.loader === "function" &&
+        m.route.loader.hydrate === true
+      ) {
+        return false;
+      }
+      // Otherwise, initialized if hydrated with data or an error
+      return (
+        (loaderData && loaderData[m.route.id] !== undefined) ||
+        (errors && errors[m.route.id] !== undefined)
+      );
+    };
+
+    // If errors exist, don't consider routes below the boundary
+    if (errors) {
+      let idx = initialMatches.findIndex(
+        (m) => errors![m.route.id] !== undefined
+      );
+      initialized = initialMatches.slice(0, idx + 1).every(isRouteInitialized);
+    } else {
+      initialized = initialMatches.every(isRouteInitialized);
+    }
+  } else {
+    // Without partial hydration - we're initialized if we were provided any
+    // hydrationData - which is expected to be complete
+    initialized = init.hydrationData != null;
+  }
+
+  let router: Router;
+  let state: RouterState = {
+    historyAction: init.history.action,
+    location: init.history.location,
+    matches: initialMatches,
+    initialized,
+    navigation: IDLE_NAVIGATION,
+    // Don't restore on initial updateState() if we were SSR'd
+    restoreScrollPosition: init.hydrationData != null ? false : null,
+    preventScrollReset: false,
+    revalidation: "idle",
+    loaderData: (init.hydrationData && init.hydrationData.loaderData) || {},
+    actionData: (init.hydrationData && init.hydrationData.actionData) || null,
+    errors: (init.hydrationData && init.hydrationData.errors) || initialErrors,
+    fetchers: new Map(),
+    blockers: new Map(),
+  };
+
+  // -- Stateful internal variables to manage navigations --
+  // Current navigation in progress (to be committed in completeNavigation)
+  let pendingAction: HistoryAction = HistoryAction.Pop;
+
+  // Should the current navigation prevent the scroll reset if scroll cannot
+  // be restored?
+  let pendingPreventScrollReset = false;
+
+  // AbortController for the active navigation
+  let pendingNavigationController: AbortController | null;
+
+  // Should the current navigation enable document.startViewTransition?
+  let pendingViewTransitionEnabled = false;
+
+  // Store applied view transitions so we can apply them on POP
+  let appliedViewTransitions: Map<string, Set<string>> = new Map<
+    string,
+    Set<string>
+  >();
+
+  // Cleanup function for persisting applied transitions to sessionStorage
+  let removePageHideEventListener: (() => void) | null = null;
+
+  // We use this to avoid touching history in completeNavigation if a
+  // revalidation is entirely uninterrupted
+  let isUninterruptedRevalidation = false;
+
+  // Use this internal flag to force revalidation of all loaders:
+  //  - submissions (completed or interrupted)
+  //  - useRevalidator()
+  //  - X-Remix-Revalidate (from redirect)
+  let isRevalidationRequired = false;
+
+  // Use this internal array to capture routes that require revalidation due
+  // to a cancelled deferred on action submission
+  let cancelledDeferredRoutes: string[] = [];
+
+  // Use this internal array to capture fetcher loads that were cancelled by an
+  // action navigation and require revalidation
+  let cancelledFetcherLoads: string[] = [];
+
+  // AbortControllers for any in-flight fetchers
+  let fetchControllers = new Map<string, AbortController>();
+
+  // Track loads based on the order in which they started
+  let incrementingLoadId = 0;
+
+  // Track the outstanding pending navigation data load to be compared against
+  // the globally incrementing load when a fetcher load lands after a completed
+  // navigation
+  let pendingNavigationLoadId = -1;
+
+  // Fetchers that triggered data reloads as a result of their actions
+  let fetchReloadIds = new Map<string, number>();
+
+  // Fetchers that triggered redirect navigations
+  let fetchRedirectIds = new Set<string>();
+
+  // Most recent href/match for fetcher.load calls for fetchers
+  let fetchLoadMatches = new Map<string, FetchLoadMatch>();
+
+  // Ref-count mounted fetchers so we know when it's ok to clean them up
+  let activeFetchers = new Map<string, number>();
+
+  // Fetchers that have requested a delete when using v7_fetcherPersist,
+  // they'll be officially removed after they return to idle
+  let deletedFetchers = new Set<string>();
+
+  // Store DeferredData instances for active route matches.  When a
+  // route loader returns defer() we stick one in here.  Then, when a nested
+  // promise resolves we update loaderData.  If a new navigation starts we
+  // cancel active deferreds for eliminated routes.
+  let activeDeferreds = new Map<string, DeferredData>();
+
+  // Store blocker functions in a separate Map outside of router state since
+  // we don't need to update UI state if they change
+  let blockerFunctions = new Map<string, BlockerFunction>();
+
+  // Flag to ignore the next history update, so we can revert the URL change on
+  // a POP navigation that was blocked by the user without touching router state
+  let ignoreNextHistoryUpdate = false;
+
+  // Initialize the router, all side effects should be kicked off from here.
+  // Implemented as a Fluent API for ease of:
+  //   let router = createRouter(init).initialize();
+  function initialize() {
+    // If history informs us of a POP navigation, start the navigation but do not update
+    // state.  We'll update our own state once the navigation completes
+    unlistenHistory = init.history.listen(
+      ({ action: historyAction, location, delta }) => {
+        // Ignore this event if it was just us resetting the URL from a
+        // blocked POP navigation
+        if (ignoreNextHistoryUpdate) {
+          ignoreNextHistoryUpdate = false;
+          return;
+        }
+
+        warning(
+          blockerFunctions.size === 0 || delta != null,
+          "You are trying to use a blocker on a POP navigation to a location " +
+            "that was not created by @remix-run/router. This will fail silently in " +
+            "production. This can happen if you are navigating outside the router " +
+            "via `window.history.pushState`/`window.location.hash` instead of using " +
+            "router navigation APIs.  This can also happen if you are using " +
+            "createHashRouter and the user manually changes the URL."
+        );
+
+        let blockerKey = shouldBlockNavigation({
+          currentLocation: state.location,
+          nextLocation: location,
+          historyAction,
+        });
+
+        if (blockerKey && delta != null) {
+          // Restore the URL to match the current UI, but don't update router state
+          ignoreNextHistoryUpdate = true;
+          init.history.go(delta * -1);
+
+          // Put the blocker into a blocked state
+          updateBlocker(blockerKey, {
+            state: "blocked",
+            location,
+            proceed() {
+              updateBlocker(blockerKey!, {
+                state: "proceeding",
+                proceed: undefined,
+                reset: undefined,
+                location,
+              });
+              // Re-do the same POP navigation we just blocked
+              init.history.go(delta);
+            },
+            reset() {
+              let blockers = new Map(state.blockers);
+              blockers.set(blockerKey!, IDLE_BLOCKER);
+              updateState({ blockers });
+            },
+          });
+          return;
+        }
+
+        return startNavigation(historyAction, location);
+      }
+    );
+
+    if (isBrowser) {
+      // FIXME: This feels gross.  How can we cleanup the lines between
+      // scrollRestoration/appliedTransitions persistance?
+      restoreAppliedTransitions(routerWindow, appliedViewTransitions);
+      let _saveAppliedTransitions = () =>
+        persistAppliedTransitions(routerWindow, appliedViewTransitions);
+      routerWindow.addEventListener("pagehide", _saveAppliedTransitions);
+      removePageHideEventListener = () =>
+        routerWindow.removeEventListener("pagehide", _saveAppliedTransitions);
+    }
+
+    // Kick off initial data load if needed.  Use Pop to avoid modifying history
+    // Note we don't do any handling of lazy here.  For SPA's it'll get handled
+    // in the normal navigation flow.  For SSR it's expected that lazy modules are
+    // resolved prior to router creation since we can't go into a fallbackElement
+    // UI for SSR'd apps
+    if (!state.initialized) {
+      startNavigation(HistoryAction.Pop, state.location, {
+        initialHydration: true,
+      });
+    }
+
+    return router;
+  }
+
+  // Clean up a router and it's side effects
+  function dispose() {
+    if (unlistenHistory) {
+      unlistenHistory();
+    }
+    if (removePageHideEventListener) {
+      removePageHideEventListener();
+    }
+    subscribers.clear();
+    pendingNavigationController && pendingNavigationController.abort();
+    state.fetchers.forEach((_, key) => deleteFetcher(key));
+    state.blockers.forEach((_, key) => deleteBlocker(key));
+  }
+
+  // Subscribe to state updates for the router
+  function subscribe(fn: RouterSubscriber) {
+    subscribers.add(fn);
+    return () => subscribers.delete(fn);
+  }
+
+  // Update our state and notify the calling context of the change
+  function updateState(
+    newState: Partial<RouterState>,
+    opts: {
+      flushSync?: boolean;
+      viewTransitionOpts?: ViewTransitionOpts;
+    } = {}
+  ): void {
+    state = {
+      ...state,
+      ...newState,
+    };
+
+    // Prep fetcher cleanup so we can tell the UI which fetcher data entries
+    // can be removed
+    let completedFetchers: string[] = [];
+    let deletedFetchersKeys: string[] = [];
+
+    if (future.v7_fetcherPersist) {
+      state.fetchers.forEach((fetcher, key) => {
+        if (fetcher.state === "idle") {
+          if (deletedFetchers.has(key)) {
+            // Unmounted from the UI and can be totally removed
+            deletedFetchersKeys.push(key);
+          } else {
+            // Returned to idle but still mounted in the UI, so semi-remains for
+            // revalidations and such
+            completedFetchers.push(key);
+          }
+        }
+      });
+    }
+
+    // Iterate over a local copy so that if flushSync is used and we end up
+    // removing and adding a new subscriber due to the useCallback dependencies,
+    // we don't get ourselves into a loop calling the new subscriber immediately
+    [...subscribers].forEach((subscriber) =>
+      subscriber(state, {
+        deletedFetchers: deletedFetchersKeys,
+        unstable_viewTransitionOpts: opts.viewTransitionOpts,
+        unstable_flushSync: opts.flushSync === true,
+      })
+    );
+
+    // Remove idle fetchers from state since we only care about in-flight fetchers.
+    if (future.v7_fetcherPersist) {
+      completedFetchers.forEach((key) => state.fetchers.delete(key));
+      deletedFetchersKeys.forEach((key) => deleteFetcher(key));
+    }
+  }
+
+  // Complete a navigation returning the state.navigation back to the IDLE_NAVIGATION
+  // and setting state.[historyAction/location/matches] to the new route.
+  // - Location is a required param
+  // - Navigation will always be set to IDLE_NAVIGATION
+  // - Can pass any other state in newState
+  function completeNavigation(
+    location: Location,
+    newState: Partial<Omit<RouterState, "action" | "location" | "navigation">>,
+    { flushSync }: { flushSync?: boolean } = {}
+  ): void {
+    // Deduce if we're in a loading/actionReload state:
+    // - We have committed actionData in the store
+    // - The current navigation was a mutation submission
+    // - We're past the submitting state and into the loading state
+    // - The location being loaded is not the result of a redirect
+    let isActionReload =
+      state.actionData != null &&
+      state.navigation.formMethod != null &&
+      isMutationMethod(state.navigation.formMethod) &&
+      state.navigation.state === "loading" &&
+      location.state?._isRedirect !== true;
+
+    let actionData: RouteData | null;
+    if (newState.actionData) {
+      if (Object.keys(newState.actionData).length > 0) {
+        actionData = newState.actionData;
+      } else {
+        // Empty actionData -> clear prior actionData due to an action error
+        actionData = null;
+      }
+    } else if (isActionReload) {
+      // Keep the current data if we're wrapping up the action reload
+      actionData = state.actionData;
+    } else {
+      // Clear actionData on any other completed navigations
+      actionData = null;
+    }
+
+    // Always preserve any existing loaderData from re-used routes
+    let loaderData = newState.loaderData
+      ? mergeLoaderData(
+          state.loaderData,
+          newState.loaderData,
+          newState.matches || [],
+          newState.errors
+        )
+      : state.loaderData;
+
+    // On a successful navigation we can assume we got through all blockers
+    // so we can start fresh
+    let blockers = state.blockers;
+    if (blockers.size > 0) {
+      blockers = new Map(blockers);
+      blockers.forEach((_, k) => blockers.set(k, IDLE_BLOCKER));
+    }
+
+    // Always respect the user flag.  Otherwise don't reset on mutation
+    // submission navigations unless they redirect
+    let preventScrollReset =
+      pendingPreventScrollReset === true ||
+      (state.navigation.formMethod != null &&
+        isMutationMethod(state.navigation.formMethod) &&
+        location.state?._isRedirect !== true);
+
+    if (inFlightDataRoutes) {
+      dataRoutes = inFlightDataRoutes;
+      inFlightDataRoutes = undefined;
+    }
+
+    if (isUninterruptedRevalidation) {
+      // If this was an uninterrupted revalidation then do not touch history
+    } else if (pendingAction === HistoryAction.Pop) {
+      // Do nothing for POP - URL has already been updated
+    } else if (pendingAction === HistoryAction.Push) {
+      init.history.push(location, location.state);
+    } else if (pendingAction === HistoryAction.Replace) {
+      init.history.replace(location, location.state);
+    }
+
+    let viewTransitionOpts: ViewTransitionOpts | undefined;
+
+    // On POP, enable transitions if they were enabled on the original navigation
+    if (pendingAction === HistoryAction.Pop) {
+      // Forward takes precedence so they behave like the original navigation
+      let priorPaths = appliedViewTransitions.get(state.location.pathname);
+      if (priorPaths && priorPaths.has(location.pathname)) {
+        viewTransitionOpts = {
+          currentLocation: state.location,
+          nextLocation: location,
+        };
+      } else if (appliedViewTransitions.has(location.pathname)) {
+        // If we don't have a previous forward nav, assume we're popping back to
+        // the new location and enable if that location previously enabled
+        viewTransitionOpts = {
+          currentLocation: location,
+          nextLocation: state.location,
+        };
+      }
+    } else if (pendingViewTransitionEnabled) {
+      // Store the applied transition on PUSH/REPLACE
+      let toPaths = appliedViewTransitions.get(state.location.pathname);
+      if (toPaths) {
+        toPaths.add(location.pathname);
+      } else {
+        toPaths = new Set<string>([location.pathname]);
+        appliedViewTransitions.set(state.location.pathname, toPaths);
+      }
+      viewTransitionOpts = {
+        currentLocation: state.location,
+        nextLocation: location,
+      };
+    }
+
+    updateState(
+      {
+        ...newState, // matches, errors, fetchers go through as-is
+        actionData,
+        loaderData,
+        historyAction: pendingAction,
+        location,
+        initialized: true,
+        navigation: IDLE_NAVIGATION,
+        revalidation: "idle",
+        restoreScrollPosition: getSavedScrollPosition(
+          location,
+          newState.matches || state.matches
+        ),
+        preventScrollReset,
+        blockers,
+      },
+      {
+        viewTransitionOpts,
+        flushSync: flushSync === true,
+      }
+    );
+
+    // Reset stateful navigation vars
+    pendingAction = HistoryAction.Pop;
+    pendingPreventScrollReset = false;
+    pendingViewTransitionEnabled = false;
+    isUninterruptedRevalidation = false;
+    isRevalidationRequired = false;
+    cancelledDeferredRoutes = [];
+    cancelledFetcherLoads = [];
+  }
+
+  // Trigger a navigation event, which can either be a numerical POP or a PUSH
+  // replace with an optional submission
+  async function navigate(
+    to: number | To | null,
+    opts?: RouterNavigateOptions
+  ): Promise<void> {
+    if (typeof to === "number") {
+      init.history.go(to);
+      return;
+    }
+
+    let normalizedPath = normalizeTo(
+      state.location,
+      state.matches,
+      basename,
+      future.v7_prependBasename,
+      to,
+      future.v7_relativeSplatPath,
+      opts?.fromRouteId,
+      opts?.relative
+    );
+    let { path, submission, error } = normalizeNavigateOptions(
+      future.v7_normalizeFormMethod,
+      false,
+      normalizedPath,
+      opts
+    );
+
+    let currentLocation = state.location;
+    let nextLocation = createLocation(state.location, path, opts && opts.state);
+
+    // When using navigate as a PUSH/REPLACE we aren't reading an already-encoded
+    // URL from window.location, so we need to encode it here so the behavior
+    // remains the same as POP and non-data-router usages.  new URL() does all
+    // the same encoding we'd get from a history.pushState/window.location read
+    // without having to touch history
+    nextLocation = {
+      ...nextLocation,
+      ...init.history.encodeLocation(nextLocation),
+    };
+
+    let userReplace = opts && opts.replace != null ? opts.replace : undefined;
+
+    let historyAction = HistoryAction.Push;
+
+    if (userReplace === true) {
+      historyAction = HistoryAction.Replace;
+    } else if (userReplace === false) {
+      // no-op
+    } else if (
+      submission != null &&
+      isMutationMethod(submission.formMethod) &&
+      submission.formAction === state.location.pathname + state.location.search
+    ) {
+      // By default on submissions to the current location we REPLACE so that
+      // users don't have to double-click the back button to get to the prior
+      // location.  If the user redirects to a different location from the
+      // action/loader this will be ignored and the redirect will be a PUSH
+      historyAction = HistoryAction.Replace;
+    }
+
+    let preventScrollReset =
+      opts && "preventScrollReset" in opts
+        ? opts.preventScrollReset === true
+        : undefined;
+
+    let flushSync = (opts && opts.unstable_flushSync) === true;
+
+    let blockerKey = shouldBlockNavigation({
+      currentLocation,
+      nextLocation,
+      historyAction,
+    });
+
+    if (blockerKey) {
+      // Put the blocker into a blocked state
+      updateBlocker(blockerKey, {
+        state: "blocked",
+        location: nextLocation,
+        proceed() {
+          updateBlocker(blockerKey!, {
+            state: "proceeding",
+            proceed: undefined,
+            reset: undefined,
+            location: nextLocation,
+          });
+          // Send the same navigation through
+          navigate(to, opts);
+        },
+        reset() {
+          let blockers = new Map(state.blockers);
+          blockers.set(blockerKey!, IDLE_BLOCKER);
+          updateState({ blockers });
+        },
+      });
+      return;
+    }
+
+    return await startNavigation(historyAction, nextLocation, {
+      submission,
+      // Send through the formData serialization error if we have one so we can
+      // render at the right error boundary after we match routes
+      pendingError: error,
+      preventScrollReset,
+      replace: opts && opts.replace,
+      enableViewTransition: opts && opts.unstable_viewTransition,
+      flushSync,
+    });
+  }
+
+  // Revalidate all current loaders.  If a navigation is in progress or if this
+  // is interrupted by a navigation, allow this to "succeed" by calling all
+  // loaders during the next loader round
+  function revalidate() {
+    interruptActiveLoads();
+    updateState({ revalidation: "loading" });
+
+    // If we're currently submitting an action, we don't need to start a new
+    // navigation, we'll just let the follow up loader execution call all loaders
+    if (state.navigation.state === "submitting") {
+      return;
+    }
+
+    // If we're currently in an idle state, start a new navigation for the current
+    // action/location and mark it as uninterrupted, which will skip the history
+    // update in completeNavigation
+    if (state.navigation.state === "idle") {
+      startNavigation(state.historyAction, state.location, {
+        startUninterruptedRevalidation: true,
+      });
+      return;
+    }
+
+    // Otherwise, if we're currently in a loading state, just start a new
+    // navigation to the navigation.location but do not trigger an uninterrupted
+    // revalidation so that history correctly updates once the navigation completes
+    startNavigation(
+      pendingAction || state.historyAction,
+      state.navigation.location,
+      { overrideNavigation: state.navigation }
+    );
+  }
+
+  // Start a navigation to the given action/location.  Can optionally provide a
+  // overrideNavigation which will override the normalLoad in the case of a redirect
+  // navigation
+  async function startNavigation(
+    historyAction: HistoryAction,
+    location: Location,
+    opts?: {
+      initialHydration?: boolean;
+      submission?: Submission;
+      fetcherSubmission?: Submission;
+      overrideNavigation?: Navigation;
+      pendingError?: ErrorResponseImpl;
+      startUninterruptedRevalidation?: boolean;
+      preventScrollReset?: boolean;
+      replace?: boolean;
+      enableViewTransition?: boolean;
+      flushSync?: boolean;
+    }
+  ): Promise<void> {
+    // Abort any in-progress navigations and start a new one. Unset any ongoing
+    // uninterrupted revalidations unless told otherwise, since we want this
+    // new navigation to update history normally
+    pendingNavigationController && pendingNavigationController.abort();
+    pendingNavigationController = null;
+    pendingAction = historyAction;
+    isUninterruptedRevalidation =
+      (opts && opts.startUninterruptedRevalidation) === true;
+
+    // Save the current scroll position every time we start a new navigation,
+    // and track whether we should reset scroll on completion
+    saveScrollPosition(state.location, state.matches);
+    pendingPreventScrollReset = (opts && opts.preventScrollReset) === true;
+
+    pendingViewTransitionEnabled = (opts && opts.enableViewTransition) === true;
+
+    let routesToUse = inFlightDataRoutes || dataRoutes;
+    let loadingNavigation = opts && opts.overrideNavigation;
+    let matches = matchRoutes(routesToUse, location, basename);
+    let flushSync = (opts && opts.flushSync) === true;
+
+    // Short circuit with a 404 on the root error boundary if we match nothing
+    if (!matches) {
+      let error = getInternalRouterError(404, { pathname: location.pathname });
+      let { matches: notFoundMatches, route } =
+        getShortCircuitMatches(routesToUse);
+      // Cancel all pending deferred on 404s since we don't keep any routes
+      cancelActiveDeferreds();
+      completeNavigation(
+        location,
+        {
+          matches: notFoundMatches,
+          loaderData: {},
+          errors: {
+            [route.id]: error,
+          },
+        },
+        { flushSync }
+      );
+      return;
+    }
+
+    // Short circuit if it's only a hash change and not a revalidation or
+    // mutation submission.
+    //
+    // Ignore on initial page loads because since the initial load will always
+    // be "same hash".  For example, on /page#hash and submit a <Form method="post">
+    // which will default to a navigation to /page
+    if (
+      state.initialized &&
+      !isRevalidationRequired &&
+      isHashChangeOnly(state.location, location) &&
+      !(opts && opts.submission && isMutationMethod(opts.submission.formMethod))
+    ) {
+      completeNavigation(location, { matches }, { flushSync });
+      return;
+    }
+
+    // Create a controller/Request for this navigation
+    pendingNavigationController = new AbortController();
+    let request = createClientSideRequest(
+      init.history,
+      location,
+      pendingNavigationController.signal,
+      opts && opts.submission
+    );
+    let pendingActionResult: PendingActionResult | undefined;
+
+    if (opts && opts.pendingError) {
+      // If we have a pendingError, it means the user attempted a GET submission
+      // with binary FormData so assign here and skip to handleLoaders.  That
+      // way we handle calling loaders above the boundary etc.  It's not really
+      // different from an actionError in that sense.
+      pendingActionResult = [
+        findNearestBoundary(matches).route.id,
+        { type: ResultType.error, error: opts.pendingError },
+      ];
+    } else if (
+      opts &&
+      opts.submission &&
+      isMutationMethod(opts.submission.formMethod)
+    ) {
+      // Call action if we received an action submission
+      let actionResult = await handleAction(
+        request,
+        location,
+        opts.submission,
+        matches,
+        { replace: opts.replace, flushSync }
+      );
+
+      if (actionResult.shortCircuited) {
+        return;
+      }
+
+      pendingActionResult = actionResult.pendingActionResult;
+      loadingNavigation = getLoadingNavigation(location, opts.submission);
+      flushSync = false;
+
+      // Create a GET request for the loaders
+      request = createClientSideRequest(
+        init.history,
+        request.url,
+        request.signal
+      );
+    }
+
+    // Call loaders
+    let { shortCircuited, loaderData, errors } = await handleLoaders(
+      request,
+      location,
+      matches,
+      loadingNavigation,
+      opts && opts.submission,
+      opts && opts.fetcherSubmission,
+      opts && opts.replace,
+      opts && opts.initialHydration === true,
+      flushSync,
+      pendingActionResult
+    );
+
+    if (shortCircuited) {
+      return;
+    }
+
+    // Clean up now that the action/loaders have completed.  Don't clean up if
+    // we short circuited because pendingNavigationController will have already
+    // been assigned to a new controller for the next navigation
+    pendingNavigationController = null;
+
+    completeNavigation(location, {
+      matches,
+      ...getActionDataForCommit(pendingActionResult),
+      loaderData,
+      errors,
+    });
+  }
+
+  // Call the action matched by the leaf route for this navigation and handle
+  // redirects/errors
+  async function handleAction(
+    request: Request,
+    location: Location,
+    submission: Submission,
+    matches: AgnosticDataRouteMatch[],
+    opts: { replace?: boolean; flushSync?: boolean } = {}
+  ): Promise<HandleActionResult> {
+    interruptActiveLoads();
+
+    // Put us in a submitting state
+    let navigation = getSubmittingNavigation(location, submission);
+    updateState({ navigation }, { flushSync: opts.flushSync === true });
+
+    // Call our action and get the result
+    let result: DataResult;
+    let actionMatch = getTargetMatch(matches, location);
+
+    if (!actionMatch.route.action && !actionMatch.route.lazy) {
+      result = {
+        type: ResultType.error,
+        error: getInternalRouterError(405, {
+          method: request.method,
+          pathname: location.pathname,
+          routeId: actionMatch.route.id,
+        }),
+      };
+    } else {
+      let results = await callDataStrategy(
+        "action",
+        request,
+        [actionMatch],
+        matches
+      );
+      result = results[0];
+
+      if (request.signal.aborted) {
+        return { shortCircuited: true };
+      }
+    }
+
+    if (isRedirectResult(result)) {
+      let replace: boolean;
+      if (opts && opts.replace != null) {
+        replace = opts.replace;
+      } else {
+        // If the user didn't explicity indicate replace behavior, replace if
+        // we redirected to the exact same location we're currently at to avoid
+        // double back-buttons
+        let location = normalizeRedirectLocation(
+          result.response.headers.get("Location")!,
+          new URL(request.url),
+          basename
+        );
+        replace = location === state.location.pathname + state.location.search;
+      }
+      await startRedirectNavigation(request, result, {
+        submission,
+        replace,
+      });
+      return { shortCircuited: true };
+    }
+
+    if (isDeferredResult(result)) {
+      throw getInternalRouterError(400, { type: "defer-action" });
+    }
+
+    if (isErrorResult(result)) {
+      // Store off the pending error - we use it to determine which loaders
+      // to call and will commit it when we complete the navigation
+      let boundaryMatch = findNearestBoundary(matches, actionMatch.route.id);
+
+      // By default, all submissions are REPLACE navigations, but if the
+      // action threw an error that'll be rendered in an errorElement, we fall
+      // back to PUSH so that the user can use the back button to get back to
+      // the pre-submission form location to try again
+      if ((opts && opts.replace) !== true) {
+        pendingAction = HistoryAction.Push;
+      }
+
+      return {
+        pendingActionResult: [boundaryMatch.route.id, result],
+      };
+    }
+
+    return {
+      pendingActionResult: [actionMatch.route.id, result],
+    };
+  }
+
+  // Call all applicable loaders for the given matches, handling redirects,
+  // errors, etc.
+  async function handleLoaders(
+    request: Request,
+    location: Location,
+    matches: AgnosticDataRouteMatch[],
+    overrideNavigation?: Navigation,
+    submission?: Submission,
+    fetcherSubmission?: Submission,
+    replace?: boolean,
+    initialHydration?: boolean,
+    flushSync?: boolean,
+    pendingActionResult?: PendingActionResult
+  ): Promise<HandleLoadersResult> {
+    // Figure out the right navigation we want to use for data loading
+    let loadingNavigation =
+      overrideNavigation || getLoadingNavigation(location, submission);
+
+    // If this was a redirect from an action we don't have a "submission" but
+    // we have it on the loading navigation so use that if available
+    let activeSubmission =
+      submission ||
+      fetcherSubmission ||
+      getSubmissionFromNavigation(loadingNavigation);
+
+    let routesToUse = inFlightDataRoutes || dataRoutes;
+    let [matchesToLoad, revalidatingFetchers] = getMatchesToLoad(
+      init.history,
+      state,
+      matches,
+      activeSubmission,
+      location,
+      future.v7_partialHydration && initialHydration === true,
+      future.unstable_skipActionErrorRevalidation,
+      isRevalidationRequired,
+      cancelledDeferredRoutes,
+      cancelledFetcherLoads,
+      deletedFetchers,
+      fetchLoadMatches,
+      fetchRedirectIds,
+      routesToUse,
+      basename,
+      pendingActionResult
+    );
+
+    // Cancel pending deferreds for no-longer-matched routes or routes we're
+    // about to reload.  Note that if this is an action reload we would have
+    // already cancelled all pending deferreds so this would be a no-op
+    cancelActiveDeferreds(
+      (routeId) =>
+        !(matches && matches.some((m) => m.route.id === routeId)) ||
+        (matchesToLoad && matchesToLoad.some((m) => m.route.id === routeId))
+    );
+
+    pendingNavigationLoadId = ++incrementingLoadId;
+
+    // Short circuit if we have no loaders to run
+    if (matchesToLoad.length === 0 && revalidatingFetchers.length === 0) {
+      let updatedFetchers = markFetchRedirectsDone();
+      completeNavigation(
+        location,
+        {
+          matches,
+          loaderData: {},
+          // Commit pending error if we're short circuiting
+          errors:
+            pendingActionResult && isErrorResult(pendingActionResult[1])
+              ? { [pendingActionResult[0]]: pendingActionResult[1].error }
+              : null,
+          ...getActionDataForCommit(pendingActionResult),
+          ...(updatedFetchers ? { fetchers: new Map(state.fetchers) } : {}),
+        },
+        { flushSync }
+      );
+      return { shortCircuited: true };
+    }
+
+    // If this is an uninterrupted revalidation, we remain in our current idle
+    // state.  If not, we need to switch to our loading state and load data,
+    // preserving any new action data or existing action data (in the case of
+    // a revalidation interrupting an actionReload)
+    // If we have partialHydration enabled, then don't update the state for the
+    // initial data load since it's not a "navigation"
+    if (
+      !isUninterruptedRevalidation &&
+      (!future.v7_partialHydration || !initialHydration)
+    ) {
+      revalidatingFetchers.forEach((rf) => {
+        let fetcher = state.fetchers.get(rf.key);
+        let revalidatingFetcher = getLoadingFetcher(
+          undefined,
+          fetcher ? fetcher.data : undefined
+        );
+        state.fetchers.set(rf.key, revalidatingFetcher);
+      });
+
+      let actionData: Record<string, RouteData> | null | undefined;
+      if (pendingActionResult && !isErrorResult(pendingActionResult[1])) {
+        // This is cast to `any` currently because `RouteData`uses any and it
+        // would be a breaking change to use any.
+        // TODO: v7 - change `RouteData` to use `unknown` instead of `any`
+        actionData = {
+          [pendingActionResult[0]]: pendingActionResult[1].data as any,
+        };
+      } else if (state.actionData) {
+        if (Object.keys(state.actionData).length === 0) {
+          actionData = null;
+        } else {
+          actionData = state.actionData;
+        }
+      }
+
+      updateState(
+        {
+          navigation: loadingNavigation,
+          ...(actionData !== undefined ? { actionData } : {}),
+          ...(revalidatingFetchers.length > 0
+            ? { fetchers: new Map(state.fetchers) }
+            : {}),
+        },
+        {
+          flushSync,
+        }
+      );
+    }
+
+    revalidatingFetchers.forEach((rf) => {
+      if (fetchControllers.has(rf.key)) {
+        abortFetcher(rf.key);
+      }
+      if (rf.controller) {
+        // Fetchers use an independent AbortController so that aborting a fetcher
+        // (via deleteFetcher) does not abort the triggering navigation that
+        // triggered the revalidation
+        fetchControllers.set(rf.key, rf.controller);
+      }
+    });
+
+    // Proxy navigation abort through to revalidation fetchers
+    let abortPendingFetchRevalidations = () =>
+      revalidatingFetchers.forEach((f) => abortFetcher(f.key));
+    if (pendingNavigationController) {
+      pendingNavigationController.signal.addEventListener(
+        "abort",
+        abortPendingFetchRevalidations
+      );
+    }
+
+    let { loaderResults, fetcherResults } =
+      await callLoadersAndMaybeResolveData(
+        state.matches,
+        matches,
+        matchesToLoad,
+        revalidatingFetchers,
+        request
+      );
+
+    if (request.signal.aborted) {
+      return { shortCircuited: true };
+    }
+
+    // Clean up _after_ loaders have completed.  Don't clean up if we short
+    // circuited because fetchControllers would have been aborted and
+    // reassigned to new controllers for the next navigation
+    if (pendingNavigationController) {
+      pendingNavigationController.signal.removeEventListener(
+        "abort",
+        abortPendingFetchRevalidations
+      );
+    }
+    revalidatingFetchers.forEach((rf) => fetchControllers.delete(rf.key));
+
+    // If any loaders returned a redirect Response, start a new REPLACE navigation
+    let redirect = findRedirect([...loaderResults, ...fetcherResults]);
+    if (redirect) {
+      if (redirect.idx >= matchesToLoad.length) {
+        // If this redirect came from a fetcher make sure we mark it in
+        // fetchRedirectIds so it doesn't get revalidated on the next set of
+        // loader executions
+        let fetcherKey =
+          revalidatingFetchers[redirect.idx - matchesToLoad.length].key;
+        fetchRedirectIds.add(fetcherKey);
+      }
+      await startRedirectNavigation(request, redirect.result, {
+        replace,
+      });
+      return { shortCircuited: true };
+    }
+
+    // Process and commit output from loaders
+    let { loaderData, errors } = processLoaderData(
+      state,
+      matches,
+      matchesToLoad,
+      loaderResults,
+      pendingActionResult,
+      revalidatingFetchers,
+      fetcherResults,
+      activeDeferreds
+    );
+
+    // Wire up subscribers to update loaderData as promises settle
+    activeDeferreds.forEach((deferredData, routeId) => {
+      deferredData.subscribe((aborted) => {
+        // Note: No need to updateState here since the TrackedPromise on
+        // loaderData is stable across resolve/reject
+        // Remove this instance if we were aborted or if promises have settled
+        if (aborted || deferredData.done) {
+          activeDeferreds.delete(routeId);
+        }
+      });
+    });
+
+    // During partial hydration, preserve SSR errors for routes that don't re-run
+    if (future.v7_partialHydration && initialHydration && state.errors) {
+      Object.entries(state.errors)
+        .filter(([id]) => !matchesToLoad.some((m) => m.route.id === id))
+        .forEach(([routeId, error]) => {
+          errors = Object.assign(errors || {}, { [routeId]: error });
+        });
+    }
+
+    let updatedFetchers = markFetchRedirectsDone();
+    let didAbortFetchLoads = abortStaleFetchLoads(pendingNavigationLoadId);
+    let shouldUpdateFetchers =
+      updatedFetchers || didAbortFetchLoads || revalidatingFetchers.length > 0;
+
+    return {
+      loaderData,
+      errors,
+      ...(shouldUpdateFetchers ? { fetchers: new Map(state.fetchers) } : {}),
+    };
+  }
+
+  // Trigger a fetcher load/submit for the given fetcher key
+  function fetch(
+    key: string,
+    routeId: string,
+    href: string | null,
+    opts?: RouterFetchOptions
+  ) {
+    if (isServer) {
+      throw new Error(
+        "router.fetch() was called during the server render, but it shouldn't be. " +
+          "You are likely calling a useFetcher() method in the body of your component. " +
+          "Try moving it to a useEffect or a callback."
+      );
+    }
+
+    if (fetchControllers.has(key)) abortFetcher(key);
+    let flushSync = (opts && opts.unstable_flushSync) === true;
+
+    let routesToUse = inFlightDataRoutes || dataRoutes;
+    let normalizedPath = normalizeTo(
+      state.location,
+      state.matches,
+      basename,
+      future.v7_prependBasename,
+      href,
+      future.v7_relativeSplatPath,
+      routeId,
+      opts?.relative
+    );
+    let matches = matchRoutes(routesToUse, normalizedPath, basename);
+
+    if (!matches) {
+      setFetcherError(
+        key,
+        routeId,
+        getInternalRouterError(404, { pathname: normalizedPath }),
+        { flushSync }
+      );
+      return;
+    }
+
+    let { path, submission, error } = normalizeNavigateOptions(
+      future.v7_normalizeFormMethod,
+      true,
+      normalizedPath,
+      opts
+    );
+
+    if (error) {
+      setFetcherError(key, routeId, error, { flushSync });
+      return;
+    }
+
+    let match = getTargetMatch(matches, path);
+
+    pendingPreventScrollReset = (opts && opts.preventScrollReset) === true;
+
+    if (submission && isMutationMethod(submission.formMethod)) {
+      handleFetcherAction(
+        key,
+        routeId,
+        path,
+        match,
+        matches,
+        flushSync,
+        submission
+      );
+      return;
+    }
+
+    // Store off the match so we can call it's shouldRevalidate on subsequent
+    // revalidations
+    fetchLoadMatches.set(key, { routeId, path });
+    handleFetcherLoader(
+      key,
+      routeId,
+      path,
+      match,
+      matches,
+      flushSync,
+      submission
+    );
+  }
+
+  // Call the action for the matched fetcher.submit(), and then handle redirects,
+  // errors, and revalidation
+  async function handleFetcherAction(
+    key: string,
+    routeId: string,
+    path: string,
+    match: AgnosticDataRouteMatch,
+    requestMatches: AgnosticDataRouteMatch[],
+    flushSync: boolean,
+    submission: Submission
+  ) {
+    interruptActiveLoads();
+    fetchLoadMatches.delete(key);
+
+    if (!match.route.action && !match.route.lazy) {
+      let error = getInternalRouterError(405, {
+        method: submission.formMethod,
+        pathname: path,
+        routeId: routeId,
+      });
+      setFetcherError(key, routeId, error, { flushSync });
+      return;
+    }
+
+    // Put this fetcher into it's submitting state
+    let existingFetcher = state.fetchers.get(key);
+    updateFetcherState(key, getSubmittingFetcher(submission, existingFetcher), {
+      flushSync,
+    });
+
+    // Call the action for the fetcher
+    let abortController = new AbortController();
+    let fetchRequest = createClientSideRequest(
+      init.history,
+      path,
+      abortController.signal,
+      submission
+    );
+    fetchControllers.set(key, abortController);
+
+    let originatingLoadId = incrementingLoadId;
+    let actionResults = await callDataStrategy(
+      "action",
+      fetchRequest,
+      [match],
+      requestMatches
+    );
+    let actionResult = actionResults[0];
+
+    if (fetchRequest.signal.aborted) {
+      // We can delete this so long as we weren't aborted by our own fetcher
+      // re-submit which would have put _new_ controller is in fetchControllers
+      if (fetchControllers.get(key) === abortController) {
+        fetchControllers.delete(key);
+      }
+      return;
+    }
+
+    // When using v7_fetcherPersist, we don't want errors bubbling up to the UI
+    // or redirects processed for unmounted fetchers so we just revert them to
+    // idle
+    if (future.v7_fetcherPersist && deletedFetchers.has(key)) {
+      if (isRedirectResult(actionResult) || isErrorResult(actionResult)) {
+        updateFetcherState(key, getDoneFetcher(undefined));
+        return;
+      }
+      // Let SuccessResult's fall through for revalidation
+    } else {
+      if (isRedirectResult(actionResult)) {
+        fetchControllers.delete(key);
+        if (pendingNavigationLoadId > originatingLoadId) {
+          // A new navigation was kicked off after our action started, so that
+          // should take precedence over this redirect navigation.  We already
+          // set isRevalidationRequired so all loaders for the new route should
+          // fire unless opted out via shouldRevalidate
+          updateFetcherState(key, getDoneFetcher(undefined));
+          return;
+        } else {
+          fetchRedirectIds.add(key);
+          updateFetcherState(key, getLoadingFetcher(submission));
+          return startRedirectNavigation(fetchRequest, actionResult, {
+            fetcherSubmission: submission,
+          });
+        }
+      }
+
+      // Process any non-redirect errors thrown
+      if (isErrorResult(actionResult)) {
+        setFetcherError(key, routeId, actionResult.error);
+        return;
+      }
+    }
+
+    if (isDeferredResult(actionResult)) {
+      throw getInternalRouterError(400, { type: "defer-action" });
+    }
+
+    // Start the data load for current matches, or the next location if we're
+    // in the middle of a navigation
+    let nextLocation = state.navigation.location || state.location;
+    let revalidationRequest = createClientSideRequest(
+      init.history,
+      nextLocation,
+      abortController.signal
+    );
+    let routesToUse = inFlightDataRoutes || dataRoutes;
+    let matches =
+      state.navigation.state !== "idle"
+        ? matchRoutes(routesToUse, state.navigation.location, basename)
+        : state.matches;
+
+    invariant(matches, "Didn't find any matches after fetcher action");
+
+    let loadId = ++incrementingLoadId;
+    fetchReloadIds.set(key, loadId);
+
+    let loadFetcher = getLoadingFetcher(submission, actionResult.data);
+    state.fetchers.set(key, loadFetcher);
+
+    let [matchesToLoad, revalidatingFetchers] = getMatchesToLoad(
+      init.history,
+      state,
+      matches,
+      submission,
+      nextLocation,
+      false,
+      future.unstable_skipActionErrorRevalidation,
+      isRevalidationRequired,
+      cancelledDeferredRoutes,
+      cancelledFetcherLoads,
+      deletedFetchers,
+      fetchLoadMatches,
+      fetchRedirectIds,
+      routesToUse,
+      basename,
+      [match.route.id, actionResult]
+    );
+
+    // Put all revalidating fetchers into the loading state, except for the
+    // current fetcher which we want to keep in it's current loading state which
+    // contains it's action submission info + action data
+    revalidatingFetchers
+      .filter((rf) => rf.key !== key)
+      .forEach((rf) => {
+        let staleKey = rf.key;
+        let existingFetcher = state.fetchers.get(staleKey);
+        let revalidatingFetcher = getLoadingFetcher(
+          undefined,
+          existingFetcher ? existingFetcher.data : undefined
+        );
+        state.fetchers.set(staleKey, revalidatingFetcher);
+        if (fetchControllers.has(staleKey)) {
+          abortFetcher(staleKey);
+        }
+        if (rf.controller) {
+          fetchControllers.set(staleKey, rf.controller);
+        }
+      });
+
+    updateState({ fetchers: new Map(state.fetchers) });
+
+    let abortPendingFetchRevalidations = () =>
+      revalidatingFetchers.forEach((rf) => abortFetcher(rf.key));
+
+    abortController.signal.addEventListener(
+      "abort",
+      abortPendingFetchRevalidations
+    );
+
+    let { loaderResults, fetcherResults } =
+      await callLoadersAndMaybeResolveData(
+        state.matches,
+        matches,
+        matchesToLoad,
+        revalidatingFetchers,
+        revalidationRequest
+      );
+
+    if (abortController.signal.aborted) {
+      return;
+    }
+
+    abortController.signal.removeEventListener(
+      "abort",
+      abortPendingFetchRevalidations
+    );
+
+    fetchReloadIds.delete(key);
+    fetchControllers.delete(key);
+    revalidatingFetchers.forEach((r) => fetchControllers.delete(r.key));
+
+    let redirect = findRedirect([...loaderResults, ...fetcherResults]);
+    if (redirect) {
+      if (redirect.idx >= matchesToLoad.length) {
+        // If this redirect came from a fetcher make sure we mark it in
+        // fetchRedirectIds so it doesn't get revalidated on the next set of
+        // loader executions
+        let fetcherKey =
+          revalidatingFetchers[redirect.idx - matchesToLoad.length].key;
+        fetchRedirectIds.add(fetcherKey);
+      }
+      return startRedirectNavigation(revalidationRequest, redirect.result);
+    }
+
+    // Process and commit output from loaders
+    let { loaderData, errors } = processLoaderData(
+      state,
+      state.matches,
+      matchesToLoad,
+      loaderResults,
+      undefined,
+      revalidatingFetchers,
+      fetcherResults,
+      activeDeferreds
+    );
+
+    // Since we let revalidations complete even if the submitting fetcher was
+    // deleted, only put it back to idle if it hasn't been deleted
+    if (state.fetchers.has(key)) {
+      let doneFetcher = getDoneFetcher(actionResult.data);
+      state.fetchers.set(key, doneFetcher);
+    }
+
+    abortStaleFetchLoads(loadId);
+
+    // If we are currently in a navigation loading state and this fetcher is
+    // more recent than the navigation, we want the newer data so abort the
+    // navigation and complete it with the fetcher data
+    if (
+      state.navigation.state === "loading" &&
+      loadId > pendingNavigationLoadId
+    ) {
+      invariant(pendingAction, "Expected pending action");
+      pendingNavigationController && pendingNavigationController.abort();
+
+      completeNavigation(state.navigation.location, {
+        matches,
+        loaderData,
+        errors,
+        fetchers: new Map(state.fetchers),
+      });
+    } else {
+      // otherwise just update with the fetcher data, preserving any existing
+      // loaderData for loaders that did not need to reload.  We have to
+      // manually merge here since we aren't going through completeNavigation
+      updateState({
+        errors,
+        loaderData: mergeLoaderData(
+          state.loaderData,
+          loaderData,
+          matches,
+          errors
+        ),
+        fetchers: new Map(state.fetchers),
+      });
+      isRevalidationRequired = false;
+    }
+  }
+
+  // Call the matched loader for fetcher.load(), handling redirects, errors, etc.
+  async function handleFetcherLoader(
+    key: string,
+    routeId: string,
+    path: string,
+    match: AgnosticDataRouteMatch,
+    matches: AgnosticDataRouteMatch[],
+    flushSync: boolean,
+    submission?: Submission
+  ) {
+    let existingFetcher = state.fetchers.get(key);
+    updateFetcherState(
+      key,
+      getLoadingFetcher(
+        submission,
+        existingFetcher ? existingFetcher.data : undefined
+      ),
+      { flushSync }
+    );
+
+    // Call the loader for this fetcher route match
+    let abortController = new AbortController();
+    let fetchRequest = createClientSideRequest(
+      init.history,
+      path,
+      abortController.signal
+    );
+    fetchControllers.set(key, abortController);
+
+    let originatingLoadId = incrementingLoadId;
+    let results = await callDataStrategy(
+      "loader",
+      fetchRequest,
+      [match],
+      matches
+    );
+    let result = results[0];
+
+    // Deferred isn't supported for fetcher loads, await everything and treat it
+    // as a normal load.  resolveDeferredData will return undefined if this
+    // fetcher gets aborted, so we just leave result untouched and short circuit
+    // below if that happens
+    if (isDeferredResult(result)) {
+      result =
+        (await resolveDeferredData(result, fetchRequest.signal, true)) ||
+        result;
+    }
+
+    // We can delete this so long as we weren't aborted by our our own fetcher
+    // re-load which would have put _new_ controller is in fetchControllers
+    if (fetchControllers.get(key) === abortController) {
+      fetchControllers.delete(key);
+    }
+
+    if (fetchRequest.signal.aborted) {
+      return;
+    }
+
+    // We don't want errors bubbling up or redirects followed for unmounted
+    // fetchers, so short circuit here if it was removed from the UI
+    if (deletedFetchers.has(key)) {
+      updateFetcherState(key, getDoneFetcher(undefined));
+      return;
+    }
+
+    // If the loader threw a redirect Response, start a new REPLACE navigation
+    if (isRedirectResult(result)) {
+      if (pendingNavigationLoadId > originatingLoadId) {
+        // A new navigation was kicked off after our loader started, so that
+        // should take precedence over this redirect navigation
+        updateFetcherState(key, getDoneFetcher(undefined));
+        return;
+      } else {
+        fetchRedirectIds.add(key);
+        await startRedirectNavigation(fetchRequest, result);
+        return;
+      }
+    }
+
+    // Process any non-redirect errors thrown
+    if (isErrorResult(result)) {
+      setFetcherError(key, routeId, result.error);
+      return;
+    }
+
+    invariant(!isDeferredResult(result), "Unhandled fetcher deferred data");
+
+    // Put the fetcher back into an idle state
+    updateFetcherState(key, getDoneFetcher(result.data));
+  }
+
+  /**
+   * Utility function to handle redirects returned from an action or loader.
+   * Normally, a redirect "replaces" the navigation that triggered it.  So, for
+   * example:
+   *
+   *  - user is on /a
+   *  - user clicks a link to /b
+   *  - loader for /b redirects to /c
+   *
+   * In a non-JS app the browser would track the in-flight navigation to /b and
+   * then replace it with /c when it encountered the redirect response.  In
+   * the end it would only ever update the URL bar with /c.
+   *
+   * In client-side routing using pushState/replaceState, we aim to emulate
+   * this behavior and we also do not update history until the end of the
+   * navigation (including processed redirects).  This means that we never
+   * actually touch history until we've processed redirects, so we just use
+   * the history action from the original navigation (PUSH or REPLACE).
+   */
+  async function startRedirectNavigation(
+    request: Request,
+    redirect: RedirectResult,
+    {
+      submission,
+      fetcherSubmission,
+      replace,
+    }: {
+      submission?: Submission;
+      fetcherSubmission?: Submission;
+      replace?: boolean;
+    } = {}
+  ) {
+    if (redirect.response.headers.has("X-Remix-Revalidate")) {
+      isRevalidationRequired = true;
+    }
+
+    let location = redirect.response.headers.get("Location");
+    invariant(location, "Expected a Location header on the redirect Response");
+    location = normalizeRedirectLocation(
+      location,
+      new URL(request.url),
+      basename
+    );
+    let redirectLocation = createLocation(state.location, location, {
+      _isRedirect: true,
+    });
+
+    if (isBrowser) {
+      let isDocumentReload = false;
+
+      if (redirect.response.headers.has("X-Remix-Reload-Document")) {
+        // Hard reload if the response contained X-Remix-Reload-Document
+        isDocumentReload = true;
+      } else if (ABSOLUTE_URL_REGEX.test(location)) {
+        const url = init.history.createURL(location);
+        isDocumentReload =
+          // Hard reload if it's an absolute URL to a new origin
+          url.origin !== routerWindow.location.origin ||
+          // Hard reload if it's an absolute URL that does not match our basename
+          stripBasename(url.pathname, basename) == null;
+      }
+
+      if (isDocumentReload) {
+        if (replace) {
+          routerWindow.location.replace(location);
+        } else {
+          routerWindow.location.assign(location);
+        }
+        return;
+      }
+    }
+
+    // There's no need to abort on redirects, since we don't detect the
+    // redirect until the action/loaders have settled
+    pendingNavigationController = null;
+
+    let redirectHistoryAction =
+      replace === true ? HistoryAction.Replace : HistoryAction.Push;
+
+    // Use the incoming submission if provided, fallback on the active one in
+    // state.navigation
+    let { formMethod, formAction, formEncType } = state.navigation;
+    if (
+      !submission &&
+      !fetcherSubmission &&
+      formMethod &&
+      formAction &&
+      formEncType
+    ) {
+      submission = getSubmissionFromNavigation(state.navigation);
+    }
+
+    // If this was a 307/308 submission we want to preserve the HTTP method and
+    // re-submit the GET/POST/PUT/PATCH/DELETE as a submission navigation to the
+    // redirected location
+    let activeSubmission = submission || fetcherSubmission;
+    if (
+      redirectPreserveMethodStatusCodes.has(redirect.response.status) &&
+      activeSubmission &&
+      isMutationMethod(activeSubmission.formMethod)
+    ) {
+      await startNavigation(redirectHistoryAction, redirectLocation, {
+        submission: {
+          ...activeSubmission,
+          formAction: location,
+        },
+        // Preserve this flag across redirects
+        preventScrollReset: pendingPreventScrollReset,
+      });
+    } else {
+      // If we have a navigation submission, we will preserve it through the
+      // redirect navigation
+      let overrideNavigation = getLoadingNavigation(
+        redirectLocation,
+        submission
+      );
+      await startNavigation(redirectHistoryAction, redirectLocation, {
+        overrideNavigation,
+        // Send fetcher submissions through for shouldRevalidate
+        fetcherSubmission,
+        // Preserve this flag across redirects
+        preventScrollReset: pendingPreventScrollReset,
+      });
+    }
+  }
+
+  // Utility wrapper for calling dataStrategy client-side without having to
+  // pass around the manifest, mapRouteProperties, etc.
+  async function callDataStrategy(
+    type: "loader" | "action",
+    request: Request,
+    matchesToLoad: AgnosticDataRouteMatch[],
+    matches: AgnosticDataRouteMatch[]
+  ): Promise<DataResult[]> {
+    try {
+      let results = await callDataStrategyImpl(
+        dataStrategyImpl,
+        type,
+        request,
+        matchesToLoad,
+        matches,
+        manifest,
+        mapRouteProperties
+      );
+
+      return await Promise.all(
+        results.map((result, i) => {
+          if (isRedirectHandlerResult(result)) {
+            let response = result.result as Response;
+            return {
+              type: ResultType.redirect,
+              response: normalizeRelativeRoutingRedirectResponse(
+                response,
+                request,
+                matchesToLoad[i].route.id,
+                matches,
+                basename,
+                future.v7_relativeSplatPath
+              ),
+            };
+          }
+
+          return convertHandlerResultToDataResult(result);
+        })
+      );
+    } catch (e) {
+      // If the outer dataStrategy method throws, just return the error for all
+      // matches - and it'll naturally bubble to the root
+      return matchesToLoad.map(() => ({
+        type: ResultType.error,
+        error: e,
+      }));
+    }
+  }
+
+  async function callLoadersAndMaybeResolveData(
+    currentMatches: AgnosticDataRouteMatch[],
+    matches: AgnosticDataRouteMatch[],
+    matchesToLoad: AgnosticDataRouteMatch[],
+    fetchersToLoad: RevalidatingFetcher[],
+    request: Request
+  ) {
+    let [loaderResults, ...fetcherResults] = await Promise.all([
+      matchesToLoad.length
+        ? callDataStrategy("loader", request, matchesToLoad, matches)
+        : [],
+      ...fetchersToLoad.map((f) => {
+        if (f.matches && f.match && f.controller) {
+          let fetcherRequest = createClientSideRequest(
+            init.history,
+            f.path,
+            f.controller.signal
+          );
+          return callDataStrategy(
+            "loader",
+            fetcherRequest,
+            [f.match],
+            f.matches
+          ).then((r) => r[0]);
+        } else {
+          return Promise.resolve<DataResult>({
+            type: ResultType.error,
+            error: getInternalRouterError(404, {
+              pathname: f.path,
+            }),
+          });
+        }
+      }),
+    ]);
+
+    await Promise.all([
+      resolveDeferredResults(
+        currentMatches,
+        matchesToLoad,
+        loaderResults,
+        loaderResults.map(() => request.signal),
+        false,
+        state.loaderData
+      ),
+      resolveDeferredResults(
+        currentMatches,
+        fetchersToLoad.map((f) => f.match),
+        fetcherResults,
+        fetchersToLoad.map((f) => (f.controller ? f.controller.signal : null)),
+        true
+      ),
+    ]);
+
+    return {
+      loaderResults,
+      fetcherResults,
+    };
+  }
+
+  function interruptActiveLoads() {
+    // Every interruption triggers a revalidation
+    isRevalidationRequired = true;
+
+    // Cancel pending route-level deferreds and mark cancelled routes for
+    // revalidation
+    cancelledDeferredRoutes.push(...cancelActiveDeferreds());
+
+    // Abort in-flight fetcher loads
+    fetchLoadMatches.forEach((_, key) => {
+      if (fetchControllers.has(key)) {
+        cancelledFetcherLoads.push(key);
+        abortFetcher(key);
+      }
+    });
+  }
+
+  function updateFetcherState(
+    key: string,
+    fetcher: Fetcher,
+    opts: { flushSync?: boolean } = {}
+  ) {
+    state.fetchers.set(key, fetcher);
+    updateState(
+      { fetchers: new Map(state.fetchers) },
+      { flushSync: (opts && opts.flushSync) === true }
+    );
+  }
+
+  function setFetcherError(
+    key: string,
+    routeId: string,
+    error: any,
+    opts: { flushSync?: boolean } = {}
+  ) {
+    let boundaryMatch = findNearestBoundary(state.matches, routeId);
+    deleteFetcher(key);
+    updateState(
+      {
+        errors: {
+          [boundaryMatch.route.id]: error,
+        },
+        fetchers: new Map(state.fetchers),
+      },
+      { flushSync: (opts && opts.flushSync) === true }
+    );
+  }
+
+  function getFetcher<TData = any>(key: string): Fetcher<TData> {
+    if (future.v7_fetcherPersist) {
+      activeFetchers.set(key, (activeFetchers.get(key) || 0) + 1);
+      // If this fetcher was previously marked for deletion, unmark it since we
+      // have a new instance
+      if (deletedFetchers.has(key)) {
+        deletedFetchers.delete(key);
+      }
+    }
+    return state.fetchers.get(key) || IDLE_FETCHER;
+  }
+
+  function deleteFetcher(key: string): void {
+    let fetcher = state.fetchers.get(key);
+    // Don't abort the controller if this is a deletion of a fetcher.submit()
+    // in it's loading phase since - we don't want to abort the corresponding
+    // revalidation and want them to complete and land
+    if (
+      fetchControllers.has(key) &&
+      !(fetcher && fetcher.state === "loading" && fetchReloadIds.has(key))
+    ) {
+      abortFetcher(key);
+    }
+    fetchLoadMatches.delete(key);
+    fetchReloadIds.delete(key);
+    fetchRedirectIds.delete(key);
+    deletedFetchers.delete(key);
+    state.fetchers.delete(key);
+  }
+
+  function deleteFetcherAndUpdateState(key: string): void {
+    if (future.v7_fetcherPersist) {
+      let count = (activeFetchers.get(key) || 0) - 1;
+      if (count <= 0) {
+        activeFetchers.delete(key);
+        deletedFetchers.add(key);
+      } else {
+        activeFetchers.set(key, count);
+      }
+    } else {
+      deleteFetcher(key);
+    }
+    updateState({ fetchers: new Map(state.fetchers) });
+  }
+
+  function abortFetcher(key: string) {
+    let controller = fetchControllers.get(key);
+    invariant(controller, `Expected fetch controller: ${key}`);
+    controller.abort();
+    fetchControllers.delete(key);
+  }
+
+  function markFetchersDone(keys: string[]) {
+    for (let key of keys) {
+      let fetcher = getFetcher(key);
+      let doneFetcher = getDoneFetcher(fetcher.data);
+      state.fetchers.set(key, doneFetcher);
+    }
+  }
+
+  function markFetchRedirectsDone(): boolean {
+    let doneKeys = [];
+    let updatedFetchers = false;
+    for (let key of fetchRedirectIds) {
+      let fetcher = state.fetchers.get(key);
+      invariant(fetcher, `Expected fetcher: ${key}`);
+      if (fetcher.state === "loading") {
+        fetchRedirectIds.delete(key);
+        doneKeys.push(key);
+        updatedFetchers = true;
+      }
+    }
+    markFetchersDone(doneKeys);
+    return updatedFetchers;
+  }
+
+  function abortStaleFetchLoads(landedId: number): boolean {
+    let yeetedKeys = [];
+    for (let [key, id] of fetchReloadIds) {
+      if (id < landedId) {
+        let fetcher = state.fetchers.get(key);
+        invariant(fetcher, `Expected fetcher: ${key}`);
+        if (fetcher.state === "loading") {
+          abortFetcher(key);
+          fetchReloadIds.delete(key);
+          yeetedKeys.push(key);
+        }
+      }
+    }
+    markFetchersDone(yeetedKeys);
+    return yeetedKeys.length > 0;
+  }
+
+  function getBlocker(key: string, fn: BlockerFunction) {
+    let blocker: Blocker = state.blockers.get(key) || IDLE_BLOCKER;
+
+    if (blockerFunctions.get(key) !== fn) {
+      blockerFunctions.set(key, fn);
+    }
+
+    return blocker;
+  }
+
+  function deleteBlocker(key: string) {
+    state.blockers.delete(key);
+    blockerFunctions.delete(key);
+  }
+
+  // Utility function to update blockers, ensuring valid state transitions
+  function updateBlocker(key: string, newBlocker: Blocker) {
+    let blocker = state.blockers.get(key) || IDLE_BLOCKER;
+
+    // Poor mans state machine :)
+    // https://mermaid.live/edit#pako:eNqVkc9OwzAMxl8l8nnjAYrEtDIOHEBIgwvKJTReGy3_lDpIqO27k6awMG0XcrLlnz87nwdonESogKXXBuE79rq75XZO3-yHds0RJVuv70YrPlUrCEe2HfrORS3rubqZfuhtpg5C9wk5tZ4VKcRUq88q9Z8RS0-48cE1iHJkL0ugbHuFLus9L6spZy8nX9MP2CNdomVaposqu3fGayT8T8-jJQwhepo_UtpgBQaDEUom04dZhAN1aJBDlUKJBxE1ceB2Smj0Mln-IBW5AFU2dwUiktt_2Qaq2dBfaKdEup85UV7Yd-dKjlnkabl2Pvr0DTkTreM
+    invariant(
+      (blocker.state === "unblocked" && newBlocker.state === "blocked") ||
+        (blocker.state === "blocked" && newBlocker.state === "blocked") ||
+        (blocker.state === "blocked" && newBlocker.state === "proceeding") ||
+        (blocker.state === "blocked" && newBlocker.state === "unblocked") ||
+        (blocker.state === "proceeding" && newBlocker.state === "unblocked"),
+      `Invalid blocker state transition: ${blocker.state} -> ${newBlocker.state}`
+    );
+
+    let blockers = new Map(state.blockers);
+    blockers.set(key, newBlocker);
+    updateState({ blockers });
+  }
+
+  function shouldBlockNavigation({
+    currentLocation,
+    nextLocation,
+    historyAction,
+  }: {
+    currentLocation: Location;
+    nextLocation: Location;
+    historyAction: HistoryAction;
+  }): string | undefined {
+    if (blockerFunctions.size === 0) {
+      return;
+    }
+
+    // We ony support a single active blocker at the moment since we don't have
+    // any compelling use cases for multi-blocker yet
+    if (blockerFunctions.size > 1) {
+      warning(false, "A router only supports one blocker at a time");
+    }
+
+    let entries = Array.from(blockerFunctions.entries());
+    let [blockerKey, blockerFunction] = entries[entries.length - 1];
+    let blocker = state.blockers.get(blockerKey);
+
+    if (blocker && blocker.state === "proceeding") {
+      // If the blocker is currently proceeding, we don't need to re-check
+      // it and can let this navigation continue
+      return;
+    }
+
+    // At this point, we know we're unblocked/blocked so we need to check the
+    // user-provided blocker function
+    if (blockerFunction({ currentLocation, nextLocation, historyAction })) {
+      return blockerKey;
+    }
+  }
+
+  function cancelActiveDeferreds(
+    predicate?: (routeId: string) => boolean
+  ): string[] {
+    let cancelledRouteIds: string[] = [];
+    activeDeferreds.forEach((dfd, routeId) => {
+      if (!predicate || predicate(routeId)) {
+        // Cancel the deferred - but do not remove from activeDeferreds here -
+        // we rely on the subscribers to do that so our tests can assert proper
+        // cleanup via _internalActiveDeferreds
+        dfd.cancel();
+        cancelledRouteIds.push(routeId);
+        activeDeferreds.delete(routeId);
+      }
+    });
+    return cancelledRouteIds;
+  }
+
+  // Opt in to capturing and reporting scroll positions during navigations,
+  // used by the <ScrollRestoration> component
+  function enableScrollRestoration(
+    positions: Record<string, number>,
+    getPosition: GetScrollPositionFunction,
+    getKey?: GetScrollRestorationKeyFunction
+  ) {
+    savedScrollPositions = positions;
+    getScrollPosition = getPosition;
+    getScrollRestorationKey = getKey || null;
+
+    // Perform initial hydration scroll restoration, since we miss the boat on
+    // the initial updateState() because we've not yet rendered <ScrollRestoration/>
+    // and therefore have no savedScrollPositions available
+    if (!initialScrollRestored && state.navigation === IDLE_NAVIGATION) {
+      initialScrollRestored = true;
+      let y = getSavedScrollPosition(state.location, state.matches);
+      if (y != null) {
+        updateState({ restoreScrollPosition: y });
+      }
+    }
+
+    return () => {
+      savedScrollPositions = null;
+      getScrollPosition = null;
+      getScrollRestorationKey = null;
+    };
+  }
+
+  function getScrollKey(location: Location, matches: AgnosticDataRouteMatch[]) {
+    if (getScrollRestorationKey) {
+      let key = getScrollRestorationKey(
+        location,
+        matches.map((m) => convertRouteMatchToUiMatch(m, state.loaderData))
+      );
+      return key || location.key;
+    }
+    return location.key;
+  }
+
+  function saveScrollPosition(
+    location: Location,
+    matches: AgnosticDataRouteMatch[]
+  ): void {
+    if (savedScrollPositions && getScrollPosition) {
+      let key = getScrollKey(location, matches);
+      savedScrollPositions[key] = getScrollPosition();
+    }
+  }
+
+  function getSavedScrollPosition(
+    location: Location,
+    matches: AgnosticDataRouteMatch[]
+  ): number | null {
+    if (savedScrollPositions) {
+      let key = getScrollKey(location, matches);
+      let y = savedScrollPositions[key];
+      if (typeof y === "number") {
+        return y;
+      }
+    }
+    return null;
+  }
+
+  function _internalSetRoutes(newRoutes: AgnosticDataRouteObject[]) {
+    manifest = {};
+    inFlightDataRoutes = convertRoutesToDataRoutes(
+      newRoutes,
+      mapRouteProperties,
+      undefined,
+      manifest
+    );
+  }
+
+  router = {
+    get basename() {
+      return basename;
+    },
+    get future() {
+      return future;
+    },
+    get state() {
+      return state;
+    },
+    get routes() {
+      return dataRoutes;
+    },
+    get window() {
+      return routerWindow;
+    },
+    initialize,
+    subscribe,
+    enableScrollRestoration,
+    navigate,
+    fetch,
+    revalidate,
+    // Passthrough to history-aware createHref used by useHref so we get proper
+    // hash-aware URLs in DOM paths
+    createHref: (to: To) => init.history.createHref(to),
+    encodeLocation: (to: To) => init.history.encodeLocation(to),
+    getFetcher,
+    deleteFetcher: deleteFetcherAndUpdateState,
+    dispose,
+    getBlocker,
+    deleteBlocker,
+    _internalFetchControllers: fetchControllers,
+    _internalActiveDeferreds: activeDeferreds,
+    // TODO: Remove setRoutes, it's temporary to avoid dealing with
+    // updating the tree while validating the update algorithm.
+    _internalSetRoutes,
+  };
+
+  return router;
+}
+//#endregion
+
+////////////////////////////////////////////////////////////////////////////////
+//#region createStaticHandler
+////////////////////////////////////////////////////////////////////////////////
+
+export const UNSAFE_DEFERRED_SYMBOL = Symbol("deferred");
+
+/**
+ * Future flags to toggle new feature behavior
+ */
+export interface StaticHandlerFutureConfig {
+  v7_relativeSplatPath: boolean;
+  v7_throwAbortReason: boolean;
+}
+
+export interface CreateStaticHandlerOptions {
+  basename?: string;
+  /**
+   * @deprecated Use `mapRouteProperties` instead
+   */
+  detectErrorBoundary?: DetectErrorBoundaryFunction;
+  mapRouteProperties?: MapRoutePropertiesFunction;
+  future?: Partial<StaticHandlerFutureConfig>;
+}
+
+export function createStaticHandler(
+  routes: AgnosticRouteObject[],
+  opts?: CreateStaticHandlerOptions
+): StaticHandler {
+  invariant(
+    routes.length > 0,
+    "You must provide a non-empty routes array to createStaticHandler"
+  );
+
+  let manifest: RouteManifest = {};
+  let basename = (opts ? opts.basename : null) || "/";
+  let mapRouteProperties: MapRoutePropertiesFunction;
+  if (opts?.mapRouteProperties) {
+    mapRouteProperties = opts.mapRouteProperties;
+  } else if (opts?.detectErrorBoundary) {
+    // If they are still using the deprecated version, wrap it with the new API
+    let detectErrorBoundary = opts.detectErrorBoundary;
+    mapRouteProperties = (route) => ({
+      hasErrorBoundary: detectErrorBoundary(route),
+    });
+  } else {
+    mapRouteProperties = defaultMapRouteProperties;
+  }
+  // Config driven behavior flags
+  let future: StaticHandlerFutureConfig = {
+    v7_relativeSplatPath: false,
+    v7_throwAbortReason: false,
+    ...(opts ? opts.future : null),
+  };
+
+  let dataRoutes = convertRoutesToDataRoutes(
+    routes,
+    mapRouteProperties,
+    undefined,
+    manifest
+  );
+
+  /**
+   * The query() method is intended for document requests, in which we want to
+   * call an optional action and potentially multiple loaders for all nested
+   * routes.  It returns a StaticHandlerContext object, which is very similar
+   * to the router state (location, loaderData, actionData, errors, etc.) and
+   * also adds SSR-specific information such as the statusCode and headers
+   * from action/loaders Responses.
+   *
+   * It _should_ never throw and should report all errors through the
+   * returned context.errors object, properly associating errors to their error
+   * boundary.  Additionally, it tracks _deepestRenderedBoundaryId which can be
+   * used to emulate React error boundaries during SSr by performing a second
+   * pass only down to the boundaryId.
+   *
+   * The one exception where we do not return a StaticHandlerContext is when a
+   * redirect response is returned or thrown from any action/loader.  We
+   * propagate that out and return the raw Response so the HTTP server can
+   * return it directly.
+   *
+   * - `opts.requestContext` is an optional server context that will be passed
+   *   to actions/loaders in the `context` parameter
+   * - `opts.skipLoaderErrorBubbling` is an optional parameter that will prevent
+   *   the bubbling of errors which allows single-fetch-type implementations
+   *   where the client will handle the bubbling and we may need to return data
+   *   for the handling route
+   */
+  async function query(
+    request: Request,
+    {
+      requestContext,
+      skipLoaderErrorBubbling,
+      unstable_dataStrategy,
+    }: {
+      requestContext?: unknown;
+      skipLoaderErrorBubbling?: boolean;
+      unstable_dataStrategy?: DataStrategyFunction;
+    } = {}
+  ): Promise<StaticHandlerContext | Response> {
+    let url = new URL(request.url);
+    let method = request.method;
+    let location = createLocation("", createPath(url), null, "default");
+    let matches = matchRoutes(dataRoutes, location, basename);
+
+    // SSR supports HEAD requests while SPA doesn't
+    if (!isValidMethod(method) && method !== "HEAD") {
+      let error = getInternalRouterError(405, { method });
+      let { matches: methodNotAllowedMatches, route } =
+        getShortCircuitMatches(dataRoutes);
+      return {
+        basename,
+        location,
+        matches: methodNotAllowedMatches,
+        loaderData: {},
+        actionData: null,
+        errors: {
+          [route.id]: error,
+        },
+        statusCode: error.status,
+        loaderHeaders: {},
+        actionHeaders: {},
+        activeDeferreds: null,
+      };
+    } else if (!matches) {
+      let error = getInternalRouterError(404, { pathname: location.pathname });
+      let { matches: notFoundMatches, route } =
+        getShortCircuitMatches(dataRoutes);
+      return {
+        basename,
+        location,
+        matches: notFoundMatches,
+        loaderData: {},
+        actionData: null,
+        errors: {
+          [route.id]: error,
+        },
+        statusCode: error.status,
+        loaderHeaders: {},
+        actionHeaders: {},
+        activeDeferreds: null,
+      };
+    }
+
+    let result = await queryImpl(
+      request,
+      location,
+      matches,
+      requestContext,
+      unstable_dataStrategy || null,
+      skipLoaderErrorBubbling === true,
+      null
+    );
+    if (isResponse(result)) {
+      return result;
+    }
+
+    // When returning StaticHandlerContext, we patch back in the location here
+    // since we need it for React Context.  But this helps keep our submit and
+    // loadRouteData operating on a Request instead of a Location
+    return { location, basename, ...result };
+  }
+
+  /**
+   * The queryRoute() method is intended for targeted route requests, either
+   * for fetch ?_data requests or resource route requests.  In this case, we
+   * are only ever calling a single action or loader, and we are returning the
+   * returned value directly.  In most cases, this will be a Response returned
+   * from the action/loader, but it may be a primitive or other value as well -
+   * and in such cases the calling context should handle that accordingly.
+   *
+   * We do respect the throw/return differentiation, so if an action/loader
+   * throws, then this method will throw the value.  This is important so we
+   * can do proper boundary identification in Remix where a thrown Response
+   * must go to the Catch Boundary but a returned Response is happy-path.
+   *
+   * One thing to note is that any Router-initiated Errors that make sense
+   * to associate with a status code will be thrown as an ErrorResponse
+   * instance which include the raw Error, such that the calling context can
+   * serialize the error as they see fit while including the proper response
+   * code.  Examples here are 404 and 405 errors that occur prior to reaching
+   * any user-defined loaders.
+   *
+   * - `opts.routeId` allows you to specify the specific route handler to call.
+   *   If not provided the handler will determine the proper route by matching
+   *   against `request.url`
+   * - `opts.requestContext` is an optional server context that will be passed
+   *    to actions/loaders in the `context` parameter
+   */
+  async function queryRoute(
+    request: Request,
+    {
+      routeId,
+      requestContext,
+      unstable_dataStrategy,
+    }: {
+      requestContext?: unknown;
+      routeId?: string;
+      unstable_dataStrategy?: DataStrategyFunction;
+    } = {}
+  ): Promise<any> {
+    let url = new URL(request.url);
+    let method = request.method;
+    let location = createLocation("", createPath(url), null, "default");
+    let matches = matchRoutes(dataRoutes, location, basename);
+
+    // SSR supports HEAD requests while SPA doesn't
+    if (!isValidMethod(method) && method !== "HEAD" && method !== "OPTIONS") {
+      throw getInternalRouterError(405, { method });
+    } else if (!matches) {
+      throw getInternalRouterError(404, { pathname: location.pathname });
+    }
+
+    let match = routeId
+      ? matches.find((m) => m.route.id === routeId)
+      : getTargetMatch(matches, location);
+
+    if (routeId && !match) {
+      throw getInternalRouterError(403, {
+        pathname: location.pathname,
+        routeId,
+      });
+    } else if (!match) {
+      // This should never hit I don't think?
+      throw getInternalRouterError(404, { pathname: location.pathname });
+    }
+
+    let result = await queryImpl(
+      request,
+      location,
+      matches,
+      requestContext,
+      unstable_dataStrategy || null,
+      false,
+      match
+    );
+
+    if (isResponse(result)) {
+      return result;
+    }
+
+    let error = result.errors ? Object.values(result.errors)[0] : undefined;
+    if (error !== undefined) {
+      // If we got back result.errors, that means the loader/action threw
+      // _something_ that wasn't a Response, but it's not guaranteed/required
+      // to be an `instanceof Error` either, so we have to use throw here to
+      // preserve the "error" state outside of queryImpl.
+      throw error;
+    }
+
+    // Pick off the right state value to return
+    if (result.actionData) {
+      return Object.values(result.actionData)[0];
+    }
+
+    if (result.loaderData) {
+      let data = Object.values(result.loaderData)[0];
+      if (result.activeDeferreds?.[match.route.id]) {
+        data[UNSAFE_DEFERRED_SYMBOL] = result.activeDeferreds[match.route.id];
+      }
+      return data;
+    }
+
+    return undefined;
+  }
+
+  async function queryImpl(
+    request: Request,
+    location: Location,
+    matches: AgnosticDataRouteMatch[],
+    requestContext: unknown,
+    unstable_dataStrategy: DataStrategyFunction | null,
+    skipLoaderErrorBubbling: boolean,
+    routeMatch: AgnosticDataRouteMatch | null
+  ): Promise<Omit<StaticHandlerContext, "location" | "basename"> | Response> {
+    invariant(
+      request.signal,
+      "query()/queryRoute() requests must contain an AbortController signal"
+    );
+
+    try {
+      if (isMutationMethod(request.method.toLowerCase())) {
+        let result = await submit(
+          request,
+          matches,
+          routeMatch || getTargetMatch(matches, location),
+          requestContext,
+          unstable_dataStrategy,
+          skipLoaderErrorBubbling,
+          routeMatch != null
+        );
+        return result;
+      }
+
+      let result = await loadRouteData(
+        request,
+        matches,
+        requestContext,
+        unstable_dataStrategy,
+        skipLoaderErrorBubbling,
+        routeMatch
+      );
+      return isResponse(result)
+        ? result
+        : {
+            ...result,
+            actionData: null,
+            actionHeaders: {},
+          };
+    } catch (e) {
+      // If the user threw/returned a Response in callLoaderOrAction for a
+      // `queryRoute` call, we throw the `HandlerResult` to bail out early
+      // and then return or throw the raw Response here accordingly
+      if (isHandlerResult(e) && isResponse(e.result)) {
+        if (e.type === ResultType.error) {
+          throw e.result;
+        }
+        return e.result;
+      }
+      // Redirects are always returned since they don't propagate to catch
+      // boundaries
+      if (isRedirectResponse(e)) {
+        return e;
+      }
+      throw e;
+    }
+  }
+
+  async function submit(
+    request: Request,
+    matches: AgnosticDataRouteMatch[],
+    actionMatch: AgnosticDataRouteMatch,
+    requestContext: unknown,
+    unstable_dataStrategy: DataStrategyFunction | null,
+    skipLoaderErrorBubbling: boolean,
+    isRouteRequest: boolean
+  ): Promise<Omit<StaticHandlerContext, "location" | "basename"> | Response> {
+    let result: DataResult;
+
+    if (!actionMatch.route.action && !actionMatch.route.lazy) {
+      let error = getInternalRouterError(405, {
+        method: request.method,
+        pathname: new URL(request.url).pathname,
+        routeId: actionMatch.route.id,
+      });
+      if (isRouteRequest) {
+        throw error;
+      }
+      result = {
+        type: ResultType.error,
+        error,
+      };
+    } else {
+      let results = await callDataStrategy(
+        "action",
+        request,
+        [actionMatch],
+        matches,
+        isRouteRequest,
+        requestContext,
+        unstable_dataStrategy
+      );
+      result = results[0];
+
+      if (request.signal.aborted) {
+        throwStaticHandlerAbortedError(request, isRouteRequest, future);
+      }
+    }
+
+    if (isRedirectResult(result)) {
+      // Uhhhh - this should never happen, we should always throw these from
+      // callLoaderOrAction, but the type narrowing here keeps TS happy and we
+      // can get back on the "throw all redirect responses" train here should
+      // this ever happen :/
+      throw new Response(null, {
+        status: result.response.status,
+        headers: {
+          Location: result.response.headers.get("Location")!,
+        },
+      });
+    }
+
+    if (isDeferredResult(result)) {
+      let error = getInternalRouterError(400, { type: "defer-action" });
+      if (isRouteRequest) {
+        throw error;
+      }
+      result = {
+        type: ResultType.error,
+        error,
+      };
+    }
+
+    if (isRouteRequest) {
+      // Note: This should only be non-Response values if we get here, since
+      // isRouteRequest should throw any Response received in callLoaderOrAction
+      if (isErrorResult(result)) {
+        throw result.error;
+      }
+
+      return {
+        matches: [actionMatch],
+        loaderData: {},
+        actionData: { [actionMatch.route.id]: result.data },
+        errors: null,
+        // Note: statusCode + headers are unused here since queryRoute will
+        // return the raw Response or value
+        statusCode: 200,
+        loaderHeaders: {},
+        actionHeaders: {},
+        activeDeferreds: null,
+      };
+    }
+
+    // Create a GET request for the loaders
+    let loaderRequest = new Request(request.url, {
+      headers: request.headers,
+      redirect: request.redirect,
+      signal: request.signal,
+    });
+
+    if (isErrorResult(result)) {
+      // Store off the pending error - we use it to determine which loaders
+      // to call and will commit it when we complete the navigation
+      let boundaryMatch = skipLoaderErrorBubbling
+        ? actionMatch
+        : findNearestBoundary(matches, actionMatch.route.id);
+
+      let context = await loadRouteData(
+        loaderRequest,
+        matches,
+        requestContext,
+        unstable_dataStrategy,
+        skipLoaderErrorBubbling,
+        null,
+        [boundaryMatch.route.id, result]
+      );
+
+      // action status codes take precedence over loader status codes
+      return {
+        ...context,
+        statusCode: isRouteErrorResponse(result.error)
+          ? result.error.status
+          : result.statusCode != null
+          ? result.statusCode
+          : 500,
+        actionData: null,
+        actionHeaders: {
+          ...(result.headers ? { [actionMatch.route.id]: result.headers } : {}),
+        },
+      };
+    }
+
+    let context = await loadRouteData(
+      loaderRequest,
+      matches,
+      requestContext,
+      unstable_dataStrategy,
+      skipLoaderErrorBubbling,
+      null
+    );
+
+    return {
+      ...context,
+      actionData: {
+        [actionMatch.route.id]: result.data,
+      },
+      // action status codes take precedence over loader status codes
+      ...(result.statusCode ? { statusCode: result.statusCode } : {}),
+      actionHeaders: result.headers
+        ? { [actionMatch.route.id]: result.headers }
+        : {},
+    };
+  }
+
+  async function loadRouteData(
+    request: Request,
+    matches: AgnosticDataRouteMatch[],
+    requestContext: unknown,
+    unstable_dataStrategy: DataStrategyFunction | null,
+    skipLoaderErrorBubbling: boolean,
+    routeMatch: AgnosticDataRouteMatch | null,
+    pendingActionResult?: PendingActionResult
+  ): Promise<
+    | Omit<
+        StaticHandlerContext,
+        "location" | "basename" | "actionData" | "actionHeaders"
+      >
+    | Response
+  > {
+    let isRouteRequest = routeMatch != null;
+
+    // Short circuit if we have no loaders to run (queryRoute())
+    if (
+      isRouteRequest &&
+      !routeMatch?.route.loader &&
+      !routeMatch?.route.lazy
+    ) {
+      throw getInternalRouterError(400, {
+        method: request.method,
+        pathname: new URL(request.url).pathname,
+        routeId: routeMatch?.route.id,
+      });
+    }
+
+    let requestMatches = routeMatch
+      ? [routeMatch]
+      : pendingActionResult && isErrorResult(pendingActionResult[1])
+      ? getLoaderMatchesUntilBoundary(matches, pendingActionResult[0])
+      : matches;
+    let matchesToLoad = requestMatches.filter(
+      (m) => m.route.loader || m.route.lazy
+    );
+
+    // Short circuit if we have no loaders to run (query())
+    if (matchesToLoad.length === 0) {
+      return {
+        matches,
+        // Add a null for all matched routes for proper revalidation on the client
+        loaderData: matches.reduce(
+          (acc, m) => Object.assign(acc, { [m.route.id]: null }),
+          {}
+        ),
+        errors:
+          pendingActionResult && isErrorResult(pendingActionResult[1])
+            ? {
+                [pendingActionResult[0]]: pendingActionResult[1].error,
+              }
+            : null,
+        statusCode: 200,
+        loaderHeaders: {},
+        activeDeferreds: null,
+      };
+    }
+
+    let results = await callDataStrategy(
+      "loader",
+      request,
+      matchesToLoad,
+      matches,
+      isRouteRequest,
+      requestContext,
+      unstable_dataStrategy
+    );
+
+    if (request.signal.aborted) {
+      throwStaticHandlerAbortedError(request, isRouteRequest, future);
+    }
+
+    // Process and commit output from loaders
+    let activeDeferreds = new Map<string, DeferredData>();
+    let context = processRouteLoaderData(
+      matches,
+      matchesToLoad,
+      results,
+      pendingActionResult,
+      activeDeferreds,
+      skipLoaderErrorBubbling
+    );
+
+    // Add a null for any non-loader matches for proper revalidation on the client
+    let executedLoaders = new Set<string>(
+      matchesToLoad.map((match) => match.route.id)
+    );
+    matches.forEach((match) => {
+      if (!executedLoaders.has(match.route.id)) {
+        context.loaderData[match.route.id] = null;
+      }
+    });
+
+    return {
+      ...context,
+      matches,
+      activeDeferreds:
+        activeDeferreds.size > 0
+          ? Object.fromEntries(activeDeferreds.entries())
+          : null,
+    };
+  }
+
+  // Utility wrapper for calling dataStrategy server-side without having to
+  // pass around the manifest, mapRouteProperties, etc.
+  async function callDataStrategy(
+    type: "loader" | "action",
+    request: Request,
+    matchesToLoad: AgnosticDataRouteMatch[],
+    matches: AgnosticDataRouteMatch[],
+    isRouteRequest: boolean,
+    requestContext: unknown,
+    unstable_dataStrategy: DataStrategyFunction | null
+  ): Promise<DataResult[]> {
+    let results = await callDataStrategyImpl(
+      unstable_dataStrategy || defaultDataStrategy,
+      type,
+      request,
+      matchesToLoad,
+      matches,
+      manifest,
+      mapRouteProperties,
+      requestContext
+    );
+
+    return await Promise.all(
+      results.map((result, i) => {
+        if (isRedirectHandlerResult(result)) {
+          let response = result.result as Response;
+          // Throw redirects and let the server handle them with an HTTP redirect
+          throw normalizeRelativeRoutingRedirectResponse(
+            response,
+            request,
+            matchesToLoad[i].route.id,
+            matches,
+            basename,
+            future.v7_relativeSplatPath
+          );
+        }
+        if (isResponse(result.result) && isRouteRequest) {
+          // For SSR single-route requests, we want to hand Responses back
+          // directly without unwrapping
+          throw result;
+        }
+
+        return convertHandlerResultToDataResult(result);
+      })
+    );
+  }
+
+  return {
+    dataRoutes,
+    query,
+    queryRoute,
+  };
+}
+
+//#endregion
+
+////////////////////////////////////////////////////////////////////////////////
+//#region Helpers
+////////////////////////////////////////////////////////////////////////////////
+
+/**
+ * Given an existing StaticHandlerContext and an error thrown at render time,
+ * provide an updated StaticHandlerContext suitable for a second SSR render
+ */
+export function getStaticContextFromError(
+  routes: AgnosticDataRouteObject[],
+  context: StaticHandlerContext,
+  error: any
+) {
+  let newContext: StaticHandlerContext = {
+    ...context,
+    statusCode: isRouteErrorResponse(error) ? error.status : 500,
+    errors: {
+      [context._deepestRenderedBoundaryId || routes[0].id]: error,
+    },
+  };
+  return newContext;
+}
+
+function throwStaticHandlerAbortedError(
+  request: Request,
+  isRouteRequest: boolean,
+  future: StaticHandlerFutureConfig
+) {
+  if (future.v7_throwAbortReason && request.signal.reason !== undefined) {
+    throw request.signal.reason;
+  }
+
+  let method = isRouteRequest ? "queryRoute" : "query";
+  throw new Error(`${method}() call aborted: ${request.method} ${request.url}`);
+}
+
+function isSubmissionNavigation(
+  opts: BaseNavigateOrFetchOptions
+): opts is SubmissionNavigateOptions {
+  return (
+    opts != null &&
+    (("formData" in opts && opts.formData != null) ||
+      ("body" in opts && opts.body !== undefined))
+  );
+}
+
+function normalizeTo(
+  location: Path,
+  matches: AgnosticDataRouteMatch[],
+  basename: string,
+  prependBasename: boolean,
+  to: To | null,
+  v7_relativeSplatPath: boolean,
+  fromRouteId?: string,
+  relative?: RelativeRoutingType
+) {
+  let contextualMatches: AgnosticDataRouteMatch[];
+  let activeRouteMatch: AgnosticDataRouteMatch | undefined;
+  if (fromRouteId) {
+    // Grab matches up to the calling route so our route-relative logic is
+    // relative to the correct source route
+    contextualMatches = [];
+    for (let match of matches) {
+      contextualMatches.push(match);
+      if (match.route.id === fromRouteId) {
+        activeRouteMatch = match;
+        break;
+      }
+    }
+  } else {
+    contextualMatches = matches;
+    activeRouteMatch = matches[matches.length - 1];
+  }
+
+  // Resolve the relative path
+  let path = resolveTo(
+    to ? to : ".",
+    getResolveToMatches(contextualMatches, v7_relativeSplatPath),
+    stripBasename(location.pathname, basename) || location.pathname,
+    relative === "path"
+  );
+
+  // When `to` is not specified we inherit search/hash from the current
+  // location, unlike when to="." and we just inherit the path.
+  // See https://github.com/remix-run/remix/issues/927
+  if (to == null) {
+    path.search = location.search;
+    path.hash = location.hash;
+  }
+
+  // Add an ?index param for matched index routes if we don't already have one
+  if (
+    (to == null || to === "" || to === ".") &&
+    activeRouteMatch &&
+    activeRouteMatch.route.index &&
+    !hasNakedIndexQuery(path.search)
+  ) {
+    path.search = path.search
+      ? path.search.replace(/^\?/, "?index&")
+      : "?index";
+  }
+
+  // If we're operating within a basename, prepend it to the pathname.  If
+  // this is a root navigation, then just use the raw basename which allows
+  // the basename to have full control over the presence of a trailing slash
+  // on root actions
+  if (prependBasename && basename !== "/") {
+    path.pathname =
+      path.pathname === "/" ? basename : joinPaths([basename, path.pathname]);
+  }
+
+  return createPath(path);
+}
+
+// Normalize navigation options by converting formMethod=GET formData objects to
+// URLSearchParams so they behave identically to links with query params
+function normalizeNavigateOptions(
+  normalizeFormMethod: boolean,
+  isFetcher: boolean,
+  path: string,
+  opts?: BaseNavigateOrFetchOptions
+): {
+  path: string;
+  submission?: Submission;
+  error?: ErrorResponseImpl;
+} {
+  // Return location verbatim on non-submission navigations
+  if (!opts || !isSubmissionNavigation(opts)) {
+    return { path };
+  }
+
+  if (opts.formMethod && !isValidMethod(opts.formMethod)) {
+    return {
+      path,
+      error: getInternalRouterError(405, { method: opts.formMethod }),
+    };
+  }
+
+  let getInvalidBodyError = () => ({
+    path,
+    error: getInternalRouterError(400, { type: "invalid-body" }),
+  });
+
+  // Create a Submission on non-GET navigations
+  let rawFormMethod = opts.formMethod || "get";
+  let formMethod = normalizeFormMethod
+    ? (rawFormMethod.toUpperCase() as V7_FormMethod)
+    : (rawFormMethod.toLowerCase() as FormMethod);
+  let formAction = stripHashFromPath(path);
+
+  if (opts.body !== undefined) {
+    if (opts.formEncType === "text/plain") {
+      // text only support POST/PUT/PATCH/DELETE submissions
+      if (!isMutationMethod(formMethod)) {
+        return getInvalidBodyError();
+      }
+
+      let text =
+        typeof opts.body === "string"
+          ? opts.body
+          : opts.body instanceof FormData ||
+            opts.body instanceof URLSearchParams
+          ? // https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#plain-text-form-data
+            Array.from(opts.body.entries()).reduce(
+              (acc, [name, value]) => `${acc}${name}=${value}\n`,
+              ""
+            )
+          : String(opts.body);
+
+      return {
+        path,
+        submission: {
+          formMethod,
+          formAction,
+          formEncType: opts.formEncType,
+          formData: undefined,
+          json: undefined,
+          text,
+        },
+      };
+    } else if (opts.formEncType === "application/json") {
+      // json only supports POST/PUT/PATCH/DELETE submissions
+      if (!isMutationMethod(formMethod)) {
+        return getInvalidBodyError();
+      }
+
+      try {
+        let json =
+          typeof opts.body === "string" ? JSON.parse(opts.body) : opts.body;
+
+        return {
+          path,
+          submission: {
+            formMethod,
+            formAction,
+            formEncType: opts.formEncType,
+            formData: undefined,
+            json,
+            text: undefined,
+          },
+        };
+      } catch (e) {
+        return getInvalidBodyError();
+      }
+    }
+  }
+
+  invariant(
+    typeof FormData === "function",
+    "FormData is not available in this environment"
+  );
+
+  let searchParams: URLSearchParams;
+  let formData: FormData;
+
+  if (opts.formData) {
+    searchParams = convertFormDataToSearchParams(opts.formData);
+    formData = opts.formData;
+  } else if (opts.body instanceof FormData) {
+    searchParams = convertFormDataToSearchParams(opts.body);
+    formData = opts.body;
+  } else if (opts.body instanceof URLSearchParams) {
+    searchParams = opts.body;
+    formData = convertSearchParamsToFormData(searchParams);
+  } else if (opts.body == null) {
+    searchParams = new URLSearchParams();
+    formData = new FormData();
+  } else {
+    try {
+      searchParams = new URLSearchParams(opts.body);
+      formData = convertSearchParamsToFormData(searchParams);
+    } catch (e) {
+      return getInvalidBodyError();
+    }
+  }
+
+  let submission: Submission = {
+    formMethod,
+    formAction,
+    formEncType:
+      (opts && opts.formEncType) || "application/x-www-form-urlencoded",
+    formData,
+    json: undefined,
+    text: undefined,
+  };
+
+  if (isMutationMethod(submission.formMethod)) {
+    return { path, submission };
+  }
+
+  // Flatten submission onto URLSearchParams for GET submissions
+  let parsedPath = parsePath(path);
+  // On GET navigation submissions we can drop the ?index param from the
+  // resulting location since all loaders will run.  But fetcher GET submissions
+  // only run a single loader so we need to preserve any incoming ?index params
+  if (isFetcher && parsedPath.search && hasNakedIndexQuery(parsedPath.search)) {
+    searchParams.append("index", "");
+  }
+  parsedPath.search = `?${searchParams}`;
+
+  return { path: createPath(parsedPath), submission };
+}
+
+// Filter out all routes below any caught error as they aren't going to
+// render so we don't need to load them
+function getLoaderMatchesUntilBoundary(
+  matches: AgnosticDataRouteMatch[],
+  boundaryId: string
+) {
+  let boundaryMatches = matches;
+  if (boundaryId) {
+    let index = matches.findIndex((m) => m.route.id === boundaryId);
+    if (index >= 0) {
+      boundaryMatches = matches.slice(0, index);
+    }
+  }
+  return boundaryMatches;
+}
+
+function getMatchesToLoad(
+  history: History,
+  state: RouterState,
+  matches: AgnosticDataRouteMatch[],
+  submission: Submission | undefined,
+  location: Location,
+  isInitialLoad: boolean,
+  skipActionErrorRevalidation: boolean,
+  isRevalidationRequired: boolean,
+  cancelledDeferredRoutes: string[],
+  cancelledFetcherLoads: string[],
+  deletedFetchers: Set<string>,
+  fetchLoadMatches: Map<string, FetchLoadMatch>,
+  fetchRedirectIds: Set<string>,
+  routesToUse: AgnosticDataRouteObject[],
+  basename: string | undefined,
+  pendingActionResult?: PendingActionResult
+): [AgnosticDataRouteMatch[], RevalidatingFetcher[]] {
+  let actionResult = pendingActionResult
+    ? isErrorResult(pendingActionResult[1])
+      ? pendingActionResult[1].error
+      : pendingActionResult[1].data
+    : undefined;
+  let currentUrl = history.createURL(state.location);
+  let nextUrl = history.createURL(location);
+
+  // Pick navigation matches that are net-new or qualify for revalidation
+  let boundaryId =
+    pendingActionResult && isErrorResult(pendingActionResult[1])
+      ? pendingActionResult[0]
+      : undefined;
+  let boundaryMatches = boundaryId
+    ? getLoaderMatchesUntilBoundary(matches, boundaryId)
+    : matches;
+
+  // Don't revalidate loaders by default after action 4xx/5xx responses
+  // when the flag is enabled.  They can still opt-into revalidation via
+  // `shouldRevalidate` via `actionResult`
+  let actionStatus = pendingActionResult
+    ? pendingActionResult[1].statusCode
+    : undefined;
+  let shouldSkipRevalidation =
+    skipActionErrorRevalidation && actionStatus && actionStatus >= 400;
+
+  let navigationMatches = boundaryMatches.filter((match, index) => {
+    let { route } = match;
+    if (route.lazy) {
+      // We haven't loaded this route yet so we don't know if it's got a loader!
+      return true;
+    }
+
+    if (route.loader == null) {
+      return false;
+    }
+
+    if (isInitialLoad) {
+      if (typeof route.loader !== "function" || route.loader.hydrate) {
+        return true;
+      }
+      return (
+        state.loaderData[route.id] === undefined &&
+        // Don't re-run if the loader ran and threw an error
+        (!state.errors || state.errors[route.id] === undefined)
+      );
+    }
+
+    // Always call the loader on new route instances and pending defer cancellations
+    if (
+      isNewLoader(state.loaderData, state.matches[index], match) ||
+      cancelledDeferredRoutes.some((id) => id === match.route.id)
+    ) {
+      return true;
+    }
+
+    // This is the default implementation for when we revalidate.  If the route
+    // provides it's own implementation, then we give them full control but
+    // provide this value so they can leverage it if needed after they check
+    // their own specific use cases
+    let currentRouteMatch = state.matches[index];
+    let nextRouteMatch = match;
+
+    return shouldRevalidateLoader(match, {
+      currentUrl,
+      currentParams: currentRouteMatch.params,
+      nextUrl,
+      nextParams: nextRouteMatch.params,
+      ...submission,
+      actionResult,
+      unstable_actionStatus: actionStatus,
+      defaultShouldRevalidate: shouldSkipRevalidation
+        ? false
+        : // Forced revalidation due to submission, useRevalidator, or X-Remix-Revalidate
+          isRevalidationRequired ||
+          currentUrl.pathname + currentUrl.search ===
+            nextUrl.pathname + nextUrl.search ||
+          // Search params affect all loaders
+          currentUrl.search !== nextUrl.search ||
+          isNewRouteInstance(currentRouteMatch, nextRouteMatch),
+    });
+  });
+
+  // Pick fetcher.loads that need to be revalidated
+  let revalidatingFetchers: RevalidatingFetcher[] = [];
+  fetchLoadMatches.forEach((f, key) => {
+    // Don't revalidate:
+    //  - on initial load (shouldn't be any fetchers then anyway)
+    //  - if fetcher won't be present in the subsequent render
+    //    - no longer matches the URL (v7_fetcherPersist=false)
+    //    - was unmounted but persisted due to v7_fetcherPersist=true
+    if (
+      isInitialLoad ||
+      !matches.some((m) => m.route.id === f.routeId) ||
+      deletedFetchers.has(key)
+    ) {
+      return;
+    }
+
+    let fetcherMatches = matchRoutes(routesToUse, f.path, basename);
+
+    // If the fetcher path no longer matches, push it in with null matches so
+    // we can trigger a 404 in callLoadersAndMaybeResolveData.  Note this is
+    // currently only a use-case for Remix HMR where the route tree can change
+    // at runtime and remove a route previously loaded via a fetcher
+    if (!fetcherMatches) {
+      revalidatingFetchers.push({
+        key,
+        routeId: f.routeId,
+        path: f.path,
+        matches: null,
+        match: null,
+        controller: null,
+      });
+      return;
+    }
+
+    // Revalidating fetchers are decoupled from the route matches since they
+    // load from a static href.  They revalidate based on explicit revalidation
+    // (submission, useRevalidator, or X-Remix-Revalidate)
+    let fetcher = state.fetchers.get(key);
+    let fetcherMatch = getTargetMatch(fetcherMatches, f.path);
+
+    let shouldRevalidate = false;
+    if (fetchRedirectIds.has(key)) {
+      // Never trigger a revalidation of an actively redirecting fetcher
+      shouldRevalidate = false;
+    } else if (cancelledFetcherLoads.includes(key)) {
+      // Always revalidate if the fetcher was cancelled
+      shouldRevalidate = true;
+    } else if (
+      fetcher &&
+      fetcher.state !== "idle" &&
+      fetcher.data === undefined
+    ) {
+      // If the fetcher hasn't ever completed loading yet, then this isn't a
+      // revalidation, it would just be a brand new load if an explicit
+      // revalidation is required
+      shouldRevalidate = isRevalidationRequired;
+    } else {
+      // Otherwise fall back on any user-defined shouldRevalidate, defaulting
+      // to explicit revalidations only
+      shouldRevalidate = shouldRevalidateLoader(fetcherMatch, {
+        currentUrl,
+        currentParams: state.matches[state.matches.length - 1].params,
+        nextUrl,
+        nextParams: matches[matches.length - 1].params,
+        ...submission,
+        actionResult,
+        unstable_actionStatus: actionStatus,
+        defaultShouldRevalidate: shouldSkipRevalidation
+          ? false
+          : isRevalidationRequired,
+      });
+    }
+
+    if (shouldRevalidate) {
+      revalidatingFetchers.push({
+        key,
+        routeId: f.routeId,
+        path: f.path,
+        matches: fetcherMatches,
+        match: fetcherMatch,
+        controller: new AbortController(),
+      });
+    }
+  });
+
+  return [navigationMatches, revalidatingFetchers];
+}
+
+function isNewLoader(
+  currentLoaderData: RouteData,
+  currentMatch: AgnosticDataRouteMatch,
+  match: AgnosticDataRouteMatch
+) {
+  let isNew =
+    // [a] -> [a, b]
+    !currentMatch ||
+    // [a, b] -> [a, c]
+    match.route.id !== currentMatch.route.id;
+
+  // Handle the case that we don't have data for a re-used route, potentially
+  // from a prior error or from a cancelled pending deferred
+  let isMissingData = currentLoaderData[match.route.id] === undefined;
+
+  // Always load if this is a net-new route or we don't yet have data
+  return isNew || isMissingData;
+}
+
+function isNewRouteInstance(
+  currentMatch: AgnosticDataRouteMatch,
+  match: AgnosticDataRouteMatch
+) {
+  let currentPath = currentMatch.route.path;
+  return (
+    // param change for this match, /users/123 -> /users/456
+    currentMatch.pathname !== match.pathname ||
+    // splat param changed, which is not present in match.path
+    // e.g. /files/images/avatar.jpg -> files/finances.xls
+    (currentPath != null &&
+      currentPath.endsWith("*") &&
+      currentMatch.params["*"] !== match.params["*"])
+  );
+}
+
+function shouldRevalidateLoader(
+  loaderMatch: AgnosticDataRouteMatch,
+  arg: ShouldRevalidateFunctionArgs
+) {
+  if (loaderMatch.route.shouldRevalidate) {
+    let routeChoice = loaderMatch.route.shouldRevalidate(arg);
+    if (typeof routeChoice === "boolean") {
+      return routeChoice;
+    }
+  }
+
+  return arg.defaultShouldRevalidate;
+}
+
+/**
+ * Execute route.lazy() methods to lazily load route modules (loader, action,
+ * shouldRevalidate) and update the routeManifest in place which shares objects
+ * with dataRoutes so those get updated as well.
+ */
+async function loadLazyRouteModule(
+  route: AgnosticDataRouteObject,
+  mapRouteProperties: MapRoutePropertiesFunction,
+  manifest: RouteManifest
+) {
+  if (!route.lazy) {
+    return;
+  }
+
+  let lazyRoute = await route.lazy();
+
+  // If the lazy route function was executed and removed by another parallel
+  // call then we can return - first lazy() to finish wins because the return
+  // value of lazy is expected to be static
+  if (!route.lazy) {
+    return;
+  }
+
+  let routeToUpdate = manifest[route.id];
+  invariant(routeToUpdate, "No route found in manifest");
+
+  // Update the route in place.  This should be safe because there's no way
+  // we could yet be sitting on this route as we can't get there without
+  // resolving lazy() first.
+  //
+  // This is different than the HMR "update" use-case where we may actively be
+  // on the route being updated.  The main concern boils down to "does this
+  // mutation affect any ongoing navigations or any current state.matches
+  // values?".  If not, it should be safe to update in place.
+  let routeUpdates: Record<string, any> = {};
+  for (let lazyRouteProperty in lazyRoute) {
+    let staticRouteValue =
+      routeToUpdate[lazyRouteProperty as keyof typeof routeToUpdate];
+
+    let isPropertyStaticallyDefined =
+      staticRouteValue !== undefined &&
+      // This property isn't static since it should always be updated based
+      // on the route updates
+      lazyRouteProperty !== "hasErrorBoundary";
+
+    warning(
+      !isPropertyStaticallyDefined,
+      `Route "${routeToUpdate.id}" has a static property "${lazyRouteProperty}" ` +
+        `defined but its lazy function is also returning a value for this property. ` +
+        `The lazy route property "${lazyRouteProperty}" will be ignored.`
+    );
+
+    if (
+      !isPropertyStaticallyDefined &&
+      !immutableRouteKeys.has(lazyRouteProperty as ImmutableRouteKey)
+    ) {
+      routeUpdates[lazyRouteProperty] =
+        lazyRoute[lazyRouteProperty as keyof typeof lazyRoute];
+    }
+  }
+
+  // Mutate the route with the provided updates.  Do this first so we pass
+  // the updated version to mapRouteProperties
+  Object.assign(routeToUpdate, routeUpdates);
+
+  // Mutate the `hasErrorBoundary` property on the route based on the route
+  // updates and remove the `lazy` function so we don't resolve the lazy
+  // route again.
+  Object.assign(routeToUpdate, {
+    // To keep things framework agnostic, we use the provided
+    // `mapRouteProperties` (or wrapped `detectErrorBoundary`) function to
+    // set the framework-aware properties (`element`/`hasErrorBoundary`) since
+    // the logic will differ between frameworks.
+    ...mapRouteProperties(routeToUpdate),
+    lazy: undefined,
+  });
+}
+
+// Default implementation of `dataStrategy` which fetches all loaders in parallel
+function defaultDataStrategy(
+  opts: DataStrategyFunctionArgs
+): ReturnType<DataStrategyFunction> {
+  return Promise.all(opts.matches.map((m) => m.resolve()));
+}
+
+async function callDataStrategyImpl(
+  dataStrategyImpl: DataStrategyFunction,
+  type: "loader" | "action",
+  request: Request,
+  matchesToLoad: AgnosticDataRouteMatch[],
+  matches: AgnosticDataRouteMatch[],
+  manifest: RouteManifest,
+  mapRouteProperties: MapRoutePropertiesFunction,
+  requestContext?: unknown
+): Promise<HandlerResult[]> {
+  let routeIdsToLoad = matchesToLoad.reduce(
+    (acc, m) => acc.add(m.route.id),
+    new Set<string>()
+  );
+  let loadedMatches = new Set<string>();
+
+  // Send all matches here to allow for a middleware-type implementation.
+  // handler will be a no-op for unneeded routes and we filter those results
+  // back out below.
+  let results = await dataStrategyImpl({
+    matches: matches.map((match) => {
+      let shouldLoad = routeIdsToLoad.has(match.route.id);
+      // `resolve` encapsulates the route.lazy, executing the
+      // loader/action, and mapping return values/thrown errors to a
+      // HandlerResult.  Users can pass a callback to take fine-grained control
+      // over the execution of the loader/action
+      let resolve: DataStrategyMatch["resolve"] = (handlerOverride) => {
+        loadedMatches.add(match.route.id);
+        return shouldLoad
+          ? callLoaderOrAction(
+              type,
+              request,
+              match,
+              manifest,
+              mapRouteProperties,
+              handlerOverride,
+              requestContext
+            )
+          : Promise.resolve({ type: ResultType.data, result: undefined });
+      };
+
+      return {
+        ...match,
+        shouldLoad,
+        resolve,
+      };
+    }),
+    request,
+    params: matches[0].params,
+    context: requestContext,
+  });
+
+  // Throw if any loadRoute implementations not called since they are what
+  // ensures a route is fully loaded
+  matches.forEach((m) =>
+    invariant(
+      loadedMatches.has(m.route.id),
+      `\`match.resolve()\` was not called for route id "${m.route.id}". ` +
+        "You must call `match.resolve()` on every match passed to " +
+        "`dataStrategy` to ensure all routes are properly loaded."
+    )
+  );
+
+  // Filter out any middleware-only matches for which we didn't need to run handlers
+  return results.filter((_, i) => routeIdsToLoad.has(matches[i].route.id));
+}
+
+// Default logic for calling a loader/action is the user has no specified a dataStrategy
+async function callLoaderOrAction(
+  type: "loader" | "action",
+  request: Request,
+  match: AgnosticDataRouteMatch,
+  manifest: RouteManifest,
+  mapRouteProperties: MapRoutePropertiesFunction,
+  handlerOverride: Parameters<DataStrategyMatch["resolve"]>[0],
+  staticContext?: unknown
+): Promise<HandlerResult> {
+  let result: HandlerResult;
+  let onReject: (() => void) | undefined;
+
+  let runHandler = (
+    handler: AgnosticRouteObject["loader"] | AgnosticRouteObject["action"]
+  ): Promise<HandlerResult> => {
+    // Setup a promise we can race against so that abort signals short circuit
+    let reject: () => void;
+    // This will never resolve so safe to type it as Promise<HandlerResult> to
+    // satisfy the function return value
+    let abortPromise = new Promise<HandlerResult>((_, r) => (reject = r));
+    onReject = () => reject();
+    request.signal.addEventListener("abort", onReject);
+
+    let actualHandler = (ctx?: unknown) => {
+      if (typeof handler !== "function") {
+        return Promise.reject(
+          new Error(
+            `You cannot call the handler for a route which defines a boolean ` +
+              `"${type}" [routeId: ${match.route.id}]`
+          )
+        );
+      }
+      return handler(
+        {
+          request,
+          params: match.params,
+          context: staticContext,
+        },
+        ...(ctx !== undefined ? [ctx] : [])
+      );
+    };
+
+    let handlerPromise: Promise<HandlerResult>;
+    if (handlerOverride) {
+      handlerPromise = handlerOverride((ctx: unknown) => actualHandler(ctx));
+    } else {
+      handlerPromise = (async () => {
+        try {
+          let val = await actualHandler();
+          return { type: "data", result: val };
+        } catch (e) {
+          return { type: "error", result: e };
+        }
+      })();
+    }
+
+    return Promise.race([handlerPromise, abortPromise]);
+  };
+
+  try {
+    let handler = match.route[type];
+
+    if (match.route.lazy) {
+      if (handler) {
+        // Run statically defined handler in parallel with lazy()
+        let handlerError;
+        let [value] = await Promise.all([
+          // If the handler throws, don't let it immediately bubble out,
+          // since we need to let the lazy() execution finish so we know if this
+          // route has a boundary that can handle the error
+          runHandler(handler).catch((e) => {
+            handlerError = e;
+          }),
+          loadLazyRouteModule(match.route, mapRouteProperties, manifest),
+        ]);
+        if (handlerError !== undefined) {
+          throw handlerError;
+        }
+        result = value!;
+      } else {
+        // Load lazy route module, then run any returned handler
+        await loadLazyRouteModule(match.route, mapRouteProperties, manifest);
+
+        handler = match.route[type];
+        if (handler) {
+          // Handler still runs even if we got interrupted to maintain consistency
+          // with un-abortable behavior of handler execution on non-lazy or
+          // previously-lazy-loaded routes
+          result = await runHandler(handler);
+        } else if (type === "action") {
+          let url = new URL(request.url);
+          let pathname = url.pathname + url.search;
+          throw getInternalRouterError(405, {
+            method: request.method,
+            pathname,
+            routeId: match.route.id,
+          });
+        } else {
+          // lazy() route has no loader to run.  Short circuit here so we don't
+          // hit the invariant below that errors on returning undefined.
+          return { type: ResultType.data, result: undefined };
+        }
+      }
+    } else if (!handler) {
+      let url = new URL(request.url);
+      let pathname = url.pathname + url.search;
+      throw getInternalRouterError(404, {
+        pathname,
+      });
+    } else {
+      result = await runHandler(handler);
+    }
+
+    invariant(
+      result.result !== undefined,
+      `You defined ${type === "action" ? "an action" : "a loader"} for route ` +
+        `"${match.route.id}" but didn't return anything from your \`${type}\` ` +
+        `function. Please return a value or \`null\`.`
+    );
+  } catch (e) {
+    // We should already be catching and converting normal handler executions to
+    // HandlerResults and returning them, so anything that throws here is an
+    // unexpected error we still need to wrap
+    return { type: ResultType.error, result: e };
+  } finally {
+    if (onReject) {
+      request.signal.removeEventListener("abort", onReject);
+    }
+  }
+
+  return result;
+}
+
+async function convertHandlerResultToDataResult(
+  handlerResult: HandlerResult
+): Promise<DataResult> {
+  let { result, type, status } = handlerResult;
+
+  if (isResponse(result)) {
+    let data: any;
+
+    try {
+      let contentType = result.headers.get("Content-Type");
+      // Check between word boundaries instead of startsWith() due to the last
+      // paragraph of https://httpwg.org/specs/rfc9110.html#field.content-type
+      if (contentType && /\bapplication\/json\b/.test(contentType)) {
+        if (result.body == null) {
+          data = null;
+        } else {
+          data = await result.json();
+        }
+      } else {
+        data = await result.text();
+      }
+    } catch (e) {
+      return { type: ResultType.error, error: e };
+    }
+
+    if (type === ResultType.error) {
+      return {
+        type: ResultType.error,
+        error: new ErrorResponseImpl(result.status, result.statusText, data),
+        statusCode: result.status,
+        headers: result.headers,
+      };
+    }
+
+    return {
+      type: ResultType.data,
+      data,
+      statusCode: result.status,
+      headers: result.headers,
+    };
+  }
+
+  if (type === ResultType.error) {
+    return {
+      type: ResultType.error,
+      error: result,
+      statusCode: isRouteErrorResponse(result) ? result.status : status,
+    };
+  }
+
+  if (isDeferredData(result)) {
+    return {
+      type: ResultType.deferred,
+      deferredData: result,
+      statusCode: result.init?.status,
+      headers: result.init?.headers && new Headers(result.init.headers),
+    };
+  }
+
+  return { type: ResultType.data, data: result, statusCode: status };
+}
+
+// Support relative routing in internal redirects
+function normalizeRelativeRoutingRedirectResponse(
+  response: Response,
+  request: Request,
+  routeId: string,
+  matches: AgnosticDataRouteMatch[],
+  basename: string,
+  v7_relativeSplatPath: boolean
+) {
+  let location = response.headers.get("Location");
+  invariant(
+    location,
+    "Redirects returned/thrown from loaders/actions must have a Location header"
+  );
+
+  if (!ABSOLUTE_URL_REGEX.test(location)) {
+    let trimmedMatches = matches.slice(
+      0,
+      matches.findIndex((m) => m.route.id === routeId) + 1
+    );
+    location = normalizeTo(
+      new URL(request.url),
+      trimmedMatches,
+      basename,
+      true,
+      location,
+      v7_relativeSplatPath
+    );
+    response.headers.set("Location", location);
+  }
+
+  return response;
+}
+
+function normalizeRedirectLocation(
+  location: string,
+  currentUrl: URL,
+  basename: string
+): string {
+  if (ABSOLUTE_URL_REGEX.test(location)) {
+    // Strip off the protocol+origin for same-origin + same-basename absolute redirects
+    let normalizedLocation = location;
+    let url = normalizedLocation.startsWith("//")
+      ? new URL(currentUrl.protocol + normalizedLocation)
+      : new URL(normalizedLocation);
+    let isSameBasename = stripBasename(url.pathname, basename) != null;
+    if (url.origin === currentUrl.origin && isSameBasename) {
+      return url.pathname + url.search + url.hash;
+    }
+  }
+  return location;
+}
+
+// Utility method for creating the Request instances for loaders/actions during
+// client-side navigations and fetches.  During SSR we will always have a
+// Request instance from the static handler (query/queryRoute)
+function createClientSideRequest(
+  history: History,
+  location: string | Location,
+  signal: AbortSignal,
+  submission?: Submission
+): Request {
+  let url = history.createURL(stripHashFromPath(location)).toString();
+  let init: RequestInit = { signal };
+
+  if (submission && isMutationMethod(submission.formMethod)) {
+    let { formMethod, formEncType } = submission;
+    // Didn't think we needed this but it turns out unlike other methods, patch
+    // won't be properly normalized to uppercase and results in a 405 error.
+    // See: https://fetch.spec.whatwg.org/#concept-method
+    init.method = formMethod.toUpperCase();
+
+    if (formEncType === "application/json") {
+      init.headers = new Headers({ "Content-Type": formEncType });
+      init.body = JSON.stringify(submission.json);
+    } else if (formEncType === "text/plain") {
+      // Content-Type is inferred (https://fetch.spec.whatwg.org/#dom-request)
+      init.body = submission.text;
+    } else if (
+      formEncType === "application/x-www-form-urlencoded" &&
+      submission.formData
+    ) {
+      // Content-Type is inferred (https://fetch.spec.whatwg.org/#dom-request)
+      init.body = convertFormDataToSearchParams(submission.formData);
+    } else {
+      // Content-Type is inferred (https://fetch.spec.whatwg.org/#dom-request)
+      init.body = submission.formData;
+    }
+  }
+
+  return new Request(url, init);
+}
+
+function convertFormDataToSearchParams(formData: FormData): URLSearchParams {
+  let searchParams = new URLSearchParams();
+
+  for (let [key, value] of formData.entries()) {
+    // https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#converting-an-entry-list-to-a-list-of-name-value-pairs
+    searchParams.append(key, typeof value === "string" ? value : value.name);
+  }
+
+  return searchParams;
+}
+
+function convertSearchParamsToFormData(
+  searchParams: URLSearchParams
+): FormData {
+  let formData = new FormData();
+  for (let [key, value] of searchParams.entries()) {
+    formData.append(key, value);
+  }
+  return formData;
+}
+
+function processRouteLoaderData(
+  matches: AgnosticDataRouteMatch[],
+  matchesToLoad: AgnosticDataRouteMatch[],
+  results: DataResult[],
+  pendingActionResult: PendingActionResult | undefined,
+  activeDeferreds: Map<string, DeferredData>,
+  skipLoaderErrorBubbling: boolean
+): {
+  loaderData: RouterState["loaderData"];
+  errors: RouterState["errors"] | null;
+  statusCode: number;
+  loaderHeaders: Record<string, Headers>;
+} {
+  // Fill in loaderData/errors from our loaders
+  let loaderData: RouterState["loaderData"] = {};
+  let errors: RouterState["errors"] | null = null;
+  let statusCode: number | undefined;
+  let foundError = false;
+  let loaderHeaders: Record<string, Headers> = {};
+  let pendingError =
+    pendingActionResult && isErrorResult(pendingActionResult[1])
+      ? pendingActionResult[1].error
+      : undefined;
+
+  // Process loader results into state.loaderData/state.errors
+  results.forEach((result, index) => {
+    let id = matchesToLoad[index].route.id;
+    invariant(
+      !isRedirectResult(result),
+      "Cannot handle redirect results in processLoaderData"
+    );
+    if (isErrorResult(result)) {
+      let error = result.error;
+      // If we have a pending action error, we report it at the highest-route
+      // that throws a loader error, and then clear it out to indicate that
+      // it was consumed
+      if (pendingError !== undefined) {
+        error = pendingError;
+        pendingError = undefined;
+      }
+
+      errors = errors || {};
+
+      if (skipLoaderErrorBubbling) {
+        errors[id] = error;
+      } else {
+        // Look upwards from the matched route for the closest ancestor error
+        // boundary, defaulting to the root match.  Prefer higher error values
+        // if lower errors bubble to the same boundary
+        let boundaryMatch = findNearestBoundary(matches, id);
+        if (errors[boundaryMatch.route.id] == null) {
+          errors[boundaryMatch.route.id] = error;
+        }
+      }
+
+      // Clear our any prior loaderData for the throwing route
+      loaderData[id] = undefined;
+
+      // Once we find our first (highest) error, we set the status code and
+      // prevent deeper status codes from overriding
+      if (!foundError) {
+        foundError = true;
+        statusCode = isRouteErrorResponse(result.error)
+          ? result.error.status
+          : 500;
+      }
+      if (result.headers) {
+        loaderHeaders[id] = result.headers;
+      }
+    } else {
+      if (isDeferredResult(result)) {
+        activeDeferreds.set(id, result.deferredData);
+        loaderData[id] = result.deferredData.data;
+        // Error status codes always override success status codes, but if all
+        // loaders are successful we take the deepest status code.
+        if (
+          result.statusCode != null &&
+          result.statusCode !== 200 &&
+          !foundError
+        ) {
+          statusCode = result.statusCode;
+        }
+        if (result.headers) {
+          loaderHeaders[id] = result.headers;
+        }
+      } else {
+        loaderData[id] = result.data;
+        // Error status codes always override success status codes, but if all
+        // loaders are successful we take the deepest status code.
+        if (result.statusCode && result.statusCode !== 200 && !foundError) {
+          statusCode = result.statusCode;
+        }
+        if (result.headers) {
+          loaderHeaders[id] = result.headers;
+        }
+      }
+    }
+  });
+
+  // If we didn't consume the pending action error (i.e., all loaders
+  // resolved), then consume it here.  Also clear out any loaderData for the
+  // throwing route
+  if (pendingError !== undefined && pendingActionResult) {
+    errors = { [pendingActionResult[0]]: pendingError };
+    loaderData[pendingActionResult[0]] = undefined;
+  }
+
+  return {
+    loaderData,
+    errors,
+    statusCode: statusCode || 200,
+    loaderHeaders,
+  };
+}
+
+function processLoaderData(
+  state: RouterState,
+  matches: AgnosticDataRouteMatch[],
+  matchesToLoad: AgnosticDataRouteMatch[],
+  results: DataResult[],
+  pendingActionResult: PendingActionResult | undefined,
+  revalidatingFetchers: RevalidatingFetcher[],
+  fetcherResults: DataResult[],
+  activeDeferreds: Map<string, DeferredData>
+): {
+  loaderData: RouterState["loaderData"];
+  errors?: RouterState["errors"];
+} {
+  let { loaderData, errors } = processRouteLoaderData(
+    matches,
+    matchesToLoad,
+    results,
+    pendingActionResult,
+    activeDeferreds,
+    false // This method is only called client side so we always want to bubble
+  );
+
+  // Process results from our revalidating fetchers
+  for (let index = 0; index < revalidatingFetchers.length; index++) {
+    let { key, match, controller } = revalidatingFetchers[index];
+    invariant(
+      fetcherResults !== undefined && fetcherResults[index] !== undefined,
+      "Did not find corresponding fetcher result"
+    );
+    let result = fetcherResults[index];
+
+    // Process fetcher non-redirect errors
+    if (controller && controller.signal.aborted) {
+      // Nothing to do for aborted fetchers
+      continue;
+    } else if (isErrorResult(result)) {
+      let boundaryMatch = findNearestBoundary(state.matches, match?.route.id);
+      if (!(errors && errors[boundaryMatch.route.id])) {
+        errors = {
+          ...errors,
+          [boundaryMatch.route.id]: result.error,
+        };
+      }
+      state.fetchers.delete(key);
+    } else if (isRedirectResult(result)) {
+      // Should never get here, redirects should get processed above, but we
+      // keep this to type narrow to a success result in the else
+      invariant(false, "Unhandled fetcher revalidation redirect");
+    } else if (isDeferredResult(result)) {
+      // Should never get here, deferred data should be awaited for fetchers
+      // in resolveDeferredResults
+      invariant(false, "Unhandled fetcher deferred data");
+    } else {
+      let doneFetcher = getDoneFetcher(result.data);
+      state.fetchers.set(key, doneFetcher);
+    }
+  }
+
+  return { loaderData, errors };
+}
+
+function mergeLoaderData(
+  loaderData: RouteData,
+  newLoaderData: RouteData,
+  matches: AgnosticDataRouteMatch[],
+  errors: RouteData | null | undefined
+): RouteData {
+  let mergedLoaderData = { ...newLoaderData };
+  for (let match of matches) {
+    let id = match.route.id;
+    if (newLoaderData.hasOwnProperty(id)) {
+      if (newLoaderData[id] !== undefined) {
+        mergedLoaderData[id] = newLoaderData[id];
+      } else {
+        // No-op - this is so we ignore existing data if we have a key in the
+        // incoming object with an undefined value, which is how we unset a prior
+        // loaderData if we encounter a loader error
+      }
+    } else if (loaderData[id] !== undefined && match.route.loader) {
+      // Preserve existing keys not included in newLoaderData and where a loader
+      // wasn't removed by HMR
+      mergedLoaderData[id] = loaderData[id];
+    }
+
+    if (errors && errors.hasOwnProperty(id)) {
+      // Don't keep any loader data below the boundary
+      break;
+    }
+  }
+  return mergedLoaderData;
+}
+
+function getActionDataForCommit(
+  pendingActionResult: PendingActionResult | undefined
+) {
+  if (!pendingActionResult) {
+    return {};
+  }
+  return isErrorResult(pendingActionResult[1])
+    ? {
+        // Clear out prior actionData on errors
+        actionData: {},
+      }
+    : {
+        actionData: {
+          [pendingActionResult[0]]: pendingActionResult[1].data,
+        },
+      };
+}
+
+// Find the nearest error boundary, looking upwards from the leaf route (or the
+// route specified by routeId) for the closest ancestor error boundary,
+// defaulting to the root match
+function findNearestBoundary(
+  matches: AgnosticDataRouteMatch[],
+  routeId?: string
+): AgnosticDataRouteMatch {
+  let eligibleMatches = routeId
+    ? matches.slice(0, matches.findIndex((m) => m.route.id === routeId) + 1)
+    : [...matches];
+  return (
+    eligibleMatches.reverse().find((m) => m.route.hasErrorBoundary === true) ||
+    matches[0]
+  );
+}
+
+function getShortCircuitMatches(routes: AgnosticDataRouteObject[]): {
+  matches: AgnosticDataRouteMatch[];
+  route: AgnosticDataRouteObject;
+} {
+  // Prefer a root layout route if present, otherwise shim in a route object
+  let route =
+    routes.length === 1
+      ? routes[0]
+      : routes.find((r) => r.index || !r.path || r.path === "/") || {
+          id: `__shim-error-route__`,
+        };
+
+  return {
+    matches: [
+      {
+        params: {},
+        pathname: "",
+        pathnameBase: "",
+        route,
+      },
+    ],
+    route,
+  };
+}
+
+function getInternalRouterError(
+  status: number,
+  {
+    pathname,
+    routeId,
+    method,
+    type,
+  }: {
+    pathname?: string;
+    routeId?: string;
+    method?: string;
+    type?: "defer-action" | "invalid-body";
+  } = {}
+) {
+  let statusText = "Unknown Server Error";
+  let errorMessage = "Unknown @remix-run/router error";
+
+  if (status === 400) {
+    statusText = "Bad Request";
+    if (method && pathname && routeId) {
+      errorMessage =
+        `You made a ${method} request to "${pathname}" but ` +
+        `did not provide a \`loader\` for route "${routeId}", ` +
+        `so there is no way to handle the request.`;
+    } else if (type === "defer-action") {
+      errorMessage = "defer() is not supported in actions";
+    } else if (type === "invalid-body") {
+      errorMessage = "Unable to encode submission body";
+    }
+  } else if (status === 403) {
+    statusText = "Forbidden";
+    errorMessage = `Route "${routeId}" does not match URL "${pathname}"`;
+  } else if (status === 404) {
+    statusText = "Not Found";
+    errorMessage = `No route matches URL "${pathname}"`;
+  } else if (status === 405) {
+    statusText = "Method Not Allowed";
+    if (method && pathname && routeId) {
+      errorMessage =
+        `You made a ${method.toUpperCase()} request to "${pathname}" but ` +
+        `did not provide an \`action\` for route "${routeId}", ` +
+        `so there is no way to handle the request.`;
+    } else if (method) {
+      errorMessage = `Invalid request method "${method.toUpperCase()}"`;
+    }
+  }
+
+  return new ErrorResponseImpl(
+    status || 500,
+    statusText,
+    new Error(errorMessage),
+    true
+  );
+}
+
+// Find any returned redirect errors, starting from the lowest match
+function findRedirect(
+  results: DataResult[]
+): { result: RedirectResult; idx: number } | undefined {
+  for (let i = results.length - 1; i >= 0; i--) {
+    let result = results[i];
+    if (isRedirectResult(result)) {
+      return { result, idx: i };
+    }
+  }
+}
+
+function stripHashFromPath(path: To) {
+  let parsedPath = typeof path === "string" ? parsePath(path) : path;
+  return createPath({ ...parsedPath, hash: "" });
+}
+
+function isHashChangeOnly(a: Location, b: Location): boolean {
+  if (a.pathname !== b.pathname || a.search !== b.search) {
+    return false;
+  }
+
+  if (a.hash === "") {
+    // /page -> /page#hash
+    return b.hash !== "";
+  } else if (a.hash === b.hash) {
+    // /page#hash -> /page#hash
+    return true;
+  } else if (b.hash !== "") {
+    // /page#hash -> /page#other
+    return true;
+  }
+
+  // If the hash is removed the browser will re-perform a request to the server
+  // /page#hash -> /page
+  return false;
+}
+
+function isHandlerResult(result: unknown): result is HandlerResult {
+  return (
+    result != null &&
+    typeof result === "object" &&
+    "type" in result &&
+    "result" in result &&
+    (result.type === ResultType.data || result.type === ResultType.error)
+  );
+}
+
+function isRedirectHandlerResult(result: HandlerResult) {
+  return (
+    isResponse(result.result) && redirectStatusCodes.has(result.result.status)
+  );
+}
+
+function isDeferredResult(result: DataResult): result is DeferredResult {
+  return result.type === ResultType.deferred;
+}
+
+function isErrorResult(result: DataResult): result is ErrorResult {
+  return result.type === ResultType.error;
+}
+
+function isRedirectResult(result?: DataResult): result is RedirectResult {
+  return (result && result.type) === ResultType.redirect;
+}
+
+export function isDeferredData(value: any): value is DeferredData {
+  let deferred: DeferredData = value;
+  return (
+    deferred &&
+    typeof deferred === "object" &&
+    typeof deferred.data === "object" &&
+    typeof deferred.subscribe === "function" &&
+    typeof deferred.cancel === "function" &&
+    typeof deferred.resolveData === "function"
+  );
+}
+
+function isResponse(value: any): value is Response {
+  return (
+    value != null &&
+    typeof value.status === "number" &&
+    typeof value.statusText === "string" &&
+    typeof value.headers === "object" &&
+    typeof value.body !== "undefined"
+  );
+}
+
+function isRedirectResponse(result: any): result is Response {
+  if (!isResponse(result)) {
+    return false;
+  }
+
+  let status = result.status;
+  let location = result.headers.get("Location");
+  return status >= 300 && status <= 399 && location != null;
+}
+
+function isValidMethod(method: string): method is FormMethod | V7_FormMethod {
+  return validRequestMethods.has(method.toLowerCase() as FormMethod);
+}
+
+function isMutationMethod(
+  method: string
+): method is MutationFormMethod | V7_MutationFormMethod {
+  return validMutationMethods.has(method.toLowerCase() as MutationFormMethod);
+}
+
+async function resolveDeferredResults(
+  currentMatches: AgnosticDataRouteMatch[],
+  matchesToLoad: (AgnosticDataRouteMatch | null)[],
+  results: DataResult[],
+  signals: (AbortSignal | null)[],
+  isFetcher: boolean,
+  currentLoaderData?: RouteData
+) {
+  for (let index = 0; index < results.length; index++) {
+    let result = results[index];
+    let match = matchesToLoad[index];
+    // If we don't have a match, then we can have a deferred result to do
+    // anything with.  This is for revalidating fetchers where the route was
+    // removed during HMR
+    if (!match) {
+      continue;
+    }
+
+    let currentMatch = currentMatches.find(
+      (m) => m.route.id === match!.route.id
+    );
+    let isRevalidatingLoader =
+      currentMatch != null &&
+      !isNewRouteInstance(currentMatch, match) &&
+      (currentLoaderData && currentLoaderData[match.route.id]) !== undefined;
+
+    if (isDeferredResult(result) && (isFetcher || isRevalidatingLoader)) {
+      // Note: we do not have to touch activeDeferreds here since we race them
+      // against the signal in resolveDeferredData and they'll get aborted
+      // there if needed
+      let signal = signals[index];
+      invariant(
+        signal,
+        "Expected an AbortSignal for revalidating fetcher deferred result"
+      );
+      await resolveDeferredData(result, signal, isFetcher).then((result) => {
+        if (result) {
+          results[index] = result || results[index];
+        }
+      });
+    }
+  }
+}
+
+async function resolveDeferredData(
+  result: DeferredResult,
+  signal: AbortSignal,
+  unwrap = false
+): Promise<SuccessResult | ErrorResult | undefined> {
+  let aborted = await result.deferredData.resolveData(signal);
+  if (aborted) {
+    return;
+  }
+
+  if (unwrap) {
+    try {
+      return {
+        type: ResultType.data,
+        data: result.deferredData.unwrappedData,
+      };
+    } catch (e) {
+      // Handle any TrackedPromise._error values encountered while unwrapping
+      return {
+        type: ResultType.error,
+        error: e,
+      };
+    }
+  }
+
+  return {
+    type: ResultType.data,
+    data: result.deferredData.data,
+  };
+}
+
+function hasNakedIndexQuery(search: string): boolean {
+  return new URLSearchParams(search).getAll("index").some((v) => v === "");
+}
+
+function getTargetMatch(
+  matches: AgnosticDataRouteMatch[],
+  location: Location | string
+) {
+  let search =
+    typeof location === "string" ? parsePath(location).search : location.search;
+  if (
+    matches[matches.length - 1].route.index &&
+    hasNakedIndexQuery(search || "")
+  ) {
+    // Return the leaf index route when index is present
+    return matches[matches.length - 1];
+  }
+  // Otherwise grab the deepest "path contributing" match (ignoring index and
+  // pathless layout routes)
+  let pathMatches = getPathContributingMatches(matches);
+  return pathMatches[pathMatches.length - 1];
+}
+
+function getSubmissionFromNavigation(
+  navigation: Navigation
+): Submission | undefined {
+  let { formMethod, formAction, formEncType, text, formData, json } =
+    navigation;
+  if (!formMethod || !formAction || !formEncType) {
+    return;
+  }
+
+  if (text != null) {
+    return {
+      formMethod,
+      formAction,
+      formEncType,
+      formData: undefined,
+      json: undefined,
+      text,
+    };
+  } else if (formData != null) {
+    return {
+      formMethod,
+      formAction,
+      formEncType,
+      formData,
+      json: undefined,
+      text: undefined,
+    };
+  } else if (json !== undefined) {
+    return {
+      formMethod,
+      formAction,
+      formEncType,
+      formData: undefined,
+      json,
+      text: undefined,
+    };
+  }
+}
+
+function getLoadingNavigation(
+  location: Location,
+  submission?: Submission
+): NavigationStates["Loading"] {
+  if (submission) {
+    let navigation: NavigationStates["Loading"] = {
+      state: "loading",
+      location,
+      formMethod: submission.formMethod,
+      formAction: submission.formAction,
+      formEncType: submission.formEncType,
+      formData: submission.formData,
+      json: submission.json,
+      text: submission.text,
+    };
+    return navigation;
+  } else {
+    let navigation: NavigationStates["Loading"] = {
+      state: "loading",
+      location,
+      formMethod: undefined,
+      formAction: undefined,
+      formEncType: undefined,
+      formData: undefined,
+      json: undefined,
+      text: undefined,
+    };
+    return navigation;
+  }
+}
+
+function getSubmittingNavigation(
+  location: Location,
+  submission: Submission
+): NavigationStates["Submitting"] {
+  let navigation: NavigationStates["Submitting"] = {
+    state: "submitting",
+    location,
+    formMethod: submission.formMethod,
+    formAction: submission.formAction,
+    formEncType: submission.formEncType,
+    formData: submission.formData,
+    json: submission.json,
+    text: submission.text,
+  };
+  return navigation;
+}
+
+function getLoadingFetcher(
+  submission?: Submission,
+  data?: Fetcher["data"]
+): FetcherStates["Loading"] {
+  if (submission) {
+    let fetcher: FetcherStates["Loading"] = {
+      state: "loading",
+      formMethod: submission.formMethod,
+      formAction: submission.formAction,
+      formEncType: submission.formEncType,
+      formData: submission.formData,
+      json: submission.json,
+      text: submission.text,
+      data,
+    };
+    return fetcher;
+  } else {
+    let fetcher: FetcherStates["Loading"] = {
+      state: "loading",
+      formMethod: undefined,
+      formAction: undefined,
+      formEncType: undefined,
+      formData: undefined,
+      json: undefined,
+      text: undefined,
+      data,
+    };
+    return fetcher;
+  }
+}
+
+function getSubmittingFetcher(
+  submission: Submission,
+  existingFetcher?: Fetcher
+): FetcherStates["Submitting"] {
+  let fetcher: FetcherStates["Submitting"] = {
+    state: "submitting",
+    formMethod: submission.formMethod,
+    formAction: submission.formAction,
+    formEncType: submission.formEncType,
+    formData: submission.formData,
+    json: submission.json,
+    text: submission.text,
+    data: existingFetcher ? existingFetcher.data : undefined,
+  };
+  return fetcher;
+}
+
+function getDoneFetcher(data: Fetcher["data"]): FetcherStates["Idle"] {
+  let fetcher: FetcherStates["Idle"] = {
+    state: "idle",
+    formMethod: undefined,
+    formAction: undefined,
+    formEncType: undefined,
+    formData: undefined,
+    json: undefined,
+    text: undefined,
+    data,
+  };
+  return fetcher;
+}
+
+function restoreAppliedTransitions(
+  _window: Window,
+  transitions: Map<string, Set<string>>
+) {
+  try {
+    let sessionPositions = _window.sessionStorage.getItem(
+      TRANSITIONS_STORAGE_KEY
+    );
+    if (sessionPositions) {
+      let json = JSON.parse(sessionPositions);
+      for (let [k, v] of Object.entries(json || {})) {
+        if (v && Array.isArray(v)) {
+          transitions.set(k, new Set(v || []));
+        }
+      }
+    }
+  } catch (e) {
+    // no-op, use default empty object
+  }
+}
+
+function persistAppliedTransitions(
+  _window: Window,
+  transitions: Map<string, Set<string>>
+) {
+  if (transitions.size > 0) {
+    let json: Record<string, string[]> = {};
+    for (let [k, v] of transitions) {
+      json[k] = [...v];
+    }
+    try {
+      _window.sessionStorage.setItem(
+        TRANSITIONS_STORAGE_KEY,
+        JSON.stringify(json)
+      );
+    } catch (error) {
+      warning(
+        false,
+        `Failed to save applied view transitions in sessionStorage (${error}).`
+      );
+    }
+  }
+}
+
+//#endregion
diff --git a/ddb_main/node_modules/@remix-run/router/utils.ts b/ddb_main/node_modules/@remix-run/router/utils.ts
new file mode 100644
index 0000000..561421e
--- /dev/null
+++ b/ddb_main/node_modules/@remix-run/router/utils.ts
@@ -0,0 +1,1630 @@
+import type { Location, Path, To } from "./history";
+import { invariant, parsePath, warning } from "./history";
+
+/**
+ * Map of routeId -> data returned from a loader/action/error
+ */
+export interface RouteData {
+  [routeId: string]: any;
+}
+
+export enum ResultType {
+  data = "data",
+  deferred = "deferred",
+  redirect = "redirect",
+  error = "error",
+}
+
+/**
+ * Successful result from a loader or action
+ */
+export interface SuccessResult {
+  type: ResultType.data;
+  data: unknown;
+  statusCode?: number;
+  headers?: Headers;
+}
+
+/**
+ * Successful defer() result from a loader or action
+ */
+export interface DeferredResult {
+  type: ResultType.deferred;
+  deferredData: DeferredData;
+  statusCode?: number;
+  headers?: Headers;
+}
+
+/**
+ * Redirect result from a loader or action
+ */
+export interface RedirectResult {
+  type: ResultType.redirect;
+  // We keep the raw Response for redirects so we can return it verbatim
+  response: Response;
+}
+
+/**
+ * Unsuccessful result from a loader or action
+ */
+export interface ErrorResult {
+  type: ResultType.error;
+  error: unknown;
+  statusCode?: number;
+  headers?: Headers;
+}
+
+/**
+ * Result from a loader or action - potentially successful or unsuccessful
+ */
+export type DataResult =
+  | SuccessResult
+  | DeferredResult
+  | RedirectResult
+  | ErrorResult;
+
+/**
+ * Result from a loader or action called via dataStrategy
+ */
+export interface HandlerResult {
+  type: "data" | "error";
+  result: unknown; // data, Error, Response, DeferredData
+  status?: number;
+}
+
+type LowerCaseFormMethod = "get" | "post" | "put" | "patch" | "delete";
+type UpperCaseFormMethod = Uppercase<LowerCaseFormMethod>;
+
+/**
+ * Users can specify either lowercase or uppercase form methods on `<Form>`,
+ * useSubmit(), `<fetcher.Form>`, etc.
+ */
+export type HTMLFormMethod = LowerCaseFormMethod | UpperCaseFormMethod;
+
+/**
+ * Active navigation/fetcher form methods are exposed in lowercase on the
+ * RouterState
+ */
+export type FormMethod = LowerCaseFormMethod;
+export type MutationFormMethod = Exclude<FormMethod, "get">;
+
+/**
+ * In v7, active navigation/fetcher form methods are exposed in uppercase on the
+ * RouterState.  This is to align with the normalization done via fetch().
+ */
+export type V7_FormMethod = UpperCaseFormMethod;
+export type V7_MutationFormMethod = Exclude<V7_FormMethod, "GET">;
+
+export type FormEncType =
+  | "application/x-www-form-urlencoded"
+  | "multipart/form-data"
+  | "application/json"
+  | "text/plain";
+
+// Thanks https://github.com/sindresorhus/type-fest!
+type JsonObject = { [Key in string]: JsonValue } & {
+  [Key in string]?: JsonValue | undefined;
+};
+type JsonArray = JsonValue[] | readonly JsonValue[];
+type JsonPrimitive = string | number | boolean | null;
+type JsonValue = JsonPrimitive | JsonObject | JsonArray;
+
+/**
+ * @private
+ * Internal interface to pass around for action submissions, not intended for
+ * external consumption
+ */
+export type Submission =
+  | {
+      formMethod: FormMethod | V7_FormMethod;
+      formAction: string;
+      formEncType: FormEncType;
+      formData: FormData;
+      json: undefined;
+      text: undefined;
+    }
+  | {
+      formMethod: FormMethod | V7_FormMethod;
+      formAction: string;
+      formEncType: FormEncType;
+      formData: undefined;
+      json: JsonValue;
+      text: undefined;
+    }
+  | {
+      formMethod: FormMethod | V7_FormMethod;
+      formAction: string;
+      formEncType: FormEncType;
+      formData: undefined;
+      json: undefined;
+      text: string;
+    };
+
+/**
+ * @private
+ * Arguments passed to route loader/action functions.  Same for now but we keep
+ * this as a private implementation detail in case they diverge in the future.
+ */
+interface DataFunctionArgs<Context> {
+  request: Request;
+  params: Params;
+  context?: Context;
+}
+
+// TODO: (v7) Change the defaults from any to unknown in and remove Remix wrappers:
+//   ActionFunction, ActionFunctionArgs, LoaderFunction, LoaderFunctionArgs
+//   Also, make them a type alias instead of an interface
+
+/**
+ * Arguments passed to loader functions
+ */
+export interface LoaderFunctionArgs<Context = any>
+  extends DataFunctionArgs<Context> {}
+
+/**
+ * Arguments passed to action functions
+ */
+export interface ActionFunctionArgs<Context = any>
+  extends DataFunctionArgs<Context> {}
+
+/**
+ * Loaders and actions can return anything except `undefined` (`null` is a
+ * valid return value if there is no data to return).  Responses are preferred
+ * and will ease any future migration to Remix
+ */
+type DataFunctionValue = Response | NonNullable<unknown> | null;
+
+type DataFunctionReturnValue = Promise<DataFunctionValue> | DataFunctionValue;
+
+/**
+ * Route loader function signature
+ */
+export type LoaderFunction<Context = any> = {
+  (
+    args: LoaderFunctionArgs<Context>,
+    handlerCtx?: unknown
+  ): DataFunctionReturnValue;
+} & { hydrate?: boolean };
+
+/**
+ * Route action function signature
+ */
+export interface ActionFunction<Context = any> {
+  (
+    args: ActionFunctionArgs<Context>,
+    handlerCtx?: unknown
+  ): DataFunctionReturnValue;
+}
+
+/**
+ * Arguments passed to shouldRevalidate function
+ */
+export interface ShouldRevalidateFunctionArgs {
+  currentUrl: URL;
+  currentParams: AgnosticDataRouteMatch["params"];
+  nextUrl: URL;
+  nextParams: AgnosticDataRouteMatch["params"];
+  formMethod?: Submission["formMethod"];
+  formAction?: Submission["formAction"];
+  formEncType?: Submission["formEncType"];
+  text?: Submission["text"];
+  formData?: Submission["formData"];
+  json?: Submission["json"];
+  unstable_actionStatus?: number;
+  actionResult?: any;
+  defaultShouldRevalidate: boolean;
+}
+
+/**
+ * Route shouldRevalidate function signature.  This runs after any submission
+ * (navigation or fetcher), so we flatten the navigation/fetcher submission
+ * onto the arguments.  It shouldn't matter whether it came from a navigation
+ * or a fetcher, what really matters is the URLs and the formData since loaders
+ * have to re-run based on the data models that were potentially mutated.
+ */
+export interface ShouldRevalidateFunction {
+  (args: ShouldRevalidateFunctionArgs): boolean;
+}
+
+/**
+ * Function provided by the framework-aware layers to set `hasErrorBoundary`
+ * from the framework-aware `errorElement` prop
+ *
+ * @deprecated Use `mapRouteProperties` instead
+ */
+export interface DetectErrorBoundaryFunction {
+  (route: AgnosticRouteObject): boolean;
+}
+
+export interface DataStrategyMatch
+  extends AgnosticRouteMatch<string, AgnosticDataRouteObject> {
+  shouldLoad: boolean;
+  resolve: (
+    handlerOverride?: (
+      handler: (ctx?: unknown) => DataFunctionReturnValue
+    ) => Promise<HandlerResult>
+  ) => Promise<HandlerResult>;
+}
+
+export interface DataStrategyFunctionArgs<Context = any>
+  extends DataFunctionArgs<Context> {
+  matches: DataStrategyMatch[];
+}
+
+export interface DataStrategyFunction {
+  (args: DataStrategyFunctionArgs): Promise<HandlerResult[]>;
+}
+
+/**
+ * Function provided by the framework-aware layers to set any framework-specific
+ * properties from framework-agnostic properties
+ */
+export interface MapRoutePropertiesFunction {
+  (route: AgnosticRouteObject): {
+    hasErrorBoundary: boolean;
+  } & Record<string, any>;
+}
+
+/**
+ * Keys we cannot change from within a lazy() function. We spread all other keys
+ * onto the route. Either they're meaningful to the router, or they'll get
+ * ignored.
+ */
+export type ImmutableRouteKey =
+  | "lazy"
+  | "caseSensitive"
+  | "path"
+  | "id"
+  | "index"
+  | "children";
+
+export const immutableRouteKeys = new Set<ImmutableRouteKey>([
+  "lazy",
+  "caseSensitive",
+  "path",
+  "id",
+  "index",
+  "children",
+]);
+
+type RequireOne<T, Key = keyof T> = Exclude<
+  {
+    [K in keyof T]: K extends Key ? Omit<T, K> & Required<Pick<T, K>> : never;
+  }[keyof T],
+  undefined
+>;
+
+/**
+ * lazy() function to load a route definition, which can add non-matching
+ * related properties to a route
+ */
+export interface LazyRouteFunction<R extends AgnosticRouteObject> {
+  (): Promise<RequireOne<Omit<R, ImmutableRouteKey>>>;
+}
+
+/**
+ * Base RouteObject with common props shared by all types of routes
+ */
+type AgnosticBaseRouteObject = {
+  caseSensitive?: boolean;
+  path?: string;
+  id?: string;
+  loader?: LoaderFunction | boolean;
+  action?: ActionFunction | boolean;
+  hasErrorBoundary?: boolean;
+  shouldRevalidate?: ShouldRevalidateFunction;
+  handle?: any;
+  lazy?: LazyRouteFunction<AgnosticBaseRouteObject>;
+};
+
+/**
+ * Index routes must not have children
+ */
+export type AgnosticIndexRouteObject = AgnosticBaseRouteObject & {
+  children?: undefined;
+  index: true;
+};
+
+/**
+ * Non-index routes may have children, but cannot have index
+ */
+export type AgnosticNonIndexRouteObject = AgnosticBaseRouteObject & {
+  children?: AgnosticRouteObject[];
+  index?: false;
+};
+
+/**
+ * A route object represents a logical route, with (optionally) its child
+ * routes organized in a tree-like structure.
+ */
+export type AgnosticRouteObject =
+  | AgnosticIndexRouteObject
+  | AgnosticNonIndexRouteObject;
+
+export type AgnosticDataIndexRouteObject = AgnosticIndexRouteObject & {
+  id: string;
+};
+
+export type AgnosticDataNonIndexRouteObject = AgnosticNonIndexRouteObject & {
+  children?: AgnosticDataRouteObject[];
+  id: string;
+};
+
+/**
+ * A data route object, which is just a RouteObject with a required unique ID
+ */
+export type AgnosticDataRouteObject =
+  | AgnosticDataIndexRouteObject
+  | AgnosticDataNonIndexRouteObject;
+
+export type RouteManifest = Record<string, AgnosticDataRouteObject | undefined>;
+
+// Recursive helper for finding path parameters in the absence of wildcards
+type _PathParam<Path extends string> =
+  // split path into individual path segments
+  Path extends `${infer L}/${infer R}`
+    ? _PathParam<L> | _PathParam<R>
+    : // find params after `:`
+    Path extends `:${infer Param}`
+    ? Param extends `${infer Optional}?`
+      ? Optional
+      : Param
+    : // otherwise, there aren't any params present
+      never;
+
+/**
+ * Examples:
+ * "/a/b/*" -> "*"
+ * ":a" -> "a"
+ * "/a/:b" -> "b"
+ * "/a/blahblahblah:b" -> "b"
+ * "/:a/:b" -> "a" | "b"
+ * "/:a/b/:c/*" -> "a" | "c" | "*"
+ */
+export type PathParam<Path extends string> =
+  // check if path is just a wildcard
+  Path extends "*" | "/*"
+    ? "*"
+    : // look for wildcard at the end of the path
+    Path extends `${infer Rest}/*`
+    ? "*" | _PathParam<Rest>
+    : // look for params in the absence of wildcards
+      _PathParam<Path>;
+
+// Attempt to parse the given string segment. If it fails, then just return the
+// plain string type as a default fallback. Otherwise, return the union of the
+// parsed string literals that were referenced as dynamic segments in the route.
+export type ParamParseKey<Segment extends string> =
+  // if you could not find path params, fallback to `string`
+  [PathParam<Segment>] extends [never] ? string : PathParam<Segment>;
+
+/**
+ * The parameters that were parsed from the URL path.
+ */
+export type Params<Key extends string = string> = {
+  readonly [key in Key]: string | undefined;
+};
+
+/**
+ * A RouteMatch contains info about how a route matched a URL.
+ */
+export interface AgnosticRouteMatch<
+  ParamKey extends string = string,
+  RouteObjectType extends AgnosticRouteObject = AgnosticRouteObject
+> {
+  /**
+   * The names and values of dynamic parameters in the URL.
+   */
+  params: Params<ParamKey>;
+  /**
+   * The portion of the URL pathname that was matched.
+   */
+  pathname: string;
+  /**
+   * The portion of the URL pathname that was matched before child routes.
+   */
+  pathnameBase: string;
+  /**
+   * The route object that was used to match.
+   */
+  route: RouteObjectType;
+}
+
+export interface AgnosticDataRouteMatch
+  extends AgnosticRouteMatch<string, AgnosticDataRouteObject> {}
+
+function isIndexRoute(
+  route: AgnosticRouteObject
+): route is AgnosticIndexRouteObject {
+  return route.index === true;
+}
+
+// Walk the route tree generating unique IDs where necessary, so we are working
+// solely with AgnosticDataRouteObject's within the Router
+export function convertRoutesToDataRoutes(
+  routes: AgnosticRouteObject[],
+  mapRouteProperties: MapRoutePropertiesFunction,
+  parentPath: number[] = [],
+  manifest: RouteManifest = {}
+): AgnosticDataRouteObject[] {
+  return routes.map((route, index) => {
+    let treePath = [...parentPath, index];
+    let id = typeof route.id === "string" ? route.id : treePath.join("-");
+    invariant(
+      route.index !== true || !route.children,
+      `Cannot specify children on an index route`
+    );
+    invariant(
+      !manifest[id],
+      `Found a route id collision on id "${id}".  Route ` +
+        "id's must be globally unique within Data Router usages"
+    );
+
+    if (isIndexRoute(route)) {
+      let indexRoute: AgnosticDataIndexRouteObject = {
+        ...route,
+        ...mapRouteProperties(route),
+        id,
+      };
+      manifest[id] = indexRoute;
+      return indexRoute;
+    } else {
+      let pathOrLayoutRoute: AgnosticDataNonIndexRouteObject = {
+        ...route,
+        ...mapRouteProperties(route),
+        id,
+        children: undefined,
+      };
+      manifest[id] = pathOrLayoutRoute;
+
+      if (route.children) {
+        pathOrLayoutRoute.children = convertRoutesToDataRoutes(
+          route.children,
+          mapRouteProperties,
+          treePath,
+          manifest
+        );
+      }
+
+      return pathOrLayoutRoute;
+    }
+  });
+}
+
+/**
+ * Matches the given routes to a location and returns the match data.
+ *
+ * @see https://reactrouter.com/utils/match-routes
+ */
+export function matchRoutes<
+  RouteObjectType extends AgnosticRouteObject = AgnosticRouteObject
+>(
+  routes: RouteObjectType[],
+  locationArg: Partial<Location> | string,
+  basename = "/"
+): AgnosticRouteMatch<string, RouteObjectType>[] | null {
+  let location =
+    typeof locationArg === "string" ? parsePath(locationArg) : locationArg;
+
+  let pathname = stripBasename(location.pathname || "/", basename);
+
+  if (pathname == null) {
+    return null;
+  }
+
+  let branches = flattenRoutes(routes);
+  rankRouteBranches(branches);
+
+  let matches = null;
+  for (let i = 0; matches == null && i < branches.length; ++i) {
+    // Incoming pathnames are generally encoded from either window.location
+    // or from router.navigate, but we want to match against the unencoded
+    // paths in the route definitions.  Memory router locations won't be
+    // encoded here but there also shouldn't be anything to decode so this
+    // should be a safe operation.  This avoids needing matchRoutes to be
+    // history-aware.
+    let decoded = decodePath(pathname);
+    matches = matchRouteBranch<string, RouteObjectType>(branches[i], decoded);
+  }
+
+  return matches;
+}
+
+export interface UIMatch<Data = unknown, Handle = unknown> {
+  id: string;
+  pathname: string;
+  params: AgnosticRouteMatch["params"];
+  data: Data;
+  handle: Handle;
+}
+
+export function convertRouteMatchToUiMatch(
+  match: AgnosticDataRouteMatch,
+  loaderData: RouteData
+): UIMatch {
+  let { route, pathname, params } = match;
+  return {
+    id: route.id,
+    pathname,
+    params,
+    data: loaderData[route.id],
+    handle: route.handle,
+  };
+}
+
+interface RouteMeta<
+  RouteObjectType extends AgnosticRouteObject = AgnosticRouteObject
+> {
+  relativePath: string;
+  caseSensitive: boolean;
+  childrenIndex: number;
+  route: RouteObjectType;
+}
+
+interface RouteBranch<
+  RouteObjectType extends AgnosticRouteObject = AgnosticRouteObject
+> {
+  path: string;
+  score: number;
+  routesMeta: RouteMeta<RouteObjectType>[];
+}
+
+function flattenRoutes<
+  RouteObjectType extends AgnosticRouteObject = AgnosticRouteObject
+>(
+  routes: RouteObjectType[],
+  branches: RouteBranch<RouteObjectType>[] = [],
+  parentsMeta: RouteMeta<RouteObjectType>[] = [],
+  parentPath = ""
+): RouteBranch<RouteObjectType>[] {
+  let flattenRoute = (
+    route: RouteObjectType,
+    index: number,
+    relativePath?: string
+  ) => {
+    let meta: RouteMeta<RouteObjectType> = {
+      relativePath:
+        relativePath === undefined ? route.path || "" : relativePath,
+      caseSensitive: route.caseSensitive === true,
+      childrenIndex: index,
+      route,
+    };
+
+    if (meta.relativePath.startsWith("/")) {
+      invariant(
+        meta.relativePath.startsWith(parentPath),
+        `Absolute route path "${meta.relativePath}" nested under path ` +
+          `"${parentPath}" is not valid. An absolute child route path ` +
+          `must start with the combined path of all its parent routes.`
+      );
+
+      meta.relativePath = meta.relativePath.slice(parentPath.length);
+    }
+
+    let path = joinPaths([parentPath, meta.relativePath]);
+    let routesMeta = parentsMeta.concat(meta);
+
+    // Add the children before adding this route to the array, so we traverse the
+    // route tree depth-first and child routes appear before their parents in
+    // the "flattened" version.
+    if (route.children && route.children.length > 0) {
+      invariant(
+        // Our types know better, but runtime JS may not!
+        // @ts-expect-error
+        route.index !== true,
+        `Index routes must not have child routes. Please remove ` +
+          `all child routes from route path "${path}".`
+      );
+
+      flattenRoutes(route.children, branches, routesMeta, path);
+    }
+
+    // Routes without a path shouldn't ever match by themselves unless they are
+    // index routes, so don't add them to the list of possible branches.
+    if (route.path == null && !route.index) {
+      return;
+    }
+
+    branches.push({
+      path,
+      score: computeScore(path, route.index),
+      routesMeta,
+    });
+  };
+  routes.forEach((route, index) => {
+    // coarse-grain check for optional params
+    if (route.path === "" || !route.path?.includes("?")) {
+      flattenRoute(route, index);
+    } else {
+      for (let exploded of explodeOptionalSegments(route.path)) {
+        flattenRoute(route, index, exploded);
+      }
+    }
+  });
+
+  return branches;
+}
+
+/**
+ * Computes all combinations of optional path segments for a given path,
+ * excluding combinations that are ambiguous and of lower priority.
+ *
+ * For example, `/one/:two?/three/:four?/:five?` explodes to:
+ * - `/one/three`
+ * - `/one/:two/three`
+ * - `/one/three/:four`
+ * - `/one/three/:five`
+ * - `/one/:two/three/:four`
+ * - `/one/:two/three/:five`
+ * - `/one/three/:four/:five`
+ * - `/one/:two/three/:four/:five`
+ */
+function explodeOptionalSegments(path: string): string[] {
+  let segments = path.split("/");
+  if (segments.length === 0) return [];
+
+  let [first, ...rest] = segments;
+
+  // Optional path segments are denoted by a trailing `?`
+  let isOptional = first.endsWith("?");
+  // Compute the corresponding required segment: `foo?` -> `foo`
+  let required = first.replace(/\?$/, "");
+
+  if (rest.length === 0) {
+    // Intepret empty string as omitting an optional segment
+    // `["one", "", "three"]` corresponds to omitting `:two` from `/one/:two?/three` -> `/one/three`
+    return isOptional ? [required, ""] : [required];
+  }
+
+  let restExploded = explodeOptionalSegments(rest.join("/"));
+
+  let result: string[] = [];
+
+  // All child paths with the prefix.  Do this for all children before the
+  // optional version for all children, so we get consistent ordering where the
+  // parent optional aspect is preferred as required.  Otherwise, we can get
+  // child sections interspersed where deeper optional segments are higher than
+  // parent optional segments, where for example, /:two would explode _earlier_
+  // then /:one.  By always including the parent as required _for all children_
+  // first, we avoid this issue
+  result.push(
+    ...restExploded.map((subpath) =>
+      subpath === "" ? required : [required, subpath].join("/")
+    )
+  );
+
+  // Then, if this is an optional value, add all child versions without
+  if (isOptional) {
+    result.push(...restExploded);
+  }
+
+  // for absolute paths, ensure `/` instead of empty segment
+  return result.map((exploded) =>
+    path.startsWith("/") && exploded === "" ? "/" : exploded
+  );
+}
+
+function rankRouteBranches(branches: RouteBranch[]): void {
+  branches.sort((a, b) =>
+    a.score !== b.score
+      ? b.score - a.score // Higher score first
+      : compareIndexes(
+          a.routesMeta.map((meta) => meta.childrenIndex),
+          b.routesMeta.map((meta) => meta.childrenIndex)
+        )
+  );
+}
+
+const paramRe = /^:[\w-]+$/;
+const dynamicSegmentValue = 3;
+const indexRouteValue = 2;
+const emptySegmentValue = 1;
+const staticSegmentValue = 10;
+const splatPenalty = -2;
+const isSplat = (s: string) => s === "*";
+
+function computeScore(path: string, index: boolean | undefined): number {
+  let segments = path.split("/");
+  let initialScore = segments.length;
+  if (segments.some(isSplat)) {
+    initialScore += splatPenalty;
+  }
+
+  if (index) {
+    initialScore += indexRouteValue;
+  }
+
+  return segments
+    .filter((s) => !isSplat(s))
+    .reduce(
+      (score, segment) =>
+        score +
+        (paramRe.test(segment)
+          ? dynamicSegmentValue
+          : segment === ""
+          ? emptySegmentValue
+          : staticSegmentValue),
+      initialScore
+    );
+}
+
+function compareIndexes(a: number[], b: number[]): number {
+  let siblings =
+    a.length === b.length && a.slice(0, -1).every((n, i) => n === b[i]);
+
+  return siblings
+    ? // If two routes are siblings, we should try to match the earlier sibling
+      // first. This allows people to have fine-grained control over the matching
+      // behavior by simply putting routes with identical paths in the order they
+      // want them tried.
+      a[a.length - 1] - b[b.length - 1]
+    : // Otherwise, it doesn't really make sense to rank non-siblings by index,
+      // so they sort equally.
+      0;
+}
+
+function matchRouteBranch<
+  ParamKey extends string = string,
+  RouteObjectType extends AgnosticRouteObject = AgnosticRouteObject
+>(
+  branch: RouteBranch<RouteObjectType>,
+  pathname: string
+): AgnosticRouteMatch<ParamKey, RouteObjectType>[] | null {
+  let { routesMeta } = branch;
+
+  let matchedParams = {};
+  let matchedPathname = "/";
+  let matches: AgnosticRouteMatch<ParamKey, RouteObjectType>[] = [];
+  for (let i = 0; i < routesMeta.length; ++i) {
+    let meta = routesMeta[i];
+    let end = i === routesMeta.length - 1;
+    let remainingPathname =
+      matchedPathname === "/"
+        ? pathname
+        : pathname.slice(matchedPathname.length) || "/";
+    let match = matchPath(
+      { path: meta.relativePath, caseSensitive: meta.caseSensitive, end },
+      remainingPathname
+    );
+
+    if (!match) return null;
+
+    Object.assign(matchedParams, match.params);
+
+    let route = meta.route;
+
+    matches.push({
+      // TODO: Can this as be avoided?
+      params: matchedParams as Params<ParamKey>,
+      pathname: joinPaths([matchedPathname, match.pathname]),
+      pathnameBase: normalizePathname(
+        joinPaths([matchedPathname, match.pathnameBase])
+      ),
+      route,
+    });
+
+    if (match.pathnameBase !== "/") {
+      matchedPathname = joinPaths([matchedPathname, match.pathnameBase]);
+    }
+  }
+
+  return matches;
+}
+
+/**
+ * Returns a path with params interpolated.
+ *
+ * @see https://reactrouter.com/utils/generate-path
+ */
+export function generatePath<Path extends string>(
+  originalPath: Path,
+  params: {
+    [key in PathParam<Path>]: string | null;
+  } = {} as any
+): string {
+  let path: string = originalPath;
+  if (path.endsWith("*") && path !== "*" && !path.endsWith("/*")) {
+    warning(
+      false,
+      `Route path "${path}" will be treated as if it were ` +
+        `"${path.replace(/\*$/, "/*")}" because the \`*\` character must ` +
+        `always follow a \`/\` in the pattern. To get rid of this warning, ` +
+        `please change the route path to "${path.replace(/\*$/, "/*")}".`
+    );
+    path = path.replace(/\*$/, "/*") as Path;
+  }
+
+  // ensure `/` is added at the beginning if the path is absolute
+  const prefix = path.startsWith("/") ? "/" : "";
+
+  const stringify = (p: any) =>
+    p == null ? "" : typeof p === "string" ? p : String(p);
+
+  const segments = path
+    .split(/\/+/)
+    .map((segment, index, array) => {
+      const isLastSegment = index === array.length - 1;
+
+      // only apply the splat if it's the last segment
+      if (isLastSegment && segment === "*") {
+        const star = "*" as PathParam<Path>;
+        // Apply the splat
+        return stringify(params[star]);
+      }
+
+      const keyMatch = segment.match(/^:([\w-]+)(\??)$/);
+      if (keyMatch) {
+        const [, key, optional] = keyMatch;
+        let param = params[key as PathParam<Path>];
+        invariant(optional === "?" || param != null, `Missing ":${key}" param`);
+        return stringify(param);
+      }
+
+      // Remove any optional markers from optional static segments
+      return segment.replace(/\?$/g, "");
+    })
+    // Remove empty segments
+    .filter((segment) => !!segment);
+
+  return prefix + segments.join("/");
+}
+
+/**
+ * A PathPattern is used to match on some portion of a URL pathname.
+ */
+export interface PathPattern<Path extends string = string> {
+  /**
+   * A string to match against a URL pathname. May contain `:id`-style segments
+   * to indicate placeholders for dynamic parameters. May also end with `/*` to
+   * indicate matching the rest of the URL pathname.
+   */
+  path: Path;
+  /**
+   * Should be `true` if the static portions of the `path` should be matched in
+   * the same case.
+   */
+  caseSensitive?: boolean;
+  /**
+   * Should be `true` if this pattern should match the entire URL pathname.
+   */
+  end?: boolean;
+}
+
+/**
+ * A PathMatch contains info about how a PathPattern matched on a URL pathname.
+ */
+export interface PathMatch<ParamKey extends string = string> {
+  /**
+   * The names and values of dynamic parameters in the URL.
+   */
+  params: Params<ParamKey>;
+  /**
+   * The portion of the URL pathname that was matched.
+   */
+  pathname: string;
+  /**
+   * The portion of the URL pathname that was matched before child routes.
+   */
+  pathnameBase: string;
+  /**
+   * The pattern that was used to match.
+   */
+  pattern: PathPattern;
+}
+
+type Mutable<T> = {
+  -readonly [P in keyof T]: T[P];
+};
+
+/**
+ * Performs pattern matching on a URL pathname and returns information about
+ * the match.
+ *
+ * @see https://reactrouter.com/utils/match-path
+ */
+export function matchPath<
+  ParamKey extends ParamParseKey<Path>,
+  Path extends string
+>(
+  pattern: PathPattern<Path> | Path,
+  pathname: string
+): PathMatch<ParamKey> | null {
+  if (typeof pattern === "string") {
+    pattern = { path: pattern, caseSensitive: false, end: true };
+  }
+
+  let [matcher, compiledParams] = compilePath(
+    pattern.path,
+    pattern.caseSensitive,
+    pattern.end
+  );
+
+  let match = pathname.match(matcher);
+  if (!match) return null;
+
+  let matchedPathname = match[0];
+  let pathnameBase = matchedPathname.replace(/(.)\/+$/, "$1");
+  let captureGroups = match.slice(1);
+  let params: Params = compiledParams.reduce<Mutable<Params>>(
+    (memo, { paramName, isOptional }, index) => {
+      // We need to compute the pathnameBase here using the raw splat value
+      // instead of using params["*"] later because it will be decoded then
+      if (paramName === "*") {
+        let splatValue = captureGroups[index] || "";
+        pathnameBase = matchedPathname
+          .slice(0, matchedPathname.length - splatValue.length)
+          .replace(/(.)\/+$/, "$1");
+      }
+
+      const value = captureGroups[index];
+      if (isOptional && !value) {
+        memo[paramName] = undefined;
+      } else {
+        memo[paramName] = (value || "").replace(/%2F/g, "/");
+      }
+      return memo;
+    },
+    {}
+  );
+
+  return {
+    params,
+    pathname: matchedPathname,
+    pathnameBase,
+    pattern,
+  };
+}
+
+type CompiledPathParam = { paramName: string; isOptional?: boolean };
+
+function compilePath(
+  path: string,
+  caseSensitive = false,
+  end = true
+): [RegExp, CompiledPathParam[]] {
+  warning(
+    path === "*" || !path.endsWith("*") || path.endsWith("/*"),
+    `Route path "${path}" will be treated as if it were ` +
+      `"${path.replace(/\*$/, "/*")}" because the \`*\` character must ` +
+      `always follow a \`/\` in the pattern. To get rid of this warning, ` +
+      `please change the route path to "${path.replace(/\*$/, "/*")}".`
+  );
+
+  let params: CompiledPathParam[] = [];
+  let regexpSource =
+    "^" +
+    path
+      .replace(/\/*\*?$/, "") // Ignore trailing / and /*, we'll handle it below
+      .replace(/^\/*/, "/") // Make sure it has a leading /
+      .replace(/[\\.*+^${}|()[\]]/g, "\\$&") // Escape special regex chars
+      .replace(
+        /\/:([\w-]+)(\?)?/g,
+        (_: string, paramName: string, isOptional) => {
+          params.push({ paramName, isOptional: isOptional != null });
+          return isOptional ? "/?([^\\/]+)?" : "/([^\\/]+)";
+        }
+      );
+
+  if (path.endsWith("*")) {
+    params.push({ paramName: "*" });
+    regexpSource +=
+      path === "*" || path === "/*"
+        ? "(.*)$" // Already matched the initial /, just match the rest
+        : "(?:\\/(.+)|\\/*)$"; // Don't include the / in params["*"]
+  } else if (end) {
+    // When matching to the end, ignore trailing slashes
+    regexpSource += "\\/*$";
+  } else if (path !== "" && path !== "/") {
+    // If our path is non-empty and contains anything beyond an initial slash,
+    // then we have _some_ form of path in our regex, so we should expect to
+    // match only if we find the end of this path segment.  Look for an optional
+    // non-captured trailing slash (to match a portion of the URL) or the end
+    // of the path (if we've matched to the end).  We used to do this with a
+    // word boundary but that gives false positives on routes like
+    // /user-preferences since `-` counts as a word boundary.
+    regexpSource += "(?:(?=\\/|$))";
+  } else {
+    // Nothing to match for "" or "/"
+  }
+
+  let matcher = new RegExp(regexpSource, caseSensitive ? undefined : "i");
+
+  return [matcher, params];
+}
+
+function decodePath(value: string) {
+  try {
+    return value
+      .split("/")
+      .map((v) => decodeURIComponent(v).replace(/\//g, "%2F"))
+      .join("/");
+  } catch (error) {
+    warning(
+      false,
+      `The URL path "${value}" could not be decoded because it is is a ` +
+        `malformed URL segment. This is probably due to a bad percent ` +
+        `encoding (${error}).`
+    );
+
+    return value;
+  }
+}
+
+/**
+ * @private
+ */
+export function stripBasename(
+  pathname: string,
+  basename: string
+): string | null {
+  if (basename === "/") return pathname;
+
+  if (!pathname.toLowerCase().startsWith(basename.toLowerCase())) {
+    return null;
+  }
+
+  // We want to leave trailing slash behavior in the user's control, so if they
+  // specify a basename with a trailing slash, we should support it
+  let startIndex = basename.endsWith("/")
+    ? basename.length - 1
+    : basename.length;
+  let nextChar = pathname.charAt(startIndex);
+  if (nextChar && nextChar !== "/") {
+    // pathname does not start with basename/
+    return null;
+  }
+
+  return pathname.slice(startIndex) || "/";
+}
+
+/**
+ * Returns a resolved path object relative to the given pathname.
+ *
+ * @see https://reactrouter.com/utils/resolve-path
+ */
+export function resolvePath(to: To, fromPathname = "/"): Path {
+  let {
+    pathname: toPathname,
+    search = "",
+    hash = "",
+  } = typeof to === "string" ? parsePath(to) : to;
+
+  let pathname = toPathname
+    ? toPathname.startsWith("/")
+      ? toPathname
+      : resolvePathname(toPathname, fromPathname)
+    : fromPathname;
+
+  return {
+    pathname,
+    search: normalizeSearch(search),
+    hash: normalizeHash(hash),
+  };
+}
+
+function resolvePathname(relativePath: string, fromPathname: string): string {
+  let segments = fromPathname.replace(/\/+$/, "").split("/");
+  let relativeSegments = relativePath.split("/");
+
+  relativeSegments.forEach((segment) => {
+    if (segment === "..") {
+      // Keep the root "" segment so the pathname starts at /
+      if (segments.length > 1) segments.pop();
+    } else if (segment !== ".") {
+      segments.push(segment);
+    }
+  });
+
+  return segments.length > 1 ? segments.join("/") : "/";
+}
+
+function getInvalidPathError(
+  char: string,
+  field: string,
+  dest: string,
+  path: Partial<Path>
+) {
+  return (
+    `Cannot include a '${char}' character in a manually specified ` +
+    `\`to.${field}\` field [${JSON.stringify(
+      path
+    )}].  Please separate it out to the ` +
+    `\`to.${dest}\` field. Alternatively you may provide the full path as ` +
+    `a string in <Link to="..."> and the router will parse it for you.`
+  );
+}
+
+/**
+ * @private
+ *
+ * When processing relative navigation we want to ignore ancestor routes that
+ * do not contribute to the path, such that index/pathless layout routes don't
+ * interfere.
+ *
+ * For example, when moving a route element into an index route and/or a
+ * pathless layout route, relative link behavior contained within should stay
+ * the same.  Both of the following examples should link back to the root:
+ *
+ *   <Route path="/">
+ *     <Route path="accounts" element={<Link to=".."}>
+ *   </Route>
+ *
+ *   <Route path="/">
+ *     <Route path="accounts">
+ *       <Route element={<AccountsLayout />}>       // <-- Does not contribute
+ *         <Route index element={<Link to=".."} />  // <-- Does not contribute
+ *       </Route
+ *     </Route>
+ *   </Route>
+ */
+export function getPathContributingMatches<
+  T extends AgnosticRouteMatch = AgnosticRouteMatch
+>(matches: T[]) {
+  return matches.filter(
+    (match, index) =>
+      index === 0 || (match.route.path && match.route.path.length > 0)
+  );
+}
+
+// Return the array of pathnames for the current route matches - used to
+// generate the routePathnames input for resolveTo()
+export function getResolveToMatches<
+  T extends AgnosticRouteMatch = AgnosticRouteMatch
+>(matches: T[], v7_relativeSplatPath: boolean) {
+  let pathMatches = getPathContributingMatches(matches);
+
+  // When v7_relativeSplatPath is enabled, use the full pathname for the leaf
+  // match so we include splat values for "." links.  See:
+  // https://github.com/remix-run/react-router/issues/11052#issuecomment-1836589329
+  if (v7_relativeSplatPath) {
+    return pathMatches.map((match, idx) =>
+      idx === matches.length - 1 ? match.pathname : match.pathnameBase
+    );
+  }
+
+  return pathMatches.map((match) => match.pathnameBase);
+}
+
+/**
+ * @private
+ */
+export function resolveTo(
+  toArg: To,
+  routePathnames: string[],
+  locationPathname: string,
+  isPathRelative = false
+): Path {
+  let to: Partial<Path>;
+  if (typeof toArg === "string") {
+    to = parsePath(toArg);
+  } else {
+    to = { ...toArg };
+
+    invariant(
+      !to.pathname || !to.pathname.includes("?"),
+      getInvalidPathError("?", "pathname", "search", to)
+    );
+    invariant(
+      !to.pathname || !to.pathname.includes("#"),
+      getInvalidPathError("#", "pathname", "hash", to)
+    );
+    invariant(
+      !to.search || !to.search.includes("#"),
+      getInvalidPathError("#", "search", "hash", to)
+    );
+  }
+
+  let isEmptyPath = toArg === "" || to.pathname === "";
+  let toPathname = isEmptyPath ? "/" : to.pathname;
+
+  let from: string;
+
+  // Routing is relative to the current pathname if explicitly requested.
+  //
+  // If a pathname is explicitly provided in `to`, it should be relative to the
+  // route context. This is explained in `Note on `<Link to>` values` in our
+  // migration guide from v5 as a means of disambiguation between `to` values
+  // that begin with `/` and those that do not. However, this is problematic for
+  // `to` values that do not provide a pathname. `to` can simply be a search or
+  // hash string, in which case we should assume that the navigation is relative
+  // to the current location's pathname and *not* the route pathname.
+  if (toPathname == null) {
+    from = locationPathname;
+  } else {
+    let routePathnameIndex = routePathnames.length - 1;
+
+    // With relative="route" (the default), each leading .. segment means
+    // "go up one route" instead of "go up one URL segment".  This is a key
+    // difference from how <a href> works and a major reason we call this a
+    // "to" value instead of a "href".
+    if (!isPathRelative && toPathname.startsWith("..")) {
+      let toSegments = toPathname.split("/");
+
+      while (toSegments[0] === "..") {
+        toSegments.shift();
+        routePathnameIndex -= 1;
+      }
+
+      to.pathname = toSegments.join("/");
+    }
+
+    from = routePathnameIndex >= 0 ? routePathnames[routePathnameIndex] : "/";
+  }
+
+  let path = resolvePath(to, from);
+
+  // Ensure the pathname has a trailing slash if the original "to" had one
+  let hasExplicitTrailingSlash =
+    toPathname && toPathname !== "/" && toPathname.endsWith("/");
+  // Or if this was a link to the current path which has a trailing slash
+  let hasCurrentTrailingSlash =
+    (isEmptyPath || toPathname === ".") && locationPathname.endsWith("/");
+  if (
+    !path.pathname.endsWith("/") &&
+    (hasExplicitTrailingSlash || hasCurrentTrailingSlash)
+  ) {
+    path.pathname += "/";
+  }
+
+  return path;
+}
+
+/**
+ * @private
+ */
+export function getToPathname(to: To): string | undefined {
+  // Empty strings should be treated the same as / paths
+  return to === "" || (to as Path).pathname === ""
+    ? "/"
+    : typeof to === "string"
+    ? parsePath(to).pathname
+    : to.pathname;
+}
+
+/**
+ * @private
+ */
+export const joinPaths = (paths: string[]): string =>
+  paths.join("/").replace(/\/\/+/g, "/");
+
+/**
+ * @private
+ */
+export const normalizePathname = (pathname: string): string =>
+  pathname.replace(/\/+$/, "").replace(/^\/*/, "/");
+
+/**
+ * @private
+ */
+export const normalizeSearch = (search: string): string =>
+  !search || search === "?"
+    ? ""
+    : search.startsWith("?")
+    ? search
+    : "?" + search;
+
+/**
+ * @private
+ */
+export const normalizeHash = (hash: string): string =>
+  !hash || hash === "#" ? "" : hash.startsWith("#") ? hash : "#" + hash;
+
+export type JsonFunction = <Data>(
+  data: Data,
+  init?: number | ResponseInit
+) => Response;
+
+/**
+ * This is a shortcut for creating `application/json` responses. Converts `data`
+ * to JSON and sets the `Content-Type` header.
+ */
+export const json: JsonFunction = (data, init = {}) => {
+  let responseInit = typeof init === "number" ? { status: init } : init;
+
+  let headers = new Headers(responseInit.headers);
+  if (!headers.has("Content-Type")) {
+    headers.set("Content-Type", "application/json; charset=utf-8");
+  }
+
+  return new Response(JSON.stringify(data), {
+    ...responseInit,
+    headers,
+  });
+};
+
+export interface TrackedPromise extends Promise<any> {
+  _tracked?: boolean;
+  _data?: any;
+  _error?: any;
+}
+
+export class AbortedDeferredError extends Error {}
+
+export class DeferredData {
+  private pendingKeysSet: Set<string> = new Set<string>();
+  private controller: AbortController;
+  private abortPromise: Promise<void>;
+  private unlistenAbortSignal: () => void;
+  private subscribers: Set<(aborted: boolean, settledKey?: string) => void> =
+    new Set();
+  data: Record<string, unknown>;
+  init?: ResponseInit;
+  deferredKeys: string[] = [];
+
+  constructor(data: Record<string, unknown>, responseInit?: ResponseInit) {
+    invariant(
+      data && typeof data === "object" && !Array.isArray(data),
+      "defer() only accepts plain objects"
+    );
+
+    // Set up an AbortController + Promise we can race against to exit early
+    // cancellation
+    let reject: (e: AbortedDeferredError) => void;
+    this.abortPromise = new Promise((_, r) => (reject = r));
+    this.controller = new AbortController();
+    let onAbort = () =>
+      reject(new AbortedDeferredError("Deferred data aborted"));
+    this.unlistenAbortSignal = () =>
+      this.controller.signal.removeEventListener("abort", onAbort);
+    this.controller.signal.addEventListener("abort", onAbort);
+
+    this.data = Object.entries(data).reduce(
+      (acc, [key, value]) =>
+        Object.assign(acc, {
+          [key]: this.trackPromise(key, value),
+        }),
+      {}
+    );
+
+    if (this.done) {
+      // All incoming values were resolved
+      this.unlistenAbortSignal();
+    }
+
+    this.init = responseInit;
+  }
+
+  private trackPromise(
+    key: string,
+    value: Promise<unknown> | unknown
+  ): TrackedPromise | unknown {
+    if (!(value instanceof Promise)) {
+      return value;
+    }
+
+    this.deferredKeys.push(key);
+    this.pendingKeysSet.add(key);
+
+    // We store a little wrapper promise that will be extended with
+    // _data/_error props upon resolve/reject
+    let promise: TrackedPromise = Promise.race([value, this.abortPromise]).then(
+      (data) => this.onSettle(promise, key, undefined, data as unknown),
+      (error) => this.onSettle(promise, key, error as unknown)
+    );
+
+    // Register rejection listeners to avoid uncaught promise rejections on
+    // errors or aborted deferred values
+    promise.catch(() => {});
+
+    Object.defineProperty(promise, "_tracked", { get: () => true });
+    return promise;
+  }
+
+  private onSettle(
+    promise: TrackedPromise,
+    key: string,
+    error: unknown,
+    data?: unknown
+  ): unknown {
+    if (
+      this.controller.signal.aborted &&
+      error instanceof AbortedDeferredError
+    ) {
+      this.unlistenAbortSignal();
+      Object.defineProperty(promise, "_error", { get: () => error });
+      return Promise.reject(error);
+    }
+
+    this.pendingKeysSet.delete(key);
+
+    if (this.done) {
+      // Nothing left to abort!
+      this.unlistenAbortSignal();
+    }
+
+    // If the promise was resolved/rejected with undefined, we'll throw an error as you
+    // should always resolve with a value or null
+    if (error === undefined && data === undefined) {
+      let undefinedError = new Error(
+        `Deferred data for key "${key}" resolved/rejected with \`undefined\`, ` +
+          `you must resolve/reject with a value or \`null\`.`
+      );
+      Object.defineProperty(promise, "_error", { get: () => undefinedError });
+      this.emit(false, key);
+      return Promise.reject(undefinedError);
+    }
+
+    if (data === undefined) {
+      Object.defineProperty(promise, "_error", { get: () => error });
+      this.emit(false, key);
+      return Promise.reject(error);
+    }
+
+    Object.defineProperty(promise, "_data", { get: () => data });
+    this.emit(false, key);
+    return data;
+  }
+
+  private emit(aborted: boolean, settledKey?: string) {
+    this.subscribers.forEach((subscriber) => subscriber(aborted, settledKey));
+  }
+
+  subscribe(fn: (aborted: boolean, settledKey?: string) => void) {
+    this.subscribers.add(fn);
+    return () => this.subscribers.delete(fn);
+  }
+
+  cancel() {
+    this.controller.abort();
+    this.pendingKeysSet.forEach((v, k) => this.pendingKeysSet.delete(k));
+    this.emit(true);
+  }
+
+  async resolveData(signal: AbortSignal) {
+    let aborted = false;
+    if (!this.done) {
+      let onAbort = () => this.cancel();
+      signal.addEventListener("abort", onAbort);
+      aborted = await new Promise((resolve) => {
+        this.subscribe((aborted) => {
+          signal.removeEventListener("abort", onAbort);
+          if (aborted || this.done) {
+            resolve(aborted);
+          }
+        });
+      });
+    }
+    return aborted;
+  }
+
+  get done() {
+    return this.pendingKeysSet.size === 0;
+  }
+
+  get unwrappedData() {
+    invariant(
+      this.data !== null && this.done,
+      "Can only unwrap data on initialized and settled deferreds"
+    );
+
+    return Object.entries(this.data).reduce(
+      (acc, [key, value]) =>
+        Object.assign(acc, {
+          [key]: unwrapTrackedPromise(value),
+        }),
+      {}
+    );
+  }
+
+  get pendingKeys() {
+    return Array.from(this.pendingKeysSet);
+  }
+}
+
+function isTrackedPromise(value: any): value is TrackedPromise {
+  return (
+    value instanceof Promise && (value as TrackedPromise)._tracked === true
+  );
+}
+
+function unwrapTrackedPromise(value: any) {
+  if (!isTrackedPromise(value)) {
+    return value;
+  }
+
+  if (value._error) {
+    throw value._error;
+  }
+  return value._data;
+}
+
+export type DeferFunction = (
+  data: Record<string, unknown>,
+  init?: number | ResponseInit
+) => DeferredData;
+
+export const defer: DeferFunction = (data, init = {}) => {
+  let responseInit = typeof init === "number" ? { status: init } : init;
+
+  return new DeferredData(data, responseInit);
+};
+
+export type RedirectFunction = (
+  url: string,
+  init?: number | ResponseInit
+) => Response;
+
+/**
+ * A redirect response. Sets the status code and the `Location` header.
+ * Defaults to "302 Found".
+ */
+export const redirect: RedirectFunction = (url, init = 302) => {
+  let responseInit = init;
+  if (typeof responseInit === "number") {
+    responseInit = { status: responseInit };
+  } else if (typeof responseInit.status === "undefined") {
+    responseInit.status = 302;
+  }
+
+  let headers = new Headers(responseInit.headers);
+  headers.set("Location", url);
+
+  return new Response(null, {
+    ...responseInit,
+    headers,
+  });
+};
+
+/**
+ * A redirect response that will force a document reload to the new location.
+ * Sets the status code and the `Location` header.
+ * Defaults to "302 Found".
+ */
+export const redirectDocument: RedirectFunction = (url, init) => {
+  let response = redirect(url, init);
+  response.headers.set("X-Remix-Reload-Document", "true");
+  return response;
+};
+
+export type ErrorResponse = {
+  status: number;
+  statusText: string;
+  data: any;
+};
+
+/**
+ * @private
+ * Utility class we use to hold auto-unwrapped 4xx/5xx Response bodies
+ *
+ * We don't export the class for public use since it's an implementation
+ * detail, but we export the interface above so folks can build their own
+ * abstractions around instances via isRouteErrorResponse()
+ */
+export class ErrorResponseImpl implements ErrorResponse {
+  status: number;
+  statusText: string;
+  data: any;
+  private error?: Error;
+  private internal: boolean;
+
+  constructor(
+    status: number,
+    statusText: string | undefined,
+    data: any,
+    internal = false
+  ) {
+    this.status = status;
+    this.statusText = statusText || "";
+    this.internal = internal;
+    if (data instanceof Error) {
+      this.data = data.toString();
+      this.error = data;
+    } else {
+      this.data = data;
+    }
+  }
+}
+
+/**
+ * Check if the given error is an ErrorResponse generated from a 4xx/5xx
+ * Response thrown from an action/loader
+ */
+export function isRouteErrorResponse(error: any): error is ErrorResponse {
+  return (
+    error != null &&
+    typeof error.status === "number" &&
+    typeof error.statusText === "string" &&
+    typeof error.internal === "boolean" &&
+    "data" in error
+  );
+}
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/Motion.js b/ddb_main/node_modules/@serprex/react-motion/lib/Motion.js
new file mode 100644
index 0000000..73eec42
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/Motion.js
@@ -0,0 +1,265 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _mapToZero = _interopRequireDefault(require("./mapToZero"));
+
+var _stripStyle = _interopRequireDefault(require("./stripStyle"));
+
+var _stepper3 = _interopRequireDefault(require("./stepper"));
+
+var _performanceNow = _interopRequireDefault(require("performance-now"));
+
+var _raf = _interopRequireDefault(require("raf"));
+
+var _shouldStopAnimation = _interopRequireDefault(require("./shouldStopAnimation"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+var msPerFrame = 1000 / 60;
+
+var Motion = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Motion, _React$Component);
+
+  function Motion(props) {
+    var _this;
+
+    _this = _React$Component.call(this, props) || this;
+    _this.unmounting = false;
+    _this.wasAnimating = false;
+    _this.animationID = null;
+    _this.prevTime = 0;
+    _this.accumulatedTime = 0;
+    _this.unreadPropStyle = null;
+
+    _this.clearUnreadPropStyle = function (destStyle) {
+      var dirty = false;
+      var _this$state = _this.state,
+          currentStyle = _this$state.currentStyle,
+          currentVelocity = _this$state.currentVelocity,
+          lastIdealStyle = _this$state.lastIdealStyle,
+          lastIdealVelocity = _this$state.lastIdealVelocity;
+
+      for (var key in destStyle) {
+        if (!Object.prototype.hasOwnProperty.call(destStyle, key)) {
+          continue;
+        }
+
+        var styleValue = destStyle[key];
+
+        if (typeof styleValue === 'number') {
+          if (!dirty) {
+            dirty = true;
+            currentStyle = _extends({}, currentStyle);
+            currentVelocity = _extends({}, currentVelocity);
+            lastIdealStyle = _extends({}, lastIdealStyle);
+            lastIdealVelocity = _extends({}, lastIdealVelocity);
+          }
+
+          currentStyle[key] = styleValue;
+          currentVelocity[key] = 0;
+          lastIdealStyle[key] = styleValue;
+          lastIdealVelocity[key] = 0;
+        }
+      }
+
+      if (dirty) {
+        _this.setState({
+          currentStyle: currentStyle,
+          currentVelocity: currentVelocity,
+          lastIdealStyle: lastIdealStyle,
+          lastIdealVelocity: lastIdealVelocity
+        });
+      }
+    };
+
+    _this.startAnimationIfNecessary = function () {
+      if (_this.unmounting || _this.animationID != null) {
+        return;
+      } // TODO: when config is {a: 10} and dest is {a: 10} do we raf once and
+      // call cb? No, otherwise accidental parent rerender causes cb trigger
+
+
+      _this.animationID = (0, _raf["default"])(function (timestamp) {
+        // https://github.com/chenglou/react-motion/pull/420
+        // > if execution passes the conditional if (this.unmounting), then
+        // executes async defaultRaf and after that component unmounts and after
+        // that the callback of defaultRaf is called, then setState will be called
+        // on unmounted component.
+        if (_this.unmounting) {
+          return;
+        } // check if we need to animate in the first place
+
+
+        var propsStyle = _this.props.style;
+
+        if ((0, _shouldStopAnimation["default"])(_this.state.currentStyle, propsStyle, _this.state.currentVelocity)) {
+          if (_this.wasAnimating && _this.props.onRest) {
+            _this.props.onRest();
+          } // no need to cancel animationID here; shouldn't have any in flight
+
+
+          _this.animationID = null;
+          _this.wasAnimating = false;
+          _this.accumulatedTime = 0;
+          return;
+        }
+
+        _this.wasAnimating = true;
+        var currentTime = timestamp || (0, _performanceNow["default"])();
+        var timeDelta = currentTime - _this.prevTime;
+        _this.prevTime = currentTime;
+        _this.accumulatedTime = _this.accumulatedTime + timeDelta; // more than 10 frames? prolly switched browser tab. Restart
+
+        if (_this.accumulatedTime > msPerFrame * 10) {
+          _this.accumulatedTime = 0;
+        }
+
+        if (_this.accumulatedTime === 0) {
+          // no need to cancel animationID here; shouldn't have any in flight
+          _this.animationID = null;
+
+          _this.startAnimationIfNecessary();
+
+          return;
+        }
+
+        var currentFrameCompletion = (_this.accumulatedTime - Math.floor(_this.accumulatedTime / msPerFrame) * msPerFrame) / msPerFrame;
+        var framesToCatchUp = Math.floor(_this.accumulatedTime / msPerFrame);
+        var newLastIdealStyle = {};
+        var newLastIdealVelocity = {};
+        var newCurrentStyle = {};
+        var newCurrentVelocity = {};
+
+        for (var key in propsStyle) {
+          if (!Object.prototype.hasOwnProperty.call(propsStyle, key)) {
+            continue;
+          }
+
+          var styleValue = propsStyle[key];
+
+          if (typeof styleValue === 'number') {
+            newCurrentStyle[key] = styleValue;
+            newCurrentVelocity[key] = 0;
+            newLastIdealStyle[key] = styleValue;
+            newLastIdealVelocity[key] = 0;
+          } else {
+            var newLastIdealStyleValue = _this.state.lastIdealStyle[key];
+            var newLastIdealVelocityValue = _this.state.lastIdealVelocity[key];
+
+            for (var i = 0; i < framesToCatchUp; i++) {
+              var _stepper = (0, _stepper3["default"])(msPerFrame / 1000, newLastIdealStyleValue, newLastIdealVelocityValue, styleValue.val, styleValue.stiffness, styleValue.damping, styleValue.precision);
+
+              newLastIdealStyleValue = _stepper[0];
+              newLastIdealVelocityValue = _stepper[1];
+            }
+
+            var _stepper2 = (0, _stepper3["default"])(msPerFrame / 1000, newLastIdealStyleValue, newLastIdealVelocityValue, styleValue.val, styleValue.stiffness, styleValue.damping, styleValue.precision),
+                nextIdealX = _stepper2[0],
+                nextIdealV = _stepper2[1];
+
+            newCurrentStyle[key] = newLastIdealStyleValue + (nextIdealX - newLastIdealStyleValue) * currentFrameCompletion;
+            newCurrentVelocity[key] = newLastIdealVelocityValue + (nextIdealV - newLastIdealVelocityValue) * currentFrameCompletion;
+            newLastIdealStyle[key] = newLastIdealStyleValue;
+            newLastIdealVelocity[key] = newLastIdealVelocityValue;
+          }
+        }
+
+        _this.animationID = null; // the amount we're looped over above
+
+        _this.accumulatedTime -= framesToCatchUp * msPerFrame;
+
+        _this.setState({
+          currentStyle: newCurrentStyle,
+          currentVelocity: newCurrentVelocity,
+          lastIdealStyle: newLastIdealStyle,
+          lastIdealVelocity: newLastIdealVelocity
+        });
+
+        _this.unreadPropStyle = null;
+
+        _this.startAnimationIfNecessary();
+      });
+    };
+
+    _this.state = _this.defaultState();
+    return _this;
+  }
+
+  var _proto = Motion.prototype;
+
+  _proto.defaultState = function defaultState() {
+    var _this$props = this.props,
+        defaultStyle = _this$props.defaultStyle,
+        style = _this$props.style;
+    var currentStyle = defaultStyle || (0, _stripStyle["default"])(style);
+    var currentVelocity = (0, _mapToZero["default"])(currentStyle);
+    return {
+      currentStyle: currentStyle,
+      currentVelocity: currentVelocity,
+      lastIdealStyle: currentStyle,
+      lastIdealVelocity: currentVelocity
+    };
+  } // it's possible that currentStyle's value is stale: if props is immediately
+  // changed from 0 to 400 to spring(0) again, the async currentStyle is still
+  // at 0 (didn't have time to tick and interpolate even once). If we naively
+  // compare currentStyle with destVal it'll be 0 === 0 (no animation, stop).
+  // In reality currentStyle should be 400
+  ;
+
+  _proto.componentDidMount = function componentDidMount() {
+    this.prevTime = (0, _performanceNow["default"])();
+    this.startAnimationIfNecessary();
+  };
+
+  _proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(props) {
+    if (this.unreadPropStyle != null) {
+      // previous props haven't had the chance to be set yet; set them here
+      this.clearUnreadPropStyle(this.unreadPropStyle);
+    }
+
+    this.unreadPropStyle = props.style;
+
+    if (this.animationID == null) {
+      this.prevTime = (0, _performanceNow["default"])();
+      this.startAnimationIfNecessary();
+    }
+  };
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    this.unmounting = true;
+
+    if (this.animationID != null) {
+      _raf["default"].cancel(this.animationID);
+
+      this.animationID = null;
+    }
+  };
+
+  _proto.render = function render() {
+    var renderedChildren = this.props.children(this.state.currentStyle);
+    return renderedChildren && _react["default"].Children.only(renderedChildren);
+  };
+
+  return Motion;
+}(_react["default"].Component);
+
+exports["default"] = Motion;
+process.env.NODE_ENV !== "production" ? Motion.propTypes = {
+  // TOOD: warn against putting a config in here
+  defaultStyle: _propTypes["default"].objectOf(_propTypes["default"].number),
+  style: _propTypes["default"].objectOf(_propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].object])).isRequired,
+  children: _propTypes["default"].func.isRequired,
+  onRest: _propTypes["default"].func
+} : void 0;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/StaggeredMotion.js b/ddb_main/node_modules/@serprex/react-motion/lib/StaggeredMotion.js
new file mode 100644
index 0000000..26652ca
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/StaggeredMotion.js
@@ -0,0 +1,283 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _mapToZero = _interopRequireDefault(require("./mapToZero"));
+
+var _stripStyle = _interopRequireDefault(require("./stripStyle"));
+
+var _stepper3 = _interopRequireDefault(require("./stepper"));
+
+var _performanceNow = _interopRequireDefault(require("performance-now"));
+
+var _raf = _interopRequireDefault(require("raf"));
+
+var _shouldStopAnimation = _interopRequireDefault(require("./shouldStopAnimation"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+var msPerFrame = 1000 / 60;
+
+function shouldStopAnimationAll(currentStyles, styles, currentVelocities) {
+  for (var i = 0; i < currentStyles.length; i++) {
+    if (!(0, _shouldStopAnimation["default"])(currentStyles[i], styles[i], currentVelocities[i])) {
+      return false;
+    }
+  }
+
+  return true;
+}
+
+var StaggeredMotion = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(StaggeredMotion, _React$Component);
+
+  function StaggeredMotion(props) {
+    var _this;
+
+    _this = _React$Component.call(this, props) || this;
+    _this.unmounting = false;
+    _this.animationID = null;
+    _this.prevTime = 0;
+    _this.accumulatedTime = 0;
+    _this.unreadPropStyles = null;
+
+    _this.clearUnreadPropStyle = function (unreadPropStyles) {
+      var _this$state = _this.state,
+          currentStyles = _this$state.currentStyles,
+          currentVelocities = _this$state.currentVelocities,
+          lastIdealStyles = _this$state.lastIdealStyles,
+          lastIdealVelocities = _this$state.lastIdealVelocities;
+      var someDirty = false;
+
+      for (var i = 0; i < unreadPropStyles.length; i++) {
+        var unreadPropStyle = unreadPropStyles[i];
+        var dirty = false;
+
+        for (var key in unreadPropStyle) {
+          if (!Object.prototype.hasOwnProperty.call(unreadPropStyle, key)) {
+            continue;
+          }
+
+          var styleValue = unreadPropStyle[key];
+
+          if (typeof styleValue === 'number') {
+            if (!dirty) {
+              dirty = true;
+              someDirty = true;
+              currentStyles[i] = _extends({}, currentStyles[i]);
+              currentVelocities[i] = _extends({}, currentVelocities[i]);
+              lastIdealStyles[i] = _extends({}, lastIdealStyles[i]);
+              lastIdealVelocities[i] = _extends({}, lastIdealVelocities[i]);
+            }
+
+            currentStyles[i][key] = styleValue;
+            currentVelocities[i][key] = 0;
+            lastIdealStyles[i][key] = styleValue;
+            lastIdealVelocities[i][key] = 0;
+          }
+        }
+      }
+
+      if (someDirty) {
+        _this.setState({
+          currentStyles: currentStyles,
+          currentVelocities: currentVelocities,
+          lastIdealStyles: lastIdealStyles,
+          lastIdealVelocities: lastIdealVelocities
+        });
+      }
+    };
+
+    _this.startAnimationIfNecessary = function () {
+      if (_this.unmounting || _this.animationID != null) {
+        return;
+      } // TODO: when config is {a: 10} and dest is {a: 10} do we raf once and
+      // call cb? No, otherwise accidental parent rerender causes cb trigger
+
+
+      _this.animationID = (0, _raf["default"])(function (timestamp) {
+        // https://github.com/chenglou/react-motion/pull/420
+        // > if execution passes the conditional if (this.unmounting), then
+        // executes async defaultRaf and after that component unmounts and after
+        // that the callback of defaultRaf is called, then setState will be called
+        // on unmounted component.
+        if (_this.unmounting) {
+          return;
+        }
+
+        var destStyles = _this.props.styles(_this.state.lastIdealStyles); // check if we need to animate in the first place
+
+
+        if (shouldStopAnimationAll(_this.state.currentStyles, destStyles, _this.state.currentVelocities)) {
+          // no need to cancel animationID here; shouldn't have any in flight
+          _this.animationID = null;
+          _this.accumulatedTime = 0;
+          return;
+        }
+
+        var currentTime = timestamp || (0, _performanceNow["default"])();
+        var timeDelta = currentTime - _this.prevTime;
+        _this.prevTime = currentTime;
+        _this.accumulatedTime = _this.accumulatedTime + timeDelta; // more than 10 frames? prolly switched browser tab. Restart
+
+        if (_this.accumulatedTime > msPerFrame * 10) {
+          _this.accumulatedTime = 0;
+        }
+
+        if (_this.accumulatedTime === 0) {
+          // no need to cancel animationID here; shouldn't have any in flight
+          _this.animationID = null;
+
+          _this.startAnimationIfNecessary();
+
+          return;
+        }
+
+        var currentFrameCompletion = (_this.accumulatedTime - Math.floor(_this.accumulatedTime / msPerFrame) * msPerFrame) / msPerFrame;
+        var framesToCatchUp = Math.floor(_this.accumulatedTime / msPerFrame);
+        var newLastIdealStyles = [];
+        var newLastIdealVelocities = [];
+        var newCurrentStyles = [];
+        var newCurrentVelocities = [];
+
+        for (var i = 0; i < destStyles.length; i++) {
+          var destStyle = destStyles[i];
+          var newCurrentStyle = {};
+          var newCurrentVelocity = {};
+          var newLastIdealStyle = {};
+          var newLastIdealVelocity = {};
+
+          for (var key in destStyle) {
+            if (!Object.prototype.hasOwnProperty.call(destStyle, key)) {
+              continue;
+            }
+
+            var styleValue = destStyle[key];
+
+            if (typeof styleValue === 'number') {
+              newCurrentStyle[key] = styleValue;
+              newCurrentVelocity[key] = 0;
+              newLastIdealStyle[key] = styleValue;
+              newLastIdealVelocity[key] = 0;
+            } else {
+              var newLastIdealStyleValue = _this.state.lastIdealStyles[i][key];
+              var newLastIdealVelocityValue = _this.state.lastIdealVelocities[i][key];
+
+              for (var j = 0; j < framesToCatchUp; j++) {
+                var _stepper = (0, _stepper3["default"])(msPerFrame / 1000, newLastIdealStyleValue, newLastIdealVelocityValue, styleValue.val, styleValue.stiffness, styleValue.damping, styleValue.precision);
+
+                newLastIdealStyleValue = _stepper[0];
+                newLastIdealVelocityValue = _stepper[1];
+              }
+
+              var _stepper2 = (0, _stepper3["default"])(msPerFrame / 1000, newLastIdealStyleValue, newLastIdealVelocityValue, styleValue.val, styleValue.stiffness, styleValue.damping, styleValue.precision),
+                  nextIdealX = _stepper2[0],
+                  nextIdealV = _stepper2[1];
+
+              newCurrentStyle[key] = newLastIdealStyleValue + (nextIdealX - newLastIdealStyleValue) * currentFrameCompletion;
+              newCurrentVelocity[key] = newLastIdealVelocityValue + (nextIdealV - newLastIdealVelocityValue) * currentFrameCompletion;
+              newLastIdealStyle[key] = newLastIdealStyleValue;
+              newLastIdealVelocity[key] = newLastIdealVelocityValue;
+            }
+          }
+
+          newCurrentStyles[i] = newCurrentStyle;
+          newCurrentVelocities[i] = newCurrentVelocity;
+          newLastIdealStyles[i] = newLastIdealStyle;
+          newLastIdealVelocities[i] = newLastIdealVelocity;
+        }
+
+        _this.animationID = null; // the amount we're looped over above
+
+        _this.accumulatedTime -= framesToCatchUp * msPerFrame;
+
+        _this.setState({
+          currentStyles: newCurrentStyles,
+          currentVelocities: newCurrentVelocities,
+          lastIdealStyles: newLastIdealStyles,
+          lastIdealVelocities: newLastIdealVelocities
+        });
+
+        _this.unreadPropStyles = null;
+
+        _this.startAnimationIfNecessary();
+      });
+    };
+
+    _this.state = _this.defaultState();
+    return _this;
+  }
+
+  var _proto = StaggeredMotion.prototype;
+
+  _proto.defaultState = function defaultState() {
+    var _this$props = this.props,
+        defaultStyles = _this$props.defaultStyles,
+        styles = _this$props.styles;
+    var currentStyles = defaultStyles || styles().map(_stripStyle["default"]);
+    var currentVelocities = currentStyles.map(function (currentStyle) {
+      return (0, _mapToZero["default"])(currentStyle);
+    });
+    return {
+      currentStyles: currentStyles,
+      currentVelocities: currentVelocities,
+      lastIdealStyles: currentStyles,
+      lastIdealVelocities: currentVelocities
+    };
+  };
+
+  _proto.componentDidMount = function componentDidMount() {
+    this.prevTime = (0, _performanceNow["default"])();
+    this.startAnimationIfNecessary();
+  };
+
+  _proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(props) {
+    if (this.unreadPropStyles != null) {
+      // previous props haven't had the chance to be set yet; set them here
+      this.clearUnreadPropStyle(this.unreadPropStyles);
+    }
+
+    this.unreadPropStyles = props.styles(this.state.lastIdealStyles);
+
+    if (this.animationID == null) {
+      this.prevTime = (0, _performanceNow["default"])();
+      this.startAnimationIfNecessary();
+    }
+  };
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    this.unmounting = true;
+
+    if (this.animationID != null) {
+      _raf["default"].cancel(this.animationID);
+
+      this.animationID = null;
+    }
+  };
+
+  _proto.render = function render() {
+    var renderedChildren = this.props.children(this.state.currentStyles);
+    return renderedChildren && _react["default"].Children.only(renderedChildren);
+  };
+
+  return StaggeredMotion;
+}(_react["default"].Component);
+
+exports["default"] = StaggeredMotion;
+process.env.NODE_ENV !== "production" ? StaggeredMotion.propTypes = {
+  // TOOD: warn against putting a config in here
+  defaultStyles: _propTypes["default"].arrayOf(_propTypes["default"].objectOf(_propTypes["default"].number)),
+  styles: _propTypes["default"].func.isRequired,
+  children: _propTypes["default"].func.isRequired
+} : void 0;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/TransitionMotion.js b/ddb_main/node_modules/@serprex/react-motion/lib/TransitionMotion.js
new file mode 100644
index 0000000..a4eb490
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/TransitionMotion.js
@@ -0,0 +1,501 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _mapToZero = _interopRequireDefault(require("./mapToZero"));
+
+var _stripStyle = _interopRequireDefault(require("./stripStyle"));
+
+var _stepper3 = _interopRequireDefault(require("./stepper"));
+
+var _mergeDiff = _interopRequireDefault(require("./mergeDiff"));
+
+var _performanceNow = _interopRequireDefault(require("performance-now"));
+
+var _raf = _interopRequireDefault(require("raf"));
+
+var _shouldStopAnimation = _interopRequireDefault(require("./shouldStopAnimation"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+var msPerFrame = 1000 / 60; // the children function & (potential) styles function asks as param an
+// Array<TransitionPlainStyle>, where each TransitionPlainStyle is of the format
+// {key: string, data?: any, style: PlainStyle}. However, the way we keep
+// internal states doesn't contain such a data structure (check the state and
+// TransitionMotionState). So when children function and others ask for such
+// data we need to generate them on the fly by combining mergedPropsStyles and
+// currentStyles/lastIdealStyles
+
+function rehydrateStyles(mergedPropsStyles, unreadPropStyles, plainStyles) {
+  // Copy the value to a `const` so that Flow understands that the const won't
+  // change and will be non-nullable in the callback below.
+  var cUnreadPropStyles = unreadPropStyles;
+
+  if (cUnreadPropStyles == null) {
+    return mergedPropsStyles.map(function (mergedPropsStyle, i) {
+      return {
+        key: mergedPropsStyle.key,
+        data: mergedPropsStyle.data,
+        style: plainStyles[i]
+      };
+    });
+  }
+
+  return mergedPropsStyles.map(function (mergedPropsStyle, i) {
+    for (var j = 0; j < cUnreadPropStyles.length; j++) {
+      if (cUnreadPropStyles[j].key === mergedPropsStyle.key) {
+        return {
+          key: cUnreadPropStyles[j].key,
+          data: cUnreadPropStyles[j].data,
+          style: plainStyles[i]
+        };
+      }
+    }
+
+    return {
+      key: mergedPropsStyle.key,
+      data: mergedPropsStyle.data,
+      style: plainStyles[i]
+    };
+  });
+}
+
+function shouldStopAnimationAll(currentStyles, destStyles, currentVelocities, mergedPropsStyles) {
+  if (mergedPropsStyles.length !== destStyles.length) {
+    return false;
+  }
+
+  for (var i = 0; i < mergedPropsStyles.length; i++) {
+    if (mergedPropsStyles[i].key !== destStyles[i].key) {
+      return false;
+    }
+  } // we have the invariant that mergedPropsStyles and
+  // currentStyles/currentVelocities/last* are synced in terms of cells, see
+  // mergeAndSync comment for more info
+
+
+  for (var _i = 0; _i < mergedPropsStyles.length; _i++) {
+    if (!(0, _shouldStopAnimation["default"])(currentStyles[_i], destStyles[_i].style, currentVelocities[_i])) {
+      return false;
+    }
+  }
+
+  return true;
+} // core key merging logic
+// things to do: say previously merged style is {a, b}, dest style (prop) is {b,
+// c}, previous current (interpolating) style is {a, b}
+// **invariant**: current[i] corresponds to merged[i] in terms of key
+// steps:
+// turn merged style into {a?, b, c}
+//    add c, value of c is destStyles.c
+//    maybe remove a, aka call willLeave(a), then merged is either {b, c} or {a, b, c}
+// turn current (interpolating) style from {a, b} into {a?, b, c}
+//    maybe remove a
+//    certainly add c, value of c is willEnter(c)
+// loop over merged and construct new current
+// dest doesn't change, that's owner's
+
+
+function mergeAndSync(willEnter, willLeave, didLeave, oldMergedPropsStyles, destStyles, oldCurrentStyles, oldCurrentVelocities, oldLastIdealStyles, oldLastIdealVelocities) {
+  var newMergedPropsStyles = (0, _mergeDiff["default"])(oldMergedPropsStyles, destStyles, function (oldIndex, oldMergedPropsStyle) {
+    var leavingStyle = willLeave(oldMergedPropsStyle);
+
+    if (leavingStyle == null) {
+      didLeave({
+        key: oldMergedPropsStyle.key,
+        data: oldMergedPropsStyle.data
+      });
+      return null;
+    }
+
+    if ((0, _shouldStopAnimation["default"])(oldCurrentStyles[oldIndex], leavingStyle, oldCurrentVelocities[oldIndex])) {
+      didLeave({
+        key: oldMergedPropsStyle.key,
+        data: oldMergedPropsStyle.data
+      });
+      return null;
+    }
+
+    return {
+      key: oldMergedPropsStyle.key,
+      data: oldMergedPropsStyle.data,
+      style: leavingStyle
+    };
+  });
+  var newCurrentStyles = [];
+  var newCurrentVelocities = [];
+  var newLastIdealStyles = [];
+  var newLastIdealVelocities = [];
+
+  for (var i = 0; i < newMergedPropsStyles.length; i++) {
+    var newMergedPropsStyleCell = newMergedPropsStyles[i];
+    var foundOldIndex = null;
+
+    for (var j = 0; j < oldMergedPropsStyles.length; j++) {
+      if (oldMergedPropsStyles[j].key === newMergedPropsStyleCell.key) {
+        foundOldIndex = j;
+        break;
+      }
+    } // TODO: key search code
+
+
+    if (foundOldIndex == null) {
+      var plainStyle = willEnter(newMergedPropsStyleCell);
+      newCurrentStyles[i] = plainStyle;
+      newLastIdealStyles[i] = plainStyle;
+      var velocity = (0, _mapToZero["default"])(newMergedPropsStyleCell.style);
+      newCurrentVelocities[i] = velocity;
+      newLastIdealVelocities[i] = velocity;
+    } else {
+      newCurrentStyles[i] = oldCurrentStyles[foundOldIndex];
+      newLastIdealStyles[i] = oldLastIdealStyles[foundOldIndex];
+      newCurrentVelocities[i] = oldCurrentVelocities[foundOldIndex];
+      newLastIdealVelocities[i] = oldLastIdealVelocities[foundOldIndex];
+    }
+  }
+
+  return [newMergedPropsStyles, newCurrentStyles, newCurrentVelocities, newLastIdealStyles, newLastIdealVelocities];
+}
+
+var TransitionMotion = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(TransitionMotion, _React$Component);
+
+  // it's possible that currentStyle's value is stale: if props is immediately
+  // changed from 0 to 400 to spring(0) again, the async currentStyle is still
+  // at 0 (didn't have time to tick and interpolate even once). If we naively
+  // compare currentStyle with destVal it'll be 0 === 0 (no animation, stop).
+  // In reality currentStyle should be 400
+  function TransitionMotion(props) {
+    var _this;
+
+    _this = _React$Component.call(this, props) || this;
+    _this.unmounting = false;
+    _this.animationID = null;
+    _this.prevTime = 0;
+    _this.accumulatedTime = 0;
+    _this.unreadPropStyles = null;
+
+    _this.clearUnreadPropStyle = function (unreadPropStyles) {
+      var _mergeAndSync = mergeAndSync(_this.props.willEnter, _this.props.willLeave, _this.props.didLeave, _this.state.mergedPropsStyles, unreadPropStyles, _this.state.currentStyles, _this.state.currentVelocities, _this.state.lastIdealStyles, _this.state.lastIdealVelocities),
+          mergedPropsStyles = _mergeAndSync[0],
+          currentStyles = _mergeAndSync[1],
+          currentVelocities = _mergeAndSync[2],
+          lastIdealStyles = _mergeAndSync[3],
+          lastIdealVelocities = _mergeAndSync[4];
+
+      for (var i = 0; i < unreadPropStyles.length; i++) {
+        var unreadPropStyle = unreadPropStyles[i].style;
+        var dirty = false;
+
+        for (var key in unreadPropStyle) {
+          if (!Object.prototype.hasOwnProperty.call(unreadPropStyle, key)) {
+            continue;
+          }
+
+          var styleValue = unreadPropStyle[key];
+
+          if (typeof styleValue === 'number') {
+            if (!dirty) {
+              dirty = true;
+              currentStyles[i] = _extends({}, currentStyles[i]);
+              currentVelocities[i] = _extends({}, currentVelocities[i]);
+              lastIdealStyles[i] = _extends({}, lastIdealStyles[i]);
+              lastIdealVelocities[i] = _extends({}, lastIdealVelocities[i]);
+              mergedPropsStyles[i] = {
+                key: mergedPropsStyles[i].key,
+                data: mergedPropsStyles[i].data,
+                style: _extends({}, mergedPropsStyles[i].style)
+              };
+            }
+
+            currentStyles[i][key] = styleValue;
+            currentVelocities[i][key] = 0;
+            lastIdealStyles[i][key] = styleValue;
+            lastIdealVelocities[i][key] = 0;
+            mergedPropsStyles[i].style[key] = styleValue;
+          }
+        }
+      } // unlike the other 2 components, we can't detect staleness and optionally
+      // opt out of setState here. each style object's data might contain new
+      // stuff we're not/cannot compare
+
+
+      _this.setState({
+        currentStyles: currentStyles,
+        currentVelocities: currentVelocities,
+        mergedPropsStyles: mergedPropsStyles,
+        lastIdealStyles: lastIdealStyles,
+        lastIdealVelocities: lastIdealVelocities
+      });
+    };
+
+    _this.startAnimationIfNecessary = function () {
+      if (_this.unmounting || _this.animationID != null) {
+        return;
+      } // TODO: when config is {a: 10} and dest is {a: 10} do we raf once and
+      // call cb? No, otherwise accidental parent rerender causes cb trigger
+
+
+      _this.animationID = (0, _raf["default"])(function (timestamp) {
+        // https://github.com/chenglou/react-motion/pull/420
+        // > if execution passes the conditional if (this.unmounting), then
+        // executes async defaultRaf and after that component unmounts and after
+        // that the callback of defaultRaf is called, then setState will be called
+        // on unmounted component.
+        if (_this.unmounting) {
+          return;
+        }
+
+        var propStyles = _this.props.styles;
+        var destStyles = typeof propStyles === 'function' ? propStyles(rehydrateStyles(_this.state.mergedPropsStyles, _this.unreadPropStyles, _this.state.lastIdealStyles)) : propStyles; // check if we need to animate in the first place
+
+        if (shouldStopAnimationAll(_this.state.currentStyles, destStyles, _this.state.currentVelocities, _this.state.mergedPropsStyles)) {
+          // no need to cancel animationID here; shouldn't have any in flight
+          _this.animationID = null;
+          _this.accumulatedTime = 0;
+          return;
+        }
+
+        var currentTime = timestamp || (0, _performanceNow["default"])();
+        var timeDelta = currentTime - _this.prevTime;
+        _this.prevTime = currentTime;
+        _this.accumulatedTime = _this.accumulatedTime + timeDelta; // more than 10 frames? prolly switched browser tab. Restart
+
+        if (_this.accumulatedTime > msPerFrame * 10) {
+          _this.accumulatedTime = 0;
+        }
+
+        if (_this.accumulatedTime === 0) {
+          // no need to cancel animationID here; shouldn't have any in flight
+          _this.animationID = null;
+
+          _this.startAnimationIfNecessary();
+
+          return;
+        }
+
+        var currentFrameCompletion = (_this.accumulatedTime - Math.floor(_this.accumulatedTime / msPerFrame) * msPerFrame) / msPerFrame;
+        var framesToCatchUp = Math.floor(_this.accumulatedTime / msPerFrame);
+
+        var _mergeAndSync2 = mergeAndSync(_this.props.willEnter, _this.props.willLeave, _this.props.didLeave, _this.state.mergedPropsStyles, destStyles, _this.state.currentStyles, _this.state.currentVelocities, _this.state.lastIdealStyles, _this.state.lastIdealVelocities),
+            newMergedPropsStyles = _mergeAndSync2[0],
+            newCurrentStyles = _mergeAndSync2[1],
+            newCurrentVelocities = _mergeAndSync2[2],
+            newLastIdealStyles = _mergeAndSync2[3],
+            newLastIdealVelocities = _mergeAndSync2[4];
+
+        for (var i = 0; i < newMergedPropsStyles.length; i++) {
+          var newMergedPropsStyle = newMergedPropsStyles[i].style;
+          var newCurrentStyle = {};
+          var newCurrentVelocity = {};
+          var newLastIdealStyle = {};
+          var newLastIdealVelocity = {};
+
+          for (var key in newMergedPropsStyle) {
+            if (!Object.prototype.hasOwnProperty.call(newMergedPropsStyle, key)) {
+              continue;
+            }
+
+            var styleValue = newMergedPropsStyle[key];
+
+            if (typeof styleValue === 'number') {
+              newCurrentStyle[key] = styleValue;
+              newCurrentVelocity[key] = 0;
+              newLastIdealStyle[key] = styleValue;
+              newLastIdealVelocity[key] = 0;
+            } else {
+              var newLastIdealStyleValue = newLastIdealStyles[i][key];
+              var newLastIdealVelocityValue = newLastIdealVelocities[i][key];
+
+              for (var j = 0; j < framesToCatchUp; j++) {
+                var _stepper = (0, _stepper3["default"])(msPerFrame / 1000, newLastIdealStyleValue, newLastIdealVelocityValue, styleValue.val, styleValue.stiffness, styleValue.damping, styleValue.precision);
+
+                newLastIdealStyleValue = _stepper[0];
+                newLastIdealVelocityValue = _stepper[1];
+              }
+
+              var _stepper2 = (0, _stepper3["default"])(msPerFrame / 1000, newLastIdealStyleValue, newLastIdealVelocityValue, styleValue.val, styleValue.stiffness, styleValue.damping, styleValue.precision),
+                  nextIdealX = _stepper2[0],
+                  nextIdealV = _stepper2[1];
+
+              newCurrentStyle[key] = newLastIdealStyleValue + (nextIdealX - newLastIdealStyleValue) * currentFrameCompletion;
+              newCurrentVelocity[key] = newLastIdealVelocityValue + (nextIdealV - newLastIdealVelocityValue) * currentFrameCompletion;
+              newLastIdealStyle[key] = newLastIdealStyleValue;
+              newLastIdealVelocity[key] = newLastIdealVelocityValue;
+            }
+          }
+
+          newLastIdealStyles[i] = newLastIdealStyle;
+          newLastIdealVelocities[i] = newLastIdealVelocity;
+          newCurrentStyles[i] = newCurrentStyle;
+          newCurrentVelocities[i] = newCurrentVelocity;
+        }
+
+        _this.animationID = null; // the amount we're looped over above
+
+        _this.accumulatedTime -= framesToCatchUp * msPerFrame;
+
+        _this.setState({
+          currentStyles: newCurrentStyles,
+          currentVelocities: newCurrentVelocities,
+          lastIdealStyles: newLastIdealStyles,
+          lastIdealVelocities: newLastIdealVelocities,
+          mergedPropsStyles: newMergedPropsStyles
+        });
+
+        _this.unreadPropStyles = null;
+
+        _this.startAnimationIfNecessary();
+      });
+    };
+
+    _this.state = _this.defaultState();
+    return _this;
+  }
+
+  var _proto = TransitionMotion.prototype;
+
+  _proto.defaultState = function defaultState() {
+    var _this$props = this.props,
+        defaultStyles = _this$props.defaultStyles,
+        styles = _this$props.styles,
+        willEnter = _this$props.willEnter,
+        willLeave = _this$props.willLeave,
+        didLeave = _this$props.didLeave;
+    var destStyles = typeof styles === 'function' ? styles(defaultStyles) : styles; // this is special. for the first time around, we don't have a comparison
+    // between last (no last) and current merged props. we'll compute last so:
+    // say default is {a, b} and styles (dest style) is {b, c}, we'll
+    // fabricate last as {a, b}
+
+    var oldMergedPropsStyles;
+
+    if (defaultStyles == null) {
+      oldMergedPropsStyles = destStyles;
+    } else {
+      oldMergedPropsStyles = defaultStyles.map(function (defaultStyleCell) {
+        // TODO: key search code
+        for (var i = 0; i < destStyles.length; i++) {
+          if (destStyles[i].key === defaultStyleCell.key) {
+            return destStyles[i];
+          }
+        }
+
+        return defaultStyleCell;
+      });
+    }
+
+    var oldCurrentStyles = defaultStyles == null ? destStyles.map(function (s) {
+      return (0, _stripStyle["default"])(s.style);
+    }) : defaultStyles.map(function (s) {
+      return (0, _stripStyle["default"])(s.style);
+    });
+    var oldCurrentVelocities = defaultStyles == null ? destStyles.map(function (s) {
+      return (0, _mapToZero["default"])(s.style);
+    }) : defaultStyles.map(function (s) {
+      return (0, _mapToZero["default"])(s.style);
+    });
+
+    var _mergeAndSync3 = mergeAndSync(willEnter, willLeave, didLeave, oldMergedPropsStyles, destStyles, oldCurrentStyles, oldCurrentVelocities, oldCurrentStyles, // oldLastIdealStyles really
+    oldCurrentVelocities // oldLastIdealVelocities really
+    ),
+        mergedPropsStyles = _mergeAndSync3[0],
+        currentStyles = _mergeAndSync3[1],
+        currentVelocities = _mergeAndSync3[2],
+        lastIdealStyles = _mergeAndSync3[3],
+        lastIdealVelocities = _mergeAndSync3[4];
+
+    return {
+      currentStyles: currentStyles,
+      currentVelocities: currentVelocities,
+      lastIdealStyles: lastIdealStyles,
+      lastIdealVelocities: lastIdealVelocities,
+      mergedPropsStyles: mergedPropsStyles
+    };
+  } // after checking for unreadPropStyles != null, we manually go set the
+  // non-interpolating values (those that are a number, without a spring
+  // config)
+  ;
+
+  _proto.componentDidMount = function componentDidMount() {
+    this.prevTime = (0, _performanceNow["default"])();
+    this.startAnimationIfNecessary();
+  };
+
+  _proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(props) {
+    if (this.unreadPropStyles) {
+      // previous props haven't had the chance to be set yet; set them here
+      this.clearUnreadPropStyle(this.unreadPropStyles);
+    }
+
+    var styles = props.styles;
+
+    if (typeof styles === 'function') {
+      this.unreadPropStyles = styles(rehydrateStyles(this.state.mergedPropsStyles, this.unreadPropStyles, this.state.lastIdealStyles));
+    } else {
+      this.unreadPropStyles = styles;
+    }
+
+    if (this.animationID == null) {
+      this.prevTime = (0, _performanceNow["default"])();
+      this.startAnimationIfNecessary();
+    }
+  };
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    this.unmounting = true;
+
+    if (this.animationID != null) {
+      _raf["default"].cancel(this.animationID);
+
+      this.animationID = null;
+    }
+  };
+
+  _proto.render = function render() {
+    var hydratedStyles = rehydrateStyles(this.state.mergedPropsStyles, this.unreadPropStyles, this.state.currentStyles);
+    var renderedChildren = this.props.children(hydratedStyles);
+    return renderedChildren && _react["default"].Children.only(renderedChildren);
+  };
+
+  return TransitionMotion;
+}(_react["default"].Component);
+
+exports["default"] = TransitionMotion;
+TransitionMotion.defaultProps = {
+  willEnter: function willEnter(styleThatEntered) {
+    return (0, _stripStyle["default"])(styleThatEntered.style);
+  },
+  // recall: returning null makes the current unmounting TransitionStyle
+  // disappear immediately
+  willLeave: function willLeave() {
+    return null;
+  },
+  didLeave: function didLeave() {}
+};
+process.env.NODE_ENV !== "production" ? TransitionMotion.propTypes = {
+  defaultStyles: _propTypes["default"].arrayOf(_propTypes["default"].shape({
+    key: _propTypes["default"].string.isRequired,
+    data: _propTypes["default"].any,
+    style: _propTypes["default"].objectOf(_propTypes["default"].number).isRequired
+  })),
+  styles: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].arrayOf(_propTypes["default"].shape({
+    key: _propTypes["default"].string.isRequired,
+    data: _propTypes["default"].any,
+    style: _propTypes["default"].objectOf(_propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].object])).isRequired
+  }))]).isRequired,
+  children: _propTypes["default"].func.isRequired,
+  willEnter: _propTypes["default"].func,
+  willLeave: _propTypes["default"].func,
+  didLeave: _propTypes["default"].func
+} : void 0;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/mapToZero.js b/ddb_main/node_modules/@serprex/react-motion/lib/mapToZero.js
new file mode 100644
index 0000000..52e770c
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/mapToZero.js
@@ -0,0 +1,17 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = mapToZero;
+
+// currently used to initiate the velocity style object to 0
+function mapToZero(obj) {
+  var ret = {};
+
+  for (var key in obj) {
+    if (Object.prototype.hasOwnProperty.call(obj, key)) {
+      ret[key] = 0;
+    }
+  }
+
+  return ret;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/mergeDiff.js b/ddb_main/node_modules/@serprex/react-motion/lib/mergeDiff.js
new file mode 100644
index 0000000..02a9566
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/mergeDiff.js
@@ -0,0 +1,111 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = mergeDiff;
+
+// core keys merging algorithm. If previous render's keys are [a, b], and the
+// next render's [c, b, d], what's the final merged keys and ordering?
+// - c and a must both be before b
+// - b before d
+// - ordering between a and c ambiguous
+// this reduces to merging two partially ordered lists (e.g. lists where not
+// every item has a definite ordering, like comparing a and c above). For the
+// ambiguous ordering we deterministically choose to place the next render's
+// item after the previous'; so c after a
+// this is called a topological sorting. Except the existing algorithms don't
+// work well with js bc of the amount of allocation, and isn't optimized for our
+// current use-case bc the runtime is linear in terms of edges (see wiki for
+// meaning), which is huge when two lists have many common elements
+function mergeDiff(prev, next, onRemove) {
+  // bookkeeping for easier access of a key's index below. This is 2 allocations +
+  // potentially triggering chrome hash map mode for objs (so it might be faster
+  // to loop through and find a key's index each time), but I no longer care
+  var prevKeyIndex = {};
+
+  for (var i = 0; i < prev.length; i++) {
+    prevKeyIndex[prev[i].key] = i;
+  }
+
+  var nextKeyIndex = {};
+
+  for (var _i = 0; _i < next.length; _i++) {
+    nextKeyIndex[next[_i].key] = _i;
+  } // first, an overly elaborate way of merging prev and next, eliminating
+  // duplicates (in terms of keys). If there's dupe, keep the item in next).
+  // This way of writing it saves allocations
+
+
+  var ret = [];
+
+  for (var _i2 = 0; _i2 < next.length; _i2++) {
+    ret[_i2] = next[_i2];
+  }
+
+  for (var _i3 = 0; _i3 < prev.length; _i3++) {
+    if (!Object.prototype.hasOwnProperty.call(nextKeyIndex, prev[_i3].key)) {
+      // this is called my TM's `mergeAndSync`, which calls willLeave. We don't
+      // merge in keys that the user desires to kill
+      var fill = onRemove(_i3, prev[_i3]);
+
+      if (fill != null) {
+        ret.push(fill);
+      }
+    }
+  } // now all the items all present. Core sorting logic to have the right order
+
+
+  return ret.sort(function (a, b) {
+    var nextOrderA = nextKeyIndex[a.key];
+    var nextOrderB = nextKeyIndex[b.key];
+    var prevOrderA = prevKeyIndex[a.key];
+    var prevOrderB = prevKeyIndex[b.key];
+
+    if (nextOrderA != null && nextOrderB != null) {
+      // both keys in next
+      return nextKeyIndex[a.key] - nextKeyIndex[b.key];
+    } else if (prevOrderA != null && prevOrderB != null) {
+      // both keys in prev
+      return prevKeyIndex[a.key] - prevKeyIndex[b.key];
+    } else if (nextOrderA != null) {
+      // key a in next, key b in prev
+      // how to determine the order between a and b? We find a "pivot" (term
+      // abuse), a key present in both prev and next, that is sandwiched between
+      // a and b. In the context of our above example, if we're comparing a and
+      // d, b's (the only) pivot
+      for (var _i4 = 0; _i4 < next.length; _i4++) {
+        var pivot = next[_i4].key;
+
+        if (!Object.prototype.hasOwnProperty.call(prevKeyIndex, pivot)) {
+          continue;
+        }
+
+        if (nextOrderA < nextKeyIndex[pivot] && prevOrderB > prevKeyIndex[pivot]) {
+          return -1;
+        } else if (nextOrderA > nextKeyIndex[pivot] && prevOrderB < prevKeyIndex[pivot]) {
+          return 1;
+        }
+      } // pluggable. default to: next bigger than prev
+
+
+      return 1;
+    } // prevOrderA, nextOrderB
+
+
+    for (var _i5 = 0; _i5 < next.length; _i5++) {
+      var _pivot = next[_i5].key;
+
+      if (!Object.prototype.hasOwnProperty.call(prevKeyIndex, _pivot)) {
+        continue;
+      }
+
+      if (nextOrderB < nextKeyIndex[_pivot] && prevOrderA > prevKeyIndex[_pivot]) {
+        return 1;
+      } else if (nextOrderB > nextKeyIndex[_pivot] && prevOrderA < prevKeyIndex[_pivot]) {
+        return -1;
+      }
+    } // pluggable. default to: next bigger than prev
+
+
+    return -1;
+  });
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/presets.js b/ddb_main/node_modules/@serprex/react-motion/lib/presets.js
new file mode 100644
index 0000000..11addff
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/presets.js
@@ -0,0 +1,24 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+var _default = {
+  noWobble: {
+    stiffness: 170,
+    damping: 26
+  },
+  // the default, if nothing provided
+  gentle: {
+    stiffness: 120,
+    damping: 14
+  },
+  wobbly: {
+    stiffness: 180,
+    damping: 12
+  },
+  stiff: {
+    stiffness: 210,
+    damping: 20
+  }
+};
+exports["default"] = _default;
\ No newline at end of file
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/react-motion.js b/ddb_main/node_modules/@serprex/react-motion/lib/react-motion.js
new file mode 100644
index 0000000..7b31f6f
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/react-motion.js
@@ -0,0 +1,34 @@
+"use strict";
+
+exports.__esModule = true;
+exports.reorderKeys = exports.stripStyle = exports.presets = exports.spring = exports.TransitionMotion = exports.StaggeredMotion = exports.Motion = void 0;
+
+var _Motion = _interopRequireDefault(require("./Motion"));
+
+exports.Motion = _Motion["default"];
+
+var _StaggeredMotion = _interopRequireDefault(require("./StaggeredMotion"));
+
+exports.StaggeredMotion = _StaggeredMotion["default"];
+
+var _TransitionMotion = _interopRequireDefault(require("./TransitionMotion"));
+
+exports.TransitionMotion = _TransitionMotion["default"];
+
+var _spring = _interopRequireDefault(require("./spring"));
+
+exports.spring = _spring["default"];
+
+var _presets = _interopRequireDefault(require("./presets"));
+
+exports.presets = _presets["default"];
+
+var _stripStyle = _interopRequireDefault(require("./stripStyle"));
+
+exports.stripStyle = _stripStyle["default"];
+
+var _reorderKeys = _interopRequireDefault(require("./reorderKeys"));
+
+exports.reorderKeys = _reorderKeys["default"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
\ No newline at end of file
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/reorderKeys.js b/ddb_main/node_modules/@serprex/react-motion/lib/reorderKeys.js
new file mode 100644
index 0000000..e0d6c25
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/reorderKeys.js
@@ -0,0 +1,14 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = reorderKeys;
+var hasWarned = false;
+
+function reorderKeys() {
+  if (process.env.NODE_ENV === 'development') {
+    if (!hasWarned) {
+      hasWarned = true;
+      console.error("`reorderKeys` has been removed, since it is no longer needed for TransitionMotion's new styles array API.");
+    }
+  }
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/shouldStopAnimation.js b/ddb_main/node_modules/@serprex/react-motion/lib/shouldStopAnimation.js
new file mode 100644
index 0000000..1e6c8ac
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/shouldStopAnimation.js
@@ -0,0 +1,27 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = shouldStopAnimation;
+
+// usage assumption: currentStyle values have already been rendered but it says
+// nothing of whether currentStyle is stale (see unreadPropStyle)
+function shouldStopAnimation(currentStyle, style, currentVelocity) {
+  for (var key in style) {
+    if (!Object.prototype.hasOwnProperty.call(style, key)) {
+      continue;
+    }
+
+    if (currentVelocity[key] !== 0) {
+      return false;
+    }
+
+    var styleValue = typeof style[key] === 'number' ? style[key] : style[key].val; // stepper will have already taken care of rounding precision errors, so
+    // won't have such thing as 0.9999 !=== 1
+
+    if (currentStyle[key] !== styleValue) {
+      return false;
+    }
+  }
+
+  return true;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/spring.js b/ddb_main/node_modules/@serprex/react-motion/lib/spring.js
new file mode 100644
index 0000000..e6f5297
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/spring.js
@@ -0,0 +1,20 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = spring;
+
+var _presets = _interopRequireDefault(require("./presets"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var defaultConfig = _extends({}, _presets["default"].noWobble, {
+  precision: 0.01
+});
+
+function spring(val, config) {
+  return _extends({}, defaultConfig, config, {
+    val: val
+  });
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/stepper.js b/ddb_main/node_modules/@serprex/react-motion/lib/stepper.js
new file mode 100644
index 0000000..4ef76d4
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/stepper.js
@@ -0,0 +1,34 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = stepper;
+// stepper is used a lot. Saves allocation to return the same array wrapper.
+// This is fine and danger-free against mutations because the callsite
+// immediately destructures it and gets the numbers inside without passing the
+// array reference around.
+var reusedTuple = [0, 0];
+
+function stepper(secondPerFrame, x, v, destX, k, b, precision) {
+  // Spring stiffness, in kg / s^2
+  // for animations, destX is really spring length (spring at rest). initial
+  // position is considered as the stretched/compressed position of a spring
+  var Fspring = -k * (x - destX); // Damping, in kg / s
+
+  var Fdamper = -b * v; // usually we put mass here, but for animation purposes, specifying mass is a
+  // bit redundant. you could simply adjust k and b accordingly
+  // let a = (Fspring + Fdamper) / mass;
+
+  var a = Fspring + Fdamper;
+  var newV = v + a * secondPerFrame;
+  var newX = x + newV * secondPerFrame;
+
+  if (Math.abs(newV) < precision && Math.abs(newX - destX) < precision) {
+    reusedTuple[0] = destX;
+    reusedTuple[1] = 0;
+    return reusedTuple;
+  }
+
+  reusedTuple[0] = newX;
+  reusedTuple[1] = newV;
+  return reusedTuple;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/@serprex/react-motion/lib/stripStyle.js b/ddb_main/node_modules/@serprex/react-motion/lib/stripStyle.js
new file mode 100644
index 0000000..d78dd14
--- /dev/null
+++ b/ddb_main/node_modules/@serprex/react-motion/lib/stripStyle.js
@@ -0,0 +1,20 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = stripStyle;
+
+// turn {x: {val: 1, stiffness: 1, damping: 2}, y: 2} generated by
+// `{x: spring(1, {stiffness: 1, damping: 2}), y: 2}` into {x: 1, y: 2}
+function stripStyle(style) {
+  var ret = {};
+
+  for (var key in style) {
+    if (!Object.prototype.hasOwnProperty.call(style, key)) {
+      continue;
+    }
+
+    ret[key] = typeof style[key] === 'number' ? style[key] : style[key].val;
+  }
+
+  return ret;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/axios/index.js b/ddb_main/node_modules/axios/index.js
new file mode 100644
index 0000000..79dfd09
--- /dev/null
+++ b/ddb_main/node_modules/axios/index.js
@@ -0,0 +1 @@
+module.exports = require('./lib/axios');
\ No newline at end of file
diff --git a/ddb_main/node_modules/axios/lib/adapters/xhr.js b/ddb_main/node_modules/axios/lib/adapters/xhr.js
new file mode 100644
index 0000000..e58625a
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/adapters/xhr.js
@@ -0,0 +1,212 @@
+'use strict';
+
+var utils = require('./../utils');
+var settle = require('./../core/settle');
+var cookies = require('./../helpers/cookies');
+var buildURL = require('./../helpers/buildURL');
+var buildFullPath = require('../core/buildFullPath');
+var parseHeaders = require('./../helpers/parseHeaders');
+var isURLSameOrigin = require('./../helpers/isURLSameOrigin');
+var createError = require('../core/createError');
+var transitionalDefaults = require('../defaults/transitional');
+var Cancel = require('../cancel/Cancel');
+
+module.exports = function xhrAdapter(config) {
+  return new Promise(function dispatchXhrRequest(resolve, reject) {
+    var requestData = config.data;
+    var requestHeaders = config.headers;
+    var responseType = config.responseType;
+    var onCanceled;
+    function done() {
+      if (config.cancelToken) {
+        config.cancelToken.unsubscribe(onCanceled);
+      }
+
+      if (config.signal) {
+        config.signal.removeEventListener('abort', onCanceled);
+      }
+    }
+
+    if (utils.isFormData(requestData)) {
+      delete requestHeaders['Content-Type']; // Let the browser set it
+    }
+
+    var request = new XMLHttpRequest();
+
+    // HTTP basic authentication
+    if (config.auth) {
+      var username = config.auth.username || '';
+      var password = config.auth.password ? unescape(encodeURIComponent(config.auth.password)) : '';
+      requestHeaders.Authorization = 'Basic ' + btoa(username + ':' + password);
+    }
+
+    var fullPath = buildFullPath(config.baseURL, config.url);
+    request.open(config.method.toUpperCase(), buildURL(fullPath, config.params, config.paramsSerializer), true);
+
+    // Set the request timeout in MS
+    request.timeout = config.timeout;
+
+    function onloadend() {
+      if (!request) {
+        return;
+      }
+      // Prepare the response
+      var responseHeaders = 'getAllResponseHeaders' in request ? parseHeaders(request.getAllResponseHeaders()) : null;
+      var responseData = !responseType || responseType === 'text' ||  responseType === 'json' ?
+        request.responseText : request.response;
+      var response = {
+        data: responseData,
+        status: request.status,
+        statusText: request.statusText,
+        headers: responseHeaders,
+        config: config,
+        request: request
+      };
+
+      settle(function _resolve(value) {
+        resolve(value);
+        done();
+      }, function _reject(err) {
+        reject(err);
+        done();
+      }, response);
+
+      // Clean up request
+      request = null;
+    }
+
+    if ('onloadend' in request) {
+      // Use onloadend if available
+      request.onloadend = onloadend;
+    } else {
+      // Listen for ready state to emulate onloadend
+      request.onreadystatechange = function handleLoad() {
+        if (!request || request.readyState !== 4) {
+          return;
+        }
+
+        // The request errored out and we didn't get a response, this will be
+        // handled by onerror instead
+        // With one exception: request that using file: protocol, most browsers
+        // will return status as 0 even though it's a successful request
+        if (request.status === 0 && !(request.responseURL && request.responseURL.indexOf('file:') === 0)) {
+          return;
+        }
+        // readystate handler is calling before onerror or ontimeout handlers,
+        // so we should call onloadend on the next 'tick'
+        setTimeout(onloadend);
+      };
+    }
+
+    // Handle browser request cancellation (as opposed to a manual cancellation)
+    request.onabort = function handleAbort() {
+      if (!request) {
+        return;
+      }
+
+      reject(createError('Request aborted', config, 'ECONNABORTED', request));
+
+      // Clean up request
+      request = null;
+    };
+
+    // Handle low level network errors
+    request.onerror = function handleError() {
+      // Real errors are hidden from us by the browser
+      // onerror should only fire if it's a network error
+      reject(createError('Network Error', config, null, request));
+
+      // Clean up request
+      request = null;
+    };
+
+    // Handle timeout
+    request.ontimeout = function handleTimeout() {
+      var timeoutErrorMessage = config.timeout ? 'timeout of ' + config.timeout + 'ms exceeded' : 'timeout exceeded';
+      var transitional = config.transitional || transitionalDefaults;
+      if (config.timeoutErrorMessage) {
+        timeoutErrorMessage = config.timeoutErrorMessage;
+      }
+      reject(createError(
+        timeoutErrorMessage,
+        config,
+        transitional.clarifyTimeoutError ? 'ETIMEDOUT' : 'ECONNABORTED',
+        request));
+
+      // Clean up request
+      request = null;
+    };
+
+    // Add xsrf header
+    // This is only done if running in a standard browser environment.
+    // Specifically not if we're in a web worker, or react-native.
+    if (utils.isStandardBrowserEnv()) {
+      // Add xsrf header
+      var xsrfValue = (config.withCredentials || isURLSameOrigin(fullPath)) && config.xsrfCookieName ?
+        cookies.read(config.xsrfCookieName) :
+        undefined;
+
+      if (xsrfValue) {
+        requestHeaders[config.xsrfHeaderName] = xsrfValue;
+      }
+    }
+
+    // Add headers to the request
+    if ('setRequestHeader' in request) {
+      utils.forEach(requestHeaders, function setRequestHeader(val, key) {
+        if (typeof requestData === 'undefined' && key.toLowerCase() === 'content-type') {
+          // Remove Content-Type if data is undefined
+          delete requestHeaders[key];
+        } else {
+          // Otherwise add header to the request
+          request.setRequestHeader(key, val);
+        }
+      });
+    }
+
+    // Add withCredentials to request if needed
+    if (!utils.isUndefined(config.withCredentials)) {
+      request.withCredentials = !!config.withCredentials;
+    }
+
+    // Add responseType to request if needed
+    if (responseType && responseType !== 'json') {
+      request.responseType = config.responseType;
+    }
+
+    // Handle progress if needed
+    if (typeof config.onDownloadProgress === 'function') {
+      request.addEventListener('progress', config.onDownloadProgress);
+    }
+
+    // Not all browsers support upload events
+    if (typeof config.onUploadProgress === 'function' && request.upload) {
+      request.upload.addEventListener('progress', config.onUploadProgress);
+    }
+
+    if (config.cancelToken || config.signal) {
+      // Handle cancellation
+      // eslint-disable-next-line func-names
+      onCanceled = function(cancel) {
+        if (!request) {
+          return;
+        }
+        reject(!cancel || (cancel && cancel.type) ? new Cancel('canceled') : cancel);
+        request.abort();
+        request = null;
+      };
+
+      config.cancelToken && config.cancelToken.subscribe(onCanceled);
+      if (config.signal) {
+        config.signal.aborted ? onCanceled() : config.signal.addEventListener('abort', onCanceled);
+      }
+    }
+
+    if (!requestData) {
+      requestData = null;
+    }
+
+    // Send the request
+    request.send(requestData);
+  });
+};
diff --git a/ddb_main/node_modules/axios/lib/axios.js b/ddb_main/node_modules/axios/lib/axios.js
new file mode 100644
index 0000000..c032327
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/axios.js
@@ -0,0 +1,57 @@
+'use strict';
+
+var utils = require('./utils');
+var bind = require('./helpers/bind');
+var Axios = require('./core/Axios');
+var mergeConfig = require('./core/mergeConfig');
+var defaults = require('./defaults');
+
+/**
+ * Create an instance of Axios
+ *
+ * @param {Object} defaultConfig The default config for the instance
+ * @return {Axios} A new instance of Axios
+ */
+function createInstance(defaultConfig) {
+  var context = new Axios(defaultConfig);
+  var instance = bind(Axios.prototype.request, context);
+
+  // Copy axios.prototype to instance
+  utils.extend(instance, Axios.prototype, context);
+
+  // Copy context to instance
+  utils.extend(instance, context);
+
+  // Factory for creating new instances
+  instance.create = function create(instanceConfig) {
+    return createInstance(mergeConfig(defaultConfig, instanceConfig));
+  };
+
+  return instance;
+}
+
+// Create the default instance to be exported
+var axios = createInstance(defaults);
+
+// Expose Axios class to allow class inheritance
+axios.Axios = Axios;
+
+// Expose Cancel & CancelToken
+axios.Cancel = require('./cancel/Cancel');
+axios.CancelToken = require('./cancel/CancelToken');
+axios.isCancel = require('./cancel/isCancel');
+axios.VERSION = require('./env/data').version;
+
+// Expose all/spread
+axios.all = function all(promises) {
+  return Promise.all(promises);
+};
+axios.spread = require('./helpers/spread');
+
+// Expose isAxiosError
+axios.isAxiosError = require('./helpers/isAxiosError');
+
+module.exports = axios;
+
+// Allow use of default import syntax in TypeScript
+module.exports.default = axios;
diff --git a/ddb_main/node_modules/axios/lib/cancel/Cancel.js b/ddb_main/node_modules/axios/lib/cancel/Cancel.js
new file mode 100644
index 0000000..e0de400
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/cancel/Cancel.js
@@ -0,0 +1,19 @@
+'use strict';
+
+/**
+ * A `Cancel` is an object that is thrown when an operation is canceled.
+ *
+ * @class
+ * @param {string=} message The message.
+ */
+function Cancel(message) {
+  this.message = message;
+}
+
+Cancel.prototype.toString = function toString() {
+  return 'Cancel' + (this.message ? ': ' + this.message : '');
+};
+
+Cancel.prototype.__CANCEL__ = true;
+
+module.exports = Cancel;
diff --git a/ddb_main/node_modules/axios/lib/cancel/CancelToken.js b/ddb_main/node_modules/axios/lib/cancel/CancelToken.js
new file mode 100644
index 0000000..089d6b9
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/cancel/CancelToken.js
@@ -0,0 +1,119 @@
+'use strict';
+
+var Cancel = require('./Cancel');
+
+/**
+ * A `CancelToken` is an object that can be used to request cancellation of an operation.
+ *
+ * @class
+ * @param {Function} executor The executor function.
+ */
+function CancelToken(executor) {
+  if (typeof executor !== 'function') {
+    throw new TypeError('executor must be a function.');
+  }
+
+  var resolvePromise;
+
+  this.promise = new Promise(function promiseExecutor(resolve) {
+    resolvePromise = resolve;
+  });
+
+  var token = this;
+
+  // eslint-disable-next-line func-names
+  this.promise.then(function(cancel) {
+    if (!token._listeners) return;
+
+    var i;
+    var l = token._listeners.length;
+
+    for (i = 0; i < l; i++) {
+      token._listeners[i](cancel);
+    }
+    token._listeners = null;
+  });
+
+  // eslint-disable-next-line func-names
+  this.promise.then = function(onfulfilled) {
+    var _resolve;
+    // eslint-disable-next-line func-names
+    var promise = new Promise(function(resolve) {
+      token.subscribe(resolve);
+      _resolve = resolve;
+    }).then(onfulfilled);
+
+    promise.cancel = function reject() {
+      token.unsubscribe(_resolve);
+    };
+
+    return promise;
+  };
+
+  executor(function cancel(message) {
+    if (token.reason) {
+      // Cancellation has already been requested
+      return;
+    }
+
+    token.reason = new Cancel(message);
+    resolvePromise(token.reason);
+  });
+}
+
+/**
+ * Throws a `Cancel` if cancellation has been requested.
+ */
+CancelToken.prototype.throwIfRequested = function throwIfRequested() {
+  if (this.reason) {
+    throw this.reason;
+  }
+};
+
+/**
+ * Subscribe to the cancel signal
+ */
+
+CancelToken.prototype.subscribe = function subscribe(listener) {
+  if (this.reason) {
+    listener(this.reason);
+    return;
+  }
+
+  if (this._listeners) {
+    this._listeners.push(listener);
+  } else {
+    this._listeners = [listener];
+  }
+};
+
+/**
+ * Unsubscribe from the cancel signal
+ */
+
+CancelToken.prototype.unsubscribe = function unsubscribe(listener) {
+  if (!this._listeners) {
+    return;
+  }
+  var index = this._listeners.indexOf(listener);
+  if (index !== -1) {
+    this._listeners.splice(index, 1);
+  }
+};
+
+/**
+ * Returns an object that contains a new `CancelToken` and a function that, when called,
+ * cancels the `CancelToken`.
+ */
+CancelToken.source = function source() {
+  var cancel;
+  var token = new CancelToken(function executor(c) {
+    cancel = c;
+  });
+  return {
+    token: token,
+    cancel: cancel
+  };
+};
+
+module.exports = CancelToken;
diff --git a/ddb_main/node_modules/axios/lib/cancel/isCancel.js b/ddb_main/node_modules/axios/lib/cancel/isCancel.js
new file mode 100644
index 0000000..051f3ae
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/cancel/isCancel.js
@@ -0,0 +1,5 @@
+'use strict';
+
+module.exports = function isCancel(value) {
+  return !!(value && value.__CANCEL__);
+};
diff --git a/ddb_main/node_modules/axios/lib/core/Axios.js b/ddb_main/node_modules/axios/lib/core/Axios.js
new file mode 100644
index 0000000..a1be08a
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/core/Axios.js
@@ -0,0 +1,148 @@
+'use strict';
+
+var utils = require('./../utils');
+var buildURL = require('../helpers/buildURL');
+var InterceptorManager = require('./InterceptorManager');
+var dispatchRequest = require('./dispatchRequest');
+var mergeConfig = require('./mergeConfig');
+var validator = require('../helpers/validator');
+
+var validators = validator.validators;
+/**
+ * Create a new instance of Axios
+ *
+ * @param {Object} instanceConfig The default config for the instance
+ */
+function Axios(instanceConfig) {
+  this.defaults = instanceConfig;
+  this.interceptors = {
+    request: new InterceptorManager(),
+    response: new InterceptorManager()
+  };
+}
+
+/**
+ * Dispatch a request
+ *
+ * @param {Object} config The config specific for this request (merged with this.defaults)
+ */
+Axios.prototype.request = function request(configOrUrl, config) {
+  /*eslint no-param-reassign:0*/
+  // Allow for axios('example/url'[, config]) a la fetch API
+  if (typeof configOrUrl === 'string') {
+    config = config || {};
+    config.url = configOrUrl;
+  } else {
+    config = configOrUrl || {};
+  }
+
+  config = mergeConfig(this.defaults, config);
+
+  // Set config.method
+  if (config.method) {
+    config.method = config.method.toLowerCase();
+  } else if (this.defaults.method) {
+    config.method = this.defaults.method.toLowerCase();
+  } else {
+    config.method = 'get';
+  }
+
+  var transitional = config.transitional;
+
+  if (transitional !== undefined) {
+    validator.assertOptions(transitional, {
+      silentJSONParsing: validators.transitional(validators.boolean),
+      forcedJSONParsing: validators.transitional(validators.boolean),
+      clarifyTimeoutError: validators.transitional(validators.boolean)
+    }, false);
+  }
+
+  // filter out skipped interceptors
+  var requestInterceptorChain = [];
+  var synchronousRequestInterceptors = true;
+  this.interceptors.request.forEach(function unshiftRequestInterceptors(interceptor) {
+    if (typeof interceptor.runWhen === 'function' && interceptor.runWhen(config) === false) {
+      return;
+    }
+
+    synchronousRequestInterceptors = synchronousRequestInterceptors && interceptor.synchronous;
+
+    requestInterceptorChain.unshift(interceptor.fulfilled, interceptor.rejected);
+  });
+
+  var responseInterceptorChain = [];
+  this.interceptors.response.forEach(function pushResponseInterceptors(interceptor) {
+    responseInterceptorChain.push(interceptor.fulfilled, interceptor.rejected);
+  });
+
+  var promise;
+
+  if (!synchronousRequestInterceptors) {
+    var chain = [dispatchRequest, undefined];
+
+    Array.prototype.unshift.apply(chain, requestInterceptorChain);
+    chain = chain.concat(responseInterceptorChain);
+
+    promise = Promise.resolve(config);
+    while (chain.length) {
+      promise = promise.then(chain.shift(), chain.shift());
+    }
+
+    return promise;
+  }
+
+
+  var newConfig = config;
+  while (requestInterceptorChain.length) {
+    var onFulfilled = requestInterceptorChain.shift();
+    var onRejected = requestInterceptorChain.shift();
+    try {
+      newConfig = onFulfilled(newConfig);
+    } catch (error) {
+      onRejected(error);
+      break;
+    }
+  }
+
+  try {
+    promise = dispatchRequest(newConfig);
+  } catch (error) {
+    return Promise.reject(error);
+  }
+
+  while (responseInterceptorChain.length) {
+    promise = promise.then(responseInterceptorChain.shift(), responseInterceptorChain.shift());
+  }
+
+  return promise;
+};
+
+Axios.prototype.getUri = function getUri(config) {
+  config = mergeConfig(this.defaults, config);
+  return buildURL(config.url, config.params, config.paramsSerializer).replace(/^\?/, '');
+};
+
+// Provide aliases for supported request methods
+utils.forEach(['delete', 'get', 'head', 'options'], function forEachMethodNoData(method) {
+  /*eslint func-names:0*/
+  Axios.prototype[method] = function(url, config) {
+    return this.request(mergeConfig(config || {}, {
+      method: method,
+      url: url,
+      data: (config || {}).data
+    }));
+  };
+});
+
+utils.forEach(['post', 'put', 'patch'], function forEachMethodWithData(method) {
+  /*eslint func-names:0*/
+  Axios.prototype[method] = function(url, data, config) {
+    return this.request(mergeConfig(config || {}, {
+      method: method,
+      url: url,
+      data: data
+    }));
+  };
+});
+
+module.exports = Axios;
diff --git a/ddb_main/node_modules/axios/lib/core/InterceptorManager.js b/ddb_main/node_modules/axios/lib/core/InterceptorManager.js
new file mode 100644
index 0000000..900f448
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/core/InterceptorManager.js
@@ -0,0 +1,54 @@
+'use strict';
+
+var utils = require('./../utils');
+
+function InterceptorManager() {
+  this.handlers = [];
+}
+
+/**
+ * Add a new interceptor to the stack
+ *
+ * @param {Function} fulfilled The function to handle `then` for a `Promise`
+ * @param {Function} rejected The function to handle `reject` for a `Promise`
+ *
+ * @return {Number} An ID used to remove interceptor later
+ */
+InterceptorManager.prototype.use = function use(fulfilled, rejected, options) {
+  this.handlers.push({
+    fulfilled: fulfilled,
+    rejected: rejected,
+    synchronous: options ? options.synchronous : false,
+    runWhen: options ? options.runWhen : null
+  });
+  return this.handlers.length - 1;
+};
+
+/**
+ * Remove an interceptor from the stack
+ *
+ * @param {Number} id The ID that was returned by `use`
+ */
+InterceptorManager.prototype.eject = function eject(id) {
+  if (this.handlers[id]) {
+    this.handlers[id] = null;
+  }
+};
+
+/**
+ * Iterate over all the registered interceptors
+ *
+ * This method is particularly useful for skipping over any
+ * interceptors that may have become `null` calling `eject`.
+ *
+ * @param {Function} fn The function to call for each interceptor
+ */
+InterceptorManager.prototype.forEach = function forEach(fn) {
+  utils.forEach(this.handlers, function forEachHandler(h) {
+    if (h !== null) {
+      fn(h);
+    }
+  });
+};
+
+module.exports = InterceptorManager;
diff --git a/ddb_main/node_modules/axios/lib/core/buildFullPath.js b/ddb_main/node_modules/axios/lib/core/buildFullPath.js
new file mode 100644
index 0000000..00b2b05
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/core/buildFullPath.js
@@ -0,0 +1,20 @@
+'use strict';
+
+var isAbsoluteURL = require('../helpers/isAbsoluteURL');
+var combineURLs = require('../helpers/combineURLs');
+
+/**
+ * Creates a new URL by combining the baseURL with the requestedURL,
+ * only when the requestedURL is not already an absolute URL.
+ * If the requestURL is absolute, this function returns the requestedURL untouched.
+ *
+ * @param {string} baseURL The base URL
+ * @param {string} requestedURL Absolute or relative URL to combine
+ * @returns {string} The combined full path
+ */
+module.exports = function buildFullPath(baseURL, requestedURL) {
+  if (baseURL && !isAbsoluteURL(requestedURL)) {
+    return combineURLs(baseURL, requestedURL);
+  }
+  return requestedURL;
+};
diff --git a/ddb_main/node_modules/axios/lib/core/createError.js b/ddb_main/node_modules/axios/lib/core/createError.js
new file mode 100644
index 0000000..933680f
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/core/createError.js
@@ -0,0 +1,18 @@
+'use strict';
+
+var enhanceError = require('./enhanceError');
+
+/**
+ * Create an Error with the specified message, config, error code, request and response.
+ *
+ * @param {string} message The error message.
+ * @param {Object} config The config.
+ * @param {string} [code] The error code (for example, 'ECONNABORTED').
+ * @param {Object} [request] The request.
+ * @param {Object} [response] The response.
+ * @returns {Error} The created error.
+ */
+module.exports = function createError(message, config, code, request, response) {
+  var error = new Error(message);
+  return enhanceError(error, config, code, request, response);
+};
diff --git a/ddb_main/node_modules/axios/lib/core/dispatchRequest.js b/ddb_main/node_modules/axios/lib/core/dispatchRequest.js
new file mode 100644
index 0000000..36da48b
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/core/dispatchRequest.js
@@ -0,0 +1,87 @@
+'use strict';
+
+var utils = require('./../utils');
+var transformData = require('./transformData');
+var isCancel = require('../cancel/isCancel');
+var defaults = require('../defaults');
+var Cancel = require('../cancel/Cancel');
+
+/**
+ * Throws a `Cancel` if cancellation has been requested.
+ */
+function throwIfCancellationRequested(config) {
+  if (config.cancelToken) {
+    config.cancelToken.throwIfRequested();
+  }
+
+  if (config.signal && config.signal.aborted) {
+    throw new Cancel('canceled');
+  }
+}
+
+/**
+ * Dispatch a request to the server using the configured adapter.
+ *
+ * @param {object} config The config that is to be used for the request
+ * @returns {Promise} The Promise to be fulfilled
+ */
+module.exports = function dispatchRequest(config) {
+  throwIfCancellationRequested(config);
+
+  // Ensure headers exist
+  config.headers = config.headers || {};
+
+  // Transform request data
+  config.data = transformData.call(
+    config,
+    config.data,
+    config.headers,
+    config.transformRequest
+  );
+
+  // Flatten headers
+  config.headers = utils.merge(
+    config.headers.common || {},
+    config.headers[config.method] || {},
+    config.headers
+  );
+
+  utils.forEach(
+    ['delete', 'get', 'head', 'post', 'put', 'patch', 'common'],
+    function cleanHeaderConfig(method) {
+      delete config.headers[method];
+    }
+  );
+
+  var adapter = config.adapter || defaults.adapter;
+
+  return adapter(config).then(function onAdapterResolution(response) {
+    throwIfCancellationRequested(config);
+
+    // Transform response data
+    response.data = transformData.call(
+      config,
+      response.data,
+      response.headers,
+      config.transformResponse
+    );
+
+    return response;
+  }, function onAdapterRejection(reason) {
+    if (!isCancel(reason)) {
+      throwIfCancellationRequested(config);
+
+      // Transform response data
+      if (reason && reason.response) {
+        reason.response.data = transformData.call(
+          config,
+          reason.response.data,
+          reason.response.headers,
+          config.transformResponse
+        );
+      }
+    }
+
+    return Promise.reject(reason);
+  });
+};
diff --git a/ddb_main/node_modules/axios/lib/core/enhanceError.js b/ddb_main/node_modules/axios/lib/core/enhanceError.js
new file mode 100644
index 0000000..db04ec8
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/core/enhanceError.js
@@ -0,0 +1,43 @@
+'use strict';
+
+/**
+ * Update an Error with the specified config, error code, and response.
+ *
+ * @param {Error} error The error to update.
+ * @param {Object} config The config.
+ * @param {string} [code] The error code (for example, 'ECONNABORTED').
+ * @param {Object} [request] The request.
+ * @param {Object} [response] The response.
+ * @returns {Error} The error.
+ */
+module.exports = function enhanceError(error, config, code, request, response) {
+  error.config = config;
+  if (code) {
+    error.code = code;
+  }
+
+  error.request = request;
+  error.response = response;
+  error.isAxiosError = true;
+
+  error.toJSON = function toJSON() {
+    return {
+      // Standard
+      message: this.message,
+      name: this.name,
+      // Microsoft
+      description: this.description,
+      number: this.number,
+      // Mozilla
+      fileName: this.fileName,
+      lineNumber: this.lineNumber,
+      columnNumber: this.columnNumber,
+      stack: this.stack,
+      // Axios
+      config: this.config,
+      code: this.code,
+      status: this.response && this.response.status ? this.response.status : null
+    };
+  };
+  return error;
+};
diff --git a/ddb_main/node_modules/axios/lib/core/mergeConfig.js b/ddb_main/node_modules/axios/lib/core/mergeConfig.js
new file mode 100644
index 0000000..05d1438
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/core/mergeConfig.js
@@ -0,0 +1,99 @@
+'use strict';
+
+var utils = require('../utils');
+
+/**
+ * Config-specific merge-function which creates a new config-object
+ * by merging two configuration objects together.
+ *
+ * @param {Object} config1
+ * @param {Object} config2
+ * @returns {Object} New object resulting from merging config2 to config1
+ */
+module.exports = function mergeConfig(config1, config2) {
+  // eslint-disable-next-line no-param-reassign
+  config2 = config2 || {};
+  var config = {};
+
+  function getMergedValue(target, source) {
+    if (utils.isPlainObject(target) && utils.isPlainObject(source)) {
+      return utils.merge(target, source);
+    } else if (utils.isPlainObject(source)) {
+      return utils.merge({}, source);
+    } else if (utils.isArray(source)) {
+      return source.slice();
+    }
+    return source;
+  }
+
+  // eslint-disable-next-line consistent-return
+  function mergeDeepProperties(prop) {
+    if (!utils.isUndefined(config2[prop])) {
+      return getMergedValue(config1[prop], config2[prop]);
+    } else if (!utils.isUndefined(config1[prop])) {
+      return getMergedValue(undefined, config1[prop]);
+    }
+  }
+
+  // eslint-disable-next-line consistent-return
+  function valueFromConfig2(prop) {
+    if (!utils.isUndefined(config2[prop])) {
+      return getMergedValue(undefined, config2[prop]);
+    }
+  }
+
+  // eslint-disable-next-line consistent-return
+  function defaultToConfig2(prop) {
+    if (!utils.isUndefined(config2[prop])) {
+      return getMergedValue(undefined, config2[prop]);
+    } else if (!utils.isUndefined(config1[prop])) {
+      return getMergedValue(undefined, config1[prop]);
+    }
+  }
+
+  // eslint-disable-next-line consistent-return
+  function mergeDirectKeys(prop) {
+    if (prop in config2) {
+      return getMergedValue(config1[prop], config2[prop]);
+    } else if (prop in config1) {
+      return getMergedValue(undefined, config1[prop]);
+    }
+  }
+
+  var mergeMap = {
+    'url': valueFromConfig2,
+    'method': valueFromConfig2,
+    'data': valueFromConfig2,
+    'baseURL': defaultToConfig2,
+    'transformRequest': defaultToConfig2,
+    'transformResponse': defaultToConfig2,
+    'paramsSerializer': defaultToConfig2,
+    'timeout': defaultToConfig2,
+    'timeoutMessage': defaultToConfig2,
+    'withCredentials': defaultToConfig2,
+    'adapter': defaultToConfig2,
+    'responseType': defaultToConfig2,
+    'xsrfCookieName': defaultToConfig2,
+    'xsrfHeaderName': defaultToConfig2,
+    'onUploadProgress': defaultToConfig2,
+    'onDownloadProgress': defaultToConfig2,
+    'decompress': defaultToConfig2,
+    'maxContentLength': defaultToConfig2,
+    'maxBodyLength': defaultToConfig2,
+    'transport': defaultToConfig2,
+    'httpAgent': defaultToConfig2,
+    'httpsAgent': defaultToConfig2,
+    'cancelToken': defaultToConfig2,
+    'socketPath': defaultToConfig2,
+    'responseEncoding': defaultToConfig2,
+    'validateStatus': mergeDirectKeys
+  };
+
+  utils.forEach(Object.keys(config1).concat(Object.keys(config2)), function computeConfigValue(prop) {
+    var merge = mergeMap[prop] || mergeDeepProperties;
+    var configValue = merge(prop);
+    (utils.isUndefined(configValue) && merge !== mergeDirectKeys) || (config[prop] = configValue);
+  });
+
+  return config;
+};
diff --git a/ddb_main/node_modules/axios/lib/core/settle.js b/ddb_main/node_modules/axios/lib/core/settle.js
new file mode 100644
index 0000000..886adb0
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/core/settle.js
@@ -0,0 +1,25 @@
+'use strict';
+
+var createError = require('./createError');
+
+/**
+ * Resolve or reject a Promise based on response status.
+ *
+ * @param {Function} resolve A function that resolves the promise.
+ * @param {Function} reject A function that rejects the promise.
+ * @param {object} response The response.
+ */
+module.exports = function settle(resolve, reject, response) {
+  var validateStatus = response.config.validateStatus;
+  if (!response.status || !validateStatus || validateStatus(response.status)) {
+    resolve(response);
+  } else {
+    reject(createError(
+      'Request failed with status code ' + response.status,
+      response.config,
+      null,
+      response.request,
+      response
+    ));
+  }
+};
diff --git a/ddb_main/node_modules/axios/lib/core/transformData.js b/ddb_main/node_modules/axios/lib/core/transformData.js
new file mode 100644
index 0000000..82ee7dd
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/core/transformData.js
@@ -0,0 +1,22 @@
+'use strict';
+
+var utils = require('./../utils');
+var defaults = require('../defaults');
+
+/**
+ * Transform the data for a request or a response
+ *
+ * @param {Object|String} data The data to be transformed
+ * @param {Array} headers The headers for the request or response
+ * @param {Array|Function} fns A single function or Array of functions
+ * @returns {*} The resulting transformed data
+ */
+module.exports = function transformData(data, headers, fns) {
+  var context = this || defaults;
+  /*eslint no-param-reassign:0*/
+  utils.forEach(fns, function transform(fn) {
+    data = fn.call(context, data, headers);
+  });
+
+  return data;
+};
diff --git a/ddb_main/node_modules/axios/lib/defaults/index.js b/ddb_main/node_modules/axios/lib/defaults/index.js
new file mode 100644
index 0000000..8b57b88
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/defaults/index.js
@@ -0,0 +1,131 @@
+'use strict';
+
+var utils = require('../utils');
+var normalizeHeaderName = require('../helpers/normalizeHeaderName');
+var enhanceError = require('../core/enhanceError');
+var transitionalDefaults = require('./transitional');
+
+var DEFAULT_CONTENT_TYPE = {
+  'Content-Type': 'application/x-www-form-urlencoded'
+};
+
+function setContentTypeIfUnset(headers, value) {
+  if (!utils.isUndefined(headers) && utils.isUndefined(headers['Content-Type'])) {
+    headers['Content-Type'] = value;
+  }
+}
+
+function getDefaultAdapter() {
+  var adapter;
+  if (typeof XMLHttpRequest !== 'undefined') {
+    // For browsers use XHR adapter
+    adapter = require('../adapters/xhr');
+  } else if (typeof process !== 'undefined' && Object.prototype.toString.call(process) === '[object process]') {
+    // For node use HTTP adapter
+    adapter = require('../adapters/http');
+  }
+  return adapter;
+}
+
+function stringifySafely(rawValue, parser, encoder) {
+  if (utils.isString(rawValue)) {
+    try {
+      (parser || JSON.parse)(rawValue);
+      return utils.trim(rawValue);
+    } catch (e) {
+      if (e.name !== 'SyntaxError') {
+        throw e;
+      }
+    }
+  }
+
+  return (encoder || JSON.stringify)(rawValue);
+}
+
+var defaults = {
+
+  transitional: transitionalDefaults,
+
+  adapter: getDefaultAdapter(),
+
+  transformRequest: [function transformRequest(data, headers) {
+    normalizeHeaderName(headers, 'Accept');
+    normalizeHeaderName(headers, 'Content-Type');
+
+    if (utils.isFormData(data) ||
+      utils.isArrayBuffer(data) ||
+      utils.isBuffer(data) ||
+      utils.isStream(data) ||
+      utils.isFile(data) ||
+      utils.isBlob(data)
+    ) {
+      return data;
+    }
+    if (utils.isArrayBufferView(data)) {
+      return data.buffer;
+    }
+    if (utils.isURLSearchParams(data)) {
+      setContentTypeIfUnset(headers, 'application/x-www-form-urlencoded;charset=utf-8');
+      return data.toString();
+    }
+    if (utils.isObject(data) || (headers && headers['Content-Type'] === 'application/json')) {
+      setContentTypeIfUnset(headers, 'application/json');
+      return stringifySafely(data);
+    }
+    return data;
+  }],
+
+  transformResponse: [function transformResponse(data) {
+    var transitional = this.transitional || defaults.transitional;
+    var silentJSONParsing = transitional && transitional.silentJSONParsing;
+    var forcedJSONParsing = transitional && transitional.forcedJSONParsing;
+    var strictJSONParsing = !silentJSONParsing && this.responseType === 'json';
+
+    if (strictJSONParsing || (forcedJSONParsing && utils.isString(data) && data.length)) {
+      try {
+        return JSON.parse(data);
+      } catch (e) {
+        if (strictJSONParsing) {
+          if (e.name === 'SyntaxError') {
+            throw enhanceError(e, this, 'E_JSON_PARSE');
+          }
+          throw e;
+        }
+      }
+    }
+
+    return data;
+  }],
+
+  /**
+   * A timeout in milliseconds to abort a request. If set to 0 (default) a
+   * timeout is not created.
+   */
+  timeout: 0,
+
+  xsrfCookieName: 'XSRF-TOKEN',
+  xsrfHeaderName: 'X-XSRF-TOKEN',
+
+  maxContentLength: -1,
+  maxBodyLength: -1,
+
+  validateStatus: function validateStatus(status) {
+    return status >= 200 && status < 300;
+  },
+
+  headers: {
+    common: {
+      'Accept': 'application/json, text/plain, */*'
+    }
+  }
+};
+
+utils.forEach(['delete', 'get', 'head'], function forEachMethodNoData(method) {
+  defaults.headers[method] = {};
+});
+
+utils.forEach(['post', 'put', 'patch'], function forEachMethodWithData(method) {
+  defaults.headers[method] = utils.merge(DEFAULT_CONTENT_TYPE);
+});
+
+module.exports = defaults;
diff --git a/ddb_main/node_modules/axios/lib/defaults/transitional.js b/ddb_main/node_modules/axios/lib/defaults/transitional.js
new file mode 100644
index 0000000..601dd7e
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/defaults/transitional.js
@@ -0,0 +1,7 @@
+'use strict';
+
+module.exports = {
+  silentJSONParsing: true,
+  forcedJSONParsing: true,
+  clarifyTimeoutError: false
+};
diff --git a/ddb_main/node_modules/axios/lib/env/data.js b/ddb_main/node_modules/axios/lib/env/data.js
new file mode 100644
index 0000000..9fd3106
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/env/data.js
@@ -0,0 +1,3 @@
+module.exports = {
+  "version": "0.26.1"
+};
\ No newline at end of file
diff --git a/ddb_main/node_modules/axios/lib/helpers/bind.js b/ddb_main/node_modules/axios/lib/helpers/bind.js
new file mode 100644
index 0000000..6147c60
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/helpers/bind.js
@@ -0,0 +1,11 @@
+'use strict';
+
+module.exports = function bind(fn, thisArg) {
+  return function wrap() {
+    var args = new Array(arguments.length);
+    for (var i = 0; i < args.length; i++) {
+      args[i] = arguments[i];
+    }
+    return fn.apply(thisArg, args);
+  };
+};
diff --git a/ddb_main/node_modules/axios/lib/helpers/buildURL.js b/ddb_main/node_modules/axios/lib/helpers/buildURL.js
new file mode 100644
index 0000000..31595c3
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/helpers/buildURL.js
@@ -0,0 +1,70 @@
+'use strict';
+
+var utils = require('./../utils');
+
+function encode(val) {
+  return encodeURIComponent(val).
+    replace(/%3A/gi, ':').
+    replace(/%24/g, '$').
+    replace(/%2C/gi, ',').
+    replace(/%20/g, '+').
+    replace(/%5B/gi, '[').
+    replace(/%5D/gi, ']');
+}
+
+/**
+ * Build a URL by appending params to the end
+ *
+ * @param {string} url The base of the url (e.g., http://www.google.com)
+ * @param {object} [params] The params to be appended
+ * @returns {string} The formatted url
+ */
+module.exports = function buildURL(url, params, paramsSerializer) {
+  /*eslint no-param-reassign:0*/
+  if (!params) {
+    return url;
+  }
+
+  var serializedParams;
+  if (paramsSerializer) {
+    serializedParams = paramsSerializer(params);
+  } else if (utils.isURLSearchParams(params)) {
+    serializedParams = params.toString();
+  } else {
+    var parts = [];
+
+    utils.forEach(params, function serialize(val, key) {
+      if (val === null || typeof val === 'undefined') {
+        return;
+      }
+
+      if (utils.isArray(val)) {
+        key = key + '[]';
+      } else {
+        val = [val];
+      }
+
+      utils.forEach(val, function parseValue(v) {
+        if (utils.isDate(v)) {
+          v = v.toISOString();
+        } else if (utils.isObject(v)) {
+          v = JSON.stringify(v);
+        }
+        parts.push(encode(key) + '=' + encode(v));
+      });
+    });
+
+    serializedParams = parts.join('&');
+  }
+
+  if (serializedParams) {
+    var hashmarkIndex = url.indexOf('#');
+    if (hashmarkIndex !== -1) {
+      url = url.slice(0, hashmarkIndex);
+    }
+
+    url += (url.indexOf('?') === -1 ? '?' : '&') + serializedParams;
+  }
+
+  return url;
+};
diff --git a/ddb_main/node_modules/axios/lib/helpers/combineURLs.js b/ddb_main/node_modules/axios/lib/helpers/combineURLs.js
new file mode 100644
index 0000000..f1b58a5
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/helpers/combineURLs.js
@@ -0,0 +1,14 @@
+'use strict';
+
+/**
+ * Creates a new URL by combining the specified URLs
+ *
+ * @param {string} baseURL The base URL
+ * @param {string} relativeURL The relative URL
+ * @returns {string} The combined URL
+ */
+module.exports = function combineURLs(baseURL, relativeURL) {
+  return relativeURL
+    ? baseURL.replace(/\/+$/, '') + '/' + relativeURL.replace(/^\/+/, '')
+    : baseURL;
+};
diff --git a/ddb_main/node_modules/axios/lib/helpers/cookies.js b/ddb_main/node_modules/axios/lib/helpers/cookies.js
new file mode 100644
index 0000000..5a8a666
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/helpers/cookies.js
@@ -0,0 +1,53 @@
+'use strict';
+
+var utils = require('./../utils');
+
+module.exports = (
+  utils.isStandardBrowserEnv() ?
+
+  // Standard browser envs support document.cookie
+    (function standardBrowserEnv() {
+      return {
+        write: function write(name, value, expires, path, domain, secure) {
+          var cookie = [];
+          cookie.push(name + '=' + encodeURIComponent(value));
+
+          if (utils.isNumber(expires)) {
+            cookie.push('expires=' + new Date(expires).toGMTString());
+          }
+
+          if (utils.isString(path)) {
+            cookie.push('path=' + path);
+          }
+
+          if (utils.isString(domain)) {
+            cookie.push('domain=' + domain);
+          }
+
+          if (secure === true) {
+            cookie.push('secure');
+          }
+
+          document.cookie = cookie.join('; ');
+        },
+
+        read: function read(name) {
+          var match = document.cookie.match(new RegExp('(^|;\\s*)(' + name + ')=([^;]*)'));
+          return (match ? decodeURIComponent(match[3]) : null);
+        },
+
+        remove: function remove(name) {
+          this.write(name, '', Date.now() - 86400000);
+        }
+      };
+    })() :
+
+  // Non standard browser env (web workers, react-native) lack needed support.
+    (function nonStandardBrowserEnv() {
+      return {
+        write: function write() {},
+        read: function read() { return null; },
+        remove: function remove() {}
+      };
+    })()
+);
diff --git a/ddb_main/node_modules/axios/lib/helpers/isAbsoluteURL.js b/ddb_main/node_modules/axios/lib/helpers/isAbsoluteURL.js
new file mode 100644
index 0000000..43fea78
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/helpers/isAbsoluteURL.js
@@ -0,0 +1,14 @@
+'use strict';
+
+/**
+ * Determines whether the specified URL is absolute
+ *
+ * @param {string} url The URL to test
+ * @returns {boolean} True if the specified URL is absolute, otherwise false
+ */
+module.exports = function isAbsoluteURL(url) {
+  // A URL is considered absolute if it begins with "<scheme>://" or "//" (protocol-relative URL).
+  // RFC 3986 defines scheme name as a sequence of characters beginning with a letter and followed
+  // by any combination of letters, digits, plus, period, or hyphen.
+  return /^([a-z][a-z\d+\-.]*:)?\/\//i.test(url);
+};
diff --git a/ddb_main/node_modules/axios/lib/helpers/isAxiosError.js b/ddb_main/node_modules/axios/lib/helpers/isAxiosError.js
new file mode 100644
index 0000000..a037bec
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/helpers/isAxiosError.js
@@ -0,0 +1,13 @@
+'use strict';
+
+var utils = require('./../utils');
+
+/**
+ * Determines whether the payload is an error thrown by Axios
+ *
+ * @param {*} payload The value to test
+ * @returns {boolean} True if the payload is an error thrown by Axios, otherwise false
+ */
+module.exports = function isAxiosError(payload) {
+  return utils.isObject(payload) && (payload.isAxiosError === true);
+};
diff --git a/ddb_main/node_modules/axios/lib/helpers/isURLSameOrigin.js b/ddb_main/node_modules/axios/lib/helpers/isURLSameOrigin.js
new file mode 100644
index 0000000..f1d89ad
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/helpers/isURLSameOrigin.js
@@ -0,0 +1,68 @@
+'use strict';
+
+var utils = require('./../utils');
+
+module.exports = (
+  utils.isStandardBrowserEnv() ?
+
+  // Standard browser envs have full support of the APIs needed to test
+  // whether the request URL is of the same origin as current location.
+    (function standardBrowserEnv() {
+      var msie = /(msie|trident)/i.test(navigator.userAgent);
+      var urlParsingNode = document.createElement('a');
+      var originURL;
+
+      /**
+    * Parse a URL to discover it's components
+    *
+    * @param {String} url The URL to be parsed
+    * @returns {Object}
+    */
+      function resolveURL(url) {
+        var href = url;
+
+        if (msie) {
+        // IE needs attribute set twice to normalize properties
+          urlParsingNode.setAttribute('href', href);
+          href = urlParsingNode.href;
+        }
+
+        urlParsingNode.setAttribute('href', href);
+
+        // urlParsingNode provides the UrlUtils interface - http://url.spec.whatwg.org/#urlutils
+        return {
+          href: urlParsingNode.href,
+          protocol: urlParsingNode.protocol ? urlParsingNode.protocol.replace(/:$/, '') : '',
+          host: urlParsingNode.host,
+          search: urlParsingNode.search ? urlParsingNode.search.replace(/^\?/, '') : '',
+          hash: urlParsingNode.hash ? urlParsingNode.hash.replace(/^#/, '') : '',
+          hostname: urlParsingNode.hostname,
+          port: urlParsingNode.port,
+          pathname: (urlParsingNode.pathname.charAt(0) === '/') ?
+            urlParsingNode.pathname :
+            '/' + urlParsingNode.pathname
+        };
+      }
+
+      originURL = resolveURL(window.location.href);
+
+      /**
+    * Determine if a URL shares the same origin as the current location
+    *
+    * @param {String} requestURL The URL to test
+    * @returns {boolean} True if URL shares the same origin, otherwise false
+    */
+      return function isURLSameOrigin(requestURL) {
+        var parsed = (utils.isString(requestURL)) ? resolveURL(requestURL) : requestURL;
+        return (parsed.protocol === originURL.protocol &&
+            parsed.host === originURL.host);
+      };
+    })() :
+
+  // Non standard browser envs (web workers, react-native) lack needed support.
+    (function nonStandardBrowserEnv() {
+      return function isURLSameOrigin() {
+        return true;
+      };
+    })()
+);
diff --git a/ddb_main/node_modules/axios/lib/helpers/normalizeHeaderName.js b/ddb_main/node_modules/axios/lib/helpers/normalizeHeaderName.js
new file mode 100644
index 0000000..738c9fe
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/helpers/normalizeHeaderName.js
@@ -0,0 +1,12 @@
+'use strict';
+
+var utils = require('../utils');
+
+module.exports = function normalizeHeaderName(headers, normalizedName) {
+  utils.forEach(headers, function processHeader(value, name) {
+    if (name !== normalizedName && name.toUpperCase() === normalizedName.toUpperCase()) {
+      headers[normalizedName] = value;
+      delete headers[name];
+    }
+  });
+};
diff --git a/ddb_main/node_modules/axios/lib/helpers/parseHeaders.js b/ddb_main/node_modules/axios/lib/helpers/parseHeaders.js
new file mode 100644
index 0000000..8af2cc7
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/helpers/parseHeaders.js
@@ -0,0 +1,53 @@
+'use strict';
+
+var utils = require('./../utils');
+
+// Headers whose duplicates are ignored by node
+// c.f. https://nodejs.org/api/http.html#http_message_headers
+var ignoreDuplicateOf = [
+  'age', 'authorization', 'content-length', 'content-type', 'etag',
+  'expires', 'from', 'host', 'if-modified-since', 'if-unmodified-since',
+  'last-modified', 'location', 'max-forwards', 'proxy-authorization',
+  'referer', 'retry-after', 'user-agent'
+];
+
+/**
+ * Parse headers into an object
+ *
+ * ```
+ * Date: Wed, 27 Aug 2014 08:58:49 GMT
+ * Content-Type: application/json
+ * Connection: keep-alive
+ * Transfer-Encoding: chunked
+ * ```
+ *
+ * @param {String} headers Headers needing to be parsed
+ * @returns {Object} Headers parsed into an object
+ */
+module.exports = function parseHeaders(headers) {
+  var parsed = {};
+  var key;
+  var val;
+  var i;
+
+  if (!headers) { return parsed; }
+
+  utils.forEach(headers.split('\n'), function parser(line) {
+    i = line.indexOf(':');
+    key = utils.trim(line.substr(0, i)).toLowerCase();
+    val = utils.trim(line.substr(i + 1));
+
+    if (key) {
+      if (parsed[key] && ignoreDuplicateOf.indexOf(key) >= 0) {
+        return;
+      }
+      if (key === 'set-cookie') {
+        parsed[key] = (parsed[key] ? parsed[key] : []).concat([val]);
+      } else {
+        parsed[key] = parsed[key] ? parsed[key] + ', ' + val : val;
+      }
+    }
+  });
+
+  return parsed;
+};
diff --git a/ddb_main/node_modules/axios/lib/helpers/spread.js b/ddb_main/node_modules/axios/lib/helpers/spread.js
new file mode 100644
index 0000000..25e3cdd
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/helpers/spread.js
@@ -0,0 +1,27 @@
+'use strict';
+
+/**
+ * Syntactic sugar for invoking a function and expanding an array for arguments.
+ *
+ * Common use case would be to use `Function.prototype.apply`.
+ *
+ *  ```js
+ *  function f(x, y, z) {}
+ *  var args = [1, 2, 3];
+ *  f.apply(null, args);
+ *  ```
+ *
+ * With `spread` this example can be re-written.
+ *
+ *  ```js
+ *  spread(function(x, y, z) {})([1, 2, 3]);
+ *  ```
+ *
+ * @param {Function} callback
+ * @returns {Function}
+ */
+module.exports = function spread(callback) {
+  return function wrap(arr) {
+    return callback.apply(null, arr);
+  };
+};
diff --git a/ddb_main/node_modules/axios/lib/helpers/validator.js b/ddb_main/node_modules/axios/lib/helpers/validator.js
new file mode 100644
index 0000000..a4ec413
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/helpers/validator.js
@@ -0,0 +1,82 @@
+'use strict';
+
+var VERSION = require('../env/data').version;
+
+var validators = {};
+
+// eslint-disable-next-line func-names
+['object', 'boolean', 'number', 'function', 'string', 'symbol'].forEach(function(type, i) {
+  validators[type] = function validator(thing) {
+    return typeof thing === type || 'a' + (i < 1 ? 'n ' : ' ') + type;
+  };
+});
+
+var deprecatedWarnings = {};
+
+/**
+ * Transitional option validator
+ * @param {function|boolean?} validator - set to false if the transitional option has been removed
+ * @param {string?} version - deprecated version / removed since version
+ * @param {string?} message - some message with additional info
+ * @returns {function}
+ */
+validators.transitional = function transitional(validator, version, message) {
+  function formatMessage(opt, desc) {
+    return '[Axios v' + VERSION + '] Transitional option \'' + opt + '\'' + desc + (message ? '. ' + message : '');
+  }
+
+  // eslint-disable-next-line func-names
+  return function(value, opt, opts) {
+    if (validator === false) {
+      throw new Error(formatMessage(opt, ' has been removed' + (version ? ' in ' + version : '')));
+    }
+
+    if (version && !deprecatedWarnings[opt]) {
+      deprecatedWarnings[opt] = true;
+      // eslint-disable-next-line no-console
+      console.warn(
+        formatMessage(
+          opt,
+          ' has been deprecated since v' + version + ' and will be removed in the near future'
+        )
+      );
+    }
+
+    return validator ? validator(value, opt, opts) : true;
+  };
+};
+
+/**
+ * Assert object's properties type
+ * @param {object} options
+ * @param {object} schema
+ * @param {boolean?} allowUnknown
+ */
+
+function assertOptions(options, schema, allowUnknown) {
+  if (typeof options !== 'object') {
+    throw new TypeError('options must be an object');
+  }
+  var keys = Object.keys(options);
+  var i = keys.length;
+  while (i-- > 0) {
+    var opt = keys[i];
+    var validator = schema[opt];
+    if (validator) {
+      var value = options[opt];
+      var result = value === undefined || validator(value, opt, options);
+      if (result !== true) {
+        throw new TypeError('option ' + opt + ' must be ' + result);
+      }
+      continue;
+    }
+    if (allowUnknown !== true) {
+      throw Error('Unknown option ' + opt);
+    }
+  }
+}
+
+module.exports = {
+  assertOptions: assertOptions,
+  validators: validators
+};
diff --git a/ddb_main/node_modules/axios/lib/utils.js b/ddb_main/node_modules/axios/lib/utils.js
new file mode 100644
index 0000000..f0f9043
--- /dev/null
+++ b/ddb_main/node_modules/axios/lib/utils.js
@@ -0,0 +1,349 @@
+'use strict';
+
+var bind = require('./helpers/bind');
+
+// utils is a library of generic helper functions non-specific to axios
+
+var toString = Object.prototype.toString;
+
+/**
+ * Determine if a value is an Array
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is an Array, otherwise false
+ */
+function isArray(val) {
+  return Array.isArray(val);
+}
+
+/**
+ * Determine if a value is undefined
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if the value is undefined, otherwise false
+ */
+function isUndefined(val) {
+  return typeof val === 'undefined';
+}
+
+/**
+ * Determine if a value is a Buffer
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is a Buffer, otherwise false
+ */
+function isBuffer(val) {
+  return val !== null && !isUndefined(val) && val.constructor !== null && !isUndefined(val.constructor)
+    && typeof val.constructor.isBuffer === 'function' && val.constructor.isBuffer(val);
+}
+
+/**
+ * Determine if a value is an ArrayBuffer
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is an ArrayBuffer, otherwise false
+ */
+function isArrayBuffer(val) {
+  return toString.call(val) === '[object ArrayBuffer]';
+}
+
+/**
+ * Determine if a value is a FormData
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is an FormData, otherwise false
+ */
+function isFormData(val) {
+  return toString.call(val) === '[object FormData]';
+}
+
+/**
+ * Determine if a value is a view on an ArrayBuffer
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is a view on an ArrayBuffer, otherwise false
+ */
+function isArrayBufferView(val) {
+  var result;
+  if ((typeof ArrayBuffer !== 'undefined') && (ArrayBuffer.isView)) {
+    result = ArrayBuffer.isView(val);
+  } else {
+    result = (val) && (val.buffer) && (isArrayBuffer(val.buffer));
+  }
+  return result;
+}
+
+/**
+ * Determine if a value is a String
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is a String, otherwise false
+ */
+function isString(val) {
+  return typeof val === 'string';
+}
+
+/**
+ * Determine if a value is a Number
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is a Number, otherwise false
+ */
+function isNumber(val) {
+  return typeof val === 'number';
+}
+
+/**
+ * Determine if a value is an Object
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is an Object, otherwise false
+ */
+function isObject(val) {
+  return val !== null && typeof val === 'object';
+}
+
+/**
+ * Determine if a value is a plain Object
+ *
+ * @param {Object} val The value to test
+ * @return {boolean} True if value is a plain Object, otherwise false
+ */
+function isPlainObject(val) {
+  if (toString.call(val) !== '[object Object]') {
+    return false;
+  }
+
+  var prototype = Object.getPrototypeOf(val);
+  return prototype === null || prototype === Object.prototype;
+}
+
+/**
+ * Determine if a value is a Date
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is a Date, otherwise false
+ */
+function isDate(val) {
+  return toString.call(val) === '[object Date]';
+}
+
+/**
+ * Determine if a value is a File
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is a File, otherwise false
+ */
+function isFile(val) {
+  return toString.call(val) === '[object File]';
+}
+
+/**
+ * Determine if a value is a Blob
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is a Blob, otherwise false
+ */
+function isBlob(val) {
+  return toString.call(val) === '[object Blob]';
+}
+
+/**
+ * Determine if a value is a Function
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is a Function, otherwise false
+ */
+function isFunction(val) {
+  return toString.call(val) === '[object Function]';
+}
+
+/**
+ * Determine if a value is a Stream
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is a Stream, otherwise false
+ */
+function isStream(val) {
+  return isObject(val) && isFunction(val.pipe);
+}
+
+/**
+ * Determine if a value is a URLSearchParams object
+ *
+ * @param {Object} val The value to test
+ * @returns {boolean} True if value is a URLSearchParams object, otherwise false
+ */
+function isURLSearchParams(val) {
+  return toString.call(val) === '[object URLSearchParams]';
+}
+
+/**
+ * Trim excess whitespace off the beginning and end of a string
+ *
+ * @param {String} str The String to trim
+ * @returns {String} The String freed of excess whitespace
+ */
+function trim(str) {
+  return str.trim ? str.trim() : str.replace(/^\s+|\s+$/g, '');
+}
+
+/**
+ * Determine if we're running in a standard browser environment
+ *
+ * This allows axios to run in a web worker, and react-native.
+ * Both environments support XMLHttpRequest, but not fully standard globals.
+ *
+ * web workers:
+ *  typeof window -> undefined
+ *  typeof document -> undefined
+ *
+ * react-native:
+ *  navigator.product -> 'ReactNative'
+ * nativescript
+ *  navigator.product -> 'NativeScript' or 'NS'
+ */
+function isStandardBrowserEnv() {
+  if (typeof navigator !== 'undefined' && (navigator.product === 'ReactNative' ||
+                                           navigator.product === 'NativeScript' ||
+                                           navigator.product === 'NS')) {
+    return false;
+  }
+  return (
+    typeof window !== 'undefined' &&
+    typeof document !== 'undefined'
+  );
+}
+
+/**
+ * Iterate over an Array or an Object invoking a function for each item.
+ *
+ * If `obj` is an Array callback will be called passing
+ * the value, index, and complete array for each item.
+ *
+ * If 'obj' is an Object callback will be called passing
+ * the value, key, and complete object for each property.
+ *
+ * @param {Object|Array} obj The object to iterate
+ * @param {Function} fn The callback to invoke for each item
+ */
+function forEach(obj, fn) {
+  // Don't bother if no value provided
+  if (obj === null || typeof obj === 'undefined') {
+    return;
+  }
+
+  // Force an array if not already something iterable
+  if (typeof obj !== 'object') {
+    /*eslint no-param-reassign:0*/
+    obj = [obj];
+  }
+
+  if (isArray(obj)) {
+    // Iterate over array values
+    for (var i = 0, l = obj.length; i < l; i++) {
+      fn.call(null, obj[i], i, obj);
+    }
+  } else {
+    // Iterate over object keys
+    for (var key in obj) {
+      if (Object.prototype.hasOwnProperty.call(obj, key)) {
+        fn.call(null, obj[key], key, obj);
+      }
+    }
+  }
+}
+
+/**
+ * Accepts varargs expecting each argument to be an object, then
+ * immutably merges the properties of each object and returns result.
+ *
+ * When multiple objects contain the same key the later object in
+ * the arguments list will take precedence.
+ *
+ * Example:
+ *
+ * ```js
+ * var result = merge({foo: 123}, {foo: 456});
+ * console.log(result.foo); // outputs 456
+ * ```
+ *
+ * @param {Object} obj1 Object to merge
+ * @returns {Object} Result of all merge properties
+ */
+function merge(/* obj1, obj2, obj3, ... */) {
+  var result = {};
+  function assignValue(val, key) {
+    if (isPlainObject(result[key]) && isPlainObject(val)) {
+      result[key] = merge(result[key], val);
+    } else if (isPlainObject(val)) {
+      result[key] = merge({}, val);
+    } else if (isArray(val)) {
+      result[key] = val.slice();
+    } else {
+      result[key] = val;
+    }
+  }
+
+  for (var i = 0, l = arguments.length; i < l; i++) {
+    forEach(arguments[i], assignValue);
+  }
+  return result;
+}
+
+/**
+ * Extends object a by mutably adding to it the properties of object b.
+ *
+ * @param {Object} a The object to be extended
+ * @param {Object} b The object to copy properties from
+ * @param {Object} thisArg The object to bind function to
+ * @return {Object} The resulting value of object a
+ */
+function extend(a, b, thisArg) {
+  forEach(b, function assignValue(val, key) {
+    if (thisArg && typeof val === 'function') {
+      a[key] = bind(val, thisArg);
+    } else {
+      a[key] = val;
+    }
+  });
+  return a;
+}
+
+/**
+ * Remove byte order marker. This catches EF BB BF (the UTF-8 BOM)
+ *
+ * @param {string} content with BOM
+ * @return {string} content value without BOM
+ */
+function stripBOM(content) {
+  if (content.charCodeAt(0) === 0xFEFF) {
+    content = content.slice(1);
+  }
+  return content;
+}
+
+module.exports = {
+  isArray: isArray,
+  isArrayBuffer: isArrayBuffer,
+  isBuffer: isBuffer,
+  isFormData: isFormData,
+  isArrayBufferView: isArrayBufferView,
+  isString: isString,
+  isNumber: isNumber,
+  isObject: isObject,
+  isPlainObject: isPlainObject,
+  isUndefined: isUndefined,
+  isDate: isDate,
+  isFile: isFile,
+  isBlob: isBlob,
+  isFunction: isFunction,
+  isStream: isStream,
+  isURLSearchParams: isURLSearchParams,
+  isStandardBrowserEnv: isStandardBrowserEnv,
+  forEach: forEach,
+  merge: merge,
+  extend: extend,
+  trim: trim,
+  stripBOM: stripBOM
+};
diff --git a/ddb_main/node_modules/classnames/index.js b/ddb_main/node_modules/classnames/index.js
new file mode 100644
index 0000000..a42ea92
--- /dev/null
+++ b/ddb_main/node_modules/classnames/index.js
@@ -0,0 +1,77 @@
+/*!
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
+*/
+/* global define */
+
+(function () {
+	'use strict';
+
+	var hasOwn = {}.hasOwnProperty;
+
+	function classNames () {
+		var classes = '';
+
+		for (var i = 0; i < arguments.length; i++) {
+			var arg = arguments[i];
+			if (arg) {
+				classes = appendClass(classes, parseValue(arg));
+			}
+		}
+
+		return classes;
+	}
+
+	function parseValue (arg) {
+		if (typeof arg === 'string' || typeof arg === 'number') {
+			return arg;
+		}
+
+		if (typeof arg !== 'object') {
+			return '';
+		}
+
+		if (Array.isArray(arg)) {
+			return classNames.apply(null, arg);
+		}
+
+		if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
+			return arg.toString();
+		}
+
+		var classes = '';
+
+		for (var key in arg) {
+			if (hasOwn.call(arg, key) && arg[key]) {
+				classes = appendClass(classes, key);
+			}
+		}
+
+		return classes;
+	}
+
+	function appendClass (value, newClass) {
+		if (!newClass) {
+			return value;
+		}
+	
+		if (value) {
+			return value + ' ' + newClass;
+		}
+	
+		return value + newClass;
+	}
+
+	if (typeof module !== 'undefined' && module.exports) {
+		classNames.default = classNames;
+		module.exports = classNames;
+	} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {
+		// register as 'classnames', consistent with npm package name
+		define('classnames', [], function () {
+			return classNames;
+		});
+	} else {
+		window.classNames = classNames;
+	}
+}());
diff --git a/ddb_main/node_modules/clsx/dist/clsx.mjs b/ddb_main/node_modules/clsx/dist/clsx.mjs
new file mode 100644
index 0000000..b98071e
--- /dev/null
+++ b/ddb_main/node_modules/clsx/dist/clsx.mjs
@@ -0,0 +1 @@
+function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f)}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}export function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}export default clsx;
\ No newline at end of file
diff --git a/ddb_main/node_modules/color-name/index.js b/ddb_main/node_modules/color-name/index.js
new file mode 100644
index 0000000..b7c198a
--- /dev/null
+++ b/ddb_main/node_modules/color-name/index.js
@@ -0,0 +1,152 @@
+'use strict'
+
+module.exports = {
+	"aliceblue": [240, 248, 255],
+	"antiquewhite": [250, 235, 215],
+	"aqua": [0, 255, 255],
+	"aquamarine": [127, 255, 212],
+	"azure": [240, 255, 255],
+	"beige": [245, 245, 220],
+	"bisque": [255, 228, 196],
+	"black": [0, 0, 0],
+	"blanchedalmond": [255, 235, 205],
+	"blue": [0, 0, 255],
+	"blueviolet": [138, 43, 226],
+	"brown": [165, 42, 42],
+	"burlywood": [222, 184, 135],
+	"cadetblue": [95, 158, 160],
+	"chartreuse": [127, 255, 0],
+	"chocolate": [210, 105, 30],
+	"coral": [255, 127, 80],
+	"cornflowerblue": [100, 149, 237],
+	"cornsilk": [255, 248, 220],
+	"crimson": [220, 20, 60],
+	"cyan": [0, 255, 255],
+	"darkblue": [0, 0, 139],
+	"darkcyan": [0, 139, 139],
+	"darkgoldenrod": [184, 134, 11],
+	"darkgray": [169, 169, 169],
+	"darkgreen": [0, 100, 0],
+	"darkgrey": [169, 169, 169],
+	"darkkhaki": [189, 183, 107],
+	"darkmagenta": [139, 0, 139],
+	"darkolivegreen": [85, 107, 47],
+	"darkorange": [255, 140, 0],
+	"darkorchid": [153, 50, 204],
+	"darkred": [139, 0, 0],
+	"darksalmon": [233, 150, 122],
+	"darkseagreen": [143, 188, 143],
+	"darkslateblue": [72, 61, 139],
+	"darkslategray": [47, 79, 79],
+	"darkslategrey": [47, 79, 79],
+	"darkturquoise": [0, 206, 209],
+	"darkviolet": [148, 0, 211],
+	"deeppink": [255, 20, 147],
+	"deepskyblue": [0, 191, 255],
+	"dimgray": [105, 105, 105],
+	"dimgrey": [105, 105, 105],
+	"dodgerblue": [30, 144, 255],
+	"firebrick": [178, 34, 34],
+	"floralwhite": [255, 250, 240],
+	"forestgreen": [34, 139, 34],
+	"fuchsia": [255, 0, 255],
+	"gainsboro": [220, 220, 220],
+	"ghostwhite": [248, 248, 255],
+	"gold": [255, 215, 0],
+	"goldenrod": [218, 165, 32],
+	"gray": [128, 128, 128],
+	"green": [0, 128, 0],
+	"greenyellow": [173, 255, 47],
+	"grey": [128, 128, 128],
+	"honeydew": [240, 255, 240],
+	"hotpink": [255, 105, 180],
+	"indianred": [205, 92, 92],
+	"indigo": [75, 0, 130],
+	"ivory": [255, 255, 240],
+	"khaki": [240, 230, 140],
+	"lavender": [230, 230, 250],
+	"lavenderblush": [255, 240, 245],
+	"lawngreen": [124, 252, 0],
+	"lemonchiffon": [255, 250, 205],
+	"lightblue": [173, 216, 230],
+	"lightcoral": [240, 128, 128],
+	"lightcyan": [224, 255, 255],
+	"lightgoldenrodyellow": [250, 250, 210],
+	"lightgray": [211, 211, 211],
+	"lightgreen": [144, 238, 144],
+	"lightgrey": [211, 211, 211],
+	"lightpink": [255, 182, 193],
+	"lightsalmon": [255, 160, 122],
+	"lightseagreen": [32, 178, 170],
+	"lightskyblue": [135, 206, 250],
+	"lightslategray": [119, 136, 153],
+	"lightslategrey": [119, 136, 153],
+	"lightsteelblue": [176, 196, 222],
+	"lightyellow": [255, 255, 224],
+	"lime": [0, 255, 0],
+	"limegreen": [50, 205, 50],
+	"linen": [250, 240, 230],
+	"magenta": [255, 0, 255],
+	"maroon": [128, 0, 0],
+	"mediumaquamarine": [102, 205, 170],
+	"mediumblue": [0, 0, 205],
+	"mediumorchid": [186, 85, 211],
+	"mediumpurple": [147, 112, 219],
+	"mediumseagreen": [60, 179, 113],
+	"mediumslateblue": [123, 104, 238],
+	"mediumspringgreen": [0, 250, 154],
+	"mediumturquoise": [72, 209, 204],
+	"mediumvioletred": [199, 21, 133],
+	"midnightblue": [25, 25, 112],
+	"mintcream": [245, 255, 250],
+	"mistyrose": [255, 228, 225],
+	"moccasin": [255, 228, 181],
+	"navajowhite": [255, 222, 173],
+	"navy": [0, 0, 128],
+	"oldlace": [253, 245, 230],
+	"olive": [128, 128, 0],
+	"olivedrab": [107, 142, 35],
+	"orange": [255, 165, 0],
+	"orangered": [255, 69, 0],
+	"orchid": [218, 112, 214],
+	"palegoldenrod": [238, 232, 170],
+	"palegreen": [152, 251, 152],
+	"paleturquoise": [175, 238, 238],
+	"palevioletred": [219, 112, 147],
+	"papayawhip": [255, 239, 213],
+	"peachpuff": [255, 218, 185],
+	"peru": [205, 133, 63],
+	"pink": [255, 192, 203],
+	"plum": [221, 160, 221],
+	"powderblue": [176, 224, 230],
+	"purple": [128, 0, 128],
+	"rebeccapurple": [102, 51, 153],
+	"red": [255, 0, 0],
+	"rosybrown": [188, 143, 143],
+	"royalblue": [65, 105, 225],
+	"saddlebrown": [139, 69, 19],
+	"salmon": [250, 128, 114],
+	"sandybrown": [244, 164, 96],
+	"seagreen": [46, 139, 87],
+	"seashell": [255, 245, 238],
+	"sienna": [160, 82, 45],
+	"silver": [192, 192, 192],
+	"skyblue": [135, 206, 235],
+	"slateblue": [106, 90, 205],
+	"slategray": [112, 128, 144],
+	"slategrey": [112, 128, 144],
+	"snow": [255, 250, 250],
+	"springgreen": [0, 255, 127],
+	"steelblue": [70, 130, 180],
+	"tan": [210, 180, 140],
+	"teal": [0, 128, 128],
+	"thistle": [216, 191, 216],
+	"tomato": [255, 99, 71],
+	"turquoise": [64, 224, 208],
+	"violet": [238, 130, 238],
+	"wheat": [245, 222, 179],
+	"white": [255, 255, 255],
+	"whitesmoke": [245, 245, 245],
+	"yellow": [255, 255, 0],
+	"yellowgreen": [154, 205, 50]
+};
diff --git a/ddb_main/node_modules/color-string/index.js b/ddb_main/node_modules/color-string/index.js
new file mode 100644
index 0000000..dd5d2b7
--- /dev/null
+++ b/ddb_main/node_modules/color-string/index.js
@@ -0,0 +1,242 @@
+/* MIT license */
+var colorNames = require('color-name');
+var swizzle = require('simple-swizzle');
+var hasOwnProperty = Object.hasOwnProperty;
+
+var reverseNames = Object.create(null);
+
+// create a list of reverse color names
+for (var name in colorNames) {
+	if (hasOwnProperty.call(colorNames, name)) {
+		reverseNames[colorNames[name]] = name;
+	}
+}
+
+var cs = module.exports = {
+	to: {},
+	get: {}
+};
+
+cs.get = function (string) {
+	var prefix = string.substring(0, 3).toLowerCase();
+	var val;
+	var model;
+	switch (prefix) {
+		case 'hsl':
+			val = cs.get.hsl(string);
+			model = 'hsl';
+			break;
+		case 'hwb':
+			val = cs.get.hwb(string);
+			model = 'hwb';
+			break;
+		default:
+			val = cs.get.rgb(string);
+			model = 'rgb';
+			break;
+	}
+
+	if (!val) {
+		return null;
+	}
+
+	return {model: model, value: val};
+};
+
+cs.get.rgb = function (string) {
+	if (!string) {
+		return null;
+	}
+
+	var abbr = /^#([a-f0-9]{3,4})$/i;
+	var hex = /^#([a-f0-9]{6})([a-f0-9]{2})?$/i;
+	var rgba = /^rgba?\(\s*([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/;
+	var per = /^rgba?\(\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*,?\s*([+-]?[\d\.]+)\%\s*(?:[,|\/]\s*([+-]?[\d\.]+)(%?)\s*)?\)$/;
+	var keyword = /^(\w+)$/;
+
+	var rgb = [0, 0, 0, 1];
+	var match;
+	var i;
+	var hexAlpha;
+
+	if (match = string.match(hex)) {
+		hexAlpha = match[2];
+		match = match[1];
+
+		for (i = 0; i < 3; i++) {
+			// https://jsperf.com/slice-vs-substr-vs-substring-methods-long-string/19
+			var i2 = i * 2;
+			rgb[i] = parseInt(match.slice(i2, i2 + 2), 16);
+		}
+
+		if (hexAlpha) {
+			rgb[3] = parseInt(hexAlpha, 16) / 255;
+		}
+	} else if (match = string.match(abbr)) {
+		match = match[1];
+		hexAlpha = match[3];
+
+		for (i = 0; i < 3; i++) {
+			rgb[i] = parseInt(match[i] + match[i], 16);
+		}
+
+		if (hexAlpha) {
+			rgb[3] = parseInt(hexAlpha + hexAlpha, 16) / 255;
+		}
+	} else if (match = string.match(rgba)) {
+		for (i = 0; i < 3; i++) {
+			rgb[i] = parseInt(match[i + 1], 0);
+		}
+
+		if (match[4]) {
+			if (match[5]) {
+				rgb[3] = parseFloat(match[4]) * 0.01;
+			} else {
+				rgb[3] = parseFloat(match[4]);
+			}
+		}
+	} else if (match = string.match(per)) {
+		for (i = 0; i < 3; i++) {
+			rgb[i] = Math.round(parseFloat(match[i + 1]) * 2.55);
+		}
+
+		if (match[4]) {
+			if (match[5]) {
+				rgb[3] = parseFloat(match[4]) * 0.01;
+			} else {
+				rgb[3] = parseFloat(match[4]);
+			}
+		}
+	} else if (match = string.match(keyword)) {
+		if (match[1] === 'transparent') {
+			return [0, 0, 0, 0];
+		}
+
+		if (!hasOwnProperty.call(colorNames, match[1])) {
+			return null;
+		}
+
+		rgb = colorNames[match[1]];
+		rgb[3] = 1;
+
+		return rgb;
+	} else {
+		return null;
+	}
+
+	for (i = 0; i < 3; i++) {
+		rgb[i] = clamp(rgb[i], 0, 255);
+	}
+	rgb[3] = clamp(rgb[3], 0, 1);
+
+	return rgb;
+};
+
+cs.get.hsl = function (string) {
+	if (!string) {
+		return null;
+	}
+
+	var hsl = /^hsla?\(\s*([+-]?(?:\d{0,3}\.)?\d+)(?:deg)?\s*,?\s*([+-]?[\d\.]+)%\s*,?\s*([+-]?[\d\.]+)%\s*(?:[,|\/]\s*([+-]?(?=\.\d|\d)(?:0|[1-9]\d*)?(?:\.\d*)?(?:[eE][+-]?\d+)?)\s*)?\)$/;
+	var match = string.match(hsl);
+
+	if (match) {
+		var alpha = parseFloat(match[4]);
+		var h = ((parseFloat(match[1]) % 360) + 360) % 360;
+		var s = clamp(parseFloat(match[2]), 0, 100);
+		var l = clamp(parseFloat(match[3]), 0, 100);
+		var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1);
+
+		return [h, s, l, a];
+	}
+
+	return null;
+};
+
+cs.get.hwb = function (string) {
+	if (!string) {
+		return null;
+	}
+
+	var hwb = /^hwb\(\s*([+-]?\d{0,3}(?:\.\d+)?)(?:deg)?\s*,\s*([+-]?[\d\.]+)%\s*,\s*([+-]?[\d\.]+)%\s*(?:,\s*([+-]?(?=\.\d|\d)(?:0|[1-9]\d*)?(?:\.\d*)?(?:[eE][+-]?\d+)?)\s*)?\)$/;
+	var match = string.match(hwb);
+
+	if (match) {
+		var alpha = parseFloat(match[4]);
+		var h = ((parseFloat(match[1]) % 360) + 360) % 360;
+		var w = clamp(parseFloat(match[2]), 0, 100);
+		var b = clamp(parseFloat(match[3]), 0, 100);
+		var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1);
+		return [h, w, b, a];
+	}
+
+	return null;
+};
+
+cs.to.hex = function () {
+	var rgba = swizzle(arguments);
+
+	return (
+		'#' +
+		hexDouble(rgba[0]) +
+		hexDouble(rgba[1]) +
+		hexDouble(rgba[2]) +
+		(rgba[3] < 1
+			? (hexDouble(Math.round(rgba[3] * 255)))
+			: '')
+	);
+};
+
+cs.to.rgb = function () {
+	var rgba = swizzle(arguments);
+
+	return rgba.length < 4 || rgba[3] === 1
+		? 'rgb(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ')'
+		: 'rgba(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ', ' + rgba[3] + ')';
+};
+
+cs.to.rgb.percent = function () {
+	var rgba = swizzle(arguments);
+
+	var r = Math.round(rgba[0] / 255 * 100);
+	var g = Math.round(rgba[1] / 255 * 100);
+	var b = Math.round(rgba[2] / 255 * 100);
+
+	return rgba.length < 4 || rgba[3] === 1
+		? 'rgb(' + r + '%, ' + g + '%, ' + b + '%)'
+		: 'rgba(' + r + '%, ' + g + '%, ' + b + '%, ' + rgba[3] + ')';
+};
+
+cs.to.hsl = function () {
+	var hsla = swizzle(arguments);
+	return hsla.length < 4 || hsla[3] === 1
+		? 'hsl(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%)'
+		: 'hsla(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%, ' + hsla[3] + ')';
+};
+
+// hwb is a bit different than rgb(a) & hsl(a) since there is no alpha specific syntax
+// (hwb have alpha optional & 1 is default value)
+cs.to.hwb = function () {
+	var hwba = swizzle(arguments);
+
+	var a = '';
+	if (hwba.length >= 4 && hwba[3] !== 1) {
+		a = ', ' + hwba[3];
+	}
+
+	return 'hwb(' + hwba[0] + ', ' + hwba[1] + '%, ' + hwba[2] + '%' + a + ')';
+};
+
+cs.to.keyword = function (rgb) {
+	return reverseNames[rgb.slice(0, 3)];
+};
+
+// helpers
+function clamp(num, min, max) {
+	return Math.min(Math.max(min, num), max);
+}
+
+function hexDouble(num) {
+	var str = Math.round(num).toString(16).toUpperCase();
+	return (str.length < 2) ? '0' + str : str;
+}
diff --git a/ddb_main/node_modules/color/index.js b/ddb_main/node_modules/color/index.js
new file mode 100644
index 0000000..c756588
--- /dev/null
+++ b/ddb_main/node_modules/color/index.js
@@ -0,0 +1,482 @@
+'use strict';
+
+var colorString = require('color-string');
+var convert = require('color-convert');
+
+var _slice = [].slice;
+
+var skippedModels = [
+	// to be honest, I don't really feel like keyword belongs in color convert, but eh.
+	'keyword',
+
+	// gray conflicts with some method names, and has its own method defined.
+	'gray',
+
+	// shouldn't really be in color-convert either...
+	'hex'
+];
+
+var hashedModelKeys = {};
+Object.keys(convert).forEach(function (model) {
+	hashedModelKeys[_slice.call(convert[model].labels).sort().join('')] = model;
+});
+
+var limiters = {};
+
+function Color(obj, model) {
+	if (!(this instanceof Color)) {
+		return new Color(obj, model);
+	}
+
+	if (model && model in skippedModels) {
+		model = null;
+	}
+
+	if (model && !(model in convert)) {
+		throw new Error('Unknown model: ' + model);
+	}
+
+	var i;
+	var channels;
+
+	if (obj == null) { // eslint-disable-line no-eq-null,eqeqeq
+		this.model = 'rgb';
+		this.color = [0, 0, 0];
+		this.valpha = 1;
+	} else if (obj instanceof Color) {
+		this.model = obj.model;
+		this.color = obj.color.slice();
+		this.valpha = obj.valpha;
+	} else if (typeof obj === 'string') {
+		var result = colorString.get(obj);
+		if (result === null) {
+			throw new Error('Unable to parse color from string: ' + obj);
+		}
+
+		this.model = result.model;
+		channels = convert[this.model].channels;
+		this.color = result.value.slice(0, channels);
+		this.valpha = typeof result.value[channels] === 'number' ? result.value[channels] : 1;
+	} else if (obj.length) {
+		this.model = model || 'rgb';
+		channels = convert[this.model].channels;
+		var newArr = _slice.call(obj, 0, channels);
+		this.color = zeroArray(newArr, channels);
+		this.valpha = typeof obj[channels] === 'number' ? obj[channels] : 1;
+	} else if (typeof obj === 'number') {
+		// this is always RGB - can be converted later on.
+		obj &= 0xFFFFFF;
+		this.model = 'rgb';
+		this.color = [
+			(obj >> 16) & 0xFF,
+			(obj >> 8) & 0xFF,
+			obj & 0xFF
+		];
+		this.valpha = 1;
+	} else {
+		this.valpha = 1;
+
+		var keys = Object.keys(obj);
+		if ('alpha' in obj) {
+			keys.splice(keys.indexOf('alpha'), 1);
+			this.valpha = typeof obj.alpha === 'number' ? obj.alpha : 0;
+		}
+
+		var hashedKeys = keys.sort().join('');
+		if (!(hashedKeys in hashedModelKeys)) {
+			throw new Error('Unable to parse color from object: ' + JSON.stringify(obj));
+		}
+
+		this.model = hashedModelKeys[hashedKeys];
+
+		var labels = convert[this.model].labels;
+		var color = [];
+		for (i = 0; i < labels.length; i++) {
+			color.push(obj[labels[i]]);
+		}
+
+		this.color = zeroArray(color);
+	}
+
+	// perform limitations (clamping, etc.)
+	if (limiters[this.model]) {
+		channels = convert[this.model].channels;
+		for (i = 0; i < channels; i++) {
+			var limit = limiters[this.model][i];
+			if (limit) {
+				this.color[i] = limit(this.color[i]);
+			}
+		}
+	}
+
+	this.valpha = Math.max(0, Math.min(1, this.valpha));
+
+	if (Object.freeze) {
+		Object.freeze(this);
+	}
+}
+
+Color.prototype = {
+	toString: function () {
+		return this.string();
+	},
+
+	toJSON: function () {
+		return this[this.model]();
+	},
+
+	string: function (places) {
+		var self = this.model in colorString.to ? this : this.rgb();
+		self = self.round(typeof places === 'number' ? places : 1);
+		var args = self.valpha === 1 ? self.color : self.color.concat(this.valpha);
+		return colorString.to[self.model](args);
+	},
+
+	percentString: function (places) {
+		var self = this.rgb().round(typeof places === 'number' ? places : 1);
+		var args = self.valpha === 1 ? self.color : self.color.concat(this.valpha);
+		return colorString.to.rgb.percent(args);
+	},
+
+	array: function () {
+		return this.valpha === 1 ? this.color.slice() : this.color.concat(this.valpha);
+	},
+
+	object: function () {
+		var result = {};
+		var channels = convert[this.model].channels;
+		var labels = convert[this.model].labels;
+
+		for (var i = 0; i < channels; i++) {
+			result[labels[i]] = this.color[i];
+		}
+
+		if (this.valpha !== 1) {
+			result.alpha = this.valpha;
+		}
+
+		return result;
+	},
+
+	unitArray: function () {
+		var rgb = this.rgb().color;
+		rgb[0] /= 255;
+		rgb[1] /= 255;
+		rgb[2] /= 255;
+
+		if (this.valpha !== 1) {
+			rgb.push(this.valpha);
+		}
+
+		return rgb;
+	},
+
+	unitObject: function () {
+		var rgb = this.rgb().object();
+		rgb.r /= 255;
+		rgb.g /= 255;
+		rgb.b /= 255;
+
+		if (this.valpha !== 1) {
+			rgb.alpha = this.valpha;
+		}
+
+		return rgb;
+	},
+
+	round: function (places) {
+		places = Math.max(places || 0, 0);
+		return new Color(this.color.map(roundToPlace(places)).concat(this.valpha), this.model);
+	},
+
+	alpha: function (val) {
+		if (arguments.length) {
+			return new Color(this.color.concat(Math.max(0, Math.min(1, val))), this.model);
+		}
+
+		return this.valpha;
+	},
+
+	// rgb
+	red: getset('rgb', 0, maxfn(255)),
+	green: getset('rgb', 1, maxfn(255)),
+	blue: getset('rgb', 2, maxfn(255)),
+
+	hue: getset(['hsl', 'hsv', 'hsl', 'hwb', 'hcg'], 0, function (val) { return ((val % 360) + 360) % 360; }), // eslint-disable-line brace-style
+
+	saturationl: getset('hsl', 1, maxfn(100)),
+	lightness: getset('hsl', 2, maxfn(100)),
+
+	saturationv: getset('hsv', 1, maxfn(100)),
+	value: getset('hsv', 2, maxfn(100)),
+
+	chroma: getset('hcg', 1, maxfn(100)),
+	gray: getset('hcg', 2, maxfn(100)),
+
+	white: getset('hwb', 1, maxfn(100)),
+	wblack: getset('hwb', 2, maxfn(100)),
+
+	cyan: getset('cmyk', 0, maxfn(100)),
+	magenta: getset('cmyk', 1, maxfn(100)),
+	yellow: getset('cmyk', 2, maxfn(100)),
+	black: getset('cmyk', 3, maxfn(100)),
+
+	x: getset('xyz', 0, maxfn(100)),
+	y: getset('xyz', 1, maxfn(100)),
+	z: getset('xyz', 2, maxfn(100)),
+
+	l: getset('lab', 0, maxfn(100)),
+	a: getset('lab', 1),
+	b: getset('lab', 2),
+
+	keyword: function (val) {
+		if (arguments.length) {
+			return new Color(val);
+		}
+
+		return convert[this.model].keyword(this.color);
+	},
+
+	hex: function (val) {
+		if (arguments.length) {
+			return new Color(val);
+		}
+
+		return colorString.to.hex(this.rgb().round().color);
+	},
+
+	rgbNumber: function () {
+		var rgb = this.rgb().color;
+		return ((rgb[0] & 0xFF) << 16) | ((rgb[1] & 0xFF) << 8) | (rgb[2] & 0xFF);
+	},
+
+	luminosity: function () {
+		// http://www.w3.org/TR/WCAG20/#relativeluminancedef
+		var rgb = this.rgb().color;
+
+		var lum = [];
+		for (var i = 0; i < rgb.length; i++) {
+			var chan = rgb[i] / 255;
+			lum[i] = (chan <= 0.03928) ? chan / 12.92 : Math.pow(((chan + 0.055) / 1.055), 2.4);
+		}
+
+		return 0.2126 * lum[0] + 0.7152 * lum[1] + 0.0722 * lum[2];
+	},
+
+	contrast: function (color2) {
+		// http://www.w3.org/TR/WCAG20/#contrast-ratiodef
+		var lum1 = this.luminosity();
+		var lum2 = color2.luminosity();
+
+		if (lum1 > lum2) {
+			return (lum1 + 0.05) / (lum2 + 0.05);
+		}
+
+		return (lum2 + 0.05) / (lum1 + 0.05);
+	},
+
+	level: function (color2) {
+		var contrastRatio = this.contrast(color2);
+		if (contrastRatio >= 7.1) {
+			return 'AAA';
+		}
+
+		return (contrastRatio >= 4.5) ? 'AA' : '';
+	},
+
+	isDark: function () {
+		// YIQ equation from http://24ways.org/2010/calculating-color-contrast
+		var rgb = this.rgb().color;
+		var yiq = (rgb[0] * 299 + rgb[1] * 587 + rgb[2] * 114) / 1000;
+		return yiq < 128;
+	},
+
+	isLight: function () {
+		return !this.isDark();
+	},
+
+	negate: function () {
+		var rgb = this.rgb();
+		for (var i = 0; i < 3; i++) {
+			rgb.color[i] = 255 - rgb.color[i];
+		}
+		return rgb;
+	},
+
+	lighten: function (ratio) {
+		var hsl = this.hsl();
+		hsl.color[2] += hsl.color[2] * ratio;
+		return hsl;
+	},
+
+	darken: function (ratio) {
+		var hsl = this.hsl();
+		hsl.color[2] -= hsl.color[2] * ratio;
+		return hsl;
+	},
+
+	saturate: function (ratio) {
+		var hsl = this.hsl();
+		hsl.color[1] += hsl.color[1] * ratio;
+		return hsl;
+	},
+
+	desaturate: function (ratio) {
+		var hsl = this.hsl();
+		hsl.color[1] -= hsl.color[1] * ratio;
+		return hsl;
+	},
+
+	whiten: function (ratio) {
+		var hwb = this.hwb();
+		hwb.color[1] += hwb.color[1] * ratio;
+		return hwb;
+	},
+
+	blacken: function (ratio) {
+		var hwb = this.hwb();
+		hwb.color[2] += hwb.color[2] * ratio;
+		return hwb;
+	},
+
+	grayscale: function () {
+		// http://en.wikipedia.org/wiki/Grayscale#Converting_color_to_grayscale
+		var rgb = this.rgb().color;
+		var val = rgb[0] * 0.3 + rgb[1] * 0.59 + rgb[2] * 0.11;
+		return Color.rgb(val, val, val);
+	},
+
+	fade: function (ratio) {
+		return this.alpha(this.valpha - (this.valpha * ratio));
+	},
+
+	opaquer: function (ratio) {
+		return this.alpha(this.valpha + (this.valpha * ratio));
+	},
+
+	rotate: function (degrees) {
+		var hsl = this.hsl();
+		var hue = hsl.color[0];
+		hue = (hue + degrees) % 360;
+		hue = hue < 0 ? 360 + hue : hue;
+		hsl.color[0] = hue;
+		return hsl;
+	},
+
+	mix: function (mixinColor, weight) {
+		// ported from sass implementation in C
+		// https://github.com/sass/libsass/blob/0e6b4a2850092356aa3ece07c6b249f0221caced/functions.cpp#L209
+		if (!mixinColor || !mixinColor.rgb) {
+			throw new Error('Argument to "mix" was not a Color instance, but rather an instance of ' + typeof mixinColor);
+		}
+		var color1 = mixinColor.rgb();
+		var color2 = this.rgb();
+		var p = weight === undefined ? 0.5 : weight;
+
+		var w = 2 * p - 1;
+		var a = color1.alpha() - color2.alpha();
+
+		var w1 = (((w * a === -1) ? w : (w + a) / (1 + w * a)) + 1) / 2.0;
+		var w2 = 1 - w1;
+
+		return Color.rgb(
+				w1 * color1.red() + w2 * color2.red(),
+				w1 * color1.green() + w2 * color2.green(),
+				w1 * color1.blue() + w2 * color2.blue(),
+				color1.alpha() * p + color2.alpha() * (1 - p));
+	}
+};
+
+// model conversion methods and static constructors
+Object.keys(convert).forEach(function (model) {
+	if (skippedModels.indexOf(model) !== -1) {
+		return;
+	}
+
+	var channels = convert[model].channels;
+
+	// conversion methods
+	Color.prototype[model] = function () {
+		if (this.model === model) {
+			return new Color(this);
+		}
+
+		if (arguments.length) {
+			return new Color(arguments, model);
+		}
+
+		var newAlpha = typeof arguments[channels] === 'number' ? channels : this.valpha;
+		return new Color(assertArray(convert[this.model][model].raw(this.color)).concat(newAlpha), model);
+	};
+
+	// 'static' construction methods
+	Color[model] = function (color) {
+		if (typeof color === 'number') {
+			color = zeroArray(_slice.call(arguments), channels);
+		}
+		return new Color(color, model);
+	};
+});
+
+function roundTo(num, places) {
+	return Number(num.toFixed(places));
+}
+
+function roundToPlace(places) {
+	return function (num) {
+		return roundTo(num, places);
+	};
+}
+
+function getset(model, channel, modifier) {
+	model = Array.isArray(model) ? model : [model];
+
+	model.forEach(function (m) {
+		(limiters[m] || (limiters[m] = []))[channel] = modifier;
+	});
+
+	model = model[0];
+
+	return function (val) {
+		var result;
+
+		if (arguments.length) {
+			if (modifier) {
+				val = modifier(val);
+			}
+
+			result = this[model]();
+			result.color[channel] = val;
+			return result;
+		}
+
+		result = this[model]().color[channel];
+		if (modifier) {
+			result = modifier(result);
+		}
+
+		return result;
+	};
+}
+
+function maxfn(max) {
+	return function (v) {
+		return Math.max(0, Math.min(max, v));
+	};
+}
+
+function assertArray(val) {
+	return Array.isArray(val) ? val : [val];
+}
+
+function zeroArray(arr, length) {
+	for (var i = 0; i < length; i++) {
+		if (typeof arr[i] !== 'number') {
+			arr[i] = 0;
+		}
+	}
+
+	return arr;
+}
+
+module.exports = Color;
diff --git a/ddb_main/node_modules/color/node_modules/color-convert/conversions.js b/ddb_main/node_modules/color/node_modules/color-convert/conversions.js
new file mode 100644
index 0000000..3217200
--- /dev/null
+++ b/ddb_main/node_modules/color/node_modules/color-convert/conversions.js
@@ -0,0 +1,868 @@
+/* MIT license */
+var cssKeywords = require('color-name');
+
+// NOTE: conversions should only return primitive values (i.e. arrays, or
+//       values that give correct `typeof` results).
+//       do not use box values types (i.e. Number(), String(), etc.)
+
+var reverseKeywords = {};
+for (var key in cssKeywords) {
+	if (cssKeywords.hasOwnProperty(key)) {
+		reverseKeywords[cssKeywords[key]] = key;
+	}
+}
+
+var convert = module.exports = {
+	rgb: {channels: 3, labels: 'rgb'},
+	hsl: {channels: 3, labels: 'hsl'},
+	hsv: {channels: 3, labels: 'hsv'},
+	hwb: {channels: 3, labels: 'hwb'},
+	cmyk: {channels: 4, labels: 'cmyk'},
+	xyz: {channels: 3, labels: 'xyz'},
+	lab: {channels: 3, labels: 'lab'},
+	lch: {channels: 3, labels: 'lch'},
+	hex: {channels: 1, labels: ['hex']},
+	keyword: {channels: 1, labels: ['keyword']},
+	ansi16: {channels: 1, labels: ['ansi16']},
+	ansi256: {channels: 1, labels: ['ansi256']},
+	hcg: {channels: 3, labels: ['h', 'c', 'g']},
+	apple: {channels: 3, labels: ['r16', 'g16', 'b16']},
+	gray: {channels: 1, labels: ['gray']}
+};
+
+// hide .channels and .labels properties
+for (var model in convert) {
+	if (convert.hasOwnProperty(model)) {
+		if (!('channels' in convert[model])) {
+			throw new Error('missing channels property: ' + model);
+		}
+
+		if (!('labels' in convert[model])) {
+			throw new Error('missing channel labels property: ' + model);
+		}
+
+		if (convert[model].labels.length !== convert[model].channels) {
+			throw new Error('channel and label counts mismatch: ' + model);
+		}
+
+		var channels = convert[model].channels;
+		var labels = convert[model].labels;
+		delete convert[model].channels;
+		delete convert[model].labels;
+		Object.defineProperty(convert[model], 'channels', {value: channels});
+		Object.defineProperty(convert[model], 'labels', {value: labels});
+	}
+}
+
+convert.rgb.hsl = function (rgb) {
+	var r = rgb[0] / 255;
+	var g = rgb[1] / 255;
+	var b = rgb[2] / 255;
+	var min = Math.min(r, g, b);
+	var max = Math.max(r, g, b);
+	var delta = max - min;
+	var h;
+	var s;
+	var l;
+
+	if (max === min) {
+		h = 0;
+	} else if (r === max) {
+		h = (g - b) / delta;
+	} else if (g === max) {
+		h = 2 + (b - r) / delta;
+	} else if (b === max) {
+		h = 4 + (r - g) / delta;
+	}
+
+	h = Math.min(h * 60, 360);
+
+	if (h < 0) {
+		h += 360;
+	}
+
+	l = (min + max) / 2;
+
+	if (max === min) {
+		s = 0;
+	} else if (l <= 0.5) {
+		s = delta / (max + min);
+	} else {
+		s = delta / (2 - max - min);
+	}
+
+	return [h, s * 100, l * 100];
+};
+
+convert.rgb.hsv = function (rgb) {
+	var rdif;
+	var gdif;
+	var bdif;
+	var h;
+	var s;
+
+	var r = rgb[0] / 255;
+	var g = rgb[1] / 255;
+	var b = rgb[2] / 255;
+	var v = Math.max(r, g, b);
+	var diff = v - Math.min(r, g, b);
+	var diffc = function (c) {
+		return (v - c) / 6 / diff + 1 / 2;
+	};
+
+	if (diff === 0) {
+		h = s = 0;
+	} else {
+		s = diff / v;
+		rdif = diffc(r);
+		gdif = diffc(g);
+		bdif = diffc(b);
+
+		if (r === v) {
+			h = bdif - gdif;
+		} else if (g === v) {
+			h = (1 / 3) + rdif - bdif;
+		} else if (b === v) {
+			h = (2 / 3) + gdif - rdif;
+		}
+		if (h < 0) {
+			h += 1;
+		} else if (h > 1) {
+			h -= 1;
+		}
+	}
+
+	return [
+		h * 360,
+		s * 100,
+		v * 100
+	];
+};
+
+convert.rgb.hwb = function (rgb) {
+	var r = rgb[0];
+	var g = rgb[1];
+	var b = rgb[2];
+	var h = convert.rgb.hsl(rgb)[0];
+	var w = 1 / 255 * Math.min(r, Math.min(g, b));
+
+	b = 1 - 1 / 255 * Math.max(r, Math.max(g, b));
+
+	return [h, w * 100, b * 100];
+};
+
+convert.rgb.cmyk = function (rgb) {
+	var r = rgb[0] / 255;
+	var g = rgb[1] / 255;
+	var b = rgb[2] / 255;
+	var c;
+	var m;
+	var y;
+	var k;
+
+	k = Math.min(1 - r, 1 - g, 1 - b);
+	c = (1 - r - k) / (1 - k) || 0;
+	m = (1 - g - k) / (1 - k) || 0;
+	y = (1 - b - k) / (1 - k) || 0;
+
+	return [c * 100, m * 100, y * 100, k * 100];
+};
+
+/**
+ * See https://en.m.wikipedia.org/wiki/Euclidean_distance#Squared_Euclidean_distance
+ * */
+function comparativeDistance(x, y) {
+	return (
+		Math.pow(x[0] - y[0], 2) +
+		Math.pow(x[1] - y[1], 2) +
+		Math.pow(x[2] - y[2], 2)
+	);
+}
+
+convert.rgb.keyword = function (rgb) {
+	var reversed = reverseKeywords[rgb];
+	if (reversed) {
+		return reversed;
+	}
+
+	var currentClosestDistance = Infinity;
+	var currentClosestKeyword;
+
+	for (var keyword in cssKeywords) {
+		if (cssKeywords.hasOwnProperty(keyword)) {
+			var value = cssKeywords[keyword];
+
+			// Compute comparative distance
+			var distance = comparativeDistance(rgb, value);
+
+			// Check if its less, if so set as closest
+			if (distance < currentClosestDistance) {
+				currentClosestDistance = distance;
+				currentClosestKeyword = keyword;
+			}
+		}
+	}
+
+	return currentClosestKeyword;
+};
+
+convert.keyword.rgb = function (keyword) {
+	return cssKeywords[keyword];
+};
+
+convert.rgb.xyz = function (rgb) {
+	var r = rgb[0] / 255;
+	var g = rgb[1] / 255;
+	var b = rgb[2] / 255;
+
+	// assume sRGB
+	r = r > 0.04045 ? Math.pow(((r + 0.055) / 1.055), 2.4) : (r / 12.92);
+	g = g > 0.04045 ? Math.pow(((g + 0.055) / 1.055), 2.4) : (g / 12.92);
+	b = b > 0.04045 ? Math.pow(((b + 0.055) / 1.055), 2.4) : (b / 12.92);
+
+	var x = (r * 0.4124) + (g * 0.3576) + (b * 0.1805);
+	var y = (r * 0.2126) + (g * 0.7152) + (b * 0.0722);
+	var z = (r * 0.0193) + (g * 0.1192) + (b * 0.9505);
+
+	return [x * 100, y * 100, z * 100];
+};
+
+convert.rgb.lab = function (rgb) {
+	var xyz = convert.rgb.xyz(rgb);
+	var x = xyz[0];
+	var y = xyz[1];
+	var z = xyz[2];
+	var l;
+	var a;
+	var b;
+
+	x /= 95.047;
+	y /= 100;
+	z /= 108.883;
+
+	x = x > 0.008856 ? Math.pow(x, 1 / 3) : (7.787 * x) + (16 / 116);
+	y = y > 0.008856 ? Math.pow(y, 1 / 3) : (7.787 * y) + (16 / 116);
+	z = z > 0.008856 ? Math.pow(z, 1 / 3) : (7.787 * z) + (16 / 116);
+
+	l = (116 * y) - 16;
+	a = 500 * (x - y);
+	b = 200 * (y - z);
+
+	return [l, a, b];
+};
+
+convert.hsl.rgb = function (hsl) {
+	var h = hsl[0] / 360;
+	var s = hsl[1] / 100;
+	var l = hsl[2] / 100;
+	var t1;
+	var t2;
+	var t3;
+	var rgb;
+	var val;
+
+	if (s === 0) {
+		val = l * 255;
+		return [val, val, val];
+	}
+
+	if (l < 0.5) {
+		t2 = l * (1 + s);
+	} else {
+		t2 = l + s - l * s;
+	}
+
+	t1 = 2 * l - t2;
+
+	rgb = [0, 0, 0];
+	for (var i = 0; i < 3; i++) {
+		t3 = h + 1 / 3 * -(i - 1);
+		if (t3 < 0) {
+			t3++;
+		}
+		if (t3 > 1) {
+			t3--;
+		}
+
+		if (6 * t3 < 1) {
+			val = t1 + (t2 - t1) * 6 * t3;
+		} else if (2 * t3 < 1) {
+			val = t2;
+		} else if (3 * t3 < 2) {
+			val = t1 + (t2 - t1) * (2 / 3 - t3) * 6;
+		} else {
+			val = t1;
+		}
+
+		rgb[i] = val * 255;
+	}
+
+	return rgb;
+};
+
+convert.hsl.hsv = function (hsl) {
+	var h = hsl[0];
+	var s = hsl[1] / 100;
+	var l = hsl[2] / 100;
+	var smin = s;
+	var lmin = Math.max(l, 0.01);
+	var sv;
+	var v;
+
+	l *= 2;
+	s *= (l <= 1) ? l : 2 - l;
+	smin *= lmin <= 1 ? lmin : 2 - lmin;
+	v = (l + s) / 2;
+	sv = l === 0 ? (2 * smin) / (lmin + smin) : (2 * s) / (l + s);
+
+	return [h, sv * 100, v * 100];
+};
+
+convert.hsv.rgb = function (hsv) {
+	var h = hsv[0] / 60;
+	var s = hsv[1] / 100;
+	var v = hsv[2] / 100;
+	var hi = Math.floor(h) % 6;
+
+	var f = h - Math.floor(h);
+	var p = 255 * v * (1 - s);
+	var q = 255 * v * (1 - (s * f));
+	var t = 255 * v * (1 - (s * (1 - f)));
+	v *= 255;
+
+	switch (hi) {
+		case 0:
+			return [v, t, p];
+		case 1:
+			return [q, v, p];
+		case 2:
+			return [p, v, t];
+		case 3:
+			return [p, q, v];
+		case 4:
+			return [t, p, v];
+		case 5:
+			return [v, p, q];
+	}
+};
+
+convert.hsv.hsl = function (hsv) {
+	var h = hsv[0];
+	var s = hsv[1] / 100;
+	var v = hsv[2] / 100;
+	var vmin = Math.max(v, 0.01);
+	var lmin;
+	var sl;
+	var l;
+
+	l = (2 - s) * v;
+	lmin = (2 - s) * vmin;
+	sl = s * vmin;
+	sl /= (lmin <= 1) ? lmin : 2 - lmin;
+	sl = sl || 0;
+	l /= 2;
+
+	return [h, sl * 100, l * 100];
+};
+
+// http://dev.w3.org/csswg/css-color/#hwb-to-rgb
+convert.hwb.rgb = function (hwb) {
+	var h = hwb[0] / 360;
+	var wh = hwb[1] / 100;
+	var bl = hwb[2] / 100;
+	var ratio = wh + bl;
+	var i;
+	var v;
+	var f;
+	var n;
+
+	// wh + bl cant be > 1
+	if (ratio > 1) {
+		wh /= ratio;
+		bl /= ratio;
+	}
+
+	i = Math.floor(6 * h);
+	v = 1 - bl;
+	f = 6 * h - i;
+
+	if ((i & 0x01) !== 0) {
+		f = 1 - f;
+	}
+
+	n = wh + f * (v - wh); // linear interpolation
+
+	var r;
+	var g;
+	var b;
+	switch (i) {
+		default:
+		case 6:
+		case 0: r = v; g = n; b = wh; break;
+		case 1: r = n; g = v; b = wh; break;
+		case 2: r = wh; g = v; b = n; break;
+		case 3: r = wh; g = n; b = v; break;
+		case 4: r = n; g = wh; b = v; break;
+		case 5: r = v; g = wh; b = n; break;
+	}
+
+	return [r * 255, g * 255, b * 255];
+};
+
+convert.cmyk.rgb = function (cmyk) {
+	var c = cmyk[0] / 100;
+	var m = cmyk[1] / 100;
+	var y = cmyk[2] / 100;
+	var k = cmyk[3] / 100;
+	var r;
+	var g;
+	var b;
+
+	r = 1 - Math.min(1, c * (1 - k) + k);
+	g = 1 - Math.min(1, m * (1 - k) + k);
+	b = 1 - Math.min(1, y * (1 - k) + k);
+
+	return [r * 255, g * 255, b * 255];
+};
+
+convert.xyz.rgb = function (xyz) {
+	var x = xyz[0] / 100;
+	var y = xyz[1] / 100;
+	var z = xyz[2] / 100;
+	var r;
+	var g;
+	var b;
+
+	r = (x * 3.2406) + (y * -1.5372) + (z * -0.4986);
+	g = (x * -0.9689) + (y * 1.8758) + (z * 0.0415);
+	b = (x * 0.0557) + (y * -0.2040) + (z * 1.0570);
+
+	// assume sRGB
+	r = r > 0.0031308
+		? ((1.055 * Math.pow(r, 1.0 / 2.4)) - 0.055)
+		: r * 12.92;
+
+	g = g > 0.0031308
+		? ((1.055 * Math.pow(g, 1.0 / 2.4)) - 0.055)
+		: g * 12.92;
+
+	b = b > 0.0031308
+		? ((1.055 * Math.pow(b, 1.0 / 2.4)) - 0.055)
+		: b * 12.92;
+
+	r = Math.min(Math.max(0, r), 1);
+	g = Math.min(Math.max(0, g), 1);
+	b = Math.min(Math.max(0, b), 1);
+
+	return [r * 255, g * 255, b * 255];
+};
+
+convert.xyz.lab = function (xyz) {
+	var x = xyz[0];
+	var y = xyz[1];
+	var z = xyz[2];
+	var l;
+	var a;
+	var b;
+
+	x /= 95.047;
+	y /= 100;
+	z /= 108.883;
+
+	x = x > 0.008856 ? Math.pow(x, 1 / 3) : (7.787 * x) + (16 / 116);
+	y = y > 0.008856 ? Math.pow(y, 1 / 3) : (7.787 * y) + (16 / 116);
+	z = z > 0.008856 ? Math.pow(z, 1 / 3) : (7.787 * z) + (16 / 116);
+
+	l = (116 * y) - 16;
+	a = 500 * (x - y);
+	b = 200 * (y - z);
+
+	return [l, a, b];
+};
+
+convert.lab.xyz = function (lab) {
+	var l = lab[0];
+	var a = lab[1];
+	var b = lab[2];
+	var x;
+	var y;
+	var z;
+
+	y = (l + 16) / 116;
+	x = a / 500 + y;
+	z = y - b / 200;
+
+	var y2 = Math.pow(y, 3);
+	var x2 = Math.pow(x, 3);
+	var z2 = Math.pow(z, 3);
+	y = y2 > 0.008856 ? y2 : (y - 16 / 116) / 7.787;
+	x = x2 > 0.008856 ? x2 : (x - 16 / 116) / 7.787;
+	z = z2 > 0.008856 ? z2 : (z - 16 / 116) / 7.787;
+
+	x *= 95.047;
+	y *= 100;
+	z *= 108.883;
+
+	return [x, y, z];
+};
+
+convert.lab.lch = function (lab) {
+	var l = lab[0];
+	var a = lab[1];
+	var b = lab[2];
+	var hr;
+	var h;
+	var c;
+
+	hr = Math.atan2(b, a);
+	h = hr * 360 / 2 / Math.PI;
+
+	if (h < 0) {
+		h += 360;
+	}
+
+	c = Math.sqrt(a * a + b * b);
+
+	return [l, c, h];
+};
+
+convert.lch.lab = function (lch) {
+	var l = lch[0];
+	var c = lch[1];
+	var h = lch[2];
+	var a;
+	var b;
+	var hr;
+
+	hr = h / 360 * 2 * Math.PI;
+	a = c * Math.cos(hr);
+	b = c * Math.sin(hr);
+
+	return [l, a, b];
+};
+
+convert.rgb.ansi16 = function (args) {
+	var r = args[0];
+	var g = args[1];
+	var b = args[2];
+	var value = 1 in arguments ? arguments[1] : convert.rgb.hsv(args)[2]; // hsv -> ansi16 optimization
+
+	value = Math.round(value / 50);
+
+	if (value === 0) {
+		return 30;
+	}
+
+	var ansi = 30
+		+ ((Math.round(b / 255) << 2)
+		| (Math.round(g / 255) << 1)
+		| Math.round(r / 255));
+
+	if (value === 2) {
+		ansi += 60;
+	}
+
+	return ansi;
+};
+
+convert.hsv.ansi16 = function (args) {
+	// optimization here; we already know the value and don't need to get
+	// it converted for us.
+	return convert.rgb.ansi16(convert.hsv.rgb(args), args[2]);
+};
+
+convert.rgb.ansi256 = function (args) {
+	var r = args[0];
+	var g = args[1];
+	var b = args[2];
+
+	// we use the extended greyscale palette here, with the exception of
+	// black and white. normal palette only has 4 greyscale shades.
+	if (r === g && g === b) {
+		if (r < 8) {
+			return 16;
+		}
+
+		if (r > 248) {
+			return 231;
+		}
+
+		return Math.round(((r - 8) / 247) * 24) + 232;
+	}
+
+	var ansi = 16
+		+ (36 * Math.round(r / 255 * 5))
+		+ (6 * Math.round(g / 255 * 5))
+		+ Math.round(b / 255 * 5);
+
+	return ansi;
+};
+
+convert.ansi16.rgb = function (args) {
+	var color = args % 10;
+
+	// handle greyscale
+	if (color === 0 || color === 7) {
+		if (args > 50) {
+			color += 3.5;
+		}
+
+		color = color / 10.5 * 255;
+
+		return [color, color, color];
+	}
+
+	var mult = (~~(args > 50) + 1) * 0.5;
+	var r = ((color & 1) * mult) * 255;
+	var g = (((color >> 1) & 1) * mult) * 255;
+	var b = (((color >> 2) & 1) * mult) * 255;
+
+	return [r, g, b];
+};
+
+convert.ansi256.rgb = function (args) {
+	// handle greyscale
+	if (args >= 232) {
+		var c = (args - 232) * 10 + 8;
+		return [c, c, c];
+	}
+
+	args -= 16;
+
+	var rem;
+	var r = Math.floor(args / 36) / 5 * 255;
+	var g = Math.floor((rem = args % 36) / 6) / 5 * 255;
+	var b = (rem % 6) / 5 * 255;
+
+	return [r, g, b];
+};
+
+convert.rgb.hex = function (args) {
+	var integer = ((Math.round(args[0]) & 0xFF) << 16)
+		+ ((Math.round(args[1]) & 0xFF) << 8)
+		+ (Math.round(args[2]) & 0xFF);
+
+	var string = integer.toString(16).toUpperCase();
+	return '000000'.substring(string.length) + string;
+};
+
+convert.hex.rgb = function (args) {
+	var match = args.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i);
+	if (!match) {
+		return [0, 0, 0];
+	}
+
+	var colorString = match[0];
+
+	if (match[0].length === 3) {
+		colorString = colorString.split('').map(function (char) {
+			return char + char;
+		}).join('');
+	}
+
+	var integer = parseInt(colorString, 16);
+	var r = (integer >> 16) & 0xFF;
+	var g = (integer >> 8) & 0xFF;
+	var b = integer & 0xFF;
+
+	return [r, g, b];
+};
+
+convert.rgb.hcg = function (rgb) {
+	var r = rgb[0] / 255;
+	var g = rgb[1] / 255;
+	var b = rgb[2] / 255;
+	var max = Math.max(Math.max(r, g), b);
+	var min = Math.min(Math.min(r, g), b);
+	var chroma = (max - min);
+	var grayscale;
+	var hue;
+
+	if (chroma < 1) {
+		grayscale = min / (1 - chroma);
+	} else {
+		grayscale = 0;
+	}
+
+	if (chroma <= 0) {
+		hue = 0;
+	} else
+	if (max === r) {
+		hue = ((g - b) / chroma) % 6;
+	} else
+	if (max === g) {
+		hue = 2 + (b - r) / chroma;
+	} else {
+		hue = 4 + (r - g) / chroma + 4;
+	}
+
+	hue /= 6;
+	hue %= 1;
+
+	return [hue * 360, chroma * 100, grayscale * 100];
+};
+
+convert.hsl.hcg = function (hsl) {
+	var s = hsl[1] / 100;
+	var l = hsl[2] / 100;
+	var c = 1;
+	var f = 0;
+
+	if (l < 0.5) {
+		c = 2.0 * s * l;
+	} else {
+		c = 2.0 * s * (1.0 - l);
+	}
+
+	if (c < 1.0) {
+		f = (l - 0.5 * c) / (1.0 - c);
+	}
+
+	return [hsl[0], c * 100, f * 100];
+};
+
+convert.hsv.hcg = function (hsv) {
+	var s = hsv[1] / 100;
+	var v = hsv[2] / 100;
+
+	var c = s * v;
+	var f = 0;
+
+	if (c < 1.0) {
+		f = (v - c) / (1 - c);
+	}
+
+	return [hsv[0], c * 100, f * 100];
+};
+
+convert.hcg.rgb = function (hcg) {
+	var h = hcg[0] / 360;
+	var c = hcg[1] / 100;
+	var g = hcg[2] / 100;
+
+	if (c === 0.0) {
+		return [g * 255, g * 255, g * 255];
+	}
+
+	var pure = [0, 0, 0];
+	var hi = (h % 1) * 6;
+	var v = hi % 1;
+	var w = 1 - v;
+	var mg = 0;
+
+	switch (Math.floor(hi)) {
+		case 0:
+			pure[0] = 1; pure[1] = v; pure[2] = 0; break;
+		case 1:
+			pure[0] = w; pure[1] = 1; pure[2] = 0; break;
+		case 2:
+			pure[0] = 0; pure[1] = 1; pure[2] = v; break;
+		case 3:
+			pure[0] = 0; pure[1] = w; pure[2] = 1; break;
+		case 4:
+			pure[0] = v; pure[1] = 0; pure[2] = 1; break;
+		default:
+			pure[0] = 1; pure[1] = 0; pure[2] = w;
+	}
+
+	mg = (1.0 - c) * g;
+
+	return [
+		(c * pure[0] + mg) * 255,
+		(c * pure[1] + mg) * 255,
+		(c * pure[2] + mg) * 255
+	];
+};
+
+convert.hcg.hsv = function (hcg) {
+	var c = hcg[1] / 100;
+	var g = hcg[2] / 100;
+
+	var v = c + g * (1.0 - c);
+	var f = 0;
+
+	if (v > 0.0) {
+		f = c / v;
+	}
+
+	return [hcg[0], f * 100, v * 100];
+};
+
+convert.hcg.hsl = function (hcg) {
+	var c = hcg[1] / 100;
+	var g = hcg[2] / 100;
+
+	var l = g * (1.0 - c) + 0.5 * c;
+	var s = 0;
+
+	if (l > 0.0 && l < 0.5) {
+		s = c / (2 * l);
+	} else
+	if (l >= 0.5 && l < 1.0) {
+		s = c / (2 * (1 - l));
+	}
+
+	return [hcg[0], s * 100, l * 100];
+};
+
+convert.hcg.hwb = function (hcg) {
+	var c = hcg[1] / 100;
+	var g = hcg[2] / 100;
+	var v = c + g * (1.0 - c);
+	return [hcg[0], (v - c) * 100, (1 - v) * 100];
+};
+
+convert.hwb.hcg = function (hwb) {
+	var w = hwb[1] / 100;
+	var b = hwb[2] / 100;
+	var v = 1 - b;
+	var c = v - w;
+	var g = 0;
+
+	if (c < 1) {
+		g = (v - c) / (1 - c);
+	}
+
+	return [hwb[0], c * 100, g * 100];
+};
+
+convert.apple.rgb = function (apple) {
+	return [(apple[0] / 65535) * 255, (apple[1] / 65535) * 255, (apple[2] / 65535) * 255];
+};
+
+convert.rgb.apple = function (rgb) {
+	return [(rgb[0] / 255) * 65535, (rgb[1] / 255) * 65535, (rgb[2] / 255) * 65535];
+};
+
+convert.gray.rgb = function (args) {
+	return [args[0] / 100 * 255, args[0] / 100 * 255, args[0] / 100 * 255];
+};
+
+convert.gray.hsl = convert.gray.hsv = function (args) {
+	return [0, 0, args[0]];
+};
+
+convert.gray.hwb = function (gray) {
+	return [0, 100, gray[0]];
+};
+
+convert.gray.cmyk = function (gray) {
+	return [0, 0, 0, gray[0]];
+};
+
+convert.gray.lab = function (gray) {
+	return [gray[0], 0, 0];
+};
+
+convert.gray.hex = function (gray) {
+	var val = Math.round(gray[0] / 100 * 255) & 0xFF;
+	var integer = (val << 16) + (val << 8) + val;
+
+	var string = integer.toString(16).toUpperCase();
+	return '000000'.substring(string.length) + string;
+};
+
+convert.rgb.gray = function (rgb) {
+	var val = (rgb[0] + rgb[1] + rgb[2]) / 3;
+	return [val / 255 * 100];
+};
diff --git a/ddb_main/node_modules/color/node_modules/color-convert/index.js b/ddb_main/node_modules/color/node_modules/color-convert/index.js
new file mode 100644
index 0000000..e65b5d7
--- /dev/null
+++ b/ddb_main/node_modules/color/node_modules/color-convert/index.js
@@ -0,0 +1,78 @@
+var conversions = require('./conversions');
+var route = require('./route');
+
+var convert = {};
+
+var models = Object.keys(conversions);
+
+function wrapRaw(fn) {
+	var wrappedFn = function (args) {
+		if (args === undefined || args === null) {
+			return args;
+		}
+
+		if (arguments.length > 1) {
+			args = Array.prototype.slice.call(arguments);
+		}
+
+		return fn(args);
+	};
+
+	// preserve .conversion property if there is one
+	if ('conversion' in fn) {
+		wrappedFn.conversion = fn.conversion;
+	}
+
+	return wrappedFn;
+}
+
+function wrapRounded(fn) {
+	var wrappedFn = function (args) {
+		if (args === undefined || args === null) {
+			return args;
+		}
+
+		if (arguments.length > 1) {
+			args = Array.prototype.slice.call(arguments);
+		}
+
+		var result = fn(args);
+
+		// we're assuming the result is an array here.
+		// see notice in conversions.js; don't use box types
+		// in conversion functions.
+		if (typeof result === 'object') {
+			for (var len = result.length, i = 0; i < len; i++) {
+				result[i] = Math.round(result[i]);
+			}
+		}
+
+		return result;
+	};
+
+	// preserve .conversion property if there is one
+	if ('conversion' in fn) {
+		wrappedFn.conversion = fn.conversion;
+	}
+
+	return wrappedFn;
+}
+
+models.forEach(function (fromModel) {
+	convert[fromModel] = {};
+
+	Object.defineProperty(convert[fromModel], 'channels', {value: conversions[fromModel].channels});
+	Object.defineProperty(convert[fromModel], 'labels', {value: conversions[fromModel].labels});
+
+	var routes = route(fromModel);
+	var routeModels = Object.keys(routes);
+
+	routeModels.forEach(function (toModel) {
+		var fn = routes[toModel];
+
+		convert[fromModel][toModel] = wrapRounded(fn);
+		convert[fromModel][toModel].raw = wrapRaw(fn);
+	});
+});
+
+module.exports = convert;
diff --git a/ddb_main/node_modules/color/node_modules/color-convert/route.js b/ddb_main/node_modules/color/node_modules/color-convert/route.js
new file mode 100644
index 0000000..0a1fdea
--- /dev/null
+++ b/ddb_main/node_modules/color/node_modules/color-convert/route.js
@@ -0,0 +1,97 @@
+var conversions = require('./conversions');
+
+/*
+	this function routes a model to all other models.
+
+	all functions that are routed have a property `.conversion` attached
+	to the returned synthetic function. This property is an array
+	of strings, each with the steps in between the 'from' and 'to'
+	color models (inclusive).
+
+	conversions that are not possible simply are not included.
+*/
+
+function buildGraph() {
+	var graph = {};
+	// https://jsperf.com/object-keys-vs-for-in-with-closure/3
+	var models = Object.keys(conversions);
+
+	for (var len = models.length, i = 0; i < len; i++) {
+		graph[models[i]] = {
+			// http://jsperf.com/1-vs-infinity
+			// micro-opt, but this is simple.
+			distance: -1,
+			parent: null
+		};
+	}
+
+	return graph;
+}
+
+// https://en.wikipedia.org/wiki/Breadth-first_search
+function deriveBFS(fromModel) {
+	var graph = buildGraph();
+	var queue = [fromModel]; // unshift -> queue -> pop
+
+	graph[fromModel].distance = 0;
+
+	while (queue.length) {
+		var current = queue.pop();
+		var adjacents = Object.keys(conversions[current]);
+
+		for (var len = adjacents.length, i = 0; i < len; i++) {
+			var adjacent = adjacents[i];
+			var node = graph[adjacent];
+
+			if (node.distance === -1) {
+				node.distance = graph[current].distance + 1;
+				node.parent = current;
+				queue.unshift(adjacent);
+			}
+		}
+	}
+
+	return graph;
+}
+
+function link(from, to) {
+	return function (args) {
+		return to(from(args));
+	};
+}
+
+function wrapConversion(toModel, graph) {
+	var path = [graph[toModel].parent, toModel];
+	var fn = conversions[graph[toModel].parent][toModel];
+
+	var cur = graph[toModel].parent;
+	while (graph[cur].parent) {
+		path.unshift(graph[cur].parent);
+		fn = link(conversions[graph[cur].parent][cur], fn);
+		cur = graph[cur].parent;
+	}
+
+	fn.conversion = path;
+	return fn;
+}
+
+module.exports = function (fromModel) {
+	var graph = deriveBFS(fromModel);
+	var conversion = {};
+
+	var models = Object.keys(graph);
+	for (var len = models.length, i = 0; i < len; i++) {
+		var toModel = models[i];
+		var node = graph[toModel];
+
+		if (node.parent === null) {
+			// no possible conversion, or this node is the source model.
+			continue;
+		}
+
+		conversion[toModel] = wrapConversion(toModel, graph);
+	}
+
+	return conversion;
+};
+
diff --git a/ddb_main/node_modules/color/node_modules/color-name/index.js b/ddb_main/node_modules/color/node_modules/color-name/index.js
new file mode 100644
index 0000000..b7c198a
--- /dev/null
+++ b/ddb_main/node_modules/color/node_modules/color-name/index.js
@@ -0,0 +1,152 @@
+'use strict'
+
+module.exports = {
+	"aliceblue": [240, 248, 255],
+	"antiquewhite": [250, 235, 215],
+	"aqua": [0, 255, 255],
+	"aquamarine": [127, 255, 212],
+	"azure": [240, 255, 255],
+	"beige": [245, 245, 220],
+	"bisque": [255, 228, 196],
+	"black": [0, 0, 0],
+	"blanchedalmond": [255, 235, 205],
+	"blue": [0, 0, 255],
+	"blueviolet": [138, 43, 226],
+	"brown": [165, 42, 42],
+	"burlywood": [222, 184, 135],
+	"cadetblue": [95, 158, 160],
+	"chartreuse": [127, 255, 0],
+	"chocolate": [210, 105, 30],
+	"coral": [255, 127, 80],
+	"cornflowerblue": [100, 149, 237],
+	"cornsilk": [255, 248, 220],
+	"crimson": [220, 20, 60],
+	"cyan": [0, 255, 255],
+	"darkblue": [0, 0, 139],
+	"darkcyan": [0, 139, 139],
+	"darkgoldenrod": [184, 134, 11],
+	"darkgray": [169, 169, 169],
+	"darkgreen": [0, 100, 0],
+	"darkgrey": [169, 169, 169],
+	"darkkhaki": [189, 183, 107],
+	"darkmagenta": [139, 0, 139],
+	"darkolivegreen": [85, 107, 47],
+	"darkorange": [255, 140, 0],
+	"darkorchid": [153, 50, 204],
+	"darkred": [139, 0, 0],
+	"darksalmon": [233, 150, 122],
+	"darkseagreen": [143, 188, 143],
+	"darkslateblue": [72, 61, 139],
+	"darkslategray": [47, 79, 79],
+	"darkslategrey": [47, 79, 79],
+	"darkturquoise": [0, 206, 209],
+	"darkviolet": [148, 0, 211],
+	"deeppink": [255, 20, 147],
+	"deepskyblue": [0, 191, 255],
+	"dimgray": [105, 105, 105],
+	"dimgrey": [105, 105, 105],
+	"dodgerblue": [30, 144, 255],
+	"firebrick": [178, 34, 34],
+	"floralwhite": [255, 250, 240],
+	"forestgreen": [34, 139, 34],
+	"fuchsia": [255, 0, 255],
+	"gainsboro": [220, 220, 220],
+	"ghostwhite": [248, 248, 255],
+	"gold": [255, 215, 0],
+	"goldenrod": [218, 165, 32],
+	"gray": [128, 128, 128],
+	"green": [0, 128, 0],
+	"greenyellow": [173, 255, 47],
+	"grey": [128, 128, 128],
+	"honeydew": [240, 255, 240],
+	"hotpink": [255, 105, 180],
+	"indianred": [205, 92, 92],
+	"indigo": [75, 0, 130],
+	"ivory": [255, 255, 240],
+	"khaki": [240, 230, 140],
+	"lavender": [230, 230, 250],
+	"lavenderblush": [255, 240, 245],
+	"lawngreen": [124, 252, 0],
+	"lemonchiffon": [255, 250, 205],
+	"lightblue": [173, 216, 230],
+	"lightcoral": [240, 128, 128],
+	"lightcyan": [224, 255, 255],
+	"lightgoldenrodyellow": [250, 250, 210],
+	"lightgray": [211, 211, 211],
+	"lightgreen": [144, 238, 144],
+	"lightgrey": [211, 211, 211],
+	"lightpink": [255, 182, 193],
+	"lightsalmon": [255, 160, 122],
+	"lightseagreen": [32, 178, 170],
+	"lightskyblue": [135, 206, 250],
+	"lightslategray": [119, 136, 153],
+	"lightslategrey": [119, 136, 153],
+	"lightsteelblue": [176, 196, 222],
+	"lightyellow": [255, 255, 224],
+	"lime": [0, 255, 0],
+	"limegreen": [50, 205, 50],
+	"linen": [250, 240, 230],
+	"magenta": [255, 0, 255],
+	"maroon": [128, 0, 0],
+	"mediumaquamarine": [102, 205, 170],
+	"mediumblue": [0, 0, 205],
+	"mediumorchid": [186, 85, 211],
+	"mediumpurple": [147, 112, 219],
+	"mediumseagreen": [60, 179, 113],
+	"mediumslateblue": [123, 104, 238],
+	"mediumspringgreen": [0, 250, 154],
+	"mediumturquoise": [72, 209, 204],
+	"mediumvioletred": [199, 21, 133],
+	"midnightblue": [25, 25, 112],
+	"mintcream": [245, 255, 250],
+	"mistyrose": [255, 228, 225],
+	"moccasin": [255, 228, 181],
+	"navajowhite": [255, 222, 173],
+	"navy": [0, 0, 128],
+	"oldlace": [253, 245, 230],
+	"olive": [128, 128, 0],
+	"olivedrab": [107, 142, 35],
+	"orange": [255, 165, 0],
+	"orangered": [255, 69, 0],
+	"orchid": [218, 112, 214],
+	"palegoldenrod": [238, 232, 170],
+	"palegreen": [152, 251, 152],
+	"paleturquoise": [175, 238, 238],
+	"palevioletred": [219, 112, 147],
+	"papayawhip": [255, 239, 213],
+	"peachpuff": [255, 218, 185],
+	"peru": [205, 133, 63],
+	"pink": [255, 192, 203],
+	"plum": [221, 160, 221],
+	"powderblue": [176, 224, 230],
+	"purple": [128, 0, 128],
+	"rebeccapurple": [102, 51, 153],
+	"red": [255, 0, 0],
+	"rosybrown": [188, 143, 143],
+	"royalblue": [65, 105, 225],
+	"saddlebrown": [139, 69, 19],
+	"salmon": [250, 128, 114],
+	"sandybrown": [244, 164, 96],
+	"seagreen": [46, 139, 87],
+	"seashell": [255, 245, 238],
+	"sienna": [160, 82, 45],
+	"silver": [192, 192, 192],
+	"skyblue": [135, 206, 235],
+	"slateblue": [106, 90, 205],
+	"slategray": [112, 128, 144],
+	"slategrey": [112, 128, 144],
+	"snow": [255, 250, 250],
+	"springgreen": [0, 255, 127],
+	"steelblue": [70, 130, 180],
+	"tan": [210, 180, 140],
+	"teal": [0, 128, 128],
+	"thistle": [216, 191, 216],
+	"tomato": [255, 99, 71],
+	"turquoise": [64, 224, 208],
+	"violet": [238, 130, 238],
+	"wheat": [245, 222, 179],
+	"white": [255, 255, 255],
+	"whitesmoke": [245, 245, 245],
+	"yellow": [255, 255, 0],
+	"yellowgreen": [154, 205, 50]
+};
diff --git a/ddb_main/node_modules/core-js/internals/a-callable.js b/ddb_main/node_modules/core-js/internals/a-callable.js
new file mode 100644
index 0000000..0aae1ad
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/a-callable.js
@@ -0,0 +1,11 @@
+'use strict';
+var isCallable = require('../internals/is-callable');
+var tryToString = require('../internals/try-to-string');
+
+var $TypeError = TypeError;
+
+// `Assert: IsCallable(argument) is true`
+module.exports = function (argument) {
+  if (isCallable(argument)) return argument;
+  throw new $TypeError(tryToString(argument) + ' is not a function');
+};
diff --git a/ddb_main/node_modules/core-js/internals/a-possible-prototype.js b/ddb_main/node_modules/core-js/internals/a-possible-prototype.js
new file mode 100644
index 0000000..d800258
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/a-possible-prototype.js
@@ -0,0 +1,10 @@
+'use strict';
+var isPossiblePrototype = require('../internals/is-possible-prototype');
+
+var $String = String;
+var $TypeError = TypeError;
+
+module.exports = function (argument) {
+  if (isPossiblePrototype(argument)) return argument;
+  throw new $TypeError("Can't set " + $String(argument) + ' as a prototype');
+};
diff --git a/ddb_main/node_modules/core-js/internals/add-to-unscopables.js b/ddb_main/node_modules/core-js/internals/add-to-unscopables.js
new file mode 100644
index 0000000..c0908db
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/add-to-unscopables.js
@@ -0,0 +1,21 @@
+'use strict';
+var wellKnownSymbol = require('../internals/well-known-symbol');
+var create = require('../internals/object-create');
+var defineProperty = require('../internals/object-define-property').f;
+
+var UNSCOPABLES = wellKnownSymbol('unscopables');
+var ArrayPrototype = Array.prototype;
+
+// Array.prototype[@@unscopables]
+// https://tc39.es/ecma262/#sec-array.prototype-@@unscopables
+if (ArrayPrototype[UNSCOPABLES] === undefined) {
+  defineProperty(ArrayPrototype, UNSCOPABLES, {
+    configurable: true,
+    value: create(null)
+  });
+}
+
+// add a key to Array.prototype[@@unscopables]
+module.exports = function (key) {
+  ArrayPrototype[UNSCOPABLES][key] = true;
+};
diff --git a/ddb_main/node_modules/core-js/internals/an-instance.js b/ddb_main/node_modules/core-js/internals/an-instance.js
new file mode 100644
index 0000000..ba3422d
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/an-instance.js
@@ -0,0 +1,9 @@
+'use strict';
+var isPrototypeOf = require('../internals/object-is-prototype-of');
+
+var $TypeError = TypeError;
+
+module.exports = function (it, Prototype) {
+  if (isPrototypeOf(Prototype, it)) return it;
+  throw new $TypeError('Incorrect invocation');
+};
diff --git a/ddb_main/node_modules/core-js/internals/an-object.js b/ddb_main/node_modules/core-js/internals/an-object.js
new file mode 100644
index 0000000..c782e78
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/an-object.js
@@ -0,0 +1,11 @@
+'use strict';
+var isObject = require('../internals/is-object');
+
+var $String = String;
+var $TypeError = TypeError;
+
+// `Assert: Type(argument) is Object`
+module.exports = function (argument) {
+  if (isObject(argument)) return argument;
+  throw new $TypeError($String(argument) + ' is not an object');
+};
diff --git a/ddb_main/node_modules/core-js/internals/array-from.js b/ddb_main/node_modules/core-js/internals/array-from.js
new file mode 100644
index 0000000..e187939
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/array-from.js
@@ -0,0 +1,46 @@
+'use strict';
+var bind = require('../internals/function-bind-context');
+var call = require('../internals/function-call');
+var toObject = require('../internals/to-object');
+var callWithSafeIterationClosing = require('../internals/call-with-safe-iteration-closing');
+var isArrayIteratorMethod = require('../internals/is-array-iterator-method');
+var isConstructor = require('../internals/is-constructor');
+var lengthOfArrayLike = require('../internals/length-of-array-like');
+var createProperty = require('../internals/create-property');
+var getIterator = require('../internals/get-iterator');
+var getIteratorMethod = require('../internals/get-iterator-method');
+
+var $Array = Array;
+
+// `Array.from` method implementation
+// https://tc39.es/ecma262/#sec-array.from
+module.exports = function from(arrayLike /* , mapfn = undefined, thisArg = undefined */) {
+  var O = toObject(arrayLike);
+  var IS_CONSTRUCTOR = isConstructor(this);
+  var argumentsLength = arguments.length;
+  var mapfn = argumentsLength > 1 ? arguments[1] : undefined;
+  var mapping = mapfn !== undefined;
+  if (mapping) mapfn = bind(mapfn, argumentsLength > 2 ? arguments[2] : undefined);
+  var iteratorMethod = getIteratorMethod(O);
+  var index = 0;
+  var length, result, step, iterator, next, value;
+  // if the target is not iterable or it's an array with the default iterator - use a simple case
+  if (iteratorMethod && !(this === $Array && isArrayIteratorMethod(iteratorMethod))) {
+    result = IS_CONSTRUCTOR ? new this() : [];
+    iterator = getIterator(O, iteratorMethod);
+    next = iterator.next;
+    for (;!(step = call(next, iterator)).done; index++) {
+      value = mapping ? callWithSafeIterationClosing(iterator, mapfn, [step.value, index], true) : step.value;
+      createProperty(result, index, value);
+    }
+  } else {
+    length = lengthOfArrayLike(O);
+    result = IS_CONSTRUCTOR ? new this(length) : $Array(length);
+    for (;length > index; index++) {
+      value = mapping ? mapfn(O[index], index) : O[index];
+      createProperty(result, index, value);
+    }
+  }
+  result.length = index;
+  return result;
+};
diff --git a/ddb_main/node_modules/core-js/internals/array-includes.js b/ddb_main/node_modules/core-js/internals/array-includes.js
new file mode 100644
index 0000000..556d54a
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/array-includes.js
@@ -0,0 +1,34 @@
+'use strict';
+var toIndexedObject = require('../internals/to-indexed-object');
+var toAbsoluteIndex = require('../internals/to-absolute-index');
+var lengthOfArrayLike = require('../internals/length-of-array-like');
+
+// `Array.prototype.{ indexOf, includes }` methods implementation
+var createMethod = function (IS_INCLUDES) {
+  return function ($this, el, fromIndex) {
+    var O = toIndexedObject($this);
+    var length = lengthOfArrayLike(O);
+    if (length === 0) return !IS_INCLUDES && -1;
+    var index = toAbsoluteIndex(fromIndex, length);
+    var value;
+    // Array#includes uses SameValueZero equality algorithm
+    // eslint-disable-next-line no-self-compare -- NaN check
+    if (IS_INCLUDES && el !== el) while (length > index) {
+      value = O[index++];
+      // eslint-disable-next-line no-self-compare -- NaN check
+      if (value !== value) return true;
+    // Array#indexOf ignores holes, Array#includes - not
+    } else for (;length > index; index++) {
+      if ((IS_INCLUDES || index in O) && O[index] === el) return IS_INCLUDES || index || 0;
+    } return !IS_INCLUDES && -1;
+  };
+};
+
+module.exports = {
+  // `Array.prototype.includes` method
+  // https://tc39.es/ecma262/#sec-array.prototype.includes
+  includes: createMethod(true),
+  // `Array.prototype.indexOf` method
+  // https://tc39.es/ecma262/#sec-array.prototype.indexof
+  indexOf: createMethod(false)
+};
diff --git a/ddb_main/node_modules/core-js/internals/array-slice.js b/ddb_main/node_modules/core-js/internals/array-slice.js
new file mode 100644
index 0000000..b18786f
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/array-slice.js
@@ -0,0 +1,4 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+
+module.exports = uncurryThis([].slice);
diff --git a/ddb_main/node_modules/core-js/internals/array-sort.js b/ddb_main/node_modules/core-js/internals/array-sort.js
new file mode 100644
index 0000000..c12faf1
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/array-sort.js
@@ -0,0 +1,42 @@
+'use strict';
+var arraySlice = require('../internals/array-slice');
+
+var floor = Math.floor;
+
+var sort = function (array, comparefn) {
+  var length = array.length;
+
+  if (length < 8) {
+    // insertion sort
+    var i = 1;
+    var element, j;
+
+    while (i < length) {
+      j = i;
+      element = array[i];
+      while (j && comparefn(array[j - 1], element) > 0) {
+        array[j] = array[--j];
+      }
+      if (j !== i++) array[j] = element;
+    }
+  } else {
+    // merge sort
+    var middle = floor(length / 2);
+    var left = sort(arraySlice(array, 0, middle), comparefn);
+    var right = sort(arraySlice(array, middle), comparefn);
+    var llength = left.length;
+    var rlength = right.length;
+    var lindex = 0;
+    var rindex = 0;
+
+    while (lindex < llength || rindex < rlength) {
+      array[lindex + rindex] = (lindex < llength && rindex < rlength)
+        ? comparefn(left[lindex], right[rindex]) <= 0 ? left[lindex++] : right[rindex++]
+        : lindex < llength ? left[lindex++] : right[rindex++];
+    }
+  }
+
+  return array;
+};
+
+module.exports = sort;
diff --git a/ddb_main/node_modules/core-js/internals/call-with-safe-iteration-closing.js b/ddb_main/node_modules/core-js/internals/call-with-safe-iteration-closing.js
new file mode 100644
index 0000000..b468c8f
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/call-with-safe-iteration-closing.js
@@ -0,0 +1,12 @@
+'use strict';
+var anObject = require('../internals/an-object');
+var iteratorClose = require('../internals/iterator-close');
+
+// call something on iterator step with safe closing on error
+module.exports = function (iterator, fn, value, ENTRIES) {
+  try {
+    return ENTRIES ? fn(anObject(value)[0], value[1]) : fn(value);
+  } catch (error) {
+    iteratorClose(iterator, 'throw', error);
+  }
+};
diff --git a/ddb_main/node_modules/core-js/internals/classof-raw.js b/ddb_main/node_modules/core-js/internals/classof-raw.js
new file mode 100644
index 0000000..3c3d430
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/classof-raw.js
@@ -0,0 +1,9 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+
+var toString = uncurryThis({}.toString);
+var stringSlice = uncurryThis(''.slice);
+
+module.exports = function (it) {
+  return stringSlice(toString(it), 8, -1);
+};
diff --git a/ddb_main/node_modules/core-js/internals/classof.js b/ddb_main/node_modules/core-js/internals/classof.js
new file mode 100644
index 0000000..8c0fae6
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/classof.js
@@ -0,0 +1,30 @@
+'use strict';
+var TO_STRING_TAG_SUPPORT = require('../internals/to-string-tag-support');
+var isCallable = require('../internals/is-callable');
+var classofRaw = require('../internals/classof-raw');
+var wellKnownSymbol = require('../internals/well-known-symbol');
+
+var TO_STRING_TAG = wellKnownSymbol('toStringTag');
+var $Object = Object;
+
+// ES3 wrong here
+var CORRECT_ARGUMENTS = classofRaw(function () { return arguments; }()) === 'Arguments';
+
+// fallback for IE11 Script Access Denied error
+var tryGet = function (it, key) {
+  try {
+    return it[key];
+  } catch (error) { /* empty */ }
+};
+
+// getting tag from ES6+ `Object.prototype.toString`
+module.exports = TO_STRING_TAG_SUPPORT ? classofRaw : function (it) {
+  var O, tag, result;
+  return it === undefined ? 'Undefined' : it === null ? 'Null'
+    // @@toStringTag case
+    : typeof (tag = tryGet(O = $Object(it), TO_STRING_TAG)) == 'string' ? tag
+    // builtinTag case
+    : CORRECT_ARGUMENTS ? classofRaw(O)
+    // ES3 arguments fallback
+    : (result = classofRaw(O)) === 'Object' && isCallable(O.callee) ? 'Arguments' : result;
+};
diff --git a/ddb_main/node_modules/core-js/internals/copy-constructor-properties.js b/ddb_main/node_modules/core-js/internals/copy-constructor-properties.js
new file mode 100644
index 0000000..8e73d46
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/copy-constructor-properties.js
@@ -0,0 +1,17 @@
+'use strict';
+var hasOwn = require('../internals/has-own-property');
+var ownKeys = require('../internals/own-keys');
+var getOwnPropertyDescriptorModule = require('../internals/object-get-own-property-descriptor');
+var definePropertyModule = require('../internals/object-define-property');
+
+module.exports = function (target, source, exceptions) {
+  var keys = ownKeys(source);
+  var defineProperty = definePropertyModule.f;
+  var getOwnPropertyDescriptor = getOwnPropertyDescriptorModule.f;
+  for (var i = 0; i < keys.length; i++) {
+    var key = keys[i];
+    if (!hasOwn(target, key) && !(exceptions && hasOwn(exceptions, key))) {
+      defineProperty(target, key, getOwnPropertyDescriptor(source, key));
+    }
+  }
+};
diff --git a/ddb_main/node_modules/core-js/internals/correct-prototype-getter.js b/ddb_main/node_modules/core-js/internals/correct-prototype-getter.js
new file mode 100644
index 0000000..e14d4af
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/correct-prototype-getter.js
@@ -0,0 +1,9 @@
+'use strict';
+var fails = require('../internals/fails');
+
+module.exports = !fails(function () {
+  function F() { /* empty */ }
+  F.prototype.constructor = null;
+  // eslint-disable-next-line es/no-object-getprototypeof -- required for testing
+  return Object.getPrototypeOf(new F()) !== F.prototype;
+});
diff --git a/ddb_main/node_modules/core-js/internals/create-iter-result-object.js b/ddb_main/node_modules/core-js/internals/create-iter-result-object.js
new file mode 100644
index 0000000..a05d2d3
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/create-iter-result-object.js
@@ -0,0 +1,6 @@
+'use strict';
+// `CreateIterResultObject` abstract operation
+// https://tc39.es/ecma262/#sec-createiterresultobject
+module.exports = function (value, done) {
+  return { value: value, done: done };
+};
diff --git a/ddb_main/node_modules/core-js/internals/create-non-enumerable-property.js b/ddb_main/node_modules/core-js/internals/create-non-enumerable-property.js
new file mode 100644
index 0000000..718c3a5
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/create-non-enumerable-property.js
@@ -0,0 +1,11 @@
+'use strict';
+var DESCRIPTORS = require('../internals/descriptors');
+var definePropertyModule = require('../internals/object-define-property');
+var createPropertyDescriptor = require('../internals/create-property-descriptor');
+
+module.exports = DESCRIPTORS ? function (object, key, value) {
+  return definePropertyModule.f(object, key, createPropertyDescriptor(1, value));
+} : function (object, key, value) {
+  object[key] = value;
+  return object;
+};
diff --git a/ddb_main/node_modules/core-js/internals/create-property-descriptor.js b/ddb_main/node_modules/core-js/internals/create-property-descriptor.js
new file mode 100644
index 0000000..5ef2773
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/create-property-descriptor.js
@@ -0,0 +1,9 @@
+'use strict';
+module.exports = function (bitmap, value) {
+  return {
+    enumerable: !(bitmap & 1),
+    configurable: !(bitmap & 2),
+    writable: !(bitmap & 4),
+    value: value
+  };
+};
diff --git a/ddb_main/node_modules/core-js/internals/create-property.js b/ddb_main/node_modules/core-js/internals/create-property.js
new file mode 100644
index 0000000..e7f6188
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/create-property.js
@@ -0,0 +1,9 @@
+'use strict';
+var DESCRIPTORS = require('../internals/descriptors');
+var definePropertyModule = require('../internals/object-define-property');
+var createPropertyDescriptor = require('../internals/create-property-descriptor');
+
+module.exports = function (object, key, value) {
+  if (DESCRIPTORS) definePropertyModule.f(object, key, createPropertyDescriptor(0, value));
+  else object[key] = value;
+};
diff --git a/ddb_main/node_modules/core-js/internals/define-built-in-accessor.js b/ddb_main/node_modules/core-js/internals/define-built-in-accessor.js
new file mode 100644
index 0000000..17c9708
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/define-built-in-accessor.js
@@ -0,0 +1,9 @@
+'use strict';
+var makeBuiltIn = require('../internals/make-built-in');
+var defineProperty = require('../internals/object-define-property');
+
+module.exports = function (target, name, descriptor) {
+  if (descriptor.get) makeBuiltIn(descriptor.get, name, { getter: true });
+  if (descriptor.set) makeBuiltIn(descriptor.set, name, { setter: true });
+  return defineProperty.f(target, name, descriptor);
+};
diff --git a/ddb_main/node_modules/core-js/internals/define-built-in.js b/ddb_main/node_modules/core-js/internals/define-built-in.js
new file mode 100644
index 0000000..3594306
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/define-built-in.js
@@ -0,0 +1,28 @@
+'use strict';
+var isCallable = require('../internals/is-callable');
+var definePropertyModule = require('../internals/object-define-property');
+var makeBuiltIn = require('../internals/make-built-in');
+var defineGlobalProperty = require('../internals/define-global-property');
+
+module.exports = function (O, key, value, options) {
+  if (!options) options = {};
+  var simple = options.enumerable;
+  var name = options.name !== undefined ? options.name : key;
+  if (isCallable(value)) makeBuiltIn(value, name, options);
+  if (options.global) {
+    if (simple) O[key] = value;
+    else defineGlobalProperty(key, value);
+  } else {
+    try {
+      if (!options.unsafe) delete O[key];
+      else if (O[key]) simple = true;
+    } catch (error) { /* empty */ }
+    if (simple) O[key] = value;
+    else definePropertyModule.f(O, key, {
+      value: value,
+      enumerable: false,
+      configurable: !options.nonConfigurable,
+      writable: !options.nonWritable
+    });
+  } return O;
+};
diff --git a/ddb_main/node_modules/core-js/internals/define-built-ins.js b/ddb_main/node_modules/core-js/internals/define-built-ins.js
new file mode 100644
index 0000000..1fbd53c
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/define-built-ins.js
@@ -0,0 +1,7 @@
+'use strict';
+var defineBuiltIn = require('../internals/define-built-in');
+
+module.exports = function (target, src, options) {
+  for (var key in src) defineBuiltIn(target, key, src[key], options);
+  return target;
+};
diff --git a/ddb_main/node_modules/core-js/internals/define-global-property.js b/ddb_main/node_modules/core-js/internals/define-global-property.js
new file mode 100644
index 0000000..8178ecc
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/define-global-property.js
@@ -0,0 +1,13 @@
+'use strict';
+var global = require('../internals/global');
+
+// eslint-disable-next-line es/no-object-defineproperty -- safe
+var defineProperty = Object.defineProperty;
+
+module.exports = function (key, value) {
+  try {
+    defineProperty(global, key, { value: value, configurable: true, writable: true });
+  } catch (error) {
+    global[key] = value;
+  } return value;
+};
diff --git a/ddb_main/node_modules/core-js/internals/descriptors.js b/ddb_main/node_modules/core-js/internals/descriptors.js
new file mode 100644
index 0000000..7d6f24a
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/descriptors.js
@@ -0,0 +1,8 @@
+'use strict';
+var fails = require('../internals/fails');
+
+// Detect IE8's incomplete defineProperty implementation
+module.exports = !fails(function () {
+  // eslint-disable-next-line es/no-object-defineproperty -- required for testing
+  return Object.defineProperty({}, 1, { get: function () { return 7; } })[1] !== 7;
+});
diff --git a/ddb_main/node_modules/core-js/internals/document-create-element.js b/ddb_main/node_modules/core-js/internals/document-create-element.js
new file mode 100644
index 0000000..dbbe49f
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/document-create-element.js
@@ -0,0 +1,11 @@
+'use strict';
+var global = require('../internals/global');
+var isObject = require('../internals/is-object');
+
+var document = global.document;
+// typeof document.createElement is 'object' in old IE
+var EXISTS = isObject(document) && isObject(document.createElement);
+
+module.exports = function (it) {
+  return EXISTS ? document.createElement(it) : {};
+};
diff --git a/ddb_main/node_modules/core-js/internals/dom-iterables.js b/ddb_main/node_modules/core-js/internals/dom-iterables.js
new file mode 100644
index 0000000..1dbc1f7
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/dom-iterables.js
@@ -0,0 +1,36 @@
+'use strict';
+// iterable DOM collections
+// flag - `iterable` interface - 'entries', 'keys', 'values', 'forEach' methods
+module.exports = {
+  CSSRuleList: 0,
+  CSSStyleDeclaration: 0,
+  CSSValueList: 0,
+  ClientRectList: 0,
+  DOMRectList: 0,
+  DOMStringList: 0,
+  DOMTokenList: 1,
+  DataTransferItemList: 0,
+  FileList: 0,
+  HTMLAllCollection: 0,
+  HTMLCollection: 0,
+  HTMLFormElement: 0,
+  HTMLSelectElement: 0,
+  MediaList: 0,
+  MimeTypeArray: 0,
+  NamedNodeMap: 0,
+  NodeList: 1,
+  PaintRequestList: 0,
+  Plugin: 0,
+  PluginArray: 0,
+  SVGLengthList: 0,
+  SVGNumberList: 0,
+  SVGPathSegList: 0,
+  SVGPointList: 0,
+  SVGStringList: 0,
+  SVGTransformList: 0,
+  SourceBufferList: 0,
+  StyleSheetList: 0,
+  TextTrackCueList: 0,
+  TextTrackList: 0,
+  TouchList: 0
+};
diff --git a/ddb_main/node_modules/core-js/internals/dom-token-list-prototype.js b/ddb_main/node_modules/core-js/internals/dom-token-list-prototype.js
new file mode 100644
index 0000000..a0c4071
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/dom-token-list-prototype.js
@@ -0,0 +1,8 @@
+'use strict';
+// in old WebKit versions, `element.classList` is not an instance of global `DOMTokenList`
+var documentCreateElement = require('../internals/document-create-element');
+
+var classList = documentCreateElement('span').classList;
+var DOMTokenListPrototype = classList && classList.constructor && classList.constructor.prototype;
+
+module.exports = DOMTokenListPrototype === Object.prototype ? undefined : DOMTokenListPrototype;
diff --git a/ddb_main/node_modules/core-js/internals/engine-user-agent.js b/ddb_main/node_modules/core-js/internals/engine-user-agent.js
new file mode 100644
index 0000000..0966f77
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/engine-user-agent.js
@@ -0,0 +1,2 @@
+'use strict';
+module.exports = typeof navigator != 'undefined' && String(navigator.userAgent) || '';
diff --git a/ddb_main/node_modules/core-js/internals/engine-v8-version.js b/ddb_main/node_modules/core-js/internals/engine-v8-version.js
new file mode 100644
index 0000000..fb94f9b
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/engine-v8-version.js
@@ -0,0 +1,28 @@
+'use strict';
+var global = require('../internals/global');
+var userAgent = require('../internals/engine-user-agent');
+
+var process = global.process;
+var Deno = global.Deno;
+var versions = process && process.versions || Deno && Deno.version;
+var v8 = versions && versions.v8;
+var match, version;
+
+if (v8) {
+  match = v8.split('.');
+  // in old Chrome, versions of V8 isn't V8 = Chrome / 10
+  // but their correct versions are not interesting for us
+  version = match[0] > 0 && match[0] < 4 ? 1 : +(match[0] + match[1]);
+}
+
+// BrowserFS NodeJS `process` polyfill incorrectly set `.v8` to `0.0`
+// so check `userAgent` even if `.v8` exists, but 0
+if (!version && userAgent) {
+  match = userAgent.match(/Edge\/(\d+)/);
+  if (!match || match[1] >= 74) {
+    match = userAgent.match(/Chrome\/(\d+)/);
+    if (match) version = +match[1];
+  }
+}
+
+module.exports = version;
diff --git a/ddb_main/node_modules/core-js/internals/enum-bug-keys.js b/ddb_main/node_modules/core-js/internals/enum-bug-keys.js
new file mode 100644
index 0000000..a99e8a0
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/enum-bug-keys.js
@@ -0,0 +1,11 @@
+'use strict';
+// IE8- don't enum bug keys
+module.exports = [
+  'constructor',
+  'hasOwnProperty',
+  'isPrototypeOf',
+  'propertyIsEnumerable',
+  'toLocaleString',
+  'toString',
+  'valueOf'
+];
diff --git a/ddb_main/node_modules/core-js/internals/export.js b/ddb_main/node_modules/core-js/internals/export.js
new file mode 100644
index 0000000..669f5ad
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/export.js
@@ -0,0 +1,55 @@
+'use strict';
+var global = require('../internals/global');
+var getOwnPropertyDescriptor = require('../internals/object-get-own-property-descriptor').f;
+var createNonEnumerableProperty = require('../internals/create-non-enumerable-property');
+var defineBuiltIn = require('../internals/define-built-in');
+var defineGlobalProperty = require('../internals/define-global-property');
+var copyConstructorProperties = require('../internals/copy-constructor-properties');
+var isForced = require('../internals/is-forced');
+
+/*
+  options.target         - name of the target object
+  options.global         - target is the global object
+  options.stat           - export as static methods of target
+  options.proto          - export as prototype methods of target
+  options.real           - real prototype method for the `pure` version
+  options.forced         - export even if the native feature is available
+  options.bind           - bind methods to the target, required for the `pure` version
+  options.wrap           - wrap constructors to preventing global pollution, required for the `pure` version
+  options.unsafe         - use the simple assignment of property instead of delete + defineProperty
+  options.sham           - add a flag to not completely full polyfills
+  options.enumerable     - export as enumerable property
+  options.dontCallGetSet - prevent calling a getter on target
+  options.name           - the .name of the function if it does not match the key
+*/
+module.exports = function (options, source) {
+  var TARGET = options.target;
+  var GLOBAL = options.global;
+  var STATIC = options.stat;
+  var FORCED, target, key, targetProperty, sourceProperty, descriptor;
+  if (GLOBAL) {
+    target = global;
+  } else if (STATIC) {
+    target = global[TARGET] || defineGlobalProperty(TARGET, {});
+  } else {
+    target = global[TARGET] && global[TARGET].prototype;
+  }
+  if (target) for (key in source) {
+    sourceProperty = source[key];
+    if (options.dontCallGetSet) {
+      descriptor = getOwnPropertyDescriptor(target, key);
+      targetProperty = descriptor && descriptor.value;
+    } else targetProperty = target[key];
+    FORCED = isForced(GLOBAL ? key : TARGET + (STATIC ? '.' : '#') + key, options.forced);
+    // contained in target
+    if (!FORCED && targetProperty !== undefined) {
+      if (typeof sourceProperty == typeof targetProperty) continue;
+      copyConstructorProperties(sourceProperty, targetProperty);
+    }
+    // add a flag to not completely full polyfills
+    if (options.sham || (targetProperty && targetProperty.sham)) {
+      createNonEnumerableProperty(sourceProperty, 'sham', true);
+    }
+    defineBuiltIn(target, key, sourceProperty, options);
+  }
+};
diff --git a/ddb_main/node_modules/core-js/internals/fails.js b/ddb_main/node_modules/core-js/internals/fails.js
new file mode 100644
index 0000000..7880c82
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/fails.js
@@ -0,0 +1,8 @@
+'use strict';
+module.exports = function (exec) {
+  try {
+    return !!exec();
+  } catch (error) {
+    return true;
+  }
+};
diff --git a/ddb_main/node_modules/core-js/internals/function-bind-context.js b/ddb_main/node_modules/core-js/internals/function-bind-context.js
new file mode 100644
index 0000000..73378e8
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/function-bind-context.js
@@ -0,0 +1,14 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this-clause');
+var aCallable = require('../internals/a-callable');
+var NATIVE_BIND = require('../internals/function-bind-native');
+
+var bind = uncurryThis(uncurryThis.bind);
+
+// optional / simple context binding
+module.exports = function (fn, that) {
+  aCallable(fn);
+  return that === undefined ? fn : NATIVE_BIND ? bind(fn, that) : function (/* ...args */) {
+    return fn.apply(that, arguments);
+  };
+};
diff --git a/ddb_main/node_modules/core-js/internals/function-bind-native.js b/ddb_main/node_modules/core-js/internals/function-bind-native.js
new file mode 100644
index 0000000..424f934
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/function-bind-native.js
@@ -0,0 +1,9 @@
+'use strict';
+var fails = require('../internals/fails');
+
+module.exports = !fails(function () {
+  // eslint-disable-next-line es/no-function-prototype-bind -- safe
+  var test = (function () { /* empty */ }).bind();
+  // eslint-disable-next-line no-prototype-builtins -- safe
+  return typeof test != 'function' || test.hasOwnProperty('prototype');
+});
diff --git a/ddb_main/node_modules/core-js/internals/function-call.js b/ddb_main/node_modules/core-js/internals/function-call.js
new file mode 100644
index 0000000..998b4de
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/function-call.js
@@ -0,0 +1,8 @@
+'use strict';
+var NATIVE_BIND = require('../internals/function-bind-native');
+
+var call = Function.prototype.call;
+
+module.exports = NATIVE_BIND ? call.bind(call) : function () {
+  return call.apply(call, arguments);
+};
diff --git a/ddb_main/node_modules/core-js/internals/function-name.js b/ddb_main/node_modules/core-js/internals/function-name.js
new file mode 100644
index 0000000..ce6fdd9
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/function-name.js
@@ -0,0 +1,18 @@
+'use strict';
+var DESCRIPTORS = require('../internals/descriptors');
+var hasOwn = require('../internals/has-own-property');
+
+var FunctionPrototype = Function.prototype;
+// eslint-disable-next-line es/no-object-getownpropertydescriptor -- safe
+var getDescriptor = DESCRIPTORS && Object.getOwnPropertyDescriptor;
+
+var EXISTS = hasOwn(FunctionPrototype, 'name');
+// additional protection from minified / mangled / dropped function names
+var PROPER = EXISTS && (function something() { /* empty */ }).name === 'something';
+var CONFIGURABLE = EXISTS && (!DESCRIPTORS || (DESCRIPTORS && getDescriptor(FunctionPrototype, 'name').configurable));
+
+module.exports = {
+  EXISTS: EXISTS,
+  PROPER: PROPER,
+  CONFIGURABLE: CONFIGURABLE
+};
diff --git a/ddb_main/node_modules/core-js/internals/function-uncurry-this-accessor.js b/ddb_main/node_modules/core-js/internals/function-uncurry-this-accessor.js
new file mode 100644
index 0000000..4d5ef18
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/function-uncurry-this-accessor.js
@@ -0,0 +1,10 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+var aCallable = require('../internals/a-callable');
+
+module.exports = function (object, key, method) {
+  try {
+    // eslint-disable-next-line es/no-object-getownpropertydescriptor -- safe
+    return uncurryThis(aCallable(Object.getOwnPropertyDescriptor(object, key)[method]));
+  } catch (error) { /* empty */ }
+};
diff --git a/ddb_main/node_modules/core-js/internals/function-uncurry-this-clause.js b/ddb_main/node_modules/core-js/internals/function-uncurry-this-clause.js
new file mode 100644
index 0000000..7589e4b
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/function-uncurry-this-clause.js
@@ -0,0 +1,10 @@
+'use strict';
+var classofRaw = require('../internals/classof-raw');
+var uncurryThis = require('../internals/function-uncurry-this');
+
+module.exports = function (fn) {
+  // Nashorn bug:
+  //   https://github.com/zloirock/core-js/issues/1128
+  //   https://github.com/zloirock/core-js/issues/1130
+  if (classofRaw(fn) === 'Function') return uncurryThis(fn);
+};
diff --git a/ddb_main/node_modules/core-js/internals/function-uncurry-this.js b/ddb_main/node_modules/core-js/internals/function-uncurry-this.js
new file mode 100644
index 0000000..2fd36ec
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/function-uncurry-this.js
@@ -0,0 +1,12 @@
+'use strict';
+var NATIVE_BIND = require('../internals/function-bind-native');
+
+var FunctionPrototype = Function.prototype;
+var call = FunctionPrototype.call;
+var uncurryThisWithBind = NATIVE_BIND && FunctionPrototype.bind.bind(call, call);
+
+module.exports = NATIVE_BIND ? uncurryThisWithBind : function (fn) {
+  return function () {
+    return call.apply(fn, arguments);
+  };
+};
diff --git a/ddb_main/node_modules/core-js/internals/get-built-in.js b/ddb_main/node_modules/core-js/internals/get-built-in.js
new file mode 100644
index 0000000..f6a98b7
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/get-built-in.js
@@ -0,0 +1,11 @@
+'use strict';
+var global = require('../internals/global');
+var isCallable = require('../internals/is-callable');
+
+var aFunction = function (argument) {
+  return isCallable(argument) ? argument : undefined;
+};
+
+module.exports = function (namespace, method) {
+  return arguments.length < 2 ? aFunction(global[namespace]) : global[namespace] && global[namespace][method];
+};
diff --git a/ddb_main/node_modules/core-js/internals/get-iterator-method.js b/ddb_main/node_modules/core-js/internals/get-iterator-method.js
new file mode 100644
index 0000000..7c1a58b
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/get-iterator-method.js
@@ -0,0 +1,14 @@
+'use strict';
+var classof = require('../internals/classof');
+var getMethod = require('../internals/get-method');
+var isNullOrUndefined = require('../internals/is-null-or-undefined');
+var Iterators = require('../internals/iterators');
+var wellKnownSymbol = require('../internals/well-known-symbol');
+
+var ITERATOR = wellKnownSymbol('iterator');
+
+module.exports = function (it) {
+  if (!isNullOrUndefined(it)) return getMethod(it, ITERATOR)
+    || getMethod(it, '@@iterator')
+    || Iterators[classof(it)];
+};
diff --git a/ddb_main/node_modules/core-js/internals/get-iterator.js b/ddb_main/node_modules/core-js/internals/get-iterator.js
new file mode 100644
index 0000000..2b4c53e
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/get-iterator.js
@@ -0,0 +1,14 @@
+'use strict';
+var call = require('../internals/function-call');
+var aCallable = require('../internals/a-callable');
+var anObject = require('../internals/an-object');
+var tryToString = require('../internals/try-to-string');
+var getIteratorMethod = require('../internals/get-iterator-method');
+
+var $TypeError = TypeError;
+
+module.exports = function (argument, usingIterator) {
+  var iteratorMethod = arguments.length < 2 ? getIteratorMethod(argument) : usingIterator;
+  if (aCallable(iteratorMethod)) return anObject(call(iteratorMethod, argument));
+  throw new $TypeError(tryToString(argument) + ' is not iterable');
+};
diff --git a/ddb_main/node_modules/core-js/internals/get-method.js b/ddb_main/node_modules/core-js/internals/get-method.js
new file mode 100644
index 0000000..dd3c10c
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/get-method.js
@@ -0,0 +1,10 @@
+'use strict';
+var aCallable = require('../internals/a-callable');
+var isNullOrUndefined = require('../internals/is-null-or-undefined');
+
+// `GetMethod` abstract operation
+// https://tc39.es/ecma262/#sec-getmethod
+module.exports = function (V, P) {
+  var func = V[P];
+  return isNullOrUndefined(func) ? undefined : aCallable(func);
+};
diff --git a/ddb_main/node_modules/core-js/internals/global.js b/ddb_main/node_modules/core-js/internals/global.js
new file mode 100644
index 0000000..a154678
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/global.js
@@ -0,0 +1,16 @@
+'use strict';
+var check = function (it) {
+  return it && it.Math === Math && it;
+};
+
+// https://github.com/zloirock/core-js/issues/86#issuecomment-115759028
+module.exports =
+  // eslint-disable-next-line es/no-global-this -- safe
+  check(typeof globalThis == 'object' && globalThis) ||
+  check(typeof window == 'object' && window) ||
+  // eslint-disable-next-line no-restricted-globals -- safe
+  check(typeof self == 'object' && self) ||
+  check(typeof global == 'object' && global) ||
+  check(typeof this == 'object' && this) ||
+  // eslint-disable-next-line no-new-func -- fallback
+  (function () { return this; })() || Function('return this')();
diff --git a/ddb_main/node_modules/core-js/internals/has-own-property.js b/ddb_main/node_modules/core-js/internals/has-own-property.js
new file mode 100644
index 0000000..336d800
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/has-own-property.js
@@ -0,0 +1,12 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+var toObject = require('../internals/to-object');
+
+var hasOwnProperty = uncurryThis({}.hasOwnProperty);
+
+// `HasOwnProperty` abstract operation
+// https://tc39.es/ecma262/#sec-hasownproperty
+// eslint-disable-next-line es/no-object-hasown -- safe
+module.exports = Object.hasOwn || function hasOwn(it, key) {
+  return hasOwnProperty(toObject(it), key);
+};
diff --git a/ddb_main/node_modules/core-js/internals/hidden-keys.js b/ddb_main/node_modules/core-js/internals/hidden-keys.js
new file mode 100644
index 0000000..648a166
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/hidden-keys.js
@@ -0,0 +1,2 @@
+'use strict';
+module.exports = {};
diff --git a/ddb_main/node_modules/core-js/internals/html.js b/ddb_main/node_modules/core-js/internals/html.js
new file mode 100644
index 0000000..b8da90e
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/html.js
@@ -0,0 +1,4 @@
+'use strict';
+var getBuiltIn = require('../internals/get-built-in');
+
+module.exports = getBuiltIn('document', 'documentElement');
diff --git a/ddb_main/node_modules/core-js/internals/ie8-dom-define.js b/ddb_main/node_modules/core-js/internals/ie8-dom-define.js
new file mode 100644
index 0000000..22719e8
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/ie8-dom-define.js
@@ -0,0 +1,12 @@
+'use strict';
+var DESCRIPTORS = require('../internals/descriptors');
+var fails = require('../internals/fails');
+var createElement = require('../internals/document-create-element');
+
+// Thanks to IE8 for its funny defineProperty
+module.exports = !DESCRIPTORS && !fails(function () {
+  // eslint-disable-next-line es/no-object-defineproperty -- required for testing
+  return Object.defineProperty(createElement('div'), 'a', {
+    get: function () { return 7; }
+  }).a !== 7;
+});
diff --git a/ddb_main/node_modules/core-js/internals/indexed-object.js b/ddb_main/node_modules/core-js/internals/indexed-object.js
new file mode 100644
index 0000000..cea2a9a
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/indexed-object.js
@@ -0,0 +1,16 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+var fails = require('../internals/fails');
+var classof = require('../internals/classof-raw');
+
+var $Object = Object;
+var split = uncurryThis(''.split);
+
+// fallback for non-array-like ES3 and non-enumerable old V8 strings
+module.exports = fails(function () {
+  // throws an error in rhino, see https://github.com/mozilla/rhino/issues/346
+  // eslint-disable-next-line no-prototype-builtins -- safe
+  return !$Object('z').propertyIsEnumerable(0);
+}) ? function (it) {
+  return classof(it) === 'String' ? split(it, '') : $Object(it);
+} : $Object;
diff --git a/ddb_main/node_modules/core-js/internals/inspect-source.js b/ddb_main/node_modules/core-js/internals/inspect-source.js
new file mode 100644
index 0000000..eb9e80c
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/inspect-source.js
@@ -0,0 +1,15 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+var isCallable = require('../internals/is-callable');
+var store = require('../internals/shared-store');
+
+var functionToString = uncurryThis(Function.toString);
+
+// this helper broken in `core-js@3.4.1-3.4.4`, so we can't use `shared` helper
+if (!isCallable(store.inspectSource)) {
+  store.inspectSource = function (it) {
+    return functionToString(it);
+  };
+}
+
+module.exports = store.inspectSource;
diff --git a/ddb_main/node_modules/core-js/internals/internal-state.js b/ddb_main/node_modules/core-js/internals/internal-state.js
new file mode 100644
index 0000000..15f3c44
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/internal-state.js
@@ -0,0 +1,71 @@
+'use strict';
+var NATIVE_WEAK_MAP = require('../internals/weak-map-basic-detection');
+var global = require('../internals/global');
+var isObject = require('../internals/is-object');
+var createNonEnumerableProperty = require('../internals/create-non-enumerable-property');
+var hasOwn = require('../internals/has-own-property');
+var shared = require('../internals/shared-store');
+var sharedKey = require('../internals/shared-key');
+var hiddenKeys = require('../internals/hidden-keys');
+
+var OBJECT_ALREADY_INITIALIZED = 'Object already initialized';
+var TypeError = global.TypeError;
+var WeakMap = global.WeakMap;
+var set, get, has;
+
+var enforce = function (it) {
+  return has(it) ? get(it) : set(it, {});
+};
+
+var getterFor = function (TYPE) {
+  return function (it) {
+    var state;
+    if (!isObject(it) || (state = get(it)).type !== TYPE) {
+      throw new TypeError('Incompatible receiver, ' + TYPE + ' required');
+    } return state;
+  };
+};
+
+if (NATIVE_WEAK_MAP || shared.state) {
+  var store = shared.state || (shared.state = new WeakMap());
+  /* eslint-disable no-self-assign -- prototype methods protection */
+  store.get = store.get;
+  store.has = store.has;
+  store.set = store.set;
+  /* eslint-enable no-self-assign -- prototype methods protection */
+  set = function (it, metadata) {
+    if (store.has(it)) throw new TypeError(OBJECT_ALREADY_INITIALIZED);
+    metadata.facade = it;
+    store.set(it, metadata);
+    return metadata;
+  };
+  get = function (it) {
+    return store.get(it) || {};
+  };
+  has = function (it) {
+    return store.has(it);
+  };
+} else {
+  var STATE = sharedKey('state');
+  hiddenKeys[STATE] = true;
+  set = function (it, metadata) {
+    if (hasOwn(it, STATE)) throw new TypeError(OBJECT_ALREADY_INITIALIZED);
+    metadata.facade = it;
+    createNonEnumerableProperty(it, STATE, metadata);
+    return metadata;
+  };
+  get = function (it) {
+    return hasOwn(it, STATE) ? it[STATE] : {};
+  };
+  has = function (it) {
+    return hasOwn(it, STATE);
+  };
+}
+
+module.exports = {
+  set: set,
+  get: get,
+  has: has,
+  enforce: enforce,
+  getterFor: getterFor
+};
diff --git a/ddb_main/node_modules/core-js/internals/is-array-iterator-method.js b/ddb_main/node_modules/core-js/internals/is-array-iterator-method.js
new file mode 100644
index 0000000..6878983
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/is-array-iterator-method.js
@@ -0,0 +1,11 @@
+'use strict';
+var wellKnownSymbol = require('../internals/well-known-symbol');
+var Iterators = require('../internals/iterators');
+
+var ITERATOR = wellKnownSymbol('iterator');
+var ArrayPrototype = Array.prototype;
+
+// check on default Array iterator
+module.exports = function (it) {
+  return it !== undefined && (Iterators.Array === it || ArrayPrototype[ITERATOR] === it);
+};
diff --git a/ddb_main/node_modules/core-js/internals/is-callable.js b/ddb_main/node_modules/core-js/internals/is-callable.js
new file mode 100644
index 0000000..bf80463
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/is-callable.js
@@ -0,0 +1,12 @@
+'use strict';
+// https://tc39.es/ecma262/#sec-IsHTMLDDA-internal-slot
+var documentAll = typeof document == 'object' && document.all;
+
+// `IsCallable` abstract operation
+// https://tc39.es/ecma262/#sec-iscallable
+// eslint-disable-next-line unicorn/no-typeof-undefined -- required for testing
+module.exports = typeof documentAll == 'undefined' && documentAll !== undefined ? function (argument) {
+  return typeof argument == 'function' || argument === documentAll;
+} : function (argument) {
+  return typeof argument == 'function';
+};
diff --git a/ddb_main/node_modules/core-js/internals/is-constructor.js b/ddb_main/node_modules/core-js/internals/is-constructor.js
new file mode 100644
index 0000000..36d7342
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/is-constructor.js
@@ -0,0 +1,52 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+var fails = require('../internals/fails');
+var isCallable = require('../internals/is-callable');
+var classof = require('../internals/classof');
+var getBuiltIn = require('../internals/get-built-in');
+var inspectSource = require('../internals/inspect-source');
+
+var noop = function () { /* empty */ };
+var construct = getBuiltIn('Reflect', 'construct');
+var constructorRegExp = /^\s*(?:class|function)\b/;
+var exec = uncurryThis(constructorRegExp.exec);
+var INCORRECT_TO_STRING = !constructorRegExp.test(noop);
+
+var isConstructorModern = function isConstructor(argument) {
+  if (!isCallable(argument)) return false;
+  try {
+    construct(noop, [], argument);
+    return true;
+  } catch (error) {
+    return false;
+  }
+};
+
+var isConstructorLegacy = function isConstructor(argument) {
+  if (!isCallable(argument)) return false;
+  switch (classof(argument)) {
+    case 'AsyncFunction':
+    case 'GeneratorFunction':
+    case 'AsyncGeneratorFunction': return false;
+  }
+  try {
+    // we can't check .prototype since constructors produced by .bind haven't it
+    // `Function#toString` throws on some built-it function in some legacy engines
+    // (for example, `DOMQuad` and similar in FF41-)
+    return INCORRECT_TO_STRING || !!exec(constructorRegExp, inspectSource(argument));
+  } catch (error) {
+    return true;
+  }
+};
+
+isConstructorLegacy.sham = true;
+
+// `IsConstructor` abstract operation
+// https://tc39.es/ecma262/#sec-isconstructor
+module.exports = !construct || fails(function () {
+  var called;
+  return isConstructorModern(isConstructorModern.call)
+    || !isConstructorModern(Object)
+    || !isConstructorModern(function () { called = true; })
+    || called;
+}) ? isConstructorLegacy : isConstructorModern;
diff --git a/ddb_main/node_modules/core-js/internals/is-forced.js b/ddb_main/node_modules/core-js/internals/is-forced.js
new file mode 100644
index 0000000..acd8cc4
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/is-forced.js
@@ -0,0 +1,23 @@
+'use strict';
+var fails = require('../internals/fails');
+var isCallable = require('../internals/is-callable');
+
+var replacement = /#|\.prototype\./;
+
+var isForced = function (feature, detection) {
+  var value = data[normalize(feature)];
+  return value === POLYFILL ? true
+    : value === NATIVE ? false
+    : isCallable(detection) ? fails(detection)
+    : !!detection;
+};
+
+var normalize = isForced.normalize = function (string) {
+  return String(string).replace(replacement, '.').toLowerCase();
+};
+
+var data = isForced.data = {};
+var NATIVE = isForced.NATIVE = 'N';
+var POLYFILL = isForced.POLYFILL = 'P';
+
+module.exports = isForced;
diff --git a/ddb_main/node_modules/core-js/internals/is-null-or-undefined.js b/ddb_main/node_modules/core-js/internals/is-null-or-undefined.js
new file mode 100644
index 0000000..8e687dd
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/is-null-or-undefined.js
@@ -0,0 +1,6 @@
+'use strict';
+// we can't use just `it == null` since of `document.all` special case
+// https://tc39.es/ecma262/#sec-IsHTMLDDA-internal-slot-aec
+module.exports = function (it) {
+  return it === null || it === undefined;
+};
diff --git a/ddb_main/node_modules/core-js/internals/is-object.js b/ddb_main/node_modules/core-js/internals/is-object.js
new file mode 100644
index 0000000..8ed1588
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/is-object.js
@@ -0,0 +1,6 @@
+'use strict';
+var isCallable = require('../internals/is-callable');
+
+module.exports = function (it) {
+  return typeof it == 'object' ? it !== null : isCallable(it);
+};
diff --git a/ddb_main/node_modules/core-js/internals/is-possible-prototype.js b/ddb_main/node_modules/core-js/internals/is-possible-prototype.js
new file mode 100644
index 0000000..80e976d
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/is-possible-prototype.js
@@ -0,0 +1,6 @@
+'use strict';
+var isObject = require('../internals/is-object');
+
+module.exports = function (argument) {
+  return isObject(argument) || argument === null;
+};
diff --git a/ddb_main/node_modules/core-js/internals/is-pure.js b/ddb_main/node_modules/core-js/internals/is-pure.js
new file mode 100644
index 0000000..ae7c87b
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/is-pure.js
@@ -0,0 +1,2 @@
+'use strict';
+module.exports = false;
diff --git a/ddb_main/node_modules/core-js/internals/is-symbol.js b/ddb_main/node_modules/core-js/internals/is-symbol.js
new file mode 100644
index 0000000..8c62ff9
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/is-symbol.js
@@ -0,0 +1,14 @@
+'use strict';
+var getBuiltIn = require('../internals/get-built-in');
+var isCallable = require('../internals/is-callable');
+var isPrototypeOf = require('../internals/object-is-prototype-of');
+var USE_SYMBOL_AS_UID = require('../internals/use-symbol-as-uid');
+
+var $Object = Object;
+
+module.exports = USE_SYMBOL_AS_UID ? function (it) {
+  return typeof it == 'symbol';
+} : function (it) {
+  var $Symbol = getBuiltIn('Symbol');
+  return isCallable($Symbol) && isPrototypeOf($Symbol.prototype, $Object(it));
+};
diff --git a/ddb_main/node_modules/core-js/internals/iterator-close.js b/ddb_main/node_modules/core-js/internals/iterator-close.js
new file mode 100644
index 0000000..df2d1e0
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/iterator-close.js
@@ -0,0 +1,24 @@
+'use strict';
+var call = require('../internals/function-call');
+var anObject = require('../internals/an-object');
+var getMethod = require('../internals/get-method');
+
+module.exports = function (iterator, kind, value) {
+  var innerResult, innerError;
+  anObject(iterator);
+  try {
+    innerResult = getMethod(iterator, 'return');
+    if (!innerResult) {
+      if (kind === 'throw') throw value;
+      return value;
+    }
+    innerResult = call(innerResult, iterator);
+  } catch (error) {
+    innerError = true;
+    innerResult = error;
+  }
+  if (kind === 'throw') throw value;
+  if (innerError) throw innerResult;
+  anObject(innerResult);
+  return value;
+};
diff --git a/ddb_main/node_modules/core-js/internals/iterator-create-constructor.js b/ddb_main/node_modules/core-js/internals/iterator-create-constructor.js
new file mode 100644
index 0000000..e519c9f
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/iterator-create-constructor.js
@@ -0,0 +1,16 @@
+'use strict';
+var IteratorPrototype = require('../internals/iterators-core').IteratorPrototype;
+var create = require('../internals/object-create');
+var createPropertyDescriptor = require('../internals/create-property-descriptor');
+var setToStringTag = require('../internals/set-to-string-tag');
+var Iterators = require('../internals/iterators');
+
+var returnThis = function () { return this; };
+
+module.exports = function (IteratorConstructor, NAME, next, ENUMERABLE_NEXT) {
+  var TO_STRING_TAG = NAME + ' Iterator';
+  IteratorConstructor.prototype = create(IteratorPrototype, { next: createPropertyDescriptor(+!ENUMERABLE_NEXT, next) });
+  setToStringTag(IteratorConstructor, TO_STRING_TAG, false, true);
+  Iterators[TO_STRING_TAG] = returnThis;
+  return IteratorConstructor;
+};
diff --git a/ddb_main/node_modules/core-js/internals/iterator-define.js b/ddb_main/node_modules/core-js/internals/iterator-define.js
new file mode 100644
index 0000000..c1eebd4
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/iterator-define.js
@@ -0,0 +1,102 @@
+'use strict';
+var $ = require('../internals/export');
+var call = require('../internals/function-call');
+var IS_PURE = require('../internals/is-pure');
+var FunctionName = require('../internals/function-name');
+var isCallable = require('../internals/is-callable');
+var createIteratorConstructor = require('../internals/iterator-create-constructor');
+var getPrototypeOf = require('../internals/object-get-prototype-of');
+var setPrototypeOf = require('../internals/object-set-prototype-of');
+var setToStringTag = require('../internals/set-to-string-tag');
+var createNonEnumerableProperty = require('../internals/create-non-enumerable-property');
+var defineBuiltIn = require('../internals/define-built-in');
+var wellKnownSymbol = require('../internals/well-known-symbol');
+var Iterators = require('../internals/iterators');
+var IteratorsCore = require('../internals/iterators-core');
+
+var PROPER_FUNCTION_NAME = FunctionName.PROPER;
+var CONFIGURABLE_FUNCTION_NAME = FunctionName.CONFIGURABLE;
+var IteratorPrototype = IteratorsCore.IteratorPrototype;
+var BUGGY_SAFARI_ITERATORS = IteratorsCore.BUGGY_SAFARI_ITERATORS;
+var ITERATOR = wellKnownSymbol('iterator');
+var KEYS = 'keys';
+var VALUES = 'values';
+var ENTRIES = 'entries';
+
+var returnThis = function () { return this; };
+
+module.exports = function (Iterable, NAME, IteratorConstructor, next, DEFAULT, IS_SET, FORCED) {
+  createIteratorConstructor(IteratorConstructor, NAME, next);
+
+  var getIterationMethod = function (KIND) {
+    if (KIND === DEFAULT && defaultIterator) return defaultIterator;
+    if (!BUGGY_SAFARI_ITERATORS && KIND && KIND in IterablePrototype) return IterablePrototype[KIND];
+
+    switch (KIND) {
+      case KEYS: return function keys() { return new IteratorConstructor(this, KIND); };
+      case VALUES: return function values() { return new IteratorConstructor(this, KIND); };
+      case ENTRIES: return function entries() { return new IteratorConstructor(this, KIND); };
+    }
+
+    return function () { return new IteratorConstructor(this); };
+  };
+
+  var TO_STRING_TAG = NAME + ' Iterator';
+  var INCORRECT_VALUES_NAME = false;
+  var IterablePrototype = Iterable.prototype;
+  var nativeIterator = IterablePrototype[ITERATOR]
+    || IterablePrototype['@@iterator']
+    || DEFAULT && IterablePrototype[DEFAULT];
+  var defaultIterator = !BUGGY_SAFARI_ITERATORS && nativeIterator || getIterationMethod(DEFAULT);
+  var anyNativeIterator = NAME === 'Array' ? IterablePrototype.entries || nativeIterator : nativeIterator;
+  var CurrentIteratorPrototype, methods, KEY;
+
+  // fix native
+  if (anyNativeIterator) {
+    CurrentIteratorPrototype = getPrototypeOf(anyNativeIterator.call(new Iterable()));
+    if (CurrentIteratorPrototype !== Object.prototype && CurrentIteratorPrototype.next) {
+      if (!IS_PURE && getPrototypeOf(CurrentIteratorPrototype) !== IteratorPrototype) {
+        if (setPrototypeOf) {
+          setPrototypeOf(CurrentIteratorPrototype, IteratorPrototype);
+        } else if (!isCallable(CurrentIteratorPrototype[ITERATOR])) {
+          defineBuiltIn(CurrentIteratorPrototype, ITERATOR, returnThis);
+        }
+      }
+      // Set @@toStringTag to native iterators
+      setToStringTag(CurrentIteratorPrototype, TO_STRING_TAG, true, true);
+      if (IS_PURE) Iterators[TO_STRING_TAG] = returnThis;
+    }
+  }
+
+  // fix Array.prototype.{ values, @@iterator }.name in V8 / FF
+  if (PROPER_FUNCTION_NAME && DEFAULT === VALUES && nativeIterator && nativeIterator.name !== VALUES) {
+    if (!IS_PURE && CONFIGURABLE_FUNCTION_NAME) {
+      createNonEnumerableProperty(IterablePrototype, 'name', VALUES);
+    } else {
+      INCORRECT_VALUES_NAME = true;
+      defaultIterator = function values() { return call(nativeIterator, this); };
+    }
+  }
+
+  // export additional methods
+  if (DEFAULT) {
+    methods = {
+      values: getIterationMethod(VALUES),
+      keys: IS_SET ? defaultIterator : getIterationMethod(KEYS),
+      entries: getIterationMethod(ENTRIES)
+    };
+    if (FORCED) for (KEY in methods) {
+      if (BUGGY_SAFARI_ITERATORS || INCORRECT_VALUES_NAME || !(KEY in IterablePrototype)) {
+        defineBuiltIn(IterablePrototype, KEY, methods[KEY]);
+      }
+    } else $({ target: NAME, proto: true, forced: BUGGY_SAFARI_ITERATORS || INCORRECT_VALUES_NAME }, methods);
+  }
+
+  // define iterator
+  if ((!IS_PURE || FORCED) && IterablePrototype[ITERATOR] !== defaultIterator) {
+    defineBuiltIn(IterablePrototype, ITERATOR, defaultIterator, { name: DEFAULT });
+  }
+  Iterators[NAME] = defaultIterator;
+
+  return methods;
+};
diff --git a/ddb_main/node_modules/core-js/internals/iterators-core.js b/ddb_main/node_modules/core-js/internals/iterators-core.js
new file mode 100644
index 0000000..9ebcaae
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/iterators-core.js
@@ -0,0 +1,49 @@
+'use strict';
+var fails = require('../internals/fails');
+var isCallable = require('../internals/is-callable');
+var isObject = require('../internals/is-object');
+var create = require('../internals/object-create');
+var getPrototypeOf = require('../internals/object-get-prototype-of');
+var defineBuiltIn = require('../internals/define-built-in');
+var wellKnownSymbol = require('../internals/well-known-symbol');
+var IS_PURE = require('../internals/is-pure');
+
+var ITERATOR = wellKnownSymbol('iterator');
+var BUGGY_SAFARI_ITERATORS = false;
+
+// `%IteratorPrototype%` object
+// https://tc39.es/ecma262/#sec-%iteratorprototype%-object
+var IteratorPrototype, PrototypeOfArrayIteratorPrototype, arrayIterator;
+
+/* eslint-disable es/no-array-prototype-keys -- safe */
+if ([].keys) {
+  arrayIterator = [].keys();
+  // Safari 8 has buggy iterators w/o `next`
+  if (!('next' in arrayIterator)) BUGGY_SAFARI_ITERATORS = true;
+  else {
+    PrototypeOfArrayIteratorPrototype = getPrototypeOf(getPrototypeOf(arrayIterator));
+    if (PrototypeOfArrayIteratorPrototype !== Object.prototype) IteratorPrototype = PrototypeOfArrayIteratorPrototype;
+  }
+}
+
+var NEW_ITERATOR_PROTOTYPE = !isObject(IteratorPrototype) || fails(function () {
+  var test = {};
+  // FF44- legacy iterators case
+  return IteratorPrototype[ITERATOR].call(test) !== test;
+});
+
+if (NEW_ITERATOR_PROTOTYPE) IteratorPrototype = {};
+else if (IS_PURE) IteratorPrototype = create(IteratorPrototype);
+
+// `%IteratorPrototype%[@@iterator]()` method
+// https://tc39.es/ecma262/#sec-%iteratorprototype%-@@iterator
+if (!isCallable(IteratorPrototype[ITERATOR])) {
+  defineBuiltIn(IteratorPrototype, ITERATOR, function () {
+    return this;
+  });
+}
+
+module.exports = {
+  IteratorPrototype: IteratorPrototype,
+  BUGGY_SAFARI_ITERATORS: BUGGY_SAFARI_ITERATORS
+};
diff --git a/ddb_main/node_modules/core-js/internals/iterators.js b/ddb_main/node_modules/core-js/internals/iterators.js
new file mode 100644
index 0000000..648a166
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/iterators.js
@@ -0,0 +1,2 @@
+'use strict';
+module.exports = {};
diff --git a/ddb_main/node_modules/core-js/internals/length-of-array-like.js b/ddb_main/node_modules/core-js/internals/length-of-array-like.js
new file mode 100644
index 0000000..8cddc2f
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/length-of-array-like.js
@@ -0,0 +1,8 @@
+'use strict';
+var toLength = require('../internals/to-length');
+
+// `LengthOfArrayLike` abstract operation
+// https://tc39.es/ecma262/#sec-lengthofarraylike
+module.exports = function (obj) {
+  return toLength(obj.length);
+};
diff --git a/ddb_main/node_modules/core-js/internals/make-built-in.js b/ddb_main/node_modules/core-js/internals/make-built-in.js
new file mode 100644
index 0000000..5743098
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/make-built-in.js
@@ -0,0 +1,55 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+var fails = require('../internals/fails');
+var isCallable = require('../internals/is-callable');
+var hasOwn = require('../internals/has-own-property');
+var DESCRIPTORS = require('../internals/descriptors');
+var CONFIGURABLE_FUNCTION_NAME = require('../internals/function-name').CONFIGURABLE;
+var inspectSource = require('../internals/inspect-source');
+var InternalStateModule = require('../internals/internal-state');
+
+var enforceInternalState = InternalStateModule.enforce;
+var getInternalState = InternalStateModule.get;
+var $String = String;
+// eslint-disable-next-line es/no-object-defineproperty -- safe
+var defineProperty = Object.defineProperty;
+var stringSlice = uncurryThis(''.slice);
+var replace = uncurryThis(''.replace);
+var join = uncurryThis([].join);
+
+var CONFIGURABLE_LENGTH = DESCRIPTORS && !fails(function () {
+  return defineProperty(function () { /* empty */ }, 'length', { value: 8 }).length !== 8;
+});
+
+var TEMPLATE = String(String).split('String');
+
+var makeBuiltIn = module.exports = function (value, name, options) {
+  if (stringSlice($String(name), 0, 7) === 'Symbol(') {
+    name = '[' + replace($String(name), /^Symbol\(([^)]*)\).*$/, '$1') + ']';
+  }
+  if (options && options.getter) name = 'get ' + name;
+  if (options && options.setter) name = 'set ' + name;
+  if (!hasOwn(value, 'name') || (CONFIGURABLE_FUNCTION_NAME && value.name !== name)) {
+    if (DESCRIPTORS) defineProperty(value, 'name', { value: name, configurable: true });
+    else value.name = name;
+  }
+  if (CONFIGURABLE_LENGTH && options && hasOwn(options, 'arity') && value.length !== options.arity) {
+    defineProperty(value, 'length', { value: options.arity });
+  }
+  try {
+    if (options && hasOwn(options, 'constructor') && options.constructor) {
+      if (DESCRIPTORS) defineProperty(value, 'prototype', { writable: false });
+    // in V8 ~ Chrome 53, prototypes of some methods, like `Array.prototype.values`, are non-writable
+    } else if (value.prototype) value.prototype = undefined;
+  } catch (error) { /* empty */ }
+  var state = enforceInternalState(value);
+  if (!hasOwn(state, 'source')) {
+    state.source = join(TEMPLATE, typeof name == 'string' ? name : '');
+  } return value;
+};
+
+// add fake Function#toString for correct work wrapped methods / constructors with methods like LoDash isNative
+// eslint-disable-next-line no-extend-native -- required
+Function.prototype.toString = makeBuiltIn(function toString() {
+  return isCallable(this) && getInternalState(this).source || inspectSource(this);
+}, 'toString');
diff --git a/ddb_main/node_modules/core-js/internals/math-trunc.js b/ddb_main/node_modules/core-js/internals/math-trunc.js
new file mode 100644
index 0000000..6d41e54
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/math-trunc.js
@@ -0,0 +1,11 @@
+'use strict';
+var ceil = Math.ceil;
+var floor = Math.floor;
+
+// `Math.trunc` method
+// https://tc39.es/ecma262/#sec-math.trunc
+// eslint-disable-next-line es/no-math-trunc -- safe
+module.exports = Math.trunc || function trunc(x) {
+  var n = +x;
+  return (n > 0 ? floor : ceil)(n);
+};
diff --git a/ddb_main/node_modules/core-js/internals/object-assign.js b/ddb_main/node_modules/core-js/internals/object-assign.js
new file mode 100644
index 0000000..1a8947b
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-assign.js
@@ -0,0 +1,57 @@
+'use strict';
+var DESCRIPTORS = require('../internals/descriptors');
+var uncurryThis = require('../internals/function-uncurry-this');
+var call = require('../internals/function-call');
+var fails = require('../internals/fails');
+var objectKeys = require('../internals/object-keys');
+var getOwnPropertySymbolsModule = require('../internals/object-get-own-property-symbols');
+var propertyIsEnumerableModule = require('../internals/object-property-is-enumerable');
+var toObject = require('../internals/to-object');
+var IndexedObject = require('../internals/indexed-object');
+
+// eslint-disable-next-line es/no-object-assign -- safe
+var $assign = Object.assign;
+// eslint-disable-next-line es/no-object-defineproperty -- required for testing
+var defineProperty = Object.defineProperty;
+var concat = uncurryThis([].concat);
+
+// `Object.assign` method
+// https://tc39.es/ecma262/#sec-object.assign
+module.exports = !$assign || fails(function () {
+  // should have correct order of operations (Edge bug)
+  if (DESCRIPTORS && $assign({ b: 1 }, $assign(defineProperty({}, 'a', {
+    enumerable: true,
+    get: function () {
+      defineProperty(this, 'b', {
+        value: 3,
+        enumerable: false
+      });
+    }
+  }), { b: 2 })).b !== 1) return true;
+  // should work with symbols and should have deterministic property order (V8 bug)
+  var A = {};
+  var B = {};
+  // eslint-disable-next-line es/no-symbol -- safe
+  var symbol = Symbol('assign detection');
+  var alphabet = 'abcdefghijklmnopqrst';
+  A[symbol] = 7;
+  alphabet.split('').forEach(function (chr) { B[chr] = chr; });
+  return $assign({}, A)[symbol] !== 7 || objectKeys($assign({}, B)).join('') !== alphabet;
+}) ? function assign(target, source) { // eslint-disable-line no-unused-vars -- required for `.length`
+  var T = toObject(target);
+  var argumentsLength = arguments.length;
+  var index = 1;
+  var getOwnPropertySymbols = getOwnPropertySymbolsModule.f;
+  var propertyIsEnumerable = propertyIsEnumerableModule.f;
+  while (argumentsLength > index) {
+    var S = IndexedObject(arguments[index++]);
+    var keys = getOwnPropertySymbols ? concat(objectKeys(S), getOwnPropertySymbols(S)) : objectKeys(S);
+    var length = keys.length;
+    var j = 0;
+    var key;
+    while (length > j) {
+      key = keys[j++];
+      if (!DESCRIPTORS || call(propertyIsEnumerable, S, key)) T[key] = S[key];
+    }
+  } return T;
+} : $assign;
diff --git a/ddb_main/node_modules/core-js/internals/object-create.js b/ddb_main/node_modules/core-js/internals/object-create.js
new file mode 100644
index 0000000..aee97bb
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-create.js
@@ -0,0 +1,84 @@
+'use strict';
+/* global ActiveXObject -- old IE, WSH */
+var anObject = require('../internals/an-object');
+var definePropertiesModule = require('../internals/object-define-properties');
+var enumBugKeys = require('../internals/enum-bug-keys');
+var hiddenKeys = require('../internals/hidden-keys');
+var html = require('../internals/html');
+var documentCreateElement = require('../internals/document-create-element');
+var sharedKey = require('../internals/shared-key');
+
+var GT = '>';
+var LT = '<';
+var PROTOTYPE = 'prototype';
+var SCRIPT = 'script';
+var IE_PROTO = sharedKey('IE_PROTO');
+
+var EmptyConstructor = function () { /* empty */ };
+
+var scriptTag = function (content) {
+  return LT + SCRIPT + GT + content + LT + '/' + SCRIPT + GT;
+};
+
+// Create object with fake `null` prototype: use ActiveX Object with cleared prototype
+var NullProtoObjectViaActiveX = function (activeXDocument) {
+  activeXDocument.write(scriptTag(''));
+  activeXDocument.close();
+  var temp = activeXDocument.parentWindow.Object;
+  activeXDocument = null; // avoid memory leak
+  return temp;
+};
+
+// Create object with fake `null` prototype: use iframe Object with cleared prototype
+var NullProtoObjectViaIFrame = function () {
+  // Thrash, waste and sodomy: IE GC bug
+  var iframe = documentCreateElement('iframe');
+  var JS = 'java' + SCRIPT + ':';
+  var iframeDocument;
+  iframe.style.display = 'none';
+  html.appendChild(iframe);
+  // https://github.com/zloirock/core-js/issues/475
+  iframe.src = String(JS);
+  iframeDocument = iframe.contentWindow.document;
+  iframeDocument.open();
+  iframeDocument.write(scriptTag('document.F=Object'));
+  iframeDocument.close();
+  return iframeDocument.F;
+};
+
+// Check for document.domain and active x support
+// No need to use active x approach when document.domain is not set
+// see https://github.com/es-shims/es5-shim/issues/150
+// variation of https://github.com/kitcambridge/es5-shim/commit/4f738ac066346
+// avoid IE GC bug
+var activeXDocument;
+var NullProtoObject = function () {
+  try {
+    activeXDocument = new ActiveXObject('htmlfile');
+  } catch (error) { /* ignore */ }
+  NullProtoObject = typeof document != 'undefined'
+    ? document.domain && activeXDocument
+      ? NullProtoObjectViaActiveX(activeXDocument) // old IE
+      : NullProtoObjectViaIFrame()
+    : NullProtoObjectViaActiveX(activeXDocument); // WSH
+  var length = enumBugKeys.length;
+  while (length--) delete NullProtoObject[PROTOTYPE][enumBugKeys[length]];
+  return NullProtoObject();
+};
+
+hiddenKeys[IE_PROTO] = true;
+
+// `Object.create` method
+// https://tc39.es/ecma262/#sec-object.create
+// eslint-disable-next-line es/no-object-create -- safe
+module.exports = Object.create || function create(O, Properties) {
+  var result;
+  if (O !== null) {
+    EmptyConstructor[PROTOTYPE] = anObject(O);
+    result = new EmptyConstructor();
+    EmptyConstructor[PROTOTYPE] = null;
+    // add "__proto__" for Object.getPrototypeOf polyfill
+    result[IE_PROTO] = O;
+  } else result = NullProtoObject();
+  return Properties === undefined ? result : definePropertiesModule.f(result, Properties);
+};
diff --git a/ddb_main/node_modules/core-js/internals/object-define-properties.js b/ddb_main/node_modules/core-js/internals/object-define-properties.js
new file mode 100644
index 0000000..1a1d1bd
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-define-properties.js
@@ -0,0 +1,21 @@
+'use strict';
+var DESCRIPTORS = require('../internals/descriptors');
+var V8_PROTOTYPE_DEFINE_BUG = require('../internals/v8-prototype-define-bug');
+var definePropertyModule = require('../internals/object-define-property');
+var anObject = require('../internals/an-object');
+var toIndexedObject = require('../internals/to-indexed-object');
+var objectKeys = require('../internals/object-keys');
+
+// `Object.defineProperties` method
+// https://tc39.es/ecma262/#sec-object.defineproperties
+// eslint-disable-next-line es/no-object-defineproperties -- safe
+exports.f = DESCRIPTORS && !V8_PROTOTYPE_DEFINE_BUG ? Object.defineProperties : function defineProperties(O, Properties) {
+  anObject(O);
+  var props = toIndexedObject(Properties);
+  var keys = objectKeys(Properties);
+  var length = keys.length;
+  var index = 0;
+  var key;
+  while (length > index) definePropertyModule.f(O, key = keys[index++], props[key]);
+  return O;
+};
diff --git a/ddb_main/node_modules/core-js/internals/object-define-property.js b/ddb_main/node_modules/core-js/internals/object-define-property.js
new file mode 100644
index 0000000..704d616
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-define-property.js
@@ -0,0 +1,44 @@
+'use strict';
+var DESCRIPTORS = require('../internals/descriptors');
+var IE8_DOM_DEFINE = require('../internals/ie8-dom-define');
+var V8_PROTOTYPE_DEFINE_BUG = require('../internals/v8-prototype-define-bug');
+var anObject = require('../internals/an-object');
+var toPropertyKey = require('../internals/to-property-key');
+
+var $TypeError = TypeError;
+// eslint-disable-next-line es/no-object-defineproperty -- safe
+var $defineProperty = Object.defineProperty;
+// eslint-disable-next-line es/no-object-getownpropertydescriptor -- safe
+var $getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
+var ENUMERABLE = 'enumerable';
+var CONFIGURABLE = 'configurable';
+var WRITABLE = 'writable';
+
+// `Object.defineProperty` method
+// https://tc39.es/ecma262/#sec-object.defineproperty
+exports.f = DESCRIPTORS ? V8_PROTOTYPE_DEFINE_BUG ? function defineProperty(O, P, Attributes) {
+  anObject(O);
+  P = toPropertyKey(P);
+  anObject(Attributes);
+  if (typeof O === 'function' && P === 'prototype' && 'value' in Attributes && WRITABLE in Attributes && !Attributes[WRITABLE]) {
+    var current = $getOwnPropertyDescriptor(O, P);
+    if (current && current[WRITABLE]) {
+      O[P] = Attributes.value;
+      Attributes = {
+        configurable: CONFIGURABLE in Attributes ? Attributes[CONFIGURABLE] : current[CONFIGURABLE],
+        enumerable: ENUMERABLE in Attributes ? Attributes[ENUMERABLE] : current[ENUMERABLE],
+        writable: false
+      };
+    }
+  } return $defineProperty(O, P, Attributes);
+} : $defineProperty : function defineProperty(O, P, Attributes) {
+  anObject(O);
+  P = toPropertyKey(P);
+  anObject(Attributes);
+  if (IE8_DOM_DEFINE) try {
+    return $defineProperty(O, P, Attributes);
+  } catch (error) { /* empty */ }
+  if ('get' in Attributes || 'set' in Attributes) throw new $TypeError('Accessors not supported');
+  if ('value' in Attributes) O[P] = Attributes.value;
+  return O;
+};
diff --git a/ddb_main/node_modules/core-js/internals/object-get-own-property-descriptor.js b/ddb_main/node_modules/core-js/internals/object-get-own-property-descriptor.js
new file mode 100644
index 0000000..1fd4181
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-get-own-property-descriptor.js
@@ -0,0 +1,23 @@
+'use strict';
+var DESCRIPTORS = require('../internals/descriptors');
+var call = require('../internals/function-call');
+var propertyIsEnumerableModule = require('../internals/object-property-is-enumerable');
+var createPropertyDescriptor = require('../internals/create-property-descriptor');
+var toIndexedObject = require('../internals/to-indexed-object');
+var toPropertyKey = require('../internals/to-property-key');
+var hasOwn = require('../internals/has-own-property');
+var IE8_DOM_DEFINE = require('../internals/ie8-dom-define');
+
+// eslint-disable-next-line es/no-object-getownpropertydescriptor -- safe
+var $getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
+
+// `Object.getOwnPropertyDescriptor` method
+// https://tc39.es/ecma262/#sec-object.getownpropertydescriptor
+exports.f = DESCRIPTORS ? $getOwnPropertyDescriptor : function getOwnPropertyDescriptor(O, P) {
+  O = toIndexedObject(O);
+  P = toPropertyKey(P);
+  if (IE8_DOM_DEFINE) try {
+    return $getOwnPropertyDescriptor(O, P);
+  } catch (error) { /* empty */ }
+  if (hasOwn(O, P)) return createPropertyDescriptor(!call(propertyIsEnumerableModule.f, O, P), O[P]);
+};
diff --git a/ddb_main/node_modules/core-js/internals/object-get-own-property-names.js b/ddb_main/node_modules/core-js/internals/object-get-own-property-names.js
new file mode 100644
index 0000000..08c935d
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-get-own-property-names.js
@@ -0,0 +1,12 @@
+'use strict';
+var internalObjectKeys = require('../internals/object-keys-internal');
+var enumBugKeys = require('../internals/enum-bug-keys');
+
+var hiddenKeys = enumBugKeys.concat('length', 'prototype');
+
+// `Object.getOwnPropertyNames` method
+// https://tc39.es/ecma262/#sec-object.getownpropertynames
+// eslint-disable-next-line es/no-object-getownpropertynames -- safe
+exports.f = Object.getOwnPropertyNames || function getOwnPropertyNames(O) {
+  return internalObjectKeys(O, hiddenKeys);
+};
diff --git a/ddb_main/node_modules/core-js/internals/object-get-own-property-symbols.js b/ddb_main/node_modules/core-js/internals/object-get-own-property-symbols.js
new file mode 100644
index 0000000..9ee3730
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-get-own-property-symbols.js
@@ -0,0 +1,3 @@
+'use strict';
+// eslint-disable-next-line es/no-object-getownpropertysymbols -- safe
+exports.f = Object.getOwnPropertySymbols;
diff --git a/ddb_main/node_modules/core-js/internals/object-get-prototype-of.js b/ddb_main/node_modules/core-js/internals/object-get-prototype-of.js
new file mode 100644
index 0000000..75201d3
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-get-prototype-of.js
@@ -0,0 +1,22 @@
+'use strict';
+var hasOwn = require('../internals/has-own-property');
+var isCallable = require('../internals/is-callable');
+var toObject = require('../internals/to-object');
+var sharedKey = require('../internals/shared-key');
+var CORRECT_PROTOTYPE_GETTER = require('../internals/correct-prototype-getter');
+
+var IE_PROTO = sharedKey('IE_PROTO');
+var $Object = Object;
+var ObjectPrototype = $Object.prototype;
+
+// `Object.getPrototypeOf` method
+// https://tc39.es/ecma262/#sec-object.getprototypeof
+// eslint-disable-next-line es/no-object-getprototypeof -- safe
+module.exports = CORRECT_PROTOTYPE_GETTER ? $Object.getPrototypeOf : function (O) {
+  var object = toObject(O);
+  if (hasOwn(object, IE_PROTO)) return object[IE_PROTO];
+  var constructor = object.constructor;
+  if (isCallable(constructor) && object instanceof constructor) {
+    return constructor.prototype;
+  } return object instanceof $Object ? ObjectPrototype : null;
+};
diff --git a/ddb_main/node_modules/core-js/internals/object-is-prototype-of.js b/ddb_main/node_modules/core-js/internals/object-is-prototype-of.js
new file mode 100644
index 0000000..77cca1e
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-is-prototype-of.js
@@ -0,0 +1,4 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+
+module.exports = uncurryThis({}.isPrototypeOf);
diff --git a/ddb_main/node_modules/core-js/internals/object-keys-internal.js b/ddb_main/node_modules/core-js/internals/object-keys-internal.js
new file mode 100644
index 0000000..42354cf
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-keys-internal.js
@@ -0,0 +1,21 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+var hasOwn = require('../internals/has-own-property');
+var toIndexedObject = require('../internals/to-indexed-object');
+var indexOf = require('../internals/array-includes').indexOf;
+var hiddenKeys = require('../internals/hidden-keys');
+
+var push = uncurryThis([].push);
+
+module.exports = function (object, names) {
+  var O = toIndexedObject(object);
+  var i = 0;
+  var result = [];
+  var key;
+  for (key in O) !hasOwn(hiddenKeys, key) && hasOwn(O, key) && push(result, key);
+  // Don't enum bug & hidden keys
+  while (names.length > i) if (hasOwn(O, key = names[i++])) {
+    ~indexOf(result, key) || push(result, key);
+  }
+  return result;
+};
diff --git a/ddb_main/node_modules/core-js/internals/object-keys.js b/ddb_main/node_modules/core-js/internals/object-keys.js
new file mode 100644
index 0000000..0376135
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-keys.js
@@ -0,0 +1,10 @@
+'use strict';
+var internalObjectKeys = require('../internals/object-keys-internal');
+var enumBugKeys = require('../internals/enum-bug-keys');
+
+// `Object.keys` method
+// https://tc39.es/ecma262/#sec-object.keys
+// eslint-disable-next-line es/no-object-keys -- safe
+module.exports = Object.keys || function keys(O) {
+  return internalObjectKeys(O, enumBugKeys);
+};
diff --git a/ddb_main/node_modules/core-js/internals/object-property-is-enumerable.js b/ddb_main/node_modules/core-js/internals/object-property-is-enumerable.js
new file mode 100644
index 0000000..f262d10
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-property-is-enumerable.js
@@ -0,0 +1,14 @@
+'use strict';
+var $propertyIsEnumerable = {}.propertyIsEnumerable;
+// eslint-disable-next-line es/no-object-getownpropertydescriptor -- safe
+var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
+
+// Nashorn ~ JDK8 bug
+var NASHORN_BUG = getOwnPropertyDescriptor && !$propertyIsEnumerable.call({ 1: 2 }, 1);
+
+// `Object.prototype.propertyIsEnumerable` method implementation
+// https://tc39.es/ecma262/#sec-object.prototype.propertyisenumerable
+exports.f = NASHORN_BUG ? function propertyIsEnumerable(V) {
+  var descriptor = getOwnPropertyDescriptor(this, V);
+  return !!descriptor && descriptor.enumerable;
+} : $propertyIsEnumerable;
diff --git a/ddb_main/node_modules/core-js/internals/object-set-prototype-of.js b/ddb_main/node_modules/core-js/internals/object-set-prototype-of.js
new file mode 100644
index 0000000..94fcf6c
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/object-set-prototype-of.js
@@ -0,0 +1,29 @@
+'use strict';
+/* eslint-disable no-proto -- safe */
+var uncurryThisAccessor = require('../internals/function-uncurry-this-accessor');
+var isObject = require('../internals/is-object');
+var requireObjectCoercible = require('../internals/require-object-coercible');
+var aPossiblePrototype = require('../internals/a-possible-prototype');
+
+// `Object.setPrototypeOf` method
+// https://tc39.es/ecma262/#sec-object.setprototypeof
+// Works with __proto__ only. Old v8 can't work with null proto objects.
+// eslint-disable-next-line es/no-object-setprototypeof -- safe
+module.exports = Object.setPrototypeOf || ('__proto__' in {} ? function () {
+  var CORRECT_SETTER = false;
+  var test = {};
+  var setter;
+  try {
+    setter = uncurryThisAccessor(Object.prototype, '__proto__', 'set');
+    setter(test, []);
+    CORRECT_SETTER = test instanceof Array;
+  } catch (error) { /* empty */ }
+  return function setPrototypeOf(O, proto) {
+    requireObjectCoercible(O);
+    aPossiblePrototype(proto);
+    if (!isObject(O)) return O;
+    if (CORRECT_SETTER) setter(O, proto);
+    else O.__proto__ = proto;
+    return O;
+  };
+}() : undefined);
diff --git a/ddb_main/node_modules/core-js/internals/ordinary-to-primitive.js b/ddb_main/node_modules/core-js/internals/ordinary-to-primitive.js
new file mode 100644
index 0000000..f8acc2f
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/ordinary-to-primitive.js
@@ -0,0 +1,16 @@
+'use strict';
+var call = require('../internals/function-call');
+var isCallable = require('../internals/is-callable');
+var isObject = require('../internals/is-object');
+
+var $TypeError = TypeError;
+
+// `OrdinaryToPrimitive` abstract operation
+// https://tc39.es/ecma262/#sec-ordinarytoprimitive
+module.exports = function (input, pref) {
+  var fn, val;
+  if (pref === 'string' && isCallable(fn = input.toString) && !isObject(val = call(fn, input))) return val;
+  if (isCallable(fn = input.valueOf) && !isObject(val = call(fn, input))) return val;
+  if (pref !== 'string' && isCallable(fn = input.toString) && !isObject(val = call(fn, input))) return val;
+  throw new $TypeError("Can't convert object to primitive value");
+};
diff --git a/ddb_main/node_modules/core-js/internals/own-keys.js b/ddb_main/node_modules/core-js/internals/own-keys.js
new file mode 100644
index 0000000..bf4864d
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/own-keys.js
@@ -0,0 +1,15 @@
+'use strict';
+var getBuiltIn = require('../internals/get-built-in');
+var uncurryThis = require('../internals/function-uncurry-this');
+var getOwnPropertyNamesModule = require('../internals/object-get-own-property-names');
+var getOwnPropertySymbolsModule = require('../internals/object-get-own-property-symbols');
+var anObject = require('../internals/an-object');
+
+var concat = uncurryThis([].concat);
+
+// all object keys, includes non-enumerable and symbols
+module.exports = getBuiltIn('Reflect', 'ownKeys') || function ownKeys(it) {
+  var keys = getOwnPropertyNamesModule.f(anObject(it));
+  var getOwnPropertySymbols = getOwnPropertySymbolsModule.f;
+  return getOwnPropertySymbols ? concat(keys, getOwnPropertySymbols(it)) : keys;
+};
diff --git a/ddb_main/node_modules/core-js/internals/require-object-coercible.js b/ddb_main/node_modules/core-js/internals/require-object-coercible.js
new file mode 100644
index 0000000..2a17058
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/require-object-coercible.js
@@ -0,0 +1,11 @@
+'use strict';
+var isNullOrUndefined = require('../internals/is-null-or-undefined');
+
+var $TypeError = TypeError;
+
+// `RequireObjectCoercible` abstract operation
+// https://tc39.es/ecma262/#sec-requireobjectcoercible
+module.exports = function (it) {
+  if (isNullOrUndefined(it)) throw new $TypeError("Can't call method on " + it);
+  return it;
+};
diff --git a/ddb_main/node_modules/core-js/internals/safe-get-built-in.js b/ddb_main/node_modules/core-js/internals/safe-get-built-in.js
new file mode 100644
index 0000000..04e49ef
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/safe-get-built-in.js
@@ -0,0 +1,13 @@
+'use strict';
+var global = require('../internals/global');
+var DESCRIPTORS = require('../internals/descriptors');
+
+// eslint-disable-next-line es/no-object-getownpropertydescriptor -- safe
+var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
+
+// Avoid NodeJS experimental warning
+module.exports = function (name) {
+  if (!DESCRIPTORS) return global[name];
+  var descriptor = getOwnPropertyDescriptor(global, name);
+  return descriptor && descriptor.value;
+};
diff --git a/ddb_main/node_modules/core-js/internals/set-to-string-tag.js b/ddb_main/node_modules/core-js/internals/set-to-string-tag.js
new file mode 100644
index 0000000..1dd0052
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/set-to-string-tag.js
@@ -0,0 +1,13 @@
+'use strict';
+var defineProperty = require('../internals/object-define-property').f;
+var hasOwn = require('../internals/has-own-property');
+var wellKnownSymbol = require('../internals/well-known-symbol');
+
+var TO_STRING_TAG = wellKnownSymbol('toStringTag');
+
+module.exports = function (target, TAG, STATIC) {
+  if (target && !STATIC) target = target.prototype;
+  if (target && !hasOwn(target, TO_STRING_TAG)) {
+    defineProperty(target, TO_STRING_TAG, { configurable: true, value: TAG });
+  }
+};
diff --git a/ddb_main/node_modules/core-js/internals/shared-key.js b/ddb_main/node_modules/core-js/internals/shared-key.js
new file mode 100644
index 0000000..157f98e
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/shared-key.js
@@ -0,0 +1,9 @@
+'use strict';
+var shared = require('../internals/shared');
+var uid = require('../internals/uid');
+
+var keys = shared('keys');
+
+module.exports = function (key) {
+  return keys[key] || (keys[key] = uid(key));
+};
diff --git a/ddb_main/node_modules/core-js/internals/shared-store.js b/ddb_main/node_modules/core-js/internals/shared-store.js
new file mode 100644
index 0000000..d493823
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/shared-store.js
@@ -0,0 +1,15 @@
+'use strict';
+var IS_PURE = require('../internals/is-pure');
+var globalThis = require('../internals/global');
+var defineGlobalProperty = require('../internals/define-global-property');
+
+var SHARED = '__core-js_shared__';
+var store = module.exports = globalThis[SHARED] || defineGlobalProperty(SHARED, {});
+
+(store.versions || (store.versions = [])).push({
+  version: '3.37.1',
+  mode: IS_PURE ? 'pure' : 'global',
+  copyright: '© 2014-2024 Denis Pushkarev (zloirock.ru)',
+  license: 'https://github.com/zloirock/core-js/blob/v3.37.1/LICENSE',
+  source: 'https://github.com/zloirock/core-js'
+});
diff --git a/ddb_main/node_modules/core-js/internals/shared.js b/ddb_main/node_modules/core-js/internals/shared.js
new file mode 100644
index 0000000..29ac11c
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/shared.js
@@ -0,0 +1,6 @@
+'use strict';
+var store = require('../internals/shared-store');
+
+module.exports = function (key, value) {
+  return store[key] || (store[key] = value || {});
+};
diff --git a/ddb_main/node_modules/core-js/internals/string-multibyte.js b/ddb_main/node_modules/core-js/internals/string-multibyte.js
new file mode 100644
index 0000000..d4093a7
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/string-multibyte.js
@@ -0,0 +1,37 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+var toIntegerOrInfinity = require('../internals/to-integer-or-infinity');
+var toString = require('../internals/to-string');
+var requireObjectCoercible = require('../internals/require-object-coercible');
+
+var charAt = uncurryThis(''.charAt);
+var charCodeAt = uncurryThis(''.charCodeAt);
+var stringSlice = uncurryThis(''.slice);
+
+var createMethod = function (CONVERT_TO_STRING) {
+  return function ($this, pos) {
+    var S = toString(requireObjectCoercible($this));
+    var position = toIntegerOrInfinity(pos);
+    var size = S.length;
+    var first, second;
+    if (position < 0 || position >= size) return CONVERT_TO_STRING ? '' : undefined;
+    first = charCodeAt(S, position);
+    return first < 0xD800 || first > 0xDBFF || position + 1 === size
+      || (second = charCodeAt(S, position + 1)) < 0xDC00 || second > 0xDFFF
+        ? CONVERT_TO_STRING
+          ? charAt(S, position)
+          : first
+        : CONVERT_TO_STRING
+          ? stringSlice(S, position, position + 2)
+          : (first - 0xD800 << 10) + (second - 0xDC00) + 0x10000;
+  };
+};
+
+module.exports = {
+  // `String.prototype.codePointAt` method
+  // https://tc39.es/ecma262/#sec-string.prototype.codepointat
+  codeAt: createMethod(false),
+  // `String.prototype.at` method
+  // https://github.com/mathiasbynens/String.prototype.at
+  charAt: createMethod(true)
+};
diff --git a/ddb_main/node_modules/core-js/internals/string-punycode-to-ascii.js b/ddb_main/node_modules/core-js/internals/string-punycode-to-ascii.js
new file mode 100644
index 0000000..6e39746
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/string-punycode-to-ascii.js
@@ -0,0 +1,181 @@
+'use strict';
+// based on https://github.com/bestiejs/punycode.js/blob/master/punycode.js
+var uncurryThis = require('../internals/function-uncurry-this');
+
+var maxInt = 2147483647; // aka. 0x7FFFFFFF or 2^31-1
+var base = 36;
+var tMin = 1;
+var tMax = 26;
+var skew = 38;
+var damp = 700;
+var initialBias = 72;
+var initialN = 128; // 0x80
+var delimiter = '-'; // '\x2D'
+var regexNonASCII = /[^\0-\u007E]/; // non-ASCII chars
+var regexSeparators = /[.\u3002\uFF0E\uFF61]/g; // RFC 3490 separators
+var OVERFLOW_ERROR = 'Overflow: input needs wider integers to process';
+var baseMinusTMin = base - tMin;
+
+var $RangeError = RangeError;
+var exec = uncurryThis(regexSeparators.exec);
+var floor = Math.floor;
+var fromCharCode = String.fromCharCode;
+var charCodeAt = uncurryThis(''.charCodeAt);
+var join = uncurryThis([].join);
+var push = uncurryThis([].push);
+var replace = uncurryThis(''.replace);
+var split = uncurryThis(''.split);
+var toLowerCase = uncurryThis(''.toLowerCase);
+
+/**
+ * Creates an array containing the numeric code points of each Unicode
+ * character in the string. While JavaScript uses UCS-2 internally,
+ * this function will convert a pair of surrogate halves (each of which
+ * UCS-2 exposes as separate characters) into a single code point,
+ * matching UTF-16.
+ */
+var ucs2decode = function (string) {
+  var output = [];
+  var counter = 0;
+  var length = string.length;
+  while (counter < length) {
+    var value = charCodeAt(string, counter++);
+    if (value >= 0xD800 && value <= 0xDBFF && counter < length) {
+      // It's a high surrogate, and there is a next character.
+      var extra = charCodeAt(string, counter++);
+      if ((extra & 0xFC00) === 0xDC00) { // Low surrogate.
+        push(output, ((value & 0x3FF) << 10) + (extra & 0x3FF) + 0x10000);
+      } else {
+        // It's an unmatched surrogate; only append this code unit, in case the
+        // next code unit is the high surrogate of a surrogate pair.
+        push(output, value);
+        counter--;
+      }
+    } else {
+      push(output, value);
+    }
+  }
+  return output;
+};
+
+/**
+ * Converts a digit/integer into a basic code point.
+ */
+var digitToBasic = function (digit) {
+  //  0..25 map to ASCII a..z or A..Z
+  // 26..35 map to ASCII 0..9
+  return digit + 22 + 75 * (digit < 26);
+};
+
+/**
+ * Bias adaptation function as per section 3.4 of RFC 3492.
+ * https://tools.ietf.org/html/rfc3492#section-3.4
+ */
+var adapt = function (delta, numPoints, firstTime) {
+  var k = 0;
+  delta = firstTime ? floor(delta / damp) : delta >> 1;
+  delta += floor(delta / numPoints);
+  while (delta > baseMinusTMin * tMax >> 1) {
+    delta = floor(delta / baseMinusTMin);
+    k += base;
+  }
+  return floor(k + (baseMinusTMin + 1) * delta / (delta + skew));
+};
+
+/**
+ * Converts a string of Unicode symbols (e.g. a domain name label) to a
+ * Punycode string of ASCII-only symbols.
+ */
+var encode = function (input) {
+  var output = [];
+
+  // Convert the input in UCS-2 to an array of Unicode code points.
+  input = ucs2decode(input);
+
+  // Cache the length.
+  var inputLength = input.length;
+
+  // Initialize the state.
+  var n = initialN;
+  var delta = 0;
+  var bias = initialBias;
+  var i, currentValue;
+
+  // Handle the basic code points.
+  for (i = 0; i < input.length; i++) {
+    currentValue = input[i];
+    if (currentValue < 0x80) {
+      push(output, fromCharCode(currentValue));
+    }
+  }
+
+  var basicLength = output.length; // number of basic code points.
+  var handledCPCount = basicLength; // number of code points that have been handled;
+
+  // Finish the basic string with a delimiter unless it's empty.
+  if (basicLength) {
+    push(output, delimiter);
+  }
+
+  // Main encoding loop:
+  while (handledCPCount < inputLength) {
+    // All non-basic code points < n have been handled already. Find the next larger one:
+    var m = maxInt;
+    for (i = 0; i < input.length; i++) {
+      currentValue = input[i];
+      if (currentValue >= n && currentValue < m) {
+        m = currentValue;
+      }
+    }
+
+    // Increase `delta` enough to advance the decoder's <n,i> state to <m,0>, but guard against overflow.
+    var handledCPCountPlusOne = handledCPCount + 1;
+    if (m - n > floor((maxInt - delta) / handledCPCountPlusOne)) {
+      throw new $RangeError(OVERFLOW_ERROR);
+    }
+
+    delta += (m - n) * handledCPCountPlusOne;
+    n = m;
+
+    for (i = 0; i < input.length; i++) {
+      currentValue = input[i];
+      if (currentValue < n && ++delta > maxInt) {
+        throw new $RangeError(OVERFLOW_ERROR);
+      }
+      if (currentValue === n) {
+        // Represent delta as a generalized variable-length integer.
+        var q = delta;
+        var k = base;
+        while (true) {
+          var t = k <= bias ? tMin : k >= bias + tMax ? tMax : k - bias;
+          if (q < t) break;
+          var qMinusT = q - t;
+          var baseMinusT = base - t;
+          push(output, fromCharCode(digitToBasic(t + qMinusT % baseMinusT)));
+          q = floor(qMinusT / baseMinusT);
+          k += base;
+        }
+
+        push(output, fromCharCode(digitToBasic(q)));
+        bias = adapt(delta, handledCPCountPlusOne, handledCPCount === basicLength);
+        delta = 0;
+        handledCPCount++;
+      }
+    }
+
+    delta++;
+    n++;
+  }
+  return join(output, '');
+};
+
+module.exports = function (input) {
+  var encoded = [];
+  var labels = split(replace(toLowerCase(input), regexSeparators, '\u002E'), '.');
+  var i, label;
+  for (i = 0; i < labels.length; i++) {
+    label = labels[i];
+    push(encoded, exec(regexNonASCII, label) ? 'xn--' + encode(label) : label);
+  }
+  return join(encoded, '.');
+};
diff --git a/ddb_main/node_modules/core-js/internals/symbol-constructor-detection.js b/ddb_main/node_modules/core-js/internals/symbol-constructor-detection.js
new file mode 100644
index 0000000..d77be07
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/symbol-constructor-detection.js
@@ -0,0 +1,19 @@
+'use strict';
+/* eslint-disable es/no-symbol -- required for testing */
+var V8_VERSION = require('../internals/engine-v8-version');
+var fails = require('../internals/fails');
+var global = require('../internals/global');
+
+var $String = global.String;
+
+// eslint-disable-next-line es/no-object-getownpropertysymbols -- required for testing
+module.exports = !!Object.getOwnPropertySymbols && !fails(function () {
+  var symbol = Symbol('symbol detection');
+  // Chrome 38 Symbol has incorrect toString conversion
+  // `get-own-property-symbols` polyfill symbols converted to object are not Symbol instances
+  // nb: Do not call `String` directly to avoid this being optimized out to `symbol+''` which will,
+  // of course, fail.
+  return !$String(symbol) || !(Object(symbol) instanceof Symbol) ||
+    // Chrome 38-40 symbols are not inherited from DOM collections prototypes to instances
+    !Symbol.sham && V8_VERSION && V8_VERSION < 41;
+});
diff --git a/ddb_main/node_modules/core-js/internals/to-absolute-index.js b/ddb_main/node_modules/core-js/internals/to-absolute-index.js
new file mode 100644
index 0000000..11899b3
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/to-absolute-index.js
@@ -0,0 +1,13 @@
+'use strict';
+var toIntegerOrInfinity = require('../internals/to-integer-or-infinity');
+
+var max = Math.max;
+var min = Math.min;
+
+// Helper for a popular repeating case of the spec:
+// Let integer be ? ToInteger(index).
+// If integer < 0, let result be max((length + integer), 0); else let result be min(integer, length).
+module.exports = function (index, length) {
+  var integer = toIntegerOrInfinity(index);
+  return integer < 0 ? max(integer + length, 0) : min(integer, length);
+};
diff --git a/ddb_main/node_modules/core-js/internals/to-indexed-object.js b/ddb_main/node_modules/core-js/internals/to-indexed-object.js
new file mode 100644
index 0000000..74d66d2
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/to-indexed-object.js
@@ -0,0 +1,8 @@
+'use strict';
+// toObject with fallback for non-array-like ES3 strings
+var IndexedObject = require('../internals/indexed-object');
+var requireObjectCoercible = require('../internals/require-object-coercible');
+
+module.exports = function (it) {
+  return IndexedObject(requireObjectCoercible(it));
+};
diff --git a/ddb_main/node_modules/core-js/internals/to-integer-or-infinity.js b/ddb_main/node_modules/core-js/internals/to-integer-or-infinity.js
new file mode 100644
index 0000000..8b27797
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/to-integer-or-infinity.js
@@ -0,0 +1,10 @@
+'use strict';
+var trunc = require('../internals/math-trunc');
+
+// `ToIntegerOrInfinity` abstract operation
+// https://tc39.es/ecma262/#sec-tointegerorinfinity
+module.exports = function (argument) {
+  var number = +argument;
+  // eslint-disable-next-line no-self-compare -- NaN check
+  return number !== number || number === 0 ? 0 : trunc(number);
+};
diff --git a/ddb_main/node_modules/core-js/internals/to-length.js b/ddb_main/node_modules/core-js/internals/to-length.js
new file mode 100644
index 0000000..3166ef5
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/to-length.js
@@ -0,0 +1,11 @@
+'use strict';
+var toIntegerOrInfinity = require('../internals/to-integer-or-infinity');
+
+var min = Math.min;
+
+// `ToLength` abstract operation
+// https://tc39.es/ecma262/#sec-tolength
+module.exports = function (argument) {
+  var len = toIntegerOrInfinity(argument);
+  return len > 0 ? min(len, 0x1FFFFFFFFFFFFF) : 0; // 2 ** 53 - 1 == 9007199254740991
+};
diff --git a/ddb_main/node_modules/core-js/internals/to-object.js b/ddb_main/node_modules/core-js/internals/to-object.js
new file mode 100644
index 0000000..e5c736a
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/to-object.js
@@ -0,0 +1,10 @@
+'use strict';
+var requireObjectCoercible = require('../internals/require-object-coercible');
+
+var $Object = Object;
+
+// `ToObject` abstract operation
+// https://tc39.es/ecma262/#sec-toobject
+module.exports = function (argument) {
+  return $Object(requireObjectCoercible(argument));
+};
diff --git a/ddb_main/node_modules/core-js/internals/to-primitive.js b/ddb_main/node_modules/core-js/internals/to-primitive.js
new file mode 100644
index 0000000..a751843
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/to-primitive.js
@@ -0,0 +1,26 @@
+'use strict';
+var call = require('../internals/function-call');
+var isObject = require('../internals/is-object');
+var isSymbol = require('../internals/is-symbol');
+var getMethod = require('../internals/get-method');
+var ordinaryToPrimitive = require('../internals/ordinary-to-primitive');
+var wellKnownSymbol = require('../internals/well-known-symbol');
+
+var $TypeError = TypeError;
+var TO_PRIMITIVE = wellKnownSymbol('toPrimitive');
+
+// `ToPrimitive` abstract operation
+// https://tc39.es/ecma262/#sec-toprimitive
+module.exports = function (input, pref) {
+  if (!isObject(input) || isSymbol(input)) return input;
+  var exoticToPrim = getMethod(input, TO_PRIMITIVE);
+  var result;
+  if (exoticToPrim) {
+    if (pref === undefined) pref = 'default';
+    result = call(exoticToPrim, input, pref);
+    if (!isObject(result) || isSymbol(result)) return result;
+    throw new $TypeError("Can't convert object to primitive value");
+  }
+  if (pref === undefined) pref = 'number';
+  return ordinaryToPrimitive(input, pref);
+};
diff --git a/ddb_main/node_modules/core-js/internals/to-property-key.js b/ddb_main/node_modules/core-js/internals/to-property-key.js
new file mode 100644
index 0000000..f11cf99
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/to-property-key.js
@@ -0,0 +1,10 @@
+'use strict';
+var toPrimitive = require('../internals/to-primitive');
+var isSymbol = require('../internals/is-symbol');
+
+// `ToPropertyKey` abstract operation
+// https://tc39.es/ecma262/#sec-topropertykey
+module.exports = function (argument) {
+  var key = toPrimitive(argument, 'string');
+  return isSymbol(key) ? key : key + '';
+};
diff --git a/ddb_main/node_modules/core-js/internals/to-string-tag-support.js b/ddb_main/node_modules/core-js/internals/to-string-tag-support.js
new file mode 100644
index 0000000..916a788
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/to-string-tag-support.js
@@ -0,0 +1,9 @@
+'use strict';
+var wellKnownSymbol = require('../internals/well-known-symbol');
+
+var TO_STRING_TAG = wellKnownSymbol('toStringTag');
+var test = {};
+
+test[TO_STRING_TAG] = 'z';
+
+module.exports = String(test) === '[object z]';
diff --git a/ddb_main/node_modules/core-js/internals/to-string.js b/ddb_main/node_modules/core-js/internals/to-string.js
new file mode 100644
index 0000000..0b0fae5
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/to-string.js
@@ -0,0 +1,9 @@
+'use strict';
+var classof = require('../internals/classof');
+
+var $String = String;
+
+module.exports = function (argument) {
+  if (classof(argument) === 'Symbol') throw new TypeError('Cannot convert a Symbol value to a string');
+  return $String(argument);
+};
diff --git a/ddb_main/node_modules/core-js/internals/try-to-string.js b/ddb_main/node_modules/core-js/internals/try-to-string.js
new file mode 100644
index 0000000..8f2357d
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/try-to-string.js
@@ -0,0 +1,10 @@
+'use strict';
+var $String = String;
+
+module.exports = function (argument) {
+  try {
+    return $String(argument);
+  } catch (error) {
+    return 'Object';
+  }
+};
diff --git a/ddb_main/node_modules/core-js/internals/uid.js b/ddb_main/node_modules/core-js/internals/uid.js
new file mode 100644
index 0000000..c02c401
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/uid.js
@@ -0,0 +1,10 @@
+'use strict';
+var uncurryThis = require('../internals/function-uncurry-this');
+
+var id = 0;
+var postfix = Math.random();
+var toString = uncurryThis(1.0.toString);
+
+module.exports = function (key) {
+  return 'Symbol(' + (key === undefined ? '' : key) + ')_' + toString(++id + postfix, 36);
+};
diff --git a/ddb_main/node_modules/core-js/internals/url-constructor-detection.js b/ddb_main/node_modules/core-js/internals/url-constructor-detection.js
new file mode 100644
index 0000000..fd828f8
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/url-constructor-detection.js
@@ -0,0 +1,42 @@
+'use strict';
+var fails = require('../internals/fails');
+var wellKnownSymbol = require('../internals/well-known-symbol');
+var DESCRIPTORS = require('../internals/descriptors');
+var IS_PURE = require('../internals/is-pure');
+
+var ITERATOR = wellKnownSymbol('iterator');
+
+module.exports = !fails(function () {
+  // eslint-disable-next-line unicorn/relative-url-style -- required for testing
+  var url = new URL('b?a=1&b=2&c=3', 'http://a');
+  var params = url.searchParams;
+  var params2 = new URLSearchParams('a=1&a=2&b=3');
+  var result = '';
+  url.pathname = 'c%20d';
+  params.forEach(function (value, key) {
+    params['delete']('b');
+    result += key + value;
+  });
+  params2['delete']('a', 2);
+  // `undefined` case is a Chromium 117 bug
+  // https://bugs.chromium.org/p/v8/issues/detail?id=14222
+  params2['delete']('b', undefined);
+  return (IS_PURE && (!url.toJSON || !params2.has('a', 1) || params2.has('a', 2) || !params2.has('a', undefined) || params2.has('b')))
+    || (!params.size && (IS_PURE || !DESCRIPTORS))
+    || !params.sort
+    || url.href !== 'http://a/c%20d?a=1&c=3'
+    || params.get('c') !== '3'
+    || String(new URLSearchParams('?a=1')) !== 'a=1'
+    || !params[ITERATOR]
+    // throws in Edge
+    || new URL('https://a@b').username !== 'a'
+    || new URLSearchParams(new URLSearchParams('a=b')).get('a') !== 'b'
+    // not punycoded in Edge
+    || new URL('http://тест').host !== 'xn--e1aybc'
+    // not escaped in Chrome 62-
+    || new URL('http://a#б').hash !== '#%D0%B1'
+    // fails in Chrome 66-
+    || result !== 'a1c3'
+    // throws in Safari
+    || new URL('http://x', undefined).host !== 'x';
+});
diff --git a/ddb_main/node_modules/core-js/internals/use-symbol-as-uid.js b/ddb_main/node_modules/core-js/internals/use-symbol-as-uid.js
new file mode 100644
index 0000000..677b0c9
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/use-symbol-as-uid.js
@@ -0,0 +1,7 @@
+'use strict';
+/* eslint-disable es/no-symbol -- required for testing */
+var NATIVE_SYMBOL = require('../internals/symbol-constructor-detection');
+
+module.exports = NATIVE_SYMBOL
+  && !Symbol.sham
+  && typeof Symbol.iterator == 'symbol';
diff --git a/ddb_main/node_modules/core-js/internals/v8-prototype-define-bug.js b/ddb_main/node_modules/core-js/internals/v8-prototype-define-bug.js
new file mode 100644
index 0000000..278d2bf
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/v8-prototype-define-bug.js
@@ -0,0 +1,13 @@
+'use strict';
+var DESCRIPTORS = require('../internals/descriptors');
+var fails = require('../internals/fails');
+
+// V8 ~ Chrome 36-
+// https://bugs.chromium.org/p/v8/issues/detail?id=3334
+module.exports = DESCRIPTORS && fails(function () {
+  // eslint-disable-next-line es/no-object-defineproperty -- required for testing
+  return Object.defineProperty(function () { /* empty */ }, 'prototype', {
+    value: 42,
+    writable: false
+  }).prototype !== 42;
+});
diff --git a/ddb_main/node_modules/core-js/internals/validate-arguments-length.js b/ddb_main/node_modules/core-js/internals/validate-arguments-length.js
new file mode 100644
index 0000000..b3a67b1
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/validate-arguments-length.js
@@ -0,0 +1,7 @@
+'use strict';
+var $TypeError = TypeError;
+
+module.exports = function (passed, required) {
+  if (passed < required) throw new $TypeError('Not enough arguments');
+  return passed;
+};
diff --git a/ddb_main/node_modules/core-js/internals/weak-map-basic-detection.js b/ddb_main/node_modules/core-js/internals/weak-map-basic-detection.js
new file mode 100644
index 0000000..d4f87f4
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/weak-map-basic-detection.js
@@ -0,0 +1,7 @@
+'use strict';
+var global = require('../internals/global');
+var isCallable = require('../internals/is-callable');
+
+var WeakMap = global.WeakMap;
+
+module.exports = isCallable(WeakMap) && /native code/.test(String(WeakMap));
diff --git a/ddb_main/node_modules/core-js/internals/well-known-symbol.js b/ddb_main/node_modules/core-js/internals/well-known-symbol.js
new file mode 100644
index 0000000..7e629a5
--- /dev/null
+++ b/ddb_main/node_modules/core-js/internals/well-known-symbol.js
@@ -0,0 +1,19 @@
+'use strict';
+var global = require('../internals/global');
+var shared = require('../internals/shared');
+var hasOwn = require('../internals/has-own-property');
+var uid = require('../internals/uid');
+var NATIVE_SYMBOL = require('../internals/symbol-constructor-detection');
+var USE_SYMBOL_AS_UID = require('../internals/use-symbol-as-uid');
+
+var Symbol = global.Symbol;
+var WellKnownSymbolsStore = shared('wks');
+var createWellKnownSymbol = USE_SYMBOL_AS_UID ? Symbol['for'] || Symbol : Symbol && Symbol.withoutSetter || uid;
+
+module.exports = function (name) {
+  if (!hasOwn(WellKnownSymbolsStore, name)) {
+    WellKnownSymbolsStore[name] = NATIVE_SYMBOL && hasOwn(Symbol, name)
+      ? Symbol[name]
+      : createWellKnownSymbol('Symbol.' + name);
+  } return WellKnownSymbolsStore[name];
+};
diff --git a/ddb_main/node_modules/core-js/modules/es.array.iterator.js b/ddb_main/node_modules/core-js/modules/es.array.iterator.js
new file mode 100644
index 0000000..bffdb84
--- /dev/null
+++ b/ddb_main/node_modules/core-js/modules/es.array.iterator.js
@@ -0,0 +1,62 @@
+'use strict';
+var toIndexedObject = require('../internals/to-indexed-object');
+var addToUnscopables = require('../internals/add-to-unscopables');
+var Iterators = require('../internals/iterators');
+var InternalStateModule = require('../internals/internal-state');
+var defineProperty = require('../internals/object-define-property').f;
+var defineIterator = require('../internals/iterator-define');
+var createIterResultObject = require('../internals/create-iter-result-object');
+var IS_PURE = require('../internals/is-pure');
+var DESCRIPTORS = require('../internals/descriptors');
+
+var ARRAY_ITERATOR = 'Array Iterator';
+var setInternalState = InternalStateModule.set;
+var getInternalState = InternalStateModule.getterFor(ARRAY_ITERATOR);
+
+// `Array.prototype.entries` method
+// https://tc39.es/ecma262/#sec-array.prototype.entries
+// `Array.prototype.keys` method
+// https://tc39.es/ecma262/#sec-array.prototype.keys
+// `Array.prototype.values` method
+// https://tc39.es/ecma262/#sec-array.prototype.values
+// `Array.prototype[@@iterator]` method
+// https://tc39.es/ecma262/#sec-array.prototype-@@iterator
+// `CreateArrayIterator` internal method
+// https://tc39.es/ecma262/#sec-createarrayiterator
+module.exports = defineIterator(Array, 'Array', function (iterated, kind) {
+  setInternalState(this, {
+    type: ARRAY_ITERATOR,
+    target: toIndexedObject(iterated), // target
+    index: 0,                          // next index
+    kind: kind                         // kind
+  });
+// `%ArrayIteratorPrototype%.next` method
+// https://tc39.es/ecma262/#sec-%arrayiteratorprototype%.next
+}, function () {
+  var state = getInternalState(this);
+  var target = state.target;
+  var index = state.index++;
+  if (!target || index >= target.length) {
+    state.target = undefined;
+    return createIterResultObject(undefined, true);
+  }
+  switch (state.kind) {
+    case 'keys': return createIterResultObject(index, false);
+    case 'values': return createIterResultObject(target[index], false);
+  } return createIterResultObject([index, target[index]], false);
+}, 'values');
+
+// argumentsList[@@iterator] is %ArrayProto_values%
+// https://tc39.es/ecma262/#sec-createunmappedargumentsobject
+// https://tc39.es/ecma262/#sec-createmappedargumentsobject
+var values = Iterators.Arguments = Iterators.Array;
+
+// https://tc39.es/ecma262/#sec-array.prototype-@@unscopables
+addToUnscopables('keys');
+addToUnscopables('values');
+addToUnscopables('entries');
+
+// V8 ~ Chrome 45- bug
+if (!IS_PURE && DESCRIPTORS && values.name !== 'values') try {
+  defineProperty(values, 'name', { value: 'values' });
+} catch (error) { /* empty */ }
diff --git a/ddb_main/node_modules/core-js/modules/es.string.iterator.js b/ddb_main/node_modules/core-js/modules/es.string.iterator.js
new file mode 100644
index 0000000..cfd486c
--- /dev/null
+++ b/ddb_main/node_modules/core-js/modules/es.string.iterator.js
@@ -0,0 +1,31 @@
+'use strict';
+var charAt = require('../internals/string-multibyte').charAt;
+var toString = require('../internals/to-string');
+var InternalStateModule = require('../internals/internal-state');
+var defineIterator = require('../internals/iterator-define');
+var createIterResultObject = require('../internals/create-iter-result-object');
+
+var STRING_ITERATOR = 'String Iterator';
+var setInternalState = InternalStateModule.set;
+var getInternalState = InternalStateModule.getterFor(STRING_ITERATOR);
+
+// `String.prototype[@@iterator]` method
+// https://tc39.es/ecma262/#sec-string.prototype-@@iterator
+defineIterator(String, 'String', function (iterated) {
+  setInternalState(this, {
+    type: STRING_ITERATOR,
+    string: toString(iterated),
+    index: 0
+  });
+// `%StringIteratorPrototype%.next` method
+// https://tc39.es/ecma262/#sec-%stringiteratorprototype%.next
+}, function next() {
+  var state = getInternalState(this);
+  var string = state.string;
+  var index = state.index;
+  var point;
+  if (index >= string.length) return createIterResultObject(undefined, true);
+  point = charAt(string, index);
+  state.index += point.length;
+  return createIterResultObject(point, false);
+});
diff --git a/ddb_main/node_modules/core-js/modules/web.dom-collections.iterator.js b/ddb_main/node_modules/core-js/modules/web.dom-collections.iterator.js
new file mode 100644
index 0000000..d265360
--- /dev/null
+++ b/ddb_main/node_modules/core-js/modules/web.dom-collections.iterator.js
@@ -0,0 +1,37 @@
+'use strict';
+var global = require('../internals/global');
+var DOMIterables = require('../internals/dom-iterables');
+var DOMTokenListPrototype = require('../internals/dom-token-list-prototype');
+var ArrayIteratorMethods = require('../modules/es.array.iterator');
+var createNonEnumerableProperty = require('../internals/create-non-enumerable-property');
+var setToStringTag = require('../internals/set-to-string-tag');
+var wellKnownSymbol = require('../internals/well-known-symbol');
+
+var ITERATOR = wellKnownSymbol('iterator');
+var ArrayValues = ArrayIteratorMethods.values;
+
+var handlePrototype = function (CollectionPrototype, COLLECTION_NAME) {
+  if (CollectionPrototype) {
+    // some Chrome versions have non-configurable methods on DOMTokenList
+    if (CollectionPrototype[ITERATOR] !== ArrayValues) try {
+      createNonEnumerableProperty(CollectionPrototype, ITERATOR, ArrayValues);
+    } catch (error) {
+      CollectionPrototype[ITERATOR] = ArrayValues;
+    }
+    setToStringTag(CollectionPrototype, COLLECTION_NAME, true);
+    if (DOMIterables[COLLECTION_NAME]) for (var METHOD_NAME in ArrayIteratorMethods) {
+      // some Chrome versions have non-configurable methods on DOMTokenList
+      if (CollectionPrototype[METHOD_NAME] !== ArrayIteratorMethods[METHOD_NAME]) try {
+        createNonEnumerableProperty(CollectionPrototype, METHOD_NAME, ArrayIteratorMethods[METHOD_NAME]);
+      } catch (error) {
+        CollectionPrototype[METHOD_NAME] = ArrayIteratorMethods[METHOD_NAME];
+      }
+    }
+  }
+};
+
+for (var COLLECTION_NAME in DOMIterables) {
+  handlePrototype(global[COLLECTION_NAME] && global[COLLECTION_NAME].prototype, COLLECTION_NAME);
+}
+
+handlePrototype(DOMTokenListPrototype, 'DOMTokenList');
diff --git a/ddb_main/node_modules/core-js/modules/web.url-search-params.constructor.js b/ddb_main/node_modules/core-js/modules/web.url-search-params.constructor.js
new file mode 100644
index 0000000..4498e5b
--- /dev/null
+++ b/ddb_main/node_modules/core-js/modules/web.url-search-params.constructor.js
@@ -0,0 +1,416 @@
+'use strict';
+// TODO: in core-js@4, move /modules/ dependencies to public entries for better optimization by tools like `preset-env`
+require('../modules/es.array.iterator');
+var $ = require('../internals/export');
+var global = require('../internals/global');
+var safeGetBuiltIn = require('../internals/safe-get-built-in');
+var call = require('../internals/function-call');
+var uncurryThis = require('../internals/function-uncurry-this');
+var DESCRIPTORS = require('../internals/descriptors');
+var USE_NATIVE_URL = require('../internals/url-constructor-detection');
+var defineBuiltIn = require('../internals/define-built-in');
+var defineBuiltInAccessor = require('../internals/define-built-in-accessor');
+var defineBuiltIns = require('../internals/define-built-ins');
+var setToStringTag = require('../internals/set-to-string-tag');
+var createIteratorConstructor = require('../internals/iterator-create-constructor');
+var InternalStateModule = require('../internals/internal-state');
+var anInstance = require('../internals/an-instance');
+var isCallable = require('../internals/is-callable');
+var hasOwn = require('../internals/has-own-property');
+var bind = require('../internals/function-bind-context');
+var classof = require('../internals/classof');
+var anObject = require('../internals/an-object');
+var isObject = require('../internals/is-object');
+var $toString = require('../internals/to-string');
+var create = require('../internals/object-create');
+var createPropertyDescriptor = require('../internals/create-property-descriptor');
+var getIterator = require('../internals/get-iterator');
+var getIteratorMethod = require('../internals/get-iterator-method');
+var createIterResultObject = require('../internals/create-iter-result-object');
+var validateArgumentsLength = require('../internals/validate-arguments-length');
+var wellKnownSymbol = require('../internals/well-known-symbol');
+var arraySort = require('../internals/array-sort');
+
+var ITERATOR = wellKnownSymbol('iterator');
+var URL_SEARCH_PARAMS = 'URLSearchParams';
+var URL_SEARCH_PARAMS_ITERATOR = URL_SEARCH_PARAMS + 'Iterator';
+var setInternalState = InternalStateModule.set;
+var getInternalParamsState = InternalStateModule.getterFor(URL_SEARCH_PARAMS);
+var getInternalIteratorState = InternalStateModule.getterFor(URL_SEARCH_PARAMS_ITERATOR);
+
+var nativeFetch = safeGetBuiltIn('fetch');
+var NativeRequest = safeGetBuiltIn('Request');
+var Headers = safeGetBuiltIn('Headers');
+var RequestPrototype = NativeRequest && NativeRequest.prototype;
+var HeadersPrototype = Headers && Headers.prototype;
+var RegExp = global.RegExp;
+var TypeError = global.TypeError;
+var decodeURIComponent = global.decodeURIComponent;
+var encodeURIComponent = global.encodeURIComponent;
+var charAt = uncurryThis(''.charAt);
+var join = uncurryThis([].join);
+var push = uncurryThis([].push);
+var replace = uncurryThis(''.replace);
+var shift = uncurryThis([].shift);
+var splice = uncurryThis([].splice);
+var split = uncurryThis(''.split);
+var stringSlice = uncurryThis(''.slice);
+
+var plus = /\+/g;
+var sequences = Array(4);
+
+var percentSequence = function (bytes) {
+  return sequences[bytes - 1] || (sequences[bytes - 1] = RegExp('((?:%[\\da-f]{2}){' + bytes + '})', 'gi'));
+};
+
+var percentDecode = function (sequence) {
+  try {
+    return decodeURIComponent(sequence);
+  } catch (error) {
+    return sequence;
+  }
+};
+
+var deserialize = function (it) {
+  var result = replace(it, plus, ' ');
+  var bytes = 4;
+  try {
+    return decodeURIComponent(result);
+  } catch (error) {
+    while (bytes) {
+      result = replace(result, percentSequence(bytes--), percentDecode);
+    }
+    return result;
+  }
+};
+
+var find = /[!'()~]|%20/g;
+
+var replacements = {
+  '!': '%21',
+  "'": '%27',
+  '(': '%28',
+  ')': '%29',
+  '~': '%7E',
+  '%20': '+'
+};
+
+var replacer = function (match) {
+  return replacements[match];
+};
+
+var serialize = function (it) {
+  return replace(encodeURIComponent(it), find, replacer);
+};
+
+var URLSearchParamsIterator = createIteratorConstructor(function Iterator(params, kind) {
+  setInternalState(this, {
+    type: URL_SEARCH_PARAMS_ITERATOR,
+    target: getInternalParamsState(params).entries,
+    index: 0,
+    kind: kind
+  });
+}, URL_SEARCH_PARAMS, function next() {
+  var state = getInternalIteratorState(this);
+  var target = state.target;
+  var index = state.index++;
+  if (!target || index >= target.length) {
+    state.target = undefined;
+    return createIterResultObject(undefined, true);
+  }
+  var entry = target[index];
+  switch (state.kind) {
+    case 'keys': return createIterResultObject(entry.key, false);
+    case 'values': return createIterResultObject(entry.value, false);
+  } return createIterResultObject([entry.key, entry.value], false);
+}, true);
+
+var URLSearchParamsState = function (init) {
+  this.entries = [];
+  this.url = null;
+
+  if (init !== undefined) {
+    if (isObject(init)) this.parseObject(init);
+    else this.parseQuery(typeof init == 'string' ? charAt(init, 0) === '?' ? stringSlice(init, 1) : init : $toString(init));
+  }
+};
+
+URLSearchParamsState.prototype = {
+  type: URL_SEARCH_PARAMS,
+  bindURL: function (url) {
+    this.url = url;
+    this.update();
+  },
+  parseObject: function (object) {
+    var entries = this.entries;
+    var iteratorMethod = getIteratorMethod(object);
+    var iterator, next, step, entryIterator, entryNext, first, second;
+
+    if (iteratorMethod) {
+      iterator = getIterator(object, iteratorMethod);
+      next = iterator.next;
+      while (!(step = call(next, iterator)).done) {
+        entryIterator = getIterator(anObject(step.value));
+        entryNext = entryIterator.next;
+        if (
+          (first = call(entryNext, entryIterator)).done ||
+          (second = call(entryNext, entryIterator)).done ||
+          !call(entryNext, entryIterator).done
+        ) throw new TypeError('Expected sequence with length 2');
+        push(entries, { key: $toString(first.value), value: $toString(second.value) });
+      }
+    } else for (var key in object) if (hasOwn(object, key)) {
+      push(entries, { key: key, value: $toString(object[key]) });
+    }
+  },
+  parseQuery: function (query) {
+    if (query) {
+      var entries = this.entries;
+      var attributes = split(query, '&');
+      var index = 0;
+      var attribute, entry;
+      while (index < attributes.length) {
+        attribute = attributes[index++];
+        if (attribute.length) {
+          entry = split(attribute, '=');
+          push(entries, {
+            key: deserialize(shift(entry)),
+            value: deserialize(join(entry, '='))
+          });
+        }
+      }
+    }
+  },
+  serialize: function () {
+    var entries = this.entries;
+    var result = [];
+    var index = 0;
+    var entry;
+    while (index < entries.length) {
+      entry = entries[index++];
+      push(result, serialize(entry.key) + '=' + serialize(entry.value));
+    } return join(result, '&');
+  },
+  update: function () {
+    this.entries.length = 0;
+    this.parseQuery(this.url.query);
+  },
+  updateURL: function () {
+    if (this.url) this.url.update();
+  }
+};
+
+// `URLSearchParams` constructor
+// https://url.spec.whatwg.org/#interface-urlsearchparams
+var URLSearchParamsConstructor = function URLSearchParams(/* init */) {
+  anInstance(this, URLSearchParamsPrototype);
+  var init = arguments.length > 0 ? arguments[0] : undefined;
+  var state = setInternalState(this, new URLSearchParamsState(init));
+  if (!DESCRIPTORS) this.size = state.entries.length;
+};
+
+var URLSearchParamsPrototype = URLSearchParamsConstructor.prototype;
+
+defineBuiltIns(URLSearchParamsPrototype, {
+  // `URLSearchParams.prototype.append` method
+  // https://url.spec.whatwg.org/#dom-urlsearchparams-append
+  append: function append(name, value) {
+    var state = getInternalParamsState(this);
+    validateArgumentsLength(arguments.length, 2);
+    push(state.entries, { key: $toString(name), value: $toString(value) });
+    if (!DESCRIPTORS) this.length++;
+    state.updateURL();
+  },
+  // `URLSearchParams.prototype.delete` method
+  // https://url.spec.whatwg.org/#dom-urlsearchparams-delete
+  'delete': function (name /* , value */) {
+    var state = getInternalParamsState(this);
+    var length = validateArgumentsLength(arguments.length, 1);
+    var entries = state.entries;
+    var key = $toString(name);
+    var $value = length < 2 ? undefined : arguments[1];
+    var value = $value === undefined ? $value : $toString($value);
+    var index = 0;
+    while (index < entries.length) {
+      var entry = entries[index];
+      if (entry.key === key && (value === undefined || entry.value === value)) {
+        splice(entries, index, 1);
+        if (value !== undefined) break;
+      } else index++;
+    }
+    if (!DESCRIPTORS) this.size = entries.length;
+    state.updateURL();
+  },
+  // `URLSearchParams.prototype.get` method
+  // https://url.spec.whatwg.org/#dom-urlsearchparams-get
+  get: function get(name) {
+    var entries = getInternalParamsState(this).entries;
+    validateArgumentsLength(arguments.length, 1);
+    var key = $toString(name);
+    var index = 0;
+    for (; index < entries.length; index++) {
+      if (entries[index].key === key) return entries[index].value;
+    }
+    return null;
+  },
+  // `URLSearchParams.prototype.getAll` method
+  // https://url.spec.whatwg.org/#dom-urlsearchparams-getall
+  getAll: function getAll(name) {
+    var entries = getInternalParamsState(this).entries;
+    validateArgumentsLength(arguments.length, 1);
+    var key = $toString(name);
+    var result = [];
+    var index = 0;
+    for (; index < entries.length; index++) {
+      if (entries[index].key === key) push(result, entries[index].value);
+    }
+    return result;
+  },
+  // `URLSearchParams.prototype.has` method
+  // https://url.spec.whatwg.org/#dom-urlsearchparams-has
+  has: function has(name /* , value */) {
+    var entries = getInternalParamsState(this).entries;
+    var length = validateArgumentsLength(arguments.length, 1);
+    var key = $toString(name);
+    var $value = length < 2 ? undefined : arguments[1];
+    var value = $value === undefined ? $value : $toString($value);
+    var index = 0;
+    while (index < entries.length) {
+      var entry = entries[index++];
+      if (entry.key === key && (value === undefined || entry.value === value)) return true;
+    }
+    return false;
+  },
+  // `URLSearchParams.prototype.set` method
+  // https://url.spec.whatwg.org/#dom-urlsearchparams-set
+  set: function set(name, value) {
+    var state = getInternalParamsState(this);
+    validateArgumentsLength(arguments.length, 1);
+    var entries = state.entries;
+    var found = false;
+    var key = $toString(name);
+    var val = $toString(value);
+    var index = 0;
+    var entry;
+    for (; index < entries.length; index++) {
+      entry = entries[index];
+      if (entry.key === key) {
+        if (found) splice(entries, index--, 1);
+        else {
+          found = true;
+          entry.value = val;
+        }
+      }
+    }
+    if (!found) push(entries, { key: key, value: val });
+    if (!DESCRIPTORS) this.size = entries.length;
+    state.updateURL();
+  },
+  // `URLSearchParams.prototype.sort` method
+  // https://url.spec.whatwg.org/#dom-urlsearchparams-sort
+  sort: function sort() {
+    var state = getInternalParamsState(this);
+    arraySort(state.entries, function (a, b) {
+      return a.key > b.key ? 1 : -1;
+    });
+    state.updateURL();
+  },
+  // `URLSearchParams.prototype.forEach` method
+  forEach: function forEach(callback /* , thisArg */) {
+    var entries = getInternalParamsState(this).entries;
+    var boundFunction = bind(callback, arguments.length > 1 ? arguments[1] : undefined);
+    var index = 0;
+    var entry;
+    while (index < entries.length) {
+      entry = entries[index++];
+      boundFunction(entry.value, entry.key, this);
+    }
+  },
+  // `URLSearchParams.prototype.keys` method
+  keys: function keys() {
+    return new URLSearchParamsIterator(this, 'keys');
+  },
+  // `URLSearchParams.prototype.values` method
+  values: function values() {
+    return new URLSearchParamsIterator(this, 'values');
+  },
+  // `URLSearchParams.prototype.entries` method
+  entries: function entries() {
+    return new URLSearchParamsIterator(this, 'entries');
+  }
+}, { enumerable: true });
+
+// `URLSearchParams.prototype[@@iterator]` method
+defineBuiltIn(URLSearchParamsPrototype, ITERATOR, URLSearchParamsPrototype.entries, { name: 'entries' });
+
+// `URLSearchParams.prototype.toString` method
+// https://url.spec.whatwg.org/#urlsearchparams-stringification-behavior
+defineBuiltIn(URLSearchParamsPrototype, 'toString', function toString() {
+  return getInternalParamsState(this).serialize();
+}, { enumerable: true });
+
+// `URLSearchParams.prototype.size` getter
+// https://github.com/whatwg/url/pull/734
+if (DESCRIPTORS) defineBuiltInAccessor(URLSearchParamsPrototype, 'size', {
+  get: function size() {
+    return getInternalParamsState(this).entries.length;
+  },
+  configurable: true,
+  enumerable: true
+});
+
+setToStringTag(URLSearchParamsConstructor, URL_SEARCH_PARAMS);
+
+$({ global: true, constructor: true, forced: !USE_NATIVE_URL }, {
+  URLSearchParams: URLSearchParamsConstructor
+});
+
+// Wrap `fetch` and `Request` for correct work with polyfilled `URLSearchParams`
+if (!USE_NATIVE_URL && isCallable(Headers)) {
+  var headersHas = uncurryThis(HeadersPrototype.has);
+  var headersSet = uncurryThis(HeadersPrototype.set);
+
+  var wrapRequestOptions = function (init) {
+    if (isObject(init)) {
+      var body = init.body;
+      var headers;
+      if (classof(body) === URL_SEARCH_PARAMS) {
+        headers = init.headers ? new Headers(init.headers) : new Headers();
+        if (!headersHas(headers, 'content-type')) {
+          headersSet(headers, 'content-type', 'application/x-www-form-urlencoded;charset=UTF-8');
+        }
+        return create(init, {
+          body: createPropertyDescriptor(0, $toString(body)),
+          headers: createPropertyDescriptor(0, headers)
+        });
+      }
+    } return init;
+  };
+
+  if (isCallable(nativeFetch)) {
+    $({ global: true, enumerable: true, dontCallGetSet: true, forced: true }, {
+      fetch: function fetch(input /* , init */) {
+        return nativeFetch(input, arguments.length > 1 ? wrapRequestOptions(arguments[1]) : {});
+      }
+    });
+  }
+
+  if (isCallable(NativeRequest)) {
+    var RequestConstructor = function Request(input /* , init */) {
+      anInstance(this, RequestPrototype);
+      return new NativeRequest(input, arguments.length > 1 ? wrapRequestOptions(arguments[1]) : {});
+    };
+
+    RequestPrototype.constructor = RequestConstructor;
+    RequestConstructor.prototype = RequestPrototype;
+
+    $({ global: true, constructor: true, dontCallGetSet: true, forced: true }, {
+      Request: RequestConstructor
+    });
+  }
+}
+
+module.exports = {
+  URLSearchParams: URLSearchParamsConstructor,
+  getState: getInternalParamsState
+};
diff --git a/ddb_main/node_modules/core-js/modules/web.url-search-params.js b/ddb_main/node_modules/core-js/modules/web.url-search-params.js
new file mode 100644
index 0000000..5ebea93
--- /dev/null
+++ b/ddb_main/node_modules/core-js/modules/web.url-search-params.js
@@ -0,0 +1,3 @@
+'use strict';
+// TODO: Remove this module from `core-js@4` since it's replaced to module below
+require('../modules/web.url-search-params.constructor');
diff --git a/ddb_main/node_modules/core-js/modules/web.url.constructor.js b/ddb_main/node_modules/core-js/modules/web.url.constructor.js
new file mode 100644
index 0000000..936257a
--- /dev/null
+++ b/ddb_main/node_modules/core-js/modules/web.url.constructor.js
@@ -0,0 +1,1048 @@
+'use strict';
+// TODO: in core-js@4, move /modules/ dependencies to public entries for better optimization by tools like `preset-env`
+require('../modules/es.string.iterator');
+var $ = require('../internals/export');
+var DESCRIPTORS = require('../internals/descriptors');
+var USE_NATIVE_URL = require('../internals/url-constructor-detection');
+var global = require('../internals/global');
+var bind = require('../internals/function-bind-context');
+var uncurryThis = require('../internals/function-uncurry-this');
+var defineBuiltIn = require('../internals/define-built-in');
+var defineBuiltInAccessor = require('../internals/define-built-in-accessor');
+var anInstance = require('../internals/an-instance');
+var hasOwn = require('../internals/has-own-property');
+var assign = require('../internals/object-assign');
+var arrayFrom = require('../internals/array-from');
+var arraySlice = require('../internals/array-slice');
+var codeAt = require('../internals/string-multibyte').codeAt;
+var toASCII = require('../internals/string-punycode-to-ascii');
+var $toString = require('../internals/to-string');
+var setToStringTag = require('../internals/set-to-string-tag');
+var validateArgumentsLength = require('../internals/validate-arguments-length');
+var URLSearchParamsModule = require('../modules/web.url-search-params.constructor');
+var InternalStateModule = require('../internals/internal-state');
+
+var setInternalState = InternalStateModule.set;
+var getInternalURLState = InternalStateModule.getterFor('URL');
+var URLSearchParams = URLSearchParamsModule.URLSearchParams;
+var getInternalSearchParamsState = URLSearchParamsModule.getState;
+
+var NativeURL = global.URL;
+var TypeError = global.TypeError;
+var parseInt = global.parseInt;
+var floor = Math.floor;
+var pow = Math.pow;
+var charAt = uncurryThis(''.charAt);
+var exec = uncurryThis(/./.exec);
+var join = uncurryThis([].join);
+var numberToString = uncurryThis(1.0.toString);
+var pop = uncurryThis([].pop);
+var push = uncurryThis([].push);
+var replace = uncurryThis(''.replace);
+var shift = uncurryThis([].shift);
+var split = uncurryThis(''.split);
+var stringSlice = uncurryThis(''.slice);
+var toLowerCase = uncurryThis(''.toLowerCase);
+var unshift = uncurryThis([].unshift);
+
+var INVALID_AUTHORITY = 'Invalid authority';
+var INVALID_SCHEME = 'Invalid scheme';
+var INVALID_HOST = 'Invalid host';
+var INVALID_PORT = 'Invalid port';
+
+var ALPHA = /[a-z]/i;
+// eslint-disable-next-line regexp/no-obscure-range -- safe
+var ALPHANUMERIC = /[\d+-.a-z]/i;
+var DIGIT = /\d/;
+var HEX_START = /^0x/i;
+var OCT = /^[0-7]+$/;
+var DEC = /^\d+$/;
+var HEX = /^[\da-f]+$/i;
+/* eslint-disable regexp/no-control-character -- safe */
+var FORBIDDEN_HOST_CODE_POINT = /[\0\t\n\r #%/:<>?@[\\\]^|]/;
+var FORBIDDEN_HOST_CODE_POINT_EXCLUDING_PERCENT = /[\0\t\n\r #/:<>?@[\\\]^|]/;
+var LEADING_C0_CONTROL_OR_SPACE = /^[\u0000-\u0020]+/;
+var TRAILING_C0_CONTROL_OR_SPACE = /(^|[^\u0000-\u0020])[\u0000-\u0020]+$/;
+var TAB_AND_NEW_LINE = /[\t\n\r]/g;
+/* eslint-enable regexp/no-control-character -- safe */
+var EOF;
+
+// https://url.spec.whatwg.org/#ipv4-number-parser
+var parseIPv4 = function (input) {
+  var parts = split(input, '.');
+  var partsLength, numbers, index, part, radix, number, ipv4;
+  if (parts.length && parts[parts.length - 1] === '') {
+    parts.length--;
+  }
+  partsLength = parts.length;
+  if (partsLength > 4) return input;
+  numbers = [];
+  for (index = 0; index < partsLength; index++) {
+    part = parts[index];
+    if (part === '') return input;
+    radix = 10;
+    if (part.length > 1 && charAt(part, 0) === '0') {
+      radix = exec(HEX_START, part) ? 16 : 8;
+      part = stringSlice(part, radix === 8 ? 1 : 2);
+    }
+    if (part === '') {
+      number = 0;
+    } else {
+      if (!exec(radix === 10 ? DEC : radix === 8 ? OCT : HEX, part)) return input;
+      number = parseInt(part, radix);
+    }
+    push(numbers, number);
+  }
+  for (index = 0; index < partsLength; index++) {
+    number = numbers[index];
+    if (index === partsLength - 1) {
+      if (number >= pow(256, 5 - partsLength)) return null;
+    } else if (number > 255) return null;
+  }
+  ipv4 = pop(numbers);
+  for (index = 0; index < numbers.length; index++) {
+    ipv4 += numbers[index] * pow(256, 3 - index);
+  }
+  return ipv4;
+};
+
+// https://url.spec.whatwg.org/#concept-ipv6-parser
+// eslint-disable-next-line max-statements -- TODO
+var parseIPv6 = function (input) {
+  var address = [0, 0, 0, 0, 0, 0, 0, 0];
+  var pieceIndex = 0;
+  var compress = null;
+  var pointer = 0;
+  var value, length, numbersSeen, ipv4Piece, number, swaps, swap;
+
+  var chr = function () {
+    return charAt(input, pointer);
+  };
+
+  if (chr() === ':') {
+    if (charAt(input, 1) !== ':') return;
+    pointer += 2;
+    pieceIndex++;
+    compress = pieceIndex;
+  }
+  while (chr()) {
+    if (pieceIndex === 8) return;
+    if (chr() === ':') {
+      if (compress !== null) return;
+      pointer++;
+      pieceIndex++;
+      compress = pieceIndex;
+      continue;
+    }
+    value = length = 0;
+    while (length < 4 && exec(HEX, chr())) {
+      value = value * 16 + parseInt(chr(), 16);
+      pointer++;
+      length++;
+    }
+    if (chr() === '.') {
+      if (length === 0) return;
+      pointer -= length;
+      if (pieceIndex > 6) return;
+      numbersSeen = 0;
+      while (chr()) {
+        ipv4Piece = null;
+        if (numbersSeen > 0) {
+          if (chr() === '.' && numbersSeen < 4) pointer++;
+          else return;
+        }
+        if (!exec(DIGIT, chr())) return;
+        while (exec(DIGIT, chr())) {
+          number = parseInt(chr(), 10);
+          if (ipv4Piece === null) ipv4Piece = number;
+          else if (ipv4Piece === 0) return;
+          else ipv4Piece = ipv4Piece * 10 + number;
+          if (ipv4Piece > 255) return;
+          pointer++;
+        }
+        address[pieceIndex] = address[pieceIndex] * 256 + ipv4Piece;
+        numbersSeen++;
+        if (numbersSeen === 2 || numbersSeen === 4) pieceIndex++;
+      }
+      if (numbersSeen !== 4) return;
+      break;
+    } else if (chr() === ':') {
+      pointer++;
+      if (!chr()) return;
+    } else if (chr()) return;
+    address[pieceIndex++] = value;
+  }
+  if (compress !== null) {
+    swaps = pieceIndex - compress;
+    pieceIndex = 7;
+    while (pieceIndex !== 0 && swaps > 0) {
+      swap = address[pieceIndex];
+      address[pieceIndex--] = address[compress + swaps - 1];
+      address[compress + --swaps] = swap;
+    }
+  } else if (pieceIndex !== 8) return;
+  return address;
+};
+
+var findLongestZeroSequence = function (ipv6) {
+  var maxIndex = null;
+  var maxLength = 1;
+  var currStart = null;
+  var currLength = 0;
+  var index = 0;
+  for (; index < 8; index++) {
+    if (ipv6[index] !== 0) {
+      if (currLength > maxLength) {
+        maxIndex = currStart;
+        maxLength = currLength;
+      }
+      currStart = null;
+      currLength = 0;
+    } else {
+      if (currStart === null) currStart = index;
+      ++currLength;
+    }
+  }
+  if (currLength > maxLength) {
+    maxIndex = currStart;
+    maxLength = currLength;
+  }
+  return maxIndex;
+};
+
+// https://url.spec.whatwg.org/#host-serializing
+var serializeHost = function (host) {
+  var result, index, compress, ignore0;
+  // ipv4
+  if (typeof host == 'number') {
+    result = [];
+    for (index = 0; index < 4; index++) {
+      unshift(result, host % 256);
+      host = floor(host / 256);
+    } return join(result, '.');
+  // ipv6
+  } else if (typeof host == 'object') {
+    result = '';
+    compress = findLongestZeroSequence(host);
+    for (index = 0; index < 8; index++) {
+      if (ignore0 && host[index] === 0) continue;
+      if (ignore0) ignore0 = false;
+      if (compress === index) {
+        result += index ? ':' : '::';
+        ignore0 = true;
+      } else {
+        result += numberToString(host[index], 16);
+        if (index < 7) result += ':';
+      }
+    }
+    return '[' + result + ']';
+  } return host;
+};
+
+var C0ControlPercentEncodeSet = {};
+var fragmentPercentEncodeSet = assign({}, C0ControlPercentEncodeSet, {
+  ' ': 1, '"': 1, '<': 1, '>': 1, '`': 1
+});
+var pathPercentEncodeSet = assign({}, fragmentPercentEncodeSet, {
+  '#': 1, '?': 1, '{': 1, '}': 1
+});
+var userinfoPercentEncodeSet = assign({}, pathPercentEncodeSet, {
+  '/': 1, ':': 1, ';': 1, '=': 1, '@': 1, '[': 1, '\\': 1, ']': 1, '^': 1, '|': 1
+});
+
+var percentEncode = function (chr, set) {
+  var code = codeAt(chr, 0);
+  return code > 0x20 && code < 0x7F && !hasOwn(set, chr) ? chr : encodeURIComponent(chr);
+};
+
+// https://url.spec.whatwg.org/#special-scheme
+var specialSchemes = {
+  ftp: 21,
+  file: null,
+  http: 80,
+  https: 443,
+  ws: 80,
+  wss: 443
+};
+
+// https://url.spec.whatwg.org/#windows-drive-letter
+var isWindowsDriveLetter = function (string, normalized) {
+  var second;
+  return string.length === 2 && exec(ALPHA, charAt(string, 0))
+    && ((second = charAt(string, 1)) === ':' || (!normalized && second === '|'));
+};
+
+// https://url.spec.whatwg.org/#start-with-a-windows-drive-letter
+var startsWithWindowsDriveLetter = function (string) {
+  var third;
+  return string.length > 1 && isWindowsDriveLetter(stringSlice(string, 0, 2)) && (
+    string.length === 2 ||
+    ((third = charAt(string, 2)) === '/' || third === '\\' || third === '?' || third === '#')
+  );
+};
+
+// https://url.spec.whatwg.org/#single-dot-path-segment
+var isSingleDot = function (segment) {
+  return segment === '.' || toLowerCase(segment) === '%2e';
+};
+
+// https://url.spec.whatwg.org/#double-dot-path-segment
+var isDoubleDot = function (segment) {
+  segment = toLowerCase(segment);
+  return segment === '..' || segment === '%2e.' || segment === '.%2e' || segment === '%2e%2e';
+};
+
+// States:
+var SCHEME_START = {};
+var SCHEME = {};
+var NO_SCHEME = {};
+var SPECIAL_RELATIVE_OR_AUTHORITY = {};
+var PATH_OR_AUTHORITY = {};
+var RELATIVE = {};
+var RELATIVE_SLASH = {};
+var SPECIAL_AUTHORITY_SLASHES = {};
+var SPECIAL_AUTHORITY_IGNORE_SLASHES = {};
+var AUTHORITY = {};
+var HOST = {};
+var HOSTNAME = {};
+var PORT = {};
+var FILE = {};
+var FILE_SLASH = {};
+var FILE_HOST = {};
+var PATH_START = {};
+var PATH = {};
+var CANNOT_BE_A_BASE_URL_PATH = {};
+var QUERY = {};
+var FRAGMENT = {};
+
+var URLState = function (url, isBase, base) {
+  var urlString = $toString(url);
+  var baseState, failure, searchParams;
+  if (isBase) {
+    failure = this.parse(urlString);
+    if (failure) throw new TypeError(failure);
+    this.searchParams = null;
+  } else {
+    if (base !== undefined) baseState = new URLState(base, true);
+    failure = this.parse(urlString, null, baseState);
+    if (failure) throw new TypeError(failure);
+    searchParams = getInternalSearchParamsState(new URLSearchParams());
+    searchParams.bindURL(this);
+    this.searchParams = searchParams;
+  }
+};
+
+URLState.prototype = {
+  type: 'URL',
+  // https://url.spec.whatwg.org/#url-parsing
+  // eslint-disable-next-line max-statements -- TODO
+  parse: function (input, stateOverride, base) {
+    var url = this;
+    var state = stateOverride || SCHEME_START;
+    var pointer = 0;
+    var buffer = '';
+    var seenAt = false;
+    var seenBracket = false;
+    var seenPasswordToken = false;
+    var codePoints, chr, bufferCodePoints, failure;
+
+    input = $toString(input);
+
+    if (!stateOverride) {
+      url.scheme = '';
+      url.username = '';
+      url.password = '';
+      url.host = null;
+      url.port = null;
+      url.path = [];
+      url.query = null;
+      url.fragment = null;
+      url.cannotBeABaseURL = false;
+      input = replace(input, LEADING_C0_CONTROL_OR_SPACE, '');
+      input = replace(input, TRAILING_C0_CONTROL_OR_SPACE, '$1');
+    }
+
+    input = replace(input, TAB_AND_NEW_LINE, '');
+
+    codePoints = arrayFrom(input);
+
+    while (pointer <= codePoints.length) {
+      chr = codePoints[pointer];
+      switch (state) {
+        case SCHEME_START:
+          if (chr && exec(ALPHA, chr)) {
+            buffer += toLowerCase(chr);
+            state = SCHEME;
+          } else if (!stateOverride) {
+            state = NO_SCHEME;
+            continue;
+          } else return INVALID_SCHEME;
+          break;
+
+        case SCHEME:
+          if (chr && (exec(ALPHANUMERIC, chr) || chr === '+' || chr === '-' || chr === '.')) {
+            buffer += toLowerCase(chr);
+          } else if (chr === ':') {
+            if (stateOverride && (
+              (url.isSpecial() !== hasOwn(specialSchemes, buffer)) ||
+              (buffer === 'file' && (url.includesCredentials() || url.port !== null)) ||
+              (url.scheme === 'file' && !url.host)
+            )) return;
+            url.scheme = buffer;
+            if (stateOverride) {
+              if (url.isSpecial() && specialSchemes[url.scheme] === url.port) url.port = null;
+              return;
+            }
+            buffer = '';
+            if (url.scheme === 'file') {
+              state = FILE;
+            } else if (url.isSpecial() && base && base.scheme === url.scheme) {
+              state = SPECIAL_RELATIVE_OR_AUTHORITY;
+            } else if (url.isSpecial()) {
+              state = SPECIAL_AUTHORITY_SLASHES;
+            } else if (codePoints[pointer + 1] === '/') {
+              state = PATH_OR_AUTHORITY;
+              pointer++;
+            } else {
+              url.cannotBeABaseURL = true;
+              push(url.path, '');
+              state = CANNOT_BE_A_BASE_URL_PATH;
+            }
+          } else if (!stateOverride) {
+            buffer = '';
+            state = NO_SCHEME;
+            pointer = 0;
+            continue;
+          } else return INVALID_SCHEME;
+          break;
+
+        case NO_SCHEME:
+          if (!base || (base.cannotBeABaseURL && chr !== '#')) return INVALID_SCHEME;
+          if (base.cannotBeABaseURL && chr === '#') {
+            url.scheme = base.scheme;
+            url.path = arraySlice(base.path);
+            url.query = base.query;
+            url.fragment = '';
+            url.cannotBeABaseURL = true;
+            state = FRAGMENT;
+            break;
+          }
+          state = base.scheme === 'file' ? FILE : RELATIVE;
+          continue;
+
+        case SPECIAL_RELATIVE_OR_AUTHORITY:
+          if (chr === '/' && codePoints[pointer + 1] === '/') {
+            state = SPECIAL_AUTHORITY_IGNORE_SLASHES;
+            pointer++;
+          } else {
+            state = RELATIVE;
+            continue;
+          } break;
+
+        case PATH_OR_AUTHORITY:
+          if (chr === '/') {
+            state = AUTHORITY;
+            break;
+          } else {
+            state = PATH;
+            continue;
+          }
+
+        case RELATIVE:
+          url.scheme = base.scheme;
+          if (chr === EOF) {
+            url.username = base.username;
+            url.password = base.password;
+            url.host = base.host;
+            url.port = base.port;
+            url.path = arraySlice(base.path);
+            url.query = base.query;
+          } else if (chr === '/' || (chr === '\\' && url.isSpecial())) {
+            state = RELATIVE_SLASH;
+          } else if (chr === '?') {
+            url.username = base.username;
+            url.password = base.password;
+            url.host = base.host;
+            url.port = base.port;
+            url.path = arraySlice(base.path);
+            url.query = '';
+            state = QUERY;
+          } else if (chr === '#') {
+            url.username = base.username;
+            url.password = base.password;
+            url.host = base.host;
+            url.port = base.port;
+            url.path = arraySlice(base.path);
+            url.query = base.query;
+            url.fragment = '';
+            state = FRAGMENT;
+          } else {
+            url.username = base.username;
+            url.password = base.password;
+            url.host = base.host;
+            url.port = base.port;
+            url.path = arraySlice(base.path);
+            url.path.length--;
+            state = PATH;
+            continue;
+          } break;
+
+        case RELATIVE_SLASH:
+          if (url.isSpecial() && (chr === '/' || chr === '\\')) {
+            state = SPECIAL_AUTHORITY_IGNORE_SLASHES;
+          } else if (chr === '/') {
+            state = AUTHORITY;
+          } else {
+            url.username = base.username;
+            url.password = base.password;
+            url.host = base.host;
+            url.port = base.port;
+            state = PATH;
+            continue;
+          } break;
+
+        case SPECIAL_AUTHORITY_SLASHES:
+          state = SPECIAL_AUTHORITY_IGNORE_SLASHES;
+          if (chr !== '/' || charAt(buffer, pointer + 1) !== '/') continue;
+          pointer++;
+          break;
+
+        case SPECIAL_AUTHORITY_IGNORE_SLASHES:
+          if (chr !== '/' && chr !== '\\') {
+            state = AUTHORITY;
+            continue;
+          } break;
+
+        case AUTHORITY:
+          if (chr === '@') {
+            if (seenAt) buffer = '%40' + buffer;
+            seenAt = true;
+            bufferCodePoints = arrayFrom(buffer);
+            for (var i = 0; i < bufferCodePoints.length; i++) {
+              var codePoint = bufferCodePoints[i];
+              if (codePoint === ':' && !seenPasswordToken) {
+                seenPasswordToken = true;
+                continue;
+              }
+              var encodedCodePoints = percentEncode(codePoint, userinfoPercentEncodeSet);
+              if (seenPasswordToken) url.password += encodedCodePoints;
+              else url.username += encodedCodePoints;
+            }
+            buffer = '';
+          } else if (
+            chr === EOF || chr === '/' || chr === '?' || chr === '#' ||
+            (chr === '\\' && url.isSpecial())
+          ) {
+            if (seenAt && buffer === '') return INVALID_AUTHORITY;
+            pointer -= arrayFrom(buffer).length + 1;
+            buffer = '';
+            state = HOST;
+          } else buffer += chr;
+          break;
+
+        case HOST:
+        case HOSTNAME:
+          if (stateOverride && url.scheme === 'file') {
+            state = FILE_HOST;
+            continue;
+          } else if (chr === ':' && !seenBracket) {
+            if (buffer === '') return INVALID_HOST;
+            failure = url.parseHost(buffer);
+            if (failure) return failure;
+            buffer = '';
+            state = PORT;
+            if (stateOverride === HOSTNAME) return;
+          } else if (
+            chr === EOF || chr === '/' || chr === '?' || chr === '#' ||
+            (chr === '\\' && url.isSpecial())
+          ) {
+            if (url.isSpecial() && buffer === '') return INVALID_HOST;
+            if (stateOverride && buffer === '' && (url.includesCredentials() || url.port !== null)) return;
+            failure = url.parseHost(buffer);
+            if (failure) return failure;
+            buffer = '';
+            state = PATH_START;
+            if (stateOverride) return;
+            continue;
+          } else {
+            if (chr === '[') seenBracket = true;
+            else if (chr === ']') seenBracket = false;
+            buffer += chr;
+          } break;
+
+        case PORT:
+          if (exec(DIGIT, chr)) {
+            buffer += chr;
+          } else if (
+            chr === EOF || chr === '/' || chr === '?' || chr === '#' ||
+            (chr === '\\' && url.isSpecial()) ||
+            stateOverride
+          ) {
+            if (buffer !== '') {
+              var port = parseInt(buffer, 10);
+              if (port > 0xFFFF) return INVALID_PORT;
+              url.port = (url.isSpecial() && port === specialSchemes[url.scheme]) ? null : port;
+              buffer = '';
+            }
+            if (stateOverride) return;
+            state = PATH_START;
+            continue;
+          } else return INVALID_PORT;
+          break;
+
+        case FILE:
+          url.scheme = 'file';
+          if (chr === '/' || chr === '\\') state = FILE_SLASH;
+          else if (base && base.scheme === 'file') {
+            switch (chr) {
+              case EOF:
+                url.host = base.host;
+                url.path = arraySlice(base.path);
+                url.query = base.query;
+                break;
+              case '?':
+                url.host = base.host;
+                url.path = arraySlice(base.path);
+                url.query = '';
+                state = QUERY;
+                break;
+              case '#':
+                url.host = base.host;
+                url.path = arraySlice(base.path);
+                url.query = base.query;
+                url.fragment = '';
+                state = FRAGMENT;
+                break;
+              default:
+                if (!startsWithWindowsDriveLetter(join(arraySlice(codePoints, pointer), ''))) {
+                  url.host = base.host;
+                  url.path = arraySlice(base.path);
+                  url.shortenPath();
+                }
+                state = PATH;
+                continue;
+            }
+          } else {
+            state = PATH;
+            continue;
+          } break;
+
+        case FILE_SLASH:
+          if (chr === '/' || chr === '\\') {
+            state = FILE_HOST;
+            break;
+          }
+          if (base && base.scheme === 'file' && !startsWithWindowsDriveLetter(join(arraySlice(codePoints, pointer), ''))) {
+            if (isWindowsDriveLetter(base.path[0], true)) push(url.path, base.path[0]);
+            else url.host = base.host;
+          }
+          state = PATH;
+          continue;
+
+        case FILE_HOST:
+          if (chr === EOF || chr === '/' || chr === '\\' || chr === '?' || chr === '#') {
+            if (!stateOverride && isWindowsDriveLetter(buffer)) {
+              state = PATH;
+            } else if (buffer === '') {
+              url.host = '';
+              if (stateOverride) return;
+              state = PATH_START;
+            } else {
+              failure = url.parseHost(buffer);
+              if (failure) return failure;
+              if (url.host === 'localhost') url.host = '';
+              if (stateOverride) return;
+              buffer = '';
+              state = PATH_START;
+            } continue;
+          } else buffer += chr;
+          break;
+
+        case PATH_START:
+          if (url.isSpecial()) {
+            state = PATH;
+            if (chr !== '/' && chr !== '\\') continue;
+          } else if (!stateOverride && chr === '?') {
+            url.query = '';
+            state = QUERY;
+          } else if (!stateOverride && chr === '#') {
+            url.fragment = '';
+            state = FRAGMENT;
+          } else if (chr !== EOF) {
+            state = PATH;
+            if (chr !== '/') continue;
+          } break;
+
+        case PATH:
+          if (
+            chr === EOF || chr === '/' ||
+            (chr === '\\' && url.isSpecial()) ||
+            (!stateOverride && (chr === '?' || chr === '#'))
+          ) {
+            if (isDoubleDot(buffer)) {
+              url.shortenPath();
+              if (chr !== '/' && !(chr === '\\' && url.isSpecial())) {
+                push(url.path, '');
+              }
+            } else if (isSingleDot(buffer)) {
+              if (chr !== '/' && !(chr === '\\' && url.isSpecial())) {
+                push(url.path, '');
+              }
+            } else {
+              if (url.scheme === 'file' && !url.path.length && isWindowsDriveLetter(buffer)) {
+                if (url.host) url.host = '';
+                buffer = charAt(buffer, 0) + ':'; // normalize windows drive letter
+              }
+              push(url.path, buffer);
+            }
+            buffer = '';
+            if (url.scheme === 'file' && (chr === EOF || chr === '?' || chr === '#')) {
+              while (url.path.length > 1 && url.path[0] === '') {
+                shift(url.path);
+              }
+            }
+            if (chr === '?') {
+              url.query = '';
+              state = QUERY;
+            } else if (chr === '#') {
+              url.fragment = '';
+              state = FRAGMENT;
+            }
+          } else {
+            buffer += percentEncode(chr, pathPercentEncodeSet);
+          } break;
+
+        case CANNOT_BE_A_BASE_URL_PATH:
+          if (chr === '?') {
+            url.query = '';
+            state = QUERY;
+          } else if (chr === '#') {
+            url.fragment = '';
+            state = FRAGMENT;
+          } else if (chr !== EOF) {
+            url.path[0] += percentEncode(chr, C0ControlPercentEncodeSet);
+          } break;
+
+        case QUERY:
+          if (!stateOverride && chr === '#') {
+            url.fragment = '';
+            state = FRAGMENT;
+          } else if (chr !== EOF) {
+            if (chr === "'" && url.isSpecial()) url.query += '%27';
+            else if (chr === '#') url.query += '%23';
+            else url.query += percentEncode(chr, C0ControlPercentEncodeSet);
+          } break;
+
+        case FRAGMENT:
+          if (chr !== EOF) url.fragment += percentEncode(chr, fragmentPercentEncodeSet);
+          break;
+      }
+
+      pointer++;
+    }
+  },
+  // https://url.spec.whatwg.org/#host-parsing
+  parseHost: function (input) {
+    var result, codePoints, index;
+    if (charAt(input, 0) === '[') {
+      if (charAt(input, input.length - 1) !== ']') return INVALID_HOST;
+      result = parseIPv6(stringSlice(input, 1, -1));
+      if (!result) return INVALID_HOST;
+      this.host = result;
+    // opaque host
+    } else if (!this.isSpecial()) {
+      if (exec(FORBIDDEN_HOST_CODE_POINT_EXCLUDING_PERCENT, input)) return INVALID_HOST;
+      result = '';
+      codePoints = arrayFrom(input);
+      for (index = 0; index < codePoints.length; index++) {
+        result += percentEncode(codePoints[index], C0ControlPercentEncodeSet);
+      }
+      this.host = result;
+    } else {
+      input = toASCII(input);
+      if (exec(FORBIDDEN_HOST_CODE_POINT, input)) return INVALID_HOST;
+      result = parseIPv4(input);
+      if (result === null) return INVALID_HOST;
+      this.host = result;
+    }
+  },
+  // https://url.spec.whatwg.org/#cannot-have-a-username-password-port
+  cannotHaveUsernamePasswordPort: function () {
+    return !this.host || this.cannotBeABaseURL || this.scheme === 'file';
+  },
+  // https://url.spec.whatwg.org/#include-credentials
+  includesCredentials: function () {
+    return this.username !== '' || this.password !== '';
+  },
+  // https://url.spec.whatwg.org/#is-special
+  isSpecial: function () {
+    return hasOwn(specialSchemes, this.scheme);
+  },
+  // https://url.spec.whatwg.org/#shorten-a-urls-path
+  shortenPath: function () {
+    var path = this.path;
+    var pathSize = path.length;
+    if (pathSize && (this.scheme !== 'file' || pathSize !== 1 || !isWindowsDriveLetter(path[0], true))) {
+      path.length--;
+    }
+  },
+  // https://url.spec.whatwg.org/#concept-url-serializer
+  serialize: function () {
+    var url = this;
+    var scheme = url.scheme;
+    var username = url.username;
+    var password = url.password;
+    var host = url.host;
+    var port = url.port;
+    var path = url.path;
+    var query = url.query;
+    var fragment = url.fragment;
+    var output = scheme + ':';
+    if (host !== null) {
+      output += '//';
+      if (url.includesCredentials()) {
+        output += username + (password ? ':' + password : '') + '@';
+      }
+      output += serializeHost(host);
+      if (port !== null) output += ':' + port;
+    } else if (scheme === 'file') output += '//';
+    output += url.cannotBeABaseURL ? path[0] : path.length ? '/' + join(path, '/') : '';
+    if (query !== null) output += '?' + query;
+    if (fragment !== null) output += '#' + fragment;
+    return output;
+  },
+  // https://url.spec.whatwg.org/#dom-url-href
+  setHref: function (href) {
+    var failure = this.parse(href);
+    if (failure) throw new TypeError(failure);
+    this.searchParams.update();
+  },
+  // https://url.spec.whatwg.org/#dom-url-origin
+  getOrigin: function () {
+    var scheme = this.scheme;
+    var port = this.port;
+    if (scheme === 'blob') try {
+      return new URLConstructor(scheme.path[0]).origin;
+    } catch (error) {
+      return 'null';
+    }
+    if (scheme === 'file' || !this.isSpecial()) return 'null';
+    return scheme + '://' + serializeHost(this.host) + (port !== null ? ':' + port : '');
+  },
+  // https://url.spec.whatwg.org/#dom-url-protocol
+  getProtocol: function () {
+    return this.scheme + ':';
+  },
+  setProtocol: function (protocol) {
+    this.parse($toString(protocol) + ':', SCHEME_START);
+  },
+  // https://url.spec.whatwg.org/#dom-url-username
+  getUsername: function () {
+    return this.username;
+  },
+  setUsername: function (username) {
+    var codePoints = arrayFrom($toString(username));
+    if (this.cannotHaveUsernamePasswordPort()) return;
+    this.username = '';
+    for (var i = 0; i < codePoints.length; i++) {
+      this.username += percentEncode(codePoints[i], userinfoPercentEncodeSet);
+    }
+  },
+  // https://url.spec.whatwg.org/#dom-url-password
+  getPassword: function () {
+    return this.password;
+  },
+  setPassword: function (password) {
+    var codePoints = arrayFrom($toString(password));
+    if (this.cannotHaveUsernamePasswordPort()) return;
+    this.password = '';
+    for (var i = 0; i < codePoints.length; i++) {
+      this.password += percentEncode(codePoints[i], userinfoPercentEncodeSet);
+    }
+  },
+  // https://url.spec.whatwg.org/#dom-url-host
+  getHost: function () {
+    var host = this.host;
+    var port = this.port;
+    return host === null ? ''
+      : port === null ? serializeHost(host)
+      : serializeHost(host) + ':' + port;
+  },
+  setHost: function (host) {
+    if (this.cannotBeABaseURL) return;
+    this.parse(host, HOST);
+  },
+  // https://url.spec.whatwg.org/#dom-url-hostname
+  getHostname: function () {
+    var host = this.host;
+    return host === null ? '' : serializeHost(host);
+  },
+  setHostname: function (hostname) {
+    if (this.cannotBeABaseURL) return;
+    this.parse(hostname, HOSTNAME);
+  },
+  // https://url.spec.whatwg.org/#dom-url-port
+  getPort: function () {
+    var port = this.port;
+    return port === null ? '' : $toString(port);
+  },
+  setPort: function (port) {
+    if (this.cannotHaveUsernamePasswordPort()) return;
+    port = $toString(port);
+    if (port === '') this.port = null;
+    else this.parse(port, PORT);
+  },
+  // https://url.spec.whatwg.org/#dom-url-pathname
+  getPathname: function () {
+    var path = this.path;
+    return this.cannotBeABaseURL ? path[0] : path.length ? '/' + join(path, '/') : '';
+  },
+  setPathname: function (pathname) {
+    if (this.cannotBeABaseURL) return;
+    this.path = [];
+    this.parse(pathname, PATH_START);
+  },
+  // https://url.spec.whatwg.org/#dom-url-search
+  getSearch: function () {
+    var query = this.query;
+    return query ? '?' + query : '';
+  },
+  setSearch: function (search) {
+    search = $toString(search);
+    if (search === '') {
+      this.query = null;
+    } else {
+      if (charAt(search, 0) === '?') search = stringSlice(search, 1);
+      this.query = '';
+      this.parse(search, QUERY);
+    }
+    this.searchParams.update();
+  },
+  // https://url.spec.whatwg.org/#dom-url-searchparams
+  getSearchParams: function () {
+    return this.searchParams.facade;
+  },
+  // https://url.spec.whatwg.org/#dom-url-hash
+  getHash: function () {
+    var fragment = this.fragment;
+    return fragment ? '#' + fragment : '';
+  },
+  setHash: function (hash) {
+    hash = $toString(hash);
+    if (hash === '') {
+      this.fragment = null;
+      return;
+    }
+    if (charAt(hash, 0) === '#') hash = stringSlice(hash, 1);
+    this.fragment = '';
+    this.parse(hash, FRAGMENT);
+  },
+  update: function () {
+    this.query = this.searchParams.serialize() || null;
+  }
+};
+
+// `URL` constructor
+// https://url.spec.whatwg.org/#url-class
+var URLConstructor = function URL(url /* , base */) {
+  var that = anInstance(this, URLPrototype);
+  var base = validateArgumentsLength(arguments.length, 1) > 1 ? arguments[1] : undefined;
+  var state = setInternalState(that, new URLState(url, false, base));
+  if (!DESCRIPTORS) {
+    that.href = state.serialize();
+    that.origin = state.getOrigin();
+    that.protocol = state.getProtocol();
+    that.username = state.getUsername();
+    that.password = state.getPassword();
+    that.host = state.getHost();
+    that.hostname = state.getHostname();
+    that.port = state.getPort();
+    that.pathname = state.getPathname();
+    that.search = state.getSearch();
+    that.searchParams = state.getSearchParams();
+    that.hash = state.getHash();
+  }
+};
+
+var URLPrototype = URLConstructor.prototype;
+
+var accessorDescriptor = function (getter, setter) {
+  return {
+    get: function () {
+      return getInternalURLState(this)[getter]();
+    },
+    set: setter && function (value) {
+      return getInternalURLState(this)[setter](value);
+    },
+    configurable: true,
+    enumerable: true
+  };
+};
+
+if (DESCRIPTORS) {
+  // `URL.prototype.href` accessors pair
+  // https://url.spec.whatwg.org/#dom-url-href
+  defineBuiltInAccessor(URLPrototype, 'href', accessorDescriptor('serialize', 'setHref'));
+  // `URL.prototype.origin` getter
+  // https://url.spec.whatwg.org/#dom-url-origin
+  defineBuiltInAccessor(URLPrototype, 'origin', accessorDescriptor('getOrigin'));
+  // `URL.prototype.protocol` accessors pair
+  // https://url.spec.whatwg.org/#dom-url-protocol
+  defineBuiltInAccessor(URLPrototype, 'protocol', accessorDescriptor('getProtocol', 'setProtocol'));
+  // `URL.prototype.username` accessors pair
+  // https://url.spec.whatwg.org/#dom-url-username
+  defineBuiltInAccessor(URLPrototype, 'username', accessorDescriptor('getUsername', 'setUsername'));
+  // `URL.prototype.password` accessors pair
+  // https://url.spec.whatwg.org/#dom-url-password
+  defineBuiltInAccessor(URLPrototype, 'password', accessorDescriptor('getPassword', 'setPassword'));
+  // `URL.prototype.host` accessors pair
+  // https://url.spec.whatwg.org/#dom-url-host
+  defineBuiltInAccessor(URLPrototype, 'host', accessorDescriptor('getHost', 'setHost'));
+  // `URL.prototype.hostname` accessors pair
+  // https://url.spec.whatwg.org/#dom-url-hostname
+  defineBuiltInAccessor(URLPrototype, 'hostname', accessorDescriptor('getHostname', 'setHostname'));
+  // `URL.prototype.port` accessors pair
+  // https://url.spec.whatwg.org/#dom-url-port
+  defineBuiltInAccessor(URLPrototype, 'port', accessorDescriptor('getPort', 'setPort'));
+  // `URL.prototype.pathname` accessors pair
+  // https://url.spec.whatwg.org/#dom-url-pathname
+  defineBuiltInAccessor(URLPrototype, 'pathname', accessorDescriptor('getPathname', 'setPathname'));
+  // `URL.prototype.search` accessors pair
+  // https://url.spec.whatwg.org/#dom-url-search
+  defineBuiltInAccessor(URLPrototype, 'search', accessorDescriptor('getSearch', 'setSearch'));
+  // `URL.prototype.searchParams` getter
+  // https://url.spec.whatwg.org/#dom-url-searchparams
+  defineBuiltInAccessor(URLPrototype, 'searchParams', accessorDescriptor('getSearchParams'));
+  // `URL.prototype.hash` accessors pair
+  // https://url.spec.whatwg.org/#dom-url-hash
+  defineBuiltInAccessor(URLPrototype, 'hash', accessorDescriptor('getHash', 'setHash'));
+}
+
+// `URL.prototype.toJSON` method
+// https://url.spec.whatwg.org/#dom-url-tojson
+defineBuiltIn(URLPrototype, 'toJSON', function toJSON() {
+  return getInternalURLState(this).serialize();
+}, { enumerable: true });
+
+// `URL.prototype.toString` method
+// https://url.spec.whatwg.org/#URL-stringification-behavior
+defineBuiltIn(URLPrototype, 'toString', function toString() {
+  return getInternalURLState(this).serialize();
+}, { enumerable: true });
+
+if (NativeURL) {
+  var nativeCreateObjectURL = NativeURL.createObjectURL;
+  var nativeRevokeObjectURL = NativeURL.revokeObjectURL;
+  // `URL.createObjectURL` method
+  // https://developer.mozilla.org/en-US/docs/Web/API/URL/createObjectURL
+  if (nativeCreateObjectURL) defineBuiltIn(URLConstructor, 'createObjectURL', bind(nativeCreateObjectURL, NativeURL));
+  // `URL.revokeObjectURL` method
+  // https://developer.mozilla.org/en-US/docs/Web/API/URL/revokeObjectURL
+  if (nativeRevokeObjectURL) defineBuiltIn(URLConstructor, 'revokeObjectURL', bind(nativeRevokeObjectURL, NativeURL));
+}
+
+setToStringTag(URLConstructor, 'URL');
+
+$({ global: true, constructor: true, forced: !USE_NATIVE_URL, sham: !DESCRIPTORS }, {
+  URL: URLConstructor
+});
diff --git a/ddb_main/node_modules/core-js/modules/web.url.js b/ddb_main/node_modules/core-js/modules/web.url.js
new file mode 100644
index 0000000..5ec16d1
--- /dev/null
+++ b/ddb_main/node_modules/core-js/modules/web.url.js
@@ -0,0 +1,3 @@
+'use strict';
+// TODO: Remove this module from `core-js@4` since it's replaced to module below
+require('../modules/web.url.constructor');
diff --git a/ddb_main/node_modules/core-js/modules/web.url.to-json.js b/ddb_main/node_modules/core-js/modules/web.url.to-json.js
new file mode 100644
index 0000000..f4f41c3
--- /dev/null
+++ b/ddb_main/node_modules/core-js/modules/web.url.to-json.js
@@ -0,0 +1,11 @@
+'use strict';
+var $ = require('../internals/export');
+var call = require('../internals/function-call');
+
+// `URL.prototype.toJSON` method
+// https://url.spec.whatwg.org/#dom-url-tojson
+$({ target: 'URL', proto: true, enumerable: true }, {
+  toJSON: function toJSON() {
+    return call(URL.prototype.toString, this);
+  }
+});
diff --git a/ddb_main/node_modules/css-vendor/dist/css-vendor.esm.js b/ddb_main/node_modules/css-vendor/dist/css-vendor.esm.js
new file mode 100644
index 0000000..ed0b0dc
--- /dev/null
+++ b/ddb_main/node_modules/css-vendor/dist/css-vendor.esm.js
@@ -0,0 +1,573 @@
+import isInBrowser from 'is-in-browser';
+import _toConsumableArray from '@babel/runtime/helpers/esm/toConsumableArray';
+
+// Export javascript style and css style vendor prefixes.
+var js = '';
+var css = '';
+var vendor = '';
+var browser = '';
+var isTouch = isInBrowser && 'ontouchstart' in document.documentElement; // We should not do anything if required serverside.
+
+if (isInBrowser) {
+  // Order matters. We need to check Webkit the last one because
+  // other vendors use to add Webkit prefixes to some properties
+  var jsCssMap = {
+    Moz: '-moz-',
+    ms: '-ms-',
+    O: '-o-',
+    Webkit: '-webkit-'
+  };
+
+  var _document$createEleme = document.createElement('p'),
+      style = _document$createEleme.style;
+
+  var testProp = 'Transform';
+
+  for (var key in jsCssMap) {
+    if (key + testProp in style) {
+      js = key;
+      css = jsCssMap[key];
+      break;
+    }
+  } // Correctly detect the Edge browser.
+
+
+  if (js === 'Webkit' && 'msHyphens' in style) {
+    js = 'ms';
+    css = jsCssMap.ms;
+    browser = 'edge';
+  } // Correctly detect the Safari browser.
+
+
+  if (js === 'Webkit' && '-apple-trailing-word' in style) {
+    vendor = 'apple';
+  }
+}
+/**
+ * Vendor prefix string for the current browser.
+ *
+ * @type {{js: String, css: String, vendor: String, browser: String}}
+ * @api public
+ */
+
+
+var prefix = {
+  js: js,
+  css: css,
+  vendor: vendor,
+  browser: browser,
+  isTouch: isTouch
+};
+
+/**
+ * Test if a keyframe at-rule should be prefixed or not
+ *
+ * @param {String} vendor prefix string for the current browser.
+ * @return {String}
+ * @api public
+ */
+
+function supportedKeyframes(key) {
+  // Keyframes is already prefixed. e.g. key = '@-webkit-keyframes a'
+  if (key[1] === '-') return key; // No need to prefix IE/Edge. Older browsers will ignore unsupported rules.
+  // https://caniuse.com/#search=keyframes
+
+  if (prefix.js === 'ms') return key;
+  return "@" + prefix.css + "keyframes" + key.substr(10);
+}
+
+// https://caniuse.com/#search=appearance
+
+var appearence = {
+  noPrefill: ['appearance'],
+  supportedProperty: function supportedProperty(prop) {
+    if (prop !== 'appearance') return false;
+    if (prefix.js === 'ms') return "-webkit-" + prop;
+    return prefix.css + prop;
+  }
+};
+
+// https://caniuse.com/#search=color-adjust
+
+var colorAdjust = {
+  noPrefill: ['color-adjust'],
+  supportedProperty: function supportedProperty(prop) {
+    if (prop !== 'color-adjust') return false;
+    if (prefix.js === 'Webkit') return prefix.css + "print-" + prop;
+    return prop;
+  }
+};
+
+var regExp = /[-\s]+(.)?/g;
+/**
+ * Replaces the letter with the capital letter
+ *
+ * @param {String} match
+ * @param {String} c
+ * @return {String}
+ * @api private
+ */
+
+function toUpper(match, c) {
+  return c ? c.toUpperCase() : '';
+}
+/**
+ * Convert dash separated strings to camel-cased.
+ *
+ * @param {String} str
+ * @return {String}
+ * @api private
+ */
+
+
+function camelize(str) {
+  return str.replace(regExp, toUpper);
+}
+
+/**
+ * Convert dash separated strings to pascal cased.
+ *
+ * @param {String} str
+ * @return {String}
+ * @api private
+ */
+
+function pascalize(str) {
+  return camelize("-" + str);
+}
+
+// but we can use a longhand property instead.
+// https://caniuse.com/#search=mask
+
+var mask = {
+  noPrefill: ['mask'],
+  supportedProperty: function supportedProperty(prop, style) {
+    if (!/^mask/.test(prop)) return false;
+
+    if (prefix.js === 'Webkit') {
+      var longhand = 'mask-image';
+
+      if (camelize(longhand) in style) {
+        return prop;
+      }
+
+      if (prefix.js + pascalize(longhand) in style) {
+        return prefix.css + prop;
+      }
+    }
+
+    return prop;
+  }
+};
+
+// https://caniuse.com/#search=text-orientation
+
+var textOrientation = {
+  noPrefill: ['text-orientation'],
+  supportedProperty: function supportedProperty(prop) {
+    if (prop !== 'text-orientation') return false;
+
+    if (prefix.vendor === 'apple' && !prefix.isTouch) {
+      return prefix.css + prop;
+    }
+
+    return prop;
+  }
+};
+
+// https://caniuse.com/#search=transform
+
+var transform = {
+  noPrefill: ['transform'],
+  supportedProperty: function supportedProperty(prop, style, options) {
+    if (prop !== 'transform') return false;
+
+    if (options.transform) {
+      return prop;
+    }
+
+    return prefix.css + prop;
+  }
+};
+
+// https://caniuse.com/#search=transition
+
+var transition = {
+  noPrefill: ['transition'],
+  supportedProperty: function supportedProperty(prop, style, options) {
+    if (prop !== 'transition') return false;
+
+    if (options.transition) {
+      return prop;
+    }
+
+    return prefix.css + prop;
+  }
+};
+
+// https://caniuse.com/#search=writing-mode
+
+var writingMode = {
+  noPrefill: ['writing-mode'],
+  supportedProperty: function supportedProperty(prop) {
+    if (prop !== 'writing-mode') return false;
+
+    if (prefix.js === 'Webkit' || prefix.js === 'ms' && prefix.browser !== 'edge') {
+      return prefix.css + prop;
+    }
+
+    return prop;
+  }
+};
+
+// https://caniuse.com/#search=user-select
+
+var userSelect = {
+  noPrefill: ['user-select'],
+  supportedProperty: function supportedProperty(prop) {
+    if (prop !== 'user-select') return false;
+
+    if (prefix.js === 'Moz' || prefix.js === 'ms' || prefix.vendor === 'apple') {
+      return prefix.css + prop;
+    }
+
+    return prop;
+  }
+};
+
+// https://caniuse.com/#search=multicolumn
+// https://github.com/postcss/autoprefixer/issues/491
+// https://github.com/postcss/autoprefixer/issues/177
+
+var breakPropsOld = {
+  supportedProperty: function supportedProperty(prop, style) {
+    if (!/^break-/.test(prop)) return false;
+
+    if (prefix.js === 'Webkit') {
+      var jsProp = "WebkitColumn" + pascalize(prop);
+      return jsProp in style ? prefix.css + "column-" + prop : false;
+    }
+
+    if (prefix.js === 'Moz') {
+      var _jsProp = "page" + pascalize(prop);
+
+      return _jsProp in style ? "page-" + prop : false;
+    }
+
+    return false;
+  }
+};
+
+// See https://github.com/postcss/autoprefixer/issues/324.
+
+var inlineLogicalOld = {
+  supportedProperty: function supportedProperty(prop, style) {
+    if (!/^(border|margin|padding)-inline/.test(prop)) return false;
+    if (prefix.js === 'Moz') return prop;
+    var newProp = prop.replace('-inline', '');
+    return prefix.js + pascalize(newProp) in style ? prefix.css + newProp : false;
+  }
+};
+
+// Camelization is required because we can't test using.
+// CSS syntax for e.g. in FF.
+
+var unprefixed = {
+  supportedProperty: function supportedProperty(prop, style) {
+    return camelize(prop) in style ? prop : false;
+  }
+};
+
+var prefixed = {
+  supportedProperty: function supportedProperty(prop, style) {
+    var pascalized = pascalize(prop); // Return custom CSS variable without prefixing.
+
+    if (prop[0] === '-') return prop; // Return already prefixed value without prefixing.
+
+    if (prop[0] === '-' && prop[1] === '-') return prop;
+    if (prefix.js + pascalized in style) return prefix.css + prop; // Try webkit fallback.
+
+    if (prefix.js !== 'Webkit' && "Webkit" + pascalized in style) return "-webkit-" + prop;
+    return false;
+  }
+};
+
+// https://caniuse.com/#search=scroll-snap
+
+var scrollSnap = {
+  supportedProperty: function supportedProperty(prop) {
+    if (prop.substring(0, 11) !== 'scroll-snap') return false;
+
+    if (prefix.js === 'ms') {
+      return "" + prefix.css + prop;
+    }
+
+    return prop;
+  }
+};
+
+// https://caniuse.com/#search=overscroll-behavior
+
+var overscrollBehavior = {
+  supportedProperty: function supportedProperty(prop) {
+    if (prop !== 'overscroll-behavior') return false;
+
+    if (prefix.js === 'ms') {
+      return prefix.css + "scroll-chaining";
+    }
+
+    return prop;
+  }
+};
+
+var propMap = {
+  'flex-grow': 'flex-positive',
+  'flex-shrink': 'flex-negative',
+  'flex-basis': 'flex-preferred-size',
+  'justify-content': 'flex-pack',
+  order: 'flex-order',
+  'align-items': 'flex-align',
+  'align-content': 'flex-line-pack' // 'align-self' is handled by 'align-self' plugin.
+
+}; // Support old flex spec from 2012.
+
+var flex2012 = {
+  supportedProperty: function supportedProperty(prop, style) {
+    var newProp = propMap[prop];
+    if (!newProp) return false;
+    return prefix.js + pascalize(newProp) in style ? prefix.css + newProp : false;
+  }
+};
+
+var propMap$1 = {
+  flex: 'box-flex',
+  'flex-grow': 'box-flex',
+  'flex-direction': ['box-orient', 'box-direction'],
+  order: 'box-ordinal-group',
+  'align-items': 'box-align',
+  'flex-flow': ['box-orient', 'box-direction'],
+  'justify-content': 'box-pack'
+};
+var propKeys = Object.keys(propMap$1);
+
+var prefixCss = function prefixCss(p) {
+  return prefix.css + p;
+}; // Support old flex spec from 2009.
+
+
+var flex2009 = {
+  supportedProperty: function supportedProperty(prop, style, _ref) {
+    var multiple = _ref.multiple;
+
+    if (propKeys.indexOf(prop) > -1) {
+      var newProp = propMap$1[prop];
+
+      if (!Array.isArray(newProp)) {
+        return prefix.js + pascalize(newProp) in style ? prefix.css + newProp : false;
+      }
+
+      if (!multiple) return false;
+
+      for (var i = 0; i < newProp.length; i++) {
+        if (!(prefix.js + pascalize(newProp[0]) in style)) {
+          return false;
+        }
+      }
+
+      return newProp.map(prefixCss);
+    }
+
+    return false;
+  }
+};
+
+// plugins = [
+//   ...plugins,
+//    breakPropsOld,
+//    inlineLogicalOld,
+//    unprefixed,
+//    prefixed,
+//    scrollSnap,
+//    flex2012,
+//    flex2009
+// ]
+// Plugins without 'noPrefill' value, going last.
+// 'flex-*' plugins should be at the bottom.
+// 'flex2009' going after 'flex2012'.
+// 'prefixed' going after 'unprefixed'
+
+var plugins = [appearence, colorAdjust, mask, textOrientation, transform, transition, writingMode, userSelect, breakPropsOld, inlineLogicalOld, unprefixed, prefixed, scrollSnap, overscrollBehavior, flex2012, flex2009];
+var propertyDetectors = plugins.filter(function (p) {
+  return p.supportedProperty;
+}).map(function (p) {
+  return p.supportedProperty;
+});
+var noPrefill = plugins.filter(function (p) {
+  return p.noPrefill;
+}).reduce(function (a, p) {
+  a.push.apply(a, _toConsumableArray(p.noPrefill));
+  return a;
+}, []);
+
+var el;
+var cache = {};
+
+if (isInBrowser) {
+  el = document.createElement('p'); // We test every property on vendor prefix requirement.
+  // Once tested, result is cached. It gives us up to 70% perf boost.
+  // http://jsperf.com/element-style-object-access-vs-plain-object
+  //
+  // Prefill cache with known css properties to reduce amount of
+  // properties we need to feature test at runtime.
+  // http://davidwalsh.name/vendor-prefix
+
+  var computed = window.getComputedStyle(document.documentElement, '');
+
+  for (var key$1 in computed) {
+    // eslint-disable-next-line no-restricted-globals
+    if (!isNaN(key$1)) cache[computed[key$1]] = computed[key$1];
+  } // Properties that cannot be correctly detected using the
+  // cache prefill method.
+
+
+  noPrefill.forEach(function (x) {
+    return delete cache[x];
+  });
+}
+/**
+ * Test if a property is supported, returns supported property with vendor
+ * prefix if required. Returns `false` if not supported.
+ *
+ * @param {String} prop dash separated
+ * @param {Object} [options]
+ * @return {String|Boolean}
+ * @api public
+ */
+
+
+function supportedProperty(prop, options) {
+  if (options === void 0) {
+    options = {};
+  }
+
+  // For server-side rendering.
+  if (!el) return prop; // Remove cache for benchmark tests or return property from the cache.
+
+  if (process.env.NODE_ENV !== 'benchmark' && cache[prop] != null) {
+    return cache[prop];
+  } // Check if 'transition' or 'transform' natively supported in browser.
+
+
+  if (prop === 'transition' || prop === 'transform') {
+    options[prop] = prop in el.style;
+  } // Find a plugin for current prefix property.
+
+
+  for (var i = 0; i < propertyDetectors.length; i++) {
+    cache[prop] = propertyDetectors[i](prop, el.style, options); // Break loop, if value found.
+
+    if (cache[prop]) break;
+  } // Reset styles for current property.
+  // Firefox can even throw an error for invalid properties, e.g., "0".
+
+
+  try {
+    el.style[prop] = '';
+  } catch (err) {
+    return false;
+  }
+
+  return cache[prop];
+}
+
+var cache$1 = {};
+var transitionProperties = {
+  transition: 1,
+  'transition-property': 1,
+  '-webkit-transition': 1,
+  '-webkit-transition-property': 1
+};
+var transPropsRegExp = /(^\s*[\w-]+)|, (\s*[\w-]+)(?![^()]*\))/g;
+var el$1;
+/**
+ * Returns prefixed value transition/transform if needed.
+ *
+ * @param {String} match
+ * @param {String} p1
+ * @param {String} p2
+ * @return {String}
+ * @api private
+ */
+
+function prefixTransitionCallback(match, p1, p2) {
+  if (p1 === 'var') return 'var';
+  if (p1 === 'all') return 'all';
+  if (p2 === 'all') return ', all';
+  var prefixedValue = p1 ? supportedProperty(p1) : ", " + supportedProperty(p2);
+  if (!prefixedValue) return p1 || p2;
+  return prefixedValue;
+}
+
+if (isInBrowser) el$1 = document.createElement('p');
+/**
+ * Returns prefixed value if needed. Returns `false` if value is not supported.
+ *
+ * @param {String} property
+ * @param {String} value
+ * @return {String|Boolean}
+ * @api public
+ */
+
+function supportedValue(property, value) {
+  // For server-side rendering.
+  var prefixedValue = value;
+  if (!el$1 || property === 'content') return value; // It is a string or a number as a string like '1'.
+  // We want only prefixable values here.
+  // eslint-disable-next-line no-restricted-globals
+
+  if (typeof prefixedValue !== 'string' || !isNaN(parseInt(prefixedValue, 10))) {
+    return prefixedValue;
+  } // Create cache key for current value.
+
+
+  var cacheKey = property + prefixedValue; // Remove cache for benchmark tests or return value from cache.
+
+  if (process.env.NODE_ENV !== 'benchmark' && cache$1[cacheKey] != null) {
+    return cache$1[cacheKey];
+  } // IE can even throw an error in some cases, for e.g. style.content = 'bar'.
+
+
+  try {
+    // Test value as it is.
+    el$1.style[property] = prefixedValue;
+  } catch (err) {
+    // Return false if value not supported.
+    cache$1[cacheKey] = false;
+    return false;
+  } // If 'transition' or 'transition-property' property.
+
+
+  if (transitionProperties[property]) {
+    prefixedValue = prefixedValue.replace(transPropsRegExp, prefixTransitionCallback);
+  } else if (el$1.style[property] === '') {
+    // Value with a vendor prefix.
+    prefixedValue = prefix.css + prefixedValue; // Hardcode test to convert "flex" to "-ms-flexbox" for IE10.
+
+    if (prefixedValue === '-ms-flex') el$1.style[property] = '-ms-flexbox'; // Test prefixed value.
+
+    el$1.style[property] = prefixedValue; // Return false if value not supported.
+
+    if (el$1.style[property] === '') {
+      cache$1[cacheKey] = false;
+      return false;
+    }
+  } // Reset styles for current property.
+
+
+  el$1.style[property] = ''; // Write current value to cache.
+
+  cache$1[cacheKey] = prefixedValue;
+  return cache$1[cacheKey];
+}
+
+export { prefix, supportedKeyframes, supportedProperty, supportedValue };
diff --git a/ddb_main/node_modules/debounce/index.js b/ddb_main/node_modules/debounce/index.js
new file mode 100644
index 0000000..4f35c12
--- /dev/null
+++ b/ddb_main/node_modules/debounce/index.js
@@ -0,0 +1,70 @@
+/**
+ * Returns a function, that, as long as it continues to be invoked, will not
+ * be triggered. The function will be called after it stops being called for
+ * N milliseconds. If `immediate` is passed, trigger the function on the
+ * leading edge, instead of the trailing. The function also has a property 'clear' 
+ * that is a function which will clear the timer to prevent previously scheduled executions. 
+ *
+ * @source underscore.js
+ * @see http://unscriptable.com/2009/03/20/debouncing-javascript-methods/
+ * @param {Function} function to wrap
+ * @param {Number} timeout in ms (`100`)
+ * @param {Boolean} whether to execute at the beginning (`false`)
+ * @api public
+ */
+function debounce(func, wait, immediate){
+  var timeout, args, context, timestamp, result;
+  if (null == wait) wait = 100;
+
+  function later() {
+    var last = Date.now() - timestamp;
+
+    if (last < wait && last >= 0) {
+      timeout = setTimeout(later, wait - last);
+    } else {
+      timeout = null;
+      if (!immediate) {
+        result = func.apply(context, args);
+        context = args = null;
+      }
+    }
+  };
+
+  var debounced = function(){
+    context = this;
+    args = arguments;
+    timestamp = Date.now();
+    var callNow = immediate && !timeout;
+    if (!timeout) timeout = setTimeout(later, wait);
+    if (callNow) {
+      result = func.apply(context, args);
+      context = args = null;
+    }
+
+    return result;
+  };
+
+  debounced.clear = function() {
+    if (timeout) {
+      clearTimeout(timeout);
+      timeout = null;
+    }
+  };
+  
+  debounced.flush = function() {
+    if (timeout) {
+      result = func.apply(context, args);
+      context = args = null;
+      
+      clearTimeout(timeout);
+      timeout = null;
+    }
+  };
+
+  return debounced;
+};
+
+// Adds compatibility for ES modules
+debounce.debounce = debounce;
+
+module.exports = debounce;
diff --git a/ddb_main/node_modules/event-target-polyfill/index.js b/ddb_main/node_modules/event-target-polyfill/index.js
new file mode 100644
index 0000000..65bca3a
--- /dev/null
+++ b/ddb_main/node_modules/event-target-polyfill/index.js
@@ -0,0 +1,116 @@
+const root =
+  (typeof globalThis !== "undefined" && globalThis) ||
+  (typeof self !== "undefined" && self) ||
+  (typeof global !== "undefined" && global);
+
+if (typeof root.Event === "undefined") {
+  root.Event = (function () {
+    function Event(type, options) {
+      if (options) {
+        for (let key of options) {
+          if (options.hasOwnProperty(key)) {
+            this[key] = options[key];
+          }
+        }
+      }
+      this.type = type;
+    }
+
+    return Event;
+  })();
+}
+
+if (typeof root.EventTarget === "undefined") {
+  root.EventTarget = (function () {
+    function EventTarget() {
+      this.__listeners = new Map();
+    }
+
+    EventTarget.prototype = Object.create(Object.prototype);
+
+    EventTarget.prototype.addEventListener = function (
+      type,
+      listener,
+      options
+    ) {
+      if (arguments.length < 2) {
+        throw new TypeError(
+          `TypeError: Failed to execute 'addEventListener' on 'EventTarget': 2 arguments required, but only ${arguments.length} present.`
+        );
+      }
+      const __listeners = this.__listeners;
+      const actualType = type.toString();
+      if (!__listeners.has(actualType)) {
+        __listeners.set(actualType, new Map());
+      }
+      const listenersForType = __listeners.get(actualType);
+      if (!listenersForType.has(listener)) {
+        // Any given listener is only registered once
+        listenersForType.set(listener, options);
+      }
+    };
+
+    EventTarget.prototype.removeEventListener = function (
+      type,
+      listener,
+      _options
+    ) {
+      if (arguments.length < 2) {
+        throw new TypeError(
+          `TypeError: Failed to execute 'addEventListener' on 'EventTarget': 2 arguments required, but only ${arguments.length} present.`
+        );
+      }
+      const __listeners = this.__listeners;
+      const actualType = type.toString();
+      if (__listeners.has(actualType)) {
+        const listenersForType = __listeners.get(actualType);
+        if (listenersForType.has(listener)) {
+          listenersForType.delete(listener);
+        }
+      }
+    };
+
+    EventTarget.prototype.dispatchEvent = function (event) {
+      if (!(event instanceof Event)) {
+        throw new TypeError(
+          `Failed to execute 'dispatchEvent' on 'EventTarget': parameter 1 is not of type 'Event'.`
+        );
+      }
+      const type = event.type;
+      const __listeners = this.__listeners;
+      const listenersForType = __listeners.get(type);
+      if (listenersForType) {
+        for (const [listener, options] of listenersForType.entries()) {
+          try {
+            if (typeof listener === "function") {
+              // Listener functions must be executed with the EventTarget as the `this` context.
+              listener.call(this, event);
+            } else if (listener && typeof listener.handleEvent === "function") {
+              // Listener objects have their handleEvent method called, if they have one
+              listener.handleEvent(event);
+            }
+          } catch (err) {
+            // We need to report the error to the global error handling event,
+            // but we do not want to break the loop that is executing the events.
+            // Unfortunately, this is the best we can do, which isn't great, because the
+            // native EventTarget will actually do this synchronously before moving to the next
+            // event in the loop.
+            setTimeout(() => {
+              throw err;
+            });
+          }
+          if (options && options.once) {
+            // If this was registered with { once: true }, we need
+            // to remove it now.
+            listenersForType.delete(listener);
+          }
+        }
+      }
+      // Since there are no cancellable events on a base EventTarget,
+      // this should always return true.
+      return true;
+    };
+
+    return EventTarget;
+  })();
+}
diff --git a/ddb_main/node_modules/evt/src/lib/Ctx.ts b/ddb_main/node_modules/evt/src/lib/Ctx.ts
new file mode 100644
index 0000000..809d03c
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Ctx.ts
@@ -0,0 +1,181 @@
+import { Polyfill as Set } from "minimal-polyfills/Set";
+import { Polyfill as WeakMap } from "minimal-polyfills/WeakMap";
+import { assert } from "../tools/typeSafety/assert";
+import { typeGuard } from "../tools/typeSafety/typeGuard";
+import { LazyEvt } from "./LazyEvt";
+import { importProxy } from "./importProxy";
+import type { Handler } from "./types/Handler";
+import { defineAccessors } from "../tools/typeSafety/defineAccessors";
+import { overwriteReadonlyProp } from "../tools/typeSafety/overwriteReadonlyProp";
+
+type EvtLike<T> = import("./types/helper/UnpackEvt").EvtLike<T>;
+type Evt<T> = import("./types/interfaces").Evt<T>;
+type CtxLike<T> = import("./types/interfaces").CtxLike<T>;
+type DoneOrAborted<Result> = import("./types/interfaces/Ctx").DoneOrAborted<Result>;
+
+export type Ctx<Result> = import("./types/interfaces").Ctx<Result>;
+
+class CtxImpl<Result> implements Ctx<Result>{
+
+    declare readonly evtDoneOrAborted: Evt<DoneOrAborted<Result>>;
+
+    declare readonly evtAttach: Evt<Handler.WithEvt<any, Result>>;
+
+    declare readonly evtDetach: Evt<Handler.WithEvt<any, Result>>;
+
+
+    private lazyEvtAttach = new LazyEvt<Handler.WithEvt<any, Result>>();
+    private lazyEvtDetach = new LazyEvt<Handler.WithEvt<any, Result>>();
+    private lazyEvtDoneOrAborted = new LazyEvt<DoneOrAborted<Result>>();
+
+    private onDoneOrAborted(doneEvtData: DoneOrAborted<Result>): void {
+        this.lazyEvtDoneOrAborted.post(doneEvtData);
+    }
+
+    private static __1: void = (() => {
+
+        if (false) { CtxImpl.__1 }
+
+        defineAccessors(
+            CtxImpl.prototype,
+            "evtDoneOrAborted",
+            {
+                "get": function (this: CtxImpl<any>) {
+                    return this.lazyEvtDoneOrAborted.evt;
+                }
+            }
+        );
+
+        defineAccessors(
+            CtxImpl.prototype,
+            "evtAttach",
+            {
+                "get": function (this: CtxImpl<any>) {
+                    return this.lazyEvtAttach.evt;
+                }
+            }
+        );
+
+        defineAccessors(
+            CtxImpl.prototype,
+            "evtDetach",
+            {
+                "get": function (this: CtxImpl<any>) {
+                    return this.lazyEvtDetach.evt;
+                }
+            }
+        );
+
+    })();
+
+    waitFor(timeout?: number): Promise<Result> {
+        return this.evtDoneOrAborted
+            .waitFor(timeout)
+            .then(
+                data => {
+                    if (data.type === "ABORTED") {
+                        throw data.error;
+                    }
+                    return data.result;
+                },
+                timeoutError => {
+                    this.abort(timeoutError);
+                    throw timeoutError;
+                }
+            )
+            ;
+    }
+
+
+    abort(error: Error) {
+        return this.__done(error);
+    }
+
+    done(result: Result) {
+        return this.__done(undefined, result);
+    }
+
+    /** Detach all handler bound to this context from theirs respective Evt and post getEvtDone() */
+    private __done(error: Error | undefined, result?: Result): Handler.WithEvt<any, Result>[] {
+
+        const handlers: Handler.WithEvt<any, Result>[] = [];
+
+        for (const handler of this.handlers.values()) {
+
+            const evt = this.evtByHandler.get(handler)!;
+
+            const wasStillAttached = handler.detach();
+
+            //NOTE: It should not be possible
+            if (!wasStillAttached) {
+                continue;
+            }
+
+            handlers.push({ handler, evt });
+        }
+
+        this.onDoneOrAborted({
+            ...(!!error ?
+                { type: "ABORTED", error } :
+                { type: "DONE", "result": result as NonNullable<typeof result> }
+            ),
+            handlers
+        });
+
+
+        return handlers;
+
+    }
+
+    private handlers = new Set<
+        Handler<any, any, Ctx<Result>>
+    >();
+    private evtByHandler = new WeakMap<
+        Handler<any, any, Ctx<Result>>,
+        EvtLike<any>
+    >();
+
+    getHandlers(): Handler.WithEvt<any, Result>[] {
+        return Array.from(this.handlers.values())
+            .map(handler => ({ handler, "evt": this.evtByHandler.get(handler)! }))
+            ;
+    }
+
+
+    zz__addHandler<T>(
+        handler: Handler<T, any, CtxLike<Result>>,
+        evt: EvtLike<T>
+    ) {
+        assert(handler.ctx === this);
+        assert(typeGuard<Handler<T, any, Ctx<Result>>>(handler));
+        this.handlers.add(handler);
+        this.evtByHandler.set(handler, evt);
+        this.lazyEvtAttach.post({ handler, evt });
+    }
+
+    zz__removeHandler<T>(
+        handler: Handler<T, any, CtxLike<Result>>,
+    ) {
+        assert(handler.ctx === this);
+        assert(typeGuard<Handler<T, any, Ctx<Result>>>(handler));
+
+        this.lazyEvtDetach.post({
+            handler,
+            "evt": this.evtByHandler.get(handler)!
+        });
+
+        this.handlers.delete(handler);
+    }
+
+}
+
+export const Ctx: {
+    new <Result>(): Ctx<Result>;
+    readonly prototype: Ctx<any>;
+} = CtxImpl;
+
+try{ overwriteReadonlyProp(Ctx as any, "name", "Ctx"); }catch{}
+
+importProxy.Ctx = Ctx;
+
+
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.asNonPostable.ts b/ddb_main/node_modules/evt/src/lib/Evt.asNonPostable.ts
new file mode 100644
index 0000000..49a0af2
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.asNonPostable.ts
@@ -0,0 +1,10 @@
+
+type ToNonPostableEvt<E extends ({ [key: string]: any; } | import("../lib/types/helper").EvtLike<any>)> = 
+    import("./types/helper/ToNonPostableEvt").ToNonPostableEvt<E>;
+
+type EvtLike<T>= import("./types/helper/UnpackEvt").EvtLike<T>;
+
+/** https://docs.evt.land/api/evt/asnonpostable */
+export function asNonPostable<E extends EvtLike<any>>(evt: E): ToNonPostableEvt<E>{
+    return evt as any;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.asPostable.ts b/ddb_main/node_modules/evt/src/lib/Evt.asPostable.ts
new file mode 100644
index 0000000..3242faa
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.asPostable.ts
@@ -0,0 +1,12 @@
+
+type EvtLike<T>= import("./types/helper/UnpackEvt").EvtLike<T>;
+type ToPostableEvt<E extends ({ [key: string]: any; } | EvtLike<any>)> = import("./types/helper/ToPostableEvt").ToPostableEvt<E>;
+
+/** 
+ * https://docs.evt.land/api/evt/aspostable 
+ * ⚠ UNSAFE ⚠ - Please refer to documentation before using.
+ * */
+export function asPostable<E extends EvtLike<any>>(evt: E): ToPostableEvt<E>{
+    return evt as any;
+}
+
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.asyncPipe.ts b/ddb_main/node_modules/evt/src/lib/Evt.asyncPipe.ts
new file mode 100644
index 0000000..acff386
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.asyncPipe.ts
@@ -0,0 +1,98 @@
+
+import { Evt } from "./Evt";
+
+type StatefulEvt<T> = import("./types/interfaces").StatefulEvt<T>;
+type StatefulReadonlyEvt<T> = import("./types/interfaces").StatefulReadonlyEvt<T>;
+type NonPostableEvt<T> = import("./types/interfaces").NonPostableEvt<T>;
+
+type UnpackEvt<T extends ({ [key: string]: any; } | import("./types/helper/UnpackEvt").EvtLike<any>)> =
+    import("./types/helper").UnpackEvt<T>;
+
+type EvtLike<T> = import("./types/helper/UnpackEvt").EvtLike<T> & {
+    attach(callback: (data: T) => void): void;
+};
+
+type UseVoidEvt<T> = import("./types/helper/SwapEvtType").UseVoidEvt<T>;
+type PromiseOrNot<T> = import("../tools/typeSafety").PromiseOrNot<T>;
+
+
+/** 
+ * NOTE: Workaround until v2.0 where .pipe() will support async operators 
+ * Usage example: https://stackblitz.com/edit/evt-async-op?file=index.ts 
+ * 
+ * When the argument is a StatefulEvt:
+ * If, wile asyncOp was running, the state of the source evt
+ * have changed then the result will be discarded.
+ * 
+ * If the asyncOp complete synchronously (meaning it does not return
+ * a promise) then the result is synchronously transformed. (As with .pipe() )
+ * 
+ * More usage example in src/test/test95.ts
+ */
+export function asyncPipe<E extends EvtLike<any>, U>(
+    evt: E,
+    asyncOp: (data: UnpackEvt<E>) => PromiseOrNot<[U] | null>
+): UseVoidEvt<
+    E extends StatefulReadonlyEvt<any> ? StatefulEvt<U | undefined> :
+    E extends NonPostableEvt<any> ? Evt<U> :
+    EvtLike<U>
+> {
+
+    const out = "state" in evt ?
+        Evt.create<UnpackEvt<E> | undefined>(undefined) :
+        Evt.create<UnpackEvt<E>>();
+
+    let currentCallCount = 0;
+
+    const onData = async (data: UnpackEvt<E>) => {
+
+        currentCallCount++;
+
+        const thisCallCount = currentCallCount;
+
+        const prOpResult = asyncOp(data);
+
+        let opResult: [U] | null;
+
+        if (
+            prOpResult !== null &&
+            "then" in prOpResult
+        ) {
+
+            opResult = await prOpResult;
+
+            if (
+                "state" in evt &&
+                thisCallCount !== currentCallCount
+            ) {
+                return;
+            }
+
+        } else {
+
+            opResult = prOpResult;
+
+        }
+
+        if (opResult === null) {
+
+            return;
+        }
+
+        out.post(opResult[0] as any);
+
+    };
+
+    evt.attach(onData);
+
+
+    if ("state" in evt) {
+
+        onData((evt as any).state);
+
+    }
+
+    return out as any;
+
+}
+
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.create.ts b/ddb_main/node_modules/evt/src/lib/Evt.create.ts
new file mode 100644
index 0000000..cff0770
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.create.ts
@@ -0,0 +1,28 @@
+
+import { importProxy } from "./importProxy";
+
+type Evt<T> = import("./types/interfaces").Evt<T>;
+type VoidEvt= import("./types/interfaces").VoidEvt;
+type StatefulEvt<T> = import("./types/interfaces").StatefulEvt<T>;
+
+/** 
+ * https://docs.evt.land/api/evt/create
+ * Return a new VoidEvt instance.
+ */
+export function create(): VoidEvt;
+/** 
+ * https://docs.evt.land/api/evt/create
+ * Return a new Evt<T> instance.
+ */
+export function create<T>(): Evt<T>;
+/** 
+ * https://docs.evt.land/api/evt/create
+ * Return a new StatefulEvt<T> instance.
+ */
+export function create<T>(initialState: T): StatefulEvt<T>;
+export function create(...args: [] | [any] ): Evt<any> | StatefulEvt<any> {
+    return args.length === 0 ? 
+        new importProxy.Evt() : 
+        new importProxy.StatefulEvt(args[0])
+        ;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.factorize.ts b/ddb_main/node_modules/evt/src/lib/Evt.factorize.ts
new file mode 100644
index 0000000..7e6cb0a
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.factorize.ts
@@ -0,0 +1,19 @@
+
+
+type FactorizeEvt<E extends import("./types/helper/UnpackEvt").EvtLike<any>> = 
+    import("./types/helper/FactorizeEvt").FactorizeEvt<E>;
+
+type EvtLike<T> = import("./types/helper/UnpackEvt").EvtLike<T>;
+
+/** https://docs.evt.land/api/evt/factorize */
+export function factorize<E extends EvtLike<any>>(
+    evt: E
+): FactorizeEvt<E> {
+    return evt as any;
+}
+
+/*
+import { Evt } from "./Evt";
+const x: Evt<boolean> = loosenType(new Evt<true>()); x;
+const y: Evt<boolean> = loosenType(new Evt<number>()); y;
+*/
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.from.ts b/ddb_main/node_modules/evt/src/lib/Evt.from.ts
new file mode 100644
index 0000000..a6666a0
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.from.ts
@@ -0,0 +1,259 @@
+import { id } from "../tools/typeSafety/id";
+import { assert } from "../tools/typeSafety/assert";
+import { typeGuard } from "../tools/typeSafety/typeGuard";
+import { mergeImpl } from "./Evt.merge";
+import { importProxy } from "./importProxy";
+
+import * as _1 from "./types/EventTargetLike";
+
+namespace dom {
+
+    export type HTMLElementEventMap = import("./types/lib.dom").HTMLElementEventMap;
+    export type WindowEventMap = import("./types/lib.dom").WindowEventMap;
+    export type DocumentEventMap = import("./types/lib.dom").DocumentEventMap;
+
+}
+
+type Evt<T>= import("./types/interfaces/Evt").Evt<T>;
+type EvtLike<T> = import("./types/helper/UnpackEvt").EvtLike<T>;
+
+type OneOrMany<T> = T | ArrayLike<T>;
+type CtxLike<Result> = import("./types/interfaces").CtxLike<Result> & {
+      evtDoneOrAborted: EvtLike<unknown> & { postCount: number; attachOnce(callback: ()=> void): void; };
+};
+
+function fromImpl<T>(
+    ctx: CtxLike<any> | undefined,
+    target: OneOrMany<_1.EventTargetLike<T>> | PromiseLike<T>,
+    eventName?: string,
+    options?: _1.EventTargetLike.HasEventTargetAddRemove.Options
+): Evt<T> {
+
+    const matchEventTargetLike =
+        (target_: typeof target): target_ is _1.EventTargetLike<T> =>
+            _1.z_2.canBe(target_);
+
+    if (!matchEventTargetLike(target)) {
+
+        if ("then" in target) {
+
+            const evt = new importProxy.Evt<T>();
+
+            const isCtxDone = (() => {
+
+                const getEvtDonePostCount = () => ctx?.evtDoneOrAborted.postCount;
+
+                const n = getEvtDonePostCount();
+
+                return () => n !== getEvtDonePostCount();
+
+            })();
+
+            target.then(data => {
+
+                if (isCtxDone()) {
+                    return;
+                }
+
+                evt.post(data);
+
+            });
+
+            return evt;
+
+        }
+
+        return mergeImpl<Evt<T>>(
+            ctx,
+            Array.from(target).map(
+                target => fromImpl<T>(ctx, target, eventName, options)
+            )
+        );
+
+    }
+
+    type ProxyMethod<T> = (
+        listener: (data: T) => void,
+        eventName: string,
+        options?: _1.EventTargetLike.HasEventTargetAddRemove.Options
+    ) => void;
+
+    let proxy: {
+        on: ProxyMethod<T>;
+        off: ProxyMethod<T>;
+    };
+
+    if (_1.z_2.NodeStyleEventEmitter_match(target)) {
+        proxy = {
+            "on": (listener, eventName) => target.addListener(eventName, listener),
+            "off": (listener, eventName) => target.removeListener(eventName, listener)
+        };
+    } else if (_1.z_2.JQueryStyleEventEmitter_match(target)) {
+        proxy = {
+            "on": (listener, eventName) => target.on(eventName, listener),
+            "off": (listener, eventName) => target.off(eventName, listener)
+        };
+    } else if (_1.z_2.HasEventTargetAddRemove_match(target)) {
+        proxy = {
+            "on": (listener, eventName, options) => target.addEventListener(eventName, listener, options),
+            "off": (listener, eventName, options) => target.removeEventListener(eventName, listener, options)
+        };
+    } else if (_1.z_2.RxJSSubject_match(target)) {
+
+        let subscription: _1.EventTargetLike.RxJSSubject.Subscription;
+
+        proxy = {
+            "on": listener => subscription = target.subscribe(data => listener(data)),
+            "off": () => subscription.unsubscribe()
+        };
+
+    } else {
+
+        id<never>(target);
+        assert(false);
+
+    }
+
+    const evt = new importProxy.Evt<T>();
+
+    const listener = (data: T) => evt.post(data);
+
+    ctx?.evtDoneOrAborted.attachOnce(
+        () => proxy.off(
+            listener,
+            eventName!,
+            options
+        )
+    );
+
+    proxy.on(listener, eventName!, options);
+
+    return evt;
+
+}
+
+
+/** https://docs.evt.land/api/evt/from */
+export function from<K extends keyof dom.HTMLElementEventMap>(
+    ctx: CtxLike<any>,
+    target: _1.EventTargetLike.HTMLElement,
+    eventName: K,
+    options?: _1.EventTargetLike.HasEventTargetAddRemove.Options
+): Evt<dom.HTMLElementEventMap[K]>;
+
+export function from<K extends keyof dom.WindowEventMap>(
+    ctx: CtxLike<any>,
+    target: _1.EventTargetLike.Window,
+    eventName: K,
+    options?: _1.EventTargetLike.HasEventTargetAddRemove.Options
+): Evt<dom.WindowEventMap[K]>;
+
+export function from<K extends keyof dom.DocumentEventMap>(
+    ctx: CtxLike<any>,
+    target: _1.EventTargetLike.Document,
+    eventName: K,
+    options?: _1.EventTargetLike.HasEventTargetAddRemove.Options
+): Evt<dom.DocumentEventMap[K]>;
+
+export function from<T>(
+    ctx: CtxLike<any>,
+    target: OneOrMany<
+        _1.EventTargetLike.NodeStyleEventEmitter |
+        _1.EventTargetLike.JQueryStyleEventEmitter
+    >,
+    eventName: string
+): Evt<T>;
+export function from<T>(
+    ctx: CtxLike<any>,
+    target: OneOrMany<
+        _1.EventTargetLike.HasEventTargetAddRemove<T>
+    >,
+    eventName: string,
+    options?: _1.EventTargetLike.HasEventTargetAddRemove.Options
+): Evt<T>;
+export function from<T>(
+    ctx: CtxLike<any>,
+    target: OneOrMany<_1.EventTargetLike.RxJSSubject<T>>
+): Evt<T>;
+
+export function from<T>(
+    ctx: CtxLike<any>,
+    target: PromiseLike<T>
+): Evt<T>;
+
+
+export function from<K extends keyof dom.HTMLElementEventMap>(
+    target: _1.EventTargetLike.HTMLElement,
+    eventName: K,
+    options?: _1.EventTargetLike.HasEventTargetAddRemove.Options
+): Evt<dom.HTMLElementEventMap[K]>;
+export function from<K extends keyof dom.WindowEventMap>(
+    target: _1.EventTargetLike.Window,
+    eventName: K,
+    options?: _1.EventTargetLike.HasEventTargetAddRemove.Options
+): Evt<dom.WindowEventMap[K]>;
+export function from<K extends keyof dom.DocumentEventMap>(
+    target: _1.EventTargetLike.Document,
+    eventName: K,
+    options?: _1.EventTargetLike.HasEventTargetAddRemove.Options
+): Evt<dom.DocumentEventMap[K]>;
+export function from<T>(
+    target: OneOrMany<
+        _1.EventTargetLike.NodeStyleEventEmitter |
+        _1.EventTargetLike.JQueryStyleEventEmitter
+    >,
+    eventName: string
+): Evt<T>;
+export function from<T>(
+    target: OneOrMany<
+        _1.EventTargetLike.HasEventTargetAddRemove<T>
+    >,
+    eventName: string,
+    options?: _1.EventTargetLike.HasEventTargetAddRemove.Options
+): Evt<T>;
+export function from<T>(
+    target: OneOrMany<_1.EventTargetLike.RxJSSubject<T>>
+): Evt<T>;
+export function from<T>(
+    target: PromiseLike<T>
+): Evt<T>;
+
+export function from<T>(
+    ctxOrTarget: CtxLike<any> | OneOrMany<_1.EventTargetLike<T>> | PromiseLike<T>,
+    targetOrEventName?: OneOrMany<_1.EventTargetLike<T>> | string | PromiseLike<T>,
+    eventNameOrOptions?: string | _1.EventTargetLike.HasEventTargetAddRemove.Options,
+    options?: _1.EventTargetLike.HasEventTargetAddRemove.Options
+): Evt<T> {
+
+    if ("evtDoneOrAborted" in ctxOrTarget) {
+
+        assert(
+            typeGuard<OneOrMany<_1.EventTargetLike<T>> | PromiseLike<T>>(targetOrEventName) &&
+            typeGuard<string | undefined>(eventNameOrOptions) &&
+            typeGuard<_1.EventTargetLike.HasEventTargetAddRemove.Options | undefined>(options)
+        );
+
+        return fromImpl(
+            ctxOrTarget,
+            targetOrEventName,
+            eventNameOrOptions,
+            options
+        );
+
+    } else {
+
+        assert(
+            typeGuard<string | undefined>(targetOrEventName) &&
+            typeGuard<_1.EventTargetLike.HasEventTargetAddRemove.Options | undefined>(eventNameOrOptions)
+        );
+
+        return fromImpl(
+            undefined,
+            ctxOrTarget,
+            targetOrEventName,
+            eventNameOrOptions
+        );
+
+    }
+
+}
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.getCtx.ts b/ddb_main/node_modules/evt/src/lib/Evt.getCtx.ts
new file mode 100644
index 0000000..c84ff31
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.getCtx.ts
@@ -0,0 +1,34 @@
+import { Polyfill as WeakMap } from "minimal-polyfills/WeakMap";
+import { importProxy } from "./importProxy";
+type VoidCtx = import("./types/interfaces").VoidCtx;
+
+/** 
+ * https://docs.evt.land/api/evt/getctx
+ * 
+ * Evt.weakCtx(obj) always return the same instance of VoidCtx for a given object.
+ * No strong reference to the object is created
+ * when the object is no longer referenced it's associated Ctx will be freed from memory.
+ */
+export function getCtxFactory() {
+
+    const ctxByObj = new WeakMap<object, VoidCtx>();
+
+    function getCtx(obj: object): VoidCtx {
+
+        let ctx = ctxByObj.get(obj);
+
+        if (ctx === undefined) {
+
+            ctx = (new importProxy.Ctx()) as VoidCtx;
+
+            ctxByObj.set(obj, ctx);
+
+        }
+
+        return ctx;
+
+    }
+
+    return getCtx;
+
+}
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.loosenType.ts b/ddb_main/node_modules/evt/src/lib/Evt.loosenType.ts
new file mode 100644
index 0000000..aacab59
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.loosenType.ts
@@ -0,0 +1,27 @@
+
+type SwapEvtType<E extends import("./types/helper/UnpackEvt").EvtLike<any>, T> = 
+    import("./types/helper/SwapEvtType").SwapEvtType<E, T>;
+
+type UnpackEvt<T extends ({ [key: string]: any; } | import("./types/helper/UnpackEvt").EvtLike<any>)> = 
+    import("./types/helper/UnpackEvt").UnpackEvt<T>;
+
+type EvtLike<T> = import("./types/helper/UnpackEvt").EvtLike<T>;
+
+/**
+ * https://docs.evt.land/api/evt/loosenType
+ */
+export function loosenType<E extends EvtLike<any>, SupersetOfT>(
+    evt: E
+): UnpackEvt<E> extends SupersetOfT ?
+    SwapEvtType<typeof evt, SupersetOfT> : "NOT A SUPERSET" {
+    return evt as any;
+}
+
+/*
+import { Evt } from "./Evt";
+const x: Evt<boolean> = loosenType(new Evt<true>()); x;
+const y: Evt<boolean> = loosenType(new Evt<number>()); y;
+*/
+
+
+
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.merge.ts b/ddb_main/node_modules/evt/src/lib/Evt.merge.ts
new file mode 100644
index 0000000..d3c872b
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.merge.ts
@@ -0,0 +1,60 @@
+type UnpackEvt<T extends ({ [key: string]: any; } | import("./types/helper/UnpackEvt").EvtLike<any>)> = 
+    import("./types/helper/UnpackEvt").UnpackEvt<T>;
+
+import { importProxy } from "./importProxy";
+
+type Evt<T> = import("./types/interfaces").Evt<T>;
+type CtxLike<Result> = import("./types/interfaces").CtxLike<Result>;
+
+export type EvtLike<T> = import("./types/helper/UnpackEvt").EvtLike<T> & {
+    attach(ctx: CtxLike<any>, callback: (data: T) => void): void;
+    attach(callback: (data: T) => void): void;
+};
+
+export function mergeImpl<EvtUnion extends EvtLike<any>>(
+    ctx: CtxLike<any> | undefined,
+    evts: readonly EvtUnion[]
+): Evt<UnpackEvt<EvtUnion>> {
+
+    const evtUnion = new importProxy.Evt<UnpackEvt<EvtUnion>>();
+
+    const callback = (data: UnpackEvt<typeof evtUnion>) => evtUnion.post(data)
+
+    evts.forEach(
+        evt => {
+
+            if (ctx === undefined) {
+                evt.attach(callback);
+            } else {
+                evt.attach(ctx, callback);
+            }
+
+        }
+    );
+
+    return evtUnion;
+
+}
+
+
+
+/** https://docs.evt.land/api/evt/merge */
+export function merge<EvtUnion extends EvtLike<any>>(
+    ctx: CtxLike<any>,
+    evts: readonly EvtUnion[]
+): Evt<UnpackEvt<EvtUnion>>;
+export function merge<EvtUnion extends EvtLike<any>>(
+    evts: readonly EvtUnion[]
+): Evt<UnpackEvt<EvtUnion>>;
+export function merge<EvtUnion extends EvtLike<any>>(
+    p1: CtxLike<any> | readonly EvtUnion[],
+    p2?: readonly EvtUnion[]
+): Evt<UnpackEvt<EvtUnion>> {
+
+    return "length" in p1 ?
+        mergeImpl(undefined, p1) :
+        mergeImpl(p1, p2!)
+        ;
+
+
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.newCtx.ts b/ddb_main/node_modules/evt/src/lib/Evt.newCtx.ts
new file mode 100644
index 0000000..a77a4b9
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.newCtx.ts
@@ -0,0 +1,15 @@
+import { importProxy } from "./importProxy";
+
+type Ctx<Result = any> = import("./Ctx").Ctx<Result>;
+type VoidCtx = import("./types/interfaces").VoidCtx;
+
+/** 
+ * https://docs.evt.land/api/evt/newctx
+ * 
+ * return a new Ctx instance
+ * */
+export function newCtx(): VoidCtx;
+export function newCtx<T>(): Ctx<T>;
+export function newCtx(): Ctx<any> {
+    return new importProxy.Ctx();
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.parsePropsFromArgs.ts b/ddb_main/node_modules/evt/src/lib/Evt.parsePropsFromArgs.ts
new file mode 100644
index 0000000..a79f3ef
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.parsePropsFromArgs.ts
@@ -0,0 +1,260 @@
+
+type CtxLike<Result> = import("./types/interfaces").CtxLike<Result>;
+
+namespace Handler {
+
+    export type PropsFromArgs<T, U, CtxProp extends CtxLike<any> | undefined = CtxLike<any> | undefined>= 
+        import("./types/Handler").Handler.PropsFromArgs<T,U,CtxProp>;
+
+}
+
+import type { Operator } from "./types/Operator"
+import { id } from "../tools/typeSafety/id";
+import { compose } from "./util/compose";
+import { typeGuard } from "../tools/typeSafety/typeGuard"
+
+export function matchAll() { return true; }
+
+const canBeOperator = (p: undefined | CtxLike<any> | Operator<any, any, any>): boolean => {
+    return (
+        p !== undefined &&
+        typeGuard<Operator<any, any, any>>(p) &&
+        (
+            typeof p === "function" ||
+            typeof p[0] === "function"
+        )
+    );
+};
+
+const defaultParams: Handler.PropsFromArgs<any, any> = {
+    "op": matchAll,
+    "ctx": undefined,
+    "timeout": undefined,
+    "callback": undefined
+};
+
+export function parsePropsFromArgs<T>(
+    inputs: readonly any[],
+    methodName: "waitFor" | "attach*" | "pipe"
+): Handler.PropsFromArgs<T, any> {
+
+    typeGuard<Handler.PropsFromArgs<T, any>>(defaultParams);
+
+    type Out = Handler.PropsFromArgs<T, any>;
+
+    switch (methodName) {
+        case "pipe": {
+
+            //[]
+            //[undefined] ( not valid but user would expect it to work )
+            //[ ctx, ...op[] ]
+            //[ ...op[] ]
+
+            const getOpWrap = (ops: [Operator<T, any, any>, ...Operator<any, any, any>[]]) =>
+                ops.length === 0 ?
+                    {}
+                    :
+                    { "op": ops.length === 1 ? ops[0] : compose(...ops) }
+                ;
+
+            if (canBeOperator(inputs[0])) {
+
+                //[ ...op[] ]
+
+                return id<Out>({
+                    ...defaultParams,
+                    ...getOpWrap(inputs as any)
+                });
+
+            } else {
+
+                //[]
+                //[ ctx, ...Operator.fλ[] ]
+
+                const [ctx, ...rest] = inputs;
+
+                return id<Out>({
+                    ...defaultParams,
+                    ...(ctx !== undefined ? { ctx } : {}),
+                    ...getOpWrap(rest as any)
+                });
+
+            }
+
+
+        } break;
+
+        case "waitFor": {
+
+            //[ op, ctx, timeout ]
+            //[ op, ctx, undefined ]
+            //[ op, ctx ]
+            //[ op, timeout ]
+            //[ op, undefined ]
+            //[ ctx, timeout ]
+            //[ ctx, undefined ]
+            //[ op ]
+            //[ ctx ]
+            //[ timeout ]
+            //[ undefined ]
+            //[ callback ]
+
+            return parsePropsFromArgs(
+                [
+                    //If the last element is undefined, remove it.
+                    ...inputs.filter(
+                        (value, index) => !(
+                            index === inputs.length - 1 &&
+                            value === undefined
+                        )
+                    ),
+                    defaultParams.callback
+                ],
+                "attach*"
+            );
+
+        } break;
+        case "attach*": {
+
+            //NOTE: when callback is undefined call has been forward from waitFor.
+
+            //[ op, ctx, timeout, callback ]
+            //[ op, ctx, timeout, undefined ]
+            //[ op, ctx, callback ]
+            //[ op, ctx, undefined ]
+            //[ op, timeout, callback ]
+            //[ op, timeout, undefined ]
+            //[ ctx, timeout, callback ]
+            //[ ctx, timeout, undefined ]
+            //[ op, callback ]
+            //[ op, undefined ]
+            //[ ctx, callback ]
+            //[ ctx, undefined ]
+            //[ timeout, callback ]
+            //[ timeout, undefined ]
+            //[ callback ]
+            //[ undefined ]
+
+            const n = inputs.length as 4 | 3 | 2 | 1 | 0;
+
+            switch (n) {
+                case 4: {
+
+                    //[ op, ctx, timeout, callback ]
+                    const [p1, p2, p3, p4] = inputs;
+
+                    return id<Out>({
+                        ...defaultParams,
+                        "op": p1,
+                        "ctx": p2,
+                        "timeout": p3,
+                        "callback": p4
+                    });
+
+                }
+                case 3: {
+
+                    //[ op, ctx, callback ]
+                    //[ op, timeout, callback ]
+                    //[ ctx, timeout, callback ]
+                    const [p1, p2, p3] = inputs;
+                    if (typeof p2 === "number") {
+                        //[ op, timeout, callback ]
+                        //[ ctx, timeout, callback ]
+
+                        const timeout: Out["timeout"] = p2;
+                        const callback: Out["callback"] = p3;
+
+                        if (canBeOperator(p1)) {
+                            //[ op, timeout, callback ]
+                            return id<Out>({
+                                ...defaultParams,
+                                timeout,
+                                callback,
+                                "op": p1
+                            });
+
+                        } else {
+                            //[ ctx, timeout, callback ]
+
+                            return id<Out>({
+                                ...defaultParams,
+                                timeout,
+                                callback,
+                                "ctx": p1
+                            });
+
+                        }
+                    } else {
+                        //[ op, ctx, callback ]
+                        return id<Out>({
+                            ...defaultParams,
+                            "op": p1,
+                            "ctx": p2,
+                            "callback": p3
+                        });
+
+                    }
+
+                }
+                case 2: {
+
+                    //[ op, callback ]
+                    //[ ctx, callback ]
+                    //[ timeout, callback ]
+                    const [p1, p2] = inputs;
+                    if (typeof p1 === "number") {
+                        //[ timeout, callback ]
+                        return id<Out>({
+                            ...defaultParams,
+                            "timeout": p1,
+                            "callback": p2
+                        });
+                    } else {
+                        //[ op, callback ]
+                        //[ ctx, callback ]
+                        const callback: Out["callback"] = p2;
+                        if (canBeOperator(p1)) {
+
+                            return id<Out>({
+                                ...defaultParams,
+                                callback,
+                                "op": p1
+                            });
+
+                        } else {
+
+                            return id<Out>({
+                                ...defaultParams,
+                                callback,
+                                "ctx": p1
+                            });
+
+                        }
+                    }
+
+                }
+                case 1: {
+
+                    //[ callback ]
+                    const [p] = inputs;
+
+                    return id<Out>({
+                        ...defaultParams,
+                        "callback": p
+                    });
+
+                }
+                case 0: {
+                    return id<Out>({ ...defaultParams });
+                }
+
+            }
+
+
+        } break;
+
+    }
+
+}
+
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.ts b/ddb_main/node_modules/evt/src/lib/Evt.ts
new file mode 100644
index 0000000..03dc9a2
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.ts
@@ -0,0 +1,970 @@
+import "minimal-polyfills/Array.prototype.find";
+import { importProxy } from "./importProxy";
+import { create } from "./Evt.create";
+import { getCtxFactory } from "./Evt.getCtx";
+import { factorize } from "./Evt.factorize";
+import { merge } from "./Evt.merge";
+import { from } from "./Evt.from";
+import { useEffect } from "./Evt.useEffect";
+import { asPostable } from "./Evt.asPostable";
+import { asyncPipe } from "./Evt.asyncPipe";
+import { asNonPostable } from "./Evt.asNonPostable";
+import { parsePropsFromArgs, matchAll } from "./Evt.parsePropsFromArgs";
+import { newCtx } from "./Evt.newCtx";
+import { LazyEvt } from "./LazyEvt";
+import { defineAccessors } from "../tools/typeSafety/defineAccessors";
+import { invokeOperator } from "./util/invokeOperator";
+import { Polyfill as Map, LightMap } from "minimal-polyfills/Map";
+import { Polyfill as WeakMap } from "minimal-polyfills/WeakMap";
+import * as runExclusive from "run-exclusive";
+import { overwriteReadonlyProp } from "../tools/typeSafety/overwriteReadonlyProp";
+import { typeGuard } from "../tools/typeSafety/typeGuard";
+import { encapsulateOpState } from "./util/encapsulateOpState";
+import { Deferred } from "../tools/Deferred";
+import { loosenType } from "./Evt.loosenType";
+import { safeClearTimeout, safeSetTimeout, Timer } from "../tools/safeSetTimeout";
+import { isPromiseLike } from "../tools/typeSafety/isPromiseLike";
+
+import type { Handler } from "./types/Handler";
+import * as _1 from "./types/Operator";
+import * as _2 from "./types/EvtError";
+import * as _3 from "./types/interfaces/CtxLike";
+
+type NonPostableEvt<T> = import("./types/interfaces").NonPostableEvt<T>;
+type StatefulEvt<T> = import("./types/interfaces").StatefulEvt<T>;
+
+
+/** https://docs.evt.land/api/evt */
+export type Evt<T> = import("./types/interfaces").Evt<T>;
+
+class EvtImpl<T> implements Evt<T> {
+
+    static readonly create = create;
+
+    static readonly newCtx = newCtx;
+
+    static readonly merge = merge;
+
+    static readonly from = from;
+
+    static readonly useEffect = useEffect;
+
+    static readonly getCtx = getCtxFactory();
+
+    static readonly loosenType = loosenType;
+
+    static readonly factorize = factorize;
+
+    static readonly asPostable = asPostable;
+
+    static readonly asyncPipe = asyncPipe;
+
+    static readonly asNonPostable = asNonPostable;
+
+    private static __defaultMaxHandlers = 25;
+
+    static setDefaultMaxHandlers(n: number): void {
+        this.__defaultMaxHandlers = isFinite(n) ? n : 0;
+    }
+
+    toStateful(p1: any, p2?: _3.CtxLike): StatefulEvt<any> {
+
+        const isP1Ctx = _3.z_3.match(p1);
+
+        const initialValue: any = isP1Ctx ? undefined : p1;
+        const ctx = p2 || (isP1Ctx ? p1 : undefined);
+
+        const out = new importProxy.StatefulEvt<any>(initialValue);
+
+        const callback = (data: T) => out.post(data);
+
+        if (!!ctx) {
+            this.attach(ctx, callback);
+        } else {
+            this.attach(callback);
+        }
+
+        return out;
+
+    }
+
+    declare readonly evtAttach: Evt<Handler<T, any>>;
+    declare readonly evtDetach: Evt<Handler<T, any>>;
+
+    private readonly lazyEvtAttach = new LazyEvt<Handler<T, any>>();
+    private readonly lazyEvtDetach = new LazyEvt<Handler<T, any>>();
+
+    private static __1: void = (() => {
+
+        if (false) { EvtImpl.__1 }
+
+        defineAccessors(
+            EvtImpl.prototype,
+            "evtAttach",
+            {
+                "get": function (this: EvtImpl<any>) {
+                    return this.lazyEvtAttach.evt;
+                }
+            }
+        );
+
+        defineAccessors(
+            EvtImpl.prototype,
+            "evtDetach",
+            {
+                "get": function (this: EvtImpl<any>) {
+                    return this.lazyEvtDetach.evt;
+                }
+            }
+        );
+
+    })();
+
+    private __maxHandlers: undefined | number = undefined;
+
+    setMaxHandlers(n: number): this {
+        this.__maxHandlers = isFinite(n) ? n : 0;
+        return this;
+    }
+
+    readonly postCount: number = 0;
+
+    private traceId: string | null = null;
+    private traceFormatter!: (data: T) => string;
+    private log!: Exclude<Parameters<NonPostableEvt<any>["enableTrace"]>[0]["log"], false>;
+
+    enableTrace(
+        params: {
+            id: string,
+            formatter?: (data: T) => string,
+            log?: ((message?: any, ...optionalParams: any[]) => void) | false
+        }
+        //NOTE: Not typeof console.log as we don't want to expose types from node
+    ): void {
+
+        const { id, formatter, log } = params;
+
+        this.traceId = id;
+
+        this.traceFormatter = formatter || (
+            data => {
+                try {
+                    return JSON.stringify(data, null, 2);
+                } catch {
+                    return `${data}`;
+                }
+            }
+        );
+
+        this.log =
+            log === undefined ?
+                ((...inputs) => console.log(...inputs)) :
+                log === false ? undefined : log
+            ;
+
+    }
+
+    disableTrace(): this {
+        this.traceId = null;
+        return this;
+    }
+
+    private readonly handlers: Handler<T, any>[] = [];
+
+    private readonly handlerTriggers: LightMap<
+        Handler<T, any>,
+        (opResult: _1.Operator.fλ.Result.Matched<any, any>) => PromiseLike<void> | undefined
+    > = new Map();
+
+    //NOTE: An async handler ( attached with waitFor ) is only eligible to handle a post if the post
+    //occurred after the handler was set. We don't want to waitFor event from the past.
+    //private readonly asyncHandlerChronologyMark = new WeakMap<ImplicitParams.Async, number>();
+    declare private readonly asyncHandlerChronologyMark: WeakMap<
+        Handler.PropsFromMethodName.Async,
+        number
+    >;
+    declare private __asyncHandlerChronologyMark:
+        (typeof EvtImpl.prototype.asyncHandlerChronologyMark) | undefined;
+
+    //NOTE: There is an exception to the above rule, we want to allow async waitFor loop 
+    //do so we have to handle the case where multiple event would be posted synchronously.
+    declare private readonly asyncHandlerChronologyExceptionRange: WeakMap<
+        Handler.PropsFromMethodName.Async,
+        { lowerMark: number; upperMark: number; }
+    >;
+    declare private __asyncHandlerChronologyExceptionRange:
+        (typeof EvtImpl.prototype.asyncHandlerChronologyExceptionRange) | undefined;
+
+    declare private readonly statelessByStatefulOp: WeakMap<
+        _1.Operator.fλ.Stateful<T, any, any>,
+        _1.Operator.fλ.Stateless<T, any, any>
+    >;
+    declare private __statelessByStatefulOp:
+        (typeof EvtImpl.prototype.statelessByStatefulOp) | undefined;
+
+    private static __2: void = (() => {
+
+        if (false) { EvtImpl.__2; }
+
+        Object.defineProperties(EvtImpl.prototype,
+            ([
+                "__asyncHandlerChronologyMark",
+                "__asyncHandlerChronologyExceptionRange",
+                "__statelessByStatefulOp"
+            ] as const).map(key => [
+                key.substr(2),
+                {
+                    "get": function (this: EvtImpl<any>) {
+
+                        if (this[key] === undefined) {
+                            this[key] = new WeakMap<any, any>();
+                        }
+
+                        return this[key];
+
+                    }
+                }
+            ] as const).reduce<any>((prev, [key, obj]) => ({ ...prev, [key]: obj }), {})
+        );
+
+
+    })();
+
+    /*
+    NOTE: Used as Date.now() would be used to compare if an event is anterior 
+    or posterior to an other. We don't use Date.now() because two call within
+    less than a ms will return the same value unlike this function.
+    */
+    private __currentChronologyMark = 0;
+    private getChronologyMark() {
+        return this.__currentChronologyMark++;
+    }
+
+
+    private asyncHandlerCount: number = 0;
+
+    private detachHandler(
+        handler: Handler<T, any>,
+        wTimer: [Timer | undefined],
+        rejectPr: (error: _2.EvtError.Detached) => void
+    ) {
+
+        const index = this.handlers.indexOf(handler);
+
+        if (index < 0) {
+            return false;
+        }
+
+        if (typeGuard<Handler<T, any, _3.CtxLike<any>>>(handler, !!handler.ctx)) {
+            handler.ctx.zz__removeHandler(handler);
+        }
+
+
+        this.handlers.splice(index, 1);
+
+        if (handler.async) {
+            this.asyncHandlerCount--;
+        }
+
+        this.handlerTriggers.delete(handler);
+
+        if (wTimer[0] !== undefined) {
+
+            safeClearTimeout(wTimer[0]);
+
+            rejectPr(new _2.EvtError.Detached());
+
+        }
+
+        this.lazyEvtDetach.post(handler);
+
+        return true;
+
+    }
+
+
+    private triggerHandler<U>(
+        handler: Handler<T, U>,
+        wTimer: [Timer | undefined],
+        resolvePr: ((transformedData: any) => void) | undefined,
+        opResult: _1.Operator.fλ.Result.Matched<any, any>
+    ): PromiseLike<void> | undefined {
+
+        const { callback, once } = handler;
+
+        if (wTimer[0] !== undefined) {
+            safeClearTimeout(wTimer[0]);
+            wTimer[0] = undefined;
+        }
+
+        doDetachIfNeeded(handler, opResult, once);
+
+        const [transformedData] = opResult;
+
+        const prOrValue = callback?.call(
+            this,
+            transformedData
+        );
+
+        resolvePr?.(transformedData);
+
+        return isPromiseLike(prOrValue) ? prOrValue : undefined;
+
+    }
+
+    private addHandler<U>(
+        propsFromArgs: Handler.PropsFromArgs<T, U>,
+        propsFromMethodName: Handler.PropsFromMethodName
+    ): Handler<T, U> {
+
+        
+
+        if (_1.z_f1.fλ_Stateful_match<T, any, any>(propsFromArgs.op)) {
+
+            this.statelessByStatefulOp.set(
+                propsFromArgs.op,
+                encapsulateOpState(propsFromArgs.op)
+            );
+
+        }
+
+        const d = new Deferred<U>();
+
+        const wTimer: [Timer | undefined] = [undefined];
+
+        const handler: Handler<T, U> = {
+            ...propsFromArgs,
+            ...propsFromMethodName,
+            "detach": () => this.detachHandler(handler, wTimer, d.reject),
+            "promise": d.pr
+        };
+
+        if (typeof handler.timeout === "number") {
+
+            wTimer[0] = safeSetTimeout(() => {
+
+                wTimer[0] = undefined;
+
+                handler.detach();
+
+                d.reject(new _2.EvtError.Timeout(handler.timeout!));
+
+            }, handler.timeout);
+
+        }
+
+        this.handlerTriggers.set(
+            handler,
+            opResult => this.triggerHandler(
+                handler,
+                wTimer,
+                d.isPending ? d.resolve : undefined,
+                opResult
+            )
+        );
+
+        if (handler.async) {
+
+            this.asyncHandlerChronologyMark.set(
+                handler,
+                this.getChronologyMark()
+            );
+
+        }
+
+        if (handler.prepend) {
+
+            let i: number;
+
+            for (i = 0; i < this.handlers.length; i++) {
+
+                if (this.handlers[i].extract) {
+                    continue;
+                }
+
+                break;
+
+            }
+
+            this.handlers.splice(i, 0, handler);
+
+        } else {
+
+            this.handlers.push(handler);
+
+        }
+
+        if (handler.async) {
+            this.asyncHandlerCount++;
+        }
+
+        this.checkForPotentialMemoryLeak();
+
+        if (typeGuard<Handler<T, U, _3.CtxLike<any>>>(handler, !!handler.ctx)) {
+            handler.ctx.zz__addHandler(handler, this);
+        }
+
+        this.lazyEvtAttach.post(handler);
+
+        return handler;
+
+    }
+
+
+
+    private checkForPotentialMemoryLeak(): void {
+
+        const maxHandlers = this.__maxHandlers !== undefined ?
+            this.__maxHandlers :
+            EvtImpl.__defaultMaxHandlers
+            ;
+
+
+        if (
+            maxHandlers === 0 ||
+            this.handlers.length % (maxHandlers + 1) !== 0) {
+            return;
+        }
+
+        let message = [
+            `MaxHandlersExceededWarning: Possible Evt memory leak detected.`,
+            `${this.handlers.length} handlers attached${this.traceId ? ` to "${this.traceId}"` : ""}.\n`,
+            `Use Evt.prototype.setMaxHandlers(n) to increase limit on a specific Evt.\n`,
+            `Use Evt.setDefaultMaxHandlers(n) to change the default limit currently set to ${EvtImpl.__defaultMaxHandlers}.\n`,
+        ].join("");
+
+        const map = new Map<string, number>();
+
+        this.getHandlers()
+            .map(({ ctx, async, once, prepend, extract, op, callback }) => ({
+                "hasCtx": !!ctx,
+                once,
+                prepend,
+                extract,
+                "isWaitFor": async,
+                ...(op === matchAll ? {} : { "op": op.toString() }),
+                ...(!callback ? {} : { "callback": callback.toString() })
+            }))
+            .map(obj =>
+                "{\n" + Object.keys(obj)
+                    .map(key => `  ${key}: ${(obj as any)[key]}`)
+                    .join(",\n") + "\n}"
+            )
+            .forEach(str => map.set(str, (map.has(str) ? map.get(str)! : 0) + 1))
+            ;
+
+        message += "\n" + Array.from(map.keys())
+            .map(str => `${map.get(str)} handler${map.get(str) === 1 ? "" : "s"} like:\n${str}`)
+            .join("\n") + "\n";
+
+        if (this.traceId === null) {
+
+            message += "\n" + [
+                `To validate the identify of the Evt instance that is triggering this warning you can call`,
+                `Evt.prototype.enableTrace({ "id": "My evt id", "log": false }) on the Evt that you suspect.\n`
+            ].join(" ");
+
+        }
+
+        try {
+            console.warn(message);
+        } catch {
+        }
+
+    }
+
+    getStatelessOp<U, CtxResult>(op: _1.Operator<T, U, CtxResult>): _1.Operator.Stateless<T, U, CtxResult> {
+        return _1.z_f1.fλ_Stateful_match(op) ?
+            this.statelessByStatefulOp.get(op)! :
+            op
+    }
+
+    private trace(data: T) {
+
+        if (this.traceId === null) {
+            return;
+        }
+
+        let message = `(${this.traceId}) `;
+
+        const isExtracted = !!this.handlers.find(
+            ({ extract, op }) => (
+                extract &&
+                !!this.getStatelessOp(op)(data)
+            )
+        );
+
+        if (isExtracted) {
+
+            message += "extracted ";
+
+        } else {
+
+            const handlerCount = this.handlers
+                .filter(
+                    ({ extract, op }) => !extract &&
+                        !!this.getStatelessOp(op)(data)
+                )
+                .length;
+
+            message += `${handlerCount} handler${(handlerCount > 1) ? "s" : ""}, `;
+
+        }
+
+        this.log?.(message + this.traceFormatter(data));
+
+    }
+
+    /** Return [ isExtracted, prAllHandlerCallbacksResolved ] */
+    private postSync(data: T): readonly [boolean, Promise<void>] {
+
+        const prAllHandlerCallbacksResolved: PromiseLike<void>[] = [];
+
+        const getReturnValue = (isExtracted: boolean) => [
+            isExtracted,
+            Promise.all(prAllHandlerCallbacksResolved).then(() => { })
+        ] as const;
+
+
+        for (const handler of [...this.handlers]) {
+
+            const { async, op, extract } = handler;
+
+            if (async) {
+                continue;
+            }
+
+            const opResult = invokeOperator(
+                this.getStatelessOp(op),
+                data,
+                true
+            );
+
+            if (_1.z_f1.fλ_Result_NotMatched_match(opResult)) {
+
+                 doDetachIfNeeded(handler, opResult);
+
+                continue;
+
+            }
+
+            const handlerTrigger = this.handlerTriggers.get(handler);
+
+            //NOTE: Possible if detached while in the loop.
+            if (!handlerTrigger) {
+                continue;
+            }
+
+            const prOrUndefined = handlerTrigger(opResult);
+
+            if (prOrUndefined !== undefined) {
+                prAllHandlerCallbacksResolved.push(prOrUndefined);
+            }
+
+            if (extract) {
+                return getReturnValue(true);
+            }
+
+        }
+
+        return getReturnValue(false);
+
+    }
+
+    private postAsyncFactory() {
+        return runExclusive.buildMethodCb(
+            (data: T, postChronologyMark: number, releaseLock?) => {
+
+                if (this.asyncHandlerCount === 0) {
+                    releaseLock();
+                    return;
+                }
+
+                const promises: Promise<void>[] = [];
+
+                let chronologyMarkStartResolveTick: number;
+
+                //NOTE: Must be before handlerTrigger call.
+                Promise.resolve().then(
+                    () => chronologyMarkStartResolveTick = this.getChronologyMark()
+                );
+
+
+                for (const handler of [...this.handlers]) {
+
+                    if (!handler.async) {
+                        continue;
+                    }
+
+                    const opResult = invokeOperator(
+                        this.getStatelessOp(handler.op),
+                        data,
+                        true
+                    );
+
+                    if (_1.z_f1.fλ_Result_NotMatched_match(opResult)) {
+
+                        doDetachIfNeeded(handler, opResult);
+
+                        continue;
+
+                    }
+
+                    const handlerTrigger = this.handlerTriggers.get(handler);
+
+                    if (!handlerTrigger) {
+                        continue;
+                    }
+
+                    const shouldCallHandlerTrigger = (() => {
+
+                        const handlerMark = this.asyncHandlerChronologyMark.get(handler)!;
+
+                        if (postChronologyMark > handlerMark) {
+                            return true;
+                        }
+
+                        const exceptionRange = this.asyncHandlerChronologyExceptionRange.get(handler);
+
+                        return (
+                            exceptionRange !== undefined &&
+                            exceptionRange.lowerMark < postChronologyMark &&
+                            postChronologyMark < exceptionRange.upperMark &&
+                            handlerMark > exceptionRange.upperMark
+                        );
+
+                    })();
+
+                    if (!shouldCallHandlerTrigger) {
+                        continue;
+                    }
+
+                    promises.push(
+                        new Promise<void>(
+                            resolve => handler.promise
+                                .then(() => resolve())
+                                .catch(() => resolve())
+                        )
+                    );
+
+                    handlerTrigger(opResult);
+
+
+                }
+
+                if (promises.length === 0) {
+                    releaseLock();
+                    return;
+                }
+
+                const handlersDump = [...this.handlers];
+
+                Promise.all(promises).then(() => {
+
+                    for (const handler of this.handlers) {
+
+                        if (!handler.async) {
+                            continue;
+                        }
+
+                        if (handlersDump.indexOf(handler) >= 0) {
+                            continue;
+                        }
+
+                        this.asyncHandlerChronologyExceptionRange.set(
+                            handler,
+                            {
+                                "lowerMark": postChronologyMark,
+                                "upperMark": chronologyMarkStartResolveTick
+                            }
+                        );
+
+                    }
+
+                    releaseLock();
+
+                });
+
+            }
+        );
+    }
+
+    declare private postAsync: (
+        (
+            data: T,
+            postChronologyMark: number
+        ) => void
+    ) | undefined;
+
+    private static readonly propsFormMethodNames: Record<
+        "waitFor" | "attach" | "attachExtract" | "attachPrepend" | "attachOnce" |
+        "attachOncePrepend" | "attachOnceExtract"
+        ,
+        Handler.PropsFromMethodName
+    > = {
+            "waitFor": { "async": true, "extract": false, "once": true, "prepend": false },
+            "attach": { "async": false, "extract": false, "once": false, "prepend": false },
+            "attachExtract": { "async": false, "extract": true, "once": false, "prepend": true },
+            "attachPrepend": { "async": false, "extract": false, "once": false, "prepend": true },
+            "attachOnce": { "async": false, "extract": false, "once": true, "prepend": false },
+            "attachOncePrepend": { "async": false, "extract": false, "once": true, "prepend": true },
+            "attachOnceExtract": { "async": false, "extract": true, "once": true, "prepend": true }
+        };
+
+    isHandled(data: T): boolean {
+        return !!this.getHandlers()
+            .find(({ op }) => !!this.getStatelessOp(op)(data))
+            ;
+    }
+
+    getHandlers(): Handler<T, any>[] {
+        return [...this.handlers];
+    }
+
+    detach(ctx?: _3.CtxLike<any>): Handler<T, any, any>[] {
+
+        const detachedHandlers: Handler<T, any>[] = [];
+
+        for (const handler of this.getHandlers()) {
+
+            if (ctx !== undefined && handler.ctx !== ctx) {
+                continue;
+            }
+
+            const wasStillAttached = handler.detach();
+
+            //NOTE: It should not be possible.
+            if (!wasStillAttached) {
+                continue;
+            }
+
+            detachedHandlers.push(handler);
+
+        }
+
+        return detachedHandlers;
+
+    }
+
+    pipe(...args: any[]): Evt<any> {
+
+        const evtDelegate = new EvtImpl<any>();
+
+        this.addHandler(
+            {
+                ...parsePropsFromArgs<T>(args, "pipe"),
+                "callback": (transformedData: any) => evtDelegate.post(transformedData)
+            },
+            EvtImpl.propsFormMethodNames.attach
+        );
+
+        return evtDelegate;
+
+    }
+
+    waitFor(...args: any[]): Promise<any> {
+        return this.addHandler(
+            parsePropsFromArgs<T>(args, "waitFor"),
+            EvtImpl.propsFormMethodNames.waitFor
+        ).promise;
+    }
+
+    $attach(...inputs: any[]) {
+        return (this.attach as any)(...inputs);
+    }
+
+    attach(...args: any[]) {
+        return this.__attachX(args, "attach");
+    }
+
+    $attachOnce(...inputs: any[]) {
+        return (this.attachOnce as any)(...inputs);
+    }
+
+    attachOnce(...args: any[]) {
+        return this.__attachX(args, "attachOnce");
+    }
+
+    $attachExtract(...inputs: any[]) {
+        return (this.attachExtract as any)(...inputs);
+    }
+
+    attachExtract(...args: any[]) {
+        return this.__attachX(args, "attachExtract");
+    }
+
+    $attachPrepend(...inputs: any[]) {
+        return (this.attachPrepend as any)(...inputs);
+    }
+
+    attachPrepend(...args: any[]) {
+        return this.__attachX(args, "attachPrepend");
+    }
+
+    $attachOncePrepend(...inputs: any[]) {
+        return (this.attachOncePrepend as any)(...inputs);
+    }
+
+    attachOncePrepend(...args: any[]) {
+        return this.__attachX(args, "attachOncePrepend");
+    }
+
+    $attachOnceExtract(...inputs: any[]) {
+        return (this.attachOnceExtract as any)(...inputs);
+    }
+
+    attachOnceExtract(...args: any[]) {
+        return this.__attachX(args, "attachOnceExtract");
+    }
+
+    private __attachX(
+        args: any[],
+        methodName: keyof typeof EvtImpl.propsFormMethodNames
+    ): any {
+
+        const propsFromArgs = parsePropsFromArgs<T>(args, "attach*");
+
+        const handler = this.addHandler(
+            propsFromArgs,
+            EvtImpl.propsFormMethodNames[methodName]
+        );
+
+        return propsFromArgs.timeout === undefined ?
+            this :
+            handler.promise
+            ;
+
+    }
+
+    postAsyncOnceHandled(data: T): number | Promise<number> {
+
+        if (this.isHandled(data)) {
+            return this.post(data);
+        }
+
+        const d = new Deferred<number>();
+
+        this.evtAttach.attachOnce(
+            ({ op }) => !!invokeOperator(this.getStatelessOp(op), data),
+            () => Promise.resolve().then(() => d.resolve(this.post(data)))
+        );
+
+        return d.pr;
+
+    }
+
+    private postOrPostAndWait(data: T, wait: false): number;
+    private postOrPostAndWait(data: T, wait: true): Promise<void>;
+    private postOrPostAndWait(data: T, wait: boolean): number | Promise<void> {
+
+        this.trace(data);
+
+        overwriteReadonlyProp(this, "postCount", this.postCount + 1);
+
+        //NOTE: Must be before postSync.
+        const postChronologyMark = this.getChronologyMark();
+
+        const [isExtracted, prAllHandlerCallbacksResolved] = this.postSync(data);
+
+        const getReturnValue = wait ?
+            () => prAllHandlerCallbacksResolved :
+            () => this.postCount;
+
+        if (isExtracted) {
+            return getReturnValue();
+        }
+
+        if (this.postAsync === undefined) {
+
+            if (this.asyncHandlerCount === 0) {
+                return getReturnValue();
+            }
+
+            this.postAsync = this.postAsyncFactory();
+
+        }
+
+        this.postAsync(data, postChronologyMark);
+
+        return getReturnValue();
+
+    }
+
+    post(data: T) {
+        return this.postOrPostAndWait(data, false);
+    }
+
+    postAndWait(data: T) {
+        return this.postOrPostAndWait(data, true);
+    }
+
+}
+
+
+//NOTE: For some reason can't set it as static method so we put it here
+export function doDetachIfNeeded<U = any>(
+    handler: Handler<any, U>,
+    opResult: _1.Operator.fλ.Result.Matched<U, any>,
+    once: boolean
+): void;
+export function doDetachIfNeeded(
+    handler: Handler<any, any>,
+    opResult: _1.Operator.fλ.Result.NotMatched<any>,
+): void;
+export function doDetachIfNeeded<U = any>(
+    handler: Handler<any, U>,
+    opResult: _1.Operator.fλ.Result<U, any>,
+    once?: boolean
+): void {
+
+    const detach = _1.z_f1.fλ_Result_getDetachArg(opResult);
+
+    if (typeof detach !== "boolean") {
+        const [ctx, error, res] = detach;
+
+        if (!!error) {
+            ctx.abort(error);
+        } else {
+            ctx.done(res);
+        }
+    } else if (detach || !!once) {
+        handler.detach();
+    }
+
+}
+
+export const Evt: {
+    new <T>(): Evt<T>;
+    readonly prototype: Evt<any>;
+
+    readonly create: typeof create;
+
+    readonly newCtx: typeof newCtx;
+
+    readonly merge: typeof merge;
+
+    readonly from: typeof from;
+
+    readonly useEffect: typeof useEffect;
+
+    readonly getCtx: ReturnType<typeof getCtxFactory>;
+
+    readonly loosenType: typeof loosenType;
+
+    readonly factorize: typeof factorize;
+
+    readonly asPostable: typeof asPostable;
+
+    readonly asyncPipe: typeof asyncPipe;
+
+    readonly asNonPostable: typeof asNonPostable;
+
+    /** https://docs.evt.land/api/evt/setdefaultmaxhandlers */
+    setDefaultMaxHandlers(n: number): void;
+
+} = EvtImpl;
+
+try { overwriteReadonlyProp(Evt as any, "name", "Evt"); } catch { }
+
+importProxy.Evt = Evt;
+
diff --git a/ddb_main/node_modules/evt/src/lib/Evt.useEffect.ts b/ddb_main/node_modules/evt/src/lib/Evt.useEffect.ts
new file mode 100644
index 0000000..f3bd44f
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/Evt.useEffect.ts
@@ -0,0 +1,68 @@
+
+
+type EvtLike<T> = {
+    attach(callback: (data: T) => void): void;
+};
+
+type StatefulEvtLike<T> = {
+    evtChange: EvtLike<T>;
+    state: T;
+};
+
+/** https://docs.evt.land/api/evt/use-effect */
+export function useEffect<T>(
+    effect: (
+        data: T,
+        dataWrap: { isFirst: true } | { isFirst: false, data: T },
+        i: number
+    ) => void,
+    evt: StatefulEvtLike<T>
+): void;
+export function useEffect<T>(
+    effect: (
+        data: T,
+        dataWrap: { isFirst: true } | { isFirst: false, data: T },
+        i: number
+    ) => void,
+    evt: EvtLike<T>,
+    dataFirst: [T]
+): void;
+export function useEffect<T>(
+    effect: (
+        data: T | undefined,
+        dataWrap: { isFirst: true } | { isFirst: false, data: T },
+        i: number
+    ) => void,
+    evt: EvtLike<T>
+): void;
+export function useEffect<T>(
+    effect: (
+        data: T | undefined,
+        dataWrap: { isFirst: true } | { isFirst: false, data: T },
+        i: number
+    ) => void,
+    evt: EvtLike<T> | StatefulEvtLike<T>,
+    dataFirst?: [T]
+): void {
+
+    let i = 0;
+
+    ("state" in evt ? evt.evtChange : evt)
+        .attach(data =>
+            effect(
+                data,
+                { "isFirst": false, data },
+                i++
+            )
+        )
+        ;
+
+    effect(
+        "state" in evt ? evt.state : dataFirst?.[0], 
+        { "isFirst": true }, i++
+    );
+
+}
+
+
+
diff --git a/ddb_main/node_modules/evt/src/lib/LazyEvt.ts b/ddb_main/node_modules/evt/src/lib/LazyEvt.ts
new file mode 100644
index 0000000..ad49b66
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/LazyEvt.ts
@@ -0,0 +1,46 @@
+import { overwriteReadonlyProp } from "../tools/typeSafety/overwriteReadonlyProp";
+import { importProxy } from "./importProxy";
+type Evt<T> = import("./types/interfaces").Evt<T>;
+import { defineAccessors } from "../tools/typeSafety/defineAccessors";
+
+export class LazyEvt<T> {
+
+    private initialPostCount = 0;
+
+    declare readonly evt: Evt<T>;
+    declare private __evt: Evt<T>;
+
+    private static __1: void = (() => {
+
+        if (false) { LazyEvt.__1; }
+
+        defineAccessors(LazyEvt.prototype, "evt", {
+            "get": function (this: LazyEvt<any>) {
+
+                if (this.__evt === undefined) {
+                    this.__evt = new importProxy.Evt();
+                    overwriteReadonlyProp(this.__evt, "postCount", this.initialPostCount);
+                }
+
+                return this.__evt;
+
+            }
+        });
+
+
+    })();
+
+    post(data: T): number {
+
+        if (this.__evt === undefined) {
+
+            return ++this.initialPostCount;
+
+        }
+
+        return this.__evt.post(data);
+
+    }
+
+
+}
diff --git a/ddb_main/node_modules/evt/src/lib/LazyStatefulEvt.ts b/ddb_main/node_modules/evt/src/lib/LazyStatefulEvt.ts
new file mode 100644
index 0000000..ac10f86
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/LazyStatefulEvt.ts
@@ -0,0 +1,55 @@
+import { overwriteReadonlyProp } from "../tools/typeSafety/overwriteReadonlyProp";
+import { importProxy } from "./importProxy";
+type StatefulEvt<T> = import("./types/interfaces").StatefulEvt<T>;
+import { defineAccessors } from "../tools/typeSafety/defineAccessors";
+
+export class LazyStatefulEvt<T> {
+
+    private initialPostCount = 0;
+    private initialState: T;
+
+    declare readonly evt: StatefulEvt<T>;
+    declare private __evt: StatefulEvt<T>;
+
+    constructor(initialState: T){
+        this.initialState = initialState;
+    }
+
+    private static __1: void = (() => {
+
+        if (false) { LazyStatefulEvt.__1; }
+
+        defineAccessors(LazyStatefulEvt.prototype, "evt", {
+            "get": function (this: LazyStatefulEvt<any>) {
+
+                if (this.__evt === undefined) {
+                    this.__evt = new importProxy.StatefulEvt(this.initialState);
+                    delete this.initialState;
+                    overwriteReadonlyProp(this.__evt, "postCount", this.initialPostCount);
+                }
+
+                return this.__evt;
+
+            }
+        });
+
+
+    })();
+
+    post(data: T): number {
+
+        if (this.__evt === undefined) {
+
+            this.initialState = data;
+
+            return ++this.initialPostCount;
+
+
+        }
+
+        return this.__evt.post(data);
+
+    }
+
+
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/StatefulEvt.ts b/ddb_main/node_modules/evt/src/lib/StatefulEvt.ts
new file mode 100644
index 0000000..b6e2563
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/StatefulEvt.ts
@@ -0,0 +1,138 @@
+import "minimal-polyfills/Object.is";
+import { defineAccessors } from "../tools/typeSafety/defineAccessors";
+import { LazyEvt } from "./LazyEvt";
+import { LazyStatefulEvt } from "./LazyStatefulEvt";
+import { importProxy } from "./importProxy";
+import { invokeOperator } from "./util/invokeOperator";
+import { parsePropsFromArgs } from "./Evt.parsePropsFromArgs";
+import type { CtxLike } from "./types/interfaces/CtxLike";
+type Diff<T> = import("./types/interfaces").Diff<T>;
+type NonPostableEvt<T> = import("./types/interfaces").NonPostableEvt<T>;
+type StatefulReadonlyEvt<T>= import("./types/interfaces").StatefulReadonlyEvt<T>;
+import { Evt } from "./Evt";
+
+import * as _1 from "./types/Operator";
+
+/** https://docs.evt.land/api/statefulevt */
+export type StatefulEvt<T> = import("./types/interfaces").StatefulEvt<T>;
+
+class StatefulEvtImpl<T> extends Evt<T> implements StatefulEvt<T> {
+
+    __state: T;
+    declare state: T;
+
+    constructor(initialState: T) {
+        super();
+        this.__state = initialState;
+        this.lazyEvtChange = new LazyStatefulEvt(this.__state);
+    }
+
+    private readonly lazyEvtDiff = new LazyEvt<Diff<T>>();
+    declare public readonly evtDiff: NonPostableEvt<Diff<T>>;
+
+    private readonly lazyEvtChange: LazyStatefulEvt<T>;
+    declare public readonly evtChange: StatefulReadonlyEvt<T>;
+
+    private readonly lazyEvtChangeDiff = new LazyEvt<Diff<T>>();
+    declare public readonly evtChangeDiff: NonPostableEvt<Diff<T>>;
+
+    private static __4: void = (() => {
+
+        if (false) { StatefulEvtImpl.__4 }
+
+        defineAccessors(
+            StatefulEvtImpl.prototype,
+            "state",
+            {
+                "get": function (this: StatefulEvtImpl<any>) { return this.__state; },
+                "set": function (this: StatefulEvtImpl<any>, state) { this.post(state); }
+            }
+        );
+
+        defineAccessors(
+            StatefulEvtImpl.prototype,
+            "evtDiff",
+            { "get": function (this: StatefulEvtImpl<any>) { return this.lazyEvtDiff.evt; } }
+        );
+
+        defineAccessors(
+            StatefulEvtImpl.prototype,
+            "evtChange",
+            { "get": function (this: StatefulEvtImpl<any>) { return this.lazyEvtChange.evt; } }
+        );
+
+        defineAccessors(
+            StatefulEvtImpl.prototype,
+            "evtChangeDiff",
+            { "get": function (this: StatefulEvtImpl<any>) { return this.lazyEvtChangeDiff.evt; } }
+        );
+
+    })();
+
+    post(data: T): number {
+        return this.__post(data, false);
+    }
+
+    postForceChange(wData?: readonly [T]): number {
+        return this.__post( !!wData ? wData[0] : this.state, true);
+    }
+
+    private __post(data: T, forceChange: boolean): number {
+
+        const prevState = this.state;
+
+        this.__state = data;
+
+        const diff = { prevState, "newState": this.state };
+
+        this.lazyEvtDiff.post(diff);
+
+        if (forceChange || !Object.is(prevState, this.state)) {
+            this.lazyEvtChange.post(this.state);
+            this.lazyEvtChangeDiff.post(diff);
+        }
+
+        return super.post(data);
+
+    }
+
+    pipe(...args: any[]): StatefulEvt<any> {
+
+        const evt = super
+            .pipe(...(args as Parameters<typeof importProxy.Evt.prototype.pipe>))
+            ;
+
+        const opResult = invokeOperator(
+            this.getStatelessOp(
+                parsePropsFromArgs(args, "pipe").op
+            ),
+            this.state
+        );
+
+        if (_1.z_f1.fλ_Result_NotMatched_match(opResult)) {
+
+            throw new Error([
+                "Cannot pipe StatefulEvt because the operator does not match",
+                "it's current state.",
+                "Use evt.toStateless([ctx]).pipe(op).toStatic(initialState)",
+                "to be sure the StatefulEvt is correctly initialized"
+            ].join(" "));
+
+        }
+
+        return evt.toStateful(opResult[0]);
+
+    }
+
+    toStateless(ctx?: CtxLike): Evt<any> {
+        return !!ctx ? super.pipe(ctx) : super.pipe();
+    }
+
+}
+
+export const StatefulEvt: {
+    new <T>(initialState: T): StatefulEvt<T>;
+    readonly prototype: StatefulEvt<any>;
+} = StatefulEvtImpl;
+
+importProxy.StatefulEvt = StatefulEvt;
diff --git a/ddb_main/node_modules/evt/src/lib/importProxy.ts b/ddb_main/node_modules/evt/src/lib/importProxy.ts
new file mode 100644
index 0000000..55fc58a
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/importProxy.ts
@@ -0,0 +1,11 @@
+
+
+/** Manually handling circular import so React Native does not gives warning. */
+export const importProxy: {
+    Ctx: typeof import("./Ctx").Ctx;
+    Evt: typeof import("./Evt").Evt;
+    StatefulEvt: typeof import("./StatefulEvt").StatefulEvt;
+} = {} as any;
+
+
+
diff --git a/ddb_main/node_modules/evt/src/lib/index.ts b/ddb_main/node_modules/evt/src/lib/index.ts
new file mode 100644
index 0000000..2b52c6c
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/index.ts
@@ -0,0 +1,9 @@
+
+export * from "./types";
+export * from "./util";
+
+export { Ctx } from "./Ctx";
+export { Evt } from "./Evt";
+export { StatefulEvt } from "./StatefulEvt";
+
+export { matchVoid } from "../tools/typeSafety/matchVoid";
diff --git a/ddb_main/node_modules/evt/src/lib/types/EventTargetLike.ts b/ddb_main/node_modules/evt/src/lib/types/EventTargetLike.ts
new file mode 100644
index 0000000..b6dd008
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/types/EventTargetLike.ts
@@ -0,0 +1,155 @@
+
+import { typeGuard } from "../../tools/typeSafety";
+
+export const z_2 = {
+    "RxJSSubject_match":
+        function match<T>(eventTarget: EventTargetLike<T>): eventTarget is EventTargetLike.RxJSSubject<T> {
+            return (
+                typeGuard<EventTargetLike.RxJSSubject<T>>(eventTarget) &&
+                eventTarget instanceof Object &&
+                typeof eventTarget.subscribe === "function"
+            );
+        },
+    "NodeStyleEventEmitter_match":
+        function match<T>(eventTarget: EventTargetLike<T>): eventTarget is EventTargetLike.NodeStyleEventEmitter {
+            return (
+                typeGuard<EventTargetLike.NodeStyleEventEmitter>(eventTarget) &&
+                eventTarget instanceof Object &&
+                typeof eventTarget.addListener === "function" &&
+                typeof eventTarget.removeListener === "function"
+            );
+        },
+    "JQueryStyleEventEmitter_match":
+        function match<T>(eventTarget: EventTargetLike<T>): eventTarget is EventTargetLike.JQueryStyleEventEmitter {
+            return (
+                typeGuard<EventTargetLike.JQueryStyleEventEmitter>(eventTarget) &&
+                eventTarget instanceof Object &&
+                typeof eventTarget.on === "function" &&
+                typeof eventTarget.off === "function"
+            );
+        },
+    "HasEventTargetAddRemove_match":
+
+        function match<T>(eventTarget: EventTargetLike<T>): eventTarget is EventTargetLike.HasEventTargetAddRemove<T> {
+            return (
+                typeGuard<EventTargetLike.HasEventTargetAddRemove<T>>(eventTarget) &&
+                eventTarget instanceof Object &&
+                typeof eventTarget.addEventListener === "function" &&
+                typeof eventTarget.removeEventListener === "function"
+            );
+        },
+    "canBe":
+        function canBe(o: any): boolean {
+
+            try {
+
+                return (
+                    z_2.HasEventTargetAddRemove_match(o) ||
+                    z_2.NodeStyleEventEmitter_match(o) ||
+                    z_2.JQueryStyleEventEmitter_match(o) ||
+                    z_2.RxJSSubject_match(o)
+                );
+
+            } catch {
+
+                return false;
+
+            }
+
+        }
+
+
+};
+
+export type EventTargetLike<T> =
+    EventTargetLike.HasEventTargetAddRemove<T> |
+    EventTargetLike.NodeStyleEventEmitter |
+    EventTargetLike.JQueryStyleEventEmitter |
+    EventTargetLike.RxJSSubject<T>
+    ;
+
+export namespace EventTargetLike {
+
+    export type HTMLElement = HasEventTargetAddRemove<any> & {
+        innerText: string;
+    };
+
+    export type Window = HasEventTargetAddRemove<any> & {
+        document: EventTargetLike.Document;
+    };
+
+    export type Document = HasEventTargetAddRemove<any> & {
+        URL: string;
+    };
+
+    export type RxJSSubject<T> = {
+        subscribe: (next: (data: T) => void) => RxJSSubject.Subscription;
+    };
+
+    export namespace RxJSSubject {
+
+        export type Subscription = {
+            unsubscribe(): void;
+        };
+
+        export const match = z_2.RxJSSubject_match;
+
+    }
+
+
+    export type NodeStyleEventEmitter =
+        NodeStyleEventEmitter.Compat |
+        NodeStyleEventEmitter.Regular
+        ;
+
+    export namespace NodeStyleEventEmitter {
+
+        export interface Regular {
+            addListener: (eventName: string | symbol, handler: NodeEventHandler) => this;
+            removeListener: (eventName: string | symbol, handler: NodeEventHandler) => this;
+        };
+
+        export interface Compat {
+            addListener: (eventName: string, handler: NodeEventHandler) => void | {};
+            removeListener: (eventName: string, handler: NodeEventHandler) => void | {};
+        }
+
+        export declare type NodeEventHandler = (...args: any[]) => void;
+
+        export const match = z_2.NodeStyleEventEmitter_match;
+
+    }
+
+    export interface JQueryStyleEventEmitter {
+        on: (eventName: string, handler: Function) => void;
+        off: (eventName: string, handler: Function) => void;
+    }
+
+    export namespace JQueryStyleEventEmitter {
+
+        export const match = z_2.JQueryStyleEventEmitter_match;
+
+    }
+
+    export interface HasEventTargetAddRemove<E> {
+        addEventListener(type: string, listener: ((evt: E) => void) | null, options?: boolean | HasEventTargetAddRemove.Options): void;
+        removeEventListener(type: string, listener?: ((evt: E) => void) | null, options?: HasEventTargetAddRemove.Options | boolean): void;
+    }
+
+    export namespace HasEventTargetAddRemove {
+
+        export interface Options {
+            capture?: boolean;
+            passive?: boolean;
+            once?: boolean;
+        }
+
+        export const match = z_2.HasEventTargetAddRemove_match;
+
+    }
+
+
+    /* Return true if o can be a EventTargetLike */
+    export const canBe = z_2.canBe;
+
+}
diff --git a/ddb_main/node_modules/evt/src/lib/types/EvtError.Detached.ts b/ddb_main/node_modules/evt/src/lib/types/EvtError.Detached.ts
new file mode 100644
index 0000000..11109b2
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/types/EvtError.Detached.ts
@@ -0,0 +1,7 @@
+
+    export class Detached extends Error {
+        constructor() {
+            super(`Evt handler detached`);
+            Object.setPrototypeOf(this, new.target.prototype);
+        }
+    }
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/types/EvtError.Timeout.ts b/ddb_main/node_modules/evt/src/lib/types/EvtError.Timeout.ts
new file mode 100644
index 0000000..71fb81b
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/types/EvtError.Timeout.ts
@@ -0,0 +1,8 @@
+
+
+    export class Timeout extends Error {
+        constructor(public readonly timeout: number) {
+            super(`Evt timeout after ${timeout}ms`);
+            Object.setPrototypeOf(this, new.target.prototype);
+        }
+    }
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/types/EvtError.ts b/ddb_main/node_modules/evt/src/lib/types/EvtError.ts
new file mode 100644
index 0000000..6f88dad
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/types/EvtError.ts
@@ -0,0 +1,25 @@
+
+import * as _1 from "./EvtError.Timeout";
+import * as _2 from "./EvtError.Detached";
+
+export type EvtError =
+    EvtError.Timeout |
+    EvtError.Detached
+    ;
+export namespace EvtError {
+
+    export type Timeout = typeof _1.Timeout["prototype"];
+
+    export const Timeout: {
+        new(timeout: number): Timeout;
+        readonly prototype: Timeout;
+    } = _1.Timeout;
+
+    export type Detached = typeof _2.Detached["prototype"];
+
+    export const Detached: {
+        new(): Detached;
+        readonly prototype: Detached;
+    } = _2.Detached;
+
+}
diff --git a/ddb_main/node_modules/evt/src/lib/types/Operator.ts b/ddb_main/node_modules/evt/src/lib/types/Operator.ts
new file mode 100644
index 0000000..7fe3a72
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/types/Operator.ts
@@ -0,0 +1,176 @@
+import { typeGuard } from "../../tools/typeSafety";
+type CtxLike<Result> = import("./interfaces").CtxLike<Result>;
+type VoidCtxLike = import("./interfaces").VoidCtxLike;
+
+export const z_f1 = {
+    "fλ_Stateful_match": function match<T, U, CtxResult>(op: Operator<T, U, CtxResult>): op is Operator.fλ.Stateful<T, U, CtxResult> {
+        return typeof op !== "function";
+    },
+    "fλ_Result_match": function match<U, CtxResult>(result: any): result is Operator.fλ.Result<U, CtxResult> {
+        return z_f1.fλ_Result_Matched_match(result) || z_f1.fλ_Result_NotMatched_match(result);
+    },
+    "fλ_Result_getDetachArg": function getDetachArg<CtxResult>(result: Operator.fλ.Result<any, CtxResult>): boolean | [CtxLike<CtxResult>, undefined | Error, CtxResult] {
+
+        const detach = z_f1.fλ_Result_Matched_match<any, CtxResult>(result) ? result[1] : result;
+
+        if (z_f1.fλ_Result_Detach_FromEvt_match(detach)) {
+            return true;
+        }
+
+        if (z_f1.fλ_Result_Detach_WithCtxArg_match<CtxResult>(detach)) {
+            return [
+                detach.DETACH as Exclude<typeof detach.DETACH, VoidCtxLike>,
+                (detach as Extract<Operator.fλ.Result<any, CtxResult>, { err: any }>).err,
+                (detach as Extract<Operator.fλ.Result<any, CtxResult>, { res: any }>).res
+            ];
+        }
+
+        return false;
+
+    },
+    "fλ_Result_NotMatched_match": function match<CtxResult>(result: any): result is Operator.fλ.Result.NotMatched<CtxResult> {
+        return (
+            result === null ||
+            z_f1.fλ_Result_Detach_match(result)
+        );
+    },
+    "fλ_Result_Matched_match": function match<U, CtxResult>(
+        result: any,
+    ): result is Operator.fλ.Result.Matched<U, CtxResult> {
+        return (
+            typeGuard<Operator.fλ.Result.Matched<U, CtxResult>>(result) &&
+            result instanceof Object &&
+            !("input" in result) && //exclude String.prototype.match
+            (
+                result.length === 1 ||
+                (
+                    result.length === 2 &&
+                    (
+                        result[1] === null ||
+                        z_f1.fλ_Result_Detach_match(result[1])
+                    )
+                )
+            )
+        );
+    },
+    "fλ_Result_Detach_FromEvt_match": function match(detach: any): detach is Operator.fλ.Result.Detach.FromEvt {
+        return detach === "DETACH";
+    },
+    "fλ_Result_Detach_WithCtxArg_match": function match<CtxResult>(detach: any): detach is Operator.fλ.Result.Detach.WithCtxArg<CtxResult> {
+        return (
+            typeGuard<Operator.fλ.Result.Detach<CtxResult>>(detach) &&
+            detach instanceof Object &&
+            detach.DETACH instanceof Object
+        );
+    },
+    "fλ_Result_Detach_match": function match<CtxResult>(detach: any): detach is Operator.fλ.Result.Detach<CtxResult> {
+        return z_f1.fλ_Result_Detach_FromEvt_match(detach) || z_f1.fλ_Result_Detach_WithCtxArg_match(detach);
+    }
+
+
+};
+
+
+/** https://docs.evt.land/api/operator */
+export type Operator<T, U, CtxResult = any> =
+    Operator.fλ<T, U, CtxResult> |
+    ((data: U) => boolean) | //Filter
+    (U extends T ? (data: T) => data is U : never) //Type guard
+    ;
+
+export namespace Operator {
+
+    export type fλ<T, U, CtxResult = any> =
+        fλ.Stateless<T, U, CtxResult> |
+        fλ.Stateful<T, U, CtxResult>
+        ;
+
+    export namespace fλ {
+
+        export type Stateless<T, U, CtxResult = any> = (data: T, prev?: undefined, isPost?: true) => Result<U, CtxResult>;
+
+        export type Stateful<T, U, CtxResult = any> = [
+            (data: T, prev: U, isPost?: true) => Result<U, CtxResult>,
+            U //Seed
+        ];
+
+        export namespace Stateful {
+
+            export const match = z_f1.fλ_Stateful_match;
+
+        }
+
+        export type Result<U, CtxResult = any> = Result.Matched<U, CtxResult> | Result.NotMatched<CtxResult>;
+
+        export namespace Result {
+
+            export const match = z_f1.fλ_Result_match;
+
+            export const getDetachArg = z_f1.fλ_Result_getDetachArg;
+
+            export type NotMatched<CtxResult = any> = Detach<CtxResult> | null;
+
+            export namespace NotMatched {
+
+                export const match = z_f1.fλ_Result_NotMatched_match;
+
+            }
+
+            export type Matched<U, CtxResult = any> = Matched.NoDetachArg<U> | Matched.WithDetachArg<U, CtxResult>;
+
+            export namespace Matched {
+
+                export type NoDetachArg<U> = readonly [U];
+
+                export type WithDetachArg<U, CtxResult = any> = readonly [U, Detach<CtxResult> | null];
+
+                export const match = z_f1.fλ_Result_Matched_match;
+
+            }
+
+            export type Detach<CtxResult = any> = Detach.FromEvt | Detach.WithCtxArg<CtxResult>;
+
+            export namespace Detach {
+
+                export type FromEvt = "DETACH";
+
+                export namespace FromEvt {
+
+                    export const match = z_f1.fλ_Result_Detach_FromEvt_match;
+
+
+                }
+
+                export type WithCtxArg<CtxResult = any> = WithCtxArg.Void | WithCtxArg.Arg<CtxResult>;
+
+                export namespace WithCtxArg {
+
+                    export type Void =
+                        { DETACH: VoidCtxLike; err: Error; } |
+                        { DETACH: VoidCtxLike; }
+                        ;
+
+                    export type Arg<CtxResult> =
+                        { DETACH: CtxLike<CtxResult>; err: Error; } |
+                        { DETACH: CtxLike<CtxResult>; res: CtxResult; }
+                        ;
+
+                    export const match = z_f1.fλ_Result_Detach_WithCtxArg_match;
+
+                }
+
+                export const match = z_f1.fλ_Result_Detach_match;
+
+            }
+
+        }
+
+    }
+
+    export type Stateless<T, U, CtxResult = any> =
+        fλ.Stateless<T, U, CtxResult> |
+        ((data: U) => boolean) |
+        (U extends T ? (data: T) => data is U : never)
+        ;
+
+}
diff --git a/ddb_main/node_modules/evt/src/lib/types/index.ts b/ddb_main/node_modules/evt/src/lib/types/index.ts
new file mode 100644
index 0000000..d491937
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/types/index.ts
@@ -0,0 +1,178 @@
+export * from "./helper";
+export * from "./interfaces";
+
+export * from "./EventTargetLike";
+
+/*
+import * as ns1 from "./EventTargetLike";
+
+export type EventTargetLike<T> = ns1.EventTargetLike<T>;
+
+export namespace EventTargetLike {
+    export type HTMLElement = ns1.EventTargetLike.HTMLElement;
+    export type Window = ns1.EventTargetLike.Window;
+    export type Document = ns1.EventTargetLike.Document;
+    export type RxJSSubject<T> = ns1.EventTargetLike.RxJSSubject<T>;
+    export namespace RxJSSubject {
+        export type Subscription = ns1.EventTargetLike.RxJSSubject.Subscription;
+        export const match = ns1.EventTargetLike.RxJSSubject.match;
+    }
+    export type NodeStyleEventEmitter = ns1.EventTargetLike.NodeStyleEventEmitter;
+    export namespace NodeStyleEventEmitter {
+        export type Regular = ns1.EventTargetLike.NodeStyleEventEmitter.Regular;
+        export type Compat = ns1.EventTargetLike.NodeStyleEventEmitter.Compat;
+        export declare type NodeEventHandler = ns1.EventTargetLike.NodeStyleEventEmitter.NodeEventHandler;
+        export const match = ns1.EventTargetLike.NodeStyleEventEmitter.match;
+    }
+    export type JQueryStyleEventEmitter = ns1.EventTargetLike.JQueryStyleEventEmitter;
+    export namespace JQueryStyleEventEmitter {
+        export const match = ns1.EventTargetLike.JQueryStyleEventEmitter.match;
+    }
+    export type HasEventTargetAddRemove<E> = ns1.EventTargetLike.HasEventTargetAddRemove<E>;
+    export namespace HasEventTargetAddRemove {
+        export type Options = ns1.EventTargetLike.HasEventTargetAddRemove.Options;
+        export const match = ns1.EventTargetLike.HasEventTargetAddRemove.match;
+    }
+    export const canBe = ns1.EventTargetLike.canBe;
+}
+*/
+
+/*
+import * as ns2 from "./EvtError";
+
+export type EvtError = ns2.EvtError;
+
+export namespace EvtError {
+
+    export type Timeout = typeof ns2.EvtError.Timeout["prototype"];
+
+    export const Timeout: {
+        new(timeout: number): Timeout;
+        readonly prototype: Timeout;
+    } = ns2.EvtError.Timeout;
+
+    export type Detached = typeof ns2.EvtError.Detached["prototype"];
+
+    export const Detached: {
+        new(): Detached;
+        readonly prototype: Detached;
+    } = ns2.EvtError.Detached;
+
+}
+*/
+
+export * from "./EvtError";
+
+export * from "./Handler";
+
+//type CtxLike<Result> = import("../types/interfaces").CtxLike<Result>;
+//
+//
+///** https://docs.evt.land/api/handler */
+//export type Handler<T, U, CtxProp extends CtxLike<any> | undefined = CtxLike<any> | undefined> =
+//    import("./Handler").Handler<T, U, CtxProp>;
+//
+//export namespace Handler {
+//
+//    /** Handlers params that come from the arguments passed to the method invoked */
+//    export type PropsFromArgs<T, U, CtxProp extends CtxLike<any> | undefined = CtxLike<any> | undefined> =
+//        import("./Handler").Handler.PropsFromArgs<T, U, CtxProp>;
+//
+//    /** 
+//     * Handlers params that are implicitly specified by the method used: 
+//     * attachOnce => once
+//     * attachOncePrepend => once + prepend
+//     * waitFor => once + async
+//     * ...
+//     */
+//    export type PropsFromMethodName =
+//        import("./Handler").Handler.PropsFromMethodName;
+//
+//    export namespace PropsFromMethodName {
+//
+//        export type Sync =
+//            import("./Handler").Handler.PropsFromMethodName.Sync;
+//
+//        export type Async =
+//            import("./Handler").Handler.PropsFromMethodName.Async;
+//
+//    }
+//
+//    export type WithEvt<T, CtxResult> =
+//        import("./Handler").Handler.WithEvt<T, CtxResult>;
+//
+//
+//}
+
+import * as dom from "./lib.dom"; export { dom };
+
+export * from "./Operator";
+
+/*
+import * as ns3 from "./Operator";
+
+export type Operator<T, U, CtxResult = any> = ns3.Operator<T, U, CtxResult>;
+export namespace Operator {
+
+    export type fλ<T, U, CtxResult = any> = ns3.Operator.fλ<T, U, CtxResult>;
+
+    export namespace fλ {
+
+        export type Stateless<T, U, CtxResult = any> = ns3.Operator.fλ.Stateless<T, U, CtxResult>;
+        export type Stateful<T, U, CtxResult = any> = ns3.Operator.fλ.Stateful<T,U,CtxResult>;
+        export namespace Stateful {
+            export const match = ns3.Operator.fλ.Stateful.match;
+        }
+
+        export type Result<U, CtxResult = any> = ns3.Operator.fλ.Result<U,CtxResult>;
+
+        export namespace Result {
+            export const match = ns3.Operator.fλ.Result.match;
+            export const getDetachArg= ns3.Operator.fλ.Result.getDetachArg;
+            export type NotMatched<CtxResult = any> = ns3.Operator.fλ.Result.NotMatched<CtxResult>;
+            export namespace NotMatched {
+                export const match = ns3.Operator.fλ.Result.NotMatched.match;
+            }
+
+            export type Matched<U, CtxResult= any> = ns3.Operator.fλ.Result.Matched<U, CtxResult>;
+
+            export namespace Matched {
+
+                export type NoDetachArg<U> = ns3.Operator.fλ.Result.Matched.NoDetachArg<U>;
+                export type WithDetachArg<U, CtxResult = any> = ns3.Operator.fλ.Result.Matched.WithDetachArg<U, CtxResult>;
+                export const match = ns3.Operator.fλ.Result.Matched.match;
+
+            }
+
+            export type Detach<CtxResult = any> = ns3.Operator.fλ.Result.Detach<CtxResult>;
+            export namespace Detach {
+
+                export type FromEvt = ns3.Operator.fλ.Result.Detach.FromEvt;
+
+                export namespace FromEvt {
+                    export const match = ns3.Operator.fλ.Result.Detach.FromEvt.match;
+                }
+
+                export type WithCtxArg<CtxResult = any> = ns3.Operator.fλ.Result.Detach.WithCtxArg<CtxResult>;
+
+                export namespace WithCtxArg {
+
+
+                    export type Void = ns3.Operator.fλ.Result.Detach.WithCtxArg.Void;
+                    export type Arg<CtxResult> = ns3.Operator.fλ.Result.Detach.WithCtxArg.Arg<CtxResult>;
+                    export const match = ns3.Operator.fλ.Result.Detach.WithCtxArg.match;
+
+                }
+
+                export const match = ns3.Operator.fλ.Result.Detach.match;
+
+            }
+
+        }
+
+    }
+
+    export type Stateless<T, U, CtxResult = any> = ns3.Operator.Stateless<T, U, CtxResult>;
+
+}
+*/
diff --git a/ddb_main/node_modules/evt/src/lib/types/interfaces/CtxLike.ts b/ddb_main/node_modules/evt/src/lib/types/interfaces/CtxLike.ts
new file mode 100644
index 0000000..835a043
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/types/interfaces/CtxLike.ts
@@ -0,0 +1,42 @@
+
+import { typeGuard } from "../../../tools/typeSafety/typeGuard";
+type EvtLike<T> = import("../helper/UnpackEvt").EvtLike<T>;
+
+type Handler<T, U, CtxProp extends CtxLike<any> | undefined = CtxLike<any> | undefined> =
+    import("../Handler").Handler<T, U, CtxProp>;
+
+export const z_3 = {
+    "match":
+        function match<T = any>(o: any): o is CtxLike<T> {
+            return (
+                typeGuard<CtxLike>(o) &&
+                o instanceof Object &&
+                typeof o.done === "function" &&
+                typeof o.abort === "function" &&
+                typeof o.zz__addHandler === "function" &&
+                typeof o.zz__removeHandler === "function"
+            );
+        }
+}
+
+/** 
+ * Minimal interface that an object must implement to be a valid context argument 
+ * ( for interop between mismatching EVT versions )
+ * */
+export interface CtxLike<Result = any> {
+    done(result: Result): void;
+    abort(error: Error): void;
+    zz__addHandler<T>(handler: Handler<T, any, CtxLike<Result>>, evt: EvtLike<T>): void;
+    zz__removeHandler<T>(handler: Handler<T, any, CtxLike<Result>>): void;
+}
+
+export namespace CtxLike {
+
+    export const match = z_3.match;
+
+}
+
+
+export interface VoidCtxLike extends CtxLike<void> {
+    done(): void;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/types/interfaces/index.ts b/ddb_main/node_modules/evt/src/lib/types/interfaces/index.ts
new file mode 100644
index 0000000..961b6b9
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/types/interfaces/index.ts
@@ -0,0 +1,15 @@
+
+export * from "./Ctx";
+export * from "./CtxLike";
+export * from "./Evt";
+export type NonPostableEvt<T>= import("./NonPostableEvt").NonPostableEvt<T>;
+export * from "./Postable";
+export * from "./StatefulEvt";
+
+export type StatefulReadonlyEvt<T>= import("./StatefulReadonlyEvt").StatefulReadonlyEvt<T>;
+export type Diff<T> = import("./StatefulReadonlyEvt").StateDiff<T>;
+
+export * from "./StatefulPostable";
+
+export * from "./VoidCtx";
+export * from "./VoidEvt";
diff --git a/ddb_main/node_modules/evt/src/lib/types/lib.dom.ts b/ddb_main/node_modules/evt/src/lib/types/lib.dom.ts
new file mode 100644
index 0000000..3664d18
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/types/lib.dom.ts
@@ -0,0 +1,16199 @@
+
+/* 
+This is a curated re export of the dom API definitions.
+
+The DOM definitions are available only when "compilerOptions": { "lib": ["DOM"] }}
+is present in the tsconfig.json.
+
+We need we re-export those definitions so that we can expose methods that interact with
+the DOM ( ex Evt.from ) while not producing type error when
+EVT is imported in project that does not use 'lib DOM', typically 
+projects that targets Node.JS.
+*/
+
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation. All rights reserved. 
+Licensed under the Apache License, Version 2.0 (the "License"); you may not use
+this file except in compliance with the License. You may obtain a copy of the
+License at http://www.apache.org/licenses/LICENSE-2.0  
+ 
+THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
+WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, 
+MERCHANTABLITY OR NON-INFRINGEMENT. 
+ 
+See the Apache Version 2.0 License for specific language governing permissions
+and limitations under the License.
+***************************************************************************** */
+
+export const __hack= "NOT TYPE ONLY";
+
+/////////////////////////////
+/// DOM APIs
+/////////////////////////////
+
+export interface Account {
+    displayName: string;
+    id: string;
+    imageURL?: string;
+    name?: string;
+    rpDisplayName: string;
+}
+
+export interface AddEventListenerOptions extends EventListenerOptions {
+    once?: boolean;
+    passive?: boolean;
+}
+
+export interface AesCbcParams extends Algorithm {
+    iv: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer;
+}
+
+export interface AesCtrParams extends Algorithm {
+    counter: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer;
+    length: number;
+}
+
+export interface AesDerivedKeyParams extends Algorithm {
+    length: number;
+}
+
+export interface AesGcmParams extends Algorithm {
+    additionalData?: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer;
+    iv: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer;
+    tagLength?: number;
+}
+
+export interface AesKeyAlgorithm extends KeyAlgorithm {
+    length: number;
+}
+
+export interface AesKeyGenParams extends Algorithm {
+    length: number;
+}
+
+export interface Algorithm {
+    name: string;
+}
+
+export interface AnalyserOptions extends AudioNodeOptions {
+    fftSize?: number;
+    maxDecibels?: number;
+    minDecibels?: number;
+    smoothingTimeConstant?: number;
+}
+
+export interface AnimationEventInit extends EventInit {
+    animationName?: string;
+    elapsedTime?: number;
+    pseudoElement?: string;
+}
+
+export interface AnimationPlaybackEventInit extends EventInit {
+    currentTime?: number | null;
+    timelineTime?: number | null;
+}
+
+export interface AssertionOptions {
+    allowList?: ScopedCredentialDescriptor[];
+    extensions?: WebAuthnExtensions;
+    rpId?: string;
+    timeoutSeconds?: number;
+}
+
+export interface AssignedNodesOptions {
+    flatten?: boolean;
+}
+
+export interface AudioBufferOptions {
+    length: number;
+    numberOfChannels?: number;
+    sampleRate: number;
+}
+
+export interface AudioBufferSourceOptions {
+    buffer?: AudioBuffer | null;
+    detune?: number;
+    loop?: boolean;
+    loopEnd?: number;
+    loopStart?: number;
+    playbackRate?: number;
+}
+
+export interface AudioContextInfo {
+    currentTime?: number;
+    sampleRate?: number;
+}
+
+export interface AudioContextOptions {
+    latencyHint?: AudioContextLatencyCategory | number;
+    sampleRate?: number;
+}
+
+export interface AudioNodeOptions {
+    channelCount?: number;
+    channelCountMode?: ChannelCountMode;
+    channelInterpretation?: ChannelInterpretation;
+}
+
+export interface AudioParamDescriptor {
+    automationRate?: AutomationRate;
+    defaultValue?: number;
+    maxValue?: number;
+    minValue?: number;
+    name: string;
+}
+
+export interface AudioProcessingEventInit extends EventInit {
+    inputBuffer: AudioBuffer;
+    outputBuffer: AudioBuffer;
+    playbackTime: number;
+}
+
+export interface AudioTimestamp {
+    contextTime?: number;
+    performanceTime?: number;
+}
+
+export interface AudioWorkletNodeOptions extends AudioNodeOptions {
+    numberOfInputs?: number;
+    numberOfOutputs?: number;
+    outputChannelCount?: number[];
+    parameterData?: Record<string, number>;
+    processorOptions?: any;
+}
+
+export interface AuthenticationExtensionsClientInputs {
+    appid?: string;
+    authnSel?: AuthenticatorSelectionList;
+    exts?: boolean;
+    loc?: boolean;
+    txAuthGeneric?: txAuthGenericArg;
+    txAuthSimple?: string;
+    uvi?: boolean;
+    uvm?: boolean;
+}
+
+export interface AuthenticationExtensionsClientOutputs {
+    appid?: boolean;
+    authnSel?: boolean;
+    exts?: AuthenticationExtensionsSupported;
+    loc?: Coordinates;
+    txAuthGeneric?: ArrayBuffer;
+    txAuthSimple?: string;
+    uvi?: ArrayBuffer;
+    uvm?: UvmEntries;
+}
+
+export interface AuthenticatorSelectionCriteria {
+    authenticatorAttachment?: AuthenticatorAttachment;
+    requireResidentKey?: boolean;
+    userVerification?: UserVerificationRequirement;
+}
+
+export interface BiquadFilterOptions extends AudioNodeOptions {
+    Q?: number;
+    detune?: number;
+    frequency?: number;
+    gain?: number;
+    type?: BiquadFilterType;
+}
+
+export interface BlobPropertyBag {
+    endings?: EndingType;
+    type?: string;
+}
+
+export interface ByteLengthChunk {
+    byteLength?: number;
+}
+
+export interface CacheQueryOptions {
+    ignoreMethod?: boolean;
+    ignoreSearch?: boolean;
+    ignoreVary?: boolean;
+}
+
+export interface CanvasRenderingContext2DSettings {
+    alpha?: boolean;
+    desynchronized?: boolean;
+}
+
+export interface ChannelMergerOptions extends AudioNodeOptions {
+    numberOfInputs?: number;
+}
+
+export interface ChannelSplitterOptions extends AudioNodeOptions {
+    numberOfOutputs?: number;
+}
+
+export interface ClientData {
+    challenge: string;
+    extensions?: WebAuthnExtensions;
+    hashAlg: string | Algorithm;
+    origin: string;
+    rpId: string;
+    tokenBinding?: string;
+}
+
+export interface ClientQueryOptions {
+    includeUncontrolled?: boolean;
+    type?: ClientTypes;
+}
+
+export interface ClipboardEventInit extends EventInit {
+    clipboardData?: DataTransfer | null;
+}
+
+export interface CloseEventInit extends EventInit {
+    code?: number;
+    reason?: string;
+    wasClean?: boolean;
+}
+
+export interface CompositionEventInit extends UIEventInit {
+    data?: string;
+}
+
+export interface ComputedEffectTiming extends EffectTiming {
+    activeDuration?: number;
+    currentIteration?: number | null;
+    endTime?: number;
+    localTime?: number | null;
+    progress?: number | null;
+}
+
+export interface ComputedKeyframe {
+    composite: CompositeOperationOrAuto;
+    computedOffset: number;
+    easing: string;
+    offset: number | null;
+    [property: string]: string | number | null | undefined;
+}
+
+export interface ConfirmSiteSpecificExceptionsInformation extends ExceptionInformation {
+    arrayOfDomainStrings?: string[];
+}
+
+export interface ConstantSourceOptions {
+    offset?: number;
+}
+
+export interface ConstrainBooleanParameters {
+    exact?: boolean;
+    ideal?: boolean;
+}
+
+export interface ConstrainDOMStringParameters {
+    exact?: string | string[];
+    ideal?: string | string[];
+}
+
+export interface ConstrainDoubleRange extends DoubleRange {
+    exact?: number;
+    ideal?: number;
+}
+
+export interface ConstrainULongRange extends ULongRange {
+    exact?: number;
+    ideal?: number;
+}
+
+export interface ConstrainVideoFacingModeParameters {
+    exact?: VideoFacingModeEnum | VideoFacingModeEnum[];
+    ideal?: VideoFacingModeEnum | VideoFacingModeEnum[];
+}
+
+export interface ConvolverOptions extends AudioNodeOptions {
+    buffer?: AudioBuffer | null;
+    disableNormalization?: boolean;
+}
+
+export interface CredentialCreationOptions {
+    publicKey?: PublicKeyCredentialCreationOptions;
+    signal?: AbortSignal;
+}
+
+export interface CredentialRequestOptions {
+    mediation?: CredentialMediationRequirement;
+    publicKey?: PublicKeyCredentialRequestOptions;
+    signal?: AbortSignal;
+}
+
+export interface CustomEventInit<T = any> extends EventInit {
+    detail?: T;
+}
+
+export interface DOMMatrix2DInit {
+    a?: number;
+    b?: number;
+    c?: number;
+    d?: number;
+    e?: number;
+    f?: number;
+    m11?: number;
+    m12?: number;
+    m21?: number;
+    m22?: number;
+    m41?: number;
+    m42?: number;
+}
+
+export interface DOMMatrixInit extends DOMMatrix2DInit {
+    is2D?: boolean;
+    m13?: number;
+    m14?: number;
+    m23?: number;
+    m24?: number;
+    m31?: number;
+    m32?: number;
+    m33?: number;
+    m34?: number;
+    m43?: number;
+    m44?: number;
+}
+
+export interface DOMPointInit {
+    w?: number;
+    x?: number;
+    y?: number;
+    z?: number;
+}
+
+export interface DOMQuadInit {
+    p1?: DOMPointInit;
+    p2?: DOMPointInit;
+    p3?: DOMPointInit;
+    p4?: DOMPointInit;
+}
+
+export interface DOMRectInit {
+    height?: number;
+    width?: number;
+    x?: number;
+    y?: number;
+}
+
+export interface DelayOptions extends AudioNodeOptions {
+    delayTime?: number;
+    maxDelayTime?: number;
+}
+
+export interface DeviceLightEventInit extends EventInit {
+    value?: number;
+}
+
+export interface DeviceMotionEventAccelerationInit {
+    x?: number | null;
+    y?: number | null;
+    z?: number | null;
+}
+
+export interface DeviceMotionEventInit extends EventInit {
+    acceleration?: DeviceMotionEventAccelerationInit;
+    accelerationIncludingGravity?: DeviceMotionEventAccelerationInit;
+    interval?: number;
+    rotationRate?: DeviceMotionEventRotationRateInit;
+}
+
+export interface DeviceMotionEventRotationRateInit {
+    alpha?: number | null;
+    beta?: number | null;
+    gamma?: number | null;
+}
+
+export interface DeviceOrientationEventInit extends EventInit {
+    absolute?: boolean;
+    alpha?: number | null;
+    beta?: number | null;
+    gamma?: number | null;
+}
+
+export interface DevicePermissionDescriptor extends PermissionDescriptor {
+    deviceId?: string;
+    name: "camera" | "microphone" | "speaker";
+}
+
+export interface DocumentTimelineOptions {
+    originTime?: number;
+}
+
+export interface DoubleRange {
+    max?: number;
+    min?: number;
+}
+
+export interface DragEventInit extends MouseEventInit {
+    dataTransfer?: DataTransfer | null;
+}
+
+export interface DynamicsCompressorOptions extends AudioNodeOptions {
+    attack?: number;
+    knee?: number;
+    ratio?: number;
+    release?: number;
+    threshold?: number;
+}
+
+export interface EcKeyAlgorithm extends KeyAlgorithm {
+    namedCurve: NamedCurve;
+}
+
+export interface EcKeyGenParams extends Algorithm {
+    namedCurve: NamedCurve;
+}
+
+export interface EcKeyImportParams extends Algorithm {
+    namedCurve: NamedCurve;
+}
+
+export interface EcdhKeyDeriveParams extends Algorithm {
+    public: CryptoKey;
+}
+
+export interface EcdsaParams extends Algorithm {
+    hash: HashAlgorithmIdentifier;
+}
+
+export interface EffectTiming {
+    delay?: number;
+    direction?: PlaybackDirection;
+    duration?: number | string;
+    easing?: string;
+    endDelay?: number;
+    fill?: FillMode;
+    iterationStart?: number;
+    iterations?: number;
+}
+
+export interface ElementCreationOptions {
+    is?: string;
+}
+
+export interface ElementDefinitionOptions {
+    extends?: string;
+}
+
+export interface ErrorEventInit extends EventInit {
+    colno?: number;
+    error?: any;
+    filename?: string;
+    lineno?: number;
+    message?: string;
+}
+
+export interface EventInit {
+    bubbles?: boolean;
+    cancelable?: boolean;
+    composed?: boolean;
+}
+
+export interface EventListenerOptions {
+    capture?: boolean;
+}
+
+export interface EventModifierInit extends UIEventInit {
+    altKey?: boolean;
+    ctrlKey?: boolean;
+    metaKey?: boolean;
+    modifierAltGraph?: boolean;
+    modifierCapsLock?: boolean;
+    modifierFn?: boolean;
+    modifierFnLock?: boolean;
+    modifierHyper?: boolean;
+    modifierNumLock?: boolean;
+    modifierScrollLock?: boolean;
+    modifierSuper?: boolean;
+    modifierSymbol?: boolean;
+    modifierSymbolLock?: boolean;
+    shiftKey?: boolean;
+}
+
+export interface EventSourceInit {
+    withCredentials?: boolean;
+}
+
+export interface ExceptionInformation {
+    domain?: string | null;
+}
+
+export interface FilePropertyBag extends BlobPropertyBag {
+    lastModified?: number;
+}
+
+export interface FocusEventInit extends UIEventInit {
+    relatedTarget?: EventTarget | null;
+}
+
+export interface FocusNavigationEventInit extends EventInit {
+    navigationReason?: string | null;
+    originHeight?: number;
+    originLeft?: number;
+    originTop?: number;
+    originWidth?: number;
+}
+
+export interface FocusNavigationOrigin {
+    originHeight?: number;
+    originLeft?: number;
+    originTop?: number;
+    originWidth?: number;
+}
+
+export interface FocusOptions {
+    preventScroll?: boolean;
+}
+
+export interface FullscreenOptions {
+    navigationUI?: FullscreenNavigationUI;
+}
+
+export interface GainOptions extends AudioNodeOptions {
+    gain?: number;
+}
+
+export interface GamepadEventInit extends EventInit {
+    gamepad: Gamepad;
+}
+
+export interface GetNotificationOptions {
+    tag?: string;
+}
+
+export interface GetRootNodeOptions {
+    composed?: boolean;
+}
+
+export interface HashChangeEventInit extends EventInit {
+    newURL?: string;
+    oldURL?: string;
+}
+
+export interface HkdfParams extends Algorithm {
+    hash: HashAlgorithmIdentifier;
+    info: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer;
+    salt: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer;
+}
+
+export interface HmacImportParams extends Algorithm {
+    hash: HashAlgorithmIdentifier;
+    length?: number;
+}
+
+export interface HmacKeyAlgorithm extends KeyAlgorithm {
+    hash: KeyAlgorithm;
+    length: number;
+}
+
+export interface HmacKeyGenParams extends Algorithm {
+    hash: HashAlgorithmIdentifier;
+    length?: number;
+}
+
+export interface IDBIndexParameters {
+    multiEntry?: boolean;
+    unique?: boolean;
+}
+
+export interface IDBObjectStoreParameters {
+    autoIncrement?: boolean;
+    keyPath?: string | string[] | null;
+}
+
+export interface IDBVersionChangeEventInit extends EventInit {
+    newVersion?: number | null;
+    oldVersion?: number;
+}
+
+export interface IIRFilterOptions extends AudioNodeOptions {
+    feedback: number[];
+    feedforward: number[];
+}
+
+export interface ImageBitmapRenderingContextSettings {
+    alpha?: boolean;
+}
+
+export interface ImageEncodeOptions {
+    quality?: number;
+    type?: string;
+}
+
+export interface InputEventInit extends UIEventInit {
+    data?: string | null;
+    inputType?: string;
+    isComposing?: boolean;
+}
+
+export interface IntersectionObserverEntryInit {
+    boundingClientRect: DOMRectInit;
+    intersectionRatio: number;
+    intersectionRect: DOMRectInit;
+    isIntersecting: boolean;
+    rootBounds: DOMRectInit | null;
+    target: Element;
+    time: number;
+}
+
+export interface IntersectionObserverInit {
+    root?: Element | null;
+    rootMargin?: string;
+    threshold?: number | number[];
+}
+
+export interface JsonWebKey {
+    alg?: string;
+    crv?: string;
+    d?: string;
+    dp?: string;
+    dq?: string;
+    e?: string;
+    ext?: boolean;
+    k?: string;
+    key_ops?: string[];
+    kty?: string;
+    n?: string;
+    oth?: RsaOtherPrimesInfo[];
+    p?: string;
+    q?: string;
+    qi?: string;
+    use?: string;
+    x?: string;
+    y?: string;
+}
+
+export interface KeyAlgorithm {
+    name: string;
+}
+
+export interface KeyboardEventInit extends EventModifierInit {
+    code?: string;
+    isComposing?: boolean;
+    key?: string;
+    location?: number;
+    repeat?: boolean;
+}
+
+export interface Keyframe {
+    composite?: CompositeOperationOrAuto;
+    easing?: string;
+    offset?: number | null;
+    [property: string]: string | number | null | undefined;
+}
+
+export interface KeyframeAnimationOptions extends KeyframeEffectOptions {
+    id?: string;
+}
+
+export interface KeyframeEffectOptions extends EffectTiming {
+    composite?: CompositeOperation;
+    iterationComposite?: IterationCompositeOperation;
+}
+
+export interface MediaElementAudioSourceOptions {
+    mediaElement: HTMLMediaElement;
+}
+
+export interface MediaEncryptedEventInit extends EventInit {
+    initData?: ArrayBuffer | null;
+    initDataType?: string;
+}
+
+export interface MediaKeyMessageEventInit extends EventInit {
+    message: ArrayBuffer;
+    messageType: MediaKeyMessageType;
+}
+
+export interface MediaKeySystemConfiguration {
+    audioCapabilities?: MediaKeySystemMediaCapability[];
+    distinctiveIdentifier?: MediaKeysRequirement;
+    initDataTypes?: string[];
+    label?: string;
+    persistentState?: MediaKeysRequirement;
+    sessionTypes?: string[];
+    videoCapabilities?: MediaKeySystemMediaCapability[];
+}
+
+export interface MediaKeySystemMediaCapability {
+    contentType?: string;
+    robustness?: string;
+}
+
+export interface MediaQueryListEventInit extends EventInit {
+    matches?: boolean;
+    media?: string;
+}
+
+export interface MediaStreamAudioSourceOptions {
+    mediaStream: MediaStream;
+}
+
+export interface MediaStreamConstraints {
+    audio?: boolean | MediaTrackConstraints;
+    peerIdentity?: string;
+    video?: boolean | MediaTrackConstraints;
+}
+
+export interface MediaStreamErrorEventInit extends EventInit {
+    error?: MediaStreamError | null;
+}
+
+export interface MediaStreamEventInit extends EventInit {
+    stream?: MediaStream;
+}
+
+export interface MediaStreamTrackAudioSourceOptions {
+    mediaStreamTrack: MediaStreamTrack;
+}
+
+export interface MediaStreamTrackEventInit extends EventInit {
+    track: MediaStreamTrack;
+}
+
+export interface MediaTrackCapabilities {
+    aspectRatio?: DoubleRange;
+    autoGainControl?: boolean[];
+    channelCount?: ULongRange;
+    deviceId?: string;
+    echoCancellation?: boolean[];
+    facingMode?: string[];
+    frameRate?: DoubleRange;
+    groupId?: string;
+    height?: ULongRange;
+    latency?: DoubleRange;
+    noiseSuppression?: boolean[];
+    resizeMode?: string[];
+    sampleRate?: ULongRange;
+    sampleSize?: ULongRange;
+    width?: ULongRange;
+}
+
+export interface MediaTrackConstraintSet {
+    aspectRatio?: ConstrainDouble;
+    autoGainControl?: ConstrainBoolean;
+    channelCount?: ConstrainULong;
+    deviceId?: ConstrainDOMString;
+    echoCancellation?: ConstrainBoolean;
+    facingMode?: ConstrainDOMString;
+    frameRate?: ConstrainDouble;
+    groupId?: ConstrainDOMString;
+    height?: ConstrainULong;
+    latency?: ConstrainDouble;
+    noiseSuppression?: ConstrainBoolean;
+    resizeMode?: ConstrainDOMString;
+    sampleRate?: ConstrainULong;
+    sampleSize?: ConstrainULong;
+    width?: ConstrainULong;
+}
+
+export interface MediaTrackConstraints extends MediaTrackConstraintSet {
+    advanced?: MediaTrackConstraintSet[];
+}
+
+export interface MediaTrackSettings {
+    aspectRatio?: number;
+    autoGainControl?: boolean;
+    channelCount?: number;
+    deviceId?: string;
+    echoCancellation?: boolean;
+    facingMode?: string;
+    frameRate?: number;
+    groupId?: string;
+    height?: number;
+    latency?: number;
+    noiseSuppression?: boolean;
+    resizeMode?: string;
+    sampleRate?: number;
+    sampleSize?: number;
+    width?: number;
+}
+
+export interface MediaTrackSupportedConstraints {
+    aspectRatio?: boolean;
+    autoGainControl?: boolean;
+    channelCount?: boolean;
+    deviceId?: boolean;
+    echoCancellation?: boolean;
+    facingMode?: boolean;
+    frameRate?: boolean;
+    groupId?: boolean;
+    height?: boolean;
+    latency?: boolean;
+    noiseSuppression?: boolean;
+    resizeMode?: boolean;
+    sampleRate?: boolean;
+    sampleSize?: boolean;
+    width?: boolean;
+}
+
+export interface MessageEventInit extends EventInit {
+    data?: any;
+    lastEventId?: string;
+    origin?: string;
+    ports?: MessagePort[];
+    source?: MessageEventSource | null;
+}
+
+export interface MidiPermissionDescriptor extends PermissionDescriptor {
+    name: "midi";
+    sysex?: boolean;
+}
+
+export interface MouseEventInit extends EventModifierInit {
+    button?: number;
+    buttons?: number;
+    clientX?: number;
+    clientY?: number;
+    movementX?: number;
+    movementY?: number;
+    relatedTarget?: EventTarget | null;
+    screenX?: number;
+    screenY?: number;
+}
+
+export interface MultiCacheQueryOptions extends CacheQueryOptions {
+    cacheName?: string;
+}
+
+export interface MutationObserverInit {
+    /**
+     * Set to a list of attribute local names (without namespace) if not all attribute mutations need to be observed and attributes is true or omitted.
+     */
+    attributeFilter?: string[];
+    /**
+     * Set to true if attributes is true or omitted and target's attribute value before the mutation needs to be recorded.
+     */
+    attributeOldValue?: boolean;
+    /**
+     * Set to true if mutations to target's attributes are to be observed. Can be omitted if attributeOldValue or attributeFilter is specified.
+     */
+    attributes?: boolean;
+    /**
+     * Set to true if mutations to target's data are to be observed. Can be omitted if characterDataOldValue is specified.
+     */
+    characterData?: boolean;
+    /**
+     * Set to true if characterData is set to true or omitted and target's data before the mutation needs to be recorded.
+     */
+    characterDataOldValue?: boolean;
+    /**
+     * Set to true if mutations to target's children are to be observed.
+     */
+    childList?: boolean;
+    /**
+     * Set to true if mutations to not just target, but also target's descendants are to be observed.
+     */
+    subtree?: boolean;
+}
+
+export interface NavigationPreloadState {
+    enabled?: boolean;
+    headerValue?: string;
+}
+
+export interface NotificationAction {
+    action: string;
+    icon?: string;
+    title: string;
+}
+
+export interface NotificationOptions {
+    actions?: NotificationAction[];
+    badge?: string;
+    body?: string;
+    data?: any;
+    dir?: NotificationDirection;
+    icon?: string;
+    image?: string;
+    lang?: string;
+    renotify?: boolean;
+    requireInteraction?: boolean;
+    silent?: boolean;
+    tag?: string;
+    timestamp?: number;
+    vibrate?: VibratePattern;
+}
+
+export interface OfflineAudioCompletionEventInit extends EventInit {
+    renderedBuffer: AudioBuffer;
+}
+
+export interface OfflineAudioContextOptions {
+    length: number;
+    numberOfChannels?: number;
+    sampleRate: number;
+}
+
+export interface OptionalEffectTiming {
+    delay?: number;
+    direction?: PlaybackDirection;
+    duration?: number | string;
+    easing?: string;
+    endDelay?: number;
+    fill?: FillMode;
+    iterationStart?: number;
+    iterations?: number;
+}
+
+export interface OscillatorOptions extends AudioNodeOptions {
+    detune?: number;
+    frequency?: number;
+    periodicWave?: PeriodicWave;
+    type?: OscillatorType;
+}
+
+export interface PageTransitionEventInit extends EventInit {
+    persisted?: boolean;
+}
+
+export interface PannerOptions extends AudioNodeOptions {
+    coneInnerAngle?: number;
+    coneOuterAngle?: number;
+    coneOuterGain?: number;
+    distanceModel?: DistanceModelType;
+    maxDistance?: number;
+    orientationX?: number;
+    orientationY?: number;
+    orientationZ?: number;
+    panningModel?: PanningModelType;
+    positionX?: number;
+    positionY?: number;
+    positionZ?: number;
+    refDistance?: number;
+    rolloffFactor?: number;
+}
+
+export interface PaymentCurrencyAmount {
+    currency: string;
+    currencySystem?: string;
+    value: string;
+}
+
+export interface PaymentDetailsBase {
+    displayItems?: PaymentItem[];
+    modifiers?: PaymentDetailsModifier[];
+    shippingOptions?: PaymentShippingOption[];
+}
+
+export interface PaymentDetailsInit extends PaymentDetailsBase {
+    id?: string;
+    total: PaymentItem;
+}
+
+export interface PaymentDetailsModifier {
+    additionalDisplayItems?: PaymentItem[];
+    data?: any;
+    supportedMethods: string | string[];
+    total?: PaymentItem;
+}
+
+export interface PaymentDetailsUpdate extends PaymentDetailsBase {
+    error?: string;
+    total?: PaymentItem;
+}
+
+export interface PaymentItem {
+    amount: PaymentCurrencyAmount;
+    label: string;
+    pending?: boolean;
+}
+
+export interface PaymentMethodData {
+    data?: any;
+    supportedMethods: string | string[];
+}
+
+export interface PaymentOptions {
+    requestPayerEmail?: boolean;
+    requestPayerName?: boolean;
+    requestPayerPhone?: boolean;
+    requestShipping?: boolean;
+    shippingType?: string;
+}
+
+export interface PaymentRequestUpdateEventInit extends EventInit {
+}
+
+export interface PaymentShippingOption {
+    amount: PaymentCurrencyAmount;
+    id: string;
+    label: string;
+    selected?: boolean;
+}
+
+export interface Pbkdf2Params extends Algorithm {
+    hash: HashAlgorithmIdentifier;
+    iterations: number;
+    salt: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer;
+}
+
+export interface PerformanceObserverInit {
+    buffered?: boolean;
+    entryTypes?: string[];
+    type?: string;
+}
+
+export interface PeriodicWaveConstraints {
+    disableNormalization?: boolean;
+}
+
+export interface PeriodicWaveOptions extends PeriodicWaveConstraints {
+    imag?: number[] | Float32Array;
+    real?: number[] | Float32Array;
+}
+
+export interface PermissionDescriptor {
+    name: PermissionName;
+}
+
+export interface PipeOptions {
+    preventAbort?: boolean;
+    preventCancel?: boolean;
+    preventClose?: boolean;
+    signal?: AbortSignal;
+}
+
+export interface PointerEventInit extends MouseEventInit {
+    height?: number;
+    isPrimary?: boolean;
+    pointerId?: number;
+    pointerType?: string;
+    pressure?: number;
+    tangentialPressure?: number;
+    tiltX?: number;
+    tiltY?: number;
+    twist?: number;
+    width?: number;
+}
+
+export interface PopStateEventInit extends EventInit {
+    state?: any;
+}
+
+export interface PositionOptions {
+    enableHighAccuracy?: boolean;
+    maximumAge?: number;
+    timeout?: number;
+}
+
+export interface PostMessageOptions {
+    transfer?: any[];
+}
+
+export interface ProgressEventInit extends EventInit {
+    lengthComputable?: boolean;
+    loaded?: number;
+    total?: number;
+}
+
+export interface PromiseRejectionEventInit extends EventInit {
+    promise: Promise<any>;
+    reason?: any;
+}
+
+export interface PropertyIndexedKeyframes {
+    composite?: CompositeOperationOrAuto | CompositeOperationOrAuto[];
+    easing?: string | string[];
+    offset?: number | (number | null)[];
+    [property: string]: string | string[] | number | null | (number | null)[] | undefined;
+}
+
+export interface PublicKeyCredentialCreationOptions {
+    attestation?: AttestationConveyancePreference;
+    authenticatorSelection?: AuthenticatorSelectionCriteria;
+    challenge: BufferSource;
+    excludeCredentials?: PublicKeyCredentialDescriptor[];
+    extensions?: AuthenticationExtensionsClientInputs;
+    pubKeyCredParams: PublicKeyCredentialParameters[];
+    rp: PublicKeyCredentialRpEntity;
+    timeout?: number;
+    user: PublicKeyCredentialUserEntity;
+}
+
+export interface PublicKeyCredentialDescriptor {
+    id: BufferSource;
+    transports?: AuthenticatorTransport[];
+    type: PublicKeyCredentialType;
+}
+
+export interface PublicKeyCredentialEntity {
+    icon?: string;
+    name: string;
+}
+
+export interface PublicKeyCredentialParameters {
+    alg: COSEAlgorithmIdentifier;
+    type: PublicKeyCredentialType;
+}
+
+export interface PublicKeyCredentialRequestOptions {
+    allowCredentials?: PublicKeyCredentialDescriptor[];
+    challenge: BufferSource;
+    extensions?: AuthenticationExtensionsClientInputs;
+    rpId?: string;
+    timeout?: number;
+    userVerification?: UserVerificationRequirement;
+}
+
+export interface PublicKeyCredentialRpEntity extends PublicKeyCredentialEntity {
+    id?: string;
+}
+
+export interface PublicKeyCredentialUserEntity extends PublicKeyCredentialEntity {
+    displayName: string;
+    id: BufferSource;
+}
+
+export interface PushPermissionDescriptor extends PermissionDescriptor {
+    name: "push";
+    userVisibleOnly?: boolean;
+}
+
+export interface PushSubscriptionJSON {
+    endpoint?: string;
+    expirationTime?: number | null;
+    keys?: Record<string, string>;
+}
+
+export interface PushSubscriptionOptionsInit {
+    applicationServerKey?: BufferSource | string | null;
+    userVisibleOnly?: boolean;
+}
+
+export interface QueuingStrategy<T = any> {
+    highWaterMark?: number;
+    size?: QueuingStrategySizeCallback<T>;
+}
+
+export interface RTCAnswerOptions extends RTCOfferAnswerOptions {
+}
+
+export interface RTCCertificateExpiration {
+    expires?: number;
+}
+
+export interface RTCConfiguration {
+    bundlePolicy?: RTCBundlePolicy;
+    certificates?: RTCCertificate[];
+    iceCandidatePoolSize?: number;
+    iceServers?: RTCIceServer[];
+    iceTransportPolicy?: RTCIceTransportPolicy;
+    peerIdentity?: string;
+    rtcpMuxPolicy?: RTCRtcpMuxPolicy;
+}
+
+export interface RTCDTMFToneChangeEventInit extends EventInit {
+    tone: string;
+}
+
+export interface RTCDataChannelEventInit extends EventInit {
+    channel: RTCDataChannel;
+}
+
+export interface RTCDataChannelInit {
+    id?: number;
+    maxPacketLifeTime?: number;
+    maxRetransmits?: number;
+    negotiated?: boolean;
+    ordered?: boolean;
+    priority?: RTCPriorityType;
+    protocol?: string;
+}
+
+export interface RTCDtlsFingerprint {
+    algorithm?: string;
+    value?: string;
+}
+
+export interface RTCDtlsParameters {
+    fingerprints?: RTCDtlsFingerprint[];
+    role?: RTCDtlsRole;
+}
+
+export interface RTCErrorEventInit extends EventInit {
+    error: RTCError;
+}
+
+export interface RTCErrorInit {
+    errorDetail: RTCErrorDetailType;
+    httpRequestStatusCode?: number;
+    receivedAlert?: number;
+    sctpCauseCode?: number;
+    sdpLineNumber?: number;
+    sentAlert?: number;
+}
+
+export interface RTCIceCandidateAttributes extends RTCStats {
+    addressSourceUrl?: string;
+    candidateType?: RTCStatsIceCandidateType;
+    ipAddress?: string;
+    portNumber?: number;
+    priority?: number;
+    transport?: string;
+}
+
+export interface RTCIceCandidateComplete {
+}
+
+export interface RTCIceCandidateDictionary {
+    foundation?: string;
+    ip?: string;
+    msMTurnSessionId?: string;
+    port?: number;
+    priority?: number;
+    protocol?: RTCIceProtocol;
+    relatedAddress?: string;
+    relatedPort?: number;
+    tcpType?: RTCIceTcpCandidateType;
+    type?: RTCIceCandidateType;
+}
+
+export interface RTCIceCandidateInit {
+    candidate?: string;
+    sdpMLineIndex?: number | null;
+    sdpMid?: string | null;
+    usernameFragment?: string | null;
+}
+
+export interface RTCIceCandidatePair {
+    local?: RTCIceCandidate;
+    remote?: RTCIceCandidate;
+}
+
+export interface RTCIceCandidatePairStats extends RTCStats {
+    availableIncomingBitrate?: number;
+    availableOutgoingBitrate?: number;
+    bytesReceived?: number;
+    bytesSent?: number;
+    localCandidateId?: string;
+    nominated?: boolean;
+    priority?: number;
+    readable?: boolean;
+    remoteCandidateId?: string;
+    roundTripTime?: number;
+    state?: RTCStatsIceCandidatePairState;
+    transportId?: string;
+    writable?: boolean;
+}
+
+export interface RTCIceGatherOptions {
+    gatherPolicy?: RTCIceGatherPolicy;
+    iceservers?: RTCIceServer[];
+}
+
+export interface RTCIceParameters {
+    password?: string;
+    usernameFragment?: string;
+}
+
+export interface RTCIceServer {
+    credential?: string | RTCOAuthCredential;
+    credentialType?: RTCIceCredentialType;
+    urls: string | string[];
+    username?: string;
+}
+
+export interface RTCIdentityProviderOptions {
+    peerIdentity?: string;
+    protocol?: string;
+    usernameHint?: string;
+}
+
+export interface RTCInboundRTPStreamStats extends RTCRTPStreamStats {
+    bytesReceived?: number;
+    fractionLost?: number;
+    jitter?: number;
+    packetsLost?: number;
+    packetsReceived?: number;
+}
+
+export interface RTCMediaStreamTrackStats extends RTCStats {
+    audioLevel?: number;
+    echoReturnLoss?: number;
+    echoReturnLossEnhancement?: number;
+    frameHeight?: number;
+    frameWidth?: number;
+    framesCorrupted?: number;
+    framesDecoded?: number;
+    framesDropped?: number;
+    framesPerSecond?: number;
+    framesReceived?: number;
+    framesSent?: number;
+    remoteSource?: boolean;
+    ssrcIds?: string[];
+    trackIdentifier?: string;
+}
+
+export interface RTCOAuthCredential {
+    accessToken: string;
+    macKey: string;
+}
+
+export interface RTCOfferAnswerOptions {
+    voiceActivityDetection?: boolean;
+}
+
+export interface RTCOfferOptions extends RTCOfferAnswerOptions {
+    iceRestart?: boolean;
+    offerToReceiveAudio?: boolean;
+    offerToReceiveVideo?: boolean;
+}
+
+export interface RTCOutboundRTPStreamStats extends RTCRTPStreamStats {
+    bytesSent?: number;
+    packetsSent?: number;
+    roundTripTime?: number;
+    targetBitrate?: number;
+}
+
+export interface RTCPeerConnectionIceErrorEventInit extends EventInit {
+    errorCode: number;
+    hostCandidate?: string;
+    statusText?: string;
+    url?: string;
+}
+
+export interface RTCPeerConnectionIceEventInit extends EventInit {
+    candidate?: RTCIceCandidate | null;
+    url?: string | null;
+}
+
+export interface RTCRTPStreamStats extends RTCStats {
+    associateStatsId?: string;
+    codecId?: string;
+    firCount?: number;
+    isRemote?: boolean;
+    mediaTrackId?: string;
+    mediaType?: string;
+    nackCount?: number;
+    pliCount?: number;
+    sliCount?: number;
+    ssrc?: string;
+    transportId?: string;
+}
+
+export interface RTCRtcpFeedback {
+    parameter?: string;
+    type?: string;
+}
+
+export interface RTCRtcpParameters {
+    cname?: string;
+    reducedSize?: boolean;
+}
+
+export interface RTCRtpCapabilities {
+    codecs: RTCRtpCodecCapability[];
+    headerExtensions: RTCRtpHeaderExtensionCapability[];
+}
+
+export interface RTCRtpCodecCapability {
+    channels?: number;
+    clockRate: number;
+    mimeType: string;
+    sdpFmtpLine?: string;
+}
+
+export interface RTCRtpCodecParameters {
+    channels?: number;
+    clockRate: number;
+    mimeType: string;
+    payloadType: number;
+    sdpFmtpLine?: string;
+}
+
+export interface RTCRtpCodingParameters {
+    rid?: string;
+}
+
+export interface RTCRtpContributingSource {
+    audioLevel?: number;
+    rtpTimestamp: number;
+    source: number;
+    timestamp: number;
+}
+
+export interface RTCRtpDecodingParameters extends RTCRtpCodingParameters {
+}
+
+export interface RTCRtpEncodingParameters extends RTCRtpCodingParameters {
+    active?: boolean;
+    codecPayloadType?: number;
+    dtx?: RTCDtxStatus;
+    maxBitrate?: number;
+    maxFramerate?: number;
+    ptime?: number;
+    scaleResolutionDownBy?: number;
+}
+
+export interface RTCRtpFecParameters {
+    mechanism?: string;
+    ssrc?: number;
+}
+
+export interface RTCRtpHeaderExtension {
+    kind?: string;
+    preferredEncrypt?: boolean;
+    preferredId?: number;
+    uri?: string;
+}
+
+export interface RTCRtpHeaderExtensionCapability {
+    uri?: string;
+}
+
+export interface RTCRtpHeaderExtensionParameters {
+    encrypted?: boolean;
+    id: number;
+    uri: string;
+}
+
+export interface RTCRtpParameters {
+    codecs: RTCRtpCodecParameters[];
+    headerExtensions: RTCRtpHeaderExtensionParameters[];
+    rtcp: RTCRtcpParameters;
+}
+
+export interface RTCRtpReceiveParameters extends RTCRtpParameters {
+    encodings: RTCRtpDecodingParameters[];
+}
+
+export interface RTCRtpRtxParameters {
+    ssrc?: number;
+}
+
+export interface RTCRtpSendParameters extends RTCRtpParameters {
+    degradationPreference?: RTCDegradationPreference;
+    encodings: RTCRtpEncodingParameters[];
+    priority?: RTCPriorityType;
+    transactionId: string;
+}
+
+export interface RTCRtpSynchronizationSource extends RTCRtpContributingSource {
+    voiceActivityFlag?: boolean;
+}
+
+export interface RTCRtpTransceiverInit {
+    direction?: RTCRtpTransceiverDirection;
+    sendEncodings?: RTCRtpEncodingParameters[];
+    streams?: MediaStream[];
+}
+
+export interface RTCRtpUnhandled {
+    muxId?: string;
+    payloadType?: number;
+    ssrc?: number;
+}
+
+export interface RTCSessionDescriptionInit {
+    sdp?: string;
+    type?: RTCSdpType;
+}
+
+export interface RTCSrtpKeyParam {
+    keyMethod?: string;
+    keySalt?: string;
+    lifetime?: string;
+    mkiLength?: number;
+    mkiValue?: number;
+}
+
+export interface RTCSrtpSdesParameters {
+    cryptoSuite?: string;
+    keyParams?: RTCSrtpKeyParam[];
+    sessionParams?: string[];
+    tag?: number;
+}
+
+export interface RTCSsrcRange {
+    max?: number;
+    min?: number;
+}
+
+export interface RTCStats {
+    id: string;
+    timestamp: number;
+    type: RTCStatsType;
+}
+
+export interface RTCStatsEventInit extends EventInit {
+    report: RTCStatsReport;
+}
+
+export interface RTCStatsReport {
+}
+
+export interface RTCTrackEventInit extends EventInit {
+    receiver: RTCRtpReceiver;
+    streams?: MediaStream[];
+    track: MediaStreamTrack;
+    transceiver: RTCRtpTransceiver;
+}
+
+export interface RTCTransportStats extends RTCStats {
+    activeConnection?: boolean;
+    bytesReceived?: number;
+    bytesSent?: number;
+    localCertificateId?: string;
+    remoteCertificateId?: string;
+    rtcpTransportStatsId?: string;
+    selectedCandidatePairId?: string;
+}
+
+export interface ReadableStreamReadDoneResult<T> {
+    done: true;
+    value?: T;
+}
+
+export interface ReadableStreamReadValueResult<T> {
+    done: false;
+    value: T;
+}
+
+export interface RegistrationOptions {
+    scope?: string;
+    type?: WorkerType;
+    updateViaCache?: ServiceWorkerUpdateViaCache;
+}
+
+export interface RequestInit {
+    /**
+     * A BodyInit object or null to set request's body.
+     */
+    body?: BodyInit | null;
+    /**
+     * A string indicating how the request will interact with the browser's cache to set request's cache.
+     */
+    cache?: RequestCache;
+    /**
+     * A string indicating whether credentials will be sent with the request always, never, or only when sent to a same-origin URL. Sets request's credentials.
+     */
+    credentials?: RequestCredentials;
+    /**
+     * A Headers object, an object literal, or an array of two-item arrays to set request's headers.
+     */
+    headers?: HeadersInit;
+    /**
+     * A cryptographic hash of the resource to be fetched by request. Sets request's integrity.
+     */
+    integrity?: string;
+    /**
+     * A boolean to set request's keepalive.
+     */
+    keepalive?: boolean;
+    /**
+     * A string to set request's method.
+     */
+    method?: string;
+    /**
+     * A string to indicate whether the request will use CORS, or will be restricted to same-origin URLs. Sets request's mode.
+     */
+    mode?: RequestMode;
+    /**
+     * A string indicating whether request follows redirects, results in an error upon encountering a redirect, or returns the redirect (in an opaque fashion). Sets request's redirect.
+     */
+    redirect?: RequestRedirect;
+    /**
+     * A string whose value is a same-origin URL, "about:client", or the empty string, to set request's referrer.
+     */
+    referrer?: string;
+    /**
+     * A referrer policy to set request's referrerPolicy.
+     */
+    referrerPolicy?: ReferrerPolicy;
+    /**
+     * An AbortSignal to set request's signal.
+     */
+    signal?: AbortSignal | null;
+    /**
+     * Can only be null. Used to disassociate request from any Window.
+     */
+    window?: any;
+}
+
+export interface ResponseInit {
+    headers?: HeadersInit;
+    status?: number;
+    statusText?: string;
+}
+
+export interface RsaHashedImportParams extends Algorithm {
+    hash: HashAlgorithmIdentifier;
+}
+
+export interface RsaHashedKeyAlgorithm extends RsaKeyAlgorithm {
+    hash: KeyAlgorithm;
+}
+
+export interface RsaHashedKeyGenParams extends RsaKeyGenParams {
+    hash: HashAlgorithmIdentifier;
+}
+
+export interface RsaKeyAlgorithm extends KeyAlgorithm {
+    modulusLength: number;
+    publicExponent: BigInteger;
+}
+
+export interface RsaKeyGenParams extends Algorithm {
+    modulusLength: number;
+    publicExponent: BigInteger;
+}
+
+export interface RsaOaepParams extends Algorithm {
+    label?: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer;
+}
+
+export interface RsaOtherPrimesInfo {
+    d?: string;
+    r?: string;
+    t?: string;
+}
+
+export interface RsaPssParams extends Algorithm {
+    saltLength: number;
+}
+
+export interface SVGBoundingBoxOptions {
+    clipped?: boolean;
+    fill?: boolean;
+    markers?: boolean;
+    stroke?: boolean;
+}
+
+export interface ScopedCredentialDescriptor {
+    id: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer | null;
+    transports?: Transport[];
+    type: ScopedCredentialType;
+}
+
+export interface ScopedCredentialOptions {
+    excludeList?: ScopedCredentialDescriptor[];
+    extensions?: WebAuthnExtensions;
+    rpId?: string;
+    timeoutSeconds?: number;
+}
+
+export interface ScopedCredentialParameters {
+    algorithm: string | Algorithm;
+    type: ScopedCredentialType;
+}
+
+export interface ScrollIntoViewOptions extends ScrollOptions {
+    block?: ScrollLogicalPosition;
+    inline?: ScrollLogicalPosition;
+}
+
+export interface ScrollOptions {
+    behavior?: ScrollBehavior;
+}
+
+export interface ScrollToOptions extends ScrollOptions {
+    left?: number;
+    top?: number;
+}
+
+export interface SecurityPolicyViolationEventInit extends EventInit {
+    blockedURI?: string;
+    columnNumber?: number;
+    documentURI?: string;
+    effectiveDirective?: string;
+    lineNumber?: number;
+    originalPolicy?: string;
+    referrer?: string;
+    sourceFile?: string;
+    statusCode?: number;
+    violatedDirective?: string;
+}
+
+export interface ServiceWorkerMessageEventInit extends EventInit {
+    data?: any;
+    lastEventId?: string;
+    origin?: string;
+    ports?: MessagePort[] | null;
+    source?: ServiceWorker | MessagePort | null;
+}
+
+export interface ShadowRootInit {
+    delegatesFocus?: boolean;
+    mode: ShadowRootMode;
+}
+
+export interface SpeechSynthesisErrorEventInit extends SpeechSynthesisEventInit {
+    error: SpeechSynthesisErrorCode;
+}
+
+export interface SpeechSynthesisEventInit extends EventInit {
+    charIndex?: number;
+    charLength?: number;
+    elapsedTime?: number;
+    name?: string;
+    utterance: SpeechSynthesisUtterance;
+}
+
+export interface StaticRangeInit {
+    endContainer: Node;
+    endOffset: number;
+    startContainer: Node;
+    startOffset: number;
+}
+
+export interface StereoPannerOptions extends AudioNodeOptions {
+    pan?: number;
+}
+
+export interface StorageEstimate {
+    quota?: number;
+    usage?: number;
+}
+
+export interface StorageEventInit extends EventInit {
+    key?: string | null;
+    newValue?: string | null;
+    oldValue?: string | null;
+    storageArea?: Storage | null;
+    url?: string;
+}
+
+export interface StoreExceptionsInformation extends ExceptionInformation {
+    detailURI?: string | null;
+    explanationString?: string | null;
+    siteName?: string | null;
+}
+
+export interface StoreSiteSpecificExceptionsInformation extends StoreExceptionsInformation {
+    arrayOfDomainStrings?: string[];
+}
+
+export interface TextDecodeOptions {
+    stream?: boolean;
+}
+
+export interface TextDecoderOptions {
+    fatal?: boolean;
+    ignoreBOM?: boolean;
+}
+
+export interface TextEncoderEncodeIntoResult {
+    read?: number;
+    written?: number;
+}
+
+export interface TouchEventInit extends EventModifierInit {
+    changedTouches?: Touch[];
+    targetTouches?: Touch[];
+    touches?: Touch[];
+}
+
+export interface TouchInit {
+    altitudeAngle?: number;
+    azimuthAngle?: number;
+    clientX?: number;
+    clientY?: number;
+    force?: number;
+    identifier: number;
+    pageX?: number;
+    pageY?: number;
+    radiusX?: number;
+    radiusY?: number;
+    rotationAngle?: number;
+    screenX?: number;
+    screenY?: number;
+    target: EventTarget;
+    touchType?: TouchType;
+}
+
+export interface TrackEventInit extends EventInit {
+    track?: VideoTrack | AudioTrack | TextTrack | null;
+}
+
+export interface Transformer<I = any, O = any> {
+    flush?: TransformStreamDefaultControllerCallback<O>;
+    readableType?: undefined;
+    start?: TransformStreamDefaultControllerCallback<O>;
+    transform?: TransformStreamDefaultControllerTransformCallback<I, O>;
+    writableType?: undefined;
+}
+
+export interface TransitionEventInit extends EventInit {
+    elapsedTime?: number;
+    propertyName?: string;
+    pseudoElement?: string;
+}
+
+export interface UIEventInit extends EventInit {
+    detail?: number;
+    view?: Window | null;
+}
+
+export interface ULongRange {
+    max?: number;
+    min?: number;
+}
+
+export interface UnderlyingByteSource {
+    autoAllocateChunkSize?: number;
+    cancel?: ReadableStreamErrorCallback;
+    pull?: ReadableByteStreamControllerCallback;
+    start?: ReadableByteStreamControllerCallback;
+    type: "bytes";
+}
+
+export interface UnderlyingSink<W = any> {
+    abort?: WritableStreamErrorCallback;
+    close?: WritableStreamDefaultControllerCloseCallback;
+    start?: WritableStreamDefaultControllerStartCallback;
+    type?: undefined;
+    write?: WritableStreamDefaultControllerWriteCallback<W>;
+}
+
+export interface UnderlyingSource<R = any> {
+    cancel?: ReadableStreamErrorCallback;
+    pull?: ReadableStreamDefaultControllerCallback<R>;
+    start?: ReadableStreamDefaultControllerCallback<R>;
+    type?: undefined;
+}
+
+export interface VRDisplayEventInit extends EventInit {
+    display: VRDisplay;
+    reason?: VRDisplayEventReason;
+}
+
+export interface VRLayer {
+    leftBounds?: number[] | Float32Array | null;
+    rightBounds?: number[] | Float32Array | null;
+    source?: HTMLCanvasElement | null;
+}
+
+export interface VRStageParameters {
+    sittingToStandingTransform?: Float32Array;
+    sizeX?: number;
+    sizeY?: number;
+}
+
+export interface WaveShaperOptions extends AudioNodeOptions {
+    curve?: number[] | Float32Array;
+    oversample?: OverSampleType;
+}
+
+export interface WebAuthnExtensions {
+}
+
+export interface WebGLContextAttributes {
+    alpha?: boolean;
+    antialias?: boolean;
+    depth?: boolean;
+    desynchronized?: boolean;
+    failIfMajorPerformanceCaveat?: boolean;
+    powerPreference?: WebGLPowerPreference;
+    premultipliedAlpha?: boolean;
+    preserveDrawingBuffer?: boolean;
+    stencil?: boolean;
+}
+
+export interface WebGLContextEventInit extends EventInit {
+    statusMessage?: string;
+}
+
+export interface WheelEventInit extends MouseEventInit {
+    deltaMode?: number;
+    deltaX?: number;
+    deltaY?: number;
+    deltaZ?: number;
+}
+
+export interface WorkerOptions {
+    credentials?: RequestCredentials;
+    name?: string;
+    type?: WorkerType;
+}
+
+export interface WorkletOptions {
+    credentials?: RequestCredentials;
+}
+
+export interface txAuthGenericArg {
+    content: ArrayBuffer;
+    contentType: string;
+}
+
+export interface EventListener {
+    (evt: Event): void;
+}
+
+export type XPathNSResolver = ((prefix: string | null) => string | null) | { lookupNamespaceURI(prefix: string | null): string | null; };
+
+/** The ANGLE_instanced_arrays extension is part of the WebGL API and allows to draw the same object, or groups of similar objects multiple times, if they share the same vertex data, primitive count and type. */
+export interface ANGLE_instanced_arrays {
+    drawArraysInstancedANGLE(mode: GLenum, first: GLint, count: GLsizei, primcount: GLsizei): void;
+    drawElementsInstancedANGLE(mode: GLenum, count: GLsizei, type: GLenum, offset: GLintptr, primcount: GLsizei): void;
+    vertexAttribDivisorANGLE(index: GLuint, divisor: GLuint): void;
+    readonly VERTEX_ATTRIB_ARRAY_DIVISOR_ANGLE: GLenum;
+}
+
+/** A controller object that allows you to abort one or more DOM requests as and when desired. */
+export interface AbortController {
+    /**
+     * Returns the AbortSignal object associated with this object.
+     */
+    readonly signal: AbortSignal;
+    /**
+     * Invoking this method will set this object's AbortSignal's aborted flag and signal to any observers that the associated activity is to be aborted.
+     */
+    abort(): void;
+}
+
+
+export interface AbortSignalEventMap {
+    "abort": Event;
+}
+
+/** A signal object that allows you to communicate with a DOM request (such as a Fetch) and abort it if required via an AbortController object. */
+export interface AbortSignal extends EventTarget {
+    /**
+     * Returns true if this AbortSignal's AbortController has signaled to abort, and false otherwise.
+     */
+    readonly aborted: boolean;
+    onabort: ((this: AbortSignal, ev: Event) => any) | null;
+    addEventListener<K extends keyof AbortSignalEventMap>(type: K, listener: (this: AbortSignal, ev: AbortSignalEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof AbortSignalEventMap>(type: K, listener: (this: AbortSignal, ev: AbortSignalEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface AbstractRange {
+    /**
+     * Returns true if range is collapsed, and false otherwise.
+     */
+    readonly collapsed: boolean;
+    /**
+     * Returns range's end node.
+     */
+    readonly endContainer: Node;
+    /**
+     * Returns range's end offset.
+     */
+    readonly endOffset: number;
+    /**
+     * Returns range's start node.
+     */
+    readonly startContainer: Node;
+    /**
+     * Returns range's start offset.
+     */
+    readonly startOffset: number;
+}
+
+
+export interface AbstractWorkerEventMap {
+    "error": ErrorEvent;
+}
+
+export interface AbstractWorker {
+    onerror: ((this: AbstractWorker, ev: ErrorEvent) => any) | null;
+    addEventListener<K extends keyof AbstractWorkerEventMap>(type: K, listener: (this: AbstractWorker, ev: AbstractWorkerEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof AbstractWorkerEventMap>(type: K, listener: (this: AbstractWorker, ev: AbstractWorkerEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+export interface AesCfbParams extends Algorithm {
+    iv: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer;
+}
+
+export interface AesCmacParams extends Algorithm {
+    length: number;
+}
+
+/** A node able to provide real-time frequency and time-domain analysis information. It is an AudioNode that passes the audio stream unchanged from the input to the output, but allows you to take the generated data, process it, and create audio visualizations. */
+export interface AnalyserNode extends AudioNode {
+    fftSize: number;
+    readonly frequencyBinCount: number;
+    maxDecibels: number;
+    minDecibels: number;
+    smoothingTimeConstant: number;
+    getByteFrequencyData(array: Uint8Array): void;
+    getByteTimeDomainData(array: Uint8Array): void;
+    getFloatFrequencyData(array: Float32Array): void;
+    getFloatTimeDomainData(array: Float32Array): void;
+}
+
+
+export interface Animatable {
+    animate(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, options?: number | KeyframeAnimationOptions): Animation;
+    getAnimations(): Animation[];
+}
+
+export interface AnimationEventMap {
+    "cancel": AnimationPlaybackEvent;
+    "finish": AnimationPlaybackEvent;
+}
+
+export interface Animation extends EventTarget {
+    currentTime: number | null;
+    effect: AnimationEffect | null;
+    readonly finished: Promise<Animation>;
+    id: string;
+    oncancel: ((this: Animation, ev: AnimationPlaybackEvent) => any) | null;
+    onfinish: ((this: Animation, ev: AnimationPlaybackEvent) => any) | null;
+    readonly pending: boolean;
+    readonly playState: AnimationPlayState;
+    playbackRate: number;
+    readonly ready: Promise<Animation>;
+    startTime: number | null;
+    timeline: AnimationTimeline | null;
+    cancel(): void;
+    finish(): void;
+    pause(): void;
+    play(): void;
+    reverse(): void;
+    updatePlaybackRate(playbackRate: number): void;
+    addEventListener<K extends keyof AnimationEventMap>(type: K, listener: (this: Animation, ev: AnimationEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof AnimationEventMap>(type: K, listener: (this: Animation, ev: AnimationEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface AnimationEffect {
+    getComputedTiming(): ComputedEffectTiming;
+    getTiming(): EffectTiming;
+    updateTiming(timing?: OptionalEffectTiming): void;
+}
+
+
+/** Events providing information related to animations. */
+export interface AnimationEvent extends Event {
+    readonly animationName: string;
+    readonly elapsedTime: number;
+    readonly pseudoElement: string;
+}
+
+
+export interface AnimationFrameProvider {
+    cancelAnimationFrame(handle: number): void;
+    requestAnimationFrame(callback: FrameRequestCallback): number;
+}
+
+export interface AnimationPlaybackEvent extends Event {
+    readonly currentTime: number | null;
+    readonly timelineTime: number | null;
+}
+
+
+export interface AnimationTimeline {
+    readonly currentTime: number | null;
+}
+
+
+export interface ApplicationCacheEventMap {
+    "cached": Event;
+    "checking": Event;
+    "downloading": Event;
+    "error": Event;
+    "noupdate": Event;
+    "obsolete": Event;
+    "progress": ProgressEvent<ApplicationCache>;
+    "updateready": Event;
+}
+
+export interface ApplicationCache extends EventTarget {
+    /** @deprecated */
+    oncached: ((this: ApplicationCache, ev: Event) => any) | null;
+    /** @deprecated */
+    onchecking: ((this: ApplicationCache, ev: Event) => any) | null;
+    /** @deprecated */
+    ondownloading: ((this: ApplicationCache, ev: Event) => any) | null;
+    /** @deprecated */
+    onerror: ((this: ApplicationCache, ev: Event) => any) | null;
+    /** @deprecated */
+    onnoupdate: ((this: ApplicationCache, ev: Event) => any) | null;
+    /** @deprecated */
+    onobsolete: ((this: ApplicationCache, ev: Event) => any) | null;
+    /** @deprecated */
+    onprogress: ((this: ApplicationCache, ev: ProgressEvent<ApplicationCache>) => any) | null;
+    /** @deprecated */
+    onupdateready: ((this: ApplicationCache, ev: Event) => any) | null;
+    /** @deprecated */
+    readonly status: number;
+    /** @deprecated */
+    abort(): void;
+    /** @deprecated */
+    swapCache(): void;
+    /** @deprecated */
+    update(): void;
+    readonly CHECKING: number;
+    readonly DOWNLOADING: number;
+    readonly IDLE: number;
+    readonly OBSOLETE: number;
+    readonly UNCACHED: number;
+    readonly UPDATEREADY: number;
+    addEventListener<K extends keyof ApplicationCacheEventMap>(type: K, listener: (this: ApplicationCache, ev: ApplicationCacheEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof ApplicationCacheEventMap>(type: K, listener: (this: ApplicationCache, ev: ApplicationCacheEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A DOM element's attribute as an object. In most DOM methods, you will probably directly retrieve the attribute as a string (e.g., Element.getAttribute(), but certain functions (e.g., Element.getAttributeNode()) or means of iterating give Attr types. */
+export interface Attr extends Node {
+    readonly localName: string;
+    readonly name: string;
+    readonly namespaceURI: string | null;
+    readonly ownerElement: Element | null;
+    readonly prefix: string | null;
+    readonly specified: boolean;
+    value: string;
+}
+
+
+/** A short audio asset residing in memory, created from an audio file using the AudioContext.decodeAudioData() method, or from raw data using AudioContext.createBuffer(). Once put into an AudioBuffer, the audio can then be played by being passed into an AudioBufferSourceNode. */
+export interface AudioBuffer {
+    readonly duration: number;
+    readonly length: number;
+    readonly numberOfChannels: number;
+    readonly sampleRate: number;
+    copyFromChannel(destination: Float32Array, channelNumber: number, bufferOffset?: number): void;
+    copyToChannel(source: Float32Array, channelNumber: number, bufferOffset?: number): void;
+    getChannelData(channel: number): Float32Array;
+}
+
+
+/** An AudioScheduledSourceNode which represents an audio source consisting of in-memory audio data, stored in an AudioBuffer. It's especially useful for playing back audio which has particularly stringent timing accuracy requirements, such as for sounds that must match a specific rhythm and can be kept in memory rather than being played from disk or the network. */
+export interface AudioBufferSourceNode extends AudioScheduledSourceNode {
+    buffer: AudioBuffer | null;
+    readonly detune: AudioParam;
+    loop: boolean;
+    loopEnd: number;
+    loopStart: number;
+    readonly playbackRate: AudioParam;
+    start(when?: number, offset?: number, duration?: number): void;
+    addEventListener<K extends keyof AudioScheduledSourceNodeEventMap>(type: K, listener: (this: AudioBufferSourceNode, ev: AudioScheduledSourceNodeEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof AudioScheduledSourceNodeEventMap>(type: K, listener: (this: AudioBufferSourceNode, ev: AudioScheduledSourceNodeEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** An audio-processing graph built from audio modules linked together, each represented by an AudioNode. */
+export interface AudioContext extends BaseAudioContext {
+    readonly baseLatency: number;
+    readonly outputLatency: number;
+    close(): Promise<void>;
+    createMediaElementSource(mediaElement: HTMLMediaElement): MediaElementAudioSourceNode;
+    createMediaStreamDestination(): MediaStreamAudioDestinationNode;
+    createMediaStreamSource(mediaStream: MediaStream): MediaStreamAudioSourceNode;
+    createMediaStreamTrackSource(mediaStreamTrack: MediaStreamTrack): MediaStreamTrackAudioSourceNode;
+    getOutputTimestamp(): AudioTimestamp;
+    resume(): Promise<void>;
+    suspend(): Promise<void>;
+    addEventListener<K extends keyof BaseAudioContextEventMap>(type: K, listener: (this: AudioContext, ev: BaseAudioContextEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof BaseAudioContextEventMap>(type: K, listener: (this: AudioContext, ev: BaseAudioContextEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** AudioDestinationNode has no output (as it is the output, no more AudioNode can be linked after it in the audio graph) and one input. The number of channels in the input must be between 0 and the maxChannelCount value or an exception is raised. */
+export interface AudioDestinationNode extends AudioNode {
+    readonly maxChannelCount: number;
+}
+
+
+/** The position and orientation of the unique person listening to the audio scene, and is used in audio spatialization. All PannerNodes spatialize in relation to the AudioListener stored in the BaseAudioContext.listener attribute. */
+export interface AudioListener {
+    readonly forwardX: AudioParam;
+    readonly forwardY: AudioParam;
+    readonly forwardZ: AudioParam;
+    readonly positionX: AudioParam;
+    readonly positionY: AudioParam;
+    readonly positionZ: AudioParam;
+    readonly upX: AudioParam;
+    readonly upY: AudioParam;
+    readonly upZ: AudioParam;
+    /** @deprecated */
+    setOrientation(x: number, y: number, z: number, xUp: number, yUp: number, zUp: number): void;
+    /** @deprecated */
+    setPosition(x: number, y: number, z: number): void;
+}
+
+
+/** A generic interface for representing an audio processing module. Examples include: */
+export interface AudioNode extends EventTarget {
+    channelCount: number;
+    channelCountMode: ChannelCountMode;
+    channelInterpretation: ChannelInterpretation;
+    readonly context: BaseAudioContext;
+    readonly numberOfInputs: number;
+    readonly numberOfOutputs: number;
+    connect(destinationNode: AudioNode, output?: number, input?: number): AudioNode;
+    connect(destinationParam: AudioParam, output?: number): void;
+    disconnect(): void;
+    disconnect(output: number): void;
+    disconnect(destinationNode: AudioNode): void;
+    disconnect(destinationNode: AudioNode, output: number): void;
+    disconnect(destinationNode: AudioNode, output: number, input: number): void;
+    disconnect(destinationParam: AudioParam): void;
+    disconnect(destinationParam: AudioParam, output: number): void;
+}
+
+
+/** The Web Audio API's AudioParam interface represents an audio-related parameter, usually a parameter of an AudioNode (such as GainNode.gain). */
+export interface AudioParam {
+    automationRate: AutomationRate;
+    readonly defaultValue: number;
+    readonly maxValue: number;
+    readonly minValue: number;
+    value: number;
+    cancelAndHoldAtTime(cancelTime: number): AudioParam;
+    cancelScheduledValues(cancelTime: number): AudioParam;
+    exponentialRampToValueAtTime(value: number, endTime: number): AudioParam;
+    linearRampToValueAtTime(value: number, endTime: number): AudioParam;
+    setTargetAtTime(target: number, startTime: number, timeConstant: number): AudioParam;
+    setValueAtTime(value: number, startTime: number): AudioParam;
+    setValueCurveAtTime(values: number[] | Float32Array, startTime: number, duration: number): AudioParam;
+}
+
+
+export interface AudioParamMap {
+    forEach(callbackfn: (value: AudioParam, key: string, parent: AudioParamMap) => void, thisArg?: any): void;
+}
+
+
+/** The Web Audio API events that occur when a ScriptProcessorNode input buffer is ready to be processed. */
+export interface AudioProcessingEvent extends Event {
+    readonly inputBuffer: AudioBuffer;
+    readonly outputBuffer: AudioBuffer;
+    readonly playbackTime: number;
+}
+
+
+export interface AudioScheduledSourceNodeEventMap {
+    "ended": Event;
+}
+
+export interface AudioScheduledSourceNode extends AudioNode {
+    onended: ((this: AudioScheduledSourceNode, ev: Event) => any) | null;
+    start(when?: number): void;
+    stop(when?: number): void;
+    addEventListener<K extends keyof AudioScheduledSourceNodeEventMap>(type: K, listener: (this: AudioScheduledSourceNode, ev: AudioScheduledSourceNodeEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof AudioScheduledSourceNodeEventMap>(type: K, listener: (this: AudioScheduledSourceNode, ev: AudioScheduledSourceNodeEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A single audio track from one of the HTML media elements, <audio> or <video>.  */
+export interface AudioTrack {
+    enabled: boolean;
+    readonly id: string;
+    kind: string;
+    readonly label: string;
+    language: string;
+    readonly sourceBuffer: SourceBuffer | null;
+}
+
+
+export interface AudioTrackListEventMap {
+    "addtrack": TrackEvent;
+    "change": Event;
+    "removetrack": TrackEvent;
+}
+
+/** Used to represent a list of the audio tracks contained within a given HTML media element, with each track represented by a separate AudioTrack object in the list. */
+export interface AudioTrackList extends EventTarget {
+    readonly length: number;
+    onaddtrack: ((this: AudioTrackList, ev: TrackEvent) => any) | null;
+    onchange: ((this: AudioTrackList, ev: Event) => any) | null;
+    onremovetrack: ((this: AudioTrackList, ev: TrackEvent) => any) | null;
+    getTrackById(id: string): AudioTrack | null;
+    item(index: number): AudioTrack;
+    addEventListener<K extends keyof AudioTrackListEventMap>(type: K, listener: (this: AudioTrackList, ev: AudioTrackListEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof AudioTrackListEventMap>(type: K, listener: (this: AudioTrackList, ev: AudioTrackListEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    [index: number]: AudioTrack;
+}
+
+
+export interface AudioWorklet extends Worklet {
+}
+
+
+export interface AudioWorkletNodeEventMap {
+    "processorerror": Event;
+}
+
+export interface AudioWorkletNode extends AudioNode {
+    onprocessorerror: ((this: AudioWorkletNode, ev: Event) => any) | null;
+    readonly parameters: AudioParamMap;
+    readonly port: MessagePort;
+    addEventListener<K extends keyof AudioWorkletNodeEventMap>(type: K, listener: (this: AudioWorkletNode, ev: AudioWorkletNodeEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof AudioWorkletNodeEventMap>(type: K, listener: (this: AudioWorkletNode, ev: AudioWorkletNodeEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface AuthenticatorAssertionResponse extends AuthenticatorResponse {
+    readonly authenticatorData: ArrayBuffer;
+    readonly signature: ArrayBuffer;
+    readonly userHandle: ArrayBuffer | null;
+}
+
+
+export interface AuthenticatorAttestationResponse extends AuthenticatorResponse {
+    readonly attestationObject: ArrayBuffer;
+}
+
+
+export interface AuthenticatorResponse {
+    readonly clientDataJSON: ArrayBuffer;
+}
+
+
+export interface BarProp {
+    readonly visible: boolean;
+}
+
+
+export interface BaseAudioContextEventMap {
+    "statechange": Event;
+}
+
+export interface BaseAudioContext extends EventTarget {
+    readonly audioWorklet: AudioWorklet;
+    readonly currentTime: number;
+    readonly destination: AudioDestinationNode;
+    readonly listener: AudioListener;
+    onstatechange: ((this: BaseAudioContext, ev: Event) => any) | null;
+    readonly sampleRate: number;
+    readonly state: AudioContextState;
+    createAnalyser(): AnalyserNode;
+    createBiquadFilter(): BiquadFilterNode;
+    createBuffer(numberOfChannels: number, length: number, sampleRate: number): AudioBuffer;
+    createBufferSource(): AudioBufferSourceNode;
+    createChannelMerger(numberOfInputs?: number): ChannelMergerNode;
+    createChannelSplitter(numberOfOutputs?: number): ChannelSplitterNode;
+    createConstantSource(): ConstantSourceNode;
+    createConvolver(): ConvolverNode;
+    createDelay(maxDelayTime?: number): DelayNode;
+    createDynamicsCompressor(): DynamicsCompressorNode;
+    createGain(): GainNode;
+    createIIRFilter(feedforward: number[], feedback: number[]): IIRFilterNode;
+    createOscillator(): OscillatorNode;
+    createPanner(): PannerNode;
+    createPeriodicWave(real: number[] | Float32Array, imag: number[] | Float32Array, constraints?: PeriodicWaveConstraints): PeriodicWave;
+    createScriptProcessor(bufferSize?: number, numberOfInputChannels?: number, numberOfOutputChannels?: number): ScriptProcessorNode;
+    createStereoPanner(): StereoPannerNode;
+    createWaveShaper(): WaveShaperNode;
+    decodeAudioData(audioData: ArrayBuffer, successCallback?: DecodeSuccessCallback | null, errorCallback?: DecodeErrorCallback | null): Promise<AudioBuffer>;
+    addEventListener<K extends keyof BaseAudioContextEventMap>(type: K, listener: (this: BaseAudioContext, ev: BaseAudioContextEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof BaseAudioContextEventMap>(type: K, listener: (this: BaseAudioContext, ev: BaseAudioContextEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** The beforeunload event is fired when the window, the document and its resources are about to be unloaded. */
+export interface BeforeUnloadEvent extends Event {
+    returnValue: any;
+}
+
+
+export interface BhxBrowser {
+    readonly lastError: DOMException;
+    checkMatchesGlobExpression(pattern: string, value: string): boolean;
+    checkMatchesUriExpression(pattern: string, value: string): boolean;
+    clearLastError(): void;
+    currentWindowId(): number;
+    fireExtensionApiTelemetry(functionName: string, isSucceeded: boolean, isSupported: boolean, errorString: string): void;
+    genericFunction(functionId: number, destination: any, parameters?: string, callbackId?: number): void;
+    genericSynchronousFunction(functionId: number, parameters?: string): string;
+    getExtensionId(): string;
+    getThisAddress(): any;
+    registerGenericFunctionCallbackHandler(callbackHandler: Function): void;
+    registerGenericListenerHandler(eventHandler: Function): void;
+    setLastError(parameters: string): void;
+    webPlatformGenericFunction(destination: any, parameters?: string, callbackId?: number): void;
+}
+
+
+/** A simple low-order filter, and is created using the AudioContext.createBiquadFilter() method. It is an AudioNode that can represent different kinds of filters, tone control devices, and graphic equalizers. */
+export interface BiquadFilterNode extends AudioNode {
+    readonly Q: AudioParam;
+    readonly detune: AudioParam;
+    readonly frequency: AudioParam;
+    readonly gain: AudioParam;
+    type: BiquadFilterType;
+    getFrequencyResponse(frequencyHz: Float32Array, magResponse: Float32Array, phaseResponse: Float32Array): void;
+}
+
+
+/** A file-like object of immutable, raw data. Blobs represent data that isn't necessarily in a JavaScript-native format. The File interface is based on Blob, inheriting blob functionality and expanding it to support files on the user's system. */
+export interface Blob {
+    readonly size: number;
+    readonly type: string;
+    arrayBuffer(): Promise<ArrayBuffer>;
+    slice(start?: number, end?: number, contentType?: string): Blob;
+    stream(): ReadableStream;
+    text(): Promise<string>;
+}
+
+
+export interface Body {
+    readonly body: ReadableStream<Uint8Array> | null;
+    readonly bodyUsed: boolean;
+    arrayBuffer(): Promise<ArrayBuffer>;
+    blob(): Promise<Blob>;
+    formData(): Promise<FormData>;
+    json(): Promise<any>;
+    text(): Promise<string>;
+}
+
+export interface BroadcastChannelEventMap {
+    "message": MessageEvent;
+    "messageerror": MessageEvent;
+}
+
+export interface BroadcastChannel extends EventTarget {
+    /**
+     * Returns the channel name (as passed to the constructor).
+     */
+    readonly name: string;
+    onmessage: ((this: BroadcastChannel, ev: MessageEvent) => any) | null;
+    onmessageerror: ((this: BroadcastChannel, ev: MessageEvent) => any) | null;
+    /**
+     * Closes the BroadcastChannel object, opening it up to garbage collection.
+     */
+    close(): void;
+    /**
+     * Sends the given message to other BroadcastChannel objects set up for this channel. Messages can be structured objects, e.g. nested objects and arrays.
+     */
+    postMessage(message: any): void;
+    addEventListener<K extends keyof BroadcastChannelEventMap>(type: K, listener: (this: BroadcastChannel, ev: BroadcastChannelEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof BroadcastChannelEventMap>(type: K, listener: (this: BroadcastChannel, ev: BroadcastChannelEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** This Streams API interface provides a built-in byte length queuing strategy that can be used when constructing streams. */
+export interface ByteLengthQueuingStrategy extends QueuingStrategy<ArrayBufferView> {
+    highWaterMark: number;
+    size(chunk: ArrayBufferView): number;
+}
+
+
+/** A CDATA section that can be used within XML to include extended portions of unescaped text. The symbols < and & don’t need escaping as they normally do when inside a CDATA section. */
+export interface CDATASection extends Text {
+}
+
+
+/** Holds useful CSS-related methods. No object with this interface are implemented: it contains only static methods and therefore is a utilitarian interface. */
+export interface CSS {
+    escape(value: string): string;
+    supports(property: string, value?: string): boolean;
+}
+
+/** A single condition CSS at-rule, which consists of a condition and a statement block. It is a child of CSSGroupingRule. */
+export interface CSSConditionRule extends CSSGroupingRule {
+    conditionText: string;
+}
+
+
+export interface CSSFontFaceRule extends CSSRule {
+    readonly style: CSSStyleDeclaration;
+}
+
+
+/** Any CSS at-rule that contains other rules nested within it. */
+export interface CSSGroupingRule extends CSSRule {
+    readonly cssRules: CSSRuleList;
+    deleteRule(index: number): void;
+    insertRule(rule: string, index: number): number;
+}
+
+
+export interface CSSImportRule extends CSSRule {
+    readonly href: string;
+    readonly media: MediaList;
+    readonly styleSheet: CSSStyleSheet;
+}
+
+
+/** An object representing a set of style for a given keyframe. It corresponds to the contains of a single keyframe of a @keyframes at-rule. It implements the CSSRule interface with a type value of 8 (CSSRule.KEYFRAME_RULE). */
+export interface CSSKeyframeRule extends CSSRule {
+    keyText: string;
+    readonly style: CSSStyleDeclaration;
+}
+
+
+/** An object representing a complete set of keyframes for a CSS animation. It corresponds to the contains of a whole @keyframes at-rule. It implements the CSSRule interface with a type value of 7 (CSSRule.KEYFRAMES_RULE). */
+export interface CSSKeyframesRule extends CSSRule {
+    readonly cssRules: CSSRuleList;
+    name: string;
+    appendRule(rule: string): void;
+    deleteRule(select: string): void;
+    findRule(select: string): CSSKeyframeRule | null;
+}
+
+
+/** A single CSS @media rule. It implements the CSSConditionRule interface, and therefore the CSSGroupingRule and the CSSRule interface with a type value of 4 (CSSRule.MEDIA_RULE). */
+export interface CSSMediaRule extends CSSConditionRule {
+    readonly media: MediaList;
+}
+
+
+/** An object representing a single CSS @namespace at-rule. It implements the CSSRule interface, with a type value of 10 (CSSRule.NAMESPACE_RULE). */
+export interface CSSNamespaceRule extends CSSRule {
+    readonly namespaceURI: string;
+    readonly prefix: string;
+}
+
+
+/** CSSPageRule is an interface representing a single CSS @page rule. It implements the CSSRule interface with a type value of 6 (CSSRule.PAGE_RULE). */
+export interface CSSPageRule extends CSSRule {
+    readonly pseudoClass: string;
+    readonly selector: string;
+    selectorText: string;
+    readonly style: CSSStyleDeclaration;
+}
+
+
+/** A single CSS rule. There are several types of rules, listed in the Type constants section below. */
+export interface CSSRule {
+    cssText: string;
+    readonly parentRule: CSSRule | null;
+    readonly parentStyleSheet: CSSStyleSheet | null;
+    readonly type: number;
+    readonly CHARSET_RULE: number;
+    readonly FONT_FACE_RULE: number;
+    readonly IMPORT_RULE: number;
+    readonly KEYFRAMES_RULE: number;
+    readonly KEYFRAME_RULE: number;
+    readonly MEDIA_RULE: number;
+    readonly NAMESPACE_RULE: number;
+    readonly PAGE_RULE: number;
+    readonly STYLE_RULE: number;
+    readonly SUPPORTS_RULE: number;
+    readonly UNKNOWN_RULE: number;
+    readonly VIEWPORT_RULE: number;
+}
+
+
+/** A CSSRuleList is an (indirect-modify only) array-like object containing an ordered collection of CSSRule objects. */
+export interface CSSRuleList {
+    readonly length: number;
+    item(index: number): CSSRule | null;
+    [index: number]: CSSRule;
+}
+
+
+/** An object that is a CSS declaration block, and exposes style information and various style-related methods and properties. */
+export interface CSSStyleDeclaration {
+    alignContent: string;
+    alignItems: string;
+    alignSelf: string;
+    alignmentBaseline: string;
+    animation: string;
+    animationDelay: string;
+    animationDirection: string;
+    animationDuration: string;
+    animationFillMode: string;
+    animationIterationCount: string;
+    animationName: string;
+    animationPlayState: string;
+    animationTimingFunction: string;
+    backfaceVisibility: string;
+    background: string;
+    backgroundAttachment: string;
+    backgroundClip: string;
+    backgroundColor: string;
+    backgroundImage: string;
+    backgroundOrigin: string;
+    backgroundPosition: string;
+    backgroundPositionX: string;
+    backgroundPositionY: string;
+    backgroundRepeat: string;
+    backgroundSize: string;
+    baselineShift: string;
+    blockSize: string;
+    border: string;
+    borderBlockEnd: string;
+    borderBlockEndColor: string;
+    borderBlockEndStyle: string;
+    borderBlockEndWidth: string;
+    borderBlockStart: string;
+    borderBlockStartColor: string;
+    borderBlockStartStyle: string;
+    borderBlockStartWidth: string;
+    borderBottom: string;
+    borderBottomColor: string;
+    borderBottomLeftRadius: string;
+    borderBottomRightRadius: string;
+    borderBottomStyle: string;
+    borderBottomWidth: string;
+    borderCollapse: string;
+    borderColor: string;
+    borderImage: string;
+    borderImageOutset: string;
+    borderImageRepeat: string;
+    borderImageSlice: string;
+    borderImageSource: string;
+    borderImageWidth: string;
+    borderInlineEnd: string;
+    borderInlineEndColor: string;
+    borderInlineEndStyle: string;
+    borderInlineEndWidth: string;
+    borderInlineStart: string;
+    borderInlineStartColor: string;
+    borderInlineStartStyle: string;
+    borderInlineStartWidth: string;
+    borderLeft: string;
+    borderLeftColor: string;
+    borderLeftStyle: string;
+    borderLeftWidth: string;
+    borderRadius: string;
+    borderRight: string;
+    borderRightColor: string;
+    borderRightStyle: string;
+    borderRightWidth: string;
+    borderSpacing: string;
+    borderStyle: string;
+    borderTop: string;
+    borderTopColor: string;
+    borderTopLeftRadius: string;
+    borderTopRightRadius: string;
+    borderTopStyle: string;
+    borderTopWidth: string;
+    borderWidth: string;
+    bottom: string;
+    boxShadow: string;
+    boxSizing: string;
+    breakAfter: string;
+    breakBefore: string;
+    breakInside: string;
+    captionSide: string;
+    caretColor: string;
+    clear: string;
+    clip: string;
+    clipPath: string;
+    clipRule: string;
+    color: string;
+    colorInterpolation: string;
+    colorInterpolationFilters: string;
+    columnCount: string;
+    columnFill: string;
+    columnGap: string;
+    columnRule: string;
+    columnRuleColor: string;
+    columnRuleStyle: string;
+    columnRuleWidth: string;
+    columnSpan: string;
+    columnWidth: string;
+    columns: string;
+    content: string;
+    counterIncrement: string;
+    counterReset: string;
+    cssFloat: string | null;
+    cssText: string;
+    cursor: string;
+    direction: string;
+    display: string;
+    dominantBaseline: string;
+    emptyCells: string;
+    enableBackground: string | null;
+    fill: string;
+    fillOpacity: string;
+    fillRule: string;
+    filter: string;
+    flex: string;
+    flexBasis: string;
+    flexDirection: string;
+    flexFlow: string;
+    flexGrow: string;
+    flexShrink: string;
+    flexWrap: string;
+    float: string;
+    floodColor: string;
+    floodOpacity: string;
+    font: string;
+    fontFamily: string;
+    fontFeatureSettings: string;
+    fontKerning: string;
+    fontSize: string;
+    fontSizeAdjust: string;
+    fontStretch: string;
+    fontStyle: string;
+    fontSynthesis: string;
+    fontVariant: string;
+    fontVariantCaps: string;
+    fontVariantEastAsian: string;
+    fontVariantLigatures: string;
+    fontVariantNumeric: string;
+    fontVariantPosition: string;
+    fontWeight: string;
+    gap: string;
+    glyphOrientationHorizontal: string | null;
+    glyphOrientationVertical: string;
+    grid: string;
+    gridArea: string;
+    gridAutoColumns: string;
+    gridAutoFlow: string;
+    gridAutoRows: string;
+    gridColumn: string;
+    gridColumnEnd: string;
+    gridColumnGap: string;
+    gridColumnStart: string;
+    gridGap: string;
+    gridRow: string;
+    gridRowEnd: string;
+    gridRowGap: string;
+    gridRowStart: string;
+    gridTemplate: string;
+    gridTemplateAreas: string;
+    gridTemplateColumns: string;
+    gridTemplateRows: string;
+    height: string;
+    hyphens: string;
+    imageOrientation: string;
+    imageRendering: string;
+    imeMode: string | null;
+    inlineSize: string;
+    justifyContent: string;
+    justifyItems: string;
+    justifySelf: string;
+    kerning: string | null;
+    layoutGrid: string | null;
+    layoutGridChar: string | null;
+    layoutGridLine: string | null;
+    layoutGridMode: string | null;
+    layoutGridType: string | null;
+    left: string;
+    readonly length: number;
+    letterSpacing: string;
+    lightingColor: string;
+    lineBreak: string;
+    lineHeight: string;
+    listStyle: string;
+    listStyleImage: string;
+    listStylePosition: string;
+    listStyleType: string;
+    margin: string;
+    marginBlockEnd: string;
+    marginBlockStart: string;
+    marginBottom: string;
+    marginInlineEnd: string;
+    marginInlineStart: string;
+    marginLeft: string;
+    marginRight: string;
+    marginTop: string;
+    marker: string;
+    markerEnd: string;
+    markerMid: string;
+    markerStart: string;
+    mask: string;
+    maskComposite: string;
+    maskImage: string;
+    maskPosition: string;
+    maskRepeat: string;
+    maskSize: string;
+    maskType: string;
+    maxBlockSize: string;
+    maxHeight: string;
+    maxInlineSize: string;
+    maxWidth: string;
+    minBlockSize: string;
+    minHeight: string;
+    minInlineSize: string;
+    minWidth: string;
+    msContentZoomChaining: string | null;
+    msContentZoomLimit: string | null;
+    msContentZoomLimitMax: any;
+    msContentZoomLimitMin: any;
+    msContentZoomSnap: string | null;
+    msContentZoomSnapPoints: string | null;
+    msContentZoomSnapType: string | null;
+    msContentZooming: string | null;
+    msFlowFrom: string | null;
+    msFlowInto: string | null;
+    msFontFeatureSettings: string | null;
+    msGridColumn: any;
+    msGridColumnAlign: string | null;
+    msGridColumnSpan: any;
+    msGridColumns: string | null;
+    msGridRow: any;
+    msGridRowAlign: string | null;
+    msGridRowSpan: any;
+    msGridRows: string | null;
+    msHighContrastAdjust: string | null;
+    msHyphenateLimitChars: string | null;
+    msHyphenateLimitLines: any;
+    msHyphenateLimitZone: any;
+    msHyphens: string | null;
+    msImeAlign: string | null;
+    msOverflowStyle: string | null;
+    msScrollChaining: string | null;
+    msScrollLimit: string | null;
+    msScrollLimitXMax: any;
+    msScrollLimitXMin: any;
+    msScrollLimitYMax: any;
+    msScrollLimitYMin: any;
+    msScrollRails: string | null;
+    msScrollSnapPointsX: string | null;
+    msScrollSnapPointsY: string | null;
+    msScrollSnapType: string | null;
+    msScrollSnapX: string | null;
+    msScrollSnapY: string | null;
+    msScrollTranslation: string | null;
+    msTextCombineHorizontal: string | null;
+    msTextSizeAdjust: any;
+    msTouchAction: string | null;
+    msTouchSelect: string | null;
+    msUserSelect: string | null;
+    msWrapFlow: string;
+    msWrapMargin: any;
+    msWrapThrough: string;
+    objectFit: string;
+    objectPosition: string;
+    opacity: string;
+    order: string;
+    orphans: string;
+    outline: string;
+    outlineColor: string;
+    outlineOffset: string;
+    outlineStyle: string;
+    outlineWidth: string;
+    overflow: string;
+    overflowAnchor: string;
+    overflowWrap: string;
+    overflowX: string;
+    overflowY: string;
+    padding: string;
+    paddingBlockEnd: string;
+    paddingBlockStart: string;
+    paddingBottom: string;
+    paddingInlineEnd: string;
+    paddingInlineStart: string;
+    paddingLeft: string;
+    paddingRight: string;
+    paddingTop: string;
+    pageBreakAfter: string;
+    pageBreakBefore: string;
+    pageBreakInside: string;
+    paintOrder: string;
+    readonly parentRule: CSSRule;
+    penAction: string | null;
+    perspective: string;
+    perspectiveOrigin: string;
+    placeContent: string;
+    placeItems: string;
+    placeSelf: string;
+    pointerEvents: string | null;
+    position: string;
+    quotes: string;
+    resize: string;
+    right: string;
+    rotate: string;
+    rowGap: string;
+    rubyAlign: string;
+    rubyOverhang: string | null;
+    rubyPosition: string;
+    scale: string;
+    scrollBehavior: string;
+    shapeRendering: string;
+    stopColor: string;
+    stopOpacity: string;
+    stroke: string;
+    strokeDasharray: string;
+    strokeDashoffset: string;
+    strokeLinecap: string;
+    strokeLinejoin: string;
+    strokeMiterlimit: string;
+    strokeOpacity: string;
+    strokeWidth: string;
+    tabSize: string;
+    tableLayout: string;
+    textAlign: string;
+    textAlignLast: string;
+    textAnchor: string;
+    textCombineUpright: string;
+    textDecoration: string;
+    textDecorationColor: string;
+    textDecorationLine: string;
+    textDecorationStyle: string;
+    textEmphasis: string;
+    textEmphasisColor: string;
+    textEmphasisPosition: string;
+    textEmphasisStyle: string;
+    textIndent: string;
+    textJustify: string;
+    textKashida: string | null;
+    textKashidaSpace: string | null;
+    textOrientation: string;
+    textOverflow: string;
+    textRendering: string;
+    textShadow: string;
+    textTransform: string;
+    textUnderlinePosition: string;
+    top: string;
+    touchAction: string;
+    transform: string;
+    transformBox: string;
+    transformOrigin: string;
+    transformStyle: string;
+    transition: string;
+    transitionDelay: string;
+    transitionDuration: string;
+    transitionProperty: string;
+    transitionTimingFunction: string;
+    translate: string;
+    unicodeBidi: string;
+    userSelect: string;
+    verticalAlign: string;
+    visibility: string;
+    /** @deprecated */
+    webkitAlignContent: string;
+    /** @deprecated */
+    webkitAlignItems: string;
+    /** @deprecated */
+    webkitAlignSelf: string;
+    /** @deprecated */
+    webkitAnimation: string;
+    /** @deprecated */
+    webkitAnimationDelay: string;
+    /** @deprecated */
+    webkitAnimationDirection: string;
+    /** @deprecated */
+    webkitAnimationDuration: string;
+    /** @deprecated */
+    webkitAnimationFillMode: string;
+    /** @deprecated */
+    webkitAnimationIterationCount: string;
+    /** @deprecated */
+    webkitAnimationName: string;
+    /** @deprecated */
+    webkitAnimationPlayState: string;
+    /** @deprecated */
+    webkitAnimationTimingFunction: string;
+    /** @deprecated */
+    webkitAppearance: string;
+    /** @deprecated */
+    webkitBackfaceVisibility: string;
+    /** @deprecated */
+    webkitBackgroundClip: string;
+    /** @deprecated */
+    webkitBackgroundOrigin: string;
+    /** @deprecated */
+    webkitBackgroundSize: string;
+    /** @deprecated */
+    webkitBorderBottomLeftRadius: string;
+    /** @deprecated */
+    webkitBorderBottomRightRadius: string;
+    webkitBorderImage: string | null;
+    /** @deprecated */
+    webkitBorderRadius: string;
+    /** @deprecated */
+    webkitBorderTopLeftRadius: string;
+    /** @deprecated */
+    webkitBorderTopRightRadius: string;
+    /** @deprecated */
+    webkitBoxAlign: string;
+    webkitBoxDirection: string | null;
+    /** @deprecated */
+    webkitBoxFlex: string;
+    /** @deprecated */
+    webkitBoxOrdinalGroup: string;
+    /** @deprecated */
+    webkitBoxOrient: string;
+    /** @deprecated */
+    webkitBoxPack: string;
+    /** @deprecated */
+    webkitBoxShadow: string;
+    /** @deprecated */
+    webkitBoxSizing: string;
+    webkitColumnBreakAfter: string | null;
+    webkitColumnBreakBefore: string | null;
+    webkitColumnBreakInside: string | null;
+    webkitColumnCount: any;
+    webkitColumnGap: any;
+    webkitColumnRule: string | null;
+    webkitColumnRuleColor: any;
+    webkitColumnRuleStyle: string | null;
+    webkitColumnRuleWidth: any;
+    webkitColumnSpan: string | null;
+    webkitColumnWidth: any;
+    webkitColumns: string | null;
+    /** @deprecated */
+    webkitFilter: string;
+    /** @deprecated */
+    webkitFlex: string;
+    /** @deprecated */
+    webkitFlexBasis: string;
+    /** @deprecated */
+    webkitFlexDirection: string;
+    /** @deprecated */
+    webkitFlexFlow: string;
+    /** @deprecated */
+    webkitFlexGrow: string;
+    /** @deprecated */
+    webkitFlexShrink: string;
+    /** @deprecated */
+    webkitFlexWrap: string;
+    /** @deprecated */
+    webkitJustifyContent: string;
+    webkitLineClamp: string;
+    /** @deprecated */
+    webkitMask: string;
+    /** @deprecated */
+    webkitMaskBoxImage: string;
+    /** @deprecated */
+    webkitMaskBoxImageOutset: string;
+    /** @deprecated */
+    webkitMaskBoxImageRepeat: string;
+    /** @deprecated */
+    webkitMaskBoxImageSlice: string;
+    /** @deprecated */
+    webkitMaskBoxImageSource: string;
+    /** @deprecated */
+    webkitMaskBoxImageWidth: string;
+    /** @deprecated */
+    webkitMaskClip: string;
+    /** @deprecated */
+    webkitMaskComposite: string;
+    /** @deprecated */
+    webkitMaskImage: string;
+    /** @deprecated */
+    webkitMaskOrigin: string;
+    /** @deprecated */
+    webkitMaskPosition: string;
+    /** @deprecated */
+    webkitMaskRepeat: string;
+    /** @deprecated */
+    webkitMaskSize: string;
+    /** @deprecated */
+    webkitOrder: string;
+    /** @deprecated */
+    webkitPerspective: string;
+    /** @deprecated */
+    webkitPerspectiveOrigin: string;
+    webkitTapHighlightColor: string | null;
+    /** @deprecated */
+    webkitTextFillColor: string;
+    /** @deprecated */
+    webkitTextSizeAdjust: string;
+    /** @deprecated */
+    webkitTextStroke: string;
+    /** @deprecated */
+    webkitTextStrokeColor: string;
+    /** @deprecated */
+    webkitTextStrokeWidth: string;
+    /** @deprecated */
+    webkitTransform: string;
+    /** @deprecated */
+    webkitTransformOrigin: string;
+    /** @deprecated */
+    webkitTransformStyle: string;
+    /** @deprecated */
+    webkitTransition: string;
+    /** @deprecated */
+    webkitTransitionDelay: string;
+    /** @deprecated */
+    webkitTransitionDuration: string;
+    /** @deprecated */
+    webkitTransitionProperty: string;
+    /** @deprecated */
+    webkitTransitionTimingFunction: string;
+    webkitUserModify: string | null;
+    webkitUserSelect: string | null;
+    webkitWritingMode: string | null;
+    whiteSpace: string;
+    widows: string;
+    width: string;
+    willChange: string;
+    wordBreak: string;
+    wordSpacing: string;
+    wordWrap: string;
+    writingMode: string;
+    zIndex: string;
+    zoom: string | null;
+    getPropertyPriority(propertyName: string): string;
+    getPropertyValue(propertyName: string): string;
+    item(index: number): string;
+    removeProperty(propertyName: string): string;
+    setProperty(propertyName: string, value: string | null, priority?: string | null): void;
+    [index: number]: string;
+}
+
+
+/** CSSStyleRule represents a single CSS style rule. It implements the CSSRule interface with a type value of 1 (CSSRule.STYLE_RULE). */
+export interface CSSStyleRule extends CSSRule {
+    selectorText: string;
+    readonly style: CSSStyleDeclaration;
+}
+
+
+/** A single CSS style sheet. It inherits properties and methods from its parent, StyleSheet. */
+export interface CSSStyleSheet extends StyleSheet {
+    readonly cssRules: CSSRuleList;
+    /** @deprecated */
+    cssText: string;
+    /** @deprecated */
+    readonly id: string;
+    /** @deprecated */
+    readonly imports: StyleSheetList;
+    /** @deprecated */
+    readonly isAlternate: boolean;
+    /** @deprecated */
+    readonly isPrefAlternate: boolean;
+    readonly ownerRule: CSSRule | null;
+    /** @deprecated */
+    readonly owningElement: Element;
+    /** @deprecated */
+    readonly pages: any;
+    /** @deprecated */
+    readonly readOnly: boolean;
+    readonly rules: CSSRuleList;
+    /** @deprecated */
+    addImport(bstrURL: string, lIndex?: number): number;
+    /** @deprecated */
+    addPageRule(bstrSelector: string, bstrStyle: string, lIndex?: number): number;
+    addRule(bstrSelector: string, bstrStyle?: string, lIndex?: number): number;
+    deleteRule(index?: number): void;
+    insertRule(rule: string, index?: number): number;
+    /** @deprecated */
+    removeImport(lIndex: number): void;
+    removeRule(lIndex: number): void;
+}
+
+
+/** An object representing a single CSS @supports at-rule. It implements the CSSConditionRule interface, and therefore the CSSRule and CSSGroupingRule interfaces with a type value of 12 (CSSRule.SUPPORTS_RULE). */
+export interface CSSSupportsRule extends CSSConditionRule {
+}
+
+
+/** Provides a storage mechanism for Request / Response object pairs that are cached, for example as part of the ServiceWorker life cycle. Note that the Cache interface is exposed to windowed scopes as well as workers. You don't have to use it in conjunction with service workers, even though it is defined in the service worker spec. */
+export interface Cache {
+    add(request: RequestInfo): Promise<void>;
+    addAll(requests: RequestInfo[]): Promise<void>;
+    delete(request: RequestInfo, options?: CacheQueryOptions): Promise<boolean>;
+    keys(request?: RequestInfo, options?: CacheQueryOptions): Promise<ReadonlyArray<Request>>;
+    match(request: RequestInfo, options?: CacheQueryOptions): Promise<Response | undefined>;
+    matchAll(request?: RequestInfo, options?: CacheQueryOptions): Promise<ReadonlyArray<Response>>;
+    put(request: RequestInfo, response: Response): Promise<void>;
+}
+
+
+/** The storage for Cache objects. */
+export interface CacheStorage {
+    delete(cacheName: string): Promise<boolean>;
+    has(cacheName: string): Promise<boolean>;
+    keys(): Promise<string[]>;
+    match(request: RequestInfo, options?: MultiCacheQueryOptions): Promise<Response | undefined>;
+    open(cacheName: string): Promise<Cache>;
+}
+
+
+export interface CanvasCompositing {
+    globalAlpha: number;
+    globalCompositeOperation: string;
+}
+
+export interface CanvasDrawImage {
+    drawImage(image: CanvasImageSource, dx: number, dy: number): void;
+    drawImage(image: CanvasImageSource, dx: number, dy: number, dw: number, dh: number): void;
+    drawImage(image: CanvasImageSource, sx: number, sy: number, sw: number, sh: number, dx: number, dy: number, dw: number, dh: number): void;
+}
+
+export interface CanvasDrawPath {
+    beginPath(): void;
+    clip(fillRule?: CanvasFillRule): void;
+    clip(path: Path2D, fillRule?: CanvasFillRule): void;
+    fill(fillRule?: CanvasFillRule): void;
+    fill(path: Path2D, fillRule?: CanvasFillRule): void;
+    isPointInPath(x: number, y: number, fillRule?: CanvasFillRule): boolean;
+    isPointInPath(path: Path2D, x: number, y: number, fillRule?: CanvasFillRule): boolean;
+    isPointInStroke(x: number, y: number): boolean;
+    isPointInStroke(path: Path2D, x: number, y: number): boolean;
+    stroke(): void;
+    stroke(path: Path2D): void;
+}
+
+export interface CanvasFillStrokeStyles {
+    fillStyle: string | CanvasGradient | CanvasPattern;
+    strokeStyle: string | CanvasGradient | CanvasPattern;
+    createLinearGradient(x0: number, y0: number, x1: number, y1: number): CanvasGradient;
+    createPattern(image: CanvasImageSource, repetition: string): CanvasPattern | null;
+    createRadialGradient(x0: number, y0: number, r0: number, x1: number, y1: number, r1: number): CanvasGradient;
+}
+
+export interface CanvasFilters {
+    filter: string;
+}
+
+/** An opaque object describing a gradient. It is returned by the methods CanvasRenderingContext2D.createLinearGradient() or CanvasRenderingContext2D.createRadialGradient(). */
+export interface CanvasGradient {
+    /**
+     * Adds a color stop with the given color to the gradient at the given offset. 0.0 is the offset at one end of the gradient, 1.0 is the offset at the other end.
+     * 
+     * Throws an "IndexSizeError" DOMException if the offset is out of range. Throws a "SyntaxError" DOMException if the color cannot be parsed.
+     */
+    addColorStop(offset: number, color: string): void;
+}
+
+
+export interface CanvasImageData {
+    createImageData(sw: number, sh: number): ImageData;
+    createImageData(imagedata: ImageData): ImageData;
+    getImageData(sx: number, sy: number, sw: number, sh: number): ImageData;
+    putImageData(imagedata: ImageData, dx: number, dy: number): void;
+    putImageData(imagedata: ImageData, dx: number, dy: number, dirtyX: number, dirtyY: number, dirtyWidth: number, dirtyHeight: number): void;
+}
+
+export interface CanvasImageSmoothing {
+    imageSmoothingEnabled: boolean;
+    imageSmoothingQuality: ImageSmoothingQuality;
+}
+
+export interface CanvasPath {
+    arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, anticlockwise?: boolean): void;
+    arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void;
+    bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void;
+    closePath(): void;
+    ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, anticlockwise?: boolean): void;
+    lineTo(x: number, y: number): void;
+    moveTo(x: number, y: number): void;
+    quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void;
+    rect(x: number, y: number, w: number, h: number): void;
+}
+
+export interface CanvasPathDrawingStyles {
+    lineCap: CanvasLineCap;
+    lineDashOffset: number;
+    lineJoin: CanvasLineJoin;
+    lineWidth: number;
+    miterLimit: number;
+    getLineDash(): number[];
+    setLineDash(segments: number[]): void;
+}
+
+/** An opaque object describing a pattern, based on an image, a canvas, or a video, created by the CanvasRenderingContext2D.createPattern() method. */
+export interface CanvasPattern {
+    /**
+     * Sets the transformation matrix that will be used when rendering the pattern during a fill or stroke painting operation.
+     */
+    setTransform(transform?: DOMMatrix2DInit): void;
+}
+
+
+export interface CanvasRect {
+    clearRect(x: number, y: number, w: number, h: number): void;
+    fillRect(x: number, y: number, w: number, h: number): void;
+    strokeRect(x: number, y: number, w: number, h: number): void;
+}
+
+/** The CanvasRenderingContext2D interface, part of the Canvas API, provides the 2D rendering context for the drawing surface of a <canvas> element. It is used for drawing shapes, text, images, and other objects. */
+export interface CanvasRenderingContext2D extends CanvasCompositing, CanvasDrawImage, CanvasDrawPath, CanvasFillStrokeStyles, CanvasFilters, CanvasImageData, CanvasImageSmoothing, CanvasPath, CanvasPathDrawingStyles, CanvasRect, CanvasShadowStyles, CanvasState, CanvasText, CanvasTextDrawingStyles, CanvasTransform, CanvasUserInterface {
+    readonly canvas: HTMLCanvasElement;
+}
+
+
+export interface CanvasShadowStyles {
+    shadowBlur: number;
+    shadowColor: string;
+    shadowOffsetX: number;
+    shadowOffsetY: number;
+}
+
+export interface CanvasState {
+    restore(): void;
+    save(): void;
+}
+
+export interface CanvasText {
+    fillText(text: string, x: number, y: number, maxWidth?: number): void;
+    measureText(text: string): TextMetrics;
+    strokeText(text: string, x: number, y: number, maxWidth?: number): void;
+}
+
+export interface CanvasTextDrawingStyles {
+    direction: CanvasDirection;
+    font: string;
+    textAlign: CanvasTextAlign;
+    textBaseline: CanvasTextBaseline;
+}
+
+export interface CanvasTransform {
+    getTransform(): DOMMatrix;
+    resetTransform(): void;
+    rotate(angle: number): void;
+    scale(x: number, y: number): void;
+    setTransform(a: number, b: number, c: number, d: number, e: number, f: number): void;
+    setTransform(transform?: DOMMatrix2DInit): void;
+    transform(a: number, b: number, c: number, d: number, e: number, f: number): void;
+    translate(x: number, y: number): void;
+}
+
+export interface CanvasUserInterface {
+    drawFocusIfNeeded(element: Element): void;
+    drawFocusIfNeeded(path: Path2D, element: Element): void;
+    scrollPathIntoView(): void;
+    scrollPathIntoView(path: Path2D): void;
+}
+
+export interface CaretPosition {
+    readonly offset: number;
+    readonly offsetNode: Node;
+    getClientRect(): DOMRect | null;
+}
+
+
+/** The ChannelMergerNode interface, often used in conjunction with its opposite, ChannelSplitterNode, reunites different mono inputs into a single output. Each input is used to fill a channel of the output. This is useful for accessing each channels separately, e.g. for performing channel mixing where gain must be separately controlled on each channel. */
+export interface ChannelMergerNode extends AudioNode {
+}
+
+
+/** The ChannelSplitterNode interface, often used in conjunction with its opposite, ChannelMergerNode, separates the different channels of an audio source into a set of mono outputs. This is useful for accessing each channel separately, e.g. for performing channel mixing where gain must be separately controlled on each channel. */
+export interface ChannelSplitterNode extends AudioNode {
+}
+
+
+/** The CharacterData abstract interface represents a Node object that contains characters. This is an abstract interface, meaning there aren't any object of type CharacterData: it is implemented by other interfaces, like Text, Comment, or ProcessingInstruction which aren't abstract. */
+export interface CharacterData extends Node, ChildNode, NonDocumentTypeChildNode {
+    data: string;
+    readonly length: number;
+    appendData(data: string): void;
+    deleteData(offset: number, count: number): void;
+    insertData(offset: number, data: string): void;
+    replaceData(offset: number, count: number, data: string): void;
+    substringData(offset: number, count: number): string;
+}
+
+
+export interface ChildNode extends Node {
+    /**
+     * Inserts nodes just after node, while replacing strings in nodes with equivalent Text nodes.
+     * 
+     * Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.
+     */
+    after(...nodes: (Node | string)[]): void;
+    /**
+     * Inserts nodes just before node, while replacing strings in nodes with equivalent Text nodes.
+     * 
+     * Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.
+     */
+    before(...nodes: (Node | string)[]): void;
+    /**
+     * Removes node.
+     */
+    remove(): void;
+    /**
+     * Replaces node with nodes, while replacing strings in nodes with equivalent Text nodes.
+     * 
+     * Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.
+     */
+    replaceWith(...nodes: (Node | string)[]): void;
+}
+
+export interface ClientRect {
+    bottom: number;
+    readonly height: number;
+    left: number;
+    right: number;
+    top: number;
+    readonly width: number;
+}
+
+
+export interface ClientRectList {
+    readonly length: number;
+    item(index: number): ClientRect;
+    [index: number]: ClientRect;
+}
+
+
+export interface Clipboard extends EventTarget {
+    readText(): Promise<string>;
+    writeText(data: string): Promise<void>;
+}
+
+
+/** Events providing information related to modification of the clipboard, that is cut, copy, and paste events. */
+export interface ClipboardEvent extends Event {
+    readonly clipboardData: DataTransfer | null;
+}
+
+
+/** A CloseEvent is sent to clients using WebSockets when the connection is closed. This is delivered to the listener indicated by the WebSocket object's onclose attribute. */
+export interface CloseEvent extends Event {
+    /**
+     * Returns the WebSocket connection close code provided by the server.
+     */
+    readonly code: number;
+    /**
+     * Returns the WebSocket connection close reason provided by the server.
+     */
+    readonly reason: string;
+    /**
+     * Returns true if the connection closed cleanly; false otherwise.
+     */
+    readonly wasClean: boolean;
+}
+
+
+/** Textual notations within markup; although it is generally not visually shown, such comments are available to be read in the source view. */
+export interface Comment extends CharacterData {
+}
+
+
+/** The DOM CompositionEvent represents events that occur due to the user indirectly entering text. */
+export interface CompositionEvent extends UIEvent {
+    readonly data: string;
+}
+
+
+export interface ConcatParams extends Algorithm {
+    algorithmId: Uint8Array;
+    hash?: string | Algorithm;
+    partyUInfo: Uint8Array;
+    partyVInfo: Uint8Array;
+    privateInfo?: Uint8Array;
+    publicInfo?: Uint8Array;
+}
+
+/** Provides access to the browser's debugging console (e.g. the Web Console in Firefox). The specifics of how it works varies from browser to browser, but there is a de facto set of features that are typically provided. */
+export interface Console {
+    memory: any;
+    assert(condition?: boolean, message?: string, ...data: any[]): void;
+    clear(): void;
+    count(label?: string): void;
+    debug(message?: any, ...optionalParams: any[]): void;
+    dir(value?: any, ...optionalParams: any[]): void;
+    dirxml(value: any): void;
+    error(message?: any, ...optionalParams: any[]): void;
+    exception(message?: string, ...optionalParams: any[]): void;
+    group(groupTitle?: string, ...optionalParams: any[]): void;
+    groupCollapsed(groupTitle?: string, ...optionalParams: any[]): void;
+    groupEnd(): void;
+    info(message?: any, ...optionalParams: any[]): void;
+    log(message?: any, ...optionalParams: any[]): void;
+    markTimeline(label?: string): void;
+    profile(reportName?: string): void;
+    profileEnd(reportName?: string): void;
+    table(...tabularData: any[]): void;
+    time(label?: string): void;
+    timeEnd(label?: string): void;
+    timeStamp(label?: string): void;
+    timeline(label?: string): void;
+    timelineEnd(label?: string): void;
+    trace(message?: any, ...optionalParams: any[]): void;
+    warn(message?: any, ...optionalParams: any[]): void;
+}
+
+
+export interface ConstantSourceNode extends AudioScheduledSourceNode {
+    readonly offset: AudioParam;
+    addEventListener<K extends keyof AudioScheduledSourceNodeEventMap>(type: K, listener: (this: ConstantSourceNode, ev: AudioScheduledSourceNodeEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof AudioScheduledSourceNodeEventMap>(type: K, listener: (this: ConstantSourceNode, ev: AudioScheduledSourceNodeEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** An AudioNode that performs a Linear Convolution on a given AudioBuffer, often used to achieve a reverb effect. A ConvolverNode always has exactly one input and one output. */
+export interface ConvolverNode extends AudioNode {
+    buffer: AudioBuffer | null;
+    normalize: boolean;
+}
+
+
+/** The position and altitude of the device on Earth, as well as the accuracy with which these properties are calculated. */
+export interface Coordinates {
+    readonly accuracy: number;
+    readonly altitude: number | null;
+    readonly altitudeAccuracy: number | null;
+    readonly heading: number | null;
+    readonly latitude: number;
+    readonly longitude: number;
+    readonly speed: number | null;
+}
+
+/** This Streams API interface provides a built-in byte length queuing strategy that can be used when constructing streams. */
+export interface CountQueuingStrategy extends QueuingStrategy {
+    highWaterMark: number;
+    size(chunk: any): 1;
+}
+
+
+export interface Credential {
+    readonly id: string;
+    readonly type: string;
+}
+
+
+export interface CredentialsContainer {
+    create(options?: CredentialCreationOptions): Promise<Credential | null>;
+    get(options?: CredentialRequestOptions): Promise<Credential | null>;
+    preventSilentAccess(): Promise<void>;
+    store(credential: Credential): Promise<Credential>;
+}
+
+
+/** Basic cryptography features available in the current context. It allows access to a cryptographically strong random number generator and to cryptographic primitives. */
+export interface Crypto {
+    readonly subtle: SubtleCrypto;
+    getRandomValues<T extends Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | null>(array: T): T;
+}
+
+
+/** The CryptoKey dictionary of the Web Crypto API represents a cryptographic key. */
+export interface CryptoKey {
+    readonly algorithm: KeyAlgorithm;
+    readonly extractable: boolean;
+    readonly type: KeyType;
+    readonly usages: KeyUsage[];
+}
+
+
+/** The CryptoKeyPair dictionary of the Web Crypto API represents a key pair for an asymmetric cryptography algorithm, also known as a public-key algorithm. */
+export interface CryptoKeyPair {
+    privateKey: CryptoKey;
+    publicKey: CryptoKey;
+}
+
+
+export interface CustomElementRegistry {
+    define(name: string, constructor: CustomElementConstructor, options?: ElementDefinitionOptions): void;
+    get(name: string): any;
+    upgrade(root: Node): void;
+    whenDefined(name: string): Promise<void>;
+}
+
+
+export interface CustomEvent<T = any> extends Event {
+    /**
+     * Returns any custom data event was created with. Typically used for synthetic events.
+     */
+    readonly detail: T;
+    initCustomEvent(typeArg: string, canBubbleArg: boolean, cancelableArg: boolean, detailArg: T): void;
+}
+
+
+/** An error object that contains an error name. */
+export interface DOMError {
+    readonly name: string;
+    toString(): string;
+}
+
+
+/** An abnormal event (called an exception) which occurs as a result of calling a method or accessing a property of a web API. */
+export interface DOMException {
+    readonly code: number;
+    readonly message: string;
+    readonly name: string;
+    readonly ABORT_ERR: number;
+    readonly DATA_CLONE_ERR: number;
+    readonly DOMSTRING_SIZE_ERR: number;
+    readonly HIERARCHY_REQUEST_ERR: number;
+    readonly INDEX_SIZE_ERR: number;
+    readonly INUSE_ATTRIBUTE_ERR: number;
+    readonly INVALID_ACCESS_ERR: number;
+    readonly INVALID_CHARACTER_ERR: number;
+    readonly INVALID_MODIFICATION_ERR: number;
+    readonly INVALID_NODE_TYPE_ERR: number;
+    readonly INVALID_STATE_ERR: number;
+    readonly NAMESPACE_ERR: number;
+    readonly NETWORK_ERR: number;
+    readonly NOT_FOUND_ERR: number;
+    readonly NOT_SUPPORTED_ERR: number;
+    readonly NO_DATA_ALLOWED_ERR: number;
+    readonly NO_MODIFICATION_ALLOWED_ERR: number;
+    readonly QUOTA_EXCEEDED_ERR: number;
+    readonly SECURITY_ERR: number;
+    readonly SYNTAX_ERR: number;
+    readonly TIMEOUT_ERR: number;
+    readonly TYPE_MISMATCH_ERR: number;
+    readonly URL_MISMATCH_ERR: number;
+    readonly VALIDATION_ERR: number;
+    readonly WRONG_DOCUMENT_ERR: number;
+}
+
+
+/** An object providing methods which are not dependent on any particular document. Such an object is returned by the Document.implementation property. */
+export interface DOMImplementation {
+    createDocument(namespaceURI: string | null, qualifiedName: string | null, doctype: DocumentType | null): Document;
+    createDocumentType(qualifiedName: string, publicId: string, systemId: string): DocumentType;
+    createHTMLDocument(title?: string): Document;
+    /** @deprecated */
+    hasFeature(...args: any[]): true;
+}
+
+
+export interface DOML2DeprecatedColorProperty {
+    color: string;
+}
+
+export interface DOMMatrix extends DOMMatrixReadOnly {
+    a: number;
+    b: number;
+    c: number;
+    d: number;
+    e: number;
+    f: number;
+    m11: number;
+    m12: number;
+    m13: number;
+    m14: number;
+    m21: number;
+    m22: number;
+    m23: number;
+    m24: number;
+    m31: number;
+    m32: number;
+    m33: number;
+    m34: number;
+    m41: number;
+    m42: number;
+    m43: number;
+    m44: number;
+    invertSelf(): DOMMatrix;
+    multiplySelf(other?: DOMMatrixInit): DOMMatrix;
+    preMultiplySelf(other?: DOMMatrixInit): DOMMatrix;
+    rotateAxisAngleSelf(x?: number, y?: number, z?: number, angle?: number): DOMMatrix;
+    rotateFromVectorSelf(x?: number, y?: number): DOMMatrix;
+    rotateSelf(rotX?: number, rotY?: number, rotZ?: number): DOMMatrix;
+    scale3dSelf(scale?: number, originX?: number, originY?: number, originZ?: number): DOMMatrix;
+    scaleSelf(scaleX?: number, scaleY?: number, scaleZ?: number, originX?: number, originY?: number, originZ?: number): DOMMatrix;
+    setMatrixValue(transformList: string): DOMMatrix;
+    skewXSelf(sx?: number): DOMMatrix;
+    skewYSelf(sy?: number): DOMMatrix;
+    translateSelf(tx?: number, ty?: number, tz?: number): DOMMatrix;
+}
+
+
+export type SVGMatrix = DOMMatrix;
+
+export type WebKitCSSMatrix = DOMMatrix;
+
+export interface DOMMatrixReadOnly {
+    readonly a: number;
+    readonly b: number;
+    readonly c: number;
+    readonly d: number;
+    readonly e: number;
+    readonly f: number;
+    readonly is2D: boolean;
+    readonly isIdentity: boolean;
+    readonly m11: number;
+    readonly m12: number;
+    readonly m13: number;
+    readonly m14: number;
+    readonly m21: number;
+    readonly m22: number;
+    readonly m23: number;
+    readonly m24: number;
+    readonly m31: number;
+    readonly m32: number;
+    readonly m33: number;
+    readonly m34: number;
+    readonly m41: number;
+    readonly m42: number;
+    readonly m43: number;
+    readonly m44: number;
+    flipX(): DOMMatrix;
+    flipY(): DOMMatrix;
+    inverse(): DOMMatrix;
+    multiply(other?: DOMMatrixInit): DOMMatrix;
+    rotate(rotX?: number, rotY?: number, rotZ?: number): DOMMatrix;
+    rotateAxisAngle(x?: number, y?: number, z?: number, angle?: number): DOMMatrix;
+    rotateFromVector(x?: number, y?: number): DOMMatrix;
+    scale(scaleX?: number, scaleY?: number, scaleZ?: number, originX?: number, originY?: number, originZ?: number): DOMMatrix;
+    scale3d(scale?: number, originX?: number, originY?: number, originZ?: number): DOMMatrix;
+    /** @deprecated */
+    scaleNonUniform(scaleX?: number, scaleY?: number): DOMMatrix;
+    skewX(sx?: number): DOMMatrix;
+    skewY(sy?: number): DOMMatrix;
+    toFloat32Array(): Float32Array;
+    toFloat64Array(): Float64Array;
+    toJSON(): any;
+    transformPoint(point?: DOMPointInit): DOMPoint;
+    translate(tx?: number, ty?: number, tz?: number): DOMMatrix;
+    toString(): string;
+}
+
+
+/** Provides the ability to parse XML or HTML source code from a string into a DOM Document. */
+export interface DOMParser {
+    parseFromString(str: string, type: SupportedType): Document;
+}
+
+
+export interface DOMPoint extends DOMPointReadOnly {
+    w: number;
+    x: number;
+    y: number;
+    z: number;
+}
+
+
+export type SVGPoint = DOMPoint;
+
+export interface DOMPointReadOnly {
+    readonly w: number;
+    readonly x: number;
+    readonly y: number;
+    readonly z: number;
+    matrixTransform(matrix?: DOMMatrixInit): DOMPoint;
+    toJSON(): any;
+}
+
+
+export interface DOMQuad {
+    readonly p1: DOMPoint;
+    readonly p2: DOMPoint;
+    readonly p3: DOMPoint;
+    readonly p4: DOMPoint;
+    getBounds(): DOMRect;
+    toJSON(): any;
+}
+
+
+export interface DOMRect extends DOMRectReadOnly {
+    height: number;
+    width: number;
+    x: number;
+    y: number;
+}
+
+
+export type SVGRect = DOMRect;
+
+export interface DOMRectList {
+    readonly length: number;
+    item(index: number): DOMRect | null;
+    [index: number]: DOMRect;
+}
+
+
+export interface DOMRectReadOnly {
+    readonly bottom: number;
+    readonly height: number;
+    readonly left: number;
+    readonly right: number;
+    readonly top: number;
+    readonly width: number;
+    readonly x: number;
+    readonly y: number;
+    toJSON(): any;
+}
+
+
+export interface DOMSettableTokenList extends DOMTokenList {
+    value: string;
+}
+
+
+/** A type returned by some APIs which contains a list of DOMString (strings). */
+export interface DOMStringList {
+    /**
+     * Returns the number of strings in strings.
+     */
+    readonly length: number;
+    /**
+     * Returns true if strings contains string, and false otherwise.
+     */
+    contains(string: string): boolean;
+    /**
+     * Returns the string with index index from strings.
+     */
+    item(index: number): string | null;
+    [index: number]: string;
+}
+
+
+/** Used by the dataset HTML attribute to represent data for custom attributes added to elements. */
+export interface DOMStringMap {
+    [name: string]: string | undefined;
+}
+
+
+/** A set of space-separated tokens. Such a set is returned by Element.classList, HTMLLinkElement.relList, HTMLAnchorElement.relList, HTMLAreaElement.relList, HTMLIframeElement.sandbox, or HTMLOutputElement.htmlFor. It is indexed beginning with 0 as with JavaScript Array objects. DOMTokenList is always case-sensitive. */
+export interface DOMTokenList {
+    /**
+     * Returns the number of tokens.
+     */
+    readonly length: number;
+    /**
+     * Returns the associated set as string.
+     * 
+     * Can be set, to change the associated attribute.
+     */
+    value: string;
+    toString(): string;
+    /**
+     * Adds all arguments passed, except those already present.
+     * 
+     * Throws a "SyntaxError" DOMException if one of the arguments is the empty string.
+     * 
+     * Throws an "InvalidCharacterError" DOMException if one of the arguments contains any ASCII whitespace.
+     */
+    add(...tokens: string[]): void;
+    /**
+     * Returns true if token is present, and false otherwise.
+     */
+    contains(token: string): boolean;
+    /**
+     * Returns the token with index index.
+     */
+    item(index: number): string | null;
+    /**
+     * Removes arguments passed, if they are present.
+     * 
+     * Throws a "SyntaxError" DOMException if one of the arguments is the empty string.
+     * 
+     * Throws an "InvalidCharacterError" DOMException if one of the arguments contains any ASCII whitespace.
+     */
+    remove(...tokens: string[]): void;
+    /**
+     * Replaces token with newToken.
+     * 
+     * Returns true if token was replaced with newToken, and false otherwise.
+     * 
+     * Throws a "SyntaxError" DOMException if one of the arguments is the empty string.
+     * 
+     * Throws an "InvalidCharacterError" DOMException if one of the arguments contains any ASCII whitespace.
+     */
+    replace(oldToken: string, newToken: string): void;
+    /**
+     * Returns true if token is in the associated attribute's supported tokens. Returns false otherwise.
+     * 
+     * Throws a TypeError if the associated attribute has no supported tokens defined.
+     */
+    supports(token: string): boolean;
+    /**
+     * If force is not given, "toggles" token, removing it if it's present and adding it if it's not present. If force is true, adds token (same as add()). If force is false, removes token (same as remove()).
+     * 
+     * Returns true if token is now present, and false otherwise.
+     * 
+     * Throws a "SyntaxError" DOMException if token is empty.
+     * 
+     * Throws an "InvalidCharacterError" DOMException if token contains any spaces.
+     */
+    toggle(token: string, force?: boolean): boolean;
+    forEach(callbackfn: (value: string, key: number, parent: DOMTokenList) => void, thisArg?: any): void;
+    [index: number]: string;
+}
+
+
+export interface DataCue extends TextTrackCue {
+    data: ArrayBuffer;
+    addEventListener<K extends keyof TextTrackCueEventMap>(type: K, listener: (this: DataCue, ev: TextTrackCueEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof TextTrackCueEventMap>(type: K, listener: (this: DataCue, ev: TextTrackCueEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Used to hold the data that is being dragged during a drag and drop operation. It may hold one or more data items, each of one or more data types. For more information about drag and drop, see HTML Drag and Drop API. */
+export interface DataTransfer {
+    /**
+     * Returns the kind of operation that is currently selected. If the kind of operation isn't one of those that is allowed by the effectAllowed attribute, then the operation will fail.
+     * 
+     * Can be set, to change the selected operation.
+     * 
+     * The possible values are "none", "copy", "link", and "move".
+     */
+    dropEffect: string;
+    /**
+     * Returns the kinds of operations that are to be allowed.
+     * 
+     * Can be set (during the dragstart event), to change the allowed operations.
+     * 
+     * The possible values are "none", "copy", "copyLink", "copyMove", "link", "linkMove", "move", "all", and "uninitialized",
+     */
+    effectAllowed: string;
+    /**
+     * Returns a FileList of the files being dragged, if any.
+     */
+    readonly files: FileList;
+    /**
+     * Returns a DataTransferItemList object, with the drag data.
+     */
+    readonly items: DataTransferItemList;
+    /**
+     * Returns a frozen array listing the formats that were set in the dragstart event. In addition, if any files are being dragged, then one of the types will be the string "Files".
+     */
+    readonly types: ReadonlyArray<string>;
+    /**
+     * Removes the data of the specified formats. Removes all data if the argument is omitted.
+     */
+    clearData(format?: string): void;
+    /**
+     * Returns the specified data. If there is no such data, returns the empty string.
+     */
+    getData(format: string): string;
+    /**
+     * Adds the specified data.
+     */
+    setData(format: string, data: string): void;
+    /**
+     * Uses the given element to update the drag feedback, replacing any previously specified feedback.
+     */
+    setDragImage(image: Element, x: number, y: number): void;
+}
+
+
+/** One drag data item. During a drag operation, each drag event has a dataTransfer property which contains a list of drag data items. Each item in the list is a DataTransferItem object. */
+export interface DataTransferItem {
+    /**
+     * Returns the drag data item kind, one of: "string", "file".
+     */
+    readonly kind: string;
+    /**
+     * Returns the drag data item type string.
+     */
+    readonly type: string;
+    /**
+     * Returns a File object, if the drag data item kind is File.
+     */
+    getAsFile(): File | null;
+    /**
+     * Invokes the callback with the string data as the argument, if the drag data item kind is text.
+     */
+    getAsString(callback: FunctionStringCallback | null): void;
+    webkitGetAsEntry(): any;
+}
+
+
+/** A list of DataTransferItem objects representing items being dragged. During a drag operation, each DragEvent has a dataTransfer property and that property is a DataTransferItemList. */
+export interface DataTransferItemList {
+    /**
+     * Returns the number of items in the drag data store.
+     */
+    readonly length: number;
+    /**
+     * Adds a new entry for the given data to the drag data store. If the data is plain text then a type string has to be provided also.
+     */
+    add(data: string, type: string): DataTransferItem | null;
+    add(data: File): DataTransferItem | null;
+    /**
+     * Removes all the entries in the drag data store.
+     */
+    clear(): void;
+    item(index: number): DataTransferItem;
+    /**
+     * Removes the indexth entry in the drag data store.
+     */
+    remove(index: number): void;
+    [name: number]: DataTransferItem;
+}
+
+
+export interface DeferredPermissionRequest {
+    readonly id: number;
+    readonly type: MSWebViewPermissionType;
+    readonly uri: string;
+    allow(): void;
+    deny(): void;
+}
+
+
+/** A delay-line; an AudioNode audio-processing module that causes a delay between the arrival of an input data and its propagation to the output. */
+export interface DelayNode extends AudioNode {
+    readonly delayTime: AudioParam;
+}
+
+
+/** Provides information about the amount of acceleration the device is experiencing along all three axes. */
+export interface DeviceAcceleration {
+    readonly x: number | null;
+    readonly y: number | null;
+    readonly z: number | null;
+}
+
+
+/** The DeviceLightEvent provides web developers with information from photo sensors or similiar detectors about ambient light levels near the device. For example this may be useful to adjust the screen's brightness based on the current ambient light level in order to save energy or provide better readability. */
+export interface DeviceLightEvent extends Event {
+    readonly value: number;
+}
+
+
+/** The DeviceMotionEvent provides web developers with information about the speed of changes for the device's position and orientation. */
+export interface DeviceMotionEvent extends Event {
+    readonly acceleration: DeviceMotionEventAcceleration | null;
+    readonly accelerationIncludingGravity: DeviceMotionEventAcceleration | null;
+    readonly interval: number;
+    readonly rotationRate: DeviceMotionEventRotationRate | null;
+}
+
+
+export interface DeviceMotionEventAcceleration {
+    readonly x: number | null;
+    readonly y: number | null;
+    readonly z: number | null;
+}
+
+export interface DeviceMotionEventRotationRate {
+    readonly alpha: number | null;
+    readonly beta: number | null;
+    readonly gamma: number | null;
+}
+
+/** The DeviceOrientationEvent provides web developers with information from the physical orientation of the device running the web page. */
+export interface DeviceOrientationEvent extends Event {
+    readonly absolute: boolean;
+    readonly alpha: number | null;
+    readonly beta: number | null;
+    readonly gamma: number | null;
+}
+
+
+/** Provides information about the rate at which the device is rotating around all three axes. */
+export interface DeviceRotationRate {
+    readonly alpha: number | null;
+    readonly beta: number | null;
+    readonly gamma: number | null;
+}
+
+
+export interface DhImportKeyParams extends Algorithm {
+    generator: Uint8Array;
+    prime: Uint8Array;
+}
+
+export interface DhKeyAlgorithm extends KeyAlgorithm {
+    generator: Uint8Array;
+    prime: Uint8Array;
+}
+
+export interface DhKeyDeriveParams extends Algorithm {
+    public: CryptoKey;
+}
+
+export interface DhKeyGenParams extends Algorithm {
+    generator: Uint8Array;
+    prime: Uint8Array;
+}
+
+export interface DocumentEventMap extends GlobalEventHandlersEventMap, DocumentAndElementEventHandlersEventMap {
+    "fullscreenchange": Event;
+    "fullscreenerror": Event;
+    "pointerlockchange": Event;
+    "pointerlockerror": Event;
+    "readystatechange": Event;
+    "visibilitychange": Event;
+}
+
+/** Any web page loaded in the browser and serves as an entry point into the web page's content, which is the DOM tree. */
+export interface Document extends Node, DocumentAndElementEventHandlers, DocumentOrShadowRoot, GlobalEventHandlers, NonElementParentNode, ParentNode, XPathEvaluatorBase {
+    /**
+     * Sets or gets the URL for the current document.
+     */
+    readonly URL: string;
+    /**
+     * Sets or gets the color of all active links in the document.
+     */
+    /** @deprecated */
+    alinkColor: string;
+    /**
+     * Returns a reference to the collection of elements contained by the object.
+     */
+    /** @deprecated */
+    readonly all: HTMLAllCollection;
+    /**
+     * Retrieves a collection of all a objects that have a name and/or id property. Objects in this collection are in HTML source order.
+     */
+    /** @deprecated */
+    readonly anchors: HTMLCollectionOf<HTMLAnchorElement>;
+    /**
+     * Retrieves a collection of all applet objects in the document.
+     */
+    /** @deprecated */
+    readonly applets: HTMLCollectionOf<HTMLAppletElement>;
+    /**
+     * Deprecated. Sets or retrieves a value that indicates the background color behind the object.
+     */
+    /** @deprecated */
+    bgColor: string;
+    /**
+     * Specifies the beginning and end of the document body.
+     */
+    body: HTMLElement;
+    /**
+     * Returns document's encoding.
+     */
+    readonly characterSet: string;
+    /**
+     * Gets or sets the character set used to encode the object.
+     */
+    readonly charset: string;
+    /**
+     * Gets a value that indicates whether standards-compliant mode is switched on for the object.
+     */
+    readonly compatMode: string;
+    /**
+     * Returns document's content type.
+     */
+    readonly contentType: string;
+    /**
+     * Returns the HTTP cookies that apply to the Document. If there are no cookies or cookies can't be applied to this resource, the empty string will be returned.
+     * 
+     * Can be set, to add a new cookie to the element's set of HTTP cookies.
+     * 
+     * If the contents are sandboxed into a unique origin (e.g. in an iframe with the sandbox attribute), a "SecurityError" DOMException will be thrown on getting and setting.
+     */
+    cookie: string;
+    /**
+     * Returns the script element, or the SVG script element, that is currently executing, as long as the element represents a classic script. In the case of reentrant script execution, returns the one that most recently started executing amongst those that have not yet finished executing.
+     * 
+     * Returns null if the Document is not currently executing a script or SVG script element (e.g., because the running script is an event handler, or a timeout), or if the currently executing script or SVG script element represents a module script.
+     */
+    readonly currentScript: HTMLOrSVGScriptElement | null;
+    readonly defaultView: WindowProxy | null;
+    /**
+     * Sets or gets a value that indicates whether the document can be edited.
+     */
+    designMode: string;
+    /**
+     * Sets or retrieves a value that indicates the reading order of the object.
+     */
+    dir: string;
+    /**
+     * Gets an object representing the document type declaration associated with the current document.
+     */
+    readonly doctype: DocumentType | null;
+    /**
+     * Gets a reference to the root node of the document.
+     */
+    readonly documentElement: HTMLElement;
+    /**
+     * Returns document's URL.
+     */
+    readonly documentURI: string;
+    /**
+     * Sets or gets the security domain of the document.
+     */
+    domain: string;
+    /**
+     * Retrieves a collection of all embed objects in the document.
+     */
+    readonly embeds: HTMLCollectionOf<HTMLEmbedElement>;
+    /**
+     * Sets or gets the foreground (text) color of the document.
+     */
+    /** @deprecated */
+    fgColor: string;
+    /**
+     * Retrieves a collection, in source order, of all form objects in the document.
+     */
+    readonly forms: HTMLCollectionOf<HTMLFormElement>;
+    /** @deprecated */
+    readonly fullscreen: boolean;
+    /**
+     * Returns true if document has the ability to display elements fullscreen and fullscreen is supported, or false otherwise.
+     */
+    readonly fullscreenEnabled: boolean;
+    /**
+     * Returns the head element.
+     */
+    readonly head: HTMLHeadElement;
+    readonly hidden: boolean;
+    /**
+     * Retrieves a collection, in source order, of img objects in the document.
+     */
+    readonly images: HTMLCollectionOf<HTMLImageElement>;
+    /**
+     * Gets the implementation object of the current document.
+     */
+    readonly implementation: DOMImplementation;
+    /**
+     * Returns the character encoding used to create the webpage that is loaded into the document object.
+     */
+    readonly inputEncoding: string;
+    /**
+     * Gets the date that the page was last modified, if the page supplies one.
+     */
+    readonly lastModified: string;
+    /**
+     * Sets or gets the color of the document links.
+     */
+    /** @deprecated */
+    linkColor: string;
+    /**
+     * Retrieves a collection of all a objects that specify the href property and all area objects in the document.
+     */
+    readonly links: HTMLCollectionOf<HTMLAnchorElement | HTMLAreaElement>;
+    /**
+     * Contains information about the current URL.
+     */
+    location: Location;
+    onfullscreenchange: ((this: Document, ev: Event) => any) | null;
+    onfullscreenerror: ((this: Document, ev: Event) => any) | null;
+    onpointerlockchange: ((this: Document, ev: Event) => any) | null;
+    onpointerlockerror: ((this: Document, ev: Event) => any) | null;
+    /**
+     * Fires when the state of the object has changed.
+     * @param ev The event
+     */
+    onreadystatechange: ((this: Document, ev: Event) => any) | null;
+    onvisibilitychange: ((this: Document, ev: Event) => any) | null;
+    /**
+     * Returns document's origin.
+     */
+    readonly origin: string;
+    /**
+     * Return an HTMLCollection of the embed elements in the Document.
+     */
+    readonly plugins: HTMLCollectionOf<HTMLEmbedElement>;
+    /**
+     * Retrieves a value that indicates the current state of the object.
+     */
+    readonly readyState: DocumentReadyState;
+    /**
+     * Gets the URL of the location that referred the user to the current page.
+     */
+    readonly referrer: string;
+    /**
+     * Retrieves a collection of all script objects in the document.
+     */
+    readonly scripts: HTMLCollectionOf<HTMLScriptElement>;
+    readonly scrollingElement: Element | null;
+    readonly timeline: DocumentTimeline;
+    /**
+     * Contains the title of the document.
+     */
+    title: string;
+    readonly visibilityState: VisibilityState;
+    /**
+     * Sets or gets the color of the links that the user has visited.
+     */
+    /** @deprecated */
+    vlinkColor: string;
+    /**
+     * Moves node from another document and returns it.
+     * 
+     * If node is a document, throws a "NotSupportedError" DOMException or, if node is a shadow root, throws a "HierarchyRequestError" DOMException.
+     */
+    adoptNode<T extends Node>(source: T): T;
+    /** @deprecated */
+    captureEvents(): void;
+    caretPositionFromPoint(x: number, y: number): CaretPosition | null;
+    /** @deprecated */
+    caretRangeFromPoint(x: number, y: number): Range;
+    /** @deprecated */
+    clear(): void;
+    /**
+     * Closes an output stream and forces the sent data to display.
+     */
+    close(): void;
+    /**
+     * Creates an attribute object with a specified name.
+     * @param name String that sets the attribute object's name.
+     */
+    createAttribute(localName: string): Attr;
+    createAttributeNS(namespace: string | null, qualifiedName: string): Attr;
+    /**
+     * Returns a CDATASection node whose data is data.
+     */
+    createCDATASection(data: string): CDATASection;
+    /**
+     * Creates a comment object with the specified data.
+     * @param data Sets the comment object's data.
+     */
+    createComment(data: string): Comment;
+    /**
+     * Creates a new document.
+     */
+    createDocumentFragment(): DocumentFragment;
+    /**
+     * Creates an instance of the element for the specified tag.
+     * @param tagName The name of an element.
+     */
+    createElement<K extends keyof HTMLElementTagNameMap>(tagName: K, options?: ElementCreationOptions): HTMLElementTagNameMap[K];
+    /** @deprecated */
+    createElement<K extends keyof HTMLElementDeprecatedTagNameMap>(tagName: K, options?: ElementCreationOptions): HTMLElementDeprecatedTagNameMap[K];
+    createElement(tagName: string, options?: ElementCreationOptions): HTMLElement;
+    /**
+     * Returns an element with namespace namespace. Its namespace prefix will be everything before ":" (U+003E) in qualifiedName or null. Its local name will be everything after ":" (U+003E) in qualifiedName or qualifiedName.
+     * 
+     * If localName does not match the Name production an "InvalidCharacterError" DOMException will be thrown.
+     * 
+     * If one of the following conditions is true a "NamespaceError" DOMException will be thrown:
+     * 
+     * localName does not match the QName production.
+     * Namespace prefix is not null and namespace is the empty string.
+     * Namespace prefix is "xml" and namespace is not the XML namespace.
+     * qualifiedName or namespace prefix is "xmlns" and namespace is not the XMLNS namespace.
+     * namespace is the XMLNS namespace and neither qualifiedName nor namespace prefix is "xmlns".
+     * 
+     * When supplied, options's is can be used to create a customized built-in element.
+     */
+    createElementNS(namespaceURI: "http://www.w3.org/1999/xhtml", qualifiedName: string): HTMLElement;
+    createElementNS<K extends keyof SVGElementTagNameMap>(namespaceURI: "http://www.w3.org/2000/svg", qualifiedName: K): SVGElementTagNameMap[K];
+    createElementNS(namespaceURI: "http://www.w3.org/2000/svg", qualifiedName: string): SVGElement;
+    createElementNS(namespaceURI: string | null, qualifiedName: string, options?: ElementCreationOptions): Element;
+    createElementNS(namespace: string | null, qualifiedName: string, options?: string | ElementCreationOptions): Element;
+    createEvent(eventInterface: "AnimationEvent"): AnimationEvent;
+    createEvent(eventInterface: "AnimationPlaybackEvent"): AnimationPlaybackEvent;
+    createEvent(eventInterface: "AudioProcessingEvent"): AudioProcessingEvent;
+    createEvent(eventInterface: "BeforeUnloadEvent"): BeforeUnloadEvent;
+    createEvent(eventInterface: "ClipboardEvent"): ClipboardEvent;
+    createEvent(eventInterface: "CloseEvent"): CloseEvent;
+    createEvent(eventInterface: "CompositionEvent"): CompositionEvent;
+    createEvent(eventInterface: "CustomEvent"): CustomEvent;
+    createEvent(eventInterface: "DeviceLightEvent"): DeviceLightEvent;
+    createEvent(eventInterface: "DeviceMotionEvent"): DeviceMotionEvent;
+    createEvent(eventInterface: "DeviceOrientationEvent"): DeviceOrientationEvent;
+    createEvent(eventInterface: "DragEvent"): DragEvent;
+    createEvent(eventInterface: "ErrorEvent"): ErrorEvent;
+    createEvent(eventInterface: "Event"): Event;
+    createEvent(eventInterface: "Events"): Event;
+    createEvent(eventInterface: "FocusEvent"): FocusEvent;
+    createEvent(eventInterface: "FocusNavigationEvent"): FocusNavigationEvent;
+    createEvent(eventInterface: "GamepadEvent"): GamepadEvent;
+    createEvent(eventInterface: "HashChangeEvent"): HashChangeEvent;
+    createEvent(eventInterface: "IDBVersionChangeEvent"): IDBVersionChangeEvent;
+    createEvent(eventInterface: "InputEvent"): InputEvent;
+    createEvent(eventInterface: "KeyboardEvent"): KeyboardEvent;
+    createEvent(eventInterface: "ListeningStateChangedEvent"): ListeningStateChangedEvent;
+    createEvent(eventInterface: "MSGestureEvent"): MSGestureEvent;
+    createEvent(eventInterface: "MSMediaKeyMessageEvent"): MSMediaKeyMessageEvent;
+    createEvent(eventInterface: "MSMediaKeyNeededEvent"): MSMediaKeyNeededEvent;
+    createEvent(eventInterface: "MSPointerEvent"): MSPointerEvent;
+    createEvent(eventInterface: "MediaEncryptedEvent"): MediaEncryptedEvent;
+    createEvent(eventInterface: "MediaKeyMessageEvent"): MediaKeyMessageEvent;
+    createEvent(eventInterface: "MediaQueryListEvent"): MediaQueryListEvent;
+    createEvent(eventInterface: "MediaStreamErrorEvent"): MediaStreamErrorEvent;
+    createEvent(eventInterface: "MediaStreamEvent"): MediaStreamEvent;
+    createEvent(eventInterface: "MediaStreamTrackEvent"): MediaStreamTrackEvent;
+    createEvent(eventInterface: "MessageEvent"): MessageEvent;
+    createEvent(eventInterface: "MouseEvent"): MouseEvent;
+    createEvent(eventInterface: "MouseEvents"): MouseEvent;
+    createEvent(eventInterface: "MutationEvent"): MutationEvent;
+    createEvent(eventInterface: "MutationEvents"): MutationEvent;
+    createEvent(eventInterface: "OfflineAudioCompletionEvent"): OfflineAudioCompletionEvent;
+    createEvent(eventInterface: "OverflowEvent"): OverflowEvent;
+    createEvent(eventInterface: "PageTransitionEvent"): PageTransitionEvent;
+    createEvent(eventInterface: "PaymentRequestUpdateEvent"): PaymentRequestUpdateEvent;
+    createEvent(eventInterface: "PermissionRequestedEvent"): PermissionRequestedEvent;
+    createEvent(eventInterface: "PointerEvent"): PointerEvent;
+    createEvent(eventInterface: "PopStateEvent"): PopStateEvent;
+    createEvent(eventInterface: "ProgressEvent"): ProgressEvent;
+    createEvent(eventInterface: "PromiseRejectionEvent"): PromiseRejectionEvent;
+    createEvent(eventInterface: "RTCDTMFToneChangeEvent"): RTCDTMFToneChangeEvent;
+    createEvent(eventInterface: "RTCDataChannelEvent"): RTCDataChannelEvent;
+    createEvent(eventInterface: "RTCDtlsTransportStateChangedEvent"): RTCDtlsTransportStateChangedEvent;
+    createEvent(eventInterface: "RTCErrorEvent"): RTCErrorEvent;
+    createEvent(eventInterface: "RTCIceCandidatePairChangedEvent"): RTCIceCandidatePairChangedEvent;
+    createEvent(eventInterface: "RTCIceGathererEvent"): RTCIceGathererEvent;
+    createEvent(eventInterface: "RTCIceTransportStateChangedEvent"): RTCIceTransportStateChangedEvent;
+    createEvent(eventInterface: "RTCPeerConnectionIceErrorEvent"): RTCPeerConnectionIceErrorEvent;
+    createEvent(eventInterface: "RTCPeerConnectionIceEvent"): RTCPeerConnectionIceEvent;
+    createEvent(eventInterface: "RTCSsrcConflictEvent"): RTCSsrcConflictEvent;
+    createEvent(eventInterface: "RTCStatsEvent"): RTCStatsEvent;
+    createEvent(eventInterface: "RTCTrackEvent"): RTCTrackEvent;
+    createEvent(eventInterface: "SVGZoomEvent"): SVGZoomEvent;
+    createEvent(eventInterface: "SVGZoomEvents"): SVGZoomEvent;
+    createEvent(eventInterface: "SecurityPolicyViolationEvent"): SecurityPolicyViolationEvent;
+    createEvent(eventInterface: "ServiceWorkerMessageEvent"): ServiceWorkerMessageEvent;
+    createEvent(eventInterface: "SpeechRecognitionEvent"): SpeechRecognitionEvent;
+    createEvent(eventInterface: "SpeechSynthesisErrorEvent"): SpeechSynthesisErrorEvent;
+    createEvent(eventInterface: "SpeechSynthesisEvent"): SpeechSynthesisEvent;
+    createEvent(eventInterface: "StorageEvent"): StorageEvent;
+    createEvent(eventInterface: "TextEvent"): TextEvent;
+    createEvent(eventInterface: "TouchEvent"): TouchEvent;
+    createEvent(eventInterface: "TrackEvent"): TrackEvent;
+    createEvent(eventInterface: "TransitionEvent"): TransitionEvent;
+    createEvent(eventInterface: "UIEvent"): UIEvent;
+    createEvent(eventInterface: "UIEvents"): UIEvent;
+    createEvent(eventInterface: "VRDisplayEvent"): VRDisplayEvent;
+    createEvent(eventInterface: "VRDisplayEvent "): VRDisplayEvent ;
+    createEvent(eventInterface: "WebGLContextEvent"): WebGLContextEvent;
+    createEvent(eventInterface: "WheelEvent"): WheelEvent;
+    createEvent(eventInterface: string): Event;
+    /**
+     * Creates a NodeIterator object that you can use to traverse filtered lists of nodes or elements in a document.
+     * @param root The root element or node to start traversing on.
+     * @param whatToShow The type of nodes or elements to appear in the node list
+     * @param filter A custom NodeFilter function to use. For more information, see filter. Use null for no filter.
+     * @param entityReferenceExpansion A flag that specifies whether entity reference nodes are expanded.
+     */
+    createNodeIterator(root: Node, whatToShow?: number, filter?: NodeFilter | null): NodeIterator;
+    /**
+     * Returns a ProcessingInstruction node whose target is target and data is data. If target does not match the Name production an "InvalidCharacterError" DOMException will be thrown. If data contains "?>" an "InvalidCharacterError" DOMException will be thrown.
+     */
+    createProcessingInstruction(target: string, data: string): ProcessingInstruction;
+    /**
+     *  Returns an empty range object that has both of its boundary points positioned at the beginning of the document.
+     */
+    createRange(): Range;
+    /**
+     * Creates a text string from the specified value.
+     * @param data String that specifies the nodeValue property of the text node.
+     */
+    createTextNode(data: string): Text;
+    /**
+     * Creates a TreeWalker object that you can use to traverse filtered lists of nodes or elements in a document.
+     * @param root The root element or node to start traversing on.
+     * @param whatToShow The type of nodes or elements to appear in the node list. For more information, see whatToShow.
+     * @param filter A custom NodeFilter function to use.
+     * @param entityReferenceExpansion A flag that specifies whether entity reference nodes are expanded.
+     */
+    createTreeWalker(root: Node, whatToShow?: number, filter?: NodeFilter | null): TreeWalker;
+    /** @deprecated */
+    createTreeWalker(root: Node, whatToShow: number, filter: NodeFilter | null, entityReferenceExpansion?: boolean): TreeWalker;
+    /**
+     * Returns the element for the specified x coordinate and the specified y coordinate.
+     * @param x The x-offset
+     * @param y The y-offset
+     */
+    elementFromPoint(x: number, y: number): Element | null;
+    elementsFromPoint(x: number, y: number): Element[];
+    /**
+     * Executes a command on the current document, current selection, or the given range.
+     * @param commandId String that specifies the command to execute. This command can be any of the command identifiers that can be executed in script.
+     * @param showUI Display the user interface, defaults to false.
+     * @param value Value to assign.
+     */
+    execCommand(commandId: string, showUI?: boolean, value?: string): boolean;
+    /**
+     * Stops document's fullscreen element from being displayed fullscreen and resolves promise when done.
+     */
+    exitFullscreen(): Promise<void>;
+    exitPointerLock(): void;
+    getAnimations(): Animation[];
+    /**
+     * Returns a reference to the first object with the specified value of the ID or NAME attribute.
+     * @param elementId String that specifies the ID value. Case-insensitive.
+     */
+    getElementById(elementId: string): HTMLElement | null;
+    /**
+     * Returns a HTMLCollection of the elements in the object on which the method was invoked (a document or an element) that have all the classes given by classNames. The classNames argument is interpreted as a space-separated list of classes.
+     */
+    getElementsByClassName(classNames: string): HTMLCollectionOf<Element>;
+    /**
+     * Gets a collection of objects based on the value of the NAME or ID attribute.
+     * @param elementName Gets a collection of objects based on the value of the NAME or ID attribute.
+     */
+    getElementsByName(elementName: string): NodeListOf<HTMLElement>;
+    /**
+     * Retrieves a collection of objects based on the specified element name.
+     * @param name Specifies the name of an element.
+     */
+    getElementsByTagName<K extends keyof HTMLElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<HTMLElementTagNameMap[K]>;
+    getElementsByTagName<K extends keyof SVGElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<SVGElementTagNameMap[K]>;
+    getElementsByTagName(qualifiedName: string): HTMLCollectionOf<Element>;
+    /**
+     * If namespace and localName are "*" returns a HTMLCollection of all descendant elements.
+     * 
+     * If only namespace is "*" returns a HTMLCollection of all descendant elements whose local name is localName.
+     * 
+     * If only localName is "*" returns a HTMLCollection of all descendant elements whose namespace is namespace.
+     * 
+     * Otherwise, returns a HTMLCollection of all descendant elements whose namespace is namespace and local name is localName.
+     */
+    getElementsByTagNameNS(namespaceURI: "http://www.w3.org/1999/xhtml", localName: string): HTMLCollectionOf<HTMLElement>;
+    getElementsByTagNameNS(namespaceURI: "http://www.w3.org/2000/svg", localName: string): HTMLCollectionOf<SVGElement>;
+    getElementsByTagNameNS(namespaceURI: string, localName: string): HTMLCollectionOf<Element>;
+    /**
+     * Returns an object representing the current selection of the document that is loaded into the object displaying a webpage.
+     */
+    getSelection(): Selection | null;
+    /**
+     * Gets a value indicating whether the object currently has focus.
+     */
+    hasFocus(): boolean;
+    /**
+     * Returns a copy of node. If deep is true, the copy also includes the node's descendants.
+     * 
+     * If node is a document or a shadow root, throws a "NotSupportedError" DOMException.
+     */
+    importNode<T extends Node>(importedNode: T, deep: boolean): T;
+    /**
+     * Opens a new window and loads a document specified by a given URL. Also, opens a new window that uses the url parameter and the name parameter to collect the output of the write method and the writeln method.
+     * @param url Specifies a MIME type for the document.
+     * @param name Specifies the name of the window. This name is used as the value for the TARGET attribute on a form or an anchor element.
+     * @param features Contains a list of items separated by commas. Each item consists of an option and a value, separated by an equals sign (for example, "fullscreen=yes, toolbar=yes"). The following values are supported.
+     * @param replace Specifies whether the existing entry for the document is replaced in the history list.
+     */
+    open(url?: string, name?: string, features?: string, replace?: boolean): Document;
+    /**
+     * Returns a Boolean value that indicates whether a specified command can be successfully executed using execCommand, given the current state of the document.
+     * @param commandId Specifies a command identifier.
+     */
+    queryCommandEnabled(commandId: string): boolean;
+    /**
+     * Returns a Boolean value that indicates whether the specified command is in the indeterminate state.
+     * @param commandId String that specifies a command identifier.
+     */
+    queryCommandIndeterm(commandId: string): boolean;
+    /**
+     * Returns a Boolean value that indicates the current state of the command.
+     * @param commandId String that specifies a command identifier.
+     */
+    queryCommandState(commandId: string): boolean;
+    /**
+     * Returns a Boolean value that indicates whether the current command is supported on the current range.
+     * @param commandId Specifies a command identifier.
+     */
+    queryCommandSupported(commandId: string): boolean;
+    /**
+     * Returns the current value of the document, range, or current selection for the given command.
+     * @param commandId String that specifies a command identifier.
+     */
+    queryCommandValue(commandId: string): string;
+    /** @deprecated */
+    releaseEvents(): void;
+    /**
+     * Writes one or more HTML expressions to a document in the specified window.
+     * @param content Specifies the text and HTML tags to write.
+     */
+    write(...text: string[]): void;
+    /**
+     * Writes one or more HTML expressions, followed by a carriage return, to a document in the specified window.
+     * @param content The text and HTML tags to write.
+     */
+    writeln(...text: string[]): void;
+    addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface DocumentAndElementEventHandlersEventMap {
+    "copy": ClipboardEvent;
+    "cut": ClipboardEvent;
+    "paste": ClipboardEvent;
+}
+
+export interface DocumentAndElementEventHandlers {
+    oncopy: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
+    oncut: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
+    onpaste: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
+    addEventListener<K extends keyof DocumentAndElementEventHandlersEventMap>(type: K, listener: (this: DocumentAndElementEventHandlers, ev: DocumentAndElementEventHandlersEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof DocumentAndElementEventHandlersEventMap>(type: K, listener: (this: DocumentAndElementEventHandlers, ev: DocumentAndElementEventHandlersEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+export interface DocumentEvent {
+    createEvent(eventInterface: "AnimationEvent"): AnimationEvent;
+    createEvent(eventInterface: "AnimationPlaybackEvent"): AnimationPlaybackEvent;
+    createEvent(eventInterface: "AudioProcessingEvent"): AudioProcessingEvent;
+    createEvent(eventInterface: "BeforeUnloadEvent"): BeforeUnloadEvent;
+    createEvent(eventInterface: "ClipboardEvent"): ClipboardEvent;
+    createEvent(eventInterface: "CloseEvent"): CloseEvent;
+    createEvent(eventInterface: "CompositionEvent"): CompositionEvent;
+    createEvent(eventInterface: "CustomEvent"): CustomEvent;
+    createEvent(eventInterface: "DeviceLightEvent"): DeviceLightEvent;
+    createEvent(eventInterface: "DeviceMotionEvent"): DeviceMotionEvent;
+    createEvent(eventInterface: "DeviceOrientationEvent"): DeviceOrientationEvent;
+    createEvent(eventInterface: "DragEvent"): DragEvent;
+    createEvent(eventInterface: "ErrorEvent"): ErrorEvent;
+    createEvent(eventInterface: "Event"): Event;
+    createEvent(eventInterface: "Events"): Event;
+    createEvent(eventInterface: "FocusEvent"): FocusEvent;
+    createEvent(eventInterface: "FocusNavigationEvent"): FocusNavigationEvent;
+    createEvent(eventInterface: "GamepadEvent"): GamepadEvent;
+    createEvent(eventInterface: "HashChangeEvent"): HashChangeEvent;
+    createEvent(eventInterface: "IDBVersionChangeEvent"): IDBVersionChangeEvent;
+    createEvent(eventInterface: "InputEvent"): InputEvent;
+    createEvent(eventInterface: "KeyboardEvent"): KeyboardEvent;
+    createEvent(eventInterface: "ListeningStateChangedEvent"): ListeningStateChangedEvent;
+    createEvent(eventInterface: "MSGestureEvent"): MSGestureEvent;
+    createEvent(eventInterface: "MSMediaKeyMessageEvent"): MSMediaKeyMessageEvent;
+    createEvent(eventInterface: "MSMediaKeyNeededEvent"): MSMediaKeyNeededEvent;
+    createEvent(eventInterface: "MSPointerEvent"): MSPointerEvent;
+    createEvent(eventInterface: "MediaEncryptedEvent"): MediaEncryptedEvent;
+    createEvent(eventInterface: "MediaKeyMessageEvent"): MediaKeyMessageEvent;
+    createEvent(eventInterface: "MediaQueryListEvent"): MediaQueryListEvent;
+    createEvent(eventInterface: "MediaStreamErrorEvent"): MediaStreamErrorEvent;
+    createEvent(eventInterface: "MediaStreamEvent"): MediaStreamEvent;
+    createEvent(eventInterface: "MediaStreamTrackEvent"): MediaStreamTrackEvent;
+    createEvent(eventInterface: "MessageEvent"): MessageEvent;
+    createEvent(eventInterface: "MouseEvent"): MouseEvent;
+    createEvent(eventInterface: "MouseEvents"): MouseEvent;
+    createEvent(eventInterface: "MutationEvent"): MutationEvent;
+    createEvent(eventInterface: "MutationEvents"): MutationEvent;
+    createEvent(eventInterface: "OfflineAudioCompletionEvent"): OfflineAudioCompletionEvent;
+    createEvent(eventInterface: "OverflowEvent"): OverflowEvent;
+    createEvent(eventInterface: "PageTransitionEvent"): PageTransitionEvent;
+    createEvent(eventInterface: "PaymentRequestUpdateEvent"): PaymentRequestUpdateEvent;
+    createEvent(eventInterface: "PermissionRequestedEvent"): PermissionRequestedEvent;
+    createEvent(eventInterface: "PointerEvent"): PointerEvent;
+    createEvent(eventInterface: "PopStateEvent"): PopStateEvent;
+    createEvent(eventInterface: "ProgressEvent"): ProgressEvent;
+    createEvent(eventInterface: "PromiseRejectionEvent"): PromiseRejectionEvent;
+    createEvent(eventInterface: "RTCDTMFToneChangeEvent"): RTCDTMFToneChangeEvent;
+    createEvent(eventInterface: "RTCDataChannelEvent"): RTCDataChannelEvent;
+    createEvent(eventInterface: "RTCDtlsTransportStateChangedEvent"): RTCDtlsTransportStateChangedEvent;
+    createEvent(eventInterface: "RTCErrorEvent"): RTCErrorEvent;
+    createEvent(eventInterface: "RTCIceCandidatePairChangedEvent"): RTCIceCandidatePairChangedEvent;
+    createEvent(eventInterface: "RTCIceGathererEvent"): RTCIceGathererEvent;
+    createEvent(eventInterface: "RTCIceTransportStateChangedEvent"): RTCIceTransportStateChangedEvent;
+    createEvent(eventInterface: "RTCPeerConnectionIceErrorEvent"): RTCPeerConnectionIceErrorEvent;
+    createEvent(eventInterface: "RTCPeerConnectionIceEvent"): RTCPeerConnectionIceEvent;
+    createEvent(eventInterface: "RTCSsrcConflictEvent"): RTCSsrcConflictEvent;
+    createEvent(eventInterface: "RTCStatsEvent"): RTCStatsEvent;
+    createEvent(eventInterface: "RTCTrackEvent"): RTCTrackEvent;
+    createEvent(eventInterface: "SVGZoomEvent"): SVGZoomEvent;
+    createEvent(eventInterface: "SVGZoomEvents"): SVGZoomEvent;
+    createEvent(eventInterface: "SecurityPolicyViolationEvent"): SecurityPolicyViolationEvent;
+    createEvent(eventInterface: "ServiceWorkerMessageEvent"): ServiceWorkerMessageEvent;
+    createEvent(eventInterface: "SpeechRecognitionEvent"): SpeechRecognitionEvent;
+    createEvent(eventInterface: "SpeechSynthesisErrorEvent"): SpeechSynthesisErrorEvent;
+    createEvent(eventInterface: "SpeechSynthesisEvent"): SpeechSynthesisEvent;
+    createEvent(eventInterface: "StorageEvent"): StorageEvent;
+    createEvent(eventInterface: "TextEvent"): TextEvent;
+    createEvent(eventInterface: "TouchEvent"): TouchEvent;
+    createEvent(eventInterface: "TrackEvent"): TrackEvent;
+    createEvent(eventInterface: "TransitionEvent"): TransitionEvent;
+    createEvent(eventInterface: "UIEvent"): UIEvent;
+    createEvent(eventInterface: "UIEvents"): UIEvent;
+    createEvent(eventInterface: "VRDisplayEvent"): VRDisplayEvent;
+    createEvent(eventInterface: "VRDisplayEvent "): VRDisplayEvent ;
+    createEvent(eventInterface: "WebGLContextEvent"): WebGLContextEvent;
+    createEvent(eventInterface: "WheelEvent"): WheelEvent;
+    createEvent(eventInterface: string): Event;
+}
+
+/** A minimal document object that has no parent. It is used as a lightweight version of Document that stores a segment of a document structure comprised of nodes just like a standard document. The key difference is that because the document fragment isn't part of the active document tree structure, changes made to the fragment don't affect the document, cause reflow, or incur any performance impact that can occur when changes are made. */
+export interface DocumentFragment extends Node, NonElementParentNode, ParentNode {
+    getElementById(elementId: string): HTMLElement | null;
+}
+
+
+export interface DocumentOrShadowRoot {
+    readonly activeElement: Element | null;
+    /**
+     * Returns document's fullscreen element.
+     */
+    readonly fullscreenElement: Element | null;
+    readonly pointerLockElement: Element | null;
+    /**
+     * Retrieves a collection of styleSheet objects representing the style sheets that correspond to each instance of a link or style object in the document.
+     */
+    readonly styleSheets: StyleSheetList;
+    caretPositionFromPoint(x: number, y: number): CaretPosition | null;
+    /** @deprecated */
+    caretRangeFromPoint(x: number, y: number): Range;
+    elementFromPoint(x: number, y: number): Element | null;
+    elementsFromPoint(x: number, y: number): Element[];
+    getSelection(): Selection | null;
+}
+
+export interface DocumentTimeline extends AnimationTimeline {
+}
+
+
+/** A Node containing a doctype. */
+export interface DocumentType extends Node, ChildNode {
+    readonly name: string;
+    readonly publicId: string;
+    readonly systemId: string;
+}
+
+
+/** A DOM event that represents a drag and drop interaction. The user initiates a drag by placing a pointer device (such as a mouse) on the touch surface and then dragging the pointer to a new location (such as another DOM element). Applications are free to interpret a drag and drop interaction in an application-specific way. */
+export interface DragEvent extends MouseEvent {
+    /**
+     * Returns the DataTransfer object for the event.
+     */
+    readonly dataTransfer: DataTransfer | null;
+}
+
+
+/** Inherits properties from its parent, AudioNode. */
+export interface DynamicsCompressorNode extends AudioNode {
+    readonly attack: AudioParam;
+    readonly knee: AudioParam;
+    readonly ratio: AudioParam;
+    readonly reduction: number;
+    readonly release: AudioParam;
+    readonly threshold: AudioParam;
+}
+
+
+export interface EXT_blend_minmax {
+    readonly MAX_EXT: GLenum;
+    readonly MIN_EXT: GLenum;
+}
+
+/** The EXT_frag_depth extension is part of the WebGL API and enables to set a depth value of a fragment from within the fragment shader. */
+export interface EXT_frag_depth {
+}
+
+export interface EXT_sRGB {
+    readonly FRAMEBUFFER_ATTACHMENT_COLOR_ENCODING_EXT: GLenum;
+    readonly SRGB8_ALPHA8_EXT: GLenum;
+    readonly SRGB_ALPHA_EXT: GLenum;
+    readonly SRGB_EXT: GLenum;
+}
+
+export interface EXT_shader_texture_lod {
+}
+
+/** The EXT_texture_filter_anisotropic extension is part of the WebGL API and exposes two constants for anisotropic filtering (AF). */
+export interface EXT_texture_filter_anisotropic {
+    readonly MAX_TEXTURE_MAX_ANISOTROPY_EXT: GLenum;
+    readonly TEXTURE_MAX_ANISOTROPY_EXT: GLenum;
+}
+
+export interface ElementEventMap {
+    "fullscreenchange": Event;
+    "fullscreenerror": Event;
+}
+
+/** Element is the most general base class from which all objects in a Document inherit. It only has methods and properties common to all kinds of elements. More specific classes inherit from Element. */
+export interface Element extends Node, Animatable, ChildNode, InnerHTML, NonDocumentTypeChildNode, ParentNode, Slotable {
+    readonly assignedSlot: HTMLSlotElement | null;
+    readonly attributes: NamedNodeMap;
+    /**
+     * Allows for manipulation of element's class content attribute as a set of whitespace-separated tokens through a DOMTokenList object.
+     */
+    readonly classList: DOMTokenList;
+    /**
+     * Returns the value of element's class content attribute. Can be set to change it.
+     */
+    className: string;
+    readonly clientHeight: number;
+    readonly clientLeft: number;
+    readonly clientTop: number;
+    readonly clientWidth: number;
+    /**
+     * Returns the value of element's id content attribute. Can be set to change it.
+     */
+    id: string;
+    /**
+     * Returns the local name.
+     */
+    readonly localName: string;
+    /**
+     * Returns the namespace.
+     */
+    readonly namespaceURI: string | null;
+    onfullscreenchange: ((this: Element, ev: Event) => any) | null;
+    onfullscreenerror: ((this: Element, ev: Event) => any) | null;
+    outerHTML: string;
+    /**
+     * Returns the namespace prefix.
+     */
+    readonly prefix: string | null;
+    readonly scrollHeight: number;
+    scrollLeft: number;
+    scrollTop: number;
+    readonly scrollWidth: number;
+    /**
+     * Returns element's shadow root, if any, and if shadow root's mode is "open", and null otherwise.
+     */
+    readonly shadowRoot: ShadowRoot | null;
+    /**
+     * Returns the value of element's slot content attribute. Can be set to change it.
+     */
+    slot: string;
+    /**
+     * Returns the HTML-uppercased qualified name.
+     */
+    readonly tagName: string;
+    /**
+     * Creates a shadow root for element and returns it.
+     */
+    attachShadow(init: ShadowRootInit): ShadowRoot;
+    /**
+     * Returns the first (starting at element) inclusive ancestor that matches selectors, and null otherwise.
+     */
+    closest<K extends keyof HTMLElementTagNameMap>(selector: K): HTMLElementTagNameMap[K] | null;
+    closest<K extends keyof SVGElementTagNameMap>(selector: K): SVGElementTagNameMap[K] | null;
+    closest<E extends Element = Element>(selector: string): E | null;
+    /**
+     * Returns element's first attribute whose qualified name is qualifiedName, and null if there is no such attribute otherwise.
+     */
+    getAttribute(qualifiedName: string): string | null;
+    /**
+     * Returns element's attribute whose namespace is namespace and local name is localName, and null if there is no such attribute otherwise.
+     */
+    getAttributeNS(namespace: string | null, localName: string): string | null;
+    /**
+     * Returns the qualified names of all element's attributes. Can contain duplicates.
+     */
+    getAttributeNames(): string[];
+    getAttributeNode(name: string): Attr | null;
+    getAttributeNodeNS(namespaceURI: string, localName: string): Attr | null;
+    getBoundingClientRect(): DOMRect;
+    getClientRects(): DOMRectList;
+    /**
+     * Returns a HTMLCollection of the elements in the object on which the method was invoked (a document or an element) that have all the classes given by classNames. The classNames argument is interpreted as a space-separated list of classes.
+     */
+    getElementsByClassName(classNames: string): HTMLCollectionOf<Element>;
+    getElementsByTagName<K extends keyof HTMLElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<HTMLElementTagNameMap[K]>;
+    getElementsByTagName<K extends keyof SVGElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<SVGElementTagNameMap[K]>;
+    getElementsByTagName(qualifiedName: string): HTMLCollectionOf<Element>;
+    getElementsByTagNameNS(namespaceURI: "http://www.w3.org/1999/xhtml", localName: string): HTMLCollectionOf<HTMLElement>;
+    getElementsByTagNameNS(namespaceURI: "http://www.w3.org/2000/svg", localName: string): HTMLCollectionOf<SVGElement>;
+    getElementsByTagNameNS(namespaceURI: string, localName: string): HTMLCollectionOf<Element>;
+    /**
+     * Returns true if element has an attribute whose qualified name is qualifiedName, and false otherwise.
+     */
+    hasAttribute(qualifiedName: string): boolean;
+    /**
+     * Returns true if element has an attribute whose namespace is namespace and local name is localName.
+     */
+    hasAttributeNS(namespace: string | null, localName: string): boolean;
+    /**
+     * Returns true if element has attributes, and false otherwise.
+     */
+    hasAttributes(): boolean;
+    hasPointerCapture(pointerId: number): boolean;
+    insertAdjacentElement(position: InsertPosition, insertedElement: Element): Element | null;
+    insertAdjacentHTML(where: InsertPosition, html: string): void;
+    insertAdjacentText(where: InsertPosition, text: string): void;
+    /**
+     * Returns true if matching selectors against element's root yields element, and false otherwise.
+     */
+    matches(selectors: string): boolean;
+    msGetRegionContent(): any;
+    releasePointerCapture(pointerId: number): void;
+    /**
+     * Removes element's first attribute whose qualified name is qualifiedName.
+     */
+    removeAttribute(qualifiedName: string): void;
+    /**
+     * Removes element's attribute whose namespace is namespace and local name is localName.
+     */
+    removeAttributeNS(namespace: string | null, localName: string): void;
+    removeAttributeNode(attr: Attr): Attr;
+    /**
+     * Displays element fullscreen and resolves promise when done.
+     * 
+     * When supplied, options's navigationUI member indicates whether showing navigation UI while in fullscreen is preferred or not. If set to "show", navigation simplicity is preferred over screen space, and if set to "hide", more screen space is preferred. User agents are always free to honor user preference over the application's. The default value "auto" indicates no application preference.
+     */
+    requestFullscreen(options?: FullscreenOptions): Promise<void>;
+    requestPointerLock(): void;
+    scroll(options?: ScrollToOptions): void;
+    scroll(x: number, y: number): void;
+    scrollBy(options?: ScrollToOptions): void;
+    scrollBy(x: number, y: number): void;
+    scrollIntoView(arg?: boolean | ScrollIntoViewOptions): void;
+    scrollTo(options?: ScrollToOptions): void;
+    scrollTo(x: number, y: number): void;
+    /**
+     * Sets the value of element's first attribute whose qualified name is qualifiedName to value.
+     */
+    setAttribute(qualifiedName: string, value: string): void;
+    /**
+     * Sets the value of element's attribute whose namespace is namespace and local name is localName to value.
+     */
+    setAttributeNS(namespace: string | null, qualifiedName: string, value: string): void;
+    setAttributeNode(attr: Attr): Attr | null;
+    setAttributeNodeNS(attr: Attr): Attr | null;
+    setPointerCapture(pointerId: number): void;
+    /**
+     * If force is not given, "toggles" qualifiedName, removing it if it is present and adding it if it is not present. If force is true, adds qualifiedName. If force is false, removes qualifiedName.
+     * 
+     * Returns true if qualifiedName is now present, and false otherwise.
+     */
+    toggleAttribute(qualifiedName: string, force?: boolean): boolean;
+    webkitMatchesSelector(selectors: string): boolean;
+    addEventListener<K extends keyof ElementEventMap>(type: K, listener: (this: Element, ev: ElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof ElementEventMap>(type: K, listener: (this: Element, ev: ElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface ElementCSSInlineStyle {
+    readonly style: CSSStyleDeclaration;
+}
+
+export interface ElementContentEditable {
+    contentEditable: string;
+    inputMode: string;
+    readonly isContentEditable: boolean;
+}
+
+/** Events providing information related to errors in scripts or in files. */
+export interface ErrorEvent extends Event {
+    readonly colno: number;
+    readonly error: any;
+    readonly filename: string;
+    readonly lineno: number;
+    readonly message: string;
+}
+
+
+/** An event which takes place in the DOM. */
+export interface Event {
+    /**
+     * Returns true or false depending on how event was initialized. True if event goes through its target's ancestors in reverse tree order, and false otherwise.
+     */
+    readonly bubbles: boolean;
+    cancelBubble: boolean;
+    /**
+     * Returns true or false depending on how event was initialized. Its return value does not always carry meaning, but true can indicate that part of the operation during which event was dispatched, can be canceled by invoking the preventDefault() method.
+     */
+    readonly cancelable: boolean;
+    /**
+     * Returns true or false depending on how event was initialized. True if event invokes listeners past a ShadowRoot node that is the root of its target, and false otherwise.
+     */
+    readonly composed: boolean;
+    /**
+     * Returns the object whose event listener's callback is currently being invoked.
+     */
+    readonly currentTarget: EventTarget | null;
+    /**
+     * Returns true if preventDefault() was invoked successfully to indicate cancelation, and false otherwise.
+     */
+    readonly defaultPrevented: boolean;
+    /**
+     * Returns the event's phase, which is one of NONE, CAPTURING_PHASE, AT_TARGET, and BUBBLING_PHASE.
+     */
+    readonly eventPhase: number;
+    /**
+     * Returns true if event was dispatched by the user agent, and false otherwise.
+     */
+    readonly isTrusted: boolean;
+    returnValue: boolean;
+    /** @deprecated */
+    readonly srcElement: EventTarget | null;
+    /**
+     * Returns the object to which event is dispatched (its target).
+     */
+    readonly target: EventTarget | null;
+    /**
+     * Returns the event's timestamp as the number of milliseconds measured relative to the time origin.
+     */
+    readonly timeStamp: number;
+    /**
+     * Returns the type of event, e.g. "click", "hashchange", or "submit".
+     */
+    readonly type: string;
+    /**
+     * Returns the invocation target objects of event's path (objects on which listeners will be invoked), except for any nodes in shadow trees of which the shadow root's mode is "closed" that are not reachable from event's currentTarget.
+     */
+    composedPath(): EventTarget[];
+    initEvent(type: string, bubbles?: boolean, cancelable?: boolean): void;
+    /**
+     * If invoked when the cancelable attribute value is true, and while executing a listener for the event with passive set to false, signals to the operation that caused event to be dispatched that it needs to be canceled.
+     */
+    preventDefault(): void;
+    /**
+     * Invoking this method prevents event from reaching any registered event listeners after the current one finishes running and, when dispatched in a tree, also prevents event from reaching any other objects.
+     */
+    stopImmediatePropagation(): void;
+    /**
+     * When dispatched in a tree, invoking this method prevents event from reaching any objects other than the current object.
+     */
+    stopPropagation(): void;
+    readonly AT_TARGET: number;
+    readonly BUBBLING_PHASE: number;
+    readonly CAPTURING_PHASE: number;
+    readonly NONE: number;
+}
+
+
+export interface EventListenerObject {
+    handleEvent(evt: Event): void;
+}
+
+export interface EventSourceEventMap {
+    "error": Event;
+    "message": MessageEvent;
+    "open": Event;
+}
+
+export interface EventSource extends EventTarget {
+    onerror: ((this: EventSource, ev: Event) => any) | null;
+    onmessage: ((this: EventSource, ev: MessageEvent) => any) | null;
+    onopen: ((this: EventSource, ev: Event) => any) | null;
+    /**
+     * Returns the state of this EventSource object's connection. It can have the values described below.
+     */
+    readonly readyState: number;
+    /**
+     * Returns the URL providing the event stream.
+     */
+    readonly url: string;
+    /**
+     * Returns true if the credentials mode for connection requests to the URL providing the event stream is set to "include", and false otherwise.
+     */
+    readonly withCredentials: boolean;
+    /**
+     * Aborts any instances of the fetch algorithm started for this EventSource object, and sets the readyState attribute to CLOSED.
+     */
+    close(): void;
+    readonly CLOSED: number;
+    readonly CONNECTING: number;
+    readonly OPEN: number;
+    addEventListener<K extends keyof EventSourceEventMap>(type: K, listener: (this: EventSource, ev: EventSourceEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof EventSourceEventMap>(type: K, listener: (this: EventSource, ev: EventSourceEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** EventTarget is a DOM interface implemented by objects that can receive events and may have listeners for them. */
+export interface EventTarget {
+    /**
+     * Appends an event listener for events whose type attribute value is type. The callback argument sets the callback that will be invoked when the event is dispatched.
+     * 
+     * The options argument sets listener-specific options. For compatibility this can be a boolean, in which case the method behaves exactly as if the value was specified as options's capture.
+     * 
+     * When set to true, options's capture prevents callback from being invoked when the event's eventPhase attribute value is BUBBLING_PHASE. When false (or not present), callback will not be invoked when event's eventPhase attribute value is CAPTURING_PHASE. Either way, callback will be invoked if event's eventPhase attribute value is AT_TARGET.
+     * 
+     * When set to true, options's passive indicates that the callback will not cancel the event by invoking preventDefault(). This is used to enable performance optimizations described in § 2.8 Observing event listeners.
+     * 
+     * When set to true, options's once indicates that the callback will only be invoked once after which the event listener will be removed.
+     * 
+     * The event listener is appended to target's event listener list and is not appended if it has the same type, callback, and capture.
+     */
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject | null, options?: boolean | AddEventListenerOptions): void;
+    /**
+     * Dispatches a synthetic event event to target and returns true if either event's cancelable attribute value is false or its preventDefault() method was not invoked, and false otherwise.
+     */
+    dispatchEvent(event: Event): boolean;
+    /**
+     * Removes the event listener in target's event listener list with the same type, callback, and options.
+     */
+    removeEventListener(type: string, callback: EventListenerOrEventListenerObject | null, options?: EventListenerOptions | boolean): void;
+}
+
+
+export interface ExtensionScriptApis {
+    extensionIdToShortId(extensionId: string): number;
+    fireExtensionApiTelemetry(functionName: string, isSucceeded: boolean, isSupported: boolean, errorString: string): void;
+    genericFunction(routerAddress: any, parameters?: string, callbackId?: number): void;
+    genericSynchronousFunction(functionId: number, parameters?: string): string;
+    genericWebRuntimeCallout(to: any, from: any, payload: string): void;
+    getExtensionId(): string;
+    registerGenericFunctionCallbackHandler(callbackHandler: Function): void;
+    registerGenericPersistentCallbackHandler(callbackHandler: Function): void;
+    registerWebRuntimeCallbackHandler(handler: Function): any;
+}
+
+
+export interface External {
+    /** @deprecated */
+    AddSearchProvider(): void;
+    /** @deprecated */
+    IsSearchProviderInstalled(): void;
+}
+
+
+/** Provides information about files and allows JavaScript in a web page to access their content. */
+export interface File extends Blob {
+    readonly lastModified: number;
+    readonly name: string;
+}
+
+
+/** An object of this type is returned by the files property of the HTML <input> element; this lets you access the list of files selected with the <input type="file"> element. It's also used for a list of files dropped into web content when using the drag and drop API; see the DataTransfer object for details on this usage. */
+export interface FileList {
+    readonly length: number;
+    item(index: number): File | null;
+    [index: number]: File;
+}
+
+
+export interface FileReaderEventMap {
+    "abort": ProgressEvent<FileReader>;
+    "error": ProgressEvent<FileReader>;
+    "load": ProgressEvent<FileReader>;
+    "loadend": ProgressEvent<FileReader>;
+    "loadstart": ProgressEvent<FileReader>;
+    "progress": ProgressEvent<FileReader>;
+}
+
+/** Lets web applications asynchronously read the contents of files (or raw data buffers) stored on the user's computer, using File or Blob objects to specify the file or data to read. */
+export interface FileReader extends EventTarget {
+    readonly error: DOMException | null;
+    onabort: ((this: FileReader, ev: ProgressEvent<FileReader>) => any) | null;
+    onerror: ((this: FileReader, ev: ProgressEvent<FileReader>) => any) | null;
+    onload: ((this: FileReader, ev: ProgressEvent<FileReader>) => any) | null;
+    onloadend: ((this: FileReader, ev: ProgressEvent<FileReader>) => any) | null;
+    onloadstart: ((this: FileReader, ev: ProgressEvent<FileReader>) => any) | null;
+    onprogress: ((this: FileReader, ev: ProgressEvent<FileReader>) => any) | null;
+    readonly readyState: number;
+    readonly result: string | ArrayBuffer | null;
+    abort(): void;
+    readAsArrayBuffer(blob: Blob): void;
+    readAsBinaryString(blob: Blob): void;
+    readAsDataURL(blob: Blob): void;
+    readAsText(blob: Blob, encoding?: string): void;
+    readonly DONE: number;
+    readonly EMPTY: number;
+    readonly LOADING: number;
+    addEventListener<K extends keyof FileReaderEventMap>(type: K, listener: (this: FileReader, ev: FileReaderEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof FileReaderEventMap>(type: K, listener: (this: FileReader, ev: FileReaderEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Focus-related events like focus, blur, focusin, or focusout. */
+export interface FocusEvent extends UIEvent {
+    readonly relatedTarget: EventTarget | null;
+}
+
+
+export interface FocusNavigationEvent extends Event {
+    readonly navigationReason: NavigationReason;
+    readonly originHeight: number;
+    readonly originLeft: number;
+    readonly originTop: number;
+    readonly originWidth: number;
+    requestFocus(): void;
+}
+
+
+/** Provides a way to easily construct a set of key/value pairs representing form fields and their values, which can then be easily sent using the XMLHttpRequest.send() method. It uses the same format a form would use if the encoding type were set to "multipart/form-data". */
+export interface FormData {
+    append(name: string, value: string | Blob, fileName?: string): void;
+    delete(name: string): void;
+    get(name: string): FormDataEntryValue | null;
+    getAll(name: string): FormDataEntryValue[];
+    has(name: string): boolean;
+    set(name: string, value: string | Blob, fileName?: string): void;
+    forEach(callbackfn: (value: FormDataEntryValue, key: string, parent: FormData) => void, thisArg?: any): void;
+}
+
+
+/** A change in volume. It is an AudioNode audio-processing module that causes a given gain to be applied to the input data before its propagation to the output. A GainNode always has exactly one input and one output, both with the same number of channels. */
+export interface GainNode extends AudioNode {
+    readonly gain: AudioParam;
+}
+
+
+/** This Gamepad API interface defines an individual gamepad or other controller, allowing access to information such as button presses, axis positions, and id. */
+export interface Gamepad {
+    readonly axes: ReadonlyArray<number>;
+    readonly buttons: ReadonlyArray<GamepadButton>;
+    readonly connected: boolean;
+    readonly hand: GamepadHand;
+    readonly hapticActuators: ReadonlyArray<GamepadHapticActuator>;
+    readonly id: string;
+    readonly index: number;
+    readonly mapping: GamepadMappingType;
+    readonly pose: GamepadPose | null;
+    readonly timestamp: number;
+}
+
+
+/** An individual button of a gamepad or other controller, allowing access to the current state of different types of buttons available on the control device. */
+export interface GamepadButton {
+    readonly pressed: boolean;
+    readonly touched: boolean;
+    readonly value: number;
+}
+
+
+/** This Gamepad API interface contains references to gamepads connected to the system, which is what the gamepad events Window.gamepadconnected and Window.gamepaddisconnected are fired in response to. */
+export interface GamepadEvent extends Event {
+    readonly gamepad: Gamepad;
+}
+
+
+/** This Gamepad API interface represents hardware in the controller designed to provide haptic feedback to the user (if available), most commonly vibration hardware. */
+export interface GamepadHapticActuator {
+    readonly type: GamepadHapticActuatorType;
+    pulse(value: number, duration: number): Promise<boolean>;
+}
+
+
+/** This Gamepad API interface represents the pose of a WebVR controller at a given timestamp (which includes orientation, position, velocity, and acceleration information.) */
+export interface GamepadPose {
+    readonly angularAcceleration: Float32Array | null;
+    readonly angularVelocity: Float32Array | null;
+    readonly hasOrientation: boolean;
+    readonly hasPosition: boolean;
+    readonly linearAcceleration: Float32Array | null;
+    readonly linearVelocity: Float32Array | null;
+    readonly orientation: Float32Array | null;
+    readonly position: Float32Array | null;
+}
+
+
+export interface GenericTransformStream {
+    /**
+     * Returns a readable stream whose chunks are strings resulting from running encoding's decoder on the chunks written to writable.
+     */
+    readonly readable: ReadableStream;
+    /**
+     * Returns a writable stream which accepts [AllowShared] BufferSource chunks and runs them through encoding's decoder before making them available to readable.
+     * 
+     * Typically this will be used via the pipeThrough() method on a ReadableStream source.
+     * 
+     * ```
+     * var decoder = new TextDecoderStream(encoding);
+     * byteReadable
+     *   .pipeThrough(decoder)
+     *   .pipeTo(textWritable);
+     * ```
+     * 
+     * If the error mode is "fatal" and encoding's decoder returns error, both readable and writable will be errored with a TypeError.
+     */
+    readonly writable: WritableStream;
+}
+
+/** An object able to programmatically obtain the position of the device. It gives Web content access to the location of the device. This allows a Web site or app to offer customized results based on the user's location. */
+export interface Geolocation {
+    clearWatch(watchId: number): void;
+    getCurrentPosition(successCallback: PositionCallback, errorCallback?: PositionErrorCallback, options?: PositionOptions): void;
+    watchPosition(successCallback: PositionCallback, errorCallback?: PositionErrorCallback, options?: PositionOptions): number;
+}
+
+export interface GlobalEventHandlersEventMap {
+    "abort": UIEvent;
+    "animationcancel": AnimationEvent;
+    "animationend": AnimationEvent;
+    "animationiteration": AnimationEvent;
+    "animationstart": AnimationEvent;
+    "auxclick": MouseEvent;
+    "blur": FocusEvent;
+    "cancel": Event;
+    "canplay": Event;
+    "canplaythrough": Event;
+    "change": Event;
+    "click": MouseEvent;
+    "close": Event;
+    "contextmenu": MouseEvent;
+    "cuechange": Event;
+    "dblclick": MouseEvent;
+    "drag": DragEvent;
+    "dragend": DragEvent;
+    "dragenter": DragEvent;
+    "dragexit": Event;
+    "dragleave": DragEvent;
+    "dragover": DragEvent;
+    "dragstart": DragEvent;
+    "drop": DragEvent;
+    "durationchange": Event;
+    "emptied": Event;
+    "ended": Event;
+    "error": ErrorEvent;
+    "focus": FocusEvent;
+    "focusin": FocusEvent;
+    "focusout": FocusEvent;
+    "gotpointercapture": PointerEvent;
+    "input": Event;
+    "invalid": Event;
+    "keydown": KeyboardEvent;
+    "keypress": KeyboardEvent;
+    "keyup": KeyboardEvent;
+    "load": Event;
+    "loadeddata": Event;
+    "loadedmetadata": Event;
+    "loadstart": Event;
+    "lostpointercapture": PointerEvent;
+    "mousedown": MouseEvent;
+    "mouseenter": MouseEvent;
+    "mouseleave": MouseEvent;
+    "mousemove": MouseEvent;
+    "mouseout": MouseEvent;
+    "mouseover": MouseEvent;
+    "mouseup": MouseEvent;
+    "pause": Event;
+    "play": Event;
+    "playing": Event;
+    "pointercancel": PointerEvent;
+    "pointerdown": PointerEvent;
+    "pointerenter": PointerEvent;
+    "pointerleave": PointerEvent;
+    "pointermove": PointerEvent;
+    "pointerout": PointerEvent;
+    "pointerover": PointerEvent;
+    "pointerup": PointerEvent;
+    "progress": ProgressEvent;
+    "ratechange": Event;
+    "reset": Event;
+    "resize": UIEvent;
+    "scroll": Event;
+    "securitypolicyviolation": SecurityPolicyViolationEvent;
+    "seeked": Event;
+    "seeking": Event;
+    "select": Event;
+    "selectionchange": Event;
+    "selectstart": Event;
+    "stalled": Event;
+    "submit": Event;
+    "suspend": Event;
+    "timeupdate": Event;
+    "toggle": Event;
+    "touchcancel": TouchEvent;
+    "touchend": TouchEvent;
+    "touchmove": TouchEvent;
+    "touchstart": TouchEvent;
+    "transitioncancel": TransitionEvent;
+    "transitionend": TransitionEvent;
+    "transitionrun": TransitionEvent;
+    "transitionstart": TransitionEvent;
+    "volumechange": Event;
+    "waiting": Event;
+    "wheel": WheelEvent;
+}
+
+export interface GlobalEventHandlers {
+    /**
+     * Fires when the user aborts the download.
+     * @param ev The event.
+     */
+    onabort: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
+    onanimationcancel: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
+    onanimationend: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
+    onanimationiteration: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
+    onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
+    onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+    /**
+     * Fires when the object loses the input focus.
+     * @param ev The focus event.
+     */
+    onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
+    oncancel: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs when playback is possible, but would require further buffering.
+     * @param ev The event.
+     */
+    oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    oncanplaythrough: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Fires when the contents of the object or selection have changed.
+     * @param ev The event.
+     */
+    onchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Fires when the user clicks the left mouse button on the object
+     * @param ev The mouse event.
+     */
+    onclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+    onclose: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Fires when the user clicks the right mouse button in the client area, opening the context menu.
+     * @param ev The mouse event.
+     */
+    oncontextmenu: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+    oncuechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Fires when the user double-clicks the object.
+     * @param ev The mouse event.
+     */
+    ondblclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+    /**
+     * Fires on the source object continuously during a drag operation.
+     * @param ev The event.
+     */
+    ondrag: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
+    /**
+     * Fires on the source object when the user releases the mouse at the close of a drag operation.
+     * @param ev The event.
+     */
+    ondragend: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
+    /**
+     * Fires on the target element when the user drags the object to a valid drop target.
+     * @param ev The drag event.
+     */
+    ondragenter: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
+    ondragexit: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Fires on the target object when the user moves the mouse out of a valid drop target during a drag operation.
+     * @param ev The drag event.
+     */
+    ondragleave: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
+    /**
+     * Fires on the target element continuously while the user drags the object over a valid drop target.
+     * @param ev The event.
+     */
+    ondragover: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
+    /**
+     * Fires on the source object when the user starts to drag a text selection or selected object.
+     * @param ev The event.
+     */
+    ondragstart: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
+    ondrop: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
+    /**
+     * Occurs when the duration attribute is updated.
+     * @param ev The event.
+     */
+    ondurationchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs when the media element is reset to its initial state.
+     * @param ev The event.
+     */
+    onemptied: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs when the end of playback is reached.
+     * @param ev The event
+     */
+    onended: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Fires when an error occurs during object loading.
+     * @param ev The event.
+     */
+    onerror: OnErrorEventHandler;
+    /**
+     * Fires when the object receives focus.
+     * @param ev The event.
+     */
+    onfocus: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
+    ongotpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+    oninput: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    oninvalid: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Fires when the user presses a key.
+     * @param ev The keyboard event
+     */
+    onkeydown: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
+    /**
+     * Fires when the user presses an alphanumeric key.
+     * @param ev The event.
+     */
+    onkeypress: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
+    /**
+     * Fires when the user releases a key.
+     * @param ev The keyboard event
+     */
+    onkeyup: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
+    /**
+     * Fires immediately after the browser loads the object.
+     * @param ev The event.
+     */
+    onload: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs when media data is loaded at the current playback position.
+     * @param ev The event.
+     */
+    onloadeddata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs when the duration and dimensions of the media have been determined.
+     * @param ev The event.
+     */
+    onloadedmetadata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs when Internet Explorer begins looking for media data.
+     * @param ev The event.
+     */
+    onloadstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    onlostpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+    /**
+     * Fires when the user clicks the object with either mouse button.
+     * @param ev The mouse event.
+     */
+    onmousedown: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+    onmouseenter: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+    onmouseleave: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+    /**
+     * Fires when the user moves the mouse over the object.
+     * @param ev The mouse event.
+     */
+    onmousemove: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+    /**
+     * Fires when the user moves the mouse pointer outside the boundaries of the object.
+     * @param ev The mouse event.
+     */
+    onmouseout: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+    /**
+     * Fires when the user moves the mouse pointer into the object.
+     * @param ev The mouse event.
+     */
+    onmouseover: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+    /**
+     * Fires when the user releases a mouse button while the mouse is over the object.
+     * @param ev The mouse event.
+     */
+    onmouseup: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+    /**
+     * Occurs when playback is paused.
+     * @param ev The event.
+     */
+    onpause: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs when the play method is requested.
+     * @param ev The event.
+     */
+    onplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs when the audio or video has started playing.
+     * @param ev The event.
+     */
+    onplaying: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    onpointercancel: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+    onpointerdown: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+    onpointerenter: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+    onpointerleave: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+    onpointermove: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+    onpointerout: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+    onpointerover: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+    onpointerup: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+    /**
+     * Occurs to indicate progress while downloading media data.
+     * @param ev The event.
+     */
+    onprogress: ((this: GlobalEventHandlers, ev: ProgressEvent) => any) | null;
+    /**
+     * Occurs when the playback rate is increased or decreased.
+     * @param ev The event.
+     */
+    onratechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Fires when the user resets a form.
+     * @param ev The event.
+     */
+    onreset: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    onresize: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
+    /**
+     * Fires when the user repositions the scroll box in the scroll bar on the object.
+     * @param ev The event.
+     */
+    onscroll: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    onsecuritypolicyviolation: ((this: GlobalEventHandlers, ev: SecurityPolicyViolationEvent) => any) | null;
+    /**
+     * Occurs when the seek operation ends.
+     * @param ev The event.
+     */
+    onseeked: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs when the current playback position is moved.
+     * @param ev The event.
+     */
+    onseeking: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Fires when the current selection changes.
+     * @param ev The event.
+     */
+    onselect: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    onselectionchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    onselectstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs when the download has stopped.
+     * @param ev The event.
+     */
+    onstalled: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    onsubmit: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs if the load operation has been intentionally halted.
+     * @param ev The event.
+     */
+    onsuspend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs to indicate the current playback position.
+     * @param ev The event.
+     */
+    ontimeupdate: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    ontoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    ontouchcancel?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null;
+    ontouchend?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null;
+    ontouchmove?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null;
+    ontouchstart?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null;
+    ontransitioncancel: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
+    ontransitionend: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
+    ontransitionrun: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
+    ontransitionstart: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
+    /**
+     * Occurs when the volume is changed, or playback is muted or unmuted.
+     * @param ev The event.
+     */
+    onvolumechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    /**
+     * Occurs when playback stops because the next frame of a video resource is not available.
+     * @param ev The event.
+     */
+    onwaiting: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+    onwheel: ((this: GlobalEventHandlers, ev: WheelEvent) => any) | null;
+    addEventListener<K extends keyof GlobalEventHandlersEventMap>(type: K, listener: (this: GlobalEventHandlers, ev: GlobalEventHandlersEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof GlobalEventHandlersEventMap>(type: K, listener: (this: GlobalEventHandlers, ev: GlobalEventHandlersEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+export interface HTMLAllCollection {
+    /**
+     * Returns the number of elements in the collection.
+     */
+    readonly length: number;
+    /**
+     * Returns the item with index index from the collection (determined by tree order).
+     */
+    item(nameOrIndex?: string): HTMLCollection | Element | null;
+    /**
+     * Returns the item with ID or name name from the collection.
+     * 
+     * If there are multiple matching items, then an HTMLCollection object containing all those elements is returned.
+     * 
+     * Only button, form, iframe, input, map, meta, object, select, and textarea elements can have a name for the purpose of this method; their name is given by the value of their name attribute.
+     */
+    namedItem(name: string): HTMLCollection | Element | null;
+    [index: number]: Element;
+}
+
+
+/** Hyperlink elements and provides special properties and methods (beyond those of the regular HTMLElement object interface that they inherit from) for manipulating the layout and presentation of such elements. */
+export interface HTMLAnchorElement extends HTMLElement, HTMLHyperlinkElementUtils {
+    /**
+     * Sets or retrieves the character set used to encode the object.
+     */
+    /** @deprecated */
+    charset: string;
+    /**
+     * Sets or retrieves the coordinates of the object.
+     */
+    /** @deprecated */
+    coords: string;
+    download: string;
+    /**
+     * Sets or retrieves the language code of the object.
+     */
+    hreflang: string;
+    /**
+     * Sets or retrieves the shape of the object.
+     */
+    /** @deprecated */
+    name: string;
+    ping: string;
+    referrerPolicy: string;
+    /**
+     * Sets or retrieves the relationship between the object and the destination of the link.
+     */
+    rel: string;
+    readonly relList: DOMTokenList;
+    /**
+     * Sets or retrieves the relationship between the object and the destination of the link.
+     */
+    /** @deprecated */
+    rev: string;
+    /**
+     * Sets or retrieves the shape of the object.
+     */
+    /** @deprecated */
+    shape: string;
+    /**
+     * Sets or retrieves the window or frame at which to target content.
+     */
+    target: string;
+    /**
+     * Retrieves or sets the text of the object as a string.
+     */
+    text: string;
+    type: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLAnchorElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLAnchorElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLAppletElement extends HTMLElement {
+    /** @deprecated */
+    align: string;
+    /**
+     * Sets or retrieves a text alternative to the graphic.
+     */
+    /** @deprecated */
+    alt: string;
+    /**
+     * Sets or retrieves a character string that can be used to implement your own archive functionality for the object.
+     */
+    /** @deprecated */
+    archive: string;
+    /** @deprecated */
+    code: string;
+    /**
+     * Sets or retrieves the URL of the component.
+     */
+    /** @deprecated */
+    codeBase: string;
+    readonly form: HTMLFormElement | null;
+    /**
+     * Sets or retrieves the height of the object.
+     */
+    /** @deprecated */
+    height: string;
+    /** @deprecated */
+    hspace: number;
+    /**
+     * Sets or retrieves the shape of the object.
+     */
+    /** @deprecated */
+    name: string;
+    /** @deprecated */
+    object: string;
+    /** @deprecated */
+    vspace: number;
+    /** @deprecated */
+    width: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLAppletElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLAppletElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods (beyond those of the regular object HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of <area> elements. */
+export interface HTMLAreaElement extends HTMLElement, HTMLHyperlinkElementUtils {
+    /**
+     * Sets or retrieves a text alternative to the graphic.
+     */
+    alt: string;
+    /**
+     * Sets or retrieves the coordinates of the object.
+     */
+    coords: string;
+    download: string;
+    /**
+     * Sets or gets whether clicks in this region cause action.
+     */
+    /** @deprecated */
+    noHref: boolean;
+    ping: string;
+    referrerPolicy: string;
+    rel: string;
+    readonly relList: DOMTokenList;
+    /**
+     * Sets or retrieves the shape of the object.
+     */
+    shape: string;
+    /**
+     * Sets or retrieves the window or frame at which to target content.
+     */
+    target: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLAreaElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLAreaElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides access to the properties of <audio> elements, as well as methods to manipulate them. It derives from the HTMLMediaElement interface. */
+export interface HTMLAudioElement extends HTMLMediaElement {
+    addEventListener<K extends keyof HTMLMediaElementEventMap>(type: K, listener: (this: HTMLAudioElement, ev: HTMLMediaElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLMediaElementEventMap>(type: K, listener: (this: HTMLAudioElement, ev: HTMLMediaElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A HTML line break element (<br>). It inherits from HTMLElement. */
+export interface HTMLBRElement extends HTMLElement {
+    /**
+     * Sets or retrieves the side on which floating objects are not to be positioned when any IHTMLBlockElement is inserted into the document.
+     */
+    /** @deprecated */
+    clear: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLBRElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLBRElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Contains the base URI for a document. This object inherits all of the properties and methods as described in the HTMLElement interface. */
+export interface HTMLBaseElement extends HTMLElement {
+    /**
+     * Gets or sets the baseline URL on which relative links are based.
+     */
+    href: string;
+    /**
+     * Sets or retrieves the window or frame at which to target content.
+     */
+    target: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLBaseElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLBaseElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <basefont> elements. */
+export interface HTMLBaseFontElement extends HTMLElement, DOML2DeprecatedColorProperty {
+    /**
+     * Sets or retrieves the current typeface family.
+     */
+    /** @deprecated */
+    face: string;
+    /**
+     * Sets or retrieves the font size of the object.
+     */
+    /** @deprecated */
+    size: number;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLBaseFontElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLBaseFontElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLBodyElementEventMap extends HTMLElementEventMap, WindowEventHandlersEventMap {
+    "orientationchange": Event;
+}
+
+/** Provides special properties (beyond those inherited from the regular HTMLElement interface) for manipulating <body> elements. */
+export interface HTMLBodyElement extends HTMLElement, WindowEventHandlers {
+    /** @deprecated */
+    aLink: string;
+    /** @deprecated */
+    background: string;
+    /** @deprecated */
+    bgColor: string;
+    /** @deprecated */
+    link: string;
+    /** @deprecated */
+    onorientationchange: ((this: HTMLBodyElement, ev: Event) => any) | null;
+    /** @deprecated */
+    text: string;
+    /** @deprecated */
+    vLink: string;
+    addEventListener<K extends keyof HTMLBodyElementEventMap>(type: K, listener: (this: HTMLBodyElement, ev: HTMLBodyElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLBodyElementEventMap>(type: K, listener: (this: HTMLBodyElement, ev: HTMLBodyElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <button> elements. */
+export interface HTMLButtonElement extends HTMLElement {
+    disabled: boolean;
+    /**
+     * Retrieves a reference to the form that the object is embedded in.
+     */
+    readonly form: HTMLFormElement | null;
+    /**
+     * Overrides the action attribute (where the data on a form is sent) on the parent form element.
+     */
+    formAction: string;
+    /**
+     * Used to override the encoding (formEnctype attribute) specified on the form element.
+     */
+    formEnctype: string;
+    /**
+     * Overrides the submit method attribute previously specified on a form element.
+     */
+    formMethod: string;
+    /**
+     * Overrides any validation or required attributes on a form or form elements to allow it to be submitted without validation. This can be used to create a "save draft"-type submit option.
+     */
+    formNoValidate: boolean;
+    /**
+     * Overrides the target attribute on a form element.
+     */
+    formTarget: string;
+    readonly labels: NodeListOf<HTMLLabelElement>;
+    /**
+     * Sets or retrieves the name of the object.
+     */
+    name: string;
+    /**
+     * Gets the classification and default behavior of the button.
+     */
+    type: string;
+    /**
+     * Returns the error message that would be displayed if the user submits the form, or an empty string if no error message. It also triggers the standard error message, such as "this is a required field". The result is that the user sees validation messages without actually submitting.
+     */
+    readonly validationMessage: string;
+    /**
+     * Returns a  ValidityState object that represents the validity states of an element.
+     */
+    readonly validity: ValidityState;
+    /**
+     * Sets or retrieves the default or selected value of the control.
+     */
+    value: string;
+    /**
+     * Returns whether an element will successfully validate based on forms validation rules and constraints.
+     */
+    readonly willValidate: boolean;
+    /**
+     * Returns whether a form will validate when it is submitted, without having to submit it.
+     */
+    checkValidity(): boolean;
+    reportValidity(): boolean;
+    /**
+     * Sets a custom error message that is displayed when a form is submitted.
+     * @param error Sets a custom error message that is displayed when a form is submitted.
+     */
+    setCustomValidity(error: string): void;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLButtonElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLButtonElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides properties and methods for manipulating the layout and presentation of <canvas> elements. The HTMLCanvasElement interface also inherits the properties and methods of the HTMLElement interface. */
+export interface HTMLCanvasElement extends HTMLElement {
+    /**
+     * Gets or sets the height of a canvas element on a document.
+     */
+    height: number;
+    /**
+     * Gets or sets the width of a canvas element on a document.
+     */
+    width: number;
+    /**
+     * Returns an object that provides methods and properties for drawing and manipulating images and graphics on a canvas element in a document. A context object includes information about colors, line widths, fonts, and other graphic parameters that can be drawn on a canvas.
+     * @param contextId The identifier (ID) of the type of canvas to create. Internet Explorer 9 and Internet Explorer 10 support only a 2-D context using canvas.getContext("2d"); IE11 Preview also supports 3-D or WebGL context using canvas.getContext("experimental-webgl");
+     */
+    getContext(contextId: "2d", options?: CanvasRenderingContext2DSettings): CanvasRenderingContext2D | null;
+    getContext(contextId: "bitmaprenderer", options?: ImageBitmapRenderingContextSettings): ImageBitmapRenderingContext | null;
+    getContext(contextId: "webgl", options?: WebGLContextAttributes): WebGLRenderingContext | null;
+    getContext(contextId: "webgl2", options?: WebGLContextAttributes): WebGL2RenderingContext | null;
+    getContext(contextId: string, options?: any): RenderingContext | null;
+    toBlob(callback: BlobCallback, type?: string, quality?: any): void;
+    /**
+     * Returns the content of the current canvas as an image that you can use as a source for another canvas or an HTML element.
+     * @param type The standard MIME type for the image format to return. If you do not specify this parameter, the default value is a PNG format image.
+     */
+    toDataURL(type?: string, quality?: any): string;
+    transferControlToOffscreen(): OffscreenCanvas;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLCanvasElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLCanvasElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A generic collection (array-like object similar to arguments) of elements (in document order) and offers methods and properties for selecting from the list. */
+export interface HTMLCollectionBase {
+    /**
+     * Sets or retrieves the number of objects in a collection.
+     */
+    readonly length: number;
+    /**
+     * Retrieves an object from various collections.
+     */
+    item(index: number): Element | null;
+    [index: number]: Element;
+}
+
+export interface HTMLCollection extends HTMLCollectionBase {
+    /**
+     * Retrieves a select object or an object from an options collection.
+     */
+    namedItem(name: string): Element | null;
+}
+
+
+export interface HTMLCollectionOf<T extends Element> extends HTMLCollectionBase {
+    item(index: number): T | null;
+    namedItem(name: string): T | null;
+    [index: number]: T;
+}
+
+/** Provides special properties (beyond those of the regular HTMLElement interface it also has available to it by inheritance) for manipulating definition list (<dl>) elements. */
+export interface HTMLDListElement extends HTMLElement {
+    /** @deprecated */
+    compact: boolean;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDListElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDListElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <data> elements. */
+export interface HTMLDataElement extends HTMLElement {
+    value: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDataElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDataElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond the HTMLElement object interface it also has available to it by inheritance) to manipulate <datalist> elements and their content. */
+export interface HTMLDataListElement extends HTMLElement {
+    readonly options: HTMLCollectionOf<HTMLOptionElement>;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDataListElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDataListElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLDetailsElement extends HTMLElement {
+    open: boolean;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDetailsElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDetailsElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLDialogElement extends HTMLElement {
+    open: boolean;
+    returnValue: string;
+    close(returnValue?: string): void;
+    show(): void;
+    showModal(): void;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDialogElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDialogElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLDirectoryElement extends HTMLElement {
+    /** @deprecated */
+    compact: boolean;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDirectoryElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDirectoryElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <div> elements. */
+export interface HTMLDivElement extends HTMLElement {
+    /**
+     * Sets or retrieves how the object is aligned with adjacent text.
+     */
+    /** @deprecated */
+    align: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDivElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLDivElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** The HTMLDocument property of Window objects is an alias that browsers expose for the Document interface object. */
+export interface HTMLDocument extends Document {
+    addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: HTMLDocument, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: HTMLDocument, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLElementEventMap extends ElementEventMap, GlobalEventHandlersEventMap, DocumentAndElementEventHandlersEventMap {
+}
+
+/** Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it. */
+export interface HTMLElement extends Element, DocumentAndElementEventHandlers, ElementCSSInlineStyle, ElementContentEditable, GlobalEventHandlers, HTMLOrSVGElement {
+    accessKey: string;
+    readonly accessKeyLabel: string;
+    autocapitalize: string;
+    dir: string;
+    draggable: boolean;
+    hidden: boolean;
+    innerText: string;
+    lang: string;
+    readonly offsetHeight: number;
+    readonly offsetLeft: number;
+    readonly offsetParent: Element | null;
+    readonly offsetTop: number;
+    readonly offsetWidth: number;
+    spellcheck: boolean;
+    title: string;
+    translate: boolean;
+    click(): void;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <embed> elements. */
+export interface HTMLEmbedElement extends HTMLElement {
+    /** @deprecated */
+    align: string;
+    /**
+     * Sets or retrieves the height of the object.
+     */
+    height: string;
+    /**
+     * Sets or retrieves the name of the object.
+     */
+    /** @deprecated */
+    name: string;
+    /**
+     * Sets or retrieves a URL to be loaded by the object.
+     */
+    src: string;
+    type: string;
+    /**
+     * Sets or retrieves the width of the object.
+     */
+    width: string;
+    getSVGDocument(): Document | null;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLEmbedElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLEmbedElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of <fieldset> elements. */
+export interface HTMLFieldSetElement extends HTMLElement {
+    disabled: boolean;
+    readonly elements: HTMLCollection;
+    /**
+     * Retrieves a reference to the form that the object is embedded in.
+     */
+    readonly form: HTMLFormElement | null;
+    name: string;
+    readonly type: string;
+    /**
+     * Returns the error message that would be displayed if the user submits the form, or an empty string if no error message. It also triggers the standard error message, such as "this is a required field". The result is that the user sees validation messages without actually submitting.
+     */
+    readonly validationMessage: string;
+    /**
+     * Returns a  ValidityState object that represents the validity states of an element.
+     */
+    readonly validity: ValidityState;
+    /**
+     * Returns whether an element will successfully validate based on forms validation rules and constraints.
+     */
+    readonly willValidate: boolean;
+    /**
+     * Returns whether a form will validate when it is submitted, without having to submit it.
+     */
+    checkValidity(): boolean;
+    reportValidity(): boolean;
+    /**
+     * Sets a custom error message that is displayed when a form is submitted.
+     * @param error Sets a custom error message that is displayed when a form is submitted.
+     */
+    setCustomValidity(error: string): void;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLFieldSetElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLFieldSetElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Implements the document object model (DOM) representation of the font element. The HTML Font Element <font> defines the font size, font face and color of text. */
+export interface HTMLFontElement extends HTMLElement {
+    /** @deprecated */
+    color: string;
+    /**
+     * Sets or retrieves the current typeface family.
+     */
+    /** @deprecated */
+    face: string;
+    /** @deprecated */
+    size: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLFontElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLFontElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A collection of HTML form control elements.  */
+export interface HTMLFormControlsCollection extends HTMLCollectionBase {
+    /**
+     * Returns the item with ID or name name from the collection.
+     * 
+     * If there are multiple matching items, then a RadioNodeList object containing all those elements is returned.
+     */
+    namedItem(name: string): RadioNodeList | Element | null;
+}
+
+
+/** A <form> element in the DOM; it allows access to and in some cases modification of aspects of the form, as well as access to its component elements. */
+export interface HTMLFormElement extends HTMLElement {
+    /**
+     * Sets or retrieves a list of character encodings for input data that must be accepted by the server processing the form.
+     */
+    acceptCharset: string;
+    /**
+     * Sets or retrieves the URL to which the form content is sent for processing.
+     */
+    action: string;
+    /**
+     * Specifies whether autocomplete is applied to an editable text field.
+     */
+    autocomplete: string;
+    /**
+     * Retrieves a collection, in source order, of all controls in a given form.
+     */
+    readonly elements: HTMLFormControlsCollection;
+    /**
+     * Sets or retrieves the MIME encoding for the form.
+     */
+    encoding: string;
+    /**
+     * Sets or retrieves the encoding type for the form.
+     */
+    enctype: string;
+    /**
+     * Sets or retrieves the number of objects in a collection.
+     */
+    readonly length: number;
+    /**
+     * Sets or retrieves how to send the form data to the server.
+     */
+    method: string;
+    /**
+     * Sets or retrieves the name of the object.
+     */
+    name: string;
+    /**
+     * Designates a form that is not validated when submitted.
+     */
+    noValidate: boolean;
+    /**
+     * Sets or retrieves the window or frame at which to target content.
+     */
+    target: string;
+    /**
+     * Returns whether a form will validate when it is submitted, without having to submit it.
+     */
+    checkValidity(): boolean;
+    reportValidity(): boolean;
+    /**
+     * Fires when the user resets a form.
+     */
+    reset(): void;
+    /**
+     * Fires when a FORM is about to be submitted.
+     */
+    submit(): void;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLFormElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLFormElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    [index: number]: Element;
+    [name: string]: any;
+}
+
+
+export interface HTMLFrameElement extends HTMLElement {
+    /**
+     * Retrieves the document object of the page or frame.
+     */
+    /** @deprecated */
+    readonly contentDocument: Document | null;
+    /**
+     * Retrieves the object of the specified.
+     */
+    /** @deprecated */
+    readonly contentWindow: WindowProxy | null;
+    /**
+     * Sets or retrieves whether to display a border for the frame.
+     */
+    /** @deprecated */
+    frameBorder: string;
+    /**
+     * Sets or retrieves a URI to a long description of the object.
+     */
+    /** @deprecated */
+    longDesc: string;
+    /**
+     * Sets or retrieves the top and bottom margin heights before displaying the text in a frame.
+     */
+    /** @deprecated */
+    marginHeight: string;
+    /**
+     * Sets or retrieves the left and right margin widths before displaying the text in a frame.
+     */
+    /** @deprecated */
+    marginWidth: string;
+    /**
+     * Sets or retrieves the frame name.
+     */
+    /** @deprecated */
+    name: string;
+    /**
+     * Sets or retrieves whether the user can resize the frame.
+     */
+    /** @deprecated */
+    noResize: boolean;
+    /**
+     * Sets or retrieves whether the frame can be scrolled.
+     */
+    /** @deprecated */
+    scrolling: string;
+    /**
+     * Sets or retrieves a URL to be loaded by the object.
+     */
+    /** @deprecated */
+    src: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLFrameElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLFrameElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLFrameSetElementEventMap extends HTMLElementEventMap, WindowEventHandlersEventMap {
+}
+
+/** Provides special properties (beyond those of the regular HTMLElement interface they also inherit) for manipulating <frameset> elements. */
+export interface HTMLFrameSetElement extends HTMLElement, WindowEventHandlers {
+    /**
+     * Sets or retrieves the frame widths of the object.
+     */
+    /** @deprecated */
+    cols: string;
+    /**
+     * Sets or retrieves the frame heights of the object.
+     */
+    /** @deprecated */
+    rows: string;
+    addEventListener<K extends keyof HTMLFrameSetElementEventMap>(type: K, listener: (this: HTMLFrameSetElement, ev: HTMLFrameSetElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLFrameSetElementEventMap>(type: K, listener: (this: HTMLFrameSetElement, ev: HTMLFrameSetElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond those of the HTMLElement interface it also has available to it by inheritance) for manipulating <hr> elements. */
+export interface HTMLHRElement extends HTMLElement {
+    /**
+     * Sets or retrieves how the object is aligned with adjacent text.
+     */
+    /** @deprecated */
+    align: string;
+    /** @deprecated */
+    color: string;
+    /**
+     * Sets or retrieves whether the horizontal rule is drawn with 3-D shading.
+     */
+    /** @deprecated */
+    noShade: boolean;
+    /** @deprecated */
+    size: string;
+    /**
+     * Sets or retrieves the width of the object.
+     */
+    /** @deprecated */
+    width: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLHRElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLHRElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Contains the descriptive information, or metadata, for a document. This object inherits all of the properties and methods described in the HTMLElement interface. */
+export interface HTMLHeadElement extends HTMLElement {
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLHeadElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLHeadElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** The different heading elements. It inherits methods and properties from the HTMLElement interface. */
+export interface HTMLHeadingElement extends HTMLElement {
+    /**
+     * Sets or retrieves a value that indicates the table alignment.
+     */
+    /** @deprecated */
+    align: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLHeadingElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLHeadingElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Serves as the root node for a given HTML document. This object inherits the properties and methods described in the HTMLElement interface. */
+export interface HTMLHtmlElement extends HTMLElement {
+    /**
+     * Sets or retrieves the DTD version that governs the current document.
+     */
+    /** @deprecated */
+    version: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLHtmlElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLHtmlElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLHyperlinkElementUtils {
+    hash: string;
+    host: string;
+    hostname: string;
+    href: string;
+    toString(): string;
+    readonly origin: string;
+    password: string;
+    pathname: string;
+    port: string;
+    protocol: string;
+    search: string;
+    username: string;
+}
+
+/** Provides special properties and methods (beyond those of the HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of inline frame elements. */
+export interface HTMLIFrameElement extends HTMLElement {
+    /**
+     * Sets or retrieves how the object is aligned with adjacent text.
+     */
+    /** @deprecated */
+    align: string;
+    allow: string;
+    allowFullscreen: boolean;
+    allowPaymentRequest: boolean;
+    /**
+     * Retrieves the document object of the page or frame.
+     */
+    readonly contentDocument: Document | null;
+    /**
+     * Retrieves the object of the specified.
+     */
+    readonly contentWindow: WindowProxy | null;
+    /**
+     * Sets or retrieves whether to display a border for the frame.
+     */
+    /** @deprecated */
+    frameBorder: string;
+    /**
+     * Sets or retrieves the height of the object.
+     */
+    height: string;
+    /**
+     * Sets or retrieves a URI to a long description of the object.
+     */
+    /** @deprecated */
+    longDesc: string;
+    /**
+     * Sets or retrieves the top and bottom margin heights before displaying the text in a frame.
+     */
+    /** @deprecated */
+    marginHeight: string;
+    /**
+     * Sets or retrieves the left and right margin widths before displaying the text in a frame.
+     */
+    /** @deprecated */
+    marginWidth: string;
+    /**
+     * Sets or retrieves the frame name.
+     */
+    name: string;
+    referrerPolicy: ReferrerPolicy;
+    readonly sandbox: DOMTokenList;
+    /**
+     * Sets or retrieves whether the frame can be scrolled.
+     */
+    /** @deprecated */
+    scrolling: string;
+    /**
+     * Sets or retrieves a URL to be loaded by the object.
+     */
+    src: string;
+    /**
+     * Sets or retrives the content of the page that is to contain.
+     */
+    srcdoc: string;
+    /**
+     * Sets or retrieves the width of the object.
+     */
+    width: string;
+    getSVGDocument(): Document | null;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLIFrameElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLIFrameElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods for manipulating <img> elements. */
+export interface HTMLImageElement extends HTMLElement {
+    /**
+     * Sets or retrieves how the object is aligned with adjacent text.
+     */
+    /** @deprecated */
+    align: string;
+    /**
+     * Sets or retrieves a text alternative to the graphic.
+     */
+    alt: string;
+    /**
+     * Specifies the properties of a border drawn around an object.
+     */
+    /** @deprecated */
+    border: string;
+    /**
+     * Retrieves whether the object is fully loaded.
+     */
+    readonly complete: boolean;
+    crossOrigin: string | null;
+    readonly currentSrc: string;
+    decoding: "async" | "sync" | "auto";
+    /**
+     * Sets or retrieves the height of the object.
+     */
+    height: number;
+    /**
+     * Sets or retrieves the width of the border to draw around the object.
+     */
+    /** @deprecated */
+    hspace: number;
+    /**
+     * Sets or retrieves whether the image is a server-side image map.
+     */
+    isMap: boolean;
+    /**
+     * Sets or retrieves a Uniform Resource Identifier (URI) to a long description of the object.
+     */
+    /** @deprecated */
+    longDesc: string;
+    /** @deprecated */
+    lowsrc: string;
+    /**
+     * Sets or retrieves the name of the object.
+     */
+    /** @deprecated */
+    name: string;
+    /**
+     * The original height of the image resource before sizing.
+     */
+    readonly naturalHeight: number;
+    /**
+     * The original width of the image resource before sizing.
+     */
+    readonly naturalWidth: number;
+    referrerPolicy: string;
+    sizes: string;
+    /**
+     * The address or URL of the a media resource that is to be considered.
+     */
+    src: string;
+    srcset: string;
+    /**
+     * Sets or retrieves the URL, often with a bookmark extension (#name), to use as a client-side image map.
+     */
+    useMap: string;
+    /**
+     * Sets or retrieves the vertical margin for the object.
+     */
+    /** @deprecated */
+    vspace: number;
+    /**
+     * Sets or retrieves the width of the object.
+     */
+    width: number;
+    readonly x: number;
+    readonly y: number;
+    decode(): Promise<void>;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLImageElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLImageElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods for manipulating the options, layout, and presentation of <input> elements. */
+export interface HTMLInputElement extends HTMLElement {
+    /**
+     * Sets or retrieves a comma-separated list of content types.
+     */
+    accept: string;
+    /**
+     * Sets or retrieves how the object is aligned with adjacent text.
+     */
+    /** @deprecated */
+    align: string;
+    /**
+     * Sets or retrieves a text alternative to the graphic.
+     */
+    alt: string;
+    /**
+     * Specifies whether autocomplete is applied to an editable text field.
+     */
+    autocomplete: string;
+    /**
+     * Sets or retrieves the state of the check box or radio button.
+     */
+    checked: boolean;
+    /**
+     * Sets or retrieves the state of the check box or radio button.
+     */
+    defaultChecked: boolean;
+    /**
+     * Sets or retrieves the initial contents of the object.
+     */
+    defaultValue: string;
+    dirName: string;
+    disabled: boolean;
+    /**
+     * Returns a FileList object on a file type input object.
+     */
+    files: FileList | null;
+    /**
+     * Retrieves a reference to the form that the object is embedded in.
+     */
+    readonly form: HTMLFormElement | null;
+    /**
+     * Overrides the action attribute (where the data on a form is sent) on the parent form element.
+     */
+    formAction: string;
+    /**
+     * Used to override the encoding (formEnctype attribute) specified on the form element.
+     */
+    formEnctype: string;
+    /**
+     * Overrides the submit method attribute previously specified on a form element.
+     */
+    formMethod: string;
+    /**
+     * Overrides any validation or required attributes on a form or form elements to allow it to be submitted without validation. This can be used to create a "save draft"-type submit option.
+     */
+    formNoValidate: boolean;
+    /**
+     * Overrides the target attribute on a form element.
+     */
+    formTarget: string;
+    /**
+     * Sets or retrieves the height of the object.
+     */
+    height: number;
+    indeterminate: boolean;
+    readonly labels: NodeListOf<HTMLLabelElement> | null;
+    /**
+     * Specifies the ID of a pre-defined datalist of options for an input element.
+     */
+    readonly list: HTMLElement | null;
+    /**
+     * Defines the maximum acceptable value for an input element with type="number".When used with the min and step attributes, lets you control the range and increment (such as only even numbers) that the user can enter into an input field.
+     */
+    max: string;
+    /**
+     * Sets or retrieves the maximum number of characters that the user can enter in a text control.
+     */
+    maxLength: number;
+    /**
+     * Defines the minimum acceptable value for an input element with type="number". When used with the max and step attributes, lets you control the range and increment (such as even numbers only) that the user can enter into an input field.
+     */
+    min: string;
+    minLength: number;
+    /**
+     * Sets or retrieves the Boolean value indicating whether multiple items can be selected from a list.
+     */
+    multiple: boolean;
+    /**
+     * Sets or retrieves the name of the object.
+     */
+    name: string;
+    /**
+     * Gets or sets a string containing a regular expression that the user's input must match.
+     */
+    pattern: string;
+    /**
+     * Gets or sets a text string that is displayed in an input field as a hint or prompt to users as the format or type of information they need to enter.The text appears in an input field until the user puts focus on the field.
+     */
+    placeholder: string;
+    readOnly: boolean;
+    /**
+     * When present, marks an element that can't be submitted without a value.
+     */
+    required: boolean;
+    selectionDirection: "forward" | "backward" | "none" | null;
+    /**
+     * Gets or sets the end position or offset of a text selection.
+     */
+    selectionEnd: number | null;
+    /**
+     * Gets or sets the starting position or offset of a text selection.
+     */
+    selectionStart: number | null;
+    size: number;
+    /**
+     * The address or URL of the a media resource that is to be considered.
+     */
+    src: string;
+    /**
+     * Defines an increment or jump between values that you want to allow the user to enter. When used with the max and min attributes, lets you control the range and increment (for example, allow only even numbers) that the user can enter into an input field.
+     */
+    step: string;
+    /**
+     * Returns the content type of the object.
+     */
+    type: string;
+    /**
+     * Sets or retrieves the URL, often with a bookmark extension (#name), to use as a client-side image map.
+     */
+    /** @deprecated */
+    useMap: string;
+    /**
+     * Returns the error message that would be displayed if the user submits the form, or an empty string if no error message. It also triggers the standard error message, such as "this is a required field". The result is that the user sees validation messages without actually submitting.
+     */
+    readonly validationMessage: string;
+    /**
+     * Returns a  ValidityState object that represents the validity states of an element.
+     */
+    readonly validity: ValidityState;
+    /**
+     * Returns the value of the data at the cursor's current position.
+     */
+    value: string;
+    /**
+     * Returns a Date object representing the form control's value, if applicable; otherwise, returns null. Can be set, to change the value. Throws an "InvalidStateError" DOMException if the control isn't date- or time-based.
+     */
+    valueAsDate: Date | null;
+    /**
+     * Returns the input field value as a number.
+     */
+    valueAsNumber: number;
+    /**
+     * Sets or retrieves the width of the object.
+     */
+    width: number;
+    /**
+     * Returns whether an element will successfully validate based on forms validation rules and constraints.
+     */
+    readonly willValidate: boolean;
+    /**
+     * Returns whether a form will validate when it is submitted, without having to submit it.
+     */
+    checkValidity(): boolean;
+    reportValidity(): boolean;
+    /**
+     * Makes the selection equal to the current object.
+     */
+    select(): void;
+    /**
+     * Sets a custom error message that is displayed when a form is submitted.
+     * @param error Sets a custom error message that is displayed when a form is submitted.
+     */
+    setCustomValidity(error: string): void;
+    setRangeText(replacement: string): void;
+    setRangeText(replacement: string, start: number, end: number, selectionMode?: SelectionMode): void;
+    /**
+     * Sets the start and end positions of a selection in a text field.
+     * @param start The offset into the text field for the start of the selection.
+     * @param end The offset into the text field for the end of the selection.
+     * @param direction The direction in which the selection is performed.
+     */
+    setSelectionRange(start: number, end: number, direction?: "forward" | "backward" | "none"): void;
+    /**
+     * Decrements a range input control's value by the value given by the Step attribute. If the optional parameter is used, it will decrement the input control's step value multiplied by the parameter's value.
+     * @param n Value to decrement the value by.
+     */
+    stepDown(n?: number): void;
+    /**
+     * Increments a range input control's value by the value given by the Step attribute. If the optional parameter is used, will increment the input control's value by that value.
+     * @param n Value to increment the value by.
+     */
+    stepUp(n?: number): void;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLInputElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLInputElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Exposes specific properties and methods (beyond those defined by regular HTMLElement interface it also has available to it by inheritance) for manipulating list elements. */
+export interface HTMLLIElement extends HTMLElement {
+    /** @deprecated */
+    type: string;
+    /**
+     * Sets or retrieves the value of a list item.
+     */
+    value: number;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLLIElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLLIElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Gives access to properties specific to <label> elements. It inherits methods and properties from the base HTMLElement interface. */
+export interface HTMLLabelElement extends HTMLElement {
+    readonly control: HTMLElement | null;
+    /**
+     * Retrieves a reference to the form that the object is embedded in.
+     */
+    readonly form: HTMLFormElement | null;
+    /**
+     * Sets or retrieves the object to which the given label object is assigned.
+     */
+    htmlFor: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLLabelElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLLabelElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** The HTMLLegendElement is an interface allowing to access properties of the <legend> elements. It inherits properties and methods from the HTMLElement interface. */
+export interface HTMLLegendElement extends HTMLElement {
+    /** @deprecated */
+    align: string;
+    /**
+     * Retrieves a reference to the form that the object is embedded in.
+     */
+    readonly form: HTMLFormElement | null;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLLegendElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLLegendElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Reference information for external resources and the relationship of those resources to a document and vice-versa. This object inherits all of the properties and methods of the HTMLElement interface. */
+export interface HTMLLinkElement extends HTMLElement, LinkStyle {
+    as: string;
+    /**
+     * Sets or retrieves the character set used to encode the object.
+     */
+    /** @deprecated */
+    charset: string;
+    crossOrigin: string | null;
+    disabled: boolean;
+    /**
+     * Sets or retrieves a destination URL or an anchor point.
+     */
+    href: string;
+    /**
+     * Sets or retrieves the language code of the object.
+     */
+    hreflang: string;
+    imageSizes: string;
+    imageSrcset: string;
+    integrity: string;
+    /**
+     * Sets or retrieves the media type.
+     */
+    media: string;
+    referrerPolicy: string;
+    /**
+     * Sets or retrieves the relationship between the object and the destination of the link.
+     */
+    rel: string;
+    readonly relList: DOMTokenList;
+    /**
+     * Sets or retrieves the relationship between the object and the destination of the link.
+     */
+    /** @deprecated */
+    rev: string;
+    readonly sizes: DOMTokenList;
+    /**
+     * Sets or retrieves the window or frame at which to target content.
+     */
+    /** @deprecated */
+    target: string;
+    /**
+     * Sets or retrieves the MIME type of the object.
+     */
+    type: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLLinkElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLLinkElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods (beyond those of the regular object HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of map elements. */
+export interface HTMLMapElement extends HTMLElement {
+    /**
+     * Retrieves a collection of the area objects defined for the given map object.
+     */
+    readonly areas: HTMLCollection;
+    /**
+     * Sets or retrieves the name of the object.
+     */
+    name: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLMapElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLMapElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLMarqueeElementEventMap extends HTMLElementEventMap {
+    "bounce": Event;
+    "finish": Event;
+    "start": Event;
+}
+
+/** Provides methods to manipulate <marquee> elements. */
+export interface HTMLMarqueeElement extends HTMLElement {
+    /** @deprecated */
+    behavior: string;
+    /** @deprecated */
+    bgColor: string;
+    /** @deprecated */
+    direction: string;
+    /** @deprecated */
+    height: string;
+    /** @deprecated */
+    hspace: number;
+    /** @deprecated */
+    loop: number;
+    /** @deprecated */
+    onbounce: ((this: HTMLMarqueeElement, ev: Event) => any) | null;
+    /** @deprecated */
+    onfinish: ((this: HTMLMarqueeElement, ev: Event) => any) | null;
+    /** @deprecated */
+    onstart: ((this: HTMLMarqueeElement, ev: Event) => any) | null;
+    /** @deprecated */
+    scrollAmount: number;
+    /** @deprecated */
+    scrollDelay: number;
+    /** @deprecated */
+    trueSpeed: boolean;
+    /** @deprecated */
+    vspace: number;
+    /** @deprecated */
+    width: string;
+    /** @deprecated */
+    start(): void;
+    /** @deprecated */
+    stop(): void;
+    addEventListener<K extends keyof HTMLMarqueeElementEventMap>(type: K, listener: (this: HTMLMarqueeElement, ev: HTMLMarqueeElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLMarqueeElementEventMap>(type: K, listener: (this: HTMLMarqueeElement, ev: HTMLMarqueeElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLMediaElementEventMap extends HTMLElementEventMap {
+    "encrypted": MediaEncryptedEvent;
+    "msneedkey": MSMediaKeyNeededEvent;
+    "waitingforkey": Event;
+}
+
+/** Adds to HTMLElement the properties and methods needed to support basic media-related capabilities that are common to audio and video. */
+export interface HTMLMediaElement extends HTMLElement {
+    /**
+     * Returns an AudioTrackList object with the audio tracks for a given video element.
+     */
+    readonly audioTracks: AudioTrackList;
+    /**
+     * Gets or sets a value that indicates whether to start playing the media automatically.
+     */
+    autoplay: boolean;
+    /**
+     * Gets a collection of buffered time ranges.
+     */
+    readonly buffered: TimeRanges;
+    /**
+     * Gets or sets a flag that indicates whether the client provides a set of controls for the media (in case the developer does not include controls for the player).
+     */
+    controls: boolean;
+    crossOrigin: string | null;
+    /**
+     * Gets the address or URL of the current media resource that is selected by IHTMLMediaElement.
+     */
+    readonly currentSrc: string;
+    /**
+     * Gets or sets the current playback position, in seconds.
+     */
+    currentTime: number;
+    defaultMuted: boolean;
+    /**
+     * Gets or sets the default playback rate when the user is not using fast forward or reverse for a video or audio resource.
+     */
+    defaultPlaybackRate: number;
+    /**
+     * Returns the duration in seconds of the current media resource. A NaN value is returned if duration is not available, or Infinity if the media resource is streaming.
+     */
+    readonly duration: number;
+    /**
+     * Gets information about whether the playback has ended or not.
+     */
+    readonly ended: boolean;
+    /**
+     * Returns an object representing the current error state of the audio or video element.
+     */
+    readonly error: MediaError | null;
+    /**
+     * Gets or sets a flag to specify whether playback should restart after it completes.
+     */
+    loop: boolean;
+    readonly mediaKeys: MediaKeys | null;
+    /**
+     * Specifies the purpose of the audio or video media, such as background audio or alerts.
+     */
+    msAudioCategory: string;
+    /**
+     * Specifies the output device id that the audio will be sent to.
+     */
+    msAudioDeviceType: string;
+    readonly msGraphicsTrustStatus: MSGraphicsTrust;
+    /**
+     * Gets the MSMediaKeys object, which is used for decrypting media data, that is associated with this media element.
+     */
+    /** @deprecated */
+    readonly msKeys: MSMediaKeys;
+    /**
+     * Gets or sets whether the DLNA PlayTo device is available.
+     */
+    msPlayToDisabled: boolean;
+    /**
+     * Gets or sets the path to the preferred media source. This enables the Play To target device to stream the media content, which can be DRM protected, from a different location, such as a cloud media server.
+     */
+    msPlayToPreferredSourceUri: string;
+    /**
+     * Gets or sets the primary DLNA PlayTo device.
+     */
+    msPlayToPrimary: boolean;
+    /**
+     * Gets the source associated with the media element for use by the PlayToManager.
+     */
+    readonly msPlayToSource: any;
+    /**
+     * Specifies whether or not to enable low-latency playback on the media element.
+     */
+    msRealTime: boolean;
+    /**
+     * Gets or sets a flag that indicates whether the audio (either audio or the audio track on video media) is muted.
+     */
+    muted: boolean;
+    /**
+     * Gets the current network activity for the element.
+     */
+    readonly networkState: number;
+    onencrypted: ((this: HTMLMediaElement, ev: MediaEncryptedEvent) => any) | null;
+    /** @deprecated */
+    onmsneedkey: ((this: HTMLMediaElement, ev: MSMediaKeyNeededEvent) => any) | null;
+    onwaitingforkey: ((this: HTMLMediaElement, ev: Event) => any) | null;
+    /**
+     * Gets a flag that specifies whether playback is paused.
+     */
+    readonly paused: boolean;
+    /**
+     * Gets or sets the current rate of speed for the media resource to play. This speed is expressed as a multiple of the normal speed of the media resource.
+     */
+    playbackRate: number;
+    /**
+     * Gets TimeRanges for the current media resource that has been played.
+     */
+    readonly played: TimeRanges;
+    /**
+     * Gets or sets the current playback position, in seconds.
+     */
+    preload: string;
+    readonly readyState: number;
+    /**
+     * Returns a TimeRanges object that represents the ranges of the current media resource that can be seeked.
+     */
+    readonly seekable: TimeRanges;
+    /**
+     * Gets a flag that indicates whether the client is currently moving to a new playback position in the media resource.
+     */
+    readonly seeking: boolean;
+    /**
+     * The address or URL of the a media resource that is to be considered.
+     */
+    src: string;
+    srcObject: MediaStream | MediaSource | Blob | null;
+    readonly textTracks: TextTrackList;
+    readonly videoTracks: VideoTrackList;
+    /**
+     * Gets or sets the volume level for audio portions of the media element.
+     */
+    volume: number;
+    addTextTrack(kind: TextTrackKind, label?: string, language?: string): TextTrack;
+    /**
+     * Returns a string that specifies whether the client can play a given media resource type.
+     */
+    canPlayType(type: string): CanPlayTypeResult;
+    /**
+     * Resets the audio or video object and loads a new media resource.
+     */
+    load(): void;
+    /**
+     * Clears all effects from the media pipeline.
+     */
+    msClearEffects(): void;
+    msGetAsCastingSource(): any;
+    /**
+     * Inserts the specified audio effect into media pipeline.
+     */
+    msInsertAudioEffect(activatableClassId: string, effectRequired: boolean, config?: any): void;
+    /** @deprecated */
+    msSetMediaKeys(mediaKeys: MSMediaKeys): void;
+    /**
+     * Specifies the media protection manager for a given media pipeline.
+     */
+    msSetMediaProtectionManager(mediaProtectionManager?: any): void;
+    /**
+     * Pauses the current playback and sets paused to TRUE. This can be used to test whether the media is playing or paused. You can also use the pause or play events to tell whether the media is playing or not.
+     */
+    pause(): void;
+    /**
+     * Loads and starts playback of a media resource.
+     */
+    play(): Promise<void>;
+    setMediaKeys(mediaKeys: MediaKeys | null): Promise<void>;
+    readonly HAVE_CURRENT_DATA: number;
+    readonly HAVE_ENOUGH_DATA: number;
+    readonly HAVE_FUTURE_DATA: number;
+    readonly HAVE_METADATA: number;
+    readonly HAVE_NOTHING: number;
+    readonly NETWORK_EMPTY: number;
+    readonly NETWORK_IDLE: number;
+    readonly NETWORK_LOADING: number;
+    readonly NETWORK_NO_SOURCE: number;
+    addEventListener<K extends keyof HTMLMediaElementEventMap>(type: K, listener: (this: HTMLMediaElement, ev: HTMLMediaElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLMediaElementEventMap>(type: K, listener: (this: HTMLMediaElement, ev: HTMLMediaElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLMenuElement extends HTMLElement {
+    /** @deprecated */
+    compact: boolean;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLMenuElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLMenuElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Contains descriptive metadata about a document. It inherits all of the properties and methods described in the HTMLElement interface. */
+export interface HTMLMetaElement extends HTMLElement {
+    /**
+     * Gets or sets meta-information to associate with httpEquiv or name.
+     */
+    content: string;
+    /**
+     * Gets or sets information used to bind the value of a content attribute of a meta element to an HTTP response header.
+     */
+    httpEquiv: string;
+    /**
+     * Sets or retrieves the value specified in the content attribute of the meta object.
+     */
+    name: string;
+    /**
+     * Sets or retrieves a scheme to be used in interpreting the value of a property specified for the object.
+     */
+    /** @deprecated */
+    scheme: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLMetaElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLMetaElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** The HTML <meter> elements expose the HTMLMeterElement interface, which provides special properties and methods (beyond the HTMLElement object interface they also have available to them by inheritance) for manipulating the layout and presentation of <meter> elements. */
+export interface HTMLMeterElement extends HTMLElement {
+    high: number;
+    readonly labels: NodeListOf<HTMLLabelElement>;
+    low: number;
+    max: number;
+    min: number;
+    optimum: number;
+    value: number;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLMeterElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLMeterElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond the regular methods and properties available through the HTMLElement interface they also have available to them by inheritance) for manipulating modification elements, that is <del> and <ins>. */
+export interface HTMLModElement extends HTMLElement {
+    /**
+     * Sets or retrieves reference information about the object.
+     */
+    cite: string;
+    /**
+     * Sets or retrieves the date and time of a modification to the object.
+     */
+    dateTime: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLModElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLModElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond those defined on the regular HTMLElement interface it also has available to it by inheritance) for manipulating ordered list elements. */
+export interface HTMLOListElement extends HTMLElement {
+    /** @deprecated */
+    compact: boolean;
+    reversed: boolean;
+    /**
+     * The starting number.
+     */
+    start: number;
+    type: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLOListElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLOListElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods (beyond those on the HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of <object> element, representing external resources. */
+export interface HTMLObjectElement extends HTMLElement {
+    /** @deprecated */
+    align: string;
+    /**
+     * Sets or retrieves a character string that can be used to implement your own archive functionality for the object.
+     */
+    /** @deprecated */
+    archive: string;
+    /** @deprecated */
+    border: string;
+    /**
+     * Sets or retrieves the URL of the file containing the compiled Java class.
+     */
+    /** @deprecated */
+    code: string;
+    /**
+     * Sets or retrieves the URL of the component.
+     */
+    /** @deprecated */
+    codeBase: string;
+    /**
+     * Sets or retrieves the Internet media type for the code associated with the object.
+     */
+    /** @deprecated */
+    codeType: string;
+    /**
+     * Retrieves the document object of the page or frame.
+     */
+    readonly contentDocument: Document | null;
+    readonly contentWindow: WindowProxy | null;
+    /**
+     * Sets or retrieves the URL that references the data of the object.
+     */
+    data: string;
+    /** @deprecated */
+    declare: boolean;
+    /**
+     * Retrieves a reference to the form that the object is embedded in.
+     */
+    readonly form: HTMLFormElement | null;
+    /**
+     * Sets or retrieves the height of the object.
+     */
+    height: string;
+    /** @deprecated */
+    hspace: number;
+    /**
+     * Sets or retrieves the name of the object.
+     */
+    name: string;
+    /**
+     * Sets or retrieves a message to be displayed while an object is loading.
+     */
+    /** @deprecated */
+    standby: string;
+    /**
+     * Sets or retrieves the MIME type of the object.
+     */
+    type: string;
+    /**
+     * Sets or retrieves the URL, often with a bookmark extension (#name), to use as a client-side image map.
+     */
+    useMap: string;
+    /**
+     * Returns the error message that would be displayed if the user submits the form, or an empty string if no error message. It also triggers the standard error message, such as "this is a required field". The result is that the user sees validation messages without actually submitting.
+     */
+    readonly validationMessage: string;
+    /**
+     * Returns a  ValidityState object that represents the validity states of an element.
+     */
+    readonly validity: ValidityState;
+    /** @deprecated */
+    vspace: number;
+    /**
+     * Sets or retrieves the width of the object.
+     */
+    width: string;
+    /**
+     * Returns whether an element will successfully validate based on forms validation rules and constraints.
+     */
+    readonly willValidate: boolean;
+    /**
+     * Returns whether a form will validate when it is submitted, without having to submit it.
+     */
+    checkValidity(): boolean;
+    getSVGDocument(): Document | null;
+    reportValidity(): boolean;
+    /**
+     * Sets a custom error message that is displayed when a form is submitted.
+     * @param error Sets a custom error message that is displayed when a form is submitted.
+     */
+    setCustomValidity(error: string): void;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLObjectElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLObjectElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods (beyond the regular HTMLElement object interface they also have available to them by inheritance) for manipulating the layout and presentation of <optgroup> elements. */
+export interface HTMLOptGroupElement extends HTMLElement {
+    disabled: boolean;
+    /**
+     * Retrieves a reference to the form that the object is embedded in.
+     */
+    readonly form: HTMLFormElement | null;
+    /**
+     * Sets or retrieves a value that you can use to implement your own label functionality for the object.
+     */
+    label: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLOptGroupElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLOptGroupElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** <option> elements and inherits all classes and methods of the HTMLElement interface. */
+export interface HTMLOptionElement extends HTMLElement {
+    /**
+     * Sets or retrieves the status of an option.
+     */
+    defaultSelected: boolean;
+    disabled: boolean;
+    /**
+     * Retrieves a reference to the form that the object is embedded in.
+     */
+    readonly form: HTMLFormElement | null;
+    /**
+     * Sets or retrieves the ordinal position of an option in a list box.
+     */
+    readonly index: number;
+    /**
+     * Sets or retrieves a value that you can use to implement your own label functionality for the object.
+     */
+    label: string;
+    /**
+     * Sets or retrieves whether the option in the list box is the default item.
+     */
+    selected: boolean;
+    /**
+     * Sets or retrieves the text string specified by the option tag.
+     */
+    text: string;
+    /**
+     * Sets or retrieves the value which is returned to the server when the form control is submitted.
+     */
+    value: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLOptionElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLOptionElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** HTMLOptionsCollection is an interface representing a collection of HTML option elements (in document order) and offers methods and properties for traversing the list as well as optionally altering its items. This type is returned solely by the "options" property of select. */
+export interface HTMLOptionsCollection extends HTMLCollectionOf<HTMLOptionElement> {
+    /**
+     * Returns the number of elements in the collection.
+     * 
+     * When set to a smaller number, truncates the number of option elements in the corresponding container.
+     * 
+     * When set to a greater number, adds new blank option elements to that container.
+     */
+    length: number;
+    /**
+     * Returns the index of the first selected item, if any, or −1 if there is no selected item.
+     * 
+     * Can be set, to change the selection.
+     */
+    selectedIndex: number;
+    /**
+     * Inserts element before the node given by before.
+     * 
+     * The before argument can be a number, in which case element is inserted before the item with that number, or an element from the collection, in which case element is inserted before that element.
+     * 
+     * If before is omitted, null, or a number out of range, then element will be added at the end of the list.
+     * 
+     * This method will throw a "HierarchyRequestError" DOMException if element is an ancestor of the element into which it is to be inserted.
+     */
+    add(element: HTMLOptionElement | HTMLOptGroupElement, before?: HTMLElement | number | null): void;
+    /**
+     * Removes the item with index index from the collection.
+     */
+    remove(index: number): void;
+}
+
+
+export interface HTMLOrSVGElement {
+    autofocus: boolean;
+    readonly dataset: DOMStringMap;
+    nonce?: string;
+    tabIndex: number;
+    blur(): void;
+    focus(options?: FocusOptions): void;
+}
+
+/** Provides properties and methods (beyond those inherited from HTMLElement) for manipulating the layout and presentation of <output> elements. */
+export interface HTMLOutputElement extends HTMLElement {
+    defaultValue: string;
+    readonly form: HTMLFormElement | null;
+    readonly htmlFor: DOMTokenList;
+    readonly labels: NodeListOf<HTMLLabelElement>;
+    name: string;
+    readonly type: string;
+    readonly validationMessage: string;
+    readonly validity: ValidityState;
+    value: string;
+    readonly willValidate: boolean;
+    checkValidity(): boolean;
+    reportValidity(): boolean;
+    setCustomValidity(error: string): void;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLOutputElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLOutputElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond those of the regular HTMLElement object interface it inherits) for manipulating <p> elements. */
+export interface HTMLParagraphElement extends HTMLElement {
+    /**
+     * Sets or retrieves how the object is aligned with adjacent text.
+     */
+    /** @deprecated */
+    align: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLParagraphElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLParagraphElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond those of the regular HTMLElement object interface it inherits) for manipulating <param> elements, representing a pair of a key and a value that acts as a parameter for an <object> element. */
+export interface HTMLParamElement extends HTMLElement {
+    /**
+     * Sets or retrieves the name of an input parameter for an element.
+     */
+    name: string;
+    /**
+     * Sets or retrieves the content type of the resource designated by the value attribute.
+     */
+    /** @deprecated */
+    type: string;
+    /**
+     * Sets or retrieves the value of an input parameter for an element.
+     */
+    value: string;
+    /**
+     * Sets or retrieves the data type of the value attribute.
+     */
+    /** @deprecated */
+    valueType: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLParamElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLParamElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A <picture> HTML element. It doesn't implement specific properties or methods. */
+export interface HTMLPictureElement extends HTMLElement {
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLPictureElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLPictureElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Exposes specific properties and methods (beyond those of the HTMLElement interface it also has available to it by inheritance) for manipulating a block of preformatted text (<pre>). */
+export interface HTMLPreElement extends HTMLElement {
+    /**
+     * Sets or gets a value that you can use to implement your own width functionality for the object.
+     */
+    /** @deprecated */
+    width: number;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLPreElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLPreElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of <progress> elements. */
+export interface HTMLProgressElement extends HTMLElement {
+    readonly labels: NodeListOf<HTMLLabelElement>;
+    /**
+     * Defines the maximum, or "done" value for a progress element.
+     */
+    max: number;
+    /**
+     * Returns the quotient of value/max when the value attribute is set (determinate progress bar), or -1 when the value attribute is missing (indeterminate progress bar).
+     */
+    readonly position: number;
+    /**
+     * Sets or gets the current value of a progress element. The value must be a non-negative number between 0 and the max value.
+     */
+    value: number;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLProgressElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLProgressElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating quoting elements, like <blockquote> and <q>, but not the <cite> element. */
+export interface HTMLQuoteElement extends HTMLElement {
+    /**
+     * Sets or retrieves reference information about the object.
+     */
+    cite: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLQuoteElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLQuoteElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** HTML <script> elements expose the HTMLScriptElement interface, which provides special properties and methods for manipulating the behavior and execution of <script> elements (beyond the inherited HTMLElement interface). */
+export interface HTMLScriptElement extends HTMLElement {
+    async: boolean;
+    /**
+     * Sets or retrieves the character set used to encode the object.
+     */
+    /** @deprecated */
+    charset: string;
+    crossOrigin: string | null;
+    /**
+     * Sets or retrieves the status of the script.
+     */
+    defer: boolean;
+    /**
+     * Sets or retrieves the event for which the script is written.
+     */
+    /** @deprecated */
+    event: string;
+    /**
+     * Sets or retrieves the object that is bound to the event script.
+     */
+    /** @deprecated */
+    htmlFor: string;
+    integrity: string;
+    noModule: boolean;
+    referrerPolicy: string;
+    /**
+     * Retrieves the URL to an external file that contains the source code or data.
+     */
+    src: string;
+    /**
+     * Retrieves or sets the text of the object as a string.
+     */
+    text: string;
+    /**
+     * Sets or retrieves the MIME type for the associated scripting engine.
+     */
+    type: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLScriptElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLScriptElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A <select> HTML Element. These elements also share all of the properties and methods of other HTML elements via the HTMLElement interface. */
+export interface HTMLSelectElement extends HTMLElement {
+    autocomplete: string;
+    disabled: boolean;
+    /**
+     * Retrieves a reference to the form that the object is embedded in.
+     */
+    readonly form: HTMLFormElement | null;
+    readonly labels: NodeListOf<HTMLLabelElement>;
+    /**
+     * Sets or retrieves the number of objects in a collection.
+     */
+    length: number;
+    /**
+     * Sets or retrieves the Boolean value indicating whether multiple items can be selected from a list.
+     */
+    multiple: boolean;
+    /**
+     * Sets or retrieves the name of the object.
+     */
+    name: string;
+    readonly options: HTMLOptionsCollection;
+    /**
+     * When present, marks an element that can't be submitted without a value.
+     */
+    required: boolean;
+    /**
+     * Sets or retrieves the index of the selected option in a select object.
+     */
+    selectedIndex: number;
+    readonly selectedOptions: HTMLCollectionOf<HTMLOptionElement>;
+    /**
+     * Sets or retrieves the number of rows in the list box.
+     */
+    size: number;
+    /**
+     * Retrieves the type of select control based on the value of the MULTIPLE attribute.
+     */
+    readonly type: string;
+    /**
+     * Returns the error message that would be displayed if the user submits the form, or an empty string if no error message. It also triggers the standard error message, such as "this is a required field". The result is that the user sees validation messages without actually submitting.
+     */
+    readonly validationMessage: string;
+    /**
+     * Returns a  ValidityState object that represents the validity states of an element.
+     */
+    readonly validity: ValidityState;
+    /**
+     * Sets or retrieves the value which is returned to the server when the form control is submitted.
+     */
+    value: string;
+    /**
+     * Returns whether an element will successfully validate based on forms validation rules and constraints.
+     */
+    readonly willValidate: boolean;
+    /**
+     * Adds an element to the areas, controlRange, or options collection.
+     * @param element Variant of type Number that specifies the index position in the collection where the element is placed. If no value is given, the method places the element at the end of the collection.
+     * @param before Variant of type Object that specifies an element to insert before, or null to append the object to the collection.
+     */
+    add(element: HTMLOptionElement | HTMLOptGroupElement, before?: HTMLElement | number | null): void;
+    /**
+     * Returns whether a form will validate when it is submitted, without having to submit it.
+     */
+    checkValidity(): boolean;
+    /**
+     * Retrieves a select object or an object from an options collection.
+     * @param name Variant of type Number or String that specifies the object or collection to retrieve. If this parameter is an integer, it is the zero-based index of the object. If this parameter is a string, all objects with matching name or id properties are retrieved, and a collection is returned if more than one match is made.
+     * @param index Variant of type Number that specifies the zero-based index of the object to retrieve when a collection is returned.
+     */
+    item(index: number): Element | null;
+    /**
+     * Retrieves a select object or an object from an options collection.
+     * @param namedItem A String that specifies the name or id property of the object to retrieve. A collection is returned if more than one match is made.
+     */
+    namedItem(name: string): HTMLOptionElement | null;
+    /**
+     * Removes an element from the collection.
+     * @param index Number that specifies the zero-based index of the element to remove from the collection.
+     */
+    remove(): void;
+    remove(index: number): void;
+    reportValidity(): boolean;
+    /**
+     * Sets a custom error message that is displayed when a form is submitted.
+     * @param error Sets a custom error message that is displayed when a form is submitted.
+     */
+    setCustomValidity(error: string): void;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLSelectElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLSelectElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    [name: number]: HTMLOptionElement | HTMLOptGroupElement;
+}
+
+
+export interface HTMLSlotElement extends HTMLElement {
+    name: string;
+    assignedElements(options?: AssignedNodesOptions): Element[];
+    assignedNodes(options?: AssignedNodesOptions): Node[];
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLSlotElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLSlotElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond the regular HTMLElement object interface it also has available to it by inheritance) for manipulating <source> elements. */
+export interface HTMLSourceElement extends HTMLElement {
+    /**
+     * Gets or sets the intended media type of the media source.
+     */
+    media: string;
+    sizes: string;
+    /**
+     * The address or URL of the a media resource that is to be considered.
+     */
+    src: string;
+    srcset: string;
+    /**
+     * Gets or sets the MIME type of a media resource.
+     */
+    type: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLSourceElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLSourceElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A <span> element and derives from the HTMLElement interface, but without implementing any additional properties or methods. */
+export interface HTMLSpanElement extends HTMLElement {
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLSpanElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLSpanElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A <style> element. It inherits properties and methods from its parent, HTMLElement, and from LinkStyle. */
+export interface HTMLStyleElement extends HTMLElement, LinkStyle {
+    /**
+     * Sets or retrieves the media type.
+     */
+    media: string;
+    /**
+     * Retrieves the CSS language in which the style sheet is written.
+     */
+    /** @deprecated */
+    type: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLStyleElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLStyleElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating table caption elements. */
+export interface HTMLTableCaptionElement extends HTMLElement {
+    /**
+     * Sets or retrieves the alignment of the caption or legend.
+     */
+    /** @deprecated */
+    align: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableCaptionElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableCaptionElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of table cells, either header or data cells, in an HTML document. */
+export interface HTMLTableCellElement extends HTMLElement {
+    /**
+     * Sets or retrieves abbreviated text for the object.
+     */
+    abbr: string;
+    /**
+     * Sets or retrieves how the object is aligned with adjacent text.
+     */
+    /** @deprecated */
+    align: string;
+    /**
+     * Sets or retrieves a comma-delimited list of conceptual categories associated with the object.
+     */
+    /** @deprecated */
+    axis: string;
+    /** @deprecated */
+    bgColor: string;
+    /**
+     * Retrieves the position of the object in the cells collection of a row.
+     */
+    readonly cellIndex: number;
+    /** @deprecated */
+    ch: string;
+    /** @deprecated */
+    chOff: string;
+    /**
+     * Sets or retrieves the number columns in the table that the object should span.
+     */
+    colSpan: number;
+    /**
+     * Sets or retrieves a list of header cells that provide information for the object.
+     */
+    headers: string;
+    /**
+     * Sets or retrieves the height of the object.
+     */
+    /** @deprecated */
+    height: string;
+    /**
+     * Sets or retrieves whether the browser automatically performs wordwrap.
+     */
+    /** @deprecated */
+    noWrap: boolean;
+    /**
+     * Sets or retrieves how many rows in a table the cell should span.
+     */
+    rowSpan: number;
+    /**
+     * Sets or retrieves the group of cells in a table to which the object's information applies.
+     */
+    scope: string;
+    /** @deprecated */
+    vAlign: string;
+    /**
+     * Sets or retrieves the width of the object.
+     */
+    /** @deprecated */
+    width: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableCellElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableCellElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond the HTMLElement interface it also has available to it inheritance) for manipulating single or grouped table column elements. */
+export interface HTMLTableColElement extends HTMLElement {
+    /**
+     * Sets or retrieves the alignment of the object relative to the display or table.
+     */
+    /** @deprecated */
+    align: string;
+    /** @deprecated */
+    ch: string;
+    /** @deprecated */
+    chOff: string;
+    /**
+     * Sets or retrieves the number of columns in the group.
+     */
+    span: number;
+    /** @deprecated */
+    vAlign: string;
+    /**
+     * Sets or retrieves the width of the object.
+     */
+    /** @deprecated */
+    width: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableColElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableColElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLTableDataCellElement extends HTMLTableCellElement {
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableDataCellElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableDataCellElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods (beyond the regular HTMLElement object interface it also has available to it by inheritance) for manipulating the layout and presentation of tables in an HTML document. */
+export interface HTMLTableElement extends HTMLElement {
+    /**
+     * Sets or retrieves a value that indicates the table alignment.
+     */
+    /** @deprecated */
+    align: string;
+    /** @deprecated */
+    bgColor: string;
+    /**
+     * Sets or retrieves the width of the border to draw around the object.
+     */
+    /** @deprecated */
+    border: string;
+    /**
+     * Retrieves the caption object of a table.
+     */
+    caption: HTMLTableCaptionElement | null;
+    /**
+     * Sets or retrieves the amount of space between the border of the cell and the content of the cell.
+     */
+    /** @deprecated */
+    cellPadding: string;
+    /**
+     * Sets or retrieves the amount of space between cells in a table.
+     */
+    /** @deprecated */
+    cellSpacing: string;
+    /**
+     * Sets or retrieves the way the border frame around the table is displayed.
+     */
+    /** @deprecated */
+    frame: string;
+    /**
+     * Sets or retrieves the number of horizontal rows contained in the object.
+     */
+    readonly rows: HTMLCollectionOf<HTMLTableRowElement>;
+    /**
+     * Sets or retrieves which dividing lines (inner borders) are displayed.
+     */
+    /** @deprecated */
+    rules: string;
+    /**
+     * Sets or retrieves a description and/or structure of the object.
+     */
+    /** @deprecated */
+    summary: string;
+    /**
+     * Retrieves a collection of all tBody objects in the table. Objects in this collection are in source order.
+     */
+    readonly tBodies: HTMLCollectionOf<HTMLTableSectionElement>;
+    /**
+     * Retrieves the tFoot object of the table.
+     */
+    tFoot: HTMLTableSectionElement | null;
+    /**
+     * Retrieves the tHead object of the table.
+     */
+    tHead: HTMLTableSectionElement | null;
+    /**
+     * Sets or retrieves the width of the object.
+     */
+    /** @deprecated */
+    width: string;
+    /**
+     * Creates an empty caption element in the table.
+     */
+    createCaption(): HTMLTableCaptionElement;
+    /**
+     * Creates an empty tBody element in the table.
+     */
+    createTBody(): HTMLTableSectionElement;
+    /**
+     * Creates an empty tFoot element in the table.
+     */
+    createTFoot(): HTMLTableSectionElement;
+    /**
+     * Returns the tHead element object if successful, or null otherwise.
+     */
+    createTHead(): HTMLTableSectionElement;
+    /**
+     * Deletes the caption element and its contents from the table.
+     */
+    deleteCaption(): void;
+    /**
+     * Removes the specified row (tr) from the element and from the rows collection.
+     * @param index Number that specifies the zero-based position in the rows collection of the row to remove.
+     */
+    deleteRow(index: number): void;
+    /**
+     * Deletes the tFoot element and its contents from the table.
+     */
+    deleteTFoot(): void;
+    /**
+     * Deletes the tHead element and its contents from the table.
+     */
+    deleteTHead(): void;
+    /**
+     * Creates a new row (tr) in the table, and adds the row to the rows collection.
+     * @param index Number that specifies where to insert the row in the rows collection. The default value is -1, which appends the new row to the end of the rows collection.
+     */
+    insertRow(index?: number): HTMLTableRowElement;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLTableHeaderCellElement extends HTMLTableCellElement {
+    scope: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableHeaderCellElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableHeaderCellElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods (beyond the HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of rows in an HTML table. */
+export interface HTMLTableRowElement extends HTMLElement {
+    /**
+     * Sets or retrieves how the object is aligned with adjacent text.
+     */
+    /** @deprecated */
+    align: string;
+    /** @deprecated */
+    bgColor: string;
+    /**
+     * Retrieves a collection of all cells in the table row.
+     */
+    readonly cells: HTMLCollectionOf<HTMLTableDataCellElement | HTMLTableHeaderCellElement>;
+    /** @deprecated */
+    ch: string;
+    /** @deprecated */
+    chOff: string;
+    /**
+     * Retrieves the position of the object in the rows collection for the table.
+     */
+    readonly rowIndex: number;
+    /**
+     * Retrieves the position of the object in the collection.
+     */
+    readonly sectionRowIndex: number;
+    /** @deprecated */
+    vAlign: string;
+    /**
+     * Removes the specified cell from the table row, as well as from the cells collection.
+     * @param index Number that specifies the zero-based position of the cell to remove from the table row. If no value is provided, the last cell in the cells collection is deleted.
+     */
+    deleteCell(index: number): void;
+    /**
+     * Creates a new cell in the table row, and adds the cell to the cells collection.
+     * @param index Number that specifies where to insert the cell in the tr. The default value is -1, which appends the new cell to the end of the cells collection.
+     */
+    insertCell(index?: number): HTMLTableDataCellElement;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableRowElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableRowElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods (beyond the HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of sections, that is headers, footers and bodies, in an HTML table. */
+export interface HTMLTableSectionElement extends HTMLElement {
+    /**
+     * Sets or retrieves a value that indicates the table alignment.
+     */
+    /** @deprecated */
+    align: string;
+    /** @deprecated */
+    ch: string;
+    /** @deprecated */
+    chOff: string;
+    /**
+     * Sets or retrieves the number of horizontal rows contained in the object.
+     */
+    readonly rows: HTMLCollectionOf<HTMLTableRowElement>;
+    /** @deprecated */
+    vAlign: string;
+    /**
+     * Removes the specified row (tr) from the element and from the rows collection.
+     * @param index Number that specifies the zero-based position in the rows collection of the row to remove.
+     */
+    deleteRow(index: number): void;
+    /**
+     * Creates a new row (tr) in the table, and adds the row to the rows collection.
+     * @param index Number that specifies where to insert the row in the rows collection. The default value is -1, which appends the new row to the end of the rows collection.
+     */
+    insertRow(index?: number): HTMLTableRowElement;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableSectionElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTableSectionElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Enables access to the contents of an HTML <template> element. */
+export interface HTMLTemplateElement extends HTMLElement {
+    readonly content: DocumentFragment;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTemplateElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTemplateElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties and methods for manipulating the layout and presentation of <textarea> elements. */
+export interface HTMLTextAreaElement extends HTMLElement {
+    autocomplete: string;
+    /**
+     * Sets or retrieves the width of the object.
+     */
+    cols: number;
+    /**
+     * Sets or retrieves the initial contents of the object.
+     */
+    defaultValue: string;
+    dirName: string;
+    disabled: boolean;
+    /**
+     * Retrieves a reference to the form that the object is embedded in.
+     */
+    readonly form: HTMLFormElement | null;
+    readonly labels: NodeListOf<HTMLLabelElement>;
+    /**
+     * Sets or retrieves the maximum number of characters that the user can enter in a text control.
+     */
+    maxLength: number;
+    minLength: number;
+    /**
+     * Sets or retrieves the name of the object.
+     */
+    name: string;
+    /**
+     * Gets or sets a text string that is displayed in an input field as a hint or prompt to users as the format or type of information they need to enter.The text appears in an input field until the user puts focus on the field.
+     */
+    placeholder: string;
+    /**
+     * Sets or retrieves the value indicated whether the content of the object is read-only.
+     */
+    readOnly: boolean;
+    /**
+     * When present, marks an element that can't be submitted without a value.
+     */
+    required: boolean;
+    /**
+     * Sets or retrieves the number of horizontal rows contained in the object.
+     */
+    rows: number;
+    selectionDirection: "forward" | "backward" | "none";
+    /**
+     * Gets or sets the end position or offset of a text selection.
+     */
+    selectionEnd: number;
+    /**
+     * Gets or sets the starting position or offset of a text selection.
+     */
+    selectionStart: number;
+    readonly textLength: number;
+    /**
+     * Retrieves the type of control.
+     */
+    readonly type: string;
+    /**
+     * Returns the error message that would be displayed if the user submits the form, or an empty string if no error message. It also triggers the standard error message, such as "this is a required field". The result is that the user sees validation messages without actually submitting.
+     */
+    readonly validationMessage: string;
+    /**
+     * Returns a  ValidityState object that represents the validity states of an element.
+     */
+    readonly validity: ValidityState;
+    /**
+     * Retrieves or sets the text in the entry field of the textArea element.
+     */
+    value: string;
+    /**
+     * Returns whether an element will successfully validate based on forms validation rules and constraints.
+     */
+    readonly willValidate: boolean;
+    /**
+     * Sets or retrieves how to handle wordwrapping in the object.
+     */
+    wrap: string;
+    /**
+     * Returns whether a form will validate when it is submitted, without having to submit it.
+     */
+    checkValidity(): boolean;
+    reportValidity(): boolean;
+    /**
+     * Highlights the input area of a form element.
+     */
+    select(): void;
+    /**
+     * Sets a custom error message that is displayed when a form is submitted.
+     * @param error Sets a custom error message that is displayed when a form is submitted.
+     */
+    setCustomValidity(error: string): void;
+    setRangeText(replacement: string): void;
+    setRangeText(replacement: string, start: number, end: number, selectionMode?: SelectionMode): void;
+    /**
+     * Sets the start and end positions of a selection in a text field.
+     * @param start The offset into the text field for the start of the selection.
+     * @param end The offset into the text field for the end of the selection.
+     * @param direction The direction in which the selection is performed.
+     */
+    setSelectionRange(start: number, end: number, direction?: "forward" | "backward" | "none"): void;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTextAreaElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTextAreaElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <time> elements. */
+export interface HTMLTimeElement extends HTMLElement {
+    dateTime: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTimeElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTimeElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Contains the title for a document. This element inherits all of the properties and methods of the HTMLElement interface. */
+export interface HTMLTitleElement extends HTMLElement {
+    /**
+     * Retrieves or sets the text of the object as a string.
+     */
+    text: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTitleElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTitleElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** The HTMLTrackElement */
+export interface HTMLTrackElement extends HTMLElement {
+    default: boolean;
+    kind: string;
+    label: string;
+    readonly readyState: number;
+    src: string;
+    srclang: string;
+    readonly track: TextTrack;
+    readonly ERROR: number;
+    readonly LOADED: number;
+    readonly LOADING: number;
+    readonly NONE: number;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTrackElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLTrackElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides special properties (beyond those defined on the regular HTMLElement interface it also has available to it by inheritance) for manipulating unordered list elements. */
+export interface HTMLUListElement extends HTMLElement {
+    /** @deprecated */
+    compact: boolean;
+    /** @deprecated */
+    type: string;
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLUListElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLUListElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** An invalid HTML element and derives from the HTMLElement interface, but without implementing any additional properties or methods. */
+export interface HTMLUnknownElement extends HTMLElement {
+    addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLUnknownElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLUnknownElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface HTMLVideoElementEventMap extends HTMLMediaElementEventMap {
+    "MSVideoFormatChanged": Event;
+    "MSVideoFrameStepCompleted": Event;
+    "MSVideoOptimalLayoutChanged": Event;
+}
+
+/** Provides special properties and methods for manipulating video objects. It also inherits properties and methods of HTMLMediaElement and HTMLElement. */
+export interface HTMLVideoElement extends HTMLMediaElement {
+    /**
+     * Gets or sets the height of the video element.
+     */
+    height: number;
+    msHorizontalMirror: boolean;
+    readonly msIsLayoutOptimalForPlayback: boolean;
+    readonly msIsStereo3D: boolean;
+    msStereo3DPackingMode: string;
+    msStereo3DRenderMode: string;
+    msZoom: boolean;
+    onMSVideoFormatChanged: ((this: HTMLVideoElement, ev: Event) => any) | null;
+    onMSVideoFrameStepCompleted: ((this: HTMLVideoElement, ev: Event) => any) | null;
+    onMSVideoOptimalLayoutChanged: ((this: HTMLVideoElement, ev: Event) => any) | null;
+    /**
+     * Gets or sets a URL of an image to display, for example, like a movie poster. This can be a still frame from the video, or another image if no video data is available.
+     */
+    poster: string;
+    /**
+     * Gets the intrinsic height of a video in CSS pixels, or zero if the dimensions are not known.
+     */
+    readonly videoHeight: number;
+    /**
+     * Gets the intrinsic width of a video in CSS pixels, or zero if the dimensions are not known.
+     */
+    readonly videoWidth: number;
+    readonly webkitDisplayingFullscreen: boolean;
+    readonly webkitSupportsFullscreen: boolean;
+    /**
+     * Gets or sets the width of the video element.
+     */
+    width: number;
+    getVideoPlaybackQuality(): VideoPlaybackQuality;
+    msFrameStep(forward: boolean): void;
+    msInsertVideoEffect(activatableClassId: string, effectRequired: boolean, config?: any): void;
+    msSetVideoRectangle(left: number, top: number, right: number, bottom: number): void;
+    webkitEnterFullScreen(): void;
+    webkitEnterFullscreen(): void;
+    webkitExitFullScreen(): void;
+    webkitExitFullscreen(): void;
+    addEventListener<K extends keyof HTMLVideoElementEventMap>(type: K, listener: (this: HTMLVideoElement, ev: HTMLVideoElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof HTMLVideoElementEventMap>(type: K, listener: (this: HTMLVideoElement, ev: HTMLVideoElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Events that fire when the fragment identifier of the URL has changed. */
+export interface HashChangeEvent extends Event {
+    /**
+     * Returns the URL of the session history entry that is now current.
+     */
+    readonly newURL: string;
+    /**
+     * Returns the URL of the session history entry that was previously current.
+     */
+    readonly oldURL: string;
+}
+
+
+/** This Fetch API interface allows you to perform various actions on HTTP request and response headers. These actions include retrieving, setting, adding to, and removing. A Headers object has an associated header list, which is initially empty and consists of zero or more name and value pairs.  You can add to this using methods like append() (see Examples.) In all methods of this interface, header names are matched by case-insensitive byte sequence. */
+export interface Headers {
+    append(name: string, value: string): void;
+    delete(name: string): void;
+    get(name: string): string | null;
+    has(name: string): boolean;
+    set(name: string, value: string): void;
+    forEach(callbackfn: (value: string, key: string, parent: Headers) => void, thisArg?: any): void;
+}
+
+
+/** Allows manipulation of the browser session history, that is the pages visited in the tab or frame that the current page is loaded in. */
+export interface History {
+    readonly length: number;
+    scrollRestoration: ScrollRestoration;
+    readonly state: any;
+    back(): void;
+    forward(): void;
+    go(delta?: number): void;
+    pushState(data: any, title: string, url?: string | null): void;
+    replaceState(data: any, title: string, url?: string | null): void;
+}
+
+
+export interface HkdfCtrParams extends Algorithm {
+    context: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer;
+    hash: string | Algorithm;
+    label: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer;
+}
+
+export interface IDBArrayKey extends Array<IDBValidKey> {
+}
+
+/** This IndexedDB API interface represents a cursor for traversing or iterating over multiple records in a database. */
+export interface IDBCursor {
+    /**
+     * Returns the direction ("next", "nextunique", "prev" or "prevunique") of the cursor.
+     */
+    readonly direction: IDBCursorDirection;
+    /**
+     * Returns the key of the cursor. Throws a "InvalidStateError" DOMException if the cursor is advancing or is finished.
+     */
+    readonly key: IDBValidKey;
+    /**
+     * Returns the effective key of the cursor. Throws a "InvalidStateError" DOMException if the cursor is advancing or is finished.
+     */
+    readonly primaryKey: IDBValidKey;
+    /**
+     * Returns the IDBObjectStore or IDBIndex the cursor was opened from.
+     */
+    readonly source: IDBObjectStore | IDBIndex;
+    /**
+     * Advances the cursor through the next count records in range.
+     */
+    advance(count: number): void;
+    /**
+     * Advances the cursor to the next record in range.
+     */
+    continue(key?: IDBValidKey): void;
+    /**
+     * Advances the cursor to the next record in range matching or after key and primaryKey. Throws an "InvalidAccessError" DOMException if the source is not an index.
+     */
+    continuePrimaryKey(key: IDBValidKey, primaryKey: IDBValidKey): void;
+    /**
+     * Delete the record pointed at by the cursor with a new value.
+     * 
+     * If successful, request's result will be undefined.
+     */
+    delete(): IDBRequest<undefined>;
+    /**
+     * Updated the record pointed at by the cursor with a new value.
+     * 
+     * Throws a "DataError" DOMException if the effective object store uses in-line keys and the key would have changed.
+     * 
+     * If successful, request's result will be the record's key.
+     */
+    update(value: any): IDBRequest<IDBValidKey>;
+}
+
+
+/** This IndexedDB API interface represents a cursor for traversing or iterating over multiple records in a database. It is the same as the IDBCursor, except that it includes the value property. */
+export interface IDBCursorWithValue extends IDBCursor {
+    /**
+     * Returns the cursor's current value.
+     */
+    readonly value: any;
+}
+
+
+export interface IDBDatabaseEventMap {
+    "abort": Event;
+    "close": Event;
+    "error": Event;
+    "versionchange": IDBVersionChangeEvent;
+}
+
+/** This IndexedDB API interface provides a connection to a database; you can use an IDBDatabase object to open a transaction on your database then create, manipulate, and delete objects (data) in that database. The interface provides the only way to get and manage versions of the database. */
+export interface IDBDatabase extends EventTarget {
+    /**
+     * Returns the name of the database.
+     */
+    readonly name: string;
+    /**
+     * Returns a list of the names of object stores in the database.
+     */
+    readonly objectStoreNames: DOMStringList;
+    onabort: ((this: IDBDatabase, ev: Event) => any) | null;
+    onclose: ((this: IDBDatabase, ev: Event) => any) | null;
+    onerror: ((this: IDBDatabase, ev: Event) => any) | null;
+    onversionchange: ((this: IDBDatabase, ev: IDBVersionChangeEvent) => any) | null;
+    /**
+     * Returns the version of the database.
+     */
+    readonly version: number;
+    /**
+     * Closes the connection once all running transactions have finished.
+     */
+    close(): void;
+    /**
+     * Creates a new object store with the given name and options and returns a new IDBObjectStore.
+     * 
+     * Throws a "InvalidStateError" DOMException if not called within an upgrade transaction.
+     */
+    createObjectStore(name: string, optionalParameters?: IDBObjectStoreParameters): IDBObjectStore;
+    /**
+     * Deletes the object store with the given name.
+     * 
+     * Throws a "InvalidStateError" DOMException if not called within an upgrade transaction.
+     */
+    deleteObjectStore(name: string): void;
+    /**
+     * Returns a new transaction with the given mode ("readonly" or "readwrite") and scope which can be a single object store name or an array of names.
+     */
+    transaction(storeNames: string | string[], mode?: IDBTransactionMode): IDBTransaction;
+    addEventListener<K extends keyof IDBDatabaseEventMap>(type: K, listener: (this: IDBDatabase, ev: IDBDatabaseEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof IDBDatabaseEventMap>(type: K, listener: (this: IDBDatabase, ev: IDBDatabaseEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** In the following code snippet, we make a request to open a database, and include handlers for the success and error cases. For a full working example, see our To-do Notifications app (view example live.) */
+export interface IDBFactory {
+    /**
+     * Compares two values as keys. Returns -1 if key1 precedes key2, 1 if key2 precedes key1, and 0 if the keys are equal.
+     * 
+     * Throws a "DataError" DOMException if either input is not a valid key.
+     */
+    cmp(first: any, second: any): number;
+    /**
+     * Attempts to delete the named database. If the database already exists and there are open connections that don't close in response to a versionchange event, the request will be blocked until all they close. If the request is successful request's result will be null.
+     */
+    deleteDatabase(name: string): IDBOpenDBRequest;
+    /**
+     * Attempts to open a connection to the named database with the current version, or 1 if it does not already exist. If the request is successful request's result will be the connection.
+     */
+    open(name: string, version?: number): IDBOpenDBRequest;
+}
+
+
+/** IDBIndex interface of the IndexedDB API provides asynchronous access to an index in a database. An index is a kind of object store for looking up records in another object store, called the referenced object store. You use this interface to retrieve data. */
+export interface IDBIndex {
+    readonly keyPath: string | string[];
+    readonly multiEntry: boolean;
+    /**
+     * Returns the name of the index.
+     */
+    name: string;
+    /**
+     * Returns the IDBObjectStore the index belongs to.
+     */
+    readonly objectStore: IDBObjectStore;
+    readonly unique: boolean;
+    /**
+     * Retrieves the number of records matching the given key or key range in query.
+     * 
+     * If successful, request's result will be the count.
+     */
+    count(key?: IDBValidKey | IDBKeyRange): IDBRequest<number>;
+    /**
+     * Retrieves the value of the first record matching the given key or key range in query.
+     * 
+     * If successful, request's result will be the value, or undefined if there was no matching record.
+     */
+    get(key: IDBValidKey | IDBKeyRange): IDBRequest<any | undefined>;
+    /**
+     * Retrieves the values of the records matching the given key or key range in query (up to count if given).
+     * 
+     * If successful, request's result will be an Array of the values.
+     */
+    getAll(query?: IDBValidKey | IDBKeyRange | null, count?: number): IDBRequest<any[]>;
+    /**
+     * Retrieves the keys of records matching the given key or key range in query (up to count if given).
+     * 
+     * If successful, request's result will be an Array of the keys.
+     */
+    getAllKeys(query?: IDBValidKey | IDBKeyRange | null, count?: number): IDBRequest<IDBValidKey[]>;
+    /**
+     * Retrieves the key of the first record matching the given key or key range in query.
+     * 
+     * If successful, request's result will be the key, or undefined if there was no matching record.
+     */
+    getKey(key: IDBValidKey | IDBKeyRange): IDBRequest<IDBValidKey | undefined>;
+    /**
+     * Opens a cursor over the records matching query, ordered by direction. If query is null, all records in index are matched.
+     * 
+     * If successful, request's result will be an IDBCursorWithValue, or null if there were no matching records.
+     */
+    openCursor(query?: IDBValidKey | IDBKeyRange | null, direction?: IDBCursorDirection): IDBRequest<IDBCursorWithValue | null>;
+    /**
+     * Opens a cursor with key only flag set over the records matching query, ordered by direction. If query is null, all records in index are matched.
+     * 
+     * If successful, request's result will be an IDBCursor, or null if there were no matching records.
+     */
+    openKeyCursor(query?: IDBValidKey | IDBKeyRange | null, direction?: IDBCursorDirection): IDBRequest<IDBCursor | null>;
+}
+
+
+/** A key range can be a single value or a range with upper and lower bounds or endpoints. If the key range has both upper and lower bounds, then it is bounded; if it has no bounds, it is unbounded. A bounded key range can either be open (the endpoints are excluded) or closed (the endpoints are included). To retrieve all keys within a certain range, you can use the following code constructs: */
+export interface IDBKeyRange {
+    /**
+     * Returns lower bound, or undefined if none.
+     */
+    readonly lower: any;
+    /**
+     * Returns true if the lower open flag is set, and false otherwise.
+     */
+    readonly lowerOpen: boolean;
+    /**
+     * Returns upper bound, or undefined if none.
+     */
+    readonly upper: any;
+    /**
+     * Returns true if the upper open flag is set, and false otherwise.
+     */
+    readonly upperOpen: boolean;
+    /**
+     * Returns true if key is included in the range, and false otherwise.
+     */
+    includes(key: any): boolean;
+}
+
+
+/** This example shows a variety of different uses of object stores, from updating the data structure with IDBObjectStore.createIndex inside an onupgradeneeded function, to adding a new item to our object store with IDBObjectStore.add. For a full working example, see our To-do Notifications app (view example live.) */
+export interface IDBObjectStore {
+    /**
+     * Returns true if the store has a key generator, and false otherwise.
+     */
+    readonly autoIncrement: boolean;
+    /**
+     * Returns a list of the names of indexes in the store.
+     */
+    readonly indexNames: DOMStringList;
+    /**
+     * Returns the key path of the store, or null if none.
+     */
+    readonly keyPath: string | string[];
+    /**
+     * Returns the name of the store.
+     */
+    name: string;
+    /**
+     * Returns the associated transaction.
+     */
+    readonly transaction: IDBTransaction;
+    /**
+     * Adds or updates a record in store with the given value and key.
+     * 
+     * If the store uses in-line keys and key is specified a "DataError" DOMException will be thrown.
+     * 
+     * If put() is used, any existing record with the key will be replaced. If add() is used, and if a record with the key already exists the request will fail, with request's error set to a "ConstraintError" DOMException.
+     * 
+     * If successful, request's result will be the record's key.
+     */
+    add(value: any, key?: IDBValidKey): IDBRequest<IDBValidKey>;
+    /**
+     * Deletes all records in store.
+     * 
+     * If successful, request's result will be undefined.
+     */
+    clear(): IDBRequest<undefined>;
+    /**
+     * Retrieves the number of records matching the given key or key range in query.
+     * 
+     * If successful, request's result will be the count.
+     */
+    count(key?: IDBValidKey | IDBKeyRange): IDBRequest<number>;
+    /**
+     * Creates a new index in store with the given name, keyPath and options and returns a new IDBIndex. If the keyPath and options define constraints that cannot be satisfied with the data already in store the upgrade transaction will abort with a "ConstraintError" DOMException.
+     * 
+     * Throws an "InvalidStateError" DOMException if not called within an upgrade transaction.
+     */
+    createIndex(name: string, keyPath: string | string[], options?: IDBIndexParameters): IDBIndex;
+    /**
+     * Deletes records in store with the given key or in the given key range in query.
+     * 
+     * If successful, request's result will be undefined.
+     */
+    delete(key: IDBValidKey | IDBKeyRange): IDBRequest<undefined>;
+    /**
+     * Deletes the index in store with the given name.
+     * 
+     * Throws an "InvalidStateError" DOMException if not called within an upgrade transaction.
+     */
+    deleteIndex(name: string): void;
+    /**
+     * Retrieves the value of the first record matching the given key or key range in query.
+     * 
+     * If successful, request's result will be the value, or undefined if there was no matching record.
+     */
+    get(query: IDBValidKey | IDBKeyRange): IDBRequest<any | undefined>;
+    /**
+     * Retrieves the values of the records matching the given key or key range in query (up to count if given).
+     * 
+     * If successful, request's result will be an Array of the values.
+     */
+    getAll(query?: IDBValidKey | IDBKeyRange | null, count?: number): IDBRequest<any[]>;
+    /**
+     * Retrieves the keys of records matching the given key or key range in query (up to count if given).
+     * 
+     * If successful, request's result will be an Array of the keys.
+     */
+    getAllKeys(query?: IDBValidKey | IDBKeyRange | null, count?: number): IDBRequest<IDBValidKey[]>;
+    /**
+     * Retrieves the key of the first record matching the given key or key range in query.
+     * 
+     * If successful, request's result will be the key, or undefined if there was no matching record.
+     */
+    getKey(query: IDBValidKey | IDBKeyRange): IDBRequest<IDBValidKey | undefined>;
+    index(name: string): IDBIndex;
+    /**
+     * Opens a cursor over the records matching query, ordered by direction. If query is null, all records in store are matched.
+     * 
+     * If successful, request's result will be an IDBCursorWithValue pointing at the first matching record, or null if there were no matching records.
+     */
+    openCursor(query?: IDBValidKey | IDBKeyRange | null, direction?: IDBCursorDirection): IDBRequest<IDBCursorWithValue | null>;
+    /**
+     * Opens a cursor with key only flag set over the records matching query, ordered by direction. If query is null, all records in store are matched.
+     * 
+     * If successful, request's result will be an IDBCursor pointing at the first matching record, or null if there were no matching records.
+     */
+    openKeyCursor(query?: IDBValidKey | IDBKeyRange | null, direction?: IDBCursorDirection): IDBRequest<IDBCursor | null>;
+    /**
+     * Adds or updates a record in store with the given value and key.
+     * 
+     * If the store uses in-line keys and key is specified a "DataError" DOMException will be thrown.
+     * 
+     * If put() is used, any existing record with the key will be replaced. If add() is used, and if a record with the key already exists the request will fail, with request's error set to a "ConstraintError" DOMException.
+     * 
+     * If successful, request's result will be the record's key.
+     */
+    put(value: any, key?: IDBValidKey): IDBRequest<IDBValidKey>;
+}
+
+
+export interface IDBOpenDBRequestEventMap extends IDBRequestEventMap {
+    "blocked": Event;
+    "upgradeneeded": IDBVersionChangeEvent;
+}
+
+/** Also inherits methods from its parents IDBRequest and EventTarget. */
+export interface IDBOpenDBRequest extends IDBRequest<IDBDatabase> {
+    onblocked: ((this: IDBOpenDBRequest, ev: Event) => any) | null;
+    onupgradeneeded: ((this: IDBOpenDBRequest, ev: IDBVersionChangeEvent) => any) | null;
+    addEventListener<K extends keyof IDBOpenDBRequestEventMap>(type: K, listener: (this: IDBOpenDBRequest, ev: IDBOpenDBRequestEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof IDBOpenDBRequestEventMap>(type: K, listener: (this: IDBOpenDBRequest, ev: IDBOpenDBRequestEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface IDBRequestEventMap {
+    "error": Event;
+    "success": Event;
+}
+
+/** The request object does not initially contain any information about the result of the operation, but once information becomes available, an event is fired on the request, and the information becomes available through the properties of the IDBRequest instance. */
+export interface IDBRequest<T = any> extends EventTarget {
+    /**
+     * When a request is completed, returns the error (a DOMException), or null if the request succeeded. Throws a "InvalidStateError" DOMException if the request is still pending.
+     */
+    readonly error: DOMException | null;
+    onerror: ((this: IDBRequest<T>, ev: Event) => any) | null;
+    onsuccess: ((this: IDBRequest<T>, ev: Event) => any) | null;
+    /**
+     * Returns "pending" until a request is complete, then returns "done".
+     */
+    readonly readyState: IDBRequestReadyState;
+    /**
+     * When a request is completed, returns the result, or undefined if the request failed. Throws a "InvalidStateError" DOMException if the request is still pending.
+     */
+    readonly result: T;
+    /**
+     * Returns the IDBObjectStore, IDBIndex, or IDBCursor the request was made against, or null if is was an open request.
+     */
+    readonly source: IDBObjectStore | IDBIndex | IDBCursor;
+    /**
+     * Returns the IDBTransaction the request was made within. If this as an open request, then it returns an upgrade transaction while it is running, or null otherwise.
+     */
+    readonly transaction: IDBTransaction | null;
+    addEventListener<K extends keyof IDBRequestEventMap>(type: K, listener: (this: IDBRequest<T>, ev: IDBRequestEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof IDBRequestEventMap>(type: K, listener: (this: IDBRequest<T>, ev: IDBRequestEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface IDBTransactionEventMap {
+    "abort": Event;
+    "complete": Event;
+    "error": Event;
+}
+
+export interface IDBTransaction extends EventTarget {
+    /**
+     * Returns the transaction's connection.
+     */
+    readonly db: IDBDatabase;
+    /**
+     * If the transaction was aborted, returns the error (a DOMException) providing the reason.
+     */
+    readonly error: DOMException;
+    /**
+     * Returns the mode the transaction was created with ("readonly" or "readwrite"), or "versionchange" for an upgrade transaction.
+     */
+    readonly mode: IDBTransactionMode;
+    /**
+     * Returns a list of the names of object stores in the transaction's scope. For an upgrade transaction this is all object stores in the database.
+     */
+    readonly objectStoreNames: DOMStringList;
+    onabort: ((this: IDBTransaction, ev: Event) => any) | null;
+    oncomplete: ((this: IDBTransaction, ev: Event) => any) | null;
+    onerror: ((this: IDBTransaction, ev: Event) => any) | null;
+    /**
+     * Aborts the transaction. All pending requests will fail with a "AbortError" DOMException and all changes made to the database will be reverted.
+     */
+    abort(): void;
+    /**
+     * Returns an IDBObjectStore in the transaction's scope.
+     */
+    objectStore(name: string): IDBObjectStore;
+    addEventListener<K extends keyof IDBTransactionEventMap>(type: K, listener: (this: IDBTransaction, ev: IDBTransactionEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof IDBTransactionEventMap>(type: K, listener: (this: IDBTransaction, ev: IDBTransactionEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** This IndexedDB API interface indicates that the version of the database has changed, as the result of an IDBOpenDBRequest.onupgradeneeded event handler function. */
+export interface IDBVersionChangeEvent extends Event {
+    readonly newVersion: number | null;
+    readonly oldVersion: number;
+}
+
+
+/** The IIRFilterNode interface of the Web Audio API is a AudioNode processor which implements a general infinite impulse response (IIR)  filter; this type of filter can be used to implement tone control devices and graphic equalizers as well. It lets the parameters of the filter response be specified, so that it can be tuned as needed. */
+export interface IIRFilterNode extends AudioNode {
+    getFrequencyResponse(frequencyHz: Float32Array, magResponse: Float32Array, phaseResponse: Float32Array): void;
+}
+
+
+export interface ImageBitmap {
+    /**
+     * Returns the intrinsic height of the image, in CSS pixels.
+     */
+    readonly height: number;
+    /**
+     * Returns the intrinsic width of the image, in CSS pixels.
+     */
+    readonly width: number;
+    /**
+     * Releases imageBitmap's underlying bitmap data.
+     */
+    close(): void;
+}
+
+
+export interface ImageBitmapOptions {
+    colorSpaceConversion?: "none" | "default";
+    imageOrientation?: "none" | "flipY";
+    premultiplyAlpha?: "none" | "premultiply" | "default";
+    resizeHeight?: number;
+    resizeQuality?: "pixelated" | "low" | "medium" | "high";
+    resizeWidth?: number;
+}
+
+export interface ImageBitmapRenderingContext {
+    /**
+     * Returns the canvas element that the context is bound to.
+     */
+    readonly canvas: HTMLCanvasElement | OffscreenCanvas;
+    /**
+     * Transfers the underlying bitmap data from imageBitmap to context, and the bitmap becomes the contents of the canvas element to which context is bound.
+     */
+    transferFromImageBitmap(bitmap: ImageBitmap | null): void;
+}
+
+
+/** The underlying pixel data of an area of a <canvas> element. It is created using the ImageData() constructor or creator methods on the CanvasRenderingContext2D object associated with a canvas: createImageData() and getImageData(). It can also be used to set a part of the canvas by using putImageData(). */
+export interface ImageData {
+    /**
+     * Returns the one-dimensional array containing the data in RGBA order, as integers in the range 0 to 255.
+     */
+    readonly data: Uint8ClampedArray;
+    /**
+     * Returns the actual dimensions of the data in the ImageData object, in pixels.
+     */
+    readonly height: number;
+    /**
+     * Returns the actual dimensions of the data in the ImageData object, in pixels.
+     */
+    readonly width: number;
+}
+
+
+export interface InnerHTML {
+    innerHTML: string;
+}
+
+export interface InputDeviceInfo extends MediaDeviceInfo {
+    getCapabilities(): MediaTrackCapabilities;
+}
+
+
+export interface InputEvent extends UIEvent {
+    readonly data: string | null;
+    readonly inputType: string;
+    readonly isComposing: boolean;
+}
+
+
+/** provides a way to asynchronously observe changes in the intersection of a target element with an ancestor element or with a top-level document's viewport. */
+export interface IntersectionObserver {
+    readonly root: Element | null;
+    readonly rootMargin: string;
+    readonly thresholds: ReadonlyArray<number>;
+    disconnect(): void;
+    observe(target: Element): void;
+    takeRecords(): IntersectionObserverEntry[];
+    unobserve(target: Element): void;
+}
+
+
+/** This Intersection Observer API interface describes the intersection between the target element and its root container at a specific moment of transition. */
+export interface IntersectionObserverEntry {
+    readonly boundingClientRect: DOMRectReadOnly;
+    readonly intersectionRatio: number;
+    readonly intersectionRect: DOMRectReadOnly;
+    readonly isIntersecting: boolean;
+    readonly rootBounds: DOMRectReadOnly | null;
+    readonly target: Element;
+    readonly time: number;
+}
+
+
+/** KeyboardEvent objects describe a user interaction with the keyboard; each event describes a single interaction between the user and a key (or combination of a key with modifier keys) on the keyboard. */
+export interface KeyboardEvent extends UIEvent {
+    readonly altKey: boolean;
+    /** @deprecated */
+    char: string;
+    /** @deprecated */
+    readonly charCode: number;
+    readonly code: string;
+    readonly ctrlKey: boolean;
+    readonly isComposing: boolean;
+    readonly key: string;
+    /** @deprecated */
+    readonly keyCode: number;
+    readonly location: number;
+    readonly metaKey: boolean;
+    readonly repeat: boolean;
+    readonly shiftKey: boolean;
+    getModifierState(keyArg: string): boolean;
+    readonly DOM_KEY_LOCATION_LEFT: number;
+    readonly DOM_KEY_LOCATION_NUMPAD: number;
+    readonly DOM_KEY_LOCATION_RIGHT: number;
+    readonly DOM_KEY_LOCATION_STANDARD: number;
+}
+
+
+export interface KeyframeEffect extends AnimationEffect {
+    composite: CompositeOperation;
+    iterationComposite: IterationCompositeOperation;
+    target: Element | null;
+    getKeyframes(): ComputedKeyframe[];
+    setKeyframes(keyframes: Keyframe[] | PropertyIndexedKeyframes | null): void;
+}
+
+
+export interface LinkStyle {
+    readonly sheet: StyleSheet | null;
+}
+
+export interface ListeningStateChangedEvent extends Event {
+    readonly label: string;
+    readonly state: ListeningState;
+}
+
+
+/** The location (URL) of the object it is linked to. Changes done on it are reflected on the object it relates to. Both the Document and Window interface have such a linked Location, accessible via Document.location and Window.location respectively. */
+export interface Location {
+    /**
+     * Returns a DOMStringList object listing the origins of the ancestor browsing contexts, from the parent browsing context to the top-level browsing context.
+     */
+    readonly ancestorOrigins: DOMStringList;
+    /**
+     * Returns the Location object's URL's fragment (includes leading "#" if non-empty).
+     * 
+     * Can be set, to navigate to the same URL with a changed fragment (ignores leading "#").
+     */
+    hash: string;
+    /**
+     * Returns the Location object's URL's host and port (if different from the default port for the scheme).
+     * 
+     * Can be set, to navigate to the same URL with a changed host and port.
+     */
+    host: string;
+    /**
+     * Returns the Location object's URL's host.
+     * 
+     * Can be set, to navigate to the same URL with a changed host.
+     */
+    hostname: string;
+    /**
+     * Returns the Location object's URL.
+     * 
+     * Can be set, to navigate to the given URL.
+     */
+    href: string;
+    toString(): string;
+    /**
+     * Returns the Location object's URL's origin.
+     */
+    readonly origin: string;
+    /**
+     * Returns the Location object's URL's path.
+     * 
+     * Can be set, to navigate to the same URL with a changed path.
+     */
+    pathname: string;
+    /**
+     * Returns the Location object's URL's port.
+     * 
+     * Can be set, to navigate to the same URL with a changed port.
+     */
+    port: string;
+    /**
+     * Returns the Location object's URL's scheme.
+     * 
+     * Can be set, to navigate to the same URL with a changed scheme.
+     */
+    protocol: string;
+    /**
+     * Returns the Location object's URL's query (includes leading "?" if non-empty).
+     * 
+     * Can be set, to navigate to the same URL with a changed query (ignores leading "?").
+     */
+    search: string;
+    /**
+     * Navigates to the given URL.
+     */
+    assign(url: string): void;
+    /**
+     * Reloads the current page.
+     */
+    reload(): void;
+    /** @deprecated */
+    reload(forcedReload: boolean): void;
+    /**
+     * Removes the current page from the session history and navigates to the given URL.
+     */
+    replace(url: string): void;
+}
+
+
+export interface MSAssertion {
+    readonly id: string;
+    readonly type: MSCredentialType;
+}
+
+
+export interface MSBlobBuilder {
+    append(data: any, endings?: string): void;
+    getBlob(contentType?: string): Blob;
+}
+
+
+export interface MSFIDOCredentialAssertion extends MSAssertion {
+    readonly algorithm: string | Algorithm;
+    readonly attestation: any;
+    readonly publicKey: string;
+    readonly transportHints: MSTransportType[];
+}
+
+
+export interface MSFIDOSignature {
+    readonly authnrData: string;
+    readonly clientData: string;
+    readonly signature: string;
+}
+
+
+export interface MSFIDOSignatureAssertion extends MSAssertion {
+    readonly signature: MSFIDOSignature;
+}
+
+
+export interface MSFileSaver {
+    msSaveBlob(blob: any, defaultName?: string): boolean;
+    msSaveOrOpenBlob(blob: any, defaultName?: string): boolean;
+}
+
+export interface MSGesture {
+    target: Element;
+    addPointer(pointerId: number): void;
+    stop(): void;
+}
+
+
+/** The MSGestureEvent is a proprietary interface specific to Internet Explorer and Microsoft Edge which represents events that occur due to touch gestures. Events using this interface include MSGestureStart, MSGestureEnd, MSGestureTap, MSGestureHold, MSGestureChange, and MSInertiaStart. */
+export interface MSGestureEvent extends UIEvent {
+    readonly clientX: number;
+    readonly clientY: number;
+    readonly expansion: number;
+    readonly gestureObject: any;
+    readonly hwTimestamp: number;
+    readonly offsetX: number;
+    readonly offsetY: number;
+    readonly rotation: number;
+    readonly scale: number;
+    readonly screenX: number;
+    readonly screenY: number;
+    readonly translationX: number;
+    readonly translationY: number;
+    readonly velocityAngular: number;
+    readonly velocityExpansion: number;
+    readonly velocityX: number;
+    readonly velocityY: number;
+    initGestureEvent(typeArg: string, canBubbleArg: boolean, cancelableArg: boolean, viewArg: Window, detailArg: number, screenXArg: number, screenYArg: number, clientXArg: number, clientYArg: number, offsetXArg: number, offsetYArg: number, translationXArg: number, translationYArg: number, scaleArg: number, expansionArg: number, rotationArg: number, velocityXArg: number, velocityYArg: number, velocityExpansionArg: number, velocityAngularArg: number, hwTimestampArg: number): void;
+    readonly MSGESTURE_FLAG_BEGIN: number;
+    readonly MSGESTURE_FLAG_CANCEL: number;
+    readonly MSGESTURE_FLAG_END: number;
+    readonly MSGESTURE_FLAG_INERTIA: number;
+    readonly MSGESTURE_FLAG_NONE: number;
+}
+
+
+/** The msGraphicsTrust() constructor returns an object that provides properties for info on protected video playback. */
+export interface MSGraphicsTrust {
+    readonly constrictionActive: boolean;
+    readonly status: string;
+}
+
+
+export interface MSInputMethodContextEventMap {
+    "MSCandidateWindowHide": Event;
+    "MSCandidateWindowShow": Event;
+    "MSCandidateWindowUpdate": Event;
+}
+
+export interface MSInputMethodContext extends EventTarget {
+    readonly compositionEndOffset: number;
+    readonly compositionStartOffset: number;
+    oncandidatewindowhide: ((this: MSInputMethodContext, ev: Event) => any) | null;
+    oncandidatewindowshow: ((this: MSInputMethodContext, ev: Event) => any) | null;
+    oncandidatewindowupdate: ((this: MSInputMethodContext, ev: Event) => any) | null;
+    readonly target: HTMLElement;
+    getCandidateWindowClientRect(): ClientRect;
+    getCompositionAlternatives(): string[];
+    hasComposition(): boolean;
+    isCandidateWindowVisible(): boolean;
+    addEventListener<K extends keyof MSInputMethodContextEventMap>(type: K, listener: (this: MSInputMethodContext, ev: MSInputMethodContextEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof MSInputMethodContextEventMap>(type: K, listener: (this: MSInputMethodContext, ev: MSInputMethodContextEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface MSMediaKeyError {
+    readonly code: number;
+    readonly systemCode: number;
+    readonly MS_MEDIA_KEYERR_CLIENT: number;
+    readonly MS_MEDIA_KEYERR_DOMAIN: number;
+    readonly MS_MEDIA_KEYERR_HARDWARECHANGE: number;
+    readonly MS_MEDIA_KEYERR_OUTPUT: number;
+    readonly MS_MEDIA_KEYERR_SERVICE: number;
+    readonly MS_MEDIA_KEYERR_UNKNOWN: number;
+}
+
+
+export interface MSMediaKeyMessageEvent extends Event {
+    readonly destinationURL: string | null;
+    readonly message: Uint8Array;
+}
+
+
+export interface MSMediaKeyNeededEvent extends Event {
+    readonly initData: Uint8Array | null;
+}
+
+
+export interface MSMediaKeySession extends EventTarget {
+    readonly error: MSMediaKeyError | null;
+    readonly keySystem: string;
+    readonly sessionId: string;
+    close(): void;
+    update(key: Uint8Array): void;
+}
+
+
+export interface MSMediaKeys {
+    readonly keySystem: string;
+    createSession(type: string, initData: Uint8Array, cdmData?: Uint8Array | null): MSMediaKeySession;
+}
+
+
+export interface MSNavigatorDoNotTrack {
+    confirmSiteSpecificTrackingException(args: ConfirmSiteSpecificExceptionsInformation): boolean;
+    confirmWebWideTrackingException(args: ExceptionInformation): boolean;
+    removeSiteSpecificTrackingException(args: ExceptionInformation): void;
+    removeWebWideTrackingException(args: ExceptionInformation): void;
+    storeSiteSpecificTrackingException(args: StoreSiteSpecificExceptionsInformation): void;
+    storeWebWideTrackingException(args: StoreExceptionsInformation): void;
+}
+
+export interface MSPointerEvent extends MouseEvent {
+    readonly currentPoint: any;
+    readonly height: number;
+    readonly hwTimestamp: number;
+    readonly intermediatePoints: any;
+    readonly isPrimary: boolean;
+    readonly pointerId: number;
+    readonly pointerType: any;
+    readonly pressure: number;
+    readonly rotation: number;
+    readonly tiltX: number;
+    readonly tiltY: number;
+    readonly width: number;
+    getCurrentPoint(element: Element): void;
+    getIntermediatePoints(element: Element): void;
+    initPointerEvent(typeArg: string, canBubbleArg: boolean, cancelableArg: boolean, viewArg: Window, detailArg: number, screenXArg: number, screenYArg: number, clientXArg: number, clientYArg: number, ctrlKeyArg: boolean, altKeyArg: boolean, shiftKeyArg: boolean, metaKeyArg: boolean, buttonArg: number, relatedTargetArg: EventTarget, offsetXArg: number, offsetYArg: number, widthArg: number, heightArg: number, pressure: number, rotation: number, tiltX: number, tiltY: number, pointerIdArg: number, pointerType: any, hwTimestampArg: number, isPrimary: boolean): void;
+}
+
+
+export interface MSStream {
+    readonly type: string;
+    msClose(): void;
+    msDetachStream(): any;
+}
+
+
+/** The MediaDevicesInfo interface contains information that describes a single media input or output device. */
+export interface MediaDeviceInfo {
+    readonly deviceId: string;
+    readonly groupId: string;
+    readonly kind: MediaDeviceKind;
+    readonly label: string;
+    toJSON(): any;
+}
+
+
+export interface MediaDevicesEventMap {
+    "devicechange": Event;
+}
+
+/** Provides access to connected media input devices like cameras and microphones, as well as screen sharing. In essence, it lets you obtain access to any hardware source of media data. */
+export interface MediaDevices extends EventTarget {
+    ondevicechange: ((this: MediaDevices, ev: Event) => any) | null;
+    enumerateDevices(): Promise<MediaDeviceInfo[]>;
+    getSupportedConstraints(): MediaTrackSupportedConstraints;
+    getUserMedia(constraints?: MediaStreamConstraints): Promise<MediaStream>;
+    addEventListener<K extends keyof MediaDevicesEventMap>(type: K, listener: (this: MediaDevices, ev: MediaDevicesEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof MediaDevicesEventMap>(type: K, listener: (this: MediaDevices, ev: MediaDevicesEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A MediaElementSourceNode has no inputs and exactly one output, and is created using the AudioContext.createMediaElementSource method. The amount of channels in the output equals the number of channels of the audio referenced by the HTMLMediaElement used in the creation of the node, or is 1 if the HTMLMediaElement has no audio. */
+export interface MediaElementAudioSourceNode extends AudioNode {
+    readonly mediaElement: HTMLMediaElement;
+}
+
+
+export interface MediaEncryptedEvent extends Event {
+    readonly initData: ArrayBuffer | null;
+    readonly initDataType: string;
+}
+
+
+/** An error which occurred while handling media in an HTML media element based on HTMLMediaElement, such as <audio> or <video>. */
+export interface MediaError {
+    readonly code: number;
+    readonly message: string;
+    readonly msExtendedCode: number;
+    readonly MEDIA_ERR_ABORTED: number;
+    readonly MEDIA_ERR_DECODE: number;
+    readonly MEDIA_ERR_NETWORK: number;
+    readonly MEDIA_ERR_SRC_NOT_SUPPORTED: number;
+    readonly MS_MEDIA_ERR_ENCRYPTED: number;
+}
+
+
+/** This EncryptedMediaExtensions API interface contains the content and related data when the content decryption module generates a message for the session. */
+export interface MediaKeyMessageEvent extends Event {
+    readonly message: ArrayBuffer;
+    readonly messageType: MediaKeyMessageType;
+}
+
+
+export interface MediaKeySessionEventMap {
+    "keystatuseschange": Event;
+    "message": MediaKeyMessageEvent;
+}
+
+/** This EncryptedMediaExtensions API interface represents a context for message exchange with a content decryption module (CDM). */
+export interface MediaKeySession extends EventTarget {
+    readonly closed: Promise<void>;
+    readonly expiration: number;
+    readonly keyStatuses: MediaKeyStatusMap;
+    onkeystatuseschange: ((this: MediaKeySession, ev: Event) => any) | null;
+    onmessage: ((this: MediaKeySession, ev: MediaKeyMessageEvent) => any) | null;
+    readonly sessionId: string;
+    close(): Promise<void>;
+    generateRequest(initDataType: string, initData: BufferSource): Promise<void>;
+    load(sessionId: string): Promise<boolean>;
+    remove(): Promise<void>;
+    update(response: BufferSource): Promise<void>;
+    addEventListener<K extends keyof MediaKeySessionEventMap>(type: K, listener: (this: MediaKeySession, ev: MediaKeySessionEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof MediaKeySessionEventMap>(type: K, listener: (this: MediaKeySession, ev: MediaKeySessionEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** This EncryptedMediaExtensions API interface is a read-only map of media key statuses by key IDs. */
+export interface MediaKeyStatusMap {
+    readonly size: number;
+    get(keyId: BufferSource): MediaKeyStatus | undefined;
+    has(keyId: BufferSource): boolean;
+    forEach(callbackfn: (value: MediaKeyStatus, key: BufferSource, parent: MediaKeyStatusMap) => void, thisArg?: any): void;
+}
+
+
+/** This EncryptedMediaExtensions API interface provides access to a Key System for decryption and/or a content protection provider. You can request an instance of this object using the Navigator.requestMediaKeySystemAccess method. */
+export interface MediaKeySystemAccess {
+    readonly keySystem: string;
+    createMediaKeys(): Promise<MediaKeys>;
+    getConfiguration(): MediaKeySystemConfiguration;
+}
+
+
+/** This EncryptedMediaExtensions API interface the represents a set of keys that an associated HTMLMediaElement can use for decryption of media data during playback. */
+export interface MediaKeys {
+    createSession(sessionType?: MediaKeySessionType): MediaKeySession;
+    setServerCertificate(serverCertificate: BufferSource): Promise<boolean>;
+}
+
+
+export interface MediaList {
+    readonly length: number;
+    mediaText: string;
+    toString(): string;
+    appendMedium(medium: string): void;
+    deleteMedium(medium: string): void;
+    item(index: number): string | null;
+    [index: number]: string;
+}
+
+
+export interface MediaQueryListEventMap {
+    "change": MediaQueryListEvent;
+}
+
+/** Stores information on a media query applied to a document, and handles sending notifications to listeners when the media query state change (i.e. when the media query test starts or stops evaluating to true). */
+export interface MediaQueryList extends EventTarget {
+    readonly matches: boolean;
+    readonly media: string;
+    onchange: ((this: MediaQueryList, ev: MediaQueryListEvent) => any) | null;
+    /** @deprecated */
+    addListener(listener: ((this: MediaQueryList, ev: MediaQueryListEvent) => any) | null): void;
+    /** @deprecated */
+    removeListener(listener: ((this: MediaQueryList, ev: MediaQueryListEvent) => any) | null): void;
+    addEventListener<K extends keyof MediaQueryListEventMap>(type: K, listener: (this: MediaQueryList, ev: MediaQueryListEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof MediaQueryListEventMap>(type: K, listener: (this: MediaQueryList, ev: MediaQueryListEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface MediaQueryListEvent extends Event {
+    readonly matches: boolean;
+    readonly media: string;
+}
+
+
+export interface MediaSourceEventMap {
+    "sourceclose": Event;
+    "sourceended": Event;
+    "sourceopen": Event;
+}
+
+/** This Media Source Extensions API interface represents a source of media data for an HTMLMediaElement object. A MediaSource object can be attached to a HTMLMediaElement to be played in the user agent. */
+export interface MediaSource extends EventTarget {
+    readonly activeSourceBuffers: SourceBufferList;
+    duration: number;
+    onsourceclose: ((this: MediaSource, ev: Event) => any) | null;
+    onsourceended: ((this: MediaSource, ev: Event) => any) | null;
+    onsourceopen: ((this: MediaSource, ev: Event) => any) | null;
+    readonly readyState: ReadyState;
+    readonly sourceBuffers: SourceBufferList;
+    addSourceBuffer(type: string): SourceBuffer;
+    clearLiveSeekableRange(): void;
+    endOfStream(error?: EndOfStreamError): void;
+    removeSourceBuffer(sourceBuffer: SourceBuffer): void;
+    setLiveSeekableRange(start: number, end: number): void;
+    addEventListener<K extends keyof MediaSourceEventMap>(type: K, listener: (this: MediaSource, ev: MediaSourceEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof MediaSourceEventMap>(type: K, listener: (this: MediaSource, ev: MediaSourceEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface MediaStreamEventMap {
+    "addtrack": MediaStreamTrackEvent;
+    "removetrack": MediaStreamTrackEvent;
+}
+
+/** A stream of media content. A stream consists of several tracks such as video or audio tracks. Each track is specified as an instance of MediaStreamTrack. */
+export interface MediaStream extends EventTarget {
+    readonly active: boolean;
+    readonly id: string;
+    onaddtrack: ((this: MediaStream, ev: MediaStreamTrackEvent) => any) | null;
+    onremovetrack: ((this: MediaStream, ev: MediaStreamTrackEvent) => any) | null;
+    addTrack(track: MediaStreamTrack): void;
+    clone(): MediaStream;
+    getAudioTracks(): MediaStreamTrack[];
+    getTrackById(trackId: string): MediaStreamTrack | null;
+    getTracks(): MediaStreamTrack[];
+    getVideoTracks(): MediaStreamTrack[];
+    removeTrack(track: MediaStreamTrack): void;
+    addEventListener<K extends keyof MediaStreamEventMap>(type: K, listener: (this: MediaStream, ev: MediaStreamEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof MediaStreamEventMap>(type: K, listener: (this: MediaStream, ev: MediaStreamEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface MediaStreamAudioDestinationNode extends AudioNode {
+    readonly stream: MediaStream;
+}
+
+
+/** A type of AudioNode which operates as an audio source whose media is received from a MediaStream obtained using the WebRTC or Media Capture and Streams APIs. */
+export interface MediaStreamAudioSourceNode extends AudioNode {
+    readonly mediaStream: MediaStream;
+}
+
+
+export interface MediaStreamError {
+    readonly constraintName: string | null;
+    readonly message: string | null;
+    readonly name: string;
+}
+
+
+export interface MediaStreamErrorEvent extends Event {
+    readonly error: MediaStreamError | null;
+}
+
+
+/** Events that occurs in relation to a MediaStream. Two events of this type can be thrown: addstream and removestream. */
+export interface MediaStreamEvent extends Event {
+    readonly stream: MediaStream | null;
+}
+
+
+export interface MediaStreamTrackEventMap {
+    "ended": Event;
+    "isolationchange": Event;
+    "mute": Event;
+    "unmute": Event;
+}
+
+/** A single media track within a stream; typically, these are audio or video tracks, but other track types may exist as well. */
+export interface MediaStreamTrack extends EventTarget {
+    enabled: boolean;
+    readonly id: string;
+    readonly isolated: boolean;
+    readonly kind: string;
+    readonly label: string;
+    readonly muted: boolean;
+    onended: ((this: MediaStreamTrack, ev: Event) => any) | null;
+    onisolationchange: ((this: MediaStreamTrack, ev: Event) => any) | null;
+    onmute: ((this: MediaStreamTrack, ev: Event) => any) | null;
+    onunmute: ((this: MediaStreamTrack, ev: Event) => any) | null;
+    readonly readyState: MediaStreamTrackState;
+    applyConstraints(constraints?: MediaTrackConstraints): Promise<void>;
+    clone(): MediaStreamTrack;
+    getCapabilities(): MediaTrackCapabilities;
+    getConstraints(): MediaTrackConstraints;
+    getSettings(): MediaTrackSettings;
+    stop(): void;
+    addEventListener<K extends keyof MediaStreamTrackEventMap>(type: K, listener: (this: MediaStreamTrack, ev: MediaStreamTrackEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof MediaStreamTrackEventMap>(type: K, listener: (this: MediaStreamTrack, ev: MediaStreamTrackEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface MediaStreamTrackAudioSourceNode extends AudioNode {
+}
+
+
+/** Events which indicate that a MediaStream has had tracks added to or removed from the stream through calls to Media Stream API methods. These events are sent to the stream when these changes occur. */
+export interface MediaStreamTrackEvent extends Event {
+    readonly track: MediaStreamTrack;
+}
+
+
+/** This Channel Messaging API interface allows us to create a new message channel and send data through it via its two MessagePort properties. */
+export interface MessageChannel {
+    /**
+     * Returns the first MessagePort object.
+     */
+    readonly port1: MessagePort;
+    /**
+     * Returns the second MessagePort object.
+     */
+    readonly port2: MessagePort;
+}
+
+
+/** A message received by a target object. */
+export interface MessageEvent extends Event {
+    /**
+     * Returns the data of the message.
+     */
+    readonly data: any;
+    /**
+     * Returns the last event ID string, for server-sent events.
+     */
+    readonly lastEventId: string;
+    /**
+     * Returns the origin of the message, for server-sent events and cross-document messaging.
+     */
+    readonly origin: string;
+    /**
+     * Returns the MessagePort array sent with the message, for cross-document messaging and channel messaging.
+     */
+    readonly ports: ReadonlyArray<MessagePort>;
+    /**
+     * Returns the WindowProxy of the source window, for cross-document messaging, and the MessagePort being attached, in the connect event fired at SharedWorkerGlobalScope objects.
+     */
+    readonly source: MessageEventSource | null;
+}
+
+
+export interface MessagePortEventMap {
+    "message": MessageEvent;
+    "messageerror": MessageEvent;
+}
+
+/** This Channel Messaging API interface represents one of the two ports of a MessageChannel, allowing messages to be sent from one port and listening out for them arriving at the other. */
+export interface MessagePort extends EventTarget {
+    onmessage: ((this: MessagePort, ev: MessageEvent) => any) | null;
+    onmessageerror: ((this: MessagePort, ev: MessageEvent) => any) | null;
+    /**
+     * Disconnects the port, so that it is no longer active.
+     */
+    close(): void;
+    /**
+     * Posts a message through the channel. Objects listed in transfer are transferred, not just cloned, meaning that they are no longer usable on the sending side.
+     * 
+     * Throws a "DataCloneError" DOMException if transfer contains duplicate objects or port, or if message could not be cloned.
+     */
+    postMessage(message: any, transfer: Transferable[]): void;
+    postMessage(message: any, options?: PostMessageOptions): void;
+    /**
+     * Begins dispatching messages received on the port.
+     */
+    start(): void;
+    addEventListener<K extends keyof MessagePortEventMap>(type: K, listener: (this: MessagePort, ev: MessagePortEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof MessagePortEventMap>(type: K, listener: (this: MessagePort, ev: MessagePortEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides contains information about a MIME type associated with a particular plugin. NavigatorPlugins.mimeTypes returns an array of this object. */
+export interface MimeType {
+    /**
+     * Returns the MIME type's description.
+     */
+    readonly description: string;
+    /**
+     * Returns the Plugin object that implements this MIME type.
+     */
+    readonly enabledPlugin: Plugin;
+    /**
+     * Returns the MIME type's typical file extensions, in a comma-separated list.
+     */
+    readonly suffixes: string;
+    /**
+     * Returns the MIME type.
+     */
+    readonly type: string;
+}
+
+
+/** Returns an array of MimeType instances, each of which contains information about a supported browser plugins. This object is returned by NavigatorPlugins.mimeTypes. */
+export interface MimeTypeArray {
+    readonly length: number;
+    item(index: number): MimeType | null;
+    namedItem(name: string): MimeType | null;
+    [index: number]: MimeType;
+}
+
+
+/** Events that occur due to the user interacting with a pointing device (such as a mouse). Common events using this interface include click, dblclick, mouseup, mousedown. */
+export interface MouseEvent extends UIEvent {
+    readonly altKey: boolean;
+    readonly button: number;
+    readonly buttons: number;
+    readonly clientX: number;
+    readonly clientY: number;
+    readonly ctrlKey: boolean;
+    readonly metaKey: boolean;
+    readonly movementX: number;
+    readonly movementY: number;
+    readonly offsetX: number;
+    readonly offsetY: number;
+    readonly pageX: number;
+    readonly pageY: number;
+    readonly relatedTarget: EventTarget | null;
+    readonly screenX: number;
+    readonly screenY: number;
+    readonly shiftKey: boolean;
+    readonly x: number;
+    readonly y: number;
+    getModifierState(keyArg: string): boolean;
+    initMouseEvent(typeArg: string, canBubbleArg: boolean, cancelableArg: boolean, viewArg: Window, detailArg: number, screenXArg: number, screenYArg: number, clientXArg: number, clientYArg: number, ctrlKeyArg: boolean, altKeyArg: boolean, shiftKeyArg: boolean, metaKeyArg: boolean, buttonArg: number, relatedTargetArg: EventTarget | null): void;
+}
+
+
+/** Provides event properties that are specific to modifications to the Document Object Model (DOM) hierarchy and nodes. */
+export interface MutationEvent extends Event {
+    readonly attrChange: number;
+    readonly attrName: string;
+    readonly newValue: string;
+    readonly prevValue: string;
+    readonly relatedNode: Node;
+    initMutationEvent(typeArg: string, canBubbleArg: boolean, cancelableArg: boolean, relatedNodeArg: Node, prevValueArg: string, newValueArg: string, attrNameArg: string, attrChangeArg: number): void;
+    readonly ADDITION: number;
+    readonly MODIFICATION: number;
+    readonly REMOVAL: number;
+}
+
+
+/** Provides the ability to watch for changes being made to the DOM tree. It is designed as a replacement for the older Mutation Events feature which was part of the DOM3 Events specification. */
+export interface MutationObserver {
+    /**
+     * Stops observer from observing any mutations. Until the observe() method is used again, observer's callback will not be invoked.
+     */
+    disconnect(): void;
+    /**
+     * Instructs the user agent to observe a given target (a node) and report any mutations based on the criteria given by options (an object).
+     * 
+     * The options argument allows for setting mutation observation options via object members.
+     */
+    observe(target: Node, options?: MutationObserverInit): void;
+    /**
+     * Empties the record queue and returns what was in there.
+     */
+    takeRecords(): MutationRecord[];
+}
+
+
+/** A MutationRecord represents an individual DOM mutation. It is the object that is passed to MutationObserver's callback. */
+export interface MutationRecord {
+    /**
+     * Return the nodes added and removed respectively.
+     */
+    readonly addedNodes: NodeList;
+    /**
+     * Returns the local name of the changed attribute, and null otherwise.
+     */
+    readonly attributeName: string | null;
+    /**
+     * Returns the namespace of the changed attribute, and null otherwise.
+     */
+    readonly attributeNamespace: string | null;
+    /**
+     * Return the previous and next sibling respectively of the added or removed nodes, and null otherwise.
+     */
+    readonly nextSibling: Node | null;
+    /**
+     * The return value depends on type. For "attributes", it is the value of the changed attribute before the change. For "characterData", it is the data of the changed node before the change. For "childList", it is null.
+     */
+    readonly oldValue: string | null;
+    /**
+     * Return the previous and next sibling respectively of the added or removed nodes, and null otherwise.
+     */
+    readonly previousSibling: Node | null;
+    /**
+     * Return the nodes added and removed respectively.
+     */
+    readonly removedNodes: NodeList;
+    /**
+     * Returns the node the mutation affected, depending on the type. For "attributes", it is the element whose attribute changed. For "characterData", it is the CharacterData node. For "childList", it is the node whose children changed.
+     */
+    readonly target: Node;
+    /**
+     * Returns "attributes" if it was an attribute mutation. "characterData" if it was a mutation to a CharacterData node. And "childList" if it was a mutation to the tree of nodes.
+     */
+    readonly type: MutationRecordType;
+}
+
+
+/** A collection of Attr objects. Objects inside a NamedNodeMap are not in any particular order, unlike NodeList, although they may be accessed by an index as in an array. */
+export interface NamedNodeMap {
+    readonly length: number;
+    getNamedItem(qualifiedName: string): Attr | null;
+    getNamedItemNS(namespace: string | null, localName: string): Attr | null;
+    item(index: number): Attr | null;
+    removeNamedItem(qualifiedName: string): Attr;
+    removeNamedItemNS(namespace: string | null, localName: string): Attr;
+    setNamedItem(attr: Attr): Attr | null;
+    setNamedItemNS(attr: Attr): Attr | null;
+    [index: number]: Attr;
+}
+
+
+export interface NavigationPreloadManager {
+    disable(): Promise<void>;
+    enable(): Promise<void>;
+    getState(): Promise<NavigationPreloadState>;
+    setHeaderValue(value: string): Promise<void>;
+}
+
+
+/** The state and the identity of the user agent. It allows scripts to query it and to register themselves to carry on some activities. */
+export interface Navigator extends MSFileSaver, MSNavigatorDoNotTrack, NavigatorAutomationInformation, NavigatorBeacon, NavigatorConcurrentHardware, NavigatorContentUtils, NavigatorCookies, NavigatorID, NavigatorLanguage, NavigatorOnLine, NavigatorPlugins, NavigatorStorage {
+    readonly activeVRDisplays: ReadonlyArray<VRDisplay>;
+    readonly clipboard: Clipboard;
+    readonly credentials: CredentialsContainer;
+    readonly doNotTrack: string | null;
+    readonly geolocation: Geolocation;
+    readonly maxTouchPoints: number;
+    readonly mediaDevices: MediaDevices;
+    readonly msManipulationViewsEnabled: boolean;
+    readonly msMaxTouchPoints: number;
+    readonly msPointerEnabled: boolean;
+    readonly permissions: Permissions;
+    readonly pointerEnabled: boolean;
+    readonly serviceWorker: ServiceWorkerContainer;
+    getGamepads(): (Gamepad | null)[];
+    getUserMedia(constraints: MediaStreamConstraints, successCallback: NavigatorUserMediaSuccessCallback, errorCallback: NavigatorUserMediaErrorCallback): void;
+    getVRDisplays(): Promise<VRDisplay[]>;
+    msLaunchUri(uri: string, successCallback?: MSLaunchUriCallback, noHandlerCallback?: MSLaunchUriCallback): void;
+    requestMediaKeySystemAccess(keySystem: string, supportedConfigurations: MediaKeySystemConfiguration[]): Promise<MediaKeySystemAccess>;
+    vibrate(pattern: number | number[]): boolean;
+}
+
+
+export interface NavigatorAutomationInformation {
+    readonly webdriver: boolean;
+}
+
+export interface NavigatorBeacon {
+    sendBeacon(url: string, data?: Blob | Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer | FormData | string | null): boolean;
+}
+
+export interface NavigatorConcurrentHardware {
+    readonly hardwareConcurrency: number;
+}
+
+export interface NavigatorContentUtils {
+    registerProtocolHandler(scheme: string, url: string, title: string): void;
+    unregisterProtocolHandler(scheme: string, url: string): void;
+}
+
+export interface NavigatorCookies {
+    readonly cookieEnabled: boolean;
+}
+
+export interface NavigatorID {
+    readonly appCodeName: string;
+    readonly appName: string;
+    readonly appVersion: string;
+    readonly oscpu: string;
+    readonly platform: string;
+    readonly product: string;
+    readonly productSub: string;
+    readonly userAgent: string;
+    readonly vendor: string;
+    readonly vendorSub: string;
+    taintEnabled(): boolean;
+}
+
+export interface NavigatorLanguage {
+    readonly language: string;
+    readonly languages: ReadonlyArray<string>;
+}
+
+export interface NavigatorOnLine {
+    readonly onLine: boolean;
+}
+
+export interface NavigatorPlugins {
+    readonly mimeTypes: MimeTypeArray;
+    readonly plugins: PluginArray;
+    javaEnabled(): boolean;
+}
+
+export interface NavigatorStorage {
+    readonly storage: StorageManager;
+}
+
+/** Node is an interface from which a number of DOM API object types inherit. It allows those types to be treated similarly; for example, inheriting the same set of methods, or being tested in the same way. */
+export interface Node extends EventTarget {
+    /**
+     * Returns node's node document's document base URL.
+     */
+    readonly baseURI: string;
+    /**
+     * Returns the children.
+     */
+    readonly childNodes: NodeListOf<ChildNode>;
+    /**
+     * Returns the first child.
+     */
+    readonly firstChild: ChildNode | null;
+    /**
+     * Returns true if node is connected and false otherwise.
+     */
+    readonly isConnected: boolean;
+    /**
+     * Returns the last child.
+     */
+    readonly lastChild: ChildNode | null;
+    /** @deprecated */
+    readonly namespaceURI: string | null;
+    /**
+     * Returns the next sibling.
+     */
+    readonly nextSibling: ChildNode | null;
+    /**
+     * Returns a string appropriate for the type of node.
+     */
+    readonly nodeName: string;
+    /**
+     * Returns the type of node.
+     */
+    readonly nodeType: number;
+    nodeValue: string | null;
+    /**
+     * Returns the node document. Returns null for documents.
+     */
+    readonly ownerDocument: Document | null;
+    /**
+     * Returns the parent element.
+     */
+    readonly parentElement: HTMLElement | null;
+    /**
+     * Returns the parent.
+     */
+    readonly parentNode: Node & ParentNode | null;
+    /**
+     * Returns the previous sibling.
+     */
+    readonly previousSibling: ChildNode | null;
+    textContent: string | null;
+    appendChild<T extends Node>(newChild: T): T;
+    /**
+     * Returns a copy of node. If deep is true, the copy also includes the node's descendants.
+     */
+    cloneNode(deep?: boolean): Node;
+    /**
+     * Returns a bitmask indicating the position of other relative to node.
+     */
+    compareDocumentPosition(other: Node): number;
+    /**
+     * Returns true if other is an inclusive descendant of node, and false otherwise.
+     */
+    contains(other: Node | null): boolean;
+    /**
+     * Returns node's root.
+     */
+    getRootNode(options?: GetRootNodeOptions): Node;
+    /**
+     * Returns whether node has children.
+     */
+    hasChildNodes(): boolean;
+    insertBefore<T extends Node>(newChild: T, refChild: Node | null): T;
+    isDefaultNamespace(namespace: string | null): boolean;
+    /**
+     * Returns whether node and otherNode have the same properties.
+     */
+    isEqualNode(otherNode: Node | null): boolean;
+    isSameNode(otherNode: Node | null): boolean;
+    lookupNamespaceURI(prefix: string | null): string | null;
+    lookupPrefix(namespace: string | null): string | null;
+    /**
+     * Removes empty exclusive Text nodes and concatenates the data of remaining contiguous exclusive Text nodes into the first of their nodes.
+     */
+    normalize(): void;
+    removeChild<T extends Node>(oldChild: T): T;
+    replaceChild<T extends Node>(newChild: Node, oldChild: T): T;
+    readonly ATTRIBUTE_NODE: number;
+    /**
+     * node is a CDATASection node.
+     */
+    readonly CDATA_SECTION_NODE: number;
+    /**
+     * node is a Comment node.
+     */
+    readonly COMMENT_NODE: number;
+    /**
+     * node is a DocumentFragment node.
+     */
+    readonly DOCUMENT_FRAGMENT_NODE: number;
+    /**
+     * node is a document.
+     */
+    readonly DOCUMENT_NODE: number;
+    /**
+     * Set when other is a descendant of node.
+     */
+    readonly DOCUMENT_POSITION_CONTAINED_BY: number;
+    /**
+     * Set when other is an ancestor of node.
+     */
+    readonly DOCUMENT_POSITION_CONTAINS: number;
+    /**
+     * Set when node and other are not in the same tree.
+     */
+    readonly DOCUMENT_POSITION_DISCONNECTED: number;
+    /**
+     * Set when other is following node.
+     */
+    readonly DOCUMENT_POSITION_FOLLOWING: number;
+    readonly DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: number;
+    /**
+     * Set when other is preceding node.
+     */
+    readonly DOCUMENT_POSITION_PRECEDING: number;
+    /**
+     * node is a doctype.
+     */
+    readonly DOCUMENT_TYPE_NODE: number;
+    /**
+     * node is an element.
+     */
+    readonly ELEMENT_NODE: number;
+    readonly ENTITY_NODE: number;
+    readonly ENTITY_REFERENCE_NODE: number;
+    readonly NOTATION_NODE: number;
+    /**
+     * node is a ProcessingInstruction node.
+     */
+    readonly PROCESSING_INSTRUCTION_NODE: number;
+    /**
+     * node is a Text node.
+     */
+    readonly TEXT_NODE: number;
+}
+
+
+/** An object used to filter the nodes in a NodeIterator or TreeWalker. They don't know anything about the DOM or how to traverse nodes; they just know how to evaluate a single node against the provided filter. */
+export interface NodeFilter {
+    acceptNode(node: Node): number;
+}
+
+
+/** An iterator over the members of a list of the nodes in a subtree of the DOM. The nodes will be returned in document order. */
+export interface NodeIterator {
+    readonly filter: NodeFilter | null;
+    readonly pointerBeforeReferenceNode: boolean;
+    readonly referenceNode: Node;
+    readonly root: Node;
+    readonly whatToShow: number;
+    detach(): void;
+    nextNode(): Node | null;
+    previousNode(): Node | null;
+}
+
+
+/** NodeList objects are collections of nodes, usually returned by properties such as Node.childNodes and methods such as document.querySelectorAll(). */
+export interface NodeList {
+    /**
+     * Returns the number of nodes in the collection.
+     */
+    readonly length: number;
+    /**
+     * Returns the node with index index from the collection. The nodes are sorted in tree order.
+     */
+    item(index: number): Node | null;
+    /**
+     * Performs the specified action for each node in an list.
+     * @param callbackfn  A function that accepts up to three arguments. forEach calls the callbackfn function one time for each element in the list.
+     * @param thisArg  An object to which the this keyword can refer in the callbackfn function. If thisArg is omitted, undefined is used as the this value.
+     */
+    forEach(callbackfn: (value: Node, key: number, parent: NodeList) => void, thisArg?: any): void;
+    [index: number]: Node;
+}
+
+
+export interface NodeListOf<TNode extends Node> extends NodeList {
+    length: number;
+    item(index: number): TNode;
+    /**
+     * Performs the specified action for each node in an list.
+     * @param callbackfn  A function that accepts up to three arguments. forEach calls the callbackfn function one time for each element in the list.
+     * @param thisArg  An object to which the this keyword can refer in the callbackfn function. If thisArg is omitted, undefined is used as the this value.
+     */
+    forEach(callbackfn: (value: TNode, key: number, parent: NodeListOf<TNode>) => void, thisArg?: any): void;
+    [index: number]: TNode;
+}
+
+export interface NonDocumentTypeChildNode {
+    /**
+     * Returns the first following sibling that is an element, and null otherwise.
+     */
+    readonly nextElementSibling: Element | null;
+    /**
+     * Returns the first preceding sibling that is an element, and null otherwise.
+     */
+    readonly previousElementSibling: Element | null;
+}
+
+export interface NonElementParentNode {
+    /**
+     * Returns the first element within node's descendants whose ID is elementId.
+     */
+    getElementById(elementId: string): Element | null;
+}
+
+export interface NotificationEventMap {
+    "click": Event;
+    "close": Event;
+    "error": Event;
+    "show": Event;
+}
+
+/** This Notifications API interface is used to configure and display desktop notifications to the user. */
+export interface Notification extends EventTarget {
+    readonly actions: ReadonlyArray<NotificationAction>;
+    readonly badge: string;
+    readonly body: string;
+    readonly data: any;
+    readonly dir: NotificationDirection;
+    readonly icon: string;
+    readonly image: string;
+    readonly lang: string;
+    onclick: ((this: Notification, ev: Event) => any) | null;
+    onclose: ((this: Notification, ev: Event) => any) | null;
+    onerror: ((this: Notification, ev: Event) => any) | null;
+    onshow: ((this: Notification, ev: Event) => any) | null;
+    readonly renotify: boolean;
+    readonly requireInteraction: boolean;
+    readonly silent: boolean;
+    readonly tag: string;
+    readonly timestamp: number;
+    readonly title: string;
+    readonly vibrate: ReadonlyArray<number>;
+    close(): void;
+    addEventListener<K extends keyof NotificationEventMap>(type: K, listener: (this: Notification, ev: NotificationEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof NotificationEventMap>(type: K, listener: (this: Notification, ev: NotificationEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** The OES_element_index_uint extension is part of the WebGL API and adds support for gl.UNSIGNED_INT types to WebGLRenderingContext.drawElements(). */
+export interface OES_element_index_uint {
+}
+
+/** The OES_standard_derivatives extension is part of the WebGL API and adds the GLSL derivative functions dFdx, dFdy, and fwidth. */
+export interface OES_standard_derivatives {
+    readonly FRAGMENT_SHADER_DERIVATIVE_HINT_OES: GLenum;
+}
+
+/** The OES_texture_float extension is part of the WebGL API and exposes floating-point pixel types for textures. */
+export interface OES_texture_float {
+}
+
+/** The OES_texture_float_linear extension is part of the WebGL API and allows linear filtering with floating-point pixel types for textures. */
+export interface OES_texture_float_linear {
+}
+
+/** The OES_texture_half_float extension is part of the WebGL API and adds texture formats with 16- (aka half float) and 32-bit floating-point components. */
+export interface OES_texture_half_float {
+    readonly HALF_FLOAT_OES: GLenum;
+}
+
+/** The OES_texture_half_float_linear extension is part of the WebGL API and allows linear filtering with half floating-point pixel types for textures. */
+export interface OES_texture_half_float_linear {
+}
+
+export interface OES_vertex_array_object {
+    bindVertexArrayOES(arrayObject: WebGLVertexArrayObjectOES | null): void;
+    createVertexArrayOES(): WebGLVertexArrayObjectOES | null;
+    deleteVertexArrayOES(arrayObject: WebGLVertexArrayObjectOES | null): void;
+    isVertexArrayOES(arrayObject: WebGLVertexArrayObjectOES | null): GLboolean;
+    readonly VERTEX_ARRAY_BINDING_OES: GLenum;
+}
+
+/** The Web Audio API OfflineAudioCompletionEvent interface represents events that occur when the processing of an OfflineAudioContext is terminated. The complete event implements this interface. */
+export interface OfflineAudioCompletionEvent extends Event {
+    readonly renderedBuffer: AudioBuffer;
+}
+
+
+export interface OfflineAudioContextEventMap extends BaseAudioContextEventMap {
+    "complete": OfflineAudioCompletionEvent;
+}
+
+/** An AudioContext interface representing an audio-processing graph built from linked together AudioNodes. In contrast with a standard AudioContext, an OfflineAudioContext doesn't render the audio to the device hardware; instead, it generates it, as fast as it can, and outputs the result to an AudioBuffer. */
+export interface OfflineAudioContext extends BaseAudioContext {
+    readonly length: number;
+    oncomplete: ((this: OfflineAudioContext, ev: OfflineAudioCompletionEvent) => any) | null;
+    resume(): Promise<void>;
+    startRendering(): Promise<AudioBuffer>;
+    suspend(suspendTime: number): Promise<void>;
+    addEventListener<K extends keyof OfflineAudioContextEventMap>(type: K, listener: (this: OfflineAudioContext, ev: OfflineAudioContextEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof OfflineAudioContextEventMap>(type: K, listener: (this: OfflineAudioContext, ev: OfflineAudioContextEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface OffscreenCanvas extends EventTarget {
+    /**
+     * These attributes return the dimensions of the OffscreenCanvas object's bitmap.
+     * 
+     * They can be set, to replace the bitmap with a new, transparent black bitmap of the specified dimensions (effectively resizing it).
+     */
+    height: number;
+    /**
+     * These attributes return the dimensions of the OffscreenCanvas object's bitmap.
+     * 
+     * They can be set, to replace the bitmap with a new, transparent black bitmap of the specified dimensions (effectively resizing it).
+     */
+    width: number;
+    /**
+     * Returns a promise that will fulfill with a new Blob object representing a file containing the image in the OffscreenCanvas object.
+     * 
+     * The argument, if provided, is a dictionary that controls the encoding options of the image file to be created. The type field specifies the file format and has a default value of "image/png"; that type is also used if the requested type isn't supported. If the image format supports variable quality (such as "image/jpeg"), then the quality field is a number in the range 0.0 to 1.0 inclusive indicating the desired quality level for the resulting image.
+     */
+    convertToBlob(options?: ImageEncodeOptions): Promise<Blob>;
+    /**
+     * Returns an object that exposes an API for drawing on the OffscreenCanvas object. contextId specifies the desired API: "2d", "bitmaprenderer", "webgl", or "webgl2". options is handled by that API.
+     * 
+     * This specification defines the "2d" context below, which is similar but distinct from the "2d" context that is created from a canvas element. The WebGL specifications define the "webgl" and "webgl2" contexts. [WEBGL]
+     * 
+     * Returns null if the canvas has already been initialized with another context type (e.g., trying to get a "2d" context after getting a "webgl" context).
+     */
+    getContext(contextId: "2d", options?: CanvasRenderingContext2DSettings): OffscreenCanvasRenderingContext2D | null;
+    getContext(contextId: "bitmaprenderer", options?: ImageBitmapRenderingContextSettings): ImageBitmapRenderingContext | null;
+    getContext(contextId: "webgl", options?: WebGLContextAttributes): WebGLRenderingContext | null;
+    getContext(contextId: "webgl2", options?: WebGLContextAttributes): WebGL2RenderingContext | null;
+    getContext(contextId: OffscreenRenderingContextId, options?: any): OffscreenRenderingContext | null;
+    /**
+     * Returns a newly created ImageBitmap object with the image in the OffscreenCanvas object. The image in the OffscreenCanvas object is replaced with a new blank image.
+     */
+    transferToImageBitmap(): ImageBitmap;
+}
+
+
+export interface OffscreenCanvasRenderingContext2D extends CanvasCompositing, CanvasDrawImage, CanvasDrawPath, CanvasFillStrokeStyles, CanvasFilters, CanvasImageData, CanvasImageSmoothing, CanvasPath, CanvasPathDrawingStyles, CanvasRect, CanvasShadowStyles, CanvasState, CanvasText, CanvasTextDrawingStyles, CanvasTransform {
+    readonly canvas: OffscreenCanvas;
+    commit(): void;
+}
+
+
+/** The OscillatorNode interface represents a periodic waveform, such as a sine wave. It is an AudioScheduledSourceNode audio-processing module that causes a specified frequency of a given wave to be created—in effect, a constant tone. */
+export interface OscillatorNode extends AudioScheduledSourceNode {
+    readonly detune: AudioParam;
+    readonly frequency: AudioParam;
+    type: OscillatorType;
+    setPeriodicWave(periodicWave: PeriodicWave): void;
+    addEventListener<K extends keyof AudioScheduledSourceNodeEventMap>(type: K, listener: (this: OscillatorNode, ev: AudioScheduledSourceNodeEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof AudioScheduledSourceNodeEventMap>(type: K, listener: (this: OscillatorNode, ev: AudioScheduledSourceNodeEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface OverconstrainedError extends Error {
+    constraint: string;
+}
+
+
+export interface OverflowEvent extends UIEvent {
+    readonly horizontalOverflow: boolean;
+    readonly orient: number;
+    readonly verticalOverflow: boolean;
+    readonly BOTH: number;
+    readonly HORIZONTAL: number;
+    readonly VERTICAL: number;
+}
+
+
+/** The PageTransitionEvent is fired when a document is being loaded or unloaded. */
+export interface PageTransitionEvent extends Event {
+    /**
+     * For the pageshow event, returns false if the page is newly being loaded (and the load event will fire). Otherwise, returns true.
+     * 
+     * For the pagehide event, returns false if the page is going away for the last time. Otherwise, returns true, meaning that (if nothing conspires to make the page unsalvageable) the page might be reused if the user navigates back to this page.
+     * 
+     * Things that can cause the page to be unsalvageable include:
+     * 
+     * Listening for beforeunload events
+     * Listening for unload events
+     * Having iframes that are not salvageable
+     * Active WebSocket objects
+     * Aborting a Document
+     */
+    readonly persisted: boolean;
+}
+
+
+/** A PannerNode always has exactly one input and one output: the input can be mono or stereo but the output is always stereo (2 channels); you can't have panning effects without at least two audio channels! */
+export interface PannerNode extends AudioNode {
+    coneInnerAngle: number;
+    coneOuterAngle: number;
+    coneOuterGain: number;
+    distanceModel: DistanceModelType;
+    maxDistance: number;
+    readonly orientationX: AudioParam;
+    readonly orientationY: AudioParam;
+    readonly orientationZ: AudioParam;
+    panningModel: PanningModelType;
+    readonly positionX: AudioParam;
+    readonly positionY: AudioParam;
+    readonly positionZ: AudioParam;
+    refDistance: number;
+    rolloffFactor: number;
+    /** @deprecated */
+    setOrientation(x: number, y: number, z: number): void;
+    /** @deprecated */
+    setPosition(x: number, y: number, z: number): void;
+}
+
+
+export interface ParentNode {
+    readonly childElementCount: number;
+    /**
+     * Returns the child elements.
+     */
+    readonly children: HTMLCollection;
+    /**
+     * Returns the first child that is an element, and null otherwise.
+     */
+    readonly firstElementChild: Element | null;
+    /**
+     * Returns the last child that is an element, and null otherwise.
+     */
+    readonly lastElementChild: Element | null;
+    /**
+     * Inserts nodes after the last child of node, while replacing strings in nodes with equivalent Text nodes.
+     * 
+     * Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.
+     */
+    append(...nodes: (Node | string)[]): void;
+    /**
+     * Inserts nodes before the first child of node, while replacing strings in nodes with equivalent Text nodes.
+     * 
+     * Throws a "HierarchyRequestError" DOMException if the constraints of the node tree are violated.
+     */
+    prepend(...nodes: (Node | string)[]): void;
+    /**
+     * Returns the first element that is a descendant of node that matches selectors.
+     */
+    querySelector<K extends keyof HTMLElementTagNameMap>(selectors: K): HTMLElementTagNameMap[K] | null;
+    querySelector<K extends keyof SVGElementTagNameMap>(selectors: K): SVGElementTagNameMap[K] | null;
+    querySelector<E extends Element = Element>(selectors: string): E | null;
+    /**
+     * Returns all element descendants of node that match selectors.
+     */
+    querySelectorAll<K extends keyof HTMLElementTagNameMap>(selectors: K): NodeListOf<HTMLElementTagNameMap[K]>;
+    querySelectorAll<K extends keyof SVGElementTagNameMap>(selectors: K): NodeListOf<SVGElementTagNameMap[K]>;
+    querySelectorAll<E extends Element = Element>(selectors: string): NodeListOf<E>;
+}
+
+/** This Canvas 2D API interface is used to declare a path that can then be used on a CanvasRenderingContext2D object. The path methods of the CanvasRenderingContext2D interface are also present on this interface, which gives you the convenience of being able to retain and replay your path whenever desired. */
+export interface Path2D extends CanvasPath {
+    /**
+     * Adds to the path the path given by the argument.
+     */
+    addPath(path: Path2D, transform?: DOMMatrix2DInit): void;
+}
+
+
+/** This Payment Request API interface is used to store shipping or payment address information. */
+export interface PaymentAddress {
+    readonly addressLine: string[];
+    readonly city: string;
+    readonly country: string;
+    readonly dependentLocality: string;
+    readonly languageCode: string;
+    readonly organization: string;
+    readonly phone: string;
+    readonly postalCode: string;
+    readonly recipient: string;
+    readonly region: string;
+    readonly sortingCode: string;
+    toJSON(): any;
+}
+
+
+export interface PaymentRequestEventMap {
+    "shippingaddresschange": Event;
+    "shippingoptionchange": Event;
+}
+
+/** This Payment Request API interface is the primary access point into the API, and lets web content and apps accept payments from the end user. */
+export interface PaymentRequest extends EventTarget {
+    readonly id: string;
+    onshippingaddresschange: ((this: PaymentRequest, ev: Event) => any) | null;
+    onshippingoptionchange: ((this: PaymentRequest, ev: Event) => any) | null;
+    readonly shippingAddress: PaymentAddress | null;
+    readonly shippingOption: string | null;
+    readonly shippingType: PaymentShippingType | null;
+    abort(): Promise<void>;
+    canMakePayment(): Promise<boolean>;
+    show(): Promise<PaymentResponse>;
+    addEventListener<K extends keyof PaymentRequestEventMap>(type: K, listener: (this: PaymentRequest, ev: PaymentRequestEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof PaymentRequestEventMap>(type: K, listener: (this: PaymentRequest, ev: PaymentRequestEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** This Payment Request API interface enables a web page to update the details of a PaymentRequest in response to a user action. */
+export interface PaymentRequestUpdateEvent extends Event {
+    updateWith(detailsPromise: PaymentDetailsUpdate | Promise<PaymentDetailsUpdate>): void;
+}
+
+
+/** This Payment Request API interface is returned after a user selects a payment method and approves a payment request. */
+export interface PaymentResponse {
+    readonly details: any;
+    readonly methodName: string;
+    readonly payerEmail: string | null;
+    readonly payerName: string | null;
+    readonly payerPhone: string | null;
+    readonly requestId: string;
+    readonly shippingAddress: PaymentAddress | null;
+    readonly shippingOption: string | null;
+    complete(result?: PaymentComplete): Promise<void>;
+    toJSON(): any;
+}
+
+
+export interface PerfWidgetExternal {
+    readonly activeNetworkRequestCount: number;
+    readonly averageFrameTime: number;
+    readonly averagePaintTime: number;
+    readonly extraInformationEnabled: boolean;
+    readonly independentRenderingEnabled: boolean;
+    readonly irDisablingContentString: string;
+    readonly irStatusAvailable: boolean;
+    readonly maxCpuSpeed: number;
+    readonly paintRequestsPerSecond: number;
+    readonly performanceCounter: number;
+    readonly performanceCounterFrequency: number;
+    addEventListener(eventType: string, callback: Function): void;
+    getMemoryUsage(): number;
+    getProcessCpuUsage(): number;
+    getRecentCpuUsage(last: number | null): any;
+    getRecentFrames(last: number | null): any;
+    getRecentMemoryUsage(last: number | null): any;
+    getRecentPaintRequests(last: number | null): any;
+    removeEventListener(eventType: string, callback: Function): void;
+    repositionWindow(x: number, y: number): void;
+    resizeWindow(width: number, height: number): void;
+}
+
+
+export interface PerformanceEventMap {
+    "resourcetimingbufferfull": Event;
+}
+
+/** Provides access to performance-related information for the current page. It's part of the High Resolution Time API, but is enhanced by the Performance Timeline API, the Navigation Timing API, the User Timing API, and the Resource Timing API. */
+export interface Performance extends EventTarget {
+    /** @deprecated */
+    readonly navigation: PerformanceNavigation;
+    onresourcetimingbufferfull: ((this: Performance, ev: Event) => any) | null;
+    readonly timeOrigin: number;
+    /** @deprecated */
+    readonly timing: PerformanceTiming;
+    clearMarks(markName?: string): void;
+    clearMeasures(measureName?: string): void;
+    clearResourceTimings(): void;
+    getEntries(): PerformanceEntryList;
+    getEntriesByName(name: string, type?: string): PerformanceEntryList;
+    getEntriesByType(type: string): PerformanceEntryList;
+    mark(markName: string): void;
+    measure(measureName: string, startMark?: string, endMark?: string): void;
+    now(): number;
+    setResourceTimingBufferSize(maxSize: number): void;
+    toJSON(): any;
+    addEventListener<K extends keyof PerformanceEventMap>(type: K, listener: (this: Performance, ev: PerformanceEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof PerformanceEventMap>(type: K, listener: (this: Performance, ev: PerformanceEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Encapsulates a single performance metric that is part of the performance timeline. A performance entry can be directly created by making a performance mark or measure (for example by calling the mark() method) at an explicit point in an application. Performance entries are also created in indirect ways such as loading a resource (such as an image). */
+export interface PerformanceEntry {
+    readonly duration: number;
+    readonly entryType: string;
+    readonly name: string;
+    readonly startTime: number;
+    toJSON(): any;
+}
+
+
+/** PerformanceMark is an abstract interface for PerformanceEntry objects with an entryType of "mark". Entries of this type are created by calling performance.mark() to add a named DOMHighResTimeStamp (the mark) to the browser's performance timeline. */
+export interface PerformanceMark extends PerformanceEntry {
+}
+
+
+/** PerformanceMeasure is an abstract interface for PerformanceEntry objects with an entryType of "measure". Entries of this type are created by calling performance.measure() to add a named DOMHighResTimeStamp (the measure) between two marks to the browser's performance timeline. */
+export interface PerformanceMeasure extends PerformanceEntry {
+}
+
+
+/** The legacy PerformanceNavigation interface represents information about how the navigation to the current document was done. */
+export interface PerformanceNavigation {
+    readonly redirectCount: number;
+    readonly type: number;
+    toJSON(): any;
+    readonly TYPE_BACK_FORWARD: number;
+    readonly TYPE_NAVIGATE: number;
+    readonly TYPE_RELOAD: number;
+    readonly TYPE_RESERVED: number;
+}
+
+
+/** Provides methods and properties to store and retrieve metrics regarding the browser's document navigation events. For example, this interface can be used to determine how much time it takes to load or unload a document. */
+export interface PerformanceNavigationTiming extends PerformanceResourceTiming {
+    readonly domComplete: number;
+    readonly domContentLoadedEventEnd: number;
+    readonly domContentLoadedEventStart: number;
+    readonly domInteractive: number;
+    readonly loadEventEnd: number;
+    readonly loadEventStart: number;
+    readonly redirectCount: number;
+    readonly type: NavigationType;
+    readonly unloadEventEnd: number;
+    readonly unloadEventStart: number;
+    toJSON(): any;
+}
+
+
+export interface PerformanceObserver {
+    disconnect(): void;
+    observe(options?: PerformanceObserverInit): void;
+    takeRecords(): PerformanceEntryList;
+}
+
+
+export interface PerformanceObserverEntryList {
+    getEntries(): PerformanceEntryList;
+    getEntriesByName(name: string, type?: string): PerformanceEntryList;
+    getEntriesByType(type: string): PerformanceEntryList;
+}
+
+
+/** Enables retrieval and analysis of detailed network timing data regarding the loading of an application's resources. An application can use the timing metrics to determine, for example, the length of time it takes to fetch a specific resource, such as an XMLHttpRequest, <SVG>, image, or script. */
+export interface PerformanceResourceTiming extends PerformanceEntry {
+    readonly connectEnd: number;
+    readonly connectStart: number;
+    readonly decodedBodySize: number;
+    readonly domainLookupEnd: number;
+    readonly domainLookupStart: number;
+    readonly encodedBodySize: number;
+    readonly fetchStart: number;
+    readonly initiatorType: string;
+    readonly nextHopProtocol: string;
+    readonly redirectEnd: number;
+    readonly redirectStart: number;
+    readonly requestStart: number;
+    readonly responseEnd: number;
+    readonly responseStart: number;
+    readonly secureConnectionStart: number;
+    readonly transferSize: number;
+    readonly workerStart: number;
+    toJSON(): any;
+}
+
+
+/** A legacy interface kept for backwards compatibility and contains properties that offer performance timing information for various events which occur during the loading and use of the current page. You get a PerformanceTiming object describing your page using the window.performance.timing property. */
+export interface PerformanceTiming {
+    readonly connectEnd: number;
+    readonly connectStart: number;
+    readonly domComplete: number;
+    readonly domContentLoadedEventEnd: number;
+    readonly domContentLoadedEventStart: number;
+    readonly domInteractive: number;
+    readonly domLoading: number;
+    readonly domainLookupEnd: number;
+    readonly domainLookupStart: number;
+    readonly fetchStart: number;
+    readonly loadEventEnd: number;
+    readonly loadEventStart: number;
+    readonly navigationStart: number;
+    readonly redirectEnd: number;
+    readonly redirectStart: number;
+    readonly requestStart: number;
+    readonly responseEnd: number;
+    readonly responseStart: number;
+    readonly secureConnectionStart: number;
+    readonly unloadEventEnd: number;
+    readonly unloadEventStart: number;
+    toJSON(): any;
+}
+
+
+/** PeriodicWave has no inputs or outputs; it is used to define custom oscillators when calling OscillatorNode.setPeriodicWave(). The PeriodicWave itself is created/returned by AudioContext.createPeriodicWave(). */
+export interface PeriodicWave {
+}
+
+
+export interface PermissionRequest extends DeferredPermissionRequest {
+    readonly state: MSWebViewPermissionState;
+    defer(): void;
+}
+
+
+export interface PermissionRequestedEvent extends Event {
+    readonly permissionRequest: PermissionRequest;
+}
+
+
+export interface PermissionStatusEventMap {
+    "change": Event;
+}
+
+export interface PermissionStatus extends EventTarget {
+    onchange: ((this: PermissionStatus, ev: Event) => any) | null;
+    readonly state: PermissionState;
+    addEventListener<K extends keyof PermissionStatusEventMap>(type: K, listener: (this: PermissionStatus, ev: PermissionStatusEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof PermissionStatusEventMap>(type: K, listener: (this: PermissionStatus, ev: PermissionStatusEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface Permissions {
+    query(permissionDesc: PermissionDescriptor | DevicePermissionDescriptor | MidiPermissionDescriptor | PushPermissionDescriptor): Promise<PermissionStatus>;
+}
+
+
+/** Provides information about a browser plugin. */
+export interface Plugin {
+    /**
+     * Returns the plugin's description.
+     */
+    readonly description: string;
+    /**
+     * Returns the plugin library's filename, if applicable on the current platform.
+     */
+    readonly filename: string;
+    /**
+     * Returns the number of MIME types, represented by MimeType objects, supported by the plugin.
+     */
+    readonly length: number;
+    /**
+     * Returns the plugin's name.
+     */
+    readonly name: string;
+    /**
+     * Returns the specified MimeType object.
+     */
+    item(index: number): MimeType | null;
+    namedItem(name: string): MimeType | null;
+    [index: number]: MimeType;
+}
+
+
+/** Used to store a list of Plugin objects describing the available plugins; it's returned by the window.navigator.plugins property. The PluginArray is not a JavaScript array, but has the length property and supports accessing individual items using bracket notation (plugins[2]), as well as via item(index) and namedItem("name") methods. */
+export interface PluginArray {
+    readonly length: number;
+    item(index: number): Plugin | null;
+    namedItem(name: string): Plugin | null;
+    refresh(reload?: boolean): void;
+    [index: number]: Plugin;
+}
+
+
+/** The state of a DOM event produced by a pointer such as the geometry of the contact point, the device type that generated the event, the amount of pressure that was applied on the contact surface, etc. */
+export interface PointerEvent extends MouseEvent {
+    readonly height: number;
+    readonly isPrimary: boolean;
+    readonly pointerId: number;
+    readonly pointerType: string;
+    readonly pressure: number;
+    readonly tangentialPressure: number;
+    readonly tiltX: number;
+    readonly tiltY: number;
+    readonly twist: number;
+    readonly width: number;
+}
+
+
+/** PopStateEvent is an event handler for the popstate event on the window. */
+export interface PopStateEvent extends Event {
+    /**
+     * Returns a copy of the information that was provided to pushState() or replaceState().
+     */
+    readonly state: any;
+}
+
+
+/** The position of the concerned device at a given time. The position, represented by a Coordinates object, comprehends the 2D position of the device, on a spheroid representing the Earth, but also its altitude and its speed. */
+export interface Position {
+    readonly coords: Coordinates;
+    readonly timestamp: number;
+}
+
+/** The reason of an error occurring when using the geolocating device. */
+export interface PositionError {
+    readonly code: number;
+    readonly message: string;
+    readonly PERMISSION_DENIED: number;
+    readonly POSITION_UNAVAILABLE: number;
+    readonly TIMEOUT: number;
+}
+
+/** A processing instruction embeds application-specific instructions in XML which can be ignored by other applications that don't recognize them. */
+export interface ProcessingInstruction extends CharacterData {
+    readonly target: string;
+}
+
+
+/** Events measuring progress of an underlying process, like an HTTP request (for an XMLHttpRequest, or the loading of the underlying resource of an <img>, <audio>, <video>, <style> or <link>). */
+export interface ProgressEvent<T extends EventTarget = EventTarget> extends Event {
+    readonly lengthComputable: boolean;
+    readonly loaded: number;
+    readonly target: T | null;
+    readonly total: number;
+}
+
+
+export interface PromiseRejectionEvent extends Event {
+    readonly promise: Promise<any>;
+    readonly reason: any;
+}
+
+
+export interface PublicKeyCredential extends Credential {
+    readonly rawId: ArrayBuffer;
+    readonly response: AuthenticatorResponse;
+    getClientExtensionResults(): AuthenticationExtensionsClientOutputs;
+}
+
+
+/** This Push API interface provides a way to receive notifications from third-party servers as well as request URLs for push notifications. */
+export interface PushManager {
+    getSubscription(): Promise<PushSubscription | null>;
+    permissionState(options?: PushSubscriptionOptionsInit): Promise<PushPermissionState>;
+    subscribe(options?: PushSubscriptionOptionsInit): Promise<PushSubscription>;
+}
+
+
+/** This Push API interface provides a subcription's URL endpoint and allows unsubscription from a push service. */
+export interface PushSubscription {
+    readonly endpoint: string;
+    readonly expirationTime: number | null;
+    readonly options: PushSubscriptionOptions;
+    getKey(name: PushEncryptionKeyName): ArrayBuffer | null;
+    toJSON(): PushSubscriptionJSON;
+    unsubscribe(): Promise<boolean>;
+}
+
+
+export interface PushSubscriptionOptions {
+    readonly applicationServerKey: ArrayBuffer | null;
+    readonly userVisibleOnly: boolean;
+}
+
+
+export interface RTCCertificate {
+    readonly expires: number;
+    getFingerprints(): RTCDtlsFingerprint[];
+}
+
+
+export interface RTCDTMFSenderEventMap {
+    "tonechange": RTCDTMFToneChangeEvent;
+}
+
+export interface RTCDTMFSender extends EventTarget {
+    readonly canInsertDTMF: boolean;
+    ontonechange: ((this: RTCDTMFSender, ev: RTCDTMFToneChangeEvent) => any) | null;
+    readonly toneBuffer: string;
+    insertDTMF(tones: string, duration?: number, interToneGap?: number): void;
+    addEventListener<K extends keyof RTCDTMFSenderEventMap>(type: K, listener: (this: RTCDTMFSender, ev: RTCDTMFSenderEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof RTCDTMFSenderEventMap>(type: K, listener: (this: RTCDTMFSender, ev: RTCDTMFSenderEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Events sent to indicate that DTMF tones have started or finished playing. This interface is used by the tonechange event. */
+export interface RTCDTMFToneChangeEvent extends Event {
+    readonly tone: string;
+}
+
+
+export interface RTCDataChannelEventMap {
+    "bufferedamountlow": Event;
+    "close": Event;
+    "error": RTCErrorEvent;
+    "message": MessageEvent;
+    "open": Event;
+}
+
+export interface RTCDataChannel extends EventTarget {
+    binaryType: string;
+    readonly bufferedAmount: number;
+    bufferedAmountLowThreshold: number;
+    readonly id: number | null;
+    readonly label: string;
+    readonly maxPacketLifeTime: number | null;
+    readonly maxRetransmits: number | null;
+    readonly negotiated: boolean;
+    onbufferedamountlow: ((this: RTCDataChannel, ev: Event) => any) | null;
+    onclose: ((this: RTCDataChannel, ev: Event) => any) | null;
+    onerror: ((this: RTCDataChannel, ev: RTCErrorEvent) => any) | null;
+    onmessage: ((this: RTCDataChannel, ev: MessageEvent) => any) | null;
+    onopen: ((this: RTCDataChannel, ev: Event) => any) | null;
+    readonly ordered: boolean;
+    readonly priority: RTCPriorityType;
+    readonly protocol: string;
+    readonly readyState: RTCDataChannelState;
+    close(): void;
+    send(data: string): void;
+    send(data: Blob): void;
+    send(data: ArrayBuffer): void;
+    send(data: ArrayBufferView): void;
+    addEventListener<K extends keyof RTCDataChannelEventMap>(type: K, listener: (this: RTCDataChannel, ev: RTCDataChannelEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof RTCDataChannelEventMap>(type: K, listener: (this: RTCDataChannel, ev: RTCDataChannelEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface RTCDataChannelEvent extends Event {
+    readonly channel: RTCDataChannel;
+}
+
+
+export interface RTCDtlsTransportEventMap {
+    "error": RTCErrorEvent;
+    "statechange": Event;
+}
+
+export interface RTCDtlsTransport extends EventTarget {
+    readonly iceTransport: RTCIceTransport;
+    onerror: ((this: RTCDtlsTransport, ev: RTCErrorEvent) => any) | null;
+    onstatechange: ((this: RTCDtlsTransport, ev: Event) => any) | null;
+    readonly state: RTCDtlsTransportState;
+    getRemoteCertificates(): ArrayBuffer[];
+    addEventListener<K extends keyof RTCDtlsTransportEventMap>(type: K, listener: (this: RTCDtlsTransport, ev: RTCDtlsTransportEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof RTCDtlsTransportEventMap>(type: K, listener: (this: RTCDtlsTransport, ev: RTCDtlsTransportEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface RTCDtlsTransportStateChangedEvent extends Event {
+    readonly state: RTCDtlsTransportState;
+}
+
+
+export interface RTCDtmfSenderEventMap {
+    "tonechange": RTCDTMFToneChangeEvent;
+}
+
+export interface RTCDtmfSender extends EventTarget {
+    readonly canInsertDTMF: boolean;
+    readonly duration: number;
+    readonly interToneGap: number;
+    ontonechange: ((this: RTCDtmfSender, ev: RTCDTMFToneChangeEvent) => any) | null;
+    readonly sender: RTCRtpSender;
+    readonly toneBuffer: string;
+    insertDTMF(tones: string, duration?: number, interToneGap?: number): void;
+    addEventListener<K extends keyof RTCDtmfSenderEventMap>(type: K, listener: (this: RTCDtmfSender, ev: RTCDtmfSenderEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof RTCDtmfSenderEventMap>(type: K, listener: (this: RTCDtmfSender, ev: RTCDtmfSenderEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface RTCError extends DOMException {
+    readonly errorDetail: RTCErrorDetailType;
+    readonly httpRequestStatusCode: number | null;
+    readonly receivedAlert: number | null;
+    readonly sctpCauseCode: number | null;
+    readonly sdpLineNumber: number | null;
+    readonly sentAlert: number | null;
+}
+
+
+export interface RTCErrorEvent extends Event {
+    readonly error: RTCError;
+}
+
+
+/** The RTCIceCandidate interface—part of the WebRTC API—represents a candidate Internet Connectivity Establishment (ICE) configuration which may be used to establish an RTCPeerConnection. */
+export interface RTCIceCandidate {
+    readonly candidate: string;
+    readonly component: RTCIceComponent | null;
+    readonly foundation: string | null;
+    readonly port: number | null;
+    readonly priority: number | null;
+    readonly protocol: RTCIceProtocol | null;
+    readonly relatedAddress: string | null;
+    readonly relatedPort: number | null;
+    readonly sdpMLineIndex: number | null;
+    readonly sdpMid: string | null;
+    readonly tcpType: RTCIceTcpCandidateType | null;
+    readonly type: RTCIceCandidateType | null;
+    readonly usernameFragment: string | null;
+    toJSON(): RTCIceCandidateInit;
+}
+
+
+export interface RTCIceCandidatePairChangedEvent extends Event {
+    readonly pair: RTCIceCandidatePair;
+}
+
+
+export interface RTCIceGathererEventMap {
+    "error": Event;
+    "localcandidate": RTCIceGathererEvent;
+}
+
+export interface RTCIceGatherer extends RTCStatsProvider {
+    readonly component: RTCIceComponent;
+    onerror: ((this: RTCIceGatherer, ev: Event) => any) | null;
+    onlocalcandidate: ((this: RTCIceGatherer, ev: RTCIceGathererEvent) => any) | null;
+    createAssociatedGatherer(): RTCIceGatherer;
+    getLocalCandidates(): RTCIceCandidateDictionary[];
+    getLocalParameters(): RTCIceParameters;
+    addEventListener<K extends keyof RTCIceGathererEventMap>(type: K, listener: (this: RTCIceGatherer, ev: RTCIceGathererEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof RTCIceGathererEventMap>(type: K, listener: (this: RTCIceGatherer, ev: RTCIceGathererEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface RTCIceGathererEvent extends Event {
+    readonly candidate: RTCIceCandidateDictionary | RTCIceCandidateComplete;
+}
+
+
+export interface RTCIceTransportEventMap {
+    "gatheringstatechange": Event;
+    "selectedcandidatepairchange": Event;
+    "statechange": Event;
+}
+
+/** Provides access to information about the ICE transport layer over which the data is being sent and received. */
+export interface RTCIceTransport extends EventTarget {
+    readonly component: RTCIceComponent;
+    readonly gatheringState: RTCIceGathererState;
+    ongatheringstatechange: ((this: RTCIceTransport, ev: Event) => any) | null;
+    onselectedcandidatepairchange: ((this: RTCIceTransport, ev: Event) => any) | null;
+    onstatechange: ((this: RTCIceTransport, ev: Event) => any) | null;
+    readonly role: RTCIceRole;
+    readonly state: RTCIceTransportState;
+    getLocalCandidates(): RTCIceCandidate[];
+    getLocalParameters(): RTCIceParameters | null;
+    getRemoteCandidates(): RTCIceCandidate[];
+    getRemoteParameters(): RTCIceParameters | null;
+    getSelectedCandidatePair(): RTCIceCandidatePair | null;
+    addEventListener<K extends keyof RTCIceTransportEventMap>(type: K, listener: (this: RTCIceTransport, ev: RTCIceTransportEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof RTCIceTransportEventMap>(type: K, listener: (this: RTCIceTransport, ev: RTCIceTransportEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface RTCIceTransportStateChangedEvent extends Event {
+    readonly state: RTCIceTransportState;
+}
+
+
+export interface RTCIdentityAssertion {
+    idp: string;
+    name: string;
+}
+
+
+export interface RTCPeerConnectionEventMap {
+    "connectionstatechange": Event;
+    "datachannel": RTCDataChannelEvent;
+    "icecandidate": RTCPeerConnectionIceEvent;
+    "icecandidateerror": RTCPeerConnectionIceErrorEvent;
+    "iceconnectionstatechange": Event;
+    "icegatheringstatechange": Event;
+    "negotiationneeded": Event;
+    "signalingstatechange": Event;
+    "statsended": RTCStatsEvent;
+    "track": RTCTrackEvent;
+}
+
+/** A WebRTC connection between the local computer and a remote peer. It provides methods to connect to a remote peer, maintain and monitor the connection, and close the connection once it's no longer needed. */
+export interface RTCPeerConnection extends EventTarget {
+    readonly canTrickleIceCandidates: boolean | null;
+    readonly connectionState: RTCPeerConnectionState;
+    readonly currentLocalDescription: RTCSessionDescription | null;
+    readonly currentRemoteDescription: RTCSessionDescription | null;
+    readonly iceConnectionState: RTCIceConnectionState;
+    readonly iceGatheringState: RTCIceGatheringState;
+    readonly idpErrorInfo: string | null;
+    readonly idpLoginUrl: string | null;
+    readonly localDescription: RTCSessionDescription | null;
+    onconnectionstatechange: ((this: RTCPeerConnection, ev: Event) => any) | null;
+    ondatachannel: ((this: RTCPeerConnection, ev: RTCDataChannelEvent) => any) | null;
+    onicecandidate: ((this: RTCPeerConnection, ev: RTCPeerConnectionIceEvent) => any) | null;
+    onicecandidateerror: ((this: RTCPeerConnection, ev: RTCPeerConnectionIceErrorEvent) => any) | null;
+    oniceconnectionstatechange: ((this: RTCPeerConnection, ev: Event) => any) | null;
+    onicegatheringstatechange: ((this: RTCPeerConnection, ev: Event) => any) | null;
+    onnegotiationneeded: ((this: RTCPeerConnection, ev: Event) => any) | null;
+    onsignalingstatechange: ((this: RTCPeerConnection, ev: Event) => any) | null;
+    onstatsended: ((this: RTCPeerConnection, ev: RTCStatsEvent) => any) | null;
+    ontrack: ((this: RTCPeerConnection, ev: RTCTrackEvent) => any) | null;
+    readonly peerIdentity: Promise<RTCIdentityAssertion>;
+    readonly pendingLocalDescription: RTCSessionDescription | null;
+    readonly pendingRemoteDescription: RTCSessionDescription | null;
+    readonly remoteDescription: RTCSessionDescription | null;
+    readonly sctp: RTCSctpTransport | null;
+    readonly signalingState: RTCSignalingState;
+    addIceCandidate(candidate: RTCIceCandidateInit | RTCIceCandidate): Promise<void>;
+    addTrack(track: MediaStreamTrack, ...streams: MediaStream[]): RTCRtpSender;
+    addTransceiver(trackOrKind: MediaStreamTrack | string, init?: RTCRtpTransceiverInit): RTCRtpTransceiver;
+    close(): void;
+    createAnswer(options?: RTCOfferOptions): Promise<RTCSessionDescriptionInit>;
+    createDataChannel(label: string, dataChannelDict?: RTCDataChannelInit): RTCDataChannel;
+    createOffer(options?: RTCOfferOptions): Promise<RTCSessionDescriptionInit>;
+    getConfiguration(): RTCConfiguration;
+    getIdentityAssertion(): Promise<string>;
+    getReceivers(): RTCRtpReceiver[];
+    getSenders(): RTCRtpSender[];
+    getStats(selector?: MediaStreamTrack | null): Promise<RTCStatsReport>;
+    getTransceivers(): RTCRtpTransceiver[];
+    removeTrack(sender: RTCRtpSender): void;
+    setConfiguration(configuration: RTCConfiguration): void;
+    setIdentityProvider(provider: string, options?: RTCIdentityProviderOptions): void;
+    setLocalDescription(description: RTCSessionDescriptionInit): Promise<void>;
+    setRemoteDescription(description: RTCSessionDescriptionInit): Promise<void>;
+    addEventListener<K extends keyof RTCPeerConnectionEventMap>(type: K, listener: (this: RTCPeerConnection, ev: RTCPeerConnectionEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof RTCPeerConnectionEventMap>(type: K, listener: (this: RTCPeerConnection, ev: RTCPeerConnectionEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface RTCPeerConnectionIceErrorEvent extends Event {
+    readonly errorCode: number;
+    readonly errorText: string;
+    readonly hostCandidate: string;
+    readonly url: string;
+}
+
+
+/** Events that occurs in relation to ICE candidates with the target, usually an RTCPeerConnection. Only one event is of this type: icecandidate. */
+export interface RTCPeerConnectionIceEvent extends Event {
+    readonly candidate: RTCIceCandidate | null;
+    readonly url: string | null;
+}
+
+
+/** This WebRTC API interface manages the reception and decoding of data for a MediaStreamTrack on an RTCPeerConnection. */
+export interface RTCRtpReceiver {
+    readonly rtcpTransport: RTCDtlsTransport | null;
+    readonly track: MediaStreamTrack;
+    readonly transport: RTCDtlsTransport | null;
+    getContributingSources(): RTCRtpContributingSource[];
+    getParameters(): RTCRtpReceiveParameters;
+    getStats(): Promise<RTCStatsReport>;
+    getSynchronizationSources(): RTCRtpSynchronizationSource[];
+}
+
+
+/** Provides the ability to control and obtain details about how a particular MediaStreamTrack is encoded and sent to a remote peer. */
+export interface RTCRtpSender {
+    readonly dtmf: RTCDTMFSender | null;
+    readonly rtcpTransport: RTCDtlsTransport | null;
+    readonly track: MediaStreamTrack | null;
+    readonly transport: RTCDtlsTransport | null;
+    getParameters(): RTCRtpSendParameters;
+    getStats(): Promise<RTCStatsReport>;
+    replaceTrack(withTrack: MediaStreamTrack | null): Promise<void>;
+    setParameters(parameters: RTCRtpSendParameters): Promise<void>;
+    setStreams(...streams: MediaStream[]): void;
+}
+
+
+export interface RTCRtpTransceiver {
+    readonly currentDirection: RTCRtpTransceiverDirection | null;
+    direction: RTCRtpTransceiverDirection;
+    readonly mid: string | null;
+    readonly receiver: RTCRtpReceiver;
+    readonly sender: RTCRtpSender;
+    setCodecPreferences(codecs: RTCRtpCodecCapability[]): void;
+    stop(): void;
+}
+
+
+export interface RTCSctpTransportEventMap {
+    "statechange": Event;
+}
+
+export interface RTCSctpTransport extends EventTarget {
+    readonly maxChannels: number | null;
+    readonly maxMessageSize: number;
+    onstatechange: ((this: RTCSctpTransport, ev: Event) => any) | null;
+    readonly state: RTCSctpTransportState;
+    readonly transport: RTCDtlsTransport;
+    addEventListener<K extends keyof RTCSctpTransportEventMap>(type: K, listener: (this: RTCSctpTransport, ev: RTCSctpTransportEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof RTCSctpTransportEventMap>(type: K, listener: (this: RTCSctpTransport, ev: RTCSctpTransportEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** One end of a connection—or potential connection—and how it's configured. Each RTCSessionDescription consists of a description type indicating which part of the offer/answer negotiation process it describes and of the SDP descriptor of the session. */
+export interface RTCSessionDescription {
+    readonly sdp: string;
+    readonly type: RTCSdpType;
+    toJSON(): any;
+}
+
+
+export interface RTCSrtpSdesTransportEventMap {
+    "error": Event;
+}
+
+export interface RTCSrtpSdesTransport extends EventTarget {
+    onerror: ((this: RTCSrtpSdesTransport, ev: Event) => any) | null;
+    readonly transport: RTCIceTransport;
+    addEventListener<K extends keyof RTCSrtpSdesTransportEventMap>(type: K, listener: (this: RTCSrtpSdesTransport, ev: RTCSrtpSdesTransportEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof RTCSrtpSdesTransportEventMap>(type: K, listener: (this: RTCSrtpSdesTransport, ev: RTCSrtpSdesTransportEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface RTCSsrcConflictEvent extends Event {
+    readonly ssrc: number;
+}
+
+
+export interface RTCStatsEvent extends Event {
+    readonly report: RTCStatsReport;
+}
+
+
+export interface RTCStatsProvider extends EventTarget {
+    getStats(): Promise<RTCStatsReport>;
+    msGetStats(): Promise<RTCStatsReport>;
+}
+
+
+export interface RTCStatsReport {
+    forEach(callbackfn: (value: any, key: string, parent: RTCStatsReport) => void, thisArg?: any): void;
+}
+
+
+export interface RTCTrackEvent extends Event {
+    readonly receiver: RTCRtpReceiver;
+    readonly streams: ReadonlyArray<MediaStream>;
+    readonly track: MediaStreamTrack;
+    readonly transceiver: RTCRtpTransceiver;
+}
+
+
+export interface RadioNodeList extends NodeList {
+    value: string;
+}
+
+
+export interface RandomSource {
+    getRandomValues<T extends Int8Array | Uint8ClampedArray | Uint8Array | Int16Array | Uint16Array | Int32Array | Uint32Array>(array: T): T;
+}
+
+
+/** A fragment of a document that can contain nodes and parts of text nodes. */
+export interface Range extends AbstractRange {
+    /**
+     * Returns the node, furthest away from the document, that is an ancestor of both range's start node and end node.
+     */
+    readonly commonAncestorContainer: Node;
+    cloneContents(): DocumentFragment;
+    cloneRange(): Range;
+    collapse(toStart?: boolean): void;
+    compareBoundaryPoints(how: number, sourceRange: Range): number;
+    /**
+     * Returns −1 if the point is before the range, 0 if the point is in the range, and 1 if the point is after the range.
+     */
+    comparePoint(node: Node, offset: number): number;
+    createContextualFragment(fragment: string): DocumentFragment;
+    deleteContents(): void;
+    detach(): void;
+    extractContents(): DocumentFragment;
+    getBoundingClientRect(): DOMRect;
+    getClientRects(): DOMRectList;
+    insertNode(node: Node): void;
+    /**
+     * Returns whether range intersects node.
+     */
+    intersectsNode(node: Node): boolean;
+    isPointInRange(node: Node, offset: number): boolean;
+    selectNode(node: Node): void;
+    selectNodeContents(node: Node): void;
+    setEnd(node: Node, offset: number): void;
+    setEndAfter(node: Node): void;
+    setEndBefore(node: Node): void;
+    setStart(node: Node, offset: number): void;
+    setStartAfter(node: Node): void;
+    setStartBefore(node: Node): void;
+    surroundContents(newParent: Node): void;
+    toString(): string;
+    readonly END_TO_END: number;
+    readonly END_TO_START: number;
+    readonly START_TO_END: number;
+    readonly START_TO_START: number;
+}
+
+
+export interface ReadableByteStreamController {
+    readonly byobRequest: ReadableStreamBYOBRequest | undefined;
+    readonly desiredSize: number | null;
+    close(): void;
+    enqueue(chunk: ArrayBufferView): void;
+    error(error?: any): void;
+}
+
+/** This Streams API interface represents a readable stream of byte data. The Fetch API offers a concrete instance of a ReadableStream through the body property of a Response object. */
+export interface ReadableStream<R = any> {
+    readonly locked: boolean;
+    cancel(reason?: any): Promise<void>;
+    getReader(options: { mode: "byob" }): ReadableStreamBYOBReader;
+    getReader(): ReadableStreamDefaultReader<R>;
+    pipeThrough<T>({ writable, readable }: { writable: WritableStream<R>, readable: ReadableStream<T> }, options?: PipeOptions): ReadableStream<T>;
+    pipeTo(dest: WritableStream<R>, options?: PipeOptions): Promise<void>;
+    tee(): [ReadableStream<R>, ReadableStream<R>];
+}
+
+
+export interface ReadableStreamBYOBReader {
+    readonly closed: Promise<void>;
+    cancel(reason?: any): Promise<void>;
+    read<T extends ArrayBufferView>(view: T): Promise<ReadableStreamReadResult<T>>;
+    releaseLock(): void;
+}
+
+export interface ReadableStreamBYOBRequest {
+    readonly view: ArrayBufferView;
+    respond(bytesWritten: number): void;
+    respondWithNewView(view: ArrayBufferView): void;
+}
+
+export interface ReadableStreamDefaultController<R = any> {
+    readonly desiredSize: number | null;
+    close(): void;
+    enqueue(chunk: R): void;
+    error(error?: any): void;
+}
+
+export interface ReadableStreamDefaultReader<R = any> {
+    readonly closed: Promise<void>;
+    cancel(reason?: any): Promise<void>;
+    read(): Promise<ReadableStreamReadResult<R>>;
+    releaseLock(): void;
+}
+
+export interface ReadableStreamReader<R = any> {
+    cancel(): Promise<void>;
+    read(): Promise<ReadableStreamReadResult<R>>;
+    releaseLock(): void;
+}
+
+
+/** This Fetch API interface represents a resource request. */
+export interface Request extends Body {
+    /**
+     * Returns the cache mode associated with request, which is a string indicating how the request will interact with the browser's cache when fetching.
+     */
+    readonly cache: RequestCache;
+    /**
+     * Returns the credentials mode associated with request, which is a string indicating whether credentials will be sent with the request always, never, or only when sent to a same-origin URL.
+     */
+    readonly credentials: RequestCredentials;
+    /**
+     * Returns the kind of resource requested by request, e.g., "document" or "script".
+     */
+    readonly destination: RequestDestination;
+    /**
+     * Returns a Headers object consisting of the headers associated with request. Note that headers added in the network layer by the user agent will not be accounted for in this object, e.g., the "Host" header.
+     */
+    readonly headers: Headers;
+    /**
+     * Returns request's subresource integrity metadata, which is a cryptographic hash of the resource being fetched. Its value consists of multiple hashes separated by whitespace. [SRI]
+     */
+    readonly integrity: string;
+    /**
+     * Returns a boolean indicating whether or not request is for a history navigation (a.k.a. back-foward navigation).
+     */
+    readonly isHistoryNavigation: boolean;
+    /**
+     * Returns a boolean indicating whether or not request is for a reload navigation.
+     */
+    readonly isReloadNavigation: boolean;
+    /**
+     * Returns a boolean indicating whether or not request can outlive the global in which it was created.
+     */
+    readonly keepalive: boolean;
+    /**
+     * Returns request's HTTP method, which is "GET" by default.
+     */
+    readonly method: string;
+    /**
+     * Returns the mode associated with request, which is a string indicating whether the request will use CORS, or will be restricted to same-origin URLs.
+     */
+    readonly mode: RequestMode;
+    /**
+     * Returns the redirect mode associated with request, which is a string indicating how redirects for the request will be handled during fetching. A request will follow redirects by default.
+     */
+    readonly redirect: RequestRedirect;
+    /**
+     * Returns the referrer of request. Its value can be a same-origin URL if explicitly set in init, the empty string to indicate no referrer, and "about:client" when defaulting to the global's default. This is used during fetching to determine the value of the `Referer` header of the request being made.
+     */
+    readonly referrer: string;
+    /**
+     * Returns the referrer policy associated with request. This is used during fetching to compute the value of the request's referrer.
+     */
+    readonly referrerPolicy: ReferrerPolicy;
+    /**
+     * Returns the signal associated with request, which is an AbortSignal object indicating whether or not request has been aborted, and its abort event handler.
+     */
+    readonly signal: AbortSignal;
+    /**
+     * Returns the URL of request as a string.
+     */
+    readonly url: string;
+    clone(): Request;
+}
+
+
+/** This Fetch API interface represents the response to a request. */
+export interface Response extends Body {
+    readonly headers: Headers;
+    readonly ok: boolean;
+    readonly redirected: boolean;
+    readonly status: number;
+    readonly statusText: string;
+    readonly trailer: Promise<Headers>;
+    readonly type: ResponseType;
+    readonly url: string;
+    clone(): Response;
+}
+
+
+/** Provides access to the properties of <a> element, as well as methods to manipulate them. */
+export interface SVGAElement extends SVGGraphicsElement, SVGURIReference {
+    readonly target: SVGAnimatedString;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGAElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGAElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Used to represent a value that can be an <angle> or <number> value. An SVGAngle reflected through the animVal attribute is always read only. */
+export interface SVGAngle {
+    readonly unitType: number;
+    value: number;
+    valueAsString: string;
+    valueInSpecifiedUnits: number;
+    convertToSpecifiedUnits(unitType: number): void;
+    newValueSpecifiedUnits(unitType: number, valueInSpecifiedUnits: number): void;
+    readonly SVG_ANGLETYPE_DEG: number;
+    readonly SVG_ANGLETYPE_GRAD: number;
+    readonly SVG_ANGLETYPE_RAD: number;
+    readonly SVG_ANGLETYPE_UNKNOWN: number;
+    readonly SVG_ANGLETYPE_UNSPECIFIED: number;
+}
+
+
+export interface SVGAnimateElement extends SVGAnimationElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGAnimateElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGAnimateElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGAnimateMotionElement extends SVGAnimationElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGAnimateMotionElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGAnimateMotionElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGAnimateTransformElement extends SVGAnimationElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGAnimateTransformElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGAnimateTransformElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Used for attributes of basic type <angle> which can be animated. */
+export interface SVGAnimatedAngle {
+    readonly animVal: SVGAngle;
+    readonly baseVal: SVGAngle;
+}
+
+
+/** Used for attributes of type boolean which can be animated. */
+export interface SVGAnimatedBoolean {
+    readonly animVal: boolean;
+    baseVal: boolean;
+}
+
+
+/** Used for attributes whose value must be a constant from a particular enumeration and which can be animated. */
+export interface SVGAnimatedEnumeration {
+    readonly animVal: number;
+    baseVal: number;
+}
+
+
+/** Used for attributes of basic type <integer> which can be animated. */
+export interface SVGAnimatedInteger {
+    readonly animVal: number;
+    baseVal: number;
+}
+
+
+/** Used for attributes of basic type <length> which can be animated. */
+export interface SVGAnimatedLength {
+    readonly animVal: SVGLength;
+    readonly baseVal: SVGLength;
+}
+
+
+/** Used for attributes of type SVGLengthList which can be animated. */
+export interface SVGAnimatedLengthList {
+    readonly animVal: SVGLengthList;
+    readonly baseVal: SVGLengthList;
+}
+
+
+/** Used for attributes of basic type <Number> which can be animated. */
+export interface SVGAnimatedNumber {
+    readonly animVal: number;
+    baseVal: number;
+}
+
+
+/** The SVGAnimatedNumber interface is used for attributes which take a list of numbers and which can be animated. */
+export interface SVGAnimatedNumberList {
+    readonly animVal: SVGNumberList;
+    readonly baseVal: SVGNumberList;
+}
+
+
+export interface SVGAnimatedPoints {
+    readonly animatedPoints: SVGPointList;
+    readonly points: SVGPointList;
+}
+
+/** Used for attributes of type SVGPreserveAspectRatio which can be animated. */
+export interface SVGAnimatedPreserveAspectRatio {
+    readonly animVal: SVGPreserveAspectRatio;
+    readonly baseVal: SVGPreserveAspectRatio;
+}
+
+
+/** Used for attributes of basic SVGRect which can be animated. */
+export interface SVGAnimatedRect {
+    readonly animVal: DOMRectReadOnly;
+    readonly baseVal: DOMRect;
+}
+
+
+/** The SVGAnimatedString interface represents string attributes which can be animated from each SVG declaration. You need to create SVG attribute before doing anything else, everything should be declared inside this. */
+export interface SVGAnimatedString {
+    readonly animVal: string;
+    baseVal: string;
+}
+
+
+/** Used for attributes which take a list of numbers and which can be animated. */
+export interface SVGAnimatedTransformList {
+    readonly animVal: SVGTransformList;
+    readonly baseVal: SVGTransformList;
+}
+
+
+export interface SVGAnimationElement extends SVGElement {
+    readonly targetElement: SVGElement;
+    getCurrentTime(): number;
+    getSimpleDuration(): number;
+    getStartTime(): number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGAnimationElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGAnimationElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** An interface for the <circle> element. The circle element is defined by the cx and cy attributes that denote the coordinates of the centre of the circle. */
+export interface SVGCircleElement extends SVGGeometryElement {
+    readonly cx: SVGAnimatedLength;
+    readonly cy: SVGAnimatedLength;
+    readonly r: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGCircleElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGCircleElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides access to the properties of <clipPath> elements, as well as methods to manipulate them. */
+export interface SVGClipPathElement extends SVGElement {
+    readonly clipPathUnits: SVGAnimatedEnumeration;
+    readonly transform: SVGAnimatedTransformList;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGClipPathElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGClipPathElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A base interface used by the component transfer function interfaces. */
+export interface SVGComponentTransferFunctionElement extends SVGElement {
+    readonly amplitude: SVGAnimatedNumber;
+    readonly exponent: SVGAnimatedNumber;
+    readonly intercept: SVGAnimatedNumber;
+    readonly offset: SVGAnimatedNumber;
+    readonly slope: SVGAnimatedNumber;
+    readonly tableValues: SVGAnimatedNumberList;
+    readonly type: SVGAnimatedEnumeration;
+    readonly SVG_FECOMPONENTTRANSFER_TYPE_DISCRETE: number;
+    readonly SVG_FECOMPONENTTRANSFER_TYPE_GAMMA: number;
+    readonly SVG_FECOMPONENTTRANSFER_TYPE_IDENTITY: number;
+    readonly SVG_FECOMPONENTTRANSFER_TYPE_LINEAR: number;
+    readonly SVG_FECOMPONENTTRANSFER_TYPE_TABLE: number;
+    readonly SVG_FECOMPONENTTRANSFER_TYPE_UNKNOWN: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGComponentTransferFunctionElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGComponentTransferFunctionElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGCursorElement extends SVGElement {
+    readonly x: SVGAnimatedLength;
+    readonly y: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGCursorElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGCursorElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <defs> element. */
+export interface SVGDefsElement extends SVGGraphicsElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGDefsElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGDefsElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <desc> element. */
+export interface SVGDescElement extends SVGElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGDescElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGDescElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGElementEventMap extends ElementEventMap, GlobalEventHandlersEventMap, DocumentAndElementEventHandlersEventMap {
+}
+
+/** All of the SVG DOM interfaces that correspond directly to elements in the SVG language derive from the SVGElement interface. */
+export interface SVGElement extends Element, DocumentAndElementEventHandlers, ElementCSSInlineStyle, GlobalEventHandlers, HTMLOrSVGElement, SVGElementInstance {
+    /** @deprecated */
+    readonly className: any;
+    readonly ownerSVGElement: SVGSVGElement | null;
+    readonly viewportElement: SVGElement | null;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGElementInstance extends EventTarget {
+    readonly correspondingElement: SVGElement;
+    readonly correspondingUseElement: SVGUseElement;
+}
+
+
+export interface SVGElementInstanceList {
+    /** @deprecated */
+    readonly length: number;
+    /** @deprecated */
+    item(index: number): SVGElementInstance;
+}
+
+
+/** Provides access to the properties of <ellipse> elements. */
+export interface SVGEllipseElement extends SVGGeometryElement {
+    readonly cx: SVGAnimatedLength;
+    readonly cy: SVGAnimatedLength;
+    readonly rx: SVGAnimatedLength;
+    readonly ry: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGEllipseElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGEllipseElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feBlend> element. */
+export interface SVGFEBlendElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly in1: SVGAnimatedString;
+    readonly in2: SVGAnimatedString;
+    readonly mode: SVGAnimatedEnumeration;
+    readonly SVG_FEBLEND_MODE_COLOR: number;
+    readonly SVG_FEBLEND_MODE_COLOR_BURN: number;
+    readonly SVG_FEBLEND_MODE_COLOR_DODGE: number;
+    readonly SVG_FEBLEND_MODE_DARKEN: number;
+    readonly SVG_FEBLEND_MODE_DIFFERENCE: number;
+    readonly SVG_FEBLEND_MODE_EXCLUSION: number;
+    readonly SVG_FEBLEND_MODE_HARD_LIGHT: number;
+    readonly SVG_FEBLEND_MODE_HUE: number;
+    readonly SVG_FEBLEND_MODE_LIGHTEN: number;
+    readonly SVG_FEBLEND_MODE_LUMINOSITY: number;
+    readonly SVG_FEBLEND_MODE_MULTIPLY: number;
+    readonly SVG_FEBLEND_MODE_NORMAL: number;
+    readonly SVG_FEBLEND_MODE_OVERLAY: number;
+    readonly SVG_FEBLEND_MODE_SATURATION: number;
+    readonly SVG_FEBLEND_MODE_SCREEN: number;
+    readonly SVG_FEBLEND_MODE_SOFT_LIGHT: number;
+    readonly SVG_FEBLEND_MODE_UNKNOWN: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEBlendElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEBlendElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feColorMatrix> element. */
+export interface SVGFEColorMatrixElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly in1: SVGAnimatedString;
+    readonly type: SVGAnimatedEnumeration;
+    readonly values: SVGAnimatedNumberList;
+    readonly SVG_FECOLORMATRIX_TYPE_HUEROTATE: number;
+    readonly SVG_FECOLORMATRIX_TYPE_LUMINANCETOALPHA: number;
+    readonly SVG_FECOLORMATRIX_TYPE_MATRIX: number;
+    readonly SVG_FECOLORMATRIX_TYPE_SATURATE: number;
+    readonly SVG_FECOLORMATRIX_TYPE_UNKNOWN: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEColorMatrixElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEColorMatrixElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feComponentTransfer> element. */
+export interface SVGFEComponentTransferElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly in1: SVGAnimatedString;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEComponentTransferElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEComponentTransferElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feComposite> element. */
+export interface SVGFECompositeElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly in1: SVGAnimatedString;
+    readonly in2: SVGAnimatedString;
+    readonly k1: SVGAnimatedNumber;
+    readonly k2: SVGAnimatedNumber;
+    readonly k3: SVGAnimatedNumber;
+    readonly k4: SVGAnimatedNumber;
+    readonly operator: SVGAnimatedEnumeration;
+    readonly SVG_FECOMPOSITE_OPERATOR_ARITHMETIC: number;
+    readonly SVG_FECOMPOSITE_OPERATOR_ATOP: number;
+    readonly SVG_FECOMPOSITE_OPERATOR_IN: number;
+    readonly SVG_FECOMPOSITE_OPERATOR_OUT: number;
+    readonly SVG_FECOMPOSITE_OPERATOR_OVER: number;
+    readonly SVG_FECOMPOSITE_OPERATOR_UNKNOWN: number;
+    readonly SVG_FECOMPOSITE_OPERATOR_XOR: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFECompositeElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFECompositeElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feConvolveMatrix> element. */
+export interface SVGFEConvolveMatrixElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly bias: SVGAnimatedNumber;
+    readonly divisor: SVGAnimatedNumber;
+    readonly edgeMode: SVGAnimatedEnumeration;
+    readonly in1: SVGAnimatedString;
+    readonly kernelMatrix: SVGAnimatedNumberList;
+    readonly kernelUnitLengthX: SVGAnimatedNumber;
+    readonly kernelUnitLengthY: SVGAnimatedNumber;
+    readonly orderX: SVGAnimatedInteger;
+    readonly orderY: SVGAnimatedInteger;
+    readonly preserveAlpha: SVGAnimatedBoolean;
+    readonly targetX: SVGAnimatedInteger;
+    readonly targetY: SVGAnimatedInteger;
+    readonly SVG_EDGEMODE_DUPLICATE: number;
+    readonly SVG_EDGEMODE_NONE: number;
+    readonly SVG_EDGEMODE_UNKNOWN: number;
+    readonly SVG_EDGEMODE_WRAP: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEConvolveMatrixElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEConvolveMatrixElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feDiffuseLighting> element. */
+export interface SVGFEDiffuseLightingElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly diffuseConstant: SVGAnimatedNumber;
+    readonly in1: SVGAnimatedString;
+    readonly kernelUnitLengthX: SVGAnimatedNumber;
+    readonly kernelUnitLengthY: SVGAnimatedNumber;
+    readonly surfaceScale: SVGAnimatedNumber;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEDiffuseLightingElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEDiffuseLightingElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feDisplacementMap> element. */
+export interface SVGFEDisplacementMapElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly in1: SVGAnimatedString;
+    readonly in2: SVGAnimatedString;
+    readonly scale: SVGAnimatedNumber;
+    readonly xChannelSelector: SVGAnimatedEnumeration;
+    readonly yChannelSelector: SVGAnimatedEnumeration;
+    readonly SVG_CHANNEL_A: number;
+    readonly SVG_CHANNEL_B: number;
+    readonly SVG_CHANNEL_G: number;
+    readonly SVG_CHANNEL_R: number;
+    readonly SVG_CHANNEL_UNKNOWN: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEDisplacementMapElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEDisplacementMapElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feDistantLight> element. */
+export interface SVGFEDistantLightElement extends SVGElement {
+    readonly azimuth: SVGAnimatedNumber;
+    readonly elevation: SVGAnimatedNumber;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEDistantLightElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEDistantLightElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGFEDropShadowElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly dx: SVGAnimatedNumber;
+    readonly dy: SVGAnimatedNumber;
+    readonly in1: SVGAnimatedString;
+    readonly stdDeviationX: SVGAnimatedNumber;
+    readonly stdDeviationY: SVGAnimatedNumber;
+    setStdDeviation(stdDeviationX: number, stdDeviationY: number): void;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEDropShadowElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEDropShadowElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feFlood> element. */
+export interface SVGFEFloodElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEFloodElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEFloodElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feFuncA> element. */
+export interface SVGFEFuncAElement extends SVGComponentTransferFunctionElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEFuncAElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEFuncAElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feFuncB> element. */
+export interface SVGFEFuncBElement extends SVGComponentTransferFunctionElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEFuncBElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEFuncBElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feFuncG> element. */
+export interface SVGFEFuncGElement extends SVGComponentTransferFunctionElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEFuncGElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEFuncGElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feFuncR> element. */
+export interface SVGFEFuncRElement extends SVGComponentTransferFunctionElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEFuncRElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEFuncRElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feGaussianBlur> element. */
+export interface SVGFEGaussianBlurElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly in1: SVGAnimatedString;
+    readonly stdDeviationX: SVGAnimatedNumber;
+    readonly stdDeviationY: SVGAnimatedNumber;
+    setStdDeviation(stdDeviationX: number, stdDeviationY: number): void;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEGaussianBlurElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEGaussianBlurElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feImage> element. */
+export interface SVGFEImageElement extends SVGElement, SVGFilterPrimitiveStandardAttributes, SVGURIReference {
+    readonly preserveAspectRatio: SVGAnimatedPreserveAspectRatio;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEImageElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEImageElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feMerge> element. */
+export interface SVGFEMergeElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEMergeElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEMergeElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feMergeNode> element. */
+export interface SVGFEMergeNodeElement extends SVGElement {
+    readonly in1: SVGAnimatedString;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEMergeNodeElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEMergeNodeElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feMorphology> element. */
+export interface SVGFEMorphologyElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly in1: SVGAnimatedString;
+    readonly operator: SVGAnimatedEnumeration;
+    readonly radiusX: SVGAnimatedNumber;
+    readonly radiusY: SVGAnimatedNumber;
+    readonly SVG_MORPHOLOGY_OPERATOR_DILATE: number;
+    readonly SVG_MORPHOLOGY_OPERATOR_ERODE: number;
+    readonly SVG_MORPHOLOGY_OPERATOR_UNKNOWN: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEMorphologyElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEMorphologyElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feOffset> element. */
+export interface SVGFEOffsetElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly dx: SVGAnimatedNumber;
+    readonly dy: SVGAnimatedNumber;
+    readonly in1: SVGAnimatedString;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEOffsetElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEOffsetElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <fePointLight> element. */
+export interface SVGFEPointLightElement extends SVGElement {
+    readonly x: SVGAnimatedNumber;
+    readonly y: SVGAnimatedNumber;
+    readonly z: SVGAnimatedNumber;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEPointLightElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFEPointLightElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feSpecularLighting> element. */
+export interface SVGFESpecularLightingElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly in1: SVGAnimatedString;
+    readonly kernelUnitLengthX: SVGAnimatedNumber;
+    readonly kernelUnitLengthY: SVGAnimatedNumber;
+    readonly specularConstant: SVGAnimatedNumber;
+    readonly specularExponent: SVGAnimatedNumber;
+    readonly surfaceScale: SVGAnimatedNumber;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFESpecularLightingElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFESpecularLightingElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feSpotLight> element. */
+export interface SVGFESpotLightElement extends SVGElement {
+    readonly limitingConeAngle: SVGAnimatedNumber;
+    readonly pointsAtX: SVGAnimatedNumber;
+    readonly pointsAtY: SVGAnimatedNumber;
+    readonly pointsAtZ: SVGAnimatedNumber;
+    readonly specularExponent: SVGAnimatedNumber;
+    readonly x: SVGAnimatedNumber;
+    readonly y: SVGAnimatedNumber;
+    readonly z: SVGAnimatedNumber;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFESpotLightElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFESpotLightElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feTile> element. */
+export interface SVGFETileElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly in1: SVGAnimatedString;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFETileElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFETileElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <feTurbulence> element. */
+export interface SVGFETurbulenceElement extends SVGElement, SVGFilterPrimitiveStandardAttributes {
+    readonly baseFrequencyX: SVGAnimatedNumber;
+    readonly baseFrequencyY: SVGAnimatedNumber;
+    readonly numOctaves: SVGAnimatedInteger;
+    readonly seed: SVGAnimatedNumber;
+    readonly stitchTiles: SVGAnimatedEnumeration;
+    readonly type: SVGAnimatedEnumeration;
+    readonly SVG_STITCHTYPE_NOSTITCH: number;
+    readonly SVG_STITCHTYPE_STITCH: number;
+    readonly SVG_STITCHTYPE_UNKNOWN: number;
+    readonly SVG_TURBULENCE_TYPE_FRACTALNOISE: number;
+    readonly SVG_TURBULENCE_TYPE_TURBULENCE: number;
+    readonly SVG_TURBULENCE_TYPE_UNKNOWN: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFETurbulenceElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFETurbulenceElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides access to the properties of <filter> elements, as well as methods to manipulate them. */
+export interface SVGFilterElement extends SVGElement, SVGURIReference {
+    readonly filterUnits: SVGAnimatedEnumeration;
+    readonly height: SVGAnimatedLength;
+    readonly primitiveUnits: SVGAnimatedEnumeration;
+    readonly width: SVGAnimatedLength;
+    readonly x: SVGAnimatedLength;
+    readonly y: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFilterElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGFilterElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGFilterPrimitiveStandardAttributes {
+    readonly height: SVGAnimatedLength;
+    readonly result: SVGAnimatedString;
+    readonly width: SVGAnimatedLength;
+    readonly x: SVGAnimatedLength;
+    readonly y: SVGAnimatedLength;
+}
+
+export interface SVGFitToViewBox {
+    readonly preserveAspectRatio: SVGAnimatedPreserveAspectRatio;
+    readonly viewBox: SVGAnimatedRect;
+}
+
+/** Provides access to the properties of <foreignObject> elements, as well as methods to manipulate them. */
+export interface SVGForeignObjectElement extends SVGGraphicsElement {
+    readonly height: SVGAnimatedLength;
+    readonly width: SVGAnimatedLength;
+    readonly x: SVGAnimatedLength;
+    readonly y: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGForeignObjectElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGForeignObjectElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <g> element. */
+export interface SVGGElement extends SVGGraphicsElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGGElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGGElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGGeometryElement extends SVGGraphicsElement {
+    readonly pathLength: SVGAnimatedNumber;
+    getPointAtLength(distance: number): DOMPoint;
+    getTotalLength(): number;
+    isPointInFill(point?: DOMPointInit): boolean;
+    isPointInStroke(point?: DOMPointInit): boolean;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGGeometryElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGGeometryElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** The SVGGradient interface is a base interface used by SVGLinearGradientElement and SVGRadialGradientElement. */
+export interface SVGGradientElement extends SVGElement, SVGURIReference {
+    readonly gradientTransform: SVGAnimatedTransformList;
+    readonly gradientUnits: SVGAnimatedEnumeration;
+    readonly spreadMethod: SVGAnimatedEnumeration;
+    readonly SVG_SPREADMETHOD_PAD: number;
+    readonly SVG_SPREADMETHOD_REFLECT: number;
+    readonly SVG_SPREADMETHOD_REPEAT: number;
+    readonly SVG_SPREADMETHOD_UNKNOWN: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGGradientElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGGradientElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** SVG elements whose primary purpose is to directly render graphics into a group. */
+export interface SVGGraphicsElement extends SVGElement, SVGTests {
+    readonly transform: SVGAnimatedTransformList;
+    getBBox(options?: SVGBoundingBoxOptions): DOMRect;
+    getCTM(): DOMMatrix | null;
+    getScreenCTM(): DOMMatrix | null;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGGraphicsElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGGraphicsElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <image> element. */
+export interface SVGImageElement extends SVGGraphicsElement, SVGURIReference {
+    readonly height: SVGAnimatedLength;
+    readonly preserveAspectRatio: SVGAnimatedPreserveAspectRatio;
+    readonly width: SVGAnimatedLength;
+    readonly x: SVGAnimatedLength;
+    readonly y: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGImageElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGImageElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Correspond to the <length> basic data type. */
+export interface SVGLength {
+    readonly unitType: number;
+    value: number;
+    valueAsString: string;
+    valueInSpecifiedUnits: number;
+    convertToSpecifiedUnits(unitType: number): void;
+    newValueSpecifiedUnits(unitType: number, valueInSpecifiedUnits: number): void;
+    readonly SVG_LENGTHTYPE_CM: number;
+    readonly SVG_LENGTHTYPE_EMS: number;
+    readonly SVG_LENGTHTYPE_EXS: number;
+    readonly SVG_LENGTHTYPE_IN: number;
+    readonly SVG_LENGTHTYPE_MM: number;
+    readonly SVG_LENGTHTYPE_NUMBER: number;
+    readonly SVG_LENGTHTYPE_PC: number;
+    readonly SVG_LENGTHTYPE_PERCENTAGE: number;
+    readonly SVG_LENGTHTYPE_PT: number;
+    readonly SVG_LENGTHTYPE_PX: number;
+    readonly SVG_LENGTHTYPE_UNKNOWN: number;
+}
+
+
+/** The SVGLengthList defines a list of SVGLength objects. */
+export interface SVGLengthList {
+    readonly length: number;
+    readonly numberOfItems: number;
+    appendItem(newItem: SVGLength): SVGLength;
+    clear(): void;
+    getItem(index: number): SVGLength;
+    initialize(newItem: SVGLength): SVGLength;
+    insertItemBefore(newItem: SVGLength, index: number): SVGLength;
+    removeItem(index: number): SVGLength;
+    replaceItem(newItem: SVGLength, index: number): SVGLength;
+    [index: number]: SVGLength;
+}
+
+
+/** Provides access to the properties of <line> elements, as well as methods to manipulate them. */
+export interface SVGLineElement extends SVGGeometryElement {
+    readonly x1: SVGAnimatedLength;
+    readonly x2: SVGAnimatedLength;
+    readonly y1: SVGAnimatedLength;
+    readonly y2: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGLineElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGLineElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <linearGradient> element. */
+export interface SVGLinearGradientElement extends SVGGradientElement {
+    readonly x1: SVGAnimatedLength;
+    readonly x2: SVGAnimatedLength;
+    readonly y1: SVGAnimatedLength;
+    readonly y2: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGLinearGradientElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGLinearGradientElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGMarkerElement extends SVGElement, SVGFitToViewBox {
+    readonly markerHeight: SVGAnimatedLength;
+    readonly markerUnits: SVGAnimatedEnumeration;
+    readonly markerWidth: SVGAnimatedLength;
+    readonly orientAngle: SVGAnimatedAngle;
+    readonly orientType: SVGAnimatedEnumeration;
+    readonly refX: SVGAnimatedLength;
+    readonly refY: SVGAnimatedLength;
+    setOrientToAngle(angle: SVGAngle): void;
+    setOrientToAuto(): void;
+    readonly SVG_MARKERUNITS_STROKEWIDTH: number;
+    readonly SVG_MARKERUNITS_UNKNOWN: number;
+    readonly SVG_MARKERUNITS_USERSPACEONUSE: number;
+    readonly SVG_MARKER_ORIENT_ANGLE: number;
+    readonly SVG_MARKER_ORIENT_AUTO: number;
+    readonly SVG_MARKER_ORIENT_UNKNOWN: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGMarkerElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGMarkerElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides access to the properties of <mask> elements, as well as methods to manipulate them. */
+export interface SVGMaskElement extends SVGElement {
+    readonly height: SVGAnimatedLength;
+    readonly maskContentUnits: SVGAnimatedEnumeration;
+    readonly maskUnits: SVGAnimatedEnumeration;
+    readonly width: SVGAnimatedLength;
+    readonly x: SVGAnimatedLength;
+    readonly y: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGMaskElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGMaskElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <metadata> element. */
+export interface SVGMetadataElement extends SVGElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGMetadataElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGMetadataElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <number> basic data type. */
+export interface SVGNumber {
+    value: number;
+}
+
+
+/** The SVGNumberList defines a list of SVGNumber objects. */
+export interface SVGNumberList {
+    readonly length: number;
+    readonly numberOfItems: number;
+    appendItem(newItem: SVGNumber): SVGNumber;
+    clear(): void;
+    getItem(index: number): SVGNumber;
+    initialize(newItem: SVGNumber): SVGNumber;
+    insertItemBefore(newItem: SVGNumber, index: number): SVGNumber;
+    removeItem(index: number): SVGNumber;
+    replaceItem(newItem: SVGNumber, index: number): SVGNumber;
+    [index: number]: SVGNumber;
+}
+
+
+/** Corresponds to the <path> element. */
+export interface SVGPathElement extends SVGGraphicsElement {
+    /** @deprecated */
+    readonly pathSegList: SVGPathSegList;
+    /** @deprecated */
+    createSVGPathSegArcAbs(x: number, y: number, r1: number, r2: number, angle: number, largeArcFlag: boolean, sweepFlag: boolean): SVGPathSegArcAbs;
+    /** @deprecated */
+    createSVGPathSegArcRel(x: number, y: number, r1: number, r2: number, angle: number, largeArcFlag: boolean, sweepFlag: boolean): SVGPathSegArcRel;
+    /** @deprecated */
+    createSVGPathSegClosePath(): SVGPathSegClosePath;
+    /** @deprecated */
+    createSVGPathSegCurvetoCubicAbs(x: number, y: number, x1: number, y1: number, x2: number, y2: number): SVGPathSegCurvetoCubicAbs;
+    /** @deprecated */
+    createSVGPathSegCurvetoCubicRel(x: number, y: number, x1: number, y1: number, x2: number, y2: number): SVGPathSegCurvetoCubicRel;
+    /** @deprecated */
+    createSVGPathSegCurvetoCubicSmoothAbs(x: number, y: number, x2: number, y2: number): SVGPathSegCurvetoCubicSmoothAbs;
+    /** @deprecated */
+    createSVGPathSegCurvetoCubicSmoothRel(x: number, y: number, x2: number, y2: number): SVGPathSegCurvetoCubicSmoothRel;
+    /** @deprecated */
+    createSVGPathSegCurvetoQuadraticAbs(x: number, y: number, x1: number, y1: number): SVGPathSegCurvetoQuadraticAbs;
+    /** @deprecated */
+    createSVGPathSegCurvetoQuadraticRel(x: number, y: number, x1: number, y1: number): SVGPathSegCurvetoQuadraticRel;
+    /** @deprecated */
+    createSVGPathSegCurvetoQuadraticSmoothAbs(x: number, y: number): SVGPathSegCurvetoQuadraticSmoothAbs;
+    /** @deprecated */
+    createSVGPathSegCurvetoQuadraticSmoothRel(x: number, y: number): SVGPathSegCurvetoQuadraticSmoothRel;
+    /** @deprecated */
+    createSVGPathSegLinetoAbs(x: number, y: number): SVGPathSegLinetoAbs;
+    /** @deprecated */
+    createSVGPathSegLinetoHorizontalAbs(x: number): SVGPathSegLinetoHorizontalAbs;
+    /** @deprecated */
+    createSVGPathSegLinetoHorizontalRel(x: number): SVGPathSegLinetoHorizontalRel;
+    /** @deprecated */
+    createSVGPathSegLinetoRel(x: number, y: number): SVGPathSegLinetoRel;
+    /** @deprecated */
+    createSVGPathSegLinetoVerticalAbs(y: number): SVGPathSegLinetoVerticalAbs;
+    /** @deprecated */
+    createSVGPathSegLinetoVerticalRel(y: number): SVGPathSegLinetoVerticalRel;
+    /** @deprecated */
+    createSVGPathSegMovetoAbs(x: number, y: number): SVGPathSegMovetoAbs;
+    /** @deprecated */
+    createSVGPathSegMovetoRel(x: number, y: number): SVGPathSegMovetoRel;
+    /** @deprecated */
+    getPathSegAtLength(distance: number): number;
+    getPointAtLength(distance: number): SVGPoint;
+    getTotalLength(): number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGPathElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGPathElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGPathSeg {
+    readonly pathSegType: number;
+    readonly pathSegTypeAsLetter: string;
+    readonly PATHSEG_ARC_ABS: number;
+    readonly PATHSEG_ARC_REL: number;
+    readonly PATHSEG_CLOSEPATH: number;
+    readonly PATHSEG_CURVETO_CUBIC_ABS: number;
+    readonly PATHSEG_CURVETO_CUBIC_REL: number;
+    readonly PATHSEG_CURVETO_CUBIC_SMOOTH_ABS: number;
+    readonly PATHSEG_CURVETO_CUBIC_SMOOTH_REL: number;
+    readonly PATHSEG_CURVETO_QUADRATIC_ABS: number;
+    readonly PATHSEG_CURVETO_QUADRATIC_REL: number;
+    readonly PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS: number;
+    readonly PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL: number;
+    readonly PATHSEG_LINETO_ABS: number;
+    readonly PATHSEG_LINETO_HORIZONTAL_ABS: number;
+    readonly PATHSEG_LINETO_HORIZONTAL_REL: number;
+    readonly PATHSEG_LINETO_REL: number;
+    readonly PATHSEG_LINETO_VERTICAL_ABS: number;
+    readonly PATHSEG_LINETO_VERTICAL_REL: number;
+    readonly PATHSEG_MOVETO_ABS: number;
+    readonly PATHSEG_MOVETO_REL: number;
+    readonly PATHSEG_UNKNOWN: number;
+}
+
+
+export interface SVGPathSegArcAbs extends SVGPathSeg {
+    angle: number;
+    largeArcFlag: boolean;
+    r1: number;
+    r2: number;
+    sweepFlag: boolean;
+    x: number;
+    y: number;
+}
+
+
+export interface SVGPathSegArcRel extends SVGPathSeg {
+    angle: number;
+    largeArcFlag: boolean;
+    r1: number;
+    r2: number;
+    sweepFlag: boolean;
+    x: number;
+    y: number;
+}
+
+
+export interface SVGPathSegClosePath extends SVGPathSeg {
+}
+
+
+export interface SVGPathSegCurvetoCubicAbs extends SVGPathSeg {
+    x: number;
+    x1: number;
+    x2: number;
+    y: number;
+    y1: number;
+    y2: number;
+}
+
+
+export interface SVGPathSegCurvetoCubicRel extends SVGPathSeg {
+    x: number;
+    x1: number;
+    x2: number;
+    y: number;
+    y1: number;
+    y2: number;
+}
+
+
+export interface SVGPathSegCurvetoCubicSmoothAbs extends SVGPathSeg {
+    x: number;
+    x2: number;
+    y: number;
+    y2: number;
+}
+
+
+export interface SVGPathSegCurvetoCubicSmoothRel extends SVGPathSeg {
+    x: number;
+    x2: number;
+    y: number;
+    y2: number;
+}
+
+
+export interface SVGPathSegCurvetoQuadraticAbs extends SVGPathSeg {
+    x: number;
+    x1: number;
+    y: number;
+    y1: number;
+}
+
+
+export interface SVGPathSegCurvetoQuadraticRel extends SVGPathSeg {
+    x: number;
+    x1: number;
+    y: number;
+    y1: number;
+}
+
+
+export interface SVGPathSegCurvetoQuadraticSmoothAbs extends SVGPathSeg {
+    x: number;
+    y: number;
+}
+
+
+export interface SVGPathSegCurvetoQuadraticSmoothRel extends SVGPathSeg {
+    x: number;
+    y: number;
+}
+
+
+export interface SVGPathSegLinetoAbs extends SVGPathSeg {
+    x: number;
+    y: number;
+}
+
+
+export interface SVGPathSegLinetoHorizontalAbs extends SVGPathSeg {
+    x: number;
+}
+
+
+export interface SVGPathSegLinetoHorizontalRel extends SVGPathSeg {
+    x: number;
+}
+
+
+export interface SVGPathSegLinetoRel extends SVGPathSeg {
+    x: number;
+    y: number;
+}
+
+
+export interface SVGPathSegLinetoVerticalAbs extends SVGPathSeg {
+    y: number;
+}
+
+
+export interface SVGPathSegLinetoVerticalRel extends SVGPathSeg {
+    y: number;
+}
+
+
+export interface SVGPathSegList {
+    readonly numberOfItems: number;
+    appendItem(newItem: SVGPathSeg): SVGPathSeg;
+    clear(): void;
+    getItem(index: number): SVGPathSeg;
+    initialize(newItem: SVGPathSeg): SVGPathSeg;
+    insertItemBefore(newItem: SVGPathSeg, index: number): SVGPathSeg;
+    removeItem(index: number): SVGPathSeg;
+    replaceItem(newItem: SVGPathSeg, index: number): SVGPathSeg;
+}
+
+
+export interface SVGPathSegMovetoAbs extends SVGPathSeg {
+    x: number;
+    y: number;
+}
+
+
+export interface SVGPathSegMovetoRel extends SVGPathSeg {
+    x: number;
+    y: number;
+}
+
+
+/** Corresponds to the <pattern> element. */
+export interface SVGPatternElement extends SVGElement, SVGFitToViewBox, SVGURIReference {
+    readonly height: SVGAnimatedLength;
+    readonly patternContentUnits: SVGAnimatedEnumeration;
+    readonly patternTransform: SVGAnimatedTransformList;
+    readonly patternUnits: SVGAnimatedEnumeration;
+    readonly width: SVGAnimatedLength;
+    readonly x: SVGAnimatedLength;
+    readonly y: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGPatternElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGPatternElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGPointList {
+    readonly length: number;
+    readonly numberOfItems: number;
+    appendItem(newItem: DOMPoint): DOMPoint;
+    clear(): void;
+    getItem(index: number): DOMPoint;
+    initialize(newItem: DOMPoint): DOMPoint;
+    insertItemBefore(newItem: DOMPoint, index: number): DOMPoint;
+    removeItem(index: number): DOMPoint;
+    replaceItem(newItem: DOMPoint, index: number): DOMPoint;
+    [index: number]: DOMPoint;
+}
+
+
+/** Provides access to the properties of <polygon> elements, as well as methods to manipulate them. */
+export interface SVGPolygonElement extends SVGGeometryElement, SVGAnimatedPoints {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGPolygonElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGPolygonElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides access to the properties of <polyline> elements, as well as methods to manipulate them. */
+export interface SVGPolylineElement extends SVGGeometryElement, SVGAnimatedPoints {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGPolylineElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGPolylineElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the preserveAspectRatio attribute, which is available for some of SVG's elements. */
+export interface SVGPreserveAspectRatio {
+    align: number;
+    meetOrSlice: number;
+    readonly SVG_MEETORSLICE_MEET: number;
+    readonly SVG_MEETORSLICE_SLICE: number;
+    readonly SVG_MEETORSLICE_UNKNOWN: number;
+    readonly SVG_PRESERVEASPECTRATIO_NONE: number;
+    readonly SVG_PRESERVEASPECTRATIO_UNKNOWN: number;
+    readonly SVG_PRESERVEASPECTRATIO_XMAXYMAX: number;
+    readonly SVG_PRESERVEASPECTRATIO_XMAXYMID: number;
+    readonly SVG_PRESERVEASPECTRATIO_XMAXYMIN: number;
+    readonly SVG_PRESERVEASPECTRATIO_XMIDYMAX: number;
+    readonly SVG_PRESERVEASPECTRATIO_XMIDYMID: number;
+    readonly SVG_PRESERVEASPECTRATIO_XMIDYMIN: number;
+    readonly SVG_PRESERVEASPECTRATIO_XMINYMAX: number;
+    readonly SVG_PRESERVEASPECTRATIO_XMINYMID: number;
+    readonly SVG_PRESERVEASPECTRATIO_XMINYMIN: number;
+}
+
+
+/** Corresponds to the <RadialGradient> element. */
+export interface SVGRadialGradientElement extends SVGGradientElement {
+    readonly cx: SVGAnimatedLength;
+    readonly cy: SVGAnimatedLength;
+    readonly fr: SVGAnimatedLength;
+    readonly fx: SVGAnimatedLength;
+    readonly fy: SVGAnimatedLength;
+    readonly r: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGRadialGradientElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGRadialGradientElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides access to the properties of <rect> elements, as well as methods to manipulate them. */
+export interface SVGRectElement extends SVGGeometryElement {
+    readonly height: SVGAnimatedLength;
+    readonly rx: SVGAnimatedLength;
+    readonly ry: SVGAnimatedLength;
+    readonly width: SVGAnimatedLength;
+    readonly x: SVGAnimatedLength;
+    readonly y: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGRectElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGRectElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGSVGElementEventMap extends SVGElementEventMap {
+    "SVGUnload": Event;
+    "SVGZoom": SVGZoomEvent;
+}
+
+/** Provides access to the properties of <svg> elements, as well as methods to manipulate them. This interface contains also various miscellaneous commonly-used utility methods, such as matrix operations and the ability to control the time of redraw on visual rendering devices. */
+export interface SVGSVGElement extends SVGGraphicsElement, DocumentEvent, SVGFitToViewBox, SVGZoomAndPan {
+    /** @deprecated */
+    contentScriptType: string;
+    /** @deprecated */
+    contentStyleType: string;
+    currentScale: number;
+    readonly currentTranslate: SVGPoint;
+    readonly height: SVGAnimatedLength;
+    onunload: ((this: SVGSVGElement, ev: Event) => any) | null;
+    onzoom: ((this: SVGSVGElement, ev: SVGZoomEvent) => any) | null;
+    /** @deprecated */
+    readonly pixelUnitToMillimeterX: number;
+    /** @deprecated */
+    readonly pixelUnitToMillimeterY: number;
+    /** @deprecated */
+    readonly screenPixelToMillimeterX: number;
+    /** @deprecated */
+    readonly screenPixelToMillimeterY: number;
+    /** @deprecated */
+    readonly viewport: SVGRect;
+    readonly width: SVGAnimatedLength;
+    readonly x: SVGAnimatedLength;
+    readonly y: SVGAnimatedLength;
+    animationsPaused(): boolean;
+    checkEnclosure(element: SVGElement, rect: SVGRect): boolean;
+    checkIntersection(element: SVGElement, rect: SVGRect): boolean;
+    createSVGAngle(): SVGAngle;
+    createSVGLength(): SVGLength;
+    createSVGMatrix(): SVGMatrix;
+    createSVGNumber(): SVGNumber;
+    createSVGPoint(): SVGPoint;
+    createSVGRect(): SVGRect;
+    createSVGTransform(): SVGTransform;
+    createSVGTransformFromMatrix(matrix: SVGMatrix): SVGTransform;
+    deselectAll(): void;
+    /** @deprecated */
+    forceRedraw(): void;
+    getComputedStyle(elt: Element, pseudoElt?: string | null): CSSStyleDeclaration;
+    getCurrentTime(): number;
+    getElementById(elementId: string): Element;
+    getEnclosureList(rect: SVGRect, referenceElement: SVGElement): NodeListOf<SVGCircleElement | SVGEllipseElement | SVGImageElement | SVGLineElement | SVGPathElement | SVGPolygonElement | SVGPolylineElement | SVGRectElement | SVGTextElement | SVGUseElement>;
+    getIntersectionList(rect: SVGRect, referenceElement: SVGElement): NodeListOf<SVGCircleElement | SVGEllipseElement | SVGImageElement | SVGLineElement | SVGPathElement | SVGPolygonElement | SVGPolylineElement | SVGRectElement | SVGTextElement | SVGUseElement>;
+    pauseAnimations(): void;
+    setCurrentTime(seconds: number): void;
+    /** @deprecated */
+    suspendRedraw(maxWaitMilliseconds: number): number;
+    unpauseAnimations(): void;
+    /** @deprecated */
+    unsuspendRedraw(suspendHandleID: number): void;
+    /** @deprecated */
+    unsuspendRedrawAll(): void;
+    addEventListener<K extends keyof SVGSVGElementEventMap>(type: K, listener: (this: SVGSVGElement, ev: SVGSVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGSVGElementEventMap>(type: K, listener: (this: SVGSVGElement, ev: SVGSVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the SVG <script> element. */
+export interface SVGScriptElement extends SVGElement, SVGURIReference {
+    type: string;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGScriptElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGScriptElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <stop> element. */
+export interface SVGStopElement extends SVGElement {
+    readonly offset: SVGAnimatedNumber;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGStopElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGStopElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** The SVGStringList defines a list of DOMString objects. */
+export interface SVGStringList {
+    readonly length: number;
+    readonly numberOfItems: number;
+    appendItem(newItem: string): string;
+    clear(): void;
+    getItem(index: number): string;
+    initialize(newItem: string): string;
+    insertItemBefore(newItem: string, index: number): string;
+    removeItem(index: number): string;
+    replaceItem(newItem: string, index: number): string;
+    [index: number]: string;
+}
+
+
+/** Corresponds to the SVG <style> element. */
+export interface SVGStyleElement extends SVGElement {
+    disabled: boolean;
+    media: string;
+    title: string;
+    type: string;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGStyleElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGStyleElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <switch> element. */
+export interface SVGSwitchElement extends SVGGraphicsElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGSwitchElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGSwitchElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <symbol> element. */
+export interface SVGSymbolElement extends SVGElement, SVGFitToViewBox {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGSymbolElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGSymbolElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** A <tspan> element. */
+export interface SVGTSpanElement extends SVGTextPositioningElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTSpanElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTSpanElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SVGTests {
+    readonly requiredExtensions: SVGStringList;
+    readonly systemLanguage: SVGStringList;
+}
+
+/** Implemented by elements that support rendering child text content. It is inherited by various text-related interfaces, such as SVGTextElement, SVGTSpanElement, SVGTRefElement, SVGAltGlyphElement and SVGTextPathElement. */
+export interface SVGTextContentElement extends SVGGraphicsElement {
+    readonly lengthAdjust: SVGAnimatedEnumeration;
+    readonly textLength: SVGAnimatedLength;
+    getCharNumAtPosition(point?: DOMPointInit): number;
+    getComputedTextLength(): number;
+    getEndPositionOfChar(charnum: number): DOMPoint;
+    getExtentOfChar(charnum: number): DOMRect;
+    getNumberOfChars(): number;
+    getRotationOfChar(charnum: number): number;
+    getStartPositionOfChar(charnum: number): DOMPoint;
+    getSubStringLength(charnum: number, nchars: number): number;
+    selectSubString(charnum: number, nchars: number): void;
+    readonly LENGTHADJUST_SPACING: number;
+    readonly LENGTHADJUST_SPACINGANDGLYPHS: number;
+    readonly LENGTHADJUST_UNKNOWN: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTextContentElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTextContentElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <text> elements. */
+export interface SVGTextElement extends SVGTextPositioningElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTextElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTextElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <textPath> element. */
+export interface SVGTextPathElement extends SVGTextContentElement, SVGURIReference {
+    readonly method: SVGAnimatedEnumeration;
+    readonly spacing: SVGAnimatedEnumeration;
+    readonly startOffset: SVGAnimatedLength;
+    readonly TEXTPATH_METHODTYPE_ALIGN: number;
+    readonly TEXTPATH_METHODTYPE_STRETCH: number;
+    readonly TEXTPATH_METHODTYPE_UNKNOWN: number;
+    readonly TEXTPATH_SPACINGTYPE_AUTO: number;
+    readonly TEXTPATH_SPACINGTYPE_EXACT: number;
+    readonly TEXTPATH_SPACINGTYPE_UNKNOWN: number;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTextPathElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTextPathElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Implemented by elements that support attributes that position individual text glyphs. It is inherited by SVGTextElement, SVGTSpanElement, SVGTRefElement and SVGAltGlyphElement. */
+export interface SVGTextPositioningElement extends SVGTextContentElement {
+    readonly dx: SVGAnimatedLengthList;
+    readonly dy: SVGAnimatedLengthList;
+    readonly rotate: SVGAnimatedNumberList;
+    readonly x: SVGAnimatedLengthList;
+    readonly y: SVGAnimatedLengthList;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTextPositioningElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTextPositioningElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Corresponds to the <title> element. */
+export interface SVGTitleElement extends SVGElement {
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTitleElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGTitleElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** SVGTransform is the interface for one of the component transformations within an SVGTransformList; thus, an SVGTransform object corresponds to a single component (e.g., scale(…) or matrix(…)) within a transform attribute. */
+export interface SVGTransform {
+    readonly angle: number;
+    readonly matrix: SVGMatrix;
+    readonly type: number;
+    setMatrix(matrix: SVGMatrix): void;
+    setRotate(angle: number, cx: number, cy: number): void;
+    setScale(sx: number, sy: number): void;
+    setSkewX(angle: number): void;
+    setSkewY(angle: number): void;
+    setTranslate(tx: number, ty: number): void;
+    readonly SVG_TRANSFORM_MATRIX: number;
+    readonly SVG_TRANSFORM_ROTATE: number;
+    readonly SVG_TRANSFORM_SCALE: number;
+    readonly SVG_TRANSFORM_SKEWX: number;
+    readonly SVG_TRANSFORM_SKEWY: number;
+    readonly SVG_TRANSFORM_TRANSLATE: number;
+    readonly SVG_TRANSFORM_UNKNOWN: number;
+}
+
+
+/** The SVGTransformList defines a list of SVGTransform objects. */
+export interface SVGTransformList {
+    readonly numberOfItems: number;
+    appendItem(newItem: SVGTransform): SVGTransform;
+    clear(): void;
+    consolidate(): SVGTransform;
+    createSVGTransformFromMatrix(matrix: SVGMatrix): SVGTransform;
+    getItem(index: number): SVGTransform;
+    initialize(newItem: SVGTransform): SVGTransform;
+    insertItemBefore(newItem: SVGTransform, index: number): SVGTransform;
+    removeItem(index: number): SVGTransform;
+    replaceItem(newItem: SVGTransform, index: number): SVGTransform;
+}
+
+
+export interface SVGURIReference {
+    readonly href: SVGAnimatedString;
+}
+
+/** A commonly used set of constants used for reflecting gradientUnits, patternContentUnits and other similar attributes. */
+export interface SVGUnitTypes {
+    readonly SVG_UNIT_TYPE_OBJECTBOUNDINGBOX: number;
+    readonly SVG_UNIT_TYPE_UNKNOWN: number;
+    readonly SVG_UNIT_TYPE_USERSPACEONUSE: number;
+}
+
+
+/** Corresponds to the <use> element. */
+export interface SVGUseElement extends SVGGraphicsElement, SVGURIReference {
+    readonly animatedInstanceRoot: SVGElementInstance | null;
+    readonly height: SVGAnimatedLength;
+    readonly instanceRoot: SVGElementInstance | null;
+    readonly width: SVGAnimatedLength;
+    readonly x: SVGAnimatedLength;
+    readonly y: SVGAnimatedLength;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGUseElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGUseElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides access to the properties of <view> elements, as well as methods to manipulate them. */
+export interface SVGViewElement extends SVGElement, SVGFitToViewBox, SVGZoomAndPan {
+    /** @deprecated */
+    readonly viewTarget: SVGStringList;
+    addEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGViewElement, ev: SVGElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SVGElementEventMap>(type: K, listener: (this: SVGViewElement, ev: SVGElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Used to reflect the zoomAndPan attribute, and is mixed in to other interfaces for elements that support this attribute. */
+export interface SVGZoomAndPan {
+    readonly zoomAndPan: number;
+}
+
+
+export interface SVGZoomEvent extends UIEvent {
+    readonly newScale: number;
+    readonly newTranslate: SVGPoint;
+    readonly previousScale: number;
+    readonly previousTranslate: SVGPoint;
+    readonly zoomRectScreen: SVGRect;
+}
+
+
+export interface ScopedCredential {
+    readonly id: ArrayBuffer;
+    readonly type: ScopedCredentialType;
+}
+
+
+export interface ScopedCredentialInfo {
+    readonly credential: ScopedCredential;
+    readonly publicKey: CryptoKey;
+}
+
+
+/** A screen, usually the one on which the current window is being rendered, and is obtained using window.screen. */
+export interface Screen {
+    readonly availHeight: number;
+    readonly availWidth: number;
+    readonly colorDepth: number;
+    readonly height: number;
+    readonly orientation: ScreenOrientation;
+    readonly pixelDepth: number;
+    readonly width: number;
+}
+
+
+export interface ScreenOrientationEventMap {
+    "change": Event;
+}
+
+export interface ScreenOrientation extends EventTarget {
+    readonly angle: number;
+    onchange: ((this: ScreenOrientation, ev: Event) => any) | null;
+    readonly type: OrientationType;
+    lock(orientation: OrientationLockType): Promise<void>;
+    unlock(): void;
+    addEventListener<K extends keyof ScreenOrientationEventMap>(type: K, listener: (this: ScreenOrientation, ev: ScreenOrientationEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof ScreenOrientationEventMap>(type: K, listener: (this: ScreenOrientation, ev: ScreenOrientationEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface ScriptProcessorNodeEventMap {
+    "audioprocess": AudioProcessingEvent;
+}
+
+/** Allows the generation, processing, or analyzing of audio using JavaScript. */
+export interface ScriptProcessorNode extends AudioNode {
+    /** @deprecated */
+    readonly bufferSize: number;
+    /** @deprecated */
+    onaudioprocess: ((this: ScriptProcessorNode, ev: AudioProcessingEvent) => any) | null;
+    addEventListener<K extends keyof ScriptProcessorNodeEventMap>(type: K, listener: (this: ScriptProcessorNode, ev: ScriptProcessorNodeEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof ScriptProcessorNodeEventMap>(type: K, listener: (this: ScriptProcessorNode, ev: ScriptProcessorNodeEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Inherits from Event, and represents the event object of an event sent on a document or worker when its content security policy is violated. */
+export interface SecurityPolicyViolationEvent extends Event {
+    readonly blockedURI: string;
+    readonly columnNumber: number;
+    readonly documentURI: string;
+    readonly effectiveDirective: string;
+    readonly lineNumber: number;
+    readonly originalPolicy: string;
+    readonly referrer: string;
+    readonly sourceFile: string;
+    readonly statusCode: number;
+    readonly violatedDirective: string;
+}
+
+
+/** A Selection object represents the range of text selected by the user or the current position of the caret. To obtain a Selection object for examination or modification, call Window.getSelection(). */
+export interface Selection {
+    readonly anchorNode: Node | null;
+    readonly anchorOffset: number;
+    readonly focusNode: Node | null;
+    readonly focusOffset: number;
+    readonly isCollapsed: boolean;
+    readonly rangeCount: number;
+    readonly type: string;
+    addRange(range: Range): void;
+    collapse(node: Node | null, offset?: number): void;
+    collapseToEnd(): void;
+    collapseToStart(): void;
+    containsNode(node: Node, allowPartialContainment?: boolean): boolean;
+    deleteFromDocument(): void;
+    empty(): void;
+    extend(node: Node, offset?: number): void;
+    getRangeAt(index: number): Range;
+    removeAllRanges(): void;
+    removeRange(range: Range): void;
+    selectAllChildren(node: Node): void;
+    setBaseAndExtent(anchorNode: Node, anchorOffset: number, focusNode: Node, focusOffset: number): void;
+    setPosition(node: Node | null, offset?: number): void;
+    toString(): string;
+}
+
+
+export interface ServiceUIFrameContext {
+    getCachedFrameMessage(key: string): string;
+    postFrameMessage(key: string, data: string): void;
+}
+
+export interface ServiceWorkerEventMap extends AbstractWorkerEventMap {
+    "statechange": Event;
+}
+
+/** This ServiceWorker API interface provides a reference to a service worker. Multiple browsing contexts (e.g. pages, workers, etc.) can be associated with the same service worker, each through a unique ServiceWorker object. */
+export interface ServiceWorker extends EventTarget, AbstractWorker {
+    onstatechange: ((this: ServiceWorker, ev: Event) => any) | null;
+    readonly scriptURL: string;
+    readonly state: ServiceWorkerState;
+    postMessage(message: any, transfer: Transferable[]): void;
+    postMessage(message: any, options?: PostMessageOptions): void;
+    addEventListener<K extends keyof ServiceWorkerEventMap>(type: K, listener: (this: ServiceWorker, ev: ServiceWorkerEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof ServiceWorkerEventMap>(type: K, listener: (this: ServiceWorker, ev: ServiceWorkerEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface ServiceWorkerContainerEventMap {
+    "controllerchange": Event;
+    "message": MessageEvent;
+    "messageerror": MessageEvent;
+}
+
+/** The ServiceWorkerContainer interface of the ServiceWorker API provides an object representing the service worker as an overall unit in the network ecosystem, including facilities to register, unregister and update service workers, and access the state of service workers and their registrations. */
+export interface ServiceWorkerContainer extends EventTarget {
+    readonly controller: ServiceWorker | null;
+    oncontrollerchange: ((this: ServiceWorkerContainer, ev: Event) => any) | null;
+    onmessage: ((this: ServiceWorkerContainer, ev: MessageEvent) => any) | null;
+    onmessageerror: ((this: ServiceWorkerContainer, ev: MessageEvent) => any) | null;
+    readonly ready: Promise<ServiceWorkerRegistration>;
+    getRegistration(clientURL?: string): Promise<ServiceWorkerRegistration | undefined>;
+    getRegistrations(): Promise<ReadonlyArray<ServiceWorkerRegistration>>;
+    register(scriptURL: string, options?: RegistrationOptions): Promise<ServiceWorkerRegistration>;
+    startMessages(): void;
+    addEventListener<K extends keyof ServiceWorkerContainerEventMap>(type: K, listener: (this: ServiceWorkerContainer, ev: ServiceWorkerContainerEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof ServiceWorkerContainerEventMap>(type: K, listener: (this: ServiceWorkerContainer, ev: ServiceWorkerContainerEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** This ServiceWorker API interface contains information about an event sent to a ServiceWorkerContainer target. This extends the default message event to allow setting a ServiceWorker object as the source of a message. The event object is accessed via the handler function of a message event, when fired by a message received from a service worker. */
+export interface ServiceWorkerMessageEvent extends Event {
+    readonly data: any;
+    readonly lastEventId: string;
+    readonly origin: string;
+    readonly ports: ReadonlyArray<MessagePort> | null;
+    readonly source: ServiceWorker | MessagePort | null;
+}
+
+
+export interface ServiceWorkerRegistrationEventMap {
+    "updatefound": Event;
+}
+
+/** This ServiceWorker API interface represents the service worker registration. You register a service worker to control one or more pages that share the same origin. */
+export interface ServiceWorkerRegistration extends EventTarget {
+    readonly active: ServiceWorker | null;
+    readonly installing: ServiceWorker | null;
+    readonly navigationPreload: NavigationPreloadManager;
+    onupdatefound: ((this: ServiceWorkerRegistration, ev: Event) => any) | null;
+    readonly pushManager: PushManager;
+    readonly scope: string;
+    readonly sync: SyncManager;
+    readonly updateViaCache: ServiceWorkerUpdateViaCache;
+    readonly waiting: ServiceWorker | null;
+    getNotifications(filter?: GetNotificationOptions): Promise<Notification[]>;
+    showNotification(title: string, options?: NotificationOptions): Promise<void>;
+    unregister(): Promise<boolean>;
+    update(): Promise<void>;
+    addEventListener<K extends keyof ServiceWorkerRegistrationEventMap>(type: K, listener: (this: ServiceWorkerRegistration, ev: ServiceWorkerRegistrationEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof ServiceWorkerRegistrationEventMap>(type: K, listener: (this: ServiceWorkerRegistration, ev: ServiceWorkerRegistrationEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface ShadowRoot extends DocumentFragment, DocumentOrShadowRoot, InnerHTML {
+    readonly host: Element;
+    readonly mode: ShadowRootMode;
+}
+
+
+export interface Slotable {
+    readonly assignedSlot: HTMLSlotElement | null;
+}
+
+export interface SourceBufferEventMap {
+    "abort": Event;
+    "error": Event;
+    "update": Event;
+    "updateend": Event;
+    "updatestart": Event;
+}
+
+/** A chunk of media to be passed into an HTMLMediaElement and played, via a MediaSource object. This can be made up of one or several media segments. */
+export interface SourceBuffer extends EventTarget {
+    appendWindowEnd: number;
+    appendWindowStart: number;
+    readonly audioTracks: AudioTrackList;
+    readonly buffered: TimeRanges;
+    mode: AppendMode;
+    onabort: ((this: SourceBuffer, ev: Event) => any) | null;
+    onerror: ((this: SourceBuffer, ev: Event) => any) | null;
+    onupdate: ((this: SourceBuffer, ev: Event) => any) | null;
+    onupdateend: ((this: SourceBuffer, ev: Event) => any) | null;
+    onupdatestart: ((this: SourceBuffer, ev: Event) => any) | null;
+    readonly textTracks: TextTrackList;
+    timestampOffset: number;
+    readonly updating: boolean;
+    readonly videoTracks: VideoTrackList;
+    abort(): void;
+    appendBuffer(data: BufferSource): void;
+    remove(start: number, end: number): void;
+    addEventListener<K extends keyof SourceBufferEventMap>(type: K, listener: (this: SourceBuffer, ev: SourceBufferEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SourceBufferEventMap>(type: K, listener: (this: SourceBuffer, ev: SourceBufferEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SourceBufferListEventMap {
+    "addsourcebuffer": Event;
+    "removesourcebuffer": Event;
+}
+
+/** A simple container list for multiple SourceBuffer objects. */
+export interface SourceBufferList extends EventTarget {
+    readonly length: number;
+    onaddsourcebuffer: ((this: SourceBufferList, ev: Event) => any) | null;
+    onremovesourcebuffer: ((this: SourceBufferList, ev: Event) => any) | null;
+    addEventListener<K extends keyof SourceBufferListEventMap>(type: K, listener: (this: SourceBufferList, ev: SourceBufferListEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SourceBufferListEventMap>(type: K, listener: (this: SourceBufferList, ev: SourceBufferListEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    [index: number]: SourceBuffer;
+}
+
+
+export interface SpeechGrammar {
+    src: string;
+    weight: number;
+}
+
+
+export interface SpeechGrammarList {
+    readonly length: number;
+    addFromString(string: string, weight?: number): void;
+    addFromURI(src: string, weight?: number): void;
+    item(index: number): SpeechGrammar;
+    [index: number]: SpeechGrammar;
+}
+
+
+export interface SpeechRecognitionEventMap {
+    "audioend": Event;
+    "audiostart": Event;
+    "end": Event;
+    "error": Event;
+    "nomatch": SpeechRecognitionEvent;
+    "result": SpeechRecognitionEvent;
+    "soundend": Event;
+    "soundstart": Event;
+    "speechend": Event;
+    "speechstart": Event;
+    "start": Event;
+}
+
+export interface SpeechRecognition extends EventTarget {
+    continuous: boolean;
+    grammars: SpeechGrammarList;
+    interimResults: boolean;
+    lang: string;
+    maxAlternatives: number;
+    onaudioend: ((this: SpeechRecognition, ev: Event) => any) | null;
+    onaudiostart: ((this: SpeechRecognition, ev: Event) => any) | null;
+    onend: ((this: SpeechRecognition, ev: Event) => any) | null;
+    onerror: ((this: SpeechRecognition, ev: Event) => any) | null;
+    onnomatch: ((this: SpeechRecognition, ev: SpeechRecognitionEvent) => any) | null;
+    onresult: ((this: SpeechRecognition, ev: SpeechRecognitionEvent) => any) | null;
+    onsoundend: ((this: SpeechRecognition, ev: Event) => any) | null;
+    onsoundstart: ((this: SpeechRecognition, ev: Event) => any) | null;
+    onspeechend: ((this: SpeechRecognition, ev: Event) => any) | null;
+    onspeechstart: ((this: SpeechRecognition, ev: Event) => any) | null;
+    onstart: ((this: SpeechRecognition, ev: Event) => any) | null;
+    abort(): void;
+    start(): void;
+    stop(): void;
+    addEventListener<K extends keyof SpeechRecognitionEventMap>(type: K, listener: (this: SpeechRecognition, ev: SpeechRecognitionEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SpeechRecognitionEventMap>(type: K, listener: (this: SpeechRecognition, ev: SpeechRecognitionEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SpeechRecognitionAlternative {
+    readonly confidence: number;
+    readonly transcript: string;
+}
+
+
+export interface SpeechRecognitionEvent extends Event {
+    readonly resultIndex: number;
+    readonly results: SpeechRecognitionResultList;
+}
+
+
+export interface SpeechRecognitionResult {
+    readonly isFinal: boolean;
+    readonly length: number;
+    item(index: number): SpeechRecognitionAlternative;
+    [index: number]: SpeechRecognitionAlternative;
+}
+
+
+export interface SpeechRecognitionResultList {
+    readonly length: number;
+    item(index: number): SpeechRecognitionResult;
+    [index: number]: SpeechRecognitionResult;
+}
+
+
+export interface SpeechSynthesisEventMap {
+    "voiceschanged": Event;
+}
+
+/** This Web Speech API interface is the controller interface for the speech service; this can be used to retrieve information about the synthesis voices available on the device, start and pause speech, and other commands besides. */
+export interface SpeechSynthesis extends EventTarget {
+    onvoiceschanged: ((this: SpeechSynthesis, ev: Event) => any) | null;
+    readonly paused: boolean;
+    readonly pending: boolean;
+    readonly speaking: boolean;
+    cancel(): void;
+    getVoices(): SpeechSynthesisVoice[];
+    pause(): void;
+    resume(): void;
+    speak(utterance: SpeechSynthesisUtterance): void;
+    addEventListener<K extends keyof SpeechSynthesisEventMap>(type: K, listener: (this: SpeechSynthesis, ev: SpeechSynthesisEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SpeechSynthesisEventMap>(type: K, listener: (this: SpeechSynthesis, ev: SpeechSynthesisEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface SpeechSynthesisErrorEvent extends SpeechSynthesisEvent {
+    readonly error: SpeechSynthesisErrorCode;
+}
+
+
+/** This Web Speech API interface contains information about the current state of SpeechSynthesisUtterance objects that have been processed in the speech service. */
+export interface SpeechSynthesisEvent extends Event {
+    readonly charIndex: number;
+    readonly charLength: number;
+    readonly elapsedTime: number;
+    readonly name: string;
+    readonly utterance: SpeechSynthesisUtterance;
+}
+
+
+export interface SpeechSynthesisUtteranceEventMap {
+    "boundary": SpeechSynthesisEvent;
+    "end": SpeechSynthesisEvent;
+    "error": SpeechSynthesisErrorEvent;
+    "mark": SpeechSynthesisEvent;
+    "pause": SpeechSynthesisEvent;
+    "resume": SpeechSynthesisEvent;
+    "start": SpeechSynthesisEvent;
+}
+
+/** This Web Speech API interface represents a speech request. It contains the content the speech service should read and information about how to read it (e.g. language, pitch and volume.) */
+export interface SpeechSynthesisUtterance extends EventTarget {
+    lang: string;
+    onboundary: ((this: SpeechSynthesisUtterance, ev: SpeechSynthesisEvent) => any) | null;
+    onend: ((this: SpeechSynthesisUtterance, ev: SpeechSynthesisEvent) => any) | null;
+    onerror: ((this: SpeechSynthesisUtterance, ev: SpeechSynthesisErrorEvent) => any) | null;
+    onmark: ((this: SpeechSynthesisUtterance, ev: SpeechSynthesisEvent) => any) | null;
+    onpause: ((this: SpeechSynthesisUtterance, ev: SpeechSynthesisEvent) => any) | null;
+    onresume: ((this: SpeechSynthesisUtterance, ev: SpeechSynthesisEvent) => any) | null;
+    onstart: ((this: SpeechSynthesisUtterance, ev: SpeechSynthesisEvent) => any) | null;
+    pitch: number;
+    rate: number;
+    text: string;
+    voice: SpeechSynthesisVoice | null;
+    volume: number;
+    addEventListener<K extends keyof SpeechSynthesisUtteranceEventMap>(type: K, listener: (this: SpeechSynthesisUtterance, ev: SpeechSynthesisUtteranceEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof SpeechSynthesisUtteranceEventMap>(type: K, listener: (this: SpeechSynthesisUtterance, ev: SpeechSynthesisUtteranceEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** This Web Speech API interface represents a voice that the system supports. Every SpeechSynthesisVoice has its own relative speech service including information about language, name and URI. */
+export interface SpeechSynthesisVoice {
+    readonly default: boolean;
+    readonly lang: string;
+    readonly localService: boolean;
+    readonly name: string;
+    readonly voiceURI: string;
+}
+
+
+export interface StaticRange extends AbstractRange {
+}
+
+
+/** The pan property takes a unitless value between -1 (full left pan) and 1 (full right pan). This interface was introduced as a much simpler way to apply a simple panning effect than having to use a full PannerNode. */
+export interface StereoPannerNode extends AudioNode {
+    readonly pan: AudioParam;
+}
+
+
+/** This Web Storage API interface provides access to a particular domain's session or local storage. It allows, for example, the addition, modification, or deletion of stored data items. */
+export interface Storage {
+    /**
+     * Returns the number of key/value pairs currently present in the list associated with the object.
+     */
+    readonly length: number;
+    /**
+     * Empties the list associated with the object of all key/value pairs, if there are any.
+     */
+    clear(): void;
+    /**
+     * Returns the current value associated with the given key, or null if the given key does not exist in the list associated with the object.
+     */
+    getItem(key: string): string | null;
+    /**
+     * Returns the name of the nth key in the list, or null if n is greater than or equal to the number of key/value pairs in the object.
+     */
+    key(index: number): string | null;
+    /**
+     * Removes the key/value pair with the given key from the list associated with the object, if a key/value pair with the given key exists.
+     */
+    removeItem(key: string): void;
+    /**
+     * Sets the value of the pair identified by key to value, creating a new key/value pair if none existed for key previously.
+     * 
+     * Throws a "QuotaExceededError" DOMException exception if the new value couldn't be set. (Setting could fail if, e.g., the user has disabled storage for the site, or if the quota has been exceeded.)
+     */
+    setItem(key: string, value: string): void;
+    [name: string]: any;
+}
+
+
+/** A StorageEvent is sent to a window when a storage area it has access to is changed within the context of another document. */
+export interface StorageEvent extends Event {
+    /**
+     * Returns the key of the storage item being changed.
+     */
+    readonly key: string | null;
+    /**
+     * Returns the new value of the key of the storage item whose value is being changed.
+     */
+    readonly newValue: string | null;
+    /**
+     * Returns the old value of the key of the storage item whose value is being changed.
+     */
+    readonly oldValue: string | null;
+    /**
+     * Returns the Storage object that was affected.
+     */
+    readonly storageArea: Storage | null;
+    /**
+     * Returns the URL of the document whose storage item changed.
+     */
+    readonly url: string;
+}
+
+
+export interface StorageManager {
+    estimate(): Promise<StorageEstimate>;
+    persist(): Promise<boolean>;
+    persisted(): Promise<boolean>;
+}
+
+
+export interface StyleMedia {
+    readonly type: string;
+    matchMedium(mediaquery: string): boolean;
+}
+
+
+/** A single style sheet. CSS style sheets will further implement the more specialized CSSStyleSheet interface. */
+export interface StyleSheet {
+    disabled: boolean;
+    readonly href: string | null;
+    readonly media: MediaList;
+    readonly ownerNode: Node;
+    readonly parentStyleSheet: StyleSheet | null;
+    readonly title: string | null;
+    readonly type: string;
+}
+
+
+/** A list of StyleSheet. */
+export interface StyleSheetList {
+    readonly length: number;
+    item(index: number): StyleSheet | null;
+    [index: number]: StyleSheet;
+}
+
+
+/** This Web Crypto API interface provides a number of low-level cryptographic functions. It is accessed via the Crypto.subtle properties available in a window context (via Window.crypto). */
+export interface SubtleCrypto {
+    decrypt(algorithm: string | RsaOaepParams | AesCtrParams | AesCbcParams | AesCmacParams | AesGcmParams | AesCfbParams, key: CryptoKey, data: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer): PromiseLike<ArrayBuffer>;
+    deriveBits(algorithm: string | EcdhKeyDeriveParams | DhKeyDeriveParams | ConcatParams | HkdfCtrParams | Pbkdf2Params, baseKey: CryptoKey, length: number): PromiseLike<ArrayBuffer>;
+    deriveKey(algorithm: string | EcdhKeyDeriveParams | DhKeyDeriveParams | ConcatParams | HkdfCtrParams | Pbkdf2Params, baseKey: CryptoKey, derivedKeyType: string | AesDerivedKeyParams | HmacImportParams | ConcatParams | HkdfCtrParams | Pbkdf2Params, extractable: boolean, keyUsages: string[]): PromiseLike<CryptoKey>;
+    digest(algorithm: string | Algorithm, data: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer): PromiseLike<ArrayBuffer>;
+    encrypt(algorithm: string | RsaOaepParams | AesCtrParams | AesCbcParams | AesCmacParams | AesGcmParams | AesCfbParams, key: CryptoKey, data: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer): PromiseLike<ArrayBuffer>;
+    exportKey(format: "jwk", key: CryptoKey): PromiseLike<JsonWebKey>;
+    exportKey(format: "raw" | "pkcs8" | "spki", key: CryptoKey): PromiseLike<ArrayBuffer>;
+    exportKey(format: string, key: CryptoKey): PromiseLike<JsonWebKey | ArrayBuffer>;
+    generateKey(algorithm: string, extractable: boolean, keyUsages: string[]): PromiseLike<CryptoKeyPair | CryptoKey>;
+    generateKey(algorithm: RsaHashedKeyGenParams | EcKeyGenParams | DhKeyGenParams, extractable: boolean, keyUsages: string[]): PromiseLike<CryptoKeyPair>;
+    generateKey(algorithm: AesKeyGenParams | HmacKeyGenParams | Pbkdf2Params, extractable: boolean, keyUsages: string[]): PromiseLike<CryptoKey>;
+    importKey(format: "jwk", keyData: JsonWebKey, algorithm: string | RsaHashedImportParams | EcKeyImportParams | HmacImportParams | DhImportKeyParams | AesKeyAlgorithm, extractable: boolean, keyUsages: string[]): PromiseLike<CryptoKey>;
+    importKey(format: "raw" | "pkcs8" | "spki", keyData: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer, algorithm: string | RsaHashedImportParams | EcKeyImportParams | HmacImportParams | DhImportKeyParams | AesKeyAlgorithm, extractable: boolean, keyUsages: string[]): PromiseLike<CryptoKey>;
+    importKey(format: string, keyData: JsonWebKey | Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer, algorithm: string | RsaHashedImportParams | EcKeyImportParams | HmacImportParams | DhImportKeyParams | AesKeyAlgorithm, extractable: boolean, keyUsages: string[]): PromiseLike<CryptoKey>;
+    sign(algorithm: string | RsaPssParams | EcdsaParams | AesCmacParams, key: CryptoKey, data: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer): PromiseLike<ArrayBuffer>;
+    unwrapKey(format: string, wrappedKey: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer, unwrappingKey: CryptoKey, unwrapAlgorithm: string | Algorithm, unwrappedKeyAlgorithm: string | Algorithm, extractable: boolean, keyUsages: string[]): PromiseLike<CryptoKey>;
+    verify(algorithm: string | RsaPssParams | EcdsaParams | AesCmacParams, key: CryptoKey, signature: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer, data: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer): PromiseLike<boolean>;
+    wrapKey(format: string, key: CryptoKey, wrappingKey: CryptoKey, wrapAlgorithm: string | Algorithm): PromiseLike<ArrayBuffer>;
+}
+
+
+/** This ServiceWorker API interface provides an interface for registering and listing sync registrations. */
+export interface SyncManager {
+    getTags(): Promise<string[]>;
+    register(tag: string): Promise<void>;
+}
+
+
+/** The textual content of Element or Attr. If an element has no markup within its content, it has a single child implementing Text that contains the element's text. However, if the element contains markup, it is parsed into information items and Text nodes that form its children. */
+export interface Text extends CharacterData, Slotable {
+    readonly assignedSlot: HTMLSlotElement | null;
+    /**
+     * Returns the combined data of all direct Text node siblings.
+     */
+    readonly wholeText: string;
+    /**
+     * Splits data at the given offset and returns the remainder as Text node.
+     */
+    splitText(offset: number): Text;
+}
+
+
+/** A decoder for a specific method, that is a specific character encoding, like utf-8, iso-8859-2, koi8, cp1261, gbk, etc. A decoder takes a stream of bytes as input and emits a stream of code points. For a more scalable, non-native library, see StringView – a C-like representation of strings based on typed arrays. */
+export interface TextDecoder extends TextDecoderCommon {
+    /**
+     * Returns the result of running encoding's decoder. The method can be invoked zero or more times with options's stream set to true, and then once without options's stream (or set to false), to process a fragmented stream. If the invocation without options's stream (or set to false) has no input, it's clearest to omit both arguments.
+     * 
+     * ```
+     * var string = "", decoder = new TextDecoder(encoding), buffer;
+     * while(buffer = next_chunk()) {
+     *   string += decoder.decode(buffer, {stream:true});
+     * }
+     * string += decoder.decode(); // end-of-stream
+     * ```
+     * 
+     * If the error mode is "fatal" and encoding's decoder returns error, throws a TypeError.
+     */
+    decode(input?: BufferSource, options?: TextDecodeOptions): string;
+}
+
+
+export interface TextDecoderCommon {
+    /**
+     * Returns encoding's name, lowercased.
+     */
+    readonly encoding: string;
+    /**
+     * Returns true if error mode is "fatal", and false otherwise.
+     */
+    readonly fatal: boolean;
+    /**
+     * Returns true if ignore BOM flag is set, and false otherwise.
+     */
+    readonly ignoreBOM: boolean;
+}
+
+export interface TextDecoderStream extends GenericTransformStream, TextDecoderCommon {
+    readonly readable: ReadableStream<string>;
+    readonly writable: WritableStream<BufferSource>;
+}
+
+
+/** TextEncoder takes a stream of code points as input and emits a stream of bytes. For a more scalable, non-native library, see StringView – a C-like representation of strings based on typed arrays. */
+export interface TextEncoder extends TextEncoderCommon {
+    /**
+     * Returns the result of running UTF-8's encoder.
+     */
+    encode(input?: string): Uint8Array;
+    /**
+     * Runs the UTF-8 encoder on source, stores the result of that operation into destination, and returns the progress made as a dictionary whereby read is the number of converted code units of source and written is the number of bytes modified in destination.
+     */
+    encodeInto(source: string, destination: Uint8Array): TextEncoderEncodeIntoResult;
+}
+
+
+export interface TextEncoderCommon {
+    /**
+     * Returns "utf-8".
+     */
+    readonly encoding: string;
+}
+
+export interface TextEncoderStream extends GenericTransformStream, TextEncoderCommon {
+    readonly readable: ReadableStream<Uint8Array>;
+    readonly writable: WritableStream<string>;
+}
+
+
+export interface TextEvent extends UIEvent {
+    readonly data: string;
+    initTextEvent(typeArg: string, canBubbleArg: boolean, cancelableArg: boolean, viewArg: Window, dataArg: string, inputMethod: number, locale: string): void;
+    readonly DOM_INPUT_METHOD_DROP: number;
+    readonly DOM_INPUT_METHOD_HANDWRITING: number;
+    readonly DOM_INPUT_METHOD_IME: number;
+    readonly DOM_INPUT_METHOD_KEYBOARD: number;
+    readonly DOM_INPUT_METHOD_MULTIMODAL: number;
+    readonly DOM_INPUT_METHOD_OPTION: number;
+    readonly DOM_INPUT_METHOD_PASTE: number;
+    readonly DOM_INPUT_METHOD_SCRIPT: number;
+    readonly DOM_INPUT_METHOD_UNKNOWN: number;
+    readonly DOM_INPUT_METHOD_VOICE: number;
+}
+
+
+/** The dimensions of a piece of text in the canvas, as created by the CanvasRenderingContext2D.measureText() method. */
+export interface TextMetrics {
+    /**
+     * Returns the measurement described below.
+     */
+    readonly actualBoundingBoxAscent: number;
+    /**
+     * Returns the measurement described below.
+     */
+    readonly actualBoundingBoxDescent: number;
+    /**
+     * Returns the measurement described below.
+     */
+    readonly actualBoundingBoxLeft: number;
+    /**
+     * Returns the measurement described below.
+     */
+    readonly actualBoundingBoxRight: number;
+    /**
+     * Returns the measurement described below.
+     */
+    readonly alphabeticBaseline: number;
+    /**
+     * Returns the measurement described below.
+     */
+    readonly emHeightAscent: number;
+    /**
+     * Returns the measurement described below.
+     */
+    readonly emHeightDescent: number;
+    /**
+     * Returns the measurement described below.
+     */
+    readonly fontBoundingBoxAscent: number;
+    /**
+     * Returns the measurement described below.
+     */
+    readonly fontBoundingBoxDescent: number;
+    /**
+     * Returns the measurement described below.
+     */
+    readonly hangingBaseline: number;
+    /**
+     * Returns the measurement described below.
+     */
+    readonly ideographicBaseline: number;
+    /**
+     * Returns the measurement described below.
+     */
+    readonly width: number;
+}
+
+
+export interface TextTrackEventMap {
+    "cuechange": Event;
+    "error": Event;
+    "load": Event;
+}
+
+/** This interface also inherits properties from EventTarget. */
+export interface TextTrack extends EventTarget {
+    readonly activeCues: TextTrackCueList;
+    readonly cues: TextTrackCueList;
+    readonly inBandMetadataTrackDispatchType: string;
+    readonly kind: string;
+    readonly label: string;
+    readonly language: string;
+    mode: TextTrackMode | number;
+    oncuechange: ((this: TextTrack, ev: Event) => any) | null;
+    onerror: ((this: TextTrack, ev: Event) => any) | null;
+    onload: ((this: TextTrack, ev: Event) => any) | null;
+    readonly readyState: number;
+    readonly sourceBuffer: SourceBuffer | null;
+    addCue(cue: TextTrackCue): void;
+    removeCue(cue: TextTrackCue): void;
+    readonly DISABLED: number;
+    readonly ERROR: number;
+    readonly HIDDEN: number;
+    readonly LOADED: number;
+    readonly LOADING: number;
+    readonly NONE: number;
+    readonly SHOWING: number;
+    addEventListener<K extends keyof TextTrackEventMap>(type: K, listener: (this: TextTrack, ev: TextTrackEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof TextTrackEventMap>(type: K, listener: (this: TextTrack, ev: TextTrackEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface TextTrackCueEventMap {
+    "enter": Event;
+    "exit": Event;
+}
+
+/** TextTrackCues represent a string of text that will be displayed for some duration of time on a TextTrack. This includes the start and end times that the cue will be displayed. A TextTrackCue cannot be used directly, instead one of the derived types (e.g. VTTCue) must be used. */
+export interface TextTrackCue extends EventTarget {
+    endTime: number;
+    id: string;
+    onenter: ((this: TextTrackCue, ev: Event) => any) | null;
+    onexit: ((this: TextTrackCue, ev: Event) => any) | null;
+    pauseOnExit: boolean;
+    startTime: number;
+    text: string;
+    readonly track: TextTrack;
+    getCueAsHTML(): DocumentFragment;
+    addEventListener<K extends keyof TextTrackCueEventMap>(type: K, listener: (this: TextTrackCue, ev: TextTrackCueEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof TextTrackCueEventMap>(type: K, listener: (this: TextTrackCue, ev: TextTrackCueEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface TextTrackCueList {
+    readonly length: number;
+    getCueById(id: string): TextTrackCue;
+    item(index: number): TextTrackCue;
+    [index: number]: TextTrackCue;
+}
+
+
+export interface TextTrackListEventMap {
+    "addtrack": TrackEvent;
+    "change": Event;
+    "removetrack": TrackEvent;
+}
+
+export interface TextTrackList extends EventTarget {
+    readonly length: number;
+    onaddtrack: ((this: TextTrackList, ev: TrackEvent) => any) | null;
+    onchange: ((this: TextTrackList, ev: Event) => any) | null;
+    onremovetrack: ((this: TextTrackList, ev: TrackEvent) => any) | null;
+    item(index: number): TextTrack;
+    addEventListener<K extends keyof TextTrackListEventMap>(type: K, listener: (this: TextTrackList, ev: TextTrackListEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof TextTrackListEventMap>(type: K, listener: (this: TextTrackList, ev: TextTrackListEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    [index: number]: TextTrack;
+}
+
+
+/** Used to represent a set of time ranges, primarily for the purpose of tracking which portions of media have been buffered when loading it for use by the <audio> and <video> elements. */
+export interface TimeRanges {
+    readonly length: number;
+    end(index: number): number;
+    start(index: number): number;
+}
+
+
+/** A single contact point on a touch-sensitive device. The contact point is commonly a finger or stylus and the device may be a touchscreen or trackpad. */
+export interface Touch {
+    readonly altitudeAngle: number;
+    readonly azimuthAngle: number;
+    readonly clientX: number;
+    readonly clientY: number;
+    readonly force: number;
+    readonly identifier: number;
+    readonly pageX: number;
+    readonly pageY: number;
+    readonly radiusX: number;
+    readonly radiusY: number;
+    readonly rotationAngle: number;
+    readonly screenX: number;
+    readonly screenY: number;
+    readonly target: EventTarget;
+    readonly touchType: TouchType;
+}
+
+
+/** An event sent when the state of contacts with a touch-sensitive surface changes. This surface can be a touch screen or trackpad, for example. The event can describe one or more points of contact with the screen and includes support for detecting movement, addition and removal of contact points, and so forth. */
+export interface TouchEvent extends UIEvent {
+    readonly altKey: boolean;
+    readonly changedTouches: TouchList;
+    readonly ctrlKey: boolean;
+    readonly metaKey: boolean;
+    readonly shiftKey: boolean;
+    readonly targetTouches: TouchList;
+    readonly touches: TouchList;
+}
+
+
+/** A list of contact points on a touch surface. For example, if the user has three fingers on the touch surface (such as a screen or trackpad), the corresponding TouchList object would have one Touch object for each finger, for a total of three entries. */
+export interface TouchList {
+    readonly length: number;
+    item(index: number): Touch | null;
+    [index: number]: Touch;
+}
+
+
+/** The TrackEvent interface, part of the HTML DOM specification, is used for events which represent changes to the set of available tracks on an HTML media element; these events are addtrack and removetrack. */
+export interface TrackEvent extends Event {
+    readonly track: VideoTrack | AudioTrack | TextTrack | null;
+}
+
+
+export interface TransformStream<I = any, O = any> {
+    readonly readable: ReadableStream<O>;
+    readonly writable: WritableStream<I>;
+}
+
+
+export interface TransformStreamDefaultController<O = any> {
+    readonly desiredSize: number | null;
+    enqueue(chunk: O): void;
+    error(reason?: any): void;
+    terminate(): void;
+}
+
+/** Events providing information related to transitions. */
+export interface TransitionEvent extends Event {
+    readonly elapsedTime: number;
+    readonly propertyName: string;
+    readonly pseudoElement: string;
+}
+
+
+/** The nodes of a document subtree and a position within them. */
+export interface TreeWalker {
+    currentNode: Node;
+    readonly filter: NodeFilter | null;
+    readonly root: Node;
+    readonly whatToShow: number;
+    firstChild(): Node | null;
+    lastChild(): Node | null;
+    nextNode(): Node | null;
+    nextSibling(): Node | null;
+    parentNode(): Node | null;
+    previousNode(): Node | null;
+    previousSibling(): Node | null;
+}
+
+
+/** Simple user interface events. */
+export interface UIEvent extends Event {
+    readonly detail: number;
+    readonly view: Window | null;
+    /** @deprecated */
+    readonly which: number;
+}
+
+
+/** The URL interface represents an object providing static methods used for creating object URLs. */
+export interface URL {
+    hash: string;
+    host: string;
+    hostname: string;
+    href: string;
+    toString(): string;
+    readonly origin: string;
+    password: string;
+    pathname: string;
+    port: string;
+    protocol: string;
+    search: string;
+    readonly searchParams: URLSearchParams;
+    username: string;
+    toJSON(): string;
+}
+
+
+export type webkitURL = URL;
+
+export interface URLSearchParams {
+    /**
+     * Appends a specified key/value pair as a new search parameter.
+     */
+    append(name: string, value: string): void;
+    /**
+     * Deletes the given search parameter, and its associated value, from the list of all search parameters.
+     */
+    delete(name: string): void;
+    /**
+     * Returns the first value associated to the given search parameter.
+     */
+    get(name: string): string | null;
+    /**
+     * Returns all the values association with a given search parameter.
+     */
+    getAll(name: string): string[];
+    /**
+     * Returns a Boolean indicating if such a search parameter exists.
+     */
+    has(name: string): boolean;
+    /**
+     * Sets the value associated to a given search parameter to the given value. If there were several values, delete the others.
+     */
+    set(name: string, value: string): void;
+    sort(): void;
+    /**
+     * Returns a string containing a query string suitable for use in a URL. Does not include the question mark.
+     */
+    toString(): string;
+    forEach(callbackfn: (value: string, key: string, parent: URLSearchParams) => void, thisArg?: any): void;
+}
+
+
+/** This WebVR API interface represents any VR device supported by this API. It includes generic information such as device IDs and descriptions, as well as methods for starting to present a VR scene, retrieving eye parameters and display capabilities, and other important functionality. */
+export interface VRDisplay extends EventTarget {
+    readonly capabilities: VRDisplayCapabilities;
+    depthFar: number;
+    depthNear: number;
+    readonly displayId: number;
+    readonly displayName: string;
+    readonly isConnected: boolean;
+    readonly isPresenting: boolean;
+    readonly stageParameters: VRStageParameters | null;
+    cancelAnimationFrame(handle: number): void;
+    exitPresent(): Promise<void>;
+    getEyeParameters(whichEye: string): VREyeParameters;
+    getFrameData(frameData: VRFrameData): boolean;
+    getLayers(): VRLayer[];
+    /** @deprecated */
+    getPose(): VRPose;
+    requestAnimationFrame(callback: FrameRequestCallback): number;
+    requestPresent(layers: VRLayer[]): Promise<void>;
+    resetPose(): void;
+    submitFrame(pose?: VRPose): void;
+}
+
+
+/** This WebVR API interface describes the capabilities of a VRDisplay — its features can be used to perform VR device capability tests, for example can it return position information. */
+export interface VRDisplayCapabilities {
+    readonly canPresent: boolean;
+    readonly hasExternalDisplay: boolean;
+    readonly hasOrientation: boolean;
+    readonly hasPosition: boolean;
+    readonly maxLayers: number;
+}
+
+
+/** This WebVR API interface represents represents the event object of WebVR-related events (see the list of WebVR window extensions). */
+export interface VRDisplayEvent extends Event {
+    readonly display: VRDisplay;
+    readonly reason: VRDisplayEventReason | null;
+}
+
+
+/** This WebVR API interface represents all the information required to correctly render a scene for a given eye, including field of view information. */
+export interface VREyeParameters {
+    /** @deprecated */
+    readonly fieldOfView: VRFieldOfView;
+    readonly offset: Float32Array;
+    readonly renderHeight: number;
+    readonly renderWidth: number;
+}
+
+
+/** This WebVR API interface represents a field of view defined by 4 different degree values describing the view from a center point. */
+export interface VRFieldOfView {
+    readonly downDegrees: number;
+    readonly leftDegrees: number;
+    readonly rightDegrees: number;
+    readonly upDegrees: number;
+}
+
+
+/** This WebVR API interface represents all the information needed to render a single frame of a VR scene; constructed by VRDisplay.getFrameData(). */
+export interface VRFrameData {
+    readonly leftProjectionMatrix: Float32Array;
+    readonly leftViewMatrix: Float32Array;
+    readonly pose: VRPose;
+    readonly rightProjectionMatrix: Float32Array;
+    readonly rightViewMatrix: Float32Array;
+    readonly timestamp: number;
+}
+
+
+/** This WebVR API interface represents the state of a VR sensor at a given timestamp (which includes orientation, position, velocity, and acceleration information.) */
+export interface VRPose {
+    readonly angularAcceleration: Float32Array | null;
+    readonly angularVelocity: Float32Array | null;
+    readonly linearAcceleration: Float32Array | null;
+    readonly linearVelocity: Float32Array | null;
+    readonly orientation: Float32Array | null;
+    readonly position: Float32Array | null;
+    readonly timestamp: number;
+}
+
+
+export interface VTTCue extends TextTrackCue {
+    align: AlignSetting;
+    line: LineAndPositionSetting;
+    lineAlign: LineAlignSetting;
+    position: LineAndPositionSetting;
+    positionAlign: PositionAlignSetting;
+    region: VTTRegion | null;
+    size: number;
+    snapToLines: boolean;
+    text: string;
+    vertical: DirectionSetting;
+    getCueAsHTML(): DocumentFragment;
+    addEventListener<K extends keyof TextTrackCueEventMap>(type: K, listener: (this: VTTCue, ev: TextTrackCueEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof TextTrackCueEventMap>(type: K, listener: (this: VTTCue, ev: TextTrackCueEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface VTTRegion {
+    id: string;
+    lines: number;
+    regionAnchorX: number;
+    regionAnchorY: number;
+    scroll: ScrollSetting;
+    viewportAnchorX: number;
+    viewportAnchorY: number;
+    width: number;
+}
+
+
+/** The validity states that an element can be in, with respect to constraint validation. Together, they help explain why an element's value fails to validate, if it's not valid. */
+export interface ValidityState {
+    readonly badInput: boolean;
+    readonly customError: boolean;
+    readonly patternMismatch: boolean;
+    readonly rangeOverflow: boolean;
+    readonly rangeUnderflow: boolean;
+    readonly stepMismatch: boolean;
+    readonly tooLong: boolean;
+    readonly tooShort: boolean;
+    readonly typeMismatch: boolean;
+    readonly valid: boolean;
+    readonly valueMissing: boolean;
+}
+
+
+/** Returned by the HTMLVideoElement.getVideoPlaybackQuality() method and contains metrics that can be used to determine the playback quality of a video. */
+export interface VideoPlaybackQuality {
+    readonly corruptedVideoFrames: number;
+    readonly creationTime: number;
+    readonly droppedVideoFrames: number;
+    readonly totalFrameDelay: number;
+    readonly totalVideoFrames: number;
+}
+
+
+/** A single video track from a <video> element. */
+export interface VideoTrack {
+    readonly id: string;
+    kind: string;
+    readonly label: string;
+    language: string;
+    selected: boolean;
+    readonly sourceBuffer: SourceBuffer | null;
+}
+
+
+export interface VideoTrackListEventMap {
+    "addtrack": TrackEvent;
+    "change": Event;
+    "removetrack": TrackEvent;
+}
+
+/** Used to represent a list of the video tracks contained within a <video> element, with each track represented by a separate VideoTrack object in the list. */
+export interface VideoTrackList extends EventTarget {
+    readonly length: number;
+    onaddtrack: ((this: VideoTrackList, ev: TrackEvent) => any) | null;
+    onchange: ((this: VideoTrackList, ev: Event) => any) | null;
+    onremovetrack: ((this: VideoTrackList, ev: TrackEvent) => any) | null;
+    readonly selectedIndex: number;
+    getTrackById(id: string): VideoTrack | null;
+    item(index: number): VideoTrack;
+    addEventListener<K extends keyof VideoTrackListEventMap>(type: K, listener: (this: VideoTrackList, ev: VideoTrackListEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof VideoTrackListEventMap>(type: K, listener: (this: VideoTrackList, ev: VideoTrackListEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    [index: number]: VideoTrack;
+}
+
+
+export interface WEBGL_color_buffer_float {
+    readonly FRAMEBUFFER_ATTACHMENT_COMPONENT_TYPE_EXT: GLenum;
+    readonly RGBA32F_EXT: GLenum;
+    readonly UNSIGNED_NORMALIZED_EXT: GLenum;
+}
+
+export interface WEBGL_compressed_texture_astc {
+    getSupportedProfiles(): string[];
+    readonly COMPRESSED_RGBA_ASTC_10x10_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_10x5_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_10x6_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_10x8_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_12x10_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_12x12_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_4x4_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_5x4_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_5x5_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_6x5_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_6x6_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_8x5_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_8x6_KHR: GLenum;
+    readonly COMPRESSED_RGBA_ASTC_8x8_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_10x10_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_10x5_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_10x6_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_10x8_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_12x10_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_12x12_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_4x4_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_5x4_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_5x5_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_6x5_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_6x6_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_8x5_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_8x6_KHR: GLenum;
+    readonly COMPRESSED_SRGB8_ALPHA8_ASTC_8x8_KHR: GLenum;
+}
+
+/** The WEBGL_compressed_texture_s3tc extension is part of the WebGL API and exposes four S3TC compressed texture formats. */
+export interface WEBGL_compressed_texture_s3tc {
+    readonly COMPRESSED_RGBA_S3TC_DXT1_EXT: GLenum;
+    readonly COMPRESSED_RGBA_S3TC_DXT3_EXT: GLenum;
+    readonly COMPRESSED_RGBA_S3TC_DXT5_EXT: GLenum;
+    readonly COMPRESSED_RGB_S3TC_DXT1_EXT: GLenum;
+}
+
+export interface WEBGL_compressed_texture_s3tc_srgb {
+    readonly COMPRESSED_SRGB_ALPHA_S3TC_DXT1_EXT: GLenum;
+    readonly COMPRESSED_SRGB_ALPHA_S3TC_DXT3_EXT: GLenum;
+    readonly COMPRESSED_SRGB_ALPHA_S3TC_DXT5_EXT: GLenum;
+    readonly COMPRESSED_SRGB_S3TC_DXT1_EXT: GLenum;
+}
+
+/** The WEBGL_debug_renderer_info extension is part of the WebGL API and exposes two constants with information about the graphics driver for debugging purposes. */
+export interface WEBGL_debug_renderer_info {
+    readonly UNMASKED_RENDERER_WEBGL: GLenum;
+    readonly UNMASKED_VENDOR_WEBGL: GLenum;
+}
+
+export interface WEBGL_debug_shaders {
+    getTranslatedShaderSource(shader: WebGLShader): string;
+}
+
+/** The WEBGL_depth_texture extension is part of the WebGL API and defines 2D depth and depth-stencil textures. */
+export interface WEBGL_depth_texture {
+    readonly UNSIGNED_INT_24_8_WEBGL: GLenum;
+}
+
+export interface WEBGL_draw_buffers {
+    drawBuffersWEBGL(buffers: GLenum[]): void;
+    readonly COLOR_ATTACHMENT0_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT10_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT11_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT12_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT13_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT14_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT15_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT1_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT2_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT3_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT4_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT5_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT6_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT7_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT8_WEBGL: GLenum;
+    readonly COLOR_ATTACHMENT9_WEBGL: GLenum;
+    readonly DRAW_BUFFER0_WEBGL: GLenum;
+    readonly DRAW_BUFFER10_WEBGL: GLenum;
+    readonly DRAW_BUFFER11_WEBGL: GLenum;
+    readonly DRAW_BUFFER12_WEBGL: GLenum;
+    readonly DRAW_BUFFER13_WEBGL: GLenum;
+    readonly DRAW_BUFFER14_WEBGL: GLenum;
+    readonly DRAW_BUFFER15_WEBGL: GLenum;
+    readonly DRAW_BUFFER1_WEBGL: GLenum;
+    readonly DRAW_BUFFER2_WEBGL: GLenum;
+    readonly DRAW_BUFFER3_WEBGL: GLenum;
+    readonly DRAW_BUFFER4_WEBGL: GLenum;
+    readonly DRAW_BUFFER5_WEBGL: GLenum;
+    readonly DRAW_BUFFER6_WEBGL: GLenum;
+    readonly DRAW_BUFFER7_WEBGL: GLenum;
+    readonly DRAW_BUFFER8_WEBGL: GLenum;
+    readonly DRAW_BUFFER9_WEBGL: GLenum;
+    readonly MAX_COLOR_ATTACHMENTS_WEBGL: GLenum;
+    readonly MAX_DRAW_BUFFERS_WEBGL: GLenum;
+}
+
+export interface WEBGL_lose_context {
+    loseContext(): void;
+    restoreContext(): void;
+}
+
+/** A WaveShaperNode always has exactly one input and one output. */
+export interface WaveShaperNode extends AudioNode {
+    curve: Float32Array | null;
+    oversample: OverSampleType;
+}
+
+
+export interface WebAuthentication {
+    getAssertion(assertionChallenge: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer | null, options?: AssertionOptions): Promise<WebAuthnAssertion>;
+    makeCredential(accountInformation: Account, cryptoParameters: ScopedCredentialParameters[], attestationChallenge: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer | null, options?: ScopedCredentialOptions): Promise<ScopedCredentialInfo>;
+}
+
+
+export interface WebAuthnAssertion {
+    readonly authenticatorData: ArrayBuffer;
+    readonly clientData: ArrayBuffer;
+    readonly credential: ScopedCredential;
+    readonly signature: ArrayBuffer;
+}
+
+
+export interface WebGL2RenderingContext extends WebGL2RenderingContextBase, WebGL2RenderingContextOverloads, WebGLRenderingContextBase {
+}
+
+
+export interface WebGL2RenderingContextBase {
+    beginQuery(target: GLenum, query: WebGLQuery): void;
+    beginTransformFeedback(primitiveMode: GLenum): void;
+    bindBufferBase(target: GLenum, index: GLuint, buffer: WebGLBuffer | null): void;
+    bindBufferRange(target: GLenum, index: GLuint, buffer: WebGLBuffer | null, offset: GLintptr, size: GLsizeiptr): void;
+    bindSampler(unit: GLuint, sampler: WebGLSampler | null): void;
+    bindTransformFeedback(target: GLenum, tf: WebGLTransformFeedback | null): void;
+    bindVertexArray(array: WebGLVertexArrayObject | null): void;
+    blitFramebuffer(srcX0: GLint, srcY0: GLint, srcX1: GLint, srcY1: GLint, dstX0: GLint, dstY0: GLint, dstX1: GLint, dstY1: GLint, mask: GLbitfield, filter: GLenum): void;
+    clearBufferfi(buffer: GLenum, drawbuffer: GLint, depth: GLfloat, stencil: GLint): void;
+    clearBufferfv(buffer: GLenum, drawbuffer: GLint, values: Float32List, srcOffset?: GLuint): void;
+    clearBufferiv(buffer: GLenum, drawbuffer: GLint, values: Int32List, srcOffset?: GLuint): void;
+    clearBufferuiv(buffer: GLenum, drawbuffer: GLint, values: Uint32List, srcOffset?: GLuint): void;
+    clientWaitSync(sync: WebGLSync, flags: GLbitfield, timeout: GLuint64): GLenum;
+    compressedTexImage3D(target: GLenum, level: GLint, internalformat: GLenum, width: GLsizei, height: GLsizei, depth: GLsizei, border: GLint, imageSize: GLsizei, offset: GLintptr): void;
+    compressedTexImage3D(target: GLenum, level: GLint, internalformat: GLenum, width: GLsizei, height: GLsizei, depth: GLsizei, border: GLint, srcData: ArrayBufferView, srcOffset?: GLuint, srcLengthOverride?: GLuint): void;
+    compressedTexSubImage3D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, zoffset: GLint, width: GLsizei, height: GLsizei, depth: GLsizei, format: GLenum, imageSize: GLsizei, offset: GLintptr): void;
+    compressedTexSubImage3D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, zoffset: GLint, width: GLsizei, height: GLsizei, depth: GLsizei, format: GLenum, srcData: ArrayBufferView, srcOffset?: GLuint, srcLengthOverride?: GLuint): void;
+    copyBufferSubData(readTarget: GLenum, writeTarget: GLenum, readOffset: GLintptr, writeOffset: GLintptr, size: GLsizeiptr): void;
+    copyTexSubImage3D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, zoffset: GLint, x: GLint, y: GLint, width: GLsizei, height: GLsizei): void;
+    createQuery(): WebGLQuery | null;
+    createSampler(): WebGLSampler | null;
+    createTransformFeedback(): WebGLTransformFeedback | null;
+    createVertexArray(): WebGLVertexArrayObject | null;
+    deleteQuery(query: WebGLQuery | null): void;
+    deleteSampler(sampler: WebGLSampler | null): void;
+    deleteSync(sync: WebGLSync | null): void;
+    deleteTransformFeedback(tf: WebGLTransformFeedback | null): void;
+    deleteVertexArray(vertexArray: WebGLVertexArrayObject | null): void;
+    drawArraysInstanced(mode: GLenum, first: GLint, count: GLsizei, instanceCount: GLsizei): void;
+    drawBuffers(buffers: GLenum[]): void;
+    drawElementsInstanced(mode: GLenum, count: GLsizei, type: GLenum, offset: GLintptr, instanceCount: GLsizei): void;
+    drawRangeElements(mode: GLenum, start: GLuint, end: GLuint, count: GLsizei, type: GLenum, offset: GLintptr): void;
+    endQuery(target: GLenum): void;
+    endTransformFeedback(): void;
+    fenceSync(condition: GLenum, flags: GLbitfield): WebGLSync | null;
+    framebufferTextureLayer(target: GLenum, attachment: GLenum, texture: WebGLTexture | null, level: GLint, layer: GLint): void;
+    getActiveUniformBlockName(program: WebGLProgram, uniformBlockIndex: GLuint): string | null;
+    getActiveUniformBlockParameter(program: WebGLProgram, uniformBlockIndex: GLuint, pname: GLenum): any;
+    getActiveUniforms(program: WebGLProgram, uniformIndices: GLuint[], pname: GLenum): any;
+    getBufferSubData(target: GLenum, srcByteOffset: GLintptr, dstBuffer: ArrayBufferView, dstOffset?: GLuint, length?: GLuint): void;
+    getFragDataLocation(program: WebGLProgram, name: string): GLint;
+    getIndexedParameter(target: GLenum, index: GLuint): any;
+    getInternalformatParameter(target: GLenum, internalformat: GLenum, pname: GLenum): any;
+    getQuery(target: GLenum, pname: GLenum): WebGLQuery | null;
+    getQueryParameter(query: WebGLQuery, pname: GLenum): any;
+    getSamplerParameter(sampler: WebGLSampler, pname: GLenum): any;
+    getSyncParameter(sync: WebGLSync, pname: GLenum): any;
+    getTransformFeedbackVarying(program: WebGLProgram, index: GLuint): WebGLActiveInfo | null;
+    getUniformBlockIndex(program: WebGLProgram, uniformBlockName: string): GLuint;
+    getUniformIndices(program: WebGLProgram, uniformNames: string[]): GLuint[] | null;
+    invalidateFramebuffer(target: GLenum, attachments: GLenum[]): void;
+    invalidateSubFramebuffer(target: GLenum, attachments: GLenum[], x: GLint, y: GLint, width: GLsizei, height: GLsizei): void;
+    isQuery(query: WebGLQuery | null): GLboolean;
+    isSampler(sampler: WebGLSampler | null): GLboolean;
+    isSync(sync: WebGLSync | null): GLboolean;
+    isTransformFeedback(tf: WebGLTransformFeedback | null): GLboolean;
+    isVertexArray(vertexArray: WebGLVertexArrayObject | null): GLboolean;
+    pauseTransformFeedback(): void;
+    readBuffer(src: GLenum): void;
+    renderbufferStorageMultisample(target: GLenum, samples: GLsizei, internalformat: GLenum, width: GLsizei, height: GLsizei): void;
+    resumeTransformFeedback(): void;
+    samplerParameterf(sampler: WebGLSampler, pname: GLenum, param: GLfloat): void;
+    samplerParameteri(sampler: WebGLSampler, pname: GLenum, param: GLint): void;
+    texImage3D(target: GLenum, level: GLint, internalformat: GLint, width: GLsizei, height: GLsizei, depth: GLsizei, border: GLint, format: GLenum, type: GLenum, pboOffset: GLintptr): void;
+    texImage3D(target: GLenum, level: GLint, internalformat: GLint, width: GLsizei, height: GLsizei, depth: GLsizei, border: GLint, format: GLenum, type: GLenum, source: TexImageSource): void;
+    texImage3D(target: GLenum, level: GLint, internalformat: GLint, width: GLsizei, height: GLsizei, depth: GLsizei, border: GLint, format: GLenum, type: GLenum, srcData: ArrayBufferView | null): void;
+    texImage3D(target: GLenum, level: GLint, internalformat: GLint, width: GLsizei, height: GLsizei, depth: GLsizei, border: GLint, format: GLenum, type: GLenum, srcData: ArrayBufferView, srcOffset: GLuint): void;
+    texStorage2D(target: GLenum, levels: GLsizei, internalformat: GLenum, width: GLsizei, height: GLsizei): void;
+    texStorage3D(target: GLenum, levels: GLsizei, internalformat: GLenum, width: GLsizei, height: GLsizei, depth: GLsizei): void;
+    texSubImage3D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, zoffset: GLint, width: GLsizei, height: GLsizei, depth: GLsizei, format: GLenum, type: GLenum, pboOffset: GLintptr): void;
+    texSubImage3D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, zoffset: GLint, width: GLsizei, height: GLsizei, depth: GLsizei, format: GLenum, type: GLenum, source: TexImageSource): void;
+    texSubImage3D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, zoffset: GLint, width: GLsizei, height: GLsizei, depth: GLsizei, format: GLenum, type: GLenum, srcData: ArrayBufferView | null, srcOffset?: GLuint): void;
+    transformFeedbackVaryings(program: WebGLProgram, varyings: string[], bufferMode: GLenum): void;
+    uniform1ui(location: WebGLUniformLocation | null, v0: GLuint): void;
+    uniform1uiv(location: WebGLUniformLocation | null, data: Uint32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniform2ui(location: WebGLUniformLocation | null, v0: GLuint, v1: GLuint): void;
+    uniform2uiv(location: WebGLUniformLocation | null, data: Uint32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniform3ui(location: WebGLUniformLocation | null, v0: GLuint, v1: GLuint, v2: GLuint): void;
+    uniform3uiv(location: WebGLUniformLocation | null, data: Uint32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniform4ui(location: WebGLUniformLocation | null, v0: GLuint, v1: GLuint, v2: GLuint, v3: GLuint): void;
+    uniform4uiv(location: WebGLUniformLocation | null, data: Uint32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniformBlockBinding(program: WebGLProgram, uniformBlockIndex: GLuint, uniformBlockBinding: GLuint): void;
+    uniformMatrix2x3fv(location: WebGLUniformLocation | null, transpose: GLboolean, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniformMatrix2x4fv(location: WebGLUniformLocation | null, transpose: GLboolean, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniformMatrix3x2fv(location: WebGLUniformLocation | null, transpose: GLboolean, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniformMatrix3x4fv(location: WebGLUniformLocation | null, transpose: GLboolean, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniformMatrix4x2fv(location: WebGLUniformLocation | null, transpose: GLboolean, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniformMatrix4x3fv(location: WebGLUniformLocation | null, transpose: GLboolean, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    vertexAttribDivisor(index: GLuint, divisor: GLuint): void;
+    vertexAttribI4i(index: GLuint, x: GLint, y: GLint, z: GLint, w: GLint): void;
+    vertexAttribI4iv(index: GLuint, values: Int32List): void;
+    vertexAttribI4ui(index: GLuint, x: GLuint, y: GLuint, z: GLuint, w: GLuint): void;
+    vertexAttribI4uiv(index: GLuint, values: Uint32List): void;
+    vertexAttribIPointer(index: GLuint, size: GLint, type: GLenum, stride: GLsizei, offset: GLintptr): void;
+    waitSync(sync: WebGLSync, flags: GLbitfield, timeout: GLint64): void;
+    readonly ACTIVE_UNIFORM_BLOCKS: GLenum;
+    readonly ALREADY_SIGNALED: GLenum;
+    readonly ANY_SAMPLES_PASSED: GLenum;
+    readonly ANY_SAMPLES_PASSED_CONSERVATIVE: GLenum;
+    readonly COLOR: GLenum;
+    readonly COLOR_ATTACHMENT1: GLenum;
+    readonly COLOR_ATTACHMENT10: GLenum;
+    readonly COLOR_ATTACHMENT11: GLenum;
+    readonly COLOR_ATTACHMENT12: GLenum;
+    readonly COLOR_ATTACHMENT13: GLenum;
+    readonly COLOR_ATTACHMENT14: GLenum;
+    readonly COLOR_ATTACHMENT15: GLenum;
+    readonly COLOR_ATTACHMENT2: GLenum;
+    readonly COLOR_ATTACHMENT3: GLenum;
+    readonly COLOR_ATTACHMENT4: GLenum;
+    readonly COLOR_ATTACHMENT5: GLenum;
+    readonly COLOR_ATTACHMENT6: GLenum;
+    readonly COLOR_ATTACHMENT7: GLenum;
+    readonly COLOR_ATTACHMENT8: GLenum;
+    readonly COLOR_ATTACHMENT9: GLenum;
+    readonly COMPARE_REF_TO_TEXTURE: GLenum;
+    readonly CONDITION_SATISFIED: GLenum;
+    readonly COPY_READ_BUFFER: GLenum;
+    readonly COPY_READ_BUFFER_BINDING: GLenum;
+    readonly COPY_WRITE_BUFFER: GLenum;
+    readonly COPY_WRITE_BUFFER_BINDING: GLenum;
+    readonly CURRENT_QUERY: GLenum;
+    readonly DEPTH: GLenum;
+    readonly DEPTH24_STENCIL8: GLenum;
+    readonly DEPTH32F_STENCIL8: GLenum;
+    readonly DEPTH_COMPONENT24: GLenum;
+    readonly DEPTH_COMPONENT32F: GLenum;
+    readonly DRAW_BUFFER0: GLenum;
+    readonly DRAW_BUFFER1: GLenum;
+    readonly DRAW_BUFFER10: GLenum;
+    readonly DRAW_BUFFER11: GLenum;
+    readonly DRAW_BUFFER12: GLenum;
+    readonly DRAW_BUFFER13: GLenum;
+    readonly DRAW_BUFFER14: GLenum;
+    readonly DRAW_BUFFER15: GLenum;
+    readonly DRAW_BUFFER2: GLenum;
+    readonly DRAW_BUFFER3: GLenum;
+    readonly DRAW_BUFFER4: GLenum;
+    readonly DRAW_BUFFER5: GLenum;
+    readonly DRAW_BUFFER6: GLenum;
+    readonly DRAW_BUFFER7: GLenum;
+    readonly DRAW_BUFFER8: GLenum;
+    readonly DRAW_BUFFER9: GLenum;
+    readonly DRAW_FRAMEBUFFER: GLenum;
+    readonly DRAW_FRAMEBUFFER_BINDING: GLenum;
+    readonly DYNAMIC_COPY: GLenum;
+    readonly DYNAMIC_READ: GLenum;
+    readonly FLOAT_32_UNSIGNED_INT_24_8_REV: GLenum;
+    readonly FLOAT_MAT2x3: GLenum;
+    readonly FLOAT_MAT2x4: GLenum;
+    readonly FLOAT_MAT3x2: GLenum;
+    readonly FLOAT_MAT3x4: GLenum;
+    readonly FLOAT_MAT4x2: GLenum;
+    readonly FLOAT_MAT4x3: GLenum;
+    readonly FRAGMENT_SHADER_DERIVATIVE_HINT: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_ALPHA_SIZE: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_BLUE_SIZE: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_COLOR_ENCODING: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_COMPONENT_TYPE: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_DEPTH_SIZE: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_GREEN_SIZE: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_RED_SIZE: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_STENCIL_SIZE: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_LAYER: GLenum;
+    readonly FRAMEBUFFER_DEFAULT: GLenum;
+    readonly FRAMEBUFFER_INCOMPLETE_MULTISAMPLE: GLenum;
+    readonly HALF_FLOAT: GLenum;
+    readonly INTERLEAVED_ATTRIBS: GLenum;
+    readonly INT_2_10_10_10_REV: GLenum;
+    readonly INT_SAMPLER_2D: GLenum;
+    readonly INT_SAMPLER_2D_ARRAY: GLenum;
+    readonly INT_SAMPLER_3D: GLenum;
+    readonly INT_SAMPLER_CUBE: GLenum;
+    readonly INVALID_INDEX: GLenum;
+    readonly MAX: GLenum;
+    readonly MAX_3D_TEXTURE_SIZE: GLenum;
+    readonly MAX_ARRAY_TEXTURE_LAYERS: GLenum;
+    readonly MAX_CLIENT_WAIT_TIMEOUT_WEBGL: GLenum;
+    readonly MAX_COLOR_ATTACHMENTS: GLenum;
+    readonly MAX_COMBINED_FRAGMENT_UNIFORM_COMPONENTS: GLenum;
+    readonly MAX_COMBINED_UNIFORM_BLOCKS: GLenum;
+    readonly MAX_COMBINED_VERTEX_UNIFORM_COMPONENTS: GLenum;
+    readonly MAX_DRAW_BUFFERS: GLenum;
+    readonly MAX_ELEMENTS_INDICES: GLenum;
+    readonly MAX_ELEMENTS_VERTICES: GLenum;
+    readonly MAX_ELEMENT_INDEX: GLenum;
+    readonly MAX_FRAGMENT_INPUT_COMPONENTS: GLenum;
+    readonly MAX_FRAGMENT_UNIFORM_BLOCKS: GLenum;
+    readonly MAX_FRAGMENT_UNIFORM_COMPONENTS: GLenum;
+    readonly MAX_PROGRAM_TEXEL_OFFSET: GLenum;
+    readonly MAX_SAMPLES: GLenum;
+    readonly MAX_SERVER_WAIT_TIMEOUT: GLenum;
+    readonly MAX_TEXTURE_LOD_BIAS: GLenum;
+    readonly MAX_TRANSFORM_FEEDBACK_INTERLEAVED_COMPONENTS: GLenum;
+    readonly MAX_TRANSFORM_FEEDBACK_SEPARATE_ATTRIBS: GLenum;
+    readonly MAX_TRANSFORM_FEEDBACK_SEPARATE_COMPONENTS: GLenum;
+    readonly MAX_UNIFORM_BLOCK_SIZE: GLenum;
+    readonly MAX_UNIFORM_BUFFER_BINDINGS: GLenum;
+    readonly MAX_VARYING_COMPONENTS: GLenum;
+    readonly MAX_VERTEX_OUTPUT_COMPONENTS: GLenum;
+    readonly MAX_VERTEX_UNIFORM_BLOCKS: GLenum;
+    readonly MAX_VERTEX_UNIFORM_COMPONENTS: GLenum;
+    readonly MIN: GLenum;
+    readonly MIN_PROGRAM_TEXEL_OFFSET: GLenum;
+    readonly OBJECT_TYPE: GLenum;
+    readonly PACK_ROW_LENGTH: GLenum;
+    readonly PACK_SKIP_PIXELS: GLenum;
+    readonly PACK_SKIP_ROWS: GLenum;
+    readonly PIXEL_PACK_BUFFER: GLenum;
+    readonly PIXEL_PACK_BUFFER_BINDING: GLenum;
+    readonly PIXEL_UNPACK_BUFFER: GLenum;
+    readonly PIXEL_UNPACK_BUFFER_BINDING: GLenum;
+    readonly QUERY_RESULT: GLenum;
+    readonly QUERY_RESULT_AVAILABLE: GLenum;
+    readonly R11F_G11F_B10F: GLenum;
+    readonly R16F: GLenum;
+    readonly R16I: GLenum;
+    readonly R16UI: GLenum;
+    readonly R32F: GLenum;
+    readonly R32I: GLenum;
+    readonly R32UI: GLenum;
+    readonly R8: GLenum;
+    readonly R8I: GLenum;
+    readonly R8UI: GLenum;
+    readonly R8_SNORM: GLenum;
+    readonly RASTERIZER_DISCARD: GLenum;
+    readonly READ_BUFFER: GLenum;
+    readonly READ_FRAMEBUFFER: GLenum;
+    readonly READ_FRAMEBUFFER_BINDING: GLenum;
+    readonly RED: GLenum;
+    readonly RED_INTEGER: GLenum;
+    readonly RENDERBUFFER_SAMPLES: GLenum;
+    readonly RG: GLenum;
+    readonly RG16F: GLenum;
+    readonly RG16I: GLenum;
+    readonly RG16UI: GLenum;
+    readonly RG32F: GLenum;
+    readonly RG32I: GLenum;
+    readonly RG32UI: GLenum;
+    readonly RG8: GLenum;
+    readonly RG8I: GLenum;
+    readonly RG8UI: GLenum;
+    readonly RG8_SNORM: GLenum;
+    readonly RGB10_A2: GLenum;
+    readonly RGB10_A2UI: GLenum;
+    readonly RGB16F: GLenum;
+    readonly RGB16I: GLenum;
+    readonly RGB16UI: GLenum;
+    readonly RGB32F: GLenum;
+    readonly RGB32I: GLenum;
+    readonly RGB32UI: GLenum;
+    readonly RGB8: GLenum;
+    readonly RGB8I: GLenum;
+    readonly RGB8UI: GLenum;
+    readonly RGB8_SNORM: GLenum;
+    readonly RGB9_E5: GLenum;
+    readonly RGBA16F: GLenum;
+    readonly RGBA16I: GLenum;
+    readonly RGBA16UI: GLenum;
+    readonly RGBA32F: GLenum;
+    readonly RGBA32I: GLenum;
+    readonly RGBA32UI: GLenum;
+    readonly RGBA8: GLenum;
+    readonly RGBA8I: GLenum;
+    readonly RGBA8UI: GLenum;
+    readonly RGBA8_SNORM: GLenum;
+    readonly RGBA_INTEGER: GLenum;
+    readonly RGB_INTEGER: GLenum;
+    readonly RG_INTEGER: GLenum;
+    readonly SAMPLER_2D_ARRAY: GLenum;
+    readonly SAMPLER_2D_ARRAY_SHADOW: GLenum;
+    readonly SAMPLER_2D_SHADOW: GLenum;
+    readonly SAMPLER_3D: GLenum;
+    readonly SAMPLER_BINDING: GLenum;
+    readonly SAMPLER_CUBE_SHADOW: GLenum;
+    readonly SEPARATE_ATTRIBS: GLenum;
+    readonly SIGNALED: GLenum;
+    readonly SIGNED_NORMALIZED: GLenum;
+    readonly SRGB: GLenum;
+    readonly SRGB8: GLenum;
+    readonly SRGB8_ALPHA8: GLenum;
+    readonly STATIC_COPY: GLenum;
+    readonly STATIC_READ: GLenum;
+    readonly STENCIL: GLenum;
+    readonly STREAM_COPY: GLenum;
+    readonly STREAM_READ: GLenum;
+    readonly SYNC_CONDITION: GLenum;
+    readonly SYNC_FENCE: GLenum;
+    readonly SYNC_FLAGS: GLenum;
+    readonly SYNC_FLUSH_COMMANDS_BIT: GLenum;
+    readonly SYNC_GPU_COMMANDS_COMPLETE: GLenum;
+    readonly SYNC_STATUS: GLenum;
+    readonly TEXTURE_2D_ARRAY: GLenum;
+    readonly TEXTURE_3D: GLenum;
+    readonly TEXTURE_BASE_LEVEL: GLenum;
+    readonly TEXTURE_BINDING_2D_ARRAY: GLenum;
+    readonly TEXTURE_BINDING_3D: GLenum;
+    readonly TEXTURE_COMPARE_FUNC: GLenum;
+    readonly TEXTURE_COMPARE_MODE: GLenum;
+    readonly TEXTURE_IMMUTABLE_FORMAT: GLenum;
+    readonly TEXTURE_IMMUTABLE_LEVELS: GLenum;
+    readonly TEXTURE_MAX_LEVEL: GLenum;
+    readonly TEXTURE_MAX_LOD: GLenum;
+    readonly TEXTURE_MIN_LOD: GLenum;
+    readonly TEXTURE_WRAP_R: GLenum;
+    readonly TIMEOUT_EXPIRED: GLenum;
+    readonly TIMEOUT_IGNORED: GLint64;
+    readonly TRANSFORM_FEEDBACK: GLenum;
+    readonly TRANSFORM_FEEDBACK_ACTIVE: GLenum;
+    readonly TRANSFORM_FEEDBACK_BINDING: GLenum;
+    readonly TRANSFORM_FEEDBACK_BUFFER: GLenum;
+    readonly TRANSFORM_FEEDBACK_BUFFER_BINDING: GLenum;
+    readonly TRANSFORM_FEEDBACK_BUFFER_MODE: GLenum;
+    readonly TRANSFORM_FEEDBACK_BUFFER_SIZE: GLenum;
+    readonly TRANSFORM_FEEDBACK_BUFFER_START: GLenum;
+    readonly TRANSFORM_FEEDBACK_PAUSED: GLenum;
+    readonly TRANSFORM_FEEDBACK_PRIMITIVES_WRITTEN: GLenum;
+    readonly TRANSFORM_FEEDBACK_VARYINGS: GLenum;
+    readonly UNIFORM_ARRAY_STRIDE: GLenum;
+    readonly UNIFORM_BLOCK_ACTIVE_UNIFORMS: GLenum;
+    readonly UNIFORM_BLOCK_ACTIVE_UNIFORM_INDICES: GLenum;
+    readonly UNIFORM_BLOCK_BINDING: GLenum;
+    readonly UNIFORM_BLOCK_DATA_SIZE: GLenum;
+    readonly UNIFORM_BLOCK_INDEX: GLenum;
+    readonly UNIFORM_BLOCK_REFERENCED_BY_FRAGMENT_SHADER: GLenum;
+    readonly UNIFORM_BLOCK_REFERENCED_BY_VERTEX_SHADER: GLenum;
+    readonly UNIFORM_BUFFER: GLenum;
+    readonly UNIFORM_BUFFER_BINDING: GLenum;
+    readonly UNIFORM_BUFFER_OFFSET_ALIGNMENT: GLenum;
+    readonly UNIFORM_BUFFER_SIZE: GLenum;
+    readonly UNIFORM_BUFFER_START: GLenum;
+    readonly UNIFORM_IS_ROW_MAJOR: GLenum;
+    readonly UNIFORM_MATRIX_STRIDE: GLenum;
+    readonly UNIFORM_OFFSET: GLenum;
+    readonly UNIFORM_SIZE: GLenum;
+    readonly UNIFORM_TYPE: GLenum;
+    readonly UNPACK_IMAGE_HEIGHT: GLenum;
+    readonly UNPACK_ROW_LENGTH: GLenum;
+    readonly UNPACK_SKIP_IMAGES: GLenum;
+    readonly UNPACK_SKIP_PIXELS: GLenum;
+    readonly UNPACK_SKIP_ROWS: GLenum;
+    readonly UNSIGNALED: GLenum;
+    readonly UNSIGNED_INT_10F_11F_11F_REV: GLenum;
+    readonly UNSIGNED_INT_24_8: GLenum;
+    readonly UNSIGNED_INT_2_10_10_10_REV: GLenum;
+    readonly UNSIGNED_INT_5_9_9_9_REV: GLenum;
+    readonly UNSIGNED_INT_SAMPLER_2D: GLenum;
+    readonly UNSIGNED_INT_SAMPLER_2D_ARRAY: GLenum;
+    readonly UNSIGNED_INT_SAMPLER_3D: GLenum;
+    readonly UNSIGNED_INT_SAMPLER_CUBE: GLenum;
+    readonly UNSIGNED_INT_VEC2: GLenum;
+    readonly UNSIGNED_INT_VEC3: GLenum;
+    readonly UNSIGNED_INT_VEC4: GLenum;
+    readonly UNSIGNED_NORMALIZED: GLenum;
+    readonly VERTEX_ARRAY_BINDING: GLenum;
+    readonly VERTEX_ATTRIB_ARRAY_DIVISOR: GLenum;
+    readonly VERTEX_ATTRIB_ARRAY_INTEGER: GLenum;
+    readonly WAIT_FAILED: GLenum;
+}
+
+export interface WebGL2RenderingContextOverloads {
+    bufferData(target: GLenum, size: GLsizeiptr, usage: GLenum): void;
+    bufferData(target: GLenum, srcData: BufferSource | null, usage: GLenum): void;
+    bufferData(target: GLenum, srcData: ArrayBufferView, usage: GLenum, srcOffset: GLuint, length?: GLuint): void;
+    bufferSubData(target: GLenum, dstByteOffset: GLintptr, srcData: BufferSource): void;
+    bufferSubData(target: GLenum, dstByteOffset: GLintptr, srcData: ArrayBufferView, srcOffset: GLuint, length?: GLuint): void;
+    compressedTexImage2D(target: GLenum, level: GLint, internalformat: GLenum, width: GLsizei, height: GLsizei, border: GLint, imageSize: GLsizei, offset: GLintptr): void;
+    compressedTexImage2D(target: GLenum, level: GLint, internalformat: GLenum, width: GLsizei, height: GLsizei, border: GLint, srcData: ArrayBufferView, srcOffset?: GLuint, srcLengthOverride?: GLuint): void;
+    compressedTexSubImage2D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, width: GLsizei, height: GLsizei, format: GLenum, imageSize: GLsizei, offset: GLintptr): void;
+    compressedTexSubImage2D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, width: GLsizei, height: GLsizei, format: GLenum, srcData: ArrayBufferView, srcOffset?: GLuint, srcLengthOverride?: GLuint): void;
+    readPixels(x: GLint, y: GLint, width: GLsizei, height: GLsizei, format: GLenum, type: GLenum, dstData: ArrayBufferView | null): void;
+    readPixels(x: GLint, y: GLint, width: GLsizei, height: GLsizei, format: GLenum, type: GLenum, offset: GLintptr): void;
+    readPixels(x: GLint, y: GLint, width: GLsizei, height: GLsizei, format: GLenum, type: GLenum, dstData: ArrayBufferView, dstOffset: GLuint): void;
+    texImage2D(target: GLenum, level: GLint, internalformat: GLint, width: GLsizei, height: GLsizei, border: GLint, format: GLenum, type: GLenum, pixels: ArrayBufferView | null): void;
+    texImage2D(target: GLenum, level: GLint, internalformat: GLint, format: GLenum, type: GLenum, source: TexImageSource): void;
+    texImage2D(target: GLenum, level: GLint, internalformat: GLint, width: GLsizei, height: GLsizei, border: GLint, format: GLenum, type: GLenum, pboOffset: GLintptr): void;
+    texImage2D(target: GLenum, level: GLint, internalformat: GLint, width: GLsizei, height: GLsizei, border: GLint, format: GLenum, type: GLenum, source: TexImageSource): void;
+    texImage2D(target: GLenum, level: GLint, internalformat: GLint, width: GLsizei, height: GLsizei, border: GLint, format: GLenum, type: GLenum, srcData: ArrayBufferView, srcOffset: GLuint): void;
+    texSubImage2D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, width: GLsizei, height: GLsizei, format: GLenum, type: GLenum, pixels: ArrayBufferView | null): void;
+    texSubImage2D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, format: GLenum, type: GLenum, source: TexImageSource): void;
+    texSubImage2D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, width: GLsizei, height: GLsizei, format: GLenum, type: GLenum, pboOffset: GLintptr): void;
+    texSubImage2D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, width: GLsizei, height: GLsizei, format: GLenum, type: GLenum, source: TexImageSource): void;
+    texSubImage2D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, width: GLsizei, height: GLsizei, format: GLenum, type: GLenum, srcData: ArrayBufferView, srcOffset: GLuint): void;
+    uniform1fv(location: WebGLUniformLocation | null, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniform1iv(location: WebGLUniformLocation | null, data: Int32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniform2fv(location: WebGLUniformLocation | null, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniform2iv(location: WebGLUniformLocation | null, data: Int32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniform3fv(location: WebGLUniformLocation | null, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniform3iv(location: WebGLUniformLocation | null, data: Int32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniform4fv(location: WebGLUniformLocation | null, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniform4iv(location: WebGLUniformLocation | null, data: Int32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniformMatrix2fv(location: WebGLUniformLocation | null, transpose: GLboolean, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniformMatrix3fv(location: WebGLUniformLocation | null, transpose: GLboolean, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+    uniformMatrix4fv(location: WebGLUniformLocation | null, transpose: GLboolean, data: Float32List, srcOffset?: GLuint, srcLength?: GLuint): void;
+}
+
+/** Part of the WebGL API and represents the information returned by calling the WebGLRenderingContext.getActiveAttrib() and WebGLRenderingContext.getActiveUniform() methods. */
+export interface WebGLActiveInfo {
+    readonly name: string;
+    readonly size: GLint;
+    readonly type: GLenum;
+}
+
+
+/** Part of the WebGL API and represents an opaque buffer object storing data such as vertices or colors. */
+export interface WebGLBuffer extends WebGLObject {
+}
+
+
+/** The WebContextEvent interface is part of the WebGL API and is an interface for an event that is generated in response to a status change to the WebGL rendering context. */
+export interface WebGLContextEvent extends Event {
+    readonly statusMessage: string;
+}
+
+
+/** Part of the WebGL API and represents a collection of buffers that serve as a rendering destination. */
+export interface WebGLFramebuffer extends WebGLObject {
+}
+
+
+export interface WebGLObject {
+}
+
+
+/** The WebGLProgram is part of the WebGL API and is a combination of two compiled WebGLShaders consisting of a vertex shader and a fragment shader (both written in GLSL). */
+export interface WebGLProgram extends WebGLObject {
+}
+
+
+export interface WebGLQuery extends WebGLObject {
+}
+
+
+/** Part of the WebGL API and represents a buffer that can contain an image, or can be source or target of an rendering operation. */
+export interface WebGLRenderbuffer extends WebGLObject {
+}
+
+
+/** Provides an interface to the OpenGL ES 2.0 graphics rendering context for the drawing surface of an HTML <canvas> element. */
+export interface WebGLRenderingContext extends WebGLRenderingContextBase, WebGLRenderingContextOverloads {
+}
+
+
+export interface WebGLRenderingContextBase {
+    readonly canvas: HTMLCanvasElement | OffscreenCanvas;
+    readonly drawingBufferHeight: GLsizei;
+    readonly drawingBufferWidth: GLsizei;
+    activeTexture(texture: GLenum): void;
+    attachShader(program: WebGLProgram, shader: WebGLShader): void;
+    bindAttribLocation(program: WebGLProgram, index: GLuint, name: string): void;
+    bindBuffer(target: GLenum, buffer: WebGLBuffer | null): void;
+    bindFramebuffer(target: GLenum, framebuffer: WebGLFramebuffer | null): void;
+    bindRenderbuffer(target: GLenum, renderbuffer: WebGLRenderbuffer | null): void;
+    bindTexture(target: GLenum, texture: WebGLTexture | null): void;
+    blendColor(red: GLclampf, green: GLclampf, blue: GLclampf, alpha: GLclampf): void;
+    blendEquation(mode: GLenum): void;
+    blendEquationSeparate(modeRGB: GLenum, modeAlpha: GLenum): void;
+    blendFunc(sfactor: GLenum, dfactor: GLenum): void;
+    blendFuncSeparate(srcRGB: GLenum, dstRGB: GLenum, srcAlpha: GLenum, dstAlpha: GLenum): void;
+    checkFramebufferStatus(target: GLenum): GLenum;
+    clear(mask: GLbitfield): void;
+    clearColor(red: GLclampf, green: GLclampf, blue: GLclampf, alpha: GLclampf): void;
+    clearDepth(depth: GLclampf): void;
+    clearStencil(s: GLint): void;
+    colorMask(red: GLboolean, green: GLboolean, blue: GLboolean, alpha: GLboolean): void;
+    compileShader(shader: WebGLShader): void;
+    copyTexImage2D(target: GLenum, level: GLint, internalformat: GLenum, x: GLint, y: GLint, width: GLsizei, height: GLsizei, border: GLint): void;
+    copyTexSubImage2D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, x: GLint, y: GLint, width: GLsizei, height: GLsizei): void;
+    createBuffer(): WebGLBuffer | null;
+    createFramebuffer(): WebGLFramebuffer | null;
+    createProgram(): WebGLProgram | null;
+    createRenderbuffer(): WebGLRenderbuffer | null;
+    createShader(type: GLenum): WebGLShader | null;
+    createTexture(): WebGLTexture | null;
+    cullFace(mode: GLenum): void;
+    deleteBuffer(buffer: WebGLBuffer | null): void;
+    deleteFramebuffer(framebuffer: WebGLFramebuffer | null): void;
+    deleteProgram(program: WebGLProgram | null): void;
+    deleteRenderbuffer(renderbuffer: WebGLRenderbuffer | null): void;
+    deleteShader(shader: WebGLShader | null): void;
+    deleteTexture(texture: WebGLTexture | null): void;
+    depthFunc(func: GLenum): void;
+    depthMask(flag: GLboolean): void;
+    depthRange(zNear: GLclampf, zFar: GLclampf): void;
+    detachShader(program: WebGLProgram, shader: WebGLShader): void;
+    disable(cap: GLenum): void;
+    disableVertexAttribArray(index: GLuint): void;
+    drawArrays(mode: GLenum, first: GLint, count: GLsizei): void;
+    drawElements(mode: GLenum, count: GLsizei, type: GLenum, offset: GLintptr): void;
+    enable(cap: GLenum): void;
+    enableVertexAttribArray(index: GLuint): void;
+    finish(): void;
+    flush(): void;
+    framebufferRenderbuffer(target: GLenum, attachment: GLenum, renderbuffertarget: GLenum, renderbuffer: WebGLRenderbuffer | null): void;
+    framebufferTexture2D(target: GLenum, attachment: GLenum, textarget: GLenum, texture: WebGLTexture | null, level: GLint): void;
+    frontFace(mode: GLenum): void;
+    generateMipmap(target: GLenum): void;
+    getActiveAttrib(program: WebGLProgram, index: GLuint): WebGLActiveInfo | null;
+    getActiveUniform(program: WebGLProgram, index: GLuint): WebGLActiveInfo | null;
+    getAttachedShaders(program: WebGLProgram): WebGLShader[] | null;
+    getAttribLocation(program: WebGLProgram, name: string): GLint;
+    getBufferParameter(target: GLenum, pname: GLenum): any;
+    getContextAttributes(): WebGLContextAttributes | null;
+    getError(): GLenum;
+    getExtension(extensionName: "EXT_blend_minmax"): EXT_blend_minmax | null;
+    getExtension(extensionName: "EXT_texture_filter_anisotropic"): EXT_texture_filter_anisotropic | null;
+    getExtension(extensionName: "EXT_frag_depth"): EXT_frag_depth | null;
+    getExtension(extensionName: "EXT_shader_texture_lod"): EXT_shader_texture_lod | null;
+    getExtension(extensionName: "EXT_sRGB"): EXT_sRGB | null;
+    getExtension(extensionName: "OES_vertex_array_object"): OES_vertex_array_object | null;
+    getExtension(extensionName: "WEBGL_color_buffer_float"): WEBGL_color_buffer_float | null;
+    getExtension(extensionName: "WEBGL_compressed_texture_astc"): WEBGL_compressed_texture_astc | null;
+    getExtension(extensionName: "WEBGL_compressed_texture_s3tc_srgb"): WEBGL_compressed_texture_s3tc_srgb | null;
+    getExtension(extensionName: "WEBGL_debug_shaders"): WEBGL_debug_shaders | null;
+    getExtension(extensionName: "WEBGL_draw_buffers"): WEBGL_draw_buffers | null;
+    getExtension(extensionName: "WEBGL_lose_context"): WEBGL_lose_context | null;
+    getExtension(extensionName: "WEBGL_depth_texture"): WEBGL_depth_texture | null;
+    getExtension(extensionName: "WEBGL_debug_renderer_info"): WEBGL_debug_renderer_info | null;
+    getExtension(extensionName: "WEBGL_compressed_texture_s3tc"): WEBGL_compressed_texture_s3tc | null;
+    getExtension(extensionName: "OES_texture_half_float_linear"): OES_texture_half_float_linear | null;
+    getExtension(extensionName: "OES_texture_half_float"): OES_texture_half_float | null;
+    getExtension(extensionName: "OES_texture_float_linear"): OES_texture_float_linear | null;
+    getExtension(extensionName: "OES_texture_float"): OES_texture_float | null;
+    getExtension(extensionName: "OES_standard_derivatives"): OES_standard_derivatives | null;
+    getExtension(extensionName: "OES_element_index_uint"): OES_element_index_uint | null;
+    getExtension(extensionName: "ANGLE_instanced_arrays"): ANGLE_instanced_arrays | null;
+    getExtension(extensionName: string): any;
+    getFramebufferAttachmentParameter(target: GLenum, attachment: GLenum, pname: GLenum): any;
+    getParameter(pname: GLenum): any;
+    getProgramInfoLog(program: WebGLProgram): string | null;
+    getProgramParameter(program: WebGLProgram, pname: GLenum): any;
+    getRenderbufferParameter(target: GLenum, pname: GLenum): any;
+    getShaderInfoLog(shader: WebGLShader): string | null;
+    getShaderParameter(shader: WebGLShader, pname: GLenum): any;
+    getShaderPrecisionFormat(shadertype: GLenum, precisiontype: GLenum): WebGLShaderPrecisionFormat | null;
+    getShaderSource(shader: WebGLShader): string | null;
+    getSupportedExtensions(): string[] | null;
+    getTexParameter(target: GLenum, pname: GLenum): any;
+    getUniform(program: WebGLProgram, location: WebGLUniformLocation): any;
+    getUniformLocation(program: WebGLProgram, name: string): WebGLUniformLocation | null;
+    getVertexAttrib(index: GLuint, pname: GLenum): any;
+    getVertexAttribOffset(index: GLuint, pname: GLenum): GLintptr;
+    hint(target: GLenum, mode: GLenum): void;
+    isBuffer(buffer: WebGLBuffer | null): GLboolean;
+    isContextLost(): boolean;
+    isEnabled(cap: GLenum): GLboolean;
+    isFramebuffer(framebuffer: WebGLFramebuffer | null): GLboolean;
+    isProgram(program: WebGLProgram | null): GLboolean;
+    isRenderbuffer(renderbuffer: WebGLRenderbuffer | null): GLboolean;
+    isShader(shader: WebGLShader | null): GLboolean;
+    isTexture(texture: WebGLTexture | null): GLboolean;
+    lineWidth(width: GLfloat): void;
+    linkProgram(program: WebGLProgram): void;
+    pixelStorei(pname: GLenum, param: GLint | GLboolean): void;
+    polygonOffset(factor: GLfloat, units: GLfloat): void;
+    renderbufferStorage(target: GLenum, internalformat: GLenum, width: GLsizei, height: GLsizei): void;
+    sampleCoverage(value: GLclampf, invert: GLboolean): void;
+    scissor(x: GLint, y: GLint, width: GLsizei, height: GLsizei): void;
+    shaderSource(shader: WebGLShader, source: string): void;
+    stencilFunc(func: GLenum, ref: GLint, mask: GLuint): void;
+    stencilFuncSeparate(face: GLenum, func: GLenum, ref: GLint, mask: GLuint): void;
+    stencilMask(mask: GLuint): void;
+    stencilMaskSeparate(face: GLenum, mask: GLuint): void;
+    stencilOp(fail: GLenum, zfail: GLenum, zpass: GLenum): void;
+    stencilOpSeparate(face: GLenum, fail: GLenum, zfail: GLenum, zpass: GLenum): void;
+    texParameterf(target: GLenum, pname: GLenum, param: GLfloat): void;
+    texParameteri(target: GLenum, pname: GLenum, param: GLint): void;
+    uniform1f(location: WebGLUniformLocation | null, x: GLfloat): void;
+    uniform1i(location: WebGLUniformLocation | null, x: GLint): void;
+    uniform2f(location: WebGLUniformLocation | null, x: GLfloat, y: GLfloat): void;
+    uniform2i(location: WebGLUniformLocation | null, x: GLint, y: GLint): void;
+    uniform3f(location: WebGLUniformLocation | null, x: GLfloat, y: GLfloat, z: GLfloat): void;
+    uniform3i(location: WebGLUniformLocation | null, x: GLint, y: GLint, z: GLint): void;
+    uniform4f(location: WebGLUniformLocation | null, x: GLfloat, y: GLfloat, z: GLfloat, w: GLfloat): void;
+    uniform4i(location: WebGLUniformLocation | null, x: GLint, y: GLint, z: GLint, w: GLint): void;
+    useProgram(program: WebGLProgram | null): void;
+    validateProgram(program: WebGLProgram): void;
+    vertexAttrib1f(index: GLuint, x: GLfloat): void;
+    vertexAttrib1fv(index: GLuint, values: Float32List): void;
+    vertexAttrib2f(index: GLuint, x: GLfloat, y: GLfloat): void;
+    vertexAttrib2fv(index: GLuint, values: Float32List): void;
+    vertexAttrib3f(index: GLuint, x: GLfloat, y: GLfloat, z: GLfloat): void;
+    vertexAttrib3fv(index: GLuint, values: Float32List): void;
+    vertexAttrib4f(index: GLuint, x: GLfloat, y: GLfloat, z: GLfloat, w: GLfloat): void;
+    vertexAttrib4fv(index: GLuint, values: Float32List): void;
+    vertexAttribPointer(index: GLuint, size: GLint, type: GLenum, normalized: GLboolean, stride: GLsizei, offset: GLintptr): void;
+    viewport(x: GLint, y: GLint, width: GLsizei, height: GLsizei): void;
+    readonly ACTIVE_ATTRIBUTES: GLenum;
+    readonly ACTIVE_TEXTURE: GLenum;
+    readonly ACTIVE_UNIFORMS: GLenum;
+    readonly ALIASED_LINE_WIDTH_RANGE: GLenum;
+    readonly ALIASED_POINT_SIZE_RANGE: GLenum;
+    readonly ALPHA: GLenum;
+    readonly ALPHA_BITS: GLenum;
+    readonly ALWAYS: GLenum;
+    readonly ARRAY_BUFFER: GLenum;
+    readonly ARRAY_BUFFER_BINDING: GLenum;
+    readonly ATTACHED_SHADERS: GLenum;
+    readonly BACK: GLenum;
+    readonly BLEND: GLenum;
+    readonly BLEND_COLOR: GLenum;
+    readonly BLEND_DST_ALPHA: GLenum;
+    readonly BLEND_DST_RGB: GLenum;
+    readonly BLEND_EQUATION: GLenum;
+    readonly BLEND_EQUATION_ALPHA: GLenum;
+    readonly BLEND_EQUATION_RGB: GLenum;
+    readonly BLEND_SRC_ALPHA: GLenum;
+    readonly BLEND_SRC_RGB: GLenum;
+    readonly BLUE_BITS: GLenum;
+    readonly BOOL: GLenum;
+    readonly BOOL_VEC2: GLenum;
+    readonly BOOL_VEC3: GLenum;
+    readonly BOOL_VEC4: GLenum;
+    readonly BROWSER_DEFAULT_WEBGL: GLenum;
+    readonly BUFFER_SIZE: GLenum;
+    readonly BUFFER_USAGE: GLenum;
+    readonly BYTE: GLenum;
+    readonly CCW: GLenum;
+    readonly CLAMP_TO_EDGE: GLenum;
+    readonly COLOR_ATTACHMENT0: GLenum;
+    readonly COLOR_BUFFER_BIT: GLenum;
+    readonly COLOR_CLEAR_VALUE: GLenum;
+    readonly COLOR_WRITEMASK: GLenum;
+    readonly COMPILE_STATUS: GLenum;
+    readonly COMPRESSED_TEXTURE_FORMATS: GLenum;
+    readonly CONSTANT_ALPHA: GLenum;
+    readonly CONSTANT_COLOR: GLenum;
+    readonly CONTEXT_LOST_WEBGL: GLenum;
+    readonly CULL_FACE: GLenum;
+    readonly CULL_FACE_MODE: GLenum;
+    readonly CURRENT_PROGRAM: GLenum;
+    readonly CURRENT_VERTEX_ATTRIB: GLenum;
+    readonly CW: GLenum;
+    readonly DECR: GLenum;
+    readonly DECR_WRAP: GLenum;
+    readonly DELETE_STATUS: GLenum;
+    readonly DEPTH_ATTACHMENT: GLenum;
+    readonly DEPTH_BITS: GLenum;
+    readonly DEPTH_BUFFER_BIT: GLenum;
+    readonly DEPTH_CLEAR_VALUE: GLenum;
+    readonly DEPTH_COMPONENT: GLenum;
+    readonly DEPTH_COMPONENT16: GLenum;
+    readonly DEPTH_FUNC: GLenum;
+    readonly DEPTH_RANGE: GLenum;
+    readonly DEPTH_STENCIL: GLenum;
+    readonly DEPTH_STENCIL_ATTACHMENT: GLenum;
+    readonly DEPTH_TEST: GLenum;
+    readonly DEPTH_WRITEMASK: GLenum;
+    readonly DITHER: GLenum;
+    readonly DONT_CARE: GLenum;
+    readonly DST_ALPHA: GLenum;
+    readonly DST_COLOR: GLenum;
+    readonly DYNAMIC_DRAW: GLenum;
+    readonly ELEMENT_ARRAY_BUFFER: GLenum;
+    readonly ELEMENT_ARRAY_BUFFER_BINDING: GLenum;
+    readonly EQUAL: GLenum;
+    readonly FASTEST: GLenum;
+    readonly FLOAT: GLenum;
+    readonly FLOAT_MAT2: GLenum;
+    readonly FLOAT_MAT3: GLenum;
+    readonly FLOAT_MAT4: GLenum;
+    readonly FLOAT_VEC2: GLenum;
+    readonly FLOAT_VEC3: GLenum;
+    readonly FLOAT_VEC4: GLenum;
+    readonly FRAGMENT_SHADER: GLenum;
+    readonly FRAMEBUFFER: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_OBJECT_NAME: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_OBJECT_TYPE: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_CUBE_MAP_FACE: GLenum;
+    readonly FRAMEBUFFER_ATTACHMENT_TEXTURE_LEVEL: GLenum;
+    readonly FRAMEBUFFER_BINDING: GLenum;
+    readonly FRAMEBUFFER_COMPLETE: GLenum;
+    readonly FRAMEBUFFER_INCOMPLETE_ATTACHMENT: GLenum;
+    readonly FRAMEBUFFER_INCOMPLETE_DIMENSIONS: GLenum;
+    readonly FRAMEBUFFER_INCOMPLETE_MISSING_ATTACHMENT: GLenum;
+    readonly FRAMEBUFFER_UNSUPPORTED: GLenum;
+    readonly FRONT: GLenum;
+    readonly FRONT_AND_BACK: GLenum;
+    readonly FRONT_FACE: GLenum;
+    readonly FUNC_ADD: GLenum;
+    readonly FUNC_REVERSE_SUBTRACT: GLenum;
+    readonly FUNC_SUBTRACT: GLenum;
+    readonly GENERATE_MIPMAP_HINT: GLenum;
+    readonly GEQUAL: GLenum;
+    readonly GREATER: GLenum;
+    readonly GREEN_BITS: GLenum;
+    readonly HIGH_FLOAT: GLenum;
+    readonly HIGH_INT: GLenum;
+    readonly IMPLEMENTATION_COLOR_READ_FORMAT: GLenum;
+    readonly IMPLEMENTATION_COLOR_READ_TYPE: GLenum;
+    readonly INCR: GLenum;
+    readonly INCR_WRAP: GLenum;
+    readonly INT: GLenum;
+    readonly INT_VEC2: GLenum;
+    readonly INT_VEC3: GLenum;
+    readonly INT_VEC4: GLenum;
+    readonly INVALID_ENUM: GLenum;
+    readonly INVALID_FRAMEBUFFER_OPERATION: GLenum;
+    readonly INVALID_OPERATION: GLenum;
+    readonly INVALID_VALUE: GLenum;
+    readonly INVERT: GLenum;
+    readonly KEEP: GLenum;
+    readonly LEQUAL: GLenum;
+    readonly LESS: GLenum;
+    readonly LINEAR: GLenum;
+    readonly LINEAR_MIPMAP_LINEAR: GLenum;
+    readonly LINEAR_MIPMAP_NEAREST: GLenum;
+    readonly LINES: GLenum;
+    readonly LINE_LOOP: GLenum;
+    readonly LINE_STRIP: GLenum;
+    readonly LINE_WIDTH: GLenum;
+    readonly LINK_STATUS: GLenum;
+    readonly LOW_FLOAT: GLenum;
+    readonly LOW_INT: GLenum;
+    readonly LUMINANCE: GLenum;
+    readonly LUMINANCE_ALPHA: GLenum;
+    readonly MAX_COMBINED_TEXTURE_IMAGE_UNITS: GLenum;
+    readonly MAX_CUBE_MAP_TEXTURE_SIZE: GLenum;
+    readonly MAX_FRAGMENT_UNIFORM_VECTORS: GLenum;
+    readonly MAX_RENDERBUFFER_SIZE: GLenum;
+    readonly MAX_TEXTURE_IMAGE_UNITS: GLenum;
+    readonly MAX_TEXTURE_SIZE: GLenum;
+    readonly MAX_VARYING_VECTORS: GLenum;
+    readonly MAX_VERTEX_ATTRIBS: GLenum;
+    readonly MAX_VERTEX_TEXTURE_IMAGE_UNITS: GLenum;
+    readonly MAX_VERTEX_UNIFORM_VECTORS: GLenum;
+    readonly MAX_VIEWPORT_DIMS: GLenum;
+    readonly MEDIUM_FLOAT: GLenum;
+    readonly MEDIUM_INT: GLenum;
+    readonly MIRRORED_REPEAT: GLenum;
+    readonly NEAREST: GLenum;
+    readonly NEAREST_MIPMAP_LINEAR: GLenum;
+    readonly NEAREST_MIPMAP_NEAREST: GLenum;
+    readonly NEVER: GLenum;
+    readonly NICEST: GLenum;
+    readonly NONE: GLenum;
+    readonly NOTEQUAL: GLenum;
+    readonly NO_ERROR: GLenum;
+    readonly ONE: GLenum;
+    readonly ONE_MINUS_CONSTANT_ALPHA: GLenum;
+    readonly ONE_MINUS_CONSTANT_COLOR: GLenum;
+    readonly ONE_MINUS_DST_ALPHA: GLenum;
+    readonly ONE_MINUS_DST_COLOR: GLenum;
+    readonly ONE_MINUS_SRC_ALPHA: GLenum;
+    readonly ONE_MINUS_SRC_COLOR: GLenum;
+    readonly OUT_OF_MEMORY: GLenum;
+    readonly PACK_ALIGNMENT: GLenum;
+    readonly POINTS: GLenum;
+    readonly POLYGON_OFFSET_FACTOR: GLenum;
+    readonly POLYGON_OFFSET_FILL: GLenum;
+    readonly POLYGON_OFFSET_UNITS: GLenum;
+    readonly RED_BITS: GLenum;
+    readonly RENDERBUFFER: GLenum;
+    readonly RENDERBUFFER_ALPHA_SIZE: GLenum;
+    readonly RENDERBUFFER_BINDING: GLenum;
+    readonly RENDERBUFFER_BLUE_SIZE: GLenum;
+    readonly RENDERBUFFER_DEPTH_SIZE: GLenum;
+    readonly RENDERBUFFER_GREEN_SIZE: GLenum;
+    readonly RENDERBUFFER_HEIGHT: GLenum;
+    readonly RENDERBUFFER_INTERNAL_FORMAT: GLenum;
+    readonly RENDERBUFFER_RED_SIZE: GLenum;
+    readonly RENDERBUFFER_STENCIL_SIZE: GLenum;
+    readonly RENDERBUFFER_WIDTH: GLenum;
+    readonly RENDERER: GLenum;
+    readonly REPEAT: GLenum;
+    readonly REPLACE: GLenum;
+    readonly RGB: GLenum;
+    readonly RGB565: GLenum;
+    readonly RGB5_A1: GLenum;
+    readonly RGBA: GLenum;
+    readonly RGBA4: GLenum;
+    readonly SAMPLER_2D: GLenum;
+    readonly SAMPLER_CUBE: GLenum;
+    readonly SAMPLES: GLenum;
+    readonly SAMPLE_ALPHA_TO_COVERAGE: GLenum;
+    readonly SAMPLE_BUFFERS: GLenum;
+    readonly SAMPLE_COVERAGE: GLenum;
+    readonly SAMPLE_COVERAGE_INVERT: GLenum;
+    readonly SAMPLE_COVERAGE_VALUE: GLenum;
+    readonly SCISSOR_BOX: GLenum;
+    readonly SCISSOR_TEST: GLenum;
+    readonly SHADER_TYPE: GLenum;
+    readonly SHADING_LANGUAGE_VERSION: GLenum;
+    readonly SHORT: GLenum;
+    readonly SRC_ALPHA: GLenum;
+    readonly SRC_ALPHA_SATURATE: GLenum;
+    readonly SRC_COLOR: GLenum;
+    readonly STATIC_DRAW: GLenum;
+    readonly STENCIL_ATTACHMENT: GLenum;
+    readonly STENCIL_BACK_FAIL: GLenum;
+    readonly STENCIL_BACK_FUNC: GLenum;
+    readonly STENCIL_BACK_PASS_DEPTH_FAIL: GLenum;
+    readonly STENCIL_BACK_PASS_DEPTH_PASS: GLenum;
+    readonly STENCIL_BACK_REF: GLenum;
+    readonly STENCIL_BACK_VALUE_MASK: GLenum;
+    readonly STENCIL_BACK_WRITEMASK: GLenum;
+    readonly STENCIL_BITS: GLenum;
+    readonly STENCIL_BUFFER_BIT: GLenum;
+    readonly STENCIL_CLEAR_VALUE: GLenum;
+    readonly STENCIL_FAIL: GLenum;
+    readonly STENCIL_FUNC: GLenum;
+    readonly STENCIL_INDEX8: GLenum;
+    readonly STENCIL_PASS_DEPTH_FAIL: GLenum;
+    readonly STENCIL_PASS_DEPTH_PASS: GLenum;
+    readonly STENCIL_REF: GLenum;
+    readonly STENCIL_TEST: GLenum;
+    readonly STENCIL_VALUE_MASK: GLenum;
+    readonly STENCIL_WRITEMASK: GLenum;
+    readonly STREAM_DRAW: GLenum;
+    readonly SUBPIXEL_BITS: GLenum;
+    readonly TEXTURE: GLenum;
+    readonly TEXTURE0: GLenum;
+    readonly TEXTURE1: GLenum;
+    readonly TEXTURE10: GLenum;
+    readonly TEXTURE11: GLenum;
+    readonly TEXTURE12: GLenum;
+    readonly TEXTURE13: GLenum;
+    readonly TEXTURE14: GLenum;
+    readonly TEXTURE15: GLenum;
+    readonly TEXTURE16: GLenum;
+    readonly TEXTURE17: GLenum;
+    readonly TEXTURE18: GLenum;
+    readonly TEXTURE19: GLenum;
+    readonly TEXTURE2: GLenum;
+    readonly TEXTURE20: GLenum;
+    readonly TEXTURE21: GLenum;
+    readonly TEXTURE22: GLenum;
+    readonly TEXTURE23: GLenum;
+    readonly TEXTURE24: GLenum;
+    readonly TEXTURE25: GLenum;
+    readonly TEXTURE26: GLenum;
+    readonly TEXTURE27: GLenum;
+    readonly TEXTURE28: GLenum;
+    readonly TEXTURE29: GLenum;
+    readonly TEXTURE3: GLenum;
+    readonly TEXTURE30: GLenum;
+    readonly TEXTURE31: GLenum;
+    readonly TEXTURE4: GLenum;
+    readonly TEXTURE5: GLenum;
+    readonly TEXTURE6: GLenum;
+    readonly TEXTURE7: GLenum;
+    readonly TEXTURE8: GLenum;
+    readonly TEXTURE9: GLenum;
+    readonly TEXTURE_2D: GLenum;
+    readonly TEXTURE_BINDING_2D: GLenum;
+    readonly TEXTURE_BINDING_CUBE_MAP: GLenum;
+    readonly TEXTURE_CUBE_MAP: GLenum;
+    readonly TEXTURE_CUBE_MAP_NEGATIVE_X: GLenum;
+    readonly TEXTURE_CUBE_MAP_NEGATIVE_Y: GLenum;
+    readonly TEXTURE_CUBE_MAP_NEGATIVE_Z: GLenum;
+    readonly TEXTURE_CUBE_MAP_POSITIVE_X: GLenum;
+    readonly TEXTURE_CUBE_MAP_POSITIVE_Y: GLenum;
+    readonly TEXTURE_CUBE_MAP_POSITIVE_Z: GLenum;
+    readonly TEXTURE_MAG_FILTER: GLenum;
+    readonly TEXTURE_MIN_FILTER: GLenum;
+    readonly TEXTURE_WRAP_S: GLenum;
+    readonly TEXTURE_WRAP_T: GLenum;
+    readonly TRIANGLES: GLenum;
+    readonly TRIANGLE_FAN: GLenum;
+    readonly TRIANGLE_STRIP: GLenum;
+    readonly UNPACK_ALIGNMENT: GLenum;
+    readonly UNPACK_COLORSPACE_CONVERSION_WEBGL: GLenum;
+    readonly UNPACK_FLIP_Y_WEBGL: GLenum;
+    readonly UNPACK_PREMULTIPLY_ALPHA_WEBGL: GLenum;
+    readonly UNSIGNED_BYTE: GLenum;
+    readonly UNSIGNED_INT: GLenum;
+    readonly UNSIGNED_SHORT: GLenum;
+    readonly UNSIGNED_SHORT_4_4_4_4: GLenum;
+    readonly UNSIGNED_SHORT_5_5_5_1: GLenum;
+    readonly UNSIGNED_SHORT_5_6_5: GLenum;
+    readonly VALIDATE_STATUS: GLenum;
+    readonly VENDOR: GLenum;
+    readonly VERSION: GLenum;
+    readonly VERTEX_ATTRIB_ARRAY_BUFFER_BINDING: GLenum;
+    readonly VERTEX_ATTRIB_ARRAY_ENABLED: GLenum;
+    readonly VERTEX_ATTRIB_ARRAY_NORMALIZED: GLenum;
+    readonly VERTEX_ATTRIB_ARRAY_POINTER: GLenum;
+    readonly VERTEX_ATTRIB_ARRAY_SIZE: GLenum;
+    readonly VERTEX_ATTRIB_ARRAY_STRIDE: GLenum;
+    readonly VERTEX_ATTRIB_ARRAY_TYPE: GLenum;
+    readonly VERTEX_SHADER: GLenum;
+    readonly VIEWPORT: GLenum;
+    readonly ZERO: GLenum;
+}
+
+export interface WebGLRenderingContextOverloads {
+    bufferData(target: GLenum, size: GLsizeiptr, usage: GLenum): void;
+    bufferData(target: GLenum, data: BufferSource | null, usage: GLenum): void;
+    bufferSubData(target: GLenum, offset: GLintptr, data: BufferSource): void;
+    compressedTexImage2D(target: GLenum, level: GLint, internalformat: GLenum, width: GLsizei, height: GLsizei, border: GLint, data: ArrayBufferView): void;
+    compressedTexSubImage2D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, width: GLsizei, height: GLsizei, format: GLenum, data: ArrayBufferView): void;
+    readPixels(x: GLint, y: GLint, width: GLsizei, height: GLsizei, format: GLenum, type: GLenum, pixels: ArrayBufferView | null): void;
+    texImage2D(target: GLenum, level: GLint, internalformat: GLint, width: GLsizei, height: GLsizei, border: GLint, format: GLenum, type: GLenum, pixels: ArrayBufferView | null): void;
+    texImage2D(target: GLenum, level: GLint, internalformat: GLint, format: GLenum, type: GLenum, source: TexImageSource): void;
+    texSubImage2D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, width: GLsizei, height: GLsizei, format: GLenum, type: GLenum, pixels: ArrayBufferView | null): void;
+    texSubImage2D(target: GLenum, level: GLint, xoffset: GLint, yoffset: GLint, format: GLenum, type: GLenum, source: TexImageSource): void;
+    uniform1fv(location: WebGLUniformLocation | null, v: Float32List): void;
+    uniform1iv(location: WebGLUniformLocation | null, v: Int32List): void;
+    uniform2fv(location: WebGLUniformLocation | null, v: Float32List): void;
+    uniform2iv(location: WebGLUniformLocation | null, v: Int32List): void;
+    uniform3fv(location: WebGLUniformLocation | null, v: Float32List): void;
+    uniform3iv(location: WebGLUniformLocation | null, v: Int32List): void;
+    uniform4fv(location: WebGLUniformLocation | null, v: Float32List): void;
+    uniform4iv(location: WebGLUniformLocation | null, v: Int32List): void;
+    uniformMatrix2fv(location: WebGLUniformLocation | null, transpose: GLboolean, value: Float32List): void;
+    uniformMatrix3fv(location: WebGLUniformLocation | null, transpose: GLboolean, value: Float32List): void;
+    uniformMatrix4fv(location: WebGLUniformLocation | null, transpose: GLboolean, value: Float32List): void;
+}
+
+export interface WebGLSampler extends WebGLObject {
+}
+
+
+/** The WebGLShader is part of the WebGL API and can either be a vertex or a fragment shader. A WebGLProgram requires both types of shaders. */
+export interface WebGLShader extends WebGLObject {
+}
+
+
+/** Part of the WebGL API and represents the information returned by calling the WebGLRenderingContext.getShaderPrecisionFormat() method. */
+export interface WebGLShaderPrecisionFormat {
+    readonly precision: GLint;
+    readonly rangeMax: GLint;
+    readonly rangeMin: GLint;
+}
+
+
+export interface WebGLSync extends WebGLObject {
+}
+
+
+/** Part of the WebGL API and represents an opaque texture object providing storage and state for texturing operations. */
+export interface WebGLTexture extends WebGLObject {
+}
+
+
+export interface WebGLTransformFeedback extends WebGLObject {
+}
+
+
+/** Part of the WebGL API and represents the location of a uniform variable in a shader program. */
+export interface WebGLUniformLocation {
+}
+
+
+export interface WebGLVertexArrayObject extends WebGLObject {
+}
+
+
+export interface WebGLVertexArrayObjectOES extends WebGLObject {
+}
+
+export interface WebKitPoint {
+    x: number;
+    y: number;
+}
+
+
+export interface WebSocketEventMap {
+    "close": CloseEvent;
+    "error": Event;
+    "message": MessageEvent;
+    "open": Event;
+}
+
+/** Provides the API for creating and managing a WebSocket connection to a server, as well as for sending and receiving data on the connection. */
+export interface WebSocket extends EventTarget {
+    /**
+     * Returns a string that indicates how binary data from the WebSocket object is exposed to scripts:
+     * 
+     * Can be set, to change how binary data is returned. The default is "blob".
+     */
+    binaryType: BinaryType;
+    /**
+     * Returns the number of bytes of application data (UTF-8 text and binary data) that have been queued using send() but not yet been transmitted to the network.
+     * 
+     * If the WebSocket connection is closed, this attribute's value will only increase with each call to the send() method. (The number does not reset to zero once the connection closes.)
+     */
+    readonly bufferedAmount: number;
+    /**
+     * Returns the extensions selected by the server, if any.
+     */
+    readonly extensions: string;
+    onclose: ((this: WebSocket, ev: CloseEvent) => any) | null;
+    onerror: ((this: WebSocket, ev: Event) => any) | null;
+    onmessage: ((this: WebSocket, ev: MessageEvent) => any) | null;
+    onopen: ((this: WebSocket, ev: Event) => any) | null;
+    /**
+     * Returns the subprotocol selected by the server, if any. It can be used in conjunction with the array form of the constructor's second argument to perform subprotocol negotiation.
+     */
+    readonly protocol: string;
+    /**
+     * Returns the state of the WebSocket object's connection. It can have the values described below.
+     */
+    readonly readyState: number;
+    /**
+     * Returns the URL that was used to establish the WebSocket connection.
+     */
+    readonly url: string;
+    /**
+     * Closes the WebSocket connection, optionally using code as the the WebSocket connection close code and reason as the the WebSocket connection close reason.
+     */
+    close(code?: number, reason?: string): void;
+    /**
+     * Transmits data using the WebSocket connection. data can be a string, a Blob, an ArrayBuffer, or an ArrayBufferView.
+     */
+    send(data: string | ArrayBufferLike | Blob | ArrayBufferView): void;
+    readonly CLOSED: number;
+    readonly CLOSING: number;
+    readonly CONNECTING: number;
+    readonly OPEN: number;
+    addEventListener<K extends keyof WebSocketEventMap>(type: K, listener: (this: WebSocket, ev: WebSocketEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof WebSocketEventMap>(type: K, listener: (this: WebSocket, ev: WebSocketEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Events that occur due to the user moving a mouse wheel or similar input device. */
+export interface WheelEvent extends MouseEvent {
+    readonly deltaMode: number;
+    readonly deltaX: number;
+    readonly deltaY: number;
+    readonly deltaZ: number;
+    readonly DOM_DELTA_LINE: number;
+    readonly DOM_DELTA_PAGE: number;
+    readonly DOM_DELTA_PIXEL: number;
+}
+
+
+export interface WindowEventMap extends GlobalEventHandlersEventMap, WindowEventHandlersEventMap {
+    "abort": UIEvent;
+    "afterprint": Event;
+    "beforeprint": Event;
+    "beforeunload": BeforeUnloadEvent;
+    "blur": FocusEvent;
+    "canplay": Event;
+    "canplaythrough": Event;
+    "change": Event;
+    "click": MouseEvent;
+    "compassneedscalibration": Event;
+    "contextmenu": MouseEvent;
+    "dblclick": MouseEvent;
+    "devicelight": DeviceLightEvent;
+    "devicemotion": DeviceMotionEvent;
+    "deviceorientation": DeviceOrientationEvent;
+    "deviceorientationabsolute": DeviceOrientationEvent;
+    "drag": DragEvent;
+    "dragend": DragEvent;
+    "dragenter": DragEvent;
+    "dragleave": DragEvent;
+    "dragover": DragEvent;
+    "dragstart": DragEvent;
+    "drop": DragEvent;
+    "durationchange": Event;
+    "emptied": Event;
+    "ended": Event;
+    "error": ErrorEvent;
+    "focus": FocusEvent;
+    "hashchange": HashChangeEvent;
+    "input": Event;
+    "invalid": Event;
+    "keydown": KeyboardEvent;
+    "keypress": KeyboardEvent;
+    "keyup": KeyboardEvent;
+    "load": Event;
+    "loadeddata": Event;
+    "loadedmetadata": Event;
+    "loadstart": Event;
+    "message": MessageEvent;
+    "mousedown": MouseEvent;
+    "mouseenter": MouseEvent;
+    "mouseleave": MouseEvent;
+    "mousemove": MouseEvent;
+    "mouseout": MouseEvent;
+    "mouseover": MouseEvent;
+    "mouseup": MouseEvent;
+    "mousewheel": Event;
+    "MSGestureChange": Event;
+    "MSGestureDoubleTap": Event;
+    "MSGestureEnd": Event;
+    "MSGestureHold": Event;
+    "MSGestureStart": Event;
+    "MSGestureTap": Event;
+    "MSInertiaStart": Event;
+    "MSPointerCancel": Event;
+    "MSPointerDown": Event;
+    "MSPointerEnter": Event;
+    "MSPointerLeave": Event;
+    "MSPointerMove": Event;
+    "MSPointerOut": Event;
+    "MSPointerOver": Event;
+    "MSPointerUp": Event;
+    "offline": Event;
+    "online": Event;
+    "orientationchange": Event;
+    "pagehide": PageTransitionEvent;
+    "pageshow": PageTransitionEvent;
+    "pause": Event;
+    "play": Event;
+    "playing": Event;
+    "popstate": PopStateEvent;
+    "progress": ProgressEvent<Window>;
+    "ratechange": Event;
+    "readystatechange": ProgressEvent<Window>;
+    "reset": Event;
+    "resize": UIEvent;
+    "scroll": Event;
+    "seeked": Event;
+    "seeking": Event;
+    "select": Event;
+    "stalled": Event;
+    "storage": StorageEvent;
+    "submit": Event;
+    "suspend": Event;
+    "timeupdate": Event;
+    "unload": Event;
+    "volumechange": Event;
+    "vrdisplayactivate": Event;
+    "vrdisplayblur": Event;
+    "vrdisplayconnect": Event;
+    "vrdisplaydeactivate": Event;
+    "vrdisplaydisconnect": Event;
+    "vrdisplayfocus": Event;
+    "vrdisplaypointerrestricted": Event;
+    "vrdisplaypointerunrestricted": Event;
+    "vrdisplaypresentchange": Event;
+    "waiting": Event;
+}
+
+/** A window containing a DOM document; the document property points to the DOM document loaded in that window. */
+export interface Window extends EventTarget, AnimationFrameProvider, GlobalEventHandlers, WindowConsole, WindowEventHandlers, WindowLocalStorage, WindowOrWorkerGlobalScope, WindowSessionStorage {
+    readonly applicationCache: ApplicationCache;
+    readonly clientInformation: Navigator;
+    readonly closed: boolean;
+    customElements: CustomElementRegistry;
+    defaultStatus: string;
+    readonly devicePixelRatio: number;
+    readonly doNotTrack: string;
+    readonly document: Document;
+    /** @deprecated */
+    readonly event: Event | undefined;
+    /** @deprecated */
+    readonly external: External;
+    readonly frameElement: Element;
+    readonly frames: Window;
+    readonly history: History;
+    readonly innerHeight: number;
+    readonly innerWidth: number;
+    readonly isSecureContext: boolean;
+    readonly length: number;
+    location: Location;
+    readonly locationbar: BarProp;
+    readonly menubar: BarProp;
+    readonly msContentScript: ExtensionScriptApis;
+    name: string;
+    readonly navigator: Navigator;
+    offscreenBuffering: string | boolean;
+    oncompassneedscalibration: ((this: Window, ev: Event) => any) | null;
+    ondevicelight: ((this: Window, ev: DeviceLightEvent) => any) | null;
+    ondevicemotion: ((this: Window, ev: DeviceMotionEvent) => any) | null;
+    ondeviceorientation: ((this: Window, ev: DeviceOrientationEvent) => any) | null;
+    ondeviceorientationabsolute: ((this: Window, ev: DeviceOrientationEvent) => any) | null;
+    onmousewheel: ((this: Window, ev: Event) => any) | null;
+    onmsgesturechange: ((this: Window, ev: Event) => any) | null;
+    onmsgesturedoubletap: ((this: Window, ev: Event) => any) | null;
+    onmsgestureend: ((this: Window, ev: Event) => any) | null;
+    onmsgesturehold: ((this: Window, ev: Event) => any) | null;
+    onmsgesturestart: ((this: Window, ev: Event) => any) | null;
+    onmsgesturetap: ((this: Window, ev: Event) => any) | null;
+    onmsinertiastart: ((this: Window, ev: Event) => any) | null;
+    onmspointercancel: ((this: Window, ev: Event) => any) | null;
+    onmspointerdown: ((this: Window, ev: Event) => any) | null;
+    onmspointerenter: ((this: Window, ev: Event) => any) | null;
+    onmspointerleave: ((this: Window, ev: Event) => any) | null;
+    onmspointermove: ((this: Window, ev: Event) => any) | null;
+    onmspointerout: ((this: Window, ev: Event) => any) | null;
+    onmspointerover: ((this: Window, ev: Event) => any) | null;
+    onmspointerup: ((this: Window, ev: Event) => any) | null;
+    /** @deprecated */
+    onorientationchange: ((this: Window, ev: Event) => any) | null;
+    onreadystatechange: ((this: Window, ev: ProgressEvent<Window>) => any) | null;
+    onvrdisplayactivate: ((this: Window, ev: Event) => any) | null;
+    onvrdisplayblur: ((this: Window, ev: Event) => any) | null;
+    onvrdisplayconnect: ((this: Window, ev: Event) => any) | null;
+    onvrdisplaydeactivate: ((this: Window, ev: Event) => any) | null;
+    onvrdisplaydisconnect: ((this: Window, ev: Event) => any) | null;
+    onvrdisplayfocus: ((this: Window, ev: Event) => any) | null;
+    onvrdisplaypointerrestricted: ((this: Window, ev: Event) => any) | null;
+    onvrdisplaypointerunrestricted: ((this: Window, ev: Event) => any) | null;
+    onvrdisplaypresentchange: ((this: Window, ev: Event) => any) | null;
+    opener: any;
+    /** @deprecated */
+    readonly orientation: string | number;
+    readonly outerHeight: number;
+    readonly outerWidth: number;
+    readonly pageXOffset: number;
+    readonly pageYOffset: number;
+    readonly parent: Window;
+    readonly personalbar: BarProp;
+    readonly screen: Screen;
+    readonly screenLeft: number;
+    readonly screenTop: number;
+    readonly screenX: number;
+    readonly screenY: number;
+    readonly scrollX: number;
+    readonly scrollY: number;
+    readonly scrollbars: BarProp;
+    readonly self: Window & typeof globalThis;
+    readonly speechSynthesis: SpeechSynthesis;
+    status: string;
+    readonly statusbar: BarProp;
+    readonly styleMedia: StyleMedia;
+    readonly toolbar: BarProp;
+    readonly top: Window;
+    readonly window: Window & typeof globalThis;
+    alert(message?: any): void;
+    blur(): void;
+    /** @deprecated */
+    captureEvents(): void;
+    close(): void;
+    confirm(message?: string): boolean;
+    departFocus(navigationReason: NavigationReason, origin: FocusNavigationOrigin): void;
+    focus(): void;
+    getComputedStyle(elt: Element, pseudoElt?: string | null): CSSStyleDeclaration;
+    getMatchedCSSRules(elt: Element, pseudoElt?: string | null): CSSRuleList;
+    getSelection(): Selection | null;
+    matchMedia(query: string): MediaQueryList;
+    moveBy(x: number, y: number): void;
+    moveTo(x: number, y: number): void;
+    msWriteProfilerMark(profilerMarkName: string): void;
+    open(url?: string, target?: string, features?: string, replace?: boolean): Window | null;
+    postMessage(message: any, targetOrigin: string, transfer?: Transferable[]): void;
+    print(): void;
+    prompt(message?: string, _default?: string): string | null;
+    /** @deprecated */
+    releaseEvents(): void;
+    resizeBy(x: number, y: number): void;
+    resizeTo(x: number, y: number): void;
+    scroll(options?: ScrollToOptions): void;
+    scroll(x: number, y: number): void;
+    scrollBy(options?: ScrollToOptions): void;
+    scrollBy(x: number, y: number): void;
+    scrollTo(options?: ScrollToOptions): void;
+    scrollTo(x: number, y: number): void;
+    stop(): void;
+    webkitCancelAnimationFrame(handle: number): void;
+    webkitConvertPointFromNodeToPage(node: Node, pt: WebKitPoint): WebKitPoint;
+    webkitConvertPointFromPageToNode(node: Node, pt: WebKitPoint): WebKitPoint;
+    webkitRequestAnimationFrame(callback: FrameRequestCallback): number;
+    addEventListener<K extends keyof WindowEventMap>(type: K, listener: (this: Window, ev: WindowEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof WindowEventMap>(type: K, listener: (this: Window, ev: WindowEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    [index: number]: Window;
+}
+
+
+export interface WindowConsole {
+    readonly console: Console;
+}
+
+export interface WindowEventHandlersEventMap {
+    "afterprint": Event;
+    "beforeprint": Event;
+    "beforeunload": BeforeUnloadEvent;
+    "hashchange": HashChangeEvent;
+    "languagechange": Event;
+    "message": MessageEvent;
+    "messageerror": MessageEvent;
+    "offline": Event;
+    "online": Event;
+    "pagehide": PageTransitionEvent;
+    "pageshow": PageTransitionEvent;
+    "popstate": PopStateEvent;
+    "rejectionhandled": PromiseRejectionEvent;
+    "storage": StorageEvent;
+    "unhandledrejection": PromiseRejectionEvent;
+    "unload": Event;
+}
+
+export interface WindowEventHandlers {
+    onafterprint: ((this: WindowEventHandlers, ev: Event) => any) | null;
+    onbeforeprint: ((this: WindowEventHandlers, ev: Event) => any) | null;
+    onbeforeunload: ((this: WindowEventHandlers, ev: BeforeUnloadEvent) => any) | null;
+    onhashchange: ((this: WindowEventHandlers, ev: HashChangeEvent) => any) | null;
+    onlanguagechange: ((this: WindowEventHandlers, ev: Event) => any) | null;
+    onmessage: ((this: WindowEventHandlers, ev: MessageEvent) => any) | null;
+    onmessageerror: ((this: WindowEventHandlers, ev: MessageEvent) => any) | null;
+    onoffline: ((this: WindowEventHandlers, ev: Event) => any) | null;
+    ononline: ((this: WindowEventHandlers, ev: Event) => any) | null;
+    onpagehide: ((this: WindowEventHandlers, ev: PageTransitionEvent) => any) | null;
+    onpageshow: ((this: WindowEventHandlers, ev: PageTransitionEvent) => any) | null;
+    onpopstate: ((this: WindowEventHandlers, ev: PopStateEvent) => any) | null;
+    onrejectionhandled: ((this: WindowEventHandlers, ev: PromiseRejectionEvent) => any) | null;
+    onstorage: ((this: WindowEventHandlers, ev: StorageEvent) => any) | null;
+    onunhandledrejection: ((this: WindowEventHandlers, ev: PromiseRejectionEvent) => any) | null;
+    onunload: ((this: WindowEventHandlers, ev: Event) => any) | null;
+    addEventListener<K extends keyof WindowEventHandlersEventMap>(type: K, listener: (this: WindowEventHandlers, ev: WindowEventHandlersEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof WindowEventHandlersEventMap>(type: K, listener: (this: WindowEventHandlers, ev: WindowEventHandlersEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+export interface WindowLocalStorage {
+    readonly localStorage: Storage;
+}
+
+export interface WindowOrWorkerGlobalScope {
+    readonly caches: CacheStorage;
+    readonly crypto: Crypto;
+    readonly indexedDB: IDBFactory;
+    readonly origin: string;
+    readonly performance: Performance;
+    atob(data: string): string;
+    btoa(data: string): string;
+    clearInterval(handle?: number): void;
+    clearTimeout(handle?: number): void;
+    createImageBitmap(image: ImageBitmapSource): Promise<ImageBitmap>;
+    createImageBitmap(image: ImageBitmapSource, sx: number, sy: number, sw: number, sh: number): Promise<ImageBitmap>;
+    fetch(input: RequestInfo, init?: RequestInit): Promise<Response>;
+    queueMicrotask(callback: VoidFunction): void;
+    setInterval(handler: TimerHandler, timeout?: number, ...args: any[]): number;
+    setTimeout(handler: TimerHandler, timeout?: number, ...args: any[]): number;
+}
+
+export interface WindowSessionStorage {
+    readonly sessionStorage: Storage;
+}
+
+export interface WorkerEventMap extends AbstractWorkerEventMap {
+    "message": MessageEvent;
+}
+
+/** This Web Workers API interface represents a background task that can be easily created and can send messages back to its creator. Creating a worker is as simple as calling the Worker() constructor and specifying a script to be run in the worker thread. */
+export interface Worker extends EventTarget, AbstractWorker {
+    onmessage: ((this: Worker, ev: MessageEvent) => any) | null;
+    postMessage(message: any, transfer: Transferable[]): void;
+    postMessage(message: any, options?: PostMessageOptions): void;
+    terminate(): void;
+    addEventListener<K extends keyof WorkerEventMap>(type: K, listener: (this: Worker, ev: WorkerEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof WorkerEventMap>(type: K, listener: (this: Worker, ev: WorkerEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface Worklet {
+    addModule(moduleURL: string, options?: WorkletOptions): Promise<void>;
+}
+
+
+/** This Streams API interface provides a standard abstraction for writing streaming data to a destination, known as a sink. This object comes with built-in backpressure and queuing. */
+export interface WritableStream<W = any> {
+    readonly locked: boolean;
+    abort(reason?: any): Promise<void>;
+    getWriter(): WritableStreamDefaultWriter<W>;
+}
+
+
+/** This Streams API interface represents a controller allowing control of a WritableStream's state. When constructing a WritableStream, the underlying sink is given a corresponding WritableStreamDefaultController instance to manipulate. */
+export interface WritableStreamDefaultController {
+    error(error?: any): void;
+}
+
+/** This Streams API interface is the object returned by WritableStream.getWriter() and once created locks the < writer to the WritableStream ensuring that no other streams can write to the underlying sink. */
+export interface WritableStreamDefaultWriter<W = any> {
+    readonly closed: Promise<void>;
+    readonly desiredSize: number | null;
+    readonly ready: Promise<void>;
+    abort(reason?: any): Promise<void>;
+    close(): Promise<void>;
+    releaseLock(): void;
+    write(chunk: W): Promise<void>;
+}
+
+/** An XML document. It inherits from the generic Document and does not add any specific methods or properties to it: nevertheless, several algorithms behave differently with the two types of documents. */
+export interface XMLDocument extends Document {
+    addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: XMLDocument, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: XMLDocument, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface XMLHttpRequestEventMap extends XMLHttpRequestEventTargetEventMap {
+    "readystatechange": Event;
+}
+
+/** Use XMLHttpRequest (XHR) objects to interact with servers. You can retrieve data from a URL without having to do a full page refresh. This enables a Web page to update just part of a page without disrupting what the user is doing. */
+export interface XMLHttpRequest extends XMLHttpRequestEventTarget {
+    onreadystatechange: ((this: XMLHttpRequest, ev: Event) => any) | null;
+    /**
+     * Returns client's state.
+     */
+    readonly readyState: number;
+    /**
+     * Returns the response's body.
+     */
+    readonly response: any;
+    /**
+     * Returns the text response.
+     * 
+     * Throws an "InvalidStateError" DOMException if responseType is not the empty string or "text".
+     */
+    readonly responseText: string;
+    /**
+     * Returns the response type.
+     * 
+     * Can be set to change the response type. Values are: the empty string (default), "arraybuffer", "blob", "document", "json", and "text".
+     * 
+     * When set: setting to "document" is ignored if current global object is not a Window object.
+     * 
+     * When set: throws an "InvalidStateError" DOMException if state is loading or done.
+     * 
+     * When set: throws an "InvalidAccessError" DOMException if the synchronous flag is set and current global object is a Window object.
+     */
+    responseType: XMLHttpRequestResponseType;
+    readonly responseURL: string;
+    /**
+     * Returns the document response.
+     * 
+     * Throws an "InvalidStateError" DOMException if responseType is not the empty string or "document".
+     */
+    readonly responseXML: Document | null;
+    readonly status: number;
+    readonly statusText: string;
+    /**
+     * Can be set to a time in milliseconds. When set to a non-zero value will cause fetching to terminate after the given time has passed. When the time has passed, the request has not yet completed, and the synchronous flag is unset, a timeout event will then be dispatched, or a "TimeoutError" DOMException will be thrown otherwise (for the send() method).
+     * 
+     * When set: throws an "InvalidAccessError" DOMException if the synchronous flag is set and current global object is a Window object.
+     */
+    timeout: number;
+    /**
+     * Returns the associated XMLHttpRequestUpload object. It can be used to gather transmission information when data is transferred to a server.
+     */
+    readonly upload: XMLHttpRequestUpload;
+    /**
+     * True when credentials are to be included in a cross-origin request. False when they are to be excluded in a cross-origin request and when cookies are to be ignored in its response. Initially false.
+     * 
+     * When set: throws an "InvalidStateError" DOMException if state is not unsent or opened, or if the send() flag is set.
+     */
+    withCredentials: boolean;
+    /**
+     * Cancels any network activity.
+     */
+    abort(): void;
+    getAllResponseHeaders(): string;
+    getResponseHeader(name: string): string | null;
+    /**
+     * Sets the request method, request URL, and synchronous flag.
+     * 
+     * Throws a "SyntaxError" DOMException if either method is not a valid HTTP method or url cannot be parsed.
+     * 
+     * Throws a "SecurityError" DOMException if method is a case-insensitive match for `CONNECT`, `TRACE`, or `TRACK`.
+     * 
+     * Throws an "InvalidAccessError" DOMException if async is false, current global object is a Window object, and the timeout attribute is not zero or the responseType attribute is not the empty string.
+     */
+    open(method: string, url: string): void;
+    open(method: string, url: string, async: boolean, username?: string | null, password?: string | null): void;
+    /**
+     * Acts as if the `Content-Type` header value for response is mime. (It does not actually change the header though.)
+     * 
+     * Throws an "InvalidStateError" DOMException if state is loading or done.
+     */
+    overrideMimeType(mime: string): void;
+    /**
+     * Initiates the request. The body argument provides the request body, if any, and is ignored if the request method is GET or HEAD.
+     * 
+     * Throws an "InvalidStateError" DOMException if either state is not opened or the send() flag is set.
+     */
+    send(body?: Document | BodyInit | null): void;
+    /**
+     * Combines a header in author request headers.
+     * 
+     * Throws an "InvalidStateError" DOMException if either state is not opened or the send() flag is set.
+     * 
+     * Throws a "SyntaxError" DOMException if name is not a header name or if value is not a header value.
+     */
+    setRequestHeader(name: string, value: string): void;
+    readonly DONE: number;
+    readonly HEADERS_RECEIVED: number;
+    readonly LOADING: number;
+    readonly OPENED: number;
+    readonly UNSENT: number;
+    addEventListener<K extends keyof XMLHttpRequestEventMap>(type: K, listener: (this: XMLHttpRequest, ev: XMLHttpRequestEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof XMLHttpRequestEventMap>(type: K, listener: (this: XMLHttpRequest, ev: XMLHttpRequestEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface XMLHttpRequestEventTargetEventMap {
+    "abort": ProgressEvent<XMLHttpRequestEventTarget>;
+    "error": ProgressEvent<XMLHttpRequestEventTarget>;
+    "load": ProgressEvent<XMLHttpRequestEventTarget>;
+    "loadend": ProgressEvent<XMLHttpRequestEventTarget>;
+    "loadstart": ProgressEvent<XMLHttpRequestEventTarget>;
+    "progress": ProgressEvent<XMLHttpRequestEventTarget>;
+    "timeout": ProgressEvent<XMLHttpRequestEventTarget>;
+}
+
+export interface XMLHttpRequestEventTarget extends EventTarget {
+    onabort: ((this: XMLHttpRequest, ev: ProgressEvent) => any) | null;
+    onerror: ((this: XMLHttpRequest, ev: ProgressEvent) => any) | null;
+    onload: ((this: XMLHttpRequest, ev: ProgressEvent) => any) | null;
+    onloadend: ((this: XMLHttpRequest, ev: ProgressEvent) => any) | null;
+    onloadstart: ((this: XMLHttpRequest, ev: ProgressEvent) => any) | null;
+    onprogress: ((this: XMLHttpRequest, ev: ProgressEvent) => any) | null;
+    ontimeout: ((this: XMLHttpRequest, ev: ProgressEvent) => any) | null;
+    addEventListener<K extends keyof XMLHttpRequestEventTargetEventMap>(type: K, listener: (this: XMLHttpRequestEventTarget, ev: XMLHttpRequestEventTargetEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof XMLHttpRequestEventTargetEventMap>(type: K, listener: (this: XMLHttpRequestEventTarget, ev: XMLHttpRequestEventTargetEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export interface XMLHttpRequestUpload extends XMLHttpRequestEventTarget {
+    addEventListener<K extends keyof XMLHttpRequestEventTargetEventMap>(type: K, listener: (this: XMLHttpRequestUpload, ev: XMLHttpRequestEventTargetEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof XMLHttpRequestEventTargetEventMap>(type: K, listener: (this: XMLHttpRequestUpload, ev: XMLHttpRequestEventTargetEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+/** Provides the serializeToString() method to construct an XML string representing a DOM tree. */
+export interface XMLSerializer {
+    serializeToString(root: Node): string;
+}
+
+
+/** The XPathEvaluator interface allows to compile and evaluate XPath expressions. */
+export interface XPathEvaluator extends XPathEvaluatorBase {
+}
+
+
+export interface XPathEvaluatorBase {
+    createExpression(expression: string, resolver?: XPathNSResolver | null): XPathExpression;
+    createNSResolver(nodeResolver: Node): XPathNSResolver;
+    evaluate(expression: string, contextNode: Node, resolver?: XPathNSResolver | null, type?: number, result?: XPathResult | null): XPathResult;
+}
+
+/** This interface is a compiled XPath expression that can be evaluated on a document or specific node to return information its DOM tree. */
+export interface XPathExpression {
+    evaluate(contextNode: Node, type?: number, result?: XPathResult | null): XPathResult;
+}
+
+
+/** The results generated by evaluating an XPath expression within the context of a given node. */
+export interface XPathResult {
+    readonly booleanValue: boolean;
+    readonly invalidIteratorState: boolean;
+    readonly numberValue: number;
+    readonly resultType: number;
+    readonly singleNodeValue: Node | null;
+    readonly snapshotLength: number;
+    readonly stringValue: string;
+    iterateNext(): Node | null;
+    snapshotItem(index: number): Node | null;
+    readonly ANY_TYPE: number;
+    readonly ANY_UNORDERED_NODE_TYPE: number;
+    readonly BOOLEAN_TYPE: number;
+    readonly FIRST_ORDERED_NODE_TYPE: number;
+    readonly NUMBER_TYPE: number;
+    readonly ORDERED_NODE_ITERATOR_TYPE: number;
+    readonly ORDERED_NODE_SNAPSHOT_TYPE: number;
+    readonly STRING_TYPE: number;
+    readonly UNORDERED_NODE_ITERATOR_TYPE: number;
+    readonly UNORDERED_NODE_SNAPSHOT_TYPE: number;
+}
+
+
+/** An XSLTProcessor applies an XSLT stylesheet transformation to an XML document to produce a new XML document as output. It has methods to load the XSLT stylesheet, to manipulate <xsl:param> parameter values, and to apply the transformation to documents. */
+export interface XSLTProcessor {
+    clearParameters(): void;
+    getParameter(namespaceURI: string, localName: string): any;
+    importStylesheet(style: Node): void;
+    removeParameter(namespaceURI: string, localName: string): void;
+    reset(): void;
+    setParameter(namespaceURI: string, localName: string, value: any): void;
+    transformToDocument(source: Node): Document;
+    transformToFragment(source: Node, document: Document): DocumentFragment;
+}
+
+
+export interface webkitRTCPeerConnection extends RTCPeerConnection {
+    addEventListener<K extends keyof RTCPeerConnectionEventMap>(type: K, listener: (this: webkitRTCPeerConnection, ev: RTCPeerConnectionEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+    removeEventListener<K extends keyof RTCPeerConnectionEventMap>(type: K, listener: (this: webkitRTCPeerConnection, ev: RTCPeerConnectionEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+}
+
+
+export declare type EventListenerOrEventListenerObject = EventListener | EventListenerObject;
+
+
+export interface BlobCallback {
+    (blob: Blob | null): void;
+}
+
+export interface CustomElementConstructor {
+    new (): HTMLElement;
+}
+
+export interface DecodeErrorCallback {
+    (error: DOMException): void;
+}
+
+export interface DecodeSuccessCallback {
+    (decodedData: AudioBuffer): void;
+}
+
+export interface EventHandlerNonNull {
+    (event: Event): any;
+}
+
+export interface ForEachCallback {
+    (keyId: Int8Array | Int16Array | Int32Array | Uint8Array | Uint16Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array | DataView | ArrayBuffer | null, status: MediaKeyStatus): void;
+}
+
+export interface FrameRequestCallback {
+    (time: number): void;
+}
+
+export interface FunctionStringCallback {
+    (data: string): void;
+}
+
+export interface IntersectionObserverCallback {
+    (entries: IntersectionObserverEntry[], observer: IntersectionObserver): void;
+}
+
+export interface MSLaunchUriCallback {
+    (): void;
+}
+
+export interface MutationCallback {
+    (mutations: MutationRecord[], observer: MutationObserver): void;
+}
+
+export interface NavigatorUserMediaErrorCallback {
+    (error: MediaStreamError): void;
+}
+
+export interface NavigatorUserMediaSuccessCallback {
+    (stream: MediaStream): void;
+}
+
+export interface NotificationPermissionCallback {
+    (permission: NotificationPermission): void;
+}
+
+export interface OnBeforeUnloadEventHandlerNonNull {
+    (event: Event): string | null;
+}
+
+export interface OnErrorEventHandlerNonNull {
+    (event: Event | string, source?: string, lineno?: number, colno?: number, error?: Error): any;
+}
+
+export interface PerformanceObserverCallback {
+    (entries: PerformanceObserverEntryList, observer: PerformanceObserver): void;
+}
+
+export interface PositionCallback {
+    (position: Position): void;
+}
+
+export interface PositionErrorCallback {
+    (positionError: PositionError): void;
+}
+
+export interface QueuingStrategySizeCallback<T = any> {
+    (chunk: T): number;
+}
+
+export interface RTCPeerConnectionErrorCallback {
+    (error: DOMException): void;
+}
+
+export interface RTCSessionDescriptionCallback {
+    (description: RTCSessionDescriptionInit): void;
+}
+
+export interface RTCStatsCallback {
+    (report: RTCStatsReport): void;
+}
+
+export interface ReadableByteStreamControllerCallback {
+    (controller: ReadableByteStreamController): void | PromiseLike<void>;
+}
+
+export interface ReadableStreamDefaultControllerCallback<R> {
+    (controller: ReadableStreamDefaultController<R>): void | PromiseLike<void>;
+}
+
+export interface ReadableStreamErrorCallback {
+    (reason: any): void | PromiseLike<void>;
+}
+
+export interface TransformStreamDefaultControllerCallback<O> {
+    (controller: TransformStreamDefaultController<O>): void | PromiseLike<void>;
+}
+
+export interface TransformStreamDefaultControllerTransformCallback<I, O> {
+    (chunk: I, controller: TransformStreamDefaultController<O>): void | PromiseLike<void>;
+}
+
+export interface VoidFunction {
+    (): void;
+}
+
+export interface WritableStreamDefaultControllerCloseCallback {
+    (): void | PromiseLike<void>;
+}
+
+export interface WritableStreamDefaultControllerStartCallback {
+    (controller: WritableStreamDefaultController): void | PromiseLike<void>;
+}
+
+export interface WritableStreamDefaultControllerWriteCallback<W> {
+    (chunk: W, controller: WritableStreamDefaultController): void | PromiseLike<void>;
+}
+
+export interface WritableStreamErrorCallback {
+    (reason: any): void | PromiseLike<void>;
+}
+
+export interface HTMLElementTagNameMap {
+    "a": HTMLAnchorElement;
+    "abbr": HTMLElement;
+    "address": HTMLElement;
+    "applet": HTMLAppletElement;
+    "area": HTMLAreaElement;
+    "article": HTMLElement;
+    "aside": HTMLElement;
+    "audio": HTMLAudioElement;
+    "b": HTMLElement;
+    "base": HTMLBaseElement;
+    "basefont": HTMLBaseFontElement;
+    "bdi": HTMLElement;
+    "bdo": HTMLElement;
+    "blockquote": HTMLQuoteElement;
+    "body": HTMLBodyElement;
+    "br": HTMLBRElement;
+    "button": HTMLButtonElement;
+    "canvas": HTMLCanvasElement;
+    "caption": HTMLTableCaptionElement;
+    "cite": HTMLElement;
+    "code": HTMLElement;
+    "col": HTMLTableColElement;
+    "colgroup": HTMLTableColElement;
+    "data": HTMLDataElement;
+    "datalist": HTMLDataListElement;
+    "dd": HTMLElement;
+    "del": HTMLModElement;
+    "details": HTMLDetailsElement;
+    "dfn": HTMLElement;
+    "dialog": HTMLDialogElement;
+    "dir": HTMLDirectoryElement;
+    "div": HTMLDivElement;
+    "dl": HTMLDListElement;
+    "dt": HTMLElement;
+    "em": HTMLElement;
+    "embed": HTMLEmbedElement;
+    "fieldset": HTMLFieldSetElement;
+    "figcaption": HTMLElement;
+    "figure": HTMLElement;
+    "font": HTMLFontElement;
+    "footer": HTMLElement;
+    "form": HTMLFormElement;
+    "frame": HTMLFrameElement;
+    "frameset": HTMLFrameSetElement;
+    "h1": HTMLHeadingElement;
+    "h2": HTMLHeadingElement;
+    "h3": HTMLHeadingElement;
+    "h4": HTMLHeadingElement;
+    "h5": HTMLHeadingElement;
+    "h6": HTMLHeadingElement;
+    "head": HTMLHeadElement;
+    "header": HTMLElement;
+    "hgroup": HTMLElement;
+    "hr": HTMLHRElement;
+    "html": HTMLHtmlElement;
+    "i": HTMLElement;
+    "iframe": HTMLIFrameElement;
+    "img": HTMLImageElement;
+    "input": HTMLInputElement;
+    "ins": HTMLModElement;
+    "kbd": HTMLElement;
+    "label": HTMLLabelElement;
+    "legend": HTMLLegendElement;
+    "li": HTMLLIElement;
+    "link": HTMLLinkElement;
+    "main": HTMLElement;
+    "map": HTMLMapElement;
+    "mark": HTMLElement;
+    "marquee": HTMLMarqueeElement;
+    "menu": HTMLMenuElement;
+    "meta": HTMLMetaElement;
+    "meter": HTMLMeterElement;
+    "nav": HTMLElement;
+    "noscript": HTMLElement;
+    "object": HTMLObjectElement;
+    "ol": HTMLOListElement;
+    "optgroup": HTMLOptGroupElement;
+    "option": HTMLOptionElement;
+    "output": HTMLOutputElement;
+    "p": HTMLParagraphElement;
+    "param": HTMLParamElement;
+    "picture": HTMLPictureElement;
+    "pre": HTMLPreElement;
+    "progress": HTMLProgressElement;
+    "q": HTMLQuoteElement;
+    "rp": HTMLElement;
+    "rt": HTMLElement;
+    "ruby": HTMLElement;
+    "s": HTMLElement;
+    "samp": HTMLElement;
+    "script": HTMLScriptElement;
+    "section": HTMLElement;
+    "select": HTMLSelectElement;
+    "slot": HTMLSlotElement;
+    "small": HTMLElement;
+    "source": HTMLSourceElement;
+    "span": HTMLSpanElement;
+    "strong": HTMLElement;
+    "style": HTMLStyleElement;
+    "sub": HTMLElement;
+    "summary": HTMLElement;
+    "sup": HTMLElement;
+    "table": HTMLTableElement;
+    "tbody": HTMLTableSectionElement;
+    "td": HTMLTableDataCellElement;
+    "template": HTMLTemplateElement;
+    "textarea": HTMLTextAreaElement;
+    "tfoot": HTMLTableSectionElement;
+    "th": HTMLTableHeaderCellElement;
+    "thead": HTMLTableSectionElement;
+    "time": HTMLTimeElement;
+    "title": HTMLTitleElement;
+    "tr": HTMLTableRowElement;
+    "track": HTMLTrackElement;
+    "u": HTMLElement;
+    "ul": HTMLUListElement;
+    "var": HTMLElement;
+    "video": HTMLVideoElement;
+    "wbr": HTMLElement;
+}
+
+export interface HTMLElementDeprecatedTagNameMap {
+    "listing": HTMLPreElement;
+    "xmp": HTMLPreElement;
+}
+
+export interface SVGElementTagNameMap {
+    "a": SVGAElement;
+    "circle": SVGCircleElement;
+    "clipPath": SVGClipPathElement;
+    "defs": SVGDefsElement;
+    "desc": SVGDescElement;
+    "ellipse": SVGEllipseElement;
+    "feBlend": SVGFEBlendElement;
+    "feColorMatrix": SVGFEColorMatrixElement;
+    "feComponentTransfer": SVGFEComponentTransferElement;
+    "feComposite": SVGFECompositeElement;
+    "feConvolveMatrix": SVGFEConvolveMatrixElement;
+    "feDiffuseLighting": SVGFEDiffuseLightingElement;
+    "feDisplacementMap": SVGFEDisplacementMapElement;
+    "feDistantLight": SVGFEDistantLightElement;
+    "feFlood": SVGFEFloodElement;
+    "feFuncA": SVGFEFuncAElement;
+    "feFuncB": SVGFEFuncBElement;
+    "feFuncG": SVGFEFuncGElement;
+    "feFuncR": SVGFEFuncRElement;
+    "feGaussianBlur": SVGFEGaussianBlurElement;
+    "feImage": SVGFEImageElement;
+    "feMerge": SVGFEMergeElement;
+    "feMergeNode": SVGFEMergeNodeElement;
+    "feMorphology": SVGFEMorphologyElement;
+    "feOffset": SVGFEOffsetElement;
+    "fePointLight": SVGFEPointLightElement;
+    "feSpecularLighting": SVGFESpecularLightingElement;
+    "feSpotLight": SVGFESpotLightElement;
+    "feTile": SVGFETileElement;
+    "feTurbulence": SVGFETurbulenceElement;
+    "filter": SVGFilterElement;
+    "foreignObject": SVGForeignObjectElement;
+    "g": SVGGElement;
+    "image": SVGImageElement;
+    "line": SVGLineElement;
+    "linearGradient": SVGLinearGradientElement;
+    "marker": SVGMarkerElement;
+    "mask": SVGMaskElement;
+    "metadata": SVGMetadataElement;
+    "path": SVGPathElement;
+    "pattern": SVGPatternElement;
+    "polygon": SVGPolygonElement;
+    "polyline": SVGPolylineElement;
+    "radialGradient": SVGRadialGradientElement;
+    "rect": SVGRectElement;
+    "script": SVGScriptElement;
+    "stop": SVGStopElement;
+    "style": SVGStyleElement;
+    "svg": SVGSVGElement;
+    "switch": SVGSwitchElement;
+    "symbol": SVGSymbolElement;
+    "text": SVGTextElement;
+    "textPath": SVGTextPathElement;
+    "title": SVGTitleElement;
+    "tspan": SVGTSpanElement;
+    "use": SVGUseElement;
+    "view": SVGViewElement;
+}
+
+/** @deprecated Directly use HTMLElementTagNameMap or SVGElementTagNameMap as appropriate, instead. */
+export type ElementTagNameMap = HTMLElementTagNameMap & Pick<SVGElementTagNameMap, Exclude<keyof SVGElementTagNameMap, keyof HTMLElementTagNameMap>>;
+
+/** @deprecated */
+/** @deprecated */
+/** @deprecated */
+/** @deprecated */
+/** @deprecated */
+/** @deprecated */
+/**
+ * Dispatches a synthetic event event to target and returns true if either event's cancelable attribute value is false or its preventDefault() method was not invoked, and false otherwise.
+ */
+/**
+ * Fires when the user aborts the download.
+ * @param ev The event.
+ */
+/**
+ * Fires when the object loses the input focus.
+ * @param ev The focus event.
+ */
+/**
+ * Occurs when playback is possible, but would require further buffering.
+ * @param ev The event.
+ */
+/**
+ * Fires when the contents of the object or selection have changed.
+ * @param ev The event.
+ */
+/**
+ * Fires when the user clicks the left mouse button on the object
+ * @param ev The mouse event.
+ */
+/**
+ * Fires when the user clicks the right mouse button in the client area, opening the context menu.
+ * @param ev The mouse event.
+ */
+/**
+ * Fires when the user double-clicks the object.
+ * @param ev The mouse event.
+ */
+/**
+ * Fires on the source object continuously during a drag operation.
+ * @param ev The event.
+ */
+/**
+ * Fires on the source object when the user releases the mouse at the close of a drag operation.
+ * @param ev The event.
+ */
+/**
+ * Fires on the target element when the user drags the object to a valid drop target.
+ * @param ev The drag event.
+ */
+/**
+ * Fires on the target object when the user moves the mouse out of a valid drop target during a drag operation.
+ * @param ev The drag event.
+ */
+/**
+ * Fires on the target element continuously while the user drags the object over a valid drop target.
+ * @param ev The event.
+ */
+/**
+ * Fires on the source object when the user starts to drag a text selection or selected object.
+ * @param ev The event.
+ */
+/**
+ * Occurs when the duration attribute is updated.
+ * @param ev The event.
+ */
+/**
+ * Occurs when the media element is reset to its initial state.
+ * @param ev The event.
+ */
+/**
+ * Occurs when the end of playback is reached.
+ * @param ev The event
+ */
+/**
+ * Fires when an error occurs during object loading.
+ * @param ev The event.
+ */
+/**
+ * Fires when the object receives focus.
+ * @param ev The event.
+ */
+/**
+ * Fires when the user presses a key.
+ * @param ev The keyboard event
+ */
+/**
+ * Fires when the user presses an alphanumeric key.
+ * @param ev The event.
+ */
+/**
+ * Fires when the user releases a key.
+ * @param ev The keyboard event
+ */
+/**
+ * Fires immediately after the browser loads the object.
+ * @param ev The event.
+ */
+/**
+ * Occurs when media data is loaded at the current playback position.
+ * @param ev The event.
+ */
+/**
+ * Occurs when the duration and dimensions of the media have been determined.
+ * @param ev The event.
+ */
+/**
+ * Occurs when Internet Explorer begins looking for media data.
+ * @param ev The event.
+ */
+/**
+ * Fires when the user clicks the object with either mouse button.
+ * @param ev The mouse event.
+ */
+/**
+ * Fires when the user moves the mouse over the object.
+ * @param ev The mouse event.
+ */
+/**
+ * Fires when the user moves the mouse pointer outside the boundaries of the object.
+ * @param ev The mouse event.
+ */
+/**
+ * Fires when the user moves the mouse pointer into the object.
+ * @param ev The mouse event.
+ */
+/**
+ * Fires when the user releases a mouse button while the mouse is over the object.
+ * @param ev The mouse event.
+ */
+/**
+ * Occurs when playback is paused.
+ * @param ev The event.
+ */
+/**
+ * Occurs when the play method is requested.
+ * @param ev The event.
+ */
+/**
+ * Occurs when the audio or video has started playing.
+ * @param ev The event.
+ */
+/**
+ * Occurs to indicate progress while downloading media data.
+ * @param ev The event.
+ */
+/**
+ * Occurs when the playback rate is increased or decreased.
+ * @param ev The event.
+ */
+/**
+ * Fires when the user resets a form.
+ * @param ev The event.
+ */
+/**
+ * Fires when the user repositions the scroll box in the scroll bar on the object.
+ * @param ev The event.
+ */
+/**
+ * Occurs when the seek operation ends.
+ * @param ev The event.
+ */
+/**
+ * Occurs when the current playback position is moved.
+ * @param ev The event.
+ */
+/**
+ * Fires when the current selection changes.
+ * @param ev The event.
+ */
+/**
+ * Occurs when the download has stopped.
+ * @param ev The event.
+ */
+/**
+ * Occurs if the load operation has been intentionally halted.
+ * @param ev The event.
+ */
+/**
+ * Occurs to indicate the current playback position.
+ * @param ev The event.
+ */
+/**
+ * Occurs when the volume is changed, or playback is muted or unmuted.
+ * @param ev The event.
+ */
+/**
+ * Occurs when playback stops because the next frame of a video resource is not available.
+ * @param ev The event.
+ */
+export type HeadersInit = Headers | string[][] | Record<string, string>;
+export type BodyInit = Blob | BufferSource | FormData | URLSearchParams | ReadableStream<Uint8Array> | string;
+export type RequestInfo = Request | string;
+export type BlobPart = BufferSource | Blob | string;
+export type DOMHighResTimeStamp = number;
+export type RenderingContext = CanvasRenderingContext2D | ImageBitmapRenderingContext | WebGLRenderingContext | WebGL2RenderingContext;
+export type HTMLOrSVGImageElement = HTMLImageElement | SVGImageElement;
+export type CanvasImageSource = HTMLOrSVGImageElement | HTMLVideoElement | HTMLCanvasElement | ImageBitmap | OffscreenCanvas;
+export type OffscreenRenderingContext = OffscreenCanvasRenderingContext2D | ImageBitmapRenderingContext | WebGLRenderingContext | WebGL2RenderingContext;
+export type MessageEventSource = WindowProxy | MessagePort | ServiceWorker;
+export type HTMLOrSVGScriptElement = HTMLScriptElement | SVGScriptElement;
+export type ImageBitmapSource = CanvasImageSource | Blob | ImageData;
+export type OnErrorEventHandler = OnErrorEventHandlerNonNull | null;
+export type OnBeforeUnloadEventHandler = OnBeforeUnloadEventHandlerNonNull | null;
+export type TimerHandler = string | Function;
+export type ConstrainULong = number | ConstrainULongRange;
+export type ConstrainDouble = number | ConstrainDoubleRange;
+export type ConstrainBoolean = boolean | ConstrainBooleanParameters;
+export type ConstrainDOMString = string | string[] | ConstrainDOMStringParameters;
+export type PerformanceEntryList = PerformanceEntry[];
+export type ReadableStreamReadResult<T> = ReadableStreamReadValueResult<T> | ReadableStreamReadDoneResult<T>;
+export type VibratePattern = number | number[];
+export type COSEAlgorithmIdentifier = number;
+export type AuthenticatorSelectionList = AAGUID[];
+export type AAGUID = BufferSource;
+export type AuthenticationExtensionsSupported = string[];
+export type UvmEntry = number[];
+export type UvmEntries = UvmEntry[];
+export type AlgorithmIdentifier = string | Algorithm;
+export type HashAlgorithmIdentifier = AlgorithmIdentifier;
+export type BigInteger = Uint8Array;
+export type NamedCurve = string;
+export type GLenum = number;
+export type GLboolean = boolean;
+export type GLbitfield = number;
+export type GLint = number;
+export type GLsizei = number;
+export type GLintptr = number;
+export type GLsizeiptr = number;
+export type GLuint = number;
+export type GLfloat = number;
+export type GLclampf = number;
+export type TexImageSource = ImageBitmap | ImageData | HTMLImageElement | HTMLCanvasElement | HTMLVideoElement | OffscreenCanvas;
+export type Float32List = Float32Array | GLfloat[];
+export type Int32List = Int32Array | GLint[];
+export type GLint64 = number;
+export type GLuint64 = number;
+export type Uint32List = Uint32Array | GLuint[];
+export type BufferSource = ArrayBufferView | ArrayBuffer;
+export type DOMTimeStamp = number;
+export type LineAndPositionSetting = number | AutoKeyword;
+export type FormDataEntryValue = File | string;
+export type InsertPosition = "beforebegin" | "afterbegin" | "beforeend" | "afterend";
+export type IDBValidKey = number | string | Date | BufferSource | IDBArrayKey;
+export type MutationRecordType = "attributes" | "characterData" | "childList";
+export type IDBKeyPath = string;
+export type Transferable = ArrayBuffer | MessagePort | ImageBitmap | OffscreenCanvas;
+export type RTCIceGatherCandidate = RTCIceCandidateDictionary | RTCIceCandidateComplete;
+export type RTCTransport = RTCDtlsTransport | RTCSrtpSdesTransport;
+/** @deprecated */
+export type MouseWheelEvent = WheelEvent;
+export type WindowProxy = Window;
+export type AlignSetting = "center" | "end" | "left" | "right" | "start";
+export type AnimationPlayState = "finished" | "idle" | "paused" | "running";
+export type AppendMode = "segments" | "sequence";
+export type AttestationConveyancePreference = "direct" | "indirect" | "none";
+export type AudioContextLatencyCategory = "balanced" | "interactive" | "playback";
+export type AudioContextState = "closed" | "running" | "suspended";
+export type AuthenticatorAttachment = "cross-platform" | "platform";
+export type AuthenticatorTransport = "ble" | "internal" | "nfc" | "usb";
+export type AutoKeyword = "auto";
+export type AutomationRate = "a-rate" | "k-rate";
+export type BinaryType = "arraybuffer" | "blob";
+export type BiquadFilterType = "allpass" | "bandpass" | "highpass" | "highshelf" | "lowpass" | "lowshelf" | "notch" | "peaking";
+export type CanPlayTypeResult = "" | "maybe" | "probably";
+export type CanvasDirection = "inherit" | "ltr" | "rtl";
+export type CanvasFillRule = "evenodd" | "nonzero";
+export type CanvasLineCap = "butt" | "round" | "square";
+export type CanvasLineJoin = "bevel" | "miter" | "round";
+export type CanvasTextAlign = "center" | "end" | "left" | "right" | "start";
+export type CanvasTextBaseline = "alphabetic" | "bottom" | "hanging" | "ideographic" | "middle" | "top";
+export type ChannelCountMode = "clamped-max" | "explicit" | "max";
+export type ChannelInterpretation = "discrete" | "speakers";
+export type ClientTypes = "all" | "sharedworker" | "window" | "worker";
+export type CompositeOperation = "accumulate" | "add" | "replace";
+export type CompositeOperationOrAuto = "accumulate" | "add" | "auto" | "replace";
+export type CredentialMediationRequirement = "optional" | "required" | "silent";
+export type DirectionSetting = "" | "lr" | "rl";
+export type DisplayCaptureSurfaceType = "application" | "browser" | "monitor" | "window";
+export type DistanceModelType = "exponential" | "inverse" | "linear";
+export type DocumentReadyState = "complete" | "interactive" | "loading";
+export type EndOfStreamError = "decode" | "network";
+export type EndingType = "native" | "transparent";
+export type FillMode = "auto" | "backwards" | "both" | "forwards" | "none";
+export type FullscreenNavigationUI = "auto" | "hide" | "show";
+export type GamepadHand = "" | "left" | "right";
+export type GamepadHapticActuatorType = "vibration";
+export type GamepadMappingType = "" | "standard";
+export type IDBCursorDirection = "next" | "nextunique" | "prev" | "prevunique";
+export type IDBRequestReadyState = "done" | "pending";
+export type IDBTransactionMode = "readonly" | "readwrite" | "versionchange";
+export type ImageSmoothingQuality = "high" | "low" | "medium";
+export type IterationCompositeOperation = "accumulate" | "replace";
+export type KeyFormat = "jwk" | "pkcs8" | "raw" | "spki";
+export type KeyType = "private" | "public" | "secret";
+export type KeyUsage = "decrypt" | "deriveBits" | "deriveKey" | "encrypt" | "sign" | "unwrapKey" | "verify" | "wrapKey";
+export type LineAlignSetting = "center" | "end" | "start";
+export type ListeningState = "active" | "disambiguation" | "inactive";
+export type MSCredentialType = "FIDO_2_0";
+export type MSTransportType = "BT" | "Embedded" | "NFC" | "USB";
+export type MSWebViewPermissionState = "allow" | "defer" | "deny" | "unknown";
+export type MSWebViewPermissionType = "geolocation" | "media" | "pointerlock" | "unlimitedIndexedDBQuota" | "webnotifications";
+export type MediaDeviceKind = "audioinput" | "audiooutput" | "videoinput";
+export type MediaKeyMessageType = "individualization-request" | "license-release" | "license-renewal" | "license-request";
+export type MediaKeySessionType = "persistent-license" | "temporary";
+export type MediaKeyStatus = "expired" | "internal-error" | "output-downscaled" | "output-restricted" | "released" | "status-pending" | "usable";
+export type MediaKeysRequirement = "not-allowed" | "optional" | "required";
+export type MediaStreamTrackState = "ended" | "live";
+export type NavigationReason = "down" | "left" | "right" | "up";
+export type NavigationType = "back_forward" | "navigate" | "prerender" | "reload";
+export type NotificationDirection = "auto" | "ltr" | "rtl";
+export type NotificationPermission = "default" | "denied" | "granted";
+export type OffscreenRenderingContextId = "2d" | "bitmaprenderer" | "webgl" | "webgl2";
+export type OrientationLockType = "any" | "landscape" | "landscape-primary" | "landscape-secondary" | "natural" | "portrait" | "portrait-primary" | "portrait-secondary";
+export type OrientationType = "landscape-primary" | "landscape-secondary" | "portrait-primary" | "portrait-secondary";
+export type OscillatorType = "custom" | "sawtooth" | "sine" | "square" | "triangle";
+export type OverSampleType = "2x" | "4x" | "none";
+export type PanningModelType = "HRTF" | "equalpower";
+export type PaymentComplete = "fail" | "success" | "unknown";
+export type PaymentShippingType = "delivery" | "pickup" | "shipping";
+export type PermissionName = "accelerometer" | "ambient-light-sensor" | "background-sync" | "bluetooth" | "camera" | "clipboard" | "device-info" | "geolocation" | "gyroscope" | "magnetometer" | "microphone" | "midi" | "notifications" | "persistent-storage" | "push" | "speaker";
+export type PermissionState = "denied" | "granted" | "prompt";
+export type PlaybackDirection = "alternate" | "alternate-reverse" | "normal" | "reverse";
+export type PositionAlignSetting = "auto" | "center" | "line-left" | "line-right";
+export type PublicKeyCredentialType = "public-key";
+export type PushEncryptionKeyName = "auth" | "p256dh";
+export type PushPermissionState = "denied" | "granted" | "prompt";
+export type RTCBundlePolicy = "balanced" | "max-bundle" | "max-compat";
+export type RTCDataChannelState = "closed" | "closing" | "connecting" | "open";
+export type RTCDegradationPreference = "balanced" | "maintain-framerate" | "maintain-resolution";
+export type RTCDtlsRole = "auto" | "client" | "server";
+export type RTCDtlsTransportState = "closed" | "connected" | "connecting" | "failed" | "new";
+export type RTCDtxStatus = "disabled" | "enabled";
+export type RTCErrorDetailType = "data-channel-failure" | "dtls-failure" | "fingerprint-failure" | "hardware-encoder-error" | "hardware-encoder-not-available" | "idp-bad-script-failure" | "idp-execution-failure" | "idp-load-failure" | "idp-need-login" | "idp-timeout" | "idp-tls-failure" | "idp-token-expired" | "idp-token-invalid" | "sctp-failure" | "sdp-syntax-error";
+export type RTCIceCandidateType = "host" | "prflx" | "relay" | "srflx";
+export type RTCIceComponent = "rtcp" | "rtp";
+export type RTCIceConnectionState = "checking" | "closed" | "completed" | "connected" | "disconnected" | "failed" | "new";
+export type RTCIceCredentialType = "oauth" | "password";
+export type RTCIceGatherPolicy = "all" | "nohost" | "relay";
+export type RTCIceGathererState = "complete" | "gathering" | "new";
+export type RTCIceGatheringState = "complete" | "gathering" | "new";
+export type RTCIceProtocol = "tcp" | "udp";
+export type RTCIceRole = "controlled" | "controlling" | "unknown";
+export type RTCIceTcpCandidateType = "active" | "passive" | "so";
+export type RTCIceTransportPolicy = "all" | "relay";
+export type RTCIceTransportState = "checking" | "closed" | "completed" | "connected" | "disconnected" | "failed" | "new";
+export type RTCPeerConnectionState = "closed" | "connected" | "connecting" | "disconnected" | "failed" | "new";
+export type RTCPriorityType = "high" | "low" | "medium" | "very-low";
+export type RTCRtcpMuxPolicy = "negotiate" | "require";
+export type RTCRtpTransceiverDirection = "inactive" | "recvonly" | "sendonly" | "sendrecv" | "stopped";
+export type RTCSctpTransportState = "closed" | "connected" | "connecting";
+export type RTCSdpType = "answer" | "offer" | "pranswer" | "rollback";
+export type RTCSignalingState = "closed" | "have-local-offer" | "have-local-pranswer" | "have-remote-offer" | "have-remote-pranswer" | "stable";
+export type RTCStatsIceCandidatePairState = "cancelled" | "failed" | "frozen" | "inprogress" | "succeeded" | "waiting";
+export type RTCStatsIceCandidateType = "host" | "peerreflexive" | "relayed" | "serverreflexive";
+export type RTCStatsType = "candidatepair" | "datachannel" | "inboundrtp" | "localcandidate" | "outboundrtp" | "remotecandidate" | "session" | "track" | "transport";
+export type ReadyState = "closed" | "ended" | "open";
+export type ReferrerPolicy = "" | "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url";
+export type RequestCache = "default" | "force-cache" | "no-cache" | "no-store" | "only-if-cached" | "reload";
+export type RequestCredentials = "include" | "omit" | "same-origin";
+export type RequestDestination = "" | "audio" | "audioworklet" | "document" | "embed" | "font" | "image" | "manifest" | "object" | "paintworklet" | "report" | "script" | "sharedworker" | "style" | "track" | "video" | "worker" | "xslt";
+export type RequestMode = "cors" | "navigate" | "no-cors" | "same-origin";
+export type RequestRedirect = "error" | "follow" | "manual";
+export type ResponseType = "basic" | "cors" | "default" | "error" | "opaque" | "opaqueredirect";
+export type ScopedCredentialType = "ScopedCred";
+export type ScrollBehavior = "auto" | "smooth";
+export type ScrollLogicalPosition = "center" | "end" | "nearest" | "start";
+export type ScrollRestoration = "auto" | "manual";
+export type ScrollSetting = "" | "up";
+export type SelectionMode = "end" | "preserve" | "select" | "start";
+export type ServiceWorkerState = "activated" | "activating" | "installed" | "installing" | "parsed" | "redundant";
+export type ServiceWorkerUpdateViaCache = "all" | "imports" | "none";
+export type ShadowRootMode = "closed" | "open";
+export type SpeechSynthesisErrorCode = "audio-busy" | "audio-hardware" | "canceled" | "interrupted" | "invalid-argument" | "language-unavailable" | "network" | "not-allowed" | "synthesis-failed" | "synthesis-unavailable" | "text-too-long" | "voice-unavailable";
+export type SupportedType = "application/xhtml+xml" | "application/xml" | "image/svg+xml" | "text/html" | "text/xml";
+export type TextTrackKind = "captions" | "chapters" | "descriptions" | "metadata" | "subtitles";
+export type TextTrackMode = "disabled" | "hidden" | "showing";
+export type TouchType = "direct" | "stylus";
+export type Transport = "ble" | "nfc" | "usb";
+export type UserVerificationRequirement = "discouraged" | "preferred" | "required";
+export type VRDisplayEventReason = "mounted" | "navigation" | "requested" | "unmounted";
+export type VideoFacingModeEnum = "environment" | "left" | "right" | "user";
+export type VisibilityState = "hidden" | "visible";
+export type WebGLPowerPreference = "default" | "high-performance" | "low-power";
+export type WorkerType = "classic" | "module";
+export type XMLHttpRequestResponseType = "" | "arraybuffer" | "blob" | "document" | "json" | "text";
diff --git a/ddb_main/node_modules/evt/src/lib/util/compose.ts b/ddb_main/node_modules/evt/src/lib/util/compose.ts
new file mode 100644
index 0000000..6619048
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/util/compose.ts
@@ -0,0 +1,199 @@
+import { encapsulateOpState } from "./encapsulateOpState";
+import { invokeOperator } from "./invokeOperator";
+import { id } from "../../tools/typeSafety/id";
+import { assert } from "../../tools/typeSafety/assert";
+import { typeGuard } from "../../tools/typeSafety/typeGuard";
+import * as _1 from "../types/Operator";
+
+function f_o_g<A, B, C, CtxResultOp1 = any, CtxResultOp2 = any>(
+    op1: _1.Operator<A, B, CtxResultOp1>,
+    op2: _1.Operator<B, C, CtxResultOp2>
+): _1.Operator.fλ.Stateless<A, C, CtxResultOp1 | CtxResultOp2> {
+
+    const opAtoB = _1.z_f1.fλ_Stateful_match(op1) ?
+        encapsulateOpState(op1) :
+        id<_1.Operator.Stateless<A, B, CtxResultOp1>>(op1)
+        ;
+
+    const opBtoC = _1.z_f1.fλ_Stateful_match(op2) ?
+        encapsulateOpState(op2) :
+        id<_1.Operator.Stateless<B, C, CtxResultOp2>>(op2)
+        ;
+
+    return id<_1.Operator.fλ.Stateless<A, C, CtxResultOp1 | CtxResultOp2>>(
+        (...[dataA, , isPost]) => {
+
+            const resultB = invokeOperator(
+                opAtoB,
+                dataA,
+                isPost
+            );
+
+            if (_1.z_f1.fλ_Result_NotMatched_match<CtxResultOp1>(resultB)) {
+                //CtxResultOp1 assignable to CtxResultOp1 | CtxResultOp2...
+                assert(typeGuard<_1.Operator.fλ.Result.NotMatched<CtxResultOp1 | CtxResultOp2>>(resultB));
+                return resultB;
+            }
+
+
+            const detachOp1 = !!resultB[1] ? resultB[1] : null;
+
+            //...same...
+            assert(typeGuard<_1.Operator.fλ.Result.Detach<CtxResultOp1 | CtxResultOp2> | null>(detachOp1));
+
+            const [dataB] = resultB;
+
+            const resultC = invokeOperator(
+                opBtoC,
+                dataB,
+                isPost
+            );
+
+            if (_1.Operator.fλ.Result.NotMatched.match<CtxResultOp2>(resultC)) {
+                //...same
+                assert(typeGuard<_1.Operator.fλ.Result.NotMatched<CtxResultOp1 | CtxResultOp2>>(resultC));
+                return detachOp1 !== null ? detachOp1 : resultC;
+            }
+
+            return id<_1.Operator.fλ.Result<C, CtxResultOp1 | CtxResultOp2>>([
+                resultC[0],
+                !!detachOp1 ? detachOp1 : (!!resultC[1] ? resultC[1] : null)
+            ]);
+
+
+
+        }
+    );
+}
+
+export function compose<A, B, C, CtxResultOp1 = any, CtxResultOp2 = any>(
+    op1: _1.Operator.fλ<A, B, CtxResultOp1>,
+    op2: _1.Operator.fλ<B, C, CtxResultOp2>
+): _1.Operator.fλ.Stateless<A, C, CtxResultOp1 | CtxResultOp2>;
+export function compose<A, B, C extends B, CtxResult = any>(
+    op1: _1.Operator.fλ<A, B, CtxResult>,
+    op2: (data: B) => data is C,
+): _1.Operator.fλ.Stateless<A, C, CtxResult>;
+export function compose<A, B, CtxResult = any>(
+    op1: _1.Operator.fλ<A, B, CtxResult>,
+    op2: (data: B) => boolean,
+): _1.Operator.fλ.Stateless<A, B, CtxResult>;
+export function compose<A, B extends A, C, CtxResult = any>(
+    op1: (data: A) => data is B,
+    op2: _1.Operator.fλ<B, C, CtxResult>
+): _1.Operator.fλ.Stateless<A, B, CtxResult>;
+export function compose<A, B, CtxResult = any>(
+    op1: (data: A) => boolean,
+    op2: _1.Operator.fλ<A, B, CtxResult>
+): _1.Operator.fλ.Stateless<A, B, CtxResult>;
+export function compose<A, B extends A, C extends B>(
+    op1: (data: A) => data is B,
+    op2: (data: B) => data is C,
+): _1.Operator.fλ.Stateless<A, C, never>;
+export function compose<A, B extends A>(
+    op1: (data: A) => data is B,
+    op2: (data: B) => boolean,
+): _1.Operator.fλ.Stateless<A, B, never>;
+export function compose<A, B extends A>(
+    op1: (data: A) => boolean,
+    op2: (data: A) => data is B
+): _1.Operator.fλ.Stateless<A, B, never>;
+export function compose<A>(
+    op1: (data: A) => boolean,
+    op2: (data: A) => boolean,
+): _1.Operator.fλ.Stateless<A, A, never>;
+
+
+export function compose<A, B, C, D, CtxResultOp1 = any, CtxResultOp2 = any, CtxResultOp3 = any>(
+    op1: _1.Operator.fλ<A, B, CtxResultOp1>,
+    op2: _1.Operator.fλ<B, C, CtxResultOp2>,
+    op3: _1.Operator.fλ<C, D, CtxResultOp3>
+): _1.Operator.fλ.Stateless<A, D, CtxResultOp1 | CtxResultOp2 | CtxResultOp3>;
+
+export function compose<A, B, C, D, E, CtxResultOp1 = any, CtxResultOp2 = any, CtxResultOp3 = any, CtxResultOp4 = any>(
+    op1: _1.Operator.fλ<A, B, CtxResultOp1>,
+    op2: _1.Operator.fλ<B, C, CtxResultOp2>,
+    op3: _1.Operator.fλ<C, D, CtxResultOp3>,
+    op4: _1.Operator.fλ<D, E, CtxResultOp4>
+): _1.Operator.fλ.Stateless<A, E, CtxResultOp1 | CtxResultOp2 | CtxResultOp3 | CtxResultOp4>;
+
+export function compose<A, B, C, D, E, CtxResultOp1 = any, CtxResultOp2 = any, CtxResultOp3 = any, CtxResultOp4 = any>(
+    op1: _1.Operator.fλ<A, B, CtxResultOp1>,
+    op2: _1.Operator.fλ<B, C, CtxResultOp2>,
+    op3: _1.Operator.fλ<C, D, CtxResultOp3>,
+    op4: _1.Operator.fλ<D, E, CtxResultOp4>
+): _1.Operator.fλ.Stateless<A, E, CtxResultOp1 | CtxResultOp2 | CtxResultOp3 | CtxResultOp4>;
+
+export function compose<A, B, C, D, E, F, CtxResultOp1 = any, CtxResultOp2 = any, CtxResultOp3 = any, CtxResultOp4 = any, CtxResultOp5 = any>(
+    op1: _1.Operator.fλ<A, B, CtxResultOp1>,
+    op2: _1.Operator.fλ<B, C, CtxResultOp2>,
+    op3: _1.Operator.fλ<C, D, CtxResultOp3>,
+    op4: _1.Operator.fλ<D, E, CtxResultOp4>,
+    op5: _1.Operator.fλ<E, F, CtxResultOp5>
+): _1.Operator.fλ.Stateless<A, F, CtxResultOp1 | CtxResultOp2 | CtxResultOp3 | CtxResultOp4 | CtxResultOp5>;
+
+
+export function compose<A, B, C, CtxResultOp1 = any, CtxResultOp2 = any>(
+    op1: _1.Operator<A, B, CtxResultOp1>,
+    op2: _1.Operator<B, C, CtxResultOp2>
+): _1.Operator.fλ.Stateless<A, C, CtxResultOp1 | CtxResultOp2>;
+
+export function compose<A, B, C, D, CtxResultOp1 = any, CtxResultOp2 = any, CtxResultOp3 = any>(
+    op1: _1.Operator<A, B, any>,
+    op2: _1.Operator<B, C, any>,
+    op3: _1.Operator<C, D, any>
+): _1.Operator.fλ.Stateless<A, D, CtxResultOp1 | CtxResultOp2 | CtxResultOp3>;
+
+export function compose<A, B, C, D, E, CtxResultOp1 = any, CtxResultOp2 = any, CtxResultOp3 = any, CtxResultOp4 = any, CtxResultOp5 = any>(
+    op1: _1.Operator<A, B, CtxResultOp1>,
+    op2: _1.Operator<B, C, CtxResultOp2>,
+    op3: _1.Operator<C, D, CtxResultOp3>,
+    op4: _1.Operator<D, E, CtxResultOp4>,
+): _1.Operator.fλ.Stateless<A, E, CtxResultOp1 | CtxResultOp2 | CtxResultOp3 | CtxResultOp4 | CtxResultOp5>;
+
+export function compose<A, B, C, D, E, F, CtxResultOp1 = any, CtxResultOp2 = any, CtxResultOp3 = any, CtxResultOp4 = any, CtxResultOp5 = any>(
+    op1: _1.Operator<A, B, CtxResultOp1>,
+    op2: _1.Operator<B, C, CtxResultOp2>,
+    op3: _1.Operator<C, D, CtxResultOp3>,
+    op4: _1.Operator<D, E, CtxResultOp4>,
+    op5: _1.Operator<E, F, CtxResultOp5>
+): _1.Operator.fλ.Stateless<A, F, CtxResultOp1 | CtxResultOp2 | CtxResultOp3 | CtxResultOp4 | CtxResultOp5>;
+
+
+export function compose<T>(
+    ...ops: [
+        _1.Operator<T, any, any>,
+        ..._1.Operator<any, any, any>[]
+    ]
+): _1.Operator.Stateless<T, any, any>;
+
+export function compose<T>(
+    ...ops: [
+        _1.Operator<T, any, any>,
+        ..._1.Operator<any, any, any>[]
+    ]
+): _1.Operator.Stateless<T, any, any> | _1.Operator.Stateless<T, any, never> {
+
+    if (ops.length === 1) {
+
+        const [op] = ops;
+
+        return _1.z_f1.fλ_Stateful_match<T, any, any>(op) ?
+            encapsulateOpState(op) :
+            op
+            ;
+
+    }
+
+    const [op1, op2, ...rest] = ops;
+
+    const op1_o_op2 = f_o_g(op1, op2);
+
+    if (rest.length === 0) {
+        return op1_o_op2;
+    }
+
+    return compose(op1_o_op2, ...rest);
+
+
+}
diff --git a/ddb_main/node_modules/evt/src/lib/util/encapsulateOpState.ts b/ddb_main/node_modules/evt/src/lib/util/encapsulateOpState.ts
new file mode 100644
index 0000000..6a45d5b
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/util/encapsulateOpState.ts
@@ -0,0 +1,29 @@
+import { id } from "../../tools/typeSafety/id";
+import * as _1 from "../types/Operator";
+
+export function encapsulateOpState<T, U, CtxOperator>(
+    statefulFλOp: _1.Operator.fλ.Stateful<T, U, CtxOperator>
+): _1.Operator.fλ.Stateless<T, U, CtxOperator> {
+
+    let state: U = statefulFλOp[1];
+
+    return id<_1.Operator.fλ.Stateless<T, U, CtxOperator>>(
+        (...[data, , cbInvokedIfMatched]) => {
+
+            const opResult = statefulFλOp[0](data, state, cbInvokedIfMatched);
+
+            if (
+                !!cbInvokedIfMatched &&
+                _1.z_f1.fλ_Result_Matched_match(opResult)
+            ) {
+
+                state = opResult[0];
+
+            }
+
+            return opResult;
+
+        }
+    );
+
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/util/genericOperators/index.ts b/ddb_main/node_modules/evt/src/lib/util/genericOperators/index.ts
new file mode 100644
index 0000000..942fae7
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/util/genericOperators/index.ts
@@ -0,0 +1,3 @@
+export { throttleTime } from "./throttleTime";
+export { to } from "./to";
+export { nonNullable } from "./nonNullable";
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/util/genericOperators/nonNullable.ts b/ddb_main/node_modules/evt/src/lib/util/genericOperators/nonNullable.ts
new file mode 100644
index 0000000..bf6fe02
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/util/genericOperators/nonNullable.ts
@@ -0,0 +1,5 @@
+
+const isNonNullable= <T>(arg: T): arg is NonNullable<T> => arg !== undefined && arg !== null;
+
+export const nonNullable = <T>(data: T): import("../../types").Operator.fλ.Result<NonNullable<T>, never> => 
+    !isNonNullable(data) ? null : [data];
diff --git a/ddb_main/node_modules/evt/src/lib/util/genericOperators/throttleTime.ts b/ddb_main/node_modules/evt/src/lib/util/genericOperators/throttleTime.ts
new file mode 100644
index 0000000..6e9c80c
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/util/genericOperators/throttleTime.ts
@@ -0,0 +1,19 @@
+import { compose } from "../compose";
+
+export const throttleTime = <T>(duration: number) =>
+    compose<T, { data: T; lastClick: number; }, T>(
+        [
+            (data, { lastClick }) => {
+
+                const now = Date.now();
+
+                return now - lastClick < duration ?
+                    null :
+                    [{ data, "lastClick": now }]
+                    ;
+
+            },
+            { "lastClick": 0, "data": null as any }
+        ],
+        ({ data }) => [data]
+    );
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/util/genericOperators/to.ts b/ddb_main/node_modules/evt/src/lib/util/genericOperators/to.ts
new file mode 100644
index 0000000..1f9850d
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/util/genericOperators/to.ts
@@ -0,0 +1,29 @@
+/*
+NOTE: Here we allow a tiny memory leak to be able to emulate
+the EventEmitter.removeListener(event, callback) method easily.
+
+evt.getHandlers()
+    .filter(handler => (
+        handler.callback === callback && 
+        handler.op === to("event1")
+    ))
+    .forEach(handler => handler.detach());
+*/
+const map = new Map<string, ReturnType<typeof to>>();
+
+/** 
+ * Operator that helps emulate an EventEmitter with EVT
+ * See https://stackblitz.com/edit/evt-honvv3?file=index.ts 
+ * or https://docs.evt.land/extending_evt
+ * */
+export const to = <T extends readonly [string, any], K extends T[0]>(
+    eventName: K
+): import("../../types").Operator.fλ.Stateless<T, (Extract<T, readonly [K, any]> extends never ? T : Extract<T, readonly [K, any]>)[1], never> =>
+    map.get(eventName) ?? (
+        map.set(
+            eventName,
+            data => data[0] !== eventName ? null : [data[1]]
+        ),
+        to(eventName)
+    )
+    ;
diff --git a/ddb_main/node_modules/evt/src/lib/util/index.ts b/ddb_main/node_modules/evt/src/lib/util/index.ts
new file mode 100644
index 0000000..adec13d
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/util/index.ts
@@ -0,0 +1,3 @@
+export * from "./genericOperators";
+export { compose } from "./compose";
+export { invokeOperator } from "./invokeOperator";
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/lib/util/invokeOperator.ts b/ddb_main/node_modules/evt/src/lib/util/invokeOperator.ts
new file mode 100644
index 0000000..c265927
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/lib/util/invokeOperator.ts
@@ -0,0 +1,21 @@
+
+import * as _1 from "../types/Operator";
+
+/** 
+ * Invoke any type of stateless operator and return as if it was a fλ.
+ * Intended to be used alongside Evt.prototype.getStatelessOp()
+*/
+export function invokeOperator<T, U, CtxResult>(op: _1.Operator.fλ.Stateless<T, U, CtxResult>, data: T, isPost?: true): _1.Operator.fλ.Result<U, CtxResult>;
+export function invokeOperator<T, U extends T>(op: (data: T) => data is U, data: T): _1.Operator.fλ.Result<U, never>;
+export function invokeOperator<T>(op: (data: T) => boolean, data: T): _1.Operator.fλ.Result<T, never>;
+export function invokeOperator<T, U, CtxResult>(op: _1.Operator.Stateless<T, U, CtxResult>, data: T, isPost?: true): _1.Operator.fλ.Result<U, CtxResult>;
+export function invokeOperator<T>(op: _1.Operator.Stateless<T, any, any>, data: T, isPost?: true): _1.Operator.fλ.Result<any, any> | _1.Operator.fλ.Result<any, never> {
+
+    const result = op(data, undefined, isPost);
+
+    return _1.z_f1.fλ_Result_match(result) ?
+        result :
+        !!result ? [data] : null
+        ;
+
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/tools/Deferred.ts b/ddb_main/node_modules/evt/src/tools/Deferred.ts
new file mode 100644
index 0000000..3363c78
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/Deferred.ts
@@ -0,0 +1,66 @@
+
+import { overwriteReadonlyProp } from "./typeSafety/overwriteReadonlyProp";
+
+export class Deferred<T> {
+
+    public readonly pr: Promise<T>;
+
+    /** NOTE: Does not need to be called bound to instance*/
+    public readonly resolve: (value: T)=> void;
+    public readonly reject: (error: any)=> void;
+
+    constructor() {
+
+        let resolve!: (value: T)=> void;
+        let reject!: (error: any)=> void;
+
+        this.pr = new Promise<T>(
+            (resolve_, reject_) => {
+
+                resolve = value => {
+
+                    overwriteReadonlyProp(this, "isPending", false);
+                    resolve_(value);
+
+                };
+
+                reject = error => {
+
+
+                    overwriteReadonlyProp(this, "isPending", false);
+                    reject_(error);
+
+                };
+
+            }
+        );
+
+        this.resolve = resolve;
+        this.reject = reject;
+
+    }
+
+
+    public readonly isPending: boolean = true;
+
+
+}
+
+export namespace Deferred {
+
+    export type Unpack<T extends Deferred<any>> = T extends Deferred<infer U> ? U : never;
+
+}
+
+export class VoidDeferred extends Deferred<undefined>{
+
+    public readonly resolve!: () => void;
+
+}
+
+
+
+
+
+
+
diff --git a/ddb_main/node_modules/evt/src/tools/safeSetTimeout.ts b/ddb_main/node_modules/evt/src/tools/safeSetTimeout.ts
new file mode 100644
index 0000000..26a690d
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/safeSetTimeout.ts
@@ -0,0 +1,5 @@
+
+//NOTE: Deno can't use NodeJS type def ( obviously )
+export type Timer= { _timerBrand: any; };
+export const safeSetTimeout = (callback: () => void, ms: number): Timer => setTimeout(callback, ms) as any;
+export const safeClearTimeout = (timer: Timer): void => clearTimeout(timer as any);
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/tools/typeSafety/assert.ts b/ddb_main/node_modules/evt/src/tools/typeSafety/assert.ts
new file mode 100644
index 0000000..d399e07
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/typeSafety/assert.ts
@@ -0,0 +1,40 @@
+
+import { overwriteReadonlyProp } from "./overwriteReadonlyProp";
+
+export class AssertionError extends Error {
+
+    constructor(msg: string | undefined) {
+
+        super(`Wrong assertion encountered` + (!msg ? "" : `: "${msg}"`));
+
+        Object.setPrototypeOf(this, new.target.prototype);
+
+        if (!this.stack) {
+            return;
+        }
+
+        try {
+
+            overwriteReadonlyProp(
+                this,
+                "stack",
+                this.stack
+                    .split("\n")
+                    .filter((...[, i]) => i !== 1 && i !== 2)
+                    .join("\n")
+            );
+
+        } catch {
+        }
+
+    }
+
+}
+
+export function assert(condition: any, msg?: string): asserts condition {
+    if (!condition) {
+        throw new AssertionError(msg);
+    }
+}
+
+
diff --git a/ddb_main/node_modules/evt/src/tools/typeSafety/defineAccessors.ts b/ddb_main/node_modules/evt/src/tools/typeSafety/defineAccessors.ts
new file mode 100644
index 0000000..4e1edf9
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/typeSafety/defineAccessors.ts
@@ -0,0 +1,26 @@
+
+export const defineAccessors = <T extends { [key: string]: any; }, K extends keyof T>(
+    obj: T,
+    propertyName: K,
+    propertyDescriptor: {
+        get?: () => T[K];
+        set?: (value: T[K]) => void;
+    }
+): void => {
+
+    const { get, set } = propertyDescriptor;
+
+    Object.defineProperty(
+        obj,
+        propertyName,
+        {
+            ...(Object.getOwnPropertyDescriptor(obj, propertyName) || {  
+                "enumerable": true,
+                "configurable": true
+            }),
+            ...(get !== undefined ? { "get": function() { return get.call(this); } } : {}),
+            ...(set !== undefined ? { "set": function(value: T[K]){ set.call(this, value); } } : {})
+        }
+    );
+
+};
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/tools/typeSafety/exclude.ts b/ddb_main/node_modules/evt/src/tools/typeSafety/exclude.ts
new file mode 100644
index 0000000..8628996
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/typeSafety/exclude.ts
@@ -0,0 +1,25 @@
+
+
+/** Return a function to use as Array.prototype.filter argument
+ * to exclude one or many primitive value element from the array.
+ * Ex: ([ "a", "b" ] as const).filter(exclude("a") return "b"[]
+ */
+export function exclude<T extends string | number | null | undefined | boolean>(target: readonly T[] | T) {
+
+    const test: (element: any) => boolean =
+        target instanceof Object ?
+            (element => target.indexOf(element) < 0) :
+            (element => element !== target)
+        ;
+
+    return function <U>(str: U): str is Exclude<U, T> {
+        return test(str);
+    }
+}
+
+
+
+
+
+
+
diff --git a/ddb_main/node_modules/evt/src/tools/typeSafety/id.ts b/ddb_main/node_modules/evt/src/tools/typeSafety/id.ts
new file mode 100644
index 0000000..3922b94
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/typeSafety/id.ts
@@ -0,0 +1,72 @@
+
+/**
+ * The identity function.
+ * 
+ * Help to build an object of type T.
+ * Better than using 'as T' as there is no type safety loss.
+ * 
+ * - Used as continence for enabling type inference.
+ * Example: 
+ * 
+ * type Circle = {
+ *     type: "CIRCLE";
+ *     radius: number;
+ * };
+ * 
+ * type Square = {
+ *     type: "SQUARE";
+ *     side: number;
+ * };
+ * type Shape= Circle | Square;
+ * 
+ * declare function f(shape: Shape): void;
+ * 
+ * f(id<Circle>({ "type": "CIRCLE", "radius": 33 }); <== We have auto completion to instantiate circle.
+ * 
+ * - Used to loosen the type restriction without saying "trust me" to the compiler.
+ * declare const x: Set<readonly ["FOO"]>;
+ * declare function f(s: Set<string[]>): void;
+ * f(id<Set<any>>(x));
+ * 
+ * Example: 
+ * declare const x: Set<readonly [ "FOO" ]>;
+ * declare f(x: Set<string[]>): void;
+ * id(x as Set<["FOO"]>); <== trust me it's readonly!
+ * f(id<Set<any>>(x)); <== we acknowledge that we are out of the safe zone.
+ */
+export const id = <T>(x: T) => x;
+
+/** 
+ * Ensure that a that a specific type that we are declaring extends a more generic type
+ * 
+ * Use case example 1:
+ * 
+ * type MyObject = {
+ *     p1: string;
+ *     p2: string;
+ *     a: string;
+ *     b: string;
+ * };
+ * 
+ * We want to define a type that consist in an union of 
+ * all the property name that are letters:
+ * 
+ * type AlphabeticalKeys = Id<keyof MyObject, "a" | "b">;
+ * 
+ * Here AlphabeticalKeys is "a" | "b" but it's better than 
+ * simply writing it explicitly as we get autocompletion
+ * and we can't include a property name that does not exist on MyObject.
+ * 
+ * Use case example 2:
+ * 
+ * We want to declare object type that only take string or number
+ * as key value:
+ * 
+ * export type MyObject = Id<Record<string, string | number>, {
+ *     p1: string;
+ *     p2: number;
+ * }>;
+ * 
+ * If later on someone adds "p3": string[] he will get a type error.
+ * */
+export type Id<Generic, Specific extends Generic> = Specific;
diff --git a/ddb_main/node_modules/evt/src/tools/typeSafety/index.ts b/ddb_main/node_modules/evt/src/tools/typeSafety/index.ts
new file mode 100644
index 0000000..b028ca8
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/typeSafety/index.ts
@@ -0,0 +1,18 @@
+export { assert } from "./assert";
+/** Extract the return type of an async function */
+export type AsyncReturnType<T extends (...args: any) => Promise<any>> = import("./AsyncReturnType").AsyncReturnType<T>;
+export { exclude } from "./exclude";
+export { id } from "./id";
+export type Id<Generic, Specific extends Generic> = import("./id").Id<Generic, Specific>;
+export { matchVoid } from "./matchVoid";
+export type MethodNames<Api extends {}> = import("./MethodNames").MethodNames<Api>;
+export { objectKeys } from "./objectKeys";
+export type PromiseOrNot<T> = import("./PromiseOrNot").PromiseOrNot<T>;
+export { typeGuard } from "./typeGuard";
+/**
+ * Usecase: 
+ * declare const pr: Promise<string[]>;
+ * const x: Unpack<typeof pr>; <== x is string[]
+ */
+export type UnpackPromise<T> = import("./UnpackPromise").UnpackPromise<T>;
+export type UnpackTypeGuard<T> = import("./UnpackTypeGuard").UnpackTypeGuard<T>;
diff --git a/ddb_main/node_modules/evt/src/tools/typeSafety/isPromiseLike.ts b/ddb_main/node_modules/evt/src/tools/typeSafety/isPromiseLike.ts
new file mode 100644
index 0000000..67b0b20
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/typeSafety/isPromiseLike.ts
@@ -0,0 +1,4 @@
+
+export function isPromiseLike<T = void>(o: any): o is PromiseLike<T> {
+    return typeof o?.then === "function";
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/tools/typeSafety/matchVoid.ts b/ddb_main/node_modules/evt/src/tools/typeSafety/matchVoid.ts
new file mode 100644
index 0000000..6a017ec
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/typeSafety/matchVoid.ts
@@ -0,0 +1,21 @@
+/**
+ * 
+ * Unlike undefined or null, testing o !== void
+ * will not restrict the type.
+ * 
+ * Example:
+ * 
+ * declare o: { p: string; } | void;
+ * 
+ * matchVoid(o)?null:o.p <== Type inference ok
+ * 
+ * Match void
+ * @param o type of o should be a union of type containing void
+ * @returns true if o is undefined
+ */
+export function matchVoid(o: any): o is void | undefined {
+    return o === undefined;
+}
+
+
+
diff --git a/ddb_main/node_modules/evt/src/tools/typeSafety/objectKeys.ts b/ddb_main/node_modules/evt/src/tools/typeSafety/objectKeys.ts
new file mode 100644
index 0000000..a56ffd7
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/typeSafety/objectKeys.ts
@@ -0,0 +1,5 @@
+
+/** Object.keys() with types */
+export function objectKeys<T extends {}>(o: T): (keyof T)[] {
+    return Object.keys(o) as any;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/evt/src/tools/typeSafety/overwriteReadonlyProp.ts b/ddb_main/node_modules/evt/src/tools/typeSafety/overwriteReadonlyProp.ts
new file mode 100644
index 0000000..ddef0f6
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/typeSafety/overwriteReadonlyProp.ts
@@ -0,0 +1,59 @@
+
+/** 
+ * Assign a value to a property even if the object is freezed or if the property is not writable 
+ * Throw if the assignation fail ( for example if the property is non configurable write: false )
+ * */
+export const overwriteReadonlyProp = <T extends { [key: string]: any; }, K extends keyof T>(
+    obj: T,
+    propertyName: K,
+    value: T[K]
+): T[K] => {
+
+    try {
+
+        obj[propertyName] = value;
+
+    } catch{
+    }
+
+    if (obj[propertyName] === value) {
+        return value;
+    }
+
+    let errorDefineProperty: Error | undefined = undefined;
+
+    const propertyDescriptor: PropertyDescriptor =
+        Object.getOwnPropertyDescriptor(obj, propertyName) || {
+            "enumerable": true,
+            "configurable": true
+        };
+
+    if (!!propertyDescriptor.get) {
+        throw new Error(`Probably a wrong ides to overwrite ${propertyName} getter`);
+    }
+
+
+    try {
+
+        Object.defineProperty(
+            obj,
+            propertyName,
+            {
+                ...propertyDescriptor,
+                value
+            }
+        );
+
+    } catch (error) {
+
+        errorDefineProperty = error;
+
+    }
+
+    if (obj[propertyName] !== value) {
+        throw errorDefineProperty || new Error("Can't assign");
+    }
+
+    return value;
+
+};
diff --git a/ddb_main/node_modules/evt/src/tools/typeSafety/typeGuard.ts b/ddb_main/node_modules/evt/src/tools/typeSafety/typeGuard.ts
new file mode 100644
index 0000000..780c97c
--- /dev/null
+++ b/ddb_main/node_modules/evt/src/tools/typeSafety/typeGuard.ts
@@ -0,0 +1,56 @@
+/**
+ * Use cases: 
+ * 
+ * 1) When we know the subtype of a variable but the compiler is unaware.
+ * 
+ * declare const x: "FOO" | "BAR";
+ * 
+ * 1.1) If we want to tel the compile that we know x is of type "BAR"
+ * 
+ * assert(typeGuard<"BAR">(x));
+ * x; <== x is of type "BAR"
+ * 
+ * 1.2) If we want to tell the compiler that x is NOT of type "BAR"
+ * 
+ * assert(!typeGuard<"BAR">(x,false));
+ * x; <== x is of type "FOO"
+ * 
+ * 2) Tell the compiler what assertion can be made on a given variable
+ * if a given test return true.
+ * 
+ * type Circle = { type: "CIRCLE"; radius: number; };
+ * type Square = { type: "SQUARE"; sideLength: number; };
+ * type Shape = Circle | Square;
+ * 
+ * declare const shape: Shape;
+ * 
+ * if( typeGuard<Circle>(shape, shape.type === "CIRCLE") ){
+ *     [ shape is Circle ]
+ * }else{
+ *     [ shape is not Circle ]
+ * }
+ * 
+ * 
+ * export function matchVoid(o: any): o is void {
+ *     return typeGuard<void>(o, o === undefined || o === null );
+ * }
+ * 
+ * 3) Helper for safely build other type guards
+ * 
+ * export function match<T>(set: Object): set is SetLike<T> {
+ *     return (
+ *         typeGuard<SetLike<T>>(set) &&
+ *         typeof set.values === "function" &&
+ *         /Set/.test(Object.getPrototypeOf(set).constructor.name)
+ *     );
+ * }
+ * 
+ */
+export function typeGuard<T>(o: any, isMatched: boolean = true): o is T {
+    o; //NOTE: Just to avoid unused variable;
+    return isMatched;
+}
+
+
+
+
diff --git a/ddb_main/node_modules/exenv/index.js b/ddb_main/node_modules/exenv/index.js
new file mode 100644
index 0000000..ea2e368
--- /dev/null
+++ b/ddb_main/node_modules/exenv/index.js
@@ -0,0 +1,40 @@
+/*!
+  Copyright (c) 2015 Jed Watson.
+  Based on code that is Copyright 2013-2015, Facebook, Inc.
+  All rights reserved.
+*/
+/* global define */
+
+(function () {
+	'use strict';
+
+	var canUseDOM = !!(
+		typeof window !== 'undefined' &&
+		window.document &&
+		window.document.createElement
+	);
+
+	var ExecutionEnvironment = {
+
+		canUseDOM: canUseDOM,
+
+		canUseWorkers: typeof Worker !== 'undefined',
+
+		canUseEventListeners:
+			canUseDOM && !!(window.addEventListener || window.attachEvent),
+
+		canUseViewport: canUseDOM && !!window.screen
+
+	};
+
+	if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {
+		define(function () {
+			return ExecutionEnvironment;
+		});
+	} else if (typeof module !== 'undefined' && module.exports) {
+		module.exports = ExecutionEnvironment;
+	} else {
+		window.ExecutionEnvironment = ExecutionEnvironment;
+	}
+
+}());
diff --git a/ddb_main/node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js b/ddb_main/node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js
new file mode 100644
index 0000000..60f9c4b
--- /dev/null
+++ b/ddb_main/node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js
@@ -0,0 +1,103 @@
+'use strict';
+
+var reactIs = require('react-is');
+
+/**
+ * Copyright 2015, Yahoo! Inc.
+ * Copyrights licensed under the New BSD License. See the accompanying LICENSE file for terms.
+ */
+var REACT_STATICS = {
+  childContextTypes: true,
+  contextType: true,
+  contextTypes: true,
+  defaultProps: true,
+  displayName: true,
+  getDefaultProps: true,
+  getDerivedStateFromError: true,
+  getDerivedStateFromProps: true,
+  mixins: true,
+  propTypes: true,
+  type: true
+};
+var KNOWN_STATICS = {
+  name: true,
+  length: true,
+  prototype: true,
+  caller: true,
+  callee: true,
+  arguments: true,
+  arity: true
+};
+var FORWARD_REF_STATICS = {
+  '$$typeof': true,
+  render: true,
+  defaultProps: true,
+  displayName: true,
+  propTypes: true
+};
+var MEMO_STATICS = {
+  '$$typeof': true,
+  compare: true,
+  defaultProps: true,
+  displayName: true,
+  propTypes: true,
+  type: true
+};
+var TYPE_STATICS = {};
+TYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS;
+TYPE_STATICS[reactIs.Memo] = MEMO_STATICS;
+
+function getStatics(component) {
+  // React v16.11 and below
+  if (reactIs.isMemo(component)) {
+    return MEMO_STATICS;
+  } // React v16.12 and above
+
+
+  return TYPE_STATICS[component['$$typeof']] || REACT_STATICS;
+}
+
+var defineProperty = Object.defineProperty;
+var getOwnPropertyNames = Object.getOwnPropertyNames;
+var getOwnPropertySymbols = Object.getOwnPropertySymbols;
+var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
+var getPrototypeOf = Object.getPrototypeOf;
+var objectPrototype = Object.prototype;
+function hoistNonReactStatics(targetComponent, sourceComponent, blacklist) {
+  if (typeof sourceComponent !== 'string') {
+    // don't hoist over string (html) components
+    if (objectPrototype) {
+      var inheritedComponent = getPrototypeOf(sourceComponent);
+
+      if (inheritedComponent && inheritedComponent !== objectPrototype) {
+        hoistNonReactStatics(targetComponent, inheritedComponent, blacklist);
+      }
+    }
+
+    var keys = getOwnPropertyNames(sourceComponent);
+
+    if (getOwnPropertySymbols) {
+      keys = keys.concat(getOwnPropertySymbols(sourceComponent));
+    }
+
+    var targetStatics = getStatics(targetComponent);
+    var sourceStatics = getStatics(sourceComponent);
+
+    for (var i = 0; i < keys.length; ++i) {
+      var key = keys[i];
+
+      if (!KNOWN_STATICS[key] && !(blacklist && blacklist[key]) && !(sourceStatics && sourceStatics[key]) && !(targetStatics && targetStatics[key])) {
+        var descriptor = getOwnPropertyDescriptor(sourceComponent, key);
+
+        try {
+          // Avoid failures from read-only properties
+          defineProperty(targetComponent, key, descriptor);
+        } catch (e) {}
+      }
+    }
+  }
+
+  return targetComponent;
+}
+
+module.exports = hoistNonReactStatics;
diff --git a/ddb_main/node_modules/hoist-non-react-statics/node_modules/react-is/cjs/react-is.production.min.js b/ddb_main/node_modules/hoist-non-react-statics/node_modules/react-is/cjs/react-is.production.min.js
new file mode 100644
index 0000000..3e83c7a
--- /dev/null
+++ b/ddb_main/node_modules/hoist-non-react-statics/node_modules/react-is/cjs/react-is.production.min.js
@@ -0,0 +1,15 @@
+/** @license React v16.13.1
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?
+Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
+function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}exports.AsyncMode=l;exports.ConcurrentMode=m;exports.ContextConsumer=k;exports.ContextProvider=h;exports.Element=c;exports.ForwardRef=n;exports.Fragment=e;exports.Lazy=t;exports.Memo=r;exports.Portal=d;
+exports.Profiler=g;exports.StrictMode=f;exports.Suspense=p;exports.isAsyncMode=function(a){return A(a)||z(a)===l};exports.isConcurrentMode=A;exports.isContextConsumer=function(a){return z(a)===k};exports.isContextProvider=function(a){return z(a)===h};exports.isElement=function(a){return"object"===typeof a&&null!==a&&a.$$typeof===c};exports.isForwardRef=function(a){return z(a)===n};exports.isFragment=function(a){return z(a)===e};exports.isLazy=function(a){return z(a)===t};
+exports.isMemo=function(a){return z(a)===r};exports.isPortal=function(a){return z(a)===d};exports.isProfiler=function(a){return z(a)===g};exports.isStrictMode=function(a){return z(a)===f};exports.isSuspense=function(a){return z(a)===p};
+exports.isValidElementType=function(a){return"string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};exports.typeOf=z;
diff --git a/ddb_main/node_modules/hoist-non-react-statics/node_modules/react-is/index.js b/ddb_main/node_modules/hoist-non-react-statics/node_modules/react-is/index.js
new file mode 100644
index 0000000..3ae098d
--- /dev/null
+++ b/ddb_main/node_modules/hoist-non-react-statics/node_modules/react-is/index.js
@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-is.production.min.js');
+} else {
+  module.exports = require('./cjs/react-is.development.js');
+}
diff --git a/ddb_main/node_modules/hyphenate-style-name/index.js b/ddb_main/node_modules/hyphenate-style-name/index.js
new file mode 100644
index 0000000..0ac6a73
--- /dev/null
+++ b/ddb_main/node_modules/hyphenate-style-name/index.js
@@ -0,0 +1,19 @@
+/* eslint-disable no-var, prefer-template */
+var uppercasePattern = /[A-Z]/g
+var msPattern = /^ms-/
+var cache = {}
+
+function toHyphenLower(match) {
+  return '-' + match.toLowerCase()
+}
+
+function hyphenateStyleName(name) {
+  if (cache.hasOwnProperty(name)) {
+    return cache[name]
+  }
+
+  var hName = name.replace(uppercasePattern, toHyphenLower)
+  return (cache[name] = msPattern.test(hName) ? '-' + hName : hName)
+}
+
+export default hyphenateStyleName
diff --git a/ddb_main/node_modules/intersection-observer/intersection-observer.js b/ddb_main/node_modules/intersection-observer/intersection-observer.js
new file mode 100644
index 0000000..871140b
--- /dev/null
+++ b/ddb_main/node_modules/intersection-observer/intersection-observer.js
@@ -0,0 +1,1014 @@
+/**
+ * Copyright 2016 Google Inc. All Rights Reserved.
+ *
+ * Licensed under the W3C SOFTWARE AND DOCUMENT NOTICE AND LICENSE.
+ *
+ *  https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document
+ *
+ */
+(function() {
+'use strict';
+
+// Exit early if we're not running in a browser.
+if (typeof window !== 'object') {
+  return;
+}
+
+// Exit early if all IntersectionObserver and IntersectionObserverEntry
+// features are natively supported.
+if ('IntersectionObserver' in window &&
+    'IntersectionObserverEntry' in window &&
+    'intersectionRatio' in window.IntersectionObserverEntry.prototype) {
+
+  // Minimal polyfill for Edge 15's lack of `isIntersecting`
+  // See: https://github.com/w3c/IntersectionObserver/issues/211
+  if (!('isIntersecting' in window.IntersectionObserverEntry.prototype)) {
+    Object.defineProperty(window.IntersectionObserverEntry.prototype,
+      'isIntersecting', {
+      get: function () {
+        return this.intersectionRatio > 0;
+      }
+    });
+  }
+  return;
+}
+
+/**
+ * Returns the embedding frame element, if any.
+ * @param {!Document} doc
+ * @return {!Element}
+ */
+function getFrameElement(doc) {
+  try {
+    return doc.defaultView && doc.defaultView.frameElement || null;
+  } catch (e) {
+    // Ignore the error.
+    return null;
+  }
+}
+
+/**
+ * A local reference to the root document.
+ */
+var document = (function(startDoc) {
+  var doc = startDoc;
+  var frame = getFrameElement(doc);
+  while (frame) {
+    doc = frame.ownerDocument;
+    frame = getFrameElement(doc);
+  }
+  return doc;
+})(window.document);
+
+/**
+ * An IntersectionObserver registry. This registry exists to hold a strong
+ * reference to IntersectionObserver instances currently observing a target
+ * element. Without this registry, instances without another reference may be
+ * garbage collected.
+ */
+var registry = [];
+
+/**
+ * The signal updater for cross-origin intersection. When not null, it means
+ * that the polyfill is configured to work in a cross-origin mode.
+ * @type {function(DOMRect|ClientRect, DOMRect|ClientRect)}
+ */
+var crossOriginUpdater = null;
+
+/**
+ * The current cross-origin intersection. Only used in the cross-origin mode.
+ * @type {DOMRect|ClientRect}
+ */
+var crossOriginRect = null;
+
+
+/**
+ * Creates the global IntersectionObserverEntry constructor.
+ * https://w3c.github.io/IntersectionObserver/#intersection-observer-entry
+ * @param {Object} entry A dictionary of instance properties.
+ * @constructor
+ */
+function IntersectionObserverEntry(entry) {
+  this.time = entry.time;
+  this.target = entry.target;
+  this.rootBounds = ensureDOMRect(entry.rootBounds);
+  this.boundingClientRect = ensureDOMRect(entry.boundingClientRect);
+  this.intersectionRect = ensureDOMRect(entry.intersectionRect || getEmptyRect());
+  this.isIntersecting = !!entry.intersectionRect;
+
+  // Calculates the intersection ratio.
+  var targetRect = this.boundingClientRect;
+  var targetArea = targetRect.width * targetRect.height;
+  var intersectionRect = this.intersectionRect;
+  var intersectionArea = intersectionRect.width * intersectionRect.height;
+
+  // Sets intersection ratio.
+  if (targetArea) {
+    // Round the intersection ratio to avoid floating point math issues:
+    // https://github.com/w3c/IntersectionObserver/issues/324
+    this.intersectionRatio = Number((intersectionArea / targetArea).toFixed(4));
+  } else {
+    // If area is zero and is intersecting, sets to 1, otherwise to 0
+    this.intersectionRatio = this.isIntersecting ? 1 : 0;
+  }
+}
+
+
+/**
+ * Creates the global IntersectionObserver constructor.
+ * https://w3c.github.io/IntersectionObserver/#intersection-observer-interface
+ * @param {Function} callback The function to be invoked after intersection
+ *     changes have queued. The function is not invoked if the queue has
+ *     been emptied by calling the `takeRecords` method.
+ * @param {Object=} opt_options Optional configuration options.
+ * @constructor
+ */
+function IntersectionObserver(callback, opt_options) {
+
+  var options = opt_options || {};
+
+  if (typeof callback != 'function') {
+    throw new Error('callback must be a function');
+  }
+
+  if (
+    options.root &&
+    options.root.nodeType != 1 &&
+    options.root.nodeType != 9
+  ) {
+    throw new Error('root must be a Document or Element');
+  }
+
+  // Binds and throttles `this._checkForIntersections`.
+  this._checkForIntersections = throttle(
+      this._checkForIntersections.bind(this), this.THROTTLE_TIMEOUT);
+
+  // Private properties.
+  this._callback = callback;
+  this._observationTargets = [];
+  this._queuedEntries = [];
+  this._rootMarginValues = this._parseRootMargin(options.rootMargin);
+
+  // Public properties.
+  this.thresholds = this._initThresholds(options.threshold);
+  this.root = options.root || null;
+  this.rootMargin = this._rootMarginValues.map(function(margin) {
+    return margin.value + margin.unit;
+  }).join(' ');
+
+  /** @private @const {!Array<!Document>} */
+  this._monitoringDocuments = [];
+  /** @private @const {!Array<function()>} */
+  this._monitoringUnsubscribes = [];
+}
+
+
+/**
+ * The minimum interval within which the document will be checked for
+ * intersection changes.
+ */
+IntersectionObserver.prototype.THROTTLE_TIMEOUT = 100;
+
+
+/**
+ * The frequency in which the polyfill polls for intersection changes.
+ * this can be updated on a per instance basis and must be set prior to
+ * calling `observe` on the first target.
+ */
+IntersectionObserver.prototype.POLL_INTERVAL = null;
+
+/**
+ * Use a mutation observer on the root element
+ * to detect intersection changes.
+ */
+IntersectionObserver.prototype.USE_MUTATION_OBSERVER = true;
+
+
+/**
+ * Sets up the polyfill in the cross-origin mode. The result is the
+ * updater function that accepts two arguments: `boundingClientRect` and
+ * `intersectionRect` - just as these fields would be available to the
+ * parent via `IntersectionObserverEntry`. This function should be called
+ * each time the iframe receives intersection information from the parent
+ * window, e.g. via messaging.
+ * @return {function(DOMRect|ClientRect, DOMRect|ClientRect)}
+ */
+IntersectionObserver._setupCrossOriginUpdater = function() {
+  if (!crossOriginUpdater) {
+    /**
+     * @param {DOMRect|ClientRect} boundingClientRect
+     * @param {DOMRect|ClientRect} intersectionRect
+     */
+    crossOriginUpdater = function(boundingClientRect, intersectionRect) {
+      if (!boundingClientRect || !intersectionRect) {
+        crossOriginRect = getEmptyRect();
+      } else {
+        crossOriginRect = convertFromParentRect(boundingClientRect, intersectionRect);
+      }
+      registry.forEach(function(observer) {
+        observer._checkForIntersections();
+      });
+    };
+  }
+  return crossOriginUpdater;
+};
+
+
+/**
+ * Resets the cross-origin mode.
+ */
+IntersectionObserver._resetCrossOriginUpdater = function() {
+  crossOriginUpdater = null;
+  crossOriginRect = null;
+};
+
+
+/**
+ * Starts observing a target element for intersection changes based on
+ * the thresholds values.
+ * @param {Element} target The DOM element to observe.
+ */
+IntersectionObserver.prototype.observe = function(target) {
+  var isTargetAlreadyObserved = this._observationTargets.some(function(item) {
+    return item.element == target;
+  });
+
+  if (isTargetAlreadyObserved) {
+    return;
+  }
+
+  if (!(target && target.nodeType == 1)) {
+    throw new Error('target must be an Element');
+  }
+
+  this._registerInstance();
+  this._observationTargets.push({element: target, entry: null});
+  this._monitorIntersections(target.ownerDocument);
+  this._checkForIntersections();
+};
+
+
+/**
+ * Stops observing a target element for intersection changes.
+ * @param {Element} target The DOM element to observe.
+ */
+IntersectionObserver.prototype.unobserve = function(target) {
+  this._observationTargets =
+      this._observationTargets.filter(function(item) {
+        return item.element != target;
+      });
+  this._unmonitorIntersections(target.ownerDocument);
+  if (this._observationTargets.length == 0) {
+    this._unregisterInstance();
+  }
+};
+
+
+/**
+ * Stops observing all target elements for intersection changes.
+ */
+IntersectionObserver.prototype.disconnect = function() {
+  this._observationTargets = [];
+  this._unmonitorAllIntersections();
+  this._unregisterInstance();
+};
+
+
+/**
+ * Returns any queue entries that have not yet been reported to the
+ * callback and clears the queue. This can be used in conjunction with the
+ * callback to obtain the absolute most up-to-date intersection information.
+ * @return {Array} The currently queued entries.
+ */
+IntersectionObserver.prototype.takeRecords = function() {
+  var records = this._queuedEntries.slice();
+  this._queuedEntries = [];
+  return records;
+};
+
+
+/**
+ * Accepts the threshold value from the user configuration object and
+ * returns a sorted array of unique threshold values. If a value is not
+ * between 0 and 1 and error is thrown.
+ * @private
+ * @param {Array|number=} opt_threshold An optional threshold value or
+ *     a list of threshold values, defaulting to [0].
+ * @return {Array} A sorted list of unique and valid threshold values.
+ */
+IntersectionObserver.prototype._initThresholds = function(opt_threshold) {
+  var threshold = opt_threshold || [0];
+  if (!Array.isArray(threshold)) threshold = [threshold];
+
+  return threshold.sort().filter(function(t, i, a) {
+    if (typeof t != 'number' || isNaN(t) || t < 0 || t > 1) {
+      throw new Error('threshold must be a number between 0 and 1 inclusively');
+    }
+    return t !== a[i - 1];
+  });
+};
+
+
+/**
+ * Accepts the rootMargin value from the user configuration object
+ * and returns an array of the four margin values as an object containing
+ * the value and unit properties. If any of the values are not properly
+ * formatted or use a unit other than px or %, and error is thrown.
+ * @private
+ * @param {string=} opt_rootMargin An optional rootMargin value,
+ *     defaulting to '0px'.
+ * @return {Array<Object>} An array of margin objects with the keys
+ *     value and unit.
+ */
+IntersectionObserver.prototype._parseRootMargin = function(opt_rootMargin) {
+  var marginString = opt_rootMargin || '0px';
+  var margins = marginString.split(/\s+/).map(function(margin) {
+    var parts = /^(-?\d*\.?\d+)(px|%)$/.exec(margin);
+    if (!parts) {
+      throw new Error('rootMargin must be specified in pixels or percent');
+    }
+    return {value: parseFloat(parts[1]), unit: parts[2]};
+  });
+
+  // Handles shorthand.
+  margins[1] = margins[1] || margins[0];
+  margins[2] = margins[2] || margins[0];
+  margins[3] = margins[3] || margins[1];
+
+  return margins;
+};
+
+
+/**
+ * Starts polling for intersection changes if the polling is not already
+ * happening, and if the page's visibility state is visible.
+ * @param {!Document} doc
+ * @private
+ */
+IntersectionObserver.prototype._monitorIntersections = function(doc) {
+  var win = doc.defaultView;
+  if (!win) {
+    // Already destroyed.
+    return;
+  }
+  if (this._monitoringDocuments.indexOf(doc) != -1) {
+    // Already monitoring.
+    return;
+  }
+
+  // Private state for monitoring.
+  var callback = this._checkForIntersections;
+  var monitoringInterval = null;
+  var domObserver = null;
+
+  // If a poll interval is set, use polling instead of listening to
+  // resize and scroll events or DOM mutations.
+  if (this.POLL_INTERVAL) {
+    monitoringInterval = win.setInterval(callback, this.POLL_INTERVAL);
+  } else {
+    addEvent(win, 'resize', callback, true);
+    addEvent(doc, 'scroll', callback, true);
+    if (this.USE_MUTATION_OBSERVER && 'MutationObserver' in win) {
+      domObserver = new win.MutationObserver(callback);
+      domObserver.observe(doc, {
+        attributes: true,
+        childList: true,
+        characterData: true,
+        subtree: true
+      });
+    }
+  }
+
+  this._monitoringDocuments.push(doc);
+  this._monitoringUnsubscribes.push(function() {
+    // Get the window object again. When a friendly iframe is destroyed, it
+    // will be null.
+    var win = doc.defaultView;
+
+    if (win) {
+      if (monitoringInterval) {
+        win.clearInterval(monitoringInterval);
+      }
+      removeEvent(win, 'resize', callback, true);
+    }
+
+    removeEvent(doc, 'scroll', callback, true);
+    if (domObserver) {
+      domObserver.disconnect();
+    }
+  });
+
+  // Also monitor the parent.
+  var rootDoc =
+    (this.root && (this.root.ownerDocument || this.root)) || document;
+  if (doc != rootDoc) {
+    var frame = getFrameElement(doc);
+    if (frame) {
+      this._monitorIntersections(frame.ownerDocument);
+    }
+  }
+};
+
+
+/**
+ * Stops polling for intersection changes.
+ * @param {!Document} doc
+ * @private
+ */
+IntersectionObserver.prototype._unmonitorIntersections = function(doc) {
+  var index = this._monitoringDocuments.indexOf(doc);
+  if (index == -1) {
+    return;
+  }
+
+  var rootDoc =
+    (this.root && (this.root.ownerDocument || this.root)) || document;
+
+  // Check if any dependent targets are still remaining.
+  var hasDependentTargets =
+      this._observationTargets.some(function(item) {
+        var itemDoc = item.element.ownerDocument;
+        // Target is in this context.
+        if (itemDoc == doc) {
+          return true;
+        }
+        // Target is nested in this context.
+        while (itemDoc && itemDoc != rootDoc) {
+          var frame = getFrameElement(itemDoc);
+          itemDoc = frame && frame.ownerDocument;
+          if (itemDoc == doc) {
+            return true;
+          }
+        }
+        return false;
+      });
+  if (hasDependentTargets) {
+    return;
+  }
+
+  // Unsubscribe.
+  var unsubscribe = this._monitoringUnsubscribes[index];
+  this._monitoringDocuments.splice(index, 1);
+  this._monitoringUnsubscribes.splice(index, 1);
+  unsubscribe();
+
+  // Also unmonitor the parent.
+  if (doc != rootDoc) {
+    var frame = getFrameElement(doc);
+    if (frame) {
+      this._unmonitorIntersections(frame.ownerDocument);
+    }
+  }
+};
+
+
+/**
+ * Stops polling for intersection changes.
+ * @param {!Document} doc
+ * @private
+ */
+IntersectionObserver.prototype._unmonitorAllIntersections = function() {
+  var unsubscribes = this._monitoringUnsubscribes.slice(0);
+  this._monitoringDocuments.length = 0;
+  this._monitoringUnsubscribes.length = 0;
+  for (var i = 0; i < unsubscribes.length; i++) {
+    unsubscribes[i]();
+  }
+};
+
+
+/**
+ * Scans each observation target for intersection changes and adds them
+ * to the internal entries queue. If new entries are found, it
+ * schedules the callback to be invoked.
+ * @private
+ */
+IntersectionObserver.prototype._checkForIntersections = function() {
+  if (!this.root && crossOriginUpdater && !crossOriginRect) {
+    // Cross origin monitoring, but no initial data available yet.
+    return;
+  }
+
+  var rootIsInDom = this._rootIsInDom();
+  var rootRect = rootIsInDom ? this._getRootRect() : getEmptyRect();
+
+  this._observationTargets.forEach(function(item) {
+    var target = item.element;
+    var targetRect = getBoundingClientRect(target);
+    var rootContainsTarget = this._rootContainsTarget(target);
+    var oldEntry = item.entry;
+    var intersectionRect = rootIsInDom && rootContainsTarget &&
+        this._computeTargetAndRootIntersection(target, targetRect, rootRect);
+
+    var rootBounds = null;
+    if (!this._rootContainsTarget(target)) {
+      rootBounds = getEmptyRect();
+    } else if (!crossOriginUpdater || this.root) {
+      rootBounds = rootRect;
+    }
+
+    var newEntry = item.entry = new IntersectionObserverEntry({
+      time: now(),
+      target: target,
+      boundingClientRect: targetRect,
+      rootBounds: rootBounds,
+      intersectionRect: intersectionRect
+    });
+
+    if (!oldEntry) {
+      this._queuedEntries.push(newEntry);
+    } else if (rootIsInDom && rootContainsTarget) {
+      // If the new entry intersection ratio has crossed any of the
+      // thresholds, add a new entry.
+      if (this._hasCrossedThreshold(oldEntry, newEntry)) {
+        this._queuedEntries.push(newEntry);
+      }
+    } else {
+      // If the root is not in the DOM or target is not contained within
+      // root but the previous entry for this target had an intersection,
+      // add a new record indicating removal.
+      if (oldEntry && oldEntry.isIntersecting) {
+        this._queuedEntries.push(newEntry);
+      }
+    }
+  }, this);
+
+  if (this._queuedEntries.length) {
+    this._callback(this.takeRecords(), this);
+  }
+};
+
+
+/**
+ * Accepts a target and root rect computes the intersection between then
+ * following the algorithm in the spec.
+ * TODO(philipwalton): at this time clip-path is not considered.
+ * https://w3c.github.io/IntersectionObserver/#calculate-intersection-rect-algo
+ * @param {Element} target The target DOM element
+ * @param {Object} targetRect The bounding rect of the target.
+ * @param {Object} rootRect The bounding rect of the root after being
+ *     expanded by the rootMargin value.
+ * @return {?Object} The final intersection rect object or undefined if no
+ *     intersection is found.
+ * @private
+ */
+IntersectionObserver.prototype._computeTargetAndRootIntersection =
+    function(target, targetRect, rootRect) {
+  // If the element isn't displayed, an intersection can't happen.
+  if (window.getComputedStyle(target).display == 'none') return;
+
+  var intersectionRect = targetRect;
+  var parent = getParentNode(target);
+  var atRoot = false;
+
+  while (!atRoot && parent) {
+    var parentRect = null;
+    var parentComputedStyle = parent.nodeType == 1 ?
+        window.getComputedStyle(parent) : {};
+
+    // If the parent isn't displayed, an intersection can't happen.
+    if (parentComputedStyle.display == 'none') return null;
+
+    if (parent == this.root || parent.nodeType == /* DOCUMENT */ 9) {
+      atRoot = true;
+      if (parent == this.root || parent == document) {
+        if (crossOriginUpdater && !this.root) {
+          if (!crossOriginRect ||
+              crossOriginRect.width == 0 && crossOriginRect.height == 0) {
+            // A 0-size cross-origin intersection means no-intersection.
+            parent = null;
+            parentRect = null;
+            intersectionRect = null;
+          } else {
+            parentRect = crossOriginRect;
+          }
+        } else {
+          parentRect = rootRect;
+        }
+      } else {
+        // Check if there's a frame that can be navigated to.
+        var frame = getParentNode(parent);
+        var frameRect = frame && getBoundingClientRect(frame);
+        var frameIntersect =
+            frame &&
+            this._computeTargetAndRootIntersection(frame, frameRect, rootRect);
+        if (frameRect && frameIntersect) {
+          parent = frame;
+          parentRect = convertFromParentRect(frameRect, frameIntersect);
+        } else {
+          parent = null;
+          intersectionRect = null;
+        }
+      }
+    } else {
+      // If the element has a non-visible overflow, and it's not the <body>
+      // or <html> element, update the intersection rect.
+      // Note: <body> and <html> cannot be clipped to a rect that's not also
+      // the document rect, so no need to compute a new intersection.
+      var doc = parent.ownerDocument;
+      if (parent != doc.body &&
+          parent != doc.documentElement &&
+          parentComputedStyle.overflow != 'visible') {
+        parentRect = getBoundingClientRect(parent);
+      }
+    }
+
+    // If either of the above conditionals set a new parentRect,
+    // calculate new intersection data.
+    if (parentRect) {
+      intersectionRect = computeRectIntersection(parentRect, intersectionRect);
+    }
+    if (!intersectionRect) break;
+    parent = parent && getParentNode(parent);
+  }
+  return intersectionRect;
+};
+
+
+/**
+ * Returns the root rect after being expanded by the rootMargin value.
+ * @return {ClientRect} The expanded root rect.
+ * @private
+ */
+IntersectionObserver.prototype._getRootRect = function() {
+  var rootRect;
+  if (this.root && !isDoc(this.root)) {
+    rootRect = getBoundingClientRect(this.root);
+  } else {
+    // Use <html>/<body> instead of window since scroll bars affect size.
+    var doc = isDoc(this.root) ? this.root : document;
+    var html = doc.documentElement;
+    var body = doc.body;
+    rootRect = {
+      top: 0,
+      left: 0,
+      right: html.clientWidth || body.clientWidth,
+      width: html.clientWidth || body.clientWidth,
+      bottom: html.clientHeight || body.clientHeight,
+      height: html.clientHeight || body.clientHeight
+    };
+  }
+  return this._expandRectByRootMargin(rootRect);
+};
+
+
+/**
+ * Accepts a rect and expands it by the rootMargin value.
+ * @param {DOMRect|ClientRect} rect The rect object to expand.
+ * @return {ClientRect} The expanded rect.
+ * @private
+ */
+IntersectionObserver.prototype._expandRectByRootMargin = function(rect) {
+  var margins = this._rootMarginValues.map(function(margin, i) {
+    return margin.unit == 'px' ? margin.value :
+        margin.value * (i % 2 ? rect.width : rect.height) / 100;
+  });
+  var newRect = {
+    top: rect.top - margins[0],
+    right: rect.right + margins[1],
+    bottom: rect.bottom + margins[2],
+    left: rect.left - margins[3]
+  };
+  newRect.width = newRect.right - newRect.left;
+  newRect.height = newRect.bottom - newRect.top;
+
+  return newRect;
+};
+
+
+/**
+ * Accepts an old and new entry and returns true if at least one of the
+ * threshold values has been crossed.
+ * @param {?IntersectionObserverEntry} oldEntry The previous entry for a
+ *    particular target element or null if no previous entry exists.
+ * @param {IntersectionObserverEntry} newEntry The current entry for a
+ *    particular target element.
+ * @return {boolean} Returns true if a any threshold has been crossed.
+ * @private
+ */
+IntersectionObserver.prototype._hasCrossedThreshold =
+    function(oldEntry, newEntry) {
+
+  // To make comparing easier, an entry that has a ratio of 0
+  // but does not actually intersect is given a value of -1
+  var oldRatio = oldEntry && oldEntry.isIntersecting ?
+      oldEntry.intersectionRatio || 0 : -1;
+  var newRatio = newEntry.isIntersecting ?
+      newEntry.intersectionRatio || 0 : -1;
+
+  // Ignore unchanged ratios
+  if (oldRatio === newRatio) return;
+
+  for (var i = 0; i < this.thresholds.length; i++) {
+    var threshold = this.thresholds[i];
+
+    // Return true if an entry matches a threshold or if the new ratio
+    // and the old ratio are on the opposite sides of a threshold.
+    if (threshold == oldRatio || threshold == newRatio ||
+        threshold < oldRatio !== threshold < newRatio) {
+      return true;
+    }
+  }
+};
+
+
+/**
+ * Returns whether or not the root element is an element and is in the DOM.
+ * @return {boolean} True if the root element is an element and is in the DOM.
+ * @private
+ */
+IntersectionObserver.prototype._rootIsInDom = function() {
+  return !this.root || containsDeep(document, this.root);
+};
+
+
+/**
+ * Returns whether or not the target element is a child of root.
+ * @param {Element} target The target element to check.
+ * @return {boolean} True if the target element is a child of root.
+ * @private
+ */
+IntersectionObserver.prototype._rootContainsTarget = function(target) {
+  var rootDoc =
+    (this.root && (this.root.ownerDocument || this.root)) || document;
+  return (
+    containsDeep(rootDoc, target) &&
+    (!this.root || rootDoc == target.ownerDocument)
+  );
+};
+
+
+/**
+ * Adds the instance to the global IntersectionObserver registry if it isn't
+ * already present.
+ * @private
+ */
+IntersectionObserver.prototype._registerInstance = function() {
+  if (registry.indexOf(this) < 0) {
+    registry.push(this);
+  }
+};
+
+
+/**
+ * Removes the instance from the global IntersectionObserver registry.
+ * @private
+ */
+IntersectionObserver.prototype._unregisterInstance = function() {
+  var index = registry.indexOf(this);
+  if (index != -1) registry.splice(index, 1);
+};
+
+
+/**
+ * Returns the result of the performance.now() method or null in browsers
+ * that don't support the API.
+ * @return {number} The elapsed time since the page was requested.
+ */
+function now() {
+  return window.performance && performance.now && performance.now();
+}
+
+
+/**
+ * Throttles a function and delays its execution, so it's only called at most
+ * once within a given time period.
+ * @param {Function} fn The function to throttle.
+ * @param {number} timeout The amount of time that must pass before the
+ *     function can be called again.
+ * @return {Function} The throttled function.
+ */
+function throttle(fn, timeout) {
+  var timer = null;
+  return function () {
+    if (!timer) {
+      timer = setTimeout(function() {
+        fn();
+        timer = null;
+      }, timeout);
+    }
+  };
+}
+
+
+/**
+ * Adds an event handler to a DOM node ensuring cross-browser compatibility.
+ * @param {Node} node The DOM node to add the event handler to.
+ * @param {string} event The event name.
+ * @param {Function} fn The event handler to add.
+ * @param {boolean} opt_useCapture Optionally adds the even to the capture
+ *     phase. Note: this only works in modern browsers.
+ */
+function addEvent(node, event, fn, opt_useCapture) {
+  if (typeof node.addEventListener == 'function') {
+    node.addEventListener(event, fn, opt_useCapture || false);
+  }
+  else if (typeof node.attachEvent == 'function') {
+    node.attachEvent('on' + event, fn);
+  }
+}
+
+
+/**
+ * Removes a previously added event handler from a DOM node.
+ * @param {Node} node The DOM node to remove the event handler from.
+ * @param {string} event The event name.
+ * @param {Function} fn The event handler to remove.
+ * @param {boolean} opt_useCapture If the event handler was added with this
+ *     flag set to true, it should be set to true here in order to remove it.
+ */
+function removeEvent(node, event, fn, opt_useCapture) {
+  if (typeof node.removeEventListener == 'function') {
+    node.removeEventListener(event, fn, opt_useCapture || false);
+  }
+  else if (typeof node.detatchEvent == 'function') {
+    node.detatchEvent('on' + event, fn);
+  }
+}
+
+
+/**
+ * Returns the intersection between two rect objects.
+ * @param {Object} rect1 The first rect.
+ * @param {Object} rect2 The second rect.
+ * @return {?Object|?ClientRect} The intersection rect or undefined if no
+ *     intersection is found.
+ */
+function computeRectIntersection(rect1, rect2) {
+  var top = Math.max(rect1.top, rect2.top);
+  var bottom = Math.min(rect1.bottom, rect2.bottom);
+  var left = Math.max(rect1.left, rect2.left);
+  var right = Math.min(rect1.right, rect2.right);
+  var width = right - left;
+  var height = bottom - top;
+
+  return (width >= 0 && height >= 0) && {
+    top: top,
+    bottom: bottom,
+    left: left,
+    right: right,
+    width: width,
+    height: height
+  } || null;
+}
+
+
+/**
+ * Shims the native getBoundingClientRect for compatibility with older IE.
+ * @param {Element} el The element whose bounding rect to get.
+ * @return {DOMRect|ClientRect} The (possibly shimmed) rect of the element.
+ */
+function getBoundingClientRect(el) {
+  var rect;
+
+  try {
+    rect = el.getBoundingClientRect();
+  } catch (err) {
+    // Ignore Windows 7 IE11 "Unspecified error"
+    // https://github.com/w3c/IntersectionObserver/pull/205
+  }
+
+  if (!rect) return getEmptyRect();
+
+  // Older IE
+  if (!(rect.width && rect.height)) {
+    rect = {
+      top: rect.top,
+      right: rect.right,
+      bottom: rect.bottom,
+      left: rect.left,
+      width: rect.right - rect.left,
+      height: rect.bottom - rect.top
+    };
+  }
+  return rect;
+}
+
+
+/**
+ * Returns an empty rect object. An empty rect is returned when an element
+ * is not in the DOM.
+ * @return {ClientRect} The empty rect.
+ */
+function getEmptyRect() {
+  return {
+    top: 0,
+    bottom: 0,
+    left: 0,
+    right: 0,
+    width: 0,
+    height: 0
+  };
+}
+
+
+/**
+ * Ensure that the result has all of the necessary fields of the DOMRect.
+ * Specifically this ensures that `x` and `y` fields are set.
+ *
+ * @param {?DOMRect|?ClientRect} rect
+ * @return {?DOMRect}
+ */
+function ensureDOMRect(rect) {
+  // A `DOMRect` object has `x` and `y` fields.
+  if (!rect || 'x' in rect) {
+    return rect;
+  }
+  // A IE's `ClientRect` type does not have `x` and `y`. The same is the case
+  // for internally calculated Rect objects. For the purposes of
+  // `IntersectionObserver`, it's sufficient to simply mirror `left` and `top`
+  // for these fields.
+  return {
+    top: rect.top,
+    y: rect.top,
+    bottom: rect.bottom,
+    left: rect.left,
+    x: rect.left,
+    right: rect.right,
+    width: rect.width,
+    height: rect.height
+  };
+}
+
+
+/**
+ * Inverts the intersection and bounding rect from the parent (frame) BCR to
+ * the local BCR space.
+ * @param {DOMRect|ClientRect} parentBoundingRect The parent's bound client rect.
+ * @param {DOMRect|ClientRect} parentIntersectionRect The parent's own intersection rect.
+ * @return {ClientRect} The local root bounding rect for the parent's children.
+ */
+function convertFromParentRect(parentBoundingRect, parentIntersectionRect) {
+  var top = parentIntersectionRect.top - parentBoundingRect.top;
+  var left = parentIntersectionRect.left - parentBoundingRect.left;
+  return {
+    top: top,
+    left: left,
+    height: parentIntersectionRect.height,
+    width: parentIntersectionRect.width,
+    bottom: top + parentIntersectionRect.height,
+    right: left + parentIntersectionRect.width
+  };
+}
+
+
+/**
+ * Checks to see if a parent element contains a child element (including inside
+ * shadow DOM).
+ * @param {Node} parent The parent element.
+ * @param {Node} child The child element.
+ * @return {boolean} True if the parent node contains the child node.
+ */
+function containsDeep(parent, child) {
+  var node = child;
+  while (node) {
+    if (node == parent) return true;
+
+    node = getParentNode(node);
+  }
+  return false;
+}
+
+
+/**
+ * Gets the parent node of an element or its host element if the parent node
+ * is a shadow root.
+ * @param {Node} node The node whose parent to get.
+ * @return {Node|null} The parent node or null if no parent exists.
+ */
+function getParentNode(node) {
+  var parent = node.parentNode;
+
+  if (node.nodeType == /* DOCUMENT */ 9 && node != document) {
+    // If this node is a document node, look for the embedding frame.
+    return getFrameElement(node);
+  }
+
+  // If the parent has element that is assigned through shadow root slot
+  if (parent && parent.assignedSlot) {
+    parent = parent.assignedSlot.parentNode
+  }
+
+  if (parent && parent.nodeType == 11 && parent.host) {
+    // If the parent is a shadow root, return the host element.
+    return parent.host;
+  }
+
+  return parent;
+}
+
+/**
+ * Returns true if `node` is a Document.
+ * @param {!Node} node
+ * @returns {boolean}
+ */
+function isDoc(node) {
+  return node && node.nodeType === 9;
+}
+
+
+// Exposes the constructors globally.
+window.IntersectionObserver = IntersectionObserver;
+window.IntersectionObserverEntry = IntersectionObserverEntry;
+
+}());
diff --git a/ddb_main/node_modules/invariant/browser.js b/ddb_main/node_modules/invariant/browser.js
new file mode 100644
index 0000000..b3941bc
--- /dev/null
+++ b/ddb_main/node_modules/invariant/browser.js
@@ -0,0 +1,49 @@
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+/**
+ * Use invariant() to assert state which your program assumes to be true.
+ *
+ * Provide sprintf-style format (only %s is supported) and arguments
+ * to provide information about what broke and what you were
+ * expecting.
+ *
+ * The invariant message will be stripped in production, but the invariant
+ * will remain to ensure logic does not differ in production.
+ */
+
+var invariant = function(condition, format, a, b, c, d, e, f) {
+  if (process.env.NODE_ENV !== 'production') {
+    if (format === undefined) {
+      throw new Error('invariant requires an error message argument');
+    }
+  }
+
+  if (!condition) {
+    var error;
+    if (format === undefined) {
+      error = new Error(
+        'Minified exception occurred; use the non-minified dev environment ' +
+        'for the full error message and additional helpful warnings.'
+      );
+    } else {
+      var args = [a, b, c, d, e, f];
+      var argIndex = 0;
+      error = new Error(
+        format.replace(/%s/g, function() { return args[argIndex++]; })
+      );
+      error.name = 'Invariant Violation';
+    }
+
+    error.framesToPop = 1; // we don't care about invariant's own frame
+    throw error;
+  }
+};
+
+module.exports = invariant;
diff --git a/ddb_main/node_modules/is-in-browser/dist/module.js b/ddb_main/node_modules/is-in-browser/dist/module.js
new file mode 100644
index 0000000..58cf71c
--- /dev/null
+++ b/ddb_main/node_modules/is-in-browser/dist/module.js
@@ -0,0 +1,5 @@
+var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
+
+export var isBrowser = (typeof window === "undefined" ? "undefined" : _typeof(window)) === "object" && (typeof document === "undefined" ? "undefined" : _typeof(document)) === 'object' && document.nodeType === 9;
+
+export default isBrowser;
diff --git a/ddb_main/node_modules/jss-plugin-camel-case/dist/jss-plugin-camel-case.esm.js b/ddb_main/node_modules/jss-plugin-camel-case/dist/jss-plugin-camel-case.esm.js
new file mode 100644
index 0000000..4bbc181
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-camel-case/dist/jss-plugin-camel-case.esm.js
@@ -0,0 +1,59 @@
+import hyphenate from 'hyphenate-style-name';
+
+/**
+ * Convert camel cased property names to dash separated.
+ */
+
+function convertCase(style) {
+  var converted = {};
+
+  for (var prop in style) {
+    var key = prop.indexOf('--') === 0 ? prop : hyphenate(prop);
+    converted[key] = style[prop];
+  }
+
+  if (style.fallbacks) {
+    if (Array.isArray(style.fallbacks)) converted.fallbacks = style.fallbacks.map(convertCase);else converted.fallbacks = convertCase(style.fallbacks);
+  }
+
+  return converted;
+}
+/**
+ * Allow camel cased property names by converting them back to dasherized.
+ */
+
+
+function camelCase() {
+  function onProcessStyle(style) {
+    if (Array.isArray(style)) {
+      // Handle rules like @font-face, which can have multiple styles in an array
+      for (var index = 0; index < style.length; index++) {
+        style[index] = convertCase(style[index]);
+      }
+
+      return style;
+    }
+
+    return convertCase(style);
+  }
+
+  function onChangeValue(value, prop, rule) {
+    if (prop.indexOf('--') === 0) {
+      return value;
+    }
+
+    var hyphenatedProp = hyphenate(prop); // There was no camel case in place
+
+    if (prop === hyphenatedProp) return value;
+    rule.prop(hyphenatedProp, value); // Core will ignore that property value we set the proper one above.
+
+    return null;
+  }
+
+  return {
+    onProcessStyle: onProcessStyle,
+    onChangeValue: onChangeValue
+  };
+}
+
+export default camelCase;
diff --git a/ddb_main/node_modules/jss-plugin-compose/dist/jss-plugin-compose.esm.js b/ddb_main/node_modules/jss-plugin-compose/dist/jss-plugin-compose.esm.js
new file mode 100644
index 0000000..afe45e3
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-compose/dist/jss-plugin-compose.esm.js
@@ -0,0 +1,70 @@
+import warning from 'tiny-warning';
+
+/**
+ * Set selector.
+ *
+ * @param original rule
+ * @param className class string
+ * @return flag indicating function was successfull or not
+ */
+
+function registerClass(rule, className) {
+  // Skip falsy values
+  if (!className) return true; // Support array of class names `{composes: ['foo', 'bar']}`
+
+  if (Array.isArray(className)) {
+    for (var index = 0; index < className.length; index++) {
+      var isSetted = registerClass(rule, className[index]);
+      if (!isSetted) return false;
+    }
+
+    return true;
+  } // Support space separated class names `{composes: 'foo bar'}`
+
+
+  if (className.indexOf(' ') > -1) {
+    return registerClass(rule, className.split(' '));
+  }
+
+  var parent = rule.options.parent; // It is a ref to a local rule.
+
+  if (className[0] === '$') {
+    var refRule = parent.getRule(className.substr(1));
+
+    if (!refRule) {
+      process.env.NODE_ENV !== "production" ? warning(false, "[JSS] Referenced rule is not defined. \n" + rule.toString()) : void 0;
+      return false;
+    }
+
+    if (refRule === rule) {
+      process.env.NODE_ENV !== "production" ? warning(false, "[JSS] Cyclic composition detected. \n" + rule.toString()) : void 0;
+      return false;
+    }
+
+    parent.classes[rule.key] += " " + parent.classes[refRule.key];
+    return true;
+  }
+
+  parent.classes[rule.key] += " " + className;
+  return true;
+}
+/**
+ * Convert compose property to additional class, remove property from original styles.
+ */
+
+
+function jssCompose() {
+  function onProcessStyle(style, rule) {
+    if (!('composes' in style)) return style;
+    registerClass(rule, style.composes); // Remove composes property to prevent infinite loop.
+
+    delete style.composes;
+    return style;
+  }
+
+  return {
+    onProcessStyle: onProcessStyle
+  };
+}
+
+export default jssCompose;
diff --git a/ddb_main/node_modules/jss-plugin-default-unit/dist/jss-plugin-default-unit.esm.js b/ddb_main/node_modules/jss-plugin-default-unit/dist/jss-plugin-default-unit.esm.js
new file mode 100644
index 0000000..45e1eff
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-default-unit/dist/jss-plugin-default-unit.esm.js
@@ -0,0 +1,251 @@
+import { hasCSSTOMSupport } from 'jss';
+
+var px = hasCSSTOMSupport && CSS ? CSS.px : 'px';
+var ms = hasCSSTOMSupport && CSS ? CSS.ms : 'ms';
+var percent = hasCSSTOMSupport && CSS ? CSS.percent : '%';
+/**
+ * Generated jss-plugin-default-unit CSS property units
+ */
+
+var defaultUnits = {
+  // Animation properties
+  'animation-delay': ms,
+  'animation-duration': ms,
+  // Background properties
+  'background-position': px,
+  'background-position-x': px,
+  'background-position-y': px,
+  'background-size': px,
+  // Border Properties
+  border: px,
+  'border-bottom': px,
+  'border-bottom-left-radius': px,
+  'border-bottom-right-radius': px,
+  'border-bottom-width': px,
+  'border-left': px,
+  'border-left-width': px,
+  'border-radius': px,
+  'border-right': px,
+  'border-right-width': px,
+  'border-top': px,
+  'border-top-left-radius': px,
+  'border-top-right-radius': px,
+  'border-top-width': px,
+  'border-width': px,
+  'border-block': px,
+  'border-block-end': px,
+  'border-block-end-width': px,
+  'border-block-start': px,
+  'border-block-start-width': px,
+  'border-block-width': px,
+  'border-inline': px,
+  'border-inline-end': px,
+  'border-inline-end-width': px,
+  'border-inline-start': px,
+  'border-inline-start-width': px,
+  'border-inline-width': px,
+  'border-start-start-radius': px,
+  'border-start-end-radius': px,
+  'border-end-start-radius': px,
+  'border-end-end-radius': px,
+  // Margin properties
+  margin: px,
+  'margin-bottom': px,
+  'margin-left': px,
+  'margin-right': px,
+  'margin-top': px,
+  'margin-block': px,
+  'margin-block-end': px,
+  'margin-block-start': px,
+  'margin-inline': px,
+  'margin-inline-end': px,
+  'margin-inline-start': px,
+  // Padding properties
+  padding: px,
+  'padding-bottom': px,
+  'padding-left': px,
+  'padding-right': px,
+  'padding-top': px,
+  'padding-block': px,
+  'padding-block-end': px,
+  'padding-block-start': px,
+  'padding-inline': px,
+  'padding-inline-end': px,
+  'padding-inline-start': px,
+  // Mask properties
+  'mask-position-x': px,
+  'mask-position-y': px,
+  'mask-size': px,
+  // Width and height properties
+  height: px,
+  width: px,
+  'min-height': px,
+  'max-height': px,
+  'min-width': px,
+  'max-width': px,
+  // Position properties
+  bottom: px,
+  left: px,
+  top: px,
+  right: px,
+  inset: px,
+  'inset-block': px,
+  'inset-block-end': px,
+  'inset-block-start': px,
+  'inset-inline': px,
+  'inset-inline-end': px,
+  'inset-inline-start': px,
+  // Shadow properties
+  'box-shadow': px,
+  'text-shadow': px,
+  // Column properties
+  'column-gap': px,
+  'column-rule': px,
+  'column-rule-width': px,
+  'column-width': px,
+  // Font and text properties
+  'font-size': px,
+  'font-size-delta': px,
+  'letter-spacing': px,
+  'text-decoration-thickness': px,
+  'text-indent': px,
+  'text-stroke': px,
+  'text-stroke-width': px,
+  'word-spacing': px,
+  // Motion properties
+  motion: px,
+  'motion-offset': px,
+  // Outline properties
+  outline: px,
+  'outline-offset': px,
+  'outline-width': px,
+  // Perspective properties
+  perspective: px,
+  'perspective-origin-x': percent,
+  'perspective-origin-y': percent,
+  // Transform properties
+  'transform-origin': percent,
+  'transform-origin-x': percent,
+  'transform-origin-y': percent,
+  'transform-origin-z': percent,
+  // Transition properties
+  'transition-delay': ms,
+  'transition-duration': ms,
+  // Alignment properties
+  'vertical-align': px,
+  'flex-basis': px,
+  // Some random properties
+  'shape-margin': px,
+  size: px,
+  gap: px,
+  // Grid properties
+  grid: px,
+  'grid-gap': px,
+  'row-gap': px,
+  'grid-row-gap': px,
+  'grid-column-gap': px,
+  'grid-template-rows': px,
+  'grid-template-columns': px,
+  'grid-auto-rows': px,
+  'grid-auto-columns': px,
+  // Not existing properties.
+  // Used to avoid issues with jss-plugin-expand integration.
+  'box-shadow-x': px,
+  'box-shadow-y': px,
+  'box-shadow-blur': px,
+  'box-shadow-spread': px,
+  'font-line-height': px,
+  'text-shadow-x': px,
+  'text-shadow-y': px,
+  'text-shadow-blur': px
+};
+
+/**
+ * Clones the object and adds a camel cased property version.
+ */
+
+function addCamelCasedVersion(obj) {
+  var regExp = /(-[a-z])/g;
+
+  var replace = function replace(str) {
+    return str[1].toUpperCase();
+  };
+
+  var newObj = {};
+
+  for (var key in obj) {
+    newObj[key] = obj[key];
+    newObj[key.replace(regExp, replace)] = obj[key];
+  }
+
+  return newObj;
+}
+
+var units = addCamelCasedVersion(defaultUnits);
+/**
+ * Recursive deep style passing function
+ */
+
+function iterate(prop, value, options) {
+  if (value == null) return value;
+
+  if (Array.isArray(value)) {
+    for (var i = 0; i < value.length; i++) {
+      value[i] = iterate(prop, value[i], options);
+    }
+  } else if (typeof value === 'object') {
+    if (prop === 'fallbacks') {
+      for (var innerProp in value) {
+        value[innerProp] = iterate(innerProp, value[innerProp], options);
+      }
+    } else {
+      for (var _innerProp in value) {
+        value[_innerProp] = iterate(prop + "-" + _innerProp, value[_innerProp], options);
+      }
+    } // eslint-disable-next-line no-restricted-globals
+
+  } else if (typeof value === 'number' && isNaN(value) === false) {
+    var unit = options[prop] || units[prop]; // Add the unit if available, except for the special case of 0px.
+
+    if (unit && !(value === 0 && unit === px)) {
+      return typeof unit === 'function' ? unit(value).toString() : "" + value + unit;
+    }
+
+    return value.toString();
+  }
+
+  return value;
+}
+/**
+ * Add unit to numeric values.
+ */
+
+
+function defaultUnit(options) {
+  if (options === void 0) {
+    options = {};
+  }
+
+  var camelCasedOptions = addCamelCasedVersion(options);
+
+  function onProcessStyle(style, rule) {
+    if (rule.type !== 'style') return style;
+
+    for (var prop in style) {
+      style[prop] = iterate(prop, style[prop], camelCasedOptions);
+    }
+
+    return style;
+  }
+
+  function onChangeValue(value, prop) {
+    return iterate(prop, value, camelCasedOptions);
+  }
+
+  return {
+    onProcessStyle: onProcessStyle,
+    onChangeValue: onChangeValue
+  };
+}
+
+export default defaultUnit;
diff --git a/ddb_main/node_modules/jss-plugin-expand/dist/jss-plugin-expand.esm.js b/ddb_main/node_modules/jss-plugin-expand/dist/jss-plugin-expand.esm.js
new file mode 100644
index 0000000..be5edb3
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-expand/dist/jss-plugin-expand.esm.js
@@ -0,0 +1,386 @@
+/**
+ * A scheme for converting properties from array to regular style.
+ * All properties listed below will be transformed to a string separated by space.
+ */
+var propArray = {
+  'background-size': true,
+  'background-position': true,
+  border: true,
+  'border-bottom': true,
+  'border-left': true,
+  'border-top': true,
+  'border-right': true,
+  'border-radius': true,
+  'border-image': true,
+  'border-width': true,
+  'border-style': true,
+  'border-color': true,
+  'box-shadow': true,
+  flex: true,
+  margin: true,
+  padding: true,
+  outline: true,
+  'transform-origin': true,
+  transform: true,
+  transition: true
+  /**
+   * A scheme for converting arrays to regular styles inside of objects.
+   * For e.g.: "{position: [0, 0]}" => "background-position: 0 0;".
+   */
+
+};
+var propArrayInObj = {
+  position: true,
+  // background-position
+  size: true // background-size
+
+  /**
+   * A scheme for parsing and building correct styles from passed objects.
+   */
+
+};
+var propObj = {
+  padding: {
+    top: 0,
+    right: 0,
+    bottom: 0,
+    left: 0
+  },
+  margin: {
+    top: 0,
+    right: 0,
+    bottom: 0,
+    left: 0
+  },
+  background: {
+    attachment: null,
+    color: null,
+    image: null,
+    position: null,
+    repeat: null
+  },
+  border: {
+    width: null,
+    style: null,
+    color: null
+  },
+  'border-top': {
+    width: null,
+    style: null,
+    color: null
+  },
+  'border-right': {
+    width: null,
+    style: null,
+    color: null
+  },
+  'border-bottom': {
+    width: null,
+    style: null,
+    color: null
+  },
+  'border-left': {
+    width: null,
+    style: null,
+    color: null
+  },
+  outline: {
+    width: null,
+    style: null,
+    color: null
+  },
+  'list-style': {
+    type: null,
+    position: null,
+    image: null
+  },
+  transition: {
+    property: null,
+    duration: null,
+    'timing-function': null,
+    timingFunction: null,
+    // Needed for avoiding comilation issues with jss-plugin-camel-case
+    delay: null
+  },
+  animation: {
+    name: null,
+    duration: null,
+    'timing-function': null,
+    timingFunction: null,
+    // Needed to avoid compilation issues with jss-plugin-camel-case
+    delay: null,
+    'iteration-count': null,
+    iterationCount: null,
+    // Needed to avoid compilation issues with jss-plugin-camel-case
+    direction: null,
+    'fill-mode': null,
+    fillMode: null,
+    // Needed to avoid compilation issues with jss-plugin-camel-case
+    'play-state': null,
+    playState: null // Needed to avoid compilation issues with jss-plugin-camel-case
+
+  },
+  'box-shadow': {
+    x: 0,
+    y: 0,
+    blur: 0,
+    spread: 0,
+    color: null,
+    inset: null
+  },
+  'text-shadow': {
+    x: 0,
+    y: 0,
+    blur: null,
+    color: null
+  }
+  /**
+   * A scheme for converting non-standart properties inside object.
+   * For e.g.: include 'border-radius' property inside 'border' object.
+   */
+
+};
+var customPropObj = {
+  border: {
+    radius: 'border-radius',
+    image: 'border-image',
+    width: 'border-width',
+    style: 'border-style',
+    color: 'border-color'
+  },
+  'border-bottom': {
+    width: 'border-bottom-width',
+    style: 'border-bottom-style',
+    color: 'border-bottom-color'
+  },
+  'border-top': {
+    width: 'border-top-width',
+    style: 'border-top-style',
+    color: 'border-top-color'
+  },
+  'border-left': {
+    width: 'border-left-width',
+    style: 'border-left-style',
+    color: 'border-left-color'
+  },
+  'border-right': {
+    width: 'border-right-width',
+    style: 'border-right-style',
+    color: 'border-right-color'
+  },
+  background: {
+    size: 'background-size',
+    image: 'background-image'
+  },
+  font: {
+    style: 'font-style',
+    variant: 'font-variant',
+    weight: 'font-weight',
+    stretch: 'font-stretch',
+    size: 'font-size',
+    family: 'font-family',
+    lineHeight: 'line-height',
+    // Needed to avoid compilation issues with jss-plugin-camel-case
+    'line-height': 'line-height'
+  },
+  flex: {
+    grow: 'flex-grow',
+    basis: 'flex-basis',
+    direction: 'flex-direction',
+    wrap: 'flex-wrap',
+    flow: 'flex-flow',
+    shrink: 'flex-shrink'
+  },
+  align: {
+    self: 'align-self',
+    items: 'align-items',
+    content: 'align-content'
+  },
+  grid: {
+    'template-columns': 'grid-template-columns',
+    templateColumns: 'grid-template-columns',
+    'template-rows': 'grid-template-rows',
+    templateRows: 'grid-template-rows',
+    'template-areas': 'grid-template-areas',
+    templateAreas: 'grid-template-areas',
+    template: 'grid-template',
+    'auto-columns': 'grid-auto-columns',
+    autoColumns: 'grid-auto-columns',
+    'auto-rows': 'grid-auto-rows',
+    autoRows: 'grid-auto-rows',
+    'auto-flow': 'grid-auto-flow',
+    autoFlow: 'grid-auto-flow',
+    row: 'grid-row',
+    column: 'grid-column',
+    'row-start': 'grid-row-start',
+    rowStart: 'grid-row-start',
+    'row-end': 'grid-row-end',
+    rowEnd: 'grid-row-end',
+    'column-start': 'grid-column-start',
+    columnStart: 'grid-column-start',
+    'column-end': 'grid-column-end',
+    columnEnd: 'grid-column-end',
+    area: 'grid-area',
+    gap: 'grid-gap',
+    'row-gap': 'grid-row-gap',
+    rowGap: 'grid-row-gap',
+    'column-gap': 'grid-column-gap',
+    columnGap: 'grid-column-gap'
+  }
+};
+
+/* eslint-disable no-use-before-define */
+/**
+ * Map values by given prop.
+ *
+ * @param {Array} array of values
+ * @param {String} original property
+ * @param {String} original rule
+ * @return {String} mapped values
+ */
+
+function mapValuesByProp(value, prop, rule) {
+  return value.map(function (item) {
+    return objectToArray(item, prop, rule, false, true);
+  });
+}
+/**
+ * Convert array to nested array, if needed
+ */
+
+
+function processArray(value, prop, scheme, rule) {
+  if (scheme[prop] == null) return value;
+  if (value.length === 0) return [];
+  if (Array.isArray(value[0])) return processArray(value[0], prop, scheme, rule);
+
+  if (typeof value[0] === 'object') {
+    return mapValuesByProp(value, prop, rule);
+  }
+
+  return [value];
+}
+/**
+ * Convert object to array.
+ */
+
+
+function objectToArray(value, prop, rule, isFallback, isInArray) {
+  if (!(propObj[prop] || customPropObj[prop])) return [];
+  var result = []; // Check if exists any non-standard property
+
+  if (customPropObj[prop]) {
+    // eslint-disable-next-line no-param-reassign
+    value = customPropsToStyle(value, rule, customPropObj[prop], isFallback);
+  } // Pass throught all standart props
+
+
+  if (Object.keys(value).length) {
+    for (var baseProp in propObj[prop]) {
+      if (value[baseProp]) {
+        if (Array.isArray(value[baseProp])) {
+          result.push(propArrayInObj[baseProp] === null ? value[baseProp] : value[baseProp].join(' '));
+        } else result.push(value[baseProp]);
+
+        continue;
+      } // Add default value from props config.
+
+
+      if (propObj[prop][baseProp] != null) {
+        result.push(propObj[prop][baseProp]);
+      }
+    }
+  }
+
+  if (!result.length || isInArray) return result;
+  return [result];
+}
+/**
+ * Convert custom properties values to styles adding them to rule directly
+ */
+
+
+function customPropsToStyle(value, rule, customProps, isFallback) {
+  for (var prop in customProps) {
+    var propName = customProps[prop]; // If current property doesn't exist already in rule - add new one
+
+    if (typeof value[prop] !== 'undefined' && (isFallback || !rule.prop(propName))) {
+      var _styleDetector;
+
+      var appendedValue = styleDetector((_styleDetector = {}, _styleDetector[propName] = value[prop], _styleDetector), rule)[propName]; // Add style directly in rule
+
+      if (isFallback) rule.style.fallbacks[propName] = appendedValue;else rule.style[propName] = appendedValue;
+    } // Delete converted property to avoid double converting
+
+
+    delete value[prop];
+  }
+
+  return value;
+}
+/**
+ * Detect if a style needs to be converted.
+ */
+
+
+function styleDetector(style, rule, isFallback) {
+  for (var prop in style) {
+    var value = style[prop];
+
+    if (Array.isArray(value)) {
+      // Check double arrays to avoid recursion.
+      if (!Array.isArray(value[0])) {
+        if (prop === 'fallbacks') {
+          for (var index = 0; index < style.fallbacks.length; index++) {
+            style.fallbacks[index] = styleDetector(style.fallbacks[index], rule, true);
+          }
+
+          continue;
+        }
+
+        style[prop] = processArray(value, prop, propArray, rule); // Avoid creating properties with empty values
+
+        if (!style[prop].length) delete style[prop];
+      }
+    } else if (typeof value === 'object') {
+      if (prop === 'fallbacks') {
+        style.fallbacks = styleDetector(style.fallbacks, rule, true);
+        continue;
+      }
+
+      style[prop] = objectToArray(value, prop, rule, isFallback); // Avoid creating properties with empty values
+
+      if (!style[prop].length) delete style[prop];
+    } // Maybe a computed value resulting in an empty string
+    else if (style[prop] === '') delete style[prop];
+  }
+
+  return style;
+}
+/**
+ * Adds possibility to write expanded styles.
+ */
+
+
+function jssExpand() {
+  function onProcessStyle(style, rule) {
+    if (!style || rule.type !== 'style') return style;
+
+    if (Array.isArray(style)) {
+      // Pass rules one by one and reformat them
+      for (var index = 0; index < style.length; index++) {
+        style[index] = styleDetector(style[index], rule);
+      }
+
+      return style;
+    }
+
+    return styleDetector(style, rule);
+  }
+
+  return {
+    onProcessStyle: onProcessStyle
+  };
+}
+
+export default jssExpand;
diff --git a/ddb_main/node_modules/jss-plugin-extend/dist/jss-plugin-extend.esm.js b/ddb_main/node_modules/jss-plugin-extend/dist/jss-plugin-extend.esm.js
new file mode 100644
index 0000000..9497f04
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-extend/dist/jss-plugin-extend.esm.js
@@ -0,0 +1,136 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import warning from 'tiny-warning';
+
+var isObject = function isObject(obj) {
+  return obj && typeof obj === 'object' && !Array.isArray(obj);
+};
+
+var valueNs = "extendCurrValue" + Date.now();
+
+function mergeExtend(style, rule, sheet, newStyle) {
+  var extendType = typeof style.extend; // Extend using a rule name.
+
+  if (extendType === 'string') {
+    if (!sheet) return;
+    var refRule = sheet.getRule(style.extend);
+    if (!refRule) return;
+
+    if (refRule === rule) {
+      process.env.NODE_ENV !== "production" ? warning(false, "[JSS] A rule tries to extend itself \n" + rule.toString()) : void 0;
+      return;
+    }
+
+    var parent = refRule.options.parent;
+
+    if (parent) {
+      var originalStyle = parent.rules.raw[style.extend];
+      extend(originalStyle, rule, sheet, newStyle);
+    }
+
+    return;
+  } // Extend using an array.
+
+
+  if (Array.isArray(style.extend)) {
+    for (var index = 0; index < style.extend.length; index++) {
+      var singleExtend = style.extend[index];
+      var singleStyle = typeof singleExtend === 'string' ? _extends({}, style, {
+        extend: singleExtend
+      }) : style.extend[index];
+      extend(singleStyle, rule, sheet, newStyle);
+    }
+
+    return;
+  } // Extend is a style object.
+
+
+  for (var prop in style.extend) {
+    if (prop === 'extend') {
+      extend(style.extend.extend, rule, sheet, newStyle);
+      continue;
+    }
+
+    if (isObject(style.extend[prop])) {
+      if (!(prop in newStyle)) newStyle[prop] = {};
+      extend(style.extend[prop], rule, sheet, newStyle[prop]);
+      continue;
+    }
+
+    newStyle[prop] = style.extend[prop];
+  }
+}
+
+function mergeRest(style, rule, sheet, newStyle) {
+  // Copy base style.
+  for (var prop in style) {
+    if (prop === 'extend') continue;
+
+    if (isObject(newStyle[prop]) && isObject(style[prop])) {
+      extend(style[prop], rule, sheet, newStyle[prop]);
+      continue;
+    }
+
+    if (isObject(style[prop])) {
+      newStyle[prop] = extend(style[prop], rule, sheet);
+      continue;
+    }
+
+    newStyle[prop] = style[prop];
+  }
+}
+/**
+ * Recursively extend styles.
+ */
+
+
+function extend(style, rule, sheet, newStyle) {
+  if (newStyle === void 0) {
+    newStyle = {};
+  }
+
+  mergeExtend(style, rule, sheet, newStyle);
+  mergeRest(style, rule, sheet, newStyle);
+  return newStyle;
+}
+/**
+ * Handle `extend` property.
+ */
+
+
+function jssExtend() {
+  function onProcessStyle(style, rule, sheet) {
+    if ('extend' in style) return extend(style, rule, sheet);
+    return style;
+  }
+
+  function onChangeValue(value, prop, rule) {
+    if (prop !== 'extend') return value; // Value is empty, remove properties set previously.
+
+    if (value == null || value === false) {
+      for (var key in rule[valueNs]) {
+        rule.prop(key, null);
+      }
+
+      rule[valueNs] = null;
+      return null;
+    }
+
+    if (typeof value === 'object') {
+      for (var _key in value) {
+        rule.prop(_key, value[_key]);
+      }
+
+      rule[valueNs] = value;
+    } // Make sure we don't set the value in the core.
+
+
+    return null;
+  }
+
+  return {
+    onProcessStyle: onProcessStyle,
+    onChangeValue: onChangeValue
+  };
+}
+
+export default jssExtend;
diff --git a/ddb_main/node_modules/jss-plugin-global/dist/jss-plugin-global.esm.js b/ddb_main/node_modules/jss-plugin-global/dist/jss-plugin-global.esm.js
new file mode 100644
index 0000000..d5e28c8
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-global/dist/jss-plugin-global.esm.js
@@ -0,0 +1,186 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import { RuleList } from 'jss';
+
+var at = '@global';
+var atPrefix = '@global ';
+
+var GlobalContainerRule =
+/*#__PURE__*/
+function () {
+  function GlobalContainerRule(key, styles, options) {
+    this.type = 'global';
+    this.at = at;
+    this.isProcessed = false;
+    this.key = key;
+    this.options = options;
+    this.rules = new RuleList(_extends({}, options, {
+      parent: this
+    }));
+
+    for (var selector in styles) {
+      this.rules.add(selector, styles[selector]);
+    }
+
+    this.rules.process();
+  }
+  /**
+   * Get a rule.
+   */
+
+
+  var _proto = GlobalContainerRule.prototype;
+
+  _proto.getRule = function getRule(name) {
+    return this.rules.get(name);
+  }
+  /**
+   * Create and register rule, run plugins.
+   */
+  ;
+
+  _proto.addRule = function addRule(name, style, options) {
+    var rule = this.rules.add(name, style, options);
+    if (rule) this.options.jss.plugins.onProcessRule(rule);
+    return rule;
+  }
+  /**
+   * Replace rule, run plugins.
+   */
+  ;
+
+  _proto.replaceRule = function replaceRule(name, style, options) {
+    var newRule = this.rules.replace(name, style, options);
+    if (newRule) this.options.jss.plugins.onProcessRule(newRule);
+    return newRule;
+  }
+  /**
+   * Get index of a rule.
+   */
+  ;
+
+  _proto.indexOf = function indexOf(rule) {
+    return this.rules.indexOf(rule);
+  }
+  /**
+   * Generates a CSS string.
+   */
+  ;
+
+  _proto.toString = function toString(options) {
+    return this.rules.toString(options);
+  };
+
+  return GlobalContainerRule;
+}();
+
+var GlobalPrefixedRule =
+/*#__PURE__*/
+function () {
+  function GlobalPrefixedRule(key, style, options) {
+    this.type = 'global';
+    this.at = at;
+    this.isProcessed = false;
+    this.key = key;
+    this.options = options;
+    var selector = key.substr(atPrefix.length);
+    this.rule = options.jss.createRule(selector, style, _extends({}, options, {
+      parent: this
+    }));
+  }
+
+  var _proto2 = GlobalPrefixedRule.prototype;
+
+  _proto2.toString = function toString(options) {
+    return this.rule ? this.rule.toString(options) : '';
+  };
+
+  return GlobalPrefixedRule;
+}();
+
+var separatorRegExp = /\s*,\s*/g;
+
+function addScope(selector, scope) {
+  var parts = selector.split(separatorRegExp);
+  var scoped = '';
+
+  for (var i = 0; i < parts.length; i++) {
+    scoped += scope + " " + parts[i].trim();
+    if (parts[i + 1]) scoped += ', ';
+  }
+
+  return scoped;
+}
+
+function handleNestedGlobalContainerRule(rule, sheet) {
+  var options = rule.options,
+      style = rule.style;
+  var rules = style ? style[at] : null;
+  if (!rules) return;
+
+  for (var name in rules) {
+    sheet.addRule(name, rules[name], _extends({}, options, {
+      selector: addScope(name, rule.selector)
+    }));
+  }
+
+  delete style[at];
+}
+
+function handlePrefixedGlobalRule(rule, sheet) {
+  var options = rule.options,
+      style = rule.style;
+
+  for (var prop in style) {
+    if (prop[0] !== '@' || prop.substr(0, at.length) !== at) continue;
+    var selector = addScope(prop.substr(at.length), rule.selector);
+    sheet.addRule(selector, style[prop], _extends({}, options, {
+      selector: selector
+    }));
+    delete style[prop];
+  }
+}
+/**
+ * Convert nested rules to separate, remove them from original styles.
+ */
+
+
+function jssGlobal() {
+  function onCreateRule(name, styles, options) {
+    if (!name) return null;
+
+    if (name === at) {
+      return new GlobalContainerRule(name, styles, options);
+    }
+
+    if (name[0] === '@' && name.substr(0, atPrefix.length) === atPrefix) {
+      return new GlobalPrefixedRule(name, styles, options);
+    }
+
+    var parent = options.parent;
+
+    if (parent) {
+      if (parent.type === 'global' || parent.options.parent && parent.options.parent.type === 'global') {
+        options.scoped = false;
+      }
+    }
+
+    if (!options.selector && options.scoped === false) {
+      options.selector = name;
+    }
+
+    return null;
+  }
+
+  function onProcessRule(rule, sheet) {
+    if (rule.type !== 'style' || !sheet) return;
+    handleNestedGlobalContainerRule(rule, sheet);
+    handlePrefixedGlobalRule(rule, sheet);
+  }
+
+  return {
+    onCreateRule: onCreateRule,
+    onProcessRule: onProcessRule
+  };
+}
+
+export default jssGlobal;
diff --git a/ddb_main/node_modules/jss-plugin-nested/dist/jss-plugin-nested.esm.js b/ddb_main/node_modules/jss-plugin-nested/dist/jss-plugin-nested.esm.js
new file mode 100644
index 0000000..37973d6
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-nested/dist/jss-plugin-nested.esm.js
@@ -0,0 +1,113 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import warning from 'tiny-warning';
+
+var separatorRegExp = /\s*,\s*/g;
+var parentRegExp = /&/g;
+var refRegExp = /\$([\w-]+)/g;
+/**
+ * Convert nested rules to separate, remove them from original styles.
+ */
+
+function jssNested() {
+  // Get a function to be used for $ref replacement.
+  function getReplaceRef(container, sheet) {
+    return function (match, key) {
+      var rule = container.getRule(key) || sheet && sheet.getRule(key);
+
+      if (rule) {
+        return rule.selector;
+      }
+
+      process.env.NODE_ENV !== "production" ? warning(false, "[JSS] Could not find the referenced rule \"" + key + "\" in \"" + (container.options.meta || container.toString()) + "\".") : void 0;
+      return key;
+    };
+  }
+
+  function replaceParentRefs(nestedProp, parentProp) {
+    var parentSelectors = parentProp.split(separatorRegExp);
+    var nestedSelectors = nestedProp.split(separatorRegExp);
+    var result = '';
+
+    for (var i = 0; i < parentSelectors.length; i++) {
+      var parent = parentSelectors[i];
+
+      for (var j = 0; j < nestedSelectors.length; j++) {
+        var nested = nestedSelectors[j];
+        if (result) result += ', '; // Replace all & by the parent or prefix & with the parent.
+
+        result += nested.indexOf('&') !== -1 ? nested.replace(parentRegExp, parent) : parent + " " + nested;
+      }
+    }
+
+    return result;
+  }
+
+  function getOptions(rule, container, prevOptions) {
+    // Options has been already created, now we only increase index.
+    if (prevOptions) return _extends({}, prevOptions, {
+      index: prevOptions.index + 1
+    });
+    var nestingLevel = rule.options.nestingLevel;
+    nestingLevel = nestingLevel === undefined ? 1 : nestingLevel + 1;
+
+    var options = _extends({}, rule.options, {
+      nestingLevel: nestingLevel,
+      index: container.indexOf(rule) + 1 // We don't need the parent name to be set options for chlid.
+
+    });
+
+    delete options.name;
+    return options;
+  }
+
+  function onProcessStyle(style, rule, sheet) {
+    if (rule.type !== 'style') return style;
+    var styleRule = rule;
+    var container = styleRule.options.parent;
+    var options;
+    var replaceRef;
+
+    for (var prop in style) {
+      var isNested = prop.indexOf('&') !== -1;
+      var isNestedConditional = prop[0] === '@';
+      if (!isNested && !isNestedConditional) continue;
+      options = getOptions(styleRule, container, options);
+
+      if (isNested) {
+        var selector = replaceParentRefs(prop, styleRule.selector); // Lazily create the ref replacer function just once for
+        // all nested rules within the sheet.
+
+        if (!replaceRef) replaceRef = getReplaceRef(container, sheet); // Replace all $refs.
+
+        selector = selector.replace(refRegExp, replaceRef);
+        var name = styleRule.key + "-" + prop;
+
+        if ('replaceRule' in container) {
+          // for backward compatibility
+          container.replaceRule(name, style[prop], _extends({}, options, {
+            selector: selector
+          }));
+        } else {
+          container.addRule(name, style[prop], _extends({}, options, {
+            selector: selector
+          }));
+        }
+      } else if (isNestedConditional) {
+        // Place conditional right after the parent rule to ensure right ordering.
+        container.addRule(prop, {}, options).addRule(styleRule.key, style[prop], {
+          selector: styleRule.selector
+        });
+      }
+
+      delete style[prop];
+    }
+
+    return style;
+  }
+
+  return {
+    onProcessStyle: onProcessStyle
+  };
+}
+
+export default jssNested;
diff --git a/ddb_main/node_modules/jss-plugin-props-sort/dist/jss-plugin-props-sort.esm.js b/ddb_main/node_modules/jss-plugin-props-sort/dist/jss-plugin-props-sort.esm.js
new file mode 100644
index 0000000..a733345
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-props-sort/dist/jss-plugin-props-sort.esm.js
@@ -0,0 +1,28 @@
+/**
+ * Sort props by length.
+ */
+function jssPropsSort() {
+  var sort = function sort(prop0, prop1) {
+    if (prop0.length === prop1.length) {
+      return prop0 > prop1 ? 1 : -1;
+    }
+
+    return prop0.length - prop1.length;
+  };
+
+  return {
+    onProcessStyle: function onProcessStyle(style, rule) {
+      if (rule.type !== 'style') return style;
+      var newStyle = {};
+      var props = Object.keys(style).sort(sort);
+
+      for (var i = 0; i < props.length; i++) {
+        newStyle[props[i]] = style[props[i]];
+      }
+
+      return newStyle;
+    }
+  };
+}
+
+export default jssPropsSort;
diff --git a/ddb_main/node_modules/jss-plugin-rule-value-function/dist/jss-plugin-rule-value-function.esm.js b/ddb_main/node_modules/jss-plugin-rule-value-function/dist/jss-plugin-rule-value-function.esm.js
new file mode 100644
index 0000000..17a54be
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-rule-value-function/dist/jss-plugin-rule-value-function.esm.js
@@ -0,0 +1,65 @@
+import warning from 'tiny-warning';
+import { createRule } from 'jss';
+
+var now = Date.now();
+var fnValuesNs = "fnValues" + now;
+var fnRuleNs = "fnStyle" + ++now;
+
+var functionPlugin = function functionPlugin() {
+  return {
+    onCreateRule: function onCreateRule(name, decl, options) {
+      if (typeof decl !== 'function') return null;
+      var rule = createRule(name, {}, options);
+      rule[fnRuleNs] = decl;
+      return rule;
+    },
+    onProcessStyle: function onProcessStyle(style, rule) {
+      // We need to extract function values from the declaration, so that we can keep core unaware of them.
+      // We need to do that only once.
+      // We don't need to extract functions on each style update, since this can happen only once.
+      // We don't support function values inside of function rules.
+      if (fnValuesNs in rule || fnRuleNs in rule) return style;
+      var fnValues = {};
+
+      for (var prop in style) {
+        var value = style[prop];
+        if (typeof value !== 'function') continue;
+        delete style[prop];
+        fnValues[prop] = value;
+      }
+
+      rule[fnValuesNs] = fnValues;
+      return style;
+    },
+    onUpdate: function onUpdate(data, rule, sheet, options) {
+      var styleRule = rule;
+      var fnRule = styleRule[fnRuleNs]; // If we have a style function, the entire rule is dynamic and style object
+      // will be returned from that function.
+
+      if (fnRule) {
+        // Empty object will remove all currently defined props
+        // in case function rule returns a falsy value.
+        styleRule.style = fnRule(data) || {};
+
+        if (process.env.NODE_ENV === 'development') {
+          for (var prop in styleRule.style) {
+            if (typeof styleRule.style[prop] === 'function') {
+              process.env.NODE_ENV !== "production" ? warning(false, '[JSS] Function values inside function rules are not supported.') : void 0;
+              break;
+            }
+          }
+        }
+      }
+
+      var fnValues = styleRule[fnValuesNs]; // If we have a fn values map, it is a rule with function values.
+
+      if (fnValues) {
+        for (var _prop in fnValues) {
+          styleRule.prop(_prop, fnValues[_prop](data), options);
+        }
+      }
+    }
+  };
+};
+
+export default functionPlugin;
diff --git a/ddb_main/node_modules/jss-plugin-rule-value-observable/dist/jss-plugin-rule-value-observable.esm.js b/ddb_main/node_modules/jss-plugin-rule-value-observable/dist/jss-plugin-rule-value-observable.esm.js
new file mode 100644
index 0000000..9d16843
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-rule-value-observable/dist/jss-plugin-rule-value-observable.esm.js
@@ -0,0 +1,49 @@
+import $$observable from 'symbol-observable';
+import { createRule } from 'jss';
+
+var isObservable = function isObservable(value) {
+  return value && value[$$observable] && value === value[$$observable]();
+};
+
+var observablePlugin = function observablePlugin(updateOptions) {
+  return {
+    onCreateRule: function onCreateRule(name, decl, options) {
+      if (!isObservable(decl)) return null;
+      var style$ = decl;
+      var rule = createRule(name, {}, options); // TODO
+      // Call `stream.subscribe()` returns a subscription, which should be explicitly
+      // unsubscribed from when we know this sheet is no longer needed.
+
+      style$.subscribe(function (style) {
+        for (var prop in style) {
+          rule.prop(prop, style[prop], updateOptions);
+        }
+      });
+      return rule;
+    },
+    onProcessRule: function onProcessRule(rule) {
+      if (rule && rule.type !== 'style') return;
+      var styleRule = rule;
+      var style = styleRule.style;
+
+      var _loop = function _loop(prop) {
+        var value = style[prop];
+        if (!isObservable(value)) return "continue";
+        delete style[prop];
+        value.subscribe({
+          next: function next(nextValue) {
+            styleRule.prop(prop, nextValue, updateOptions);
+          }
+        });
+      };
+
+      for (var prop in style) {
+        var _ret = _loop(prop);
+
+        if (_ret === "continue") continue;
+      }
+    }
+  };
+};
+
+export default observablePlugin;
diff --git a/ddb_main/node_modules/jss-plugin-rule-value-observable/node_modules/symbol-observable/es/index.js b/ddb_main/node_modules/jss-plugin-rule-value-observable/node_modules/symbol-observable/es/index.js
new file mode 100644
index 0000000..4ed892d
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-rule-value-observable/node_modules/symbol-observable/es/index.js
@@ -0,0 +1,19 @@
+/* global window */
+import ponyfill from './ponyfill.js';
+
+var root;
+
+if (typeof self !== 'undefined') {
+  root = self;
+} else if (typeof window !== 'undefined') {
+  root = window;
+} else if (typeof global !== 'undefined') {
+  root = global;
+} else if (typeof module !== 'undefined') {
+  root = module;
+} else {
+  root = Function('return this')();
+}
+
+var result = ponyfill(root);
+export default result;
diff --git a/ddb_main/node_modules/jss-plugin-rule-value-observable/node_modules/symbol-observable/es/ponyfill.js b/ddb_main/node_modules/jss-plugin-rule-value-observable/node_modules/symbol-observable/es/ponyfill.js
new file mode 100644
index 0000000..95dedc2
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-rule-value-observable/node_modules/symbol-observable/es/ponyfill.js
@@ -0,0 +1,17 @@
+export default function symbolObservablePonyfill(root) {
+	var result;
+	var Symbol = root.Symbol;
+
+	if (typeof Symbol === 'function') {
+		if (Symbol.observable) {
+			result = Symbol.observable;
+		} else {
+			result = Symbol('observable');
+			Symbol.observable = result;
+		}
+	} else {
+		result = '@@observable';
+	}
+
+	return result;
+};
diff --git a/ddb_main/node_modules/jss-plugin-template/dist/jss-plugin-template.esm.js b/ddb_main/node_modules/jss-plugin-template/dist/jss-plugin-template.esm.js
new file mode 100644
index 0000000..dd28247
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-template/dist/jss-plugin-template.esm.js
@@ -0,0 +1,45 @@
+import warning from 'tiny-warning';
+
+var semiWithNl = /;\n/;
+/**
+ * Naive CSS parser.
+ * - Supports only rule body (no selectors)
+ * - Requires semicolon and new line after the value (except of last line)
+ * - No nested rules support
+ */
+
+var parse = function parse(cssText) {
+  var style = {};
+  var split = cssText.split(semiWithNl);
+
+  for (var i = 0; i < split.length; i++) {
+    var decl = (split[i] || '').trim();
+    if (!decl) continue;
+    var colonIndex = decl.indexOf(':');
+
+    if (colonIndex === -1) {
+      process.env.NODE_ENV !== "production" ? warning(false, "[JSS] Malformed CSS string \"" + decl + "\"") : void 0;
+      continue;
+    }
+
+    var prop = decl.substr(0, colonIndex).trim();
+    var value = decl.substr(colonIndex + 1).trim();
+    style[prop] = value;
+  }
+
+  return style;
+};
+
+var onProcessRule = function onProcessRule(rule) {
+  if (typeof rule.style === 'string') {
+    rule.style = parse(rule.style);
+  }
+};
+
+function templatePlugin() {
+  return {
+    onProcessRule: onProcessRule
+  };
+}
+
+export default templatePlugin;
diff --git a/ddb_main/node_modules/jss-plugin-vendor-prefixer/dist/jss-plugin-vendor-prefixer.esm.js b/ddb_main/node_modules/jss-plugin-vendor-prefixer/dist/jss-plugin-vendor-prefixer.esm.js
new file mode 100644
index 0000000..c9e856b
--- /dev/null
+++ b/ddb_main/node_modules/jss-plugin-vendor-prefixer/dist/jss-plugin-vendor-prefixer.esm.js
@@ -0,0 +1,57 @@
+import { supportedKeyframes, supportedValue, supportedProperty } from 'css-vendor';
+import { toCssValue } from 'jss';
+
+/**
+ * Add vendor prefix to a property name when needed.
+ */
+
+function jssVendorPrefixer() {
+  function onProcessRule(rule) {
+    if (rule.type === 'keyframes') {
+      var atRule = rule;
+      atRule.at = supportedKeyframes(atRule.at);
+    }
+  }
+
+  function prefixStyle(style) {
+    for (var prop in style) {
+      var value = style[prop];
+
+      if (prop === 'fallbacks' && Array.isArray(value)) {
+        style[prop] = value.map(prefixStyle);
+        continue;
+      }
+
+      var changeProp = false;
+      var supportedProp = supportedProperty(prop);
+      if (supportedProp && supportedProp !== prop) changeProp = true;
+      var changeValue = false;
+      var supportedValue$1 = supportedValue(supportedProp, toCssValue(value));
+      if (supportedValue$1 && supportedValue$1 !== value) changeValue = true;
+
+      if (changeProp || changeValue) {
+        if (changeProp) delete style[prop];
+        style[supportedProp || prop] = supportedValue$1 || value;
+      }
+    }
+
+    return style;
+  }
+
+  function onProcessStyle(style, rule) {
+    if (rule.type !== 'style') return style;
+    return prefixStyle(style);
+  }
+
+  function onChangeValue(value, prop) {
+    return supportedValue(prop, toCssValue(value)) || value;
+  }
+
+  return {
+    onProcessRule: onProcessRule,
+    onProcessStyle: onProcessStyle,
+    onChangeValue: onChangeValue
+  };
+}
+
+export default jssVendorPrefixer;
diff --git a/ddb_main/node_modules/jss-preset-default/dist/jss-preset-default.esm.js b/ddb_main/node_modules/jss-preset-default/dist/jss-preset-default.esm.js
new file mode 100644
index 0000000..928fa0e
--- /dev/null
+++ b/ddb_main/node_modules/jss-preset-default/dist/jss-preset-default.esm.js
@@ -0,0 +1,24 @@
+import functions from 'jss-plugin-rule-value-function';
+import observable from 'jss-plugin-rule-value-observable';
+import template from 'jss-plugin-template';
+import global from 'jss-plugin-global';
+import extend from 'jss-plugin-extend';
+import nested from 'jss-plugin-nested';
+import compose from 'jss-plugin-compose';
+import camelCase from 'jss-plugin-camel-case';
+import defaultUnit from 'jss-plugin-default-unit';
+import expand from 'jss-plugin-expand';
+import vendorPrefixer from 'jss-plugin-vendor-prefixer';
+import propsSort from 'jss-plugin-props-sort';
+
+var create = function create(options) {
+  if (options === void 0) {
+    options = {};
+  }
+
+  return {
+    plugins: [functions(), observable(options.observable), template(), global(), extend(), nested(), compose(), camelCase(), defaultUnit(options.defaultUnit), expand(), vendorPrefixer(), propsSort()]
+  };
+};
+
+export default create;
diff --git a/ddb_main/node_modules/jss/dist/jss.esm.js b/ddb_main/node_modules/jss/dist/jss.esm.js
new file mode 100644
index 0000000..d216cd9
--- /dev/null
+++ b/ddb_main/node_modules/jss/dist/jss.esm.js
@@ -0,0 +1,2289 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import isInBrowser from 'is-in-browser';
+import warning from 'tiny-warning';
+import _createClass from '@babel/runtime/helpers/esm/createClass';
+import _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose';
+import _assertThisInitialized from '@babel/runtime/helpers/esm/assertThisInitialized';
+import _objectWithoutPropertiesLoose from '@babel/runtime/helpers/esm/objectWithoutPropertiesLoose';
+
+var plainObjectConstrurctor = {}.constructor;
+function cloneStyle(style) {
+  if (style == null || typeof style !== 'object') return style;
+  if (Array.isArray(style)) return style.map(cloneStyle);
+  if (style.constructor !== plainObjectConstrurctor) return style;
+  var newStyle = {};
+
+  for (var name in style) {
+    newStyle[name] = cloneStyle(style[name]);
+  }
+
+  return newStyle;
+}
+
+/**
+ * Create a rule instance.
+ */
+
+function createRule(name, decl, options) {
+  if (name === void 0) {
+    name = 'unnamed';
+  }
+
+  var jss = options.jss;
+  var declCopy = cloneStyle(decl);
+  var rule = jss.plugins.onCreateRule(name, declCopy, options);
+  if (rule) return rule; // It is an at-rule and it has no instance.
+
+  if (name[0] === '@') {
+    process.env.NODE_ENV !== "production" ? warning(false, "[JSS] Unknown rule " + name) : void 0;
+  }
+
+  return null;
+}
+
+var join = function join(value, by) {
+  var result = '';
+
+  for (var i = 0; i < value.length; i++) {
+    // Remove !important from the value, it will be readded later.
+    if (value[i] === '!important') break;
+    if (result) result += by;
+    result += value[i];
+  }
+
+  return result;
+};
+/**
+ * Converts JSS array value to a CSS string.
+ *
+ * `margin: [['5px', '10px']]` > `margin: 5px 10px;`
+ * `border: ['1px', '2px']` > `border: 1px, 2px;`
+ * `margin: [['5px', '10px'], '!important']` > `margin: 5px 10px !important;`
+ * `color: ['red', !important]` > `color: red !important;`
+ */
+
+
+var toCssValue = function toCssValue(value) {
+  if (!Array.isArray(value)) return value;
+  var cssValue = ''; // Support space separated values via `[['5px', '10px']]`.
+
+  if (Array.isArray(value[0])) {
+    for (var i = 0; i < value.length; i++) {
+      if (value[i] === '!important') break;
+      if (cssValue) cssValue += ', ';
+      cssValue += join(value[i], ' ');
+    }
+  } else cssValue = join(value, ', '); // Add !important, because it was ignored.
+
+
+  if (value[value.length - 1] === '!important') {
+    cssValue += ' !important';
+  }
+
+  return cssValue;
+};
+
+function getWhitespaceSymbols(options) {
+  if (options && options.format === false) {
+    return {
+      linebreak: '',
+      space: ''
+    };
+  }
+
+  return {
+    linebreak: '\n',
+    space: ' '
+  };
+}
+
+/**
+ * Indent a string.
+ * http://jsperf.com/array-join-vs-for
+ */
+
+function indentStr(str, indent) {
+  var result = '';
+
+  for (var index = 0; index < indent; index++) {
+    result += '  ';
+  }
+
+  return result + str;
+}
+/**
+ * Converts a Rule to CSS string.
+ */
+
+
+function toCss(selector, style, options) {
+  if (options === void 0) {
+    options = {};
+  }
+
+  var result = '';
+  if (!style) return result;
+  var _options = options,
+      _options$indent = _options.indent,
+      indent = _options$indent === void 0 ? 0 : _options$indent;
+  var fallbacks = style.fallbacks;
+
+  if (options.format === false) {
+    indent = -Infinity;
+  }
+
+  var _getWhitespaceSymbols = getWhitespaceSymbols(options),
+      linebreak = _getWhitespaceSymbols.linebreak,
+      space = _getWhitespaceSymbols.space;
+
+  if (selector) indent++; // Apply fallbacks first.
+
+  if (fallbacks) {
+    // Array syntax {fallbacks: [{prop: value}]}
+    if (Array.isArray(fallbacks)) {
+      for (var index = 0; index < fallbacks.length; index++) {
+        var fallback = fallbacks[index];
+
+        for (var prop in fallback) {
+          var value = fallback[prop];
+
+          if (value != null) {
+            if (result) result += linebreak;
+            result += indentStr(prop + ":" + space + toCssValue(value) + ";", indent);
+          }
+        }
+      }
+    } else {
+      // Object syntax {fallbacks: {prop: value}}
+      for (var _prop in fallbacks) {
+        var _value = fallbacks[_prop];
+
+        if (_value != null) {
+          if (result) result += linebreak;
+          result += indentStr(_prop + ":" + space + toCssValue(_value) + ";", indent);
+        }
+      }
+    }
+  }
+
+  for (var _prop2 in style) {
+    var _value2 = style[_prop2];
+
+    if (_value2 != null && _prop2 !== 'fallbacks') {
+      if (result) result += linebreak;
+      result += indentStr(_prop2 + ":" + space + toCssValue(_value2) + ";", indent);
+    }
+  } // Allow empty style in this case, because properties will be added dynamically.
+
+
+  if (!result && !options.allowEmpty) return result; // When rule is being stringified before selector was defined.
+
+  if (!selector) return result;
+  indent--;
+  if (result) result = "" + linebreak + result + linebreak;
+  return indentStr("" + selector + space + "{" + result, indent) + indentStr('}', indent);
+}
+
+var escapeRegex = /([[\].#*$><+~=|^:(),"'`\s])/g;
+var nativeEscape = typeof CSS !== 'undefined' && CSS.escape;
+var escape = (function (str) {
+  return nativeEscape ? nativeEscape(str) : str.replace(escapeRegex, '\\$1');
+});
+
+var BaseStyleRule =
+/*#__PURE__*/
+function () {
+  function BaseStyleRule(key, style, options) {
+    this.type = 'style';
+    this.isProcessed = false;
+    var sheet = options.sheet,
+        Renderer = options.Renderer;
+    this.key = key;
+    this.options = options;
+    this.style = style;
+    if (sheet) this.renderer = sheet.renderer;else if (Renderer) this.renderer = new Renderer();
+  }
+  /**
+   * Get or set a style property.
+   */
+
+
+  var _proto = BaseStyleRule.prototype;
+
+  _proto.prop = function prop(name, value, options) {
+    // It's a getter.
+    if (value === undefined) return this.style[name]; // Don't do anything if the value has not changed.
+
+    var force = options ? options.force : false;
+    if (!force && this.style[name] === value) return this;
+    var newValue = value;
+
+    if (!options || options.process !== false) {
+      newValue = this.options.jss.plugins.onChangeValue(value, name, this);
+    }
+
+    var isEmpty = newValue == null || newValue === false;
+    var isDefined = name in this.style; // Value is empty and wasn't defined before.
+
+    if (isEmpty && !isDefined && !force) return this; // We are going to remove this value.
+
+    var remove = isEmpty && isDefined;
+    if (remove) delete this.style[name];else this.style[name] = newValue; // Renderable is defined if StyleSheet option `link` is true.
+
+    if (this.renderable && this.renderer) {
+      if (remove) this.renderer.removeProperty(this.renderable, name);else this.renderer.setProperty(this.renderable, name, newValue);
+      return this;
+    }
+
+    var sheet = this.options.sheet;
+
+    if (sheet && sheet.attached) {
+      process.env.NODE_ENV !== "production" ? warning(false, '[JSS] Rule is not linked. Missing sheet option "link: true".') : void 0;
+    }
+
+    return this;
+  };
+
+  return BaseStyleRule;
+}();
+var StyleRule =
+/*#__PURE__*/
+function (_BaseStyleRule) {
+  _inheritsLoose(StyleRule, _BaseStyleRule);
+
+  function StyleRule(key, style, options) {
+    var _this;
+
+    _this = _BaseStyleRule.call(this, key, style, options) || this;
+    var selector = options.selector,
+        scoped = options.scoped,
+        sheet = options.sheet,
+        generateId = options.generateId;
+
+    if (selector) {
+      _this.selectorText = selector;
+    } else if (scoped !== false) {
+      _this.id = generateId(_assertThisInitialized(_assertThisInitialized(_this)), sheet);
+      _this.selectorText = "." + escape(_this.id);
+    }
+
+    return _this;
+  }
+  /**
+   * Set selector string.
+   * Attention: use this with caution. Most browsers didn't implement
+   * selectorText setter, so this may result in rerendering of entire Style Sheet.
+   */
+
+
+  var _proto2 = StyleRule.prototype;
+
+  /**
+   * Apply rule to an element inline.
+   */
+  _proto2.applyTo = function applyTo(renderable) {
+    var renderer = this.renderer;
+
+    if (renderer) {
+      var json = this.toJSON();
+
+      for (var prop in json) {
+        renderer.setProperty(renderable, prop, json[prop]);
+      }
+    }
+
+    return this;
+  }
+  /**
+   * Returns JSON representation of the rule.
+   * Fallbacks are not supported.
+   * Useful for inline styles.
+   */
+  ;
+
+  _proto2.toJSON = function toJSON() {
+    var json = {};
+
+    for (var prop in this.style) {
+      var value = this.style[prop];
+      if (typeof value !== 'object') json[prop] = value;else if (Array.isArray(value)) json[prop] = toCssValue(value);
+    }
+
+    return json;
+  }
+  /**
+   * Generates a CSS string.
+   */
+  ;
+
+  _proto2.toString = function toString(options) {
+    var sheet = this.options.sheet;
+    var link = sheet ? sheet.options.link : false;
+    var opts = link ? _extends({}, options, {
+      allowEmpty: true
+    }) : options;
+    return toCss(this.selectorText, this.style, opts);
+  };
+
+  _createClass(StyleRule, [{
+    key: "selector",
+    set: function set(selector) {
+      if (selector === this.selectorText) return;
+      this.selectorText = selector;
+      var renderer = this.renderer,
+          renderable = this.renderable;
+      if (!renderable || !renderer) return;
+      var hasChanged = renderer.setSelector(renderable, selector); // If selector setter is not implemented, rerender the rule.
+
+      if (!hasChanged) {
+        renderer.replaceRule(renderable, this);
+      }
+    }
+    /**
+     * Get selector string.
+     */
+    ,
+    get: function get() {
+      return this.selectorText;
+    }
+  }]);
+
+  return StyleRule;
+}(BaseStyleRule);
+var pluginStyleRule = {
+  onCreateRule: function onCreateRule(key, style, options) {
+    if (key[0] === '@' || options.parent && options.parent.type === 'keyframes') {
+      return null;
+    }
+
+    return new StyleRule(key, style, options);
+  }
+};
+
+var defaultToStringOptions = {
+  indent: 1,
+  children: true
+};
+var atRegExp = /@([\w-]+)/;
+/**
+ * Conditional rule for @media, @supports
+ */
+
+var ConditionalRule =
+/*#__PURE__*/
+function () {
+  function ConditionalRule(key, styles, options) {
+    this.type = 'conditional';
+    this.isProcessed = false;
+    this.key = key;
+    var atMatch = key.match(atRegExp);
+    this.at = atMatch ? atMatch[1] : 'unknown'; // Key might contain a unique suffix in case the `name` passed by user was duplicate.
+
+    this.query = options.name || "@" + this.at;
+    this.options = options;
+    this.rules = new RuleList(_extends({}, options, {
+      parent: this
+    }));
+
+    for (var name in styles) {
+      this.rules.add(name, styles[name]);
+    }
+
+    this.rules.process();
+  }
+  /**
+   * Get a rule.
+   */
+
+
+  var _proto = ConditionalRule.prototype;
+
+  _proto.getRule = function getRule(name) {
+    return this.rules.get(name);
+  }
+  /**
+   * Get index of a rule.
+   */
+  ;
+
+  _proto.indexOf = function indexOf(rule) {
+    return this.rules.indexOf(rule);
+  }
+  /**
+   * Create and register rule, run plugins.
+   */
+  ;
+
+  _proto.addRule = function addRule(name, style, options) {
+    var rule = this.rules.add(name, style, options);
+    if (!rule) return null;
+    this.options.jss.plugins.onProcessRule(rule);
+    return rule;
+  }
+  /**
+   * Replace rule, run plugins.
+   */
+  ;
+
+  _proto.replaceRule = function replaceRule(name, style, options) {
+    var newRule = this.rules.replace(name, style, options);
+    if (newRule) this.options.jss.plugins.onProcessRule(newRule);
+    return newRule;
+  }
+  /**
+   * Generates a CSS string.
+   */
+  ;
+
+  _proto.toString = function toString(options) {
+    if (options === void 0) {
+      options = defaultToStringOptions;
+    }
+
+    var _getWhitespaceSymbols = getWhitespaceSymbols(options),
+        linebreak = _getWhitespaceSymbols.linebreak;
+
+    if (options.indent == null) options.indent = defaultToStringOptions.indent;
+    if (options.children == null) options.children = defaultToStringOptions.children;
+
+    if (options.children === false) {
+      return this.query + " {}";
+    }
+
+    var children = this.rules.toString(options);
+    return children ? this.query + " {" + linebreak + children + linebreak + "}" : '';
+  };
+
+  return ConditionalRule;
+}();
+var keyRegExp = /@container|@media|@supports\s+/;
+var pluginConditionalRule = {
+  onCreateRule: function onCreateRule(key, styles, options) {
+    return keyRegExp.test(key) ? new ConditionalRule(key, styles, options) : null;
+  }
+};
+
+var defaultToStringOptions$1 = {
+  indent: 1,
+  children: true
+};
+var nameRegExp = /@keyframes\s+([\w-]+)/;
+/**
+ * Rule for @keyframes
+ */
+
+var KeyframesRule =
+/*#__PURE__*/
+function () {
+  function KeyframesRule(key, frames, options) {
+    this.type = 'keyframes';
+    this.at = '@keyframes';
+    this.isProcessed = false;
+    var nameMatch = key.match(nameRegExp);
+
+    if (nameMatch && nameMatch[1]) {
+      this.name = nameMatch[1];
+    } else {
+      this.name = 'noname';
+      process.env.NODE_ENV !== "production" ? warning(false, "[JSS] Bad keyframes name " + key) : void 0;
+    }
+
+    this.key = this.type + "-" + this.name;
+    this.options = options;
+    var scoped = options.scoped,
+        sheet = options.sheet,
+        generateId = options.generateId;
+    this.id = scoped === false ? this.name : escape(generateId(this, sheet));
+    this.rules = new RuleList(_extends({}, options, {
+      parent: this
+    }));
+
+    for (var name in frames) {
+      this.rules.add(name, frames[name], _extends({}, options, {
+        parent: this
+      }));
+    }
+
+    this.rules.process();
+  }
+  /**
+   * Generates a CSS string.
+   */
+
+
+  var _proto = KeyframesRule.prototype;
+
+  _proto.toString = function toString(options) {
+    if (options === void 0) {
+      options = defaultToStringOptions$1;
+    }
+
+    var _getWhitespaceSymbols = getWhitespaceSymbols(options),
+        linebreak = _getWhitespaceSymbols.linebreak;
+
+    if (options.indent == null) options.indent = defaultToStringOptions$1.indent;
+    if (options.children == null) options.children = defaultToStringOptions$1.children;
+
+    if (options.children === false) {
+      return this.at + " " + this.id + " {}";
+    }
+
+    var children = this.rules.toString(options);
+    if (children) children = "" + linebreak + children + linebreak;
+    return this.at + " " + this.id + " {" + children + "}";
+  };
+
+  return KeyframesRule;
+}();
+var keyRegExp$1 = /@keyframes\s+/;
+var refRegExp = /\$([\w-]+)/g;
+
+var findReferencedKeyframe = function findReferencedKeyframe(val, keyframes) {
+  if (typeof val === 'string') {
+    return val.replace(refRegExp, function (match, name) {
+      if (name in keyframes) {
+        return keyframes[name];
+      }
+
+      process.env.NODE_ENV !== "production" ? warning(false, "[JSS] Referenced keyframes rule \"" + name + "\" is not defined.") : void 0;
+      return match;
+    });
+  }
+
+  return val;
+};
+/**
+ * Replace the reference for a animation name.
+ */
+
+
+var replaceRef = function replaceRef(style, prop, keyframes) {
+  var value = style[prop];
+  var refKeyframe = findReferencedKeyframe(value, keyframes);
+
+  if (refKeyframe !== value) {
+    style[prop] = refKeyframe;
+  }
+};
+
+var pluginKeyframesRule = {
+  onCreateRule: function onCreateRule(key, frames, options) {
+    return typeof key === 'string' && keyRegExp$1.test(key) ? new KeyframesRule(key, frames, options) : null;
+  },
+  // Animation name ref replacer.
+  onProcessStyle: function onProcessStyle(style, rule, sheet) {
+    if (rule.type !== 'style' || !sheet) return style;
+    if ('animation-name' in style) replaceRef(style, 'animation-name', sheet.keyframes);
+    if ('animation' in style) replaceRef(style, 'animation', sheet.keyframes);
+    return style;
+  },
+  onChangeValue: function onChangeValue(val, prop, rule) {
+    var sheet = rule.options.sheet;
+
+    if (!sheet) {
+      return val;
+    }
+
+    switch (prop) {
+      case 'animation':
+        return findReferencedKeyframe(val, sheet.keyframes);
+
+      case 'animation-name':
+        return findReferencedKeyframe(val, sheet.keyframes);
+
+      default:
+        return val;
+    }
+  }
+};
+
+var KeyframeRule =
+/*#__PURE__*/
+function (_BaseStyleRule) {
+  _inheritsLoose(KeyframeRule, _BaseStyleRule);
+
+  function KeyframeRule() {
+    return _BaseStyleRule.apply(this, arguments) || this;
+  }
+
+  var _proto = KeyframeRule.prototype;
+
+  /**
+   * Generates a CSS string.
+   */
+  _proto.toString = function toString(options) {
+    var sheet = this.options.sheet;
+    var link = sheet ? sheet.options.link : false;
+    var opts = link ? _extends({}, options, {
+      allowEmpty: true
+    }) : options;
+    return toCss(this.key, this.style, opts);
+  };
+
+  return KeyframeRule;
+}(BaseStyleRule);
+var pluginKeyframeRule = {
+  onCreateRule: function onCreateRule(key, style, options) {
+    if (options.parent && options.parent.type === 'keyframes') {
+      return new KeyframeRule(key, style, options);
+    }
+
+    return null;
+  }
+};
+
+var FontFaceRule =
+/*#__PURE__*/
+function () {
+  function FontFaceRule(key, style, options) {
+    this.type = 'font-face';
+    this.at = '@font-face';
+    this.isProcessed = false;
+    this.key = key;
+    this.style = style;
+    this.options = options;
+  }
+  /**
+   * Generates a CSS string.
+   */
+
+
+  var _proto = FontFaceRule.prototype;
+
+  _proto.toString = function toString(options) {
+    var _getWhitespaceSymbols = getWhitespaceSymbols(options),
+        linebreak = _getWhitespaceSymbols.linebreak;
+
+    if (Array.isArray(this.style)) {
+      var str = '';
+
+      for (var index = 0; index < this.style.length; index++) {
+        str += toCss(this.at, this.style[index]);
+        if (this.style[index + 1]) str += linebreak;
+      }
+
+      return str;
+    }
+
+    return toCss(this.at, this.style, options);
+  };
+
+  return FontFaceRule;
+}();
+var keyRegExp$2 = /@font-face/;
+var pluginFontFaceRule = {
+  onCreateRule: function onCreateRule(key, style, options) {
+    return keyRegExp$2.test(key) ? new FontFaceRule(key, style, options) : null;
+  }
+};
+
+var ViewportRule =
+/*#__PURE__*/
+function () {
+  function ViewportRule(key, style, options) {
+    this.type = 'viewport';
+    this.at = '@viewport';
+    this.isProcessed = false;
+    this.key = key;
+    this.style = style;
+    this.options = options;
+  }
+  /**
+   * Generates a CSS string.
+   */
+
+
+  var _proto = ViewportRule.prototype;
+
+  _proto.toString = function toString(options) {
+    return toCss(this.key, this.style, options);
+  };
+
+  return ViewportRule;
+}();
+var pluginViewportRule = {
+  onCreateRule: function onCreateRule(key, style, options) {
+    return key === '@viewport' || key === '@-ms-viewport' ? new ViewportRule(key, style, options) : null;
+  }
+};
+
+var SimpleRule =
+/*#__PURE__*/
+function () {
+  function SimpleRule(key, value, options) {
+    this.type = 'simple';
+    this.isProcessed = false;
+    this.key = key;
+    this.value = value;
+    this.options = options;
+  }
+  /**
+   * Generates a CSS string.
+   */
+  // eslint-disable-next-line no-unused-vars
+
+
+  var _proto = SimpleRule.prototype;
+
+  _proto.toString = function toString(options) {
+    if (Array.isArray(this.value)) {
+      var str = '';
+
+      for (var index = 0; index < this.value.length; index++) {
+        str += this.key + " " + this.value[index] + ";";
+        if (this.value[index + 1]) str += '\n';
+      }
+
+      return str;
+    }
+
+    return this.key + " " + this.value + ";";
+  };
+
+  return SimpleRule;
+}();
+var keysMap = {
+  '@charset': true,
+  '@import': true,
+  '@namespace': true
+};
+var pluginSimpleRule = {
+  onCreateRule: function onCreateRule(key, value, options) {
+    return key in keysMap ? new SimpleRule(key, value, options) : null;
+  }
+};
+
+var plugins = [pluginStyleRule, pluginConditionalRule, pluginKeyframesRule, pluginKeyframeRule, pluginFontFaceRule, pluginViewportRule, pluginSimpleRule];
+
+var defaultUpdateOptions = {
+  process: true
+};
+var forceUpdateOptions = {
+  force: true,
+  process: true
+  /**
+   * Contains rules objects and allows adding/removing etc.
+   * Is used for e.g. by `StyleSheet` or `ConditionalRule`.
+   */
+
+};
+
+var RuleList =
+/*#__PURE__*/
+function () {
+  // Rules registry for access by .get() method.
+  // It contains the same rule registered by name and by selector.
+  // Original styles object.
+  // Used to ensure correct rules order.
+  function RuleList(options) {
+    this.map = {};
+    this.raw = {};
+    this.index = [];
+    this.counter = 0;
+    this.options = options;
+    this.classes = options.classes;
+    this.keyframes = options.keyframes;
+  }
+  /**
+   * Create and register rule.
+   *
+   * Will not render after Style Sheet was rendered the first time.
+   */
+
+
+  var _proto = RuleList.prototype;
+
+  _proto.add = function add(name, decl, ruleOptions) {
+    var _this$options = this.options,
+        parent = _this$options.parent,
+        sheet = _this$options.sheet,
+        jss = _this$options.jss,
+        Renderer = _this$options.Renderer,
+        generateId = _this$options.generateId,
+        scoped = _this$options.scoped;
+
+    var options = _extends({
+      classes: this.classes,
+      parent: parent,
+      sheet: sheet,
+      jss: jss,
+      Renderer: Renderer,
+      generateId: generateId,
+      scoped: scoped,
+      name: name,
+      keyframes: this.keyframes,
+      selector: undefined
+    }, ruleOptions); // When user uses .createStyleSheet(), duplicate names are not possible, but
+    // `sheet.addRule()` opens the door for any duplicate rule name. When this happens
+    // we need to make the key unique within this RuleList instance scope.
+
+
+    var key = name;
+
+    if (name in this.raw) {
+      key = name + "-d" + this.counter++;
+    } // We need to save the original decl before creating the rule
+    // because cache plugin needs to use it as a key to return a cached rule.
+
+
+    this.raw[key] = decl;
+
+    if (key in this.classes) {
+      // E.g. rules inside of @media container
+      options.selector = "." + escape(this.classes[key]);
+    }
+
+    var rule = createRule(key, decl, options);
+    if (!rule) return null;
+    this.register(rule);
+    var index = options.index === undefined ? this.index.length : options.index;
+    this.index.splice(index, 0, rule);
+    return rule;
+  }
+  /**
+   * Replace rule.
+   * Create a new rule and remove old one instead of overwriting
+   * because we want to invoke onCreateRule hook to make plugins work.
+   */
+  ;
+
+  _proto.replace = function replace(name, decl, ruleOptions) {
+    var oldRule = this.get(name);
+    var oldIndex = this.index.indexOf(oldRule);
+
+    if (oldRule) {
+      this.remove(oldRule);
+    }
+
+    var options = ruleOptions;
+    if (oldIndex !== -1) options = _extends({}, ruleOptions, {
+      index: oldIndex
+    });
+    return this.add(name, decl, options);
+  }
+  /**
+   * Get a rule by name or selector.
+   */
+  ;
+
+  _proto.get = function get(nameOrSelector) {
+    return this.map[nameOrSelector];
+  }
+  /**
+   * Delete a rule.
+   */
+  ;
+
+  _proto.remove = function remove(rule) {
+    this.unregister(rule);
+    delete this.raw[rule.key];
+    this.index.splice(this.index.indexOf(rule), 1);
+  }
+  /**
+   * Get index of a rule.
+   */
+  ;
+
+  _proto.indexOf = function indexOf(rule) {
+    return this.index.indexOf(rule);
+  }
+  /**
+   * Run `onProcessRule()` plugins on every rule.
+   */
+  ;
+
+  _proto.process = function process() {
+    var plugins = this.options.jss.plugins; // We need to clone array because if we modify the index somewhere else during a loop
+    // we end up with very hard-to-track-down side effects.
+
+    this.index.slice(0).forEach(plugins.onProcessRule, plugins);
+  }
+  /**
+   * Register a rule in `.map`, `.classes` and `.keyframes` maps.
+   */
+  ;
+
+  _proto.register = function register(rule) {
+    this.map[rule.key] = rule;
+
+    if (rule instanceof StyleRule) {
+      this.map[rule.selector] = rule;
+      if (rule.id) this.classes[rule.key] = rule.id;
+    } else if (rule instanceof KeyframesRule && this.keyframes) {
+      this.keyframes[rule.name] = rule.id;
+    }
+  }
+  /**
+   * Unregister a rule.
+   */
+  ;
+
+  _proto.unregister = function unregister(rule) {
+    delete this.map[rule.key];
+
+    if (rule instanceof StyleRule) {
+      delete this.map[rule.selector];
+      delete this.classes[rule.key];
+    } else if (rule instanceof KeyframesRule) {
+      delete this.keyframes[rule.name];
+    }
+  }
+  /**
+   * Update the function values with a new data.
+   */
+  ;
+
+  _proto.update = function update() {
+    var name;
+    var data;
+    var options;
+
+    if (typeof (arguments.length <= 0 ? undefined : arguments[0]) === 'string') {
+      name = arguments.length <= 0 ? undefined : arguments[0];
+      data = arguments.length <= 1 ? undefined : arguments[1];
+      options = arguments.length <= 2 ? undefined : arguments[2];
+    } else {
+      data = arguments.length <= 0 ? undefined : arguments[0];
+      options = arguments.length <= 1 ? undefined : arguments[1];
+      name = null;
+    }
+
+    if (name) {
+      this.updateOne(this.get(name), data, options);
+    } else {
+      for (var index = 0; index < this.index.length; index++) {
+        this.updateOne(this.index[index], data, options);
+      }
+    }
+  }
+  /**
+   * Execute plugins, update rule props.
+   */
+  ;
+
+  _proto.updateOne = function updateOne(rule, data, options) {
+    if (options === void 0) {
+      options = defaultUpdateOptions;
+    }
+
+    var _this$options2 = this.options,
+        plugins = _this$options2.jss.plugins,
+        sheet = _this$options2.sheet; // It is a rules container like for e.g. ConditionalRule.
+
+    if (rule.rules instanceof RuleList) {
+      rule.rules.update(data, options);
+      return;
+    }
+
+    var style = rule.style;
+    plugins.onUpdate(data, rule, sheet, options); // We rely on a new `style` ref in case it was mutated during onUpdate hook.
+
+    if (options.process && style && style !== rule.style) {
+      // We need to run the plugins in case new `style` relies on syntax plugins.
+      plugins.onProcessStyle(rule.style, rule, sheet); // Update and add props.
+
+      for (var prop in rule.style) {
+        var nextValue = rule.style[prop];
+        var prevValue = style[prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.
+        // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here.
+
+        if (nextValue !== prevValue) {
+          rule.prop(prop, nextValue, forceUpdateOptions);
+        }
+      } // Remove props.
+
+
+      for (var _prop in style) {
+        var _nextValue = rule.style[_prop];
+        var _prevValue = style[_prop]; // We need to use `force: true` because `rule.style` has been updated during onUpdate hook, so `rule.prop()` will not update the CSSOM rule.
+        // We do this comparison to avoid unneeded `rule.prop()` calls, since we have the old `style` object here.
+
+        if (_nextValue == null && _nextValue !== _prevValue) {
+          rule.prop(_prop, null, forceUpdateOptions);
+        }
+      }
+    }
+  }
+  /**
+   * Convert rules to a CSS string.
+   */
+  ;
+
+  _proto.toString = function toString(options) {
+    var str = '';
+    var sheet = this.options.sheet;
+    var link = sheet ? sheet.options.link : false;
+
+    var _getWhitespaceSymbols = getWhitespaceSymbols(options),
+        linebreak = _getWhitespaceSymbols.linebreak;
+
+    for (var index = 0; index < this.index.length; index++) {
+      var rule = this.index[index];
+      var css = rule.toString(options); // No need to render an empty rule.
+
+      if (!css && !link) continue;
+      if (str) str += linebreak;
+      str += css;
+    }
+
+    return str;
+  };
+
+  return RuleList;
+}();
+
+var StyleSheet =
+/*#__PURE__*/
+function () {
+  function StyleSheet(styles, options) {
+    this.attached = false;
+    this.deployed = false;
+    this.classes = {};
+    this.keyframes = {};
+    this.options = _extends({}, options, {
+      sheet: this,
+      parent: this,
+      classes: this.classes,
+      keyframes: this.keyframes
+    });
+
+    if (options.Renderer) {
+      this.renderer = new options.Renderer(this);
+    }
+
+    this.rules = new RuleList(this.options);
+
+    for (var name in styles) {
+      this.rules.add(name, styles[name]);
+    }
+
+    this.rules.process();
+  }
+  /**
+   * Attach renderable to the render tree.
+   */
+
+
+  var _proto = StyleSheet.prototype;
+
+  _proto.attach = function attach() {
+    if (this.attached) return this;
+    if (this.renderer) this.renderer.attach();
+    this.attached = true; // Order is important, because we can't use insertRule API if style element is not attached.
+
+    if (!this.deployed) this.deploy();
+    return this;
+  }
+  /**
+   * Remove renderable from render tree.
+   */
+  ;
+
+  _proto.detach = function detach() {
+    if (!this.attached) return this;
+    if (this.renderer) this.renderer.detach();
+    this.attached = false;
+    return this;
+  }
+  /**
+   * Add a rule to the current stylesheet.
+   * Will insert a rule also after the stylesheet has been rendered first time.
+   */
+  ;
+
+  _proto.addRule = function addRule(name, decl, options) {
+    var queue = this.queue; // Plugins can create rules.
+    // In order to preserve the right order, we need to queue all `.addRule` calls,
+    // which happen after the first `rules.add()` call.
+
+    if (this.attached && !queue) this.queue = [];
+    var rule = this.rules.add(name, decl, options);
+    if (!rule) return null;
+    this.options.jss.plugins.onProcessRule(rule);
+
+    if (this.attached) {
+      if (!this.deployed) return rule; // Don't insert rule directly if there is no stringified version yet.
+      // It will be inserted all together when .attach is called.
+
+      if (queue) queue.push(rule);else {
+        this.insertRule(rule);
+
+        if (this.queue) {
+          this.queue.forEach(this.insertRule, this);
+          this.queue = undefined;
+        }
+      }
+      return rule;
+    } // We can't add rules to a detached style node.
+    // We will redeploy the sheet once user will attach it.
+
+
+    this.deployed = false;
+    return rule;
+  }
+  /**
+   * Replace a rule in the current stylesheet.
+   */
+  ;
+
+  _proto.replaceRule = function replaceRule(nameOrSelector, decl, options) {
+    var oldRule = this.rules.get(nameOrSelector);
+    if (!oldRule) return this.addRule(nameOrSelector, decl, options);
+    var newRule = this.rules.replace(nameOrSelector, decl, options);
+
+    if (newRule) {
+      this.options.jss.plugins.onProcessRule(newRule);
+    }
+
+    if (this.attached) {
+      if (!this.deployed) return newRule; // Don't replace / delete rule directly if there is no stringified version yet.
+      // It will be inserted all together when .attach is called.
+
+      if (this.renderer) {
+        if (!newRule) {
+          this.renderer.deleteRule(oldRule);
+        } else if (oldRule.renderable) {
+          this.renderer.replaceRule(oldRule.renderable, newRule);
+        }
+      }
+
+      return newRule;
+    } // We can't replace rules to a detached style node.
+    // We will redeploy the sheet once user will attach it.
+
+
+    this.deployed = false;
+    return newRule;
+  }
+  /**
+   * Insert rule into the StyleSheet
+   */
+  ;
+
+  _proto.insertRule = function insertRule(rule) {
+    if (this.renderer) {
+      this.renderer.insertRule(rule);
+    }
+  }
+  /**
+   * Create and add rules.
+   * Will render also after Style Sheet was rendered the first time.
+   */
+  ;
+
+  _proto.addRules = function addRules(styles, options) {
+    var added = [];
+
+    for (var name in styles) {
+      var rule = this.addRule(name, styles[name], options);
+      if (rule) added.push(rule);
+    }
+
+    return added;
+  }
+  /**
+   * Get a rule by name or selector.
+   */
+  ;
+
+  _proto.getRule = function getRule(nameOrSelector) {
+    return this.rules.get(nameOrSelector);
+  }
+  /**
+   * Delete a rule by name.
+   * Returns `true`: if rule has been deleted from the DOM.
+   */
+  ;
+
+  _proto.deleteRule = function deleteRule(name) {
+    var rule = typeof name === 'object' ? name : this.rules.get(name);
+
+    if (!rule || // Style sheet was created without link: true and attached, in this case we
+    // won't be able to remove the CSS rule from the DOM.
+    this.attached && !rule.renderable) {
+      return false;
+    }
+
+    this.rules.remove(rule);
+
+    if (this.attached && rule.renderable && this.renderer) {
+      return this.renderer.deleteRule(rule.renderable);
+    }
+
+    return true;
+  }
+  /**
+   * Get index of a rule.
+   */
+  ;
+
+  _proto.indexOf = function indexOf(rule) {
+    return this.rules.indexOf(rule);
+  }
+  /**
+   * Deploy pure CSS string to a renderable.
+   */
+  ;
+
+  _proto.deploy = function deploy() {
+    if (this.renderer) this.renderer.deploy();
+    this.deployed = true;
+    return this;
+  }
+  /**
+   * Update the function values with a new data.
+   */
+  ;
+
+  _proto.update = function update() {
+    var _this$rules;
+
+    (_this$rules = this.rules).update.apply(_this$rules, arguments);
+
+    return this;
+  }
+  /**
+   * Updates a single rule.
+   */
+  ;
+
+  _proto.updateOne = function updateOne(rule, data, options) {
+    this.rules.updateOne(rule, data, options);
+    return this;
+  }
+  /**
+   * Convert rules to a CSS string.
+   */
+  ;
+
+  _proto.toString = function toString(options) {
+    return this.rules.toString(options);
+  };
+
+  return StyleSheet;
+}();
+
+var PluginsRegistry =
+/*#__PURE__*/
+function () {
+  function PluginsRegistry() {
+    this.plugins = {
+      internal: [],
+      external: []
+    };
+    this.registry = {};
+  }
+
+  var _proto = PluginsRegistry.prototype;
+
+  /**
+   * Call `onCreateRule` hooks and return an object if returned by a hook.
+   */
+  _proto.onCreateRule = function onCreateRule(name, decl, options) {
+    for (var i = 0; i < this.registry.onCreateRule.length; i++) {
+      var rule = this.registry.onCreateRule[i](name, decl, options);
+      if (rule) return rule;
+    }
+
+    return null;
+  }
+  /**
+   * Call `onProcessRule` hooks.
+   */
+  ;
+
+  _proto.onProcessRule = function onProcessRule(rule) {
+    if (rule.isProcessed) return;
+    var sheet = rule.options.sheet;
+
+    for (var i = 0; i < this.registry.onProcessRule.length; i++) {
+      this.registry.onProcessRule[i](rule, sheet);
+    }
+
+    if (rule.style) this.onProcessStyle(rule.style, rule, sheet);
+    rule.isProcessed = true;
+  }
+  /**
+   * Call `onProcessStyle` hooks.
+   */
+  ;
+
+  _proto.onProcessStyle = function onProcessStyle(style, rule, sheet) {
+    for (var i = 0; i < this.registry.onProcessStyle.length; i++) {
+      rule.style = this.registry.onProcessStyle[i](rule.style, rule, sheet);
+    }
+  }
+  /**
+   * Call `onProcessSheet` hooks.
+   */
+  ;
+
+  _proto.onProcessSheet = function onProcessSheet(sheet) {
+    for (var i = 0; i < this.registry.onProcessSheet.length; i++) {
+      this.registry.onProcessSheet[i](sheet);
+    }
+  }
+  /**
+   * Call `onUpdate` hooks.
+   */
+  ;
+
+  _proto.onUpdate = function onUpdate(data, rule, sheet, options) {
+    for (var i = 0; i < this.registry.onUpdate.length; i++) {
+      this.registry.onUpdate[i](data, rule, sheet, options);
+    }
+  }
+  /**
+   * Call `onChangeValue` hooks.
+   */
+  ;
+
+  _proto.onChangeValue = function onChangeValue(value, prop, rule) {
+    var processedValue = value;
+
+    for (var i = 0; i < this.registry.onChangeValue.length; i++) {
+      processedValue = this.registry.onChangeValue[i](processedValue, prop, rule);
+    }
+
+    return processedValue;
+  }
+  /**
+   * Register a plugin.
+   */
+  ;
+
+  _proto.use = function use(newPlugin, options) {
+    if (options === void 0) {
+      options = {
+        queue: 'external'
+      };
+    }
+
+    var plugins = this.plugins[options.queue]; // Avoids applying same plugin twice, at least based on ref.
+
+    if (plugins.indexOf(newPlugin) !== -1) {
+      return;
+    }
+
+    plugins.push(newPlugin);
+    this.registry = [].concat(this.plugins.external, this.plugins.internal).reduce(function (registry, plugin) {
+      for (var name in plugin) {
+        if (name in registry) {
+          registry[name].push(plugin[name]);
+        } else {
+          process.env.NODE_ENV !== "production" ? warning(false, "[JSS] Unknown hook \"" + name + "\".") : void 0;
+        }
+      }
+
+      return registry;
+    }, {
+      onCreateRule: [],
+      onProcessRule: [],
+      onProcessStyle: [],
+      onProcessSheet: [],
+      onChangeValue: [],
+      onUpdate: []
+    });
+  };
+
+  return PluginsRegistry;
+}();
+
+/**
+ * Sheets registry to access all instances in one place.
+ */
+
+var SheetsRegistry =
+/*#__PURE__*/
+function () {
+  function SheetsRegistry() {
+    this.registry = [];
+  }
+
+  var _proto = SheetsRegistry.prototype;
+
+  /**
+   * Register a Style Sheet.
+   */
+  _proto.add = function add(sheet) {
+    var registry = this.registry;
+    var index = sheet.options.index;
+    if (registry.indexOf(sheet) !== -1) return;
+
+    if (registry.length === 0 || index >= this.index) {
+      registry.push(sheet);
+      return;
+    } // Find a position.
+
+
+    for (var i = 0; i < registry.length; i++) {
+      if (registry[i].options.index > index) {
+        registry.splice(i, 0, sheet);
+        return;
+      }
+    }
+  }
+  /**
+   * Reset the registry.
+   */
+  ;
+
+  _proto.reset = function reset() {
+    this.registry = [];
+  }
+  /**
+   * Remove a Style Sheet.
+   */
+  ;
+
+  _proto.remove = function remove(sheet) {
+    var index = this.registry.indexOf(sheet);
+    this.registry.splice(index, 1);
+  }
+  /**
+   * Convert all attached sheets to a CSS string.
+   */
+  ;
+
+  _proto.toString = function toString(_temp) {
+    var _ref = _temp === void 0 ? {} : _temp,
+        attached = _ref.attached,
+        options = _objectWithoutPropertiesLoose(_ref, ["attached"]);
+
+    var _getWhitespaceSymbols = getWhitespaceSymbols(options),
+        linebreak = _getWhitespaceSymbols.linebreak;
+
+    var css = '';
+
+    for (var i = 0; i < this.registry.length; i++) {
+      var sheet = this.registry[i];
+
+      if (attached != null && sheet.attached !== attached) {
+        continue;
+      }
+
+      if (css) css += linebreak;
+      css += sheet.toString(options);
+    }
+
+    return css;
+  };
+
+  _createClass(SheetsRegistry, [{
+    key: "index",
+
+    /**
+     * Current highest index number.
+     */
+    get: function get() {
+      return this.registry.length === 0 ? 0 : this.registry[this.registry.length - 1].options.index;
+    }
+  }]);
+
+  return SheetsRegistry;
+}();
+
+/**
+ * This is a global sheets registry. Only DomRenderer will add sheets to it.
+ * On the server one should use an own SheetsRegistry instance and add the
+ * sheets to it, because you need to make sure to create a new registry for
+ * each request in order to not leak sheets across requests.
+ */
+
+var sheets = new SheetsRegistry();
+
+/* eslint-disable */
+
+/**
+ * Now that `globalThis` is available on most platforms
+ * (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/globalThis#browser_compatibility)
+ * we check for `globalThis` first. `globalThis` is necessary for jss
+ * to run in Agoric's secure version of JavaScript (SES). Under SES,
+ * `globalThis` exists, but `window`, `self`, and `Function('return
+ * this')()` are all undefined for security reasons.
+ *
+ * https://github.com/zloirock/core-js/issues/86#issuecomment-115759028
+ */
+var globalThis$1 = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' && window.Math === Math ? window : typeof self !== 'undefined' && self.Math === Math ? self : Function('return this')();
+
+var ns = '2f1acc6c3a606b082e5eef5e54414ffb';
+if (globalThis$1[ns] == null) globalThis$1[ns] = 0; // Bundle may contain multiple JSS versions at the same time. In order to identify
+// the current version with just one short number and use it for classes generation
+// we use a counter. Also it is more accurate, because user can manually reevaluate
+// the module.
+
+var moduleId = globalThis$1[ns]++;
+
+var maxRules = 1e10;
+/**
+ * Returns a function which generates unique class names based on counters.
+ * When new generator function is created, rule counter is reseted.
+ * We need to reset the rule counter for SSR for each request.
+ */
+
+var createGenerateId = function createGenerateId(options) {
+  if (options === void 0) {
+    options = {};
+  }
+
+  var ruleCounter = 0;
+
+  var generateId = function generateId(rule, sheet) {
+    ruleCounter += 1;
+
+    if (ruleCounter > maxRules) {
+      process.env.NODE_ENV !== "production" ? warning(false, "[JSS] You might have a memory leak. Rule counter is at " + ruleCounter + ".") : void 0;
+    }
+
+    var jssId = '';
+    var prefix = '';
+
+    if (sheet) {
+      if (sheet.options.classNamePrefix) {
+        prefix = sheet.options.classNamePrefix;
+      }
+
+      if (sheet.options.jss.id != null) {
+        jssId = String(sheet.options.jss.id);
+      }
+    }
+
+    if (options.minify) {
+      // Using "c" because a number can't be the first char in a class name.
+      return "" + (prefix || 'c') + moduleId + jssId + ruleCounter;
+    }
+
+    return prefix + rule.key + "-" + moduleId + (jssId ? "-" + jssId : '') + "-" + ruleCounter;
+  };
+
+  return generateId;
+};
+
+/**
+ * Cache the value from the first time a function is called.
+ */
+
+var memoize = function memoize(fn) {
+  var value;
+  return function () {
+    if (!value) value = fn();
+    return value;
+  };
+};
+/**
+ * Get a style property value.
+ */
+
+
+var getPropertyValue = function getPropertyValue(cssRule, prop) {
+  try {
+    // Support CSSTOM.
+    if (cssRule.attributeStyleMap) {
+      return cssRule.attributeStyleMap.get(prop);
+    }
+
+    return cssRule.style.getPropertyValue(prop);
+  } catch (err) {
+    // IE may throw if property is unknown.
+    return '';
+  }
+};
+/**
+ * Set a style property.
+ */
+
+
+var setProperty = function setProperty(cssRule, prop, value) {
+  try {
+    var cssValue = value;
+
+    if (Array.isArray(value)) {
+      cssValue = toCssValue(value);
+    } // Support CSSTOM.
+
+
+    if (cssRule.attributeStyleMap) {
+      cssRule.attributeStyleMap.set(prop, cssValue);
+    } else {
+      var indexOfImportantFlag = cssValue ? cssValue.indexOf('!important') : -1;
+      var cssValueWithoutImportantFlag = indexOfImportantFlag > -1 ? cssValue.substr(0, indexOfImportantFlag - 1) : cssValue;
+      cssRule.style.setProperty(prop, cssValueWithoutImportantFlag, indexOfImportantFlag > -1 ? 'important' : '');
+    }
+  } catch (err) {
+    // IE may throw if property is unknown.
+    return false;
+  }
+
+  return true;
+};
+/**
+ * Remove a style property.
+ */
+
+
+var removeProperty = function removeProperty(cssRule, prop) {
+  try {
+    // Support CSSTOM.
+    if (cssRule.attributeStyleMap) {
+      cssRule.attributeStyleMap.delete(prop);
+    } else {
+      cssRule.style.removeProperty(prop);
+    }
+  } catch (err) {
+    process.env.NODE_ENV !== "production" ? warning(false, "[JSS] DOMException \"" + err.message + "\" was thrown. Tried to remove property \"" + prop + "\".") : void 0;
+  }
+};
+/**
+ * Set the selector.
+ */
+
+
+var setSelector = function setSelector(cssRule, selectorText) {
+  cssRule.selectorText = selectorText; // Return false if setter was not successful.
+  // Currently works in chrome only.
+
+  return cssRule.selectorText === selectorText;
+};
+/**
+ * Gets the `head` element upon the first call and caches it.
+ * We assume it can't be null.
+ */
+
+
+var getHead = memoize(function () {
+  return document.querySelector('head');
+});
+/**
+ * Find attached sheet with an index higher than the passed one.
+ */
+
+function findHigherSheet(registry, options) {
+  for (var i = 0; i < registry.length; i++) {
+    var sheet = registry[i];
+
+    if (sheet.attached && sheet.options.index > options.index && sheet.options.insertionPoint === options.insertionPoint) {
+      return sheet;
+    }
+  }
+
+  return null;
+}
+/**
+ * Find attached sheet with the highest index.
+ */
+
+
+function findHighestSheet(registry, options) {
+  for (var i = registry.length - 1; i >= 0; i--) {
+    var sheet = registry[i];
+
+    if (sheet.attached && sheet.options.insertionPoint === options.insertionPoint) {
+      return sheet;
+    }
+  }
+
+  return null;
+}
+/**
+ * Find a comment with "jss" inside.
+ */
+
+
+function findCommentNode(text) {
+  var head = getHead();
+
+  for (var i = 0; i < head.childNodes.length; i++) {
+    var node = head.childNodes[i];
+
+    if (node.nodeType === 8 && node.nodeValue.trim() === text) {
+      return node;
+    }
+  }
+
+  return null;
+}
+/**
+ * Find a node before which we can insert the sheet.
+ */
+
+
+function findPrevNode(options) {
+  var registry = sheets.registry;
+
+  if (registry.length > 0) {
+    // Try to insert before the next higher sheet.
+    var sheet = findHigherSheet(registry, options);
+
+    if (sheet && sheet.renderer) {
+      return {
+        parent: sheet.renderer.element.parentNode,
+        node: sheet.renderer.element
+      };
+    } // Otherwise insert after the last attached.
+
+
+    sheet = findHighestSheet(registry, options);
+
+    if (sheet && sheet.renderer) {
+      return {
+        parent: sheet.renderer.element.parentNode,
+        node: sheet.renderer.element.nextSibling
+      };
+    }
+  } // Try to find a comment placeholder if registry is empty.
+
+
+  var insertionPoint = options.insertionPoint;
+
+  if (insertionPoint && typeof insertionPoint === 'string') {
+    var comment = findCommentNode(insertionPoint);
+
+    if (comment) {
+      return {
+        parent: comment.parentNode,
+        node: comment.nextSibling
+      };
+    } // If user specifies an insertion point and it can't be found in the document -
+    // bad specificity issues may appear.
+
+
+    process.env.NODE_ENV !== "production" ? warning(false, "[JSS] Insertion point \"" + insertionPoint + "\" not found.") : void 0;
+  }
+
+  return false;
+}
+/**
+ * Insert style element into the DOM.
+ */
+
+
+function insertStyle(style, options) {
+  var insertionPoint = options.insertionPoint;
+  var nextNode = findPrevNode(options);
+
+  if (nextNode !== false && nextNode.parent) {
+    nextNode.parent.insertBefore(style, nextNode.node);
+    return;
+  } // Works with iframes and any node types.
+
+
+  if (insertionPoint && typeof insertionPoint.nodeType === 'number') {
+    var insertionPointElement = insertionPoint;
+    var parentNode = insertionPointElement.parentNode;
+    if (parentNode) parentNode.insertBefore(style, insertionPointElement.nextSibling);else process.env.NODE_ENV !== "production" ? warning(false, '[JSS] Insertion point is not in the DOM.') : void 0;
+    return;
+  }
+
+  getHead().appendChild(style);
+}
+/**
+ * Read jss nonce setting from the page if the user has set it.
+ */
+
+
+var getNonce = memoize(function () {
+  var node = document.querySelector('meta[property="csp-nonce"]');
+  return node ? node.getAttribute('content') : null;
+});
+
+var _insertRule = function insertRule(container, rule, index) {
+  try {
+    if ('insertRule' in container) {
+      container.insertRule(rule, index);
+    } // Keyframes rule.
+    else if ('appendRule' in container) {
+        container.appendRule(rule);
+      }
+  } catch (err) {
+    process.env.NODE_ENV !== "production" ? warning(false, "[JSS] " + err.message) : void 0;
+    return false;
+  }
+
+  return container.cssRules[index];
+};
+
+var getValidRuleInsertionIndex = function getValidRuleInsertionIndex(container, index) {
+  var maxIndex = container.cssRules.length; // In case previous insertion fails, passed index might be wrong
+
+  if (index === undefined || index > maxIndex) {
+    // eslint-disable-next-line no-param-reassign
+    return maxIndex;
+  }
+
+  return index;
+};
+
+var createStyle = function createStyle() {
+  var el = document.createElement('style'); // Without it, IE will have a broken source order specificity if we
+  // insert rules after we insert the style tag.
+  // It seems to kick-off the source order specificity algorithm.
+
+  el.textContent = '\n';
+  return el;
+};
+
+var DomRenderer =
+/*#__PURE__*/
+function () {
+  // Will be empty if link: true option is not set, because
+  // it is only for use together with insertRule API.
+  function DomRenderer(sheet) {
+    this.getPropertyValue = getPropertyValue;
+    this.setProperty = setProperty;
+    this.removeProperty = removeProperty;
+    this.setSelector = setSelector;
+    this.hasInsertedRules = false;
+    this.cssRules = [];
+    // There is no sheet when the renderer is used from a standalone StyleRule.
+    if (sheet) sheets.add(sheet);
+    this.sheet = sheet;
+
+    var _ref = this.sheet ? this.sheet.options : {},
+        media = _ref.media,
+        meta = _ref.meta,
+        element = _ref.element;
+
+    this.element = element || createStyle();
+    this.element.setAttribute('data-jss', '');
+    if (media) this.element.setAttribute('media', media);
+    if (meta) this.element.setAttribute('data-meta', meta);
+    var nonce = getNonce();
+    if (nonce) this.element.setAttribute('nonce', nonce);
+  }
+  /**
+   * Insert style element into render tree.
+   */
+
+
+  var _proto = DomRenderer.prototype;
+
+  _proto.attach = function attach() {
+    // In the case the element node is external and it is already in the DOM.
+    if (this.element.parentNode || !this.sheet) return;
+    insertStyle(this.element, this.sheet.options); // When rules are inserted using `insertRule` API, after `sheet.detach().attach()`
+    // most browsers create a new CSSStyleSheet, except of all IEs.
+
+    var deployed = Boolean(this.sheet && this.sheet.deployed);
+
+    if (this.hasInsertedRules && deployed) {
+      this.hasInsertedRules = false;
+      this.deploy();
+    }
+  }
+  /**
+   * Remove style element from render tree.
+   */
+  ;
+
+  _proto.detach = function detach() {
+    if (!this.sheet) return;
+    var parentNode = this.element.parentNode;
+    if (parentNode) parentNode.removeChild(this.element); // In the most browsers, rules inserted using insertRule() API will be lost when style element is removed.
+    // Though IE will keep them and we need a consistent behavior.
+
+    if (this.sheet.options.link) {
+      this.cssRules = [];
+      this.element.textContent = '\n';
+    }
+  }
+  /**
+   * Inject CSS string into element.
+   */
+  ;
+
+  _proto.deploy = function deploy() {
+    var sheet = this.sheet;
+    if (!sheet) return;
+
+    if (sheet.options.link) {
+      this.insertRules(sheet.rules);
+      return;
+    }
+
+    this.element.textContent = "\n" + sheet.toString() + "\n";
+  }
+  /**
+   * Insert RuleList into an element.
+   */
+  ;
+
+  _proto.insertRules = function insertRules(rules, nativeParent) {
+    for (var i = 0; i < rules.index.length; i++) {
+      this.insertRule(rules.index[i], i, nativeParent);
+    }
+  }
+  /**
+   * Insert a rule into element.
+   */
+  ;
+
+  _proto.insertRule = function insertRule(rule, index, nativeParent) {
+    if (nativeParent === void 0) {
+      nativeParent = this.element.sheet;
+    }
+
+    if (rule.rules) {
+      var parent = rule;
+      var latestNativeParent = nativeParent;
+
+      if (rule.type === 'conditional' || rule.type === 'keyframes') {
+        var _insertionIndex = getValidRuleInsertionIndex(nativeParent, index); // We need to render the container without children first.
+
+
+        latestNativeParent = _insertRule(nativeParent, parent.toString({
+          children: false
+        }), _insertionIndex);
+
+        if (latestNativeParent === false) {
+          return false;
+        }
+
+        this.refCssRule(rule, _insertionIndex, latestNativeParent);
+      }
+
+      this.insertRules(parent.rules, latestNativeParent);
+      return latestNativeParent;
+    }
+
+    var ruleStr = rule.toString();
+    if (!ruleStr) return false;
+    var insertionIndex = getValidRuleInsertionIndex(nativeParent, index);
+
+    var nativeRule = _insertRule(nativeParent, ruleStr, insertionIndex);
+
+    if (nativeRule === false) {
+      return false;
+    }
+
+    this.hasInsertedRules = true;
+    this.refCssRule(rule, insertionIndex, nativeRule);
+    return nativeRule;
+  };
+
+  _proto.refCssRule = function refCssRule(rule, index, cssRule) {
+    rule.renderable = cssRule; // We only want to reference the top level rules, deleteRule API doesn't support removing nested rules
+    // like rules inside media queries or keyframes
+
+    if (rule.options.parent instanceof StyleSheet) {
+      this.cssRules.splice(index, 0, cssRule);
+    }
+  }
+  /**
+   * Delete a rule.
+   */
+  ;
+
+  _proto.deleteRule = function deleteRule(cssRule) {
+    var sheet = this.element.sheet;
+    var index = this.indexOf(cssRule);
+    if (index === -1) return false;
+    sheet.deleteRule(index);
+    this.cssRules.splice(index, 1);
+    return true;
+  }
+  /**
+   * Get index of a CSS Rule.
+   */
+  ;
+
+  _proto.indexOf = function indexOf(cssRule) {
+    return this.cssRules.indexOf(cssRule);
+  }
+  /**
+   * Generate a new CSS rule and replace the existing one.
+   */
+  ;
+
+  _proto.replaceRule = function replaceRule(cssRule, rule) {
+    var index = this.indexOf(cssRule);
+    if (index === -1) return false;
+    this.element.sheet.deleteRule(index);
+    this.cssRules.splice(index, 1);
+    return this.insertRule(rule, index);
+  }
+  /**
+   * Get all rules elements.
+   */
+  ;
+
+  _proto.getRules = function getRules() {
+    return this.element.sheet.cssRules;
+  };
+
+  return DomRenderer;
+}();
+
+var instanceCounter = 0;
+
+var Jss =
+/*#__PURE__*/
+function () {
+  function Jss(options) {
+    this.id = instanceCounter++;
+    this.version = "10.10.0";
+    this.plugins = new PluginsRegistry();
+    this.options = {
+      id: {
+        minify: false
+      },
+      createGenerateId: createGenerateId,
+      Renderer: isInBrowser ? DomRenderer : null,
+      plugins: []
+    };
+    this.generateId = createGenerateId({
+      minify: false
+    });
+
+    for (var i = 0; i < plugins.length; i++) {
+      this.plugins.use(plugins[i], {
+        queue: 'internal'
+      });
+    }
+
+    this.setup(options);
+  }
+  /**
+   * Prepares various options, applies plugins.
+   * Should not be used twice on the same instance, because there is no plugins
+   * deduplication logic.
+   */
+
+
+  var _proto = Jss.prototype;
+
+  _proto.setup = function setup(options) {
+    if (options === void 0) {
+      options = {};
+    }
+
+    if (options.createGenerateId) {
+      this.options.createGenerateId = options.createGenerateId;
+    }
+
+    if (options.id) {
+      this.options.id = _extends({}, this.options.id, options.id);
+    }
+
+    if (options.createGenerateId || options.id) {
+      this.generateId = this.options.createGenerateId(this.options.id);
+    }
+
+    if (options.insertionPoint != null) this.options.insertionPoint = options.insertionPoint;
+
+    if ('Renderer' in options) {
+      this.options.Renderer = options.Renderer;
+    } // eslint-disable-next-line prefer-spread
+
+
+    if (options.plugins) this.use.apply(this, options.plugins);
+    return this;
+  }
+  /**
+   * Create a Style Sheet.
+   */
+  ;
+
+  _proto.createStyleSheet = function createStyleSheet(styles, options) {
+    if (options === void 0) {
+      options = {};
+    }
+
+    var _options = options,
+        index = _options.index;
+
+    if (typeof index !== 'number') {
+      index = sheets.index === 0 ? 0 : sheets.index + 1;
+    }
+
+    var sheet = new StyleSheet(styles, _extends({}, options, {
+      jss: this,
+      generateId: options.generateId || this.generateId,
+      insertionPoint: this.options.insertionPoint,
+      Renderer: this.options.Renderer,
+      index: index
+    }));
+    this.plugins.onProcessSheet(sheet);
+    return sheet;
+  }
+  /**
+   * Detach the Style Sheet and remove it from the registry.
+   */
+  ;
+
+  _proto.removeStyleSheet = function removeStyleSheet(sheet) {
+    sheet.detach();
+    sheets.remove(sheet);
+    return this;
+  }
+  /**
+   * Create a rule without a Style Sheet.
+   * [Deprecated] will be removed in the next major version.
+   */
+  ;
+
+  _proto.createRule = function createRule$1(name, style, options) {
+    if (style === void 0) {
+      style = {};
+    }
+
+    if (options === void 0) {
+      options = {};
+    }
+
+    // Enable rule without name for inline styles.
+    if (typeof name === 'object') {
+      return this.createRule(undefined, name, style);
+    }
+
+    var ruleOptions = _extends({}, options, {
+      name: name,
+      jss: this,
+      Renderer: this.options.Renderer
+    });
+
+    if (!ruleOptions.generateId) ruleOptions.generateId = this.generateId;
+    if (!ruleOptions.classes) ruleOptions.classes = {};
+    if (!ruleOptions.keyframes) ruleOptions.keyframes = {};
+
+    var rule = createRule(name, style, ruleOptions);
+
+    if (rule) this.plugins.onProcessRule(rule);
+    return rule;
+  }
+  /**
+   * Register plugin. Passed function will be invoked with a rule instance.
+   */
+  ;
+
+  _proto.use = function use() {
+    var _this = this;
+
+    for (var _len = arguments.length, plugins = new Array(_len), _key = 0; _key < _len; _key++) {
+      plugins[_key] = arguments[_key];
+    }
+
+    plugins.forEach(function (plugin) {
+      _this.plugins.use(plugin);
+    });
+    return this;
+  };
+
+  return Jss;
+}();
+
+var createJss = function createJss(options) {
+  return new Jss(options);
+};
+
+/**
+ * SheetsManager is like a WeakMap which is designed to count StyleSheet
+ * instances and attach/detach automatically.
+ * Used in react-jss.
+ */
+
+var SheetsManager =
+/*#__PURE__*/
+function () {
+  function SheetsManager() {
+    this.length = 0;
+    this.sheets = new WeakMap();
+  }
+
+  var _proto = SheetsManager.prototype;
+
+  _proto.get = function get(key) {
+    var entry = this.sheets.get(key);
+    return entry && entry.sheet;
+  };
+
+  _proto.add = function add(key, sheet) {
+    if (this.sheets.has(key)) return;
+    this.length++;
+    this.sheets.set(key, {
+      sheet: sheet,
+      refs: 0
+    });
+  };
+
+  _proto.manage = function manage(key) {
+    var entry = this.sheets.get(key);
+
+    if (entry) {
+      if (entry.refs === 0) {
+        entry.sheet.attach();
+      }
+
+      entry.refs++;
+      return entry.sheet;
+    }
+
+    warning(false, "[JSS] SheetsManager: can't find sheet to manage");
+    return undefined;
+  };
+
+  _proto.unmanage = function unmanage(key) {
+    var entry = this.sheets.get(key);
+
+    if (entry) {
+      if (entry.refs > 0) {
+        entry.refs--;
+        if (entry.refs === 0) entry.sheet.detach();
+      }
+    } else {
+      warning(false, "SheetsManager: can't find sheet to unmanage");
+    }
+  };
+
+  _createClass(SheetsManager, [{
+    key: "size",
+    get: function get() {
+      return this.length;
+    }
+  }]);
+
+  return SheetsManager;
+}();
+
+/**
+* Export a constant indicating if this browser has CSSTOM support.
+* https://developers.google.com/web/updates/2018/03/cssom
+*/
+var hasCSSTOMSupport = typeof CSS === 'object' && CSS != null && 'number' in CSS;
+
+/**
+ * Extracts a styles object with only props that contain function values.
+ */
+function getDynamicStyles(styles) {
+  var to = null;
+
+  for (var key in styles) {
+    var value = styles[key];
+    var type = typeof value;
+
+    if (type === 'function') {
+      if (!to) to = {};
+      to[key] = value;
+    } else if (type === 'object' && value !== null && !Array.isArray(value)) {
+      var extracted = getDynamicStyles(value);
+
+      if (extracted) {
+        if (!to) to = {};
+        to[key] = extracted;
+      }
+    }
+  }
+
+  return to;
+}
+
+/**
+ * A better abstraction over CSS.
+ *
+ * @copyright Oleg Isonen (Slobodskoi) / Isonen 2014-present
+ * @website https://github.com/cssinjs/jss
+ * @license MIT
+ */
+var index = createJss();
+
+export default index;
+export { RuleList, SheetsManager, SheetsRegistry, createJss as create, createGenerateId, createRule, getDynamicStyles, hasCSSTOMSupport, sheets, toCssValue };
diff --git a/ddb_main/node_modules/jwt-decode/lib/atob.js b/ddb_main/node_modules/jwt-decode/lib/atob.js
new file mode 100644
index 0000000..2f168ee
--- /dev/null
+++ b/ddb_main/node_modules/jwt-decode/lib/atob.js
@@ -0,0 +1,38 @@
+/**
+ * The code was extracted from:
+ * https://github.com/davidchambers/Base64.js
+ */
+
+var chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';
+
+function InvalidCharacterError(message) {
+  this.message = message;
+}
+
+InvalidCharacterError.prototype = new Error();
+InvalidCharacterError.prototype.name = 'InvalidCharacterError';
+
+function polyfill (input) {
+  var str = String(input).replace(/=+$/, '');
+  if (str.length % 4 == 1) {
+    throw new InvalidCharacterError("'atob' failed: The string to be decoded is not correctly encoded.");
+  }
+  for (
+    // initialize result and counters
+    var bc = 0, bs, buffer, idx = 0, output = '';
+    // get next character
+    buffer = str.charAt(idx++);
+    // character found in table? initialize bit storage and add its ascii value;
+    ~buffer && (bs = bc % 4 ? bs * 64 + buffer : buffer,
+      // and if not first of each 4 characters,
+      // convert the first 8 bits to one ascii character
+      bc++ % 4) ? output += String.fromCharCode(255 & bs >> (-2 * bc & 6)) : 0
+  ) {
+    // try to find character in table (0-63, not found => -1)
+    buffer = chars.indexOf(buffer);
+  }
+  return output;
+}
+
+
+module.exports = typeof window !== 'undefined' && window.atob && window.atob.bind(window) || polyfill;
diff --git a/ddb_main/node_modules/jwt-decode/lib/base64_url_decode.js b/ddb_main/node_modules/jwt-decode/lib/base64_url_decode.js
new file mode 100644
index 0000000..4a63e49
--- /dev/null
+++ b/ddb_main/node_modules/jwt-decode/lib/base64_url_decode.js
@@ -0,0 +1,33 @@
+var atob = require('./atob');
+
+function b64DecodeUnicode(str) {
+  return decodeURIComponent(atob(str).replace(/(.)/g, function (m, p) {
+    var code = p.charCodeAt(0).toString(16).toUpperCase();
+    if (code.length < 2) {
+      code = '0' + code;
+    }
+    return '%' + code;
+  }));
+}
+
+module.exports = function(str) {
+  var output = str.replace(/-/g, "+").replace(/_/g, "/");
+  switch (output.length % 4) {
+    case 0:
+      break;
+    case 2:
+      output += "==";
+      break;
+    case 3:
+      output += "=";
+      break;
+    default:
+      throw "Illegal base64url string!";
+  }
+
+  try{
+    return b64DecodeUnicode(output);
+  } catch (err) {
+    return atob(output);
+  }
+};
diff --git a/ddb_main/node_modules/jwt-decode/lib/index.js b/ddb_main/node_modules/jwt-decode/lib/index.js
new file mode 100644
index 0000000..5c3b4ff
--- /dev/null
+++ b/ddb_main/node_modules/jwt-decode/lib/index.js
@@ -0,0 +1,26 @@
+'use strict';
+
+var base64_url_decode = require('./base64_url_decode');
+
+function InvalidTokenError(message) {
+  this.message = message;
+}
+
+InvalidTokenError.prototype = new Error();
+InvalidTokenError.prototype.name = 'InvalidTokenError';
+
+module.exports = function (token,options) {
+  if (typeof token !== 'string') {
+    throw new InvalidTokenError('Invalid token specified');
+  }
+
+  options = options || {};
+  var pos = options.header === true ? 0 : 1;
+  try {
+    return JSON.parse(base64_url_decode(token.split('.')[pos]));
+  } catch (e) {
+    throw new InvalidTokenError('Invalid token specified: ' + e.message);
+  }
+};
+
+module.exports.InvalidTokenError = InvalidTokenError;
diff --git a/ddb_main/node_modules/lodash/_DataView.js b/ddb_main/node_modules/lodash/_DataView.js
new file mode 100644
index 0000000..ac2d57c
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_DataView.js
@@ -0,0 +1,7 @@
+var getNative = require('./_getNative'),
+    root = require('./_root');
+
+/* Built-in method references that are verified to be native. */
+var DataView = getNative(root, 'DataView');
+
+module.exports = DataView;
diff --git a/ddb_main/node_modules/lodash/_Hash.js b/ddb_main/node_modules/lodash/_Hash.js
new file mode 100644
index 0000000..b504fe3
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_Hash.js
@@ -0,0 +1,32 @@
+var hashClear = require('./_hashClear'),
+    hashDelete = require('./_hashDelete'),
+    hashGet = require('./_hashGet'),
+    hashHas = require('./_hashHas'),
+    hashSet = require('./_hashSet');
+
+/**
+ * Creates a hash object.
+ *
+ * @private
+ * @constructor
+ * @param {Array} [entries] The key-value pairs to cache.
+ */
+function Hash(entries) {
+  var index = -1,
+      length = entries == null ? 0 : entries.length;
+
+  this.clear();
+  while (++index < length) {
+    var entry = entries[index];
+    this.set(entry[0], entry[1]);
+  }
+}
+
+// Add methods to `Hash`.
+Hash.prototype.clear = hashClear;
+Hash.prototype['delete'] = hashDelete;
+Hash.prototype.get = hashGet;
+Hash.prototype.has = hashHas;
+Hash.prototype.set = hashSet;
+
+module.exports = Hash;
diff --git a/ddb_main/node_modules/lodash/_ListCache.js b/ddb_main/node_modules/lodash/_ListCache.js
new file mode 100644
index 0000000..26895c3
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_ListCache.js
@@ -0,0 +1,32 @@
+var listCacheClear = require('./_listCacheClear'),
+    listCacheDelete = require('./_listCacheDelete'),
+    listCacheGet = require('./_listCacheGet'),
+    listCacheHas = require('./_listCacheHas'),
+    listCacheSet = require('./_listCacheSet');
+
+/**
+ * Creates an list cache object.
+ *
+ * @private
+ * @constructor
+ * @param {Array} [entries] The key-value pairs to cache.
+ */
+function ListCache(entries) {
+  var index = -1,
+      length = entries == null ? 0 : entries.length;
+
+  this.clear();
+  while (++index < length) {
+    var entry = entries[index];
+    this.set(entry[0], entry[1]);
+  }
+}
+
+// Add methods to `ListCache`.
+ListCache.prototype.clear = listCacheClear;
+ListCache.prototype['delete'] = listCacheDelete;
+ListCache.prototype.get = listCacheGet;
+ListCache.prototype.has = listCacheHas;
+ListCache.prototype.set = listCacheSet;
+
+module.exports = ListCache;
diff --git a/ddb_main/node_modules/lodash/_Map.js b/ddb_main/node_modules/lodash/_Map.js
new file mode 100644
index 0000000..b73f29a
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_Map.js
@@ -0,0 +1,7 @@
+var getNative = require('./_getNative'),
+    root = require('./_root');
+
+/* Built-in method references that are verified to be native. */
+var Map = getNative(root, 'Map');
+
+module.exports = Map;
diff --git a/ddb_main/node_modules/lodash/_MapCache.js b/ddb_main/node_modules/lodash/_MapCache.js
new file mode 100644
index 0000000..4a4eea7
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_MapCache.js
@@ -0,0 +1,32 @@
+var mapCacheClear = require('./_mapCacheClear'),
+    mapCacheDelete = require('./_mapCacheDelete'),
+    mapCacheGet = require('./_mapCacheGet'),
+    mapCacheHas = require('./_mapCacheHas'),
+    mapCacheSet = require('./_mapCacheSet');
+
+/**
+ * Creates a map cache object to store key-value pairs.
+ *
+ * @private
+ * @constructor
+ * @param {Array} [entries] The key-value pairs to cache.
+ */
+function MapCache(entries) {
+  var index = -1,
+      length = entries == null ? 0 : entries.length;
+
+  this.clear();
+  while (++index < length) {
+    var entry = entries[index];
+    this.set(entry[0], entry[1]);
+  }
+}
+
+// Add methods to `MapCache`.
+MapCache.prototype.clear = mapCacheClear;
+MapCache.prototype['delete'] = mapCacheDelete;
+MapCache.prototype.get = mapCacheGet;
+MapCache.prototype.has = mapCacheHas;
+MapCache.prototype.set = mapCacheSet;
+
+module.exports = MapCache;
diff --git a/ddb_main/node_modules/lodash/_Promise.js b/ddb_main/node_modules/lodash/_Promise.js
new file mode 100644
index 0000000..247b9e1
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_Promise.js
@@ -0,0 +1,7 @@
+var getNative = require('./_getNative'),
+    root = require('./_root');
+
+/* Built-in method references that are verified to be native. */
+var Promise = getNative(root, 'Promise');
+
+module.exports = Promise;
diff --git a/ddb_main/node_modules/lodash/_Set.js b/ddb_main/node_modules/lodash/_Set.js
new file mode 100644
index 0000000..b3c8dcb
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_Set.js
@@ -0,0 +1,7 @@
+var getNative = require('./_getNative'),
+    root = require('./_root');
+
+/* Built-in method references that are verified to be native. */
+var Set = getNative(root, 'Set');
+
+module.exports = Set;
diff --git a/ddb_main/node_modules/lodash/_SetCache.js b/ddb_main/node_modules/lodash/_SetCache.js
new file mode 100644
index 0000000..6468b06
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_SetCache.js
@@ -0,0 +1,27 @@
+var MapCache = require('./_MapCache'),
+    setCacheAdd = require('./_setCacheAdd'),
+    setCacheHas = require('./_setCacheHas');
+
+/**
+ *
+ * Creates an array cache object to store unique values.
+ *
+ * @private
+ * @constructor
+ * @param {Array} [values] The values to cache.
+ */
+function SetCache(values) {
+  var index = -1,
+      length = values == null ? 0 : values.length;
+
+  this.__data__ = new MapCache;
+  while (++index < length) {
+    this.add(values[index]);
+  }
+}
+
+// Add methods to `SetCache`.
+SetCache.prototype.add = SetCache.prototype.push = setCacheAdd;
+SetCache.prototype.has = setCacheHas;
+
+module.exports = SetCache;
diff --git a/ddb_main/node_modules/lodash/_Stack.js b/ddb_main/node_modules/lodash/_Stack.js
new file mode 100644
index 0000000..80b2cf1
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_Stack.js
@@ -0,0 +1,27 @@
+var ListCache = require('./_ListCache'),
+    stackClear = require('./_stackClear'),
+    stackDelete = require('./_stackDelete'),
+    stackGet = require('./_stackGet'),
+    stackHas = require('./_stackHas'),
+    stackSet = require('./_stackSet');
+
+/**
+ * Creates a stack cache object to store key-value pairs.
+ *
+ * @private
+ * @constructor
+ * @param {Array} [entries] The key-value pairs to cache.
+ */
+function Stack(entries) {
+  var data = this.__data__ = new ListCache(entries);
+  this.size = data.size;
+}
+
+// Add methods to `Stack`.
+Stack.prototype.clear = stackClear;
+Stack.prototype['delete'] = stackDelete;
+Stack.prototype.get = stackGet;
+Stack.prototype.has = stackHas;
+Stack.prototype.set = stackSet;
+
+module.exports = Stack;
diff --git a/ddb_main/node_modules/lodash/_Symbol.js b/ddb_main/node_modules/lodash/_Symbol.js
new file mode 100644
index 0000000..a013f7c
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_Symbol.js
@@ -0,0 +1,6 @@
+var root = require('./_root');
+
+/** Built-in value references. */
+var Symbol = root.Symbol;
+
+module.exports = Symbol;
diff --git a/ddb_main/node_modules/lodash/_Uint8Array.js b/ddb_main/node_modules/lodash/_Uint8Array.js
new file mode 100644
index 0000000..2fb30e1
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_Uint8Array.js
@@ -0,0 +1,6 @@
+var root = require('./_root');
+
+/** Built-in value references. */
+var Uint8Array = root.Uint8Array;
+
+module.exports = Uint8Array;
diff --git a/ddb_main/node_modules/lodash/_WeakMap.js b/ddb_main/node_modules/lodash/_WeakMap.js
new file mode 100644
index 0000000..567f86c
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_WeakMap.js
@@ -0,0 +1,7 @@
+var getNative = require('./_getNative'),
+    root = require('./_root');
+
+/* Built-in method references that are verified to be native. */
+var WeakMap = getNative(root, 'WeakMap');
+
+module.exports = WeakMap;
diff --git a/ddb_main/node_modules/lodash/_apply.js b/ddb_main/node_modules/lodash/_apply.js
new file mode 100644
index 0000000..36436dd
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_apply.js
@@ -0,0 +1,21 @@
+/**
+ * A faster alternative to `Function#apply`, this function invokes `func`
+ * with the `this` binding of `thisArg` and the arguments of `args`.
+ *
+ * @private
+ * @param {Function} func The function to invoke.
+ * @param {*} thisArg The `this` binding of `func`.
+ * @param {Array} args The arguments to invoke `func` with.
+ * @returns {*} Returns the result of `func`.
+ */
+function apply(func, thisArg, args) {
+  switch (args.length) {
+    case 0: return func.call(thisArg);
+    case 1: return func.call(thisArg, args[0]);
+    case 2: return func.call(thisArg, args[0], args[1]);
+    case 3: return func.call(thisArg, args[0], args[1], args[2]);
+  }
+  return func.apply(thisArg, args);
+}
+
+module.exports = apply;
diff --git a/ddb_main/node_modules/lodash/_arrayAggregator.js b/ddb_main/node_modules/lodash/_arrayAggregator.js
new file mode 100644
index 0000000..d96c3ca
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_arrayAggregator.js
@@ -0,0 +1,22 @@
+/**
+ * A specialized version of `baseAggregator` for arrays.
+ *
+ * @private
+ * @param {Array} [array] The array to iterate over.
+ * @param {Function} setter The function to set `accumulator` values.
+ * @param {Function} iteratee The iteratee to transform keys.
+ * @param {Object} accumulator The initial aggregated object.
+ * @returns {Function} Returns `accumulator`.
+ */
+function arrayAggregator(array, setter, iteratee, accumulator) {
+  var index = -1,
+      length = array == null ? 0 : array.length;
+
+  while (++index < length) {
+    var value = array[index];
+    setter(accumulator, value, iteratee(value), array);
+  }
+  return accumulator;
+}
+
+module.exports = arrayAggregator;
diff --git a/ddb_main/node_modules/lodash/_arrayFilter.js b/ddb_main/node_modules/lodash/_arrayFilter.js
new file mode 100644
index 0000000..75ea254
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_arrayFilter.js
@@ -0,0 +1,25 @@
+/**
+ * A specialized version of `_.filter` for arrays without support for
+ * iteratee shorthands.
+ *
+ * @private
+ * @param {Array} [array] The array to iterate over.
+ * @param {Function} predicate The function invoked per iteration.
+ * @returns {Array} Returns the new filtered array.
+ */
+function arrayFilter(array, predicate) {
+  var index = -1,
+      length = array == null ? 0 : array.length,
+      resIndex = 0,
+      result = [];
+
+  while (++index < length) {
+    var value = array[index];
+    if (predicate(value, index, array)) {
+      result[resIndex++] = value;
+    }
+  }
+  return result;
+}
+
+module.exports = arrayFilter;
diff --git a/ddb_main/node_modules/lodash/_arrayLikeKeys.js b/ddb_main/node_modules/lodash/_arrayLikeKeys.js
new file mode 100644
index 0000000..b2ec9ce
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_arrayLikeKeys.js
@@ -0,0 +1,49 @@
+var baseTimes = require('./_baseTimes'),
+    isArguments = require('./isArguments'),
+    isArray = require('./isArray'),
+    isBuffer = require('./isBuffer'),
+    isIndex = require('./_isIndex'),
+    isTypedArray = require('./isTypedArray');
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty = objectProto.hasOwnProperty;
+
+/**
+ * Creates an array of the enumerable property names of the array-like `value`.
+ *
+ * @private
+ * @param {*} value The value to query.
+ * @param {boolean} inherited Specify returning inherited property names.
+ * @returns {Array} Returns the array of property names.
+ */
+function arrayLikeKeys(value, inherited) {
+  var isArr = isArray(value),
+      isArg = !isArr && isArguments(value),
+      isBuff = !isArr && !isArg && isBuffer(value),
+      isType = !isArr && !isArg && !isBuff && isTypedArray(value),
+      skipIndexes = isArr || isArg || isBuff || isType,
+      result = skipIndexes ? baseTimes(value.length, String) : [],
+      length = result.length;
+
+  for (var key in value) {
+    if ((inherited || hasOwnProperty.call(value, key)) &&
+        !(skipIndexes && (
+           // Safari 9 has enumerable `arguments.length` in strict mode.
+           key == 'length' ||
+           // Node.js 0.10 has enumerable non-index properties on buffers.
+           (isBuff && (key == 'offset' || key == 'parent')) ||
+           // PhantomJS 2 has enumerable non-index properties on typed arrays.
+           (isType && (key == 'buffer' || key == 'byteLength' || key == 'byteOffset')) ||
+           // Skip index properties.
+           isIndex(key, length)
+        ))) {
+      result.push(key);
+    }
+  }
+  return result;
+}
+
+module.exports = arrayLikeKeys;
diff --git a/ddb_main/node_modules/lodash/_arrayMap.js b/ddb_main/node_modules/lodash/_arrayMap.js
new file mode 100644
index 0000000..22b2246
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_arrayMap.js
@@ -0,0 +1,21 @@
+/**
+ * A specialized version of `_.map` for arrays without support for iteratee
+ * shorthands.
+ *
+ * @private
+ * @param {Array} [array] The array to iterate over.
+ * @param {Function} iteratee The function invoked per iteration.
+ * @returns {Array} Returns the new mapped array.
+ */
+function arrayMap(array, iteratee) {
+  var index = -1,
+      length = array == null ? 0 : array.length,
+      result = Array(length);
+
+  while (++index < length) {
+    result[index] = iteratee(array[index], index, array);
+  }
+  return result;
+}
+
+module.exports = arrayMap;
diff --git a/ddb_main/node_modules/lodash/_arrayPush.js b/ddb_main/node_modules/lodash/_arrayPush.js
new file mode 100644
index 0000000..7d742b3
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_arrayPush.js
@@ -0,0 +1,20 @@
+/**
+ * Appends the elements of `values` to `array`.
+ *
+ * @private
+ * @param {Array} array The array to modify.
+ * @param {Array} values The values to append.
+ * @returns {Array} Returns `array`.
+ */
+function arrayPush(array, values) {
+  var index = -1,
+      length = values.length,
+      offset = array.length;
+
+  while (++index < length) {
+    array[offset + index] = values[index];
+  }
+  return array;
+}
+
+module.exports = arrayPush;
diff --git a/ddb_main/node_modules/lodash/_arraySome.js b/ddb_main/node_modules/lodash/_arraySome.js
new file mode 100644
index 0000000..6fd02fd
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_arraySome.js
@@ -0,0 +1,23 @@
+/**
+ * A specialized version of `_.some` for arrays without support for iteratee
+ * shorthands.
+ *
+ * @private
+ * @param {Array} [array] The array to iterate over.
+ * @param {Function} predicate The function invoked per iteration.
+ * @returns {boolean} Returns `true` if any element passes the predicate check,
+ *  else `false`.
+ */
+function arraySome(array, predicate) {
+  var index = -1,
+      length = array == null ? 0 : array.length;
+
+  while (++index < length) {
+    if (predicate(array[index], index, array)) {
+      return true;
+    }
+  }
+  return false;
+}
+
+module.exports = arraySome;
diff --git a/ddb_main/node_modules/lodash/_assocIndexOf.js b/ddb_main/node_modules/lodash/_assocIndexOf.js
new file mode 100644
index 0000000..5b77a2b
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_assocIndexOf.js
@@ -0,0 +1,21 @@
+var eq = require('./eq');
+
+/**
+ * Gets the index at which the `key` is found in `array` of key-value pairs.
+ *
+ * @private
+ * @param {Array} array The array to inspect.
+ * @param {*} key The key to search for.
+ * @returns {number} Returns the index of the matched value, else `-1`.
+ */
+function assocIndexOf(array, key) {
+  var length = array.length;
+  while (length--) {
+    if (eq(array[length][0], key)) {
+      return length;
+    }
+  }
+  return -1;
+}
+
+module.exports = assocIndexOf;
diff --git a/ddb_main/node_modules/lodash/_baseAggregator.js b/ddb_main/node_modules/lodash/_baseAggregator.js
new file mode 100644
index 0000000..4bc9e91
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseAggregator.js
@@ -0,0 +1,21 @@
+var baseEach = require('./_baseEach');
+
+/**
+ * Aggregates elements of `collection` on `accumulator` with keys transformed
+ * by `iteratee` and values set by `setter`.
+ *
+ * @private
+ * @param {Array|Object} collection The collection to iterate over.
+ * @param {Function} setter The function to set `accumulator` values.
+ * @param {Function} iteratee The iteratee to transform keys.
+ * @param {Object} accumulator The initial aggregated object.
+ * @returns {Function} Returns `accumulator`.
+ */
+function baseAggregator(collection, setter, iteratee, accumulator) {
+  baseEach(collection, function(value, key, collection) {
+    setter(accumulator, value, iteratee(value), collection);
+  });
+  return accumulator;
+}
+
+module.exports = baseAggregator;
diff --git a/ddb_main/node_modules/lodash/_baseAssignValue.js b/ddb_main/node_modules/lodash/_baseAssignValue.js
new file mode 100644
index 0000000..d6f66ef
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseAssignValue.js
@@ -0,0 +1,25 @@
+var defineProperty = require('./_defineProperty');
+
+/**
+ * The base implementation of `assignValue` and `assignMergeValue` without
+ * value checks.
+ *
+ * @private
+ * @param {Object} object The object to modify.
+ * @param {string} key The key of the property to assign.
+ * @param {*} value The value to assign.
+ */
+function baseAssignValue(object, key, value) {
+  if (key == '__proto__' && defineProperty) {
+    defineProperty(object, key, {
+      'configurable': true,
+      'enumerable': true,
+      'value': value,
+      'writable': true
+    });
+  } else {
+    object[key] = value;
+  }
+}
+
+module.exports = baseAssignValue;
diff --git a/ddb_main/node_modules/lodash/_baseEach.js b/ddb_main/node_modules/lodash/_baseEach.js
new file mode 100644
index 0000000..512c067
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseEach.js
@@ -0,0 +1,14 @@
+var baseForOwn = require('./_baseForOwn'),
+    createBaseEach = require('./_createBaseEach');
+
+/**
+ * The base implementation of `_.forEach` without support for iteratee shorthands.
+ *
+ * @private
+ * @param {Array|Object} collection The collection to iterate over.
+ * @param {Function} iteratee The function invoked per iteration.
+ * @returns {Array|Object} Returns `collection`.
+ */
+var baseEach = createBaseEach(baseForOwn);
+
+module.exports = baseEach;
diff --git a/ddb_main/node_modules/lodash/_baseFlatten.js b/ddb_main/node_modules/lodash/_baseFlatten.js
new file mode 100644
index 0000000..4b1e009
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseFlatten.js
@@ -0,0 +1,38 @@
+var arrayPush = require('./_arrayPush'),
+    isFlattenable = require('./_isFlattenable');
+
+/**
+ * The base implementation of `_.flatten` with support for restricting flattening.
+ *
+ * @private
+ * @param {Array} array The array to flatten.
+ * @param {number} depth The maximum recursion depth.
+ * @param {boolean} [predicate=isFlattenable] The function invoked per iteration.
+ * @param {boolean} [isStrict] Restrict to values that pass `predicate` checks.
+ * @param {Array} [result=[]] The initial result value.
+ * @returns {Array} Returns the new flattened array.
+ */
+function baseFlatten(array, depth, predicate, isStrict, result) {
+  var index = -1,
+      length = array.length;
+
+  predicate || (predicate = isFlattenable);
+  result || (result = []);
+
+  while (++index < length) {
+    var value = array[index];
+    if (depth > 0 && predicate(value)) {
+      if (depth > 1) {
+        // Recursively flatten arrays (susceptible to call stack limits).
+        baseFlatten(value, depth - 1, predicate, isStrict, result);
+      } else {
+        arrayPush(result, value);
+      }
+    } else if (!isStrict) {
+      result[result.length] = value;
+    }
+  }
+  return result;
+}
+
+module.exports = baseFlatten;
diff --git a/ddb_main/node_modules/lodash/_baseFor.js b/ddb_main/node_modules/lodash/_baseFor.js
new file mode 100644
index 0000000..d946590
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseFor.js
@@ -0,0 +1,16 @@
+var createBaseFor = require('./_createBaseFor');
+
+/**
+ * The base implementation of `baseForOwn` which iterates over `object`
+ * properties returned by `keysFunc` and invokes `iteratee` for each property.
+ * Iteratee functions may exit iteration early by explicitly returning `false`.
+ *
+ * @private
+ * @param {Object} object The object to iterate over.
+ * @param {Function} iteratee The function invoked per iteration.
+ * @param {Function} keysFunc The function to get the keys of `object`.
+ * @returns {Object} Returns `object`.
+ */
+var baseFor = createBaseFor();
+
+module.exports = baseFor;
diff --git a/ddb_main/node_modules/lodash/_baseForOwn.js b/ddb_main/node_modules/lodash/_baseForOwn.js
new file mode 100644
index 0000000..503d523
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseForOwn.js
@@ -0,0 +1,16 @@
+var baseFor = require('./_baseFor'),
+    keys = require('./keys');
+
+/**
+ * The base implementation of `_.forOwn` without support for iteratee shorthands.
+ *
+ * @private
+ * @param {Object} object The object to iterate over.
+ * @param {Function} iteratee The function invoked per iteration.
+ * @returns {Object} Returns `object`.
+ */
+function baseForOwn(object, iteratee) {
+  return object && baseFor(object, iteratee, keys);
+}
+
+module.exports = baseForOwn;
diff --git a/ddb_main/node_modules/lodash/_baseGet.js b/ddb_main/node_modules/lodash/_baseGet.js
new file mode 100644
index 0000000..a194913
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseGet.js
@@ -0,0 +1,24 @@
+var castPath = require('./_castPath'),
+    toKey = require('./_toKey');
+
+/**
+ * The base implementation of `_.get` without support for default values.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @param {Array|string} path The path of the property to get.
+ * @returns {*} Returns the resolved value.
+ */
+function baseGet(object, path) {
+  path = castPath(path, object);
+
+  var index = 0,
+      length = path.length;
+
+  while (object != null && index < length) {
+    object = object[toKey(path[index++])];
+  }
+  return (index && index == length) ? object : undefined;
+}
+
+module.exports = baseGet;
diff --git a/ddb_main/node_modules/lodash/_baseGetAllKeys.js b/ddb_main/node_modules/lodash/_baseGetAllKeys.js
new file mode 100644
index 0000000..8ad204e
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseGetAllKeys.js
@@ -0,0 +1,20 @@
+var arrayPush = require('./_arrayPush'),
+    isArray = require('./isArray');
+
+/**
+ * The base implementation of `getAllKeys` and `getAllKeysIn` which uses
+ * `keysFunc` and `symbolsFunc` to get the enumerable property names and
+ * symbols of `object`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @param {Function} keysFunc The function to get the keys of `object`.
+ * @param {Function} symbolsFunc The function to get the symbols of `object`.
+ * @returns {Array} Returns the array of property names and symbols.
+ */
+function baseGetAllKeys(object, keysFunc, symbolsFunc) {
+  var result = keysFunc(object);
+  return isArray(object) ? result : arrayPush(result, symbolsFunc(object));
+}
+
+module.exports = baseGetAllKeys;
diff --git a/ddb_main/node_modules/lodash/_baseGetTag.js b/ddb_main/node_modules/lodash/_baseGetTag.js
new file mode 100644
index 0000000..b927ccc
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseGetTag.js
@@ -0,0 +1,28 @@
+var Symbol = require('./_Symbol'),
+    getRawTag = require('./_getRawTag'),
+    objectToString = require('./_objectToString');
+
+/** `Object#toString` result references. */
+var nullTag = '[object Null]',
+    undefinedTag = '[object Undefined]';
+
+/** Built-in value references. */
+var symToStringTag = Symbol ? Symbol.toStringTag : undefined;
+
+/**
+ * The base implementation of `getTag` without fallbacks for buggy environments.
+ *
+ * @private
+ * @param {*} value The value to query.
+ * @returns {string} Returns the `toStringTag`.
+ */
+function baseGetTag(value) {
+  if (value == null) {
+    return value === undefined ? undefinedTag : nullTag;
+  }
+  return (symToStringTag && symToStringTag in Object(value))
+    ? getRawTag(value)
+    : objectToString(value);
+}
+
+module.exports = baseGetTag;
diff --git a/ddb_main/node_modules/lodash/_baseHasIn.js b/ddb_main/node_modules/lodash/_baseHasIn.js
new file mode 100644
index 0000000..2e0d042
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseHasIn.js
@@ -0,0 +1,13 @@
+/**
+ * The base implementation of `_.hasIn` without support for deep paths.
+ *
+ * @private
+ * @param {Object} [object] The object to query.
+ * @param {Array|string} key The key to check.
+ * @returns {boolean} Returns `true` if `key` exists, else `false`.
+ */
+function baseHasIn(object, key) {
+  return object != null && key in Object(object);
+}
+
+module.exports = baseHasIn;
diff --git a/ddb_main/node_modules/lodash/_baseIsArguments.js b/ddb_main/node_modules/lodash/_baseIsArguments.js
new file mode 100644
index 0000000..b3562cc
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseIsArguments.js
@@ -0,0 +1,18 @@
+var baseGetTag = require('./_baseGetTag'),
+    isObjectLike = require('./isObjectLike');
+
+/** `Object#toString` result references. */
+var argsTag = '[object Arguments]';
+
+/**
+ * The base implementation of `_.isArguments`.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an `arguments` object,
+ */
+function baseIsArguments(value) {
+  return isObjectLike(value) && baseGetTag(value) == argsTag;
+}
+
+module.exports = baseIsArguments;
diff --git a/ddb_main/node_modules/lodash/_baseIsEqual.js b/ddb_main/node_modules/lodash/_baseIsEqual.js
new file mode 100644
index 0000000..00a68a4
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseIsEqual.js
@@ -0,0 +1,28 @@
+var baseIsEqualDeep = require('./_baseIsEqualDeep'),
+    isObjectLike = require('./isObjectLike');
+
+/**
+ * The base implementation of `_.isEqual` which supports partial comparisons
+ * and tracks traversed objects.
+ *
+ * @private
+ * @param {*} value The value to compare.
+ * @param {*} other The other value to compare.
+ * @param {boolean} bitmask The bitmask flags.
+ *  1 - Unordered comparison
+ *  2 - Partial comparison
+ * @param {Function} [customizer] The function to customize comparisons.
+ * @param {Object} [stack] Tracks traversed `value` and `other` objects.
+ * @returns {boolean} Returns `true` if the values are equivalent, else `false`.
+ */
+function baseIsEqual(value, other, bitmask, customizer, stack) {
+  if (value === other) {
+    return true;
+  }
+  if (value == null || other == null || (!isObjectLike(value) && !isObjectLike(other))) {
+    return value !== value && other !== other;
+  }
+  return baseIsEqualDeep(value, other, bitmask, customizer, baseIsEqual, stack);
+}
+
+module.exports = baseIsEqual;
diff --git a/ddb_main/node_modules/lodash/_baseIsEqualDeep.js b/ddb_main/node_modules/lodash/_baseIsEqualDeep.js
new file mode 100644
index 0000000..e3cfd6a
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseIsEqualDeep.js
@@ -0,0 +1,83 @@
+var Stack = require('./_Stack'),
+    equalArrays = require('./_equalArrays'),
+    equalByTag = require('./_equalByTag'),
+    equalObjects = require('./_equalObjects'),
+    getTag = require('./_getTag'),
+    isArray = require('./isArray'),
+    isBuffer = require('./isBuffer'),
+    isTypedArray = require('./isTypedArray');
+
+/** Used to compose bitmasks for value comparisons. */
+var COMPARE_PARTIAL_FLAG = 1;
+
+/** `Object#toString` result references. */
+var argsTag = '[object Arguments]',
+    arrayTag = '[object Array]',
+    objectTag = '[object Object]';
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty = objectProto.hasOwnProperty;
+
+/**
+ * A specialized version of `baseIsEqual` for arrays and objects which performs
+ * deep comparisons and tracks traversed objects enabling objects with circular
+ * references to be compared.
+ *
+ * @private
+ * @param {Object} object The object to compare.
+ * @param {Object} other The other object to compare.
+ * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
+ * @param {Function} customizer The function to customize comparisons.
+ * @param {Function} equalFunc The function to determine equivalents of values.
+ * @param {Object} [stack] Tracks traversed `object` and `other` objects.
+ * @returns {boolean} Returns `true` if the objects are equivalent, else `false`.
+ */
+function baseIsEqualDeep(object, other, bitmask, customizer, equalFunc, stack) {
+  var objIsArr = isArray(object),
+      othIsArr = isArray(other),
+      objTag = objIsArr ? arrayTag : getTag(object),
+      othTag = othIsArr ? arrayTag : getTag(other);
+
+  objTag = objTag == argsTag ? objectTag : objTag;
+  othTag = othTag == argsTag ? objectTag : othTag;
+
+  var objIsObj = objTag == objectTag,
+      othIsObj = othTag == objectTag,
+      isSameTag = objTag == othTag;
+
+  if (isSameTag && isBuffer(object)) {
+    if (!isBuffer(other)) {
+      return false;
+    }
+    objIsArr = true;
+    objIsObj = false;
+  }
+  if (isSameTag && !objIsObj) {
+    stack || (stack = new Stack);
+    return (objIsArr || isTypedArray(object))
+      ? equalArrays(object, other, bitmask, customizer, equalFunc, stack)
+      : equalByTag(object, other, objTag, bitmask, customizer, equalFunc, stack);
+  }
+  if (!(bitmask & COMPARE_PARTIAL_FLAG)) {
+    var objIsWrapped = objIsObj && hasOwnProperty.call(object, '__wrapped__'),
+        othIsWrapped = othIsObj && hasOwnProperty.call(other, '__wrapped__');
+
+    if (objIsWrapped || othIsWrapped) {
+      var objUnwrapped = objIsWrapped ? object.value() : object,
+          othUnwrapped = othIsWrapped ? other.value() : other;
+
+      stack || (stack = new Stack);
+      return equalFunc(objUnwrapped, othUnwrapped, bitmask, customizer, stack);
+    }
+  }
+  if (!isSameTag) {
+    return false;
+  }
+  stack || (stack = new Stack);
+  return equalObjects(object, other, bitmask, customizer, equalFunc, stack);
+}
+
+module.exports = baseIsEqualDeep;
diff --git a/ddb_main/node_modules/lodash/_baseIsMatch.js b/ddb_main/node_modules/lodash/_baseIsMatch.js
new file mode 100644
index 0000000..72494be
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseIsMatch.js
@@ -0,0 +1,62 @@
+var Stack = require('./_Stack'),
+    baseIsEqual = require('./_baseIsEqual');
+
+/** Used to compose bitmasks for value comparisons. */
+var COMPARE_PARTIAL_FLAG = 1,
+    COMPARE_UNORDERED_FLAG = 2;
+
+/**
+ * The base implementation of `_.isMatch` without support for iteratee shorthands.
+ *
+ * @private
+ * @param {Object} object The object to inspect.
+ * @param {Object} source The object of property values to match.
+ * @param {Array} matchData The property names, values, and compare flags to match.
+ * @param {Function} [customizer] The function to customize comparisons.
+ * @returns {boolean} Returns `true` if `object` is a match, else `false`.
+ */
+function baseIsMatch(object, source, matchData, customizer) {
+  var index = matchData.length,
+      length = index,
+      noCustomizer = !customizer;
+
+  if (object == null) {
+    return !length;
+  }
+  object = Object(object);
+  while (index--) {
+    var data = matchData[index];
+    if ((noCustomizer && data[2])
+          ? data[1] !== object[data[0]]
+          : !(data[0] in object)
+        ) {
+      return false;
+    }
+  }
+  while (++index < length) {
+    data = matchData[index];
+    var key = data[0],
+        objValue = object[key],
+        srcValue = data[1];
+
+    if (noCustomizer && data[2]) {
+      if (objValue === undefined && !(key in object)) {
+        return false;
+      }
+    } else {
+      var stack = new Stack;
+      if (customizer) {
+        var result = customizer(objValue, srcValue, key, object, source, stack);
+      }
+      if (!(result === undefined
+            ? baseIsEqual(srcValue, objValue, COMPARE_PARTIAL_FLAG | COMPARE_UNORDERED_FLAG, customizer, stack)
+            : result
+          )) {
+        return false;
+      }
+    }
+  }
+  return true;
+}
+
+module.exports = baseIsMatch;
diff --git a/ddb_main/node_modules/lodash/_baseIsNative.js b/ddb_main/node_modules/lodash/_baseIsNative.js
new file mode 100644
index 0000000..8702330
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseIsNative.js
@@ -0,0 +1,47 @@
+var isFunction = require('./isFunction'),
+    isMasked = require('./_isMasked'),
+    isObject = require('./isObject'),
+    toSource = require('./_toSource');
+
+/**
+ * Used to match `RegExp`
+ * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).
+ */
+var reRegExpChar = /[\\^$.*+?()[\]{}|]/g;
+
+/** Used to detect host constructors (Safari). */
+var reIsHostCtor = /^\[object .+?Constructor\]$/;
+
+/** Used for built-in method references. */
+var funcProto = Function.prototype,
+    objectProto = Object.prototype;
+
+/** Used to resolve the decompiled source of functions. */
+var funcToString = funcProto.toString;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty = objectProto.hasOwnProperty;
+
+/** Used to detect if a method is native. */
+var reIsNative = RegExp('^' +
+  funcToString.call(hasOwnProperty).replace(reRegExpChar, '\\$&')
+  .replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, '$1.*?') + '$'
+);
+
+/**
+ * The base implementation of `_.isNative` without bad shim checks.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a native function,
+ *  else `false`.
+ */
+function baseIsNative(value) {
+  if (!isObject(value) || isMasked(value)) {
+    return false;
+  }
+  var pattern = isFunction(value) ? reIsNative : reIsHostCtor;
+  return pattern.test(toSource(value));
+}
+
+module.exports = baseIsNative;
diff --git a/ddb_main/node_modules/lodash/_baseIsTypedArray.js b/ddb_main/node_modules/lodash/_baseIsTypedArray.js
new file mode 100644
index 0000000..1edb32f
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseIsTypedArray.js
@@ -0,0 +1,60 @@
+var baseGetTag = require('./_baseGetTag'),
+    isLength = require('./isLength'),
+    isObjectLike = require('./isObjectLike');
+
+/** `Object#toString` result references. */
+var argsTag = '[object Arguments]',
+    arrayTag = '[object Array]',
+    boolTag = '[object Boolean]',
+    dateTag = '[object Date]',
+    errorTag = '[object Error]',
+    funcTag = '[object Function]',
+    mapTag = '[object Map]',
+    numberTag = '[object Number]',
+    objectTag = '[object Object]',
+    regexpTag = '[object RegExp]',
+    setTag = '[object Set]',
+    stringTag = '[object String]',
+    weakMapTag = '[object WeakMap]';
+
+var arrayBufferTag = '[object ArrayBuffer]',
+    dataViewTag = '[object DataView]',
+    float32Tag = '[object Float32Array]',
+    float64Tag = '[object Float64Array]',
+    int8Tag = '[object Int8Array]',
+    int16Tag = '[object Int16Array]',
+    int32Tag = '[object Int32Array]',
+    uint8Tag = '[object Uint8Array]',
+    uint8ClampedTag = '[object Uint8ClampedArray]',
+    uint16Tag = '[object Uint16Array]',
+    uint32Tag = '[object Uint32Array]';
+
+/** Used to identify `toStringTag` values of typed arrays. */
+var typedArrayTags = {};
+typedArrayTags[float32Tag] = typedArrayTags[float64Tag] =
+typedArrayTags[int8Tag] = typedArrayTags[int16Tag] =
+typedArrayTags[int32Tag] = typedArrayTags[uint8Tag] =
+typedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] =
+typedArrayTags[uint32Tag] = true;
+typedArrayTags[argsTag] = typedArrayTags[arrayTag] =
+typedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] =
+typedArrayTags[dataViewTag] = typedArrayTags[dateTag] =
+typedArrayTags[errorTag] = typedArrayTags[funcTag] =
+typedArrayTags[mapTag] = typedArrayTags[numberTag] =
+typedArrayTags[objectTag] = typedArrayTags[regexpTag] =
+typedArrayTags[setTag] = typedArrayTags[stringTag] =
+typedArrayTags[weakMapTag] = false;
+
+/**
+ * The base implementation of `_.isTypedArray` without Node.js optimizations.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.
+ */
+function baseIsTypedArray(value) {
+  return isObjectLike(value) &&
+    isLength(value.length) && !!typedArrayTags[baseGetTag(value)];
+}
+
+module.exports = baseIsTypedArray;
diff --git a/ddb_main/node_modules/lodash/_baseIteratee.js b/ddb_main/node_modules/lodash/_baseIteratee.js
new file mode 100644
index 0000000..995c257
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseIteratee.js
@@ -0,0 +1,31 @@
+var baseMatches = require('./_baseMatches'),
+    baseMatchesProperty = require('./_baseMatchesProperty'),
+    identity = require('./identity'),
+    isArray = require('./isArray'),
+    property = require('./property');
+
+/**
+ * The base implementation of `_.iteratee`.
+ *
+ * @private
+ * @param {*} [value=_.identity] The value to convert to an iteratee.
+ * @returns {Function} Returns the iteratee.
+ */
+function baseIteratee(value) {
+  // Don't store the `typeof` result in a variable to avoid a JIT bug in Safari 9.
+  // See https://bugs.webkit.org/show_bug.cgi?id=156034 for more details.
+  if (typeof value == 'function') {
+    return value;
+  }
+  if (value == null) {
+    return identity;
+  }
+  if (typeof value == 'object') {
+    return isArray(value)
+      ? baseMatchesProperty(value[0], value[1])
+      : baseMatches(value);
+  }
+  return property(value);
+}
+
+module.exports = baseIteratee;
diff --git a/ddb_main/node_modules/lodash/_baseKeys.js b/ddb_main/node_modules/lodash/_baseKeys.js
new file mode 100644
index 0000000..45e9e6f
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseKeys.js
@@ -0,0 +1,30 @@
+var isPrototype = require('./_isPrototype'),
+    nativeKeys = require('./_nativeKeys');
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty = objectProto.hasOwnProperty;
+
+/**
+ * The base implementation of `_.keys` which doesn't treat sparse arrays as dense.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the array of property names.
+ */
+function baseKeys(object) {
+  if (!isPrototype(object)) {
+    return nativeKeys(object);
+  }
+  var result = [];
+  for (var key in Object(object)) {
+    if (hasOwnProperty.call(object, key) && key != 'constructor') {
+      result.push(key);
+    }
+  }
+  return result;
+}
+
+module.exports = baseKeys;
diff --git a/ddb_main/node_modules/lodash/_baseMap.js b/ddb_main/node_modules/lodash/_baseMap.js
new file mode 100644
index 0000000..0bf5cea
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseMap.js
@@ -0,0 +1,22 @@
+var baseEach = require('./_baseEach'),
+    isArrayLike = require('./isArrayLike');
+
+/**
+ * The base implementation of `_.map` without support for iteratee shorthands.
+ *
+ * @private
+ * @param {Array|Object} collection The collection to iterate over.
+ * @param {Function} iteratee The function invoked per iteration.
+ * @returns {Array} Returns the new mapped array.
+ */
+function baseMap(collection, iteratee) {
+  var index = -1,
+      result = isArrayLike(collection) ? Array(collection.length) : [];
+
+  baseEach(collection, function(value, key, collection) {
+    result[++index] = iteratee(value, key, collection);
+  });
+  return result;
+}
+
+module.exports = baseMap;
diff --git a/ddb_main/node_modules/lodash/_baseMatches.js b/ddb_main/node_modules/lodash/_baseMatches.js
new file mode 100644
index 0000000..e56582a
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseMatches.js
@@ -0,0 +1,22 @@
+var baseIsMatch = require('./_baseIsMatch'),
+    getMatchData = require('./_getMatchData'),
+    matchesStrictComparable = require('./_matchesStrictComparable');
+
+/**
+ * The base implementation of `_.matches` which doesn't clone `source`.
+ *
+ * @private
+ * @param {Object} source The object of property values to match.
+ * @returns {Function} Returns the new spec function.
+ */
+function baseMatches(source) {
+  var matchData = getMatchData(source);
+  if (matchData.length == 1 && matchData[0][2]) {
+    return matchesStrictComparable(matchData[0][0], matchData[0][1]);
+  }
+  return function(object) {
+    return object === source || baseIsMatch(object, source, matchData);
+  };
+}
+
+module.exports = baseMatches;
diff --git a/ddb_main/node_modules/lodash/_baseMatchesProperty.js b/ddb_main/node_modules/lodash/_baseMatchesProperty.js
new file mode 100644
index 0000000..24afd89
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseMatchesProperty.js
@@ -0,0 +1,33 @@
+var baseIsEqual = require('./_baseIsEqual'),
+    get = require('./get'),
+    hasIn = require('./hasIn'),
+    isKey = require('./_isKey'),
+    isStrictComparable = require('./_isStrictComparable'),
+    matchesStrictComparable = require('./_matchesStrictComparable'),
+    toKey = require('./_toKey');
+
+/** Used to compose bitmasks for value comparisons. */
+var COMPARE_PARTIAL_FLAG = 1,
+    COMPARE_UNORDERED_FLAG = 2;
+
+/**
+ * The base implementation of `_.matchesProperty` which doesn't clone `srcValue`.
+ *
+ * @private
+ * @param {string} path The path of the property to get.
+ * @param {*} srcValue The value to match.
+ * @returns {Function} Returns the new spec function.
+ */
+function baseMatchesProperty(path, srcValue) {
+  if (isKey(path) && isStrictComparable(srcValue)) {
+    return matchesStrictComparable(toKey(path), srcValue);
+  }
+  return function(object) {
+    var objValue = get(object, path);
+    return (objValue === undefined && objValue === srcValue)
+      ? hasIn(object, path)
+      : baseIsEqual(srcValue, objValue, COMPARE_PARTIAL_FLAG | COMPARE_UNORDERED_FLAG);
+  };
+}
+
+module.exports = baseMatchesProperty;
diff --git a/ddb_main/node_modules/lodash/_baseOrderBy.js b/ddb_main/node_modules/lodash/_baseOrderBy.js
new file mode 100644
index 0000000..775a017
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseOrderBy.js
@@ -0,0 +1,49 @@
+var arrayMap = require('./_arrayMap'),
+    baseGet = require('./_baseGet'),
+    baseIteratee = require('./_baseIteratee'),
+    baseMap = require('./_baseMap'),
+    baseSortBy = require('./_baseSortBy'),
+    baseUnary = require('./_baseUnary'),
+    compareMultiple = require('./_compareMultiple'),
+    identity = require('./identity'),
+    isArray = require('./isArray');
+
+/**
+ * The base implementation of `_.orderBy` without param guards.
+ *
+ * @private
+ * @param {Array|Object} collection The collection to iterate over.
+ * @param {Function[]|Object[]|string[]} iteratees The iteratees to sort by.
+ * @param {string[]} orders The sort orders of `iteratees`.
+ * @returns {Array} Returns the new sorted array.
+ */
+function baseOrderBy(collection, iteratees, orders) {
+  if (iteratees.length) {
+    iteratees = arrayMap(iteratees, function(iteratee) {
+      if (isArray(iteratee)) {
+        return function(value) {
+          return baseGet(value, iteratee.length === 1 ? iteratee[0] : iteratee);
+        }
+      }
+      return iteratee;
+    });
+  } else {
+    iteratees = [identity];
+  }
+
+  var index = -1;
+  iteratees = arrayMap(iteratees, baseUnary(baseIteratee));
+
+  var result = baseMap(collection, function(value, key, collection) {
+    var criteria = arrayMap(iteratees, function(iteratee) {
+      return iteratee(value);
+    });
+    return { 'criteria': criteria, 'index': ++index, 'value': value };
+  });
+
+  return baseSortBy(result, function(object, other) {
+    return compareMultiple(object, other, orders);
+  });
+}
+
+module.exports = baseOrderBy;
diff --git a/ddb_main/node_modules/lodash/_baseProperty.js b/ddb_main/node_modules/lodash/_baseProperty.js
new file mode 100644
index 0000000..496281e
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseProperty.js
@@ -0,0 +1,14 @@
+/**
+ * The base implementation of `_.property` without support for deep paths.
+ *
+ * @private
+ * @param {string} key The key of the property to get.
+ * @returns {Function} Returns the new accessor function.
+ */
+function baseProperty(key) {
+  return function(object) {
+    return object == null ? undefined : object[key];
+  };
+}
+
+module.exports = baseProperty;
diff --git a/ddb_main/node_modules/lodash/_basePropertyDeep.js b/ddb_main/node_modules/lodash/_basePropertyDeep.js
new file mode 100644
index 0000000..1e5aae5
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_basePropertyDeep.js
@@ -0,0 +1,16 @@
+var baseGet = require('./_baseGet');
+
+/**
+ * A specialized version of `baseProperty` which supports deep paths.
+ *
+ * @private
+ * @param {Array|string} path The path of the property to get.
+ * @returns {Function} Returns the new accessor function.
+ */
+function basePropertyDeep(path) {
+  return function(object) {
+    return baseGet(object, path);
+  };
+}
+
+module.exports = basePropertyDeep;
diff --git a/ddb_main/node_modules/lodash/_baseRest.js b/ddb_main/node_modules/lodash/_baseRest.js
new file mode 100644
index 0000000..d0dc4bd
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseRest.js
@@ -0,0 +1,17 @@
+var identity = require('./identity'),
+    overRest = require('./_overRest'),
+    setToString = require('./_setToString');
+
+/**
+ * The base implementation of `_.rest` which doesn't validate or coerce arguments.
+ *
+ * @private
+ * @param {Function} func The function to apply a rest parameter to.
+ * @param {number} [start=func.length-1] The start position of the rest parameter.
+ * @returns {Function} Returns the new function.
+ */
+function baseRest(func, start) {
+  return setToString(overRest(func, start, identity), func + '');
+}
+
+module.exports = baseRest;
diff --git a/ddb_main/node_modules/lodash/_baseSetToString.js b/ddb_main/node_modules/lodash/_baseSetToString.js
new file mode 100644
index 0000000..89eaca3
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseSetToString.js
@@ -0,0 +1,22 @@
+var constant = require('./constant'),
+    defineProperty = require('./_defineProperty'),
+    identity = require('./identity');
+
+/**
+ * The base implementation of `setToString` without support for hot loop shorting.
+ *
+ * @private
+ * @param {Function} func The function to modify.
+ * @param {Function} string The `toString` result.
+ * @returns {Function} Returns `func`.
+ */
+var baseSetToString = !defineProperty ? identity : function(func, string) {
+  return defineProperty(func, 'toString', {
+    'configurable': true,
+    'enumerable': false,
+    'value': constant(string),
+    'writable': true
+  });
+};
+
+module.exports = baseSetToString;
diff --git a/ddb_main/node_modules/lodash/_baseSortBy.js b/ddb_main/node_modules/lodash/_baseSortBy.js
new file mode 100644
index 0000000..a25c92e
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseSortBy.js
@@ -0,0 +1,21 @@
+/**
+ * The base implementation of `_.sortBy` which uses `comparer` to define the
+ * sort order of `array` and replaces criteria objects with their corresponding
+ * values.
+ *
+ * @private
+ * @param {Array} array The array to sort.
+ * @param {Function} comparer The function to define sort order.
+ * @returns {Array} Returns `array`.
+ */
+function baseSortBy(array, comparer) {
+  var length = array.length;
+
+  array.sort(comparer);
+  while (length--) {
+    array[length] = array[length].value;
+  }
+  return array;
+}
+
+module.exports = baseSortBy;
diff --git a/ddb_main/node_modules/lodash/_baseTimes.js b/ddb_main/node_modules/lodash/_baseTimes.js
new file mode 100644
index 0000000..0603fc3
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseTimes.js
@@ -0,0 +1,20 @@
+/**
+ * The base implementation of `_.times` without support for iteratee shorthands
+ * or max array length checks.
+ *
+ * @private
+ * @param {number} n The number of times to invoke `iteratee`.
+ * @param {Function} iteratee The function invoked per iteration.
+ * @returns {Array} Returns the array of results.
+ */
+function baseTimes(n, iteratee) {
+  var index = -1,
+      result = Array(n);
+
+  while (++index < n) {
+    result[index] = iteratee(index);
+  }
+  return result;
+}
+
+module.exports = baseTimes;
diff --git a/ddb_main/node_modules/lodash/_baseToString.js b/ddb_main/node_modules/lodash/_baseToString.js
new file mode 100644
index 0000000..ada6ad2
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseToString.js
@@ -0,0 +1,37 @@
+var Symbol = require('./_Symbol'),
+    arrayMap = require('./_arrayMap'),
+    isArray = require('./isArray'),
+    isSymbol = require('./isSymbol');
+
+/** Used as references for various `Number` constants. */
+var INFINITY = 1 / 0;
+
+/** Used to convert symbols to primitives and strings. */
+var symbolProto = Symbol ? Symbol.prototype : undefined,
+    symbolToString = symbolProto ? symbolProto.toString : undefined;
+
+/**
+ * The base implementation of `_.toString` which doesn't convert nullish
+ * values to empty strings.
+ *
+ * @private
+ * @param {*} value The value to process.
+ * @returns {string} Returns the string.
+ */
+function baseToString(value) {
+  // Exit early for strings to avoid a performance hit in some environments.
+  if (typeof value == 'string') {
+    return value;
+  }
+  if (isArray(value)) {
+    // Recursively convert values (susceptible to call stack limits).
+    return arrayMap(value, baseToString) + '';
+  }
+  if (isSymbol(value)) {
+    return symbolToString ? symbolToString.call(value) : '';
+  }
+  var result = (value + '');
+  return (result == '0' && (1 / value) == -INFINITY) ? '-0' : result;
+}
+
+module.exports = baseToString;
diff --git a/ddb_main/node_modules/lodash/_baseUnary.js b/ddb_main/node_modules/lodash/_baseUnary.js
new file mode 100644
index 0000000..98639e9
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_baseUnary.js
@@ -0,0 +1,14 @@
+/**
+ * The base implementation of `_.unary` without support for storing metadata.
+ *
+ * @private
+ * @param {Function} func The function to cap arguments for.
+ * @returns {Function} Returns the new capped function.
+ */
+function baseUnary(func) {
+  return function(value) {
+    return func(value);
+  };
+}
+
+module.exports = baseUnary;
diff --git a/ddb_main/node_modules/lodash/_cacheHas.js b/ddb_main/node_modules/lodash/_cacheHas.js
new file mode 100644
index 0000000..2dec892
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_cacheHas.js
@@ -0,0 +1,13 @@
+/**
+ * Checks if a `cache` value for `key` exists.
+ *
+ * @private
+ * @param {Object} cache The cache to query.
+ * @param {string} key The key of the entry to check.
+ * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
+ */
+function cacheHas(cache, key) {
+  return cache.has(key);
+}
+
+module.exports = cacheHas;
diff --git a/ddb_main/node_modules/lodash/_castPath.js b/ddb_main/node_modules/lodash/_castPath.js
new file mode 100644
index 0000000..017e4c1
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_castPath.js
@@ -0,0 +1,21 @@
+var isArray = require('./isArray'),
+    isKey = require('./_isKey'),
+    stringToPath = require('./_stringToPath'),
+    toString = require('./toString');
+
+/**
+ * Casts `value` to a path array if it's not one.
+ *
+ * @private
+ * @param {*} value The value to inspect.
+ * @param {Object} [object] The object to query keys on.
+ * @returns {Array} Returns the cast property path array.
+ */
+function castPath(value, object) {
+  if (isArray(value)) {
+    return value;
+  }
+  return isKey(value, object) ? [value] : stringToPath(toString(value));
+}
+
+module.exports = castPath;
diff --git a/ddb_main/node_modules/lodash/_compareAscending.js b/ddb_main/node_modules/lodash/_compareAscending.js
new file mode 100644
index 0000000..8dc2791
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_compareAscending.js
@@ -0,0 +1,41 @@
+var isSymbol = require('./isSymbol');
+
+/**
+ * Compares values to sort them in ascending order.
+ *
+ * @private
+ * @param {*} value The value to compare.
+ * @param {*} other The other value to compare.
+ * @returns {number} Returns the sort order indicator for `value`.
+ */
+function compareAscending(value, other) {
+  if (value !== other) {
+    var valIsDefined = value !== undefined,
+        valIsNull = value === null,
+        valIsReflexive = value === value,
+        valIsSymbol = isSymbol(value);
+
+    var othIsDefined = other !== undefined,
+        othIsNull = other === null,
+        othIsReflexive = other === other,
+        othIsSymbol = isSymbol(other);
+
+    if ((!othIsNull && !othIsSymbol && !valIsSymbol && value > other) ||
+        (valIsSymbol && othIsDefined && othIsReflexive && !othIsNull && !othIsSymbol) ||
+        (valIsNull && othIsDefined && othIsReflexive) ||
+        (!valIsDefined && othIsReflexive) ||
+        !valIsReflexive) {
+      return 1;
+    }
+    if ((!valIsNull && !valIsSymbol && !othIsSymbol && value < other) ||
+        (othIsSymbol && valIsDefined && valIsReflexive && !valIsNull && !valIsSymbol) ||
+        (othIsNull && valIsDefined && valIsReflexive) ||
+        (!othIsDefined && valIsReflexive) ||
+        !othIsReflexive) {
+      return -1;
+    }
+  }
+  return 0;
+}
+
+module.exports = compareAscending;
diff --git a/ddb_main/node_modules/lodash/_compareMultiple.js b/ddb_main/node_modules/lodash/_compareMultiple.js
new file mode 100644
index 0000000..ad61f0f
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_compareMultiple.js
@@ -0,0 +1,44 @@
+var compareAscending = require('./_compareAscending');
+
+/**
+ * Used by `_.orderBy` to compare multiple properties of a value to another
+ * and stable sort them.
+ *
+ * If `orders` is unspecified, all values are sorted in ascending order. Otherwise,
+ * specify an order of "desc" for descending or "asc" for ascending sort order
+ * of corresponding values.
+ *
+ * @private
+ * @param {Object} object The object to compare.
+ * @param {Object} other The other object to compare.
+ * @param {boolean[]|string[]} orders The order to sort by for each property.
+ * @returns {number} Returns the sort order indicator for `object`.
+ */
+function compareMultiple(object, other, orders) {
+  var index = -1,
+      objCriteria = object.criteria,
+      othCriteria = other.criteria,
+      length = objCriteria.length,
+      ordersLength = orders.length;
+
+  while (++index < length) {
+    var result = compareAscending(objCriteria[index], othCriteria[index]);
+    if (result) {
+      if (index >= ordersLength) {
+        return result;
+      }
+      var order = orders[index];
+      return result * (order == 'desc' ? -1 : 1);
+    }
+  }
+  // Fixes an `Array#sort` bug in the JS engine embedded in Adobe applications
+  // that causes it, under certain circumstances, to provide the same value for
+  // `object` and `other`. See https://github.com/jashkenas/underscore/pull/1247
+  // for more details.
+  //
+  // This also ensures a stable sort in V8 and other engines.
+  // See https://bugs.chromium.org/p/v8/issues/detail?id=90 for more details.
+  return object.index - other.index;
+}
+
+module.exports = compareMultiple;
diff --git a/ddb_main/node_modules/lodash/_coreJsData.js b/ddb_main/node_modules/lodash/_coreJsData.js
new file mode 100644
index 0000000..f8e5b4e
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_coreJsData.js
@@ -0,0 +1,6 @@
+var root = require('./_root');
+
+/** Used to detect overreaching core-js shims. */
+var coreJsData = root['__core-js_shared__'];
+
+module.exports = coreJsData;
diff --git a/ddb_main/node_modules/lodash/_createAggregator.js b/ddb_main/node_modules/lodash/_createAggregator.js
new file mode 100644
index 0000000..0be42c4
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_createAggregator.js
@@ -0,0 +1,23 @@
+var arrayAggregator = require('./_arrayAggregator'),
+    baseAggregator = require('./_baseAggregator'),
+    baseIteratee = require('./_baseIteratee'),
+    isArray = require('./isArray');
+
+/**
+ * Creates a function like `_.groupBy`.
+ *
+ * @private
+ * @param {Function} setter The function to set accumulator values.
+ * @param {Function} [initializer] The accumulator object initializer.
+ * @returns {Function} Returns the new aggregator function.
+ */
+function createAggregator(setter, initializer) {
+  return function(collection, iteratee) {
+    var func = isArray(collection) ? arrayAggregator : baseAggregator,
+        accumulator = initializer ? initializer() : {};
+
+    return func(collection, setter, baseIteratee(iteratee, 2), accumulator);
+  };
+}
+
+module.exports = createAggregator;
diff --git a/ddb_main/node_modules/lodash/_createBaseEach.js b/ddb_main/node_modules/lodash/_createBaseEach.js
new file mode 100644
index 0000000..d24fdd1
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_createBaseEach.js
@@ -0,0 +1,32 @@
+var isArrayLike = require('./isArrayLike');
+
+/**
+ * Creates a `baseEach` or `baseEachRight` function.
+ *
+ * @private
+ * @param {Function} eachFunc The function to iterate over a collection.
+ * @param {boolean} [fromRight] Specify iterating from right to left.
+ * @returns {Function} Returns the new base function.
+ */
+function createBaseEach(eachFunc, fromRight) {
+  return function(collection, iteratee) {
+    if (collection == null) {
+      return collection;
+    }
+    if (!isArrayLike(collection)) {
+      return eachFunc(collection, iteratee);
+    }
+    var length = collection.length,
+        index = fromRight ? length : -1,
+        iterable = Object(collection);
+
+    while ((fromRight ? index-- : ++index < length)) {
+      if (iteratee(iterable[index], index, iterable) === false) {
+        break;
+      }
+    }
+    return collection;
+  };
+}
+
+module.exports = createBaseEach;
diff --git a/ddb_main/node_modules/lodash/_createBaseFor.js b/ddb_main/node_modules/lodash/_createBaseFor.js
new file mode 100644
index 0000000..94cbf29
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_createBaseFor.js
@@ -0,0 +1,25 @@
+/**
+ * Creates a base function for methods like `_.forIn` and `_.forOwn`.
+ *
+ * @private
+ * @param {boolean} [fromRight] Specify iterating from right to left.
+ * @returns {Function} Returns the new base function.
+ */
+function createBaseFor(fromRight) {
+  return function(object, iteratee, keysFunc) {
+    var index = -1,
+        iterable = Object(object),
+        props = keysFunc(object),
+        length = props.length;
+
+    while (length--) {
+      var key = props[fromRight ? length : ++index];
+      if (iteratee(iterable[key], key, iterable) === false) {
+        break;
+      }
+    }
+    return object;
+  };
+}
+
+module.exports = createBaseFor;
diff --git a/ddb_main/node_modules/lodash/_defineProperty.js b/ddb_main/node_modules/lodash/_defineProperty.js
new file mode 100644
index 0000000..b6116d9
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_defineProperty.js
@@ -0,0 +1,11 @@
+var getNative = require('./_getNative');
+
+var defineProperty = (function() {
+  try {
+    var func = getNative(Object, 'defineProperty');
+    func({}, '', {});
+    return func;
+  } catch (e) {}
+}());
+
+module.exports = defineProperty;
diff --git a/ddb_main/node_modules/lodash/_equalArrays.js b/ddb_main/node_modules/lodash/_equalArrays.js
new file mode 100644
index 0000000..824228c
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_equalArrays.js
@@ -0,0 +1,84 @@
+var SetCache = require('./_SetCache'),
+    arraySome = require('./_arraySome'),
+    cacheHas = require('./_cacheHas');
+
+/** Used to compose bitmasks for value comparisons. */
+var COMPARE_PARTIAL_FLAG = 1,
+    COMPARE_UNORDERED_FLAG = 2;
+
+/**
+ * A specialized version of `baseIsEqualDeep` for arrays with support for
+ * partial deep comparisons.
+ *
+ * @private
+ * @param {Array} array The array to compare.
+ * @param {Array} other The other array to compare.
+ * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
+ * @param {Function} customizer The function to customize comparisons.
+ * @param {Function} equalFunc The function to determine equivalents of values.
+ * @param {Object} stack Tracks traversed `array` and `other` objects.
+ * @returns {boolean} Returns `true` if the arrays are equivalent, else `false`.
+ */
+function equalArrays(array, other, bitmask, customizer, equalFunc, stack) {
+  var isPartial = bitmask & COMPARE_PARTIAL_FLAG,
+      arrLength = array.length,
+      othLength = other.length;
+
+  if (arrLength != othLength && !(isPartial && othLength > arrLength)) {
+    return false;
+  }
+  // Check that cyclic values are equal.
+  var arrStacked = stack.get(array);
+  var othStacked = stack.get(other);
+  if (arrStacked && othStacked) {
+    return arrStacked == other && othStacked == array;
+  }
+  var index = -1,
+      result = true,
+      seen = (bitmask & COMPARE_UNORDERED_FLAG) ? new SetCache : undefined;
+
+  stack.set(array, other);
+  stack.set(other, array);
+
+  // Ignore non-index properties.
+  while (++index < arrLength) {
+    var arrValue = array[index],
+        othValue = other[index];
+
+    if (customizer) {
+      var compared = isPartial
+        ? customizer(othValue, arrValue, index, other, array, stack)
+        : customizer(arrValue, othValue, index, array, other, stack);
+    }
+    if (compared !== undefined) {
+      if (compared) {
+        continue;
+      }
+      result = false;
+      break;
+    }
+    // Recursively compare arrays (susceptible to call stack limits).
+    if (seen) {
+      if (!arraySome(other, function(othValue, othIndex) {
+            if (!cacheHas(seen, othIndex) &&
+                (arrValue === othValue || equalFunc(arrValue, othValue, bitmask, customizer, stack))) {
+              return seen.push(othIndex);
+            }
+          })) {
+        result = false;
+        break;
+      }
+    } else if (!(
+          arrValue === othValue ||
+            equalFunc(arrValue, othValue, bitmask, customizer, stack)
+        )) {
+      result = false;
+      break;
+    }
+  }
+  stack['delete'](array);
+  stack['delete'](other);
+  return result;
+}
+
+module.exports = equalArrays;
diff --git a/ddb_main/node_modules/lodash/_equalByTag.js b/ddb_main/node_modules/lodash/_equalByTag.js
new file mode 100644
index 0000000..71919e8
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_equalByTag.js
@@ -0,0 +1,112 @@
+var Symbol = require('./_Symbol'),
+    Uint8Array = require('./_Uint8Array'),
+    eq = require('./eq'),
+    equalArrays = require('./_equalArrays'),
+    mapToArray = require('./_mapToArray'),
+    setToArray = require('./_setToArray');
+
+/** Used to compose bitmasks for value comparisons. */
+var COMPARE_PARTIAL_FLAG = 1,
+    COMPARE_UNORDERED_FLAG = 2;
+
+/** `Object#toString` result references. */
+var boolTag = '[object Boolean]',
+    dateTag = '[object Date]',
+    errorTag = '[object Error]',
+    mapTag = '[object Map]',
+    numberTag = '[object Number]',
+    regexpTag = '[object RegExp]',
+    setTag = '[object Set]',
+    stringTag = '[object String]',
+    symbolTag = '[object Symbol]';
+
+var arrayBufferTag = '[object ArrayBuffer]',
+    dataViewTag = '[object DataView]';
+
+/** Used to convert symbols to primitives and strings. */
+var symbolProto = Symbol ? Symbol.prototype : undefined,
+    symbolValueOf = symbolProto ? symbolProto.valueOf : undefined;
+
+/**
+ * A specialized version of `baseIsEqualDeep` for comparing objects of
+ * the same `toStringTag`.
+ *
+ * **Note:** This function only supports comparing values with tags of
+ * `Boolean`, `Date`, `Error`, `Number`, `RegExp`, or `String`.
+ *
+ * @private
+ * @param {Object} object The object to compare.
+ * @param {Object} other The other object to compare.
+ * @param {string} tag The `toStringTag` of the objects to compare.
+ * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
+ * @param {Function} customizer The function to customize comparisons.
+ * @param {Function} equalFunc The function to determine equivalents of values.
+ * @param {Object} stack Tracks traversed `object` and `other` objects.
+ * @returns {boolean} Returns `true` if the objects are equivalent, else `false`.
+ */
+function equalByTag(object, other, tag, bitmask, customizer, equalFunc, stack) {
+  switch (tag) {
+    case dataViewTag:
+      if ((object.byteLength != other.byteLength) ||
+          (object.byteOffset != other.byteOffset)) {
+        return false;
+      }
+      object = object.buffer;
+      other = other.buffer;
+
+    case arrayBufferTag:
+      if ((object.byteLength != other.byteLength) ||
+          !equalFunc(new Uint8Array(object), new Uint8Array(other))) {
+        return false;
+      }
+      return true;
+
+    case boolTag:
+    case dateTag:
+    case numberTag:
+      // Coerce booleans to `1` or `0` and dates to milliseconds.
+      // Invalid dates are coerced to `NaN`.
+      return eq(+object, +other);
+
+    case errorTag:
+      return object.name == other.name && object.message == other.message;
+
+    case regexpTag:
+    case stringTag:
+      // Coerce regexes to strings and treat strings, primitives and objects,
+      // as equal. See http://www.ecma-international.org/ecma-262/7.0/#sec-regexp.prototype.tostring
+      // for more details.
+      return object == (other + '');
+
+    case mapTag:
+      var convert = mapToArray;
+
+    case setTag:
+      var isPartial = bitmask & COMPARE_PARTIAL_FLAG;
+      convert || (convert = setToArray);
+
+      if (object.size != other.size && !isPartial) {
+        return false;
+      }
+      // Assume cyclic values are equal.
+      var stacked = stack.get(object);
+      if (stacked) {
+        return stacked == other;
+      }
+      bitmask |= COMPARE_UNORDERED_FLAG;
+
+      // Recursively compare objects (susceptible to call stack limits).
+      stack.set(object, other);
+      var result = equalArrays(convert(object), convert(other), bitmask, customizer, equalFunc, stack);
+      stack['delete'](object);
+      return result;
+
+    case symbolTag:
+      if (symbolValueOf) {
+        return symbolValueOf.call(object) == symbolValueOf.call(other);
+      }
+  }
+  return false;
+}
+
+module.exports = equalByTag;
diff --git a/ddb_main/node_modules/lodash/_equalObjects.js b/ddb_main/node_modules/lodash/_equalObjects.js
new file mode 100644
index 0000000..cdaacd2
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_equalObjects.js
@@ -0,0 +1,90 @@
+var getAllKeys = require('./_getAllKeys');
+
+/** Used to compose bitmasks for value comparisons. */
+var COMPARE_PARTIAL_FLAG = 1;
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty = objectProto.hasOwnProperty;
+
+/**
+ * A specialized version of `baseIsEqualDeep` for objects with support for
+ * partial deep comparisons.
+ *
+ * @private
+ * @param {Object} object The object to compare.
+ * @param {Object} other The other object to compare.
+ * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
+ * @param {Function} customizer The function to customize comparisons.
+ * @param {Function} equalFunc The function to determine equivalents of values.
+ * @param {Object} stack Tracks traversed `object` and `other` objects.
+ * @returns {boolean} Returns `true` if the objects are equivalent, else `false`.
+ */
+function equalObjects(object, other, bitmask, customizer, equalFunc, stack) {
+  var isPartial = bitmask & COMPARE_PARTIAL_FLAG,
+      objProps = getAllKeys(object),
+      objLength = objProps.length,
+      othProps = getAllKeys(other),
+      othLength = othProps.length;
+
+  if (objLength != othLength && !isPartial) {
+    return false;
+  }
+  var index = objLength;
+  while (index--) {
+    var key = objProps[index];
+    if (!(isPartial ? key in other : hasOwnProperty.call(other, key))) {
+      return false;
+    }
+  }
+  // Check that cyclic values are equal.
+  var objStacked = stack.get(object);
+  var othStacked = stack.get(other);
+  if (objStacked && othStacked) {
+    return objStacked == other && othStacked == object;
+  }
+  var result = true;
+  stack.set(object, other);
+  stack.set(other, object);
+
+  var skipCtor = isPartial;
+  while (++index < objLength) {
+    key = objProps[index];
+    var objValue = object[key],
+        othValue = other[key];
+
+    if (customizer) {
+      var compared = isPartial
+        ? customizer(othValue, objValue, key, other, object, stack)
+        : customizer(objValue, othValue, key, object, other, stack);
+    }
+    // Recursively compare objects (susceptible to call stack limits).
+    if (!(compared === undefined
+          ? (objValue === othValue || equalFunc(objValue, othValue, bitmask, customizer, stack))
+          : compared
+        )) {
+      result = false;
+      break;
+    }
+    skipCtor || (skipCtor = key == 'constructor');
+  }
+  if (result && !skipCtor) {
+    var objCtor = object.constructor,
+        othCtor = other.constructor;
+
+    // Non `Object` object instances with different constructors are not equal.
+    if (objCtor != othCtor &&
+        ('constructor' in object && 'constructor' in other) &&
+        !(typeof objCtor == 'function' && objCtor instanceof objCtor &&
+          typeof othCtor == 'function' && othCtor instanceof othCtor)) {
+      result = false;
+    }
+  }
+  stack['delete'](object);
+  stack['delete'](other);
+  return result;
+}
+
+module.exports = equalObjects;
diff --git a/ddb_main/node_modules/lodash/_freeGlobal.js b/ddb_main/node_modules/lodash/_freeGlobal.js
new file mode 100644
index 0000000..bbec998
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_freeGlobal.js
@@ -0,0 +1,4 @@
+/** Detect free variable `global` from Node.js. */
+var freeGlobal = typeof global == 'object' && global && global.Object === Object && global;
+
+module.exports = freeGlobal;
diff --git a/ddb_main/node_modules/lodash/_getAllKeys.js b/ddb_main/node_modules/lodash/_getAllKeys.js
new file mode 100644
index 0000000..a9ce699
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_getAllKeys.js
@@ -0,0 +1,16 @@
+var baseGetAllKeys = require('./_baseGetAllKeys'),
+    getSymbols = require('./_getSymbols'),
+    keys = require('./keys');
+
+/**
+ * Creates an array of own enumerable property names and symbols of `object`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the array of property names and symbols.
+ */
+function getAllKeys(object) {
+  return baseGetAllKeys(object, keys, getSymbols);
+}
+
+module.exports = getAllKeys;
diff --git a/ddb_main/node_modules/lodash/_getMapData.js b/ddb_main/node_modules/lodash/_getMapData.js
new file mode 100644
index 0000000..17f6303
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_getMapData.js
@@ -0,0 +1,18 @@
+var isKeyable = require('./_isKeyable');
+
+/**
+ * Gets the data for `map`.
+ *
+ * @private
+ * @param {Object} map The map to query.
+ * @param {string} key The reference key.
+ * @returns {*} Returns the map data.
+ */
+function getMapData(map, key) {
+  var data = map.__data__;
+  return isKeyable(key)
+    ? data[typeof key == 'string' ? 'string' : 'hash']
+    : data.map;
+}
+
+module.exports = getMapData;
diff --git a/ddb_main/node_modules/lodash/_getMatchData.js b/ddb_main/node_modules/lodash/_getMatchData.js
new file mode 100644
index 0000000..2cc70f9
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_getMatchData.js
@@ -0,0 +1,24 @@
+var isStrictComparable = require('./_isStrictComparable'),
+    keys = require('./keys');
+
+/**
+ * Gets the property names, values, and compare flags of `object`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the match data of `object`.
+ */
+function getMatchData(object) {
+  var result = keys(object),
+      length = result.length;
+
+  while (length--) {
+    var key = result[length],
+        value = object[key];
+
+    result[length] = [key, value, isStrictComparable(value)];
+  }
+  return result;
+}
+
+module.exports = getMatchData;
diff --git a/ddb_main/node_modules/lodash/_getNative.js b/ddb_main/node_modules/lodash/_getNative.js
new file mode 100644
index 0000000..97a622b
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_getNative.js
@@ -0,0 +1,17 @@
+var baseIsNative = require('./_baseIsNative'),
+    getValue = require('./_getValue');
+
+/**
+ * Gets the native function at `key` of `object`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @param {string} key The key of the method to get.
+ * @returns {*} Returns the function if it's native, else `undefined`.
+ */
+function getNative(object, key) {
+  var value = getValue(object, key);
+  return baseIsNative(value) ? value : undefined;
+}
+
+module.exports = getNative;
diff --git a/ddb_main/node_modules/lodash/_getRawTag.js b/ddb_main/node_modules/lodash/_getRawTag.js
new file mode 100644
index 0000000..49a95c9
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_getRawTag.js
@@ -0,0 +1,46 @@
+var Symbol = require('./_Symbol');
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty = objectProto.hasOwnProperty;
+
+/**
+ * Used to resolve the
+ * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
+ * of values.
+ */
+var nativeObjectToString = objectProto.toString;
+
+/** Built-in value references. */
+var symToStringTag = Symbol ? Symbol.toStringTag : undefined;
+
+/**
+ * A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values.
+ *
+ * @private
+ * @param {*} value The value to query.
+ * @returns {string} Returns the raw `toStringTag`.
+ */
+function getRawTag(value) {
+  var isOwn = hasOwnProperty.call(value, symToStringTag),
+      tag = value[symToStringTag];
+
+  try {
+    value[symToStringTag] = undefined;
+    var unmasked = true;
+  } catch (e) {}
+
+  var result = nativeObjectToString.call(value);
+  if (unmasked) {
+    if (isOwn) {
+      value[symToStringTag] = tag;
+    } else {
+      delete value[symToStringTag];
+    }
+  }
+  return result;
+}
+
+module.exports = getRawTag;
diff --git a/ddb_main/node_modules/lodash/_getSymbols.js b/ddb_main/node_modules/lodash/_getSymbols.js
new file mode 100644
index 0000000..7d6eafe
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_getSymbols.js
@@ -0,0 +1,30 @@
+var arrayFilter = require('./_arrayFilter'),
+    stubArray = require('./stubArray');
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/** Built-in value references. */
+var propertyIsEnumerable = objectProto.propertyIsEnumerable;
+
+/* Built-in method references for those with the same name as other `lodash` methods. */
+var nativeGetSymbols = Object.getOwnPropertySymbols;
+
+/**
+ * Creates an array of the own enumerable symbols of `object`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the array of symbols.
+ */
+var getSymbols = !nativeGetSymbols ? stubArray : function(object) {
+  if (object == null) {
+    return [];
+  }
+  object = Object(object);
+  return arrayFilter(nativeGetSymbols(object), function(symbol) {
+    return propertyIsEnumerable.call(object, symbol);
+  });
+};
+
+module.exports = getSymbols;
diff --git a/ddb_main/node_modules/lodash/_getTag.js b/ddb_main/node_modules/lodash/_getTag.js
new file mode 100644
index 0000000..deaf89d
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_getTag.js
@@ -0,0 +1,58 @@
+var DataView = require('./_DataView'),
+    Map = require('./_Map'),
+    Promise = require('./_Promise'),
+    Set = require('./_Set'),
+    WeakMap = require('./_WeakMap'),
+    baseGetTag = require('./_baseGetTag'),
+    toSource = require('./_toSource');
+
+/** `Object#toString` result references. */
+var mapTag = '[object Map]',
+    objectTag = '[object Object]',
+    promiseTag = '[object Promise]',
+    setTag = '[object Set]',
+    weakMapTag = '[object WeakMap]';
+
+var dataViewTag = '[object DataView]';
+
+/** Used to detect maps, sets, and weakmaps. */
+var dataViewCtorString = toSource(DataView),
+    mapCtorString = toSource(Map),
+    promiseCtorString = toSource(Promise),
+    setCtorString = toSource(Set),
+    weakMapCtorString = toSource(WeakMap);
+
+/**
+ * Gets the `toStringTag` of `value`.
+ *
+ * @private
+ * @param {*} value The value to query.
+ * @returns {string} Returns the `toStringTag`.
+ */
+var getTag = baseGetTag;
+
+// Fallback for data views, maps, sets, and weak maps in IE 11 and promises in Node.js < 6.
+if ((DataView && getTag(new DataView(new ArrayBuffer(1))) != dataViewTag) ||
+    (Map && getTag(new Map) != mapTag) ||
+    (Promise && getTag(Promise.resolve()) != promiseTag) ||
+    (Set && getTag(new Set) != setTag) ||
+    (WeakMap && getTag(new WeakMap) != weakMapTag)) {
+  getTag = function(value) {
+    var result = baseGetTag(value),
+        Ctor = result == objectTag ? value.constructor : undefined,
+        ctorString = Ctor ? toSource(Ctor) : '';
+
+    if (ctorString) {
+      switch (ctorString) {
+        case dataViewCtorString: return dataViewTag;
+        case mapCtorString: return mapTag;
+        case promiseCtorString: return promiseTag;
+        case setCtorString: return setTag;
+        case weakMapCtorString: return weakMapTag;
+      }
+    }
+    return result;
+  };
+}
+
+module.exports = getTag;
diff --git a/ddb_main/node_modules/lodash/_getValue.js b/ddb_main/node_modules/lodash/_getValue.js
new file mode 100644
index 0000000..5f7d773
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_getValue.js
@@ -0,0 +1,13 @@
+/**
+ * Gets the value at `key` of `object`.
+ *
+ * @private
+ * @param {Object} [object] The object to query.
+ * @param {string} key The key of the property to get.
+ * @returns {*} Returns the property value.
+ */
+function getValue(object, key) {
+  return object == null ? undefined : object[key];
+}
+
+module.exports = getValue;
diff --git a/ddb_main/node_modules/lodash/_hasPath.js b/ddb_main/node_modules/lodash/_hasPath.js
new file mode 100644
index 0000000..93dbde1
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_hasPath.js
@@ -0,0 +1,39 @@
+var castPath = require('./_castPath'),
+    isArguments = require('./isArguments'),
+    isArray = require('./isArray'),
+    isIndex = require('./_isIndex'),
+    isLength = require('./isLength'),
+    toKey = require('./_toKey');
+
+/**
+ * Checks if `path` exists on `object`.
+ *
+ * @private
+ * @param {Object} object The object to query.
+ * @param {Array|string} path The path to check.
+ * @param {Function} hasFunc The function to check properties.
+ * @returns {boolean} Returns `true` if `path` exists, else `false`.
+ */
+function hasPath(object, path, hasFunc) {
+  path = castPath(path, object);
+
+  var index = -1,
+      length = path.length,
+      result = false;
+
+  while (++index < length) {
+    var key = toKey(path[index]);
+    if (!(result = object != null && hasFunc(object, key))) {
+      break;
+    }
+    object = object[key];
+  }
+  if (result || ++index != length) {
+    return result;
+  }
+  length = object == null ? 0 : object.length;
+  return !!length && isLength(length) && isIndex(key, length) &&
+    (isArray(object) || isArguments(object));
+}
+
+module.exports = hasPath;
diff --git a/ddb_main/node_modules/lodash/_hashClear.js b/ddb_main/node_modules/lodash/_hashClear.js
new file mode 100644
index 0000000..5d4b70c
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_hashClear.js
@@ -0,0 +1,15 @@
+var nativeCreate = require('./_nativeCreate');
+
+/**
+ * Removes all key-value entries from the hash.
+ *
+ * @private
+ * @name clear
+ * @memberOf Hash
+ */
+function hashClear() {
+  this.__data__ = nativeCreate ? nativeCreate(null) : {};
+  this.size = 0;
+}
+
+module.exports = hashClear;
diff --git a/ddb_main/node_modules/lodash/_hashDelete.js b/ddb_main/node_modules/lodash/_hashDelete.js
new file mode 100644
index 0000000..ea9dabf
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_hashDelete.js
@@ -0,0 +1,17 @@
+/**
+ * Removes `key` and its value from the hash.
+ *
+ * @private
+ * @name delete
+ * @memberOf Hash
+ * @param {Object} hash The hash to modify.
+ * @param {string} key The key of the value to remove.
+ * @returns {boolean} Returns `true` if the entry was removed, else `false`.
+ */
+function hashDelete(key) {
+  var result = this.has(key) && delete this.__data__[key];
+  this.size -= result ? 1 : 0;
+  return result;
+}
+
+module.exports = hashDelete;
diff --git a/ddb_main/node_modules/lodash/_hashGet.js b/ddb_main/node_modules/lodash/_hashGet.js
new file mode 100644
index 0000000..1fc2f34
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_hashGet.js
@@ -0,0 +1,30 @@
+var nativeCreate = require('./_nativeCreate');
+
+/** Used to stand-in for `undefined` hash values. */
+var HASH_UNDEFINED = '__lodash_hash_undefined__';
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty = objectProto.hasOwnProperty;
+
+/**
+ * Gets the hash value for `key`.
+ *
+ * @private
+ * @name get
+ * @memberOf Hash
+ * @param {string} key The key of the value to get.
+ * @returns {*} Returns the entry value.
+ */
+function hashGet(key) {
+  var data = this.__data__;
+  if (nativeCreate) {
+    var result = data[key];
+    return result === HASH_UNDEFINED ? undefined : result;
+  }
+  return hasOwnProperty.call(data, key) ? data[key] : undefined;
+}
+
+module.exports = hashGet;
diff --git a/ddb_main/node_modules/lodash/_hashHas.js b/ddb_main/node_modules/lodash/_hashHas.js
new file mode 100644
index 0000000..281a551
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_hashHas.js
@@ -0,0 +1,23 @@
+var nativeCreate = require('./_nativeCreate');
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty = objectProto.hasOwnProperty;
+
+/**
+ * Checks if a hash value for `key` exists.
+ *
+ * @private
+ * @name has
+ * @memberOf Hash
+ * @param {string} key The key of the entry to check.
+ * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
+ */
+function hashHas(key) {
+  var data = this.__data__;
+  return nativeCreate ? (data[key] !== undefined) : hasOwnProperty.call(data, key);
+}
+
+module.exports = hashHas;
diff --git a/ddb_main/node_modules/lodash/_hashSet.js b/ddb_main/node_modules/lodash/_hashSet.js
new file mode 100644
index 0000000..e105528
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_hashSet.js
@@ -0,0 +1,23 @@
+var nativeCreate = require('./_nativeCreate');
+
+/** Used to stand-in for `undefined` hash values. */
+var HASH_UNDEFINED = '__lodash_hash_undefined__';
+
+/**
+ * Sets the hash `key` to `value`.
+ *
+ * @private
+ * @name set
+ * @memberOf Hash
+ * @param {string} key The key of the value to set.
+ * @param {*} value The value to set.
+ * @returns {Object} Returns the hash instance.
+ */
+function hashSet(key, value) {
+  var data = this.__data__;
+  this.size += this.has(key) ? 0 : 1;
+  data[key] = (nativeCreate && value === undefined) ? HASH_UNDEFINED : value;
+  return this;
+}
+
+module.exports = hashSet;
diff --git a/ddb_main/node_modules/lodash/_isFlattenable.js b/ddb_main/node_modules/lodash/_isFlattenable.js
new file mode 100644
index 0000000..4cc2c24
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_isFlattenable.js
@@ -0,0 +1,20 @@
+var Symbol = require('./_Symbol'),
+    isArguments = require('./isArguments'),
+    isArray = require('./isArray');
+
+/** Built-in value references. */
+var spreadableSymbol = Symbol ? Symbol.isConcatSpreadable : undefined;
+
+/**
+ * Checks if `value` is a flattenable `arguments` object or array.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is flattenable, else `false`.
+ */
+function isFlattenable(value) {
+  return isArray(value) || isArguments(value) ||
+    !!(spreadableSymbol && value && value[spreadableSymbol]);
+}
+
+module.exports = isFlattenable;
diff --git a/ddb_main/node_modules/lodash/_isIndex.js b/ddb_main/node_modules/lodash/_isIndex.js
new file mode 100644
index 0000000..061cd39
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_isIndex.js
@@ -0,0 +1,25 @@
+/** Used as references for various `Number` constants. */
+var MAX_SAFE_INTEGER = 9007199254740991;
+
+/** Used to detect unsigned integer values. */
+var reIsUint = /^(?:0|[1-9]\d*)$/;
+
+/**
+ * Checks if `value` is a valid array-like index.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.
+ * @returns {boolean} Returns `true` if `value` is a valid index, else `false`.
+ */
+function isIndex(value, length) {
+  var type = typeof value;
+  length = length == null ? MAX_SAFE_INTEGER : length;
+
+  return !!length &&
+    (type == 'number' ||
+      (type != 'symbol' && reIsUint.test(value))) &&
+        (value > -1 && value % 1 == 0 && value < length);
+}
+
+module.exports = isIndex;
diff --git a/ddb_main/node_modules/lodash/_isIterateeCall.js b/ddb_main/node_modules/lodash/_isIterateeCall.js
new file mode 100644
index 0000000..a0bb5a9
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_isIterateeCall.js
@@ -0,0 +1,30 @@
+var eq = require('./eq'),
+    isArrayLike = require('./isArrayLike'),
+    isIndex = require('./_isIndex'),
+    isObject = require('./isObject');
+
+/**
+ * Checks if the given arguments are from an iteratee call.
+ *
+ * @private
+ * @param {*} value The potential iteratee value argument.
+ * @param {*} index The potential iteratee index or key argument.
+ * @param {*} object The potential iteratee object argument.
+ * @returns {boolean} Returns `true` if the arguments are from an iteratee call,
+ *  else `false`.
+ */
+function isIterateeCall(value, index, object) {
+  if (!isObject(object)) {
+    return false;
+  }
+  var type = typeof index;
+  if (type == 'number'
+        ? (isArrayLike(object) && isIndex(index, object.length))
+        : (type == 'string' && index in object)
+      ) {
+    return eq(object[index], value);
+  }
+  return false;
+}
+
+module.exports = isIterateeCall;
diff --git a/ddb_main/node_modules/lodash/_isKey.js b/ddb_main/node_modules/lodash/_isKey.js
new file mode 100644
index 0000000..ff08b06
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_isKey.js
@@ -0,0 +1,29 @@
+var isArray = require('./isArray'),
+    isSymbol = require('./isSymbol');
+
+/** Used to match property names within property paths. */
+var reIsDeepProp = /\.|\[(?:[^[\]]*|(["'])(?:(?!\1)[^\\]|\\.)*?\1)\]/,
+    reIsPlainProp = /^\w*$/;
+
+/**
+ * Checks if `value` is a property name and not a property path.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @param {Object} [object] The object to query keys on.
+ * @returns {boolean} Returns `true` if `value` is a property name, else `false`.
+ */
+function isKey(value, object) {
+  if (isArray(value)) {
+    return false;
+  }
+  var type = typeof value;
+  if (type == 'number' || type == 'symbol' || type == 'boolean' ||
+      value == null || isSymbol(value)) {
+    return true;
+  }
+  return reIsPlainProp.test(value) || !reIsDeepProp.test(value) ||
+    (object != null && value in Object(object));
+}
+
+module.exports = isKey;
diff --git a/ddb_main/node_modules/lodash/_isKeyable.js b/ddb_main/node_modules/lodash/_isKeyable.js
new file mode 100644
index 0000000..39f1828
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_isKeyable.js
@@ -0,0 +1,15 @@
+/**
+ * Checks if `value` is suitable for use as unique object key.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is suitable, else `false`.
+ */
+function isKeyable(value) {
+  var type = typeof value;
+  return (type == 'string' || type == 'number' || type == 'symbol' || type == 'boolean')
+    ? (value !== '__proto__')
+    : (value === null);
+}
+
+module.exports = isKeyable;
diff --git a/ddb_main/node_modules/lodash/_isMasked.js b/ddb_main/node_modules/lodash/_isMasked.js
new file mode 100644
index 0000000..4b0f21b
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_isMasked.js
@@ -0,0 +1,20 @@
+var coreJsData = require('./_coreJsData');
+
+/** Used to detect methods masquerading as native. */
+var maskSrcKey = (function() {
+  var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || '');
+  return uid ? ('Symbol(src)_1.' + uid) : '';
+}());
+
+/**
+ * Checks if `func` has its source masked.
+ *
+ * @private
+ * @param {Function} func The function to check.
+ * @returns {boolean} Returns `true` if `func` is masked, else `false`.
+ */
+function isMasked(func) {
+  return !!maskSrcKey && (maskSrcKey in func);
+}
+
+module.exports = isMasked;
diff --git a/ddb_main/node_modules/lodash/_isPrototype.js b/ddb_main/node_modules/lodash/_isPrototype.js
new file mode 100644
index 0000000..0f29498
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_isPrototype.js
@@ -0,0 +1,18 @@
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/**
+ * Checks if `value` is likely a prototype object.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a prototype, else `false`.
+ */
+function isPrototype(value) {
+  var Ctor = value && value.constructor,
+      proto = (typeof Ctor == 'function' && Ctor.prototype) || objectProto;
+
+  return value === proto;
+}
+
+module.exports = isPrototype;
diff --git a/ddb_main/node_modules/lodash/_isStrictComparable.js b/ddb_main/node_modules/lodash/_isStrictComparable.js
new file mode 100644
index 0000000..b59f40b
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_isStrictComparable.js
@@ -0,0 +1,15 @@
+var isObject = require('./isObject');
+
+/**
+ * Checks if `value` is suitable for strict equality comparisons, i.e. `===`.
+ *
+ * @private
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` if suitable for strict
+ *  equality comparisons, else `false`.
+ */
+function isStrictComparable(value) {
+  return value === value && !isObject(value);
+}
+
+module.exports = isStrictComparable;
diff --git a/ddb_main/node_modules/lodash/_listCacheClear.js b/ddb_main/node_modules/lodash/_listCacheClear.js
new file mode 100644
index 0000000..acbe39a
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_listCacheClear.js
@@ -0,0 +1,13 @@
+/**
+ * Removes all key-value entries from the list cache.
+ *
+ * @private
+ * @name clear
+ * @memberOf ListCache
+ */
+function listCacheClear() {
+  this.__data__ = [];
+  this.size = 0;
+}
+
+module.exports = listCacheClear;
diff --git a/ddb_main/node_modules/lodash/_listCacheDelete.js b/ddb_main/node_modules/lodash/_listCacheDelete.js
new file mode 100644
index 0000000..b1384ad
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_listCacheDelete.js
@@ -0,0 +1,35 @@
+var assocIndexOf = require('./_assocIndexOf');
+
+/** Used for built-in method references. */
+var arrayProto = Array.prototype;
+
+/** Built-in value references. */
+var splice = arrayProto.splice;
+
+/**
+ * Removes `key` and its value from the list cache.
+ *
+ * @private
+ * @name delete
+ * @memberOf ListCache
+ * @param {string} key The key of the value to remove.
+ * @returns {boolean} Returns `true` if the entry was removed, else `false`.
+ */
+function listCacheDelete(key) {
+  var data = this.__data__,
+      index = assocIndexOf(data, key);
+
+  if (index < 0) {
+    return false;
+  }
+  var lastIndex = data.length - 1;
+  if (index == lastIndex) {
+    data.pop();
+  } else {
+    splice.call(data, index, 1);
+  }
+  --this.size;
+  return true;
+}
+
+module.exports = listCacheDelete;
diff --git a/ddb_main/node_modules/lodash/_listCacheGet.js b/ddb_main/node_modules/lodash/_listCacheGet.js
new file mode 100644
index 0000000..f8192fc
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_listCacheGet.js
@@ -0,0 +1,19 @@
+var assocIndexOf = require('./_assocIndexOf');
+
+/**
+ * Gets the list cache value for `key`.
+ *
+ * @private
+ * @name get
+ * @memberOf ListCache
+ * @param {string} key The key of the value to get.
+ * @returns {*} Returns the entry value.
+ */
+function listCacheGet(key) {
+  var data = this.__data__,
+      index = assocIndexOf(data, key);
+
+  return index < 0 ? undefined : data[index][1];
+}
+
+module.exports = listCacheGet;
diff --git a/ddb_main/node_modules/lodash/_listCacheHas.js b/ddb_main/node_modules/lodash/_listCacheHas.js
new file mode 100644
index 0000000..2adf671
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_listCacheHas.js
@@ -0,0 +1,16 @@
+var assocIndexOf = require('./_assocIndexOf');
+
+/**
+ * Checks if a list cache value for `key` exists.
+ *
+ * @private
+ * @name has
+ * @memberOf ListCache
+ * @param {string} key The key of the entry to check.
+ * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
+ */
+function listCacheHas(key) {
+  return assocIndexOf(this.__data__, key) > -1;
+}
+
+module.exports = listCacheHas;
diff --git a/ddb_main/node_modules/lodash/_listCacheSet.js b/ddb_main/node_modules/lodash/_listCacheSet.js
new file mode 100644
index 0000000..5855c95
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_listCacheSet.js
@@ -0,0 +1,26 @@
+var assocIndexOf = require('./_assocIndexOf');
+
+/**
+ * Sets the list cache `key` to `value`.
+ *
+ * @private
+ * @name set
+ * @memberOf ListCache
+ * @param {string} key The key of the value to set.
+ * @param {*} value The value to set.
+ * @returns {Object} Returns the list cache instance.
+ */
+function listCacheSet(key, value) {
+  var data = this.__data__,
+      index = assocIndexOf(data, key);
+
+  if (index < 0) {
+    ++this.size;
+    data.push([key, value]);
+  } else {
+    data[index][1] = value;
+  }
+  return this;
+}
+
+module.exports = listCacheSet;
diff --git a/ddb_main/node_modules/lodash/_mapCacheClear.js b/ddb_main/node_modules/lodash/_mapCacheClear.js
new file mode 100644
index 0000000..bc9ca20
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_mapCacheClear.js
@@ -0,0 +1,21 @@
+var Hash = require('./_Hash'),
+    ListCache = require('./_ListCache'),
+    Map = require('./_Map');
+
+/**
+ * Removes all key-value entries from the map.
+ *
+ * @private
+ * @name clear
+ * @memberOf MapCache
+ */
+function mapCacheClear() {
+  this.size = 0;
+  this.__data__ = {
+    'hash': new Hash,
+    'map': new (Map || ListCache),
+    'string': new Hash
+  };
+}
+
+module.exports = mapCacheClear;
diff --git a/ddb_main/node_modules/lodash/_mapCacheDelete.js b/ddb_main/node_modules/lodash/_mapCacheDelete.js
new file mode 100644
index 0000000..946ca3c
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_mapCacheDelete.js
@@ -0,0 +1,18 @@
+var getMapData = require('./_getMapData');
+
+/**
+ * Removes `key` and its value from the map.
+ *
+ * @private
+ * @name delete
+ * @memberOf MapCache
+ * @param {string} key The key of the value to remove.
+ * @returns {boolean} Returns `true` if the entry was removed, else `false`.
+ */
+function mapCacheDelete(key) {
+  var result = getMapData(this, key)['delete'](key);
+  this.size -= result ? 1 : 0;
+  return result;
+}
+
+module.exports = mapCacheDelete;
diff --git a/ddb_main/node_modules/lodash/_mapCacheGet.js b/ddb_main/node_modules/lodash/_mapCacheGet.js
new file mode 100644
index 0000000..f29f55c
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_mapCacheGet.js
@@ -0,0 +1,16 @@
+var getMapData = require('./_getMapData');
+
+/**
+ * Gets the map value for `key`.
+ *
+ * @private
+ * @name get
+ * @memberOf MapCache
+ * @param {string} key The key of the value to get.
+ * @returns {*} Returns the entry value.
+ */
+function mapCacheGet(key) {
+  return getMapData(this, key).get(key);
+}
+
+module.exports = mapCacheGet;
diff --git a/ddb_main/node_modules/lodash/_mapCacheHas.js b/ddb_main/node_modules/lodash/_mapCacheHas.js
new file mode 100644
index 0000000..a1214c0
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_mapCacheHas.js
@@ -0,0 +1,16 @@
+var getMapData = require('./_getMapData');
+
+/**
+ * Checks if a map value for `key` exists.
+ *
+ * @private
+ * @name has
+ * @memberOf MapCache
+ * @param {string} key The key of the entry to check.
+ * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
+ */
+function mapCacheHas(key) {
+  return getMapData(this, key).has(key);
+}
+
+module.exports = mapCacheHas;
diff --git a/ddb_main/node_modules/lodash/_mapCacheSet.js b/ddb_main/node_modules/lodash/_mapCacheSet.js
new file mode 100644
index 0000000..7346849
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_mapCacheSet.js
@@ -0,0 +1,22 @@
+var getMapData = require('./_getMapData');
+
+/**
+ * Sets the map `key` to `value`.
+ *
+ * @private
+ * @name set
+ * @memberOf MapCache
+ * @param {string} key The key of the value to set.
+ * @param {*} value The value to set.
+ * @returns {Object} Returns the map cache instance.
+ */
+function mapCacheSet(key, value) {
+  var data = getMapData(this, key),
+      size = data.size;
+
+  data.set(key, value);
+  this.size += data.size == size ? 0 : 1;
+  return this;
+}
+
+module.exports = mapCacheSet;
diff --git a/ddb_main/node_modules/lodash/_mapToArray.js b/ddb_main/node_modules/lodash/_mapToArray.js
new file mode 100644
index 0000000..fe3dd53
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_mapToArray.js
@@ -0,0 +1,18 @@
+/**
+ * Converts `map` to its key-value pairs.
+ *
+ * @private
+ * @param {Object} map The map to convert.
+ * @returns {Array} Returns the key-value pairs.
+ */
+function mapToArray(map) {
+  var index = -1,
+      result = Array(map.size);
+
+  map.forEach(function(value, key) {
+    result[++index] = [key, value];
+  });
+  return result;
+}
+
+module.exports = mapToArray;
diff --git a/ddb_main/node_modules/lodash/_matchesStrictComparable.js b/ddb_main/node_modules/lodash/_matchesStrictComparable.js
new file mode 100644
index 0000000..f608af9
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_matchesStrictComparable.js
@@ -0,0 +1,20 @@
+/**
+ * A specialized version of `matchesProperty` for source values suitable
+ * for strict equality comparisons, i.e. `===`.
+ *
+ * @private
+ * @param {string} key The key of the property to get.
+ * @param {*} srcValue The value to match.
+ * @returns {Function} Returns the new spec function.
+ */
+function matchesStrictComparable(key, srcValue) {
+  return function(object) {
+    if (object == null) {
+      return false;
+    }
+    return object[key] === srcValue &&
+      (srcValue !== undefined || (key in Object(object)));
+  };
+}
+
+module.exports = matchesStrictComparable;
diff --git a/ddb_main/node_modules/lodash/_memoizeCapped.js b/ddb_main/node_modules/lodash/_memoizeCapped.js
new file mode 100644
index 0000000..7f71c8f
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_memoizeCapped.js
@@ -0,0 +1,26 @@
+var memoize = require('./memoize');
+
+/** Used as the maximum memoize cache size. */
+var MAX_MEMOIZE_SIZE = 500;
+
+/**
+ * A specialized version of `_.memoize` which clears the memoized function's
+ * cache when it exceeds `MAX_MEMOIZE_SIZE`.
+ *
+ * @private
+ * @param {Function} func The function to have its output memoized.
+ * @returns {Function} Returns the new memoized function.
+ */
+function memoizeCapped(func) {
+  var result = memoize(func, function(key) {
+    if (cache.size === MAX_MEMOIZE_SIZE) {
+      cache.clear();
+    }
+    return key;
+  });
+
+  var cache = result.cache;
+  return result;
+}
+
+module.exports = memoizeCapped;
diff --git a/ddb_main/node_modules/lodash/_nativeCreate.js b/ddb_main/node_modules/lodash/_nativeCreate.js
new file mode 100644
index 0000000..c7aede8
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_nativeCreate.js
@@ -0,0 +1,6 @@
+var getNative = require('./_getNative');
+
+/* Built-in method references that are verified to be native. */
+var nativeCreate = getNative(Object, 'create');
+
+module.exports = nativeCreate;
diff --git a/ddb_main/node_modules/lodash/_nativeKeys.js b/ddb_main/node_modules/lodash/_nativeKeys.js
new file mode 100644
index 0000000..479a104
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_nativeKeys.js
@@ -0,0 +1,6 @@
+var overArg = require('./_overArg');
+
+/* Built-in method references for those with the same name as other `lodash` methods. */
+var nativeKeys = overArg(Object.keys, Object);
+
+module.exports = nativeKeys;
diff --git a/ddb_main/node_modules/lodash/_nodeUtil.js b/ddb_main/node_modules/lodash/_nodeUtil.js
new file mode 100644
index 0000000..983d78f
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_nodeUtil.js
@@ -0,0 +1,30 @@
+var freeGlobal = require('./_freeGlobal');
+
+/** Detect free variable `exports`. */
+var freeExports = typeof exports == 'object' && exports && !exports.nodeType && exports;
+
+/** Detect free variable `module`. */
+var freeModule = freeExports && typeof module == 'object' && module && !module.nodeType && module;
+
+/** Detect the popular CommonJS extension `module.exports`. */
+var moduleExports = freeModule && freeModule.exports === freeExports;
+
+/** Detect free variable `process` from Node.js. */
+var freeProcess = moduleExports && freeGlobal.process;
+
+/** Used to access faster Node.js helpers. */
+var nodeUtil = (function() {
+  try {
+    // Use `util.types` for Node.js 10+.
+    var types = freeModule && freeModule.require && freeModule.require('util').types;
+
+    if (types) {
+      return types;
+    }
+
+    // Legacy `process.binding('util')` for Node.js < 10.
+    return freeProcess && freeProcess.binding && freeProcess.binding('util');
+  } catch (e) {}
+}());
+
+module.exports = nodeUtil;
diff --git a/ddb_main/node_modules/lodash/_objectToString.js b/ddb_main/node_modules/lodash/_objectToString.js
new file mode 100644
index 0000000..c614ec0
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_objectToString.js
@@ -0,0 +1,22 @@
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/**
+ * Used to resolve the
+ * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
+ * of values.
+ */
+var nativeObjectToString = objectProto.toString;
+
+/**
+ * Converts `value` to a string using `Object.prototype.toString`.
+ *
+ * @private
+ * @param {*} value The value to convert.
+ * @returns {string} Returns the converted string.
+ */
+function objectToString(value) {
+  return nativeObjectToString.call(value);
+}
+
+module.exports = objectToString;
diff --git a/ddb_main/node_modules/lodash/_overArg.js b/ddb_main/node_modules/lodash/_overArg.js
new file mode 100644
index 0000000..651c5c5
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_overArg.js
@@ -0,0 +1,15 @@
+/**
+ * Creates a unary function that invokes `func` with its argument transformed.
+ *
+ * @private
+ * @param {Function} func The function to wrap.
+ * @param {Function} transform The argument transform.
+ * @returns {Function} Returns the new function.
+ */
+function overArg(func, transform) {
+  return function(arg) {
+    return func(transform(arg));
+  };
+}
+
+module.exports = overArg;
diff --git a/ddb_main/node_modules/lodash/_overRest.js b/ddb_main/node_modules/lodash/_overRest.js
new file mode 100644
index 0000000..c7cdef3
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_overRest.js
@@ -0,0 +1,36 @@
+var apply = require('./_apply');
+
+/* Built-in method references for those with the same name as other `lodash` methods. */
+var nativeMax = Math.max;
+
+/**
+ * A specialized version of `baseRest` which transforms the rest array.
+ *
+ * @private
+ * @param {Function} func The function to apply a rest parameter to.
+ * @param {number} [start=func.length-1] The start position of the rest parameter.
+ * @param {Function} transform The rest array transform.
+ * @returns {Function} Returns the new function.
+ */
+function overRest(func, start, transform) {
+  start = nativeMax(start === undefined ? (func.length - 1) : start, 0);
+  return function() {
+    var args = arguments,
+        index = -1,
+        length = nativeMax(args.length - start, 0),
+        array = Array(length);
+
+    while (++index < length) {
+      array[index] = args[start + index];
+    }
+    index = -1;
+    var otherArgs = Array(start + 1);
+    while (++index < start) {
+      otherArgs[index] = args[index];
+    }
+    otherArgs[start] = transform(array);
+    return apply(func, this, otherArgs);
+  };
+}
+
+module.exports = overRest;
diff --git a/ddb_main/node_modules/lodash/_root.js b/ddb_main/node_modules/lodash/_root.js
new file mode 100644
index 0000000..d2852be
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_root.js
@@ -0,0 +1,9 @@
+var freeGlobal = require('./_freeGlobal');
+
+/** Detect free variable `self`. */
+var freeSelf = typeof self == 'object' && self && self.Object === Object && self;
+
+/** Used as a reference to the global object. */
+var root = freeGlobal || freeSelf || Function('return this')();
+
+module.exports = root;
diff --git a/ddb_main/node_modules/lodash/_setCacheAdd.js b/ddb_main/node_modules/lodash/_setCacheAdd.js
new file mode 100644
index 0000000..1081a74
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_setCacheAdd.js
@@ -0,0 +1,19 @@
+/** Used to stand-in for `undefined` hash values. */
+var HASH_UNDEFINED = '__lodash_hash_undefined__';
+
+/**
+ * Adds `value` to the array cache.
+ *
+ * @private
+ * @name add
+ * @memberOf SetCache
+ * @alias push
+ * @param {*} value The value to cache.
+ * @returns {Object} Returns the cache instance.
+ */
+function setCacheAdd(value) {
+  this.__data__.set(value, HASH_UNDEFINED);
+  return this;
+}
+
+module.exports = setCacheAdd;
diff --git a/ddb_main/node_modules/lodash/_setCacheHas.js b/ddb_main/node_modules/lodash/_setCacheHas.js
new file mode 100644
index 0000000..9a49255
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_setCacheHas.js
@@ -0,0 +1,14 @@
+/**
+ * Checks if `value` is in the array cache.
+ *
+ * @private
+ * @name has
+ * @memberOf SetCache
+ * @param {*} value The value to search for.
+ * @returns {number} Returns `true` if `value` is found, else `false`.
+ */
+function setCacheHas(value) {
+  return this.__data__.has(value);
+}
+
+module.exports = setCacheHas;
diff --git a/ddb_main/node_modules/lodash/_setToArray.js b/ddb_main/node_modules/lodash/_setToArray.js
new file mode 100644
index 0000000..b87f074
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_setToArray.js
@@ -0,0 +1,18 @@
+/**
+ * Converts `set` to an array of its values.
+ *
+ * @private
+ * @param {Object} set The set to convert.
+ * @returns {Array} Returns the values.
+ */
+function setToArray(set) {
+  var index = -1,
+      result = Array(set.size);
+
+  set.forEach(function(value) {
+    result[++index] = value;
+  });
+  return result;
+}
+
+module.exports = setToArray;
diff --git a/ddb_main/node_modules/lodash/_setToString.js b/ddb_main/node_modules/lodash/_setToString.js
new file mode 100644
index 0000000..6ca8419
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_setToString.js
@@ -0,0 +1,14 @@
+var baseSetToString = require('./_baseSetToString'),
+    shortOut = require('./_shortOut');
+
+/**
+ * Sets the `toString` method of `func` to return `string`.
+ *
+ * @private
+ * @param {Function} func The function to modify.
+ * @param {Function} string The `toString` result.
+ * @returns {Function} Returns `func`.
+ */
+var setToString = shortOut(baseSetToString);
+
+module.exports = setToString;
diff --git a/ddb_main/node_modules/lodash/_shortOut.js b/ddb_main/node_modules/lodash/_shortOut.js
new file mode 100644
index 0000000..3300a07
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_shortOut.js
@@ -0,0 +1,37 @@
+/** Used to detect hot functions by number of calls within a span of milliseconds. */
+var HOT_COUNT = 800,
+    HOT_SPAN = 16;
+
+/* Built-in method references for those with the same name as other `lodash` methods. */
+var nativeNow = Date.now;
+
+/**
+ * Creates a function that'll short out and invoke `identity` instead
+ * of `func` when it's called `HOT_COUNT` or more times in `HOT_SPAN`
+ * milliseconds.
+ *
+ * @private
+ * @param {Function} func The function to restrict.
+ * @returns {Function} Returns the new shortable function.
+ */
+function shortOut(func) {
+  var count = 0,
+      lastCalled = 0;
+
+  return function() {
+    var stamp = nativeNow(),
+        remaining = HOT_SPAN - (stamp - lastCalled);
+
+    lastCalled = stamp;
+    if (remaining > 0) {
+      if (++count >= HOT_COUNT) {
+        return arguments[0];
+      }
+    } else {
+      count = 0;
+    }
+    return func.apply(undefined, arguments);
+  };
+}
+
+module.exports = shortOut;
diff --git a/ddb_main/node_modules/lodash/_stackClear.js b/ddb_main/node_modules/lodash/_stackClear.js
new file mode 100644
index 0000000..ce8e5a9
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_stackClear.js
@@ -0,0 +1,15 @@
+var ListCache = require('./_ListCache');
+
+/**
+ * Removes all key-value entries from the stack.
+ *
+ * @private
+ * @name clear
+ * @memberOf Stack
+ */
+function stackClear() {
+  this.__data__ = new ListCache;
+  this.size = 0;
+}
+
+module.exports = stackClear;
diff --git a/ddb_main/node_modules/lodash/_stackDelete.js b/ddb_main/node_modules/lodash/_stackDelete.js
new file mode 100644
index 0000000..ff9887a
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_stackDelete.js
@@ -0,0 +1,18 @@
+/**
+ * Removes `key` and its value from the stack.
+ *
+ * @private
+ * @name delete
+ * @memberOf Stack
+ * @param {string} key The key of the value to remove.
+ * @returns {boolean} Returns `true` if the entry was removed, else `false`.
+ */
+function stackDelete(key) {
+  var data = this.__data__,
+      result = data['delete'](key);
+
+  this.size = data.size;
+  return result;
+}
+
+module.exports = stackDelete;
diff --git a/ddb_main/node_modules/lodash/_stackGet.js b/ddb_main/node_modules/lodash/_stackGet.js
new file mode 100644
index 0000000..1cdf004
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_stackGet.js
@@ -0,0 +1,14 @@
+/**
+ * Gets the stack value for `key`.
+ *
+ * @private
+ * @name get
+ * @memberOf Stack
+ * @param {string} key The key of the value to get.
+ * @returns {*} Returns the entry value.
+ */
+function stackGet(key) {
+  return this.__data__.get(key);
+}
+
+module.exports = stackGet;
diff --git a/ddb_main/node_modules/lodash/_stackHas.js b/ddb_main/node_modules/lodash/_stackHas.js
new file mode 100644
index 0000000..16a3ad1
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_stackHas.js
@@ -0,0 +1,14 @@
+/**
+ * Checks if a stack value for `key` exists.
+ *
+ * @private
+ * @name has
+ * @memberOf Stack
+ * @param {string} key The key of the entry to check.
+ * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
+ */
+function stackHas(key) {
+  return this.__data__.has(key);
+}
+
+module.exports = stackHas;
diff --git a/ddb_main/node_modules/lodash/_stackSet.js b/ddb_main/node_modules/lodash/_stackSet.js
new file mode 100644
index 0000000..b790ac5
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_stackSet.js
@@ -0,0 +1,34 @@
+var ListCache = require('./_ListCache'),
+    Map = require('./_Map'),
+    MapCache = require('./_MapCache');
+
+/** Used as the size to enable large array optimizations. */
+var LARGE_ARRAY_SIZE = 200;
+
+/**
+ * Sets the stack `key` to `value`.
+ *
+ * @private
+ * @name set
+ * @memberOf Stack
+ * @param {string} key The key of the value to set.
+ * @param {*} value The value to set.
+ * @returns {Object} Returns the stack cache instance.
+ */
+function stackSet(key, value) {
+  var data = this.__data__;
+  if (data instanceof ListCache) {
+    var pairs = data.__data__;
+    if (!Map || (pairs.length < LARGE_ARRAY_SIZE - 1)) {
+      pairs.push([key, value]);
+      this.size = ++data.size;
+      return this;
+    }
+    data = this.__data__ = new MapCache(pairs);
+  }
+  data.set(key, value);
+  this.size = data.size;
+  return this;
+}
+
+module.exports = stackSet;
diff --git a/ddb_main/node_modules/lodash/_stringToPath.js b/ddb_main/node_modules/lodash/_stringToPath.js
new file mode 100644
index 0000000..8f39f8a
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_stringToPath.js
@@ -0,0 +1,27 @@
+var memoizeCapped = require('./_memoizeCapped');
+
+/** Used to match property names within property paths. */
+var rePropName = /[^.[\]]+|\[(?:(-?\d+(?:\.\d+)?)|(["'])((?:(?!\2)[^\\]|\\.)*?)\2)\]|(?=(?:\.|\[\])(?:\.|\[\]|$))/g;
+
+/** Used to match backslashes in property paths. */
+var reEscapeChar = /\\(\\)?/g;
+
+/**
+ * Converts `string` to a property path array.
+ *
+ * @private
+ * @param {string} string The string to convert.
+ * @returns {Array} Returns the property path array.
+ */
+var stringToPath = memoizeCapped(function(string) {
+  var result = [];
+  if (string.charCodeAt(0) === 46 /* . */) {
+    result.push('');
+  }
+  string.replace(rePropName, function(match, number, quote, subString) {
+    result.push(quote ? subString.replace(reEscapeChar, '$1') : (number || match));
+  });
+  return result;
+});
+
+module.exports = stringToPath;
diff --git a/ddb_main/node_modules/lodash/_toKey.js b/ddb_main/node_modules/lodash/_toKey.js
new file mode 100644
index 0000000..c6d645c
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_toKey.js
@@ -0,0 +1,21 @@
+var isSymbol = require('./isSymbol');
+
+/** Used as references for various `Number` constants. */
+var INFINITY = 1 / 0;
+
+/**
+ * Converts `value` to a string key if it's not a string or symbol.
+ *
+ * @private
+ * @param {*} value The value to inspect.
+ * @returns {string|symbol} Returns the key.
+ */
+function toKey(value) {
+  if (typeof value == 'string' || isSymbol(value)) {
+    return value;
+  }
+  var result = (value + '');
+  return (result == '0' && (1 / value) == -INFINITY) ? '-0' : result;
+}
+
+module.exports = toKey;
diff --git a/ddb_main/node_modules/lodash/_toSource.js b/ddb_main/node_modules/lodash/_toSource.js
new file mode 100644
index 0000000..a020b38
--- /dev/null
+++ b/ddb_main/node_modules/lodash/_toSource.js
@@ -0,0 +1,26 @@
+/** Used for built-in method references. */
+var funcProto = Function.prototype;
+
+/** Used to resolve the decompiled source of functions. */
+var funcToString = funcProto.toString;
+
+/**
+ * Converts `func` to its source code.
+ *
+ * @private
+ * @param {Function} func The function to convert.
+ * @returns {string} Returns the source code.
+ */
+function toSource(func) {
+  if (func != null) {
+    try {
+      return funcToString.call(func);
+    } catch (e) {}
+    try {
+      return (func + '');
+    } catch (e) {}
+  }
+  return '';
+}
+
+module.exports = toSource;
diff --git a/ddb_main/node_modules/lodash/constant.js b/ddb_main/node_modules/lodash/constant.js
new file mode 100644
index 0000000..655ece3
--- /dev/null
+++ b/ddb_main/node_modules/lodash/constant.js
@@ -0,0 +1,26 @@
+/**
+ * Creates a function that returns `value`.
+ *
+ * @static
+ * @memberOf _
+ * @since 2.4.0
+ * @category Util
+ * @param {*} value The value to return from the new function.
+ * @returns {Function} Returns the new constant function.
+ * @example
+ *
+ * var objects = _.times(2, _.constant({ 'a': 1 }));
+ *
+ * console.log(objects);
+ * // => [{ 'a': 1 }, { 'a': 1 }]
+ *
+ * console.log(objects[0] === objects[1]);
+ * // => true
+ */
+function constant(value) {
+  return function() {
+    return value;
+  };
+}
+
+module.exports = constant;
diff --git a/ddb_main/node_modules/lodash/eq.js b/ddb_main/node_modules/lodash/eq.js
new file mode 100644
index 0000000..a940688
--- /dev/null
+++ b/ddb_main/node_modules/lodash/eq.js
@@ -0,0 +1,37 @@
+/**
+ * Performs a
+ * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+ * comparison between two values to determine if they are equivalent.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to compare.
+ * @param {*} other The other value to compare.
+ * @returns {boolean} Returns `true` if the values are equivalent, else `false`.
+ * @example
+ *
+ * var object = { 'a': 1 };
+ * var other = { 'a': 1 };
+ *
+ * _.eq(object, object);
+ * // => true
+ *
+ * _.eq(object, other);
+ * // => false
+ *
+ * _.eq('a', 'a');
+ * // => true
+ *
+ * _.eq('a', Object('a'));
+ * // => false
+ *
+ * _.eq(NaN, NaN);
+ * // => true
+ */
+function eq(value, other) {
+  return value === other || (value !== value && other !== other);
+}
+
+module.exports = eq;
diff --git a/ddb_main/node_modules/lodash/get.js b/ddb_main/node_modules/lodash/get.js
new file mode 100644
index 0000000..8805ff9
--- /dev/null
+++ b/ddb_main/node_modules/lodash/get.js
@@ -0,0 +1,33 @@
+var baseGet = require('./_baseGet');
+
+/**
+ * Gets the value at `path` of `object`. If the resolved value is
+ * `undefined`, the `defaultValue` is returned in its place.
+ *
+ * @static
+ * @memberOf _
+ * @since 3.7.0
+ * @category Object
+ * @param {Object} object The object to query.
+ * @param {Array|string} path The path of the property to get.
+ * @param {*} [defaultValue] The value returned for `undefined` resolved values.
+ * @returns {*} Returns the resolved value.
+ * @example
+ *
+ * var object = { 'a': [{ 'b': { 'c': 3 } }] };
+ *
+ * _.get(object, 'a[0].b.c');
+ * // => 3
+ *
+ * _.get(object, ['a', '0', 'b', 'c']);
+ * // => 3
+ *
+ * _.get(object, 'a.b.c', 'default');
+ * // => 'default'
+ */
+function get(object, path, defaultValue) {
+  var result = object == null ? undefined : baseGet(object, path);
+  return result === undefined ? defaultValue : result;
+}
+
+module.exports = get;
diff --git a/ddb_main/node_modules/lodash/hasIn.js b/ddb_main/node_modules/lodash/hasIn.js
new file mode 100644
index 0000000..06a3686
--- /dev/null
+++ b/ddb_main/node_modules/lodash/hasIn.js
@@ -0,0 +1,34 @@
+var baseHasIn = require('./_baseHasIn'),
+    hasPath = require('./_hasPath');
+
+/**
+ * Checks if `path` is a direct or inherited property of `object`.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Object
+ * @param {Object} object The object to query.
+ * @param {Array|string} path The path to check.
+ * @returns {boolean} Returns `true` if `path` exists, else `false`.
+ * @example
+ *
+ * var object = _.create({ 'a': _.create({ 'b': 2 }) });
+ *
+ * _.hasIn(object, 'a');
+ * // => true
+ *
+ * _.hasIn(object, 'a.b');
+ * // => true
+ *
+ * _.hasIn(object, ['a', 'b']);
+ * // => true
+ *
+ * _.hasIn(object, 'b');
+ * // => false
+ */
+function hasIn(object, path) {
+  return object != null && hasPath(object, path, baseHasIn);
+}
+
+module.exports = hasIn;
diff --git a/ddb_main/node_modules/lodash/identity.js b/ddb_main/node_modules/lodash/identity.js
new file mode 100644
index 0000000..2d5d963
--- /dev/null
+++ b/ddb_main/node_modules/lodash/identity.js
@@ -0,0 +1,21 @@
+/**
+ * This method returns the first argument it receives.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Util
+ * @param {*} value Any value.
+ * @returns {*} Returns `value`.
+ * @example
+ *
+ * var object = { 'a': 1 };
+ *
+ * console.log(_.identity(object) === object);
+ * // => true
+ */
+function identity(value) {
+  return value;
+}
+
+module.exports = identity;
diff --git a/ddb_main/node_modules/lodash/isArguments.js b/ddb_main/node_modules/lodash/isArguments.js
new file mode 100644
index 0000000..8b9ed66
--- /dev/null
+++ b/ddb_main/node_modules/lodash/isArguments.js
@@ -0,0 +1,36 @@
+var baseIsArguments = require('./_baseIsArguments'),
+    isObjectLike = require('./isObjectLike');
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/** Used to check objects for own properties. */
+var hasOwnProperty = objectProto.hasOwnProperty;
+
+/** Built-in value references. */
+var propertyIsEnumerable = objectProto.propertyIsEnumerable;
+
+/**
+ * Checks if `value` is likely an `arguments` object.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an `arguments` object,
+ *  else `false`.
+ * @example
+ *
+ * _.isArguments(function() { return arguments; }());
+ * // => true
+ *
+ * _.isArguments([1, 2, 3]);
+ * // => false
+ */
+var isArguments = baseIsArguments(function() { return arguments; }()) ? baseIsArguments : function(value) {
+  return isObjectLike(value) && hasOwnProperty.call(value, 'callee') &&
+    !propertyIsEnumerable.call(value, 'callee');
+};
+
+module.exports = isArguments;
diff --git a/ddb_main/node_modules/lodash/isArray.js b/ddb_main/node_modules/lodash/isArray.js
new file mode 100644
index 0000000..88ab55f
--- /dev/null
+++ b/ddb_main/node_modules/lodash/isArray.js
@@ -0,0 +1,26 @@
+/**
+ * Checks if `value` is classified as an `Array` object.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an array, else `false`.
+ * @example
+ *
+ * _.isArray([1, 2, 3]);
+ * // => true
+ *
+ * _.isArray(document.body.children);
+ * // => false
+ *
+ * _.isArray('abc');
+ * // => false
+ *
+ * _.isArray(_.noop);
+ * // => false
+ */
+var isArray = Array.isArray;
+
+module.exports = isArray;
diff --git a/ddb_main/node_modules/lodash/isArrayLike.js b/ddb_main/node_modules/lodash/isArrayLike.js
new file mode 100644
index 0000000..0f96680
--- /dev/null
+++ b/ddb_main/node_modules/lodash/isArrayLike.js
@@ -0,0 +1,33 @@
+var isFunction = require('./isFunction'),
+    isLength = require('./isLength');
+
+/**
+ * Checks if `value` is array-like. A value is considered array-like if it's
+ * not a function and has a `value.length` that's an integer greater than or
+ * equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is array-like, else `false`.
+ * @example
+ *
+ * _.isArrayLike([1, 2, 3]);
+ * // => true
+ *
+ * _.isArrayLike(document.body.children);
+ * // => true
+ *
+ * _.isArrayLike('abc');
+ * // => true
+ *
+ * _.isArrayLike(_.noop);
+ * // => false
+ */
+function isArrayLike(value) {
+  return value != null && isLength(value.length) && !isFunction(value);
+}
+
+module.exports = isArrayLike;
diff --git a/ddb_main/node_modules/lodash/isBuffer.js b/ddb_main/node_modules/lodash/isBuffer.js
new file mode 100644
index 0000000..c103cc7
--- /dev/null
+++ b/ddb_main/node_modules/lodash/isBuffer.js
@@ -0,0 +1,38 @@
+var root = require('./_root'),
+    stubFalse = require('./stubFalse');
+
+/** Detect free variable `exports`. */
+var freeExports = typeof exports == 'object' && exports && !exports.nodeType && exports;
+
+/** Detect free variable `module`. */
+var freeModule = freeExports && typeof module == 'object' && module && !module.nodeType && module;
+
+/** Detect the popular CommonJS extension `module.exports`. */
+var moduleExports = freeModule && freeModule.exports === freeExports;
+
+/** Built-in value references. */
+var Buffer = moduleExports ? root.Buffer : undefined;
+
+/* Built-in method references for those with the same name as other `lodash` methods. */
+var nativeIsBuffer = Buffer ? Buffer.isBuffer : undefined;
+
+/**
+ * Checks if `value` is a buffer.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.3.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a buffer, else `false`.
+ * @example
+ *
+ * _.isBuffer(new Buffer(2));
+ * // => true
+ *
+ * _.isBuffer(new Uint8Array(2));
+ * // => false
+ */
+var isBuffer = nativeIsBuffer || stubFalse;
+
+module.exports = isBuffer;
diff --git a/ddb_main/node_modules/lodash/isFunction.js b/ddb_main/node_modules/lodash/isFunction.js
new file mode 100644
index 0000000..907a8cd
--- /dev/null
+++ b/ddb_main/node_modules/lodash/isFunction.js
@@ -0,0 +1,37 @@
+var baseGetTag = require('./_baseGetTag'),
+    isObject = require('./isObject');
+
+/** `Object#toString` result references. */
+var asyncTag = '[object AsyncFunction]',
+    funcTag = '[object Function]',
+    genTag = '[object GeneratorFunction]',
+    proxyTag = '[object Proxy]';
+
+/**
+ * Checks if `value` is classified as a `Function` object.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a function, else `false`.
+ * @example
+ *
+ * _.isFunction(_);
+ * // => true
+ *
+ * _.isFunction(/abc/);
+ * // => false
+ */
+function isFunction(value) {
+  if (!isObject(value)) {
+    return false;
+  }
+  // The use of `Object#toString` avoids issues with the `typeof` operator
+  // in Safari 9 which returns 'object' for typed arrays and other constructors.
+  var tag = baseGetTag(value);
+  return tag == funcTag || tag == genTag || tag == asyncTag || tag == proxyTag;
+}
+
+module.exports = isFunction;
diff --git a/ddb_main/node_modules/lodash/isLength.js b/ddb_main/node_modules/lodash/isLength.js
new file mode 100644
index 0000000..3a95caa
--- /dev/null
+++ b/ddb_main/node_modules/lodash/isLength.js
@@ -0,0 +1,35 @@
+/** Used as references for various `Number` constants. */
+var MAX_SAFE_INTEGER = 9007199254740991;
+
+/**
+ * Checks if `value` is a valid array-like length.
+ *
+ * **Note:** This method is loosely based on
+ * [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength).
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a valid length, else `false`.
+ * @example
+ *
+ * _.isLength(3);
+ * // => true
+ *
+ * _.isLength(Number.MIN_VALUE);
+ * // => false
+ *
+ * _.isLength(Infinity);
+ * // => false
+ *
+ * _.isLength('3');
+ * // => false
+ */
+function isLength(value) {
+  return typeof value == 'number' &&
+    value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
+}
+
+module.exports = isLength;
diff --git a/ddb_main/node_modules/lodash/isObject.js b/ddb_main/node_modules/lodash/isObject.js
new file mode 100644
index 0000000..1dc8939
--- /dev/null
+++ b/ddb_main/node_modules/lodash/isObject.js
@@ -0,0 +1,31 @@
+/**
+ * Checks if `value` is the
+ * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
+ * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an object, else `false`.
+ * @example
+ *
+ * _.isObject({});
+ * // => true
+ *
+ * _.isObject([1, 2, 3]);
+ * // => true
+ *
+ * _.isObject(_.noop);
+ * // => true
+ *
+ * _.isObject(null);
+ * // => false
+ */
+function isObject(value) {
+  var type = typeof value;
+  return value != null && (type == 'object' || type == 'function');
+}
+
+module.exports = isObject;
diff --git a/ddb_main/node_modules/lodash/isObjectLike.js b/ddb_main/node_modules/lodash/isObjectLike.js
new file mode 100644
index 0000000..301716b
--- /dev/null
+++ b/ddb_main/node_modules/lodash/isObjectLike.js
@@ -0,0 +1,29 @@
+/**
+ * Checks if `value` is object-like. A value is object-like if it's not `null`
+ * and has a `typeof` result of "object".
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is object-like, else `false`.
+ * @example
+ *
+ * _.isObjectLike({});
+ * // => true
+ *
+ * _.isObjectLike([1, 2, 3]);
+ * // => true
+ *
+ * _.isObjectLike(_.noop);
+ * // => false
+ *
+ * _.isObjectLike(null);
+ * // => false
+ */
+function isObjectLike(value) {
+  return value != null && typeof value == 'object';
+}
+
+module.exports = isObjectLike;
diff --git a/ddb_main/node_modules/lodash/isSymbol.js b/ddb_main/node_modules/lodash/isSymbol.js
new file mode 100644
index 0000000..dfb60b9
--- /dev/null
+++ b/ddb_main/node_modules/lodash/isSymbol.js
@@ -0,0 +1,29 @@
+var baseGetTag = require('./_baseGetTag'),
+    isObjectLike = require('./isObjectLike');
+
+/** `Object#toString` result references. */
+var symbolTag = '[object Symbol]';
+
+/**
+ * Checks if `value` is classified as a `Symbol` primitive or object.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.
+ * @example
+ *
+ * _.isSymbol(Symbol.iterator);
+ * // => true
+ *
+ * _.isSymbol('abc');
+ * // => false
+ */
+function isSymbol(value) {
+  return typeof value == 'symbol' ||
+    (isObjectLike(value) && baseGetTag(value) == symbolTag);
+}
+
+module.exports = isSymbol;
diff --git a/ddb_main/node_modules/lodash/isTypedArray.js b/ddb_main/node_modules/lodash/isTypedArray.js
new file mode 100644
index 0000000..da3f8dd
--- /dev/null
+++ b/ddb_main/node_modules/lodash/isTypedArray.js
@@ -0,0 +1,27 @@
+var baseIsTypedArray = require('./_baseIsTypedArray'),
+    baseUnary = require('./_baseUnary'),
+    nodeUtil = require('./_nodeUtil');
+
+/* Node.js helper references. */
+var nodeIsTypedArray = nodeUtil && nodeUtil.isTypedArray;
+
+/**
+ * Checks if `value` is classified as a typed array.
+ *
+ * @static
+ * @memberOf _
+ * @since 3.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.
+ * @example
+ *
+ * _.isTypedArray(new Uint8Array);
+ * // => true
+ *
+ * _.isTypedArray([]);
+ * // => false
+ */
+var isTypedArray = nodeIsTypedArray ? baseUnary(nodeIsTypedArray) : baseIsTypedArray;
+
+module.exports = isTypedArray;
diff --git a/ddb_main/node_modules/lodash/keyBy.js b/ddb_main/node_modules/lodash/keyBy.js
new file mode 100644
index 0000000..acc007a
--- /dev/null
+++ b/ddb_main/node_modules/lodash/keyBy.js
@@ -0,0 +1,36 @@
+var baseAssignValue = require('./_baseAssignValue'),
+    createAggregator = require('./_createAggregator');
+
+/**
+ * Creates an object composed of keys generated from the results of running
+ * each element of `collection` thru `iteratee`. The corresponding value of
+ * each key is the last element responsible for generating the key. The
+ * iteratee is invoked with one argument: (value).
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Collection
+ * @param {Array|Object} collection The collection to iterate over.
+ * @param {Function} [iteratee=_.identity] The iteratee to transform keys.
+ * @returns {Object} Returns the composed aggregate object.
+ * @example
+ *
+ * var array = [
+ *   { 'dir': 'left', 'code': 97 },
+ *   { 'dir': 'right', 'code': 100 }
+ * ];
+ *
+ * _.keyBy(array, function(o) {
+ *   return String.fromCharCode(o.code);
+ * });
+ * // => { 'a': { 'dir': 'left', 'code': 97 }, 'd': { 'dir': 'right', 'code': 100 } }
+ *
+ * _.keyBy(array, 'dir');
+ * // => { 'left': { 'dir': 'left', 'code': 97 }, 'right': { 'dir': 'right', 'code': 100 } }
+ */
+var keyBy = createAggregator(function(result, value, key) {
+  baseAssignValue(result, key, value);
+});
+
+module.exports = keyBy;
diff --git a/ddb_main/node_modules/lodash/keys.js b/ddb_main/node_modules/lodash/keys.js
new file mode 100644
index 0000000..d143c71
--- /dev/null
+++ b/ddb_main/node_modules/lodash/keys.js
@@ -0,0 +1,37 @@
+var arrayLikeKeys = require('./_arrayLikeKeys'),
+    baseKeys = require('./_baseKeys'),
+    isArrayLike = require('./isArrayLike');
+
+/**
+ * Creates an array of the own enumerable property names of `object`.
+ *
+ * **Note:** Non-object values are coerced to objects. See the
+ * [ES spec](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)
+ * for more details.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Object
+ * @param {Object} object The object to query.
+ * @returns {Array} Returns the array of property names.
+ * @example
+ *
+ * function Foo() {
+ *   this.a = 1;
+ *   this.b = 2;
+ * }
+ *
+ * Foo.prototype.c = 3;
+ *
+ * _.keys(new Foo);
+ * // => ['a', 'b'] (iteration order is not guaranteed)
+ *
+ * _.keys('hi');
+ * // => ['0', '1']
+ */
+function keys(object) {
+  return isArrayLike(object) ? arrayLikeKeys(object) : baseKeys(object);
+}
+
+module.exports = keys;
diff --git a/ddb_main/node_modules/lodash/lodash.js b/ddb_main/node_modules/lodash/lodash.js
new file mode 100644
index 0000000..4131e93
--- /dev/null
+++ b/ddb_main/node_modules/lodash/lodash.js
@@ -0,0 +1,17209 @@
+/**
+ * @license
+ * Lodash <https://lodash.com/>
+ * Copyright OpenJS Foundation and other contributors <https://openjsf.org/>
+ * Released under MIT license <https://lodash.com/license>
+ * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
+ * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
+ */
+;(function() {
+
+  /** Used as a safe reference for `undefined` in pre-ES5 environments. */
+  var undefined;
+
+  /** Used as the semantic version number. */
+  var VERSION = '4.17.21';
+
+  /** Used as the size to enable large array optimizations. */
+  var LARGE_ARRAY_SIZE = 200;
+
+  /** Error message constants. */
+  var CORE_ERROR_TEXT = 'Unsupported core-js use. Try https://npms.io/search?q=ponyfill.',
+      FUNC_ERROR_TEXT = 'Expected a function',
+      INVALID_TEMPL_VAR_ERROR_TEXT = 'Invalid `variable` option passed into `_.template`';
+
+  /** Used to stand-in for `undefined` hash values. */
+  var HASH_UNDEFINED = '__lodash_hash_undefined__';
+
+  /** Used as the maximum memoize cache size. */
+  var MAX_MEMOIZE_SIZE = 500;
+
+  /** Used as the internal argument placeholder. */
+  var PLACEHOLDER = '__lodash_placeholder__';
+
+  /** Used to compose bitmasks for cloning. */
+  var CLONE_DEEP_FLAG = 1,
+      CLONE_FLAT_FLAG = 2,
+      CLONE_SYMBOLS_FLAG = 4;
+
+  /** Used to compose bitmasks for value comparisons. */
+  var COMPARE_PARTIAL_FLAG = 1,
+      COMPARE_UNORDERED_FLAG = 2;
+
+  /** Used to compose bitmasks for function metadata. */
+  var WRAP_BIND_FLAG = 1,
+      WRAP_BIND_KEY_FLAG = 2,
+      WRAP_CURRY_BOUND_FLAG = 4,
+      WRAP_CURRY_FLAG = 8,
+      WRAP_CURRY_RIGHT_FLAG = 16,
+      WRAP_PARTIAL_FLAG = 32,
+      WRAP_PARTIAL_RIGHT_FLAG = 64,
+      WRAP_ARY_FLAG = 128,
+      WRAP_REARG_FLAG = 256,
+      WRAP_FLIP_FLAG = 512;
+
+  /** Used as default options for `_.truncate`. */
+  var DEFAULT_TRUNC_LENGTH = 30,
+      DEFAULT_TRUNC_OMISSION = '...';
+
+  /** Used to detect hot functions by number of calls within a span of milliseconds. */
+  var HOT_COUNT = 800,
+      HOT_SPAN = 16;
+
+  /** Used to indicate the type of lazy iteratees. */
+  var LAZY_FILTER_FLAG = 1,
+      LAZY_MAP_FLAG = 2,
+      LAZY_WHILE_FLAG = 3;
+
+  /** Used as references for various `Number` constants. */
+  var INFINITY = 1 / 0,
+      MAX_SAFE_INTEGER = 9007199254740991,
+      MAX_INTEGER = 1.7976931348623157e+308,
+      NAN = 0 / 0;
+
+  /** Used as references for the maximum length and index of an array. */
+  var MAX_ARRAY_LENGTH = 4294967295,
+      MAX_ARRAY_INDEX = MAX_ARRAY_LENGTH - 1,
+      HALF_MAX_ARRAY_LENGTH = MAX_ARRAY_LENGTH >>> 1;
+
+  /** Used to associate wrap methods with their bit flags. */
+  var wrapFlags = [
+    ['ary', WRAP_ARY_FLAG],
+    ['bind', WRAP_BIND_FLAG],
+    ['bindKey', WRAP_BIND_KEY_FLAG],
+    ['curry', WRAP_CURRY_FLAG],
+    ['curryRight', WRAP_CURRY_RIGHT_FLAG],
+    ['flip', WRAP_FLIP_FLAG],
+    ['partial', WRAP_PARTIAL_FLAG],
+    ['partialRight', WRAP_PARTIAL_RIGHT_FLAG],
+    ['rearg', WRAP_REARG_FLAG]
+  ];
+
+  /** `Object#toString` result references. */
+  var argsTag = '[object Arguments]',
+      arrayTag = '[object Array]',
+      asyncTag = '[object AsyncFunction]',
+      boolTag = '[object Boolean]',
+      dateTag = '[object Date]',
+      domExcTag = '[object DOMException]',
+      errorTag = '[object Error]',
+      funcTag = '[object Function]',
+      genTag = '[object GeneratorFunction]',
+      mapTag = '[object Map]',
+      numberTag = '[object Number]',
+      nullTag = '[object Null]',
+      objectTag = '[object Object]',
+      promiseTag = '[object Promise]',
+      proxyTag = '[object Proxy]',
+      regexpTag = '[object RegExp]',
+      setTag = '[object Set]',
+      stringTag = '[object String]',
+      symbolTag = '[object Symbol]',
+      undefinedTag = '[object Undefined]',
+      weakMapTag = '[object WeakMap]',
+      weakSetTag = '[object WeakSet]';
+
+  var arrayBufferTag = '[object ArrayBuffer]',
+      dataViewTag = '[object DataView]',
+      float32Tag = '[object Float32Array]',
+      float64Tag = '[object Float64Array]',
+      int8Tag = '[object Int8Array]',
+      int16Tag = '[object Int16Array]',
+      int32Tag = '[object Int32Array]',
+      uint8Tag = '[object Uint8Array]',
+      uint8ClampedTag = '[object Uint8ClampedArray]',
+      uint16Tag = '[object Uint16Array]',
+      uint32Tag = '[object Uint32Array]';
+
+  /** Used to match empty string literals in compiled template source. */
+  var reEmptyStringLeading = /\b__p \+= '';/g,
+      reEmptyStringMiddle = /\b(__p \+=) '' \+/g,
+      reEmptyStringTrailing = /(__e\(.*?\)|\b__t\)) \+\n'';/g;
+
+  /** Used to match HTML entities and HTML characters. */
+  var reEscapedHtml = /&(?:amp|lt|gt|quot|#39);/g,
+      reUnescapedHtml = /[&<>"']/g,
+      reHasEscapedHtml = RegExp(reEscapedHtml.source),
+      reHasUnescapedHtml = RegExp(reUnescapedHtml.source);
+
+  /** Used to match template delimiters. */
+  var reEscape = /<%-([\s\S]+?)%>/g,
+      reEvaluate = /<%([\s\S]+?)%>/g,
+      reInterpolate = /<%=([\s\S]+?)%>/g;
+
+  /** Used to match property names within property paths. */
+  var reIsDeepProp = /\.|\[(?:[^[\]]*|(["'])(?:(?!\1)[^\\]|\\.)*?\1)\]/,
+      reIsPlainProp = /^\w*$/,
+      rePropName = /[^.[\]]+|\[(?:(-?\d+(?:\.\d+)?)|(["'])((?:(?!\2)[^\\]|\\.)*?)\2)\]|(?=(?:\.|\[\])(?:\.|\[\]|$))/g;
+
+  /**
+   * Used to match `RegExp`
+   * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).
+   */
+  var reRegExpChar = /[\\^$.*+?()[\]{}|]/g,
+      reHasRegExpChar = RegExp(reRegExpChar.source);
+
+  /** Used to match leading whitespace. */
+  var reTrimStart = /^\s+/;
+
+  /** Used to match a single whitespace character. */
+  var reWhitespace = /\s/;
+
+  /** Used to match wrap detail comments. */
+  var reWrapComment = /\{(?:\n\/\* \[wrapped with .+\] \*\/)?\n?/,
+      reWrapDetails = /\{\n\/\* \[wrapped with (.+)\] \*/,
+      reSplitDetails = /,? & /;
+
+  /** Used to match words composed of alphanumeric characters. */
+  var reAsciiWord = /[^\x00-\x2f\x3a-\x40\x5b-\x60\x7b-\x7f]+/g;
+
+  /**
+   * Used to validate the `validate` option in `_.template` variable.
+   *
+   * Forbids characters which could potentially change the meaning of the function argument definition:
+   * - "()," (modification of function parameters)
+   * - "=" (default value)
+   * - "[]{}" (destructuring of function parameters)
+   * - "/" (beginning of a comment)
+   * - whitespace
+   */
+  var reForbiddenIdentifierChars = /[()=,{}\[\]\/\s]/;
+
+  /** Used to match backslashes in property paths. */
+  var reEscapeChar = /\\(\\)?/g;
+
+  /**
+   * Used to match
+   * [ES template delimiters](http://ecma-international.org/ecma-262/7.0/#sec-template-literal-lexical-components).
+   */
+  var reEsTemplate = /\$\{([^\\}]*(?:\\.[^\\}]*)*)\}/g;
+
+  /** Used to match `RegExp` flags from their coerced string values. */
+  var reFlags = /\w*$/;
+
+  /** Used to detect bad signed hexadecimal string values. */
+  var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
+
+  /** Used to detect binary string values. */
+  var reIsBinary = /^0b[01]+$/i;
+
+  /** Used to detect host constructors (Safari). */
+  var reIsHostCtor = /^\[object .+?Constructor\]$/;
+
+  /** Used to detect octal string values. */
+  var reIsOctal = /^0o[0-7]+$/i;
+
+  /** Used to detect unsigned integer values. */
+  var reIsUint = /^(?:0|[1-9]\d*)$/;
+
+  /** Used to match Latin Unicode letters (excluding mathematical operators). */
+  var reLatin = /[\xc0-\xd6\xd8-\xf6\xf8-\xff\u0100-\u017f]/g;
+
+  /** Used to ensure capturing order of template delimiters. */
+  var reNoMatch = /($^)/;
+
+  /** Used to match unescaped characters in compiled string literals. */
+  var reUnescapedString = /['\n\r\u2028\u2029\\]/g;
+
+  /** Used to compose unicode character classes. */
+  var rsAstralRange = '\\ud800-\\udfff',
+      rsComboMarksRange = '\\u0300-\\u036f',
+      reComboHalfMarksRange = '\\ufe20-\\ufe2f',
+      rsComboSymbolsRange = '\\u20d0-\\u20ff',
+      rsComboRange = rsComboMarksRange + reComboHalfMarksRange + rsComboSymbolsRange,
+      rsDingbatRange = '\\u2700-\\u27bf',
+      rsLowerRange = 'a-z\\xdf-\\xf6\\xf8-\\xff',
+      rsMathOpRange = '\\xac\\xb1\\xd7\\xf7',
+      rsNonCharRange = '\\x00-\\x2f\\x3a-\\x40\\x5b-\\x60\\x7b-\\xbf',
+      rsPunctuationRange = '\\u2000-\\u206f',
+      rsSpaceRange = ' \\t\\x0b\\f\\xa0\\ufeff\\n\\r\\u2028\\u2029\\u1680\\u180e\\u2000\\u2001\\u2002\\u2003\\u2004\\u2005\\u2006\\u2007\\u2008\\u2009\\u200a\\u202f\\u205f\\u3000',
+      rsUpperRange = 'A-Z\\xc0-\\xd6\\xd8-\\xde',
+      rsVarRange = '\\ufe0e\\ufe0f',
+      rsBreakRange = rsMathOpRange + rsNonCharRange + rsPunctuationRange + rsSpaceRange;
+
+  /** Used to compose unicode capture groups. */
+  var rsApos = "['\u2019]",
+      rsAstral = '[' + rsAstralRange + ']',
+      rsBreak = '[' + rsBreakRange + ']',
+      rsCombo = '[' + rsComboRange + ']',
+      rsDigits = '\\d+',
+      rsDingbat = '[' + rsDingbatRange + ']',
+      rsLower = '[' + rsLowerRange + ']',
+      rsMisc = '[^' + rsAstralRange + rsBreakRange + rsDigits + rsDingbatRange + rsLowerRange + rsUpperRange + ']',
+      rsFitz = '\\ud83c[\\udffb-\\udfff]',
+      rsModifier = '(?:' + rsCombo + '|' + rsFitz + ')',
+      rsNonAstral = '[^' + rsAstralRange + ']',
+      rsRegional = '(?:\\ud83c[\\udde6-\\uddff]){2}',
+      rsSurrPair = '[\\ud800-\\udbff][\\udc00-\\udfff]',
+      rsUpper = '[' + rsUpperRange + ']',
+      rsZWJ = '\\u200d';
+
+  /** Used to compose unicode regexes. */
+  var rsMiscLower = '(?:' + rsLower + '|' + rsMisc + ')',
+      rsMiscUpper = '(?:' + rsUpper + '|' + rsMisc + ')',
+      rsOptContrLower = '(?:' + rsApos + '(?:d|ll|m|re|s|t|ve))?',
+      rsOptContrUpper = '(?:' + rsApos + '(?:D|LL|M|RE|S|T|VE))?',
+      reOptMod = rsModifier + '?',
+      rsOptVar = '[' + rsVarRange + ']?',
+      rsOptJoin = '(?:' + rsZWJ + '(?:' + [rsNonAstral, rsRegional, rsSurrPair].join('|') + ')' + rsOptVar + reOptMod + ')*',
+      rsOrdLower = '\\d*(?:1st|2nd|3rd|(?![123])\\dth)(?=\\b|[A-Z_])',
+      rsOrdUpper = '\\d*(?:1ST|2ND|3RD|(?![123])\\dTH)(?=\\b|[a-z_])',
+      rsSeq = rsOptVar + reOptMod + rsOptJoin,
+      rsEmoji = '(?:' + [rsDingbat, rsRegional, rsSurrPair].join('|') + ')' + rsSeq,
+      rsSymbol = '(?:' + [rsNonAstral + rsCombo + '?', rsCombo, rsRegional, rsSurrPair, rsAstral].join('|') + ')';
+
+  /** Used to match apostrophes. */
+  var reApos = RegExp(rsApos, 'g');
+
+  /**
+   * Used to match [combining diacritical marks](https://en.wikipedia.org/wiki/Combining_Diacritical_Marks) and
+   * [combining diacritical marks for symbols](https://en.wikipedia.org/wiki/Combining_Diacritical_Marks_for_Symbols).
+   */
+  var reComboMark = RegExp(rsCombo, 'g');
+
+  /** Used to match [string symbols](https://mathiasbynens.be/notes/javascript-unicode). */
+  var reUnicode = RegExp(rsFitz + '(?=' + rsFitz + ')|' + rsSymbol + rsSeq, 'g');
+
+  /** Used to match complex or compound words. */
+  var reUnicodeWord = RegExp([
+    rsUpper + '?' + rsLower + '+' + rsOptContrLower + '(?=' + [rsBreak, rsUpper, '$'].join('|') + ')',
+    rsMiscUpper + '+' + rsOptContrUpper + '(?=' + [rsBreak, rsUpper + rsMiscLower, '$'].join('|') + ')',
+    rsUpper + '?' + rsMiscLower + '+' + rsOptContrLower,
+    rsUpper + '+' + rsOptContrUpper,
+    rsOrdUpper,
+    rsOrdLower,
+    rsDigits,
+    rsEmoji
+  ].join('|'), 'g');
+
+  /** Used to detect strings with [zero-width joiners or code points from the astral planes](http://eev.ee/blog/2015/09/12/dark-corners-of-unicode/). */
+  var reHasUnicode = RegExp('[' + rsZWJ + rsAstralRange  + rsComboRange + rsVarRange + ']');
+
+  /** Used to detect strings that need a more robust regexp to match words. */
+  var reHasUnicodeWord = /[a-z][A-Z]|[A-Z]{2}[a-z]|[0-9][a-zA-Z]|[a-zA-Z][0-9]|[^a-zA-Z0-9 ]/;
+
+  /** Used to assign default `context` object properties. */
+  var contextProps = [
+    'Array', 'Buffer', 'DataView', 'Date', 'Error', 'Float32Array', 'Float64Array',
+    'Function', 'Int8Array', 'Int16Array', 'Int32Array', 'Map', 'Math', 'Object',
+    'Promise', 'RegExp', 'Set', 'String', 'Symbol', 'TypeError', 'Uint8Array',
+    'Uint8ClampedArray', 'Uint16Array', 'Uint32Array', 'WeakMap',
+    '_', 'clearTimeout', 'isFinite', 'parseInt', 'setTimeout'
+  ];
+
+  /** Used to make template sourceURLs easier to identify. */
+  var templateCounter = -1;
+
+  /** Used to identify `toStringTag` values of typed arrays. */
+  var typedArrayTags = {};
+  typedArrayTags[float32Tag] = typedArrayTags[float64Tag] =
+  typedArrayTags[int8Tag] = typedArrayTags[int16Tag] =
+  typedArrayTags[int32Tag] = typedArrayTags[uint8Tag] =
+  typedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] =
+  typedArrayTags[uint32Tag] = true;
+  typedArrayTags[argsTag] = typedArrayTags[arrayTag] =
+  typedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] =
+  typedArrayTags[dataViewTag] = typedArrayTags[dateTag] =
+  typedArrayTags[errorTag] = typedArrayTags[funcTag] =
+  typedArrayTags[mapTag] = typedArrayTags[numberTag] =
+  typedArrayTags[objectTag] = typedArrayTags[regexpTag] =
+  typedArrayTags[setTag] = typedArrayTags[stringTag] =
+  typedArrayTags[weakMapTag] = false;
+
+  /** Used to identify `toStringTag` values supported by `_.clone`. */
+  var cloneableTags = {};
+  cloneableTags[argsTag] = cloneableTags[arrayTag] =
+  cloneableTags[arrayBufferTag] = cloneableTags[dataViewTag] =
+  cloneableTags[boolTag] = cloneableTags[dateTag] =
+  cloneableTags[float32Tag] = cloneableTags[float64Tag] =
+  cloneableTags[int8Tag] = cloneableTags[int16Tag] =
+  cloneableTags[int32Tag] = cloneableTags[mapTag] =
+  cloneableTags[numberTag] = cloneableTags[objectTag] =
+  cloneableTags[regexpTag] = cloneableTags[setTag] =
+  cloneableTags[stringTag] = cloneableTags[symbolTag] =
+  cloneableTags[uint8Tag] = cloneableTags[uint8ClampedTag] =
+  cloneableTags[uint16Tag] = cloneableTags[uint32Tag] = true;
+  cloneableTags[errorTag] = cloneableTags[funcTag] =
+  cloneableTags[weakMapTag] = false;
+
+  /** Used to map Latin Unicode letters to basic Latin letters. */
+  var deburredLetters = {
+    // Latin-1 Supplement block.
+    '\xc0': 'A',  '\xc1': 'A', '\xc2': 'A', '\xc3': 'A', '\xc4': 'A', '\xc5': 'A',
+    '\xe0': 'a',  '\xe1': 'a', '\xe2': 'a', '\xe3': 'a', '\xe4': 'a', '\xe5': 'a',
+    '\xc7': 'C',  '\xe7': 'c',
+    '\xd0': 'D',  '\xf0': 'd',
+    '\xc8': 'E',  '\xc9': 'E', '\xca': 'E', '\xcb': 'E',
+    '\xe8': 'e',  '\xe9': 'e', '\xea': 'e', '\xeb': 'e',
+    '\xcc': 'I',  '\xcd': 'I', '\xce': 'I', '\xcf': 'I',
+    '\xec': 'i',  '\xed': 'i', '\xee': 'i', '\xef': 'i',
+    '\xd1': 'N',  '\xf1': 'n',
+    '\xd2': 'O',  '\xd3': 'O', '\xd4': 'O', '\xd5': 'O', '\xd6': 'O', '\xd8': 'O',
+    '\xf2': 'o',  '\xf3': 'o', '\xf4': 'o', '\xf5': 'o', '\xf6': 'o', '\xf8': 'o',
+    '\xd9': 'U',  '\xda': 'U', '\xdb': 'U', '\xdc': 'U',
+    '\xf9': 'u',  '\xfa': 'u', '\xfb': 'u', '\xfc': 'u',
+    '\xdd': 'Y',  '\xfd': 'y', '\xff': 'y',
+    '\xc6': 'Ae', '\xe6': 'ae',
+    '\xde': 'Th', '\xfe': 'th',
+    '\xdf': 'ss',
+    // Latin Extended-A block.
+    '\u0100': 'A',  '\u0102': 'A', '\u0104': 'A',
+    '\u0101': 'a',  '\u0103': 'a', '\u0105': 'a',
+    '\u0106': 'C',  '\u0108': 'C', '\u010a': 'C', '\u010c': 'C',
+    '\u0107': 'c',  '\u0109': 'c', '\u010b': 'c', '\u010d': 'c',
+    '\u010e': 'D',  '\u0110': 'D', '\u010f': 'd', '\u0111': 'd',
+    '\u0112': 'E',  '\u0114': 'E', '\u0116': 'E', '\u0118': 'E', '\u011a': 'E',
+    '\u0113': 'e',  '\u0115': 'e', '\u0117': 'e', '\u0119': 'e', '\u011b': 'e',
+    '\u011c': 'G',  '\u011e': 'G', '\u0120': 'G', '\u0122': 'G',
+    '\u011d': 'g',  '\u011f': 'g', '\u0121': 'g', '\u0123': 'g',
+    '\u0124': 'H',  '\u0126': 'H', '\u0125': 'h', '\u0127': 'h',
+    '\u0128': 'I',  '\u012a': 'I', '\u012c': 'I', '\u012e': 'I', '\u0130': 'I',
+    '\u0129': 'i',  '\u012b': 'i', '\u012d': 'i', '\u012f': 'i', '\u0131': 'i',
+    '\u0134': 'J',  '\u0135': 'j',
+    '\u0136': 'K',  '\u0137': 'k', '\u0138': 'k',
+    '\u0139': 'L',  '\u013b': 'L', '\u013d': 'L', '\u013f': 'L', '\u0141': 'L',
+    '\u013a': 'l',  '\u013c': 'l', '\u013e': 'l', '\u0140': 'l', '\u0142': 'l',
+    '\u0143': 'N',  '\u0145': 'N', '\u0147': 'N', '\u014a': 'N',
+    '\u0144': 'n',  '\u0146': 'n', '\u0148': 'n', '\u014b': 'n',
+    '\u014c': 'O',  '\u014e': 'O', '\u0150': 'O',
+    '\u014d': 'o',  '\u014f': 'o', '\u0151': 'o',
+    '\u0154': 'R',  '\u0156': 'R', '\u0158': 'R',
+    '\u0155': 'r',  '\u0157': 'r', '\u0159': 'r',
+    '\u015a': 'S',  '\u015c': 'S', '\u015e': 'S', '\u0160': 'S',
+    '\u015b': 's',  '\u015d': 's', '\u015f': 's', '\u0161': 's',
+    '\u0162': 'T',  '\u0164': 'T', '\u0166': 'T',
+    '\u0163': 't',  '\u0165': 't', '\u0167': 't',
+    '\u0168': 'U',  '\u016a': 'U', '\u016c': 'U', '\u016e': 'U', '\u0170': 'U', '\u0172': 'U',
+    '\u0169': 'u',  '\u016b': 'u', '\u016d': 'u', '\u016f': 'u', '\u0171': 'u', '\u0173': 'u',
+    '\u0174': 'W',  '\u0175': 'w',
+    '\u0176': 'Y',  '\u0177': 'y', '\u0178': 'Y',
+    '\u0179': 'Z',  '\u017b': 'Z', '\u017d': 'Z',
+    '\u017a': 'z',  '\u017c': 'z', '\u017e': 'z',
+    '\u0132': 'IJ', '\u0133': 'ij',
+    '\u0152': 'Oe', '\u0153': 'oe',
+    '\u0149': "'n", '\u017f': 's'
+  };
+
+  /** Used to map characters to HTML entities. */
+  var htmlEscapes = {
+    '&': '&amp;',
+    '<': '&lt;',
+    '>': '&gt;',
+    '"': '&quot;',
+    "'": '&#39;'
+  };
+
+  /** Used to map HTML entities to characters. */
+  var htmlUnescapes = {
+    '&amp;': '&',
+    '&lt;': '<',
+    '&gt;': '>',
+    '&quot;': '"',
+    '&#39;': "'"
+  };
+
+  /** Used to escape characters for inclusion in compiled string literals. */
+  var stringEscapes = {
+    '\\': '\\',
+    "'": "'",
+    '\n': 'n',
+    '\r': 'r',
+    '\u2028': 'u2028',
+    '\u2029': 'u2029'
+  };
+
+  /** Built-in method references without a dependency on `root`. */
+  var freeParseFloat = parseFloat,
+      freeParseInt = parseInt;
+
+  /** Detect free variable `global` from Node.js. */
+  var freeGlobal = typeof global == 'object' && global && global.Object === Object && global;
+
+  /** Detect free variable `self`. */
+  var freeSelf = typeof self == 'object' && self && self.Object === Object && self;
+
+  /** Used as a reference to the global object. */
+  var root = freeGlobal || freeSelf || Function('return this')();
+
+  /** Detect free variable `exports`. */
+  var freeExports = typeof exports == 'object' && exports && !exports.nodeType && exports;
+
+  /** Detect free variable `module`. */
+  var freeModule = freeExports && typeof module == 'object' && module && !module.nodeType && module;
+
+  /** Detect the popular CommonJS extension `module.exports`. */
+  var moduleExports = freeModule && freeModule.exports === freeExports;
+
+  /** Detect free variable `process` from Node.js. */
+  var freeProcess = moduleExports && freeGlobal.process;
+
+  /** Used to access faster Node.js helpers. */
+  var nodeUtil = (function() {
+    try {
+      // Use `util.types` for Node.js 10+.
+      var types = freeModule && freeModule.require && freeModule.require('util').types;
+
+      if (types) {
+        return types;
+      }
+
+      // Legacy `process.binding('util')` for Node.js < 10.
+      return freeProcess && freeProcess.binding && freeProcess.binding('util');
+    } catch (e) {}
+  }());
+
+  /* Node.js helper references. */
+  var nodeIsArrayBuffer = nodeUtil && nodeUtil.isArrayBuffer,
+      nodeIsDate = nodeUtil && nodeUtil.isDate,
+      nodeIsMap = nodeUtil && nodeUtil.isMap,
+      nodeIsRegExp = nodeUtil && nodeUtil.isRegExp,
+      nodeIsSet = nodeUtil && nodeUtil.isSet,
+      nodeIsTypedArray = nodeUtil && nodeUtil.isTypedArray;
+
+  /*--------------------------------------------------------------------------*/
+
+  /**
+   * A faster alternative to `Function#apply`, this function invokes `func`
+   * with the `this` binding of `thisArg` and the arguments of `args`.
+   *
+   * @private
+   * @param {Function} func The function to invoke.
+   * @param {*} thisArg The `this` binding of `func`.
+   * @param {Array} args The arguments to invoke `func` with.
+   * @returns {*} Returns the result of `func`.
+   */
+  function apply(func, thisArg, args) {
+    switch (args.length) {
+      case 0: return func.call(thisArg);
+      case 1: return func.call(thisArg, args[0]);
+      case 2: return func.call(thisArg, args[0], args[1]);
+      case 3: return func.call(thisArg, args[0], args[1], args[2]);
+    }
+    return func.apply(thisArg, args);
+  }
+
+  /**
+   * A specialized version of `baseAggregator` for arrays.
+   *
+   * @private
+   * @param {Array} [array] The array to iterate over.
+   * @param {Function} setter The function to set `accumulator` values.
+   * @param {Function} iteratee The iteratee to transform keys.
+   * @param {Object} accumulator The initial aggregated object.
+   * @returns {Function} Returns `accumulator`.
+   */
+  function arrayAggregator(array, setter, iteratee, accumulator) {
+    var index = -1,
+        length = array == null ? 0 : array.length;
+
+    while (++index < length) {
+      var value = array[index];
+      setter(accumulator, value, iteratee(value), array);
+    }
+    return accumulator;
+  }
+
+  /**
+   * A specialized version of `_.forEach` for arrays without support for
+   * iteratee shorthands.
+   *
+   * @private
+   * @param {Array} [array] The array to iterate over.
+   * @param {Function} iteratee The function invoked per iteration.
+   * @returns {Array} Returns `array`.
+   */
+  function arrayEach(array, iteratee) {
+    var index = -1,
+        length = array == null ? 0 : array.length;
+
+    while (++index < length) {
+      if (iteratee(array[index], index, array) === false) {
+        break;
+      }
+    }
+    return array;
+  }
+
+  /**
+   * A specialized version of `_.forEachRight` for arrays without support for
+   * iteratee shorthands.
+   *
+   * @private
+   * @param {Array} [array] The array to iterate over.
+   * @param {Function} iteratee The function invoked per iteration.
+   * @returns {Array} Returns `array`.
+   */
+  function arrayEachRight(array, iteratee) {
+    var length = array == null ? 0 : array.length;
+
+    while (length--) {
+      if (iteratee(array[length], length, array) === false) {
+        break;
+      }
+    }
+    return array;
+  }
+
+  /**
+   * A specialized version of `_.every` for arrays without support for
+   * iteratee shorthands.
+   *
+   * @private
+   * @param {Array} [array] The array to iterate over.
+   * @param {Function} predicate The function invoked per iteration.
+   * @returns {boolean} Returns `true` if all elements pass the predicate check,
+   *  else `false`.
+   */
+  function arrayEvery(array, predicate) {
+    var index = -1,
+        length = array == null ? 0 : array.length;
+
+    while (++index < length) {
+      if (!predicate(array[index], index, array)) {
+        return false;
+      }
+    }
+    return true;
+  }
+
+  /**
+   * A specialized version of `_.filter` for arrays without support for
+   * iteratee shorthands.
+   *
+   * @private
+   * @param {Array} [array] The array to iterate over.
+   * @param {Function} predicate The function invoked per iteration.
+   * @returns {Array} Returns the new filtered array.
+   */
+  function arrayFilter(array, predicate) {
+    var index = -1,
+        length = array == null ? 0 : array.length,
+        resIndex = 0,
+        result = [];
+
+    while (++index < length) {
+      var value = array[index];
+      if (predicate(value, index, array)) {
+        result[resIndex++] = value;
+      }
+    }
+    return result;
+  }
+
+  /**
+   * A specialized version of `_.includes` for arrays without support for
+   * specifying an index to search from.
+   *
+   * @private
+   * @param {Array} [array] The array to inspect.
+   * @param {*} target The value to search for.
+   * @returns {boolean} Returns `true` if `target` is found, else `false`.
+   */
+  function arrayIncludes(array, value) {
+    var length = array == null ? 0 : array.length;
+    return !!length && baseIndexOf(array, value, 0) > -1;
+  }
+
+  /**
+   * This function is like `arrayIncludes` except that it accepts a comparator.
+   *
+   * @private
+   * @param {Array} [array] The array to inspect.
+   * @param {*} target The value to search for.
+   * @param {Function} comparator The comparator invoked per element.
+   * @returns {boolean} Returns `true` if `target` is found, else `false`.
+   */
+  function arrayIncludesWith(array, value, comparator) {
+    var index = -1,
+        length = array == null ? 0 : array.length;
+
+    while (++index < length) {
+      if (comparator(value, array[index])) {
+        return true;
+      }
+    }
+    return false;
+  }
+
+  /**
+   * A specialized version of `_.map` for arrays without support for iteratee
+   * shorthands.
+   *
+   * @private
+   * @param {Array} [array] The array to iterate over.
+   * @param {Function} iteratee The function invoked per iteration.
+   * @returns {Array} Returns the new mapped array.
+   */
+  function arrayMap(array, iteratee) {
+    var index = -1,
+        length = array == null ? 0 : array.length,
+        result = Array(length);
+
+    while (++index < length) {
+      result[index] = iteratee(array[index], index, array);
+    }
+    return result;
+  }
+
+  /**
+   * Appends the elements of `values` to `array`.
+   *
+   * @private
+   * @param {Array} array The array to modify.
+   * @param {Array} values The values to append.
+   * @returns {Array} Returns `array`.
+   */
+  function arrayPush(array, values) {
+    var index = -1,
+        length = values.length,
+        offset = array.length;
+
+    while (++index < length) {
+      array[offset + index] = values[index];
+    }
+    return array;
+  }
+
+  /**
+   * A specialized version of `_.reduce` for arrays without support for
+   * iteratee shorthands.
+   *
+   * @private
+   * @param {Array} [array] The array to iterate over.
+   * @param {Function} iteratee The function invoked per iteration.
+   * @param {*} [accumulator] The initial value.
+   * @param {boolean} [initAccum] Specify using the first element of `array` as
+   *  the initial value.
+   * @returns {*} Returns the accumulated value.
+   */
+  function arrayReduce(array, iteratee, accumulator, initAccum) {
+    var index = -1,
+        length = array == null ? 0 : array.length;
+
+    if (initAccum && length) {
+      accumulator = array[++index];
+    }
+    while (++index < length) {
+      accumulator = iteratee(accumulator, array[index], index, array);
+    }
+    return accumulator;
+  }
+
+  /**
+   * A specialized version of `_.reduceRight` for arrays without support for
+   * iteratee shorthands.
+   *
+   * @private
+   * @param {Array} [array] The array to iterate over.
+   * @param {Function} iteratee The function invoked per iteration.
+   * @param {*} [accumulator] The initial value.
+   * @param {boolean} [initAccum] Specify using the last element of `array` as
+   *  the initial value.
+   * @returns {*} Returns the accumulated value.
+   */
+  function arrayReduceRight(array, iteratee, accumulator, initAccum) {
+    var length = array == null ? 0 : array.length;
+    if (initAccum && length) {
+      accumulator = array[--length];
+    }
+    while (length--) {
+      accumulator = iteratee(accumulator, array[length], length, array);
+    }
+    return accumulator;
+  }
+
+  /**
+   * A specialized version of `_.some` for arrays without support for iteratee
+   * shorthands.
+   *
+   * @private
+   * @param {Array} [array] The array to iterate over.
+   * @param {Function} predicate The function invoked per iteration.
+   * @returns {boolean} Returns `true` if any element passes the predicate check,
+   *  else `false`.
+   */
+  function arraySome(array, predicate) {
+    var index = -1,
+        length = array == null ? 0 : array.length;
+
+    while (++index < length) {
+      if (predicate(array[index], index, array)) {
+        return true;
+      }
+    }
+    return false;
+  }
+
+  /**
+   * Gets the size of an ASCII `string`.
+   *
+   * @private
+   * @param {string} string The string inspect.
+   * @returns {number} Returns the string size.
+   */
+  var asciiSize = baseProperty('length');
+
+  /**
+   * Converts an ASCII `string` to an array.
+   *
+   * @private
+   * @param {string} string The string to convert.
+   * @returns {Array} Returns the converted array.
+   */
+  function asciiToArray(string) {
+    return string.split('');
+  }
+
+  /**
+   * Splits an ASCII `string` into an array of its words.
+   *
+   * @private
+   * @param {string} The string to inspect.
+   * @returns {Array} Returns the words of `string`.
+   */
+  function asciiWords(string) {
+    return string.match(reAsciiWord) || [];
+  }
+
+  /**
+   * The base implementation of methods like `_.findKey` and `_.findLastKey`,
+   * without support for iteratee shorthands, which iterates over `collection`
+   * using `eachFunc`.
+   *
+   * @private
+   * @param {Array|Object} collection The collection to inspect.
+   * @param {Function} predicate The function invoked per iteration.
+   * @param {Function} eachFunc The function to iterate over `collection`.
+   * @returns {*} Returns the found element or its key, else `undefined`.
+   */
+  function baseFindKey(collection, predicate, eachFunc) {
+    var result;
+    eachFunc(collection, function(value, key, collection) {
+      if (predicate(value, key, collection)) {
+        result = key;
+        return false;
+      }
+    });
+    return result;
+  }
+
+  /**
+   * The base implementation of `_.findIndex` and `_.findLastIndex` without
+   * support for iteratee shorthands.
+   *
+   * @private
+   * @param {Array} array The array to inspect.
+   * @param {Function} predicate The function invoked per iteration.
+   * @param {number} fromIndex The index to search from.
+   * @param {boolean} [fromRight] Specify iterating from right to left.
+   * @returns {number} Returns the index of the matched value, else `-1`.
+   */
+  function baseFindIndex(array, predicate, fromIndex, fromRight) {
+    var length = array.length,
+        index = fromIndex + (fromRight ? 1 : -1);
+
+    while ((fromRight ? index-- : ++index < length)) {
+      if (predicate(array[index], index, array)) {
+        return index;
+      }
+    }
+    return -1;
+  }
+
+  /**
+   * The base implementation of `_.indexOf` without `fromIndex` bounds checks.
+   *
+   * @private
+   * @param {Array} array The array to inspect.
+   * @param {*} value The value to search for.
+   * @param {number} fromIndex The index to search from.
+   * @returns {number} Returns the index of the matched value, else `-1`.
+   */
+  function baseIndexOf(array, value, fromIndex) {
+    return value === value
+      ? strictIndexOf(array, value, fromIndex)
+      : baseFindIndex(array, baseIsNaN, fromIndex);
+  }
+
+  /**
+   * This function is like `baseIndexOf` except that it accepts a comparator.
+   *
+   * @private
+   * @param {Array} array The array to inspect.
+   * @param {*} value The value to search for.
+   * @param {number} fromIndex The index to search from.
+   * @param {Function} comparator The comparator invoked per element.
+   * @returns {number} Returns the index of the matched value, else `-1`.
+   */
+  function baseIndexOfWith(array, value, fromIndex, comparator) {
+    var index = fromIndex - 1,
+        length = array.length;
+
+    while (++index < length) {
+      if (comparator(array[index], value)) {
+        return index;
+      }
+    }
+    return -1;
+  }
+
+  /**
+   * The base implementation of `_.isNaN` without support for number objects.
+   *
+   * @private
+   * @param {*} value The value to check.
+   * @returns {boolean} Returns `true` if `value` is `NaN`, else `false`.
+   */
+  function baseIsNaN(value) {
+    return value !== value;
+  }
+
+  /**
+   * The base implementation of `_.mean` and `_.meanBy` without support for
+   * iteratee shorthands.
+   *
+   * @private
+   * @param {Array} array The array to iterate over.
+   * @param {Function} iteratee The function invoked per iteration.
+   * @returns {number} Returns the mean.
+   */
+  function baseMean(array, iteratee) {
+    var length = array == null ? 0 : array.length;
+    return length ? (baseSum(array, iteratee) / length) : NAN;
+  }
+
+  /**
+   * The base implementation of `_.property` without support for deep paths.
+   *
+   * @private
+   * @param {string} key The key of the property to get.
+   * @returns {Function} Returns the new accessor function.
+   */
+  function baseProperty(key) {
+    return function(object) {
+      return object == null ? undefined : object[key];
+    };
+  }
+
+  /**
+   * The base implementation of `_.propertyOf` without support for deep paths.
+   *
+   * @private
+   * @param {Object} object The object to query.
+   * @returns {Function} Returns the new accessor function.
+   */
+  function basePropertyOf(object) {
+    return function(key) {
+      return object == null ? undefined : object[key];
+    };
+  }
+
+  /**
+   * The base implementation of `_.reduce` and `_.reduceRight`, without support
+   * for iteratee shorthands, which iterates over `collection` using `eachFunc`.
+   *
+   * @private
+   * @param {Array|Object} collection The collection to iterate over.
+   * @param {Function} iteratee The function invoked per iteration.
+   * @param {*} accumulator The initial value.
+   * @param {boolean} initAccum Specify using the first or last element of
+   *  `collection` as the initial value.
+   * @param {Function} eachFunc The function to iterate over `collection`.
+   * @returns {*} Returns the accumulated value.
+   */
+  function baseReduce(collection, iteratee, accumulator, initAccum, eachFunc) {
+    eachFunc(collection, function(value, index, collection) {
+      accumulator = initAccum
+        ? (initAccum = false, value)
+        : iteratee(accumulator, value, index, collection);
+    });
+    return accumulator;
+  }
+
+  /**
+   * The base implementation of `_.sortBy` which uses `comparer` to define the
+   * sort order of `array` and replaces criteria objects with their corresponding
+   * values.
+   *
+   * @private
+   * @param {Array} array The array to sort.
+   * @param {Function} comparer The function to define sort order.
+   * @returns {Array} Returns `array`.
+   */
+  function baseSortBy(array, comparer) {
+    var length = array.length;
+
+    array.sort(comparer);
+    while (length--) {
+      array[length] = array[length].value;
+    }
+    return array;
+  }
+
+  /**
+   * The base implementation of `_.sum` and `_.sumBy` without support for
+   * iteratee shorthands.
+   *
+   * @private
+   * @param {Array} array The array to iterate over.
+   * @param {Function} iteratee The function invoked per iteration.
+   * @returns {number} Returns the sum.
+   */
+  function baseSum(array, iteratee) {
+    var result,
+        index = -1,
+        length = array.length;
+
+    while (++index < length) {
+      var current = iteratee(array[index]);
+      if (current !== undefined) {
+        result = result === undefined ? current : (result + current);
+      }
+    }
+    return result;
+  }
+
+  /**
+   * The base implementation of `_.times` without support for iteratee shorthands
+   * or max array length checks.
+   *
+   * @private
+   * @param {number} n The number of times to invoke `iteratee`.
+   * @param {Function} iteratee The function invoked per iteration.
+   * @returns {Array} Returns the array of results.
+   */
+  function baseTimes(n, iteratee) {
+    var index = -1,
+        result = Array(n);
+
+    while (++index < n) {
+      result[index] = iteratee(index);
+    }
+    return result;
+  }
+
+  /**
+   * The base implementation of `_.toPairs` and `_.toPairsIn` which creates an array
+   * of key-value pairs for `object` corresponding to the property names of `props`.
+   *
+   * @private
+   * @param {Object} object The object to query.
+   * @param {Array} props The property names to get values for.
+   * @returns {Object} Returns the key-value pairs.
+   */
+  function baseToPairs(object, props) {
+    return arrayMap(props, function(key) {
+      return [key, object[key]];
+    });
+  }
+
+  /**
+   * The base implementation of `_.trim`.
+   *
+   * @private
+   * @param {string} string The string to trim.
+   * @returns {string} Returns the trimmed string.
+   */
+  function baseTrim(string) {
+    return string
+      ? string.slice(0, trimmedEndIndex(string) + 1).replace(reTrimStart, '')
+      : string;
+  }
+
+  /**
+   * The base implementation of `_.unary` without support for storing metadata.
+   *
+   * @private
+   * @param {Function} func The function to cap arguments for.
+   * @returns {Function} Returns the new capped function.
+   */
+  function baseUnary(func) {
+    return function(value) {
+      return func(value);
+    };
+  }
+
+  /**
+   * The base implementation of `_.values` and `_.valuesIn` which creates an
+   * array of `object` property values corresponding to the property names
+   * of `props`.
+   *
+   * @private
+   * @param {Object} object The object to query.
+   * @param {Array} props The property names to get values for.
+   * @returns {Object} Returns the array of property values.
+   */
+  function baseValues(object, props) {
+    return arrayMap(props, function(key) {
+      return object[key];
+    });
+  }
+
+  /**
+   * Checks if a `cache` value for `key` exists.
+   *
+   * @private
+   * @param {Object} cache The cache to query.
+   * @param {string} key The key of the entry to check.
+   * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
+   */
+  function cacheHas(cache, key) {
+    return cache.has(key);
+  }
+
+  /**
+   * Used by `_.trim` and `_.trimStart` to get the index of the first string symbol
+   * that is not found in the character symbols.
+   *
+   * @private
+   * @param {Array} strSymbols The string symbols to inspect.
+   * @param {Array} chrSymbols The character symbols to find.
+   * @returns {number} Returns the index of the first unmatched string symbol.
+   */
+  function charsStartIndex(strSymbols, chrSymbols) {
+    var index = -1,
+        length = strSymbols.length;
+
+    while (++index < length && baseIndexOf(chrSymbols, strSymbols[index], 0) > -1) {}
+    return index;
+  }
+
+  /**
+   * Used by `_.trim` and `_.trimEnd` to get the index of the last string symbol
+   * that is not found in the character symbols.
+   *
+   * @private
+   * @param {Array} strSymbols The string symbols to inspect.
+   * @param {Array} chrSymbols The character symbols to find.
+   * @returns {number} Returns the index of the last unmatched string symbol.
+   */
+  function charsEndIndex(strSymbols, chrSymbols) {
+    var index = strSymbols.length;
+
+    while (index-- && baseIndexOf(chrSymbols, strSymbols[index], 0) > -1) {}
+    return index;
+  }
+
+  /**
+   * Gets the number of `placeholder` occurrences in `array`.
+   *
+   * @private
+   * @param {Array} array The array to inspect.
+   * @param {*} placeholder The placeholder to search for.
+   * @returns {number} Returns the placeholder count.
+   */
+  function countHolders(array, placeholder) {
+    var length = array.length,
+        result = 0;
+
+    while (length--) {
+      if (array[length] === placeholder) {
+        ++result;
+      }
+    }
+    return result;
+  }
+
+  /**
+   * Used by `_.deburr` to convert Latin-1 Supplement and Latin Extended-A
+   * letters to basic Latin letters.
+   *
+   * @private
+   * @param {string} letter The matched letter to deburr.
+   * @returns {string} Returns the deburred letter.
+   */
+  var deburrLetter = basePropertyOf(deburredLetters);
+
+  /**
+   * Used by `_.escape` to convert characters to HTML entities.
+   *
+   * @private
+   * @param {string} chr The matched character to escape.
+   * @returns {string} Returns the escaped character.
+   */
+  var escapeHtmlChar = basePropertyOf(htmlEscapes);
+
+  /**
+   * Used by `_.template` to escape characters for inclusion in compiled string literals.
+   *
+   * @private
+   * @param {string} chr The matched character to escape.
+   * @returns {string} Returns the escaped character.
+   */
+  function escapeStringChar(chr) {
+    return '\\' + stringEscapes[chr];
+  }
+
+  /**
+   * Gets the value at `key` of `object`.
+   *
+   * @private
+   * @param {Object} [object] The object to query.
+   * @param {string} key The key of the property to get.
+   * @returns {*} Returns the property value.
+   */
+  function getValue(object, key) {
+    return object == null ? undefined : object[key];
+  }
+
+  /**
+   * Checks if `string` contains Unicode symbols.
+   *
+   * @private
+   * @param {string} string The string to inspect.
+   * @returns {boolean} Returns `true` if a symbol is found, else `false`.
+   */
+  function hasUnicode(string) {
+    return reHasUnicode.test(string);
+  }
+
+  /**
+   * Checks if `string` contains a word composed of Unicode symbols.
+   *
+   * @private
+   * @param {string} string The string to inspect.
+   * @returns {boolean} Returns `true` if a word is found, else `false`.
+   */
+  function hasUnicodeWord(string) {
+    return reHasUnicodeWord.test(string);
+  }
+
+  /**
+   * Converts `iterator` to an array.
+   *
+   * @private
+   * @param {Object} iterator The iterator to convert.
+   * @returns {Array} Returns the converted array.
+   */
+  function iteratorToArray(iterator) {
+    var data,
+        result = [];
+
+    while (!(data = iterator.next()).done) {
+      result.push(data.value);
+    }
+    return result;
+  }
+
+  /**
+   * Converts `map` to its key-value pairs.
+   *
+   * @private
+   * @param {Object} map The map to convert.
+   * @returns {Array} Returns the key-value pairs.
+   */
+  function mapToArray(map) {
+    var index = -1,
+        result = Array(map.size);
+
+    map.forEach(function(value, key) {
+      result[++index] = [key, value];
+    });
+    return result;
+  }
+
+  /**
+   * Creates a unary function that invokes `func` with its argument transformed.
+   *
+   * @private
+   * @param {Function} func The function to wrap.
+   * @param {Function} transform The argument transform.
+   * @returns {Function} Returns the new function.
+   */
+  function overArg(func, transform) {
+    return function(arg) {
+      return func(transform(arg));
+    };
+  }
+
+  /**
+   * Replaces all `placeholder` elements in `array` with an internal placeholder
+   * and returns an array of their indexes.
+   *
+   * @private
+   * @param {Array} array The array to modify.
+   * @param {*} placeholder The placeholder to replace.
+   * @returns {Array} Returns the new array of placeholder indexes.
+   */
+  function replaceHolders(array, placeholder) {
+    var index = -1,
+        length = array.length,
+        resIndex = 0,
+        result = [];
+
+    while (++index < length) {
+      var value = array[index];
+      if (value === placeholder || value === PLACEHOLDER) {
+        array[index] = PLACEHOLDER;
+        result[resIndex++] = index;
+      }
+    }
+    return result;
+  }
+
+  /**
+   * Converts `set` to an array of its values.
+   *
+   * @private
+   * @param {Object} set The set to convert.
+   * @returns {Array} Returns the values.
+   */
+  function setToArray(set) {
+    var index = -1,
+        result = Array(set.size);
+
+    set.forEach(function(value) {
+      result[++index] = value;
+    });
+    return result;
+  }
+
+  /**
+   * Converts `set` to its value-value pairs.
+   *
+   * @private
+   * @param {Object} set The set to convert.
+   * @returns {Array} Returns the value-value pairs.
+   */
+  function setToPairs(set) {
+    var index = -1,
+        result = Array(set.size);
+
+    set.forEach(function(value) {
+      result[++index] = [value, value];
+    });
+    return result;
+  }
+
+  /**
+   * A specialized version of `_.indexOf` which performs strict equality
+   * comparisons of values, i.e. `===`.
+   *
+   * @private
+   * @param {Array} array The array to inspect.
+   * @param {*} value The value to search for.
+   * @param {number} fromIndex The index to search from.
+   * @returns {number} Returns the index of the matched value, else `-1`.
+   */
+  function strictIndexOf(array, value, fromIndex) {
+    var index = fromIndex - 1,
+        length = array.length;
+
+    while (++index < length) {
+      if (array[index] === value) {
+        return index;
+      }
+    }
+    return -1;
+  }
+
+  /**
+   * A specialized version of `_.lastIndexOf` which performs strict equality
+   * comparisons of values, i.e. `===`.
+   *
+   * @private
+   * @param {Array} array The array to inspect.
+   * @param {*} value The value to search for.
+   * @param {number} fromIndex The index to search from.
+   * @returns {number} Returns the index of the matched value, else `-1`.
+   */
+  function strictLastIndexOf(array, value, fromIndex) {
+    var index = fromIndex + 1;
+    while (index--) {
+      if (array[index] === value) {
+        return index;
+      }
+    }
+    return index;
+  }
+
+  /**
+   * Gets the number of symbols in `string`.
+   *
+   * @private
+   * @param {string} string The string to inspect.
+   * @returns {number} Returns the string size.
+   */
+  function stringSize(string) {
+    return hasUnicode(string)
+      ? unicodeSize(string)
+      : asciiSize(string);
+  }
+
+  /**
+   * Converts `string` to an array.
+   *
+   * @private
+   * @param {string} string The string to convert.
+   * @returns {Array} Returns the converted array.
+   */
+  function stringToArray(string) {
+    return hasUnicode(string)
+      ? unicodeToArray(string)
+      : asciiToArray(string);
+  }
+
+  /**
+   * Used by `_.trim` and `_.trimEnd` to get the index of the last non-whitespace
+   * character of `string`.
+   *
+   * @private
+   * @param {string} string The string to inspect.
+   * @returns {number} Returns the index of the last non-whitespace character.
+   */
+  function trimmedEndIndex(string) {
+    var index = string.length;
+
+    while (index-- && reWhitespace.test(string.charAt(index))) {}
+    return index;
+  }
+
+  /**
+   * Used by `_.unescape` to convert HTML entities to characters.
+   *
+   * @private
+   * @param {string} chr The matched character to unescape.
+   * @returns {string} Returns the unescaped character.
+   */
+  var unescapeHtmlChar = basePropertyOf(htmlUnescapes);
+
+  /**
+   * Gets the size of a Unicode `string`.
+   *
+   * @private
+   * @param {string} string The string inspect.
+   * @returns {number} Returns the string size.
+   */
+  function unicodeSize(string) {
+    var result = reUnicode.lastIndex = 0;
+    while (reUnicode.test(string)) {
+      ++result;
+    }
+    return result;
+  }
+
+  /**
+   * Converts a Unicode `string` to an array.
+   *
+   * @private
+   * @param {string} string The string to convert.
+   * @returns {Array} Returns the converted array.
+   */
+  function unicodeToArray(string) {
+    return string.match(reUnicode) || [];
+  }
+
+  /**
+   * Splits a Unicode `string` into an array of its words.
+   *
+   * @private
+   * @param {string} The string to inspect.
+   * @returns {Array} Returns the words of `string`.
+   */
+  function unicodeWords(string) {
+    return string.match(reUnicodeWord) || [];
+  }
+
+  /*--------------------------------------------------------------------------*/
+
+  /**
+   * Create a new pristine `lodash` function using the `context` object.
+   *
+   * @static
+   * @memberOf _
+   * @since 1.1.0
+   * @category Util
+   * @param {Object} [context=root] The context object.
+   * @returns {Function} Returns a new `lodash` function.
+   * @example
+   *
+   * _.mixin({ 'foo': _.constant('foo') });
+   *
+   * var lodash = _.runInContext();
+   * lodash.mixin({ 'bar': lodash.constant('bar') });
+   *
+   * _.isFunction(_.foo);
+   * // => true
+   * _.isFunction(_.bar);
+   * // => false
+   *
+   * lodash.isFunction(lodash.foo);
+   * // => false
+   * lodash.isFunction(lodash.bar);
+   * // => true
+   *
+   * // Create a suped-up `defer` in Node.js.
+   * var defer = _.runInContext({ 'setTimeout': setImmediate }).defer;
+   */
+  var runInContext = (function runInContext(context) {
+    context = context == null ? root : _.defaults(root.Object(), context, _.pick(root, contextProps));
+
+    /** Built-in constructor references. */
+    var Array = context.Array,
+        Date = context.Date,
+        Error = context.Error,
+        Function = context.Function,
+        Math = context.Math,
+        Object = context.Object,
+        RegExp = context.RegExp,
+        String = context.String,
+        TypeError = context.TypeError;
+
+    /** Used for built-in method references. */
+    var arrayProto = Array.prototype,
+        funcProto = Function.prototype,
+        objectProto = Object.prototype;
+
+    /** Used to detect overreaching core-js shims. */
+    var coreJsData = context['__core-js_shared__'];
+
+    /** Used to resolve the decompiled source of functions. */
+    var funcToString = funcProto.toString;
+
+    /** Used to check objects for own properties. */
+    var hasOwnProperty = objectProto.hasOwnProperty;
+
+    /** Used to generate unique IDs. */
+    var idCounter = 0;
+
+    /** Used to detect methods masquerading as native. */
+    var maskSrcKey = (function() {
+      var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || '');
+      return uid ? ('Symbol(src)_1.' + uid) : '';
+    }());
+
+    /**
+     * Used to resolve the
+     * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
+     * of values.
+     */
+    var nativeObjectToString = objectProto.toString;
+
+    /** Used to infer the `Object` constructor. */
+    var objectCtorString = funcToString.call(Object);
+
+    /** Used to restore the original `_` reference in `_.noConflict`. */
+    var oldDash = root._;
+
+    /** Used to detect if a method is native. */
+    var reIsNative = RegExp('^' +
+      funcToString.call(hasOwnProperty).replace(reRegExpChar, '\\$&')
+      .replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, '$1.*?') + '$'
+    );
+
+    /** Built-in value references. */
+    var Buffer = moduleExports ? context.Buffer : undefined,
+        Symbol = context.Symbol,
+        Uint8Array = context.Uint8Array,
+        allocUnsafe = Buffer ? Buffer.allocUnsafe : undefined,
+        getPrototype = overArg(Object.getPrototypeOf, Object),
+        objectCreate = Object.create,
+        propertyIsEnumerable = objectProto.propertyIsEnumerable,
+        splice = arrayProto.splice,
+        spreadableSymbol = Symbol ? Symbol.isConcatSpreadable : undefined,
+        symIterator = Symbol ? Symbol.iterator : undefined,
+        symToStringTag = Symbol ? Symbol.toStringTag : undefined;
+
+    var defineProperty = (function() {
+      try {
+        var func = getNative(Object, 'defineProperty');
+        func({}, '', {});
+        return func;
+      } catch (e) {}
+    }());
+
+    /** Mocked built-ins. */
+    var ctxClearTimeout = context.clearTimeout !== root.clearTimeout && context.clearTimeout,
+        ctxNow = Date && Date.now !== root.Date.now && Date.now,
+        ctxSetTimeout = context.setTimeout !== root.setTimeout && context.setTimeout;
+
+    /* Built-in method references for those with the same name as other `lodash` methods. */
+    var nativeCeil = Math.ceil,
+        nativeFloor = Math.floor,
+        nativeGetSymbols = Object.getOwnPropertySymbols,
+        nativeIsBuffer = Buffer ? Buffer.isBuffer : undefined,
+        nativeIsFinite = context.isFinite,
+        nativeJoin = arrayProto.join,
+        nativeKeys = overArg(Object.keys, Object),
+        nativeMax = Math.max,
+        nativeMin = Math.min,
+        nativeNow = Date.now,
+        nativeParseInt = context.parseInt,
+        nativeRandom = Math.random,
+        nativeReverse = arrayProto.reverse;
+
+    /* Built-in method references that are verified to be native. */
+    var DataView = getNative(context, 'DataView'),
+        Map = getNative(context, 'Map'),
+        Promise = getNative(context, 'Promise'),
+        Set = getNative(context, 'Set'),
+        WeakMap = getNative(context, 'WeakMap'),
+        nativeCreate = getNative(Object, 'create');
+
+    /** Used to store function metadata. */
+    var metaMap = WeakMap && new WeakMap;
+
+    /** Used to lookup unminified function names. */
+    var realNames = {};
+
+    /** Used to detect maps, sets, and weakmaps. */
+    var dataViewCtorString = toSource(DataView),
+        mapCtorString = toSource(Map),
+        promiseCtorString = toSource(Promise),
+        setCtorString = toSource(Set),
+        weakMapCtorString = toSource(WeakMap);
+
+    /** Used to convert symbols to primitives and strings. */
+    var symbolProto = Symbol ? Symbol.prototype : undefined,
+        symbolValueOf = symbolProto ? symbolProto.valueOf : undefined,
+        symbolToString = symbolProto ? symbolProto.toString : undefined;
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Creates a `lodash` object which wraps `value` to enable implicit method
+     * chain sequences. Methods that operate on and return arrays, collections,
+     * and functions can be chained together. Methods that retrieve a single value
+     * or may return a primitive value will automatically end the chain sequence
+     * and return the unwrapped value. Otherwise, the value must be unwrapped
+     * with `_#value`.
+     *
+     * Explicit chain sequences, which must be unwrapped with `_#value`, may be
+     * enabled using `_.chain`.
+     *
+     * The execution of chained methods is lazy, that is, it's deferred until
+     * `_#value` is implicitly or explicitly called.
+     *
+     * Lazy evaluation allows several methods to support shortcut fusion.
+     * Shortcut fusion is an optimization to merge iteratee calls; this avoids
+     * the creation of intermediate arrays and can greatly reduce the number of
+     * iteratee executions. Sections of a chain sequence qualify for shortcut
+     * fusion if the section is applied to an array and iteratees accept only
+     * one argument. The heuristic for whether a section qualifies for shortcut
+     * fusion is subject to change.
+     *
+     * Chaining is supported in custom builds as long as the `_#value` method is
+     * directly or indirectly included in the build.
+     *
+     * In addition to lodash methods, wrappers have `Array` and `String` methods.
+     *
+     * The wrapper `Array` methods are:
+     * `concat`, `join`, `pop`, `push`, `shift`, `sort`, `splice`, and `unshift`
+     *
+     * The wrapper `String` methods are:
+     * `replace` and `split`
+     *
+     * The wrapper methods that support shortcut fusion are:
+     * `at`, `compact`, `drop`, `dropRight`, `dropWhile`, `filter`, `find`,
+     * `findLast`, `head`, `initial`, `last`, `map`, `reject`, `reverse`, `slice`,
+     * `tail`, `take`, `takeRight`, `takeRightWhile`, `takeWhile`, and `toArray`
+     *
+     * The chainable wrapper methods are:
+     * `after`, `ary`, `assign`, `assignIn`, `assignInWith`, `assignWith`, `at`,
+     * `before`, `bind`, `bindAll`, `bindKey`, `castArray`, `chain`, `chunk`,
+     * `commit`, `compact`, `concat`, `conforms`, `constant`, `countBy`, `create`,
+     * `curry`, `debounce`, `defaults`, `defaultsDeep`, `defer`, `delay`,
+     * `difference`, `differenceBy`, `differenceWith`, `drop`, `dropRight`,
+     * `dropRightWhile`, `dropWhile`, `extend`, `extendWith`, `fill`, `filter`,
+     * `flatMap`, `flatMapDeep`, `flatMapDepth`, `flatten`, `flattenDeep`,
+     * `flattenDepth`, `flip`, `flow`, `flowRight`, `fromPairs`, `functions`,
+     * `functionsIn`, `groupBy`, `initial`, `intersection`, `intersectionBy`,
+     * `intersectionWith`, `invert`, `invertBy`, `invokeMap`, `iteratee`, `keyBy`,
+     * `keys`, `keysIn`, `map`, `mapKeys`, `mapValues`, `matches`, `matchesProperty`,
+     * `memoize`, `merge`, `mergeWith`, `method`, `methodOf`, `mixin`, `negate`,
+     * `nthArg`, `omit`, `omitBy`, `once`, `orderBy`, `over`, `overArgs`,
+     * `overEvery`, `overSome`, `partial`, `partialRight`, `partition`, `pick`,
+     * `pickBy`, `plant`, `property`, `propertyOf`, `pull`, `pullAll`, `pullAllBy`,
+     * `pullAllWith`, `pullAt`, `push`, `range`, `rangeRight`, `rearg`, `reject`,
+     * `remove`, `rest`, `reverse`, `sampleSize`, `set`, `setWith`, `shuffle`,
+     * `slice`, `sort`, `sortBy`, `splice`, `spread`, `tail`, `take`, `takeRight`,
+     * `takeRightWhile`, `takeWhile`, `tap`, `throttle`, `thru`, `toArray`,
+     * `toPairs`, `toPairsIn`, `toPath`, `toPlainObject`, `transform`, `unary`,
+     * `union`, `unionBy`, `unionWith`, `uniq`, `uniqBy`, `uniqWith`, `unset`,
+     * `unshift`, `unzip`, `unzipWith`, `update`, `updateWith`, `values`,
+     * `valuesIn`, `without`, `wrap`, `xor`, `xorBy`, `xorWith`, `zip`,
+     * `zipObject`, `zipObjectDeep`, and `zipWith`
+     *
+     * The wrapper methods that are **not** chainable by default are:
+     * `add`, `attempt`, `camelCase`, `capitalize`, `ceil`, `clamp`, `clone`,
+     * `cloneDeep`, `cloneDeepWith`, `cloneWith`, `conformsTo`, `deburr`,
+     * `defaultTo`, `divide`, `each`, `eachRight`, `endsWith`, `eq`, `escape`,
+     * `escapeRegExp`, `every`, `find`, `findIndex`, `findKey`, `findLast`,
+     * `findLastIndex`, `findLastKey`, `first`, `floor`, `forEach`, `forEachRight`,
+     * `forIn`, `forInRight`, `forOwn`, `forOwnRight`, `get`, `gt`, `gte`, `has`,
+     * `hasIn`, `head`, `identity`, `includes`, `indexOf`, `inRange`, `invoke`,
+     * `isArguments`, `isArray`, `isArrayBuffer`, `isArrayLike`, `isArrayLikeObject`,
+     * `isBoolean`, `isBuffer`, `isDate`, `isElement`, `isEmpty`, `isEqual`,
+     * `isEqualWith`, `isError`, `isFinite`, `isFunction`, `isInteger`, `isLength`,
+     * `isMap`, `isMatch`, `isMatchWith`, `isNaN`, `isNative`, `isNil`, `isNull`,
+     * `isNumber`, `isObject`, `isObjectLike`, `isPlainObject`, `isRegExp`,
+     * `isSafeInteger`, `isSet`, `isString`, `isUndefined`, `isTypedArray`,
+     * `isWeakMap`, `isWeakSet`, `join`, `kebabCase`, `last`, `lastIndexOf`,
+     * `lowerCase`, `lowerFirst`, `lt`, `lte`, `max`, `maxBy`, `mean`, `meanBy`,
+     * `min`, `minBy`, `multiply`, `noConflict`, `noop`, `now`, `nth`, `pad`,
+     * `padEnd`, `padStart`, `parseInt`, `pop`, `random`, `reduce`, `reduceRight`,
+     * `repeat`, `result`, `round`, `runInContext`, `sample`, `shift`, `size`,
+     * `snakeCase`, `some`, `sortedIndex`, `sortedIndexBy`, `sortedLastIndex`,
+     * `sortedLastIndexBy`, `startCase`, `startsWith`, `stubArray`, `stubFalse`,
+     * `stubObject`, `stubString`, `stubTrue`, `subtract`, `sum`, `sumBy`,
+     * `template`, `times`, `toFinite`, `toInteger`, `toJSON`, `toLength`,
+     * `toLower`, `toNumber`, `toSafeInteger`, `toString`, `toUpper`, `trim`,
+     * `trimEnd`, `trimStart`, `truncate`, `unescape`, `uniqueId`, `upperCase`,
+     * `upperFirst`, `value`, and `words`
+     *
+     * @name _
+     * @constructor
+     * @category Seq
+     * @param {*} value The value to wrap in a `lodash` instance.
+     * @returns {Object} Returns the new `lodash` wrapper instance.
+     * @example
+     *
+     * function square(n) {
+     *   return n * n;
+     * }
+     *
+     * var wrapped = _([1, 2, 3]);
+     *
+     * // Returns an unwrapped value.
+     * wrapped.reduce(_.add);
+     * // => 6
+     *
+     * // Returns a wrapped value.
+     * var squares = wrapped.map(square);
+     *
+     * _.isArray(squares);
+     * // => false
+     *
+     * _.isArray(squares.value());
+     * // => true
+     */
+    function lodash(value) {
+      if (isObjectLike(value) && !isArray(value) && !(value instanceof LazyWrapper)) {
+        if (value instanceof LodashWrapper) {
+          return value;
+        }
+        if (hasOwnProperty.call(value, '__wrapped__')) {
+          return wrapperClone(value);
+        }
+      }
+      return new LodashWrapper(value);
+    }
+
+    /**
+     * The base implementation of `_.create` without support for assigning
+     * properties to the created object.
+     *
+     * @private
+     * @param {Object} proto The object to inherit from.
+     * @returns {Object} Returns the new object.
+     */
+    var baseCreate = (function() {
+      function object() {}
+      return function(proto) {
+        if (!isObject(proto)) {
+          return {};
+        }
+        if (objectCreate) {
+          return objectCreate(proto);
+        }
+        object.prototype = proto;
+        var result = new object;
+        object.prototype = undefined;
+        return result;
+      };
+    }());
+
+    /**
+     * The function whose prototype chain sequence wrappers inherit from.
+     *
+     * @private
+     */
+    function baseLodash() {
+      // No operation performed.
+    }
+
+    /**
+     * The base constructor for creating `lodash` wrapper objects.
+     *
+     * @private
+     * @param {*} value The value to wrap.
+     * @param {boolean} [chainAll] Enable explicit method chain sequences.
+     */
+    function LodashWrapper(value, chainAll) {
+      this.__wrapped__ = value;
+      this.__actions__ = [];
+      this.__chain__ = !!chainAll;
+      this.__index__ = 0;
+      this.__values__ = undefined;
+    }
+
+    /**
+     * By default, the template delimiters used by lodash are like those in
+     * embedded Ruby (ERB) as well as ES2015 template strings. Change the
+     * following template settings to use alternative delimiters.
+     *
+     * @static
+     * @memberOf _
+     * @type {Object}
+     */
+    lodash.templateSettings = {
+
+      /**
+       * Used to detect `data` property values to be HTML-escaped.
+       *
+       * @memberOf _.templateSettings
+       * @type {RegExp}
+       */
+      'escape': reEscape,
+
+      /**
+       * Used to detect code to be evaluated.
+       *
+       * @memberOf _.templateSettings
+       * @type {RegExp}
+       */
+      'evaluate': reEvaluate,
+
+      /**
+       * Used to detect `data` property values to inject.
+       *
+       * @memberOf _.templateSettings
+       * @type {RegExp}
+       */
+      'interpolate': reInterpolate,
+
+      /**
+       * Used to reference the data object in the template text.
+       *
+       * @memberOf _.templateSettings
+       * @type {string}
+       */
+      'variable': '',
+
+      /**
+       * Used to import variables into the compiled template.
+       *
+       * @memberOf _.templateSettings
+       * @type {Object}
+       */
+      'imports': {
+
+        /**
+         * A reference to the `lodash` function.
+         *
+         * @memberOf _.templateSettings.imports
+         * @type {Function}
+         */
+        '_': lodash
+      }
+    };
+
+    // Ensure wrappers are instances of `baseLodash`.
+    lodash.prototype = baseLodash.prototype;
+    lodash.prototype.constructor = lodash;
+
+    LodashWrapper.prototype = baseCreate(baseLodash.prototype);
+    LodashWrapper.prototype.constructor = LodashWrapper;
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Creates a lazy wrapper object which wraps `value` to enable lazy evaluation.
+     *
+     * @private
+     * @constructor
+     * @param {*} value The value to wrap.
+     */
+    function LazyWrapper(value) {
+      this.__wrapped__ = value;
+      this.__actions__ = [];
+      this.__dir__ = 1;
+      this.__filtered__ = false;
+      this.__iteratees__ = [];
+      this.__takeCount__ = MAX_ARRAY_LENGTH;
+      this.__views__ = [];
+    }
+
+    /**
+     * Creates a clone of the lazy wrapper object.
+     *
+     * @private
+     * @name clone
+     * @memberOf LazyWrapper
+     * @returns {Object} Returns the cloned `LazyWrapper` object.
+     */
+    function lazyClone() {
+      var result = new LazyWrapper(this.__wrapped__);
+      result.__actions__ = copyArray(this.__actions__);
+      result.__dir__ = this.__dir__;
+      result.__filtered__ = this.__filtered__;
+      result.__iteratees__ = copyArray(this.__iteratees__);
+      result.__takeCount__ = this.__takeCount__;
+      result.__views__ = copyArray(this.__views__);
+      return result;
+    }
+
+    /**
+     * Reverses the direction of lazy iteration.
+     *
+     * @private
+     * @name reverse
+     * @memberOf LazyWrapper
+     * @returns {Object} Returns the new reversed `LazyWrapper` object.
+     */
+    function lazyReverse() {
+      if (this.__filtered__) {
+        var result = new LazyWrapper(this);
+        result.__dir__ = -1;
+        result.__filtered__ = true;
+      } else {
+        result = this.clone();
+        result.__dir__ *= -1;
+      }
+      return result;
+    }
+
+    /**
+     * Extracts the unwrapped value from its lazy wrapper.
+     *
+     * @private
+     * @name value
+     * @memberOf LazyWrapper
+     * @returns {*} Returns the unwrapped value.
+     */
+    function lazyValue() {
+      var array = this.__wrapped__.value(),
+          dir = this.__dir__,
+          isArr = isArray(array),
+          isRight = dir < 0,
+          arrLength = isArr ? array.length : 0,
+          view = getView(0, arrLength, this.__views__),
+          start = view.start,
+          end = view.end,
+          length = end - start,
+          index = isRight ? end : (start - 1),
+          iteratees = this.__iteratees__,
+          iterLength = iteratees.length,
+          resIndex = 0,
+          takeCount = nativeMin(length, this.__takeCount__);
+
+      if (!isArr || (!isRight && arrLength == length && takeCount == length)) {
+        return baseWrapperValue(array, this.__actions__);
+      }
+      var result = [];
+
+      outer:
+      while (length-- && resIndex < takeCount) {
+        index += dir;
+
+        var iterIndex = -1,
+            value = array[index];
+
+        while (++iterIndex < iterLength) {
+          var data = iteratees[iterIndex],
+              iteratee = data.iteratee,
+              type = data.type,
+              computed = iteratee(value);
+
+          if (type == LAZY_MAP_FLAG) {
+            value = computed;
+          } else if (!computed) {
+            if (type == LAZY_FILTER_FLAG) {
+              continue outer;
+            } else {
+              break outer;
+            }
+          }
+        }
+        result[resIndex++] = value;
+      }
+      return result;
+    }
+
+    // Ensure `LazyWrapper` is an instance of `baseLodash`.
+    LazyWrapper.prototype = baseCreate(baseLodash.prototype);
+    LazyWrapper.prototype.constructor = LazyWrapper;
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Creates a hash object.
+     *
+     * @private
+     * @constructor
+     * @param {Array} [entries] The key-value pairs to cache.
+     */
+    function Hash(entries) {
+      var index = -1,
+          length = entries == null ? 0 : entries.length;
+
+      this.clear();
+      while (++index < length) {
+        var entry = entries[index];
+        this.set(entry[0], entry[1]);
+      }
+    }
+
+    /**
+     * Removes all key-value entries from the hash.
+     *
+     * @private
+     * @name clear
+     * @memberOf Hash
+     */
+    function hashClear() {
+      this.__data__ = nativeCreate ? nativeCreate(null) : {};
+      this.size = 0;
+    }
+
+    /**
+     * Removes `key` and its value from the hash.
+     *
+     * @private
+     * @name delete
+     * @memberOf Hash
+     * @param {Object} hash The hash to modify.
+     * @param {string} key The key of the value to remove.
+     * @returns {boolean} Returns `true` if the entry was removed, else `false`.
+     */
+    function hashDelete(key) {
+      var result = this.has(key) && delete this.__data__[key];
+      this.size -= result ? 1 : 0;
+      return result;
+    }
+
+    /**
+     * Gets the hash value for `key`.
+     *
+     * @private
+     * @name get
+     * @memberOf Hash
+     * @param {string} key The key of the value to get.
+     * @returns {*} Returns the entry value.
+     */
+    function hashGet(key) {
+      var data = this.__data__;
+      if (nativeCreate) {
+        var result = data[key];
+        return result === HASH_UNDEFINED ? undefined : result;
+      }
+      return hasOwnProperty.call(data, key) ? data[key] : undefined;
+    }
+
+    /**
+     * Checks if a hash value for `key` exists.
+     *
+     * @private
+     * @name has
+     * @memberOf Hash
+     * @param {string} key The key of the entry to check.
+     * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
+     */
+    function hashHas(key) {
+      var data = this.__data__;
+      return nativeCreate ? (data[key] !== undefined) : hasOwnProperty.call(data, key);
+    }
+
+    /**
+     * Sets the hash `key` to `value`.
+     *
+     * @private
+     * @name set
+     * @memberOf Hash
+     * @param {string} key The key of the value to set.
+     * @param {*} value The value to set.
+     * @returns {Object} Returns the hash instance.
+     */
+    function hashSet(key, value) {
+      var data = this.__data__;
+      this.size += this.has(key) ? 0 : 1;
+      data[key] = (nativeCreate && value === undefined) ? HASH_UNDEFINED : value;
+      return this;
+    }
+
+    // Add methods to `Hash`.
+    Hash.prototype.clear = hashClear;
+    Hash.prototype['delete'] = hashDelete;
+    Hash.prototype.get = hashGet;
+    Hash.prototype.has = hashHas;
+    Hash.prototype.set = hashSet;
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Creates an list cache object.
+     *
+     * @private
+     * @constructor
+     * @param {Array} [entries] The key-value pairs to cache.
+     */
+    function ListCache(entries) {
+      var index = -1,
+          length = entries == null ? 0 : entries.length;
+
+      this.clear();
+      while (++index < length) {
+        var entry = entries[index];
+        this.set(entry[0], entry[1]);
+      }
+    }
+
+    /**
+     * Removes all key-value entries from the list cache.
+     *
+     * @private
+     * @name clear
+     * @memberOf ListCache
+     */
+    function listCacheClear() {
+      this.__data__ = [];
+      this.size = 0;
+    }
+
+    /**
+     * Removes `key` and its value from the list cache.
+     *
+     * @private
+     * @name delete
+     * @memberOf ListCache
+     * @param {string} key The key of the value to remove.
+     * @returns {boolean} Returns `true` if the entry was removed, else `false`.
+     */
+    function listCacheDelete(key) {
+      var data = this.__data__,
+          index = assocIndexOf(data, key);
+
+      if (index < 0) {
+        return false;
+      }
+      var lastIndex = data.length - 1;
+      if (index == lastIndex) {
+        data.pop();
+      } else {
+        splice.call(data, index, 1);
+      }
+      --this.size;
+      return true;
+    }
+
+    /**
+     * Gets the list cache value for `key`.
+     *
+     * @private
+     * @name get
+     * @memberOf ListCache
+     * @param {string} key The key of the value to get.
+     * @returns {*} Returns the entry value.
+     */
+    function listCacheGet(key) {
+      var data = this.__data__,
+          index = assocIndexOf(data, key);
+
+      return index < 0 ? undefined : data[index][1];
+    }
+
+    /**
+     * Checks if a list cache value for `key` exists.
+     *
+     * @private
+     * @name has
+     * @memberOf ListCache
+     * @param {string} key The key of the entry to check.
+     * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
+     */
+    function listCacheHas(key) {
+      return assocIndexOf(this.__data__, key) > -1;
+    }
+
+    /**
+     * Sets the list cache `key` to `value`.
+     *
+     * @private
+     * @name set
+     * @memberOf ListCache
+     * @param {string} key The key of the value to set.
+     * @param {*} value The value to set.
+     * @returns {Object} Returns the list cache instance.
+     */
+    function listCacheSet(key, value) {
+      var data = this.__data__,
+          index = assocIndexOf(data, key);
+
+      if (index < 0) {
+        ++this.size;
+        data.push([key, value]);
+      } else {
+        data[index][1] = value;
+      }
+      return this;
+    }
+
+    // Add methods to `ListCache`.
+    ListCache.prototype.clear = listCacheClear;
+    ListCache.prototype['delete'] = listCacheDelete;
+    ListCache.prototype.get = listCacheGet;
+    ListCache.prototype.has = listCacheHas;
+    ListCache.prototype.set = listCacheSet;
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Creates a map cache object to store key-value pairs.
+     *
+     * @private
+     * @constructor
+     * @param {Array} [entries] The key-value pairs to cache.
+     */
+    function MapCache(entries) {
+      var index = -1,
+          length = entries == null ? 0 : entries.length;
+
+      this.clear();
+      while (++index < length) {
+        var entry = entries[index];
+        this.set(entry[0], entry[1]);
+      }
+    }
+
+    /**
+     * Removes all key-value entries from the map.
+     *
+     * @private
+     * @name clear
+     * @memberOf MapCache
+     */
+    function mapCacheClear() {
+      this.size = 0;
+      this.__data__ = {
+        'hash': new Hash,
+        'map': new (Map || ListCache),
+        'string': new Hash
+      };
+    }
+
+    /**
+     * Removes `key` and its value from the map.
+     *
+     * @private
+     * @name delete
+     * @memberOf MapCache
+     * @param {string} key The key of the value to remove.
+     * @returns {boolean} Returns `true` if the entry was removed, else `false`.
+     */
+    function mapCacheDelete(key) {
+      var result = getMapData(this, key)['delete'](key);
+      this.size -= result ? 1 : 0;
+      return result;
+    }
+
+    /**
+     * Gets the map value for `key`.
+     *
+     * @private
+     * @name get
+     * @memberOf MapCache
+     * @param {string} key The key of the value to get.
+     * @returns {*} Returns the entry value.
+     */
+    function mapCacheGet(key) {
+      return getMapData(this, key).get(key);
+    }
+
+    /**
+     * Checks if a map value for `key` exists.
+     *
+     * @private
+     * @name has
+     * @memberOf MapCache
+     * @param {string} key The key of the entry to check.
+     * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
+     */
+    function mapCacheHas(key) {
+      return getMapData(this, key).has(key);
+    }
+
+    /**
+     * Sets the map `key` to `value`.
+     *
+     * @private
+     * @name set
+     * @memberOf MapCache
+     * @param {string} key The key of the value to set.
+     * @param {*} value The value to set.
+     * @returns {Object} Returns the map cache instance.
+     */
+    function mapCacheSet(key, value) {
+      var data = getMapData(this, key),
+          size = data.size;
+
+      data.set(key, value);
+      this.size += data.size == size ? 0 : 1;
+      return this;
+    }
+
+    // Add methods to `MapCache`.
+    MapCache.prototype.clear = mapCacheClear;
+    MapCache.prototype['delete'] = mapCacheDelete;
+    MapCache.prototype.get = mapCacheGet;
+    MapCache.prototype.has = mapCacheHas;
+    MapCache.prototype.set = mapCacheSet;
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     *
+     * Creates an array cache object to store unique values.
+     *
+     * @private
+     * @constructor
+     * @param {Array} [values] The values to cache.
+     */
+    function SetCache(values) {
+      var index = -1,
+          length = values == null ? 0 : values.length;
+
+      this.__data__ = new MapCache;
+      while (++index < length) {
+        this.add(values[index]);
+      }
+    }
+
+    /**
+     * Adds `value` to the array cache.
+     *
+     * @private
+     * @name add
+     * @memberOf SetCache
+     * @alias push
+     * @param {*} value The value to cache.
+     * @returns {Object} Returns the cache instance.
+     */
+    function setCacheAdd(value) {
+      this.__data__.set(value, HASH_UNDEFINED);
+      return this;
+    }
+
+    /**
+     * Checks if `value` is in the array cache.
+     *
+     * @private
+     * @name has
+     * @memberOf SetCache
+     * @param {*} value The value to search for.
+     * @returns {number} Returns `true` if `value` is found, else `false`.
+     */
+    function setCacheHas(value) {
+      return this.__data__.has(value);
+    }
+
+    // Add methods to `SetCache`.
+    SetCache.prototype.add = SetCache.prototype.push = setCacheAdd;
+    SetCache.prototype.has = setCacheHas;
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Creates a stack cache object to store key-value pairs.
+     *
+     * @private
+     * @constructor
+     * @param {Array} [entries] The key-value pairs to cache.
+     */
+    function Stack(entries) {
+      var data = this.__data__ = new ListCache(entries);
+      this.size = data.size;
+    }
+
+    /**
+     * Removes all key-value entries from the stack.
+     *
+     * @private
+     * @name clear
+     * @memberOf Stack
+     */
+    function stackClear() {
+      this.__data__ = new ListCache;
+      this.size = 0;
+    }
+
+    /**
+     * Removes `key` and its value from the stack.
+     *
+     * @private
+     * @name delete
+     * @memberOf Stack
+     * @param {string} key The key of the value to remove.
+     * @returns {boolean} Returns `true` if the entry was removed, else `false`.
+     */
+    function stackDelete(key) {
+      var data = this.__data__,
+          result = data['delete'](key);
+
+      this.size = data.size;
+      return result;
+    }
+
+    /**
+     * Gets the stack value for `key`.
+     *
+     * @private
+     * @name get
+     * @memberOf Stack
+     * @param {string} key The key of the value to get.
+     * @returns {*} Returns the entry value.
+     */
+    function stackGet(key) {
+      return this.__data__.get(key);
+    }
+
+    /**
+     * Checks if a stack value for `key` exists.
+     *
+     * @private
+     * @name has
+     * @memberOf Stack
+     * @param {string} key The key of the entry to check.
+     * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.
+     */
+    function stackHas(key) {
+      return this.__data__.has(key);
+    }
+
+    /**
+     * Sets the stack `key` to `value`.
+     *
+     * @private
+     * @name set
+     * @memberOf Stack
+     * @param {string} key The key of the value to set.
+     * @param {*} value The value to set.
+     * @returns {Object} Returns the stack cache instance.
+     */
+    function stackSet(key, value) {
+      var data = this.__data__;
+      if (data instanceof ListCache) {
+        var pairs = data.__data__;
+        if (!Map || (pairs.length < LARGE_ARRAY_SIZE - 1)) {
+          pairs.push([key, value]);
+          this.size = ++data.size;
+          return this;
+        }
+        data = this.__data__ = new MapCache(pairs);
+      }
+      data.set(key, value);
+      this.size = data.size;
+      return this;
+    }
+
+    // Add methods to `Stack`.
+    Stack.prototype.clear = stackClear;
+    Stack.prototype['delete'] = stackDelete;
+    Stack.prototype.get = stackGet;
+    Stack.prototype.has = stackHas;
+    Stack.prototype.set = stackSet;
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Creates an array of the enumerable property names of the array-like `value`.
+     *
+     * @private
+     * @param {*} value The value to query.
+     * @param {boolean} inherited Specify returning inherited property names.
+     * @returns {Array} Returns the array of property names.
+     */
+    function arrayLikeKeys(value, inherited) {
+      var isArr = isArray(value),
+          isArg = !isArr && isArguments(value),
+          isBuff = !isArr && !isArg && isBuffer(value),
+          isType = !isArr && !isArg && !isBuff && isTypedArray(value),
+          skipIndexes = isArr || isArg || isBuff || isType,
+          result = skipIndexes ? baseTimes(value.length, String) : [],
+          length = result.length;
+
+      for (var key in value) {
+        if ((inherited || hasOwnProperty.call(value, key)) &&
+            !(skipIndexes && (
+               // Safari 9 has enumerable `arguments.length` in strict mode.
+               key == 'length' ||
+               // Node.js 0.10 has enumerable non-index properties on buffers.
+               (isBuff && (key == 'offset' || key == 'parent')) ||
+               // PhantomJS 2 has enumerable non-index properties on typed arrays.
+               (isType && (key == 'buffer' || key == 'byteLength' || key == 'byteOffset')) ||
+               // Skip index properties.
+               isIndex(key, length)
+            ))) {
+          result.push(key);
+        }
+      }
+      return result;
+    }
+
+    /**
+     * A specialized version of `_.sample` for arrays.
+     *
+     * @private
+     * @param {Array} array The array to sample.
+     * @returns {*} Returns the random element.
+     */
+    function arraySample(array) {
+      var length = array.length;
+      return length ? array[baseRandom(0, length - 1)] : undefined;
+    }
+
+    /**
+     * A specialized version of `_.sampleSize` for arrays.
+     *
+     * @private
+     * @param {Array} array The array to sample.
+     * @param {number} n The number of elements to sample.
+     * @returns {Array} Returns the random elements.
+     */
+    function arraySampleSize(array, n) {
+      return shuffleSelf(copyArray(array), baseClamp(n, 0, array.length));
+    }
+
+    /**
+     * A specialized version of `_.shuffle` for arrays.
+     *
+     * @private
+     * @param {Array} array The array to shuffle.
+     * @returns {Array} Returns the new shuffled array.
+     */
+    function arrayShuffle(array) {
+      return shuffleSelf(copyArray(array));
+    }
+
+    /**
+     * This function is like `assignValue` except that it doesn't assign
+     * `undefined` values.
+     *
+     * @private
+     * @param {Object} object The object to modify.
+     * @param {string} key The key of the property to assign.
+     * @param {*} value The value to assign.
+     */
+    function assignMergeValue(object, key, value) {
+      if ((value !== undefined && !eq(object[key], value)) ||
+          (value === undefined && !(key in object))) {
+        baseAssignValue(object, key, value);
+      }
+    }
+
+    /**
+     * Assigns `value` to `key` of `object` if the existing value is not equivalent
+     * using [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+     * for equality comparisons.
+     *
+     * @private
+     * @param {Object} object The object to modify.
+     * @param {string} key The key of the property to assign.
+     * @param {*} value The value to assign.
+     */
+    function assignValue(object, key, value) {
+      var objValue = object[key];
+      if (!(hasOwnProperty.call(object, key) && eq(objValue, value)) ||
+          (value === undefined && !(key in object))) {
+        baseAssignValue(object, key, value);
+      }
+    }
+
+    /**
+     * Gets the index at which the `key` is found in `array` of key-value pairs.
+     *
+     * @private
+     * @param {Array} array The array to inspect.
+     * @param {*} key The key to search for.
+     * @returns {number} Returns the index of the matched value, else `-1`.
+     */
+    function assocIndexOf(array, key) {
+      var length = array.length;
+      while (length--) {
+        if (eq(array[length][0], key)) {
+          return length;
+        }
+      }
+      return -1;
+    }
+
+    /**
+     * Aggregates elements of `collection` on `accumulator` with keys transformed
+     * by `iteratee` and values set by `setter`.
+     *
+     * @private
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} setter The function to set `accumulator` values.
+     * @param {Function} iteratee The iteratee to transform keys.
+     * @param {Object} accumulator The initial aggregated object.
+     * @returns {Function} Returns `accumulator`.
+     */
+    function baseAggregator(collection, setter, iteratee, accumulator) {
+      baseEach(collection, function(value, key, collection) {
+        setter(accumulator, value, iteratee(value), collection);
+      });
+      return accumulator;
+    }
+
+    /**
+     * The base implementation of `_.assign` without support for multiple sources
+     * or `customizer` functions.
+     *
+     * @private
+     * @param {Object} object The destination object.
+     * @param {Object} source The source object.
+     * @returns {Object} Returns `object`.
+     */
+    function baseAssign(object, source) {
+      return object && copyObject(source, keys(source), object);
+    }
+
+    /**
+     * The base implementation of `_.assignIn` without support for multiple sources
+     * or `customizer` functions.
+     *
+     * @private
+     * @param {Object} object The destination object.
+     * @param {Object} source The source object.
+     * @returns {Object} Returns `object`.
+     */
+    function baseAssignIn(object, source) {
+      return object && copyObject(source, keysIn(source), object);
+    }
+
+    /**
+     * The base implementation of `assignValue` and `assignMergeValue` without
+     * value checks.
+     *
+     * @private
+     * @param {Object} object The object to modify.
+     * @param {string} key The key of the property to assign.
+     * @param {*} value The value to assign.
+     */
+    function baseAssignValue(object, key, value) {
+      if (key == '__proto__' && defineProperty) {
+        defineProperty(object, key, {
+          'configurable': true,
+          'enumerable': true,
+          'value': value,
+          'writable': true
+        });
+      } else {
+        object[key] = value;
+      }
+    }
+
+    /**
+     * The base implementation of `_.at` without support for individual paths.
+     *
+     * @private
+     * @param {Object} object The object to iterate over.
+     * @param {string[]} paths The property paths to pick.
+     * @returns {Array} Returns the picked elements.
+     */
+    function baseAt(object, paths) {
+      var index = -1,
+          length = paths.length,
+          result = Array(length),
+          skip = object == null;
+
+      while (++index < length) {
+        result[index] = skip ? undefined : get(object, paths[index]);
+      }
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.clamp` which doesn't coerce arguments.
+     *
+     * @private
+     * @param {number} number The number to clamp.
+     * @param {number} [lower] The lower bound.
+     * @param {number} upper The upper bound.
+     * @returns {number} Returns the clamped number.
+     */
+    function baseClamp(number, lower, upper) {
+      if (number === number) {
+        if (upper !== undefined) {
+          number = number <= upper ? number : upper;
+        }
+        if (lower !== undefined) {
+          number = number >= lower ? number : lower;
+        }
+      }
+      return number;
+    }
+
+    /**
+     * The base implementation of `_.clone` and `_.cloneDeep` which tracks
+     * traversed objects.
+     *
+     * @private
+     * @param {*} value The value to clone.
+     * @param {boolean} bitmask The bitmask flags.
+     *  1 - Deep clone
+     *  2 - Flatten inherited properties
+     *  4 - Clone symbols
+     * @param {Function} [customizer] The function to customize cloning.
+     * @param {string} [key] The key of `value`.
+     * @param {Object} [object] The parent object of `value`.
+     * @param {Object} [stack] Tracks traversed objects and their clone counterparts.
+     * @returns {*} Returns the cloned value.
+     */
+    function baseClone(value, bitmask, customizer, key, object, stack) {
+      var result,
+          isDeep = bitmask & CLONE_DEEP_FLAG,
+          isFlat = bitmask & CLONE_FLAT_FLAG,
+          isFull = bitmask & CLONE_SYMBOLS_FLAG;
+
+      if (customizer) {
+        result = object ? customizer(value, key, object, stack) : customizer(value);
+      }
+      if (result !== undefined) {
+        return result;
+      }
+      if (!isObject(value)) {
+        return value;
+      }
+      var isArr = isArray(value);
+      if (isArr) {
+        result = initCloneArray(value);
+        if (!isDeep) {
+          return copyArray(value, result);
+        }
+      } else {
+        var tag = getTag(value),
+            isFunc = tag == funcTag || tag == genTag;
+
+        if (isBuffer(value)) {
+          return cloneBuffer(value, isDeep);
+        }
+        if (tag == objectTag || tag == argsTag || (isFunc && !object)) {
+          result = (isFlat || isFunc) ? {} : initCloneObject(value);
+          if (!isDeep) {
+            return isFlat
+              ? copySymbolsIn(value, baseAssignIn(result, value))
+              : copySymbols(value, baseAssign(result, value));
+          }
+        } else {
+          if (!cloneableTags[tag]) {
+            return object ? value : {};
+          }
+          result = initCloneByTag(value, tag, isDeep);
+        }
+      }
+      // Check for circular references and return its corresponding clone.
+      stack || (stack = new Stack);
+      var stacked = stack.get(value);
+      if (stacked) {
+        return stacked;
+      }
+      stack.set(value, result);
+
+      if (isSet(value)) {
+        value.forEach(function(subValue) {
+          result.add(baseClone(subValue, bitmask, customizer, subValue, value, stack));
+        });
+      } else if (isMap(value)) {
+        value.forEach(function(subValue, key) {
+          result.set(key, baseClone(subValue, bitmask, customizer, key, value, stack));
+        });
+      }
+
+      var keysFunc = isFull
+        ? (isFlat ? getAllKeysIn : getAllKeys)
+        : (isFlat ? keysIn : keys);
+
+      var props = isArr ? undefined : keysFunc(value);
+      arrayEach(props || value, function(subValue, key) {
+        if (props) {
+          key = subValue;
+          subValue = value[key];
+        }
+        // Recursively populate clone (susceptible to call stack limits).
+        assignValue(result, key, baseClone(subValue, bitmask, customizer, key, value, stack));
+      });
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.conforms` which doesn't clone `source`.
+     *
+     * @private
+     * @param {Object} source The object of property predicates to conform to.
+     * @returns {Function} Returns the new spec function.
+     */
+    function baseConforms(source) {
+      var props = keys(source);
+      return function(object) {
+        return baseConformsTo(object, source, props);
+      };
+    }
+
+    /**
+     * The base implementation of `_.conformsTo` which accepts `props` to check.
+     *
+     * @private
+     * @param {Object} object The object to inspect.
+     * @param {Object} source The object of property predicates to conform to.
+     * @returns {boolean} Returns `true` if `object` conforms, else `false`.
+     */
+    function baseConformsTo(object, source, props) {
+      var length = props.length;
+      if (object == null) {
+        return !length;
+      }
+      object = Object(object);
+      while (length--) {
+        var key = props[length],
+            predicate = source[key],
+            value = object[key];
+
+        if ((value === undefined && !(key in object)) || !predicate(value)) {
+          return false;
+        }
+      }
+      return true;
+    }
+
+    /**
+     * The base implementation of `_.delay` and `_.defer` which accepts `args`
+     * to provide to `func`.
+     *
+     * @private
+     * @param {Function} func The function to delay.
+     * @param {number} wait The number of milliseconds to delay invocation.
+     * @param {Array} args The arguments to provide to `func`.
+     * @returns {number|Object} Returns the timer id or timeout object.
+     */
+    function baseDelay(func, wait, args) {
+      if (typeof func != 'function') {
+        throw new TypeError(FUNC_ERROR_TEXT);
+      }
+      return setTimeout(function() { func.apply(undefined, args); }, wait);
+    }
+
+    /**
+     * The base implementation of methods like `_.difference` without support
+     * for excluding multiple arrays or iteratee shorthands.
+     *
+     * @private
+     * @param {Array} array The array to inspect.
+     * @param {Array} values The values to exclude.
+     * @param {Function} [iteratee] The iteratee invoked per element.
+     * @param {Function} [comparator] The comparator invoked per element.
+     * @returns {Array} Returns the new array of filtered values.
+     */
+    function baseDifference(array, values, iteratee, comparator) {
+      var index = -1,
+          includes = arrayIncludes,
+          isCommon = true,
+          length = array.length,
+          result = [],
+          valuesLength = values.length;
+
+      if (!length) {
+        return result;
+      }
+      if (iteratee) {
+        values = arrayMap(values, baseUnary(iteratee));
+      }
+      if (comparator) {
+        includes = arrayIncludesWith;
+        isCommon = false;
+      }
+      else if (values.length >= LARGE_ARRAY_SIZE) {
+        includes = cacheHas;
+        isCommon = false;
+        values = new SetCache(values);
+      }
+      outer:
+      while (++index < length) {
+        var value = array[index],
+            computed = iteratee == null ? value : iteratee(value);
+
+        value = (comparator || value !== 0) ? value : 0;
+        if (isCommon && computed === computed) {
+          var valuesIndex = valuesLength;
+          while (valuesIndex--) {
+            if (values[valuesIndex] === computed) {
+              continue outer;
+            }
+          }
+          result.push(value);
+        }
+        else if (!includes(values, computed, comparator)) {
+          result.push(value);
+        }
+      }
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.forEach` without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} iteratee The function invoked per iteration.
+     * @returns {Array|Object} Returns `collection`.
+     */
+    var baseEach = createBaseEach(baseForOwn);
+
+    /**
+     * The base implementation of `_.forEachRight` without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} iteratee The function invoked per iteration.
+     * @returns {Array|Object} Returns `collection`.
+     */
+    var baseEachRight = createBaseEach(baseForOwnRight, true);
+
+    /**
+     * The base implementation of `_.every` without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} predicate The function invoked per iteration.
+     * @returns {boolean} Returns `true` if all elements pass the predicate check,
+     *  else `false`
+     */
+    function baseEvery(collection, predicate) {
+      var result = true;
+      baseEach(collection, function(value, index, collection) {
+        result = !!predicate(value, index, collection);
+        return result;
+      });
+      return result;
+    }
+
+    /**
+     * The base implementation of methods like `_.max` and `_.min` which accepts a
+     * `comparator` to determine the extremum value.
+     *
+     * @private
+     * @param {Array} array The array to iterate over.
+     * @param {Function} iteratee The iteratee invoked per iteration.
+     * @param {Function} comparator The comparator used to compare values.
+     * @returns {*} Returns the extremum value.
+     */
+    function baseExtremum(array, iteratee, comparator) {
+      var index = -1,
+          length = array.length;
+
+      while (++index < length) {
+        var value = array[index],
+            current = iteratee(value);
+
+        if (current != null && (computed === undefined
+              ? (current === current && !isSymbol(current))
+              : comparator(current, computed)
+            )) {
+          var computed = current,
+              result = value;
+        }
+      }
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.fill` without an iteratee call guard.
+     *
+     * @private
+     * @param {Array} array The array to fill.
+     * @param {*} value The value to fill `array` with.
+     * @param {number} [start=0] The start position.
+     * @param {number} [end=array.length] The end position.
+     * @returns {Array} Returns `array`.
+     */
+    function baseFill(array, value, start, end) {
+      var length = array.length;
+
+      start = toInteger(start);
+      if (start < 0) {
+        start = -start > length ? 0 : (length + start);
+      }
+      end = (end === undefined || end > length) ? length : toInteger(end);
+      if (end < 0) {
+        end += length;
+      }
+      end = start > end ? 0 : toLength(end);
+      while (start < end) {
+        array[start++] = value;
+      }
+      return array;
+    }
+
+    /**
+     * The base implementation of `_.filter` without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} predicate The function invoked per iteration.
+     * @returns {Array} Returns the new filtered array.
+     */
+    function baseFilter(collection, predicate) {
+      var result = [];
+      baseEach(collection, function(value, index, collection) {
+        if (predicate(value, index, collection)) {
+          result.push(value);
+        }
+      });
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.flatten` with support for restricting flattening.
+     *
+     * @private
+     * @param {Array} array The array to flatten.
+     * @param {number} depth The maximum recursion depth.
+     * @param {boolean} [predicate=isFlattenable] The function invoked per iteration.
+     * @param {boolean} [isStrict] Restrict to values that pass `predicate` checks.
+     * @param {Array} [result=[]] The initial result value.
+     * @returns {Array} Returns the new flattened array.
+     */
+    function baseFlatten(array, depth, predicate, isStrict, result) {
+      var index = -1,
+          length = array.length;
+
+      predicate || (predicate = isFlattenable);
+      result || (result = []);
+
+      while (++index < length) {
+        var value = array[index];
+        if (depth > 0 && predicate(value)) {
+          if (depth > 1) {
+            // Recursively flatten arrays (susceptible to call stack limits).
+            baseFlatten(value, depth - 1, predicate, isStrict, result);
+          } else {
+            arrayPush(result, value);
+          }
+        } else if (!isStrict) {
+          result[result.length] = value;
+        }
+      }
+      return result;
+    }
+
+    /**
+     * The base implementation of `baseForOwn` which iterates over `object`
+     * properties returned by `keysFunc` and invokes `iteratee` for each property.
+     * Iteratee functions may exit iteration early by explicitly returning `false`.
+     *
+     * @private
+     * @param {Object} object The object to iterate over.
+     * @param {Function} iteratee The function invoked per iteration.
+     * @param {Function} keysFunc The function to get the keys of `object`.
+     * @returns {Object} Returns `object`.
+     */
+    var baseFor = createBaseFor();
+
+    /**
+     * This function is like `baseFor` except that it iterates over properties
+     * in the opposite order.
+     *
+     * @private
+     * @param {Object} object The object to iterate over.
+     * @param {Function} iteratee The function invoked per iteration.
+     * @param {Function} keysFunc The function to get the keys of `object`.
+     * @returns {Object} Returns `object`.
+     */
+    var baseForRight = createBaseFor(true);
+
+    /**
+     * The base implementation of `_.forOwn` without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Object} object The object to iterate over.
+     * @param {Function} iteratee The function invoked per iteration.
+     * @returns {Object} Returns `object`.
+     */
+    function baseForOwn(object, iteratee) {
+      return object && baseFor(object, iteratee, keys);
+    }
+
+    /**
+     * The base implementation of `_.forOwnRight` without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Object} object The object to iterate over.
+     * @param {Function} iteratee The function invoked per iteration.
+     * @returns {Object} Returns `object`.
+     */
+    function baseForOwnRight(object, iteratee) {
+      return object && baseForRight(object, iteratee, keys);
+    }
+
+    /**
+     * The base implementation of `_.functions` which creates an array of
+     * `object` function property names filtered from `props`.
+     *
+     * @private
+     * @param {Object} object The object to inspect.
+     * @param {Array} props The property names to filter.
+     * @returns {Array} Returns the function names.
+     */
+    function baseFunctions(object, props) {
+      return arrayFilter(props, function(key) {
+        return isFunction(object[key]);
+      });
+    }
+
+    /**
+     * The base implementation of `_.get` without support for default values.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @param {Array|string} path The path of the property to get.
+     * @returns {*} Returns the resolved value.
+     */
+    function baseGet(object, path) {
+      path = castPath(path, object);
+
+      var index = 0,
+          length = path.length;
+
+      while (object != null && index < length) {
+        object = object[toKey(path[index++])];
+      }
+      return (index && index == length) ? object : undefined;
+    }
+
+    /**
+     * The base implementation of `getAllKeys` and `getAllKeysIn` which uses
+     * `keysFunc` and `symbolsFunc` to get the enumerable property names and
+     * symbols of `object`.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @param {Function} keysFunc The function to get the keys of `object`.
+     * @param {Function} symbolsFunc The function to get the symbols of `object`.
+     * @returns {Array} Returns the array of property names and symbols.
+     */
+    function baseGetAllKeys(object, keysFunc, symbolsFunc) {
+      var result = keysFunc(object);
+      return isArray(object) ? result : arrayPush(result, symbolsFunc(object));
+    }
+
+    /**
+     * The base implementation of `getTag` without fallbacks for buggy environments.
+     *
+     * @private
+     * @param {*} value The value to query.
+     * @returns {string} Returns the `toStringTag`.
+     */
+    function baseGetTag(value) {
+      if (value == null) {
+        return value === undefined ? undefinedTag : nullTag;
+      }
+      return (symToStringTag && symToStringTag in Object(value))
+        ? getRawTag(value)
+        : objectToString(value);
+    }
+
+    /**
+     * The base implementation of `_.gt` which doesn't coerce arguments.
+     *
+     * @private
+     * @param {*} value The value to compare.
+     * @param {*} other The other value to compare.
+     * @returns {boolean} Returns `true` if `value` is greater than `other`,
+     *  else `false`.
+     */
+    function baseGt(value, other) {
+      return value > other;
+    }
+
+    /**
+     * The base implementation of `_.has` without support for deep paths.
+     *
+     * @private
+     * @param {Object} [object] The object to query.
+     * @param {Array|string} key The key to check.
+     * @returns {boolean} Returns `true` if `key` exists, else `false`.
+     */
+    function baseHas(object, key) {
+      return object != null && hasOwnProperty.call(object, key);
+    }
+
+    /**
+     * The base implementation of `_.hasIn` without support for deep paths.
+     *
+     * @private
+     * @param {Object} [object] The object to query.
+     * @param {Array|string} key The key to check.
+     * @returns {boolean} Returns `true` if `key` exists, else `false`.
+     */
+    function baseHasIn(object, key) {
+      return object != null && key in Object(object);
+    }
+
+    /**
+     * The base implementation of `_.inRange` which doesn't coerce arguments.
+     *
+     * @private
+     * @param {number} number The number to check.
+     * @param {number} start The start of the range.
+     * @param {number} end The end of the range.
+     * @returns {boolean} Returns `true` if `number` is in the range, else `false`.
+     */
+    function baseInRange(number, start, end) {
+      return number >= nativeMin(start, end) && number < nativeMax(start, end);
+    }
+
+    /**
+     * The base implementation of methods like `_.intersection`, without support
+     * for iteratee shorthands, that accepts an array of arrays to inspect.
+     *
+     * @private
+     * @param {Array} arrays The arrays to inspect.
+     * @param {Function} [iteratee] The iteratee invoked per element.
+     * @param {Function} [comparator] The comparator invoked per element.
+     * @returns {Array} Returns the new array of shared values.
+     */
+    function baseIntersection(arrays, iteratee, comparator) {
+      var includes = comparator ? arrayIncludesWith : arrayIncludes,
+          length = arrays[0].length,
+          othLength = arrays.length,
+          othIndex = othLength,
+          caches = Array(othLength),
+          maxLength = Infinity,
+          result = [];
+
+      while (othIndex--) {
+        var array = arrays[othIndex];
+        if (othIndex && iteratee) {
+          array = arrayMap(array, baseUnary(iteratee));
+        }
+        maxLength = nativeMin(array.length, maxLength);
+        caches[othIndex] = !comparator && (iteratee || (length >= 120 && array.length >= 120))
+          ? new SetCache(othIndex && array)
+          : undefined;
+      }
+      array = arrays[0];
+
+      var index = -1,
+          seen = caches[0];
+
+      outer:
+      while (++index < length && result.length < maxLength) {
+        var value = array[index],
+            computed = iteratee ? iteratee(value) : value;
+
+        value = (comparator || value !== 0) ? value : 0;
+        if (!(seen
+              ? cacheHas(seen, computed)
+              : includes(result, computed, comparator)
+            )) {
+          othIndex = othLength;
+          while (--othIndex) {
+            var cache = caches[othIndex];
+            if (!(cache
+                  ? cacheHas(cache, computed)
+                  : includes(arrays[othIndex], computed, comparator))
+                ) {
+              continue outer;
+            }
+          }
+          if (seen) {
+            seen.push(computed);
+          }
+          result.push(value);
+        }
+      }
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.invert` and `_.invertBy` which inverts
+     * `object` with values transformed by `iteratee` and set by `setter`.
+     *
+     * @private
+     * @param {Object} object The object to iterate over.
+     * @param {Function} setter The function to set `accumulator` values.
+     * @param {Function} iteratee The iteratee to transform values.
+     * @param {Object} accumulator The initial inverted object.
+     * @returns {Function} Returns `accumulator`.
+     */
+    function baseInverter(object, setter, iteratee, accumulator) {
+      baseForOwn(object, function(value, key, object) {
+        setter(accumulator, iteratee(value), key, object);
+      });
+      return accumulator;
+    }
+
+    /**
+     * The base implementation of `_.invoke` without support for individual
+     * method arguments.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @param {Array|string} path The path of the method to invoke.
+     * @param {Array} args The arguments to invoke the method with.
+     * @returns {*} Returns the result of the invoked method.
+     */
+    function baseInvoke(object, path, args) {
+      path = castPath(path, object);
+      object = parent(object, path);
+      var func = object == null ? object : object[toKey(last(path))];
+      return func == null ? undefined : apply(func, object, args);
+    }
+
+    /**
+     * The base implementation of `_.isArguments`.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is an `arguments` object,
+     */
+    function baseIsArguments(value) {
+      return isObjectLike(value) && baseGetTag(value) == argsTag;
+    }
+
+    /**
+     * The base implementation of `_.isArrayBuffer` without Node.js optimizations.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is an array buffer, else `false`.
+     */
+    function baseIsArrayBuffer(value) {
+      return isObjectLike(value) && baseGetTag(value) == arrayBufferTag;
+    }
+
+    /**
+     * The base implementation of `_.isDate` without Node.js optimizations.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a date object, else `false`.
+     */
+    function baseIsDate(value) {
+      return isObjectLike(value) && baseGetTag(value) == dateTag;
+    }
+
+    /**
+     * The base implementation of `_.isEqual` which supports partial comparisons
+     * and tracks traversed objects.
+     *
+     * @private
+     * @param {*} value The value to compare.
+     * @param {*} other The other value to compare.
+     * @param {boolean} bitmask The bitmask flags.
+     *  1 - Unordered comparison
+     *  2 - Partial comparison
+     * @param {Function} [customizer] The function to customize comparisons.
+     * @param {Object} [stack] Tracks traversed `value` and `other` objects.
+     * @returns {boolean} Returns `true` if the values are equivalent, else `false`.
+     */
+    function baseIsEqual(value, other, bitmask, customizer, stack) {
+      if (value === other) {
+        return true;
+      }
+      if (value == null || other == null || (!isObjectLike(value) && !isObjectLike(other))) {
+        return value !== value && other !== other;
+      }
+      return baseIsEqualDeep(value, other, bitmask, customizer, baseIsEqual, stack);
+    }
+
+    /**
+     * A specialized version of `baseIsEqual` for arrays and objects which performs
+     * deep comparisons and tracks traversed objects enabling objects with circular
+     * references to be compared.
+     *
+     * @private
+     * @param {Object} object The object to compare.
+     * @param {Object} other The other object to compare.
+     * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
+     * @param {Function} customizer The function to customize comparisons.
+     * @param {Function} equalFunc The function to determine equivalents of values.
+     * @param {Object} [stack] Tracks traversed `object` and `other` objects.
+     * @returns {boolean} Returns `true` if the objects are equivalent, else `false`.
+     */
+    function baseIsEqualDeep(object, other, bitmask, customizer, equalFunc, stack) {
+      var objIsArr = isArray(object),
+          othIsArr = isArray(other),
+          objTag = objIsArr ? arrayTag : getTag(object),
+          othTag = othIsArr ? arrayTag : getTag(other);
+
+      objTag = objTag == argsTag ? objectTag : objTag;
+      othTag = othTag == argsTag ? objectTag : othTag;
+
+      var objIsObj = objTag == objectTag,
+          othIsObj = othTag == objectTag,
+          isSameTag = objTag == othTag;
+
+      if (isSameTag && isBuffer(object)) {
+        if (!isBuffer(other)) {
+          return false;
+        }
+        objIsArr = true;
+        objIsObj = false;
+      }
+      if (isSameTag && !objIsObj) {
+        stack || (stack = new Stack);
+        return (objIsArr || isTypedArray(object))
+          ? equalArrays(object, other, bitmask, customizer, equalFunc, stack)
+          : equalByTag(object, other, objTag, bitmask, customizer, equalFunc, stack);
+      }
+      if (!(bitmask & COMPARE_PARTIAL_FLAG)) {
+        var objIsWrapped = objIsObj && hasOwnProperty.call(object, '__wrapped__'),
+            othIsWrapped = othIsObj && hasOwnProperty.call(other, '__wrapped__');
+
+        if (objIsWrapped || othIsWrapped) {
+          var objUnwrapped = objIsWrapped ? object.value() : object,
+              othUnwrapped = othIsWrapped ? other.value() : other;
+
+          stack || (stack = new Stack);
+          return equalFunc(objUnwrapped, othUnwrapped, bitmask, customizer, stack);
+        }
+      }
+      if (!isSameTag) {
+        return false;
+      }
+      stack || (stack = new Stack);
+      return equalObjects(object, other, bitmask, customizer, equalFunc, stack);
+    }
+
+    /**
+     * The base implementation of `_.isMap` without Node.js optimizations.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a map, else `false`.
+     */
+    function baseIsMap(value) {
+      return isObjectLike(value) && getTag(value) == mapTag;
+    }
+
+    /**
+     * The base implementation of `_.isMatch` without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Object} object The object to inspect.
+     * @param {Object} source The object of property values to match.
+     * @param {Array} matchData The property names, values, and compare flags to match.
+     * @param {Function} [customizer] The function to customize comparisons.
+     * @returns {boolean} Returns `true` if `object` is a match, else `false`.
+     */
+    function baseIsMatch(object, source, matchData, customizer) {
+      var index = matchData.length,
+          length = index,
+          noCustomizer = !customizer;
+
+      if (object == null) {
+        return !length;
+      }
+      object = Object(object);
+      while (index--) {
+        var data = matchData[index];
+        if ((noCustomizer && data[2])
+              ? data[1] !== object[data[0]]
+              : !(data[0] in object)
+            ) {
+          return false;
+        }
+      }
+      while (++index < length) {
+        data = matchData[index];
+        var key = data[0],
+            objValue = object[key],
+            srcValue = data[1];
+
+        if (noCustomizer && data[2]) {
+          if (objValue === undefined && !(key in object)) {
+            return false;
+          }
+        } else {
+          var stack = new Stack;
+          if (customizer) {
+            var result = customizer(objValue, srcValue, key, object, source, stack);
+          }
+          if (!(result === undefined
+                ? baseIsEqual(srcValue, objValue, COMPARE_PARTIAL_FLAG | COMPARE_UNORDERED_FLAG, customizer, stack)
+                : result
+              )) {
+            return false;
+          }
+        }
+      }
+      return true;
+    }
+
+    /**
+     * The base implementation of `_.isNative` without bad shim checks.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a native function,
+     *  else `false`.
+     */
+    function baseIsNative(value) {
+      if (!isObject(value) || isMasked(value)) {
+        return false;
+      }
+      var pattern = isFunction(value) ? reIsNative : reIsHostCtor;
+      return pattern.test(toSource(value));
+    }
+
+    /**
+     * The base implementation of `_.isRegExp` without Node.js optimizations.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a regexp, else `false`.
+     */
+    function baseIsRegExp(value) {
+      return isObjectLike(value) && baseGetTag(value) == regexpTag;
+    }
+
+    /**
+     * The base implementation of `_.isSet` without Node.js optimizations.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a set, else `false`.
+     */
+    function baseIsSet(value) {
+      return isObjectLike(value) && getTag(value) == setTag;
+    }
+
+    /**
+     * The base implementation of `_.isTypedArray` without Node.js optimizations.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.
+     */
+    function baseIsTypedArray(value) {
+      return isObjectLike(value) &&
+        isLength(value.length) && !!typedArrayTags[baseGetTag(value)];
+    }
+
+    /**
+     * The base implementation of `_.iteratee`.
+     *
+     * @private
+     * @param {*} [value=_.identity] The value to convert to an iteratee.
+     * @returns {Function} Returns the iteratee.
+     */
+    function baseIteratee(value) {
+      // Don't store the `typeof` result in a variable to avoid a JIT bug in Safari 9.
+      // See https://bugs.webkit.org/show_bug.cgi?id=156034 for more details.
+      if (typeof value == 'function') {
+        return value;
+      }
+      if (value == null) {
+        return identity;
+      }
+      if (typeof value == 'object') {
+        return isArray(value)
+          ? baseMatchesProperty(value[0], value[1])
+          : baseMatches(value);
+      }
+      return property(value);
+    }
+
+    /**
+     * The base implementation of `_.keys` which doesn't treat sparse arrays as dense.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the array of property names.
+     */
+    function baseKeys(object) {
+      if (!isPrototype(object)) {
+        return nativeKeys(object);
+      }
+      var result = [];
+      for (var key in Object(object)) {
+        if (hasOwnProperty.call(object, key) && key != 'constructor') {
+          result.push(key);
+        }
+      }
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.keysIn` which doesn't treat sparse arrays as dense.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the array of property names.
+     */
+    function baseKeysIn(object) {
+      if (!isObject(object)) {
+        return nativeKeysIn(object);
+      }
+      var isProto = isPrototype(object),
+          result = [];
+
+      for (var key in object) {
+        if (!(key == 'constructor' && (isProto || !hasOwnProperty.call(object, key)))) {
+          result.push(key);
+        }
+      }
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.lt` which doesn't coerce arguments.
+     *
+     * @private
+     * @param {*} value The value to compare.
+     * @param {*} other The other value to compare.
+     * @returns {boolean} Returns `true` if `value` is less than `other`,
+     *  else `false`.
+     */
+    function baseLt(value, other) {
+      return value < other;
+    }
+
+    /**
+     * The base implementation of `_.map` without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} iteratee The function invoked per iteration.
+     * @returns {Array} Returns the new mapped array.
+     */
+    function baseMap(collection, iteratee) {
+      var index = -1,
+          result = isArrayLike(collection) ? Array(collection.length) : [];
+
+      baseEach(collection, function(value, key, collection) {
+        result[++index] = iteratee(value, key, collection);
+      });
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.matches` which doesn't clone `source`.
+     *
+     * @private
+     * @param {Object} source The object of property values to match.
+     * @returns {Function} Returns the new spec function.
+     */
+    function baseMatches(source) {
+      var matchData = getMatchData(source);
+      if (matchData.length == 1 && matchData[0][2]) {
+        return matchesStrictComparable(matchData[0][0], matchData[0][1]);
+      }
+      return function(object) {
+        return object === source || baseIsMatch(object, source, matchData);
+      };
+    }
+
+    /**
+     * The base implementation of `_.matchesProperty` which doesn't clone `srcValue`.
+     *
+     * @private
+     * @param {string} path The path of the property to get.
+     * @param {*} srcValue The value to match.
+     * @returns {Function} Returns the new spec function.
+     */
+    function baseMatchesProperty(path, srcValue) {
+      if (isKey(path) && isStrictComparable(srcValue)) {
+        return matchesStrictComparable(toKey(path), srcValue);
+      }
+      return function(object) {
+        var objValue = get(object, path);
+        return (objValue === undefined && objValue === srcValue)
+          ? hasIn(object, path)
+          : baseIsEqual(srcValue, objValue, COMPARE_PARTIAL_FLAG | COMPARE_UNORDERED_FLAG);
+      };
+    }
+
+    /**
+     * The base implementation of `_.merge` without support for multiple sources.
+     *
+     * @private
+     * @param {Object} object The destination object.
+     * @param {Object} source The source object.
+     * @param {number} srcIndex The index of `source`.
+     * @param {Function} [customizer] The function to customize merged values.
+     * @param {Object} [stack] Tracks traversed source values and their merged
+     *  counterparts.
+     */
+    function baseMerge(object, source, srcIndex, customizer, stack) {
+      if (object === source) {
+        return;
+      }
+      baseFor(source, function(srcValue, key) {
+        stack || (stack = new Stack);
+        if (isObject(srcValue)) {
+          baseMergeDeep(object, source, key, srcIndex, baseMerge, customizer, stack);
+        }
+        else {
+          var newValue = customizer
+            ? customizer(safeGet(object, key), srcValue, (key + ''), object, source, stack)
+            : undefined;
+
+          if (newValue === undefined) {
+            newValue = srcValue;
+          }
+          assignMergeValue(object, key, newValue);
+        }
+      }, keysIn);
+    }
+
+    /**
+     * A specialized version of `baseMerge` for arrays and objects which performs
+     * deep merges and tracks traversed objects enabling objects with circular
+     * references to be merged.
+     *
+     * @private
+     * @param {Object} object The destination object.
+     * @param {Object} source The source object.
+     * @param {string} key The key of the value to merge.
+     * @param {number} srcIndex The index of `source`.
+     * @param {Function} mergeFunc The function to merge values.
+     * @param {Function} [customizer] The function to customize assigned values.
+     * @param {Object} [stack] Tracks traversed source values and their merged
+     *  counterparts.
+     */
+    function baseMergeDeep(object, source, key, srcIndex, mergeFunc, customizer, stack) {
+      var objValue = safeGet(object, key),
+          srcValue = safeGet(source, key),
+          stacked = stack.get(srcValue);
+
+      if (stacked) {
+        assignMergeValue(object, key, stacked);
+        return;
+      }
+      var newValue = customizer
+        ? customizer(objValue, srcValue, (key + ''), object, source, stack)
+        : undefined;
+
+      var isCommon = newValue === undefined;
+
+      if (isCommon) {
+        var isArr = isArray(srcValue),
+            isBuff = !isArr && isBuffer(srcValue),
+            isTyped = !isArr && !isBuff && isTypedArray(srcValue);
+
+        newValue = srcValue;
+        if (isArr || isBuff || isTyped) {
+          if (isArray(objValue)) {
+            newValue = objValue;
+          }
+          else if (isArrayLikeObject(objValue)) {
+            newValue = copyArray(objValue);
+          }
+          else if (isBuff) {
+            isCommon = false;
+            newValue = cloneBuffer(srcValue, true);
+          }
+          else if (isTyped) {
+            isCommon = false;
+            newValue = cloneTypedArray(srcValue, true);
+          }
+          else {
+            newValue = [];
+          }
+        }
+        else if (isPlainObject(srcValue) || isArguments(srcValue)) {
+          newValue = objValue;
+          if (isArguments(objValue)) {
+            newValue = toPlainObject(objValue);
+          }
+          else if (!isObject(objValue) || isFunction(objValue)) {
+            newValue = initCloneObject(srcValue);
+          }
+        }
+        else {
+          isCommon = false;
+        }
+      }
+      if (isCommon) {
+        // Recursively merge objects and arrays (susceptible to call stack limits).
+        stack.set(srcValue, newValue);
+        mergeFunc(newValue, srcValue, srcIndex, customizer, stack);
+        stack['delete'](srcValue);
+      }
+      assignMergeValue(object, key, newValue);
+    }
+
+    /**
+     * The base implementation of `_.nth` which doesn't coerce arguments.
+     *
+     * @private
+     * @param {Array} array The array to query.
+     * @param {number} n The index of the element to return.
+     * @returns {*} Returns the nth element of `array`.
+     */
+    function baseNth(array, n) {
+      var length = array.length;
+      if (!length) {
+        return;
+      }
+      n += n < 0 ? length : 0;
+      return isIndex(n, length) ? array[n] : undefined;
+    }
+
+    /**
+     * The base implementation of `_.orderBy` without param guards.
+     *
+     * @private
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function[]|Object[]|string[]} iteratees The iteratees to sort by.
+     * @param {string[]} orders The sort orders of `iteratees`.
+     * @returns {Array} Returns the new sorted array.
+     */
+    function baseOrderBy(collection, iteratees, orders) {
+      if (iteratees.length) {
+        iteratees = arrayMap(iteratees, function(iteratee) {
+          if (isArray(iteratee)) {
+            return function(value) {
+              return baseGet(value, iteratee.length === 1 ? iteratee[0] : iteratee);
+            }
+          }
+          return iteratee;
+        });
+      } else {
+        iteratees = [identity];
+      }
+
+      var index = -1;
+      iteratees = arrayMap(iteratees, baseUnary(getIteratee()));
+
+      var result = baseMap(collection, function(value, key, collection) {
+        var criteria = arrayMap(iteratees, function(iteratee) {
+          return iteratee(value);
+        });
+        return { 'criteria': criteria, 'index': ++index, 'value': value };
+      });
+
+      return baseSortBy(result, function(object, other) {
+        return compareMultiple(object, other, orders);
+      });
+    }
+
+    /**
+     * The base implementation of `_.pick` without support for individual
+     * property identifiers.
+     *
+     * @private
+     * @param {Object} object The source object.
+     * @param {string[]} paths The property paths to pick.
+     * @returns {Object} Returns the new object.
+     */
+    function basePick(object, paths) {
+      return basePickBy(object, paths, function(value, path) {
+        return hasIn(object, path);
+      });
+    }
+
+    /**
+     * The base implementation of  `_.pickBy` without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Object} object The source object.
+     * @param {string[]} paths The property paths to pick.
+     * @param {Function} predicate The function invoked per property.
+     * @returns {Object} Returns the new object.
+     */
+    function basePickBy(object, paths, predicate) {
+      var index = -1,
+          length = paths.length,
+          result = {};
+
+      while (++index < length) {
+        var path = paths[index],
+            value = baseGet(object, path);
+
+        if (predicate(value, path)) {
+          baseSet(result, castPath(path, object), value);
+        }
+      }
+      return result;
+    }
+
+    /**
+     * A specialized version of `baseProperty` which supports deep paths.
+     *
+     * @private
+     * @param {Array|string} path The path of the property to get.
+     * @returns {Function} Returns the new accessor function.
+     */
+    function basePropertyDeep(path) {
+      return function(object) {
+        return baseGet(object, path);
+      };
+    }
+
+    /**
+     * The base implementation of `_.pullAllBy` without support for iteratee
+     * shorthands.
+     *
+     * @private
+     * @param {Array} array The array to modify.
+     * @param {Array} values The values to remove.
+     * @param {Function} [iteratee] The iteratee invoked per element.
+     * @param {Function} [comparator] The comparator invoked per element.
+     * @returns {Array} Returns `array`.
+     */
+    function basePullAll(array, values, iteratee, comparator) {
+      var indexOf = comparator ? baseIndexOfWith : baseIndexOf,
+          index = -1,
+          length = values.length,
+          seen = array;
+
+      if (array === values) {
+        values = copyArray(values);
+      }
+      if (iteratee) {
+        seen = arrayMap(array, baseUnary(iteratee));
+      }
+      while (++index < length) {
+        var fromIndex = 0,
+            value = values[index],
+            computed = iteratee ? iteratee(value) : value;
+
+        while ((fromIndex = indexOf(seen, computed, fromIndex, comparator)) > -1) {
+          if (seen !== array) {
+            splice.call(seen, fromIndex, 1);
+          }
+          splice.call(array, fromIndex, 1);
+        }
+      }
+      return array;
+    }
+
+    /**
+     * The base implementation of `_.pullAt` without support for individual
+     * indexes or capturing the removed elements.
+     *
+     * @private
+     * @param {Array} array The array to modify.
+     * @param {number[]} indexes The indexes of elements to remove.
+     * @returns {Array} Returns `array`.
+     */
+    function basePullAt(array, indexes) {
+      var length = array ? indexes.length : 0,
+          lastIndex = length - 1;
+
+      while (length--) {
+        var index = indexes[length];
+        if (length == lastIndex || index !== previous) {
+          var previous = index;
+          if (isIndex(index)) {
+            splice.call(array, index, 1);
+          } else {
+            baseUnset(array, index);
+          }
+        }
+      }
+      return array;
+    }
+
+    /**
+     * The base implementation of `_.random` without support for returning
+     * floating-point numbers.
+     *
+     * @private
+     * @param {number} lower The lower bound.
+     * @param {number} upper The upper bound.
+     * @returns {number} Returns the random number.
+     */
+    function baseRandom(lower, upper) {
+      return lower + nativeFloor(nativeRandom() * (upper - lower + 1));
+    }
+
+    /**
+     * The base implementation of `_.range` and `_.rangeRight` which doesn't
+     * coerce arguments.
+     *
+     * @private
+     * @param {number} start The start of the range.
+     * @param {number} end The end of the range.
+     * @param {number} step The value to increment or decrement by.
+     * @param {boolean} [fromRight] Specify iterating from right to left.
+     * @returns {Array} Returns the range of numbers.
+     */
+    function baseRange(start, end, step, fromRight) {
+      var index = -1,
+          length = nativeMax(nativeCeil((end - start) / (step || 1)), 0),
+          result = Array(length);
+
+      while (length--) {
+        result[fromRight ? length : ++index] = start;
+        start += step;
+      }
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.repeat` which doesn't coerce arguments.
+     *
+     * @private
+     * @param {string} string The string to repeat.
+     * @param {number} n The number of times to repeat the string.
+     * @returns {string} Returns the repeated string.
+     */
+    function baseRepeat(string, n) {
+      var result = '';
+      if (!string || n < 1 || n > MAX_SAFE_INTEGER) {
+        return result;
+      }
+      // Leverage the exponentiation by squaring algorithm for a faster repeat.
+      // See https://en.wikipedia.org/wiki/Exponentiation_by_squaring for more details.
+      do {
+        if (n % 2) {
+          result += string;
+        }
+        n = nativeFloor(n / 2);
+        if (n) {
+          string += string;
+        }
+      } while (n);
+
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.rest` which doesn't validate or coerce arguments.
+     *
+     * @private
+     * @param {Function} func The function to apply a rest parameter to.
+     * @param {number} [start=func.length-1] The start position of the rest parameter.
+     * @returns {Function} Returns the new function.
+     */
+    function baseRest(func, start) {
+      return setToString(overRest(func, start, identity), func + '');
+    }
+
+    /**
+     * The base implementation of `_.sample`.
+     *
+     * @private
+     * @param {Array|Object} collection The collection to sample.
+     * @returns {*} Returns the random element.
+     */
+    function baseSample(collection) {
+      return arraySample(values(collection));
+    }
+
+    /**
+     * The base implementation of `_.sampleSize` without param guards.
+     *
+     * @private
+     * @param {Array|Object} collection The collection to sample.
+     * @param {number} n The number of elements to sample.
+     * @returns {Array} Returns the random elements.
+     */
+    function baseSampleSize(collection, n) {
+      var array = values(collection);
+      return shuffleSelf(array, baseClamp(n, 0, array.length));
+    }
+
+    /**
+     * The base implementation of `_.set`.
+     *
+     * @private
+     * @param {Object} object The object to modify.
+     * @param {Array|string} path The path of the property to set.
+     * @param {*} value The value to set.
+     * @param {Function} [customizer] The function to customize path creation.
+     * @returns {Object} Returns `object`.
+     */
+    function baseSet(object, path, value, customizer) {
+      if (!isObject(object)) {
+        return object;
+      }
+      path = castPath(path, object);
+
+      var index = -1,
+          length = path.length,
+          lastIndex = length - 1,
+          nested = object;
+
+      while (nested != null && ++index < length) {
+        var key = toKey(path[index]),
+            newValue = value;
+
+        if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
+          return object;
+        }
+
+        if (index != lastIndex) {
+          var objValue = nested[key];
+          newValue = customizer ? customizer(objValue, key, nested) : undefined;
+          if (newValue === undefined) {
+            newValue = isObject(objValue)
+              ? objValue
+              : (isIndex(path[index + 1]) ? [] : {});
+          }
+        }
+        assignValue(nested, key, newValue);
+        nested = nested[key];
+      }
+      return object;
+    }
+
+    /**
+     * The base implementation of `setData` without support for hot loop shorting.
+     *
+     * @private
+     * @param {Function} func The function to associate metadata with.
+     * @param {*} data The metadata.
+     * @returns {Function} Returns `func`.
+     */
+    var baseSetData = !metaMap ? identity : function(func, data) {
+      metaMap.set(func, data);
+      return func;
+    };
+
+    /**
+     * The base implementation of `setToString` without support for hot loop shorting.
+     *
+     * @private
+     * @param {Function} func The function to modify.
+     * @param {Function} string The `toString` result.
+     * @returns {Function} Returns `func`.
+     */
+    var baseSetToString = !defineProperty ? identity : function(func, string) {
+      return defineProperty(func, 'toString', {
+        'configurable': true,
+        'enumerable': false,
+        'value': constant(string),
+        'writable': true
+      });
+    };
+
+    /**
+     * The base implementation of `_.shuffle`.
+     *
+     * @private
+     * @param {Array|Object} collection The collection to shuffle.
+     * @returns {Array} Returns the new shuffled array.
+     */
+    function baseShuffle(collection) {
+      return shuffleSelf(values(collection));
+    }
+
+    /**
+     * The base implementation of `_.slice` without an iteratee call guard.
+     *
+     * @private
+     * @param {Array} array The array to slice.
+     * @param {number} [start=0] The start position.
+     * @param {number} [end=array.length] The end position.
+     * @returns {Array} Returns the slice of `array`.
+     */
+    function baseSlice(array, start, end) {
+      var index = -1,
+          length = array.length;
+
+      if (start < 0) {
+        start = -start > length ? 0 : (length + start);
+      }
+      end = end > length ? length : end;
+      if (end < 0) {
+        end += length;
+      }
+      length = start > end ? 0 : ((end - start) >>> 0);
+      start >>>= 0;
+
+      var result = Array(length);
+      while (++index < length) {
+        result[index] = array[index + start];
+      }
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.some` without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} predicate The function invoked per iteration.
+     * @returns {boolean} Returns `true` if any element passes the predicate check,
+     *  else `false`.
+     */
+    function baseSome(collection, predicate) {
+      var result;
+
+      baseEach(collection, function(value, index, collection) {
+        result = predicate(value, index, collection);
+        return !result;
+      });
+      return !!result;
+    }
+
+    /**
+     * The base implementation of `_.sortedIndex` and `_.sortedLastIndex` which
+     * performs a binary search of `array` to determine the index at which `value`
+     * should be inserted into `array` in order to maintain its sort order.
+     *
+     * @private
+     * @param {Array} array The sorted array to inspect.
+     * @param {*} value The value to evaluate.
+     * @param {boolean} [retHighest] Specify returning the highest qualified index.
+     * @returns {number} Returns the index at which `value` should be inserted
+     *  into `array`.
+     */
+    function baseSortedIndex(array, value, retHighest) {
+      var low = 0,
+          high = array == null ? low : array.length;
+
+      if (typeof value == 'number' && value === value && high <= HALF_MAX_ARRAY_LENGTH) {
+        while (low < high) {
+          var mid = (low + high) >>> 1,
+              computed = array[mid];
+
+          if (computed !== null && !isSymbol(computed) &&
+              (retHighest ? (computed <= value) : (computed < value))) {
+            low = mid + 1;
+          } else {
+            high = mid;
+          }
+        }
+        return high;
+      }
+      return baseSortedIndexBy(array, value, identity, retHighest);
+    }
+
+    /**
+     * The base implementation of `_.sortedIndexBy` and `_.sortedLastIndexBy`
+     * which invokes `iteratee` for `value` and each element of `array` to compute
+     * their sort ranking. The iteratee is invoked with one argument; (value).
+     *
+     * @private
+     * @param {Array} array The sorted array to inspect.
+     * @param {*} value The value to evaluate.
+     * @param {Function} iteratee The iteratee invoked per element.
+     * @param {boolean} [retHighest] Specify returning the highest qualified index.
+     * @returns {number} Returns the index at which `value` should be inserted
+     *  into `array`.
+     */
+    function baseSortedIndexBy(array, value, iteratee, retHighest) {
+      var low = 0,
+          high = array == null ? 0 : array.length;
+      if (high === 0) {
+        return 0;
+      }
+
+      value = iteratee(value);
+      var valIsNaN = value !== value,
+          valIsNull = value === null,
+          valIsSymbol = isSymbol(value),
+          valIsUndefined = value === undefined;
+
+      while (low < high) {
+        var mid = nativeFloor((low + high) / 2),
+            computed = iteratee(array[mid]),
+            othIsDefined = computed !== undefined,
+            othIsNull = computed === null,
+            othIsReflexive = computed === computed,
+            othIsSymbol = isSymbol(computed);
+
+        if (valIsNaN) {
+          var setLow = retHighest || othIsReflexive;
+        } else if (valIsUndefined) {
+          setLow = othIsReflexive && (retHighest || othIsDefined);
+        } else if (valIsNull) {
+          setLow = othIsReflexive && othIsDefined && (retHighest || !othIsNull);
+        } else if (valIsSymbol) {
+          setLow = othIsReflexive && othIsDefined && !othIsNull && (retHighest || !othIsSymbol);
+        } else if (othIsNull || othIsSymbol) {
+          setLow = false;
+        } else {
+          setLow = retHighest ? (computed <= value) : (computed < value);
+        }
+        if (setLow) {
+          low = mid + 1;
+        } else {
+          high = mid;
+        }
+      }
+      return nativeMin(high, MAX_ARRAY_INDEX);
+    }
+
+    /**
+     * The base implementation of `_.sortedUniq` and `_.sortedUniqBy` without
+     * support for iteratee shorthands.
+     *
+     * @private
+     * @param {Array} array The array to inspect.
+     * @param {Function} [iteratee] The iteratee invoked per element.
+     * @returns {Array} Returns the new duplicate free array.
+     */
+    function baseSortedUniq(array, iteratee) {
+      var index = -1,
+          length = array.length,
+          resIndex = 0,
+          result = [];
+
+      while (++index < length) {
+        var value = array[index],
+            computed = iteratee ? iteratee(value) : value;
+
+        if (!index || !eq(computed, seen)) {
+          var seen = computed;
+          result[resIndex++] = value === 0 ? 0 : value;
+        }
+      }
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.toNumber` which doesn't ensure correct
+     * conversions of binary, hexadecimal, or octal string values.
+     *
+     * @private
+     * @param {*} value The value to process.
+     * @returns {number} Returns the number.
+     */
+    function baseToNumber(value) {
+      if (typeof value == 'number') {
+        return value;
+      }
+      if (isSymbol(value)) {
+        return NAN;
+      }
+      return +value;
+    }
+
+    /**
+     * The base implementation of `_.toString` which doesn't convert nullish
+     * values to empty strings.
+     *
+     * @private
+     * @param {*} value The value to process.
+     * @returns {string} Returns the string.
+     */
+    function baseToString(value) {
+      // Exit early for strings to avoid a performance hit in some environments.
+      if (typeof value == 'string') {
+        return value;
+      }
+      if (isArray(value)) {
+        // Recursively convert values (susceptible to call stack limits).
+        return arrayMap(value, baseToString) + '';
+      }
+      if (isSymbol(value)) {
+        return symbolToString ? symbolToString.call(value) : '';
+      }
+      var result = (value + '');
+      return (result == '0' && (1 / value) == -INFINITY) ? '-0' : result;
+    }
+
+    /**
+     * The base implementation of `_.uniqBy` without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Array} array The array to inspect.
+     * @param {Function} [iteratee] The iteratee invoked per element.
+     * @param {Function} [comparator] The comparator invoked per element.
+     * @returns {Array} Returns the new duplicate free array.
+     */
+    function baseUniq(array, iteratee, comparator) {
+      var index = -1,
+          includes = arrayIncludes,
+          length = array.length,
+          isCommon = true,
+          result = [],
+          seen = result;
+
+      if (comparator) {
+        isCommon = false;
+        includes = arrayIncludesWith;
+      }
+      else if (length >= LARGE_ARRAY_SIZE) {
+        var set = iteratee ? null : createSet(array);
+        if (set) {
+          return setToArray(set);
+        }
+        isCommon = false;
+        includes = cacheHas;
+        seen = new SetCache;
+      }
+      else {
+        seen = iteratee ? [] : result;
+      }
+      outer:
+      while (++index < length) {
+        var value = array[index],
+            computed = iteratee ? iteratee(value) : value;
+
+        value = (comparator || value !== 0) ? value : 0;
+        if (isCommon && computed === computed) {
+          var seenIndex = seen.length;
+          while (seenIndex--) {
+            if (seen[seenIndex] === computed) {
+              continue outer;
+            }
+          }
+          if (iteratee) {
+            seen.push(computed);
+          }
+          result.push(value);
+        }
+        else if (!includes(seen, computed, comparator)) {
+          if (seen !== result) {
+            seen.push(computed);
+          }
+          result.push(value);
+        }
+      }
+      return result;
+    }
+
+    /**
+     * The base implementation of `_.unset`.
+     *
+     * @private
+     * @param {Object} object The object to modify.
+     * @param {Array|string} path The property path to unset.
+     * @returns {boolean} Returns `true` if the property is deleted, else `false`.
+     */
+    function baseUnset(object, path) {
+      path = castPath(path, object);
+      object = parent(object, path);
+      return object == null || delete object[toKey(last(path))];
+    }
+
+    /**
+     * The base implementation of `_.update`.
+     *
+     * @private
+     * @param {Object} object The object to modify.
+     * @param {Array|string} path The path of the property to update.
+     * @param {Function} updater The function to produce the updated value.
+     * @param {Function} [customizer] The function to customize path creation.
+     * @returns {Object} Returns `object`.
+     */
+    function baseUpdate(object, path, updater, customizer) {
+      return baseSet(object, path, updater(baseGet(object, path)), customizer);
+    }
+
+    /**
+     * The base implementation of methods like `_.dropWhile` and `_.takeWhile`
+     * without support for iteratee shorthands.
+     *
+     * @private
+     * @param {Array} array The array to query.
+     * @param {Function} predicate The function invoked per iteration.
+     * @param {boolean} [isDrop] Specify dropping elements instead of taking them.
+     * @param {boolean} [fromRight] Specify iterating from right to left.
+     * @returns {Array} Returns the slice of `array`.
+     */
+    function baseWhile(array, predicate, isDrop, fromRight) {
+      var length = array.length,
+          index = fromRight ? length : -1;
+
+      while ((fromRight ? index-- : ++index < length) &&
+        predicate(array[index], index, array)) {}
+
+      return isDrop
+        ? baseSlice(array, (fromRight ? 0 : index), (fromRight ? index + 1 : length))
+        : baseSlice(array, (fromRight ? index + 1 : 0), (fromRight ? length : index));
+    }
+
+    /**
+     * The base implementation of `wrapperValue` which returns the result of
+     * performing a sequence of actions on the unwrapped `value`, where each
+     * successive action is supplied the return value of the previous.
+     *
+     * @private
+     * @param {*} value The unwrapped value.
+     * @param {Array} actions Actions to perform to resolve the unwrapped value.
+     * @returns {*} Returns the resolved value.
+     */
+    function baseWrapperValue(value, actions) {
+      var result = value;
+      if (result instanceof LazyWrapper) {
+        result = result.value();
+      }
+      return arrayReduce(actions, function(result, action) {
+        return action.func.apply(action.thisArg, arrayPush([result], action.args));
+      }, result);
+    }
+
+    /**
+     * The base implementation of methods like `_.xor`, without support for
+     * iteratee shorthands, that accepts an array of arrays to inspect.
+     *
+     * @private
+     * @param {Array} arrays The arrays to inspect.
+     * @param {Function} [iteratee] The iteratee invoked per element.
+     * @param {Function} [comparator] The comparator invoked per element.
+     * @returns {Array} Returns the new array of values.
+     */
+    function baseXor(arrays, iteratee, comparator) {
+      var length = arrays.length;
+      if (length < 2) {
+        return length ? baseUniq(arrays[0]) : [];
+      }
+      var index = -1,
+          result = Array(length);
+
+      while (++index < length) {
+        var array = arrays[index],
+            othIndex = -1;
+
+        while (++othIndex < length) {
+          if (othIndex != index) {
+            result[index] = baseDifference(result[index] || array, arrays[othIndex], iteratee, comparator);
+          }
+        }
+      }
+      return baseUniq(baseFlatten(result, 1), iteratee, comparator);
+    }
+
+    /**
+     * This base implementation of `_.zipObject` which assigns values using `assignFunc`.
+     *
+     * @private
+     * @param {Array} props The property identifiers.
+     * @param {Array} values The property values.
+     * @param {Function} assignFunc The function to assign values.
+     * @returns {Object} Returns the new object.
+     */
+    function baseZipObject(props, values, assignFunc) {
+      var index = -1,
+          length = props.length,
+          valsLength = values.length,
+          result = {};
+
+      while (++index < length) {
+        var value = index < valsLength ? values[index] : undefined;
+        assignFunc(result, props[index], value);
+      }
+      return result;
+    }
+
+    /**
+     * Casts `value` to an empty array if it's not an array like object.
+     *
+     * @private
+     * @param {*} value The value to inspect.
+     * @returns {Array|Object} Returns the cast array-like object.
+     */
+    function castArrayLikeObject(value) {
+      return isArrayLikeObject(value) ? value : [];
+    }
+
+    /**
+     * Casts `value` to `identity` if it's not a function.
+     *
+     * @private
+     * @param {*} value The value to inspect.
+     * @returns {Function} Returns cast function.
+     */
+    function castFunction(value) {
+      return typeof value == 'function' ? value : identity;
+    }
+
+    /**
+     * Casts `value` to a path array if it's not one.
+     *
+     * @private
+     * @param {*} value The value to inspect.
+     * @param {Object} [object] The object to query keys on.
+     * @returns {Array} Returns the cast property path array.
+     */
+    function castPath(value, object) {
+      if (isArray(value)) {
+        return value;
+      }
+      return isKey(value, object) ? [value] : stringToPath(toString(value));
+    }
+
+    /**
+     * A `baseRest` alias which can be replaced with `identity` by module
+     * replacement plugins.
+     *
+     * @private
+     * @type {Function}
+     * @param {Function} func The function to apply a rest parameter to.
+     * @returns {Function} Returns the new function.
+     */
+    var castRest = baseRest;
+
+    /**
+     * Casts `array` to a slice if it's needed.
+     *
+     * @private
+     * @param {Array} array The array to inspect.
+     * @param {number} start The start position.
+     * @param {number} [end=array.length] The end position.
+     * @returns {Array} Returns the cast slice.
+     */
+    function castSlice(array, start, end) {
+      var length = array.length;
+      end = end === undefined ? length : end;
+      return (!start && end >= length) ? array : baseSlice(array, start, end);
+    }
+
+    /**
+     * A simple wrapper around the global [`clearTimeout`](https://mdn.io/clearTimeout).
+     *
+     * @private
+     * @param {number|Object} id The timer id or timeout object of the timer to clear.
+     */
+    var clearTimeout = ctxClearTimeout || function(id) {
+      return root.clearTimeout(id);
+    };
+
+    /**
+     * Creates a clone of  `buffer`.
+     *
+     * @private
+     * @param {Buffer} buffer The buffer to clone.
+     * @param {boolean} [isDeep] Specify a deep clone.
+     * @returns {Buffer} Returns the cloned buffer.
+     */
+    function cloneBuffer(buffer, isDeep) {
+      if (isDeep) {
+        return buffer.slice();
+      }
+      var length = buffer.length,
+          result = allocUnsafe ? allocUnsafe(length) : new buffer.constructor(length);
+
+      buffer.copy(result);
+      return result;
+    }
+
+    /**
+     * Creates a clone of `arrayBuffer`.
+     *
+     * @private
+     * @param {ArrayBuffer} arrayBuffer The array buffer to clone.
+     * @returns {ArrayBuffer} Returns the cloned array buffer.
+     */
+    function cloneArrayBuffer(arrayBuffer) {
+      var result = new arrayBuffer.constructor(arrayBuffer.byteLength);
+      new Uint8Array(result).set(new Uint8Array(arrayBuffer));
+      return result;
+    }
+
+    /**
+     * Creates a clone of `dataView`.
+     *
+     * @private
+     * @param {Object} dataView The data view to clone.
+     * @param {boolean} [isDeep] Specify a deep clone.
+     * @returns {Object} Returns the cloned data view.
+     */
+    function cloneDataView(dataView, isDeep) {
+      var buffer = isDeep ? cloneArrayBuffer(dataView.buffer) : dataView.buffer;
+      return new dataView.constructor(buffer, dataView.byteOffset, dataView.byteLength);
+    }
+
+    /**
+     * Creates a clone of `regexp`.
+     *
+     * @private
+     * @param {Object} regexp The regexp to clone.
+     * @returns {Object} Returns the cloned regexp.
+     */
+    function cloneRegExp(regexp) {
+      var result = new regexp.constructor(regexp.source, reFlags.exec(regexp));
+      result.lastIndex = regexp.lastIndex;
+      return result;
+    }
+
+    /**
+     * Creates a clone of the `symbol` object.
+     *
+     * @private
+     * @param {Object} symbol The symbol object to clone.
+     * @returns {Object} Returns the cloned symbol object.
+     */
+    function cloneSymbol(symbol) {
+      return symbolValueOf ? Object(symbolValueOf.call(symbol)) : {};
+    }
+
+    /**
+     * Creates a clone of `typedArray`.
+     *
+     * @private
+     * @param {Object} typedArray The typed array to clone.
+     * @param {boolean} [isDeep] Specify a deep clone.
+     * @returns {Object} Returns the cloned typed array.
+     */
+    function cloneTypedArray(typedArray, isDeep) {
+      var buffer = isDeep ? cloneArrayBuffer(typedArray.buffer) : typedArray.buffer;
+      return new typedArray.constructor(buffer, typedArray.byteOffset, typedArray.length);
+    }
+
+    /**
+     * Compares values to sort them in ascending order.
+     *
+     * @private
+     * @param {*} value The value to compare.
+     * @param {*} other The other value to compare.
+     * @returns {number} Returns the sort order indicator for `value`.
+     */
+    function compareAscending(value, other) {
+      if (value !== other) {
+        var valIsDefined = value !== undefined,
+            valIsNull = value === null,
+            valIsReflexive = value === value,
+            valIsSymbol = isSymbol(value);
+
+        var othIsDefined = other !== undefined,
+            othIsNull = other === null,
+            othIsReflexive = other === other,
+            othIsSymbol = isSymbol(other);
+
+        if ((!othIsNull && !othIsSymbol && !valIsSymbol && value > other) ||
+            (valIsSymbol && othIsDefined && othIsReflexive && !othIsNull && !othIsSymbol) ||
+            (valIsNull && othIsDefined && othIsReflexive) ||
+            (!valIsDefined && othIsReflexive) ||
+            !valIsReflexive) {
+          return 1;
+        }
+        if ((!valIsNull && !valIsSymbol && !othIsSymbol && value < other) ||
+            (othIsSymbol && valIsDefined && valIsReflexive && !valIsNull && !valIsSymbol) ||
+            (othIsNull && valIsDefined && valIsReflexive) ||
+            (!othIsDefined && valIsReflexive) ||
+            !othIsReflexive) {
+          return -1;
+        }
+      }
+      return 0;
+    }
+
+    /**
+     * Used by `_.orderBy` to compare multiple properties of a value to another
+     * and stable sort them.
+     *
+     * If `orders` is unspecified, all values are sorted in ascending order. Otherwise,
+     * specify an order of "desc" for descending or "asc" for ascending sort order
+     * of corresponding values.
+     *
+     * @private
+     * @param {Object} object The object to compare.
+     * @param {Object} other The other object to compare.
+     * @param {boolean[]|string[]} orders The order to sort by for each property.
+     * @returns {number} Returns the sort order indicator for `object`.
+     */
+    function compareMultiple(object, other, orders) {
+      var index = -1,
+          objCriteria = object.criteria,
+          othCriteria = other.criteria,
+          length = objCriteria.length,
+          ordersLength = orders.length;
+
+      while (++index < length) {
+        var result = compareAscending(objCriteria[index], othCriteria[index]);
+        if (result) {
+          if (index >= ordersLength) {
+            return result;
+          }
+          var order = orders[index];
+          return result * (order == 'desc' ? -1 : 1);
+        }
+      }
+      // Fixes an `Array#sort` bug in the JS engine embedded in Adobe applications
+      // that causes it, under certain circumstances, to provide the same value for
+      // `object` and `other`. See https://github.com/jashkenas/underscore/pull/1247
+      // for more details.
+      //
+      // This also ensures a stable sort in V8 and other engines.
+      // See https://bugs.chromium.org/p/v8/issues/detail?id=90 for more details.
+      return object.index - other.index;
+    }
+
+    /**
+     * Creates an array that is the composition of partially applied arguments,
+     * placeholders, and provided arguments into a single array of arguments.
+     *
+     * @private
+     * @param {Array} args The provided arguments.
+     * @param {Array} partials The arguments to prepend to those provided.
+     * @param {Array} holders The `partials` placeholder indexes.
+     * @params {boolean} [isCurried] Specify composing for a curried function.
+     * @returns {Array} Returns the new array of composed arguments.
+     */
+    function composeArgs(args, partials, holders, isCurried) {
+      var argsIndex = -1,
+          argsLength = args.length,
+          holdersLength = holders.length,
+          leftIndex = -1,
+          leftLength = partials.length,
+          rangeLength = nativeMax(argsLength - holdersLength, 0),
+          result = Array(leftLength + rangeLength),
+          isUncurried = !isCurried;
+
+      while (++leftIndex < leftLength) {
+        result[leftIndex] = partials[leftIndex];
+      }
+      while (++argsIndex < holdersLength) {
+        if (isUncurried || argsIndex < argsLength) {
+          result[holders[argsIndex]] = args[argsIndex];
+        }
+      }
+      while (rangeLength--) {
+        result[leftIndex++] = args[argsIndex++];
+      }
+      return result;
+    }
+
+    /**
+     * This function is like `composeArgs` except that the arguments composition
+     * is tailored for `_.partialRight`.
+     *
+     * @private
+     * @param {Array} args The provided arguments.
+     * @param {Array} partials The arguments to append to those provided.
+     * @param {Array} holders The `partials` placeholder indexes.
+     * @params {boolean} [isCurried] Specify composing for a curried function.
+     * @returns {Array} Returns the new array of composed arguments.
+     */
+    function composeArgsRight(args, partials, holders, isCurried) {
+      var argsIndex = -1,
+          argsLength = args.length,
+          holdersIndex = -1,
+          holdersLength = holders.length,
+          rightIndex = -1,
+          rightLength = partials.length,
+          rangeLength = nativeMax(argsLength - holdersLength, 0),
+          result = Array(rangeLength + rightLength),
+          isUncurried = !isCurried;
+
+      while (++argsIndex < rangeLength) {
+        result[argsIndex] = args[argsIndex];
+      }
+      var offset = argsIndex;
+      while (++rightIndex < rightLength) {
+        result[offset + rightIndex] = partials[rightIndex];
+      }
+      while (++holdersIndex < holdersLength) {
+        if (isUncurried || argsIndex < argsLength) {
+          result[offset + holders[holdersIndex]] = args[argsIndex++];
+        }
+      }
+      return result;
+    }
+
+    /**
+     * Copies the values of `source` to `array`.
+     *
+     * @private
+     * @param {Array} source The array to copy values from.
+     * @param {Array} [array=[]] The array to copy values to.
+     * @returns {Array} Returns `array`.
+     */
+    function copyArray(source, array) {
+      var index = -1,
+          length = source.length;
+
+      array || (array = Array(length));
+      while (++index < length) {
+        array[index] = source[index];
+      }
+      return array;
+    }
+
+    /**
+     * Copies properties of `source` to `object`.
+     *
+     * @private
+     * @param {Object} source The object to copy properties from.
+     * @param {Array} props The property identifiers to copy.
+     * @param {Object} [object={}] The object to copy properties to.
+     * @param {Function} [customizer] The function to customize copied values.
+     * @returns {Object} Returns `object`.
+     */
+    function copyObject(source, props, object, customizer) {
+      var isNew = !object;
+      object || (object = {});
+
+      var index = -1,
+          length = props.length;
+
+      while (++index < length) {
+        var key = props[index];
+
+        var newValue = customizer
+          ? customizer(object[key], source[key], key, object, source)
+          : undefined;
+
+        if (newValue === undefined) {
+          newValue = source[key];
+        }
+        if (isNew) {
+          baseAssignValue(object, key, newValue);
+        } else {
+          assignValue(object, key, newValue);
+        }
+      }
+      return object;
+    }
+
+    /**
+     * Copies own symbols of `source` to `object`.
+     *
+     * @private
+     * @param {Object} source The object to copy symbols from.
+     * @param {Object} [object={}] The object to copy symbols to.
+     * @returns {Object} Returns `object`.
+     */
+    function copySymbols(source, object) {
+      return copyObject(source, getSymbols(source), object);
+    }
+
+    /**
+     * Copies own and inherited symbols of `source` to `object`.
+     *
+     * @private
+     * @param {Object} source The object to copy symbols from.
+     * @param {Object} [object={}] The object to copy symbols to.
+     * @returns {Object} Returns `object`.
+     */
+    function copySymbolsIn(source, object) {
+      return copyObject(source, getSymbolsIn(source), object);
+    }
+
+    /**
+     * Creates a function like `_.groupBy`.
+     *
+     * @private
+     * @param {Function} setter The function to set accumulator values.
+     * @param {Function} [initializer] The accumulator object initializer.
+     * @returns {Function} Returns the new aggregator function.
+     */
+    function createAggregator(setter, initializer) {
+      return function(collection, iteratee) {
+        var func = isArray(collection) ? arrayAggregator : baseAggregator,
+            accumulator = initializer ? initializer() : {};
+
+        return func(collection, setter, getIteratee(iteratee, 2), accumulator);
+      };
+    }
+
+    /**
+     * Creates a function like `_.assign`.
+     *
+     * @private
+     * @param {Function} assigner The function to assign values.
+     * @returns {Function} Returns the new assigner function.
+     */
+    function createAssigner(assigner) {
+      return baseRest(function(object, sources) {
+        var index = -1,
+            length = sources.length,
+            customizer = length > 1 ? sources[length - 1] : undefined,
+            guard = length > 2 ? sources[2] : undefined;
+
+        customizer = (assigner.length > 3 && typeof customizer == 'function')
+          ? (length--, customizer)
+          : undefined;
+
+        if (guard && isIterateeCall(sources[0], sources[1], guard)) {
+          customizer = length < 3 ? undefined : customizer;
+          length = 1;
+        }
+        object = Object(object);
+        while (++index < length) {
+          var source = sources[index];
+          if (source) {
+            assigner(object, source, index, customizer);
+          }
+        }
+        return object;
+      });
+    }
+
+    /**
+     * Creates a `baseEach` or `baseEachRight` function.
+     *
+     * @private
+     * @param {Function} eachFunc The function to iterate over a collection.
+     * @param {boolean} [fromRight] Specify iterating from right to left.
+     * @returns {Function} Returns the new base function.
+     */
+    function createBaseEach(eachFunc, fromRight) {
+      return function(collection, iteratee) {
+        if (collection == null) {
+          return collection;
+        }
+        if (!isArrayLike(collection)) {
+          return eachFunc(collection, iteratee);
+        }
+        var length = collection.length,
+            index = fromRight ? length : -1,
+            iterable = Object(collection);
+
+        while ((fromRight ? index-- : ++index < length)) {
+          if (iteratee(iterable[index], index, iterable) === false) {
+            break;
+          }
+        }
+        return collection;
+      };
+    }
+
+    /**
+     * Creates a base function for methods like `_.forIn` and `_.forOwn`.
+     *
+     * @private
+     * @param {boolean} [fromRight] Specify iterating from right to left.
+     * @returns {Function} Returns the new base function.
+     */
+    function createBaseFor(fromRight) {
+      return function(object, iteratee, keysFunc) {
+        var index = -1,
+            iterable = Object(object),
+            props = keysFunc(object),
+            length = props.length;
+
+        while (length--) {
+          var key = props[fromRight ? length : ++index];
+          if (iteratee(iterable[key], key, iterable) === false) {
+            break;
+          }
+        }
+        return object;
+      };
+    }
+
+    /**
+     * Creates a function that wraps `func` to invoke it with the optional `this`
+     * binding of `thisArg`.
+     *
+     * @private
+     * @param {Function} func The function to wrap.
+     * @param {number} bitmask The bitmask flags. See `createWrap` for more details.
+     * @param {*} [thisArg] The `this` binding of `func`.
+     * @returns {Function} Returns the new wrapped function.
+     */
+    function createBind(func, bitmask, thisArg) {
+      var isBind = bitmask & WRAP_BIND_FLAG,
+          Ctor = createCtor(func);
+
+      function wrapper() {
+        var fn = (this && this !== root && this instanceof wrapper) ? Ctor : func;
+        return fn.apply(isBind ? thisArg : this, arguments);
+      }
+      return wrapper;
+    }
+
+    /**
+     * Creates a function like `_.lowerFirst`.
+     *
+     * @private
+     * @param {string} methodName The name of the `String` case method to use.
+     * @returns {Function} Returns the new case function.
+     */
+    function createCaseFirst(methodName) {
+      return function(string) {
+        string = toString(string);
+
+        var strSymbols = hasUnicode(string)
+          ? stringToArray(string)
+          : undefined;
+
+        var chr = strSymbols
+          ? strSymbols[0]
+          : string.charAt(0);
+
+        var trailing = strSymbols
+          ? castSlice(strSymbols, 1).join('')
+          : string.slice(1);
+
+        return chr[methodName]() + trailing;
+      };
+    }
+
+    /**
+     * Creates a function like `_.camelCase`.
+     *
+     * @private
+     * @param {Function} callback The function to combine each word.
+     * @returns {Function} Returns the new compounder function.
+     */
+    function createCompounder(callback) {
+      return function(string) {
+        return arrayReduce(words(deburr(string).replace(reApos, '')), callback, '');
+      };
+    }
+
+    /**
+     * Creates a function that produces an instance of `Ctor` regardless of
+     * whether it was invoked as part of a `new` expression or by `call` or `apply`.
+     *
+     * @private
+     * @param {Function} Ctor The constructor to wrap.
+     * @returns {Function} Returns the new wrapped function.
+     */
+    function createCtor(Ctor) {
+      return function() {
+        // Use a `switch` statement to work with class constructors. See
+        // http://ecma-international.org/ecma-262/7.0/#sec-ecmascript-function-objects-call-thisargument-argumentslist
+        // for more details.
+        var args = arguments;
+        switch (args.length) {
+          case 0: return new Ctor;
+          case 1: return new Ctor(args[0]);
+          case 2: return new Ctor(args[0], args[1]);
+          case 3: return new Ctor(args[0], args[1], args[2]);
+          case 4: return new Ctor(args[0], args[1], args[2], args[3]);
+          case 5: return new Ctor(args[0], args[1], args[2], args[3], args[4]);
+          case 6: return new Ctor(args[0], args[1], args[2], args[3], args[4], args[5]);
+          case 7: return new Ctor(args[0], args[1], args[2], args[3], args[4], args[5], args[6]);
+        }
+        var thisBinding = baseCreate(Ctor.prototype),
+            result = Ctor.apply(thisBinding, args);
+
+        // Mimic the constructor's `return` behavior.
+        // See https://es5.github.io/#x13.2.2 for more details.
+        return isObject(result) ? result : thisBinding;
+      };
+    }
+
+    /**
+     * Creates a function that wraps `func` to enable currying.
+     *
+     * @private
+     * @param {Function} func The function to wrap.
+     * @param {number} bitmask The bitmask flags. See `createWrap` for more details.
+     * @param {number} arity The arity of `func`.
+     * @returns {Function} Returns the new wrapped function.
+     */
+    function createCurry(func, bitmask, arity) {
+      var Ctor = createCtor(func);
+
+      function wrapper() {
+        var length = arguments.length,
+            args = Array(length),
+            index = length,
+            placeholder = getHolder(wrapper);
+
+        while (index--) {
+          args[index] = arguments[index];
+        }
+        var holders = (length < 3 && args[0] !== placeholder && args[length - 1] !== placeholder)
+          ? []
+          : replaceHolders(args, placeholder);
+
+        length -= holders.length;
+        if (length < arity) {
+          return createRecurry(
+            func, bitmask, createHybrid, wrapper.placeholder, undefined,
+            args, holders, undefined, undefined, arity - length);
+        }
+        var fn = (this && this !== root && this instanceof wrapper) ? Ctor : func;
+        return apply(fn, this, args);
+      }
+      return wrapper;
+    }
+
+    /**
+     * Creates a `_.find` or `_.findLast` function.
+     *
+     * @private
+     * @param {Function} findIndexFunc The function to find the collection index.
+     * @returns {Function} Returns the new find function.
+     */
+    function createFind(findIndexFunc) {
+      return function(collection, predicate, fromIndex) {
+        var iterable = Object(collection);
+        if (!isArrayLike(collection)) {
+          var iteratee = getIteratee(predicate, 3);
+          collection = keys(collection);
+          predicate = function(key) { return iteratee(iterable[key], key, iterable); };
+        }
+        var index = findIndexFunc(collection, predicate, fromIndex);
+        return index > -1 ? iterable[iteratee ? collection[index] : index] : undefined;
+      };
+    }
+
+    /**
+     * Creates a `_.flow` or `_.flowRight` function.
+     *
+     * @private
+     * @param {boolean} [fromRight] Specify iterating from right to left.
+     * @returns {Function} Returns the new flow function.
+     */
+    function createFlow(fromRight) {
+      return flatRest(function(funcs) {
+        var length = funcs.length,
+            index = length,
+            prereq = LodashWrapper.prototype.thru;
+
+        if (fromRight) {
+          funcs.reverse();
+        }
+        while (index--) {
+          var func = funcs[index];
+          if (typeof func != 'function') {
+            throw new TypeError(FUNC_ERROR_TEXT);
+          }
+          if (prereq && !wrapper && getFuncName(func) == 'wrapper') {
+            var wrapper = new LodashWrapper([], true);
+          }
+        }
+        index = wrapper ? index : length;
+        while (++index < length) {
+          func = funcs[index];
+
+          var funcName = getFuncName(func),
+              data = funcName == 'wrapper' ? getData(func) : undefined;
+
+          if (data && isLaziable(data[0]) &&
+                data[1] == (WRAP_ARY_FLAG | WRAP_CURRY_FLAG | WRAP_PARTIAL_FLAG | WRAP_REARG_FLAG) &&
+                !data[4].length && data[9] == 1
+              ) {
+            wrapper = wrapper[getFuncName(data[0])].apply(wrapper, data[3]);
+          } else {
+            wrapper = (func.length == 1 && isLaziable(func))
+              ? wrapper[funcName]()
+              : wrapper.thru(func);
+          }
+        }
+        return function() {
+          var args = arguments,
+              value = args[0];
+
+          if (wrapper && args.length == 1 && isArray(value)) {
+            return wrapper.plant(value).value();
+          }
+          var index = 0,
+              result = length ? funcs[index].apply(this, args) : value;
+
+          while (++index < length) {
+            result = funcs[index].call(this, result);
+          }
+          return result;
+        };
+      });
+    }
+
+    /**
+     * Creates a function that wraps `func` to invoke it with optional `this`
+     * binding of `thisArg`, partial application, and currying.
+     *
+     * @private
+     * @param {Function|string} func The function or method name to wrap.
+     * @param {number} bitmask The bitmask flags. See `createWrap` for more details.
+     * @param {*} [thisArg] The `this` binding of `func`.
+     * @param {Array} [partials] The arguments to prepend to those provided to
+     *  the new function.
+     * @param {Array} [holders] The `partials` placeholder indexes.
+     * @param {Array} [partialsRight] The arguments to append to those provided
+     *  to the new function.
+     * @param {Array} [holdersRight] The `partialsRight` placeholder indexes.
+     * @param {Array} [argPos] The argument positions of the new function.
+     * @param {number} [ary] The arity cap of `func`.
+     * @param {number} [arity] The arity of `func`.
+     * @returns {Function} Returns the new wrapped function.
+     */
+    function createHybrid(func, bitmask, thisArg, partials, holders, partialsRight, holdersRight, argPos, ary, arity) {
+      var isAry = bitmask & WRAP_ARY_FLAG,
+          isBind = bitmask & WRAP_BIND_FLAG,
+          isBindKey = bitmask & WRAP_BIND_KEY_FLAG,
+          isCurried = bitmask & (WRAP_CURRY_FLAG | WRAP_CURRY_RIGHT_FLAG),
+          isFlip = bitmask & WRAP_FLIP_FLAG,
+          Ctor = isBindKey ? undefined : createCtor(func);
+
+      function wrapper() {
+        var length = arguments.length,
+            args = Array(length),
+            index = length;
+
+        while (index--) {
+          args[index] = arguments[index];
+        }
+        if (isCurried) {
+          var placeholder = getHolder(wrapper),
+              holdersCount = countHolders(args, placeholder);
+        }
+        if (partials) {
+          args = composeArgs(args, partials, holders, isCurried);
+        }
+        if (partialsRight) {
+          args = composeArgsRight(args, partialsRight, holdersRight, isCurried);
+        }
+        length -= holdersCount;
+        if (isCurried && length < arity) {
+          var newHolders = replaceHolders(args, placeholder);
+          return createRecurry(
+            func, bitmask, createHybrid, wrapper.placeholder, thisArg,
+            args, newHolders, argPos, ary, arity - length
+          );
+        }
+        var thisBinding = isBind ? thisArg : this,
+            fn = isBindKey ? thisBinding[func] : func;
+
+        length = args.length;
+        if (argPos) {
+          args = reorder(args, argPos);
+        } else if (isFlip && length > 1) {
+          args.reverse();
+        }
+        if (isAry && ary < length) {
+          args.length = ary;
+        }
+        if (this && this !== root && this instanceof wrapper) {
+          fn = Ctor || createCtor(fn);
+        }
+        return fn.apply(thisBinding, args);
+      }
+      return wrapper;
+    }
+
+    /**
+     * Creates a function like `_.invertBy`.
+     *
+     * @private
+     * @param {Function} setter The function to set accumulator values.
+     * @param {Function} toIteratee The function to resolve iteratees.
+     * @returns {Function} Returns the new inverter function.
+     */
+    function createInverter(setter, toIteratee) {
+      return function(object, iteratee) {
+        return baseInverter(object, setter, toIteratee(iteratee), {});
+      };
+    }
+
+    /**
+     * Creates a function that performs a mathematical operation on two values.
+     *
+     * @private
+     * @param {Function} operator The function to perform the operation.
+     * @param {number} [defaultValue] The value used for `undefined` arguments.
+     * @returns {Function} Returns the new mathematical operation function.
+     */
+    function createMathOperation(operator, defaultValue) {
+      return function(value, other) {
+        var result;
+        if (value === undefined && other === undefined) {
+          return defaultValue;
+        }
+        if (value !== undefined) {
+          result = value;
+        }
+        if (other !== undefined) {
+          if (result === undefined) {
+            return other;
+          }
+          if (typeof value == 'string' || typeof other == 'string') {
+            value = baseToString(value);
+            other = baseToString(other);
+          } else {
+            value = baseToNumber(value);
+            other = baseToNumber(other);
+          }
+          result = operator(value, other);
+        }
+        return result;
+      };
+    }
+
+    /**
+     * Creates a function like `_.over`.
+     *
+     * @private
+     * @param {Function} arrayFunc The function to iterate over iteratees.
+     * @returns {Function} Returns the new over function.
+     */
+    function createOver(arrayFunc) {
+      return flatRest(function(iteratees) {
+        iteratees = arrayMap(iteratees, baseUnary(getIteratee()));
+        return baseRest(function(args) {
+          var thisArg = this;
+          return arrayFunc(iteratees, function(iteratee) {
+            return apply(iteratee, thisArg, args);
+          });
+        });
+      });
+    }
+
+    /**
+     * Creates the padding for `string` based on `length`. The `chars` string
+     * is truncated if the number of characters exceeds `length`.
+     *
+     * @private
+     * @param {number} length The padding length.
+     * @param {string} [chars=' '] The string used as padding.
+     * @returns {string} Returns the padding for `string`.
+     */
+    function createPadding(length, chars) {
+      chars = chars === undefined ? ' ' : baseToString(chars);
+
+      var charsLength = chars.length;
+      if (charsLength < 2) {
+        return charsLength ? baseRepeat(chars, length) : chars;
+      }
+      var result = baseRepeat(chars, nativeCeil(length / stringSize(chars)));
+      return hasUnicode(chars)
+        ? castSlice(stringToArray(result), 0, length).join('')
+        : result.slice(0, length);
+    }
+
+    /**
+     * Creates a function that wraps `func` to invoke it with the `this` binding
+     * of `thisArg` and `partials` prepended to the arguments it receives.
+     *
+     * @private
+     * @param {Function} func The function to wrap.
+     * @param {number} bitmask The bitmask flags. See `createWrap` for more details.
+     * @param {*} thisArg The `this` binding of `func`.
+     * @param {Array} partials The arguments to prepend to those provided to
+     *  the new function.
+     * @returns {Function} Returns the new wrapped function.
+     */
+    function createPartial(func, bitmask, thisArg, partials) {
+      var isBind = bitmask & WRAP_BIND_FLAG,
+          Ctor = createCtor(func);
+
+      function wrapper() {
+        var argsIndex = -1,
+            argsLength = arguments.length,
+            leftIndex = -1,
+            leftLength = partials.length,
+            args = Array(leftLength + argsLength),
+            fn = (this && this !== root && this instanceof wrapper) ? Ctor : func;
+
+        while (++leftIndex < leftLength) {
+          args[leftIndex] = partials[leftIndex];
+        }
+        while (argsLength--) {
+          args[leftIndex++] = arguments[++argsIndex];
+        }
+        return apply(fn, isBind ? thisArg : this, args);
+      }
+      return wrapper;
+    }
+
+    /**
+     * Creates a `_.range` or `_.rangeRight` function.
+     *
+     * @private
+     * @param {boolean} [fromRight] Specify iterating from right to left.
+     * @returns {Function} Returns the new range function.
+     */
+    function createRange(fromRight) {
+      return function(start, end, step) {
+        if (step && typeof step != 'number' && isIterateeCall(start, end, step)) {
+          end = step = undefined;
+        }
+        // Ensure the sign of `-0` is preserved.
+        start = toFinite(start);
+        if (end === undefined) {
+          end = start;
+          start = 0;
+        } else {
+          end = toFinite(end);
+        }
+        step = step === undefined ? (start < end ? 1 : -1) : toFinite(step);
+        return baseRange(start, end, step, fromRight);
+      };
+    }
+
+    /**
+     * Creates a function that performs a relational operation on two values.
+     *
+     * @private
+     * @param {Function} operator The function to perform the operation.
+     * @returns {Function} Returns the new relational operation function.
+     */
+    function createRelationalOperation(operator) {
+      return function(value, other) {
+        if (!(typeof value == 'string' && typeof other == 'string')) {
+          value = toNumber(value);
+          other = toNumber(other);
+        }
+        return operator(value, other);
+      };
+    }
+
+    /**
+     * Creates a function that wraps `func` to continue currying.
+     *
+     * @private
+     * @param {Function} func The function to wrap.
+     * @param {number} bitmask The bitmask flags. See `createWrap` for more details.
+     * @param {Function} wrapFunc The function to create the `func` wrapper.
+     * @param {*} placeholder The placeholder value.
+     * @param {*} [thisArg] The `this` binding of `func`.
+     * @param {Array} [partials] The arguments to prepend to those provided to
+     *  the new function.
+     * @param {Array} [holders] The `partials` placeholder indexes.
+     * @param {Array} [argPos] The argument positions of the new function.
+     * @param {number} [ary] The arity cap of `func`.
+     * @param {number} [arity] The arity of `func`.
+     * @returns {Function} Returns the new wrapped function.
+     */
+    function createRecurry(func, bitmask, wrapFunc, placeholder, thisArg, partials, holders, argPos, ary, arity) {
+      var isCurry = bitmask & WRAP_CURRY_FLAG,
+          newHolders = isCurry ? holders : undefined,
+          newHoldersRight = isCurry ? undefined : holders,
+          newPartials = isCurry ? partials : undefined,
+          newPartialsRight = isCurry ? undefined : partials;
+
+      bitmask |= (isCurry ? WRAP_PARTIAL_FLAG : WRAP_PARTIAL_RIGHT_FLAG);
+      bitmask &= ~(isCurry ? WRAP_PARTIAL_RIGHT_FLAG : WRAP_PARTIAL_FLAG);
+
+      if (!(bitmask & WRAP_CURRY_BOUND_FLAG)) {
+        bitmask &= ~(WRAP_BIND_FLAG | WRAP_BIND_KEY_FLAG);
+      }
+      var newData = [
+        func, bitmask, thisArg, newPartials, newHolders, newPartialsRight,
+        newHoldersRight, argPos, ary, arity
+      ];
+
+      var result = wrapFunc.apply(undefined, newData);
+      if (isLaziable(func)) {
+        setData(result, newData);
+      }
+      result.placeholder = placeholder;
+      return setWrapToString(result, func, bitmask);
+    }
+
+    /**
+     * Creates a function like `_.round`.
+     *
+     * @private
+     * @param {string} methodName The name of the `Math` method to use when rounding.
+     * @returns {Function} Returns the new round function.
+     */
+    function createRound(methodName) {
+      var func = Math[methodName];
+      return function(number, precision) {
+        number = toNumber(number);
+        precision = precision == null ? 0 : nativeMin(toInteger(precision), 292);
+        if (precision && nativeIsFinite(number)) {
+          // Shift with exponential notation to avoid floating-point issues.
+          // See [MDN](https://mdn.io/round#Examples) for more details.
+          var pair = (toString(number) + 'e').split('e'),
+              value = func(pair[0] + 'e' + (+pair[1] + precision));
+
+          pair = (toString(value) + 'e').split('e');
+          return +(pair[0] + 'e' + (+pair[1] - precision));
+        }
+        return func(number);
+      };
+    }
+
+    /**
+     * Creates a set object of `values`.
+     *
+     * @private
+     * @param {Array} values The values to add to the set.
+     * @returns {Object} Returns the new set.
+     */
+    var createSet = !(Set && (1 / setToArray(new Set([,-0]))[1]) == INFINITY) ? noop : function(values) {
+      return new Set(values);
+    };
+
+    /**
+     * Creates a `_.toPairs` or `_.toPairsIn` function.
+     *
+     * @private
+     * @param {Function} keysFunc The function to get the keys of a given object.
+     * @returns {Function} Returns the new pairs function.
+     */
+    function createToPairs(keysFunc) {
+      return function(object) {
+        var tag = getTag(object);
+        if (tag == mapTag) {
+          return mapToArray(object);
+        }
+        if (tag == setTag) {
+          return setToPairs(object);
+        }
+        return baseToPairs(object, keysFunc(object));
+      };
+    }
+
+    /**
+     * Creates a function that either curries or invokes `func` with optional
+     * `this` binding and partially applied arguments.
+     *
+     * @private
+     * @param {Function|string} func The function or method name to wrap.
+     * @param {number} bitmask The bitmask flags.
+     *    1 - `_.bind`
+     *    2 - `_.bindKey`
+     *    4 - `_.curry` or `_.curryRight` of a bound function
+     *    8 - `_.curry`
+     *   16 - `_.curryRight`
+     *   32 - `_.partial`
+     *   64 - `_.partialRight`
+     *  128 - `_.rearg`
+     *  256 - `_.ary`
+     *  512 - `_.flip`
+     * @param {*} [thisArg] The `this` binding of `func`.
+     * @param {Array} [partials] The arguments to be partially applied.
+     * @param {Array} [holders] The `partials` placeholder indexes.
+     * @param {Array} [argPos] The argument positions of the new function.
+     * @param {number} [ary] The arity cap of `func`.
+     * @param {number} [arity] The arity of `func`.
+     * @returns {Function} Returns the new wrapped function.
+     */
+    function createWrap(func, bitmask, thisArg, partials, holders, argPos, ary, arity) {
+      var isBindKey = bitmask & WRAP_BIND_KEY_FLAG;
+      if (!isBindKey && typeof func != 'function') {
+        throw new TypeError(FUNC_ERROR_TEXT);
+      }
+      var length = partials ? partials.length : 0;
+      if (!length) {
+        bitmask &= ~(WRAP_PARTIAL_FLAG | WRAP_PARTIAL_RIGHT_FLAG);
+        partials = holders = undefined;
+      }
+      ary = ary === undefined ? ary : nativeMax(toInteger(ary), 0);
+      arity = arity === undefined ? arity : toInteger(arity);
+      length -= holders ? holders.length : 0;
+
+      if (bitmask & WRAP_PARTIAL_RIGHT_FLAG) {
+        var partialsRight = partials,
+            holdersRight = holders;
+
+        partials = holders = undefined;
+      }
+      var data = isBindKey ? undefined : getData(func);
+
+      var newData = [
+        func, bitmask, thisArg, partials, holders, partialsRight, holdersRight,
+        argPos, ary, arity
+      ];
+
+      if (data) {
+        mergeData(newData, data);
+      }
+      func = newData[0];
+      bitmask = newData[1];
+      thisArg = newData[2];
+      partials = newData[3];
+      holders = newData[4];
+      arity = newData[9] = newData[9] === undefined
+        ? (isBindKey ? 0 : func.length)
+        : nativeMax(newData[9] - length, 0);
+
+      if (!arity && bitmask & (WRAP_CURRY_FLAG | WRAP_CURRY_RIGHT_FLAG)) {
+        bitmask &= ~(WRAP_CURRY_FLAG | WRAP_CURRY_RIGHT_FLAG);
+      }
+      if (!bitmask || bitmask == WRAP_BIND_FLAG) {
+        var result = createBind(func, bitmask, thisArg);
+      } else if (bitmask == WRAP_CURRY_FLAG || bitmask == WRAP_CURRY_RIGHT_FLAG) {
+        result = createCurry(func, bitmask, arity);
+      } else if ((bitmask == WRAP_PARTIAL_FLAG || bitmask == (WRAP_BIND_FLAG | WRAP_PARTIAL_FLAG)) && !holders.length) {
+        result = createPartial(func, bitmask, thisArg, partials);
+      } else {
+        result = createHybrid.apply(undefined, newData);
+      }
+      var setter = data ? baseSetData : setData;
+      return setWrapToString(setter(result, newData), func, bitmask);
+    }
+
+    /**
+     * Used by `_.defaults` to customize its `_.assignIn` use to assign properties
+     * of source objects to the destination object for all destination properties
+     * that resolve to `undefined`.
+     *
+     * @private
+     * @param {*} objValue The destination value.
+     * @param {*} srcValue The source value.
+     * @param {string} key The key of the property to assign.
+     * @param {Object} object The parent object of `objValue`.
+     * @returns {*} Returns the value to assign.
+     */
+    function customDefaultsAssignIn(objValue, srcValue, key, object) {
+      if (objValue === undefined ||
+          (eq(objValue, objectProto[key]) && !hasOwnProperty.call(object, key))) {
+        return srcValue;
+      }
+      return objValue;
+    }
+
+    /**
+     * Used by `_.defaultsDeep` to customize its `_.merge` use to merge source
+     * objects into destination objects that are passed thru.
+     *
+     * @private
+     * @param {*} objValue The destination value.
+     * @param {*} srcValue The source value.
+     * @param {string} key The key of the property to merge.
+     * @param {Object} object The parent object of `objValue`.
+     * @param {Object} source The parent object of `srcValue`.
+     * @param {Object} [stack] Tracks traversed source values and their merged
+     *  counterparts.
+     * @returns {*} Returns the value to assign.
+     */
+    function customDefaultsMerge(objValue, srcValue, key, object, source, stack) {
+      if (isObject(objValue) && isObject(srcValue)) {
+        // Recursively merge objects and arrays (susceptible to call stack limits).
+        stack.set(srcValue, objValue);
+        baseMerge(objValue, srcValue, undefined, customDefaultsMerge, stack);
+        stack['delete'](srcValue);
+      }
+      return objValue;
+    }
+
+    /**
+     * Used by `_.omit` to customize its `_.cloneDeep` use to only clone plain
+     * objects.
+     *
+     * @private
+     * @param {*} value The value to inspect.
+     * @param {string} key The key of the property to inspect.
+     * @returns {*} Returns the uncloned value or `undefined` to defer cloning to `_.cloneDeep`.
+     */
+    function customOmitClone(value) {
+      return isPlainObject(value) ? undefined : value;
+    }
+
+    /**
+     * A specialized version of `baseIsEqualDeep` for arrays with support for
+     * partial deep comparisons.
+     *
+     * @private
+     * @param {Array} array The array to compare.
+     * @param {Array} other The other array to compare.
+     * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
+     * @param {Function} customizer The function to customize comparisons.
+     * @param {Function} equalFunc The function to determine equivalents of values.
+     * @param {Object} stack Tracks traversed `array` and `other` objects.
+     * @returns {boolean} Returns `true` if the arrays are equivalent, else `false`.
+     */
+    function equalArrays(array, other, bitmask, customizer, equalFunc, stack) {
+      var isPartial = bitmask & COMPARE_PARTIAL_FLAG,
+          arrLength = array.length,
+          othLength = other.length;
+
+      if (arrLength != othLength && !(isPartial && othLength > arrLength)) {
+        return false;
+      }
+      // Check that cyclic values are equal.
+      var arrStacked = stack.get(array);
+      var othStacked = stack.get(other);
+      if (arrStacked && othStacked) {
+        return arrStacked == other && othStacked == array;
+      }
+      var index = -1,
+          result = true,
+          seen = (bitmask & COMPARE_UNORDERED_FLAG) ? new SetCache : undefined;
+
+      stack.set(array, other);
+      stack.set(other, array);
+
+      // Ignore non-index properties.
+      while (++index < arrLength) {
+        var arrValue = array[index],
+            othValue = other[index];
+
+        if (customizer) {
+          var compared = isPartial
+            ? customizer(othValue, arrValue, index, other, array, stack)
+            : customizer(arrValue, othValue, index, array, other, stack);
+        }
+        if (compared !== undefined) {
+          if (compared) {
+            continue;
+          }
+          result = false;
+          break;
+        }
+        // Recursively compare arrays (susceptible to call stack limits).
+        if (seen) {
+          if (!arraySome(other, function(othValue, othIndex) {
+                if (!cacheHas(seen, othIndex) &&
+                    (arrValue === othValue || equalFunc(arrValue, othValue, bitmask, customizer, stack))) {
+                  return seen.push(othIndex);
+                }
+              })) {
+            result = false;
+            break;
+          }
+        } else if (!(
+              arrValue === othValue ||
+                equalFunc(arrValue, othValue, bitmask, customizer, stack)
+            )) {
+          result = false;
+          break;
+        }
+      }
+      stack['delete'](array);
+      stack['delete'](other);
+      return result;
+    }
+
+    /**
+     * A specialized version of `baseIsEqualDeep` for comparing objects of
+     * the same `toStringTag`.
+     *
+     * **Note:** This function only supports comparing values with tags of
+     * `Boolean`, `Date`, `Error`, `Number`, `RegExp`, or `String`.
+     *
+     * @private
+     * @param {Object} object The object to compare.
+     * @param {Object} other The other object to compare.
+     * @param {string} tag The `toStringTag` of the objects to compare.
+     * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
+     * @param {Function} customizer The function to customize comparisons.
+     * @param {Function} equalFunc The function to determine equivalents of values.
+     * @param {Object} stack Tracks traversed `object` and `other` objects.
+     * @returns {boolean} Returns `true` if the objects are equivalent, else `false`.
+     */
+    function equalByTag(object, other, tag, bitmask, customizer, equalFunc, stack) {
+      switch (tag) {
+        case dataViewTag:
+          if ((object.byteLength != other.byteLength) ||
+              (object.byteOffset != other.byteOffset)) {
+            return false;
+          }
+          object = object.buffer;
+          other = other.buffer;
+
+        case arrayBufferTag:
+          if ((object.byteLength != other.byteLength) ||
+              !equalFunc(new Uint8Array(object), new Uint8Array(other))) {
+            return false;
+          }
+          return true;
+
+        case boolTag:
+        case dateTag:
+        case numberTag:
+          // Coerce booleans to `1` or `0` and dates to milliseconds.
+          // Invalid dates are coerced to `NaN`.
+          return eq(+object, +other);
+
+        case errorTag:
+          return object.name == other.name && object.message == other.message;
+
+        case regexpTag:
+        case stringTag:
+          // Coerce regexes to strings and treat strings, primitives and objects,
+          // as equal. See http://www.ecma-international.org/ecma-262/7.0/#sec-regexp.prototype.tostring
+          // for more details.
+          return object == (other + '');
+
+        case mapTag:
+          var convert = mapToArray;
+
+        case setTag:
+          var isPartial = bitmask & COMPARE_PARTIAL_FLAG;
+          convert || (convert = setToArray);
+
+          if (object.size != other.size && !isPartial) {
+            return false;
+          }
+          // Assume cyclic values are equal.
+          var stacked = stack.get(object);
+          if (stacked) {
+            return stacked == other;
+          }
+          bitmask |= COMPARE_UNORDERED_FLAG;
+
+          // Recursively compare objects (susceptible to call stack limits).
+          stack.set(object, other);
+          var result = equalArrays(convert(object), convert(other), bitmask, customizer, equalFunc, stack);
+          stack['delete'](object);
+          return result;
+
+        case symbolTag:
+          if (symbolValueOf) {
+            return symbolValueOf.call(object) == symbolValueOf.call(other);
+          }
+      }
+      return false;
+    }
+
+    /**
+     * A specialized version of `baseIsEqualDeep` for objects with support for
+     * partial deep comparisons.
+     *
+     * @private
+     * @param {Object} object The object to compare.
+     * @param {Object} other The other object to compare.
+     * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details.
+     * @param {Function} customizer The function to customize comparisons.
+     * @param {Function} equalFunc The function to determine equivalents of values.
+     * @param {Object} stack Tracks traversed `object` and `other` objects.
+     * @returns {boolean} Returns `true` if the objects are equivalent, else `false`.
+     */
+    function equalObjects(object, other, bitmask, customizer, equalFunc, stack) {
+      var isPartial = bitmask & COMPARE_PARTIAL_FLAG,
+          objProps = getAllKeys(object),
+          objLength = objProps.length,
+          othProps = getAllKeys(other),
+          othLength = othProps.length;
+
+      if (objLength != othLength && !isPartial) {
+        return false;
+      }
+      var index = objLength;
+      while (index--) {
+        var key = objProps[index];
+        if (!(isPartial ? key in other : hasOwnProperty.call(other, key))) {
+          return false;
+        }
+      }
+      // Check that cyclic values are equal.
+      var objStacked = stack.get(object);
+      var othStacked = stack.get(other);
+      if (objStacked && othStacked) {
+        return objStacked == other && othStacked == object;
+      }
+      var result = true;
+      stack.set(object, other);
+      stack.set(other, object);
+
+      var skipCtor = isPartial;
+      while (++index < objLength) {
+        key = objProps[index];
+        var objValue = object[key],
+            othValue = other[key];
+
+        if (customizer) {
+          var compared = isPartial
+            ? customizer(othValue, objValue, key, other, object, stack)
+            : customizer(objValue, othValue, key, object, other, stack);
+        }
+        // Recursively compare objects (susceptible to call stack limits).
+        if (!(compared === undefined
+              ? (objValue === othValue || equalFunc(objValue, othValue, bitmask, customizer, stack))
+              : compared
+            )) {
+          result = false;
+          break;
+        }
+        skipCtor || (skipCtor = key == 'constructor');
+      }
+      if (result && !skipCtor) {
+        var objCtor = object.constructor,
+            othCtor = other.constructor;
+
+        // Non `Object` object instances with different constructors are not equal.
+        if (objCtor != othCtor &&
+            ('constructor' in object && 'constructor' in other) &&
+            !(typeof objCtor == 'function' && objCtor instanceof objCtor &&
+              typeof othCtor == 'function' && othCtor instanceof othCtor)) {
+          result = false;
+        }
+      }
+      stack['delete'](object);
+      stack['delete'](other);
+      return result;
+    }
+
+    /**
+     * A specialized version of `baseRest` which flattens the rest array.
+     *
+     * @private
+     * @param {Function} func The function to apply a rest parameter to.
+     * @returns {Function} Returns the new function.
+     */
+    function flatRest(func) {
+      return setToString(overRest(func, undefined, flatten), func + '');
+    }
+
+    /**
+     * Creates an array of own enumerable property names and symbols of `object`.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the array of property names and symbols.
+     */
+    function getAllKeys(object) {
+      return baseGetAllKeys(object, keys, getSymbols);
+    }
+
+    /**
+     * Creates an array of own and inherited enumerable property names and
+     * symbols of `object`.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the array of property names and symbols.
+     */
+    function getAllKeysIn(object) {
+      return baseGetAllKeys(object, keysIn, getSymbolsIn);
+    }
+
+    /**
+     * Gets metadata for `func`.
+     *
+     * @private
+     * @param {Function} func The function to query.
+     * @returns {*} Returns the metadata for `func`.
+     */
+    var getData = !metaMap ? noop : function(func) {
+      return metaMap.get(func);
+    };
+
+    /**
+     * Gets the name of `func`.
+     *
+     * @private
+     * @param {Function} func The function to query.
+     * @returns {string} Returns the function name.
+     */
+    function getFuncName(func) {
+      var result = (func.name + ''),
+          array = realNames[result],
+          length = hasOwnProperty.call(realNames, result) ? array.length : 0;
+
+      while (length--) {
+        var data = array[length],
+            otherFunc = data.func;
+        if (otherFunc == null || otherFunc == func) {
+          return data.name;
+        }
+      }
+      return result;
+    }
+
+    /**
+     * Gets the argument placeholder value for `func`.
+     *
+     * @private
+     * @param {Function} func The function to inspect.
+     * @returns {*} Returns the placeholder value.
+     */
+    function getHolder(func) {
+      var object = hasOwnProperty.call(lodash, 'placeholder') ? lodash : func;
+      return object.placeholder;
+    }
+
+    /**
+     * Gets the appropriate "iteratee" function. If `_.iteratee` is customized,
+     * this function returns the custom method, otherwise it returns `baseIteratee`.
+     * If arguments are provided, the chosen function is invoked with them and
+     * its result is returned.
+     *
+     * @private
+     * @param {*} [value] The value to convert to an iteratee.
+     * @param {number} [arity] The arity of the created iteratee.
+     * @returns {Function} Returns the chosen function or its result.
+     */
+    function getIteratee() {
+      var result = lodash.iteratee || iteratee;
+      result = result === iteratee ? baseIteratee : result;
+      return arguments.length ? result(arguments[0], arguments[1]) : result;
+    }
+
+    /**
+     * Gets the data for `map`.
+     *
+     * @private
+     * @param {Object} map The map to query.
+     * @param {string} key The reference key.
+     * @returns {*} Returns the map data.
+     */
+    function getMapData(map, key) {
+      var data = map.__data__;
+      return isKeyable(key)
+        ? data[typeof key == 'string' ? 'string' : 'hash']
+        : data.map;
+    }
+
+    /**
+     * Gets the property names, values, and compare flags of `object`.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the match data of `object`.
+     */
+    function getMatchData(object) {
+      var result = keys(object),
+          length = result.length;
+
+      while (length--) {
+        var key = result[length],
+            value = object[key];
+
+        result[length] = [key, value, isStrictComparable(value)];
+      }
+      return result;
+    }
+
+    /**
+     * Gets the native function at `key` of `object`.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @param {string} key The key of the method to get.
+     * @returns {*} Returns the function if it's native, else `undefined`.
+     */
+    function getNative(object, key) {
+      var value = getValue(object, key);
+      return baseIsNative(value) ? value : undefined;
+    }
+
+    /**
+     * A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values.
+     *
+     * @private
+     * @param {*} value The value to query.
+     * @returns {string} Returns the raw `toStringTag`.
+     */
+    function getRawTag(value) {
+      var isOwn = hasOwnProperty.call(value, symToStringTag),
+          tag = value[symToStringTag];
+
+      try {
+        value[symToStringTag] = undefined;
+        var unmasked = true;
+      } catch (e) {}
+
+      var result = nativeObjectToString.call(value);
+      if (unmasked) {
+        if (isOwn) {
+          value[symToStringTag] = tag;
+        } else {
+          delete value[symToStringTag];
+        }
+      }
+      return result;
+    }
+
+    /**
+     * Creates an array of the own enumerable symbols of `object`.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the array of symbols.
+     */
+    var getSymbols = !nativeGetSymbols ? stubArray : function(object) {
+      if (object == null) {
+        return [];
+      }
+      object = Object(object);
+      return arrayFilter(nativeGetSymbols(object), function(symbol) {
+        return propertyIsEnumerable.call(object, symbol);
+      });
+    };
+
+    /**
+     * Creates an array of the own and inherited enumerable symbols of `object`.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the array of symbols.
+     */
+    var getSymbolsIn = !nativeGetSymbols ? stubArray : function(object) {
+      var result = [];
+      while (object) {
+        arrayPush(result, getSymbols(object));
+        object = getPrototype(object);
+      }
+      return result;
+    };
+
+    /**
+     * Gets the `toStringTag` of `value`.
+     *
+     * @private
+     * @param {*} value The value to query.
+     * @returns {string} Returns the `toStringTag`.
+     */
+    var getTag = baseGetTag;
+
+    // Fallback for data views, maps, sets, and weak maps in IE 11 and promises in Node.js < 6.
+    if ((DataView && getTag(new DataView(new ArrayBuffer(1))) != dataViewTag) ||
+        (Map && getTag(new Map) != mapTag) ||
+        (Promise && getTag(Promise.resolve()) != promiseTag) ||
+        (Set && getTag(new Set) != setTag) ||
+        (WeakMap && getTag(new WeakMap) != weakMapTag)) {
+      getTag = function(value) {
+        var result = baseGetTag(value),
+            Ctor = result == objectTag ? value.constructor : undefined,
+            ctorString = Ctor ? toSource(Ctor) : '';
+
+        if (ctorString) {
+          switch (ctorString) {
+            case dataViewCtorString: return dataViewTag;
+            case mapCtorString: return mapTag;
+            case promiseCtorString: return promiseTag;
+            case setCtorString: return setTag;
+            case weakMapCtorString: return weakMapTag;
+          }
+        }
+        return result;
+      };
+    }
+
+    /**
+     * Gets the view, applying any `transforms` to the `start` and `end` positions.
+     *
+     * @private
+     * @param {number} start The start of the view.
+     * @param {number} end The end of the view.
+     * @param {Array} transforms The transformations to apply to the view.
+     * @returns {Object} Returns an object containing the `start` and `end`
+     *  positions of the view.
+     */
+    function getView(start, end, transforms) {
+      var index = -1,
+          length = transforms.length;
+
+      while (++index < length) {
+        var data = transforms[index],
+            size = data.size;
+
+        switch (data.type) {
+          case 'drop':      start += size; break;
+          case 'dropRight': end -= size; break;
+          case 'take':      end = nativeMin(end, start + size); break;
+          case 'takeRight': start = nativeMax(start, end - size); break;
+        }
+      }
+      return { 'start': start, 'end': end };
+    }
+
+    /**
+     * Extracts wrapper details from the `source` body comment.
+     *
+     * @private
+     * @param {string} source The source to inspect.
+     * @returns {Array} Returns the wrapper details.
+     */
+    function getWrapDetails(source) {
+      var match = source.match(reWrapDetails);
+      return match ? match[1].split(reSplitDetails) : [];
+    }
+
+    /**
+     * Checks if `path` exists on `object`.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @param {Array|string} path The path to check.
+     * @param {Function} hasFunc The function to check properties.
+     * @returns {boolean} Returns `true` if `path` exists, else `false`.
+     */
+    function hasPath(object, path, hasFunc) {
+      path = castPath(path, object);
+
+      var index = -1,
+          length = path.length,
+          result = false;
+
+      while (++index < length) {
+        var key = toKey(path[index]);
+        if (!(result = object != null && hasFunc(object, key))) {
+          break;
+        }
+        object = object[key];
+      }
+      if (result || ++index != length) {
+        return result;
+      }
+      length = object == null ? 0 : object.length;
+      return !!length && isLength(length) && isIndex(key, length) &&
+        (isArray(object) || isArguments(object));
+    }
+
+    /**
+     * Initializes an array clone.
+     *
+     * @private
+     * @param {Array} array The array to clone.
+     * @returns {Array} Returns the initialized clone.
+     */
+    function initCloneArray(array) {
+      var length = array.length,
+          result = new array.constructor(length);
+
+      // Add properties assigned by `RegExp#exec`.
+      if (length && typeof array[0] == 'string' && hasOwnProperty.call(array, 'index')) {
+        result.index = array.index;
+        result.input = array.input;
+      }
+      return result;
+    }
+
+    /**
+     * Initializes an object clone.
+     *
+     * @private
+     * @param {Object} object The object to clone.
+     * @returns {Object} Returns the initialized clone.
+     */
+    function initCloneObject(object) {
+      return (typeof object.constructor == 'function' && !isPrototype(object))
+        ? baseCreate(getPrototype(object))
+        : {};
+    }
+
+    /**
+     * Initializes an object clone based on its `toStringTag`.
+     *
+     * **Note:** This function only supports cloning values with tags of
+     * `Boolean`, `Date`, `Error`, `Map`, `Number`, `RegExp`, `Set`, or `String`.
+     *
+     * @private
+     * @param {Object} object The object to clone.
+     * @param {string} tag The `toStringTag` of the object to clone.
+     * @param {boolean} [isDeep] Specify a deep clone.
+     * @returns {Object} Returns the initialized clone.
+     */
+    function initCloneByTag(object, tag, isDeep) {
+      var Ctor = object.constructor;
+      switch (tag) {
+        case arrayBufferTag:
+          return cloneArrayBuffer(object);
+
+        case boolTag:
+        case dateTag:
+          return new Ctor(+object);
+
+        case dataViewTag:
+          return cloneDataView(object, isDeep);
+
+        case float32Tag: case float64Tag:
+        case int8Tag: case int16Tag: case int32Tag:
+        case uint8Tag: case uint8ClampedTag: case uint16Tag: case uint32Tag:
+          return cloneTypedArray(object, isDeep);
+
+        case mapTag:
+          return new Ctor;
+
+        case numberTag:
+        case stringTag:
+          return new Ctor(object);
+
+        case regexpTag:
+          return cloneRegExp(object);
+
+        case setTag:
+          return new Ctor;
+
+        case symbolTag:
+          return cloneSymbol(object);
+      }
+    }
+
+    /**
+     * Inserts wrapper `details` in a comment at the top of the `source` body.
+     *
+     * @private
+     * @param {string} source The source to modify.
+     * @returns {Array} details The details to insert.
+     * @returns {string} Returns the modified source.
+     */
+    function insertWrapDetails(source, details) {
+      var length = details.length;
+      if (!length) {
+        return source;
+      }
+      var lastIndex = length - 1;
+      details[lastIndex] = (length > 1 ? '& ' : '') + details[lastIndex];
+      details = details.join(length > 2 ? ', ' : ' ');
+      return source.replace(reWrapComment, '{\n/* [wrapped with ' + details + '] */\n');
+    }
+
+    /**
+     * Checks if `value` is a flattenable `arguments` object or array.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is flattenable, else `false`.
+     */
+    function isFlattenable(value) {
+      return isArray(value) || isArguments(value) ||
+        !!(spreadableSymbol && value && value[spreadableSymbol]);
+    }
+
+    /**
+     * Checks if `value` is a valid array-like index.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.
+     * @returns {boolean} Returns `true` if `value` is a valid index, else `false`.
+     */
+    function isIndex(value, length) {
+      var type = typeof value;
+      length = length == null ? MAX_SAFE_INTEGER : length;
+
+      return !!length &&
+        (type == 'number' ||
+          (type != 'symbol' && reIsUint.test(value))) &&
+            (value > -1 && value % 1 == 0 && value < length);
+    }
+
+    /**
+     * Checks if the given arguments are from an iteratee call.
+     *
+     * @private
+     * @param {*} value The potential iteratee value argument.
+     * @param {*} index The potential iteratee index or key argument.
+     * @param {*} object The potential iteratee object argument.
+     * @returns {boolean} Returns `true` if the arguments are from an iteratee call,
+     *  else `false`.
+     */
+    function isIterateeCall(value, index, object) {
+      if (!isObject(object)) {
+        return false;
+      }
+      var type = typeof index;
+      if (type == 'number'
+            ? (isArrayLike(object) && isIndex(index, object.length))
+            : (type == 'string' && index in object)
+          ) {
+        return eq(object[index], value);
+      }
+      return false;
+    }
+
+    /**
+     * Checks if `value` is a property name and not a property path.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @param {Object} [object] The object to query keys on.
+     * @returns {boolean} Returns `true` if `value` is a property name, else `false`.
+     */
+    function isKey(value, object) {
+      if (isArray(value)) {
+        return false;
+      }
+      var type = typeof value;
+      if (type == 'number' || type == 'symbol' || type == 'boolean' ||
+          value == null || isSymbol(value)) {
+        return true;
+      }
+      return reIsPlainProp.test(value) || !reIsDeepProp.test(value) ||
+        (object != null && value in Object(object));
+    }
+
+    /**
+     * Checks if `value` is suitable for use as unique object key.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is suitable, else `false`.
+     */
+    function isKeyable(value) {
+      var type = typeof value;
+      return (type == 'string' || type == 'number' || type == 'symbol' || type == 'boolean')
+        ? (value !== '__proto__')
+        : (value === null);
+    }
+
+    /**
+     * Checks if `func` has a lazy counterpart.
+     *
+     * @private
+     * @param {Function} func The function to check.
+     * @returns {boolean} Returns `true` if `func` has a lazy counterpart,
+     *  else `false`.
+     */
+    function isLaziable(func) {
+      var funcName = getFuncName(func),
+          other = lodash[funcName];
+
+      if (typeof other != 'function' || !(funcName in LazyWrapper.prototype)) {
+        return false;
+      }
+      if (func === other) {
+        return true;
+      }
+      var data = getData(other);
+      return !!data && func === data[0];
+    }
+
+    /**
+     * Checks if `func` has its source masked.
+     *
+     * @private
+     * @param {Function} func The function to check.
+     * @returns {boolean} Returns `true` if `func` is masked, else `false`.
+     */
+    function isMasked(func) {
+      return !!maskSrcKey && (maskSrcKey in func);
+    }
+
+    /**
+     * Checks if `func` is capable of being masked.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `func` is maskable, else `false`.
+     */
+    var isMaskable = coreJsData ? isFunction : stubFalse;
+
+    /**
+     * Checks if `value` is likely a prototype object.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a prototype, else `false`.
+     */
+    function isPrototype(value) {
+      var Ctor = value && value.constructor,
+          proto = (typeof Ctor == 'function' && Ctor.prototype) || objectProto;
+
+      return value === proto;
+    }
+
+    /**
+     * Checks if `value` is suitable for strict equality comparisons, i.e. `===`.
+     *
+     * @private
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` if suitable for strict
+     *  equality comparisons, else `false`.
+     */
+    function isStrictComparable(value) {
+      return value === value && !isObject(value);
+    }
+
+    /**
+     * A specialized version of `matchesProperty` for source values suitable
+     * for strict equality comparisons, i.e. `===`.
+     *
+     * @private
+     * @param {string} key The key of the property to get.
+     * @param {*} srcValue The value to match.
+     * @returns {Function} Returns the new spec function.
+     */
+    function matchesStrictComparable(key, srcValue) {
+      return function(object) {
+        if (object == null) {
+          return false;
+        }
+        return object[key] === srcValue &&
+          (srcValue !== undefined || (key in Object(object)));
+      };
+    }
+
+    /**
+     * A specialized version of `_.memoize` which clears the memoized function's
+     * cache when it exceeds `MAX_MEMOIZE_SIZE`.
+     *
+     * @private
+     * @param {Function} func The function to have its output memoized.
+     * @returns {Function} Returns the new memoized function.
+     */
+    function memoizeCapped(func) {
+      var result = memoize(func, function(key) {
+        if (cache.size === MAX_MEMOIZE_SIZE) {
+          cache.clear();
+        }
+        return key;
+      });
+
+      var cache = result.cache;
+      return result;
+    }
+
+    /**
+     * Merges the function metadata of `source` into `data`.
+     *
+     * Merging metadata reduces the number of wrappers used to invoke a function.
+     * This is possible because methods like `_.bind`, `_.curry`, and `_.partial`
+     * may be applied regardless of execution order. Methods like `_.ary` and
+     * `_.rearg` modify function arguments, making the order in which they are
+     * executed important, preventing the merging of metadata. However, we make
+     * an exception for a safe combined case where curried functions have `_.ary`
+     * and or `_.rearg` applied.
+     *
+     * @private
+     * @param {Array} data The destination metadata.
+     * @param {Array} source The source metadata.
+     * @returns {Array} Returns `data`.
+     */
+    function mergeData(data, source) {
+      var bitmask = data[1],
+          srcBitmask = source[1],
+          newBitmask = bitmask | srcBitmask,
+          isCommon = newBitmask < (WRAP_BIND_FLAG | WRAP_BIND_KEY_FLAG | WRAP_ARY_FLAG);
+
+      var isCombo =
+        ((srcBitmask == WRAP_ARY_FLAG) && (bitmask == WRAP_CURRY_FLAG)) ||
+        ((srcBitmask == WRAP_ARY_FLAG) && (bitmask == WRAP_REARG_FLAG) && (data[7].length <= source[8])) ||
+        ((srcBitmask == (WRAP_ARY_FLAG | WRAP_REARG_FLAG)) && (source[7].length <= source[8]) && (bitmask == WRAP_CURRY_FLAG));
+
+      // Exit early if metadata can't be merged.
+      if (!(isCommon || isCombo)) {
+        return data;
+      }
+      // Use source `thisArg` if available.
+      if (srcBitmask & WRAP_BIND_FLAG) {
+        data[2] = source[2];
+        // Set when currying a bound function.
+        newBitmask |= bitmask & WRAP_BIND_FLAG ? 0 : WRAP_CURRY_BOUND_FLAG;
+      }
+      // Compose partial arguments.
+      var value = source[3];
+      if (value) {
+        var partials = data[3];
+        data[3] = partials ? composeArgs(partials, value, source[4]) : value;
+        data[4] = partials ? replaceHolders(data[3], PLACEHOLDER) : source[4];
+      }
+      // Compose partial right arguments.
+      value = source[5];
+      if (value) {
+        partials = data[5];
+        data[5] = partials ? composeArgsRight(partials, value, source[6]) : value;
+        data[6] = partials ? replaceHolders(data[5], PLACEHOLDER) : source[6];
+      }
+      // Use source `argPos` if available.
+      value = source[7];
+      if (value) {
+        data[7] = value;
+      }
+      // Use source `ary` if it's smaller.
+      if (srcBitmask & WRAP_ARY_FLAG) {
+        data[8] = data[8] == null ? source[8] : nativeMin(data[8], source[8]);
+      }
+      // Use source `arity` if one is not provided.
+      if (data[9] == null) {
+        data[9] = source[9];
+      }
+      // Use source `func` and merge bitmasks.
+      data[0] = source[0];
+      data[1] = newBitmask;
+
+      return data;
+    }
+
+    /**
+     * This function is like
+     * [`Object.keys`](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)
+     * except that it includes inherited enumerable properties.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the array of property names.
+     */
+    function nativeKeysIn(object) {
+      var result = [];
+      if (object != null) {
+        for (var key in Object(object)) {
+          result.push(key);
+        }
+      }
+      return result;
+    }
+
+    /**
+     * Converts `value` to a string using `Object.prototype.toString`.
+     *
+     * @private
+     * @param {*} value The value to convert.
+     * @returns {string} Returns the converted string.
+     */
+    function objectToString(value) {
+      return nativeObjectToString.call(value);
+    }
+
+    /**
+     * A specialized version of `baseRest` which transforms the rest array.
+     *
+     * @private
+     * @param {Function} func The function to apply a rest parameter to.
+     * @param {number} [start=func.length-1] The start position of the rest parameter.
+     * @param {Function} transform The rest array transform.
+     * @returns {Function} Returns the new function.
+     */
+    function overRest(func, start, transform) {
+      start = nativeMax(start === undefined ? (func.length - 1) : start, 0);
+      return function() {
+        var args = arguments,
+            index = -1,
+            length = nativeMax(args.length - start, 0),
+            array = Array(length);
+
+        while (++index < length) {
+          array[index] = args[start + index];
+        }
+        index = -1;
+        var otherArgs = Array(start + 1);
+        while (++index < start) {
+          otherArgs[index] = args[index];
+        }
+        otherArgs[start] = transform(array);
+        return apply(func, this, otherArgs);
+      };
+    }
+
+    /**
+     * Gets the parent value at `path` of `object`.
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @param {Array} path The path to get the parent value of.
+     * @returns {*} Returns the parent value.
+     */
+    function parent(object, path) {
+      return path.length < 2 ? object : baseGet(object, baseSlice(path, 0, -1));
+    }
+
+    /**
+     * Reorder `array` according to the specified indexes where the element at
+     * the first index is assigned as the first element, the element at
+     * the second index is assigned as the second element, and so on.
+     *
+     * @private
+     * @param {Array} array The array to reorder.
+     * @param {Array} indexes The arranged array indexes.
+     * @returns {Array} Returns `array`.
+     */
+    function reorder(array, indexes) {
+      var arrLength = array.length,
+          length = nativeMin(indexes.length, arrLength),
+          oldArray = copyArray(array);
+
+      while (length--) {
+        var index = indexes[length];
+        array[length] = isIndex(index, arrLength) ? oldArray[index] : undefined;
+      }
+      return array;
+    }
+
+    /**
+     * Gets the value at `key`, unless `key` is "__proto__" or "constructor".
+     *
+     * @private
+     * @param {Object} object The object to query.
+     * @param {string} key The key of the property to get.
+     * @returns {*} Returns the property value.
+     */
+    function safeGet(object, key) {
+      if (key === 'constructor' && typeof object[key] === 'function') {
+        return;
+      }
+
+      if (key == '__proto__') {
+        return;
+      }
+
+      return object[key];
+    }
+
+    /**
+     * Sets metadata for `func`.
+     *
+     * **Note:** If this function becomes hot, i.e. is invoked a lot in a short
+     * period of time, it will trip its breaker and transition to an identity
+     * function to avoid garbage collection pauses in V8. See
+     * [V8 issue 2070](https://bugs.chromium.org/p/v8/issues/detail?id=2070)
+     * for more details.
+     *
+     * @private
+     * @param {Function} func The function to associate metadata with.
+     * @param {*} data The metadata.
+     * @returns {Function} Returns `func`.
+     */
+    var setData = shortOut(baseSetData);
+
+    /**
+     * A simple wrapper around the global [`setTimeout`](https://mdn.io/setTimeout).
+     *
+     * @private
+     * @param {Function} func The function to delay.
+     * @param {number} wait The number of milliseconds to delay invocation.
+     * @returns {number|Object} Returns the timer id or timeout object.
+     */
+    var setTimeout = ctxSetTimeout || function(func, wait) {
+      return root.setTimeout(func, wait);
+    };
+
+    /**
+     * Sets the `toString` method of `func` to return `string`.
+     *
+     * @private
+     * @param {Function} func The function to modify.
+     * @param {Function} string The `toString` result.
+     * @returns {Function} Returns `func`.
+     */
+    var setToString = shortOut(baseSetToString);
+
+    /**
+     * Sets the `toString` method of `wrapper` to mimic the source of `reference`
+     * with wrapper details in a comment at the top of the source body.
+     *
+     * @private
+     * @param {Function} wrapper The function to modify.
+     * @param {Function} reference The reference function.
+     * @param {number} bitmask The bitmask flags. See `createWrap` for more details.
+     * @returns {Function} Returns `wrapper`.
+     */
+    function setWrapToString(wrapper, reference, bitmask) {
+      var source = (reference + '');
+      return setToString(wrapper, insertWrapDetails(source, updateWrapDetails(getWrapDetails(source), bitmask)));
+    }
+
+    /**
+     * Creates a function that'll short out and invoke `identity` instead
+     * of `func` when it's called `HOT_COUNT` or more times in `HOT_SPAN`
+     * milliseconds.
+     *
+     * @private
+     * @param {Function} func The function to restrict.
+     * @returns {Function} Returns the new shortable function.
+     */
+    function shortOut(func) {
+      var count = 0,
+          lastCalled = 0;
+
+      return function() {
+        var stamp = nativeNow(),
+            remaining = HOT_SPAN - (stamp - lastCalled);
+
+        lastCalled = stamp;
+        if (remaining > 0) {
+          if (++count >= HOT_COUNT) {
+            return arguments[0];
+          }
+        } else {
+          count = 0;
+        }
+        return func.apply(undefined, arguments);
+      };
+    }
+
+    /**
+     * A specialized version of `_.shuffle` which mutates and sets the size of `array`.
+     *
+     * @private
+     * @param {Array} array The array to shuffle.
+     * @param {number} [size=array.length] The size of `array`.
+     * @returns {Array} Returns `array`.
+     */
+    function shuffleSelf(array, size) {
+      var index = -1,
+          length = array.length,
+          lastIndex = length - 1;
+
+      size = size === undefined ? length : size;
+      while (++index < size) {
+        var rand = baseRandom(index, lastIndex),
+            value = array[rand];
+
+        array[rand] = array[index];
+        array[index] = value;
+      }
+      array.length = size;
+      return array;
+    }
+
+    /**
+     * Converts `string` to a property path array.
+     *
+     * @private
+     * @param {string} string The string to convert.
+     * @returns {Array} Returns the property path array.
+     */
+    var stringToPath = memoizeCapped(function(string) {
+      var result = [];
+      if (string.charCodeAt(0) === 46 /* . */) {
+        result.push('');
+      }
+      string.replace(rePropName, function(match, number, quote, subString) {
+        result.push(quote ? subString.replace(reEscapeChar, '$1') : (number || match));
+      });
+      return result;
+    });
+
+    /**
+     * Converts `value` to a string key if it's not a string or symbol.
+     *
+     * @private
+     * @param {*} value The value to inspect.
+     * @returns {string|symbol} Returns the key.
+     */
+    function toKey(value) {
+      if (typeof value == 'string' || isSymbol(value)) {
+        return value;
+      }
+      var result = (value + '');
+      return (result == '0' && (1 / value) == -INFINITY) ? '-0' : result;
+    }
+
+    /**
+     * Converts `func` to its source code.
+     *
+     * @private
+     * @param {Function} func The function to convert.
+     * @returns {string} Returns the source code.
+     */
+    function toSource(func) {
+      if (func != null) {
+        try {
+          return funcToString.call(func);
+        } catch (e) {}
+        try {
+          return (func + '');
+        } catch (e) {}
+      }
+      return '';
+    }
+
+    /**
+     * Updates wrapper `details` based on `bitmask` flags.
+     *
+     * @private
+     * @returns {Array} details The details to modify.
+     * @param {number} bitmask The bitmask flags. See `createWrap` for more details.
+     * @returns {Array} Returns `details`.
+     */
+    function updateWrapDetails(details, bitmask) {
+      arrayEach(wrapFlags, function(pair) {
+        var value = '_.' + pair[0];
+        if ((bitmask & pair[1]) && !arrayIncludes(details, value)) {
+          details.push(value);
+        }
+      });
+      return details.sort();
+    }
+
+    /**
+     * Creates a clone of `wrapper`.
+     *
+     * @private
+     * @param {Object} wrapper The wrapper to clone.
+     * @returns {Object} Returns the cloned wrapper.
+     */
+    function wrapperClone(wrapper) {
+      if (wrapper instanceof LazyWrapper) {
+        return wrapper.clone();
+      }
+      var result = new LodashWrapper(wrapper.__wrapped__, wrapper.__chain__);
+      result.__actions__ = copyArray(wrapper.__actions__);
+      result.__index__  = wrapper.__index__;
+      result.__values__ = wrapper.__values__;
+      return result;
+    }
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Creates an array of elements split into groups the length of `size`.
+     * If `array` can't be split evenly, the final chunk will be the remaining
+     * elements.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Array
+     * @param {Array} array The array to process.
+     * @param {number} [size=1] The length of each chunk
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {Array} Returns the new array of chunks.
+     * @example
+     *
+     * _.chunk(['a', 'b', 'c', 'd'], 2);
+     * // => [['a', 'b'], ['c', 'd']]
+     *
+     * _.chunk(['a', 'b', 'c', 'd'], 3);
+     * // => [['a', 'b', 'c'], ['d']]
+     */
+    function chunk(array, size, guard) {
+      if ((guard ? isIterateeCall(array, size, guard) : size === undefined)) {
+        size = 1;
+      } else {
+        size = nativeMax(toInteger(size), 0);
+      }
+      var length = array == null ? 0 : array.length;
+      if (!length || size < 1) {
+        return [];
+      }
+      var index = 0,
+          resIndex = 0,
+          result = Array(nativeCeil(length / size));
+
+      while (index < length) {
+        result[resIndex++] = baseSlice(array, index, (index += size));
+      }
+      return result;
+    }
+
+    /**
+     * Creates an array with all falsey values removed. The values `false`, `null`,
+     * `0`, `""`, `undefined`, and `NaN` are falsey.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {Array} array The array to compact.
+     * @returns {Array} Returns the new array of filtered values.
+     * @example
+     *
+     * _.compact([0, 1, false, 2, '', 3]);
+     * // => [1, 2, 3]
+     */
+    function compact(array) {
+      var index = -1,
+          length = array == null ? 0 : array.length,
+          resIndex = 0,
+          result = [];
+
+      while (++index < length) {
+        var value = array[index];
+        if (value) {
+          result[resIndex++] = value;
+        }
+      }
+      return result;
+    }
+
+    /**
+     * Creates a new array concatenating `array` with any additional arrays
+     * and/or values.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to concatenate.
+     * @param {...*} [values] The values to concatenate.
+     * @returns {Array} Returns the new concatenated array.
+     * @example
+     *
+     * var array = [1];
+     * var other = _.concat(array, 2, [3], [[4]]);
+     *
+     * console.log(other);
+     * // => [1, 2, 3, [4]]
+     *
+     * console.log(array);
+     * // => [1]
+     */
+    function concat() {
+      var length = arguments.length;
+      if (!length) {
+        return [];
+      }
+      var args = Array(length - 1),
+          array = arguments[0],
+          index = length;
+
+      while (index--) {
+        args[index - 1] = arguments[index];
+      }
+      return arrayPush(isArray(array) ? copyArray(array) : [array], baseFlatten(args, 1));
+    }
+
+    /**
+     * Creates an array of `array` values not included in the other given arrays
+     * using [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+     * for equality comparisons. The order and references of result values are
+     * determined by the first array.
+     *
+     * **Note:** Unlike `_.pullAll`, this method returns a new array.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {...Array} [values] The values to exclude.
+     * @returns {Array} Returns the new array of filtered values.
+     * @see _.without, _.xor
+     * @example
+     *
+     * _.difference([2, 1], [2, 3]);
+     * // => [1]
+     */
+    var difference = baseRest(function(array, values) {
+      return isArrayLikeObject(array)
+        ? baseDifference(array, baseFlatten(values, 1, isArrayLikeObject, true))
+        : [];
+    });
+
+    /**
+     * This method is like `_.difference` except that it accepts `iteratee` which
+     * is invoked for each element of `array` and `values` to generate the criterion
+     * by which they're compared. The order and references of result values are
+     * determined by the first array. The iteratee is invoked with one argument:
+     * (value).
+     *
+     * **Note:** Unlike `_.pullAllBy`, this method returns a new array.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {...Array} [values] The values to exclude.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {Array} Returns the new array of filtered values.
+     * @example
+     *
+     * _.differenceBy([2.1, 1.2], [2.3, 3.4], Math.floor);
+     * // => [1.2]
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.differenceBy([{ 'x': 2 }, { 'x': 1 }], [{ 'x': 1 }], 'x');
+     * // => [{ 'x': 2 }]
+     */
+    var differenceBy = baseRest(function(array, values) {
+      var iteratee = last(values);
+      if (isArrayLikeObject(iteratee)) {
+        iteratee = undefined;
+      }
+      return isArrayLikeObject(array)
+        ? baseDifference(array, baseFlatten(values, 1, isArrayLikeObject, true), getIteratee(iteratee, 2))
+        : [];
+    });
+
+    /**
+     * This method is like `_.difference` except that it accepts `comparator`
+     * which is invoked to compare elements of `array` to `values`. The order and
+     * references of result values are determined by the first array. The comparator
+     * is invoked with two arguments: (arrVal, othVal).
+     *
+     * **Note:** Unlike `_.pullAllWith`, this method returns a new array.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {...Array} [values] The values to exclude.
+     * @param {Function} [comparator] The comparator invoked per element.
+     * @returns {Array} Returns the new array of filtered values.
+     * @example
+     *
+     * var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }];
+     *
+     * _.differenceWith(objects, [{ 'x': 1, 'y': 2 }], _.isEqual);
+     * // => [{ 'x': 2, 'y': 1 }]
+     */
+    var differenceWith = baseRest(function(array, values) {
+      var comparator = last(values);
+      if (isArrayLikeObject(comparator)) {
+        comparator = undefined;
+      }
+      return isArrayLikeObject(array)
+        ? baseDifference(array, baseFlatten(values, 1, isArrayLikeObject, true), undefined, comparator)
+        : [];
+    });
+
+    /**
+     * Creates a slice of `array` with `n` elements dropped from the beginning.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.5.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @param {number} [n=1] The number of elements to drop.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {Array} Returns the slice of `array`.
+     * @example
+     *
+     * _.drop([1, 2, 3]);
+     * // => [2, 3]
+     *
+     * _.drop([1, 2, 3], 2);
+     * // => [3]
+     *
+     * _.drop([1, 2, 3], 5);
+     * // => []
+     *
+     * _.drop([1, 2, 3], 0);
+     * // => [1, 2, 3]
+     */
+    function drop(array, n, guard) {
+      var length = array == null ? 0 : array.length;
+      if (!length) {
+        return [];
+      }
+      n = (guard || n === undefined) ? 1 : toInteger(n);
+      return baseSlice(array, n < 0 ? 0 : n, length);
+    }
+
+    /**
+     * Creates a slice of `array` with `n` elements dropped from the end.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @param {number} [n=1] The number of elements to drop.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {Array} Returns the slice of `array`.
+     * @example
+     *
+     * _.dropRight([1, 2, 3]);
+     * // => [1, 2]
+     *
+     * _.dropRight([1, 2, 3], 2);
+     * // => [1]
+     *
+     * _.dropRight([1, 2, 3], 5);
+     * // => []
+     *
+     * _.dropRight([1, 2, 3], 0);
+     * // => [1, 2, 3]
+     */
+    function dropRight(array, n, guard) {
+      var length = array == null ? 0 : array.length;
+      if (!length) {
+        return [];
+      }
+      n = (guard || n === undefined) ? 1 : toInteger(n);
+      n = length - n;
+      return baseSlice(array, 0, n < 0 ? 0 : n);
+    }
+
+    /**
+     * Creates a slice of `array` excluding elements dropped from the end.
+     * Elements are dropped until `predicate` returns falsey. The predicate is
+     * invoked with three arguments: (value, index, array).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the slice of `array`.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney',  'active': true },
+     *   { 'user': 'fred',    'active': false },
+     *   { 'user': 'pebbles', 'active': false }
+     * ];
+     *
+     * _.dropRightWhile(users, function(o) { return !o.active; });
+     * // => objects for ['barney']
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.dropRightWhile(users, { 'user': 'pebbles', 'active': false });
+     * // => objects for ['barney', 'fred']
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.dropRightWhile(users, ['active', false]);
+     * // => objects for ['barney']
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.dropRightWhile(users, 'active');
+     * // => objects for ['barney', 'fred', 'pebbles']
+     */
+    function dropRightWhile(array, predicate) {
+      return (array && array.length)
+        ? baseWhile(array, getIteratee(predicate, 3), true, true)
+        : [];
+    }
+
+    /**
+     * Creates a slice of `array` excluding elements dropped from the beginning.
+     * Elements are dropped until `predicate` returns falsey. The predicate is
+     * invoked with three arguments: (value, index, array).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the slice of `array`.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney',  'active': false },
+     *   { 'user': 'fred',    'active': false },
+     *   { 'user': 'pebbles', 'active': true }
+     * ];
+     *
+     * _.dropWhile(users, function(o) { return !o.active; });
+     * // => objects for ['pebbles']
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.dropWhile(users, { 'user': 'barney', 'active': false });
+     * // => objects for ['fred', 'pebbles']
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.dropWhile(users, ['active', false]);
+     * // => objects for ['pebbles']
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.dropWhile(users, 'active');
+     * // => objects for ['barney', 'fred', 'pebbles']
+     */
+    function dropWhile(array, predicate) {
+      return (array && array.length)
+        ? baseWhile(array, getIteratee(predicate, 3), true)
+        : [];
+    }
+
+    /**
+     * Fills elements of `array` with `value` from `start` up to, but not
+     * including, `end`.
+     *
+     * **Note:** This method mutates `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.2.0
+     * @category Array
+     * @param {Array} array The array to fill.
+     * @param {*} value The value to fill `array` with.
+     * @param {number} [start=0] The start position.
+     * @param {number} [end=array.length] The end position.
+     * @returns {Array} Returns `array`.
+     * @example
+     *
+     * var array = [1, 2, 3];
+     *
+     * _.fill(array, 'a');
+     * console.log(array);
+     * // => ['a', 'a', 'a']
+     *
+     * _.fill(Array(3), 2);
+     * // => [2, 2, 2]
+     *
+     * _.fill([4, 6, 8, 10], '*', 1, 3);
+     * // => [4, '*', '*', 10]
+     */
+    function fill(array, value, start, end) {
+      var length = array == null ? 0 : array.length;
+      if (!length) {
+        return [];
+      }
+      if (start && typeof start != 'number' && isIterateeCall(array, value, start)) {
+        start = 0;
+        end = length;
+      }
+      return baseFill(array, value, start, end);
+    }
+
+    /**
+     * This method is like `_.find` except that it returns the index of the first
+     * element `predicate` returns truthy for instead of the element itself.
+     *
+     * @static
+     * @memberOf _
+     * @since 1.1.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @param {number} [fromIndex=0] The index to search from.
+     * @returns {number} Returns the index of the found element, else `-1`.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney',  'active': false },
+     *   { 'user': 'fred',    'active': false },
+     *   { 'user': 'pebbles', 'active': true }
+     * ];
+     *
+     * _.findIndex(users, function(o) { return o.user == 'barney'; });
+     * // => 0
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.findIndex(users, { 'user': 'fred', 'active': false });
+     * // => 1
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.findIndex(users, ['active', false]);
+     * // => 0
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.findIndex(users, 'active');
+     * // => 2
+     */
+    function findIndex(array, predicate, fromIndex) {
+      var length = array == null ? 0 : array.length;
+      if (!length) {
+        return -1;
+      }
+      var index = fromIndex == null ? 0 : toInteger(fromIndex);
+      if (index < 0) {
+        index = nativeMax(length + index, 0);
+      }
+      return baseFindIndex(array, getIteratee(predicate, 3), index);
+    }
+
+    /**
+     * This method is like `_.findIndex` except that it iterates over elements
+     * of `collection` from right to left.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.0.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @param {number} [fromIndex=array.length-1] The index to search from.
+     * @returns {number} Returns the index of the found element, else `-1`.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney',  'active': true },
+     *   { 'user': 'fred',    'active': false },
+     *   { 'user': 'pebbles', 'active': false }
+     * ];
+     *
+     * _.findLastIndex(users, function(o) { return o.user == 'pebbles'; });
+     * // => 2
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.findLastIndex(users, { 'user': 'barney', 'active': true });
+     * // => 0
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.findLastIndex(users, ['active', false]);
+     * // => 2
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.findLastIndex(users, 'active');
+     * // => 0
+     */
+    function findLastIndex(array, predicate, fromIndex) {
+      var length = array == null ? 0 : array.length;
+      if (!length) {
+        return -1;
+      }
+      var index = length - 1;
+      if (fromIndex !== undefined) {
+        index = toInteger(fromIndex);
+        index = fromIndex < 0
+          ? nativeMax(length + index, 0)
+          : nativeMin(index, length - 1);
+      }
+      return baseFindIndex(array, getIteratee(predicate, 3), index, true);
+    }
+
+    /**
+     * Flattens `array` a single level deep.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {Array} array The array to flatten.
+     * @returns {Array} Returns the new flattened array.
+     * @example
+     *
+     * _.flatten([1, [2, [3, [4]], 5]]);
+     * // => [1, 2, [3, [4]], 5]
+     */
+    function flatten(array) {
+      var length = array == null ? 0 : array.length;
+      return length ? baseFlatten(array, 1) : [];
+    }
+
+    /**
+     * Recursively flattens `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Array
+     * @param {Array} array The array to flatten.
+     * @returns {Array} Returns the new flattened array.
+     * @example
+     *
+     * _.flattenDeep([1, [2, [3, [4]], 5]]);
+     * // => [1, 2, 3, 4, 5]
+     */
+    function flattenDeep(array) {
+      var length = array == null ? 0 : array.length;
+      return length ? baseFlatten(array, INFINITY) : [];
+    }
+
+    /**
+     * Recursively flatten `array` up to `depth` times.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.4.0
+     * @category Array
+     * @param {Array} array The array to flatten.
+     * @param {number} [depth=1] The maximum recursion depth.
+     * @returns {Array} Returns the new flattened array.
+     * @example
+     *
+     * var array = [1, [2, [3, [4]], 5]];
+     *
+     * _.flattenDepth(array, 1);
+     * // => [1, 2, [3, [4]], 5]
+     *
+     * _.flattenDepth(array, 2);
+     * // => [1, 2, 3, [4], 5]
+     */
+    function flattenDepth(array, depth) {
+      var length = array == null ? 0 : array.length;
+      if (!length) {
+        return [];
+      }
+      depth = depth === undefined ? 1 : toInteger(depth);
+      return baseFlatten(array, depth);
+    }
+
+    /**
+     * The inverse of `_.toPairs`; this method returns an object composed
+     * from key-value `pairs`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} pairs The key-value pairs.
+     * @returns {Object} Returns the new object.
+     * @example
+     *
+     * _.fromPairs([['a', 1], ['b', 2]]);
+     * // => { 'a': 1, 'b': 2 }
+     */
+    function fromPairs(pairs) {
+      var index = -1,
+          length = pairs == null ? 0 : pairs.length,
+          result = {};
+
+      while (++index < length) {
+        var pair = pairs[index];
+        result[pair[0]] = pair[1];
+      }
+      return result;
+    }
+
+    /**
+     * Gets the first element of `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @alias first
+     * @category Array
+     * @param {Array} array The array to query.
+     * @returns {*} Returns the first element of `array`.
+     * @example
+     *
+     * _.head([1, 2, 3]);
+     * // => 1
+     *
+     * _.head([]);
+     * // => undefined
+     */
+    function head(array) {
+      return (array && array.length) ? array[0] : undefined;
+    }
+
+    /**
+     * Gets the index at which the first occurrence of `value` is found in `array`
+     * using [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+     * for equality comparisons. If `fromIndex` is negative, it's used as the
+     * offset from the end of `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {*} value The value to search for.
+     * @param {number} [fromIndex=0] The index to search from.
+     * @returns {number} Returns the index of the matched value, else `-1`.
+     * @example
+     *
+     * _.indexOf([1, 2, 1, 2], 2);
+     * // => 1
+     *
+     * // Search from the `fromIndex`.
+     * _.indexOf([1, 2, 1, 2], 2, 2);
+     * // => 3
+     */
+    function indexOf(array, value, fromIndex) {
+      var length = array == null ? 0 : array.length;
+      if (!length) {
+        return -1;
+      }
+      var index = fromIndex == null ? 0 : toInteger(fromIndex);
+      if (index < 0) {
+        index = nativeMax(length + index, 0);
+      }
+      return baseIndexOf(array, value, index);
+    }
+
+    /**
+     * Gets all but the last element of `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @returns {Array} Returns the slice of `array`.
+     * @example
+     *
+     * _.initial([1, 2, 3]);
+     * // => [1, 2]
+     */
+    function initial(array) {
+      var length = array == null ? 0 : array.length;
+      return length ? baseSlice(array, 0, -1) : [];
+    }
+
+    /**
+     * Creates an array of unique values that are included in all given arrays
+     * using [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+     * for equality comparisons. The order and references of result values are
+     * determined by the first array.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {...Array} [arrays] The arrays to inspect.
+     * @returns {Array} Returns the new array of intersecting values.
+     * @example
+     *
+     * _.intersection([2, 1], [2, 3]);
+     * // => [2]
+     */
+    var intersection = baseRest(function(arrays) {
+      var mapped = arrayMap(arrays, castArrayLikeObject);
+      return (mapped.length && mapped[0] === arrays[0])
+        ? baseIntersection(mapped)
+        : [];
+    });
+
+    /**
+     * This method is like `_.intersection` except that it accepts `iteratee`
+     * which is invoked for each element of each `arrays` to generate the criterion
+     * by which they're compared. The order and references of result values are
+     * determined by the first array. The iteratee is invoked with one argument:
+     * (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {...Array} [arrays] The arrays to inspect.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {Array} Returns the new array of intersecting values.
+     * @example
+     *
+     * _.intersectionBy([2.1, 1.2], [2.3, 3.4], Math.floor);
+     * // => [2.1]
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.intersectionBy([{ 'x': 1 }], [{ 'x': 2 }, { 'x': 1 }], 'x');
+     * // => [{ 'x': 1 }]
+     */
+    var intersectionBy = baseRest(function(arrays) {
+      var iteratee = last(arrays),
+          mapped = arrayMap(arrays, castArrayLikeObject);
+
+      if (iteratee === last(mapped)) {
+        iteratee = undefined;
+      } else {
+        mapped.pop();
+      }
+      return (mapped.length && mapped[0] === arrays[0])
+        ? baseIntersection(mapped, getIteratee(iteratee, 2))
+        : [];
+    });
+
+    /**
+     * This method is like `_.intersection` except that it accepts `comparator`
+     * which is invoked to compare elements of `arrays`. The order and references
+     * of result values are determined by the first array. The comparator is
+     * invoked with two arguments: (arrVal, othVal).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {...Array} [arrays] The arrays to inspect.
+     * @param {Function} [comparator] The comparator invoked per element.
+     * @returns {Array} Returns the new array of intersecting values.
+     * @example
+     *
+     * var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }];
+     * var others = [{ 'x': 1, 'y': 1 }, { 'x': 1, 'y': 2 }];
+     *
+     * _.intersectionWith(objects, others, _.isEqual);
+     * // => [{ 'x': 1, 'y': 2 }]
+     */
+    var intersectionWith = baseRest(function(arrays) {
+      var comparator = last(arrays),
+          mapped = arrayMap(arrays, castArrayLikeObject);
+
+      comparator = typeof comparator == 'function' ? comparator : undefined;
+      if (comparator) {
+        mapped.pop();
+      }
+      return (mapped.length && mapped[0] === arrays[0])
+        ? baseIntersection(mapped, undefined, comparator)
+        : [];
+    });
+
+    /**
+     * Converts all elements in `array` into a string separated by `separator`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to convert.
+     * @param {string} [separator=','] The element separator.
+     * @returns {string} Returns the joined string.
+     * @example
+     *
+     * _.join(['a', 'b', 'c'], '~');
+     * // => 'a~b~c'
+     */
+    function join(array, separator) {
+      return array == null ? '' : nativeJoin.call(array, separator);
+    }
+
+    /**
+     * Gets the last element of `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @returns {*} Returns the last element of `array`.
+     * @example
+     *
+     * _.last([1, 2, 3]);
+     * // => 3
+     */
+    function last(array) {
+      var length = array == null ? 0 : array.length;
+      return length ? array[length - 1] : undefined;
+    }
+
+    /**
+     * This method is like `_.indexOf` except that it iterates over elements of
+     * `array` from right to left.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {*} value The value to search for.
+     * @param {number} [fromIndex=array.length-1] The index to search from.
+     * @returns {number} Returns the index of the matched value, else `-1`.
+     * @example
+     *
+     * _.lastIndexOf([1, 2, 1, 2], 2);
+     * // => 3
+     *
+     * // Search from the `fromIndex`.
+     * _.lastIndexOf([1, 2, 1, 2], 2, 2);
+     * // => 1
+     */
+    function lastIndexOf(array, value, fromIndex) {
+      var length = array == null ? 0 : array.length;
+      if (!length) {
+        return -1;
+      }
+      var index = length;
+      if (fromIndex !== undefined) {
+        index = toInteger(fromIndex);
+        index = index < 0 ? nativeMax(length + index, 0) : nativeMin(index, length - 1);
+      }
+      return value === value
+        ? strictLastIndexOf(array, value, index)
+        : baseFindIndex(array, baseIsNaN, index, true);
+    }
+
+    /**
+     * Gets the element at index `n` of `array`. If `n` is negative, the nth
+     * element from the end is returned.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.11.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @param {number} [n=0] The index of the element to return.
+     * @returns {*} Returns the nth element of `array`.
+     * @example
+     *
+     * var array = ['a', 'b', 'c', 'd'];
+     *
+     * _.nth(array, 1);
+     * // => 'b'
+     *
+     * _.nth(array, -2);
+     * // => 'c';
+     */
+    function nth(array, n) {
+      return (array && array.length) ? baseNth(array, toInteger(n)) : undefined;
+    }
+
+    /**
+     * Removes all given values from `array` using
+     * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+     * for equality comparisons.
+     *
+     * **Note:** Unlike `_.without`, this method mutates `array`. Use `_.remove`
+     * to remove elements from an array by predicate.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.0.0
+     * @category Array
+     * @param {Array} array The array to modify.
+     * @param {...*} [values] The values to remove.
+     * @returns {Array} Returns `array`.
+     * @example
+     *
+     * var array = ['a', 'b', 'c', 'a', 'b', 'c'];
+     *
+     * _.pull(array, 'a', 'c');
+     * console.log(array);
+     * // => ['b', 'b']
+     */
+    var pull = baseRest(pullAll);
+
+    /**
+     * This method is like `_.pull` except that it accepts an array of values to remove.
+     *
+     * **Note:** Unlike `_.difference`, this method mutates `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to modify.
+     * @param {Array} values The values to remove.
+     * @returns {Array} Returns `array`.
+     * @example
+     *
+     * var array = ['a', 'b', 'c', 'a', 'b', 'c'];
+     *
+     * _.pullAll(array, ['a', 'c']);
+     * console.log(array);
+     * // => ['b', 'b']
+     */
+    function pullAll(array, values) {
+      return (array && array.length && values && values.length)
+        ? basePullAll(array, values)
+        : array;
+    }
+
+    /**
+     * This method is like `_.pullAll` except that it accepts `iteratee` which is
+     * invoked for each element of `array` and `values` to generate the criterion
+     * by which they're compared. The iteratee is invoked with one argument: (value).
+     *
+     * **Note:** Unlike `_.differenceBy`, this method mutates `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to modify.
+     * @param {Array} values The values to remove.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {Array} Returns `array`.
+     * @example
+     *
+     * var array = [{ 'x': 1 }, { 'x': 2 }, { 'x': 3 }, { 'x': 1 }];
+     *
+     * _.pullAllBy(array, [{ 'x': 1 }, { 'x': 3 }], 'x');
+     * console.log(array);
+     * // => [{ 'x': 2 }]
+     */
+    function pullAllBy(array, values, iteratee) {
+      return (array && array.length && values && values.length)
+        ? basePullAll(array, values, getIteratee(iteratee, 2))
+        : array;
+    }
+
+    /**
+     * This method is like `_.pullAll` except that it accepts `comparator` which
+     * is invoked to compare elements of `array` to `values`. The comparator is
+     * invoked with two arguments: (arrVal, othVal).
+     *
+     * **Note:** Unlike `_.differenceWith`, this method mutates `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.6.0
+     * @category Array
+     * @param {Array} array The array to modify.
+     * @param {Array} values The values to remove.
+     * @param {Function} [comparator] The comparator invoked per element.
+     * @returns {Array} Returns `array`.
+     * @example
+     *
+     * var array = [{ 'x': 1, 'y': 2 }, { 'x': 3, 'y': 4 }, { 'x': 5, 'y': 6 }];
+     *
+     * _.pullAllWith(array, [{ 'x': 3, 'y': 4 }], _.isEqual);
+     * console.log(array);
+     * // => [{ 'x': 1, 'y': 2 }, { 'x': 5, 'y': 6 }]
+     */
+    function pullAllWith(array, values, comparator) {
+      return (array && array.length && values && values.length)
+        ? basePullAll(array, values, undefined, comparator)
+        : array;
+    }
+
+    /**
+     * Removes elements from `array` corresponding to `indexes` and returns an
+     * array of removed elements.
+     *
+     * **Note:** Unlike `_.at`, this method mutates `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Array
+     * @param {Array} array The array to modify.
+     * @param {...(number|number[])} [indexes] The indexes of elements to remove.
+     * @returns {Array} Returns the new array of removed elements.
+     * @example
+     *
+     * var array = ['a', 'b', 'c', 'd'];
+     * var pulled = _.pullAt(array, [1, 3]);
+     *
+     * console.log(array);
+     * // => ['a', 'c']
+     *
+     * console.log(pulled);
+     * // => ['b', 'd']
+     */
+    var pullAt = flatRest(function(array, indexes) {
+      var length = array == null ? 0 : array.length,
+          result = baseAt(array, indexes);
+
+      basePullAt(array, arrayMap(indexes, function(index) {
+        return isIndex(index, length) ? +index : index;
+      }).sort(compareAscending));
+
+      return result;
+    });
+
+    /**
+     * Removes all elements from `array` that `predicate` returns truthy for
+     * and returns an array of the removed elements. The predicate is invoked
+     * with three arguments: (value, index, array).
+     *
+     * **Note:** Unlike `_.filter`, this method mutates `array`. Use `_.pull`
+     * to pull elements from an array by value.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.0.0
+     * @category Array
+     * @param {Array} array The array to modify.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the new array of removed elements.
+     * @example
+     *
+     * var array = [1, 2, 3, 4];
+     * var evens = _.remove(array, function(n) {
+     *   return n % 2 == 0;
+     * });
+     *
+     * console.log(array);
+     * // => [1, 3]
+     *
+     * console.log(evens);
+     * // => [2, 4]
+     */
+    function remove(array, predicate) {
+      var result = [];
+      if (!(array && array.length)) {
+        return result;
+      }
+      var index = -1,
+          indexes = [],
+          length = array.length;
+
+      predicate = getIteratee(predicate, 3);
+      while (++index < length) {
+        var value = array[index];
+        if (predicate(value, index, array)) {
+          result.push(value);
+          indexes.push(index);
+        }
+      }
+      basePullAt(array, indexes);
+      return result;
+    }
+
+    /**
+     * Reverses `array` so that the first element becomes the last, the second
+     * element becomes the second to last, and so on.
+     *
+     * **Note:** This method mutates `array` and is based on
+     * [`Array#reverse`](https://mdn.io/Array/reverse).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to modify.
+     * @returns {Array} Returns `array`.
+     * @example
+     *
+     * var array = [1, 2, 3];
+     *
+     * _.reverse(array);
+     * // => [3, 2, 1]
+     *
+     * console.log(array);
+     * // => [3, 2, 1]
+     */
+    function reverse(array) {
+      return array == null ? array : nativeReverse.call(array);
+    }
+
+    /**
+     * Creates a slice of `array` from `start` up to, but not including, `end`.
+     *
+     * **Note:** This method is used instead of
+     * [`Array#slice`](https://mdn.io/Array/slice) to ensure dense arrays are
+     * returned.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Array
+     * @param {Array} array The array to slice.
+     * @param {number} [start=0] The start position.
+     * @param {number} [end=array.length] The end position.
+     * @returns {Array} Returns the slice of `array`.
+     */
+    function slice(array, start, end) {
+      var length = array == null ? 0 : array.length;
+      if (!length) {
+        return [];
+      }
+      if (end && typeof end != 'number' && isIterateeCall(array, start, end)) {
+        start = 0;
+        end = length;
+      }
+      else {
+        start = start == null ? 0 : toInteger(start);
+        end = end === undefined ? length : toInteger(end);
+      }
+      return baseSlice(array, start, end);
+    }
+
+    /**
+     * Uses a binary search to determine the lowest index at which `value`
+     * should be inserted into `array` in order to maintain its sort order.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {Array} array The sorted array to inspect.
+     * @param {*} value The value to evaluate.
+     * @returns {number} Returns the index at which `value` should be inserted
+     *  into `array`.
+     * @example
+     *
+     * _.sortedIndex([30, 50], 40);
+     * // => 1
+     */
+    function sortedIndex(array, value) {
+      return baseSortedIndex(array, value);
+    }
+
+    /**
+     * This method is like `_.sortedIndex` except that it accepts `iteratee`
+     * which is invoked for `value` and each element of `array` to compute their
+     * sort ranking. The iteratee is invoked with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The sorted array to inspect.
+     * @param {*} value The value to evaluate.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {number} Returns the index at which `value` should be inserted
+     *  into `array`.
+     * @example
+     *
+     * var objects = [{ 'x': 4 }, { 'x': 5 }];
+     *
+     * _.sortedIndexBy(objects, { 'x': 4 }, function(o) { return o.x; });
+     * // => 0
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.sortedIndexBy(objects, { 'x': 4 }, 'x');
+     * // => 0
+     */
+    function sortedIndexBy(array, value, iteratee) {
+      return baseSortedIndexBy(array, value, getIteratee(iteratee, 2));
+    }
+
+    /**
+     * This method is like `_.indexOf` except that it performs a binary
+     * search on a sorted `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {*} value The value to search for.
+     * @returns {number} Returns the index of the matched value, else `-1`.
+     * @example
+     *
+     * _.sortedIndexOf([4, 5, 5, 5, 6], 5);
+     * // => 1
+     */
+    function sortedIndexOf(array, value) {
+      var length = array == null ? 0 : array.length;
+      if (length) {
+        var index = baseSortedIndex(array, value);
+        if (index < length && eq(array[index], value)) {
+          return index;
+        }
+      }
+      return -1;
+    }
+
+    /**
+     * This method is like `_.sortedIndex` except that it returns the highest
+     * index at which `value` should be inserted into `array` in order to
+     * maintain its sort order.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Array
+     * @param {Array} array The sorted array to inspect.
+     * @param {*} value The value to evaluate.
+     * @returns {number} Returns the index at which `value` should be inserted
+     *  into `array`.
+     * @example
+     *
+     * _.sortedLastIndex([4, 5, 5, 5, 6], 5);
+     * // => 4
+     */
+    function sortedLastIndex(array, value) {
+      return baseSortedIndex(array, value, true);
+    }
+
+    /**
+     * This method is like `_.sortedLastIndex` except that it accepts `iteratee`
+     * which is invoked for `value` and each element of `array` to compute their
+     * sort ranking. The iteratee is invoked with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The sorted array to inspect.
+     * @param {*} value The value to evaluate.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {number} Returns the index at which `value` should be inserted
+     *  into `array`.
+     * @example
+     *
+     * var objects = [{ 'x': 4 }, { 'x': 5 }];
+     *
+     * _.sortedLastIndexBy(objects, { 'x': 4 }, function(o) { return o.x; });
+     * // => 1
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.sortedLastIndexBy(objects, { 'x': 4 }, 'x');
+     * // => 1
+     */
+    function sortedLastIndexBy(array, value, iteratee) {
+      return baseSortedIndexBy(array, value, getIteratee(iteratee, 2), true);
+    }
+
+    /**
+     * This method is like `_.lastIndexOf` except that it performs a binary
+     * search on a sorted `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {*} value The value to search for.
+     * @returns {number} Returns the index of the matched value, else `-1`.
+     * @example
+     *
+     * _.sortedLastIndexOf([4, 5, 5, 5, 6], 5);
+     * // => 3
+     */
+    function sortedLastIndexOf(array, value) {
+      var length = array == null ? 0 : array.length;
+      if (length) {
+        var index = baseSortedIndex(array, value, true) - 1;
+        if (eq(array[index], value)) {
+          return index;
+        }
+      }
+      return -1;
+    }
+
+    /**
+     * This method is like `_.uniq` except that it's designed and optimized
+     * for sorted arrays.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @returns {Array} Returns the new duplicate free array.
+     * @example
+     *
+     * _.sortedUniq([1, 1, 2]);
+     * // => [1, 2]
+     */
+    function sortedUniq(array) {
+      return (array && array.length)
+        ? baseSortedUniq(array)
+        : [];
+    }
+
+    /**
+     * This method is like `_.uniqBy` except that it's designed and optimized
+     * for sorted arrays.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {Function} [iteratee] The iteratee invoked per element.
+     * @returns {Array} Returns the new duplicate free array.
+     * @example
+     *
+     * _.sortedUniqBy([1.1, 1.2, 2.3, 2.4], Math.floor);
+     * // => [1.1, 2.3]
+     */
+    function sortedUniqBy(array, iteratee) {
+      return (array && array.length)
+        ? baseSortedUniq(array, getIteratee(iteratee, 2))
+        : [];
+    }
+
+    /**
+     * Gets all but the first element of `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @returns {Array} Returns the slice of `array`.
+     * @example
+     *
+     * _.tail([1, 2, 3]);
+     * // => [2, 3]
+     */
+    function tail(array) {
+      var length = array == null ? 0 : array.length;
+      return length ? baseSlice(array, 1, length) : [];
+    }
+
+    /**
+     * Creates a slice of `array` with `n` elements taken from the beginning.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @param {number} [n=1] The number of elements to take.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {Array} Returns the slice of `array`.
+     * @example
+     *
+     * _.take([1, 2, 3]);
+     * // => [1]
+     *
+     * _.take([1, 2, 3], 2);
+     * // => [1, 2]
+     *
+     * _.take([1, 2, 3], 5);
+     * // => [1, 2, 3]
+     *
+     * _.take([1, 2, 3], 0);
+     * // => []
+     */
+    function take(array, n, guard) {
+      if (!(array && array.length)) {
+        return [];
+      }
+      n = (guard || n === undefined) ? 1 : toInteger(n);
+      return baseSlice(array, 0, n < 0 ? 0 : n);
+    }
+
+    /**
+     * Creates a slice of `array` with `n` elements taken from the end.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @param {number} [n=1] The number of elements to take.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {Array} Returns the slice of `array`.
+     * @example
+     *
+     * _.takeRight([1, 2, 3]);
+     * // => [3]
+     *
+     * _.takeRight([1, 2, 3], 2);
+     * // => [2, 3]
+     *
+     * _.takeRight([1, 2, 3], 5);
+     * // => [1, 2, 3]
+     *
+     * _.takeRight([1, 2, 3], 0);
+     * // => []
+     */
+    function takeRight(array, n, guard) {
+      var length = array == null ? 0 : array.length;
+      if (!length) {
+        return [];
+      }
+      n = (guard || n === undefined) ? 1 : toInteger(n);
+      n = length - n;
+      return baseSlice(array, n < 0 ? 0 : n, length);
+    }
+
+    /**
+     * Creates a slice of `array` with elements taken from the end. Elements are
+     * taken until `predicate` returns falsey. The predicate is invoked with
+     * three arguments: (value, index, array).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the slice of `array`.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney',  'active': true },
+     *   { 'user': 'fred',    'active': false },
+     *   { 'user': 'pebbles', 'active': false }
+     * ];
+     *
+     * _.takeRightWhile(users, function(o) { return !o.active; });
+     * // => objects for ['fred', 'pebbles']
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.takeRightWhile(users, { 'user': 'pebbles', 'active': false });
+     * // => objects for ['pebbles']
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.takeRightWhile(users, ['active', false]);
+     * // => objects for ['fred', 'pebbles']
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.takeRightWhile(users, 'active');
+     * // => []
+     */
+    function takeRightWhile(array, predicate) {
+      return (array && array.length)
+        ? baseWhile(array, getIteratee(predicate, 3), false, true)
+        : [];
+    }
+
+    /**
+     * Creates a slice of `array` with elements taken from the beginning. Elements
+     * are taken until `predicate` returns falsey. The predicate is invoked with
+     * three arguments: (value, index, array).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Array
+     * @param {Array} array The array to query.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the slice of `array`.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney',  'active': false },
+     *   { 'user': 'fred',    'active': false },
+     *   { 'user': 'pebbles', 'active': true }
+     * ];
+     *
+     * _.takeWhile(users, function(o) { return !o.active; });
+     * // => objects for ['barney', 'fred']
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.takeWhile(users, { 'user': 'barney', 'active': false });
+     * // => objects for ['barney']
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.takeWhile(users, ['active', false]);
+     * // => objects for ['barney', 'fred']
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.takeWhile(users, 'active');
+     * // => []
+     */
+    function takeWhile(array, predicate) {
+      return (array && array.length)
+        ? baseWhile(array, getIteratee(predicate, 3))
+        : [];
+    }
+
+    /**
+     * Creates an array of unique values, in order, from all given arrays using
+     * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+     * for equality comparisons.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {...Array} [arrays] The arrays to inspect.
+     * @returns {Array} Returns the new array of combined values.
+     * @example
+     *
+     * _.union([2], [1, 2]);
+     * // => [2, 1]
+     */
+    var union = baseRest(function(arrays) {
+      return baseUniq(baseFlatten(arrays, 1, isArrayLikeObject, true));
+    });
+
+    /**
+     * This method is like `_.union` except that it accepts `iteratee` which is
+     * invoked for each element of each `arrays` to generate the criterion by
+     * which uniqueness is computed. Result values are chosen from the first
+     * array in which the value occurs. The iteratee is invoked with one argument:
+     * (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {...Array} [arrays] The arrays to inspect.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {Array} Returns the new array of combined values.
+     * @example
+     *
+     * _.unionBy([2.1], [1.2, 2.3], Math.floor);
+     * // => [2.1, 1.2]
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.unionBy([{ 'x': 1 }], [{ 'x': 2 }, { 'x': 1 }], 'x');
+     * // => [{ 'x': 1 }, { 'x': 2 }]
+     */
+    var unionBy = baseRest(function(arrays) {
+      var iteratee = last(arrays);
+      if (isArrayLikeObject(iteratee)) {
+        iteratee = undefined;
+      }
+      return baseUniq(baseFlatten(arrays, 1, isArrayLikeObject, true), getIteratee(iteratee, 2));
+    });
+
+    /**
+     * This method is like `_.union` except that it accepts `comparator` which
+     * is invoked to compare elements of `arrays`. Result values are chosen from
+     * the first array in which the value occurs. The comparator is invoked
+     * with two arguments: (arrVal, othVal).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {...Array} [arrays] The arrays to inspect.
+     * @param {Function} [comparator] The comparator invoked per element.
+     * @returns {Array} Returns the new array of combined values.
+     * @example
+     *
+     * var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }];
+     * var others = [{ 'x': 1, 'y': 1 }, { 'x': 1, 'y': 2 }];
+     *
+     * _.unionWith(objects, others, _.isEqual);
+     * // => [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }, { 'x': 1, 'y': 1 }]
+     */
+    var unionWith = baseRest(function(arrays) {
+      var comparator = last(arrays);
+      comparator = typeof comparator == 'function' ? comparator : undefined;
+      return baseUniq(baseFlatten(arrays, 1, isArrayLikeObject, true), undefined, comparator);
+    });
+
+    /**
+     * Creates a duplicate-free version of an array, using
+     * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+     * for equality comparisons, in which only the first occurrence of each element
+     * is kept. The order of result values is determined by the order they occur
+     * in the array.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @returns {Array} Returns the new duplicate free array.
+     * @example
+     *
+     * _.uniq([2, 1, 2]);
+     * // => [2, 1]
+     */
+    function uniq(array) {
+      return (array && array.length) ? baseUniq(array) : [];
+    }
+
+    /**
+     * This method is like `_.uniq` except that it accepts `iteratee` which is
+     * invoked for each element in `array` to generate the criterion by which
+     * uniqueness is computed. The order of result values is determined by the
+     * order they occur in the array. The iteratee is invoked with one argument:
+     * (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {Array} Returns the new duplicate free array.
+     * @example
+     *
+     * _.uniqBy([2.1, 1.2, 2.3], Math.floor);
+     * // => [2.1, 1.2]
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.uniqBy([{ 'x': 1 }, { 'x': 2 }, { 'x': 1 }], 'x');
+     * // => [{ 'x': 1 }, { 'x': 2 }]
+     */
+    function uniqBy(array, iteratee) {
+      return (array && array.length) ? baseUniq(array, getIteratee(iteratee, 2)) : [];
+    }
+
+    /**
+     * This method is like `_.uniq` except that it accepts `comparator` which
+     * is invoked to compare elements of `array`. The order of result values is
+     * determined by the order they occur in the array.The comparator is invoked
+     * with two arguments: (arrVal, othVal).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {Function} [comparator] The comparator invoked per element.
+     * @returns {Array} Returns the new duplicate free array.
+     * @example
+     *
+     * var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }, { 'x': 1, 'y': 2 }];
+     *
+     * _.uniqWith(objects, _.isEqual);
+     * // => [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }]
+     */
+    function uniqWith(array, comparator) {
+      comparator = typeof comparator == 'function' ? comparator : undefined;
+      return (array && array.length) ? baseUniq(array, undefined, comparator) : [];
+    }
+
+    /**
+     * This method is like `_.zip` except that it accepts an array of grouped
+     * elements and creates an array regrouping the elements to their pre-zip
+     * configuration.
+     *
+     * @static
+     * @memberOf _
+     * @since 1.2.0
+     * @category Array
+     * @param {Array} array The array of grouped elements to process.
+     * @returns {Array} Returns the new array of regrouped elements.
+     * @example
+     *
+     * var zipped = _.zip(['a', 'b'], [1, 2], [true, false]);
+     * // => [['a', 1, true], ['b', 2, false]]
+     *
+     * _.unzip(zipped);
+     * // => [['a', 'b'], [1, 2], [true, false]]
+     */
+    function unzip(array) {
+      if (!(array && array.length)) {
+        return [];
+      }
+      var length = 0;
+      array = arrayFilter(array, function(group) {
+        if (isArrayLikeObject(group)) {
+          length = nativeMax(group.length, length);
+          return true;
+        }
+      });
+      return baseTimes(length, function(index) {
+        return arrayMap(array, baseProperty(index));
+      });
+    }
+
+    /**
+     * This method is like `_.unzip` except that it accepts `iteratee` to specify
+     * how regrouped values should be combined. The iteratee is invoked with the
+     * elements of each group: (...group).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.8.0
+     * @category Array
+     * @param {Array} array The array of grouped elements to process.
+     * @param {Function} [iteratee=_.identity] The function to combine
+     *  regrouped values.
+     * @returns {Array} Returns the new array of regrouped elements.
+     * @example
+     *
+     * var zipped = _.zip([1, 2], [10, 20], [100, 200]);
+     * // => [[1, 10, 100], [2, 20, 200]]
+     *
+     * _.unzipWith(zipped, _.add);
+     * // => [3, 30, 300]
+     */
+    function unzipWith(array, iteratee) {
+      if (!(array && array.length)) {
+        return [];
+      }
+      var result = unzip(array);
+      if (iteratee == null) {
+        return result;
+      }
+      return arrayMap(result, function(group) {
+        return apply(iteratee, undefined, group);
+      });
+    }
+
+    /**
+     * Creates an array excluding all given values using
+     * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+     * for equality comparisons.
+     *
+     * **Note:** Unlike `_.pull`, this method returns a new array.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {Array} array The array to inspect.
+     * @param {...*} [values] The values to exclude.
+     * @returns {Array} Returns the new array of filtered values.
+     * @see _.difference, _.xor
+     * @example
+     *
+     * _.without([2, 1, 2, 3], 1, 2);
+     * // => [3]
+     */
+    var without = baseRest(function(array, values) {
+      return isArrayLikeObject(array)
+        ? baseDifference(array, values)
+        : [];
+    });
+
+    /**
+     * Creates an array of unique values that is the
+     * [symmetric difference](https://en.wikipedia.org/wiki/Symmetric_difference)
+     * of the given arrays. The order of result values is determined by the order
+     * they occur in the arrays.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.4.0
+     * @category Array
+     * @param {...Array} [arrays] The arrays to inspect.
+     * @returns {Array} Returns the new array of filtered values.
+     * @see _.difference, _.without
+     * @example
+     *
+     * _.xor([2, 1], [2, 3]);
+     * // => [1, 3]
+     */
+    var xor = baseRest(function(arrays) {
+      return baseXor(arrayFilter(arrays, isArrayLikeObject));
+    });
+
+    /**
+     * This method is like `_.xor` except that it accepts `iteratee` which is
+     * invoked for each element of each `arrays` to generate the criterion by
+     * which by which they're compared. The order of result values is determined
+     * by the order they occur in the arrays. The iteratee is invoked with one
+     * argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {...Array} [arrays] The arrays to inspect.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {Array} Returns the new array of filtered values.
+     * @example
+     *
+     * _.xorBy([2.1, 1.2], [2.3, 3.4], Math.floor);
+     * // => [1.2, 3.4]
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.xorBy([{ 'x': 1 }], [{ 'x': 2 }, { 'x': 1 }], 'x');
+     * // => [{ 'x': 2 }]
+     */
+    var xorBy = baseRest(function(arrays) {
+      var iteratee = last(arrays);
+      if (isArrayLikeObject(iteratee)) {
+        iteratee = undefined;
+      }
+      return baseXor(arrayFilter(arrays, isArrayLikeObject), getIteratee(iteratee, 2));
+    });
+
+    /**
+     * This method is like `_.xor` except that it accepts `comparator` which is
+     * invoked to compare elements of `arrays`. The order of result values is
+     * determined by the order they occur in the arrays. The comparator is invoked
+     * with two arguments: (arrVal, othVal).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Array
+     * @param {...Array} [arrays] The arrays to inspect.
+     * @param {Function} [comparator] The comparator invoked per element.
+     * @returns {Array} Returns the new array of filtered values.
+     * @example
+     *
+     * var objects = [{ 'x': 1, 'y': 2 }, { 'x': 2, 'y': 1 }];
+     * var others = [{ 'x': 1, 'y': 1 }, { 'x': 1, 'y': 2 }];
+     *
+     * _.xorWith(objects, others, _.isEqual);
+     * // => [{ 'x': 2, 'y': 1 }, { 'x': 1, 'y': 1 }]
+     */
+    var xorWith = baseRest(function(arrays) {
+      var comparator = last(arrays);
+      comparator = typeof comparator == 'function' ? comparator : undefined;
+      return baseXor(arrayFilter(arrays, isArrayLikeObject), undefined, comparator);
+    });
+
+    /**
+     * Creates an array of grouped elements, the first of which contains the
+     * first elements of the given arrays, the second of which contains the
+     * second elements of the given arrays, and so on.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Array
+     * @param {...Array} [arrays] The arrays to process.
+     * @returns {Array} Returns the new array of grouped elements.
+     * @example
+     *
+     * _.zip(['a', 'b'], [1, 2], [true, false]);
+     * // => [['a', 1, true], ['b', 2, false]]
+     */
+    var zip = baseRest(unzip);
+
+    /**
+     * This method is like `_.fromPairs` except that it accepts two arrays,
+     * one of property identifiers and one of corresponding values.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.4.0
+     * @category Array
+     * @param {Array} [props=[]] The property identifiers.
+     * @param {Array} [values=[]] The property values.
+     * @returns {Object} Returns the new object.
+     * @example
+     *
+     * _.zipObject(['a', 'b'], [1, 2]);
+     * // => { 'a': 1, 'b': 2 }
+     */
+    function zipObject(props, values) {
+      return baseZipObject(props || [], values || [], assignValue);
+    }
+
+    /**
+     * This method is like `_.zipObject` except that it supports property paths.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.1.0
+     * @category Array
+     * @param {Array} [props=[]] The property identifiers.
+     * @param {Array} [values=[]] The property values.
+     * @returns {Object} Returns the new object.
+     * @example
+     *
+     * _.zipObjectDeep(['a.b[0].c', 'a.b[1].d'], [1, 2]);
+     * // => { 'a': { 'b': [{ 'c': 1 }, { 'd': 2 }] } }
+     */
+    function zipObjectDeep(props, values) {
+      return baseZipObject(props || [], values || [], baseSet);
+    }
+
+    /**
+     * This method is like `_.zip` except that it accepts `iteratee` to specify
+     * how grouped values should be combined. The iteratee is invoked with the
+     * elements of each group: (...group).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.8.0
+     * @category Array
+     * @param {...Array} [arrays] The arrays to process.
+     * @param {Function} [iteratee=_.identity] The function to combine
+     *  grouped values.
+     * @returns {Array} Returns the new array of grouped elements.
+     * @example
+     *
+     * _.zipWith([1, 2], [10, 20], [100, 200], function(a, b, c) {
+     *   return a + b + c;
+     * });
+     * // => [111, 222]
+     */
+    var zipWith = baseRest(function(arrays) {
+      var length = arrays.length,
+          iteratee = length > 1 ? arrays[length - 1] : undefined;
+
+      iteratee = typeof iteratee == 'function' ? (arrays.pop(), iteratee) : undefined;
+      return unzipWith(arrays, iteratee);
+    });
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Creates a `lodash` wrapper instance that wraps `value` with explicit method
+     * chain sequences enabled. The result of such sequences must be unwrapped
+     * with `_#value`.
+     *
+     * @static
+     * @memberOf _
+     * @since 1.3.0
+     * @category Seq
+     * @param {*} value The value to wrap.
+     * @returns {Object} Returns the new `lodash` wrapper instance.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney',  'age': 36 },
+     *   { 'user': 'fred',    'age': 40 },
+     *   { 'user': 'pebbles', 'age': 1 }
+     * ];
+     *
+     * var youngest = _
+     *   .chain(users)
+     *   .sortBy('age')
+     *   .map(function(o) {
+     *     return o.user + ' is ' + o.age;
+     *   })
+     *   .head()
+     *   .value();
+     * // => 'pebbles is 1'
+     */
+    function chain(value) {
+      var result = lodash(value);
+      result.__chain__ = true;
+      return result;
+    }
+
+    /**
+     * This method invokes `interceptor` and returns `value`. The interceptor
+     * is invoked with one argument; (value). The purpose of this method is to
+     * "tap into" a method chain sequence in order to modify intermediate results.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Seq
+     * @param {*} value The value to provide to `interceptor`.
+     * @param {Function} interceptor The function to invoke.
+     * @returns {*} Returns `value`.
+     * @example
+     *
+     * _([1, 2, 3])
+     *  .tap(function(array) {
+     *    // Mutate input array.
+     *    array.pop();
+     *  })
+     *  .reverse()
+     *  .value();
+     * // => [2, 1]
+     */
+    function tap(value, interceptor) {
+      interceptor(value);
+      return value;
+    }
+
+    /**
+     * This method is like `_.tap` except that it returns the result of `interceptor`.
+     * The purpose of this method is to "pass thru" values replacing intermediate
+     * results in a method chain sequence.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Seq
+     * @param {*} value The value to provide to `interceptor`.
+     * @param {Function} interceptor The function to invoke.
+     * @returns {*} Returns the result of `interceptor`.
+     * @example
+     *
+     * _('  abc  ')
+     *  .chain()
+     *  .trim()
+     *  .thru(function(value) {
+     *    return [value];
+     *  })
+     *  .value();
+     * // => ['abc']
+     */
+    function thru(value, interceptor) {
+      return interceptor(value);
+    }
+
+    /**
+     * This method is the wrapper version of `_.at`.
+     *
+     * @name at
+     * @memberOf _
+     * @since 1.0.0
+     * @category Seq
+     * @param {...(string|string[])} [paths] The property paths to pick.
+     * @returns {Object} Returns the new `lodash` wrapper instance.
+     * @example
+     *
+     * var object = { 'a': [{ 'b': { 'c': 3 } }, 4] };
+     *
+     * _(object).at(['a[0].b.c', 'a[1]']).value();
+     * // => [3, 4]
+     */
+    var wrapperAt = flatRest(function(paths) {
+      var length = paths.length,
+          start = length ? paths[0] : 0,
+          value = this.__wrapped__,
+          interceptor = function(object) { return baseAt(object, paths); };
+
+      if (length > 1 || this.__actions__.length ||
+          !(value instanceof LazyWrapper) || !isIndex(start)) {
+        return this.thru(interceptor);
+      }
+      value = value.slice(start, +start + (length ? 1 : 0));
+      value.__actions__.push({
+        'func': thru,
+        'args': [interceptor],
+        'thisArg': undefined
+      });
+      return new LodashWrapper(value, this.__chain__).thru(function(array) {
+        if (length && !array.length) {
+          array.push(undefined);
+        }
+        return array;
+      });
+    });
+
+    /**
+     * Creates a `lodash` wrapper instance with explicit method chain sequences enabled.
+     *
+     * @name chain
+     * @memberOf _
+     * @since 0.1.0
+     * @category Seq
+     * @returns {Object} Returns the new `lodash` wrapper instance.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney', 'age': 36 },
+     *   { 'user': 'fred',   'age': 40 }
+     * ];
+     *
+     * // A sequence without explicit chaining.
+     * _(users).head();
+     * // => { 'user': 'barney', 'age': 36 }
+     *
+     * // A sequence with explicit chaining.
+     * _(users)
+     *   .chain()
+     *   .head()
+     *   .pick('user')
+     *   .value();
+     * // => { 'user': 'barney' }
+     */
+    function wrapperChain() {
+      return chain(this);
+    }
+
+    /**
+     * Executes the chain sequence and returns the wrapped result.
+     *
+     * @name commit
+     * @memberOf _
+     * @since 3.2.0
+     * @category Seq
+     * @returns {Object} Returns the new `lodash` wrapper instance.
+     * @example
+     *
+     * var array = [1, 2];
+     * var wrapped = _(array).push(3);
+     *
+     * console.log(array);
+     * // => [1, 2]
+     *
+     * wrapped = wrapped.commit();
+     * console.log(array);
+     * // => [1, 2, 3]
+     *
+     * wrapped.last();
+     * // => 3
+     *
+     * console.log(array);
+     * // => [1, 2, 3]
+     */
+    function wrapperCommit() {
+      return new LodashWrapper(this.value(), this.__chain__);
+    }
+
+    /**
+     * Gets the next value on a wrapped object following the
+     * [iterator protocol](https://mdn.io/iteration_protocols#iterator).
+     *
+     * @name next
+     * @memberOf _
+     * @since 4.0.0
+     * @category Seq
+     * @returns {Object} Returns the next iterator value.
+     * @example
+     *
+     * var wrapped = _([1, 2]);
+     *
+     * wrapped.next();
+     * // => { 'done': false, 'value': 1 }
+     *
+     * wrapped.next();
+     * // => { 'done': false, 'value': 2 }
+     *
+     * wrapped.next();
+     * // => { 'done': true, 'value': undefined }
+     */
+    function wrapperNext() {
+      if (this.__values__ === undefined) {
+        this.__values__ = toArray(this.value());
+      }
+      var done = this.__index__ >= this.__values__.length,
+          value = done ? undefined : this.__values__[this.__index__++];
+
+      return { 'done': done, 'value': value };
+    }
+
+    /**
+     * Enables the wrapper to be iterable.
+     *
+     * @name Symbol.iterator
+     * @memberOf _
+     * @since 4.0.0
+     * @category Seq
+     * @returns {Object} Returns the wrapper object.
+     * @example
+     *
+     * var wrapped = _([1, 2]);
+     *
+     * wrapped[Symbol.iterator]() === wrapped;
+     * // => true
+     *
+     * Array.from(wrapped);
+     * // => [1, 2]
+     */
+    function wrapperToIterator() {
+      return this;
+    }
+
+    /**
+     * Creates a clone of the chain sequence planting `value` as the wrapped value.
+     *
+     * @name plant
+     * @memberOf _
+     * @since 3.2.0
+     * @category Seq
+     * @param {*} value The value to plant.
+     * @returns {Object} Returns the new `lodash` wrapper instance.
+     * @example
+     *
+     * function square(n) {
+     *   return n * n;
+     * }
+     *
+     * var wrapped = _([1, 2]).map(square);
+     * var other = wrapped.plant([3, 4]);
+     *
+     * other.value();
+     * // => [9, 16]
+     *
+     * wrapped.value();
+     * // => [1, 4]
+     */
+    function wrapperPlant(value) {
+      var result,
+          parent = this;
+
+      while (parent instanceof baseLodash) {
+        var clone = wrapperClone(parent);
+        clone.__index__ = 0;
+        clone.__values__ = undefined;
+        if (result) {
+          previous.__wrapped__ = clone;
+        } else {
+          result = clone;
+        }
+        var previous = clone;
+        parent = parent.__wrapped__;
+      }
+      previous.__wrapped__ = value;
+      return result;
+    }
+
+    /**
+     * This method is the wrapper version of `_.reverse`.
+     *
+     * **Note:** This method mutates the wrapped array.
+     *
+     * @name reverse
+     * @memberOf _
+     * @since 0.1.0
+     * @category Seq
+     * @returns {Object} Returns the new `lodash` wrapper instance.
+     * @example
+     *
+     * var array = [1, 2, 3];
+     *
+     * _(array).reverse().value()
+     * // => [3, 2, 1]
+     *
+     * console.log(array);
+     * // => [3, 2, 1]
+     */
+    function wrapperReverse() {
+      var value = this.__wrapped__;
+      if (value instanceof LazyWrapper) {
+        var wrapped = value;
+        if (this.__actions__.length) {
+          wrapped = new LazyWrapper(this);
+        }
+        wrapped = wrapped.reverse();
+        wrapped.__actions__.push({
+          'func': thru,
+          'args': [reverse],
+          'thisArg': undefined
+        });
+        return new LodashWrapper(wrapped, this.__chain__);
+      }
+      return this.thru(reverse);
+    }
+
+    /**
+     * Executes the chain sequence to resolve the unwrapped value.
+     *
+     * @name value
+     * @memberOf _
+     * @since 0.1.0
+     * @alias toJSON, valueOf
+     * @category Seq
+     * @returns {*} Returns the resolved unwrapped value.
+     * @example
+     *
+     * _([1, 2, 3]).value();
+     * // => [1, 2, 3]
+     */
+    function wrapperValue() {
+      return baseWrapperValue(this.__wrapped__, this.__actions__);
+    }
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Creates an object composed of keys generated from the results of running
+     * each element of `collection` thru `iteratee`. The corresponding value of
+     * each key is the number of times the key was returned by `iteratee`. The
+     * iteratee is invoked with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 0.5.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [iteratee=_.identity] The iteratee to transform keys.
+     * @returns {Object} Returns the composed aggregate object.
+     * @example
+     *
+     * _.countBy([6.1, 4.2, 6.3], Math.floor);
+     * // => { '4': 1, '6': 2 }
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.countBy(['one', 'two', 'three'], 'length');
+     * // => { '3': 2, '5': 1 }
+     */
+    var countBy = createAggregator(function(result, value, key) {
+      if (hasOwnProperty.call(result, key)) {
+        ++result[key];
+      } else {
+        baseAssignValue(result, key, 1);
+      }
+    });
+
+    /**
+     * Checks if `predicate` returns truthy for **all** elements of `collection`.
+     * Iteration is stopped once `predicate` returns falsey. The predicate is
+     * invoked with three arguments: (value, index|key, collection).
+     *
+     * **Note:** This method returns `true` for
+     * [empty collections](https://en.wikipedia.org/wiki/Empty_set) because
+     * [everything is true](https://en.wikipedia.org/wiki/Vacuous_truth) of
+     * elements of empty collections.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {boolean} Returns `true` if all elements pass the predicate check,
+     *  else `false`.
+     * @example
+     *
+     * _.every([true, 1, null, 'yes'], Boolean);
+     * // => false
+     *
+     * var users = [
+     *   { 'user': 'barney', 'age': 36, 'active': false },
+     *   { 'user': 'fred',   'age': 40, 'active': false }
+     * ];
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.every(users, { 'user': 'barney', 'active': false });
+     * // => false
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.every(users, ['active', false]);
+     * // => true
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.every(users, 'active');
+     * // => false
+     */
+    function every(collection, predicate, guard) {
+      var func = isArray(collection) ? arrayEvery : baseEvery;
+      if (guard && isIterateeCall(collection, predicate, guard)) {
+        predicate = undefined;
+      }
+      return func(collection, getIteratee(predicate, 3));
+    }
+
+    /**
+     * Iterates over elements of `collection`, returning an array of all elements
+     * `predicate` returns truthy for. The predicate is invoked with three
+     * arguments: (value, index|key, collection).
+     *
+     * **Note:** Unlike `_.remove`, this method returns a new array.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the new filtered array.
+     * @see _.reject
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney', 'age': 36, 'active': true },
+     *   { 'user': 'fred',   'age': 40, 'active': false }
+     * ];
+     *
+     * _.filter(users, function(o) { return !o.active; });
+     * // => objects for ['fred']
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.filter(users, { 'age': 36, 'active': true });
+     * // => objects for ['barney']
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.filter(users, ['active', false]);
+     * // => objects for ['fred']
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.filter(users, 'active');
+     * // => objects for ['barney']
+     *
+     * // Combining several predicates using `_.overEvery` or `_.overSome`.
+     * _.filter(users, _.overSome([{ 'age': 36 }, ['age', 40]]));
+     * // => objects for ['fred', 'barney']
+     */
+    function filter(collection, predicate) {
+      var func = isArray(collection) ? arrayFilter : baseFilter;
+      return func(collection, getIteratee(predicate, 3));
+    }
+
+    /**
+     * Iterates over elements of `collection`, returning the first element
+     * `predicate` returns truthy for. The predicate is invoked with three
+     * arguments: (value, index|key, collection).
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to inspect.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @param {number} [fromIndex=0] The index to search from.
+     * @returns {*} Returns the matched element, else `undefined`.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney',  'age': 36, 'active': true },
+     *   { 'user': 'fred',    'age': 40, 'active': false },
+     *   { 'user': 'pebbles', 'age': 1,  'active': true }
+     * ];
+     *
+     * _.find(users, function(o) { return o.age < 40; });
+     * // => object for 'barney'
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.find(users, { 'age': 1, 'active': true });
+     * // => object for 'pebbles'
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.find(users, ['active', false]);
+     * // => object for 'fred'
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.find(users, 'active');
+     * // => object for 'barney'
+     */
+    var find = createFind(findIndex);
+
+    /**
+     * This method is like `_.find` except that it iterates over elements of
+     * `collection` from right to left.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.0.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to inspect.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @param {number} [fromIndex=collection.length-1] The index to search from.
+     * @returns {*} Returns the matched element, else `undefined`.
+     * @example
+     *
+     * _.findLast([1, 2, 3, 4], function(n) {
+     *   return n % 2 == 1;
+     * });
+     * // => 3
+     */
+    var findLast = createFind(findLastIndex);
+
+    /**
+     * Creates a flattened array of values by running each element in `collection`
+     * thru `iteratee` and flattening the mapped results. The iteratee is invoked
+     * with three arguments: (value, index|key, collection).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the new flattened array.
+     * @example
+     *
+     * function duplicate(n) {
+     *   return [n, n];
+     * }
+     *
+     * _.flatMap([1, 2], duplicate);
+     * // => [1, 1, 2, 2]
+     */
+    function flatMap(collection, iteratee) {
+      return baseFlatten(map(collection, iteratee), 1);
+    }
+
+    /**
+     * This method is like `_.flatMap` except that it recursively flattens the
+     * mapped results.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.7.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the new flattened array.
+     * @example
+     *
+     * function duplicate(n) {
+     *   return [[[n, n]]];
+     * }
+     *
+     * _.flatMapDeep([1, 2], duplicate);
+     * // => [1, 1, 2, 2]
+     */
+    function flatMapDeep(collection, iteratee) {
+      return baseFlatten(map(collection, iteratee), INFINITY);
+    }
+
+    /**
+     * This method is like `_.flatMap` except that it recursively flattens the
+     * mapped results up to `depth` times.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.7.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @param {number} [depth=1] The maximum recursion depth.
+     * @returns {Array} Returns the new flattened array.
+     * @example
+     *
+     * function duplicate(n) {
+     *   return [[[n, n]]];
+     * }
+     *
+     * _.flatMapDepth([1, 2], duplicate, 2);
+     * // => [[1, 1], [2, 2]]
+     */
+    function flatMapDepth(collection, iteratee, depth) {
+      depth = depth === undefined ? 1 : toInteger(depth);
+      return baseFlatten(map(collection, iteratee), depth);
+    }
+
+    /**
+     * Iterates over elements of `collection` and invokes `iteratee` for each element.
+     * The iteratee is invoked with three arguments: (value, index|key, collection).
+     * Iteratee functions may exit iteration early by explicitly returning `false`.
+     *
+     * **Note:** As with other "Collections" methods, objects with a "length"
+     * property are iterated like arrays. To avoid this behavior use `_.forIn`
+     * or `_.forOwn` for object iteration.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @alias each
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Array|Object} Returns `collection`.
+     * @see _.forEachRight
+     * @example
+     *
+     * _.forEach([1, 2], function(value) {
+     *   console.log(value);
+     * });
+     * // => Logs `1` then `2`.
+     *
+     * _.forEach({ 'a': 1, 'b': 2 }, function(value, key) {
+     *   console.log(key);
+     * });
+     * // => Logs 'a' then 'b' (iteration order is not guaranteed).
+     */
+    function forEach(collection, iteratee) {
+      var func = isArray(collection) ? arrayEach : baseEach;
+      return func(collection, getIteratee(iteratee, 3));
+    }
+
+    /**
+     * This method is like `_.forEach` except that it iterates over elements of
+     * `collection` from right to left.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.0.0
+     * @alias eachRight
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Array|Object} Returns `collection`.
+     * @see _.forEach
+     * @example
+     *
+     * _.forEachRight([1, 2], function(value) {
+     *   console.log(value);
+     * });
+     * // => Logs `2` then `1`.
+     */
+    function forEachRight(collection, iteratee) {
+      var func = isArray(collection) ? arrayEachRight : baseEachRight;
+      return func(collection, getIteratee(iteratee, 3));
+    }
+
+    /**
+     * Creates an object composed of keys generated from the results of running
+     * each element of `collection` thru `iteratee`. The order of grouped values
+     * is determined by the order they occur in `collection`. The corresponding
+     * value of each key is an array of elements responsible for generating the
+     * key. The iteratee is invoked with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [iteratee=_.identity] The iteratee to transform keys.
+     * @returns {Object} Returns the composed aggregate object.
+     * @example
+     *
+     * _.groupBy([6.1, 4.2, 6.3], Math.floor);
+     * // => { '4': [4.2], '6': [6.1, 6.3] }
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.groupBy(['one', 'two', 'three'], 'length');
+     * // => { '3': ['one', 'two'], '5': ['three'] }
+     */
+    var groupBy = createAggregator(function(result, value, key) {
+      if (hasOwnProperty.call(result, key)) {
+        result[key].push(value);
+      } else {
+        baseAssignValue(result, key, [value]);
+      }
+    });
+
+    /**
+     * Checks if `value` is in `collection`. If `collection` is a string, it's
+     * checked for a substring of `value`, otherwise
+     * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+     * is used for equality comparisons. If `fromIndex` is negative, it's used as
+     * the offset from the end of `collection`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object|string} collection The collection to inspect.
+     * @param {*} value The value to search for.
+     * @param {number} [fromIndex=0] The index to search from.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.reduce`.
+     * @returns {boolean} Returns `true` if `value` is found, else `false`.
+     * @example
+     *
+     * _.includes([1, 2, 3], 1);
+     * // => true
+     *
+     * _.includes([1, 2, 3], 1, 2);
+     * // => false
+     *
+     * _.includes({ 'a': 1, 'b': 2 }, 1);
+     * // => true
+     *
+     * _.includes('abcd', 'bc');
+     * // => true
+     */
+    function includes(collection, value, fromIndex, guard) {
+      collection = isArrayLike(collection) ? collection : values(collection);
+      fromIndex = (fromIndex && !guard) ? toInteger(fromIndex) : 0;
+
+      var length = collection.length;
+      if (fromIndex < 0) {
+        fromIndex = nativeMax(length + fromIndex, 0);
+      }
+      return isString(collection)
+        ? (fromIndex <= length && collection.indexOf(value, fromIndex) > -1)
+        : (!!length && baseIndexOf(collection, value, fromIndex) > -1);
+    }
+
+    /**
+     * Invokes the method at `path` of each element in `collection`, returning
+     * an array of the results of each invoked method. Any additional arguments
+     * are provided to each invoked method. If `path` is a function, it's invoked
+     * for, and `this` bound to, each element in `collection`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Array|Function|string} path The path of the method to invoke or
+     *  the function invoked per iteration.
+     * @param {...*} [args] The arguments to invoke each method with.
+     * @returns {Array} Returns the array of results.
+     * @example
+     *
+     * _.invokeMap([[5, 1, 7], [3, 2, 1]], 'sort');
+     * // => [[1, 5, 7], [1, 2, 3]]
+     *
+     * _.invokeMap([123, 456], String.prototype.split, '');
+     * // => [['1', '2', '3'], ['4', '5', '6']]
+     */
+    var invokeMap = baseRest(function(collection, path, args) {
+      var index = -1,
+          isFunc = typeof path == 'function',
+          result = isArrayLike(collection) ? Array(collection.length) : [];
+
+      baseEach(collection, function(value) {
+        result[++index] = isFunc ? apply(path, value, args) : baseInvoke(value, path, args);
+      });
+      return result;
+    });
+
+    /**
+     * Creates an object composed of keys generated from the results of running
+     * each element of `collection` thru `iteratee`. The corresponding value of
+     * each key is the last element responsible for generating the key. The
+     * iteratee is invoked with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [iteratee=_.identity] The iteratee to transform keys.
+     * @returns {Object} Returns the composed aggregate object.
+     * @example
+     *
+     * var array = [
+     *   { 'dir': 'left', 'code': 97 },
+     *   { 'dir': 'right', 'code': 100 }
+     * ];
+     *
+     * _.keyBy(array, function(o) {
+     *   return String.fromCharCode(o.code);
+     * });
+     * // => { 'a': { 'dir': 'left', 'code': 97 }, 'd': { 'dir': 'right', 'code': 100 } }
+     *
+     * _.keyBy(array, 'dir');
+     * // => { 'left': { 'dir': 'left', 'code': 97 }, 'right': { 'dir': 'right', 'code': 100 } }
+     */
+    var keyBy = createAggregator(function(result, value, key) {
+      baseAssignValue(result, key, value);
+    });
+
+    /**
+     * Creates an array of values by running each element in `collection` thru
+     * `iteratee`. The iteratee is invoked with three arguments:
+     * (value, index|key, collection).
+     *
+     * Many lodash methods are guarded to work as iteratees for methods like
+     * `_.every`, `_.filter`, `_.map`, `_.mapValues`, `_.reject`, and `_.some`.
+     *
+     * The guarded methods are:
+     * `ary`, `chunk`, `curry`, `curryRight`, `drop`, `dropRight`, `every`,
+     * `fill`, `invert`, `parseInt`, `random`, `range`, `rangeRight`, `repeat`,
+     * `sampleSize`, `slice`, `some`, `sortBy`, `split`, `take`, `takeRight`,
+     * `template`, `trim`, `trimEnd`, `trimStart`, and `words`
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the new mapped array.
+     * @example
+     *
+     * function square(n) {
+     *   return n * n;
+     * }
+     *
+     * _.map([4, 8], square);
+     * // => [16, 64]
+     *
+     * _.map({ 'a': 4, 'b': 8 }, square);
+     * // => [16, 64] (iteration order is not guaranteed)
+     *
+     * var users = [
+     *   { 'user': 'barney' },
+     *   { 'user': 'fred' }
+     * ];
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.map(users, 'user');
+     * // => ['barney', 'fred']
+     */
+    function map(collection, iteratee) {
+      var func = isArray(collection) ? arrayMap : baseMap;
+      return func(collection, getIteratee(iteratee, 3));
+    }
+
+    /**
+     * This method is like `_.sortBy` except that it allows specifying the sort
+     * orders of the iteratees to sort by. If `orders` is unspecified, all values
+     * are sorted in ascending order. Otherwise, specify an order of "desc" for
+     * descending or "asc" for ascending sort order of corresponding values.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Array[]|Function[]|Object[]|string[]} [iteratees=[_.identity]]
+     *  The iteratees to sort by.
+     * @param {string[]} [orders] The sort orders of `iteratees`.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.reduce`.
+     * @returns {Array} Returns the new sorted array.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'fred',   'age': 48 },
+     *   { 'user': 'barney', 'age': 34 },
+     *   { 'user': 'fred',   'age': 40 },
+     *   { 'user': 'barney', 'age': 36 }
+     * ];
+     *
+     * // Sort by `user` in ascending order and by `age` in descending order.
+     * _.orderBy(users, ['user', 'age'], ['asc', 'desc']);
+     * // => objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 40]]
+     */
+    function orderBy(collection, iteratees, orders, guard) {
+      if (collection == null) {
+        return [];
+      }
+      if (!isArray(iteratees)) {
+        iteratees = iteratees == null ? [] : [iteratees];
+      }
+      orders = guard ? undefined : orders;
+      if (!isArray(orders)) {
+        orders = orders == null ? [] : [orders];
+      }
+      return baseOrderBy(collection, iteratees, orders);
+    }
+
+    /**
+     * Creates an array of elements split into two groups, the first of which
+     * contains elements `predicate` returns truthy for, the second of which
+     * contains elements `predicate` returns falsey for. The predicate is
+     * invoked with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the array of grouped elements.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney',  'age': 36, 'active': false },
+     *   { 'user': 'fred',    'age': 40, 'active': true },
+     *   { 'user': 'pebbles', 'age': 1,  'active': false }
+     * ];
+     *
+     * _.partition(users, function(o) { return o.active; });
+     * // => objects for [['fred'], ['barney', 'pebbles']]
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.partition(users, { 'age': 1, 'active': false });
+     * // => objects for [['pebbles'], ['barney', 'fred']]
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.partition(users, ['active', false]);
+     * // => objects for [['barney', 'pebbles'], ['fred']]
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.partition(users, 'active');
+     * // => objects for [['fred'], ['barney', 'pebbles']]
+     */
+    var partition = createAggregator(function(result, value, key) {
+      result[key ? 0 : 1].push(value);
+    }, function() { return [[], []]; });
+
+    /**
+     * Reduces `collection` to a value which is the accumulated result of running
+     * each element in `collection` thru `iteratee`, where each successive
+     * invocation is supplied the return value of the previous. If `accumulator`
+     * is not given, the first element of `collection` is used as the initial
+     * value. The iteratee is invoked with four arguments:
+     * (accumulator, value, index|key, collection).
+     *
+     * Many lodash methods are guarded to work as iteratees for methods like
+     * `_.reduce`, `_.reduceRight`, and `_.transform`.
+     *
+     * The guarded methods are:
+     * `assign`, `defaults`, `defaultsDeep`, `includes`, `merge`, `orderBy`,
+     * and `sortBy`
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @param {*} [accumulator] The initial value.
+     * @returns {*} Returns the accumulated value.
+     * @see _.reduceRight
+     * @example
+     *
+     * _.reduce([1, 2], function(sum, n) {
+     *   return sum + n;
+     * }, 0);
+     * // => 3
+     *
+     * _.reduce({ 'a': 1, 'b': 2, 'c': 1 }, function(result, value, key) {
+     *   (result[value] || (result[value] = [])).push(key);
+     *   return result;
+     * }, {});
+     * // => { '1': ['a', 'c'], '2': ['b'] } (iteration order is not guaranteed)
+     */
+    function reduce(collection, iteratee, accumulator) {
+      var func = isArray(collection) ? arrayReduce : baseReduce,
+          initAccum = arguments.length < 3;
+
+      return func(collection, getIteratee(iteratee, 4), accumulator, initAccum, baseEach);
+    }
+
+    /**
+     * This method is like `_.reduce` except that it iterates over elements of
+     * `collection` from right to left.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @param {*} [accumulator] The initial value.
+     * @returns {*} Returns the accumulated value.
+     * @see _.reduce
+     * @example
+     *
+     * var array = [[0, 1], [2, 3], [4, 5]];
+     *
+     * _.reduceRight(array, function(flattened, other) {
+     *   return flattened.concat(other);
+     * }, []);
+     * // => [4, 5, 2, 3, 0, 1]
+     */
+    function reduceRight(collection, iteratee, accumulator) {
+      var func = isArray(collection) ? arrayReduceRight : baseReduce,
+          initAccum = arguments.length < 3;
+
+      return func(collection, getIteratee(iteratee, 4), accumulator, initAccum, baseEachRight);
+    }
+
+    /**
+     * The opposite of `_.filter`; this method returns the elements of `collection`
+     * that `predicate` does **not** return truthy for.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the new filtered array.
+     * @see _.filter
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney', 'age': 36, 'active': false },
+     *   { 'user': 'fred',   'age': 40, 'active': true }
+     * ];
+     *
+     * _.reject(users, function(o) { return !o.active; });
+     * // => objects for ['fred']
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.reject(users, { 'age': 40, 'active': true });
+     * // => objects for ['barney']
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.reject(users, ['active', false]);
+     * // => objects for ['fred']
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.reject(users, 'active');
+     * // => objects for ['barney']
+     */
+    function reject(collection, predicate) {
+      var func = isArray(collection) ? arrayFilter : baseFilter;
+      return func(collection, negate(getIteratee(predicate, 3)));
+    }
+
+    /**
+     * Gets a random element from `collection`.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.0.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to sample.
+     * @returns {*} Returns the random element.
+     * @example
+     *
+     * _.sample([1, 2, 3, 4]);
+     * // => 2
+     */
+    function sample(collection) {
+      var func = isArray(collection) ? arraySample : baseSample;
+      return func(collection);
+    }
+
+    /**
+     * Gets `n` random elements at unique keys from `collection` up to the
+     * size of `collection`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to sample.
+     * @param {number} [n=1] The number of elements to sample.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {Array} Returns the random elements.
+     * @example
+     *
+     * _.sampleSize([1, 2, 3], 2);
+     * // => [3, 1]
+     *
+     * _.sampleSize([1, 2, 3], 4);
+     * // => [2, 3, 1]
+     */
+    function sampleSize(collection, n, guard) {
+      if ((guard ? isIterateeCall(collection, n, guard) : n === undefined)) {
+        n = 1;
+      } else {
+        n = toInteger(n);
+      }
+      var func = isArray(collection) ? arraySampleSize : baseSampleSize;
+      return func(collection, n);
+    }
+
+    /**
+     * Creates an array of shuffled values, using a version of the
+     * [Fisher-Yates shuffle](https://en.wikipedia.org/wiki/Fisher-Yates_shuffle).
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to shuffle.
+     * @returns {Array} Returns the new shuffled array.
+     * @example
+     *
+     * _.shuffle([1, 2, 3, 4]);
+     * // => [4, 1, 3, 2]
+     */
+    function shuffle(collection) {
+      var func = isArray(collection) ? arrayShuffle : baseShuffle;
+      return func(collection);
+    }
+
+    /**
+     * Gets the size of `collection` by returning its length for array-like
+     * values or the number of own enumerable string keyed properties for objects.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object|string} collection The collection to inspect.
+     * @returns {number} Returns the collection size.
+     * @example
+     *
+     * _.size([1, 2, 3]);
+     * // => 3
+     *
+     * _.size({ 'a': 1, 'b': 2 });
+     * // => 2
+     *
+     * _.size('pebbles');
+     * // => 7
+     */
+    function size(collection) {
+      if (collection == null) {
+        return 0;
+      }
+      if (isArrayLike(collection)) {
+        return isString(collection) ? stringSize(collection) : collection.length;
+      }
+      var tag = getTag(collection);
+      if (tag == mapTag || tag == setTag) {
+        return collection.size;
+      }
+      return baseKeys(collection).length;
+    }
+
+    /**
+     * Checks if `predicate` returns truthy for **any** element of `collection`.
+     * Iteration is stopped once `predicate` returns truthy. The predicate is
+     * invoked with three arguments: (value, index|key, collection).
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {boolean} Returns `true` if any element passes the predicate check,
+     *  else `false`.
+     * @example
+     *
+     * _.some([null, 0, 'yes', false], Boolean);
+     * // => true
+     *
+     * var users = [
+     *   { 'user': 'barney', 'active': true },
+     *   { 'user': 'fred',   'active': false }
+     * ];
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.some(users, { 'user': 'barney', 'active': false });
+     * // => false
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.some(users, ['active', false]);
+     * // => true
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.some(users, 'active');
+     * // => true
+     */
+    function some(collection, predicate, guard) {
+      var func = isArray(collection) ? arraySome : baseSome;
+      if (guard && isIterateeCall(collection, predicate, guard)) {
+        predicate = undefined;
+      }
+      return func(collection, getIteratee(predicate, 3));
+    }
+
+    /**
+     * Creates an array of elements, sorted in ascending order by the results of
+     * running each element in a collection thru each iteratee. This method
+     * performs a stable sort, that is, it preserves the original sort order of
+     * equal elements. The iteratees are invoked with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Collection
+     * @param {Array|Object} collection The collection to iterate over.
+     * @param {...(Function|Function[])} [iteratees=[_.identity]]
+     *  The iteratees to sort by.
+     * @returns {Array} Returns the new sorted array.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'fred',   'age': 48 },
+     *   { 'user': 'barney', 'age': 36 },
+     *   { 'user': 'fred',   'age': 30 },
+     *   { 'user': 'barney', 'age': 34 }
+     * ];
+     *
+     * _.sortBy(users, [function(o) { return o.user; }]);
+     * // => objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 30]]
+     *
+     * _.sortBy(users, ['user', 'age']);
+     * // => objects for [['barney', 34], ['barney', 36], ['fred', 30], ['fred', 48]]
+     */
+    var sortBy = baseRest(function(collection, iteratees) {
+      if (collection == null) {
+        return [];
+      }
+      var length = iteratees.length;
+      if (length > 1 && isIterateeCall(collection, iteratees[0], iteratees[1])) {
+        iteratees = [];
+      } else if (length > 2 && isIterateeCall(iteratees[0], iteratees[1], iteratees[2])) {
+        iteratees = [iteratees[0]];
+      }
+      return baseOrderBy(collection, baseFlatten(iteratees, 1), []);
+    });
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Gets the timestamp of the number of milliseconds that have elapsed since
+     * the Unix epoch (1 January 1970 00:00:00 UTC).
+     *
+     * @static
+     * @memberOf _
+     * @since 2.4.0
+     * @category Date
+     * @returns {number} Returns the timestamp.
+     * @example
+     *
+     * _.defer(function(stamp) {
+     *   console.log(_.now() - stamp);
+     * }, _.now());
+     * // => Logs the number of milliseconds it took for the deferred invocation.
+     */
+    var now = ctxNow || function() {
+      return root.Date.now();
+    };
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * The opposite of `_.before`; this method creates a function that invokes
+     * `func` once it's called `n` or more times.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Function
+     * @param {number} n The number of calls before `func` is invoked.
+     * @param {Function} func The function to restrict.
+     * @returns {Function} Returns the new restricted function.
+     * @example
+     *
+     * var saves = ['profile', 'settings'];
+     *
+     * var done = _.after(saves.length, function() {
+     *   console.log('done saving!');
+     * });
+     *
+     * _.forEach(saves, function(type) {
+     *   asyncSave({ 'type': type, 'complete': done });
+     * });
+     * // => Logs 'done saving!' after the two async saves have completed.
+     */
+    function after(n, func) {
+      if (typeof func != 'function') {
+        throw new TypeError(FUNC_ERROR_TEXT);
+      }
+      n = toInteger(n);
+      return function() {
+        if (--n < 1) {
+          return func.apply(this, arguments);
+        }
+      };
+    }
+
+    /**
+     * Creates a function that invokes `func`, with up to `n` arguments,
+     * ignoring any additional arguments.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Function
+     * @param {Function} func The function to cap arguments for.
+     * @param {number} [n=func.length] The arity cap.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {Function} Returns the new capped function.
+     * @example
+     *
+     * _.map(['6', '8', '10'], _.ary(parseInt, 1));
+     * // => [6, 8, 10]
+     */
+    function ary(func, n, guard) {
+      n = guard ? undefined : n;
+      n = (func && n == null) ? func.length : n;
+      return createWrap(func, WRAP_ARY_FLAG, undefined, undefined, undefined, undefined, n);
+    }
+
+    /**
+     * Creates a function that invokes `func`, with the `this` binding and arguments
+     * of the created function, while it's called less than `n` times. Subsequent
+     * calls to the created function return the result of the last `func` invocation.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Function
+     * @param {number} n The number of calls at which `func` is no longer invoked.
+     * @param {Function} func The function to restrict.
+     * @returns {Function} Returns the new restricted function.
+     * @example
+     *
+     * jQuery(element).on('click', _.before(5, addContactToList));
+     * // => Allows adding up to 4 contacts to the list.
+     */
+    function before(n, func) {
+      var result;
+      if (typeof func != 'function') {
+        throw new TypeError(FUNC_ERROR_TEXT);
+      }
+      n = toInteger(n);
+      return function() {
+        if (--n > 0) {
+          result = func.apply(this, arguments);
+        }
+        if (n <= 1) {
+          func = undefined;
+        }
+        return result;
+      };
+    }
+
+    /**
+     * Creates a function that invokes `func` with the `this` binding of `thisArg`
+     * and `partials` prepended to the arguments it receives.
+     *
+     * The `_.bind.placeholder` value, which defaults to `_` in monolithic builds,
+     * may be used as a placeholder for partially applied arguments.
+     *
+     * **Note:** Unlike native `Function#bind`, this method doesn't set the "length"
+     * property of bound functions.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Function
+     * @param {Function} func The function to bind.
+     * @param {*} thisArg The `this` binding of `func`.
+     * @param {...*} [partials] The arguments to be partially applied.
+     * @returns {Function} Returns the new bound function.
+     * @example
+     *
+     * function greet(greeting, punctuation) {
+     *   return greeting + ' ' + this.user + punctuation;
+     * }
+     *
+     * var object = { 'user': 'fred' };
+     *
+     * var bound = _.bind(greet, object, 'hi');
+     * bound('!');
+     * // => 'hi fred!'
+     *
+     * // Bound with placeholders.
+     * var bound = _.bind(greet, object, _, '!');
+     * bound('hi');
+     * // => 'hi fred!'
+     */
+    var bind = baseRest(function(func, thisArg, partials) {
+      var bitmask = WRAP_BIND_FLAG;
+      if (partials.length) {
+        var holders = replaceHolders(partials, getHolder(bind));
+        bitmask |= WRAP_PARTIAL_FLAG;
+      }
+      return createWrap(func, bitmask, thisArg, partials, holders);
+    });
+
+    /**
+     * Creates a function that invokes the method at `object[key]` with `partials`
+     * prepended to the arguments it receives.
+     *
+     * This method differs from `_.bind` by allowing bound functions to reference
+     * methods that may be redefined or don't yet exist. See
+     * [Peter Michaux's article](http://peter.michaux.ca/articles/lazy-function-definition-pattern)
+     * for more details.
+     *
+     * The `_.bindKey.placeholder` value, which defaults to `_` in monolithic
+     * builds, may be used as a placeholder for partially applied arguments.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.10.0
+     * @category Function
+     * @param {Object} object The object to invoke the method on.
+     * @param {string} key The key of the method.
+     * @param {...*} [partials] The arguments to be partially applied.
+     * @returns {Function} Returns the new bound function.
+     * @example
+     *
+     * var object = {
+     *   'user': 'fred',
+     *   'greet': function(greeting, punctuation) {
+     *     return greeting + ' ' + this.user + punctuation;
+     *   }
+     * };
+     *
+     * var bound = _.bindKey(object, 'greet', 'hi');
+     * bound('!');
+     * // => 'hi fred!'
+     *
+     * object.greet = function(greeting, punctuation) {
+     *   return greeting + 'ya ' + this.user + punctuation;
+     * };
+     *
+     * bound('!');
+     * // => 'hiya fred!'
+     *
+     * // Bound with placeholders.
+     * var bound = _.bindKey(object, 'greet', _, '!');
+     * bound('hi');
+     * // => 'hiya fred!'
+     */
+    var bindKey = baseRest(function(object, key, partials) {
+      var bitmask = WRAP_BIND_FLAG | WRAP_BIND_KEY_FLAG;
+      if (partials.length) {
+        var holders = replaceHolders(partials, getHolder(bindKey));
+        bitmask |= WRAP_PARTIAL_FLAG;
+      }
+      return createWrap(key, bitmask, object, partials, holders);
+    });
+
+    /**
+     * Creates a function that accepts arguments of `func` and either invokes
+     * `func` returning its result, if at least `arity` number of arguments have
+     * been provided, or returns a function that accepts the remaining `func`
+     * arguments, and so on. The arity of `func` may be specified if `func.length`
+     * is not sufficient.
+     *
+     * The `_.curry.placeholder` value, which defaults to `_` in monolithic builds,
+     * may be used as a placeholder for provided arguments.
+     *
+     * **Note:** This method doesn't set the "length" property of curried functions.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.0.0
+     * @category Function
+     * @param {Function} func The function to curry.
+     * @param {number} [arity=func.length] The arity of `func`.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {Function} Returns the new curried function.
+     * @example
+     *
+     * var abc = function(a, b, c) {
+     *   return [a, b, c];
+     * };
+     *
+     * var curried = _.curry(abc);
+     *
+     * curried(1)(2)(3);
+     * // => [1, 2, 3]
+     *
+     * curried(1, 2)(3);
+     * // => [1, 2, 3]
+     *
+     * curried(1, 2, 3);
+     * // => [1, 2, 3]
+     *
+     * // Curried with placeholders.
+     * curried(1)(_, 3)(2);
+     * // => [1, 2, 3]
+     */
+    function curry(func, arity, guard) {
+      arity = guard ? undefined : arity;
+      var result = createWrap(func, WRAP_CURRY_FLAG, undefined, undefined, undefined, undefined, undefined, arity);
+      result.placeholder = curry.placeholder;
+      return result;
+    }
+
+    /**
+     * This method is like `_.curry` except that arguments are applied to `func`
+     * in the manner of `_.partialRight` instead of `_.partial`.
+     *
+     * The `_.curryRight.placeholder` value, which defaults to `_` in monolithic
+     * builds, may be used as a placeholder for provided arguments.
+     *
+     * **Note:** This method doesn't set the "length" property of curried functions.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Function
+     * @param {Function} func The function to curry.
+     * @param {number} [arity=func.length] The arity of `func`.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {Function} Returns the new curried function.
+     * @example
+     *
+     * var abc = function(a, b, c) {
+     *   return [a, b, c];
+     * };
+     *
+     * var curried = _.curryRight(abc);
+     *
+     * curried(3)(2)(1);
+     * // => [1, 2, 3]
+     *
+     * curried(2, 3)(1);
+     * // => [1, 2, 3]
+     *
+     * curried(1, 2, 3);
+     * // => [1, 2, 3]
+     *
+     * // Curried with placeholders.
+     * curried(3)(1, _)(2);
+     * // => [1, 2, 3]
+     */
+    function curryRight(func, arity, guard) {
+      arity = guard ? undefined : arity;
+      var result = createWrap(func, WRAP_CURRY_RIGHT_FLAG, undefined, undefined, undefined, undefined, undefined, arity);
+      result.placeholder = curryRight.placeholder;
+      return result;
+    }
+
+    /**
+     * Creates a debounced function that delays invoking `func` until after `wait`
+     * milliseconds have elapsed since the last time the debounced function was
+     * invoked. The debounced function comes with a `cancel` method to cancel
+     * delayed `func` invocations and a `flush` method to immediately invoke them.
+     * Provide `options` to indicate whether `func` should be invoked on the
+     * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
+     * with the last arguments provided to the debounced function. Subsequent
+     * calls to the debounced function return the result of the last `func`
+     * invocation.
+     *
+     * **Note:** If `leading` and `trailing` options are `true`, `func` is
+     * invoked on the trailing edge of the timeout only if the debounced function
+     * is invoked more than once during the `wait` timeout.
+     *
+     * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
+     * until to the next tick, similar to `setTimeout` with a timeout of `0`.
+     *
+     * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
+     * for details over the differences between `_.debounce` and `_.throttle`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Function
+     * @param {Function} func The function to debounce.
+     * @param {number} [wait=0] The number of milliseconds to delay.
+     * @param {Object} [options={}] The options object.
+     * @param {boolean} [options.leading=false]
+     *  Specify invoking on the leading edge of the timeout.
+     * @param {number} [options.maxWait]
+     *  The maximum time `func` is allowed to be delayed before it's invoked.
+     * @param {boolean} [options.trailing=true]
+     *  Specify invoking on the trailing edge of the timeout.
+     * @returns {Function} Returns the new debounced function.
+     * @example
+     *
+     * // Avoid costly calculations while the window size is in flux.
+     * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
+     *
+     * // Invoke `sendMail` when clicked, debouncing subsequent calls.
+     * jQuery(element).on('click', _.debounce(sendMail, 300, {
+     *   'leading': true,
+     *   'trailing': false
+     * }));
+     *
+     * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
+     * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
+     * var source = new EventSource('/stream');
+     * jQuery(source).on('message', debounced);
+     *
+     * // Cancel the trailing debounced invocation.
+     * jQuery(window).on('popstate', debounced.cancel);
+     */
+    function debounce(func, wait, options) {
+      var lastArgs,
+          lastThis,
+          maxWait,
+          result,
+          timerId,
+          lastCallTime,
+          lastInvokeTime = 0,
+          leading = false,
+          maxing = false,
+          trailing = true;
+
+      if (typeof func != 'function') {
+        throw new TypeError(FUNC_ERROR_TEXT);
+      }
+      wait = toNumber(wait) || 0;
+      if (isObject(options)) {
+        leading = !!options.leading;
+        maxing = 'maxWait' in options;
+        maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
+        trailing = 'trailing' in options ? !!options.trailing : trailing;
+      }
+
+      function invokeFunc(time) {
+        var args = lastArgs,
+            thisArg = lastThis;
+
+        lastArgs = lastThis = undefined;
+        lastInvokeTime = time;
+        result = func.apply(thisArg, args);
+        return result;
+      }
+
+      function leadingEdge(time) {
+        // Reset any `maxWait` timer.
+        lastInvokeTime = time;
+        // Start the timer for the trailing edge.
+        timerId = setTimeout(timerExpired, wait);
+        // Invoke the leading edge.
+        return leading ? invokeFunc(time) : result;
+      }
+
+      function remainingWait(time) {
+        var timeSinceLastCall = time - lastCallTime,
+            timeSinceLastInvoke = time - lastInvokeTime,
+            timeWaiting = wait - timeSinceLastCall;
+
+        return maxing
+          ? nativeMin(timeWaiting, maxWait - timeSinceLastInvoke)
+          : timeWaiting;
+      }
+
+      function shouldInvoke(time) {
+        var timeSinceLastCall = time - lastCallTime,
+            timeSinceLastInvoke = time - lastInvokeTime;
+
+        // Either this is the first call, activity has stopped and we're at the
+        // trailing edge, the system time has gone backwards and we're treating
+        // it as the trailing edge, or we've hit the `maxWait` limit.
+        return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||
+          (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));
+      }
+
+      function timerExpired() {
+        var time = now();
+        if (shouldInvoke(time)) {
+          return trailingEdge(time);
+        }
+        // Restart the timer.
+        timerId = setTimeout(timerExpired, remainingWait(time));
+      }
+
+      function trailingEdge(time) {
+        timerId = undefined;
+
+        // Only invoke if we have `lastArgs` which means `func` has been
+        // debounced at least once.
+        if (trailing && lastArgs) {
+          return invokeFunc(time);
+        }
+        lastArgs = lastThis = undefined;
+        return result;
+      }
+
+      function cancel() {
+        if (timerId !== undefined) {
+          clearTimeout(timerId);
+        }
+        lastInvokeTime = 0;
+        lastArgs = lastCallTime = lastThis = timerId = undefined;
+      }
+
+      function flush() {
+        return timerId === undefined ? result : trailingEdge(now());
+      }
+
+      function debounced() {
+        var time = now(),
+            isInvoking = shouldInvoke(time);
+
+        lastArgs = arguments;
+        lastThis = this;
+        lastCallTime = time;
+
+        if (isInvoking) {
+          if (timerId === undefined) {
+            return leadingEdge(lastCallTime);
+          }
+          if (maxing) {
+            // Handle invocations in a tight loop.
+            clearTimeout(timerId);
+            timerId = setTimeout(timerExpired, wait);
+            return invokeFunc(lastCallTime);
+          }
+        }
+        if (timerId === undefined) {
+          timerId = setTimeout(timerExpired, wait);
+        }
+        return result;
+      }
+      debounced.cancel = cancel;
+      debounced.flush = flush;
+      return debounced;
+    }
+
+    /**
+     * Defers invoking the `func` until the current call stack has cleared. Any
+     * additional arguments are provided to `func` when it's invoked.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Function
+     * @param {Function} func The function to defer.
+     * @param {...*} [args] The arguments to invoke `func` with.
+     * @returns {number} Returns the timer id.
+     * @example
+     *
+     * _.defer(function(text) {
+     *   console.log(text);
+     * }, 'deferred');
+     * // => Logs 'deferred' after one millisecond.
+     */
+    var defer = baseRest(function(func, args) {
+      return baseDelay(func, 1, args);
+    });
+
+    /**
+     * Invokes `func` after `wait` milliseconds. Any additional arguments are
+     * provided to `func` when it's invoked.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Function
+     * @param {Function} func The function to delay.
+     * @param {number} wait The number of milliseconds to delay invocation.
+     * @param {...*} [args] The arguments to invoke `func` with.
+     * @returns {number} Returns the timer id.
+     * @example
+     *
+     * _.delay(function(text) {
+     *   console.log(text);
+     * }, 1000, 'later');
+     * // => Logs 'later' after one second.
+     */
+    var delay = baseRest(function(func, wait, args) {
+      return baseDelay(func, toNumber(wait) || 0, args);
+    });
+
+    /**
+     * Creates a function that invokes `func` with arguments reversed.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Function
+     * @param {Function} func The function to flip arguments for.
+     * @returns {Function} Returns the new flipped function.
+     * @example
+     *
+     * var flipped = _.flip(function() {
+     *   return _.toArray(arguments);
+     * });
+     *
+     * flipped('a', 'b', 'c', 'd');
+     * // => ['d', 'c', 'b', 'a']
+     */
+    function flip(func) {
+      return createWrap(func, WRAP_FLIP_FLAG);
+    }
+
+    /**
+     * Creates a function that memoizes the result of `func`. If `resolver` is
+     * provided, it determines the cache key for storing the result based on the
+     * arguments provided to the memoized function. By default, the first argument
+     * provided to the memoized function is used as the map cache key. The `func`
+     * is invoked with the `this` binding of the memoized function.
+     *
+     * **Note:** The cache is exposed as the `cache` property on the memoized
+     * function. Its creation may be customized by replacing the `_.memoize.Cache`
+     * constructor with one whose instances implement the
+     * [`Map`](http://ecma-international.org/ecma-262/7.0/#sec-properties-of-the-map-prototype-object)
+     * method interface of `clear`, `delete`, `get`, `has`, and `set`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Function
+     * @param {Function} func The function to have its output memoized.
+     * @param {Function} [resolver] The function to resolve the cache key.
+     * @returns {Function} Returns the new memoized function.
+     * @example
+     *
+     * var object = { 'a': 1, 'b': 2 };
+     * var other = { 'c': 3, 'd': 4 };
+     *
+     * var values = _.memoize(_.values);
+     * values(object);
+     * // => [1, 2]
+     *
+     * values(other);
+     * // => [3, 4]
+     *
+     * object.a = 2;
+     * values(object);
+     * // => [1, 2]
+     *
+     * // Modify the result cache.
+     * values.cache.set(object, ['a', 'b']);
+     * values(object);
+     * // => ['a', 'b']
+     *
+     * // Replace `_.memoize.Cache`.
+     * _.memoize.Cache = WeakMap;
+     */
+    function memoize(func, resolver) {
+      if (typeof func != 'function' || (resolver != null && typeof resolver != 'function')) {
+        throw new TypeError(FUNC_ERROR_TEXT);
+      }
+      var memoized = function() {
+        var args = arguments,
+            key = resolver ? resolver.apply(this, args) : args[0],
+            cache = memoized.cache;
+
+        if (cache.has(key)) {
+          return cache.get(key);
+        }
+        var result = func.apply(this, args);
+        memoized.cache = cache.set(key, result) || cache;
+        return result;
+      };
+      memoized.cache = new (memoize.Cache || MapCache);
+      return memoized;
+    }
+
+    // Expose `MapCache`.
+    memoize.Cache = MapCache;
+
+    /**
+     * Creates a function that negates the result of the predicate `func`. The
+     * `func` predicate is invoked with the `this` binding and arguments of the
+     * created function.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Function
+     * @param {Function} predicate The predicate to negate.
+     * @returns {Function} Returns the new negated function.
+     * @example
+     *
+     * function isEven(n) {
+     *   return n % 2 == 0;
+     * }
+     *
+     * _.filter([1, 2, 3, 4, 5, 6], _.negate(isEven));
+     * // => [1, 3, 5]
+     */
+    function negate(predicate) {
+      if (typeof predicate != 'function') {
+        throw new TypeError(FUNC_ERROR_TEXT);
+      }
+      return function() {
+        var args = arguments;
+        switch (args.length) {
+          case 0: return !predicate.call(this);
+          case 1: return !predicate.call(this, args[0]);
+          case 2: return !predicate.call(this, args[0], args[1]);
+          case 3: return !predicate.call(this, args[0], args[1], args[2]);
+        }
+        return !predicate.apply(this, args);
+      };
+    }
+
+    /**
+     * Creates a function that is restricted to invoking `func` once. Repeat calls
+     * to the function return the value of the first invocation. The `func` is
+     * invoked with the `this` binding and arguments of the created function.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Function
+     * @param {Function} func The function to restrict.
+     * @returns {Function} Returns the new restricted function.
+     * @example
+     *
+     * var initialize = _.once(createApplication);
+     * initialize();
+     * initialize();
+     * // => `createApplication` is invoked once
+     */
+    function once(func) {
+      return before(2, func);
+    }
+
+    /**
+     * Creates a function that invokes `func` with its arguments transformed.
+     *
+     * @static
+     * @since 4.0.0
+     * @memberOf _
+     * @category Function
+     * @param {Function} func The function to wrap.
+     * @param {...(Function|Function[])} [transforms=[_.identity]]
+     *  The argument transforms.
+     * @returns {Function} Returns the new function.
+     * @example
+     *
+     * function doubled(n) {
+     *   return n * 2;
+     * }
+     *
+     * function square(n) {
+     *   return n * n;
+     * }
+     *
+     * var func = _.overArgs(function(x, y) {
+     *   return [x, y];
+     * }, [square, doubled]);
+     *
+     * func(9, 3);
+     * // => [81, 6]
+     *
+     * func(10, 5);
+     * // => [100, 10]
+     */
+    var overArgs = castRest(function(func, transforms) {
+      transforms = (transforms.length == 1 && isArray(transforms[0]))
+        ? arrayMap(transforms[0], baseUnary(getIteratee()))
+        : arrayMap(baseFlatten(transforms, 1), baseUnary(getIteratee()));
+
+      var funcsLength = transforms.length;
+      return baseRest(function(args) {
+        var index = -1,
+            length = nativeMin(args.length, funcsLength);
+
+        while (++index < length) {
+          args[index] = transforms[index].call(this, args[index]);
+        }
+        return apply(func, this, args);
+      });
+    });
+
+    /**
+     * Creates a function that invokes `func` with `partials` prepended to the
+     * arguments it receives. This method is like `_.bind` except it does **not**
+     * alter the `this` binding.
+     *
+     * The `_.partial.placeholder` value, which defaults to `_` in monolithic
+     * builds, may be used as a placeholder for partially applied arguments.
+     *
+     * **Note:** This method doesn't set the "length" property of partially
+     * applied functions.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.2.0
+     * @category Function
+     * @param {Function} func The function to partially apply arguments to.
+     * @param {...*} [partials] The arguments to be partially applied.
+     * @returns {Function} Returns the new partially applied function.
+     * @example
+     *
+     * function greet(greeting, name) {
+     *   return greeting + ' ' + name;
+     * }
+     *
+     * var sayHelloTo = _.partial(greet, 'hello');
+     * sayHelloTo('fred');
+     * // => 'hello fred'
+     *
+     * // Partially applied with placeholders.
+     * var greetFred = _.partial(greet, _, 'fred');
+     * greetFred('hi');
+     * // => 'hi fred'
+     */
+    var partial = baseRest(function(func, partials) {
+      var holders = replaceHolders(partials, getHolder(partial));
+      return createWrap(func, WRAP_PARTIAL_FLAG, undefined, partials, holders);
+    });
+
+    /**
+     * This method is like `_.partial` except that partially applied arguments
+     * are appended to the arguments it receives.
+     *
+     * The `_.partialRight.placeholder` value, which defaults to `_` in monolithic
+     * builds, may be used as a placeholder for partially applied arguments.
+     *
+     * **Note:** This method doesn't set the "length" property of partially
+     * applied functions.
+     *
+     * @static
+     * @memberOf _
+     * @since 1.0.0
+     * @category Function
+     * @param {Function} func The function to partially apply arguments to.
+     * @param {...*} [partials] The arguments to be partially applied.
+     * @returns {Function} Returns the new partially applied function.
+     * @example
+     *
+     * function greet(greeting, name) {
+     *   return greeting + ' ' + name;
+     * }
+     *
+     * var greetFred = _.partialRight(greet, 'fred');
+     * greetFred('hi');
+     * // => 'hi fred'
+     *
+     * // Partially applied with placeholders.
+     * var sayHelloTo = _.partialRight(greet, 'hello', _);
+     * sayHelloTo('fred');
+     * // => 'hello fred'
+     */
+    var partialRight = baseRest(function(func, partials) {
+      var holders = replaceHolders(partials, getHolder(partialRight));
+      return createWrap(func, WRAP_PARTIAL_RIGHT_FLAG, undefined, partials, holders);
+    });
+
+    /**
+     * Creates a function that invokes `func` with arguments arranged according
+     * to the specified `indexes` where the argument value at the first index is
+     * provided as the first argument, the argument value at the second index is
+     * provided as the second argument, and so on.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Function
+     * @param {Function} func The function to rearrange arguments for.
+     * @param {...(number|number[])} indexes The arranged argument indexes.
+     * @returns {Function} Returns the new function.
+     * @example
+     *
+     * var rearged = _.rearg(function(a, b, c) {
+     *   return [a, b, c];
+     * }, [2, 0, 1]);
+     *
+     * rearged('b', 'c', 'a')
+     * // => ['a', 'b', 'c']
+     */
+    var rearg = flatRest(function(func, indexes) {
+      return createWrap(func, WRAP_REARG_FLAG, undefined, undefined, undefined, indexes);
+    });
+
+    /**
+     * Creates a function that invokes `func` with the `this` binding of the
+     * created function and arguments from `start` and beyond provided as
+     * an array.
+     *
+     * **Note:** This method is based on the
+     * [rest parameter](https://mdn.io/rest_parameters).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Function
+     * @param {Function} func The function to apply a rest parameter to.
+     * @param {number} [start=func.length-1] The start position of the rest parameter.
+     * @returns {Function} Returns the new function.
+     * @example
+     *
+     * var say = _.rest(function(what, names) {
+     *   return what + ' ' + _.initial(names).join(', ') +
+     *     (_.size(names) > 1 ? ', & ' : '') + _.last(names);
+     * });
+     *
+     * say('hello', 'fred', 'barney', 'pebbles');
+     * // => 'hello fred, barney, & pebbles'
+     */
+    function rest(func, start) {
+      if (typeof func != 'function') {
+        throw new TypeError(FUNC_ERROR_TEXT);
+      }
+      start = start === undefined ? start : toInteger(start);
+      return baseRest(func, start);
+    }
+
+    /**
+     * Creates a function that invokes `func` with the `this` binding of the
+     * create function and an array of arguments much like
+     * [`Function#apply`](http://www.ecma-international.org/ecma-262/7.0/#sec-function.prototype.apply).
+     *
+     * **Note:** This method is based on the
+     * [spread operator](https://mdn.io/spread_operator).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.2.0
+     * @category Function
+     * @param {Function} func The function to spread arguments over.
+     * @param {number} [start=0] The start position of the spread.
+     * @returns {Function} Returns the new function.
+     * @example
+     *
+     * var say = _.spread(function(who, what) {
+     *   return who + ' says ' + what;
+     * });
+     *
+     * say(['fred', 'hello']);
+     * // => 'fred says hello'
+     *
+     * var numbers = Promise.all([
+     *   Promise.resolve(40),
+     *   Promise.resolve(36)
+     * ]);
+     *
+     * numbers.then(_.spread(function(x, y) {
+     *   return x + y;
+     * }));
+     * // => a Promise of 76
+     */
+    function spread(func, start) {
+      if (typeof func != 'function') {
+        throw new TypeError(FUNC_ERROR_TEXT);
+      }
+      start = start == null ? 0 : nativeMax(toInteger(start), 0);
+      return baseRest(function(args) {
+        var array = args[start],
+            otherArgs = castSlice(args, 0, start);
+
+        if (array) {
+          arrayPush(otherArgs, array);
+        }
+        return apply(func, this, otherArgs);
+      });
+    }
+
+    /**
+     * Creates a throttled function that only invokes `func` at most once per
+     * every `wait` milliseconds. The throttled function comes with a `cancel`
+     * method to cancel delayed `func` invocations and a `flush` method to
+     * immediately invoke them. Provide `options` to indicate whether `func`
+     * should be invoked on the leading and/or trailing edge of the `wait`
+     * timeout. The `func` is invoked with the last arguments provided to the
+     * throttled function. Subsequent calls to the throttled function return the
+     * result of the last `func` invocation.
+     *
+     * **Note:** If `leading` and `trailing` options are `true`, `func` is
+     * invoked on the trailing edge of the timeout only if the throttled function
+     * is invoked more than once during the `wait` timeout.
+     *
+     * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
+     * until to the next tick, similar to `setTimeout` with a timeout of `0`.
+     *
+     * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
+     * for details over the differences between `_.throttle` and `_.debounce`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Function
+     * @param {Function} func The function to throttle.
+     * @param {number} [wait=0] The number of milliseconds to throttle invocations to.
+     * @param {Object} [options={}] The options object.
+     * @param {boolean} [options.leading=true]
+     *  Specify invoking on the leading edge of the timeout.
+     * @param {boolean} [options.trailing=true]
+     *  Specify invoking on the trailing edge of the timeout.
+     * @returns {Function} Returns the new throttled function.
+     * @example
+     *
+     * // Avoid excessively updating the position while scrolling.
+     * jQuery(window).on('scroll', _.throttle(updatePosition, 100));
+     *
+     * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
+     * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
+     * jQuery(element).on('click', throttled);
+     *
+     * // Cancel the trailing throttled invocation.
+     * jQuery(window).on('popstate', throttled.cancel);
+     */
+    function throttle(func, wait, options) {
+      var leading = true,
+          trailing = true;
+
+      if (typeof func != 'function') {
+        throw new TypeError(FUNC_ERROR_TEXT);
+      }
+      if (isObject(options)) {
+        leading = 'leading' in options ? !!options.leading : leading;
+        trailing = 'trailing' in options ? !!options.trailing : trailing;
+      }
+      return debounce(func, wait, {
+        'leading': leading,
+        'maxWait': wait,
+        'trailing': trailing
+      });
+    }
+
+    /**
+     * Creates a function that accepts up to one argument, ignoring any
+     * additional arguments.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Function
+     * @param {Function} func The function to cap arguments for.
+     * @returns {Function} Returns the new capped function.
+     * @example
+     *
+     * _.map(['6', '8', '10'], _.unary(parseInt));
+     * // => [6, 8, 10]
+     */
+    function unary(func) {
+      return ary(func, 1);
+    }
+
+    /**
+     * Creates a function that provides `value` to `wrapper` as its first
+     * argument. Any additional arguments provided to the function are appended
+     * to those provided to the `wrapper`. The wrapper is invoked with the `this`
+     * binding of the created function.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Function
+     * @param {*} value The value to wrap.
+     * @param {Function} [wrapper=identity] The wrapper function.
+     * @returns {Function} Returns the new function.
+     * @example
+     *
+     * var p = _.wrap(_.escape, function(func, text) {
+     *   return '<p>' + func(text) + '</p>';
+     * });
+     *
+     * p('fred, barney, & pebbles');
+     * // => '<p>fred, barney, &amp; pebbles</p>'
+     */
+    function wrap(value, wrapper) {
+      return partial(castFunction(wrapper), value);
+    }
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Casts `value` as an array if it's not one.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.4.0
+     * @category Lang
+     * @param {*} value The value to inspect.
+     * @returns {Array} Returns the cast array.
+     * @example
+     *
+     * _.castArray(1);
+     * // => [1]
+     *
+     * _.castArray({ 'a': 1 });
+     * // => [{ 'a': 1 }]
+     *
+     * _.castArray('abc');
+     * // => ['abc']
+     *
+     * _.castArray(null);
+     * // => [null]
+     *
+     * _.castArray(undefined);
+     * // => [undefined]
+     *
+     * _.castArray();
+     * // => []
+     *
+     * var array = [1, 2, 3];
+     * console.log(_.castArray(array) === array);
+     * // => true
+     */
+    function castArray() {
+      if (!arguments.length) {
+        return [];
+      }
+      var value = arguments[0];
+      return isArray(value) ? value : [value];
+    }
+
+    /**
+     * Creates a shallow clone of `value`.
+     *
+     * **Note:** This method is loosely based on the
+     * [structured clone algorithm](https://mdn.io/Structured_clone_algorithm)
+     * and supports cloning arrays, array buffers, booleans, date objects, maps,
+     * numbers, `Object` objects, regexes, sets, strings, symbols, and typed
+     * arrays. The own enumerable properties of `arguments` objects are cloned
+     * as plain objects. An empty object is returned for uncloneable values such
+     * as error objects, functions, DOM nodes, and WeakMaps.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to clone.
+     * @returns {*} Returns the cloned value.
+     * @see _.cloneDeep
+     * @example
+     *
+     * var objects = [{ 'a': 1 }, { 'b': 2 }];
+     *
+     * var shallow = _.clone(objects);
+     * console.log(shallow[0] === objects[0]);
+     * // => true
+     */
+    function clone(value) {
+      return baseClone(value, CLONE_SYMBOLS_FLAG);
+    }
+
+    /**
+     * This method is like `_.clone` except that it accepts `customizer` which
+     * is invoked to produce the cloned value. If `customizer` returns `undefined`,
+     * cloning is handled by the method instead. The `customizer` is invoked with
+     * up to four arguments; (value [, index|key, object, stack]).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to clone.
+     * @param {Function} [customizer] The function to customize cloning.
+     * @returns {*} Returns the cloned value.
+     * @see _.cloneDeepWith
+     * @example
+     *
+     * function customizer(value) {
+     *   if (_.isElement(value)) {
+     *     return value.cloneNode(false);
+     *   }
+     * }
+     *
+     * var el = _.cloneWith(document.body, customizer);
+     *
+     * console.log(el === document.body);
+     * // => false
+     * console.log(el.nodeName);
+     * // => 'BODY'
+     * console.log(el.childNodes.length);
+     * // => 0
+     */
+    function cloneWith(value, customizer) {
+      customizer = typeof customizer == 'function' ? customizer : undefined;
+      return baseClone(value, CLONE_SYMBOLS_FLAG, customizer);
+    }
+
+    /**
+     * This method is like `_.clone` except that it recursively clones `value`.
+     *
+     * @static
+     * @memberOf _
+     * @since 1.0.0
+     * @category Lang
+     * @param {*} value The value to recursively clone.
+     * @returns {*} Returns the deep cloned value.
+     * @see _.clone
+     * @example
+     *
+     * var objects = [{ 'a': 1 }, { 'b': 2 }];
+     *
+     * var deep = _.cloneDeep(objects);
+     * console.log(deep[0] === objects[0]);
+     * // => false
+     */
+    function cloneDeep(value) {
+      return baseClone(value, CLONE_DEEP_FLAG | CLONE_SYMBOLS_FLAG);
+    }
+
+    /**
+     * This method is like `_.cloneWith` except that it recursively clones `value`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to recursively clone.
+     * @param {Function} [customizer] The function to customize cloning.
+     * @returns {*} Returns the deep cloned value.
+     * @see _.cloneWith
+     * @example
+     *
+     * function customizer(value) {
+     *   if (_.isElement(value)) {
+     *     return value.cloneNode(true);
+     *   }
+     * }
+     *
+     * var el = _.cloneDeepWith(document.body, customizer);
+     *
+     * console.log(el === document.body);
+     * // => false
+     * console.log(el.nodeName);
+     * // => 'BODY'
+     * console.log(el.childNodes.length);
+     * // => 20
+     */
+    function cloneDeepWith(value, customizer) {
+      customizer = typeof customizer == 'function' ? customizer : undefined;
+      return baseClone(value, CLONE_DEEP_FLAG | CLONE_SYMBOLS_FLAG, customizer);
+    }
+
+    /**
+     * Checks if `object` conforms to `source` by invoking the predicate
+     * properties of `source` with the corresponding property values of `object`.
+     *
+     * **Note:** This method is equivalent to `_.conforms` when `source` is
+     * partially applied.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.14.0
+     * @category Lang
+     * @param {Object} object The object to inspect.
+     * @param {Object} source The object of property predicates to conform to.
+     * @returns {boolean} Returns `true` if `object` conforms, else `false`.
+     * @example
+     *
+     * var object = { 'a': 1, 'b': 2 };
+     *
+     * _.conformsTo(object, { 'b': function(n) { return n > 1; } });
+     * // => true
+     *
+     * _.conformsTo(object, { 'b': function(n) { return n > 2; } });
+     * // => false
+     */
+    function conformsTo(object, source) {
+      return source == null || baseConformsTo(object, source, keys(source));
+    }
+
+    /**
+     * Performs a
+     * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
+     * comparison between two values to determine if they are equivalent.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to compare.
+     * @param {*} other The other value to compare.
+     * @returns {boolean} Returns `true` if the values are equivalent, else `false`.
+     * @example
+     *
+     * var object = { 'a': 1 };
+     * var other = { 'a': 1 };
+     *
+     * _.eq(object, object);
+     * // => true
+     *
+     * _.eq(object, other);
+     * // => false
+     *
+     * _.eq('a', 'a');
+     * // => true
+     *
+     * _.eq('a', Object('a'));
+     * // => false
+     *
+     * _.eq(NaN, NaN);
+     * // => true
+     */
+    function eq(value, other) {
+      return value === other || (value !== value && other !== other);
+    }
+
+    /**
+     * Checks if `value` is greater than `other`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.9.0
+     * @category Lang
+     * @param {*} value The value to compare.
+     * @param {*} other The other value to compare.
+     * @returns {boolean} Returns `true` if `value` is greater than `other`,
+     *  else `false`.
+     * @see _.lt
+     * @example
+     *
+     * _.gt(3, 1);
+     * // => true
+     *
+     * _.gt(3, 3);
+     * // => false
+     *
+     * _.gt(1, 3);
+     * // => false
+     */
+    var gt = createRelationalOperation(baseGt);
+
+    /**
+     * Checks if `value` is greater than or equal to `other`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.9.0
+     * @category Lang
+     * @param {*} value The value to compare.
+     * @param {*} other The other value to compare.
+     * @returns {boolean} Returns `true` if `value` is greater than or equal to
+     *  `other`, else `false`.
+     * @see _.lte
+     * @example
+     *
+     * _.gte(3, 1);
+     * // => true
+     *
+     * _.gte(3, 3);
+     * // => true
+     *
+     * _.gte(1, 3);
+     * // => false
+     */
+    var gte = createRelationalOperation(function(value, other) {
+      return value >= other;
+    });
+
+    /**
+     * Checks if `value` is likely an `arguments` object.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is an `arguments` object,
+     *  else `false`.
+     * @example
+     *
+     * _.isArguments(function() { return arguments; }());
+     * // => true
+     *
+     * _.isArguments([1, 2, 3]);
+     * // => false
+     */
+    var isArguments = baseIsArguments(function() { return arguments; }()) ? baseIsArguments : function(value) {
+      return isObjectLike(value) && hasOwnProperty.call(value, 'callee') &&
+        !propertyIsEnumerable.call(value, 'callee');
+    };
+
+    /**
+     * Checks if `value` is classified as an `Array` object.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is an array, else `false`.
+     * @example
+     *
+     * _.isArray([1, 2, 3]);
+     * // => true
+     *
+     * _.isArray(document.body.children);
+     * // => false
+     *
+     * _.isArray('abc');
+     * // => false
+     *
+     * _.isArray(_.noop);
+     * // => false
+     */
+    var isArray = Array.isArray;
+
+    /**
+     * Checks if `value` is classified as an `ArrayBuffer` object.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.3.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is an array buffer, else `false`.
+     * @example
+     *
+     * _.isArrayBuffer(new ArrayBuffer(2));
+     * // => true
+     *
+     * _.isArrayBuffer(new Array(2));
+     * // => false
+     */
+    var isArrayBuffer = nodeIsArrayBuffer ? baseUnary(nodeIsArrayBuffer) : baseIsArrayBuffer;
+
+    /**
+     * Checks if `value` is array-like. A value is considered array-like if it's
+     * not a function and has a `value.length` that's an integer greater than or
+     * equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is array-like, else `false`.
+     * @example
+     *
+     * _.isArrayLike([1, 2, 3]);
+     * // => true
+     *
+     * _.isArrayLike(document.body.children);
+     * // => true
+     *
+     * _.isArrayLike('abc');
+     * // => true
+     *
+     * _.isArrayLike(_.noop);
+     * // => false
+     */
+    function isArrayLike(value) {
+      return value != null && isLength(value.length) && !isFunction(value);
+    }
+
+    /**
+     * This method is like `_.isArrayLike` except that it also checks if `value`
+     * is an object.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is an array-like object,
+     *  else `false`.
+     * @example
+     *
+     * _.isArrayLikeObject([1, 2, 3]);
+     * // => true
+     *
+     * _.isArrayLikeObject(document.body.children);
+     * // => true
+     *
+     * _.isArrayLikeObject('abc');
+     * // => false
+     *
+     * _.isArrayLikeObject(_.noop);
+     * // => false
+     */
+    function isArrayLikeObject(value) {
+      return isObjectLike(value) && isArrayLike(value);
+    }
+
+    /**
+     * Checks if `value` is classified as a boolean primitive or object.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a boolean, else `false`.
+     * @example
+     *
+     * _.isBoolean(false);
+     * // => true
+     *
+     * _.isBoolean(null);
+     * // => false
+     */
+    function isBoolean(value) {
+      return value === true || value === false ||
+        (isObjectLike(value) && baseGetTag(value) == boolTag);
+    }
+
+    /**
+     * Checks if `value` is a buffer.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.3.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a buffer, else `false`.
+     * @example
+     *
+     * _.isBuffer(new Buffer(2));
+     * // => true
+     *
+     * _.isBuffer(new Uint8Array(2));
+     * // => false
+     */
+    var isBuffer = nativeIsBuffer || stubFalse;
+
+    /**
+     * Checks if `value` is classified as a `Date` object.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a date object, else `false`.
+     * @example
+     *
+     * _.isDate(new Date);
+     * // => true
+     *
+     * _.isDate('Mon April 23 2012');
+     * // => false
+     */
+    var isDate = nodeIsDate ? baseUnary(nodeIsDate) : baseIsDate;
+
+    /**
+     * Checks if `value` is likely a DOM element.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a DOM element, else `false`.
+     * @example
+     *
+     * _.isElement(document.body);
+     * // => true
+     *
+     * _.isElement('<body>');
+     * // => false
+     */
+    function isElement(value) {
+      return isObjectLike(value) && value.nodeType === 1 && !isPlainObject(value);
+    }
+
+    /**
+     * Checks if `value` is an empty object, collection, map, or set.
+     *
+     * Objects are considered empty if they have no own enumerable string keyed
+     * properties.
+     *
+     * Array-like values such as `arguments` objects, arrays, buffers, strings, or
+     * jQuery-like collections are considered empty if they have a `length` of `0`.
+     * Similarly, maps and sets are considered empty if they have a `size` of `0`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is empty, else `false`.
+     * @example
+     *
+     * _.isEmpty(null);
+     * // => true
+     *
+     * _.isEmpty(true);
+     * // => true
+     *
+     * _.isEmpty(1);
+     * // => true
+     *
+     * _.isEmpty([1, 2, 3]);
+     * // => false
+     *
+     * _.isEmpty({ 'a': 1 });
+     * // => false
+     */
+    function isEmpty(value) {
+      if (value == null) {
+        return true;
+      }
+      if (isArrayLike(value) &&
+          (isArray(value) || typeof value == 'string' || typeof value.splice == 'function' ||
+            isBuffer(value) || isTypedArray(value) || isArguments(value))) {
+        return !value.length;
+      }
+      var tag = getTag(value);
+      if (tag == mapTag || tag == setTag) {
+        return !value.size;
+      }
+      if (isPrototype(value)) {
+        return !baseKeys(value).length;
+      }
+      for (var key in value) {
+        if (hasOwnProperty.call(value, key)) {
+          return false;
+        }
+      }
+      return true;
+    }
+
+    /**
+     * Performs a deep comparison between two values to determine if they are
+     * equivalent.
+     *
+     * **Note:** This method supports comparing arrays, array buffers, booleans,
+     * date objects, error objects, maps, numbers, `Object` objects, regexes,
+     * sets, strings, symbols, and typed arrays. `Object` objects are compared
+     * by their own, not inherited, enumerable properties. Functions and DOM
+     * nodes are compared by strict equality, i.e. `===`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to compare.
+     * @param {*} other The other value to compare.
+     * @returns {boolean} Returns `true` if the values are equivalent, else `false`.
+     * @example
+     *
+     * var object = { 'a': 1 };
+     * var other = { 'a': 1 };
+     *
+     * _.isEqual(object, other);
+     * // => true
+     *
+     * object === other;
+     * // => false
+     */
+    function isEqual(value, other) {
+      return baseIsEqual(value, other);
+    }
+
+    /**
+     * This method is like `_.isEqual` except that it accepts `customizer` which
+     * is invoked to compare values. If `customizer` returns `undefined`, comparisons
+     * are handled by the method instead. The `customizer` is invoked with up to
+     * six arguments: (objValue, othValue [, index|key, object, other, stack]).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to compare.
+     * @param {*} other The other value to compare.
+     * @param {Function} [customizer] The function to customize comparisons.
+     * @returns {boolean} Returns `true` if the values are equivalent, else `false`.
+     * @example
+     *
+     * function isGreeting(value) {
+     *   return /^h(?:i|ello)$/.test(value);
+     * }
+     *
+     * function customizer(objValue, othValue) {
+     *   if (isGreeting(objValue) && isGreeting(othValue)) {
+     *     return true;
+     *   }
+     * }
+     *
+     * var array = ['hello', 'goodbye'];
+     * var other = ['hi', 'goodbye'];
+     *
+     * _.isEqualWith(array, other, customizer);
+     * // => true
+     */
+    function isEqualWith(value, other, customizer) {
+      customizer = typeof customizer == 'function' ? customizer : undefined;
+      var result = customizer ? customizer(value, other) : undefined;
+      return result === undefined ? baseIsEqual(value, other, undefined, customizer) : !!result;
+    }
+
+    /**
+     * Checks if `value` is an `Error`, `EvalError`, `RangeError`, `ReferenceError`,
+     * `SyntaxError`, `TypeError`, or `URIError` object.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is an error object, else `false`.
+     * @example
+     *
+     * _.isError(new Error);
+     * // => true
+     *
+     * _.isError(Error);
+     * // => false
+     */
+    function isError(value) {
+      if (!isObjectLike(value)) {
+        return false;
+      }
+      var tag = baseGetTag(value);
+      return tag == errorTag || tag == domExcTag ||
+        (typeof value.message == 'string' && typeof value.name == 'string' && !isPlainObject(value));
+    }
+
+    /**
+     * Checks if `value` is a finite primitive number.
+     *
+     * **Note:** This method is based on
+     * [`Number.isFinite`](https://mdn.io/Number/isFinite).
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a finite number, else `false`.
+     * @example
+     *
+     * _.isFinite(3);
+     * // => true
+     *
+     * _.isFinite(Number.MIN_VALUE);
+     * // => true
+     *
+     * _.isFinite(Infinity);
+     * // => false
+     *
+     * _.isFinite('3');
+     * // => false
+     */
+    function isFinite(value) {
+      return typeof value == 'number' && nativeIsFinite(value);
+    }
+
+    /**
+     * Checks if `value` is classified as a `Function` object.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a function, else `false`.
+     * @example
+     *
+     * _.isFunction(_);
+     * // => true
+     *
+     * _.isFunction(/abc/);
+     * // => false
+     */
+    function isFunction(value) {
+      if (!isObject(value)) {
+        return false;
+      }
+      // The use of `Object#toString` avoids issues with the `typeof` operator
+      // in Safari 9 which returns 'object' for typed arrays and other constructors.
+      var tag = baseGetTag(value);
+      return tag == funcTag || tag == genTag || tag == asyncTag || tag == proxyTag;
+    }
+
+    /**
+     * Checks if `value` is an integer.
+     *
+     * **Note:** This method is based on
+     * [`Number.isInteger`](https://mdn.io/Number/isInteger).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is an integer, else `false`.
+     * @example
+     *
+     * _.isInteger(3);
+     * // => true
+     *
+     * _.isInteger(Number.MIN_VALUE);
+     * // => false
+     *
+     * _.isInteger(Infinity);
+     * // => false
+     *
+     * _.isInteger('3');
+     * // => false
+     */
+    function isInteger(value) {
+      return typeof value == 'number' && value == toInteger(value);
+    }
+
+    /**
+     * Checks if `value` is a valid array-like length.
+     *
+     * **Note:** This method is loosely based on
+     * [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a valid length, else `false`.
+     * @example
+     *
+     * _.isLength(3);
+     * // => true
+     *
+     * _.isLength(Number.MIN_VALUE);
+     * // => false
+     *
+     * _.isLength(Infinity);
+     * // => false
+     *
+     * _.isLength('3');
+     * // => false
+     */
+    function isLength(value) {
+      return typeof value == 'number' &&
+        value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
+    }
+
+    /**
+     * Checks if `value` is the
+     * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
+     * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is an object, else `false`.
+     * @example
+     *
+     * _.isObject({});
+     * // => true
+     *
+     * _.isObject([1, 2, 3]);
+     * // => true
+     *
+     * _.isObject(_.noop);
+     * // => true
+     *
+     * _.isObject(null);
+     * // => false
+     */
+    function isObject(value) {
+      var type = typeof value;
+      return value != null && (type == 'object' || type == 'function');
+    }
+
+    /**
+     * Checks if `value` is object-like. A value is object-like if it's not `null`
+     * and has a `typeof` result of "object".
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is object-like, else `false`.
+     * @example
+     *
+     * _.isObjectLike({});
+     * // => true
+     *
+     * _.isObjectLike([1, 2, 3]);
+     * // => true
+     *
+     * _.isObjectLike(_.noop);
+     * // => false
+     *
+     * _.isObjectLike(null);
+     * // => false
+     */
+    function isObjectLike(value) {
+      return value != null && typeof value == 'object';
+    }
+
+    /**
+     * Checks if `value` is classified as a `Map` object.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.3.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a map, else `false`.
+     * @example
+     *
+     * _.isMap(new Map);
+     * // => true
+     *
+     * _.isMap(new WeakMap);
+     * // => false
+     */
+    var isMap = nodeIsMap ? baseUnary(nodeIsMap) : baseIsMap;
+
+    /**
+     * Performs a partial deep comparison between `object` and `source` to
+     * determine if `object` contains equivalent property values.
+     *
+     * **Note:** This method is equivalent to `_.matches` when `source` is
+     * partially applied.
+     *
+     * Partial comparisons will match empty array and empty object `source`
+     * values against any array or object value, respectively. See `_.isEqual`
+     * for a list of supported value comparisons.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Lang
+     * @param {Object} object The object to inspect.
+     * @param {Object} source The object of property values to match.
+     * @returns {boolean} Returns `true` if `object` is a match, else `false`.
+     * @example
+     *
+     * var object = { 'a': 1, 'b': 2 };
+     *
+     * _.isMatch(object, { 'b': 2 });
+     * // => true
+     *
+     * _.isMatch(object, { 'b': 1 });
+     * // => false
+     */
+    function isMatch(object, source) {
+      return object === source || baseIsMatch(object, source, getMatchData(source));
+    }
+
+    /**
+     * This method is like `_.isMatch` except that it accepts `customizer` which
+     * is invoked to compare values. If `customizer` returns `undefined`, comparisons
+     * are handled by the method instead. The `customizer` is invoked with five
+     * arguments: (objValue, srcValue, index|key, object, source).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {Object} object The object to inspect.
+     * @param {Object} source The object of property values to match.
+     * @param {Function} [customizer] The function to customize comparisons.
+     * @returns {boolean} Returns `true` if `object` is a match, else `false`.
+     * @example
+     *
+     * function isGreeting(value) {
+     *   return /^h(?:i|ello)$/.test(value);
+     * }
+     *
+     * function customizer(objValue, srcValue) {
+     *   if (isGreeting(objValue) && isGreeting(srcValue)) {
+     *     return true;
+     *   }
+     * }
+     *
+     * var object = { 'greeting': 'hello' };
+     * var source = { 'greeting': 'hi' };
+     *
+     * _.isMatchWith(object, source, customizer);
+     * // => true
+     */
+    function isMatchWith(object, source, customizer) {
+      customizer = typeof customizer == 'function' ? customizer : undefined;
+      return baseIsMatch(object, source, getMatchData(source), customizer);
+    }
+
+    /**
+     * Checks if `value` is `NaN`.
+     *
+     * **Note:** This method is based on
+     * [`Number.isNaN`](https://mdn.io/Number/isNaN) and is not the same as
+     * global [`isNaN`](https://mdn.io/isNaN) which returns `true` for
+     * `undefined` and other non-number values.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is `NaN`, else `false`.
+     * @example
+     *
+     * _.isNaN(NaN);
+     * // => true
+     *
+     * _.isNaN(new Number(NaN));
+     * // => true
+     *
+     * isNaN(undefined);
+     * // => true
+     *
+     * _.isNaN(undefined);
+     * // => false
+     */
+    function isNaN(value) {
+      // An `NaN` primitive is the only value that is not equal to itself.
+      // Perform the `toStringTag` check first to avoid errors with some
+      // ActiveX objects in IE.
+      return isNumber(value) && value != +value;
+    }
+
+    /**
+     * Checks if `value` is a pristine native function.
+     *
+     * **Note:** This method can't reliably detect native functions in the presence
+     * of the core-js package because core-js circumvents this kind of detection.
+     * Despite multiple requests, the core-js maintainer has made it clear: any
+     * attempt to fix the detection will be obstructed. As a result, we're left
+     * with little choice but to throw an error. Unfortunately, this also affects
+     * packages, like [babel-polyfill](https://www.npmjs.com/package/babel-polyfill),
+     * which rely on core-js.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a native function,
+     *  else `false`.
+     * @example
+     *
+     * _.isNative(Array.prototype.push);
+     * // => true
+     *
+     * _.isNative(_);
+     * // => false
+     */
+    function isNative(value) {
+      if (isMaskable(value)) {
+        throw new Error(CORE_ERROR_TEXT);
+      }
+      return baseIsNative(value);
+    }
+
+    /**
+     * Checks if `value` is `null`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is `null`, else `false`.
+     * @example
+     *
+     * _.isNull(null);
+     * // => true
+     *
+     * _.isNull(void 0);
+     * // => false
+     */
+    function isNull(value) {
+      return value === null;
+    }
+
+    /**
+     * Checks if `value` is `null` or `undefined`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is nullish, else `false`.
+     * @example
+     *
+     * _.isNil(null);
+     * // => true
+     *
+     * _.isNil(void 0);
+     * // => true
+     *
+     * _.isNil(NaN);
+     * // => false
+     */
+    function isNil(value) {
+      return value == null;
+    }
+
+    /**
+     * Checks if `value` is classified as a `Number` primitive or object.
+     *
+     * **Note:** To exclude `Infinity`, `-Infinity`, and `NaN`, which are
+     * classified as numbers, use the `_.isFinite` method.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a number, else `false`.
+     * @example
+     *
+     * _.isNumber(3);
+     * // => true
+     *
+     * _.isNumber(Number.MIN_VALUE);
+     * // => true
+     *
+     * _.isNumber(Infinity);
+     * // => true
+     *
+     * _.isNumber('3');
+     * // => false
+     */
+    function isNumber(value) {
+      return typeof value == 'number' ||
+        (isObjectLike(value) && baseGetTag(value) == numberTag);
+    }
+
+    /**
+     * Checks if `value` is a plain object, that is, an object created by the
+     * `Object` constructor or one with a `[[Prototype]]` of `null`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.8.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a plain object, else `false`.
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     * }
+     *
+     * _.isPlainObject(new Foo);
+     * // => false
+     *
+     * _.isPlainObject([1, 2, 3]);
+     * // => false
+     *
+     * _.isPlainObject({ 'x': 0, 'y': 0 });
+     * // => true
+     *
+     * _.isPlainObject(Object.create(null));
+     * // => true
+     */
+    function isPlainObject(value) {
+      if (!isObjectLike(value) || baseGetTag(value) != objectTag) {
+        return false;
+      }
+      var proto = getPrototype(value);
+      if (proto === null) {
+        return true;
+      }
+      var Ctor = hasOwnProperty.call(proto, 'constructor') && proto.constructor;
+      return typeof Ctor == 'function' && Ctor instanceof Ctor &&
+        funcToString.call(Ctor) == objectCtorString;
+    }
+
+    /**
+     * Checks if `value` is classified as a `RegExp` object.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.1.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a regexp, else `false`.
+     * @example
+     *
+     * _.isRegExp(/abc/);
+     * // => true
+     *
+     * _.isRegExp('/abc/');
+     * // => false
+     */
+    var isRegExp = nodeIsRegExp ? baseUnary(nodeIsRegExp) : baseIsRegExp;
+
+    /**
+     * Checks if `value` is a safe integer. An integer is safe if it's an IEEE-754
+     * double precision number which isn't the result of a rounded unsafe integer.
+     *
+     * **Note:** This method is based on
+     * [`Number.isSafeInteger`](https://mdn.io/Number/isSafeInteger).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a safe integer, else `false`.
+     * @example
+     *
+     * _.isSafeInteger(3);
+     * // => true
+     *
+     * _.isSafeInteger(Number.MIN_VALUE);
+     * // => false
+     *
+     * _.isSafeInteger(Infinity);
+     * // => false
+     *
+     * _.isSafeInteger('3');
+     * // => false
+     */
+    function isSafeInteger(value) {
+      return isInteger(value) && value >= -MAX_SAFE_INTEGER && value <= MAX_SAFE_INTEGER;
+    }
+
+    /**
+     * Checks if `value` is classified as a `Set` object.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.3.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a set, else `false`.
+     * @example
+     *
+     * _.isSet(new Set);
+     * // => true
+     *
+     * _.isSet(new WeakSet);
+     * // => false
+     */
+    var isSet = nodeIsSet ? baseUnary(nodeIsSet) : baseIsSet;
+
+    /**
+     * Checks if `value` is classified as a `String` primitive or object.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a string, else `false`.
+     * @example
+     *
+     * _.isString('abc');
+     * // => true
+     *
+     * _.isString(1);
+     * // => false
+     */
+    function isString(value) {
+      return typeof value == 'string' ||
+        (!isArray(value) && isObjectLike(value) && baseGetTag(value) == stringTag);
+    }
+
+    /**
+     * Checks if `value` is classified as a `Symbol` primitive or object.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.
+     * @example
+     *
+     * _.isSymbol(Symbol.iterator);
+     * // => true
+     *
+     * _.isSymbol('abc');
+     * // => false
+     */
+    function isSymbol(value) {
+      return typeof value == 'symbol' ||
+        (isObjectLike(value) && baseGetTag(value) == symbolTag);
+    }
+
+    /**
+     * Checks if `value` is classified as a typed array.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.
+     * @example
+     *
+     * _.isTypedArray(new Uint8Array);
+     * // => true
+     *
+     * _.isTypedArray([]);
+     * // => false
+     */
+    var isTypedArray = nodeIsTypedArray ? baseUnary(nodeIsTypedArray) : baseIsTypedArray;
+
+    /**
+     * Checks if `value` is `undefined`.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is `undefined`, else `false`.
+     * @example
+     *
+     * _.isUndefined(void 0);
+     * // => true
+     *
+     * _.isUndefined(null);
+     * // => false
+     */
+    function isUndefined(value) {
+      return value === undefined;
+    }
+
+    /**
+     * Checks if `value` is classified as a `WeakMap` object.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.3.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a weak map, else `false`.
+     * @example
+     *
+     * _.isWeakMap(new WeakMap);
+     * // => true
+     *
+     * _.isWeakMap(new Map);
+     * // => false
+     */
+    function isWeakMap(value) {
+      return isObjectLike(value) && getTag(value) == weakMapTag;
+    }
+
+    /**
+     * Checks if `value` is classified as a `WeakSet` object.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.3.0
+     * @category Lang
+     * @param {*} value The value to check.
+     * @returns {boolean} Returns `true` if `value` is a weak set, else `false`.
+     * @example
+     *
+     * _.isWeakSet(new WeakSet);
+     * // => true
+     *
+     * _.isWeakSet(new Set);
+     * // => false
+     */
+    function isWeakSet(value) {
+      return isObjectLike(value) && baseGetTag(value) == weakSetTag;
+    }
+
+    /**
+     * Checks if `value` is less than `other`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.9.0
+     * @category Lang
+     * @param {*} value The value to compare.
+     * @param {*} other The other value to compare.
+     * @returns {boolean} Returns `true` if `value` is less than `other`,
+     *  else `false`.
+     * @see _.gt
+     * @example
+     *
+     * _.lt(1, 3);
+     * // => true
+     *
+     * _.lt(3, 3);
+     * // => false
+     *
+     * _.lt(3, 1);
+     * // => false
+     */
+    var lt = createRelationalOperation(baseLt);
+
+    /**
+     * Checks if `value` is less than or equal to `other`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.9.0
+     * @category Lang
+     * @param {*} value The value to compare.
+     * @param {*} other The other value to compare.
+     * @returns {boolean} Returns `true` if `value` is less than or equal to
+     *  `other`, else `false`.
+     * @see _.gte
+     * @example
+     *
+     * _.lte(1, 3);
+     * // => true
+     *
+     * _.lte(3, 3);
+     * // => true
+     *
+     * _.lte(3, 1);
+     * // => false
+     */
+    var lte = createRelationalOperation(function(value, other) {
+      return value <= other;
+    });
+
+    /**
+     * Converts `value` to an array.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Lang
+     * @param {*} value The value to convert.
+     * @returns {Array} Returns the converted array.
+     * @example
+     *
+     * _.toArray({ 'a': 1, 'b': 2 });
+     * // => [1, 2]
+     *
+     * _.toArray('abc');
+     * // => ['a', 'b', 'c']
+     *
+     * _.toArray(1);
+     * // => []
+     *
+     * _.toArray(null);
+     * // => []
+     */
+    function toArray(value) {
+      if (!value) {
+        return [];
+      }
+      if (isArrayLike(value)) {
+        return isString(value) ? stringToArray(value) : copyArray(value);
+      }
+      if (symIterator && value[symIterator]) {
+        return iteratorToArray(value[symIterator]());
+      }
+      var tag = getTag(value),
+          func = tag == mapTag ? mapToArray : (tag == setTag ? setToArray : values);
+
+      return func(value);
+    }
+
+    /**
+     * Converts `value` to a finite number.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.12.0
+     * @category Lang
+     * @param {*} value The value to convert.
+     * @returns {number} Returns the converted number.
+     * @example
+     *
+     * _.toFinite(3.2);
+     * // => 3.2
+     *
+     * _.toFinite(Number.MIN_VALUE);
+     * // => 5e-324
+     *
+     * _.toFinite(Infinity);
+     * // => 1.7976931348623157e+308
+     *
+     * _.toFinite('3.2');
+     * // => 3.2
+     */
+    function toFinite(value) {
+      if (!value) {
+        return value === 0 ? value : 0;
+      }
+      value = toNumber(value);
+      if (value === INFINITY || value === -INFINITY) {
+        var sign = (value < 0 ? -1 : 1);
+        return sign * MAX_INTEGER;
+      }
+      return value === value ? value : 0;
+    }
+
+    /**
+     * Converts `value` to an integer.
+     *
+     * **Note:** This method is loosely based on
+     * [`ToInteger`](http://www.ecma-international.org/ecma-262/7.0/#sec-tointeger).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to convert.
+     * @returns {number} Returns the converted integer.
+     * @example
+     *
+     * _.toInteger(3.2);
+     * // => 3
+     *
+     * _.toInteger(Number.MIN_VALUE);
+     * // => 0
+     *
+     * _.toInteger(Infinity);
+     * // => 1.7976931348623157e+308
+     *
+     * _.toInteger('3.2');
+     * // => 3
+     */
+    function toInteger(value) {
+      var result = toFinite(value),
+          remainder = result % 1;
+
+      return result === result ? (remainder ? result - remainder : result) : 0;
+    }
+
+    /**
+     * Converts `value` to an integer suitable for use as the length of an
+     * array-like object.
+     *
+     * **Note:** This method is based on
+     * [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to convert.
+     * @returns {number} Returns the converted integer.
+     * @example
+     *
+     * _.toLength(3.2);
+     * // => 3
+     *
+     * _.toLength(Number.MIN_VALUE);
+     * // => 0
+     *
+     * _.toLength(Infinity);
+     * // => 4294967295
+     *
+     * _.toLength('3.2');
+     * // => 3
+     */
+    function toLength(value) {
+      return value ? baseClamp(toInteger(value), 0, MAX_ARRAY_LENGTH) : 0;
+    }
+
+    /**
+     * Converts `value` to a number.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to process.
+     * @returns {number} Returns the number.
+     * @example
+     *
+     * _.toNumber(3.2);
+     * // => 3.2
+     *
+     * _.toNumber(Number.MIN_VALUE);
+     * // => 5e-324
+     *
+     * _.toNumber(Infinity);
+     * // => Infinity
+     *
+     * _.toNumber('3.2');
+     * // => 3.2
+     */
+    function toNumber(value) {
+      if (typeof value == 'number') {
+        return value;
+      }
+      if (isSymbol(value)) {
+        return NAN;
+      }
+      if (isObject(value)) {
+        var other = typeof value.valueOf == 'function' ? value.valueOf() : value;
+        value = isObject(other) ? (other + '') : other;
+      }
+      if (typeof value != 'string') {
+        return value === 0 ? value : +value;
+      }
+      value = baseTrim(value);
+      var isBinary = reIsBinary.test(value);
+      return (isBinary || reIsOctal.test(value))
+        ? freeParseInt(value.slice(2), isBinary ? 2 : 8)
+        : (reIsBadHex.test(value) ? NAN : +value);
+    }
+
+    /**
+     * Converts `value` to a plain object flattening inherited enumerable string
+     * keyed properties of `value` to own properties of the plain object.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Lang
+     * @param {*} value The value to convert.
+     * @returns {Object} Returns the converted plain object.
+     * @example
+     *
+     * function Foo() {
+     *   this.b = 2;
+     * }
+     *
+     * Foo.prototype.c = 3;
+     *
+     * _.assign({ 'a': 1 }, new Foo);
+     * // => { 'a': 1, 'b': 2 }
+     *
+     * _.assign({ 'a': 1 }, _.toPlainObject(new Foo));
+     * // => { 'a': 1, 'b': 2, 'c': 3 }
+     */
+    function toPlainObject(value) {
+      return copyObject(value, keysIn(value));
+    }
+
+    /**
+     * Converts `value` to a safe integer. A safe integer can be compared and
+     * represented correctly.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to convert.
+     * @returns {number} Returns the converted integer.
+     * @example
+     *
+     * _.toSafeInteger(3.2);
+     * // => 3
+     *
+     * _.toSafeInteger(Number.MIN_VALUE);
+     * // => 0
+     *
+     * _.toSafeInteger(Infinity);
+     * // => 9007199254740991
+     *
+     * _.toSafeInteger('3.2');
+     * // => 3
+     */
+    function toSafeInteger(value) {
+      return value
+        ? baseClamp(toInteger(value), -MAX_SAFE_INTEGER, MAX_SAFE_INTEGER)
+        : (value === 0 ? value : 0);
+    }
+
+    /**
+     * Converts `value` to a string. An empty string is returned for `null`
+     * and `undefined` values. The sign of `-0` is preserved.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Lang
+     * @param {*} value The value to convert.
+     * @returns {string} Returns the converted string.
+     * @example
+     *
+     * _.toString(null);
+     * // => ''
+     *
+     * _.toString(-0);
+     * // => '-0'
+     *
+     * _.toString([1, 2, 3]);
+     * // => '1,2,3'
+     */
+    function toString(value) {
+      return value == null ? '' : baseToString(value);
+    }
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Assigns own enumerable string keyed properties of source objects to the
+     * destination object. Source objects are applied from left to right.
+     * Subsequent sources overwrite property assignments of previous sources.
+     *
+     * **Note:** This method mutates `object` and is loosely based on
+     * [`Object.assign`](https://mdn.io/Object/assign).
+     *
+     * @static
+     * @memberOf _
+     * @since 0.10.0
+     * @category Object
+     * @param {Object} object The destination object.
+     * @param {...Object} [sources] The source objects.
+     * @returns {Object} Returns `object`.
+     * @see _.assignIn
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     * }
+     *
+     * function Bar() {
+     *   this.c = 3;
+     * }
+     *
+     * Foo.prototype.b = 2;
+     * Bar.prototype.d = 4;
+     *
+     * _.assign({ 'a': 0 }, new Foo, new Bar);
+     * // => { 'a': 1, 'c': 3 }
+     */
+    var assign = createAssigner(function(object, source) {
+      if (isPrototype(source) || isArrayLike(source)) {
+        copyObject(source, keys(source), object);
+        return;
+      }
+      for (var key in source) {
+        if (hasOwnProperty.call(source, key)) {
+          assignValue(object, key, source[key]);
+        }
+      }
+    });
+
+    /**
+     * This method is like `_.assign` except that it iterates over own and
+     * inherited source properties.
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @alias extend
+     * @category Object
+     * @param {Object} object The destination object.
+     * @param {...Object} [sources] The source objects.
+     * @returns {Object} Returns `object`.
+     * @see _.assign
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     * }
+     *
+     * function Bar() {
+     *   this.c = 3;
+     * }
+     *
+     * Foo.prototype.b = 2;
+     * Bar.prototype.d = 4;
+     *
+     * _.assignIn({ 'a': 0 }, new Foo, new Bar);
+     * // => { 'a': 1, 'b': 2, 'c': 3, 'd': 4 }
+     */
+    var assignIn = createAssigner(function(object, source) {
+      copyObject(source, keysIn(source), object);
+    });
+
+    /**
+     * This method is like `_.assignIn` except that it accepts `customizer`
+     * which is invoked to produce the assigned values. If `customizer` returns
+     * `undefined`, assignment is handled by the method instead. The `customizer`
+     * is invoked with five arguments: (objValue, srcValue, key, object, source).
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @alias extendWith
+     * @category Object
+     * @param {Object} object The destination object.
+     * @param {...Object} sources The source objects.
+     * @param {Function} [customizer] The function to customize assigned values.
+     * @returns {Object} Returns `object`.
+     * @see _.assignWith
+     * @example
+     *
+     * function customizer(objValue, srcValue) {
+     *   return _.isUndefined(objValue) ? srcValue : objValue;
+     * }
+     *
+     * var defaults = _.partialRight(_.assignInWith, customizer);
+     *
+     * defaults({ 'a': 1 }, { 'b': 2 }, { 'a': 3 });
+     * // => { 'a': 1, 'b': 2 }
+     */
+    var assignInWith = createAssigner(function(object, source, srcIndex, customizer) {
+      copyObject(source, keysIn(source), object, customizer);
+    });
+
+    /**
+     * This method is like `_.assign` except that it accepts `customizer`
+     * which is invoked to produce the assigned values. If `customizer` returns
+     * `undefined`, assignment is handled by the method instead. The `customizer`
+     * is invoked with five arguments: (objValue, srcValue, key, object, source).
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Object
+     * @param {Object} object The destination object.
+     * @param {...Object} sources The source objects.
+     * @param {Function} [customizer] The function to customize assigned values.
+     * @returns {Object} Returns `object`.
+     * @see _.assignInWith
+     * @example
+     *
+     * function customizer(objValue, srcValue) {
+     *   return _.isUndefined(objValue) ? srcValue : objValue;
+     * }
+     *
+     * var defaults = _.partialRight(_.assignWith, customizer);
+     *
+     * defaults({ 'a': 1 }, { 'b': 2 }, { 'a': 3 });
+     * // => { 'a': 1, 'b': 2 }
+     */
+    var assignWith = createAssigner(function(object, source, srcIndex, customizer) {
+      copyObject(source, keys(source), object, customizer);
+    });
+
+    /**
+     * Creates an array of values corresponding to `paths` of `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 1.0.0
+     * @category Object
+     * @param {Object} object The object to iterate over.
+     * @param {...(string|string[])} [paths] The property paths to pick.
+     * @returns {Array} Returns the picked values.
+     * @example
+     *
+     * var object = { 'a': [{ 'b': { 'c': 3 } }, 4] };
+     *
+     * _.at(object, ['a[0].b.c', 'a[1]']);
+     * // => [3, 4]
+     */
+    var at = flatRest(baseAt);
+
+    /**
+     * Creates an object that inherits from the `prototype` object. If a
+     * `properties` object is given, its own enumerable string keyed properties
+     * are assigned to the created object.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.3.0
+     * @category Object
+     * @param {Object} prototype The object to inherit from.
+     * @param {Object} [properties] The properties to assign to the object.
+     * @returns {Object} Returns the new object.
+     * @example
+     *
+     * function Shape() {
+     *   this.x = 0;
+     *   this.y = 0;
+     * }
+     *
+     * function Circle() {
+     *   Shape.call(this);
+     * }
+     *
+     * Circle.prototype = _.create(Shape.prototype, {
+     *   'constructor': Circle
+     * });
+     *
+     * var circle = new Circle;
+     * circle instanceof Circle;
+     * // => true
+     *
+     * circle instanceof Shape;
+     * // => true
+     */
+    function create(prototype, properties) {
+      var result = baseCreate(prototype);
+      return properties == null ? result : baseAssign(result, properties);
+    }
+
+    /**
+     * Assigns own and inherited enumerable string keyed properties of source
+     * objects to the destination object for all destination properties that
+     * resolve to `undefined`. Source objects are applied from left to right.
+     * Once a property is set, additional values of the same property are ignored.
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Object
+     * @param {Object} object The destination object.
+     * @param {...Object} [sources] The source objects.
+     * @returns {Object} Returns `object`.
+     * @see _.defaultsDeep
+     * @example
+     *
+     * _.defaults({ 'a': 1 }, { 'b': 2 }, { 'a': 3 });
+     * // => { 'a': 1, 'b': 2 }
+     */
+    var defaults = baseRest(function(object, sources) {
+      object = Object(object);
+
+      var index = -1;
+      var length = sources.length;
+      var guard = length > 2 ? sources[2] : undefined;
+
+      if (guard && isIterateeCall(sources[0], sources[1], guard)) {
+        length = 1;
+      }
+
+      while (++index < length) {
+        var source = sources[index];
+        var props = keysIn(source);
+        var propsIndex = -1;
+        var propsLength = props.length;
+
+        while (++propsIndex < propsLength) {
+          var key = props[propsIndex];
+          var value = object[key];
+
+          if (value === undefined ||
+              (eq(value, objectProto[key]) && !hasOwnProperty.call(object, key))) {
+            object[key] = source[key];
+          }
+        }
+      }
+
+      return object;
+    });
+
+    /**
+     * This method is like `_.defaults` except that it recursively assigns
+     * default properties.
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.10.0
+     * @category Object
+     * @param {Object} object The destination object.
+     * @param {...Object} [sources] The source objects.
+     * @returns {Object} Returns `object`.
+     * @see _.defaults
+     * @example
+     *
+     * _.defaultsDeep({ 'a': { 'b': 2 } }, { 'a': { 'b': 1, 'c': 3 } });
+     * // => { 'a': { 'b': 2, 'c': 3 } }
+     */
+    var defaultsDeep = baseRest(function(args) {
+      args.push(undefined, customDefaultsMerge);
+      return apply(mergeWith, undefined, args);
+    });
+
+    /**
+     * This method is like `_.find` except that it returns the key of the first
+     * element `predicate` returns truthy for instead of the element itself.
+     *
+     * @static
+     * @memberOf _
+     * @since 1.1.0
+     * @category Object
+     * @param {Object} object The object to inspect.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @returns {string|undefined} Returns the key of the matched element,
+     *  else `undefined`.
+     * @example
+     *
+     * var users = {
+     *   'barney':  { 'age': 36, 'active': true },
+     *   'fred':    { 'age': 40, 'active': false },
+     *   'pebbles': { 'age': 1,  'active': true }
+     * };
+     *
+     * _.findKey(users, function(o) { return o.age < 40; });
+     * // => 'barney' (iteration order is not guaranteed)
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.findKey(users, { 'age': 1, 'active': true });
+     * // => 'pebbles'
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.findKey(users, ['active', false]);
+     * // => 'fred'
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.findKey(users, 'active');
+     * // => 'barney'
+     */
+    function findKey(object, predicate) {
+      return baseFindKey(object, getIteratee(predicate, 3), baseForOwn);
+    }
+
+    /**
+     * This method is like `_.findKey` except that it iterates over elements of
+     * a collection in the opposite order.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.0.0
+     * @category Object
+     * @param {Object} object The object to inspect.
+     * @param {Function} [predicate=_.identity] The function invoked per iteration.
+     * @returns {string|undefined} Returns the key of the matched element,
+     *  else `undefined`.
+     * @example
+     *
+     * var users = {
+     *   'barney':  { 'age': 36, 'active': true },
+     *   'fred':    { 'age': 40, 'active': false },
+     *   'pebbles': { 'age': 1,  'active': true }
+     * };
+     *
+     * _.findLastKey(users, function(o) { return o.age < 40; });
+     * // => returns 'pebbles' assuming `_.findKey` returns 'barney'
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.findLastKey(users, { 'age': 36, 'active': true });
+     * // => 'barney'
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.findLastKey(users, ['active', false]);
+     * // => 'fred'
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.findLastKey(users, 'active');
+     * // => 'pebbles'
+     */
+    function findLastKey(object, predicate) {
+      return baseFindKey(object, getIteratee(predicate, 3), baseForOwnRight);
+    }
+
+    /**
+     * Iterates over own and inherited enumerable string keyed properties of an
+     * object and invokes `iteratee` for each property. The iteratee is invoked
+     * with three arguments: (value, key, object). Iteratee functions may exit
+     * iteration early by explicitly returning `false`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.3.0
+     * @category Object
+     * @param {Object} object The object to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Object} Returns `object`.
+     * @see _.forInRight
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     *   this.b = 2;
+     * }
+     *
+     * Foo.prototype.c = 3;
+     *
+     * _.forIn(new Foo, function(value, key) {
+     *   console.log(key);
+     * });
+     * // => Logs 'a', 'b', then 'c' (iteration order is not guaranteed).
+     */
+    function forIn(object, iteratee) {
+      return object == null
+        ? object
+        : baseFor(object, getIteratee(iteratee, 3), keysIn);
+    }
+
+    /**
+     * This method is like `_.forIn` except that it iterates over properties of
+     * `object` in the opposite order.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.0.0
+     * @category Object
+     * @param {Object} object The object to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Object} Returns `object`.
+     * @see _.forIn
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     *   this.b = 2;
+     * }
+     *
+     * Foo.prototype.c = 3;
+     *
+     * _.forInRight(new Foo, function(value, key) {
+     *   console.log(key);
+     * });
+     * // => Logs 'c', 'b', then 'a' assuming `_.forIn` logs 'a', 'b', then 'c'.
+     */
+    function forInRight(object, iteratee) {
+      return object == null
+        ? object
+        : baseForRight(object, getIteratee(iteratee, 3), keysIn);
+    }
+
+    /**
+     * Iterates over own enumerable string keyed properties of an object and
+     * invokes `iteratee` for each property. The iteratee is invoked with three
+     * arguments: (value, key, object). Iteratee functions may exit iteration
+     * early by explicitly returning `false`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.3.0
+     * @category Object
+     * @param {Object} object The object to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Object} Returns `object`.
+     * @see _.forOwnRight
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     *   this.b = 2;
+     * }
+     *
+     * Foo.prototype.c = 3;
+     *
+     * _.forOwn(new Foo, function(value, key) {
+     *   console.log(key);
+     * });
+     * // => Logs 'a' then 'b' (iteration order is not guaranteed).
+     */
+    function forOwn(object, iteratee) {
+      return object && baseForOwn(object, getIteratee(iteratee, 3));
+    }
+
+    /**
+     * This method is like `_.forOwn` except that it iterates over properties of
+     * `object` in the opposite order.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.0.0
+     * @category Object
+     * @param {Object} object The object to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Object} Returns `object`.
+     * @see _.forOwn
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     *   this.b = 2;
+     * }
+     *
+     * Foo.prototype.c = 3;
+     *
+     * _.forOwnRight(new Foo, function(value, key) {
+     *   console.log(key);
+     * });
+     * // => Logs 'b' then 'a' assuming `_.forOwn` logs 'a' then 'b'.
+     */
+    function forOwnRight(object, iteratee) {
+      return object && baseForOwnRight(object, getIteratee(iteratee, 3));
+    }
+
+    /**
+     * Creates an array of function property names from own enumerable properties
+     * of `object`.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Object
+     * @param {Object} object The object to inspect.
+     * @returns {Array} Returns the function names.
+     * @see _.functionsIn
+     * @example
+     *
+     * function Foo() {
+     *   this.a = _.constant('a');
+     *   this.b = _.constant('b');
+     * }
+     *
+     * Foo.prototype.c = _.constant('c');
+     *
+     * _.functions(new Foo);
+     * // => ['a', 'b']
+     */
+    function functions(object) {
+      return object == null ? [] : baseFunctions(object, keys(object));
+    }
+
+    /**
+     * Creates an array of function property names from own and inherited
+     * enumerable properties of `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Object
+     * @param {Object} object The object to inspect.
+     * @returns {Array} Returns the function names.
+     * @see _.functions
+     * @example
+     *
+     * function Foo() {
+     *   this.a = _.constant('a');
+     *   this.b = _.constant('b');
+     * }
+     *
+     * Foo.prototype.c = _.constant('c');
+     *
+     * _.functionsIn(new Foo);
+     * // => ['a', 'b', 'c']
+     */
+    function functionsIn(object) {
+      return object == null ? [] : baseFunctions(object, keysIn(object));
+    }
+
+    /**
+     * Gets the value at `path` of `object`. If the resolved value is
+     * `undefined`, the `defaultValue` is returned in its place.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.7.0
+     * @category Object
+     * @param {Object} object The object to query.
+     * @param {Array|string} path The path of the property to get.
+     * @param {*} [defaultValue] The value returned for `undefined` resolved values.
+     * @returns {*} Returns the resolved value.
+     * @example
+     *
+     * var object = { 'a': [{ 'b': { 'c': 3 } }] };
+     *
+     * _.get(object, 'a[0].b.c');
+     * // => 3
+     *
+     * _.get(object, ['a', '0', 'b', 'c']);
+     * // => 3
+     *
+     * _.get(object, 'a.b.c', 'default');
+     * // => 'default'
+     */
+    function get(object, path, defaultValue) {
+      var result = object == null ? undefined : baseGet(object, path);
+      return result === undefined ? defaultValue : result;
+    }
+
+    /**
+     * Checks if `path` is a direct property of `object`.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Object
+     * @param {Object} object The object to query.
+     * @param {Array|string} path The path to check.
+     * @returns {boolean} Returns `true` if `path` exists, else `false`.
+     * @example
+     *
+     * var object = { 'a': { 'b': 2 } };
+     * var other = _.create({ 'a': _.create({ 'b': 2 }) });
+     *
+     * _.has(object, 'a');
+     * // => true
+     *
+     * _.has(object, 'a.b');
+     * // => true
+     *
+     * _.has(object, ['a', 'b']);
+     * // => true
+     *
+     * _.has(other, 'a');
+     * // => false
+     */
+    function has(object, path) {
+      return object != null && hasPath(object, path, baseHas);
+    }
+
+    /**
+     * Checks if `path` is a direct or inherited property of `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Object
+     * @param {Object} object The object to query.
+     * @param {Array|string} path The path to check.
+     * @returns {boolean} Returns `true` if `path` exists, else `false`.
+     * @example
+     *
+     * var object = _.create({ 'a': _.create({ 'b': 2 }) });
+     *
+     * _.hasIn(object, 'a');
+     * // => true
+     *
+     * _.hasIn(object, 'a.b');
+     * // => true
+     *
+     * _.hasIn(object, ['a', 'b']);
+     * // => true
+     *
+     * _.hasIn(object, 'b');
+     * // => false
+     */
+    function hasIn(object, path) {
+      return object != null && hasPath(object, path, baseHasIn);
+    }
+
+    /**
+     * Creates an object composed of the inverted keys and values of `object`.
+     * If `object` contains duplicate values, subsequent values overwrite
+     * property assignments of previous values.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.7.0
+     * @category Object
+     * @param {Object} object The object to invert.
+     * @returns {Object} Returns the new inverted object.
+     * @example
+     *
+     * var object = { 'a': 1, 'b': 2, 'c': 1 };
+     *
+     * _.invert(object);
+     * // => { '1': 'c', '2': 'b' }
+     */
+    var invert = createInverter(function(result, value, key) {
+      if (value != null &&
+          typeof value.toString != 'function') {
+        value = nativeObjectToString.call(value);
+      }
+
+      result[value] = key;
+    }, constant(identity));
+
+    /**
+     * This method is like `_.invert` except that the inverted object is generated
+     * from the results of running each element of `object` thru `iteratee`. The
+     * corresponding inverted value of each inverted key is an array of keys
+     * responsible for generating the inverted value. The iteratee is invoked
+     * with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.1.0
+     * @category Object
+     * @param {Object} object The object to invert.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {Object} Returns the new inverted object.
+     * @example
+     *
+     * var object = { 'a': 1, 'b': 2, 'c': 1 };
+     *
+     * _.invertBy(object);
+     * // => { '1': ['a', 'c'], '2': ['b'] }
+     *
+     * _.invertBy(object, function(value) {
+     *   return 'group' + value;
+     * });
+     * // => { 'group1': ['a', 'c'], 'group2': ['b'] }
+     */
+    var invertBy = createInverter(function(result, value, key) {
+      if (value != null &&
+          typeof value.toString != 'function') {
+        value = nativeObjectToString.call(value);
+      }
+
+      if (hasOwnProperty.call(result, value)) {
+        result[value].push(key);
+      } else {
+        result[value] = [key];
+      }
+    }, getIteratee);
+
+    /**
+     * Invokes the method at `path` of `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Object
+     * @param {Object} object The object to query.
+     * @param {Array|string} path The path of the method to invoke.
+     * @param {...*} [args] The arguments to invoke the method with.
+     * @returns {*} Returns the result of the invoked method.
+     * @example
+     *
+     * var object = { 'a': [{ 'b': { 'c': [1, 2, 3, 4] } }] };
+     *
+     * _.invoke(object, 'a[0].b.c.slice', 1, 3);
+     * // => [2, 3]
+     */
+    var invoke = baseRest(baseInvoke);
+
+    /**
+     * Creates an array of the own enumerable property names of `object`.
+     *
+     * **Note:** Non-object values are coerced to objects. See the
+     * [ES spec](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)
+     * for more details.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Object
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the array of property names.
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     *   this.b = 2;
+     * }
+     *
+     * Foo.prototype.c = 3;
+     *
+     * _.keys(new Foo);
+     * // => ['a', 'b'] (iteration order is not guaranteed)
+     *
+     * _.keys('hi');
+     * // => ['0', '1']
+     */
+    function keys(object) {
+      return isArrayLike(object) ? arrayLikeKeys(object) : baseKeys(object);
+    }
+
+    /**
+     * Creates an array of the own and inherited enumerable property names of `object`.
+     *
+     * **Note:** Non-object values are coerced to objects.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Object
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the array of property names.
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     *   this.b = 2;
+     * }
+     *
+     * Foo.prototype.c = 3;
+     *
+     * _.keysIn(new Foo);
+     * // => ['a', 'b', 'c'] (iteration order is not guaranteed)
+     */
+    function keysIn(object) {
+      return isArrayLike(object) ? arrayLikeKeys(object, true) : baseKeysIn(object);
+    }
+
+    /**
+     * The opposite of `_.mapValues`; this method creates an object with the
+     * same values as `object` and keys generated by running each own enumerable
+     * string keyed property of `object` thru `iteratee`. The iteratee is invoked
+     * with three arguments: (value, key, object).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.8.0
+     * @category Object
+     * @param {Object} object The object to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Object} Returns the new mapped object.
+     * @see _.mapValues
+     * @example
+     *
+     * _.mapKeys({ 'a': 1, 'b': 2 }, function(value, key) {
+     *   return key + value;
+     * });
+     * // => { 'a1': 1, 'b2': 2 }
+     */
+    function mapKeys(object, iteratee) {
+      var result = {};
+      iteratee = getIteratee(iteratee, 3);
+
+      baseForOwn(object, function(value, key, object) {
+        baseAssignValue(result, iteratee(value, key, object), value);
+      });
+      return result;
+    }
+
+    /**
+     * Creates an object with the same keys as `object` and values generated
+     * by running each own enumerable string keyed property of `object` thru
+     * `iteratee`. The iteratee is invoked with three arguments:
+     * (value, key, object).
+     *
+     * @static
+     * @memberOf _
+     * @since 2.4.0
+     * @category Object
+     * @param {Object} object The object to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Object} Returns the new mapped object.
+     * @see _.mapKeys
+     * @example
+     *
+     * var users = {
+     *   'fred':    { 'user': 'fred',    'age': 40 },
+     *   'pebbles': { 'user': 'pebbles', 'age': 1 }
+     * };
+     *
+     * _.mapValues(users, function(o) { return o.age; });
+     * // => { 'fred': 40, 'pebbles': 1 } (iteration order is not guaranteed)
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.mapValues(users, 'age');
+     * // => { 'fred': 40, 'pebbles': 1 } (iteration order is not guaranteed)
+     */
+    function mapValues(object, iteratee) {
+      var result = {};
+      iteratee = getIteratee(iteratee, 3);
+
+      baseForOwn(object, function(value, key, object) {
+        baseAssignValue(result, key, iteratee(value, key, object));
+      });
+      return result;
+    }
+
+    /**
+     * This method is like `_.assign` except that it recursively merges own and
+     * inherited enumerable string keyed properties of source objects into the
+     * destination object. Source properties that resolve to `undefined` are
+     * skipped if a destination value exists. Array and plain object properties
+     * are merged recursively. Other objects and value types are overridden by
+     * assignment. Source objects are applied from left to right. Subsequent
+     * sources overwrite property assignments of previous sources.
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.5.0
+     * @category Object
+     * @param {Object} object The destination object.
+     * @param {...Object} [sources] The source objects.
+     * @returns {Object} Returns `object`.
+     * @example
+     *
+     * var object = {
+     *   'a': [{ 'b': 2 }, { 'd': 4 }]
+     * };
+     *
+     * var other = {
+     *   'a': [{ 'c': 3 }, { 'e': 5 }]
+     * };
+     *
+     * _.merge(object, other);
+     * // => { 'a': [{ 'b': 2, 'c': 3 }, { 'd': 4, 'e': 5 }] }
+     */
+    var merge = createAssigner(function(object, source, srcIndex) {
+      baseMerge(object, source, srcIndex);
+    });
+
+    /**
+     * This method is like `_.merge` except that it accepts `customizer` which
+     * is invoked to produce the merged values of the destination and source
+     * properties. If `customizer` returns `undefined`, merging is handled by the
+     * method instead. The `customizer` is invoked with six arguments:
+     * (objValue, srcValue, key, object, source, stack).
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Object
+     * @param {Object} object The destination object.
+     * @param {...Object} sources The source objects.
+     * @param {Function} customizer The function to customize assigned values.
+     * @returns {Object} Returns `object`.
+     * @example
+     *
+     * function customizer(objValue, srcValue) {
+     *   if (_.isArray(objValue)) {
+     *     return objValue.concat(srcValue);
+     *   }
+     * }
+     *
+     * var object = { 'a': [1], 'b': [2] };
+     * var other = { 'a': [3], 'b': [4] };
+     *
+     * _.mergeWith(object, other, customizer);
+     * // => { 'a': [1, 3], 'b': [2, 4] }
+     */
+    var mergeWith = createAssigner(function(object, source, srcIndex, customizer) {
+      baseMerge(object, source, srcIndex, customizer);
+    });
+
+    /**
+     * The opposite of `_.pick`; this method creates an object composed of the
+     * own and inherited enumerable property paths of `object` that are not omitted.
+     *
+     * **Note:** This method is considerably slower than `_.pick`.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Object
+     * @param {Object} object The source object.
+     * @param {...(string|string[])} [paths] The property paths to omit.
+     * @returns {Object} Returns the new object.
+     * @example
+     *
+     * var object = { 'a': 1, 'b': '2', 'c': 3 };
+     *
+     * _.omit(object, ['a', 'c']);
+     * // => { 'b': '2' }
+     */
+    var omit = flatRest(function(object, paths) {
+      var result = {};
+      if (object == null) {
+        return result;
+      }
+      var isDeep = false;
+      paths = arrayMap(paths, function(path) {
+        path = castPath(path, object);
+        isDeep || (isDeep = path.length > 1);
+        return path;
+      });
+      copyObject(object, getAllKeysIn(object), result);
+      if (isDeep) {
+        result = baseClone(result, CLONE_DEEP_FLAG | CLONE_FLAT_FLAG | CLONE_SYMBOLS_FLAG, customOmitClone);
+      }
+      var length = paths.length;
+      while (length--) {
+        baseUnset(result, paths[length]);
+      }
+      return result;
+    });
+
+    /**
+     * The opposite of `_.pickBy`; this method creates an object composed of
+     * the own and inherited enumerable string keyed properties of `object` that
+     * `predicate` doesn't return truthy for. The predicate is invoked with two
+     * arguments: (value, key).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Object
+     * @param {Object} object The source object.
+     * @param {Function} [predicate=_.identity] The function invoked per property.
+     * @returns {Object} Returns the new object.
+     * @example
+     *
+     * var object = { 'a': 1, 'b': '2', 'c': 3 };
+     *
+     * _.omitBy(object, _.isNumber);
+     * // => { 'b': '2' }
+     */
+    function omitBy(object, predicate) {
+      return pickBy(object, negate(getIteratee(predicate)));
+    }
+
+    /**
+     * Creates an object composed of the picked `object` properties.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Object
+     * @param {Object} object The source object.
+     * @param {...(string|string[])} [paths] The property paths to pick.
+     * @returns {Object} Returns the new object.
+     * @example
+     *
+     * var object = { 'a': 1, 'b': '2', 'c': 3 };
+     *
+     * _.pick(object, ['a', 'c']);
+     * // => { 'a': 1, 'c': 3 }
+     */
+    var pick = flatRest(function(object, paths) {
+      return object == null ? {} : basePick(object, paths);
+    });
+
+    /**
+     * Creates an object composed of the `object` properties `predicate` returns
+     * truthy for. The predicate is invoked with two arguments: (value, key).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Object
+     * @param {Object} object The source object.
+     * @param {Function} [predicate=_.identity] The function invoked per property.
+     * @returns {Object} Returns the new object.
+     * @example
+     *
+     * var object = { 'a': 1, 'b': '2', 'c': 3 };
+     *
+     * _.pickBy(object, _.isNumber);
+     * // => { 'a': 1, 'c': 3 }
+     */
+    function pickBy(object, predicate) {
+      if (object == null) {
+        return {};
+      }
+      var props = arrayMap(getAllKeysIn(object), function(prop) {
+        return [prop];
+      });
+      predicate = getIteratee(predicate);
+      return basePickBy(object, props, function(value, path) {
+        return predicate(value, path[0]);
+      });
+    }
+
+    /**
+     * This method is like `_.get` except that if the resolved value is a
+     * function it's invoked with the `this` binding of its parent object and
+     * its result is returned.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Object
+     * @param {Object} object The object to query.
+     * @param {Array|string} path The path of the property to resolve.
+     * @param {*} [defaultValue] The value returned for `undefined` resolved values.
+     * @returns {*} Returns the resolved value.
+     * @example
+     *
+     * var object = { 'a': [{ 'b': { 'c1': 3, 'c2': _.constant(4) } }] };
+     *
+     * _.result(object, 'a[0].b.c1');
+     * // => 3
+     *
+     * _.result(object, 'a[0].b.c2');
+     * // => 4
+     *
+     * _.result(object, 'a[0].b.c3', 'default');
+     * // => 'default'
+     *
+     * _.result(object, 'a[0].b.c3', _.constant('default'));
+     * // => 'default'
+     */
+    function result(object, path, defaultValue) {
+      path = castPath(path, object);
+
+      var index = -1,
+          length = path.length;
+
+      // Ensure the loop is entered when path is empty.
+      if (!length) {
+        length = 1;
+        object = undefined;
+      }
+      while (++index < length) {
+        var value = object == null ? undefined : object[toKey(path[index])];
+        if (value === undefined) {
+          index = length;
+          value = defaultValue;
+        }
+        object = isFunction(value) ? value.call(object) : value;
+      }
+      return object;
+    }
+
+    /**
+     * Sets the value at `path` of `object`. If a portion of `path` doesn't exist,
+     * it's created. Arrays are created for missing index properties while objects
+     * are created for all other missing properties. Use `_.setWith` to customize
+     * `path` creation.
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.7.0
+     * @category Object
+     * @param {Object} object The object to modify.
+     * @param {Array|string} path The path of the property to set.
+     * @param {*} value The value to set.
+     * @returns {Object} Returns `object`.
+     * @example
+     *
+     * var object = { 'a': [{ 'b': { 'c': 3 } }] };
+     *
+     * _.set(object, 'a[0].b.c', 4);
+     * console.log(object.a[0].b.c);
+     * // => 4
+     *
+     * _.set(object, ['x', '0', 'y', 'z'], 5);
+     * console.log(object.x[0].y.z);
+     * // => 5
+     */
+    function set(object, path, value) {
+      return object == null ? object : baseSet(object, path, value);
+    }
+
+    /**
+     * This method is like `_.set` except that it accepts `customizer` which is
+     * invoked to produce the objects of `path`.  If `customizer` returns `undefined`
+     * path creation is handled by the method instead. The `customizer` is invoked
+     * with three arguments: (nsValue, key, nsObject).
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Object
+     * @param {Object} object The object to modify.
+     * @param {Array|string} path The path of the property to set.
+     * @param {*} value The value to set.
+     * @param {Function} [customizer] The function to customize assigned values.
+     * @returns {Object} Returns `object`.
+     * @example
+     *
+     * var object = {};
+     *
+     * _.setWith(object, '[0][1]', 'a', Object);
+     * // => { '0': { '1': 'a' } }
+     */
+    function setWith(object, path, value, customizer) {
+      customizer = typeof customizer == 'function' ? customizer : undefined;
+      return object == null ? object : baseSet(object, path, value, customizer);
+    }
+
+    /**
+     * Creates an array of own enumerable string keyed-value pairs for `object`
+     * which can be consumed by `_.fromPairs`. If `object` is a map or set, its
+     * entries are returned.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @alias entries
+     * @category Object
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the key-value pairs.
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     *   this.b = 2;
+     * }
+     *
+     * Foo.prototype.c = 3;
+     *
+     * _.toPairs(new Foo);
+     * // => [['a', 1], ['b', 2]] (iteration order is not guaranteed)
+     */
+    var toPairs = createToPairs(keys);
+
+    /**
+     * Creates an array of own and inherited enumerable string keyed-value pairs
+     * for `object` which can be consumed by `_.fromPairs`. If `object` is a map
+     * or set, its entries are returned.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @alias entriesIn
+     * @category Object
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the key-value pairs.
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     *   this.b = 2;
+     * }
+     *
+     * Foo.prototype.c = 3;
+     *
+     * _.toPairsIn(new Foo);
+     * // => [['a', 1], ['b', 2], ['c', 3]] (iteration order is not guaranteed)
+     */
+    var toPairsIn = createToPairs(keysIn);
+
+    /**
+     * An alternative to `_.reduce`; this method transforms `object` to a new
+     * `accumulator` object which is the result of running each of its own
+     * enumerable string keyed properties thru `iteratee`, with each invocation
+     * potentially mutating the `accumulator` object. If `accumulator` is not
+     * provided, a new object with the same `[[Prototype]]` will be used. The
+     * iteratee is invoked with four arguments: (accumulator, value, key, object).
+     * Iteratee functions may exit iteration early by explicitly returning `false`.
+     *
+     * @static
+     * @memberOf _
+     * @since 1.3.0
+     * @category Object
+     * @param {Object} object The object to iterate over.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @param {*} [accumulator] The custom accumulator value.
+     * @returns {*} Returns the accumulated value.
+     * @example
+     *
+     * _.transform([2, 3, 4], function(result, n) {
+     *   result.push(n *= n);
+     *   return n % 2 == 0;
+     * }, []);
+     * // => [4, 9]
+     *
+     * _.transform({ 'a': 1, 'b': 2, 'c': 1 }, function(result, value, key) {
+     *   (result[value] || (result[value] = [])).push(key);
+     * }, {});
+     * // => { '1': ['a', 'c'], '2': ['b'] }
+     */
+    function transform(object, iteratee, accumulator) {
+      var isArr = isArray(object),
+          isArrLike = isArr || isBuffer(object) || isTypedArray(object);
+
+      iteratee = getIteratee(iteratee, 4);
+      if (accumulator == null) {
+        var Ctor = object && object.constructor;
+        if (isArrLike) {
+          accumulator = isArr ? new Ctor : [];
+        }
+        else if (isObject(object)) {
+          accumulator = isFunction(Ctor) ? baseCreate(getPrototype(object)) : {};
+        }
+        else {
+          accumulator = {};
+        }
+      }
+      (isArrLike ? arrayEach : baseForOwn)(object, function(value, index, object) {
+        return iteratee(accumulator, value, index, object);
+      });
+      return accumulator;
+    }
+
+    /**
+     * Removes the property at `path` of `object`.
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Object
+     * @param {Object} object The object to modify.
+     * @param {Array|string} path The path of the property to unset.
+     * @returns {boolean} Returns `true` if the property is deleted, else `false`.
+     * @example
+     *
+     * var object = { 'a': [{ 'b': { 'c': 7 } }] };
+     * _.unset(object, 'a[0].b.c');
+     * // => true
+     *
+     * console.log(object);
+     * // => { 'a': [{ 'b': {} }] };
+     *
+     * _.unset(object, ['a', '0', 'b', 'c']);
+     * // => true
+     *
+     * console.log(object);
+     * // => { 'a': [{ 'b': {} }] };
+     */
+    function unset(object, path) {
+      return object == null ? true : baseUnset(object, path);
+    }
+
+    /**
+     * This method is like `_.set` except that accepts `updater` to produce the
+     * value to set. Use `_.updateWith` to customize `path` creation. The `updater`
+     * is invoked with one argument: (value).
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.6.0
+     * @category Object
+     * @param {Object} object The object to modify.
+     * @param {Array|string} path The path of the property to set.
+     * @param {Function} updater The function to produce the updated value.
+     * @returns {Object} Returns `object`.
+     * @example
+     *
+     * var object = { 'a': [{ 'b': { 'c': 3 } }] };
+     *
+     * _.update(object, 'a[0].b.c', function(n) { return n * n; });
+     * console.log(object.a[0].b.c);
+     * // => 9
+     *
+     * _.update(object, 'x[0].y.z', function(n) { return n ? n + 1 : 0; });
+     * console.log(object.x[0].y.z);
+     * // => 0
+     */
+    function update(object, path, updater) {
+      return object == null ? object : baseUpdate(object, path, castFunction(updater));
+    }
+
+    /**
+     * This method is like `_.update` except that it accepts `customizer` which is
+     * invoked to produce the objects of `path`.  If `customizer` returns `undefined`
+     * path creation is handled by the method instead. The `customizer` is invoked
+     * with three arguments: (nsValue, key, nsObject).
+     *
+     * **Note:** This method mutates `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.6.0
+     * @category Object
+     * @param {Object} object The object to modify.
+     * @param {Array|string} path The path of the property to set.
+     * @param {Function} updater The function to produce the updated value.
+     * @param {Function} [customizer] The function to customize assigned values.
+     * @returns {Object} Returns `object`.
+     * @example
+     *
+     * var object = {};
+     *
+     * _.updateWith(object, '[0][1]', _.constant('a'), Object);
+     * // => { '0': { '1': 'a' } }
+     */
+    function updateWith(object, path, updater, customizer) {
+      customizer = typeof customizer == 'function' ? customizer : undefined;
+      return object == null ? object : baseUpdate(object, path, castFunction(updater), customizer);
+    }
+
+    /**
+     * Creates an array of the own enumerable string keyed property values of `object`.
+     *
+     * **Note:** Non-object values are coerced to objects.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Object
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the array of property values.
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     *   this.b = 2;
+     * }
+     *
+     * Foo.prototype.c = 3;
+     *
+     * _.values(new Foo);
+     * // => [1, 2] (iteration order is not guaranteed)
+     *
+     * _.values('hi');
+     * // => ['h', 'i']
+     */
+    function values(object) {
+      return object == null ? [] : baseValues(object, keys(object));
+    }
+
+    /**
+     * Creates an array of the own and inherited enumerable string keyed property
+     * values of `object`.
+     *
+     * **Note:** Non-object values are coerced to objects.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Object
+     * @param {Object} object The object to query.
+     * @returns {Array} Returns the array of property values.
+     * @example
+     *
+     * function Foo() {
+     *   this.a = 1;
+     *   this.b = 2;
+     * }
+     *
+     * Foo.prototype.c = 3;
+     *
+     * _.valuesIn(new Foo);
+     * // => [1, 2, 3] (iteration order is not guaranteed)
+     */
+    function valuesIn(object) {
+      return object == null ? [] : baseValues(object, keysIn(object));
+    }
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Clamps `number` within the inclusive `lower` and `upper` bounds.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Number
+     * @param {number} number The number to clamp.
+     * @param {number} [lower] The lower bound.
+     * @param {number} upper The upper bound.
+     * @returns {number} Returns the clamped number.
+     * @example
+     *
+     * _.clamp(-10, -5, 5);
+     * // => -5
+     *
+     * _.clamp(10, -5, 5);
+     * // => 5
+     */
+    function clamp(number, lower, upper) {
+      if (upper === undefined) {
+        upper = lower;
+        lower = undefined;
+      }
+      if (upper !== undefined) {
+        upper = toNumber(upper);
+        upper = upper === upper ? upper : 0;
+      }
+      if (lower !== undefined) {
+        lower = toNumber(lower);
+        lower = lower === lower ? lower : 0;
+      }
+      return baseClamp(toNumber(number), lower, upper);
+    }
+
+    /**
+     * Checks if `n` is between `start` and up to, but not including, `end`. If
+     * `end` is not specified, it's set to `start` with `start` then set to `0`.
+     * If `start` is greater than `end` the params are swapped to support
+     * negative ranges.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.3.0
+     * @category Number
+     * @param {number} number The number to check.
+     * @param {number} [start=0] The start of the range.
+     * @param {number} end The end of the range.
+     * @returns {boolean} Returns `true` if `number` is in the range, else `false`.
+     * @see _.range, _.rangeRight
+     * @example
+     *
+     * _.inRange(3, 2, 4);
+     * // => true
+     *
+     * _.inRange(4, 8);
+     * // => true
+     *
+     * _.inRange(4, 2);
+     * // => false
+     *
+     * _.inRange(2, 2);
+     * // => false
+     *
+     * _.inRange(1.2, 2);
+     * // => true
+     *
+     * _.inRange(5.2, 4);
+     * // => false
+     *
+     * _.inRange(-3, -2, -6);
+     * // => true
+     */
+    function inRange(number, start, end) {
+      start = toFinite(start);
+      if (end === undefined) {
+        end = start;
+        start = 0;
+      } else {
+        end = toFinite(end);
+      }
+      number = toNumber(number);
+      return baseInRange(number, start, end);
+    }
+
+    /**
+     * Produces a random number between the inclusive `lower` and `upper` bounds.
+     * If only one argument is provided a number between `0` and the given number
+     * is returned. If `floating` is `true`, or either `lower` or `upper` are
+     * floats, a floating-point number is returned instead of an integer.
+     *
+     * **Note:** JavaScript follows the IEEE-754 standard for resolving
+     * floating-point values which can produce unexpected results.
+     *
+     * @static
+     * @memberOf _
+     * @since 0.7.0
+     * @category Number
+     * @param {number} [lower=0] The lower bound.
+     * @param {number} [upper=1] The upper bound.
+     * @param {boolean} [floating] Specify returning a floating-point number.
+     * @returns {number} Returns the random number.
+     * @example
+     *
+     * _.random(0, 5);
+     * // => an integer between 0 and 5
+     *
+     * _.random(5);
+     * // => also an integer between 0 and 5
+     *
+     * _.random(5, true);
+     * // => a floating-point number between 0 and 5
+     *
+     * _.random(1.2, 5.2);
+     * // => a floating-point number between 1.2 and 5.2
+     */
+    function random(lower, upper, floating) {
+      if (floating && typeof floating != 'boolean' && isIterateeCall(lower, upper, floating)) {
+        upper = floating = undefined;
+      }
+      if (floating === undefined) {
+        if (typeof upper == 'boolean') {
+          floating = upper;
+          upper = undefined;
+        }
+        else if (typeof lower == 'boolean') {
+          floating = lower;
+          lower = undefined;
+        }
+      }
+      if (lower === undefined && upper === undefined) {
+        lower = 0;
+        upper = 1;
+      }
+      else {
+        lower = toFinite(lower);
+        if (upper === undefined) {
+          upper = lower;
+          lower = 0;
+        } else {
+          upper = toFinite(upper);
+        }
+      }
+      if (lower > upper) {
+        var temp = lower;
+        lower = upper;
+        upper = temp;
+      }
+      if (floating || lower % 1 || upper % 1) {
+        var rand = nativeRandom();
+        return nativeMin(lower + (rand * (upper - lower + freeParseFloat('1e-' + ((rand + '').length - 1)))), upper);
+      }
+      return baseRandom(lower, upper);
+    }
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Converts `string` to [camel case](https://en.wikipedia.org/wiki/CamelCase).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to convert.
+     * @returns {string} Returns the camel cased string.
+     * @example
+     *
+     * _.camelCase('Foo Bar');
+     * // => 'fooBar'
+     *
+     * _.camelCase('--foo-bar--');
+     * // => 'fooBar'
+     *
+     * _.camelCase('__FOO_BAR__');
+     * // => 'fooBar'
+     */
+    var camelCase = createCompounder(function(result, word, index) {
+      word = word.toLowerCase();
+      return result + (index ? capitalize(word) : word);
+    });
+
+    /**
+     * Converts the first character of `string` to upper case and the remaining
+     * to lower case.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to capitalize.
+     * @returns {string} Returns the capitalized string.
+     * @example
+     *
+     * _.capitalize('FRED');
+     * // => 'Fred'
+     */
+    function capitalize(string) {
+      return upperFirst(toString(string).toLowerCase());
+    }
+
+    /**
+     * Deburrs `string` by converting
+     * [Latin-1 Supplement](https://en.wikipedia.org/wiki/Latin-1_Supplement_(Unicode_block)#Character_table)
+     * and [Latin Extended-A](https://en.wikipedia.org/wiki/Latin_Extended-A)
+     * letters to basic Latin letters and removing
+     * [combining diacritical marks](https://en.wikipedia.org/wiki/Combining_Diacritical_Marks).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to deburr.
+     * @returns {string} Returns the deburred string.
+     * @example
+     *
+     * _.deburr('déjà vu');
+     * // => 'deja vu'
+     */
+    function deburr(string) {
+      string = toString(string);
+      return string && string.replace(reLatin, deburrLetter).replace(reComboMark, '');
+    }
+
+    /**
+     * Checks if `string` ends with the given target string.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to inspect.
+     * @param {string} [target] The string to search for.
+     * @param {number} [position=string.length] The position to search up to.
+     * @returns {boolean} Returns `true` if `string` ends with `target`,
+     *  else `false`.
+     * @example
+     *
+     * _.endsWith('abc', 'c');
+     * // => true
+     *
+     * _.endsWith('abc', 'b');
+     * // => false
+     *
+     * _.endsWith('abc', 'b', 2);
+     * // => true
+     */
+    function endsWith(string, target, position) {
+      string = toString(string);
+      target = baseToString(target);
+
+      var length = string.length;
+      position = position === undefined
+        ? length
+        : baseClamp(toInteger(position), 0, length);
+
+      var end = position;
+      position -= target.length;
+      return position >= 0 && string.slice(position, end) == target;
+    }
+
+    /**
+     * Converts the characters "&", "<", ">", '"', and "'" in `string` to their
+     * corresponding HTML entities.
+     *
+     * **Note:** No other characters are escaped. To escape additional
+     * characters use a third-party library like [_he_](https://mths.be/he).
+     *
+     * Though the ">" character is escaped for symmetry, characters like
+     * ">" and "/" don't need escaping in HTML and have no special meaning
+     * unless they're part of a tag or unquoted attribute value. See
+     * [Mathias Bynens's article](https://mathiasbynens.be/notes/ambiguous-ampersands)
+     * (under "semi-related fun fact") for more details.
+     *
+     * When working with HTML you should always
+     * [quote attribute values](http://wonko.com/post/html-escaping) to reduce
+     * XSS vectors.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category String
+     * @param {string} [string=''] The string to escape.
+     * @returns {string} Returns the escaped string.
+     * @example
+     *
+     * _.escape('fred, barney, & pebbles');
+     * // => 'fred, barney, &amp; pebbles'
+     */
+    function escape(string) {
+      string = toString(string);
+      return (string && reHasUnescapedHtml.test(string))
+        ? string.replace(reUnescapedHtml, escapeHtmlChar)
+        : string;
+    }
+
+    /**
+     * Escapes the `RegExp` special characters "^", "$", "\", ".", "*", "+",
+     * "?", "(", ")", "[", "]", "{", "}", and "|" in `string`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to escape.
+     * @returns {string} Returns the escaped string.
+     * @example
+     *
+     * _.escapeRegExp('[lodash](https://lodash.com/)');
+     * // => '\[lodash\]\(https://lodash\.com/\)'
+     */
+    function escapeRegExp(string) {
+      string = toString(string);
+      return (string && reHasRegExpChar.test(string))
+        ? string.replace(reRegExpChar, '\\$&')
+        : string;
+    }
+
+    /**
+     * Converts `string` to
+     * [kebab case](https://en.wikipedia.org/wiki/Letter_case#Special_case_styles).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to convert.
+     * @returns {string} Returns the kebab cased string.
+     * @example
+     *
+     * _.kebabCase('Foo Bar');
+     * // => 'foo-bar'
+     *
+     * _.kebabCase('fooBar');
+     * // => 'foo-bar'
+     *
+     * _.kebabCase('__FOO_BAR__');
+     * // => 'foo-bar'
+     */
+    var kebabCase = createCompounder(function(result, word, index) {
+      return result + (index ? '-' : '') + word.toLowerCase();
+    });
+
+    /**
+     * Converts `string`, as space separated words, to lower case.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to convert.
+     * @returns {string} Returns the lower cased string.
+     * @example
+     *
+     * _.lowerCase('--Foo-Bar--');
+     * // => 'foo bar'
+     *
+     * _.lowerCase('fooBar');
+     * // => 'foo bar'
+     *
+     * _.lowerCase('__FOO_BAR__');
+     * // => 'foo bar'
+     */
+    var lowerCase = createCompounder(function(result, word, index) {
+      return result + (index ? ' ' : '') + word.toLowerCase();
+    });
+
+    /**
+     * Converts the first character of `string` to lower case.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to convert.
+     * @returns {string} Returns the converted string.
+     * @example
+     *
+     * _.lowerFirst('Fred');
+     * // => 'fred'
+     *
+     * _.lowerFirst('FRED');
+     * // => 'fRED'
+     */
+    var lowerFirst = createCaseFirst('toLowerCase');
+
+    /**
+     * Pads `string` on the left and right sides if it's shorter than `length`.
+     * Padding characters are truncated if they can't be evenly divided by `length`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to pad.
+     * @param {number} [length=0] The padding length.
+     * @param {string} [chars=' '] The string used as padding.
+     * @returns {string} Returns the padded string.
+     * @example
+     *
+     * _.pad('abc', 8);
+     * // => '  abc   '
+     *
+     * _.pad('abc', 8, '_-');
+     * // => '_-abc_-_'
+     *
+     * _.pad('abc', 3);
+     * // => 'abc'
+     */
+    function pad(string, length, chars) {
+      string = toString(string);
+      length = toInteger(length);
+
+      var strLength = length ? stringSize(string) : 0;
+      if (!length || strLength >= length) {
+        return string;
+      }
+      var mid = (length - strLength) / 2;
+      return (
+        createPadding(nativeFloor(mid), chars) +
+        string +
+        createPadding(nativeCeil(mid), chars)
+      );
+    }
+
+    /**
+     * Pads `string` on the right side if it's shorter than `length`. Padding
+     * characters are truncated if they exceed `length`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to pad.
+     * @param {number} [length=0] The padding length.
+     * @param {string} [chars=' '] The string used as padding.
+     * @returns {string} Returns the padded string.
+     * @example
+     *
+     * _.padEnd('abc', 6);
+     * // => 'abc   '
+     *
+     * _.padEnd('abc', 6, '_-');
+     * // => 'abc_-_'
+     *
+     * _.padEnd('abc', 3);
+     * // => 'abc'
+     */
+    function padEnd(string, length, chars) {
+      string = toString(string);
+      length = toInteger(length);
+
+      var strLength = length ? stringSize(string) : 0;
+      return (length && strLength < length)
+        ? (string + createPadding(length - strLength, chars))
+        : string;
+    }
+
+    /**
+     * Pads `string` on the left side if it's shorter than `length`. Padding
+     * characters are truncated if they exceed `length`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to pad.
+     * @param {number} [length=0] The padding length.
+     * @param {string} [chars=' '] The string used as padding.
+     * @returns {string} Returns the padded string.
+     * @example
+     *
+     * _.padStart('abc', 6);
+     * // => '   abc'
+     *
+     * _.padStart('abc', 6, '_-');
+     * // => '_-_abc'
+     *
+     * _.padStart('abc', 3);
+     * // => 'abc'
+     */
+    function padStart(string, length, chars) {
+      string = toString(string);
+      length = toInteger(length);
+
+      var strLength = length ? stringSize(string) : 0;
+      return (length && strLength < length)
+        ? (createPadding(length - strLength, chars) + string)
+        : string;
+    }
+
+    /**
+     * Converts `string` to an integer of the specified radix. If `radix` is
+     * `undefined` or `0`, a `radix` of `10` is used unless `value` is a
+     * hexadecimal, in which case a `radix` of `16` is used.
+     *
+     * **Note:** This method aligns with the
+     * [ES5 implementation](https://es5.github.io/#x15.1.2.2) of `parseInt`.
+     *
+     * @static
+     * @memberOf _
+     * @since 1.1.0
+     * @category String
+     * @param {string} string The string to convert.
+     * @param {number} [radix=10] The radix to interpret `value` by.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {number} Returns the converted integer.
+     * @example
+     *
+     * _.parseInt('08');
+     * // => 8
+     *
+     * _.map(['6', '08', '10'], _.parseInt);
+     * // => [6, 8, 10]
+     */
+    function parseInt(string, radix, guard) {
+      if (guard || radix == null) {
+        radix = 0;
+      } else if (radix) {
+        radix = +radix;
+      }
+      return nativeParseInt(toString(string).replace(reTrimStart, ''), radix || 0);
+    }
+
+    /**
+     * Repeats the given string `n` times.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to repeat.
+     * @param {number} [n=1] The number of times to repeat the string.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {string} Returns the repeated string.
+     * @example
+     *
+     * _.repeat('*', 3);
+     * // => '***'
+     *
+     * _.repeat('abc', 2);
+     * // => 'abcabc'
+     *
+     * _.repeat('abc', 0);
+     * // => ''
+     */
+    function repeat(string, n, guard) {
+      if ((guard ? isIterateeCall(string, n, guard) : n === undefined)) {
+        n = 1;
+      } else {
+        n = toInteger(n);
+      }
+      return baseRepeat(toString(string), n);
+    }
+
+    /**
+     * Replaces matches for `pattern` in `string` with `replacement`.
+     *
+     * **Note:** This method is based on
+     * [`String#replace`](https://mdn.io/String/replace).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to modify.
+     * @param {RegExp|string} pattern The pattern to replace.
+     * @param {Function|string} replacement The match replacement.
+     * @returns {string} Returns the modified string.
+     * @example
+     *
+     * _.replace('Hi Fred', 'Fred', 'Barney');
+     * // => 'Hi Barney'
+     */
+    function replace() {
+      var args = arguments,
+          string = toString(args[0]);
+
+      return args.length < 3 ? string : string.replace(args[1], args[2]);
+    }
+
+    /**
+     * Converts `string` to
+     * [snake case](https://en.wikipedia.org/wiki/Snake_case).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to convert.
+     * @returns {string} Returns the snake cased string.
+     * @example
+     *
+     * _.snakeCase('Foo Bar');
+     * // => 'foo_bar'
+     *
+     * _.snakeCase('fooBar');
+     * // => 'foo_bar'
+     *
+     * _.snakeCase('--FOO-BAR--');
+     * // => 'foo_bar'
+     */
+    var snakeCase = createCompounder(function(result, word, index) {
+      return result + (index ? '_' : '') + word.toLowerCase();
+    });
+
+    /**
+     * Splits `string` by `separator`.
+     *
+     * **Note:** This method is based on
+     * [`String#split`](https://mdn.io/String/split).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to split.
+     * @param {RegExp|string} separator The separator pattern to split by.
+     * @param {number} [limit] The length to truncate results to.
+     * @returns {Array} Returns the string segments.
+     * @example
+     *
+     * _.split('a-b-c', '-', 2);
+     * // => ['a', 'b']
+     */
+    function split(string, separator, limit) {
+      if (limit && typeof limit != 'number' && isIterateeCall(string, separator, limit)) {
+        separator = limit = undefined;
+      }
+      limit = limit === undefined ? MAX_ARRAY_LENGTH : limit >>> 0;
+      if (!limit) {
+        return [];
+      }
+      string = toString(string);
+      if (string && (
+            typeof separator == 'string' ||
+            (separator != null && !isRegExp(separator))
+          )) {
+        separator = baseToString(separator);
+        if (!separator && hasUnicode(string)) {
+          return castSlice(stringToArray(string), 0, limit);
+        }
+      }
+      return string.split(separator, limit);
+    }
+
+    /**
+     * Converts `string` to
+     * [start case](https://en.wikipedia.org/wiki/Letter_case#Stylistic_or_specialised_usage).
+     *
+     * @static
+     * @memberOf _
+     * @since 3.1.0
+     * @category String
+     * @param {string} [string=''] The string to convert.
+     * @returns {string} Returns the start cased string.
+     * @example
+     *
+     * _.startCase('--foo-bar--');
+     * // => 'Foo Bar'
+     *
+     * _.startCase('fooBar');
+     * // => 'Foo Bar'
+     *
+     * _.startCase('__FOO_BAR__');
+     * // => 'FOO BAR'
+     */
+    var startCase = createCompounder(function(result, word, index) {
+      return result + (index ? ' ' : '') + upperFirst(word);
+    });
+
+    /**
+     * Checks if `string` starts with the given target string.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to inspect.
+     * @param {string} [target] The string to search for.
+     * @param {number} [position=0] The position to search from.
+     * @returns {boolean} Returns `true` if `string` starts with `target`,
+     *  else `false`.
+     * @example
+     *
+     * _.startsWith('abc', 'a');
+     * // => true
+     *
+     * _.startsWith('abc', 'b');
+     * // => false
+     *
+     * _.startsWith('abc', 'b', 1);
+     * // => true
+     */
+    function startsWith(string, target, position) {
+      string = toString(string);
+      position = position == null
+        ? 0
+        : baseClamp(toInteger(position), 0, string.length);
+
+      target = baseToString(target);
+      return string.slice(position, position + target.length) == target;
+    }
+
+    /**
+     * Creates a compiled template function that can interpolate data properties
+     * in "interpolate" delimiters, HTML-escape interpolated data properties in
+     * "escape" delimiters, and execute JavaScript in "evaluate" delimiters. Data
+     * properties may be accessed as free variables in the template. If a setting
+     * object is given, it takes precedence over `_.templateSettings` values.
+     *
+     * **Note:** In the development build `_.template` utilizes
+     * [sourceURLs](http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/#toc-sourceurl)
+     * for easier debugging.
+     *
+     * For more information on precompiling templates see
+     * [lodash's custom builds documentation](https://lodash.com/custom-builds).
+     *
+     * For more information on Chrome extension sandboxes see
+     * [Chrome's extensions documentation](https://developer.chrome.com/extensions/sandboxingEval).
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category String
+     * @param {string} [string=''] The template string.
+     * @param {Object} [options={}] The options object.
+     * @param {RegExp} [options.escape=_.templateSettings.escape]
+     *  The HTML "escape" delimiter.
+     * @param {RegExp} [options.evaluate=_.templateSettings.evaluate]
+     *  The "evaluate" delimiter.
+     * @param {Object} [options.imports=_.templateSettings.imports]
+     *  An object to import into the template as free variables.
+     * @param {RegExp} [options.interpolate=_.templateSettings.interpolate]
+     *  The "interpolate" delimiter.
+     * @param {string} [options.sourceURL='lodash.templateSources[n]']
+     *  The sourceURL of the compiled template.
+     * @param {string} [options.variable='obj']
+     *  The data object variable name.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {Function} Returns the compiled template function.
+     * @example
+     *
+     * // Use the "interpolate" delimiter to create a compiled template.
+     * var compiled = _.template('hello <%= user %>!');
+     * compiled({ 'user': 'fred' });
+     * // => 'hello fred!'
+     *
+     * // Use the HTML "escape" delimiter to escape data property values.
+     * var compiled = _.template('<b><%- value %></b>');
+     * compiled({ 'value': '<script>' });
+     * // => '<b>&lt;script&gt;</b>'
+     *
+     * // Use the "evaluate" delimiter to execute JavaScript and generate HTML.
+     * var compiled = _.template('<% _.forEach(users, function(user) { %><li><%- user %></li><% }); %>');
+     * compiled({ 'users': ['fred', 'barney'] });
+     * // => '<li>fred</li><li>barney</li>'
+     *
+     * // Use the internal `print` function in "evaluate" delimiters.
+     * var compiled = _.template('<% print("hello " + user); %>!');
+     * compiled({ 'user': 'barney' });
+     * // => 'hello barney!'
+     *
+     * // Use the ES template literal delimiter as an "interpolate" delimiter.
+     * // Disable support by replacing the "interpolate" delimiter.
+     * var compiled = _.template('hello ${ user }!');
+     * compiled({ 'user': 'pebbles' });
+     * // => 'hello pebbles!'
+     *
+     * // Use backslashes to treat delimiters as plain text.
+     * var compiled = _.template('<%= "\\<%- value %\\>" %>');
+     * compiled({ 'value': 'ignored' });
+     * // => '<%- value %>'
+     *
+     * // Use the `imports` option to import `jQuery` as `jq`.
+     * var text = '<% jq.each(users, function(user) { %><li><%- user %></li><% }); %>';
+     * var compiled = _.template(text, { 'imports': { 'jq': jQuery } });
+     * compiled({ 'users': ['fred', 'barney'] });
+     * // => '<li>fred</li><li>barney</li>'
+     *
+     * // Use the `sourceURL` option to specify a custom sourceURL for the template.
+     * var compiled = _.template('hello <%= user %>!', { 'sourceURL': '/basic/greeting.jst' });
+     * compiled(data);
+     * // => Find the source of "greeting.jst" under the Sources tab or Resources panel of the web inspector.
+     *
+     * // Use the `variable` option to ensure a with-statement isn't used in the compiled template.
+     * var compiled = _.template('hi <%= data.user %>!', { 'variable': 'data' });
+     * compiled.source;
+     * // => function(data) {
+     * //   var __t, __p = '';
+     * //   __p += 'hi ' + ((__t = ( data.user )) == null ? '' : __t) + '!';
+     * //   return __p;
+     * // }
+     *
+     * // Use custom template delimiters.
+     * _.templateSettings.interpolate = /{{([\s\S]+?)}}/g;
+     * var compiled = _.template('hello {{ user }}!');
+     * compiled({ 'user': 'mustache' });
+     * // => 'hello mustache!'
+     *
+     * // Use the `source` property to inline compiled templates for meaningful
+     * // line numbers in error messages and stack traces.
+     * fs.writeFileSync(path.join(process.cwd(), 'jst.js'), '\
+     *   var JST = {\
+     *     "main": ' + _.template(mainText).source + '\
+     *   };\
+     * ');
+     */
+    function template(string, options, guard) {
+      // Based on John Resig's `tmpl` implementation
+      // (http://ejohn.org/blog/javascript-micro-templating/)
+      // and Laura Doktorova's doT.js (https://github.com/olado/doT).
+      var settings = lodash.templateSettings;
+
+      if (guard && isIterateeCall(string, options, guard)) {
+        options = undefined;
+      }
+      string = toString(string);
+      options = assignInWith({}, options, settings, customDefaultsAssignIn);
+
+      var imports = assignInWith({}, options.imports, settings.imports, customDefaultsAssignIn),
+          importsKeys = keys(imports),
+          importsValues = baseValues(imports, importsKeys);
+
+      var isEscaping,
+          isEvaluating,
+          index = 0,
+          interpolate = options.interpolate || reNoMatch,
+          source = "__p += '";
+
+      // Compile the regexp to match each delimiter.
+      var reDelimiters = RegExp(
+        (options.escape || reNoMatch).source + '|' +
+        interpolate.source + '|' +
+        (interpolate === reInterpolate ? reEsTemplate : reNoMatch).source + '|' +
+        (options.evaluate || reNoMatch).source + '|$'
+      , 'g');
+
+      // Use a sourceURL for easier debugging.
+      // The sourceURL gets injected into the source that's eval-ed, so be careful
+      // to normalize all kinds of whitespace, so e.g. newlines (and unicode versions of it) can't sneak in
+      // and escape the comment, thus injecting code that gets evaled.
+      var sourceURL = '//# sourceURL=' +
+        (hasOwnProperty.call(options, 'sourceURL')
+          ? (options.sourceURL + '').replace(/\s/g, ' ')
+          : ('lodash.templateSources[' + (++templateCounter) + ']')
+        ) + '\n';
+
+      string.replace(reDelimiters, function(match, escapeValue, interpolateValue, esTemplateValue, evaluateValue, offset) {
+        interpolateValue || (interpolateValue = esTemplateValue);
+
+        // Escape characters that can't be included in string literals.
+        source += string.slice(index, offset).replace(reUnescapedString, escapeStringChar);
+
+        // Replace delimiters with snippets.
+        if (escapeValue) {
+          isEscaping = true;
+          source += "' +\n__e(" + escapeValue + ") +\n'";
+        }
+        if (evaluateValue) {
+          isEvaluating = true;
+          source += "';\n" + evaluateValue + ";\n__p += '";
+        }
+        if (interpolateValue) {
+          source += "' +\n((__t = (" + interpolateValue + ")) == null ? '' : __t) +\n'";
+        }
+        index = offset + match.length;
+
+        // The JS engine embedded in Adobe products needs `match` returned in
+        // order to produce the correct `offset` value.
+        return match;
+      });
+
+      source += "';\n";
+
+      // If `variable` is not specified wrap a with-statement around the generated
+      // code to add the data object to the top of the scope chain.
+      var variable = hasOwnProperty.call(options, 'variable') && options.variable;
+      if (!variable) {
+        source = 'with (obj) {\n' + source + '\n}\n';
+      }
+      // Throw an error if a forbidden character was found in `variable`, to prevent
+      // potential command injection attacks.
+      else if (reForbiddenIdentifierChars.test(variable)) {
+        throw new Error(INVALID_TEMPL_VAR_ERROR_TEXT);
+      }
+
+      // Cleanup code by stripping empty strings.
+      source = (isEvaluating ? source.replace(reEmptyStringLeading, '') : source)
+        .replace(reEmptyStringMiddle, '$1')
+        .replace(reEmptyStringTrailing, '$1;');
+
+      // Frame code as the function body.
+      source = 'function(' + (variable || 'obj') + ') {\n' +
+        (variable
+          ? ''
+          : 'obj || (obj = {});\n'
+        ) +
+        "var __t, __p = ''" +
+        (isEscaping
+           ? ', __e = _.escape'
+           : ''
+        ) +
+        (isEvaluating
+          ? ', __j = Array.prototype.join;\n' +
+            "function print() { __p += __j.call(arguments, '') }\n"
+          : ';\n'
+        ) +
+        source +
+        'return __p\n}';
+
+      var result = attempt(function() {
+        return Function(importsKeys, sourceURL + 'return ' + source)
+          .apply(undefined, importsValues);
+      });
+
+      // Provide the compiled function's source by its `toString` method or
+      // the `source` property as a convenience for inlining compiled templates.
+      result.source = source;
+      if (isError(result)) {
+        throw result;
+      }
+      return result;
+    }
+
+    /**
+     * Converts `string`, as a whole, to lower case just like
+     * [String#toLowerCase](https://mdn.io/toLowerCase).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to convert.
+     * @returns {string} Returns the lower cased string.
+     * @example
+     *
+     * _.toLower('--Foo-Bar--');
+     * // => '--foo-bar--'
+     *
+     * _.toLower('fooBar');
+     * // => 'foobar'
+     *
+     * _.toLower('__FOO_BAR__');
+     * // => '__foo_bar__'
+     */
+    function toLower(value) {
+      return toString(value).toLowerCase();
+    }
+
+    /**
+     * Converts `string`, as a whole, to upper case just like
+     * [String#toUpperCase](https://mdn.io/toUpperCase).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to convert.
+     * @returns {string} Returns the upper cased string.
+     * @example
+     *
+     * _.toUpper('--foo-bar--');
+     * // => '--FOO-BAR--'
+     *
+     * _.toUpper('fooBar');
+     * // => 'FOOBAR'
+     *
+     * _.toUpper('__foo_bar__');
+     * // => '__FOO_BAR__'
+     */
+    function toUpper(value) {
+      return toString(value).toUpperCase();
+    }
+
+    /**
+     * Removes leading and trailing whitespace or specified characters from `string`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to trim.
+     * @param {string} [chars=whitespace] The characters to trim.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {string} Returns the trimmed string.
+     * @example
+     *
+     * _.trim('  abc  ');
+     * // => 'abc'
+     *
+     * _.trim('-_-abc-_-', '_-');
+     * // => 'abc'
+     *
+     * _.map(['  foo  ', '  bar  '], _.trim);
+     * // => ['foo', 'bar']
+     */
+    function trim(string, chars, guard) {
+      string = toString(string);
+      if (string && (guard || chars === undefined)) {
+        return baseTrim(string);
+      }
+      if (!string || !(chars = baseToString(chars))) {
+        return string;
+      }
+      var strSymbols = stringToArray(string),
+          chrSymbols = stringToArray(chars),
+          start = charsStartIndex(strSymbols, chrSymbols),
+          end = charsEndIndex(strSymbols, chrSymbols) + 1;
+
+      return castSlice(strSymbols, start, end).join('');
+    }
+
+    /**
+     * Removes trailing whitespace or specified characters from `string`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to trim.
+     * @param {string} [chars=whitespace] The characters to trim.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {string} Returns the trimmed string.
+     * @example
+     *
+     * _.trimEnd('  abc  ');
+     * // => '  abc'
+     *
+     * _.trimEnd('-_-abc-_-', '_-');
+     * // => '-_-abc'
+     */
+    function trimEnd(string, chars, guard) {
+      string = toString(string);
+      if (string && (guard || chars === undefined)) {
+        return string.slice(0, trimmedEndIndex(string) + 1);
+      }
+      if (!string || !(chars = baseToString(chars))) {
+        return string;
+      }
+      var strSymbols = stringToArray(string),
+          end = charsEndIndex(strSymbols, stringToArray(chars)) + 1;
+
+      return castSlice(strSymbols, 0, end).join('');
+    }
+
+    /**
+     * Removes leading whitespace or specified characters from `string`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to trim.
+     * @param {string} [chars=whitespace] The characters to trim.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {string} Returns the trimmed string.
+     * @example
+     *
+     * _.trimStart('  abc  ');
+     * // => 'abc  '
+     *
+     * _.trimStart('-_-abc-_-', '_-');
+     * // => 'abc-_-'
+     */
+    function trimStart(string, chars, guard) {
+      string = toString(string);
+      if (string && (guard || chars === undefined)) {
+        return string.replace(reTrimStart, '');
+      }
+      if (!string || !(chars = baseToString(chars))) {
+        return string;
+      }
+      var strSymbols = stringToArray(string),
+          start = charsStartIndex(strSymbols, stringToArray(chars));
+
+      return castSlice(strSymbols, start).join('');
+    }
+
+    /**
+     * Truncates `string` if it's longer than the given maximum string length.
+     * The last characters of the truncated string are replaced with the omission
+     * string which defaults to "...".
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to truncate.
+     * @param {Object} [options={}] The options object.
+     * @param {number} [options.length=30] The maximum string length.
+     * @param {string} [options.omission='...'] The string to indicate text is omitted.
+     * @param {RegExp|string} [options.separator] The separator pattern to truncate to.
+     * @returns {string} Returns the truncated string.
+     * @example
+     *
+     * _.truncate('hi-diddly-ho there, neighborino');
+     * // => 'hi-diddly-ho there, neighbo...'
+     *
+     * _.truncate('hi-diddly-ho there, neighborino', {
+     *   'length': 24,
+     *   'separator': ' '
+     * });
+     * // => 'hi-diddly-ho there,...'
+     *
+     * _.truncate('hi-diddly-ho there, neighborino', {
+     *   'length': 24,
+     *   'separator': /,? +/
+     * });
+     * // => 'hi-diddly-ho there...'
+     *
+     * _.truncate('hi-diddly-ho there, neighborino', {
+     *   'omission': ' [...]'
+     * });
+     * // => 'hi-diddly-ho there, neig [...]'
+     */
+    function truncate(string, options) {
+      var length = DEFAULT_TRUNC_LENGTH,
+          omission = DEFAULT_TRUNC_OMISSION;
+
+      if (isObject(options)) {
+        var separator = 'separator' in options ? options.separator : separator;
+        length = 'length' in options ? toInteger(options.length) : length;
+        omission = 'omission' in options ? baseToString(options.omission) : omission;
+      }
+      string = toString(string);
+
+      var strLength = string.length;
+      if (hasUnicode(string)) {
+        var strSymbols = stringToArray(string);
+        strLength = strSymbols.length;
+      }
+      if (length >= strLength) {
+        return string;
+      }
+      var end = length - stringSize(omission);
+      if (end < 1) {
+        return omission;
+      }
+      var result = strSymbols
+        ? castSlice(strSymbols, 0, end).join('')
+        : string.slice(0, end);
+
+      if (separator === undefined) {
+        return result + omission;
+      }
+      if (strSymbols) {
+        end += (result.length - end);
+      }
+      if (isRegExp(separator)) {
+        if (string.slice(end).search(separator)) {
+          var match,
+              substring = result;
+
+          if (!separator.global) {
+            separator = RegExp(separator.source, toString(reFlags.exec(separator)) + 'g');
+          }
+          separator.lastIndex = 0;
+          while ((match = separator.exec(substring))) {
+            var newEnd = match.index;
+          }
+          result = result.slice(0, newEnd === undefined ? end : newEnd);
+        }
+      } else if (string.indexOf(baseToString(separator), end) != end) {
+        var index = result.lastIndexOf(separator);
+        if (index > -1) {
+          result = result.slice(0, index);
+        }
+      }
+      return result + omission;
+    }
+
+    /**
+     * The inverse of `_.escape`; this method converts the HTML entities
+     * `&amp;`, `&lt;`, `&gt;`, `&quot;`, and `&#39;` in `string` to
+     * their corresponding characters.
+     *
+     * **Note:** No other HTML entities are unescaped. To unescape additional
+     * HTML entities use a third-party library like [_he_](https://mths.be/he).
+     *
+     * @static
+     * @memberOf _
+     * @since 0.6.0
+     * @category String
+     * @param {string} [string=''] The string to unescape.
+     * @returns {string} Returns the unescaped string.
+     * @example
+     *
+     * _.unescape('fred, barney, &amp; pebbles');
+     * // => 'fred, barney, & pebbles'
+     */
+    function unescape(string) {
+      string = toString(string);
+      return (string && reHasEscapedHtml.test(string))
+        ? string.replace(reEscapedHtml, unescapeHtmlChar)
+        : string;
+    }
+
+    /**
+     * Converts `string`, as space separated words, to upper case.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to convert.
+     * @returns {string} Returns the upper cased string.
+     * @example
+     *
+     * _.upperCase('--foo-bar');
+     * // => 'FOO BAR'
+     *
+     * _.upperCase('fooBar');
+     * // => 'FOO BAR'
+     *
+     * _.upperCase('__foo_bar__');
+     * // => 'FOO BAR'
+     */
+    var upperCase = createCompounder(function(result, word, index) {
+      return result + (index ? ' ' : '') + word.toUpperCase();
+    });
+
+    /**
+     * Converts the first character of `string` to upper case.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category String
+     * @param {string} [string=''] The string to convert.
+     * @returns {string} Returns the converted string.
+     * @example
+     *
+     * _.upperFirst('fred');
+     * // => 'Fred'
+     *
+     * _.upperFirst('FRED');
+     * // => 'FRED'
+     */
+    var upperFirst = createCaseFirst('toUpperCase');
+
+    /**
+     * Splits `string` into an array of its words.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category String
+     * @param {string} [string=''] The string to inspect.
+     * @param {RegExp|string} [pattern] The pattern to match words.
+     * @param- {Object} [guard] Enables use as an iteratee for methods like `_.map`.
+     * @returns {Array} Returns the words of `string`.
+     * @example
+     *
+     * _.words('fred, barney, & pebbles');
+     * // => ['fred', 'barney', 'pebbles']
+     *
+     * _.words('fred, barney, & pebbles', /[^, ]+/g);
+     * // => ['fred', 'barney', '&', 'pebbles']
+     */
+    function words(string, pattern, guard) {
+      string = toString(string);
+      pattern = guard ? undefined : pattern;
+
+      if (pattern === undefined) {
+        return hasUnicodeWord(string) ? unicodeWords(string) : asciiWords(string);
+      }
+      return string.match(pattern) || [];
+    }
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Attempts to invoke `func`, returning either the result or the caught error
+     * object. Any additional arguments are provided to `func` when it's invoked.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Util
+     * @param {Function} func The function to attempt.
+     * @param {...*} [args] The arguments to invoke `func` with.
+     * @returns {*} Returns the `func` result or error object.
+     * @example
+     *
+     * // Avoid throwing errors for invalid selectors.
+     * var elements = _.attempt(function(selector) {
+     *   return document.querySelectorAll(selector);
+     * }, '>_>');
+     *
+     * if (_.isError(elements)) {
+     *   elements = [];
+     * }
+     */
+    var attempt = baseRest(function(func, args) {
+      try {
+        return apply(func, undefined, args);
+      } catch (e) {
+        return isError(e) ? e : new Error(e);
+      }
+    });
+
+    /**
+     * Binds methods of an object to the object itself, overwriting the existing
+     * method.
+     *
+     * **Note:** This method doesn't set the "length" property of bound functions.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Util
+     * @param {Object} object The object to bind and assign the bound methods to.
+     * @param {...(string|string[])} methodNames The object method names to bind.
+     * @returns {Object} Returns `object`.
+     * @example
+     *
+     * var view = {
+     *   'label': 'docs',
+     *   'click': function() {
+     *     console.log('clicked ' + this.label);
+     *   }
+     * };
+     *
+     * _.bindAll(view, ['click']);
+     * jQuery(element).on('click', view.click);
+     * // => Logs 'clicked docs' when clicked.
+     */
+    var bindAll = flatRest(function(object, methodNames) {
+      arrayEach(methodNames, function(key) {
+        key = toKey(key);
+        baseAssignValue(object, key, bind(object[key], object));
+      });
+      return object;
+    });
+
+    /**
+     * Creates a function that iterates over `pairs` and invokes the corresponding
+     * function of the first predicate to return truthy. The predicate-function
+     * pairs are invoked with the `this` binding and arguments of the created
+     * function.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Util
+     * @param {Array} pairs The predicate-function pairs.
+     * @returns {Function} Returns the new composite function.
+     * @example
+     *
+     * var func = _.cond([
+     *   [_.matches({ 'a': 1 }),           _.constant('matches A')],
+     *   [_.conforms({ 'b': _.isNumber }), _.constant('matches B')],
+     *   [_.stubTrue,                      _.constant('no match')]
+     * ]);
+     *
+     * func({ 'a': 1, 'b': 2 });
+     * // => 'matches A'
+     *
+     * func({ 'a': 0, 'b': 1 });
+     * // => 'matches B'
+     *
+     * func({ 'a': '1', 'b': '2' });
+     * // => 'no match'
+     */
+    function cond(pairs) {
+      var length = pairs == null ? 0 : pairs.length,
+          toIteratee = getIteratee();
+
+      pairs = !length ? [] : arrayMap(pairs, function(pair) {
+        if (typeof pair[1] != 'function') {
+          throw new TypeError(FUNC_ERROR_TEXT);
+        }
+        return [toIteratee(pair[0]), pair[1]];
+      });
+
+      return baseRest(function(args) {
+        var index = -1;
+        while (++index < length) {
+          var pair = pairs[index];
+          if (apply(pair[0], this, args)) {
+            return apply(pair[1], this, args);
+          }
+        }
+      });
+    }
+
+    /**
+     * Creates a function that invokes the predicate properties of `source` with
+     * the corresponding property values of a given object, returning `true` if
+     * all predicates return truthy, else `false`.
+     *
+     * **Note:** The created function is equivalent to `_.conformsTo` with
+     * `source` partially applied.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Util
+     * @param {Object} source The object of property predicates to conform to.
+     * @returns {Function} Returns the new spec function.
+     * @example
+     *
+     * var objects = [
+     *   { 'a': 2, 'b': 1 },
+     *   { 'a': 1, 'b': 2 }
+     * ];
+     *
+     * _.filter(objects, _.conforms({ 'b': function(n) { return n > 1; } }));
+     * // => [{ 'a': 1, 'b': 2 }]
+     */
+    function conforms(source) {
+      return baseConforms(baseClone(source, CLONE_DEEP_FLAG));
+    }
+
+    /**
+     * Creates a function that returns `value`.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.4.0
+     * @category Util
+     * @param {*} value The value to return from the new function.
+     * @returns {Function} Returns the new constant function.
+     * @example
+     *
+     * var objects = _.times(2, _.constant({ 'a': 1 }));
+     *
+     * console.log(objects);
+     * // => [{ 'a': 1 }, { 'a': 1 }]
+     *
+     * console.log(objects[0] === objects[1]);
+     * // => true
+     */
+    function constant(value) {
+      return function() {
+        return value;
+      };
+    }
+
+    /**
+     * Checks `value` to determine whether a default value should be returned in
+     * its place. The `defaultValue` is returned if `value` is `NaN`, `null`,
+     * or `undefined`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.14.0
+     * @category Util
+     * @param {*} value The value to check.
+     * @param {*} defaultValue The default value.
+     * @returns {*} Returns the resolved value.
+     * @example
+     *
+     * _.defaultTo(1, 10);
+     * // => 1
+     *
+     * _.defaultTo(undefined, 10);
+     * // => 10
+     */
+    function defaultTo(value, defaultValue) {
+      return (value == null || value !== value) ? defaultValue : value;
+    }
+
+    /**
+     * Creates a function that returns the result of invoking the given functions
+     * with the `this` binding of the created function, where each successive
+     * invocation is supplied the return value of the previous.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Util
+     * @param {...(Function|Function[])} [funcs] The functions to invoke.
+     * @returns {Function} Returns the new composite function.
+     * @see _.flowRight
+     * @example
+     *
+     * function square(n) {
+     *   return n * n;
+     * }
+     *
+     * var addSquare = _.flow([_.add, square]);
+     * addSquare(1, 2);
+     * // => 9
+     */
+    var flow = createFlow();
+
+    /**
+     * This method is like `_.flow` except that it creates a function that
+     * invokes the given functions from right to left.
+     *
+     * @static
+     * @since 3.0.0
+     * @memberOf _
+     * @category Util
+     * @param {...(Function|Function[])} [funcs] The functions to invoke.
+     * @returns {Function} Returns the new composite function.
+     * @see _.flow
+     * @example
+     *
+     * function square(n) {
+     *   return n * n;
+     * }
+     *
+     * var addSquare = _.flowRight([square, _.add]);
+     * addSquare(1, 2);
+     * // => 9
+     */
+    var flowRight = createFlow(true);
+
+    /**
+     * This method returns the first argument it receives.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Util
+     * @param {*} value Any value.
+     * @returns {*} Returns `value`.
+     * @example
+     *
+     * var object = { 'a': 1 };
+     *
+     * console.log(_.identity(object) === object);
+     * // => true
+     */
+    function identity(value) {
+      return value;
+    }
+
+    /**
+     * Creates a function that invokes `func` with the arguments of the created
+     * function. If `func` is a property name, the created function returns the
+     * property value for a given element. If `func` is an array or object, the
+     * created function returns `true` for elements that contain the equivalent
+     * source properties, otherwise it returns `false`.
+     *
+     * @static
+     * @since 4.0.0
+     * @memberOf _
+     * @category Util
+     * @param {*} [func=_.identity] The value to convert to a callback.
+     * @returns {Function} Returns the callback.
+     * @example
+     *
+     * var users = [
+     *   { 'user': 'barney', 'age': 36, 'active': true },
+     *   { 'user': 'fred',   'age': 40, 'active': false }
+     * ];
+     *
+     * // The `_.matches` iteratee shorthand.
+     * _.filter(users, _.iteratee({ 'user': 'barney', 'active': true }));
+     * // => [{ 'user': 'barney', 'age': 36, 'active': true }]
+     *
+     * // The `_.matchesProperty` iteratee shorthand.
+     * _.filter(users, _.iteratee(['user', 'fred']));
+     * // => [{ 'user': 'fred', 'age': 40 }]
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.map(users, _.iteratee('user'));
+     * // => ['barney', 'fred']
+     *
+     * // Create custom iteratee shorthands.
+     * _.iteratee = _.wrap(_.iteratee, function(iteratee, func) {
+     *   return !_.isRegExp(func) ? iteratee(func) : function(string) {
+     *     return func.test(string);
+     *   };
+     * });
+     *
+     * _.filter(['abc', 'def'], /ef/);
+     * // => ['def']
+     */
+    function iteratee(func) {
+      return baseIteratee(typeof func == 'function' ? func : baseClone(func, CLONE_DEEP_FLAG));
+    }
+
+    /**
+     * Creates a function that performs a partial deep comparison between a given
+     * object and `source`, returning `true` if the given object has equivalent
+     * property values, else `false`.
+     *
+     * **Note:** The created function is equivalent to `_.isMatch` with `source`
+     * partially applied.
+     *
+     * Partial comparisons will match empty array and empty object `source`
+     * values against any array or object value, respectively. See `_.isEqual`
+     * for a list of supported value comparisons.
+     *
+     * **Note:** Multiple values can be checked by combining several matchers
+     * using `_.overSome`
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Util
+     * @param {Object} source The object of property values to match.
+     * @returns {Function} Returns the new spec function.
+     * @example
+     *
+     * var objects = [
+     *   { 'a': 1, 'b': 2, 'c': 3 },
+     *   { 'a': 4, 'b': 5, 'c': 6 }
+     * ];
+     *
+     * _.filter(objects, _.matches({ 'a': 4, 'c': 6 }));
+     * // => [{ 'a': 4, 'b': 5, 'c': 6 }]
+     *
+     * // Checking for several possible values
+     * _.filter(objects, _.overSome([_.matches({ 'a': 1 }), _.matches({ 'a': 4 })]));
+     * // => [{ 'a': 1, 'b': 2, 'c': 3 }, { 'a': 4, 'b': 5, 'c': 6 }]
+     */
+    function matches(source) {
+      return baseMatches(baseClone(source, CLONE_DEEP_FLAG));
+    }
+
+    /**
+     * Creates a function that performs a partial deep comparison between the
+     * value at `path` of a given object to `srcValue`, returning `true` if the
+     * object value is equivalent, else `false`.
+     *
+     * **Note:** Partial comparisons will match empty array and empty object
+     * `srcValue` values against any array or object value, respectively. See
+     * `_.isEqual` for a list of supported value comparisons.
+     *
+     * **Note:** Multiple values can be checked by combining several matchers
+     * using `_.overSome`
+     *
+     * @static
+     * @memberOf _
+     * @since 3.2.0
+     * @category Util
+     * @param {Array|string} path The path of the property to get.
+     * @param {*} srcValue The value to match.
+     * @returns {Function} Returns the new spec function.
+     * @example
+     *
+     * var objects = [
+     *   { 'a': 1, 'b': 2, 'c': 3 },
+     *   { 'a': 4, 'b': 5, 'c': 6 }
+     * ];
+     *
+     * _.find(objects, _.matchesProperty('a', 4));
+     * // => { 'a': 4, 'b': 5, 'c': 6 }
+     *
+     * // Checking for several possible values
+     * _.filter(objects, _.overSome([_.matchesProperty('a', 1), _.matchesProperty('a', 4)]));
+     * // => [{ 'a': 1, 'b': 2, 'c': 3 }, { 'a': 4, 'b': 5, 'c': 6 }]
+     */
+    function matchesProperty(path, srcValue) {
+      return baseMatchesProperty(path, baseClone(srcValue, CLONE_DEEP_FLAG));
+    }
+
+    /**
+     * Creates a function that invokes the method at `path` of a given object.
+     * Any additional arguments are provided to the invoked method.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.7.0
+     * @category Util
+     * @param {Array|string} path The path of the method to invoke.
+     * @param {...*} [args] The arguments to invoke the method with.
+     * @returns {Function} Returns the new invoker function.
+     * @example
+     *
+     * var objects = [
+     *   { 'a': { 'b': _.constant(2) } },
+     *   { 'a': { 'b': _.constant(1) } }
+     * ];
+     *
+     * _.map(objects, _.method('a.b'));
+     * // => [2, 1]
+     *
+     * _.map(objects, _.method(['a', 'b']));
+     * // => [2, 1]
+     */
+    var method = baseRest(function(path, args) {
+      return function(object) {
+        return baseInvoke(object, path, args);
+      };
+    });
+
+    /**
+     * The opposite of `_.method`; this method creates a function that invokes
+     * the method at a given path of `object`. Any additional arguments are
+     * provided to the invoked method.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.7.0
+     * @category Util
+     * @param {Object} object The object to query.
+     * @param {...*} [args] The arguments to invoke the method with.
+     * @returns {Function} Returns the new invoker function.
+     * @example
+     *
+     * var array = _.times(3, _.constant),
+     *     object = { 'a': array, 'b': array, 'c': array };
+     *
+     * _.map(['a[2]', 'c[0]'], _.methodOf(object));
+     * // => [2, 0]
+     *
+     * _.map([['a', '2'], ['c', '0']], _.methodOf(object));
+     * // => [2, 0]
+     */
+    var methodOf = baseRest(function(object, args) {
+      return function(path) {
+        return baseInvoke(object, path, args);
+      };
+    });
+
+    /**
+     * Adds all own enumerable string keyed function properties of a source
+     * object to the destination object. If `object` is a function, then methods
+     * are added to its prototype as well.
+     *
+     * **Note:** Use `_.runInContext` to create a pristine `lodash` function to
+     * avoid conflicts caused by modifying the original.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Util
+     * @param {Function|Object} [object=lodash] The destination object.
+     * @param {Object} source The object of functions to add.
+     * @param {Object} [options={}] The options object.
+     * @param {boolean} [options.chain=true] Specify whether mixins are chainable.
+     * @returns {Function|Object} Returns `object`.
+     * @example
+     *
+     * function vowels(string) {
+     *   return _.filter(string, function(v) {
+     *     return /[aeiou]/i.test(v);
+     *   });
+     * }
+     *
+     * _.mixin({ 'vowels': vowels });
+     * _.vowels('fred');
+     * // => ['e']
+     *
+     * _('fred').vowels().value();
+     * // => ['e']
+     *
+     * _.mixin({ 'vowels': vowels }, { 'chain': false });
+     * _('fred').vowels();
+     * // => ['e']
+     */
+    function mixin(object, source, options) {
+      var props = keys(source),
+          methodNames = baseFunctions(source, props);
+
+      if (options == null &&
+          !(isObject(source) && (methodNames.length || !props.length))) {
+        options = source;
+        source = object;
+        object = this;
+        methodNames = baseFunctions(source, keys(source));
+      }
+      var chain = !(isObject(options) && 'chain' in options) || !!options.chain,
+          isFunc = isFunction(object);
+
+      arrayEach(methodNames, function(methodName) {
+        var func = source[methodName];
+        object[methodName] = func;
+        if (isFunc) {
+          object.prototype[methodName] = function() {
+            var chainAll = this.__chain__;
+            if (chain || chainAll) {
+              var result = object(this.__wrapped__),
+                  actions = result.__actions__ = copyArray(this.__actions__);
+
+              actions.push({ 'func': func, 'args': arguments, 'thisArg': object });
+              result.__chain__ = chainAll;
+              return result;
+            }
+            return func.apply(object, arrayPush([this.value()], arguments));
+          };
+        }
+      });
+
+      return object;
+    }
+
+    /**
+     * Reverts the `_` variable to its previous value and returns a reference to
+     * the `lodash` function.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Util
+     * @returns {Function} Returns the `lodash` function.
+     * @example
+     *
+     * var lodash = _.noConflict();
+     */
+    function noConflict() {
+      if (root._ === this) {
+        root._ = oldDash;
+      }
+      return this;
+    }
+
+    /**
+     * This method returns `undefined`.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.3.0
+     * @category Util
+     * @example
+     *
+     * _.times(2, _.noop);
+     * // => [undefined, undefined]
+     */
+    function noop() {
+      // No operation performed.
+    }
+
+    /**
+     * Creates a function that gets the argument at index `n`. If `n` is negative,
+     * the nth argument from the end is returned.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Util
+     * @param {number} [n=0] The index of the argument to return.
+     * @returns {Function} Returns the new pass-thru function.
+     * @example
+     *
+     * var func = _.nthArg(1);
+     * func('a', 'b', 'c', 'd');
+     * // => 'b'
+     *
+     * var func = _.nthArg(-2);
+     * func('a', 'b', 'c', 'd');
+     * // => 'c'
+     */
+    function nthArg(n) {
+      n = toInteger(n);
+      return baseRest(function(args) {
+        return baseNth(args, n);
+      });
+    }
+
+    /**
+     * Creates a function that invokes `iteratees` with the arguments it receives
+     * and returns their results.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Util
+     * @param {...(Function|Function[])} [iteratees=[_.identity]]
+     *  The iteratees to invoke.
+     * @returns {Function} Returns the new function.
+     * @example
+     *
+     * var func = _.over([Math.max, Math.min]);
+     *
+     * func(1, 2, 3, 4);
+     * // => [4, 1]
+     */
+    var over = createOver(arrayMap);
+
+    /**
+     * Creates a function that checks if **all** of the `predicates` return
+     * truthy when invoked with the arguments it receives.
+     *
+     * Following shorthands are possible for providing predicates.
+     * Pass an `Object` and it will be used as an parameter for `_.matches` to create the predicate.
+     * Pass an `Array` of parameters for `_.matchesProperty` and the predicate will be created using them.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Util
+     * @param {...(Function|Function[])} [predicates=[_.identity]]
+     *  The predicates to check.
+     * @returns {Function} Returns the new function.
+     * @example
+     *
+     * var func = _.overEvery([Boolean, isFinite]);
+     *
+     * func('1');
+     * // => true
+     *
+     * func(null);
+     * // => false
+     *
+     * func(NaN);
+     * // => false
+     */
+    var overEvery = createOver(arrayEvery);
+
+    /**
+     * Creates a function that checks if **any** of the `predicates` return
+     * truthy when invoked with the arguments it receives.
+     *
+     * Following shorthands are possible for providing predicates.
+     * Pass an `Object` and it will be used as an parameter for `_.matches` to create the predicate.
+     * Pass an `Array` of parameters for `_.matchesProperty` and the predicate will be created using them.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Util
+     * @param {...(Function|Function[])} [predicates=[_.identity]]
+     *  The predicates to check.
+     * @returns {Function} Returns the new function.
+     * @example
+     *
+     * var func = _.overSome([Boolean, isFinite]);
+     *
+     * func('1');
+     * // => true
+     *
+     * func(null);
+     * // => true
+     *
+     * func(NaN);
+     * // => false
+     *
+     * var matchesFunc = _.overSome([{ 'a': 1 }, { 'a': 2 }])
+     * var matchesPropertyFunc = _.overSome([['a', 1], ['a', 2]])
+     */
+    var overSome = createOver(arraySome);
+
+    /**
+     * Creates a function that returns the value at `path` of a given object.
+     *
+     * @static
+     * @memberOf _
+     * @since 2.4.0
+     * @category Util
+     * @param {Array|string} path The path of the property to get.
+     * @returns {Function} Returns the new accessor function.
+     * @example
+     *
+     * var objects = [
+     *   { 'a': { 'b': 2 } },
+     *   { 'a': { 'b': 1 } }
+     * ];
+     *
+     * _.map(objects, _.property('a.b'));
+     * // => [2, 1]
+     *
+     * _.map(_.sortBy(objects, _.property(['a', 'b'])), 'a.b');
+     * // => [1, 2]
+     */
+    function property(path) {
+      return isKey(path) ? baseProperty(toKey(path)) : basePropertyDeep(path);
+    }
+
+    /**
+     * The opposite of `_.property`; this method creates a function that returns
+     * the value at a given path of `object`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.0.0
+     * @category Util
+     * @param {Object} object The object to query.
+     * @returns {Function} Returns the new accessor function.
+     * @example
+     *
+     * var array = [0, 1, 2],
+     *     object = { 'a': array, 'b': array, 'c': array };
+     *
+     * _.map(['a[2]', 'c[0]'], _.propertyOf(object));
+     * // => [2, 0]
+     *
+     * _.map([['a', '2'], ['c', '0']], _.propertyOf(object));
+     * // => [2, 0]
+     */
+    function propertyOf(object) {
+      return function(path) {
+        return object == null ? undefined : baseGet(object, path);
+      };
+    }
+
+    /**
+     * Creates an array of numbers (positive and/or negative) progressing from
+     * `start` up to, but not including, `end`. A step of `-1` is used if a negative
+     * `start` is specified without an `end` or `step`. If `end` is not specified,
+     * it's set to `start` with `start` then set to `0`.
+     *
+     * **Note:** JavaScript follows the IEEE-754 standard for resolving
+     * floating-point values which can produce unexpected results.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Util
+     * @param {number} [start=0] The start of the range.
+     * @param {number} end The end of the range.
+     * @param {number} [step=1] The value to increment or decrement by.
+     * @returns {Array} Returns the range of numbers.
+     * @see _.inRange, _.rangeRight
+     * @example
+     *
+     * _.range(4);
+     * // => [0, 1, 2, 3]
+     *
+     * _.range(-4);
+     * // => [0, -1, -2, -3]
+     *
+     * _.range(1, 5);
+     * // => [1, 2, 3, 4]
+     *
+     * _.range(0, 20, 5);
+     * // => [0, 5, 10, 15]
+     *
+     * _.range(0, -4, -1);
+     * // => [0, -1, -2, -3]
+     *
+     * _.range(1, 4, 0);
+     * // => [1, 1, 1]
+     *
+     * _.range(0);
+     * // => []
+     */
+    var range = createRange();
+
+    /**
+     * This method is like `_.range` except that it populates values in
+     * descending order.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Util
+     * @param {number} [start=0] The start of the range.
+     * @param {number} end The end of the range.
+     * @param {number} [step=1] The value to increment or decrement by.
+     * @returns {Array} Returns the range of numbers.
+     * @see _.inRange, _.range
+     * @example
+     *
+     * _.rangeRight(4);
+     * // => [3, 2, 1, 0]
+     *
+     * _.rangeRight(-4);
+     * // => [-3, -2, -1, 0]
+     *
+     * _.rangeRight(1, 5);
+     * // => [4, 3, 2, 1]
+     *
+     * _.rangeRight(0, 20, 5);
+     * // => [15, 10, 5, 0]
+     *
+     * _.rangeRight(0, -4, -1);
+     * // => [-3, -2, -1, 0]
+     *
+     * _.rangeRight(1, 4, 0);
+     * // => [1, 1, 1]
+     *
+     * _.rangeRight(0);
+     * // => []
+     */
+    var rangeRight = createRange(true);
+
+    /**
+     * This method returns a new empty array.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.13.0
+     * @category Util
+     * @returns {Array} Returns the new empty array.
+     * @example
+     *
+     * var arrays = _.times(2, _.stubArray);
+     *
+     * console.log(arrays);
+     * // => [[], []]
+     *
+     * console.log(arrays[0] === arrays[1]);
+     * // => false
+     */
+    function stubArray() {
+      return [];
+    }
+
+    /**
+     * This method returns `false`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.13.0
+     * @category Util
+     * @returns {boolean} Returns `false`.
+     * @example
+     *
+     * _.times(2, _.stubFalse);
+     * // => [false, false]
+     */
+    function stubFalse() {
+      return false;
+    }
+
+    /**
+     * This method returns a new empty object.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.13.0
+     * @category Util
+     * @returns {Object} Returns the new empty object.
+     * @example
+     *
+     * var objects = _.times(2, _.stubObject);
+     *
+     * console.log(objects);
+     * // => [{}, {}]
+     *
+     * console.log(objects[0] === objects[1]);
+     * // => false
+     */
+    function stubObject() {
+      return {};
+    }
+
+    /**
+     * This method returns an empty string.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.13.0
+     * @category Util
+     * @returns {string} Returns the empty string.
+     * @example
+     *
+     * _.times(2, _.stubString);
+     * // => ['', '']
+     */
+    function stubString() {
+      return '';
+    }
+
+    /**
+     * This method returns `true`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.13.0
+     * @category Util
+     * @returns {boolean} Returns `true`.
+     * @example
+     *
+     * _.times(2, _.stubTrue);
+     * // => [true, true]
+     */
+    function stubTrue() {
+      return true;
+    }
+
+    /**
+     * Invokes the iteratee `n` times, returning an array of the results of
+     * each invocation. The iteratee is invoked with one argument; (index).
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Util
+     * @param {number} n The number of times to invoke `iteratee`.
+     * @param {Function} [iteratee=_.identity] The function invoked per iteration.
+     * @returns {Array} Returns the array of results.
+     * @example
+     *
+     * _.times(3, String);
+     * // => ['0', '1', '2']
+     *
+     *  _.times(4, _.constant(0));
+     * // => [0, 0, 0, 0]
+     */
+    function times(n, iteratee) {
+      n = toInteger(n);
+      if (n < 1 || n > MAX_SAFE_INTEGER) {
+        return [];
+      }
+      var index = MAX_ARRAY_LENGTH,
+          length = nativeMin(n, MAX_ARRAY_LENGTH);
+
+      iteratee = getIteratee(iteratee);
+      n -= MAX_ARRAY_LENGTH;
+
+      var result = baseTimes(length, iteratee);
+      while (++index < n) {
+        iteratee(index);
+      }
+      return result;
+    }
+
+    /**
+     * Converts `value` to a property path array.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Util
+     * @param {*} value The value to convert.
+     * @returns {Array} Returns the new property path array.
+     * @example
+     *
+     * _.toPath('a.b.c');
+     * // => ['a', 'b', 'c']
+     *
+     * _.toPath('a[0].b.c');
+     * // => ['a', '0', 'b', 'c']
+     */
+    function toPath(value) {
+      if (isArray(value)) {
+        return arrayMap(value, toKey);
+      }
+      return isSymbol(value) ? [value] : copyArray(stringToPath(toString(value)));
+    }
+
+    /**
+     * Generates a unique ID. If `prefix` is given, the ID is appended to it.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Util
+     * @param {string} [prefix=''] The value to prefix the ID with.
+     * @returns {string} Returns the unique ID.
+     * @example
+     *
+     * _.uniqueId('contact_');
+     * // => 'contact_104'
+     *
+     * _.uniqueId();
+     * // => '105'
+     */
+    function uniqueId(prefix) {
+      var id = ++idCounter;
+      return toString(prefix) + id;
+    }
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * Adds two numbers.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.4.0
+     * @category Math
+     * @param {number} augend The first number in an addition.
+     * @param {number} addend The second number in an addition.
+     * @returns {number} Returns the total.
+     * @example
+     *
+     * _.add(6, 4);
+     * // => 10
+     */
+    var add = createMathOperation(function(augend, addend) {
+      return augend + addend;
+    }, 0);
+
+    /**
+     * Computes `number` rounded up to `precision`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.10.0
+     * @category Math
+     * @param {number} number The number to round up.
+     * @param {number} [precision=0] The precision to round up to.
+     * @returns {number} Returns the rounded up number.
+     * @example
+     *
+     * _.ceil(4.006);
+     * // => 5
+     *
+     * _.ceil(6.004, 2);
+     * // => 6.01
+     *
+     * _.ceil(6040, -2);
+     * // => 6100
+     */
+    var ceil = createRound('ceil');
+
+    /**
+     * Divide two numbers.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.7.0
+     * @category Math
+     * @param {number} dividend The first number in a division.
+     * @param {number} divisor The second number in a division.
+     * @returns {number} Returns the quotient.
+     * @example
+     *
+     * _.divide(6, 4);
+     * // => 1.5
+     */
+    var divide = createMathOperation(function(dividend, divisor) {
+      return dividend / divisor;
+    }, 1);
+
+    /**
+     * Computes `number` rounded down to `precision`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.10.0
+     * @category Math
+     * @param {number} number The number to round down.
+     * @param {number} [precision=0] The precision to round down to.
+     * @returns {number} Returns the rounded down number.
+     * @example
+     *
+     * _.floor(4.006);
+     * // => 4
+     *
+     * _.floor(0.046, 2);
+     * // => 0.04
+     *
+     * _.floor(4060, -2);
+     * // => 4000
+     */
+    var floor = createRound('floor');
+
+    /**
+     * Computes the maximum value of `array`. If `array` is empty or falsey,
+     * `undefined` is returned.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Math
+     * @param {Array} array The array to iterate over.
+     * @returns {*} Returns the maximum value.
+     * @example
+     *
+     * _.max([4, 2, 8, 6]);
+     * // => 8
+     *
+     * _.max([]);
+     * // => undefined
+     */
+    function max(array) {
+      return (array && array.length)
+        ? baseExtremum(array, identity, baseGt)
+        : undefined;
+    }
+
+    /**
+     * This method is like `_.max` except that it accepts `iteratee` which is
+     * invoked for each element in `array` to generate the criterion by which
+     * the value is ranked. The iteratee is invoked with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Math
+     * @param {Array} array The array to iterate over.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {*} Returns the maximum value.
+     * @example
+     *
+     * var objects = [{ 'n': 1 }, { 'n': 2 }];
+     *
+     * _.maxBy(objects, function(o) { return o.n; });
+     * // => { 'n': 2 }
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.maxBy(objects, 'n');
+     * // => { 'n': 2 }
+     */
+    function maxBy(array, iteratee) {
+      return (array && array.length)
+        ? baseExtremum(array, getIteratee(iteratee, 2), baseGt)
+        : undefined;
+    }
+
+    /**
+     * Computes the mean of the values in `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Math
+     * @param {Array} array The array to iterate over.
+     * @returns {number} Returns the mean.
+     * @example
+     *
+     * _.mean([4, 2, 8, 6]);
+     * // => 5
+     */
+    function mean(array) {
+      return baseMean(array, identity);
+    }
+
+    /**
+     * This method is like `_.mean` except that it accepts `iteratee` which is
+     * invoked for each element in `array` to generate the value to be averaged.
+     * The iteratee is invoked with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.7.0
+     * @category Math
+     * @param {Array} array The array to iterate over.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {number} Returns the mean.
+     * @example
+     *
+     * var objects = [{ 'n': 4 }, { 'n': 2 }, { 'n': 8 }, { 'n': 6 }];
+     *
+     * _.meanBy(objects, function(o) { return o.n; });
+     * // => 5
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.meanBy(objects, 'n');
+     * // => 5
+     */
+    function meanBy(array, iteratee) {
+      return baseMean(array, getIteratee(iteratee, 2));
+    }
+
+    /**
+     * Computes the minimum value of `array`. If `array` is empty or falsey,
+     * `undefined` is returned.
+     *
+     * @static
+     * @since 0.1.0
+     * @memberOf _
+     * @category Math
+     * @param {Array} array The array to iterate over.
+     * @returns {*} Returns the minimum value.
+     * @example
+     *
+     * _.min([4, 2, 8, 6]);
+     * // => 2
+     *
+     * _.min([]);
+     * // => undefined
+     */
+    function min(array) {
+      return (array && array.length)
+        ? baseExtremum(array, identity, baseLt)
+        : undefined;
+    }
+
+    /**
+     * This method is like `_.min` except that it accepts `iteratee` which is
+     * invoked for each element in `array` to generate the criterion by which
+     * the value is ranked. The iteratee is invoked with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Math
+     * @param {Array} array The array to iterate over.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {*} Returns the minimum value.
+     * @example
+     *
+     * var objects = [{ 'n': 1 }, { 'n': 2 }];
+     *
+     * _.minBy(objects, function(o) { return o.n; });
+     * // => { 'n': 1 }
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.minBy(objects, 'n');
+     * // => { 'n': 1 }
+     */
+    function minBy(array, iteratee) {
+      return (array && array.length)
+        ? baseExtremum(array, getIteratee(iteratee, 2), baseLt)
+        : undefined;
+    }
+
+    /**
+     * Multiply two numbers.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.7.0
+     * @category Math
+     * @param {number} multiplier The first number in a multiplication.
+     * @param {number} multiplicand The second number in a multiplication.
+     * @returns {number} Returns the product.
+     * @example
+     *
+     * _.multiply(6, 4);
+     * // => 24
+     */
+    var multiply = createMathOperation(function(multiplier, multiplicand) {
+      return multiplier * multiplicand;
+    }, 1);
+
+    /**
+     * Computes `number` rounded to `precision`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.10.0
+     * @category Math
+     * @param {number} number The number to round.
+     * @param {number} [precision=0] The precision to round to.
+     * @returns {number} Returns the rounded number.
+     * @example
+     *
+     * _.round(4.006);
+     * // => 4
+     *
+     * _.round(4.006, 2);
+     * // => 4.01
+     *
+     * _.round(4060, -2);
+     * // => 4100
+     */
+    var round = createRound('round');
+
+    /**
+     * Subtract two numbers.
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Math
+     * @param {number} minuend The first number in a subtraction.
+     * @param {number} subtrahend The second number in a subtraction.
+     * @returns {number} Returns the difference.
+     * @example
+     *
+     * _.subtract(6, 4);
+     * // => 2
+     */
+    var subtract = createMathOperation(function(minuend, subtrahend) {
+      return minuend - subtrahend;
+    }, 0);
+
+    /**
+     * Computes the sum of the values in `array`.
+     *
+     * @static
+     * @memberOf _
+     * @since 3.4.0
+     * @category Math
+     * @param {Array} array The array to iterate over.
+     * @returns {number} Returns the sum.
+     * @example
+     *
+     * _.sum([4, 2, 8, 6]);
+     * // => 20
+     */
+    function sum(array) {
+      return (array && array.length)
+        ? baseSum(array, identity)
+        : 0;
+    }
+
+    /**
+     * This method is like `_.sum` except that it accepts `iteratee` which is
+     * invoked for each element in `array` to generate the value to be summed.
+     * The iteratee is invoked with one argument: (value).
+     *
+     * @static
+     * @memberOf _
+     * @since 4.0.0
+     * @category Math
+     * @param {Array} array The array to iterate over.
+     * @param {Function} [iteratee=_.identity] The iteratee invoked per element.
+     * @returns {number} Returns the sum.
+     * @example
+     *
+     * var objects = [{ 'n': 4 }, { 'n': 2 }, { 'n': 8 }, { 'n': 6 }];
+     *
+     * _.sumBy(objects, function(o) { return o.n; });
+     * // => 20
+     *
+     * // The `_.property` iteratee shorthand.
+     * _.sumBy(objects, 'n');
+     * // => 20
+     */
+    function sumBy(array, iteratee) {
+      return (array && array.length)
+        ? baseSum(array, getIteratee(iteratee, 2))
+        : 0;
+    }
+
+    /*------------------------------------------------------------------------*/
+
+    // Add methods that return wrapped values in chain sequences.
+    lodash.after = after;
+    lodash.ary = ary;
+    lodash.assign = assign;
+    lodash.assignIn = assignIn;
+    lodash.assignInWith = assignInWith;
+    lodash.assignWith = assignWith;
+    lodash.at = at;
+    lodash.before = before;
+    lodash.bind = bind;
+    lodash.bindAll = bindAll;
+    lodash.bindKey = bindKey;
+    lodash.castArray = castArray;
+    lodash.chain = chain;
+    lodash.chunk = chunk;
+    lodash.compact = compact;
+    lodash.concat = concat;
+    lodash.cond = cond;
+    lodash.conforms = conforms;
+    lodash.constant = constant;
+    lodash.countBy = countBy;
+    lodash.create = create;
+    lodash.curry = curry;
+    lodash.curryRight = curryRight;
+    lodash.debounce = debounce;
+    lodash.defaults = defaults;
+    lodash.defaultsDeep = defaultsDeep;
+    lodash.defer = defer;
+    lodash.delay = delay;
+    lodash.difference = difference;
+    lodash.differenceBy = differenceBy;
+    lodash.differenceWith = differenceWith;
+    lodash.drop = drop;
+    lodash.dropRight = dropRight;
+    lodash.dropRightWhile = dropRightWhile;
+    lodash.dropWhile = dropWhile;
+    lodash.fill = fill;
+    lodash.filter = filter;
+    lodash.flatMap = flatMap;
+    lodash.flatMapDeep = flatMapDeep;
+    lodash.flatMapDepth = flatMapDepth;
+    lodash.flatten = flatten;
+    lodash.flattenDeep = flattenDeep;
+    lodash.flattenDepth = flattenDepth;
+    lodash.flip = flip;
+    lodash.flow = flow;
+    lodash.flowRight = flowRight;
+    lodash.fromPairs = fromPairs;
+    lodash.functions = functions;
+    lodash.functionsIn = functionsIn;
+    lodash.groupBy = groupBy;
+    lodash.initial = initial;
+    lodash.intersection = intersection;
+    lodash.intersectionBy = intersectionBy;
+    lodash.intersectionWith = intersectionWith;
+    lodash.invert = invert;
+    lodash.invertBy = invertBy;
+    lodash.invokeMap = invokeMap;
+    lodash.iteratee = iteratee;
+    lodash.keyBy = keyBy;
+    lodash.keys = keys;
+    lodash.keysIn = keysIn;
+    lodash.map = map;
+    lodash.mapKeys = mapKeys;
+    lodash.mapValues = mapValues;
+    lodash.matches = matches;
+    lodash.matchesProperty = matchesProperty;
+    lodash.memoize = memoize;
+    lodash.merge = merge;
+    lodash.mergeWith = mergeWith;
+    lodash.method = method;
+    lodash.methodOf = methodOf;
+    lodash.mixin = mixin;
+    lodash.negate = negate;
+    lodash.nthArg = nthArg;
+    lodash.omit = omit;
+    lodash.omitBy = omitBy;
+    lodash.once = once;
+    lodash.orderBy = orderBy;
+    lodash.over = over;
+    lodash.overArgs = overArgs;
+    lodash.overEvery = overEvery;
+    lodash.overSome = overSome;
+    lodash.partial = partial;
+    lodash.partialRight = partialRight;
+    lodash.partition = partition;
+    lodash.pick = pick;
+    lodash.pickBy = pickBy;
+    lodash.property = property;
+    lodash.propertyOf = propertyOf;
+    lodash.pull = pull;
+    lodash.pullAll = pullAll;
+    lodash.pullAllBy = pullAllBy;
+    lodash.pullAllWith = pullAllWith;
+    lodash.pullAt = pullAt;
+    lodash.range = range;
+    lodash.rangeRight = rangeRight;
+    lodash.rearg = rearg;
+    lodash.reject = reject;
+    lodash.remove = remove;
+    lodash.rest = rest;
+    lodash.reverse = reverse;
+    lodash.sampleSize = sampleSize;
+    lodash.set = set;
+    lodash.setWith = setWith;
+    lodash.shuffle = shuffle;
+    lodash.slice = slice;
+    lodash.sortBy = sortBy;
+    lodash.sortedUniq = sortedUniq;
+    lodash.sortedUniqBy = sortedUniqBy;
+    lodash.split = split;
+    lodash.spread = spread;
+    lodash.tail = tail;
+    lodash.take = take;
+    lodash.takeRight = takeRight;
+    lodash.takeRightWhile = takeRightWhile;
+    lodash.takeWhile = takeWhile;
+    lodash.tap = tap;
+    lodash.throttle = throttle;
+    lodash.thru = thru;
+    lodash.toArray = toArray;
+    lodash.toPairs = toPairs;
+    lodash.toPairsIn = toPairsIn;
+    lodash.toPath = toPath;
+    lodash.toPlainObject = toPlainObject;
+    lodash.transform = transform;
+    lodash.unary = unary;
+    lodash.union = union;
+    lodash.unionBy = unionBy;
+    lodash.unionWith = unionWith;
+    lodash.uniq = uniq;
+    lodash.uniqBy = uniqBy;
+    lodash.uniqWith = uniqWith;
+    lodash.unset = unset;
+    lodash.unzip = unzip;
+    lodash.unzipWith = unzipWith;
+    lodash.update = update;
+    lodash.updateWith = updateWith;
+    lodash.values = values;
+    lodash.valuesIn = valuesIn;
+    lodash.without = without;
+    lodash.words = words;
+    lodash.wrap = wrap;
+    lodash.xor = xor;
+    lodash.xorBy = xorBy;
+    lodash.xorWith = xorWith;
+    lodash.zip = zip;
+    lodash.zipObject = zipObject;
+    lodash.zipObjectDeep = zipObjectDeep;
+    lodash.zipWith = zipWith;
+
+    // Add aliases.
+    lodash.entries = toPairs;
+    lodash.entriesIn = toPairsIn;
+    lodash.extend = assignIn;
+    lodash.extendWith = assignInWith;
+
+    // Add methods to `lodash.prototype`.
+    mixin(lodash, lodash);
+
+    /*------------------------------------------------------------------------*/
+
+    // Add methods that return unwrapped values in chain sequences.
+    lodash.add = add;
+    lodash.attempt = attempt;
+    lodash.camelCase = camelCase;
+    lodash.capitalize = capitalize;
+    lodash.ceil = ceil;
+    lodash.clamp = clamp;
+    lodash.clone = clone;
+    lodash.cloneDeep = cloneDeep;
+    lodash.cloneDeepWith = cloneDeepWith;
+    lodash.cloneWith = cloneWith;
+    lodash.conformsTo = conformsTo;
+    lodash.deburr = deburr;
+    lodash.defaultTo = defaultTo;
+    lodash.divide = divide;
+    lodash.endsWith = endsWith;
+    lodash.eq = eq;
+    lodash.escape = escape;
+    lodash.escapeRegExp = escapeRegExp;
+    lodash.every = every;
+    lodash.find = find;
+    lodash.findIndex = findIndex;
+    lodash.findKey = findKey;
+    lodash.findLast = findLast;
+    lodash.findLastIndex = findLastIndex;
+    lodash.findLastKey = findLastKey;
+    lodash.floor = floor;
+    lodash.forEach = forEach;
+    lodash.forEachRight = forEachRight;
+    lodash.forIn = forIn;
+    lodash.forInRight = forInRight;
+    lodash.forOwn = forOwn;
+    lodash.forOwnRight = forOwnRight;
+    lodash.get = get;
+    lodash.gt = gt;
+    lodash.gte = gte;
+    lodash.has = has;
+    lodash.hasIn = hasIn;
+    lodash.head = head;
+    lodash.identity = identity;
+    lodash.includes = includes;
+    lodash.indexOf = indexOf;
+    lodash.inRange = inRange;
+    lodash.invoke = invoke;
+    lodash.isArguments = isArguments;
+    lodash.isArray = isArray;
+    lodash.isArrayBuffer = isArrayBuffer;
+    lodash.isArrayLike = isArrayLike;
+    lodash.isArrayLikeObject = isArrayLikeObject;
+    lodash.isBoolean = isBoolean;
+    lodash.isBuffer = isBuffer;
+    lodash.isDate = isDate;
+    lodash.isElement = isElement;
+    lodash.isEmpty = isEmpty;
+    lodash.isEqual = isEqual;
+    lodash.isEqualWith = isEqualWith;
+    lodash.isError = isError;
+    lodash.isFinite = isFinite;
+    lodash.isFunction = isFunction;
+    lodash.isInteger = isInteger;
+    lodash.isLength = isLength;
+    lodash.isMap = isMap;
+    lodash.isMatch = isMatch;
+    lodash.isMatchWith = isMatchWith;
+    lodash.isNaN = isNaN;
+    lodash.isNative = isNative;
+    lodash.isNil = isNil;
+    lodash.isNull = isNull;
+    lodash.isNumber = isNumber;
+    lodash.isObject = isObject;
+    lodash.isObjectLike = isObjectLike;
+    lodash.isPlainObject = isPlainObject;
+    lodash.isRegExp = isRegExp;
+    lodash.isSafeInteger = isSafeInteger;
+    lodash.isSet = isSet;
+    lodash.isString = isString;
+    lodash.isSymbol = isSymbol;
+    lodash.isTypedArray = isTypedArray;
+    lodash.isUndefined = isUndefined;
+    lodash.isWeakMap = isWeakMap;
+    lodash.isWeakSet = isWeakSet;
+    lodash.join = join;
+    lodash.kebabCase = kebabCase;
+    lodash.last = last;
+    lodash.lastIndexOf = lastIndexOf;
+    lodash.lowerCase = lowerCase;
+    lodash.lowerFirst = lowerFirst;
+    lodash.lt = lt;
+    lodash.lte = lte;
+    lodash.max = max;
+    lodash.maxBy = maxBy;
+    lodash.mean = mean;
+    lodash.meanBy = meanBy;
+    lodash.min = min;
+    lodash.minBy = minBy;
+    lodash.stubArray = stubArray;
+    lodash.stubFalse = stubFalse;
+    lodash.stubObject = stubObject;
+    lodash.stubString = stubString;
+    lodash.stubTrue = stubTrue;
+    lodash.multiply = multiply;
+    lodash.nth = nth;
+    lodash.noConflict = noConflict;
+    lodash.noop = noop;
+    lodash.now = now;
+    lodash.pad = pad;
+    lodash.padEnd = padEnd;
+    lodash.padStart = padStart;
+    lodash.parseInt = parseInt;
+    lodash.random = random;
+    lodash.reduce = reduce;
+    lodash.reduceRight = reduceRight;
+    lodash.repeat = repeat;
+    lodash.replace = replace;
+    lodash.result = result;
+    lodash.round = round;
+    lodash.runInContext = runInContext;
+    lodash.sample = sample;
+    lodash.size = size;
+    lodash.snakeCase = snakeCase;
+    lodash.some = some;
+    lodash.sortedIndex = sortedIndex;
+    lodash.sortedIndexBy = sortedIndexBy;
+    lodash.sortedIndexOf = sortedIndexOf;
+    lodash.sortedLastIndex = sortedLastIndex;
+    lodash.sortedLastIndexBy = sortedLastIndexBy;
+    lodash.sortedLastIndexOf = sortedLastIndexOf;
+    lodash.startCase = startCase;
+    lodash.startsWith = startsWith;
+    lodash.subtract = subtract;
+    lodash.sum = sum;
+    lodash.sumBy = sumBy;
+    lodash.template = template;
+    lodash.times = times;
+    lodash.toFinite = toFinite;
+    lodash.toInteger = toInteger;
+    lodash.toLength = toLength;
+    lodash.toLower = toLower;
+    lodash.toNumber = toNumber;
+    lodash.toSafeInteger = toSafeInteger;
+    lodash.toString = toString;
+    lodash.toUpper = toUpper;
+    lodash.trim = trim;
+    lodash.trimEnd = trimEnd;
+    lodash.trimStart = trimStart;
+    lodash.truncate = truncate;
+    lodash.unescape = unescape;
+    lodash.uniqueId = uniqueId;
+    lodash.upperCase = upperCase;
+    lodash.upperFirst = upperFirst;
+
+    // Add aliases.
+    lodash.each = forEach;
+    lodash.eachRight = forEachRight;
+    lodash.first = head;
+
+    mixin(lodash, (function() {
+      var source = {};
+      baseForOwn(lodash, function(func, methodName) {
+        if (!hasOwnProperty.call(lodash.prototype, methodName)) {
+          source[methodName] = func;
+        }
+      });
+      return source;
+    }()), { 'chain': false });
+
+    /*------------------------------------------------------------------------*/
+
+    /**
+     * The semantic version number.
+     *
+     * @static
+     * @memberOf _
+     * @type {string}
+     */
+    lodash.VERSION = VERSION;
+
+    // Assign default placeholders.
+    arrayEach(['bind', 'bindKey', 'curry', 'curryRight', 'partial', 'partialRight'], function(methodName) {
+      lodash[methodName].placeholder = lodash;
+    });
+
+    // Add `LazyWrapper` methods for `_.drop` and `_.take` variants.
+    arrayEach(['drop', 'take'], function(methodName, index) {
+      LazyWrapper.prototype[methodName] = function(n) {
+        n = n === undefined ? 1 : nativeMax(toInteger(n), 0);
+
+        var result = (this.__filtered__ && !index)
+          ? new LazyWrapper(this)
+          : this.clone();
+
+        if (result.__filtered__) {
+          result.__takeCount__ = nativeMin(n, result.__takeCount__);
+        } else {
+          result.__views__.push({
+            'size': nativeMin(n, MAX_ARRAY_LENGTH),
+            'type': methodName + (result.__dir__ < 0 ? 'Right' : '')
+          });
+        }
+        return result;
+      };
+
+      LazyWrapper.prototype[methodName + 'Right'] = function(n) {
+        return this.reverse()[methodName](n).reverse();
+      };
+    });
+
+    // Add `LazyWrapper` methods that accept an `iteratee` value.
+    arrayEach(['filter', 'map', 'takeWhile'], function(methodName, index) {
+      var type = index + 1,
+          isFilter = type == LAZY_FILTER_FLAG || type == LAZY_WHILE_FLAG;
+
+      LazyWrapper.prototype[methodName] = function(iteratee) {
+        var result = this.clone();
+        result.__iteratees__.push({
+          'iteratee': getIteratee(iteratee, 3),
+          'type': type
+        });
+        result.__filtered__ = result.__filtered__ || isFilter;
+        return result;
+      };
+    });
+
+    // Add `LazyWrapper` methods for `_.head` and `_.last`.
+    arrayEach(['head', 'last'], function(methodName, index) {
+      var takeName = 'take' + (index ? 'Right' : '');
+
+      LazyWrapper.prototype[methodName] = function() {
+        return this[takeName](1).value()[0];
+      };
+    });
+
+    // Add `LazyWrapper` methods for `_.initial` and `_.tail`.
+    arrayEach(['initial', 'tail'], function(methodName, index) {
+      var dropName = 'drop' + (index ? '' : 'Right');
+
+      LazyWrapper.prototype[methodName] = function() {
+        return this.__filtered__ ? new LazyWrapper(this) : this[dropName](1);
+      };
+    });
+
+    LazyWrapper.prototype.compact = function() {
+      return this.filter(identity);
+    };
+
+    LazyWrapper.prototype.find = function(predicate) {
+      return this.filter(predicate).head();
+    };
+
+    LazyWrapper.prototype.findLast = function(predicate) {
+      return this.reverse().find(predicate);
+    };
+
+    LazyWrapper.prototype.invokeMap = baseRest(function(path, args) {
+      if (typeof path == 'function') {
+        return new LazyWrapper(this);
+      }
+      return this.map(function(value) {
+        return baseInvoke(value, path, args);
+      });
+    });
+
+    LazyWrapper.prototype.reject = function(predicate) {
+      return this.filter(negate(getIteratee(predicate)));
+    };
+
+    LazyWrapper.prototype.slice = function(start, end) {
+      start = toInteger(start);
+
+      var result = this;
+      if (result.__filtered__ && (start > 0 || end < 0)) {
+        return new LazyWrapper(result);
+      }
+      if (start < 0) {
+        result = result.takeRight(-start);
+      } else if (start) {
+        result = result.drop(start);
+      }
+      if (end !== undefined) {
+        end = toInteger(end);
+        result = end < 0 ? result.dropRight(-end) : result.take(end - start);
+      }
+      return result;
+    };
+
+    LazyWrapper.prototype.takeRightWhile = function(predicate) {
+      return this.reverse().takeWhile(predicate).reverse();
+    };
+
+    LazyWrapper.prototype.toArray = function() {
+      return this.take(MAX_ARRAY_LENGTH);
+    };
+
+    // Add `LazyWrapper` methods to `lodash.prototype`.
+    baseForOwn(LazyWrapper.prototype, function(func, methodName) {
+      var checkIteratee = /^(?:filter|find|map|reject)|While$/.test(methodName),
+          isTaker = /^(?:head|last)$/.test(methodName),
+          lodashFunc = lodash[isTaker ? ('take' + (methodName == 'last' ? 'Right' : '')) : methodName],
+          retUnwrapped = isTaker || /^find/.test(methodName);
+
+      if (!lodashFunc) {
+        return;
+      }
+      lodash.prototype[methodName] = function() {
+        var value = this.__wrapped__,
+            args = isTaker ? [1] : arguments,
+            isLazy = value instanceof LazyWrapper,
+            iteratee = args[0],
+            useLazy = isLazy || isArray(value);
+
+        var interceptor = function(value) {
+          var result = lodashFunc.apply(lodash, arrayPush([value], args));
+          return (isTaker && chainAll) ? result[0] : result;
+        };
+
+        if (useLazy && checkIteratee && typeof iteratee == 'function' && iteratee.length != 1) {
+          // Avoid lazy use if the iteratee has a "length" value other than `1`.
+          isLazy = useLazy = false;
+        }
+        var chainAll = this.__chain__,
+            isHybrid = !!this.__actions__.length,
+            isUnwrapped = retUnwrapped && !chainAll,
+            onlyLazy = isLazy && !isHybrid;
+
+        if (!retUnwrapped && useLazy) {
+          value = onlyLazy ? value : new LazyWrapper(this);
+          var result = func.apply(value, args);
+          result.__actions__.push({ 'func': thru, 'args': [interceptor], 'thisArg': undefined });
+          return new LodashWrapper(result, chainAll);
+        }
+        if (isUnwrapped && onlyLazy) {
+          return func.apply(this, args);
+        }
+        result = this.thru(interceptor);
+        return isUnwrapped ? (isTaker ? result.value()[0] : result.value()) : result;
+      };
+    });
+
+    // Add `Array` methods to `lodash.prototype`.
+    arrayEach(['pop', 'push', 'shift', 'sort', 'splice', 'unshift'], function(methodName) {
+      var func = arrayProto[methodName],
+          chainName = /^(?:push|sort|unshift)$/.test(methodName) ? 'tap' : 'thru',
+          retUnwrapped = /^(?:pop|shift)$/.test(methodName);
+
+      lodash.prototype[methodName] = function() {
+        var args = arguments;
+        if (retUnwrapped && !this.__chain__) {
+          var value = this.value();
+          return func.apply(isArray(value) ? value : [], args);
+        }
+        return this[chainName](function(value) {
+          return func.apply(isArray(value) ? value : [], args);
+        });
+      };
+    });
+
+    // Map minified method names to their real names.
+    baseForOwn(LazyWrapper.prototype, function(func, methodName) {
+      var lodashFunc = lodash[methodName];
+      if (lodashFunc) {
+        var key = lodashFunc.name + '';
+        if (!hasOwnProperty.call(realNames, key)) {
+          realNames[key] = [];
+        }
+        realNames[key].push({ 'name': methodName, 'func': lodashFunc });
+      }
+    });
+
+    realNames[createHybrid(undefined, WRAP_BIND_KEY_FLAG).name] = [{
+      'name': 'wrapper',
+      'func': undefined
+    }];
+
+    // Add methods to `LazyWrapper`.
+    LazyWrapper.prototype.clone = lazyClone;
+    LazyWrapper.prototype.reverse = lazyReverse;
+    LazyWrapper.prototype.value = lazyValue;
+
+    // Add chain sequence methods to the `lodash` wrapper.
+    lodash.prototype.at = wrapperAt;
+    lodash.prototype.chain = wrapperChain;
+    lodash.prototype.commit = wrapperCommit;
+    lodash.prototype.next = wrapperNext;
+    lodash.prototype.plant = wrapperPlant;
+    lodash.prototype.reverse = wrapperReverse;
+    lodash.prototype.toJSON = lodash.prototype.valueOf = lodash.prototype.value = wrapperValue;
+
+    // Add lazy aliases.
+    lodash.prototype.first = lodash.prototype.head;
+
+    if (symIterator) {
+      lodash.prototype[symIterator] = wrapperToIterator;
+    }
+    return lodash;
+  });
+
+  /*--------------------------------------------------------------------------*/
+
+  // Export lodash.
+  var _ = runInContext();
+
+  // Some AMD build optimizers, like r.js, check for condition patterns like:
+  if (typeof define == 'function' && typeof define.amd == 'object' && define.amd) {
+    // Expose Lodash on the global object to prevent errors when Lodash is
+    // loaded by a script tag in the presence of an AMD loader.
+    // See http://requirejs.org/docs/errors.html#mismatch for more details.
+    // Use `_.noConflict` to remove Lodash from the global object.
+    root._ = _;
+
+    // Define as an anonymous module so, through path mapping, it can be
+    // referenced as the "underscore" module.
+    define(function() {
+      return _;
+    });
+  }
+  // Check for `exports` after `define` in case a build optimizer adds it.
+  else if (freeModule) {
+    // Export for Node.js.
+    (freeModule.exports = _)._ = _;
+    // Export for CommonJS support.
+    freeExports._ = _;
+  }
+  else {
+    // Export to the global object.
+    root._ = _;
+  }
+}.call(this));
diff --git a/ddb_main/node_modules/lodash/memoize.js b/ddb_main/node_modules/lodash/memoize.js
new file mode 100644
index 0000000..d6035af
--- /dev/null
+++ b/ddb_main/node_modules/lodash/memoize.js
@@ -0,0 +1,73 @@
+var MapCache = require('./_MapCache');
+
+/** Error message constants. */
+var FUNC_ERROR_TEXT = 'Expected a function';
+
+/**
+ * Creates a function that memoizes the result of `func`. If `resolver` is
+ * provided, it determines the cache key for storing the result based on the
+ * arguments provided to the memoized function. By default, the first argument
+ * provided to the memoized function is used as the map cache key. The `func`
+ * is invoked with the `this` binding of the memoized function.
+ *
+ * **Note:** The cache is exposed as the `cache` property on the memoized
+ * function. Its creation may be customized by replacing the `_.memoize.Cache`
+ * constructor with one whose instances implement the
+ * [`Map`](http://ecma-international.org/ecma-262/7.0/#sec-properties-of-the-map-prototype-object)
+ * method interface of `clear`, `delete`, `get`, `has`, and `set`.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Function
+ * @param {Function} func The function to have its output memoized.
+ * @param {Function} [resolver] The function to resolve the cache key.
+ * @returns {Function} Returns the new memoized function.
+ * @example
+ *
+ * var object = { 'a': 1, 'b': 2 };
+ * var other = { 'c': 3, 'd': 4 };
+ *
+ * var values = _.memoize(_.values);
+ * values(object);
+ * // => [1, 2]
+ *
+ * values(other);
+ * // => [3, 4]
+ *
+ * object.a = 2;
+ * values(object);
+ * // => [1, 2]
+ *
+ * // Modify the result cache.
+ * values.cache.set(object, ['a', 'b']);
+ * values(object);
+ * // => ['a', 'b']
+ *
+ * // Replace `_.memoize.Cache`.
+ * _.memoize.Cache = WeakMap;
+ */
+function memoize(func, resolver) {
+  if (typeof func != 'function' || (resolver != null && typeof resolver != 'function')) {
+    throw new TypeError(FUNC_ERROR_TEXT);
+  }
+  var memoized = function() {
+    var args = arguments,
+        key = resolver ? resolver.apply(this, args) : args[0],
+        cache = memoized.cache;
+
+    if (cache.has(key)) {
+      return cache.get(key);
+    }
+    var result = func.apply(this, args);
+    memoized.cache = cache.set(key, result) || cache;
+    return result;
+  };
+  memoized.cache = new (memoize.Cache || MapCache);
+  return memoized;
+}
+
+// Expose `MapCache`.
+memoize.Cache = MapCache;
+
+module.exports = memoize;
diff --git a/ddb_main/node_modules/lodash/property.js b/ddb_main/node_modules/lodash/property.js
new file mode 100644
index 0000000..ca8202f
--- /dev/null
+++ b/ddb_main/node_modules/lodash/property.js
@@ -0,0 +1,32 @@
+var baseProperty = require('./_baseProperty'),
+    basePropertyDeep = require('./_basePropertyDeep'),
+    isKey = require('./_isKey'),
+    toKey = require('./_toKey');
+
+/**
+ * Creates a function that returns the value at `path` of a given object.
+ *
+ * @static
+ * @memberOf _
+ * @since 2.4.0
+ * @category Util
+ * @param {Array|string} path The path of the property to get.
+ * @returns {Function} Returns the new accessor function.
+ * @example
+ *
+ * var objects = [
+ *   { 'a': { 'b': 2 } },
+ *   { 'a': { 'b': 1 } }
+ * ];
+ *
+ * _.map(objects, _.property('a.b'));
+ * // => [2, 1]
+ *
+ * _.map(_.sortBy(objects, _.property(['a', 'b'])), 'a.b');
+ * // => [1, 2]
+ */
+function property(path) {
+  return isKey(path) ? baseProperty(toKey(path)) : basePropertyDeep(path);
+}
+
+module.exports = property;
diff --git a/ddb_main/node_modules/lodash/sortBy.js b/ddb_main/node_modules/lodash/sortBy.js
new file mode 100644
index 0000000..d756aba
--- /dev/null
+++ b/ddb_main/node_modules/lodash/sortBy.js
@@ -0,0 +1,48 @@
+var baseFlatten = require('./_baseFlatten'),
+    baseOrderBy = require('./_baseOrderBy'),
+    baseRest = require('./_baseRest'),
+    isIterateeCall = require('./_isIterateeCall');
+
+/**
+ * Creates an array of elements, sorted in ascending order by the results of
+ * running each element in a collection thru each iteratee. This method
+ * performs a stable sort, that is, it preserves the original sort order of
+ * equal elements. The iteratees are invoked with one argument: (value).
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Collection
+ * @param {Array|Object} collection The collection to iterate over.
+ * @param {...(Function|Function[])} [iteratees=[_.identity]]
+ *  The iteratees to sort by.
+ * @returns {Array} Returns the new sorted array.
+ * @example
+ *
+ * var users = [
+ *   { 'user': 'fred',   'age': 48 },
+ *   { 'user': 'barney', 'age': 36 },
+ *   { 'user': 'fred',   'age': 30 },
+ *   { 'user': 'barney', 'age': 34 }
+ * ];
+ *
+ * _.sortBy(users, [function(o) { return o.user; }]);
+ * // => objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 30]]
+ *
+ * _.sortBy(users, ['user', 'age']);
+ * // => objects for [['barney', 34], ['barney', 36], ['fred', 30], ['fred', 48]]
+ */
+var sortBy = baseRest(function(collection, iteratees) {
+  if (collection == null) {
+    return [];
+  }
+  var length = iteratees.length;
+  if (length > 1 && isIterateeCall(collection, iteratees[0], iteratees[1])) {
+    iteratees = [];
+  } else if (length > 2 && isIterateeCall(iteratees[0], iteratees[1], iteratees[2])) {
+    iteratees = [iteratees[0]];
+  }
+  return baseOrderBy(collection, baseFlatten(iteratees, 1), []);
+});
+
+module.exports = sortBy;
diff --git a/ddb_main/node_modules/lodash/stubArray.js b/ddb_main/node_modules/lodash/stubArray.js
new file mode 100644
index 0000000..f460c15
--- /dev/null
+++ b/ddb_main/node_modules/lodash/stubArray.js
@@ -0,0 +1,23 @@
+/**
+ * This method returns a new empty array.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.13.0
+ * @category Util
+ * @returns {Array} Returns the new empty array.
+ * @example
+ *
+ * var arrays = _.times(2, _.stubArray);
+ *
+ * console.log(arrays);
+ * // => [[], []]
+ *
+ * console.log(arrays[0] === arrays[1]);
+ * // => false
+ */
+function stubArray() {
+  return [];
+}
+
+module.exports = stubArray;
diff --git a/ddb_main/node_modules/lodash/stubFalse.js b/ddb_main/node_modules/lodash/stubFalse.js
new file mode 100644
index 0000000..9b346fc
--- /dev/null
+++ b/ddb_main/node_modules/lodash/stubFalse.js
@@ -0,0 +1,18 @@
+/**
+ * This method returns `false`.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.13.0
+ * @category Util
+ * @returns {boolean} Returns `false`.
+ * @example
+ *
+ * _.times(2, _.stubFalse);
+ * // => [false, false]
+ */
+function stubFalse() {
+  return false;
+}
+
+module.exports = stubFalse;
diff --git a/ddb_main/node_modules/lodash/toString.js b/ddb_main/node_modules/lodash/toString.js
new file mode 100644
index 0000000..daaf681
--- /dev/null
+++ b/ddb_main/node_modules/lodash/toString.js
@@ -0,0 +1,28 @@
+var baseToString = require('./_baseToString');
+
+/**
+ * Converts `value` to a string. An empty string is returned for `null`
+ * and `undefined` values. The sign of `-0` is preserved.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to convert.
+ * @returns {string} Returns the converted string.
+ * @example
+ *
+ * _.toString(null);
+ * // => ''
+ *
+ * _.toString(-0);
+ * // => '-0'
+ *
+ * _.toString([1, 2, 3]);
+ * // => '1,2,3'
+ */
+function toString(value) {
+  return value == null ? '' : baseToString(value);
+}
+
+module.exports = toString;
diff --git a/ddb_main/node_modules/lodash/uniqueId.js b/ddb_main/node_modules/lodash/uniqueId.js
new file mode 100644
index 0000000..ffa8c03
--- /dev/null
+++ b/ddb_main/node_modules/lodash/uniqueId.js
@@ -0,0 +1,28 @@
+var toString = require('./toString');
+
+/** Used to generate unique IDs. */
+var idCounter = 0;
+
+/**
+ * Generates a unique ID. If `prefix` is given, the ID is appended to it.
+ *
+ * @static
+ * @since 0.1.0
+ * @memberOf _
+ * @category Util
+ * @param {string} [prefix=''] The value to prefix the ID with.
+ * @returns {string} Returns the unique ID.
+ * @example
+ *
+ * _.uniqueId('contact_');
+ * // => 'contact_104'
+ *
+ * _.uniqueId();
+ * // => '105'
+ */
+function uniqueId(prefix) {
+  var id = ++idCounter;
+  return toString(prefix) + id;
+}
+
+module.exports = uniqueId;
diff --git a/ddb_main/node_modules/minimal-polyfills/src/Array.prototype.find.ts b/ddb_main/node_modules/minimal-polyfills/src/Array.prototype.find.ts
new file mode 100644
index 0000000..db806f9
--- /dev/null
+++ b/ddb_main/node_modules/minimal-polyfills/src/Array.prototype.find.ts
@@ -0,0 +1,49 @@
+
+// https://tc39.github.io/ecma262/#sec-array.prototype.find
+if (!Array.prototype.find) {
+  Object.defineProperty(Array.prototype, 'find', {
+    value: function(predicate: any) {
+     // 1. Let O be ? ToObject(this value).
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      var o = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(O, "length")).
+      var len = o.length >>> 0;
+
+      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
+      if (typeof predicate !== 'function') {
+        throw new TypeError('predicate must be a function');
+      }
+
+      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
+      var thisArg = arguments[1];
+
+      // 5. Let k be 0.
+      var k = 0;
+
+      // 6. Repeat, while k < len
+      while (k < len) {
+        // a. Let Pk be ! ToString(k).
+        // b. Let kValue be ? Get(O, Pk).
+        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
+        // d. If testResult is true, return kValue.
+        var kValue = o[k];
+        if (predicate.call(thisArg, kValue, k, o)) {
+          return kValue;
+        }
+        // e. Increase k by 1.
+        k++;
+      }
+
+      // 7. Return undefined.
+      return undefined;
+    },
+    configurable: true,
+    writable: true
+  });
+}
+
+export {};
\ No newline at end of file
diff --git a/ddb_main/node_modules/minimal-polyfills/src/Map.ts b/ddb_main/node_modules/minimal-polyfills/src/Map.ts
new file mode 100644
index 0000000..b5bc839
--- /dev/null
+++ b/ddb_main/node_modules/minimal-polyfills/src/Map.ts
@@ -0,0 +1,83 @@
+
+
+export interface LightMap<K,V> {
+    [Symbol.toStringTag]: string;
+    has(key: K): boolean;
+    get(key: K): V | undefined;
+    set(key: K, value: V): this;
+    delete(key: K): boolean;
+    keys(): Iterable<K>;
+}
+
+export class LightMapImpl<K,V> implements LightMap<K,V> {
+
+    [Symbol.toStringTag]!: string;
+
+    private readonly record: [K, V][]= [];
+
+    constructor(){ }
+
+    public has(key: K): boolean {
+        return this.record
+            .map(([_key]) => _key)
+            .indexOf(key) >= 0;
+    }
+
+    public get(key: K): V | undefined {
+
+        const [ entry ]= this.record
+            .filter(([_key]) => _key === key)
+            ;
+
+        if( entry === undefined ){
+            return undefined;
+        }
+
+        return entry[1];
+
+    }
+
+    public set(key: K, value: V) {
+
+        const [ entry ]= this.record
+            .filter(([_key]) => _key === key)
+            ;
+
+        if( entry === undefined ){
+
+            this.record.push([key, value]);
+
+        }else{
+
+            entry[1]= value;
+
+        }
+
+        return this;
+
+    }
+
+    public delete(key: K): boolean{
+
+        const index= this.record.map(([ key])=> key).indexOf(key);
+
+        if( index < 0 ){
+            return false;
+        }
+
+        this.record.splice(index, 1);
+
+        return true;
+
+    }
+
+    public keys(): Iterable<K> {
+        return this.record.map(([ key ])=> key);
+    }
+
+}
+
+
+export const Polyfill: { new<K,V>(): LightMap<K,V> } = 
+    typeof Map !== "undefined" ? Map : LightMapImpl;
+
diff --git a/ddb_main/node_modules/minimal-polyfills/src/Object.is.ts b/ddb_main/node_modules/minimal-polyfills/src/Object.is.ts
new file mode 100644
index 0000000..9b9b8b1
--- /dev/null
+++ b/ddb_main/node_modules/minimal-polyfills/src/Object.is.ts
@@ -0,0 +1,15 @@
+
+if (!Object.is) {
+    Object.is = function(x, y) {
+      // SameValue algorithm
+      if (x === y) { // Steps 1-5, 7-10
+        // Steps 6.b-6.e: +0 != -0
+        return x !== 0 || 1 / x === 1 / y;
+      } else {
+        // Step 6.a: NaN == NaN
+        return x !== x && y !== y;
+      }
+    };
+  }
+
+  export {};
\ No newline at end of file
diff --git a/ddb_main/node_modules/minimal-polyfills/src/Set.ts b/ddb_main/node_modules/minimal-polyfills/src/Set.ts
new file mode 100644
index 0000000..fd5e790
--- /dev/null
+++ b/ddb_main/node_modules/minimal-polyfills/src/Set.ts
@@ -0,0 +1,50 @@
+
+import { Polyfill as MapPolyfill } from "./Map";
+
+export interface LightSet<T> {
+    [Symbol.toStringTag]: string;
+    has(value: T): boolean;
+    add(value: T): this;
+    values(): Iterable<T>;
+    delete(value: T): boolean;
+}
+
+export class LightSetImpl<T> implements LightSet<T> {
+
+    [Symbol.toStringTag]!: string;
+
+    private readonly map= new MapPolyfill<T, true>();
+
+    constructor(values?: T[]){
+
+        if( values === undefined ){
+            return;
+        }
+
+        for( let value of values ){
+            this.add(value);
+        }
+
+    }
+
+    public has(value: T): boolean{
+        return this.map.has(value);
+    }
+
+    public add(value: T): this {
+        this.map.set(value, true);
+        return this;
+    }
+
+    public values(): Iterable<T> {
+        return this.map.keys();
+    }
+
+    public delete(value: T): boolean {
+        return this.map.delete(value);
+    }
+
+}
+
+export const Polyfill: { new<T>(values?: T[]): LightSet<T> } = 
+    typeof Set !== "undefined" ? Set : LightSetImpl;
diff --git a/ddb_main/node_modules/minimal-polyfills/src/WeakMap.ts b/ddb_main/node_modules/minimal-polyfills/src/WeakMap.ts
new file mode 100644
index 0000000..45b8d4c
--- /dev/null
+++ b/ddb_main/node_modules/minimal-polyfills/src/WeakMap.ts
@@ -0,0 +1,7 @@
+
+
+import { Polyfill as MapPolyfill } from "./Map";
+
+export const Polyfill: { new<K extends object,V>(): WeakMap<K,V> } = 
+    typeof WeakMap !== "undefined" ? WeakMap : MapPolyfill;
+
diff --git a/ddb_main/node_modules/number-to-words/numberToWords.min.js b/ddb_main/node_modules/number-to-words/numberToWords.min.js
new file mode 100644
index 0000000..61c36e3
--- /dev/null
+++ b/ddb_main/node_modules/number-to-words/numberToWords.min.js
@@ -0,0 +1,9 @@
+/*!
+ * Number-To-Words util
+ * @version v1.2.4
+ * @link https://github.com/marlun78/number-to-words
+ * @author Martin Eneqvist (https://github.com/marlun78)
+ * @contributors Aleksey Pilyugin (https://github.com/pilyugin),Jeremiah Hall (https://github.com/jeremiahrhall),Adriano Melo (https://github.com/adrianomelo),dmrzn (https://github.com/dmrzn)
+ * @license MIT
+ */
+!function(){"use strict";var e="object"==typeof self&&self.self===self&&self||"object"==typeof global&&global.global===global&&global||this,t=9007199254740991;function f(e){return!("number"!=typeof e||e!=e||e===1/0||e===-1/0)}function l(e){return"number"==typeof e&&Math.abs(e)<=t}var n=/(hundred|thousand|(m|b|tr|quadr)illion)$/,r=/teen$/,o=/y$/,i=/(zero|one|two|three|four|five|six|seven|eight|nine|ten|eleven|twelve)$/,s={zero:"zeroth",one:"first",two:"second",three:"third",four:"fourth",five:"fifth",six:"sixth",seven:"seventh",eight:"eighth",nine:"ninth",ten:"tenth",eleven:"eleventh",twelve:"twelfth"};function h(e){return n.test(e)||r.test(e)?e+"th":o.test(e)?e.replace(o,"ieth"):i.test(e)?e.replace(i,a):e}function a(e,t){return s[t]}var u=10,d=100,p=1e3,v=1e6,b=1e9,y=1e12,c=1e15,g=9007199254740992,m=["zero","one","two","three","four","five","six","seven","eight","nine","ten","eleven","twelve","thirteen","fourteen","fifteen","sixteen","seventeen","eighteen","nineteen"],w=["zero","ten","twenty","thirty","forty","fifty","sixty","seventy","eighty","ninety"];function x(e,t){var n,r=parseInt(e,10);if(!f(r))throw new TypeError("Not a finite number: "+e+" ("+typeof e+")");if(!l(r))throw new RangeError("Input is not a safe number, it’s either too large or too small.");return n=function e(t){var n,r,o=arguments[1];if(0===t)return o?o.join(" ").replace(/,$/,""):"zero";o||(o=[]);t<0&&(o.push("minus"),t=Math.abs(t));t<20?(n=0,r=m[t]):t<d?(n=t%u,r=w[Math.floor(t/u)],n&&(r+="-"+m[n],n=0)):t<p?(n=t%d,r=e(Math.floor(t/d))+" hundred"):t<v?(n=t%p,r=e(Math.floor(t/p))+" thousand,"):t<b?(n=t%v,r=e(Math.floor(t/v))+" million,"):t<y?(n=t%b,r=e(Math.floor(t/b))+" billion,"):t<c?(n=t%y,r=e(Math.floor(t/y))+" trillion,"):t<=g&&(n=t%c,r=e(Math.floor(t/c))+" quadrillion,");o.push(r);return e(n,o)}(r),t?h(n):n}var M={toOrdinal:function(e){var t=parseInt(e,10);if(!f(t))throw new TypeError("Not a finite number: "+e+" ("+typeof e+")");if(!l(t))throw new RangeError("Input is not a safe number, it’s either too large or too small.");var n=String(t),r=Math.abs(t%100),o=11<=r&&r<=13,i=n.charAt(n.length-1);return n+(o?"th":"1"===i?"st":"2"===i?"nd":"3"===i?"rd":"th")},toWords:x,toWordsOrdinal:function(e){return h(x(e))}};"undefined"!=typeof exports?("undefined"!=typeof module&&module.exports&&(exports=module.exports=M),exports.numberToWords=M):e.numberToWords=M}();
\ No newline at end of file
diff --git a/ddb_main/node_modules/object-assign/index.js b/ddb_main/node_modules/object-assign/index.js
new file mode 100644
index 0000000..0930cf8
--- /dev/null
+++ b/ddb_main/node_modules/object-assign/index.js
@@ -0,0 +1,90 @@
+/*
+object-assign
+(c) Sindre Sorhus
+@license MIT
+*/
+
+'use strict';
+/* eslint-disable no-unused-vars */
+var getOwnPropertySymbols = Object.getOwnPropertySymbols;
+var hasOwnProperty = Object.prototype.hasOwnProperty;
+var propIsEnumerable = Object.prototype.propertyIsEnumerable;
+
+function toObject(val) {
+	if (val === null || val === undefined) {
+		throw new TypeError('Object.assign cannot be called with null or undefined');
+	}
+
+	return Object(val);
+}
+
+function shouldUseNative() {
+	try {
+		if (!Object.assign) {
+			return false;
+		}
+
+		// Detect buggy property enumeration order in older V8 versions.
+
+		// https://bugs.chromium.org/p/v8/issues/detail?id=4118
+		var test1 = new String('abc');  // eslint-disable-line no-new-wrappers
+		test1[5] = 'de';
+		if (Object.getOwnPropertyNames(test1)[0] === '5') {
+			return false;
+		}
+
+		// https://bugs.chromium.org/p/v8/issues/detail?id=3056
+		var test2 = {};
+		for (var i = 0; i < 10; i++) {
+			test2['_' + String.fromCharCode(i)] = i;
+		}
+		var order2 = Object.getOwnPropertyNames(test2).map(function (n) {
+			return test2[n];
+		});
+		if (order2.join('') !== '0123456789') {
+			return false;
+		}
+
+		// https://bugs.chromium.org/p/v8/issues/detail?id=3056
+		var test3 = {};
+		'abcdefghijklmnopqrst'.split('').forEach(function (letter) {
+			test3[letter] = letter;
+		});
+		if (Object.keys(Object.assign({}, test3)).join('') !==
+				'abcdefghijklmnopqrst') {
+			return false;
+		}
+
+		return true;
+	} catch (err) {
+		// We don't expect any of the above to throw, but better to be safe.
+		return false;
+	}
+}
+
+module.exports = shouldUseNative() ? Object.assign : function (target, source) {
+	var from;
+	var to = toObject(target);
+	var symbols;
+
+	for (var s = 1; s < arguments.length; s++) {
+		from = Object(arguments[s]);
+
+		for (var key in from) {
+			if (hasOwnProperty.call(from, key)) {
+				to[key] = from[key];
+			}
+		}
+
+		if (getOwnPropertySymbols) {
+			symbols = getOwnPropertySymbols(from);
+			for (var i = 0; i < symbols.length; i++) {
+				if (propIsEnumerable.call(from, symbols[i])) {
+					to[symbols[i]] = from[symbols[i]];
+				}
+			}
+		}
+	}
+
+	return to;
+};
diff --git a/ddb_main/node_modules/performance-now/src/performance-now.coffee b/ddb_main/node_modules/performance-now/src/performance-now.coffee
new file mode 100644
index 0000000..a8e075a
--- /dev/null
+++ b/ddb_main/node_modules/performance-now/src/performance-now.coffee
@@ -0,0 +1,17 @@
+if performance? and performance.now
+  module.exports = -> performance.now()
+else if process? and process.hrtime
+  module.exports = -> (getNanoSeconds() - nodeLoadTime) / 1e6
+  hrtime = process.hrtime
+  getNanoSeconds = ->
+    hr = hrtime()
+    hr[0] * 1e9 + hr[1]
+  moduleLoadTime = getNanoSeconds()
+  upTime = process.uptime() * 1e9
+  nodeLoadTime = moduleLoadTime - upTime
+else if Date.now
+  module.exports = -> Date.now() - loadTime
+  loadTime = Date.now()
+else
+  module.exports = -> new Date().getTime() - loadTime
+  loadTime = new Date().getTime()
diff --git a/ddb_main/node_modules/process/browser.js b/ddb_main/node_modules/process/browser.js
new file mode 100644
index 0000000..d059362
--- /dev/null
+++ b/ddb_main/node_modules/process/browser.js
@@ -0,0 +1,184 @@
+// shim for using process in browser
+var process = module.exports = {};
+
+// cached from whatever global is present so that test runners that stub it
+// don't break things.  But we need to wrap it in a try catch in case it is
+// wrapped in strict mode code which doesn't define any globals.  It's inside a
+// function because try/catches deoptimize in certain engines.
+
+var cachedSetTimeout;
+var cachedClearTimeout;
+
+function defaultSetTimout() {
+    throw new Error('setTimeout has not been defined');
+}
+function defaultClearTimeout () {
+    throw new Error('clearTimeout has not been defined');
+}
+(function () {
+    try {
+        if (typeof setTimeout === 'function') {
+            cachedSetTimeout = setTimeout;
+        } else {
+            cachedSetTimeout = defaultSetTimout;
+        }
+    } catch (e) {
+        cachedSetTimeout = defaultSetTimout;
+    }
+    try {
+        if (typeof clearTimeout === 'function') {
+            cachedClearTimeout = clearTimeout;
+        } else {
+            cachedClearTimeout = defaultClearTimeout;
+        }
+    } catch (e) {
+        cachedClearTimeout = defaultClearTimeout;
+    }
+} ())
+function runTimeout(fun) {
+    if (cachedSetTimeout === setTimeout) {
+        //normal enviroments in sane situations
+        return setTimeout(fun, 0);
+    }
+    // if setTimeout wasn't available but was latter defined
+    if ((cachedSetTimeout === defaultSetTimout || !cachedSetTimeout) && setTimeout) {
+        cachedSetTimeout = setTimeout;
+        return setTimeout(fun, 0);
+    }
+    try {
+        // when when somebody has screwed with setTimeout but no I.E. maddness
+        return cachedSetTimeout(fun, 0);
+    } catch(e){
+        try {
+            // When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally
+            return cachedSetTimeout.call(null, fun, 0);
+        } catch(e){
+            // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error
+            return cachedSetTimeout.call(this, fun, 0);
+        }
+    }
+
+
+}
+function runClearTimeout(marker) {
+    if (cachedClearTimeout === clearTimeout) {
+        //normal enviroments in sane situations
+        return clearTimeout(marker);
+    }
+    // if clearTimeout wasn't available but was latter defined
+    if ((cachedClearTimeout === defaultClearTimeout || !cachedClearTimeout) && clearTimeout) {
+        cachedClearTimeout = clearTimeout;
+        return clearTimeout(marker);
+    }
+    try {
+        // when when somebody has screwed with setTimeout but no I.E. maddness
+        return cachedClearTimeout(marker);
+    } catch (e){
+        try {
+            // When we are in I.E. but the script has been evaled so I.E. doesn't  trust the global object when called normally
+            return cachedClearTimeout.call(null, marker);
+        } catch (e){
+            // same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error.
+            // Some versions of I.E. have different rules for clearTimeout vs setTimeout
+            return cachedClearTimeout.call(this, marker);
+        }
+    }
+
+
+
+}
+var queue = [];
+var draining = false;
+var currentQueue;
+var queueIndex = -1;
+
+function cleanUpNextTick() {
+    if (!draining || !currentQueue) {
+        return;
+    }
+    draining = false;
+    if (currentQueue.length) {
+        queue = currentQueue.concat(queue);
+    } else {
+        queueIndex = -1;
+    }
+    if (queue.length) {
+        drainQueue();
+    }
+}
+
+function drainQueue() {
+    if (draining) {
+        return;
+    }
+    var timeout = runTimeout(cleanUpNextTick);
+    draining = true;
+
+    var len = queue.length;
+    while(len) {
+        currentQueue = queue;
+        queue = [];
+        while (++queueIndex < len) {
+            if (currentQueue) {
+                currentQueue[queueIndex].run();
+            }
+        }
+        queueIndex = -1;
+        len = queue.length;
+    }
+    currentQueue = null;
+    draining = false;
+    runClearTimeout(timeout);
+}
+
+process.nextTick = function (fun) {
+    var args = new Array(arguments.length - 1);
+    if (arguments.length > 1) {
+        for (var i = 1; i < arguments.length; i++) {
+            args[i - 1] = arguments[i];
+        }
+    }
+    queue.push(new Item(fun, args));
+    if (queue.length === 1 && !draining) {
+        runTimeout(drainQueue);
+    }
+};
+
+// v8 likes predictible objects
+function Item(fun, array) {
+    this.fun = fun;
+    this.array = array;
+}
+Item.prototype.run = function () {
+    this.fun.apply(null, this.array);
+};
+process.title = 'browser';
+process.browser = true;
+process.env = {};
+process.argv = [];
+process.version = ''; // empty string to avoid regexp issues
+process.versions = {};
+
+function noop() {}
+
+process.on = noop;
+process.addListener = noop;
+process.once = noop;
+process.off = noop;
+process.removeListener = noop;
+process.removeAllListeners = noop;
+process.emit = noop;
+process.prependListener = noop;
+process.prependOnceListener = noop;
+
+process.listeners = function (name) { return [] }
+
+process.binding = function (name) {
+    throw new Error('process.binding is not supported');
+};
+
+process.cwd = function () { return '/' };
+process.chdir = function (dir) {
+    throw new Error('process.chdir is not supported');
+};
+process.umask = function() { return 0; };
diff --git a/ddb_main/node_modules/prop-types/factoryWithThrowingShims.js b/ddb_main/node_modules/prop-types/factoryWithThrowingShims.js
new file mode 100644
index 0000000..ac88267
--- /dev/null
+++ b/ddb_main/node_modules/prop-types/factoryWithThrowingShims.js
@@ -0,0 +1,65 @@
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+var ReactPropTypesSecret = require('./lib/ReactPropTypesSecret');
+
+function emptyFunction() {}
+function emptyFunctionWithReset() {}
+emptyFunctionWithReset.resetWarningCache = emptyFunction;
+
+module.exports = function() {
+  function shim(props, propName, componentName, location, propFullName, secret) {
+    if (secret === ReactPropTypesSecret) {
+      // It is still safe when called from React.
+      return;
+    }
+    var err = new Error(
+      'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +
+      'Use PropTypes.checkPropTypes() to call them. ' +
+      'Read more at http://fb.me/use-check-prop-types'
+    );
+    err.name = 'Invariant Violation';
+    throw err;
+  };
+  shim.isRequired = shim;
+  function getShim() {
+    return shim;
+  };
+  // Important!
+  // Keep this list in sync with production version in `./factoryWithTypeCheckers.js`.
+  var ReactPropTypes = {
+    array: shim,
+    bigint: shim,
+    bool: shim,
+    func: shim,
+    number: shim,
+    object: shim,
+    string: shim,
+    symbol: shim,
+
+    any: shim,
+    arrayOf: getShim,
+    element: shim,
+    elementType: shim,
+    instanceOf: getShim,
+    node: shim,
+    objectOf: getShim,
+    oneOf: getShim,
+    oneOfType: getShim,
+    shape: getShim,
+    exact: getShim,
+
+    checkPropTypes: emptyFunctionWithReset,
+    resetWarningCache: emptyFunction
+  };
+
+  ReactPropTypes.PropTypes = ReactPropTypes;
+
+  return ReactPropTypes;
+};
diff --git a/ddb_main/node_modules/prop-types/index.js b/ddb_main/node_modules/prop-types/index.js
new file mode 100644
index 0000000..e9ef51d
--- /dev/null
+++ b/ddb_main/node_modules/prop-types/index.js
@@ -0,0 +1,19 @@
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+if (process.env.NODE_ENV !== 'production') {
+  var ReactIs = require('react-is');
+
+  // By explicitly using `prop-types` you are opting into new development behavior.
+  // http://fb.me/prop-types-in-prod
+  var throwOnDirectAccess = true;
+  module.exports = require('./factoryWithTypeCheckers')(ReactIs.isElement, throwOnDirectAccess);
+} else {
+  // By explicitly using `prop-types` you are opting into new production behavior.
+  // http://fb.me/prop-types-in-prod
+  module.exports = require('./factoryWithThrowingShims')();
+}
diff --git a/ddb_main/node_modules/prop-types/lib/ReactPropTypesSecret.js b/ddb_main/node_modules/prop-types/lib/ReactPropTypesSecret.js
new file mode 100644
index 0000000..f54525e
--- /dev/null
+++ b/ddb_main/node_modules/prop-types/lib/ReactPropTypesSecret.js
@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
+
+module.exports = ReactPropTypesSecret;
diff --git a/ddb_main/node_modules/raf/index.js b/ddb_main/node_modules/raf/index.js
new file mode 100644
index 0000000..14ddddb
--- /dev/null
+++ b/ddb_main/node_modules/raf/index.js
@@ -0,0 +1,75 @@
+var now = require('performance-now')
+  , root = typeof window === 'undefined' ? global : window
+  , vendors = ['moz', 'webkit']
+  , suffix = 'AnimationFrame'
+  , raf = root['request' + suffix]
+  , caf = root['cancel' + suffix] || root['cancelRequest' + suffix]
+
+for(var i = 0; !raf && i < vendors.length; i++) {
+  raf = root[vendors[i] + 'Request' + suffix]
+  caf = root[vendors[i] + 'Cancel' + suffix]
+      || root[vendors[i] + 'CancelRequest' + suffix]
+}
+
+// Some versions of FF have rAF but not cAF
+if(!raf || !caf) {
+  var last = 0
+    , id = 0
+    , queue = []
+    , frameDuration = 1000 / 60
+
+  raf = function(callback) {
+    if(queue.length === 0) {
+      var _now = now()
+        , next = Math.max(0, frameDuration - (_now - last))
+      last = next + _now
+      setTimeout(function() {
+        var cp = queue.slice(0)
+        // Clear queue here to prevent
+        // callbacks from appending listeners
+        // to the current frame's queue
+        queue.length = 0
+        for(var i = 0; i < cp.length; i++) {
+          if(!cp[i].cancelled) {
+            try{
+              cp[i].callback(last)
+            } catch(e) {
+              setTimeout(function() { throw e }, 0)
+            }
+          }
+        }
+      }, Math.round(next))
+    }
+    queue.push({
+      handle: ++id,
+      callback: callback,
+      cancelled: false
+    })
+    return id
+  }
+
+  caf = function(handle) {
+    for(var i = 0; i < queue.length; i++) {
+      if(queue[i].handle === handle) {
+        queue[i].cancelled = true
+      }
+    }
+  }
+}
+
+module.exports = function(fn) {
+  // Wrap in a new function to prevent
+  // `cancel` potentially being assigned
+  // to the native rAF function
+  return raf.call(root, fn)
+}
+module.exports.cancel = function() {
+  caf.apply(root, arguments)
+}
+module.exports.polyfill = function(object) {
+  if (!object) {
+    object = root;
+  }
+  object.requestAnimationFrame = raf
+  object.cancelAnimationFrame = caf
+}
diff --git a/ddb_main/node_modules/react-dom/cjs/react-dom.production.min.js b/ddb_main/node_modules/react-dom/cjs/react-dom.production.min.js
new file mode 100644
index 0000000..a87fb5d
--- /dev/null
+++ b/ddb_main/node_modules/react-dom/cjs/react-dom.production.min.js
@@ -0,0 +1,297 @@
+/** @license React v17.0.2
+ * react-dom.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/*
+ Modernizr 3.0.0pre (Custom Build) | MIT
+*/
+'use strict';var aa=require("react"),m=require("object-assign"),r=require("scheduler");function y(a){for(var b="https://reactjs.org/docs/error-decoder.html?invariant="+a,c=1;c<arguments.length;c++)b+="&args[]="+encodeURIComponent(arguments[c]);return"Minified React error #"+a+"; visit "+b+" for the full message or use the non-minified dev environment for full errors and additional helpful warnings."}if(!aa)throw Error(y(227));var ba=new Set,ca={};function da(a,b){ea(a,b);ea(a+"Capture",b)}
+function ea(a,b){ca[a]=b;for(a=0;a<b.length;a++)ba.add(b[a])}
+var fa=!("undefined"===typeof window||"undefined"===typeof window.document||"undefined"===typeof window.document.createElement),ha=/^[:A-Z_a-z\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02FF\u0370-\u037D\u037F-\u1FFF\u200C-\u200D\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD][:A-Z_a-z\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02FF\u0370-\u037D\u037F-\u1FFF\u200C-\u200D\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD\-.0-9\u00B7\u0300-\u036F\u203F-\u2040]*$/,ia=Object.prototype.hasOwnProperty,
+ja={},ka={};function la(a){if(ia.call(ka,a))return!0;if(ia.call(ja,a))return!1;if(ha.test(a))return ka[a]=!0;ja[a]=!0;return!1}function ma(a,b,c,d){if(null!==c&&0===c.type)return!1;switch(typeof b){case "function":case "symbol":return!0;case "boolean":if(d)return!1;if(null!==c)return!c.acceptsBooleans;a=a.toLowerCase().slice(0,5);return"data-"!==a&&"aria-"!==a;default:return!1}}
+function na(a,b,c,d){if(null===b||"undefined"===typeof b||ma(a,b,c,d))return!0;if(d)return!1;if(null!==c)switch(c.type){case 3:return!b;case 4:return!1===b;case 5:return isNaN(b);case 6:return isNaN(b)||1>b}return!1}function B(a,b,c,d,e,f,g){this.acceptsBooleans=2===b||3===b||4===b;this.attributeName=d;this.attributeNamespace=e;this.mustUseProperty=c;this.propertyName=a;this.type=b;this.sanitizeURL=f;this.removeEmptyString=g}var D={};
+"children dangerouslySetInnerHTML defaultValue defaultChecked innerHTML suppressContentEditableWarning suppressHydrationWarning style".split(" ").forEach(function(a){D[a]=new B(a,0,!1,a,null,!1,!1)});[["acceptCharset","accept-charset"],["className","class"],["htmlFor","for"],["httpEquiv","http-equiv"]].forEach(function(a){var b=a[0];D[b]=new B(b,1,!1,a[1],null,!1,!1)});["contentEditable","draggable","spellCheck","value"].forEach(function(a){D[a]=new B(a,2,!1,a.toLowerCase(),null,!1,!1)});
+["autoReverse","externalResourcesRequired","focusable","preserveAlpha"].forEach(function(a){D[a]=new B(a,2,!1,a,null,!1,!1)});"allowFullScreen async autoFocus autoPlay controls default defer disabled disablePictureInPicture disableRemotePlayback formNoValidate hidden loop noModule noValidate open playsInline readOnly required reversed scoped seamless itemScope".split(" ").forEach(function(a){D[a]=new B(a,3,!1,a.toLowerCase(),null,!1,!1)});
+["checked","multiple","muted","selected"].forEach(function(a){D[a]=new B(a,3,!0,a,null,!1,!1)});["capture","download"].forEach(function(a){D[a]=new B(a,4,!1,a,null,!1,!1)});["cols","rows","size","span"].forEach(function(a){D[a]=new B(a,6,!1,a,null,!1,!1)});["rowSpan","start"].forEach(function(a){D[a]=new B(a,5,!1,a.toLowerCase(),null,!1,!1)});var oa=/[\-:]([a-z])/g;function pa(a){return a[1].toUpperCase()}
+"accent-height alignment-baseline arabic-form baseline-shift cap-height clip-path clip-rule color-interpolation color-interpolation-filters color-profile color-rendering dominant-baseline enable-background fill-opacity fill-rule flood-color flood-opacity font-family font-size font-size-adjust font-stretch font-style font-variant font-weight glyph-name glyph-orientation-horizontal glyph-orientation-vertical horiz-adv-x horiz-origin-x image-rendering letter-spacing lighting-color marker-end marker-mid marker-start overline-position overline-thickness paint-order panose-1 pointer-events rendering-intent shape-rendering stop-color stop-opacity strikethrough-position strikethrough-thickness stroke-dasharray stroke-dashoffset stroke-linecap stroke-linejoin stroke-miterlimit stroke-opacity stroke-width text-anchor text-decoration text-rendering underline-position underline-thickness unicode-bidi unicode-range units-per-em v-alphabetic v-hanging v-ideographic v-mathematical vector-effect vert-adv-y vert-origin-x vert-origin-y word-spacing writing-mode xmlns:xlink x-height".split(" ").forEach(function(a){var b=a.replace(oa,
+pa);D[b]=new B(b,1,!1,a,null,!1,!1)});"xlink:actuate xlink:arcrole xlink:role xlink:show xlink:title xlink:type".split(" ").forEach(function(a){var b=a.replace(oa,pa);D[b]=new B(b,1,!1,a,"http://www.w3.org/1999/xlink",!1,!1)});["xml:base","xml:lang","xml:space"].forEach(function(a){var b=a.replace(oa,pa);D[b]=new B(b,1,!1,a,"http://www.w3.org/XML/1998/namespace",!1,!1)});["tabIndex","crossOrigin"].forEach(function(a){D[a]=new B(a,1,!1,a.toLowerCase(),null,!1,!1)});
+D.xlinkHref=new B("xlinkHref",1,!1,"xlink:href","http://www.w3.org/1999/xlink",!0,!1);["src","href","action","formAction"].forEach(function(a){D[a]=new B(a,1,!1,a.toLowerCase(),null,!0,!0)});
+function qa(a,b,c,d){var e=D.hasOwnProperty(b)?D[b]:null;var f=null!==e?0===e.type:d?!1:!(2<b.length)||"o"!==b[0]&&"O"!==b[0]||"n"!==b[1]&&"N"!==b[1]?!1:!0;f||(na(b,c,e,d)&&(c=null),d||null===e?la(b)&&(null===c?a.removeAttribute(b):a.setAttribute(b,""+c)):e.mustUseProperty?a[e.propertyName]=null===c?3===e.type?!1:"":c:(b=e.attributeName,d=e.attributeNamespace,null===c?a.removeAttribute(b):(e=e.type,c=3===e||4===e&&!0===c?"":""+c,d?a.setAttributeNS(d,b,c):a.setAttribute(b,c))))}
+var ra=aa.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED,sa=60103,ta=60106,ua=60107,wa=60108,xa=60114,ya=60109,za=60110,Aa=60112,Ba=60113,Ca=60120,Da=60115,Ea=60116,Fa=60121,Ga=60128,Ha=60129,Ia=60130,Ja=60131;
+if("function"===typeof Symbol&&Symbol.for){var E=Symbol.for;sa=E("react.element");ta=E("react.portal");ua=E("react.fragment");wa=E("react.strict_mode");xa=E("react.profiler");ya=E("react.provider");za=E("react.context");Aa=E("react.forward_ref");Ba=E("react.suspense");Ca=E("react.suspense_list");Da=E("react.memo");Ea=E("react.lazy");Fa=E("react.block");E("react.scope");Ga=E("react.opaque.id");Ha=E("react.debug_trace_mode");Ia=E("react.offscreen");Ja=E("react.legacy_hidden")}
+var Ka="function"===typeof Symbol&&Symbol.iterator;function La(a){if(null===a||"object"!==typeof a)return null;a=Ka&&a[Ka]||a["@@iterator"];return"function"===typeof a?a:null}var Ma;function Na(a){if(void 0===Ma)try{throw Error();}catch(c){var b=c.stack.trim().match(/\n( *(at )?)/);Ma=b&&b[1]||""}return"\n"+Ma+a}var Oa=!1;
+function Pa(a,b){if(!a||Oa)return"";Oa=!0;var c=Error.prepareStackTrace;Error.prepareStackTrace=void 0;try{if(b)if(b=function(){throw Error();},Object.defineProperty(b.prototype,"props",{set:function(){throw Error();}}),"object"===typeof Reflect&&Reflect.construct){try{Reflect.construct(b,[])}catch(k){var d=k}Reflect.construct(a,[],b)}else{try{b.call()}catch(k){d=k}a.call(b.prototype)}else{try{throw Error();}catch(k){d=k}a()}}catch(k){if(k&&d&&"string"===typeof k.stack){for(var e=k.stack.split("\n"),
+f=d.stack.split("\n"),g=e.length-1,h=f.length-1;1<=g&&0<=h&&e[g]!==f[h];)h--;for(;1<=g&&0<=h;g--,h--)if(e[g]!==f[h]){if(1!==g||1!==h){do if(g--,h--,0>h||e[g]!==f[h])return"\n"+e[g].replace(" at new "," at ");while(1<=g&&0<=h)}break}}}finally{Oa=!1,Error.prepareStackTrace=c}return(a=a?a.displayName||a.name:"")?Na(a):""}
+function Qa(a){switch(a.tag){case 5:return Na(a.type);case 16:return Na("Lazy");case 13:return Na("Suspense");case 19:return Na("SuspenseList");case 0:case 2:case 15:return a=Pa(a.type,!1),a;case 11:return a=Pa(a.type.render,!1),a;case 22:return a=Pa(a.type._render,!1),a;case 1:return a=Pa(a.type,!0),a;default:return""}}
+function Ra(a){if(null==a)return null;if("function"===typeof a)return a.displayName||a.name||null;if("string"===typeof a)return a;switch(a){case ua:return"Fragment";case ta:return"Portal";case xa:return"Profiler";case wa:return"StrictMode";case Ba:return"Suspense";case Ca:return"SuspenseList"}if("object"===typeof a)switch(a.$$typeof){case za:return(a.displayName||"Context")+".Consumer";case ya:return(a._context.displayName||"Context")+".Provider";case Aa:var b=a.render;b=b.displayName||b.name||"";
+return a.displayName||(""!==b?"ForwardRef("+b+")":"ForwardRef");case Da:return Ra(a.type);case Fa:return Ra(a._render);case Ea:b=a._payload;a=a._init;try{return Ra(a(b))}catch(c){}}return null}function Sa(a){switch(typeof a){case "boolean":case "number":case "object":case "string":case "undefined":return a;default:return""}}function Ta(a){var b=a.type;return(a=a.nodeName)&&"input"===a.toLowerCase()&&("checkbox"===b||"radio"===b)}
+function Ua(a){var b=Ta(a)?"checked":"value",c=Object.getOwnPropertyDescriptor(a.constructor.prototype,b),d=""+a[b];if(!a.hasOwnProperty(b)&&"undefined"!==typeof c&&"function"===typeof c.get&&"function"===typeof c.set){var e=c.get,f=c.set;Object.defineProperty(a,b,{configurable:!0,get:function(){return e.call(this)},set:function(a){d=""+a;f.call(this,a)}});Object.defineProperty(a,b,{enumerable:c.enumerable});return{getValue:function(){return d},setValue:function(a){d=""+a},stopTracking:function(){a._valueTracker=
+null;delete a[b]}}}}function Va(a){a._valueTracker||(a._valueTracker=Ua(a))}function Wa(a){if(!a)return!1;var b=a._valueTracker;if(!b)return!0;var c=b.getValue();var d="";a&&(d=Ta(a)?a.checked?"true":"false":a.value);a=d;return a!==c?(b.setValue(a),!0):!1}function Xa(a){a=a||("undefined"!==typeof document?document:void 0);if("undefined"===typeof a)return null;try{return a.activeElement||a.body}catch(b){return a.body}}
+function Ya(a,b){var c=b.checked;return m({},b,{defaultChecked:void 0,defaultValue:void 0,value:void 0,checked:null!=c?c:a._wrapperState.initialChecked})}function Za(a,b){var c=null==b.defaultValue?"":b.defaultValue,d=null!=b.checked?b.checked:b.defaultChecked;c=Sa(null!=b.value?b.value:c);a._wrapperState={initialChecked:d,initialValue:c,controlled:"checkbox"===b.type||"radio"===b.type?null!=b.checked:null!=b.value}}function $a(a,b){b=b.checked;null!=b&&qa(a,"checked",b,!1)}
+function ab(a,b){$a(a,b);var c=Sa(b.value),d=b.type;if(null!=c)if("number"===d){if(0===c&&""===a.value||a.value!=c)a.value=""+c}else a.value!==""+c&&(a.value=""+c);else if("submit"===d||"reset"===d){a.removeAttribute("value");return}b.hasOwnProperty("value")?bb(a,b.type,c):b.hasOwnProperty("defaultValue")&&bb(a,b.type,Sa(b.defaultValue));null==b.checked&&null!=b.defaultChecked&&(a.defaultChecked=!!b.defaultChecked)}
+function cb(a,b,c){if(b.hasOwnProperty("value")||b.hasOwnProperty("defaultValue")){var d=b.type;if(!("submit"!==d&&"reset"!==d||void 0!==b.value&&null!==b.value))return;b=""+a._wrapperState.initialValue;c||b===a.value||(a.value=b);a.defaultValue=b}c=a.name;""!==c&&(a.name="");a.defaultChecked=!!a._wrapperState.initialChecked;""!==c&&(a.name=c)}
+function bb(a,b,c){if("number"!==b||Xa(a.ownerDocument)!==a)null==c?a.defaultValue=""+a._wrapperState.initialValue:a.defaultValue!==""+c&&(a.defaultValue=""+c)}function db(a){var b="";aa.Children.forEach(a,function(a){null!=a&&(b+=a)});return b}function eb(a,b){a=m({children:void 0},b);if(b=db(b.children))a.children=b;return a}
+function fb(a,b,c,d){a=a.options;if(b){b={};for(var e=0;e<c.length;e++)b["$"+c[e]]=!0;for(c=0;c<a.length;c++)e=b.hasOwnProperty("$"+a[c].value),a[c].selected!==e&&(a[c].selected=e),e&&d&&(a[c].defaultSelected=!0)}else{c=""+Sa(c);b=null;for(e=0;e<a.length;e++){if(a[e].value===c){a[e].selected=!0;d&&(a[e].defaultSelected=!0);return}null!==b||a[e].disabled||(b=a[e])}null!==b&&(b.selected=!0)}}
+function gb(a,b){if(null!=b.dangerouslySetInnerHTML)throw Error(y(91));return m({},b,{value:void 0,defaultValue:void 0,children:""+a._wrapperState.initialValue})}function hb(a,b){var c=b.value;if(null==c){c=b.children;b=b.defaultValue;if(null!=c){if(null!=b)throw Error(y(92));if(Array.isArray(c)){if(!(1>=c.length))throw Error(y(93));c=c[0]}b=c}null==b&&(b="");c=b}a._wrapperState={initialValue:Sa(c)}}
+function ib(a,b){var c=Sa(b.value),d=Sa(b.defaultValue);null!=c&&(c=""+c,c!==a.value&&(a.value=c),null==b.defaultValue&&a.defaultValue!==c&&(a.defaultValue=c));null!=d&&(a.defaultValue=""+d)}function jb(a){var b=a.textContent;b===a._wrapperState.initialValue&&""!==b&&null!==b&&(a.value=b)}var kb={html:"http://www.w3.org/1999/xhtml",mathml:"http://www.w3.org/1998/Math/MathML",svg:"http://www.w3.org/2000/svg"};
+function lb(a){switch(a){case "svg":return"http://www.w3.org/2000/svg";case "math":return"http://www.w3.org/1998/Math/MathML";default:return"http://www.w3.org/1999/xhtml"}}function mb(a,b){return null==a||"http://www.w3.org/1999/xhtml"===a?lb(b):"http://www.w3.org/2000/svg"===a&&"foreignObject"===b?"http://www.w3.org/1999/xhtml":a}
+var nb,ob=function(a){return"undefined"!==typeof MSApp&&MSApp.execUnsafeLocalFunction?function(b,c,d,e){MSApp.execUnsafeLocalFunction(function(){return a(b,c,d,e)})}:a}(function(a,b){if(a.namespaceURI!==kb.svg||"innerHTML"in a)a.innerHTML=b;else{nb=nb||document.createElement("div");nb.innerHTML="<svg>"+b.valueOf().toString()+"</svg>";for(b=nb.firstChild;a.firstChild;)a.removeChild(a.firstChild);for(;b.firstChild;)a.appendChild(b.firstChild)}});
+function pb(a,b){if(b){var c=a.firstChild;if(c&&c===a.lastChild&&3===c.nodeType){c.nodeValue=b;return}}a.textContent=b}
+var qb={animationIterationCount:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,columns:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridArea:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,zoom:!0,fillOpacity:!0,
+floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},rb=["Webkit","ms","Moz","O"];Object.keys(qb).forEach(function(a){rb.forEach(function(b){b=b+a.charAt(0).toUpperCase()+a.substring(1);qb[b]=qb[a]})});function sb(a,b,c){return null==b||"boolean"===typeof b||""===b?"":c||"number"!==typeof b||0===b||qb.hasOwnProperty(a)&&qb[a]?(""+b).trim():b+"px"}
+function tb(a,b){a=a.style;for(var c in b)if(b.hasOwnProperty(c)){var d=0===c.indexOf("--"),e=sb(c,b[c],d);"float"===c&&(c="cssFloat");d?a.setProperty(c,e):a[c]=e}}var ub=m({menuitem:!0},{area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0});
+function vb(a,b){if(b){if(ub[a]&&(null!=b.children||null!=b.dangerouslySetInnerHTML))throw Error(y(137,a));if(null!=b.dangerouslySetInnerHTML){if(null!=b.children)throw Error(y(60));if(!("object"===typeof b.dangerouslySetInnerHTML&&"__html"in b.dangerouslySetInnerHTML))throw Error(y(61));}if(null!=b.style&&"object"!==typeof b.style)throw Error(y(62));}}
+function wb(a,b){if(-1===a.indexOf("-"))return"string"===typeof b.is;switch(a){case "annotation-xml":case "color-profile":case "font-face":case "font-face-src":case "font-face-uri":case "font-face-format":case "font-face-name":case "missing-glyph":return!1;default:return!0}}function xb(a){a=a.target||a.srcElement||window;a.correspondingUseElement&&(a=a.correspondingUseElement);return 3===a.nodeType?a.parentNode:a}var yb=null,zb=null,Ab=null;
+function Bb(a){if(a=Cb(a)){if("function"!==typeof yb)throw Error(y(280));var b=a.stateNode;b&&(b=Db(b),yb(a.stateNode,a.type,b))}}function Eb(a){zb?Ab?Ab.push(a):Ab=[a]:zb=a}function Fb(){if(zb){var a=zb,b=Ab;Ab=zb=null;Bb(a);if(b)for(a=0;a<b.length;a++)Bb(b[a])}}function Gb(a,b){return a(b)}function Hb(a,b,c,d,e){return a(b,c,d,e)}function Ib(){}var Jb=Gb,Kb=!1,Lb=!1;function Mb(){if(null!==zb||null!==Ab)Ib(),Fb()}
+function Nb(a,b,c){if(Lb)return a(b,c);Lb=!0;try{return Jb(a,b,c)}finally{Lb=!1,Mb()}}
+function Ob(a,b){var c=a.stateNode;if(null===c)return null;var d=Db(c);if(null===d)return null;c=d[b];a:switch(b){case "onClick":case "onClickCapture":case "onDoubleClick":case "onDoubleClickCapture":case "onMouseDown":case "onMouseDownCapture":case "onMouseMove":case "onMouseMoveCapture":case "onMouseUp":case "onMouseUpCapture":case "onMouseEnter":(d=!d.disabled)||(a=a.type,d=!("button"===a||"input"===a||"select"===a||"textarea"===a));a=!d;break a;default:a=!1}if(a)return null;if(c&&"function"!==
+typeof c)throw Error(y(231,b,typeof c));return c}var Pb=!1;if(fa)try{var Qb={};Object.defineProperty(Qb,"passive",{get:function(){Pb=!0}});window.addEventListener("test",Qb,Qb);window.removeEventListener("test",Qb,Qb)}catch(a){Pb=!1}function Rb(a,b,c,d,e,f,g,h,k){var l=Array.prototype.slice.call(arguments,3);try{b.apply(c,l)}catch(n){this.onError(n)}}var Sb=!1,Tb=null,Ub=!1,Vb=null,Wb={onError:function(a){Sb=!0;Tb=a}};function Xb(a,b,c,d,e,f,g,h,k){Sb=!1;Tb=null;Rb.apply(Wb,arguments)}
+function Yb(a,b,c,d,e,f,g,h,k){Xb.apply(this,arguments);if(Sb){if(Sb){var l=Tb;Sb=!1;Tb=null}else throw Error(y(198));Ub||(Ub=!0,Vb=l)}}function Zb(a){var b=a,c=a;if(a.alternate)for(;b.return;)b=b.return;else{a=b;do b=a,0!==(b.flags&1026)&&(c=b.return),a=b.return;while(a)}return 3===b.tag?c:null}function $b(a){if(13===a.tag){var b=a.memoizedState;null===b&&(a=a.alternate,null!==a&&(b=a.memoizedState));if(null!==b)return b.dehydrated}return null}function ac(a){if(Zb(a)!==a)throw Error(y(188));}
+function bc(a){var b=a.alternate;if(!b){b=Zb(a);if(null===b)throw Error(y(188));return b!==a?null:a}for(var c=a,d=b;;){var e=c.return;if(null===e)break;var f=e.alternate;if(null===f){d=e.return;if(null!==d){c=d;continue}break}if(e.child===f.child){for(f=e.child;f;){if(f===c)return ac(e),a;if(f===d)return ac(e),b;f=f.sibling}throw Error(y(188));}if(c.return!==d.return)c=e,d=f;else{for(var g=!1,h=e.child;h;){if(h===c){g=!0;c=e;d=f;break}if(h===d){g=!0;d=e;c=f;break}h=h.sibling}if(!g){for(h=f.child;h;){if(h===
+c){g=!0;c=f;d=e;break}if(h===d){g=!0;d=f;c=e;break}h=h.sibling}if(!g)throw Error(y(189));}}if(c.alternate!==d)throw Error(y(190));}if(3!==c.tag)throw Error(y(188));return c.stateNode.current===c?a:b}function cc(a){a=bc(a);if(!a)return null;for(var b=a;;){if(5===b.tag||6===b.tag)return b;if(b.child)b.child.return=b,b=b.child;else{if(b===a)break;for(;!b.sibling;){if(!b.return||b.return===a)return null;b=b.return}b.sibling.return=b.return;b=b.sibling}}return null}
+function dc(a,b){for(var c=a.alternate;null!==b;){if(b===a||b===c)return!0;b=b.return}return!1}var ec,fc,gc,hc,ic=!1,jc=[],kc=null,lc=null,mc=null,nc=new Map,oc=new Map,pc=[],qc="mousedown mouseup touchcancel touchend touchstart auxclick dblclick pointercancel pointerdown pointerup dragend dragstart drop compositionend compositionstart keydown keypress keyup input textInput copy cut paste click change contextmenu reset submit".split(" ");
+function rc(a,b,c,d,e){return{blockedOn:a,domEventName:b,eventSystemFlags:c|16,nativeEvent:e,targetContainers:[d]}}function sc(a,b){switch(a){case "focusin":case "focusout":kc=null;break;case "dragenter":case "dragleave":lc=null;break;case "mouseover":case "mouseout":mc=null;break;case "pointerover":case "pointerout":nc.delete(b.pointerId);break;case "gotpointercapture":case "lostpointercapture":oc.delete(b.pointerId)}}
+function tc(a,b,c,d,e,f){if(null===a||a.nativeEvent!==f)return a=rc(b,c,d,e,f),null!==b&&(b=Cb(b),null!==b&&fc(b)),a;a.eventSystemFlags|=d;b=a.targetContainers;null!==e&&-1===b.indexOf(e)&&b.push(e);return a}
+function uc(a,b,c,d,e){switch(b){case "focusin":return kc=tc(kc,a,b,c,d,e),!0;case "dragenter":return lc=tc(lc,a,b,c,d,e),!0;case "mouseover":return mc=tc(mc,a,b,c,d,e),!0;case "pointerover":var f=e.pointerId;nc.set(f,tc(nc.get(f)||null,a,b,c,d,e));return!0;case "gotpointercapture":return f=e.pointerId,oc.set(f,tc(oc.get(f)||null,a,b,c,d,e)),!0}return!1}
+function vc(a){var b=wc(a.target);if(null!==b){var c=Zb(b);if(null!==c)if(b=c.tag,13===b){if(b=$b(c),null!==b){a.blockedOn=b;hc(a.lanePriority,function(){r.unstable_runWithPriority(a.priority,function(){gc(c)})});return}}else if(3===b&&c.stateNode.hydrate){a.blockedOn=3===c.tag?c.stateNode.containerInfo:null;return}}a.blockedOn=null}
+function xc(a){if(null!==a.blockedOn)return!1;for(var b=a.targetContainers;0<b.length;){var c=yc(a.domEventName,a.eventSystemFlags,b[0],a.nativeEvent);if(null!==c)return b=Cb(c),null!==b&&fc(b),a.blockedOn=c,!1;b.shift()}return!0}function zc(a,b,c){xc(a)&&c.delete(b)}
+function Ac(){for(ic=!1;0<jc.length;){var a=jc[0];if(null!==a.blockedOn){a=Cb(a.blockedOn);null!==a&&ec(a);break}for(var b=a.targetContainers;0<b.length;){var c=yc(a.domEventName,a.eventSystemFlags,b[0],a.nativeEvent);if(null!==c){a.blockedOn=c;break}b.shift()}null===a.blockedOn&&jc.shift()}null!==kc&&xc(kc)&&(kc=null);null!==lc&&xc(lc)&&(lc=null);null!==mc&&xc(mc)&&(mc=null);nc.forEach(zc);oc.forEach(zc)}
+function Bc(a,b){a.blockedOn===b&&(a.blockedOn=null,ic||(ic=!0,r.unstable_scheduleCallback(r.unstable_NormalPriority,Ac)))}
+function Cc(a){function b(b){return Bc(b,a)}if(0<jc.length){Bc(jc[0],a);for(var c=1;c<jc.length;c++){var d=jc[c];d.blockedOn===a&&(d.blockedOn=null)}}null!==kc&&Bc(kc,a);null!==lc&&Bc(lc,a);null!==mc&&Bc(mc,a);nc.forEach(b);oc.forEach(b);for(c=0;c<pc.length;c++)d=pc[c],d.blockedOn===a&&(d.blockedOn=null);for(;0<pc.length&&(c=pc[0],null===c.blockedOn);)vc(c),null===c.blockedOn&&pc.shift()}
+function Dc(a,b){var c={};c[a.toLowerCase()]=b.toLowerCase();c["Webkit"+a]="webkit"+b;c["Moz"+a]="moz"+b;return c}var Ec={animationend:Dc("Animation","AnimationEnd"),animationiteration:Dc("Animation","AnimationIteration"),animationstart:Dc("Animation","AnimationStart"),transitionend:Dc("Transition","TransitionEnd")},Fc={},Gc={};
+fa&&(Gc=document.createElement("div").style,"AnimationEvent"in window||(delete Ec.animationend.animation,delete Ec.animationiteration.animation,delete Ec.animationstart.animation),"TransitionEvent"in window||delete Ec.transitionend.transition);function Hc(a){if(Fc[a])return Fc[a];if(!Ec[a])return a;var b=Ec[a],c;for(c in b)if(b.hasOwnProperty(c)&&c in Gc)return Fc[a]=b[c];return a}
+var Ic=Hc("animationend"),Jc=Hc("animationiteration"),Kc=Hc("animationstart"),Lc=Hc("transitionend"),Mc=new Map,Nc=new Map,Oc=["abort","abort",Ic,"animationEnd",Jc,"animationIteration",Kc,"animationStart","canplay","canPlay","canplaythrough","canPlayThrough","durationchange","durationChange","emptied","emptied","encrypted","encrypted","ended","ended","error","error","gotpointercapture","gotPointerCapture","load","load","loadeddata","loadedData","loadedmetadata","loadedMetadata","loadstart","loadStart",
+"lostpointercapture","lostPointerCapture","playing","playing","progress","progress","seeking","seeking","stalled","stalled","suspend","suspend","timeupdate","timeUpdate",Lc,"transitionEnd","waiting","waiting"];function Pc(a,b){for(var c=0;c<a.length;c+=2){var d=a[c],e=a[c+1];e="on"+(e[0].toUpperCase()+e.slice(1));Nc.set(d,b);Mc.set(d,e);da(e,[d])}}var Qc=r.unstable_now;Qc();var F=8;
+function Rc(a){if(0!==(1&a))return F=15,1;if(0!==(2&a))return F=14,2;if(0!==(4&a))return F=13,4;var b=24&a;if(0!==b)return F=12,b;if(0!==(a&32))return F=11,32;b=192&a;if(0!==b)return F=10,b;if(0!==(a&256))return F=9,256;b=3584&a;if(0!==b)return F=8,b;if(0!==(a&4096))return F=7,4096;b=4186112&a;if(0!==b)return F=6,b;b=62914560&a;if(0!==b)return F=5,b;if(a&67108864)return F=4,67108864;if(0!==(a&134217728))return F=3,134217728;b=805306368&a;if(0!==b)return F=2,b;if(0!==(1073741824&a))return F=1,1073741824;
+F=8;return a}function Sc(a){switch(a){case 99:return 15;case 98:return 10;case 97:case 96:return 8;case 95:return 2;default:return 0}}function Tc(a){switch(a){case 15:case 14:return 99;case 13:case 12:case 11:case 10:return 98;case 9:case 8:case 7:case 6:case 4:case 5:return 97;case 3:case 2:case 1:return 95;case 0:return 90;default:throw Error(y(358,a));}}
+function Uc(a,b){var c=a.pendingLanes;if(0===c)return F=0;var d=0,e=0,f=a.expiredLanes,g=a.suspendedLanes,h=a.pingedLanes;if(0!==f)d=f,e=F=15;else if(f=c&134217727,0!==f){var k=f&~g;0!==k?(d=Rc(k),e=F):(h&=f,0!==h&&(d=Rc(h),e=F))}else f=c&~g,0!==f?(d=Rc(f),e=F):0!==h&&(d=Rc(h),e=F);if(0===d)return 0;d=31-Vc(d);d=c&((0>d?0:1<<d)<<1)-1;if(0!==b&&b!==d&&0===(b&g)){Rc(b);if(e<=F)return b;F=e}b=a.entangledLanes;if(0!==b)for(a=a.entanglements,b&=d;0<b;)c=31-Vc(b),e=1<<c,d|=a[c],b&=~e;return d}
+function Wc(a){a=a.pendingLanes&-1073741825;return 0!==a?a:a&1073741824?1073741824:0}function Xc(a,b){switch(a){case 15:return 1;case 14:return 2;case 12:return a=Yc(24&~b),0===a?Xc(10,b):a;case 10:return a=Yc(192&~b),0===a?Xc(8,b):a;case 8:return a=Yc(3584&~b),0===a&&(a=Yc(4186112&~b),0===a&&(a=512)),a;case 2:return b=Yc(805306368&~b),0===b&&(b=268435456),b}throw Error(y(358,a));}function Yc(a){return a&-a}function Zc(a){for(var b=[],c=0;31>c;c++)b.push(a);return b}
+function $c(a,b,c){a.pendingLanes|=b;var d=b-1;a.suspendedLanes&=d;a.pingedLanes&=d;a=a.eventTimes;b=31-Vc(b);a[b]=c}var Vc=Math.clz32?Math.clz32:ad,bd=Math.log,cd=Math.LN2;function ad(a){return 0===a?32:31-(bd(a)/cd|0)|0}var dd=r.unstable_UserBlockingPriority,ed=r.unstable_runWithPriority,fd=!0;function gd(a,b,c,d){Kb||Ib();var e=hd,f=Kb;Kb=!0;try{Hb(e,a,b,c,d)}finally{(Kb=f)||Mb()}}function id(a,b,c,d){ed(dd,hd.bind(null,a,b,c,d))}
+function hd(a,b,c,d){if(fd){var e;if((e=0===(b&4))&&0<jc.length&&-1<qc.indexOf(a))a=rc(null,a,b,c,d),jc.push(a);else{var f=yc(a,b,c,d);if(null===f)e&&sc(a,d);else{if(e){if(-1<qc.indexOf(a)){a=rc(f,a,b,c,d);jc.push(a);return}if(uc(f,a,b,c,d))return;sc(a,d)}jd(a,b,d,null,c)}}}}
+function yc(a,b,c,d){var e=xb(d);e=wc(e);if(null!==e){var f=Zb(e);if(null===f)e=null;else{var g=f.tag;if(13===g){e=$b(f);if(null!==e)return e;e=null}else if(3===g){if(f.stateNode.hydrate)return 3===f.tag?f.stateNode.containerInfo:null;e=null}else f!==e&&(e=null)}}jd(a,b,d,e,c);return null}var kd=null,ld=null,md=null;
+function nd(){if(md)return md;var a,b=ld,c=b.length,d,e="value"in kd?kd.value:kd.textContent,f=e.length;for(a=0;a<c&&b[a]===e[a];a++);var g=c-a;for(d=1;d<=g&&b[c-d]===e[f-d];d++);return md=e.slice(a,1<d?1-d:void 0)}function od(a){var b=a.keyCode;"charCode"in a?(a=a.charCode,0===a&&13===b&&(a=13)):a=b;10===a&&(a=13);return 32<=a||13===a?a:0}function pd(){return!0}function qd(){return!1}
+function rd(a){function b(b,d,e,f,g){this._reactName=b;this._targetInst=e;this.type=d;this.nativeEvent=f;this.target=g;this.currentTarget=null;for(var c in a)a.hasOwnProperty(c)&&(b=a[c],this[c]=b?b(f):f[c]);this.isDefaultPrevented=(null!=f.defaultPrevented?f.defaultPrevented:!1===f.returnValue)?pd:qd;this.isPropagationStopped=qd;return this}m(b.prototype,{preventDefault:function(){this.defaultPrevented=!0;var a=this.nativeEvent;a&&(a.preventDefault?a.preventDefault():"unknown"!==typeof a.returnValue&&
+(a.returnValue=!1),this.isDefaultPrevented=pd)},stopPropagation:function(){var a=this.nativeEvent;a&&(a.stopPropagation?a.stopPropagation():"unknown"!==typeof a.cancelBubble&&(a.cancelBubble=!0),this.isPropagationStopped=pd)},persist:function(){},isPersistent:pd});return b}
+var sd={eventPhase:0,bubbles:0,cancelable:0,timeStamp:function(a){return a.timeStamp||Date.now()},defaultPrevented:0,isTrusted:0},td=rd(sd),ud=m({},sd,{view:0,detail:0}),vd=rd(ud),wd,xd,yd,Ad=m({},ud,{screenX:0,screenY:0,clientX:0,clientY:0,pageX:0,pageY:0,ctrlKey:0,shiftKey:0,altKey:0,metaKey:0,getModifierState:zd,button:0,buttons:0,relatedTarget:function(a){return void 0===a.relatedTarget?a.fromElement===a.srcElement?a.toElement:a.fromElement:a.relatedTarget},movementX:function(a){if("movementX"in
+a)return a.movementX;a!==yd&&(yd&&"mousemove"===a.type?(wd=a.screenX-yd.screenX,xd=a.screenY-yd.screenY):xd=wd=0,yd=a);return wd},movementY:function(a){return"movementY"in a?a.movementY:xd}}),Bd=rd(Ad),Cd=m({},Ad,{dataTransfer:0}),Dd=rd(Cd),Ed=m({},ud,{relatedTarget:0}),Fd=rd(Ed),Gd=m({},sd,{animationName:0,elapsedTime:0,pseudoElement:0}),Hd=rd(Gd),Id=m({},sd,{clipboardData:function(a){return"clipboardData"in a?a.clipboardData:window.clipboardData}}),Jd=rd(Id),Kd=m({},sd,{data:0}),Ld=rd(Kd),Md={Esc:"Escape",
+Spacebar:" ",Left:"ArrowLeft",Up:"ArrowUp",Right:"ArrowRight",Down:"ArrowDown",Del:"Delete",Win:"OS",Menu:"ContextMenu",Apps:"ContextMenu",Scroll:"ScrollLock",MozPrintableKey:"Unidentified"},Nd={8:"Backspace",9:"Tab",12:"Clear",13:"Enter",16:"Shift",17:"Control",18:"Alt",19:"Pause",20:"CapsLock",27:"Escape",32:" ",33:"PageUp",34:"PageDown",35:"End",36:"Home",37:"ArrowLeft",38:"ArrowUp",39:"ArrowRight",40:"ArrowDown",45:"Insert",46:"Delete",112:"F1",113:"F2",114:"F3",115:"F4",116:"F5",117:"F6",118:"F7",
+119:"F8",120:"F9",121:"F10",122:"F11",123:"F12",144:"NumLock",145:"ScrollLock",224:"Meta"},Od={Alt:"altKey",Control:"ctrlKey",Meta:"metaKey",Shift:"shiftKey"};function Pd(a){var b=this.nativeEvent;return b.getModifierState?b.getModifierState(a):(a=Od[a])?!!b[a]:!1}function zd(){return Pd}
+var Qd=m({},ud,{key:function(a){if(a.key){var b=Md[a.key]||a.key;if("Unidentified"!==b)return b}return"keypress"===a.type?(a=od(a),13===a?"Enter":String.fromCharCode(a)):"keydown"===a.type||"keyup"===a.type?Nd[a.keyCode]||"Unidentified":""},code:0,location:0,ctrlKey:0,shiftKey:0,altKey:0,metaKey:0,repeat:0,locale:0,getModifierState:zd,charCode:function(a){return"keypress"===a.type?od(a):0},keyCode:function(a){return"keydown"===a.type||"keyup"===a.type?a.keyCode:0},which:function(a){return"keypress"===
+a.type?od(a):"keydown"===a.type||"keyup"===a.type?a.keyCode:0}}),Rd=rd(Qd),Sd=m({},Ad,{pointerId:0,width:0,height:0,pressure:0,tangentialPressure:0,tiltX:0,tiltY:0,twist:0,pointerType:0,isPrimary:0}),Td=rd(Sd),Ud=m({},ud,{touches:0,targetTouches:0,changedTouches:0,altKey:0,metaKey:0,ctrlKey:0,shiftKey:0,getModifierState:zd}),Vd=rd(Ud),Wd=m({},sd,{propertyName:0,elapsedTime:0,pseudoElement:0}),Xd=rd(Wd),Yd=m({},Ad,{deltaX:function(a){return"deltaX"in a?a.deltaX:"wheelDeltaX"in a?-a.wheelDeltaX:0},
+deltaY:function(a){return"deltaY"in a?a.deltaY:"wheelDeltaY"in a?-a.wheelDeltaY:"wheelDelta"in a?-a.wheelDelta:0},deltaZ:0,deltaMode:0}),Zd=rd(Yd),$d=[9,13,27,32],ae=fa&&"CompositionEvent"in window,be=null;fa&&"documentMode"in document&&(be=document.documentMode);var ce=fa&&"TextEvent"in window&&!be,de=fa&&(!ae||be&&8<be&&11>=be),ee=String.fromCharCode(32),fe=!1;
+function ge(a,b){switch(a){case "keyup":return-1!==$d.indexOf(b.keyCode);case "keydown":return 229!==b.keyCode;case "keypress":case "mousedown":case "focusout":return!0;default:return!1}}function he(a){a=a.detail;return"object"===typeof a&&"data"in a?a.data:null}var ie=!1;function je(a,b){switch(a){case "compositionend":return he(b);case "keypress":if(32!==b.which)return null;fe=!0;return ee;case "textInput":return a=b.data,a===ee&&fe?null:a;default:return null}}
+function ke(a,b){if(ie)return"compositionend"===a||!ae&&ge(a,b)?(a=nd(),md=ld=kd=null,ie=!1,a):null;switch(a){case "paste":return null;case "keypress":if(!(b.ctrlKey||b.altKey||b.metaKey)||b.ctrlKey&&b.altKey){if(b.char&&1<b.char.length)return b.char;if(b.which)return String.fromCharCode(b.which)}return null;case "compositionend":return de&&"ko"!==b.locale?null:b.data;default:return null}}
+var le={color:!0,date:!0,datetime:!0,"datetime-local":!0,email:!0,month:!0,number:!0,password:!0,range:!0,search:!0,tel:!0,text:!0,time:!0,url:!0,week:!0};function me(a){var b=a&&a.nodeName&&a.nodeName.toLowerCase();return"input"===b?!!le[a.type]:"textarea"===b?!0:!1}function ne(a,b,c,d){Eb(d);b=oe(b,"onChange");0<b.length&&(c=new td("onChange","change",null,c,d),a.push({event:c,listeners:b}))}var pe=null,qe=null;function re(a){se(a,0)}function te(a){var b=ue(a);if(Wa(b))return a}
+function ve(a,b){if("change"===a)return b}var we=!1;if(fa){var xe;if(fa){var ye="oninput"in document;if(!ye){var ze=document.createElement("div");ze.setAttribute("oninput","return;");ye="function"===typeof ze.oninput}xe=ye}else xe=!1;we=xe&&(!document.documentMode||9<document.documentMode)}function Ae(){pe&&(pe.detachEvent("onpropertychange",Be),qe=pe=null)}function Be(a){if("value"===a.propertyName&&te(qe)){var b=[];ne(b,qe,a,xb(a));a=re;if(Kb)a(b);else{Kb=!0;try{Gb(a,b)}finally{Kb=!1,Mb()}}}}
+function Ce(a,b,c){"focusin"===a?(Ae(),pe=b,qe=c,pe.attachEvent("onpropertychange",Be)):"focusout"===a&&Ae()}function De(a){if("selectionchange"===a||"keyup"===a||"keydown"===a)return te(qe)}function Ee(a,b){if("click"===a)return te(b)}function Fe(a,b){if("input"===a||"change"===a)return te(b)}function Ge(a,b){return a===b&&(0!==a||1/a===1/b)||a!==a&&b!==b}var He="function"===typeof Object.is?Object.is:Ge,Ie=Object.prototype.hasOwnProperty;
+function Je(a,b){if(He(a,b))return!0;if("object"!==typeof a||null===a||"object"!==typeof b||null===b)return!1;var c=Object.keys(a),d=Object.keys(b);if(c.length!==d.length)return!1;for(d=0;d<c.length;d++)if(!Ie.call(b,c[d])||!He(a[c[d]],b[c[d]]))return!1;return!0}function Ke(a){for(;a&&a.firstChild;)a=a.firstChild;return a}
+function Le(a,b){var c=Ke(a);a=0;for(var d;c;){if(3===c.nodeType){d=a+c.textContent.length;if(a<=b&&d>=b)return{node:c,offset:b-a};a=d}a:{for(;c;){if(c.nextSibling){c=c.nextSibling;break a}c=c.parentNode}c=void 0}c=Ke(c)}}function Me(a,b){return a&&b?a===b?!0:a&&3===a.nodeType?!1:b&&3===b.nodeType?Me(a,b.parentNode):"contains"in a?a.contains(b):a.compareDocumentPosition?!!(a.compareDocumentPosition(b)&16):!1:!1}
+function Ne(){for(var a=window,b=Xa();b instanceof a.HTMLIFrameElement;){try{var c="string"===typeof b.contentWindow.location.href}catch(d){c=!1}if(c)a=b.contentWindow;else break;b=Xa(a.document)}return b}function Oe(a){var b=a&&a.nodeName&&a.nodeName.toLowerCase();return b&&("input"===b&&("text"===a.type||"search"===a.type||"tel"===a.type||"url"===a.type||"password"===a.type)||"textarea"===b||"true"===a.contentEditable)}
+var Pe=fa&&"documentMode"in document&&11>=document.documentMode,Qe=null,Re=null,Se=null,Te=!1;
+function Ue(a,b,c){var d=c.window===c?c.document:9===c.nodeType?c:c.ownerDocument;Te||null==Qe||Qe!==Xa(d)||(d=Qe,"selectionStart"in d&&Oe(d)?d={start:d.selectionStart,end:d.selectionEnd}:(d=(d.ownerDocument&&d.ownerDocument.defaultView||window).getSelection(),d={anchorNode:d.anchorNode,anchorOffset:d.anchorOffset,focusNode:d.focusNode,focusOffset:d.focusOffset}),Se&&Je(Se,d)||(Se=d,d=oe(Re,"onSelect"),0<d.length&&(b=new td("onSelect","select",null,b,c),a.push({event:b,listeners:d}),b.target=Qe)))}
+Pc("cancel cancel click click close close contextmenu contextMenu copy copy cut cut auxclick auxClick dblclick doubleClick dragend dragEnd dragstart dragStart drop drop focusin focus focusout blur input input invalid invalid keydown keyDown keypress keyPress keyup keyUp mousedown mouseDown mouseup mouseUp paste paste pause pause play play pointercancel pointerCancel pointerdown pointerDown pointerup pointerUp ratechange rateChange reset reset seeked seeked submit submit touchcancel touchCancel touchend touchEnd touchstart touchStart volumechange volumeChange".split(" "),
+0);Pc("drag drag dragenter dragEnter dragexit dragExit dragleave dragLeave dragover dragOver mousemove mouseMove mouseout mouseOut mouseover mouseOver pointermove pointerMove pointerout pointerOut pointerover pointerOver scroll scroll toggle toggle touchmove touchMove wheel wheel".split(" "),1);Pc(Oc,2);for(var Ve="change selectionchange textInput compositionstart compositionend compositionupdate".split(" "),We=0;We<Ve.length;We++)Nc.set(Ve[We],0);ea("onMouseEnter",["mouseout","mouseover"]);
+ea("onMouseLeave",["mouseout","mouseover"]);ea("onPointerEnter",["pointerout","pointerover"]);ea("onPointerLeave",["pointerout","pointerover"]);da("onChange","change click focusin focusout input keydown keyup selectionchange".split(" "));da("onSelect","focusout contextmenu dragend focusin keydown keyup mousedown mouseup selectionchange".split(" "));da("onBeforeInput",["compositionend","keypress","textInput","paste"]);da("onCompositionEnd","compositionend focusout keydown keypress keyup mousedown".split(" "));
+da("onCompositionStart","compositionstart focusout keydown keypress keyup mousedown".split(" "));da("onCompositionUpdate","compositionupdate focusout keydown keypress keyup mousedown".split(" "));var Xe="abort canplay canplaythrough durationchange emptied encrypted ended error loadeddata loadedmetadata loadstart pause play playing progress ratechange seeked seeking stalled suspend timeupdate volumechange waiting".split(" "),Ye=new Set("cancel close invalid load scroll toggle".split(" ").concat(Xe));
+function Ze(a,b,c){var d=a.type||"unknown-event";a.currentTarget=c;Yb(d,b,void 0,a);a.currentTarget=null}
+function se(a,b){b=0!==(b&4);for(var c=0;c<a.length;c++){var d=a[c],e=d.event;d=d.listeners;a:{var f=void 0;if(b)for(var g=d.length-1;0<=g;g--){var h=d[g],k=h.instance,l=h.currentTarget;h=h.listener;if(k!==f&&e.isPropagationStopped())break a;Ze(e,h,l);f=k}else for(g=0;g<d.length;g++){h=d[g];k=h.instance;l=h.currentTarget;h=h.listener;if(k!==f&&e.isPropagationStopped())break a;Ze(e,h,l);f=k}}}if(Ub)throw a=Vb,Ub=!1,Vb=null,a;}
+function G(a,b){var c=$e(b),d=a+"__bubble";c.has(d)||(af(b,a,2,!1),c.add(d))}var bf="_reactListening"+Math.random().toString(36).slice(2);function cf(a){a[bf]||(a[bf]=!0,ba.forEach(function(b){Ye.has(b)||df(b,!1,a,null);df(b,!0,a,null)}))}
+function df(a,b,c,d){var e=4<arguments.length&&void 0!==arguments[4]?arguments[4]:0,f=c;"selectionchange"===a&&9!==c.nodeType&&(f=c.ownerDocument);if(null!==d&&!b&&Ye.has(a)){if("scroll"!==a)return;e|=2;f=d}var g=$e(f),h=a+"__"+(b?"capture":"bubble");g.has(h)||(b&&(e|=4),af(f,a,e,b),g.add(h))}
+function af(a,b,c,d){var e=Nc.get(b);switch(void 0===e?2:e){case 0:e=gd;break;case 1:e=id;break;default:e=hd}c=e.bind(null,b,c,a);e=void 0;!Pb||"touchstart"!==b&&"touchmove"!==b&&"wheel"!==b||(e=!0);d?void 0!==e?a.addEventListener(b,c,{capture:!0,passive:e}):a.addEventListener(b,c,!0):void 0!==e?a.addEventListener(b,c,{passive:e}):a.addEventListener(b,c,!1)}
+function jd(a,b,c,d,e){var f=d;if(0===(b&1)&&0===(b&2)&&null!==d)a:for(;;){if(null===d)return;var g=d.tag;if(3===g||4===g){var h=d.stateNode.containerInfo;if(h===e||8===h.nodeType&&h.parentNode===e)break;if(4===g)for(g=d.return;null!==g;){var k=g.tag;if(3===k||4===k)if(k=g.stateNode.containerInfo,k===e||8===k.nodeType&&k.parentNode===e)return;g=g.return}for(;null!==h;){g=wc(h);if(null===g)return;k=g.tag;if(5===k||6===k){d=f=g;continue a}h=h.parentNode}}d=d.return}Nb(function(){var d=f,e=xb(c),g=[];
+a:{var h=Mc.get(a);if(void 0!==h){var k=td,x=a;switch(a){case "keypress":if(0===od(c))break a;case "keydown":case "keyup":k=Rd;break;case "focusin":x="focus";k=Fd;break;case "focusout":x="blur";k=Fd;break;case "beforeblur":case "afterblur":k=Fd;break;case "click":if(2===c.button)break a;case "auxclick":case "dblclick":case "mousedown":case "mousemove":case "mouseup":case "mouseout":case "mouseover":case "contextmenu":k=Bd;break;case "drag":case "dragend":case "dragenter":case "dragexit":case "dragleave":case "dragover":case "dragstart":case "drop":k=
+Dd;break;case "touchcancel":case "touchend":case "touchmove":case "touchstart":k=Vd;break;case Ic:case Jc:case Kc:k=Hd;break;case Lc:k=Xd;break;case "scroll":k=vd;break;case "wheel":k=Zd;break;case "copy":case "cut":case "paste":k=Jd;break;case "gotpointercapture":case "lostpointercapture":case "pointercancel":case "pointerdown":case "pointermove":case "pointerout":case "pointerover":case "pointerup":k=Td}var w=0!==(b&4),z=!w&&"scroll"===a,u=w?null!==h?h+"Capture":null:h;w=[];for(var t=d,q;null!==
+t;){q=t;var v=q.stateNode;5===q.tag&&null!==v&&(q=v,null!==u&&(v=Ob(t,u),null!=v&&w.push(ef(t,v,q))));if(z)break;t=t.return}0<w.length&&(h=new k(h,x,null,c,e),g.push({event:h,listeners:w}))}}if(0===(b&7)){a:{h="mouseover"===a||"pointerover"===a;k="mouseout"===a||"pointerout"===a;if(h&&0===(b&16)&&(x=c.relatedTarget||c.fromElement)&&(wc(x)||x[ff]))break a;if(k||h){h=e.window===e?e:(h=e.ownerDocument)?h.defaultView||h.parentWindow:window;if(k){if(x=c.relatedTarget||c.toElement,k=d,x=x?wc(x):null,null!==
+x&&(z=Zb(x),x!==z||5!==x.tag&&6!==x.tag))x=null}else k=null,x=d;if(k!==x){w=Bd;v="onMouseLeave";u="onMouseEnter";t="mouse";if("pointerout"===a||"pointerover"===a)w=Td,v="onPointerLeave",u="onPointerEnter",t="pointer";z=null==k?h:ue(k);q=null==x?h:ue(x);h=new w(v,t+"leave",k,c,e);h.target=z;h.relatedTarget=q;v=null;wc(e)===d&&(w=new w(u,t+"enter",x,c,e),w.target=q,w.relatedTarget=z,v=w);z=v;if(k&&x)b:{w=k;u=x;t=0;for(q=w;q;q=gf(q))t++;q=0;for(v=u;v;v=gf(v))q++;for(;0<t-q;)w=gf(w),t--;for(;0<q-t;)u=
+gf(u),q--;for(;t--;){if(w===u||null!==u&&w===u.alternate)break b;w=gf(w);u=gf(u)}w=null}else w=null;null!==k&&hf(g,h,k,w,!1);null!==x&&null!==z&&hf(g,z,x,w,!0)}}}a:{h=d?ue(d):window;k=h.nodeName&&h.nodeName.toLowerCase();if("select"===k||"input"===k&&"file"===h.type)var J=ve;else if(me(h))if(we)J=Fe;else{J=De;var K=Ce}else(k=h.nodeName)&&"input"===k.toLowerCase()&&("checkbox"===h.type||"radio"===h.type)&&(J=Ee);if(J&&(J=J(a,d))){ne(g,J,c,e);break a}K&&K(a,h,d);"focusout"===a&&(K=h._wrapperState)&&
+K.controlled&&"number"===h.type&&bb(h,"number",h.value)}K=d?ue(d):window;switch(a){case "focusin":if(me(K)||"true"===K.contentEditable)Qe=K,Re=d,Se=null;break;case "focusout":Se=Re=Qe=null;break;case "mousedown":Te=!0;break;case "contextmenu":case "mouseup":case "dragend":Te=!1;Ue(g,c,e);break;case "selectionchange":if(Pe)break;case "keydown":case "keyup":Ue(g,c,e)}var Q;if(ae)b:{switch(a){case "compositionstart":var L="onCompositionStart";break b;case "compositionend":L="onCompositionEnd";break b;
+case "compositionupdate":L="onCompositionUpdate";break b}L=void 0}else ie?ge(a,c)&&(L="onCompositionEnd"):"keydown"===a&&229===c.keyCode&&(L="onCompositionStart");L&&(de&&"ko"!==c.locale&&(ie||"onCompositionStart"!==L?"onCompositionEnd"===L&&ie&&(Q=nd()):(kd=e,ld="value"in kd?kd.value:kd.textContent,ie=!0)),K=oe(d,L),0<K.length&&(L=new Ld(L,a,null,c,e),g.push({event:L,listeners:K}),Q?L.data=Q:(Q=he(c),null!==Q&&(L.data=Q))));if(Q=ce?je(a,c):ke(a,c))d=oe(d,"onBeforeInput"),0<d.length&&(e=new Ld("onBeforeInput",
+"beforeinput",null,c,e),g.push({event:e,listeners:d}),e.data=Q)}se(g,b)})}function ef(a,b,c){return{instance:a,listener:b,currentTarget:c}}function oe(a,b){for(var c=b+"Capture",d=[];null!==a;){var e=a,f=e.stateNode;5===e.tag&&null!==f&&(e=f,f=Ob(a,c),null!=f&&d.unshift(ef(a,f,e)),f=Ob(a,b),null!=f&&d.push(ef(a,f,e)));a=a.return}return d}function gf(a){if(null===a)return null;do a=a.return;while(a&&5!==a.tag);return a?a:null}
+function hf(a,b,c,d,e){for(var f=b._reactName,g=[];null!==c&&c!==d;){var h=c,k=h.alternate,l=h.stateNode;if(null!==k&&k===d)break;5===h.tag&&null!==l&&(h=l,e?(k=Ob(c,f),null!=k&&g.unshift(ef(c,k,h))):e||(k=Ob(c,f),null!=k&&g.push(ef(c,k,h))));c=c.return}0!==g.length&&a.push({event:b,listeners:g})}function jf(){}var kf=null,lf=null;function mf(a,b){switch(a){case "button":case "input":case "select":case "textarea":return!!b.autoFocus}return!1}
+function nf(a,b){return"textarea"===a||"option"===a||"noscript"===a||"string"===typeof b.children||"number"===typeof b.children||"object"===typeof b.dangerouslySetInnerHTML&&null!==b.dangerouslySetInnerHTML&&null!=b.dangerouslySetInnerHTML.__html}var of="function"===typeof setTimeout?setTimeout:void 0,pf="function"===typeof clearTimeout?clearTimeout:void 0;function qf(a){1===a.nodeType?a.textContent="":9===a.nodeType&&(a=a.body,null!=a&&(a.textContent=""))}
+function rf(a){for(;null!=a;a=a.nextSibling){var b=a.nodeType;if(1===b||3===b)break}return a}function sf(a){a=a.previousSibling;for(var b=0;a;){if(8===a.nodeType){var c=a.data;if("$"===c||"$!"===c||"$?"===c){if(0===b)return a;b--}else"/$"===c&&b++}a=a.previousSibling}return null}var tf=0;function uf(a){return{$$typeof:Ga,toString:a,valueOf:a}}var vf=Math.random().toString(36).slice(2),wf="__reactFiber$"+vf,xf="__reactProps$"+vf,ff="__reactContainer$"+vf,yf="__reactEvents$"+vf;
+function wc(a){var b=a[wf];if(b)return b;for(var c=a.parentNode;c;){if(b=c[ff]||c[wf]){c=b.alternate;if(null!==b.child||null!==c&&null!==c.child)for(a=sf(a);null!==a;){if(c=a[wf])return c;a=sf(a)}return b}a=c;c=a.parentNode}return null}function Cb(a){a=a[wf]||a[ff];return!a||5!==a.tag&&6!==a.tag&&13!==a.tag&&3!==a.tag?null:a}function ue(a){if(5===a.tag||6===a.tag)return a.stateNode;throw Error(y(33));}function Db(a){return a[xf]||null}
+function $e(a){var b=a[yf];void 0===b&&(b=a[yf]=new Set);return b}var zf=[],Af=-1;function Bf(a){return{current:a}}function H(a){0>Af||(a.current=zf[Af],zf[Af]=null,Af--)}function I(a,b){Af++;zf[Af]=a.current;a.current=b}var Cf={},M=Bf(Cf),N=Bf(!1),Df=Cf;
+function Ef(a,b){var c=a.type.contextTypes;if(!c)return Cf;var d=a.stateNode;if(d&&d.__reactInternalMemoizedUnmaskedChildContext===b)return d.__reactInternalMemoizedMaskedChildContext;var e={},f;for(f in c)e[f]=b[f];d&&(a=a.stateNode,a.__reactInternalMemoizedUnmaskedChildContext=b,a.__reactInternalMemoizedMaskedChildContext=e);return e}function Ff(a){a=a.childContextTypes;return null!==a&&void 0!==a}function Gf(){H(N);H(M)}function Hf(a,b,c){if(M.current!==Cf)throw Error(y(168));I(M,b);I(N,c)}
+function If(a,b,c){var d=a.stateNode;a=b.childContextTypes;if("function"!==typeof d.getChildContext)return c;d=d.getChildContext();for(var e in d)if(!(e in a))throw Error(y(108,Ra(b)||"Unknown",e));return m({},c,d)}function Jf(a){a=(a=a.stateNode)&&a.__reactInternalMemoizedMergedChildContext||Cf;Df=M.current;I(M,a);I(N,N.current);return!0}function Kf(a,b,c){var d=a.stateNode;if(!d)throw Error(y(169));c?(a=If(a,b,Df),d.__reactInternalMemoizedMergedChildContext=a,H(N),H(M),I(M,a)):H(N);I(N,c)}
+var Lf=null,Mf=null,Nf=r.unstable_runWithPriority,Of=r.unstable_scheduleCallback,Pf=r.unstable_cancelCallback,Qf=r.unstable_shouldYield,Rf=r.unstable_requestPaint,Sf=r.unstable_now,Tf=r.unstable_getCurrentPriorityLevel,Uf=r.unstable_ImmediatePriority,Vf=r.unstable_UserBlockingPriority,Wf=r.unstable_NormalPriority,Xf=r.unstable_LowPriority,Yf=r.unstable_IdlePriority,Zf={},$f=void 0!==Rf?Rf:function(){},ag=null,bg=null,cg=!1,dg=Sf(),O=1E4>dg?Sf:function(){return Sf()-dg};
+function eg(){switch(Tf()){case Uf:return 99;case Vf:return 98;case Wf:return 97;case Xf:return 96;case Yf:return 95;default:throw Error(y(332));}}function fg(a){switch(a){case 99:return Uf;case 98:return Vf;case 97:return Wf;case 96:return Xf;case 95:return Yf;default:throw Error(y(332));}}function gg(a,b){a=fg(a);return Nf(a,b)}function hg(a,b,c){a=fg(a);return Of(a,b,c)}function ig(){if(null!==bg){var a=bg;bg=null;Pf(a)}jg()}
+function jg(){if(!cg&&null!==ag){cg=!0;var a=0;try{var b=ag;gg(99,function(){for(;a<b.length;a++){var c=b[a];do c=c(!0);while(null!==c)}});ag=null}catch(c){throw null!==ag&&(ag=ag.slice(a+1)),Of(Uf,ig),c;}finally{cg=!1}}}var kg=ra.ReactCurrentBatchConfig;function lg(a,b){if(a&&a.defaultProps){b=m({},b);a=a.defaultProps;for(var c in a)void 0===b[c]&&(b[c]=a[c]);return b}return b}var mg=Bf(null),ng=null,og=null,pg=null;function qg(){pg=og=ng=null}
+function rg(a){var b=mg.current;H(mg);a.type._context._currentValue=b}function sg(a,b){for(;null!==a;){var c=a.alternate;if((a.childLanes&b)===b)if(null===c||(c.childLanes&b)===b)break;else c.childLanes|=b;else a.childLanes|=b,null!==c&&(c.childLanes|=b);a=a.return}}function tg(a,b){ng=a;pg=og=null;a=a.dependencies;null!==a&&null!==a.firstContext&&(0!==(a.lanes&b)&&(ug=!0),a.firstContext=null)}
+function vg(a,b){if(pg!==a&&!1!==b&&0!==b){if("number"!==typeof b||1073741823===b)pg=a,b=1073741823;b={context:a,observedBits:b,next:null};if(null===og){if(null===ng)throw Error(y(308));og=b;ng.dependencies={lanes:0,firstContext:b,responders:null}}else og=og.next=b}return a._currentValue}var wg=!1;function xg(a){a.updateQueue={baseState:a.memoizedState,firstBaseUpdate:null,lastBaseUpdate:null,shared:{pending:null},effects:null}}
+function yg(a,b){a=a.updateQueue;b.updateQueue===a&&(b.updateQueue={baseState:a.baseState,firstBaseUpdate:a.firstBaseUpdate,lastBaseUpdate:a.lastBaseUpdate,shared:a.shared,effects:a.effects})}function zg(a,b){return{eventTime:a,lane:b,tag:0,payload:null,callback:null,next:null}}function Ag(a,b){a=a.updateQueue;if(null!==a){a=a.shared;var c=a.pending;null===c?b.next=b:(b.next=c.next,c.next=b);a.pending=b}}
+function Bg(a,b){var c=a.updateQueue,d=a.alternate;if(null!==d&&(d=d.updateQueue,c===d)){var e=null,f=null;c=c.firstBaseUpdate;if(null!==c){do{var g={eventTime:c.eventTime,lane:c.lane,tag:c.tag,payload:c.payload,callback:c.callback,next:null};null===f?e=f=g:f=f.next=g;c=c.next}while(null!==c);null===f?e=f=b:f=f.next=b}else e=f=b;c={baseState:d.baseState,firstBaseUpdate:e,lastBaseUpdate:f,shared:d.shared,effects:d.effects};a.updateQueue=c;return}a=c.lastBaseUpdate;null===a?c.firstBaseUpdate=b:a.next=
+b;c.lastBaseUpdate=b}
+function Cg(a,b,c,d){var e=a.updateQueue;wg=!1;var f=e.firstBaseUpdate,g=e.lastBaseUpdate,h=e.shared.pending;if(null!==h){e.shared.pending=null;var k=h,l=k.next;k.next=null;null===g?f=l:g.next=l;g=k;var n=a.alternate;if(null!==n){n=n.updateQueue;var A=n.lastBaseUpdate;A!==g&&(null===A?n.firstBaseUpdate=l:A.next=l,n.lastBaseUpdate=k)}}if(null!==f){A=e.baseState;g=0;n=l=k=null;do{h=f.lane;var p=f.eventTime;if((d&h)===h){null!==n&&(n=n.next={eventTime:p,lane:0,tag:f.tag,payload:f.payload,callback:f.callback,
+next:null});a:{var C=a,x=f;h=b;p=c;switch(x.tag){case 1:C=x.payload;if("function"===typeof C){A=C.call(p,A,h);break a}A=C;break a;case 3:C.flags=C.flags&-4097|64;case 0:C=x.payload;h="function"===typeof C?C.call(p,A,h):C;if(null===h||void 0===h)break a;A=m({},A,h);break a;case 2:wg=!0}}null!==f.callback&&(a.flags|=32,h=e.effects,null===h?e.effects=[f]:h.push(f))}else p={eventTime:p,lane:h,tag:f.tag,payload:f.payload,callback:f.callback,next:null},null===n?(l=n=p,k=A):n=n.next=p,g|=h;f=f.next;if(null===
+f)if(h=e.shared.pending,null===h)break;else f=h.next,h.next=null,e.lastBaseUpdate=h,e.shared.pending=null}while(1);null===n&&(k=A);e.baseState=k;e.firstBaseUpdate=l;e.lastBaseUpdate=n;Dg|=g;a.lanes=g;a.memoizedState=A}}function Eg(a,b,c){a=b.effects;b.effects=null;if(null!==a)for(b=0;b<a.length;b++){var d=a[b],e=d.callback;if(null!==e){d.callback=null;d=c;if("function"!==typeof e)throw Error(y(191,e));e.call(d)}}}var Fg=(new aa.Component).refs;
+function Gg(a,b,c,d){b=a.memoizedState;c=c(d,b);c=null===c||void 0===c?b:m({},b,c);a.memoizedState=c;0===a.lanes&&(a.updateQueue.baseState=c)}
+var Kg={isMounted:function(a){return(a=a._reactInternals)?Zb(a)===a:!1},enqueueSetState:function(a,b,c){a=a._reactInternals;var d=Hg(),e=Ig(a),f=zg(d,e);f.payload=b;void 0!==c&&null!==c&&(f.callback=c);Ag(a,f);Jg(a,e,d)},enqueueReplaceState:function(a,b,c){a=a._reactInternals;var d=Hg(),e=Ig(a),f=zg(d,e);f.tag=1;f.payload=b;void 0!==c&&null!==c&&(f.callback=c);Ag(a,f);Jg(a,e,d)},enqueueForceUpdate:function(a,b){a=a._reactInternals;var c=Hg(),d=Ig(a),e=zg(c,d);e.tag=2;void 0!==b&&null!==b&&(e.callback=
+b);Ag(a,e);Jg(a,d,c)}};function Lg(a,b,c,d,e,f,g){a=a.stateNode;return"function"===typeof a.shouldComponentUpdate?a.shouldComponentUpdate(d,f,g):b.prototype&&b.prototype.isPureReactComponent?!Je(c,d)||!Je(e,f):!0}
+function Mg(a,b,c){var d=!1,e=Cf;var f=b.contextType;"object"===typeof f&&null!==f?f=vg(f):(e=Ff(b)?Df:M.current,d=b.contextTypes,f=(d=null!==d&&void 0!==d)?Ef(a,e):Cf);b=new b(c,f);a.memoizedState=null!==b.state&&void 0!==b.state?b.state:null;b.updater=Kg;a.stateNode=b;b._reactInternals=a;d&&(a=a.stateNode,a.__reactInternalMemoizedUnmaskedChildContext=e,a.__reactInternalMemoizedMaskedChildContext=f);return b}
+function Ng(a,b,c,d){a=b.state;"function"===typeof b.componentWillReceiveProps&&b.componentWillReceiveProps(c,d);"function"===typeof b.UNSAFE_componentWillReceiveProps&&b.UNSAFE_componentWillReceiveProps(c,d);b.state!==a&&Kg.enqueueReplaceState(b,b.state,null)}
+function Og(a,b,c,d){var e=a.stateNode;e.props=c;e.state=a.memoizedState;e.refs=Fg;xg(a);var f=b.contextType;"object"===typeof f&&null!==f?e.context=vg(f):(f=Ff(b)?Df:M.current,e.context=Ef(a,f));Cg(a,c,e,d);e.state=a.memoizedState;f=b.getDerivedStateFromProps;"function"===typeof f&&(Gg(a,b,f,c),e.state=a.memoizedState);"function"===typeof b.getDerivedStateFromProps||"function"===typeof e.getSnapshotBeforeUpdate||"function"!==typeof e.UNSAFE_componentWillMount&&"function"!==typeof e.componentWillMount||
+(b=e.state,"function"===typeof e.componentWillMount&&e.componentWillMount(),"function"===typeof e.UNSAFE_componentWillMount&&e.UNSAFE_componentWillMount(),b!==e.state&&Kg.enqueueReplaceState(e,e.state,null),Cg(a,c,e,d),e.state=a.memoizedState);"function"===typeof e.componentDidMount&&(a.flags|=4)}var Pg=Array.isArray;
+function Qg(a,b,c){a=c.ref;if(null!==a&&"function"!==typeof a&&"object"!==typeof a){if(c._owner){c=c._owner;if(c){if(1!==c.tag)throw Error(y(309));var d=c.stateNode}if(!d)throw Error(y(147,a));var e=""+a;if(null!==b&&null!==b.ref&&"function"===typeof b.ref&&b.ref._stringRef===e)return b.ref;b=function(a){var b=d.refs;b===Fg&&(b=d.refs={});null===a?delete b[e]:b[e]=a};b._stringRef=e;return b}if("string"!==typeof a)throw Error(y(284));if(!c._owner)throw Error(y(290,a));}return a}
+function Rg(a,b){if("textarea"!==a.type)throw Error(y(31,"[object Object]"===Object.prototype.toString.call(b)?"object with keys {"+Object.keys(b).join(", ")+"}":b));}
+function Sg(a){function b(b,c){if(a){var d=b.lastEffect;null!==d?(d.nextEffect=c,b.lastEffect=c):b.firstEffect=b.lastEffect=c;c.nextEffect=null;c.flags=8}}function c(c,d){if(!a)return null;for(;null!==d;)b(c,d),d=d.sibling;return null}function d(a,b){for(a=new Map;null!==b;)null!==b.key?a.set(b.key,b):a.set(b.index,b),b=b.sibling;return a}function e(a,b){a=Tg(a,b);a.index=0;a.sibling=null;return a}function f(b,c,d){b.index=d;if(!a)return c;d=b.alternate;if(null!==d)return d=d.index,d<c?(b.flags=2,
+c):d;b.flags=2;return c}function g(b){a&&null===b.alternate&&(b.flags=2);return b}function h(a,b,c,d){if(null===b||6!==b.tag)return b=Ug(c,a.mode,d),b.return=a,b;b=e(b,c);b.return=a;return b}function k(a,b,c,d){if(null!==b&&b.elementType===c.type)return d=e(b,c.props),d.ref=Qg(a,b,c),d.return=a,d;d=Vg(c.type,c.key,c.props,null,a.mode,d);d.ref=Qg(a,b,c);d.return=a;return d}function l(a,b,c,d){if(null===b||4!==b.tag||b.stateNode.containerInfo!==c.containerInfo||b.stateNode.implementation!==c.implementation)return b=
+Wg(c,a.mode,d),b.return=a,b;b=e(b,c.children||[]);b.return=a;return b}function n(a,b,c,d,f){if(null===b||7!==b.tag)return b=Xg(c,a.mode,d,f),b.return=a,b;b=e(b,c);b.return=a;return b}function A(a,b,c){if("string"===typeof b||"number"===typeof b)return b=Ug(""+b,a.mode,c),b.return=a,b;if("object"===typeof b&&null!==b){switch(b.$$typeof){case sa:return c=Vg(b.type,b.key,b.props,null,a.mode,c),c.ref=Qg(a,null,b),c.return=a,c;case ta:return b=Wg(b,a.mode,c),b.return=a,b}if(Pg(b)||La(b))return b=Xg(b,
+a.mode,c,null),b.return=a,b;Rg(a,b)}return null}function p(a,b,c,d){var e=null!==b?b.key:null;if("string"===typeof c||"number"===typeof c)return null!==e?null:h(a,b,""+c,d);if("object"===typeof c&&null!==c){switch(c.$$typeof){case sa:return c.key===e?c.type===ua?n(a,b,c.props.children,d,e):k(a,b,c,d):null;case ta:return c.key===e?l(a,b,c,d):null}if(Pg(c)||La(c))return null!==e?null:n(a,b,c,d,null);Rg(a,c)}return null}function C(a,b,c,d,e){if("string"===typeof d||"number"===typeof d)return a=a.get(c)||
+null,h(b,a,""+d,e);if("object"===typeof d&&null!==d){switch(d.$$typeof){case sa:return a=a.get(null===d.key?c:d.key)||null,d.type===ua?n(b,a,d.props.children,e,d.key):k(b,a,d,e);case ta:return a=a.get(null===d.key?c:d.key)||null,l(b,a,d,e)}if(Pg(d)||La(d))return a=a.get(c)||null,n(b,a,d,e,null);Rg(b,d)}return null}function x(e,g,h,k){for(var l=null,t=null,u=g,z=g=0,q=null;null!==u&&z<h.length;z++){u.index>z?(q=u,u=null):q=u.sibling;var n=p(e,u,h[z],k);if(null===n){null===u&&(u=q);break}a&&u&&null===
+n.alternate&&b(e,u);g=f(n,g,z);null===t?l=n:t.sibling=n;t=n;u=q}if(z===h.length)return c(e,u),l;if(null===u){for(;z<h.length;z++)u=A(e,h[z],k),null!==u&&(g=f(u,g,z),null===t?l=u:t.sibling=u,t=u);return l}for(u=d(e,u);z<h.length;z++)q=C(u,e,z,h[z],k),null!==q&&(a&&null!==q.alternate&&u.delete(null===q.key?z:q.key),g=f(q,g,z),null===t?l=q:t.sibling=q,t=q);a&&u.forEach(function(a){return b(e,a)});return l}function w(e,g,h,k){var l=La(h);if("function"!==typeof l)throw Error(y(150));h=l.call(h);if(null==
+h)throw Error(y(151));for(var t=l=null,u=g,z=g=0,q=null,n=h.next();null!==u&&!n.done;z++,n=h.next()){u.index>z?(q=u,u=null):q=u.sibling;var w=p(e,u,n.value,k);if(null===w){null===u&&(u=q);break}a&&u&&null===w.alternate&&b(e,u);g=f(w,g,z);null===t?l=w:t.sibling=w;t=w;u=q}if(n.done)return c(e,u),l;if(null===u){for(;!n.done;z++,n=h.next())n=A(e,n.value,k),null!==n&&(g=f(n,g,z),null===t?l=n:t.sibling=n,t=n);return l}for(u=d(e,u);!n.done;z++,n=h.next())n=C(u,e,z,n.value,k),null!==n&&(a&&null!==n.alternate&&
+u.delete(null===n.key?z:n.key),g=f(n,g,z),null===t?l=n:t.sibling=n,t=n);a&&u.forEach(function(a){return b(e,a)});return l}return function(a,d,f,h){var k="object"===typeof f&&null!==f&&f.type===ua&&null===f.key;k&&(f=f.props.children);var l="object"===typeof f&&null!==f;if(l)switch(f.$$typeof){case sa:a:{l=f.key;for(k=d;null!==k;){if(k.key===l){switch(k.tag){case 7:if(f.type===ua){c(a,k.sibling);d=e(k,f.props.children);d.return=a;a=d;break a}break;default:if(k.elementType===f.type){c(a,k.sibling);
+d=e(k,f.props);d.ref=Qg(a,k,f);d.return=a;a=d;break a}}c(a,k);break}else b(a,k);k=k.sibling}f.type===ua?(d=Xg(f.props.children,a.mode,h,f.key),d.return=a,a=d):(h=Vg(f.type,f.key,f.props,null,a.mode,h),h.ref=Qg(a,d,f),h.return=a,a=h)}return g(a);case ta:a:{for(k=f.key;null!==d;){if(d.key===k)if(4===d.tag&&d.stateNode.containerInfo===f.containerInfo&&d.stateNode.implementation===f.implementation){c(a,d.sibling);d=e(d,f.children||[]);d.return=a;a=d;break a}else{c(a,d);break}else b(a,d);d=d.sibling}d=
+Wg(f,a.mode,h);d.return=a;a=d}return g(a)}if("string"===typeof f||"number"===typeof f)return f=""+f,null!==d&&6===d.tag?(c(a,d.sibling),d=e(d,f),d.return=a,a=d):(c(a,d),d=Ug(f,a.mode,h),d.return=a,a=d),g(a);if(Pg(f))return x(a,d,f,h);if(La(f))return w(a,d,f,h);l&&Rg(a,f);if("undefined"===typeof f&&!k)switch(a.tag){case 1:case 22:case 0:case 11:case 15:throw Error(y(152,Ra(a.type)||"Component"));}return c(a,d)}}var Yg=Sg(!0),Zg=Sg(!1),$g={},ah=Bf($g),bh=Bf($g),ch=Bf($g);
+function dh(a){if(a===$g)throw Error(y(174));return a}function eh(a,b){I(ch,b);I(bh,a);I(ah,$g);a=b.nodeType;switch(a){case 9:case 11:b=(b=b.documentElement)?b.namespaceURI:mb(null,"");break;default:a=8===a?b.parentNode:b,b=a.namespaceURI||null,a=a.tagName,b=mb(b,a)}H(ah);I(ah,b)}function fh(){H(ah);H(bh);H(ch)}function gh(a){dh(ch.current);var b=dh(ah.current);var c=mb(b,a.type);b!==c&&(I(bh,a),I(ah,c))}function hh(a){bh.current===a&&(H(ah),H(bh))}var P=Bf(0);
+function ih(a){for(var b=a;null!==b;){if(13===b.tag){var c=b.memoizedState;if(null!==c&&(c=c.dehydrated,null===c||"$?"===c.data||"$!"===c.data))return b}else if(19===b.tag&&void 0!==b.memoizedProps.revealOrder){if(0!==(b.flags&64))return b}else if(null!==b.child){b.child.return=b;b=b.child;continue}if(b===a)break;for(;null===b.sibling;){if(null===b.return||b.return===a)return null;b=b.return}b.sibling.return=b.return;b=b.sibling}return null}var jh=null,kh=null,lh=!1;
+function mh(a,b){var c=nh(5,null,null,0);c.elementType="DELETED";c.type="DELETED";c.stateNode=b;c.return=a;c.flags=8;null!==a.lastEffect?(a.lastEffect.nextEffect=c,a.lastEffect=c):a.firstEffect=a.lastEffect=c}function oh(a,b){switch(a.tag){case 5:var c=a.type;b=1!==b.nodeType||c.toLowerCase()!==b.nodeName.toLowerCase()?null:b;return null!==b?(a.stateNode=b,!0):!1;case 6:return b=""===a.pendingProps||3!==b.nodeType?null:b,null!==b?(a.stateNode=b,!0):!1;case 13:return!1;default:return!1}}
+function ph(a){if(lh){var b=kh;if(b){var c=b;if(!oh(a,b)){b=rf(c.nextSibling);if(!b||!oh(a,b)){a.flags=a.flags&-1025|2;lh=!1;jh=a;return}mh(jh,c)}jh=a;kh=rf(b.firstChild)}else a.flags=a.flags&-1025|2,lh=!1,jh=a}}function qh(a){for(a=a.return;null!==a&&5!==a.tag&&3!==a.tag&&13!==a.tag;)a=a.return;jh=a}
+function rh(a){if(a!==jh)return!1;if(!lh)return qh(a),lh=!0,!1;var b=a.type;if(5!==a.tag||"head"!==b&&"body"!==b&&!nf(b,a.memoizedProps))for(b=kh;b;)mh(a,b),b=rf(b.nextSibling);qh(a);if(13===a.tag){a=a.memoizedState;a=null!==a?a.dehydrated:null;if(!a)throw Error(y(317));a:{a=a.nextSibling;for(b=0;a;){if(8===a.nodeType){var c=a.data;if("/$"===c){if(0===b){kh=rf(a.nextSibling);break a}b--}else"$"!==c&&"$!"!==c&&"$?"!==c||b++}a=a.nextSibling}kh=null}}else kh=jh?rf(a.stateNode.nextSibling):null;return!0}
+function sh(){kh=jh=null;lh=!1}var th=[];function uh(){for(var a=0;a<th.length;a++)th[a]._workInProgressVersionPrimary=null;th.length=0}var vh=ra.ReactCurrentDispatcher,wh=ra.ReactCurrentBatchConfig,xh=0,R=null,S=null,T=null,yh=!1,zh=!1;function Ah(){throw Error(y(321));}function Bh(a,b){if(null===b)return!1;for(var c=0;c<b.length&&c<a.length;c++)if(!He(a[c],b[c]))return!1;return!0}
+function Ch(a,b,c,d,e,f){xh=f;R=b;b.memoizedState=null;b.updateQueue=null;b.lanes=0;vh.current=null===a||null===a.memoizedState?Dh:Eh;a=c(d,e);if(zh){f=0;do{zh=!1;if(!(25>f))throw Error(y(301));f+=1;T=S=null;b.updateQueue=null;vh.current=Fh;a=c(d,e)}while(zh)}vh.current=Gh;b=null!==S&&null!==S.next;xh=0;T=S=R=null;yh=!1;if(b)throw Error(y(300));return a}function Hh(){var a={memoizedState:null,baseState:null,baseQueue:null,queue:null,next:null};null===T?R.memoizedState=T=a:T=T.next=a;return T}
+function Ih(){if(null===S){var a=R.alternate;a=null!==a?a.memoizedState:null}else a=S.next;var b=null===T?R.memoizedState:T.next;if(null!==b)T=b,S=a;else{if(null===a)throw Error(y(310));S=a;a={memoizedState:S.memoizedState,baseState:S.baseState,baseQueue:S.baseQueue,queue:S.queue,next:null};null===T?R.memoizedState=T=a:T=T.next=a}return T}function Jh(a,b){return"function"===typeof b?b(a):b}
+function Kh(a){var b=Ih(),c=b.queue;if(null===c)throw Error(y(311));c.lastRenderedReducer=a;var d=S,e=d.baseQueue,f=c.pending;if(null!==f){if(null!==e){var g=e.next;e.next=f.next;f.next=g}d.baseQueue=e=f;c.pending=null}if(null!==e){e=e.next;d=d.baseState;var h=g=f=null,k=e;do{var l=k.lane;if((xh&l)===l)null!==h&&(h=h.next={lane:0,action:k.action,eagerReducer:k.eagerReducer,eagerState:k.eagerState,next:null}),d=k.eagerReducer===a?k.eagerState:a(d,k.action);else{var n={lane:l,action:k.action,eagerReducer:k.eagerReducer,
+eagerState:k.eagerState,next:null};null===h?(g=h=n,f=d):h=h.next=n;R.lanes|=l;Dg|=l}k=k.next}while(null!==k&&k!==e);null===h?f=d:h.next=g;He(d,b.memoizedState)||(ug=!0);b.memoizedState=d;b.baseState=f;b.baseQueue=h;c.lastRenderedState=d}return[b.memoizedState,c.dispatch]}
+function Lh(a){var b=Ih(),c=b.queue;if(null===c)throw Error(y(311));c.lastRenderedReducer=a;var d=c.dispatch,e=c.pending,f=b.memoizedState;if(null!==e){c.pending=null;var g=e=e.next;do f=a(f,g.action),g=g.next;while(g!==e);He(f,b.memoizedState)||(ug=!0);b.memoizedState=f;null===b.baseQueue&&(b.baseState=f);c.lastRenderedState=f}return[f,d]}
+function Mh(a,b,c){var d=b._getVersion;d=d(b._source);var e=b._workInProgressVersionPrimary;if(null!==e)a=e===d;else if(a=a.mutableReadLanes,a=(xh&a)===a)b._workInProgressVersionPrimary=d,th.push(b);if(a)return c(b._source);th.push(b);throw Error(y(350));}
+function Nh(a,b,c,d){var e=U;if(null===e)throw Error(y(349));var f=b._getVersion,g=f(b._source),h=vh.current,k=h.useState(function(){return Mh(e,b,c)}),l=k[1],n=k[0];k=T;var A=a.memoizedState,p=A.refs,C=p.getSnapshot,x=A.source;A=A.subscribe;var w=R;a.memoizedState={refs:p,source:b,subscribe:d};h.useEffect(function(){p.getSnapshot=c;p.setSnapshot=l;var a=f(b._source);if(!He(g,a)){a=c(b._source);He(n,a)||(l(a),a=Ig(w),e.mutableReadLanes|=a&e.pendingLanes);a=e.mutableReadLanes;e.entangledLanes|=a;for(var d=
+e.entanglements,h=a;0<h;){var k=31-Vc(h),v=1<<k;d[k]|=a;h&=~v}}},[c,b,d]);h.useEffect(function(){return d(b._source,function(){var a=p.getSnapshot,c=p.setSnapshot;try{c(a(b._source));var d=Ig(w);e.mutableReadLanes|=d&e.pendingLanes}catch(q){c(function(){throw q;})}})},[b,d]);He(C,c)&&He(x,b)&&He(A,d)||(a={pending:null,dispatch:null,lastRenderedReducer:Jh,lastRenderedState:n},a.dispatch=l=Oh.bind(null,R,a),k.queue=a,k.baseQueue=null,n=Mh(e,b,c),k.memoizedState=k.baseState=n);return n}
+function Ph(a,b,c){var d=Ih();return Nh(d,a,b,c)}function Qh(a){var b=Hh();"function"===typeof a&&(a=a());b.memoizedState=b.baseState=a;a=b.queue={pending:null,dispatch:null,lastRenderedReducer:Jh,lastRenderedState:a};a=a.dispatch=Oh.bind(null,R,a);return[b.memoizedState,a]}
+function Rh(a,b,c,d){a={tag:a,create:b,destroy:c,deps:d,next:null};b=R.updateQueue;null===b?(b={lastEffect:null},R.updateQueue=b,b.lastEffect=a.next=a):(c=b.lastEffect,null===c?b.lastEffect=a.next=a:(d=c.next,c.next=a,a.next=d,b.lastEffect=a));return a}function Sh(a){var b=Hh();a={current:a};return b.memoizedState=a}function Th(){return Ih().memoizedState}function Uh(a,b,c,d){var e=Hh();R.flags|=a;e.memoizedState=Rh(1|b,c,void 0,void 0===d?null:d)}
+function Vh(a,b,c,d){var e=Ih();d=void 0===d?null:d;var f=void 0;if(null!==S){var g=S.memoizedState;f=g.destroy;if(null!==d&&Bh(d,g.deps)){Rh(b,c,f,d);return}}R.flags|=a;e.memoizedState=Rh(1|b,c,f,d)}function Wh(a,b){return Uh(516,4,a,b)}function Xh(a,b){return Vh(516,4,a,b)}function Yh(a,b){return Vh(4,2,a,b)}function Zh(a,b){if("function"===typeof b)return a=a(),b(a),function(){b(null)};if(null!==b&&void 0!==b)return a=a(),b.current=a,function(){b.current=null}}
+function $h(a,b,c){c=null!==c&&void 0!==c?c.concat([a]):null;return Vh(4,2,Zh.bind(null,b,a),c)}function ai(){}function bi(a,b){var c=Ih();b=void 0===b?null:b;var d=c.memoizedState;if(null!==d&&null!==b&&Bh(b,d[1]))return d[0];c.memoizedState=[a,b];return a}function ci(a,b){var c=Ih();b=void 0===b?null:b;var d=c.memoizedState;if(null!==d&&null!==b&&Bh(b,d[1]))return d[0];a=a();c.memoizedState=[a,b];return a}
+function di(a,b){var c=eg();gg(98>c?98:c,function(){a(!0)});gg(97<c?97:c,function(){var c=wh.transition;wh.transition=1;try{a(!1),b()}finally{wh.transition=c}})}
+function Oh(a,b,c){var d=Hg(),e=Ig(a),f={lane:e,action:c,eagerReducer:null,eagerState:null,next:null},g=b.pending;null===g?f.next=f:(f.next=g.next,g.next=f);b.pending=f;g=a.alternate;if(a===R||null!==g&&g===R)zh=yh=!0;else{if(0===a.lanes&&(null===g||0===g.lanes)&&(g=b.lastRenderedReducer,null!==g))try{var h=b.lastRenderedState,k=g(h,c);f.eagerReducer=g;f.eagerState=k;if(He(k,h))return}catch(l){}finally{}Jg(a,e,d)}}
+var Gh={readContext:vg,useCallback:Ah,useContext:Ah,useEffect:Ah,useImperativeHandle:Ah,useLayoutEffect:Ah,useMemo:Ah,useReducer:Ah,useRef:Ah,useState:Ah,useDebugValue:Ah,useDeferredValue:Ah,useTransition:Ah,useMutableSource:Ah,useOpaqueIdentifier:Ah,unstable_isNewReconciler:!1},Dh={readContext:vg,useCallback:function(a,b){Hh().memoizedState=[a,void 0===b?null:b];return a},useContext:vg,useEffect:Wh,useImperativeHandle:function(a,b,c){c=null!==c&&void 0!==c?c.concat([a]):null;return Uh(4,2,Zh.bind(null,
+b,a),c)},useLayoutEffect:function(a,b){return Uh(4,2,a,b)},useMemo:function(a,b){var c=Hh();b=void 0===b?null:b;a=a();c.memoizedState=[a,b];return a},useReducer:function(a,b,c){var d=Hh();b=void 0!==c?c(b):b;d.memoizedState=d.baseState=b;a=d.queue={pending:null,dispatch:null,lastRenderedReducer:a,lastRenderedState:b};a=a.dispatch=Oh.bind(null,R,a);return[d.memoizedState,a]},useRef:Sh,useState:Qh,useDebugValue:ai,useDeferredValue:function(a){var b=Qh(a),c=b[0],d=b[1];Wh(function(){var b=wh.transition;
+wh.transition=1;try{d(a)}finally{wh.transition=b}},[a]);return c},useTransition:function(){var a=Qh(!1),b=a[0];a=di.bind(null,a[1]);Sh(a);return[a,b]},useMutableSource:function(a,b,c){var d=Hh();d.memoizedState={refs:{getSnapshot:b,setSnapshot:null},source:a,subscribe:c};return Nh(d,a,b,c)},useOpaqueIdentifier:function(){if(lh){var a=!1,b=uf(function(){a||(a=!0,c("r:"+(tf++).toString(36)));throw Error(y(355));}),c=Qh(b)[1];0===(R.mode&2)&&(R.flags|=516,Rh(5,function(){c("r:"+(tf++).toString(36))},
+void 0,null));return b}b="r:"+(tf++).toString(36);Qh(b);return b},unstable_isNewReconciler:!1},Eh={readContext:vg,useCallback:bi,useContext:vg,useEffect:Xh,useImperativeHandle:$h,useLayoutEffect:Yh,useMemo:ci,useReducer:Kh,useRef:Th,useState:function(){return Kh(Jh)},useDebugValue:ai,useDeferredValue:function(a){var b=Kh(Jh),c=b[0],d=b[1];Xh(function(){var b=wh.transition;wh.transition=1;try{d(a)}finally{wh.transition=b}},[a]);return c},useTransition:function(){var a=Kh(Jh)[0];return[Th().current,
+a]},useMutableSource:Ph,useOpaqueIdentifier:function(){return Kh(Jh)[0]},unstable_isNewReconciler:!1},Fh={readContext:vg,useCallback:bi,useContext:vg,useEffect:Xh,useImperativeHandle:$h,useLayoutEffect:Yh,useMemo:ci,useReducer:Lh,useRef:Th,useState:function(){return Lh(Jh)},useDebugValue:ai,useDeferredValue:function(a){var b=Lh(Jh),c=b[0],d=b[1];Xh(function(){var b=wh.transition;wh.transition=1;try{d(a)}finally{wh.transition=b}},[a]);return c},useTransition:function(){var a=Lh(Jh)[0];return[Th().current,
+a]},useMutableSource:Ph,useOpaqueIdentifier:function(){return Lh(Jh)[0]},unstable_isNewReconciler:!1},ei=ra.ReactCurrentOwner,ug=!1;function fi(a,b,c,d){b.child=null===a?Zg(b,null,c,d):Yg(b,a.child,c,d)}function gi(a,b,c,d,e){c=c.render;var f=b.ref;tg(b,e);d=Ch(a,b,c,d,f,e);if(null!==a&&!ug)return b.updateQueue=a.updateQueue,b.flags&=-517,a.lanes&=~e,hi(a,b,e);b.flags|=1;fi(a,b,d,e);return b.child}
+function ii(a,b,c,d,e,f){if(null===a){var g=c.type;if("function"===typeof g&&!ji(g)&&void 0===g.defaultProps&&null===c.compare&&void 0===c.defaultProps)return b.tag=15,b.type=g,ki(a,b,g,d,e,f);a=Vg(c.type,null,d,b,b.mode,f);a.ref=b.ref;a.return=b;return b.child=a}g=a.child;if(0===(e&f)&&(e=g.memoizedProps,c=c.compare,c=null!==c?c:Je,c(e,d)&&a.ref===b.ref))return hi(a,b,f);b.flags|=1;a=Tg(g,d);a.ref=b.ref;a.return=b;return b.child=a}
+function ki(a,b,c,d,e,f){if(null!==a&&Je(a.memoizedProps,d)&&a.ref===b.ref)if(ug=!1,0!==(f&e))0!==(a.flags&16384)&&(ug=!0);else return b.lanes=a.lanes,hi(a,b,f);return li(a,b,c,d,f)}
+function mi(a,b,c){var d=b.pendingProps,e=d.children,f=null!==a?a.memoizedState:null;if("hidden"===d.mode||"unstable-defer-without-hiding"===d.mode)if(0===(b.mode&4))b.memoizedState={baseLanes:0},ni(b,c);else if(0!==(c&1073741824))b.memoizedState={baseLanes:0},ni(b,null!==f?f.baseLanes:c);else return a=null!==f?f.baseLanes|c:c,b.lanes=b.childLanes=1073741824,b.memoizedState={baseLanes:a},ni(b,a),null;else null!==f?(d=f.baseLanes|c,b.memoizedState=null):d=c,ni(b,d);fi(a,b,e,c);return b.child}
+function oi(a,b){var c=b.ref;if(null===a&&null!==c||null!==a&&a.ref!==c)b.flags|=128}function li(a,b,c,d,e){var f=Ff(c)?Df:M.current;f=Ef(b,f);tg(b,e);c=Ch(a,b,c,d,f,e);if(null!==a&&!ug)return b.updateQueue=a.updateQueue,b.flags&=-517,a.lanes&=~e,hi(a,b,e);b.flags|=1;fi(a,b,c,e);return b.child}
+function pi(a,b,c,d,e){if(Ff(c)){var f=!0;Jf(b)}else f=!1;tg(b,e);if(null===b.stateNode)null!==a&&(a.alternate=null,b.alternate=null,b.flags|=2),Mg(b,c,d),Og(b,c,d,e),d=!0;else if(null===a){var g=b.stateNode,h=b.memoizedProps;g.props=h;var k=g.context,l=c.contextType;"object"===typeof l&&null!==l?l=vg(l):(l=Ff(c)?Df:M.current,l=Ef(b,l));var n=c.getDerivedStateFromProps,A="function"===typeof n||"function"===typeof g.getSnapshotBeforeUpdate;A||"function"!==typeof g.UNSAFE_componentWillReceiveProps&&
+"function"!==typeof g.componentWillReceiveProps||(h!==d||k!==l)&&Ng(b,g,d,l);wg=!1;var p=b.memoizedState;g.state=p;Cg(b,d,g,e);k=b.memoizedState;h!==d||p!==k||N.current||wg?("function"===typeof n&&(Gg(b,c,n,d),k=b.memoizedState),(h=wg||Lg(b,c,h,d,p,k,l))?(A||"function"!==typeof g.UNSAFE_componentWillMount&&"function"!==typeof g.componentWillMount||("function"===typeof g.componentWillMount&&g.componentWillMount(),"function"===typeof g.UNSAFE_componentWillMount&&g.UNSAFE_componentWillMount()),"function"===
+typeof g.componentDidMount&&(b.flags|=4)):("function"===typeof g.componentDidMount&&(b.flags|=4),b.memoizedProps=d,b.memoizedState=k),g.props=d,g.state=k,g.context=l,d=h):("function"===typeof g.componentDidMount&&(b.flags|=4),d=!1)}else{g=b.stateNode;yg(a,b);h=b.memoizedProps;l=b.type===b.elementType?h:lg(b.type,h);g.props=l;A=b.pendingProps;p=g.context;k=c.contextType;"object"===typeof k&&null!==k?k=vg(k):(k=Ff(c)?Df:M.current,k=Ef(b,k));var C=c.getDerivedStateFromProps;(n="function"===typeof C||
+"function"===typeof g.getSnapshotBeforeUpdate)||"function"!==typeof g.UNSAFE_componentWillReceiveProps&&"function"!==typeof g.componentWillReceiveProps||(h!==A||p!==k)&&Ng(b,g,d,k);wg=!1;p=b.memoizedState;g.state=p;Cg(b,d,g,e);var x=b.memoizedState;h!==A||p!==x||N.current||wg?("function"===typeof C&&(Gg(b,c,C,d),x=b.memoizedState),(l=wg||Lg(b,c,l,d,p,x,k))?(n||"function"!==typeof g.UNSAFE_componentWillUpdate&&"function"!==typeof g.componentWillUpdate||("function"===typeof g.componentWillUpdate&&g.componentWillUpdate(d,
+x,k),"function"===typeof g.UNSAFE_componentWillUpdate&&g.UNSAFE_componentWillUpdate(d,x,k)),"function"===typeof g.componentDidUpdate&&(b.flags|=4),"function"===typeof g.getSnapshotBeforeUpdate&&(b.flags|=256)):("function"!==typeof g.componentDidUpdate||h===a.memoizedProps&&p===a.memoizedState||(b.flags|=4),"function"!==typeof g.getSnapshotBeforeUpdate||h===a.memoizedProps&&p===a.memoizedState||(b.flags|=256),b.memoizedProps=d,b.memoizedState=x),g.props=d,g.state=x,g.context=k,d=l):("function"!==typeof g.componentDidUpdate||
+h===a.memoizedProps&&p===a.memoizedState||(b.flags|=4),"function"!==typeof g.getSnapshotBeforeUpdate||h===a.memoizedProps&&p===a.memoizedState||(b.flags|=256),d=!1)}return qi(a,b,c,d,f,e)}
+function qi(a,b,c,d,e,f){oi(a,b);var g=0!==(b.flags&64);if(!d&&!g)return e&&Kf(b,c,!1),hi(a,b,f);d=b.stateNode;ei.current=b;var h=g&&"function"!==typeof c.getDerivedStateFromError?null:d.render();b.flags|=1;null!==a&&g?(b.child=Yg(b,a.child,null,f),b.child=Yg(b,null,h,f)):fi(a,b,h,f);b.memoizedState=d.state;e&&Kf(b,c,!0);return b.child}function ri(a){var b=a.stateNode;b.pendingContext?Hf(a,b.pendingContext,b.pendingContext!==b.context):b.context&&Hf(a,b.context,!1);eh(a,b.containerInfo)}
+var si={dehydrated:null,retryLane:0};
+function ti(a,b,c){var d=b.pendingProps,e=P.current,f=!1,g;(g=0!==(b.flags&64))||(g=null!==a&&null===a.memoizedState?!1:0!==(e&2));g?(f=!0,b.flags&=-65):null!==a&&null===a.memoizedState||void 0===d.fallback||!0===d.unstable_avoidThisFallback||(e|=1);I(P,e&1);if(null===a){void 0!==d.fallback&&ph(b);a=d.children;e=d.fallback;if(f)return a=ui(b,a,e,c),b.child.memoizedState={baseLanes:c},b.memoizedState=si,a;if("number"===typeof d.unstable_expectedLoadTime)return a=ui(b,a,e,c),b.child.memoizedState={baseLanes:c},
+b.memoizedState=si,b.lanes=33554432,a;c=vi({mode:"visible",children:a},b.mode,c,null);c.return=b;return b.child=c}if(null!==a.memoizedState){if(f)return d=wi(a,b,d.children,d.fallback,c),f=b.child,e=a.child.memoizedState,f.memoizedState=null===e?{baseLanes:c}:{baseLanes:e.baseLanes|c},f.childLanes=a.childLanes&~c,b.memoizedState=si,d;c=xi(a,b,d.children,c);b.memoizedState=null;return c}if(f)return d=wi(a,b,d.children,d.fallback,c),f=b.child,e=a.child.memoizedState,f.memoizedState=null===e?{baseLanes:c}:
+{baseLanes:e.baseLanes|c},f.childLanes=a.childLanes&~c,b.memoizedState=si,d;c=xi(a,b,d.children,c);b.memoizedState=null;return c}function ui(a,b,c,d){var e=a.mode,f=a.child;b={mode:"hidden",children:b};0===(e&2)&&null!==f?(f.childLanes=0,f.pendingProps=b):f=vi(b,e,0,null);c=Xg(c,e,d,null);f.return=a;c.return=a;f.sibling=c;a.child=f;return c}
+function xi(a,b,c,d){var e=a.child;a=e.sibling;c=Tg(e,{mode:"visible",children:c});0===(b.mode&2)&&(c.lanes=d);c.return=b;c.sibling=null;null!==a&&(a.nextEffect=null,a.flags=8,b.firstEffect=b.lastEffect=a);return b.child=c}
+function wi(a,b,c,d,e){var f=b.mode,g=a.child;a=g.sibling;var h={mode:"hidden",children:c};0===(f&2)&&b.child!==g?(c=b.child,c.childLanes=0,c.pendingProps=h,g=c.lastEffect,null!==g?(b.firstEffect=c.firstEffect,b.lastEffect=g,g.nextEffect=null):b.firstEffect=b.lastEffect=null):c=Tg(g,h);null!==a?d=Tg(a,d):(d=Xg(d,f,e,null),d.flags|=2);d.return=b;c.return=b;c.sibling=d;b.child=c;return d}function yi(a,b){a.lanes|=b;var c=a.alternate;null!==c&&(c.lanes|=b);sg(a.return,b)}
+function zi(a,b,c,d,e,f){var g=a.memoizedState;null===g?a.memoizedState={isBackwards:b,rendering:null,renderingStartTime:0,last:d,tail:c,tailMode:e,lastEffect:f}:(g.isBackwards=b,g.rendering=null,g.renderingStartTime=0,g.last=d,g.tail=c,g.tailMode=e,g.lastEffect=f)}
+function Ai(a,b,c){var d=b.pendingProps,e=d.revealOrder,f=d.tail;fi(a,b,d.children,c);d=P.current;if(0!==(d&2))d=d&1|2,b.flags|=64;else{if(null!==a&&0!==(a.flags&64))a:for(a=b.child;null!==a;){if(13===a.tag)null!==a.memoizedState&&yi(a,c);else if(19===a.tag)yi(a,c);else if(null!==a.child){a.child.return=a;a=a.child;continue}if(a===b)break a;for(;null===a.sibling;){if(null===a.return||a.return===b)break a;a=a.return}a.sibling.return=a.return;a=a.sibling}d&=1}I(P,d);if(0===(b.mode&2))b.memoizedState=
+null;else switch(e){case "forwards":c=b.child;for(e=null;null!==c;)a=c.alternate,null!==a&&null===ih(a)&&(e=c),c=c.sibling;c=e;null===c?(e=b.child,b.child=null):(e=c.sibling,c.sibling=null);zi(b,!1,e,c,f,b.lastEffect);break;case "backwards":c=null;e=b.child;for(b.child=null;null!==e;){a=e.alternate;if(null!==a&&null===ih(a)){b.child=e;break}a=e.sibling;e.sibling=c;c=e;e=a}zi(b,!0,c,null,f,b.lastEffect);break;case "together":zi(b,!1,null,null,void 0,b.lastEffect);break;default:b.memoizedState=null}return b.child}
+function hi(a,b,c){null!==a&&(b.dependencies=a.dependencies);Dg|=b.lanes;if(0!==(c&b.childLanes)){if(null!==a&&b.child!==a.child)throw Error(y(153));if(null!==b.child){a=b.child;c=Tg(a,a.pendingProps);b.child=c;for(c.return=b;null!==a.sibling;)a=a.sibling,c=c.sibling=Tg(a,a.pendingProps),c.return=b;c.sibling=null}return b.child}return null}var Bi,Ci,Di,Ei;
+Bi=function(a,b){for(var c=b.child;null!==c;){if(5===c.tag||6===c.tag)a.appendChild(c.stateNode);else if(4!==c.tag&&null!==c.child){c.child.return=c;c=c.child;continue}if(c===b)break;for(;null===c.sibling;){if(null===c.return||c.return===b)return;c=c.return}c.sibling.return=c.return;c=c.sibling}};Ci=function(){};
+Di=function(a,b,c,d){var e=a.memoizedProps;if(e!==d){a=b.stateNode;dh(ah.current);var f=null;switch(c){case "input":e=Ya(a,e);d=Ya(a,d);f=[];break;case "option":e=eb(a,e);d=eb(a,d);f=[];break;case "select":e=m({},e,{value:void 0});d=m({},d,{value:void 0});f=[];break;case "textarea":e=gb(a,e);d=gb(a,d);f=[];break;default:"function"!==typeof e.onClick&&"function"===typeof d.onClick&&(a.onclick=jf)}vb(c,d);var g;c=null;for(l in e)if(!d.hasOwnProperty(l)&&e.hasOwnProperty(l)&&null!=e[l])if("style"===
+l){var h=e[l];for(g in h)h.hasOwnProperty(g)&&(c||(c={}),c[g]="")}else"dangerouslySetInnerHTML"!==l&&"children"!==l&&"suppressContentEditableWarning"!==l&&"suppressHydrationWarning"!==l&&"autoFocus"!==l&&(ca.hasOwnProperty(l)?f||(f=[]):(f=f||[]).push(l,null));for(l in d){var k=d[l];h=null!=e?e[l]:void 0;if(d.hasOwnProperty(l)&&k!==h&&(null!=k||null!=h))if("style"===l)if(h){for(g in h)!h.hasOwnProperty(g)||k&&k.hasOwnProperty(g)||(c||(c={}),c[g]="");for(g in k)k.hasOwnProperty(g)&&h[g]!==k[g]&&(c||
+(c={}),c[g]=k[g])}else c||(f||(f=[]),f.push(l,c)),c=k;else"dangerouslySetInnerHTML"===l?(k=k?k.__html:void 0,h=h?h.__html:void 0,null!=k&&h!==k&&(f=f||[]).push(l,k)):"children"===l?"string"!==typeof k&&"number"!==typeof k||(f=f||[]).push(l,""+k):"suppressContentEditableWarning"!==l&&"suppressHydrationWarning"!==l&&(ca.hasOwnProperty(l)?(null!=k&&"onScroll"===l&&G("scroll",a),f||h===k||(f=[])):"object"===typeof k&&null!==k&&k.$$typeof===Ga?k.toString():(f=f||[]).push(l,k))}c&&(f=f||[]).push("style",
+c);var l=f;if(b.updateQueue=l)b.flags|=4}};Ei=function(a,b,c,d){c!==d&&(b.flags|=4)};function Fi(a,b){if(!lh)switch(a.tailMode){case "hidden":b=a.tail;for(var c=null;null!==b;)null!==b.alternate&&(c=b),b=b.sibling;null===c?a.tail=null:c.sibling=null;break;case "collapsed":c=a.tail;for(var d=null;null!==c;)null!==c.alternate&&(d=c),c=c.sibling;null===d?b||null===a.tail?a.tail=null:a.tail.sibling=null:d.sibling=null}}
+function Gi(a,b,c){var d=b.pendingProps;switch(b.tag){case 2:case 16:case 15:case 0:case 11:case 7:case 8:case 12:case 9:case 14:return null;case 1:return Ff(b.type)&&Gf(),null;case 3:fh();H(N);H(M);uh();d=b.stateNode;d.pendingContext&&(d.context=d.pendingContext,d.pendingContext=null);if(null===a||null===a.child)rh(b)?b.flags|=4:d.hydrate||(b.flags|=256);Ci(b);return null;case 5:hh(b);var e=dh(ch.current);c=b.type;if(null!==a&&null!=b.stateNode)Di(a,b,c,d,e),a.ref!==b.ref&&(b.flags|=128);else{if(!d){if(null===
+b.stateNode)throw Error(y(166));return null}a=dh(ah.current);if(rh(b)){d=b.stateNode;c=b.type;var f=b.memoizedProps;d[wf]=b;d[xf]=f;switch(c){case "dialog":G("cancel",d);G("close",d);break;case "iframe":case "object":case "embed":G("load",d);break;case "video":case "audio":for(a=0;a<Xe.length;a++)G(Xe[a],d);break;case "source":G("error",d);break;case "img":case "image":case "link":G("error",d);G("load",d);break;case "details":G("toggle",d);break;case "input":Za(d,f);G("invalid",d);break;case "select":d._wrapperState=
+{wasMultiple:!!f.multiple};G("invalid",d);break;case "textarea":hb(d,f),G("invalid",d)}vb(c,f);a=null;for(var g in f)f.hasOwnProperty(g)&&(e=f[g],"children"===g?"string"===typeof e?d.textContent!==e&&(a=["children",e]):"number"===typeof e&&d.textContent!==""+e&&(a=["children",""+e]):ca.hasOwnProperty(g)&&null!=e&&"onScroll"===g&&G("scroll",d));switch(c){case "input":Va(d);cb(d,f,!0);break;case "textarea":Va(d);jb(d);break;case "select":case "option":break;default:"function"===typeof f.onClick&&(d.onclick=
+jf)}d=a;b.updateQueue=d;null!==d&&(b.flags|=4)}else{g=9===e.nodeType?e:e.ownerDocument;a===kb.html&&(a=lb(c));a===kb.html?"script"===c?(a=g.createElement("div"),a.innerHTML="<script>\x3c/script>",a=a.removeChild(a.firstChild)):"string"===typeof d.is?a=g.createElement(c,{is:d.is}):(a=g.createElement(c),"select"===c&&(g=a,d.multiple?g.multiple=!0:d.size&&(g.size=d.size))):a=g.createElementNS(a,c);a[wf]=b;a[xf]=d;Bi(a,b,!1,!1);b.stateNode=a;g=wb(c,d);switch(c){case "dialog":G("cancel",a);G("close",a);
+e=d;break;case "iframe":case "object":case "embed":G("load",a);e=d;break;case "video":case "audio":for(e=0;e<Xe.length;e++)G(Xe[e],a);e=d;break;case "source":G("error",a);e=d;break;case "img":case "image":case "link":G("error",a);G("load",a);e=d;break;case "details":G("toggle",a);e=d;break;case "input":Za(a,d);e=Ya(a,d);G("invalid",a);break;case "option":e=eb(a,d);break;case "select":a._wrapperState={wasMultiple:!!d.multiple};e=m({},d,{value:void 0});G("invalid",a);break;case "textarea":hb(a,d);e=
+gb(a,d);G("invalid",a);break;default:e=d}vb(c,e);var h=e;for(f in h)if(h.hasOwnProperty(f)){var k=h[f];"style"===f?tb(a,k):"dangerouslySetInnerHTML"===f?(k=k?k.__html:void 0,null!=k&&ob(a,k)):"children"===f?"string"===typeof k?("textarea"!==c||""!==k)&&pb(a,k):"number"===typeof k&&pb(a,""+k):"suppressContentEditableWarning"!==f&&"suppressHydrationWarning"!==f&&"autoFocus"!==f&&(ca.hasOwnProperty(f)?null!=k&&"onScroll"===f&&G("scroll",a):null!=k&&qa(a,f,k,g))}switch(c){case "input":Va(a);cb(a,d,!1);
+break;case "textarea":Va(a);jb(a);break;case "option":null!=d.value&&a.setAttribute("value",""+Sa(d.value));break;case "select":a.multiple=!!d.multiple;f=d.value;null!=f?fb(a,!!d.multiple,f,!1):null!=d.defaultValue&&fb(a,!!d.multiple,d.defaultValue,!0);break;default:"function"===typeof e.onClick&&(a.onclick=jf)}mf(c,d)&&(b.flags|=4)}null!==b.ref&&(b.flags|=128)}return null;case 6:if(a&&null!=b.stateNode)Ei(a,b,a.memoizedProps,d);else{if("string"!==typeof d&&null===b.stateNode)throw Error(y(166));
+c=dh(ch.current);dh(ah.current);rh(b)?(d=b.stateNode,c=b.memoizedProps,d[wf]=b,d.nodeValue!==c&&(b.flags|=4)):(d=(9===c.nodeType?c:c.ownerDocument).createTextNode(d),d[wf]=b,b.stateNode=d)}return null;case 13:H(P);d=b.memoizedState;if(0!==(b.flags&64))return b.lanes=c,b;d=null!==d;c=!1;null===a?void 0!==b.memoizedProps.fallback&&rh(b):c=null!==a.memoizedState;if(d&&!c&&0!==(b.mode&2))if(null===a&&!0!==b.memoizedProps.unstable_avoidThisFallback||0!==(P.current&1))0===V&&(V=3);else{if(0===V||3===V)V=
+4;null===U||0===(Dg&134217727)&&0===(Hi&134217727)||Ii(U,W)}if(d||c)b.flags|=4;return null;case 4:return fh(),Ci(b),null===a&&cf(b.stateNode.containerInfo),null;case 10:return rg(b),null;case 17:return Ff(b.type)&&Gf(),null;case 19:H(P);d=b.memoizedState;if(null===d)return null;f=0!==(b.flags&64);g=d.rendering;if(null===g)if(f)Fi(d,!1);else{if(0!==V||null!==a&&0!==(a.flags&64))for(a=b.child;null!==a;){g=ih(a);if(null!==g){b.flags|=64;Fi(d,!1);f=g.updateQueue;null!==f&&(b.updateQueue=f,b.flags|=4);
+null===d.lastEffect&&(b.firstEffect=null);b.lastEffect=d.lastEffect;d=c;for(c=b.child;null!==c;)f=c,a=d,f.flags&=2,f.nextEffect=null,f.firstEffect=null,f.lastEffect=null,g=f.alternate,null===g?(f.childLanes=0,f.lanes=a,f.child=null,f.memoizedProps=null,f.memoizedState=null,f.updateQueue=null,f.dependencies=null,f.stateNode=null):(f.childLanes=g.childLanes,f.lanes=g.lanes,f.child=g.child,f.memoizedProps=g.memoizedProps,f.memoizedState=g.memoizedState,f.updateQueue=g.updateQueue,f.type=g.type,a=g.dependencies,
+f.dependencies=null===a?null:{lanes:a.lanes,firstContext:a.firstContext}),c=c.sibling;I(P,P.current&1|2);return b.child}a=a.sibling}null!==d.tail&&O()>Ji&&(b.flags|=64,f=!0,Fi(d,!1),b.lanes=33554432)}else{if(!f)if(a=ih(g),null!==a){if(b.flags|=64,f=!0,c=a.updateQueue,null!==c&&(b.updateQueue=c,b.flags|=4),Fi(d,!0),null===d.tail&&"hidden"===d.tailMode&&!g.alternate&&!lh)return b=b.lastEffect=d.lastEffect,null!==b&&(b.nextEffect=null),null}else 2*O()-d.renderingStartTime>Ji&&1073741824!==c&&(b.flags|=
+64,f=!0,Fi(d,!1),b.lanes=33554432);d.isBackwards?(g.sibling=b.child,b.child=g):(c=d.last,null!==c?c.sibling=g:b.child=g,d.last=g)}return null!==d.tail?(c=d.tail,d.rendering=c,d.tail=c.sibling,d.lastEffect=b.lastEffect,d.renderingStartTime=O(),c.sibling=null,b=P.current,I(P,f?b&1|2:b&1),c):null;case 23:case 24:return Ki(),null!==a&&null!==a.memoizedState!==(null!==b.memoizedState)&&"unstable-defer-without-hiding"!==d.mode&&(b.flags|=4),null}throw Error(y(156,b.tag));}
+function Li(a){switch(a.tag){case 1:Ff(a.type)&&Gf();var b=a.flags;return b&4096?(a.flags=b&-4097|64,a):null;case 3:fh();H(N);H(M);uh();b=a.flags;if(0!==(b&64))throw Error(y(285));a.flags=b&-4097|64;return a;case 5:return hh(a),null;case 13:return H(P),b=a.flags,b&4096?(a.flags=b&-4097|64,a):null;case 19:return H(P),null;case 4:return fh(),null;case 10:return rg(a),null;case 23:case 24:return Ki(),null;default:return null}}
+function Mi(a,b){try{var c="",d=b;do c+=Qa(d),d=d.return;while(d);var e=c}catch(f){e="\nError generating stack: "+f.message+"\n"+f.stack}return{value:a,source:b,stack:e}}function Ni(a,b){try{console.error(b.value)}catch(c){setTimeout(function(){throw c;})}}var Oi="function"===typeof WeakMap?WeakMap:Map;function Pi(a,b,c){c=zg(-1,c);c.tag=3;c.payload={element:null};var d=b.value;c.callback=function(){Qi||(Qi=!0,Ri=d);Ni(a,b)};return c}
+function Si(a,b,c){c=zg(-1,c);c.tag=3;var d=a.type.getDerivedStateFromError;if("function"===typeof d){var e=b.value;c.payload=function(){Ni(a,b);return d(e)}}var f=a.stateNode;null!==f&&"function"===typeof f.componentDidCatch&&(c.callback=function(){"function"!==typeof d&&(null===Ti?Ti=new Set([this]):Ti.add(this),Ni(a,b));var c=b.stack;this.componentDidCatch(b.value,{componentStack:null!==c?c:""})});return c}var Ui="function"===typeof WeakSet?WeakSet:Set;
+function Vi(a){var b=a.ref;if(null!==b)if("function"===typeof b)try{b(null)}catch(c){Wi(a,c)}else b.current=null}function Xi(a,b){switch(b.tag){case 0:case 11:case 15:case 22:return;case 1:if(b.flags&256&&null!==a){var c=a.memoizedProps,d=a.memoizedState;a=b.stateNode;b=a.getSnapshotBeforeUpdate(b.elementType===b.type?c:lg(b.type,c),d);a.__reactInternalSnapshotBeforeUpdate=b}return;case 3:b.flags&256&&qf(b.stateNode.containerInfo);return;case 5:case 6:case 4:case 17:return}throw Error(y(163));}
+function Yi(a,b,c){switch(c.tag){case 0:case 11:case 15:case 22:b=c.updateQueue;b=null!==b?b.lastEffect:null;if(null!==b){a=b=b.next;do{if(3===(a.tag&3)){var d=a.create;a.destroy=d()}a=a.next}while(a!==b)}b=c.updateQueue;b=null!==b?b.lastEffect:null;if(null!==b){a=b=b.next;do{var e=a;d=e.next;e=e.tag;0!==(e&4)&&0!==(e&1)&&(Zi(c,a),$i(c,a));a=d}while(a!==b)}return;case 1:a=c.stateNode;c.flags&4&&(null===b?a.componentDidMount():(d=c.elementType===c.type?b.memoizedProps:lg(c.type,b.memoizedProps),a.componentDidUpdate(d,
+b.memoizedState,a.__reactInternalSnapshotBeforeUpdate)));b=c.updateQueue;null!==b&&Eg(c,b,a);return;case 3:b=c.updateQueue;if(null!==b){a=null;if(null!==c.child)switch(c.child.tag){case 5:a=c.child.stateNode;break;case 1:a=c.child.stateNode}Eg(c,b,a)}return;case 5:a=c.stateNode;null===b&&c.flags&4&&mf(c.type,c.memoizedProps)&&a.focus();return;case 6:return;case 4:return;case 12:return;case 13:null===c.memoizedState&&(c=c.alternate,null!==c&&(c=c.memoizedState,null!==c&&(c=c.dehydrated,null!==c&&Cc(c))));
+return;case 19:case 17:case 20:case 21:case 23:case 24:return}throw Error(y(163));}
+function aj(a,b){for(var c=a;;){if(5===c.tag){var d=c.stateNode;if(b)d=d.style,"function"===typeof d.setProperty?d.setProperty("display","none","important"):d.display="none";else{d=c.stateNode;var e=c.memoizedProps.style;e=void 0!==e&&null!==e&&e.hasOwnProperty("display")?e.display:null;d.style.display=sb("display",e)}}else if(6===c.tag)c.stateNode.nodeValue=b?"":c.memoizedProps;else if((23!==c.tag&&24!==c.tag||null===c.memoizedState||c===a)&&null!==c.child){c.child.return=c;c=c.child;continue}if(c===
+a)break;for(;null===c.sibling;){if(null===c.return||c.return===a)return;c=c.return}c.sibling.return=c.return;c=c.sibling}}
+function bj(a,b){if(Mf&&"function"===typeof Mf.onCommitFiberUnmount)try{Mf.onCommitFiberUnmount(Lf,b)}catch(f){}switch(b.tag){case 0:case 11:case 14:case 15:case 22:a=b.updateQueue;if(null!==a&&(a=a.lastEffect,null!==a)){var c=a=a.next;do{var d=c,e=d.destroy;d=d.tag;if(void 0!==e)if(0!==(d&4))Zi(b,c);else{d=b;try{e()}catch(f){Wi(d,f)}}c=c.next}while(c!==a)}break;case 1:Vi(b);a=b.stateNode;if("function"===typeof a.componentWillUnmount)try{a.props=b.memoizedProps,a.state=b.memoizedState,a.componentWillUnmount()}catch(f){Wi(b,
+f)}break;case 5:Vi(b);break;case 4:cj(a,b)}}function dj(a){a.alternate=null;a.child=null;a.dependencies=null;a.firstEffect=null;a.lastEffect=null;a.memoizedProps=null;a.memoizedState=null;a.pendingProps=null;a.return=null;a.updateQueue=null}function ej(a){return 5===a.tag||3===a.tag||4===a.tag}
+function fj(a){a:{for(var b=a.return;null!==b;){if(ej(b))break a;b=b.return}throw Error(y(160));}var c=b;b=c.stateNode;switch(c.tag){case 5:var d=!1;break;case 3:b=b.containerInfo;d=!0;break;case 4:b=b.containerInfo;d=!0;break;default:throw Error(y(161));}c.flags&16&&(pb(b,""),c.flags&=-17);a:b:for(c=a;;){for(;null===c.sibling;){if(null===c.return||ej(c.return)){c=null;break a}c=c.return}c.sibling.return=c.return;for(c=c.sibling;5!==c.tag&&6!==c.tag&&18!==c.tag;){if(c.flags&2)continue b;if(null===
+c.child||4===c.tag)continue b;else c.child.return=c,c=c.child}if(!(c.flags&2)){c=c.stateNode;break a}}d?gj(a,c,b):hj(a,c,b)}
+function gj(a,b,c){var d=a.tag,e=5===d||6===d;if(e)a=e?a.stateNode:a.stateNode.instance,b?8===c.nodeType?c.parentNode.insertBefore(a,b):c.insertBefore(a,b):(8===c.nodeType?(b=c.parentNode,b.insertBefore(a,c)):(b=c,b.appendChild(a)),c=c._reactRootContainer,null!==c&&void 0!==c||null!==b.onclick||(b.onclick=jf));else if(4!==d&&(a=a.child,null!==a))for(gj(a,b,c),a=a.sibling;null!==a;)gj(a,b,c),a=a.sibling}
+function hj(a,b,c){var d=a.tag,e=5===d||6===d;if(e)a=e?a.stateNode:a.stateNode.instance,b?c.insertBefore(a,b):c.appendChild(a);else if(4!==d&&(a=a.child,null!==a))for(hj(a,b,c),a=a.sibling;null!==a;)hj(a,b,c),a=a.sibling}
+function cj(a,b){for(var c=b,d=!1,e,f;;){if(!d){d=c.return;a:for(;;){if(null===d)throw Error(y(160));e=d.stateNode;switch(d.tag){case 5:f=!1;break a;case 3:e=e.containerInfo;f=!0;break a;case 4:e=e.containerInfo;f=!0;break a}d=d.return}d=!0}if(5===c.tag||6===c.tag){a:for(var g=a,h=c,k=h;;)if(bj(g,k),null!==k.child&&4!==k.tag)k.child.return=k,k=k.child;else{if(k===h)break a;for(;null===k.sibling;){if(null===k.return||k.return===h)break a;k=k.return}k.sibling.return=k.return;k=k.sibling}f?(g=e,h=c.stateNode,
+8===g.nodeType?g.parentNode.removeChild(h):g.removeChild(h)):e.removeChild(c.stateNode)}else if(4===c.tag){if(null!==c.child){e=c.stateNode.containerInfo;f=!0;c.child.return=c;c=c.child;continue}}else if(bj(a,c),null!==c.child){c.child.return=c;c=c.child;continue}if(c===b)break;for(;null===c.sibling;){if(null===c.return||c.return===b)return;c=c.return;4===c.tag&&(d=!1)}c.sibling.return=c.return;c=c.sibling}}
+function ij(a,b){switch(b.tag){case 0:case 11:case 14:case 15:case 22:var c=b.updateQueue;c=null!==c?c.lastEffect:null;if(null!==c){var d=c=c.next;do 3===(d.tag&3)&&(a=d.destroy,d.destroy=void 0,void 0!==a&&a()),d=d.next;while(d!==c)}return;case 1:return;case 5:c=b.stateNode;if(null!=c){d=b.memoizedProps;var e=null!==a?a.memoizedProps:d;a=b.type;var f=b.updateQueue;b.updateQueue=null;if(null!==f){c[xf]=d;"input"===a&&"radio"===d.type&&null!=d.name&&$a(c,d);wb(a,e);b=wb(a,d);for(e=0;e<f.length;e+=
+2){var g=f[e],h=f[e+1];"style"===g?tb(c,h):"dangerouslySetInnerHTML"===g?ob(c,h):"children"===g?pb(c,h):qa(c,g,h,b)}switch(a){case "input":ab(c,d);break;case "textarea":ib(c,d);break;case "select":a=c._wrapperState.wasMultiple,c._wrapperState.wasMultiple=!!d.multiple,f=d.value,null!=f?fb(c,!!d.multiple,f,!1):a!==!!d.multiple&&(null!=d.defaultValue?fb(c,!!d.multiple,d.defaultValue,!0):fb(c,!!d.multiple,d.multiple?[]:"",!1))}}}return;case 6:if(null===b.stateNode)throw Error(y(162));b.stateNode.nodeValue=
+b.memoizedProps;return;case 3:c=b.stateNode;c.hydrate&&(c.hydrate=!1,Cc(c.containerInfo));return;case 12:return;case 13:null!==b.memoizedState&&(jj=O(),aj(b.child,!0));kj(b);return;case 19:kj(b);return;case 17:return;case 23:case 24:aj(b,null!==b.memoizedState);return}throw Error(y(163));}function kj(a){var b=a.updateQueue;if(null!==b){a.updateQueue=null;var c=a.stateNode;null===c&&(c=a.stateNode=new Ui);b.forEach(function(b){var d=lj.bind(null,a,b);c.has(b)||(c.add(b),b.then(d,d))})}}
+function mj(a,b){return null!==a&&(a=a.memoizedState,null===a||null!==a.dehydrated)?(b=b.memoizedState,null!==b&&null===b.dehydrated):!1}var nj=Math.ceil,oj=ra.ReactCurrentDispatcher,pj=ra.ReactCurrentOwner,X=0,U=null,Y=null,W=0,qj=0,rj=Bf(0),V=0,sj=null,tj=0,Dg=0,Hi=0,uj=0,vj=null,jj=0,Ji=Infinity;function wj(){Ji=O()+500}var Z=null,Qi=!1,Ri=null,Ti=null,xj=!1,yj=null,zj=90,Aj=[],Bj=[],Cj=null,Dj=0,Ej=null,Fj=-1,Gj=0,Hj=0,Ij=null,Jj=!1;function Hg(){return 0!==(X&48)?O():-1!==Fj?Fj:Fj=O()}
+function Ig(a){a=a.mode;if(0===(a&2))return 1;if(0===(a&4))return 99===eg()?1:2;0===Gj&&(Gj=tj);if(0!==kg.transition){0!==Hj&&(Hj=null!==vj?vj.pendingLanes:0);a=Gj;var b=4186112&~Hj;b&=-b;0===b&&(a=4186112&~a,b=a&-a,0===b&&(b=8192));return b}a=eg();0!==(X&4)&&98===a?a=Xc(12,Gj):(a=Sc(a),a=Xc(a,Gj));return a}
+function Jg(a,b,c){if(50<Dj)throw Dj=0,Ej=null,Error(y(185));a=Kj(a,b);if(null===a)return null;$c(a,b,c);a===U&&(Hi|=b,4===V&&Ii(a,W));var d=eg();1===b?0!==(X&8)&&0===(X&48)?Lj(a):(Mj(a,c),0===X&&(wj(),ig())):(0===(X&4)||98!==d&&99!==d||(null===Cj?Cj=new Set([a]):Cj.add(a)),Mj(a,c));vj=a}function Kj(a,b){a.lanes|=b;var c=a.alternate;null!==c&&(c.lanes|=b);c=a;for(a=a.return;null!==a;)a.childLanes|=b,c=a.alternate,null!==c&&(c.childLanes|=b),c=a,a=a.return;return 3===c.tag?c.stateNode:null}
+function Mj(a,b){for(var c=a.callbackNode,d=a.suspendedLanes,e=a.pingedLanes,f=a.expirationTimes,g=a.pendingLanes;0<g;){var h=31-Vc(g),k=1<<h,l=f[h];if(-1===l){if(0===(k&d)||0!==(k&e)){l=b;Rc(k);var n=F;f[h]=10<=n?l+250:6<=n?l+5E3:-1}}else l<=b&&(a.expiredLanes|=k);g&=~k}d=Uc(a,a===U?W:0);b=F;if(0===d)null!==c&&(c!==Zf&&Pf(c),a.callbackNode=null,a.callbackPriority=0);else{if(null!==c){if(a.callbackPriority===b)return;c!==Zf&&Pf(c)}15===b?(c=Lj.bind(null,a),null===ag?(ag=[c],bg=Of(Uf,jg)):ag.push(c),
+c=Zf):14===b?c=hg(99,Lj.bind(null,a)):(c=Tc(b),c=hg(c,Nj.bind(null,a)));a.callbackPriority=b;a.callbackNode=c}}
+function Nj(a){Fj=-1;Hj=Gj=0;if(0!==(X&48))throw Error(y(327));var b=a.callbackNode;if(Oj()&&a.callbackNode!==b)return null;var c=Uc(a,a===U?W:0);if(0===c)return null;var d=c;var e=X;X|=16;var f=Pj();if(U!==a||W!==d)wj(),Qj(a,d);do try{Rj();break}catch(h){Sj(a,h)}while(1);qg();oj.current=f;X=e;null!==Y?d=0:(U=null,W=0,d=V);if(0!==(tj&Hi))Qj(a,0);else if(0!==d){2===d&&(X|=64,a.hydrate&&(a.hydrate=!1,qf(a.containerInfo)),c=Wc(a),0!==c&&(d=Tj(a,c)));if(1===d)throw b=sj,Qj(a,0),Ii(a,c),Mj(a,O()),b;a.finishedWork=
+a.current.alternate;a.finishedLanes=c;switch(d){case 0:case 1:throw Error(y(345));case 2:Uj(a);break;case 3:Ii(a,c);if((c&62914560)===c&&(d=jj+500-O(),10<d)){if(0!==Uc(a,0))break;e=a.suspendedLanes;if((e&c)!==c){Hg();a.pingedLanes|=a.suspendedLanes&e;break}a.timeoutHandle=of(Uj.bind(null,a),d);break}Uj(a);break;case 4:Ii(a,c);if((c&4186112)===c)break;d=a.eventTimes;for(e=-1;0<c;){var g=31-Vc(c);f=1<<g;g=d[g];g>e&&(e=g);c&=~f}c=e;c=O()-c;c=(120>c?120:480>c?480:1080>c?1080:1920>c?1920:3E3>c?3E3:4320>
+c?4320:1960*nj(c/1960))-c;if(10<c){a.timeoutHandle=of(Uj.bind(null,a),c);break}Uj(a);break;case 5:Uj(a);break;default:throw Error(y(329));}}Mj(a,O());return a.callbackNode===b?Nj.bind(null,a):null}function Ii(a,b){b&=~uj;b&=~Hi;a.suspendedLanes|=b;a.pingedLanes&=~b;for(a=a.expirationTimes;0<b;){var c=31-Vc(b),d=1<<c;a[c]=-1;b&=~d}}
+function Lj(a){if(0!==(X&48))throw Error(y(327));Oj();if(a===U&&0!==(a.expiredLanes&W)){var b=W;var c=Tj(a,b);0!==(tj&Hi)&&(b=Uc(a,b),c=Tj(a,b))}else b=Uc(a,0),c=Tj(a,b);0!==a.tag&&2===c&&(X|=64,a.hydrate&&(a.hydrate=!1,qf(a.containerInfo)),b=Wc(a),0!==b&&(c=Tj(a,b)));if(1===c)throw c=sj,Qj(a,0),Ii(a,b),Mj(a,O()),c;a.finishedWork=a.current.alternate;a.finishedLanes=b;Uj(a);Mj(a,O());return null}
+function Vj(){if(null!==Cj){var a=Cj;Cj=null;a.forEach(function(a){a.expiredLanes|=24&a.pendingLanes;Mj(a,O())})}ig()}function Wj(a,b){var c=X;X|=1;try{return a(b)}finally{X=c,0===X&&(wj(),ig())}}function Xj(a,b){var c=X;X&=-2;X|=8;try{return a(b)}finally{X=c,0===X&&(wj(),ig())}}function ni(a,b){I(rj,qj);qj|=b;tj|=b}function Ki(){qj=rj.current;H(rj)}
+function Qj(a,b){a.finishedWork=null;a.finishedLanes=0;var c=a.timeoutHandle;-1!==c&&(a.timeoutHandle=-1,pf(c));if(null!==Y)for(c=Y.return;null!==c;){var d=c;switch(d.tag){case 1:d=d.type.childContextTypes;null!==d&&void 0!==d&&Gf();break;case 3:fh();H(N);H(M);uh();break;case 5:hh(d);break;case 4:fh();break;case 13:H(P);break;case 19:H(P);break;case 10:rg(d);break;case 23:case 24:Ki()}c=c.return}U=a;Y=Tg(a.current,null);W=qj=tj=b;V=0;sj=null;uj=Hi=Dg=0}
+function Sj(a,b){do{var c=Y;try{qg();vh.current=Gh;if(yh){for(var d=R.memoizedState;null!==d;){var e=d.queue;null!==e&&(e.pending=null);d=d.next}yh=!1}xh=0;T=S=R=null;zh=!1;pj.current=null;if(null===c||null===c.return){V=1;sj=b;Y=null;break}a:{var f=a,g=c.return,h=c,k=b;b=W;h.flags|=2048;h.firstEffect=h.lastEffect=null;if(null!==k&&"object"===typeof k&&"function"===typeof k.then){var l=k;if(0===(h.mode&2)){var n=h.alternate;n?(h.updateQueue=n.updateQueue,h.memoizedState=n.memoizedState,h.lanes=n.lanes):
+(h.updateQueue=null,h.memoizedState=null)}var A=0!==(P.current&1),p=g;do{var C;if(C=13===p.tag){var x=p.memoizedState;if(null!==x)C=null!==x.dehydrated?!0:!1;else{var w=p.memoizedProps;C=void 0===w.fallback?!1:!0!==w.unstable_avoidThisFallback?!0:A?!1:!0}}if(C){var z=p.updateQueue;if(null===z){var u=new Set;u.add(l);p.updateQueue=u}else z.add(l);if(0===(p.mode&2)){p.flags|=64;h.flags|=16384;h.flags&=-2981;if(1===h.tag)if(null===h.alternate)h.tag=17;else{var t=zg(-1,1);t.tag=2;Ag(h,t)}h.lanes|=1;break a}k=
+void 0;h=b;var q=f.pingCache;null===q?(q=f.pingCache=new Oi,k=new Set,q.set(l,k)):(k=q.get(l),void 0===k&&(k=new Set,q.set(l,k)));if(!k.has(h)){k.add(h);var v=Yj.bind(null,f,l,h);l.then(v,v)}p.flags|=4096;p.lanes=b;break a}p=p.return}while(null!==p);k=Error((Ra(h.type)||"A React component")+" suspended while rendering, but no fallback UI was specified.\n\nAdd a <Suspense fallback=...> component higher in the tree to provide a loading indicator or placeholder to display.")}5!==V&&(V=2);k=Mi(k,h);p=
+g;do{switch(p.tag){case 3:f=k;p.flags|=4096;b&=-b;p.lanes|=b;var J=Pi(p,f,b);Bg(p,J);break a;case 1:f=k;var K=p.type,Q=p.stateNode;if(0===(p.flags&64)&&("function"===typeof K.getDerivedStateFromError||null!==Q&&"function"===typeof Q.componentDidCatch&&(null===Ti||!Ti.has(Q)))){p.flags|=4096;b&=-b;p.lanes|=b;var L=Si(p,f,b);Bg(p,L);break a}}p=p.return}while(null!==p)}Zj(c)}catch(va){b=va;Y===c&&null!==c&&(Y=c=c.return);continue}break}while(1)}
+function Pj(){var a=oj.current;oj.current=Gh;return null===a?Gh:a}function Tj(a,b){var c=X;X|=16;var d=Pj();U===a&&W===b||Qj(a,b);do try{ak();break}catch(e){Sj(a,e)}while(1);qg();X=c;oj.current=d;if(null!==Y)throw Error(y(261));U=null;W=0;return V}function ak(){for(;null!==Y;)bk(Y)}function Rj(){for(;null!==Y&&!Qf();)bk(Y)}function bk(a){var b=ck(a.alternate,a,qj);a.memoizedProps=a.pendingProps;null===b?Zj(a):Y=b;pj.current=null}
+function Zj(a){var b=a;do{var c=b.alternate;a=b.return;if(0===(b.flags&2048)){c=Gi(c,b,qj);if(null!==c){Y=c;return}c=b;if(24!==c.tag&&23!==c.tag||null===c.memoizedState||0!==(qj&1073741824)||0===(c.mode&4)){for(var d=0,e=c.child;null!==e;)d|=e.lanes|e.childLanes,e=e.sibling;c.childLanes=d}null!==a&&0===(a.flags&2048)&&(null===a.firstEffect&&(a.firstEffect=b.firstEffect),null!==b.lastEffect&&(null!==a.lastEffect&&(a.lastEffect.nextEffect=b.firstEffect),a.lastEffect=b.lastEffect),1<b.flags&&(null!==
+a.lastEffect?a.lastEffect.nextEffect=b:a.firstEffect=b,a.lastEffect=b))}else{c=Li(b);if(null!==c){c.flags&=2047;Y=c;return}null!==a&&(a.firstEffect=a.lastEffect=null,a.flags|=2048)}b=b.sibling;if(null!==b){Y=b;return}Y=b=a}while(null!==b);0===V&&(V=5)}function Uj(a){var b=eg();gg(99,dk.bind(null,a,b));return null}
+function dk(a,b){do Oj();while(null!==yj);if(0!==(X&48))throw Error(y(327));var c=a.finishedWork;if(null===c)return null;a.finishedWork=null;a.finishedLanes=0;if(c===a.current)throw Error(y(177));a.callbackNode=null;var d=c.lanes|c.childLanes,e=d,f=a.pendingLanes&~e;a.pendingLanes=e;a.suspendedLanes=0;a.pingedLanes=0;a.expiredLanes&=e;a.mutableReadLanes&=e;a.entangledLanes&=e;e=a.entanglements;for(var g=a.eventTimes,h=a.expirationTimes;0<f;){var k=31-Vc(f),l=1<<k;e[k]=0;g[k]=-1;h[k]=-1;f&=~l}null!==
+Cj&&0===(d&24)&&Cj.has(a)&&Cj.delete(a);a===U&&(Y=U=null,W=0);1<c.flags?null!==c.lastEffect?(c.lastEffect.nextEffect=c,d=c.firstEffect):d=c:d=c.firstEffect;if(null!==d){e=X;X|=32;pj.current=null;kf=fd;g=Ne();if(Oe(g)){if("selectionStart"in g)h={start:g.selectionStart,end:g.selectionEnd};else a:if(h=(h=g.ownerDocument)&&h.defaultView||window,(l=h.getSelection&&h.getSelection())&&0!==l.rangeCount){h=l.anchorNode;f=l.anchorOffset;k=l.focusNode;l=l.focusOffset;try{h.nodeType,k.nodeType}catch(va){h=null;
+break a}var n=0,A=-1,p=-1,C=0,x=0,w=g,z=null;b:for(;;){for(var u;;){w!==h||0!==f&&3!==w.nodeType||(A=n+f);w!==k||0!==l&&3!==w.nodeType||(p=n+l);3===w.nodeType&&(n+=w.nodeValue.length);if(null===(u=w.firstChild))break;z=w;w=u}for(;;){if(w===g)break b;z===h&&++C===f&&(A=n);z===k&&++x===l&&(p=n);if(null!==(u=w.nextSibling))break;w=z;z=w.parentNode}w=u}h=-1===A||-1===p?null:{start:A,end:p}}else h=null;h=h||{start:0,end:0}}else h=null;lf={focusedElem:g,selectionRange:h};fd=!1;Ij=null;Jj=!1;Z=d;do try{ek()}catch(va){if(null===
+Z)throw Error(y(330));Wi(Z,va);Z=Z.nextEffect}while(null!==Z);Ij=null;Z=d;do try{for(g=a;null!==Z;){var t=Z.flags;t&16&&pb(Z.stateNode,"");if(t&128){var q=Z.alternate;if(null!==q){var v=q.ref;null!==v&&("function"===typeof v?v(null):v.current=null)}}switch(t&1038){case 2:fj(Z);Z.flags&=-3;break;case 6:fj(Z);Z.flags&=-3;ij(Z.alternate,Z);break;case 1024:Z.flags&=-1025;break;case 1028:Z.flags&=-1025;ij(Z.alternate,Z);break;case 4:ij(Z.alternate,Z);break;case 8:h=Z;cj(g,h);var J=h.alternate;dj(h);null!==
+J&&dj(J)}Z=Z.nextEffect}}catch(va){if(null===Z)throw Error(y(330));Wi(Z,va);Z=Z.nextEffect}while(null!==Z);v=lf;q=Ne();t=v.focusedElem;g=v.selectionRange;if(q!==t&&t&&t.ownerDocument&&Me(t.ownerDocument.documentElement,t)){null!==g&&Oe(t)&&(q=g.start,v=g.end,void 0===v&&(v=q),"selectionStart"in t?(t.selectionStart=q,t.selectionEnd=Math.min(v,t.value.length)):(v=(q=t.ownerDocument||document)&&q.defaultView||window,v.getSelection&&(v=v.getSelection(),h=t.textContent.length,J=Math.min(g.start,h),g=void 0===
+g.end?J:Math.min(g.end,h),!v.extend&&J>g&&(h=g,g=J,J=h),h=Le(t,J),f=Le(t,g),h&&f&&(1!==v.rangeCount||v.anchorNode!==h.node||v.anchorOffset!==h.offset||v.focusNode!==f.node||v.focusOffset!==f.offset)&&(q=q.createRange(),q.setStart(h.node,h.offset),v.removeAllRanges(),J>g?(v.addRange(q),v.extend(f.node,f.offset)):(q.setEnd(f.node,f.offset),v.addRange(q))))));q=[];for(v=t;v=v.parentNode;)1===v.nodeType&&q.push({element:v,left:v.scrollLeft,top:v.scrollTop});"function"===typeof t.focus&&t.focus();for(t=
+0;t<q.length;t++)v=q[t],v.element.scrollLeft=v.left,v.element.scrollTop=v.top}fd=!!kf;lf=kf=null;a.current=c;Z=d;do try{for(t=a;null!==Z;){var K=Z.flags;K&36&&Yi(t,Z.alternate,Z);if(K&128){q=void 0;var Q=Z.ref;if(null!==Q){var L=Z.stateNode;switch(Z.tag){case 5:q=L;break;default:q=L}"function"===typeof Q?Q(q):Q.current=q}}Z=Z.nextEffect}}catch(va){if(null===Z)throw Error(y(330));Wi(Z,va);Z=Z.nextEffect}while(null!==Z);Z=null;$f();X=e}else a.current=c;if(xj)xj=!1,yj=a,zj=b;else for(Z=d;null!==Z;)b=
+Z.nextEffect,Z.nextEffect=null,Z.flags&8&&(K=Z,K.sibling=null,K.stateNode=null),Z=b;d=a.pendingLanes;0===d&&(Ti=null);1===d?a===Ej?Dj++:(Dj=0,Ej=a):Dj=0;c=c.stateNode;if(Mf&&"function"===typeof Mf.onCommitFiberRoot)try{Mf.onCommitFiberRoot(Lf,c,void 0,64===(c.current.flags&64))}catch(va){}Mj(a,O());if(Qi)throw Qi=!1,a=Ri,Ri=null,a;if(0!==(X&8))return null;ig();return null}
+function ek(){for(;null!==Z;){var a=Z.alternate;Jj||null===Ij||(0!==(Z.flags&8)?dc(Z,Ij)&&(Jj=!0):13===Z.tag&&mj(a,Z)&&dc(Z,Ij)&&(Jj=!0));var b=Z.flags;0!==(b&256)&&Xi(a,Z);0===(b&512)||xj||(xj=!0,hg(97,function(){Oj();return null}));Z=Z.nextEffect}}function Oj(){if(90!==zj){var a=97<zj?97:zj;zj=90;return gg(a,fk)}return!1}function $i(a,b){Aj.push(b,a);xj||(xj=!0,hg(97,function(){Oj();return null}))}function Zi(a,b){Bj.push(b,a);xj||(xj=!0,hg(97,function(){Oj();return null}))}
+function fk(){if(null===yj)return!1;var a=yj;yj=null;if(0!==(X&48))throw Error(y(331));var b=X;X|=32;var c=Bj;Bj=[];for(var d=0;d<c.length;d+=2){var e=c[d],f=c[d+1],g=e.destroy;e.destroy=void 0;if("function"===typeof g)try{g()}catch(k){if(null===f)throw Error(y(330));Wi(f,k)}}c=Aj;Aj=[];for(d=0;d<c.length;d+=2){e=c[d];f=c[d+1];try{var h=e.create;e.destroy=h()}catch(k){if(null===f)throw Error(y(330));Wi(f,k)}}for(h=a.current.firstEffect;null!==h;)a=h.nextEffect,h.nextEffect=null,h.flags&8&&(h.sibling=
+null,h.stateNode=null),h=a;X=b;ig();return!0}function gk(a,b,c){b=Mi(c,b);b=Pi(a,b,1);Ag(a,b);b=Hg();a=Kj(a,1);null!==a&&($c(a,1,b),Mj(a,b))}
+function Wi(a,b){if(3===a.tag)gk(a,a,b);else for(var c=a.return;null!==c;){if(3===c.tag){gk(c,a,b);break}else if(1===c.tag){var d=c.stateNode;if("function"===typeof c.type.getDerivedStateFromError||"function"===typeof d.componentDidCatch&&(null===Ti||!Ti.has(d))){a=Mi(b,a);var e=Si(c,a,1);Ag(c,e);e=Hg();c=Kj(c,1);if(null!==c)$c(c,1,e),Mj(c,e);else if("function"===typeof d.componentDidCatch&&(null===Ti||!Ti.has(d)))try{d.componentDidCatch(b,a)}catch(f){}break}}c=c.return}}
+function Yj(a,b,c){var d=a.pingCache;null!==d&&d.delete(b);b=Hg();a.pingedLanes|=a.suspendedLanes&c;U===a&&(W&c)===c&&(4===V||3===V&&(W&62914560)===W&&500>O()-jj?Qj(a,0):uj|=c);Mj(a,b)}function lj(a,b){var c=a.stateNode;null!==c&&c.delete(b);b=0;0===b&&(b=a.mode,0===(b&2)?b=1:0===(b&4)?b=99===eg()?1:2:(0===Gj&&(Gj=tj),b=Yc(62914560&~Gj),0===b&&(b=4194304)));c=Hg();a=Kj(a,b);null!==a&&($c(a,b,c),Mj(a,c))}var ck;
+ck=function(a,b,c){var d=b.lanes;if(null!==a)if(a.memoizedProps!==b.pendingProps||N.current)ug=!0;else if(0!==(c&d))ug=0!==(a.flags&16384)?!0:!1;else{ug=!1;switch(b.tag){case 3:ri(b);sh();break;case 5:gh(b);break;case 1:Ff(b.type)&&Jf(b);break;case 4:eh(b,b.stateNode.containerInfo);break;case 10:d=b.memoizedProps.value;var e=b.type._context;I(mg,e._currentValue);e._currentValue=d;break;case 13:if(null!==b.memoizedState){if(0!==(c&b.child.childLanes))return ti(a,b,c);I(P,P.current&1);b=hi(a,b,c);return null!==
+b?b.sibling:null}I(P,P.current&1);break;case 19:d=0!==(c&b.childLanes);if(0!==(a.flags&64)){if(d)return Ai(a,b,c);b.flags|=64}e=b.memoizedState;null!==e&&(e.rendering=null,e.tail=null,e.lastEffect=null);I(P,P.current);if(d)break;else return null;case 23:case 24:return b.lanes=0,mi(a,b,c)}return hi(a,b,c)}else ug=!1;b.lanes=0;switch(b.tag){case 2:d=b.type;null!==a&&(a.alternate=null,b.alternate=null,b.flags|=2);a=b.pendingProps;e=Ef(b,M.current);tg(b,c);e=Ch(null,b,d,a,e,c);b.flags|=1;if("object"===
+typeof e&&null!==e&&"function"===typeof e.render&&void 0===e.$$typeof){b.tag=1;b.memoizedState=null;b.updateQueue=null;if(Ff(d)){var f=!0;Jf(b)}else f=!1;b.memoizedState=null!==e.state&&void 0!==e.state?e.state:null;xg(b);var g=d.getDerivedStateFromProps;"function"===typeof g&&Gg(b,d,g,a);e.updater=Kg;b.stateNode=e;e._reactInternals=b;Og(b,d,a,c);b=qi(null,b,d,!0,f,c)}else b.tag=0,fi(null,b,e,c),b=b.child;return b;case 16:e=b.elementType;a:{null!==a&&(a.alternate=null,b.alternate=null,b.flags|=2);
+a=b.pendingProps;f=e._init;e=f(e._payload);b.type=e;f=b.tag=hk(e);a=lg(e,a);switch(f){case 0:b=li(null,b,e,a,c);break a;case 1:b=pi(null,b,e,a,c);break a;case 11:b=gi(null,b,e,a,c);break a;case 14:b=ii(null,b,e,lg(e.type,a),d,c);break a}throw Error(y(306,e,""));}return b;case 0:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:lg(d,e),li(a,b,d,e,c);case 1:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:lg(d,e),pi(a,b,d,e,c);case 3:ri(b);d=b.updateQueue;if(null===a||null===d)throw Error(y(282));
+d=b.pendingProps;e=b.memoizedState;e=null!==e?e.element:null;yg(a,b);Cg(b,d,null,c);d=b.memoizedState.element;if(d===e)sh(),b=hi(a,b,c);else{e=b.stateNode;if(f=e.hydrate)kh=rf(b.stateNode.containerInfo.firstChild),jh=b,f=lh=!0;if(f){a=e.mutableSourceEagerHydrationData;if(null!=a)for(e=0;e<a.length;e+=2)f=a[e],f._workInProgressVersionPrimary=a[e+1],th.push(f);c=Zg(b,null,d,c);for(b.child=c;c;)c.flags=c.flags&-3|1024,c=c.sibling}else fi(a,b,d,c),sh();b=b.child}return b;case 5:return gh(b),null===a&&
+ph(b),d=b.type,e=b.pendingProps,f=null!==a?a.memoizedProps:null,g=e.children,nf(d,e)?g=null:null!==f&&nf(d,f)&&(b.flags|=16),oi(a,b),fi(a,b,g,c),b.child;case 6:return null===a&&ph(b),null;case 13:return ti(a,b,c);case 4:return eh(b,b.stateNode.containerInfo),d=b.pendingProps,null===a?b.child=Yg(b,null,d,c):fi(a,b,d,c),b.child;case 11:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:lg(d,e),gi(a,b,d,e,c);case 7:return fi(a,b,b.pendingProps,c),b.child;case 8:return fi(a,b,b.pendingProps.children,
+c),b.child;case 12:return fi(a,b,b.pendingProps.children,c),b.child;case 10:a:{d=b.type._context;e=b.pendingProps;g=b.memoizedProps;f=e.value;var h=b.type._context;I(mg,h._currentValue);h._currentValue=f;if(null!==g)if(h=g.value,f=He(h,f)?0:("function"===typeof d._calculateChangedBits?d._calculateChangedBits(h,f):1073741823)|0,0===f){if(g.children===e.children&&!N.current){b=hi(a,b,c);break a}}else for(h=b.child,null!==h&&(h.return=b);null!==h;){var k=h.dependencies;if(null!==k){g=h.child;for(var l=
+k.firstContext;null!==l;){if(l.context===d&&0!==(l.observedBits&f)){1===h.tag&&(l=zg(-1,c&-c),l.tag=2,Ag(h,l));h.lanes|=c;l=h.alternate;null!==l&&(l.lanes|=c);sg(h.return,c);k.lanes|=c;break}l=l.next}}else g=10===h.tag?h.type===b.type?null:h.child:h.child;if(null!==g)g.return=h;else for(g=h;null!==g;){if(g===b){g=null;break}h=g.sibling;if(null!==h){h.return=g.return;g=h;break}g=g.return}h=g}fi(a,b,e.children,c);b=b.child}return b;case 9:return e=b.type,f=b.pendingProps,d=f.children,tg(b,c),e=vg(e,
+f.unstable_observedBits),d=d(e),b.flags|=1,fi(a,b,d,c),b.child;case 14:return e=b.type,f=lg(e,b.pendingProps),f=lg(e.type,f),ii(a,b,e,f,d,c);case 15:return ki(a,b,b.type,b.pendingProps,d,c);case 17:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:lg(d,e),null!==a&&(a.alternate=null,b.alternate=null,b.flags|=2),b.tag=1,Ff(d)?(a=!0,Jf(b)):a=!1,tg(b,c),Mg(b,d,e),Og(b,d,e,c),qi(null,b,d,!0,a,c);case 19:return Ai(a,b,c);case 23:return mi(a,b,c);case 24:return mi(a,b,c)}throw Error(y(156,b.tag));
+};function ik(a,b,c,d){this.tag=a;this.key=c;this.sibling=this.child=this.return=this.stateNode=this.type=this.elementType=null;this.index=0;this.ref=null;this.pendingProps=b;this.dependencies=this.memoizedState=this.updateQueue=this.memoizedProps=null;this.mode=d;this.flags=0;this.lastEffect=this.firstEffect=this.nextEffect=null;this.childLanes=this.lanes=0;this.alternate=null}function nh(a,b,c,d){return new ik(a,b,c,d)}function ji(a){a=a.prototype;return!(!a||!a.isReactComponent)}
+function hk(a){if("function"===typeof a)return ji(a)?1:0;if(void 0!==a&&null!==a){a=a.$$typeof;if(a===Aa)return 11;if(a===Da)return 14}return 2}
+function Tg(a,b){var c=a.alternate;null===c?(c=nh(a.tag,b,a.key,a.mode),c.elementType=a.elementType,c.type=a.type,c.stateNode=a.stateNode,c.alternate=a,a.alternate=c):(c.pendingProps=b,c.type=a.type,c.flags=0,c.nextEffect=null,c.firstEffect=null,c.lastEffect=null);c.childLanes=a.childLanes;c.lanes=a.lanes;c.child=a.child;c.memoizedProps=a.memoizedProps;c.memoizedState=a.memoizedState;c.updateQueue=a.updateQueue;b=a.dependencies;c.dependencies=null===b?null:{lanes:b.lanes,firstContext:b.firstContext};
+c.sibling=a.sibling;c.index=a.index;c.ref=a.ref;return c}
+function Vg(a,b,c,d,e,f){var g=2;d=a;if("function"===typeof a)ji(a)&&(g=1);else if("string"===typeof a)g=5;else a:switch(a){case ua:return Xg(c.children,e,f,b);case Ha:g=8;e|=16;break;case wa:g=8;e|=1;break;case xa:return a=nh(12,c,b,e|8),a.elementType=xa,a.type=xa,a.lanes=f,a;case Ba:return a=nh(13,c,b,e),a.type=Ba,a.elementType=Ba,a.lanes=f,a;case Ca:return a=nh(19,c,b,e),a.elementType=Ca,a.lanes=f,a;case Ia:return vi(c,e,f,b);case Ja:return a=nh(24,c,b,e),a.elementType=Ja,a.lanes=f,a;default:if("object"===
+typeof a&&null!==a)switch(a.$$typeof){case ya:g=10;break a;case za:g=9;break a;case Aa:g=11;break a;case Da:g=14;break a;case Ea:g=16;d=null;break a;case Fa:g=22;break a}throw Error(y(130,null==a?a:typeof a,""));}b=nh(g,c,b,e);b.elementType=a;b.type=d;b.lanes=f;return b}function Xg(a,b,c,d){a=nh(7,a,d,b);a.lanes=c;return a}function vi(a,b,c,d){a=nh(23,a,d,b);a.elementType=Ia;a.lanes=c;return a}function Ug(a,b,c){a=nh(6,a,null,b);a.lanes=c;return a}
+function Wg(a,b,c){b=nh(4,null!==a.children?a.children:[],a.key,b);b.lanes=c;b.stateNode={containerInfo:a.containerInfo,pendingChildren:null,implementation:a.implementation};return b}
+function jk(a,b,c){this.tag=b;this.containerInfo=a;this.finishedWork=this.pingCache=this.current=this.pendingChildren=null;this.timeoutHandle=-1;this.pendingContext=this.context=null;this.hydrate=c;this.callbackNode=null;this.callbackPriority=0;this.eventTimes=Zc(0);this.expirationTimes=Zc(-1);this.entangledLanes=this.finishedLanes=this.mutableReadLanes=this.expiredLanes=this.pingedLanes=this.suspendedLanes=this.pendingLanes=0;this.entanglements=Zc(0);this.mutableSourceEagerHydrationData=null}
+function kk(a,b,c){var d=3<arguments.length&&void 0!==arguments[3]?arguments[3]:null;return{$$typeof:ta,key:null==d?null:""+d,children:a,containerInfo:b,implementation:c}}
+function lk(a,b,c,d){var e=b.current,f=Hg(),g=Ig(e);a:if(c){c=c._reactInternals;b:{if(Zb(c)!==c||1!==c.tag)throw Error(y(170));var h=c;do{switch(h.tag){case 3:h=h.stateNode.context;break b;case 1:if(Ff(h.type)){h=h.stateNode.__reactInternalMemoizedMergedChildContext;break b}}h=h.return}while(null!==h);throw Error(y(171));}if(1===c.tag){var k=c.type;if(Ff(k)){c=If(c,k,h);break a}}c=h}else c=Cf;null===b.context?b.context=c:b.pendingContext=c;b=zg(f,g);b.payload={element:a};d=void 0===d?null:d;null!==
+d&&(b.callback=d);Ag(e,b);Jg(e,g,f);return g}function mk(a){a=a.current;if(!a.child)return null;switch(a.child.tag){case 5:return a.child.stateNode;default:return a.child.stateNode}}function nk(a,b){a=a.memoizedState;if(null!==a&&null!==a.dehydrated){var c=a.retryLane;a.retryLane=0!==c&&c<b?c:b}}function ok(a,b){nk(a,b);(a=a.alternate)&&nk(a,b)}function pk(){return null}
+function qk(a,b,c){var d=null!=c&&null!=c.hydrationOptions&&c.hydrationOptions.mutableSources||null;c=new jk(a,b,null!=c&&!0===c.hydrate);b=nh(3,null,null,2===b?7:1===b?3:0);c.current=b;b.stateNode=c;xg(b);a[ff]=c.current;cf(8===a.nodeType?a.parentNode:a);if(d)for(a=0;a<d.length;a++){b=d[a];var e=b._getVersion;e=e(b._source);null==c.mutableSourceEagerHydrationData?c.mutableSourceEagerHydrationData=[b,e]:c.mutableSourceEagerHydrationData.push(b,e)}this._internalRoot=c}
+qk.prototype.render=function(a){lk(a,this._internalRoot,null,null)};qk.prototype.unmount=function(){var a=this._internalRoot,b=a.containerInfo;lk(null,a,null,function(){b[ff]=null})};function rk(a){return!(!a||1!==a.nodeType&&9!==a.nodeType&&11!==a.nodeType&&(8!==a.nodeType||" react-mount-point-unstable "!==a.nodeValue))}
+function sk(a,b){b||(b=a?9===a.nodeType?a.documentElement:a.firstChild:null,b=!(!b||1!==b.nodeType||!b.hasAttribute("data-reactroot")));if(!b)for(var c;c=a.lastChild;)a.removeChild(c);return new qk(a,0,b?{hydrate:!0}:void 0)}
+function tk(a,b,c,d,e){var f=c._reactRootContainer;if(f){var g=f._internalRoot;if("function"===typeof e){var h=e;e=function(){var a=mk(g);h.call(a)}}lk(b,g,a,e)}else{f=c._reactRootContainer=sk(c,d);g=f._internalRoot;if("function"===typeof e){var k=e;e=function(){var a=mk(g);k.call(a)}}Xj(function(){lk(b,g,a,e)})}return mk(g)}ec=function(a){if(13===a.tag){var b=Hg();Jg(a,4,b);ok(a,4)}};fc=function(a){if(13===a.tag){var b=Hg();Jg(a,67108864,b);ok(a,67108864)}};
+gc=function(a){if(13===a.tag){var b=Hg(),c=Ig(a);Jg(a,c,b);ok(a,c)}};hc=function(a,b){return b()};
+yb=function(a,b,c){switch(b){case "input":ab(a,c);b=c.name;if("radio"===c.type&&null!=b){for(c=a;c.parentNode;)c=c.parentNode;c=c.querySelectorAll("input[name="+JSON.stringify(""+b)+'][type="radio"]');for(b=0;b<c.length;b++){var d=c[b];if(d!==a&&d.form===a.form){var e=Db(d);if(!e)throw Error(y(90));Wa(d);ab(d,e)}}}break;case "textarea":ib(a,c);break;case "select":b=c.value,null!=b&&fb(a,!!c.multiple,b,!1)}};Gb=Wj;
+Hb=function(a,b,c,d,e){var f=X;X|=4;try{return gg(98,a.bind(null,b,c,d,e))}finally{X=f,0===X&&(wj(),ig())}};Ib=function(){0===(X&49)&&(Vj(),Oj())};Jb=function(a,b){var c=X;X|=2;try{return a(b)}finally{X=c,0===X&&(wj(),ig())}};function uk(a,b){var c=2<arguments.length&&void 0!==arguments[2]?arguments[2]:null;if(!rk(b))throw Error(y(200));return kk(a,b,null,c)}var vk={Events:[Cb,ue,Db,Eb,Fb,Oj,{current:!1}]},wk={findFiberByHostInstance:wc,bundleType:0,version:"17.0.2",rendererPackageName:"react-dom"};
+var xk={bundleType:wk.bundleType,version:wk.version,rendererPackageName:wk.rendererPackageName,rendererConfig:wk.rendererConfig,overrideHookState:null,overrideHookStateDeletePath:null,overrideHookStateRenamePath:null,overrideProps:null,overridePropsDeletePath:null,overridePropsRenamePath:null,setSuspenseHandler:null,scheduleUpdate:null,currentDispatcherRef:ra.ReactCurrentDispatcher,findHostInstanceByFiber:function(a){a=cc(a);return null===a?null:a.stateNode},findFiberByHostInstance:wk.findFiberByHostInstance||
+pk,findHostInstancesForRefresh:null,scheduleRefresh:null,scheduleRoot:null,setRefreshHandler:null,getCurrentFiber:null};if("undefined"!==typeof __REACT_DEVTOOLS_GLOBAL_HOOK__){var yk=__REACT_DEVTOOLS_GLOBAL_HOOK__;if(!yk.isDisabled&&yk.supportsFiber)try{Lf=yk.inject(xk),Mf=yk}catch(a){}}exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED=vk;exports.createPortal=uk;
+exports.findDOMNode=function(a){if(null==a)return null;if(1===a.nodeType)return a;var b=a._reactInternals;if(void 0===b){if("function"===typeof a.render)throw Error(y(188));throw Error(y(268,Object.keys(a)));}a=cc(b);a=null===a?null:a.stateNode;return a};exports.flushSync=function(a,b){var c=X;if(0!==(c&48))return a(b);X|=1;try{if(a)return gg(99,a.bind(null,b))}finally{X=c,ig()}};exports.hydrate=function(a,b,c){if(!rk(b))throw Error(y(200));return tk(null,a,b,!0,c)};
+exports.render=function(a,b,c){if(!rk(b))throw Error(y(200));return tk(null,a,b,!1,c)};exports.unmountComponentAtNode=function(a){if(!rk(a))throw Error(y(40));return a._reactRootContainer?(Xj(function(){tk(null,null,a,!1,function(){a._reactRootContainer=null;a[ff]=null})}),!0):!1};exports.unstable_batchedUpdates=Wj;exports.unstable_createPortal=function(a,b){return uk(a,b,2<arguments.length&&void 0!==arguments[2]?arguments[2]:null)};
+exports.unstable_renderSubtreeIntoContainer=function(a,b,c,d){if(!rk(c))throw Error(y(200));if(null==a||void 0===a._reactInternals)throw Error(y(38));return tk(a,b,c,!1,d)};exports.version="17.0.2";
diff --git a/ddb_main/node_modules/react-dom/index.js b/ddb_main/node_modules/react-dom/index.js
new file mode 100644
index 0000000..0eb376e
--- /dev/null
+++ b/ddb_main/node_modules/react-dom/index.js
@@ -0,0 +1,38 @@
+'use strict';
+
+function checkDCE() {
+  /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
+  if (
+    typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined' ||
+    typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE !== 'function'
+  ) {
+    return;
+  }
+  if (process.env.NODE_ENV !== 'production') {
+    // This branch is unreachable because this function is only called
+    // in production, but the condition is true only in development.
+    // Therefore if the branch is still here, dead code elimination wasn't
+    // properly applied.
+    // Don't change the message. React DevTools relies on it. Also make sure
+    // this message doesn't occur elsewhere in this function, or it will cause
+    // a false positive.
+    throw new Error('^_^');
+  }
+  try {
+    // Verify that the code above has been dead code eliminated (DCE'd).
+    __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(checkDCE);
+  } catch (err) {
+    // DevTools shouldn't crash React, no matter what.
+    // We should still report in case we break this code.
+    console.error(err);
+  }
+}
+
+if (process.env.NODE_ENV === 'production') {
+  // DCE check should happen before ReactDOM bundle executes so that
+  // DevTools can report bad minification during injection.
+  checkDCE();
+  module.exports = require('./cjs/react-dom.production.min.js');
+} else {
+  module.exports = require('./cjs/react-dom.development.js');
+}
diff --git a/ddb_main/node_modules/react-fast-compare/index.js b/ddb_main/node_modules/react-fast-compare/index.js
new file mode 100644
index 0000000..26cec8d
--- /dev/null
+++ b/ddb_main/node_modules/react-fast-compare/index.js
@@ -0,0 +1,139 @@
+/* global Map:readonly, Set:readonly, ArrayBuffer:readonly */
+
+var hasElementType = typeof Element !== 'undefined';
+var hasMap = typeof Map === 'function';
+var hasSet = typeof Set === 'function';
+var hasArrayBuffer = typeof ArrayBuffer === 'function' && !!ArrayBuffer.isView;
+
+// Note: We **don't** need `envHasBigInt64Array` in fde es6/index.js
+
+function equal(a, b) {
+  // START: fast-deep-equal es6/index.js 3.1.3
+  if (a === b) return true;
+
+  if (a && b && typeof a == 'object' && typeof b == 'object') {
+    if (a.constructor !== b.constructor) return false;
+
+    var length, i, keys;
+    if (Array.isArray(a)) {
+      length = a.length;
+      if (length != b.length) return false;
+      for (i = length; i-- !== 0;)
+        if (!equal(a[i], b[i])) return false;
+      return true;
+    }
+
+    // START: Modifications:
+    // 1. Extra `has<Type> &&` helpers in initial condition allow es6 code
+    //    to co-exist with es5.
+    // 2. Replace `for of` with es5 compliant iteration using `for`.
+    //    Basically, take:
+    //
+    //    ```js
+    //    for (i of a.entries())
+    //      if (!b.has(i[0])) return false;
+    //    ```
+    //
+    //    ... and convert to:
+    //
+    //    ```js
+    //    it = a.entries();
+    //    while (!(i = it.next()).done)
+    //      if (!b.has(i.value[0])) return false;
+    //    ```
+    //
+    //    **Note**: `i` access switches to `i.value`.
+    var it;
+    if (hasMap && (a instanceof Map) && (b instanceof Map)) {
+      if (a.size !== b.size) return false;
+      it = a.entries();
+      while (!(i = it.next()).done)
+        if (!b.has(i.value[0])) return false;
+      it = a.entries();
+      while (!(i = it.next()).done)
+        if (!equal(i.value[1], b.get(i.value[0]))) return false;
+      return true;
+    }
+
+    if (hasSet && (a instanceof Set) && (b instanceof Set)) {
+      if (a.size !== b.size) return false;
+      it = a.entries();
+      while (!(i = it.next()).done)
+        if (!b.has(i.value[0])) return false;
+      return true;
+    }
+    // END: Modifications
+
+    if (hasArrayBuffer && ArrayBuffer.isView(a) && ArrayBuffer.isView(b)) {
+      length = a.length;
+      if (length != b.length) return false;
+      for (i = length; i-- !== 0;)
+        if (a[i] !== b[i]) return false;
+      return true;
+    }
+
+    if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;
+    // START: Modifications:
+    // Apply guards for `Object.create(null)` handling. See:
+    // - https://github.com/FormidableLabs/react-fast-compare/issues/64
+    // - https://github.com/epoberezkin/fast-deep-equal/issues/49
+    if (a.valueOf !== Object.prototype.valueOf && typeof a.valueOf === 'function' && typeof b.valueOf === 'function') return a.valueOf() === b.valueOf();
+    if (a.toString !== Object.prototype.toString && typeof a.toString === 'function' && typeof b.toString === 'function') return a.toString() === b.toString();
+    // END: Modifications
+
+    keys = Object.keys(a);
+    length = keys.length;
+    if (length !== Object.keys(b).length) return false;
+
+    for (i = length; i-- !== 0;)
+      if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;
+    // END: fast-deep-equal
+
+    // START: react-fast-compare
+    // custom handling for DOM elements
+    if (hasElementType && a instanceof Element) return false;
+
+    // custom handling for React/Preact
+    for (i = length; i-- !== 0;) {
+      if ((keys[i] === '_owner' || keys[i] === '__v' || keys[i] === '__o') && a.$$typeof) {
+        // React-specific: avoid traversing React elements' _owner
+        // Preact-specific: avoid traversing Preact elements' __v and __o
+        //    __v = $_original / $_vnode
+        //    __o = $_owner
+        // These properties contain circular references and are not needed when
+        // comparing the actual elements (and not their owners)
+        // .$$typeof and ._store on just reasonable markers of elements
+
+        continue;
+      }
+
+      // all other properties should be traversed as usual
+      if (!equal(a[keys[i]], b[keys[i]])) return false;
+    }
+    // END: react-fast-compare
+
+    // START: fast-deep-equal
+    return true;
+  }
+
+  return a !== a && b !== b;
+}
+// end fast-deep-equal
+
+module.exports = function isEqual(a, b) {
+  try {
+    return equal(a, b);
+  } catch (error) {
+    if (((error.message || '').match(/stack|recursion/i))) {
+      // warn on circular references, don't crash
+      // browsers give this different errors name and messages:
+      // chrome/safari: "RangeError", "Maximum call stack size exceeded"
+      // firefox: "InternalError", too much recursion"
+      // edge: "Error", "Out of stack space"
+      console.warn('react-fast-compare cannot handle circular refs');
+      return false;
+    }
+    // some other error. we should definitely know about these
+    throw error;
+  }
+};
diff --git a/ddb_main/node_modules/react-helmet/es/Helmet.js b/ddb_main/node_modules/react-helmet/es/Helmet.js
new file mode 100644
index 0000000..11d745a
--- /dev/null
+++ b/ddb_main/node_modules/react-helmet/es/Helmet.js
@@ -0,0 +1,915 @@
+import PropTypes from 'prop-types';
+import withSideEffect from 'react-side-effect';
+import isEqual from 'react-fast-compare';
+import React from 'react';
+import objectAssign from 'object-assign';
+
+var ATTRIBUTE_NAMES = {
+    BODY: "bodyAttributes",
+    HTML: "htmlAttributes",
+    TITLE: "titleAttributes"
+};
+
+var TAG_NAMES = {
+    BASE: "base",
+    BODY: "body",
+    HEAD: "head",
+    HTML: "html",
+    LINK: "link",
+    META: "meta",
+    NOSCRIPT: "noscript",
+    SCRIPT: "script",
+    STYLE: "style",
+    TITLE: "title"
+};
+
+var VALID_TAG_NAMES = Object.keys(TAG_NAMES).map(function (name) {
+    return TAG_NAMES[name];
+});
+
+var TAG_PROPERTIES = {
+    CHARSET: "charset",
+    CSS_TEXT: "cssText",
+    HREF: "href",
+    HTTPEQUIV: "http-equiv",
+    INNER_HTML: "innerHTML",
+    ITEM_PROP: "itemprop",
+    NAME: "name",
+    PROPERTY: "property",
+    REL: "rel",
+    SRC: "src",
+    TARGET: "target"
+};
+
+var REACT_TAG_MAP = {
+    accesskey: "accessKey",
+    charset: "charSet",
+    class: "className",
+    contenteditable: "contentEditable",
+    contextmenu: "contextMenu",
+    "http-equiv": "httpEquiv",
+    itemprop: "itemProp",
+    tabindex: "tabIndex"
+};
+
+var HELMET_PROPS = {
+    DEFAULT_TITLE: "defaultTitle",
+    DEFER: "defer",
+    ENCODE_SPECIAL_CHARACTERS: "encodeSpecialCharacters",
+    ON_CHANGE_CLIENT_STATE: "onChangeClientState",
+    TITLE_TEMPLATE: "titleTemplate"
+};
+
+var HTML_TAG_MAP = Object.keys(REACT_TAG_MAP).reduce(function (obj, key) {
+    obj[REACT_TAG_MAP[key]] = key;
+    return obj;
+}, {});
+
+var SELF_CLOSING_TAGS = [TAG_NAMES.NOSCRIPT, TAG_NAMES.SCRIPT, TAG_NAMES.STYLE];
+
+var HELMET_ATTRIBUTE = "data-react-helmet";
+
+var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
+  return typeof obj;
+} : function (obj) {
+  return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+};
+
+var classCallCheck = function (instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
+  }
+};
+
+var createClass = function () {
+  function defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  return function (Constructor, protoProps, staticProps) {
+    if (protoProps) defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) defineProperties(Constructor, staticProps);
+    return Constructor;
+  };
+}();
+
+var _extends = Object.assign || function (target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i];
+
+    for (var key in source) {
+      if (Object.prototype.hasOwnProperty.call(source, key)) {
+        target[key] = source[key];
+      }
+    }
+  }
+
+  return target;
+};
+
+var inherits = function (subClass, superClass) {
+  if (typeof superClass !== "function" && superClass !== null) {
+    throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
+  }
+
+  subClass.prototype = Object.create(superClass && superClass.prototype, {
+    constructor: {
+      value: subClass,
+      enumerable: false,
+      writable: true,
+      configurable: true
+    }
+  });
+  if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
+};
+
+var objectWithoutProperties = function (obj, keys) {
+  var target = {};
+
+  for (var i in obj) {
+    if (keys.indexOf(i) >= 0) continue;
+    if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
+    target[i] = obj[i];
+  }
+
+  return target;
+};
+
+var possibleConstructorReturn = function (self, call) {
+  if (!self) {
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  }
+
+  return call && (typeof call === "object" || typeof call === "function") ? call : self;
+};
+
+var encodeSpecialCharacters = function encodeSpecialCharacters(str) {
+    var encode = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+
+    if (encode === false) {
+        return String(str);
+    }
+
+    return String(str).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#x27;");
+};
+
+var getTitleFromPropsList = function getTitleFromPropsList(propsList) {
+    var innermostTitle = getInnermostProperty(propsList, TAG_NAMES.TITLE);
+    var innermostTemplate = getInnermostProperty(propsList, HELMET_PROPS.TITLE_TEMPLATE);
+
+    if (innermostTemplate && innermostTitle) {
+        // use function arg to avoid need to escape $ characters
+        return innermostTemplate.replace(/%s/g, function () {
+            return Array.isArray(innermostTitle) ? innermostTitle.join("") : innermostTitle;
+        });
+    }
+
+    var innermostDefaultTitle = getInnermostProperty(propsList, HELMET_PROPS.DEFAULT_TITLE);
+
+    return innermostTitle || innermostDefaultTitle || undefined;
+};
+
+var getOnChangeClientState = function getOnChangeClientState(propsList) {
+    return getInnermostProperty(propsList, HELMET_PROPS.ON_CHANGE_CLIENT_STATE) || function () {};
+};
+
+var getAttributesFromPropsList = function getAttributesFromPropsList(tagType, propsList) {
+    return propsList.filter(function (props) {
+        return typeof props[tagType] !== "undefined";
+    }).map(function (props) {
+        return props[tagType];
+    }).reduce(function (tagAttrs, current) {
+        return _extends({}, tagAttrs, current);
+    }, {});
+};
+
+var getBaseTagFromPropsList = function getBaseTagFromPropsList(primaryAttributes, propsList) {
+    return propsList.filter(function (props) {
+        return typeof props[TAG_NAMES.BASE] !== "undefined";
+    }).map(function (props) {
+        return props[TAG_NAMES.BASE];
+    }).reverse().reduce(function (innermostBaseTag, tag) {
+        if (!innermostBaseTag.length) {
+            var keys = Object.keys(tag);
+
+            for (var i = 0; i < keys.length; i++) {
+                var attributeKey = keys[i];
+                var lowerCaseAttributeKey = attributeKey.toLowerCase();
+
+                if (primaryAttributes.indexOf(lowerCaseAttributeKey) !== -1 && tag[lowerCaseAttributeKey]) {
+                    return innermostBaseTag.concat(tag);
+                }
+            }
+        }
+
+        return innermostBaseTag;
+    }, []);
+};
+
+var getTagsFromPropsList = function getTagsFromPropsList(tagName, primaryAttributes, propsList) {
+    // Calculate list of tags, giving priority innermost component (end of the propslist)
+    var approvedSeenTags = {};
+
+    return propsList.filter(function (props) {
+        if (Array.isArray(props[tagName])) {
+            return true;
+        }
+        if (typeof props[tagName] !== "undefined") {
+            warn("Helmet: " + tagName + " should be of type \"Array\". Instead found type \"" + _typeof(props[tagName]) + "\"");
+        }
+        return false;
+    }).map(function (props) {
+        return props[tagName];
+    }).reverse().reduce(function (approvedTags, instanceTags) {
+        var instanceSeenTags = {};
+
+        instanceTags.filter(function (tag) {
+            var primaryAttributeKey = void 0;
+            var keys = Object.keys(tag);
+            for (var i = 0; i < keys.length; i++) {
+                var attributeKey = keys[i];
+                var lowerCaseAttributeKey = attributeKey.toLowerCase();
+
+                // Special rule with link tags, since rel and href are both primary tags, rel takes priority
+                if (primaryAttributes.indexOf(lowerCaseAttributeKey) !== -1 && !(primaryAttributeKey === TAG_PROPERTIES.REL && tag[primaryAttributeKey].toLowerCase() === "canonical") && !(lowerCaseAttributeKey === TAG_PROPERTIES.REL && tag[lowerCaseAttributeKey].toLowerCase() === "stylesheet")) {
+                    primaryAttributeKey = lowerCaseAttributeKey;
+                }
+                // Special case for innerHTML which doesn't work lowercased
+                if (primaryAttributes.indexOf(attributeKey) !== -1 && (attributeKey === TAG_PROPERTIES.INNER_HTML || attributeKey === TAG_PROPERTIES.CSS_TEXT || attributeKey === TAG_PROPERTIES.ITEM_PROP)) {
+                    primaryAttributeKey = attributeKey;
+                }
+            }
+
+            if (!primaryAttributeKey || !tag[primaryAttributeKey]) {
+                return false;
+            }
+
+            var value = tag[primaryAttributeKey].toLowerCase();
+
+            if (!approvedSeenTags[primaryAttributeKey]) {
+                approvedSeenTags[primaryAttributeKey] = {};
+            }
+
+            if (!instanceSeenTags[primaryAttributeKey]) {
+                instanceSeenTags[primaryAttributeKey] = {};
+            }
+
+            if (!approvedSeenTags[primaryAttributeKey][value]) {
+                instanceSeenTags[primaryAttributeKey][value] = true;
+                return true;
+            }
+
+            return false;
+        }).reverse().forEach(function (tag) {
+            return approvedTags.push(tag);
+        });
+
+        // Update seen tags with tags from this instance
+        var keys = Object.keys(instanceSeenTags);
+        for (var i = 0; i < keys.length; i++) {
+            var attributeKey = keys[i];
+            var tagUnion = objectAssign({}, approvedSeenTags[attributeKey], instanceSeenTags[attributeKey]);
+
+            approvedSeenTags[attributeKey] = tagUnion;
+        }
+
+        return approvedTags;
+    }, []).reverse();
+};
+
+var getInnermostProperty = function getInnermostProperty(propsList, property) {
+    for (var i = propsList.length - 1; i >= 0; i--) {
+        var props = propsList[i];
+
+        if (props.hasOwnProperty(property)) {
+            return props[property];
+        }
+    }
+
+    return null;
+};
+
+var reducePropsToState = function reducePropsToState(propsList) {
+    return {
+        baseTag: getBaseTagFromPropsList([TAG_PROPERTIES.HREF, TAG_PROPERTIES.TARGET], propsList),
+        bodyAttributes: getAttributesFromPropsList(ATTRIBUTE_NAMES.BODY, propsList),
+        defer: getInnermostProperty(propsList, HELMET_PROPS.DEFER),
+        encode: getInnermostProperty(propsList, HELMET_PROPS.ENCODE_SPECIAL_CHARACTERS),
+        htmlAttributes: getAttributesFromPropsList(ATTRIBUTE_NAMES.HTML, propsList),
+        linkTags: getTagsFromPropsList(TAG_NAMES.LINK, [TAG_PROPERTIES.REL, TAG_PROPERTIES.HREF], propsList),
+        metaTags: getTagsFromPropsList(TAG_NAMES.META, [TAG_PROPERTIES.NAME, TAG_PROPERTIES.CHARSET, TAG_PROPERTIES.HTTPEQUIV, TAG_PROPERTIES.PROPERTY, TAG_PROPERTIES.ITEM_PROP], propsList),
+        noscriptTags: getTagsFromPropsList(TAG_NAMES.NOSCRIPT, [TAG_PROPERTIES.INNER_HTML], propsList),
+        onChangeClientState: getOnChangeClientState(propsList),
+        scriptTags: getTagsFromPropsList(TAG_NAMES.SCRIPT, [TAG_PROPERTIES.SRC, TAG_PROPERTIES.INNER_HTML], propsList),
+        styleTags: getTagsFromPropsList(TAG_NAMES.STYLE, [TAG_PROPERTIES.CSS_TEXT], propsList),
+        title: getTitleFromPropsList(propsList),
+        titleAttributes: getAttributesFromPropsList(ATTRIBUTE_NAMES.TITLE, propsList)
+    };
+};
+
+var rafPolyfill = function () {
+    var clock = Date.now();
+
+    return function (callback) {
+        var currentTime = Date.now();
+
+        if (currentTime - clock > 16) {
+            clock = currentTime;
+            callback(currentTime);
+        } else {
+            setTimeout(function () {
+                rafPolyfill(callback);
+            }, 0);
+        }
+    };
+}();
+
+var cafPolyfill = function cafPolyfill(id) {
+    return clearTimeout(id);
+};
+
+var requestAnimationFrame = typeof window !== "undefined" ? window.requestAnimationFrame && window.requestAnimationFrame.bind(window) || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || rafPolyfill : global.requestAnimationFrame || rafPolyfill;
+
+var cancelAnimationFrame = typeof window !== "undefined" ? window.cancelAnimationFrame || window.webkitCancelAnimationFrame || window.mozCancelAnimationFrame || cafPolyfill : global.cancelAnimationFrame || cafPolyfill;
+
+var warn = function warn(msg) {
+    return console && typeof console.warn === "function" && console.warn(msg);
+};
+
+var _helmetCallback = null;
+
+var handleClientStateChange = function handleClientStateChange(newState) {
+    if (_helmetCallback) {
+        cancelAnimationFrame(_helmetCallback);
+    }
+
+    if (newState.defer) {
+        _helmetCallback = requestAnimationFrame(function () {
+            commitTagChanges(newState, function () {
+                _helmetCallback = null;
+            });
+        });
+    } else {
+        commitTagChanges(newState);
+        _helmetCallback = null;
+    }
+};
+
+var commitTagChanges = function commitTagChanges(newState, cb) {
+    var baseTag = newState.baseTag,
+        bodyAttributes = newState.bodyAttributes,
+        htmlAttributes = newState.htmlAttributes,
+        linkTags = newState.linkTags,
+        metaTags = newState.metaTags,
+        noscriptTags = newState.noscriptTags,
+        onChangeClientState = newState.onChangeClientState,
+        scriptTags = newState.scriptTags,
+        styleTags = newState.styleTags,
+        title = newState.title,
+        titleAttributes = newState.titleAttributes;
+
+    updateAttributes(TAG_NAMES.BODY, bodyAttributes);
+    updateAttributes(TAG_NAMES.HTML, htmlAttributes);
+
+    updateTitle(title, titleAttributes);
+
+    var tagUpdates = {
+        baseTag: updateTags(TAG_NAMES.BASE, baseTag),
+        linkTags: updateTags(TAG_NAMES.LINK, linkTags),
+        metaTags: updateTags(TAG_NAMES.META, metaTags),
+        noscriptTags: updateTags(TAG_NAMES.NOSCRIPT, noscriptTags),
+        scriptTags: updateTags(TAG_NAMES.SCRIPT, scriptTags),
+        styleTags: updateTags(TAG_NAMES.STYLE, styleTags)
+    };
+
+    var addedTags = {};
+    var removedTags = {};
+
+    Object.keys(tagUpdates).forEach(function (tagType) {
+        var _tagUpdates$tagType = tagUpdates[tagType],
+            newTags = _tagUpdates$tagType.newTags,
+            oldTags = _tagUpdates$tagType.oldTags;
+
+
+        if (newTags.length) {
+            addedTags[tagType] = newTags;
+        }
+        if (oldTags.length) {
+            removedTags[tagType] = tagUpdates[tagType].oldTags;
+        }
+    });
+
+    cb && cb();
+
+    onChangeClientState(newState, addedTags, removedTags);
+};
+
+var flattenArray = function flattenArray(possibleArray) {
+    return Array.isArray(possibleArray) ? possibleArray.join("") : possibleArray;
+};
+
+var updateTitle = function updateTitle(title, attributes) {
+    if (typeof title !== "undefined" && document.title !== title) {
+        document.title = flattenArray(title);
+    }
+
+    updateAttributes(TAG_NAMES.TITLE, attributes);
+};
+
+var updateAttributes = function updateAttributes(tagName, attributes) {
+    var elementTag = document.getElementsByTagName(tagName)[0];
+
+    if (!elementTag) {
+        return;
+    }
+
+    var helmetAttributeString = elementTag.getAttribute(HELMET_ATTRIBUTE);
+    var helmetAttributes = helmetAttributeString ? helmetAttributeString.split(",") : [];
+    var attributesToRemove = [].concat(helmetAttributes);
+    var attributeKeys = Object.keys(attributes);
+
+    for (var i = 0; i < attributeKeys.length; i++) {
+        var attribute = attributeKeys[i];
+        var value = attributes[attribute] || "";
+
+        if (elementTag.getAttribute(attribute) !== value) {
+            elementTag.setAttribute(attribute, value);
+        }
+
+        if (helmetAttributes.indexOf(attribute) === -1) {
+            helmetAttributes.push(attribute);
+        }
+
+        var indexToSave = attributesToRemove.indexOf(attribute);
+        if (indexToSave !== -1) {
+            attributesToRemove.splice(indexToSave, 1);
+        }
+    }
+
+    for (var _i = attributesToRemove.length - 1; _i >= 0; _i--) {
+        elementTag.removeAttribute(attributesToRemove[_i]);
+    }
+
+    if (helmetAttributes.length === attributesToRemove.length) {
+        elementTag.removeAttribute(HELMET_ATTRIBUTE);
+    } else if (elementTag.getAttribute(HELMET_ATTRIBUTE) !== attributeKeys.join(",")) {
+        elementTag.setAttribute(HELMET_ATTRIBUTE, attributeKeys.join(","));
+    }
+};
+
+var updateTags = function updateTags(type, tags) {
+    var headElement = document.head || document.querySelector(TAG_NAMES.HEAD);
+    var tagNodes = headElement.querySelectorAll(type + "[" + HELMET_ATTRIBUTE + "]");
+    var oldTags = Array.prototype.slice.call(tagNodes);
+    var newTags = [];
+    var indexToDelete = void 0;
+
+    if (tags && tags.length) {
+        tags.forEach(function (tag) {
+            var newElement = document.createElement(type);
+
+            for (var attribute in tag) {
+                if (tag.hasOwnProperty(attribute)) {
+                    if (attribute === TAG_PROPERTIES.INNER_HTML) {
+                        newElement.innerHTML = tag.innerHTML;
+                    } else if (attribute === TAG_PROPERTIES.CSS_TEXT) {
+                        if (newElement.styleSheet) {
+                            newElement.styleSheet.cssText = tag.cssText;
+                        } else {
+                            newElement.appendChild(document.createTextNode(tag.cssText));
+                        }
+                    } else {
+                        var value = typeof tag[attribute] === "undefined" ? "" : tag[attribute];
+                        newElement.setAttribute(attribute, value);
+                    }
+                }
+            }
+
+            newElement.setAttribute(HELMET_ATTRIBUTE, "true");
+
+            // Remove a duplicate tag from domTagstoRemove, so it isn't cleared.
+            if (oldTags.some(function (existingTag, index) {
+                indexToDelete = index;
+                return newElement.isEqualNode(existingTag);
+            })) {
+                oldTags.splice(indexToDelete, 1);
+            } else {
+                newTags.push(newElement);
+            }
+        });
+    }
+
+    oldTags.forEach(function (tag) {
+        return tag.parentNode.removeChild(tag);
+    });
+    newTags.forEach(function (tag) {
+        return headElement.appendChild(tag);
+    });
+
+    return {
+        oldTags: oldTags,
+        newTags: newTags
+    };
+};
+
+var generateElementAttributesAsString = function generateElementAttributesAsString(attributes) {
+    return Object.keys(attributes).reduce(function (str, key) {
+        var attr = typeof attributes[key] !== "undefined" ? key + "=\"" + attributes[key] + "\"" : "" + key;
+        return str ? str + " " + attr : attr;
+    }, "");
+};
+
+var generateTitleAsString = function generateTitleAsString(type, title, attributes, encode) {
+    var attributeString = generateElementAttributesAsString(attributes);
+    var flattenedTitle = flattenArray(title);
+    return attributeString ? "<" + type + " " + HELMET_ATTRIBUTE + "=\"true\" " + attributeString + ">" + encodeSpecialCharacters(flattenedTitle, encode) + "</" + type + ">" : "<" + type + " " + HELMET_ATTRIBUTE + "=\"true\">" + encodeSpecialCharacters(flattenedTitle, encode) + "</" + type + ">";
+};
+
+var generateTagsAsString = function generateTagsAsString(type, tags, encode) {
+    return tags.reduce(function (str, tag) {
+        var attributeHtml = Object.keys(tag).filter(function (attribute) {
+            return !(attribute === TAG_PROPERTIES.INNER_HTML || attribute === TAG_PROPERTIES.CSS_TEXT);
+        }).reduce(function (string, attribute) {
+            var attr = typeof tag[attribute] === "undefined" ? attribute : attribute + "=\"" + encodeSpecialCharacters(tag[attribute], encode) + "\"";
+            return string ? string + " " + attr : attr;
+        }, "");
+
+        var tagContent = tag.innerHTML || tag.cssText || "";
+
+        var isSelfClosing = SELF_CLOSING_TAGS.indexOf(type) === -1;
+
+        return str + "<" + type + " " + HELMET_ATTRIBUTE + "=\"true\" " + attributeHtml + (isSelfClosing ? "/>" : ">" + tagContent + "</" + type + ">");
+    }, "");
+};
+
+var convertElementAttributestoReactProps = function convertElementAttributestoReactProps(attributes) {
+    var initProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
+    return Object.keys(attributes).reduce(function (obj, key) {
+        obj[REACT_TAG_MAP[key] || key] = attributes[key];
+        return obj;
+    }, initProps);
+};
+
+var convertReactPropstoHtmlAttributes = function convertReactPropstoHtmlAttributes(props) {
+    var initAttributes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
+    return Object.keys(props).reduce(function (obj, key) {
+        obj[HTML_TAG_MAP[key] || key] = props[key];
+        return obj;
+    }, initAttributes);
+};
+
+var generateTitleAsReactComponent = function generateTitleAsReactComponent(type, title, attributes) {
+    var _initProps;
+
+    // assigning into an array to define toString function on it
+    var initProps = (_initProps = {
+        key: title
+    }, _initProps[HELMET_ATTRIBUTE] = true, _initProps);
+    var props = convertElementAttributestoReactProps(attributes, initProps);
+
+    return [React.createElement(TAG_NAMES.TITLE, props, title)];
+};
+
+var generateTagsAsReactComponent = function generateTagsAsReactComponent(type, tags) {
+    return tags.map(function (tag, i) {
+        var _mappedTag;
+
+        var mappedTag = (_mappedTag = {
+            key: i
+        }, _mappedTag[HELMET_ATTRIBUTE] = true, _mappedTag);
+
+        Object.keys(tag).forEach(function (attribute) {
+            var mappedAttribute = REACT_TAG_MAP[attribute] || attribute;
+
+            if (mappedAttribute === TAG_PROPERTIES.INNER_HTML || mappedAttribute === TAG_PROPERTIES.CSS_TEXT) {
+                var content = tag.innerHTML || tag.cssText;
+                mappedTag.dangerouslySetInnerHTML = { __html: content };
+            } else {
+                mappedTag[mappedAttribute] = tag[attribute];
+            }
+        });
+
+        return React.createElement(type, mappedTag);
+    });
+};
+
+var getMethodsForTag = function getMethodsForTag(type, tags, encode) {
+    switch (type) {
+        case TAG_NAMES.TITLE:
+            return {
+                toComponent: function toComponent() {
+                    return generateTitleAsReactComponent(type, tags.title, tags.titleAttributes, encode);
+                },
+                toString: function toString() {
+                    return generateTitleAsString(type, tags.title, tags.titleAttributes, encode);
+                }
+            };
+        case ATTRIBUTE_NAMES.BODY:
+        case ATTRIBUTE_NAMES.HTML:
+            return {
+                toComponent: function toComponent() {
+                    return convertElementAttributestoReactProps(tags);
+                },
+                toString: function toString() {
+                    return generateElementAttributesAsString(tags);
+                }
+            };
+        default:
+            return {
+                toComponent: function toComponent() {
+                    return generateTagsAsReactComponent(type, tags);
+                },
+                toString: function toString() {
+                    return generateTagsAsString(type, tags, encode);
+                }
+            };
+    }
+};
+
+var mapStateOnServer = function mapStateOnServer(_ref) {
+    var baseTag = _ref.baseTag,
+        bodyAttributes = _ref.bodyAttributes,
+        encode = _ref.encode,
+        htmlAttributes = _ref.htmlAttributes,
+        linkTags = _ref.linkTags,
+        metaTags = _ref.metaTags,
+        noscriptTags = _ref.noscriptTags,
+        scriptTags = _ref.scriptTags,
+        styleTags = _ref.styleTags,
+        _ref$title = _ref.title,
+        title = _ref$title === undefined ? "" : _ref$title,
+        titleAttributes = _ref.titleAttributes;
+    return {
+        base: getMethodsForTag(TAG_NAMES.BASE, baseTag, encode),
+        bodyAttributes: getMethodsForTag(ATTRIBUTE_NAMES.BODY, bodyAttributes, encode),
+        htmlAttributes: getMethodsForTag(ATTRIBUTE_NAMES.HTML, htmlAttributes, encode),
+        link: getMethodsForTag(TAG_NAMES.LINK, linkTags, encode),
+        meta: getMethodsForTag(TAG_NAMES.META, metaTags, encode),
+        noscript: getMethodsForTag(TAG_NAMES.NOSCRIPT, noscriptTags, encode),
+        script: getMethodsForTag(TAG_NAMES.SCRIPT, scriptTags, encode),
+        style: getMethodsForTag(TAG_NAMES.STYLE, styleTags, encode),
+        title: getMethodsForTag(TAG_NAMES.TITLE, { title: title, titleAttributes: titleAttributes }, encode)
+    };
+};
+
+var Helmet = function Helmet(Component) {
+    var _class, _temp;
+
+    return _temp = _class = function (_React$Component) {
+        inherits(HelmetWrapper, _React$Component);
+
+        function HelmetWrapper() {
+            classCallCheck(this, HelmetWrapper);
+            return possibleConstructorReturn(this, _React$Component.apply(this, arguments));
+        }
+
+        HelmetWrapper.prototype.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
+            return !isEqual(this.props, nextProps);
+        };
+
+        HelmetWrapper.prototype.mapNestedChildrenToProps = function mapNestedChildrenToProps(child, nestedChildren) {
+            if (!nestedChildren) {
+                return null;
+            }
+
+            switch (child.type) {
+                case TAG_NAMES.SCRIPT:
+                case TAG_NAMES.NOSCRIPT:
+                    return {
+                        innerHTML: nestedChildren
+                    };
+
+                case TAG_NAMES.STYLE:
+                    return {
+                        cssText: nestedChildren
+                    };
+            }
+
+            throw new Error("<" + child.type + " /> elements are self-closing and can not contain children. Refer to our API for more information.");
+        };
+
+        HelmetWrapper.prototype.flattenArrayTypeChildren = function flattenArrayTypeChildren(_ref) {
+            var _babelHelpers$extends;
+
+            var child = _ref.child,
+                arrayTypeChildren = _ref.arrayTypeChildren,
+                newChildProps = _ref.newChildProps,
+                nestedChildren = _ref.nestedChildren;
+
+            return _extends({}, arrayTypeChildren, (_babelHelpers$extends = {}, _babelHelpers$extends[child.type] = [].concat(arrayTypeChildren[child.type] || [], [_extends({}, newChildProps, this.mapNestedChildrenToProps(child, nestedChildren))]), _babelHelpers$extends));
+        };
+
+        HelmetWrapper.prototype.mapObjectTypeChildren = function mapObjectTypeChildren(_ref2) {
+            var _babelHelpers$extends2, _babelHelpers$extends3;
+
+            var child = _ref2.child,
+                newProps = _ref2.newProps,
+                newChildProps = _ref2.newChildProps,
+                nestedChildren = _ref2.nestedChildren;
+
+            switch (child.type) {
+                case TAG_NAMES.TITLE:
+                    return _extends({}, newProps, (_babelHelpers$extends2 = {}, _babelHelpers$extends2[child.type] = nestedChildren, _babelHelpers$extends2.titleAttributes = _extends({}, newChildProps), _babelHelpers$extends2));
+
+                case TAG_NAMES.BODY:
+                    return _extends({}, newProps, {
+                        bodyAttributes: _extends({}, newChildProps)
+                    });
+
+                case TAG_NAMES.HTML:
+                    return _extends({}, newProps, {
+                        htmlAttributes: _extends({}, newChildProps)
+                    });
+            }
+
+            return _extends({}, newProps, (_babelHelpers$extends3 = {}, _babelHelpers$extends3[child.type] = _extends({}, newChildProps), _babelHelpers$extends3));
+        };
+
+        HelmetWrapper.prototype.mapArrayTypeChildrenToProps = function mapArrayTypeChildrenToProps(arrayTypeChildren, newProps) {
+            var newFlattenedProps = _extends({}, newProps);
+
+            Object.keys(arrayTypeChildren).forEach(function (arrayChildName) {
+                var _babelHelpers$extends4;
+
+                newFlattenedProps = _extends({}, newFlattenedProps, (_babelHelpers$extends4 = {}, _babelHelpers$extends4[arrayChildName] = arrayTypeChildren[arrayChildName], _babelHelpers$extends4));
+            });
+
+            return newFlattenedProps;
+        };
+
+        HelmetWrapper.prototype.warnOnInvalidChildren = function warnOnInvalidChildren(child, nestedChildren) {
+            if (process.env.NODE_ENV !== "production") {
+                if (!VALID_TAG_NAMES.some(function (name) {
+                    return child.type === name;
+                })) {
+                    if (typeof child.type === "function") {
+                        return warn("You may be attempting to nest <Helmet> components within each other, which is not allowed. Refer to our API for more information.");
+                    }
+
+                    return warn("Only elements types " + VALID_TAG_NAMES.join(", ") + " are allowed. Helmet does not support rendering <" + child.type + "> elements. Refer to our API for more information.");
+                }
+
+                if (nestedChildren && typeof nestedChildren !== "string" && (!Array.isArray(nestedChildren) || nestedChildren.some(function (nestedChild) {
+                    return typeof nestedChild !== "string";
+                }))) {
+                    throw new Error("Helmet expects a string as a child of <" + child.type + ">. Did you forget to wrap your children in braces? ( <" + child.type + ">{``}</" + child.type + "> ) Refer to our API for more information.");
+                }
+            }
+
+            return true;
+        };
+
+        HelmetWrapper.prototype.mapChildrenToProps = function mapChildrenToProps(children, newProps) {
+            var _this2 = this;
+
+            var arrayTypeChildren = {};
+
+            React.Children.forEach(children, function (child) {
+                if (!child || !child.props) {
+                    return;
+                }
+
+                var _child$props = child.props,
+                    nestedChildren = _child$props.children,
+                    childProps = objectWithoutProperties(_child$props, ["children"]);
+
+                var newChildProps = convertReactPropstoHtmlAttributes(childProps);
+
+                _this2.warnOnInvalidChildren(child, nestedChildren);
+
+                switch (child.type) {
+                    case TAG_NAMES.LINK:
+                    case TAG_NAMES.META:
+                    case TAG_NAMES.NOSCRIPT:
+                    case TAG_NAMES.SCRIPT:
+                    case TAG_NAMES.STYLE:
+                        arrayTypeChildren = _this2.flattenArrayTypeChildren({
+                            child: child,
+                            arrayTypeChildren: arrayTypeChildren,
+                            newChildProps: newChildProps,
+                            nestedChildren: nestedChildren
+                        });
+                        break;
+
+                    default:
+                        newProps = _this2.mapObjectTypeChildren({
+                            child: child,
+                            newProps: newProps,
+                            newChildProps: newChildProps,
+                            nestedChildren: nestedChildren
+                        });
+                        break;
+                }
+            });
+
+            newProps = this.mapArrayTypeChildrenToProps(arrayTypeChildren, newProps);
+            return newProps;
+        };
+
+        HelmetWrapper.prototype.render = function render() {
+            var _props = this.props,
+                children = _props.children,
+                props = objectWithoutProperties(_props, ["children"]);
+
+            var newProps = _extends({}, props);
+
+            if (children) {
+                newProps = this.mapChildrenToProps(children, newProps);
+            }
+
+            return React.createElement(Component, newProps);
+        };
+
+        createClass(HelmetWrapper, null, [{
+            key: "canUseDOM",
+
+
+            // Component.peek comes from react-side-effect:
+            // For testing, you may use a static peek() method available on the returned component.
+            // It lets you get the current state without resetting the mounted instance stack.
+            // Don’t use it for anything other than testing.
+
+            /**
+             * @param {Object} base: {"target": "_blank", "href": "http://mysite.com/"}
+             * @param {Object} bodyAttributes: {"className": "root"}
+             * @param {String} defaultTitle: "Default Title"
+             * @param {Boolean} defer: true
+             * @param {Boolean} encodeSpecialCharacters: true
+             * @param {Object} htmlAttributes: {"lang": "en", "amp": undefined}
+             * @param {Array} link: [{"rel": "canonical", "href": "http://mysite.com/example"}]
+             * @param {Array} meta: [{"name": "description", "content": "Test description"}]
+             * @param {Array} noscript: [{"innerHTML": "<img src='http://mysite.com/js/test.js'"}]
+             * @param {Function} onChangeClientState: "(newState) => console.log(newState)"
+             * @param {Array} script: [{"type": "text/javascript", "src": "http://mysite.com/js/test.js"}]
+             * @param {Array} style: [{"type": "text/css", "cssText": "div { display: block; color: blue; }"}]
+             * @param {String} title: "Title"
+             * @param {Object} titleAttributes: {"itemprop": "name"}
+             * @param {String} titleTemplate: "MySite.com - %s"
+             */
+            set: function set$$1(canUseDOM) {
+                Component.canUseDOM = canUseDOM;
+            }
+        }]);
+        return HelmetWrapper;
+    }(React.Component), _class.propTypes = {
+        base: PropTypes.object,
+        bodyAttributes: PropTypes.object,
+        children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),
+        defaultTitle: PropTypes.string,
+        defer: PropTypes.bool,
+        encodeSpecialCharacters: PropTypes.bool,
+        htmlAttributes: PropTypes.object,
+        link: PropTypes.arrayOf(PropTypes.object),
+        meta: PropTypes.arrayOf(PropTypes.object),
+        noscript: PropTypes.arrayOf(PropTypes.object),
+        onChangeClientState: PropTypes.func,
+        script: PropTypes.arrayOf(PropTypes.object),
+        style: PropTypes.arrayOf(PropTypes.object),
+        title: PropTypes.string,
+        titleAttributes: PropTypes.object,
+        titleTemplate: PropTypes.string
+    }, _class.defaultProps = {
+        defer: true,
+        encodeSpecialCharacters: true
+    }, _class.peek = Component.peek, _class.rewind = function () {
+        var mappedState = Component.rewind();
+        if (!mappedState) {
+            // provide fallback if mappedState is undefined
+            mappedState = mapStateOnServer({
+                baseTag: [],
+                bodyAttributes: {},
+                encodeSpecialCharacters: true,
+                htmlAttributes: {},
+                linkTags: [],
+                metaTags: [],
+                noscriptTags: [],
+                scriptTags: [],
+                styleTags: [],
+                title: "",
+                titleAttributes: {}
+            });
+        }
+
+        return mappedState;
+    }, _temp;
+};
+
+var NullComponent = function NullComponent() {
+    return null;
+};
+
+var HelmetSideEffects = withSideEffect(reducePropsToState, handleClientStateChange, mapStateOnServer)(NullComponent);
+
+var HelmetExport = Helmet(HelmetSideEffects);
+HelmetExport.renderStatic = HelmetExport.rewind;
+
+export default HelmetExport;
+export { HelmetExport as Helmet };
diff --git a/ddb_main/node_modules/react-is/cjs/react-is.production.min.js b/ddb_main/node_modules/react-is/cjs/react-is.production.min.js
new file mode 100644
index 0000000..f2322cb
--- /dev/null
+++ b/ddb_main/node_modules/react-is/cjs/react-is.production.min.js
@@ -0,0 +1,14 @@
+/**
+ * @license React
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';var b=Symbol.for("react.element"),c=Symbol.for("react.portal"),d=Symbol.for("react.fragment"),e=Symbol.for("react.strict_mode"),f=Symbol.for("react.profiler"),g=Symbol.for("react.provider"),h=Symbol.for("react.context"),k=Symbol.for("react.server_context"),l=Symbol.for("react.forward_ref"),m=Symbol.for("react.suspense"),n=Symbol.for("react.suspense_list"),p=Symbol.for("react.memo"),q=Symbol.for("react.lazy"),t=Symbol.for("react.offscreen"),u;u=Symbol.for("react.module.reference");
+function v(a){if("object"===typeof a&&null!==a){var r=a.$$typeof;switch(r){case b:switch(a=a.type,a){case d:case f:case e:case m:case n:return a;default:switch(a=a&&a.$$typeof,a){case k:case h:case l:case q:case p:case g:return a;default:return r}}case c:return r}}}exports.ContextConsumer=h;exports.ContextProvider=g;exports.Element=b;exports.ForwardRef=l;exports.Fragment=d;exports.Lazy=q;exports.Memo=p;exports.Portal=c;exports.Profiler=f;exports.StrictMode=e;exports.Suspense=m;
+exports.SuspenseList=n;exports.isAsyncMode=function(){return!1};exports.isConcurrentMode=function(){return!1};exports.isContextConsumer=function(a){return v(a)===h};exports.isContextProvider=function(a){return v(a)===g};exports.isElement=function(a){return"object"===typeof a&&null!==a&&a.$$typeof===b};exports.isForwardRef=function(a){return v(a)===l};exports.isFragment=function(a){return v(a)===d};exports.isLazy=function(a){return v(a)===q};exports.isMemo=function(a){return v(a)===p};
+exports.isPortal=function(a){return v(a)===c};exports.isProfiler=function(a){return v(a)===f};exports.isStrictMode=function(a){return v(a)===e};exports.isSuspense=function(a){return v(a)===m};exports.isSuspenseList=function(a){return v(a)===n};
+exports.isValidElementType=function(a){return"string"===typeof a||"function"===typeof a||a===d||a===f||a===e||a===m||a===n||a===t||"object"===typeof a&&null!==a&&(a.$$typeof===q||a.$$typeof===p||a.$$typeof===g||a.$$typeof===h||a.$$typeof===l||a.$$typeof===u||void 0!==a.getModuleId)?!0:!1};exports.typeOf=v;
diff --git a/ddb_main/node_modules/react-is/index.js b/ddb_main/node_modules/react-is/index.js
new file mode 100644
index 0000000..3ae098d
--- /dev/null
+++ b/ddb_main/node_modules/react-is/index.js
@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-is.production.min.js');
+} else {
+  module.exports = require('./cjs/react-is.development.js');
+}
diff --git a/ddb_main/node_modules/react-lifecycles-compat/react-lifecycles-compat.es.js b/ddb_main/node_modules/react-lifecycles-compat/react-lifecycles-compat.es.js
new file mode 100644
index 0000000..6e12c77
--- /dev/null
+++ b/ddb_main/node_modules/react-lifecycles-compat/react-lifecycles-compat.es.js
@@ -0,0 +1,158 @@
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+function componentWillMount() {
+  // Call this.constructor.gDSFP to support sub-classes.
+  var state = this.constructor.getDerivedStateFromProps(this.props, this.state);
+  if (state !== null && state !== undefined) {
+    this.setState(state);
+  }
+}
+
+function componentWillReceiveProps(nextProps) {
+  // Call this.constructor.gDSFP to support sub-classes.
+  // Use the setState() updater to ensure state isn't stale in certain edge cases.
+  function updater(prevState) {
+    var state = this.constructor.getDerivedStateFromProps(nextProps, prevState);
+    return state !== null && state !== undefined ? state : null;
+  }
+  // Binding "this" is important for shallow renderer support.
+  this.setState(updater.bind(this));
+}
+
+function componentWillUpdate(nextProps, nextState) {
+  try {
+    var prevProps = this.props;
+    var prevState = this.state;
+    this.props = nextProps;
+    this.state = nextState;
+    this.__reactInternalSnapshotFlag = true;
+    this.__reactInternalSnapshot = this.getSnapshotBeforeUpdate(
+      prevProps,
+      prevState
+    );
+  } finally {
+    this.props = prevProps;
+    this.state = prevState;
+  }
+}
+
+// React may warn about cWM/cWRP/cWU methods being deprecated.
+// Add a flag to suppress these warnings for this special case.
+componentWillMount.__suppressDeprecationWarning = true;
+componentWillReceiveProps.__suppressDeprecationWarning = true;
+componentWillUpdate.__suppressDeprecationWarning = true;
+
+function polyfill(Component) {
+  var prototype = Component.prototype;
+
+  if (!prototype || !prototype.isReactComponent) {
+    throw new Error('Can only polyfill class components');
+  }
+
+  if (
+    typeof Component.getDerivedStateFromProps !== 'function' &&
+    typeof prototype.getSnapshotBeforeUpdate !== 'function'
+  ) {
+    return Component;
+  }
+
+  // If new component APIs are defined, "unsafe" lifecycles won't be called.
+  // Error if any of these lifecycles are present,
+  // Because they would work differently between older and newer (16.3+) versions of React.
+  var foundWillMountName = null;
+  var foundWillReceivePropsName = null;
+  var foundWillUpdateName = null;
+  if (typeof prototype.componentWillMount === 'function') {
+    foundWillMountName = 'componentWillMount';
+  } else if (typeof prototype.UNSAFE_componentWillMount === 'function') {
+    foundWillMountName = 'UNSAFE_componentWillMount';
+  }
+  if (typeof prototype.componentWillReceiveProps === 'function') {
+    foundWillReceivePropsName = 'componentWillReceiveProps';
+  } else if (typeof prototype.UNSAFE_componentWillReceiveProps === 'function') {
+    foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps';
+  }
+  if (typeof prototype.componentWillUpdate === 'function') {
+    foundWillUpdateName = 'componentWillUpdate';
+  } else if (typeof prototype.UNSAFE_componentWillUpdate === 'function') {
+    foundWillUpdateName = 'UNSAFE_componentWillUpdate';
+  }
+  if (
+    foundWillMountName !== null ||
+    foundWillReceivePropsName !== null ||
+    foundWillUpdateName !== null
+  ) {
+    var componentName = Component.displayName || Component.name;
+    var newApiName =
+      typeof Component.getDerivedStateFromProps === 'function'
+        ? 'getDerivedStateFromProps()'
+        : 'getSnapshotBeforeUpdate()';
+
+    throw Error(
+      'Unsafe legacy lifecycles will not be called for components using new component APIs.\n\n' +
+        componentName +
+        ' uses ' +
+        newApiName +
+        ' but also contains the following legacy lifecycles:' +
+        (foundWillMountName !== null ? '\n  ' + foundWillMountName : '') +
+        (foundWillReceivePropsName !== null
+          ? '\n  ' + foundWillReceivePropsName
+          : '') +
+        (foundWillUpdateName !== null ? '\n  ' + foundWillUpdateName : '') +
+        '\n\nThe above lifecycles should be removed. Learn more about this warning here:\n' +
+        'https://fb.me/react-async-component-lifecycle-hooks'
+    );
+  }
+
+  // React <= 16.2 does not support static getDerivedStateFromProps.
+  // As a workaround, use cWM and cWRP to invoke the new static lifecycle.
+  // Newer versions of React will ignore these lifecycles if gDSFP exists.
+  if (typeof Component.getDerivedStateFromProps === 'function') {
+    prototype.componentWillMount = componentWillMount;
+    prototype.componentWillReceiveProps = componentWillReceiveProps;
+  }
+
+  // React <= 16.2 does not support getSnapshotBeforeUpdate.
+  // As a workaround, use cWU to invoke the new lifecycle.
+  // Newer versions of React will ignore that lifecycle if gSBU exists.
+  if (typeof prototype.getSnapshotBeforeUpdate === 'function') {
+    if (typeof prototype.componentDidUpdate !== 'function') {
+      throw new Error(
+        'Cannot polyfill getSnapshotBeforeUpdate() for components that do not define componentDidUpdate() on the prototype'
+      );
+    }
+
+    prototype.componentWillUpdate = componentWillUpdate;
+
+    var componentDidUpdate = prototype.componentDidUpdate;
+
+    prototype.componentDidUpdate = function componentDidUpdatePolyfill(
+      prevProps,
+      prevState,
+      maybeSnapshot
+    ) {
+      // 16.3+ will not execute our will-update method;
+      // It will pass a snapshot value to did-update though.
+      // Older versions will require our polyfilled will-update value.
+      // We need to handle both cases, but can't just check for the presence of "maybeSnapshot",
+      // Because for <= 15.x versions this might be a "prevContext" object.
+      // We also can't just check "__reactInternalSnapshot",
+      // Because get-snapshot might return a falsy value.
+      // So check for the explicit __reactInternalSnapshotFlag flag to determine behavior.
+      var snapshot = this.__reactInternalSnapshotFlag
+        ? this.__reactInternalSnapshot
+        : maybeSnapshot;
+
+      componentDidUpdate.call(this, prevProps, prevState, snapshot);
+    };
+  }
+
+  return Component;
+}
+
+export { polyfill };
diff --git a/ddb_main/node_modules/react-modal/lib/components/Modal.js b/ddb_main/node_modules/react-modal/lib/components/Modal.js
new file mode 100644
index 0000000..ae58ada
--- /dev/null
+++ b/ddb_main/node_modules/react-modal/lib/components/Modal.js
@@ -0,0 +1,300 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.bodyOpenClassName = exports.portalClassName = undefined;
+
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _react = require("react");
+
+var _react2 = _interopRequireDefault(_react);
+
+var _reactDom = require("react-dom");
+
+var _reactDom2 = _interopRequireDefault(_reactDom);
+
+var _propTypes = require("prop-types");
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
+var _ModalPortal = require("./ModalPortal");
+
+var _ModalPortal2 = _interopRequireDefault(_ModalPortal);
+
+var _ariaAppHider = require("../helpers/ariaAppHider");
+
+var ariaAppHider = _interopRequireWildcard(_ariaAppHider);
+
+var _safeHTMLElement = require("../helpers/safeHTMLElement");
+
+var _safeHTMLElement2 = _interopRequireDefault(_safeHTMLElement);
+
+var _reactLifecyclesCompat = require("react-lifecycles-compat");
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var portalClassName = exports.portalClassName = "ReactModalPortal";
+var bodyOpenClassName = exports.bodyOpenClassName = "ReactModal__Body--open";
+
+var isReact16 = _safeHTMLElement.canUseDOM && _reactDom2.default.createPortal !== undefined;
+
+var createHTMLElement = function createHTMLElement(name) {
+  return document.createElement(name);
+};
+
+var getCreatePortal = function getCreatePortal() {
+  return isReact16 ? _reactDom2.default.createPortal : _reactDom2.default.unstable_renderSubtreeIntoContainer;
+};
+
+function getParentElement(parentSelector) {
+  return parentSelector();
+}
+
+var Modal = function (_Component) {
+  _inherits(Modal, _Component);
+
+  function Modal() {
+    var _ref;
+
+    var _temp, _this, _ret;
+
+    _classCallCheck(this, Modal);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = Modal.__proto__ || Object.getPrototypeOf(Modal)).call.apply(_ref, [this].concat(args))), _this), _this.removePortal = function () {
+      !isReact16 && _reactDom2.default.unmountComponentAtNode(_this.node);
+      var parent = getParentElement(_this.props.parentSelector);
+      if (parent && parent.contains(_this.node)) {
+        parent.removeChild(_this.node);
+      } else {
+        // eslint-disable-next-line no-console
+        console.warn('React-Modal: "parentSelector" prop did not returned any DOM ' + "element. Make sure that the parent element is unmounted to " + "avoid any memory leaks.");
+      }
+    }, _this.portalRef = function (ref) {
+      _this.portal = ref;
+    }, _this.renderPortal = function (props) {
+      var createPortal = getCreatePortal();
+      var portal = createPortal(_this, _react2.default.createElement(_ModalPortal2.default, _extends({ defaultStyles: Modal.defaultStyles }, props)), _this.node);
+      _this.portalRef(portal);
+    }, _temp), _possibleConstructorReturn(_this, _ret);
+  }
+
+  _createClass(Modal, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      if (!_safeHTMLElement.canUseDOM) return;
+
+      if (!isReact16) {
+        this.node = createHTMLElement("div");
+      }
+      this.node.className = this.props.portalClassName;
+
+      var parent = getParentElement(this.props.parentSelector);
+      parent.appendChild(this.node);
+
+      !isReact16 && this.renderPortal(this.props);
+    }
+  }, {
+    key: "getSnapshotBeforeUpdate",
+    value: function getSnapshotBeforeUpdate(prevProps) {
+      var prevParent = getParentElement(prevProps.parentSelector);
+      var nextParent = getParentElement(this.props.parentSelector);
+      return { prevParent: prevParent, nextParent: nextParent };
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps, _, snapshot) {
+      if (!_safeHTMLElement.canUseDOM) return;
+      var _props = this.props,
+          isOpen = _props.isOpen,
+          portalClassName = _props.portalClassName;
+
+
+      if (prevProps.portalClassName !== portalClassName) {
+        this.node.className = portalClassName;
+      }
+
+      var prevParent = snapshot.prevParent,
+          nextParent = snapshot.nextParent;
+
+      if (nextParent !== prevParent) {
+        prevParent.removeChild(this.node);
+        nextParent.appendChild(this.node);
+      }
+
+      // Stop unnecessary renders if modal is remaining closed
+      if (!prevProps.isOpen && !isOpen) return;
+
+      !isReact16 && this.renderPortal(this.props);
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      if (!_safeHTMLElement.canUseDOM || !this.node || !this.portal) return;
+
+      var state = this.portal.state;
+      var now = Date.now();
+      var closesAt = state.isOpen && this.props.closeTimeoutMS && (state.closesAt || now + this.props.closeTimeoutMS);
+
+      if (closesAt) {
+        if (!state.beforeClose) {
+          this.portal.closeWithTimeout();
+        }
+
+        setTimeout(this.removePortal, closesAt - now);
+      } else {
+        this.removePortal();
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      if (!_safeHTMLElement.canUseDOM || !isReact16) {
+        return null;
+      }
+
+      if (!this.node && isReact16) {
+        this.node = createHTMLElement("div");
+      }
+
+      var createPortal = getCreatePortal();
+      return createPortal(_react2.default.createElement(_ModalPortal2.default, _extends({
+        ref: this.portalRef,
+        defaultStyles: Modal.defaultStyles
+      }, this.props)), this.node);
+    }
+  }], [{
+    key: "setAppElement",
+    value: function setAppElement(element) {
+      ariaAppHider.setElement(element);
+    }
+
+    /* eslint-disable react/no-unused-prop-types */
+
+    /* eslint-enable react/no-unused-prop-types */
+
+  }]);
+
+  return Modal;
+}(_react.Component);
+
+Modal.propTypes = {
+  isOpen: _propTypes2.default.bool.isRequired,
+  style: _propTypes2.default.shape({
+    content: _propTypes2.default.object,
+    overlay: _propTypes2.default.object
+  }),
+  portalClassName: _propTypes2.default.string,
+  bodyOpenClassName: _propTypes2.default.string,
+  htmlOpenClassName: _propTypes2.default.string,
+  className: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.shape({
+    base: _propTypes2.default.string.isRequired,
+    afterOpen: _propTypes2.default.string.isRequired,
+    beforeClose: _propTypes2.default.string.isRequired
+  })]),
+  overlayClassName: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.shape({
+    base: _propTypes2.default.string.isRequired,
+    afterOpen: _propTypes2.default.string.isRequired,
+    beforeClose: _propTypes2.default.string.isRequired
+  })]),
+  appElement: _propTypes2.default.oneOfType([_propTypes2.default.instanceOf(_safeHTMLElement2.default), _propTypes2.default.instanceOf(_safeHTMLElement.SafeHTMLCollection), _propTypes2.default.instanceOf(_safeHTMLElement.SafeNodeList), _propTypes2.default.arrayOf(_propTypes2.default.instanceOf(_safeHTMLElement2.default))]),
+  onAfterOpen: _propTypes2.default.func,
+  onRequestClose: _propTypes2.default.func,
+  closeTimeoutMS: _propTypes2.default.number,
+  ariaHideApp: _propTypes2.default.bool,
+  shouldFocusAfterRender: _propTypes2.default.bool,
+  shouldCloseOnOverlayClick: _propTypes2.default.bool,
+  shouldReturnFocusAfterClose: _propTypes2.default.bool,
+  preventScroll: _propTypes2.default.bool,
+  parentSelector: _propTypes2.default.func,
+  aria: _propTypes2.default.object,
+  data: _propTypes2.default.object,
+  role: _propTypes2.default.string,
+  contentLabel: _propTypes2.default.string,
+  shouldCloseOnEsc: _propTypes2.default.bool,
+  overlayRef: _propTypes2.default.func,
+  contentRef: _propTypes2.default.func,
+  id: _propTypes2.default.string,
+  overlayElement: _propTypes2.default.func,
+  contentElement: _propTypes2.default.func
+};
+Modal.defaultProps = {
+  isOpen: false,
+  portalClassName: portalClassName,
+  bodyOpenClassName: bodyOpenClassName,
+  role: "dialog",
+  ariaHideApp: true,
+  closeTimeoutMS: 0,
+  shouldFocusAfterRender: true,
+  shouldCloseOnEsc: true,
+  shouldCloseOnOverlayClick: true,
+  shouldReturnFocusAfterClose: true,
+  preventScroll: false,
+  parentSelector: function parentSelector() {
+    return document.body;
+  },
+  overlayElement: function overlayElement(props, contentEl) {
+    return _react2.default.createElement(
+      "div",
+      props,
+      contentEl
+    );
+  },
+  contentElement: function contentElement(props, children) {
+    return _react2.default.createElement(
+      "div",
+      props,
+      children
+    );
+  }
+};
+Modal.defaultStyles = {
+  overlay: {
+    position: "fixed",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    backgroundColor: "rgba(255, 255, 255, 0.75)"
+  },
+  content: {
+    position: "absolute",
+    top: "40px",
+    left: "40px",
+    right: "40px",
+    bottom: "40px",
+    border: "1px solid #ccc",
+    background: "#fff",
+    overflow: "auto",
+    WebkitOverflowScrolling: "touch",
+    borderRadius: "4px",
+    outline: "none",
+    padding: "20px"
+  }
+};
+
+
+(0, _reactLifecyclesCompat.polyfill)(Modal);
+
+if (process.env.NODE_ENV !== "production") {
+  Modal.setCreateHTMLElement = function (fn) {
+    return createHTMLElement = fn;
+  };
+}
+
+exports.default = Modal;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-modal/lib/components/ModalPortal.js b/ddb_main/node_modules/react-modal/lib/components/ModalPortal.js
new file mode 100644
index 0000000..d77a0ad
--- /dev/null
+++ b/ddb_main/node_modules/react-modal/lib/components/ModalPortal.js
@@ -0,0 +1,429 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _react = require("react");
+
+var _propTypes = require("prop-types");
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
+var _focusManager = require("../helpers/focusManager");
+
+var focusManager = _interopRequireWildcard(_focusManager);
+
+var _scopeTab = require("../helpers/scopeTab");
+
+var _scopeTab2 = _interopRequireDefault(_scopeTab);
+
+var _ariaAppHider = require("../helpers/ariaAppHider");
+
+var ariaAppHider = _interopRequireWildcard(_ariaAppHider);
+
+var _classList = require("../helpers/classList");
+
+var classList = _interopRequireWildcard(_classList);
+
+var _safeHTMLElement = require("../helpers/safeHTMLElement");
+
+var _safeHTMLElement2 = _interopRequireDefault(_safeHTMLElement);
+
+var _portalOpenInstances = require("../helpers/portalOpenInstances");
+
+var _portalOpenInstances2 = _interopRequireDefault(_portalOpenInstances);
+
+require("../helpers/bodyTrap");
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+// so that our CSS is statically analyzable
+var CLASS_NAMES = {
+  overlay: "ReactModal__Overlay",
+  content: "ReactModal__Content"
+};
+
+var TAB_KEY = 9;
+var ESC_KEY = 27;
+
+var ariaHiddenInstances = 0;
+
+var ModalPortal = function (_Component) {
+  _inherits(ModalPortal, _Component);
+
+  function ModalPortal(props) {
+    _classCallCheck(this, ModalPortal);
+
+    var _this = _possibleConstructorReturn(this, (ModalPortal.__proto__ || Object.getPrototypeOf(ModalPortal)).call(this, props));
+
+    _this.setOverlayRef = function (overlay) {
+      _this.overlay = overlay;
+      _this.props.overlayRef && _this.props.overlayRef(overlay);
+    };
+
+    _this.setContentRef = function (content) {
+      _this.content = content;
+      _this.props.contentRef && _this.props.contentRef(content);
+    };
+
+    _this.afterClose = function () {
+      var _this$props = _this.props,
+          appElement = _this$props.appElement,
+          ariaHideApp = _this$props.ariaHideApp,
+          htmlOpenClassName = _this$props.htmlOpenClassName,
+          bodyOpenClassName = _this$props.bodyOpenClassName;
+
+      // Remove classes.
+
+      bodyOpenClassName && classList.remove(document.body, bodyOpenClassName);
+
+      htmlOpenClassName && classList.remove(document.getElementsByTagName("html")[0], htmlOpenClassName);
+
+      // Reset aria-hidden attribute if all modals have been removed
+      if (ariaHideApp && ariaHiddenInstances > 0) {
+        ariaHiddenInstances -= 1;
+
+        if (ariaHiddenInstances === 0) {
+          ariaAppHider.show(appElement);
+        }
+      }
+
+      if (_this.props.shouldFocusAfterRender) {
+        if (_this.props.shouldReturnFocusAfterClose) {
+          focusManager.returnFocus(_this.props.preventScroll);
+          focusManager.teardownScopedFocus();
+        } else {
+          focusManager.popWithoutFocus();
+        }
+      }
+
+      if (_this.props.onAfterClose) {
+        _this.props.onAfterClose();
+      }
+
+      _portalOpenInstances2.default.deregister(_this);
+    };
+
+    _this.open = function () {
+      _this.beforeOpen();
+      if (_this.state.afterOpen && _this.state.beforeClose) {
+        clearTimeout(_this.closeTimer);
+        _this.setState({ beforeClose: false });
+      } else {
+        if (_this.props.shouldFocusAfterRender) {
+          focusManager.setupScopedFocus(_this.node);
+          focusManager.markForFocusLater();
+        }
+
+        _this.setState({ isOpen: true }, function () {
+          _this.openAnimationFrame = requestAnimationFrame(function () {
+            _this.setState({ afterOpen: true });
+
+            if (_this.props.isOpen && _this.props.onAfterOpen) {
+              _this.props.onAfterOpen({
+                overlayEl: _this.overlay,
+                contentEl: _this.content
+              });
+            }
+          });
+        });
+      }
+    };
+
+    _this.close = function () {
+      if (_this.props.closeTimeoutMS > 0) {
+        _this.closeWithTimeout();
+      } else {
+        _this.closeWithoutTimeout();
+      }
+    };
+
+    _this.focusContent = function () {
+      return _this.content && !_this.contentHasFocus() && _this.content.focus({ preventScroll: true });
+    };
+
+    _this.closeWithTimeout = function () {
+      var closesAt = Date.now() + _this.props.closeTimeoutMS;
+      _this.setState({ beforeClose: true, closesAt: closesAt }, function () {
+        _this.closeTimer = setTimeout(_this.closeWithoutTimeout, _this.state.closesAt - Date.now());
+      });
+    };
+
+    _this.closeWithoutTimeout = function () {
+      _this.setState({
+        beforeClose: false,
+        isOpen: false,
+        afterOpen: false,
+        closesAt: null
+      }, _this.afterClose);
+    };
+
+    _this.handleKeyDown = function (event) {
+      if (event.keyCode === TAB_KEY) {
+        (0, _scopeTab2.default)(_this.content, event);
+      }
+
+      if (_this.props.shouldCloseOnEsc && event.keyCode === ESC_KEY) {
+        event.stopPropagation();
+        _this.requestClose(event);
+      }
+    };
+
+    _this.handleOverlayOnClick = function (event) {
+      if (_this.shouldClose === null) {
+        _this.shouldClose = true;
+      }
+
+      if (_this.shouldClose && _this.props.shouldCloseOnOverlayClick) {
+        if (_this.ownerHandlesClose()) {
+          _this.requestClose(event);
+        } else {
+          _this.focusContent();
+        }
+      }
+      _this.shouldClose = null;
+    };
+
+    _this.handleContentOnMouseUp = function () {
+      _this.shouldClose = false;
+    };
+
+    _this.handleOverlayOnMouseDown = function (event) {
+      if (!_this.props.shouldCloseOnOverlayClick && event.target == _this.overlay) {
+        event.preventDefault();
+      }
+    };
+
+    _this.handleContentOnClick = function () {
+      _this.shouldClose = false;
+    };
+
+    _this.handleContentOnMouseDown = function () {
+      _this.shouldClose = false;
+    };
+
+    _this.requestClose = function (event) {
+      return _this.ownerHandlesClose() && _this.props.onRequestClose(event);
+    };
+
+    _this.ownerHandlesClose = function () {
+      return _this.props.onRequestClose;
+    };
+
+    _this.shouldBeClosed = function () {
+      return !_this.state.isOpen && !_this.state.beforeClose;
+    };
+
+    _this.contentHasFocus = function () {
+      return document.activeElement === _this.content || _this.content.contains(document.activeElement);
+    };
+
+    _this.buildClassName = function (which, additional) {
+      var classNames = (typeof additional === "undefined" ? "undefined" : _typeof(additional)) === "object" ? additional : {
+        base: CLASS_NAMES[which],
+        afterOpen: CLASS_NAMES[which] + "--after-open",
+        beforeClose: CLASS_NAMES[which] + "--before-close"
+      };
+      var className = classNames.base;
+      if (_this.state.afterOpen) {
+        className = className + " " + classNames.afterOpen;
+      }
+      if (_this.state.beforeClose) {
+        className = className + " " + classNames.beforeClose;
+      }
+      return typeof additional === "string" && additional ? className + " " + additional : className;
+    };
+
+    _this.attributesFromObject = function (prefix, items) {
+      return Object.keys(items).reduce(function (acc, name) {
+        acc[prefix + "-" + name] = items[name];
+        return acc;
+      }, {});
+    };
+
+    _this.state = {
+      afterOpen: false,
+      beforeClose: false
+    };
+
+    _this.shouldClose = null;
+    _this.moveFromContentToOverlay = null;
+    return _this;
+  }
+
+  _createClass(ModalPortal, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      if (this.props.isOpen) {
+        this.open();
+      }
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps, prevState) {
+      if (process.env.NODE_ENV !== "production") {
+        if (prevProps.bodyOpenClassName !== this.props.bodyOpenClassName) {
+          // eslint-disable-next-line no-console
+          console.warn('React-Modal: "bodyOpenClassName" prop has been modified. ' + "This may cause unexpected behavior when multiple modals are open.");
+        }
+        if (prevProps.htmlOpenClassName !== this.props.htmlOpenClassName) {
+          // eslint-disable-next-line no-console
+          console.warn('React-Modal: "htmlOpenClassName" prop has been modified. ' + "This may cause unexpected behavior when multiple modals are open.");
+        }
+      }
+
+      if (this.props.isOpen && !prevProps.isOpen) {
+        this.open();
+      } else if (!this.props.isOpen && prevProps.isOpen) {
+        this.close();
+      }
+
+      // Focus only needs to be set once when the modal is being opened
+      if (this.props.shouldFocusAfterRender && this.state.isOpen && !prevState.isOpen) {
+        this.focusContent();
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      if (this.state.isOpen) {
+        this.afterClose();
+      }
+      clearTimeout(this.closeTimer);
+      cancelAnimationFrame(this.openAnimationFrame);
+    }
+  }, {
+    key: "beforeOpen",
+    value: function beforeOpen() {
+      var _props = this.props,
+          appElement = _props.appElement,
+          ariaHideApp = _props.ariaHideApp,
+          htmlOpenClassName = _props.htmlOpenClassName,
+          bodyOpenClassName = _props.bodyOpenClassName;
+
+      // Add classes.
+
+      bodyOpenClassName && classList.add(document.body, bodyOpenClassName);
+
+      htmlOpenClassName && classList.add(document.getElementsByTagName("html")[0], htmlOpenClassName);
+
+      if (ariaHideApp) {
+        ariaHiddenInstances += 1;
+        ariaAppHider.hide(appElement);
+      }
+
+      _portalOpenInstances2.default.register(this);
+    }
+
+    // Don't steal focus from inner elements
+
+  }, {
+    key: "render",
+    value: function render() {
+      var _props2 = this.props,
+          id = _props2.id,
+          className = _props2.className,
+          overlayClassName = _props2.overlayClassName,
+          defaultStyles = _props2.defaultStyles,
+          children = _props2.children;
+
+      var contentStyles = className ? {} : defaultStyles.content;
+      var overlayStyles = overlayClassName ? {} : defaultStyles.overlay;
+
+      if (this.shouldBeClosed()) {
+        return null;
+      }
+
+      var overlayProps = {
+        ref: this.setOverlayRef,
+        className: this.buildClassName("overlay", overlayClassName),
+        style: _extends({}, overlayStyles, this.props.style.overlay),
+        onClick: this.handleOverlayOnClick,
+        onMouseDown: this.handleOverlayOnMouseDown
+      };
+
+      var contentProps = _extends({
+        id: id,
+        ref: this.setContentRef,
+        style: _extends({}, contentStyles, this.props.style.content),
+        className: this.buildClassName("content", className),
+        tabIndex: "-1",
+        onKeyDown: this.handleKeyDown,
+        onMouseDown: this.handleContentOnMouseDown,
+        onMouseUp: this.handleContentOnMouseUp,
+        onClick: this.handleContentOnClick,
+        role: this.props.role,
+        "aria-label": this.props.contentLabel
+      }, this.attributesFromObject("aria", _extends({ modal: true }, this.props.aria)), this.attributesFromObject("data", this.props.data || {}), {
+        "data-testid": this.props.testId
+      });
+
+      var contentElement = this.props.contentElement(contentProps, children);
+      return this.props.overlayElement(overlayProps, contentElement);
+    }
+  }]);
+
+  return ModalPortal;
+}(_react.Component);
+
+ModalPortal.defaultProps = {
+  style: {
+    overlay: {},
+    content: {}
+  },
+  defaultStyles: {}
+};
+ModalPortal.propTypes = {
+  isOpen: _propTypes2.default.bool.isRequired,
+  defaultStyles: _propTypes2.default.shape({
+    content: _propTypes2.default.object,
+    overlay: _propTypes2.default.object
+  }),
+  style: _propTypes2.default.shape({
+    content: _propTypes2.default.object,
+    overlay: _propTypes2.default.object
+  }),
+  className: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.object]),
+  overlayClassName: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.object]),
+  bodyOpenClassName: _propTypes2.default.string,
+  htmlOpenClassName: _propTypes2.default.string,
+  ariaHideApp: _propTypes2.default.bool,
+  appElement: _propTypes2.default.oneOfType([_propTypes2.default.instanceOf(_safeHTMLElement2.default), _propTypes2.default.instanceOf(_safeHTMLElement.SafeHTMLCollection), _propTypes2.default.instanceOf(_safeHTMLElement.SafeNodeList), _propTypes2.default.arrayOf(_propTypes2.default.instanceOf(_safeHTMLElement2.default))]),
+  onAfterOpen: _propTypes2.default.func,
+  onAfterClose: _propTypes2.default.func,
+  onRequestClose: _propTypes2.default.func,
+  closeTimeoutMS: _propTypes2.default.number,
+  shouldFocusAfterRender: _propTypes2.default.bool,
+  shouldCloseOnOverlayClick: _propTypes2.default.bool,
+  shouldReturnFocusAfterClose: _propTypes2.default.bool,
+  preventScroll: _propTypes2.default.bool,
+  role: _propTypes2.default.string,
+  contentLabel: _propTypes2.default.string,
+  aria: _propTypes2.default.object,
+  data: _propTypes2.default.object,
+  children: _propTypes2.default.node,
+  shouldCloseOnEsc: _propTypes2.default.bool,
+  overlayRef: _propTypes2.default.func,
+  contentRef: _propTypes2.default.func,
+  id: _propTypes2.default.string,
+  overlayElement: _propTypes2.default.func,
+  contentElement: _propTypes2.default.func,
+  testId: _propTypes2.default.string
+};
+exports.default = ModalPortal;
+module.exports = exports["default"];
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-modal/lib/helpers/ariaAppHider.js b/ddb_main/node_modules/react-modal/lib/helpers/ariaAppHider.js
new file mode 100644
index 0000000..339c2a5
--- /dev/null
+++ b/ddb_main/node_modules/react-modal/lib/helpers/ariaAppHider.js
@@ -0,0 +1,139 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.resetState = resetState;
+exports.log = log;
+exports.assertNodeList = assertNodeList;
+exports.setElement = setElement;
+exports.validateElement = validateElement;
+exports.hide = hide;
+exports.show = show;
+exports.documentNotReadyOrSSRTesting = documentNotReadyOrSSRTesting;
+
+var _warning = require("warning");
+
+var _warning2 = _interopRequireDefault(_warning);
+
+var _safeHTMLElement = require("./safeHTMLElement");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var globalElement = null;
+
+/* eslint-disable no-console */
+/* istanbul ignore next */
+function resetState() {
+  if (globalElement) {
+    if (globalElement.removeAttribute) {
+      globalElement.removeAttribute("aria-hidden");
+    } else if (globalElement.length != null) {
+      globalElement.forEach(function (element) {
+        return element.removeAttribute("aria-hidden");
+      });
+    } else {
+      document.querySelectorAll(globalElement).forEach(function (element) {
+        return element.removeAttribute("aria-hidden");
+      });
+    }
+  }
+  globalElement = null;
+}
+
+/* istanbul ignore next */
+function log() {
+  if (process.env.NODE_ENV !== "production") {
+    var check = globalElement || {};
+    console.log("ariaAppHider ----------");
+    console.log(check.nodeName, check.className, check.id);
+    console.log("end ariaAppHider ----------");
+  }
+}
+/* eslint-enable no-console */
+
+function assertNodeList(nodeList, selector) {
+  if (!nodeList || !nodeList.length) {
+    throw new Error("react-modal: No elements were found for selector " + selector + ".");
+  }
+}
+
+function setElement(element) {
+  var useElement = element;
+  if (typeof useElement === "string" && _safeHTMLElement.canUseDOM) {
+    var el = document.querySelectorAll(useElement);
+    assertNodeList(el, useElement);
+    useElement = el;
+  }
+  globalElement = useElement || globalElement;
+  return globalElement;
+}
+
+function validateElement(appElement) {
+  var el = appElement || globalElement;
+  if (el) {
+    return Array.isArray(el) || el instanceof HTMLCollection || el instanceof NodeList ? el : [el];
+  } else {
+    (0, _warning2.default)(false, ["react-modal: App element is not defined.", "Please use `Modal.setAppElement(el)` or set `appElement={el}`.", "This is needed so screen readers don't see main content", "when modal is opened. It is not recommended, but you can opt-out", "by setting `ariaHideApp={false}`."].join(" "));
+
+    return [];
+  }
+}
+
+function hide(appElement) {
+  var _iteratorNormalCompletion = true;
+  var _didIteratorError = false;
+  var _iteratorError = undefined;
+
+  try {
+    for (var _iterator = validateElement(appElement)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+      var el = _step.value;
+
+      el.setAttribute("aria-hidden", "true");
+    }
+  } catch (err) {
+    _didIteratorError = true;
+    _iteratorError = err;
+  } finally {
+    try {
+      if (!_iteratorNormalCompletion && _iterator.return) {
+        _iterator.return();
+      }
+    } finally {
+      if (_didIteratorError) {
+        throw _iteratorError;
+      }
+    }
+  }
+}
+
+function show(appElement) {
+  var _iteratorNormalCompletion2 = true;
+  var _didIteratorError2 = false;
+  var _iteratorError2 = undefined;
+
+  try {
+    for (var _iterator2 = validateElement(appElement)[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
+      var el = _step2.value;
+
+      el.removeAttribute("aria-hidden");
+    }
+  } catch (err) {
+    _didIteratorError2 = true;
+    _iteratorError2 = err;
+  } finally {
+    try {
+      if (!_iteratorNormalCompletion2 && _iterator2.return) {
+        _iterator2.return();
+      }
+    } finally {
+      if (_didIteratorError2) {
+        throw _iteratorError2;
+      }
+    }
+  }
+}
+
+function documentNotReadyOrSSRTesting() {
+  globalElement = null;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-modal/lib/helpers/bodyTrap.js b/ddb_main/node_modules/react-modal/lib/helpers/bodyTrap.js
new file mode 100644
index 0000000..6e55c13
--- /dev/null
+++ b/ddb_main/node_modules/react-modal/lib/helpers/bodyTrap.js
@@ -0,0 +1,93 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.resetState = resetState;
+exports.log = log;
+
+var _portalOpenInstances = require("./portalOpenInstances");
+
+var _portalOpenInstances2 = _interopRequireDefault(_portalOpenInstances);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// Body focus trap see Issue #742
+
+var before = void 0,
+    after = void 0,
+    instances = [];
+
+/* eslint-disable no-console */
+/* istanbul ignore next */
+function resetState() {
+  var _arr = [before, after];
+
+  for (var _i = 0; _i < _arr.length; _i++) {
+    var item = _arr[_i];
+    if (!item) continue;
+    item.parentNode && item.parentNode.removeChild(item);
+  }
+  before = after = null;
+  instances = [];
+}
+
+/* istanbul ignore next */
+function log() {
+  console.log("bodyTrap ----------");
+  console.log(instances.length);
+  var _arr2 = [before, after];
+  for (var _i2 = 0; _i2 < _arr2.length; _i2++) {
+    var item = _arr2[_i2];
+    var check = item || {};
+    console.log(check.nodeName, check.className, check.id);
+  }
+  console.log("edn bodyTrap ----------");
+}
+/* eslint-enable no-console */
+
+function focusContent() {
+  if (instances.length === 0) {
+    if (process.env.NODE_ENV !== "production") {
+      // eslint-disable-next-line no-console
+      console.warn("React-Modal: Open instances > 0 expected");
+    }
+    return;
+  }
+  instances[instances.length - 1].focusContent();
+}
+
+function bodyTrap(eventType, openInstances) {
+  if (!before && !after) {
+    before = document.createElement("div");
+    before.setAttribute("data-react-modal-body-trap", "");
+    before.style.position = "absolute";
+    before.style.opacity = "0";
+    before.setAttribute("tabindex", "0");
+    before.addEventListener("focus", focusContent);
+    after = before.cloneNode();
+    after.addEventListener("focus", focusContent);
+  }
+
+  instances = openInstances;
+
+  if (instances.length > 0) {
+    // Add focus trap
+    if (document.body.firstChild !== before) {
+      document.body.insertBefore(before, document.body.firstChild);
+    }
+    if (document.body.lastChild !== after) {
+      document.body.appendChild(after);
+    }
+  } else {
+    // Remove focus trap
+    if (before.parentElement) {
+      before.parentElement.removeChild(before);
+    }
+    if (after.parentElement) {
+      after.parentElement.removeChild(after);
+    }
+  }
+}
+
+_portalOpenInstances2.default.subscribe(bodyTrap);
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-modal/lib/helpers/classList.js b/ddb_main/node_modules/react-modal/lib/helpers/classList.js
new file mode 100644
index 0000000..307dfd7
--- /dev/null
+++ b/ddb_main/node_modules/react-modal/lib/helpers/classList.js
@@ -0,0 +1,130 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.resetState = resetState;
+exports.log = log;
+var htmlClassList = {};
+var docBodyClassList = {};
+
+/* eslint-disable no-console */
+/* istanbul ignore next */
+function removeClass(at, cls) {
+  at.classList.remove(cls);
+}
+
+/* istanbul ignore next */
+function resetState() {
+  var htmlElement = document.getElementsByTagName("html")[0];
+  for (var cls in htmlClassList) {
+    removeClass(htmlElement, htmlClassList[cls]);
+  }
+
+  var body = document.body;
+  for (var _cls in docBodyClassList) {
+    removeClass(body, docBodyClassList[_cls]);
+  }
+
+  htmlClassList = {};
+  docBodyClassList = {};
+}
+
+/* istanbul ignore next */
+function log() {
+  if (process.env.NODE_ENV !== "production") {
+    var classes = document.getElementsByTagName("html")[0].className;
+    var buffer = "Show tracked classes:\n\n";
+
+    buffer += "<html /> (" + classes + "):\n  ";
+    for (var x in htmlClassList) {
+      buffer += "  " + x + " " + htmlClassList[x] + "\n  ";
+    }
+
+    classes = document.body.className;
+
+    buffer += "\n\ndoc.body (" + classes + "):\n  ";
+    for (var _x in docBodyClassList) {
+      buffer += "  " + _x + " " + docBodyClassList[_x] + "\n  ";
+    }
+
+    buffer += "\n";
+
+    console.log(buffer);
+  }
+}
+/* eslint-enable no-console */
+
+/**
+ * Track the number of reference of a class.
+ * @param {object} poll The poll to receive the reference.
+ * @param {string} className The class name.
+ * @return {string}
+ */
+var incrementReference = function incrementReference(poll, className) {
+  if (!poll[className]) {
+    poll[className] = 0;
+  }
+  poll[className] += 1;
+  return className;
+};
+
+/**
+ * Drop the reference of a class.
+ * @param {object} poll The poll to receive the reference.
+ * @param {string} className The class name.
+ * @return {string}
+ */
+var decrementReference = function decrementReference(poll, className) {
+  if (poll[className]) {
+    poll[className] -= 1;
+  }
+  return className;
+};
+
+/**
+ * Track a class and add to the given class list.
+ * @param {Object} classListRef A class list of an element.
+ * @param {Object} poll         The poll to be used.
+ * @param {Array}  classes      The list of classes to be tracked.
+ */
+var trackClass = function trackClass(classListRef, poll, classes) {
+  classes.forEach(function (className) {
+    incrementReference(poll, className);
+    classListRef.add(className);
+  });
+};
+
+/**
+ * Untrack a class and remove from the given class list if the reference
+ * reaches 0.
+ * @param {Object} classListRef A class list of an element.
+ * @param {Object} poll         The poll to be used.
+ * @param {Array}  classes      The list of classes to be untracked.
+ */
+var untrackClass = function untrackClass(classListRef, poll, classes) {
+  classes.forEach(function (className) {
+    decrementReference(poll, className);
+    poll[className] === 0 && classListRef.remove(className);
+  });
+};
+
+/**
+ * Public inferface to add classes to the document.body.
+ * @param {string} bodyClass The class string to be added.
+ *                           It may contain more then one class
+ *                           with ' ' as separator.
+ */
+var add = exports.add = function add(element, classString) {
+  return trackClass(element.classList, element.nodeName.toLowerCase() == "html" ? htmlClassList : docBodyClassList, classString.split(" "));
+};
+
+/**
+ * Public inferface to remove classes from the document.body.
+ * @param {string} bodyClass The class string to be added.
+ *                           It may contain more then one class
+ *                           with ' ' as separator.
+ */
+var remove = exports.remove = function remove(element, classString) {
+  return untrackClass(element.classList, element.nodeName.toLowerCase() == "html" ? htmlClassList : docBodyClassList, classString.split(" "));
+};
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-modal/lib/helpers/focusManager.js b/ddb_main/node_modules/react-modal/lib/helpers/focusManager.js
new file mode 100644
index 0000000..9d164a3
--- /dev/null
+++ b/ddb_main/node_modules/react-modal/lib/helpers/focusManager.js
@@ -0,0 +1,117 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.resetState = resetState;
+exports.log = log;
+exports.handleBlur = handleBlur;
+exports.handleFocus = handleFocus;
+exports.markForFocusLater = markForFocusLater;
+exports.returnFocus = returnFocus;
+exports.popWithoutFocus = popWithoutFocus;
+exports.setupScopedFocus = setupScopedFocus;
+exports.teardownScopedFocus = teardownScopedFocus;
+
+var _tabbable = require("../helpers/tabbable");
+
+var _tabbable2 = _interopRequireDefault(_tabbable);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var focusLaterElements = [];
+var modalElement = null;
+var needToFocus = false;
+
+/* eslint-disable no-console */
+/* istanbul ignore next */
+function resetState() {
+  focusLaterElements = [];
+}
+
+/* istanbul ignore next */
+function log() {
+  if (process.env.NODE_ENV !== "production") {
+    console.log("focusManager ----------");
+    focusLaterElements.forEach(function (f) {
+      var check = f || {};
+      console.log(check.nodeName, check.className, check.id);
+    });
+    console.log("end focusManager ----------");
+  }
+}
+/* eslint-enable no-console */
+
+function handleBlur() {
+  needToFocus = true;
+}
+
+function handleFocus() {
+  if (needToFocus) {
+    needToFocus = false;
+    if (!modalElement) {
+      return;
+    }
+    // need to see how jQuery shims document.on('focusin') so we don't need the
+    // setTimeout, firefox doesn't support focusin, if it did, we could focus
+    // the element outside of a setTimeout. Side-effect of this implementation
+    // is that the document.body gets focus, and then we focus our element right
+    // after, seems fine.
+    setTimeout(function () {
+      if (modalElement.contains(document.activeElement)) {
+        return;
+      }
+      var el = (0, _tabbable2.default)(modalElement)[0] || modalElement;
+      el.focus();
+    }, 0);
+  }
+}
+
+function markForFocusLater() {
+  focusLaterElements.push(document.activeElement);
+}
+
+/* eslint-disable no-console */
+function returnFocus() {
+  var preventScroll = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+
+  var toFocus = null;
+  try {
+    if (focusLaterElements.length !== 0) {
+      toFocus = focusLaterElements.pop();
+      toFocus.focus({ preventScroll: preventScroll });
+    }
+    return;
+  } catch (e) {
+    console.warn(["You tried to return focus to", toFocus, "but it is not in the DOM anymore"].join(" "));
+  }
+}
+/* eslint-enable no-console */
+
+function popWithoutFocus() {
+  focusLaterElements.length > 0 && focusLaterElements.pop();
+}
+
+function setupScopedFocus(element) {
+  modalElement = element;
+
+  if (window.addEventListener) {
+    window.addEventListener("blur", handleBlur, false);
+    document.addEventListener("focus", handleFocus, true);
+  } else {
+    window.attachEvent("onBlur", handleBlur);
+    document.attachEvent("onFocus", handleFocus);
+  }
+}
+
+function teardownScopedFocus() {
+  modalElement = null;
+
+  if (window.addEventListener) {
+    window.removeEventListener("blur", handleBlur);
+    document.removeEventListener("focus", handleFocus);
+  } else {
+    window.detachEvent("onBlur", handleBlur);
+    document.detachEvent("onFocus", handleFocus);
+  }
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-modal/lib/helpers/portalOpenInstances.js b/ddb_main/node_modules/react-modal/lib/helpers/portalOpenInstances.js
new file mode 100644
index 0000000..4f36d22
--- /dev/null
+++ b/ddb_main/node_modules/react-modal/lib/helpers/portalOpenInstances.js
@@ -0,0 +1,78 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.log = log;
+exports.resetState = resetState;
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+// Tracks portals that are open and emits events to subscribers
+
+var PortalOpenInstances = function PortalOpenInstances() {
+  var _this = this;
+
+  _classCallCheck(this, PortalOpenInstances);
+
+  this.register = function (openInstance) {
+    if (_this.openInstances.indexOf(openInstance) !== -1) {
+      if (process.env.NODE_ENV !== "production") {
+        // eslint-disable-next-line no-console
+        console.warn("React-Modal: Cannot register modal instance that's already open");
+      }
+      return;
+    }
+    _this.openInstances.push(openInstance);
+    _this.emit("register");
+  };
+
+  this.deregister = function (openInstance) {
+    var index = _this.openInstances.indexOf(openInstance);
+    if (index === -1) {
+      if (process.env.NODE_ENV !== "production") {
+        // eslint-disable-next-line no-console
+        console.warn("React-Modal: Unable to deregister " + openInstance + " as " + "it was never registered");
+      }
+      return;
+    }
+    _this.openInstances.splice(index, 1);
+    _this.emit("deregister");
+  };
+
+  this.subscribe = function (callback) {
+    _this.subscribers.push(callback);
+  };
+
+  this.emit = function (eventType) {
+    _this.subscribers.forEach(function (subscriber) {
+      return subscriber(eventType,
+      // shallow copy to avoid accidental mutation
+      _this.openInstances.slice());
+    });
+  };
+
+  this.openInstances = [];
+  this.subscribers = [];
+};
+
+var portalOpenInstances = new PortalOpenInstances();
+
+/* eslint-disable no-console */
+/* istanbul ignore next */
+function log() {
+  console.log("portalOpenInstances ----------");
+  console.log(portalOpenInstances.openInstances.length);
+  portalOpenInstances.openInstances.forEach(function (p) {
+    return console.log(p);
+  });
+  console.log("end portalOpenInstances ----------");
+}
+
+/* istanbul ignore next */
+function resetState() {
+  portalOpenInstances = new PortalOpenInstances();
+}
+/* eslint-enable no-console */
+
+exports.default = portalOpenInstances;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-modal/lib/helpers/safeHTMLElement.js b/ddb_main/node_modules/react-modal/lib/helpers/safeHTMLElement.js
new file mode 100644
index 0000000..2bae529
--- /dev/null
+++ b/ddb_main/node_modules/react-modal/lib/helpers/safeHTMLElement.js
@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.canUseDOM = exports.SafeNodeList = exports.SafeHTMLCollection = undefined;
+
+var _exenv = require("exenv");
+
+var _exenv2 = _interopRequireDefault(_exenv);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var EE = _exenv2.default;
+
+var SafeHTMLElement = EE.canUseDOM ? window.HTMLElement : {};
+
+var SafeHTMLCollection = exports.SafeHTMLCollection = EE.canUseDOM ? window.HTMLCollection : {};
+
+var SafeNodeList = exports.SafeNodeList = EE.canUseDOM ? window.NodeList : {};
+
+var canUseDOM = exports.canUseDOM = EE.canUseDOM;
+
+exports.default = SafeHTMLElement;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-modal/lib/helpers/scopeTab.js b/ddb_main/node_modules/react-modal/lib/helpers/scopeTab.js
new file mode 100644
index 0000000..c8fa5a6
--- /dev/null
+++ b/ddb_main/node_modules/react-modal/lib/helpers/scopeTab.js
@@ -0,0 +1,96 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = scopeTab;
+
+var _tabbable = require("./tabbable");
+
+var _tabbable2 = _interopRequireDefault(_tabbable);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function getActiveElement() {
+  var el = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : document;
+
+  return el.activeElement.shadowRoot ? getActiveElement(el.activeElement.shadowRoot) : el.activeElement;
+}
+
+function scopeTab(node, event) {
+  var tabbable = (0, _tabbable2.default)(node);
+
+  if (!tabbable.length) {
+    // Do nothing, since there are no elements that can receive focus.
+    event.preventDefault();
+    return;
+  }
+
+  var target = void 0;
+
+  var shiftKey = event.shiftKey;
+  var head = tabbable[0];
+  var tail = tabbable[tabbable.length - 1];
+  var activeElement = getActiveElement();
+
+  // proceed with default browser behavior on tab.
+  // Focus on last element on shift + tab.
+  if (node === activeElement) {
+    if (!shiftKey) return;
+    target = tail;
+  }
+
+  if (tail === activeElement && !shiftKey) {
+    target = head;
+  }
+
+  if (head === activeElement && shiftKey) {
+    target = tail;
+  }
+
+  if (target) {
+    event.preventDefault();
+    target.focus();
+    return;
+  }
+
+  // Safari radio issue.
+  //
+  // Safari does not move the focus to the radio button,
+  // so we need to force it to really walk through all elements.
+  //
+  // This is very error prone, since we are trying to guess
+  // if it is a safari browser from the first occurence between
+  // chrome or safari.
+  //
+  // The chrome user agent contains the first ocurrence
+  // as the 'chrome/version' and later the 'safari/version'.
+  var checkSafari = /(\bChrome\b|\bSafari\b)\//.exec(navigator.userAgent);
+  var isSafariDesktop = checkSafari != null && checkSafari[1] != "Chrome" && /\biPod\b|\biPad\b/g.exec(navigator.userAgent) == null;
+
+  // If we are not in safari desktop, let the browser control
+  // the focus
+  if (!isSafariDesktop) return;
+
+  var x = tabbable.indexOf(activeElement);
+
+  if (x > -1) {
+    x += shiftKey ? -1 : 1;
+  }
+
+  target = tabbable[x];
+
+  // If the tabbable element does not exist,
+  // focus head/tail based on shiftKey
+  if (typeof target === "undefined") {
+    event.preventDefault();
+    target = shiftKey ? tail : head;
+    target.focus();
+    return;
+  }
+
+  event.preventDefault();
+
+  target.focus();
+}
+module.exports = exports["default"];
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-modal/lib/helpers/tabbable.js b/ddb_main/node_modules/react-modal/lib/helpers/tabbable.js
new file mode 100644
index 0000000..deeb6ae
--- /dev/null
+++ b/ddb_main/node_modules/react-modal/lib/helpers/tabbable.js
@@ -0,0 +1,74 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = findTabbableDescendants;
+/*!
+ * Adapted from jQuery UI core
+ *
+ * http://jqueryui.com
+ *
+ * Copyright 2014 jQuery Foundation and other contributors
+ * Released under the MIT license.
+ * http://jquery.org/license
+ *
+ * http://api.jqueryui.com/category/ui-core/
+ */
+
+var tabbableNode = /input|select|textarea|button|object/;
+
+function hidesContents(element) {
+  var zeroSize = element.offsetWidth <= 0 && element.offsetHeight <= 0;
+
+  // If the node is empty, this is good enough
+  if (zeroSize && !element.innerHTML) return true;
+
+  try {
+    // Otherwise we need to check some styles
+    var style = window.getComputedStyle(element);
+    return zeroSize ? style.getPropertyValue("overflow") !== "visible" ||
+    // if 'overflow: visible' set, check if there is actually any overflow
+    element.scrollWidth <= 0 && element.scrollHeight <= 0 : style.getPropertyValue("display") == "none";
+  } catch (exception) {
+    // eslint-disable-next-line no-console
+    console.warn("Failed to inspect element style");
+    return false;
+  }
+}
+
+function visible(element) {
+  var parentElement = element;
+  var rootNode = element.getRootNode && element.getRootNode();
+  while (parentElement) {
+    if (parentElement === document.body) break;
+
+    // if we are not hidden yet, skip to checking outside the Web Component
+    if (rootNode && parentElement === rootNode) parentElement = rootNode.host.parentNode;
+
+    if (hidesContents(parentElement)) return false;
+    parentElement = parentElement.parentNode;
+  }
+  return true;
+}
+
+function focusable(element, isTabIndexNotNaN) {
+  var nodeName = element.nodeName.toLowerCase();
+  var res = tabbableNode.test(nodeName) && !element.disabled || (nodeName === "a" ? element.href || isTabIndexNotNaN : isTabIndexNotNaN);
+  return res && visible(element);
+}
+
+function tabbable(element) {
+  var tabIndex = element.getAttribute("tabindex");
+  if (tabIndex === null) tabIndex = undefined;
+  var isTabIndexNaN = isNaN(tabIndex);
+  return (isTabIndexNaN || tabIndex >= 0) && focusable(element, !isTabIndexNaN);
+}
+
+function findTabbableDescendants(element) {
+  var descendants = [].slice.call(element.querySelectorAll("*"), 0).reduce(function (finished, el) {
+    return finished.concat(!el.shadowRoot ? [el] : findTabbableDescendants(el.shadowRoot));
+  }, []);
+  return descendants.filter(tabbable);
+}
+module.exports = exports["default"];
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-modal/lib/index.js b/ddb_main/node_modules/react-modal/lib/index.js
new file mode 100644
index 0000000..1e7bab9
--- /dev/null
+++ b/ddb_main/node_modules/react-modal/lib/index.js
@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _Modal = require("./components/Modal");
+
+var _Modal2 = _interopRequireDefault(_Modal);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+exports.default = _Modal2.default;
+module.exports = exports["default"];
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/focusManager.js b/ddb_main/node_modules/react-query/es/core/focusManager.js
new file mode 100644
index 0000000..fdc2506
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/focusManager.js
@@ -0,0 +1,95 @@
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+import { Subscribable } from './subscribable';
+import { isServer } from './utils';
+export var FocusManager = /*#__PURE__*/function (_Subscribable) {
+  _inheritsLoose(FocusManager, _Subscribable);
+
+  function FocusManager() {
+    var _this;
+
+    _this = _Subscribable.call(this) || this;
+
+    _this.setup = function (onFocus) {
+      var _window;
+
+      if (!isServer && ((_window = window) == null ? void 0 : _window.addEventListener)) {
+        var listener = function listener() {
+          return onFocus();
+        }; // Listen to visibillitychange and focus
+
+
+        window.addEventListener('visibilitychange', listener, false);
+        window.addEventListener('focus', listener, false);
+        return function () {
+          // Be sure to unsubscribe if a new handler is set
+          window.removeEventListener('visibilitychange', listener);
+          window.removeEventListener('focus', listener);
+        };
+      }
+    };
+
+    return _this;
+  }
+
+  var _proto = FocusManager.prototype;
+
+  _proto.onSubscribe = function onSubscribe() {
+    if (!this.cleanup) {
+      this.setEventListener(this.setup);
+    }
+  };
+
+  _proto.onUnsubscribe = function onUnsubscribe() {
+    if (!this.hasListeners()) {
+      var _this$cleanup;
+
+      (_this$cleanup = this.cleanup) == null ? void 0 : _this$cleanup.call(this);
+      this.cleanup = undefined;
+    }
+  };
+
+  _proto.setEventListener = function setEventListener(setup) {
+    var _this$cleanup2,
+        _this2 = this;
+
+    this.setup = setup;
+    (_this$cleanup2 = this.cleanup) == null ? void 0 : _this$cleanup2.call(this);
+    this.cleanup = setup(function (focused) {
+      if (typeof focused === 'boolean') {
+        _this2.setFocused(focused);
+      } else {
+        _this2.onFocus();
+      }
+    });
+  };
+
+  _proto.setFocused = function setFocused(focused) {
+    this.focused = focused;
+
+    if (focused) {
+      this.onFocus();
+    }
+  };
+
+  _proto.onFocus = function onFocus() {
+    this.listeners.forEach(function (listener) {
+      listener();
+    });
+  };
+
+  _proto.isFocused = function isFocused() {
+    if (typeof this.focused === 'boolean') {
+      return this.focused;
+    } // document global can be unavailable in react native
+
+
+    if (typeof document === 'undefined') {
+      return true;
+    }
+
+    return [undefined, 'visible', 'prerender'].includes(document.visibilityState);
+  };
+
+  return FocusManager;
+}(Subscribable);
+export var focusManager = new FocusManager();
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/infiniteQueryBehavior.js b/ddb_main/node_modules/react-query/es/core/infiniteQueryBehavior.js
new file mode 100644
index 0000000..dbe330c
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/infiniteQueryBehavior.js
@@ -0,0 +1,153 @@
+import { isCancelable } from './retryer';
+import { getAbortController } from './utils';
+export function infiniteQueryBehavior() {
+  return {
+    onFetch: function onFetch(context) {
+      context.fetchFn = function () {
+        var _context$fetchOptions, _context$fetchOptions2, _context$fetchOptions3, _context$fetchOptions4, _context$state$data, _context$state$data2;
+
+        var refetchPage = (_context$fetchOptions = context.fetchOptions) == null ? void 0 : (_context$fetchOptions2 = _context$fetchOptions.meta) == null ? void 0 : _context$fetchOptions2.refetchPage;
+        var fetchMore = (_context$fetchOptions3 = context.fetchOptions) == null ? void 0 : (_context$fetchOptions4 = _context$fetchOptions3.meta) == null ? void 0 : _context$fetchOptions4.fetchMore;
+        var pageParam = fetchMore == null ? void 0 : fetchMore.pageParam;
+        var isFetchingNextPage = (fetchMore == null ? void 0 : fetchMore.direction) === 'forward';
+        var isFetchingPreviousPage = (fetchMore == null ? void 0 : fetchMore.direction) === 'backward';
+        var oldPages = ((_context$state$data = context.state.data) == null ? void 0 : _context$state$data.pages) || [];
+        var oldPageParams = ((_context$state$data2 = context.state.data) == null ? void 0 : _context$state$data2.pageParams) || [];
+        var abortController = getAbortController();
+        var abortSignal = abortController == null ? void 0 : abortController.signal;
+        var newPageParams = oldPageParams;
+        var cancelled = false; // Get query function
+
+        var queryFn = context.options.queryFn || function () {
+          return Promise.reject('Missing queryFn');
+        };
+
+        var buildNewPages = function buildNewPages(pages, param, page, previous) {
+          newPageParams = previous ? [param].concat(newPageParams) : [].concat(newPageParams, [param]);
+          return previous ? [page].concat(pages) : [].concat(pages, [page]);
+        }; // Create function to fetch a page
+
+
+        var fetchPage = function fetchPage(pages, manual, param, previous) {
+          if (cancelled) {
+            return Promise.reject('Cancelled');
+          }
+
+          if (typeof param === 'undefined' && !manual && pages.length) {
+            return Promise.resolve(pages);
+          }
+
+          var queryFnContext = {
+            queryKey: context.queryKey,
+            signal: abortSignal,
+            pageParam: param,
+            meta: context.meta
+          };
+          var queryFnResult = queryFn(queryFnContext);
+          var promise = Promise.resolve(queryFnResult).then(function (page) {
+            return buildNewPages(pages, param, page, previous);
+          });
+
+          if (isCancelable(queryFnResult)) {
+            var promiseAsAny = promise;
+            promiseAsAny.cancel = queryFnResult.cancel;
+          }
+
+          return promise;
+        };
+
+        var promise; // Fetch first page?
+
+        if (!oldPages.length) {
+          promise = fetchPage([]);
+        } // Fetch next page?
+        else if (isFetchingNextPage) {
+            var manual = typeof pageParam !== 'undefined';
+            var param = manual ? pageParam : getNextPageParam(context.options, oldPages);
+            promise = fetchPage(oldPages, manual, param);
+          } // Fetch previous page?
+          else if (isFetchingPreviousPage) {
+              var _manual = typeof pageParam !== 'undefined';
+
+              var _param = _manual ? pageParam : getPreviousPageParam(context.options, oldPages);
+
+              promise = fetchPage(oldPages, _manual, _param, true);
+            } // Refetch pages
+            else {
+                (function () {
+                  newPageParams = [];
+                  var manual = typeof context.options.getNextPageParam === 'undefined';
+                  var shouldFetchFirstPage = refetchPage && oldPages[0] ? refetchPage(oldPages[0], 0, oldPages) : true; // Fetch first page
+
+                  promise = shouldFetchFirstPage ? fetchPage([], manual, oldPageParams[0]) : Promise.resolve(buildNewPages([], oldPageParams[0], oldPages[0])); // Fetch remaining pages
+
+                  var _loop = function _loop(i) {
+                    promise = promise.then(function (pages) {
+                      var shouldFetchNextPage = refetchPage && oldPages[i] ? refetchPage(oldPages[i], i, oldPages) : true;
+
+                      if (shouldFetchNextPage) {
+                        var _param2 = manual ? oldPageParams[i] : getNextPageParam(context.options, pages);
+
+                        return fetchPage(pages, manual, _param2);
+                      }
+
+                      return Promise.resolve(buildNewPages(pages, oldPageParams[i], oldPages[i]));
+                    });
+                  };
+
+                  for (var i = 1; i < oldPages.length; i++) {
+                    _loop(i);
+                  }
+                })();
+              }
+
+        var finalPromise = promise.then(function (pages) {
+          return {
+            pages: pages,
+            pageParams: newPageParams
+          };
+        });
+        var finalPromiseAsAny = finalPromise;
+
+        finalPromiseAsAny.cancel = function () {
+          cancelled = true;
+          abortController == null ? void 0 : abortController.abort();
+
+          if (isCancelable(promise)) {
+            promise.cancel();
+          }
+        };
+
+        return finalPromise;
+      };
+    }
+  };
+}
+export function getNextPageParam(options, pages) {
+  return options.getNextPageParam == null ? void 0 : options.getNextPageParam(pages[pages.length - 1], pages);
+}
+export function getPreviousPageParam(options, pages) {
+  return options.getPreviousPageParam == null ? void 0 : options.getPreviousPageParam(pages[0], pages);
+}
+/**
+ * Checks if there is a next page.
+ * Returns `undefined` if it cannot be determined.
+ */
+
+export function hasNextPage(options, pages) {
+  if (options.getNextPageParam && Array.isArray(pages)) {
+    var nextPageParam = getNextPageParam(options, pages);
+    return typeof nextPageParam !== 'undefined' && nextPageParam !== null && nextPageParam !== false;
+  }
+}
+/**
+ * Checks if there is a previous page.
+ * Returns `undefined` if it cannot be determined.
+ */
+
+export function hasPreviousPage(options, pages) {
+  if (options.getPreviousPageParam && Array.isArray(pages)) {
+    var previousPageParam = getPreviousPageParam(options, pages);
+    return typeof previousPageParam !== 'undefined' && previousPageParam !== null && previousPageParam !== false;
+  }
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/logger.js b/ddb_main/node_modules/react-query/es/core/logger.js
new file mode 100644
index 0000000..f0c6f7e
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/logger.js
@@ -0,0 +1,9 @@
+// TYPES
+// FUNCTIONS
+var logger = console;
+export function getLogger() {
+  return logger;
+}
+export function setLogger(newLogger) {
+  logger = newLogger;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/mutation.js b/ddb_main/node_modules/react-query/es/core/mutation.js
new file mode 100644
index 0000000..717e355
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/mutation.js
@@ -0,0 +1,232 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { getLogger } from './logger';
+import { notifyManager } from './notifyManager';
+import { Retryer } from './retryer';
+import { noop } from './utils'; // TYPES
+
+// CLASS
+export var Mutation = /*#__PURE__*/function () {
+  function Mutation(config) {
+    this.options = _extends({}, config.defaultOptions, config.options);
+    this.mutationId = config.mutationId;
+    this.mutationCache = config.mutationCache;
+    this.observers = [];
+    this.state = config.state || getDefaultState();
+    this.meta = config.meta;
+  }
+
+  var _proto = Mutation.prototype;
+
+  _proto.setState = function setState(state) {
+    this.dispatch({
+      type: 'setState',
+      state: state
+    });
+  };
+
+  _proto.addObserver = function addObserver(observer) {
+    if (this.observers.indexOf(observer) === -1) {
+      this.observers.push(observer);
+    }
+  };
+
+  _proto.removeObserver = function removeObserver(observer) {
+    this.observers = this.observers.filter(function (x) {
+      return x !== observer;
+    });
+  };
+
+  _proto.cancel = function cancel() {
+    if (this.retryer) {
+      this.retryer.cancel();
+      return this.retryer.promise.then(noop).catch(noop);
+    }
+
+    return Promise.resolve();
+  };
+
+  _proto.continue = function _continue() {
+    if (this.retryer) {
+      this.retryer.continue();
+      return this.retryer.promise;
+    }
+
+    return this.execute();
+  };
+
+  _proto.execute = function execute() {
+    var _this = this;
+
+    var data;
+    var restored = this.state.status === 'loading';
+    var promise = Promise.resolve();
+
+    if (!restored) {
+      this.dispatch({
+        type: 'loading',
+        variables: this.options.variables
+      });
+      promise = promise.then(function () {
+        // Notify cache callback
+        _this.mutationCache.config.onMutate == null ? void 0 : _this.mutationCache.config.onMutate(_this.state.variables, _this);
+      }).then(function () {
+        return _this.options.onMutate == null ? void 0 : _this.options.onMutate(_this.state.variables);
+      }).then(function (context) {
+        if (context !== _this.state.context) {
+          _this.dispatch({
+            type: 'loading',
+            context: context,
+            variables: _this.state.variables
+          });
+        }
+      });
+    }
+
+    return promise.then(function () {
+      return _this.executeMutation();
+    }).then(function (result) {
+      data = result; // Notify cache callback
+
+      _this.mutationCache.config.onSuccess == null ? void 0 : _this.mutationCache.config.onSuccess(data, _this.state.variables, _this.state.context, _this);
+    }).then(function () {
+      return _this.options.onSuccess == null ? void 0 : _this.options.onSuccess(data, _this.state.variables, _this.state.context);
+    }).then(function () {
+      return _this.options.onSettled == null ? void 0 : _this.options.onSettled(data, null, _this.state.variables, _this.state.context);
+    }).then(function () {
+      _this.dispatch({
+        type: 'success',
+        data: data
+      });
+
+      return data;
+    }).catch(function (error) {
+      // Notify cache callback
+      _this.mutationCache.config.onError == null ? void 0 : _this.mutationCache.config.onError(error, _this.state.variables, _this.state.context, _this); // Log error
+
+      getLogger().error(error);
+      return Promise.resolve().then(function () {
+        return _this.options.onError == null ? void 0 : _this.options.onError(error, _this.state.variables, _this.state.context);
+      }).then(function () {
+        return _this.options.onSettled == null ? void 0 : _this.options.onSettled(undefined, error, _this.state.variables, _this.state.context);
+      }).then(function () {
+        _this.dispatch({
+          type: 'error',
+          error: error
+        });
+
+        throw error;
+      });
+    });
+  };
+
+  _proto.executeMutation = function executeMutation() {
+    var _this2 = this,
+        _this$options$retry;
+
+    this.retryer = new Retryer({
+      fn: function fn() {
+        if (!_this2.options.mutationFn) {
+          return Promise.reject('No mutationFn found');
+        }
+
+        return _this2.options.mutationFn(_this2.state.variables);
+      },
+      onFail: function onFail() {
+        _this2.dispatch({
+          type: 'failed'
+        });
+      },
+      onPause: function onPause() {
+        _this2.dispatch({
+          type: 'pause'
+        });
+      },
+      onContinue: function onContinue() {
+        _this2.dispatch({
+          type: 'continue'
+        });
+      },
+      retry: (_this$options$retry = this.options.retry) != null ? _this$options$retry : 0,
+      retryDelay: this.options.retryDelay
+    });
+    return this.retryer.promise;
+  };
+
+  _proto.dispatch = function dispatch(action) {
+    var _this3 = this;
+
+    this.state = reducer(this.state, action);
+    notifyManager.batch(function () {
+      _this3.observers.forEach(function (observer) {
+        observer.onMutationUpdate(action);
+      });
+
+      _this3.mutationCache.notify(_this3);
+    });
+  };
+
+  return Mutation;
+}();
+export function getDefaultState() {
+  return {
+    context: undefined,
+    data: undefined,
+    error: null,
+    failureCount: 0,
+    isPaused: false,
+    status: 'idle',
+    variables: undefined
+  };
+}
+
+function reducer(state, action) {
+  switch (action.type) {
+    case 'failed':
+      return _extends({}, state, {
+        failureCount: state.failureCount + 1
+      });
+
+    case 'pause':
+      return _extends({}, state, {
+        isPaused: true
+      });
+
+    case 'continue':
+      return _extends({}, state, {
+        isPaused: false
+      });
+
+    case 'loading':
+      return _extends({}, state, {
+        context: action.context,
+        data: undefined,
+        error: null,
+        isPaused: false,
+        status: 'loading',
+        variables: action.variables
+      });
+
+    case 'success':
+      return _extends({}, state, {
+        data: action.data,
+        error: null,
+        status: 'success',
+        isPaused: false
+      });
+
+    case 'error':
+      return _extends({}, state, {
+        data: undefined,
+        error: action.error,
+        failureCount: state.failureCount + 1,
+        isPaused: false,
+        status: 'error'
+      });
+
+    case 'setState':
+      return _extends({}, state, action.state);
+
+    default:
+      return state;
+  }
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/mutationCache.js b/ddb_main/node_modules/react-query/es/core/mutationCache.js
new file mode 100644
index 0000000..eeabc5c
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/mutationCache.js
@@ -0,0 +1,111 @@
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+import { notifyManager } from './notifyManager';
+import { Mutation } from './mutation';
+import { matchMutation, noop } from './utils';
+import { Subscribable } from './subscribable'; // TYPES
+
+// CLASS
+export var MutationCache = /*#__PURE__*/function (_Subscribable) {
+  _inheritsLoose(MutationCache, _Subscribable);
+
+  function MutationCache(config) {
+    var _this;
+
+    _this = _Subscribable.call(this) || this;
+    _this.config = config || {};
+    _this.mutations = [];
+    _this.mutationId = 0;
+    return _this;
+  }
+
+  var _proto = MutationCache.prototype;
+
+  _proto.build = function build(client, options, state) {
+    var mutation = new Mutation({
+      mutationCache: this,
+      mutationId: ++this.mutationId,
+      options: client.defaultMutationOptions(options),
+      state: state,
+      defaultOptions: options.mutationKey ? client.getMutationDefaults(options.mutationKey) : undefined,
+      meta: options.meta
+    });
+    this.add(mutation);
+    return mutation;
+  };
+
+  _proto.add = function add(mutation) {
+    this.mutations.push(mutation);
+    this.notify(mutation);
+  };
+
+  _proto.remove = function remove(mutation) {
+    this.mutations = this.mutations.filter(function (x) {
+      return x !== mutation;
+    });
+    mutation.cancel();
+    this.notify(mutation);
+  };
+
+  _proto.clear = function clear() {
+    var _this2 = this;
+
+    notifyManager.batch(function () {
+      _this2.mutations.forEach(function (mutation) {
+        _this2.remove(mutation);
+      });
+    });
+  };
+
+  _proto.getAll = function getAll() {
+    return this.mutations;
+  };
+
+  _proto.find = function find(filters) {
+    if (typeof filters.exact === 'undefined') {
+      filters.exact = true;
+    }
+
+    return this.mutations.find(function (mutation) {
+      return matchMutation(filters, mutation);
+    });
+  };
+
+  _proto.findAll = function findAll(filters) {
+    return this.mutations.filter(function (mutation) {
+      return matchMutation(filters, mutation);
+    });
+  };
+
+  _proto.notify = function notify(mutation) {
+    var _this3 = this;
+
+    notifyManager.batch(function () {
+      _this3.listeners.forEach(function (listener) {
+        listener(mutation);
+      });
+    });
+  };
+
+  _proto.onFocus = function onFocus() {
+    this.resumePausedMutations();
+  };
+
+  _proto.onOnline = function onOnline() {
+    this.resumePausedMutations();
+  };
+
+  _proto.resumePausedMutations = function resumePausedMutations() {
+    var pausedMutations = this.mutations.filter(function (x) {
+      return x.state.isPaused;
+    });
+    return notifyManager.batch(function () {
+      return pausedMutations.reduce(function (promise, mutation) {
+        return promise.then(function () {
+          return mutation.continue().catch(noop);
+        });
+      }, Promise.resolve());
+    });
+  };
+
+  return MutationCache;
+}(Subscribable);
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/notifyManager.js b/ddb_main/node_modules/react-query/es/core/notifyManager.js
new file mode 100644
index 0000000..68c3817
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/notifyManager.js
@@ -0,0 +1,105 @@
+import { scheduleMicrotask } from './utils'; // TYPES
+
+// CLASS
+export var NotifyManager = /*#__PURE__*/function () {
+  function NotifyManager() {
+    this.queue = [];
+    this.transactions = 0;
+
+    this.notifyFn = function (callback) {
+      callback();
+    };
+
+    this.batchNotifyFn = function (callback) {
+      callback();
+    };
+  }
+
+  var _proto = NotifyManager.prototype;
+
+  _proto.batch = function batch(callback) {
+    var result;
+    this.transactions++;
+
+    try {
+      result = callback();
+    } finally {
+      this.transactions--;
+
+      if (!this.transactions) {
+        this.flush();
+      }
+    }
+
+    return result;
+  };
+
+  _proto.schedule = function schedule(callback) {
+    var _this = this;
+
+    if (this.transactions) {
+      this.queue.push(callback);
+    } else {
+      scheduleMicrotask(function () {
+        _this.notifyFn(callback);
+      });
+    }
+  }
+  /**
+   * All calls to the wrapped function will be batched.
+   */
+  ;
+
+  _proto.batchCalls = function batchCalls(callback) {
+    var _this2 = this;
+
+    return function () {
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+
+      _this2.schedule(function () {
+        callback.apply(void 0, args);
+      });
+    };
+  };
+
+  _proto.flush = function flush() {
+    var _this3 = this;
+
+    var queue = this.queue;
+    this.queue = [];
+
+    if (queue.length) {
+      scheduleMicrotask(function () {
+        _this3.batchNotifyFn(function () {
+          queue.forEach(function (callback) {
+            _this3.notifyFn(callback);
+          });
+        });
+      });
+    }
+  }
+  /**
+   * Use this method to set a custom notify function.
+   * This can be used to for example wrap notifications with `React.act` while running tests.
+   */
+  ;
+
+  _proto.setNotifyFunction = function setNotifyFunction(fn) {
+    this.notifyFn = fn;
+  }
+  /**
+   * Use this method to set a custom function to batch notifications together into a single tick.
+   * By default React Query will use the batch function provided by ReactDOM or React Native.
+   */
+  ;
+
+  _proto.setBatchNotifyFunction = function setBatchNotifyFunction(fn) {
+    this.batchNotifyFn = fn;
+  };
+
+  return NotifyManager;
+}(); // SINGLETON
+
+export var notifyManager = new NotifyManager();
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/onlineManager.js b/ddb_main/node_modules/react-query/es/core/onlineManager.js
new file mode 100644
index 0000000..2dca7fa
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/onlineManager.js
@@ -0,0 +1,94 @@
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+import { Subscribable } from './subscribable';
+import { isServer } from './utils';
+export var OnlineManager = /*#__PURE__*/function (_Subscribable) {
+  _inheritsLoose(OnlineManager, _Subscribable);
+
+  function OnlineManager() {
+    var _this;
+
+    _this = _Subscribable.call(this) || this;
+
+    _this.setup = function (onOnline) {
+      var _window;
+
+      if (!isServer && ((_window = window) == null ? void 0 : _window.addEventListener)) {
+        var listener = function listener() {
+          return onOnline();
+        }; // Listen to online
+
+
+        window.addEventListener('online', listener, false);
+        window.addEventListener('offline', listener, false);
+        return function () {
+          // Be sure to unsubscribe if a new handler is set
+          window.removeEventListener('online', listener);
+          window.removeEventListener('offline', listener);
+        };
+      }
+    };
+
+    return _this;
+  }
+
+  var _proto = OnlineManager.prototype;
+
+  _proto.onSubscribe = function onSubscribe() {
+    if (!this.cleanup) {
+      this.setEventListener(this.setup);
+    }
+  };
+
+  _proto.onUnsubscribe = function onUnsubscribe() {
+    if (!this.hasListeners()) {
+      var _this$cleanup;
+
+      (_this$cleanup = this.cleanup) == null ? void 0 : _this$cleanup.call(this);
+      this.cleanup = undefined;
+    }
+  };
+
+  _proto.setEventListener = function setEventListener(setup) {
+    var _this$cleanup2,
+        _this2 = this;
+
+    this.setup = setup;
+    (_this$cleanup2 = this.cleanup) == null ? void 0 : _this$cleanup2.call(this);
+    this.cleanup = setup(function (online) {
+      if (typeof online === 'boolean') {
+        _this2.setOnline(online);
+      } else {
+        _this2.onOnline();
+      }
+    });
+  };
+
+  _proto.setOnline = function setOnline(online) {
+    this.online = online;
+
+    if (online) {
+      this.onOnline();
+    }
+  };
+
+  _proto.onOnline = function onOnline() {
+    this.listeners.forEach(function (listener) {
+      listener();
+    });
+  };
+
+  _proto.isOnline = function isOnline() {
+    if (typeof this.online === 'boolean') {
+      return this.online;
+    }
+
+    if (typeof navigator === 'undefined' || typeof navigator.onLine === 'undefined') {
+      return true;
+    }
+
+    return navigator.onLine;
+  };
+
+  return OnlineManager;
+}(Subscribable);
+export var onlineManager = new OnlineManager();
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/query.js b/ddb_main/node_modules/react-query/es/core/query.js
new file mode 100644
index 0000000..91e993f
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/query.js
@@ -0,0 +1,500 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { getAbortController, functionalUpdate, isValidTimeout, noop, replaceEqualDeep, timeUntilStale, ensureQueryKeyArray } from './utils';
+import { notifyManager } from './notifyManager';
+import { getLogger } from './logger';
+import { Retryer, isCancelledError } from './retryer'; // TYPES
+
+// CLASS
+export var Query = /*#__PURE__*/function () {
+  function Query(config) {
+    this.abortSignalConsumed = false;
+    this.hadObservers = false;
+    this.defaultOptions = config.defaultOptions;
+    this.setOptions(config.options);
+    this.observers = [];
+    this.cache = config.cache;
+    this.queryKey = config.queryKey;
+    this.queryHash = config.queryHash;
+    this.initialState = config.state || this.getDefaultState(this.options);
+    this.state = this.initialState;
+    this.meta = config.meta;
+    this.scheduleGc();
+  }
+
+  var _proto = Query.prototype;
+
+  _proto.setOptions = function setOptions(options) {
+    var _this$options$cacheTi;
+
+    this.options = _extends({}, this.defaultOptions, options);
+    this.meta = options == null ? void 0 : options.meta; // Default to 5 minutes if not cache time is set
+
+    this.cacheTime = Math.max(this.cacheTime || 0, (_this$options$cacheTi = this.options.cacheTime) != null ? _this$options$cacheTi : 5 * 60 * 1000);
+  };
+
+  _proto.setDefaultOptions = function setDefaultOptions(options) {
+    this.defaultOptions = options;
+  };
+
+  _proto.scheduleGc = function scheduleGc() {
+    var _this = this;
+
+    this.clearGcTimeout();
+
+    if (isValidTimeout(this.cacheTime)) {
+      this.gcTimeout = setTimeout(function () {
+        _this.optionalRemove();
+      }, this.cacheTime);
+    }
+  };
+
+  _proto.clearGcTimeout = function clearGcTimeout() {
+    if (this.gcTimeout) {
+      clearTimeout(this.gcTimeout);
+      this.gcTimeout = undefined;
+    }
+  };
+
+  _proto.optionalRemove = function optionalRemove() {
+    if (!this.observers.length) {
+      if (this.state.isFetching) {
+        if (this.hadObservers) {
+          this.scheduleGc();
+        }
+      } else {
+        this.cache.remove(this);
+      }
+    }
+  };
+
+  _proto.setData = function setData(updater, options) {
+    var _this$options$isDataE, _this$options;
+
+    var prevData = this.state.data; // Get the new data
+
+    var data = functionalUpdate(updater, prevData); // Use prev data if an isDataEqual function is defined and returns `true`
+
+    if ((_this$options$isDataE = (_this$options = this.options).isDataEqual) == null ? void 0 : _this$options$isDataE.call(_this$options, prevData, data)) {
+      data = prevData;
+    } else if (this.options.structuralSharing !== false) {
+      // Structurally share data between prev and new data if needed
+      data = replaceEqualDeep(prevData, data);
+    } // Set data and mark it as cached
+
+
+    this.dispatch({
+      data: data,
+      type: 'success',
+      dataUpdatedAt: options == null ? void 0 : options.updatedAt
+    });
+    return data;
+  };
+
+  _proto.setState = function setState(state, setStateOptions) {
+    this.dispatch({
+      type: 'setState',
+      state: state,
+      setStateOptions: setStateOptions
+    });
+  };
+
+  _proto.cancel = function cancel(options) {
+    var _this$retryer;
+
+    var promise = this.promise;
+    (_this$retryer = this.retryer) == null ? void 0 : _this$retryer.cancel(options);
+    return promise ? promise.then(noop).catch(noop) : Promise.resolve();
+  };
+
+  _proto.destroy = function destroy() {
+    this.clearGcTimeout();
+    this.cancel({
+      silent: true
+    });
+  };
+
+  _proto.reset = function reset() {
+    this.destroy();
+    this.setState(this.initialState);
+  };
+
+  _proto.isActive = function isActive() {
+    return this.observers.some(function (observer) {
+      return observer.options.enabled !== false;
+    });
+  };
+
+  _proto.isFetching = function isFetching() {
+    return this.state.isFetching;
+  };
+
+  _proto.isStale = function isStale() {
+    return this.state.isInvalidated || !this.state.dataUpdatedAt || this.observers.some(function (observer) {
+      return observer.getCurrentResult().isStale;
+    });
+  };
+
+  _proto.isStaleByTime = function isStaleByTime(staleTime) {
+    if (staleTime === void 0) {
+      staleTime = 0;
+    }
+
+    return this.state.isInvalidated || !this.state.dataUpdatedAt || !timeUntilStale(this.state.dataUpdatedAt, staleTime);
+  };
+
+  _proto.onFocus = function onFocus() {
+    var _this$retryer2;
+
+    var observer = this.observers.find(function (x) {
+      return x.shouldFetchOnWindowFocus();
+    });
+
+    if (observer) {
+      observer.refetch();
+    } // Continue fetch if currently paused
+
+
+    (_this$retryer2 = this.retryer) == null ? void 0 : _this$retryer2.continue();
+  };
+
+  _proto.onOnline = function onOnline() {
+    var _this$retryer3;
+
+    var observer = this.observers.find(function (x) {
+      return x.shouldFetchOnReconnect();
+    });
+
+    if (observer) {
+      observer.refetch();
+    } // Continue fetch if currently paused
+
+
+    (_this$retryer3 = this.retryer) == null ? void 0 : _this$retryer3.continue();
+  };
+
+  _proto.addObserver = function addObserver(observer) {
+    if (this.observers.indexOf(observer) === -1) {
+      this.observers.push(observer);
+      this.hadObservers = true; // Stop the query from being garbage collected
+
+      this.clearGcTimeout();
+      this.cache.notify({
+        type: 'observerAdded',
+        query: this,
+        observer: observer
+      });
+    }
+  };
+
+  _proto.removeObserver = function removeObserver(observer) {
+    if (this.observers.indexOf(observer) !== -1) {
+      this.observers = this.observers.filter(function (x) {
+        return x !== observer;
+      });
+
+      if (!this.observers.length) {
+        // If the transport layer does not support cancellation
+        // we'll let the query continue so the result can be cached
+        if (this.retryer) {
+          if (this.retryer.isTransportCancelable || this.abortSignalConsumed) {
+            this.retryer.cancel({
+              revert: true
+            });
+          } else {
+            this.retryer.cancelRetry();
+          }
+        }
+
+        if (this.cacheTime) {
+          this.scheduleGc();
+        } else {
+          this.cache.remove(this);
+        }
+      }
+
+      this.cache.notify({
+        type: 'observerRemoved',
+        query: this,
+        observer: observer
+      });
+    }
+  };
+
+  _proto.getObserversCount = function getObserversCount() {
+    return this.observers.length;
+  };
+
+  _proto.invalidate = function invalidate() {
+    if (!this.state.isInvalidated) {
+      this.dispatch({
+        type: 'invalidate'
+      });
+    }
+  };
+
+  _proto.fetch = function fetch(options, fetchOptions) {
+    var _this2 = this,
+        _this$options$behavio,
+        _context$fetchOptions,
+        _abortController$abor;
+
+    if (this.state.isFetching) {
+      if (this.state.dataUpdatedAt && (fetchOptions == null ? void 0 : fetchOptions.cancelRefetch)) {
+        // Silently cancel current fetch if the user wants to cancel refetches
+        this.cancel({
+          silent: true
+        });
+      } else if (this.promise) {
+        var _this$retryer4;
+
+        // make sure that retries that were potentially cancelled due to unmounts can continue
+        (_this$retryer4 = this.retryer) == null ? void 0 : _this$retryer4.continueRetry(); // Return current promise if we are already fetching
+
+        return this.promise;
+      }
+    } // Update config if passed, otherwise the config from the last execution is used
+
+
+    if (options) {
+      this.setOptions(options);
+    } // Use the options from the first observer with a query function if no function is found.
+    // This can happen when the query is hydrated or created with setQueryData.
+
+
+    if (!this.options.queryFn) {
+      var observer = this.observers.find(function (x) {
+        return x.options.queryFn;
+      });
+
+      if (observer) {
+        this.setOptions(observer.options);
+      }
+    }
+
+    var queryKey = ensureQueryKeyArray(this.queryKey);
+    var abortController = getAbortController(); // Create query function context
+
+    var queryFnContext = {
+      queryKey: queryKey,
+      pageParam: undefined,
+      meta: this.meta
+    };
+    Object.defineProperty(queryFnContext, 'signal', {
+      enumerable: true,
+      get: function get() {
+        if (abortController) {
+          _this2.abortSignalConsumed = true;
+          return abortController.signal;
+        }
+
+        return undefined;
+      }
+    }); // Create fetch function
+
+    var fetchFn = function fetchFn() {
+      if (!_this2.options.queryFn) {
+        return Promise.reject('Missing queryFn');
+      }
+
+      _this2.abortSignalConsumed = false;
+      return _this2.options.queryFn(queryFnContext);
+    }; // Trigger behavior hook
+
+
+    var context = {
+      fetchOptions: fetchOptions,
+      options: this.options,
+      queryKey: queryKey,
+      state: this.state,
+      fetchFn: fetchFn,
+      meta: this.meta
+    };
+
+    if ((_this$options$behavio = this.options.behavior) == null ? void 0 : _this$options$behavio.onFetch) {
+      var _this$options$behavio2;
+
+      (_this$options$behavio2 = this.options.behavior) == null ? void 0 : _this$options$behavio2.onFetch(context);
+    } // Store state in case the current fetch needs to be reverted
+
+
+    this.revertState = this.state; // Set to fetching state if not already in it
+
+    if (!this.state.isFetching || this.state.fetchMeta !== ((_context$fetchOptions = context.fetchOptions) == null ? void 0 : _context$fetchOptions.meta)) {
+      var _context$fetchOptions2;
+
+      this.dispatch({
+        type: 'fetch',
+        meta: (_context$fetchOptions2 = context.fetchOptions) == null ? void 0 : _context$fetchOptions2.meta
+      });
+    } // Try to fetch the data
+
+
+    this.retryer = new Retryer({
+      fn: context.fetchFn,
+      abort: abortController == null ? void 0 : (_abortController$abor = abortController.abort) == null ? void 0 : _abortController$abor.bind(abortController),
+      onSuccess: function onSuccess(data) {
+        _this2.setData(data); // Notify cache callback
+
+
+        _this2.cache.config.onSuccess == null ? void 0 : _this2.cache.config.onSuccess(data, _this2); // Remove query after fetching if cache time is 0
+
+        if (_this2.cacheTime === 0) {
+          _this2.optionalRemove();
+        }
+      },
+      onError: function onError(error) {
+        // Optimistically update state if needed
+        if (!(isCancelledError(error) && error.silent)) {
+          _this2.dispatch({
+            type: 'error',
+            error: error
+          });
+        }
+
+        if (!isCancelledError(error)) {
+          // Notify cache callback
+          _this2.cache.config.onError == null ? void 0 : _this2.cache.config.onError(error, _this2); // Log error
+
+          getLogger().error(error);
+        } // Remove query after fetching if cache time is 0
+
+
+        if (_this2.cacheTime === 0) {
+          _this2.optionalRemove();
+        }
+      },
+      onFail: function onFail() {
+        _this2.dispatch({
+          type: 'failed'
+        });
+      },
+      onPause: function onPause() {
+        _this2.dispatch({
+          type: 'pause'
+        });
+      },
+      onContinue: function onContinue() {
+        _this2.dispatch({
+          type: 'continue'
+        });
+      },
+      retry: context.options.retry,
+      retryDelay: context.options.retryDelay
+    });
+    this.promise = this.retryer.promise;
+    return this.promise;
+  };
+
+  _proto.dispatch = function dispatch(action) {
+    var _this3 = this;
+
+    this.state = this.reducer(this.state, action);
+    notifyManager.batch(function () {
+      _this3.observers.forEach(function (observer) {
+        observer.onQueryUpdate(action);
+      });
+
+      _this3.cache.notify({
+        query: _this3,
+        type: 'queryUpdated',
+        action: action
+      });
+    });
+  };
+
+  _proto.getDefaultState = function getDefaultState(options) {
+    var data = typeof options.initialData === 'function' ? options.initialData() : options.initialData;
+    var hasInitialData = typeof options.initialData !== 'undefined';
+    var initialDataUpdatedAt = hasInitialData ? typeof options.initialDataUpdatedAt === 'function' ? options.initialDataUpdatedAt() : options.initialDataUpdatedAt : 0;
+    var hasData = typeof data !== 'undefined';
+    return {
+      data: data,
+      dataUpdateCount: 0,
+      dataUpdatedAt: hasData ? initialDataUpdatedAt != null ? initialDataUpdatedAt : Date.now() : 0,
+      error: null,
+      errorUpdateCount: 0,
+      errorUpdatedAt: 0,
+      fetchFailureCount: 0,
+      fetchMeta: null,
+      isFetching: false,
+      isInvalidated: false,
+      isPaused: false,
+      status: hasData ? 'success' : 'idle'
+    };
+  };
+
+  _proto.reducer = function reducer(state, action) {
+    var _action$meta, _action$dataUpdatedAt;
+
+    switch (action.type) {
+      case 'failed':
+        return _extends({}, state, {
+          fetchFailureCount: state.fetchFailureCount + 1
+        });
+
+      case 'pause':
+        return _extends({}, state, {
+          isPaused: true
+        });
+
+      case 'continue':
+        return _extends({}, state, {
+          isPaused: false
+        });
+
+      case 'fetch':
+        return _extends({}, state, {
+          fetchFailureCount: 0,
+          fetchMeta: (_action$meta = action.meta) != null ? _action$meta : null,
+          isFetching: true,
+          isPaused: false
+        }, !state.dataUpdatedAt && {
+          error: null,
+          status: 'loading'
+        });
+
+      case 'success':
+        return _extends({}, state, {
+          data: action.data,
+          dataUpdateCount: state.dataUpdateCount + 1,
+          dataUpdatedAt: (_action$dataUpdatedAt = action.dataUpdatedAt) != null ? _action$dataUpdatedAt : Date.now(),
+          error: null,
+          fetchFailureCount: 0,
+          isFetching: false,
+          isInvalidated: false,
+          isPaused: false,
+          status: 'success'
+        });
+
+      case 'error':
+        var error = action.error;
+
+        if (isCancelledError(error) && error.revert && this.revertState) {
+          return _extends({}, this.revertState);
+        }
+
+        return _extends({}, state, {
+          error: error,
+          errorUpdateCount: state.errorUpdateCount + 1,
+          errorUpdatedAt: Date.now(),
+          fetchFailureCount: state.fetchFailureCount + 1,
+          isFetching: false,
+          isPaused: false,
+          status: 'error'
+        });
+
+      case 'invalidate':
+        return _extends({}, state, {
+          isInvalidated: true
+        });
+
+      case 'setState':
+        return _extends({}, state, action.state);
+
+      default:
+        return state;
+    }
+  };
+
+  return Query;
+}();
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/queryCache.js b/ddb_main/node_modules/react-query/es/core/queryCache.js
new file mode 100644
index 0000000..cda9913
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/queryCache.js
@@ -0,0 +1,147 @@
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+import { hashQueryKeyByOptions, matchQuery, parseFilterArgs } from './utils';
+import { Query } from './query';
+import { notifyManager } from './notifyManager';
+import { Subscribable } from './subscribable';
+// CLASS
+export var QueryCache = /*#__PURE__*/function (_Subscribable) {
+  _inheritsLoose(QueryCache, _Subscribable);
+
+  function QueryCache(config) {
+    var _this;
+
+    _this = _Subscribable.call(this) || this;
+    _this.config = config || {};
+    _this.queries = [];
+    _this.queriesMap = {};
+    return _this;
+  }
+
+  var _proto = QueryCache.prototype;
+
+  _proto.build = function build(client, options, state) {
+    var _options$queryHash;
+
+    var queryKey = options.queryKey;
+    var queryHash = (_options$queryHash = options.queryHash) != null ? _options$queryHash : hashQueryKeyByOptions(queryKey, options);
+    var query = this.get(queryHash);
+
+    if (!query) {
+      query = new Query({
+        cache: this,
+        queryKey: queryKey,
+        queryHash: queryHash,
+        options: client.defaultQueryOptions(options),
+        state: state,
+        defaultOptions: client.getQueryDefaults(queryKey),
+        meta: options.meta
+      });
+      this.add(query);
+    }
+
+    return query;
+  };
+
+  _proto.add = function add(query) {
+    if (!this.queriesMap[query.queryHash]) {
+      this.queriesMap[query.queryHash] = query;
+      this.queries.push(query);
+      this.notify({
+        type: 'queryAdded',
+        query: query
+      });
+    }
+  };
+
+  _proto.remove = function remove(query) {
+    var queryInMap = this.queriesMap[query.queryHash];
+
+    if (queryInMap) {
+      query.destroy();
+      this.queries = this.queries.filter(function (x) {
+        return x !== query;
+      });
+
+      if (queryInMap === query) {
+        delete this.queriesMap[query.queryHash];
+      }
+
+      this.notify({
+        type: 'queryRemoved',
+        query: query
+      });
+    }
+  };
+
+  _proto.clear = function clear() {
+    var _this2 = this;
+
+    notifyManager.batch(function () {
+      _this2.queries.forEach(function (query) {
+        _this2.remove(query);
+      });
+    });
+  };
+
+  _proto.get = function get(queryHash) {
+    return this.queriesMap[queryHash];
+  };
+
+  _proto.getAll = function getAll() {
+    return this.queries;
+  };
+
+  _proto.find = function find(arg1, arg2) {
+    var _parseFilterArgs = parseFilterArgs(arg1, arg2),
+        filters = _parseFilterArgs[0];
+
+    if (typeof filters.exact === 'undefined') {
+      filters.exact = true;
+    }
+
+    return this.queries.find(function (query) {
+      return matchQuery(filters, query);
+    });
+  };
+
+  _proto.findAll = function findAll(arg1, arg2) {
+    var _parseFilterArgs2 = parseFilterArgs(arg1, arg2),
+        filters = _parseFilterArgs2[0];
+
+    return Object.keys(filters).length > 0 ? this.queries.filter(function (query) {
+      return matchQuery(filters, query);
+    }) : this.queries;
+  };
+
+  _proto.notify = function notify(event) {
+    var _this3 = this;
+
+    notifyManager.batch(function () {
+      _this3.listeners.forEach(function (listener) {
+        listener(event);
+      });
+    });
+  };
+
+  _proto.onFocus = function onFocus() {
+    var _this4 = this;
+
+    notifyManager.batch(function () {
+      _this4.queries.forEach(function (query) {
+        query.onFocus();
+      });
+    });
+  };
+
+  _proto.onOnline = function onOnline() {
+    var _this5 = this;
+
+    notifyManager.batch(function () {
+      _this5.queries.forEach(function (query) {
+        query.onOnline();
+      });
+    });
+  };
+
+  return QueryCache;
+}(Subscribable);
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/queryClient.js b/ddb_main/node_modules/react-query/es/core/queryClient.js
new file mode 100644
index 0000000..6d0a026
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/queryClient.js
@@ -0,0 +1,350 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { hashQueryKey, noop, parseFilterArgs, parseQueryArgs, partialMatchKey, hashQueryKeyByOptions } from './utils';
+import { QueryCache } from './queryCache';
+import { MutationCache } from './mutationCache';
+import { focusManager } from './focusManager';
+import { onlineManager } from './onlineManager';
+import { notifyManager } from './notifyManager';
+import { infiniteQueryBehavior } from './infiniteQueryBehavior';
+// CLASS
+export var QueryClient = /*#__PURE__*/function () {
+  function QueryClient(config) {
+    if (config === void 0) {
+      config = {};
+    }
+
+    this.queryCache = config.queryCache || new QueryCache();
+    this.mutationCache = config.mutationCache || new MutationCache();
+    this.defaultOptions = config.defaultOptions || {};
+    this.queryDefaults = [];
+    this.mutationDefaults = [];
+  }
+
+  var _proto = QueryClient.prototype;
+
+  _proto.mount = function mount() {
+    var _this = this;
+
+    this.unsubscribeFocus = focusManager.subscribe(function () {
+      if (focusManager.isFocused() && onlineManager.isOnline()) {
+        _this.mutationCache.onFocus();
+
+        _this.queryCache.onFocus();
+      }
+    });
+    this.unsubscribeOnline = onlineManager.subscribe(function () {
+      if (focusManager.isFocused() && onlineManager.isOnline()) {
+        _this.mutationCache.onOnline();
+
+        _this.queryCache.onOnline();
+      }
+    });
+  };
+
+  _proto.unmount = function unmount() {
+    var _this$unsubscribeFocu, _this$unsubscribeOnli;
+
+    (_this$unsubscribeFocu = this.unsubscribeFocus) == null ? void 0 : _this$unsubscribeFocu.call(this);
+    (_this$unsubscribeOnli = this.unsubscribeOnline) == null ? void 0 : _this$unsubscribeOnli.call(this);
+  };
+
+  _proto.isFetching = function isFetching(arg1, arg2) {
+    var _parseFilterArgs = parseFilterArgs(arg1, arg2),
+        filters = _parseFilterArgs[0];
+
+    filters.fetching = true;
+    return this.queryCache.findAll(filters).length;
+  };
+
+  _proto.isMutating = function isMutating(filters) {
+    return this.mutationCache.findAll(_extends({}, filters, {
+      fetching: true
+    })).length;
+  };
+
+  _proto.getQueryData = function getQueryData(queryKey, filters) {
+    var _this$queryCache$find;
+
+    return (_this$queryCache$find = this.queryCache.find(queryKey, filters)) == null ? void 0 : _this$queryCache$find.state.data;
+  };
+
+  _proto.getQueriesData = function getQueriesData(queryKeyOrFilters) {
+    return this.getQueryCache().findAll(queryKeyOrFilters).map(function (_ref) {
+      var queryKey = _ref.queryKey,
+          state = _ref.state;
+      var data = state.data;
+      return [queryKey, data];
+    });
+  };
+
+  _proto.setQueryData = function setQueryData(queryKey, updater, options) {
+    var parsedOptions = parseQueryArgs(queryKey);
+    var defaultedOptions = this.defaultQueryOptions(parsedOptions);
+    return this.queryCache.build(this, defaultedOptions).setData(updater, options);
+  };
+
+  _proto.setQueriesData = function setQueriesData(queryKeyOrFilters, updater, options) {
+    var _this2 = this;
+
+    return notifyManager.batch(function () {
+      return _this2.getQueryCache().findAll(queryKeyOrFilters).map(function (_ref2) {
+        var queryKey = _ref2.queryKey;
+        return [queryKey, _this2.setQueryData(queryKey, updater, options)];
+      });
+    });
+  };
+
+  _proto.getQueryState = function getQueryState(queryKey, filters) {
+    var _this$queryCache$find2;
+
+    return (_this$queryCache$find2 = this.queryCache.find(queryKey, filters)) == null ? void 0 : _this$queryCache$find2.state;
+  };
+
+  _proto.removeQueries = function removeQueries(arg1, arg2) {
+    var _parseFilterArgs2 = parseFilterArgs(arg1, arg2),
+        filters = _parseFilterArgs2[0];
+
+    var queryCache = this.queryCache;
+    notifyManager.batch(function () {
+      queryCache.findAll(filters).forEach(function (query) {
+        queryCache.remove(query);
+      });
+    });
+  };
+
+  _proto.resetQueries = function resetQueries(arg1, arg2, arg3) {
+    var _this3 = this;
+
+    var _parseFilterArgs3 = parseFilterArgs(arg1, arg2, arg3),
+        filters = _parseFilterArgs3[0],
+        options = _parseFilterArgs3[1];
+
+    var queryCache = this.queryCache;
+
+    var refetchFilters = _extends({}, filters, {
+      active: true
+    });
+
+    return notifyManager.batch(function () {
+      queryCache.findAll(filters).forEach(function (query) {
+        query.reset();
+      });
+      return _this3.refetchQueries(refetchFilters, options);
+    });
+  };
+
+  _proto.cancelQueries = function cancelQueries(arg1, arg2, arg3) {
+    var _this4 = this;
+
+    var _parseFilterArgs4 = parseFilterArgs(arg1, arg2, arg3),
+        filters = _parseFilterArgs4[0],
+        _parseFilterArgs4$ = _parseFilterArgs4[1],
+        cancelOptions = _parseFilterArgs4$ === void 0 ? {} : _parseFilterArgs4$;
+
+    if (typeof cancelOptions.revert === 'undefined') {
+      cancelOptions.revert = true;
+    }
+
+    var promises = notifyManager.batch(function () {
+      return _this4.queryCache.findAll(filters).map(function (query) {
+        return query.cancel(cancelOptions);
+      });
+    });
+    return Promise.all(promises).then(noop).catch(noop);
+  };
+
+  _proto.invalidateQueries = function invalidateQueries(arg1, arg2, arg3) {
+    var _ref3,
+        _filters$refetchActiv,
+        _filters$refetchInact,
+        _this5 = this;
+
+    var _parseFilterArgs5 = parseFilterArgs(arg1, arg2, arg3),
+        filters = _parseFilterArgs5[0],
+        options = _parseFilterArgs5[1];
+
+    var refetchFilters = _extends({}, filters, {
+      // if filters.refetchActive is not provided and filters.active is explicitly false,
+      // e.g. invalidateQueries({ active: false }), we don't want to refetch active queries
+      active: (_ref3 = (_filters$refetchActiv = filters.refetchActive) != null ? _filters$refetchActiv : filters.active) != null ? _ref3 : true,
+      inactive: (_filters$refetchInact = filters.refetchInactive) != null ? _filters$refetchInact : false
+    });
+
+    return notifyManager.batch(function () {
+      _this5.queryCache.findAll(filters).forEach(function (query) {
+        query.invalidate();
+      });
+
+      return _this5.refetchQueries(refetchFilters, options);
+    });
+  };
+
+  _proto.refetchQueries = function refetchQueries(arg1, arg2, arg3) {
+    var _this6 = this;
+
+    var _parseFilterArgs6 = parseFilterArgs(arg1, arg2, arg3),
+        filters = _parseFilterArgs6[0],
+        options = _parseFilterArgs6[1];
+
+    var promises = notifyManager.batch(function () {
+      return _this6.queryCache.findAll(filters).map(function (query) {
+        return query.fetch(undefined, _extends({}, options, {
+          meta: {
+            refetchPage: filters == null ? void 0 : filters.refetchPage
+          }
+        }));
+      });
+    });
+    var promise = Promise.all(promises).then(noop);
+
+    if (!(options == null ? void 0 : options.throwOnError)) {
+      promise = promise.catch(noop);
+    }
+
+    return promise;
+  };
+
+  _proto.fetchQuery = function fetchQuery(arg1, arg2, arg3) {
+    var parsedOptions = parseQueryArgs(arg1, arg2, arg3);
+    var defaultedOptions = this.defaultQueryOptions(parsedOptions); // https://github.com/tannerlinsley/react-query/issues/652
+
+    if (typeof defaultedOptions.retry === 'undefined') {
+      defaultedOptions.retry = false;
+    }
+
+    var query = this.queryCache.build(this, defaultedOptions);
+    return query.isStaleByTime(defaultedOptions.staleTime) ? query.fetch(defaultedOptions) : Promise.resolve(query.state.data);
+  };
+
+  _proto.prefetchQuery = function prefetchQuery(arg1, arg2, arg3) {
+    return this.fetchQuery(arg1, arg2, arg3).then(noop).catch(noop);
+  };
+
+  _proto.fetchInfiniteQuery = function fetchInfiniteQuery(arg1, arg2, arg3) {
+    var parsedOptions = parseQueryArgs(arg1, arg2, arg3);
+    parsedOptions.behavior = infiniteQueryBehavior();
+    return this.fetchQuery(parsedOptions);
+  };
+
+  _proto.prefetchInfiniteQuery = function prefetchInfiniteQuery(arg1, arg2, arg3) {
+    return this.fetchInfiniteQuery(arg1, arg2, arg3).then(noop).catch(noop);
+  };
+
+  _proto.cancelMutations = function cancelMutations() {
+    var _this7 = this;
+
+    var promises = notifyManager.batch(function () {
+      return _this7.mutationCache.getAll().map(function (mutation) {
+        return mutation.cancel();
+      });
+    });
+    return Promise.all(promises).then(noop).catch(noop);
+  };
+
+  _proto.resumePausedMutations = function resumePausedMutations() {
+    return this.getMutationCache().resumePausedMutations();
+  };
+
+  _proto.executeMutation = function executeMutation(options) {
+    return this.mutationCache.build(this, options).execute();
+  };
+
+  _proto.getQueryCache = function getQueryCache() {
+    return this.queryCache;
+  };
+
+  _proto.getMutationCache = function getMutationCache() {
+    return this.mutationCache;
+  };
+
+  _proto.getDefaultOptions = function getDefaultOptions() {
+    return this.defaultOptions;
+  };
+
+  _proto.setDefaultOptions = function setDefaultOptions(options) {
+    this.defaultOptions = options;
+  };
+
+  _proto.setQueryDefaults = function setQueryDefaults(queryKey, options) {
+    var result = this.queryDefaults.find(function (x) {
+      return hashQueryKey(queryKey) === hashQueryKey(x.queryKey);
+    });
+
+    if (result) {
+      result.defaultOptions = options;
+    } else {
+      this.queryDefaults.push({
+        queryKey: queryKey,
+        defaultOptions: options
+      });
+    }
+  };
+
+  _proto.getQueryDefaults = function getQueryDefaults(queryKey) {
+    var _this$queryDefaults$f;
+
+    return queryKey ? (_this$queryDefaults$f = this.queryDefaults.find(function (x) {
+      return partialMatchKey(queryKey, x.queryKey);
+    })) == null ? void 0 : _this$queryDefaults$f.defaultOptions : undefined;
+  };
+
+  _proto.setMutationDefaults = function setMutationDefaults(mutationKey, options) {
+    var result = this.mutationDefaults.find(function (x) {
+      return hashQueryKey(mutationKey) === hashQueryKey(x.mutationKey);
+    });
+
+    if (result) {
+      result.defaultOptions = options;
+    } else {
+      this.mutationDefaults.push({
+        mutationKey: mutationKey,
+        defaultOptions: options
+      });
+    }
+  };
+
+  _proto.getMutationDefaults = function getMutationDefaults(mutationKey) {
+    var _this$mutationDefault;
+
+    return mutationKey ? (_this$mutationDefault = this.mutationDefaults.find(function (x) {
+      return partialMatchKey(mutationKey, x.mutationKey);
+    })) == null ? void 0 : _this$mutationDefault.defaultOptions : undefined;
+  };
+
+  _proto.defaultQueryOptions = function defaultQueryOptions(options) {
+    if (options == null ? void 0 : options._defaulted) {
+      return options;
+    }
+
+    var defaultedOptions = _extends({}, this.defaultOptions.queries, this.getQueryDefaults(options == null ? void 0 : options.queryKey), options, {
+      _defaulted: true
+    });
+
+    if (!defaultedOptions.queryHash && defaultedOptions.queryKey) {
+      defaultedOptions.queryHash = hashQueryKeyByOptions(defaultedOptions.queryKey, defaultedOptions);
+    }
+
+    return defaultedOptions;
+  };
+
+  _proto.defaultQueryObserverOptions = function defaultQueryObserverOptions(options) {
+    return this.defaultQueryOptions(options);
+  };
+
+  _proto.defaultMutationOptions = function defaultMutationOptions(options) {
+    if (options == null ? void 0 : options._defaulted) {
+      return options;
+    }
+
+    return _extends({}, this.defaultOptions.mutations, this.getMutationDefaults(options == null ? void 0 : options.mutationKey), options, {
+      _defaulted: true
+    });
+  };
+
+  _proto.clear = function clear() {
+    this.queryCache.clear();
+    this.mutationCache.clear();
+  };
+
+  return QueryClient;
+}();
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/queryObserver.js b/ddb_main/node_modules/react-query/es/core/queryObserver.js
new file mode 100644
index 0000000..aa32a43
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/queryObserver.js
@@ -0,0 +1,549 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+import { isServer, isValidTimeout, noop, replaceEqualDeep, shallowEqualObjects, timeUntilStale } from './utils';
+import { notifyManager } from './notifyManager';
+import { focusManager } from './focusManager';
+import { Subscribable } from './subscribable';
+import { getLogger } from './logger';
+import { isCancelledError } from './retryer';
+export var QueryObserver = /*#__PURE__*/function (_Subscribable) {
+  _inheritsLoose(QueryObserver, _Subscribable);
+
+  function QueryObserver(client, options) {
+    var _this;
+
+    _this = _Subscribable.call(this) || this;
+    _this.client = client;
+    _this.options = options;
+    _this.trackedProps = [];
+    _this.selectError = null;
+
+    _this.bindMethods();
+
+    _this.setOptions(options);
+
+    return _this;
+  }
+
+  var _proto = QueryObserver.prototype;
+
+  _proto.bindMethods = function bindMethods() {
+    this.remove = this.remove.bind(this);
+    this.refetch = this.refetch.bind(this);
+  };
+
+  _proto.onSubscribe = function onSubscribe() {
+    if (this.listeners.length === 1) {
+      this.currentQuery.addObserver(this);
+
+      if (shouldFetchOnMount(this.currentQuery, this.options)) {
+        this.executeFetch();
+      }
+
+      this.updateTimers();
+    }
+  };
+
+  _proto.onUnsubscribe = function onUnsubscribe() {
+    if (!this.listeners.length) {
+      this.destroy();
+    }
+  };
+
+  _proto.shouldFetchOnReconnect = function shouldFetchOnReconnect() {
+    return shouldFetchOn(this.currentQuery, this.options, this.options.refetchOnReconnect);
+  };
+
+  _proto.shouldFetchOnWindowFocus = function shouldFetchOnWindowFocus() {
+    return shouldFetchOn(this.currentQuery, this.options, this.options.refetchOnWindowFocus);
+  };
+
+  _proto.destroy = function destroy() {
+    this.listeners = [];
+    this.clearTimers();
+    this.currentQuery.removeObserver(this);
+  };
+
+  _proto.setOptions = function setOptions(options, notifyOptions) {
+    var prevOptions = this.options;
+    var prevQuery = this.currentQuery;
+    this.options = this.client.defaultQueryObserverOptions(options);
+
+    if (typeof this.options.enabled !== 'undefined' && typeof this.options.enabled !== 'boolean') {
+      throw new Error('Expected enabled to be a boolean');
+    } // Keep previous query key if the user does not supply one
+
+
+    if (!this.options.queryKey) {
+      this.options.queryKey = prevOptions.queryKey;
+    }
+
+    this.updateQuery();
+    var mounted = this.hasListeners(); // Fetch if there are subscribers
+
+    if (mounted && shouldFetchOptionally(this.currentQuery, prevQuery, this.options, prevOptions)) {
+      this.executeFetch();
+    } // Update result
+
+
+    this.updateResult(notifyOptions); // Update stale interval if needed
+
+    if (mounted && (this.currentQuery !== prevQuery || this.options.enabled !== prevOptions.enabled || this.options.staleTime !== prevOptions.staleTime)) {
+      this.updateStaleTimeout();
+    }
+
+    var nextRefetchInterval = this.computeRefetchInterval(); // Update refetch interval if needed
+
+    if (mounted && (this.currentQuery !== prevQuery || this.options.enabled !== prevOptions.enabled || nextRefetchInterval !== this.currentRefetchInterval)) {
+      this.updateRefetchInterval(nextRefetchInterval);
+    }
+  };
+
+  _proto.getOptimisticResult = function getOptimisticResult(options) {
+    var defaultedOptions = this.client.defaultQueryObserverOptions(options);
+    var query = this.client.getQueryCache().build(this.client, defaultedOptions);
+    return this.createResult(query, defaultedOptions);
+  };
+
+  _proto.getCurrentResult = function getCurrentResult() {
+    return this.currentResult;
+  };
+
+  _proto.trackResult = function trackResult(result, defaultedOptions) {
+    var _this2 = this;
+
+    var trackedResult = {};
+
+    var trackProp = function trackProp(key) {
+      if (!_this2.trackedProps.includes(key)) {
+        _this2.trackedProps.push(key);
+      }
+    };
+
+    Object.keys(result).forEach(function (key) {
+      Object.defineProperty(trackedResult, key, {
+        configurable: false,
+        enumerable: true,
+        get: function get() {
+          trackProp(key);
+          return result[key];
+        }
+      });
+    });
+
+    if (defaultedOptions.useErrorBoundary || defaultedOptions.suspense) {
+      trackProp('error');
+    }
+
+    return trackedResult;
+  };
+
+  _proto.getNextResult = function getNextResult(options) {
+    var _this3 = this;
+
+    return new Promise(function (resolve, reject) {
+      var unsubscribe = _this3.subscribe(function (result) {
+        if (!result.isFetching) {
+          unsubscribe();
+
+          if (result.isError && (options == null ? void 0 : options.throwOnError)) {
+            reject(result.error);
+          } else {
+            resolve(result);
+          }
+        }
+      });
+    });
+  };
+
+  _proto.getCurrentQuery = function getCurrentQuery() {
+    return this.currentQuery;
+  };
+
+  _proto.remove = function remove() {
+    this.client.getQueryCache().remove(this.currentQuery);
+  };
+
+  _proto.refetch = function refetch(options) {
+    return this.fetch(_extends({}, options, {
+      meta: {
+        refetchPage: options == null ? void 0 : options.refetchPage
+      }
+    }));
+  };
+
+  _proto.fetchOptimistic = function fetchOptimistic(options) {
+    var _this4 = this;
+
+    var defaultedOptions = this.client.defaultQueryObserverOptions(options);
+    var query = this.client.getQueryCache().build(this.client, defaultedOptions);
+    return query.fetch().then(function () {
+      return _this4.createResult(query, defaultedOptions);
+    });
+  };
+
+  _proto.fetch = function fetch(fetchOptions) {
+    var _this5 = this;
+
+    return this.executeFetch(fetchOptions).then(function () {
+      _this5.updateResult();
+
+      return _this5.currentResult;
+    });
+  };
+
+  _proto.executeFetch = function executeFetch(fetchOptions) {
+    // Make sure we reference the latest query as the current one might have been removed
+    this.updateQuery(); // Fetch
+
+    var promise = this.currentQuery.fetch(this.options, fetchOptions);
+
+    if (!(fetchOptions == null ? void 0 : fetchOptions.throwOnError)) {
+      promise = promise.catch(noop);
+    }
+
+    return promise;
+  };
+
+  _proto.updateStaleTimeout = function updateStaleTimeout() {
+    var _this6 = this;
+
+    this.clearStaleTimeout();
+
+    if (isServer || this.currentResult.isStale || !isValidTimeout(this.options.staleTime)) {
+      return;
+    }
+
+    var time = timeUntilStale(this.currentResult.dataUpdatedAt, this.options.staleTime); // The timeout is sometimes triggered 1 ms before the stale time expiration.
+    // To mitigate this issue we always add 1 ms to the timeout.
+
+    var timeout = time + 1;
+    this.staleTimeoutId = setTimeout(function () {
+      if (!_this6.currentResult.isStale) {
+        _this6.updateResult();
+      }
+    }, timeout);
+  };
+
+  _proto.computeRefetchInterval = function computeRefetchInterval() {
+    var _this$options$refetch;
+
+    return typeof this.options.refetchInterval === 'function' ? this.options.refetchInterval(this.currentResult.data, this.currentQuery) : (_this$options$refetch = this.options.refetchInterval) != null ? _this$options$refetch : false;
+  };
+
+  _proto.updateRefetchInterval = function updateRefetchInterval(nextInterval) {
+    var _this7 = this;
+
+    this.clearRefetchInterval();
+    this.currentRefetchInterval = nextInterval;
+
+    if (isServer || this.options.enabled === false || !isValidTimeout(this.currentRefetchInterval) || this.currentRefetchInterval === 0) {
+      return;
+    }
+
+    this.refetchIntervalId = setInterval(function () {
+      if (_this7.options.refetchIntervalInBackground || focusManager.isFocused()) {
+        _this7.executeFetch();
+      }
+    }, this.currentRefetchInterval);
+  };
+
+  _proto.updateTimers = function updateTimers() {
+    this.updateStaleTimeout();
+    this.updateRefetchInterval(this.computeRefetchInterval());
+  };
+
+  _proto.clearTimers = function clearTimers() {
+    this.clearStaleTimeout();
+    this.clearRefetchInterval();
+  };
+
+  _proto.clearStaleTimeout = function clearStaleTimeout() {
+    if (this.staleTimeoutId) {
+      clearTimeout(this.staleTimeoutId);
+      this.staleTimeoutId = undefined;
+    }
+  };
+
+  _proto.clearRefetchInterval = function clearRefetchInterval() {
+    if (this.refetchIntervalId) {
+      clearInterval(this.refetchIntervalId);
+      this.refetchIntervalId = undefined;
+    }
+  };
+
+  _proto.createResult = function createResult(query, options) {
+    var prevQuery = this.currentQuery;
+    var prevOptions = this.options;
+    var prevResult = this.currentResult;
+    var prevResultState = this.currentResultState;
+    var prevResultOptions = this.currentResultOptions;
+    var queryChange = query !== prevQuery;
+    var queryInitialState = queryChange ? query.state : this.currentQueryInitialState;
+    var prevQueryResult = queryChange ? this.currentResult : this.previousQueryResult;
+    var state = query.state;
+    var dataUpdatedAt = state.dataUpdatedAt,
+        error = state.error,
+        errorUpdatedAt = state.errorUpdatedAt,
+        isFetching = state.isFetching,
+        status = state.status;
+    var isPreviousData = false;
+    var isPlaceholderData = false;
+    var data; // Optimistically set result in fetching state if needed
+
+    if (options.optimisticResults) {
+      var mounted = this.hasListeners();
+      var fetchOnMount = !mounted && shouldFetchOnMount(query, options);
+      var fetchOptionally = mounted && shouldFetchOptionally(query, prevQuery, options, prevOptions);
+
+      if (fetchOnMount || fetchOptionally) {
+        isFetching = true;
+
+        if (!dataUpdatedAt) {
+          status = 'loading';
+        }
+      }
+    } // Keep previous data if needed
+
+
+    if (options.keepPreviousData && !state.dataUpdateCount && (prevQueryResult == null ? void 0 : prevQueryResult.isSuccess) && status !== 'error') {
+      data = prevQueryResult.data;
+      dataUpdatedAt = prevQueryResult.dataUpdatedAt;
+      status = prevQueryResult.status;
+      isPreviousData = true;
+    } // Select data if needed
+    else if (options.select && typeof state.data !== 'undefined') {
+        // Memoize select result
+        if (prevResult && state.data === (prevResultState == null ? void 0 : prevResultState.data) && options.select === this.selectFn) {
+          data = this.selectResult;
+        } else {
+          try {
+            this.selectFn = options.select;
+            data = options.select(state.data);
+
+            if (options.structuralSharing !== false) {
+              data = replaceEqualDeep(prevResult == null ? void 0 : prevResult.data, data);
+            }
+
+            this.selectResult = data;
+            this.selectError = null;
+          } catch (selectError) {
+            getLogger().error(selectError);
+            this.selectError = selectError;
+          }
+        }
+      } // Use query data
+      else {
+          data = state.data;
+        } // Show placeholder data if needed
+
+
+    if (typeof options.placeholderData !== 'undefined' && typeof data === 'undefined' && (status === 'loading' || status === 'idle')) {
+      var placeholderData; // Memoize placeholder data
+
+      if ((prevResult == null ? void 0 : prevResult.isPlaceholderData) && options.placeholderData === (prevResultOptions == null ? void 0 : prevResultOptions.placeholderData)) {
+        placeholderData = prevResult.data;
+      } else {
+        placeholderData = typeof options.placeholderData === 'function' ? options.placeholderData() : options.placeholderData;
+
+        if (options.select && typeof placeholderData !== 'undefined') {
+          try {
+            placeholderData = options.select(placeholderData);
+
+            if (options.structuralSharing !== false) {
+              placeholderData = replaceEqualDeep(prevResult == null ? void 0 : prevResult.data, placeholderData);
+            }
+
+            this.selectError = null;
+          } catch (selectError) {
+            getLogger().error(selectError);
+            this.selectError = selectError;
+          }
+        }
+      }
+
+      if (typeof placeholderData !== 'undefined') {
+        status = 'success';
+        data = placeholderData;
+        isPlaceholderData = true;
+      }
+    }
+
+    if (this.selectError) {
+      error = this.selectError;
+      data = this.selectResult;
+      errorUpdatedAt = Date.now();
+      status = 'error';
+    }
+
+    var result = {
+      status: status,
+      isLoading: status === 'loading',
+      isSuccess: status === 'success',
+      isError: status === 'error',
+      isIdle: status === 'idle',
+      data: data,
+      dataUpdatedAt: dataUpdatedAt,
+      error: error,
+      errorUpdatedAt: errorUpdatedAt,
+      failureCount: state.fetchFailureCount,
+      errorUpdateCount: state.errorUpdateCount,
+      isFetched: state.dataUpdateCount > 0 || state.errorUpdateCount > 0,
+      isFetchedAfterMount: state.dataUpdateCount > queryInitialState.dataUpdateCount || state.errorUpdateCount > queryInitialState.errorUpdateCount,
+      isFetching: isFetching,
+      isRefetching: isFetching && status !== 'loading',
+      isLoadingError: status === 'error' && state.dataUpdatedAt === 0,
+      isPlaceholderData: isPlaceholderData,
+      isPreviousData: isPreviousData,
+      isRefetchError: status === 'error' && state.dataUpdatedAt !== 0,
+      isStale: isStale(query, options),
+      refetch: this.refetch,
+      remove: this.remove
+    };
+    return result;
+  };
+
+  _proto.shouldNotifyListeners = function shouldNotifyListeners(result, prevResult) {
+    if (!prevResult) {
+      return true;
+    }
+
+    var _this$options = this.options,
+        notifyOnChangeProps = _this$options.notifyOnChangeProps,
+        notifyOnChangePropsExclusions = _this$options.notifyOnChangePropsExclusions;
+
+    if (!notifyOnChangeProps && !notifyOnChangePropsExclusions) {
+      return true;
+    }
+
+    if (notifyOnChangeProps === 'tracked' && !this.trackedProps.length) {
+      return true;
+    }
+
+    var includedProps = notifyOnChangeProps === 'tracked' ? this.trackedProps : notifyOnChangeProps;
+    return Object.keys(result).some(function (key) {
+      var typedKey = key;
+      var changed = result[typedKey] !== prevResult[typedKey];
+      var isIncluded = includedProps == null ? void 0 : includedProps.some(function (x) {
+        return x === key;
+      });
+      var isExcluded = notifyOnChangePropsExclusions == null ? void 0 : notifyOnChangePropsExclusions.some(function (x) {
+        return x === key;
+      });
+      return changed && !isExcluded && (!includedProps || isIncluded);
+    });
+  };
+
+  _proto.updateResult = function updateResult(notifyOptions) {
+    var prevResult = this.currentResult;
+    this.currentResult = this.createResult(this.currentQuery, this.options);
+    this.currentResultState = this.currentQuery.state;
+    this.currentResultOptions = this.options; // Only notify if something has changed
+
+    if (shallowEqualObjects(this.currentResult, prevResult)) {
+      return;
+    } // Determine which callbacks to trigger
+
+
+    var defaultNotifyOptions = {
+      cache: true
+    };
+
+    if ((notifyOptions == null ? void 0 : notifyOptions.listeners) !== false && this.shouldNotifyListeners(this.currentResult, prevResult)) {
+      defaultNotifyOptions.listeners = true;
+    }
+
+    this.notify(_extends({}, defaultNotifyOptions, notifyOptions));
+  };
+
+  _proto.updateQuery = function updateQuery() {
+    var query = this.client.getQueryCache().build(this.client, this.options);
+
+    if (query === this.currentQuery) {
+      return;
+    }
+
+    var prevQuery = this.currentQuery;
+    this.currentQuery = query;
+    this.currentQueryInitialState = query.state;
+    this.previousQueryResult = this.currentResult;
+
+    if (this.hasListeners()) {
+      prevQuery == null ? void 0 : prevQuery.removeObserver(this);
+      query.addObserver(this);
+    }
+  };
+
+  _proto.onQueryUpdate = function onQueryUpdate(action) {
+    var notifyOptions = {};
+
+    if (action.type === 'success') {
+      notifyOptions.onSuccess = true;
+    } else if (action.type === 'error' && !isCancelledError(action.error)) {
+      notifyOptions.onError = true;
+    }
+
+    this.updateResult(notifyOptions);
+
+    if (this.hasListeners()) {
+      this.updateTimers();
+    }
+  };
+
+  _proto.notify = function notify(notifyOptions) {
+    var _this8 = this;
+
+    notifyManager.batch(function () {
+      // First trigger the configuration callbacks
+      if (notifyOptions.onSuccess) {
+        _this8.options.onSuccess == null ? void 0 : _this8.options.onSuccess(_this8.currentResult.data);
+        _this8.options.onSettled == null ? void 0 : _this8.options.onSettled(_this8.currentResult.data, null);
+      } else if (notifyOptions.onError) {
+        _this8.options.onError == null ? void 0 : _this8.options.onError(_this8.currentResult.error);
+        _this8.options.onSettled == null ? void 0 : _this8.options.onSettled(undefined, _this8.currentResult.error);
+      } // Then trigger the listeners
+
+
+      if (notifyOptions.listeners) {
+        _this8.listeners.forEach(function (listener) {
+          listener(_this8.currentResult);
+        });
+      } // Then the cache listeners
+
+
+      if (notifyOptions.cache) {
+        _this8.client.getQueryCache().notify({
+          query: _this8.currentQuery,
+          type: 'observerResultsUpdated'
+        });
+      }
+    });
+  };
+
+  return QueryObserver;
+}(Subscribable);
+
+function shouldLoadOnMount(query, options) {
+  return options.enabled !== false && !query.state.dataUpdatedAt && !(query.state.status === 'error' && options.retryOnMount === false);
+}
+
+function shouldFetchOnMount(query, options) {
+  return shouldLoadOnMount(query, options) || query.state.dataUpdatedAt > 0 && shouldFetchOn(query, options, options.refetchOnMount);
+}
+
+function shouldFetchOn(query, options, field) {
+  if (options.enabled !== false) {
+    var value = typeof field === 'function' ? field(query) : field;
+    return value === 'always' || value !== false && isStale(query, options);
+  }
+
+  return false;
+}
+
+function shouldFetchOptionally(query, prevQuery, options, prevOptions) {
+  return options.enabled !== false && (query !== prevQuery || prevOptions.enabled === false) && (!options.suspense || query.state.status !== 'error') && isStale(query, options);
+}
+
+function isStale(query, options) {
+  return query.isStaleByTime(options.staleTime);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/retryer.js b/ddb_main/node_modules/react-query/es/core/retryer.js
new file mode 100644
index 0000000..7427f4c
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/retryer.js
@@ -0,0 +1,157 @@
+import { focusManager } from './focusManager';
+import { onlineManager } from './onlineManager';
+import { sleep } from './utils';
+
+function defaultRetryDelay(failureCount) {
+  return Math.min(1000 * Math.pow(2, failureCount), 30000);
+}
+
+export function isCancelable(value) {
+  return typeof (value == null ? void 0 : value.cancel) === 'function';
+}
+export var CancelledError = function CancelledError(options) {
+  this.revert = options == null ? void 0 : options.revert;
+  this.silent = options == null ? void 0 : options.silent;
+};
+export function isCancelledError(value) {
+  return value instanceof CancelledError;
+} // CLASS
+
+export var Retryer = function Retryer(config) {
+  var _this = this;
+
+  var cancelRetry = false;
+  var cancelFn;
+  var continueFn;
+  var promiseResolve;
+  var promiseReject;
+  this.abort = config.abort;
+
+  this.cancel = function (cancelOptions) {
+    return cancelFn == null ? void 0 : cancelFn(cancelOptions);
+  };
+
+  this.cancelRetry = function () {
+    cancelRetry = true;
+  };
+
+  this.continueRetry = function () {
+    cancelRetry = false;
+  };
+
+  this.continue = function () {
+    return continueFn == null ? void 0 : continueFn();
+  };
+
+  this.failureCount = 0;
+  this.isPaused = false;
+  this.isResolved = false;
+  this.isTransportCancelable = false;
+  this.promise = new Promise(function (outerResolve, outerReject) {
+    promiseResolve = outerResolve;
+    promiseReject = outerReject;
+  });
+
+  var resolve = function resolve(value) {
+    if (!_this.isResolved) {
+      _this.isResolved = true;
+      config.onSuccess == null ? void 0 : config.onSuccess(value);
+      continueFn == null ? void 0 : continueFn();
+      promiseResolve(value);
+    }
+  };
+
+  var reject = function reject(value) {
+    if (!_this.isResolved) {
+      _this.isResolved = true;
+      config.onError == null ? void 0 : config.onError(value);
+      continueFn == null ? void 0 : continueFn();
+      promiseReject(value);
+    }
+  };
+
+  var pause = function pause() {
+    return new Promise(function (continueResolve) {
+      continueFn = continueResolve;
+      _this.isPaused = true;
+      config.onPause == null ? void 0 : config.onPause();
+    }).then(function () {
+      continueFn = undefined;
+      _this.isPaused = false;
+      config.onContinue == null ? void 0 : config.onContinue();
+    });
+  }; // Create loop function
+
+
+  var run = function run() {
+    // Do nothing if already resolved
+    if (_this.isResolved) {
+      return;
+    }
+
+    var promiseOrValue; // Execute query
+
+    try {
+      promiseOrValue = config.fn();
+    } catch (error) {
+      promiseOrValue = Promise.reject(error);
+    } // Create callback to cancel this fetch
+
+
+    cancelFn = function cancelFn(cancelOptions) {
+      if (!_this.isResolved) {
+        reject(new CancelledError(cancelOptions));
+        _this.abort == null ? void 0 : _this.abort(); // Cancel transport if supported
+
+        if (isCancelable(promiseOrValue)) {
+          try {
+            promiseOrValue.cancel();
+          } catch (_unused) {}
+        }
+      }
+    }; // Check if the transport layer support cancellation
+
+
+    _this.isTransportCancelable = isCancelable(promiseOrValue);
+    Promise.resolve(promiseOrValue).then(resolve).catch(function (error) {
+      var _config$retry, _config$retryDelay;
+
+      // Stop if the fetch is already resolved
+      if (_this.isResolved) {
+        return;
+      } // Do we need to retry the request?
+
+
+      var retry = (_config$retry = config.retry) != null ? _config$retry : 3;
+      var retryDelay = (_config$retryDelay = config.retryDelay) != null ? _config$retryDelay : defaultRetryDelay;
+      var delay = typeof retryDelay === 'function' ? retryDelay(_this.failureCount, error) : retryDelay;
+      var shouldRetry = retry === true || typeof retry === 'number' && _this.failureCount < retry || typeof retry === 'function' && retry(_this.failureCount, error);
+
+      if (cancelRetry || !shouldRetry) {
+        // We are done if the query does not need to be retried
+        reject(error);
+        return;
+      }
+
+      _this.failureCount++; // Notify on fail
+
+      config.onFail == null ? void 0 : config.onFail(_this.failureCount, error); // Delay
+
+      sleep(delay) // Pause if the document is not visible or when the device is offline
+      .then(function () {
+        if (!focusManager.isFocused() || !onlineManager.isOnline()) {
+          return pause();
+        }
+      }).then(function () {
+        if (cancelRetry) {
+          reject(error);
+        } else {
+          run();
+        }
+      });
+    });
+  }; // Start loop
+
+
+  run();
+};
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/subscribable.js b/ddb_main/node_modules/react-query/es/core/subscribable.js
new file mode 100644
index 0000000..89fce61
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/subscribable.js
@@ -0,0 +1,37 @@
+export var Subscribable = /*#__PURE__*/function () {
+  function Subscribable() {
+    this.listeners = [];
+  }
+
+  var _proto = Subscribable.prototype;
+
+  _proto.subscribe = function subscribe(listener) {
+    var _this = this;
+
+    var callback = listener || function () {
+      return undefined;
+    };
+
+    this.listeners.push(callback);
+    this.onSubscribe();
+    return function () {
+      _this.listeners = _this.listeners.filter(function (x) {
+        return x !== callback;
+      });
+
+      _this.onUnsubscribe();
+    };
+  };
+
+  _proto.hasListeners = function hasListeners() {
+    return this.listeners.length > 0;
+  };
+
+  _proto.onSubscribe = function onSubscribe() {// Do nothing
+  };
+
+  _proto.onUnsubscribe = function onUnsubscribe() {// Do nothing
+  };
+
+  return Subscribable;
+}();
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/core/utils.js b/ddb_main/node_modules/react-query/es/core/utils.js
new file mode 100644
index 0000000..c7cc45a
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/core/utils.js
@@ -0,0 +1,332 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+// TYPES
+// UTILS
+export var isServer = typeof window === 'undefined';
+export function noop() {
+  return undefined;
+}
+export function functionalUpdate(updater, input) {
+  return typeof updater === 'function' ? updater(input) : updater;
+}
+export function isValidTimeout(value) {
+  return typeof value === 'number' && value >= 0 && value !== Infinity;
+}
+export function ensureQueryKeyArray(value) {
+  return Array.isArray(value) ? value : [value];
+}
+export function difference(array1, array2) {
+  return array1.filter(function (x) {
+    return array2.indexOf(x) === -1;
+  });
+}
+export function replaceAt(array, index, value) {
+  var copy = array.slice(0);
+  copy[index] = value;
+  return copy;
+}
+export function timeUntilStale(updatedAt, staleTime) {
+  return Math.max(updatedAt + (staleTime || 0) - Date.now(), 0);
+}
+export function parseQueryArgs(arg1, arg2, arg3) {
+  if (!isQueryKey(arg1)) {
+    return arg1;
+  }
+
+  if (typeof arg2 === 'function') {
+    return _extends({}, arg3, {
+      queryKey: arg1,
+      queryFn: arg2
+    });
+  }
+
+  return _extends({}, arg2, {
+    queryKey: arg1
+  });
+}
+export function parseMutationArgs(arg1, arg2, arg3) {
+  if (isQueryKey(arg1)) {
+    if (typeof arg2 === 'function') {
+      return _extends({}, arg3, {
+        mutationKey: arg1,
+        mutationFn: arg2
+      });
+    }
+
+    return _extends({}, arg2, {
+      mutationKey: arg1
+    });
+  }
+
+  if (typeof arg1 === 'function') {
+    return _extends({}, arg2, {
+      mutationFn: arg1
+    });
+  }
+
+  return _extends({}, arg1);
+}
+export function parseFilterArgs(arg1, arg2, arg3) {
+  return isQueryKey(arg1) ? [_extends({}, arg2, {
+    queryKey: arg1
+  }), arg3] : [arg1 || {}, arg2];
+}
+export function parseMutationFilterArgs(arg1, arg2) {
+  return isQueryKey(arg1) ? _extends({}, arg2, {
+    mutationKey: arg1
+  }) : arg1;
+}
+export function mapQueryStatusFilter(active, inactive) {
+  if (active === true && inactive === true || active == null && inactive == null) {
+    return 'all';
+  } else if (active === false && inactive === false) {
+    return 'none';
+  } else {
+    // At this point, active|inactive can only be true|false or false|true
+    // so, when only one value is provided, the missing one has to be the negated value
+    var isActive = active != null ? active : !inactive;
+    return isActive ? 'active' : 'inactive';
+  }
+}
+export function matchQuery(filters, query) {
+  var active = filters.active,
+      exact = filters.exact,
+      fetching = filters.fetching,
+      inactive = filters.inactive,
+      predicate = filters.predicate,
+      queryKey = filters.queryKey,
+      stale = filters.stale;
+
+  if (isQueryKey(queryKey)) {
+    if (exact) {
+      if (query.queryHash !== hashQueryKeyByOptions(queryKey, query.options)) {
+        return false;
+      }
+    } else if (!partialMatchKey(query.queryKey, queryKey)) {
+      return false;
+    }
+  }
+
+  var queryStatusFilter = mapQueryStatusFilter(active, inactive);
+
+  if (queryStatusFilter === 'none') {
+    return false;
+  } else if (queryStatusFilter !== 'all') {
+    var isActive = query.isActive();
+
+    if (queryStatusFilter === 'active' && !isActive) {
+      return false;
+    }
+
+    if (queryStatusFilter === 'inactive' && isActive) {
+      return false;
+    }
+  }
+
+  if (typeof stale === 'boolean' && query.isStale() !== stale) {
+    return false;
+  }
+
+  if (typeof fetching === 'boolean' && query.isFetching() !== fetching) {
+    return false;
+  }
+
+  if (predicate && !predicate(query)) {
+    return false;
+  }
+
+  return true;
+}
+export function matchMutation(filters, mutation) {
+  var exact = filters.exact,
+      fetching = filters.fetching,
+      predicate = filters.predicate,
+      mutationKey = filters.mutationKey;
+
+  if (isQueryKey(mutationKey)) {
+    if (!mutation.options.mutationKey) {
+      return false;
+    }
+
+    if (exact) {
+      if (hashQueryKey(mutation.options.mutationKey) !== hashQueryKey(mutationKey)) {
+        return false;
+      }
+    } else if (!partialMatchKey(mutation.options.mutationKey, mutationKey)) {
+      return false;
+    }
+  }
+
+  if (typeof fetching === 'boolean' && mutation.state.status === 'loading' !== fetching) {
+    return false;
+  }
+
+  if (predicate && !predicate(mutation)) {
+    return false;
+  }
+
+  return true;
+}
+export function hashQueryKeyByOptions(queryKey, options) {
+  var hashFn = (options == null ? void 0 : options.queryKeyHashFn) || hashQueryKey;
+  return hashFn(queryKey);
+}
+/**
+ * Default query keys hash function.
+ */
+
+export function hashQueryKey(queryKey) {
+  var asArray = ensureQueryKeyArray(queryKey);
+  return stableValueHash(asArray);
+}
+/**
+ * Hashes the value into a stable hash.
+ */
+
+export function stableValueHash(value) {
+  return JSON.stringify(value, function (_, val) {
+    return isPlainObject(val) ? Object.keys(val).sort().reduce(function (result, key) {
+      result[key] = val[key];
+      return result;
+    }, {}) : val;
+  });
+}
+/**
+ * Checks if key `b` partially matches with key `a`.
+ */
+
+export function partialMatchKey(a, b) {
+  return partialDeepEqual(ensureQueryKeyArray(a), ensureQueryKeyArray(b));
+}
+/**
+ * Checks if `b` partially matches with `a`.
+ */
+
+export function partialDeepEqual(a, b) {
+  if (a === b) {
+    return true;
+  }
+
+  if (typeof a !== typeof b) {
+    return false;
+  }
+
+  if (a && b && typeof a === 'object' && typeof b === 'object') {
+    return !Object.keys(b).some(function (key) {
+      return !partialDeepEqual(a[key], b[key]);
+    });
+  }
+
+  return false;
+}
+/**
+ * This function returns `a` if `b` is deeply equal.
+ * If not, it will replace any deeply equal children of `b` with those of `a`.
+ * This can be used for structural sharing between JSON values for example.
+ */
+
+export function replaceEqualDeep(a, b) {
+  if (a === b) {
+    return a;
+  }
+
+  var array = Array.isArray(a) && Array.isArray(b);
+
+  if (array || isPlainObject(a) && isPlainObject(b)) {
+    var aSize = array ? a.length : Object.keys(a).length;
+    var bItems = array ? b : Object.keys(b);
+    var bSize = bItems.length;
+    var copy = array ? [] : {};
+    var equalItems = 0;
+
+    for (var i = 0; i < bSize; i++) {
+      var key = array ? i : bItems[i];
+      copy[key] = replaceEqualDeep(a[key], b[key]);
+
+      if (copy[key] === a[key]) {
+        equalItems++;
+      }
+    }
+
+    return aSize === bSize && equalItems === aSize ? a : copy;
+  }
+
+  return b;
+}
+/**
+ * Shallow compare objects. Only works with objects that always have the same properties.
+ */
+
+export function shallowEqualObjects(a, b) {
+  if (a && !b || b && !a) {
+    return false;
+  }
+
+  for (var key in a) {
+    if (a[key] !== b[key]) {
+      return false;
+    }
+  }
+
+  return true;
+} // Copied from: https://github.com/jonschlinkert/is-plain-object
+
+export function isPlainObject(o) {
+  if (!hasObjectPrototype(o)) {
+    return false;
+  } // If has modified constructor
+
+
+  var ctor = o.constructor;
+
+  if (typeof ctor === 'undefined') {
+    return true;
+  } // If has modified prototype
+
+
+  var prot = ctor.prototype;
+
+  if (!hasObjectPrototype(prot)) {
+    return false;
+  } // If constructor does not have an Object-specific method
+
+
+  if (!prot.hasOwnProperty('isPrototypeOf')) {
+    return false;
+  } // Most likely a plain Object
+
+
+  return true;
+}
+
+function hasObjectPrototype(o) {
+  return Object.prototype.toString.call(o) === '[object Object]';
+}
+
+export function isQueryKey(value) {
+  return typeof value === 'string' || Array.isArray(value);
+}
+export function isError(value) {
+  return value instanceof Error;
+}
+export function sleep(timeout) {
+  return new Promise(function (resolve) {
+    setTimeout(resolve, timeout);
+  });
+}
+/**
+ * Schedules a microtask.
+ * This can be useful to schedule state updates after rendering.
+ */
+
+export function scheduleMicrotask(callback) {
+  Promise.resolve().then(callback).catch(function (error) {
+    return setTimeout(function () {
+      throw error;
+    });
+  });
+}
+export function getAbortController() {
+  if (typeof AbortController === 'function') {
+    return new AbortController();
+  }
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/react/QueryClientProvider.js b/ddb_main/node_modules/react-query/es/react/QueryClientProvider.js
new file mode 100644
index 0000000..933aa47
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/react/QueryClientProvider.js
@@ -0,0 +1,48 @@
+import React from 'react';
+var defaultContext = /*#__PURE__*/React.createContext(undefined);
+var QueryClientSharingContext = /*#__PURE__*/React.createContext(false); // if contextSharing is on, we share the first and at least one
+// instance of the context across the window
+// to ensure that if React Query is used across
+// different bundles or microfrontends they will
+// all use the same **instance** of context, regardless
+// of module scoping.
+
+function getQueryClientContext(contextSharing) {
+  if (contextSharing && typeof window !== 'undefined') {
+    if (!window.ReactQueryClientContext) {
+      window.ReactQueryClientContext = defaultContext;
+    }
+
+    return window.ReactQueryClientContext;
+  }
+
+  return defaultContext;
+}
+
+export var useQueryClient = function useQueryClient() {
+  var queryClient = React.useContext(getQueryClientContext(React.useContext(QueryClientSharingContext)));
+
+  if (!queryClient) {
+    throw new Error('No QueryClient set, use QueryClientProvider to set one');
+  }
+
+  return queryClient;
+};
+export var QueryClientProvider = function QueryClientProvider(_ref) {
+  var client = _ref.client,
+      _ref$contextSharing = _ref.contextSharing,
+      contextSharing = _ref$contextSharing === void 0 ? false : _ref$contextSharing,
+      children = _ref.children;
+  React.useEffect(function () {
+    client.mount();
+    return function () {
+      client.unmount();
+    };
+  }, [client]);
+  var Context = getQueryClientContext(contextSharing);
+  return /*#__PURE__*/React.createElement(QueryClientSharingContext.Provider, {
+    value: contextSharing
+  }, /*#__PURE__*/React.createElement(Context.Provider, {
+    value: client
+  }, children));
+};
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/react/QueryErrorResetBoundary.js b/ddb_main/node_modules/react-query/es/react/QueryErrorResetBoundary.js
new file mode 100644
index 0000000..5440d66
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/react/QueryErrorResetBoundary.js
@@ -0,0 +1,32 @@
+import React from 'react'; // CONTEXT
+
+function createValue() {
+  var _isReset = false;
+  return {
+    clearReset: function clearReset() {
+      _isReset = false;
+    },
+    reset: function reset() {
+      _isReset = true;
+    },
+    isReset: function isReset() {
+      return _isReset;
+    }
+  };
+}
+
+var QueryErrorResetBoundaryContext = /*#__PURE__*/React.createContext(createValue()); // HOOK
+
+export var useQueryErrorResetBoundary = function useQueryErrorResetBoundary() {
+  return React.useContext(QueryErrorResetBoundaryContext);
+}; // COMPONENT
+
+export var QueryErrorResetBoundary = function QueryErrorResetBoundary(_ref) {
+  var children = _ref.children;
+  var value = React.useMemo(function () {
+    return createValue();
+  }, []);
+  return /*#__PURE__*/React.createElement(QueryErrorResetBoundaryContext.Provider, {
+    value: value
+  }, typeof children === 'function' ? children(value) : children);
+};
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/react/logger.js b/ddb_main/node_modules/react-query/es/react/logger.js
new file mode 100644
index 0000000..eab6dbc
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/react/logger.js
@@ -0,0 +1 @@
+export var logger = console;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/react/reactBatchedUpdates.js b/ddb_main/node_modules/react-query/es/react/reactBatchedUpdates.js
new file mode 100644
index 0000000..10e6aed
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/react/reactBatchedUpdates.js
@@ -0,0 +1,2 @@
+import ReactDOM from 'react-dom';
+export var unstable_batchedUpdates = ReactDOM.unstable_batchedUpdates;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/react/setBatchUpdatesFn.js b/ddb_main/node_modules/react-query/es/react/setBatchUpdatesFn.js
new file mode 100644
index 0000000..76b70ed
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/react/setBatchUpdatesFn.js
@@ -0,0 +1,3 @@
+import { notifyManager } from '../core';
+import { unstable_batchedUpdates } from './reactBatchedUpdates';
+notifyManager.setBatchNotifyFunction(unstable_batchedUpdates);
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/react/setLogger.js b/ddb_main/node_modules/react-query/es/react/setLogger.js
new file mode 100644
index 0000000..03f101e
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/react/setLogger.js
@@ -0,0 +1,3 @@
+import { setLogger } from '../core';
+import { logger } from './logger';
+setLogger(logger);
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/react/useBaseQuery.js b/ddb_main/node_modules/react-query/es/react/useBaseQuery.js
new file mode 100644
index 0000000..6dc4731
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/react/useBaseQuery.js
@@ -0,0 +1,106 @@
+import React from 'react';
+import { notifyManager } from '../core/notifyManager';
+import { useQueryErrorResetBoundary } from './QueryErrorResetBoundary';
+import { useQueryClient } from './QueryClientProvider';
+import { shouldThrowError } from './utils';
+export function useBaseQuery(options, Observer) {
+  var mountedRef = React.useRef(false);
+
+  var _React$useState = React.useState(0),
+      forceUpdate = _React$useState[1];
+
+  var queryClient = useQueryClient();
+  var errorResetBoundary = useQueryErrorResetBoundary();
+  var defaultedOptions = queryClient.defaultQueryObserverOptions(options); // Make sure results are optimistically set in fetching state before subscribing or updating options
+
+  defaultedOptions.optimisticResults = true; // Include callbacks in batch renders
+
+  if (defaultedOptions.onError) {
+    defaultedOptions.onError = notifyManager.batchCalls(defaultedOptions.onError);
+  }
+
+  if (defaultedOptions.onSuccess) {
+    defaultedOptions.onSuccess = notifyManager.batchCalls(defaultedOptions.onSuccess);
+  }
+
+  if (defaultedOptions.onSettled) {
+    defaultedOptions.onSettled = notifyManager.batchCalls(defaultedOptions.onSettled);
+  }
+
+  if (defaultedOptions.suspense) {
+    // Always set stale time when using suspense to prevent
+    // fetching again when directly mounting after suspending
+    if (typeof defaultedOptions.staleTime !== 'number') {
+      defaultedOptions.staleTime = 1000;
+    } // Set cache time to 1 if the option has been set to 0
+    // when using suspense to prevent infinite loop of fetches
+
+
+    if (defaultedOptions.cacheTime === 0) {
+      defaultedOptions.cacheTime = 1;
+    }
+  }
+
+  if (defaultedOptions.suspense || defaultedOptions.useErrorBoundary) {
+    // Prevent retrying failed query if the error boundary has not been reset yet
+    if (!errorResetBoundary.isReset()) {
+      defaultedOptions.retryOnMount = false;
+    }
+  }
+
+  var _React$useState2 = React.useState(function () {
+    return new Observer(queryClient, defaultedOptions);
+  }),
+      observer = _React$useState2[0];
+
+  var result = observer.getOptimisticResult(defaultedOptions);
+  React.useEffect(function () {
+    mountedRef.current = true;
+    errorResetBoundary.clearReset();
+    var unsubscribe = observer.subscribe(notifyManager.batchCalls(function () {
+      if (mountedRef.current) {
+        forceUpdate(function (x) {
+          return x + 1;
+        });
+      }
+    })); // Update result to make sure we did not miss any query updates
+    // between creating the observer and subscribing to it.
+
+    observer.updateResult();
+    return function () {
+      mountedRef.current = false;
+      unsubscribe();
+    };
+  }, [errorResetBoundary, observer]);
+  React.useEffect(function () {
+    // Do not notify on updates because of changes in the options because
+    // these changes should already be reflected in the optimistic result.
+    observer.setOptions(defaultedOptions, {
+      listeners: false
+    });
+  }, [defaultedOptions, observer]); // Handle suspense
+
+  if (defaultedOptions.suspense && result.isLoading) {
+    throw observer.fetchOptimistic(defaultedOptions).then(function (_ref) {
+      var data = _ref.data;
+      defaultedOptions.onSuccess == null ? void 0 : defaultedOptions.onSuccess(data);
+      defaultedOptions.onSettled == null ? void 0 : defaultedOptions.onSettled(data, null);
+    }).catch(function (error) {
+      errorResetBoundary.clearReset();
+      defaultedOptions.onError == null ? void 0 : defaultedOptions.onError(error);
+      defaultedOptions.onSettled == null ? void 0 : defaultedOptions.onSettled(undefined, error);
+    });
+  } // Handle error boundary
+
+
+  if (result.isError && !errorResetBoundary.isReset() && !result.isFetching && shouldThrowError(defaultedOptions.suspense, defaultedOptions.useErrorBoundary, [result.error, observer.getCurrentQuery()])) {
+    throw result.error;
+  } // Handle result property usage tracking
+
+
+  if (defaultedOptions.notifyOnChangeProps === 'tracked') {
+    result = observer.trackResult(result, defaultedOptions);
+  }
+
+  return result;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/react/useQuery.js b/ddb_main/node_modules/react-query/es/react/useQuery.js
new file mode 100644
index 0000000..07affcf
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/react/useQuery.js
@@ -0,0 +1,8 @@
+import { QueryObserver } from '../core';
+import { parseQueryArgs } from '../core/utils';
+import { useBaseQuery } from './useBaseQuery'; // HOOK
+
+export function useQuery(arg1, arg2, arg3) {
+  var parsedOptions = parseQueryArgs(arg1, arg2, arg3);
+  return useBaseQuery(parsedOptions, QueryObserver);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-query/es/react/utils.js b/ddb_main/node_modules/react-query/es/react/utils.js
new file mode 100644
index 0000000..f8148db
--- /dev/null
+++ b/ddb_main/node_modules/react-query/es/react/utils.js
@@ -0,0 +1,11 @@
+export function shouldThrowError(suspense, _useErrorBoundary, params) {
+  // Allow useErrorBoundary function to override throwing behavior on a per-error basis
+  if (typeof _useErrorBoundary === 'function') {
+    return _useErrorBoundary.apply(void 0, params);
+  } // Allow useErrorBoundary to override suspense's throwing behavior
+
+
+  if (typeof _useErrorBoundary === 'boolean') return _useErrorBoundary; // If suspense is enabled default to throwing errors
+
+  return !!suspense;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/components/Context.js b/ddb_main/node_modules/react-redux/es/components/Context.js
new file mode 100644
index 0000000..020a903
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/components/Context.js
@@ -0,0 +1,8 @@
+import React from 'react';
+export var ReactReduxContext = /*#__PURE__*/React.createContext(null);
+
+if (process.env.NODE_ENV !== 'production') {
+  ReactReduxContext.displayName = 'ReactRedux';
+}
+
+export default ReactReduxContext;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/components/Provider.js b/ddb_main/node_modules/react-redux/es/components/Provider.js
new file mode 100644
index 0000000..4fa3785
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/components/Provider.js
@@ -0,0 +1,53 @@
+import React, { useMemo } from 'react';
+import PropTypes from 'prop-types';
+import { ReactReduxContext } from './Context';
+import { createSubscription } from '../utils/Subscription';
+import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect';
+
+function Provider(_ref) {
+  var store = _ref.store,
+      context = _ref.context,
+      children = _ref.children;
+  var contextValue = useMemo(function () {
+    var subscription = createSubscription(store);
+    return {
+      store: store,
+      subscription: subscription
+    };
+  }, [store]);
+  var previousState = useMemo(function () {
+    return store.getState();
+  }, [store]);
+  useIsomorphicLayoutEffect(function () {
+    var subscription = contextValue.subscription;
+    subscription.onStateChange = subscription.notifyNestedSubs;
+    subscription.trySubscribe();
+
+    if (previousState !== store.getState()) {
+      subscription.notifyNestedSubs();
+    }
+
+    return function () {
+      subscription.tryUnsubscribe();
+      subscription.onStateChange = null;
+    };
+  }, [contextValue, previousState]);
+  var Context = context || ReactReduxContext;
+  return /*#__PURE__*/React.createElement(Context.Provider, {
+    value: contextValue
+  }, children);
+}
+
+if (process.env.NODE_ENV !== 'production') {
+  Provider.propTypes = {
+    store: PropTypes.shape({
+      subscribe: PropTypes.func.isRequired,
+      dispatch: PropTypes.func.isRequired,
+      getState: PropTypes.func.isRequired
+    }),
+    context: PropTypes.object,
+    children: PropTypes.any
+  };
+}
+
+export default Provider;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/components/connectAdvanced.js b/ddb_main/node_modules/react-redux/es/components/connectAdvanced.js
new file mode 100644
index 0000000..53dc8b6
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/components/connectAdvanced.js
@@ -0,0 +1,377 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _excluded = ["getDisplayName", "methodName", "renderCountProp", "shouldHandleStateChanges", "storeKey", "withRef", "forwardRef", "context"],
+    _excluded2 = ["reactReduxForwardedRef"];
+import hoistStatics from 'hoist-non-react-statics';
+import React, { useContext, useMemo, useRef, useReducer } from 'react';
+import { isValidElementType, isContextConsumer } from 'react-is';
+import { createSubscription } from '../utils/Subscription';
+import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect';
+import { ReactReduxContext } from './Context'; // Define some constant arrays just to avoid re-creating these
+
+var EMPTY_ARRAY = [];
+var NO_SUBSCRIPTION_ARRAY = [null, null];
+
+var stringifyComponent = function stringifyComponent(Comp) {
+  try {
+    return JSON.stringify(Comp);
+  } catch (err) {
+    return String(Comp);
+  }
+};
+
+function storeStateUpdatesReducer(state, action) {
+  var updateCount = state[1];
+  return [action.payload, updateCount + 1];
+}
+
+function useIsomorphicLayoutEffectWithArgs(effectFunc, effectArgs, dependencies) {
+  useIsomorphicLayoutEffect(function () {
+    return effectFunc.apply(void 0, effectArgs);
+  }, dependencies);
+}
+
+function captureWrapperProps(lastWrapperProps, lastChildProps, renderIsScheduled, wrapperProps, actualChildProps, childPropsFromStoreUpdate, notifyNestedSubs) {
+  // We want to capture the wrapper props and child props we used for later comparisons
+  lastWrapperProps.current = wrapperProps;
+  lastChildProps.current = actualChildProps;
+  renderIsScheduled.current = false; // If the render was from a store update, clear out that reference and cascade the subscriber update
+
+  if (childPropsFromStoreUpdate.current) {
+    childPropsFromStoreUpdate.current = null;
+    notifyNestedSubs();
+  }
+}
+
+function subscribeUpdates(shouldHandleStateChanges, store, subscription, childPropsSelector, lastWrapperProps, lastChildProps, renderIsScheduled, childPropsFromStoreUpdate, notifyNestedSubs, forceComponentUpdateDispatch) {
+  // If we're not subscribed to the store, nothing to do here
+  if (!shouldHandleStateChanges) return; // Capture values for checking if and when this component unmounts
+
+  var didUnsubscribe = false;
+  var lastThrownError = null; // We'll run this callback every time a store subscription update propagates to this component
+
+  var checkForUpdates = function checkForUpdates() {
+    if (didUnsubscribe) {
+      // Don't run stale listeners.
+      // Redux doesn't guarantee unsubscriptions happen until next dispatch.
+      return;
+    }
+
+    var latestStoreState = store.getState();
+    var newChildProps, error;
+
+    try {
+      // Actually run the selector with the most recent store state and wrapper props
+      // to determine what the child props should be
+      newChildProps = childPropsSelector(latestStoreState, lastWrapperProps.current);
+    } catch (e) {
+      error = e;
+      lastThrownError = e;
+    }
+
+    if (!error) {
+      lastThrownError = null;
+    } // If the child props haven't changed, nothing to do here - cascade the subscription update
+
+
+    if (newChildProps === lastChildProps.current) {
+      if (!renderIsScheduled.current) {
+        notifyNestedSubs();
+      }
+    } else {
+      // Save references to the new child props.  Note that we track the "child props from store update"
+      // as a ref instead of a useState/useReducer because we need a way to determine if that value has
+      // been processed.  If this went into useState/useReducer, we couldn't clear out the value without
+      // forcing another re-render, which we don't want.
+      lastChildProps.current = newChildProps;
+      childPropsFromStoreUpdate.current = newChildProps;
+      renderIsScheduled.current = true; // If the child props _did_ change (or we caught an error), this wrapper component needs to re-render
+
+      forceComponentUpdateDispatch({
+        type: 'STORE_UPDATED',
+        payload: {
+          error: error
+        }
+      });
+    }
+  }; // Actually subscribe to the nearest connected ancestor (or store)
+
+
+  subscription.onStateChange = checkForUpdates;
+  subscription.trySubscribe(); // Pull data from the store after first render in case the store has
+  // changed since we began.
+
+  checkForUpdates();
+
+  var unsubscribeWrapper = function unsubscribeWrapper() {
+    didUnsubscribe = true;
+    subscription.tryUnsubscribe();
+    subscription.onStateChange = null;
+
+    if (lastThrownError) {
+      // It's possible that we caught an error due to a bad mapState function, but the
+      // parent re-rendered without this component and we're about to unmount.
+      // This shouldn't happen as long as we do top-down subscriptions correctly, but
+      // if we ever do those wrong, this throw will surface the error in our tests.
+      // In that case, throw the error from here so it doesn't get lost.
+      throw lastThrownError;
+    }
+  };
+
+  return unsubscribeWrapper;
+}
+
+var initStateUpdates = function initStateUpdates() {
+  return [null, 0];
+};
+
+export default function connectAdvanced(
+/*
+  selectorFactory is a func that is responsible for returning the selector function used to
+  compute new props from state, props, and dispatch. For example:
+      export default connectAdvanced((dispatch, options) => (state, props) => ({
+      thing: state.things[props.thingId],
+      saveThing: fields => dispatch(actionCreators.saveThing(props.thingId, fields)),
+    }))(YourComponent)
+    Access to dispatch is provided to the factory so selectorFactories can bind actionCreators
+  outside of their selector as an optimization. Options passed to connectAdvanced are passed to
+  the selectorFactory, along with displayName and WrappedComponent, as the second argument.
+    Note that selectorFactory is responsible for all caching/memoization of inbound and outbound
+  props. Do not use connectAdvanced directly without memoizing results between calls to your
+  selector, otherwise the Connect component will re-render on every state or props change.
+*/
+selectorFactory, // options object:
+_ref) {
+  if (_ref === void 0) {
+    _ref = {};
+  }
+
+  var _ref2 = _ref,
+      _ref2$getDisplayName = _ref2.getDisplayName,
+      getDisplayName = _ref2$getDisplayName === void 0 ? function (name) {
+    return "ConnectAdvanced(" + name + ")";
+  } : _ref2$getDisplayName,
+      _ref2$methodName = _ref2.methodName,
+      methodName = _ref2$methodName === void 0 ? 'connectAdvanced' : _ref2$methodName,
+      _ref2$renderCountProp = _ref2.renderCountProp,
+      renderCountProp = _ref2$renderCountProp === void 0 ? undefined : _ref2$renderCountProp,
+      _ref2$shouldHandleSta = _ref2.shouldHandleStateChanges,
+      shouldHandleStateChanges = _ref2$shouldHandleSta === void 0 ? true : _ref2$shouldHandleSta,
+      _ref2$storeKey = _ref2.storeKey,
+      storeKey = _ref2$storeKey === void 0 ? 'store' : _ref2$storeKey,
+      _ref2$withRef = _ref2.withRef,
+      withRef = _ref2$withRef === void 0 ? false : _ref2$withRef,
+      _ref2$forwardRef = _ref2.forwardRef,
+      forwardRef = _ref2$forwardRef === void 0 ? false : _ref2$forwardRef,
+      _ref2$context = _ref2.context,
+      context = _ref2$context === void 0 ? ReactReduxContext : _ref2$context,
+      connectOptions = _objectWithoutPropertiesLoose(_ref2, _excluded);
+
+  if (process.env.NODE_ENV !== 'production') {
+    if (renderCountProp !== undefined) {
+      throw new Error("renderCountProp is removed. render counting is built into the latest React Dev Tools profiling extension");
+    }
+
+    if (withRef) {
+      throw new Error('withRef is removed. To access the wrapped instance, use a ref on the connected component');
+    }
+
+    var customStoreWarningMessage = 'To use a custom Redux store for specific components, create a custom React context with ' + "React.createContext(), and pass the context object to React Redux's Provider and specific components" + ' like: <Provider context={MyContext}><ConnectedComponent context={MyContext} /></Provider>. ' + 'You may also pass a {context : MyContext} option to connect';
+
+    if (storeKey !== 'store') {
+      throw new Error('storeKey has been removed and does not do anything. ' + customStoreWarningMessage);
+    }
+  }
+
+  var Context = context;
+  return function wrapWithConnect(WrappedComponent) {
+    if (process.env.NODE_ENV !== 'production' && !isValidElementType(WrappedComponent)) {
+      throw new Error("You must pass a component to the function returned by " + (methodName + ". Instead received " + stringifyComponent(WrappedComponent)));
+    }
+
+    var wrappedComponentName = WrappedComponent.displayName || WrappedComponent.name || 'Component';
+    var displayName = getDisplayName(wrappedComponentName);
+
+    var selectorFactoryOptions = _extends({}, connectOptions, {
+      getDisplayName: getDisplayName,
+      methodName: methodName,
+      renderCountProp: renderCountProp,
+      shouldHandleStateChanges: shouldHandleStateChanges,
+      storeKey: storeKey,
+      displayName: displayName,
+      wrappedComponentName: wrappedComponentName,
+      WrappedComponent: WrappedComponent
+    });
+
+    var pure = connectOptions.pure;
+
+    function createChildSelector(store) {
+      return selectorFactory(store.dispatch, selectorFactoryOptions);
+    } // If we aren't running in "pure" mode, we don't want to memoize values.
+    // To avoid conditionally calling hooks, we fall back to a tiny wrapper
+    // that just executes the given callback immediately.
+
+
+    var usePureOnlyMemo = pure ? useMemo : function (callback) {
+      return callback();
+    };
+
+    function ConnectFunction(props) {
+      var _useMemo = useMemo(function () {
+        // Distinguish between actual "data" props that were passed to the wrapper component,
+        // and values needed to control behavior (forwarded refs, alternate context instances).
+        // To maintain the wrapperProps object reference, memoize this destructuring.
+        var reactReduxForwardedRef = props.reactReduxForwardedRef,
+            wrapperProps = _objectWithoutPropertiesLoose(props, _excluded2);
+
+        return [props.context, reactReduxForwardedRef, wrapperProps];
+      }, [props]),
+          propsContext = _useMemo[0],
+          reactReduxForwardedRef = _useMemo[1],
+          wrapperProps = _useMemo[2];
+
+      var ContextToUse = useMemo(function () {
+        // Users may optionally pass in a custom context instance to use instead of our ReactReduxContext.
+        // Memoize the check that determines which context instance we should use.
+        return propsContext && propsContext.Consumer && isContextConsumer( /*#__PURE__*/React.createElement(propsContext.Consumer, null)) ? propsContext : Context;
+      }, [propsContext, Context]); // Retrieve the store and ancestor subscription via context, if available
+
+      var contextValue = useContext(ContextToUse); // The store _must_ exist as either a prop or in context.
+      // We'll check to see if it _looks_ like a Redux store first.
+      // This allows us to pass through a `store` prop that is just a plain value.
+
+      var didStoreComeFromProps = Boolean(props.store) && Boolean(props.store.getState) && Boolean(props.store.dispatch);
+      var didStoreComeFromContext = Boolean(contextValue) && Boolean(contextValue.store);
+
+      if (process.env.NODE_ENV !== 'production' && !didStoreComeFromProps && !didStoreComeFromContext) {
+        throw new Error("Could not find \"store\" in the context of " + ("\"" + displayName + "\". Either wrap the root component in a <Provider>, ") + "or pass a custom React context provider to <Provider> and the corresponding " + ("React context consumer to " + displayName + " in connect options."));
+      } // Based on the previous check, one of these must be true
+
+
+      var store = didStoreComeFromProps ? props.store : contextValue.store;
+      var childPropsSelector = useMemo(function () {
+        // The child props selector needs the store reference as an input.
+        // Re-create this selector whenever the store changes.
+        return createChildSelector(store);
+      }, [store]);
+
+      var _useMemo2 = useMemo(function () {
+        if (!shouldHandleStateChanges) return NO_SUBSCRIPTION_ARRAY; // This Subscription's source should match where store came from: props vs. context. A component
+        // connected to the store via props shouldn't use subscription from context, or vice versa.
+
+        // This Subscription's source should match where store came from: props vs. context. A component
+        // connected to the store via props shouldn't use subscription from context, or vice versa.
+        var subscription = createSubscription(store, didStoreComeFromProps ? null : contextValue.subscription); // `notifyNestedSubs` is duplicated to handle the case where the component is unmounted in
+        // the middle of the notification loop, where `subscription` will then be null. This can
+        // probably be avoided if Subscription's listeners logic is changed to not call listeners
+        // that have been unsubscribed in the  middle of the notification loop.
+
+        // `notifyNestedSubs` is duplicated to handle the case where the component is unmounted in
+        // the middle of the notification loop, where `subscription` will then be null. This can
+        // probably be avoided if Subscription's listeners logic is changed to not call listeners
+        // that have been unsubscribed in the  middle of the notification loop.
+        var notifyNestedSubs = subscription.notifyNestedSubs.bind(subscription);
+        return [subscription, notifyNestedSubs];
+      }, [store, didStoreComeFromProps, contextValue]),
+          subscription = _useMemo2[0],
+          notifyNestedSubs = _useMemo2[1]; // Determine what {store, subscription} value should be put into nested context, if necessary,
+      // and memoize that value to avoid unnecessary context updates.
+
+
+      var overriddenContextValue = useMemo(function () {
+        if (didStoreComeFromProps) {
+          // This component is directly subscribed to a store from props.
+          // We don't want descendants reading from this store - pass down whatever
+          // the existing context value is from the nearest connected ancestor.
+          return contextValue;
+        } // Otherwise, put this component's subscription instance into context, so that
+        // connected descendants won't update until after this component is done
+
+
+        return _extends({}, contextValue, {
+          subscription: subscription
+        });
+      }, [didStoreComeFromProps, contextValue, subscription]); // We need to force this wrapper component to re-render whenever a Redux store update
+      // causes a change to the calculated child component props (or we caught an error in mapState)
+
+      var _useReducer = useReducer(storeStateUpdatesReducer, EMPTY_ARRAY, initStateUpdates),
+          _useReducer$ = _useReducer[0],
+          previousStateUpdateResult = _useReducer$[0],
+          forceComponentUpdateDispatch = _useReducer[1]; // Propagate any mapState/mapDispatch errors upwards
+
+
+      if (previousStateUpdateResult && previousStateUpdateResult.error) {
+        throw previousStateUpdateResult.error;
+      } // Set up refs to coordinate values between the subscription effect and the render logic
+
+
+      var lastChildProps = useRef();
+      var lastWrapperProps = useRef(wrapperProps);
+      var childPropsFromStoreUpdate = useRef();
+      var renderIsScheduled = useRef(false);
+      var actualChildProps = usePureOnlyMemo(function () {
+        // Tricky logic here:
+        // - This render may have been triggered by a Redux store update that produced new child props
+        // - However, we may have gotten new wrapper props after that
+        // If we have new child props, and the same wrapper props, we know we should use the new child props as-is.
+        // But, if we have new wrapper props, those might change the child props, so we have to recalculate things.
+        // So, we'll use the child props from store update only if the wrapper props are the same as last time.
+        if (childPropsFromStoreUpdate.current && wrapperProps === lastWrapperProps.current) {
+          return childPropsFromStoreUpdate.current;
+        } // TODO We're reading the store directly in render() here. Bad idea?
+        // This will likely cause Bad Things (TM) to happen in Concurrent Mode.
+        // Note that we do this because on renders _not_ caused by store updates, we need the latest store state
+        // to determine what the child props should be.
+
+
+        return childPropsSelector(store.getState(), wrapperProps);
+      }, [store, previousStateUpdateResult, wrapperProps]); // We need this to execute synchronously every time we re-render. However, React warns
+      // about useLayoutEffect in SSR, so we try to detect environment and fall back to
+      // just useEffect instead to avoid the warning, since neither will run anyway.
+
+      useIsomorphicLayoutEffectWithArgs(captureWrapperProps, [lastWrapperProps, lastChildProps, renderIsScheduled, wrapperProps, actualChildProps, childPropsFromStoreUpdate, notifyNestedSubs]); // Our re-subscribe logic only runs when the store/subscription setup changes
+
+      useIsomorphicLayoutEffectWithArgs(subscribeUpdates, [shouldHandleStateChanges, store, subscription, childPropsSelector, lastWrapperProps, lastChildProps, renderIsScheduled, childPropsFromStoreUpdate, notifyNestedSubs, forceComponentUpdateDispatch], [store, subscription, childPropsSelector]); // Now that all that's done, we can finally try to actually render the child component.
+      // We memoize the elements for the rendered child component as an optimization.
+
+      var renderedWrappedComponent = useMemo(function () {
+        return /*#__PURE__*/React.createElement(WrappedComponent, _extends({}, actualChildProps, {
+          ref: reactReduxForwardedRef
+        }));
+      }, [reactReduxForwardedRef, WrappedComponent, actualChildProps]); // If React sees the exact same element reference as last time, it bails out of re-rendering
+      // that child, same as if it was wrapped in React.memo() or returned false from shouldComponentUpdate.
+
+      var renderedChild = useMemo(function () {
+        if (shouldHandleStateChanges) {
+          // If this component is subscribed to store updates, we need to pass its own
+          // subscription instance down to our descendants. That means rendering the same
+          // Context instance, and putting a different value into the context.
+          return /*#__PURE__*/React.createElement(ContextToUse.Provider, {
+            value: overriddenContextValue
+          }, renderedWrappedComponent);
+        }
+
+        return renderedWrappedComponent;
+      }, [ContextToUse, renderedWrappedComponent, overriddenContextValue]);
+      return renderedChild;
+    } // If we're in "pure" mode, ensure our wrapper component only re-renders when incoming props have changed.
+
+
+    var Connect = pure ? React.memo(ConnectFunction) : ConnectFunction;
+    Connect.WrappedComponent = WrappedComponent;
+    Connect.displayName = ConnectFunction.displayName = displayName;
+
+    if (forwardRef) {
+      var forwarded = React.forwardRef(function forwardConnectRef(props, ref) {
+        return /*#__PURE__*/React.createElement(Connect, _extends({}, props, {
+          reactReduxForwardedRef: ref
+        }));
+      });
+      forwarded.displayName = displayName;
+      forwarded.WrappedComponent = WrappedComponent;
+      return hoistStatics(forwarded, WrappedComponent);
+    }
+
+    return hoistStatics(Connect, WrappedComponent);
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/connect/connect.js b/ddb_main/node_modules/react-redux/es/connect/connect.js
new file mode 100644
index 0000000..f805be5
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/connect/connect.js
@@ -0,0 +1,99 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _excluded = ["pure", "areStatesEqual", "areOwnPropsEqual", "areStatePropsEqual", "areMergedPropsEqual"];
+import connectAdvanced from '../components/connectAdvanced';
+import shallowEqual from '../utils/shallowEqual';
+import defaultMapDispatchToPropsFactories from './mapDispatchToProps';
+import defaultMapStateToPropsFactories from './mapStateToProps';
+import defaultMergePropsFactories from './mergeProps';
+import defaultSelectorFactory from './selectorFactory';
+/*
+  connect is a facade over connectAdvanced. It turns its args into a compatible
+  selectorFactory, which has the signature:
+
+    (dispatch, options) => (nextState, nextOwnProps) => nextFinalProps
+  
+  connect passes its args to connectAdvanced as options, which will in turn pass them to
+  selectorFactory each time a Connect component instance is instantiated or hot reloaded.
+
+  selectorFactory returns a final props selector from its mapStateToProps,
+  mapStateToPropsFactories, mapDispatchToProps, mapDispatchToPropsFactories, mergeProps,
+  mergePropsFactories, and pure args.
+
+  The resulting final props selector is called by the Connect component instance whenever
+  it receives new props or store state.
+ */
+
+function match(arg, factories, name) {
+  for (var i = factories.length - 1; i >= 0; i--) {
+    var result = factories[i](arg);
+    if (result) return result;
+  }
+
+  return function (dispatch, options) {
+    throw new Error("Invalid value of type " + typeof arg + " for " + name + " argument when connecting component " + options.wrappedComponentName + ".");
+  };
+}
+
+function strictEqual(a, b) {
+  return a === b;
+} // createConnect with default args builds the 'official' connect behavior. Calling it with
+// different options opens up some testing and extensibility scenarios
+
+
+export function createConnect(_temp) {
+  var _ref = _temp === void 0 ? {} : _temp,
+      _ref$connectHOC = _ref.connectHOC,
+      connectHOC = _ref$connectHOC === void 0 ? connectAdvanced : _ref$connectHOC,
+      _ref$mapStateToPropsF = _ref.mapStateToPropsFactories,
+      mapStateToPropsFactories = _ref$mapStateToPropsF === void 0 ? defaultMapStateToPropsFactories : _ref$mapStateToPropsF,
+      _ref$mapDispatchToPro = _ref.mapDispatchToPropsFactories,
+      mapDispatchToPropsFactories = _ref$mapDispatchToPro === void 0 ? defaultMapDispatchToPropsFactories : _ref$mapDispatchToPro,
+      _ref$mergePropsFactor = _ref.mergePropsFactories,
+      mergePropsFactories = _ref$mergePropsFactor === void 0 ? defaultMergePropsFactories : _ref$mergePropsFactor,
+      _ref$selectorFactory = _ref.selectorFactory,
+      selectorFactory = _ref$selectorFactory === void 0 ? defaultSelectorFactory : _ref$selectorFactory;
+
+  return function connect(mapStateToProps, mapDispatchToProps, mergeProps, _ref2) {
+    if (_ref2 === void 0) {
+      _ref2 = {};
+    }
+
+    var _ref3 = _ref2,
+        _ref3$pure = _ref3.pure,
+        pure = _ref3$pure === void 0 ? true : _ref3$pure,
+        _ref3$areStatesEqual = _ref3.areStatesEqual,
+        areStatesEqual = _ref3$areStatesEqual === void 0 ? strictEqual : _ref3$areStatesEqual,
+        _ref3$areOwnPropsEqua = _ref3.areOwnPropsEqual,
+        areOwnPropsEqual = _ref3$areOwnPropsEqua === void 0 ? shallowEqual : _ref3$areOwnPropsEqua,
+        _ref3$areStatePropsEq = _ref3.areStatePropsEqual,
+        areStatePropsEqual = _ref3$areStatePropsEq === void 0 ? shallowEqual : _ref3$areStatePropsEq,
+        _ref3$areMergedPropsE = _ref3.areMergedPropsEqual,
+        areMergedPropsEqual = _ref3$areMergedPropsE === void 0 ? shallowEqual : _ref3$areMergedPropsE,
+        extraOptions = _objectWithoutPropertiesLoose(_ref3, _excluded);
+
+    var initMapStateToProps = match(mapStateToProps, mapStateToPropsFactories, 'mapStateToProps');
+    var initMapDispatchToProps = match(mapDispatchToProps, mapDispatchToPropsFactories, 'mapDispatchToProps');
+    var initMergeProps = match(mergeProps, mergePropsFactories, 'mergeProps');
+    return connectHOC(selectorFactory, _extends({
+      // used in error messages
+      methodName: 'connect',
+      // used to compute Connect's displayName from the wrapped component's displayName.
+      getDisplayName: function getDisplayName(name) {
+        return "Connect(" + name + ")";
+      },
+      // if mapStateToProps is falsy, the Connect component doesn't subscribe to store state changes
+      shouldHandleStateChanges: Boolean(mapStateToProps),
+      // passed through to selectorFactory
+      initMapStateToProps: initMapStateToProps,
+      initMapDispatchToProps: initMapDispatchToProps,
+      initMergeProps: initMergeProps,
+      pure: pure,
+      areStatesEqual: areStatesEqual,
+      areOwnPropsEqual: areOwnPropsEqual,
+      areStatePropsEqual: areStatePropsEqual,
+      areMergedPropsEqual: areMergedPropsEqual
+    }, extraOptions));
+  };
+}
+export default /*#__PURE__*/createConnect();
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/connect/mapDispatchToProps.js b/ddb_main/node_modules/react-redux/es/connect/mapDispatchToProps.js
new file mode 100644
index 0000000..ca1f0ea
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/connect/mapDispatchToProps.js
@@ -0,0 +1,18 @@
+import bindActionCreators from '../utils/bindActionCreators';
+import { wrapMapToPropsConstant, wrapMapToPropsFunc } from './wrapMapToProps';
+export function whenMapDispatchToPropsIsFunction(mapDispatchToProps) {
+  return typeof mapDispatchToProps === 'function' ? wrapMapToPropsFunc(mapDispatchToProps, 'mapDispatchToProps') : undefined;
+}
+export function whenMapDispatchToPropsIsMissing(mapDispatchToProps) {
+  return !mapDispatchToProps ? wrapMapToPropsConstant(function (dispatch) {
+    return {
+      dispatch: dispatch
+    };
+  }) : undefined;
+}
+export function whenMapDispatchToPropsIsObject(mapDispatchToProps) {
+  return mapDispatchToProps && typeof mapDispatchToProps === 'object' ? wrapMapToPropsConstant(function (dispatch) {
+    return bindActionCreators(mapDispatchToProps, dispatch);
+  }) : undefined;
+}
+export default [whenMapDispatchToPropsIsFunction, whenMapDispatchToPropsIsMissing, whenMapDispatchToPropsIsObject];
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/connect/mapStateToProps.js b/ddb_main/node_modules/react-redux/es/connect/mapStateToProps.js
new file mode 100644
index 0000000..baffdf3
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/connect/mapStateToProps.js
@@ -0,0 +1,10 @@
+import { wrapMapToPropsConstant, wrapMapToPropsFunc } from './wrapMapToProps';
+export function whenMapStateToPropsIsFunction(mapStateToProps) {
+  return typeof mapStateToProps === 'function' ? wrapMapToPropsFunc(mapStateToProps, 'mapStateToProps') : undefined;
+}
+export function whenMapStateToPropsIsMissing(mapStateToProps) {
+  return !mapStateToProps ? wrapMapToPropsConstant(function () {
+    return {};
+  }) : undefined;
+}
+export default [whenMapStateToPropsIsFunction, whenMapStateToPropsIsMissing];
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/connect/mergeProps.js b/ddb_main/node_modules/react-redux/es/connect/mergeProps.js
new file mode 100644
index 0000000..23d2ad3
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/connect/mergeProps.js
@@ -0,0 +1,36 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import verifyPlainObject from '../utils/verifyPlainObject';
+export function defaultMergeProps(stateProps, dispatchProps, ownProps) {
+  return _extends({}, ownProps, stateProps, dispatchProps);
+}
+export function wrapMergePropsFunc(mergeProps) {
+  return function initMergePropsProxy(dispatch, _ref) {
+    var displayName = _ref.displayName,
+        pure = _ref.pure,
+        areMergedPropsEqual = _ref.areMergedPropsEqual;
+    var hasRunOnce = false;
+    var mergedProps;
+    return function mergePropsProxy(stateProps, dispatchProps, ownProps) {
+      var nextMergedProps = mergeProps(stateProps, dispatchProps, ownProps);
+
+      if (hasRunOnce) {
+        if (!pure || !areMergedPropsEqual(nextMergedProps, mergedProps)) mergedProps = nextMergedProps;
+      } else {
+        hasRunOnce = true;
+        mergedProps = nextMergedProps;
+        if (process.env.NODE_ENV !== 'production') verifyPlainObject(mergedProps, displayName, 'mergeProps');
+      }
+
+      return mergedProps;
+    };
+  };
+}
+export function whenMergePropsIsFunction(mergeProps) {
+  return typeof mergeProps === 'function' ? wrapMergePropsFunc(mergeProps) : undefined;
+}
+export function whenMergePropsIsOmitted(mergeProps) {
+  return !mergeProps ? function () {
+    return defaultMergeProps;
+  } : undefined;
+}
+export default [whenMergePropsIsFunction, whenMergePropsIsOmitted];
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/connect/selectorFactory.js b/ddb_main/node_modules/react-redux/es/connect/selectorFactory.js
new file mode 100644
index 0000000..2586487
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/connect/selectorFactory.js
@@ -0,0 +1,88 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _excluded = ["initMapStateToProps", "initMapDispatchToProps", "initMergeProps"];
+import verifySubselectors from './verifySubselectors';
+export function impureFinalPropsSelectorFactory(mapStateToProps, mapDispatchToProps, mergeProps, dispatch) {
+  return function impureFinalPropsSelector(state, ownProps) {
+    return mergeProps(mapStateToProps(state, ownProps), mapDispatchToProps(dispatch, ownProps), ownProps);
+  };
+}
+export function pureFinalPropsSelectorFactory(mapStateToProps, mapDispatchToProps, mergeProps, dispatch, _ref) {
+  var areStatesEqual = _ref.areStatesEqual,
+      areOwnPropsEqual = _ref.areOwnPropsEqual,
+      areStatePropsEqual = _ref.areStatePropsEqual;
+  var hasRunAtLeastOnce = false;
+  var state;
+  var ownProps;
+  var stateProps;
+  var dispatchProps;
+  var mergedProps;
+
+  function handleFirstCall(firstState, firstOwnProps) {
+    state = firstState;
+    ownProps = firstOwnProps;
+    stateProps = mapStateToProps(state, ownProps);
+    dispatchProps = mapDispatchToProps(dispatch, ownProps);
+    mergedProps = mergeProps(stateProps, dispatchProps, ownProps);
+    hasRunAtLeastOnce = true;
+    return mergedProps;
+  }
+
+  function handleNewPropsAndNewState() {
+    stateProps = mapStateToProps(state, ownProps);
+    if (mapDispatchToProps.dependsOnOwnProps) dispatchProps = mapDispatchToProps(dispatch, ownProps);
+    mergedProps = mergeProps(stateProps, dispatchProps, ownProps);
+    return mergedProps;
+  }
+
+  function handleNewProps() {
+    if (mapStateToProps.dependsOnOwnProps) stateProps = mapStateToProps(state, ownProps);
+    if (mapDispatchToProps.dependsOnOwnProps) dispatchProps = mapDispatchToProps(dispatch, ownProps);
+    mergedProps = mergeProps(stateProps, dispatchProps, ownProps);
+    return mergedProps;
+  }
+
+  function handleNewState() {
+    var nextStateProps = mapStateToProps(state, ownProps);
+    var statePropsChanged = !areStatePropsEqual(nextStateProps, stateProps);
+    stateProps = nextStateProps;
+    if (statePropsChanged) mergedProps = mergeProps(stateProps, dispatchProps, ownProps);
+    return mergedProps;
+  }
+
+  function handleSubsequentCalls(nextState, nextOwnProps) {
+    var propsChanged = !areOwnPropsEqual(nextOwnProps, ownProps);
+    var stateChanged = !areStatesEqual(nextState, state, nextOwnProps, ownProps);
+    state = nextState;
+    ownProps = nextOwnProps;
+    if (propsChanged && stateChanged) return handleNewPropsAndNewState();
+    if (propsChanged) return handleNewProps();
+    if (stateChanged) return handleNewState();
+    return mergedProps;
+  }
+
+  return function pureFinalPropsSelector(nextState, nextOwnProps) {
+    return hasRunAtLeastOnce ? handleSubsequentCalls(nextState, nextOwnProps) : handleFirstCall(nextState, nextOwnProps);
+  };
+} // TODO: Add more comments
+// If pure is true, the selector returned by selectorFactory will memoize its results,
+// allowing connectAdvanced's shouldComponentUpdate to return false if final
+// props have not changed. If false, the selector will always return a new
+// object and shouldComponentUpdate will always return true.
+
+export default function finalPropsSelectorFactory(dispatch, _ref2) {
+  var initMapStateToProps = _ref2.initMapStateToProps,
+      initMapDispatchToProps = _ref2.initMapDispatchToProps,
+      initMergeProps = _ref2.initMergeProps,
+      options = _objectWithoutPropertiesLoose(_ref2, _excluded);
+
+  var mapStateToProps = initMapStateToProps(dispatch, options);
+  var mapDispatchToProps = initMapDispatchToProps(dispatch, options);
+  var mergeProps = initMergeProps(dispatch, options);
+
+  if (process.env.NODE_ENV !== 'production') {
+    verifySubselectors(mapStateToProps, mapDispatchToProps, mergeProps, options.displayName);
+  }
+
+  var selectorFactory = options.pure ? pureFinalPropsSelectorFactory : impureFinalPropsSelectorFactory;
+  return selectorFactory(mapStateToProps, mapDispatchToProps, mergeProps, dispatch, options);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/connect/wrapMapToProps.js b/ddb_main/node_modules/react-redux/es/connect/wrapMapToProps.js
new file mode 100644
index 0000000..868f604
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/connect/wrapMapToProps.js
@@ -0,0 +1,64 @@
+import verifyPlainObject from '../utils/verifyPlainObject';
+export function wrapMapToPropsConstant(getConstant) {
+  return function initConstantSelector(dispatch, options) {
+    var constant = getConstant(dispatch, options);
+
+    function constantSelector() {
+      return constant;
+    }
+
+    constantSelector.dependsOnOwnProps = false;
+    return constantSelector;
+  };
+} // dependsOnOwnProps is used by createMapToPropsProxy to determine whether to pass props as args
+// to the mapToProps function being wrapped. It is also used by makePurePropsSelector to determine
+// whether mapToProps needs to be invoked when props have changed.
+//
+// A length of one signals that mapToProps does not depend on props from the parent component.
+// A length of zero is assumed to mean mapToProps is getting args via arguments or ...args and
+// therefore not reporting its length accurately..
+
+export function getDependsOnOwnProps(mapToProps) {
+  return mapToProps.dependsOnOwnProps !== null && mapToProps.dependsOnOwnProps !== undefined ? Boolean(mapToProps.dependsOnOwnProps) : mapToProps.length !== 1;
+} // Used by whenMapStateToPropsIsFunction and whenMapDispatchToPropsIsFunction,
+// this function wraps mapToProps in a proxy function which does several things:
+//
+//  * Detects whether the mapToProps function being called depends on props, which
+//    is used by selectorFactory to decide if it should reinvoke on props changes.
+//
+//  * On first call, handles mapToProps if returns another function, and treats that
+//    new function as the true mapToProps for subsequent calls.
+//
+//  * On first call, verifies the first result is a plain object, in order to warn
+//    the developer that their mapToProps function is not returning a valid result.
+//
+
+export function wrapMapToPropsFunc(mapToProps, methodName) {
+  return function initProxySelector(dispatch, _ref) {
+    var displayName = _ref.displayName;
+
+    var proxy = function mapToPropsProxy(stateOrDispatch, ownProps) {
+      return proxy.dependsOnOwnProps ? proxy.mapToProps(stateOrDispatch, ownProps) : proxy.mapToProps(stateOrDispatch);
+    }; // allow detectFactoryAndVerify to get ownProps
+
+
+    proxy.dependsOnOwnProps = true;
+
+    proxy.mapToProps = function detectFactoryAndVerify(stateOrDispatch, ownProps) {
+      proxy.mapToProps = mapToProps;
+      proxy.dependsOnOwnProps = getDependsOnOwnProps(mapToProps);
+      var props = proxy(stateOrDispatch, ownProps);
+
+      if (typeof props === 'function') {
+        proxy.mapToProps = props;
+        proxy.dependsOnOwnProps = getDependsOnOwnProps(props);
+        props = proxy(stateOrDispatch, ownProps);
+      }
+
+      if (process.env.NODE_ENV !== 'production') verifyPlainObject(props, displayName, methodName);
+      return props;
+    };
+
+    return proxy;
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/hooks/useDispatch.js b/ddb_main/node_modules/react-redux/es/hooks/useDispatch.js
new file mode 100644
index 0000000..6c571e5
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/hooks/useDispatch.js
@@ -0,0 +1,43 @@
+import { ReactReduxContext } from '../components/Context';
+import { useStore as useDefaultStore, createStoreHook } from './useStore';
+/**
+ * Hook factory, which creates a `useDispatch` hook bound to a given context.
+ *
+ * @param {React.Context} [context=ReactReduxContext] Context passed to your `<Provider>`.
+ * @returns {Function} A `useDispatch` hook bound to the specified context.
+ */
+
+export function createDispatchHook(context) {
+  if (context === void 0) {
+    context = ReactReduxContext;
+  }
+
+  var useStore = context === ReactReduxContext ? useDefaultStore : createStoreHook(context);
+  return function useDispatch() {
+    var store = useStore();
+    return store.dispatch;
+  };
+}
+/**
+ * A hook to access the redux `dispatch` function.
+ *
+ * @returns {any|function} redux store's `dispatch` function
+ *
+ * @example
+ *
+ * import React, { useCallback } from 'react'
+ * import { useDispatch } from 'react-redux'
+ *
+ * export const CounterComponent = ({ value }) => {
+ *   const dispatch = useDispatch()
+ *   const increaseCounter = useCallback(() => dispatch({ type: 'increase-counter' }), [])
+ *   return (
+ *     <div>
+ *       <span>{value}</span>
+ *       <button onClick={increaseCounter}>Increase counter</button>
+ *     </div>
+ *   )
+ * }
+ */
+
+export var useDispatch = /*#__PURE__*/createDispatchHook();
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/hooks/useReduxContext.js b/ddb_main/node_modules/react-redux/es/hooks/useReduxContext.js
new file mode 100644
index 0000000..575677b
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/hooks/useReduxContext.js
@@ -0,0 +1,28 @@
+import { useContext } from 'react';
+import { ReactReduxContext } from '../components/Context';
+/**
+ * A hook to access the value of the `ReactReduxContext`. This is a low-level
+ * hook that you should usually not need to call directly.
+ *
+ * @returns {any} the value of the `ReactReduxContext`
+ *
+ * @example
+ *
+ * import React from 'react'
+ * import { useReduxContext } from 'react-redux'
+ *
+ * export const CounterComponent = ({ value }) => {
+ *   const { store } = useReduxContext()
+ *   return <div>{store.getState()}</div>
+ * }
+ */
+
+export function useReduxContext() {
+  var contextValue = useContext(ReactReduxContext);
+
+  if (process.env.NODE_ENV !== 'production' && !contextValue) {
+    throw new Error('could not find react-redux context value; please ensure the component is wrapped in a <Provider>');
+  }
+
+  return contextValue;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/hooks/useSelector.js b/ddb_main/node_modules/react-redux/es/hooks/useSelector.js
new file mode 100644
index 0000000..c53d301
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/hooks/useSelector.js
@@ -0,0 +1,158 @@
+import { useReducer, useRef, useMemo, useContext, useDebugValue } from 'react';
+import { useReduxContext as useDefaultReduxContext } from './useReduxContext';
+import { createSubscription } from '../utils/Subscription';
+import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect';
+import { ReactReduxContext } from '../components/Context';
+
+var refEquality = function refEquality(a, b) {
+  return a === b;
+};
+
+function useSelectorWithStoreAndSubscription(selector, equalityFn, store, contextSub) {
+  var _useReducer = useReducer(function (s) {
+    return s + 1;
+  }, 0),
+      forceRender = _useReducer[1];
+
+  var subscription = useMemo(function () {
+    return createSubscription(store, contextSub);
+  }, [store, contextSub]);
+  var latestSubscriptionCallbackError = useRef();
+  var latestSelector = useRef();
+  var latestStoreState = useRef();
+  var latestSelectedState = useRef();
+  var storeState = store.getState();
+  var selectedState;
+
+  try {
+    if (selector !== latestSelector.current || storeState !== latestStoreState.current || latestSubscriptionCallbackError.current) {
+      var newSelectedState = selector(storeState); // ensure latest selected state is reused so that a custom equality function can result in identical references
+
+      if (latestSelectedState.current === undefined || !equalityFn(newSelectedState, latestSelectedState.current)) {
+        selectedState = newSelectedState;
+      } else {
+        selectedState = latestSelectedState.current;
+      }
+    } else {
+      selectedState = latestSelectedState.current;
+    }
+  } catch (err) {
+    if (latestSubscriptionCallbackError.current) {
+      err.message += "\nThe error may be correlated with this previous error:\n" + latestSubscriptionCallbackError.current.stack + "\n\n";
+    }
+
+    throw err;
+  }
+
+  useIsomorphicLayoutEffect(function () {
+    latestSelector.current = selector;
+    latestStoreState.current = storeState;
+    latestSelectedState.current = selectedState;
+    latestSubscriptionCallbackError.current = undefined;
+  });
+  useIsomorphicLayoutEffect(function () {
+    function checkForUpdates() {
+      try {
+        var newStoreState = store.getState(); // Avoid calling selector multiple times if the store's state has not changed
+
+        if (newStoreState === latestStoreState.current) {
+          return;
+        }
+
+        var _newSelectedState = latestSelector.current(newStoreState);
+
+        if (equalityFn(_newSelectedState, latestSelectedState.current)) {
+          return;
+        }
+
+        latestSelectedState.current = _newSelectedState;
+        latestStoreState.current = newStoreState;
+      } catch (err) {
+        // we ignore all errors here, since when the component
+        // is re-rendered, the selectors are called again, and
+        // will throw again, if neither props nor store state
+        // changed
+        latestSubscriptionCallbackError.current = err;
+      }
+
+      forceRender();
+    }
+
+    subscription.onStateChange = checkForUpdates;
+    subscription.trySubscribe();
+    checkForUpdates();
+    return function () {
+      return subscription.tryUnsubscribe();
+    };
+  }, [store, subscription]);
+  return selectedState;
+}
+/**
+ * Hook factory, which creates a `useSelector` hook bound to a given context.
+ *
+ * @param {React.Context} [context=ReactReduxContext] Context passed to your `<Provider>`.
+ * @returns {Function} A `useSelector` hook bound to the specified context.
+ */
+
+
+export function createSelectorHook(context) {
+  if (context === void 0) {
+    context = ReactReduxContext;
+  }
+
+  var useReduxContext = context === ReactReduxContext ? useDefaultReduxContext : function () {
+    return useContext(context);
+  };
+  return function useSelector(selector, equalityFn) {
+    if (equalityFn === void 0) {
+      equalityFn = refEquality;
+    }
+
+    if (process.env.NODE_ENV !== 'production') {
+      if (!selector) {
+        throw new Error("You must pass a selector to useSelector");
+      }
+
+      if (typeof selector !== 'function') {
+        throw new Error("You must pass a function as a selector to useSelector");
+      }
+
+      if (typeof equalityFn !== 'function') {
+        throw new Error("You must pass a function as an equality function to useSelector");
+      }
+    }
+
+    var _useReduxContext = useReduxContext(),
+        store = _useReduxContext.store,
+        contextSub = _useReduxContext.subscription;
+
+    var selectedState = useSelectorWithStoreAndSubscription(selector, equalityFn, store, contextSub);
+    useDebugValue(selectedState);
+    return selectedState;
+  };
+}
+/**
+ * A hook to access the redux store's state. This hook takes a selector function
+ * as an argument. The selector is called with the store state.
+ *
+ * This hook takes an optional equality comparison function as the second parameter
+ * that allows you to customize the way the selected state is compared to determine
+ * whether the component needs to be re-rendered.
+ *
+ * @param {Function} selector the selector function
+ * @param {Function=} equalityFn the function that will be used to determine equality
+ *
+ * @returns {any} the selected state
+ *
+ * @example
+ *
+ * import React from 'react'
+ * import { useSelector } from 'react-redux'
+ *
+ * export const CounterComponent = () => {
+ *   const counter = useSelector(state => state.counter)
+ *   return <div>{counter}</div>
+ * }
+ */
+
+export var useSelector = /*#__PURE__*/createSelectorHook();
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/hooks/useStore.js b/ddb_main/node_modules/react-redux/es/hooks/useStore.js
new file mode 100644
index 0000000..b2244e1
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/hooks/useStore.js
@@ -0,0 +1,42 @@
+import { useContext } from 'react';
+import { ReactReduxContext } from '../components/Context';
+import { useReduxContext as useDefaultReduxContext } from './useReduxContext';
+/**
+ * Hook factory, which creates a `useStore` hook bound to a given context.
+ *
+ * @param {React.Context} [context=ReactReduxContext] Context passed to your `<Provider>`.
+ * @returns {Function} A `useStore` hook bound to the specified context.
+ */
+
+export function createStoreHook(context) {
+  if (context === void 0) {
+    context = ReactReduxContext;
+  }
+
+  var useReduxContext = context === ReactReduxContext ? useDefaultReduxContext : function () {
+    return useContext(context);
+  };
+  return function useStore() {
+    var _useReduxContext = useReduxContext(),
+        store = _useReduxContext.store;
+
+    return store;
+  };
+}
+/**
+ * A hook to access the redux store.
+ *
+ * @returns {any} the redux store
+ *
+ * @example
+ *
+ * import React from 'react'
+ * import { useStore } from 'react-redux'
+ *
+ * export const ExampleComponent = () => {
+ *   const store = useStore()
+ *   return <div>{store.getState()}</div>
+ * }
+ */
+
+export var useStore = /*#__PURE__*/createStoreHook();
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/index.js b/ddb_main/node_modules/react-redux/es/index.js
new file mode 100644
index 0000000..f3c548a
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/index.js
@@ -0,0 +1,7 @@
+export * from './exports';
+import { unstable_batchedUpdates as batch } from './utils/reactBatchedUpdates';
+import { setBatch } from './utils/batch'; // Enable batched updates in our subscriptions for use
+// with standard React renderers (ReactDOM, React Native)
+
+setBatch(batch);
+export { batch };
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/utils/Subscription.js b/ddb_main/node_modules/react-redux/es/utils/Subscription.js
new file mode 100644
index 0000000..c921bbe
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/utils/Subscription.js
@@ -0,0 +1,126 @@
+import { getBatch } from './batch'; // encapsulates the subscription logic for connecting a component to the redux store, as
+// well as nesting subscriptions of descendant components, so that we can ensure the
+// ancestor components re-render before descendants
+
+function createListenerCollection() {
+  var batch = getBatch();
+  var first = null;
+  var last = null;
+  return {
+    clear: function clear() {
+      first = null;
+      last = null;
+    },
+    notify: function notify() {
+      batch(function () {
+        var listener = first;
+
+        while (listener) {
+          listener.callback();
+          listener = listener.next;
+        }
+      });
+    },
+    get: function get() {
+      var listeners = [];
+      var listener = first;
+
+      while (listener) {
+        listeners.push(listener);
+        listener = listener.next;
+      }
+
+      return listeners;
+    },
+    subscribe: function subscribe(callback) {
+      var isSubscribed = true;
+      var listener = last = {
+        callback: callback,
+        next: null,
+        prev: last
+      };
+
+      if (listener.prev) {
+        listener.prev.next = listener;
+      } else {
+        first = listener;
+      }
+
+      return function unsubscribe() {
+        if (!isSubscribed || first === null) return;
+        isSubscribed = false;
+
+        if (listener.next) {
+          listener.next.prev = listener.prev;
+        } else {
+          last = listener.prev;
+        }
+
+        if (listener.prev) {
+          listener.prev.next = listener.next;
+        } else {
+          first = listener.next;
+        }
+      };
+    }
+  };
+}
+
+var nullListeners = {
+  notify: function notify() {},
+  get: function get() {
+    return [];
+  }
+};
+export function createSubscription(store, parentSub) {
+  var unsubscribe;
+  var listeners = nullListeners;
+
+  function addNestedSub(listener) {
+    trySubscribe();
+    return listeners.subscribe(listener);
+  }
+
+  function notifyNestedSubs() {
+    listeners.notify();
+  }
+
+  function handleChangeWrapper() {
+    if (subscription.onStateChange) {
+      subscription.onStateChange();
+    }
+  }
+
+  function isSubscribed() {
+    return Boolean(unsubscribe);
+  }
+
+  function trySubscribe() {
+    if (!unsubscribe) {
+      unsubscribe = parentSub ? parentSub.addNestedSub(handleChangeWrapper) : store.subscribe(handleChangeWrapper);
+      listeners = createListenerCollection();
+    }
+  }
+
+  function tryUnsubscribe() {
+    if (unsubscribe) {
+      unsubscribe();
+      unsubscribe = undefined;
+      listeners.clear();
+      listeners = nullListeners;
+    }
+  }
+
+  var subscription = {
+    addNestedSub: addNestedSub,
+    notifyNestedSubs: notifyNestedSubs,
+    handleChangeWrapper: handleChangeWrapper,
+    isSubscribed: isSubscribed,
+    trySubscribe: trySubscribe,
+    tryUnsubscribe: tryUnsubscribe,
+    getListeners: function getListeners() {
+      return listeners;
+    }
+  };
+  return subscription;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/utils/batch.js b/ddb_main/node_modules/react-redux/es/utils/batch.js
new file mode 100644
index 0000000..4fe1ccf
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/utils/batch.js
@@ -0,0 +1,14 @@
+// Default to a dummy "batch" implementation that just runs the callback
+function defaultNoopBatch(callback) {
+  callback();
+}
+
+var batch = defaultNoopBatch; // Allow injecting another batching function later
+
+export var setBatch = function setBatch(newBatch) {
+  return batch = newBatch;
+}; // Supply a getter just to skip dealing with ESM bindings
+
+export var getBatch = function getBatch() {
+  return batch;
+};
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/utils/bindActionCreators.js b/ddb_main/node_modules/react-redux/es/utils/bindActionCreators.js
new file mode 100644
index 0000000..1ba617e
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/utils/bindActionCreators.js
@@ -0,0 +1,19 @@
+export default function bindActionCreators(actionCreators, dispatch) {
+  var boundActionCreators = {};
+
+  var _loop = function _loop(key) {
+    var actionCreator = actionCreators[key];
+
+    if (typeof actionCreator === 'function') {
+      boundActionCreators[key] = function () {
+        return dispatch(actionCreator.apply(void 0, arguments));
+      };
+    }
+  };
+
+  for (var key in actionCreators) {
+    _loop(key);
+  }
+
+  return boundActionCreators;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/utils/shallowEqual.js b/ddb_main/node_modules/react-redux/es/utils/shallowEqual.js
new file mode 100644
index 0000000..76c942a
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/utils/shallowEqual.js
@@ -0,0 +1,27 @@
+function is(x, y) {
+  if (x === y) {
+    return x !== 0 || y !== 0 || 1 / x === 1 / y;
+  } else {
+    return x !== x && y !== y;
+  }
+}
+
+export default function shallowEqual(objA, objB) {
+  if (is(objA, objB)) return true;
+
+  if (typeof objA !== 'object' || objA === null || typeof objB !== 'object' || objB === null) {
+    return false;
+  }
+
+  var keysA = Object.keys(objA);
+  var keysB = Object.keys(objB);
+  if (keysA.length !== keysB.length) return false;
+
+  for (var i = 0; i < keysA.length; i++) {
+    if (!Object.prototype.hasOwnProperty.call(objB, keysA[i]) || !is(objA[keysA[i]], objB[keysA[i]])) {
+      return false;
+    }
+  }
+
+  return true;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/es/utils/useIsomorphicLayoutEffect.js b/ddb_main/node_modules/react-redux/es/utils/useIsomorphicLayoutEffect.js
new file mode 100644
index 0000000..2242a85
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/es/utils/useIsomorphicLayoutEffect.js
@@ -0,0 +1,10 @@
+import { useEffect, useLayoutEffect } from 'react'; // React currently throws a warning when using useLayoutEffect on the server.
+// To get around it, we can conditionally useEffect on the server (no-op) and
+// useLayoutEffect in the browser. We need useLayoutEffect to ensure the store
+// subscription callback always has the selector from the latest render commit
+// available, otherwise a store update may happen between render and the effect,
+// which may cause missed updates; we also must ensure the store subscription
+// is created synchronously, otherwise a store update may occur before the
+// subscription is created and an inconsistent state may be observed
+
+export var useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? useLayoutEffect : useEffect;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-redux/node_modules/react-is/cjs/react-is.production.min.js b/ddb_main/node_modules/react-redux/node_modules/react-is/cjs/react-is.production.min.js
new file mode 100644
index 0000000..b416090
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/node_modules/react-is/cjs/react-is.production.min.js
@@ -0,0 +1,14 @@
+/** @license React v17.0.2
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';var b=60103,c=60106,d=60107,e=60108,f=60114,g=60109,h=60110,k=60112,l=60113,m=60120,n=60115,p=60116,q=60121,r=60122,u=60117,v=60129,w=60131;
+if("function"===typeof Symbol&&Symbol.for){var x=Symbol.for;b=x("react.element");c=x("react.portal");d=x("react.fragment");e=x("react.strict_mode");f=x("react.profiler");g=x("react.provider");h=x("react.context");k=x("react.forward_ref");l=x("react.suspense");m=x("react.suspense_list");n=x("react.memo");p=x("react.lazy");q=x("react.block");r=x("react.server.block");u=x("react.fundamental");v=x("react.debug_trace_mode");w=x("react.legacy_hidden")}
+function y(a){if("object"===typeof a&&null!==a){var t=a.$$typeof;switch(t){case b:switch(a=a.type,a){case d:case f:case e:case l:case m:return a;default:switch(a=a&&a.$$typeof,a){case h:case k:case p:case n:case g:return a;default:return t}}case c:return t}}}var z=g,A=b,B=k,C=d,D=p,E=n,F=c,G=f,H=e,I=l;exports.ContextConsumer=h;exports.ContextProvider=z;exports.Element=A;exports.ForwardRef=B;exports.Fragment=C;exports.Lazy=D;exports.Memo=E;exports.Portal=F;exports.Profiler=G;exports.StrictMode=H;
+exports.Suspense=I;exports.isAsyncMode=function(){return!1};exports.isConcurrentMode=function(){return!1};exports.isContextConsumer=function(a){return y(a)===h};exports.isContextProvider=function(a){return y(a)===g};exports.isElement=function(a){return"object"===typeof a&&null!==a&&a.$$typeof===b};exports.isForwardRef=function(a){return y(a)===k};exports.isFragment=function(a){return y(a)===d};exports.isLazy=function(a){return y(a)===p};exports.isMemo=function(a){return y(a)===n};
+exports.isPortal=function(a){return y(a)===c};exports.isProfiler=function(a){return y(a)===f};exports.isStrictMode=function(a){return y(a)===e};exports.isSuspense=function(a){return y(a)===l};exports.isValidElementType=function(a){return"string"===typeof a||"function"===typeof a||a===d||a===f||a===v||a===e||a===l||a===m||a===w||"object"===typeof a&&null!==a&&(a.$$typeof===p||a.$$typeof===n||a.$$typeof===g||a.$$typeof===h||a.$$typeof===k||a.$$typeof===u||a.$$typeof===q||a[0]===r)?!0:!1};
+exports.typeOf=y;
diff --git a/ddb_main/node_modules/react-redux/node_modules/react-is/index.js b/ddb_main/node_modules/react-redux/node_modules/react-is/index.js
new file mode 100644
index 0000000..3ae098d
--- /dev/null
+++ b/ddb_main/node_modules/react-redux/node_modules/react-is/index.js
@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-is.production.min.js');
+} else {
+  module.exports = require('./cjs/react-is.development.js');
+}
diff --git a/ddb_main/node_modules/react-router-dom/dom.ts b/ddb_main/node_modules/react-router-dom/dom.ts
new file mode 100644
index 0000000..960e0b5
--- /dev/null
+++ b/ddb_main/node_modules/react-router-dom/dom.ts
@@ -0,0 +1,329 @@
+import type {
+  FormEncType,
+  HTMLFormMethod,
+  RelativeRoutingType,
+} from "@remix-run/router";
+import { stripBasename, UNSAFE_warning as warning } from "@remix-run/router";
+
+export const defaultMethod: HTMLFormMethod = "get";
+const defaultEncType: FormEncType = "application/x-www-form-urlencoded";
+
+export function isHtmlElement(object: any): object is HTMLElement {
+  return object != null && typeof object.tagName === "string";
+}
+
+export function isButtonElement(object: any): object is HTMLButtonElement {
+  return isHtmlElement(object) && object.tagName.toLowerCase() === "button";
+}
+
+export function isFormElement(object: any): object is HTMLFormElement {
+  return isHtmlElement(object) && object.tagName.toLowerCase() === "form";
+}
+
+export function isInputElement(object: any): object is HTMLInputElement {
+  return isHtmlElement(object) && object.tagName.toLowerCase() === "input";
+}
+
+type LimitedMouseEvent = Pick<
+  MouseEvent,
+  "button" | "metaKey" | "altKey" | "ctrlKey" | "shiftKey"
+>;
+
+function isModifiedEvent(event: LimitedMouseEvent) {
+  return !!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey);
+}
+
+export function shouldProcessLinkClick(
+  event: LimitedMouseEvent,
+  target?: string
+) {
+  return (
+    event.button === 0 && // Ignore everything but left clicks
+    (!target || target === "_self") && // Let browser handle "target=_blank" etc.
+    !isModifiedEvent(event) // Ignore clicks with modifier keys
+  );
+}
+
+export type ParamKeyValuePair = [string, string];
+
+export type URLSearchParamsInit =
+  | string
+  | ParamKeyValuePair[]
+  | Record<string, string | string[]>
+  | URLSearchParams;
+
+/**
+ * Creates a URLSearchParams object using the given initializer.
+ *
+ * This is identical to `new URLSearchParams(init)` except it also
+ * supports arrays as values in the object form of the initializer
+ * instead of just strings. This is convenient when you need multiple
+ * values for a given key, but don't want to use an array initializer.
+ *
+ * For example, instead of:
+ *
+ *   let searchParams = new URLSearchParams([
+ *     ['sort', 'name'],
+ *     ['sort', 'price']
+ *   ]);
+ *
+ * you can do:
+ *
+ *   let searchParams = createSearchParams({
+ *     sort: ['name', 'price']
+ *   });
+ */
+export function createSearchParams(
+  init: URLSearchParamsInit = ""
+): URLSearchParams {
+  return new URLSearchParams(
+    typeof init === "string" ||
+    Array.isArray(init) ||
+    init instanceof URLSearchParams
+      ? init
+      : Object.keys(init).reduce((memo, key) => {
+          let value = init[key];
+          return memo.concat(
+            Array.isArray(value) ? value.map((v) => [key, v]) : [[key, value]]
+          );
+        }, [] as ParamKeyValuePair[])
+  );
+}
+
+export function getSearchParamsForLocation(
+  locationSearch: string,
+  defaultSearchParams: URLSearchParams | null
+) {
+  let searchParams = createSearchParams(locationSearch);
+
+  if (defaultSearchParams) {
+    // Use `defaultSearchParams.forEach(...)` here instead of iterating of
+    // `defaultSearchParams.keys()` to work-around a bug in Firefox related to
+    // web extensions. Relevant Bugzilla tickets:
+    // https://bugzilla.mozilla.org/show_bug.cgi?id=1414602
+    // https://bugzilla.mozilla.org/show_bug.cgi?id=1023984
+    defaultSearchParams.forEach((_, key) => {
+      if (!searchParams.has(key)) {
+        defaultSearchParams.getAll(key).forEach((value) => {
+          searchParams.append(key, value);
+        });
+      }
+    });
+  }
+
+  return searchParams;
+}
+
+// Thanks https://github.com/sindresorhus/type-fest!
+type JsonObject = { [Key in string]: JsonValue } & {
+  [Key in string]?: JsonValue | undefined;
+};
+type JsonArray = JsonValue[] | readonly JsonValue[];
+type JsonPrimitive = string | number | boolean | null;
+type JsonValue = JsonPrimitive | JsonObject | JsonArray;
+
+export type SubmitTarget =
+  | HTMLFormElement
+  | HTMLButtonElement
+  | HTMLInputElement
+  | FormData
+  | URLSearchParams
+  | JsonValue
+  | null;
+
+// One-time check for submitter support
+let _formDataSupportsSubmitter: boolean | null = null;
+
+function isFormDataSubmitterSupported() {
+  if (_formDataSupportsSubmitter === null) {
+    try {
+      new FormData(
+        document.createElement("form"),
+        // @ts-expect-error if FormData supports the submitter parameter, this will throw
+        0
+      );
+      _formDataSupportsSubmitter = false;
+    } catch (e) {
+      _formDataSupportsSubmitter = true;
+    }
+  }
+  return _formDataSupportsSubmitter;
+}
+
+export interface SubmitOptions {
+  /**
+   * The HTTP method used to submit the form. Overrides `<form method>`.
+   * Defaults to "GET".
+   */
+  method?: HTMLFormMethod;
+
+  /**
+   * The action URL path used to submit the form. Overrides `<form action>`.
+   * Defaults to the path of the current route.
+   */
+  action?: string;
+
+  /**
+   * The encoding used to submit the form. Overrides `<form encType>`.
+   * Defaults to "application/x-www-form-urlencoded".
+   */
+  encType?: FormEncType;
+
+  /**
+   * Indicate a specific fetcherKey to use when using navigate=false
+   */
+  fetcherKey?: string;
+
+  /**
+   * navigate=false will use a fetcher instead of a navigation
+   */
+  navigate?: boolean;
+
+  /**
+   * Set `true` to replace the current entry in the browser's history stack
+   * instead of creating a new one (i.e. stay on "the same page"). Defaults
+   * to `false`.
+   */
+  replace?: boolean;
+
+  /**
+   * State object to add to the history stack entry for this navigation
+   */
+  state?: any;
+
+  /**
+   * Determines whether the form action is relative to the route hierarchy or
+   * the pathname.  Use this if you want to opt out of navigating the route
+   * hierarchy and want to instead route based on /-delimited URL segments
+   */
+  relative?: RelativeRoutingType;
+
+  /**
+   * In browser-based environments, prevent resetting scroll after this
+   * navigation when using the <ScrollRestoration> component
+   */
+  preventScrollReset?: boolean;
+
+  /**
+   * Enable flushSync for this navigation's state updates
+   */
+  unstable_flushSync?: boolean;
+
+  /**
+   * Enable view transitions on this submission navigation
+   */
+  unstable_viewTransition?: boolean;
+}
+
+const supportedFormEncTypes: Set<FormEncType> = new Set([
+  "application/x-www-form-urlencoded",
+  "multipart/form-data",
+  "text/plain",
+]);
+
+function getFormEncType(encType: string | null) {
+  if (encType != null && !supportedFormEncTypes.has(encType as FormEncType)) {
+    warning(
+      false,
+      `"${encType}" is not a valid \`encType\` for \`<Form>\`/\`<fetcher.Form>\` ` +
+        `and will default to "${defaultEncType}"`
+    );
+
+    return null;
+  }
+  return encType;
+}
+
+export function getFormSubmissionInfo(
+  target: SubmitTarget,
+  basename: string
+): {
+  action: string | null;
+  method: string;
+  encType: string;
+  formData: FormData | undefined;
+  body: any;
+} {
+  let method: string;
+  let action: string | null;
+  let encType: string;
+  let formData: FormData | undefined;
+  let body: any;
+
+  if (isFormElement(target)) {
+    // When grabbing the action from the element, it will have had the basename
+    // prefixed to ensure non-JS scenarios work, so strip it since we'll
+    // re-prefix in the router
+    let attr = target.getAttribute("action");
+    action = attr ? stripBasename(attr, basename) : null;
+    method = target.getAttribute("method") || defaultMethod;
+    encType = getFormEncType(target.getAttribute("enctype")) || defaultEncType;
+
+    formData = new FormData(target);
+  } else if (
+    isButtonElement(target) ||
+    (isInputElement(target) &&
+      (target.type === "submit" || target.type === "image"))
+  ) {
+    let form = target.form;
+
+    if (form == null) {
+      throw new Error(
+        `Cannot submit a <button> or <input type="submit"> without a <form>`
+      );
+    }
+
+    // <button>/<input type="submit"> may override attributes of <form>
+
+    // When grabbing the action from the element, it will have had the basename
+    // prefixed to ensure non-JS scenarios work, so strip it since we'll
+    // re-prefix in the router
+    let attr = target.getAttribute("formaction") || form.getAttribute("action");
+    action = attr ? stripBasename(attr, basename) : null;
+
+    method =
+      target.getAttribute("formmethod") ||
+      form.getAttribute("method") ||
+      defaultMethod;
+    encType =
+      getFormEncType(target.getAttribute("formenctype")) ||
+      getFormEncType(form.getAttribute("enctype")) ||
+      defaultEncType;
+
+    // Build a FormData object populated from a form and submitter
+    formData = new FormData(form, target);
+
+    // If this browser doesn't support the `FormData(el, submitter)` format,
+    // then tack on the submitter value at the end.  This is a lightweight
+    // solution that is not 100% spec compliant.  For complete support in older
+    // browsers, consider using the `formdata-submitter-polyfill` package
+    if (!isFormDataSubmitterSupported()) {
+      let { name, type, value } = target;
+      if (type === "image") {
+        let prefix = name ? `${name}.` : "";
+        formData.append(`${prefix}x`, "0");
+        formData.append(`${prefix}y`, "0");
+      } else if (name) {
+        formData.append(name, value);
+      }
+    }
+  } else if (isHtmlElement(target)) {
+    throw new Error(
+      `Cannot submit element that is not <form>, <button>, or ` +
+        `<input type="submit|image">`
+    );
+  } else {
+    method = defaultMethod;
+    action = null;
+    encType = defaultEncType;
+    body = target;
+  }
+
+  // Send body for <Form encType="text/plain" so we encode it into text
+  if (formData && encType === "text/plain") {
+    body = formData;
+    formData = undefined;
+  }
+
+  return { action, method: method.toLowerCase(), encType, formData, body };
+}
diff --git a/ddb_main/node_modules/react-router-dom/index.tsx b/ddb_main/node_modules/react-router-dom/index.tsx
new file mode 100644
index 0000000..1f2e515
--- /dev/null
+++ b/ddb_main/node_modules/react-router-dom/index.tsx
@@ -0,0 +1,2029 @@
+/**
+ * NOTE: If you refactor this to split up the modules into separate files,
+ * you'll need to update the rollup config for react-router-dom-v5-compat.
+ */
+import * as React from "react";
+import * as ReactDOM from "react-dom";
+import type {
+  DataRouteObject,
+  FutureConfig,
+  Location,
+  NavigateOptions,
+  NavigationType,
+  Navigator,
+  RelativeRoutingType,
+  RouteObject,
+  RouterProviderProps,
+  To,
+} from "react-router";
+import {
+  Router,
+  createPath,
+  useHref,
+  useLocation,
+  useMatches,
+  useNavigate,
+  useNavigation,
+  useResolvedPath,
+  useBlocker,
+  UNSAFE_DataRouterContext as DataRouterContext,
+  UNSAFE_DataRouterStateContext as DataRouterStateContext,
+  UNSAFE_NavigationContext as NavigationContext,
+  UNSAFE_RouteContext as RouteContext,
+  UNSAFE_mapRouteProperties as mapRouteProperties,
+  UNSAFE_useRouteId as useRouteId,
+  UNSAFE_useRoutesImpl as useRoutesImpl,
+} from "react-router";
+import type {
+  BrowserHistory,
+  unstable_DataStrategyFunction,
+  unstable_DataStrategyFunctionArgs,
+  unstable_DataStrategyMatch,
+  Fetcher,
+  FormEncType,
+  FormMethod,
+  FutureConfig as RouterFutureConfig,
+  GetScrollRestorationKeyFunction,
+  HashHistory,
+  History,
+  HTMLFormMethod,
+  HydrationState,
+  Router as RemixRouter,
+  V7_FormMethod,
+  RouterState,
+  RouterSubscriber,
+  BlockerFunction,
+} from "@remix-run/router";
+import {
+  createRouter,
+  createBrowserHistory,
+  createHashHistory,
+  joinPaths,
+  stripBasename,
+  UNSAFE_ErrorResponseImpl as ErrorResponseImpl,
+  UNSAFE_invariant as invariant,
+  UNSAFE_warning as warning,
+  matchPath,
+  IDLE_FETCHER,
+} from "@remix-run/router";
+
+import type {
+  SubmitOptions,
+  ParamKeyValuePair,
+  URLSearchParamsInit,
+  SubmitTarget,
+} from "./dom";
+import {
+  createSearchParams,
+  defaultMethod,
+  getFormSubmissionInfo,
+  getSearchParamsForLocation,
+  shouldProcessLinkClick,
+} from "./dom";
+
+////////////////////////////////////////////////////////////////////////////////
+//#region Re-exports
+////////////////////////////////////////////////////////////////////////////////
+
+export type {
+  unstable_DataStrategyFunction,
+  unstable_DataStrategyFunctionArgs,
+  unstable_DataStrategyMatch,
+  FormEncType,
+  FormMethod,
+  GetScrollRestorationKeyFunction,
+  ParamKeyValuePair,
+  SubmitOptions,
+  URLSearchParamsInit,
+  V7_FormMethod,
+};
+export { createSearchParams, ErrorResponseImpl as UNSAFE_ErrorResponseImpl };
+
+// Note: Keep in sync with react-router exports!
+export type {
+  ActionFunction,
+  ActionFunctionArgs,
+  AwaitProps,
+  Blocker,
+  BlockerFunction,
+  DataRouteMatch,
+  DataRouteObject,
+  ErrorResponse,
+  Fetcher,
+  FutureConfig,
+  Hash,
+  IndexRouteObject,
+  IndexRouteProps,
+  JsonFunction,
+  LazyRouteFunction,
+  LayoutRouteProps,
+  LoaderFunction,
+  LoaderFunctionArgs,
+  Location,
+  MemoryRouterProps,
+  NavigateFunction,
+  NavigateOptions,
+  NavigateProps,
+  Navigation,
+  Navigator,
+  NonIndexRouteObject,
+  OutletProps,
+  Params,
+  ParamParseKey,
+  Path,
+  PathMatch,
+  Pathname,
+  PathParam,
+  PathPattern,
+  PathRouteProps,
+  RedirectFunction,
+  RelativeRoutingType,
+  RouteMatch,
+  RouteObject,
+  RouteProps,
+  RouterProps,
+  RouterProviderProps,
+  RoutesProps,
+  Search,
+  ShouldRevalidateFunction,
+  ShouldRevalidateFunctionArgs,
+  To,
+  UIMatch,
+  unstable_HandlerResult,
+} from "react-router";
+export {
+  AbortedDeferredError,
+  Await,
+  MemoryRouter,
+  Navigate,
+  NavigationType,
+  Outlet,
+  Route,
+  Router,
+  Routes,
+  createMemoryRouter,
+  createPath,
+  createRoutesFromChildren,
+  createRoutesFromElements,
+  defer,
+  isRouteErrorResponse,
+  generatePath,
+  json,
+  matchPath,
+  matchRoutes,
+  parsePath,
+  redirect,
+  redirectDocument,
+  renderMatches,
+  resolvePath,
+  useActionData,
+  useAsyncError,
+  useAsyncValue,
+  useBlocker,
+  useHref,
+  useInRouterContext,
+  useLoaderData,
+  useLocation,
+  useMatch,
+  useMatches,
+  useNavigate,
+  useNavigation,
+  useNavigationType,
+  useOutlet,
+  useOutletContext,
+  useParams,
+  useResolvedPath,
+  useRevalidator,
+  useRouteError,
+  useRouteLoaderData,
+  useRoutes,
+} from "react-router";
+
+///////////////////////////////////////////////////////////////////////////////
+// DANGER! PLEASE READ ME!
+// We provide these exports as an escape hatch in the event that you need any
+// routing data that we don't provide an explicit API for. With that said, we
+// want to cover your use case if we can, so if you feel the need to use these
+// we want to hear from you. Let us know what you're building and we'll do our
+// best to make sure we can support you!
+//
+// We consider these exports an implementation detail and do not guarantee
+// against any breaking changes, regardless of the semver release. Use with
+// extreme caution and only if you understand the consequences. Godspeed.
+///////////////////////////////////////////////////////////////////////////////
+
+/** @internal */
+export {
+  UNSAFE_DataRouterContext,
+  UNSAFE_DataRouterStateContext,
+  UNSAFE_NavigationContext,
+  UNSAFE_LocationContext,
+  UNSAFE_RouteContext,
+  UNSAFE_useRouteId,
+} from "react-router";
+//#endregion
+
+declare global {
+  var __staticRouterHydrationData: HydrationState | undefined;
+  var __reactRouterVersion: string;
+  interface Document {
+    startViewTransition(cb: () => Promise<void> | void): ViewTransition;
+  }
+}
+
+// HEY YOU! DON'T TOUCH THIS VARIABLE!
+//
+// It is replaced with the proper version at build time via a babel plugin in
+// the rollup config.
+//
+// Export a global property onto the window for React Router detection by the
+// Core Web Vitals Technology Report.  This way they can configure the `wappalyzer`
+// to detect and properly classify live websites as being built with React Router:
+// https://github.com/HTTPArchive/wappalyzer/blob/main/src/technologies/r.json
+const REACT_ROUTER_VERSION = "0";
+try {
+  window.__reactRouterVersion = REACT_ROUTER_VERSION;
+} catch (e) {
+  // no-op
+}
+
+////////////////////////////////////////////////////////////////////////////////
+//#region Routers
+////////////////////////////////////////////////////////////////////////////////
+
+interface DOMRouterOpts {
+  basename?: string;
+  future?: Partial<Omit<RouterFutureConfig, "v7_prependBasename">>;
+  hydrationData?: HydrationState;
+  unstable_dataStrategy?: unstable_DataStrategyFunction;
+  window?: Window;
+}
+
+export function createBrowserRouter(
+  routes: RouteObject[],
+  opts?: DOMRouterOpts
+): RemixRouter {
+  return createRouter({
+    basename: opts?.basename,
+    future: {
+      ...opts?.future,
+      v7_prependBasename: true,
+    },
+    history: createBrowserHistory({ window: opts?.window }),
+    hydrationData: opts?.hydrationData || parseHydrationData(),
+    routes,
+    mapRouteProperties,
+    unstable_dataStrategy: opts?.unstable_dataStrategy,
+    window: opts?.window,
+  }).initialize();
+}
+
+export function createHashRouter(
+  routes: RouteObject[],
+  opts?: DOMRouterOpts
+): RemixRouter {
+  return createRouter({
+    basename: opts?.basename,
+    future: {
+      ...opts?.future,
+      v7_prependBasename: true,
+    },
+    history: createHashHistory({ window: opts?.window }),
+    hydrationData: opts?.hydrationData || parseHydrationData(),
+    routes,
+    mapRouteProperties,
+    unstable_dataStrategy: opts?.unstable_dataStrategy,
+    window: opts?.window,
+  }).initialize();
+}
+
+function parseHydrationData(): HydrationState | undefined {
+  let state = window?.__staticRouterHydrationData;
+  if (state && state.errors) {
+    state = {
+      ...state,
+      errors: deserializeErrors(state.errors),
+    };
+  }
+  return state;
+}
+
+function deserializeErrors(
+  errors: RemixRouter["state"]["errors"]
+): RemixRouter["state"]["errors"] {
+  if (!errors) return null;
+  let entries = Object.entries(errors);
+  let serialized: RemixRouter["state"]["errors"] = {};
+  for (let [key, val] of entries) {
+    // Hey you!  If you change this, please change the corresponding logic in
+    // serializeErrors in react-router-dom/server.tsx :)
+    if (val && val.__type === "RouteErrorResponse") {
+      serialized[key] = new ErrorResponseImpl(
+        val.status,
+        val.statusText,
+        val.data,
+        val.internal === true
+      );
+    } else if (val && val.__type === "Error") {
+      // Attempt to reconstruct the right type of Error (i.e., ReferenceError)
+      if (val.__subType) {
+        let ErrorConstructor = window[val.__subType];
+        if (typeof ErrorConstructor === "function") {
+          try {
+            // @ts-expect-error
+            let error = new ErrorConstructor(val.message);
+            // Wipe away the client-side stack trace.  Nothing to fill it in with
+            // because we don't serialize SSR stack traces for security reasons
+            error.stack = "";
+            serialized[key] = error;
+          } catch (e) {
+            // no-op - fall through and create a normal Error
+          }
+        }
+      }
+
+      if (serialized[key] == null) {
+        let error = new Error(val.message);
+        // Wipe away the client-side stack trace.  Nothing to fill it in with
+        // because we don't serialize SSR stack traces for security reasons
+        error.stack = "";
+        serialized[key] = error;
+      }
+    } else {
+      serialized[key] = val;
+    }
+  }
+  return serialized;
+}
+
+//#endregion
+
+////////////////////////////////////////////////////////////////////////////////
+//#region Contexts
+////////////////////////////////////////////////////////////////////////////////
+
+type ViewTransitionContextObject =
+  | {
+      isTransitioning: false;
+    }
+  | {
+      isTransitioning: true;
+      flushSync: boolean;
+      currentLocation: Location;
+      nextLocation: Location;
+    };
+
+const ViewTransitionContext = React.createContext<ViewTransitionContextObject>({
+  isTransitioning: false,
+});
+if (__DEV__) {
+  ViewTransitionContext.displayName = "ViewTransition";
+}
+
+export { ViewTransitionContext as UNSAFE_ViewTransitionContext };
+
+// TODO: (v7) Change the useFetcher data from `any` to `unknown`
+type FetchersContextObject = Map<string, any>;
+
+const FetchersContext = React.createContext<FetchersContextObject>(new Map());
+if (__DEV__) {
+  FetchersContext.displayName = "Fetchers";
+}
+
+export { FetchersContext as UNSAFE_FetchersContext };
+
+//#endregion
+
+////////////////////////////////////////////////////////////////////////////////
+//#region Components
+////////////////////////////////////////////////////////////////////////////////
+
+/**
+  Webpack + React 17 fails to compile on any of the following because webpack
+  complains that `startTransition` doesn't exist in `React`:
+  * import { startTransition } from "react"
+  * import * as React from from "react";
+    "startTransition" in React ? React.startTransition(() => setState()) : setState()
+  * import * as React from from "react";
+    "startTransition" in React ? React["startTransition"](() => setState()) : setState()
+
+  Moving it to a constant such as the following solves the Webpack/React 17 issue:
+  * import * as React from from "react";
+    const START_TRANSITION = "startTransition";
+    START_TRANSITION in React ? React[START_TRANSITION](() => setState()) : setState()
+
+  However, that introduces webpack/terser minification issues in production builds
+  in React 18 where minification/obfuscation ends up removing the call of
+  React.startTransition entirely from the first half of the ternary.  Grabbing
+  this exported reference once up front resolves that issue.
+
+  See https://github.com/remix-run/react-router/issues/10579
+*/
+const START_TRANSITION = "startTransition";
+const startTransitionImpl = React[START_TRANSITION];
+const FLUSH_SYNC = "flushSync";
+const flushSyncImpl = ReactDOM[FLUSH_SYNC];
+const USE_ID = "useId";
+const useIdImpl = React[USE_ID];
+
+function startTransitionSafe(cb: () => void) {
+  if (startTransitionImpl) {
+    startTransitionImpl(cb);
+  } else {
+    cb();
+  }
+}
+
+function flushSyncSafe(cb: () => void) {
+  if (flushSyncImpl) {
+    flushSyncImpl(cb);
+  } else {
+    cb();
+  }
+}
+
+interface ViewTransition {
+  finished: Promise<void>;
+  ready: Promise<void>;
+  updateCallbackDone: Promise<void>;
+  skipTransition(): void;
+}
+
+class Deferred<T> {
+  status: "pending" | "resolved" | "rejected" = "pending";
+  promise: Promise<T>;
+  // @ts-expect-error - no initializer
+  resolve: (value: T) => void;
+  // @ts-expect-error - no initializer
+  reject: (reason?: unknown) => void;
+  constructor() {
+    this.promise = new Promise((resolve, reject) => {
+      this.resolve = (value) => {
+        if (this.status === "pending") {
+          this.status = "resolved";
+          resolve(value);
+        }
+      };
+      this.reject = (reason) => {
+        if (this.status === "pending") {
+          this.status = "rejected";
+          reject(reason);
+        }
+      };
+    });
+  }
+}
+
+/**
+ * Given a Remix Router instance, render the appropriate UI
+ */
+export function RouterProvider({
+  fallbackElement,
+  router,
+  future,
+}: RouterProviderProps): React.ReactElement {
+  let [state, setStateImpl] = React.useState(router.state);
+  let [pendingState, setPendingState] = React.useState<RouterState>();
+  let [vtContext, setVtContext] = React.useState<ViewTransitionContextObject>({
+    isTransitioning: false,
+  });
+  let [renderDfd, setRenderDfd] = React.useState<Deferred<void>>();
+  let [transition, setTransition] = React.useState<ViewTransition>();
+  let [interruption, setInterruption] = React.useState<{
+    state: RouterState;
+    currentLocation: Location;
+    nextLocation: Location;
+  }>();
+  let fetcherData = React.useRef<Map<string, any>>(new Map());
+  let { v7_startTransition } = future || {};
+
+  let optInStartTransition = React.useCallback(
+    (cb: () => void) => {
+      if (v7_startTransition) {
+        startTransitionSafe(cb);
+      } else {
+        cb();
+      }
+    },
+    [v7_startTransition]
+  );
+
+  let setState = React.useCallback<RouterSubscriber>(
+    (
+      newState: RouterState,
+      {
+        deletedFetchers,
+        unstable_flushSync: flushSync,
+        unstable_viewTransitionOpts: viewTransitionOpts,
+      }
+    ) => {
+      deletedFetchers.forEach((key) => fetcherData.current.delete(key));
+      newState.fetchers.forEach((fetcher, key) => {
+        if (fetcher.data !== undefined) {
+          fetcherData.current.set(key, fetcher.data);
+        }
+      });
+
+      let isViewTransitionUnavailable =
+        router.window == null ||
+        router.window.document == null ||
+        typeof router.window.document.startViewTransition !== "function";
+
+      // If this isn't a view transition or it's not available in this browser,
+      // just update and be done with it
+      if (!viewTransitionOpts || isViewTransitionUnavailable) {
+        if (flushSync) {
+          flushSyncSafe(() => setStateImpl(newState));
+        } else {
+          optInStartTransition(() => setStateImpl(newState));
+        }
+        return;
+      }
+
+      // flushSync + startViewTransition
+      if (flushSync) {
+        // Flush through the context to mark DOM elements as transition=ing
+        flushSyncSafe(() => {
+          // Cancel any pending transitions
+          if (transition) {
+            renderDfd && renderDfd.resolve();
+            transition.skipTransition();
+          }
+          setVtContext({
+            isTransitioning: true,
+            flushSync: true,
+            currentLocation: viewTransitionOpts.currentLocation,
+            nextLocation: viewTransitionOpts.nextLocation,
+          });
+        });
+
+        // Update the DOM
+        let t = router.window!.document.startViewTransition(() => {
+          flushSyncSafe(() => setStateImpl(newState));
+        });
+
+        // Clean up after the animation completes
+        t.finished.finally(() => {
+          flushSyncSafe(() => {
+            setRenderDfd(undefined);
+            setTransition(undefined);
+            setPendingState(undefined);
+            setVtContext({ isTransitioning: false });
+          });
+        });
+
+        flushSyncSafe(() => setTransition(t));
+        return;
+      }
+
+      // startTransition + startViewTransition
+      if (transition) {
+        // Interrupting an in-progress transition, cancel and let everything flush
+        // out, and then kick off a new transition from the interruption state
+        renderDfd && renderDfd.resolve();
+        transition.skipTransition();
+        setInterruption({
+          state: newState,
+          currentLocation: viewTransitionOpts.currentLocation,
+          nextLocation: viewTransitionOpts.nextLocation,
+        });
+      } else {
+        // Completed navigation update with opted-in view transitions, let 'er rip
+        setPendingState(newState);
+        setVtContext({
+          isTransitioning: true,
+          flushSync: false,
+          currentLocation: viewTransitionOpts.currentLocation,
+          nextLocation: viewTransitionOpts.nextLocation,
+        });
+      }
+    },
+    [router.window, transition, renderDfd, fetcherData, optInStartTransition]
+  );
+
+  // Need to use a layout effect here so we are subscribed early enough to
+  // pick up on any render-driven redirects/navigations (useEffect/<Navigate>)
+  React.useLayoutEffect(() => router.subscribe(setState), [router, setState]);
+
+  // When we start a view transition, create a Deferred we can use for the
+  // eventual "completed" render
+  React.useEffect(() => {
+    if (vtContext.isTransitioning && !vtContext.flushSync) {
+      setRenderDfd(new Deferred<void>());
+    }
+  }, [vtContext]);
+
+  // Once the deferred is created, kick off startViewTransition() to update the
+  // DOM and then wait on the Deferred to resolve (indicating the DOM update has
+  // happened)
+  React.useEffect(() => {
+    if (renderDfd && pendingState && router.window) {
+      let newState = pendingState;
+      let renderPromise = renderDfd.promise;
+      let transition = router.window.document.startViewTransition(async () => {
+        optInStartTransition(() => setStateImpl(newState));
+        await renderPromise;
+      });
+      transition.finished.finally(() => {
+        setRenderDfd(undefined);
+        setTransition(undefined);
+        setPendingState(undefined);
+        setVtContext({ isTransitioning: false });
+      });
+      setTransition(transition);
+    }
+  }, [optInStartTransition, pendingState, renderDfd, router.window]);
+
+  // When the new location finally renders and is committed to the DOM, this
+  // effect will run to resolve the transition
+  React.useEffect(() => {
+    if (
+      renderDfd &&
+      pendingState &&
+      state.location.key === pendingState.location.key
+    ) {
+      renderDfd.resolve();
+    }
+  }, [renderDfd, transition, state.location, pendingState]);
+
+  // If we get interrupted with a new navigation during a transition, we skip
+  // the active transition, let it cleanup, then kick it off again here
+  React.useEffect(() => {
+    if (!vtContext.isTransitioning && interruption) {
+      setPendingState(interruption.state);
+      setVtContext({
+        isTransitioning: true,
+        flushSync: false,
+        currentLocation: interruption.currentLocation,
+        nextLocation: interruption.nextLocation,
+      });
+      setInterruption(undefined);
+    }
+  }, [vtContext.isTransitioning, interruption]);
+
+  React.useEffect(() => {
+    warning(
+      fallbackElement == null || !router.future.v7_partialHydration,
+      "`<RouterProvider fallbackElement>` is deprecated when using " +
+        "`v7_partialHydration`, use a `HydrateFallback` component instead"
+    );
+    // Only log this once on initial mount
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  let navigator = React.useMemo((): Navigator => {
+    return {
+      createHref: router.createHref,
+      encodeLocation: router.encodeLocation,
+      go: (n) => router.navigate(n),
+      push: (to, state, opts) =>
+        router.navigate(to, {
+          state,
+          preventScrollReset: opts?.preventScrollReset,
+        }),
+      replace: (to, state, opts) =>
+        router.navigate(to, {
+          replace: true,
+          state,
+          preventScrollReset: opts?.preventScrollReset,
+        }),
+    };
+  }, [router]);
+
+  let basename = router.basename || "/";
+
+  let dataRouterContext = React.useMemo(
+    () => ({
+      router,
+      navigator,
+      static: false,
+      basename,
+    }),
+    [router, navigator, basename]
+  );
+
+  // The fragment and {null} here are important!  We need them to keep React 18's
+  // useId happy when we are server-rendering since we may have a <script> here
+  // containing the hydrated server-side staticContext (from StaticRouterProvider).
+  // useId relies on the component tree structure to generate deterministic id's
+  // so we need to ensure it remains the same on the client even though
+  // we don't need the <script> tag
+  return (
+    <>
+      <DataRouterContext.Provider value={dataRouterContext}>
+        <DataRouterStateContext.Provider value={state}>
+          <FetchersContext.Provider value={fetcherData.current}>
+            <ViewTransitionContext.Provider value={vtContext}>
+              <Router
+                basename={basename}
+                location={state.location}
+                navigationType={state.historyAction}
+                navigator={navigator}
+                future={{
+                  v7_relativeSplatPath: router.future.v7_relativeSplatPath,
+                }}
+              >
+                {state.initialized || router.future.v7_partialHydration ? (
+                  <DataRoutes
+                    routes={router.routes}
+                    future={router.future}
+                    state={state}
+                  />
+                ) : (
+                  fallbackElement
+                )}
+              </Router>
+            </ViewTransitionContext.Provider>
+          </FetchersContext.Provider>
+        </DataRouterStateContext.Provider>
+      </DataRouterContext.Provider>
+      {null}
+    </>
+  );
+}
+
+function DataRoutes({
+  routes,
+  future,
+  state,
+}: {
+  routes: DataRouteObject[];
+  future: RemixRouter["future"];
+  state: RouterState;
+}): React.ReactElement | null {
+  return useRoutesImpl(routes, undefined, state, future);
+}
+
+export interface BrowserRouterProps {
+  basename?: string;
+  children?: React.ReactNode;
+  future?: Partial<FutureConfig>;
+  window?: Window;
+}
+
+/**
+ * A `<Router>` for use in web browsers. Provides the cleanest URLs.
+ */
+export function BrowserRouter({
+  basename,
+  children,
+  future,
+  window,
+}: BrowserRouterProps) {
+  let historyRef = React.useRef<BrowserHistory>();
+  if (historyRef.current == null) {
+    historyRef.current = createBrowserHistory({ window, v5Compat: true });
+  }
+
+  let history = historyRef.current;
+  let [state, setStateImpl] = React.useState({
+    action: history.action,
+    location: history.location,
+  });
+  let { v7_startTransition } = future || {};
+  let setState = React.useCallback(
+    (newState: { action: NavigationType; location: Location }) => {
+      v7_startTransition && startTransitionImpl
+        ? startTransitionImpl(() => setStateImpl(newState))
+        : setStateImpl(newState);
+    },
+    [setStateImpl, v7_startTransition]
+  );
+
+  React.useLayoutEffect(() => history.listen(setState), [history, setState]);
+
+  return (
+    <Router
+      basename={basename}
+      children={children}
+      location={state.location}
+      navigationType={state.action}
+      navigator={history}
+      future={future}
+    />
+  );
+}
+
+export interface HashRouterProps {
+  basename?: string;
+  children?: React.ReactNode;
+  future?: Partial<FutureConfig>;
+  window?: Window;
+}
+
+/**
+ * A `<Router>` for use in web browsers. Stores the location in the hash
+ * portion of the URL so it is not sent to the server.
+ */
+export function HashRouter({
+  basename,
+  children,
+  future,
+  window,
+}: HashRouterProps) {
+  let historyRef = React.useRef<HashHistory>();
+  if (historyRef.current == null) {
+    historyRef.current = createHashHistory({ window, v5Compat: true });
+  }
+
+  let history = historyRef.current;
+  let [state, setStateImpl] = React.useState({
+    action: history.action,
+    location: history.location,
+  });
+  let { v7_startTransition } = future || {};
+  let setState = React.useCallback(
+    (newState: { action: NavigationType; location: Location }) => {
+      v7_startTransition && startTransitionImpl
+        ? startTransitionImpl(() => setStateImpl(newState))
+        : setStateImpl(newState);
+    },
+    [setStateImpl, v7_startTransition]
+  );
+
+  React.useLayoutEffect(() => history.listen(setState), [history, setState]);
+
+  return (
+    <Router
+      basename={basename}
+      children={children}
+      location={state.location}
+      navigationType={state.action}
+      navigator={history}
+      future={future}
+    />
+  );
+}
+
+export interface HistoryRouterProps {
+  basename?: string;
+  children?: React.ReactNode;
+  future?: FutureConfig;
+  history: History;
+}
+
+/**
+ * A `<Router>` that accepts a pre-instantiated history object. It's important
+ * to note that using your own history object is highly discouraged and may add
+ * two versions of the history library to your bundles unless you use the same
+ * version of the history library that React Router uses internally.
+ */
+function HistoryRouter({
+  basename,
+  children,
+  future,
+  history,
+}: HistoryRouterProps) {
+  let [state, setStateImpl] = React.useState({
+    action: history.action,
+    location: history.location,
+  });
+  let { v7_startTransition } = future || {};
+  let setState = React.useCallback(
+    (newState: { action: NavigationType; location: Location }) => {
+      v7_startTransition && startTransitionImpl
+        ? startTransitionImpl(() => setStateImpl(newState))
+        : setStateImpl(newState);
+    },
+    [setStateImpl, v7_startTransition]
+  );
+
+  React.useLayoutEffect(() => history.listen(setState), [history, setState]);
+
+  return (
+    <Router
+      basename={basename}
+      children={children}
+      location={state.location}
+      navigationType={state.action}
+      navigator={history}
+      future={future}
+    />
+  );
+}
+
+if (__DEV__) {
+  HistoryRouter.displayName = "unstable_HistoryRouter";
+}
+
+export { HistoryRouter as unstable_HistoryRouter };
+
+export interface LinkProps
+  extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, "href"> {
+  reloadDocument?: boolean;
+  replace?: boolean;
+  state?: any;
+  preventScrollReset?: boolean;
+  relative?: RelativeRoutingType;
+  to: To;
+  unstable_viewTransition?: boolean;
+}
+
+const isBrowser =
+  typeof window !== "undefined" &&
+  typeof window.document !== "undefined" &&
+  typeof window.document.createElement !== "undefined";
+
+const ABSOLUTE_URL_REGEX = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i;
+
+/**
+ * The public API for rendering a history-aware `<a>`.
+ */
+export const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(
+  function LinkWithRef(
+    {
+      onClick,
+      relative,
+      reloadDocument,
+      replace,
+      state,
+      target,
+      to,
+      preventScrollReset,
+      unstable_viewTransition,
+      ...rest
+    },
+    ref
+  ) {
+    let { basename } = React.useContext(NavigationContext);
+
+    // Rendered into <a href> for absolute URLs
+    let absoluteHref;
+    let isExternal = false;
+
+    if (typeof to === "string" && ABSOLUTE_URL_REGEX.test(to)) {
+      // Render the absolute href server- and client-side
+      absoluteHref = to;
+
+      // Only check for external origins client-side
+      if (isBrowser) {
+        try {
+          let currentUrl = new URL(window.location.href);
+          let targetUrl = to.startsWith("//")
+            ? new URL(currentUrl.protocol + to)
+            : new URL(to);
+          let path = stripBasename(targetUrl.pathname, basename);
+
+          if (targetUrl.origin === currentUrl.origin && path != null) {
+            // Strip the protocol/origin/basename for same-origin absolute URLs
+            to = path + targetUrl.search + targetUrl.hash;
+          } else {
+            isExternal = true;
+          }
+        } catch (e) {
+          // We can't do external URL detection without a valid URL
+          warning(
+            false,
+            `<Link to="${to}"> contains an invalid URL which will probably break ` +
+              `when clicked - please update to a valid URL path.`
+          );
+        }
+      }
+    }
+
+    // Rendered into <a href> for relative URLs
+    let href = useHref(to, { relative });
+
+    let internalOnClick = useLinkClickHandler(to, {
+      replace,
+      state,
+      target,
+      preventScrollReset,
+      relative,
+      unstable_viewTransition,
+    });
+    function handleClick(
+      event: React.MouseEvent<HTMLAnchorElement, MouseEvent>
+    ) {
+      if (onClick) onClick(event);
+      if (!event.defaultPrevented) {
+        internalOnClick(event);
+      }
+    }
+
+    return (
+      // eslint-disable-next-line jsx-a11y/anchor-has-content
+      <a
+        {...rest}
+        href={absoluteHref || href}
+        onClick={isExternal || reloadDocument ? onClick : handleClick}
+        ref={ref}
+        target={target}
+      />
+    );
+  }
+);
+
+if (__DEV__) {
+  Link.displayName = "Link";
+}
+
+type NavLinkRenderProps = {
+  isActive: boolean;
+  isPending: boolean;
+  isTransitioning: boolean;
+};
+
+export interface NavLinkProps
+  extends Omit<LinkProps, "className" | "style" | "children"> {
+  children?: React.ReactNode | ((props: NavLinkRenderProps) => React.ReactNode);
+  caseSensitive?: boolean;
+  className?: string | ((props: NavLinkRenderProps) => string | undefined);
+  end?: boolean;
+  style?:
+    | React.CSSProperties
+    | ((props: NavLinkRenderProps) => React.CSSProperties | undefined);
+}
+
+/**
+ * A `<Link>` wrapper that knows if it's "active" or not.
+ */
+export const NavLink = React.forwardRef<HTMLAnchorElement, NavLinkProps>(
+  function NavLinkWithRef(
+    {
+      "aria-current": ariaCurrentProp = "page",
+      caseSensitive = false,
+      className: classNameProp = "",
+      end = false,
+      style: styleProp,
+      to,
+      unstable_viewTransition,
+      children,
+      ...rest
+    },
+    ref
+  ) {
+    let path = useResolvedPath(to, { relative: rest.relative });
+    let location = useLocation();
+    let routerState = React.useContext(DataRouterStateContext);
+    let { navigator, basename } = React.useContext(NavigationContext);
+    let isTransitioning =
+      routerState != null &&
+      // Conditional usage is OK here because the usage of a data router is static
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      useViewTransitionState(path) &&
+      unstable_viewTransition === true;
+
+    let toPathname = navigator.encodeLocation
+      ? navigator.encodeLocation(path).pathname
+      : path.pathname;
+    let locationPathname = location.pathname;
+    let nextLocationPathname =
+      routerState && routerState.navigation && routerState.navigation.location
+        ? routerState.navigation.location.pathname
+        : null;
+
+    if (!caseSensitive) {
+      locationPathname = locationPathname.toLowerCase();
+      nextLocationPathname = nextLocationPathname
+        ? nextLocationPathname.toLowerCase()
+        : null;
+      toPathname = toPathname.toLowerCase();
+    }
+
+    if (nextLocationPathname && basename) {
+      nextLocationPathname =
+        stripBasename(nextLocationPathname, basename) || nextLocationPathname;
+    }
+
+    // If the `to` has a trailing slash, look at that exact spot.  Otherwise,
+    // we're looking for a slash _after_ what's in `to`.  For example:
+    //
+    // <NavLink to="/users"> and <NavLink to="/users/">
+    // both want to look for a / at index 6 to match URL `/users/matt`
+    const endSlashPosition =
+      toPathname !== "/" && toPathname.endsWith("/")
+        ? toPathname.length - 1
+        : toPathname.length;
+    let isActive =
+      locationPathname === toPathname ||
+      (!end &&
+        locationPathname.startsWith(toPathname) &&
+        locationPathname.charAt(endSlashPosition) === "/");
+
+    let isPending =
+      nextLocationPathname != null &&
+      (nextLocationPathname === toPathname ||
+        (!end &&
+          nextLocationPathname.startsWith(toPathname) &&
+          nextLocationPathname.charAt(toPathname.length) === "/"));
+
+    let renderProps = {
+      isActive,
+      isPending,
+      isTransitioning,
+    };
+
+    let ariaCurrent = isActive ? ariaCurrentProp : undefined;
+
+    let className: string | undefined;
+    if (typeof classNameProp === "function") {
+      className = classNameProp(renderProps);
+    } else {
+      // If the className prop is not a function, we use a default `active`
+      // class for <NavLink />s that are active. In v5 `active` was the default
+      // value for `activeClassName`, but we are removing that API and can still
+      // use the old default behavior for a cleaner upgrade path and keep the
+      // simple styling rules working as they currently do.
+      className = [
+        classNameProp,
+        isActive ? "active" : null,
+        isPending ? "pending" : null,
+        isTransitioning ? "transitioning" : null,
+      ]
+        .filter(Boolean)
+        .join(" ");
+    }
+
+    let style =
+      typeof styleProp === "function" ? styleProp(renderProps) : styleProp;
+
+    return (
+      <Link
+        {...rest}
+        aria-current={ariaCurrent}
+        className={className}
+        ref={ref}
+        style={style}
+        to={to}
+        unstable_viewTransition={unstable_viewTransition}
+      >
+        {typeof children === "function" ? children(renderProps) : children}
+      </Link>
+    );
+  }
+);
+
+if (__DEV__) {
+  NavLink.displayName = "NavLink";
+}
+
+export interface FetcherFormProps
+  extends React.FormHTMLAttributes<HTMLFormElement> {
+  /**
+   * The HTTP verb to use when the form is submit. Supports "get", "post",
+   * "put", "delete", "patch".
+   */
+  method?: HTMLFormMethod;
+
+  /**
+   * `<form encType>` - enhancing beyond the normal string type and limiting
+   * to the built-in browser supported values
+   */
+  encType?:
+    | "application/x-www-form-urlencoded"
+    | "multipart/form-data"
+    | "text/plain";
+
+  /**
+   * Normal `<form action>` but supports React Router's relative paths.
+   */
+  action?: string;
+
+  /**
+   * Determines whether the form action is relative to the route hierarchy or
+   * the pathname.  Use this if you want to opt out of navigating the route
+   * hierarchy and want to instead route based on /-delimited URL segments
+   */
+  relative?: RelativeRoutingType;
+
+  /**
+   * Prevent the scroll position from resetting to the top of the viewport on
+   * completion of the navigation when using the <ScrollRestoration> component
+   */
+  preventScrollReset?: boolean;
+
+  /**
+   * A function to call when the form is submitted. If you call
+   * `event.preventDefault()` then this form will not do anything.
+   */
+  onSubmit?: React.FormEventHandler<HTMLFormElement>;
+}
+
+export interface FormProps extends FetcherFormProps {
+  /**
+   * Indicate a specific fetcherKey to use when using navigate=false
+   */
+  fetcherKey?: string;
+
+  /**
+   * navigate=false will use a fetcher instead of a navigation
+   */
+  navigate?: boolean;
+
+  /**
+   * Forces a full document navigation instead of a fetch.
+   */
+  reloadDocument?: boolean;
+
+  /**
+   * Replaces the current entry in the browser history stack when the form
+   * navigates. Use this if you don't want the user to be able to click "back"
+   * to the page with the form on it.
+   */
+  replace?: boolean;
+
+  /**
+   * State object to add to the history stack entry for this navigation
+   */
+  state?: any;
+
+  /**
+   * Enable view transitions on this Form navigation
+   */
+  unstable_viewTransition?: boolean;
+}
+
+type HTMLSubmitEvent = React.BaseSyntheticEvent<
+  SubmitEvent,
+  Event,
+  HTMLFormElement
+>;
+
+type HTMLFormSubmitter = HTMLButtonElement | HTMLInputElement;
+
+/**
+ * A `@remix-run/router`-aware `<form>`. It behaves like a normal form except
+ * that the interaction with the server is with `fetch` instead of new document
+ * requests, allowing components to add nicer UX to the page as the form is
+ * submitted and returns with data.
+ */
+export const Form = React.forwardRef<HTMLFormElement, FormProps>(
+  (
+    {
+      fetcherKey,
+      navigate,
+      reloadDocument,
+      replace,
+      state,
+      method = defaultMethod,
+      action,
+      onSubmit,
+      relative,
+      preventScrollReset,
+      unstable_viewTransition,
+      ...props
+    },
+    forwardedRef
+  ) => {
+    let submit = useSubmit();
+    let formAction = useFormAction(action, { relative });
+    let formMethod: HTMLFormMethod =
+      method.toLowerCase() === "get" ? "get" : "post";
+
+    let submitHandler: React.FormEventHandler<HTMLFormElement> = (event) => {
+      onSubmit && onSubmit(event);
+      if (event.defaultPrevented) return;
+      event.preventDefault();
+
+      let submitter = (event as unknown as HTMLSubmitEvent).nativeEvent
+        .submitter as HTMLFormSubmitter | null;
+
+      let submitMethod =
+        (submitter?.getAttribute("formmethod") as HTMLFormMethod | undefined) ||
+        method;
+
+      submit(submitter || event.currentTarget, {
+        fetcherKey,
+        method: submitMethod,
+        navigate,
+        replace,
+        state,
+        relative,
+        preventScrollReset,
+        unstable_viewTransition,
+      });
+    };
+
+    return (
+      <form
+        ref={forwardedRef}
+        method={formMethod}
+        action={formAction}
+        onSubmit={reloadDocument ? onSubmit : submitHandler}
+        {...props}
+      />
+    );
+  }
+);
+
+if (__DEV__) {
+  Form.displayName = "Form";
+}
+
+export interface ScrollRestorationProps {
+  getKey?: GetScrollRestorationKeyFunction;
+  storageKey?: string;
+}
+
+/**
+ * This component will emulate the browser's scroll restoration on location
+ * changes.
+ */
+export function ScrollRestoration({
+  getKey,
+  storageKey,
+}: ScrollRestorationProps) {
+  useScrollRestoration({ getKey, storageKey });
+  return null;
+}
+
+if (__DEV__) {
+  ScrollRestoration.displayName = "ScrollRestoration";
+}
+//#endregion
+
+////////////////////////////////////////////////////////////////////////////////
+//#region Hooks
+////////////////////////////////////////////////////////////////////////////////
+
+enum DataRouterHook {
+  UseScrollRestoration = "useScrollRestoration",
+  UseSubmit = "useSubmit",
+  UseSubmitFetcher = "useSubmitFetcher",
+  UseFetcher = "useFetcher",
+  useViewTransitionState = "useViewTransitionState",
+}
+
+enum DataRouterStateHook {
+  UseFetcher = "useFetcher",
+  UseFetchers = "useFetchers",
+  UseScrollRestoration = "useScrollRestoration",
+}
+
+// Internal hooks
+
+function getDataRouterConsoleError(
+  hookName: DataRouterHook | DataRouterStateHook
+) {
+  return `${hookName} must be used within a data router.  See https://reactrouter.com/routers/picking-a-router.`;
+}
+
+function useDataRouterContext(hookName: DataRouterHook) {
+  let ctx = React.useContext(DataRouterContext);
+  invariant(ctx, getDataRouterConsoleError(hookName));
+  return ctx;
+}
+
+function useDataRouterState(hookName: DataRouterStateHook) {
+  let state = React.useContext(DataRouterStateContext);
+  invariant(state, getDataRouterConsoleError(hookName));
+  return state;
+}
+
+// External hooks
+
+/**
+ * Handles the click behavior for router `<Link>` components. This is useful if
+ * you need to create custom `<Link>` components with the same click behavior we
+ * use in our exported `<Link>`.
+ */
+export function useLinkClickHandler<E extends Element = HTMLAnchorElement>(
+  to: To,
+  {
+    target,
+    replace: replaceProp,
+    state,
+    preventScrollReset,
+    relative,
+    unstable_viewTransition,
+  }: {
+    target?: React.HTMLAttributeAnchorTarget;
+    replace?: boolean;
+    state?: any;
+    preventScrollReset?: boolean;
+    relative?: RelativeRoutingType;
+    unstable_viewTransition?: boolean;
+  } = {}
+): (event: React.MouseEvent<E, MouseEvent>) => void {
+  let navigate = useNavigate();
+  let location = useLocation();
+  let path = useResolvedPath(to, { relative });
+
+  return React.useCallback(
+    (event: React.MouseEvent<E, MouseEvent>) => {
+      if (shouldProcessLinkClick(event, target)) {
+        event.preventDefault();
+
+        // If the URL hasn't changed, a regular <a> will do a replace instead of
+        // a push, so do the same here unless the replace prop is explicitly set
+        let replace =
+          replaceProp !== undefined
+            ? replaceProp
+            : createPath(location) === createPath(path);
+
+        navigate(to, {
+          replace,
+          state,
+          preventScrollReset,
+          relative,
+          unstable_viewTransition,
+        });
+      }
+    },
+    [
+      location,
+      navigate,
+      path,
+      replaceProp,
+      state,
+      target,
+      to,
+      preventScrollReset,
+      relative,
+      unstable_viewTransition,
+    ]
+  );
+}
+
+/**
+ * A convenient wrapper for reading and writing search parameters via the
+ * URLSearchParams interface.
+ */
+export function useSearchParams(
+  defaultInit?: URLSearchParamsInit
+): [URLSearchParams, SetURLSearchParams] {
+  warning(
+    typeof URLSearchParams !== "undefined",
+    `You cannot use the \`useSearchParams\` hook in a browser that does not ` +
+      `support the URLSearchParams API. If you need to support Internet ` +
+      `Explorer 11, we recommend you load a polyfill such as ` +
+      `https://github.com/ungap/url-search-params\n\n` +
+      `If you're unsure how to load polyfills, we recommend you check out ` +
+      `https://polyfill.io/v3/ which provides some recommendations about how ` +
+      `to load polyfills only for users that need them, instead of for every ` +
+      `user.`
+  );
+
+  let defaultSearchParamsRef = React.useRef(createSearchParams(defaultInit));
+  let hasSetSearchParamsRef = React.useRef(false);
+
+  let location = useLocation();
+  let searchParams = React.useMemo(
+    () =>
+      // Only merge in the defaults if we haven't yet called setSearchParams.
+      // Once we call that we want those to take precedence, otherwise you can't
+      // remove a param with setSearchParams({}) if it has an initial value
+      getSearchParamsForLocation(
+        location.search,
+        hasSetSearchParamsRef.current ? null : defaultSearchParamsRef.current
+      ),
+    [location.search]
+  );
+
+  let navigate = useNavigate();
+  let setSearchParams = React.useCallback<SetURLSearchParams>(
+    (nextInit, navigateOptions) => {
+      const newSearchParams = createSearchParams(
+        typeof nextInit === "function" ? nextInit(searchParams) : nextInit
+      );
+      hasSetSearchParamsRef.current = true;
+      navigate("?" + newSearchParams, navigateOptions);
+    },
+    [navigate, searchParams]
+  );
+
+  return [searchParams, setSearchParams];
+}
+
+export type SetURLSearchParams = (
+  nextInit?:
+    | URLSearchParamsInit
+    | ((prev: URLSearchParams) => URLSearchParamsInit),
+  navigateOpts?: NavigateOptions
+) => void;
+
+/**
+ * Submits a HTML `<form>` to the server without reloading the page.
+ */
+export interface SubmitFunction {
+  (
+    /**
+     * Specifies the `<form>` to be submitted to the server, a specific
+     * `<button>` or `<input type="submit">` to use to submit the form, or some
+     * arbitrary data to submit.
+     *
+     * Note: When using a `<button>` its `name` and `value` will also be
+     * included in the form data that is submitted.
+     */
+    target: SubmitTarget,
+
+    /**
+     * Options that override the `<form>`'s own attributes. Required when
+     * submitting arbitrary data without a backing `<form>`.
+     */
+    options?: SubmitOptions
+  ): void;
+}
+
+/**
+ * Submits a fetcher `<form>` to the server without reloading the page.
+ */
+export interface FetcherSubmitFunction {
+  (
+    target: SubmitTarget,
+    // Fetchers cannot replace or set state because they are not navigation events
+    options?: Omit<SubmitOptions, "replace" | "state">
+  ): void;
+}
+
+function validateClientSideSubmission() {
+  if (typeof document === "undefined") {
+    throw new Error(
+      "You are calling submit during the server render. " +
+        "Try calling submit within a `useEffect` or callback instead."
+    );
+  }
+}
+
+let fetcherId = 0;
+let getUniqueFetcherId = () => `__${String(++fetcherId)}__`;
+
+/**
+ * Returns a function that may be used to programmatically submit a form (or
+ * some arbitrary data) to the server.
+ */
+export function useSubmit(): SubmitFunction {
+  let { router } = useDataRouterContext(DataRouterHook.UseSubmit);
+  let { basename } = React.useContext(NavigationContext);
+  let currentRouteId = useRouteId();
+
+  return React.useCallback<SubmitFunction>(
+    (target, options = {}) => {
+      validateClientSideSubmission();
+
+      let { action, method, encType, formData, body } = getFormSubmissionInfo(
+        target,
+        basename
+      );
+
+      if (options.navigate === false) {
+        let key = options.fetcherKey || getUniqueFetcherId();
+        router.fetch(key, currentRouteId, options.action || action, {
+          preventScrollReset: options.preventScrollReset,
+          formData,
+          body,
+          formMethod: options.method || (method as HTMLFormMethod),
+          formEncType: options.encType || (encType as FormEncType),
+          unstable_flushSync: options.unstable_flushSync,
+        });
+      } else {
+        router.navigate(options.action || action, {
+          preventScrollReset: options.preventScrollReset,
+          formData,
+          body,
+          formMethod: options.method || (method as HTMLFormMethod),
+          formEncType: options.encType || (encType as FormEncType),
+          replace: options.replace,
+          state: options.state,
+          fromRouteId: currentRouteId,
+          unstable_flushSync: options.unstable_flushSync,
+          unstable_viewTransition: options.unstable_viewTransition,
+        });
+      }
+    },
+    [router, basename, currentRouteId]
+  );
+}
+
+// v7: Eventually we should deprecate this entirely in favor of using the
+// router method directly?
+export function useFormAction(
+  action?: string,
+  { relative }: { relative?: RelativeRoutingType } = {}
+): string {
+  let { basename } = React.useContext(NavigationContext);
+  let routeContext = React.useContext(RouteContext);
+  invariant(routeContext, "useFormAction must be used inside a RouteContext");
+
+  let [match] = routeContext.matches.slice(-1);
+  // Shallow clone path so we can modify it below, otherwise we modify the
+  // object referenced by useMemo inside useResolvedPath
+  let path = { ...useResolvedPath(action ? action : ".", { relative }) };
+
+  // If no action was specified, browsers will persist current search params
+  // when determining the path, so match that behavior
+  // https://github.com/remix-run/remix/issues/927
+  let location = useLocation();
+  if (action == null) {
+    // Safe to write to this directly here since if action was undefined, we
+    // would have called useResolvedPath(".") which will never include a search
+    path.search = location.search;
+
+    // When grabbing search params from the URL, remove any included ?index param
+    // since it might not apply to our contextual route.  We add it back based
+    // on match.route.index below
+    let params = new URLSearchParams(path.search);
+    if (params.has("index") && params.get("index") === "") {
+      params.delete("index");
+      path.search = params.toString() ? `?${params.toString()}` : "";
+    }
+  }
+
+  if ((!action || action === ".") && match.route.index) {
+    path.search = path.search
+      ? path.search.replace(/^\?/, "?index&")
+      : "?index";
+  }
+
+  // If we're operating within a basename, prepend it to the pathname prior
+  // to creating the form action.  If this is a root navigation, then just use
+  // the raw basename which allows the basename to have full control over the
+  // presence of a trailing slash on root actions
+  if (basename !== "/") {
+    path.pathname =
+      path.pathname === "/" ? basename : joinPaths([basename, path.pathname]);
+  }
+
+  return createPath(path);
+}
+
+export type FetcherWithComponents<TData> = Fetcher<TData> & {
+  Form: React.ForwardRefExoticComponent<
+    FetcherFormProps & React.RefAttributes<HTMLFormElement>
+  >;
+  submit: FetcherSubmitFunction;
+  load: (href: string, opts?: { unstable_flushSync?: boolean }) => void;
+};
+
+// TODO: (v7) Change the useFetcher generic default from `any` to `unknown`
+
+/**
+ * Interacts with route loaders and actions without causing a navigation. Great
+ * for any interaction that stays on the same page.
+ */
+export function useFetcher<TData = any>({
+  key,
+}: { key?: string } = {}): FetcherWithComponents<TData> {
+  let { router } = useDataRouterContext(DataRouterHook.UseFetcher);
+  let state = useDataRouterState(DataRouterStateHook.UseFetcher);
+  let fetcherData = React.useContext(FetchersContext);
+  let route = React.useContext(RouteContext);
+  let routeId = route.matches[route.matches.length - 1]?.route.id;
+
+  invariant(fetcherData, `useFetcher must be used inside a FetchersContext`);
+  invariant(route, `useFetcher must be used inside a RouteContext`);
+  invariant(
+    routeId != null,
+    `useFetcher can only be used on routes that contain a unique "id"`
+  );
+
+  // Fetcher key handling
+  // OK to call conditionally to feature detect `useId`
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  let defaultKey = useIdImpl ? useIdImpl() : "";
+  let [fetcherKey, setFetcherKey] = React.useState<string>(key || defaultKey);
+  if (key && key !== fetcherKey) {
+    setFetcherKey(key);
+  } else if (!fetcherKey) {
+    // We will only fall through here when `useId` is not available
+    setFetcherKey(getUniqueFetcherId());
+  }
+
+  // Registration/cleanup
+  React.useEffect(() => {
+    router.getFetcher(fetcherKey);
+    return () => {
+      // Tell the router we've unmounted - if v7_fetcherPersist is enabled this
+      // will not delete immediately but instead queue up a delete after the
+      // fetcher returns to an `idle` state
+      router.deleteFetcher(fetcherKey);
+    };
+  }, [router, fetcherKey]);
+
+  // Fetcher additions
+  let load = React.useCallback(
+    (href: string, opts?: { unstable_flushSync?: boolean }) => {
+      invariant(routeId, "No routeId available for fetcher.load()");
+      router.fetch(fetcherKey, routeId, href, opts);
+    },
+    [fetcherKey, routeId, router]
+  );
+
+  let submitImpl = useSubmit();
+  let submit = React.useCallback<FetcherSubmitFunction>(
+    (target, opts) => {
+      submitImpl(target, {
+        ...opts,
+        navigate: false,
+        fetcherKey,
+      });
+    },
+    [fetcherKey, submitImpl]
+  );
+
+  let FetcherForm = React.useMemo(() => {
+    let FetcherForm = React.forwardRef<HTMLFormElement, FetcherFormProps>(
+      (props, ref) => {
+        return (
+          <Form {...props} navigate={false} fetcherKey={fetcherKey} ref={ref} />
+        );
+      }
+    );
+    if (__DEV__) {
+      FetcherForm.displayName = "fetcher.Form";
+    }
+    return FetcherForm;
+  }, [fetcherKey]);
+
+  // Exposed FetcherWithComponents
+  let fetcher = state.fetchers.get(fetcherKey) || IDLE_FETCHER;
+  let data = fetcherData.get(fetcherKey);
+  let fetcherWithComponents = React.useMemo(
+    () => ({
+      Form: FetcherForm,
+      submit,
+      load,
+      ...fetcher,
+      data,
+    }),
+    [FetcherForm, submit, load, fetcher, data]
+  );
+
+  return fetcherWithComponents;
+}
+
+/**
+ * Provides all fetchers currently on the page. Useful for layouts and parent
+ * routes that need to provide pending/optimistic UI regarding the fetch.
+ */
+export function useFetchers(): (Fetcher & { key: string })[] {
+  let state = useDataRouterState(DataRouterStateHook.UseFetchers);
+  return Array.from(state.fetchers.entries()).map(([key, fetcher]) => ({
+    ...fetcher,
+    key,
+  }));
+}
+
+const SCROLL_RESTORATION_STORAGE_KEY = "react-router-scroll-positions";
+let savedScrollPositions: Record<string, number> = {};
+
+/**
+ * When rendered inside a RouterProvider, will restore scroll positions on navigations
+ */
+function useScrollRestoration({
+  getKey,
+  storageKey,
+}: {
+  getKey?: GetScrollRestorationKeyFunction;
+  storageKey?: string;
+} = {}) {
+  let { router } = useDataRouterContext(DataRouterHook.UseScrollRestoration);
+  let { restoreScrollPosition, preventScrollReset } = useDataRouterState(
+    DataRouterStateHook.UseScrollRestoration
+  );
+  let { basename } = React.useContext(NavigationContext);
+  let location = useLocation();
+  let matches = useMatches();
+  let navigation = useNavigation();
+
+  // Trigger manual scroll restoration while we're active
+  React.useEffect(() => {
+    window.history.scrollRestoration = "manual";
+    return () => {
+      window.history.scrollRestoration = "auto";
+    };
+  }, []);
+
+  // Save positions on pagehide
+  usePageHide(
+    React.useCallback(() => {
+      if (navigation.state === "idle") {
+        let key = (getKey ? getKey(location, matches) : null) || location.key;
+        savedScrollPositions[key] = window.scrollY;
+      }
+      try {
+        sessionStorage.setItem(
+          storageKey || SCROLL_RESTORATION_STORAGE_KEY,
+          JSON.stringify(savedScrollPositions)
+        );
+      } catch (error) {
+        warning(
+          false,
+          `Failed to save scroll positions in sessionStorage, <ScrollRestoration /> will not work properly (${error}).`
+        );
+      }
+      window.history.scrollRestoration = "auto";
+    }, [storageKey, getKey, navigation.state, location, matches])
+  );
+
+  // Read in any saved scroll locations
+  if (typeof document !== "undefined") {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useLayoutEffect(() => {
+      try {
+        let sessionPositions = sessionStorage.getItem(
+          storageKey || SCROLL_RESTORATION_STORAGE_KEY
+        );
+        if (sessionPositions) {
+          savedScrollPositions = JSON.parse(sessionPositions);
+        }
+      } catch (e) {
+        // no-op, use default empty object
+      }
+    }, [storageKey]);
+
+    // Enable scroll restoration in the router
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useLayoutEffect(() => {
+      let getKeyWithoutBasename: GetScrollRestorationKeyFunction | undefined =
+        getKey && basename !== "/"
+          ? (location, matches) =>
+              getKey(
+                // Strip the basename to match useLocation()
+                {
+                  ...location,
+                  pathname:
+                    stripBasename(location.pathname, basename) ||
+                    location.pathname,
+                },
+                matches
+              )
+          : getKey;
+      let disableScrollRestoration = router?.enableScrollRestoration(
+        savedScrollPositions,
+        () => window.scrollY,
+        getKeyWithoutBasename
+      );
+      return () => disableScrollRestoration && disableScrollRestoration();
+    }, [router, basename, getKey]);
+
+    // Restore scrolling when state.restoreScrollPosition changes
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useLayoutEffect(() => {
+      // Explicit false means don't do anything (used for submissions)
+      if (restoreScrollPosition === false) {
+        return;
+      }
+
+      // been here before, scroll to it
+      if (typeof restoreScrollPosition === "number") {
+        window.scrollTo(0, restoreScrollPosition);
+        return;
+      }
+
+      // try to scroll to the hash
+      if (location.hash) {
+        let el = document.getElementById(
+          decodeURIComponent(location.hash.slice(1))
+        );
+        if (el) {
+          el.scrollIntoView();
+          return;
+        }
+      }
+
+      // Don't reset if this navigation opted out
+      if (preventScrollReset === true) {
+        return;
+      }
+
+      // otherwise go to the top on new locations
+      window.scrollTo(0, 0);
+    }, [location, restoreScrollPosition, preventScrollReset]);
+  }
+}
+
+export { useScrollRestoration as UNSAFE_useScrollRestoration };
+
+/**
+ * Setup a callback to be fired on the window's `beforeunload` event. This is
+ * useful for saving some data to `window.localStorage` just before the page
+ * refreshes.
+ *
+ * Note: The `callback` argument should be a function created with
+ * `React.useCallback()`.
+ */
+export function useBeforeUnload(
+  callback: (event: BeforeUnloadEvent) => any,
+  options?: { capture?: boolean }
+): void {
+  let { capture } = options || {};
+  React.useEffect(() => {
+    let opts = capture != null ? { capture } : undefined;
+    window.addEventListener("beforeunload", callback, opts);
+    return () => {
+      window.removeEventListener("beforeunload", callback, opts);
+    };
+  }, [callback, capture]);
+}
+
+/**
+ * Setup a callback to be fired on the window's `pagehide` event. This is
+ * useful for saving some data to `window.localStorage` just before the page
+ * refreshes.  This event is better supported than beforeunload across browsers.
+ *
+ * Note: The `callback` argument should be a function created with
+ * `React.useCallback()`.
+ */
+function usePageHide(
+  callback: (event: PageTransitionEvent) => any,
+  options?: { capture?: boolean }
+): void {
+  let { capture } = options || {};
+  React.useEffect(() => {
+    let opts = capture != null ? { capture } : undefined;
+    window.addEventListener("pagehide", callback, opts);
+    return () => {
+      window.removeEventListener("pagehide", callback, opts);
+    };
+  }, [callback, capture]);
+}
+
+/**
+ * Wrapper around useBlocker to show a window.confirm prompt to users instead
+ * of building a custom UI with useBlocker.
+ *
+ * Warning: This has *a lot of rough edges* and behaves very differently (and
+ * very incorrectly in some cases) across browsers if user click addition
+ * back/forward navigations while the confirm is open.  Use at your own risk.
+ */
+function usePrompt({
+  when,
+  message,
+}: {
+  when: boolean | BlockerFunction;
+  message: string;
+}) {
+  let blocker = useBlocker(when);
+
+  React.useEffect(() => {
+    if (blocker.state === "blocked") {
+      let proceed = window.confirm(message);
+      if (proceed) {
+        // This timeout is needed to avoid a weird "race" on POP navigations
+        // between the `window.history` revert navigation and the result of
+        // `window.confirm`
+        setTimeout(blocker.proceed, 0);
+      } else {
+        blocker.reset();
+      }
+    }
+  }, [blocker, message]);
+
+  React.useEffect(() => {
+    if (blocker.state === "blocked" && !when) {
+      blocker.reset();
+    }
+  }, [blocker, when]);
+}
+
+export { usePrompt as unstable_usePrompt };
+
+/**
+ * Return a boolean indicating if there is an active view transition to the
+ * given href.  You can use this value to render CSS classes or viewTransitionName
+ * styles onto your elements
+ *
+ * @param href The destination href
+ * @param [opts.relative] Relative routing type ("route" | "path")
+ */
+function useViewTransitionState(
+  to: To,
+  opts: { relative?: RelativeRoutingType } = {}
+) {
+  let vtContext = React.useContext(ViewTransitionContext);
+
+  invariant(
+    vtContext != null,
+    "`unstable_useViewTransitionState` must be used within `react-router-dom`'s `RouterProvider`.  " +
+      "Did you accidentally import `RouterProvider` from `react-router`?"
+  );
+
+  let { basename } = useDataRouterContext(
+    DataRouterHook.useViewTransitionState
+  );
+  let path = useResolvedPath(to, { relative: opts.relative });
+  if (!vtContext.isTransitioning) {
+    return false;
+  }
+
+  let currentPath =
+    stripBasename(vtContext.currentLocation.pathname, basename) ||
+    vtContext.currentLocation.pathname;
+  let nextPath =
+    stripBasename(vtContext.nextLocation.pathname, basename) ||
+    vtContext.nextLocation.pathname;
+
+  // Transition is active if we're going to or coming from the indicated
+  // destination.  This ensures that other PUSH navigations that reverse
+  // an indicated transition apply.  I.e., on the list view you have:
+  //
+  //   <NavLink to="/details/1" unstable_viewTransition>
+  //
+  // If you click the breadcrumb back to the list view:
+  //
+  //   <NavLink to="/list" unstable_viewTransition>
+  //
+  // We should apply the transition because it's indicated as active going
+  // from /list -> /details/1 and therefore should be active on the reverse
+  // (even though this isn't strictly a POP reverse)
+  return (
+    matchPath(path.pathname, nextPath) != null ||
+    matchPath(path.pathname, currentPath) != null
+  );
+}
+
+export { useViewTransitionState as unstable_useViewTransitionState };
+
+//#endregion
diff --git a/ddb_main/node_modules/react-router-dom/node_modules/react-router/lib/components.tsx b/ddb_main/node_modules/react-router-dom/node_modules/react-router/lib/components.tsx
new file mode 100644
index 0000000..958cb5a
--- /dev/null
+++ b/ddb_main/node_modules/react-router-dom/node_modules/react-router/lib/components.tsx
@@ -0,0 +1,738 @@
+import type {
+  InitialEntry,
+  LazyRouteFunction,
+  Location,
+  MemoryHistory,
+  RelativeRoutingType,
+  Router as RemixRouter,
+  RouterState,
+  RouterSubscriber,
+  To,
+  TrackedPromise,
+} from "@remix-run/router";
+import {
+  AbortedDeferredError,
+  Action as NavigationType,
+  createMemoryHistory,
+  UNSAFE_getResolveToMatches as getResolveToMatches,
+  UNSAFE_invariant as invariant,
+  parsePath,
+  resolveTo,
+  stripBasename,
+  UNSAFE_warning as warning,
+} from "@remix-run/router";
+import * as React from "react";
+
+import type {
+  DataRouteObject,
+  IndexRouteObject,
+  Navigator,
+  NonIndexRouteObject,
+  RouteMatch,
+  RouteObject,
+} from "./context";
+import {
+  AwaitContext,
+  DataRouterContext,
+  DataRouterStateContext,
+  LocationContext,
+  NavigationContext,
+  RouteContext,
+} from "./context";
+import {
+  _renderMatches,
+  useAsyncValue,
+  useInRouterContext,
+  useLocation,
+  useNavigate,
+  useOutlet,
+  useRoutes,
+  useRoutesImpl,
+} from "./hooks";
+
+export interface FutureConfig {
+  v7_relativeSplatPath: boolean;
+  v7_startTransition: boolean;
+}
+
+export interface RouterProviderProps {
+  fallbackElement?: React.ReactNode;
+  router: RemixRouter;
+  // Only accept future flags relevant to rendering behavior
+  // routing flags should be accessed via router.future
+  future?: Partial<Pick<FutureConfig, "v7_startTransition">>;
+}
+
+/**
+  Webpack + React 17 fails to compile on any of the following because webpack
+  complains that `startTransition` doesn't exist in `React`:
+  * import { startTransition } from "react"
+  * import * as React from from "react";
+    "startTransition" in React ? React.startTransition(() => setState()) : setState()
+  * import * as React from from "react";
+    "startTransition" in React ? React["startTransition"](() => setState()) : setState()
+
+  Moving it to a constant such as the following solves the Webpack/React 17 issue:
+  * import * as React from from "react";
+    const START_TRANSITION = "startTransition";
+    START_TRANSITION in React ? React[START_TRANSITION](() => setState()) : setState()
+
+  However, that introduces webpack/terser minification issues in production builds
+  in React 18 where minification/obfuscation ends up removing the call of
+  React.startTransition entirely from the first half of the ternary.  Grabbing
+  this exported reference once up front resolves that issue.
+
+  See https://github.com/remix-run/react-router/issues/10579
+*/
+const START_TRANSITION = "startTransition";
+const startTransitionImpl = React[START_TRANSITION];
+
+/**
+ * Given a Remix Router instance, render the appropriate UI
+ */
+export function RouterProvider({
+  fallbackElement,
+  router,
+  future,
+}: RouterProviderProps): React.ReactElement {
+  let [state, setStateImpl] = React.useState(router.state);
+  let { v7_startTransition } = future || {};
+
+  let setState = React.useCallback<RouterSubscriber>(
+    (newState: RouterState) => {
+      if (v7_startTransition && startTransitionImpl) {
+        startTransitionImpl(() => setStateImpl(newState));
+      } else {
+        setStateImpl(newState);
+      }
+    },
+    [setStateImpl, v7_startTransition]
+  );
+
+  // Need to use a layout effect here so we are subscribed early enough to
+  // pick up on any render-driven redirects/navigations (useEffect/<Navigate>)
+  React.useLayoutEffect(() => router.subscribe(setState), [router, setState]);
+
+  React.useEffect(() => {
+    warning(
+      fallbackElement == null || !router.future.v7_partialHydration,
+      "`<RouterProvider fallbackElement>` is deprecated when using " +
+        "`v7_partialHydration`, use a `HydrateFallback` component instead"
+    );
+    // Only log this once on initial mount
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  let navigator = React.useMemo((): Navigator => {
+    return {
+      createHref: router.createHref,
+      encodeLocation: router.encodeLocation,
+      go: (n) => router.navigate(n),
+      push: (to, state, opts) =>
+        router.navigate(to, {
+          state,
+          preventScrollReset: opts?.preventScrollReset,
+        }),
+      replace: (to, state, opts) =>
+        router.navigate(to, {
+          replace: true,
+          state,
+          preventScrollReset: opts?.preventScrollReset,
+        }),
+    };
+  }, [router]);
+
+  let basename = router.basename || "/";
+
+  let dataRouterContext = React.useMemo(
+    () => ({
+      router,
+      navigator,
+      static: false,
+      basename,
+    }),
+    [router, navigator, basename]
+  );
+
+  // The fragment and {null} here are important!  We need them to keep React 18's
+  // useId happy when we are server-rendering since we may have a <script> here
+  // containing the hydrated server-side staticContext (from StaticRouterProvider).
+  // useId relies on the component tree structure to generate deterministic id's
+  // so we need to ensure it remains the same on the client even though
+  // we don't need the <script> tag
+  return (
+    <>
+      <DataRouterContext.Provider value={dataRouterContext}>
+        <DataRouterStateContext.Provider value={state}>
+          <Router
+            basename={basename}
+            location={state.location}
+            navigationType={state.historyAction}
+            navigator={navigator}
+            future={{
+              v7_relativeSplatPath: router.future.v7_relativeSplatPath,
+            }}
+          >
+            {state.initialized || router.future.v7_partialHydration ? (
+              <DataRoutes
+                routes={router.routes}
+                future={router.future}
+                state={state}
+              />
+            ) : (
+              fallbackElement
+            )}
+          </Router>
+        </DataRouterStateContext.Provider>
+      </DataRouterContext.Provider>
+      {null}
+    </>
+  );
+}
+
+function DataRoutes({
+  routes,
+  future,
+  state,
+}: {
+  routes: DataRouteObject[];
+  future: RemixRouter["future"];
+  state: RouterState;
+}): React.ReactElement | null {
+  return useRoutesImpl(routes, undefined, state, future);
+}
+
+export interface MemoryRouterProps {
+  basename?: string;
+  children?: React.ReactNode;
+  initialEntries?: InitialEntry[];
+  initialIndex?: number;
+  future?: Partial<FutureConfig>;
+}
+
+/**
+ * A `<Router>` that stores all entries in memory.
+ *
+ * @see https://reactrouter.com/router-components/memory-router
+ */
+export function MemoryRouter({
+  basename,
+  children,
+  initialEntries,
+  initialIndex,
+  future,
+}: MemoryRouterProps): React.ReactElement {
+  let historyRef = React.useRef<MemoryHistory>();
+  if (historyRef.current == null) {
+    historyRef.current = createMemoryHistory({
+      initialEntries,
+      initialIndex,
+      v5Compat: true,
+    });
+  }
+
+  let history = historyRef.current;
+  let [state, setStateImpl] = React.useState({
+    action: history.action,
+    location: history.location,
+  });
+  let { v7_startTransition } = future || {};
+  let setState = React.useCallback(
+    (newState: { action: NavigationType; location: Location }) => {
+      v7_startTransition && startTransitionImpl
+        ? startTransitionImpl(() => setStateImpl(newState))
+        : setStateImpl(newState);
+    },
+    [setStateImpl, v7_startTransition]
+  );
+
+  React.useLayoutEffect(() => history.listen(setState), [history, setState]);
+
+  return (
+    <Router
+      basename={basename}
+      children={children}
+      location={state.location}
+      navigationType={state.action}
+      navigator={history}
+      future={future}
+    />
+  );
+}
+
+export interface NavigateProps {
+  to: To;
+  replace?: boolean;
+  state?: any;
+  relative?: RelativeRoutingType;
+}
+
+/**
+ * Changes the current location.
+ *
+ * Note: This API is mostly useful in React.Component subclasses that are not
+ * able to use hooks. In functional components, we recommend you use the
+ * `useNavigate` hook instead.
+ *
+ * @see https://reactrouter.com/components/navigate
+ */
+export function Navigate({
+  to,
+  replace,
+  state,
+  relative,
+}: NavigateProps): null {
+  invariant(
+    useInRouterContext(),
+    // TODO: This error is probably because they somehow have 2 versions of
+    // the router loaded. We can help them understand how to avoid that.
+    `<Navigate> may be used only in the context of a <Router> component.`
+  );
+
+  let { future, static: isStatic } = React.useContext(NavigationContext);
+
+  warning(
+    !isStatic,
+    `<Navigate> must not be used on the initial render in a <StaticRouter>. ` +
+      `This is a no-op, but you should modify your code so the <Navigate> is ` +
+      `only ever rendered in response to some user interaction or state change.`
+  );
+
+  let { matches } = React.useContext(RouteContext);
+  let { pathname: locationPathname } = useLocation();
+  let navigate = useNavigate();
+
+  // Resolve the path outside of the effect so that when effects run twice in
+  // StrictMode they navigate to the same place
+  let path = resolveTo(
+    to,
+    getResolveToMatches(matches, future.v7_relativeSplatPath),
+    locationPathname,
+    relative === "path"
+  );
+  let jsonPath = JSON.stringify(path);
+
+  React.useEffect(
+    () => navigate(JSON.parse(jsonPath), { replace, state, relative }),
+    [navigate, jsonPath, relative, replace, state]
+  );
+
+  return null;
+}
+
+export interface OutletProps {
+  context?: unknown;
+}
+
+/**
+ * Renders the child route's element, if there is one.
+ *
+ * @see https://reactrouter.com/components/outlet
+ */
+export function Outlet(props: OutletProps): React.ReactElement | null {
+  return useOutlet(props.context);
+}
+
+export interface PathRouteProps {
+  caseSensitive?: NonIndexRouteObject["caseSensitive"];
+  path?: NonIndexRouteObject["path"];
+  id?: NonIndexRouteObject["id"];
+  lazy?: LazyRouteFunction<NonIndexRouteObject>;
+  loader?: NonIndexRouteObject["loader"];
+  action?: NonIndexRouteObject["action"];
+  hasErrorBoundary?: NonIndexRouteObject["hasErrorBoundary"];
+  shouldRevalidate?: NonIndexRouteObject["shouldRevalidate"];
+  handle?: NonIndexRouteObject["handle"];
+  index?: false;
+  children?: React.ReactNode;
+  element?: React.ReactNode | null;
+  hydrateFallbackElement?: React.ReactNode | null;
+  errorElement?: React.ReactNode | null;
+  Component?: React.ComponentType | null;
+  HydrateFallback?: React.ComponentType | null;
+  ErrorBoundary?: React.ComponentType | null;
+}
+
+export interface LayoutRouteProps extends PathRouteProps {}
+
+export interface IndexRouteProps {
+  caseSensitive?: IndexRouteObject["caseSensitive"];
+  path?: IndexRouteObject["path"];
+  id?: IndexRouteObject["id"];
+  lazy?: LazyRouteFunction<IndexRouteObject>;
+  loader?: IndexRouteObject["loader"];
+  action?: IndexRouteObject["action"];
+  hasErrorBoundary?: IndexRouteObject["hasErrorBoundary"];
+  shouldRevalidate?: IndexRouteObject["shouldRevalidate"];
+  handle?: IndexRouteObject["handle"];
+  index: true;
+  children?: undefined;
+  element?: React.ReactNode | null;
+  hydrateFallbackElement?: React.ReactNode | null;
+  errorElement?: React.ReactNode | null;
+  Component?: React.ComponentType | null;
+  HydrateFallback?: React.ComponentType | null;
+  ErrorBoundary?: React.ComponentType | null;
+}
+
+export type RouteProps = PathRouteProps | LayoutRouteProps | IndexRouteProps;
+
+/**
+ * Declares an element that should be rendered at a certain URL path.
+ *
+ * @see https://reactrouter.com/components/route
+ */
+export function Route(_props: RouteProps): React.ReactElement | null {
+  invariant(
+    false,
+    `A <Route> is only ever to be used as the child of <Routes> element, ` +
+      `never rendered directly. Please wrap your <Route> in a <Routes>.`
+  );
+}
+
+export interface RouterProps {
+  basename?: string;
+  children?: React.ReactNode;
+  location: Partial<Location> | string;
+  navigationType?: NavigationType;
+  navigator: Navigator;
+  static?: boolean;
+  future?: Partial<Pick<FutureConfig, "v7_relativeSplatPath">>;
+}
+
+/**
+ * Provides location context for the rest of the app.
+ *
+ * Note: You usually won't render a `<Router>` directly. Instead, you'll render a
+ * router that is more specific to your environment such as a `<BrowserRouter>`
+ * in web browsers or a `<StaticRouter>` for server rendering.
+ *
+ * @see https://reactrouter.com/router-components/router
+ */
+export function Router({
+  basename: basenameProp = "/",
+  children = null,
+  location: locationProp,
+  navigationType = NavigationType.Pop,
+  navigator,
+  static: staticProp = false,
+  future,
+}: RouterProps): React.ReactElement | null {
+  invariant(
+    !useInRouterContext(),
+    `You cannot render a <Router> inside another <Router>.` +
+      ` You should never have more than one in your app.`
+  );
+
+  // Preserve trailing slashes on basename, so we can let the user control
+  // the enforcement of trailing slashes throughout the app
+  let basename = basenameProp.replace(/^\/*/, "/");
+  let navigationContext = React.useMemo(
+    () => ({
+      basename,
+      navigator,
+      static: staticProp,
+      future: {
+        v7_relativeSplatPath: false,
+        ...future,
+      },
+    }),
+    [basename, future, navigator, staticProp]
+  );
+
+  if (typeof locationProp === "string") {
+    locationProp = parsePath(locationProp);
+  }
+
+  let {
+    pathname = "/",
+    search = "",
+    hash = "",
+    state = null,
+    key = "default",
+  } = locationProp;
+
+  let locationContext = React.useMemo(() => {
+    let trailingPathname = stripBasename(pathname, basename);
+
+    if (trailingPathname == null) {
+      return null;
+    }
+
+    return {
+      location: {
+        pathname: trailingPathname,
+        search,
+        hash,
+        state,
+        key,
+      },
+      navigationType,
+    };
+  }, [basename, pathname, search, hash, state, key, navigationType]);
+
+  warning(
+    locationContext != null,
+    `<Router basename="${basename}"> is not able to match the URL ` +
+      `"${pathname}${search}${hash}" because it does not start with the ` +
+      `basename, so the <Router> won't render anything.`
+  );
+
+  if (locationContext == null) {
+    return null;
+  }
+
+  return (
+    <NavigationContext.Provider value={navigationContext}>
+      <LocationContext.Provider children={children} value={locationContext} />
+    </NavigationContext.Provider>
+  );
+}
+
+export interface RoutesProps {
+  children?: React.ReactNode;
+  location?: Partial<Location> | string;
+}
+
+/**
+ * A container for a nested tree of `<Route>` elements that renders the branch
+ * that best matches the current location.
+ *
+ * @see https://reactrouter.com/components/routes
+ */
+export function Routes({
+  children,
+  location,
+}: RoutesProps): React.ReactElement | null {
+  return useRoutes(createRoutesFromChildren(children), location);
+}
+
+export interface AwaitResolveRenderFunction {
+  (data: Awaited<any>): React.ReactNode;
+}
+
+export interface AwaitProps {
+  children: React.ReactNode | AwaitResolveRenderFunction;
+  errorElement?: React.ReactNode;
+  resolve: TrackedPromise | any;
+}
+
+/**
+ * Component to use for rendering lazily loaded data from returning defer()
+ * in a loader function
+ */
+export function Await({ children, errorElement, resolve }: AwaitProps) {
+  return (
+    <AwaitErrorBoundary resolve={resolve} errorElement={errorElement}>
+      <ResolveAwait>{children}</ResolveAwait>
+    </AwaitErrorBoundary>
+  );
+}
+
+type AwaitErrorBoundaryProps = React.PropsWithChildren<{
+  errorElement?: React.ReactNode;
+  resolve: TrackedPromise | any;
+}>;
+
+type AwaitErrorBoundaryState = {
+  error: any;
+};
+
+enum AwaitRenderStatus {
+  pending,
+  success,
+  error,
+}
+
+const neverSettledPromise = new Promise(() => {});
+
+class AwaitErrorBoundary extends React.Component<
+  AwaitErrorBoundaryProps,
+  AwaitErrorBoundaryState
+> {
+  constructor(props: AwaitErrorBoundaryProps) {
+    super(props);
+    this.state = { error: null };
+  }
+
+  static getDerivedStateFromError(error: any) {
+    return { error };
+  }
+
+  componentDidCatch(error: any, errorInfo: any) {
+    console.error(
+      "<Await> caught the following error during render",
+      error,
+      errorInfo
+    );
+  }
+
+  render() {
+    let { children, errorElement, resolve } = this.props;
+
+    let promise: TrackedPromise | null = null;
+    let status: AwaitRenderStatus = AwaitRenderStatus.pending;
+
+    if (!(resolve instanceof Promise)) {
+      // Didn't get a promise - provide as a resolved promise
+      status = AwaitRenderStatus.success;
+      promise = Promise.resolve();
+      Object.defineProperty(promise, "_tracked", { get: () => true });
+      Object.defineProperty(promise, "_data", { get: () => resolve });
+    } else if (this.state.error) {
+      // Caught a render error, provide it as a rejected promise
+      status = AwaitRenderStatus.error;
+      let renderError = this.state.error;
+      promise = Promise.reject().catch(() => {}); // Avoid unhandled rejection warnings
+      Object.defineProperty(promise, "_tracked", { get: () => true });
+      Object.defineProperty(promise, "_error", { get: () => renderError });
+    } else if ((resolve as TrackedPromise)._tracked) {
+      // Already tracked promise - check contents
+      promise = resolve;
+      status =
+        "_error" in promise
+          ? AwaitRenderStatus.error
+          : "_data" in promise
+          ? AwaitRenderStatus.success
+          : AwaitRenderStatus.pending;
+    } else {
+      // Raw (untracked) promise - track it
+      status = AwaitRenderStatus.pending;
+      Object.defineProperty(resolve, "_tracked", { get: () => true });
+      promise = resolve.then(
+        (data: any) =>
+          Object.defineProperty(resolve, "_data", { get: () => data }),
+        (error: any) =>
+          Object.defineProperty(resolve, "_error", { get: () => error })
+      );
+    }
+
+    if (
+      status === AwaitRenderStatus.error &&
+      promise._error instanceof AbortedDeferredError
+    ) {
+      // Freeze the UI by throwing a never resolved promise
+      throw neverSettledPromise;
+    }
+
+    if (status === AwaitRenderStatus.error && !errorElement) {
+      // No errorElement, throw to the nearest route-level error boundary
+      throw promise._error;
+    }
+
+    if (status === AwaitRenderStatus.error) {
+      // Render via our errorElement
+      return <AwaitContext.Provider value={promise} children={errorElement} />;
+    }
+
+    if (status === AwaitRenderStatus.success) {
+      // Render children with resolved value
+      return <AwaitContext.Provider value={promise} children={children} />;
+    }
+
+    // Throw to the suspense boundary
+    throw promise;
+  }
+}
+
+/**
+ * @private
+ * Indirection to leverage useAsyncValue for a render-prop API on `<Await>`
+ */
+function ResolveAwait({
+  children,
+}: {
+  children: React.ReactNode | AwaitResolveRenderFunction;
+}) {
+  let data = useAsyncValue();
+  let toRender = typeof children === "function" ? children(data) : children;
+  return <>{toRender}</>;
+}
+
+///////////////////////////////////////////////////////////////////////////////
+// UTILS
+///////////////////////////////////////////////////////////////////////////////
+
+/**
+ * Creates a route config from a React "children" object, which is usually
+ * either a `<Route>` element or an array of them. Used internally by
+ * `<Routes>` to create a route config from its children.
+ *
+ * @see https://reactrouter.com/utils/create-routes-from-children
+ */
+export function createRoutesFromChildren(
+  children: React.ReactNode,
+  parentPath: number[] = []
+): RouteObject[] {
+  let routes: RouteObject[] = [];
+
+  React.Children.forEach(children, (element, index) => {
+    if (!React.isValidElement(element)) {
+      // Ignore non-elements. This allows people to more easily inline
+      // conditionals in their route config.
+      return;
+    }
+
+    let treePath = [...parentPath, index];
+
+    if (element.type === React.Fragment) {
+      // Transparently support React.Fragment and its children.
+      routes.push.apply(
+        routes,
+        createRoutesFromChildren(element.props.children, treePath)
+      );
+      return;
+    }
+
+    invariant(
+      element.type === Route,
+      `[${
+        typeof element.type === "string" ? element.type : element.type.name
+      }] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>`
+    );
+
+    invariant(
+      !element.props.index || !element.props.children,
+      "An index route cannot have child routes."
+    );
+
+    let route: RouteObject = {
+      id: element.props.id || treePath.join("-"),
+      caseSensitive: element.props.caseSensitive,
+      element: element.props.element,
+      Component: element.props.Component,
+      index: element.props.index,
+      path: element.props.path,
+      loader: element.props.loader,
+      action: element.props.action,
+      errorElement: element.props.errorElement,
+      ErrorBoundary: element.props.ErrorBoundary,
+      hasErrorBoundary:
+        element.props.ErrorBoundary != null ||
+        element.props.errorElement != null,
+      shouldRevalidate: element.props.shouldRevalidate,
+      handle: element.props.handle,
+      lazy: element.props.lazy,
+    };
+
+    if (element.props.children) {
+      route.children = createRoutesFromChildren(
+        element.props.children,
+        treePath
+      );
+    }
+
+    routes.push(route);
+  });
+
+  return routes;
+}
+
+/**
+ * Renders the result of `matchRoutes()` into a React element.
+ */
+export function renderMatches(
+  matches: RouteMatch[] | null
+): React.ReactElement | null {
+  return _renderMatches(matches);
+}
diff --git a/ddb_main/node_modules/react-router-dom/node_modules/react-router/lib/context.ts b/ddb_main/node_modules/react-router-dom/node_modules/react-router/lib/context.ts
new file mode 100644
index 0000000..a981682
--- /dev/null
+++ b/ddb_main/node_modules/react-router-dom/node_modules/react-router/lib/context.ts
@@ -0,0 +1,176 @@
+import * as React from "react";
+import type {
+  AgnosticIndexRouteObject,
+  AgnosticNonIndexRouteObject,
+  AgnosticRouteMatch,
+  History,
+  LazyRouteFunction,
+  Location,
+  Action as NavigationType,
+  RelativeRoutingType,
+  Router,
+  StaticHandlerContext,
+  To,
+  TrackedPromise,
+} from "@remix-run/router";
+
+// Create react-specific types from the agnostic types in @remix-run/router to
+// export from react-router
+export interface IndexRouteObject {
+  caseSensitive?: AgnosticIndexRouteObject["caseSensitive"];
+  path?: AgnosticIndexRouteObject["path"];
+  id?: AgnosticIndexRouteObject["id"];
+  loader?: AgnosticIndexRouteObject["loader"];
+  action?: AgnosticIndexRouteObject["action"];
+  hasErrorBoundary?: AgnosticIndexRouteObject["hasErrorBoundary"];
+  shouldRevalidate?: AgnosticIndexRouteObject["shouldRevalidate"];
+  handle?: AgnosticIndexRouteObject["handle"];
+  index: true;
+  children?: undefined;
+  element?: React.ReactNode | null;
+  hydrateFallbackElement?: React.ReactNode | null;
+  errorElement?: React.ReactNode | null;
+  Component?: React.ComponentType | null;
+  HydrateFallback?: React.ComponentType | null;
+  ErrorBoundary?: React.ComponentType | null;
+  lazy?: LazyRouteFunction<RouteObject>;
+}
+
+export interface NonIndexRouteObject {
+  caseSensitive?: AgnosticNonIndexRouteObject["caseSensitive"];
+  path?: AgnosticNonIndexRouteObject["path"];
+  id?: AgnosticNonIndexRouteObject["id"];
+  loader?: AgnosticNonIndexRouteObject["loader"];
+  action?: AgnosticNonIndexRouteObject["action"];
+  hasErrorBoundary?: AgnosticNonIndexRouteObject["hasErrorBoundary"];
+  shouldRevalidate?: AgnosticNonIndexRouteObject["shouldRevalidate"];
+  handle?: AgnosticNonIndexRouteObject["handle"];
+  index?: false;
+  children?: RouteObject[];
+  element?: React.ReactNode | null;
+  hydrateFallbackElement?: React.ReactNode | null;
+  errorElement?: React.ReactNode | null;
+  Component?: React.ComponentType | null;
+  HydrateFallback?: React.ComponentType | null;
+  ErrorBoundary?: React.ComponentType | null;
+  lazy?: LazyRouteFunction<RouteObject>;
+}
+
+export type RouteObject = IndexRouteObject | NonIndexRouteObject;
+
+export type DataRouteObject = RouteObject & {
+  children?: DataRouteObject[];
+  id: string;
+};
+
+export interface RouteMatch<
+  ParamKey extends string = string,
+  RouteObjectType extends RouteObject = RouteObject
+> extends AgnosticRouteMatch<ParamKey, RouteObjectType> {}
+
+export interface DataRouteMatch extends RouteMatch<string, DataRouteObject> {}
+
+export interface DataRouterContextObject
+  // Omit `future` since those can be pulled from the `router`
+  // `NavigationContext` needs future since it doesn't have a `router` in all cases
+  extends Omit<NavigationContextObject, "future"> {
+  router: Router;
+  staticContext?: StaticHandlerContext;
+}
+
+export const DataRouterContext =
+  React.createContext<DataRouterContextObject | null>(null);
+if (__DEV__) {
+  DataRouterContext.displayName = "DataRouter";
+}
+
+export const DataRouterStateContext = React.createContext<
+  Router["state"] | null
+>(null);
+if (__DEV__) {
+  DataRouterStateContext.displayName = "DataRouterState";
+}
+
+export const AwaitContext = React.createContext<TrackedPromise | null>(null);
+if (__DEV__) {
+  AwaitContext.displayName = "Await";
+}
+
+export interface NavigateOptions {
+  replace?: boolean;
+  state?: any;
+  preventScrollReset?: boolean;
+  relative?: RelativeRoutingType;
+  unstable_flushSync?: boolean;
+  unstable_viewTransition?: boolean;
+}
+
+/**
+ * A Navigator is a "location changer"; it's how you get to different locations.
+ *
+ * Every history instance conforms to the Navigator interface, but the
+ * distinction is useful primarily when it comes to the low-level `<Router>` API
+ * where both the location and a navigator must be provided separately in order
+ * to avoid "tearing" that may occur in a suspense-enabled app if the action
+ * and/or location were to be read directly from the history instance.
+ */
+export interface Navigator {
+  createHref: History["createHref"];
+  // Optional for backwards-compat with Router/HistoryRouter usage (edge case)
+  encodeLocation?: History["encodeLocation"];
+  go: History["go"];
+  push(to: To, state?: any, opts?: NavigateOptions): void;
+  replace(to: To, state?: any, opts?: NavigateOptions): void;
+}
+
+interface NavigationContextObject {
+  basename: string;
+  navigator: Navigator;
+  static: boolean;
+  future: {
+    v7_relativeSplatPath: boolean;
+  };
+}
+
+export const NavigationContext = React.createContext<NavigationContextObject>(
+  null!
+);
+
+if (__DEV__) {
+  NavigationContext.displayName = "Navigation";
+}
+
+interface LocationContextObject {
+  location: Location;
+  navigationType: NavigationType;
+}
+
+export const LocationContext = React.createContext<LocationContextObject>(
+  null!
+);
+
+if (__DEV__) {
+  LocationContext.displayName = "Location";
+}
+
+export interface RouteContextObject {
+  outlet: React.ReactElement | null;
+  matches: RouteMatch[];
+  isDataRoute: boolean;
+}
+
+export const RouteContext = React.createContext<RouteContextObject>({
+  outlet: null,
+  matches: [],
+  isDataRoute: false,
+});
+
+if (__DEV__) {
+  RouteContext.displayName = "Route";
+}
+
+export const RouteErrorContext = React.createContext<any>(null);
+
+if (__DEV__) {
+  RouteErrorContext.displayName = "RouteError";
+}
diff --git a/ddb_main/node_modules/react-router-dom/node_modules/react-router/lib/hooks.tsx b/ddb_main/node_modules/react-router-dom/node_modules/react-router/lib/hooks.tsx
new file mode 100644
index 0000000..37697ee
--- /dev/null
+++ b/ddb_main/node_modules/react-router-dom/node_modules/react-router/lib/hooks.tsx
@@ -0,0 +1,1104 @@
+import * as React from "react";
+import type {
+  Blocker,
+  BlockerFunction,
+  Location,
+  ParamParseKey,
+  Params,
+  Path,
+  PathMatch,
+  PathPattern,
+  RelativeRoutingType,
+  Router as RemixRouter,
+  RevalidationState,
+  To,
+  UIMatch,
+} from "@remix-run/router";
+import {
+  IDLE_BLOCKER,
+  Action as NavigationType,
+  UNSAFE_convertRouteMatchToUiMatch as convertRouteMatchToUiMatch,
+  UNSAFE_getResolveToMatches as getResolveToMatches,
+  UNSAFE_invariant as invariant,
+  isRouteErrorResponse,
+  joinPaths,
+  matchPath,
+  matchRoutes,
+  parsePath,
+  resolveTo,
+  stripBasename,
+  UNSAFE_warning as warning,
+} from "@remix-run/router";
+
+import type {
+  DataRouteMatch,
+  NavigateOptions,
+  RouteContextObject,
+  RouteMatch,
+  RouteObject,
+} from "./context";
+import {
+  AwaitContext,
+  DataRouterContext,
+  DataRouterStateContext,
+  LocationContext,
+  NavigationContext,
+  RouteContext,
+  RouteErrorContext,
+} from "./context";
+
+/**
+ * Returns the full href for the given "to" value. This is useful for building
+ * custom links that are also accessible and preserve right-click behavior.
+ *
+ * @see https://reactrouter.com/hooks/use-href
+ */
+export function useHref(
+  to: To,
+  { relative }: { relative?: RelativeRoutingType } = {}
+): string {
+  invariant(
+    useInRouterContext(),
+    // TODO: This error is probably because they somehow have 2 versions of the
+    // router loaded. We can help them understand how to avoid that.
+    `useHref() may be used only in the context of a <Router> component.`
+  );
+
+  let { basename, navigator } = React.useContext(NavigationContext);
+  let { hash, pathname, search } = useResolvedPath(to, { relative });
+
+  let joinedPathname = pathname;
+
+  // If we're operating within a basename, prepend it to the pathname prior
+  // to creating the href.  If this is a root navigation, then just use the raw
+  // basename which allows the basename to have full control over the presence
+  // of a trailing slash on root links
+  if (basename !== "/") {
+    joinedPathname =
+      pathname === "/" ? basename : joinPaths([basename, pathname]);
+  }
+
+  return navigator.createHref({ pathname: joinedPathname, search, hash });
+}
+
+/**
+ * Returns true if this component is a descendant of a `<Router>`.
+ *
+ * @see https://reactrouter.com/hooks/use-in-router-context
+ */
+export function useInRouterContext(): boolean {
+  return React.useContext(LocationContext) != null;
+}
+
+/**
+ * Returns the current location object, which represents the current URL in web
+ * browsers.
+ *
+ * Note: If you're using this it may mean you're doing some of your own
+ * "routing" in your app, and we'd like to know what your use case is. We may
+ * be able to provide something higher-level to better suit your needs.
+ *
+ * @see https://reactrouter.com/hooks/use-location
+ */
+export function useLocation(): Location {
+  invariant(
+    useInRouterContext(),
+    // TODO: This error is probably because they somehow have 2 versions of the
+    // router loaded. We can help them understand how to avoid that.
+    `useLocation() may be used only in the context of a <Router> component.`
+  );
+
+  return React.useContext(LocationContext).location;
+}
+
+/**
+ * Returns the current navigation action which describes how the router came to
+ * the current location, either by a pop, push, or replace on the history stack.
+ *
+ * @see https://reactrouter.com/hooks/use-navigation-type
+ */
+export function useNavigationType(): NavigationType {
+  return React.useContext(LocationContext).navigationType;
+}
+
+/**
+ * Returns a PathMatch object if the given pattern matches the current URL.
+ * This is useful for components that need to know "active" state, e.g.
+ * `<NavLink>`.
+ *
+ * @see https://reactrouter.com/hooks/use-match
+ */
+export function useMatch<
+  ParamKey extends ParamParseKey<Path>,
+  Path extends string
+>(pattern: PathPattern<Path> | Path): PathMatch<ParamKey> | null {
+  invariant(
+    useInRouterContext(),
+    // TODO: This error is probably because they somehow have 2 versions of the
+    // router loaded. We can help them understand how to avoid that.
+    `useMatch() may be used only in the context of a <Router> component.`
+  );
+
+  let { pathname } = useLocation();
+  return React.useMemo(
+    () => matchPath<ParamKey, Path>(pattern, pathname),
+    [pathname, pattern]
+  );
+}
+
+/**
+ * The interface for the navigate() function returned from useNavigate().
+ */
+export interface NavigateFunction {
+  (to: To, options?: NavigateOptions): void;
+  (delta: number): void;
+}
+
+const navigateEffectWarning =
+  `You should call navigate() in a React.useEffect(), not when ` +
+  `your component is first rendered.`;
+
+// Mute warnings for calls to useNavigate in SSR environments
+function useIsomorphicLayoutEffect(
+  cb: Parameters<typeof React.useLayoutEffect>[0]
+) {
+  let isStatic = React.useContext(NavigationContext).static;
+  if (!isStatic) {
+    // We should be able to get rid of this once react 18.3 is released
+    // See: https://github.com/facebook/react/pull/26395
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useLayoutEffect(cb);
+  }
+}
+
+/**
+ * Returns an imperative method for changing the location. Used by `<Link>`s, but
+ * may also be used by other elements to change the location.
+ *
+ * @see https://reactrouter.com/hooks/use-navigate
+ */
+export function useNavigate(): NavigateFunction {
+  let { isDataRoute } = React.useContext(RouteContext);
+  // Conditional usage is OK here because the usage of a data router is static
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  return isDataRoute ? useNavigateStable() : useNavigateUnstable();
+}
+
+function useNavigateUnstable(): NavigateFunction {
+  invariant(
+    useInRouterContext(),
+    // TODO: This error is probably because they somehow have 2 versions of the
+    // router loaded. We can help them understand how to avoid that.
+    `useNavigate() may be used only in the context of a <Router> component.`
+  );
+
+  let dataRouterContext = React.useContext(DataRouterContext);
+  let { basename, future, navigator } = React.useContext(NavigationContext);
+  let { matches } = React.useContext(RouteContext);
+  let { pathname: locationPathname } = useLocation();
+
+  let routePathnamesJson = JSON.stringify(
+    getResolveToMatches(matches, future.v7_relativeSplatPath)
+  );
+
+  let activeRef = React.useRef(false);
+  useIsomorphicLayoutEffect(() => {
+    activeRef.current = true;
+  });
+
+  let navigate: NavigateFunction = React.useCallback(
+    (to: To | number, options: NavigateOptions = {}) => {
+      warning(activeRef.current, navigateEffectWarning);
+
+      // Short circuit here since if this happens on first render the navigate
+      // is useless because we haven't wired up our history listener yet
+      if (!activeRef.current) return;
+
+      if (typeof to === "number") {
+        navigator.go(to);
+        return;
+      }
+
+      let path = resolveTo(
+        to,
+        JSON.parse(routePathnamesJson),
+        locationPathname,
+        options.relative === "path"
+      );
+
+      // If we're operating within a basename, prepend it to the pathname prior
+      // to handing off to history (but only if we're not in a data router,
+      // otherwise it'll prepend the basename inside of the router).
+      // If this is a root navigation, then we navigate to the raw basename
+      // which allows the basename to have full control over the presence of a
+      // trailing slash on root links
+      if (dataRouterContext == null && basename !== "/") {
+        path.pathname =
+          path.pathname === "/"
+            ? basename
+            : joinPaths([basename, path.pathname]);
+      }
+
+      (!!options.replace ? navigator.replace : navigator.push)(
+        path,
+        options.state,
+        options
+      );
+    },
+    [
+      basename,
+      navigator,
+      routePathnamesJson,
+      locationPathname,
+      dataRouterContext,
+    ]
+  );
+
+  return navigate;
+}
+
+const OutletContext = React.createContext<unknown>(null);
+
+/**
+ * Returns the context (if provided) for the child route at this level of the route
+ * hierarchy.
+ * @see https://reactrouter.com/hooks/use-outlet-context
+ */
+export function useOutletContext<Context = unknown>(): Context {
+  return React.useContext(OutletContext) as Context;
+}
+
+/**
+ * Returns the element for the child route at this level of the route
+ * hierarchy. Used internally by `<Outlet>` to render child routes.
+ *
+ * @see https://reactrouter.com/hooks/use-outlet
+ */
+export function useOutlet(context?: unknown): React.ReactElement | null {
+  let outlet = React.useContext(RouteContext).outlet;
+  if (outlet) {
+    return (
+      <OutletContext.Provider value={context}>{outlet}</OutletContext.Provider>
+    );
+  }
+  return outlet;
+}
+
+/**
+ * Returns an object of key/value pairs of the dynamic params from the current
+ * URL that were matched by the route path.
+ *
+ * @see https://reactrouter.com/hooks/use-params
+ */
+export function useParams<
+  ParamsOrKey extends string | Record<string, string | undefined> = string
+>(): Readonly<
+  [ParamsOrKey] extends [string] ? Params<ParamsOrKey> : Partial<ParamsOrKey>
+> {
+  let { matches } = React.useContext(RouteContext);
+  let routeMatch = matches[matches.length - 1];
+  return routeMatch ? (routeMatch.params as any) : {};
+}
+
+/**
+ * Resolves the pathname of the given `to` value against the current location.
+ *
+ * @see https://reactrouter.com/hooks/use-resolved-path
+ */
+export function useResolvedPath(
+  to: To,
+  { relative }: { relative?: RelativeRoutingType } = {}
+): Path {
+  let { future } = React.useContext(NavigationContext);
+  let { matches } = React.useContext(RouteContext);
+  let { pathname: locationPathname } = useLocation();
+  let routePathnamesJson = JSON.stringify(
+    getResolveToMatches(matches, future.v7_relativeSplatPath)
+  );
+
+  return React.useMemo(
+    () =>
+      resolveTo(
+        to,
+        JSON.parse(routePathnamesJson),
+        locationPathname,
+        relative === "path"
+      ),
+    [to, routePathnamesJson, locationPathname, relative]
+  );
+}
+
+/**
+ * Returns the element of the route that matched the current location, prepared
+ * with the correct context to render the remainder of the route tree. Route
+ * elements in the tree must render an `<Outlet>` to render their child route's
+ * element.
+ *
+ * @see https://reactrouter.com/hooks/use-routes
+ */
+export function useRoutes(
+  routes: RouteObject[],
+  locationArg?: Partial<Location> | string
+): React.ReactElement | null {
+  return useRoutesImpl(routes, locationArg);
+}
+
+// Internal implementation with accept optional param for RouterProvider usage
+export function useRoutesImpl(
+  routes: RouteObject[],
+  locationArg?: Partial<Location> | string,
+  dataRouterState?: RemixRouter["state"],
+  future?: RemixRouter["future"]
+): React.ReactElement | null {
+  invariant(
+    useInRouterContext(),
+    // TODO: This error is probably because they somehow have 2 versions of the
+    // router loaded. We can help them understand how to avoid that.
+    `useRoutes() may be used only in the context of a <Router> component.`
+  );
+
+  let { navigator } = React.useContext(NavigationContext);
+  let { matches: parentMatches } = React.useContext(RouteContext);
+  let routeMatch = parentMatches[parentMatches.length - 1];
+  let parentParams = routeMatch ? routeMatch.params : {};
+  let parentPathname = routeMatch ? routeMatch.pathname : "/";
+  let parentPathnameBase = routeMatch ? routeMatch.pathnameBase : "/";
+  let parentRoute = routeMatch && routeMatch.route;
+
+  if (__DEV__) {
+    // You won't get a warning about 2 different <Routes> under a <Route>
+    // without a trailing *, but this is a best-effort warning anyway since we
+    // cannot even give the warning unless they land at the parent route.
+    //
+    // Example:
+    //
+    // <Routes>
+    //   {/* This route path MUST end with /* because otherwise
+    //       it will never match /blog/post/123 */}
+    //   <Route path="blog" element={<Blog />} />
+    //   <Route path="blog/feed" element={<BlogFeed />} />
+    // </Routes>
+    //
+    // function Blog() {
+    //   return (
+    //     <Routes>
+    //       <Route path="post/:id" element={<Post />} />
+    //     </Routes>
+    //   );
+    // }
+    let parentPath = (parentRoute && parentRoute.path) || "";
+    warningOnce(
+      parentPathname,
+      !parentRoute || parentPath.endsWith("*"),
+      `You rendered descendant <Routes> (or called \`useRoutes()\`) at ` +
+        `"${parentPathname}" (under <Route path="${parentPath}">) but the ` +
+        `parent route path has no trailing "*". This means if you navigate ` +
+        `deeper, the parent won't match anymore and therefore the child ` +
+        `routes will never render.\n\n` +
+        `Please change the parent <Route path="${parentPath}"> to <Route ` +
+        `path="${parentPath === "/" ? "*" : `${parentPath}/*`}">.`
+    );
+  }
+
+  let locationFromContext = useLocation();
+
+  let location;
+  if (locationArg) {
+    let parsedLocationArg =
+      typeof locationArg === "string" ? parsePath(locationArg) : locationArg;
+
+    invariant(
+      parentPathnameBase === "/" ||
+        parsedLocationArg.pathname?.startsWith(parentPathnameBase),
+      `When overriding the location using \`<Routes location>\` or \`useRoutes(routes, location)\`, ` +
+        `the location pathname must begin with the portion of the URL pathname that was ` +
+        `matched by all parent routes. The current pathname base is "${parentPathnameBase}" ` +
+        `but pathname "${parsedLocationArg.pathname}" was given in the \`location\` prop.`
+    );
+
+    location = parsedLocationArg;
+  } else {
+    location = locationFromContext;
+  }
+
+  let pathname = location.pathname || "/";
+
+  let remainingPathname = pathname;
+  if (parentPathnameBase !== "/") {
+    // Determine the remaining pathname by removing the # of URL segments the
+    // parentPathnameBase has, instead of removing based on character count.
+    // This is because we can't guarantee that incoming/outgoing encodings/
+    // decodings will match exactly.
+    // We decode paths before matching on a per-segment basis with
+    // decodeURIComponent(), but we re-encode pathnames via `new URL()` so they
+    // match what `window.location.pathname` would reflect.  Those don't 100%
+    // align when it comes to encoded URI characters such as % and &.
+    //
+    // So we may end up with:
+    //   pathname:           "/descendant/a%25b/match"
+    //   parentPathnameBase: "/descendant/a%b"
+    //
+    // And the direct substring removal approach won't work :/
+    let parentSegments = parentPathnameBase.replace(/^\//, "").split("/");
+    let segments = pathname.replace(/^\//, "").split("/");
+    remainingPathname = "/" + segments.slice(parentSegments.length).join("/");
+  }
+
+  let matches = matchRoutes(routes, { pathname: remainingPathname });
+
+  if (__DEV__) {
+    warning(
+      parentRoute || matches != null,
+      `No routes matched location "${location.pathname}${location.search}${location.hash}" `
+    );
+
+    warning(
+      matches == null ||
+        matches[matches.length - 1].route.element !== undefined ||
+        matches[matches.length - 1].route.Component !== undefined ||
+        matches[matches.length - 1].route.lazy !== undefined,
+      `Matched leaf route at location "${location.pathname}${location.search}${location.hash}" ` +
+        `does not have an element or Component. This means it will render an <Outlet /> with a ` +
+        `null value by default resulting in an "empty" page.`
+    );
+  }
+
+  let renderedMatches = _renderMatches(
+    matches &&
+      matches.map((match) =>
+        Object.assign({}, match, {
+          params: Object.assign({}, parentParams, match.params),
+          pathname: joinPaths([
+            parentPathnameBase,
+            // Re-encode pathnames that were decoded inside matchRoutes
+            navigator.encodeLocation
+              ? navigator.encodeLocation(match.pathname).pathname
+              : match.pathname,
+          ]),
+          pathnameBase:
+            match.pathnameBase === "/"
+              ? parentPathnameBase
+              : joinPaths([
+                  parentPathnameBase,
+                  // Re-encode pathnames that were decoded inside matchRoutes
+                  navigator.encodeLocation
+                    ? navigator.encodeLocation(match.pathnameBase).pathname
+                    : match.pathnameBase,
+                ]),
+        })
+      ),
+    parentMatches,
+    dataRouterState,
+    future
+  );
+
+  // When a user passes in a `locationArg`, the associated routes need to
+  // be wrapped in a new `LocationContext.Provider` in order for `useLocation`
+  // to use the scoped location instead of the global location.
+  if (locationArg && renderedMatches) {
+    return (
+      <LocationContext.Provider
+        value={{
+          location: {
+            pathname: "/",
+            search: "",
+            hash: "",
+            state: null,
+            key: "default",
+            ...location,
+          },
+          navigationType: NavigationType.Pop,
+        }}
+      >
+        {renderedMatches}
+      </LocationContext.Provider>
+    );
+  }
+
+  return renderedMatches;
+}
+
+function DefaultErrorComponent() {
+  let error = useRouteError();
+  let message = isRouteErrorResponse(error)
+    ? `${error.status} ${error.statusText}`
+    : error instanceof Error
+    ? error.message
+    : JSON.stringify(error);
+  let stack = error instanceof Error ? error.stack : null;
+  let lightgrey = "rgba(200,200,200, 0.5)";
+  let preStyles = { padding: "0.5rem", backgroundColor: lightgrey };
+  let codeStyles = { padding: "2px 4px", backgroundColor: lightgrey };
+
+  let devInfo = null;
+  if (__DEV__) {
+    console.error(
+      "Error handled by React Router default ErrorBoundary:",
+      error
+    );
+
+    devInfo = (
+      <>
+        <p>💿 Hey developer 👋</p>
+        <p>
+          You can provide a way better UX than this when your app throws errors
+          by providing your own <code style={codeStyles}>ErrorBoundary</code> or{" "}
+          <code style={codeStyles}>errorElement</code> prop on your route.
+        </p>
+      </>
+    );
+  }
+
+  return (
+    <>
+      <h2>Unexpected Application Error!</h2>
+      <h3 style={{ fontStyle: "italic" }}>{message}</h3>
+      {stack ? <pre style={preStyles}>{stack}</pre> : null}
+      {devInfo}
+    </>
+  );
+}
+
+const defaultErrorElement = <DefaultErrorComponent />;
+
+type RenderErrorBoundaryProps = React.PropsWithChildren<{
+  location: Location;
+  revalidation: RevalidationState;
+  error: any;
+  component: React.ReactNode;
+  routeContext: RouteContextObject;
+}>;
+
+type RenderErrorBoundaryState = {
+  location: Location;
+  revalidation: RevalidationState;
+  error: any;
+};
+
+export class RenderErrorBoundary extends React.Component<
+  RenderErrorBoundaryProps,
+  RenderErrorBoundaryState
+> {
+  constructor(props: RenderErrorBoundaryProps) {
+    super(props);
+    this.state = {
+      location: props.location,
+      revalidation: props.revalidation,
+      error: props.error,
+    };
+  }
+
+  static getDerivedStateFromError(error: any) {
+    return { error: error };
+  }
+
+  static getDerivedStateFromProps(
+    props: RenderErrorBoundaryProps,
+    state: RenderErrorBoundaryState
+  ) {
+    // When we get into an error state, the user will likely click "back" to the
+    // previous page that didn't have an error. Because this wraps the entire
+    // application, that will have no effect--the error page continues to display.
+    // This gives us a mechanism to recover from the error when the location changes.
+    //
+    // Whether we're in an error state or not, we update the location in state
+    // so that when we are in an error state, it gets reset when a new location
+    // comes in and the user recovers from the error.
+    if (
+      state.location !== props.location ||
+      (state.revalidation !== "idle" && props.revalidation === "idle")
+    ) {
+      return {
+        error: props.error,
+        location: props.location,
+        revalidation: props.revalidation,
+      };
+    }
+
+    // If we're not changing locations, preserve the location but still surface
+    // any new errors that may come through. We retain the existing error, we do
+    // this because the error provided from the app state may be cleared without
+    // the location changing.
+    return {
+      error: props.error !== undefined ? props.error : state.error,
+      location: state.location,
+      revalidation: props.revalidation || state.revalidation,
+    };
+  }
+
+  componentDidCatch(error: any, errorInfo: any) {
+    console.error(
+      "React Router caught the following error during render",
+      error,
+      errorInfo
+    );
+  }
+
+  render() {
+    return this.state.error !== undefined ? (
+      <RouteContext.Provider value={this.props.routeContext}>
+        <RouteErrorContext.Provider
+          value={this.state.error}
+          children={this.props.component}
+        />
+      </RouteContext.Provider>
+    ) : (
+      this.props.children
+    );
+  }
+}
+
+interface RenderedRouteProps {
+  routeContext: RouteContextObject;
+  match: RouteMatch<string, RouteObject>;
+  children: React.ReactNode | null;
+}
+
+function RenderedRoute({ routeContext, match, children }: RenderedRouteProps) {
+  let dataRouterContext = React.useContext(DataRouterContext);
+
+  // Track how deep we got in our render pass to emulate SSR componentDidCatch
+  // in a DataStaticRouter
+  if (
+    dataRouterContext &&
+    dataRouterContext.static &&
+    dataRouterContext.staticContext &&
+    (match.route.errorElement || match.route.ErrorBoundary)
+  ) {
+    dataRouterContext.staticContext._deepestRenderedBoundaryId = match.route.id;
+  }
+
+  return (
+    <RouteContext.Provider value={routeContext}>
+      {children}
+    </RouteContext.Provider>
+  );
+}
+
+export function _renderMatches(
+  matches: RouteMatch[] | null,
+  parentMatches: RouteMatch[] = [],
+  dataRouterState: RemixRouter["state"] | null = null,
+  future: RemixRouter["future"] | null = null
+): React.ReactElement | null {
+  if (matches == null) {
+    if (dataRouterState?.errors) {
+      // Don't bail if we have data router errors so we can render them in the
+      // boundary.  Use the pre-matched (or shimmed) matches
+      matches = dataRouterState.matches as DataRouteMatch[];
+    } else {
+      return null;
+    }
+  }
+
+  let renderedMatches = matches;
+
+  // If we have data errors, trim matches to the highest error boundary
+  let errors = dataRouterState?.errors;
+  if (errors != null) {
+    let errorIndex = renderedMatches.findIndex(
+      (m) => m.route.id && errors?.[m.route.id] !== undefined
+    );
+    invariant(
+      errorIndex >= 0,
+      `Could not find a matching route for errors on route IDs: ${Object.keys(
+        errors
+      ).join(",")}`
+    );
+    renderedMatches = renderedMatches.slice(
+      0,
+      Math.min(renderedMatches.length, errorIndex + 1)
+    );
+  }
+
+  // If we're in a partial hydration mode, detect if we need to render down to
+  // a given HydrateFallback while we load the rest of the hydration data
+  let renderFallback = false;
+  let fallbackIndex = -1;
+  if (dataRouterState && future && future.v7_partialHydration) {
+    for (let i = 0; i < renderedMatches.length; i++) {
+      let match = renderedMatches[i];
+      // Track the deepest fallback up until the first route without data
+      if (match.route.HydrateFallback || match.route.hydrateFallbackElement) {
+        fallbackIndex = i;
+      }
+
+      if (match.route.id) {
+        let { loaderData, errors } = dataRouterState;
+        let needsToRunLoader =
+          match.route.loader &&
+          loaderData[match.route.id] === undefined &&
+          (!errors || errors[match.route.id] === undefined);
+        if (match.route.lazy || needsToRunLoader) {
+          // We found the first route that's not ready to render (waiting on
+          // lazy, or has a loader that hasn't run yet).  Flag that we need to
+          // render a fallback and render up until the appropriate fallback
+          renderFallback = true;
+          if (fallbackIndex >= 0) {
+            renderedMatches = renderedMatches.slice(0, fallbackIndex + 1);
+          } else {
+            renderedMatches = [renderedMatches[0]];
+          }
+          break;
+        }
+      }
+    }
+  }
+
+  return renderedMatches.reduceRight((outlet, match, index) => {
+    // Only data routers handle errors/fallbacks
+    let error: any;
+    let shouldRenderHydrateFallback = false;
+    let errorElement: React.ReactNode | null = null;
+    let hydrateFallbackElement: React.ReactNode | null = null;
+    if (dataRouterState) {
+      error = errors && match.route.id ? errors[match.route.id] : undefined;
+      errorElement = match.route.errorElement || defaultErrorElement;
+
+      if (renderFallback) {
+        if (fallbackIndex < 0 && index === 0) {
+          warningOnce(
+            "route-fallback",
+            false,
+            "No `HydrateFallback` element provided to render during initial hydration"
+          );
+          shouldRenderHydrateFallback = true;
+          hydrateFallbackElement = null;
+        } else if (fallbackIndex === index) {
+          shouldRenderHydrateFallback = true;
+          hydrateFallbackElement = match.route.hydrateFallbackElement || null;
+        }
+      }
+    }
+
+    let matches = parentMatches.concat(renderedMatches.slice(0, index + 1));
+    let getChildren = () => {
+      let children: React.ReactNode;
+      if (error) {
+        children = errorElement;
+      } else if (shouldRenderHydrateFallback) {
+        children = hydrateFallbackElement;
+      } else if (match.route.Component) {
+        // Note: This is a de-optimized path since React won't re-use the
+        // ReactElement since it's identity changes with each new
+        // React.createElement call.  We keep this so folks can use
+        // `<Route Component={...}>` in `<Routes>` but generally `Component`
+        // usage is only advised in `RouterProvider` when we can convert it to
+        // `element` ahead of time.
+        children = <match.route.Component />;
+      } else if (match.route.element) {
+        children = match.route.element;
+      } else {
+        children = outlet;
+      }
+      return (
+        <RenderedRoute
+          match={match}
+          routeContext={{
+            outlet,
+            matches,
+            isDataRoute: dataRouterState != null,
+          }}
+          children={children}
+        />
+      );
+    };
+    // Only wrap in an error boundary within data router usages when we have an
+    // ErrorBoundary/errorElement on this route.  Otherwise let it bubble up to
+    // an ancestor ErrorBoundary/errorElement
+    return dataRouterState &&
+      (match.route.ErrorBoundary || match.route.errorElement || index === 0) ? (
+      <RenderErrorBoundary
+        location={dataRouterState.location}
+        revalidation={dataRouterState.revalidation}
+        component={errorElement}
+        error={error}
+        children={getChildren()}
+        routeContext={{ outlet: null, matches, isDataRoute: true }}
+      />
+    ) : (
+      getChildren()
+    );
+  }, null as React.ReactElement | null);
+}
+
+enum DataRouterHook {
+  UseBlocker = "useBlocker",
+  UseRevalidator = "useRevalidator",
+  UseNavigateStable = "useNavigate",
+}
+
+enum DataRouterStateHook {
+  UseBlocker = "useBlocker",
+  UseLoaderData = "useLoaderData",
+  UseActionData = "useActionData",
+  UseRouteError = "useRouteError",
+  UseNavigation = "useNavigation",
+  UseRouteLoaderData = "useRouteLoaderData",
+  UseMatches = "useMatches",
+  UseRevalidator = "useRevalidator",
+  UseNavigateStable = "useNavigate",
+  UseRouteId = "useRouteId",
+}
+
+function getDataRouterConsoleError(
+  hookName: DataRouterHook | DataRouterStateHook
+) {
+  return `${hookName} must be used within a data router.  See https://reactrouter.com/routers/picking-a-router.`;
+}
+
+function useDataRouterContext(hookName: DataRouterHook) {
+  let ctx = React.useContext(DataRouterContext);
+  invariant(ctx, getDataRouterConsoleError(hookName));
+  return ctx;
+}
+
+function useDataRouterState(hookName: DataRouterStateHook) {
+  let state = React.useContext(DataRouterStateContext);
+  invariant(state, getDataRouterConsoleError(hookName));
+  return state;
+}
+
+function useRouteContext(hookName: DataRouterStateHook) {
+  let route = React.useContext(RouteContext);
+  invariant(route, getDataRouterConsoleError(hookName));
+  return route;
+}
+
+// Internal version with hookName-aware debugging
+function useCurrentRouteId(hookName: DataRouterStateHook) {
+  let route = useRouteContext(hookName);
+  let thisRoute = route.matches[route.matches.length - 1];
+  invariant(
+    thisRoute.route.id,
+    `${hookName} can only be used on routes that contain a unique "id"`
+  );
+  return thisRoute.route.id;
+}
+
+/**
+ * Returns the ID for the nearest contextual route
+ */
+export function useRouteId() {
+  return useCurrentRouteId(DataRouterStateHook.UseRouteId);
+}
+
+/**
+ * Returns the current navigation, defaulting to an "idle" navigation when
+ * no navigation is in progress
+ */
+export function useNavigation() {
+  let state = useDataRouterState(DataRouterStateHook.UseNavigation);
+  return state.navigation;
+}
+
+/**
+ * Returns a revalidate function for manually triggering revalidation, as well
+ * as the current state of any manual revalidations
+ */
+export function useRevalidator() {
+  let dataRouterContext = useDataRouterContext(DataRouterHook.UseRevalidator);
+  let state = useDataRouterState(DataRouterStateHook.UseRevalidator);
+  return React.useMemo(
+    () => ({
+      revalidate: dataRouterContext.router.revalidate,
+      state: state.revalidation,
+    }),
+    [dataRouterContext.router.revalidate, state.revalidation]
+  );
+}
+
+/**
+ * Returns the active route matches, useful for accessing loaderData for
+ * parent/child routes or the route "handle" property
+ */
+export function useMatches(): UIMatch[] {
+  let { matches, loaderData } = useDataRouterState(
+    DataRouterStateHook.UseMatches
+  );
+  return React.useMemo(
+    () => matches.map((m) => convertRouteMatchToUiMatch(m, loaderData)),
+    [matches, loaderData]
+  );
+}
+
+/**
+ * Returns the loader data for the nearest ancestor Route loader
+ */
+export function useLoaderData(): unknown {
+  let state = useDataRouterState(DataRouterStateHook.UseLoaderData);
+  let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData);
+
+  if (state.errors && state.errors[routeId] != null) {
+    console.error(
+      `You cannot \`useLoaderData\` in an errorElement (routeId: ${routeId})`
+    );
+    return undefined;
+  }
+  return state.loaderData[routeId];
+}
+
+/**
+ * Returns the loaderData for the given routeId
+ */
+export function useRouteLoaderData(routeId: string): unknown {
+  let state = useDataRouterState(DataRouterStateHook.UseRouteLoaderData);
+  return state.loaderData[routeId];
+}
+
+/**
+ * Returns the action data for the nearest ancestor Route action
+ */
+export function useActionData(): unknown {
+  let state = useDataRouterState(DataRouterStateHook.UseActionData);
+  let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData);
+  return state.actionData ? state.actionData[routeId] : undefined;
+}
+
+/**
+ * Returns the nearest ancestor Route error, which could be a loader/action
+ * error or a render error.  This is intended to be called from your
+ * ErrorBoundary/errorElement to display a proper error message.
+ */
+export function useRouteError(): unknown {
+  let error = React.useContext(RouteErrorContext);
+  let state = useDataRouterState(DataRouterStateHook.UseRouteError);
+  let routeId = useCurrentRouteId(DataRouterStateHook.UseRouteError);
+
+  // If this was a render error, we put it in a RouteError context inside
+  // of RenderErrorBoundary
+  if (error !== undefined) {
+    return error;
+  }
+
+  // Otherwise look for errors from our data router state
+  return state.errors?.[routeId];
+}
+
+/**
+ * Returns the happy-path data from the nearest ancestor `<Await />` value
+ */
+export function useAsyncValue(): unknown {
+  let value = React.useContext(AwaitContext);
+  return value?._data;
+}
+
+/**
+ * Returns the error from the nearest ancestor `<Await />` value
+ */
+export function useAsyncError(): unknown {
+  let value = React.useContext(AwaitContext);
+  return value?._error;
+}
+
+let blockerId = 0;
+
+/**
+ * Allow the application to block navigations within the SPA and present the
+ * user a confirmation dialog to confirm the navigation.  Mostly used to avoid
+ * using half-filled form data.  This does not handle hard-reloads or
+ * cross-origin navigations.
+ */
+export function useBlocker(shouldBlock: boolean | BlockerFunction): Blocker {
+  let { router, basename } = useDataRouterContext(DataRouterHook.UseBlocker);
+  let state = useDataRouterState(DataRouterStateHook.UseBlocker);
+
+  let [blockerKey, setBlockerKey] = React.useState("");
+  let blockerFunction = React.useCallback<BlockerFunction>(
+    (arg) => {
+      if (typeof shouldBlock !== "function") {
+        return !!shouldBlock;
+      }
+      if (basename === "/") {
+        return shouldBlock(arg);
+      }
+
+      // If they provided us a function and we've got an active basename, strip
+      // it from the locations we expose to the user to match the behavior of
+      // useLocation
+      let { currentLocation, nextLocation, historyAction } = arg;
+      return shouldBlock({
+        currentLocation: {
+          ...currentLocation,
+          pathname:
+            stripBasename(currentLocation.pathname, basename) ||
+            currentLocation.pathname,
+        },
+        nextLocation: {
+          ...nextLocation,
+          pathname:
+            stripBasename(nextLocation.pathname, basename) ||
+            nextLocation.pathname,
+        },
+        historyAction,
+      });
+    },
+    [basename, shouldBlock]
+  );
+
+  // This effect is in charge of blocker key assignment and deletion (which is
+  // tightly coupled to the key)
+  React.useEffect(() => {
+    let key = String(++blockerId);
+    setBlockerKey(key);
+    return () => router.deleteBlocker(key);
+  }, [router]);
+
+  // This effect handles assigning the blockerFunction.  This is to handle
+  // unstable blocker function identities, and happens only after the prior
+  // effect so we don't get an orphaned blockerFunction in the router with a
+  // key of "".  Until then we just have the IDLE_BLOCKER.
+  React.useEffect(() => {
+    if (blockerKey !== "") {
+      router.getBlocker(blockerKey, blockerFunction);
+    }
+  }, [router, blockerKey, blockerFunction]);
+
+  // Prefer the blocker from `state` not `router.state` since DataRouterContext
+  // is memoized so this ensures we update on blocker state updates
+  return blockerKey && state.blockers.has(blockerKey)
+    ? state.blockers.get(blockerKey)!
+    : IDLE_BLOCKER;
+}
+
+/**
+ * Stable version of useNavigate that is used when we are in the context of
+ * a RouterProvider.
+ */
+function useNavigateStable(): NavigateFunction {
+  let { router } = useDataRouterContext(DataRouterHook.UseNavigateStable);
+  let id = useCurrentRouteId(DataRouterStateHook.UseNavigateStable);
+
+  let activeRef = React.useRef(false);
+  useIsomorphicLayoutEffect(() => {
+    activeRef.current = true;
+  });
+
+  let navigate: NavigateFunction = React.useCallback(
+    (to: To | number, options: NavigateOptions = {}) => {
+      warning(activeRef.current, navigateEffectWarning);
+
+      // Short circuit here since if this happens on first render the navigate
+      // is useless because we haven't wired up our router subscriber yet
+      if (!activeRef.current) return;
+
+      if (typeof to === "number") {
+        router.navigate(to);
+      } else {
+        router.navigate(to, { fromRouteId: id, ...options });
+      }
+    },
+    [router, id]
+  );
+
+  return navigate;
+}
+
+const alreadyWarned: Record<string, boolean> = {};
+
+function warningOnce(key: string, cond: boolean, message: string) {
+  if (!cond && !alreadyWarned[key]) {
+    alreadyWarned[key] = true;
+    warning(false, message);
+  }
+}
diff --git a/ddb_main/node_modules/react-router-redux/es/ConnectedRouter.js b/ddb_main/node_modules/react-router-redux/es/ConnectedRouter.js
new file mode 100644
index 0000000..2d20997
--- /dev/null
+++ b/ddb_main/node_modules/react-router-redux/es/ConnectedRouter.js
@@ -0,0 +1,69 @@
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { Router } from 'react-router';
+
+import { LOCATION_CHANGE } from './reducer';
+
+var ConnectedRouter = function (_Component) {
+  _inherits(ConnectedRouter, _Component);
+
+  function ConnectedRouter() {
+    var _temp, _this, _ret;
+
+    _classCallCheck(this, ConnectedRouter);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.handleLocationChange = function (location) {
+      _this.store.dispatch({
+        type: LOCATION_CHANGE,
+        payload: location
+      });
+    }, _temp), _possibleConstructorReturn(_this, _ret);
+  }
+
+  ConnectedRouter.prototype.componentWillMount = function componentWillMount() {
+    var _props = this.props,
+        propsStore = _props.store,
+        history = _props.history;
+
+    this.store = propsStore || this.context.store;
+    this.handleLocationChange(history.location);
+  };
+
+  ConnectedRouter.prototype.componentDidMount = function componentDidMount() {
+    var history = this.props.history;
+
+    this.unsubscribeFromHistory = history.listen(this.handleLocationChange);
+  };
+
+  ConnectedRouter.prototype.componentWillUnmount = function componentWillUnmount() {
+    if (this.unsubscribeFromHistory) this.unsubscribeFromHistory();
+  };
+
+  ConnectedRouter.prototype.render = function render() {
+    return React.createElement(Router, this.props);
+  };
+
+  return ConnectedRouter;
+}(Component);
+
+ConnectedRouter.propTypes = {
+  store: PropTypes.object,
+  history: PropTypes.object,
+  children: PropTypes.node
+};
+ConnectedRouter.contextTypes = {
+  store: PropTypes.object
+};
+
+
+export default ConnectedRouter;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-router-redux/es/actions.js b/ddb_main/node_modules/react-router-redux/es/actions.js
new file mode 100644
index 0000000..d296dc0
--- /dev/null
+++ b/ddb_main/node_modules/react-router-redux/es/actions.js
@@ -0,0 +1,33 @@
+
+/**
+ * This action type will be dispatched by the history actions below.
+ * If you're writing a middleware to watch for navigation events, be sure to
+ * look for actions of this type.
+ */
+export var CALL_HISTORY_METHOD = '@@router/CALL_HISTORY_METHOD';
+
+function updateLocation(method) {
+  return function () {
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    return {
+      type: CALL_HISTORY_METHOD,
+      payload: { method: method, args: args }
+    };
+  };
+}
+
+/**
+ * These actions correspond to the history API.
+ * The associated routerMiddleware will capture these events before they get to
+ * your reducer and reissue them as the matching function on your history.
+ */
+export var push = updateLocation('push');
+export var replace = updateLocation('replace');
+export var go = updateLocation('go');
+export var goBack = updateLocation('goBack');
+export var goForward = updateLocation('goForward');
+
+export var routerActions = { push: push, replace: replace, go: go, goBack: goBack, goForward: goForward };
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-router-redux/es/reducer.js b/ddb_main/node_modules/react-router-redux/es/reducer.js
new file mode 100644
index 0000000..cd727b0
--- /dev/null
+++ b/ddb_main/node_modules/react-router-redux/es/reducer.js
@@ -0,0 +1,30 @@
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+/**
+ * This action type will be dispatched when your history
+ * receives a location change.
+ */
+export var LOCATION_CHANGE = '@@router/LOCATION_CHANGE';
+
+var initialState = {
+  location: null
+
+  /**
+   * This reducer will update the state with the most recent location history
+   * has transitioned to. This may not be in sync with the router, particularly
+   * if you have asynchronously-loaded routes, so reading from and relying on
+   * this state is discouraged.
+   */
+};export function routerReducer() {
+  var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : initialState;
+
+  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+      type = _ref.type,
+      payload = _ref.payload;
+
+  if (type === LOCATION_CHANGE) {
+    return _extends({}, state, { location: payload });
+  }
+
+  return state;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-router/es/Router.js b/ddb_main/node_modules/react-router/es/Router.js
new file mode 100644
index 0000000..00e1588
--- /dev/null
+++ b/ddb_main/node_modules/react-router/es/Router.js
@@ -0,0 +1,105 @@
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+import warning from "warning";
+import invariant from "invariant";
+import React from "react";
+import PropTypes from "prop-types";
+
+/**
+ * The public API for putting history on context.
+ */
+
+var Router = function (_React$Component) {
+  _inherits(Router, _React$Component);
+
+  function Router() {
+    var _temp, _this, _ret;
+
+    _classCallCheck(this, Router);
+
+    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    return _ret = (_temp = (_this = _possibleConstructorReturn(this, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _this.state = {
+      match: _this.computeMatch(_this.props.history.location.pathname)
+    }, _temp), _possibleConstructorReturn(_this, _ret);
+  }
+
+  Router.prototype.getChildContext = function getChildContext() {
+    return {
+      router: _extends({}, this.context.router, {
+        history: this.props.history,
+        route: {
+          location: this.props.history.location,
+          match: this.state.match
+        }
+      })
+    };
+  };
+
+  Router.prototype.computeMatch = function computeMatch(pathname) {
+    return {
+      path: "/",
+      url: "/",
+      params: {},
+      isExact: pathname === "/"
+    };
+  };
+
+  Router.prototype.componentWillMount = function componentWillMount() {
+    var _this2 = this;
+
+    var _props = this.props,
+        children = _props.children,
+        history = _props.history;
+
+
+    invariant(children == null || React.Children.count(children) === 1, "A <Router> may have only one child element");
+
+    // Do this here so we can setState when a <Redirect> changes the
+    // location in componentWillMount. This happens e.g. when doing
+    // server rendering using a <StaticRouter>.
+    this.unlisten = history.listen(function () {
+      _this2.setState({
+        match: _this2.computeMatch(history.location.pathname)
+      });
+    });
+  };
+
+  Router.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
+    warning(this.props.history === nextProps.history, "You cannot change <Router history>");
+  };
+
+  Router.prototype.componentWillUnmount = function componentWillUnmount() {
+    this.unlisten();
+  };
+
+  Router.prototype.render = function render() {
+    var children = this.props.children;
+
+    return children ? React.Children.only(children) : null;
+  };
+
+  return Router;
+}(React.Component);
+
+Router.propTypes = {
+  history: PropTypes.object.isRequired,
+  children: PropTypes.node
+};
+Router.contextTypes = {
+  router: PropTypes.object
+};
+Router.childContextTypes = {
+  router: PropTypes.object.isRequired
+};
+
+
+export default Router;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-side-effect/lib/index.js b/ddb_main/node_modules/react-side-effect/lib/index.js
new file mode 100644
index 0000000..4d1f864
--- /dev/null
+++ b/ddb_main/node_modules/react-side-effect/lib/index.js
@@ -0,0 +1,125 @@
+'use strict';
+
+function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
+
+var React = require('react');
+var React__default = _interopDefault(React);
+
+function _defineProperty(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+
+  return obj;
+}
+
+function _inheritsLoose(subClass, superClass) {
+  subClass.prototype = Object.create(superClass.prototype);
+  subClass.prototype.constructor = subClass;
+  subClass.__proto__ = superClass;
+}
+
+var canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
+function withSideEffect(reducePropsToState, handleStateChangeOnClient, mapStateOnServer) {
+  if (typeof reducePropsToState !== 'function') {
+    throw new Error('Expected reducePropsToState to be a function.');
+  }
+
+  if (typeof handleStateChangeOnClient !== 'function') {
+    throw new Error('Expected handleStateChangeOnClient to be a function.');
+  }
+
+  if (typeof mapStateOnServer !== 'undefined' && typeof mapStateOnServer !== 'function') {
+    throw new Error('Expected mapStateOnServer to either be undefined or a function.');
+  }
+
+  function getDisplayName(WrappedComponent) {
+    return WrappedComponent.displayName || WrappedComponent.name || 'Component';
+  }
+
+  return function wrap(WrappedComponent) {
+    if (typeof WrappedComponent !== 'function') {
+      throw new Error('Expected WrappedComponent to be a React component.');
+    }
+
+    var mountedInstances = [];
+    var state;
+
+    function emitChange() {
+      state = reducePropsToState(mountedInstances.map(function (instance) {
+        return instance.props;
+      }));
+
+      if (SideEffect.canUseDOM) {
+        handleStateChangeOnClient(state);
+      } else if (mapStateOnServer) {
+        state = mapStateOnServer(state);
+      }
+    }
+
+    var SideEffect =
+    /*#__PURE__*/
+    function (_PureComponent) {
+      _inheritsLoose(SideEffect, _PureComponent);
+
+      function SideEffect() {
+        return _PureComponent.apply(this, arguments) || this;
+      }
+
+      // Try to use displayName of wrapped component
+      // Expose canUseDOM so tests can monkeypatch it
+      SideEffect.peek = function peek() {
+        return state;
+      };
+
+      SideEffect.rewind = function rewind() {
+        if (SideEffect.canUseDOM) {
+          throw new Error('You may only call rewind() on the server. Call peek() to read the current state.');
+        }
+
+        var recordedState = state;
+        state = undefined;
+        mountedInstances = [];
+        return recordedState;
+      };
+
+      var _proto = SideEffect.prototype;
+
+      _proto.UNSAFE_componentWillMount = function UNSAFE_componentWillMount() {
+        mountedInstances.push(this);
+        emitChange();
+      };
+
+      _proto.componentDidUpdate = function componentDidUpdate() {
+        emitChange();
+      };
+
+      _proto.componentWillUnmount = function componentWillUnmount() {
+        var index = mountedInstances.indexOf(this);
+        mountedInstances.splice(index, 1);
+        emitChange();
+      };
+
+      _proto.render = function render() {
+        return React__default.createElement(WrappedComponent, this.props);
+      };
+
+      return SideEffect;
+    }(React.PureComponent);
+
+    _defineProperty(SideEffect, "displayName", "SideEffect(" + getDisplayName(WrappedComponent) + ")");
+
+    _defineProperty(SideEffect, "canUseDOM", canUseDOM);
+
+    return SideEffect;
+  };
+}
+
+module.exports = withSideEffect;
diff --git a/ddb_main/node_modules/react-swipeable-views-core/lib/checkIndexBounds.js b/ddb_main/node_modules/react-swipeable-views-core/lib/checkIndexBounds.js
new file mode 100644
index 0000000..8afe586
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views-core/lib/checkIndexBounds.js
@@ -0,0 +1,24 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _warning = _interopRequireDefault(require("warning"));
+
+var checkIndexBounds = function checkIndexBounds(props) {
+  var index = props.index,
+      children = props.children;
+
+  var childrenCount = _react.default.Children.count(children);
+
+  process.env.NODE_ENV !== "production" ? (0, _warning.default)(index >= 0 && index <= childrenCount, "react-swipeable-view: the new index: ".concat(index, " is out of bounds: [0-").concat(childrenCount, "].")) : void 0;
+};
+
+var _default = checkIndexBounds;
+exports.default = _default;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views-core/lib/computeIndex.js b/ddb_main/node_modules/react-swipeable-views-core/lib/computeIndex.js
new file mode 100644
index 0000000..0e4a363
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views-core/lib/computeIndex.js
@@ -0,0 +1,44 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = computeIndex;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _constant = _interopRequireDefault(require("./constant"));
+
+function computeIndex(params) {
+  var children = params.children,
+      startIndex = params.startIndex,
+      startX = params.startX,
+      pageX = params.pageX,
+      viewLength = params.viewLength,
+      resistance = params.resistance;
+  var indexMax = _react.default.Children.count(children) - 1;
+  var index = startIndex + (startX - pageX) / viewLength;
+  var newStartX;
+
+  if (!resistance) {
+    // Reset the starting point
+    if (index < 0) {
+      index = 0;
+      newStartX = (index - startIndex) * viewLength + pageX;
+    } else if (index > indexMax) {
+      index = indexMax;
+      newStartX = (index - startIndex) * viewLength + pageX;
+    }
+  } else if (index < 0) {
+    index = Math.exp(index * _constant.default.RESISTANCE_COEF) - 1;
+  } else if (index > indexMax) {
+    index = indexMax + 1 - Math.exp((indexMax - index) * _constant.default.RESISTANCE_COEF);
+  }
+
+  return {
+    index: index,
+    startX: newStartX
+  };
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views-core/lib/constant.js b/ddb_main/node_modules/react-swipeable-views-core/lib/constant.js
new file mode 100644
index 0000000..f6e472d
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views-core/lib/constant.js
@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {
+  RESISTANCE_COEF: 0.6,
+  // This value is closed to what browsers are using internally to
+  // trigger a native scroll.
+  UNCERTAINTY_THRESHOLD: 3 // px
+
+};
+exports.default = _default;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views-core/lib/getDisplaySameSlide.js b/ddb_main/node_modules/react-swipeable-views-core/lib/getDisplaySameSlide.js
new file mode 100644
index 0000000..5e7f9a7
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views-core/lib/getDisplaySameSlide.js
@@ -0,0 +1,39 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var getDisplaySameSlide = function getDisplaySameSlide(props, nextProps) {
+  var displaySameSlide = false;
+
+  var getChildrenKey = function getChildrenKey(child) {
+    return child ? child.key : 'empty';
+  };
+
+  if (props.children.length && nextProps.children.length) {
+    var oldKeys = _react.default.Children.map(props.children, getChildrenKey);
+
+    var oldKey = oldKeys[props.index];
+
+    if (oldKey !== null && oldKey !== undefined) {
+      var newKeys = _react.default.Children.map(nextProps.children, getChildrenKey);
+
+      var newKey = newKeys[nextProps.index];
+
+      if (oldKey === newKey) {
+        displaySameSlide = true;
+      }
+    }
+  }
+
+  return displaySameSlide;
+};
+
+var _default = getDisplaySameSlide;
+exports.default = _default;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views-core/lib/index.js b/ddb_main/node_modules/react-swipeable-views-core/lib/index.js
new file mode 100644
index 0000000..5bde6b8
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views-core/lib/index.js
@@ -0,0 +1,47 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "checkIndexBounds", {
+  enumerable: true,
+  get: function get() {
+    return _checkIndexBounds.default;
+  }
+});
+Object.defineProperty(exports, "computeIndex", {
+  enumerable: true,
+  get: function get() {
+    return _computeIndex.default;
+  }
+});
+Object.defineProperty(exports, "constant", {
+  enumerable: true,
+  get: function get() {
+    return _constant.default;
+  }
+});
+Object.defineProperty(exports, "getDisplaySameSlide", {
+  enumerable: true,
+  get: function get() {
+    return _getDisplaySameSlide.default;
+  }
+});
+Object.defineProperty(exports, "mod", {
+  enumerable: true,
+  get: function get() {
+    return _mod.default;
+  }
+});
+
+var _checkIndexBounds = _interopRequireDefault(require("./checkIndexBounds"));
+
+var _computeIndex = _interopRequireDefault(require("./computeIndex"));
+
+var _constant = _interopRequireDefault(require("./constant"));
+
+var _getDisplaySameSlide = _interopRequireDefault(require("./getDisplaySameSlide"));
+
+var _mod = _interopRequireDefault(require("./mod"));
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views-core/lib/mod.js b/ddb_main/node_modules/react-swipeable-views-core/lib/mod.js
new file mode 100644
index 0000000..1fd0d5b
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views-core/lib/mod.js
@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+// Extended version of % with negative integer support.
+function mod(n, m) {
+  var q = n % m;
+  return q < 0 ? q + m : q;
+}
+
+var _default = mod;
+exports.default = _default;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views-core/node_modules/@babel/runtime/helpers/interopRequireDefault.js b/ddb_main/node_modules/react-swipeable-views-core/node_modules/@babel/runtime/helpers/interopRequireDefault.js
new file mode 100644
index 0000000..0e65e2b
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views-core/node_modules/@babel/runtime/helpers/interopRequireDefault.js
@@ -0,0 +1,7 @@
+function _interopRequireDefault(obj) {
+  return obj && obj.__esModule ? obj : {
+    default: obj
+  };
+}
+
+module.exports = _interopRequireDefault;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/lib/SwipeableViews.js b/ddb_main/node_modules/react-swipeable-views/lib/SwipeableViews.js
new file mode 100644
index 0000000..cdcfaf9
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/lib/SwipeableViews.js
@@ -0,0 +1,1027 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getDomTreeShapes = getDomTreeShapes;
+exports.findNativeHandler = findNativeHandler;
+exports.default = exports.SwipeableViewsContext = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _warning = _interopRequireDefault(require("warning"));
+
+var _reactSwipeableViewsCore = require("react-swipeable-views-core");
+
+function addEventListener(node, event, handler, options) {
+  node.addEventListener(event, handler, options);
+  return {
+    remove: function remove() {
+      node.removeEventListener(event, handler, options);
+    }
+  };
+}
+
+var styles = {
+  container: {
+    direction: 'ltr',
+    display: 'flex',
+    willChange: 'transform'
+  },
+  slide: {
+    width: '100%',
+    WebkitFlexShrink: 0,
+    flexShrink: 0,
+    overflow: 'auto'
+  }
+};
+var axisProperties = {
+  root: {
+    x: {
+      overflowX: 'hidden'
+    },
+    'x-reverse': {
+      overflowX: 'hidden'
+    },
+    y: {
+      overflowY: 'hidden'
+    },
+    'y-reverse': {
+      overflowY: 'hidden'
+    }
+  },
+  flexDirection: {
+    x: 'row',
+    'x-reverse': 'row-reverse',
+    y: 'column',
+    'y-reverse': 'column-reverse'
+  },
+  transform: {
+    x: function x(translate) {
+      return "translate(".concat(-translate, "%, 0)");
+    },
+    'x-reverse': function xReverse(translate) {
+      return "translate(".concat(translate, "%, 0)");
+    },
+    y: function y(translate) {
+      return "translate(0, ".concat(-translate, "%)");
+    },
+    'y-reverse': function yReverse(translate) {
+      return "translate(0, ".concat(translate, "%)");
+    }
+  },
+  length: {
+    x: 'width',
+    'x-reverse': 'width',
+    y: 'height',
+    'y-reverse': 'height'
+  },
+  rotationMatrix: {
+    x: {
+      x: [1, 0],
+      y: [0, 1]
+    },
+    'x-reverse': {
+      x: [-1, 0],
+      y: [0, 1]
+    },
+    y: {
+      x: [0, 1],
+      y: [1, 0]
+    },
+    'y-reverse': {
+      x: [0, -1],
+      y: [1, 0]
+    }
+  },
+  scrollPosition: {
+    x: 'scrollLeft',
+    'x-reverse': 'scrollLeft',
+    y: 'scrollTop',
+    'y-reverse': 'scrollTop'
+  },
+  scrollLength: {
+    x: 'scrollWidth',
+    'x-reverse': 'scrollWidth',
+    y: 'scrollHeight',
+    'y-reverse': 'scrollHeight'
+  },
+  clientLength: {
+    x: 'clientWidth',
+    'x-reverse': 'clientWidth',
+    y: 'clientHeight',
+    'y-reverse': 'clientHeight'
+  }
+};
+
+function createTransition(property, options) {
+  var duration = options.duration,
+      easeFunction = options.easeFunction,
+      delay = options.delay;
+  return "".concat(property, " ").concat(duration, " ").concat(easeFunction, " ").concat(delay);
+} // We are using a 2x2 rotation matrix.
+
+
+function applyRotationMatrix(touch, axis) {
+  var rotationMatrix = axisProperties.rotationMatrix[axis];
+  return {
+    pageX: rotationMatrix.x[0] * touch.pageX + rotationMatrix.x[1] * touch.pageY,
+    pageY: rotationMatrix.y[0] * touch.pageX + rotationMatrix.y[1] * touch.pageY
+  };
+}
+
+function adaptMouse(event) {
+  event.touches = [{
+    pageX: event.pageX,
+    pageY: event.pageY
+  }];
+  return event;
+}
+
+function getDomTreeShapes(element, rootNode) {
+  var domTreeShapes = [];
+
+  while (element && element !== rootNode && element !== document.body) {
+    // We reach a Swipeable View, no need to look higher in the dom tree.
+    if (element.hasAttribute('data-swipeable')) {
+      break;
+    }
+
+    var style = window.getComputedStyle(element);
+
+    if ( // Ignore the scroll children if the element is absolute positioned.
+    style.getPropertyValue('position') === 'absolute' || // Ignore the scroll children if the element has an overflowX hidden
+    style.getPropertyValue('overflow-x') === 'hidden') {
+      domTreeShapes = [];
+    } else if (element.clientWidth > 0 && element.scrollWidth > element.clientWidth || element.clientHeight > 0 && element.scrollHeight > element.clientHeight) {
+      // Ignore the nodes that have no width.
+      // Keep elements with a scroll
+      domTreeShapes.push({
+        element: element,
+        scrollWidth: element.scrollWidth,
+        scrollHeight: element.scrollHeight,
+        clientWidth: element.clientWidth,
+        clientHeight: element.clientHeight,
+        scrollLeft: element.scrollLeft,
+        scrollTop: element.scrollTop
+      });
+    }
+
+    element = element.parentNode;
+  }
+
+  return domTreeShapes;
+} // We can only have one node at the time claiming ownership for handling the swipe.
+// Otherwise, the UX would be confusing.
+// That's why we use a singleton here.
+
+
+var nodeWhoClaimedTheScroll = null;
+
+function findNativeHandler(params) {
+  var domTreeShapes = params.domTreeShapes,
+      pageX = params.pageX,
+      startX = params.startX,
+      axis = params.axis;
+  return domTreeShapes.some(function (shape) {
+    // Determine if we are going backward or forward.
+    var goingForward = pageX >= startX;
+
+    if (axis === 'x' || axis === 'y') {
+      goingForward = !goingForward;
+    } // scrollTop is not always be an integer.
+    // https://github.com/jquery/api.jquery.com/issues/608
+
+
+    var scrollPosition = Math.round(shape[axisProperties.scrollPosition[axis]]);
+    var areNotAtStart = scrollPosition > 0;
+    var areNotAtEnd = scrollPosition + shape[axisProperties.clientLength[axis]] < shape[axisProperties.scrollLength[axis]];
+
+    if (goingForward && areNotAtEnd || !goingForward && areNotAtStart) {
+      nodeWhoClaimedTheScroll = shape.element;
+      return true;
+    }
+
+    return false;
+  });
+}
+
+var SwipeableViewsContext = React.createContext();
+exports.SwipeableViewsContext = SwipeableViewsContext;
+
+if (process.env.NODE_ENV !== 'production') {
+  SwipeableViewsContext.displayName = 'SwipeableViewsContext';
+}
+
+var SwipeableViews =
+/*#__PURE__*/
+function (_React$Component) {
+  (0, _inherits2.default)(SwipeableViews, _React$Component);
+
+  function SwipeableViews(props) {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, SwipeableViews);
+    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(SwipeableViews).call(this, props));
+    _this.rootNode = null;
+    _this.containerNode = null;
+    _this.ignoreNextScrollEvents = false;
+    _this.viewLength = 0;
+    _this.startX = 0;
+    _this.lastX = 0;
+    _this.vx = 0;
+    _this.startY = 0;
+    _this.isSwiping = undefined;
+    _this.started = false;
+    _this.startIndex = 0;
+    _this.transitionListener = null;
+    _this.touchMoveListener = null;
+    _this.activeSlide = null;
+    _this.indexCurrent = null;
+    _this.firstRenderTimeout = null;
+
+    _this.setRootNode = function (node) {
+      _this.rootNode = node;
+    };
+
+    _this.setContainerNode = function (node) {
+      _this.containerNode = node;
+    };
+
+    _this.setActiveSlide = function (node) {
+      _this.activeSlide = node;
+
+      _this.updateHeight();
+    };
+
+    _this.handleSwipeStart = function (event) {
+      var axis = _this.props.axis;
+      var touch = applyRotationMatrix(event.touches[0], axis);
+      _this.viewLength = _this.rootNode.getBoundingClientRect()[axisProperties.length[axis]];
+      _this.startX = touch.pageX;
+      _this.lastX = touch.pageX;
+      _this.vx = 0;
+      _this.startY = touch.pageY;
+      _this.isSwiping = undefined;
+      _this.started = true;
+      var computedStyle = window.getComputedStyle(_this.containerNode);
+      var transform = computedStyle.getPropertyValue('-webkit-transform') || computedStyle.getPropertyValue('transform');
+
+      if (transform && transform !== 'none') {
+        var transformValues = transform.split('(')[1].split(')')[0].split(',');
+        var rootStyle = window.getComputedStyle(_this.rootNode);
+        var tranformNormalized = applyRotationMatrix({
+          pageX: parseInt(transformValues[4], 10),
+          pageY: parseInt(transformValues[5], 10)
+        }, axis);
+        _this.startIndex = -tranformNormalized.pageX / (_this.viewLength - parseInt(rootStyle.paddingLeft, 10) - parseInt(rootStyle.paddingRight, 10)) || 0;
+      }
+    };
+
+    _this.handleSwipeMove = function (event) {
+      // The touch start event can be cancel.
+      // Makes sure we set a starting point.
+      if (!_this.started) {
+        _this.handleTouchStart(event);
+
+        return;
+      } // We are not supposed to hanlde this touch move.
+
+
+      if (nodeWhoClaimedTheScroll !== null && nodeWhoClaimedTheScroll !== _this.rootNode) {
+        return;
+      }
+
+      var _this$props = _this.props,
+          axis = _this$props.axis,
+          children = _this$props.children,
+          ignoreNativeScroll = _this$props.ignoreNativeScroll,
+          onSwitching = _this$props.onSwitching,
+          resistance = _this$props.resistance;
+      var touch = applyRotationMatrix(event.touches[0], axis); // We don't know yet.
+
+      if (_this.isSwiping === undefined) {
+        var dx = Math.abs(touch.pageX - _this.startX);
+        var dy = Math.abs(touch.pageY - _this.startY);
+        var isSwiping = dx > dy && dx > _reactSwipeableViewsCore.constant.UNCERTAINTY_THRESHOLD; // We let the parent handle the scroll.
+
+        if (!resistance && (axis === 'y' || axis === 'y-reverse') && (_this.indexCurrent === 0 && _this.startX < touch.pageX || _this.indexCurrent === React.Children.count(_this.props.children) - 1 && _this.startX > touch.pageX)) {
+          _this.isSwiping = false;
+          return;
+        } // We are likely to be swiping, let's prevent the scroll event.
+
+
+        if (dx > dy) {
+          event.preventDefault();
+        }
+
+        if (isSwiping === true || dy > _reactSwipeableViewsCore.constant.UNCERTAINTY_THRESHOLD) {
+          _this.isSwiping = isSwiping;
+          _this.startX = touch.pageX; // Shift the starting point.
+
+          return; // Let's wait the next touch event to move something.
+        }
+      }
+
+      if (_this.isSwiping !== true) {
+        return;
+      } // We are swiping, let's prevent the scroll event.
+
+
+      event.preventDefault(); // Low Pass filter.
+
+      _this.vx = _this.vx * 0.5 + (touch.pageX - _this.lastX) * 0.5;
+      _this.lastX = touch.pageX;
+
+      var _computeIndex = (0, _reactSwipeableViewsCore.computeIndex)({
+        children: children,
+        resistance: resistance,
+        pageX: touch.pageX,
+        startIndex: _this.startIndex,
+        startX: _this.startX,
+        viewLength: _this.viewLength
+      }),
+          index = _computeIndex.index,
+          startX = _computeIndex.startX; // Add support for native scroll elements.
+
+
+      if (nodeWhoClaimedTheScroll === null && !ignoreNativeScroll) {
+        var domTreeShapes = getDomTreeShapes(event.target, _this.rootNode);
+        var hasFoundNativeHandler = findNativeHandler({
+          domTreeShapes: domTreeShapes,
+          startX: _this.startX,
+          pageX: touch.pageX,
+          axis: axis
+        }); // We abort the touch move handler.
+
+        if (hasFoundNativeHandler) {
+          return;
+        }
+      } // We are moving toward the edges.
+
+
+      if (startX) {
+        _this.startX = startX;
+      } else if (nodeWhoClaimedTheScroll === null) {
+        nodeWhoClaimedTheScroll = _this.rootNode;
+      }
+
+      _this.setIndexCurrent(index);
+
+      var callback = function callback() {
+        if (onSwitching) {
+          onSwitching(index, 'move');
+        }
+      };
+
+      if (_this.state.displaySameSlide || !_this.state.isDragging) {
+        _this.setState({
+          displaySameSlide: false,
+          isDragging: true
+        }, callback);
+      }
+
+      callback();
+    };
+
+    _this.handleSwipeEnd = function () {
+      nodeWhoClaimedTheScroll = null; // The touch start event can be cancel.
+      // Makes sure that a starting point is set.
+
+      if (!_this.started) {
+        return;
+      }
+
+      _this.started = false;
+
+      if (_this.isSwiping !== true) {
+        return;
+      }
+
+      var indexLatest = _this.state.indexLatest;
+      var indexCurrent = _this.indexCurrent;
+      var delta = indexLatest - indexCurrent;
+      var indexNew; // Quick movement
+
+      if (Math.abs(_this.vx) > _this.props.threshold) {
+        if (_this.vx > 0) {
+          indexNew = Math.floor(indexCurrent);
+        } else {
+          indexNew = Math.ceil(indexCurrent);
+        }
+      } else if (Math.abs(delta) > _this.props.hysteresis) {
+        // Some hysteresis with indexLatest.
+        indexNew = delta > 0 ? Math.floor(indexCurrent) : Math.ceil(indexCurrent);
+      } else {
+        indexNew = indexLatest;
+      }
+
+      var indexMax = React.Children.count(_this.props.children) - 1;
+
+      if (indexNew < 0) {
+        indexNew = 0;
+      } else if (indexNew > indexMax) {
+        indexNew = indexMax;
+      }
+
+      _this.setIndexCurrent(indexNew);
+
+      _this.setState({
+        indexLatest: indexNew,
+        isDragging: false
+      }, function () {
+        if (_this.props.onSwitching) {
+          _this.props.onSwitching(indexNew, 'end');
+        }
+
+        if (_this.props.onChangeIndex && indexNew !== indexLatest) {
+          _this.props.onChangeIndex(indexNew, indexLatest, {
+            reason: 'swipe'
+          });
+        } // Manually calling handleTransitionEnd in that case as isn't otherwise.
+
+
+        if (indexCurrent === indexLatest) {
+          _this.handleTransitionEnd();
+        }
+      });
+    };
+
+    _this.handleTouchStart = function (event) {
+      if (_this.props.onTouchStart) {
+        _this.props.onTouchStart(event);
+      }
+
+      _this.handleSwipeStart(event);
+    };
+
+    _this.handleTouchEnd = function (event) {
+      if (_this.props.onTouchEnd) {
+        _this.props.onTouchEnd(event);
+      }
+
+      _this.handleSwipeEnd(event);
+    };
+
+    _this.handleMouseDown = function (event) {
+      if (_this.props.onMouseDown) {
+        _this.props.onMouseDown(event);
+      }
+
+      event.persist();
+
+      _this.handleSwipeStart(adaptMouse(event));
+    };
+
+    _this.handleMouseUp = function (event) {
+      if (_this.props.onMouseUp) {
+        _this.props.onMouseUp(event);
+      }
+
+      _this.handleSwipeEnd(adaptMouse(event));
+    };
+
+    _this.handleMouseLeave = function (event) {
+      if (_this.props.onMouseLeave) {
+        _this.props.onMouseLeave(event);
+      } // Filter out events
+
+
+      if (_this.started) {
+        _this.handleSwipeEnd(adaptMouse(event));
+      }
+    };
+
+    _this.handleMouseMove = function (event) {
+      if (_this.props.onMouseMove) {
+        _this.props.onMouseMove(event);
+      } // Filter out events
+
+
+      if (_this.started) {
+        _this.handleSwipeMove(adaptMouse(event));
+      }
+    };
+
+    _this.handleScroll = function (event) {
+      if (_this.props.onScroll) {
+        _this.props.onScroll(event);
+      } // Ignore events bubbling up.
+
+
+      if (event.target !== _this.rootNode) {
+        return;
+      }
+
+      if (_this.ignoreNextScrollEvents) {
+        _this.ignoreNextScrollEvents = false;
+        return;
+      }
+
+      var indexLatest = _this.state.indexLatest;
+      var indexNew = Math.ceil(event.target.scrollLeft / event.target.clientWidth) + indexLatest;
+      _this.ignoreNextScrollEvents = true; // Reset the scroll position.
+
+      event.target.scrollLeft = 0;
+
+      if (_this.props.onChangeIndex && indexNew !== indexLatest) {
+        _this.props.onChangeIndex(indexNew, indexLatest, {
+          reason: 'focus'
+        });
+      }
+    };
+
+    _this.updateHeight = function () {
+      if (_this.activeSlide !== null) {
+        var child = _this.activeSlide.children[0];
+
+        if (child !== undefined && child.offsetHeight !== undefined && _this.state.heightLatest !== child.offsetHeight) {
+          _this.setState({
+            heightLatest: child.offsetHeight
+          });
+        }
+      }
+    };
+
+    if (process.env.NODE_ENV !== 'production') {
+      (0, _reactSwipeableViewsCore.checkIndexBounds)(props);
+    }
+
+    _this.state = {
+      indexLatest: props.index,
+      // Set to true as soon as the component is swiping.
+      // It's the state counter part of this.isSwiping.
+      isDragging: false,
+      // Help with SSR logic and lazy loading logic.
+      renderOnlyActive: !props.disableLazyLoading,
+      heightLatest: 0,
+      // Let the render method that we are going to display the same slide than previously.
+      displaySameSlide: true
+    };
+
+    _this.setIndexCurrent(props.index);
+
+    return _this;
+  }
+
+  (0, _createClass2.default)(SwipeableViews, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var _this2 = this;
+
+      // Subscribe to transition end events.
+      this.transitionListener = addEventListener(this.containerNode, 'transitionend', function (event) {
+        if (event.target !== _this2.containerNode) {
+          return;
+        }
+
+        _this2.handleTransitionEnd();
+      }); // Block the thread to handle that event.
+
+      this.touchMoveListener = addEventListener(this.rootNode, 'touchmove', function (event) {
+        // Handling touch events is disabled.
+        if (_this2.props.disabled) {
+          return;
+        }
+
+        _this2.handleSwipeMove(event);
+      }, {
+        passive: false
+      });
+
+      if (!this.props.disableLazyLoading) {
+        this.firstRenderTimeout = setTimeout(function () {
+          _this2.setState({
+            renderOnlyActive: false
+          });
+        }, 0);
+      } // Send all functions in an object if action param is set.
+
+
+      if (this.props.action) {
+        this.props.action({
+          updateHeight: this.updateHeight
+        });
+      }
+    } // eslint-disable-next-line camelcase,react/sort-comp
+
+  }, {
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(nextProps) {
+      var index = nextProps.index;
+
+      if (typeof index === 'number' && index !== this.props.index) {
+        if (process.env.NODE_ENV !== 'production') {
+          (0, _reactSwipeableViewsCore.checkIndexBounds)(nextProps);
+        }
+
+        this.setIndexCurrent(index);
+        this.setState({
+          // If true, we are going to change the children. We shoudn't animate it.
+          displaySameSlide: (0, _reactSwipeableViewsCore.getDisplaySameSlide)(this.props, nextProps),
+          indexLatest: index
+        });
+      }
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      this.transitionListener.remove();
+      this.touchMoveListener.remove();
+      clearTimeout(this.firstRenderTimeout);
+    }
+  }, {
+    key: "getSwipeableViewsContext",
+    value: function getSwipeableViewsContext() {
+      var _this3 = this;
+
+      return {
+        slideUpdateHeight: function slideUpdateHeight() {
+          _this3.updateHeight();
+        }
+      };
+    }
+  }, {
+    key: "setIndexCurrent",
+    value: function setIndexCurrent(indexCurrent) {
+      if (!this.props.animateTransitions && this.indexCurrent !== indexCurrent) {
+        this.handleTransitionEnd();
+      }
+
+      this.indexCurrent = indexCurrent;
+
+      if (this.containerNode) {
+        var axis = this.props.axis;
+        var transform = axisProperties.transform[axis](indexCurrent * 100);
+        this.containerNode.style.WebkitTransform = transform;
+        this.containerNode.style.transform = transform;
+      }
+    }
+  }, {
+    key: "handleTransitionEnd",
+    value: function handleTransitionEnd() {
+      if (!this.props.onTransitionEnd) {
+        return;
+      } // Filters out when changing the children
+
+
+      if (this.state.displaySameSlide) {
+        return;
+      } // The rest callback is triggered when swiping. It's just noise.
+      // We filter it out.
+
+
+      if (!this.state.isDragging) {
+        this.props.onTransitionEnd();
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this4 = this;
+
+      var _this$props2 = this.props,
+          action = _this$props2.action,
+          animateHeight = _this$props2.animateHeight,
+          animateTransitions = _this$props2.animateTransitions,
+          axis = _this$props2.axis,
+          children = _this$props2.children,
+          containerStyleProp = _this$props2.containerStyle,
+          disabled = _this$props2.disabled,
+          disableLazyLoading = _this$props2.disableLazyLoading,
+          enableMouseEvents = _this$props2.enableMouseEvents,
+          hysteresis = _this$props2.hysteresis,
+          ignoreNativeScroll = _this$props2.ignoreNativeScroll,
+          index = _this$props2.index,
+          onChangeIndex = _this$props2.onChangeIndex,
+          onSwitching = _this$props2.onSwitching,
+          onTransitionEnd = _this$props2.onTransitionEnd,
+          resistance = _this$props2.resistance,
+          slideStyleProp = _this$props2.slideStyle,
+          slideClassName = _this$props2.slideClassName,
+          springConfig = _this$props2.springConfig,
+          style = _this$props2.style,
+          threshold = _this$props2.threshold,
+          other = (0, _objectWithoutProperties2.default)(_this$props2, ["action", "animateHeight", "animateTransitions", "axis", "children", "containerStyle", "disabled", "disableLazyLoading", "enableMouseEvents", "hysteresis", "ignoreNativeScroll", "index", "onChangeIndex", "onSwitching", "onTransitionEnd", "resistance", "slideStyle", "slideClassName", "springConfig", "style", "threshold"]);
+      var _this$state = this.state,
+          displaySameSlide = _this$state.displaySameSlide,
+          heightLatest = _this$state.heightLatest,
+          indexLatest = _this$state.indexLatest,
+          isDragging = _this$state.isDragging,
+          renderOnlyActive = _this$state.renderOnlyActive;
+      var touchEvents = !disabled ? {
+        onTouchStart: this.handleTouchStart,
+        onTouchEnd: this.handleTouchEnd
+      } : {};
+      var mouseEvents = !disabled && enableMouseEvents ? {
+        onMouseDown: this.handleMouseDown,
+        onMouseUp: this.handleMouseUp,
+        onMouseLeave: this.handleMouseLeave,
+        onMouseMove: this.handleMouseMove
+      } : {}; // There is no point to animate if we are already providing a height.
+
+      process.env.NODE_ENV !== "production" ? (0, _warning.default)(!animateHeight || !containerStyleProp || !containerStyleProp.height, "react-swipeable-view: You are setting animateHeight to true but you are\nalso providing a custom height.\nThe custom height has a higher priority than the animateHeight property.\nSo animateHeight is most likely having no effect at all.") : void 0;
+      var slideStyle = (0, _extends2.default)({}, styles.slide, slideStyleProp);
+      var transition;
+      var WebkitTransition;
+
+      if (isDragging || !animateTransitions || displaySameSlide) {
+        transition = 'all 0s ease 0s';
+        WebkitTransition = 'all 0s ease 0s';
+      } else {
+        transition = createTransition('transform', springConfig);
+        WebkitTransition = createTransition('-webkit-transform', springConfig);
+
+        if (heightLatest !== 0) {
+          var additionalTranstion = ", ".concat(createTransition('height', springConfig));
+          transition += additionalTranstion;
+          WebkitTransition += additionalTranstion;
+        }
+      }
+
+      var containerStyle = {
+        height: null,
+        WebkitFlexDirection: axisProperties.flexDirection[axis],
+        flexDirection: axisProperties.flexDirection[axis],
+        WebkitTransition: WebkitTransition,
+        transition: transition
+      }; // Apply the styles for SSR considerations
+
+      if (!renderOnlyActive) {
+        var transform = axisProperties.transform[axis](this.indexCurrent * 100);
+        containerStyle.WebkitTransform = transform;
+        containerStyle.transform = transform;
+      }
+
+      if (animateHeight) {
+        containerStyle.height = heightLatest;
+      }
+
+      return React.createElement(SwipeableViewsContext.Provider, {
+        value: this.getSwipeableViewsContext()
+      }, React.createElement("div", (0, _extends2.default)({
+        ref: this.setRootNode,
+        style: (0, _extends2.default)({}, axisProperties.root[axis], style)
+      }, other, touchEvents, mouseEvents, {
+        onScroll: this.handleScroll
+      }), React.createElement("div", {
+        ref: this.setContainerNode,
+        style: (0, _extends2.default)({}, containerStyle, styles.container, containerStyleProp),
+        className: "react-swipeable-view-container"
+      }, React.Children.map(children, function (child, indexChild) {
+        if (renderOnlyActive && indexChild !== indexLatest) {
+          return null;
+        }
+
+        process.env.NODE_ENV !== "production" ? (0, _warning.default)(React.isValidElement(child), "react-swipeable-view: one of the children provided is invalid: ".concat(child, ".\n  We are expecting a valid React Element")) : void 0;
+        var ref;
+        var hidden = true;
+
+        if (indexChild === indexLatest) {
+          hidden = false;
+
+          if (animateHeight) {
+            ref = _this4.setActiveSlide;
+            slideStyle.overflowY = 'hidden';
+          }
+        }
+
+        return React.createElement("div", {
+          ref: ref,
+          style: slideStyle,
+          className: slideClassName,
+          "aria-hidden": hidden,
+          "data-swipeable": "true"
+        }, child);
+      }))));
+    }
+  }]);
+  return SwipeableViews;
+}(React.Component); // Added as an ads for people using the React dev tools in production.
+// So they know, the tool used to build the awesome UI they
+// are looking at/retro engineering.
+
+
+SwipeableViews.displayName = 'ReactSwipableView';
+SwipeableViews.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * This is callback property. It's called by the component on mount.
+   * This is useful when you want to trigger an action programmatically.
+   * It currently only supports updateHeight() action.
+   *
+   * @param {object} actions This object contains all posible actions
+   * that can be triggered programmatically.
+   */
+  action: _propTypes.default.func,
+
+  /**
+   * If `true`, the height of the container will be animated to match the current slide height.
+   * Animating another style property has a negative impact regarding performance.
+   */
+  animateHeight: _propTypes.default.bool,
+
+  /**
+   * If `false`, changes to the index prop will not cause an animated transition.
+   */
+  animateTransitions: _propTypes.default.bool,
+
+  /**
+   * The axis on which the slides will slide.
+   */
+  axis: _propTypes.default.oneOf(['x', 'x-reverse', 'y', 'y-reverse']),
+
+  /**
+   * Use this property to provide your slides.
+   */
+  children: _propTypes.default.node.isRequired,
+
+  /**
+   * This is the inlined style that will be applied
+   * to each slide container.
+   */
+  containerStyle: _propTypes.default.object,
+
+  /**
+   * If `true`, it will disable touch events.
+   * This is useful when you want to prohibit the user from changing slides.
+   */
+  disabled: _propTypes.default.bool,
+
+  /**
+   * This is the config used to disable lazyloding,
+   * if `true` will render all the views in first rendering.
+   */
+  disableLazyLoading: _propTypes.default.bool,
+
+  /**
+   * If `true`, it will enable mouse events.
+   * This will allow the user to perform the relevant swipe actions with a mouse.
+   */
+  enableMouseEvents: _propTypes.default.bool,
+
+  /**
+   * Configure hysteresis between slides. This value determines how far
+   * should user swipe to switch slide.
+   */
+  hysteresis: _propTypes.default.number,
+
+  /**
+   * If `true`, it will ignore native scroll container.
+   * It can be used to filter out false positive that blocks the swipe.
+   */
+  ignoreNativeScroll: _propTypes.default.bool,
+
+  /**
+   * This is the index of the slide to show.
+   * This is useful when you want to change the default slide shown.
+   * Or when you have tabs linked to each slide.
+   */
+  index: _propTypes.default.number,
+
+  /**
+   * This is callback prop. It's call by the
+   * component when the shown slide change after a swipe made by the user.
+   * This is useful when you have tabs linked to each slide.
+   *
+   * @param {integer} index This is the current index of the slide.
+   * @param {integer} indexLatest This is the oldest index of the slide.
+   * @param {object} meta Meta data containing more information about the event.
+   */
+  onChangeIndex: _propTypes.default.func,
+
+  /**
+   * @ignore
+   */
+  onMouseDown: _propTypes.default.func,
+
+  /**
+   * @ignore
+   */
+  onMouseLeave: _propTypes.default.func,
+
+  /**
+   * @ignore
+   */
+  onMouseMove: _propTypes.default.func,
+
+  /**
+   * @ignore
+   */
+  onMouseUp: _propTypes.default.func,
+
+  /**
+   * @ignore
+   */
+  onScroll: _propTypes.default.func,
+
+  /**
+   * This is callback prop. It's called by the
+   * component when the slide switching.
+   * This is useful when you want to implement something corresponding
+   * to the current slide position.
+   *
+   * @param {integer} index This is the current index of the slide.
+   * @param {string} type Can be either `move` or `end`.
+   */
+  onSwitching: _propTypes.default.func,
+
+  /**
+   * @ignore
+   */
+  onTouchEnd: _propTypes.default.func,
+
+  /**
+   * @ignore
+   */
+  onTouchMove: _propTypes.default.func,
+
+  /**
+   * @ignore
+   */
+  onTouchStart: _propTypes.default.func,
+
+  /**
+   * The callback that fires when the animation comes to a rest.
+   * This is useful to defer CPU intensive task.
+   */
+  onTransitionEnd: _propTypes.default.func,
+
+  /**
+   * If `true`, it will add bounds effect on the edges.
+   */
+  resistance: _propTypes.default.bool,
+
+  /**
+   * This is the className that will be applied
+   * on the slide component.
+   */
+  slideClassName: _propTypes.default.string,
+
+  /**
+   * This is the inlined style that will be applied
+   * on the slide component.
+   */
+  slideStyle: _propTypes.default.object,
+
+  /**
+   * This is the config used to create CSS transitions.
+   * This is useful to change the dynamic of the transition.
+   */
+  springConfig: _propTypes.default.shape({
+    delay: _propTypes.default.string,
+    duration: _propTypes.default.string,
+    easeFunction: _propTypes.default.string
+  }),
+
+  /**
+   * This is the inlined style that will be applied
+   * on the root component.
+   */
+  style: _propTypes.default.object,
+
+  /**
+   * This is the threshold used for detecting a quick swipe.
+   * If the computed speed is above this value, the index change.
+   */
+  threshold: _propTypes.default.number
+} : {};
+SwipeableViews.defaultProps = {
+  animateHeight: false,
+  animateTransitions: true,
+  axis: 'x',
+  disabled: false,
+  disableLazyLoading: false,
+  enableMouseEvents: false,
+  hysteresis: 0.6,
+  ignoreNativeScroll: false,
+  index: 0,
+  threshold: 5,
+  springConfig: {
+    duration: '0.35s',
+    easeFunction: 'cubic-bezier(0.15, 0.3, 0.25, 1)',
+    delay: '0s'
+  },
+  resistance: false
+};
+var _default = SwipeableViews;
+exports.default = _default;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/lib/index.js b/ddb_main/node_modules/react-swipeable-views/lib/index.js
new file mode 100644
index 0000000..4f71173
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/lib/index.js
@@ -0,0 +1,21 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _SwipeableViews.default;
+  }
+});
+Object.defineProperty(exports, "SwipeableViewsContext", {
+  enumerable: true,
+  get: function get() {
+    return _SwipeableViews.SwipeableViewsContext;
+  }
+});
+
+var _SwipeableViews = _interopRequireWildcard(require("./SwipeableViews"));
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/assertThisInitialized.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/assertThisInitialized.js
new file mode 100644
index 0000000..98d2949
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/assertThisInitialized.js
@@ -0,0 +1,9 @@
+function _assertThisInitialized(self) {
+  if (self === void 0) {
+    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+  }
+
+  return self;
+}
+
+module.exports = _assertThisInitialized;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/classCallCheck.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/classCallCheck.js
new file mode 100644
index 0000000..f389f2e
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/classCallCheck.js
@@ -0,0 +1,7 @@
+function _classCallCheck(instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
+  }
+}
+
+module.exports = _classCallCheck;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/createClass.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/createClass.js
new file mode 100644
index 0000000..f9d4841
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/createClass.js
@@ -0,0 +1,17 @@
+function _defineProperties(target, props) {
+  for (var i = 0; i < props.length; i++) {
+    var descriptor = props[i];
+    descriptor.enumerable = descriptor.enumerable || false;
+    descriptor.configurable = true;
+    if ("value" in descriptor) descriptor.writable = true;
+    Object.defineProperty(target, descriptor.key, descriptor);
+  }
+}
+
+function _createClass(Constructor, protoProps, staticProps) {
+  if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+  if (staticProps) _defineProperties(Constructor, staticProps);
+  return Constructor;
+}
+
+module.exports = _createClass;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/extends.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/extends.js
new file mode 100644
index 0000000..1816877
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/extends.js
@@ -0,0 +1,19 @@
+function _extends() {
+  module.exports = _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends.apply(this, arguments);
+}
+
+module.exports = _extends;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/getPrototypeOf.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/getPrototypeOf.js
new file mode 100644
index 0000000..5fc9a16
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/getPrototypeOf.js
@@ -0,0 +1,8 @@
+function _getPrototypeOf(o) {
+  module.exports = _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
+    return o.__proto__ || Object.getPrototypeOf(o);
+  };
+  return _getPrototypeOf(o);
+}
+
+module.exports = _getPrototypeOf;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/inherits.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/inherits.js
new file mode 100644
index 0000000..6b4f286
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/inherits.js
@@ -0,0 +1,18 @@
+var setPrototypeOf = require("./setPrototypeOf");
+
+function _inherits(subClass, superClass) {
+  if (typeof superClass !== "function" && superClass !== null) {
+    throw new TypeError("Super expression must either be null or a function");
+  }
+
+  subClass.prototype = Object.create(superClass && superClass.prototype, {
+    constructor: {
+      value: subClass,
+      writable: true,
+      configurable: true
+    }
+  });
+  if (superClass) setPrototypeOf(subClass, superClass);
+}
+
+module.exports = _inherits;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/interopRequireDefault.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/interopRequireDefault.js
new file mode 100644
index 0000000..0e65e2b
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/interopRequireDefault.js
@@ -0,0 +1,7 @@
+function _interopRequireDefault(obj) {
+  return obj && obj.__esModule ? obj : {
+    default: obj
+  };
+}
+
+module.exports = _interopRequireDefault;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/interopRequireWildcard.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/interopRequireWildcard.js
new file mode 100644
index 0000000..baf08e2
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/interopRequireWildcard.js
@@ -0,0 +1,26 @@
+function _interopRequireWildcard(obj) {
+  if (obj && obj.__esModule) {
+    return obj;
+  } else {
+    var newObj = {};
+
+    if (obj != null) {
+      for (var key in obj) {
+        if (Object.prototype.hasOwnProperty.call(obj, key)) {
+          var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {};
+
+          if (desc.get || desc.set) {
+            Object.defineProperty(newObj, key, desc);
+          } else {
+            newObj[key] = obj[key];
+          }
+        }
+      }
+    }
+
+    newObj.default = obj;
+    return newObj;
+  }
+}
+
+module.exports = _interopRequireWildcard;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/objectWithoutProperties.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/objectWithoutProperties.js
new file mode 100644
index 0000000..253d33c
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/objectWithoutProperties.js
@@ -0,0 +1,22 @@
+var objectWithoutPropertiesLoose = require("./objectWithoutPropertiesLoose");
+
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+
+  return target;
+}
+
+module.exports = _objectWithoutProperties;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js
new file mode 100644
index 0000000..a58c56b
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js
@@ -0,0 +1,16 @@
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+
+  return target;
+}
+
+module.exports = _objectWithoutPropertiesLoose;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/possibleConstructorReturn.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/possibleConstructorReturn.js
new file mode 100644
index 0000000..84f7bf6
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/possibleConstructorReturn.js
@@ -0,0 +1,13 @@
+var _typeof = require("../helpers/typeof");
+
+var assertThisInitialized = require("./assertThisInitialized");
+
+function _possibleConstructorReturn(self, call) {
+  if (call && (_typeof(call) === "object" || typeof call === "function")) {
+    return call;
+  }
+
+  return assertThisInitialized(self);
+}
+
+module.exports = _possibleConstructorReturn;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/setPrototypeOf.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/setPrototypeOf.js
new file mode 100644
index 0000000..d86e2fc
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/setPrototypeOf.js
@@ -0,0 +1,10 @@
+function _setPrototypeOf(o, p) {
+  module.exports = _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
+    o.__proto__ = p;
+    return o;
+  };
+
+  return _setPrototypeOf(o, p);
+}
+
+module.exports = _setPrototypeOf;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/typeof.js b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/typeof.js
new file mode 100644
index 0000000..fd7d3ed
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable-views/node_modules/@babel/runtime/helpers/typeof.js
@@ -0,0 +1,17 @@
+function _typeof2(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof2 = function _typeof2(obj) { return typeof obj; }; } else { _typeof2 = function _typeof2(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof2(obj); }
+
+function _typeof(obj) {
+  if (typeof Symbol === "function" && _typeof2(Symbol.iterator) === "symbol") {
+    module.exports = _typeof = function _typeof(obj) {
+      return _typeof2(obj);
+    };
+  } else {
+    module.exports = _typeof = function _typeof(obj) {
+      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : _typeof2(obj);
+    };
+  }
+
+  return _typeof(obj);
+}
+
+module.exports = _typeof;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-swipeable/src/index.ts b/ddb_main/node_modules/react-swipeable/src/index.ts
new file mode 100644
index 0000000..f300e71
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable/src/index.ts
@@ -0,0 +1,348 @@
+/* global document */
+import * as React from "react";
+import {
+  AttachTouch,
+  SwipeDirections,
+  DOWN,
+  SwipeEventData,
+  HandledEvents,
+  LEFT,
+  RIGHT,
+  Setter,
+  ConfigurationOptions,
+  SwipeableCallbacks,
+  SwipeableHandlers,
+  SwipeableProps,
+  SwipeablePropsWithDefaultOptions,
+  SwipeableState,
+  SwipeCallback,
+  TapCallback,
+  UP,
+  Vector2,
+} from "./types";
+
+export {
+  LEFT,
+  RIGHT,
+  UP,
+  DOWN,
+  SwipeDirections,
+  SwipeEventData,
+  SwipeCallback,
+  TapCallback,
+  SwipeableHandlers,
+  SwipeableProps,
+  Vector2,
+};
+
+const defaultProps: ConfigurationOptions = {
+  delta: 10,
+  preventDefaultTouchmoveEvent: false,
+  rotationAngle: 0,
+  trackMouse: false,
+  trackTouch: true,
+};
+const initialState: SwipeableState = {
+  first: true,
+  initial: [0, 0],
+  start: 0,
+  swiping: false,
+  xy: [0, 0],
+};
+const mouseMove = "mousemove";
+const mouseUp = "mouseup";
+const touchEnd = "touchend";
+const touchMove = "touchmove";
+const touchStart = "touchstart";
+
+function getDirection(
+  absX: number,
+  absY: number,
+  deltaX: number,
+  deltaY: number
+): SwipeDirections {
+  if (absX > absY) {
+    if (deltaX > 0) {
+      return RIGHT;
+    }
+    return LEFT;
+  } else if (deltaY > 0) {
+    return DOWN;
+  }
+  return UP;
+}
+
+function rotateXYByAngle(pos: Vector2, angle: number): Vector2 {
+  if (angle === 0) return pos;
+  const angleInRadians = (Math.PI / 180) * angle;
+  const x =
+    pos[0] * Math.cos(angleInRadians) + pos[1] * Math.sin(angleInRadians);
+  const y =
+    pos[1] * Math.cos(angleInRadians) - pos[0] * Math.sin(angleInRadians);
+  return [x, y];
+}
+
+function getHandlers(
+  set: Setter,
+  handlerProps: { trackMouse: boolean | undefined }
+): [
+  {
+    ref: (element: HTMLElement | null) => void;
+    onMouseDown?: (event: React.MouseEvent) => void;
+  },
+  AttachTouch
+] {
+  const onStart = (event: HandledEvents) => {
+    // if more than a single touch don't track, for now...
+    if (event && "touches" in event && event.touches.length > 1) return;
+
+    set((state, props) => {
+      // setup mouse listeners on document to track swipe since swipe can leave container
+      if (props.trackMouse) {
+        document.addEventListener(mouseMove, onMove);
+        document.addEventListener(mouseUp, onUp);
+      }
+      const { clientX, clientY } =
+        "touches" in event ? event.touches[0] : event;
+      const xy = rotateXYByAngle([clientX, clientY], props.rotationAngle);
+      return {
+        ...state,
+        ...initialState,
+        initial: [...xy],
+        xy,
+        start: event.timeStamp || 0,
+      };
+    });
+  };
+
+  const onMove = (event: HandledEvents) => {
+    set((state, props) => {
+      // Discount a swipe if additional touches are present after
+      // a swipe has started.
+      if ("touches" in event && event.touches.length > 1) {
+        return state;
+      }
+      const { clientX, clientY } =
+        "touches" in event ? event.touches[0] : event;
+      const [x, y] = rotateXYByAngle([clientX, clientY], props.rotationAngle);
+      const deltaX = x - state.xy[0];
+      const deltaY = y - state.xy[1];
+      const absX = Math.abs(deltaX);
+      const absY = Math.abs(deltaY);
+      const time = (event.timeStamp || 0) - state.start;
+      const velocity = Math.sqrt(absX * absX + absY * absY) / (time || 1);
+      const vxvy: Vector2 = [deltaX / (time || 1), deltaY / (time || 1)];
+
+      const dir = getDirection(absX, absY, deltaX, deltaY);
+
+      // if swipe is under delta and we have not started to track a swipe: skip update
+      const delta =
+        typeof props.delta === "number"
+          ? props.delta
+          : props.delta[dir.toLowerCase() as Lowercase<SwipeDirections>] ||
+            defaultProps.delta;
+      if (absX < delta && absY < delta && !state.swiping) return state;
+
+      const eventData = {
+        absX,
+        absY,
+        deltaX,
+        deltaY,
+        dir,
+        event,
+        first: state.first,
+        initial: state.initial,
+        velocity,
+        vxvy,
+      };
+
+      // call onSwipeStart if present and is first swipe event
+      eventData.first && props.onSwipeStart && props.onSwipeStart(eventData);
+
+      // Call onSwiping if present
+      props.onSwiping && props.onSwiping(eventData);
+
+      // track if a swipe is cancelable(handler for swiping or swiped(dir) exists)
+      // so we can call preventDefault if needed
+      let cancelablePageSwipe = false;
+      if (props.onSwiping || props.onSwiped || `onSwiped${dir}` in props) {
+        cancelablePageSwipe = true;
+      }
+
+      if (
+        cancelablePageSwipe &&
+        props.preventDefaultTouchmoveEvent &&
+        props.trackTouch &&
+        event.cancelable
+      )
+        event.preventDefault();
+
+      return {
+        ...state,
+        // first is now always false
+        first: false,
+        eventData,
+        swiping: true,
+      };
+    });
+  };
+
+  const onEnd = (event: HandledEvents) => {
+    set((state, props) => {
+      let eventData: SwipeEventData | undefined;
+      if (state.swiping && state.eventData) {
+        eventData = { ...state.eventData, event };
+        props.onSwiped && props.onSwiped(eventData);
+
+        const onSwipedDir =
+          props[`onSwiped${eventData.dir}` as keyof SwipeableCallbacks];
+        onSwipedDir && onSwipedDir(eventData);
+      } else {
+        props.onTap && props.onTap({ event });
+      }
+      return { ...state, ...initialState, eventData };
+    });
+  };
+
+  const cleanUpMouse = () => {
+    // safe to just call removeEventListener
+    document.removeEventListener(mouseMove, onMove);
+    document.removeEventListener(mouseUp, onUp);
+  };
+
+  const onUp = (e: HandledEvents) => {
+    cleanUpMouse();
+    onEnd(e);
+  };
+
+  /**
+   * Switch of "passive" property for now.
+   * When `preventDefaultTouchmoveEvent` is:
+   * - true => { passive: false }
+   * - false => { passive: true }
+   *
+   * Could take entire `addEventListener` options object as a param later?
+   */
+  const attachTouch: AttachTouch = (el, passive) => {
+    let cleanup = () => {};
+    if (el && el.addEventListener) {
+      // attach touch event listeners and handlers
+      const tls: [
+        typeof touchStart | typeof touchMove | typeof touchEnd,
+        (e: HandledEvents) => void
+      ][] = [
+        [touchStart, onStart],
+        [touchMove, onMove],
+        [touchEnd, onEnd],
+      ];
+      tls.forEach(([e, h]) => el.addEventListener(e, h, { passive }));
+      // return properly scoped cleanup method for removing listeners, options not required
+      cleanup = () => tls.forEach(([e, h]) => el.removeEventListener(e, h));
+    }
+    return cleanup;
+  };
+
+  const onRef = (el: HTMLElement | null) => {
+    // "inline" ref functions are called twice on render, once with null then again with DOM element
+    // ignore null here
+    if (el === null) return;
+    set((state, props) => {
+      // if the same DOM el as previous just return state
+      if (state.el === el) return state;
+
+      const addState: { cleanUpTouch?: () => void } = {};
+      // if new DOM el clean up old DOM and reset cleanUpTouch
+      if (state.el && state.el !== el && state.cleanUpTouch) {
+        state.cleanUpTouch();
+        addState.cleanUpTouch = void 0;
+      }
+      // only attach if we want to track touch
+      if (props.trackTouch && el) {
+        addState.cleanUpTouch = attachTouch(
+          el,
+          !props.preventDefaultTouchmoveEvent
+        );
+      }
+
+      // store event attached DOM el for comparison, clean up, and re-attachment
+      return { ...state, el, ...addState };
+    });
+  };
+
+  // set ref callback to attach touch event listeners
+  const output: { ref: typeof onRef; onMouseDown?: typeof onStart } = {
+    ref: onRef,
+  };
+
+  // if track mouse attach mouse down listener
+  if (handlerProps.trackMouse) {
+    output.onMouseDown = onStart;
+  }
+
+  return [output, attachTouch];
+}
+
+function updateTransientState(
+  state: SwipeableState,
+  props: SwipeableProps,
+  attachTouch: AttachTouch
+) {
+  const addState: { cleanUpTouch?(): void } = {};
+  // clean up touch handlers if no longer tracking touches
+  if (!props.trackTouch && state.cleanUpTouch) {
+    state.cleanUpTouch();
+    addState.cleanUpTouch = void 0;
+  } else if (props.trackTouch && !state.cleanUpTouch) {
+    // attach/re-attach touch handlers
+    if (state.el) {
+      addState.cleanUpTouch = attachTouch(
+        state.el,
+        !props.preventDefaultTouchmoveEvent
+      );
+    }
+  }
+  return { ...state, ...addState };
+}
+
+export function useSwipeable(options: SwipeableProps): SwipeableHandlers {
+  const { trackMouse } = options;
+  const transientState = React.useRef({ ...initialState });
+  const transientProps = React.useRef<SwipeablePropsWithDefaultOptions>({
+    ...defaultProps,
+  });
+  transientProps.current = {
+    ...defaultProps,
+    ...options,
+    // Force defaults for config properties
+    delta: options.delta === void 0 ? defaultProps.delta : options.delta,
+    rotationAngle:
+      options.rotationAngle === void 0
+        ? defaultProps.rotationAngle
+        : options.rotationAngle,
+    trackTouch:
+      options.trackTouch === void 0
+        ? defaultProps.trackTouch
+        : options.trackTouch,
+  };
+
+  const [handlers, attachTouch] = React.useMemo(
+    () =>
+      getHandlers(
+        (stateSetter) =>
+          (transientState.current = stateSetter(
+            transientState.current,
+            transientProps.current
+          )),
+        { trackMouse }
+      ),
+    [trackMouse]
+  );
+
+  transientState.current = updateTransientState(
+    transientState.current,
+    transientProps.current,
+    attachTouch
+  );
+
+  return handlers;
+}
diff --git a/ddb_main/node_modules/react-swipeable/src/types.ts b/ddb_main/node_modules/react-swipeable/src/types.ts
new file mode 100644
index 0000000..638eaef
--- /dev/null
+++ b/ddb_main/node_modules/react-swipeable/src/types.ts
@@ -0,0 +1,80 @@
+import * as React from "react";
+
+export const LEFT = "Left";
+export const RIGHT = "Right";
+export const UP = "Up";
+export const DOWN = "Down";
+export type HandledEvents = React.MouseEvent | TouchEvent | MouseEvent;
+export type Vector2 = [number, number];
+export type SwipeDirections =
+  | typeof LEFT
+  | typeof RIGHT
+  | typeof UP
+  | typeof DOWN;
+export interface SwipeEventData {
+  absX: number;
+  absY: number;
+  deltaX: number;
+  deltaY: number;
+  dir: SwipeDirections;
+  event: HandledEvents;
+  first: boolean;
+  initial: Vector2;
+  velocity: number;
+  vxvy: Vector2;
+}
+
+export type SwipeCallback = (eventData: SwipeEventData) => void;
+export type TapCallback = ({ event }: { event: HandledEvents }) => void;
+
+export type SwipeableCallbacks = {
+  // Event handler/callbacks
+  onSwipeStart: SwipeCallback;
+  onSwiped: SwipeCallback;
+  onSwipedDown: SwipeCallback;
+  onSwipedLeft: SwipeCallback;
+  onSwipedRight: SwipeCallback;
+  onSwipedUp: SwipeCallback;
+  onSwiping: SwipeCallback;
+  onTap: TapCallback;
+};
+
+// Configuration Options
+export type ConfigurationOptionDelta =
+  | number
+  | { [key in Lowercase<SwipeDirections>]?: number };
+export interface ConfigurationOptions {
+  delta: ConfigurationOptionDelta;
+  preventDefaultTouchmoveEvent: boolean;
+  rotationAngle: number;
+  trackMouse: boolean;
+  trackTouch: boolean;
+}
+
+export type SwipeableProps = Partial<SwipeableCallbacks & ConfigurationOptions>;
+
+export type SwipeablePropsWithDefaultOptions = Partial<SwipeableCallbacks> &
+  ConfigurationOptions;
+
+export interface SwipeableHandlers {
+  ref(element: HTMLElement | null): void;
+  onMouseDown?(event: React.MouseEvent): void;
+}
+
+export type SwipeableState = {
+  cleanUpTouch?: () => void;
+  el?: HTMLElement;
+  eventData?: SwipeEventData;
+  first: boolean;
+  initial: Vector2;
+  start: number;
+  swiping: boolean;
+  xy: Vector2;
+};
+
+export type StateSetter = (
+  state: SwipeableState,
+  props: SwipeablePropsWithDefaultOptions
+) => SwipeableState;
+export type Setter = (stateSetter: StateSetter) => void;
+export type AttachTouch = (el: HTMLElement, passive: boolean) => () => void;
diff --git a/ddb_main/node_modules/react-tooltip/dist/react-tooltip.min.mjs b/ddb_main/node_modules/react-tooltip/dist/react-tooltip.min.mjs
new file mode 100644
index 0000000..9b1607c
--- /dev/null
+++ b/ddb_main/node_modules/react-tooltip/dist/react-tooltip.min.mjs
@@ -0,0 +1,8 @@
+/*
+* React Tooltip
+* {@link https://github.com/ReactTooltip/react-tooltip}
+* @copyright ReactTooltip Team
+* @license MIT
+*/
+import e,{useLayoutEffect as t,useEffect as o,createContext as l,useState as r,useCallback as n,useMemo as i,useContext as c,useRef as s,useImperativeHandle as a}from"react";import{arrow as u,computePosition as d,offset as p,flip as v,shift as m,autoUpdate as f}from"@floating-ui/dom";import y from"classnames";const h="react-tooltip-core-styles",w="react-tooltip-base-styles",b={core:!1,base:!1};function S({css:e,id:t=w,type:o="base",ref:l}){var r,n;if(!e||"undefined"==typeof document||b[o])return;if("core"===o&&"undefined"!=typeof process&&(null===(r=null===process||void 0===process?void 0:process.env)||void 0===r?void 0:r.REACT_TOOLTIP_DISABLE_CORE_STYLES))return;if("base"!==o&&"undefined"!=typeof process&&(null===(n=null===process||void 0===process?void 0:process.env)||void 0===n?void 0:n.REACT_TOOLTIP_DISABLE_BASE_STYLES))return;"core"===o&&(t=h),l||(l={});const{insertAt:i}=l;if(document.getElementById(t))return;const c=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.id=t,s.type="text/css","top"===i&&c.firstChild?c.insertBefore(s,c.firstChild):c.appendChild(s),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(document.createTextNode(e)),b[o]=!0}function g({type:e="base",id:t=w}={}){if(!b[e])return;"core"===e&&(t=h);const o=document.getElementById(t);"style"===(null==o?void 0:o.tagName)?null==o||o.remove():console.warn(`[react-tooltip] Failed to remove 'style' element with id '${t}'. Call \`injectStyle()\` first`),b[e]=!1}const E=async({elementReference:e=null,tooltipReference:t=null,tooltipArrowReference:o=null,place:l="top",offset:r=10,strategy:n="absolute",middlewares:i=[p(Number(r)),v({fallbackAxisSideDirection:"start"}),m({padding:5})],border:c})=>{if(!e)return{tooltipStyles:{},tooltipArrowStyles:{},place:l};if(null===t)return{tooltipStyles:{},tooltipArrowStyles:{},place:l};const s=i;return o?(s.push(u({element:o,padding:5})),d(e,t,{placement:l,strategy:n,middleware:s}).then((({x:e,y:t,placement:o,middlewareData:l})=>{var r,n;const i={left:`${e}px`,top:`${t}px`,border:c},{x:s,y:a}=null!==(r=l.arrow)&&void 0!==r?r:{x:0,y:0},u=null!==(n={top:"bottom",right:"left",bottom:"top",left:"right"}[o.split("-")[0]])&&void 0!==n?n:"bottom",d=c&&{borderBottom:c,borderRight:c};let p=0;if(c){const e=`${c}`.match(/(\d+)px/);p=(null==e?void 0:e[1])?Number(e[1]):1}return{tooltipStyles:i,tooltipArrowStyles:{left:null!=s?`${s}px`:"",top:null!=a?`${a}px`:"",right:"",bottom:"",...d,[u]:`-${4+p}px`},place:o}}))):d(e,t,{placement:"bottom",strategy:n,middleware:s}).then((({x:e,y:t,placement:o})=>({tooltipStyles:{left:`${e}px`,top:`${t}px`},tooltipArrowStyles:{},place:o})))},A=(e,t)=>!("CSS"in window&&"supports"in window.CSS)||window.CSS.supports(e,t),_=(e,t,o)=>{let l=null;const r=function(...r){const n=()=>{l=null,o||e.apply(this,r)};o&&!l&&(e.apply(this,r),l=setTimeout(n,t)),o||(l&&clearTimeout(l),l=setTimeout(n,t))};return r.cancel=()=>{l&&(clearTimeout(l),l=null)},r},O=e=>null!==e&&!Array.isArray(e)&&"object"==typeof e,k=(e,t)=>{if(e===t)return!0;if(Array.isArray(e)&&Array.isArray(t))return e.length===t.length&&e.every(((e,o)=>k(e,t[o])));if(Array.isArray(e)!==Array.isArray(t))return!1;if(!O(e)||!O(t))return e===t;const o=Object.keys(e),l=Object.keys(t);return o.length===l.length&&o.every((o=>k(e[o],t[o])))},T=e=>{if(!(e instanceof HTMLElement||e instanceof SVGElement))return!1;const t=getComputedStyle(e);return["overflow","overflow-x","overflow-y"].some((e=>{const o=t.getPropertyValue(e);return"auto"===o||"scroll"===o}))},L=e=>{if(!e)return null;let t=e.parentElement;for(;t;){if(T(t))return t;t=t.parentElement}return document.scrollingElement||document.documentElement},C="undefined"!=typeof window?t:o,R=e=>{e.current&&(clearTimeout(e.current),e.current=null)},x="DEFAULT_TOOLTIP_ID",N={anchorRefs:new Set,activeAnchor:{current:null},attach:()=>{},detach:()=>{},setActiveAnchor:()=>{}},$=l({getTooltipData:()=>N}),I=({children:t})=>{const[o,l]=r({[x]:new Set}),[c,s]=r({[x]:{current:null}}),a=(e,...t)=>{l((o=>{var l;const r=null!==(l=o[e])&&void 0!==l?l:new Set;return t.forEach((e=>r.add(e))),{...o,[e]:new Set(r)}}))},u=(e,...t)=>{l((o=>{const l=o[e];return l?(t.forEach((e=>l.delete(e))),{...o}):o}))},d=n(((e=x)=>{var t,l;return{anchorRefs:null!==(t=o[e])&&void 0!==t?t:new Set,activeAnchor:null!==(l=c[e])&&void 0!==l?l:{current:null},attach:(...t)=>a(e,...t),detach:(...t)=>u(e,...t),setActiveAnchor:t=>((e,t)=>{s((o=>{var l;return(null===(l=o[e])||void 0===l?void 0:l.current)===t.current?o:{...o,[e]:t}}))})(e,t)}}),[o,c,a,u]),p=i((()=>({getTooltipData:d})),[d]);return e.createElement($.Provider,{value:p},t)};function j(e=x){return c($).getTooltipData(e)}const B=({tooltipId:t,children:l,className:r,place:n,content:i,html:c,variant:a,offset:u,wrapper:d,events:p,positionStrategy:v,delayShow:m,delayHide:f})=>{const{attach:h,detach:w}=j(t),b=s(null);return o((()=>(h(b),()=>{w(b)})),[]),e.createElement("span",{ref:b,className:y("react-tooltip-wrapper",r),"data-tooltip-place":n,"data-tooltip-content":i,"data-tooltip-html":c,"data-tooltip-variant":a,"data-tooltip-offset":u,"data-tooltip-wrapper":d,"data-tooltip-events":p,"data-tooltip-position-strategy":v,"data-tooltip-delay-show":m,"data-tooltip-delay-hide":f},l)};var z={tooltip:"core-styles-module_tooltip__3vRRp",fixed:"core-styles-module_fixed__pcSol",arrow:"core-styles-module_arrow__cvMwQ",noArrow:"core-styles-module_noArrow__xock6",clickable:"core-styles-module_clickable__ZuTTB",show:"core-styles-module_show__Nt9eE",closing:"core-styles-module_closing__sGnxF"},D={tooltip:"styles-module_tooltip__mnnfp",arrow:"styles-module_arrow__K0L3T",dark:"styles-module_dark__xNqje",light:"styles-module_light__Z6W-X",success:"styles-module_success__A2AKt",warning:"styles-module_warning__SCK0X",error:"styles-module_error__JvumD",info:"styles-module_info__BWdHW"};const q=({forwardRef:t,id:l,className:i,classNameArrow:c,variant:u="dark",anchorId:d,anchorSelect:p,place:v="top",offset:m=10,events:h=["hover"],openOnClick:w=!1,positionStrategy:b="absolute",middlewares:S,wrapper:g,delayShow:A=0,delayHide:O=0,float:T=!1,hidden:x=!1,noArrow:N=!1,clickable:$=!1,closeOnEsc:I=!1,closeOnScroll:B=!1,closeOnResize:q=!1,openEvents:H,closeEvents:M,globalCloseEvents:W,imperativeModeOnly:P,style:V,position:F,afterShow:K,afterHide:U,disableTooltip:X,content:Y,contentWrapperRef:G,isOpen:Z,defaultIsOpen:J=!1,setIsOpen:Q,activeAnchor:ee,setActiveAnchor:te,border:oe,opacity:le,arrowColor:re,role:ne="tooltip"})=>{var ie;const ce=s(null),se=s(null),ae=s(null),ue=s(null),de=s(null),[pe,ve]=r({tooltipStyles:{},tooltipArrowStyles:{},place:v}),[me,fe]=r(!1),[ye,he]=r(!1),[we,be]=r(null),Se=s(!1),ge=s(null),{anchorRefs:Ee,setActiveAnchor:Ae}=j(l),_e=s(!1),[Oe,ke]=r([]),Te=s(!1),Le=w||h.includes("click"),Ce=Le||(null==H?void 0:H.click)||(null==H?void 0:H.dblclick)||(null==H?void 0:H.mousedown),Re=H?{...H}:{mouseover:!0,focus:!0,mouseenter:!1,click:!1,dblclick:!1,mousedown:!1};!H&&Le&&Object.assign(Re,{mouseenter:!1,focus:!1,mouseover:!1,click:!0});const xe=M?{...M}:{mouseout:!0,blur:!0,mouseleave:!1,click:!1,dblclick:!1,mouseup:!1};!M&&Le&&Object.assign(xe,{mouseleave:!1,blur:!1,mouseout:!1});const Ne=W?{...W}:{escape:I||!1,scroll:B||!1,resize:q||!1,clickOutsideAnchor:Ce||!1};P&&(Object.assign(Re,{mouseenter:!1,focus:!1,click:!1,dblclick:!1,mousedown:!1}),Object.assign(xe,{mouseleave:!1,blur:!1,click:!1,dblclick:!1,mouseup:!1}),Object.assign(Ne,{escape:!1,scroll:!1,resize:!1,clickOutsideAnchor:!1})),C((()=>(Te.current=!0,()=>{Te.current=!1})),[]);const $e=e=>{Te.current&&(e&&he(!0),setTimeout((()=>{Te.current&&(null==Q||Q(e),void 0===Z&&fe(e))}),10))};o((()=>{if(void 0===Z)return()=>null;Z&&he(!0);const e=setTimeout((()=>{fe(Z)}),10);return()=>{clearTimeout(e)}}),[Z]),o((()=>{if(me!==Se.current)if(R(de),Se.current=me,me)null==K||K();else{const e=(e=>{const t=e.match(/^([\d.]+)(ms|s)$/);if(!t)return 0;const[,o,l]=t;return Number(o)*("ms"===l?1:1e3)})(getComputedStyle(document.body).getPropertyValue("--rt-transition-show-delay"));de.current=setTimeout((()=>{he(!1),be(null),null==U||U()}),e+25)}}),[me]);const Ie=e=>{ve((t=>k(t,e)?t:e))},je=(e=A)=>{R(ae),ye?$e(!0):ae.current=setTimeout((()=>{$e(!0)}),e)},Be=(e=O)=>{R(ue),ue.current=setTimeout((()=>{_e.current||$e(!1)}),e)},ze=e=>{var t;if(!e)return;const o=null!==(t=e.currentTarget)&&void 0!==t?t:e.target;if(!(null==o?void 0:o.isConnected))return te(null),void Ae({current:null});A?je():$e(!0),te(o),Ae({current:o}),R(ue)},De=()=>{$?Be(O||100):O?Be():$e(!1),R(ae)},qe=({x:e,y:t})=>{var o;const l={getBoundingClientRect:()=>({x:e,y:t,width:0,height:0,top:t,left:e,right:e,bottom:t})};E({place:null!==(o=null==we?void 0:we.place)&&void 0!==o?o:v,offset:m,elementReference:l,tooltipReference:ce.current,tooltipArrowReference:se.current,strategy:b,middlewares:S,border:oe}).then((e=>{Ie(e)}))},He=e=>{if(!e)return;const t=e,o={x:t.clientX,y:t.clientY};qe(o),ge.current=o},Me=e=>{var t;if(!me)return;const o=e.target;if(!o.isConnected)return;if(null===(t=ce.current)||void 0===t?void 0:t.contains(o))return;[document.querySelector(`[id='${d}']`),...Oe].some((e=>null==e?void 0:e.contains(o)))||($e(!1),R(ae))},We=_(ze,50,!0),Pe=_(De,50,!0),Ve=e=>{Pe.cancel(),We(e)},Fe=()=>{We.cancel(),Pe()},Ke=n((()=>{var e,t;const o=null!==(e=null==we?void 0:we.position)&&void 0!==e?e:F;o?qe(o):T?ge.current&&qe(ge.current):(null==ee?void 0:ee.isConnected)&&E({place:null!==(t=null==we?void 0:we.place)&&void 0!==t?t:v,offset:m,elementReference:ee,tooltipReference:ce.current,tooltipArrowReference:se.current,strategy:b,middlewares:S,border:oe}).then((e=>{Te.current&&Ie(e)}))}),[me,ee,Y,V,v,null==we?void 0:we.place,m,b,F,null==we?void 0:we.position,T]);o((()=>{var e,t;const o=new Set(Ee);Oe.forEach((e=>{(null==X?void 0:X(e))||o.add({current:e})}));const l=document.querySelector(`[id='${d}']`);l&&!(null==X?void 0:X(l))&&o.add({current:l});const r=()=>{$e(!1)},n=L(ee),i=L(ce.current);Ne.scroll&&(window.addEventListener("scroll",r),null==n||n.addEventListener("scroll",r),null==i||i.addEventListener("scroll",r));let c=null;Ne.resize?window.addEventListener("resize",r):ee&&ce.current&&(c=f(ee,ce.current,Ke,{ancestorResize:!0,elementResize:!0,layoutShift:!0}));const s=e=>{"Escape"===e.key&&$e(!1)};Ne.escape&&window.addEventListener("keydown",s),Ne.clickOutsideAnchor&&window.addEventListener("click",Me);const a=[],u=e=>{me&&(null==e?void 0:e.target)===ee||ze(e)},p=e=>{me&&(null==e?void 0:e.target)===ee&&De()},v=["mouseover","mouseout","mouseenter","mouseleave","focus","blur"],m=["click","dblclick","mousedown","mouseup"];Object.entries(Re).forEach((([e,t])=>{t&&(v.includes(e)?a.push({event:e,listener:Ve}):m.includes(e)&&a.push({event:e,listener:u}))})),Object.entries(xe).forEach((([e,t])=>{t&&(v.includes(e)?a.push({event:e,listener:Fe}):m.includes(e)&&a.push({event:e,listener:p}))})),T&&a.push({event:"pointermove",listener:He});const y=()=>{_e.current=!0},h=()=>{_e.current=!1,De()};return $&&!Ce&&(null===(e=ce.current)||void 0===e||e.addEventListener("mouseenter",y),null===(t=ce.current)||void 0===t||t.addEventListener("mouseleave",h)),a.forEach((({event:e,listener:t})=>{o.forEach((o=>{var l;null===(l=o.current)||void 0===l||l.addEventListener(e,t)}))})),()=>{var e,t;Ne.scroll&&(window.removeEventListener("scroll",r),null==n||n.removeEventListener("scroll",r),null==i||i.removeEventListener("scroll",r)),Ne.resize?window.removeEventListener("resize",r):null==c||c(),Ne.clickOutsideAnchor&&window.removeEventListener("click",Me),Ne.escape&&window.removeEventListener("keydown",s),$&&!Ce&&(null===(e=ce.current)||void 0===e||e.removeEventListener("mouseenter",y),null===(t=ce.current)||void 0===t||t.removeEventListener("mouseleave",h)),a.forEach((({event:e,listener:t})=>{o.forEach((o=>{var l;null===(l=o.current)||void 0===l||l.removeEventListener(e,t)}))}))}}),[ee,Ke,ye,Ee,Oe,H,M,W,Le,A,O]),o((()=>{var e,t;let o=null!==(t=null!==(e=null==we?void 0:we.anchorSelect)&&void 0!==e?e:p)&&void 0!==t?t:"";!o&&l&&(o=`[data-tooltip-id='${l.replace(/'/g,"\\'")}']`);const r=new MutationObserver((e=>{const t=[],r=[];e.forEach((e=>{if("attributes"===e.type&&"data-tooltip-id"===e.attributeName){e.target.getAttribute("data-tooltip-id")===l?t.push(e.target):e.oldValue===l&&r.push(e.target)}if("childList"===e.type){if(ee){const t=[...e.removedNodes].filter((e=>1===e.nodeType));if(o)try{r.push(...t.filter((e=>e.matches(o)))),r.push(...t.flatMap((e=>[...e.querySelectorAll(o)])))}catch(e){}t.some((e=>{var t;return!!(null===(t=null==e?void 0:e.contains)||void 0===t?void 0:t.call(e,ee))&&(he(!1),$e(!1),te(null),R(ae),R(ue),!0)}))}if(o)try{const l=[...e.addedNodes].filter((e=>1===e.nodeType));t.push(...l.filter((e=>e.matches(o)))),t.push(...l.flatMap((e=>[...e.querySelectorAll(o)])))}catch(e){}}})),(t.length||r.length)&&ke((e=>[...e.filter((e=>!r.includes(e))),...t]))}));return r.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["data-tooltip-id"],attributeOldValue:!0}),()=>{r.disconnect()}}),[l,p,null==we?void 0:we.anchorSelect,ee]),o((()=>{Ke()}),[Ke]),o((()=>{if(!(null==G?void 0:G.current))return()=>null;const e=new ResizeObserver((()=>{setTimeout((()=>Ke()))}));return e.observe(G.current),()=>{e.disconnect()}}),[Y,null==G?void 0:G.current]),o((()=>{var e;const t=document.querySelector(`[id='${d}']`),o=[...Oe,t];ee&&o.includes(ee)||te(null!==(e=Oe[0])&&void 0!==e?e:t)}),[d,Oe,ee]),o((()=>(J&&$e(!0),()=>{R(ae),R(ue)})),[]),o((()=>{var e;let t=null!==(e=null==we?void 0:we.anchorSelect)&&void 0!==e?e:p;if(!t&&l&&(t=`[data-tooltip-id='${l.replace(/'/g,"\\'")}']`),t)try{const e=Array.from(document.querySelectorAll(t));ke(e)}catch(e){ke([])}}),[l,p,null==we?void 0:we.anchorSelect]),o((()=>{ae.current&&(R(ae),je(A))}),[A]);const Ue=null!==(ie=null==we?void 0:we.content)&&void 0!==ie?ie:Y,Xe=me&&Object.keys(pe.tooltipStyles).length>0;return a(t,(()=>({open:e=>{if(null==e?void 0:e.anchorSelect)try{document.querySelector(e.anchorSelect)}catch(t){return void console.warn(`[react-tooltip] "${e.anchorSelect}" is not a valid CSS selector`)}be(null!=e?e:null),(null==e?void 0:e.delay)?je(e.delay):$e(!0)},close:e=>{(null==e?void 0:e.delay)?Be(e.delay):$e(!1)},activeAnchor:ee,place:pe.place,isOpen:Boolean(ye&&!x&&Ue&&Xe)}))),ye&&!x&&Ue?e.createElement(g,{id:l,role:ne,className:y("react-tooltip",z.tooltip,D.tooltip,D[u],i,`react-tooltip__place-${pe.place}`,z[Xe?"show":"closing"],Xe?"react-tooltip__show":"react-tooltip__closing","fixed"===b&&z.fixed,$&&z.clickable),onTransitionEnd:e=>{R(de),me||"opacity"!==e.propertyName||(he(!1),be(null),null==U||U())},style:{...V,...pe.tooltipStyles,opacity:void 0!==le&&Xe?le:void 0},ref:ce},Ue,e.createElement(g,{className:y("react-tooltip-arrow",z.arrow,D.arrow,c,N&&z.noArrow),style:{...pe.tooltipArrowStyles,background:re?`linear-gradient(to right bottom, transparent 50%, ${re} 50%)`:void 0},ref:se})):null},H=({content:t})=>e.createElement("span",{dangerouslySetInnerHTML:{__html:t}}),M=e.forwardRef((({id:t,anchorId:l,anchorSelect:n,content:i,html:c,render:a,className:u,classNameArrow:d,variant:p="dark",place:v="top",offset:m=10,wrapper:f="div",children:h=null,events:w=["hover"],openOnClick:b=!1,positionStrategy:S="absolute",middlewares:g,delayShow:E=0,delayHide:_=0,float:O=!1,hidden:k=!1,noArrow:T=!1,clickable:L=!1,closeOnEsc:C=!1,closeOnScroll:R=!1,closeOnResize:x=!1,openEvents:N,closeEvents:$,globalCloseEvents:I,imperativeModeOnly:B=!1,style:z,position:D,isOpen:M,defaultIsOpen:W=!1,disableStyleInjection:P=!1,border:V,opacity:F,arrowColor:K,setIsOpen:U,afterShow:X,afterHide:Y,disableTooltip:G,role:Z="tooltip"},J)=>{const[Q,ee]=r(i),[te,oe]=r(c),[le,re]=r(v),[ne,ie]=r(p),[ce,se]=r(m),[ae,ue]=r(E),[de,pe]=r(_),[ve,me]=r(O),[fe,ye]=r(k),[he,we]=r(f),[be,Se]=r(w),[ge,Ee]=r(S),[Ae,_e]=r(null),[Oe,ke]=r(null),Te=s(P),{anchorRefs:Le,activeAnchor:Ce}=j(t),Re=e=>null==e?void 0:e.getAttributeNames().reduce(((t,o)=>{var l;if(o.startsWith("data-tooltip-")){t[o.replace(/^data-tooltip-/,"")]=null!==(l=null==e?void 0:e.getAttribute(o))&&void 0!==l?l:null}return t}),{}),xe=e=>{const t={place:e=>{var t;re(null!==(t=e)&&void 0!==t?t:v)},content:e=>{ee(null!=e?e:i)},html:e=>{oe(null!=e?e:c)},variant:e=>{var t;ie(null!==(t=e)&&void 0!==t?t:p)},offset:e=>{se(null===e?m:Number(e))},wrapper:e=>{var t;we(null!==(t=e)&&void 0!==t?t:f)},events:e=>{const t=null==e?void 0:e.split(" ");Se(null!=t?t:w)},"position-strategy":e=>{var t;Ee(null!==(t=e)&&void 0!==t?t:S)},"delay-show":e=>{ue(null===e?E:Number(e))},"delay-hide":e=>{pe(null===e?_:Number(e))},float:e=>{me(null===e?O:"true"===e)},hidden:e=>{ye(null===e?k:"true"===e)},"class-name":e=>{_e(e)}};Object.values(t).forEach((e=>e(null))),Object.entries(e).forEach((([e,o])=>{var l;null===(l=t[e])||void 0===l||l.call(t,o)}))};o((()=>{ee(i)}),[i]),o((()=>{oe(c)}),[c]),o((()=>{re(v)}),[v]),o((()=>{ie(p)}),[p]),o((()=>{se(m)}),[m]),o((()=>{ue(E)}),[E]),o((()=>{pe(_)}),[_]),o((()=>{me(O)}),[O]),o((()=>{ye(k)}),[k]),o((()=>{Ee(S)}),[S]),o((()=>{Te.current!==P&&console.warn("[react-tooltip] Do not change `disableStyleInjection` dynamically.")}),[P]),o((()=>{"undefined"!=typeof window&&window.dispatchEvent(new CustomEvent("react-tooltip-inject-styles",{detail:{disableCore:"core"===P,disableBase:P}}))}),[]),o((()=>{var e;const o=new Set(Le);let r=n;if(!r&&t&&(r=`[data-tooltip-id='${t.replace(/'/g,"\\'")}']`),r)try{document.querySelectorAll(r).forEach((e=>{o.add({current:e})}))}catch(e){console.warn(`[react-tooltip] "${r}" is not a valid CSS selector`)}const i=document.querySelector(`[id='${l}']`);if(i&&o.add({current:i}),!o.size)return()=>null;const c=null!==(e=null!=Oe?Oe:i)&&void 0!==e?e:Ce.current,s=new MutationObserver((e=>{e.forEach((e=>{var t;if(!c||"attributes"!==e.type||!(null===(t=e.attributeName)||void 0===t?void 0:t.startsWith("data-tooltip-")))return;const o=Re(c);xe(o)}))})),a={attributes:!0,childList:!1,subtree:!1};if(c){const e=Re(c);xe(e),s.observe(c,a)}return()=>{s.disconnect()}}),[Le,Ce,Oe,l,n]),o((()=>{(null==z?void 0:z.border)&&console.warn("[react-tooltip] Do not set `style.border`. Use `border` prop instead."),V&&!A("border",`${V}`)&&console.warn(`[react-tooltip] "${V}" is not a valid \`border\`.`),(null==z?void 0:z.opacity)&&console.warn("[react-tooltip] Do not set `style.opacity`. Use `opacity` prop instead."),F&&!A("opacity",`${F}`)&&console.warn(`[react-tooltip] "${F}" is not a valid \`opacity\`.`)}),[]);let Ne=h;const $e=s(null);if(a){const t=a({content:(null==Oe?void 0:Oe.getAttribute("data-tooltip-content"))||Q||null,activeAnchor:Oe});Ne=t?e.createElement("div",{ref:$e,className:"react-tooltip-content-wrapper"},t):null}else Q&&(Ne=Q);te&&(Ne=e.createElement(H,{content:te}));const Ie={forwardRef:J,id:t,anchorId:l,anchorSelect:n,className:y(u,Ae),classNameArrow:d,content:Ne,contentWrapperRef:$e,place:le,variant:ne,offset:ce,wrapper:he,events:be,openOnClick:b,positionStrategy:ge,middlewares:g,delayShow:ae,delayHide:de,float:ve,hidden:fe,noArrow:T,clickable:L,closeOnEsc:C,closeOnScroll:R,closeOnResize:x,openEvents:N,closeEvents:$,globalCloseEvents:I,imperativeModeOnly:B,style:z,position:D,isOpen:M,defaultIsOpen:W,border:V,opacity:F,arrowColor:K,setIsOpen:U,afterShow:X,afterHide:Y,disableTooltip:G,activeAnchor:Oe,setActiveAnchor:e=>ke(e),role:Z};return e.createElement(q,{...Ie})}));"undefined"!=typeof window&&window.addEventListener("react-tooltip-inject-styles",(e=>{e.detail.disableCore||S({css:`:root{--rt-color-white:#fff;--rt-color-dark:#222;--rt-color-success:#8dc572;--rt-color-error:#be6464;--rt-color-warning:#f0ad4e;--rt-color-info:#337ab7;--rt-opacity:0.9;--rt-transition-show-delay:0.15s;--rt-transition-closing-delay:0.15s}.core-styles-module_tooltip__3vRRp{position:absolute;top:0;left:0;pointer-events:none;opacity:0;will-change:opacity}.core-styles-module_fixed__pcSol{position:fixed}.core-styles-module_arrow__cvMwQ{position:absolute;background:inherit}.core-styles-module_noArrow__xock6{display:none}.core-styles-module_clickable__ZuTTB{pointer-events:auto}.core-styles-module_show__Nt9eE{opacity:var(--rt-opacity);transition:opacity var(--rt-transition-show-delay)ease-out}.core-styles-module_closing__sGnxF{opacity:0;transition:opacity var(--rt-transition-closing-delay)ease-in}`,type:"core"}),e.detail.disableBase||S({css:`
+.styles-module_tooltip__mnnfp{padding:8px 16px;border-radius:3px;font-size:90%;width:max-content}.styles-module_arrow__K0L3T{width:8px;height:8px}[class*='react-tooltip__place-top']>.styles-module_arrow__K0L3T{transform:rotate(45deg)}[class*='react-tooltip__place-right']>.styles-module_arrow__K0L3T{transform:rotate(135deg)}[class*='react-tooltip__place-bottom']>.styles-module_arrow__K0L3T{transform:rotate(225deg)}[class*='react-tooltip__place-left']>.styles-module_arrow__K0L3T{transform:rotate(315deg)}.styles-module_dark__xNqje{background:var(--rt-color-dark);color:var(--rt-color-white)}.styles-module_light__Z6W-X{background-color:var(--rt-color-white);color:var(--rt-color-dark)}.styles-module_success__A2AKt{background-color:var(--rt-color-success);color:var(--rt-color-white)}.styles-module_warning__SCK0X{background-color:var(--rt-color-warning);color:var(--rt-color-white)}.styles-module_error__JvumD{background-color:var(--rt-color-error);color:var(--rt-color-white)}.styles-module_info__BWdHW{background-color:var(--rt-color-info);color:var(--rt-color-white)}`,type:"base"})}));export{M as Tooltip,I as TooltipProvider,B as TooltipWrapper,g as removeStyle};
diff --git a/ddb_main/node_modules/react-transition-group/esm/Transition.js b/ddb_main/node_modules/react-transition-group/esm/Transition.js
new file mode 100644
index 0000000..986d29f
--- /dev/null
+++ b/ddb_main/node_modules/react-transition-group/esm/Transition.js
@@ -0,0 +1,625 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+import PropTypes from 'prop-types';
+import React from 'react';
+import ReactDOM from 'react-dom';
+import config from './config';
+import { timeoutsShape } from './utils/PropTypes';
+import TransitionGroupContext from './TransitionGroupContext';
+import { forceReflow } from './utils/reflow';
+export var UNMOUNTED = 'unmounted';
+export var EXITED = 'exited';
+export var ENTERING = 'entering';
+export var ENTERED = 'entered';
+export var EXITING = 'exiting';
+/**
+ * The Transition component lets you describe a transition from one component
+ * state to another _over time_ with a simple declarative API. Most commonly
+ * it's used to animate the mounting and unmounting of a component, but can also
+ * be used to describe in-place transition states as well.
+ *
+ * ---
+ *
+ * **Note**: `Transition` is a platform-agnostic base component. If you're using
+ * transitions in CSS, you'll probably want to use
+ * [`CSSTransition`](https://reactcommunity.org/react-transition-group/css-transition)
+ * instead. It inherits all the features of `Transition`, but contains
+ * additional features necessary to play nice with CSS transitions (hence the
+ * name of the component).
+ *
+ * ---
+ *
+ * By default the `Transition` component does not alter the behavior of the
+ * component it renders, it only tracks "enter" and "exit" states for the
+ * components. It's up to you to give meaning and effect to those states. For
+ * example we can add styles to a component when it enters or exits:
+ *
+ * ```jsx
+ * import { Transition } from 'react-transition-group';
+ *
+ * const duration = 300;
+ *
+ * const defaultStyle = {
+ *   transition: `opacity ${duration}ms ease-in-out`,
+ *   opacity: 0,
+ * }
+ *
+ * const transitionStyles = {
+ *   entering: { opacity: 1 },
+ *   entered:  { opacity: 1 },
+ *   exiting:  { opacity: 0 },
+ *   exited:  { opacity: 0 },
+ * };
+ *
+ * const Fade = ({ in: inProp }) => (
+ *   <Transition in={inProp} timeout={duration}>
+ *     {state => (
+ *       <div style={{
+ *         ...defaultStyle,
+ *         ...transitionStyles[state]
+ *       }}>
+ *         I'm a fade Transition!
+ *       </div>
+ *     )}
+ *   </Transition>
+ * );
+ * ```
+ *
+ * There are 4 main states a Transition can be in:
+ *  - `'entering'`
+ *  - `'entered'`
+ *  - `'exiting'`
+ *  - `'exited'`
+ *
+ * Transition state is toggled via the `in` prop. When `true` the component
+ * begins the "Enter" stage. During this stage, the component will shift from
+ * its current transition state, to `'entering'` for the duration of the
+ * transition and then to the `'entered'` stage once it's complete. Let's take
+ * the following example (we'll use the
+ * [useState](https://reactjs.org/docs/hooks-reference.html#usestate) hook):
+ *
+ * ```jsx
+ * function App() {
+ *   const [inProp, setInProp] = useState(false);
+ *   return (
+ *     <div>
+ *       <Transition in={inProp} timeout={500}>
+ *         {state => (
+ *           // ...
+ *         )}
+ *       </Transition>
+ *       <button onClick={() => setInProp(true)}>
+ *         Click to Enter
+ *       </button>
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * When the button is clicked the component will shift to the `'entering'` state
+ * and stay there for 500ms (the value of `timeout`) before it finally switches
+ * to `'entered'`.
+ *
+ * When `in` is `false` the same thing happens except the state moves from
+ * `'exiting'` to `'exited'`.
+ */
+
+var Transition = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Transition, _React$Component);
+
+  function Transition(props, context) {
+    var _this;
+
+    _this = _React$Component.call(this, props, context) || this;
+    var parentGroup = context; // In the context of a TransitionGroup all enters are really appears
+
+    var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;
+    var initialStatus;
+    _this.appearStatus = null;
+
+    if (props.in) {
+      if (appear) {
+        initialStatus = EXITED;
+        _this.appearStatus = ENTERING;
+      } else {
+        initialStatus = ENTERED;
+      }
+    } else {
+      if (props.unmountOnExit || props.mountOnEnter) {
+        initialStatus = UNMOUNTED;
+      } else {
+        initialStatus = EXITED;
+      }
+    }
+
+    _this.state = {
+      status: initialStatus
+    };
+    _this.nextCallback = null;
+    return _this;
+  }
+
+  Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {
+    var nextIn = _ref.in;
+
+    if (nextIn && prevState.status === UNMOUNTED) {
+      return {
+        status: EXITED
+      };
+    }
+
+    return null;
+  } // getSnapshotBeforeUpdate(prevProps) {
+  //   let nextStatus = null
+  //   if (prevProps !== this.props) {
+  //     const { status } = this.state
+  //     if (this.props.in) {
+  //       if (status !== ENTERING && status !== ENTERED) {
+  //         nextStatus = ENTERING
+  //       }
+  //     } else {
+  //       if (status === ENTERING || status === ENTERED) {
+  //         nextStatus = EXITING
+  //       }
+  //     }
+  //   }
+  //   return { nextStatus }
+  // }
+  ;
+
+  var _proto = Transition.prototype;
+
+  _proto.componentDidMount = function componentDidMount() {
+    this.updateStatus(true, this.appearStatus);
+  };
+
+  _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
+    var nextStatus = null;
+
+    if (prevProps !== this.props) {
+      var status = this.state.status;
+
+      if (this.props.in) {
+        if (status !== ENTERING && status !== ENTERED) {
+          nextStatus = ENTERING;
+        }
+      } else {
+        if (status === ENTERING || status === ENTERED) {
+          nextStatus = EXITING;
+        }
+      }
+    }
+
+    this.updateStatus(false, nextStatus);
+  };
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    this.cancelNextCallback();
+  };
+
+  _proto.getTimeouts = function getTimeouts() {
+    var timeout = this.props.timeout;
+    var exit, enter, appear;
+    exit = enter = appear = timeout;
+
+    if (timeout != null && typeof timeout !== 'number') {
+      exit = timeout.exit;
+      enter = timeout.enter; // TODO: remove fallback for next major
+
+      appear = timeout.appear !== undefined ? timeout.appear : enter;
+    }
+
+    return {
+      exit: exit,
+      enter: enter,
+      appear: appear
+    };
+  };
+
+  _proto.updateStatus = function updateStatus(mounting, nextStatus) {
+    if (mounting === void 0) {
+      mounting = false;
+    }
+
+    if (nextStatus !== null) {
+      // nextStatus will always be ENTERING or EXITING.
+      this.cancelNextCallback();
+
+      if (nextStatus === ENTERING) {
+        if (this.props.unmountOnExit || this.props.mountOnEnter) {
+          var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this); // https://github.com/reactjs/react-transition-group/pull/749
+          // With unmountOnExit or mountOnEnter, the enter animation should happen at the transition between `exited` and `entering`.
+          // To make the animation happen,  we have to separate each rendering and avoid being processed as batched.
+
+          if (node) forceReflow(node);
+        }
+
+        this.performEnter(mounting);
+      } else {
+        this.performExit();
+      }
+    } else if (this.props.unmountOnExit && this.state.status === EXITED) {
+      this.setState({
+        status: UNMOUNTED
+      });
+    }
+  };
+
+  _proto.performEnter = function performEnter(mounting) {
+    var _this2 = this;
+
+    var enter = this.props.enter;
+    var appearing = this.context ? this.context.isMounting : mounting;
+
+    var _ref2 = this.props.nodeRef ? [appearing] : [ReactDOM.findDOMNode(this), appearing],
+        maybeNode = _ref2[0],
+        maybeAppearing = _ref2[1];
+
+    var timeouts = this.getTimeouts();
+    var enterTimeout = appearing ? timeouts.appear : timeouts.enter; // no enter animation skip right to ENTERED
+    // if we are mounting and running this it means appear _must_ be set
+
+    if (!mounting && !enter || config.disabled) {
+      this.safeSetState({
+        status: ENTERED
+      }, function () {
+        _this2.props.onEntered(maybeNode);
+      });
+      return;
+    }
+
+    this.props.onEnter(maybeNode, maybeAppearing);
+    this.safeSetState({
+      status: ENTERING
+    }, function () {
+      _this2.props.onEntering(maybeNode, maybeAppearing);
+
+      _this2.onTransitionEnd(enterTimeout, function () {
+        _this2.safeSetState({
+          status: ENTERED
+        }, function () {
+          _this2.props.onEntered(maybeNode, maybeAppearing);
+        });
+      });
+    });
+  };
+
+  _proto.performExit = function performExit() {
+    var _this3 = this;
+
+    var exit = this.props.exit;
+    var timeouts = this.getTimeouts();
+    var maybeNode = this.props.nodeRef ? undefined : ReactDOM.findDOMNode(this); // no exit animation skip right to EXITED
+
+    if (!exit || config.disabled) {
+      this.safeSetState({
+        status: EXITED
+      }, function () {
+        _this3.props.onExited(maybeNode);
+      });
+      return;
+    }
+
+    this.props.onExit(maybeNode);
+    this.safeSetState({
+      status: EXITING
+    }, function () {
+      _this3.props.onExiting(maybeNode);
+
+      _this3.onTransitionEnd(timeouts.exit, function () {
+        _this3.safeSetState({
+          status: EXITED
+        }, function () {
+          _this3.props.onExited(maybeNode);
+        });
+      });
+    });
+  };
+
+  _proto.cancelNextCallback = function cancelNextCallback() {
+    if (this.nextCallback !== null) {
+      this.nextCallback.cancel();
+      this.nextCallback = null;
+    }
+  };
+
+  _proto.safeSetState = function safeSetState(nextState, callback) {
+    // This shouldn't be necessary, but there are weird race conditions with
+    // setState callbacks and unmounting in testing, so always make sure that
+    // we can cancel any pending setState callbacks after we unmount.
+    callback = this.setNextCallback(callback);
+    this.setState(nextState, callback);
+  };
+
+  _proto.setNextCallback = function setNextCallback(callback) {
+    var _this4 = this;
+
+    var active = true;
+
+    this.nextCallback = function (event) {
+      if (active) {
+        active = false;
+        _this4.nextCallback = null;
+        callback(event);
+      }
+    };
+
+    this.nextCallback.cancel = function () {
+      active = false;
+    };
+
+    return this.nextCallback;
+  };
+
+  _proto.onTransitionEnd = function onTransitionEnd(timeout, handler) {
+    this.setNextCallback(handler);
+    var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this);
+    var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;
+
+    if (!node || doesNotHaveTimeoutOrListener) {
+      setTimeout(this.nextCallback, 0);
+      return;
+    }
+
+    if (this.props.addEndListener) {
+      var _ref3 = this.props.nodeRef ? [this.nextCallback] : [node, this.nextCallback],
+          maybeNode = _ref3[0],
+          maybeNextCallback = _ref3[1];
+
+      this.props.addEndListener(maybeNode, maybeNextCallback);
+    }
+
+    if (timeout != null) {
+      setTimeout(this.nextCallback, timeout);
+    }
+  };
+
+  _proto.render = function render() {
+    var status = this.state.status;
+
+    if (status === UNMOUNTED) {
+      return null;
+    }
+
+    var _this$props = this.props,
+        children = _this$props.children,
+        _in = _this$props.in,
+        _mountOnEnter = _this$props.mountOnEnter,
+        _unmountOnExit = _this$props.unmountOnExit,
+        _appear = _this$props.appear,
+        _enter = _this$props.enter,
+        _exit = _this$props.exit,
+        _timeout = _this$props.timeout,
+        _addEndListener = _this$props.addEndListener,
+        _onEnter = _this$props.onEnter,
+        _onEntering = _this$props.onEntering,
+        _onEntered = _this$props.onEntered,
+        _onExit = _this$props.onExit,
+        _onExiting = _this$props.onExiting,
+        _onExited = _this$props.onExited,
+        _nodeRef = _this$props.nodeRef,
+        childProps = _objectWithoutPropertiesLoose(_this$props, ["children", "in", "mountOnEnter", "unmountOnExit", "appear", "enter", "exit", "timeout", "addEndListener", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "nodeRef"]);
+
+    return (
+      /*#__PURE__*/
+      // allows for nested Transitions
+      React.createElement(TransitionGroupContext.Provider, {
+        value: null
+      }, typeof children === 'function' ? children(status, childProps) : React.cloneElement(React.Children.only(children), childProps))
+    );
+  };
+
+  return Transition;
+}(React.Component);
+
+Transition.contextType = TransitionGroupContext;
+Transition.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * A React reference to DOM element that need to transition:
+   * https://stackoverflow.com/a/51127130/4671932
+   *
+   *   - When `nodeRef` prop is used, `node` is not passed to callback functions
+   *      (e.g. `onEnter`) because user already has direct access to the node.
+   *   - When changing `key` prop of `Transition` in a `TransitionGroup` a new
+   *     `nodeRef` need to be provided to `Transition` with changed `key` prop
+   *     (see
+   *     [test/CSSTransition-test.js](https://github.com/reactjs/react-transition-group/blob/13435f897b3ab71f6e19d724f145596f5910581c/test/CSSTransition-test.js#L362-L437)).
+   */
+  nodeRef: PropTypes.shape({
+    current: typeof Element === 'undefined' ? PropTypes.any : function (propValue, key, componentName, location, propFullName, secret) {
+      var value = propValue[key];
+      return PropTypes.instanceOf(value && 'ownerDocument' in value ? value.ownerDocument.defaultView.Element : Element)(propValue, key, componentName, location, propFullName, secret);
+    }
+  }),
+
+  /**
+   * A `function` child can be used instead of a React element. This function is
+   * called with the current transition status (`'entering'`, `'entered'`,
+   * `'exiting'`, `'exited'`), which can be used to apply context
+   * specific props to a component.
+   *
+   * ```jsx
+   * <Transition in={this.state.in} timeout={150}>
+   *   {state => (
+   *     <MyComponent className={`fade fade-${state}`} />
+   *   )}
+   * </Transition>
+   * ```
+   */
+  children: PropTypes.oneOfType([PropTypes.func.isRequired, PropTypes.element.isRequired]).isRequired,
+
+  /**
+   * Show the component; triggers the enter or exit states
+   */
+  in: PropTypes.bool,
+
+  /**
+   * By default the child component is mounted immediately along with
+   * the parent `Transition` component. If you want to "lazy mount" the component on the
+   * first `in={true}` you can set `mountOnEnter`. After the first enter transition the component will stay
+   * mounted, even on "exited", unless you also specify `unmountOnExit`.
+   */
+  mountOnEnter: PropTypes.bool,
+
+  /**
+   * By default the child component stays mounted after it reaches the `'exited'` state.
+   * Set `unmountOnExit` if you'd prefer to unmount the component after it finishes exiting.
+   */
+  unmountOnExit: PropTypes.bool,
+
+  /**
+   * By default the child component does not perform the enter transition when
+   * it first mounts, regardless of the value of `in`. If you want this
+   * behavior, set both `appear` and `in` to `true`.
+   *
+   * > **Note**: there are no special appear states like `appearing`/`appeared`, this prop
+   * > only adds an additional enter transition. However, in the
+   * > `<CSSTransition>` component that first enter transition does result in
+   * > additional `.appear-*` classes, that way you can choose to style it
+   * > differently.
+   */
+  appear: PropTypes.bool,
+
+  /**
+   * Enable or disable enter transitions.
+   */
+  enter: PropTypes.bool,
+
+  /**
+   * Enable or disable exit transitions.
+   */
+  exit: PropTypes.bool,
+
+  /**
+   * The duration of the transition, in milliseconds.
+   * Required unless `addEndListener` is provided.
+   *
+   * You may specify a single timeout for all transitions:
+   *
+   * ```jsx
+   * timeout={500}
+   * ```
+   *
+   * or individually:
+   *
+   * ```jsx
+   * timeout={{
+   *  appear: 500,
+   *  enter: 300,
+   *  exit: 500,
+   * }}
+   * ```
+   *
+   * - `appear` defaults to the value of `enter`
+   * - `enter` defaults to `0`
+   * - `exit` defaults to `0`
+   *
+   * @type {number | { enter?: number, exit?: number, appear?: number }}
+   */
+  timeout: function timeout(props) {
+    var pt = timeoutsShape;
+    if (!props.addEndListener) pt = pt.isRequired;
+
+    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+      args[_key - 1] = arguments[_key];
+    }
+
+    return pt.apply(void 0, [props].concat(args));
+  },
+
+  /**
+   * Add a custom transition end trigger. Called with the transitioning
+   * DOM node and a `done` callback. Allows for more fine grained transition end
+   * logic. Timeouts are still used as a fallback if provided.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * ```jsx
+   * addEndListener={(node, done) => {
+   *   // use the css transitionend event to mark the finish of a transition
+   *   node.addEventListener('transitionend', done, false);
+   * }}
+   * ```
+   */
+  addEndListener: PropTypes.func,
+
+  /**
+   * Callback fired before the "entering" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool) -> void
+   */
+  onEnter: PropTypes.func,
+
+  /**
+   * Callback fired after the "entering" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool)
+   */
+  onEntering: PropTypes.func,
+
+  /**
+   * Callback fired after the "entered" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool) -> void
+   */
+  onEntered: PropTypes.func,
+
+  /**
+   * Callback fired before the "exiting" status is applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement) -> void
+   */
+  onExit: PropTypes.func,
+
+  /**
+   * Callback fired after the "exiting" status is applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement) -> void
+   */
+  onExiting: PropTypes.func,
+
+  /**
+   * Callback fired after the "exited" status is applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed
+   *
+   * @type Function(node: HtmlElement) -> void
+   */
+  onExited: PropTypes.func
+} : {}; // Name the function so it is clearer in the documentation
+
+function noop() {}
+
+Transition.defaultProps = {
+  in: false,
+  mountOnEnter: false,
+  unmountOnExit: false,
+  appear: false,
+  enter: true,
+  exit: true,
+  onEnter: noop,
+  onEntering: noop,
+  onEntered: noop,
+  onExit: noop,
+  onExiting: noop,
+  onExited: noop
+};
+Transition.UNMOUNTED = UNMOUNTED;
+Transition.EXITED = EXITED;
+Transition.ENTERING = ENTERING;
+Transition.ENTERED = ENTERED;
+Transition.EXITING = EXITING;
+export default Transition;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-transition-group/esm/TransitionGroup.js b/ddb_main/node_modules/react-transition-group/esm/TransitionGroup.js
new file mode 100644
index 0000000..8e4deb3
--- /dev/null
+++ b/ddb_main/node_modules/react-transition-group/esm/TransitionGroup.js
@@ -0,0 +1,189 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+import PropTypes from 'prop-types';
+import React from 'react';
+import TransitionGroupContext from './TransitionGroupContext';
+import { getChildMapping, getInitialChildMapping, getNextChildMapping } from './utils/ChildMapping';
+
+var values = Object.values || function (obj) {
+  return Object.keys(obj).map(function (k) {
+    return obj[k];
+  });
+};
+
+var defaultProps = {
+  component: 'div',
+  childFactory: function childFactory(child) {
+    return child;
+  }
+};
+/**
+ * The `<TransitionGroup>` component manages a set of transition components
+ * (`<Transition>` and `<CSSTransition>`) in a list. Like with the transition
+ * components, `<TransitionGroup>` is a state machine for managing the mounting
+ * and unmounting of components over time.
+ *
+ * Consider the example below. As items are removed or added to the TodoList the
+ * `in` prop is toggled automatically by the `<TransitionGroup>`.
+ *
+ * Note that `<TransitionGroup>`  does not define any animation behavior!
+ * Exactly _how_ a list item animates is up to the individual transition
+ * component. This means you can mix and match animations across different list
+ * items.
+ */
+
+var TransitionGroup = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(TransitionGroup, _React$Component);
+
+  function TransitionGroup(props, context) {
+    var _this;
+
+    _this = _React$Component.call(this, props, context) || this;
+
+    var handleExited = _this.handleExited.bind(_assertThisInitialized(_this)); // Initial children should all be entering, dependent on appear
+
+
+    _this.state = {
+      contextValue: {
+        isMounting: true
+      },
+      handleExited: handleExited,
+      firstRender: true
+    };
+    return _this;
+  }
+
+  var _proto = TransitionGroup.prototype;
+
+  _proto.componentDidMount = function componentDidMount() {
+    this.mounted = true;
+    this.setState({
+      contextValue: {
+        isMounting: false
+      }
+    });
+  };
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    this.mounted = false;
+  };
+
+  TransitionGroup.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, _ref) {
+    var prevChildMapping = _ref.children,
+        handleExited = _ref.handleExited,
+        firstRender = _ref.firstRender;
+    return {
+      children: firstRender ? getInitialChildMapping(nextProps, handleExited) : getNextChildMapping(nextProps, prevChildMapping, handleExited),
+      firstRender: false
+    };
+  } // node is `undefined` when user provided `nodeRef` prop
+  ;
+
+  _proto.handleExited = function handleExited(child, node) {
+    var currentChildMapping = getChildMapping(this.props.children);
+    if (child.key in currentChildMapping) return;
+
+    if (child.props.onExited) {
+      child.props.onExited(node);
+    }
+
+    if (this.mounted) {
+      this.setState(function (state) {
+        var children = _extends({}, state.children);
+
+        delete children[child.key];
+        return {
+          children: children
+        };
+      });
+    }
+  };
+
+  _proto.render = function render() {
+    var _this$props = this.props,
+        Component = _this$props.component,
+        childFactory = _this$props.childFactory,
+        props = _objectWithoutPropertiesLoose(_this$props, ["component", "childFactory"]);
+
+    var contextValue = this.state.contextValue;
+    var children = values(this.state.children).map(childFactory);
+    delete props.appear;
+    delete props.enter;
+    delete props.exit;
+
+    if (Component === null) {
+      return /*#__PURE__*/React.createElement(TransitionGroupContext.Provider, {
+        value: contextValue
+      }, children);
+    }
+
+    return /*#__PURE__*/React.createElement(TransitionGroupContext.Provider, {
+      value: contextValue
+    }, /*#__PURE__*/React.createElement(Component, props, children));
+  };
+
+  return TransitionGroup;
+}(React.Component);
+
+TransitionGroup.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * `<TransitionGroup>` renders a `<div>` by default. You can change this
+   * behavior by providing a `component` prop.
+   * If you use React v16+ and would like to avoid a wrapping `<div>` element
+   * you can pass in `component={null}`. This is useful if the wrapping div
+   * borks your css styles.
+   */
+  component: PropTypes.any,
+
+  /**
+   * A set of `<Transition>` components, that are toggled `in` and out as they
+   * leave. the `<TransitionGroup>` will inject specific transition props, so
+   * remember to spread them through if you are wrapping the `<Transition>` as
+   * with our `<Fade>` example.
+   *
+   * While this component is meant for multiple `Transition` or `CSSTransition`
+   * children, sometimes you may want to have a single transition child with
+   * content that you want to be transitioned out and in when you change it
+   * (e.g. routes, images etc.) In that case you can change the `key` prop of
+   * the transition child as you change its content, this will cause
+   * `TransitionGroup` to transition the child out and back in.
+   */
+  children: PropTypes.node,
+
+  /**
+   * A convenience prop that enables or disables appear animations
+   * for all children. Note that specifying this will override any defaults set
+   * on individual children Transitions.
+   */
+  appear: PropTypes.bool,
+
+  /**
+   * A convenience prop that enables or disables enter animations
+   * for all children. Note that specifying this will override any defaults set
+   * on individual children Transitions.
+   */
+  enter: PropTypes.bool,
+
+  /**
+   * A convenience prop that enables or disables exit animations
+   * for all children. Note that specifying this will override any defaults set
+   * on individual children Transitions.
+   */
+  exit: PropTypes.bool,
+
+  /**
+   * You may need to apply reactive updates to a child as it is exiting.
+   * This is generally done by using `cloneElement` however in the case of an exiting
+   * child the element has already been removed and not accessible to the consumer.
+   *
+   * If you do need to update a child as it leaves you can provide a `childFactory`
+   * to wrap every child, even the ones that are leaving.
+   *
+   * @type Function(child: ReactElement) -> ReactElement
+   */
+  childFactory: PropTypes.func
+} : {};
+TransitionGroup.defaultProps = defaultProps;
+export default TransitionGroup;
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-transition-group/esm/TransitionGroupContext.js b/ddb_main/node_modules/react-transition-group/esm/TransitionGroupContext.js
new file mode 100644
index 0000000..659d70e
--- /dev/null
+++ b/ddb_main/node_modules/react-transition-group/esm/TransitionGroupContext.js
@@ -0,0 +1,2 @@
+import React from 'react';
+export default React.createContext(null);
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-transition-group/esm/config.js b/ddb_main/node_modules/react-transition-group/esm/config.js
new file mode 100644
index 0000000..3bb7274
--- /dev/null
+++ b/ddb_main/node_modules/react-transition-group/esm/config.js
@@ -0,0 +1,3 @@
+export default {
+  disabled: false
+};
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-transition-group/esm/utils/ChildMapping.js b/ddb_main/node_modules/react-transition-group/esm/utils/ChildMapping.js
new file mode 100644
index 0000000..86f32cf
--- /dev/null
+++ b/ddb_main/node_modules/react-transition-group/esm/utils/ChildMapping.js
@@ -0,0 +1,140 @@
+import { Children, cloneElement, isValidElement } from 'react';
+/**
+ * Given `this.props.children`, return an object mapping key to child.
+ *
+ * @param {*} children `this.props.children`
+ * @return {object} Mapping of key to child
+ */
+
+export function getChildMapping(children, mapFn) {
+  var mapper = function mapper(child) {
+    return mapFn && isValidElement(child) ? mapFn(child) : child;
+  };
+
+  var result = Object.create(null);
+  if (children) Children.map(children, function (c) {
+    return c;
+  }).forEach(function (child) {
+    // run the map function here instead so that the key is the computed one
+    result[child.key] = mapper(child);
+  });
+  return result;
+}
+/**
+ * When you're adding or removing children some may be added or removed in the
+ * same render pass. We want to show *both* since we want to simultaneously
+ * animate elements in and out. This function takes a previous set of keys
+ * and a new set of keys and merges them with its best guess of the correct
+ * ordering. In the future we may expose some of the utilities in
+ * ReactMultiChild to make this easy, but for now React itself does not
+ * directly have this concept of the union of prevChildren and nextChildren
+ * so we implement it here.
+ *
+ * @param {object} prev prev children as returned from
+ * `ReactTransitionChildMapping.getChildMapping()`.
+ * @param {object} next next children as returned from
+ * `ReactTransitionChildMapping.getChildMapping()`.
+ * @return {object} a key set that contains all keys in `prev` and all keys
+ * in `next` in a reasonable order.
+ */
+
+export function mergeChildMappings(prev, next) {
+  prev = prev || {};
+  next = next || {};
+
+  function getValueForKey(key) {
+    return key in next ? next[key] : prev[key];
+  } // For each key of `next`, the list of keys to insert before that key in
+  // the combined list
+
+
+  var nextKeysPending = Object.create(null);
+  var pendingKeys = [];
+
+  for (var prevKey in prev) {
+    if (prevKey in next) {
+      if (pendingKeys.length) {
+        nextKeysPending[prevKey] = pendingKeys;
+        pendingKeys = [];
+      }
+    } else {
+      pendingKeys.push(prevKey);
+    }
+  }
+
+  var i;
+  var childMapping = {};
+
+  for (var nextKey in next) {
+    if (nextKeysPending[nextKey]) {
+      for (i = 0; i < nextKeysPending[nextKey].length; i++) {
+        var pendingNextKey = nextKeysPending[nextKey][i];
+        childMapping[nextKeysPending[nextKey][i]] = getValueForKey(pendingNextKey);
+      }
+    }
+
+    childMapping[nextKey] = getValueForKey(nextKey);
+  } // Finally, add the keys which didn't appear before any key in `next`
+
+
+  for (i = 0; i < pendingKeys.length; i++) {
+    childMapping[pendingKeys[i]] = getValueForKey(pendingKeys[i]);
+  }
+
+  return childMapping;
+}
+
+function getProp(child, prop, props) {
+  return props[prop] != null ? props[prop] : child.props[prop];
+}
+
+export function getInitialChildMapping(props, onExited) {
+  return getChildMapping(props.children, function (child) {
+    return cloneElement(child, {
+      onExited: onExited.bind(null, child),
+      in: true,
+      appear: getProp(child, 'appear', props),
+      enter: getProp(child, 'enter', props),
+      exit: getProp(child, 'exit', props)
+    });
+  });
+}
+export function getNextChildMapping(nextProps, prevChildMapping, onExited) {
+  var nextChildMapping = getChildMapping(nextProps.children);
+  var children = mergeChildMappings(prevChildMapping, nextChildMapping);
+  Object.keys(children).forEach(function (key) {
+    var child = children[key];
+    if (!isValidElement(child)) return;
+    var hasPrev = (key in prevChildMapping);
+    var hasNext = (key in nextChildMapping);
+    var prevChild = prevChildMapping[key];
+    var isLeaving = isValidElement(prevChild) && !prevChild.props.in; // item is new (entering)
+
+    if (hasNext && (!hasPrev || isLeaving)) {
+      // console.log('entering', key)
+      children[key] = cloneElement(child, {
+        onExited: onExited.bind(null, child),
+        in: true,
+        exit: getProp(child, 'exit', nextProps),
+        enter: getProp(child, 'enter', nextProps)
+      });
+    } else if (!hasNext && hasPrev && !isLeaving) {
+      // item is old (exiting)
+      // console.log('leaving', key)
+      children[key] = cloneElement(child, {
+        in: false
+      });
+    } else if (hasNext && hasPrev && isValidElement(prevChild)) {
+      // item hasn't changed transition states
+      // copy over the last transition props;
+      // console.log('unchanged', key)
+      children[key] = cloneElement(child, {
+        onExited: onExited.bind(null, child),
+        in: prevChild.props.in,
+        exit: getProp(child, 'exit', nextProps),
+        enter: getProp(child, 'enter', nextProps)
+      });
+    }
+  });
+  return children;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/react-transition-group/esm/utils/reflow.js b/ddb_main/node_modules/react-transition-group/esm/utils/reflow.js
new file mode 100644
index 0000000..62c5029
--- /dev/null
+++ b/ddb_main/node_modules/react-transition-group/esm/utils/reflow.js
@@ -0,0 +1,3 @@
+export var forceReflow = function forceReflow(node) {
+  return node.scrollTop;
+};
\ No newline at end of file
diff --git a/ddb_main/node_modules/react/cjs/react-jsx-runtime.production.min.js b/ddb_main/node_modules/react/cjs/react-jsx-runtime.production.min.js
new file mode 100644
index 0000000..240488c
--- /dev/null
+++ b/ddb_main/node_modules/react/cjs/react-jsx-runtime.production.min.js
@@ -0,0 +1,10 @@
+/** @license React v17.0.2
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';require("object-assign");var f=require("react"),g=60103;exports.Fragment=60107;if("function"===typeof Symbol&&Symbol.for){var h=Symbol.for;g=h("react.element");exports.Fragment=h("react.fragment")}var m=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,n=Object.prototype.hasOwnProperty,p={key:!0,ref:!0,__self:!0,__source:!0};
+function q(c,a,k){var b,d={},e=null,l=null;void 0!==k&&(e=""+k);void 0!==a.key&&(e=""+a.key);void 0!==a.ref&&(l=a.ref);for(b in a)n.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:g,type:c,key:e,ref:l,props:d,_owner:m.current}}exports.jsx=q;exports.jsxs=q;
diff --git a/ddb_main/node_modules/react/cjs/react.production.min.js b/ddb_main/node_modules/react/cjs/react.production.min.js
new file mode 100644
index 0000000..9128695
--- /dev/null
+++ b/ddb_main/node_modules/react/cjs/react.production.min.js
@@ -0,0 +1,23 @@
+/** @license React v17.0.2
+ * react.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';var l=require("object-assign"),n=60103,p=60106;exports.Fragment=60107;exports.StrictMode=60108;exports.Profiler=60114;var q=60109,r=60110,t=60112;exports.Suspense=60113;var u=60115,v=60116;
+if("function"===typeof Symbol&&Symbol.for){var w=Symbol.for;n=w("react.element");p=w("react.portal");exports.Fragment=w("react.fragment");exports.StrictMode=w("react.strict_mode");exports.Profiler=w("react.profiler");q=w("react.provider");r=w("react.context");t=w("react.forward_ref");exports.Suspense=w("react.suspense");u=w("react.memo");v=w("react.lazy")}var x="function"===typeof Symbol&&Symbol.iterator;
+function y(a){if(null===a||"object"!==typeof a)return null;a=x&&a[x]||a["@@iterator"];return"function"===typeof a?a:null}function z(a){for(var b="https://reactjs.org/docs/error-decoder.html?invariant="+a,c=1;c<arguments.length;c++)b+="&args[]="+encodeURIComponent(arguments[c]);return"Minified React error #"+a+"; visit "+b+" for the full message or use the non-minified dev environment for full errors and additional helpful warnings."}
+var A={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},B={};function C(a,b,c){this.props=a;this.context=b;this.refs=B;this.updater=c||A}C.prototype.isReactComponent={};C.prototype.setState=function(a,b){if("object"!==typeof a&&"function"!==typeof a&&null!=a)throw Error(z(85));this.updater.enqueueSetState(this,a,b,"setState")};C.prototype.forceUpdate=function(a){this.updater.enqueueForceUpdate(this,a,"forceUpdate")};
+function D(){}D.prototype=C.prototype;function E(a,b,c){this.props=a;this.context=b;this.refs=B;this.updater=c||A}var F=E.prototype=new D;F.constructor=E;l(F,C.prototype);F.isPureReactComponent=!0;var G={current:null},H=Object.prototype.hasOwnProperty,I={key:!0,ref:!0,__self:!0,__source:!0};
+function J(a,b,c){var e,d={},k=null,h=null;if(null!=b)for(e in void 0!==b.ref&&(h=b.ref),void 0!==b.key&&(k=""+b.key),b)H.call(b,e)&&!I.hasOwnProperty(e)&&(d[e]=b[e]);var g=arguments.length-2;if(1===g)d.children=c;else if(1<g){for(var f=Array(g),m=0;m<g;m++)f[m]=arguments[m+2];d.children=f}if(a&&a.defaultProps)for(e in g=a.defaultProps,g)void 0===d[e]&&(d[e]=g[e]);return{$$typeof:n,type:a,key:k,ref:h,props:d,_owner:G.current}}
+function K(a,b){return{$$typeof:n,type:a.type,key:b,ref:a.ref,props:a.props,_owner:a._owner}}function L(a){return"object"===typeof a&&null!==a&&a.$$typeof===n}function escape(a){var b={"=":"=0",":":"=2"};return"$"+a.replace(/[=:]/g,function(a){return b[a]})}var M=/\/+/g;function N(a,b){return"object"===typeof a&&null!==a&&null!=a.key?escape(""+a.key):b.toString(36)}
+function O(a,b,c,e,d){var k=typeof a;if("undefined"===k||"boolean"===k)a=null;var h=!1;if(null===a)h=!0;else switch(k){case "string":case "number":h=!0;break;case "object":switch(a.$$typeof){case n:case p:h=!0}}if(h)return h=a,d=d(h),a=""===e?"."+N(h,0):e,Array.isArray(d)?(c="",null!=a&&(c=a.replace(M,"$&/")+"/"),O(d,b,c,"",function(a){return a})):null!=d&&(L(d)&&(d=K(d,c+(!d.key||h&&h.key===d.key?"":(""+d.key).replace(M,"$&/")+"/")+a)),b.push(d)),1;h=0;e=""===e?".":e+":";if(Array.isArray(a))for(var g=
+0;g<a.length;g++){k=a[g];var f=e+N(k,g);h+=O(k,b,c,f,d)}else if(f=y(a),"function"===typeof f)for(a=f.call(a),g=0;!(k=a.next()).done;)k=k.value,f=e+N(k,g++),h+=O(k,b,c,f,d);else if("object"===k)throw b=""+a,Error(z(31,"[object Object]"===b?"object with keys {"+Object.keys(a).join(", ")+"}":b));return h}function P(a,b,c){if(null==a)return a;var e=[],d=0;O(a,e,"","",function(a){return b.call(c,a,d++)});return e}
+function Q(a){if(-1===a._status){var b=a._result;b=b();a._status=0;a._result=b;b.then(function(b){0===a._status&&(b=b.default,a._status=1,a._result=b)},function(b){0===a._status&&(a._status=2,a._result=b)})}if(1===a._status)return a._result;throw a._result;}var R={current:null};function S(){var a=R.current;if(null===a)throw Error(z(321));return a}var T={ReactCurrentDispatcher:R,ReactCurrentBatchConfig:{transition:0},ReactCurrentOwner:G,IsSomeRendererActing:{current:!1},assign:l};
+exports.Children={map:P,forEach:function(a,b,c){P(a,function(){b.apply(this,arguments)},c)},count:function(a){var b=0;P(a,function(){b++});return b},toArray:function(a){return P(a,function(a){return a})||[]},only:function(a){if(!L(a))throw Error(z(143));return a}};exports.Component=C;exports.PureComponent=E;exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED=T;
+exports.cloneElement=function(a,b,c){if(null===a||void 0===a)throw Error(z(267,a));var e=l({},a.props),d=a.key,k=a.ref,h=a._owner;if(null!=b){void 0!==b.ref&&(k=b.ref,h=G.current);void 0!==b.key&&(d=""+b.key);if(a.type&&a.type.defaultProps)var g=a.type.defaultProps;for(f in b)H.call(b,f)&&!I.hasOwnProperty(f)&&(e[f]=void 0===b[f]&&void 0!==g?g[f]:b[f])}var f=arguments.length-2;if(1===f)e.children=c;else if(1<f){g=Array(f);for(var m=0;m<f;m++)g[m]=arguments[m+2];e.children=g}return{$$typeof:n,type:a.type,
+key:d,ref:k,props:e,_owner:h}};exports.createContext=function(a,b){void 0===b&&(b=null);a={$$typeof:r,_calculateChangedBits:b,_currentValue:a,_currentValue2:a,_threadCount:0,Provider:null,Consumer:null};a.Provider={$$typeof:q,_context:a};return a.Consumer=a};exports.createElement=J;exports.createFactory=function(a){var b=J.bind(null,a);b.type=a;return b};exports.createRef=function(){return{current:null}};exports.forwardRef=function(a){return{$$typeof:t,render:a}};exports.isValidElement=L;
+exports.lazy=function(a){return{$$typeof:v,_payload:{_status:-1,_result:a},_init:Q}};exports.memo=function(a,b){return{$$typeof:u,type:a,compare:void 0===b?null:b}};exports.useCallback=function(a,b){return S().useCallback(a,b)};exports.useContext=function(a,b){return S().useContext(a,b)};exports.useDebugValue=function(){};exports.useEffect=function(a,b){return S().useEffect(a,b)};exports.useImperativeHandle=function(a,b,c){return S().useImperativeHandle(a,b,c)};
+exports.useLayoutEffect=function(a,b){return S().useLayoutEffect(a,b)};exports.useMemo=function(a,b){return S().useMemo(a,b)};exports.useReducer=function(a,b,c){return S().useReducer(a,b,c)};exports.useRef=function(a){return S().useRef(a)};exports.useState=function(a){return S().useState(a)};exports.version="17.0.2";
diff --git a/ddb_main/node_modules/react/index.js b/ddb_main/node_modules/react/index.js
new file mode 100644
index 0000000..999ead7
--- /dev/null
+++ b/ddb_main/node_modules/react/index.js
@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react.production.min.js');
+} else {
+  module.exports = require('./cjs/react.development.js');
+}
diff --git a/ddb_main/node_modules/react/jsx-runtime.js b/ddb_main/node_modules/react/jsx-runtime.js
new file mode 100644
index 0000000..0416df5
--- /dev/null
+++ b/ddb_main/node_modules/react/jsx-runtime.js
@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-jsx-runtime.production.min.js');
+} else {
+  module.exports = require('./cjs/react-jsx-runtime.development.js');
+}
diff --git a/ddb_main/node_modules/redux-devtools-extension/index.js b/ddb_main/node_modules/redux-devtools-extension/index.js
new file mode 100644
index 0000000..02fca41
--- /dev/null
+++ b/ddb_main/node_modules/redux-devtools-extension/index.js
@@ -0,0 +1,22 @@
+'use strict';
+
+var compose = require('redux').compose;
+
+exports.__esModule = true;
+exports.composeWithDevTools =
+  typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
+    ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
+    : function () {
+        if (arguments.length === 0) return undefined;
+        if (typeof arguments[0] === 'object') return compose;
+        return compose.apply(null, arguments);
+      };
+
+exports.devToolsEnhancer =
+  typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__
+    ? window.__REDUX_DEVTOOLS_EXTENSION__
+    : function () {
+        return function (noop) {
+          return noop;
+        };
+      };
diff --git a/ddb_main/node_modules/redux-logger/dist/redux-logger.js b/ddb_main/node_modules/redux-logger/dist/redux-logger.js
new file mode 100644
index 0000000..0ffa1ee
--- /dev/null
+++ b/ddb_main/node_modules/redux-logger/dist/redux-logger.js
@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(e.reduxLogger=e.reduxLogger||{})}(this,function(e){"use strict";function t(e,t){e.super_=t,e.prototype=Object.create(t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}})}function r(e,t){Object.defineProperty(this,"kind",{value:e,enumerable:!0}),t&&t.length&&Object.defineProperty(this,"path",{value:t,enumerable:!0})}function n(e,t,r){n.super_.call(this,"E",e),Object.defineProperty(this,"lhs",{value:t,enumerable:!0}),Object.defineProperty(this,"rhs",{value:r,enumerable:!0})}function o(e,t){o.super_.call(this,"N",e),Object.defineProperty(this,"rhs",{value:t,enumerable:!0})}function i(e,t){i.super_.call(this,"D",e),Object.defineProperty(this,"lhs",{value:t,enumerable:!0})}function a(e,t,r){a.super_.call(this,"A",e),Object.defineProperty(this,"index",{value:t,enumerable:!0}),Object.defineProperty(this,"item",{value:r,enumerable:!0})}function f(e,t,r){var n=e.slice((r||t)+1||e.length);return e.length=t<0?e.length+t:t,e.push.apply(e,n),e}function u(e){var t="undefined"==typeof e?"undefined":N(e);return"object"!==t?t:e===Math?"math":null===e?"null":Array.isArray(e)?"array":"[object Date]"===Object.prototype.toString.call(e)?"date":"function"==typeof e.toString&&/^\/.*\//.test(e.toString())?"regexp":"object"}function l(e,t,r,c,s,d,p){s=s||[],p=p||[];var g=s.slice(0);if("undefined"!=typeof d){if(c){if("function"==typeof c&&c(g,d))return;if("object"===("undefined"==typeof c?"undefined":N(c))){if(c.prefilter&&c.prefilter(g,d))return;if(c.normalize){var h=c.normalize(g,d,e,t);h&&(e=h[0],t=h[1])}}}g.push(d)}"regexp"===u(e)&&"regexp"===u(t)&&(e=e.toString(),t=t.toString());var y="undefined"==typeof e?"undefined":N(e),v="undefined"==typeof t?"undefined":N(t),b="undefined"!==y||p&&p[p.length-1].lhs&&p[p.length-1].lhs.hasOwnProperty(d),m="undefined"!==v||p&&p[p.length-1].rhs&&p[p.length-1].rhs.hasOwnProperty(d);if(!b&&m)r(new o(g,t));else if(!m&&b)r(new i(g,e));else if(u(e)!==u(t))r(new n(g,e,t));else if("date"===u(e)&&e-t!==0)r(new n(g,e,t));else if("object"===y&&null!==e&&null!==t)if(p.filter(function(t){return t.lhs===e}).length)e!==t&&r(new n(g,e,t));else{if(p.push({lhs:e,rhs:t}),Array.isArray(e)){var w;e.length;for(w=0;w<e.length;w++)w>=t.length?r(new a(g,w,new i(void 0,e[w]))):l(e[w],t[w],r,c,g,w,p);for(;w<t.length;)r(new a(g,w,new o(void 0,t[w++])))}else{var x=Object.keys(e),S=Object.keys(t);x.forEach(function(n,o){var i=S.indexOf(n);i>=0?(l(e[n],t[n],r,c,g,n,p),S=f(S,i)):l(e[n],void 0,r,c,g,n,p)}),S.forEach(function(e){l(void 0,t[e],r,c,g,e,p)})}p.length=p.length-1}else e!==t&&("number"===y&&isNaN(e)&&isNaN(t)||r(new n(g,e,t)))}function c(e,t,r,n){return n=n||[],l(e,t,function(e){e&&n.push(e)},r),n.length?n:void 0}function s(e,t,r){if(r.path&&r.path.length){var n,o=e[t],i=r.path.length-1;for(n=0;n<i;n++)o=o[r.path[n]];switch(r.kind){case"A":s(o[r.path[n]],r.index,r.item);break;case"D":delete o[r.path[n]];break;case"E":case"N":o[r.path[n]]=r.rhs}}else switch(r.kind){case"A":s(e[t],r.index,r.item);break;case"D":e=f(e,t);break;case"E":case"N":e[t]=r.rhs}return e}function d(e,t,r){if(e&&t&&r&&r.kind){for(var n=e,o=-1,i=r.path?r.path.length-1:0;++o<i;)"undefined"==typeof n[r.path[o]]&&(n[r.path[o]]="number"==typeof r.path[o]?[]:{}),n=n[r.path[o]];switch(r.kind){case"A":s(r.path?n[r.path[o]]:n,r.index,r.item);break;case"D":delete n[r.path[o]];break;case"E":case"N":n[r.path[o]]=r.rhs}}}function p(e,t,r){if(r.path&&r.path.length){var n,o=e[t],i=r.path.length-1;for(n=0;n<i;n++)o=o[r.path[n]];switch(r.kind){case"A":p(o[r.path[n]],r.index,r.item);break;case"D":o[r.path[n]]=r.lhs;break;case"E":o[r.path[n]]=r.lhs;break;case"N":delete o[r.path[n]]}}else switch(r.kind){case"A":p(e[t],r.index,r.item);break;case"D":e[t]=r.lhs;break;case"E":e[t]=r.lhs;break;case"N":e=f(e,t)}return e}function g(e,t,r){if(e&&t&&r&&r.kind){var n,o,i=e;for(o=r.path.length-1,n=0;n<o;n++)"undefined"==typeof i[r.path[n]]&&(i[r.path[n]]={}),i=i[r.path[n]];switch(r.kind){case"A":p(i[r.path[n]],r.index,r.item);break;case"D":i[r.path[n]]=r.lhs;break;case"E":i[r.path[n]]=r.lhs;break;case"N":delete i[r.path[n]]}}}function h(e,t,r){if(e&&t){var n=function(n){r&&!r(e,t,n)||d(e,t,n)};l(e,t,n)}}function y(e){return"color: "+F[e].color+"; font-weight: bold"}function v(e){var t=e.kind,r=e.path,n=e.lhs,o=e.rhs,i=e.index,a=e.item;switch(t){case"E":return[r.join("."),n,"→",o];case"N":return[r.join("."),o];case"D":return[r.join(".")];case"A":return[r.join(".")+"["+i+"]",a];default:return[]}}function b(e,t,r,n){var o=c(e,t);try{n?r.groupCollapsed("diff"):r.group("diff")}catch(e){r.log("diff")}o?o.forEach(function(e){var t=e.kind,n=v(e);r.log.apply(r,["%c "+F[t].text,y(t)].concat(P(n)))}):r.log("—— no diff ——");try{r.groupEnd()}catch(e){r.log("—— diff end —— ")}}function m(e,t,r,n){switch("undefined"==typeof e?"undefined":N(e)){case"object":return"function"==typeof e[n]?e[n].apply(e,P(r)):e[n];case"function":return e(t);default:return e}}function w(e){var t=e.timestamp,r=e.duration;return function(e,n,o){var i=["action"];return i.push("%c"+String(e.type)),t&&i.push("%c@ "+n),r&&i.push("%c(in "+o.toFixed(2)+" ms)"),i.join(" ")}}function x(e,t){var r=t.logger,n=t.actionTransformer,o=t.titleFormatter,i=void 0===o?w(t):o,a=t.collapsed,f=t.colors,u=t.level,l=t.diff,c="undefined"==typeof t.titleFormatter;e.forEach(function(o,s){var d=o.started,p=o.startedTime,g=o.action,h=o.prevState,y=o.error,v=o.took,w=o.nextState,x=e[s+1];x&&(w=x.prevState,v=x.started-d);var S=n(g),k="function"==typeof a?a(function(){return w},g,o):a,j=D(p),E=f.title?"color: "+f.title(S)+";":"",A=["color: gray; font-weight: lighter;"];A.push(E),t.timestamp&&A.push("color: gray; font-weight: lighter;"),t.duration&&A.push("color: gray; font-weight: lighter;");var O=i(S,j,v);try{k?f.title&&c?r.groupCollapsed.apply(r,["%c "+O].concat(A)):r.groupCollapsed(O):f.title&&c?r.group.apply(r,["%c "+O].concat(A)):r.group(O)}catch(e){r.log(O)}var N=m(u,S,[h],"prevState"),P=m(u,S,[S],"action"),C=m(u,S,[y,h],"error"),F=m(u,S,[w],"nextState");if(N)if(f.prevState){var L="color: "+f.prevState(h)+"; font-weight: bold";r[N]("%c prev state",L,h)}else r[N]("prev state",h);if(P)if(f.action){var T="color: "+f.action(S)+"; font-weight: bold";r[P]("%c action    ",T,S)}else r[P]("action    ",S);if(y&&C)if(f.error){var M="color: "+f.error(y,h)+"; font-weight: bold;";r[C]("%c error     ",M,y)}else r[C]("error     ",y);if(F)if(f.nextState){var _="color: "+f.nextState(w)+"; font-weight: bold";r[F]("%c next state",_,w)}else r[F]("next state",w);l&&b(h,w,r,k);try{r.groupEnd()}catch(e){r.log("—— log end ——")}})}function S(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=Object.assign({},L,e),r=t.logger,n=t.stateTransformer,o=t.errorTransformer,i=t.predicate,a=t.logErrors,f=t.diffPredicate;if("undefined"==typeof r)return function(){return function(e){return function(t){return e(t)}}};if(e.getState&&e.dispatch)return console.error("[redux-logger] redux-logger not installed. Make sure to pass logger instance as middleware:\n// Logger with default options\nimport { logger } from 'redux-logger'\nconst store = createStore(\n  reducer,\n  applyMiddleware(logger)\n)\n// Or you can create your own logger with custom options http://bit.ly/redux-logger-options\nimport createLogger from 'redux-logger'\nconst logger = createLogger({\n  // ...options\n});\nconst store = createStore(\n  reducer,\n  applyMiddleware(logger)\n)\n"),function(){return function(e){return function(t){return e(t)}}};var u=[];return function(e){var r=e.getState;return function(e){return function(l){if("function"==typeof i&&!i(r,l))return e(l);var c={};u.push(c),c.started=O.now(),c.startedTime=new Date,c.prevState=n(r()),c.action=l;var s=void 0;if(a)try{s=e(l)}catch(e){c.error=o(e)}else s=e(l);c.took=O.now()-c.started,c.nextState=n(r());var d=t.diff&&"function"==typeof f?f(r,l):t.diff;if(x(u,Object.assign({},t,{diff:d})),u.length=0,c.error)throw c.error;return s}}}}var k,j,E=function(e,t){return new Array(t+1).join(e)},A=function(e,t){return E("0",t-e.toString().length)+e},D=function(e){return A(e.getHours(),2)+":"+A(e.getMinutes(),2)+":"+A(e.getSeconds(),2)+"."+A(e.getMilliseconds(),3)},O="undefined"!=typeof performance&&null!==performance&&"function"==typeof performance.now?performance:Date,N="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},P=function(e){if(Array.isArray(e)){for(var t=0,r=Array(e.length);t<e.length;t++)r[t]=e[t];return r}return Array.from(e)},C=[];k="object"===("undefined"==typeof global?"undefined":N(global))&&global?global:"undefined"!=typeof window?window:{},j=k.DeepDiff,j&&C.push(function(){"undefined"!=typeof j&&k.DeepDiff===c&&(k.DeepDiff=j,j=void 0)}),t(n,r),t(o,r),t(i,r),t(a,r),Object.defineProperties(c,{diff:{value:c,enumerable:!0},observableDiff:{value:l,enumerable:!0},applyDiff:{value:h,enumerable:!0},applyChange:{value:d,enumerable:!0},revertChange:{value:g,enumerable:!0},isConflict:{value:function(){return"undefined"!=typeof j},enumerable:!0},noConflict:{value:function(){return C&&(C.forEach(function(e){e()}),C=null),c},enumerable:!0}});var F={E:{color:"#2196F3",text:"CHANGED:"},N:{color:"#4CAF50",text:"ADDED:"},D:{color:"#F44336",text:"DELETED:"},A:{color:"#2196F3",text:"ARRAY:"}},L={level:"log",logger:console,logErrors:!0,collapsed:void 0,predicate:void 0,duration:!1,timestamp:!0,stateTransformer:function(e){return e},actionTransformer:function(e){return e},errorTransformer:function(e){return e},colors:{title:function(){return"inherit"},prevState:function(){return"#9E9E9E"},action:function(){return"#03A9F4"},nextState:function(){return"#4CAF50"},error:function(){return"#F20404"}},diff:!1,diffPredicate:void 0,transformer:void 0},T=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=e.dispatch,r=e.getState;return"function"==typeof t||"function"==typeof r?S()({dispatch:t,getState:r}):void console.error("\n[redux-logger v3] BREAKING CHANGE\n[redux-logger v3] Since 3.0.0 redux-logger exports by default logger with default settings.\n[redux-logger v3] Change\n[redux-logger v3] import createLogger from 'redux-logger'\n[redux-logger v3] to\n[redux-logger v3] import { createLogger } from 'redux-logger'\n")};e.defaults=L,e.createLogger=S,e.logger=T,e.default=T,Object.defineProperty(e,"__esModule",{value:!0})});
diff --git a/ddb_main/node_modules/redux-saga/dist/redux-saga-core-npm-proxy.esm.js b/ddb_main/node_modules/redux-saga/dist/redux-saga-core-npm-proxy.esm.js
new file mode 100644
index 0000000..dc97702
--- /dev/null
+++ b/ddb_main/node_modules/redux-saga/dist/redux-saga-core-npm-proxy.esm.js
@@ -0,0 +1,6 @@
+import createSagaMiddleware__default from '@redux-saga/core';
+export * from '@redux-saga/core';
+
+
+
+export default createSagaMiddleware__default;
diff --git a/ddb_main/node_modules/redux/es/redux.js b/ddb_main/node_modules/redux/es/redux.js
new file mode 100644
index 0000000..a3ae783
--- /dev/null
+++ b/ddb_main/node_modules/redux/es/redux.js
@@ -0,0 +1,705 @@
+import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
+
+/**
+ * Adapted from React: https://github.com/facebook/react/blob/master/packages/shared/formatProdErrorMessage.js
+ *
+ * Do not require this module directly! Use normal throw error calls. These messages will be replaced with error codes
+ * during build.
+ * @param {number} code
+ */
+function formatProdErrorMessage(code) {
+  return "Minified Redux error #" + code + "; visit https://redux.js.org/Errors?code=" + code + " for the full message or " + 'use the non-minified dev environment for full errors. ';
+}
+
+// Inlined version of the `symbol-observable` polyfill
+var $$observable = (function () {
+  return typeof Symbol === 'function' && Symbol.observable || '@@observable';
+})();
+
+/**
+ * These are private action types reserved by Redux.
+ * For any unknown actions, you must return the current state.
+ * If the current state is undefined, you must return the initial state.
+ * Do not reference these action types directly in your code.
+ */
+var randomString = function randomString() {
+  return Math.random().toString(36).substring(7).split('').join('.');
+};
+
+var ActionTypes = {
+  INIT: "@@redux/INIT" + randomString(),
+  REPLACE: "@@redux/REPLACE" + randomString(),
+  PROBE_UNKNOWN_ACTION: function PROBE_UNKNOWN_ACTION() {
+    return "@@redux/PROBE_UNKNOWN_ACTION" + randomString();
+  }
+};
+
+/**
+ * @param {any} obj The object to inspect.
+ * @returns {boolean} True if the argument appears to be a plain object.
+ */
+function isPlainObject(obj) {
+  if (typeof obj !== 'object' || obj === null) return false;
+  var proto = obj;
+
+  while (Object.getPrototypeOf(proto) !== null) {
+    proto = Object.getPrototypeOf(proto);
+  }
+
+  return Object.getPrototypeOf(obj) === proto;
+}
+
+// Inlined / shortened version of `kindOf` from https://github.com/jonschlinkert/kind-of
+function miniKindOf(val) {
+  if (val === void 0) return 'undefined';
+  if (val === null) return 'null';
+  var type = typeof val;
+
+  switch (type) {
+    case 'boolean':
+    case 'string':
+    case 'number':
+    case 'symbol':
+    case 'function':
+      {
+        return type;
+      }
+  }
+
+  if (Array.isArray(val)) return 'array';
+  if (isDate(val)) return 'date';
+  if (isError(val)) return 'error';
+  var constructorName = ctorName(val);
+
+  switch (constructorName) {
+    case 'Symbol':
+    case 'Promise':
+    case 'WeakMap':
+    case 'WeakSet':
+    case 'Map':
+    case 'Set':
+      return constructorName;
+  } // other
+
+
+  return type.slice(8, -1).toLowerCase().replace(/\s/g, '');
+}
+
+function ctorName(val) {
+  return typeof val.constructor === 'function' ? val.constructor.name : null;
+}
+
+function isError(val) {
+  return val instanceof Error || typeof val.message === 'string' && val.constructor && typeof val.constructor.stackTraceLimit === 'number';
+}
+
+function isDate(val) {
+  if (val instanceof Date) return true;
+  return typeof val.toDateString === 'function' && typeof val.getDate === 'function' && typeof val.setDate === 'function';
+}
+
+function kindOf(val) {
+  var typeOfVal = typeof val;
+
+  if (process.env.NODE_ENV !== 'production') {
+    typeOfVal = miniKindOf(val);
+  }
+
+  return typeOfVal;
+}
+
+/**
+ * @deprecated
+ *
+ * **We recommend using the `configureStore` method
+ * of the `@reduxjs/toolkit` package**, which replaces `createStore`.
+ *
+ * Redux Toolkit is our recommended approach for writing Redux logic today,
+ * including store setup, reducers, data fetching, and more.
+ *
+ * **For more details, please read this Redux docs page:**
+ * **https://redux.js.org/introduction/why-rtk-is-redux-today**
+ *
+ * `configureStore` from Redux Toolkit is an improved version of `createStore` that
+ * simplifies setup and helps avoid common bugs.
+ *
+ * You should not be using the `redux` core package by itself today, except for learning purposes.
+ * The `createStore` method from the core `redux` package will not be removed, but we encourage
+ * all users to migrate to using Redux Toolkit for all Redux code.
+ *
+ * If you want to use `createStore` without this visual deprecation warning, use
+ * the `legacy_createStore` import instead:
+ *
+ * `import { legacy_createStore as createStore} from 'redux'`
+ *
+ */
+
+function createStore(reducer, preloadedState, enhancer) {
+  var _ref2;
+
+  if (typeof preloadedState === 'function' && typeof enhancer === 'function' || typeof enhancer === 'function' && typeof arguments[3] === 'function') {
+    throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(0) : 'It looks like you are passing several store enhancers to ' + 'createStore(). This is not supported. Instead, compose them ' + 'together to a single function. See https://redux.js.org/tutorials/fundamentals/part-4-store#creating-a-store-with-enhancers for an example.');
+  }
+
+  if (typeof preloadedState === 'function' && typeof enhancer === 'undefined') {
+    enhancer = preloadedState;
+    preloadedState = undefined;
+  }
+
+  if (typeof enhancer !== 'undefined') {
+    if (typeof enhancer !== 'function') {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(1) : "Expected the enhancer to be a function. Instead, received: '" + kindOf(enhancer) + "'");
+    }
+
+    return enhancer(createStore)(reducer, preloadedState);
+  }
+
+  if (typeof reducer !== 'function') {
+    throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(2) : "Expected the root reducer to be a function. Instead, received: '" + kindOf(reducer) + "'");
+  }
+
+  var currentReducer = reducer;
+  var currentState = preloadedState;
+  var currentListeners = [];
+  var nextListeners = currentListeners;
+  var isDispatching = false;
+  /**
+   * This makes a shallow copy of currentListeners so we can use
+   * nextListeners as a temporary list while dispatching.
+   *
+   * This prevents any bugs around consumers calling
+   * subscribe/unsubscribe in the middle of a dispatch.
+   */
+
+  function ensureCanMutateNextListeners() {
+    if (nextListeners === currentListeners) {
+      nextListeners = currentListeners.slice();
+    }
+  }
+  /**
+   * Reads the state tree managed by the store.
+   *
+   * @returns {any} The current state tree of your application.
+   */
+
+
+  function getState() {
+    if (isDispatching) {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(3) : 'You may not call store.getState() while the reducer is executing. ' + 'The reducer has already received the state as an argument. ' + 'Pass it down from the top reducer instead of reading it from the store.');
+    }
+
+    return currentState;
+  }
+  /**
+   * Adds a change listener. It will be called any time an action is dispatched,
+   * and some part of the state tree may potentially have changed. You may then
+   * call `getState()` to read the current state tree inside the callback.
+   *
+   * You may call `dispatch()` from a change listener, with the following
+   * caveats:
+   *
+   * 1. The subscriptions are snapshotted just before every `dispatch()` call.
+   * If you subscribe or unsubscribe while the listeners are being invoked, this
+   * will not have any effect on the `dispatch()` that is currently in progress.
+   * However, the next `dispatch()` call, whether nested or not, will use a more
+   * recent snapshot of the subscription list.
+   *
+   * 2. The listener should not expect to see all state changes, as the state
+   * might have been updated multiple times during a nested `dispatch()` before
+   * the listener is called. It is, however, guaranteed that all subscribers
+   * registered before the `dispatch()` started will be called with the latest
+   * state by the time it exits.
+   *
+   * @param {Function} listener A callback to be invoked on every dispatch.
+   * @returns {Function} A function to remove this change listener.
+   */
+
+
+  function subscribe(listener) {
+    if (typeof listener !== 'function') {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(4) : "Expected the listener to be a function. Instead, received: '" + kindOf(listener) + "'");
+    }
+
+    if (isDispatching) {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(5) : 'You may not call store.subscribe() while the reducer is executing. ' + 'If you would like to be notified after the store has been updated, subscribe from a ' + 'component and invoke store.getState() in the callback to access the latest state. ' + 'See https://redux.js.org/api/store#subscribelistener for more details.');
+    }
+
+    var isSubscribed = true;
+    ensureCanMutateNextListeners();
+    nextListeners.push(listener);
+    return function unsubscribe() {
+      if (!isSubscribed) {
+        return;
+      }
+
+      if (isDispatching) {
+        throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(6) : 'You may not unsubscribe from a store listener while the reducer is executing. ' + 'See https://redux.js.org/api/store#subscribelistener for more details.');
+      }
+
+      isSubscribed = false;
+      ensureCanMutateNextListeners();
+      var index = nextListeners.indexOf(listener);
+      nextListeners.splice(index, 1);
+      currentListeners = null;
+    };
+  }
+  /**
+   * Dispatches an action. It is the only way to trigger a state change.
+   *
+   * The `reducer` function, used to create the store, will be called with the
+   * current state tree and the given `action`. Its return value will
+   * be considered the **next** state of the tree, and the change listeners
+   * will be notified.
+   *
+   * The base implementation only supports plain object actions. If you want to
+   * dispatch a Promise, an Observable, a thunk, or something else, you need to
+   * wrap your store creating function into the corresponding middleware. For
+   * example, see the documentation for the `redux-thunk` package. Even the
+   * middleware will eventually dispatch plain object actions using this method.
+   *
+   * @param {Object} action A plain object representing “what changed”. It is
+   * a good idea to keep actions serializable so you can record and replay user
+   * sessions, or use the time travelling `redux-devtools`. An action must have
+   * a `type` property which may not be `undefined`. It is a good idea to use
+   * string constants for action types.
+   *
+   * @returns {Object} For convenience, the same action object you dispatched.
+   *
+   * Note that, if you use a custom middleware, it may wrap `dispatch()` to
+   * return something else (for example, a Promise you can await).
+   */
+
+
+  function dispatch(action) {
+    if (!isPlainObject(action)) {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(7) : "Actions must be plain objects. Instead, the actual type was: '" + kindOf(action) + "'. You may need to add middleware to your store setup to handle dispatching other values, such as 'redux-thunk' to handle dispatching functions. See https://redux.js.org/tutorials/fundamentals/part-4-store#middleware and https://redux.js.org/tutorials/fundamentals/part-6-async-logic#using-the-redux-thunk-middleware for examples.");
+    }
+
+    if (typeof action.type === 'undefined') {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(8) : 'Actions may not have an undefined "type" property. You may have misspelled an action type string constant.');
+    }
+
+    if (isDispatching) {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(9) : 'Reducers may not dispatch actions.');
+    }
+
+    try {
+      isDispatching = true;
+      currentState = currentReducer(currentState, action);
+    } finally {
+      isDispatching = false;
+    }
+
+    var listeners = currentListeners = nextListeners;
+
+    for (var i = 0; i < listeners.length; i++) {
+      var listener = listeners[i];
+      listener();
+    }
+
+    return action;
+  }
+  /**
+   * Replaces the reducer currently used by the store to calculate the state.
+   *
+   * You might need this if your app implements code splitting and you want to
+   * load some of the reducers dynamically. You might also need this if you
+   * implement a hot reloading mechanism for Redux.
+   *
+   * @param {Function} nextReducer The reducer for the store to use instead.
+   * @returns {void}
+   */
+
+
+  function replaceReducer(nextReducer) {
+    if (typeof nextReducer !== 'function') {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(10) : "Expected the nextReducer to be a function. Instead, received: '" + kindOf(nextReducer));
+    }
+
+    currentReducer = nextReducer; // This action has a similiar effect to ActionTypes.INIT.
+    // Any reducers that existed in both the new and old rootReducer
+    // will receive the previous state. This effectively populates
+    // the new state tree with any relevant data from the old one.
+
+    dispatch({
+      type: ActionTypes.REPLACE
+    });
+  }
+  /**
+   * Interoperability point for observable/reactive libraries.
+   * @returns {observable} A minimal observable of state changes.
+   * For more information, see the observable proposal:
+   * https://github.com/tc39/proposal-observable
+   */
+
+
+  function observable() {
+    var _ref;
+
+    var outerSubscribe = subscribe;
+    return _ref = {
+      /**
+       * The minimal observable subscription method.
+       * @param {Object} observer Any object that can be used as an observer.
+       * The observer object should have a `next` method.
+       * @returns {subscription} An object with an `unsubscribe` method that can
+       * be used to unsubscribe the observable from the store, and prevent further
+       * emission of values from the observable.
+       */
+      subscribe: function subscribe(observer) {
+        if (typeof observer !== 'object' || observer === null) {
+          throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(11) : "Expected the observer to be an object. Instead, received: '" + kindOf(observer) + "'");
+        }
+
+        function observeState() {
+          if (observer.next) {
+            observer.next(getState());
+          }
+        }
+
+        observeState();
+        var unsubscribe = outerSubscribe(observeState);
+        return {
+          unsubscribe: unsubscribe
+        };
+      }
+    }, _ref[$$observable] = function () {
+      return this;
+    }, _ref;
+  } // When a store is created, an "INIT" action is dispatched so that every
+  // reducer returns their initial state. This effectively populates
+  // the initial state tree.
+
+
+  dispatch({
+    type: ActionTypes.INIT
+  });
+  return _ref2 = {
+    dispatch: dispatch,
+    subscribe: subscribe,
+    getState: getState,
+    replaceReducer: replaceReducer
+  }, _ref2[$$observable] = observable, _ref2;
+}
+/**
+ * Creates a Redux store that holds the state tree.
+ *
+ * **We recommend using `configureStore` from the
+ * `@reduxjs/toolkit` package**, which replaces `createStore`:
+ * **https://redux.js.org/introduction/why-rtk-is-redux-today**
+ *
+ * The only way to change the data in the store is to call `dispatch()` on it.
+ *
+ * There should only be a single store in your app. To specify how different
+ * parts of the state tree respond to actions, you may combine several reducers
+ * into a single reducer function by using `combineReducers`.
+ *
+ * @param {Function} reducer A function that returns the next state tree, given
+ * the current state tree and the action to handle.
+ *
+ * @param {any} [preloadedState] The initial state. You may optionally specify it
+ * to hydrate the state from the server in universal apps, or to restore a
+ * previously serialized user session.
+ * If you use `combineReducers` to produce the root reducer function, this must be
+ * an object with the same shape as `combineReducers` keys.
+ *
+ * @param {Function} [enhancer] The store enhancer. You may optionally specify it
+ * to enhance the store with third-party capabilities such as middleware,
+ * time travel, persistence, etc. The only store enhancer that ships with Redux
+ * is `applyMiddleware()`.
+ *
+ * @returns {Store} A Redux store that lets you read the state, dispatch actions
+ * and subscribe to changes.
+ */
+
+var legacy_createStore = createStore;
+
+/**
+ * Prints a warning in the console if it exists.
+ *
+ * @param {String} message The warning message.
+ * @returns {void}
+ */
+function warning(message) {
+  /* eslint-disable no-console */
+  if (typeof console !== 'undefined' && typeof console.error === 'function') {
+    console.error(message);
+  }
+  /* eslint-enable no-console */
+
+
+  try {
+    // This error was thrown as a convenience so that if you enable
+    // "break on all exceptions" in your console,
+    // it would pause the execution at this line.
+    throw new Error(message);
+  } catch (e) {} // eslint-disable-line no-empty
+
+}
+
+function getUnexpectedStateShapeWarningMessage(inputState, reducers, action, unexpectedKeyCache) {
+  var reducerKeys = Object.keys(reducers);
+  var argumentName = action && action.type === ActionTypes.INIT ? 'preloadedState argument passed to createStore' : 'previous state received by the reducer';
+
+  if (reducerKeys.length === 0) {
+    return 'Store does not have a valid reducer. Make sure the argument passed ' + 'to combineReducers is an object whose values are reducers.';
+  }
+
+  if (!isPlainObject(inputState)) {
+    return "The " + argumentName + " has unexpected type of \"" + kindOf(inputState) + "\". Expected argument to be an object with the following " + ("keys: \"" + reducerKeys.join('", "') + "\"");
+  }
+
+  var unexpectedKeys = Object.keys(inputState).filter(function (key) {
+    return !reducers.hasOwnProperty(key) && !unexpectedKeyCache[key];
+  });
+  unexpectedKeys.forEach(function (key) {
+    unexpectedKeyCache[key] = true;
+  });
+  if (action && action.type === ActionTypes.REPLACE) return;
+
+  if (unexpectedKeys.length > 0) {
+    return "Unexpected " + (unexpectedKeys.length > 1 ? 'keys' : 'key') + " " + ("\"" + unexpectedKeys.join('", "') + "\" found in " + argumentName + ". ") + "Expected to find one of the known reducer keys instead: " + ("\"" + reducerKeys.join('", "') + "\". Unexpected keys will be ignored.");
+  }
+}
+
+function assertReducerShape(reducers) {
+  Object.keys(reducers).forEach(function (key) {
+    var reducer = reducers[key];
+    var initialState = reducer(undefined, {
+      type: ActionTypes.INIT
+    });
+
+    if (typeof initialState === 'undefined') {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(12) : "The slice reducer for key \"" + key + "\" returned undefined during initialization. " + "If the state passed to the reducer is undefined, you must " + "explicitly return the initial state. The initial state may " + "not be undefined. If you don't want to set a value for this reducer, " + "you can use null instead of undefined.");
+    }
+
+    if (typeof reducer(undefined, {
+      type: ActionTypes.PROBE_UNKNOWN_ACTION()
+    }) === 'undefined') {
+      throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(13) : "The slice reducer for key \"" + key + "\" returned undefined when probed with a random type. " + ("Don't try to handle '" + ActionTypes.INIT + "' or other actions in \"redux/*\" ") + "namespace. They are considered private. Instead, you must return the " + "current state for any unknown actions, unless it is undefined, " + "in which case you must return the initial state, regardless of the " + "action type. The initial state may not be undefined, but can be null.");
+    }
+  });
+}
+/**
+ * Turns an object whose values are different reducer functions, into a single
+ * reducer function. It will call every child reducer, and gather their results
+ * into a single state object, whose keys correspond to the keys of the passed
+ * reducer functions.
+ *
+ * @param {Object} reducers An object whose values correspond to different
+ * reducer functions that need to be combined into one. One handy way to obtain
+ * it is to use ES6 `import * as reducers` syntax. The reducers may never return
+ * undefined for any action. Instead, they should return their initial state
+ * if the state passed to them was undefined, and the current state for any
+ * unrecognized action.
+ *
+ * @returns {Function} A reducer function that invokes every reducer inside the
+ * passed object, and builds a state object with the same shape.
+ */
+
+
+function combineReducers(reducers) {
+  var reducerKeys = Object.keys(reducers);
+  var finalReducers = {};
+
+  for (var i = 0; i < reducerKeys.length; i++) {
+    var key = reducerKeys[i];
+
+    if (process.env.NODE_ENV !== 'production') {
+      if (typeof reducers[key] === 'undefined') {
+        warning("No reducer provided for key \"" + key + "\"");
+      }
+    }
+
+    if (typeof reducers[key] === 'function') {
+      finalReducers[key] = reducers[key];
+    }
+  }
+
+  var finalReducerKeys = Object.keys(finalReducers); // This is used to make sure we don't warn about the same
+  // keys multiple times.
+
+  var unexpectedKeyCache;
+
+  if (process.env.NODE_ENV !== 'production') {
+    unexpectedKeyCache = {};
+  }
+
+  var shapeAssertionError;
+
+  try {
+    assertReducerShape(finalReducers);
+  } catch (e) {
+    shapeAssertionError = e;
+  }
+
+  return function combination(state, action) {
+    if (state === void 0) {
+      state = {};
+    }
+
+    if (shapeAssertionError) {
+      throw shapeAssertionError;
+    }
+
+    if (process.env.NODE_ENV !== 'production') {
+      var warningMessage = getUnexpectedStateShapeWarningMessage(state, finalReducers, action, unexpectedKeyCache);
+
+      if (warningMessage) {
+        warning(warningMessage);
+      }
+    }
+
+    var hasChanged = false;
+    var nextState = {};
+
+    for (var _i = 0; _i < finalReducerKeys.length; _i++) {
+      var _key = finalReducerKeys[_i];
+      var reducer = finalReducers[_key];
+      var previousStateForKey = state[_key];
+      var nextStateForKey = reducer(previousStateForKey, action);
+
+      if (typeof nextStateForKey === 'undefined') {
+        var actionType = action && action.type;
+        throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(14) : "When called with an action of type " + (actionType ? "\"" + String(actionType) + "\"" : '(unknown type)') + ", the slice reducer for key \"" + _key + "\" returned undefined. " + "To ignore an action, you must explicitly return the previous state. " + "If you want this reducer to hold no value, you can return null instead of undefined.");
+      }
+
+      nextState[_key] = nextStateForKey;
+      hasChanged = hasChanged || nextStateForKey !== previousStateForKey;
+    }
+
+    hasChanged = hasChanged || finalReducerKeys.length !== Object.keys(state).length;
+    return hasChanged ? nextState : state;
+  };
+}
+
+function bindActionCreator(actionCreator, dispatch) {
+  return function () {
+    return dispatch(actionCreator.apply(this, arguments));
+  };
+}
+/**
+ * Turns an object whose values are action creators, into an object with the
+ * same keys, but with every function wrapped into a `dispatch` call so they
+ * may be invoked directly. This is just a convenience method, as you can call
+ * `store.dispatch(MyActionCreators.doSomething())` yourself just fine.
+ *
+ * For convenience, you can also pass an action creator as the first argument,
+ * and get a dispatch wrapped function in return.
+ *
+ * @param {Function|Object} actionCreators An object whose values are action
+ * creator functions. One handy way to obtain it is to use ES6 `import * as`
+ * syntax. You may also pass a single function.
+ *
+ * @param {Function} dispatch The `dispatch` function available on your Redux
+ * store.
+ *
+ * @returns {Function|Object} The object mimicking the original object, but with
+ * every action creator wrapped into the `dispatch` call. If you passed a
+ * function as `actionCreators`, the return value will also be a single
+ * function.
+ */
+
+
+function bindActionCreators(actionCreators, dispatch) {
+  if (typeof actionCreators === 'function') {
+    return bindActionCreator(actionCreators, dispatch);
+  }
+
+  if (typeof actionCreators !== 'object' || actionCreators === null) {
+    throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(16) : "bindActionCreators expected an object or a function, but instead received: '" + kindOf(actionCreators) + "'. " + "Did you write \"import ActionCreators from\" instead of \"import * as ActionCreators from\"?");
+  }
+
+  var boundActionCreators = {};
+
+  for (var key in actionCreators) {
+    var actionCreator = actionCreators[key];
+
+    if (typeof actionCreator === 'function') {
+      boundActionCreators[key] = bindActionCreator(actionCreator, dispatch);
+    }
+  }
+
+  return boundActionCreators;
+}
+
+/**
+ * Composes single-argument functions from right to left. The rightmost
+ * function can take multiple arguments as it provides the signature for
+ * the resulting composite function.
+ *
+ * @param {...Function} funcs The functions to compose.
+ * @returns {Function} A function obtained by composing the argument functions
+ * from right to left. For example, compose(f, g, h) is identical to doing
+ * (...args) => f(g(h(...args))).
+ */
+function compose() {
+  for (var _len = arguments.length, funcs = new Array(_len), _key = 0; _key < _len; _key++) {
+    funcs[_key] = arguments[_key];
+  }
+
+  if (funcs.length === 0) {
+    return function (arg) {
+      return arg;
+    };
+  }
+
+  if (funcs.length === 1) {
+    return funcs[0];
+  }
+
+  return funcs.reduce(function (a, b) {
+    return function () {
+      return a(b.apply(void 0, arguments));
+    };
+  });
+}
+
+/**
+ * Creates a store enhancer that applies middleware to the dispatch method
+ * of the Redux store. This is handy for a variety of tasks, such as expressing
+ * asynchronous actions in a concise manner, or logging every action payload.
+ *
+ * See `redux-thunk` package as an example of the Redux middleware.
+ *
+ * Because middleware is potentially asynchronous, this should be the first
+ * store enhancer in the composition chain.
+ *
+ * Note that each middleware will be given the `dispatch` and `getState` functions
+ * as named arguments.
+ *
+ * @param {...Function} middlewares The middleware chain to be applied.
+ * @returns {Function} A store enhancer applying the middleware.
+ */
+
+function applyMiddleware() {
+  for (var _len = arguments.length, middlewares = new Array(_len), _key = 0; _key < _len; _key++) {
+    middlewares[_key] = arguments[_key];
+  }
+
+  return function (createStore) {
+    return function () {
+      var store = createStore.apply(void 0, arguments);
+
+      var _dispatch = function dispatch() {
+        throw new Error(process.env.NODE_ENV === "production" ? formatProdErrorMessage(15) : 'Dispatching while constructing your middleware is not allowed. ' + 'Other middleware would not be applied to this dispatch.');
+      };
+
+      var middlewareAPI = {
+        getState: store.getState,
+        dispatch: function dispatch() {
+          return _dispatch.apply(void 0, arguments);
+        }
+      };
+      var chain = middlewares.map(function (middleware) {
+        return middleware(middlewareAPI);
+      });
+      _dispatch = compose.apply(void 0, chain)(store.dispatch);
+      return _objectSpread(_objectSpread({}, store), {}, {
+        dispatch: _dispatch
+      });
+    };
+  };
+}
+
+export { ActionTypes as __DO_NOT_USE__ActionTypes, applyMiddleware, bindActionCreators, combineReducers, compose, createStore, legacy_createStore };
diff --git a/ddb_main/node_modules/reselect/es/defaultMemoize.js b/ddb_main/node_modules/reselect/es/defaultMemoize.js
new file mode 100644
index 0000000..8923d31
--- /dev/null
+++ b/ddb_main/node_modules/reselect/es/defaultMemoize.js
@@ -0,0 +1,147 @@
+// Cache implementation based on Erik Rasmussen's `lru-memoize`:
+// https://github.com/erikras/lru-memoize
+var NOT_FOUND = 'NOT_FOUND';
+
+function createSingletonCache(equals) {
+  var entry;
+  return {
+    get: function get(key) {
+      if (entry && equals(entry.key, key)) {
+        return entry.value;
+      }
+
+      return NOT_FOUND;
+    },
+    put: function put(key, value) {
+      entry = {
+        key: key,
+        value: value
+      };
+    },
+    getEntries: function getEntries() {
+      return entry ? [entry] : [];
+    },
+    clear: function clear() {
+      entry = undefined;
+    }
+  };
+}
+
+function createLruCache(maxSize, equals) {
+  var entries = [];
+
+  function get(key) {
+    var cacheIndex = entries.findIndex(function (entry) {
+      return equals(key, entry.key);
+    }); // We found a cached entry
+
+    if (cacheIndex > -1) {
+      var entry = entries[cacheIndex]; // Cached entry not at top of cache, move it to the top
+
+      if (cacheIndex > 0) {
+        entries.splice(cacheIndex, 1);
+        entries.unshift(entry);
+      }
+
+      return entry.value;
+    } // No entry found in cache, return sentinel
+
+
+    return NOT_FOUND;
+  }
+
+  function put(key, value) {
+    if (get(key) === NOT_FOUND) {
+      // TODO Is unshift slow?
+      entries.unshift({
+        key: key,
+        value: value
+      });
+
+      if (entries.length > maxSize) {
+        entries.pop();
+      }
+    }
+  }
+
+  function getEntries() {
+    return entries;
+  }
+
+  function clear() {
+    entries = [];
+  }
+
+  return {
+    get: get,
+    put: put,
+    getEntries: getEntries,
+    clear: clear
+  };
+}
+
+export var defaultEqualityCheck = function defaultEqualityCheck(a, b) {
+  return a === b;
+};
+export function createCacheKeyComparator(equalityCheck) {
+  return function areArgumentsShallowlyEqual(prev, next) {
+    if (prev === null || next === null || prev.length !== next.length) {
+      return false;
+    } // Do this in a for loop (and not a `forEach` or an `every`) so we can determine equality as fast as possible.
+
+
+    var length = prev.length;
+
+    for (var i = 0; i < length; i++) {
+      if (!equalityCheck(prev[i], next[i])) {
+        return false;
+      }
+    }
+
+    return true;
+  };
+}
+// defaultMemoize now supports a configurable cache size with LRU behavior,
+// and optional comparison of the result value with existing values
+export function defaultMemoize(func, equalityCheckOrOptions) {
+  var providedOptions = typeof equalityCheckOrOptions === 'object' ? equalityCheckOrOptions : {
+    equalityCheck: equalityCheckOrOptions
+  };
+  var _providedOptions$equa = providedOptions.equalityCheck,
+      equalityCheck = _providedOptions$equa === void 0 ? defaultEqualityCheck : _providedOptions$equa,
+      _providedOptions$maxS = providedOptions.maxSize,
+      maxSize = _providedOptions$maxS === void 0 ? 1 : _providedOptions$maxS,
+      resultEqualityCheck = providedOptions.resultEqualityCheck;
+  var comparator = createCacheKeyComparator(equalityCheck);
+  var cache = maxSize === 1 ? createSingletonCache(comparator) : createLruCache(maxSize, comparator); // we reference arguments instead of spreading them for performance reasons
+
+  function memoized() {
+    var value = cache.get(arguments);
+
+    if (value === NOT_FOUND) {
+      // @ts-ignore
+      value = func.apply(null, arguments);
+
+      if (resultEqualityCheck) {
+        var entries = cache.getEntries();
+        var matchingEntry = entries.find(function (entry) {
+          return resultEqualityCheck(entry.value, value);
+        });
+
+        if (matchingEntry) {
+          return matchingEntry.value;
+        }
+      }
+
+      cache.put(arguments, value);
+    }
+
+    return value;
+  }
+
+  memoized.clearCache = function () {
+    return cache.clear();
+  };
+
+  return memoized;
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/reselect/es/index.js b/ddb_main/node_modules/reselect/es/index.js
new file mode 100644
index 0000000..2c27bd1
--- /dev/null
+++ b/ddb_main/node_modules/reselect/es/index.js
@@ -0,0 +1,130 @@
+import { defaultMemoize, defaultEqualityCheck } from './defaultMemoize';
+export { defaultMemoize, defaultEqualityCheck };
+
+function getDependencies(funcs) {
+  var dependencies = Array.isArray(funcs[0]) ? funcs[0] : funcs;
+
+  if (!dependencies.every(function (dep) {
+    return typeof dep === 'function';
+  })) {
+    var dependencyTypes = dependencies.map(function (dep) {
+      return typeof dep === 'function' ? "function " + (dep.name || 'unnamed') + "()" : typeof dep;
+    }).join(', ');
+    throw new Error("createSelector expects all input-selectors to be functions, but received the following types: [" + dependencyTypes + "]");
+  }
+
+  return dependencies;
+}
+
+export function createSelectorCreator(memoize) {
+  for (var _len = arguments.length, memoizeOptionsFromArgs = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    memoizeOptionsFromArgs[_key - 1] = arguments[_key];
+  }
+
+  // (memoize: MemoizeFunction, ...memoizeOptions: MemoizerOptions) {
+  var createSelector = function createSelector() {
+    for (var _len2 = arguments.length, funcs = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+      funcs[_key2] = arguments[_key2];
+    }
+
+    var _recomputations = 0;
+
+    var _lastResult; // Due to the intricacies of rest params, we can't do an optional arg after `...funcs`.
+    // So, start by declaring the default value here.
+    // (And yes, the words 'memoize' and 'options' appear too many times in this next sequence.)
+
+
+    var directlyPassedOptions = {
+      memoizeOptions: undefined
+    }; // Normally, the result func or "output selector" is the last arg
+
+    var resultFunc = funcs.pop(); // If the result func is actually an _object_, assume it's our options object
+
+    if (typeof resultFunc === 'object') {
+      directlyPassedOptions = resultFunc; // and pop the real result func off
+
+      resultFunc = funcs.pop();
+    }
+
+    if (typeof resultFunc !== 'function') {
+      throw new Error("createSelector expects an output function after the inputs, but received: [" + typeof resultFunc + "]");
+    } // Determine which set of options we're using. Prefer options passed directly,
+    // but fall back to options given to createSelectorCreator.
+
+
+    var _directlyPassedOption = directlyPassedOptions,
+        _directlyPassedOption2 = _directlyPassedOption.memoizeOptions,
+        memoizeOptions = _directlyPassedOption2 === void 0 ? memoizeOptionsFromArgs : _directlyPassedOption2; // Simplifying assumption: it's unlikely that the first options arg of the provided memoizer
+    // is an array. In most libs I've looked at, it's an equality function or options object.
+    // Based on that, if `memoizeOptions` _is_ an array, we assume it's a full
+    // user-provided array of options. Otherwise, it must be just the _first_ arg, and so
+    // we wrap it in an array so we can apply it.
+
+    var finalMemoizeOptions = Array.isArray(memoizeOptions) ? memoizeOptions : [memoizeOptions];
+    var dependencies = getDependencies(funcs);
+    var memoizedResultFunc = memoize.apply(void 0, [function () {
+      _recomputations++; // apply arguments instead of spreading for performance.
+
+      return resultFunc.apply(null, arguments);
+    }].concat(finalMemoizeOptions)); // If a selector is called with the exact same arguments we don't need to traverse our dependencies again.
+
+    var selector = memoize(function () {
+      var params = [];
+      var length = dependencies.length;
+
+      for (var i = 0; i < length; i++) {
+        // apply arguments instead of spreading and mutate a local list of params for performance.
+        // @ts-ignore
+        params.push(dependencies[i].apply(null, arguments));
+      } // apply arguments instead of spreading for performance.
+
+
+      _lastResult = memoizedResultFunc.apply(null, params);
+      return _lastResult;
+    });
+    Object.assign(selector, {
+      resultFunc: resultFunc,
+      memoizedResultFunc: memoizedResultFunc,
+      dependencies: dependencies,
+      lastResult: function lastResult() {
+        return _lastResult;
+      },
+      recomputations: function recomputations() {
+        return _recomputations;
+      },
+      resetRecomputations: function resetRecomputations() {
+        return _recomputations = 0;
+      }
+    });
+    return selector;
+  }; // @ts-ignore
+
+
+  return createSelector;
+}
+export var createSelector = /* #__PURE__ */createSelectorCreator(defaultMemoize);
+// Manual definition of state and output arguments
+export var createStructuredSelector = function createStructuredSelector(selectors, selectorCreator) {
+  if (selectorCreator === void 0) {
+    selectorCreator = createSelector;
+  }
+
+  if (typeof selectors !== 'object') {
+    throw new Error('createStructuredSelector expects first argument to be an object ' + ("where each property is a selector, instead received a " + typeof selectors));
+  }
+
+  var objectKeys = Object.keys(selectors);
+  return selectorCreator( // @ts-ignore
+  objectKeys.map(function (key) {
+    return selectors[key];
+  }), function () {
+    for (var _len3 = arguments.length, values = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+      values[_key3] = arguments[_key3];
+    }
+
+    return values.reduce(function (composition, value, index) {
+      composition[objectKeys[index]] = value;
+      return composition;
+    }, {});
+  });
+};
\ No newline at end of file
diff --git a/ddb_main/node_modules/resize-observer-polyfill/dist/ResizeObserver.es.js b/ddb_main/node_modules/resize-observer-polyfill/dist/ResizeObserver.es.js
new file mode 100644
index 0000000..1fe19b6
--- /dev/null
+++ b/ddb_main/node_modules/resize-observer-polyfill/dist/ResizeObserver.es.js
@@ -0,0 +1,928 @@
+/**
+ * A collection of shims that provide minimal functionality of the ES6 collections.
+ *
+ * These implementations are not meant to be used outside of the ResizeObserver
+ * modules as they cover only a limited range of use cases.
+ */
+/* eslint-disable require-jsdoc, valid-jsdoc */
+var MapShim = (function () {
+    if (typeof Map !== 'undefined') {
+        return Map;
+    }
+    /**
+     * Returns index in provided array that matches the specified key.
+     *
+     * @param {Array<Array>} arr
+     * @param {*} key
+     * @returns {number}
+     */
+    function getIndex(arr, key) {
+        var result = -1;
+        arr.some(function (entry, index) {
+            if (entry[0] === key) {
+                result = index;
+                return true;
+            }
+            return false;
+        });
+        return result;
+    }
+    return /** @class */ (function () {
+        function class_1() {
+            this.__entries__ = [];
+        }
+        Object.defineProperty(class_1.prototype, "size", {
+            /**
+             * @returns {boolean}
+             */
+            get: function () {
+                return this.__entries__.length;
+            },
+            enumerable: true,
+            configurable: true
+        });
+        /**
+         * @param {*} key
+         * @returns {*}
+         */
+        class_1.prototype.get = function (key) {
+            var index = getIndex(this.__entries__, key);
+            var entry = this.__entries__[index];
+            return entry && entry[1];
+        };
+        /**
+         * @param {*} key
+         * @param {*} value
+         * @returns {void}
+         */
+        class_1.prototype.set = function (key, value) {
+            var index = getIndex(this.__entries__, key);
+            if (~index) {
+                this.__entries__[index][1] = value;
+            }
+            else {
+                this.__entries__.push([key, value]);
+            }
+        };
+        /**
+         * @param {*} key
+         * @returns {void}
+         */
+        class_1.prototype.delete = function (key) {
+            var entries = this.__entries__;
+            var index = getIndex(entries, key);
+            if (~index) {
+                entries.splice(index, 1);
+            }
+        };
+        /**
+         * @param {*} key
+         * @returns {void}
+         */
+        class_1.prototype.has = function (key) {
+            return !!~getIndex(this.__entries__, key);
+        };
+        /**
+         * @returns {void}
+         */
+        class_1.prototype.clear = function () {
+            this.__entries__.splice(0);
+        };
+        /**
+         * @param {Function} callback
+         * @param {*} [ctx=null]
+         * @returns {void}
+         */
+        class_1.prototype.forEach = function (callback, ctx) {
+            if (ctx === void 0) { ctx = null; }
+            for (var _i = 0, _a = this.__entries__; _i < _a.length; _i++) {
+                var entry = _a[_i];
+                callback.call(ctx, entry[1], entry[0]);
+            }
+        };
+        return class_1;
+    }());
+})();
+
+/**
+ * Detects whether window and document objects are available in current environment.
+ */
+var isBrowser = typeof window !== 'undefined' && typeof document !== 'undefined' && window.document === document;
+
+// Returns global object of a current environment.
+var global$1 = (function () {
+    if (typeof global !== 'undefined' && global.Math === Math) {
+        return global;
+    }
+    if (typeof self !== 'undefined' && self.Math === Math) {
+        return self;
+    }
+    if (typeof window !== 'undefined' && window.Math === Math) {
+        return window;
+    }
+    // eslint-disable-next-line no-new-func
+    return Function('return this')();
+})();
+
+/**
+ * A shim for the requestAnimationFrame which falls back to the setTimeout if
+ * first one is not supported.
+ *
+ * @returns {number} Requests' identifier.
+ */
+var requestAnimationFrame$1 = (function () {
+    if (typeof requestAnimationFrame === 'function') {
+        // It's required to use a bounded function because IE sometimes throws
+        // an "Invalid calling object" error if rAF is invoked without the global
+        // object on the left hand side.
+        return requestAnimationFrame.bind(global$1);
+    }
+    return function (callback) { return setTimeout(function () { return callback(Date.now()); }, 1000 / 60); };
+})();
+
+// Defines minimum timeout before adding a trailing call.
+var trailingTimeout = 2;
+/**
+ * Creates a wrapper function which ensures that provided callback will be
+ * invoked only once during the specified delay period.
+ *
+ * @param {Function} callback - Function to be invoked after the delay period.
+ * @param {number} delay - Delay after which to invoke callback.
+ * @returns {Function}
+ */
+function throttle (callback, delay) {
+    var leadingCall = false, trailingCall = false, lastCallTime = 0;
+    /**
+     * Invokes the original callback function and schedules new invocation if
+     * the "proxy" was called during current request.
+     *
+     * @returns {void}
+     */
+    function resolvePending() {
+        if (leadingCall) {
+            leadingCall = false;
+            callback();
+        }
+        if (trailingCall) {
+            proxy();
+        }
+    }
+    /**
+     * Callback invoked after the specified delay. It will further postpone
+     * invocation of the original function delegating it to the
+     * requestAnimationFrame.
+     *
+     * @returns {void}
+     */
+    function timeoutCallback() {
+        requestAnimationFrame$1(resolvePending);
+    }
+    /**
+     * Schedules invocation of the original function.
+     *
+     * @returns {void}
+     */
+    function proxy() {
+        var timeStamp = Date.now();
+        if (leadingCall) {
+            // Reject immediately following calls.
+            if (timeStamp - lastCallTime < trailingTimeout) {
+                return;
+            }
+            // Schedule new call to be in invoked when the pending one is resolved.
+            // This is important for "transitions" which never actually start
+            // immediately so there is a chance that we might miss one if change
+            // happens amids the pending invocation.
+            trailingCall = true;
+        }
+        else {
+            leadingCall = true;
+            trailingCall = false;
+            setTimeout(timeoutCallback, delay);
+        }
+        lastCallTime = timeStamp;
+    }
+    return proxy;
+}
+
+// Minimum delay before invoking the update of observers.
+var REFRESH_DELAY = 20;
+// A list of substrings of CSS properties used to find transition events that
+// might affect dimensions of observed elements.
+var transitionKeys = ['top', 'right', 'bottom', 'left', 'width', 'height', 'size', 'weight'];
+// Check if MutationObserver is available.
+var mutationObserverSupported = typeof MutationObserver !== 'undefined';
+/**
+ * Singleton controller class which handles updates of ResizeObserver instances.
+ */
+var ResizeObserverController = /** @class */ (function () {
+    /**
+     * Creates a new instance of ResizeObserverController.
+     *
+     * @private
+     */
+    function ResizeObserverController() {
+        /**
+         * Indicates whether DOM listeners have been added.
+         *
+         * @private {boolean}
+         */
+        this.connected_ = false;
+        /**
+         * Tells that controller has subscribed for Mutation Events.
+         *
+         * @private {boolean}
+         */
+        this.mutationEventsAdded_ = false;
+        /**
+         * Keeps reference to the instance of MutationObserver.
+         *
+         * @private {MutationObserver}
+         */
+        this.mutationsObserver_ = null;
+        /**
+         * A list of connected observers.
+         *
+         * @private {Array<ResizeObserverSPI>}
+         */
+        this.observers_ = [];
+        this.onTransitionEnd_ = this.onTransitionEnd_.bind(this);
+        this.refresh = throttle(this.refresh.bind(this), REFRESH_DELAY);
+    }
+    /**
+     * Adds observer to observers list.
+     *
+     * @param {ResizeObserverSPI} observer - Observer to be added.
+     * @returns {void}
+     */
+    ResizeObserverController.prototype.addObserver = function (observer) {
+        if (!~this.observers_.indexOf(observer)) {
+            this.observers_.push(observer);
+        }
+        // Add listeners if they haven't been added yet.
+        if (!this.connected_) {
+            this.connect_();
+        }
+    };
+    /**
+     * Removes observer from observers list.
+     *
+     * @param {ResizeObserverSPI} observer - Observer to be removed.
+     * @returns {void}
+     */
+    ResizeObserverController.prototype.removeObserver = function (observer) {
+        var observers = this.observers_;
+        var index = observers.indexOf(observer);
+        // Remove observer if it's present in registry.
+        if (~index) {
+            observers.splice(index, 1);
+        }
+        // Remove listeners if controller has no connected observers.
+        if (!observers.length && this.connected_) {
+            this.disconnect_();
+        }
+    };
+    /**
+     * Invokes the update of observers. It will continue running updates insofar
+     * it detects changes.
+     *
+     * @returns {void}
+     */
+    ResizeObserverController.prototype.refresh = function () {
+        var changesDetected = this.updateObservers_();
+        // Continue running updates if changes have been detected as there might
+        // be future ones caused by CSS transitions.
+        if (changesDetected) {
+            this.refresh();
+        }
+    };
+    /**
+     * Updates every observer from observers list and notifies them of queued
+     * entries.
+     *
+     * @private
+     * @returns {boolean} Returns "true" if any observer has detected changes in
+     *      dimensions of it's elements.
+     */
+    ResizeObserverController.prototype.updateObservers_ = function () {
+        // Collect observers that have active observations.
+        var activeObservers = this.observers_.filter(function (observer) {
+            return observer.gatherActive(), observer.hasActive();
+        });
+        // Deliver notifications in a separate cycle in order to avoid any
+        // collisions between observers, e.g. when multiple instances of
+        // ResizeObserver are tracking the same element and the callback of one
+        // of them changes content dimensions of the observed target. Sometimes
+        // this may result in notifications being blocked for the rest of observers.
+        activeObservers.forEach(function (observer) { return observer.broadcastActive(); });
+        return activeObservers.length > 0;
+    };
+    /**
+     * Initializes DOM listeners.
+     *
+     * @private
+     * @returns {void}
+     */
+    ResizeObserverController.prototype.connect_ = function () {
+        // Do nothing if running in a non-browser environment or if listeners
+        // have been already added.
+        if (!isBrowser || this.connected_) {
+            return;
+        }
+        // Subscription to the "Transitionend" event is used as a workaround for
+        // delayed transitions. This way it's possible to capture at least the
+        // final state of an element.
+        document.addEventListener('transitionend', this.onTransitionEnd_);
+        window.addEventListener('resize', this.refresh);
+        if (mutationObserverSupported) {
+            this.mutationsObserver_ = new MutationObserver(this.refresh);
+            this.mutationsObserver_.observe(document, {
+                attributes: true,
+                childList: true,
+                characterData: true,
+                subtree: true
+            });
+        }
+        else {
+            document.addEventListener('DOMSubtreeModified', this.refresh);
+            this.mutationEventsAdded_ = true;
+        }
+        this.connected_ = true;
+    };
+    /**
+     * Removes DOM listeners.
+     *
+     * @private
+     * @returns {void}
+     */
+    ResizeObserverController.prototype.disconnect_ = function () {
+        // Do nothing if running in a non-browser environment or if listeners
+        // have been already removed.
+        if (!isBrowser || !this.connected_) {
+            return;
+        }
+        document.removeEventListener('transitionend', this.onTransitionEnd_);
+        window.removeEventListener('resize', this.refresh);
+        if (this.mutationsObserver_) {
+            this.mutationsObserver_.disconnect();
+        }
+        if (this.mutationEventsAdded_) {
+            document.removeEventListener('DOMSubtreeModified', this.refresh);
+        }
+        this.mutationsObserver_ = null;
+        this.mutationEventsAdded_ = false;
+        this.connected_ = false;
+    };
+    /**
+     * "Transitionend" event handler.
+     *
+     * @private
+     * @param {TransitionEvent} event
+     * @returns {void}
+     */
+    ResizeObserverController.prototype.onTransitionEnd_ = function (_a) {
+        var _b = _a.propertyName, propertyName = _b === void 0 ? '' : _b;
+        // Detect whether transition may affect dimensions of an element.
+        var isReflowProperty = transitionKeys.some(function (key) {
+            return !!~propertyName.indexOf(key);
+        });
+        if (isReflowProperty) {
+            this.refresh();
+        }
+    };
+    /**
+     * Returns instance of the ResizeObserverController.
+     *
+     * @returns {ResizeObserverController}
+     */
+    ResizeObserverController.getInstance = function () {
+        if (!this.instance_) {
+            this.instance_ = new ResizeObserverController();
+        }
+        return this.instance_;
+    };
+    /**
+     * Holds reference to the controller's instance.
+     *
+     * @private {ResizeObserverController}
+     */
+    ResizeObserverController.instance_ = null;
+    return ResizeObserverController;
+}());
+
+/**
+ * Defines non-writable/enumerable properties of the provided target object.
+ *
+ * @param {Object} target - Object for which to define properties.
+ * @param {Object} props - Properties to be defined.
+ * @returns {Object} Target object.
+ */
+var defineConfigurable = (function (target, props) {
+    for (var _i = 0, _a = Object.keys(props); _i < _a.length; _i++) {
+        var key = _a[_i];
+        Object.defineProperty(target, key, {
+            value: props[key],
+            enumerable: false,
+            writable: false,
+            configurable: true
+        });
+    }
+    return target;
+});
+
+/**
+ * Returns the global object associated with provided element.
+ *
+ * @param {Object} target
+ * @returns {Object}
+ */
+var getWindowOf = (function (target) {
+    // Assume that the element is an instance of Node, which means that it
+    // has the "ownerDocument" property from which we can retrieve a
+    // corresponding global object.
+    var ownerGlobal = target && target.ownerDocument && target.ownerDocument.defaultView;
+    // Return the local global object if it's not possible extract one from
+    // provided element.
+    return ownerGlobal || global$1;
+});
+
+// Placeholder of an empty content rectangle.
+var emptyRect = createRectInit(0, 0, 0, 0);
+/**
+ * Converts provided string to a number.
+ *
+ * @param {number|string} value
+ * @returns {number}
+ */
+function toFloat(value) {
+    return parseFloat(value) || 0;
+}
+/**
+ * Extracts borders size from provided styles.
+ *
+ * @param {CSSStyleDeclaration} styles
+ * @param {...string} positions - Borders positions (top, right, ...)
+ * @returns {number}
+ */
+function getBordersSize(styles) {
+    var positions = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        positions[_i - 1] = arguments[_i];
+    }
+    return positions.reduce(function (size, position) {
+        var value = styles['border-' + position + '-width'];
+        return size + toFloat(value);
+    }, 0);
+}
+/**
+ * Extracts paddings sizes from provided styles.
+ *
+ * @param {CSSStyleDeclaration} styles
+ * @returns {Object} Paddings box.
+ */
+function getPaddings(styles) {
+    var positions = ['top', 'right', 'bottom', 'left'];
+    var paddings = {};
+    for (var _i = 0, positions_1 = positions; _i < positions_1.length; _i++) {
+        var position = positions_1[_i];
+        var value = styles['padding-' + position];
+        paddings[position] = toFloat(value);
+    }
+    return paddings;
+}
+/**
+ * Calculates content rectangle of provided SVG element.
+ *
+ * @param {SVGGraphicsElement} target - Element content rectangle of which needs
+ *      to be calculated.
+ * @returns {DOMRectInit}
+ */
+function getSVGContentRect(target) {
+    var bbox = target.getBBox();
+    return createRectInit(0, 0, bbox.width, bbox.height);
+}
+/**
+ * Calculates content rectangle of provided HTMLElement.
+ *
+ * @param {HTMLElement} target - Element for which to calculate the content rectangle.
+ * @returns {DOMRectInit}
+ */
+function getHTMLElementContentRect(target) {
+    // Client width & height properties can't be
+    // used exclusively as they provide rounded values.
+    var clientWidth = target.clientWidth, clientHeight = target.clientHeight;
+    // By this condition we can catch all non-replaced inline, hidden and
+    // detached elements. Though elements with width & height properties less
+    // than 0.5 will be discarded as well.
+    //
+    // Without it we would need to implement separate methods for each of
+    // those cases and it's not possible to perform a precise and performance
+    // effective test for hidden elements. E.g. even jQuery's ':visible' filter
+    // gives wrong results for elements with width & height less than 0.5.
+    if (!clientWidth && !clientHeight) {
+        return emptyRect;
+    }
+    var styles = getWindowOf(target).getComputedStyle(target);
+    var paddings = getPaddings(styles);
+    var horizPad = paddings.left + paddings.right;
+    var vertPad = paddings.top + paddings.bottom;
+    // Computed styles of width & height are being used because they are the
+    // only dimensions available to JS that contain non-rounded values. It could
+    // be possible to utilize the getBoundingClientRect if only it's data wasn't
+    // affected by CSS transformations let alone paddings, borders and scroll bars.
+    var width = toFloat(styles.width), height = toFloat(styles.height);
+    // Width & height include paddings and borders when the 'border-box' box
+    // model is applied (except for IE).
+    if (styles.boxSizing === 'border-box') {
+        // Following conditions are required to handle Internet Explorer which
+        // doesn't include paddings and borders to computed CSS dimensions.
+        //
+        // We can say that if CSS dimensions + paddings are equal to the "client"
+        // properties then it's either IE, and thus we don't need to subtract
+        // anything, or an element merely doesn't have paddings/borders styles.
+        if (Math.round(width + horizPad) !== clientWidth) {
+            width -= getBordersSize(styles, 'left', 'right') + horizPad;
+        }
+        if (Math.round(height + vertPad) !== clientHeight) {
+            height -= getBordersSize(styles, 'top', 'bottom') + vertPad;
+        }
+    }
+    // Following steps can't be applied to the document's root element as its
+    // client[Width/Height] properties represent viewport area of the window.
+    // Besides, it's as well not necessary as the <html> itself neither has
+    // rendered scroll bars nor it can be clipped.
+    if (!isDocumentElement(target)) {
+        // In some browsers (only in Firefox, actually) CSS width & height
+        // include scroll bars size which can be removed at this step as scroll
+        // bars are the only difference between rounded dimensions + paddings
+        // and "client" properties, though that is not always true in Chrome.
+        var vertScrollbar = Math.round(width + horizPad) - clientWidth;
+        var horizScrollbar = Math.round(height + vertPad) - clientHeight;
+        // Chrome has a rather weird rounding of "client" properties.
+        // E.g. for an element with content width of 314.2px it sometimes gives
+        // the client width of 315px and for the width of 314.7px it may give
+        // 314px. And it doesn't happen all the time. So just ignore this delta
+        // as a non-relevant.
+        if (Math.abs(vertScrollbar) !== 1) {
+            width -= vertScrollbar;
+        }
+        if (Math.abs(horizScrollbar) !== 1) {
+            height -= horizScrollbar;
+        }
+    }
+    return createRectInit(paddings.left, paddings.top, width, height);
+}
+/**
+ * Checks whether provided element is an instance of the SVGGraphicsElement.
+ *
+ * @param {Element} target - Element to be checked.
+ * @returns {boolean}
+ */
+var isSVGGraphicsElement = (function () {
+    // Some browsers, namely IE and Edge, don't have the SVGGraphicsElement
+    // interface.
+    if (typeof SVGGraphicsElement !== 'undefined') {
+        return function (target) { return target instanceof getWindowOf(target).SVGGraphicsElement; };
+    }
+    // If it's so, then check that element is at least an instance of the
+    // SVGElement and that it has the "getBBox" method.
+    // eslint-disable-next-line no-extra-parens
+    return function (target) { return (target instanceof getWindowOf(target).SVGElement &&
+        typeof target.getBBox === 'function'); };
+})();
+/**
+ * Checks whether provided element is a document element (<html>).
+ *
+ * @param {Element} target - Element to be checked.
+ * @returns {boolean}
+ */
+function isDocumentElement(target) {
+    return target === getWindowOf(target).document.documentElement;
+}
+/**
+ * Calculates an appropriate content rectangle for provided html or svg element.
+ *
+ * @param {Element} target - Element content rectangle of which needs to be calculated.
+ * @returns {DOMRectInit}
+ */
+function getContentRect(target) {
+    if (!isBrowser) {
+        return emptyRect;
+    }
+    if (isSVGGraphicsElement(target)) {
+        return getSVGContentRect(target);
+    }
+    return getHTMLElementContentRect(target);
+}
+/**
+ * Creates rectangle with an interface of the DOMRectReadOnly.
+ * Spec: https://drafts.fxtf.org/geometry/#domrectreadonly
+ *
+ * @param {DOMRectInit} rectInit - Object with rectangle's x/y coordinates and dimensions.
+ * @returns {DOMRectReadOnly}
+ */
+function createReadOnlyRect(_a) {
+    var x = _a.x, y = _a.y, width = _a.width, height = _a.height;
+    // If DOMRectReadOnly is available use it as a prototype for the rectangle.
+    var Constr = typeof DOMRectReadOnly !== 'undefined' ? DOMRectReadOnly : Object;
+    var rect = Object.create(Constr.prototype);
+    // Rectangle's properties are not writable and non-enumerable.
+    defineConfigurable(rect, {
+        x: x, y: y, width: width, height: height,
+        top: y,
+        right: x + width,
+        bottom: height + y,
+        left: x
+    });
+    return rect;
+}
+/**
+ * Creates DOMRectInit object based on the provided dimensions and the x/y coordinates.
+ * Spec: https://drafts.fxtf.org/geometry/#dictdef-domrectinit
+ *
+ * @param {number} x - X coordinate.
+ * @param {number} y - Y coordinate.
+ * @param {number} width - Rectangle's width.
+ * @param {number} height - Rectangle's height.
+ * @returns {DOMRectInit}
+ */
+function createRectInit(x, y, width, height) {
+    return { x: x, y: y, width: width, height: height };
+}
+
+/**
+ * Class that is responsible for computations of the content rectangle of
+ * provided DOM element and for keeping track of it's changes.
+ */
+var ResizeObservation = /** @class */ (function () {
+    /**
+     * Creates an instance of ResizeObservation.
+     *
+     * @param {Element} target - Element to be observed.
+     */
+    function ResizeObservation(target) {
+        /**
+         * Broadcasted width of content rectangle.
+         *
+         * @type {number}
+         */
+        this.broadcastWidth = 0;
+        /**
+         * Broadcasted height of content rectangle.
+         *
+         * @type {number}
+         */
+        this.broadcastHeight = 0;
+        /**
+         * Reference to the last observed content rectangle.
+         *
+         * @private {DOMRectInit}
+         */
+        this.contentRect_ = createRectInit(0, 0, 0, 0);
+        this.target = target;
+    }
+    /**
+     * Updates content rectangle and tells whether it's width or height properties
+     * have changed since the last broadcast.
+     *
+     * @returns {boolean}
+     */
+    ResizeObservation.prototype.isActive = function () {
+        var rect = getContentRect(this.target);
+        this.contentRect_ = rect;
+        return (rect.width !== this.broadcastWidth ||
+            rect.height !== this.broadcastHeight);
+    };
+    /**
+     * Updates 'broadcastWidth' and 'broadcastHeight' properties with a data
+     * from the corresponding properties of the last observed content rectangle.
+     *
+     * @returns {DOMRectInit} Last observed content rectangle.
+     */
+    ResizeObservation.prototype.broadcastRect = function () {
+        var rect = this.contentRect_;
+        this.broadcastWidth = rect.width;
+        this.broadcastHeight = rect.height;
+        return rect;
+    };
+    return ResizeObservation;
+}());
+
+var ResizeObserverEntry = /** @class */ (function () {
+    /**
+     * Creates an instance of ResizeObserverEntry.
+     *
+     * @param {Element} target - Element that is being observed.
+     * @param {DOMRectInit} rectInit - Data of the element's content rectangle.
+     */
+    function ResizeObserverEntry(target, rectInit) {
+        var contentRect = createReadOnlyRect(rectInit);
+        // According to the specification following properties are not writable
+        // and are also not enumerable in the native implementation.
+        //
+        // Property accessors are not being used as they'd require to define a
+        // private WeakMap storage which may cause memory leaks in browsers that
+        // don't support this type of collections.
+        defineConfigurable(this, { target: target, contentRect: contentRect });
+    }
+    return ResizeObserverEntry;
+}());
+
+var ResizeObserverSPI = /** @class */ (function () {
+    /**
+     * Creates a new instance of ResizeObserver.
+     *
+     * @param {ResizeObserverCallback} callback - Callback function that is invoked
+     *      when one of the observed elements changes it's content dimensions.
+     * @param {ResizeObserverController} controller - Controller instance which
+     *      is responsible for the updates of observer.
+     * @param {ResizeObserver} callbackCtx - Reference to the public
+     *      ResizeObserver instance which will be passed to callback function.
+     */
+    function ResizeObserverSPI(callback, controller, callbackCtx) {
+        /**
+         * Collection of resize observations that have detected changes in dimensions
+         * of elements.
+         *
+         * @private {Array<ResizeObservation>}
+         */
+        this.activeObservations_ = [];
+        /**
+         * Registry of the ResizeObservation instances.
+         *
+         * @private {Map<Element, ResizeObservation>}
+         */
+        this.observations_ = new MapShim();
+        if (typeof callback !== 'function') {
+            throw new TypeError('The callback provided as parameter 1 is not a function.');
+        }
+        this.callback_ = callback;
+        this.controller_ = controller;
+        this.callbackCtx_ = callbackCtx;
+    }
+    /**
+     * Starts observing provided element.
+     *
+     * @param {Element} target - Element to be observed.
+     * @returns {void}
+     */
+    ResizeObserverSPI.prototype.observe = function (target) {
+        if (!arguments.length) {
+            throw new TypeError('1 argument required, but only 0 present.');
+        }
+        // Do nothing if current environment doesn't have the Element interface.
+        if (typeof Element === 'undefined' || !(Element instanceof Object)) {
+            return;
+        }
+        if (!(target instanceof getWindowOf(target).Element)) {
+            throw new TypeError('parameter 1 is not of type "Element".');
+        }
+        var observations = this.observations_;
+        // Do nothing if element is already being observed.
+        if (observations.has(target)) {
+            return;
+        }
+        observations.set(target, new ResizeObservation(target));
+        this.controller_.addObserver(this);
+        // Force the update of observations.
+        this.controller_.refresh();
+    };
+    /**
+     * Stops observing provided element.
+     *
+     * @param {Element} target - Element to stop observing.
+     * @returns {void}
+     */
+    ResizeObserverSPI.prototype.unobserve = function (target) {
+        if (!arguments.length) {
+            throw new TypeError('1 argument required, but only 0 present.');
+        }
+        // Do nothing if current environment doesn't have the Element interface.
+        if (typeof Element === 'undefined' || !(Element instanceof Object)) {
+            return;
+        }
+        if (!(target instanceof getWindowOf(target).Element)) {
+            throw new TypeError('parameter 1 is not of type "Element".');
+        }
+        var observations = this.observations_;
+        // Do nothing if element is not being observed.
+        if (!observations.has(target)) {
+            return;
+        }
+        observations.delete(target);
+        if (!observations.size) {
+            this.controller_.removeObserver(this);
+        }
+    };
+    /**
+     * Stops observing all elements.
+     *
+     * @returns {void}
+     */
+    ResizeObserverSPI.prototype.disconnect = function () {
+        this.clearActive();
+        this.observations_.clear();
+        this.controller_.removeObserver(this);
+    };
+    /**
+     * Collects observation instances the associated element of which has changed
+     * it's content rectangle.
+     *
+     * @returns {void}
+     */
+    ResizeObserverSPI.prototype.gatherActive = function () {
+        var _this = this;
+        this.clearActive();
+        this.observations_.forEach(function (observation) {
+            if (observation.isActive()) {
+                _this.activeObservations_.push(observation);
+            }
+        });
+    };
+    /**
+     * Invokes initial callback function with a list of ResizeObserverEntry
+     * instances collected from active resize observations.
+     *
+     * @returns {void}
+     */
+    ResizeObserverSPI.prototype.broadcastActive = function () {
+        // Do nothing if observer doesn't have active observations.
+        if (!this.hasActive()) {
+            return;
+        }
+        var ctx = this.callbackCtx_;
+        // Create ResizeObserverEntry instance for every active observation.
+        var entries = this.activeObservations_.map(function (observation) {
+            return new ResizeObserverEntry(observation.target, observation.broadcastRect());
+        });
+        this.callback_.call(ctx, entries, ctx);
+        this.clearActive();
+    };
+    /**
+     * Clears the collection of active observations.
+     *
+     * @returns {void}
+     */
+    ResizeObserverSPI.prototype.clearActive = function () {
+        this.activeObservations_.splice(0);
+    };
+    /**
+     * Tells whether observer has active observations.
+     *
+     * @returns {boolean}
+     */
+    ResizeObserverSPI.prototype.hasActive = function () {
+        return this.activeObservations_.length > 0;
+    };
+    return ResizeObserverSPI;
+}());
+
+// Registry of internal observers. If WeakMap is not available use current shim
+// for the Map collection as it has all required methods and because WeakMap
+// can't be fully polyfilled anyway.
+var observers = typeof WeakMap !== 'undefined' ? new WeakMap() : new MapShim();
+/**
+ * ResizeObserver API. Encapsulates the ResizeObserver SPI implementation
+ * exposing only those methods and properties that are defined in the spec.
+ */
+var ResizeObserver = /** @class */ (function () {
+    /**
+     * Creates a new instance of ResizeObserver.
+     *
+     * @param {ResizeObserverCallback} callback - Callback that is invoked when
+     *      dimensions of the observed elements change.
+     */
+    function ResizeObserver(callback) {
+        if (!(this instanceof ResizeObserver)) {
+            throw new TypeError('Cannot call a class as a function.');
+        }
+        if (!arguments.length) {
+            throw new TypeError('1 argument required, but only 0 present.');
+        }
+        var controller = ResizeObserverController.getInstance();
+        var observer = new ResizeObserverSPI(callback, controller, this);
+        observers.set(this, observer);
+    }
+    return ResizeObserver;
+}());
+// Expose public methods of ResizeObserver.
+[
+    'observe',
+    'unobserve',
+    'disconnect'
+].forEach(function (method) {
+    ResizeObserver.prototype[method] = function () {
+        var _a;
+        return (_a = observers.get(this))[method].apply(_a, arguments);
+    };
+});
+
+var index = (function () {
+    // Export existing implementation if available.
+    if (typeof global$1.ResizeObserver !== 'undefined') {
+        return global$1.ResizeObserver;
+    }
+    return ResizeObserver;
+})();
+
+export default index;
diff --git a/ddb_main/node_modules/run-exclusive/src/lib/runExclusive.ts b/ddb_main/node_modules/run-exclusive/src/lib/runExclusive.ts
new file mode 100644
index 0000000..36fcd5f
--- /dev/null
+++ b/ddb_main/node_modules/run-exclusive/src/lib/runExclusive.ts
@@ -0,0 +1,449 @@
+// @denoify-line-ignore
+import { Polyfill as WeakMap } from "minimal-polyfills/WeakMap";
+
+class ExecQueue {
+
+    public readonly queuedCalls: Function[]=[];
+
+    public isRunning: boolean= false;
+
+    //TODO: move where it is used.
+    public cancelAllQueuedCalls(): number {
+
+        let n: number;
+
+        this.queuedCalls.splice(0, n=this.queuedCalls.length);
+
+        return n;
+
+    }
+
+    public prComplete: Promise<void>= Promise.resolve();
+
+
+}
+
+
+const globalContext: Object = {};
+
+const clusters = new WeakMap<Object, WeakMap<GroupRef,ExecQueue>>();
+
+//console.log("Map version");
+//export const clusters = new Map<Object, Map<GroupRef,ExecQueue>>();
+
+
+function getOrCreateExecQueue(
+    context: Object, 
+    groupRef: GroupRef
+): ExecQueue {
+
+    let execQueueByGroup = clusters.get(context);
+
+    if (!execQueueByGroup) {
+        execQueueByGroup = new WeakMap();
+        clusters.set(context, execQueueByGroup);
+    }
+
+    let execQueue= execQueueByGroup.get(groupRef);
+
+    if (!execQueue){
+        execQueue= new ExecQueue();
+        execQueueByGroup.set(groupRef, execQueue);
+    }
+
+    return execQueue;
+
+}
+
+export type GroupRef = never[];
+
+export function createGroupRef(): GroupRef {
+    return new Array<never>(0);
+}
+
+/**
+ * Built a run-exclusive function from a function that return a promise.
+ */
+export function build<T extends (...input: any[]) => Promise<any>>(fun: T): T;
+/**
+ * Built a run-exclusive function from a function that return a promise.
+ * 
+ * The group ref parameter is used when in need that two or more different functions do nor run simultaneously.
+ * Group refs are created by calling createGroupRef().
+ */
+export function build<T extends (...input: any[]) => Promise<any>>(groupRef: GroupRef, fun: T): T;
+export function build(...inputs: any[]): any {
+
+    switch (inputs.length) {
+        case 1: return buildFnPromise(true, createGroupRef(), inputs[0]);
+        case 2: return buildFnPromise(true, inputs[0], inputs[1]);
+    }
+
+}
+
+
+/** Same as build but to restrict the exclusion to a class instance object. */
+export function buildMethod<T extends (...input: any[]) => Promise<any>>(fun: T): T;
+export function buildMethod<T extends (...input: any[]) => Promise<any>>(groupRef: GroupRef, fun: T): T;
+export function buildMethod(...inputs: any[]): any {
+
+    switch (inputs.length) {
+        case 1: return buildFnPromise(false, createGroupRef(), inputs[0]);
+        case 2: return buildFnPromise(false, inputs[0], inputs[1]);
+    }
+
+}
+
+/** 
+ * 
+ * Get the number of queued call of a run-exclusive function. 
+ * Note that if you call a runExclusive function and call this 
+ * directly after it will return 0 as there is one function call
+ * execution ongoing but 0 queued.
+ * 
+ * The classInstanceObject parameter is to provide only for the run-exclusive
+ * function created with 'buildMethod[Cb].
+ *  
+ * */
+export function getQueuedCallCount(
+    runExclusiveFunction: Function,
+    classInstanceObject?: Object
+): number {
+
+    const execQueue= getExecQueueByFunctionAndContext(runExclusiveFunction, classInstanceObject);
+
+    return execQueue?execQueue.queuedCalls.length:0;
+
+}
+
+/**
+ * 
+ * Cancel all queued calls of a run-exclusive function.
+ * Note that the current running call will not be cancelled.
+ * 
+ * The classInstanceObject parameter is to provide only for the run-exclusive
+ * function created with 'buildMethod[Cb].
+ * 
+ */
+export function cancelAllQueuedCalls(
+    runExclusiveFunction: Function,
+    classInstanceObject?: Object
+): number {
+
+    const execQueue= getExecQueueByFunctionAndContext(runExclusiveFunction, classInstanceObject);
+
+    return execQueue?execQueue.cancelAllQueuedCalls():0;
+
+}
+
+/**
+ * Tell if a run-exclusive function has an instance of it's call currently being
+ * performed.
+ * 
+ * The classInstanceObject parameter is to provide only for the run-exclusive
+ * function created with 'buildMethod[Cb].
+ */
+export function isRunning(
+    runExclusiveFunction: Function,
+    classInstanceObject?: Object
+): boolean {
+
+    const execQueue= getExecQueueByFunctionAndContext(runExclusiveFunction, classInstanceObject);
+
+    return execQueue?execQueue.isRunning:false;
+
+}
+
+/**
+ * Return a promise that resolve when all the current queued call of a runExclusive functions
+ * have completed.
+ * 
+ * The classInstanceObject parameter is to provide only for the run-exclusive
+ * function created with 'buildMethod[Cb].
+ */
+export function getPrComplete(
+    runExclusiveFunction: Function,
+    classInstanceObject?: Object
+): Promise<void>{
+
+    const execQueue= getExecQueueByFunctionAndContext(runExclusiveFunction, classInstanceObject);
+
+    return execQueue?execQueue.prComplete:Promise.resolve();
+
+}
+
+const groupByRunExclusiveFunction= new WeakMap<Function, GroupRef>();
+
+function getExecQueueByFunctionAndContext(
+    runExclusiveFunction: Function,
+    context = globalContext
+): ExecQueue | undefined {
+
+    const groupRef= groupByRunExclusiveFunction.get(runExclusiveFunction);
+
+    if( !groupRef ){
+        throw Error("Not a run exclusiveFunction");
+    }
+
+    const execQueueByGroup= clusters.get(context);
+
+    if( !execQueueByGroup ){
+        return undefined;
+    }
+
+    return execQueueByGroup.get(groupRef)!;
+
+}
+
+
+function buildFnPromise<T extends (...inputs: any[]) => Promise<any>>(
+    isGlobal: boolean,
+    groupRef: GroupRef,
+    fun: T
+): T {
+
+    let execQueue: ExecQueue;
+
+    const runExclusiveFunction = (function (this: any, ...inputs) {
+
+        if (!isGlobal) {
+
+            if (!(this instanceof Object)) {
+                throw new Error("Run exclusive, <this> should be an object");
+            }
+
+            execQueue = getOrCreateExecQueue(this, groupRef);
+
+        }
+
+        return new Promise<any>((resolve, reject) => {
+
+            let onPrCompleteResolve: () => void;
+
+            execQueue.prComplete = new Promise(resolve =>
+                onPrCompleteResolve = () => resolve()
+            );
+
+            const onComplete = (result: { data: any } | { reason: any }) => {
+
+                onPrCompleteResolve();
+
+                execQueue.isRunning = false;
+
+                if (execQueue.queuedCalls.length) {
+                    execQueue.queuedCalls.shift()!();
+                }
+
+                if ("data" in result) {
+                    resolve(result.data);
+                } else {
+                    reject(result.reason);
+                }
+
+            };
+
+            (function callee(this: any,...inputs: any[]) {
+
+                if (execQueue.isRunning) {
+                    execQueue.queuedCalls.push(() => callee.apply(this, inputs));
+                    return;
+                }
+
+                execQueue.isRunning = true;
+
+                try {
+
+                    fun.apply(this, inputs)
+                        .then(data => onComplete({ data }))
+                        .catch(reason => onComplete({ reason }))
+                        ;
+
+                } catch (error) {
+
+                    onComplete({ "reason": error });
+
+                }
+
+            }).apply(this, inputs);
+
+        });
+
+    }) as T;
+
+    if (isGlobal) {
+
+        execQueue = getOrCreateExecQueue(globalContext, groupRef);
+
+    }
+
+    groupByRunExclusiveFunction.set(runExclusiveFunction, groupRef);
+
+    return runExclusiveFunction;
+
+}
+
+/** 
+ * (Read all before using)
+ * 
+ * The pending of 'build' for creating run exclusive functions that complete
+ * via calling a callback function. (Instead of returning a promise).
+ * 
+ * The only valid reason to use this instead of ``build()`` is to be able to
+ * retrieve the result and/or release the lock synchronously when it's possible.
+ * 
+ * If you want the callback to be optional it is possible to 
+ * define the function as such:   
+ * ``const myRunExclusiveFunction = buildCb((callback?)=> { ... });``  
+ * Anyway you must call it every time and assume it has been defined:
+ * ``callback!(...)``.   
+ * 
+ * To see if the user has actually provided a callback you can access the hidden property
+ * ``callback.hasCallback``.
+ * 
+ * WARNING: You must also make sure, if you use an optional callback 
+ * that the argument before it cannot be a function.   
+ * Be aware that the compiler won't warn you against it.  
+ * Example: ``(getLetter:()=> string, callback?:(res:string)=> void)=>{..}``  
+ * is NOT a valid function to pass to ``buildCb()`` 
+ * 
+ * WARNING: the source function should NEVER throw exception!
+ */
+export function buildCb<T extends (...input: any[]) => void>(fun: T): T;
+export function buildCb<T extends (...input: any[]) => void>(groupRef: GroupRef, fun: T): T;
+export function buildCb(...inputs: any[]): any {
+
+    switch (inputs.length) {
+        case 1: return buildFnCallback(true, createGroupRef(), inputs[0]);
+        case 2: return buildFnCallback(true, inputs[0], inputs[1]);
+    }
+
+}
+
+/** 
+ * (Read all before using)
+ * 
+ * Pending of 'buildMethod' for function that return with callback instead of promise.
+ * 
+ * The pending of 'build' for creating run exclusive functions that complete
+ * via calling a callback function. (Instead of returning a promise).
+ * 
+ * The only valid reason to use this instead of ``build()`` is to be able to
+ * retrieve the result and/or release the lock synchronously when it's possible.
+ * 
+ * If you want the callback to be optional it is possible to 
+ * define the function as such:   
+ * ``const myRunExclusiveFunction = buildCb((callback?)=> { ... });``  
+ * Anyway you must call it every time and assume it has been defined:
+ * ``callback!(...)``.   
+ * 
+ * To see if the user has actually provided a callback you can access the hidden property
+ * ``callback.hasCallback``.
+ * 
+ * WARNING: You must also make sure, if you use an optional callback 
+ * that the argument before it cannot be a function.   
+ * Be aware that the compiler won't warn you against it.  
+ * Example: ``(getLetter:()=> string, callback?:(res:string)=> void)=>{..}``  
+ * is NOT a valid function to pass to ``buildMethodCb()``
+ * 
+ * WARNING: the source function should NEVER throw exception!
+ * 
+ */
+export function buildMethodCb<T extends (...input: any[]) => void>(fun: T): T;
+export function buildMethodCb<T extends (...input: any[]) => void>(groupRef: GroupRef, fun: T): T;
+export function buildMethodCb(...inputs: any[]): any {
+
+    switch (inputs.length) {
+        case 1: return buildFnCallback(false, createGroupRef(), inputs[0]);
+        case 2: return buildFnCallback(false, inputs[0], inputs[1]);
+    }
+
+}
+
+function buildFnCallback<T extends (...inputs: any[]) => Promise<any>>(
+    isGlobal: boolean,
+    groupRef: GroupRef,
+    fun: T
+): T {
+
+    let execQueue: ExecQueue;
+
+    const runExclusiveFunction = (function (this: any,...inputs) {
+
+
+        if (!isGlobal) {
+
+            if (!(this instanceof Object)) {
+                throw new Error("Run exclusive, <this> should be an object");
+            }
+
+            execQueue = getOrCreateExecQueue(this, groupRef);
+
+        }
+
+        let callback: Function | undefined = undefined;
+
+        if (inputs.length && typeof inputs[inputs.length - 1] === "function") {
+            callback = inputs.pop();
+        }
+
+        let onPrCompleteResolve: () => void;
+
+        execQueue.prComplete = new Promise(resolve =>
+            onPrCompleteResolve = () => resolve()
+        );
+
+        const onComplete = (...inputs: any[]) => {
+            
+            onPrCompleteResolve();
+
+            execQueue!.isRunning = false;
+
+            if (execQueue.queuedCalls.length) {
+                execQueue.queuedCalls.shift()!();
+            }
+
+            if (callback) {
+                callback.apply(this, inputs);
+            }
+
+        };
+
+        (onComplete as any).hasCallback = !!callback;
+
+        (function callee(this: any, ...inputs: any[]) {
+
+            if (execQueue.isRunning) {
+                execQueue.queuedCalls.push(() => callee.apply(this, inputs));
+                return;
+            }
+
+            execQueue.isRunning = true;
+
+            try {
+
+                fun.apply(this, [...inputs, onComplete]);
+
+            } catch (error) {
+
+                error.message += " ( This exception should not have been thrown, miss use of run-exclusive buildCb )";
+
+                throw error;
+
+            }
+
+        }).apply(this, inputs);
+
+    }) as T;
+
+    if (isGlobal) {
+
+        execQueue = getOrCreateExecQueue(globalContext, groupRef);
+
+    }
+
+    groupByRunExclusiveFunction.set(runExclusiveFunction, groupRef);
+
+    return runExclusiveFunction;
+
+}
+
diff --git a/ddb_main/node_modules/scheduler/cjs/scheduler.production.min.js b/ddb_main/node_modules/scheduler/cjs/scheduler.production.min.js
new file mode 100644
index 0000000..15bb77f
--- /dev/null
+++ b/ddb_main/node_modules/scheduler/cjs/scheduler.production.min.js
@@ -0,0 +1,20 @@
+/** @license React v0.20.2
+ * scheduler.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';var f,g,h,k;if("object"===typeof performance&&"function"===typeof performance.now){var l=performance;exports.unstable_now=function(){return l.now()}}else{var p=Date,q=p.now();exports.unstable_now=function(){return p.now()-q}}
+if("undefined"===typeof window||"function"!==typeof MessageChannel){var t=null,u=null,w=function(){if(null!==t)try{var a=exports.unstable_now();t(!0,a);t=null}catch(b){throw setTimeout(w,0),b;}};f=function(a){null!==t?setTimeout(f,0,a):(t=a,setTimeout(w,0))};g=function(a,b){u=setTimeout(a,b)};h=function(){clearTimeout(u)};exports.unstable_shouldYield=function(){return!1};k=exports.unstable_forceFrameRate=function(){}}else{var x=window.setTimeout,y=window.clearTimeout;if("undefined"!==typeof console){var z=
+window.cancelAnimationFrame;"function"!==typeof window.requestAnimationFrame&&console.error("This browser doesn't support requestAnimationFrame. Make sure that you load a polyfill in older browsers. https://reactjs.org/link/react-polyfills");"function"!==typeof z&&console.error("This browser doesn't support cancelAnimationFrame. Make sure that you load a polyfill in older browsers. https://reactjs.org/link/react-polyfills")}var A=!1,B=null,C=-1,D=5,E=0;exports.unstable_shouldYield=function(){return exports.unstable_now()>=
+E};k=function(){};exports.unstable_forceFrameRate=function(a){0>a||125<a?console.error("forceFrameRate takes a positive int between 0 and 125, forcing frame rates higher than 125 fps is not supported"):D=0<a?Math.floor(1E3/a):5};var F=new MessageChannel,G=F.port2;F.port1.onmessage=function(){if(null!==B){var a=exports.unstable_now();E=a+D;try{B(!0,a)?G.postMessage(null):(A=!1,B=null)}catch(b){throw G.postMessage(null),b;}}else A=!1};f=function(a){B=a;A||(A=!0,G.postMessage(null))};g=function(a,b){C=
+x(function(){a(exports.unstable_now())},b)};h=function(){y(C);C=-1}}function H(a,b){var c=a.length;a.push(b);a:for(;;){var d=c-1>>>1,e=a[d];if(void 0!==e&&0<I(e,b))a[d]=b,a[c]=e,c=d;else break a}}function J(a){a=a[0];return void 0===a?null:a}
+function K(a){var b=a[0];if(void 0!==b){var c=a.pop();if(c!==b){a[0]=c;a:for(var d=0,e=a.length;d<e;){var m=2*(d+1)-1,n=a[m],v=m+1,r=a[v];if(void 0!==n&&0>I(n,c))void 0!==r&&0>I(r,n)?(a[d]=r,a[v]=c,d=v):(a[d]=n,a[m]=c,d=m);else if(void 0!==r&&0>I(r,c))a[d]=r,a[v]=c,d=v;else break a}}return b}return null}function I(a,b){var c=a.sortIndex-b.sortIndex;return 0!==c?c:a.id-b.id}var L=[],M=[],N=1,O=null,P=3,Q=!1,R=!1,S=!1;
+function T(a){for(var b=J(M);null!==b;){if(null===b.callback)K(M);else if(b.startTime<=a)K(M),b.sortIndex=b.expirationTime,H(L,b);else break;b=J(M)}}function U(a){S=!1;T(a);if(!R)if(null!==J(L))R=!0,f(V);else{var b=J(M);null!==b&&g(U,b.startTime-a)}}
+function V(a,b){R=!1;S&&(S=!1,h());Q=!0;var c=P;try{T(b);for(O=J(L);null!==O&&(!(O.expirationTime>b)||a&&!exports.unstable_shouldYield());){var d=O.callback;if("function"===typeof d){O.callback=null;P=O.priorityLevel;var e=d(O.expirationTime<=b);b=exports.unstable_now();"function"===typeof e?O.callback=e:O===J(L)&&K(L);T(b)}else K(L);O=J(L)}if(null!==O)var m=!0;else{var n=J(M);null!==n&&g(U,n.startTime-b);m=!1}return m}finally{O=null,P=c,Q=!1}}var W=k;exports.unstable_IdlePriority=5;
+exports.unstable_ImmediatePriority=1;exports.unstable_LowPriority=4;exports.unstable_NormalPriority=3;exports.unstable_Profiling=null;exports.unstable_UserBlockingPriority=2;exports.unstable_cancelCallback=function(a){a.callback=null};exports.unstable_continueExecution=function(){R||Q||(R=!0,f(V))};exports.unstable_getCurrentPriorityLevel=function(){return P};exports.unstable_getFirstCallbackNode=function(){return J(L)};
+exports.unstable_next=function(a){switch(P){case 1:case 2:case 3:var b=3;break;default:b=P}var c=P;P=b;try{return a()}finally{P=c}};exports.unstable_pauseExecution=function(){};exports.unstable_requestPaint=W;exports.unstable_runWithPriority=function(a,b){switch(a){case 1:case 2:case 3:case 4:case 5:break;default:a=3}var c=P;P=a;try{return b()}finally{P=c}};
+exports.unstable_scheduleCallback=function(a,b,c){var d=exports.unstable_now();"object"===typeof c&&null!==c?(c=c.delay,c="number"===typeof c&&0<c?d+c:d):c=d;switch(a){case 1:var e=-1;break;case 2:e=250;break;case 5:e=1073741823;break;case 4:e=1E4;break;default:e=5E3}e=c+e;a={id:N++,callback:b,priorityLevel:a,startTime:c,expirationTime:e,sortIndex:-1};c>d?(a.sortIndex=c,H(M,a),null===J(L)&&a===J(M)&&(S?h():S=!0,g(U,c-d))):(a.sortIndex=e,H(L,a),R||Q||(R=!0,f(V)));return a};
+exports.unstable_wrapCallback=function(a){var b=P;return function(){var c=P;P=b;try{return a.apply(this,arguments)}finally{P=c}}};
diff --git a/ddb_main/node_modules/scheduler/index.js b/ddb_main/node_modules/scheduler/index.js
new file mode 100644
index 0000000..77770b0
--- /dev/null
+++ b/ddb_main/node_modules/scheduler/index.js
@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/scheduler.production.min.js');
+} else {
+  module.exports = require('./cjs/scheduler.development.js');
+}
diff --git a/ddb_main/node_modules/shallowequal/index.js b/ddb_main/node_modules/shallowequal/index.js
new file mode 100644
index 0000000..957f3ac
--- /dev/null
+++ b/ddb_main/node_modules/shallowequal/index.js
@@ -0,0 +1,46 @@
+//
+
+module.exports = function shallowEqual(objA, objB, compare, compareContext) {
+  var ret = compare ? compare.call(compareContext, objA, objB) : void 0;
+
+  if (ret !== void 0) {
+    return !!ret;
+  }
+
+  if (objA === objB) {
+    return true;
+  }
+
+  if (typeof objA !== "object" || !objA || typeof objB !== "object" || !objB) {
+    return false;
+  }
+
+  var keysA = Object.keys(objA);
+  var keysB = Object.keys(objB);
+
+  if (keysA.length !== keysB.length) {
+    return false;
+  }
+
+  var bHasOwnProperty = Object.prototype.hasOwnProperty.bind(objB);
+
+  // Test for A's keys different from B.
+  for (var idx = 0; idx < keysA.length; idx++) {
+    var key = keysA[idx];
+
+    if (!bHasOwnProperty(key)) {
+      return false;
+    }
+
+    var valueA = objA[key];
+    var valueB = objB[key];
+
+    ret = compare ? compare.call(compareContext, valueA, valueB, key) : void 0;
+
+    if (ret === false || (ret === void 0 && valueA !== valueB)) {
+      return false;
+    }
+  }
+
+  return true;
+};
diff --git a/ddb_main/node_modules/simple-swizzle/index.js b/ddb_main/node_modules/simple-swizzle/index.js
new file mode 100644
index 0000000..4d6b8ff
--- /dev/null
+++ b/ddb_main/node_modules/simple-swizzle/index.js
@@ -0,0 +1,29 @@
+'use strict';
+
+var isArrayish = require('is-arrayish');
+
+var concat = Array.prototype.concat;
+var slice = Array.prototype.slice;
+
+var swizzle = module.exports = function swizzle(args) {
+	var results = [];
+
+	for (var i = 0, len = args.length; i < len; i++) {
+		var arg = args[i];
+
+		if (isArrayish(arg)) {
+			// http://jsperf.com/javascript-array-concat-vs-push/98
+			results = concat.call(results, slice.call(arg));
+		} else {
+			results.push(arg);
+		}
+	}
+
+	return results;
+};
+
+swizzle.wrap = function (fn) {
+	return function () {
+		return fn(swizzle(arguments));
+	};
+};
diff --git a/ddb_main/node_modules/simple-swizzle/node_modules/is-arrayish/index.js b/ddb_main/node_modules/simple-swizzle/node_modules/is-arrayish/index.js
new file mode 100644
index 0000000..729ca40
--- /dev/null
+++ b/ddb_main/node_modules/simple-swizzle/node_modules/is-arrayish/index.js
@@ -0,0 +1,9 @@
+module.exports = function isArrayish(obj) {
+	if (!obj || typeof obj === 'string') {
+		return false;
+	}
+
+	return obj instanceof Array || Array.isArray(obj) ||
+		(obj.length >= 0 && (obj.splice instanceof Function ||
+			(Object.getOwnPropertyDescriptor(obj, (obj.length - 1)) && obj.constructor.name !== 'String')));
+};
diff --git a/ddb_main/node_modules/styled-components/node_modules/@emotion/unitless/dist/unitless.browser.esm.js b/ddb_main/node_modules/styled-components/node_modules/@emotion/unitless/dist/unitless.browser.esm.js
new file mode 100644
index 0000000..9fe06f8
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/node_modules/@emotion/unitless/dist/unitless.browser.esm.js
@@ -0,0 +1,50 @@
+var unitlessKeys = {
+  animationIterationCount: 1,
+  borderImageOutset: 1,
+  borderImageSlice: 1,
+  borderImageWidth: 1,
+  boxFlex: 1,
+  boxFlexGroup: 1,
+  boxOrdinalGroup: 1,
+  columnCount: 1,
+  columns: 1,
+  flex: 1,
+  flexGrow: 1,
+  flexPositive: 1,
+  flexShrink: 1,
+  flexNegative: 1,
+  flexOrder: 1,
+  gridRow: 1,
+  gridRowEnd: 1,
+  gridRowSpan: 1,
+  gridRowStart: 1,
+  gridColumn: 1,
+  gridColumnEnd: 1,
+  gridColumnSpan: 1,
+  gridColumnStart: 1,
+  msGridRow: 1,
+  msGridRowSpan: 1,
+  msGridColumn: 1,
+  msGridColumnSpan: 1,
+  fontWeight: 1,
+  lineHeight: 1,
+  opacity: 1,
+  order: 1,
+  orphans: 1,
+  tabSize: 1,
+  widows: 1,
+  zIndex: 1,
+  zoom: 1,
+  WebkitLineClamp: 1,
+  // SVG-related properties
+  fillOpacity: 1,
+  floodOpacity: 1,
+  stopOpacity: 1,
+  strokeDasharray: 1,
+  strokeDashoffset: 1,
+  strokeMiterlimit: 1,
+  strokeOpacity: 1,
+  strokeWidth: 1
+};
+
+export default unitlessKeys;
diff --git a/ddb_main/node_modules/styled-components/src/base.js b/ddb_main/node_modules/styled-components/src/base.js
new file mode 100644
index 0000000..a424b31
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/base.js
@@ -0,0 +1,74 @@
+// @flow
+/* Import singletons */
+import isStyledComponent from './utils/isStyledComponent';
+import css from './constructors/css';
+import createGlobalStyle from './constructors/createGlobalStyle';
+import keyframes from './constructors/keyframes';
+import ServerStyleSheet from './models/ServerStyleSheet';
+import { SC_VERSION } from './constants';
+
+import StyleSheetManager, {
+  StyleSheetContext,
+  StyleSheetConsumer,
+} from './models/StyleSheetManager';
+
+/* Import components */
+import ThemeProvider, { ThemeContext, ThemeConsumer } from './models/ThemeProvider';
+
+/* Import Higher Order Components */
+import withTheme from './hoc/withTheme';
+
+/* Import hooks */
+import useTheme from './hooks/useTheme';
+
+declare var __SERVER__: boolean;
+
+/* Warning if you've imported this file on React Native */
+if (
+  process.env.NODE_ENV !== 'production' &&
+  typeof navigator !== 'undefined' &&
+  navigator.product === 'ReactNative'
+) {
+  // eslint-disable-next-line no-console
+  console.warn(
+    "It looks like you've imported 'styled-components' on React Native.\n" +
+      "Perhaps you're looking to import 'styled-components/native'?\n" +
+      'Read more about this at https://www.styled-components.com/docs/basics#react-native'
+  );
+}
+
+/* Warning if there are several instances of styled-components */
+if (process.env.NODE_ENV !== 'production' && process.env.NODE_ENV !== 'test' && typeof window !== 'undefined') {
+  window['__styled-components-init__'] = window['__styled-components-init__'] || 0;
+
+  if (window['__styled-components-init__'] === 1) {
+    // eslint-disable-next-line no-console
+    console.warn(
+      "It looks like there are several instances of 'styled-components' initialized in this application. " +
+        'This may cause dynamic styles to not render properly, errors during the rehydration process, ' +
+        'a missing theme prop, and makes your application bigger without good reason.\n\n' +
+        'See https://s-c.sh/2BAXzed for more info.'
+    );
+  }
+
+  window['__styled-components-init__'] += 1;
+}
+
+/* Export everything */
+export * from './secretInternals';
+export {
+  createGlobalStyle,
+  css,
+  isStyledComponent,
+  keyframes,
+  ServerStyleSheet,
+  StyleSheetConsumer,
+  StyleSheetContext,
+  StyleSheetManager,
+  ThemeConsumer,
+  ThemeContext,
+  ThemeProvider,
+  useTheme,
+  SC_VERSION as version,
+  withTheme,
+};
diff --git a/ddb_main/node_modules/styled-components/src/constants.js b/ddb_main/node_modules/styled-components/src/constants.js
new file mode 100644
index 0000000..ed934f8
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/constants.js
@@ -0,0 +1,37 @@
+// @flow
+
+declare var SC_DISABLE_SPEEDY: ?boolean;
+declare var __VERSION__: string;
+
+export const SC_ATTR: string =
+  (typeof process !== 'undefined' &&
+    typeof process.env !== 'undefined' &&
+    (process.env.REACT_APP_SC_ATTR || process.env.SC_ATTR)) ||
+  'data-styled';
+
+export const SC_ATTR_ACTIVE = 'active';
+export const SC_ATTR_VERSION = 'data-styled-version';
+export const SC_VERSION = __VERSION__;
+export const SPLITTER = '/*!sc*/\n';
+
+export const IS_BROWSER = typeof window !== 'undefined' && 'HTMLElement' in window;
+
+export const DISABLE_SPEEDY = Boolean(
+  typeof SC_DISABLE_SPEEDY === 'boolean'
+    ? SC_DISABLE_SPEEDY
+    : typeof process !== 'undefined' && typeof process.env !== 'undefined'
+    ? typeof process.env.REACT_APP_SC_DISABLE_SPEEDY !== 'undefined' &&
+      process.env.REACT_APP_SC_DISABLE_SPEEDY !== ''
+      ? process.env.REACT_APP_SC_DISABLE_SPEEDY === 'false'
+        ? false
+        : process.env.REACT_APP_SC_DISABLE_SPEEDY
+      : typeof process.env.SC_DISABLE_SPEEDY !== 'undefined' && process.env.SC_DISABLE_SPEEDY !== ''
+      ? process.env.SC_DISABLE_SPEEDY === 'false'
+        ? false
+        : process.env.SC_DISABLE_SPEEDY
+      : process.env.NODE_ENV !== 'production'
+    : false
+);
+
+// Shared empty execution context when generating static styles
+export const STATIC_EXECUTION_CONTEXT = {};
diff --git a/ddb_main/node_modules/styled-components/src/constructors/constructWithOptions.js b/ddb_main/node_modules/styled-components/src/constructors/constructWithOptions.js
new file mode 100644
index 0000000..6e79463
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/constructors/constructWithOptions.js
@@ -0,0 +1,34 @@
+// @flow
+import { isValidElementType } from 'react-is';
+import css from './css';
+import throwStyledError from '../utils/error';
+import { EMPTY_OBJECT } from '../utils/empties';
+
+import type { Target } from '../types';
+
+export default function constructWithOptions(
+  componentConstructor: Function,
+  tag: Target,
+  options: Object = EMPTY_OBJECT
+) {
+  if (!isValidElementType(tag)) {
+    return throwStyledError(1, String(tag));
+  }
+
+  /* This is callable directly as a template function */
+  // $FlowFixMe: Not typed to avoid destructuring arguments
+  const templateFunction = (...args) => componentConstructor(tag, options, css(...args));
+
+  /* If config methods are called, wrap up a new template function and merge options */
+  templateFunction.withConfig = config =>
+    constructWithOptions(componentConstructor, tag, { ...options, ...config });
+
+  /* Modify/inject new props at runtime */
+  templateFunction.attrs = attrs =>
+    constructWithOptions(componentConstructor, tag, {
+      ...options,
+      attrs: Array.prototype.concat(options.attrs, attrs).filter(Boolean),
+    });
+
+  return templateFunction;
+}
diff --git a/ddb_main/node_modules/styled-components/src/constructors/css.js b/ddb_main/node_modules/styled-components/src/constructors/css.js
new file mode 100644
index 0000000..7e5a295
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/constructors/css.js
@@ -0,0 +1,34 @@
+// @flow
+import interleave from '../utils/interleave';
+import isPlainObject from '../utils/isPlainObject';
+import { EMPTY_ARRAY } from '../utils/empties';
+import isFunction from '../utils/isFunction';
+import flatten from '../utils/flatten';
+import type { Interpolation, RuleSet, Styles } from '../types';
+
+/**
+ * Used when flattening object styles to determine if we should
+ * expand an array of styles.
+ */
+const addTag = arg => {
+  if (Array.isArray(arg)) {
+    // eslint-disable-next-line no-param-reassign
+    arg.isCss = true;
+  }
+  return arg;
+};
+
+export default function css(styles: Styles, ...interpolations: Array<Interpolation>): RuleSet {
+  if (isFunction(styles) || isPlainObject(styles)) {
+    // $FlowFixMe
+    return addTag(flatten(interleave(EMPTY_ARRAY, [styles, ...interpolations])));
+  }
+
+  if (interpolations.length === 0 && styles.length === 1 && typeof styles[0] === 'string') {
+    // $FlowFixMe
+    return styles;
+  }
+
+  // $FlowFixMe
+  return addTag(flatten(interleave(styles, interpolations)));
+}
diff --git a/ddb_main/node_modules/styled-components/src/constructors/styled.js b/ddb_main/node_modules/styled-components/src/constructors/styled.js
new file mode 100644
index 0000000..ae4dec9
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/constructors/styled.js
@@ -0,0 +1,15 @@
+// @flow
+import constructWithOptions from './constructWithOptions';
+import StyledComponent from '../models/StyledComponent';
+import domElements from '../utils/domElements';
+
+import type { Target } from '../types';
+
+const styled = (tag: Target) => constructWithOptions(StyledComponent, tag);
+
+// Shorthands for all valid HTML Elements
+domElements.forEach(domElement => {
+  styled[domElement] = styled(domElement);
+});
+
+export default styled;
diff --git a/ddb_main/node_modules/styled-components/src/models/ComponentStyle.js b/ddb_main/node_modules/styled-components/src/models/ComponentStyle.js
new file mode 100644
index 0000000..4a81524
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/models/ComponentStyle.js
@@ -0,0 +1,112 @@
+// @flow
+import { SC_VERSION } from '../constants';
+import StyleSheet from '../sheet';
+import type { RuleSet, Stringifier } from '../types';
+import flatten from '../utils/flatten';
+import generateName from '../utils/generateAlphabeticName';
+import { hash, phash } from '../utils/hash';
+import isStaticRules from '../utils/isStaticRules';
+
+const SEED = hash(SC_VERSION);
+
+/**
+ * ComponentStyle is all the CSS-specific stuff, not the React-specific stuff.
+ */
+export default class ComponentStyle {
+  baseHash: number;
+
+  baseStyle: ?ComponentStyle;
+
+  componentId: string;
+
+  isStatic: boolean;
+
+  rules: RuleSet;
+
+  staticRulesId: string;
+
+  constructor(rules: RuleSet, componentId: string, baseStyle?: ComponentStyle) {
+    this.rules = rules;
+    this.staticRulesId = '';
+    this.isStatic = process.env.NODE_ENV === 'production' &&
+      (baseStyle === undefined || baseStyle.isStatic) &&
+      isStaticRules(rules);
+    this.componentId = componentId;
+
+    // SC_VERSION gives us isolation between multiple runtimes on the page at once
+    // this is improved further with use of the babel plugin "namespace" feature
+    this.baseHash = phash(SEED, componentId);
+
+    this.baseStyle = baseStyle;
+
+    // NOTE: This registers the componentId, which ensures a consistent order
+    // for this component's styles compared to others
+    StyleSheet.registerId(componentId);
+  }
+
+  /*
+   * Flattens a rule set into valid CSS
+   * Hashes it, wraps the whole chunk in a .hash1234 {}
+   * Returns the hash to be injected on render()
+   * */
+  generateAndInjectStyles(executionContext: Object, styleSheet: StyleSheet, stylis: Stringifier) {
+    const { componentId } = this;
+
+    const names = [];
+
+    if (this.baseStyle) {
+      names.push(this.baseStyle.generateAndInjectStyles(executionContext, styleSheet, stylis));
+    }
+
+    // force dynamic classnames if user-supplied stylis plugins are in use
+    if (this.isStatic && !stylis.hash) {
+      if (this.staticRulesId && styleSheet.hasNameForId(componentId, this.staticRulesId)) {
+        names.push(this.staticRulesId);
+      } else {
+        const cssStatic = flatten(this.rules, executionContext, styleSheet, stylis).join('');
+        const name = generateName(phash(this.baseHash, cssStatic) >>> 0);
+
+        if (!styleSheet.hasNameForId(componentId, name)) {
+          const cssStaticFormatted = stylis(cssStatic, `.${name}`, undefined, componentId);
+
+          styleSheet.insertRules(componentId, name, cssStaticFormatted);
+        }
+
+        names.push(name);
+        this.staticRulesId = name;
+      }
+    } else {
+      const { length } = this.rules;
+      let dynamicHash = phash(this.baseHash, stylis.hash);
+      let css = '';
+
+      for (let i = 0; i < length; i++) {
+        const partRule = this.rules[i];
+
+        if (typeof partRule === 'string') {
+          css += partRule;
+
+          if (process.env.NODE_ENV !== 'production') dynamicHash = phash(dynamicHash, partRule + i);
+        } else if (partRule) {
+          const partChunk = flatten(partRule, executionContext, styleSheet, stylis);
+          const partString = Array.isArray(partChunk) ? partChunk.join('') : partChunk;
+          dynamicHash = phash(dynamicHash, partString + i);
+          css += partString;
+        }
+      }
+
+      if (css) {
+        const name = generateName(dynamicHash >>> 0);
+
+        if (!styleSheet.hasNameForId(componentId, name)) {
+          const cssFormatted = stylis(css, `.${name}`, undefined, componentId);
+          styleSheet.insertRules(componentId, name, cssFormatted);
+        }
+
+        names.push(name);
+      }
+    }
+
+    return names.join(' ');
+  }
+}
diff --git a/ddb_main/node_modules/styled-components/src/models/GlobalStyle.js b/ddb_main/node_modules/styled-components/src/models/GlobalStyle.js
new file mode 100644
index 0000000..134d61f
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/models/GlobalStyle.js
@@ -0,0 +1,54 @@
+// @flow
+import StyleSheet from '../sheet';
+import type { RuleSet, Stringifier } from '../types';
+import flatten from '../utils/flatten';
+import isStaticRules from '../utils/isStaticRules';
+
+export default class GlobalStyle {
+  componentId: string;
+
+  isStatic: boolean;
+
+  rules: RuleSet;
+
+  constructor(rules: RuleSet, componentId: string) {
+    this.rules = rules;
+    this.componentId = componentId;
+    this.isStatic = isStaticRules(rules);
+
+    // pre-register the first instance to ensure global styles
+    // load before component ones
+    StyleSheet.registerId(this.componentId + 1);
+  }
+
+  createStyles(
+    instance: number,
+    executionContext: Object,
+    styleSheet: StyleSheet,
+    stylis: Stringifier
+  ) {
+    const flatCSS = flatten(this.rules, executionContext, styleSheet, stylis);
+    const css = stylis(flatCSS.join(''), '');
+    const id = this.componentId + instance;
+
+    // NOTE: We use the id as a name as well, since these rules never change
+    styleSheet.insertRules(id, id, css);
+  }
+
+  removeStyles(instance: number, styleSheet: StyleSheet) {
+    styleSheet.clearRules(this.componentId + instance);
+  }
+
+  renderStyles(
+    instance: number,
+    executionContext: Object,
+    styleSheet: StyleSheet,
+    stylis: Stringifier
+  ) {
+    if (instance > 2) StyleSheet.registerId(this.componentId + instance);
+
+    // NOTE: Remove old styles, then inject the new ones
+    this.removeStyles(instance, styleSheet);
+    this.createStyles(instance, executionContext, styleSheet, stylis);
+  }
+}
diff --git a/ddb_main/node_modules/styled-components/src/models/Keyframes.js b/ddb_main/node_modules/styled-components/src/models/Keyframes.js
new file mode 100644
index 0000000..f18c93d
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/models/Keyframes.js
@@ -0,0 +1,39 @@
+// @flow
+import StyleSheet from '../sheet';
+import { type Stringifier } from '../types';
+import throwStyledError from '../utils/error';
+import { masterStylis } from './StyleSheetManager';
+
+export default class Keyframes {
+  id: string;
+
+  name: string;
+
+  rules: string;
+
+  constructor(name: string, rules: string) {
+    this.name = name;
+    this.id = `sc-keyframes-${name}`;
+    this.rules = rules;
+  }
+
+  inject = (styleSheet: StyleSheet, stylisInstance: Stringifier = masterStylis) => {
+    const resolvedName = this.name + stylisInstance.hash;
+
+    if (!styleSheet.hasNameForId(this.id, resolvedName)) {
+      styleSheet.insertRules(
+        this.id,
+        resolvedName,
+        stylisInstance(this.rules, resolvedName, '@keyframes')
+      );
+    }
+  };
+
+  toString = () => {
+    return throwStyledError(12, String(this.name));
+  };
+
+  getName(stylisInstance: Stringifier = masterStylis) {
+    return this.name + stylisInstance.hash;
+  }
+}
diff --git a/ddb_main/node_modules/styled-components/src/models/ServerStyleSheet.js b/ddb_main/node_modules/styled-components/src/models/ServerStyleSheet.js
new file mode 100644
index 0000000..f258ad3
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/models/ServerStyleSheet.js
@@ -0,0 +1,129 @@
+// @flow
+/* eslint-disable no-underscore-dangle */
+import React from 'react';
+import { IS_BROWSER, SC_ATTR, SC_ATTR_VERSION, SC_VERSION } from '../constants';
+import throwStyledError from '../utils/error';
+import getNonce from '../utils/nonce';
+import StyleSheet from '../sheet';
+import StyleSheetManager from './StyleSheetManager';
+
+declare var __SERVER__: boolean;
+
+const CLOSING_TAG_R = /^\s*<\/[a-z]/i;
+
+export default class ServerStyleSheet {
+  isStreaming: boolean;
+
+  instance: StyleSheet;
+
+  sealed: boolean;
+
+  constructor() {
+    this.instance = new StyleSheet({ isServer: true });
+    this.sealed = false;
+  }
+
+  _emitSheetCSS = (): string => {
+    const css = this.instance.toString();
+    if (!css) return '';
+
+    const nonce = getNonce();
+    const attrs = [nonce && `nonce="${nonce}"`, `${SC_ATTR}="true"`, `${SC_ATTR_VERSION}="${SC_VERSION}"`];
+    const htmlAttr = attrs.filter(Boolean).join(' ');
+
+    return `<style ${htmlAttr}>${css}</style>`;
+  };
+
+  collectStyles(children: any) {
+    if (this.sealed) {
+      return throwStyledError(2);
+    }
+
+    return <StyleSheetManager sheet={this.instance}>{children}</StyleSheetManager>;
+  }
+
+  getStyleTags = (): string => {
+    if (this.sealed) {
+      return throwStyledError(2);
+    }
+
+    return this._emitSheetCSS();
+  };
+
+  getStyleElement = () => {
+    if (this.sealed) {
+      return throwStyledError(2);
+    }
+
+    const props = {
+      [SC_ATTR]: '',
+      [SC_ATTR_VERSION]: SC_VERSION,
+      dangerouslySetInnerHTML: {
+        __html: this.instance.toString(),
+      },
+    };
+
+    const nonce = getNonce();
+    if (nonce) {
+      (props: any).nonce = nonce;
+    }
+
+    // v4 returned an array for this fn, so we'll do the same for v5 for backward compat
+    return [<style {...props} key="sc-0-0" />];
+  };
+
+  // eslint-disable-next-line consistent-return
+  interleaveWithNodeStream(input: any) {
+    if (!__SERVER__ || IS_BROWSER) {
+      return throwStyledError(3);
+    } else if (this.sealed) {
+      return throwStyledError(2);
+    }
+
+    if (__SERVER__) {
+      this.seal();
+
+      // eslint-disable-next-line global-require
+      const { Readable, Transform } = require('stream');
+
+      const readableStream: Readable = input;
+      const { instance: sheet, _emitSheetCSS } = this;
+
+      const transformer = new Transform({
+        transform: function appendStyleChunks(chunk, /* encoding */ _, callback) {
+          // Get the chunk and retrieve the sheet's CSS as an HTML chunk,
+          // then reset its rules so we get only new ones for the next chunk
+          const renderedHtml = chunk.toString();
+          const html = _emitSheetCSS();
+
+          sheet.clearTag();
+
+          // prepend style html to chunk, unless the start of the chunk is a
+          // closing tag in which case append right after that
+          if (CLOSING_TAG_R.test(renderedHtml)) {
+            const endOfClosingTag = renderedHtml.indexOf('>') + 1;
+            const before = renderedHtml.slice(0, endOfClosingTag);
+            const after = renderedHtml.slice(endOfClosingTag);
+
+            this.push(before + html + after);
+          } else {
+            this.push(html + renderedHtml);
+          }
+
+          callback();
+        },
+      });
+
+      readableStream.on('error', err => {
+        // forward the error to the transform stream
+        transformer.emit('error', err);
+      });
+
+      return readableStream.pipe(transformer);
+    }
+  }
+
+  seal = () => {
+    this.sealed = true;
+  };
+}
diff --git a/ddb_main/node_modules/styled-components/src/models/StyleSheetManager.js b/ddb_main/node_modules/styled-components/src/models/StyleSheetManager.js
new file mode 100644
index 0000000..9bd40c5
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/models/StyleSheetManager.js
@@ -0,0 +1,76 @@
+// @flow
+import React, { type Context, type Node, useContext, useEffect, useMemo, useState } from 'react';
+import shallowequal from 'shallowequal';
+import StyleSheet from '../sheet';
+import type { Stringifier } from '../types';
+import createStylisInstance from '../utils/stylis';
+
+type Props = {
+  children?: Node,
+  disableCSSOMInjection?: boolean,
+  disableVendorPrefixes?: boolean,
+  sheet?: StyleSheet,
+  stylisPlugins?: Array<Function>,
+  target?: HTMLElement,
+};
+
+export const StyleSheetContext: Context<StyleSheet | void> = React.createContext();
+export const StyleSheetConsumer = StyleSheetContext.Consumer;
+export const StylisContext: Context<Stringifier | void> = React.createContext();
+export const StylisConsumer = StylisContext.Consumer;
+
+export const masterSheet: StyleSheet = new StyleSheet();
+export const masterStylis: Stringifier = createStylisInstance();
+
+export function useStyleSheet(): StyleSheet {
+  return useContext(StyleSheetContext) || masterSheet;
+}
+
+export function useStylis(): Stringifier {
+  return useContext(StylisContext) || masterStylis;
+}
+
+export default function StyleSheetManager(props: Props) {
+  const [plugins, setPlugins] = useState(props.stylisPlugins);
+  const contextStyleSheet = useStyleSheet();
+
+  const styleSheet = useMemo(() => {
+    let sheet = contextStyleSheet;
+
+    if (props.sheet) {
+      // eslint-disable-next-line prefer-destructuring
+      sheet = props.sheet;
+    } else if (props.target) {
+      sheet = sheet.reconstructWithOptions({ target: props.target }, false);
+    }
+
+    if (props.disableCSSOMInjection) {
+      sheet = sheet.reconstructWithOptions({ useCSSOMInjection: false });
+    }
+
+    return sheet;
+  }, [props.disableCSSOMInjection, props.sheet, props.target]);
+
+  const stylis = useMemo(
+    () =>
+      createStylisInstance({
+        options: { prefix: !props.disableVendorPrefixes },
+        plugins,
+      }),
+    [props.disableVendorPrefixes, plugins]
+  );
+
+  useEffect(() => {
+    if (!shallowequal(plugins, props.stylisPlugins)) setPlugins(props.stylisPlugins);
+  }, [props.stylisPlugins]);
+
+  return (
+    <StyleSheetContext.Provider value={styleSheet}>
+      <StylisContext.Provider value={stylis}>
+        {process.env.NODE_ENV !== 'production'
+          ? React.Children.only(props.children)
+          : props.children}
+      </StylisContext.Provider>
+    </StyleSheetContext.Provider>
+  );
+}
diff --git a/ddb_main/node_modules/styled-components/src/models/StyledComponent.js b/ddb_main/node_modules/styled-components/src/models/StyledComponent.js
new file mode 100644
index 0000000..ea4c563
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/models/StyledComponent.js
@@ -0,0 +1,327 @@
+// @flow
+import validAttr from '@emotion/is-prop-valid';
+import hoist from 'hoist-non-react-statics';
+import React, { createElement, type Ref, useContext } from 'react';
+import { SC_VERSION } from '../constants';
+import type {
+  Attrs,
+  IStyledComponent,
+  IStyledStatics,
+  RuleSet,
+  ShouldForwardProp,
+  Target,
+} from '../types';
+import { checkDynamicCreation } from '../utils/checkDynamicCreation';
+import createWarnTooManyClasses from '../utils/createWarnTooManyClasses';
+import determineTheme from '../utils/determineTheme';
+import { EMPTY_ARRAY, EMPTY_OBJECT } from '../utils/empties';
+import escape from '../utils/escape';
+import generateComponentId from '../utils/generateComponentId';
+import generateDisplayName from '../utils/generateDisplayName';
+import getComponentName from '../utils/getComponentName';
+import isFunction from '../utils/isFunction';
+import isStyledComponent from '../utils/isStyledComponent';
+import isTag from '../utils/isTag';
+import joinStrings from '../utils/joinStrings';
+import merge from '../utils/mixinDeep';
+import ComponentStyle from './ComponentStyle';
+import { useStyleSheet, useStylis } from './StyleSheetManager';
+import { ThemeContext } from './ThemeProvider';
+
+const identifiers = {};
+
+/* We depend on components having unique IDs */
+function generateId(displayName?: string, parentComponentId?: string) {
+  const name = typeof displayName !== 'string' ? 'sc' : escape(displayName);
+  // Ensure that no displayName can lead to duplicate componentIds
+  identifiers[name] = (identifiers[name] || 0) + 1;
+
+  const componentId = `${name}-${generateComponentId(
+    // SC_VERSION gives us isolation between multiple runtimes on the page at once
+    // this is improved further with use of the babel plugin "namespace" feature
+    SC_VERSION + name + identifiers[name]
+  )}`;
+
+  return parentComponentId ? `${parentComponentId}-${componentId}` : componentId;
+}
+
+function useResolvedAttrs<Config>(theme: any = EMPTY_OBJECT, props: Config, attrs: Attrs) {
+  // NOTE: can't memoize this
+  // returns [context, resolvedAttrs]
+  // where resolvedAttrs is only the things injected by the attrs themselves
+  const context = { ...props, theme };
+  const resolvedAttrs = {};
+
+  attrs.forEach(attrDef => {
+    let resolvedAttrDef = attrDef;
+    let key;
+
+    if (isFunction(resolvedAttrDef)) {
+      resolvedAttrDef = resolvedAttrDef(context);
+    }
+
+    /* eslint-disable guard-for-in */
+    for (key in resolvedAttrDef) {
+      context[key] = resolvedAttrs[key] =
+        key === 'className'
+          ? joinStrings(resolvedAttrs[key], resolvedAttrDef[key])
+          : resolvedAttrDef[key];
+    }
+    /* eslint-enable guard-for-in */
+  });
+
+  return [context, resolvedAttrs];
+}
+
+function useInjectedStyle<T>(
+  componentStyle: ComponentStyle,
+  isStatic: boolean,
+  resolvedAttrs: T,
+  warnTooManyClasses?: $Call<typeof createWarnTooManyClasses, string, string>
+) {
+  const styleSheet = useStyleSheet();
+  const stylis = useStylis();
+
+  const className = isStatic
+    ? componentStyle.generateAndInjectStyles(EMPTY_OBJECT, styleSheet, stylis)
+    : componentStyle.generateAndInjectStyles(resolvedAttrs, styleSheet, stylis);
+
+  if (process.env.NODE_ENV !== 'production' && !isStatic && warnTooManyClasses) {
+    warnTooManyClasses(className);
+  }
+
+  return className;
+}
+
+function useStyledComponentImpl(
+  forwardedComponent: IStyledComponent,
+  props: Object,
+  forwardedRef: Ref<any>,
+  isStatic: boolean
+) {
+  const {
+    attrs: componentAttrs,
+    componentStyle,
+    defaultProps,
+    foldedComponentIds,
+    shouldForwardProp,
+    styledComponentId,
+    target,
+  } = forwardedComponent;
+
+  // NOTE: the non-hooks version only subscribes to this when !componentStyle.isStatic,
+  // but that'd be against the rules-of-hooks. We could be naughty and do it anyway as it
+  // should be an immutable value, but behave for now.
+  const theme = determineTheme(props, useContext(ThemeContext), defaultProps);
+
+  const [context, attrs] = useResolvedAttrs(theme || EMPTY_OBJECT, props, componentAttrs);
+
+  const generatedClassName = useInjectedStyle(
+    componentStyle,
+    isStatic,
+    context,
+    process.env.NODE_ENV !== 'production' ? forwardedComponent.warnTooManyClasses : undefined
+  );
+
+  const refToForward = forwardedRef;
+
+  const elementToBeCreated: Target = attrs.$as || props.$as || attrs.as || props.as || target;
+
+  const isTargetTag = isTag(elementToBeCreated);
+  const computedProps = attrs !== props ? { ...props, ...attrs } : props;
+  const propsForElement = {};
+
+  // eslint-disable-next-line guard-for-in
+  for (const key in computedProps) {
+    if (key[0] === '$' || key === 'as') continue;
+    else if (key === 'forwardedAs') {
+      propsForElement.as = computedProps[key];
+    } else if (
+      shouldForwardProp
+        ? shouldForwardProp(key, validAttr, elementToBeCreated)
+        : isTargetTag
+        ? validAttr(key)
+        : true
+    ) {
+      // Don't pass through non HTML tags through to HTML elements
+      propsForElement[key] = computedProps[key];
+    }
+  }
+
+  if (props.style && attrs.style !== props.style) {
+    propsForElement.style = { ...props.style, ...attrs.style };
+  }
+
+  propsForElement.className = Array.prototype
+    .concat(
+      foldedComponentIds,
+      styledComponentId,
+      generatedClassName !== styledComponentId ? generatedClassName : null,
+      props.className,
+      attrs.className
+    )
+    .filter(Boolean)
+    .join(' ');
+
+  propsForElement.ref = refToForward;
+
+  return createElement(elementToBeCreated, propsForElement);
+}
+
+export default function createStyledComponent(
+  target: $PropertyType<IStyledComponent, 'target'>,
+  options: {
+    attrs?: Attrs,
+    componentId: string,
+    displayName?: string,
+    parentComponentId?: string,
+    shouldForwardProp?: ShouldForwardProp,
+  },
+  rules: RuleSet
+) {
+  const isTargetStyledComp = isStyledComponent(target);
+  const isCompositeComponent = !isTag(target);
+
+  const {
+    attrs = EMPTY_ARRAY,
+    componentId = generateId(options.displayName, options.parentComponentId),
+    displayName = generateDisplayName(target),
+  } = options;
+
+  const styledComponentId =
+    options.displayName && options.componentId
+      ? `${escape(options.displayName)}-${options.componentId}`
+      : options.componentId || componentId;
+
+  // fold the underlying StyledComponent attrs up (implicit extend)
+  const finalAttrs =
+    isTargetStyledComp && ((target: any): IStyledComponent).attrs
+      ? Array.prototype.concat(((target: any): IStyledComponent).attrs, attrs).filter(Boolean)
+      : attrs;
+
+  // eslint-disable-next-line prefer-destructuring
+  let shouldForwardProp = options.shouldForwardProp;
+
+  if (isTargetStyledComp && target.shouldForwardProp) {
+    if (options.shouldForwardProp) {
+      // compose nested shouldForwardProp calls
+      shouldForwardProp = (prop, filterFn, elementToBeCreated) =>
+        ((((target: any): IStyledComponent).shouldForwardProp: any): ShouldForwardProp)(
+          prop,
+          filterFn,
+          elementToBeCreated
+        ) &&
+        ((options.shouldForwardProp: any): ShouldForwardProp)(prop, filterFn, elementToBeCreated);
+    } else {
+      // eslint-disable-next-line prefer-destructuring
+      shouldForwardProp = ((target: any): IStyledComponent).shouldForwardProp;
+    }
+  }
+
+  const componentStyle = new ComponentStyle(
+    rules,
+    styledComponentId,
+    isTargetStyledComp ? ((target: Object).componentStyle: ComponentStyle) : undefined
+  );
+
+  // statically styled-components don't need to build an execution context object,
+  // and shouldn't be increasing the number of class names
+  const isStatic = componentStyle.isStatic && attrs.length === 0;
+
+  /**
+   * forwardRef creates a new interim component, which we'll take advantage of
+   * instead of extending ParentComponent to create _another_ interim class
+   */
+  let WrappedStyledComponent: IStyledComponent;
+
+  const forwardRef = (props, ref) =>
+    // eslint-disable-next-line
+    useStyledComponentImpl(WrappedStyledComponent, props, ref, isStatic);
+
+  forwardRef.displayName = displayName;
+
+  WrappedStyledComponent = ((React.forwardRef(forwardRef): any): IStyledComponent);
+  WrappedStyledComponent.attrs = finalAttrs;
+  WrappedStyledComponent.componentStyle = componentStyle;
+  WrappedStyledComponent.displayName = displayName;
+  WrappedStyledComponent.shouldForwardProp = shouldForwardProp;
+
+  // this static is used to preserve the cascade of static classes for component selector
+  // purposes; this is especially important with usage of the css prop
+  WrappedStyledComponent.foldedComponentIds = isTargetStyledComp
+    ? Array.prototype.concat(
+        ((target: any): IStyledComponent).foldedComponentIds,
+        ((target: any): IStyledComponent).styledComponentId
+      )
+    : EMPTY_ARRAY;
+
+  WrappedStyledComponent.styledComponentId = styledComponentId;
+
+  // fold the underlying StyledComponent target up since we folded the styles
+  WrappedStyledComponent.target = isTargetStyledComp
+    ? ((target: any): IStyledComponent).target
+    : target;
+
+  WrappedStyledComponent.withComponent = function withComponent(tag: Target) {
+    const { componentId: previousComponentId, ...optionsToCopy } = options;
+
+    const newComponentId =
+      previousComponentId &&
+      `${previousComponentId}-${isTag(tag) ? tag : escape(getComponentName(tag))}`;
+
+    const newOptions = {
+      ...optionsToCopy,
+      attrs: finalAttrs,
+      componentId: newComponentId,
+    };
+
+    return createStyledComponent(tag, newOptions, rules);
+  };
+
+  Object.defineProperty(WrappedStyledComponent, 'defaultProps', {
+    get() {
+      return this._foldedDefaultProps;
+    },
+
+    set(obj) {
+      this._foldedDefaultProps = isTargetStyledComp
+        ? merge({}, ((target: any): IStyledComponent).defaultProps, obj)
+        : obj;
+    },
+  });
+
+  if (process.env.NODE_ENV !== 'production') {
+    checkDynamicCreation(displayName, styledComponentId);
+
+    WrappedStyledComponent.warnTooManyClasses = createWarnTooManyClasses(
+      displayName,
+      styledComponentId
+    );
+  }
+
+  // If the Object prototype is frozen, the "toString" property is non-writable. This means that any objects which inherit this property
+  // cannot have the property changed using an assignment. If using strict mode, attempting that will cause an error. If not using strict
+  // mode, attempting that will be silently ignored.
+  // However, we can still explicitly shadow the prototype's "toString" property by defining a new "toString" property on this object.
+  Object.defineProperty(WrappedStyledComponent, 'toString', { value: () => `.${WrappedStyledComponent.styledComponentId}` });
+
+  if (isCompositeComponent) {
+    hoist<
+      IStyledStatics,
+      $PropertyType<IStyledComponent, 'target'>,
+      { [key: $Keys<IStyledStatics>]: true }
+    >(WrappedStyledComponent, ((target: any): $PropertyType<IStyledComponent, 'target'>), {
+      // all SC-specific things should not be hoisted
+      attrs: true,
+      componentStyle: true,
+      displayName: true,
+      foldedComponentIds: true,
+      shouldForwardProp: true,
+      styledComponentId: true,
+      target: true,
+      withComponent: true,
+    });
+  }
+
+  return WrappedStyledComponent;
+}
diff --git a/ddb_main/node_modules/styled-components/src/models/ThemeProvider.js b/ddb_main/node_modules/styled-components/src/models/ThemeProvider.js
new file mode 100644
index 0000000..7f7d2e3
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/models/ThemeProvider.js
@@ -0,0 +1,59 @@
+// @flow
+import React, { useContext, useMemo, type Element, type Context } from 'react';
+import throwStyledError from '../utils/error';
+import isFunction from '../utils/isFunction';
+
+export type Theme = { [key: string]: mixed };
+
+type ThemeArgument = Theme | ((outerTheme?: Theme) => Theme);
+
+type Props = {
+  children?: Element<any>,
+  theme: ThemeArgument,
+};
+
+export const ThemeContext: Context<Theme | void> = React.createContext();
+
+export const ThemeConsumer = ThemeContext.Consumer;
+
+function mergeTheme(theme: ThemeArgument, outerTheme?: Theme): Theme {
+  if (!theme) {
+    return throwStyledError(14);
+  }
+
+  if (isFunction(theme)) {
+    const mergedTheme = theme(outerTheme);
+
+    if (
+      process.env.NODE_ENV !== 'production' &&
+      (mergedTheme === null || Array.isArray(mergedTheme) || typeof mergedTheme !== 'object')
+    ) {
+      return throwStyledError(7);
+    }
+
+    return mergedTheme;
+  }
+
+  if (Array.isArray(theme) || typeof theme !== 'object') {
+    return throwStyledError(8);
+  }
+
+  return outerTheme ? { ...outerTheme, ...theme } : theme;
+}
+
+/**
+ * Provide a theme to an entire react component tree via context
+ */
+export default function ThemeProvider(props: Props) {
+  const outerTheme = useContext(ThemeContext);
+  const themeContext = useMemo(() => mergeTheme(props.theme, outerTheme), [
+    props.theme,
+    outerTheme,
+  ]);
+
+  if (!props.children) {
+    return null;
+  }
+
+  return <ThemeContext.Provider value={themeContext}>{props.children}</ThemeContext.Provider>;
+}
diff --git a/ddb_main/node_modules/styled-components/src/sheet/GroupIDAllocator.js b/ddb_main/node_modules/styled-components/src/sheet/GroupIDAllocator.js
new file mode 100644
index 0000000..34bf2a7
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/sheet/GroupIDAllocator.js
@@ -0,0 +1,51 @@
+// @flow
+
+import throwStyledError from '../utils/error';
+
+const MAX_SMI = 1 << 31 - 1;
+
+let groupIDRegister: Map<string, number> = new Map();
+let reverseRegister: Map<number, string> = new Map();
+let nextFreeGroup = 1;
+
+export const resetGroupIds = () => {
+  groupIDRegister = new Map();
+  reverseRegister = new Map();
+  nextFreeGroup = 1;
+};
+
+export const getGroupForId = (id: string): number => {
+  if (groupIDRegister.has(id)) {
+    return (groupIDRegister.get(id): any);
+  }
+
+  while (reverseRegister.has(nextFreeGroup)) {
+    nextFreeGroup++;
+  }
+
+  const group = nextFreeGroup++;
+
+  if (
+    process.env.NODE_ENV !== 'production' &&
+    ((group | 0) < 0 || group > MAX_SMI)
+  ) {
+    throwStyledError(16, `${group}`);
+  }
+
+  groupIDRegister.set(id, group);
+  reverseRegister.set(group, id);
+  return group;
+};
+
+export const getIdForGroup = (group: number): void | string => {
+  return reverseRegister.get(group);
+};
+
+export const setGroupForId = (id: string, group: number) => {
+  if (group >= nextFreeGroup) {
+    nextFreeGroup = group + 1;
+  }
+
+  groupIDRegister.set(id, group);
+  reverseRegister.set(group, id);
+};
diff --git a/ddb_main/node_modules/styled-components/src/sheet/GroupedTag.js b/ddb_main/node_modules/styled-components/src/sheet/GroupedTag.js
new file mode 100644
index 0000000..55543bf
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/sheet/GroupedTag.js
@@ -0,0 +1,98 @@
+// @flow
+/* eslint-disable no-use-before-define */
+
+import type { GroupedTag, Tag } from './types';
+import { SPLITTER } from '../constants';
+import throwStyledError from '../utils/error';
+
+/** Create a GroupedTag with an underlying Tag implementation */
+export const makeGroupedTag = (tag: Tag): GroupedTag => {
+  return new DefaultGroupedTag(tag);
+};
+
+const BASE_SIZE = 1 << 9;
+
+class DefaultGroupedTag implements GroupedTag {
+  groupSizes: Uint32Array;
+
+  length: number;
+
+  tag: Tag;
+
+  constructor(tag: Tag) {
+    this.groupSizes = new Uint32Array(BASE_SIZE);
+    this.length = BASE_SIZE;
+    this.tag = tag;
+  }
+
+  indexOfGroup(group: number): number {
+    let index = 0;
+    for (let i = 0; i < group; i++) {
+      index += this.groupSizes[i];
+    }
+
+    return index;
+  }
+
+  insertRules(group: number, rules: string[]): void {
+    if (group >= this.groupSizes.length) {
+      const oldBuffer = this.groupSizes;
+      const oldSize = oldBuffer.length;
+
+      let newSize = oldSize;
+      while (group >= newSize) {
+        newSize <<= 1;
+        if (newSize < 0) {
+          throwStyledError(16, `${group}`);
+        }
+      }
+
+      this.groupSizes = new Uint32Array(newSize);
+      this.groupSizes.set(oldBuffer);
+      this.length = newSize;
+
+      for (let i = oldSize; i < newSize; i++) {
+        this.groupSizes[i] = 0;
+      }
+    }
+
+    let ruleIndex = this.indexOfGroup(group + 1);
+    for (let i = 0, l = rules.length; i < l; i++) {
+      if (this.tag.insertRule(ruleIndex, rules[i])) {
+        this.groupSizes[group]++;
+        ruleIndex++;
+      }
+    }
+  }
+
+  clearGroup(group: number): void {
+    if (group < this.length) {
+      const length = this.groupSizes[group];
+      const startIndex = this.indexOfGroup(group);
+      const endIndex = startIndex + length;
+
+      this.groupSizes[group] = 0;
+
+      for (let i = startIndex; i < endIndex; i++) {
+        this.tag.deleteRule(startIndex);
+      }
+    }
+  }
+
+  getGroup(group: number): string {
+    let css = '';
+    if (group >= this.length || this.groupSizes[group] === 0) {
+      return css;
+    }
+
+    const length = this.groupSizes[group];
+    const startIndex = this.indexOfGroup(group);
+    const endIndex = startIndex + length;
+
+    for (let i = startIndex; i < endIndex; i++) {
+      css += `${this.tag.getRule(i)}${SPLITTER}`;
+    }
+
+    return css;
+  }
+}
diff --git a/ddb_main/node_modules/styled-components/src/sheet/Rehydration.js b/ddb_main/node_modules/styled-components/src/sheet/Rehydration.js
new file mode 100644
index 0000000..162d8ba
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/sheet/Rehydration.js
@@ -0,0 +1,97 @@
+// @flow
+
+import { SPLITTER, SC_ATTR, SC_ATTR_ACTIVE, SC_ATTR_VERSION, SC_VERSION } from '../constants';
+import { getIdForGroup, setGroupForId } from './GroupIDAllocator';
+import type { Sheet } from './types';
+
+const SELECTOR = `style[${SC_ATTR}][${SC_ATTR_VERSION}="${SC_VERSION}"]`;
+const MARKER_RE = new RegExp(`^${SC_ATTR}\\.g(\\d+)\\[id="([\\w\\d-]+)"\\].*?"([^"]*)`);
+
+export const outputSheet = (sheet: Sheet) => {
+  const tag = sheet.getTag();
+  const { length } = tag;
+
+  let css = '';
+  for (let group = 0; group < length; group++) {
+    const id = getIdForGroup(group);
+    if (id === undefined) continue;
+
+    const names = sheet.names.get(id);
+    const rules = tag.getGroup(group);
+    if (!names || !rules || !names.size) continue;
+
+    const selector = `${SC_ATTR}.g${group}[id="${id}"]`;
+
+    let content = '';
+    if (names !== undefined) {
+      names.forEach(name => {
+        if (name.length > 0) {
+          content += `${name},`;
+        }
+      });
+    }
+
+    // NOTE: It's easier to collect rules and have the marker
+    // after the actual rules to simplify the rehydration
+    css += `${rules}${selector}{content:"${content}"}${SPLITTER}`;
+  }
+
+  return css;
+};
+
+const rehydrateNamesFromContent = (sheet: Sheet, id: string, content: string) => {
+  const names = content.split(',');
+  let name;
+
+  for (let i = 0, l = names.length; i < l; i++) {
+    // eslint-disable-next-line
+    if ((name = names[i])) {
+      sheet.registerName(id, name);
+    }
+  }
+};
+
+const rehydrateSheetFromTag = (sheet: Sheet, style: HTMLStyleElement) => {
+  const parts = (style.textContent || '').split(SPLITTER);
+  const rules: string[] = [];
+
+  for (let i = 0, l = parts.length; i < l; i++) {
+    const part = parts[i].trim();
+    if (!part) continue;
+
+    const marker = part.match(MARKER_RE);
+
+    if (marker) {
+      const group = parseInt(marker[1], 10) | 0;
+      const id = marker[2];
+
+      if (group !== 0) {
+        // Rehydrate componentId to group index mapping
+        setGroupForId(id, group);
+        // Rehydrate names and rules
+        // looks like: data-styled.g11[id="idA"]{content:"nameA,"}
+        rehydrateNamesFromContent(sheet, id, marker[3]);
+        sheet.getTag().insertRules(group, rules);
+      }
+
+      rules.length = 0;
+    } else {
+      rules.push(part);
+    }
+  }
+};
+
+export const rehydrateSheet = (sheet: Sheet) => {
+  const nodes = document.querySelectorAll(SELECTOR);
+
+  for (let i = 0, l = nodes.length; i < l; i++) {
+    const node = ((nodes[i]: any): HTMLStyleElement);
+    if (node && node.getAttribute(SC_ATTR) !== SC_ATTR_ACTIVE) {
+      rehydrateSheetFromTag(sheet, node);
+
+      if (node.parentNode) {
+        node.parentNode.removeChild(node);
+      }
+    }
+  }
+};
diff --git a/ddb_main/node_modules/styled-components/src/sheet/Sheet.js b/ddb_main/node_modules/styled-components/src/sheet/Sheet.js
new file mode 100644
index 0000000..c7807aa
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/sheet/Sheet.js
@@ -0,0 +1,129 @@
+// @flow
+import { DISABLE_SPEEDY, IS_BROWSER } from '../constants';
+import { EMPTY_OBJECT } from '../utils/empties';
+import { makeGroupedTag } from './GroupedTag';
+import { getGroupForId } from './GroupIDAllocator';
+import { outputSheet, rehydrateSheet } from './Rehydration';
+import { makeTag } from './Tag';
+import type { GroupedTag, Sheet, SheetOptions } from './types';
+
+let SHOULD_REHYDRATE = IS_BROWSER;
+
+type SheetConstructorArgs = {
+  isServer?: boolean,
+  useCSSOMInjection?: boolean,
+  target?: HTMLElement,
+};
+
+type GlobalStylesAllocationMap = { [key: string]: number };
+type NamesAllocationMap = Map<string, Set<string>>;
+
+const defaultOptions: SheetOptions = {
+  isServer: !IS_BROWSER,
+  useCSSOMInjection: !DISABLE_SPEEDY,
+};
+
+/** Contains the main stylesheet logic for stringification and caching */
+export default class StyleSheet implements Sheet {
+  gs: GlobalStylesAllocationMap;
+
+  names: NamesAllocationMap;
+
+  options: SheetOptions;
+
+  server: boolean;
+
+  tag: void | GroupedTag;
+
+  /** Register a group ID to give it an index */
+  static registerId(id: string): number {
+    return getGroupForId(id);
+  }
+
+  constructor(
+    options: SheetConstructorArgs = EMPTY_OBJECT,
+    globalStyles?: GlobalStylesAllocationMap = {},
+    names?: NamesAllocationMap
+  ) {
+    this.options = {
+      ...defaultOptions,
+      ...options,
+    };
+
+    this.gs = globalStyles;
+    this.names = new Map(names);
+    this.server = !!options.isServer;
+
+    // We rehydrate only once and use the sheet that is created first
+    if (!this.server && IS_BROWSER && SHOULD_REHYDRATE) {
+      SHOULD_REHYDRATE = false;
+      rehydrateSheet(this);
+    }
+  }
+
+  reconstructWithOptions(options: SheetConstructorArgs, withNames?: boolean = true) {
+    return new StyleSheet(
+      { ...this.options, ...options },
+      this.gs,
+      (withNames && this.names) || undefined
+    );
+  }
+
+  allocateGSInstance(id: string) {
+    return (this.gs[id] = (this.gs[id] || 0) + 1);
+  }
+
+  /** Lazily initialises a GroupedTag for when it's actually needed */
+  getTag(): GroupedTag {
+    return this.tag || (this.tag = makeGroupedTag(makeTag(this.options)));
+  }
+
+  /** Check whether a name is known for caching */
+  hasNameForId(id: string, name: string): boolean {
+    return this.names.has(id) && (this.names.get(id): any).has(name);
+  }
+
+  /** Mark a group's name as known for caching */
+  registerName(id: string, name: string) {
+    getGroupForId(id);
+
+    if (!this.names.has(id)) {
+      const groupNames = new Set();
+      groupNames.add(name);
+      this.names.set(id, groupNames);
+    } else {
+      (this.names.get(id): any).add(name);
+    }
+  }
+
+  /** Insert new rules which also marks the name as known */
+  insertRules(id: string, name: string, rules: string[]) {
+    this.registerName(id, name);
+    this.getTag().insertRules(getGroupForId(id), rules);
+  }
+
+  /** Clears all cached names for a given group ID */
+  clearNames(id: string) {
+    if (this.names.has(id)) {
+      (this.names.get(id): any).clear();
+    }
+  }
+
+  /** Clears all rules for a given group ID */
+  clearRules(id: string) {
+    this.getTag().clearGroup(getGroupForId(id));
+    this.clearNames(id);
+  }
+
+  /** Clears the entire tag which deletes all rules but not its names */
+  clearTag() {
+    // NOTE: This does not clear the names, since it's only used during SSR
+    // so that we can continuously output only new rules
+    this.tag = undefined;
+  }
+
+  /** Outputs the current sheet as a CSS string with markers for SSR */
+  toString(): string {
+    return outputSheet(this);
+  }
+}
diff --git a/ddb_main/node_modules/styled-components/src/sheet/Tag.js b/ddb_main/node_modules/styled-components/src/sheet/Tag.js
new file mode 100644
index 0000000..c89bdce
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/sheet/Tag.js
@@ -0,0 +1,134 @@
+// @flow
+/* eslint-disable no-use-before-define */
+
+import { makeStyleTag, getSheet } from './dom';
+import type { SheetOptions, Tag } from './types';
+
+/** Create a CSSStyleSheet-like tag depending on the environment */
+export const makeTag = ({ isServer, useCSSOMInjection, target }: SheetOptions): Tag => {
+  if (isServer) {
+    return new VirtualTag(target);
+  } else if (useCSSOMInjection) {
+    return new CSSOMTag(target);
+  } else {
+    return new TextTag(target);
+  }
+};
+
+export class CSSOMTag implements Tag {
+  element: HTMLStyleElement;
+
+  sheet: CSSStyleSheet;
+
+  length: number;
+
+  constructor(target?: HTMLElement) {
+    const element = (this.element = makeStyleTag(target));
+
+    // Avoid Edge bug where empty style elements don't create sheets
+    element.appendChild(document.createTextNode(''));
+
+    this.sheet = getSheet(element);
+    this.length = 0;
+  }
+
+  insertRule(index: number, rule: string): boolean {
+    try {
+      this.sheet.insertRule(rule, index);
+      this.length++;
+      return true;
+    } catch (_error) {
+      return false;
+    }
+  }
+
+  deleteRule(index: number): void {
+    this.sheet.deleteRule(index);
+    this.length--;
+  }
+
+  getRule(index: number): string {
+    const rule = this.sheet.cssRules[index];
+    // Avoid IE11 quirk where cssText is inaccessible on some invalid rules
+    if (rule !== undefined && typeof rule.cssText === 'string') {
+      return rule.cssText;
+    } else {
+      return '';
+    }
+  }
+}
+
+/** A Tag that emulates the CSSStyleSheet API but uses text nodes */
+export class TextTag implements Tag {
+  element: HTMLStyleElement;
+
+  nodes: NodeList<Node>;
+
+  length: number;
+
+  constructor(target?: HTMLElement) {
+    const element = (this.element = makeStyleTag(target));
+    this.nodes = element.childNodes;
+    this.length = 0;
+  }
+
+  insertRule(index: number, rule: string): boolean {
+    if (index <= this.length && index >= 0) {
+      const node = document.createTextNode(rule);
+      const refNode = this.nodes[index];
+      this.element.insertBefore(node, refNode || null);
+      this.length++;
+      return true;
+    } else {
+      return false;
+    }
+  }
+
+  deleteRule(index: number): void {
+    this.element.removeChild(this.nodes[index]);
+    this.length--;
+  }
+
+  getRule(index: number): string {
+    if (index < this.length) {
+      return this.nodes[index].textContent;
+    } else {
+      return '';
+    }
+  }
+}
+
+/** A completely virtual (server-side) Tag that doesn't manipulate the DOM */
+export class VirtualTag implements Tag {
+  rules: string[];
+
+  length: number;
+
+  constructor(_target?: HTMLElement) {
+    this.rules = [];
+    this.length = 0;
+  }
+
+  insertRule(index: number, rule: string): boolean {
+    if (index <= this.length) {
+      this.rules.splice(index, 0, rule);
+      this.length++;
+      return true;
+    } else {
+      return false;
+    }
+  }
+
+  deleteRule(index: number): void {
+    this.rules.splice(index, 1);
+    this.length--;
+  }
+
+  getRule(index: number): string {
+    if (index < this.length) {
+      return this.rules[index];
+    } else {
+      return '';
+    }
+  }
+}
diff --git a/ddb_main/node_modules/styled-components/src/sheet/dom.js b/ddb_main/node_modules/styled-components/src/sheet/dom.js
new file mode 100644
index 0000000..70154bc
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/sheet/dom.js
@@ -0,0 +1,60 @@
+// @flow
+
+import { SC_ATTR, SC_ATTR_ACTIVE, SC_ATTR_VERSION, SC_VERSION } from '../constants';
+import getNonce from '../utils/nonce';
+import throwStyledError from '../utils/error';
+
+const ELEMENT_TYPE = 1; /* Node.ELEMENT_TYPE */
+
+/** Find last style element if any inside target */
+const findLastStyleTag = (target: HTMLElement): void | HTMLStyleElement => {
+  const { childNodes } = target;
+
+  for (let i = childNodes.length; i >= 0; i--) {
+    const child = ((childNodes[i]: any): ?HTMLElement);
+    if (child && child.nodeType === ELEMENT_TYPE && child.hasAttribute(SC_ATTR)) {
+      return ((child: any): HTMLStyleElement);
+    }
+  }
+
+  return undefined;
+};
+
+/** Create a style element inside `target` or <head> after the last */
+export const makeStyleTag = (target?: HTMLElement): HTMLStyleElement => {
+  const head = ((document.head: any): HTMLElement);
+  const parent = target || head;
+  const style = document.createElement('style');
+  const prevStyle = findLastStyleTag(parent);
+  const nextSibling = prevStyle !== undefined ? prevStyle.nextSibling : null;
+
+  style.setAttribute(SC_ATTR, SC_ATTR_ACTIVE);
+  style.setAttribute(SC_ATTR_VERSION, SC_VERSION);
+
+  const nonce = getNonce();
+
+  if (nonce) style.setAttribute('nonce', nonce);
+
+  parent.insertBefore(style, nextSibling);
+
+  return style;
+};
+
+/** Get the CSSStyleSheet instance for a given style element */
+export const getSheet = (tag: HTMLStyleElement): CSSStyleSheet => {
+  if (tag.sheet) {
+    return ((tag.sheet: any): CSSStyleSheet);
+  }
+
+  // Avoid Firefox quirk where the style element might not have a sheet property
+  const { styleSheets } = document;
+  for (let i = 0, l = styleSheets.length; i < l; i++) {
+    const sheet = styleSheets[i];
+    if (sheet.ownerNode === tag) {
+      return ((sheet: any): CSSStyleSheet);
+    }
+  }
+
+  throwStyledError(17);
+  return (undefined: any);
+};
diff --git a/ddb_main/node_modules/styled-components/src/utils/addUnitIfNeeded.js b/ddb_main/node_modules/styled-components/src/utils/addUnitIfNeeded.js
new file mode 100644
index 0000000..882092f
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/addUnitIfNeeded.js
@@ -0,0 +1,17 @@
+// @flow
+import unitless from '@emotion/unitless';
+
+// Taken from https://github.com/facebook/react/blob/b87aabdfe1b7461e7331abb3601d9e6bb27544bc/packages/react-dom/src/shared/dangerousStyleValue.js
+export default function addUnitIfNeeded(name: string, value: any): any {
+  // https://github.com/amilajack/eslint-plugin-flowtype-errors/issues/133
+  // $FlowFixMe
+  if (value == null || typeof value === 'boolean' || value === '') {
+    return '';
+  }
+
+  if (typeof value === 'number' && value !== 0 && !(name in unitless) && !name.startsWith('--')) {
+    return `${value}px`; // Presumes implicit 'px' suffix for unitless numbers except for CSS variables
+  }
+
+  return String(value).trim();
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/checkDynamicCreation.js b/ddb_main/node_modules/styled-components/src/utils/checkDynamicCreation.js
new file mode 100644
index 0000000..d255b1e
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/checkDynamicCreation.js
@@ -0,0 +1,57 @@
+// @flow
+
+import { useRef } from 'react';
+
+const invalidHookCallRe = /invalid hook call/i;
+const seen = new Set();
+
+export const checkDynamicCreation = (displayName: string, componentId?: string) => {
+  if (process.env.NODE_ENV !== 'production') {
+    const parsedIdString = componentId ? ` with the id of "${componentId}"` : '';
+    const message =
+      `The component ${displayName}${parsedIdString} has been created dynamically.\n` +
+      "You may see this warning because you've called styled inside another component.\n" +
+      'To resolve this only create new StyledComponents outside of any render method and function component.';
+
+    // If a hook is called outside of a component:
+    // React 17 and earlier throw an error
+    // React 18 and above use console.error
+
+    const originalConsoleError = console.error // eslint-disable-line no-console
+    try {
+      let didNotCallInvalidHook = true
+      /* $FlowIgnore[cannot-write] */
+      console.error = (consoleErrorMessage, ...consoleErrorArgs) => { // eslint-disable-line no-console
+      // The error here is expected, since we're expecting anything that uses `checkDynamicCreation` to
+      // be called outside of a React component.
+        if (invalidHookCallRe.test(consoleErrorMessage)) {
+          didNotCallInvalidHook = false
+          // This shouldn't happen, but resets `warningSeen` if we had this error happen intermittently
+          seen.delete(message);
+        } else {
+          originalConsoleError(consoleErrorMessage, ...consoleErrorArgs);
+        }
+      }
+      // We purposefully call `useRef` outside of a component and expect it to throw
+      // If it doesn't, then we're inside another component.
+      // eslint-disable-next-line react-hooks/rules-of-hooks
+      useRef();
+
+      if (didNotCallInvalidHook && !seen.has(message)) {
+        // eslint-disable-next-line no-console
+        console.warn(message);
+        seen.add(message);
+      }
+    } catch (error) {
+      // The error here is expected, since we're expecting anything that uses `checkDynamicCreation` to
+      // be called outside of a React component.
+      if (invalidHookCallRe.test(error.message)) {
+        // This shouldn't happen, but resets `warningSeen` if we had this error happen intermittently
+        seen.delete(message);
+      }
+    } finally {
+      /* $FlowIgnore[cannot-write] */
+      console.error = originalConsoleError; // eslint-disable-line no-console
+    }
+  }
+};
diff --git a/ddb_main/node_modules/styled-components/src/utils/determineTheme.js b/ddb_main/node_modules/styled-components/src/utils/determineTheme.js
new file mode 100644
index 0000000..5d242cf
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/determineTheme.js
@@ -0,0 +1,10 @@
+// @flow
+import { EMPTY_OBJECT } from './empties';
+
+type Props = {
+  theme?: any,
+};
+
+export default (props: Props, providedTheme: any, defaultProps: any = EMPTY_OBJECT) => {
+  return (props.theme !== defaultProps.theme && props.theme) || providedTheme || defaultProps.theme;
+};
diff --git a/ddb_main/node_modules/styled-components/src/utils/domElements.js b/ddb_main/node_modules/styled-components/src/utils/domElements.js
new file mode 100644
index 0000000..e70be4a
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/domElements.js
@@ -0,0 +1,143 @@
+// @flow
+// Thanks to ReactDOMFactories for this handy list!
+
+export default [
+  'a',
+  'abbr',
+  'address',
+  'area',
+  'article',
+  'aside',
+  'audio',
+  'b',
+  'base',
+  'bdi',
+  'bdo',
+  'big',
+  'blockquote',
+  'body',
+  'br',
+  'button',
+  'canvas',
+  'caption',
+  'cite',
+  'code',
+  'col',
+  'colgroup',
+  'data',
+  'datalist',
+  'dd',
+  'del',
+  'details',
+  'dfn',
+  'dialog',
+  'div',
+  'dl',
+  'dt',
+  'em',
+  'embed',
+  'fieldset',
+  'figcaption',
+  'figure',
+  'footer',
+  'form',
+  'h1',
+  'h2',
+  'h3',
+  'h4',
+  'h5',
+  'h6',
+  'head',
+  'header',
+  'hgroup',
+  'hr',
+  'html',
+  'i',
+  'iframe',
+  'img',
+  'input',
+  'ins',
+  'kbd',
+  'keygen',
+  'label',
+  'legend',
+  'li',
+  'link',
+  'main',
+  'map',
+  'mark',
+  'marquee',
+  'menu',
+  'menuitem',
+  'meta',
+  'meter',
+  'nav',
+  'noscript',
+  'object',
+  'ol',
+  'optgroup',
+  'option',
+  'output',
+  'p',
+  'param',
+  'picture',
+  'pre',
+  'progress',
+  'q',
+  'rp',
+  'rt',
+  'ruby',
+  's',
+  'samp',
+  'script',
+  'section',
+  'select',
+  'small',
+  'source',
+  'span',
+  'strong',
+  'style',
+  'sub',
+  'summary',
+  'sup',
+  'table',
+  'tbody',
+  'td',
+  'textarea',
+  'tfoot',
+  'th',
+  'thead',
+  'time',
+  'title',
+  'tr',
+  'track',
+  'u',
+  'ul',
+  'var',
+  'video',
+  'wbr',
+
+  // SVG
+  'circle',
+  'clipPath',
+  'defs',
+  'ellipse',
+  'foreignObject',
+  'g',
+  'image',
+  'line',
+  'linearGradient',
+  'marker',
+  'mask',
+  'path',
+  'pattern',
+  'polygon',
+  'polyline',
+  'radialGradient',
+  'rect',
+  'stop',
+  'svg',
+  'text',
+  'textPath',
+  'tspan',
+];
diff --git a/ddb_main/node_modules/styled-components/src/utils/empties.js b/ddb_main/node_modules/styled-components/src/utils/empties.js
new file mode 100644
index 0000000..d563004
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/empties.js
@@ -0,0 +1,3 @@
+// @flow
+export const EMPTY_ARRAY = Object.freeze([]);
+export const EMPTY_OBJECT = Object.freeze({});
diff --git a/ddb_main/node_modules/styled-components/src/utils/error.js b/ddb_main/node_modules/styled-components/src/utils/error.js
new file mode 100644
index 0000000..f8dcd78
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/error.js
@@ -0,0 +1,41 @@
+// @flow
+import errorMap from './errors';
+
+const ERRORS = process.env.NODE_ENV !== 'production' ? errorMap : {};
+
+/**
+ * super basic version of sprintf
+ */
+function format(...args) {
+  let a = args[0];
+  const b = [];
+
+  for (let c = 1, len = args.length; c < len; c += 1) {
+    b.push(args[c]);
+  }
+
+  b.forEach(d => {
+    a = a.replace(/%[a-z]/, d);
+  });
+
+  return a;
+}
+
+/**
+ * Create an error file out of errors.md for development and a simple web link to the full errors
+ * in production mode.
+ */
+export default function throwStyledComponentsError(
+  code: string | number,
+  ...interpolations: Array<any>
+) {
+  if (process.env.NODE_ENV === 'production') {
+    throw new Error(
+      `An error occurred. See https://git.io/JUIaE#${code} for more information.${
+        interpolations.length > 0 ? ` Args: ${interpolations.join(', ')}` : ''
+      }`
+    );
+  } else {
+    throw new Error(format(ERRORS[code], ...interpolations).trim());
+  }
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/escape.js b/ddb_main/node_modules/styled-components/src/utils/escape.js
new file mode 100644
index 0000000..36ce09b
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/escape.js
@@ -0,0 +1,22 @@
+// @flow
+
+// Source: https://www.w3.org/TR/cssom-1/#serialize-an-identifier
+// Control characters and non-letter first symbols are not supported
+const escapeRegex = /[!"#$%&'()*+,./:;<=>?@[\\\]^`{|}~-]+/g;
+
+const dashesAtEnds = /(^-|-$)/g;
+
+/**
+ * TODO: Explore using CSS.escape when it becomes more available
+ * in evergreen browsers.
+ */
+export default function escape(str: string): string {
+  return (
+    str
+      // Replace all possible CSS selectors
+      .replace(escapeRegex, '-')
+
+      // Remove extraneous hyphens at the start and end
+      .replace(dashesAtEnds, '')
+  );
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/flatten.js b/ddb_main/node_modules/styled-components/src/utils/flatten.js
new file mode 100644
index 0000000..479324c
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/flatten.js
@@ -0,0 +1,92 @@
+// @flow
+import { isElement } from 'react-is';
+import getComponentName from './getComponentName';
+import isFunction from './isFunction';
+import isStatelessFunction from './isStatelessFunction';
+import isPlainObject from './isPlainObject';
+import isStyledComponent from './isStyledComponent';
+import Keyframes from '../models/Keyframes';
+import hyphenate from './hyphenateStyleName';
+import addUnitIfNeeded from './addUnitIfNeeded';
+import { type Stringifier } from '../types';
+
+/**
+ * It's falsish not falsy because 0 is allowed.
+ */
+const isFalsish = chunk => chunk === undefined || chunk === null || chunk === false || chunk === '';
+
+export const objToCssArray = (obj: Object, prevKey?: string): Array<string | Function> => {
+  const rules = [];
+
+  for (const key in obj) {
+    if (!obj.hasOwnProperty(key) || isFalsish(obj[key])) continue;
+
+    if ((Array.isArray(obj[key]) && obj[key].isCss) || isFunction(obj[key])) {
+      rules.push(`${hyphenate(key)}:`, obj[key], ';');
+    } else if (isPlainObject(obj[key])) {
+      rules.push(...objToCssArray(obj[key], key));
+    } else {
+      rules.push(`${hyphenate(key)}: ${addUnitIfNeeded(key, obj[key])};`);
+    }
+  }
+
+  return prevKey ? [`${prevKey} {`, ...rules, '}'] : rules;
+};
+
+export default function flatten(
+  chunk: any,
+  executionContext: ?Object,
+  styleSheet: ?Object,
+  stylisInstance: ?Stringifier
+): any {
+  if (Array.isArray(chunk)) {
+    const ruleSet = [];
+
+    for (let i = 0, len = chunk.length, result; i < len; i += 1) {
+      result = flatten(chunk[i], executionContext, styleSheet, stylisInstance);
+
+      if (result === '') continue;
+      else if (Array.isArray(result)) ruleSet.push(...result);
+      else ruleSet.push(result);
+    }
+
+    return ruleSet;
+  }
+
+  if (isFalsish(chunk)) {
+    return '';
+  }
+
+  /* Handle other components */
+  if (isStyledComponent(chunk)) {
+    return `.${chunk.styledComponentId}`;
+  }
+
+  /* Either execute or defer the function */
+  if (isFunction(chunk)) {
+    if (isStatelessFunction(chunk) && executionContext) {
+      const result = chunk(executionContext);
+
+      if (process.env.NODE_ENV !== 'production' && isElement(result)) {
+        // eslint-disable-next-line no-console
+        console.warn(
+          `${getComponentName(
+            chunk
+          )} is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details.`
+        );
+      }
+
+      return flatten(result, executionContext, styleSheet, stylisInstance);
+    } else return chunk;
+  }
+
+  if (chunk instanceof Keyframes) {
+    if (styleSheet) {
+      chunk.inject(styleSheet, stylisInstance);
+      return chunk.getName(stylisInstance);
+    } else return chunk;
+  }
+
+  /* Handle objects */
+  return isPlainObject(chunk) ? objToCssArray(chunk) : chunk.toString();
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/generateAlphabeticName.js b/ddb_main/node_modules/styled-components/src/utils/generateAlphabeticName.js
new file mode 100644
index 0000000..1f63074
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/generateAlphabeticName.js
@@ -0,0 +1,25 @@
+// @flow
+/* eslint-disable no-bitwise */
+
+const AD_REPLACER_R = /(a)(d)/gi;
+
+/* This is the "capacity" of our alphabet i.e. 2x26 for all letters plus their capitalised
+ * counterparts */
+const charsLength = 52;
+
+/* start at 75 for 'a' until 'z' (25) and then start at 65 for capitalised letters */
+const getAlphabeticChar = (code: number): string =>
+  String.fromCharCode(code + (code > 25 ? 39 : 97));
+
+/* input a number, usually a hash and convert it to base-52 */
+export default function generateAlphabeticName(code: number): string {
+  let name = '';
+  let x;
+
+  /* get a char and divide by alphabet-length */
+  for (x = Math.abs(code); x > charsLength; x = (x / charsLength) | 0) {
+    name = getAlphabeticChar(x % charsLength) + name;
+  }
+
+  return (getAlphabeticChar(x % charsLength) + name).replace(AD_REPLACER_R, '$1-$2');
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/generateComponentId.js b/ddb_main/node_modules/styled-components/src/utils/generateComponentId.js
new file mode 100644
index 0000000..03f72ad
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/generateComponentId.js
@@ -0,0 +1,8 @@
+// @flow
+/* eslint-disable */
+import generateAlphabeticName from './generateAlphabeticName';
+import { hash } from './hash';
+
+export default (str: string): string => {
+  return generateAlphabeticName(hash(str) >>> 0);
+};
diff --git a/ddb_main/node_modules/styled-components/src/utils/generateDisplayName.js b/ddb_main/node_modules/styled-components/src/utils/generateDisplayName.js
new file mode 100644
index 0000000..62dfc17
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/generateDisplayName.js
@@ -0,0 +1,10 @@
+// @flow
+import type { IStyledComponent } from '../types';
+import getComponentName from './getComponentName';
+import isTag from './isTag';
+
+export default function generateDisplayName(
+  target: $PropertyType<IStyledComponent, 'target'>
+): string {
+  return isTag(target) ? `styled.${target}` : `Styled(${getComponentName(target)})`;
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/getComponentName.js b/ddb_main/node_modules/styled-components/src/utils/getComponentName.js
new file mode 100644
index 0000000..de64bde
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/getComponentName.js
@@ -0,0 +1,15 @@
+// @flow
+import type { IStyledComponent } from '../types';
+
+export default function getComponentName(
+  target: $PropertyType<IStyledComponent, 'target'>
+): string {
+  return (
+    (process.env.NODE_ENV !== 'production' ? typeof target === 'string' && target : false) ||
+    // $FlowFixMe
+    target.displayName ||
+    // $FlowFixMe
+    target.name ||
+    'Component'
+  );
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/hash.js b/ddb_main/node_modules/styled-components/src/utils/hash.js
new file mode 100644
index 0000000..bfce8c4
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/hash.js
@@ -0,0 +1,22 @@
+// @flow
+/* eslint-disable */
+
+export const SEED = 5381;
+
+// When we have separate strings it's useful to run a progressive
+// version of djb2 where we pretend that we're still looping over
+// the same string
+export const phash = (h: number, x: string): number => {
+  let i = x.length;
+
+  while (i) {
+    h = (h * 33) ^ x.charCodeAt(--i);
+  }
+
+  return h;
+};
+
+// This is a djb2 hashing function
+export const hash = (x: string): number => {
+  return phash(SEED, x);
+};
diff --git a/ddb_main/node_modules/styled-components/src/utils/hyphenateStyleName.js b/ddb_main/node_modules/styled-components/src/utils/hyphenateStyleName.js
new file mode 100644
index 0000000..3bfb840
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/hyphenateStyleName.js
@@ -0,0 +1,35 @@
+// @flow
+
+/**
+ * inlined version of
+ * https://github.com/facebook/fbjs/blob/master/packages/fbjs/src/core/hyphenateStyleName.js
+ */
+
+const uppercaseCheck = /([A-Z])/;
+const uppercasePattern = /([A-Z])/g;
+const msPattern = /^ms-/;
+const prefixAndLowerCase = (char: string): string => `-${char.toLowerCase()}`;
+
+/**
+ * Hyphenates a camelcased CSS property name, for example:
+ *
+ *   > hyphenateStyleName('backgroundColor')
+ *   < "background-color"
+ *   > hyphenateStyleName('MozTransition')
+ *   < "-moz-transition"
+ *   > hyphenateStyleName('msTransition')
+ *   < "-ms-transition"
+ *
+ * As Modernizr suggests (http://modernizr.com/docs/#prefixed), an `ms` prefix
+ * is converted to `-ms-`.
+ *
+ * @param {string} string
+ * @return {string}
+ */
+export default function hyphenateStyleName(string: string): string {
+  return uppercaseCheck.test(string)
+  ? string
+    .replace(uppercasePattern, prefixAndLowerCase)
+    .replace(msPattern, '-ms-')
+  : string;
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/interleave.js b/ddb_main/node_modules/styled-components/src/utils/interleave.js
new file mode 100644
index 0000000..2f5636d
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/interleave.js
@@ -0,0 +1,15 @@
+// @flow
+import type { Interpolation } from '../types';
+
+export default (
+  strings: Array<string>,
+  interpolations: Array<Interpolation>
+): Array<Interpolation> => {
+  const result = [strings[0]];
+
+  for (let i = 0, len = interpolations.length; i < len; i += 1) {
+    result.push(interpolations[i], strings[i + 1]);
+  }
+
+  return result;
+};
diff --git a/ddb_main/node_modules/styled-components/src/utils/isFunction.js b/ddb_main/node_modules/styled-components/src/utils/isFunction.js
new file mode 100644
index 0000000..8d969e1
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/isFunction.js
@@ -0,0 +1,4 @@
+// @flow
+export default function isFunction(test: any): boolean %checks {
+  return typeof test === 'function';
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/isPlainObject.js b/ddb_main/node_modules/styled-components/src/utils/isPlainObject.js
new file mode 100644
index 0000000..22a1187
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/isPlainObject.js
@@ -0,0 +1,8 @@
+// @flow
+import { typeOf } from 'react-is';
+
+export default (x: any): boolean =>
+  x !== null &&
+  typeof x === 'object' &&
+  (x.toString ? x.toString() : Object.prototype.toString.call(x)) === '[object Object]' &&
+  !typeOf(x);
diff --git a/ddb_main/node_modules/styled-components/src/utils/isStatelessFunction.js b/ddb_main/node_modules/styled-components/src/utils/isStatelessFunction.js
new file mode 100644
index 0000000..1e73bca
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/isStatelessFunction.js
@@ -0,0 +1,10 @@
+// @flow
+export default function isStatelessFunction(test: any): boolean {
+  return (
+    typeof test === 'function'
+    && !(
+      test.prototype
+      && test.prototype.isReactComponent
+    )
+  );
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/isStaticRules.js b/ddb_main/node_modules/styled-components/src/utils/isStaticRules.js
new file mode 100644
index 0000000..76e1b76
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/isStaticRules.js
@@ -0,0 +1,18 @@
+// @flow
+import isFunction from './isFunction';
+import isStyledComponent from './isStyledComponent';
+import type { RuleSet } from '../types';
+
+export default function isStaticRules(rules: RuleSet): boolean {
+  for (let i = 0; i < rules.length; i += 1) {
+    const rule = rules[i];
+
+    if (isFunction(rule) && !isStyledComponent(rule)) {
+      // functions are allowed to be static if they're just being
+      // used to get the classname of a nested styled component
+      return false;
+    }
+  }
+
+  return true;
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/isStyledComponent.js b/ddb_main/node_modules/styled-components/src/utils/isStyledComponent.js
new file mode 100644
index 0000000..935959e
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/isStyledComponent.js
@@ -0,0 +1,4 @@
+// @flow
+export default function isStyledComponent(target: any): boolean %checks {
+  return target && typeof target.styledComponentId === 'string';
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/isTag.js b/ddb_main/node_modules/styled-components/src/utils/isTag.js
new file mode 100644
index 0000000..458d464
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/isTag.js
@@ -0,0 +1,11 @@
+// @flow
+import type { IStyledComponent } from '../types';
+
+export default function isTag(target: $PropertyType<IStyledComponent, 'target'>): boolean %checks {
+  return (
+    typeof target === 'string' &&
+    (process.env.NODE_ENV !== 'production'
+      ? target.charAt(0) === target.charAt(0).toLowerCase()
+      : true)
+  );
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/joinStrings.js b/ddb_main/node_modules/styled-components/src/utils/joinStrings.js
new file mode 100644
index 0000000..ad6b6bc
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/joinStrings.js
@@ -0,0 +1,6 @@
+/**
+ * Convenience function for joining strings to form className chains
+ */
+export default function joinStrings(a: ?String, b: ?String): ?String {
+  return a && b ? `${a} ${b}` : a || b;
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/mixinDeep.js b/ddb_main/node_modules/styled-components/src/utils/mixinDeep.js
new file mode 100644
index 0000000..e4326ab
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/mixinDeep.js
@@ -0,0 +1,60 @@
+/* eslint-disable */
+/**
+  mixin-deep; https://github.com/jonschlinkert/mixin-deep
+  Inlined such that it will be consistently transpiled to an IE-compatible syntax.
+
+  The MIT License (MIT)
+
+  Copyright (c) 2014-present, Jon Schlinkert.
+
+  Permission is hereby granted, free of charge, to any person obtaining a copy
+  of this software and associated documentation files (the "Software"), to deal
+  in the Software without restriction, including without limitation the rights
+  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+  copies of the Software, and to permit persons to whom the Software is
+  furnished to do so, subject to the following conditions:
+
+  The above copyright notice and this permission notice shall be included in
+  all copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+  THE SOFTWARE.
+*/
+
+const isObject = val => {
+  return (
+    typeof val === 'function' || (typeof val === 'object' && val !== null && !Array.isArray(val))
+  );
+};
+
+const isValidKey = key => {
+  return key !== '__proto__' && key !== 'constructor' && key !== 'prototype';
+};
+
+function mixin(target, val, key) {
+  const obj = target[key];
+  if (isObject(val) && isObject(obj)) {
+    mixinDeep(obj, val);
+  } else {
+    target[key] = val;
+  }
+}
+
+export default function mixinDeep(target, ...rest) {
+  for (const obj of rest) {
+    if (isObject(obj)) {
+      for (const key in obj) {
+        if (isValidKey(key)) {
+          mixin(target, obj[key], key);
+        }
+      }
+    }
+  }
+
+  return target;
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/nonce.js b/ddb_main/node_modules/styled-components/src/utils/nonce.js
new file mode 100644
index 0000000..8dca66c
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/nonce.js
@@ -0,0 +1,10 @@
+// @flow
+/* eslint-disable camelcase, no-undef */
+
+declare var __webpack_nonce__: string;
+
+const getNonce = () => {
+  return typeof __webpack_nonce__ !== 'undefined' ? __webpack_nonce__ : null;
+};
+
+export default getNonce;
diff --git a/ddb_main/node_modules/styled-components/src/utils/stylis.js b/ddb_main/node_modules/styled-components/src/utils/stylis.js
new file mode 100644
index 0000000..a82d12f
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/stylis.js
@@ -0,0 +1,109 @@
+import Stylis from '@emotion/stylis';
+import { type Stringifier } from '../types';
+import { EMPTY_ARRAY, EMPTY_OBJECT } from './empties';
+import throwStyledError from './error';
+import { phash, SEED } from './hash';
+import insertRulePlugin from './stylisPluginInsertRule';
+
+const COMMENT_REGEX = /^\s*\/\/.*$/gm;
+const COMPLEX_SELECTOR_PREFIX = [':', '[', '.', '#'];
+
+type StylisInstanceConstructorArgs = {
+  options?: Object,
+  plugins?: Array<Function>,
+};
+
+export default function createStylisInstance({
+  options = EMPTY_OBJECT,
+  plugins = EMPTY_ARRAY,
+}: StylisInstanceConstructorArgs = EMPTY_OBJECT) {
+  const stylis = new Stylis(options);
+
+  // Wrap `insertRulePlugin to build a list of rules,
+  // and then make our own plugin to return the rules. This
+  // makes it easier to hook into the existing SSR architecture
+
+  let parsingRules = [];
+
+  // eslint-disable-next-line consistent-return
+  const returnRulesPlugin = context => {
+    if (context === -2) {
+      const parsedRules = parsingRules;
+      parsingRules = [];
+      return parsedRules;
+    }
+  };
+
+  const parseRulesPlugin = insertRulePlugin(rule => {
+    parsingRules.push(rule);
+  });
+
+  let _componentId: string;
+  let _selector: string;
+  let _selectorRegexp: RegExp;
+  let _consecutiveSelfRefRegExp: RegExp;
+
+  const selfReferenceReplacer = (match, offset, string) => {
+    if (
+      // do not replace the first occurrence if it is complex (has a modifier)
+      (offset === 0 ? COMPLEX_SELECTOR_PREFIX.indexOf(string[_selector.length]) === -1 : true) &&
+      // no consecutive self refs (.b.b); that is a precedence boost and treated differently
+      !string.match(_consecutiveSelfRefRegExp)
+    ) {
+      return `.${_componentId}`;
+    }
+
+    return match;
+  };
+
+  /**
+   * When writing a style like
+   *
+   * & + & {
+   *   color: red;
+   * }
+   *
+   * The second ampersand should be a reference to the static component class. stylis
+   * has no knowledge of static class so we have to intelligently replace the base selector.
+   *
+   * https://github.com/thysultan/stylis.js/tree/v3.5.4#plugins <- more info about the context phase values
+   * "2" means this plugin is taking effect at the very end after all other processing is complete
+   */
+  const selfReferenceReplacementPlugin = (context, _, selectors) => {
+    if (context === 2 && selectors.length && selectors[0].lastIndexOf(_selector) > 0) {
+      // eslint-disable-next-line no-param-reassign
+      selectors[0] = selectors[0].replace(_selectorRegexp, selfReferenceReplacer);
+    }
+  };
+
+  stylis.use([...plugins, selfReferenceReplacementPlugin, parseRulesPlugin, returnRulesPlugin]);
+
+  function stringifyRules(css, selector, prefix, componentId = '&'): Stringifier {
+    const flatCSS = css.replace(COMMENT_REGEX, '');
+    const cssStr = selector && prefix ? `${prefix} ${selector} { ${flatCSS} }` : flatCSS;
+
+    // stylis has no concept of state to be passed to plugins
+    // but since JS is single-threaded, we can rely on that to ensure
+    // these properties stay in sync with the current stylis run
+    _componentId = componentId;
+    _selector = selector;
+    _selectorRegexp = new RegExp(`\\${_selector}\\b`, 'g');
+    _consecutiveSelfRefRegExp = new RegExp(`(\\${_selector}\\b){2,}`);
+
+    return stylis(prefix || !selector ? '' : selector, cssStr);
+  }
+
+  stringifyRules.hash = plugins.length
+    ? plugins
+        .reduce((acc, plugin) => {
+          if (!plugin.name) {
+            throwStyledError(15);
+          }
+
+          return phash(acc, plugin.name);
+        }, SEED)
+        .toString()
+    : '';
+
+  return stringifyRules;
+}
diff --git a/ddb_main/node_modules/styled-components/src/utils/stylisPluginInsertRule.js b/ddb_main/node_modules/styled-components/src/utils/stylisPluginInsertRule.js
new file mode 100644
index 0000000..e522521
--- /dev/null
+++ b/ddb_main/node_modules/styled-components/src/utils/stylisPluginInsertRule.js
@@ -0,0 +1,71 @@
+/**
+ * MIT License
+ *
+ * Copyright (c) 2016 Sultan Tarimo
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of
+ * this software and associated documentation files (the "Software"),
+ * to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+ * sell copies of the Software and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
+ * OR IMPLIED INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+ * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR
+ * IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+/* eslint-disable */
+
+export default function(insertRule) {
+  const delimiter = '/*|*/';
+  const needle = `${delimiter}}`;
+
+  function toSheet(block) {
+    if (block) {
+      try {
+        insertRule(`${block}}`);
+      } catch (e) {}
+    }
+  }
+
+  return function ruleSheet(
+    context,
+    content,
+    selectors,
+    parents,
+    line,
+    column,
+    length,
+    ns,
+    depth,
+    at
+  ) {
+    switch (context) {
+      // property
+      case 1:
+        // @import
+        if (depth === 0 && content.charCodeAt(0) === 64) return insertRule(`${content};`), '';
+        break;
+      // selector
+      case 2:
+        if (ns === 0) return content + delimiter;
+        break;
+      // at-rule
+      case 3:
+        switch (ns) {
+          // @font-face, @page
+          case 102:
+          case 112:
+            return insertRule(selectors[0] + content), '';
+          default:
+            return content + (at === 0 ? delimiter : '');
+        }
+      case -2:
+        content.split(needle).forEach(toSheet);
+    }
+  };
+}
diff --git a/ddb_main/node_modules/stylis/src/Enum.js b/ddb_main/node_modules/stylis/src/Enum.js
new file mode 100644
index 0000000..5e2ec73
--- /dev/null
+++ b/ddb_main/node_modules/stylis/src/Enum.js
@@ -0,0 +1,22 @@
+export var MS = '-ms-'
+export var MOZ = '-moz-'
+export var WEBKIT = '-webkit-'
+
+export var COMMENT = 'comm'
+export var RULESET = 'rule'
+export var DECLARATION = 'decl'
+
+export var PAGE = '@page'
+export var MEDIA = '@media'
+export var IMPORT = '@import'
+export var CHARSET = '@charset'
+export var VIEWPORT = '@viewport'
+export var SUPPORTS = '@supports'
+export var DOCUMENT = '@document'
+export var NAMESPACE = '@namespace'
+export var KEYFRAMES = '@keyframes'
+export var FONT_FACE = '@font-face'
+export var COUNTER_STYLE = '@counter-style'
+export var FONT_FEATURE_VALUES = '@font-feature-values'
+export var LAYER = '@layer'
+export var SCOPE = '@scope'
diff --git a/ddb_main/node_modules/stylis/src/Middleware.js b/ddb_main/node_modules/stylis/src/Middleware.js
new file mode 100644
index 0000000..1d7df2c
--- /dev/null
+++ b/ddb_main/node_modules/stylis/src/Middleware.js
@@ -0,0 +1,112 @@
+import {MS, MOZ, WEBKIT, RULESET, KEYFRAMES, DECLARATION} from './Enum.js'
+import {match, charat, substr, strlen, sizeof, replace, combine, filter, assign} from './Utility.js'
+import {copy, lift, tokenize} from './Tokenizer.js'
+import {serialize} from './Serializer.js'
+import {prefix} from './Prefixer.js'
+
+/**
+ * @param {function[]} collection
+ * @return {function}
+ */
+export function middleware (collection) {
+	var length = sizeof(collection)
+
+	return function (element, index, children, callback) {
+		var output = ''
+
+		for (var i = 0; i < length; i++)
+			output += collection[i](element, index, children, callback) || ''
+
+		return output
+	}
+}
+
+/**
+ * @param {function} callback
+ * @return {function}
+ */
+export function rulesheet (callback) {
+	return function (element) {
+		if (!element.root)
+			if (element = element.return)
+				callback(element)
+	}
+}
+
+/**
+ * @param {object} element
+ * @param {number} index
+ * @param {object[]} children
+ * @param {function} callback
+ */
+export function prefixer (element, index, children, callback) {
+	if (element.length > -1)
+		if (!element.return)
+			switch (element.type) {
+				case DECLARATION: element.return = prefix(element.value, element.length, children)
+					return
+				case KEYFRAMES:
+					return serialize([copy(element, {value: replace(element.value, '@', '@' + WEBKIT)})], callback)
+				case RULESET:
+					if (element.length)
+						return combine(children = element.props, function (value) {
+							switch (match(value, callback = /(::plac\w+|:read-\w+)/)) {
+								// :read-(only|write)
+								case ':read-only': case ':read-write':
+									lift(copy(element, {props: [replace(value, /:(read-\w+)/, ':' + MOZ + '$1')]}))
+									lift(copy(element, {props: [value]}))
+									assign(element, {props: filter(children, callback)})
+									break
+								// :placeholder
+								case '::placeholder':
+									lift(copy(element, {props: [replace(value, /:(plac\w+)/, ':' + WEBKIT + 'input-$1')]}))
+									lift(copy(element, {props: [replace(value, /:(plac\w+)/, ':' + MOZ + '$1')]}))
+									lift(copy(element, {props: [replace(value, /:(plac\w+)/, MS + 'input-$1')]}))
+									lift(copy(element, {props: [value]}))
+									assign(element, {props: filter(children, callback)})
+									break
+							}
+
+							return ''
+						})
+			}
+}
+
+/**
+ * @param {object} element
+ * @param {number} index
+ * @param {object[]} children
+ */
+export function namespace (element) {
+	switch (element.type) {
+		case RULESET:
+			element.props = element.props.map(function (value) {
+				return combine(tokenize(value), function (value, index, children) {
+					switch (charat(value, 0)) {
+						// \f
+						case 12:
+							return substr(value, 1, strlen(value))
+						// \0 ( + > ~
+						case 0: case 40: case 43: case 62: case 126:
+							return value
+						// :
+						case 58:
+							if (children[++index] === 'global')
+								children[index] = '', children[++index] = '\f' + substr(children[index], index = 1, -1)
+						// \s
+						case 32:
+							return index === 1 ? '' : value
+						default:
+							switch (index) {
+								case 0: element = value
+									return sizeof(children) > 1 ? '' : value
+								case index = sizeof(children) - 1: case 2:
+									return index === 2 ? value + element + element : value + element
+								default:
+									return value
+							}
+					}
+				})
+			})
+	}
+}
diff --git a/ddb_main/node_modules/stylis/src/Prefixer.js b/ddb_main/node_modules/stylis/src/Prefixer.js
new file mode 100644
index 0000000..440ae75
--- /dev/null
+++ b/ddb_main/node_modules/stylis/src/Prefixer.js
@@ -0,0 +1,145 @@
+import {MS, MOZ, WEBKIT} from './Enum.js'
+import {hash, charat, strlen, indexof, replace, substr, match} from './Utility.js'
+
+/**
+ * @param {string} value
+ * @param {number} length
+ * @param {object[]} children
+ * @return {string}
+ */
+export function prefix (value, length, children) {
+	switch (hash(value, length)) {
+		// color-adjust
+		case 5103:
+			return WEBKIT + 'print-' + value + value
+		// animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)
+		case 5737: case 4201: case 3177: case 3433: case 1641: case 4457: case 2921:
+		// text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break
+		case 5572: case 6356: case 5844: case 3191: case 6645: case 3005:
+		// mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,
+		case 6391: case 5879: case 5623: case 6135: case 4599: case 4855:
+		// background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)
+		case 4215: case 6389: case 5109: case 5365: case 5621: case 3829:
+			return WEBKIT + value + value
+		// tab-size
+		case 4789:
+			return MOZ + value + value
+		// appearance, user-select, transform, hyphens, text-size-adjust
+		case 5349: case 4246: case 4810: case 6968: case 2756:
+			return WEBKIT + value + MOZ + value + MS + value + value
+		// writing-mode
+		case 5936:
+			switch (charat(value, length + 11)) {
+				// vertical-l(r)
+				case 114:
+					return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'tb') + value
+				// vertical-r(l)
+				case 108:
+					return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'tb-rl') + value
+				// horizontal(-)tb
+				case 45:
+					return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, 'lr') + value
+				// default: fallthrough to below
+			}
+		// flex, flex-direction, scroll-snap-type, writing-mode
+		case 6828: case 4268: case 2903:
+			return WEBKIT + value + MS + value + value
+		// order
+		case 6165:
+			return WEBKIT + value + MS + 'flex-' + value + value
+		// align-items
+		case 5187:
+			return WEBKIT + value + replace(value, /(\w+).+(:[^]+)/, WEBKIT + 'box-$1$2' + MS + 'flex-$1$2') + value
+		// align-self
+		case 5443:
+			return WEBKIT + value + MS + 'flex-item-' + replace(value, /flex-|-self/g, '') + (!match(value, /flex-|baseline/) ? MS + 'grid-row-' + replace(value, /flex-|-self/g, '') : '') + value
+		// align-content
+		case 4675:
+			return WEBKIT + value + MS + 'flex-line-pack' + replace(value, /align-content|flex-|-self/g, '') + value
+		// flex-shrink
+		case 5548:
+			return WEBKIT + value + MS + replace(value, 'shrink', 'negative') + value
+		// flex-basis
+		case 5292:
+			return WEBKIT + value + MS + replace(value, 'basis', 'preferred-size') + value
+		// flex-grow
+		case 6060:
+			return WEBKIT + 'box-' + replace(value, '-grow', '') + WEBKIT + value + MS + replace(value, 'grow', 'positive') + value
+		// transition
+		case 4554:
+			return WEBKIT + replace(value, /([^-])(transform)/g, '$1' + WEBKIT + '$2') + value
+		// cursor
+		case 6187:
+			return replace(replace(replace(value, /(zoom-|grab)/, WEBKIT + '$1'), /(image-set)/, WEBKIT + '$1'), value, '') + value
+		// background, background-image
+		case 5495: case 3959:
+			return replace(value, /(image-set\([^]*)/, WEBKIT + '$1' + '$`$1')
+		// justify-content
+		case 4968:
+			return replace(replace(value, /(.+:)(flex-)?(.*)/, WEBKIT + 'box-pack:$3' + MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + WEBKIT + value + value
+		// justify-self
+		case 4200:
+			if (!match(value, /flex-|baseline/)) return MS + 'grid-column-align' + substr(value, length) + value
+			break
+		// grid-template-(columns|rows)
+		case 2592: case 3360:
+			return MS + replace(value, 'template-', '') + value
+		// grid-(row|column)-start
+		case 4384: case 3616:
+			if (children && children.some(function (element, index) { return length = index, match(element.props, /grid-\w+-end/) })) {
+				return ~indexof(value + (children = children[length].value), 'span', 0) ? value : (MS + replace(value, '-start', '') + value + MS + 'grid-row-span:' + (~indexof(children, 'span', 0) ? match(children, /\d+/) : +match(children, /\d+/) - +match(value, /\d+/)) + ';')
+			}
+			return MS + replace(value, '-start', '') + value
+		// grid-(row|column)-end
+		case 4896: case 4128:
+			return (children && children.some(function (element) { return match(element.props, /grid-\w+-start/) })) ? value : MS + replace(replace(value, '-end', '-span'), 'span ', '') + value
+		// (margin|padding)-inline-(start|end)
+		case 4095: case 3583: case 4068: case 2532:
+			return replace(value, /(.+)-inline(.+)/, WEBKIT + '$1$2') + value
+		// (min|max)?(width|height|inline-size|block-size)
+		case 8116: case 7059: case 5753: case 5535:
+		case 5445: case 5701: case 4933: case 4677:
+		case 5533: case 5789: case 5021: case 4765:
+			// stretch, max-content, min-content, fill-available
+			if (strlen(value) - 1 - length > 6)
+				switch (charat(value, length + 1)) {
+					// (m)ax-content, (m)in-content
+					case 109:
+						// -
+						if (charat(value, length + 4) !== 45)
+							break
+					// (f)ill-available, (f)it-content
+					case 102:
+						return replace(value, /(.+:)(.+)-([^]+)/, '$1' + WEBKIT + '$2-$3' + '$1' + MOZ + (charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value
+					// (s)tretch
+					case 115:
+						return ~indexof(value, 'stretch', 0) ? prefix(replace(value, 'stretch', 'fill-available'), length, children) + value : value
+				}
+			break
+		// grid-(column|row)
+		case 5152: case 5920:
+			return replace(value, /(.+?):(\d+)(\s*\/\s*(span)?\s*(\d+))?(.*)/, function (_, a, b, c, d, e, f) { return (MS + a + ':' + b + f) + (c ? (MS + a + '-span:' + (d ? e : +e - +b)) + f : '') + value })
+		// position: sticky
+		case 4949:
+			// stick(y)?
+			if (charat(value, length + 6) === 121)
+				return replace(value, ':', ':' + WEBKIT) + value
+			break
+		// display: (flex|inline-flex|grid|inline-grid)
+		case 6444:
+			switch (charat(value, charat(value, 14) === 45 ? 18 : 11)) {
+				// (inline-)?fle(x)
+				case 120:
+					return replace(value, /(.+:)([^;\s!]+)(;|(\s+)?!.+)?/, '$1' + WEBKIT + (charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + WEBKIT + '$2$3' + '$1' + MS + '$2box$3') + value
+				// (inline-)?gri(d)
+				case 100:
+					return replace(value, ':', ':' + MS) + value
+			}
+			break
+		// scroll-margin, scroll-margin-(top|right|bottom|left)
+		case 5719: case 2647: case 2135: case 3927: case 2391:
+			return replace(value, 'scroll-', 'scroll-snap-') + value
+	}
+
+	return value
+}
diff --git a/ddb_main/node_modules/stylis/src/Serializer.js b/ddb_main/node_modules/stylis/src/Serializer.js
new file mode 100644
index 0000000..cad20d4
--- /dev/null
+++ b/ddb_main/node_modules/stylis/src/Serializer.js
@@ -0,0 +1,35 @@
+import {IMPORT, LAYER, COMMENT, RULESET, DECLARATION, KEYFRAMES} from './Enum.js'
+import {strlen} from './Utility.js'
+
+/**
+ * @param {object[]} children
+ * @param {function} callback
+ * @return {string}
+ */
+export function serialize (children, callback) {
+	var output = ''
+
+	for (var i = 0; i < children.length; i++)
+		output += callback(children[i], i, children, callback) || ''
+
+	return output
+}
+
+/**
+ * @param {object} element
+ * @param {number} index
+ * @param {object[]} children
+ * @param {function} callback
+ * @return {string}
+ */
+export function stringify (element, index, children, callback) {
+	switch (element.type) {
+		case LAYER: if (element.children.length) break
+		case IMPORT: case DECLARATION: return element.return = element.return || element.value
+		case COMMENT: return ''
+		case KEYFRAMES: return element.return = element.value + '{' + serialize(element.children, callback) + '}'
+		case RULESET: if (!strlen(element.value = element.props.join(','))) return ''
+	}
+
+	return strlen(children = serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : ''
+}
diff --git a/ddb_main/node_modules/stylis/src/Tokenizer.js b/ddb_main/node_modules/stylis/src/Tokenizer.js
new file mode 100644
index 0000000..201fb51
--- /dev/null
+++ b/ddb_main/node_modules/stylis/src/Tokenizer.js
@@ -0,0 +1,257 @@
+import {from, trim, charat, strlen, substr, append, assign} from './Utility.js'
+
+export var line = 1
+export var column = 1
+export var length = 0
+export var position = 0
+export var character = 0
+export var characters = ''
+
+/**
+ * @param {string} value
+ * @param {object | null} root
+ * @param {object | null} parent
+ * @param {string} type
+ * @param {string[] | string} props
+ * @param {object[] | string} children
+ * @param {object[]} siblings
+ * @param {number} length
+ */
+export function node (value, root, parent, type, props, children, length, siblings) {
+	return {value: value, root: root, parent: parent, type: type, props: props, children: children, line: line, column: column, length: length, return: '', siblings: siblings}
+}
+
+/**
+ * @param {object} root
+ * @param {object} props
+ * @return {object}
+ */
+export function copy (root, props) {
+	return assign(node('', null, null, '', null, null, 0, root.siblings), root, {length: -root.length}, props)
+}
+
+/**
+ * @param {object} root
+ */
+export function lift (root) {
+	while (root.root)
+		root = copy(root.root, {children: [root]})
+
+	append(root, root.siblings)
+}
+
+/**
+ * @return {number}
+ */
+export function char () {
+	return character
+}
+
+/**
+ * @return {number}
+ */
+export function prev () {
+	character = position > 0 ? charat(characters, --position) : 0
+
+	if (column--, character === 10)
+		column = 1, line--
+
+	return character
+}
+
+/**
+ * @return {number}
+ */
+export function next () {
+	character = position < length ? charat(characters, position++) : 0
+
+	if (column++, character === 10)
+		column = 1, line++
+
+	return character
+}
+
+/**
+ * @return {number}
+ */
+export function peek () {
+	return charat(characters, position)
+}
+
+/**
+ * @return {number}
+ */
+export function caret () {
+	return position
+}
+
+/**
+ * @param {number} begin
+ * @param {number} end
+ * @return {string}
+ */
+export function slice (begin, end) {
+	return substr(characters, begin, end)
+}
+
+/**
+ * @param {number} type
+ * @return {number}
+ */
+export function token (type) {
+	switch (type) {
+		// \0 \t \n \r \s whitespace token
+		case 0: case 9: case 10: case 13: case 32:
+			return 5
+		// ! + , / > @ ~ isolate token
+		case 33: case 43: case 44: case 47: case 62: case 64: case 126:
+		// ; { } breakpoint token
+		case 59: case 123: case 125:
+			return 4
+		// : accompanied token
+		case 58:
+			return 3
+		// " ' ( [ opening delimit token
+		case 34: case 39: case 40: case 91:
+			return 2
+		// ) ] closing delimit token
+		case 41: case 93:
+			return 1
+	}
+
+	return 0
+}
+
+/**
+ * @param {string} value
+ * @return {any[]}
+ */
+export function alloc (value) {
+	return line = column = 1, length = strlen(characters = value), position = 0, []
+}
+
+/**
+ * @param {any} value
+ * @return {any}
+ */
+export function dealloc (value) {
+	return characters = '', value
+}
+
+/**
+ * @param {number} type
+ * @return {string}
+ */
+export function delimit (type) {
+	return trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)))
+}
+
+/**
+ * @param {string} value
+ * @return {string[]}
+ */
+export function tokenize (value) {
+	return dealloc(tokenizer(alloc(value)))
+}
+
+/**
+ * @param {number} type
+ * @return {string}
+ */
+export function whitespace (type) {
+	while (character = peek())
+		if (character < 33)
+			next()
+		else
+			break
+
+	return token(type) > 2 || token(character) > 3 ? '' : ' '
+}
+
+/**
+ * @param {string[]} children
+ * @return {string[]}
+ */
+export function tokenizer (children) {
+	while (next())
+		switch (token(character)) {
+			case 0: append(identifier(position - 1), children)
+				break
+			case 2: append(delimit(character), children)
+				break
+			default: append(from(character), children)
+		}
+
+	return children
+}
+
+/**
+ * @param {number} index
+ * @param {number} count
+ * @return {string}
+ */
+export function escaping (index, count) {
+	while (--count && next())
+		// not 0-9 A-F a-f
+		if (character < 48 || character > 102 || (character > 57 && character < 65) || (character > 70 && character < 97))
+			break
+
+	return slice(index, caret() + (count < 6 && peek() == 32 && next() == 32))
+}
+
+/**
+ * @param {number} type
+ * @return {number}
+ */
+export function delimiter (type) {
+	while (next())
+		switch (character) {
+			// ] ) " '
+			case type:
+				return position
+			// " '
+			case 34: case 39:
+				if (type !== 34 && type !== 39)
+					delimiter(character)
+				break
+			// (
+			case 40:
+				if (type === 41)
+					delimiter(type)
+				break
+			// \
+			case 92:
+				next()
+				break
+		}
+
+	return position
+}
+
+/**
+ * @param {number} type
+ * @param {number} index
+ * @return {number}
+ */
+export function commenter (type, index) {
+	while (next())
+		// //
+		if (type + character === 47 + 10)
+			break
+		// /*
+		else if (type + character === 42 + 42 && peek() === 47)
+			break
+
+	return '/*' + slice(index, position - 1) + '*' + from(type === 47 ? type : next())
+}
+
+/**
+ * @param {number} index
+ * @return {string}
+ */
+export function identifier (index) {
+	while (!token(peek()))
+		next()
+
+	return slice(index, position)
+}
diff --git a/ddb_main/node_modules/stylis/src/Utility.js b/ddb_main/node_modules/stylis/src/Utility.js
new file mode 100644
index 0000000..d89838d
--- /dev/null
+++ b/ddb_main/node_modules/stylis/src/Utility.js
@@ -0,0 +1,125 @@
+/**
+ * @param {number}
+ * @return {number}
+ */
+export var abs = Math.abs
+
+/**
+ * @param {number}
+ * @return {string}
+ */
+export var from = String.fromCharCode
+
+/**
+ * @param {object}
+ * @return {object}
+ */
+export var assign = Object.assign
+
+/**
+ * @param {string} value
+ * @param {number} length
+ * @return {number}
+ */
+export function hash (value, length) {
+	return charat(value, 0) ^ 45 ? (((((((length << 2) ^ charat(value, 0)) << 2) ^ charat(value, 1)) << 2) ^ charat(value, 2)) << 2) ^ charat(value, 3) : 0
+}
+
+/**
+ * @param {string} value
+ * @return {string}
+ */
+export function trim (value) {
+	return value.trim()
+}
+
+/**
+ * @param {string} value
+ * @param {RegExp} pattern
+ * @return {string?}
+ */
+export function match (value, pattern) {
+	return (value = pattern.exec(value)) ? value[0] : value
+}
+
+/**
+ * @param {string} value
+ * @param {(string|RegExp)} pattern
+ * @param {string} replacement
+ * @return {string}
+ */
+export function replace (value, pattern, replacement) {
+	return value.replace(pattern, replacement)
+}
+
+/**
+ * @param {string} value
+ * @param {string} search
+ * @param {number} position
+ * @return {number}
+ */
+export function indexof (value, search, position) {
+	return value.indexOf(search, position)
+}
+
+/**
+ * @param {string} value
+ * @param {number} index
+ * @return {number}
+ */
+export function charat (value, index) {
+	return value.charCodeAt(index) | 0
+}
+
+/**
+ * @param {string} value
+ * @param {number} begin
+ * @param {number} end
+ * @return {string}
+ */
+export function substr (value, begin, end) {
+	return value.slice(begin, end)
+}
+
+/**
+ * @param {string} value
+ * @return {number}
+ */
+export function strlen (value) {
+	return value.length
+}
+
+/**
+ * @param {any[]} value
+ * @return {number}
+ */
+export function sizeof (value) {
+	return value.length
+}
+
+/**
+ * @param {any} value
+ * @param {any[]} array
+ * @return {any}
+ */
+export function append (value, array) {
+	return array.push(value), value
+}
+
+/**
+ * @param {string[]} array
+ * @param {function} callback
+ * @return {string}
+ */
+export function combine (array, callback) {
+	return array.map(callback).join('')
+}
+
+/**
+ * @param {string[]} array
+ * @param {RegExp} pattern
+ * @return {string[]}
+ */
+export function filter (array, pattern) {
+	return array.filter(function (value) { return !match(value, pattern) })
+}
diff --git a/ddb_main/node_modules/tippy.js/dist/tippy.all.js b/ddb_main/node_modules/tippy.js/dist/tippy.all.js
new file mode 100644
index 0000000..49cd1eb
--- /dev/null
+++ b/ddb_main/node_modules/tippy.js/dist/tippy.all.js
@@ -0,0 +1,4157 @@
+(function (global, factory) {
+	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+	typeof define === 'function' && define.amd ? define(factory) :
+	(global.tippy = factory());
+}(this, (function () { 'use strict';
+
+var styles = ".tippy-touch{cursor:pointer!important}.tippy-notransition{-webkit-transition:none!important;transition:none!important}.tippy-popper{max-width:350px;-webkit-perspective:700px;perspective:700px;z-index:9999;outline:0;-webkit-transition-timing-function:cubic-bezier(.165,.84,.44,1);transition-timing-function:cubic-bezier(.165,.84,.44,1);pointer-events:none}.tippy-popper[data-html]{max-width:96%;max-width:calc(100% - 20px)}.tippy-popper[x-placement^=top] .tippy-backdrop{border-radius:40% 40% 0 0}.tippy-popper[x-placement^=top] .tippy-roundarrow{bottom:-8px;margin:0 6px;-webkit-transform-origin:50% 0;transform-origin:50% 0}.tippy-popper[x-placement^=top] .tippy-roundarrow svg{position:absolute;left:0;-webkit-transform:rotate(180deg);transform:rotate(180deg)}.tippy-popper[x-placement^=top] .tippy-arrow{border-top:7px solid #333;border-right:7px solid transparent;border-left:7px solid transparent;bottom:-7px;margin:0 7px;-webkit-transform-origin:50% 0;transform-origin:50% 0}.tippy-popper[x-placement^=top] .tippy-backdrop{-webkit-transform-origin:0 100%;transform-origin:0 100%}.tippy-popper[x-placement^=top] .tippy-backdrop[data-state=visible]{-webkit-transform:scale(5.5) translate(-50%,25%);transform:scale(5.5) translate(-50%,25%);opacity:1}.tippy-popper[x-placement^=top] .tippy-backdrop[data-state=hidden]{-webkit-transform:scale(1) translate(-50%,25%);transform:scale(1) translate(-50%,25%);opacity:0}.tippy-popper[x-placement^=top] [data-animation=shift-toward][data-state=visible]{opacity:1;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.tippy-popper[x-placement^=top] [data-animation=shift-toward][data-state=hidden]{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}.tippy-popper[x-placement^=top] [data-animation=perspective]{-webkit-transform-origin:bottom;transform-origin:bottom}.tippy-popper[x-placement^=top] [data-animation=perspective][data-state=visible]{opacity:1;-webkit-transform:translateY(-10px) rotateX(0);transform:translateY(-10px) rotateX(0)}.tippy-popper[x-placement^=top] [data-animation=perspective][data-state=hidden]{opacity:0;-webkit-transform:translateY(0) rotateX(90deg);transform:translateY(0) rotateX(90deg)}.tippy-popper[x-placement^=top] [data-animation=fade][data-state=visible]{opacity:1;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.tippy-popper[x-placement^=top] [data-animation=fade][data-state=hidden]{opacity:0;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.tippy-popper[x-placement^=top] [data-animation=shift-away][data-state=visible]{opacity:1;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.tippy-popper[x-placement^=top] [data-animation=shift-away][data-state=hidden]{opacity:0;-webkit-transform:translateY(0);transform:translateY(0)}.tippy-popper[x-placement^=top] [data-animation=scale][data-state=visible]{opacity:1;-webkit-transform:translateY(-10px) scale(1);transform:translateY(-10px) scale(1)}.tippy-popper[x-placement^=top] [data-animation=scale][data-state=hidden]{opacity:0;-webkit-transform:translateY(0) scale(0);transform:translateY(0) scale(0)}.tippy-popper[x-placement^=bottom] .tippy-backdrop{border-radius:0 0 30% 30%}.tippy-popper[x-placement^=bottom] .tippy-roundarrow{top:-8px;margin:0 6px;-webkit-transform-origin:50% 100%;transform-origin:50% 100%}.tippy-popper[x-placement^=bottom] .tippy-roundarrow svg{position:absolute;left:0;-webkit-transform:rotate(0);transform:rotate(0)}.tippy-popper[x-placement^=bottom] .tippy-arrow{border-bottom:7px solid #333;border-right:7px solid transparent;border-left:7px solid transparent;top:-7px;margin:0 7px;-webkit-transform-origin:50% 100%;transform-origin:50% 100%}.tippy-popper[x-placement^=bottom] .tippy-backdrop{-webkit-transform-origin:0 -100%;transform-origin:0 -100%}.tippy-popper[x-placement^=bottom] .tippy-backdrop[data-state=visible]{-webkit-transform:scale(5.5) translate(-50%,-125%);transform:scale(5.5) translate(-50%,-125%);opacity:1}.tippy-popper[x-placement^=bottom] .tippy-backdrop[data-state=hidden]{-webkit-transform:scale(1) translate(-50%,-125%);transform:scale(1) translate(-50%,-125%);opacity:0}.tippy-popper[x-placement^=bottom] [data-animation=shift-toward][data-state=visible]{opacity:1;-webkit-transform:translateY(10px);transform:translateY(10px)}.tippy-popper[x-placement^=bottom] [data-animation=shift-toward][data-state=hidden]{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}.tippy-popper[x-placement^=bottom] [data-animation=perspective]{-webkit-transform-origin:top;transform-origin:top}.tippy-popper[x-placement^=bottom] [data-animation=perspective][data-state=visible]{opacity:1;-webkit-transform:translateY(10px) rotateX(0);transform:translateY(10px) rotateX(0)}.tippy-popper[x-placement^=bottom] [data-animation=perspective][data-state=hidden]{opacity:0;-webkit-transform:translateY(0) rotateX(-90deg);transform:translateY(0) rotateX(-90deg)}.tippy-popper[x-placement^=bottom] [data-animation=fade][data-state=visible]{opacity:1;-webkit-transform:translateY(10px);transform:translateY(10px)}.tippy-popper[x-placement^=bottom] [data-animation=fade][data-state=hidden]{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}.tippy-popper[x-placement^=bottom] [data-animation=shift-away][data-state=visible]{opacity:1;-webkit-transform:translateY(10px);transform:translateY(10px)}.tippy-popper[x-placement^=bottom] [data-animation=shift-away][data-state=hidden]{opacity:0;-webkit-transform:translateY(0);transform:translateY(0)}.tippy-popper[x-placement^=bottom] [data-animation=scale][data-state=visible]{opacity:1;-webkit-transform:translateY(10px) scale(1);transform:translateY(10px) scale(1)}.tippy-popper[x-placement^=bottom] [data-animation=scale][data-state=hidden]{opacity:0;-webkit-transform:translateY(0) scale(0);transform:translateY(0) scale(0)}.tippy-popper[x-placement^=left] .tippy-backdrop{border-radius:30% 0 0 30%}.tippy-popper[x-placement^=left] .tippy-roundarrow{right:-16px;margin:4px 0;-webkit-transform-origin:33.33333333% 50%;transform-origin:33.33333333% 50%}.tippy-popper[x-placement^=left] .tippy-roundarrow svg{position:absolute;left:0;-webkit-transform:rotate(90deg);transform:rotate(90deg)}.tippy-popper[x-placement^=left] .tippy-arrow{border-left:7px solid #333;border-top:7px solid transparent;border-bottom:7px solid transparent;right:-7px;margin:4px 0;-webkit-transform-origin:0 50%;transform-origin:0 50%}.tippy-popper[x-placement^=left] .tippy-backdrop{-webkit-transform-origin:100% 0;transform-origin:100% 0}.tippy-popper[x-placement^=left] .tippy-backdrop[data-state=visible]{-webkit-transform:scale(5.5) translate(33%,-50%);transform:scale(5.5) translate(33%,-50%);opacity:1}.tippy-popper[x-placement^=left] .tippy-backdrop[data-state=hidden]{-webkit-transform:scale(1.5) translate(33%,-50%);transform:scale(1.5) translate(33%,-50%);opacity:0}.tippy-popper[x-placement^=left] [data-animation=shift-toward][data-state=visible]{opacity:1;-webkit-transform:translateX(-10px);transform:translateX(-10px)}.tippy-popper[x-placement^=left] [data-animation=shift-toward][data-state=hidden]{opacity:0;-webkit-transform:translateX(-20px);transform:translateX(-20px)}.tippy-popper[x-placement^=left] [data-animation=perspective]{-webkit-transform-origin:right;transform-origin:right}.tippy-popper[x-placement^=left] [data-animation=perspective][data-state=visible]{opacity:1;-webkit-transform:translateX(-10px) rotateY(0);transform:translateX(-10px) rotateY(0)}.tippy-popper[x-placement^=left] [data-animation=perspective][data-state=hidden]{opacity:0;-webkit-transform:translateX(0) rotateY(-90deg);transform:translateX(0) rotateY(-90deg)}.tippy-popper[x-placement^=left] [data-animation=fade][data-state=visible]{opacity:1;-webkit-transform:translateX(-10px);transform:translateX(-10px)}.tippy-popper[x-placement^=left] [data-animation=fade][data-state=hidden]{opacity:0;-webkit-transform:translateX(-10px);transform:translateX(-10px)}.tippy-popper[x-placement^=left] [data-animation=shift-away][data-state=visible]{opacity:1;-webkit-transform:translateX(-10px);transform:translateX(-10px)}.tippy-popper[x-placement^=left] [data-animation=shift-away][data-state=hidden]{opacity:0;-webkit-transform:translateX(0);transform:translateX(0)}.tippy-popper[x-placement^=left] [data-animation=scale][data-state=visible]{opacity:1;-webkit-transform:translateX(-10px) scale(1);transform:translateX(-10px) scale(1)}.tippy-popper[x-placement^=left] [data-animation=scale][data-state=hidden]{opacity:0;-webkit-transform:translateX(0) scale(0);transform:translateX(0) scale(0)}.tippy-popper[x-placement^=right] .tippy-backdrop{border-radius:0 30% 30% 0}.tippy-popper[x-placement^=right] .tippy-roundarrow{left:-16px;margin:4px 0;-webkit-transform-origin:66.66666666% 50%;transform-origin:66.66666666% 50%}.tippy-popper[x-placement^=right] .tippy-roundarrow svg{position:absolute;left:0;-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.tippy-popper[x-placement^=right] .tippy-arrow{border-right:7px solid #333;border-top:7px solid transparent;border-bottom:7px solid transparent;left:-7px;margin:4px 0;-webkit-transform-origin:100% 50%;transform-origin:100% 50%}.tippy-popper[x-placement^=right] .tippy-backdrop{-webkit-transform-origin:-100% 0;transform-origin:-100% 0}.tippy-popper[x-placement^=right] .tippy-backdrop[data-state=visible]{-webkit-transform:scale(5.5) translate(-133%,-50%);transform:scale(5.5) translate(-133%,-50%);opacity:1}.tippy-popper[x-placement^=right] .tippy-backdrop[data-state=hidden]{-webkit-transform:scale(1.5) translate(-133%,-50%);transform:scale(1.5) translate(-133%,-50%);opacity:0}.tippy-popper[x-placement^=right] [data-animation=shift-toward][data-state=visible]{opacity:1;-webkit-transform:translateX(10px);transform:translateX(10px)}.tippy-popper[x-placement^=right] [data-animation=shift-toward][data-state=hidden]{opacity:0;-webkit-transform:translateX(20px);transform:translateX(20px)}.tippy-popper[x-placement^=right] [data-animation=perspective]{-webkit-transform-origin:left;transform-origin:left}.tippy-popper[x-placement^=right] [data-animation=perspective][data-state=visible]{opacity:1;-webkit-transform:translateX(10px) rotateY(0);transform:translateX(10px) rotateY(0)}.tippy-popper[x-placement^=right] [data-animation=perspective][data-state=hidden]{opacity:0;-webkit-transform:translateX(0) rotateY(90deg);transform:translateX(0) rotateY(90deg)}.tippy-popper[x-placement^=right] [data-animation=fade][data-state=visible]{opacity:1;-webkit-transform:translateX(10px);transform:translateX(10px)}.tippy-popper[x-placement^=right] [data-animation=fade][data-state=hidden]{opacity:0;-webkit-transform:translateX(10px);transform:translateX(10px)}.tippy-popper[x-placement^=right] [data-animation=shift-away][data-state=visible]{opacity:1;-webkit-transform:translateX(10px);transform:translateX(10px)}.tippy-popper[x-placement^=right] [data-animation=shift-away][data-state=hidden]{opacity:0;-webkit-transform:translateX(0);transform:translateX(0)}.tippy-popper[x-placement^=right] [data-animation=scale][data-state=visible]{opacity:1;-webkit-transform:translateX(10px) scale(1);transform:translateX(10px) scale(1)}.tippy-popper[x-placement^=right] [data-animation=scale][data-state=hidden]{opacity:0;-webkit-transform:translateX(0) scale(0);transform:translateX(0) scale(0)}.tippy-tooltip{position:relative;color:#fff;border-radius:4px;font-size:.9rem;padding:.3rem .6rem;text-align:center;will-change:transform;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#333}.tippy-tooltip[data-size=small]{padding:.2rem .4rem;font-size:.75rem}.tippy-tooltip[data-size=large]{padding:.4rem .8rem;font-size:1rem}.tippy-tooltip[data-animatefill]{overflow:hidden;background-color:transparent}.tippy-tooltip[data-animatefill] .tippy-content{-webkit-transition:-webkit-clip-path cubic-bezier(.46,.1,.52,.98);transition:-webkit-clip-path cubic-bezier(.46,.1,.52,.98);transition:clip-path cubic-bezier(.46,.1,.52,.98);transition:clip-path cubic-bezier(.46,.1,.52,.98),-webkit-clip-path cubic-bezier(.46,.1,.52,.98)}.tippy-tooltip[data-interactive]{pointer-events:auto}.tippy-tooltip[data-inertia][data-state=visible]{-webkit-transition-timing-function:cubic-bezier(.53,2,.36,.85);transition-timing-function:cubic-bezier(.53,2,.36,.85)}.tippy-tooltip[data-inertia][data-state=hidden]{-webkit-transition-timing-function:ease;transition-timing-function:ease}.tippy-arrow,.tippy-roundarrow{position:absolute;width:0;height:0}.tippy-roundarrow{width:24px;height:8px;fill:#333;pointer-events:none}.tippy-roundarrow path{pointer-events:auto}.tippy-backdrop{position:absolute;will-change:transform;background-color:#333;border-radius:50%;width:26%;left:50%;top:50%;z-index:-1;-webkit-transition:all cubic-bezier(.46,.1,.52,.98);transition:all cubic-bezier(.46,.1,.52,.98);-webkit-backface-visibility:hidden;backface-visibility:hidden}.tippy-backdrop:after{content:\"\";float:left;padding-top:100%}body:not(.tippy-touch) .tippy-tooltip[data-animatefill][data-state=visible] .tippy-content{-webkit-clip-path:ellipse(100% 100% at 50% 50%);clip-path:ellipse(100% 100% at 50% 50%)}body:not(.tippy-touch) .tippy-tooltip[data-animatefill][data-state=hidden] .tippy-content{-webkit-clip-path:ellipse(5% 50% at 50% 50%);clip-path:ellipse(5% 50% at 50% 50%)}body:not(.tippy-touch) .tippy-popper[x-placement=right] .tippy-tooltip[data-animatefill][data-state=visible] .tippy-content{-webkit-clip-path:ellipse(135% 100% at 0 50%);clip-path:ellipse(135% 100% at 0 50%)}body:not(.tippy-touch) .tippy-popper[x-placement=right] .tippy-tooltip[data-animatefill][data-state=hidden] .tippy-content{-webkit-clip-path:ellipse(25% 100% at 0 50%);clip-path:ellipse(25% 100% at 0 50%)}body:not(.tippy-touch) .tippy-popper[x-placement=left] .tippy-tooltip[data-animatefill][data-state=visible] .tippy-content{-webkit-clip-path:ellipse(135% 100% at 100% 50%);clip-path:ellipse(135% 100% at 100% 50%)}body:not(.tippy-touch) .tippy-popper[x-placement=left] .tippy-tooltip[data-animatefill][data-state=hidden] .tippy-content{-webkit-clip-path:ellipse(25% 100% at 100% 50%);clip-path:ellipse(25% 100% at 100% 50%)}@media (max-width:360px){.tippy-popper{max-width:96%;max-width:calc(100% - 20px)}}";
+
+var isBrowser = typeof window !== 'undefined';
+
+var browser = {};
+
+if (isBrowser) {
+  browser.supported = 'requestAnimationFrame' in window;
+  browser.supportsTouch = 'ontouchstart' in window;
+  browser.usingTouch = false;
+  browser.dynamicInputDetection = true;
+  browser.iOS = /iPhone|iPad|iPod/.test(navigator.platform) && !window.MSStream;
+  browser.onUserInputChange = function () {};
+  browser._eventListenersBound = false;
+}
+
+/**
+ * Selector constants used for grabbing elements
+ */
+var selectors = {
+  POPPER: '.tippy-popper',
+  TOOLTIP: '.tippy-tooltip',
+  CONTENT: '.tippy-content',
+  BACKDROP: '.tippy-backdrop',
+  ARROW: '.tippy-arrow',
+  ROUND_ARROW: '.tippy-roundarrow',
+  REFERENCE: '[data-tippy]'
+
+  /**
+   * The default options applied to each instance
+   */
+};var defaults = {
+  placement: 'top',
+  trigger: 'mouseenter focus',
+  animation: 'shift-away',
+  html: false,
+  animateFill: true,
+  arrow: false,
+  delay: 0,
+  duration: [350, 300],
+  interactive: false,
+  interactiveBorder: 2,
+  theme: 'dark',
+  size: 'regular',
+  distance: 10,
+  offset: 0,
+  hideOnClick: true,
+  multiple: false,
+  followCursor: false,
+  inertia: false,
+  updateDuration: 350,
+  sticky: false,
+  appendTo: function appendTo() {
+    return document.body;
+  },
+  zIndex: 9999,
+  touchHold: false,
+  performance: false,
+  dynamicTitle: false,
+  flip: true,
+  flipBehavior: 'flip',
+  arrowType: 'sharp',
+  arrowTransform: '',
+  maxWidth: '',
+  target: null,
+  popperOptions: {},
+  createPopperInstanceOnInit: false,
+  onShow: function onShow() {},
+  onShown: function onShown() {},
+  onHide: function onHide() {},
+  onHidden: function onHidden() {}
+};
+
+/**
+ * The keys of the defaults object for reducing down into a new object
+ * Used in `getIndividualOptions()`
+ */
+var defaultsKeys = browser.supported && Object.keys(defaults);
+
+/**
+ * Determines if a value is an object literal
+ * @param {*} value
+ * @return {Boolean}
+ */
+function isObjectLiteral(value) {
+  return Object.prototype.toString.call(value) === '[object Object]';
+}
+
+/**
+ * Ponyfill for Array.from
+ * @param {*} value
+ * @return {Array}
+ */
+function toArray(value) {
+  return [].slice.call(value);
+}
+
+/**
+ * Returns an array of elements based on the selector input
+ * @param {String|Element|Element[]|NodeList|Object} selector
+ * @return {Element[]}
+ */
+function getArrayOfElements(selector) {
+  if (selector instanceof Element || isObjectLiteral(selector)) {
+    return [selector];
+  }
+
+  if (selector instanceof NodeList) {
+    return toArray(selector);
+  }
+
+  if (Array.isArray(selector)) {
+    return selector;
+  }
+
+  try {
+    return toArray(document.querySelectorAll(selector));
+  } catch (_) {
+    return [];
+  }
+}
+
+/**
+ * Returns the supported prefixed property - only `webkit` is needed, `moz`, `ms` and `o` are obsolete
+ * @param {String} property
+ * @return {String} - browser supported prefixed property
+ */
+function prefix(property) {
+  var prefixes = [false, 'webkit'];
+  var upperProp = property.charAt(0).toUpperCase() + property.slice(1);
+
+  for (var i = 0; i < prefixes.length; i++) {
+    var _prefix = prefixes[i];
+    var prefixedProp = _prefix ? '' + _prefix + upperProp : property;
+    if (typeof document.body.style[prefixedProp] !== 'undefined') {
+      return prefixedProp;
+    }
+  }
+
+  return null;
+}
+
+/**
+ * Creates a popper element then returns it
+ * @param {Number} id - the popper id
+ * @param {String} title - the tooltip's `title` attribute
+ * @param {Object} options - individual options
+ * @return {Element} - the popper element
+ */
+function createPopperElement(id, title, options) {
+  var arrow = options.arrow,
+      arrowType = options.arrowType,
+      arrowTransform = options.arrowTransform,
+      animateFill = options.animateFill,
+      inertia = options.inertia,
+      animation = options.animation,
+      size = options.size,
+      theme = options.theme,
+      html = options.html,
+      zIndex = options.zIndex,
+      interactive = options.interactive,
+      maxWidth = options.maxWidth;
+
+
+  var popper = document.createElement('div');
+  popper.setAttribute('class', 'tippy-popper');
+  popper.setAttribute('role', 'tooltip');
+  popper.setAttribute('id', 'tippy-' + id);
+  popper.style.zIndex = zIndex;
+  popper.style.maxWidth = maxWidth;
+
+  var tooltip = document.createElement('div');
+  tooltip.setAttribute('class', 'tippy-tooltip');
+  tooltip.setAttribute('data-size', size);
+  tooltip.setAttribute('data-animation', animation);
+  tooltip.setAttribute('data-state', 'hidden');
+
+  theme.split(' ').forEach(function (t) {
+    tooltip.classList.add(t + '-theme');
+  });
+
+  if (arrow) {
+    var _arrow = document.createElement('div');
+    _arrow.style[prefix('transform')] = arrowTransform;
+
+    if (arrowType === 'round') {
+      _arrow.classList.add('tippy-roundarrow');
+      _arrow.innerHTML = '<svg viewBox="0 0 24 8" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M1 8s4.577-.019 7.253-4.218c2.357-3.698 5.175-3.721 7.508 0C18.404 7.997 23 8 23 8H1z"/></svg>';
+    } else {
+      _arrow.classList.add('tippy-arrow');
+    }
+
+    tooltip.appendChild(_arrow);
+  }
+
+  if (animateFill) {
+    // Create animateFill circle element for animation
+    tooltip.setAttribute('data-animatefill', '');
+    var circle = document.createElement('div');
+    circle.setAttribute('data-state', 'hidden');
+    circle.classList.add('tippy-backdrop');
+    tooltip.appendChild(circle);
+  }
+
+  if (inertia) {
+    // Change transition timing function cubic bezier
+    tooltip.setAttribute('data-inertia', '');
+  }
+
+  if (interactive) {
+    tooltip.setAttribute('data-interactive', '');
+  }
+
+  var content = document.createElement('div');
+  content.setAttribute('class', 'tippy-content');
+
+  if (html) {
+    var templateId = void 0;
+
+    if (html instanceof Element) {
+      content.appendChild(html);
+      templateId = '#' + html.id || 'tippy-html-template';
+    } else {
+      content.innerHTML = document.querySelector(html).innerHTML;
+      templateId = html;
+    }
+
+    popper.setAttribute('data-html', '');
+    interactive && popper.setAttribute('tabindex', '-1');
+    tooltip.setAttribute('data-template-id', templateId);
+  } else {
+    content.innerHTML = title;
+  }
+
+  tooltip.appendChild(content);
+  popper.appendChild(tooltip);
+
+  return popper;
+}
+
+/**
+ * Creates a trigger by adding the necessary event listeners to the reference element
+ * @param {String} eventType - the custom event specified in the `trigger` setting
+ * @param {Element} reference
+ * @param {Object} handlers - the handlers for each event
+ * @param {Object} options
+ * @return {Array} - array of listener objects
+ */
+function createTrigger(eventType, reference, handlers, options) {
+  var handleTrigger = handlers.handleTrigger,
+      handleMouseLeave = handlers.handleMouseLeave,
+      handleBlur = handlers.handleBlur,
+      handleDelegateShow = handlers.handleDelegateShow,
+      handleDelegateHide = handlers.handleDelegateHide;
+
+  var listeners = [];
+
+  if (eventType === 'manual') return listeners;
+
+  var on = function on(eventType, handler) {
+    reference.addEventListener(eventType, handler);
+    listeners.push({ event: eventType, handler: handler });
+  };
+
+  if (!options.target) {
+    on(eventType, handleTrigger);
+
+    if (browser.supportsTouch && options.touchHold) {
+      on('touchstart', handleTrigger);
+      on('touchend', handleMouseLeave);
+    }
+    if (eventType === 'mouseenter') {
+      on('mouseleave', handleMouseLeave);
+    }
+    if (eventType === 'focus') {
+      on('blur', handleBlur);
+    }
+  } else {
+    if (browser.supportsTouch && options.touchHold) {
+      on('touchstart', handleDelegateShow);
+      on('touchend', handleDelegateHide);
+    }
+    if (eventType === 'mouseenter') {
+      on('mouseover', handleDelegateShow);
+      on('mouseout', handleDelegateHide);
+    }
+    if (eventType === 'focus') {
+      on('focusin', handleDelegateShow);
+      on('focusout', handleDelegateHide);
+    }
+    if (eventType === 'click') {
+      on('click', handleDelegateShow);
+    }
+  }
+
+  return listeners;
+}
+
+var classCallCheck = function (instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
+  }
+};
+
+var createClass = function () {
+  function defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  return function (Constructor, protoProps, staticProps) {
+    if (protoProps) defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) defineProperties(Constructor, staticProps);
+    return Constructor;
+  };
+}();
+
+
+
+
+
+
+
+var _extends = Object.assign || function (target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i];
+
+    for (var key in source) {
+      if (Object.prototype.hasOwnProperty.call(source, key)) {
+        target[key] = source[key];
+      }
+    }
+  }
+
+  return target;
+};
+
+/**
+ * Returns an object of settings to override global settings
+ * @param {Element} reference
+ * @param {Object} instanceOptions
+ * @return {Object} - individual options
+ */
+function getIndividualOptions(reference, instanceOptions) {
+  var options = defaultsKeys.reduce(function (acc, key) {
+    var val = reference.getAttribute('data-tippy-' + key.toLowerCase()) || instanceOptions[key];
+
+    // Convert strings to booleans
+    if (val === 'false') val = false;
+    if (val === 'true') val = true;
+
+    // Convert number strings to true numbers
+    if (isFinite(val) && !isNaN(parseFloat(val))) {
+      val = parseFloat(val);
+    }
+
+    // Convert array strings to actual arrays
+    if (key !== 'target' && typeof val === 'string' && val.trim().charAt(0) === '[') {
+      val = JSON.parse(val);
+    }
+
+    acc[key] = val;
+
+    return acc;
+  }, {});
+
+  return _extends({}, instanceOptions, options);
+}
+
+/**
+ * Evaluates/modifies the options object for appropriate behavior
+ * @param {Element|Object} reference
+ * @param {Object} options
+ * @return {Object} modified/evaluated options
+ */
+function evaluateOptions(reference, options) {
+  // animateFill is disabled if an arrow is true
+  if (options.arrow) {
+    options.animateFill = false;
+  }
+
+  if (options.appendTo && typeof options.appendTo === 'function') {
+    options.appendTo = options.appendTo();
+  }
+
+  if (typeof options.html === 'function') {
+    options.html = options.html(reference);
+  }
+
+  return options;
+}
+
+/**
+ * Returns inner elements of the popper element
+ * @param {Element} popper
+ * @return {Object}
+ */
+function getInnerElements(popper) {
+  return {
+    tooltip: popper.querySelector(selectors.TOOLTIP),
+    backdrop: popper.querySelector(selectors.BACKDROP),
+    content: popper.querySelector(selectors.CONTENT)
+  };
+}
+
+/**
+ * Removes the title from an element, setting `data-original-title`
+ * appropriately
+ * @param {Element} el
+ */
+function removeTitle(el) {
+  var title = el.getAttribute('title');
+  // Only set `data-original-title` attr if there is a title
+  if (title) {
+    el.setAttribute('data-original-title', title);
+  }
+  el.removeAttribute('title');
+}
+
+/**!
+ * @fileOverview Kickass library to create and place poppers near their reference elements.
+ * @version 1.12.9
+ * @license
+ * Copyright (c) 2016 Federico Zivolo and contributors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+var isBrowser$1 = typeof window !== 'undefined' && typeof document !== 'undefined';
+var longerTimeoutBrowsers = ['Edge', 'Trident', 'Firefox'];
+var timeoutDuration = 0;
+for (var i = 0; i < longerTimeoutBrowsers.length; i += 1) {
+  if (isBrowser$1 && navigator.userAgent.indexOf(longerTimeoutBrowsers[i]) >= 0) {
+    timeoutDuration = 1;
+    break;
+  }
+}
+
+function microtaskDebounce(fn) {
+  var called = false;
+  return function () {
+    if (called) {
+      return;
+    }
+    called = true;
+    window.Promise.resolve().then(function () {
+      called = false;
+      fn();
+    });
+  };
+}
+
+function taskDebounce(fn) {
+  var scheduled = false;
+  return function () {
+    if (!scheduled) {
+      scheduled = true;
+      setTimeout(function () {
+        scheduled = false;
+        fn();
+      }, timeoutDuration);
+    }
+  };
+}
+
+var supportsMicroTasks = isBrowser$1 && window.Promise;
+
+/**
+* Create a debounced version of a method, that's asynchronously deferred
+* but called in the minimum time possible.
+*
+* @method
+* @memberof Popper.Utils
+* @argument {Function} fn
+* @returns {Function}
+*/
+var debounce = supportsMicroTasks ? microtaskDebounce : taskDebounce;
+
+/**
+ * Check if the given variable is a function
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Any} functionToCheck - variable to check
+ * @returns {Boolean} answer to: is a function?
+ */
+function isFunction(functionToCheck) {
+  var getType = {};
+  return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]';
+}
+
+/**
+ * Get CSS computed property of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Eement} element
+ * @argument {String} property
+ */
+function getStyleComputedProperty(element, property) {
+  if (element.nodeType !== 1) {
+    return [];
+  }
+  // NOTE: 1 DOM access here
+  var css = getComputedStyle(element, null);
+  return property ? css[property] : css;
+}
+
+/**
+ * Returns the parentNode or the host of the element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Element} parent
+ */
+function getParentNode(element) {
+  if (element.nodeName === 'HTML') {
+    return element;
+  }
+  return element.parentNode || element.host;
+}
+
+/**
+ * Returns the scrolling parent of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Element} scroll parent
+ */
+function getScrollParent(element) {
+  // Return body, `getScroll` will take care to get the correct `scrollTop` from it
+  if (!element) {
+    return document.body;
+  }
+
+  switch (element.nodeName) {
+    case 'HTML':
+    case 'BODY':
+      return element.ownerDocument.body;
+    case '#document':
+      return element.body;
+  }
+
+  // Firefox want us to check `-x` and `-y` variations as well
+
+  var _getStyleComputedProp = getStyleComputedProperty(element),
+      overflow = _getStyleComputedProp.overflow,
+      overflowX = _getStyleComputedProp.overflowX,
+      overflowY = _getStyleComputedProp.overflowY;
+
+  if (/(auto|scroll)/.test(overflow + overflowY + overflowX)) {
+    return element;
+  }
+
+  return getScrollParent(getParentNode(element));
+}
+
+/**
+ * Returns the offset parent of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Element} offset parent
+ */
+function getOffsetParent(element) {
+  // NOTE: 1 DOM access here
+  var offsetParent = element && element.offsetParent;
+  var nodeName = offsetParent && offsetParent.nodeName;
+
+  if (!nodeName || nodeName === 'BODY' || nodeName === 'HTML') {
+    if (element) {
+      return element.ownerDocument.documentElement;
+    }
+
+    return document.documentElement;
+  }
+
+  // .offsetParent will return the closest TD or TABLE in case
+  // no offsetParent is present, I hate this job...
+  if (['TD', 'TABLE'].indexOf(offsetParent.nodeName) !== -1 && getStyleComputedProperty(offsetParent, 'position') === 'static') {
+    return getOffsetParent(offsetParent);
+  }
+
+  return offsetParent;
+}
+
+function isOffsetContainer(element) {
+  var nodeName = element.nodeName;
+
+  if (nodeName === 'BODY') {
+    return false;
+  }
+  return nodeName === 'HTML' || getOffsetParent(element.firstElementChild) === element;
+}
+
+/**
+ * Finds the root node (document, shadowDOM root) of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} node
+ * @returns {Element} root node
+ */
+function getRoot(node) {
+  if (node.parentNode !== null) {
+    return getRoot(node.parentNode);
+  }
+
+  return node;
+}
+
+/**
+ * Finds the offset parent common to the two provided nodes
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element1
+ * @argument {Element} element2
+ * @returns {Element} common offset parent
+ */
+function findCommonOffsetParent(element1, element2) {
+  // This check is needed to avoid errors in case one of the elements isn't defined for any reason
+  if (!element1 || !element1.nodeType || !element2 || !element2.nodeType) {
+    return document.documentElement;
+  }
+
+  // Here we make sure to give as "start" the element that comes first in the DOM
+  var order = element1.compareDocumentPosition(element2) & Node.DOCUMENT_POSITION_FOLLOWING;
+  var start = order ? element1 : element2;
+  var end = order ? element2 : element1;
+
+  // Get common ancestor container
+  var range = document.createRange();
+  range.setStart(start, 0);
+  range.setEnd(end, 0);
+  var commonAncestorContainer = range.commonAncestorContainer;
+
+  // Both nodes are inside #document
+
+  if (element1 !== commonAncestorContainer && element2 !== commonAncestorContainer || start.contains(end)) {
+    if (isOffsetContainer(commonAncestorContainer)) {
+      return commonAncestorContainer;
+    }
+
+    return getOffsetParent(commonAncestorContainer);
+  }
+
+  // one of the nodes is inside shadowDOM, find which one
+  var element1root = getRoot(element1);
+  if (element1root.host) {
+    return findCommonOffsetParent(element1root.host, element2);
+  } else {
+    return findCommonOffsetParent(element1, getRoot(element2).host);
+  }
+}
+
+/**
+ * Gets the scroll value of the given element in the given side (top and left)
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @argument {String} side `top` or `left`
+ * @returns {number} amount of scrolled pixels
+ */
+function getScroll(element) {
+  var side = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'top';
+
+  var upperSide = side === 'top' ? 'scrollTop' : 'scrollLeft';
+  var nodeName = element.nodeName;
+
+  if (nodeName === 'BODY' || nodeName === 'HTML') {
+    var html = element.ownerDocument.documentElement;
+    var scrollingElement = element.ownerDocument.scrollingElement || html;
+    return scrollingElement[upperSide];
+  }
+
+  return element[upperSide];
+}
+
+/*
+ * Sum or subtract the element scroll values (left and top) from a given rect object
+ * @method
+ * @memberof Popper.Utils
+ * @param {Object} rect - Rect object you want to change
+ * @param {HTMLElement} element - The element from the function reads the scroll values
+ * @param {Boolean} subtract - set to true if you want to subtract the scroll values
+ * @return {Object} rect - The modifier rect object
+ */
+function includeScroll(rect, element) {
+  var subtract = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+  var scrollTop = getScroll(element, 'top');
+  var scrollLeft = getScroll(element, 'left');
+  var modifier = subtract ? -1 : 1;
+  rect.top += scrollTop * modifier;
+  rect.bottom += scrollTop * modifier;
+  rect.left += scrollLeft * modifier;
+  rect.right += scrollLeft * modifier;
+  return rect;
+}
+
+/*
+ * Helper to detect borders of a given element
+ * @method
+ * @memberof Popper.Utils
+ * @param {CSSStyleDeclaration} styles
+ * Result of `getStyleComputedProperty` on the given element
+ * @param {String} axis - `x` or `y`
+ * @return {number} borders - The borders size of the given axis
+ */
+
+function getBordersSize(styles, axis) {
+  var sideA = axis === 'x' ? 'Left' : 'Top';
+  var sideB = sideA === 'Left' ? 'Right' : 'Bottom';
+
+  return parseFloat(styles['border' + sideA + 'Width'], 10) + parseFloat(styles['border' + sideB + 'Width'], 10);
+}
+
+/**
+ * Tells if you are running Internet Explorer 10
+ * @method
+ * @memberof Popper.Utils
+ * @returns {Boolean} isIE10
+ */
+var isIE10 = undefined;
+
+var isIE10$1 = function isIE10$1() {
+  if (isIE10 === undefined) {
+    isIE10 = navigator.appVersion.indexOf('MSIE 10') !== -1;
+  }
+  return isIE10;
+};
+
+function getSize(axis, body, html, computedStyle) {
+  return Math.max(body['offset' + axis], body['scroll' + axis], html['client' + axis], html['offset' + axis], html['scroll' + axis], isIE10$1() ? html['offset' + axis] + computedStyle['margin' + (axis === 'Height' ? 'Top' : 'Left')] + computedStyle['margin' + (axis === 'Height' ? 'Bottom' : 'Right')] : 0);
+}
+
+function getWindowSizes() {
+  var body = document.body;
+  var html = document.documentElement;
+  var computedStyle = isIE10$1() && getComputedStyle(html);
+
+  return {
+    height: getSize('Height', body, html, computedStyle),
+    width: getSize('Width', body, html, computedStyle)
+  };
+}
+
+var classCallCheck$1 = function classCallCheck(instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
+  }
+};
+
+var createClass$1 = function () {
+  function defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  return function (Constructor, protoProps, staticProps) {
+    if (protoProps) defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) defineProperties(Constructor, staticProps);
+    return Constructor;
+  };
+}();
+
+var defineProperty$1 = function defineProperty(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+
+  return obj;
+};
+
+var _extends$1 = Object.assign || function (target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i];
+
+    for (var key in source) {
+      if (Object.prototype.hasOwnProperty.call(source, key)) {
+        target[key] = source[key];
+      }
+    }
+  }
+
+  return target;
+};
+
+/**
+ * Given element offsets, generate an output similar to getBoundingClientRect
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Object} offsets
+ * @returns {Object} ClientRect like output
+ */
+function getClientRect(offsets) {
+  return _extends$1({}, offsets, {
+    right: offsets.left + offsets.width,
+    bottom: offsets.top + offsets.height
+  });
+}
+
+/**
+ * Get bounding client rect of given element
+ * @method
+ * @memberof Popper.Utils
+ * @param {HTMLElement} element
+ * @return {Object} client rect
+ */
+function getBoundingClientRect(element) {
+  var rect = {};
+
+  // IE10 10 FIX: Please, don't ask, the element isn't
+  // considered in DOM in some circumstances...
+  // This isn't reproducible in IE10 compatibility mode of IE11
+  if (isIE10$1()) {
+    try {
+      rect = element.getBoundingClientRect();
+      var scrollTop = getScroll(element, 'top');
+      var scrollLeft = getScroll(element, 'left');
+      rect.top += scrollTop;
+      rect.left += scrollLeft;
+      rect.bottom += scrollTop;
+      rect.right += scrollLeft;
+    } catch (err) {}
+  } else {
+    rect = element.getBoundingClientRect();
+  }
+
+  var result = {
+    left: rect.left,
+    top: rect.top,
+    width: rect.right - rect.left,
+    height: rect.bottom - rect.top
+  };
+
+  // subtract scrollbar size from sizes
+  var sizes = element.nodeName === 'HTML' ? getWindowSizes() : {};
+  var width = sizes.width || element.clientWidth || result.right - result.left;
+  var height = sizes.height || element.clientHeight || result.bottom - result.top;
+
+  var horizScrollbar = element.offsetWidth - width;
+  var vertScrollbar = element.offsetHeight - height;
+
+  // if an hypothetical scrollbar is detected, we must be sure it's not a `border`
+  // we make this check conditional for performance reasons
+  if (horizScrollbar || vertScrollbar) {
+    var styles = getStyleComputedProperty(element);
+    horizScrollbar -= getBordersSize(styles, 'x');
+    vertScrollbar -= getBordersSize(styles, 'y');
+
+    result.width -= horizScrollbar;
+    result.height -= vertScrollbar;
+  }
+
+  return getClientRect(result);
+}
+
+function getOffsetRectRelativeToArbitraryNode(children, parent) {
+  var isIE10 = isIE10$1();
+  var isHTML = parent.nodeName === 'HTML';
+  var childrenRect = getBoundingClientRect(children);
+  var parentRect = getBoundingClientRect(parent);
+  var scrollParent = getScrollParent(children);
+
+  var styles = getStyleComputedProperty(parent);
+  var borderTopWidth = parseFloat(styles.borderTopWidth, 10);
+  var borderLeftWidth = parseFloat(styles.borderLeftWidth, 10);
+
+  var offsets = getClientRect({
+    top: childrenRect.top - parentRect.top - borderTopWidth,
+    left: childrenRect.left - parentRect.left - borderLeftWidth,
+    width: childrenRect.width,
+    height: childrenRect.height
+  });
+  offsets.marginTop = 0;
+  offsets.marginLeft = 0;
+
+  // Subtract margins of documentElement in case it's being used as parent
+  // we do this only on HTML because it's the only element that behaves
+  // differently when margins are applied to it. The margins are included in
+  // the box of the documentElement, in the other cases not.
+  if (!isIE10 && isHTML) {
+    var marginTop = parseFloat(styles.marginTop, 10);
+    var marginLeft = parseFloat(styles.marginLeft, 10);
+
+    offsets.top -= borderTopWidth - marginTop;
+    offsets.bottom -= borderTopWidth - marginTop;
+    offsets.left -= borderLeftWidth - marginLeft;
+    offsets.right -= borderLeftWidth - marginLeft;
+
+    // Attach marginTop and marginLeft because in some circumstances we may need them
+    offsets.marginTop = marginTop;
+    offsets.marginLeft = marginLeft;
+  }
+
+  if (isIE10 ? parent.contains(scrollParent) : parent === scrollParent && scrollParent.nodeName !== 'BODY') {
+    offsets = includeScroll(offsets, parent);
+  }
+
+  return offsets;
+}
+
+function getViewportOffsetRectRelativeToArtbitraryNode(element) {
+  var html = element.ownerDocument.documentElement;
+  var relativeOffset = getOffsetRectRelativeToArbitraryNode(element, html);
+  var width = Math.max(html.clientWidth, window.innerWidth || 0);
+  var height = Math.max(html.clientHeight, window.innerHeight || 0);
+
+  var scrollTop = getScroll(html);
+  var scrollLeft = getScroll(html, 'left');
+
+  var offset = {
+    top: scrollTop - relativeOffset.top + relativeOffset.marginTop,
+    left: scrollLeft - relativeOffset.left + relativeOffset.marginLeft,
+    width: width,
+    height: height
+  };
+
+  return getClientRect(offset);
+}
+
+/**
+ * Check if the given element is fixed or is inside a fixed parent
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @argument {Element} customContainer
+ * @returns {Boolean} answer to "isFixed?"
+ */
+function isFixed(element) {
+  var nodeName = element.nodeName;
+  if (nodeName === 'BODY' || nodeName === 'HTML') {
+    return false;
+  }
+  if (getStyleComputedProperty(element, 'position') === 'fixed') {
+    return true;
+  }
+  return isFixed(getParentNode(element));
+}
+
+/**
+ * Computed the boundaries limits and return them
+ * @method
+ * @memberof Popper.Utils
+ * @param {HTMLElement} popper
+ * @param {HTMLElement} reference
+ * @param {number} padding
+ * @param {HTMLElement} boundariesElement - Element used to define the boundaries
+ * @returns {Object} Coordinates of the boundaries
+ */
+function getBoundaries(popper, reference, padding, boundariesElement) {
+  // NOTE: 1 DOM access here
+  var boundaries = { top: 0, left: 0 };
+  var offsetParent = findCommonOffsetParent(popper, reference);
+
+  // Handle viewport case
+  if (boundariesElement === 'viewport') {
+    boundaries = getViewportOffsetRectRelativeToArtbitraryNode(offsetParent);
+  } else {
+    // Handle other cases based on DOM element used as boundaries
+    var boundariesNode = void 0;
+    if (boundariesElement === 'scrollParent') {
+      boundariesNode = getScrollParent(getParentNode(reference));
+      if (boundariesNode.nodeName === 'BODY') {
+        boundariesNode = popper.ownerDocument.documentElement;
+      }
+    } else if (boundariesElement === 'window') {
+      boundariesNode = popper.ownerDocument.documentElement;
+    } else {
+      boundariesNode = boundariesElement;
+    }
+
+    var offsets = getOffsetRectRelativeToArbitraryNode(boundariesNode, offsetParent);
+
+    // In case of HTML, we need a different computation
+    if (boundariesNode.nodeName === 'HTML' && !isFixed(offsetParent)) {
+      var _getWindowSizes = getWindowSizes(),
+          height = _getWindowSizes.height,
+          width = _getWindowSizes.width;
+
+      boundaries.top += offsets.top - offsets.marginTop;
+      boundaries.bottom = height + offsets.top;
+      boundaries.left += offsets.left - offsets.marginLeft;
+      boundaries.right = width + offsets.left;
+    } else {
+      // for all the other DOM elements, this one is good
+      boundaries = offsets;
+    }
+  }
+
+  // Add paddings
+  boundaries.left += padding;
+  boundaries.top += padding;
+  boundaries.right -= padding;
+  boundaries.bottom -= padding;
+
+  return boundaries;
+}
+
+function getArea(_ref) {
+  var width = _ref.width,
+      height = _ref.height;
+
+  return width * height;
+}
+
+/**
+ * Utility used to transform the `auto` placement to the placement with more
+ * available space.
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function computeAutoPlacement(placement, refRect, popper, reference, boundariesElement) {
+  var padding = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 0;
+
+  if (placement.indexOf('auto') === -1) {
+    return placement;
+  }
+
+  var boundaries = getBoundaries(popper, reference, padding, boundariesElement);
+
+  var rects = {
+    top: {
+      width: boundaries.width,
+      height: refRect.top - boundaries.top
+    },
+    right: {
+      width: boundaries.right - refRect.right,
+      height: boundaries.height
+    },
+    bottom: {
+      width: boundaries.width,
+      height: boundaries.bottom - refRect.bottom
+    },
+    left: {
+      width: refRect.left - boundaries.left,
+      height: boundaries.height
+    }
+  };
+
+  var sortedAreas = Object.keys(rects).map(function (key) {
+    return _extends$1({
+      key: key
+    }, rects[key], {
+      area: getArea(rects[key])
+    });
+  }).sort(function (a, b) {
+    return b.area - a.area;
+  });
+
+  var filteredAreas = sortedAreas.filter(function (_ref2) {
+    var width = _ref2.width,
+        height = _ref2.height;
+    return width >= popper.clientWidth && height >= popper.clientHeight;
+  });
+
+  var computedPlacement = filteredAreas.length > 0 ? filteredAreas[0].key : sortedAreas[0].key;
+
+  var variation = placement.split('-')[1];
+
+  return computedPlacement + (variation ? '-' + variation : '');
+}
+
+/**
+ * Get offsets to the reference element
+ * @method
+ * @memberof Popper.Utils
+ * @param {Object} state
+ * @param {Element} popper - the popper element
+ * @param {Element} reference - the reference element (the popper will be relative to this)
+ * @returns {Object} An object containing the offsets which will be applied to the popper
+ */
+function getReferenceOffsets(state, popper, reference) {
+  var commonOffsetParent = findCommonOffsetParent(popper, reference);
+  return getOffsetRectRelativeToArbitraryNode(reference, commonOffsetParent);
+}
+
+/**
+ * Get the outer sizes of the given element (offset size + margins)
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Object} object containing width and height properties
+ */
+function getOuterSizes(element) {
+  var styles = getComputedStyle(element);
+  var x = parseFloat(styles.marginTop) + parseFloat(styles.marginBottom);
+  var y = parseFloat(styles.marginLeft) + parseFloat(styles.marginRight);
+  var result = {
+    width: element.offsetWidth + y,
+    height: element.offsetHeight + x
+  };
+  return result;
+}
+
+/**
+ * Get the opposite placement of the given one
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} placement
+ * @returns {String} flipped placement
+ */
+function getOppositePlacement(placement) {
+  var hash = { left: 'right', right: 'left', bottom: 'top', top: 'bottom' };
+  return placement.replace(/left|right|bottom|top/g, function (matched) {
+    return hash[matched];
+  });
+}
+
+/**
+ * Get offsets to the popper
+ * @method
+ * @memberof Popper.Utils
+ * @param {Object} position - CSS position the Popper will get applied
+ * @param {HTMLElement} popper - the popper element
+ * @param {Object} referenceOffsets - the reference offsets (the popper will be relative to this)
+ * @param {String} placement - one of the valid placement options
+ * @returns {Object} popperOffsets - An object containing the offsets which will be applied to the popper
+ */
+function getPopperOffsets(popper, referenceOffsets, placement) {
+  placement = placement.split('-')[0];
+
+  // Get popper node sizes
+  var popperRect = getOuterSizes(popper);
+
+  // Add position, width and height to our offsets object
+  var popperOffsets = {
+    width: popperRect.width,
+    height: popperRect.height
+  };
+
+  // depending by the popper placement we have to compute its offsets slightly differently
+  var isHoriz = ['right', 'left'].indexOf(placement) !== -1;
+  var mainSide = isHoriz ? 'top' : 'left';
+  var secondarySide = isHoriz ? 'left' : 'top';
+  var measurement = isHoriz ? 'height' : 'width';
+  var secondaryMeasurement = !isHoriz ? 'height' : 'width';
+
+  popperOffsets[mainSide] = referenceOffsets[mainSide] + referenceOffsets[measurement] / 2 - popperRect[measurement] / 2;
+  if (placement === secondarySide) {
+    popperOffsets[secondarySide] = referenceOffsets[secondarySide] - popperRect[secondaryMeasurement];
+  } else {
+    popperOffsets[secondarySide] = referenceOffsets[getOppositePlacement(secondarySide)];
+  }
+
+  return popperOffsets;
+}
+
+/**
+ * Mimics the `find` method of Array
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Array} arr
+ * @argument prop
+ * @argument value
+ * @returns index or -1
+ */
+function find(arr, check) {
+  // use native find if supported
+  if (Array.prototype.find) {
+    return arr.find(check);
+  }
+
+  // use `filter` to obtain the same behavior of `find`
+  return arr.filter(check)[0];
+}
+
+/**
+ * Return the index of the matching object
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Array} arr
+ * @argument prop
+ * @argument value
+ * @returns index or -1
+ */
+function findIndex(arr, prop, value) {
+  // use native findIndex if supported
+  if (Array.prototype.findIndex) {
+    return arr.findIndex(function (cur) {
+      return cur[prop] === value;
+    });
+  }
+
+  // use `find` + `indexOf` if `findIndex` isn't supported
+  var match = find(arr, function (obj) {
+    return obj[prop] === value;
+  });
+  return arr.indexOf(match);
+}
+
+/**
+ * Loop trough the list of modifiers and run them in order,
+ * each of them will then edit the data object.
+ * @method
+ * @memberof Popper.Utils
+ * @param {dataObject} data
+ * @param {Array} modifiers
+ * @param {String} ends - Optional modifier name used as stopper
+ * @returns {dataObject}
+ */
+function runModifiers(modifiers, data, ends) {
+  var modifiersToRun = ends === undefined ? modifiers : modifiers.slice(0, findIndex(modifiers, 'name', ends));
+
+  modifiersToRun.forEach(function (modifier) {
+    if (modifier['function']) {
+      // eslint-disable-line dot-notation
+      console.warn('`modifier.function` is deprecated, use `modifier.fn`!');
+    }
+    var fn = modifier['function'] || modifier.fn; // eslint-disable-line dot-notation
+    if (modifier.enabled && isFunction(fn)) {
+      // Add properties to offsets to make them a complete clientRect object
+      // we do this before each modifier to make sure the previous one doesn't
+      // mess with these values
+      data.offsets.popper = getClientRect(data.offsets.popper);
+      data.offsets.reference = getClientRect(data.offsets.reference);
+
+      data = fn(data, modifier);
+    }
+  });
+
+  return data;
+}
+
+/**
+ * Updates the position of the popper, computing the new offsets and applying
+ * the new style.<br />
+ * Prefer `scheduleUpdate` over `update` because of performance reasons.
+ * @method
+ * @memberof Popper
+ */
+function update() {
+  // if popper is destroyed, don't perform any further update
+  if (this.state.isDestroyed) {
+    return;
+  }
+
+  var data = {
+    instance: this,
+    styles: {},
+    arrowStyles: {},
+    attributes: {},
+    flipped: false,
+    offsets: {}
+  };
+
+  // compute reference element offsets
+  data.offsets.reference = getReferenceOffsets(this.state, this.popper, this.reference);
+
+  // compute auto placement, store placement inside the data object,
+  // modifiers will be able to edit `placement` if needed
+  // and refer to originalPlacement to know the original value
+  data.placement = computeAutoPlacement(this.options.placement, data.offsets.reference, this.popper, this.reference, this.options.modifiers.flip.boundariesElement, this.options.modifiers.flip.padding);
+
+  // store the computed placement inside `originalPlacement`
+  data.originalPlacement = data.placement;
+
+  // compute the popper offsets
+  data.offsets.popper = getPopperOffsets(this.popper, data.offsets.reference, data.placement);
+  data.offsets.popper.position = 'absolute';
+
+  // run the modifiers
+  data = runModifiers(this.modifiers, data);
+
+  // the first `update` will call `onCreate` callback
+  // the other ones will call `onUpdate` callback
+  if (!this.state.isCreated) {
+    this.state.isCreated = true;
+    this.options.onCreate(data);
+  } else {
+    this.options.onUpdate(data);
+  }
+}
+
+/**
+ * Helper used to know if the given modifier is enabled.
+ * @method
+ * @memberof Popper.Utils
+ * @returns {Boolean}
+ */
+function isModifierEnabled(modifiers, modifierName) {
+  return modifiers.some(function (_ref) {
+    var name = _ref.name,
+        enabled = _ref.enabled;
+    return enabled && name === modifierName;
+  });
+}
+
+/**
+ * Get the prefixed supported property name
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} property (camelCase)
+ * @returns {String} prefixed property (camelCase or PascalCase, depending on the vendor prefix)
+ */
+function getSupportedPropertyName(property) {
+  var prefixes = [false, 'ms', 'Webkit', 'Moz', 'O'];
+  var upperProp = property.charAt(0).toUpperCase() + property.slice(1);
+
+  for (var i = 0; i < prefixes.length - 1; i++) {
+    var prefix = prefixes[i];
+    var toCheck = prefix ? '' + prefix + upperProp : property;
+    if (typeof document.body.style[toCheck] !== 'undefined') {
+      return toCheck;
+    }
+  }
+  return null;
+}
+
+/**
+ * Destroy the popper
+ * @method
+ * @memberof Popper
+ */
+function destroy() {
+  this.state.isDestroyed = true;
+
+  // touch DOM only if `applyStyle` modifier is enabled
+  if (isModifierEnabled(this.modifiers, 'applyStyle')) {
+    this.popper.removeAttribute('x-placement');
+    this.popper.style.left = '';
+    this.popper.style.position = '';
+    this.popper.style.top = '';
+    this.popper.style[getSupportedPropertyName('transform')] = '';
+  }
+
+  this.disableEventListeners();
+
+  // remove the popper if user explicity asked for the deletion on destroy
+  // do not use `remove` because IE11 doesn't support it
+  if (this.options.removeOnDestroy) {
+    this.popper.parentNode.removeChild(this.popper);
+  }
+  return this;
+}
+
+/**
+ * Get the window associated with the element
+ * @argument {Element} element
+ * @returns {Window}
+ */
+function getWindow(element) {
+  var ownerDocument = element.ownerDocument;
+  return ownerDocument ? ownerDocument.defaultView : window;
+}
+
+function attachToScrollParents(scrollParent, event, callback, scrollParents) {
+  var isBody = scrollParent.nodeName === 'BODY';
+  var target = isBody ? scrollParent.ownerDocument.defaultView : scrollParent;
+  target.addEventListener(event, callback, { passive: true });
+
+  if (!isBody) {
+    attachToScrollParents(getScrollParent(target.parentNode), event, callback, scrollParents);
+  }
+  scrollParents.push(target);
+}
+
+/**
+ * Setup needed event listeners used to update the popper position
+ * @method
+ * @memberof Popper.Utils
+ * @private
+ */
+function setupEventListeners(reference, options, state, updateBound) {
+  // Resize event listener on window
+  state.updateBound = updateBound;
+  getWindow(reference).addEventListener('resize', state.updateBound, { passive: true });
+
+  // Scroll event listener on scroll parents
+  var scrollElement = getScrollParent(reference);
+  attachToScrollParents(scrollElement, 'scroll', state.updateBound, state.scrollParents);
+  state.scrollElement = scrollElement;
+  state.eventsEnabled = true;
+
+  return state;
+}
+
+/**
+ * It will add resize/scroll events and start recalculating
+ * position of the popper element when they are triggered.
+ * @method
+ * @memberof Popper
+ */
+function enableEventListeners() {
+  if (!this.state.eventsEnabled) {
+    this.state = setupEventListeners(this.reference, this.options, this.state, this.scheduleUpdate);
+  }
+}
+
+/**
+ * Remove event listeners used to update the popper position
+ * @method
+ * @memberof Popper.Utils
+ * @private
+ */
+function removeEventListeners(reference, state) {
+  // Remove resize event listener on window
+  getWindow(reference).removeEventListener('resize', state.updateBound);
+
+  // Remove scroll event listener on scroll parents
+  state.scrollParents.forEach(function (target) {
+    target.removeEventListener('scroll', state.updateBound);
+  });
+
+  // Reset state
+  state.updateBound = null;
+  state.scrollParents = [];
+  state.scrollElement = null;
+  state.eventsEnabled = false;
+  return state;
+}
+
+/**
+ * It will remove resize/scroll events and won't recalculate popper position
+ * when they are triggered. It also won't trigger onUpdate callback anymore,
+ * unless you call `update` method manually.
+ * @method
+ * @memberof Popper
+ */
+function disableEventListeners() {
+  if (this.state.eventsEnabled) {
+    cancelAnimationFrame(this.scheduleUpdate);
+    this.state = removeEventListeners(this.reference, this.state);
+  }
+}
+
+/**
+ * Tells if a given input is a number
+ * @method
+ * @memberof Popper.Utils
+ * @param {*} input to check
+ * @return {Boolean}
+ */
+function isNumeric(n) {
+  return n !== '' && !isNaN(parseFloat(n)) && isFinite(n);
+}
+
+/**
+ * Set the style to the given popper
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element - Element to apply the style to
+ * @argument {Object} styles
+ * Object with a list of properties and values which will be applied to the element
+ */
+function setStyles(element, styles) {
+  Object.keys(styles).forEach(function (prop) {
+    var unit = '';
+    // add unit if the value is numeric and is one of the following
+    if (['width', 'height', 'top', 'right', 'bottom', 'left'].indexOf(prop) !== -1 && isNumeric(styles[prop])) {
+      unit = 'px';
+    }
+    element.style[prop] = styles[prop] + unit;
+  });
+}
+
+/**
+ * Set the attributes to the given popper
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element - Element to apply the attributes to
+ * @argument {Object} styles
+ * Object with a list of properties and values which will be applied to the element
+ */
+function setAttributes(element, attributes) {
+  Object.keys(attributes).forEach(function (prop) {
+    var value = attributes[prop];
+    if (value !== false) {
+      element.setAttribute(prop, attributes[prop]);
+    } else {
+      element.removeAttribute(prop);
+    }
+  });
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} data.styles - List of style properties - values to apply to popper element
+ * @argument {Object} data.attributes - List of attribute properties - values to apply to popper element
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The same data object
+ */
+function applyStyle(data) {
+  // any property present in `data.styles` will be applied to the popper,
+  // in this way we can make the 3rd party modifiers add custom styles to it
+  // Be aware, modifiers could override the properties defined in the previous
+  // lines of this modifier!
+  setStyles(data.instance.popper, data.styles);
+
+  // any property present in `data.attributes` will be applied to the popper,
+  // they will be set as HTML attributes of the element
+  setAttributes(data.instance.popper, data.attributes);
+
+  // if arrowElement is defined and arrowStyles has some properties
+  if (data.arrowElement && Object.keys(data.arrowStyles).length) {
+    setStyles(data.arrowElement, data.arrowStyles);
+  }
+
+  return data;
+}
+
+/**
+ * Set the x-placement attribute before everything else because it could be used
+ * to add margins to the popper margins needs to be calculated to get the
+ * correct popper offsets.
+ * @method
+ * @memberof Popper.modifiers
+ * @param {HTMLElement} reference - The reference element used to position the popper
+ * @param {HTMLElement} popper - The HTML element used as popper.
+ * @param {Object} options - Popper.js options
+ */
+function applyStyleOnLoad(reference, popper, options, modifierOptions, state) {
+  // compute reference element offsets
+  var referenceOffsets = getReferenceOffsets(state, popper, reference);
+
+  // compute auto placement, store placement inside the data object,
+  // modifiers will be able to edit `placement` if needed
+  // and refer to originalPlacement to know the original value
+  var placement = computeAutoPlacement(options.placement, referenceOffsets, popper, reference, options.modifiers.flip.boundariesElement, options.modifiers.flip.padding);
+
+  popper.setAttribute('x-placement', placement);
+
+  // Apply `position` to popper before anything else because
+  // without the position applied we can't guarantee correct computations
+  setStyles(popper, { position: 'absolute' });
+
+  return options;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function computeStyle(data, options) {
+  var x = options.x,
+      y = options.y;
+  var popper = data.offsets.popper;
+
+  // Remove this legacy support in Popper.js v2
+
+  var legacyGpuAccelerationOption = find(data.instance.modifiers, function (modifier) {
+    return modifier.name === 'applyStyle';
+  }).gpuAcceleration;
+  if (legacyGpuAccelerationOption !== undefined) {
+    console.warn('WARNING: `gpuAcceleration` option moved to `computeStyle` modifier and will not be supported in future versions of Popper.js!');
+  }
+  var gpuAcceleration = legacyGpuAccelerationOption !== undefined ? legacyGpuAccelerationOption : options.gpuAcceleration;
+
+  var offsetParent = getOffsetParent(data.instance.popper);
+  var offsetParentRect = getBoundingClientRect(offsetParent);
+
+  // Styles
+  var styles = {
+    position: popper.position
+  };
+
+  // floor sides to avoid blurry text
+  var offsets = {
+    left: Math.floor(popper.left),
+    top: Math.floor(popper.top),
+    bottom: Math.floor(popper.bottom),
+    right: Math.floor(popper.right)
+  };
+
+  var sideA = x === 'bottom' ? 'top' : 'bottom';
+  var sideB = y === 'right' ? 'left' : 'right';
+
+  // if gpuAcceleration is set to `true` and transform is supported,
+  //  we use `translate3d` to apply the position to the popper we
+  // automatically use the supported prefixed version if needed
+  var prefixedProperty = getSupportedPropertyName('transform');
+
+  // now, let's make a step back and look at this code closely (wtf?)
+  // If the content of the popper grows once it's been positioned, it
+  // may happen that the popper gets misplaced because of the new content
+  // overflowing its reference element
+  // To avoid this problem, we provide two options (x and y), which allow
+  // the consumer to define the offset origin.
+  // If we position a popper on top of a reference element, we can set
+  // `x` to `top` to make the popper grow towards its top instead of
+  // its bottom.
+  var left = void 0,
+      top = void 0;
+  if (sideA === 'bottom') {
+    top = -offsetParentRect.height + offsets.bottom;
+  } else {
+    top = offsets.top;
+  }
+  if (sideB === 'right') {
+    left = -offsetParentRect.width + offsets.right;
+  } else {
+    left = offsets.left;
+  }
+  if (gpuAcceleration && prefixedProperty) {
+    styles[prefixedProperty] = 'translate3d(' + left + 'px, ' + top + 'px, 0)';
+    styles[sideA] = 0;
+    styles[sideB] = 0;
+    styles.willChange = 'transform';
+  } else {
+    // othwerise, we use the standard `top`, `left`, `bottom` and `right` properties
+    var invertTop = sideA === 'bottom' ? -1 : 1;
+    var invertLeft = sideB === 'right' ? -1 : 1;
+    styles[sideA] = top * invertTop;
+    styles[sideB] = left * invertLeft;
+    styles.willChange = sideA + ', ' + sideB;
+  }
+
+  // Attributes
+  var attributes = {
+    'x-placement': data.placement
+  };
+
+  // Update `data` attributes, styles and arrowStyles
+  data.attributes = _extends$1({}, attributes, data.attributes);
+  data.styles = _extends$1({}, styles, data.styles);
+  data.arrowStyles = _extends$1({}, data.offsets.arrow, data.arrowStyles);
+
+  return data;
+}
+
+/**
+ * Helper used to know if the given modifier depends from another one.<br />
+ * It checks if the needed modifier is listed and enabled.
+ * @method
+ * @memberof Popper.Utils
+ * @param {Array} modifiers - list of modifiers
+ * @param {String} requestingName - name of requesting modifier
+ * @param {String} requestedName - name of requested modifier
+ * @returns {Boolean}
+ */
+function isModifierRequired(modifiers, requestingName, requestedName) {
+  var requesting = find(modifiers, function (_ref) {
+    var name = _ref.name;
+    return name === requestingName;
+  });
+
+  var isRequired = !!requesting && modifiers.some(function (modifier) {
+    return modifier.name === requestedName && modifier.enabled && modifier.order < requesting.order;
+  });
+
+  if (!isRequired) {
+    var _requesting = '`' + requestingName + '`';
+    var requested = '`' + requestedName + '`';
+    console.warn(requested + ' modifier is required by ' + _requesting + ' modifier in order to work, be sure to include it before ' + _requesting + '!');
+  }
+  return isRequired;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function arrow(data, options) {
+  var _data$offsets$arrow;
+
+  // arrow depends on keepTogether in order to work
+  if (!isModifierRequired(data.instance.modifiers, 'arrow', 'keepTogether')) {
+    return data;
+  }
+
+  var arrowElement = options.element;
+
+  // if arrowElement is a string, suppose it's a CSS selector
+  if (typeof arrowElement === 'string') {
+    arrowElement = data.instance.popper.querySelector(arrowElement);
+
+    // if arrowElement is not found, don't run the modifier
+    if (!arrowElement) {
+      return data;
+    }
+  } else {
+    // if the arrowElement isn't a query selector we must check that the
+    // provided DOM node is child of its popper node
+    if (!data.instance.popper.contains(arrowElement)) {
+      console.warn('WARNING: `arrow.element` must be child of its popper element!');
+      return data;
+    }
+  }
+
+  var placement = data.placement.split('-')[0];
+  var _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var isVertical = ['left', 'right'].indexOf(placement) !== -1;
+
+  var len = isVertical ? 'height' : 'width';
+  var sideCapitalized = isVertical ? 'Top' : 'Left';
+  var side = sideCapitalized.toLowerCase();
+  var altSide = isVertical ? 'left' : 'top';
+  var opSide = isVertical ? 'bottom' : 'right';
+  var arrowElementSize = getOuterSizes(arrowElement)[len];
+
+  //
+  // extends keepTogether behavior making sure the popper and its
+  // reference have enough pixels in conjuction
+  //
+
+  // top/left side
+  if (reference[opSide] - arrowElementSize < popper[side]) {
+    data.offsets.popper[side] -= popper[side] - (reference[opSide] - arrowElementSize);
+  }
+  // bottom/right side
+  if (reference[side] + arrowElementSize > popper[opSide]) {
+    data.offsets.popper[side] += reference[side] + arrowElementSize - popper[opSide];
+  }
+  data.offsets.popper = getClientRect(data.offsets.popper);
+
+  // compute center of the popper
+  var center = reference[side] + reference[len] / 2 - arrowElementSize / 2;
+
+  // Compute the sideValue using the updated popper offsets
+  // take popper margin in account because we don't have this info available
+  var css = getStyleComputedProperty(data.instance.popper);
+  var popperMarginSide = parseFloat(css['margin' + sideCapitalized], 10);
+  var popperBorderSide = parseFloat(css['border' + sideCapitalized + 'Width'], 10);
+  var sideValue = center - data.offsets.popper[side] - popperMarginSide - popperBorderSide;
+
+  // prevent arrowElement from being placed not contiguously to its popper
+  sideValue = Math.max(Math.min(popper[len] - arrowElementSize, sideValue), 0);
+
+  data.arrowElement = arrowElement;
+  data.offsets.arrow = (_data$offsets$arrow = {}, defineProperty$1(_data$offsets$arrow, side, Math.round(sideValue)), defineProperty$1(_data$offsets$arrow, altSide, ''), _data$offsets$arrow);
+
+  return data;
+}
+
+/**
+ * Get the opposite placement variation of the given one
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} placement variation
+ * @returns {String} flipped placement variation
+ */
+function getOppositeVariation(variation) {
+  if (variation === 'end') {
+    return 'start';
+  } else if (variation === 'start') {
+    return 'end';
+  }
+  return variation;
+}
+
+/**
+ * List of accepted placements to use as values of the `placement` option.<br />
+ * Valid placements are:
+ * - `auto`
+ * - `top`
+ * - `right`
+ * - `bottom`
+ * - `left`
+ *
+ * Each placement can have a variation from this list:
+ * - `-start`
+ * - `-end`
+ *
+ * Variations are interpreted easily if you think of them as the left to right
+ * written languages. Horizontally (`top` and `bottom`), `start` is left and `end`
+ * is right.<br />
+ * Vertically (`left` and `right`), `start` is top and `end` is bottom.
+ *
+ * Some valid examples are:
+ * - `top-end` (on top of reference, right aligned)
+ * - `right-start` (on right of reference, top aligned)
+ * - `bottom` (on bottom, centered)
+ * - `auto-right` (on the side with more space available, alignment depends by placement)
+ *
+ * @static
+ * @type {Array}
+ * @enum {String}
+ * @readonly
+ * @method placements
+ * @memberof Popper
+ */
+var placements = ['auto-start', 'auto', 'auto-end', 'top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start'];
+
+// Get rid of `auto` `auto-start` and `auto-end`
+var validPlacements = placements.slice(3);
+
+/**
+ * Given an initial placement, returns all the subsequent placements
+ * clockwise (or counter-clockwise).
+ *
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} placement - A valid placement (it accepts variations)
+ * @argument {Boolean} counter - Set to true to walk the placements counterclockwise
+ * @returns {Array} placements including their variations
+ */
+function clockwise(placement) {
+  var counter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  var index = validPlacements.indexOf(placement);
+  var arr = validPlacements.slice(index + 1).concat(validPlacements.slice(0, index));
+  return counter ? arr.reverse() : arr;
+}
+
+var BEHAVIORS = {
+  FLIP: 'flip',
+  CLOCKWISE: 'clockwise',
+  COUNTERCLOCKWISE: 'counterclockwise'
+};
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function flip(data, options) {
+  // if `inner` modifier is enabled, we can't use the `flip` modifier
+  if (isModifierEnabled(data.instance.modifiers, 'inner')) {
+    return data;
+  }
+
+  if (data.flipped && data.placement === data.originalPlacement) {
+    // seems like flip is trying to loop, probably there's not enough space on any of the flippable sides
+    return data;
+  }
+
+  var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, options.boundariesElement);
+
+  var placement = data.placement.split('-')[0];
+  var placementOpposite = getOppositePlacement(placement);
+  var variation = data.placement.split('-')[1] || '';
+
+  var flipOrder = [];
+
+  switch (options.behavior) {
+    case BEHAVIORS.FLIP:
+      flipOrder = [placement, placementOpposite];
+      break;
+    case BEHAVIORS.CLOCKWISE:
+      flipOrder = clockwise(placement);
+      break;
+    case BEHAVIORS.COUNTERCLOCKWISE:
+      flipOrder = clockwise(placement, true);
+      break;
+    default:
+      flipOrder = options.behavior;
+  }
+
+  flipOrder.forEach(function (step, index) {
+    if (placement !== step || flipOrder.length === index + 1) {
+      return data;
+    }
+
+    placement = data.placement.split('-')[0];
+    placementOpposite = getOppositePlacement(placement);
+
+    var popperOffsets = data.offsets.popper;
+    var refOffsets = data.offsets.reference;
+
+    // using floor because the reference offsets may contain decimals we are not going to consider here
+    var floor = Math.floor;
+    var overlapsRef = placement === 'left' && floor(popperOffsets.right) > floor(refOffsets.left) || placement === 'right' && floor(popperOffsets.left) < floor(refOffsets.right) || placement === 'top' && floor(popperOffsets.bottom) > floor(refOffsets.top) || placement === 'bottom' && floor(popperOffsets.top) < floor(refOffsets.bottom);
+
+    var overflowsLeft = floor(popperOffsets.left) < floor(boundaries.left);
+    var overflowsRight = floor(popperOffsets.right) > floor(boundaries.right);
+    var overflowsTop = floor(popperOffsets.top) < floor(boundaries.top);
+    var overflowsBottom = floor(popperOffsets.bottom) > floor(boundaries.bottom);
+
+    var overflowsBoundaries = placement === 'left' && overflowsLeft || placement === 'right' && overflowsRight || placement === 'top' && overflowsTop || placement === 'bottom' && overflowsBottom;
+
+    // flip the variation if required
+    var isVertical = ['top', 'bottom'].indexOf(placement) !== -1;
+    var flippedVariation = !!options.flipVariations && (isVertical && variation === 'start' && overflowsLeft || isVertical && variation === 'end' && overflowsRight || !isVertical && variation === 'start' && overflowsTop || !isVertical && variation === 'end' && overflowsBottom);
+
+    if (overlapsRef || overflowsBoundaries || flippedVariation) {
+      // this boolean to detect any flip loop
+      data.flipped = true;
+
+      if (overlapsRef || overflowsBoundaries) {
+        placement = flipOrder[index + 1];
+      }
+
+      if (flippedVariation) {
+        variation = getOppositeVariation(variation);
+      }
+
+      data.placement = placement + (variation ? '-' + variation : '');
+
+      // this object contains `position`, we want to preserve it along with
+      // any additional property we may add in the future
+      data.offsets.popper = _extends$1({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement));
+
+      data = runModifiers(data.instance.modifiers, data, 'flip');
+    }
+  });
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function keepTogether(data) {
+  var _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var placement = data.placement.split('-')[0];
+  var floor = Math.floor;
+  var isVertical = ['top', 'bottom'].indexOf(placement) !== -1;
+  var side = isVertical ? 'right' : 'bottom';
+  var opSide = isVertical ? 'left' : 'top';
+  var measurement = isVertical ? 'width' : 'height';
+
+  if (popper[side] < floor(reference[opSide])) {
+    data.offsets.popper[opSide] = floor(reference[opSide]) - popper[measurement];
+  }
+  if (popper[opSide] > floor(reference[side])) {
+    data.offsets.popper[opSide] = floor(reference[side]);
+  }
+
+  return data;
+}
+
+/**
+ * Converts a string containing value + unit into a px value number
+ * @function
+ * @memberof {modifiers~offset}
+ * @private
+ * @argument {String} str - Value + unit string
+ * @argument {String} measurement - `height` or `width`
+ * @argument {Object} popperOffsets
+ * @argument {Object} referenceOffsets
+ * @returns {Number|String}
+ * Value in pixels, or original string if no values were extracted
+ */
+function toValue(str, measurement, popperOffsets, referenceOffsets) {
+  // separate value from unit
+  var split = str.match(/((?:\-|\+)?\d*\.?\d*)(.*)/);
+  var value = +split[1];
+  var unit = split[2];
+
+  // If it's not a number it's an operator, I guess
+  if (!value) {
+    return str;
+  }
+
+  if (unit.indexOf('%') === 0) {
+    var element = void 0;
+    switch (unit) {
+      case '%p':
+        element = popperOffsets;
+        break;
+      case '%':
+      case '%r':
+      default:
+        element = referenceOffsets;
+    }
+
+    var rect = getClientRect(element);
+    return rect[measurement] / 100 * value;
+  } else if (unit === 'vh' || unit === 'vw') {
+    // if is a vh or vw, we calculate the size based on the viewport
+    var size = void 0;
+    if (unit === 'vh') {
+      size = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
+    } else {
+      size = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
+    }
+    return size / 100 * value;
+  } else {
+    // if is an explicit pixel unit, we get rid of the unit and keep the value
+    // if is an implicit unit, it's px, and we return just the value
+    return value;
+  }
+}
+
+/**
+ * Parse an `offset` string to extrapolate `x` and `y` numeric offsets.
+ * @function
+ * @memberof {modifiers~offset}
+ * @private
+ * @argument {String} offset
+ * @argument {Object} popperOffsets
+ * @argument {Object} referenceOffsets
+ * @argument {String} basePlacement
+ * @returns {Array} a two cells array with x and y offsets in numbers
+ */
+function parseOffset(offset, popperOffsets, referenceOffsets, basePlacement) {
+  var offsets = [0, 0];
+
+  // Use height if placement is left or right and index is 0 otherwise use width
+  // in this way the first offset will use an axis and the second one
+  // will use the other one
+  var useHeight = ['right', 'left'].indexOf(basePlacement) !== -1;
+
+  // Split the offset string to obtain a list of values and operands
+  // The regex addresses values with the plus or minus sign in front (+10, -20, etc)
+  var fragments = offset.split(/(\+|\-)/).map(function (frag) {
+    return frag.trim();
+  });
+
+  // Detect if the offset string contains a pair of values or a single one
+  // they could be separated by comma or space
+  var divider = fragments.indexOf(find(fragments, function (frag) {
+    return frag.search(/,|\s/) !== -1;
+  }));
+
+  if (fragments[divider] && fragments[divider].indexOf(',') === -1) {
+    console.warn('Offsets separated by white space(s) are deprecated, use a comma (,) instead.');
+  }
+
+  // If divider is found, we divide the list of values and operands to divide
+  // them by ofset X and Y.
+  var splitRegex = /\s*,\s*|\s+/;
+  var ops = divider !== -1 ? [fragments.slice(0, divider).concat([fragments[divider].split(splitRegex)[0]]), [fragments[divider].split(splitRegex)[1]].concat(fragments.slice(divider + 1))] : [fragments];
+
+  // Convert the values with units to absolute pixels to allow our computations
+  ops = ops.map(function (op, index) {
+    // Most of the units rely on the orientation of the popper
+    var measurement = (index === 1 ? !useHeight : useHeight) ? 'height' : 'width';
+    var mergeWithPrevious = false;
+    return op
+    // This aggregates any `+` or `-` sign that aren't considered operators
+    // e.g.: 10 + +5 => [10, +, +5]
+    .reduce(function (a, b) {
+      if (a[a.length - 1] === '' && ['+', '-'].indexOf(b) !== -1) {
+        a[a.length - 1] = b;
+        mergeWithPrevious = true;
+        return a;
+      } else if (mergeWithPrevious) {
+        a[a.length - 1] += b;
+        mergeWithPrevious = false;
+        return a;
+      } else {
+        return a.concat(b);
+      }
+    }, [])
+    // Here we convert the string values into number values (in px)
+    .map(function (str) {
+      return toValue(str, measurement, popperOffsets, referenceOffsets);
+    });
+  });
+
+  // Loop trough the offsets arrays and execute the operations
+  ops.forEach(function (op, index) {
+    op.forEach(function (frag, index2) {
+      if (isNumeric(frag)) {
+        offsets[index] += frag * (op[index2 - 1] === '-' ? -1 : 1);
+      }
+    });
+  });
+  return offsets;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @argument {Number|String} options.offset=0
+ * The offset value as described in the modifier description
+ * @returns {Object} The data object, properly modified
+ */
+function offset(data, _ref) {
+  var offset = _ref.offset;
+  var placement = data.placement,
+      _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var basePlacement = placement.split('-')[0];
+
+  var offsets = void 0;
+  if (isNumeric(+offset)) {
+    offsets = [+offset, 0];
+  } else {
+    offsets = parseOffset(offset, popper, reference, basePlacement);
+  }
+
+  if (basePlacement === 'left') {
+    popper.top += offsets[0];
+    popper.left -= offsets[1];
+  } else if (basePlacement === 'right') {
+    popper.top += offsets[0];
+    popper.left += offsets[1];
+  } else if (basePlacement === 'top') {
+    popper.left += offsets[0];
+    popper.top -= offsets[1];
+  } else if (basePlacement === 'bottom') {
+    popper.left += offsets[0];
+    popper.top += offsets[1];
+  }
+
+  data.popper = popper;
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function preventOverflow(data, options) {
+  var boundariesElement = options.boundariesElement || getOffsetParent(data.instance.popper);
+
+  // If offsetParent is the reference element, we really want to
+  // go one step up and use the next offsetParent as reference to
+  // avoid to make this modifier completely useless and look like broken
+  if (data.instance.reference === boundariesElement) {
+    boundariesElement = getOffsetParent(boundariesElement);
+  }
+
+  var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, boundariesElement);
+  options.boundaries = boundaries;
+
+  var order = options.priority;
+  var popper = data.offsets.popper;
+
+  var check = {
+    primary: function primary(placement) {
+      var value = popper[placement];
+      if (popper[placement] < boundaries[placement] && !options.escapeWithReference) {
+        value = Math.max(popper[placement], boundaries[placement]);
+      }
+      return defineProperty$1({}, placement, value);
+    },
+    secondary: function secondary(placement) {
+      var mainSide = placement === 'right' ? 'left' : 'top';
+      var value = popper[mainSide];
+      if (popper[placement] > boundaries[placement] && !options.escapeWithReference) {
+        value = Math.min(popper[mainSide], boundaries[placement] - (placement === 'right' ? popper.width : popper.height));
+      }
+      return defineProperty$1({}, mainSide, value);
+    }
+  };
+
+  order.forEach(function (placement) {
+    var side = ['left', 'top'].indexOf(placement) !== -1 ? 'primary' : 'secondary';
+    popper = _extends$1({}, popper, check[side](placement));
+  });
+
+  data.offsets.popper = popper;
+
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function shift(data) {
+  var placement = data.placement;
+  var basePlacement = placement.split('-')[0];
+  var shiftvariation = placement.split('-')[1];
+
+  // if shift shiftvariation is specified, run the modifier
+  if (shiftvariation) {
+    var _data$offsets = data.offsets,
+        reference = _data$offsets.reference,
+        popper = _data$offsets.popper;
+
+    var isVertical = ['bottom', 'top'].indexOf(basePlacement) !== -1;
+    var side = isVertical ? 'left' : 'top';
+    var measurement = isVertical ? 'width' : 'height';
+
+    var shiftOffsets = {
+      start: defineProperty$1({}, side, reference[side]),
+      end: defineProperty$1({}, side, reference[side] + reference[measurement] - popper[measurement])
+    };
+
+    data.offsets.popper = _extends$1({}, popper, shiftOffsets[shiftvariation]);
+  }
+
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function hide(data) {
+  if (!isModifierRequired(data.instance.modifiers, 'hide', 'preventOverflow')) {
+    return data;
+  }
+
+  var refRect = data.offsets.reference;
+  var bound = find(data.instance.modifiers, function (modifier) {
+    return modifier.name === 'preventOverflow';
+  }).boundaries;
+
+  if (refRect.bottom < bound.top || refRect.left > bound.right || refRect.top > bound.bottom || refRect.right < bound.left) {
+    // Avoid unnecessary DOM access if visibility hasn't changed
+    if (data.hide === true) {
+      return data;
+    }
+
+    data.hide = true;
+    data.attributes['x-out-of-boundaries'] = '';
+  } else {
+    // Avoid unnecessary DOM access if visibility hasn't changed
+    if (data.hide === false) {
+      return data;
+    }
+
+    data.hide = false;
+    data.attributes['x-out-of-boundaries'] = false;
+  }
+
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function inner(data) {
+  var placement = data.placement;
+  var basePlacement = placement.split('-')[0];
+  var _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var isHoriz = ['left', 'right'].indexOf(basePlacement) !== -1;
+
+  var subtractLength = ['top', 'left'].indexOf(basePlacement) === -1;
+
+  popper[isHoriz ? 'left' : 'top'] = reference[basePlacement] - (subtractLength ? popper[isHoriz ? 'width' : 'height'] : 0);
+
+  data.placement = getOppositePlacement(placement);
+  data.offsets.popper = getClientRect(popper);
+
+  return data;
+}
+
+/**
+ * Modifier function, each modifier can have a function of this type assigned
+ * to its `fn` property.<br />
+ * These functions will be called on each update, this means that you must
+ * make sure they are performant enough to avoid performance bottlenecks.
+ *
+ * @function ModifierFn
+ * @argument {dataObject} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {dataObject} The data object, properly modified
+ */
+
+/**
+ * Modifiers are plugins used to alter the behavior of your poppers.<br />
+ * Popper.js uses a set of 9 modifiers to provide all the basic functionalities
+ * needed by the library.
+ *
+ * Usually you don't want to override the `order`, `fn` and `onLoad` props.
+ * All the other properties are configurations that could be tweaked.
+ * @namespace modifiers
+ */
+var modifiers = {
+  /**
+   * Modifier used to shift the popper on the start or end of its reference
+   * element.<br />
+   * It will read the variation of the `placement` property.<br />
+   * It can be one either `-end` or `-start`.
+   * @memberof modifiers
+   * @inner
+   */
+  shift: {
+    /** @prop {number} order=100 - Index used to define the order of execution */
+    order: 100,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: shift
+  },
+
+  /**
+   * The `offset` modifier can shift your popper on both its axis.
+   *
+   * It accepts the following units:
+   * - `px` or unitless, interpreted as pixels
+   * - `%` or `%r`, percentage relative to the length of the reference element
+   * - `%p`, percentage relative to the length of the popper element
+   * - `vw`, CSS viewport width unit
+   * - `vh`, CSS viewport height unit
+   *
+   * For length is intended the main axis relative to the placement of the popper.<br />
+   * This means that if the placement is `top` or `bottom`, the length will be the
+   * `width`. In case of `left` or `right`, it will be the height.
+   *
+   * You can provide a single value (as `Number` or `String`), or a pair of values
+   * as `String` divided by a comma or one (or more) white spaces.<br />
+   * The latter is a deprecated method because it leads to confusion and will be
+   * removed in v2.<br />
+   * Additionally, it accepts additions and subtractions between different units.
+   * Note that multiplications and divisions aren't supported.
+   *
+   * Valid examples are:
+   * ```
+   * 10
+   * '10%'
+   * '10, 10'
+   * '10%, 10'
+   * '10 + 10%'
+   * '10 - 5vh + 3%'
+   * '-10px + 5vh, 5px - 6%'
+   * ```
+   * > **NB**: If you desire to apply offsets to your poppers in a way that may make them overlap
+   * > with their reference element, unfortunately, you will have to disable the `flip` modifier.
+   * > More on this [reading this issue](https://github.com/FezVrasta/popper.js/issues/373)
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  offset: {
+    /** @prop {number} order=200 - Index used to define the order of execution */
+    order: 200,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: offset,
+    /** @prop {Number|String} offset=0
+     * The offset value as described in the modifier description
+     */
+    offset: 0
+  },
+
+  /**
+   * Modifier used to prevent the popper from being positioned outside the boundary.
+   *
+   * An scenario exists where the reference itself is not within the boundaries.<br />
+   * We can say it has "escaped the boundaries" — or just "escaped".<br />
+   * In this case we need to decide whether the popper should either:
+   *
+   * - detach from the reference and remain "trapped" in the boundaries, or
+   * - if it should ignore the boundary and "escape with its reference"
+   *
+   * When `escapeWithReference` is set to`true` and reference is completely
+   * outside its boundaries, the popper will overflow (or completely leave)
+   * the boundaries in order to remain attached to the edge of the reference.
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  preventOverflow: {
+    /** @prop {number} order=300 - Index used to define the order of execution */
+    order: 300,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: preventOverflow,
+    /**
+     * @prop {Array} [priority=['left','right','top','bottom']]
+     * Popper will try to prevent overflow following these priorities by default,
+     * then, it could overflow on the left and on top of the `boundariesElement`
+     */
+    priority: ['left', 'right', 'top', 'bottom'],
+    /**
+     * @prop {number} padding=5
+     * Amount of pixel used to define a minimum distance between the boundaries
+     * and the popper this makes sure the popper has always a little padding
+     * between the edges of its container
+     */
+    padding: 5,
+    /**
+     * @prop {String|HTMLElement} boundariesElement='scrollParent'
+     * Boundaries used by the modifier, can be `scrollParent`, `window`,
+     * `viewport` or any DOM element.
+     */
+    boundariesElement: 'scrollParent'
+  },
+
+  /**
+   * Modifier used to make sure the reference and its popper stay near eachothers
+   * without leaving any gap between the two. Expecially useful when the arrow is
+   * enabled and you want to assure it to point to its reference element.
+   * It cares only about the first axis, you can still have poppers with margin
+   * between the popper and its reference element.
+   * @memberof modifiers
+   * @inner
+   */
+  keepTogether: {
+    /** @prop {number} order=400 - Index used to define the order of execution */
+    order: 400,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: keepTogether
+  },
+
+  /**
+   * This modifier is used to move the `arrowElement` of the popper to make
+   * sure it is positioned between the reference element and its popper element.
+   * It will read the outer size of the `arrowElement` node to detect how many
+   * pixels of conjuction are needed.
+   *
+   * It has no effect if no `arrowElement` is provided.
+   * @memberof modifiers
+   * @inner
+   */
+  arrow: {
+    /** @prop {number} order=500 - Index used to define the order of execution */
+    order: 500,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: arrow,
+    /** @prop {String|HTMLElement} element='[x-arrow]' - Selector or node used as arrow */
+    element: '[x-arrow]'
+  },
+
+  /**
+   * Modifier used to flip the popper's placement when it starts to overlap its
+   * reference element.
+   *
+   * Requires the `preventOverflow` modifier before it in order to work.
+   *
+   * **NOTE:** this modifier will interrupt the current update cycle and will
+   * restart it if it detects the need to flip the placement.
+   * @memberof modifiers
+   * @inner
+   */
+  flip: {
+    /** @prop {number} order=600 - Index used to define the order of execution */
+    order: 600,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: flip,
+    /**
+     * @prop {String|Array} behavior='flip'
+     * The behavior used to change the popper's placement. It can be one of
+     * `flip`, `clockwise`, `counterclockwise` or an array with a list of valid
+     * placements (with optional variations).
+     */
+    behavior: 'flip',
+    /**
+     * @prop {number} padding=5
+     * The popper will flip if it hits the edges of the `boundariesElement`
+     */
+    padding: 5,
+    /**
+     * @prop {String|HTMLElement} boundariesElement='viewport'
+     * The element which will define the boundaries of the popper position,
+     * the popper will never be placed outside of the defined boundaries
+     * (except if keepTogether is enabled)
+     */
+    boundariesElement: 'viewport'
+  },
+
+  /**
+   * Modifier used to make the popper flow toward the inner of the reference element.
+   * By default, when this modifier is disabled, the popper will be placed outside
+   * the reference element.
+   * @memberof modifiers
+   * @inner
+   */
+  inner: {
+    /** @prop {number} order=700 - Index used to define the order of execution */
+    order: 700,
+    /** @prop {Boolean} enabled=false - Whether the modifier is enabled or not */
+    enabled: false,
+    /** @prop {ModifierFn} */
+    fn: inner
+  },
+
+  /**
+   * Modifier used to hide the popper when its reference element is outside of the
+   * popper boundaries. It will set a `x-out-of-boundaries` attribute which can
+   * be used to hide with a CSS selector the popper when its reference is
+   * out of boundaries.
+   *
+   * Requires the `preventOverflow` modifier before it in order to work.
+   * @memberof modifiers
+   * @inner
+   */
+  hide: {
+    /** @prop {number} order=800 - Index used to define the order of execution */
+    order: 800,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: hide
+  },
+
+  /**
+   * Computes the style that will be applied to the popper element to gets
+   * properly positioned.
+   *
+   * Note that this modifier will not touch the DOM, it just prepares the styles
+   * so that `applyStyle` modifier can apply it. This separation is useful
+   * in case you need to replace `applyStyle` with a custom implementation.
+   *
+   * This modifier has `850` as `order` value to maintain backward compatibility
+   * with previous versions of Popper.js. Expect the modifiers ordering method
+   * to change in future major versions of the library.
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  computeStyle: {
+    /** @prop {number} order=850 - Index used to define the order of execution */
+    order: 850,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: computeStyle,
+    /**
+     * @prop {Boolean} gpuAcceleration=true
+     * If true, it uses the CSS 3d transformation to position the popper.
+     * Otherwise, it will use the `top` and `left` properties.
+     */
+    gpuAcceleration: true,
+    /**
+     * @prop {string} [x='bottom']
+     * Where to anchor the X axis (`bottom` or `top`). AKA X offset origin.
+     * Change this if your popper should grow in a direction different from `bottom`
+     */
+    x: 'bottom',
+    /**
+     * @prop {string} [x='left']
+     * Where to anchor the Y axis (`left` or `right`). AKA Y offset origin.
+     * Change this if your popper should grow in a direction different from `right`
+     */
+    y: 'right'
+  },
+
+  /**
+   * Applies the computed styles to the popper element.
+   *
+   * All the DOM manipulations are limited to this modifier. This is useful in case
+   * you want to integrate Popper.js inside a framework or view library and you
+   * want to delegate all the DOM manipulations to it.
+   *
+   * Note that if you disable this modifier, you must make sure the popper element
+   * has its position set to `absolute` before Popper.js can do its work!
+   *
+   * Just disable this modifier and define you own to achieve the desired effect.
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  applyStyle: {
+    /** @prop {number} order=900 - Index used to define the order of execution */
+    order: 900,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: applyStyle,
+    /** @prop {Function} */
+    onLoad: applyStyleOnLoad,
+    /**
+     * @deprecated since version 1.10.0, the property moved to `computeStyle` modifier
+     * @prop {Boolean} gpuAcceleration=true
+     * If true, it uses the CSS 3d transformation to position the popper.
+     * Otherwise, it will use the `top` and `left` properties.
+     */
+    gpuAcceleration: undefined
+  }
+};
+
+/**
+ * The `dataObject` is an object containing all the informations used by Popper.js
+ * this object get passed to modifiers and to the `onCreate` and `onUpdate` callbacks.
+ * @name dataObject
+ * @property {Object} data.instance The Popper.js instance
+ * @property {String} data.placement Placement applied to popper
+ * @property {String} data.originalPlacement Placement originally defined on init
+ * @property {Boolean} data.flipped True if popper has been flipped by flip modifier
+ * @property {Boolean} data.hide True if the reference element is out of boundaries, useful to know when to hide the popper.
+ * @property {HTMLElement} data.arrowElement Node used as arrow by arrow modifier
+ * @property {Object} data.styles Any CSS property defined here will be applied to the popper, it expects the JavaScript nomenclature (eg. `marginBottom`)
+ * @property {Object} data.arrowStyles Any CSS property defined here will be applied to the popper arrow, it expects the JavaScript nomenclature (eg. `marginBottom`)
+ * @property {Object} data.boundaries Offsets of the popper boundaries
+ * @property {Object} data.offsets The measurements of popper, reference and arrow elements.
+ * @property {Object} data.offsets.popper `top`, `left`, `width`, `height` values
+ * @property {Object} data.offsets.reference `top`, `left`, `width`, `height` values
+ * @property {Object} data.offsets.arrow] `top` and `left` offsets, only one of them will be different from 0
+ */
+
+/**
+ * Default options provided to Popper.js constructor.<br />
+ * These can be overriden using the `options` argument of Popper.js.<br />
+ * To override an option, simply pass as 3rd argument an object with the same
+ * structure of this object, example:
+ * ```
+ * new Popper(ref, pop, {
+ *   modifiers: {
+ *     preventOverflow: { enabled: false }
+ *   }
+ * })
+ * ```
+ * @type {Object}
+ * @static
+ * @memberof Popper
+ */
+var Defaults = {
+  /**
+   * Popper's placement
+   * @prop {Popper.placements} placement='bottom'
+   */
+  placement: 'bottom',
+
+  /**
+   * Whether events (resize, scroll) are initially enabled
+   * @prop {Boolean} eventsEnabled=true
+   */
+  eventsEnabled: true,
+
+  /**
+   * Set to true if you want to automatically remove the popper when
+   * you call the `destroy` method.
+   * @prop {Boolean} removeOnDestroy=false
+   */
+  removeOnDestroy: false,
+
+  /**
+   * Callback called when the popper is created.<br />
+   * By default, is set to no-op.<br />
+   * Access Popper.js instance with `data.instance`.
+   * @prop {onCreate}
+   */
+  onCreate: function onCreate() {},
+
+  /**
+   * Callback called when the popper is updated, this callback is not called
+   * on the initialization/creation of the popper, but only on subsequent
+   * updates.<br />
+   * By default, is set to no-op.<br />
+   * Access Popper.js instance with `data.instance`.
+   * @prop {onUpdate}
+   */
+  onUpdate: function onUpdate() {},
+
+  /**
+   * List of modifiers used to modify the offsets before they are applied to the popper.
+   * They provide most of the functionalities of Popper.js
+   * @prop {modifiers}
+   */
+  modifiers: modifiers
+};
+
+/**
+ * @callback onCreate
+ * @param {dataObject} data
+ */
+
+/**
+ * @callback onUpdate
+ * @param {dataObject} data
+ */
+
+// Utils
+// Methods
+var Popper = function () {
+  /**
+   * Create a new Popper.js instance
+   * @class Popper
+   * @param {HTMLElement|referenceObject} reference - The reference element used to position the popper
+   * @param {HTMLElement} popper - The HTML element used as popper.
+   * @param {Object} options - Your custom options to override the ones defined in [Defaults](#defaults)
+   * @return {Object} instance - The generated Popper.js instance
+   */
+  function Popper(reference, popper) {
+    var _this = this;
+
+    var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+    classCallCheck$1(this, Popper);
+
+    this.scheduleUpdate = function () {
+      return requestAnimationFrame(_this.update);
+    };
+
+    // make update() debounced, so that it only runs at most once-per-tick
+    this.update = debounce(this.update.bind(this));
+
+    // with {} we create a new object with the options inside it
+    this.options = _extends$1({}, Popper.Defaults, options);
+
+    // init state
+    this.state = {
+      isDestroyed: false,
+      isCreated: false,
+      scrollParents: []
+    };
+
+    // get reference and popper elements (allow jQuery wrappers)
+    this.reference = reference && reference.jquery ? reference[0] : reference;
+    this.popper = popper && popper.jquery ? popper[0] : popper;
+
+    // Deep merge modifiers options
+    this.options.modifiers = {};
+    Object.keys(_extends$1({}, Popper.Defaults.modifiers, options.modifiers)).forEach(function (name) {
+      _this.options.modifiers[name] = _extends$1({}, Popper.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {});
+    });
+
+    // Refactoring modifiers' list (Object => Array)
+    this.modifiers = Object.keys(this.options.modifiers).map(function (name) {
+      return _extends$1({
+        name: name
+      }, _this.options.modifiers[name]);
+    })
+    // sort the modifiers by order
+    .sort(function (a, b) {
+      return a.order - b.order;
+    });
+
+    // modifiers have the ability to execute arbitrary code when Popper.js get inited
+    // such code is executed in the same order of its modifier
+    // they could add new properties to their options configuration
+    // BE AWARE: don't add options to `options.modifiers.name` but to `modifierOptions`!
+    this.modifiers.forEach(function (modifierOptions) {
+      if (modifierOptions.enabled && isFunction(modifierOptions.onLoad)) {
+        modifierOptions.onLoad(_this.reference, _this.popper, _this.options, modifierOptions, _this.state);
+      }
+    });
+
+    // fire the first update to position the popper in the right place
+    this.update();
+
+    var eventsEnabled = this.options.eventsEnabled;
+    if (eventsEnabled) {
+      // setup event listeners, they will take care of update the position in specific situations
+      this.enableEventListeners();
+    }
+
+    this.state.eventsEnabled = eventsEnabled;
+  }
+
+  // We can't use class properties because they don't get listed in the
+  // class prototype and break stuff like Sinon stubs
+
+
+  createClass$1(Popper, [{
+    key: 'update',
+    value: function update$$1() {
+      return update.call(this);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy$$1() {
+      return destroy.call(this);
+    }
+  }, {
+    key: 'enableEventListeners',
+    value: function enableEventListeners$$1() {
+      return enableEventListeners.call(this);
+    }
+  }, {
+    key: 'disableEventListeners',
+    value: function disableEventListeners$$1() {
+      return disableEventListeners.call(this);
+    }
+
+    /**
+     * Schedule an update, it will run on the next UI update available
+     * @method scheduleUpdate
+     * @memberof Popper
+     */
+
+    /**
+     * Collection of utilities useful when writing custom modifiers.
+     * Starting from version 1.7, this method is available only if you
+     * include `popper-utils.js` before `popper.js`.
+     *
+     * **DEPRECATION**: This way to access PopperUtils is deprecated
+     * and will be removed in v2! Use the PopperUtils module directly instead.
+     * Due to the high instability of the methods contained in Utils, we can't
+     * guarantee them to follow semver. Use them at your own risk!
+     * @static
+     * @private
+     * @type {Object}
+     * @deprecated since version 1.8
+     * @member Utils
+     * @memberof Popper
+     */
+
+  }]);
+  return Popper;
+}();
+
+/**
+ * The `referenceObject` is an object that provides an interface compatible with Popper.js
+ * and lets you use it as replacement of a real DOM node.<br />
+ * You can use this method to position a popper relatively to a set of coordinates
+ * in case you don't have a DOM node to use as reference.
+ *
+ * ```
+ * new Popper(referenceObject, popperNode);
+ * ```
+ *
+ * NB: This feature isn't supported in Internet Explorer 10
+ * @name referenceObject
+ * @property {Function} data.getBoundingClientRect
+ * A function that returns a set of coordinates compatible with the native `getBoundingClientRect` method.
+ * @property {number} data.clientWidth
+ * An ES6 getter that will return the width of the virtual reference element.
+ * @property {number} data.clientHeight
+ * An ES6 getter that will return the height of the virtual reference element.
+ */
+
+Popper.Utils = (typeof window !== 'undefined' ? window : global).PopperUtils;
+Popper.placements = placements;
+Popper.Defaults = Defaults;
+
+/**
+ * Returns the core placement ('top', 'bottom', 'left', 'right') of a popper
+ * @param {Element} popper
+ * @return {String}
+ */
+function getPopperPlacement(popper) {
+  return popper.getAttribute('x-placement').replace(/-.+/, '');
+}
+
+/**
+ * Determines if the mouse's cursor is outside the interactive border
+ * @param {MouseEvent} event
+ * @param {Element} popper
+ * @param {Object} options
+ * @return {Boolean}
+ */
+function cursorIsOutsideInteractiveBorder(event, popper, options) {
+  if (!popper.getAttribute('x-placement')) return true;
+
+  var x = event.clientX,
+      y = event.clientY;
+  var interactiveBorder = options.interactiveBorder,
+      distance = options.distance;
+
+
+  var rect = popper.getBoundingClientRect();
+  var placement = getPopperPlacement(popper);
+  var borderWithDistance = interactiveBorder + distance;
+
+  var exceeds = {
+    top: rect.top - y > interactiveBorder,
+    bottom: y - rect.bottom > interactiveBorder,
+    left: rect.left - x > interactiveBorder,
+    right: x - rect.right > interactiveBorder
+  };
+
+  switch (placement) {
+    case 'top':
+      exceeds.top = rect.top - y > borderWithDistance;
+      break;
+    case 'bottom':
+      exceeds.bottom = y - rect.bottom > borderWithDistance;
+      break;
+    case 'left':
+      exceeds.left = rect.left - x > borderWithDistance;
+      break;
+    case 'right':
+      exceeds.right = x - rect.right > borderWithDistance;
+      break;
+  }
+
+  return exceeds.top || exceeds.bottom || exceeds.left || exceeds.right;
+}
+
+/**
+ * Transforms the `arrowTransform` numbers based on the placement axis
+ * @param {String} type 'scale' or 'translate'
+ * @param {Number[]} numbers
+ * @param {Boolean} isVertical
+ * @param {Boolean} isReverse
+ * @return {String}
+ */
+function transformNumbersBasedOnPlacementAxis(type, numbers, isVertical, isReverse) {
+  if (!numbers.length) return '';
+
+  var transforms = {
+    scale: function () {
+      if (numbers.length === 1) {
+        return '' + numbers[0];
+      } else {
+        return isVertical ? numbers[0] + ', ' + numbers[1] : numbers[1] + ', ' + numbers[0];
+      }
+    }(),
+    translate: function () {
+      if (numbers.length === 1) {
+        return isReverse ? -numbers[0] + 'px' : numbers[0] + 'px';
+      } else {
+        if (isVertical) {
+          return isReverse ? numbers[0] + 'px, ' + -numbers[1] + 'px' : numbers[0] + 'px, ' + numbers[1] + 'px';
+        } else {
+          return isReverse ? -numbers[1] + 'px, ' + numbers[0] + 'px' : numbers[1] + 'px, ' + numbers[0] + 'px';
+        }
+      }
+    }()
+  };
+
+  return transforms[type];
+}
+
+/**
+ * Transforms the `arrowTransform` x or y axis based on the placement axis
+ * @param {String} axis 'X', 'Y', ''
+ * @param {Boolean} isVertical
+ * @return {String}
+ */
+function transformAxis(axis, isVertical) {
+  if (!axis) return '';
+  var map = {
+    X: 'Y',
+    Y: 'X'
+  };
+  return isVertical ? axis : map[axis];
+}
+
+/**
+ * Computes and applies the necessary arrow transform
+ * @param {Element} popper
+ * @param {Element} arrow
+ * @param {String} arrowTransform
+ */
+function computeArrowTransform(popper, arrow, arrowTransform) {
+  var placement = getPopperPlacement(popper);
+  var isVertical = placement === 'top' || placement === 'bottom';
+  var isReverse = placement === 'right' || placement === 'bottom';
+
+  var getAxis = function getAxis(re) {
+    var match = arrowTransform.match(re);
+    return match ? match[1] : '';
+  };
+
+  var getNumbers = function getNumbers(re) {
+    var match = arrowTransform.match(re);
+    return match ? match[1].split(',').map(parseFloat) : [];
+  };
+
+  var re = {
+    translate: /translateX?Y?\(([^)]+)\)/,
+    scale: /scaleX?Y?\(([^)]+)\)/
+  };
+
+  var matches = {
+    translate: {
+      axis: getAxis(/translate([XY])/),
+      numbers: getNumbers(re.translate)
+    },
+    scale: {
+      axis: getAxis(/scale([XY])/),
+      numbers: getNumbers(re.scale)
+    }
+  };
+
+  var computedTransform = arrowTransform.replace(re.translate, 'translate' + transformAxis(matches.translate.axis, isVertical) + '(' + transformNumbersBasedOnPlacementAxis('translate', matches.translate.numbers, isVertical, isReverse) + ')').replace(re.scale, 'scale' + transformAxis(matches.scale.axis, isVertical) + '(' + transformNumbersBasedOnPlacementAxis('scale', matches.scale.numbers, isVertical, isReverse) + ')');
+
+  arrow.style[prefix('transform')] = computedTransform;
+}
+
+/**
+ * Returns the distance taking into account the default distance due to
+ * the transform: translate setting in CSS
+ * @param {Number} distance
+ * @return {String}
+ */
+function getOffsetDistanceInPx(distance) {
+  return -(distance - defaults.distance) + 'px';
+}
+
+/**
+ * Waits until next repaint to execute a fn
+ * @param {Function} fn
+ */
+function defer(fn) {
+  requestAnimationFrame(function () {
+    setTimeout(fn, 1);
+  });
+}
+
+var matches = {};
+
+if (isBrowser) {
+  var e = Element.prototype;
+  matches = e.matches || e.matchesSelector || e.webkitMatchesSelector || e.mozMatchesSelector || e.msMatchesSelector || function (s) {
+    var matches = (this.document || this.ownerDocument).querySelectorAll(s);
+    var i = matches.length;
+    while (--i >= 0 && matches.item(i) !== this) {} // eslint-disable-line no-empty
+    return i > -1;
+  };
+}
+
+var matches$1 = matches;
+
+/**
+ * Ponyfill to get the closest parent element
+ * @param {Element} element - child of parent to be returned
+ * @param {String} parentSelector - selector to match the parent if found
+ * @return {Element}
+ */
+function closest(element, parentSelector) {
+  var fn = Element.prototype.closest || function (selector) {
+    var el = this;
+    while (el) {
+      if (matches$1.call(el, selector)) {
+        return el;
+      }
+      el = el.parentElement;
+    }
+  };
+
+  return fn.call(element, parentSelector);
+}
+
+/**
+ * Returns duration taking into account the option being either a number or array
+ * @param {Number} duration
+ * @param {Number} index
+ * @return {Number}
+ */
+function getDuration(duration, index) {
+  return Array.isArray(duration) ? duration[index] : duration;
+}
+
+/**
+ * Sets the visibility state of an element for transition to begin
+ * @param {Element[]} els - array of elements
+ * @param {String} type - 'visible' or 'hidden'
+ */
+function setVisibilityState(els, type) {
+  els.forEach(function (el) {
+    if (!el) return;
+    el.setAttribute('data-state', type);
+  });
+}
+
+/**
+ * Applies the transition duration to each element
+ * @param {Element[]} els - Array of elements
+ * @param {Number} duration
+ */
+function applyTransitionDuration(els, duration) {
+  els.forEach(function (el) {
+    if (!el) return;
+    el.style[prefix('transitionDuration')] = duration + 'ms';
+  });
+}
+
+/**
+ * Triggers document reflow.
+ * Use void because some minifiers or engines think simply accessing the property
+ * is unnecessary.
+ * @param {Element} popper
+ */
+function reflow(popper) {
+  void popper.offsetHeight;
+}
+
+/**
+ * Focuses an element while preventing a scroll jump if it's not entirely within the viewport
+ * @param {Element} el
+ */
+function focus(el) {
+  var x = window.scrollX || window.pageXOffset;
+  var y = window.scrollY || window.pageYOffset;
+  el.focus();
+  scroll(x, y);
+}
+
+var T = (function () {
+  var key = {};
+  var store = function store(data) {
+    return function (k) {
+      return k === key && data;
+    };
+  };
+
+  var Tippy = function () {
+    function Tippy(config) {
+      classCallCheck(this, Tippy);
+
+      for (var _key in config) {
+        this[_key] = config[_key];
+      }
+
+      this.state = {
+        destroyed: false,
+        visible: false,
+        enabled: true
+      };
+
+      this._ = store({
+        mutationObservers: []
+      });
+    }
+
+    /**
+     * Enables the tooltip to allow it to show or hide
+     * @memberof Tippy
+     * @public
+     */
+
+
+    createClass(Tippy, [{
+      key: 'enable',
+      value: function enable() {
+        this.state.enabled = true;
+      }
+
+      /**
+       * Disables the tooltip from showing or hiding, but does not destroy it
+       * @memberof Tippy
+       * @public
+       */
+
+    }, {
+      key: 'disable',
+      value: function disable() {
+        this.state.enabled = false;
+      }
+
+      /**
+       * Shows the tooltip
+       * @param {Number} duration in milliseconds
+       * @memberof Tippy
+       * @public
+       */
+
+    }, {
+      key: 'show',
+      value: function show(duration) {
+        var _this = this;
+
+        if (this.state.destroyed || !this.state.enabled) return;
+
+        var popper = this.popper,
+            reference = this.reference,
+            options = this.options;
+
+        var _getInnerElements = getInnerElements(popper),
+            tooltip = _getInnerElements.tooltip,
+            backdrop = _getInnerElements.backdrop,
+            content = _getInnerElements.content;
+
+        // If the `dynamicTitle` option is true, the instance is allowed
+        // to be created with an empty title. Make sure that the tooltip
+        // content is not empty before showing it
+
+
+        if (options.dynamicTitle && !reference.getAttribute('data-original-title')) return;
+
+        // Destroy tooltip if the reference element is no longer on the DOM
+        if (!reference.refObj && !document.documentElement.contains(reference)) {
+          this.destroy();
+          return;
+        }
+
+        options.onShow.call(popper, this);
+
+        duration = getDuration(duration !== undefined ? duration : options.duration, 0);
+
+        // Prevent a transition when popper changes position
+        applyTransitionDuration([popper, tooltip, backdrop], 0);
+
+        popper.style.visibility = 'visible';
+        this.state.visible = true;
+
+        _mount.call(this, function () {
+          // ~20ms can elapse before this defer callback is run, so the hide() method
+          // may have been invoked -- check if the popper is still visible and cancel
+          // this callback if not
+          if (!_this.state.visible) return;
+
+          if (!options.followCursor || browser.usingTouch) {
+            _this.popperInstance.scheduleUpdate();
+            applyTransitionDuration([popper], options.updateDuration);
+          }
+
+          // Set initial position near the cursor
+          if (options.followCursor && !browser.usingTouch) {
+            _this.popperInstance.disableEventListeners();
+            var delay = Array.isArray(options.delay) ? options.delay[0] : options.delay;
+            if (_this._(key).lastTriggerEvent) {
+              _this._(key).followCursorListener(delay && _this._(key).lastMouseMoveEvent ? _this._(key).lastMouseMoveEvent : _this._(key).lastTriggerEvent);
+            }
+          }
+
+          // Re-apply transition durations
+          applyTransitionDuration([tooltip, backdrop, backdrop ? content : null], duration);
+
+          if (backdrop) {
+            getComputedStyle(backdrop)[prefix('transform')];
+          }
+
+          if (options.interactive) {
+            reference.classList.add('tippy-active');
+          }
+
+          if (options.sticky) {
+            _makeSticky.call(_this);
+          }
+
+          setVisibilityState([tooltip, backdrop], 'visible');
+
+          _onTransitionEnd.call(_this, duration, function () {
+            if (!options.updateDuration) {
+              tooltip.classList.add('tippy-notransition');
+            }
+
+            if (options.interactive) {
+              focus(popper);
+            }
+
+            reference.setAttribute('aria-describedby', 'tippy-' + _this.id);
+
+            options.onShown.call(popper, _this);
+          });
+        });
+      }
+
+      /**
+       * Hides the tooltip
+       * @param {Number} duration in milliseconds
+       * @memberof Tippy
+       * @public
+       */
+
+    }, {
+      key: 'hide',
+      value: function hide(duration) {
+        var _this2 = this;
+
+        if (this.state.destroyed || !this.state.enabled) return;
+
+        var popper = this.popper,
+            reference = this.reference,
+            options = this.options;
+
+        var _getInnerElements2 = getInnerElements(popper),
+            tooltip = _getInnerElements2.tooltip,
+            backdrop = _getInnerElements2.backdrop,
+            content = _getInnerElements2.content;
+
+        options.onHide.call(popper, this);
+
+        duration = getDuration(duration !== undefined ? duration : options.duration, 1);
+
+        if (!options.updateDuration) {
+          tooltip.classList.remove('tippy-notransition');
+        }
+
+        if (options.interactive) {
+          reference.classList.remove('tippy-active');
+        }
+
+        popper.style.visibility = 'hidden';
+        this.state.visible = false;
+
+        applyTransitionDuration([tooltip, backdrop, backdrop ? content : null], duration);
+
+        setVisibilityState([tooltip, backdrop], 'hidden');
+
+        if (options.interactive && options.trigger.indexOf('click') > -1) {
+          focus(reference);
+        }
+
+        /*
+        * This call is deferred because sometimes when the tooltip is still transitioning in but hide()
+        * is called before it finishes, the CSS transition won't reverse quickly enough, meaning
+        * the CSS transition will finish 1-2 frames later, and onHidden() will run since the JS set it
+        * more quickly. It should actually be onShown(). Seems to be something Chrome does, not Safari
+        */
+        defer(function () {
+          _onTransitionEnd.call(_this2, duration, function () {
+            if (_this2.state.visible || !options.appendTo.contains(popper)) return;
+
+            if (!_this2._(key).isPreparingToShow) {
+              document.removeEventListener('mousemove', _this2._(key).followCursorListener);
+              _this2._(key).lastMouseMoveEvent = null;
+            }
+
+            reference.removeAttribute('aria-describedby');
+            _this2.popperInstance.disableEventListeners();
+            options.appendTo.removeChild(popper);
+            options.onHidden.call(popper, _this2);
+          });
+        });
+      }
+
+      /**
+       * Destroys the tooltip instance
+       * @param {Boolean} destroyTargetInstances - relevant only when destroying delegates
+       * @memberof Tippy
+       * @public
+       */
+
+    }, {
+      key: 'destroy',
+      value: function destroy() {
+        var _this3 = this;
+
+        var destroyTargetInstances = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+
+        if (this.state.destroyed) return;
+
+        // Ensure the popper is hidden
+        if (this.state.visible) {
+          this.hide(0);
+        }
+
+        this.listeners.forEach(function (listener) {
+          _this3.reference.removeEventListener(listener.event, listener.handler);
+        });
+
+        // Restore title
+        this.reference.setAttribute('title', this.reference.getAttribute('data-original-title'));
+
+        delete this.reference._tippy;
+
+        var attributes = ['data-original-title', 'data-tippy', 'data-tippy-delegate'];
+        attributes.forEach(function (attr) {
+          _this3.reference.removeAttribute(attr);
+        });
+
+        if (this.options.target && destroyTargetInstances) {
+          toArray(this.reference.querySelectorAll(this.options.target)).forEach(function (child) {
+            return child._tippy && child._tippy.destroy();
+          });
+        }
+
+        if (this.popperInstance) {
+          this.popperInstance.destroy();
+        }
+
+        this._(key).mutationObservers.forEach(function (observer) {
+          observer.disconnect();
+        });
+
+        this.state.destroyed = true;
+      }
+    }]);
+    return Tippy;
+  }();
+
+  /**
+   * ------------------------------------------------------------------------
+   * Private methods
+   * ------------------------------------------------------------------------
+   * Standalone functions to be called with the instance's `this` context to make
+   * them truly private and not accessible on the prototype
+   */
+
+  /**
+   * Creates the Tippy instance for the child target of the delegate container
+   * @param {Event} event
+   * @memberof Tippy
+   * @private
+   */
+
+
+  function _createDelegateChildTippy(event) {
+    var targetEl = closest(event.target, this.options.target);
+    if (targetEl && !targetEl._tippy) {
+      var title = targetEl.getAttribute('title') || this.title;
+      if (title) {
+        targetEl.setAttribute('title', title);
+        tippy(targetEl, _extends({}, this.options, { target: null }));
+        targetEl._tippy.show();
+      }
+    }
+  }
+
+  /**
+   * Method used by event listeners to invoke the show method, taking into account delays and
+   * the `wait` option
+   * @param {Event} event
+   * @memberof Tippy
+   * @private
+   */
+  function _enter(event) {
+    var _this4 = this;
+
+    _clearDelayTimeouts.call(this);
+
+    if (this.state.visible) return;
+
+    // Is a delegate, create Tippy instance for the child target
+    if (this.options.target) {
+      _createDelegateChildTippy.call(this, event);
+      return;
+    }
+
+    this._(key).isPreparingToShow = true;
+
+    if (this.options.wait) {
+      this.options.wait.call(this.popper, this.show.bind(this), event);
+      return;
+    }
+
+    // If the tooltip has a delay, we need to be listening to the mousemove as soon as the trigger
+    // event is fired so that it's in the correct position upon mount.
+    if (this.options.followCursor && !browser.usingTouch) {
+      if (!this._(key).followCursorListener) {
+        _setFollowCursorListener.call(this);
+      }
+      document.addEventListener('mousemove', this._(key).followCursorListener);
+    }
+
+    var delay = Array.isArray(this.options.delay) ? this.options.delay[0] : this.options.delay;
+
+    if (delay) {
+      this._(key).showTimeout = setTimeout(function () {
+        _this4.show();
+      }, delay);
+    } else {
+      this.show();
+    }
+  }
+
+  /**
+   * Method used by event listeners to invoke the hide method, taking into account delays
+   * @memberof Tippy
+   * @private
+   */
+  function _leave() {
+    var _this5 = this;
+
+    _clearDelayTimeouts.call(this);
+
+    if (!this.state.visible) return;
+
+    this._(key).isPreparingToShow = false;
+
+    var delay = Array.isArray(this.options.delay) ? this.options.delay[1] : this.options.delay;
+
+    if (delay) {
+      this._(key).hideTimeout = setTimeout(function () {
+        if (!_this5.state.visible) return;
+        _this5.hide();
+      }, delay);
+    } else {
+      this.hide();
+    }
+  }
+
+  /**
+   * Returns relevant listeners for the instance
+   * @return {Object} of listeners
+   * @memberof Tippy
+   * @private
+   */
+  function _getEventListeners() {
+    var _this6 = this;
+
+    var handleTrigger = function handleTrigger(event) {
+      if (!_this6.state.enabled) return;
+
+      var shouldStopEvent = browser.supportsTouch && browser.usingTouch && ['mouseenter', 'mouseover', 'focus'].indexOf(event.type) > -1;
+
+      if (shouldStopEvent && _this6.options.touchHold) return;
+
+      _this6._(key).lastTriggerEvent = event;
+
+      // Toggle show/hide when clicking click-triggered tooltips
+      if (event.type === 'click' && _this6.options.hideOnClick !== 'persistent' && _this6.state.visible) {
+        _leave.call(_this6);
+      } else {
+        _enter.call(_this6, event);
+      }
+
+      // iOS prevents click events from firing
+      if (shouldStopEvent && browser.iOS && _this6.reference.click) {
+        _this6.reference.click();
+      }
+    };
+
+    var handleMouseLeave = function handleMouseLeave(event) {
+      if (['mouseleave', 'mouseout'].indexOf(event.type) > -1 && browser.supportsTouch && browser.usingTouch && _this6.options.touchHold) return;
+
+      if (_this6.options.interactive) {
+        var hide = _leave.bind(_this6);
+
+        // Temporarily handle mousemove to check if the mouse left somewhere other than the popper
+        var handleMouseMove = function handleMouseMove(event) {
+          var referenceCursorIsOver = closest(event.target, selectors.REFERENCE);
+          var cursorIsOverPopper = closest(event.target, selectors.POPPER) === _this6.popper;
+          var cursorIsOverReference = referenceCursorIsOver === _this6.reference;
+
+          if (cursorIsOverPopper || cursorIsOverReference) return;
+
+          if (cursorIsOutsideInteractiveBorder(event, _this6.popper, _this6.options)) {
+            document.body.removeEventListener('mouseleave', hide);
+            document.removeEventListener('mousemove', handleMouseMove);
+
+            _leave.call(_this6);
+          }
+        };
+        document.body.addEventListener('mouseleave', hide);
+        document.addEventListener('mousemove', handleMouseMove);
+        return;
+      }
+
+      _leave.call(_this6);
+    };
+
+    var handleBlur = function handleBlur(event) {
+      if (!event.relatedTarget || browser.usingTouch) return;
+      if (closest(event.relatedTarget, selectors.POPPER)) return;
+
+      _leave.call(_this6);
+    };
+
+    var handleDelegateShow = function handleDelegateShow(event) {
+      if (closest(event.target, _this6.options.target)) {
+        _enter.call(_this6, event);
+      }
+    };
+
+    var handleDelegateHide = function handleDelegateHide(event) {
+      if (closest(event.target, _this6.options.target)) {
+        _leave.call(_this6);
+      }
+    };
+
+    return {
+      handleTrigger: handleTrigger,
+      handleMouseLeave: handleMouseLeave,
+      handleBlur: handleBlur,
+      handleDelegateShow: handleDelegateShow,
+      handleDelegateHide: handleDelegateHide
+    };
+  }
+
+  /**
+   * Creates and returns a new popper instance
+   * @return {Popper}
+   * @memberof Tippy
+   * @private
+   */
+  function _createPopperInstance() {
+    var _this7 = this;
+
+    var popper = this.popper,
+        reference = this.reference,
+        options = this.options;
+
+    var _getInnerElements3 = getInnerElements(popper),
+        tooltip = _getInnerElements3.tooltip;
+
+    var popperOptions = options.popperOptions;
+
+    var arrowSelector = options.arrowType === 'round' ? selectors.ROUND_ARROW : selectors.ARROW;
+    var arrow = tooltip.querySelector(arrowSelector);
+
+    var config = _extends({
+      placement: options.placement
+    }, popperOptions || {}, {
+      modifiers: _extends({}, popperOptions ? popperOptions.modifiers : {}, {
+        arrow: _extends({
+          element: arrowSelector
+        }, popperOptions && popperOptions.modifiers ? popperOptions.modifiers.arrow : {}),
+        flip: _extends({
+          enabled: options.flip,
+          padding: options.distance + 5 /* 5px from viewport boundary */
+          , behavior: options.flipBehavior
+        }, popperOptions && popperOptions.modifiers ? popperOptions.modifiers.flip : {}),
+        offset: _extends({
+          offset: options.offset
+        }, popperOptions && popperOptions.modifiers ? popperOptions.modifiers.offset : {})
+      }),
+      onCreate: function onCreate() {
+        tooltip.style[getPopperPlacement(popper)] = getOffsetDistanceInPx(options.distance);
+
+        if (arrow && options.arrowTransform) {
+          computeArrowTransform(popper, arrow, options.arrowTransform);
+        }
+      },
+      onUpdate: function onUpdate() {
+        var styles = tooltip.style;
+        styles.top = '';
+        styles.bottom = '';
+        styles.left = '';
+        styles.right = '';
+        styles[getPopperPlacement(popper)] = getOffsetDistanceInPx(options.distance);
+
+        if (arrow && options.arrowTransform) {
+          computeArrowTransform(popper, arrow, options.arrowTransform);
+        }
+      }
+    });
+
+    _addMutationObserver.call(this, {
+      target: popper,
+      callback: function callback() {
+        var styles = popper.style;
+        styles[prefix('transitionDuration')] = null;
+
+        var _onUpdate = _this7.popperInstance.options.onUpdate;
+        _this7.popperInstance.options.onUpdate = function () {
+          reflow(_this7.popper);
+          styles[prefix('transitionDuration')] = options.updateDuration + 'ms';
+          _this7.popperInstance.options.onUpdate = _onUpdate;
+        };
+
+        _this7.popperInstance.update();
+      },
+      options: {
+        childList: true,
+        subtree: true,
+        characterData: true
+      }
+    });
+
+    return new Popper(reference, popper, config);
+  }
+
+  /**
+   * Appends the popper element to the DOM, updating or creating the popper instance
+   * @param {Function} callback
+   * @memberof Tippy
+   * @private
+   */
+  function _mount(callback) {
+    var _this8 = this;
+
+    if (!this.popperInstance) {
+      this.popperInstance = _createPopperInstance.call(this);
+    } else {
+      this.popper.style[prefix('transform')] = null;
+      this.popperInstance.scheduleUpdate();
+
+      if (!this.options.followCursor || browser.usingTouch) {
+        this.popperInstance.enableEventListeners();
+      }
+    }
+
+    var _onCreate = this.popperInstance.options.onCreate;
+    var _onUpdate = this.popperInstance.options.onUpdate;
+
+    this.popperInstance.options.onCreate = this.popperInstance.options.onUpdate = function () {
+      reflow(_this8.popper);
+      callback();
+      _this8.popperInstance.options.onUpdate = _onUpdate;
+      _this8.popperInstance.options.onCreate = _onCreate;
+    };
+
+    if (!this.options.appendTo.contains(this.popper)) {
+      this.options.appendTo.appendChild(this.popper);
+    }
+  }
+
+  /**
+   * Clears the show and hide delay timeouts
+   * @memberof Tippy
+   * @private
+   */
+  function _clearDelayTimeouts() {
+    var _ref = this._(key),
+        showTimeout = _ref.showTimeout,
+        hideTimeout = _ref.hideTimeout;
+
+    clearTimeout(showTimeout);
+    clearTimeout(hideTimeout);
+  }
+
+  /**
+   * Sets the mousemove event listener function for `followCursor` option
+   * @memberof Tippy
+   * @private
+   */
+  function _setFollowCursorListener() {
+    var _this9 = this;
+
+    this._(key).followCursorListener = function (event) {
+      // Ignore if the tooltip was triggered by `focus`
+      if (_this9._(key).lastTriggerEvent && _this9._(key).lastTriggerEvent.type === 'focus') return;
+
+      _this9._(key).lastMouseMoveEvent = event;
+
+      // Expensive operations, but their dimensions can change freely
+      var pageWidth = document.documentElement.offsetWidth || document.body.offsetWidth;
+      var halfPopperWidth = Math.round(_this9.popper.offsetWidth / 2);
+      var halfPopperHeight = Math.round(_this9.popper.offsetHeight / 2);
+      var offset = _this9.options.offset;
+      var pageX = event.pageX,
+          pageY = event.pageY;
+
+      var PADDING = 5;
+
+      var placement = _this9.options.placement.replace(/-.+/, '');
+      if (_this9.popper.getAttribute('x-placement')) {
+        placement = getPopperPlacement(_this9.popper);
+      }
+
+      var x = void 0,
+          y = void 0;
+
+      /* eslint-disable indent */
+      switch (placement) {
+        case 'top':
+          x = pageX - halfPopperWidth + offset;
+          y = pageY - 2 * halfPopperHeight;
+          break;
+        case 'bottom':
+          x = pageX - halfPopperWidth + offset;
+          y = pageY + 10;
+          break;
+        case 'left':
+          x = pageX - 2 * halfPopperWidth;
+          y = pageY - halfPopperHeight + offset;
+          break;
+        case 'right':
+          x = pageX + 5;
+          y = pageY - halfPopperHeight + offset;
+          break;
+      }
+      /* eslint-enable indent */
+
+      var isRightOverflowing = pageX + PADDING + halfPopperWidth + offset > pageWidth;
+      var isLeftOverflowing = pageX - PADDING - halfPopperWidth + offset < 0;
+
+      // Prevent left/right overflow
+      if (placement === 'top' || placement === 'bottom') {
+        if (isRightOverflowing) {
+          x = pageWidth - PADDING - 2 * halfPopperWidth;
+        }
+
+        if (isLeftOverflowing) {
+          x = PADDING;
+        }
+      }
+
+      _this9.popper.style[prefix('transform')] = 'translate3d(' + x + 'px, ' + y + 'px, 0)';
+    };
+  }
+
+  /**
+   * Updates the popper's position on each animation frame
+   * @memberof Tippy
+   * @private
+   */
+  function _makeSticky() {
+    var _this10 = this;
+
+    var applyTransitionDuration$$1 = function applyTransitionDuration$$1() {
+      _this10.popper.style[prefix('transitionDuration')] = _this10.options.updateDuration + 'ms';
+    };
+
+    var removeTransitionDuration = function removeTransitionDuration() {
+      _this10.popper.style[prefix('transitionDuration')] = '';
+    };
+
+    var updatePosition = function updatePosition() {
+      if (_this10.popperInstance) {
+        _this10.popperInstance.scheduleUpdate();
+      }
+
+      applyTransitionDuration$$1();
+
+      if (_this10.state.visible) {
+        requestAnimationFrame(updatePosition);
+      } else {
+        removeTransitionDuration();
+      }
+    };
+
+    // Wait until the popper's position has been updated initially
+    defer(updatePosition);
+  }
+
+  /**
+   * Adds a mutation observer to an element and stores it in the instance
+   * @param {Object}
+   * @memberof Tippy
+   * @private
+   */
+  function _addMutationObserver(_ref2) {
+    var target = _ref2.target,
+        callback = _ref2.callback,
+        options = _ref2.options;
+
+    if (!window.MutationObserver) return;
+
+    var observer = new MutationObserver(callback);
+    observer.observe(target, options);
+
+    this._(key).mutationObservers.push(observer);
+  }
+
+  /**
+   * Fires the callback functions once the CSS transition ends for `show` and `hide` methods
+   * @param {Number} duration
+   * @param {Function} callback - callback function to fire once transition completes
+   * @memberof Tippy
+   * @private
+   */
+  function _onTransitionEnd(duration, callback) {
+    // Make callback synchronous if duration is 0
+    if (!duration) {
+      return callback();
+    }
+
+    var _getInnerElements4 = getInnerElements(this.popper),
+        tooltip = _getInnerElements4.tooltip;
+
+    var toggleListeners = function toggleListeners(action, listener) {
+      if (!listener) return;
+      tooltip[action + 'EventListener']('ontransitionend' in window ? 'transitionend' : 'webkitTransitionEnd', listener);
+    };
+
+    var listener = function listener(e) {
+      if (e.target === tooltip) {
+        toggleListeners('remove', listener);
+        callback();
+      }
+    };
+
+    toggleListeners('remove', this._(key).transitionendListener);
+    toggleListeners('add', listener);
+
+    this._(key).transitionendListener = listener;
+  }
+
+  return {
+    Tippy: Tippy,
+    _getEventListeners: _getEventListeners,
+    _addMutationObserver: _addMutationObserver,
+    _createPopperInstance: _createPopperInstance,
+    _onTransitionEnd: _onTransitionEnd
+  };
+})();
+
+var Tippy = T.Tippy;
+var _getEventListeners = T._getEventListeners;
+var _createPopperInstance = T._createPopperInstance;
+var _addMutationObserver = T._addMutationObserver;
+
+
+var idCounter = 1;
+
+/**
+ * Creates tooltips for each reference element
+ * @param {Element[]} els
+ * @param {Object} config
+ * @return {Tippy[]} Array of Tippy instances
+ */
+function createTooltips(els, config) {
+  return els.reduce(function (acc, reference) {
+    var id = idCounter;
+
+    var options = evaluateOptions(reference, config.performance ? config : getIndividualOptions(reference, config));
+
+    var title = reference.getAttribute('title');
+
+    // Don't create an instance when:
+    // * the `title` attribute is falsy (null or empty string), and
+    // * it's not a delegate for tooltips, and
+    // * there is no html template specified, and
+    // * `dynamicTitle` option is false
+    if (!title && !options.target && !options.html && !options.dynamicTitle) {
+      return acc;
+    }
+
+    // Delegates should be highlighted as different
+    reference.setAttribute(options.target ? 'data-tippy-delegate' : 'data-tippy', '');
+
+    removeTitle(reference);
+
+    var popper = createPopperElement(id, title, options);
+
+    var tippy = new Tippy({
+      id: id,
+      reference: reference,
+      popper: popper,
+      options: options,
+      title: title,
+      popperInstance: null
+    });
+
+    if (options.createPopperInstanceOnInit) {
+      tippy.popperInstance = _createPopperInstance.call(tippy);
+      tippy.popperInstance.disableEventListeners();
+    }
+
+    var listeners = _getEventListeners.call(tippy);
+    tippy.listeners = options.trigger.trim().split(' ').reduce(function (acc, eventType) {
+      return acc.concat(createTrigger(eventType, reference, listeners, options));
+    }, []);
+
+    // Update tooltip content whenever the title attribute on the reference changes
+    if (options.dynamicTitle) {
+      _addMutationObserver.call(tippy, {
+        target: reference,
+        callback: function callback() {
+          var _getInnerElements = getInnerElements(popper),
+              content = _getInnerElements.content;
+
+          var title = reference.getAttribute('title');
+          if (title) {
+            content.innerHTML = tippy.title = title;
+            removeTitle(reference);
+          }
+        },
+
+        options: {
+          attributes: true
+        }
+      });
+    }
+
+    // Shortcuts
+    reference._tippy = tippy;
+    popper._tippy = tippy;
+    popper._reference = reference;
+
+    acc.push(tippy);
+
+    idCounter++;
+
+    return acc;
+  }, []);
+}
+
+/**
+ * Hides all poppers
+ * @param {Tippy} excludeTippy - tippy to exclude if needed
+ */
+function hideAllPoppers(excludeTippy) {
+  var poppers = toArray(document.querySelectorAll(selectors.POPPER));
+
+  poppers.forEach(function (popper) {
+    var tippy = popper._tippy;
+    var options = tippy.options;
+
+
+    if ((options.hideOnClick === true || options.trigger.indexOf('focus') > -1) && (!excludeTippy || popper !== excludeTippy.popper)) {
+      tippy.hide();
+    }
+  });
+}
+
+/**
+ * Adds the needed event listeners
+ */
+function bindEventListeners() {
+  var touchHandler = function touchHandler() {
+    if (browser.usingTouch) return;
+
+    browser.usingTouch = true;
+
+    if (browser.iOS) {
+      document.body.classList.add('tippy-touch');
+    }
+
+    if (browser.dynamicInputDetection && window.performance) {
+      document.addEventListener('mousemove', mousemoveHandler);
+    }
+
+    browser.onUserInputChange('touch');
+  };
+
+  var mousemoveHandler = function () {
+    var time = void 0;
+
+    return function () {
+      var now = performance.now();
+
+      // Chrome 60+ is 1 mousemove per animation frame, use 20ms time difference
+      if (now - time < 20) {
+        browser.usingTouch = false;
+        document.removeEventListener('mousemove', mousemoveHandler);
+        if (!browser.iOS) {
+          document.body.classList.remove('tippy-touch');
+        }
+        browser.onUserInputChange('mouse');
+      }
+
+      time = now;
+    };
+  }();
+
+  var clickHandler = function clickHandler(event) {
+    // Simulated events dispatched on the document
+    if (!(event.target instanceof Element)) {
+      return hideAllPoppers();
+    }
+
+    var reference = closest(event.target, selectors.REFERENCE);
+    var popper = closest(event.target, selectors.POPPER);
+
+    if (popper && popper._reference._tippy.options.interactive) return;
+
+    if (reference) {
+      var options = reference._tippy.options;
+
+      // Hide all poppers except the one belonging to the element that was clicked IF
+      // `multiple` is false AND they are a touch user, OR
+      // `multiple` is false AND it's triggered by a click
+
+      if (!options.multiple && browser.usingTouch || !options.multiple && options.trigger.indexOf('click') > -1) {
+        return hideAllPoppers(reference._tippy);
+      }
+
+      if (options.hideOnClick !== true || options.trigger.indexOf('click') > -1) return;
+    }
+
+    hideAllPoppers();
+  };
+
+  var blurHandler = function blurHandler() {
+    var _document = document,
+        el = _document.activeElement;
+
+    if (el && el.blur && matches$1.call(el, selectors.REFERENCE)) {
+      el.blur();
+    }
+  };
+
+  document.addEventListener('click', clickHandler);
+  document.addEventListener('touchstart', touchHandler);
+  window.addEventListener('blur', blurHandler);
+
+  if (!browser.supportsTouch && (navigator.maxTouchPoints || navigator.msMaxTouchPoints)) {
+    document.addEventListener('pointerdown', touchHandler);
+  }
+}
+
+/**
+ * Creates tooltips
+ * @param {String|Element|Element[]|NodeList|Object} selector
+ * @param {Object} options
+ * @return {Object}
+ */
+function tippy(selector, options) {
+  if (browser.supported && !browser._eventListenersBound) {
+    bindEventListeners();
+    browser._eventListenersBound = true;
+  }
+
+  if (isObjectLiteral(selector)) {
+    selector.refObj = true;
+    selector.attributes = selector.attributes || {};
+    selector.setAttribute = function (key, val) {
+      selector.attributes[key] = val;
+    };
+    selector.getAttribute = function (key) {
+      return selector.attributes[key];
+    };
+    selector.removeAttribute = function (key) {
+      delete selector.attributes[key];
+    };
+    selector.addEventListener = function () {};
+    selector.removeEventListener = function () {};
+    selector.classList = {
+      classNames: {},
+      add: function add(key) {
+        return selector.classList.classNames[key] = true;
+      },
+      remove: function remove(key) {
+        delete selector.classList.classNames[key];
+        return true;
+      },
+      contains: function contains(key) {
+        return !!selector.classList.classNames[key];
+      }
+    };
+  }
+
+  options = _extends({}, defaults, options);
+
+  return {
+    selector: selector,
+    options: options,
+    tooltips: browser.supported ? createTooltips(getArrayOfElements(selector), options) : [],
+    destroyAll: function destroyAll() {
+      this.tooltips.forEach(function (tooltip) {
+        return tooltip.destroy();
+      });
+      this.tooltips = [];
+    }
+  };
+}
+
+tippy.browser = browser;
+tippy.defaults = defaults;
+
+/**
+ * Injects CSS styles to document head
+ * @param {String} css
+ */
+function injectCSS() {
+  var css = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+
+  if (isBrowser && browser.supported) {
+    var head = document.head || document.querySelector('head');
+    var style = document.createElement('style');
+    style.type = 'text/css';
+    head.insertBefore(style, head.firstChild);
+
+    if (style.styleSheet) {
+      style.styleSheet.cssText = css;
+    } else {
+      style.appendChild(document.createTextNode(css));
+    }
+  }
+}
+
+injectCSS(styles);
+
+return tippy;
+
+})));
diff --git a/ddb_main/node_modules/tss-react/GlobalStyles.js b/ddb_main/node_modules/tss-react/GlobalStyles.js
new file mode 100644
index 0000000..6273dc6
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/GlobalStyles.js
@@ -0,0 +1,36 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GlobalStyles = void 0;
+const react_1 = __importDefault(require("react"));
+const reactEmotion = __importStar(require("@emotion/react"));
+function GlobalStyles(props) {
+    const { styles } = props;
+    return react_1.default.createElement(reactEmotion.Global, { styles: reactEmotion.css(styles) });
+}
+exports.GlobalStyles = GlobalStyles;
diff --git a/ddb_main/node_modules/tss-react/cache.js b/ddb_main/node_modules/tss-react/cache.js
new file mode 100644
index 0000000..1cc1562
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/cache.js
@@ -0,0 +1,86 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TssCacheProvider = exports.useTssEmotionCache = exports.getTssDefaultEmotionCache = exports.getDoExistsTssDefaultEmotionCacheMemoizedValue = void 0;
+const react_1 = __importStar(require("react"));
+const cache_1 = __importDefault(require("@emotion/cache"));
+const { getDoExistsTssDefaultEmotionCacheMemoizedValue, getTssDefaultEmotionCache, reactContext, } = (() => {
+    const propertyKey = "__tss-react_context";
+    const peerDepObj = 
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    react_1.createContext;
+    let sharedContext = peerDepObj["__tss-react_context"];
+    if (sharedContext === undefined) {
+        const { getTssDefaultEmotionCache, getDoExistsTssDefaultEmotionCacheMemoizedValue, } = (() => {
+            let cache = undefined;
+            /**
+             * Lazily initialized singleton
+             * If doReset is set to true the memoized instance will be
+             * discarded and a new one created.
+             * */
+            function getTssDefaultEmotionCache(params) {
+                const { doReset = false } = params !== null && params !== void 0 ? params : {};
+                if (doReset) {
+                    cache = undefined;
+                }
+                if (cache === undefined) {
+                    cache = (0, cache_1.default)({ "key": "tss" });
+                }
+                return cache;
+            }
+            return {
+                getTssDefaultEmotionCache,
+                "getDoExistsTssDefaultEmotionCacheMemoizedValue": () => cache !== undefined,
+            };
+        })();
+        sharedContext = {
+            getTssDefaultEmotionCache,
+            getDoExistsTssDefaultEmotionCacheMemoizedValue,
+            "reactContext": (0, react_1.createContext)(undefined),
+        };
+        Object.defineProperty(peerDepObj, propertyKey, {
+            "configurable": false,
+            "enumerable": false,
+            "writable": false,
+            "value": sharedContext,
+        });
+    }
+    return sharedContext;
+})();
+exports.getDoExistsTssDefaultEmotionCacheMemoizedValue = getDoExistsTssDefaultEmotionCacheMemoizedValue;
+exports.getTssDefaultEmotionCache = getTssDefaultEmotionCache;
+function useTssEmotionCache() {
+    const cacheExplicitlyProvidedForTss = (0, react_1.useContext)(reactContext);
+    return cacheExplicitlyProvidedForTss !== null && cacheExplicitlyProvidedForTss !== void 0 ? cacheExplicitlyProvidedForTss : getTssDefaultEmotionCache();
+}
+exports.useTssEmotionCache = useTssEmotionCache;
+function TssCacheProvider(props) {
+    const { children, value } = props;
+    return (react_1.default.createElement(reactContext.Provider, { value: value }, children));
+}
+exports.TssCacheProvider = TssCacheProvider;
diff --git a/ddb_main/node_modules/tss-react/cssAndCx.js b/ddb_main/node_modules/tss-react/cssAndCx.js
new file mode 100644
index 0000000..4c2aae8
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/cssAndCx.js
@@ -0,0 +1,101 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCssAndCx = exports.createCssAndCx = void 0;
+const classnames_1 = require("./tools/classnames");
+const serialize_1 = require("@emotion/serialize");
+const utils_1 = require("@emotion/utils");
+const useGuaranteedMemo_1 = require("./tools/useGuaranteedMemo");
+const cache_1 = require("./cache");
+const types_1 = require("./types");
+exports.createCssAndCx = (() => {
+    function merge(registered, css, className) {
+        const registeredStyles = [];
+        const rawClassName = (0, utils_1.getRegisteredStyles)(registered, registeredStyles, className);
+        if (registeredStyles.length < 2) {
+            return className;
+        }
+        return rawClassName + css(registeredStyles);
+    }
+    function createCssAndCx(params) {
+        const { cache } = params;
+        const css = (...args) => {
+            const serialized = (0, serialize_1.serializeStyles)(args, cache.registered);
+            (0, utils_1.insertStyles)(cache, serialized, false);
+            const className = `${cache.key}-${serialized.name}`;
+            scope: {
+                const arg = args[0];
+                if (!(0, types_1.matchCSSObject)(arg)) {
+                    break scope;
+                }
+                increaseSpecificityToTakePrecedenceOverMediaQuerries.saveClassNameCSSObjectMapping(cache, className, arg);
+            }
+            return className;
+        };
+        const cx = (...args) => {
+            const className = (0, classnames_1.classnames)(args);
+            const feat27FixedClassnames = increaseSpecificityToTakePrecedenceOverMediaQuerries.fixClassName(cache, className, css);
+            return merge(cache.registered, css, feat27FixedClassnames);
+            //return merge(cache.registered, css, className);
+        };
+        return { css, cx };
+    }
+    return { createCssAndCx };
+})().createCssAndCx;
+/** Will pickup the contextual cache if any */
+function useCssAndCx() {
+    const cache = (0, cache_1.useTssEmotionCache)();
+    const { css, cx } = (0, useGuaranteedMemo_1.useGuaranteedMemo)(() => (0, exports.createCssAndCx)({ cache }), [cache]);
+    return { css, cx };
+}
+exports.useCssAndCx = useCssAndCx;
+// https://github.com/garronej/tss-react/issues/27
+const increaseSpecificityToTakePrecedenceOverMediaQuerries = (() => {
+    const cssObjectMapByCache = new WeakMap();
+    return {
+        "saveClassNameCSSObjectMapping": (cache, className, cssObject) => {
+            let cssObjectMap = cssObjectMapByCache.get(cache);
+            if (cssObjectMap === undefined) {
+                cssObjectMap = new Map();
+                cssObjectMapByCache.set(cache, cssObjectMap);
+            }
+            cssObjectMap.set(className, cssObject);
+        },
+        "fixClassName": (() => {
+            function fix(classNameCSSObjects) {
+                let isThereAnyMediaQueriesInPreviousClasses = false;
+                return classNameCSSObjects.map(([className, cssObject]) => {
+                    if (cssObject === undefined) {
+                        return className;
+                    }
+                    let out;
+                    if (!isThereAnyMediaQueriesInPreviousClasses) {
+                        out = className;
+                        for (const key in cssObject) {
+                            if (key.startsWith("@media")) {
+                                isThereAnyMediaQueriesInPreviousClasses = true;
+                                break;
+                            }
+                        }
+                    }
+                    else {
+                        out = {
+                            "&&": cssObject,
+                        };
+                    }
+                    return out;
+                });
+            }
+            return (cache, className, css) => {
+                const cssObjectMap = cssObjectMapByCache.get(cache);
+                return (0, classnames_1.classnames)(fix(className
+                    .split(" ")
+                    .map(className => [
+                    className,
+                    cssObjectMap === null || cssObjectMap === void 0 ? void 0 : cssObjectMap.get(className),
+                ])).map(classNameOrCSSObject => typeof classNameOrCSSObject === "string"
+                    ? classNameOrCSSObject
+                    : css(classNameOrCSSObject)));
+            };
+        })(),
+    };
+})();
diff --git a/ddb_main/node_modules/tss-react/index.js b/ddb_main/node_modules/tss-react/index.js
new file mode 100644
index 0000000..4e0ca7c
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/index.js
@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createMakeAndWithStyles = exports.TssCacheProvider = exports.getTssDefaultEmotionCache = exports.GlobalStyles = exports.keyframes = exports.createWithStyles = exports.createMakeStyles = exports.useMergedClasses = exports.useCssAndCx = void 0;
+/** @see <https://docs.tss-react.dev/api-references> */
+var cssAndCx_1 = require("./cssAndCx");
+Object.defineProperty(exports, "useCssAndCx", { enumerable: true, get: function () { return cssAndCx_1.useCssAndCx; } });
+var mergeClasses_1 = require("./mergeClasses");
+Object.defineProperty(exports, "useMergedClasses", { enumerable: true, get: function () { return mergeClasses_1.useMergedClasses; } });
+const makeStyles_1 = require("./makeStyles");
+Object.defineProperty(exports, "createMakeStyles", { enumerable: true, get: function () { return makeStyles_1.createMakeStyles; } });
+const withStyles_1 = require("./withStyles");
+Object.defineProperty(exports, "createWithStyles", { enumerable: true, get: function () { return withStyles_1.createWithStyles; } });
+/** @see <https://docs.tss-react.dev/api-references/keyframes> */
+var react_1 = require("@emotion/react");
+Object.defineProperty(exports, "keyframes", { enumerable: true, get: function () { return react_1.keyframes; } });
+/** @see <https://docs.tss-react.dev/api-references/globalstyles> */
+var GlobalStyles_1 = require("./GlobalStyles");
+Object.defineProperty(exports, "GlobalStyles", { enumerable: true, get: function () { return GlobalStyles_1.GlobalStyles; } });
+/** @see <https://docs.tss-react.dev/cache> */
+var cache_1 = require("./cache");
+Object.defineProperty(exports, "getTssDefaultEmotionCache", { enumerable: true, get: function () { return cache_1.getTssDefaultEmotionCache; } });
+Object.defineProperty(exports, "TssCacheProvider", { enumerable: true, get: function () { return cache_1.TssCacheProvider; } });
+/** @see <https://docs.tss-react.dev/api-references/makestyles-usestyles> */
+function createMakeAndWithStyles(params) {
+    return Object.assign(Object.assign({}, (0, makeStyles_1.createMakeStyles)(params)), (0, withStyles_1.createWithStyles)(params));
+}
+exports.createMakeAndWithStyles = createMakeAndWithStyles;
diff --git a/ddb_main/node_modules/tss-react/makeStyles.js b/ddb_main/node_modules/tss-react/makeStyles.js
new file mode 100644
index 0000000..4d28140
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/makeStyles.js
@@ -0,0 +1,122 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createMakeStyles = void 0;
+/* eslint-disable @typescript-eslint/no-explicit-any */
+const react_1 = require("react");
+const Object_fromEntries_1 = require("./tools/polyfills/Object.fromEntries");
+const objectKeys_1 = require("./tools/objectKeys");
+const cssAndCx_1 = require("./cssAndCx");
+const getDependencyArrayRef_1 = require("./tools/getDependencyArrayRef");
+const typeGuard_1 = require("./tools/typeGuard");
+const cache_1 = require("./cache");
+const assert_1 = require("./tools/assert");
+const mergeClasses_1 = require("./mergeClasses");
+let counter = 0;
+function createMakeStyles(params) {
+    const { useTheme } = params;
+    /** returns useStyle. */
+    function makeStyles(params) {
+        const { name: nameOrWrappedName, uniqId = counter++ } = params !== null && params !== void 0 ? params : {};
+        const name = typeof nameOrWrappedName !== "object"
+            ? nameOrWrappedName
+            : Object.keys(nameOrWrappedName)[0];
+        return function (cssObjectByRuleNameOrGetCssObjectByRuleName) {
+            const getCssObjectByRuleName = typeof cssObjectByRuleNameOrGetCssObjectByRuleName ===
+                "function"
+                ? cssObjectByRuleNameOrGetCssObjectByRuleName
+                : () => cssObjectByRuleNameOrGetCssObjectByRuleName;
+            return function useStyles(params, styleOverrides) {
+                var _a, _b;
+                const theme = useTheme();
+                const { css, cx } = (0, cssAndCx_1.useCssAndCx)();
+                const cache = (0, cache_1.useTssEmotionCache)();
+                let classes = (0, react_1.useMemo)(() => {
+                    const refClassesCache = {};
+                    const refClasses = typeof Proxy !== "undefined" &&
+                        new Proxy({}, {
+                            "get": (_target, propertyKey) => {
+                                if (typeof propertyKey === "symbol") {
+                                    (0, assert_1.assert)(false);
+                                }
+                                return (refClassesCache[propertyKey] = `${cache.key}-${uniqId}${name !== undefined ? `-${name}` : ""}-${propertyKey}-ref`);
+                            },
+                        });
+                    const cssObjectByRuleName = getCssObjectByRuleName(theme, params, refClasses || {});
+                    const classes = (0, Object_fromEntries_1.objectFromEntries)((0, objectKeys_1.objectKeys)(cssObjectByRuleName).map(ruleName => {
+                        const cssObject = cssObjectByRuleName[ruleName];
+                        if (!cssObject.label) {
+                            cssObject.label = `${name !== undefined ? `${name}-` : ""}${ruleName}`;
+                        }
+                        return [
+                            ruleName,
+                            `${css(cssObject)}${(0, typeGuard_1.typeGuard)(ruleName, ruleName in refClassesCache)
+                                ? ` ${refClassesCache[ruleName]}`
+                                : ""}`,
+                        ];
+                    }));
+                    (0, objectKeys_1.objectKeys)(refClassesCache).forEach(ruleName => {
+                        if (ruleName in classes) {
+                            return;
+                        }
+                        classes[ruleName] =
+                            refClassesCache[ruleName];
+                    });
+                    return classes;
+                }, [cache, css, cx, theme, (0, getDependencyArrayRef_1.getDependencyArrayRef)(params)]);
+                const propsClasses = styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.props.classes;
+                {
+                    classes = (0, react_1.useMemo)(() => (0, mergeClasses_1.mergeClasses)(classes, propsClasses, cx), [classes, (0, getDependencyArrayRef_1.getDependencyArrayRef)(propsClasses), cx]);
+                }
+                {
+                    let cssObjectByRuleNameOrGetCssObjectByRuleName = undefined;
+                    try {
+                        cssObjectByRuleNameOrGetCssObjectByRuleName =
+                            name !== undefined
+                                ? (_b = (_a = theme.components) === null || _a === void 0 ? void 0 : _a[name]) === null || _b === void 0 ? void 0 : _b.styleOverrides
+                                : undefined;
+                        // eslint-disable-next-line no-empty
+                    }
+                    catch (_c) { }
+                    const themeClasses = (0, react_1.useMemo)(() => {
+                        if (!cssObjectByRuleNameOrGetCssObjectByRuleName) {
+                            return undefined;
+                        }
+                        const themeClasses = {};
+                        for (const ruleName in cssObjectByRuleNameOrGetCssObjectByRuleName) {
+                            const cssObjectOrGetCssObject = cssObjectByRuleNameOrGetCssObjectByRuleName[ruleName];
+                            if (!(cssObjectOrGetCssObject instanceof Object)) {
+                                continue;
+                            }
+                            themeClasses[ruleName] = css(typeof cssObjectOrGetCssObject === "function"
+                                ? cssObjectOrGetCssObject(Object.assign({ theme, "ownerState": styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.ownerState }, styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.props))
+                                : cssObjectOrGetCssObject);
+                        }
+                        return themeClasses;
+                    }, [
+                        cssObjectByRuleNameOrGetCssObjectByRuleName ===
+                            undefined
+                            ? undefined
+                            : JSON.stringify(cssObjectByRuleNameOrGetCssObjectByRuleName),
+                        (0, getDependencyArrayRef_1.getDependencyArrayRef)(styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.props),
+                        (0, getDependencyArrayRef_1.getDependencyArrayRef)(styleOverrides === null || styleOverrides === void 0 ? void 0 : styleOverrides.ownerState),
+                        css,
+                    ]);
+                    classes = (0, react_1.useMemo)(() => (0, mergeClasses_1.mergeClasses)(classes, themeClasses, cx), [classes, themeClasses, cx]);
+                }
+                return {
+                    classes,
+                    theme,
+                    css,
+                    cx,
+                };
+            };
+        };
+    }
+    function useStyles() {
+        const theme = useTheme();
+        const { css, cx } = (0, cssAndCx_1.useCssAndCx)();
+        return { theme, css, cx };
+    }
+    return { makeStyles, useStyles };
+}
+exports.createMakeStyles = createMakeStyles;
diff --git a/ddb_main/node_modules/tss-react/mergeClasses.js b/ddb_main/node_modules/tss-react/mergeClasses.js
new file mode 100644
index 0000000..042ac2e
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/mergeClasses.js
@@ -0,0 +1,35 @@
+"use strict";
+/* eslint-disable @typescript-eslint/ban-types */
+/* eslint-disable @typescript-eslint/no-explicit-any */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useMergedClasses = exports.mergeClasses = void 0;
+const objectKeys_1 = require("./tools/objectKeys");
+const getDependencyArrayRef_1 = require("./tools/getDependencyArrayRef");
+const cssAndCx_1 = require("./cssAndCx");
+const react_1 = require("react");
+function mergeClasses(classesFromUseStyles, classesFromProps, cx) {
+    //NOTE: We use this test to be resilient in case classesFromProps is not of the expected type.
+    if (!(classesFromProps instanceof Object)) {
+        return classesFromUseStyles;
+    }
+    const out = {};
+    (0, objectKeys_1.objectKeys)(classesFromUseStyles).forEach(ruleName => (out[ruleName] = cx(classesFromUseStyles[ruleName], classesFromProps[ruleName])));
+    (0, objectKeys_1.objectKeys)(classesFromProps).forEach(ruleName => {
+        if (ruleName in classesFromUseStyles) {
+            return;
+        }
+        const className = classesFromProps[ruleName];
+        //...Same here, that why we don't do className === undefined
+        if (typeof className !== "string") {
+            return;
+        }
+        out[ruleName] = className;
+    });
+    return out;
+}
+exports.mergeClasses = mergeClasses;
+function useMergedClasses(classes, classesOv) {
+    const { cx } = (0, cssAndCx_1.useCssAndCx)();
+    return (0, react_1.useMemo)(() => mergeClasses(classes, classesOv, cx), [classes, (0, getDependencyArrayRef_1.getDependencyArrayRef)(classesOv), cx]);
+}
+exports.useMergedClasses = useMergedClasses;
diff --git a/ddb_main/node_modules/tss-react/tools/assert.js b/ddb_main/node_modules/tss-react/tools/assert.js
new file mode 100644
index 0000000..3aa2de6
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/tools/assert.js
@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.assert = void 0;
+/** https://docs.tsafe.dev/assert */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function assert(condition, msg) {
+    if (!condition) {
+        throw new Error(msg);
+    }
+}
+exports.assert = assert;
diff --git a/ddb_main/node_modules/tss-react/tools/capitalize.js b/ddb_main/node_modules/tss-react/tools/capitalize.js
new file mode 100644
index 0000000..7ccf529
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/tools/capitalize.js
@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.capitalize = void 0;
+/** @see <https://docs.tsafe.dev/capitalize> */
+function capitalize(str) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    return (str.charAt(0).toUpperCase() + str.slice(1));
+}
+exports.capitalize = capitalize;
diff --git a/ddb_main/node_modules/tss-react/tools/classnames.js b/ddb_main/node_modules/tss-react/tools/classnames.js
new file mode 100644
index 0000000..836aa16
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/tools/classnames.js
@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.classnames = void 0;
+const assert_1 = require("./assert");
+const typeGuard_1 = require("./typeGuard");
+/** Copy pasted from
+ * https://github.com/emotion-js/emotion/blob/23f43ab9f24d44219b0b007a00f4ac681fe8712e/packages/react/src/class-names.js#L17-L63
+ **/
+const classnames = (args) => {
+    const len = args.length;
+    let i = 0;
+    let cls = "";
+    for (; i < len; i++) {
+        const arg = args[i];
+        if (arg == null)
+            continue;
+        let toAdd;
+        switch (typeof arg) {
+            case "boolean":
+                break;
+            case "object": {
+                if (Array.isArray(arg)) {
+                    toAdd = (0, exports.classnames)(arg);
+                }
+                else {
+                    (0, assert_1.assert)(!(0, typeGuard_1.typeGuard)(arg, false));
+                    if (process.env.NODE_ENV !== "production" &&
+                        arg.styles !== undefined &&
+                        arg.name !== undefined) {
+                        console.error("You have passed styles created with `css` from `@emotion/react` package to the `cx`.\n" +
+                            "`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from <ClassNames/> component.");
+                    }
+                    toAdd = "";
+                    for (const k in arg) {
+                        if (arg[k] && k) {
+                            toAdd && (toAdd += " ");
+                            toAdd += k;
+                        }
+                    }
+                }
+                break;
+            }
+            default: {
+                toAdd = arg;
+            }
+        }
+        if (toAdd) {
+            cls && (cls += " ");
+            cls += toAdd;
+        }
+    }
+    return cls;
+};
+exports.classnames = classnames;
diff --git a/ddb_main/node_modules/tss-react/tools/getDependencyArrayRef.js b/ddb_main/node_modules/tss-react/tools/getDependencyArrayRef.js
new file mode 100644
index 0000000..23cdafb
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/tools/getDependencyArrayRef.js
@@ -0,0 +1,42 @@
+"use strict";
+/* eslint-disable @typescript-eslint/no-explicit-any */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getDependencyArrayRef = void 0;
+/**
+ * useEffect(
+ *    ()=> { ... },
+ *    [ { "foo": "bar" } ]
+ * )
+ * => The callback will be invoked every render.
+ * because { "foo": "bar" } is a new instance every render.
+ *
+ * useEffect(
+ *    ()=> { ... },
+ *    [ getDependencyArrayRef({ "foo": "bar" }) ]
+ * );
+ * => The callback will only be invoked once.
+ *
+ * The optimization will be enabled only if obj is
+ * of the form Record<string, string | number | undefined | null>
+ * overwise the object is returned (the function is the identity function).
+ */
+function getDependencyArrayRef(obj) {
+    if (!(obj instanceof Object) || typeof obj === "function") {
+        return obj;
+    }
+    const arr = [];
+    for (const key in obj) {
+        const value = obj[key];
+        const typeofValue = typeof value;
+        if (!(typeofValue === "string" ||
+            (typeofValue === "number" && !isNaN(value)) ||
+            typeofValue === "boolean" ||
+            value === undefined ||
+            value === null)) {
+            return obj;
+        }
+        arr.push(`${key}:${typeofValue}_${value}`);
+    }
+    return "xSqLiJdLMd9s" + arr.join("|");
+}
+exports.getDependencyArrayRef = getDependencyArrayRef;
diff --git a/ddb_main/node_modules/tss-react/tools/objectKeys.js b/ddb_main/node_modules/tss-react/tools/objectKeys.js
new file mode 100644
index 0000000..f57d64d
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/tools/objectKeys.js
@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.objectKeys = void 0;
+/** Object.keys() with types */
+function objectKeys(o) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    return Object.keys(o);
+}
+exports.objectKeys = objectKeys;
diff --git a/ddb_main/node_modules/tss-react/tools/polyfills/Object.fromEntries.js b/ddb_main/node_modules/tss-react/tools/polyfills/Object.fromEntries.js
new file mode 100644
index 0000000..787ce24
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/tools/polyfills/Object.fromEntries.js
@@ -0,0 +1,18 @@
+"use strict";
+/* eslint-disable @typescript-eslint/no-explicit-any */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.objectFromEntries = void 0;
+exports.objectFromEntries = !Object
+    .fromEntries
+    ? (entries) => {
+        if (!entries || !entries[Symbol.iterator]) {
+            throw new Error("Object.fromEntries() requires a single iterable argument");
+        }
+        const o = {};
+        Object.keys(entries).forEach(key => {
+            const [k, v] = entries[key];
+            o[k] = v;
+        });
+        return o;
+    }
+    : Object.fromEntries;
diff --git a/ddb_main/node_modules/tss-react/tools/typeGuard.js b/ddb_main/node_modules/tss-react/tools/typeGuard.js
new file mode 100644
index 0000000..a3925d3
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/tools/typeGuard.js
@@ -0,0 +1,9 @@
+"use strict";
+/* eslint-disable @typescript-eslint/no-explicit-any */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.typeGuard = void 0;
+/** https://docs.tsafe.dev/typeguard */
+function typeGuard(_value, isMatched) {
+    return isMatched;
+}
+exports.typeGuard = typeGuard;
diff --git a/ddb_main/node_modules/tss-react/tools/useGuaranteedMemo.js b/ddb_main/node_modules/tss-react/tools/useGuaranteedMemo.js
new file mode 100644
index 0000000..0ea716e
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/tools/useGuaranteedMemo.js
@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useGuaranteedMemo = void 0;
+const react_1 = require("react");
+/** Like react's useMemo but with guarantee that the fn
+ * won't be invoked again if deps hasn't change */
+function useGuaranteedMemo(fn, deps) {
+    const ref = (0, react_1.useRef)();
+    if (!ref.current ||
+        deps.length !== ref.current.prevDeps.length ||
+        ref.current.prevDeps.map((v, i) => v === deps[i]).indexOf(false) >= 0) {
+        ref.current = {
+            "v": fn(),
+            "prevDeps": [...deps],
+        };
+    }
+    return ref.current.v;
+}
+exports.useGuaranteedMemo = useGuaranteedMemo;
diff --git a/ddb_main/node_modules/tss-react/types.js b/ddb_main/node_modules/tss-react/types.js
new file mode 100644
index 0000000..728b5e2
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/types.js
@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.matchCSSObject = void 0;
+function matchCSSObject(arg) {
+    return (arg instanceof Object &&
+        !("styles" in arg) &&
+        !("length" in arg) &&
+        !("__emotion_styles" in arg));
+}
+exports.matchCSSObject = matchCSSObject;
diff --git a/ddb_main/node_modules/tss-react/withStyles.js b/ddb_main/node_modules/tss-react/withStyles.js
new file mode 100644
index 0000000..1004427
--- /dev/null
+++ b/ddb_main/node_modules/tss-react/withStyles.js
@@ -0,0 +1,99 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createWithStyles = void 0;
+/* eslint-disable @typescript-eslint/no-explicit-any */
+const react_1 = __importStar(require("react"));
+const makeStyles_1 = require("./makeStyles");
+const capitalize_1 = require("./tools/capitalize");
+function createWithStyles(params) {
+    const { useTheme } = params;
+    const { makeStyles } = (0, makeStyles_1.createMakeStyles)({ useTheme });
+    function withStyles(Component, cssObjectByRuleNameOrGetCssObjectByRuleName, params) {
+        const Component_ = typeof Component === "string"
+            ? (() => {
+                const tag = Component;
+                const Out = function (_a) {
+                    var { children } = _a, props = __rest(_a, ["children"]);
+                    return (0, react_1.createElement)(tag, props, children);
+                };
+                Object.defineProperty(Out, "name", {
+                    "value": (0, capitalize_1.capitalize)(tag),
+                });
+                return Out;
+            })()
+            : Component;
+        const name = (() => {
+            const { name } = Component_;
+            return typeof name === "string" ? name : undefined;
+        })();
+        const useStyles = makeStyles(params)(typeof cssObjectByRuleNameOrGetCssObjectByRuleName === "function"
+            ? (theme, props, classes) => incorporateMediaQueries(cssObjectByRuleNameOrGetCssObjectByRuleName(theme, props, classes))
+            : incorporateMediaQueries(cssObjectByRuleNameOrGetCssObjectByRuleName));
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const Out = (0, react_1.forwardRef)(function (props, ref) {
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            const { className, classes: _classes } = props, rest = __rest(props, ["className", "classes"]);
+            const { classes, cx } = useStyles(props, { props });
+            return (react_1.default.createElement(Component_, Object.assign({ ref: ref, className: cx(classes.root, className) }, (typeof Component === "string" ? {} : { classes }), rest)));
+        });
+        if (name !== undefined) {
+            Object.defineProperty(Out, "name", {
+                "value": `${name}WithStyles`,
+            });
+        }
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        return Out;
+    }
+    return { withStyles };
+}
+exports.createWithStyles = createWithStyles;
+function incorporateMediaQueries(cssObjectByRuleNameWithMediaQueries) {
+    const cssObjectByRuleName = {};
+    const cssObjectByRuleNameWithMediaQueriesByMediaQuery = {};
+    Object.keys(cssObjectByRuleNameWithMediaQueries).forEach(ruleNameOrMediaQuery => ((ruleNameOrMediaQuery.startsWith("@media")
+        ? cssObjectByRuleNameWithMediaQueriesByMediaQuery
+        : cssObjectByRuleName)[ruleNameOrMediaQuery] =
+        cssObjectByRuleNameWithMediaQueries[ruleNameOrMediaQuery]));
+    Object.keys(cssObjectByRuleNameWithMediaQueriesByMediaQuery).forEach(mediaQuery => {
+        const cssObjectByRuleNameBis = cssObjectByRuleNameWithMediaQueriesByMediaQuery[mediaQuery];
+        Object.keys(cssObjectByRuleNameBis).forEach(ruleName => {
+            var _a;
+            return (cssObjectByRuleName[ruleName] = Object.assign(Object.assign({}, ((_a = cssObjectByRuleName[ruleName]) !== null && _a !== void 0 ? _a : {})), { [mediaQuery]: cssObjectByRuleNameBis[ruleName] }));
+        });
+    });
+    return cssObjectByRuleName;
+}
diff --git a/ddb_main/node_modules/uuid/dist/esm-browser/regex.js b/ddb_main/node_modules/uuid/dist/esm-browser/regex.js
new file mode 100644
index 0000000..3da8673
--- /dev/null
+++ b/ddb_main/node_modules/uuid/dist/esm-browser/regex.js
@@ -0,0 +1 @@
+export default /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;
\ No newline at end of file
diff --git a/ddb_main/node_modules/uuid/dist/esm-browser/rng.js b/ddb_main/node_modules/uuid/dist/esm-browser/rng.js
new file mode 100644
index 0000000..8abbf2e
--- /dev/null
+++ b/ddb_main/node_modules/uuid/dist/esm-browser/rng.js
@@ -0,0 +1,19 @@
+// Unique ID creation requires a high quality random # generator. In the browser we therefore
+// require the crypto API and do not support built-in fallback to lower quality random number
+// generators (like Math.random()).
+var getRandomValues;
+var rnds8 = new Uint8Array(16);
+export default function rng() {
+  // lazy load so that environments that need to polyfill have a chance to do so
+  if (!getRandomValues) {
+    // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation. Also,
+    // find the complete implementation of crypto (msCrypto) on IE11.
+    getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto !== 'undefined' && typeof msCrypto.getRandomValues === 'function' && msCrypto.getRandomValues.bind(msCrypto);
+
+    if (!getRandomValues) {
+      throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
+    }
+  }
+
+  return getRandomValues(rnds8);
+}
\ No newline at end of file
diff --git a/ddb_main/node_modules/uuid/dist/esm-browser/stringify.js b/ddb_main/node_modules/uuid/dist/esm-browser/stringify.js
new file mode 100644
index 0000000..3102111
--- /dev/null
+++ b/ddb_main/node_modules/uuid/dist/esm-browser/stringify.js
@@ -0,0 +1,30 @@
+import validate from './validate.js';
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
+ */
+
+var byteToHex = [];
+
+for (var i = 0; i < 256; ++i) {
+  byteToHex.push((i + 0x100).toString(16).substr(1));
+}
+
+function stringify(arr) {
+  var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  // Note: Be careful editing this code!  It's been tuned for performance
+  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
+  var uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID.  If this throws, it's likely due to one
+  // of the following:
+  // - One or more input array values don't map to a hex octet (leading to
+  // "undefined" in the uuid)
+  // - Invalid input values for the RFC `version` or `variant` fields
+
+  if (!validate(uuid)) {
+    throw TypeError('Stringified UUID is invalid');
+  }
+
+  return uuid;
+}
+
+export default stringify;
\ No newline at end of file
diff --git a/ddb_main/node_modules/uuid/dist/esm-browser/v4.js b/ddb_main/node_modules/uuid/dist/esm-browser/v4.js
new file mode 100644
index 0000000..404810a
--- /dev/null
+++ b/ddb_main/node_modules/uuid/dist/esm-browser/v4.js
@@ -0,0 +1,24 @@
+import rng from './rng.js';
+import stringify from './stringify.js';
+
+function v4(options, buf, offset) {
+  options = options || {};
+  var rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+
+  rnds[6] = rnds[6] & 0x0f | 0x40;
+  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
+
+  if (buf) {
+    offset = offset || 0;
+
+    for (var i = 0; i < 16; ++i) {
+      buf[offset + i] = rnds[i];
+    }
+
+    return buf;
+  }
+
+  return stringify(rnds);
+}
+
+export default v4;
\ No newline at end of file
diff --git a/ddb_main/node_modules/uuid/dist/esm-browser/validate.js b/ddb_main/node_modules/uuid/dist/esm-browser/validate.js
new file mode 100644
index 0000000..f1cdc7a
--- /dev/null
+++ b/ddb_main/node_modules/uuid/dist/esm-browser/validate.js
@@ -0,0 +1,7 @@
+import REGEX from './regex.js';
+
+function validate(uuid) {
+  return typeof uuid === 'string' && REGEX.test(uuid);
+}
+
+export default validate;
\ No newline at end of file
diff --git a/ddb_main/node_modules/warning/warning.js b/ddb_main/node_modules/warning/warning.js
new file mode 100644
index 0000000..281d85b
--- /dev/null
+++ b/ddb_main/node_modules/warning/warning.js
@@ -0,0 +1,62 @@
+/**
+ * Copyright (c) 2014-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+/**
+ * Similar to invariant but only logs a warning if the condition is not met.
+ * This can be used to log issues in development environments in critical
+ * paths. Removing the logging code for production environments will keep the
+ * same logic and follow the same code paths.
+ */
+
+var __DEV__ = process.env.NODE_ENV !== 'production';
+
+var warning = function() {};
+
+if (__DEV__) {
+  var printWarning = function printWarning(format, args) {
+    var len = arguments.length;
+    args = new Array(len > 1 ? len - 1 : 0);
+    for (var key = 1; key < len; key++) {
+      args[key - 1] = arguments[key];
+    }
+    var argIndex = 0;
+    var message = 'Warning: ' +
+      format.replace(/%s/g, function() {
+        return args[argIndex++];
+      });
+    if (typeof console !== 'undefined') {
+      console.error(message);
+    }
+    try {
+      // --- Welcome to debugging React ---
+      // This error was thrown as a convenience so that you can use this stack
+      // to find the callsite that caused this warning to fire.
+      throw new Error(message);
+    } catch (x) {}
+  }
+
+  warning = function(condition, format, args) {
+    var len = arguments.length;
+    args = new Array(len > 2 ? len - 2 : 0);
+    for (var key = 2; key < len; key++) {
+      args[key - 2] = arguments[key];
+    }
+    if (format === undefined) {
+      throw new Error(
+          '`warning(condition, format, ...args)` requires a warning ' +
+          'message argument'
+      );
+    }
+    if (!condition) {
+      printWarning.apply(null, [format].concat(args));
+    }
+  };
+}
+
+module.exports = warning;
diff --git a/ddb_main/node_modules/whatwg-fetch/fetch.js b/ddb_main/node_modules/whatwg-fetch/fetch.js
new file mode 100644
index 0000000..12c45f2
--- /dev/null
+++ b/ddb_main/node_modules/whatwg-fetch/fetch.js
@@ -0,0 +1,605 @@
+var global =
+  (typeof globalThis !== 'undefined' && globalThis) ||
+  (typeof self !== 'undefined' && self) ||
+  (typeof global !== 'undefined' && global)
+
+var support = {
+  searchParams: 'URLSearchParams' in global,
+  iterable: 'Symbol' in global && 'iterator' in Symbol,
+  blob:
+    'FileReader' in global &&
+    'Blob' in global &&
+    (function() {
+      try {
+        new Blob()
+        return true
+      } catch (e) {
+        return false
+      }
+    })(),
+  formData: 'FormData' in global,
+  arrayBuffer: 'ArrayBuffer' in global
+}
+
+function isDataView(obj) {
+  return obj && DataView.prototype.isPrototypeOf(obj)
+}
+
+if (support.arrayBuffer) {
+  var viewClasses = [
+    '[object Int8Array]',
+    '[object Uint8Array]',
+    '[object Uint8ClampedArray]',
+    '[object Int16Array]',
+    '[object Uint16Array]',
+    '[object Int32Array]',
+    '[object Uint32Array]',
+    '[object Float32Array]',
+    '[object Float64Array]'
+  ]
+
+  var isArrayBufferView =
+    ArrayBuffer.isView ||
+    function(obj) {
+      return obj && viewClasses.indexOf(Object.prototype.toString.call(obj)) > -1
+    }
+}
+
+function normalizeName(name) {
+  if (typeof name !== 'string') {
+    name = String(name)
+  }
+  if (/[^a-z0-9\-#$%&'*+.^_`|~!]/i.test(name) || name === '') {
+    throw new TypeError('Invalid character in header field name')
+  }
+  return name.toLowerCase()
+}
+
+function normalizeValue(value) {
+  if (typeof value !== 'string') {
+    value = String(value)
+  }
+  return value
+}
+
+// Build a destructive iterator for the value list
+function iteratorFor(items) {
+  var iterator = {
+    next: function() {
+      var value = items.shift()
+      return {done: value === undefined, value: value}
+    }
+  }
+
+  if (support.iterable) {
+    iterator[Symbol.iterator] = function() {
+      return iterator
+    }
+  }
+
+  return iterator
+}
+
+export function Headers(headers) {
+  this.map = {}
+
+  if (headers instanceof Headers) {
+    headers.forEach(function(value, name) {
+      this.append(name, value)
+    }, this)
+  } else if (Array.isArray(headers)) {
+    headers.forEach(function(header) {
+      this.append(header[0], header[1])
+    }, this)
+  } else if (headers) {
+    Object.getOwnPropertyNames(headers).forEach(function(name) {
+      this.append(name, headers[name])
+    }, this)
+  }
+}
+
+Headers.prototype.append = function(name, value) {
+  name = normalizeName(name)
+  value = normalizeValue(value)
+  var oldValue = this.map[name]
+  this.map[name] = oldValue ? oldValue + ', ' + value : value
+}
+
+Headers.prototype['delete'] = function(name) {
+  delete this.map[normalizeName(name)]
+}
+
+Headers.prototype.get = function(name) {
+  name = normalizeName(name)
+  return this.has(name) ? this.map[name] : null
+}
+
+Headers.prototype.has = function(name) {
+  return this.map.hasOwnProperty(normalizeName(name))
+}
+
+Headers.prototype.set = function(name, value) {
+  this.map[normalizeName(name)] = normalizeValue(value)
+}
+
+Headers.prototype.forEach = function(callback, thisArg) {
+  for (var name in this.map) {
+    if (this.map.hasOwnProperty(name)) {
+      callback.call(thisArg, this.map[name], name, this)
+    }
+  }
+}
+
+Headers.prototype.keys = function() {
+  var items = []
+  this.forEach(function(value, name) {
+    items.push(name)
+  })
+  return iteratorFor(items)
+}
+
+Headers.prototype.values = function() {
+  var items = []
+  this.forEach(function(value) {
+    items.push(value)
+  })
+  return iteratorFor(items)
+}
+
+Headers.prototype.entries = function() {
+  var items = []
+  this.forEach(function(value, name) {
+    items.push([name, value])
+  })
+  return iteratorFor(items)
+}
+
+if (support.iterable) {
+  Headers.prototype[Symbol.iterator] = Headers.prototype.entries
+}
+
+function consumed(body) {
+  if (body.bodyUsed) {
+    return Promise.reject(new TypeError('Already read'))
+  }
+  body.bodyUsed = true
+}
+
+function fileReaderReady(reader) {
+  return new Promise(function(resolve, reject) {
+    reader.onload = function() {
+      resolve(reader.result)
+    }
+    reader.onerror = function() {
+      reject(reader.error)
+    }
+  })
+}
+
+function readBlobAsArrayBuffer(blob) {
+  var reader = new FileReader()
+  var promise = fileReaderReady(reader)
+  reader.readAsArrayBuffer(blob)
+  return promise
+}
+
+function readBlobAsText(blob) {
+  var reader = new FileReader()
+  var promise = fileReaderReady(reader)
+  reader.readAsText(blob)
+  return promise
+}
+
+function readArrayBufferAsText(buf) {
+  var view = new Uint8Array(buf)
+  var chars = new Array(view.length)
+
+  for (var i = 0; i < view.length; i++) {
+    chars[i] = String.fromCharCode(view[i])
+  }
+  return chars.join('')
+}
+
+function bufferClone(buf) {
+  if (buf.slice) {
+    return buf.slice(0)
+  } else {
+    var view = new Uint8Array(buf.byteLength)
+    view.set(new Uint8Array(buf))
+    return view.buffer
+  }
+}
+
+function Body() {
+  this.bodyUsed = false
+
+  this._initBody = function(body) {
+    /*
+      fetch-mock wraps the Response object in an ES6 Proxy to
+      provide useful test harness features such as flush. However, on
+      ES5 browsers without fetch or Proxy support pollyfills must be used;
+      the proxy-pollyfill is unable to proxy an attribute unless it exists
+      on the object before the Proxy is created. This change ensures
+      Response.bodyUsed exists on the instance, while maintaining the
+      semantic of setting Request.bodyUsed in the constructor before
+      _initBody is called.
+    */
+    this.bodyUsed = this.bodyUsed
+    this._bodyInit = body
+    if (!body) {
+      this._bodyText = ''
+    } else if (typeof body === 'string') {
+      this._bodyText = body
+    } else if (support.blob && Blob.prototype.isPrototypeOf(body)) {
+      this._bodyBlob = body
+    } else if (support.formData && FormData.prototype.isPrototypeOf(body)) {
+      this._bodyFormData = body
+    } else if (support.searchParams && URLSearchParams.prototype.isPrototypeOf(body)) {
+      this._bodyText = body.toString()
+    } else if (support.arrayBuffer && support.blob && isDataView(body)) {
+      this._bodyArrayBuffer = bufferClone(body.buffer)
+      // IE 10-11 can't handle a DataView body.
+      this._bodyInit = new Blob([this._bodyArrayBuffer])
+    } else if (support.arrayBuffer && (ArrayBuffer.prototype.isPrototypeOf(body) || isArrayBufferView(body))) {
+      this._bodyArrayBuffer = bufferClone(body)
+    } else {
+      this._bodyText = body = Object.prototype.toString.call(body)
+    }
+
+    if (!this.headers.get('content-type')) {
+      if (typeof body === 'string') {
+        this.headers.set('content-type', 'text/plain;charset=UTF-8')
+      } else if (this._bodyBlob && this._bodyBlob.type) {
+        this.headers.set('content-type', this._bodyBlob.type)
+      } else if (support.searchParams && URLSearchParams.prototype.isPrototypeOf(body)) {
+        this.headers.set('content-type', 'application/x-www-form-urlencoded;charset=UTF-8')
+      }
+    }
+  }
+
+  if (support.blob) {
+    this.blob = function() {
+      var rejected = consumed(this)
+      if (rejected) {
+        return rejected
+      }
+
+      if (this._bodyBlob) {
+        return Promise.resolve(this._bodyBlob)
+      } else if (this._bodyArrayBuffer) {
+        return Promise.resolve(new Blob([this._bodyArrayBuffer]))
+      } else if (this._bodyFormData) {
+        throw new Error('could not read FormData body as blob')
+      } else {
+        return Promise.resolve(new Blob([this._bodyText]))
+      }
+    }
+
+    this.arrayBuffer = function() {
+      if (this._bodyArrayBuffer) {
+        var isConsumed = consumed(this)
+        if (isConsumed) {
+          return isConsumed
+        }
+        if (ArrayBuffer.isView(this._bodyArrayBuffer)) {
+          return Promise.resolve(
+            this._bodyArrayBuffer.buffer.slice(
+              this._bodyArrayBuffer.byteOffset,
+              this._bodyArrayBuffer.byteOffset + this._bodyArrayBuffer.byteLength
+            )
+          )
+        } else {
+          return Promise.resolve(this._bodyArrayBuffer)
+        }
+      } else {
+        return this.blob().then(readBlobAsArrayBuffer)
+      }
+    }
+  }
+
+  this.text = function() {
+    var rejected = consumed(this)
+    if (rejected) {
+      return rejected
+    }
+
+    if (this._bodyBlob) {
+      return readBlobAsText(this._bodyBlob)
+    } else if (this._bodyArrayBuffer) {
+      return Promise.resolve(readArrayBufferAsText(this._bodyArrayBuffer))
+    } else if (this._bodyFormData) {
+      throw new Error('could not read FormData body as text')
+    } else {
+      return Promise.resolve(this._bodyText)
+    }
+  }
+
+  if (support.formData) {
+    this.formData = function() {
+      return this.text().then(decode)
+    }
+  }
+
+  this.json = function() {
+    return this.text().then(JSON.parse)
+  }
+
+  return this
+}
+
+// HTTP methods whose capitalization should be normalized
+var methods = ['DELETE', 'GET', 'HEAD', 'OPTIONS', 'POST', 'PUT']
+
+function normalizeMethod(method) {
+  var upcased = method.toUpperCase()
+  return methods.indexOf(upcased) > -1 ? upcased : method
+}
+
+export function Request(input, options) {
+  if (!(this instanceof Request)) {
+    throw new TypeError('Please use the "new" operator, this DOM object constructor cannot be called as a function.')
+  }
+
+  options = options || {}
+  var body = options.body
+
+  if (input instanceof Request) {
+    if (input.bodyUsed) {
+      throw new TypeError('Already read')
+    }
+    this.url = input.url
+    this.credentials = input.credentials
+    if (!options.headers) {
+      this.headers = new Headers(input.headers)
+    }
+    this.method = input.method
+    this.mode = input.mode
+    this.signal = input.signal
+    if (!body && input._bodyInit != null) {
+      body = input._bodyInit
+      input.bodyUsed = true
+    }
+  } else {
+    this.url = String(input)
+  }
+
+  this.credentials = options.credentials || this.credentials || 'same-origin'
+  if (options.headers || !this.headers) {
+    this.headers = new Headers(options.headers)
+  }
+  this.method = normalizeMethod(options.method || this.method || 'GET')
+  this.mode = options.mode || this.mode || null
+  this.signal = options.signal || this.signal
+  this.referrer = null
+
+  if ((this.method === 'GET' || this.method === 'HEAD') && body) {
+    throw new TypeError('Body not allowed for GET or HEAD requests')
+  }
+  this._initBody(body)
+
+  if (this.method === 'GET' || this.method === 'HEAD') {
+    if (options.cache === 'no-store' || options.cache === 'no-cache') {
+      // Search for a '_' parameter in the query string
+      var reParamSearch = /([?&])_=[^&]*/
+      if (reParamSearch.test(this.url)) {
+        // If it already exists then set the value with the current time
+        this.url = this.url.replace(reParamSearch, '$1_=' + new Date().getTime())
+      } else {
+        // Otherwise add a new '_' parameter to the end with the current time
+        var reQueryString = /\?/
+        this.url += (reQueryString.test(this.url) ? '&' : '?') + '_=' + new Date().getTime()
+      }
+    }
+  }
+}
+
+Request.prototype.clone = function() {
+  return new Request(this, {body: this._bodyInit})
+}
+
+function decode(body) {
+  var form = new FormData()
+  body
+    .trim()
+    .split('&')
+    .forEach(function(bytes) {
+      if (bytes) {
+        var split = bytes.split('=')
+        var name = split.shift().replace(/\+/g, ' ')
+        var value = split.join('=').replace(/\+/g, ' ')
+        form.append(decodeURIComponent(name), decodeURIComponent(value))
+      }
+    })
+  return form
+}
+
+function parseHeaders(rawHeaders) {
+  var headers = new Headers()
+  // Replace instances of \r\n and \n followed by at least one space or horizontal tab with a space
+  // https://tools.ietf.org/html/rfc7230#section-3.2
+  var preProcessedHeaders = rawHeaders.replace(/\r?\n[\t ]+/g, ' ')
+  // Avoiding split via regex to work around a common IE11 bug with the core-js 3.6.0 regex polyfill
+  // https://github.com/github/fetch/issues/748
+  // https://github.com/zloirock/core-js/issues/751
+  preProcessedHeaders
+    .split('\r')
+    .map(function(header) {
+      return header.indexOf('\n') === 0 ? header.substr(1, header.length) : header
+    })
+    .forEach(function(line) {
+      var parts = line.split(':')
+      var key = parts.shift().trim()
+      if (key) {
+        var value = parts.join(':').trim()
+        headers.append(key, value)
+      }
+    })
+  return headers
+}
+
+Body.call(Request.prototype)
+
+export function Response(bodyInit, options) {
+  if (!(this instanceof Response)) {
+    throw new TypeError('Please use the "new" operator, this DOM object constructor cannot be called as a function.')
+  }
+  if (!options) {
+    options = {}
+  }
+
+  this.type = 'default'
+  this.status = options.status === undefined ? 200 : options.status
+  this.ok = this.status >= 200 && this.status < 300
+  this.statusText = 'statusText' in options ? options.statusText : ''
+  this.headers = new Headers(options.headers)
+  this.url = options.url || ''
+  this._initBody(bodyInit)
+}
+
+Body.call(Response.prototype)
+
+Response.prototype.clone = function() {
+  return new Response(this._bodyInit, {
+    status: this.status,
+    statusText: this.statusText,
+    headers: new Headers(this.headers),
+    url: this.url
+  })
+}
+
+Response.error = function() {
+  var response = new Response(null, {status: 0, statusText: ''})
+  response.type = 'error'
+  return response
+}
+
+var redirectStatuses = [301, 302, 303, 307, 308]
+
+Response.redirect = function(url, status) {
+  if (redirectStatuses.indexOf(status) === -1) {
+    throw new RangeError('Invalid status code')
+  }
+
+  return new Response(null, {status: status, headers: {location: url}})
+}
+
+export var DOMException = global.DOMException
+try {
+  new DOMException()
+} catch (err) {
+  DOMException = function(message, name) {
+    this.message = message
+    this.name = name
+    var error = Error(message)
+    this.stack = error.stack
+  }
+  DOMException.prototype = Object.create(Error.prototype)
+  DOMException.prototype.constructor = DOMException
+}
+
+export function fetch(input, init) {
+  return new Promise(function(resolve, reject) {
+    var request = new Request(input, init)
+
+    if (request.signal && request.signal.aborted) {
+      return reject(new DOMException('Aborted', 'AbortError'))
+    }
+
+    var xhr = new XMLHttpRequest()
+
+    function abortXhr() {
+      xhr.abort()
+    }
+
+    xhr.onload = function() {
+      var options = {
+        status: xhr.status,
+        statusText: xhr.statusText,
+        headers: parseHeaders(xhr.getAllResponseHeaders() || '')
+      }
+      options.url = 'responseURL' in xhr ? xhr.responseURL : options.headers.get('X-Request-URL')
+      var body = 'response' in xhr ? xhr.response : xhr.responseText
+      setTimeout(function() {
+        resolve(new Response(body, options))
+      }, 0)
+    }
+
+    xhr.onerror = function() {
+      setTimeout(function() {
+        reject(new TypeError('Network request failed'))
+      }, 0)
+    }
+
+    xhr.ontimeout = function() {
+      setTimeout(function() {
+        reject(new TypeError('Network request failed'))
+      }, 0)
+    }
+
+    xhr.onabort = function() {
+      setTimeout(function() {
+        reject(new DOMException('Aborted', 'AbortError'))
+      }, 0)
+    }
+
+    function fixUrl(url) {
+      try {
+        return url === '' && global.location.href ? global.location.href : url
+      } catch (e) {
+        return url
+      }
+    }
+
+    xhr.open(request.method, fixUrl(request.url), true)
+
+    if (request.credentials === 'include') {
+      xhr.withCredentials = true
+    } else if (request.credentials === 'omit') {
+      xhr.withCredentials = false
+    }
+
+    if ('responseType' in xhr) {
+      if (support.blob) {
+        xhr.responseType = 'blob'
+      } else if (
+        support.arrayBuffer &&
+        request.headers.get('Content-Type') &&
+        request.headers.get('Content-Type').indexOf('application/octet-stream') !== -1
+      ) {
+        xhr.responseType = 'arraybuffer'
+      }
+    }
+
+    if (init && typeof init.headers === 'object' && !(init.headers instanceof Headers)) {
+      Object.getOwnPropertyNames(init.headers).forEach(function(name) {
+        xhr.setRequestHeader(name, normalizeValue(init.headers[name]))
+      })
+    } else {
+      request.headers.forEach(function(value, name) {
+        xhr.setRequestHeader(name, value)
+      })
+    }
+
+    if (request.signal) {
+      request.signal.addEventListener('abort', abortXhr)
+
+      xhr.onreadystatechange = function() {
+        // DONE (success or failure)
+        if (xhr.readyState === 4) {
+          request.signal.removeEventListener('abort', abortXhr)
+        }
+      }
+    }
+
+    xhr.send(typeof request._bodyInit === 'undefined' ? null : request._bodyInit)
+  })
+}
+
+fetch.polyfill = true
+
+if (!global.fetch) {
+  global.fetch = fetch
+  global.Headers = Headers
+  global.Request = Request
+  global.Response = Response
+}
diff --git a/ddb_main/node_modules/yet-another-abortcontroller-polyfill/index.js b/ddb_main/node_modules/yet-another-abortcontroller-polyfill/index.js
new file mode 100644
index 0000000..aa9c290
--- /dev/null
+++ b/ddb_main/node_modules/yet-another-abortcontroller-polyfill/index.js
@@ -0,0 +1,67 @@
+const root =
+  (typeof globalThis !== "undefined" && globalThis) ||
+  (typeof self !== "undefined" && self) ||
+  (typeof global !== "undefined" && global);
+
+if (typeof root.AbortController === "undefined") {
+  const SECRET = {};
+
+  root.AbortSignal = (function () {
+    function AbortSignal(secret) {
+      if (secret !== SECRET) {
+        throw new TypeError("Illegal constructor.");
+      }
+      EventTarget.call(this);
+      this._aborted = false;
+    }
+
+    AbortSignal.prototype = Object.create(EventTarget.prototype);
+    AbortSignal.prototype.constructor = AbortSignal;
+
+    Object.defineProperty(AbortSignal.prototype, "onabort", {
+      get: function () {
+        return this._onabort;
+      },
+      set: function (callback) {
+        const existing = this._onabort;
+        if (existing) {
+          this.removeEventListener("abort", existing);
+        }
+        this._onabort = callback;
+        this.addEventListener("abort", callback);
+      },
+    });
+
+    Object.defineProperty(AbortSignal.prototype, "aborted", {
+      get: function () {
+        return this._aborted;
+      },
+    });
+
+    return AbortSignal;
+  })();
+
+  root.AbortController = (function () {
+    function AbortController() {
+      this._signal = new AbortSignal(SECRET);
+    }
+
+    AbortController.prototype = Object.create(Object.prototype);
+
+    Object.defineProperty(AbortController.prototype, "signal", {
+      get: function () {
+        return this._signal;
+      },
+    });
+
+    AbortController.prototype.abort = function () {
+      const signal = this.signal;
+      if (!signal.aborted) {
+        signal._aborted = true;
+        signal.dispatchEvent(new Event("abort"));
+      }
+    };
+
+    return AbortController;
+  })();
+}
diff --git a/ddb_main/packages/gfs/lib/FeaturePreprocessor.js b/ddb_main/packages/gfs/lib/FeaturePreprocessor.js
new file mode 100644
index 0000000..769703a
--- /dev/null
+++ b/ddb_main/packages/gfs/lib/FeaturePreprocessor.js
@@ -0,0 +1,134 @@
+import { log, LOG_LEVEL } from './utils/log';
+var FeaturePreprocessor = /** @class */ (function () {
+    function FeaturePreprocessor() {
+        this.featureMap = new Map();
+        this.statementList = [];
+    }
+    FeaturePreprocessor.prototype.process = function (_a) {
+        var rootFeatureIds = _a.rootFeatureIds, featureMap = _a.featureMap;
+        this.featureMap = featureMap;
+        // Add statements from root level features, and their subfeatures.
+        for (var _i = 0, rootFeatureIds_1 = rootFeatureIds; _i < rootFeatureIds_1.length; _i++) {
+            var featureId = rootFeatureIds_1[_i];
+            var feature = featureMap.get(featureId);
+            if (feature === undefined) {
+                log(LOG_LEVEL.ERROR, "Feature " + featureId + " not found");
+            }
+            else {
+                this.deriveStatements(feature, null, null);
+            }
+        }
+        return this.statementList;
+    };
+    FeaturePreprocessor.prototype.deriveStatements = function (feature, featureReferenceId, parameters) {
+        for (var _i = 0, _a = feature.statements; _i < _a.length; _i++) {
+            var statement = _a[_i];
+            // Make a deep copy of the statement. The copy gets the featureReferenceId set.
+            // Also, the engine will be modifying the expressions in the statements, so a deep copy is needed.
+            var statementCopy = JSON.parse(JSON.stringify(statement));
+            if (featureReferenceId !== null && parameters !== null) {
+                // targets might be parameterized
+                statementCopy.target = this.evaluateStatementTarget(statementCopy.target, parameters);
+                // then dive into the statement's expressions to evaluate parameterized static and dynamic values
+                this.processExpression(statementCopy.operand, parameters);
+            }
+            this.statementList.push(statementCopy);
+        }
+        for (var _b = 0, _c = feature.subfeatures; _b < _c.length; _b++) {
+            var featureReference = _c[_b];
+            // the featureReference might also be parameterized, in order to pass parameters down multiple levels
+            var referenceCopy = JSON.parse(JSON.stringify(featureReference)); // copy might not be needed
+            if (parameters !== null) {
+                this.processReferenceParameters(referenceCopy.parameters, parameters);
+            }
+            var subfeatureDef = this.featureMap.get(referenceCopy.featureId);
+            if (subfeatureDef === undefined) {
+                log(LOG_LEVEL.ERROR, "Feature " + referenceCopy.featureId + " not found");
+            }
+            else {
+                this.deriveStatements(subfeatureDef, referenceCopy.featureReferenceId, referenceCopy.parameters);
+            }
+        }
+    };
+    FeaturePreprocessor.prototype.evaluateStatementTarget = function (target, parameters) {
+        var newTargetList = [];
+        for (var i = 0; i < target.length; i++) {
+            var part = target[i];
+            if (typeof part === 'string' && part.startsWith('$inputs.')) {
+                var evaluated = this.lookupInput(part, parameters);
+                if (evaluated === null || evaluated.some(function (x) { return typeof x !== 'string'; })) {
+                    throw new Error('Parameter values for dynamic targets must be strings');
+                }
+                newTargetList.push.apply(newTargetList, evaluated);
+            }
+            else {
+                newTargetList.push(part);
+            }
+        }
+        return newTargetList;
+    };
+    // Some duplicated code here. The difference is that targets must be strings,
+    // while expression parameters might be numbers.
+    FeaturePreprocessor.prototype.evaluateExpressionValues = function (values, parameters) {
+        // An array of strings might turn into an array of numbers, if the parameter values are numbers.
+        // I don't like this :O
+        var evaluatedValues = [];
+        for (var i = 0; i < values.length; i++) {
+            var part = values[i];
+            if (typeof part === 'string' && part.startsWith('$inputs.')) {
+                var evaluated = this.lookupInput(part, parameters);
+                if (evaluated === null) {
+                    throw new Error('Parameter values for static or dynamic values cannot be null');
+                }
+                evaluatedValues.push.apply(evaluatedValues, evaluated);
+            }
+            else {
+                evaluatedValues.push(part);
+            }
+        }
+        if (evaluatedValues.every(function (x) { return typeof x === 'string'; })) {
+            return evaluatedValues;
+        }
+        if (evaluatedValues.every(function (x) { return typeof x === 'number'; })) {
+            return evaluatedValues;
+        }
+        throw new Error('Parameter value type needs to match the type of non-parameterized values');
+    };
+    FeaturePreprocessor.prototype.lookupInput = function (inputName, parameters) {
+        var splits = inputName.split('$inputs.');
+        if (splits.length !== 2) {
+            throw new Error('Invalid $inputs format');
+        }
+        var key = splits[1];
+        if (!parameters.hasOwnProperty(key)) {
+            throw new Error("Parameters is missing key " + key);
+        }
+        return parameters[key]; // TODO: Check to make sure the parameter is there
+    };
+    FeaturePreprocessor.prototype.processExpression = function (expression, parameters) {
+        // If the expression has values, evaluate any $inputs
+        if (expression.values !== null && expression.values.length) {
+            expression.values = this.evaluateExpressionValues(expression.values, parameters);
+        }
+        // If the expression has operands, recurse!
+        if (expression.operands !== null && expression.operands.length) {
+            for (var _i = 0, _a = expression.operands; _i < _a.length; _i++) {
+                var operand = _a[_i];
+                this.processExpression(operand, parameters);
+            }
+        }
+    };
+    FeaturePreprocessor.prototype.processReferenceParameters = function (childParameters, parentParameters) {
+        // FeatureParameters is Record<string, Array<string> | Array<number> | null>
+        var parameterKeys = Object.keys(childParameters);
+        for (var _i = 0, parameterKeys_1 = parameterKeys; _i < parameterKeys_1.length; _i++) {
+            var key = parameterKeys_1[_i];
+            var parameterValues = childParameters[key];
+            if (parameterValues !== null) {
+                childParameters[key] = this.evaluateExpressionValues(parameterValues, parentParameters);
+            }
+        }
+    };
+    return FeaturePreprocessor;
+}());
+export { FeaturePreprocessor };
diff --git a/ddb_main/packages/gfs/lib/LoopResolutionCalculator.js b/ddb_main/packages/gfs/lib/LoopResolutionCalculator.js
new file mode 100644
index 0000000..e2c05c3
--- /dev/null
+++ b/ddb_main/packages/gfs/lib/LoopResolutionCalculator.js
@@ -0,0 +1,320 @@
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+import pkg from 'lodash';
+import { ExpressionOperators } from './types';
+import { log, LOG_LEVEL } from './utils/log';
+var get = pkg.get, set = pkg.set;
+var ADDITIVE_IDENTITY = 0;
+var MULTIPLICATIVE_IDENTITY = 1;
+var ValueUnavailble = /** @class */ (function (_super) {
+    __extends(ValueUnavailble, _super);
+    function ValueUnavailble(message) {
+        return _super.call(this, message) || this;
+    }
+    return ValueUnavailble;
+}(Error));
+function add(state, operands) {
+    var sum = ADDITIVE_IDENTITY;
+    for (var _i = 0, operands_1 = operands; _i < operands_1.length; _i++) {
+        var operand = operands_1[_i];
+        var value = Number(run(state, operand));
+        log(LOG_LEVEL.INFO, ExpressionOperators.ADD + ": value " + value);
+        if (isNaN(value)) {
+            log(LOG_LEVEL.WARN, ExpressionOperators.ADD + ": This was not a number");
+        }
+        else {
+            sum += value;
+        }
+    }
+    log(LOG_LEVEL.INFO, ExpressionOperators.ADD + ": result " + sum);
+    return sum;
+}
+function multiply(state, operands) {
+    var product = MULTIPLICATIVE_IDENTITY;
+    for (var _i = 0, operands_2 = operands; _i < operands_2.length; _i++) {
+        var operand = operands_2[_i];
+        var value = Number(run(state, operand));
+        log(LOG_LEVEL.INFO, ExpressionOperators.ADD + ": value " + value);
+        if (isNaN(value)) {
+            log(LOG_LEVEL.WARN, ExpressionOperators.ADD + ": This was not a number");
+        }
+        else {
+            product *= value;
+        }
+    }
+    log(LOG_LEVEL.INFO, ExpressionOperators.MULTIPLY + ": result " + product);
+    return product;
+}
+function keepHighest() {
+    var rest = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        rest[_i] = arguments[_i];
+    }
+    log(LOG_LEVEL.INFO, "KEEP HIGHEST: options " + String(rest));
+    var result = Math.max.apply(Math, rest.filter(function (x) { return !isNaN(x); }));
+    log(LOG_LEVEL.INFO, "KEEP HIGHEST: result " + result);
+    return result;
+}
+function min(state, operands) {
+    var options = operands.map(function (x) { return run(state, x); });
+    log(LOG_LEVEL.INFO, ExpressionOperators.MIN + ": options " + String(options));
+    var restult = Math.min.apply(Math, options);
+    log(LOG_LEVEL.INFO, ExpressionOperators.MIN + ": result " + restult);
+    return restult;
+}
+function max(state, operands) {
+    var options = operands.map(function (x) { return run(state, x); });
+    log(LOG_LEVEL.INFO, ExpressionOperators.MAX + ": options " + String(options));
+    var restult = Math.max.apply(Math, options);
+    log(LOG_LEVEL.INFO, ExpressionOperators.MAX + ": result " + restult);
+    return restult;
+}
+function getNestedValue(state, path) {
+    return get(state, path);
+}
+function setNestedValue(state, path, value) {
+    if (isNaN(value)) {
+        throw new Error("Value " + value + " is not a number");
+    }
+    set(state, path, value);
+}
+function dynamicValue(state, key) {
+    key = key.flatMap(function (x) { return x.split('.'); });
+    log(LOG_LEVEL.INFO, ExpressionOperators.DYNAMIC_VALUE + ": key " + key);
+    if (!getNestedValue(state, key)) {
+        throw new ValueUnavailble('key not available');
+    }
+    var result = getNestedValue(state, key);
+    log(LOG_LEVEL.INFO, ExpressionOperators.DYNAMIC_VALUE + ": result " + result);
+    return result;
+}
+function floor(state, operand) {
+    return Math.floor(run(state, operand[0]));
+}
+function run(state, operand) {
+    var result;
+    switch (operand.operator) {
+        case ExpressionOperators.STATIC_VALUE: {
+            var values = operand.values;
+            if (!Array.isArray(values)) {
+                throw new Error('STATIC_VALUE has to be an array');
+            }
+            if (!values[0]) {
+                throw new Error('STATIC_VALUE must have a value for index 0');
+            }
+            result = values[0];
+            break;
+        }
+        case ExpressionOperators.DYNAMIC_VALUE: {
+            var values = operand.values;
+            if (!Array.isArray(values) || values.some(function (v) { return typeof v !== 'string'; })) {
+                throw new Error('DYNAMIC_VALUE has to be array of string');
+            }
+            if (!values[0]) {
+                throw new Error('DYNAMIC_VALUE must have a value for index 0');
+            }
+            result = dynamicValue(state, values);
+            break;
+        }
+        case ExpressionOperators.ADD:
+            if (!Array.isArray(operand.operands)) {
+                throw new Error('ADD only supports an array');
+            }
+            result = add(state, operand.operands);
+            break;
+        case ExpressionOperators.MIN:
+            if (!Array.isArray(operand.operands)) {
+                throw new Error('MIN only supports an array');
+            }
+            result = min(state, operand.operands);
+            break;
+        case ExpressionOperators.MAX:
+            if (!Array.isArray(operand.operands)) {
+                throw new Error('MAX only supports an array');
+            }
+            result = max(state, operand.operands);
+            break;
+        case ExpressionOperators.FLOOR:
+            if (!Array.isArray(operand.operands)) {
+                throw new Error('FLOOR not correct format');
+            }
+            result = floor(state, operand.operands);
+            break;
+        case ExpressionOperators.MULTIPLY:
+            if (!Array.isArray(operand.operands)) {
+                throw new Error('MULTIPLY only supports an array');
+            }
+            result = multiply(state, operand.operands);
+            break;
+        default:
+            throw new Error("run: Unknown operator " + operand.operator);
+    }
+    log(LOG_LEVEL.INFO, "Performing " + operand.operator + " :> Result " + result);
+    return result;
+}
+function determineRequirements(operand) {
+    switch (operand.operator) {
+        case 'DYNAMIC_VALUE':
+            if (!operand.values) {
+                throw new Error('DYNAMIC_VALUE reqires values');
+            }
+            return [operand.values.join('.')];
+        case 'STATIC_VALUE':
+            return [];
+        case 'MAX':
+        case 'MIN':
+        case 'ADD':
+        case 'MULTIPLY':
+        case 'FLOOR':
+            if (!Array.isArray(operand.operands)) {
+                throw new Error('no operands array');
+            }
+            var dynamicValueKeys = [];
+            for (var _i = 0, _a = operand.operands; _i < _a.length; _i++) {
+                var childOperand = _a[_i];
+                dynamicValueKeys = dynamicValueKeys.concat(determineRequirements(childOperand));
+            }
+            return dynamicValueKeys;
+        default:
+            throw new Error("determineRequirements: Unknown operator " + operand.operator);
+    }
+}
+function getRequiremets(expression) {
+    if (!expression.operand) {
+        throw new Error('getRequiremets: no operands');
+    }
+    var requirements = determineRequirements(expression.operand);
+    return requirements.filter(function (x) { return x !== expression.target.join('.'); });
+}
+export function runProgram(_a) {
+    var _b;
+    var initState = _a.state, initExpressions = _a.expressions, initTargetResolutionPolicies = _a.targetResolutionPolicies, _c = _a.forceRun, forceRun = _c === void 0 ? false : _c;
+    var state = initState !== null && initState !== void 0 ? initState : {};
+    var expressions = initExpressions !== null && initExpressions !== void 0 ? initExpressions : [];
+    var targetResolutionPolicies = initTargetResolutionPolicies !== null && initTargetResolutionPolicies !== void 0 ? initTargetResolutionPolicies : {};
+    var reprocess = [];
+    var _loop_1 = function (expression) {
+        try {
+            var requirements_1 = getRequiremets(expression);
+            log(LOG_LEVEL.INFO, expression.target + " requires " + requirements_1);
+            var shouldWait = expressions.filter(function (x) { return x !== expression; }).some(function (x) { return requirements_1.includes(x.target.join('.')); }) ||
+                requirements_1.some(function (x) { return !getNestedValue(state, x.split('.')); });
+            log(LOG_LEVEL.ERROR, "Can process " + ((_b = expression.statementId) !== null && _b !== void 0 ? _b : 'id') + " -> " + expression.target + " :> " + (shouldWait ? 'Not yet' : 'Yes'));
+            if (!forceRun && shouldWait) {
+                log(LOG_LEVEL.WARN, "Forcing " + expression.target + " to process");
+                reprocess.push(expression);
+            }
+            else {
+                var result = run(state, expression.operand);
+                if (targetResolutionPolicies.hasOwnProperty(expression.target.join('.'))) {
+                    switch (targetResolutionPolicies[expression.target.join('.')]) {
+                        case 'KEEP_HIGHEST':
+                            setNestedValue(state, expression.target, keepHighest(getNestedValue(state, expression.target), result));
+                            break;
+                        default:
+                            throw new Error('resolution policy not implemented');
+                    }
+                }
+                else {
+                    log(LOG_LEVEL.INFO, "Applying " + expression.target + " = " + result);
+                    setNestedValue(state, expression.target, result);
+                }
+            }
+        }
+        catch (err) {
+            if (err instanceof ValueUnavailble) {
+                reprocess.push(expression);
+            }
+            else {
+            }
+        }
+    };
+    for (var _i = 0, expressions_1 = expressions; _i < expressions_1.length; _i++) {
+        var expression = expressions_1[_i];
+        _loop_1(expression);
+    }
+    if (!forceRun && reprocess.length && reprocess.length === expressions.length) {
+        // throw new Error('cannot resolve'); // Tthis is a circular dependency so just run now
+        return runProgram({ state: state, expressions: reprocess, targetResolutionPolicies: targetResolutionPolicies, forceRun: true });
+    }
+    if (!forceRun && reprocess.length) {
+        return runProgram({ state: state, expressions: reprocess, targetResolutionPolicies: targetResolutionPolicies });
+    }
+    return state;
+}
+export function initProgram(_a) {
+    var _b;
+    var initState = _a.state, initExpressions = _a.expressions, initTargetResolutionPolicies = _a.targetResolutionPolicies;
+    var state = initState !== null && initState !== void 0 ? initState : {};
+    var statements = initExpressions !== null && initExpressions !== void 0 ? initExpressions : [];
+    var targetResolutionPolicies = initTargetResolutionPolicies !== null && initTargetResolutionPolicies !== void 0 ? initTargetResolutionPolicies : {};
+    //TODO: consider a init program to run once
+    // const sorted = expressions.sort((a: Statement, b: Statement) => (a?.precedence ?? 0) - (b?.precedence ?? 0));
+    var getSections = function () { return ({
+        noDynamicValues: [],
+        onlySelfDynamics: [],
+        complexDynamics: [],
+    }); };
+    var statementMap = {};
+    for (var i = 0; i < statements.length; i++) {
+        var statement = statements[i];
+        var reqs = determineRequirements(statement.operand);
+        statementMap[statement.precedence] = (_b = statementMap[statement.precedence]) !== null && _b !== void 0 ? _b : getSections();
+        var sections = statementMap[statement.precedence];
+        if (reqs.length === 0) {
+            sections.noDynamicValues.push(statement);
+        }
+        else if (reqs.length === 1 && reqs.includes(statement.target.join('.'))) {
+            sections.onlySelfDynamics.push(statement);
+        }
+        else if (reqs.length > 1 && reqs.includes(statement.target.join('.'))) {
+            sections.onlySelfDynamics.push(statement);
+        }
+        else {
+            sections.complexDynamics.push(statement);
+        }
+    }
+    // const sections = sorted.reduce(
+    //     (sections, expression) => {
+    //         const reqs = determineRequirements(expression.operand);
+    //         if (reqs.length === 0) {
+    //             sections.noDynamicValues.push(expression);
+    //         } else if (reqs.length === 1 && reqs.includes(expression.target)) {
+    //             sections.onlySelfDynamics.push(expression);
+    //         } else {
+    //             sections.complexDynamics.push(expression);
+    //         }
+    //         return sections;
+    //     },
+    //     {
+    //         noDynamicValues: [] as Statement[],
+    //         onlySelfDynamics: [] as Statement[],
+    //         complexDynamics: [] as Statement[],
+    //     },
+    // );
+    var precedences = Object.keys(statementMap).sort(function (a, b) { return Number(a) - Number(b); });
+    for (var i = 0; i < precedences.length; i++) {
+        var precedence = Number(precedences[i]);
+        var precedenceMap = statementMap[precedence];
+        state = runProgram({ state: state, expressions: precedenceMap.noDynamicValues, targetResolutionPolicies: targetResolutionPolicies });
+        state = runProgram({ state: state, expressions: precedenceMap.onlySelfDynamics, targetResolutionPolicies: targetResolutionPolicies });
+        state = runProgram({ state: state, expressions: precedenceMap.complexDynamics, targetResolutionPolicies: targetResolutionPolicies });
+    }
+    log(LOG_LEVEL.INFO, 'STATE:');
+    log(LOG_LEVEL.INFO, JSON.stringify(state, null, 2));
+    return state;
+}
+// runProgram(dynamicAddTest);
diff --git a/ddb_main/packages/gfs/lib/index.js b/ddb_main/packages/gfs/lib/index.js
new file mode 100644
index 0000000..b3ae0d0
--- /dev/null
+++ b/ddb_main/packages/gfs/lib/index.js
@@ -0,0 +1,11 @@
+import { FeaturePreprocessor } from './FeaturePreprocessor';
+import { initProgram } from './LoopResolutionCalculator';
+export * from './types';
+export function generateCharacterState(_a) {
+    var rootFeatureIds = _a.rootFeatureIds, featureMap = _a.featureMap;
+    var derivedStatements = new FeaturePreprocessor().process({ rootFeatureIds: rootFeatureIds, featureMap: featureMap });
+    var state = initProgram({
+        expressions: derivedStatements,
+    });
+    return state;
+}
diff --git a/ddb_main/packages/gfs/lib/types.js b/ddb_main/packages/gfs/lib/types.js
new file mode 100644
index 0000000..08fd7ea
--- /dev/null
+++ b/ddb_main/packages/gfs/lib/types.js
@@ -0,0 +1,15 @@
+export var ExpressionOperators;
+(function (ExpressionOperators) {
+    ExpressionOperators["ADD"] = "ADD";
+    ExpressionOperators["MIN"] = "MIN";
+    ExpressionOperators["MAX"] = "MAX";
+    ExpressionOperators["FLOOR"] = "FLOOR";
+    ExpressionOperators["MULTIPLY"] = "MULTIPLY";
+    ExpressionOperators["DYNAMIC_VALUE"] = "DYNAMIC_VALUE";
+    ExpressionOperators["STATIC_VALUE"] = "STATIC_VALUE";
+})(ExpressionOperators || (ExpressionOperators = {}));
+export var StatementOperators;
+(function (StatementOperators) {
+    StatementOperators["SET"] = "SET";
+    StatementOperators["PUSH"] = "PUSH";
+})(StatementOperators || (StatementOperators = {}));
diff --git a/ddb_main/packages/gfs/lib/utils/log.js b/ddb_main/packages/gfs/lib/utils/log.js
new file mode 100644
index 0000000..084b764
--- /dev/null
+++ b/ddb_main/packages/gfs/lib/utils/log.js
@@ -0,0 +1,46 @@
+export var LOG_LEVEL;
+(function (LOG_LEVEL) {
+    LOG_LEVEL[LOG_LEVEL["INFO"] = 0] = "INFO";
+    LOG_LEVEL[LOG_LEVEL["WARN"] = 1] = "WARN";
+    LOG_LEVEL[LOG_LEVEL["ERROR"] = 2] = "ERROR";
+    LOG_LEVEL[LOG_LEVEL["NONE"] = 3] = "NONE";
+})(LOG_LEVEL || (LOG_LEVEL = {}));
+var logLevel = LOG_LEVEL.NONE;
+export function log(level, msg) {
+    if (process.env.NODE_ENV === 'development') {
+        if (level >= logLevel) {
+            switch (level) {
+                case LOG_LEVEL.INFO: {
+                    console.log("%c FEATURE ENGINE :> " + msg + " ", 'background: #aaaaff11; color: #00aaff');
+                    break;
+                }
+                case LOG_LEVEL.WARN: {
+                    console.log("%c FEATURE ENGINE :> " + msg + " ", 'background: #aaffff11; color: #ffffaa');
+                    break;
+                }
+                case LOG_LEVEL.ERROR: {
+                    console.log("%c FEATURE ENGINE :> " + msg + " ", 'background: #ffaaaa11; color: #ff5555');
+                    break;
+                }
+            }
+        }
+    }
+    if (process.env.NODE_ENV === 'test') {
+        if (level >= logLevel) {
+            switch (level) {
+                case LOG_LEVEL.INFO: {
+                    console.log("%c FEATURE ENGINE :> " + msg + " ", 'background: #aaaaff11; color: #00aaff');
+                    break;
+                }
+                case LOG_LEVEL.WARN: {
+                    console.log("%c FEATURE ENGINE :> " + msg + " ", 'background: #aaffff11; color: #ffffaa');
+                    break;
+                }
+                case LOG_LEVEL.ERROR: {
+                    console.log("%c FEATURE ENGINE :> " + msg + " ", 'background: #ffaaaa11; color: #ff5555');
+                    break;
+                }
+            }
+        }
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/action.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/action.js
new file mode 100644
index 0000000..e12c010
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/action.js
@@ -0,0 +1,12 @@
+export const ACTIONS_SET = 'character.ACTIONS_SET';
+export const ACTIONS_SET_COMMIT = 'character.ACTIONS_SET_COMMIT';
+export const ACTION_USE_SET = 'character.ACTION_USE_SET';
+export const ACTION_USE_SET_COMMIT = 'character.ACTION_USE_SET_COMMIT';
+export const ACTION_CUSTOMIZATIONS_DELETE = 'character.ACTION_CUSTOMIZATIONS_DELETE';
+export const CUSTOM_ACTION_CREATE = 'character.CUSTOM_ACTION_CREATE';
+export const CUSTOM_ACTION_ADD = 'character.CUSTOM_ACTION_ADD';
+export const CUSTOM_ACTION_ADD_COMMIT = 'character.CUSTOM_ACTION_ADD_COMMIT';
+export const CUSTOM_ACTION_SET = 'character.CUSTOM_ACTION_SET';
+export const CUSTOM_ACTION_SET_COMMIT = 'character.CUSTOM_ACTION_SET_COMMIT';
+export const CUSTOM_ACTION_REMOVE = 'character.CUSTOM_ACTION_REMOVE';
+export const CUSTOM_ACTION_REMOVE_COMMIT = 'character.CUSTOM_ACTION_REMOVE_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/background.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/background.js
new file mode 100644
index 0000000..ff30995
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/background.js
@@ -0,0 +1,8 @@
+export const BACKGROUND_CHOICE_SET_REQUEST = 'character.BACKGROUND_CHOICE_SET_REQUEST';
+export const BACKGROUND_CHOOSE = 'character.BACKGROUND_CHOOSE';
+export const BACKGROUND_CUSTOM_SET_REQUEST = 'character.BACKGROUND_CUSTOM_SET_REQUEST';
+export const BACKGROUND_HAS_CUSTOM_SET_REQUEST = 'character.BACKGROUND_HAS_CUSTOM_SET_REQUEST';
+export const BACKGROUND_HAS_CUSTOM_SET = 'character.BACKGROUND_HAS_CUSTOM_SET';
+export const BACKGROUND_HAS_CUSTOM_SET_COMMIT = 'character.BACKGROUND_HAS_CUSTOM_SET_COMMIT';
+export const BACKGROUND_SET = 'character.BACKGROUND_SET';
+export const BACKGROUND_SET_COMMIT = 'character.BACKGROUND_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/campaignSetting.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/campaignSetting.js
new file mode 100644
index 0000000..c919d1e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/campaignSetting.js
@@ -0,0 +1,3 @@
+export const CAMPAIGN_SETTING_SET_REQUEST = 'character.CAMPAIGN_SETTING_SET_REQUEST';
+export const CAMPAIGN_SETTING_SET = 'character.CAMPAIGN_SETTING_SET';
+export const CAMPAIGN_SETTING_SET_COMMIT = 'character.CAMPAIGN_SETTING_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/character.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/character.js
new file mode 100644
index 0000000..b54e0a2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/character.js
@@ -0,0 +1,101 @@
+export const CHARACTER_LOAD = 'character.CHARACTER_LOAD';
+export const CHARACTER_LOAD_POST_ACTION = 'character.CHARACTER_LOAD_POST_ACTION';
+export const LOAD_LAZY_CHARACTER_DATA = 'character.LOAD_LAZY_CHARACTER_DATA';
+export const NAME_SET = 'character.NAME_SET';
+export const NAME_SET_COMMIT = 'character.NAME_SET_COMMIT';
+export const RANDOM_NAME_REQUEST = 'character.RANDOM_NAME_REQUEST';
+export const ALIGNMENT_SET = 'character.ALIGNMENT_SET';
+export const ALIGNMENT_SET_COMMIT = 'character.ALIGNMENT_SET_COMMIT';
+export const LIFESTYLE_SET = 'character.LIFESTYLE_SET';
+export const LIFESTYLE_SET_COMMIT = 'character.LIFESTYLE_SET_COMMIT';
+export const FAITH_SET = 'character.FAITH_SET';
+export const FAITH_SET_COMMIT = 'character.FAITH_SET_COMMIT';
+export const HAIR_SET = 'character.HAIR_SET';
+export const HAIR_SET_COMMIT = 'character.HAIR_SET_COMMIT';
+export const SKIN_SET = 'character.SKIN_SET';
+export const SKIN_SET_COMMIT = 'character.SKIN_SET_COMMIT';
+export const EYES_SET = 'character.EYES_SET';
+export const EYES_SET_COMMIT = 'character.EYES_SET_COMMIT';
+export const HEIGHT_SET = 'character.HEIGHT_SET';
+export const HEIGHT_SET_COMMIT = 'character.HEIGHT_SET_COMMIT';
+export const WEIGHT_SET = 'character.WEIGHT_SET';
+export const WEIGHT_SET_COMMIT = 'character.WEIGHT_SET_COMMIT';
+export const AGE_SET = 'character.AGE_SET';
+export const AGE_SET_COMMIT = 'character.AGE_SET_COMMIT';
+export const GENDER_SET = 'character.GENDER_SET';
+export const GENDER_SET_COMMIT = 'character.GENDER_SET_COMMIT';
+export const NOTE_SET = 'character.NOTE_SET';
+export const NOTE_SET_COMMIT = 'character.NOTE_SET_COMMIT';
+export const TRAIT_SET = 'character.TRAIT_SET';
+export const TRAIT_SET_COMMIT = 'character.TRAIT_SET_COMMIT';
+export const STARTING_EQUIPMENT_ADD_REQUEST = 'character.STARTING_EQUIPMENT_ADD_REQUEST';
+export const STARTING_GOLD_ADD_REQUEST = 'character.STARTING_GOLD_ADD_REQUEST';
+export const ABILITY_SCORE_SET = 'character.ABILITY_SCORE_SET';
+export const ABILITY_SCORE_BONUS_SET = 'character.ABILITY_SCORE_BONUS_SET';
+export const ABILITY_SCORE_BONUS_SET_COMMIT = 'character.ABILITY_SCORE_BONUS_SET_COMMIT';
+export const ABILITY_SCORE_OVERRIDE_SET = 'character.ABILITY_SCORE_OVERRIDE_SET';
+export const ABILITY_SCORE_OVERRIDE_SET_COMMIT = 'character.ABILITY_SCORE_OVERRIDE_SET_COMMIT';
+export const ABILITY_SCORE_BASE_SET = 'character.ABILITY_SCORE_BASE_SET';
+export const ABILITY_SCORE_BASE_SET_COMMIT = 'character.ABILITY_SCORE_BASE_SET_COMMIT';
+export const MOVEMENT_ADD = 'character.MOVEMENT_ADD';
+export const MOVEMENT_ADD_COMMIT = 'character.MOVEMENT_ADD_COMMIT';
+export const MOVEMENT_SET = 'character.MOVEMENT_SET';
+export const MOVEMENT_SET_COMMIT = 'character.MOVEMENT_SET_COMMIT';
+export const MOVEMENT_REMOVE = 'character.MOVEMENT_REMOVE';
+export const MOVEMENT_REMOVE_COMMIT = 'character.MOVEMENT_REMOVE_COMMIT';
+export const SENSE_ADD = 'character.SENSE_ADD';
+export const SENSE_ADD_COMMIT = 'character.SENSE_ADD_COMMIT';
+export const SENSE_SET = 'character.SENSE_SET';
+export const SENSE_SET_COMMIT = 'character.SENSE_SET_COMMIT';
+export const SENSE_REMOVE = 'character.SENSE_REMOVE';
+export const SENSE_REMOVE_COMMIT = 'character.SENSE_REMOVE_COMMIT';
+export const CUSTOM_PROFICIENCY_CREATE = 'character.CUSTOM_PROFICIENCY_CREATE';
+export const CUSTOM_PROFICIENCY_ADD = 'character.CUSTOM_PROFICIENCY_ADD';
+export const CUSTOM_PROFICIENCY_ADD_COMMIT = 'character.CUSTOM_PROFICIENCY_ADD_COMMIT';
+export const CUSTOM_PROFICIENCY_SET = 'character.CUSTOM_PROFICIENCY_SET';
+export const CUSTOM_PROFICIENCY_SET_COMMIT = 'character.CUSTOM_PROFICIENCY_SET_COMMIT';
+export const CUSTOM_PROFICIENCY_REMOVE = 'character.CUSTOM_PROFICIENCY_REMOVE';
+export const CUSTOM_PROFICIENCY_REMOVE_COMMIT = 'character.CUSTOM_PROFICIENCY_REMOVE_COMMIT';
+export const CUSTOM_DEFENSE_ADJUSTMENT_ADD = 'character.CUSTOM_DEFENSE_ADJUSTMENT_ADD';
+export const CUSTOM_DEFENSE_ADJUSTMENT_ADD_COMMIT = 'character.CUSTOM_DEFENSE_ADJUSTMENT_ADD_COMMIT';
+export const CUSTOM_DEFENSE_ADJUSTMENT_SET = 'character.CUSTOM_DEFENSE_ADJUSTMENT_SET';
+export const CUSTOM_DEFENSE_ADJUSTMENT_SET_COMMIT = 'character.CUSTOM_DEFENSE_ADJUSTMENT_SET_COMMIT';
+export const CUSTOM_DEFENSE_ADJUSTMENT_REMOVE = 'character.CUSTOM_DEFENSE_ADJUSTMENT_REMOVE';
+export const CUSTOM_DEFENSE_ADJUSTMENT_REMOVE_COMMIT = 'character.CUSTOM_DEFENSE_ADJUSTMENT_REMOVE_COMMIT';
+export const XP_SET = 'character.XP_SET';
+export const XP_SET_COMMIT = 'character.XP_SET_COMMIT';
+export const XP_SET_REQUEST = 'character.XP_SET_REQUEST';
+export const BASE_HIT_POINTS_SET = 'character.BASE_HIT_POINTS_SET';
+export const BASE_HIT_POINTS_SET_COMMIT = 'character.BASE_HIT_POINTS_SET_COMMIT';
+export const HIT_POINTS_SET = 'character.HIT_POINTS_SET';
+export const HIT_POINTS_SET_COMMIT = 'character.HIT_POINTS_SET_COMMIT';
+export const BONUS_HIT_POINTS_SET = 'character.BONUS_HIT_POINTS_SET';
+export const BONUS_HIT_POINTS_SET_COMMIT = 'character.BONUS_HIT_POINTS_SET_COMMIT';
+export const OVERRIDE_HIT_POINTS_SET = 'character.OVERRIDE_HIT_POINTS_SET';
+export const OVERRIDE_HIT_POINTS_SET_COMMIT = 'character.OVERRIDE_HIT_POINTS_SET_COMMIT';
+export const DEATHSAVES_SET = 'character.DEATHSAVES_SET';
+export const DEATHSAVES_SET_COMMIT = 'character.DEATHSAVES_SET_COMMIT';
+export const RESTORE_LIFE = 'character.RESTORE_LIFE';
+export const SHORT_REST = 'character.SHORT_REST';
+export const SHORT_REST_COMMIT = 'character.SHORT_REST_COMMIT';
+export const LONG_REST = 'character.LONG_REST';
+export const LONG_REST_COMMIT = 'character.LONG_REST_COMMIT';
+export const CURRENCIES_SET = 'character.CURRENCIES_SET';
+export const CURRENCIES_SET_COMMIT = 'character.CURRENCIES_SET_COMMIT';
+export const CURRENCY_TRANSACTION_SET = 'character.CURRENCY_TRANSACTION_SET';
+export const CURRENCY_COPPER_SET = 'character.CURRENCY_COPPER_SET';
+export const CURRENCY_COPPER_SET_COMMIT = 'character.CURRENCY_COPPER_SET_COMMIT';
+export const CURRENCY_ELECTRUM_SET = 'character.CURRENCY_ELECTRUM_SET';
+export const CURRENCY_ELECTRUM_SET_COMMIT = 'character.CURRENCY_ELECTRUM_SET_COMMIT';
+export const CURRENCY_GOLD_SET = 'character.CURRENCY_GOLD_SET';
+export const CURRENCY_GOLD_SET_COMMIT = 'character.CURRENCY_GOLD_SET_COMMIT';
+export const CURRENCY_PLATINUM_SET = 'character.CURRENCY_PLATINUM_SET';
+export const CURRENCY_PLATINUM_SET_COMMIT = 'character.CURRENCY_PLATINUM_SET_COMMIT';
+export const CURRENCY_SILVER_SET = 'character.CURRENCY_SILVER_SET';
+export const CURRENCY_SILVER_SET_COMMIT = 'character.CURRENCY_SILVER_SET_COMMIT';
+export const INSPIRATION_SET = 'character.INSPIRATION_SET';
+export const INSPIRATION_SET_COMMIT = 'character.INSPIRATION_SET_COMMIT';
+export const STATUS_SET = 'character.STATUS_SET';
+export const STATUS_SET_COMMIT = 'character.STATUS_SET_COMMIT';
+export const STATUS_SLUG_SET = 'character.STATUS_SLUG_SET';
+export const STATUS_SLUG_SET_COMMIT = 'character.STATUS_SLUG_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/choice.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/choice.js
new file mode 100644
index 0000000..5a10154
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/choice.js
@@ -0,0 +1,2 @@
+export const CHOICES_SET = 'character.CHOICES_SET';
+export const CHOICES_SET_COMMIT = 'character.CHOICES_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/class.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/class.js
new file mode 100644
index 0000000..9f25c97
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/class.js
@@ -0,0 +1,13 @@
+export const INITIAL_CLASS_SET = 'character.INITIAL_CLASS_SET';
+export const CLASS_ADD = 'character.CLASS_ADD';
+export const CLASS_ADD_REQUEST = 'character.CLASS_ADD_REQUEST';
+export const CLASS_ADD_POST_ACTION = 'character.CLASS_ADD_POST_ACTION';
+export const CLASS_REMOVE_REQUEST = 'character.CLASS_REMOVE_REQUEST';
+export const CLASS_REMOVE_POST_ACTION = 'character.CLASS_REMOVE_POST_ACTION';
+export const CLASS_REMOVE_COMMIT = 'character.CLASS_REMOVE_COMMIT';
+export const CLASS_SET = 'character.CLASS_SET';
+export const CLASS_SET_COMMIT = 'character.CLASS_SET_COMMIT';
+export const CLASS_LEVEL_SET_REQUEST = 'character.CLASS_LEVEL_SET_REQUEST';
+export const CLASSES_SET = 'character.CLASSES_SET';
+export const CLASSES_SET_COMMIT = 'character.CLASSES_SET_COMMIT';
+export const CLASSES_UNSET = 'character.CLASSES_UNSET';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/classFeature.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/classFeature.js
new file mode 100644
index 0000000..65cf9a5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/classFeature.js
@@ -0,0 +1 @@
+export const CLASS_FEATURE_CHOICE_SET_REQUEST = 'character.CLASS_FEATURE_CHOICE_SET_REQUEST';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/condition.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/condition.js
new file mode 100644
index 0000000..87886c0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/condition.js
@@ -0,0 +1,5 @@
+export const CONDITION_SET = 'character.CONDITION_SET';
+export const CONDITION_ADD = 'character.CONDITION_ADD';
+export const CONDITION_REMOVE = 'character.CONDITION_REMOVE';
+export const CONDITIONS_SET = 'character.CONDITIONS_SET';
+export const CONDITIONS_SET_COMMIT = 'character.CONDITIONS_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/configuration.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/configuration.js
new file mode 100644
index 0000000..17c07dd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/configuration.js
@@ -0,0 +1,6 @@
+export const SHOW_HELP_TEXT_SET = 'character.SHOW_HELP_TEXT_SET';
+export const SHOW_HELP_TEXT_SET_REQUEST = 'character.SHOW_HELP_TEXT_SET_REQUEST';
+export const ABILITY_SCORE_TYPE_SET_REQUEST = 'character.ABILITY_SCORE_TYPE_SET_REQUEST';
+export const ABILITY_SCORE_TYPE_SET_COMMIT = 'character.ABILITY_SCORE_TYPE_SET_COMMIT';
+export const STARTING_EQUIPMENT_TYPE_SET = 'character.STARTING_EQUIPMENT_TYPE_SET';
+export const STARTING_EQUIPMENT_TYPE_SET_COMMIT = 'character.STARTING_EQUIPMENT_TYPE_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/core.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/core.js
new file mode 100644
index 0000000..cffd460
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/core.js
@@ -0,0 +1,11 @@
+export const CHARACTER_SET = 'character.CHARACTER_SET';
+export const CHARACTER_COMPONENTS_SET = 'character.CHARACTER_COMPONENTS_SET';
+export const CHARACTER_COMPONENTS_SET_COMMIT = 'character.CHARACTER_COMPONENTS_SET_COMMIT';
+export const ACTIVE_SOURCE_CATEGORIES_SET = 'character.ACTIVE_SOURCE_CATEGORIES_SET';
+export const ACTIVE_SOURCE_CATEGORIES_SET_COMMIT = 'character.ACTIVE_SOURCE_CATEGORIES_SET_COMMIT';
+export const ACTIVE_SOURCES_SET = 'character.ACTIVE_SOURCES_SET';
+export const ACTIVE_SOURCES_SET_COMMIT = 'character.ACTIVE_SOURCES_SET_COMMIT';
+export const PREFERENCE_CHOOSE = 'character.PREFERENCE_CHOOSE';
+export const PREFERENCE_SET = 'character.PREFERENCE_SET';
+export const PREFERENCE_SET_COMMIT = 'character.PREFERENCE_SET_COMMIT';
+export const SEND_SOCIAL_IMAGE_DATA = 'character.SEND_SOCIAL_IMAGE_DATA';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/creature.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/creature.js
new file mode 100644
index 0000000..b81ce27
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/creature.js
@@ -0,0 +1,12 @@
+export const CREATURE_CREATE = 'character.CREATURE_CREATE';
+export const CREATURE_ADD = 'character.CREATURE_ADD';
+export const CREATURE_ADD_COMMIT = 'character.CREATURE_ADD_COMMIT';
+export const CREATURE_REMOVE = 'character.CREATURE_REMOVE';
+export const CREATURE_REMOVE_COMMIT = 'character.CREATURE_REMOVE_COMMIT';
+export const CREATURE_DATA_SET = 'character.CREATURE_DATA_SET';
+export const CREATURE_DATA_SET_COMMIT = 'character.CREATURE_DATA_SET_COMMIT';
+export const CREATURE_HIT_POINTS_SET = 'character.CREATURE_HIT_POINTS_SET';
+export const CREATURE_HIT_POINTS_SET_COMMIT = 'character.CREATURE_HIT_POINTS_SET_COMMIT';
+export const CREATURE_ACTIVE_SET = 'character.CREATURE_ACTIVE_SET';
+export const CREATURE_ACTIVE_SET_COMMIT = 'character.CREATURE_ACTIVE_SET_COMMIT';
+export const CREATURE_CUSTOMIZATIONS_DELETE = 'character.CREATURE_CUSTOMIZATIONS_DELETE';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/decoration.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/decoration.js
new file mode 100644
index 0000000..1a35232
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/decoration.js
@@ -0,0 +1,9 @@
+export const BACKDROP_SET = 'character.BACKDROP_SET';
+export const BACKDROP_SET_COMMIT = 'character.BACKDROP_SET_COMMIT';
+export const FRAME_SET = 'character.FRAME_SET';
+export const FRAME_SET_COMMIT = 'character.FRAME_SET_COMMIT';
+export const THEME_SET = 'character.THEME_SET';
+export const THEME_SET_COMMIT = 'character.THEME_SET_COMMIT';
+export const PORTRAIT_SET = 'character.PORTRAIT_SET';
+export const PORTRAIT_SET_COMMIT = 'character.PORTRAIT_SET_COMMIT';
+export const PORTRAIT_UPLOAD = 'character.PORTRAIT_UPLOAD';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/feat.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/feat.js
new file mode 100644
index 0000000..3390380
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/feat.js
@@ -0,0 +1,6 @@
+export const FEAT_CHOICE_SET_REQUEST = 'character.FEAT_CHOICE_SET_REQUEST';
+export const FEATS_SET = 'character.FEATS_SET';
+export const FEATS_SET_COMMIT = 'character.FEATS_SET_COMMIT';
+export const ADHOC_FEAT_CREATE = 'character.ADHOC_FEAT_CREATE';
+export const ADHOC_FEAT_REMOVE = 'character.ADHOC_FEAT_REMOVE';
+export const SET_ENTITY_FEAT = 'character.SET_ENTITY_FEAT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/item.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/item.js
new file mode 100644
index 0000000..37f5a42
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/item.js
@@ -0,0 +1,39 @@
+export const ITEM_CREATE = 'character.ITEM_CREATE';
+export const ITEM_ADD = 'character.ITEM_ADD';
+export const ITEM_ADD_COMMIT = 'character.ITEM_ADD_COMMIT';
+export const ITEM_REMOVE = 'character.ITEM_REMOVE';
+export const ITEM_REMOVE_COMMIT = 'character.ITEM_REMOVE_COMMIT';
+export const ITEM_DESTROY = 'character.ITEM_DESTROY';
+export const ITEM_MOVE_SET = 'character.ITEM_MOVE_SET';
+export const ITEM_MOVE_SET_COMMIT = 'character.ITEM_MOVE_SET_COMMIT';
+export const ITEM_EQUIPPED_SET = 'character.ITEM_EQUIPPED_SET';
+export const ITEM_EQUIPPED_SET_COMMIT = 'character.ITEM_EQUIPPED_SET_COMMIT';
+export const ITEM_ATTUNE_SET = 'character.ITEM_ATTUNE_SET';
+export const ITEM_ATTUNE_SET_COMMIT = 'character.ITEM_ATTUNE_SET_COMMIT';
+export const ITEM_QUANTITY_SET = 'character.ITEM_QUANTITY_SET';
+export const ITEM_QUANTITY_SET_COMMIT = 'character.ITEM_QUANTITY_SET_COMMIT';
+export const ITEM_CHARGES_SET = 'character.ITEM_CHARGES_SET';
+export const ITEM_CHARGES_SET_COMMIT = 'character.ITEM_CHARGES_SET_COMMIT';
+export const ITEM_DISPLAY_AS_ATTACK_SET = 'character.ITEM_DISPLAY_AS_ATTACK_SET';
+export const ITEM_DISPLAY_AS_ATTACK_SET_COMMIT = 'character.ITEM_DISPLAY_AS_ATTACK_SET_COMMIT';
+export const ITEM_CUSTOMIZATIONS_DELETE = 'character.ITEM_CUSTOMIZATIONS_DELETE';
+export const CUSTOM_ITEM_CREATE = 'character.CUSTOM_ITEM_CREATE';
+export const CUSTOM_ITEM_DESTROY = 'character.CUSTOM_ITEM_DESTROY';
+export const CUSTOM_ITEM_ADD = 'character.CUSTOM_ITEM_ADD';
+export const CUSTOM_ITEM_ADD_COMMIT = 'character.CUSTOM_ITEM_ADD_COMMIT';
+export const CUSTOM_ITEM_REMOVE = 'character.CUSTOM_ITEM_REMOVE';
+export const CUSTOM_ITEM_REMOVE_COMMIT = 'character.CUSTOM_ITEM_REMOVE_COMMIT';
+export const CUSTOM_ITEM_SET = 'character.CUSTOM_ITEM_SET';
+export const CUSTOM_ITEM_SET_COMMIT = 'character.CUSTOM_ITEM_SET_COMMIT';
+export const ITEM_CURRENCY_SET = 'character.ITEM_CURRENCY_SET';
+export const ITEM_CURRENCY_SET_COMMIT = 'character.ITEM_CURRENCY_SET_COMMIT';
+export const ITEM_CURRENCY_COPPER_SET = 'character.ITEM_CURRENCY_COPPER_SET';
+export const ITEM_CURRENCY_COPPER_SET_COMMIT = 'character.ITEM_CURRENCY_COPPER_SET_COMMIT';
+export const ITEM_CURRENCY_ELECTRUM_SET = 'character.ITEM_CURRENCY_ELECTRUM_SET';
+export const ITEM_CURRENCY_ELECTRUM_SET_COMMIT = 'character.ITEM_CURRENCY_ELECTRUM_SET_COMMIT';
+export const ITEM_CURRENCY_GOLD_SET = 'character.ITEM_CURRENCY_GOLD_SET';
+export const ITEM_CURRENCY_GOLD_SET_COMMIT = 'character.ITEM_CURRENCY_GOLD_SET_COMMIT';
+export const ITEM_CURRENCY_PLATINUM_SET = 'character.ITEM_CURRENCY_PLATINUM_SET';
+export const ITEM_CURRENCY_PLATINUM_SET_COMMIT = 'character.ITEM_CURRENCY_PLATINUM_SET_COMMIT';
+export const ITEM_CURRENCY_SILVER_SET = 'character.ITEM_CURRENCY_SILVER_SET';
+export const ITEM_CURRENCY_SILVER_SET_COMMIT = 'character.ITEM_CURRENCY_SILVER_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/modifier.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/modifier.js
new file mode 100644
index 0000000..c8107d1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/modifier.js
@@ -0,0 +1,2 @@
+export const MODIFIERS_SET = 'character.MODIFIERS_SET';
+export const MODIFIERS_SET_COMMIT = 'character.MODIFIERS_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/option.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/option.js
new file mode 100644
index 0000000..d104377
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/option.js
@@ -0,0 +1,2 @@
+export const OPTIONS_SET = 'character.OPTIONS_SET';
+export const OPTIONS_SET_COMMIT = 'character.OPTIONS_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/optionalClassFeature.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/optionalClassFeature.js
new file mode 100644
index 0000000..c1708e2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/optionalClassFeature.js
@@ -0,0 +1,9 @@
+export const OPTIONAL_CLASS_FEATURE_CREATE = 'character.OPTIONAL_CLASS_FEATURE_CREATE';
+export const OPTIONAL_CLASS_FEATURE_ADD = 'character.OPTIONAL_CLASS_FEATURE_ADD';
+export const OPTIONAL_CLASS_FEATURE_ADD_COMMIT = 'character.OPTIONAL_CLASS_FEATURE_ADD_COMMIT';
+export const OPTIONAL_CLASS_FEATURE_SET_REQUEST = 'character.OPTIONAL_CLASS_FEATURE_SET_REQUEST';
+export const OPTIONAL_CLASS_FEATURE_SET = 'character.OPTIONAL_CLASS_FEATURE_SET';
+export const OPTIONAL_CLASS_FEATURE_SET_COMMIT = 'character.OPTIONAL_CLASS_FEATURE_SET_COMMIT';
+export const OPTIONAL_CLASS_FEATURE_DESTROY = 'character.OPTIONAL_CLASS_FEATURE_DESTROY';
+export const OPTIONAL_CLASS_FEATURE_REMOVE = 'character.OPTIONAL_CLASS_FEATURE_REMOVE';
+export const OPTIONAL_CLASS_FEATURE_REMOVE_COMMIT = 'character.OPTIONAL_CLASS_FEATURE_REMOVE_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/optionalOrigin.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/optionalOrigin.js
new file mode 100644
index 0000000..f2396cb
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/optionalOrigin.js
@@ -0,0 +1,9 @@
+export const OPTIONAL_ORIGIN_CREATE = 'character.OPTIONAL_ORIGIN_CREATE';
+export const OPTIONAL_ORIGIN_ADD = 'character.OPTIONAL_ORIGIN_ADD';
+export const OPTIONAL_ORIGIN_ADD_COMMIT = 'character.OPTIONAL_ORIGIN_ADD_COMMIT';
+export const OPTIONAL_ORIGIN_SET_REQUEST = 'character.OPTIONAL_ORIGIN_SET_REQUEST';
+export const OPTIONAL_ORIGIN_SET = 'character.OPTIONAL_ORIGIN_SET';
+export const OPTIONAL_ORIGIN_SET_COMMIT = 'character.OPTIONAL_ORIGIN_SET_COMMIT';
+export const OPTIONAL_ORIGIN_DESTROY = 'character.OPTIONAL_ORIGIN_DESTROY';
+export const OPTIONAL_ORIGIN_REMOVE = 'character.OPTIONAL_ORIGIN_REMOVE';
+export const OPTIONAL_ORIGIN_REMOVE_COMMIT = 'character.OPTIONAL_ORIGIN_REMOVE_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/premadeInfo.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/premadeInfo.js
new file mode 100644
index 0000000..ef7d3a7
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/premadeInfo.js
@@ -0,0 +1,6 @@
+export const PREMADE_INFO_ADD = 'character.PREMADE_INFO_ADD';
+export const PREMADE_INFO_GET = 'character.PREMADE_INFO_GET';
+export const PREMADE_INFO_UPDATE = 'character.PREMADE_INFO_UPDATE';
+export const PREMADE_INFO_DELETE = 'character.PREMADE_INFO_DELETE';
+export const PREMADE_INFO_SET_COMMIT = 'character.PREMADE_INFO_SET_COMMIT';
+export const PREMADE_INFO_REMOVE_COMMIT = 'character.PREMADE_INFO_REMOVE_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/race.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/race.js
new file mode 100644
index 0000000..681768e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/race.js
@@ -0,0 +1,5 @@
+export const RACE_CHOOSE = 'character.RACE_CHOOSE';
+export const RACE_CHOOSE_POST_ACTION = 'character.RACE_CHOOSE_POST_ACTION';
+export const RACE_SET = 'character.RACE_SET';
+export const RACE_SET_COMMIT = 'character.RACE_SET_COMMIT';
+export const RACE_UNSET = 'character.RACE_UNSET';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/racialTrait.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/racialTrait.js
new file mode 100644
index 0000000..8300273
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/racialTrait.js
@@ -0,0 +1 @@
+export const RACIAL_TRAIT_CHOICE_SET_REQUEST = 'character.RACIAL_TRAIT_CHOICE_SET_REQUEST';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/spell.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/spell.js
new file mode 100644
index 0000000..fd4117f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/spell.js
@@ -0,0 +1,24 @@
+export const SPELL_CREATE = 'character.SPELL_CREATE';
+export const SPELL_ADD = 'character.SPELL_ADD';
+export const SPELL_ADD_COMMIT = 'character.SPELL_ADD_COMMIT';
+export const SPELL_REMOVE = 'character.SPELL_REMOVE';
+export const SPELL_REMOVE_COMMIT = 'character.SPELL_REMOVE_COMMIT';
+export const SPELL_PREPARED_SET = 'character.SPELL_PREPARED_SET';
+export const SPELL_PREPARED_SET_COMMIT = 'character.SPELL_PREPARED_SET_COMMIT';
+export const SPELL_USE_SET = 'character.SPELL_USE_SET';
+export const SPELL_USE_SET_COMMIT = 'character.SPELL_USE_SET_COMMIT';
+export const SPELL_LEVEL_SPELL_SLOTS_SET = 'character.SPELL_LEVEL_SPELL_SLOTS_SET';
+export const SPELL_LEVEL_SPELL_SLOTS_SET_COMMIT = 'character.SPELL_LEVEL_SPELL_SLOTS_SET_COMMIT';
+export const PACT_MAGIC_SET = 'character.PACT_MAGIC_SET';
+export const PACT_MAGIC_SET_COMMIT = 'character.PACT_MAGIC_SET_COMMIT';
+export const SPELL_LEVEL_PACT_MAGIC_SLOTS_SET = 'character.SPELL_LEVEL_PACT_MAGIC_SLOTS_SET';
+export const SPELL_LEVEL_PACT_MAGIC_SLOTS_SET_COMMIT = 'character.SPELL_LEVEL_PACT_MAGIC_SLOTS_SET_COMMIT';
+export const SPELL_DISPLAY_AS_ATTACK_SET = 'character.SPELL_DISPLAY_AS_ATTACK_SET';
+export const SPELL_DISPLAY_AS_ATTACK_SET_COMMIT = 'character.SPELL_DISPLAY_AS_ATTACK_SET_COMMIT';
+export const SPELL_FEATURE_DISPLAY_AS_ATTACK_SET = 'character.SPELL_FEATURE_DISPLAY_AS_ATTACK_SET';
+export const SPELL_FEATURE_DISPLAY_AS_ATTACK_SET_COMMIT = 'character.SPELL_FEATURE_DISPLAY_AS_ATTACK_SET_COMMIT';
+export const SPELL_CUSTOMIZATIONS_DELETE = 'character.SPELL_CUSTOMIZATIONS_DELETE';
+export const SPELLS_SLOTS_SET = 'character.SPELLS_SLOTS_SET';
+export const SPELLS_SLOTS_SET_COMMIT = 'character.SPELLS_SLOTS_SET_COMMIT';
+export const CHARACTER_SPELLS_SET = 'character.CHARACTER_SPELLS_SET';
+export const CHARACTER_SPELLS_SET_COMMIT = 'character.CHARACTER_SPELLS_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actionTypes/value.js b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/value.js
new file mode 100644
index 0000000..d77ccb6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actionTypes/value.js
@@ -0,0 +1,6 @@
+export const VALUE_SET = 'character.VALUE_SET';
+export const VALUE_SET_COMMIT = 'character.VALUE_SET_COMMIT';
+export const VALUE_REMOVE = 'character.VALUE_REMOVE';
+export const VALUE_REMOVE_COMMIT = 'character.VALUE_REMOVE_COMMIT';
+export const ENTITY_VALUES_REMOVE = 'character.ENTITY_VALUES_REMOVE';
+export const ENTITY_VALUES_REMOVE_COMMIT = 'character.ENTITY_VALUES_REMOVE_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/action.js b/ddb_main/packages/rules-engine/es/actions/character/actions/action.js
new file mode 100644
index 0000000..3a216aa
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/action.js
@@ -0,0 +1,124 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param name
+ * @param actionType
+ */
+export function customActionCreate(name, actionType) {
+    return {
+        type: actionTypes.CUSTOM_ACTION_CREATE,
+        payload: {
+            name,
+            actionType,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param actions
+ */
+export function actionsSet(actions) {
+    return {
+        type: actionTypes.ACTIONS_SET,
+        payload: {
+            actions,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ACTIONS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param entityTypeId
+ * @param uses
+ * @param dataOriginType
+ */
+export function actionUseSet(id, entityTypeId, uses, dataOriginType) {
+    return {
+        type: actionTypes.ACTION_USE_SET,
+        payload: {
+            id,
+            entityTypeId,
+            uses,
+            dataOriginType,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ACTION_USE_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param action
+ */
+export function customActionAdd(action) {
+    return {
+        type: actionTypes.CUSTOM_ACTION_ADD,
+        payload: {
+            action,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_ACTION_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ */
+export function customActionRemove(id) {
+    return {
+        type: actionTypes.CUSTOM_ACTION_REMOVE,
+        payload: {
+            id,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_ACTION_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param properties
+ */
+export function customActionSet(id, properties) {
+    return {
+        type: actionTypes.CUSTOM_ACTION_SET,
+        payload: {
+            id,
+            properties,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_ACTION_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param mappingId
+ * @param mappingEntityTypeId
+ */
+export function actionCustomizationsDelete(mappingId, mappingEntityTypeId) {
+    return {
+        type: actionTypes.ACTION_CUSTOMIZATIONS_DELETE,
+        payload: {
+            mappingId,
+            mappingEntityTypeId,
+        },
+        meta: {},
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/background.js b/ddb_main/packages/rules-engine/es/actions/character/actions/background.js
new file mode 100644
index 0000000..7b32b69
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/background.js
@@ -0,0 +1,91 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param backgroundId
+ */
+export function backgroundChoose(backgroundId) {
+    return {
+        type: actionTypes.BACKGROUND_CHOOSE,
+        payload: {
+            backgroundId,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param background
+ */
+export function backgroundSet(background) {
+    return {
+        type: actionTypes.BACKGROUND_SET,
+        payload: {
+            background,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.BACKGROUND_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param choiceType
+ * @param choiceId
+ * @param optionValue
+ */
+export function backgroundChoiceSetRequest(choiceType, choiceId, optionValue) {
+    return {
+        type: actionTypes.BACKGROUND_CHOICE_SET_REQUEST,
+        payload: {
+            choiceType,
+            choiceId,
+            optionValue,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param hasCustomBackground
+ */
+export function backgroundHasCustomSet(hasCustomBackground) {
+    return {
+        type: actionTypes.BACKGROUND_HAS_CUSTOM_SET,
+        payload: {
+            hasCustomBackground,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.BACKGROUND_HAS_CUSTOM_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param hasCustomBackground
+ */
+export function backgroundHasCustomSetRequest(hasCustomBackground) {
+    return {
+        type: actionTypes.BACKGROUND_HAS_CUSTOM_SET_REQUEST,
+        payload: {
+            hasCustomBackground,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param properties
+ */
+export function backgroundCustomSetRequest(properties) {
+    return {
+        type: actionTypes.BACKGROUND_CUSTOM_SET_REQUEST,
+        payload: {
+            properties,
+        },
+        meta: {},
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/campaignSetting.js b/ddb_main/packages/rules-engine/es/actions/character/actions/campaignSetting.js
new file mode 100644
index 0000000..db3b805
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/campaignSetting.js
@@ -0,0 +1,28 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param racialTraitId
+ * @param affectedRacialTraitId
+ */
+export function campaignSettingSetRequest(CampaignSettingContract) {
+    return {
+        type: actionTypes.CAMPAIGN_SETTING_SET_REQUEST,
+        payload: Object.assign({}, CampaignSettingContract),
+        meta: {},
+    };
+}
+/**
+ *
+ * @param CustomCampaignSettingContract
+ */
+export function campaignSettingSet(CampaignSettingContract) {
+    return {
+        type: actionTypes.CAMPAIGN_SETTING_SET,
+        payload: Object.assign({}, CampaignSettingContract),
+        meta: {
+            commit: {
+                type: actionTypes.CAMPAIGN_SETTING_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/character.js b/ddb_main/packages/rules-engine/es/actions/character/actions/character.js
new file mode 100644
index 0000000..18a89b0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/character.js
@@ -0,0 +1,936 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ */
+export function characterLoad(characterId, requestParams = {}, config = {}) {
+    return {
+        type: actionTypes.CHARACTER_LOAD,
+        payload: {
+            characterId,
+            requestParams,
+            config: Object.assign({ includeAlwaysKnownSpells: false }, config),
+        },
+        meta: {
+            postAction: {
+                type: [actionTypes.CHARACTER_LOAD_POST_ACTION],
+            },
+        },
+    };
+}
+export function loadLazyCharacterData() {
+    return {
+        type: actionTypes.LOAD_LAZY_CHARACTER_DATA,
+        payload: {},
+        meta: {},
+    };
+}
+/**
+ *
+ * @param currentXp
+ */
+export function xpSetRequest(currentXp) {
+    return {
+        type: actionTypes.XP_SET_REQUEST,
+        payload: {
+            currentXp,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param currentXp
+ */
+export function xpSet(currentXp) {
+    return {
+        type: actionTypes.XP_SET,
+        payload: {
+            currentXp,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.XP_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ */
+export function randomNameRequest() {
+    return {
+        type: actionTypes.RANDOM_NAME_REQUEST,
+        payload: {},
+        meta: {},
+    };
+}
+/**
+ *
+ * @param name
+ */
+export function nameSet(name) {
+    return {
+        type: actionTypes.NAME_SET,
+        payload: {
+            name,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.NAME_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param restoreType
+ */
+export function restoreLife(restoreType) {
+    return {
+        type: actionTypes.RESTORE_LIFE,
+        payload: {
+            restoreType,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param name
+ * @param type
+ */
+export function customProficiencyCreate(name, type) {
+    return {
+        type: actionTypes.CUSTOM_PROFICIENCY_CREATE,
+        payload: {
+            name,
+            type,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param classHitDiceUsed
+ * @param resetMaxHpModifier
+ */
+export function shortRest(classHitDiceUsed, resetMaxHpModifier) {
+    return {
+        type: actionTypes.SHORT_REST,
+        payload: {
+            classHitDiceUsed,
+            resetMaxHpModifier,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param resetMaxHpModifier
+ * @param adjustConditionLevel
+ */
+export function longRest(resetMaxHpModifier, adjustConditionLevel) {
+    return {
+        type: actionTypes.LONG_REST,
+        payload: {
+            resetMaxHpModifier,
+            adjustConditionLevel,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param noteType
+ * @param content
+ */
+export function noteSet(noteType, content) {
+    return {
+        type: actionTypes.NOTE_SET,
+        payload: {
+            noteType,
+            content,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.NOTE_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param traitType
+ * @param content
+ */
+export function traitSet(traitType, content) {
+    return {
+        type: actionTypes.TRAIT_SET,
+        payload: {
+            traitType,
+            content,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.TRAIT_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param baseHitPoints
+ */
+export function baseHitPointsSet(baseHitPoints) {
+    return {
+        type: actionTypes.BASE_HIT_POINTS_SET,
+        payload: {
+            baseHitPoints,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.BASE_HIT_POINTS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param bonusHitPoints
+ */
+export function bonusHitPointsSet(bonusHitPoints) {
+    return {
+        type: actionTypes.BONUS_HIT_POINTS_SET,
+        payload: {
+            bonusHitPoints,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.BONUS_HIT_POINTS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param overrideHitPoints
+ */
+export function overrideHitPointsSet(overrideHitPoints) {
+    return {
+        type: actionTypes.OVERRIDE_HIT_POINTS_SET,
+        payload: {
+            overrideHitPoints,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.OVERRIDE_HIT_POINTS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param statId
+ * @param type
+ * @param value
+ */
+export function abilityScoreSet(statId, type, value) {
+    return {
+        type: actionTypes.ABILITY_SCORE_SET,
+        payload: {
+            statId,
+            type,
+            value,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param hair
+ */
+export function hairSet(hair) {
+    return {
+        type: actionTypes.HAIR_SET,
+        payload: {
+            hair,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.HAIR_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param skin
+ */
+export function skinSet(skin) {
+    return {
+        type: actionTypes.SKIN_SET,
+        payload: {
+            skin,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.SKIN_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param eyes
+ */
+export function eyesSet(eyes) {
+    return {
+        type: actionTypes.EYES_SET,
+        payload: {
+            eyes,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.EYES_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param height
+ */
+export function heightSet(height) {
+    return {
+        type: actionTypes.HEIGHT_SET,
+        payload: {
+            height,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.HEIGHT_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param weight
+ */
+export function weightSet(weight) {
+    return {
+        type: actionTypes.WEIGHT_SET,
+        payload: {
+            weight,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.WEIGHT_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param age
+ */
+export function ageSet(age) {
+    return {
+        type: actionTypes.AGE_SET,
+        payload: {
+            age,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.AGE_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param gender
+ */
+export function genderSet(gender) {
+    return {
+        type: actionTypes.GENDER_SET,
+        payload: {
+            gender,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.GENDER_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param alignmentId
+ */
+export function alignmentSet(alignmentId) {
+    return {
+        type: actionTypes.ALIGNMENT_SET,
+        payload: {
+            alignmentId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ALIGNMENT_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param lifestyleId
+ */
+export function lifestyleSet(lifestyleId) {
+    return {
+        type: actionTypes.LIFESTYLE_SET,
+        payload: {
+            lifestyleId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.LIFESTYLE_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param faith
+ */
+export function faithSet(faith) {
+    return {
+        type: actionTypes.FAITH_SET,
+        payload: {
+            faith,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.FAITH_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param removedHitPoints
+ * @param temporaryHitPoints
+ */
+export function hitPointsSet(removedHitPoints, temporaryHitPoints) {
+    return {
+        type: actionTypes.HIT_POINTS_SET,
+        payload: {
+            removedHitPoints,
+            temporaryHitPoints,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.HIT_POINTS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param inspiration
+ */
+export function inspirationSet(inspiration) {
+    return {
+        type: actionTypes.INSPIRATION_SET,
+        payload: {
+            inspiration,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.INSPIRATION_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param currencies
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ * @param accept
+ * @param reject
+ */
+export function currenciesSet(currencies, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.CURRENCIES_SET,
+        payload: Object.assign(Object.assign({}, currencies), { destinationEntityTypeId,
+            destinationEntityId }),
+        meta: {
+            commit: {
+                type: actionTypes.CURRENCIES_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function currencyCopperSet(amount, destinationEntityTypeId, destinationEntityId) {
+    return {
+        type: actionTypes.CURRENCY_COPPER_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CURRENCY_COPPER_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function currencyElectrumSet(amount, destinationEntityTypeId, destinationEntityId) {
+    return {
+        type: actionTypes.CURRENCY_ELECTRUM_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CURRENCY_ELECTRUM_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param transactionPayload
+ * @param accept
+ * @param reject
+ */
+export function currencyTransactionSet(transactionPayload, accept, reject) {
+    return {
+        type: actionTypes.CURRENCY_TRANSACTION_SET,
+        payload: Object.assign({}, transactionPayload),
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function currencyGoldSet(amount, destinationEntityTypeId, destinationEntityId) {
+    return {
+        type: actionTypes.CURRENCY_GOLD_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CURRENCY_GOLD_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function currencyPlatinumSet(amount, destinationEntityTypeId, destinationEntityId) {
+    return {
+        type: actionTypes.CURRENCY_PLATINUM_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CURRENCY_PLATINUM_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function currencySilverSet(amount, destinationEntityTypeId, destinationEntityId) {
+    return {
+        type: actionTypes.CURRENCY_SILVER_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CURRENCY_SILVER_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param starting
+ * @param accept
+ * @param reject
+ */
+export function startingEquipmentAddRequest(starting, accept, reject) {
+    return {
+        type: actionTypes.STARTING_EQUIPMENT_ADD_REQUEST,
+        payload: Object.assign({}, starting),
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param gold
+ * @param accept
+ * @param reject
+ */
+export function startingGoldAddRequest(gold, accept, reject) {
+    return {
+        type: actionTypes.STARTING_GOLD_ADD_REQUEST,
+        payload: {
+            gold,
+        },
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param fails
+ * @param successes
+ */
+export function deathSavesSet(fails, successes) {
+    return {
+        type: actionTypes.DEATHSAVES_SET,
+        payload: {
+            fails,
+            successes,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.DEATHSAVES_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param customSpeed
+ */
+export function movementAdd(customSpeed) {
+    return {
+        type: actionTypes.MOVEMENT_ADD,
+        payload: Object.assign({}, customSpeed),
+        meta: {
+            commit: {
+                type: actionTypes.MOVEMENT_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param customSpeed
+ */
+export function movementSet(customSpeed) {
+    return {
+        type: actionTypes.MOVEMENT_SET,
+        payload: Object.assign({}, customSpeed),
+        meta: {
+            commit: {
+                type: actionTypes.MOVEMENT_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param movementId
+ */
+export function movementRemove(movementId) {
+    return {
+        type: actionTypes.MOVEMENT_REMOVE,
+        payload: {
+            movementId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.MOVEMENT_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param customSense
+ */
+export function senseAdd(customSense) {
+    return {
+        type: actionTypes.SENSE_ADD,
+        payload: Object.assign({}, customSense),
+        meta: {
+            commit: {
+                type: actionTypes.SENSE_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param customSense
+ */
+export function senseSet(customSense) {
+    return {
+        type: actionTypes.SENSE_SET,
+        payload: Object.assign({}, customSense),
+        meta: {
+            commit: {
+                type: actionTypes.SENSE_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param senseId
+ */
+export function senseRemove(senseId) {
+    return {
+        type: actionTypes.SENSE_REMOVE,
+        payload: {
+            senseId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.SENSE_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param proficiency
+ */
+export function customProficiencyAdd(proficiency) {
+    return {
+        type: actionTypes.CUSTOM_PROFICIENCY_ADD,
+        payload: {
+            proficiency,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_PROFICIENCY_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ */
+export function customProficiencyRemove(id) {
+    return {
+        type: actionTypes.CUSTOM_PROFICIENCY_REMOVE,
+        payload: {
+            id,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_PROFICIENCY_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param properties
+ */
+export function customProficiencySet(id, properties) {
+    return {
+        type: actionTypes.CUSTOM_PROFICIENCY_SET,
+        payload: {
+            id,
+            properties,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_PROFICIENCY_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param customDefenseAdjustment
+ */
+export function customDefenseAdjustmentAdd(customDefenseAdjustment) {
+    return {
+        type: actionTypes.CUSTOM_DEFENSE_ADJUSTMENT_ADD,
+        payload: Object.assign({}, customDefenseAdjustment),
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_DEFENSE_ADJUSTMENT_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param customDefenseAdjustment
+ */
+export function customDefenseAdjustmentSet(customDefenseAdjustment) {
+    return {
+        type: actionTypes.CUSTOM_DEFENSE_ADJUSTMENT_SET,
+        payload: Object.assign({}, customDefenseAdjustment),
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_DEFENSE_ADJUSTMENT_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param type
+ * @param adjustmentId
+ */
+export function customDefenseAdjustmentRemove(type, adjustmentId) {
+    return {
+        type: actionTypes.CUSTOM_DEFENSE_ADJUSTMENT_REMOVE,
+        payload: {
+            type,
+            adjustmentId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_DEFENSE_ADJUSTMENT_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param statId
+ * @param value
+ */
+export function abilityScoreBonusSet(statId, value) {
+    return {
+        type: actionTypes.ABILITY_SCORE_BONUS_SET,
+        payload: {
+            statId,
+            value,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ABILITY_SCORE_BONUS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param statId
+ * @param value
+ */
+export function abilityScoreOverrideSet(statId, value) {
+    return {
+        type: actionTypes.ABILITY_SCORE_OVERRIDE_SET,
+        payload: {
+            statId,
+            value,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ABILITY_SCORE_OVERRIDE_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param statId
+ * @param value
+ */
+export function abilityScoreBaseSet(statId, value) {
+    return {
+        type: actionTypes.ABILITY_SCORE_BASE_SET,
+        payload: {
+            statId,
+            value,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ABILITY_SCORE_BASE_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param status
+ */
+export function statusSet(status) {
+    return {
+        type: actionTypes.STATUS_SET,
+        payload: {
+            status,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.STATUS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param statusSlug
+ */
+export function statusSlugSet(statusSlug) {
+    return {
+        type: actionTypes.STATUS_SLUG_SET,
+        payload: {
+            statusSlug,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.STATUS_SLUG_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/choice.js b/ddb_main/packages/rules-engine/es/actions/character/actions/choice.js
new file mode 100644
index 0000000..1e03f32
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/choice.js
@@ -0,0 +1,22 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param {array} choices
+ * @param {array} choices.background
+ * @param {array} choices.class
+ * @param {array} choices.feat
+ * @param {array} choices.race
+ */
+export function choicesSet(choices) {
+    return {
+        type: actionTypes.CHOICES_SET,
+        payload: {
+            choices,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CHOICES_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/class.js b/ddb_main/packages/rules-engine/es/actions/character/actions/class.js
new file mode 100644
index 0000000..1f83e0d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/class.js
@@ -0,0 +1,104 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param charClass
+ * @param level
+ */
+export function classAddRequest(charClass, level) {
+    return {
+        type: actionTypes.CLASS_ADD_REQUEST,
+        payload: {
+            charClass,
+            level,
+        },
+        meta: {
+            postAction: {
+                type: [actionTypes.CLASS_ADD_POST_ACTION],
+            },
+        },
+    };
+}
+/**
+ *
+ * @param characterClassId
+ * @param newCharacterXp
+ */
+export function classRemoveRequest(characterClassId, newCharacterXp = null) {
+    return {
+        type: actionTypes.CLASS_REMOVE_REQUEST,
+        payload: {
+            characterClassId,
+            newCharacterXp,
+        },
+        meta: {
+            postAction: {
+                type: [actionTypes.CLASS_REMOVE_POST_ACTION],
+            },
+        },
+    };
+}
+/**
+ *
+ * @param classId
+ * @param level
+ * @param newCharacterXp
+ */
+export function classLevelSetRequest(classId, level, newCharacterXp = null) {
+    return {
+        type: actionTypes.CLASS_LEVEL_SET_REQUEST,
+        payload: {
+            classId,
+            level,
+            newCharacterXp,
+        },
+        meta: {},
+    };
+}
+// TODO needs commit workflow
+/**
+ *
+ * @param charClass
+ */
+export function classAdd(charClass) {
+    return {
+        type: actionTypes.CLASS_ADD,
+        payload: {
+            charClass,
+        },
+        meta: {},
+    };
+}
+// TODO needs commit workflow
+/**
+ *
+ * @param classes
+ */
+export function classesSet(classes) {
+    return {
+        type: actionTypes.CLASSES_SET,
+        payload: {
+            classes,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CLASSES_SET_COMMIT,
+            },
+        },
+    };
+}
+// TODO needs commit workflow
+/**
+ *
+ * @param charClass
+ */
+export function classSet(charClass) {
+    return {
+        type: actionTypes.CLASS_SET,
+        payload: Object.assign({}, charClass),
+        meta: {
+            commit: {
+                type: actionTypes.CLASS_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/classFeature.js b/ddb_main/packages/rules-engine/es/actions/character/actions/classFeature.js
new file mode 100644
index 0000000..5df37f6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/classFeature.js
@@ -0,0 +1,23 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param classId
+ * @param classFeatureId
+ * @param choiceType
+ * @param choiceId
+ * @param optionValue
+ */
+export function classFeatureChoiceSetRequest(classId, classFeatureId, choiceType, choiceId, optionValue, parentChoiceId) {
+    return {
+        type: actionTypes.CLASS_FEATURE_CHOICE_SET_REQUEST,
+        payload: {
+            classId,
+            classFeatureId,
+            choiceType,
+            choiceId,
+            optionValue,
+            parentChoiceId,
+        },
+        meta: {},
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/condition.js b/ddb_main/packages/rules-engine/es/actions/character/actions/condition.js
new file mode 100644
index 0000000..3e8de59
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/condition.js
@@ -0,0 +1,61 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param id
+ * @param level
+ */
+export function conditionSet(id, level = null) {
+    return {
+        type: actionTypes.CONDITION_SET,
+        payload: {
+            id,
+            level,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param id
+ * @param level
+ */
+export function conditionAdd(id, level = null) {
+    return {
+        type: actionTypes.CONDITION_ADD,
+        payload: {
+            id,
+            level,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param id
+ */
+export function conditionRemove(id) {
+    return {
+        type: actionTypes.CONDITION_REMOVE,
+        payload: {
+            id,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param conditions
+ */
+export function conditionsSet(conditions) {
+    return {
+        type: actionTypes.CONDITIONS_SET,
+        payload: {
+            conditions,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CONDITIONS_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/configuration.js b/ddb_main/packages/rules-engine/es/actions/character/actions/configuration.js
new file mode 100644
index 0000000..9619688
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/configuration.js
@@ -0,0 +1,77 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param showHelpText
+ */
+export function showHelpTextSet(showHelpText) {
+    return {
+        type: actionTypes.SHOW_HELP_TEXT_SET,
+        payload: {
+            showHelpText,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param showHelpText
+ */
+export function showHelpTextSetRequest(showHelpText) {
+    return {
+        type: actionTypes.SHOW_HELP_TEXT_SET_REQUEST,
+        payload: {
+            showHelpText,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param startingEquipmentType
+ */
+export function startingEquipmentTypeSet(startingEquipmentType) {
+    return {
+        type: actionTypes.STARTING_EQUIPMENT_TYPE_SET,
+        payload: {
+            startingEquipmentType,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param payload
+ */
+export function startingEquipmentTypeSetCommit(payload) {
+    return {
+        type: actionTypes.STARTING_EQUIPMENT_TYPE_SET_COMMIT,
+        payload,
+        meta: {},
+    };
+}
+/**
+ *
+ * @param abilityScoreType
+ */
+export function abilityScoreTypeSetRequest(abilityScoreType) {
+    return {
+        type: actionTypes.ABILITY_SCORE_TYPE_SET_REQUEST,
+        payload: {
+            abilityScoreType,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param abilityScoreType
+ */
+export function abilityScoreTypeSetCommit(abilityScoreType) {
+    return {
+        type: actionTypes.ABILITY_SCORE_TYPE_SET_COMMIT,
+        payload: {
+            abilityScoreType,
+        },
+        meta: {},
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/core.js b/ddb_main/packages/rules-engine/es/actions/character/actions/core.js
new file mode 100644
index 0000000..e1d5c03
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/core.js
@@ -0,0 +1,103 @@
+import * as actionTypes from '../actionTypes';
+// TODO needs commit flow
+/**
+ *
+ * @param data
+ */
+export function characterSet(data) {
+    return {
+        type: actionTypes.CHARACTER_SET,
+        payload: Object.assign({}, data),
+        meta: {},
+    };
+}
+/**
+ *
+ * @param activeSourceCategories
+ */
+export function activeSourceCategoriesSet(activeSourceCategories) {
+    return {
+        type: actionTypes.ACTIVE_SOURCE_CATEGORIES_SET,
+        payload: {
+            activeSourceCategories,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ACTIVE_SOURCE_CATEGORIES_SET_COMMIT,
+            },
+        },
+    };
+}
+export function activeSourcesSet(enabledSourceIds, campaignSettingId) {
+    return {
+        type: actionTypes.ACTIVE_SOURCES_SET,
+        payload: {
+            enabledSourceIds,
+            campaignSettingId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ACTIVE_SOURCES_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param key
+ * @param value
+ */
+export function preferenceChoose(key, value) {
+    return {
+        type: actionTypes.PREFERENCE_CHOOSE,
+        payload: {
+            key,
+            value,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param key
+ * @param value
+ */
+export function preferenceSet(key, value) {
+    return {
+        type: actionTypes.PREFERENCE_SET,
+        payload: {
+            [key]: value,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PREFERENCE_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param components
+ */
+export function characterComponentsSet(components) {
+    return {
+        type: actionTypes.CHARACTER_COMPONENTS_SET,
+        payload: Object.assign({}, components),
+        meta: {
+            commit: {
+                type: actionTypes.CHARACTER_COMPONENTS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param socialImageData
+ */
+export function SendSocialImageData() {
+    return {
+        type: actionTypes.SEND_SOCIAL_IMAGE_DATA,
+        payload: {},
+        meta: {},
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/creature.js b/ddb_main/packages/rules-engine/es/actions/character/actions/creature.js
new file mode 100644
index 0000000..1998163
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/creature.js
@@ -0,0 +1,131 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param groupId
+ * @param monsterId
+ * @param names
+ * @param accept
+ * @param reject
+ */
+export function creatureCreate(groupId, monsterId, names, accept, reject) {
+    return {
+        type: actionTypes.CREATURE_CREATE,
+        payload: {
+            groupId,
+            monsterId,
+            names,
+        },
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param creature
+ */
+export function creatureAdd(creature) {
+    return {
+        type: actionTypes.CREATURE_ADD,
+        payload: {
+            creature,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CREATURE_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ */
+export function creatureRemove(id) {
+    return {
+        type: actionTypes.CREATURE_REMOVE,
+        payload: {
+            id,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CREATURE_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param properties
+ */
+export function creatureDataSet(id, properties) {
+    return {
+        type: actionTypes.CREATURE_DATA_SET,
+        payload: {
+            id,
+            properties,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CREATURE_DATA_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param removedHitPoints
+ * @param temporaryHitPoints
+ */
+export function creatureHitPointsSet(id, removedHitPoints, temporaryHitPoints) {
+    return {
+        type: actionTypes.CREATURE_HIT_POINTS_SET,
+        payload: {
+            id,
+            removedHitPoints,
+            temporaryHitPoints,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CREATURE_HIT_POINTS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param isActive
+ */
+export function creatureActiveSet(id, isActive) {
+    return {
+        type: actionTypes.CREATURE_ACTIVE_SET,
+        payload: {
+            id,
+            isActive,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CREATURE_ACTIVE_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param mappingId
+ * @param mappingEntityTypeId
+ */
+export function creatureCustomizationsDelete(mappingId, mappingEntityTypeId) {
+    return {
+        type: actionTypes.CREATURE_CUSTOMIZATIONS_DELETE,
+        payload: {
+            mappingId,
+            mappingEntityTypeId,
+        },
+        meta: {},
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/decoration.js b/ddb_main/packages/rules-engine/es/actions/character/actions/decoration.js
new file mode 100644
index 0000000..68c2448
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/decoration.js
@@ -0,0 +1,84 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param backdrop
+ */
+export function backdropSet(backdrop) {
+    return {
+        type: actionTypes.BACKDROP_SET,
+        payload: {
+            backdrop,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.BACKDROP_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param frame
+ */
+export function frameSet(frame) {
+    return {
+        type: actionTypes.FRAME_SET,
+        payload: {
+            frame,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.FRAME_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param themeColor
+ */
+export function themeSet(themeColor) {
+    return {
+        type: actionTypes.THEME_SET,
+        payload: {
+            themeColor,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.THEME_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param avatarId
+ * @param avatarUrl
+ */
+export function portraitSet(avatarId, avatarUrl) {
+    return {
+        type: actionTypes.PORTRAIT_SET,
+        payload: {
+            avatarId,
+            avatarUrl,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PORTRAIT_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param avatarImage
+ */
+export function portraitUpload(avatarImage) {
+    return {
+        type: actionTypes.PORTRAIT_UPLOAD,
+        payload: {
+            avatarImage,
+        },
+        meta: {},
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/feat.js b/ddb_main/packages/rules-engine/es/actions/character/actions/feat.js
new file mode 100644
index 0000000..0c9e879
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/feat.js
@@ -0,0 +1,80 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param feats
+ */
+export function featsSet(feats) {
+    return {
+        type: actionTypes.FEATS_SET,
+        payload: {
+            feats,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.FEATS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param featId
+ * @param choiceType
+ * @param choiceId
+ * @param optionValue
+ */
+export function featChoiceSetRequest(featId, choiceType, choiceId, optionValue) {
+    return {
+        type: actionTypes.FEAT_CHOICE_SET_REQUEST,
+        payload: {
+            featId,
+            choiceType,
+            choiceId,
+            optionValue,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param id
+ */
+export function adhocFeatCreate(id) {
+    return {
+        type: actionTypes.ADHOC_FEAT_CREATE,
+        payload: {
+            id,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param id
+ */
+export function adhocFeatRemove(id) {
+    return {
+        type: actionTypes.ADHOC_FEAT_REMOVE,
+        payload: {
+            id,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param id
+ * @param featureId
+ * @param featureTypeId
+ */
+export function setEntityFeat(id, featureId, featureTypeId) {
+    return {
+        type: actionTypes.SET_ENTITY_FEAT,
+        payload: {
+            id,
+            featureId,
+            featureTypeId,
+        },
+        meta: {}, // TODO consider passing accept and reject callbacks into meta
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/item.js b/ddb_main/packages/rules-engine/es/actions/character/actions/item.js
new file mode 100644
index 0000000..1755eec
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/item.js
@@ -0,0 +1,460 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param item
+ * @param quantity
+ * @param accept
+ * @param reject
+ * @param containerDefinitionKey
+ */
+export function itemCreate(item, quantity, accept, reject, containerDefinitionKey) {
+    return {
+        type: actionTypes.ITEM_CREATE,
+        payload: {
+            item,
+            quantity,
+            containerDefinitionKey,
+        },
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param name
+ * @param description
+ * @param cost
+ * @param quantity
+ * @param weight
+ * @param notes
+ * @param containerDefinitionKey
+ * @param partyId
+ * @param accept
+ * @param reject
+ */
+export function customItemCreate(name, description = null, cost = null, quantity = null, weight = null, notes = null, containerDefinitionKey, partyId = null, accept, reject) {
+    return {
+        type: actionTypes.CUSTOM_ITEM_CREATE,
+        payload: {
+            name,
+            description,
+            cost,
+            quantity,
+            weight,
+            notes,
+            containerDefinitionKey,
+            partyId,
+        },
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param mappingId
+ * @param partyId
+ * @param accept
+ * @param reject
+ */
+export function customItemDestroy(id, mappingId, partyId = null, accept, reject) {
+    return {
+        type: actionTypes.CUSTOM_ITEM_DESTROY,
+        payload: {
+            id,
+            mappingId,
+            partyId,
+        },
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param item
+ */
+export function customItemAdd(item) {
+    return {
+        type: actionTypes.CUSTOM_ITEM_ADD,
+        payload: {
+            item,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_ITEM_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ */
+export function customItemRemove(id) {
+    return {
+        type: actionTypes.CUSTOM_ITEM_REMOVE,
+        payload: {
+            id,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_ITEM_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param properties
+ * @param mappingId
+ * @param partyId
+ * @param accept
+ * @param reject
+ */
+export function customItemSet(id, properties, mappingId, partyId = null, accept, reject) {
+    return {
+        type: actionTypes.CUSTOM_ITEM_SET,
+        payload: {
+            id,
+            properties,
+            mappingId,
+            partyId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CUSTOM_ITEM_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param item
+ */
+export function itemAdd(item) {
+    return {
+        type: actionTypes.ITEM_ADD,
+        payload: {
+            item,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param removeContainerContents
+ */
+export function itemRemove(id, removeContainerContents) {
+    return {
+        type: actionTypes.ITEM_REMOVE,
+        payload: {
+            id,
+            removeContainerContents,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param removeContainerContents
+ */
+export function itemDestroy(id, removeContainerContents, accept, reject) {
+    return {
+        type: actionTypes.ITEM_DESTROY,
+        payload: {
+            id,
+            removeContainerContents,
+        },
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param value
+ */
+export function itemEquippedSet(id, value, equippedEntityId, equippedEntityTypeId, accept, reject) {
+    return {
+        type: actionTypes.ITEM_EQUIPPED_SET,
+        payload: {
+            id,
+            value,
+            equippedEntityId,
+            equippedEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_EQUIPPED_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param value
+ * @param accept
+ * @param reject
+ */
+export function itemAttuneSet(id, value, accept, reject) {
+    return {
+        type: actionTypes.ITEM_ATTUNE_SET,
+        payload: {
+            id,
+            value,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_ATTUNE_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param containerEntityId
+ * @param containerEntityTypeId
+ * @param accept
+ * @param reject
+ */
+export function itemMoveSet(id, containerEntityId, containerEntityTypeId, accept, reject) {
+    return {
+        type: actionTypes.ITEM_MOVE_SET,
+        payload: {
+            id,
+            containerEntityId,
+            containerEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_MOVE_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param quantity
+ * @param containerEntityId
+ * @param containerEntityTypeId
+ */
+export function itemQuantitySet(id, quantity, accept, reject) {
+    return {
+        type: actionTypes.ITEM_QUANTITY_SET,
+        payload: {
+            id,
+            quantity,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_QUANTITY_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param uses
+ * @param accept
+ * @param reject
+ */
+export function itemChargesSet(id, uses, accept, reject) {
+    return {
+        type: actionTypes.ITEM_CHARGES_SET,
+        payload: {
+            id,
+            uses,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_CHARGES_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param mappingId
+ * @param mappingEntityTypeId
+ * @param partyId
+ * @param accept
+ * @param reject
+ */
+export function itemCustomizationsDelete(mappingId, mappingEntityTypeId, partyId, accept, reject) {
+    return {
+        type: actionTypes.ITEM_CUSTOMIZATIONS_DELETE,
+        payload: {
+            mappingId,
+            mappingEntityTypeId,
+            partyId,
+        },
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param currencies
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ * @param accept
+ * @param reject
+ */
+export function itemCurrencySet(currency, id, accept, reject) {
+    return {
+        type: actionTypes.ITEM_CURRENCY_SET,
+        payload: {
+            currency,
+            id,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_CURRENCY_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function itemCurrencyCopperSet(amount, destinationEntityTypeId, destinationEntityId) {
+    return {
+        type: actionTypes.ITEM_CURRENCY_COPPER_SET,
+        payload: {
+            amount,
+            destinationEntityTypeId,
+            destinationEntityId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_CURRENCY_COPPER_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function itemCurrencySilverSet(amount, destinationEntityTypeId, destinationEntityId) {
+    return {
+        type: actionTypes.ITEM_CURRENCY_SILVER_SET,
+        payload: {
+            amount,
+            destinationEntityTypeId,
+            destinationEntityId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_CURRENCY_SILVER_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function itemCurrencyElectrumSet(amount, destinationEntityTypeId, destinationEntityId) {
+    return {
+        type: actionTypes.ITEM_CURRENCY_ELECTRUM_SET,
+        payload: {
+            amount,
+            destinationEntityTypeId,
+            destinationEntityId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_CURRENCY_ELECTRUM_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function itemCurrencyGoldSet(amount, destinationEntityTypeId, destinationEntityId) {
+    return {
+        type: actionTypes.ITEM_CURRENCY_GOLD_SET,
+        payload: {
+            amount,
+            destinationEntityTypeId,
+            destinationEntityId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_CURRENCY_GOLD_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function itemCurrencyPlatinumSet(amount, destinationEntityTypeId, destinationEntityId) {
+    return {
+        type: actionTypes.ITEM_CURRENCY_PLATINUM_SET,
+        payload: {
+            amount,
+            destinationEntityTypeId,
+            destinationEntityId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ITEM_CURRENCY_PLATINUM_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/modifier.js b/ddb_main/packages/rules-engine/es/actions/character/actions/modifier.js
new file mode 100644
index 0000000..2443f4c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/modifier.js
@@ -0,0 +1,18 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param modifiers
+ */
+export function modifiersSet(modifiers) {
+    return {
+        type: actionTypes.MODIFIERS_SET,
+        payload: {
+            modifiers,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.MODIFIERS_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/option.js b/ddb_main/packages/rules-engine/es/actions/character/actions/option.js
new file mode 100644
index 0000000..eaf7cc5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/option.js
@@ -0,0 +1,18 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param options
+ */
+export function optionsSet(options) {
+    return {
+        type: actionTypes.OPTIONS_SET,
+        payload: {
+            options,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.OPTIONS_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/optionalClassFeature.js b/ddb_main/packages/rules-engine/es/actions/character/actions/optionalClassFeature.js
new file mode 100644
index 0000000..a670147
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/optionalClassFeature.js
@@ -0,0 +1,93 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param classFeatureId
+ * @param affectedClassFeatureId
+ */
+export function optionalClassFeatureCreate(classFeatureId, affectedClassFeatureId) {
+    return {
+        type: actionTypes.OPTIONAL_CLASS_FEATURE_CREATE,
+        payload: {
+            classFeatureId,
+            affectedClassFeatureId,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param optionalClassFeature
+ */
+export function optionalClassFeatureAdd(optionalClassFeature) {
+    return {
+        type: actionTypes.OPTIONAL_CLASS_FEATURE_ADD,
+        payload: {
+            optionalClassFeature,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.OPTIONAL_CLASS_FEATURE_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param classFeatureId
+ * @param affectedClassFeatureId
+ */
+export function optionalClassFeatureSetRequest(classFeatureId, affectedClassFeatureId) {
+    return {
+        type: actionTypes.OPTIONAL_CLASS_FEATURE_SET_REQUEST,
+        payload: {
+            classFeatureId,
+            affectedClassFeatureId,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param optionalClassFeatureProps
+ */
+export function optionalClassFeatureSet(optionalClassFeatureProps) {
+    return {
+        type: actionTypes.OPTIONAL_CLASS_FEATURE_SET,
+        payload: Object.assign({}, optionalClassFeatureProps),
+        meta: {
+            commit: {
+                type: actionTypes.OPTIONAL_CLASS_FEATURE_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param classFeatureId
+ */
+export function optionalClassFeatureDestroy(classFeatureId) {
+    return {
+        type: actionTypes.OPTIONAL_CLASS_FEATURE_DESTROY,
+        payload: {
+            classFeatureId,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param classFeatureId
+ */
+export function optionalClassFeatureRemove(classFeatureId) {
+    return {
+        type: actionTypes.OPTIONAL_CLASS_FEATURE_REMOVE,
+        payload: {
+            classFeatureId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.OPTIONAL_CLASS_FEATURE_REMOVE_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/optionalOrigin.js b/ddb_main/packages/rules-engine/es/actions/character/actions/optionalOrigin.js
new file mode 100644
index 0000000..727b621
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/optionalOrigin.js
@@ -0,0 +1,93 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param racialTraitId
+ * @param affectedRacialTraitId
+ */
+export function optionalOriginCreate(racialTraitId, affectedRacialTraitId) {
+    return {
+        type: actionTypes.OPTIONAL_ORIGIN_CREATE,
+        payload: {
+            racialTraitId,
+            affectedRacialTraitId,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param optionalOrigin
+ */
+export function optionalOriginAdd(optionalOrigin) {
+    return {
+        type: actionTypes.OPTIONAL_ORIGIN_ADD,
+        payload: {
+            optionalOrigin,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.OPTIONAL_ORIGIN_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param racialTraitId
+ * @param affectedRacialTraitId
+ */
+export function optionalOriginSetRequest(racialTraitId, affectedRacialTraitId) {
+    return {
+        type: actionTypes.OPTIONAL_ORIGIN_SET_REQUEST,
+        payload: {
+            racialTraitId,
+            affectedRacialTraitId,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param optionalOriginContract
+ */
+export function optionalOriginSet(optionalOriginContract) {
+    return {
+        type: actionTypes.OPTIONAL_ORIGIN_SET,
+        payload: Object.assign({}, optionalOriginContract),
+        meta: {
+            commit: {
+                type: actionTypes.OPTIONAL_ORIGIN_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param racialTraitId
+ */
+export function optionalOriginDestroy(racialTraitId) {
+    return {
+        type: actionTypes.OPTIONAL_ORIGIN_DESTROY,
+        payload: {
+            racialTraitId,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param racialTraitId
+ */
+export function optionalOriginRemove(racialTraitId) {
+    return {
+        type: actionTypes.OPTIONAL_ORIGIN_REMOVE,
+        payload: {
+            racialTraitId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.OPTIONAL_ORIGIN_REMOVE_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/premadeInfo.js b/ddb_main/packages/rules-engine/es/actions/character/actions/premadeInfo.js
new file mode 100644
index 0000000..62e81f3
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/premadeInfo.js
@@ -0,0 +1,56 @@
+import * as actionTypes from '../actionTypes';
+export function premadeInfoSetCommit(premadeInfo) {
+    return {
+        type: actionTypes.PREMADE_INFO_SET_COMMIT,
+        payload: premadeInfo,
+        meta: {},
+    };
+}
+export function premadeInfoAdd(premadeInfo) {
+    return {
+        type: actionTypes.PREMADE_INFO_ADD,
+        payload: premadeInfo,
+        meta: {
+            commit: {
+                type: actionTypes.PREMADE_INFO_SET_COMMIT,
+            },
+        },
+    };
+}
+export function premadeInfoGet(characterId) {
+    return {
+        type: actionTypes.PREMADE_INFO_GET,
+        payload: {
+            characterId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PREMADE_INFO_SET_COMMIT,
+            },
+        },
+    };
+}
+export function premadeInfoUpdate(premadeInfo) {
+    return {
+        type: actionTypes.PREMADE_INFO_UPDATE,
+        payload: premadeInfo,
+        meta: {
+            commit: {
+                type: actionTypes.PREMADE_INFO_SET_COMMIT,
+            },
+        },
+    };
+}
+export function premadeInfoDelete(characterId) {
+    return {
+        type: actionTypes.PREMADE_INFO_DELETE,
+        payload: {
+            characterId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PREMADE_INFO_REMOVE_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/race.js b/ddb_main/packages/rules-engine/es/actions/character/actions/race.js
new file mode 100644
index 0000000..4013a71
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/race.js
@@ -0,0 +1,35 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param race
+ */
+export function raceChoose(race) {
+    return {
+        type: actionTypes.RACE_CHOOSE,
+        payload: {
+            race,
+        },
+        meta: {
+            postAction: {
+                type: [actionTypes.RACE_CHOOSE_POST_ACTION],
+            },
+        },
+    };
+}
+/**
+ *
+ * @param race
+ */
+export function raceSet(race) {
+    return {
+        type: actionTypes.RACE_SET,
+        payload: {
+            race,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.RACE_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/racialTrait.js b/ddb_main/packages/rules-engine/es/actions/character/actions/racialTrait.js
new file mode 100644
index 0000000..e7a435d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/racialTrait.js
@@ -0,0 +1,20 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param racialTraitId
+ * @param choiceType
+ * @param choiceId
+ * @param optionValue
+ */
+export function racialTraitChoiceSetRequest(racialTraitId, choiceType, choiceId, optionValue) {
+    return {
+        type: actionTypes.RACIAL_TRAIT_CHOICE_SET_REQUEST,
+        payload: {
+            racialTraitId,
+            choiceType,
+            choiceId,
+            optionValue,
+        },
+        meta: {},
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/spell.js b/ddb_main/packages/rules-engine/es/actions/character/actions/spell.js
new file mode 100644
index 0000000..6a0e658
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/spell.js
@@ -0,0 +1,213 @@
+import { SpellAccessors } from '../../../engine/Spell';
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param spell
+ * @param characterClassId
+ * @param accept
+ * @param reject
+ */
+export function spellCreate(spell, characterClassId, accept, reject) {
+    return {
+        type: actionTypes.SPELL_CREATE,
+        payload: {
+            spell,
+            characterClassId,
+        },
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param spell
+ * @param characterClassId
+ */
+export function spellAdd(spell, characterClassId) {
+    return {
+        type: actionTypes.SPELL_ADD,
+        payload: {
+            spell,
+            characterClassId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.SPELL_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param spell
+ * @param characterClassId
+ * @param prepared
+ */
+export function spellPreparedSet(spell, characterClassId, prepared, accept, reject) {
+    return {
+        type: actionTypes.SPELL_PREPARED_SET,
+        payload: {
+            spellId: SpellAccessors.getId(spell),
+            characterClassId,
+            entityTypeId: SpellAccessors.getMappingEntityTypeId(spell),
+            id: SpellAccessors.getMappingId(spell),
+            prepared,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.SPELL_PREPARED_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param spell
+ * @param characterClassId
+ */
+export function spellRemove(spell, characterClassId, accept, reject) {
+    const payload = {
+        spellId: SpellAccessors.getId(spell),
+        characterClassId,
+        entityTypeId: SpellAccessors.getMappingEntityTypeId(spell),
+        id: SpellAccessors.getMappingId(spell),
+    };
+    return {
+        type: actionTypes.SPELL_REMOVE,
+        payload: Object.assign(Object.assign({}, payload), { spell }),
+        meta: {
+            commit: {
+                type: actionTypes.SPELL_REMOVE_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param entityTypeId
+ * @param uses
+ * @param dataOriginType
+ */
+export function spellUseSet(id, entityTypeId, uses, dataOriginType) {
+    return {
+        type: actionTypes.SPELL_USE_SET,
+        payload: {
+            id,
+            entityTypeId,
+            uses,
+            dataOriginType,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.SPELL_USE_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param pactMagic
+ */
+export function pactMagicSet(pactMagic) {
+    return {
+        type: actionTypes.PACT_MAGIC_SET,
+        payload: {
+            pactMagic,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PACT_MAGIC_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param spellSlots
+ */
+export function spellSlotsSet(spellSlots) {
+    return {
+        type: actionTypes.SPELLS_SLOTS_SET,
+        payload: {
+            spellSlots,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.SPELLS_SLOTS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param levels
+ */
+export function spellLevelSpellSlotsSet(levels) {
+    return {
+        type: actionTypes.SPELL_LEVEL_SPELL_SLOTS_SET,
+        payload: levels,
+        meta: {
+            commit: {
+                type: actionTypes.SPELL_LEVEL_SPELL_SLOTS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param levels
+ */
+export function spellLevelPactMagicSlotsSet(levels) {
+    return {
+        type: actionTypes.SPELL_LEVEL_PACT_MAGIC_SLOTS_SET,
+        payload: levels,
+        meta: {
+            commit: {
+                type: actionTypes.SPELL_LEVEL_PACT_MAGIC_SLOTS_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param mappingId
+ * @param mappingEntityTypeId
+ * @param contextId
+ * @param contextTypeId
+ */
+export function spellCustomizationsDelete(mappingId, mappingEntityTypeId, contextId = null, contextTypeId = null) {
+    return {
+        type: actionTypes.SPELL_CUSTOMIZATIONS_DELETE,
+        payload: {
+            mappingId,
+            mappingEntityTypeId,
+            contextId,
+            contextTypeId,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param spells
+ */
+export function characterSpellsSet(spells) {
+    return {
+        type: actionTypes.CHARACTER_SPELLS_SET,
+        payload: {
+            spells,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CHARACTER_SPELLS_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/actions/value.js b/ddb_main/packages/rules-engine/es/actions/character/actions/value.js
new file mode 100644
index 0000000..5b749d4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/actions/value.js
@@ -0,0 +1,87 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param typeId
+ * @param value
+ * @param notes
+ * @param valueId
+ * @param valueTypeId
+ * @param contextId
+ * @param contextTypeId
+ * @param partyId
+ * @param accept
+ * @param reject
+ */
+export function valueSet(typeId, value, notes, valueId = null, valueTypeId = null, contextId = null, contextTypeId = null, partyId = null, accept, reject) {
+    return {
+        type: actionTypes.VALUE_SET,
+        payload: {
+            typeId,
+            value,
+            notes,
+            valueId,
+            valueTypeId,
+            contextId,
+            contextTypeId,
+            partyId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VALUE_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ * @param typeId
+ * @param valueId
+ * @param valueTypeId
+ * @param contextId
+ * @param contextTypeId
+ * @param partyId
+ */
+export function valueRemove(typeId, valueId = null, valueTypeId = null, contextId = null, contextTypeId = null, partyId = null) {
+    return {
+        type: actionTypes.VALUE_REMOVE,
+        payload: {
+            typeId,
+            valueId,
+            valueTypeId,
+            contextId,
+            contextTypeId,
+            partyId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VALUE_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param valueId
+ * @param valueTypeId
+ * @param contextId
+ * @param contextTypeId
+ * @param partyId
+ */
+export function entityValuesRemove(valueId = null, valueTypeId = null, contextId = null, contextTypeId = null, partyId = null) {
+    return {
+        type: actionTypes.ENTITY_VALUES_REMOVE,
+        payload: {
+            valueId,
+            valueTypeId,
+            contextId,
+            contextTypeId,
+            partyId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.ENTITY_VALUES_REMOVE_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/character/index.js b/ddb_main/packages/rules-engine/es/actions/character/index.js
new file mode 100644
index 0000000..bda2d65
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/character/index.js
@@ -0,0 +1,6 @@
+import * as actionTypes from './actionTypes';
+import * as actions from './actions';
+import * as typings from './typings';
+export const characterActionTypes = actionTypes;
+export const characterActions = actions;
+export const characterTypings = typings;
diff --git a/ddb_main/packages/rules-engine/es/actions/characterEnv/actionTypes.js b/ddb_main/packages/rules-engine/es/actions/characterEnv/actionTypes.js
new file mode 100644
index 0000000..9931c6c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/characterEnv/actionTypes.js
@@ -0,0 +1 @@
+export const DATA_SET = 'characterEnv.DATA_SET';
diff --git a/ddb_main/packages/rules-engine/es/actions/characterEnv/actions.js b/ddb_main/packages/rules-engine/es/actions/characterEnv/actions.js
new file mode 100644
index 0000000..189c61f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/characterEnv/actions.js
@@ -0,0 +1,11 @@
+import * as actionTypes from './actionTypes';
+/**
+ *
+ * @param payload
+ */
+export function dataSet(payload) {
+    return {
+        type: actionTypes.DATA_SET,
+        payload,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/characterEnv/index.js b/ddb_main/packages/rules-engine/es/actions/characterEnv/index.js
new file mode 100644
index 0000000..bbe2095
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/characterEnv/index.js
@@ -0,0 +1,6 @@
+import * as actionTypes from './actionTypes';
+import * as actions from './actions';
+import * as typings from './typings';
+export const characterEnvActionTypes = actionTypes;
+export const characterEnvActions = actions;
+export const characterEnvTypings = typings;
diff --git a/ddb_main/packages/rules-engine/es/actions/featureFlagInfo/actionTypes.js b/ddb_main/packages/rules-engine/es/actions/featureFlagInfo/actionTypes.js
new file mode 100644
index 0000000..848569c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/featureFlagInfo/actionTypes.js
@@ -0,0 +1 @@
+export const DATA_SET = 'featureFlagInfo.DATA_SET';
diff --git a/ddb_main/packages/rules-engine/es/actions/featureFlagInfo/actions.js b/ddb_main/packages/rules-engine/es/actions/featureFlagInfo/actions.js
new file mode 100644
index 0000000..e877882
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/featureFlagInfo/actions.js
@@ -0,0 +1,11 @@
+import * as actionTypes from './actionTypes';
+/**
+ *
+ * @param featureFlags
+ */
+export function dataSet(data) {
+    return {
+        type: actionTypes.DATA_SET,
+        payload: data,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/featureFlagInfo/index.js b/ddb_main/packages/rules-engine/es/actions/featureFlagInfo/index.js
new file mode 100644
index 0000000..1b8fd25
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/featureFlagInfo/index.js
@@ -0,0 +1,6 @@
+import * as actionTypes from './actionTypes';
+import * as actions from './actions';
+import * as typings from './typings';
+export const featureFlagInfoActionTypes = actionTypes;
+export const featureFlagInfoActions = actions;
+export const featureFlagInfoTypings = typings;
diff --git a/ddb_main/packages/rules-engine/es/actions/ruleData/actionTypes.js b/ddb_main/packages/rules-engine/es/actions/ruleData/actionTypes.js
new file mode 100644
index 0000000..f63ba33
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/ruleData/actionTypes.js
@@ -0,0 +1 @@
+export const DATA_SET = 'ruleData.DATA_SET';
diff --git a/ddb_main/packages/rules-engine/es/actions/ruleData/actions.js b/ddb_main/packages/rules-engine/es/actions/ruleData/actions.js
new file mode 100644
index 0000000..189c61f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/ruleData/actions.js
@@ -0,0 +1,11 @@
+import * as actionTypes from './actionTypes';
+/**
+ *
+ * @param payload
+ */
+export function dataSet(payload) {
+    return {
+        type: actionTypes.DATA_SET,
+        payload,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/ruleData/index.js b/ddb_main/packages/rules-engine/es/actions/ruleData/index.js
new file mode 100644
index 0000000..50cb057
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/ruleData/index.js
@@ -0,0 +1,6 @@
+import * as actionTypes from './actionTypes';
+import * as actions from './actions';
+import * as typings from './typings';
+export const ruleDataActionTypes = actionTypes;
+export const ruleDataActions = actions;
+export const ruleDataTypings = typings;
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/campaign.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/campaign.js
new file mode 100644
index 0000000..ab85dfa
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/campaign.js
@@ -0,0 +1,41 @@
+export const PARTY_ITEM_ADD = 'campaign.PARTY_ITEM_ADD';
+export const PARTY_ITEM_ADD_COMMIT = 'campaign.PARTY_ITEM_ADD_COMMIT';
+export const PARTY_ITEM_MOVE_SET = 'campaign.PARTY_ITEM_MOVE_SET';
+export const PARTY_ITEM_MOVE_SET_COMMIT = 'campaign.PARTY_ITEM_MOVE_SET_COMMIT';
+export const PARTY_ITEM_EQUIPPED_SET = 'campaign.PARTY_ITEM_EQUIPPED_SET';
+export const PARTY_ITEM_EQUIPPED_SET_COMMIT = 'campaign.PARTY_ITEM_EQUIPPED_SET_COMMIT';
+export const PARTY_ITEM_ATTUNE_SET = 'campaign.PARTY_ITEM_ATTUNE_SET';
+export const PARTY_ITEM_ATTUNE_SET_COMMIT = 'campaign.PARTY_ITEM_ATTUNE_SET_COMMIT';
+export const PARTY_ITEM_QUANTITY_SET = 'campaign.PARTY_ITEM_QUANTITY_SET';
+export const PARTY_ITEM_QUANTITY_SET_COMMIT = 'campaign.PARTY_ITEM_QUANTITY_SET_COMMIT';
+export const PARTY_ITEM_REMOVE = 'campaign.PARTY_ITEM_REMOVE';
+export const PARTY_ITEM_REMOVE_COMMIT = 'campaign.PARTY_ITEM_REMOVE_COMMIT';
+export const PARTY_ITEM_CHARGES_SET = 'campaign.PARTY_ITEM_CHARGES_SET';
+export const PARTY_ITEM_CHARGES_SET_COMMIT = 'campaign.PARTY_ITEM_CHARGES_SET_COMMIT';
+export const PARTY_CAMPAIGN_INFO_SET = 'campaign.PARTY_CAMPAIGN_INFO_SET';
+export const PARTY_INVENTORY_REQUEST = 'campaign.PARTY_INVENTORY_REQUEST';
+export const PARTY_CURRENCY_TRANSACTION_SET = 'campaign.PARTY_CURRENCY_TRANSACTION_SET';
+export const PARTY_CURRENCIES_SET = 'campaign.PARTY_CURRENCIES_SET';
+export const PARTY_CURRENCIES_SET_COMMIT = 'campaign.PARTY_CURRENCIES_SET_COMMIT';
+export const PARTY_CURRENCY_COPPER_SET = 'campaign.PARTY_CURRENCY_COPPER_SET';
+export const PARTY_CURRENCY_COPPER_SET_COMMIT = 'campaign.PARTY_CURRENCY_COPPER_SET_COMMIT';
+export const PARTY_CURRENCY_ELECTRUM_SET = 'campaign.PARTY_CURRENCY_ELECTRUM_SET';
+export const PARTY_CURRENCY_ELECTRUM_SET_COMMIT = 'campaign.PARTY_CURRENCY_ELECTRUM_SET_COMMIT';
+export const PARTY_CURRENCY_GOLD_SET = 'campaign.PARTY_CURRENCY_GOLD_SET';
+export const PARTY_CURRENCY_GOLD_SET_COMMIT = 'campaign.PARTY_CURRENCY_GOLD_SET_COMMIT';
+export const PARTY_CURRENCY_PLATINUM_SET = 'campaign.PARTY_CURRENCY_PLATINUM_SET';
+export const PARTY_CURRENCY_PLATINUM_SET_COMMIT = 'campaign.PARTY_CURRENCY_PLATINUM_SET_COMMIT';
+export const PARTY_CURRENCY_SILVER_SET = 'campaign.PARTY_CURRENCY_SILVER_SET';
+export const PARTY_CURRENCY_SILVER_SET_COMMIT = 'campaign.PARTY_CURRENCY_SILVER_SET_COMMIT';
+export const PARTY_ITEM_CURRENCY_SET = 'campaign.PARTY_ITEM_CURRENCY_SET';
+export const PARTY_ITEM_CURRENCY_SET_COMMIT = 'campaign.PARTY_ITEM_CURRENCY_SET_COMMIT';
+export const PARTY_ITEM_CURRENCY_COPPER_SET = 'campaign.PARTY_ITEM_CURRENCY_COPPER_SET';
+export const PARTY_ITEM_CURRENCY_COPPER_SET_COMMIT = 'campaign.PARTY_ITEM_CURRENCY_COPPER_SET_COMMIT';
+export const PARTY_ITEM_CURRENCY_ELECTRUM_SET = 'campaign.PARTY_ITEM_CURRENCY_ELECTRUM_SET';
+export const PARTY_ITEM_CURRENCY_ELECTRUM_SET_COMMIT = 'campaign.PARTY_ITEM_CURRENCY_ELECTRUM_SET_COMMIT';
+export const PARTY_ITEM_CURRENCY_GOLD_SET = 'campaign.PARTY_ITEM_CURRENCY_GOLD_SET';
+export const PARTY_ITEM_CURRENCY_GOLD_SET_COMMIT = 'campaign.PARTY_ITEM_CURRENCY_GOLD_SET_COMMIT';
+export const PARTY_ITEM_CURRENCY_PLATINUM_SET = 'campaign.PARTY_ITEM_CURRENCY_PLATINUM_SET';
+export const PARTY_ITEM_CURRENCY_PLATINUM_SET_COMMIT = 'campaign.PARTY_ITEM_CURRENCY_PLATINUM_SET_COMMIT';
+export const PARTY_ITEM_CURRENCY_SILVER_SET = 'campaign.PARTY_ITEM_CURRENCY_SILVER_SET';
+export const PARTY_ITEM_CURRENCY_SILVER_SET_COMMIT = 'campaign.PARTY_ITEM_CURRENCY_SILVER_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/campaignSetting.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/campaignSetting.js
new file mode 100644
index 0000000..8ea0c3a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/campaignSetting.js
@@ -0,0 +1,2 @@
+export const CAMPAIGN_SETTINGS_SET = 'serviceData.CAMPAIGN_SETTINGS_SET';
+export const CAMPAIGN_SETTINGS_SET_COMMIT = 'serviceData.CAMPAIGN_SETTINGS_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/classAlwaysKnownSpells.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/classAlwaysKnownSpells.js
new file mode 100644
index 0000000..7d9e3b0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/classAlwaysKnownSpells.js
@@ -0,0 +1,2 @@
+export const CLASS_ALWAYS_KNOWN_SPELLS_SET = 'serviceData.CLASS_ALWAYS_KNOWN_SPELLS_SET';
+export const CLASS_ALWAYS_KNOWN_SPELLS_SET_COMMIT = 'serviceData.CLASS_ALWAYS_KNOWN_SPELLS_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/classAlwaysPreparedSpells.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/classAlwaysPreparedSpells.js
new file mode 100644
index 0000000..a20b3c9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/classAlwaysPreparedSpells.js
@@ -0,0 +1,2 @@
+export const CLASS_ALWAYS_PREPARED_SPELLS_SET = 'serviceData.CLASS_ALWAYS_PREPARED_SPELLS_SET';
+export const CLASS_ALWAYS_PREPARED_SPELLS_SET_COMMIT = 'serviceData.CLASS_ALWAYS_PREPARED_SPELLS_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/definitionPool.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/definitionPool.js
new file mode 100644
index 0000000..b03bf83
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/definitionPool.js
@@ -0,0 +1,2 @@
+export const DEFINITION_POOL_ADD = 'serviceData.DEFINITION_POOL_ADD';
+export const DEFINITION_POOL_ADD_COMMIT = 'serviceData.DEFINITION_POOL_ADD_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/infusionMapping.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/infusionMapping.js
new file mode 100644
index 0000000..4831bbc
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/infusionMapping.js
@@ -0,0 +1,7 @@
+export const INFUSION_MAPPING_CREATE = 'serviceData.INFUSION_MAPPING_CREATE';
+export const INFUSION_MAPPING_DESTROY = 'serviceData.INFUSION_MAPPING_DESTROY';
+export const INFUSION_MAPPINGS_DESTROY = 'serviceData.INFUSION_MAPPINGS_DESTROY';
+export const INFUSION_MAPPING_ADD = 'serviceData.INFUSION_MAPPING_ADD';
+export const INFUSION_MAPPING_ADD_COMMIT = 'serviceData.INFUSION_MAPPING_ADD_COMMIT';
+export const INFUSION_MAPPING_REMOVE = 'serviceData.INFUSION_MAPPING_REMOVE';
+export const INFUSION_MAPPING_REMOVE_COMMIT = 'serviceData.INFUSION_MAPPING_REMOVE_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/knownInfusionMapping.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/knownInfusionMapping.js
new file mode 100644
index 0000000..e084d67
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/knownInfusionMapping.js
@@ -0,0 +1,8 @@
+export const KNOWN_INFUSION_MAPPING_CREATE = 'serviceData.KNOWN_INFUSION_MAPPING_CREATE';
+export const KNOWN_INFUSION_MAPPING_DESTROY = 'serviceData.KNOWN_INFUSION_MAPPING_DESTROY';
+export const KNOWN_INFUSION_MAPPING_ADD = 'serviceData.KNOWN_INFUSION_MAPPING_ADD';
+export const KNOWN_INFUSION_MAPPING_ADD_COMMIT = 'serviceData.KNOWN_INFUSION_MAPPING_ADD_COMMIT';
+export const KNOWN_INFUSION_MAPPING_SET = 'serviceData.KNOWN_INFUSION_MAPPING_SET';
+export const KNOWN_INFUSION_MAPPING_SET_COMMIT = 'serviceData.KNOWN_INFUSION_MAPPING_SET_COMMIT';
+export const KNOWN_INFUSION_MAPPING_REMOVE = 'serviceData.KNOWN_INFUSION_MAPPING_REMOVE';
+export const KNOWN_INFUSION_MAPPING_REMOVE_COMMIT = 'serviceData.KNOWN_INFUSION_MAPPING_REMOVE_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/ruleDataPool.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/ruleDataPool.js
new file mode 100644
index 0000000..559b90e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/ruleDataPool.js
@@ -0,0 +1,2 @@
+export const RULE_DATA_POOL_KEY_SET = 'serviceData.RULE_DATA_POOL_KEY_SET';
+export const RULE_DATA_POOL_KEY_SET_COMMIT = 'serviceData.RULE_DATA_POOL_KEY_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/vehicleComponentMapping.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/vehicleComponentMapping.js
new file mode 100644
index 0000000..90b1b09
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/vehicleComponentMapping.js
@@ -0,0 +1,6 @@
+export const VEHICLE_COMPONENT_MAPPING_ADD = 'serviceData.VEHICLE_COMPONENT_MAPPING_ADD';
+export const VEHICLE_COMPONENT_MAPPING_ADD_COMMIT = 'serviceData.VEHICLE_COMPONENT_MAPPING_ADD_COMMIT';
+export const VEHICLE_COMPONENT_MAPPING_REMOVE = 'serviceData.VEHICLE_COMPONENT_MAPPING_REMOVE';
+export const VEHICLE_COMPONENT_MAPPING_REMOVE_COMMIT = 'serviceData.VEHICLE_COMPONENT_MAPPING_REMOVE_COMMIT';
+export const VEHICLE_COMPONENT_MAPPING_HIT_POINTS_SET = 'serviceData.VEHICLE_COMPONENT_MAPPING_HIT_POINTS_SET';
+export const VEHICLE_COMPONENT_MAPPING_HIT_POINTS_SET_COMMIT = 'serviceData.VEHICLE_COMPONENT_MAPPING_HIT_POINTS_SET_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/vehicleMapping.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/vehicleMapping.js
new file mode 100644
index 0000000..12867f2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actionTypes/vehicleMapping.js
@@ -0,0 +1,15 @@
+export const VEHICLE_MAPPING_CREATE = 'serviceData.VEHICLE_MAPPING_CREATE';
+export const VEHICLE_MAPPING_ADD = 'serviceData.VEHICLE_MAPPING_ADD';
+export const VEHICLE_MAPPING_ADD_COMMIT = 'serviceData.VEHICLE_MAPPING_ADD_COMMIT';
+export const VEHICLE_MAPPING_REMOVE = 'serviceData.VEHICLE_MAPPING_REMOVE';
+export const VEHICLE_MAPPING_REMOVE_COMMIT = 'serviceData.VEHICLE_MAPPING_REMOVE_COMMIT';
+export const VEHICLE_MAPPING_DATA_SET = 'serviceData.VEHICLE_MAPPING_DATA_SET';
+export const VEHICLE_MAPPING_DATA_SET_COMMIT = 'serviceData.VEHICLE_MAPPING_DATA_SET_COMMIT';
+export const VEHICLE_MAPPING_REMAINING_FUEL_SET = 'serviceData.VEHICLE_MAPPING_REMAINING_FUEL_SET';
+export const VEHICLE_MAPPING_REMAINING_FUEL_SET_COMMIT = 'serviceData.VEHICLE_MAPPING_REMAINING_FUEL_SET_COMMIT';
+export const VEHICLE_MAPPING_CONDITION_SET = 'serviceData.VEHICLE_MAPPING_CONDITION_SET';
+export const VEHICLE_MAPPING_CONDITION_SET_COMMIT = 'serviceData.VEHICLE_MAPPING_CONDITION_SET_COMMIT';
+export const VEHICLE_MAPPING_CONDITION_ADD = 'serviceData.VEHICLE_MAPPING_CONDITION_ADD';
+export const VEHICLE_MAPPING_CONDITION_ADD_COMMIT = 'serviceData.VEHICLE_MAPPING_CONDITION_ADD_COMMIT';
+export const VEHICLE_MAPPING_CONDITION_REMOVE = 'serviceData.VEHICLE_MAPPING_CONDITION_REMOVE';
+export const VEHICLE_MAPPING_CONDITION_REMOVE_COMMIT = 'serviceData.VEHICLE_MAPPING_CONDITION_REMOVE_COMMIT';
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actions/campaign.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/campaign.js
new file mode 100644
index 0000000..1ae6007
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/campaign.js
@@ -0,0 +1,437 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param item
+ */
+export function partyItemAdd(item) {
+    return {
+        type: actionTypes.PARTY_ITEM_ADD,
+        payload: {
+            item,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_ADD_COMMIT,
+            },
+        },
+    };
+}
+export function partyItemEquippedSet(id, value, equippedEntityId, equippedEntityTypeId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_ITEM_EQUIPPED_SET,
+        payload: {
+            id,
+            value,
+            equippedEntityId,
+            equippedEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_EQUIPPED_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+export function partyItemAttuneSet(id, value, accept, reject) {
+    return {
+        type: actionTypes.PARTY_ITEM_ATTUNE_SET,
+        payload: {
+            id,
+            value,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_ATTUNE_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+export function partyItemQuantitySet(id, quantity, accept, reject) {
+    return {
+        type: actionTypes.PARTY_ITEM_QUANTITY_SET,
+        payload: {
+            id,
+            quantity,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_QUANTITY_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+export function partyItemChargesSet(id, uses, accept, reject) {
+    return {
+        type: actionTypes.PARTY_ITEM_CHARGES_SET,
+        payload: {
+            id,
+            uses,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_CHARGES_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param id
+ */
+export function partyItemRemove(id, removeContainerContents) {
+    return {
+        type: actionTypes.PARTY_ITEM_REMOVE,
+        payload: {
+            id,
+            removeContainerContents,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param containerEntityId
+ * @param containerEntityTypeId
+ * @param accept
+ * @param reject
+ */
+export function partyItemMoveSet(id, containerEntityId, containerEntityTypeId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_ITEM_MOVE_SET,
+        payload: {
+            id,
+            containerEntityId,
+            containerEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_MOVE_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ */
+export function partyInventoryRequest() {
+    return {
+        type: actionTypes.PARTY_INVENTORY_REQUEST,
+        payload: null,
+        meta: {},
+    };
+}
+/**
+ * @param campaignInfo
+ */
+export function partyCampaignInfoSet(campaignInfo) {
+    return {
+        type: actionTypes.PARTY_CAMPAIGN_INFO_SET,
+        payload: campaignInfo,
+        meta: {},
+    };
+}
+/**
+ *
+ * @param currencies
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function partyCurrenciesSet(currencies, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_CURRENCIES_SET,
+        payload: Object.assign(Object.assign({}, currencies), { destinationEntityTypeId,
+            destinationEntityId }),
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_CURRENCIES_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param transactionPayload
+ * @param accept
+ * @param reject
+ */
+export function partyCurrencyTransactionSet(transactionPayload, accept, reject) {
+    return {
+        type: actionTypes.PARTY_CURRENCY_TRANSACTION_SET,
+        payload: Object.assign({}, transactionPayload),
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function partyCurrencyCopperSet(amount, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_CURRENCY_COPPER_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_CURRENCY_COPPER_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function partyCurrencyElectrumSet(amount, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_CURRENCY_ELECTRUM_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_CURRENCY_ELECTRUM_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function partyCurrencyGoldSet(amount, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_CURRENCY_GOLD_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_CURRENCY_GOLD_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function partyCurrencyPlatinumSet(amount, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_CURRENCY_PLATINUM_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_CURRENCY_PLATINUM_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function partyCurrencySilverSet(amount, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_CURRENCY_SILVER_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_CURRENCY_SILVER_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param currencies
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ * @param accept
+ * @param reject
+ */
+export function partyItemCurrencySet(currency, id, accept, reject) {
+    return {
+        type: actionTypes.PARTY_ITEM_CURRENCY_SET,
+        payload: {
+            currency,
+            id,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_CURRENCY_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function partyItemCurrencyCopperSet(amount, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_ITEM_CURRENCY_COPPER_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_CURRENCY_COPPER_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function partyItemCurrencySilverSet(amount, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_ITEM_CURRENCY_SILVER_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_CURRENCY_SILVER_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function partyItemCurrencyElectrumSet(amount, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_ITEM_CURRENCY_ELECTRUM_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_CURRENCY_ELECTRUM_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function partyItemCurrencyGoldSet(amount, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_ITEM_CURRENCY_GOLD_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_CURRENCY_GOLD_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param amount
+ * @param destinationEntityTypeId
+ * @param destinationEntityId
+ */
+export function partyItemCurrencyPlatinumSet(amount, destinationEntityTypeId, destinationEntityId, accept, reject) {
+    return {
+        type: actionTypes.PARTY_ITEM_CURRENCY_PLATINUM_SET,
+        payload: {
+            amount,
+            destinationEntityId,
+            destinationEntityTypeId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.PARTY_ITEM_CURRENCY_PLATINUM_SET_COMMIT,
+            },
+            accept,
+            reject,
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actions/campaignSetting.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/campaignSetting.js
new file mode 100644
index 0000000..ae33702
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/campaignSetting.js
@@ -0,0 +1,12 @@
+import * as actionTypes from '../actionTypes';
+export function campaignSettingsSet(campaignSettings) {
+    return {
+        type: actionTypes.CAMPAIGN_SETTINGS_SET,
+        payload: campaignSettings,
+        meta: {
+            commit: {
+                type: actionTypes.CAMPAIGN_SETTINGS_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actions/classAlwaysKnownSpells.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/classAlwaysKnownSpells.js
new file mode 100644
index 0000000..9a18298
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/classAlwaysKnownSpells.js
@@ -0,0 +1,20 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param spells
+ * @param classId
+ */
+export function classAlwaysKnownSpellsSet(spells, classId) {
+    return {
+        type: actionTypes.CLASS_ALWAYS_KNOWN_SPELLS_SET,
+        payload: {
+            spells,
+            classId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CLASS_ALWAYS_KNOWN_SPELLS_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actions/classAlwaysPreparedSpells.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/classAlwaysPreparedSpells.js
new file mode 100644
index 0000000..a9c3d34
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/classAlwaysPreparedSpells.js
@@ -0,0 +1,20 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param spells
+ * @param classId
+ */
+export function classAlwaysPreparedSpellsSet(spells, classId) {
+    return {
+        type: actionTypes.CLASS_ALWAYS_PREPARED_SPELLS_SET,
+        payload: {
+            spells,
+            classId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.CLASS_ALWAYS_PREPARED_SPELLS_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actions/definitionPool.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/definitionPool.js
new file mode 100644
index 0000000..a6d6db5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/definitionPool.js
@@ -0,0 +1,22 @@
+import { DefinitionPoolGenerators } from '../../../engine/DefinitionPool';
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param definitions
+ * @param definitionAccessTypeLookup
+ */
+export function definitionPoolAdd(definitions, definitionAccessTypeLookup) {
+    return {
+        type: actionTypes.DEFINITION_POOL_ADD,
+        payload: {
+            type: DefinitionPoolGenerators.generatePoolDefinitionType(definitions[0]),
+            definitions: DefinitionPoolGenerators.generatePoolDefinitionItems(definitions),
+            definitionAccessTypeLookup,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.DEFINITION_POOL_ADD_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actions/infusionMapping.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/infusionMapping.js
new file mode 100644
index 0000000..d081fe2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/infusionMapping.js
@@ -0,0 +1,74 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param payload
+ */
+export function infusionMappingCreate(payload) {
+    return {
+        type: actionTypes.INFUSION_MAPPING_CREATE,
+        payload,
+        meta: {},
+    };
+}
+/**
+ *
+ * @param infusionMapping
+ */
+export function infusionMappingAdd(infusionMapping) {
+    return {
+        type: actionTypes.INFUSION_MAPPING_ADD,
+        payload: infusionMapping,
+        meta: {
+            commit: {
+                type: actionTypes.INFUSION_MAPPING_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param infusionId
+ * @param inventoryMappingId
+ */
+export function infusionMappingDestroy(infusionId, inventoryMappingId) {
+    return {
+        type: actionTypes.INFUSION_MAPPING_DESTROY,
+        payload: {
+            infusionId,
+            inventoryMappingId,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param itemMappingIds
+ */
+export function infusionMappingsDestroy(itemMappingIds) {
+    return {
+        type: actionTypes.INFUSION_MAPPINGS_DESTROY,
+        payload: {
+            ids: itemMappingIds,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param infusionId
+ * @param inventoryMappingId
+ */
+export function infusionMappingRemove(infusionId, inventoryMappingId) {
+    return {
+        type: actionTypes.INFUSION_MAPPING_REMOVE,
+        payload: {
+            infusionId,
+            inventoryMappingId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.INFUSION_MAPPING_REMOVE_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actions/knownInfusionMapping.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/knownInfusionMapping.js
new file mode 100644
index 0000000..c70684e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/knownInfusionMapping.js
@@ -0,0 +1,88 @@
+import { DefinitionGenerators, DefinitionTypeEnum } from '../../../engine/Definition';
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param choiceKey
+ * @param infusionId
+ */
+export function knownInfusionMappingCreate(choiceKey, infusionId) {
+    return {
+        type: actionTypes.KNOWN_INFUSION_MAPPING_CREATE,
+        payload: {
+            choiceKey,
+            infusionId,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param infusionKnownMapping
+ */
+export function knownInfusionMappingAdd(infusionKnownMapping) {
+    return {
+        type: actionTypes.KNOWN_INFUSION_MAPPING_ADD,
+        payload: infusionKnownMapping,
+        meta: {
+            commit: {
+                type: actionTypes.KNOWN_INFUSION_MAPPING_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param choiceKey
+ */
+export function knownInfusionMappingDestroy(choiceKey) {
+    return {
+        type: actionTypes.KNOWN_INFUSION_MAPPING_DESTROY,
+        payload: {
+            choiceKey,
+        },
+        meta: {},
+    };
+}
+/**
+ *
+ * @param choiceKey
+ * @param infusionId
+ * @param itemId
+ * @param itemTypeId
+ * @param itemName
+ */
+export function knownInfusionMappingSet(choiceKey, infusionId, itemId, itemTypeId, itemName) {
+    return {
+        type: actionTypes.KNOWN_INFUSION_MAPPING_SET,
+        payload: {
+            choiceKey,
+            infusionId,
+            definitionKey: DefinitionGenerators.generateDefinitionKey(DefinitionTypeEnum.INFUSION, infusionId),
+            itemId,
+            itemTypeId,
+            itemName,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.KNOWN_INFUSION_MAPPING_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param choiceKey
+ */
+export function knownInfusionMappingRemove(choiceKey) {
+    return {
+        type: actionTypes.KNOWN_INFUSION_MAPPING_REMOVE,
+        payload: {
+            choiceKey,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.KNOWN_INFUSION_MAPPING_REMOVE_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actions/ruleDataPool.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/ruleDataPool.js
new file mode 100644
index 0000000..420cf2a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/ruleDataPool.js
@@ -0,0 +1,15 @@
+import * as actionTypes from '../actionTypes';
+export function ruleDataPoolKeySet(key, data) {
+    return {
+        type: actionTypes.RULE_DATA_POOL_KEY_SET,
+        payload: {
+            key,
+            data,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.RULE_DATA_POOL_KEY_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actions/vehicleComponentMapping.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/vehicleComponentMapping.js
new file mode 100644
index 0000000..abf622b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/vehicleComponentMapping.js
@@ -0,0 +1,54 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param component
+ */
+export function vehicleComponentMappingAdd(component) {
+    return {
+        type: actionTypes.VEHICLE_COMPONENT_MAPPING_ADD,
+        payload: {
+            component,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VEHICLE_COMPONENT_MAPPING_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ */
+export function vehicleComponentMappingRemove(id) {
+    return {
+        type: actionTypes.VEHICLE_COMPONENT_MAPPING_REMOVE,
+        payload: {
+            id,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VEHICLE_COMPONENT_MAPPING_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param removedHitPoints
+ */
+export function vehicleComponentMappingHitPointsSet(id, removedHitPoints) {
+    return {
+        type: actionTypes.VEHICLE_COMPONENT_MAPPING_HIT_POINTS_SET,
+        payload: {
+            id,
+            removedHitPoints,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VEHICLE_COMPONENT_MAPPING_HIT_POINTS_SET_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/actions/vehicleMapping.js b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/vehicleMapping.js
new file mode 100644
index 0000000..5c0c9b3
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/actions/vehicleMapping.js
@@ -0,0 +1,158 @@
+import * as actionTypes from '../actionTypes';
+/**
+ *
+ * @param vehicleId
+ * @param name
+ * @param accept
+ * @param reject
+ */
+export function vehicleMappingCreate(vehicleId, name, accept, reject) {
+    return {
+        type: actionTypes.VEHICLE_MAPPING_CREATE,
+        payload: {
+            vehicleId,
+            name,
+        },
+        meta: {
+            accept,
+            reject,
+        },
+    };
+}
+/**
+ *
+ * @param vehicle
+ */
+export function vehicleMappingAdd(vehicle) {
+    return {
+        type: actionTypes.VEHICLE_MAPPING_ADD,
+        payload: {
+            vehicle,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VEHICLE_MAPPING_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ */
+export function vehicleMappingRemove(id) {
+    return {
+        type: actionTypes.VEHICLE_MAPPING_REMOVE,
+        payload: {
+            id,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VEHICLE_MAPPING_REMOVE_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param id
+ * @param properties
+ */
+export function vehicleMappingDataSet(id, properties) {
+    return {
+        type: actionTypes.VEHICLE_MAPPING_DATA_SET,
+        payload: {
+            id,
+            properties,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VEHICLE_MAPPING_DATA_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param vehicleMappingId
+ * @param remainingFuel
+ */
+export function vehicleMappingRemainingFuelSet(vehicleMappingId, remainingFuel) {
+    return {
+        type: actionTypes.VEHICLE_MAPPING_REMAINING_FUEL_SET,
+        payload: {
+            vehicleMappingId,
+            remainingFuel,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VEHICLE_MAPPING_REMAINING_FUEL_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param vehicleMappingId
+ * @param conditionId
+ * @param level
+ */
+export function vehicleMappingConditionSet(vehicleMappingId, conditionId, level) {
+    return {
+        type: actionTypes.VEHICLE_MAPPING_CONDITION_SET,
+        payload: {
+            vehicleMappingId,
+            mappingContract: {
+                conditionId,
+                level,
+            },
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VEHICLE_MAPPING_CONDITION_SET_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param vehicleMappingId
+ * @param conditionId
+ * @param level
+ */
+export function vehicleMappingConditionAdd(vehicleMappingId, conditionId, level) {
+    return {
+        type: actionTypes.VEHICLE_MAPPING_CONDITION_ADD,
+        payload: {
+            vehicleMappingId,
+            mappingContract: {
+                conditionId,
+                level,
+            },
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VEHICLE_MAPPING_CONDITION_ADD_COMMIT,
+            },
+        },
+    };
+}
+/**
+ *
+ * @param vehicleMappingId
+ * @param conditionId
+ */
+export function vehicleMappingConditionRemove(vehicleMappingId, conditionId) {
+    return {
+        type: actionTypes.VEHICLE_MAPPING_CONDITION_REMOVE,
+        payload: {
+            vehicleMappingId,
+            conditionId,
+        },
+        meta: {
+            commit: {
+                type: actionTypes.VEHICLE_MAPPING_CONDITION_REMOVE_COMMIT,
+            },
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/serviceData/index.js b/ddb_main/packages/rules-engine/es/actions/serviceData/index.js
new file mode 100644
index 0000000..88dfa4a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/serviceData/index.js
@@ -0,0 +1,6 @@
+import * as actionTypes from './actionTypes';
+import * as actions from './actions';
+import * as typings from './typings';
+export const serviceDataActionTypes = actionTypes;
+export const serviceDataActions = actions;
+export const serviceDataTypings = typings;
diff --git a/ddb_main/packages/rules-engine/es/actions/syncTransaction/actionTypes.js b/ddb_main/packages/rules-engine/es/actions/syncTransaction/actionTypes.js
new file mode 100644
index 0000000..28811ef
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/syncTransaction/actionTypes.js
@@ -0,0 +1,2 @@
+export const ACTIVATE = 'syncTransaction.ACTIVATE';
+export const DEACTIVATE = 'syncTransaction.DEACTIVATE';
diff --git a/ddb_main/packages/rules-engine/es/actions/syncTransaction/actions.js b/ddb_main/packages/rules-engine/es/actions/syncTransaction/actions.js
new file mode 100644
index 0000000..8728d76
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/syncTransaction/actions.js
@@ -0,0 +1,21 @@
+import * as actionTypes from './actionTypes';
+/**
+ *
+ * @param initiator
+ */
+export function activate(initiator) {
+    return {
+        type: actionTypes.ACTIVATE,
+        payload: {
+            initiator,
+        },
+    };
+}
+/**
+ *
+ */
+export function deactivate() {
+    return {
+        type: actionTypes.DEACTIVATE,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/actions/syncTransaction/index.js b/ddb_main/packages/rules-engine/es/actions/syncTransaction/index.js
new file mode 100644
index 0000000..a529650
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/actions/syncTransaction/index.js
@@ -0,0 +1,6 @@
+import * as actionTypes from './actionTypes';
+import * as actions from './actions';
+import * as typings from './typings';
+export const syncTransactionActionTypes = actionTypes;
+export const syncTransactionActions = actions;
+export const syncTransactionTypings = typings;
diff --git a/ddb_main/packages/rules-engine/es/api/constants.js b/ddb_main/packages/rules-engine/es/api/constants.js
new file mode 100644
index 0000000..2cf1266
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/constants.js
@@ -0,0 +1,14 @@
+import { DefinitionTypeEnum } from '../engine/Definition';
+export var ApiTypeEnum;
+(function (ApiTypeEnum) {
+    ApiTypeEnum["GAME_DATA_SERVICE"] = "GAME_DATA_SERVICE";
+    ApiTypeEnum["CHARACTER_SERVICE"] = "CHARACTER_SERVICE";
+    ApiTypeEnum["WEBSITE"] = "WEBSITE";
+    ApiTypeEnum["HACK__CHARACTER_SERVICE_GAME_DATA"] = "HACK__CHARACTER_SERVICE_GAME_DATA";
+})(ApiTypeEnum || (ApiTypeEnum = {}));
+export const DEFINITION_SERVICE_VERSIONS = {
+    [DefinitionTypeEnum.INFUSION]: 1,
+    [DefinitionTypeEnum.VEHICLE]: 4,
+};
+export const CHARACTER_SERVICE_VERSION_KEY = 'v5';
+export const CHARACTER_SERVICE_VERSION_KEY_OVERRIDE = 'v5.1';
diff --git a/ddb_main/packages/rules-engine/es/api/generators.js b/ddb_main/packages/rules-engine/es/api/generators.js
new file mode 100644
index 0000000..eda29da
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/generators.js
@@ -0,0 +1,29 @@
+import { CampaignAccessors } from '../engine/Campaign';
+import { ContentSharingSettingEnum } from '../engine/Core';
+import { CHARACTER_SERVICE_VERSION_KEY } from './constants';
+/**
+ *
+ * @param apiPath
+ */
+export function generateCharacterServiceApiPath(apiPath, apiVersionOverride) {
+    return ['character', apiVersionOverride !== null && apiVersionOverride !== void 0 ? apiVersionOverride : CHARACTER_SERVICE_VERSION_KEY, apiPath].join('/');
+}
+/**
+ *
+ * @param campaign
+ */
+export function generateRequiredGameDataServiceParams(campaign) {
+    return {
+        campaignId: campaign === null ? null : CampaignAccessors.getId(campaign),
+        sharingSetting: ContentSharingSettingEnum.SCOPE_TO_INDIVIDUAL_CAMPAIGN,
+    };
+}
+/**
+ *
+ * @param characterId
+ */
+export function generateRequiredCharacterServiceParams(characterId) {
+    return {
+        characterId,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/api/hacks.js b/ddb_main/packages/rules-engine/es/api/hacks.js
new file mode 100644
index 0000000..694b75a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/hacks.js
@@ -0,0 +1,12 @@
+import * as ApiAdapterUtils from '../apiAdapter/utils';
+import { ApiTypeEnum } from './constants';
+import { getGameDataDefinitionTypeBasePath } from './utils';
+/**
+ *
+ * @param definitionType
+ * @param config
+ */
+export function hack__characterServiceMakeGetIdsDefinitionTypeRequest(definitionType, config) {
+    let apiPath = ['game-data', getGameDataDefinitionTypeBasePath(definitionType), 'collection'].join('/');
+    return ApiAdapterUtils.makePost(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, apiPath, config);
+}
diff --git a/ddb_main/packages/rules-engine/es/api/requestHelpers/character/spell.js b/ddb_main/packages/rules-engine/es/api/requestHelpers/character/spell.js
new file mode 100644
index 0000000..624d0a0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requestHelpers/character/spell.js
@@ -0,0 +1,46 @@
+/**
+ *
+ * @param level
+ */
+export function getSpellLevelPactMagicRequestsDataKey(level) {
+    switch (level) {
+        case 1:
+            return 'level1';
+        case 2:
+            return 'level2';
+        case 3:
+            return 'level3';
+        case 4:
+            return 'level4';
+        case 5:
+            return 'level5';
+    }
+    return null;
+}
+/**
+ *
+ * @param level
+ */
+export function getSpellLevelSpellSlotRequestsDataKey(level) {
+    switch (level) {
+        case 1:
+            return 'level1';
+        case 2:
+            return 'level2';
+        case 3:
+            return 'level3';
+        case 4:
+            return 'level4';
+        case 5:
+            return 'level5';
+        case 6:
+            return 'level6';
+        case 7:
+            return 'level7';
+        case 8:
+            return 'level8';
+        case 9:
+            return 'level9';
+    }
+    return null;
+}
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/action/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/action/requests.js
new file mode 100644
index 0000000..ab22058
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/action/requests.js
@@ -0,0 +1,6 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const putCharacterActionLimitedUse = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'action/limited-use');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/background/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/background/requests.js
new file mode 100644
index 0000000..062fe5a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/background/requests.js
@@ -0,0 +1,18 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const putCharacterBackground = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'background');
+/**
+ *
+ */
+export const putCharacterBackgroundChoice = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'background/choice');
+/**
+ *
+ */
+export const putCharacterCustomBackground = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'custom/background');
+/**
+ *
+ */
+export const putCharacterConfigurationHasCustomBackground = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'configuration/has-custom-background');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/builder/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/builder/requests.js
new file mode 100644
index 0000000..916bf59
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/builder/requests.js
@@ -0,0 +1,20 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const postCharacterBuilderStandardBuild = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'builder/standard-build', {
+    removeDefaultParams: true,
+});
+/**
+ *
+ */
+export const postCharacterBuilderRandomBuild = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'builder/random-build', {
+    removeDefaultParams: true,
+});
+/**
+ *
+ */
+export const postCharacterBuilderQuickBuild = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'builder/quick-build', {
+    removeDefaultParams: true,
+});
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/campaign/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/campaign/requests.js
new file mode 100644
index 0000000..89f856c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/campaign/requests.js
@@ -0,0 +1,5 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+export const getPartyInventory = ApiAdapterUtils.makeInterpolatedGet(ApiTypeEnum.CHARACTER_SERVICE, 'party/inventory/{campaignId}', { removeDefaultParams: true });
+// This response should have the sharing state on it
+// shareStatus = `ON` (fully working, paid) `OFF` (should not be on) `DELETE_ONLY` (turned off, but still has things. Can claim or move out of campaign or delete, no adding more to the container)
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/campaignSetting/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/campaignSetting/requests.js
new file mode 100644
index 0000000..122483e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/campaignSetting/requests.js
@@ -0,0 +1,14 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ * Get data for single campaign setting
+ */
+export const getCampaignSetting = ApiAdapterUtils.makeInterpolatedGet(ApiTypeEnum.GAME_DATA_SERVICE, 'campaign-settings/v1/campaign-settings/{id}');
+/**
+ * Get data for all campaign settings
+ */
+export const getAllCampaignSettings = ApiAdapterUtils.makeGet(ApiTypeEnum.GAME_DATA_SERVICE, 'campaign-settings/v1/campaign-settings');
+/**
+ * Update campaign setting on character
+ */
+export const putCharacterCampaignSetting = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'campaign-setting');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/character/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/character/requests.js
new file mode 100644
index 0000000..d214d9c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/character/requests.js
@@ -0,0 +1,47 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const putCharacterAbilityScore = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'character/ability-score');
+/**
+ *
+ */
+export const putCharacterAbilityScoreType = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'character/ability-score/type');
+/**
+ *
+ */
+export const putCharacterHelpText = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'character/help-text');
+/**
+ *
+ */
+export const getCharacterRestShort = ApiAdapterUtils.makeGet(ApiTypeEnum.CHARACTER_SERVICE, 'character/rest/short');
+/**
+ *
+ */
+export const postCharacterRestShort = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'character/rest/short');
+/**
+ *
+ */
+export const getCharacterRestLong = ApiAdapterUtils.makeGet(ApiTypeEnum.CHARACTER_SERVICE, 'character/rest/long');
+/**
+ *
+ */
+export const postCharacterRestLong = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'character/rest/long');
+/**
+ *
+ */
+export const putCharacterProgression = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'character/progression');
+/**
+ *
+ */
+export const putCharacterPreferences = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'character/preferences');
+/**
+ *
+ */
+export const putCharacterSourceCategories = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'character/source-categories');
+export const putCharacterSources = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, `campaign-setting`);
+/**
+ *
+ */
+export const putCharacterInspiration = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'character/inspiration');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/class/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/class/requests.js
new file mode 100644
index 0000000..1018c95
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/class/requests.js
@@ -0,0 +1,18 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const postCharacterClass = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'class');
+/**
+ *
+ */
+export const deleteCharacterClass = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'class');
+/**
+ *
+ */
+export const putCharacterClassLevel = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'class/level');
+/**
+ *
+ */
+export const putCharacterClassFeatureChoice = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'class/feature/choice');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/condition/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/condition/requests.js
new file mode 100644
index 0000000..437b3d3
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/condition/requests.js
@@ -0,0 +1,10 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const putCharacterCondition = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'condition');
+/**
+ *
+ */
+export const deleteCharacterCondition = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'condition');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/creature/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/creature/requests.js
new file mode 100644
index 0000000..b5d4870
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/creature/requests.js
@@ -0,0 +1,22 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const postCharacterCreature = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'creature');
+/**
+ *
+ */
+export const deleteCharacterCreature = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'creature');
+/**
+ *
+ */
+export const putCharacterCreature = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'creature');
+/**
+ *
+ */
+export const putCharacterCreatureStatus = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'creature/status');
+/**
+ *
+ */
+export const putCharacterCreatureHp = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'creature/hp');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/custom/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/custom/requests.js
new file mode 100644
index 0000000..45bb17b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/custom/requests.js
@@ -0,0 +1,98 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum, CHARACTER_SERVICE_VERSION_KEY_OVERRIDE } from '../../../constants';
+/**
+ *
+ */
+export const putCharacterCustomValue = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'custom/value');
+/**
+ *
+ */
+export const deleteCharacterCustomValue = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'custom/value');
+/**
+ *
+ */
+export const deleteCharacterCustomEntityValues = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'custom/entity/values');
+/**
+ *
+ */
+export const postCharacterCustomProficiency = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'custom/proficiency');
+/**
+ *
+ */
+export const putCharacterCustomProficiency = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'custom/proficiency');
+/**
+ *
+ */
+export const deleteCharacterCustomProficiency = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'custom/proficiency');
+/**
+ *
+ */
+export const postCharacterCustomMovement = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'custom/movement');
+/**
+ *
+ */
+export const putCharacterCustomMovement = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'custom/movement');
+/**
+ *
+ */
+export const deleteCharacterCustomMovement = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'custom/movement');
+/**
+ *
+ */
+export const postCharacterCustomAction = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'custom/action');
+/**
+ *
+ */
+export const deleteCharacterCustomAction = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'custom/action');
+/**
+ *
+ */
+export const putCharacterCustomAction = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'custom/action');
+/**
+ * TODO v5.1: Remove this and usages when mobile moves up
+ */
+export const postCharacterCustomItemV5 = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'custom/item');
+/**
+ * TODO v5.1: Remove this and usages when mobile moves up
+ */
+export const deleteCharacterCustomItemV5 = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'custom/item');
+/**
+ * TODO v5.1: Remove this and usages when mobile moves up
+ */
+export const putCharacterCustomItemV5 = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'custom/item');
+/**
+ *
+ */
+export const postCharacterCustomItem = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'custom/item', undefined, CHARACTER_SERVICE_VERSION_KEY_OVERRIDE);
+/**
+ *
+ */
+export const deleteCharacterCustomItem = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'custom/item', undefined, CHARACTER_SERVICE_VERSION_KEY_OVERRIDE);
+/**
+ *
+ */
+export const putCharacterCustomItem = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'custom/item', undefined, CHARACTER_SERVICE_VERSION_KEY_OVERRIDE);
+/**
+ *
+ */
+export const postCharacterCustomSense = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'custom/sense');
+/**
+ *
+ */
+export const putCharacterCustomSense = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'custom/sense');
+/**
+ *
+ */
+export const deleteCharacterCustomSense = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'custom/sense');
+/**
+ *
+ */
+export const postCharacterCustomDefenseAdjustment = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'custom/defense-adjustment');
+/**
+ *
+ */
+export const putCharacterCustomDefenseAdjustment = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'custom/defense-adjustment');
+/**
+ *
+ */
+export const deleteCharacterCustomDefenseAdjustment = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'custom/defense-adjustment');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/decoration/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/decoration/requests.js
new file mode 100644
index 0000000..96590c2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/decoration/requests.js
@@ -0,0 +1,26 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const putCharacterDecorationBackdrop = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'decoration/backdrop');
+/**
+ *
+ */
+export const putCharacterDecorationFrame = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'decoration/frame');
+/**
+ *
+ */
+export const putCharacterDecorationPortrait = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'decoration/portrait');
+/**
+ * user uploaded portrait file
+ */
+export const postCharacterDecorationPortraitCustom = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'decoration/portrait/custom');
+/**
+ *
+ */
+export const putCharacterDecorationThemeColor = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'decoration/theme-color');
+/**
+ *
+ */
+export const putCharacterDecorationSocialImage = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'decoration/social-image');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/description/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/description/requests.js
new file mode 100644
index 0000000..121d4f7
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/description/requests.js
@@ -0,0 +1,54 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const putCharacterDescriptionAge = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/age');
+/**
+ *
+ */
+export const putCharacterDescriptionAlignment = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/alignment');
+/**
+ *
+ */
+export const putCharacterDescriptionEyes = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/eyes');
+/**
+ *
+ */
+export const putCharacterDescriptionFaith = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/faith');
+/**
+ *
+ */
+export const putCharacterDescriptionGender = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/gender');
+/**
+ *
+ */
+export const putCharacterDescriptionHair = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/hair');
+/**
+ *
+ */
+export const putCharacterDescriptionHeight = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/height');
+/**
+ *
+ */
+export const putCharacterDescriptionLifestyle = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/lifestyle');
+/**
+ *
+ */
+export const putCharacterDescriptionName = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/name');
+/**
+ *
+ */
+export const putCharacterDescriptionNotes = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/notes');
+/**
+ *
+ */
+export const putCharacterDescriptionSkin = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/skin');
+/**
+ *
+ */
+export const putCharacterDescriptionTraits = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/traits');
+/**
+ *
+ */
+export const putCharacterDescriptionWeight = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'description/weight');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/feat/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/feat/requests.js
new file mode 100644
index 0000000..8859237
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/feat/requests.js
@@ -0,0 +1,6 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+export const putCharacterFeatChoice = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'feat/choice');
+export const postCharacterFeatAdHoc = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'feat/ad-hoc');
+export const deleteCharacterFeatAdHoc = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'feat/ad-hoc');
+export const postEntityFeat = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'feat/from-entity');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/infusion/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/infusion/requests.js
new file mode 100644
index 0000000..c8c6181
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/infusion/requests.js
@@ -0,0 +1,30 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const getCharacterInfusionItems = ApiAdapterUtils.makeGet(ApiTypeEnum.CHARACTER_SERVICE, 'infusion/items');
+/**
+ *
+ */
+export const postCharacterInfusion = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'infusion/item');
+/**
+ *
+ */
+export const deleteCharacterInfusion = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'infusion/item');
+/**
+ *
+ */
+export const getCharacterKnownInfusions = ApiAdapterUtils.makeGet(ApiTypeEnum.CHARACTER_SERVICE, 'known-infusions');
+/**
+ *
+ */
+export const postCharacterKnownInfusion = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'known-infusion');
+/**
+ *
+ */
+export const putCharacterKnownInfusion = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'known-infusion');
+/**
+ *
+ */
+export const deleteCharacterKnownInfusion = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'known-infusion');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/inventory/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/inventory/requests.js
new file mode 100644
index 0000000..9f7ac4f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/inventory/requests.js
@@ -0,0 +1,66 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const putCharacterInventoryItemQuantity = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/item/quantity');
+/**
+ *
+ */
+export const putCharacterInventoryItemAttuned = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/item/attuned');
+/**
+ *
+ */
+export const putCharacterInventoryItemCharge = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/item/charge');
+/**
+ *
+ */
+export const putCharacterInventoryItemEquipped = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/item/equipped');
+/**
+ *
+ */
+export const putCharacterInventoryItemMove = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/item/move');
+/**
+ *
+ */
+export const postCharacterInventoryItem = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/item');
+/**
+ *
+ */
+export const deleteCharacterInventoryItem = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/item');
+/**
+ *
+ */
+export const putCharacterInventoryStartingType = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/starting-type');
+/**
+ * CURRENCY
+ * TODO: Beyond Bits
+ */
+/**
+ *
+ */
+export const putCharacterInventoryCurrency = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/currency');
+/**
+ *
+ */
+export const putCharacterInventoryCurrencyTransaction = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/currency/transaction');
+/**
+ *
+ */
+export const putCharacterInventoryCurrencyCopper = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/currency/copper');
+/**
+ *
+ */
+export const putCharacterInventoryCurrencyElectrum = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/currency/electrum');
+/**
+ *
+ */
+export const putCharacterInventoryCurrencyGold = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/currency/gold');
+/**
+ *
+ */
+export const putCharacterInventoryCurrencyPlatinum = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/currency/platinum');
+/**
+ *
+ */
+export const putCharacterInventoryCurrencySilver = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'inventory/currency/silver');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/life/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/life/requests.js
new file mode 100644
index 0000000..72d538a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/life/requests.js
@@ -0,0 +1,26 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const putCharacterLifeRestore = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'life/restore');
+/**
+ *
+ */
+export const putCharacterLifeHpBase = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'life/hp/base');
+/**
+ *
+ */
+export const putCharacterLifeHpBonus = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'life/hp/bonus');
+/**
+ *
+ */
+export const putCharacterLifeHpOverride = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'life/hp/override');
+/**
+ *
+ */
+export const putCharacterLifeHpDamageTaken = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'life/hp/damage-taken');
+/**
+ *
+ */
+export const putCharacterLifeDeathSaves = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'life/death-saves');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/optional-feature/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/optional-feature/requests.js
new file mode 100644
index 0000000..b44c98f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/optional-feature/requests.js
@@ -0,0 +1,34 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const postCharacterOptionalFeatureClassFeature = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'optional-feature/class-feature');
+/**
+ *
+ */
+export const putCharacterOptionalFeatureClassFeature = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'optional-feature/class-feature');
+/**
+ *
+ */
+export const deleteCharacterOptionalFeatureClassFeature = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'optional-feature/class-feature');
+/**
+ *
+ */
+export const deleteCharacterOptionalFeatureClassFeatureCollection = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'optional-feature/class-feature/collection');
+/**
+ *
+ */
+export const postCharacterOptionalFeatureOrigin = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'optional-feature/racial-trait');
+/**
+ *
+ */
+export const putCharacterOptionalFeatureOrigin = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'optional-feature/racial-trait');
+/**
+ *
+ */
+export const deleteCharacterOptionalFeatureOrigin = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'optional-feature/racial-trait');
+/**
+ *
+ */
+export const deleteCharacterOptionalFeatureOriginCollection = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'optional-feature/racial-trait/collection');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/pdf/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/pdf/requests.js
new file mode 100644
index 0000000..0ce10db
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/pdf/requests.js
@@ -0,0 +1,10 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const postCharacterPdf = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'pdf');
+/**
+ *
+ */
+export const getCharacterPdf = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'pdf');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/premadeInfo/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/premadeInfo/requests.js
new file mode 100644
index 0000000..5f1e9be
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/premadeInfo/requests.js
@@ -0,0 +1,8 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+export const getPremadeInfo = ApiAdapterUtils.makeInterpolatedGet(ApiTypeEnum.CHARACTER_SERVICE, 'premade/{characterId}', {
+    removeDefaultParams: true,
+});
+export const addPremadeInfo = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'premade');
+export const setPremadeInfo = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'premade');
+export const deletePremadeInfo = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'premade');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/race/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/race/requests.js
new file mode 100644
index 0000000..5c97e79
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/race/requests.js
@@ -0,0 +1,10 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const putCharacterRace = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'race');
+/**
+ *
+ */
+export const putCharacterRaceRacialTraitChoice = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'race/trait/choice');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/rollResult/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/rollResult/requests.js
new file mode 100644
index 0000000..7128458
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/rollResult/requests.js
@@ -0,0 +1,30 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const getCharacterRollResultGroups = ApiAdapterUtils.makeGet(ApiTypeEnum.CHARACTER_SERVICE, 'roll-result-groups');
+/**
+ *
+ */
+export const postCharacterRollResultGroup = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'roll-result-group');
+/**
+ * PUT - UpdateRollResult(characterId, rollKey, nextRollKey, rollTotal, assignedValue, rollValues, groupKey, componentKey) - /character/v4/roll-result
+ */
+export const putCharacterRollResult = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'roll-result');
+/**
+ *
+ */
+export const putCharacterRollResultGroup = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'roll-result-group');
+/**
+ *
+ */
+export const putCharacterRollResultGroupOrder = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'roll-result-group/order');
+/**
+ *
+ */
+export const deleteCharacterRollResultGroup = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'roll-result-group');
+/**
+ *
+ */
+export const deleteCharacterRollResultGroups = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'roll-result-groups');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/ruleData/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/ruleData/requests.js
new file mode 100644
index 0000000..9045196
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/ruleData/requests.js
@@ -0,0 +1,6 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const getCharacterRuleData = ApiAdapterUtils.makeGet(ApiTypeEnum.CHARACTER_SERVICE, 'rule-data', { removeDefaultParams: true });
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/share/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/share/requests.js
new file mode 100644
index 0000000..2244a8b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/share/requests.js
@@ -0,0 +1,6 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const getCharacterShareUrl = ApiAdapterUtils.makeGet(ApiTypeEnum.CHARACTER_SERVICE, 'share/url');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/spell/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/spell/requests.js
new file mode 100644
index 0000000..f6d16e2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/spell/requests.js
@@ -0,0 +1,26 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const postCharacterSpell = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'spell');
+/**
+ *
+ */
+export const deleteCharacterSpell = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'spell');
+/**
+ *
+ */
+export const putCharacterSpellPrepared = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'spell/prepared');
+/**
+ *
+ */
+export const putCharacterSpellSlots = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'spell/slots');
+/**
+ *
+ */
+export const putCharacterSpellPactMagic = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'spell/pact-magic');
+/**
+ *
+ */
+export const deleteCharacterSpellRemoveBySpellListIds = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'spell/remove-by-spell-list-ids');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/character/vehicle/requests.js b/ddb_main/packages/rules-engine/es/api/requests/character/vehicle/requests.js
new file mode 100644
index 0000000..c9209e5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/character/vehicle/requests.js
@@ -0,0 +1,50 @@
+import * as ApiAdapterUtils from '../../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../../constants';
+/**
+ *
+ */
+export const getCharacterVehicles = ApiAdapterUtils.makeGet(ApiTypeEnum.CHARACTER_SERVICE, 'vehicles');
+/**
+ *
+ */
+export const postCharacterVehicle = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'vehicle');
+/**
+ *
+ */
+export const deleteCharacterVehicle = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'vehicle');
+/**
+ *
+ */
+export const putCharacterVehicle = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'vehicle');
+/**
+ *
+ */
+export const putCharacterVehicleFuel = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'vehicle/fuel');
+/**
+ *
+ */
+export const postCharacterVehicleCondition = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'vehicle/condition');
+/**
+ *
+ */
+export const putCharacterVehicleCondition = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'vehicle/condition');
+/**
+ *
+ */
+export const deleteCharacterVehicleCondition = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'vehicle/condition');
+/**
+ *
+ */
+export const getCharacterVehicleComponents = ApiAdapterUtils.makeGet(ApiTypeEnum.CHARACTER_SERVICE, 'vehicle/components');
+/**
+ *
+ */
+export const postCharacterVehicleComponent = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'vehicle/component');
+/**
+ *
+ */
+export const putCharacterVehicleComponent = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'vehicle/component');
+/**
+ *
+ */
+export const putCharacterVehicleComponentHp = ApiAdapterUtils.makePut(ApiTypeEnum.CHARACTER_SERVICE, 'vehicle/component/hp');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/featureFlag/requests.js b/ddb_main/packages/rules-engine/es/api/requests/featureFlag/requests.js
new file mode 100644
index 0000000..dbf31a3
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/featureFlag/requests.js
@@ -0,0 +1,6 @@
+import * as ApiAdapterUtils from '../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../constants';
+/**
+ * This is a temporary character service endpoint and will eventually be moved to a feature flag service
+ */
+export const getFeatureFlag = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'featureflag');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/gameData/requests.js b/ddb_main/packages/rules-engine/es/api/requests/gameData/requests.js
new file mode 100644
index 0000000..0de0a2f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/gameData/requests.js
@@ -0,0 +1,88 @@
+import * as ApiAdapterUtils from '../../../apiAdapter/utils';
+import { ApiTypeEnum } from '../../constants';
+/**
+ *
+ */
+export const getGameDataRuleDataVehicle = ApiAdapterUtils.makeGet(ApiTypeEnum.GAME_DATA_SERVICE, 'vehicles/v3/rule-data');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterNameRandom = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'name/random');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getSuggestedNames = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'name/random/list');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataBackgrounds = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/backgrounds');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataBackdrops = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/backdrops');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataFeats = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/feats');
+// /features/v1/features/collection?category=blessing
+export const getCharacterGameDataFeatures = ApiAdapterUtils.makeGet(ApiTypeEnum.GAME_DATA_SERVICE, 'features/v1/features/collection');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataFrames = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/frames');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataPortraits = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/portraits');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataSubclasses = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/subclasses');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataThemeColors = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/themes');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataClasses = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/classes');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataSpells = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/spells');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataAlwaysKnownSpells = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/always-known-spells');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataAlwaysPreparedSpells = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/always-prepared-spells');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataRaces = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/races');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataBackgroundStartingEquipment = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/background-starting-equipment');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataClassStartingEquipment = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/class-starting-equipment');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataItems = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/items', undefined, 'v5.1');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataMonsters = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/monsters');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataRacialTraits = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/racial-trait/collection');
+/**
+ * This is a temporary character service endpoint and will eventually be moved to the game data service
+ */
+export const getCharacterGameDataClassFeatures = ApiAdapterUtils.makeGet(ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA, 'game-data/class-feature/collection');
diff --git a/ddb_main/packages/rules-engine/es/api/requests/gfs/requests.js b/ddb_main/packages/rules-engine/es/api/requests/gfs/requests.js
new file mode 100644
index 0000000..3b03865
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/requests/gfs/requests.js
@@ -0,0 +1,6 @@
+import { ApiTypeEnum } from "../../constants";
+import * as ApiAdapterUtils from '../../../apiAdapter/utils';
+export const getCharacterFeatures = ApiAdapterUtils.makeInterpolatedGet(ApiTypeEnum.CHARACTER_SERVICE, 'features/{characterId}', { removeDefaultParams: true });
+export const postCharacterFeature = ApiAdapterUtils.makePost(ApiTypeEnum.CHARACTER_SERVICE, 'feature');
+export const deleteCharacterFeature = ApiAdapterUtils.makeDelete(ApiTypeEnum.CHARACTER_SERVICE, 'feature');
+export const postFeaturesAndSubfeatures = ApiAdapterUtils.makePost(ApiTypeEnum.GAME_DATA_SERVICE, 'features/v1/features/collection');
diff --git a/ddb_main/packages/rules-engine/es/api/utils.js b/ddb_main/packages/rules-engine/es/api/utils.js
new file mode 100644
index 0000000..14a18f7
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/api/utils.js
@@ -0,0 +1,101 @@
+import * as ApiAdapterUtils from '../apiAdapter/utils';
+import { ConfigUtils } from '../config';
+import { DefinitionTypeEnum } from '../engine/Definition';
+import { HelperUtils } from '../engine/Helper';
+import { ApiTypeEnum, DEFINITION_SERVICE_VERSIONS } from './constants';
+/**
+ *
+ * @param url
+ * @param id
+ */
+export function makeGetIdUrl(url, id) {
+    return url.replace('{id}', id);
+}
+/**
+ *
+ * @param definitionType
+ */
+export function getGameDataDefinitionTypeBasePath(definitionType) {
+    let basePath = '';
+    switch (definitionType) {
+        case DefinitionTypeEnum.VEHICLE:
+            basePath = 'vehicle';
+            break;
+        case DefinitionTypeEnum.INFUSION:
+            basePath = 'infusion';
+            break;
+        case DefinitionTypeEnum.RACIAL_TRAIT:
+            basePath = 'racial-trait';
+            break;
+        case DefinitionTypeEnum.CLASS_FEATURE:
+            basePath = 'class-feature';
+            break;
+        default:
+        // not implemented
+    }
+    return basePath;
+}
+/**
+ *
+ * @param definitionType
+ */
+export function getGameDataDefinitionTypeVersion(definitionType) {
+    let version = HelperUtils.lookupDataOrFallback(DEFINITION_SERVICE_VERSIONS, definitionType, -1);
+    return `v${version}`;
+}
+/**
+ *
+ * @param definitionType
+ * @param config
+ */
+export function makeGetAllDefinitionTypeRequest(definitionType, config) {
+    let apiPath = [
+        getGameDataDefinitionTypeBasePath(definitionType),
+        getGameDataDefinitionTypeVersion(definitionType),
+        'collection',
+    ].join('/');
+    return ApiAdapterUtils.makeGet(ApiTypeEnum.GAME_DATA_SERVICE, apiPath, config);
+}
+/**
+ *
+ * @param definitionType
+ * @param id
+ */
+export function makeGetDefinitionTypeRequest(definitionType, id) {
+    let apiPath = [
+        getGameDataDefinitionTypeBasePath(definitionType),
+        getGameDataDefinitionTypeVersion(definitionType),
+        '{id}',
+    ].join('/');
+    return ApiAdapterUtils.makeGet(ApiTypeEnum.GAME_DATA_SERVICE, makeGetIdUrl(apiPath, id));
+}
+/**
+ *
+ * @param definitionType
+ * @param config
+ */
+export function makeGetIdsDefinitionTypeRequest(definitionType, config) {
+    let apiPath = [
+        getGameDataDefinitionTypeBasePath(definitionType),
+        getGameDataDefinitionTypeVersion(definitionType),
+        'collection',
+    ].join('/');
+    return ApiAdapterUtils.makePost(ApiTypeEnum.GAME_DATA_SERVICE, apiPath, config);
+}
+/**
+ * TODO consider makeInterpolatedGet for gets with params
+ * TODO support character/v3/characters/full/{userId}
+ * TODO support character/v3/characters/short/{userId}
+ * @param characterId
+ */
+export function makeGetCharacterRequest(characterId) {
+    //TODO v5.1: when mobile moves up to support customItems access if we can remove this
+    const { includeCustomItems } = ConfigUtils.getCurrentRulesEngineConfig();
+    let config = {
+        removeDefaultParams: true,
+    };
+    if (includeCustomItems) {
+        config = Object.assign(Object.assign({}, config), { params: { includeCustomItems } });
+    }
+    return ApiAdapterUtils.makeGet(ApiTypeEnum.CHARACTER_SERVICE, makeGetIdUrl('character/{id}', characterId.toString()), config);
+}
diff --git a/ddb_main/packages/rules-engine/es/apiAdapter/errorHandlers.js b/ddb_main/packages/rules-engine/es/apiAdapter/errorHandlers.js
new file mode 100644
index 0000000..f211c85
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/apiAdapter/errorHandlers.js
@@ -0,0 +1,21 @@
+import axios from 'axios';
+import { LoggerUtils } from '../logger';
+import { ApiException } from './errors';
+export function handleApiException(error) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    // only do something if not canceled, cancellation should be fine
+    if (axios.isCancel(error)) {
+        throw error;
+    }
+    else {
+        throw new ApiException((_a = error.config.url) !== null && _a !== void 0 ? _a : null, (_c = (_b = error.response) === null || _b === void 0 ? void 0 : _b.status) !== null && _c !== void 0 ? _c : null, (_d = error.config.method) !== null && _d !== void 0 ? _d : null, {
+            params: (_e = error.config.params) !== null && _e !== void 0 ? _e : null,
+            data: (_f = error.config.data) !== null && _f !== void 0 ? _f : null,
+            serverErrorData: (_j = (_h = (_g = error.response) === null || _g === void 0 ? void 0 : _g.data) === null || _h === void 0 ? void 0 : _h.data) !== null && _j !== void 0 ? _j : [],
+        });
+    }
+}
+export function handleApiAdapterException(error) {
+    LoggerUtils.logError(error);
+    throw error;
+}
diff --git a/ddb_main/packages/rules-engine/es/apiAdapter/errors.js b/ddb_main/packages/rules-engine/es/apiAdapter/errors.js
new file mode 100644
index 0000000..4e3917e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/apiAdapter/errors.js
@@ -0,0 +1,61 @@
+export class ApiAdapterException extends Error {
+    constructor(message) {
+        super(message);
+        Object.setPrototypeOf(this, new.target.prototype);
+        this.name = ApiAdapterException.name;
+    }
+}
+export class ApiAdapterContextException extends ApiAdapterException {
+    constructor(contextData, message) {
+        super(message);
+        Object.setPrototypeOf(this, new.target.prototype);
+        this.name = ApiAdapterContextException.name;
+        this.contextData = contextData;
+    }
+}
+export class OverrideApiException extends ApiAdapterException {
+    constructor(contextData, message) {
+        super(message);
+        Object.setPrototypeOf(this, new.target.prototype);
+        this.name = OverrideApiException.name;
+        this.contextData = contextData;
+    }
+}
+export class AuthMissingException extends ApiAdapterException {
+    constructor(message) {
+        super(message);
+        Object.setPrototypeOf(this, new.target.prototype);
+        this.name = AuthMissingException.name;
+    }
+}
+export class AuthException extends ApiAdapterContextException {
+    constructor(contextData, message) {
+        super(contextData, message);
+        Object.setPrototypeOf(this, new.target.prototype);
+        this.name = AuthException.name;
+    }
+}
+export class ApiAdapterUrlException extends ApiAdapterContextException {
+    constructor(url, errorCode, method, contextData, message) {
+        super(contextData, message);
+        Object.setPrototypeOf(this, new.target.prototype);
+        this.name = ApiAdapterUrlException.name;
+        this.url = url;
+        this.errorCode = errorCode;
+        this.method = method === null ? null : method.toUpperCase();
+    }
+}
+export class ApiException extends ApiAdapterUrlException {
+    constructor(url, errorCode, method, contextData, message) {
+        super(url, errorCode, method, contextData, message);
+        Object.setPrototypeOf(this, new.target.prototype);
+        this.name = ApiException.name;
+    }
+}
+export class ApiAdapterDataException extends ApiAdapterUrlException {
+    constructor(url, errorCode, method, contextData, message) {
+        super(url, errorCode, method, contextData, message);
+        Object.setPrototypeOf(this, new.target.prototype);
+        this.name = ApiAdapterDataException.name;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/apiAdapter/generators.js b/ddb_main/packages/rules-engine/es/apiAdapter/generators.js
new file mode 100644
index 0000000..7138de1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/apiAdapter/generators.js
@@ -0,0 +1,97 @@
+import axios from 'axios';
+import { merge } from 'lodash';
+import AuthUtils from '@dndbeyond/authentication-lib-js';
+import { handleApiAdapterException, handleApiException } from './errorHandlers';
+import { ApiAdapterException, AuthException, AuthMissingException, OverrideApiException } from './errors';
+import { validateApiAdapterResponse, validateCanRequest } from './validators';
+let getAuthLibAuthHeaders = null;
+/**
+ *
+ * @param authUrl
+ * @param isReadonly
+ * @param existingConfig
+ */
+export function generateAuthRequestConfig(authUrl, isReadonly, existingConfig) {
+    if (getAuthLibAuthHeaders === null) {
+        getAuthLibAuthHeaders = AuthUtils.makeGetAuthorizationHeaders({
+            authUrl,
+        });
+    }
+    return getAuthLibAuthHeaders()
+        .then((authHeaders = {}) => {
+        if (!validateCanRequest(authHeaders, isReadonly)) {
+            throw new AuthMissingException();
+        }
+        let authRequestConfig = {
+            headers: authHeaders,
+        };
+        return merge({}, existingConfig, authRequestConfig);
+    })
+        .catch((error) => {
+        if (error instanceof ApiAdapterException) {
+            throw error;
+        }
+        else {
+            throw new AuthException();
+        }
+    });
+}
+/**
+ *
+ * @param existingConfig
+ */
+export function generateApiAdapterRequestConfig(existingConfig) {
+    const defaultConfig = {
+        withCredentials: true,
+    };
+    return merge({}, defaultConfig, existingConfig);
+}
+export function handleOverrideError(altHandler, config, errorData) {
+    return (error) => {
+        if (config === null || config === void 0 ? void 0 : config.onError) {
+            let thisError = error;
+            if (!(thisError instanceof OverrideApiException)) {
+                thisError = new OverrideApiException(errorData, 'API ERROR');
+            }
+            throw thisError;
+        }
+        else {
+            altHandler(error);
+        }
+    };
+}
+/**
+ *
+ * @param authUrl
+ * @param isReadonly
+ */
+export function generateApiAdapter(authUrl, isReadonly) {
+    return {
+        get: (apiPath, config) => generateAuthRequestConfig(authUrl, isReadonly, config)
+            .then((requestConfig) => axios
+            .get(apiPath, generateApiAdapterRequestConfig(requestConfig))
+            .catch(handleOverrideError(handleApiException, config, { apiPath })))
+            .then(validateApiAdapterResponse)
+            .catch(handleOverrideError(handleApiAdapterException, config, { apiPath })),
+        delete: (apiPath, config) => generateAuthRequestConfig(authUrl, isReadonly, config)
+            .then((requestConfig) => axios
+            .delete(apiPath, generateApiAdapterRequestConfig(requestConfig))
+            .catch(handleOverrideError(handleApiException, config, { apiPath })))
+            .then(validateApiAdapterResponse)
+            .catch(handleOverrideError(handleApiAdapterException, config, { apiPath })),
+        head: axios.head,
+        post: (apiPath, data, config) => generateAuthRequestConfig(authUrl, isReadonly, config)
+            .then((requestConfig) => axios
+            .post(apiPath, data, generateApiAdapterRequestConfig(requestConfig))
+            .catch(handleOverrideError(handleApiException, config, { apiPath, data })))
+            .then(validateApiAdapterResponse)
+            .catch(handleOverrideError(handleApiAdapterException, config, { apiPath, data })),
+        put: (apiPath, data, config) => generateAuthRequestConfig(authUrl, isReadonly, config)
+            .then((requestConfig) => axios
+            .put(apiPath, data, generateApiAdapterRequestConfig(requestConfig))
+            .catch(handleOverrideError(handleApiException, config, { apiPath, data })))
+            .then(validateApiAdapterResponse)
+            .catch(handleOverrideError(handleApiAdapterException, config, { apiPath, data })),
+        patch: axios.patch,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/apiAdapter/utils.js b/ddb_main/packages/rules-engine/es/apiAdapter/utils.js
new file mode 100644
index 0000000..85c4b03
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/apiAdapter/utils.js
@@ -0,0 +1,144 @@
+import { merge } from 'lodash';
+import { ApiTypeEnum } from '../api/constants';
+import { generateCharacterServiceApiPath } from '../api/generators';
+import { ConfigUtils } from '../config';
+import { rulesEngineSelectors } from '../selectors';
+let emptyPromise = new Promise((resolve, reject) => {
+    resolve({
+        data: {
+            success: false,
+        },
+        headers: {},
+        status: -1,
+        statusText: 'EMPTY_PROMISE',
+    });
+});
+export function getApiBaseUrl(apiType) {
+    const config = ConfigUtils.getCurrentRulesEngineConfig();
+    switch (apiType) {
+        case ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA:
+            return config.apiInfo[ApiTypeEnum.CHARACTER_SERVICE];
+        default:
+        // not implemented
+    }
+    return config.apiInfo[apiType];
+}
+export function generateApiUrl(apiType, apiPath, apiVersionOverride) {
+    return [getApiBaseUrl(apiType), transformApiPath(apiType, apiPath, apiVersionOverride)].join('/');
+}
+export function generateDefaultRequestParams(apiType, requestConfig) {
+    const config = ConfigUtils.getCurrentRulesEngineConfig();
+    if (config.store === undefined || requestConfig.removeDefaultParams) {
+        return {};
+    }
+    switch (apiType) {
+        case ApiTypeEnum.CHARACTER_SERVICE:
+            return rulesEngineSelectors.getRequiredCharacterServiceParams(config.store.getState());
+        case ApiTypeEnum.GAME_DATA_SERVICE:
+        case ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA:
+            return rulesEngineSelectors.getRequiredGameDataServiceParams(config.store.getState());
+        default:
+        // not implemented
+    }
+    return {};
+}
+export function transformApiPath(apiType, apiPath, apiVersionOverride) {
+    switch (apiType) {
+        case ApiTypeEnum.CHARACTER_SERVICE:
+        case ApiTypeEnum.HACK__CHARACTER_SERVICE_GAME_DATA:
+            return generateCharacterServiceApiPath(apiPath, apiVersionOverride);
+        default:
+        //not implemented
+    }
+    return apiPath;
+}
+export function makeGet(apiType, apiPath, config, apiVersionOverride) {
+    return (additionalConfig = {}) => {
+        const rulesEngineConfig = ConfigUtils.getCurrentRulesEngineConfig();
+        if (rulesEngineConfig.apiAdapter) {
+            const initialRequestConfig = merge({}, config, additionalConfig);
+            const defaultRequestParams = generateDefaultRequestParams(apiType, initialRequestConfig);
+            const defaultRequestConfig = {
+                params: defaultRequestParams,
+            };
+            const requestConfig = merge({}, defaultRequestConfig, initialRequestConfig);
+            return rulesEngineConfig.apiAdapter.get(generateApiUrl(apiType, apiPath, apiVersionOverride), requestConfig);
+        }
+        return emptyPromise;
+    };
+}
+export function makeInterpolatedGet(apiType, apiPath, config, apiVersionOverride) {
+    return (data, additionalConfig = {}) => {
+        const rulesEngineConfig = ConfigUtils.getCurrentRulesEngineConfig();
+        if (rulesEngineConfig.apiAdapter) {
+            const initialRequestConfig = merge({}, config, additionalConfig);
+            const defaultRequestParams = generateDefaultRequestParams(apiType, initialRequestConfig);
+            const defaultRequestConfig = {
+                params: defaultRequestParams,
+            };
+            const requestConfig = merge({}, defaultRequestConfig, initialRequestConfig);
+            let interpolatedPath = `${apiPath}`;
+            Object.keys(data).forEach((key) => {
+                if (!data[key]) {
+                    throw new Error(`Key: ${key} was not provided to makeInterpolatedGet`);
+                }
+                interpolatedPath = interpolatedPath.replace(`{${key}}`, data[key]);
+            });
+            return rulesEngineConfig.apiAdapter.get(generateApiUrl(apiType, interpolatedPath, apiVersionOverride), requestConfig);
+        }
+        return emptyPromise;
+    };
+}
+export function makePost(apiType, apiPath, config, apiVersionOverride) {
+    return (data, additionalConfig = {}) => {
+        const rulesEngineConfig = ConfigUtils.getCurrentRulesEngineConfig();
+        if (rulesEngineConfig.apiAdapter) {
+            const requestConfig = merge({}, config, additionalConfig);
+            const defaultRequestParams = generateDefaultRequestParams(apiType, requestConfig);
+            const requestData = merge({}, defaultRequestParams, data);
+            return rulesEngineConfig.apiAdapter.post(generateApiUrl(apiType, apiPath, apiVersionOverride), requestData, requestConfig);
+        }
+        return emptyPromise;
+    };
+}
+export function makePut(apiType, apiPath, config, apiVersionOverride) {
+    return (data, additionalConfig = {}) => {
+        const rulesEngineConfig = ConfigUtils.getCurrentRulesEngineConfig();
+        if (rulesEngineConfig.apiAdapter) {
+            const requestConfig = merge({}, config, additionalConfig);
+            const defaultRequestParams = generateDefaultRequestParams(apiType, requestConfig);
+            const requestData = merge({}, defaultRequestParams, data);
+            return rulesEngineConfig.apiAdapter.put(generateApiUrl(apiType, apiPath, apiVersionOverride), requestData, requestConfig);
+        }
+        return emptyPromise;
+    };
+}
+export function makeDelete(apiType, apiPath, config, apiVersionOverride) {
+    return (data, additionalConfig = {}) => {
+        const rulesEngineConfig = ConfigUtils.getCurrentRulesEngineConfig();
+        if (rulesEngineConfig.apiAdapter) {
+            const initialRequestConfig = merge({}, config, additionalConfig);
+            const defaultRequestParams = generateDefaultRequestParams(apiType, initialRequestConfig);
+            const defaultRequestConfig = {
+                data: defaultRequestParams,
+            };
+            const paramConfig = {
+                data: data ? data : {},
+            };
+            const requestConfig = merge({}, defaultRequestConfig, paramConfig);
+            return rulesEngineConfig.apiAdapter.delete(generateApiUrl(apiType, apiPath, apiVersionOverride), requestConfig);
+        }
+        return emptyPromise;
+    };
+}
+/**
+ *
+ * @param response
+ */
+export function getResponseData(response) {
+    var _a;
+    if (((_a = response === null || response === void 0 ? void 0 : response.data) === null || _a === void 0 ? void 0 : _a.data) !== undefined) {
+        return response.data.data;
+    }
+    return null;
+}
diff --git a/ddb_main/packages/rules-engine/es/apiAdapter/validators.js b/ddb_main/packages/rules-engine/es/apiAdapter/validators.js
new file mode 100644
index 0000000..d233e5f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/apiAdapter/validators.js
@@ -0,0 +1,28 @@
+import { ApiAdapterDataException } from './errors';
+export function validateApiAdapterResponse(response) {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
+    if (!response.data) {
+        throw new ApiAdapterDataException((_a = response.config.url) !== null && _a !== void 0 ? _a : null, response.status, (_b = response.config.method) !== null && _b !== void 0 ? _b : null, {
+            params: (_c = response.config.params) !== null && _c !== void 0 ? _c : null,
+            data: (_d = response.config.data) !== null && _d !== void 0 ? _d : null,
+            responseData: response.data,
+        }, 'Invalid JSON response, missing data object');
+    }
+    if (typeof response.data !== 'object') {
+        throw new ApiAdapterDataException((_e = response.config.url) !== null && _e !== void 0 ? _e : null, response.status, (_f = response.config.method) !== null && _f !== void 0 ? _f : null, {
+            params: (_g = response.config.params) !== null && _g !== void 0 ? _g : null,
+            data: (_h = response.config.data) !== null && _h !== void 0 ? _h : null,
+            responseData: response.data,
+        }, 'Invalid JSON response, data object is a string');
+    }
+    return response;
+}
+export function validateCanRequest(authHeaders, isReadonly) {
+    if (isReadonly) {
+        return true;
+    }
+    if (Object.keys(authHeaders).length) {
+        return true;
+    }
+    return false;
+}
diff --git a/ddb_main/packages/rules-engine/es/config/utils.js b/ddb_main/packages/rules-engine/es/config/utils.js
new file mode 100644
index 0000000..b09899e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/config/utils.js
@@ -0,0 +1,44 @@
+import { ApiTypeEnum } from '../api/constants';
+import { NotificationTypeEnum } from '../notification';
+import { ConfigUtils } from './index';
+const defaultApiInfo = {
+    [ApiTypeEnum.WEBSITE]: '',
+    [ApiTypeEnum.GAME_DATA_SERVICE]: '',
+    [ApiTypeEnum.CHARACTER_SERVICE]: '',
+};
+const defaultRulesEngineConfig = {
+    apiInfo: defaultApiInfo,
+};
+export let rulesEngineConfig = {
+    apiInfo: defaultApiInfo,
+    messageBroker: null,
+    characterId: 0,
+};
+/**
+ *
+ * @param config
+ */
+export function configureRulesEngine(config) {
+    rulesEngineConfig = Object.assign(Object.assign(Object.assign({}, defaultRulesEngineConfig), rulesEngineConfig), config);
+    function dispatchMessage(title, message, notificationType = NotificationTypeEnum.SUCCESS) {
+        const rulesEngineConfig = ConfigUtils.getCurrentRulesEngineConfig();
+        if (rulesEngineConfig === null || rulesEngineConfig === void 0 ? void 0 : rulesEngineConfig.onNotification) {
+            rulesEngineConfig.onNotification(title, message, notificationType);
+        }
+    }
+}
+/**
+ *
+ */
+export function getCurrentRulesEngineConfig() {
+    return rulesEngineConfig;
+}
+const dummyDispatch = (action) => {
+    console.warn('Dispatch was called before store was initialized.');
+    console.log(action);
+    return action;
+};
+export function getDispatch() {
+    var _a;
+    return ((_a = getCurrentRulesEngineConfig().store) === null || _a === void 0 ? void 0 : _a.dispatch) || dummyDispatch;
+}
diff --git a/ddb_main/packages/rules-engine/es/defaults/index.js b/ddb_main/packages/rules-engine/es/defaults/index.js
new file mode 100644
index 0000000..311c251
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/defaults/index.js
@@ -0,0 +1,15 @@
+import { fork } from 'redux-saga/effects';
+import { characterReducer, ruleDataReducer, characterEnvReducer, featureFlagInfoReducer, serviceDataReducer, syncTransactionReducer, } from '../reducers';
+import { characterSaga, serviceDataSaga } from '../sagas';
+export const defaultReducers = {
+    characterEnv: characterEnvReducer,
+    character: characterReducer,
+    featureFlagInfo: featureFlagInfoReducer,
+    ruleData: ruleDataReducer,
+    serviceData: serviceDataReducer,
+    syncTransaction: syncTransactionReducer,
+};
+export function* defaultSaga() {
+    yield fork(characterSaga);
+    yield fork(serviceDataSaga);
+}
diff --git a/ddb_main/packages/rules-engine/es/diceRolls/constants.js b/ddb_main/packages/rules-engine/es/diceRolls/constants.js
new file mode 100644
index 0000000..31f78c9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/diceRolls/constants.js
@@ -0,0 +1,7 @@
+export const DICE_ROLL_KEY_CONCEPT_SEPARATOR = '__';
+export const DICE_ROLL_KEY_DATA_SEPARATOR = '--';
+export var DiceRollExcludeTypeEnum;
+(function (DiceRollExcludeTypeEnum) {
+    DiceRollExcludeTypeEnum[DiceRollExcludeTypeEnum["ALL"] = 1] = "ALL";
+    DiceRollExcludeTypeEnum[DiceRollExcludeTypeEnum["NONE"] = 2] = "NONE";
+})(DiceRollExcludeTypeEnum || (DiceRollExcludeTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/diceRolls/generators.js b/ddb_main/packages/rules-engine/es/diceRolls/generators.js
new file mode 100644
index 0000000..45281d4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/diceRolls/generators.js
@@ -0,0 +1,36 @@
+import { DICE_ROLL_KEY_CONCEPT_SEPARATOR, DICE_ROLL_KEY_DATA_SEPARATOR } from './constants';
+/**
+ *
+ * @param conceptString
+ * @param dataKey
+ */
+export function generateComponentKey(conceptString, dataKey) {
+    return [conceptString, dataKey].join(DICE_ROLL_KEY_CONCEPT_SEPARATOR);
+}
+/**
+ *
+ * @param dataKeyInfos
+ */
+export function generateComponentKeyDataKey(dataKeyInfos) {
+    return dataKeyInfos.map(generateComponentKeyDataInfoKey).join(DICE_ROLL_KEY_DATA_SEPARATOR);
+}
+/**
+ *
+ * @param dataKeyInfo
+ */
+export function generateComponentKeyDataInfoKey(dataKeyInfo) {
+    return [dataKeyInfo.key, dataKeyInfo.value].join(DICE_ROLL_KEY_DATA_SEPARATOR);
+}
+/**
+ *
+ * @param abilityScoreType
+ */
+export function generateAbilityManagerKey(abilityScoreType) {
+    const dataStrings = [
+        {
+            key: 'Type',
+            value: abilityScoreType.toString(),
+        },
+    ];
+    return generateComponentKey('AbilityManager', generateComponentKeyDataKey(dataStrings));
+}
diff --git a/ddb_main/packages/rules-engine/es/diceRolls/simulators.js b/ddb_main/packages/rules-engine/es/diceRolls/simulators.js
new file mode 100644
index 0000000..2fdc5f4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/diceRolls/simulators.js
@@ -0,0 +1,26 @@
+import { HelperUtils } from '../engine/Helper';
+/**
+ *
+ * @param rollGroupContractProps
+ * @param simulatedRollResultCount
+ */
+export function simulateRollGroupContract(rollGroupContractProps, simulatedRollResultCount = 0) {
+    var _a;
+    let rollResults = [];
+    let lastRoll = null;
+    for (let i = 0; i < simulatedRollResultCount; i++) {
+        const rollResultContract = simulateRollResultContract({
+            nextRollKey: (_a = lastRoll === null || lastRoll === void 0 ? void 0 : lastRoll.rollKey) !== null && _a !== void 0 ? _a : null,
+        });
+        rollResults.push(rollResultContract);
+        lastRoll = rollResultContract;
+    }
+    return Object.assign({ groupKey: HelperUtils.generateGuid(), nextGroupKey: null, rollResults }, rollGroupContractProps);
+}
+/**
+ *
+ * @param rollResultContractProps
+ */
+export function simulateRollResultContract(rollResultContractProps) {
+    return Object.assign({ rollKey: HelperUtils.generateGuid(), nextRollKey: null, rollTotal: null, rollValues: [], assignedValue: null }, rollResultContractProps);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Ability/accessors.js b/ddb_main/packages/rules-engine/es/engine/Ability/accessors.js
new file mode 100644
index 0000000..33bdfd6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Ability/accessors.js
@@ -0,0 +1,187 @@
+/**
+ *
+ * @param ability
+ */
+export function getBaseScore(ability) {
+    return ability.baseScore;
+}
+/**
+ *
+ * @param ability
+ */
+export function getClassBonuses(ability) {
+    return ability.classBonuses;
+}
+/**
+ *
+ * @param ability
+ */
+export function getEntityTypeId(ability) {
+    return ability.entityTypeId;
+}
+/**
+ *
+ * @param ability
+ */
+export function getId(ability) {
+    return ability.id;
+}
+/**
+ *
+ * @param ability
+ */
+export function getIsMaxed(ability) {
+    return ability.isMaxed;
+}
+/**
+ *
+ * @param ability
+ */
+export function getLabel(ability) {
+    return ability.label;
+}
+/**
+ *
+ * @param ability
+ */
+export function getMaxStatScore(ability) {
+    return ability.maxStatScore;
+}
+/**
+ *
+ * @param ability
+ */
+export function getMiscBonus(ability) {
+    return ability.miscBonus;
+}
+/**
+ *
+ * @param ability
+ */
+export function getModifier(ability) {
+    return ability.modifier;
+}
+/**
+ *
+ * @param ability
+ */
+export function getName(ability) {
+    return ability.name;
+}
+/**
+ *
+ * @param ability
+ */
+export function getOtherBonus(ability) {
+    return ability.otherBonus;
+}
+/**
+ *
+ * @param ability
+ */
+export function getOverrideScore(ability) {
+    return ability.overrideScore;
+}
+/**
+ *
+ * @param ability
+ */
+export function getRacialBonus(ability) {
+    return ability.racialBonus;
+}
+/**
+ *
+ * @param ability
+ */
+export function getScore(ability) {
+    return ability.score;
+}
+/**
+ *
+ * @param ability
+ */
+export function getSetScore(ability) {
+    return ability.setScore;
+}
+/**
+ *
+ * @param ability
+ */
+export function getStackingBonus(ability) {
+    return ability.stackingBonus;
+}
+/**
+ *
+ * @param ability
+ */
+export function getStatKey(ability) {
+    return ability.statKey;
+}
+/**
+ *
+ * @param ability
+ */
+export function getTotalScore(ability) {
+    return ability.totalScore;
+}
+/**
+ *
+ * @param ability
+ */
+export function getProficiency(ability) {
+    return ability.proficiency;
+}
+/**
+ *
+ * @param ability
+ */
+export function getProficiencyLevel(ability) {
+    return ability.proficiencyLevel;
+}
+/**
+ *
+ * @param ability
+ */
+export function getIsSaveModifierModified(ability) {
+    return ability.isSaveModifierModified;
+}
+/**
+ *
+ * @param ability
+ */
+export function getIsSaveOverridden(ability) {
+    return ability.isSaveOverridden;
+}
+/**
+ *
+ * @param ability
+ */
+export function getIsSaveProficiencyModified(ability) {
+    return ability.isSaveProficiencyModified;
+}
+/**
+ *
+ * @param ability
+ */
+export function getSave(ability) {
+    return ability.save;
+}
+/**
+ *
+ * @param ability
+ */
+export function getSaveBonuses(ability) {
+    return ability.saveBonuses;
+}
+export function getAllStatBonusSuppliers(ability) {
+    return ability.allStatBonusSuppliers;
+}
+export function getStatSetScoreSuppliers(ability) {
+    return ability.statSetScoreSuppliers;
+}
+export function getStatMaxBonusSuppliers(ability) {
+    return ability.statMaxBonusSuppliers;
+}
+export function getStackingBonusSuppliers(ability) {
+    return ability.stackingBonusSuppliers;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Ability/derivers.js b/ddb_main/packages/rules-engine/es/engine/Ability/derivers.js
new file mode 100644
index 0000000..a698ddc
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Ability/derivers.js
@@ -0,0 +1,114 @@
+import { TypeScriptUtils } from '../../utils';
+import { CharacterDerivers } from '../Character';
+import { ProficiencyLevelEnum } from '../Core';
+import { HelperUtils } from '../Helper';
+import { ModifierAccessors, ModifierValidators } from '../Modifier';
+import { getId, getModifier, getScore } from './accessors';
+/**
+ *
+ * @param abilityId
+ * @param modifiers
+ * @returns TODORETURN
+ */
+export function deriveHighestSetAbilityScore(abilityId, modifiers) {
+    const statSetScoreModifiers = modifiers.filter((modifier) => ModifierValidators.isValidSetStatScoreModifier(modifier, abilityId));
+    const statSetScoreModifierValues = statSetScoreModifiers
+        .map((modifier) => ModifierAccessors.getValue(modifier))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    if (!statSetScoreModifierValues.length) {
+        return 0;
+    }
+    return Math.max(...statSetScoreModifierValues);
+}
+/**
+ *
+ * @param id
+ * @param abilityLookup
+ * @param defaultValue
+ */
+export function deriveStatModifier(id, abilityLookup, defaultValue = 0) {
+    if (id === null) {
+        return defaultValue;
+    }
+    const ability = HelperUtils.lookupDataOrFallback(abilityLookup, id);
+    if (ability === null) {
+        return defaultValue;
+    }
+    const modifier = getModifier(ability);
+    if (modifier === null) {
+        return defaultValue;
+    }
+    return modifier;
+}
+/**
+ *
+ * @param id
+ * @param abilityLookup
+ * @param defaultValue
+ */
+export function deriveStatScore(id, abilityLookup, defaultValue = 0) {
+    if (id === null) {
+        return defaultValue;
+    }
+    const ability = HelperUtils.lookupDataOrFallback(abilityLookup, id);
+    if (ability === null) {
+        return defaultValue;
+    }
+    const score = getScore(ability);
+    if (score === null) {
+        return defaultValue;
+    }
+    return score;
+}
+/**
+ *
+ * @param hasSaveProficiency
+ * @param proficiencyLevelOverride
+ */
+export function deriveProficiencyLevel(hasSaveProficiency, proficiencyLevelOverride) {
+    let proficiencyLevel = hasSaveProficiency
+        ? ProficiencyLevelEnum.FULL
+        : ProficiencyLevelEnum.NONE;
+    if (proficiencyLevelOverride !== null) {
+        proficiencyLevel = proficiencyLevelOverride;
+    }
+    return proficiencyLevel;
+}
+/**
+ *
+ * @param abilityScore
+ * @param modifiers
+ * @param proficiencyBonus
+ * @param proficiencyLevelOverride
+ * @param saveOverride
+ * @param statBonusSaveModifierTotal
+ * @param magicBonus
+ * @param miscBonus
+ */
+export function deriveAbilitySaveInfo(abilityScore, modifiers, proficiencyBonus, proficiencyLevelOverride, saveOverride, statBonusSaveModifierTotal, magicBonus, miscBonus) {
+    const abilityId = getId(abilityScore);
+    const statProficiencySaveModifiers = modifiers.filter((modifier) => ModifierValidators.isValidProficiencySaveModifier(modifier, abilityId));
+    const hasSaveProficiency = statProficiencySaveModifiers.length > 0;
+    const proficiencyLevel = deriveProficiencyLevel(hasSaveProficiency, proficiencyLevelOverride);
+    const proficiencyBonusAmount = CharacterDerivers.deriveProficiencyBonusAmount(proficiencyLevel, proficiencyBonus);
+    let save = 0;
+    let saveBonuses = 0;
+    if (saveOverride !== null) {
+        save = saveOverride;
+    }
+    else {
+        saveBonuses = statBonusSaveModifierTotal + magicBonus + miscBonus;
+        const modifier = getModifier(abilityScore);
+        save = (modifier ? modifier : 0) + saveBonuses + proficiencyBonusAmount;
+    }
+    const isSaveOverridden = saveOverride !== null;
+    return {
+        proficiency: hasSaveProficiency,
+        proficiencyLevel,
+        isSaveProficiencyModified: proficiencyLevelOverride !== null,
+        isSaveModifierModified: !!miscBonus || !!magicBonus || isSaveOverridden,
+        save,
+        saveBonuses,
+        isSaveOverridden,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Ability/generators.js b/ddb_main/packages/rules-engine/es/engine/Ability/generators.js
new file mode 100644
index 0000000..4dc84dd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Ability/generators.js
@@ -0,0 +1,177 @@
+import { groupBy } from 'lodash';
+import keyBy from 'lodash/keyBy';
+import { ProficiencyLevelEnum } from '../Core';
+import { DataOriginGenerators, DataOriginTypeEnum } from '../DataOrigin';
+import { ModifierDerivers, ModifierGenerators, ModifierValidators } from '../Modifier';
+import { RuleDataAccessors } from '../RuleData';
+import { ValueHacks, ValueUtils } from '../Value';
+import { getEntityTypeId, getId } from './accessors';
+import { deriveAbilitySaveInfo, deriveHighestSetAbilityScore } from './derivers';
+import { getBestAbilityScore, getStatScoreModifier } from './utils';
+/**
+ *
+ * @param abilities
+ */
+export function generateAbilityLookup(abilities) {
+    return keyBy(abilities, 'id');
+}
+/**
+ *
+ * @param abilities
+ */
+export function generateAbilityKeyLookup(abilities) {
+    return keyBy(abilities, 'name');
+}
+/**
+ *
+ * @param stat
+ * @param baseStats
+ * @param bonusStats
+ * @param overrideStats
+ * @param raceModifiers
+ * @param classesModifiers
+ * @param miscModifiers
+ * @param modifiers
+ * @param proficiencyBonus
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateBaseAbility(stat, baseStats, bonusStats, overrideStats, raceModifiers, classesModifiers, miscModifiers, modifiers, proficiencyBonus, ruleData, modifierData) {
+    const statKey = stat.key === null ? '' : stat.key.toLowerCase();
+    const abilityId = stat.id;
+    const entityTypeId = stat.entityTypeId;
+    const baseStat = baseStats.find((ability) => ability.id === abilityId);
+    const bonusStat = bonusStats.find((ability) => ability.id === abilityId);
+    const overrideStat = overrideStats.find((ability) => ability.id === abilityId);
+    const racialBonus = ModifierDerivers.deriveTotalValue(ModifierGenerators.generateBonusStatScoreModifiers(raceModifiers, abilityId), modifierData);
+    const classBonuses = ModifierDerivers.deriveTotalValue(ModifierGenerators.generateBonusStatScoreModifiers(classesModifiers, abilityId), modifierData);
+    const miscBonus = ModifierDerivers.deriveTotalValue(ModifierGenerators.generateBonusStatScoreModifiers(miscModifiers, abilityId), modifierData);
+    // generate all stat bonus suppliers
+    const allStatBonusModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusStatScoreModifier(modifier, abilityId));
+    const allStatBonusSuppliers = generateAbilityScoreSupplierData(allStatBonusModifiers, 'bonus', modifierData);
+    //generate setScore and all setScore suppliers
+    const setScore = deriveHighestSetAbilityScore(abilityId, miscModifiers);
+    const statSetScoreModifiers = modifiers.filter((modifier) => ModifierValidators.isValidSetStatScoreModifier(modifier, abilityId));
+    const statSetScoreSuppliers = generateAbilityScoreSupplierData(statSetScoreModifiers, 'set', modifierData);
+    //generate maxStatBonus and all maxStatBonus suppliers
+    const statMaxBonusModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusStatMaxModifier(modifier, abilityId));
+    const statMaxBonus = ModifierDerivers.deriveTotalValue(statMaxBonusModifiers, modifierData);
+    const statMaxBonusSuppliers = generateAbilityScoreSupplierData(statMaxBonusModifiers, 'max', modifierData);
+    //generate stackingBonus and all stackingBonus suppliers
+    const stackingBonusModifiers = modifiers.filter((modifier) => ModifierValidators.isValidStackingBonusStatScoreModifier(modifier, abilityId));
+    const stackingBonus = ModifierDerivers.deriveTotalValue(stackingBonusModifiers, modifierData);
+    const stackingBonusSuppliers = generateAbilityScoreSupplierData(stackingBonusModifiers, 'stacking', modifierData);
+    // calculate baseScore, otherBonus, overrideScore, totalBonusScore, finalScore, and modifier
+    const baseScore = baseStat ? baseStat.value : null;
+    const otherBonus = bonusStat ? bonusStat.value : null;
+    let overrideScore = overrideStat ? overrideStat.value : null;
+    if (overrideScore === 0) {
+        overrideScore = null;
+    }
+    let totalBonusScore = null;
+    let finalScore = null;
+    let modifier = null;
+    let maxStatScore = ruleData.basicMaxStatScore;
+    if (baseScore !== null) {
+        totalBonusScore = baseScore + racialBonus + classBonuses + miscBonus;
+        maxStatScore = ruleData.basicMaxStatScore + statMaxBonus;
+        totalBonusScore = Math.min(maxStatScore, totalBonusScore);
+        totalBonusScore += otherBonus ? otherBonus : 0;
+        finalScore = getBestAbilityScore(totalBonusScore, setScore, ruleData);
+        if (overrideScore) {
+            finalScore = overrideScore;
+        }
+        if (stackingBonus > 0) {
+            finalScore = Math.min(maxStatScore, finalScore + stackingBonus);
+        }
+        finalScore = Math.max(ruleData.minStatScore, Math.min(ruleData.maxStatScore, finalScore));
+        modifier = getStatScoreModifier(finalScore, ruleData);
+    }
+    return {
+        label: stat.name,
+        id: stat.id,
+        entityTypeId,
+        name: statKey,
+        statKey,
+        totalScore: finalScore,
+        score: finalScore,
+        maxStatScore,
+        isMaxed: !!finalScore && finalScore >= maxStatScore,
+        modifier,
+        baseScore,
+        racialBonus,
+        classBonuses,
+        miscBonus,
+        setScore,
+        stackingBonus,
+        otherBonus,
+        overrideScore,
+        allStatBonusSuppliers,
+        statSetScoreSuppliers,
+        statMaxBonusSuppliers,
+        stackingBonusSuppliers,
+    };
+}
+export function generateAbilityScoreSupplierData(abilityModifiers, type, modifierData) {
+    const supplierGroups = groupBy(abilityModifiers, (modifier) => `${modifier.componentId}-${modifier.componentTypeId}`);
+    return Object.keys(supplierGroups).map((groupKey) => {
+        var _a;
+        const modifiers = supplierGroups[groupKey];
+        const totalValue = ModifierDerivers.deriveTotalValue(modifiers, modifierData);
+        let dataOrigin = (_a = modifiers[0]) === null || _a === void 0 ? void 0 : _a.dataOrigin;
+        let expandedOriginRef = null;
+        if (dataOrigin && dataOrigin.type === DataOriginTypeEnum.FEAT) {
+            expandedOriginRef = DataOriginGenerators.generateDataOriginRef(dataOrigin.type, groupKey);
+        }
+        return {
+            key: groupKey,
+            dataOrigin,
+            expandedOriginRef,
+            type,
+            value: totalValue,
+        };
+    });
+}
+/**
+ *
+ * @param abilityScore
+ * @param proficiencyBonus
+ * @param modifiers
+ * @param valueLookup
+ * @param modifierData
+ */
+export function generateAbility(abilityScore, proficiencyBonus, modifiers, valueLookup, modifierData) {
+    const abilityId = getId(abilityScore);
+    const abilityIdString = ValueHacks.hack__toString(abilityId);
+    const abilityEntityTypeId = getEntityTypeId(abilityScore);
+    const abilityEntityTypeIdString = ValueHacks.hack__toString(abilityEntityTypeId);
+    const miscBonus = ValueUtils.getSavingThrowMiscBonusValue(valueLookup, abilityIdString, abilityEntityTypeIdString);
+    const magicBonus = ValueUtils.getSavingThrowMagicBonusValue(valueLookup, abilityIdString, abilityEntityTypeIdString);
+    const saveOverride = ValueUtils.getSavingThrowOverrideValue(valueLookup, abilityIdString, abilityEntityTypeIdString);
+    const proficiencyLevelOverride = ValueUtils.getSavingThrowProficiencyLevelValue(valueLookup, abilityIdString, abilityEntityTypeIdString);
+    const statBonusSaveModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusSaveModifier(modifier, abilityId));
+    const statBonusSaveModifierTotal = ModifierDerivers.deriveTotalValue(statBonusSaveModifiers, modifierData, 1);
+    const abilitySaveInfo = deriveAbilitySaveInfo(abilityScore, modifiers, proficiencyBonus, proficiencyLevelOverride, saveOverride, statBonusSaveModifierTotal, magicBonus, miscBonus);
+    return Object.assign(Object.assign({}, abilityScore), abilitySaveInfo);
+}
+/**
+ *
+ * @param baseStats
+ * @param bonusStats
+ * @param overrideStats
+ * @param raceModifiers
+ * @param classesModifiers
+ * @param miscModifiers
+ * @param modifiers
+ * @param proficiencyBonus
+ * @param modifierData
+ * @param ruleData
+ * @param valueLookup
+ */
+export function generateAbilities(baseStats, bonusStats, overrideStats, raceModifiers, classesModifiers, miscModifiers, modifiers, proficiencyBonus, modifierData, ruleData, valueLookup) {
+    const abilityScores = RuleDataAccessors.getStats(ruleData).map((stat) => generateBaseAbility(stat, baseStats, bonusStats, overrideStats, raceModifiers, classesModifiers, miscModifiers, modifiers, proficiencyBonus, ruleData, modifierData));
+    const simulatedAbilities = abilityScores.map((ability) => (Object.assign(Object.assign({}, ability), { proficiency: false, proficiencyLevel: ProficiencyLevelEnum.NONE, isSaveProficiencyModified: false, isSaveModifierModified: false, save: 0, saveBonuses: 0, isSaveOverridden: false })));
+    const abilityScoresLookup = generateAbilityLookup(simulatedAbilities);
+    const updatedModifierData = Object.assign(Object.assign({}, modifierData), { abilityLookup: abilityScoresLookup });
+    return abilityScores.map((abilityScore) => generateAbility(abilityScore, proficiencyBonus, modifiers, valueLookup, updatedModifierData));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Ability/index.js b/ddb_main/packages/rules-engine/es/engine/Ability/index.js
new file mode 100644
index 0000000..b52feb0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Ability/index.js
@@ -0,0 +1,8 @@
+import * as AbilityAccessors from './accessors';
+import * as AbilityDerivers from './derivers';
+import * as AbilityGenerators from './generators';
+import * as AbilityTypings from './typings';
+import * as AbilityUtils from './utils';
+export * from './typings';
+export { AbilityAccessors, AbilityDerivers, AbilityGenerators, AbilityUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, AbilityAccessors), AbilityDerivers), AbilityGenerators), AbilityTypings), AbilityUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Ability/utils.js b/ddb_main/packages/rules-engine/es/engine/Ability/utils.js
new file mode 100644
index 0000000..051afc5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Ability/utils.js
@@ -0,0 +1,19 @@
+import { HelperUtils } from '../Helper';
+import { RuleDataAccessors } from '../RuleData';
+/**
+ *
+ * @param score
+ * @param ruleData
+ */
+export function getStatScoreModifier(score, ruleData) {
+    return HelperUtils.lookupDataOrFallback(RuleDataAccessors.getStatModifiersLookup(ruleData), score, 0);
+}
+/**
+ *
+ * @param totalBonusScore
+ * @param highestSetScore
+ * @param ruleData
+ */
+export function getBestAbilityScore(totalBonusScore, highestSetScore, ruleData) {
+    return Math.min(RuleDataAccessors.getMaxStatScore(ruleData), Math.max(totalBonusScore, highestSetScore));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Access/constants.js b/ddb_main/packages/rules-engine/es/engine/Access/constants.js
new file mode 100644
index 0000000..7bd89f7
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Access/constants.js
@@ -0,0 +1,7 @@
+export var AccessTypeEnum;
+(function (AccessTypeEnum) {
+    AccessTypeEnum[AccessTypeEnum["FREE"] = 1] = "FREE";
+    AccessTypeEnum[AccessTypeEnum["OWNED"] = 2] = "OWNED";
+    AccessTypeEnum[AccessTypeEnum["SHARED"] = 3] = "SHARED";
+    AccessTypeEnum[AccessTypeEnum["NO_ACCESS"] = 4] = "NO_ACCESS";
+})(AccessTypeEnum || (AccessTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Access/index.js b/ddb_main/packages/rules-engine/es/engine/Access/index.js
new file mode 100644
index 0000000..c078452
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Access/index.js
@@ -0,0 +1,7 @@
+import * as AccessConstants from './constants';
+import * as AccessTypings from './typings';
+import * as AccessUtils from './utils';
+export * from './typings';
+export * from './constants';
+export { AccessUtils };
+export default Object.assign(Object.assign(Object.assign({}, AccessConstants), AccessTypings), AccessUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Access/utils.js b/ddb_main/packages/rules-engine/es/engine/Access/utils.js
new file mode 100644
index 0000000..c49fa00
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Access/utils.js
@@ -0,0 +1,6 @@
+import { AccessTypeEnum } from './constants';
+export function isAccessible(accessType) {
+    return (accessType === AccessTypeEnum.FREE ||
+        accessType === AccessTypeEnum.OWNED ||
+        accessType === AccessTypeEnum.SHARED);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Action/accessors.js b/ddb_main/packages/rules-engine/es/engine/Action/accessors.js
new file mode 100644
index 0000000..6f4d9da
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Action/accessors.js
@@ -0,0 +1,526 @@
+/**
+ *
+ * @param action
+ */
+export function getDefinitionName(action) {
+    return action.definition.name;
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionAbilityModifierStatId(action) {
+    return action.definition.abilityModifierStatId;
+}
+/**
+ *
+ * @param action
+ */
+export function getAbilityModifierStatId(action) {
+    return getDefinitionAbilityModifierStatId(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionAttackSubtypeId(action) {
+    return action.definition.attackSubtype;
+}
+/**
+ *
+ * @param action
+ */
+export function getAttackSubtypeId(action) {
+    return getDefinitionAttackSubtypeId(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionAttackRangeId(action) {
+    return action.definition.attackTypeRange;
+}
+/**
+ *
+ * @param action
+ */
+export function getAttackRangeId(action) {
+    return getDefinitionAttackRangeId(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionActivation(action) {
+    return action.definition.activation;
+}
+/**
+ *
+ * @param action
+ */
+export function getActivation(action) {
+    return getDefinitionActivation(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionActionTypeId(action) {
+    return action.definition.actionType;
+}
+/**
+ *
+ * @param action
+ */
+export function getActionTypeId(action) {
+    return getDefinitionActionTypeId(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionDamageTypeId(action) {
+    return action.definition.damageTypeId;
+}
+/**
+ *
+ * @param action
+ */
+export function getDamageTypeId(action) {
+    return getDefinitionDamageTypeId(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionDescription(action) {
+    return action.definition.description;
+}
+/**
+ *
+ * @param action
+ */
+export function getDescription(action) {
+    return getDefinitionDescription(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionSnippet(action) {
+    return action.definition.snippet;
+}
+/**
+ *
+ * @param action
+ */
+export function getSnippet(action) {
+    return getDefinitionSnippet(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionDice(action) {
+    return action.definition.dice;
+}
+/**
+ *
+ * @param action
+ */
+export function getDice(action) {
+    return getDefinitionDice(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionIsMartialArts(action) {
+    return action.definition.isMartialArts;
+}
+/**
+ *
+ * @param action
+ */
+export function getIsMartialArts(action) {
+    return getDefinitionIsMartialArts(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionIsProficienct(action) {
+    return action.definition.isProficient;
+}
+/**
+ *
+ * @param action
+ */
+export function getIsProficienct(action) {
+    return getDefinitionIsProficienct(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionOnMissDescription(action) {
+    return action.definition.onMissDescription;
+}
+/**
+ *
+ * @param action
+ */
+export function getOnMissDescription(action) {
+    return getDefinitionOnMissDescription(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionRange(action) {
+    return action.definition.range;
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionFixedSaveDc(action) {
+    return action.definition.fixedSaveDc;
+}
+/**
+ *
+ * @param action
+ */
+export function getFixedSaveDc(action) {
+    return getDefinitionFixedSaveDc(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionSaveFailDescription(action) {
+    return action.definition.saveFailDescription;
+}
+/**
+ *
+ * @param action
+ */
+export function getSaveFailDescription(action) {
+    return getDefinitionSaveFailDescription(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionSaveStatId(action) {
+    return action.definition.saveStatId;
+}
+/**
+ *
+ * @param action
+ */
+export function getSaveStatId(action) {
+    return getDefinitionSaveStatId(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionSaveSuccessDescription(action) {
+    return action.definition.saveSuccessDescription;
+}
+/**
+ *
+ * @param action
+ */
+export function getSaveSuccessDescription(action) {
+    return getDefinitionSaveSuccessDescription(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionDisplayAsAttack(action) {
+    return action.definition.displayAsAttack;
+}
+/**
+ *
+ * @param action
+ */
+export function getDisplayAsAttack(action) {
+    return getDefinitionDisplayAsAttack(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionSpellRangeType(action) {
+    return action.definition.spellRangeType;
+}
+/**
+ *
+ * @param action
+ */
+export function getSpellRangeType(action) {
+    return getDefinitionSpellRangeType(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionFixedValue(action) {
+    return action.definition.value;
+}
+/**
+ *
+ * @param action
+ */
+export function getFixedValue(action) {
+    return getDefinitionFixedValue(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getFixedToHit(action) {
+    return getDefinitionFixedToHit(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionFixedToHit(action) {
+    return action.definition.fixedToHit;
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionNumberOfTargets(action) {
+    return action.definition.numberOfTargets;
+}
+/**
+ *
+ * @param action
+ */
+export function getAmmunition(action) {
+    return getDefinitionAmmunition(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinitionAmmunition(action) {
+    return action.definition.ammunition;
+}
+/**
+ *
+ * @param action
+ */
+export function getNumberOfTargets(action) {
+    return getDefinitionNumberOfTargets(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getDefinition(action) {
+    return action.definition;
+}
+/**
+ *
+ * @param action
+ */
+export function getComponentId(action) {
+    return action.componentId;
+}
+/**
+ *
+ * @param action
+ */
+export function getComponentTypeId(action) {
+    return action.componentTypeId;
+}
+/**
+ *
+ * @param action
+ */
+export function getEntityTypeId(action) {
+    return getMappingEntityTypeId(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getMappingEntityTypeId(action) {
+    return action.entityTypeId;
+}
+/**
+ *
+ * @param action
+ */
+export function getId(action) {
+    return getMappingId(action);
+}
+/**
+ *
+ * @param action
+ */
+export function getMappingId(action) {
+    return action.id;
+}
+/**
+ *
+ * @param action
+ */
+export function getLimitedUse(action) {
+    return action.limitedUse;
+}
+/**
+ *
+ * @param action
+ */
+export function displayAsAttack(action) {
+    return action.displayAsAttack;
+}
+/**
+ *
+ * @param action
+ */
+export function getName(action) {
+    return action.name;
+}
+/**
+ *
+ * @param action
+ */
+export function getNotes(action) {
+    return action.notes;
+}
+/**
+ *
+ * @param action
+ */
+export function getOriginalContract(action) {
+    return action.originalContract;
+}
+/**
+ *
+ * @param action
+ */
+export function isProficient(action) {
+    return action.proficiency;
+}
+/**
+ *
+ * @param action
+ */
+export function requiresAttackRoll(action) {
+    return action.requiresAttackRoll;
+}
+/**
+ *
+ * @param action
+ */
+export function requiresSavingThrow(action) {
+    return action.requiresSavingThrow;
+}
+/**
+ *
+ * @param action
+ */
+export function getUniqueKey(action) {
+    return action.uniqueKey;
+}
+/**
+ *
+ * @param action
+ */
+export function getDataOrigin(action) {
+    return action.dataOrigin;
+}
+/**
+ *
+ * @param action
+ */
+export function getDataOriginType(action) {
+    const dataOrigin = getDataOrigin(action);
+    return dataOrigin.type;
+}
+/**
+ *
+ * @param action
+ */
+export function getAttackSaveValue(action) {
+    return action.attackSaveValue;
+}
+/**
+ *
+ * @param action
+ */
+export function getAttackSubtypeName(action) {
+    return action.attackSubtypeName;
+}
+/**
+ *
+ * @param action
+ */
+export function getDamage(action) {
+    return action.damage;
+}
+/**
+ *
+ * @param action
+ */
+export function getRange(action) {
+    return action.range;
+}
+/**
+ *
+ * @param action
+ */
+export function getReach(action) {
+    return action.reach;
+}
+/**
+ *
+ * @param action
+ */
+export function getStatId(action) {
+    return action.statId;
+}
+/**
+ *
+ * @param action
+ */
+export function getToHit(action) {
+    return action.toHit;
+}
+/**
+ *
+ * @param action
+ */
+export function isOffhand(action) {
+    return action.isOffhand;
+}
+/**
+ *
+ * @param action
+ */
+export function isSilvered(action) {
+    return action.isSilvered;
+}
+/**
+ *
+ * @param action
+ */
+export function isDefaultDisplayAsAttack(action) {
+    return action.isDefaultDisplayAsAttack;
+}
+/**
+ *
+ * @param action
+ */
+export function isCustomized(action) {
+    return action.isCustomized;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Action/constants.js b/ddb_main/packages/rules-engine/es/engine/Action/constants.js
new file mode 100644
index 0000000..ff81ecd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Action/constants.js
@@ -0,0 +1,21 @@
+import { AdjustmentTypeEnum } from '../Value';
+export var ActionTypeEnum;
+(function (ActionTypeEnum) {
+    ActionTypeEnum[ActionTypeEnum["WEAPON"] = 1] = "WEAPON";
+    ActionTypeEnum[ActionTypeEnum["SPELL"] = 2] = "SPELL";
+    ActionTypeEnum[ActionTypeEnum["GENERAL"] = 3] = "GENERAL";
+})(ActionTypeEnum || (ActionTypeEnum = {}));
+export var AttackSubtypeEnum;
+(function (AttackSubtypeEnum) {
+    AttackSubtypeEnum[AttackSubtypeEnum["MANUFACTURED"] = 1] = "MANUFACTURED";
+    AttackSubtypeEnum[AttackSubtypeEnum["NATURAL"] = 2] = "NATURAL";
+    AttackSubtypeEnum[AttackSubtypeEnum["UNARMED"] = 3] = "UNARMED";
+})(AttackSubtypeEnum || (AttackSubtypeEnum = {}));
+export const ACTION_CUSTOMIZATION_ADJUSTMENT_TYPES = [
+    AdjustmentTypeEnum.TO_HIT_OVERRIDE,
+    AdjustmentTypeEnum.TO_HIT_BONUS,
+    AdjustmentTypeEnum.FIXED_VALUE_BONUS,
+    AdjustmentTypeEnum.DISPLAY_AS_ATTACK,
+    AdjustmentTypeEnum.NAME_OVERRIDE,
+    AdjustmentTypeEnum.NOTES,
+];
diff --git a/ddb_main/packages/rules-engine/es/engine/Action/derivers.js b/ddb_main/packages/rules-engine/es/engine/Action/derivers.js
new file mode 100644
index 0000000..9d38709
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Action/derivers.js
@@ -0,0 +1,467 @@
+import { TypeScriptUtils } from '../../utils';
+import { AbilityAccessors } from '../Ability';
+import { CharacterDerivers } from '../Character';
+import { ClassAccessors } from '../Class';
+import { AbilityStatEnum, AttackTypeRangeEnum } from '../Core';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { DiceAccessors, DiceDerivers, DiceUtils } from '../Dice';
+import { HelperUtils } from '../Helper';
+import { ModifierAccessors, ModifierDerivers, ModifierValidators } from '../Modifier';
+import { RuleDataAccessors, RuleDataUtils } from '../RuleData';
+import { AdjustmentTypeEnum, ValueUtils, ValueValidators } from '../Value';
+import { getAbilityModifierStatId, getActionTypeId, getAttackRangeId, getAttackSubtypeId, getDamageTypeId, getDataOrigin, getDataOriginType, getDefinitionName, getDefinitionRange, getDice, getDisplayAsAttack, getEntityTypeId, getFixedSaveDc, getFixedToHit, getId, getIsMartialArts, getIsProficienct, getMappingEntityTypeId, getMappingId, getSaveStatId, getSpellRangeType, requiresAttackRoll, } from './accessors';
+import { ACTION_CUSTOMIZATION_ADJUSTMENT_TYPES, ActionTypeEnum, AttackSubtypeEnum } from './constants';
+/**
+ *
+ * @param action
+ */
+export function deriveUniqueKey(action) {
+    return `${getId(action)}-${getEntityTypeId(action)}`;
+}
+/**
+ *
+ * @param action
+ */
+export function deriveRequiresAttackRoll(action) {
+    return getAttackRangeId(action) !== null;
+}
+/**
+ *
+ * @param action
+ */
+export function deriveRequiresSavingThrow(action) {
+    return getSaveStatId(action) !== null;
+}
+/**
+ *
+ * @param action
+ */
+export function deriveIsDefaultDisplayAsAttack(action) {
+    const displayAsAttack = getDisplayAsAttack(action);
+    if (displayAsAttack !== null) {
+        return displayAsAttack;
+    }
+    return deriveRequiresAttackRoll(action);
+}
+/**
+ *
+ * @param action
+ */
+export function deriveAttackSubtypeName(action) {
+    switch (getAttackSubtypeId(action)) {
+        case AttackSubtypeEnum.UNARMED:
+            return 'Unarmed Strike';
+        case AttackSubtypeEnum.NATURAL:
+            return 'Natural Attack';
+    }
+    return null;
+}
+/**
+ *
+ * @param action
+ * @param martialArtsLevelScale
+ */
+export function deriveIsMartialArtsAvailable(action, martialArtsLevelScale) {
+    const isMartialArtsEnabled = getIsMartialArts(action);
+    const attackSubtype = getAttackSubtypeId(action);
+    if (martialArtsLevelScale !== null && (attackSubtype === AttackSubtypeEnum.UNARMED || isMartialArtsEnabled)) {
+        return true;
+    }
+    return false;
+}
+/**
+ *
+ * @param action
+ * @param ruleData
+ */
+export function deriveFallbackAbilityIds(action, ruleData) {
+    const actionType = getActionTypeId(action);
+    const attackTypeRange = getAttackRangeId(action);
+    const availableAbilities = [];
+    if (actionType === ActionTypeEnum.WEAPON) {
+        if (attackTypeRange === AttackTypeRangeEnum.RANGED) {
+            availableAbilities.push(AbilityStatEnum.DEXTERITY);
+        }
+        else {
+            availableAbilities.push(AbilityStatEnum.STRENGTH);
+        }
+    }
+    else {
+        const dataOrigin = getDataOrigin(action);
+        const dataOriginType = getDataOriginType(action);
+        switch (dataOriginType) {
+            case DataOriginTypeEnum.CLASS_FEATURE:
+                const primaryAbilities = ClassAccessors.getPrimaryAbilities(dataOrigin.parent);
+                if (primaryAbilities.length) {
+                    availableAbilities.push(...primaryAbilities);
+                }
+                break;
+        }
+    }
+    return availableAbilities;
+}
+/**
+ *
+ * @param action
+ * @param abilityLookup
+ * @param ruleData
+ */
+export function deriveBestFallbackAbility(action, abilityLookup, ruleData) {
+    const fallbackAbilityIds = deriveFallbackAbilityIds(action, ruleData);
+    const fallbackAbilities = fallbackAbilityIds.map((id) => abilityLookup[id]);
+    return HelperUtils.getLast(fallbackAbilities, 'modifier');
+}
+/**
+ *
+ * @param action
+ * @param martialArtsLevelScale
+ * @param ruleData
+ * @param includeFallbacks
+ */
+export function deriveAvailableAbilities(action, martialArtsLevelScale, ruleData, includeFallbacks = true) {
+    let attackStat = null;
+    if (requiresAttackRoll(action)) {
+        attackStat = getAbilityModifierStatId(action);
+    }
+    const availableAbilities = [];
+    if (attackStat) {
+        availableAbilities.push(attackStat);
+    }
+    else if (includeFallbacks) {
+        availableAbilities.push(...deriveFallbackAbilityIds(action, ruleData));
+    }
+    if (deriveIsMartialArtsAvailable(action, martialArtsLevelScale) &&
+        !availableAbilities.includes(AbilityStatEnum.DEXTERITY)) {
+        availableAbilities.push(AbilityStatEnum.DEXTERITY);
+    }
+    return availableAbilities;
+}
+/**
+ *
+ * @param action
+ * @param abilityLookup
+ * @param proficiencyBonus
+ * @param valueLookup
+ * @param ruleData
+ */
+export function deriveAttackSaveValue(action, abilityLookup, proficiencyBonus, valueLookup, ruleData) {
+    const id = getMappingId(action);
+    const entityId = getMappingEntityTypeId(action);
+    if (getSaveStatId(action) === null) {
+        return null;
+    }
+    const fixedSaveDc = getFixedSaveDc(action);
+    if (fixedSaveDc) {
+        return fixedSaveDc;
+    }
+    const saveDcOverride = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.SAVE_DC_OVERRIDE, id, entityId);
+    if (saveDcOverride !== null) {
+        return saveDcOverride;
+    }
+    let attackSaveAbility = null;
+    const abilityModifierStatId = getAbilityModifierStatId(action);
+    if (abilityModifierStatId) {
+        attackSaveAbility = abilityLookup[abilityModifierStatId];
+    }
+    else {
+        attackSaveAbility = deriveBestFallbackAbility(action, abilityLookup, ruleData);
+    }
+    if (!attackSaveAbility) {
+        return null;
+    }
+    const abilityModifier = AbilityAccessors.getModifier(attackSaveAbility);
+    const attackSaveAbilityModifier = abilityModifier ? abilityModifier : 0;
+    let saveDc = CharacterDerivers.deriveAttackSaveValue(proficiencyBonus, attackSaveAbilityModifier);
+    saveDc += ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.SAVE_DC_BONUS, id, entityId, 0);
+    return saveDc;
+}
+/**
+ *
+ * @param bestAbilityInfo
+ * @param action
+ * @param modifiers
+ * @param abilityLookup
+ * @param valueLookup
+ */
+export function deriveToHit(bestAbilityInfo, action, modifiers, abilityLookup, valueLookup) {
+    const actionType = getActionTypeId(action);
+    let toHit = null;
+    if (bestAbilityInfo && getAttackRangeId(action) !== null) {
+        const id = getMappingId(action);
+        const entityId = getMappingEntityTypeId(action);
+        const toHitOverride = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.TO_HIT_OVERRIDE, id, entityId);
+        if (toHitOverride !== null) {
+            return toHitOverride;
+        }
+        let bonusToHitModifiers = null;
+        let bonusToHitModifierTotal = 0;
+        if (actionType === ActionTypeEnum.SPELL) {
+            bonusToHitModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusActionSpellToHitModifier(modifier, action));
+        }
+        else if (actionType === ActionTypeEnum.WEAPON) {
+            bonusToHitModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusActionWeaponToHitModifier(modifier, action));
+        }
+        if (bonusToHitModifiers !== null) {
+            bonusToHitModifierTotal = ModifierDerivers.sumModifiers(bonusToHitModifiers, abilityLookup);
+        }
+        const toHitCustomBonus = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.TO_HIT_BONUS, id, entityId, 0);
+        toHit = bestAbilityInfo.toHit + bonusToHitModifierTotal + toHitCustomBonus;
+    }
+    const fixedToHit = getFixedToHit(action);
+    if (fixedToHit !== null) {
+        toHit = fixedToHit;
+    }
+    return toHit;
+}
+/**
+ *
+ * @param action
+ * @param baseDamage
+ * @param fixedDamageBonuses
+ * @param valueLookup
+ * @param ruleData
+ */
+export function deriveDamage(action, baseDamage, fixedDamageBonuses, valueLookup, ruleData) {
+    const id = getMappingId(action);
+    const entityId = getMappingEntityTypeId(action);
+    const damageTypeId = getDamageTypeId(action);
+    let type = null;
+    let value = null;
+    let dataOrigin = null;
+    let isMartialArts = false;
+    const damageCustomBonus = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.FIXED_VALUE_BONUS, id, entityId, 0);
+    const fixedDamage = fixedDamageBonuses + damageCustomBonus;
+    if (baseDamage !== null) {
+        if (typeof baseDamage === 'number') {
+            value = Math.max(0, baseDamage + fixedDamage);
+        }
+        else if (baseDamage.isMartialArts !== undefined) {
+            if (baseDamage.dataOrigin) {
+                dataOrigin = baseDamage.dataOrigin;
+            }
+            else if (baseDamage.isMartialArts) {
+                isMartialArts = true;
+            }
+            const fixedValue = DiceAccessors.getFixedValue(baseDamage);
+            value = Object.assign(Object.assign({}, baseDamage), { fixedValue: (fixedValue ? fixedValue : 0) + fixedDamage });
+        }
+    }
+    if (damageTypeId) {
+        type = RuleDataUtils.getDamageType(damageTypeId, ruleData);
+    }
+    return {
+        type,
+        value,
+        dataOrigin,
+        isMartialArts,
+    };
+}
+/**
+ *
+ * @param action
+ * @param valueLookup
+ */
+export function deriveName(action, valueLookup) {
+    const id = getMappingId(action);
+    const entityId = getMappingEntityTypeId(action);
+    let derivedName = getDefinitionName(action);
+    const nameOverride = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.NAME_OVERRIDE, id, entityId);
+    if (nameOverride) {
+        derivedName = nameOverride;
+    }
+    if (derivedName === null) {
+        derivedName = '';
+    }
+    return derivedName;
+}
+/**
+ *
+ * @param action
+ * @param modifiers
+ */
+export function deriveLabel(action, modifiers) {
+    const masteryModifiers = modifiers.filter((modifier) => ModifierValidators.isValidWeaponMasteryModifier(modifier));
+    const masteryModifier = masteryModifiers.find((modifier) => modifier.componentId === action.componentId);
+    if (masteryModifier) {
+        return ModifierAccessors.getFriendlySubtypeName(masteryModifier);
+    }
+    return null;
+}
+/**
+ *
+ * @param action
+ * @param proficiencyBonus
+ */
+export function deriveProficiencyBonus(action, proficiencyBonus) {
+    let bonus = 0;
+    if (getIsProficienct(action)) {
+        bonus = proficiencyBonus;
+    }
+    return bonus;
+}
+/**
+ *
+ * @param action
+ */
+export function deriveProficiency(action) {
+    return getIsProficienct(action);
+}
+/**
+ *
+ * @param action
+ * @param valueLookup
+ */
+export function deriveDisplayAsAttack(action, valueLookup) {
+    const id = getMappingId(action);
+    const entityId = getMappingEntityTypeId(action);
+    const displayAsAttackOverride = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.DISPLAY_AS_ATTACK, id, entityId);
+    if (displayAsAttackOverride !== null) {
+        return displayAsAttackOverride;
+    }
+    return deriveIsDefaultDisplayAsAttack(action);
+}
+/**
+ *
+ * @param action
+ * @param modifiers
+ * @param modifierData
+ * @param ruleData
+ */
+export function deriveReach(action, modifiers, modifierData, ruleData) {
+    let baseReach = null;
+    if (getActionTypeId(action) === ActionTypeEnum.SPELL) {
+        return null;
+    }
+    // Reach is null if it isn't a melee attack
+    if (getAttackRangeId(action) !== AttackTypeRangeEnum.MELEE) {
+        return null;
+    }
+    // Figure out base reach based on initial data
+    const range = getDefinitionRange(action);
+    if (range) {
+        baseReach = range.range;
+    }
+    if (baseReach === null) {
+        baseReach = RuleDataAccessors.getBaseWeaponReach(ruleData);
+    }
+    const bonusReachModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusMeleeReachModifier(modifier));
+    const bonusReachModifierTotal = ModifierDerivers.deriveTotalValue(bonusReachModifiers, modifierData);
+    return baseReach + bonusReachModifierTotal;
+}
+/**
+ *
+ * @param action
+ * @param martialArtsLevelScale
+ * @param modifiers
+ */
+export function deriveHighestDamageDie(action, martialArtsLevelScale, modifiers) {
+    const actionType = getActionTypeId(action);
+    const baseDice = getDice(action);
+    const attackSubtype = getAttackSubtypeId(action);
+    const isMartialArtsAvailable = deriveIsMartialArtsAvailable(action, martialArtsLevelScale);
+    const allDamageDice = [];
+    if (baseDice) {
+        allDamageDice.push(Object.assign(Object.assign({}, baseDice), { isMartialArts: false, dataOrigin: null }));
+    }
+    if (actionType === ActionTypeEnum.WEAPON && attackSubtype === AttackSubtypeEnum.UNARMED) {
+        const setDamageDieModifiers = modifiers.filter((modifier) => ModifierValidators.isSetUnarmedDamageDieModifier(modifier));
+        const setDamageDice = setDamageDieModifiers
+            .map((modifier) => {
+            const modifierDice = ModifierAccessors.getDice(modifier);
+            if (modifierDice === null) {
+                return null;
+            }
+            return Object.assign(Object.assign({}, modifierDice), { isMartialArts: false, dataOrigin: ModifierAccessors.getDataOrigin(modifier) });
+        })
+            .filter(TypeScriptUtils.isNotNullOrUndefined);
+        allDamageDice.push(...setDamageDice);
+    }
+    if (martialArtsLevelScale !== null && isMartialArtsAvailable) {
+        const martialArtsDie = DiceDerivers.deriveMartialArtsDamageDie(martialArtsLevelScale);
+        allDamageDice.push(Object.assign(Object.assign({}, martialArtsDie), { isMartialArts: true, dataOrigin: null }));
+    }
+    return DiceUtils.getHighestDie(allDamageDice);
+}
+/**
+ *
+ * @param bestAbilityInfo
+ * @param action
+ * @param modifiers
+ * @param abilityLookup
+ */
+export function deriveFixedDamageBonuses(bestAbilityInfo, action, modifiers, abilityLookup) {
+    const actionType = getActionTypeId(action);
+    let damageModifiers = [];
+    let damageModifierTotal = 0;
+    if (actionType === ActionTypeEnum.SPELL) {
+        damageModifiers = modifiers.filter((modifier) => ModifierValidators.isValidDamageActionSpellModifier(modifier, action));
+    }
+    else if (actionType === ActionTypeEnum.WEAPON) {
+        damageModifiers = modifiers.filter((modifier) => ModifierValidators.isValidDamageActionWeaponModifier(modifier, action));
+    }
+    if (damageModifiers.length) {
+        damageModifierTotal = ModifierDerivers.sumModifiers(damageModifiers, abilityLookup);
+    }
+    return damageModifierTotal + (bestAbilityInfo ? bestAbilityInfo.damageBonus : 0);
+}
+/**
+ *
+ * @param action
+ * @param modifiers
+ * @param abilityLookup
+ */
+export function deriveRange(action, modifiers, abilityLookup) {
+    const actionType = getActionTypeId(action);
+    const definitionRange = getDefinitionRange(action);
+    if (definitionRange === null) {
+        return definitionRange;
+    }
+    let range = Object.assign(Object.assign({}, definitionRange), { origin: null });
+    if (actionType === ActionTypeEnum.SPELL) {
+        const attackTypeRange = getAttackRangeId(action);
+        let newRange = definitionRange.range;
+        if (attackTypeRange !== null && newRange) {
+            const spellAttackRangeMultiplierModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusSpellAttackRangeMultiplierModifier(modifier));
+            const spellAttackRangeMultiplierTotal = Math.max(1, ModifierDerivers.sumModifiers(spellAttackRangeMultiplierModifiers, abilityLookup, 1));
+            newRange *= spellAttackRangeMultiplierTotal;
+        }
+        range = Object.assign(Object.assign({}, definitionRange), { range: newRange, origin: getSpellRangeType(action) });
+    }
+    return range;
+}
+/**
+ *
+ * @param action
+ * @param valueLookup
+ */
+export function deriveIsOffhand(action, valueLookup) {
+    let isOffhand = false;
+    if (getActionTypeId(action) === ActionTypeEnum.WEAPON) {
+        const id = getMappingId(action);
+        const entityId = getMappingEntityTypeId(action);
+        isOffhand = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.IS_OFFHAND, id, entityId, false);
+    }
+    return isOffhand;
+}
+/**
+ *
+ * @param action
+ * @param valueLookup
+ */
+export function deriveIsSilvered(action, valueLookup) {
+    let isSilvered = false;
+    if (getActionTypeId(action) === ActionTypeEnum.WEAPON) {
+        const id = getMappingId(action);
+        const entityId = getMappingEntityTypeId(action);
+        isSilvered = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.IS_SILVER, id, entityId, false);
+    }
+    return isSilvered;
+}
+/**
+ *
+ * @param action
+ * @param valueLookup
+ */
+export function deriveIsCustomized(action, valueLookup) {
+    return ValueValidators.validateHasCustomization(ACTION_CUSTOMIZATION_ADJUSTMENT_TYPES, valueLookup, getMappingId(action), getMappingEntityTypeId(action));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Action/generators.js b/ddb_main/packages/rules-engine/es/engine/Action/generators.js
new file mode 100644
index 0000000..cd3f8b9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Action/generators.js
@@ -0,0 +1,237 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { groupBy, keyBy } from 'lodash';
+import { CharacterDerivers } from '../Character';
+import { ClassAccessors } from '../Class';
+import { DataOriginGenerators, DataOriginTypeEnum } from '../DataOrigin';
+import { FeatAccessors } from '../Feat';
+import { HelperUtils } from '../Helper';
+import { ItemAccessors } from '../Item';
+import { OptionAccessors } from '../Option';
+import { RaceAccessors } from '../Race';
+import { RuleDataAccessors } from '../RuleData';
+import { AdjustmentTypeEnum, ValueUtils } from '../Value';
+import { getActionTypeId, getDisplayAsAttack, getFixedValue, getUniqueKey } from './accessors';
+import { ActionTypeEnum } from './constants';
+import { deriveAttackSaveValue, deriveAttackSubtypeName, deriveAvailableAbilities, deriveDamage, deriveDisplayAsAttack, deriveFixedDamageBonuses, deriveHighestDamageDie, deriveIsCustomized, deriveIsDefaultDisplayAsAttack, deriveIsOffhand, deriveIsSilvered, deriveName, deriveProficiency, deriveProficiencyBonus, deriveRange, deriveReach, deriveRequiresAttackRoll, deriveRequiresSavingThrow, deriveToHit, deriveUniqueKey, } from './derivers';
+/**
+ *
+ * @param action
+ */
+export function generateDataOriginKey(action) {
+    return DataOriginGenerators.generateDataOriginKey(action.componentId, action.componentTypeId);
+}
+/**
+ *
+ * @param id
+ * @param entityTypeId
+ * @param actionLookup
+ * @param valueLookup
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ */
+export function generateBaseActions(id, entityTypeId, actionLookup, valueLookup, dataOriginType, primary, parent = null) {
+    const actions = HelperUtils.lookupDataOrFallback(actionLookup, DataOriginGenerators.generateDataOriginKey(id, entityTypeId));
+    if (!actions) {
+        return [];
+    }
+    return actions.map((action) => generateDataOriginBaseAction(action, valueLookup, dataOriginType, primary, parent));
+}
+/**
+ *
+ * @param action
+ * @param valueLookup
+ */
+export function generateBaseAction(action, valueLookup) {
+    const { componentId, componentTypeId, displayAsAttack, entityTypeId, id, limitedUse, name } = action, definitionProps = __rest(action, ["componentId", "componentTypeId", "displayAsAttack", "entityTypeId", "id", "limitedUse", "name"]);
+    const simulatedAction = {
+        definition: Object.assign(Object.assign({}, definitionProps), { displayAsAttack,
+            name }),
+        componentId,
+        componentTypeId,
+        entityTypeId,
+        id,
+        limitedUse,
+    };
+    return Object.assign(Object.assign({}, simulatedAction), { displayAsAttack: deriveDisplayAsAttack(simulatedAction, valueLookup), name: deriveName(simulatedAction, valueLookup), notes: ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.NOTES, id, entityTypeId), originalContract: action, proficiency: deriveProficiency(simulatedAction), requiresAttackRoll: deriveRequiresAttackRoll(simulatedAction), requiresSavingThrow: deriveRequiresSavingThrow(simulatedAction), isDefaultDisplayAsAttack: deriveIsDefaultDisplayAsAttack(simulatedAction), uniqueKey: deriveUniqueKey(simulatedAction) });
+}
+/**
+ *
+ * @param actions
+ * @param valueLookup
+ * @param type
+ * @param primary
+ * @param parent
+ */
+export function generateDataOriginBaseActions(actions, valueLookup, type, primary = null, parent = null) {
+    return actions.map((action) => generateDataOriginBaseAction(action, valueLookup, type, primary, parent));
+}
+/**
+ *
+ * @param action
+ * @param valueLookup
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ */
+export function generateDataOriginBaseAction(action, valueLookup, dataOriginType, primary, parent) {
+    const dataOrigin = DataOriginGenerators.generateDataOrigin(dataOriginType, primary, parent);
+    return Object.assign(Object.assign({}, generateBaseAction(action, valueLookup)), { dataOrigin });
+}
+/**
+ *
+ * @param action
+ * @param valueLookup
+ */
+export function generateInnateNaturalDataOriginBaseAction(action, valueLookup) {
+    return generateDataOriginBaseAction(action, valueLookup, DataOriginTypeEnum.RULE_DATA, null, null);
+}
+/**
+ *
+ * @param baseAction
+ * @param proficiencyBonus
+ * @param abilityLookup
+ * @param modifiers
+ * @param valueLookup
+ * @param martialArtsLevelScale
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateAction(baseAction, proficiencyBonus, abilityLookup, modifiers, valueLookup, martialArtsLevelScale, ruleData, modifierData) {
+    const actionType = getActionTypeId(baseAction);
+    const fixedValue = getFixedValue(baseAction);
+    const highestDamageDie = deriveHighestDamageDie(baseAction, martialArtsLevelScale, modifiers);
+    const includeFallback = actionType !== ActionTypeEnum.GENERAL;
+    const availableAbilities = deriveAvailableAbilities(baseAction, martialArtsLevelScale, ruleData, includeFallback);
+    const attackProficiencyBonus = deriveProficiencyBonus(baseAction, proficiencyBonus);
+    const abilityPossibilities = CharacterDerivers.deriveAttackAbilityPossibilities(availableAbilities, modifiers, attackProficiencyBonus, abilityLookup);
+    const bestAbilityInfo = HelperUtils.getLast(abilityPossibilities, ['toHit', 'modifier']);
+    const fixedDamageBonuses = deriveFixedDamageBonuses(bestAbilityInfo, baseAction, modifiers, abilityLookup);
+    const damage = deriveDamage(baseAction, highestDamageDie ? highestDamageDie : fixedValue, fixedDamageBonuses, valueLookup, ruleData);
+    return Object.assign(Object.assign({}, baseAction), { attackSaveValue: deriveAttackSaveValue(baseAction, abilityLookup, proficiencyBonus, valueLookup, ruleData), attackSubtypeName: deriveAttackSubtypeName(baseAction), damage, range: deriveRange(baseAction, modifiers, abilityLookup), reach: deriveReach(baseAction, modifiers, modifierData, ruleData), statId: bestAbilityInfo ? bestAbilityInfo.abilityId : null, toHit: deriveToHit(bestAbilityInfo, baseAction, modifiers, abilityLookup, valueLookup), isOffhand: deriveIsOffhand(baseAction, valueLookup), isSilvered: deriveIsSilvered(baseAction, valueLookup), isCustomized: deriveIsCustomized(baseAction, valueLookup) });
+}
+/**
+ *
+ * @param actions
+ */
+export function generateActionComponentLookup(actions) {
+    return groupBy(actions, (action) => generateDataOriginKey(action));
+}
+/**
+ *
+ * @param actions
+ */
+export function generateActionLookup(actions) {
+    return keyBy(actions, (action) => getUniqueKey(action));
+}
+/**
+ *
+ * @param feats
+ * @param race
+ * @param classes
+ * @param innateNaturalActions
+ * @param inventory
+ * @param proficiencyBonus
+ * @param abilityLookup
+ * @param modifiers
+ * @param martialArtsLevel
+ * @param ruleData
+ * @param modifierData
+ * @param valueLookup
+ */
+export function generateAggregatedActions(feats, race, classes, innateNaturalActions, inventory, proficiencyBonus, abilityLookup, modifiers, martialArtsLevelScale, ruleData, modifierData, valueLookup) {
+    const actions = [];
+    actions.push(...innateNaturalActions);
+    if (race) {
+        actions.push(...RaceAccessors.getActions(race));
+    }
+    classes.forEach((charClass) => {
+        actions.push(...ClassAccessors.getActions(charClass));
+    });
+    feats.forEach((feat) => {
+        actions.push(...FeatAccessors.getActions(feat));
+        FeatAccessors.getOptions(feat).forEach((option) => {
+            actions.push(...OptionAccessors.getActions(option));
+        });
+    });
+    inventory.forEach((item) => {
+        actions.push(...ItemAccessors.getInfusionActions(item));
+    });
+    return actions.map((baseAction) => generateAction(baseAction, proficiencyBonus, abilityLookup, modifiers, valueLookup, martialArtsLevelScale, ruleData, modifierData));
+}
+/**
+ *
+ * @param customActions
+ * @param proficiencyBonus
+ * @param abilityLookup
+ * @param valueLookup
+ * @param modifiers
+ * @param martialArtsLevel
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateCustomActions(customActions, proficiencyBonus, abilityLookup, valueLookup, modifiers, martialArtsLevelScale, ruleData, modifierData) {
+    return customActions.map((customAction) => generateCustomAction(customAction, proficiencyBonus, abilityLookup, valueLookup, modifiers, martialArtsLevelScale, ruleData, modifierData));
+}
+/**
+ *
+ * @param customAction
+ * @param proficiencyBonus
+ * @param abilityLookup
+ * @param valueLookup
+ * @param modifiers
+ * @param martialArtsLevelScale
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateCustomAction(customAction, proficiencyBonus, abilityLookup, valueLookup, modifiers, martialArtsLevelScale, ruleData, modifierData) {
+    const { aoeSize, aoeType, longRange, range, activationTime, activationType, diceCount, diceType, fixedValue, rangeId, statId, displayAsAttack, id, isSilvered, isOffhand } = customAction, similarActionProps = __rest(customAction, ["aoeSize", "aoeType", "longRange", "range", "activationTime", "activationType", "diceCount", "diceType", "fixedValue", "rangeId", "statId", "displayAsAttack", "id", "isSilvered", "isOffhand"]);
+    let dice = null;
+    let value = null;
+    if (diceType) {
+        dice = {
+            diceCount: diceCount ? diceCount : 1,
+            diceValue: diceType,
+            fixedValue,
+            diceMultiplier: null,
+            diceString: null,
+        };
+    }
+    else {
+        value = fixedValue;
+    }
+    const actionLike = Object.assign(Object.assign({}, similarActionProps), { id, range: {
+            range,
+            longRange,
+            aoeSize,
+            aoeType,
+            minimumRange: null,
+            hasAoeSpecialDescription: false, // default
+        }, activation: {
+            activationType,
+            activationTime,
+        }, abilityModifierStatId: statId, attackTypeRange: rangeId, dice,
+        value, limitedUse: null, displayAsAttack: null, componentId: -1, componentTypeId: -1, fixedToHit: null, numberOfTargets: null, ammunition: null });
+    const dataOriginBaseAction = generateDataOriginBaseAction(actionLike, valueLookup, DataOriginTypeEnum.CUSTOM, null, null);
+    const generatedAction = generateAction(dataOriginBaseAction, proficiencyBonus, abilityLookup, modifiers, valueLookup, martialArtsLevelScale, ruleData, modifierData);
+    const generatedDisplayAsAttack = getDisplayAsAttack(generatedAction);
+    return Object.assign(Object.assign({}, generatedAction), { displayAsAttack: displayAsAttack === null ? (generatedDisplayAsAttack ? generatedDisplayAsAttack : false) : displayAsAttack, isSilvered, isOffhand: isOffhand === null ? false : isOffhand });
+}
+/**
+ *
+ * @param ruleData
+ * @param valueLookup
+ */
+export function generateInnateBaseActions(ruleData, valueLookup) {
+    return RuleDataAccessors.getNaturalActions(ruleData).map((action) => generateInnateNaturalDataOriginBaseAction(action, valueLookup));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Action/index.js b/ddb_main/packages/rules-engine/es/engine/Action/index.js
new file mode 100644
index 0000000..9155958
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Action/index.js
@@ -0,0 +1,11 @@
+import * as ActionAccessors from './accessors';
+import * as ActionConstants from './constants';
+import * as ActionDerivers from './derivers';
+import * as ActionGenerators from './generators';
+import * as ActionNotes from './notes';
+import * as ActionTypings from './typings';
+import * as ActionValidators from './validators';
+export * from './typings';
+export * from './constants';
+export { ActionAccessors, ActionDerivers, ActionValidators, ActionGenerators, ActionNotes };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, ActionAccessors), ActionConstants), ActionDerivers), ActionValidators), ActionGenerators), ActionNotes), ActionTypings);
diff --git a/ddb_main/packages/rules-engine/es/engine/Action/notes.js b/ddb_main/packages/rules-engine/es/engine/Action/notes.js
new file mode 100644
index 0000000..835cafd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Action/notes.js
@@ -0,0 +1,56 @@
+import { TypeScriptUtils } from '../../utils';
+import { LimitedUseAccessors, LimitedUseDerivers, LimitedUseRenderers } from '../LimitedUse';
+import { NoteGenerators } from '../Note';
+import { RuleDataUtils } from '../RuleData';
+import { getLimitedUse, getNotes } from './accessors';
+/**
+ *
+ * @param action
+ */
+function getUserNoteComponent(action) {
+    const notes = getNotes(action);
+    if (notes) {
+        return NoteGenerators.createPlainText(notes);
+    }
+    return null;
+}
+/**
+ *
+ * @param action
+ * @param ruleData
+ * @param abilityLookup
+ * @param proficiencyBonus
+ */
+function getLimitedUseNoteComponent(action, ruleData, abilityLookup, proficiencyBonus) {
+    const limitedUse = getLimitedUse(action);
+    if (!limitedUse) {
+        return null;
+    }
+    const numberConsumed = LimitedUseAccessors.getMinNumberConsumed(limitedUse);
+    const maxUses = LimitedUseDerivers.deriveMaxUses(limitedUse, abilityLookup, ruleData, proficiencyBonus);
+    const numberUsed = LimitedUseAccessors.getNumberUsed(limitedUse);
+    const numberRemaining = maxUses - numberUsed;
+    if (maxUses === 1) {
+        const resetType = LimitedUseAccessors.getResetType(limitedUse);
+        const resetTypeAbbr = LimitedUseRenderers.renderLimitedUseResetAbbreviation(resetType);
+        const isUsed = numberUsed === 1;
+        const limitedUseResetTypeName = resetType === null ? '' : RuleDataUtils.getLimitedUseResetTypeName(resetType, ruleData);
+        return NoteGenerators.createTooltip(`1/${resetTypeAbbr}${isUsed ? ' (Used)' : ''}`, `Once per ${limitedUseResetTypeName}${isUsed ? ' (Used)' : ''}`, {
+            dynamicTitle: true,
+        });
+    }
+    return NoteGenerators.createPlainText(`${numberConsumed} Use${numberConsumed !== 1 ? 's' : ''} (${numberRemaining}/${maxUses})`);
+}
+/**
+ *
+ * @param action
+ * @param ruleData
+ * @param abilityLookup
+ * @param proficiencyBonus
+ */
+export function getNoteComponents(action, ruleData, abilityLookup, proficiencyBonus) {
+    const notes = [];
+    notes.push(getLimitedUseNoteComponent(action, ruleData, abilityLookup, proficiencyBonus));
+    notes.push(getUserNoteComponent(action));
+    return notes.filter(TypeScriptUtils.isNotNullOrUndefined);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Action/validators.js b/ddb_main/packages/rules-engine/es/engine/Action/validators.js
new file mode 100644
index 0000000..53d698e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Action/validators.js
@@ -0,0 +1,14 @@
+import { ActivationAccessors } from '../Activation';
+import { getActivation } from './accessors';
+/**
+ *
+ * @param action
+ * @param activationType
+ */
+export function validateIsActivationType(action, activationType) {
+    const activation = getActivation(action);
+    if (activation === null) {
+        return false;
+    }
+    return activationType === ActivationAccessors.getType(activation);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Activation/accessors.js b/ddb_main/packages/rules-engine/es/engine/Activation/accessors.js
new file mode 100644
index 0000000..4f953d1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Activation/accessors.js
@@ -0,0 +1,16 @@
+/**
+ *
+ * @param activation
+ */
+export function getTime(activation) {
+    var _a;
+    return (_a = activation === null || activation === void 0 ? void 0 : activation.activationTime) !== null && _a !== void 0 ? _a : null;
+}
+/**
+ *
+ * @param activation
+ */
+export function getType(activation) {
+    var _a;
+    return (_a = activation === null || activation === void 0 ? void 0 : activation.activationType) !== null && _a !== void 0 ? _a : null;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Activation/constants.js b/ddb_main/packages/rules-engine/es/engine/Activation/constants.js
new file mode 100644
index 0000000..d7c0de2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Activation/constants.js
@@ -0,0 +1,10 @@
+export var ActivationTypeEnum;
+(function (ActivationTypeEnum) {
+    ActivationTypeEnum[ActivationTypeEnum["ACTION"] = 1] = "ACTION";
+    ActivationTypeEnum[ActivationTypeEnum["NO_ACTION"] = 2] = "NO_ACTION";
+    ActivationTypeEnum[ActivationTypeEnum["BONUS_ACTION"] = 3] = "BONUS_ACTION";
+    ActivationTypeEnum[ActivationTypeEnum["REACTION"] = 4] = "REACTION";
+    ActivationTypeEnum[ActivationTypeEnum["MINUTE"] = 6] = "MINUTE";
+    ActivationTypeEnum[ActivationTypeEnum["HOUR"] = 7] = "HOUR";
+    ActivationTypeEnum[ActivationTypeEnum["SPECIAL"] = 8] = "SPECIAL";
+})(ActivationTypeEnum || (ActivationTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Activation/index.js b/ddb_main/packages/rules-engine/es/engine/Activation/index.js
new file mode 100644
index 0000000..02bfd5f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Activation/index.js
@@ -0,0 +1,6 @@
+import * as ActivationAccessors from './accessors';
+import * as ActivationConstants from './constants';
+import * as ActivationRenderers from './renderers';
+export * from './constants';
+export { ActivationAccessors, ActivationRenderers };
+export default Object.assign(Object.assign(Object.assign({}, ActivationAccessors), ActivationConstants), ActivationRenderers);
diff --git a/ddb_main/packages/rules-engine/es/engine/Activation/renderers.js b/ddb_main/packages/rules-engine/es/engine/Activation/renderers.js
new file mode 100644
index 0000000..f51380d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Activation/renderers.js
@@ -0,0 +1,131 @@
+import { FormatUtils } from '../Format';
+import { RuleDataUtils } from '../RuleData';
+import { getTime, getType } from './accessors';
+import { ActivationTypeEnum } from './constants';
+/**
+ *
+ * @param time
+ * @param type
+ */
+export function renderActivationPluralSuffix(time, type) {
+    let pluralSuffix = '';
+    if (time !== null && time !== 1) {
+        switch (type) {
+            case ActivationTypeEnum.REACTION:
+            case ActivationTypeEnum.ACTION:
+            case ActivationTypeEnum.HOUR:
+            case ActivationTypeEnum.MINUTE:
+            case ActivationTypeEnum.BONUS_ACTION:
+                pluralSuffix = 's';
+                break;
+            default:
+            // not implemented
+        }
+    }
+    return pluralSuffix;
+}
+/**
+ *
+ * @param activation
+ * @param ruleData
+ * @param defaultTime
+ */
+export function renderActivation(activation, ruleData, defaultTime = 1) {
+    const activationTime = getTime(activation);
+    const activationType = getType(activation);
+    if (!activationType) {
+        return '';
+    }
+    const activationTypeInfo = RuleDataUtils.getActivationTypeInfo(activationType, ruleData);
+    const activationTypeName = activationTypeInfo ? activationTypeInfo.name : '';
+    let time = activationTime === null ? defaultTime : activationTime;
+    if (activationType === ActivationTypeEnum.SPECIAL || activationType === ActivationTypeEnum.NO_ACTION) {
+        time = null;
+    }
+    return `${time ? `${time} ` : ''}${activationTypeName}${renderActivationPluralSuffix(time, activationType)}`;
+}
+/**
+ *
+ * @param activation
+ * @param additionalTime
+ * @param ruleData
+ */
+export function renderCastingTime(activation, additionalTime, ruleData) {
+    const activationTime = getTime(activation);
+    const activationType = getType(activation);
+    let activationTypeInfo = null;
+    if (activationType) {
+        activationTypeInfo = RuleDataUtils.getActivationTypeInfo(activationType, ruleData);
+    }
+    additionalTime = additionalTime ? additionalTime : 0;
+    let castingTimeString = '';
+    if (activationTime && activationTypeInfo) {
+        if (additionalTime > 0) {
+            if (activationType === ActivationTypeEnum.MINUTE) {
+                const totalTime = activationTime + additionalTime;
+                castingTimeString = `${totalTime} Minute${totalTime !== 1 ? 's' : ''}`;
+            }
+            else {
+                castingTimeString = `${activationTime} ${activationTypeInfo.name} + ${additionalTime} Minute${additionalTime !== 1 ? 's' : ''}`;
+            }
+        }
+        else {
+            castingTimeString = `${activationTime} ${activationTypeInfo.name}${renderActivationPluralSuffix(activationTime, activationType)}`;
+        }
+    }
+    else if (activationTypeInfo) {
+        castingTimeString = activationTypeInfo.name ? activationTypeInfo.name : '';
+    }
+    return FormatUtils.upperCaseFirstLetterOnly(castingTimeString);
+}
+/**
+ *
+ * @param activation
+ * @param additionalTime
+ */
+export function renderCastingTimeAbbreviation(activation, additionalTime = 0) {
+    const activationTime = getTime(activation);
+    const activationType = getType(activation);
+    let castingTimeString = '';
+    if (activationTime) {
+        if (additionalTime > 0) {
+            if (activationType === ActivationTypeEnum.MINUTE) {
+                const totalTime = activationTime + additionalTime;
+                castingTimeString = `${totalTime}${renderActivationAbbreviation(ActivationTypeEnum.MINUTE)}`;
+            }
+            else {
+                castingTimeString = `${activationTime}${renderActivationAbbreviation(activationType)} + ${additionalTime}${renderActivationAbbreviation(ActivationTypeEnum.MINUTE)}`;
+            }
+        }
+        else {
+            castingTimeString = `${activationTime}${renderActivationAbbreviation(activationType)}`;
+        }
+    }
+    else {
+        castingTimeString = renderActivationAbbreviation(activationType);
+    }
+    return castingTimeString;
+}
+/**
+ * Gets the abbreviation for the specified activation type
+ * @param activationType The activation type to abbreviate
+ */
+export function renderActivationAbbreviation(activationType) {
+    switch (activationType) {
+        case ActivationTypeEnum.BONUS_ACTION:
+            return 'BA';
+        case ActivationTypeEnum.ACTION:
+            return 'A';
+        case ActivationTypeEnum.REACTION:
+            return 'R';
+        case ActivationTypeEnum.SPECIAL:
+            return 'S';
+        case ActivationTypeEnum.HOUR:
+            return 'h';
+        case ActivationTypeEnum.MINUTE:
+            return 'm';
+        default:
+        // not implemented
+    }
+    return '';
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Background/accessors.js b/ddb_main/packages/rules-engine/es/engine/Background/accessors.js
new file mode 100644
index 0000000..06b6b06
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Background/accessors.js
@@ -0,0 +1,452 @@
+/**
+ *
+ * @param background
+ */
+export function getDefinitionAvatarUrl(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.avatarUrl) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getAvatarUrl(background) {
+    return getDefinitionAvatarUrl(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionBonds(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.bonds) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param background
+ */
+export function getBonds(background) {
+    return getDefinitionBonds(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionContractsDescription(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.contractsDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getContractsDescription(background) {
+    return getDefinitionContractsDescription(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionDescription(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getDescription(background) {
+    return getDefinitionDescription(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getEntityTypeId(background) {
+    return getDefinitionEntityTypeId(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionEntityTypeId(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.entityTypeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionEquipmentDescription(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.equipmentDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getEquipmentDescription(background) {
+    return getDefinitionEquipmentDescription(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionFeatureDescription(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.featureDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getFeatureDescription(background) {
+    return getDefinitionFeatureDescription(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionFeatureName(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.featureName) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getFeatureName(background) {
+    return getDefinitionFeatureName(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionFlaws(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.flaws) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param background
+ */
+export function getFlaws(background) {
+    return getDefinitionFlaws(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getId(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionIdeals(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.ideals) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param background
+ */
+export function getIdeals(background) {
+    return getDefinitionIdeals(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionLanguagesDescription(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.languagesDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getLanguagesDescription(background) {
+    return getDefinitionLanguagesDescription(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionLargeAvatarUrl(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.largeAvatarUrl) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getLargeAvatarUrl(background) {
+    return getDefinitionLargeAvatarUrl(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getName(background) {
+    return getDefinitionName(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionName(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionOrganization(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.organization) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getOrganization(background) {
+    return getDefinitionOrganization(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionPersonalityTraits(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.personalityTraits) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param background
+ */
+export function getPersonalityTraits(background) {
+    return getDefinitionPersonalityTraits(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionShortDescription(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.shortDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getShortDescription(background) {
+    return getDefinitionShortDescription(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionSkillProficienciesDescription(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.skillProficienciesDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getSkillProficienciesDescription(background) {
+    return getDefinitionSkillProficienciesDescription(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionSnippet(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.snippet) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getSnippet(background) {
+    return getDefinitionSnippet(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionSpellsPostDescription(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.spellsPostDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getSpellsPostDescription(background) {
+    return getDefinitionSpellsPostDescription(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionSpellsPreDescription(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.spellsPreDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getSpellsPreDescription(background) {
+    return getDefinitionSpellsPreDescription(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionSuggestedCharacteristicsDescription(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.suggestedCharacteristicsDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getSuggestedCharacteristicsDescription(background) {
+    return getDefinitionSuggestedCharacteristicsDescription(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionSuggestedLanguages(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.suggestedLanguages) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param background
+ */
+export function getSuggestedLanguages(background) {
+    return getDefinitionSuggestedLanguages(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionSuggestedProficiencies(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.suggestedProficiencies) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param background
+ */
+export function getSuggestedProficiencies(background) {
+    return getDefinitionSuggestedProficiencies(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionToolProficienciesDescription(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.toolProficienciesDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param background
+ */
+export function getToolProficienciesDescription(background) {
+    return getDefinitionToolProficienciesDescription(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionSources(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.sources) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param background
+ */
+export function getSources(background) {
+    return getDefinitionSources(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionIsHomebrew(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.isHomebrew) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param background
+ */
+export function isHomebrew(background) {
+    return getDefinitionIsHomebrew(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionSpellListIds(background) {
+    var _a, _b;
+    return (_b = (_a = background.definition) === null || _a === void 0 ? void 0 : _a.spellListIds) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param background
+ */
+export function getSpellListIds(background) {
+    return getDefinitionSpellListIds(background);
+}
+/**
+ *
+ * @param background
+ */
+export function getCustomBackground(background) {
+    return background.customBackground;
+}
+/**
+ *
+ * @param background
+ */
+export function getDefinitionId(background) {
+    return background.definitionId;
+}
+/**
+ *
+ * @param background
+ */
+export function getHasCustomBackground(background) {
+    return background.hasCustomBackground;
+}
+/**
+ *
+ * @param background
+ */
+export function getChoices(background) {
+    return background.choices;
+}
+/**
+ *
+ * @param background
+ */
+export function getModifiers(background) {
+    return background.modifiers;
+}
+export function getFeatListContracts(contract) {
+    var _a, _b;
+    return (_b = (_a = contract === null || contract === void 0 ? void 0 : contract.definition) === null || _a === void 0 ? void 0 : _a.grantedFeats) !== null && _b !== void 0 ? _b : [];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Background/constants.js b/ddb_main/packages/rules-engine/es/engine/Background/constants.js
new file mode 100644
index 0000000..818126b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Background/constants.js
@@ -0,0 +1,6 @@
+export var BackgroundModifierTypeEnum;
+(function (BackgroundModifierTypeEnum) {
+    BackgroundModifierTypeEnum[BackgroundModifierTypeEnum["TWO_TOOLS"] = 1] = "TWO_TOOLS";
+    BackgroundModifierTypeEnum[BackgroundModifierTypeEnum["TWO_LANGUAGES"] = 2] = "TWO_LANGUAGES";
+    BackgroundModifierTypeEnum[BackgroundModifierTypeEnum["ONE_TOOL_ONE_LANGUAGE"] = 3] = "ONE_TOOL_ONE_LANGUAGE";
+})(BackgroundModifierTypeEnum || (BackgroundModifierTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Background/derivers.js b/ddb_main/packages/rules-engine/es/engine/Background/derivers.js
new file mode 100644
index 0000000..66d17a0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Background/derivers.js
@@ -0,0 +1,8 @@
+import { getEntityTypeId, getId } from './accessors';
+/**
+ *
+ * @param background
+ */
+export function deriveUniqueKey(background) {
+    return [getId(background), getEntityTypeId(background)].join('-');
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Background/generators.js b/ddb_main/packages/rules-engine/es/engine/Background/generators.js
new file mode 100644
index 0000000..2978334
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Background/generators.js
@@ -0,0 +1,116 @@
+import { ChoiceGenerators } from '../Choice';
+import { DataOriginDataInfoKeyEnum, DataOriginTypeEnum } from '../DataOrigin';
+import { FeatList } from '../FeatList';
+import { ModifierGenerators } from '../Modifier';
+import { getCustomBackground, getEntityTypeId, getHasCustomBackground, getId, getModifiers, getSpellListIds, } from './accessors';
+import { deriveUniqueKey } from './derivers';
+/**
+ *
+ * @param background
+ * @param modifierLookup
+ * @param choiceLookup
+ * @param choiceComponents
+ * @param baseFeats
+ */
+export function generateBackground(background, modifierLookup, choiceLookup, choiceComponents, baseFeats) {
+    var _a, _b;
+    if (!background || (background && !getHasCustomBackground(background) && background.definition === null)) {
+        return null;
+    }
+    let backgroundInfo;
+    if (getHasCustomBackground(background) && background.customBackground) {
+        const { featuresBackground, characteristicsBackground, name, description, id, entityTypeId } = background.customBackground;
+        let featureName = '';
+        let featureDescription = '';
+        if (featuresBackground) {
+            featureName = featuresBackground.featureName ? featuresBackground.featureName : '';
+            featureDescription = featuresBackground.featureDescription ? featuresBackground.featureDescription : '';
+        }
+        let bonds = [];
+        let flaws = [];
+        let ideals = [];
+        let personalityTraits = [];
+        if (characteristicsBackground) {
+            bonds = characteristicsBackground.bonds === null ? [] : characteristicsBackground.bonds;
+            flaws = characteristicsBackground.flaws === null ? [] : characteristicsBackground.flaws;
+            ideals = characteristicsBackground.ideals === null ? [] : characteristicsBackground.ideals;
+            personalityTraits =
+                characteristicsBackground.personalityTraits === null ? [] : characteristicsBackground.personalityTraits;
+        }
+        backgroundInfo = {
+            hasCustomBackground: getHasCustomBackground(background),
+            customBackground: getCustomBackground(background),
+            definitionId: id,
+            definition: {
+                avatarUrl: '',
+                largeAvatarUrl: '',
+                organization: null,
+                snippet: '',
+                contractsDescription: null,
+                equipmentDescription: '',
+                languagesDescription: '',
+                skillProficienciesDescription: '',
+                spellsPreDescription: null,
+                spellsPostDescription: null,
+                toolProficienciesDescription: '',
+                suggestedCharacteristicsDescription: '',
+                suggestedLanguages: [],
+                suggestedProficiencies: [],
+                id,
+                entityTypeId,
+                name,
+                description,
+                shortDescription: description,
+                featureName,
+                featureDescription,
+                bonds,
+                flaws,
+                ideals,
+                personalityTraits,
+                isHomebrew: false,
+                sources: [],
+                spellListIds: [],
+                grantedFeats: [],
+            },
+        };
+    }
+    else {
+        backgroundInfo = background;
+    }
+    const backgroundId = getId(backgroundInfo);
+    const backgroundTypeId = getEntityTypeId(backgroundInfo);
+    const choices = ChoiceGenerators.generateBaseChoices(backgroundId, backgroundTypeId, choiceLookup, DataOriginTypeEnum.BACKGROUND, backgroundInfo);
+    const modifiers = ModifierGenerators.generateModifiers(backgroundId, backgroundTypeId, modifierLookup, DataOriginTypeEnum.BACKGROUND, backgroundInfo);
+    const featLists = ((_b = (_a = backgroundInfo.definition) === null || _a === void 0 ? void 0 : _a.grantedFeats) === null || _b === void 0 ? void 0 : _b.map((featListContract) => new FeatList(featListContract, choiceComponents.definitionKeyNameMap, baseFeats))) || [];
+    return Object.assign(Object.assign({}, backgroundInfo), { choices,
+        modifiers,
+        featLists });
+}
+/**
+ *
+ * @param background
+ */
+export function generateBackgroundModifiers(background) {
+    return background ? getModifiers(background) : [];
+}
+/**
+ *
+ * @param background
+ */
+export function generateRefBackgroundData(background) {
+    let data = {};
+    if (background !== null) {
+        data[deriveUniqueKey(background)] = {
+            [DataOriginDataInfoKeyEnum.PRIMARY]: background,
+            [DataOriginDataInfoKeyEnum.PARENT]: null,
+        };
+    }
+    return data;
+}
+/**
+ *
+ * @param background
+ */
+export function generateGlobalSpellListIds(background) {
+    return background ? getSpellListIds(background) : [];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Background/index.js b/ddb_main/packages/rules-engine/es/engine/Background/index.js
new file mode 100644
index 0000000..0a7a112
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Background/index.js
@@ -0,0 +1,9 @@
+import * as BackgroundAccessors from './accessors';
+import * as BackgroundConstants from './constants';
+import * as BackgroundDerivers from './derivers';
+import * as BackgroundGenerators from './generators';
+import * as BackgroundTypings from './typings';
+export * from './typings';
+export * from './constants';
+export { BackgroundAccessors, BackgroundDerivers, BackgroundGenerators };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, BackgroundAccessors), BackgroundConstants), BackgroundDerivers), BackgroundGenerators), BackgroundTypings);
diff --git a/ddb_main/packages/rules-engine/es/engine/Campaign/accessors.js b/ddb_main/packages/rules-engine/es/engine/Campaign/accessors.js
new file mode 100644
index 0000000..ac6a221
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Campaign/accessors.js
@@ -0,0 +1,105 @@
+import { PartyInventorySharingStateEnum } from './constants';
+/**
+ *
+ * @param campaign
+ * @deprecated Use the new getCharacters
+ */
+export function getCharacter(campaign) {
+    return campaign.characters;
+}
+/**
+ *
+ * @param campaign
+ * @returns {Array<ShortCharacterContract>}
+ */
+export function getCharacters(campaign) {
+    return campaign.characters;
+}
+/**
+ *
+ * @param campaign
+ */
+export function getDescription(campaign) {
+    return campaign.description;
+}
+/**
+ *
+ * @param campaign
+ */
+export function getDmUserId(campaign) {
+    return campaign.dmUserId;
+}
+/**
+ *
+ * @param campaign
+ */
+export function getId(campaign) {
+    return campaign.id;
+}
+/**
+ *
+ * @param campaign
+ */
+export function getDmUsername(campaign) {
+    return campaign.dmUsername;
+}
+/**
+ *
+ * @param campaign
+ */
+export function getLink(campaign) {
+    return campaign.link;
+}
+/**
+ *
+ * @param campaign
+ */
+export function getName(campaign) {
+    return campaign.name;
+}
+/**
+ *
+ * @param campaign
+ */
+export function getPublicNotes(campaign) {
+    return campaign.publicNotes;
+}
+/**
+ *
+ * @param partyInfo
+ * @returns {Array<BaseInventoryContract>}
+ */
+export function getPartyBaseInventoryContracts(partyInfo) {
+    return partyInfo.partyInventory;
+}
+/**
+ *
+ * @param partyInfo
+ */
+export function getSharingState(partyInfo) {
+    var _a;
+    return (_a = partyInfo.sharingState) !== null && _a !== void 0 ? _a : PartyInventorySharingStateEnum.OFF;
+}
+/**
+ *
+ * @param partyInfo
+ */
+export function getItemSpells(partyInfo) {
+    var _a, _b;
+    return (_b = (_a = partyInfo.spells) === null || _a === void 0 ? void 0 : _a.item) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param partyInfo
+ */
+export function getItemModifiers(partyInfo) {
+    var _a, _b;
+    return (_b = (_a = partyInfo.modifiers) === null || _a === void 0 ? void 0 : _a.item) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param partyInfo
+ */
+export function getCoin(partyInfo) {
+    return partyInfo.coin;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Campaign/constants.js b/ddb_main/packages/rules-engine/es/engine/Campaign/constants.js
new file mode 100644
index 0000000..841f62e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Campaign/constants.js
@@ -0,0 +1,6 @@
+export var PartyInventorySharingStateEnum;
+(function (PartyInventorySharingStateEnum) {
+    PartyInventorySharingStateEnum[PartyInventorySharingStateEnum["OFF"] = 0] = "OFF";
+    PartyInventorySharingStateEnum[PartyInventorySharingStateEnum["ON"] = 1] = "ON";
+    PartyInventorySharingStateEnum[PartyInventorySharingStateEnum["DELETE_ONLY"] = 2] = "DELETE_ONLY";
+})(PartyInventorySharingStateEnum || (PartyInventorySharingStateEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Campaign/generators.js b/ddb_main/packages/rules-engine/es/engine/Campaign/generators.js
new file mode 100644
index 0000000..1fcb5d9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Campaign/generators.js
@@ -0,0 +1,16 @@
+import { ItemGenerators } from '../Item';
+import { getPartyBaseInventoryContracts } from './accessors';
+/**
+ *
+ * @param partyInfo
+ * @param modifierLookup
+ * @param spellLookup
+ * @param valueLookup
+ * @param inventoryInfusionLookup
+ * @param ruleData
+ */
+export function generateBasePartyInventory(partyInfo, modifierLookup, spellLookup, valueLookup, inventoryInfusionLookup, ruleData) {
+    return partyInfo
+        ? ItemGenerators.generateBaseItems(getPartyBaseInventoryContracts(partyInfo), modifierLookup, spellLookup, valueLookup, inventoryInfusionLookup, ruleData)
+        : [];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Campaign/index.js b/ddb_main/packages/rules-engine/es/engine/Campaign/index.js
new file mode 100644
index 0000000..6ed203e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Campaign/index.js
@@ -0,0 +1,9 @@
+import * as CampaignAccessors from './accessors';
+import * as CampaignConstants from './constants';
+import * as CampaignGenerators from './generators';
+import * as CampaignTypings from './typings';
+import * as CampaignUtils from './utils';
+export * from './typings';
+export * from './constants';
+export { CampaignAccessors, CampaignGenerators, CampaignUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, CampaignConstants), CampaignAccessors), CampaignGenerators), CampaignTypings), CampaignUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Campaign/utils.js b/ddb_main/packages/rules-engine/es/engine/Campaign/utils.js
new file mode 100644
index 0000000..0050051
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Campaign/utils.js
@@ -0,0 +1,51 @@
+import { getCharacters } from './accessors';
+import { PartyInventorySharingStateEnum } from './constants';
+/**
+ *
+ * @param sharingState
+ * @returns {Boolean}
+ * @description Returns true as long as the sharing state is not OFF. WARNING: DELETE_ONLY overlaps with the inactive sharing state
+ */
+export function isSharingStateActive(sharingState) {
+    return sharingState !== PartyInventorySharingStateEnum.OFF;
+}
+/**
+ *
+ * @param sharingState
+ * @returns {Boolean}
+ * @description Returns true as long as the sharing state is not ON. WARNING: DELETE_ONLY overlaps with the active sharing state
+ */
+export function isSharingStateInactive(sharingState) {
+    return sharingState !== PartyInventorySharingStateEnum.ON;
+}
+/**
+ *
+ * @param campaign
+ * @param characterId
+ * @returns {CampaignDataContract | null}
+ */
+export function getCharacterById(campaign, characterId) {
+    var _a, _b;
+    return (_b = (_a = getCharacters(campaign)) === null || _a === void 0 ? void 0 : _a.find((character) => character.characterId === characterId)) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param campaign
+ * @param characterId
+ * @returns {string}
+ */
+export function getCharacterName(campaign, characterId) {
+    var _a, _b;
+    return (_b = (_a = getCharacterById(campaign, characterId)) === null || _a === void 0 ? void 0 : _a.characterName) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ * @description Given a character id, this determines whether or not that character in the campaign is assigned
+ * to a player.
+ * @param campaign
+ * @param characterId
+ * @returns {boolean}
+ */
+export function isCharacterAssignedToAPlayer(campaign, characterId) {
+    var _a;
+    return !!((_a = getCharacterById(campaign, characterId)) === null || _a === void 0 ? void 0 : _a.isAssigned);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/CampaignSetting/accessors.js b/ddb_main/packages/rules-engine/es/engine/CampaignSetting/accessors.js
new file mode 100644
index 0000000..ff76653
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/CampaignSetting/accessors.js
@@ -0,0 +1,7 @@
+export function getEnabledSourceIds(campaignSetting) {
+    return campaignSetting.enabledSourceIds;
+}
+export function getAvailableSourceIds(campaignSetting) {
+    var _a;
+    return (_a = campaignSetting === null || campaignSetting === void 0 ? void 0 : campaignSetting.availableSources) === null || _a === void 0 ? void 0 : _a.map((s) => s.sourceId);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/CampaignSetting/index.js b/ddb_main/packages/rules-engine/es/engine/CampaignSetting/index.js
new file mode 100644
index 0000000..e72d875
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/CampaignSetting/index.js
@@ -0,0 +1,3 @@
+import * as CampaignSettingAccessors from './accessors';
+export { CampaignSettingAccessors };
+export default Object.assign({}, CampaignSettingAccessors);
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/constants/ArmorClass.js b/ddb_main/packages/rules-engine/es/engine/Character/constants/ArmorClass.js
new file mode 100644
index 0000000..0291784
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/constants/ArmorClass.js
@@ -0,0 +1,18 @@
+export var ArmorClassTypeEnum;
+(function (ArmorClassTypeEnum) {
+    ArmorClassTypeEnum["ARMOR"] = "Armor";
+    ArmorClassTypeEnum["SHIELD"] = "Shield";
+    ArmorClassTypeEnum["DEX_BONUS"] = "Dexterity Bonus";
+    ArmorClassTypeEnum["MAGIC_BONUS"] = "Magic Bonus";
+    ArmorClassTypeEnum["MISC_BONUS"] = "Misc Bonus";
+    ArmorClassTypeEnum["UNARMORED_BONUS"] = "Unarmored Bonus";
+    ArmorClassTypeEnum["ARMORED_BONUS"] = "Armored Bonus";
+    ArmorClassTypeEnum["OVERRIDE_BASE_ARMOR"] = "Base Armor + DEX (Override)";
+})(ArmorClassTypeEnum || (ArmorClassTypeEnum = {}));
+export var ArmorClassExtraTypeEnum;
+(function (ArmorClassExtraTypeEnum) {
+    ArmorClassExtraTypeEnum["MODIFIER"] = "MODIFIER";
+    ArmorClassExtraTypeEnum["ITEM"] = "ITEM";
+    ArmorClassExtraTypeEnum["STRING"] = "STRING";
+    ArmorClassExtraTypeEnum["NUMBER"] = "NUMBER";
+})(ArmorClassExtraTypeEnum || (ArmorClassExtraTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/constants/Attacks.js b/ddb_main/packages/rules-engine/es/engine/Character/constants/Attacks.js
new file mode 100644
index 0000000..31067fd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/constants/Attacks.js
@@ -0,0 +1,7 @@
+export var AttackSourceTypeEnum;
+(function (AttackSourceTypeEnum) {
+    AttackSourceTypeEnum["ACTION"] = "ACTION";
+    AttackSourceTypeEnum["ITEM"] = "ITEM";
+    AttackSourceTypeEnum["SPELL"] = "SPELL";
+    AttackSourceTypeEnum["CUSTOM"] = "CUSTOM";
+})(AttackSourceTypeEnum || (AttackSourceTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/constants/Death.js b/ddb_main/packages/rules-engine/es/engine/Character/constants/Death.js
new file mode 100644
index 0000000..85e84a9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/constants/Death.js
@@ -0,0 +1,6 @@
+export var DeathCauseEnum;
+(function (DeathCauseEnum) {
+    DeathCauseEnum["NONE"] = "NONE";
+    DeathCauseEnum["DEATHSAVES"] = "DEATHSAVES";
+    DeathCauseEnum["CONDITION"] = "CONDITION";
+})(DeathCauseEnum || (DeathCauseEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/constants/HitPoints.js b/ddb_main/packages/rules-engine/es/engine/Character/constants/HitPoints.js
new file mode 100644
index 0000000..86627cd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/constants/HitPoints.js
@@ -0,0 +1,14 @@
+export var ProtectionSupplierTypeEnum;
+(function (ProtectionSupplierTypeEnum) {
+    ProtectionSupplierTypeEnum["RACIAL_TRAIT"] = "RACIAL_TRAIT";
+    ProtectionSupplierTypeEnum["CLASS_FEATURE"] = "CLASS_FEATURE";
+    ProtectionSupplierTypeEnum["FEAT"] = "FEAT";
+    ProtectionSupplierTypeEnum["ITEM"] = "ITEM";
+})(ProtectionSupplierTypeEnum || (ProtectionSupplierTypeEnum = {}));
+export var ProtectionAvailabilityStatusEnum;
+(function (ProtectionAvailabilityStatusEnum) {
+    ProtectionAvailabilityStatusEnum["AVAILABLE"] = "AVAILABLE";
+    ProtectionAvailabilityStatusEnum["NO_LIMITED_USE_REMAINING"] = "NO_LIMITED_USE_REMAINING";
+    ProtectionAvailabilityStatusEnum["ITEM_NOT_EQUIPPED"] = "ITEM_NOT_EQUIPPED";
+    ProtectionAvailabilityStatusEnum["ITEM_NOT_ATTUNED"] = "ITEM_NOT_ATTUNED";
+})(ProtectionAvailabilityStatusEnum || (ProtectionAvailabilityStatusEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/derivers/Activatables.js b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Activatables.js
new file mode 100644
index 0000000..c4fed01
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Activatables.js
@@ -0,0 +1,42 @@
+import { ActionAccessors } from '../../Action';
+import { ActivationAccessors } from '../../Activation';
+import { ActivatableTypeEnum } from '../../Core';
+import { OptionAccessors } from '../../Option';
+/**
+ *
+ * @param options
+ * @param parentEntity
+ */
+export function deriveActivatableOptions(options, parentEntity) {
+    const activatables = [];
+    options.forEach((option) => {
+        const actions = OptionAccessors.getActions(option);
+        if (actions.length) {
+            activatables.push(...deriveActivatableActions(actions, parentEntity));
+        }
+    });
+    return activatables;
+}
+/**
+ *
+ * @param actions
+ * @param parentEntity
+ */
+export function deriveActivatableActions(actions, parentEntity) {
+    const activatables = [];
+    actions.forEach((action) => {
+        const activation = ActionAccessors.getActivation(action);
+        if (activation !== null && ActivationAccessors.getType(activation) !== null) {
+            activatables.push({
+                type: ActivatableTypeEnum.ACTION,
+                sortText: ActionAccessors.getName(action),
+                activation,
+                key: ActionAccessors.getUniqueKey(action),
+                limitedUse: ActionAccessors.getLimitedUse(action),
+                entity: action,
+                parentEntity,
+            });
+        }
+    });
+    return activatables;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/derivers/ArmorClass.js b/ddb_main/packages/rules-engine/es/engine/Character/derivers/ArmorClass.js
new file mode 100644
index 0000000..8cd173e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/derivers/ArmorClass.js
@@ -0,0 +1,13 @@
+/**
+ *
+ * @param armorClassSources
+ * @param initialValue
+ */
+export function deriveArmorClassSupplierTotal(armorClassSources, initialValue = 0) {
+    return armorClassSources.reduce((acc, armorClassSource) => {
+        if (armorClassSource.amount) {
+            acc += armorClassSource.amount;
+        }
+        return acc;
+    }, initialValue);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/derivers/Attacks.js b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Attacks.js
new file mode 100644
index 0000000..621a6ed
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Attacks.js
@@ -0,0 +1,45 @@
+import { AbilityAccessors } from '../../Ability';
+import { ModifierDerivers, ModifierValidators } from '../../Modifier';
+/**
+ *
+ * @param proficiencyBonus
+ * @param abilityModifier
+ */
+export function deriveAttackSaveValue(proficiencyBonus, abilityModifier) {
+    return 8 + proficiencyBonus + abilityModifier;
+}
+/**
+ *
+ * @param proficiencyBonus
+ * @param abilityModifier
+ */
+export function deriveAttackModifier(proficiencyBonus, abilityModifier) {
+    return proficiencyBonus + abilityModifier;
+}
+/**
+ *
+ * @param availableAbilities
+ * @param modifiers
+ * @param proficiencyBonus
+ * @param abilityLookup
+ */
+export function deriveAttackAbilityPossibilities(availableAbilities, modifiers, proficiencyBonus, abilityLookup) {
+    return availableAbilities.map((abilityId) => {
+        const ability = abilityLookup[abilityId];
+        // get bonus stat attack modifiers
+        const bonusStatToHitModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusStatAttackModifier(modifier, abilityId));
+        const bonusStatToHitModifierTotal = ModifierDerivers.sumModifiers(bonusStatToHitModifiers, abilityLookup);
+        // get damage stat attack modifiers
+        const damageStatAttackModifiers = modifiers.filter((modifier) => ModifierValidators.isValidDamageStatAttackModifier(modifier, abilityId));
+        const damageStatAttackModifierTotal = ModifierDerivers.sumModifiers(damageStatAttackModifiers, abilityLookup);
+        const abilityModifier = ability ? AbilityAccessors.getModifier(ability) : null;
+        const modifier = abilityModifier ? abilityModifier : 0;
+        const toHit = modifier + proficiencyBonus + bonusStatToHitModifierTotal;
+        return {
+            abilityId,
+            toHit,
+            modifier,
+            damageBonus: damageStatAttackModifierTotal + modifier,
+        };
+    });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/derivers/Death.js b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Death.js
new file mode 100644
index 0000000..0ffcbb4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Death.js
@@ -0,0 +1,20 @@
+import { DiceAdjustmentTypeEnum } from '../../Dice';
+import { ModifierDerivers, ModifierValidators } from '../../Modifier';
+/**
+ *
+ * @param modifiers
+ */
+export function deriveAdvantageDeathSavesAdjustments(modifiers) {
+    return modifiers
+        .filter((modifier) => ModifierValidators.isAdvantageDeathSavesModifier(modifier))
+        .map((modifier) => ModifierDerivers.deriveDiceAdjustment(modifier, DiceAdjustmentTypeEnum.ADVANTAGE));
+}
+/**
+ *
+ * @param modifiers
+ */
+export function deriveDisadvantageDeathSavesAdjustments(modifiers) {
+    return modifiers
+        .filter((modifier) => ModifierValidators.isDisadvantageDeathSavesModifier(modifier))
+        .map((modifier) => ModifierDerivers.deriveDiceAdjustment(modifier, DiceAdjustmentTypeEnum.DISADVANTAGE));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/derivers/Defenses.js b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Defenses.js
new file mode 100644
index 0000000..5ec06dd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Defenses.js
@@ -0,0 +1,15 @@
+import { DataOriginGenerators, DataOriginTypeEnum } from '../../DataOrigin';
+/**
+ *
+ * @param adjustment
+ */
+export function deriveCustomDefenseAdjustmentDataOrigin(adjustment) {
+    return DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.CUSTOM, adjustment.source ? adjustment.source : 'Custom');
+}
+/**
+ *
+ * @param adjustment
+ */
+export function deriveCustomConditionDefenseAdjustmentDataOrigin(adjustment) {
+    return DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.CUSTOM, adjustment.source ? adjustment.source : 'Custom');
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/derivers/HitPoints.js b/ddb_main/packages/rules-engine/es/engine/Character/derivers/HitPoints.js
new file mode 100644
index 0000000..0c61cb4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/derivers/HitPoints.js
@@ -0,0 +1,43 @@
+import { ItemAccessors, ItemValidators } from '../../Item';
+import { LimitedUseDerivers } from '../../LimitedUse';
+import { ModifierAccessors } from '../../Modifier';
+import { ProtectionAvailabilityStatusEnum } from '../constants';
+/**
+ *
+ * @param limitedUse
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function deriveProtectionSupplierAvailabilityStatus(limitedUse, abilityLookup, ruleData, proficiencyBonus) {
+    let availabilityStatus = ProtectionAvailabilityStatusEnum.AVAILABLE;
+    if (!LimitedUseDerivers.deriveHasUsesAvailable(limitedUse, abilityLookup, ruleData, proficiencyBonus)) {
+        availabilityStatus = ProtectionAvailabilityStatusEnum.NO_LIMITED_USE_REMAINING;
+    }
+    return availabilityStatus;
+}
+/**
+ *
+ * @param item
+ * @param modifier
+ * @param limitedUse
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ * @param characterId
+ */
+export function deriveItemProtectionSupplierAvailabilityStatus(item, modifier, limitedUse, abilityLookup, ruleData, proficiencyBonus, characterId) {
+    if (ItemAccessors.canEquip(item)) {
+        const isEquippedToCurrentCharacter = ItemValidators.isEquippedToCurrentCharacter(item, characterId);
+        if (!isEquippedToCurrentCharacter) {
+            return ProtectionAvailabilityStatusEnum.ITEM_NOT_EQUIPPED;
+        }
+        if (ModifierAccessors.requiresAttunement(modifier) && !ItemAccessors.isAttuned(item)) {
+            return ProtectionAvailabilityStatusEnum.ITEM_NOT_ATTUNED;
+        }
+    }
+    if (!LimitedUseDerivers.deriveHasUsesAvailable(limitedUse, abilityLookup, ruleData, proficiencyBonus)) {
+        return ProtectionAvailabilityStatusEnum.NO_LIMITED_USE_REMAINING;
+    }
+    return ProtectionAvailabilityStatusEnum.AVAILABLE;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/derivers/Proficiency.js b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Proficiency.js
new file mode 100644
index 0000000..a8a25ef
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Proficiency.js
@@ -0,0 +1,43 @@
+import { ProficiencyLevelEnum, ProficiencyRoundingEnum } from '../../Core';
+import { ModifierDerivers, ModifierValidators } from '../../Modifier';
+import { RuleDataUtils } from '../../RuleData';
+/**
+ *
+ * @param level
+ * @param modifiers
+ * @param ruleData
+ */
+export function deriveProficiencyBonus(level, modifiers, ruleData) {
+    const levelBonus = RuleDataUtils.getLevelProficiencyBonus(level, ruleData);
+    const bonusProficiencyBonusModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusProficiencyBonusModifier(modifier));
+    const modifierBonusTotal = ModifierDerivers.sumModifiers(bonusProficiencyBonusModifiers);
+    return levelBonus + modifierBonusTotal;
+}
+/**
+ *
+ * @param proficiencyLevel
+ * @param proficiencyBonus
+ * @param proficiencyRounding
+ */
+export function deriveProficiencyBonusAmount(proficiencyLevel, proficiencyBonus, proficiencyRounding = ProficiencyRoundingEnum.DOWN) {
+    let proficiencyBonusAmount = 0;
+    switch (proficiencyLevel) {
+        case ProficiencyLevelEnum.EXPERT:
+            proficiencyBonusAmount = proficiencyBonus * 2;
+            break;
+        case ProficiencyLevelEnum.FULL:
+            proficiencyBonusAmount = proficiencyBonus;
+            break;
+        case ProficiencyLevelEnum.HALF:
+            if (proficiencyRounding === ProficiencyRoundingEnum.UP) {
+                proficiencyBonusAmount = Math.ceil(proficiencyBonus / 2);
+            }
+            else {
+                proficiencyBonusAmount = Math.floor(proficiencyBonus / 2);
+            }
+            break;
+        default:
+        // not implemented
+    }
+    return proficiencyBonusAmount;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/derivers/Progression.js b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Progression.js
new file mode 100644
index 0000000..bfbd45f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Progression.js
@@ -0,0 +1,48 @@
+import { RuleDataAccessors } from '../../RuleData';
+/**
+ *
+ * @param xp
+ * @param ruleData
+ */
+export function deriveXpLevel(xp, ruleData) {
+    let level = 0;
+    if (xp === 0) {
+        return 1;
+    }
+    if (xp >= deriveMaxXp(ruleData)) {
+        return RuleDataAccessors.getMaxCharacterLevel(ruleData);
+    }
+    const levelExperiencePoints = RuleDataAccessors.getLevelExperiencePoints(ruleData);
+    levelExperiencePoints.forEach((levelXpAmount, levelIdx) => {
+        if (level === 0 && xp < levelXpAmount) {
+            level = levelIdx;
+        }
+    });
+    return level;
+}
+/**
+ *
+ * @param level
+ * @param ruleData
+ */
+export function deriveCurrentLevelXp(level, ruleData) {
+    const levelExperiencePoints = RuleDataAccessors.getLevelExperiencePoints(ruleData);
+    return levelExperiencePoints[Math.max(0, level - 1)];
+}
+/**
+ *
+ * @param level
+ * @param ruleData
+ */
+export function deriveNextLevelXp(level, ruleData) {
+    const levelExperiencePoints = RuleDataAccessors.getLevelExperiencePoints(ruleData);
+    return levelExperiencePoints[Math.min(levelExperiencePoints.length - 1, level)];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function deriveMaxXp(ruleData) {
+    const levelExperiencePoints = RuleDataAccessors.getLevelExperiencePoints(ruleData);
+    return levelExperiencePoints[levelExperiencePoints.length - 1];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/derivers/SavingThrow.js b/ddb_main/packages/rules-engine/es/engine/Character/derivers/SavingThrow.js
new file mode 100644
index 0000000..bd9c4e7
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/derivers/SavingThrow.js
@@ -0,0 +1,22 @@
+import { SaveTypeEnum } from '../../Core';
+/**
+ *
+ * @param type
+ */
+export function deriveSaveTypeName(type) {
+    let name = '';
+    switch (type) {
+        case SaveTypeEnum.ADVANTAGE:
+            name = 'Advantage';
+            break;
+        case SaveTypeEnum.DISADVANTAGE:
+            name = 'Disadvantage';
+            break;
+        case SaveTypeEnum.BONUS:
+            name = 'Bonus';
+            break;
+        default:
+        //not implemented
+    }
+    return name;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/derivers/Senses.js b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Senses.js
new file mode 100644
index 0000000..47b5ff7
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Senses.js
@@ -0,0 +1,59 @@
+import { AbilitySkillEnum } from '../../Core';
+import { ModifierDerivers, ModifierValidators } from '../../Modifier';
+import { SkillAccessors } from '../../Skill';
+/**
+ *
+ * @param skillModifier
+ * @param bonuses
+ */
+export function derivePassiveSkill(skillModifier, bonuses = 0) {
+    return 10 + skillModifier + bonuses;
+}
+/**
+ *
+ * @param skills
+ * @param modifiers
+ * @param abilityLookup
+ */
+export function derivePassivePerception(skills, modifiers, abilityLookup) {
+    const skill = skills.find((skill) => SkillAccessors.getId(skill) === AbilitySkillEnum.PERCEPTION);
+    const skillModifier = skill ? SkillAccessors.getModifier(skill) : null;
+    if (!skill || skillModifier === null) {
+        return 0;
+    }
+    const bonusModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusPassivePerceptionModifier(modifier));
+    const bonusModifierTotal = ModifierDerivers.sumModifiers(bonusModifiers, abilityLookup);
+    return derivePassiveSkill(skillModifier, bonusModifierTotal);
+}
+/**
+ *
+ * @param skills
+ * @param modifiers
+ * @param abilityLookup
+ */
+export function derivePassiveInvestigation(skills, modifiers, abilityLookup) {
+    const skill = skills.find((skill) => SkillAccessors.getId(skill) === AbilitySkillEnum.INVESTIGATION);
+    const skillModifier = skill ? SkillAccessors.getModifier(skill) : null;
+    if (!skill || skillModifier === null) {
+        return 0;
+    }
+    const bonusModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusPassiveInvestigationModifier(modifier));
+    const bonusModifierTotal = ModifierDerivers.sumModifiers(bonusModifiers, abilityLookup);
+    return derivePassiveSkill(skillModifier, bonusModifierTotal);
+}
+/**
+ *
+ * @param skills
+ * @param modifiers
+ * @param abilityLookup
+ */
+export function derivePassiveInsight(skills, modifiers, abilityLookup) {
+    const skill = skills.find((skill) => SkillAccessors.getId(skill) === AbilitySkillEnum.INSIGHT);
+    const skillModifier = skill ? SkillAccessors.getModifier(skill) : null;
+    if (!skill || skillModifier === null) {
+        return 0;
+    }
+    const bonusModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusPassiveInsightModifier(modifier));
+    const bonusModifierTotal = ModifierDerivers.sumModifiers(bonusModifiers, abilityLookup);
+    return derivePassiveSkill(skillModifier, bonusModifierTotal);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/derivers/Weight.js b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Weight.js
new file mode 100644
index 0000000..2e5280e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/derivers/Weight.js
@@ -0,0 +1,28 @@
+import { PreferenceEncumbranceTypeEnum, WeightSpeedTypeEnum } from '../../Core';
+import { getCarryCapacity, getEncumberedWeight, getHeavilyEncumberedWeight } from '../utils';
+/**
+ *
+ * @param currentWeight
+ * @param strScore
+ * @param size
+ * @param preferences
+ * @param modifiers
+ */
+export function deriveCurrentWeightSpeedType(currentWeight, strScore, size, preferences, modifiers) {
+    if (preferences !== null) {
+        if (preferences.encumbranceType === PreferenceEncumbranceTypeEnum.VARIANT) {
+            if (currentWeight > getHeavilyEncumberedWeight(strScore, size, modifiers)) {
+                return WeightSpeedTypeEnum.HEAVILY_ENCUMBERED;
+            }
+            else if (currentWeight > getEncumberedWeight(strScore, size, modifiers)) {
+                return WeightSpeedTypeEnum.ENCUMBERED;
+            }
+        }
+        else if (preferences.encumbranceType === PreferenceEncumbranceTypeEnum.ENCUMBRANCE) {
+            if (currentWeight > getCarryCapacity(strScore, size, modifiers)) {
+                return WeightSpeedTypeEnum.OVER_CARRYING_CAPACITY;
+            }
+        }
+    }
+    return WeightSpeedTypeEnum.NORMAL;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Activatables.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Activatables.js
new file mode 100644
index 0000000..b968c23
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Activatables.js
@@ -0,0 +1,122 @@
+import { orderBy } from 'lodash';
+import { ActionAccessors } from '../../Action';
+import { ActivationAccessors } from '../../Activation';
+import { ClassAccessors } from '../../Class';
+import { ClassFeatureAccessors } from '../../ClassFeature';
+import { ActivatableTypeEnum } from '../../Core';
+import { FeatAccessors } from '../../Feat';
+import { ItemAccessors, ItemValidators } from '../../Item';
+import { RaceAccessors } from '../../Race';
+import { RacialTraitAccessors } from '../../RacialTrait';
+import { SpellAccessors } from '../../Spell';
+import { deriveActivatableActions, deriveActivatableOptions } from '../derivers';
+/**
+ *
+ * @param characterSpells
+ * @param classSpells
+ * @param classes
+ * @param race
+ * @param feats
+ * @param innateActions
+ * @param customActions
+ * @param equippedItems
+ */
+export function generateActivatables(characterSpells, classSpells, classes, race, feats, innateActions, // TODO might need to change to InnateAction
+customActions, // TODO might need to change to CustomAction
+equippedItems) {
+    const activatables = [];
+    characterSpells.forEach((spell) => {
+        const activation = SpellAccessors.getActivation(spell);
+        if (activation !== null && ActivationAccessors.getType(activation) !== null) {
+            activatables.push({
+                type: ActivatableTypeEnum.CHARACTER_SPELL,
+                sortText: SpellAccessors.getName(spell),
+                key: SpellAccessors.getUniqueKey(spell),
+                activation,
+                limitedUse: SpellAccessors.getLimitedUse(spell),
+                entity: spell,
+                parentEntity: null,
+            });
+        }
+    });
+    classSpells.forEach((spell) => {
+        const activation = SpellAccessors.getActivation(spell);
+        if (activation !== null && ActivationAccessors.getType(activation) !== null) {
+            activatables.push({
+                type: ActivatableTypeEnum.CLASS_SPELL,
+                sortText: SpellAccessors.getName(spell),
+                key: SpellAccessors.getUniqueKey(spell),
+                activation,
+                limitedUse: null,
+                entity: spell,
+                parentEntity: null,
+            });
+        }
+    });
+    classes.forEach((charClass) => {
+        ClassAccessors.getUniqueClassFeatures(charClass).forEach((feature) => {
+            const actions = ClassFeatureAccessors.getActions(feature);
+            const options = ClassFeatureAccessors.getOptions(feature);
+            if (actions.length) {
+                activatables.push(...deriveActivatableActions(actions, charClass));
+            }
+            if (options.length) {
+                activatables.push(...deriveActivatableOptions(options, charClass));
+            }
+        });
+    });
+    if (race) {
+        RaceAccessors.getRacialTraits(race).forEach((racialTrait) => {
+            const actions = RacialTraitAccessors.getActions(racialTrait);
+            const options = RacialTraitAccessors.getOptions(racialTrait);
+            if (actions.length) {
+                activatables.push(...deriveActivatableActions(actions, race));
+            }
+            if (options.length) {
+                activatables.push(...deriveActivatableOptions(options, race));
+            }
+        });
+    }
+    feats.forEach((feat) => {
+        const actions = FeatAccessors.getActions(feat);
+        const options = FeatAccessors.getOptions(feat);
+        if (actions.length) {
+            activatables.push(...deriveActivatableActions(actions, race));
+        }
+        if (options.length) {
+            activatables.push(...deriveActivatableOptions(options, race));
+        }
+    });
+    innateActions.forEach((action) => {
+        const activation = ActionAccessors.getActivation(action);
+        if (activation !== null) {
+            activatables.push({
+                type: ActivatableTypeEnum.ACTION,
+                sortText: ActionAccessors.getName(action),
+                activation,
+                key: ActionAccessors.getUniqueKey(action),
+                limitedUse: null,
+                entity: action,
+                parentEntity: null,
+            });
+        }
+    });
+    customActions.forEach((action) => {
+        const activation = ActionAccessors.getActivation(action);
+        if (activation !== null && ActivationAccessors.getType(activation) !== null) {
+            activatables.push({
+                type: ActivatableTypeEnum.ACTION,
+                sortText: ActionAccessors.getName(action),
+                activation,
+                key: ActionAccessors.getUniqueKey(action),
+                limitedUse: null,
+                entity: action,
+                parentEntity: null,
+            });
+        }
+    });
+    equippedItems.filter(ItemValidators.validateCanContributeActions).forEach((item) => {
+        activatables.push(...deriveActivatableActions(ItemAccessors.getInfusionActions(item), item));
+    });
+    return orderBy(activatables, ['sortText']);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/ArmorClass.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/ArmorClass.js
new file mode 100644
index 0000000..3de6114
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/ArmorClass.js
@@ -0,0 +1,294 @@
+import { forOwn, groupBy } from 'lodash';
+import { AbilityAccessors } from '../../Ability';
+import { AbilityStatEnum } from '../../Core';
+import { DataOriginTypeEnum } from '../../DataOrigin';
+import { HelperUtils } from '../../Helper';
+import { ArmorTypeEnum, ItemAccessors, ItemDerivers, ItemHacks, ItemValidators, } from '../../Item';
+import { ModifierAccessors, ModifierDerivers, ModifierGenerators, ModifierHacks, ModifierValidators, } from '../../Modifier';
+import { AdjustmentTypeEnum, ValueAccessors, ValueUtils } from '../../Value';
+import { ArmorClassExtraTypeEnum, ArmorClassTypeEnum } from '../constants';
+import { deriveArmorClassSupplierTotal } from '../derivers';
+/**
+ *
+ * @param type
+ * @param amount
+ * @param extra
+ * @param extraType
+ */
+export function generateArmorClassSupplier(type, amount, extra = null, extraType = null) {
+    return {
+        type,
+        amount,
+        extra,
+        extraType,
+    };
+}
+/**
+ *
+ * @param armorItem
+ * @param localModifiers
+ * @param globalModifiers
+ * @param abilityLookup
+ * @param valueLookup
+ * @param modifierData
+ */
+export function generateArmoredBaseArmorSuppliers(armorItem, localModifiers, globalModifiers, abilityLookup, valueLookup, modifierData) {
+    const dexModifier = AbilityAccessors.getModifier(abilityLookup[AbilityStatEnum.DEXTERITY]);
+    const baseArmorOverrideValue = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.OVERRIDE_BASE_ARMOR);
+    const suppliers = [];
+    if (baseArmorOverrideValue === null) {
+        suppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.ARMOR, armorItem.armorClass, armorItem.item, ArmorClassExtraTypeEnum.ITEM));
+        suppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.DEX_BONUS, ItemDerivers.deriveArmorDexBonus(armorItem.item, dexModifier ? dexModifier : 0, globalModifiers, abilityLookup), ItemDerivers.deriveArmorDexBonusMax(armorItem.item, globalModifiers, abilityLookup), ArmorClassExtraTypeEnum.NUMBER));
+    }
+    const setArmoredModifiers = localModifiers.filter((modifier) => ModifierValidators.isSetArmoredArmorClassModifier(modifier));
+    const setArmoredHighestModifier = ModifierDerivers.deriveHighestValueModifier(setArmoredModifiers, modifierData);
+    if (setArmoredHighestModifier) {
+        suppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.ARMORED_BONUS, ModifierDerivers.deriveValue(setArmoredHighestModifier, modifierData), setArmoredHighestModifier, ArmorClassExtraTypeEnum.MODIFIER));
+    }
+    const bonusArmoredModifiers = globalModifiers.filter((modifier) => ModifierValidators.isBonusArmoredArmorClassModifier(modifier));
+    bonusArmoredModifiers.forEach((modifier) => {
+        suppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.ARMORED_BONUS, ModifierDerivers.deriveValue(modifier, modifierData), modifier, ArmorClassExtraTypeEnum.MODIFIER));
+    });
+    return suppliers;
+}
+/**
+ *
+ * @param localModifiers
+ * @param globalModifiers
+ * @param abilityLookup
+ * @param valueLookup
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateUnarmoredBaseArmorSuppliers(localModifiers, globalModifiers, abilityLookup, valueLookup, ruleData, modifierData) {
+    const baseArmorOverrideValue = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.OVERRIDE_BASE_ARMOR);
+    const suppliers = [];
+    if (baseArmorOverrideValue === null) {
+        suppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.ARMOR, ruleData.noArmorAcAmount, 'None', ArmorClassExtraTypeEnum.STRING));
+        const unarmoredDexModifier = ItemDerivers.deriveUnarmoredDexBonus(localModifiers, globalModifiers, abilityLookup);
+        if (unarmoredDexModifier !== 0) {
+            suppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.DEX_BONUS, unarmoredDexModifier, ItemDerivers.deriveUnarmoredDexBonusMax(globalModifiers), ArmorClassExtraTypeEnum.NUMBER));
+        }
+    }
+    const setUnarmoredModifiers = localModifiers.filter((modifier) => ModifierValidators.isSetUnarmoredArmorClassModifier(modifier));
+    // TODO: Fix Dirty Hack for Integrated Protection
+    const hasLightArmorProficiency = globalModifiers.filter((modifier) => ModifierHacks.hack__isProficiencyLightArmor(modifier)).length > 0;
+    if (setUnarmoredModifiers.length) {
+        // let setUnarmoredHighestModifier = ModifierUtils.getHighestValueModifier(setUnarmoredModifiers, modifierData);
+        const setUnarmoredHighestModifier = HelperUtils.getLast(setUnarmoredModifiers, (modifier) => ItemHacks.hack__getSetUnarmoredModifierValue(modifier, modifierData, hasLightArmorProficiency));
+        if (setUnarmoredHighestModifier) {
+            suppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.UNARMORED_BONUS, ItemHacks.hack__getSetUnarmoredModifierValue(setUnarmoredHighestModifier, modifierData, hasLightArmorProficiency), setUnarmoredHighestModifier, ArmorClassExtraTypeEnum.MODIFIER));
+        }
+    }
+    const bonusUnarmoredModifiers = globalModifiers.filter((modifier) => ModifierValidators.isBonusUnarmoredArmorClassModifier(modifier));
+    bonusUnarmoredModifiers.forEach((modifier) => {
+        suppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.UNARMORED_BONUS, ModifierDerivers.deriveValue(modifier, modifierData), modifier, ArmorClassExtraTypeEnum.MODIFIER));
+    });
+    return suppliers;
+}
+/**
+ *
+ * @param armorItem
+ * @param modifiers
+ * @param abilityLookup
+ * @param valueLookup
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateBaseArmorSuppliers(armorItem, modifiers, abilityLookup, valueLookup, ruleData, modifierData) {
+    const branchPossibilities = [];
+    const branchingModifiers = modifiers.filter((modifier) => ModifierValidators.isArmorBranchingModifier(modifier));
+    const groupedBranchModifiers = groupBy(branchingModifiers, (modifier) => ModifierGenerators.generateDataOriginKey(modifier));
+    forOwn(groupedBranchModifiers, (branchGroupModifiers) => {
+        const ignoreUnarmoredWhileArmoredModifiers = branchGroupModifiers.filter((modifier) => ModifierValidators.isIgnoreUnarmoredWhileArmoredModifier(modifier));
+        const ignoreUnarmoredWhileArmored = !!ignoreUnarmoredWhileArmoredModifiers.length;
+        if (armorItem) {
+            branchPossibilities.push(generateBaseArmorBranchPossibility(armorItem, branchGroupModifiers, modifiers, abilityLookup, valueLookup, ruleData, modifierData));
+            if (!ignoreUnarmoredWhileArmored) {
+                branchPossibilities.push(generateBaseArmorBranchPossibility(null, branchGroupModifiers, modifiers, abilityLookup, valueLookup, ruleData, modifierData));
+            }
+        }
+        else {
+            branchPossibilities.push(generateBaseArmorBranchPossibility(null, branchGroupModifiers, modifiers, abilityLookup, valueLookup, ruleData, modifierData));
+        }
+    });
+    // innate armor calc
+    branchPossibilities.push(generateBaseArmorBranchPossibility(armorItem, [], modifiers, abilityLookup, valueLookup, ruleData, modifierData));
+    const bestBaseArmorBranchPossibility = HelperUtils.getLast(branchPossibilities, (possibility) => possibility.total);
+    if (bestBaseArmorBranchPossibility === null) {
+        return [];
+    }
+    return bestBaseArmorBranchPossibility.suppliers;
+}
+/**
+ *
+ * @param mainhandWeapons
+ * @param offhandWeapons
+ * @param modifiers
+ * @param modifierData
+ */
+export function generateDualWieldArmorClassSuppliers(mainhandWeapons, offhandWeapons, modifiers, modifierData) {
+    const armorClassSuppliers = [];
+    const bonusDualWieldAcModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusDualWieldAcModifier(modifier));
+    if (bonusDualWieldAcModifiers.length && mainhandWeapons.length && offhandWeapons.length) {
+        bonusDualWieldAcModifiers.forEach((modifier) => {
+            armorClassSuppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.MISC_BONUS, ModifierDerivers.deriveValue(modifier, modifierData), modifier, ArmorClassExtraTypeEnum.MODIFIER));
+        });
+    }
+    return armorClassSuppliers;
+}
+/**
+ *
+ * @param armorItem
+ * @param shieldItem
+ * @param modifiers
+ * @param abilityLookup
+ * @param equippedItems
+ * @param valueLookup
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateArmorClassSuppliers(armorItem, shieldItem, modifiers, abilityLookup, equippedItems, valueLookup, ruleData, modifierData) {
+    const armorClassSuppliers = [];
+    // base armor AC sources based on potential branching paths
+    const baseArmorSuppliers = generateBaseArmorSuppliers(armorItem, modifiers, abilityLookup, valueLookup, ruleData, modifierData);
+    armorClassSuppliers.push(...baseArmorSuppliers);
+    // TODO part of dirty hack
+    const isWearingHeavyArmor = armorItem
+        ? ItemAccessors.getArmorTypeId(armorItem.item) === ArmorTypeEnum.HEAVY_ARMOR
+        : false;
+    // general AC bonuses (for both unarmored and armored)
+    const armorModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusArmorModifier(modifier));
+    armorModifiers.forEach((modifier) => {
+        const dataOrigin = ModifierAccessors.getDataOrigin(modifier);
+        const dataOriginType = ModifierAccessors.getDataOriginType(modifier);
+        let type = ArmorClassTypeEnum.MISC_BONUS;
+        if (dataOriginType === DataOriginTypeEnum.ITEM) {
+            // TODO This may cause issues with magic infusions, but should be minor and can be fixed when we do overhaul of accessing DataOrigin entities
+            type = ItemAccessors.getDefinitionMagic(dataOrigin.primary)
+                ? ArmorClassTypeEnum.MAGIC_BONUS
+                : ArmorClassTypeEnum.MISC_BONUS;
+        }
+        // TODO part of dirty hack
+        const value = ItemHacks.hack__deriveBonusArmorModifierValue(modifier, modifierData, isWearingHeavyArmor);
+        armorClassSuppliers.push(generateArmorClassSupplier(type, value, 
+        // ModifierDerivers.deriveValue(modifier, modifierData),
+        modifier, ArmorClassExtraTypeEnum.MODIFIER));
+    });
+    // misc overall bonuses
+    const shieldArmorClass = shieldItem ? shieldItem.armorClass : 0;
+    const mainhandWeapons = equippedItems.filter(ItemValidators.isEquippedMainhandWeapon);
+    const offhandWeapons = equippedItems.filter(ItemValidators.isEquippedOffhandWeapon);
+    const dualWieldArmorClassSuppliers = generateDualWieldArmorClassSuppliers(mainhandWeapons, offhandWeapons, modifiers, modifierData);
+    const dualWieldArmorClassBonus = deriveArmorClassSupplierTotal(dualWieldArmorClassSuppliers);
+    if (dualWieldArmorClassBonus > 0 && dualWieldArmorClassBonus > shieldArmorClass) {
+        armorClassSuppliers.push(...dualWieldArmorClassSuppliers);
+    }
+    else {
+        // best shield AC
+        if (shieldItem) {
+            armorClassSuppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.SHIELD, shieldItem.armorClass, shieldItem.item, ArmorClassExtraTypeEnum.ITEM));
+        }
+    }
+    // overall magic bonus adjustment value
+    const magicBonusAdjustment = ValueUtils.getData(valueLookup, AdjustmentTypeEnum.MAGIC_BONUS_AC);
+    if (magicBonusAdjustment !== null) {
+        armorClassSuppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.MAGIC_BONUS, ValueAccessors.getValue(magicBonusAdjustment), ValueAccessors.getNotes(magicBonusAdjustment), ArmorClassExtraTypeEnum.STRING));
+    }
+    // overall misc bonus adjustment value
+    const miscBonusAdjustment = ValueUtils.getData(valueLookup, AdjustmentTypeEnum.MISC_BONUS_AC);
+    if (miscBonusAdjustment !== null) {
+        armorClassSuppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.MISC_BONUS, ValueAccessors.getValue(miscBonusAdjustment), ValueAccessors.getNotes(miscBonusAdjustment), ArmorClassExtraTypeEnum.STRING));
+    }
+    return armorClassSuppliers;
+}
+/**
+ *
+ * @param armorItem
+ * @param localModifiers
+ * @param globalModifiers
+ * @param abilityLookup
+ * @param valueLookup
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateBaseArmorBranchPossibility(armorItem, localModifiers, globalModifiers, abilityLookup, valueLookup, ruleData, modifierData) {
+    let suppliers = [];
+    const baseArmorOverride = ValueUtils.getData(valueLookup, AdjustmentTypeEnum.OVERRIDE_BASE_ARMOR);
+    if (baseArmorOverride !== null) {
+        suppliers.push(generateArmorClassSupplier(ArmorClassTypeEnum.OVERRIDE_BASE_ARMOR, ValueAccessors.getValue(baseArmorOverride), ValueAccessors.getNotes(baseArmorOverride), ArmorClassExtraTypeEnum.STRING));
+    }
+    // basearmor + set highest + status bonuses
+    // - set highest is all of the "set > (un)armored armor class" modifiers
+    // - status bonuses are bonuses based on whether you are armored or unarmored
+    if (armorItem) {
+        suppliers.push(...generateArmoredBaseArmorSuppliers(armorItem, localModifiers, globalModifiers, abilityLookup, valueLookup, modifierData));
+    }
+    else {
+        suppliers.push(...generateUnarmoredBaseArmorSuppliers(localModifiers, globalModifiers, abilityLookup, valueLookup, ruleData, modifierData));
+    }
+    const minimumBaseArmorModifiers = localModifiers.filter((modifier) => ModifierValidators.isSetMinimumBaseArmorModifier(modifier));
+    if (minimumBaseArmorModifiers.length) {
+        const minBaseArmorModifier = minimumBaseArmorModifiers[0];
+        const setMinBaseArmorValue = ModifierDerivers.deriveValue(minBaseArmorModifier, modifierData);
+        if (setMinBaseArmorValue > deriveArmorClassSupplierTotal(suppliers)) {
+            suppliers = [
+                generateArmorClassSupplier(ArmorClassTypeEnum.ARMOR, setMinBaseArmorValue, minBaseArmorModifier, ArmorClassExtraTypeEnum.MODIFIER),
+            ];
+        }
+    }
+    return {
+        total: deriveArmorClassSupplierTotal(suppliers),
+        suppliers,
+    };
+}
+/**
+ *
+ * @param equippedItems
+ * @param dexModifier
+ * @param modifiers
+ * @param abilityLookup
+ * @param ruleData
+ */
+export function generateHighestAcEquippedArmor(equippedItems, dexModifier, modifiers, abilityLookup, ruleData) {
+    const equippedArmor = equippedItems.filter(ItemValidators.isEquippedNonShieldArmor);
+    return ItemDerivers.deriveHighestArmorAcItem(equippedArmor, dexModifier, modifiers, abilityLookup, ruleData);
+}
+/**
+ *
+ * @param equippedItems
+ * @param dexModifier
+ * @param modifiers
+ * @param abilityLookup
+ * @param ruleData
+ */
+export function generateHighestAcEquippedShield(equippedItems, dexModifier, modifiers, abilityLookup, ruleData) {
+    const equippedShields = equippedItems.filter(ItemValidators.isEquippedShield);
+    return ItemDerivers.deriveHighestArmorAcItem(equippedShields, dexModifier, modifiers, abilityLookup, ruleData);
+}
+/**
+ *
+ * @param valueLookup
+ */
+export function generateArmorClassAdjustments(valueLookup) {
+    return {
+        overrideAc: ValueUtils.getData(valueLookup, AdjustmentTypeEnum.OVERRIDE_AC),
+        overrideBaseArmor: ValueUtils.getData(valueLookup, AdjustmentTypeEnum.OVERRIDE_BASE_ARMOR),
+        miscBonus: ValueUtils.getData(valueLookup, AdjustmentTypeEnum.MISC_BONUS_AC),
+        magicBonus: ValueUtils.getData(valueLookup, AdjustmentTypeEnum.MAGIC_BONUS_AC),
+    };
+}
+/**
+ *
+ * @param armorClassSuppliers
+ * @param armorClassAdjustments
+ */
+export function generateArmorClassTotal(armorClassSuppliers, armorClassAdjustments) {
+    if (armorClassAdjustments.overrideAc !== null) {
+        const overrideAcValue = ValueUtils.getTypedCharacterValueValue(armorClassAdjustments.overrideAc);
+        if (overrideAcValue !== null) {
+            return overrideAcValue;
+        }
+    }
+    return deriveArmorClassSupplierTotal(armorClassSuppliers);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Attacks.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Attacks.js
new file mode 100644
index 0000000..eee5fbd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Attacks.js
@@ -0,0 +1,89 @@
+import { orderBy } from 'lodash';
+import { ActionAccessors } from '../../Action';
+import { ActivationAccessors, ActivationTypeEnum } from '../../Activation';
+import { ItemAccessors } from '../../Item';
+import { ModifierAccessors, ModifierValidators } from '../../Modifier';
+import { SpellAccessors } from '../../Spell';
+import { AttackSourceTypeEnum } from '../constants';
+/**
+ *
+ * @param actions
+ * @param itemAttacks
+ * @param spellAttackList
+ * @param customAttacks
+ */
+export function generateAttacks(actions, itemAttacks, spellAttackList, customAttacks) {
+    const attacks = [];
+    itemAttacks.forEach((attack) => {
+        let activation = ActivationTypeEnum.ACTION;
+        if (ItemAccessors.isOffhand(attack)) {
+            activation = ActivationTypeEnum.BONUS_ACTION;
+        }
+        attacks.push({
+            type: AttackSourceTypeEnum.ITEM,
+            key: `${AttackSourceTypeEnum.ITEM}-${attack.id}`,
+            activation,
+            data: attack,
+        });
+    });
+    spellAttackList.forEach((attack) => {
+        attacks.push({
+            type: AttackSourceTypeEnum.SPELL,
+            key: `${AttackSourceTypeEnum.SPELL}-${SpellAccessors.getUniqueKey(attack)}`,
+            activation: SpellAccessors.getActivationType(attack),
+            data: attack,
+        });
+    });
+    actions.forEach((action, idx) => {
+        if (!ActionAccessors.displayAsAttack(action)) {
+            return;
+        }
+        attacks.push({
+            type: AttackSourceTypeEnum.ACTION,
+            key: `${AttackSourceTypeEnum.ACTION}-${idx}-${ActionAccessors.getUniqueKey(action)}`,
+            activation: ActivationAccessors.getType(ActionAccessors.getActivation(action)),
+            data: action,
+        });
+    });
+    customAttacks.forEach((attack) => {
+        if (!ActionAccessors.displayAsAttack(attack)) {
+            return;
+        }
+        attacks.push({
+            type: AttackSourceTypeEnum.CUSTOM,
+            key: `${AttackSourceTypeEnum.CUSTOM}-${ActionAccessors.getUniqueKey(attack)}`,
+            activation: ActivationAccessors.getType(ActionAccessors.getActivation(attack)),
+            data: attack,
+        });
+    });
+    return attacks;
+}
+/**
+ *
+ * @param modifiers
+ */
+export function generateAttacksPerActionInfo(modifiers) {
+    const extraAttackModifiers = modifiers.filter((modifier) => ModifierValidators.isSetExtraAttacksModifier(modifier));
+    const sortedExtraAttackModifiers = orderBy(extraAttackModifiers, [
+        (modifier) => ModifierAccessors.getValue(modifier),
+        (modifier) => {
+            const restriction = ModifierAccessors.getRestriction(modifier);
+            return restriction !== null && restriction.length;
+        },
+    ], ['asc', 'desc']);
+    const attacksPerActionBestModifier = sortedExtraAttackModifiers.pop();
+    const defaultValue = 0;
+    const defaultRestriction = '';
+    let attackInfoValue = defaultValue;
+    let attackInfoRestriction = defaultRestriction;
+    if (attacksPerActionBestModifier) {
+        const bestModiferValue = ModifierAccessors.getValue(attacksPerActionBestModifier);
+        attackInfoValue = bestModiferValue ? bestModiferValue : defaultValue;
+        const bestModifierRestriction = ModifierAccessors.getRestriction(attacksPerActionBestModifier);
+        attackInfoRestriction = bestModifierRestriction ? bestModifierRestriction : defaultRestriction;
+    }
+    return {
+        value: 1 + attackInfoValue,
+        restriction: attackInfoRestriction,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Characteristics.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Characteristics.js
new file mode 100644
index 0000000..5e6068a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Characteristics.js
@@ -0,0 +1,69 @@
+import { HelperUtils } from '../../Helper';
+import { RaceAccessors } from '../../Race';
+import { RuleDataAccessors } from '../../RuleData';
+/**
+ *
+ * @param alignmentId
+ * @param ruleData
+ */
+export function generateAlignment(alignmentId, ruleData) {
+    if (alignmentId === null) {
+        return null;
+    }
+    return HelperUtils.lookupDataOrFallback(RuleDataAccessors.getAlignmentLookup(ruleData), alignmentId);
+}
+/**
+ *
+ * @param lifeStyleId
+ * @param ruleData
+ */
+export function generateLifestyle(lifeStyleId, ruleData) {
+    if (lifeStyleId === null) {
+        return null;
+    }
+    return HelperUtils.lookupDataOrFallback(RuleDataAccessors.getLifestyleLookup(ruleData), lifeStyleId);
+}
+/**
+ *
+ * @param race
+ */
+export function generateSize(race) {
+    if (race === null) {
+        return null;
+    }
+    return RaceAccessors.getSizeInfo(race);
+}
+/**
+ *
+ * @param traitsContract
+ */
+export function generateCharacterTraits(traitsContract) {
+    if (traitsContract !== null) {
+        return traitsContract;
+    }
+    return {
+        appearance: null,
+        bonds: null,
+        flaws: null,
+        ideals: null,
+        personalityTraits: null,
+    };
+}
+/**
+ *
+ * @param notesContract
+ */
+export function generateCharacterNotes(notesContract) {
+    if (notesContract !== null) {
+        return notesContract;
+    }
+    return {
+        allies: null,
+        backstory: null,
+        enemies: null,
+        organizations: null,
+        otherHoldings: null,
+        otherNotes: null,
+        personalPossessions: null,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Configuration.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Configuration.js
new file mode 100644
index 0000000..acbdde6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Configuration.js
@@ -0,0 +1,74 @@
+import { MovementTypeEnum, PreferenceAbilityScoreDisplayTypeEnum, PreferenceEncumbranceTypeEnum, PreferenceHitPointTypeEnum, PreferencePrivacyTypeEnum, PreferenceProgressionTypeEnum, PreferenceSharingTypeEnum, SenseTypeEnum, } from '../../Core';
+/**
+ *
+ * @param race
+ * @param classes
+ * @param stats
+ * @param configuration
+ */
+export function generateIsCharacterSheetReady(race, classes, stats, configuration) {
+    if (!race) {
+        return false;
+    }
+    if (!classes.length) {
+        return false;
+    }
+    let hasAllStats = true;
+    if (configuration.abilityScoreType === null) {
+        hasAllStats = false;
+    }
+    stats.forEach((stat) => {
+        if (stat.value === null) {
+            hasAllStats = false;
+        }
+    });
+    if (!hasAllStats) {
+        return false;
+    }
+    return true;
+}
+/**
+ *
+ * @param preferencesContract
+ */
+export function generateCharacterPreferences(preferencesContract, featureFlagInfo) {
+    if (preferencesContract !== null) {
+        return preferencesContract;
+    }
+    return {
+        abilityScoreDisplayType: PreferenceAbilityScoreDisplayTypeEnum.MODIFIERS_TOP,
+        enableOptionalClassFeatures: false,
+        enableOptionalOrigins: false,
+        encumbranceType: PreferenceEncumbranceTypeEnum.ENCUMBRANCE,
+        enforceFeatRules: true,
+        enforceMulticlassRules: true,
+        hitPointType: PreferenceHitPointTypeEnum.FIXED,
+        ignoreCoinWeight: true,
+        primaryMovement: MovementTypeEnum.WALK,
+        primarySense: SenseTypeEnum.PASSIVE_PERCEPTION,
+        privacyType: PreferencePrivacyTypeEnum.CAMPAIGN_ONLY,
+        progressionType: PreferenceProgressionTypeEnum.MILESTONE,
+        sharingType: PreferenceSharingTypeEnum.LIMITED,
+        showCompanions: false,
+        showScaledSpells: true,
+        showUnarmedStrike: true,
+        showWildShape: false,
+        enableDarkMode: false,
+        useHomebrewContent: true,
+        enableContainerCurrency: false,
+    };
+}
+/**
+ *
+ * @param configurationContract
+ */
+export function generateCharacterConfiguration(configurationContract) {
+    if (configurationContract !== null) {
+        return configurationContract;
+    }
+    return {
+        abilityScoreType: null,
+        showHelpText: false,
+        startingEquipmentType: null,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Death.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Death.js
new file mode 100644
index 0000000..40ded93
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Death.js
@@ -0,0 +1,41 @@
+import { ModifierValidators } from '../../Modifier';
+import { RuleDataAccessors } from '../../RuleData';
+import { DeathCauseEnum } from '../constants';
+import { deriveAdvantageDeathSavesAdjustments, deriveDisadvantageDeathSavesAdjustments } from '../derivers';
+/**
+ *
+ * @param deathSaves
+ * @param modifiers
+ * @param ruleData
+ */
+export function generateDeathCause(deathSaves, modifiers, ruleData) {
+    const maxDeathsavesFail = RuleDataAccessors.getMaxDeathsavesFail(ruleData);
+    if (deathSaves !== null && deathSaves.failCount !== null && deathSaves.failCount >= maxDeathsavesFail) {
+        return DeathCauseEnum.DEATHSAVES;
+    }
+    if (modifiers.find((modifier) => ModifierValidators.isSetDeathModifier(modifier))) {
+        return DeathCauseEnum.CONDITION;
+    }
+    return DeathCauseEnum.NONE;
+}
+/**
+ *
+ * @param deathCause
+ */
+export function generateIsDead(deathCause) {
+    return deathCause !== DeathCauseEnum.NONE;
+}
+/**
+ *
+ * @param deathSaveContract
+ * @param modifiers
+ */
+export function generateDeathSaveInfo(deathSaveContract, modifiers) {
+    return {
+        failCount: deathSaveContract !== null && deathSaveContract.failCount !== null ? deathSaveContract.failCount : 0,
+        successCount: deathSaveContract !== null && deathSaveContract.successCount !== null ? deathSaveContract.successCount : 0,
+        isStabilized: deathSaveContract === null ? false : deathSaveContract.isStabilized,
+        advantageAdjustments: deriveAdvantageDeathSavesAdjustments(modifiers),
+        disadvantageAdjustments: deriveDisadvantageDeathSavesAdjustments(modifiers),
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Defenses.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Defenses.js
new file mode 100644
index 0000000..ef55922
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Defenses.js
@@ -0,0 +1,221 @@
+import { TypeScriptUtils } from '../../../utils';
+import { ConditionAccessors } from '../../Condition';
+import { DamageAdjustmentTypeEnum, DefenseAdjustmentTypeEnum } from '../../Core';
+import { FormatUtils } from '../../Format';
+import { HelperUtils } from '../../Helper';
+import { ModifierAccessors } from '../../Modifier';
+import { RuleDataAccessors, RuleDataUtils } from '../../RuleData';
+import { deriveCustomConditionDefenseAdjustmentDataOrigin, deriveCustomDefenseAdjustmentDataOrigin } from '../derivers';
+import { isImmunityDamageAdjustment, isResistanceDamageAdjustment, isVulnerabilityDamageAdjustment, } from '../validators';
+/**
+ *
+ * @param customDamageAdjustments
+ * @param modifiers
+ * @param ruleData
+ */
+export function generateActiveResistances(customDamageAdjustments, modifiers, ruleData) {
+    const damageAdjustments = [];
+    customDamageAdjustments.forEach((adjustment) => {
+        damageAdjustments.push({
+            name: adjustment.name === null ? '' : adjustment.name,
+            dataOrigin: deriveCustomDefenseAdjustmentDataOrigin(adjustment),
+            isCustom: true,
+            type: DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT,
+            slug: FormatUtils.slugify(adjustment.name),
+        });
+    });
+    modifiers.forEach((modifier) => {
+        const damageAdjustment = RuleDataUtils.getDamageAdjustmentBySlug(ModifierAccessors.getSubType(modifier), DamageAdjustmentTypeEnum.RESISTANCE, ruleData);
+        let name = '';
+        if (damageAdjustment) {
+            name = damageAdjustment.name === null ? '' : damageAdjustment.name;
+        }
+        else {
+            const subtypeName = ModifierAccessors.getFriendlySubtypeName(modifier);
+            name = subtypeName === null ? '' : subtypeName;
+        }
+        damageAdjustments.push({
+            name,
+            dataOrigin: ModifierAccessors.getDataOrigin(modifier),
+            isCustom: false,
+            type: DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT,
+            slug: FormatUtils.slugify(name),
+        });
+    });
+    return damageAdjustments;
+}
+/**
+ *
+ * @param customDamageAdjustments
+ * @param customConditionAdjustments
+ * @param modifiers
+ * @param ruleData
+ */
+export function generateActiveImmunities(customDamageAdjustments, customConditionAdjustments, modifiers, ruleData) {
+    const defenseAdjustments = [];
+    customDamageAdjustments.forEach((adjustment) => {
+        defenseAdjustments.push({
+            name: adjustment.name === null ? '' : adjustment.name,
+            dataOrigin: deriveCustomDefenseAdjustmentDataOrigin(adjustment),
+            isCustom: true,
+            type: DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT,
+            slug: FormatUtils.slugify(adjustment.name),
+        });
+    });
+    customConditionAdjustments.forEach((adjustment) => {
+        defenseAdjustments.push({
+            name: ConditionAccessors.getName(adjustment),
+            dataOrigin: deriveCustomConditionDefenseAdjustmentDataOrigin(adjustment),
+            isCustom: true,
+            type: DefenseAdjustmentTypeEnum.CONDITION_ADJUSTMENT,
+            slug: FormatUtils.slugify(ConditionAccessors.getName(adjustment)),
+        });
+    });
+    modifiers.forEach((modifier) => {
+        const damageAdjustment = RuleDataUtils.getDamageAdjustmentBySlug(ModifierAccessors.getSubType(modifier), DamageAdjustmentTypeEnum.IMMUNITY, ruleData);
+        if (damageAdjustment) {
+            defenseAdjustments.push({
+                name: damageAdjustment.name === null ? '' : damageAdjustment.name,
+                dataOrigin: ModifierAccessors.getDataOrigin(modifier),
+                isCustom: false,
+                type: DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT,
+                slug: FormatUtils.slugify(damageAdjustment.name),
+            });
+            return;
+        }
+        const condition = RuleDataUtils.getConditionBySlug(ModifierAccessors.getSubType(modifier), ruleData);
+        if (condition) {
+            defenseAdjustments.push({
+                name: ConditionAccessors.getName(condition),
+                dataOrigin: ModifierAccessors.getDataOrigin(modifier),
+                isCustom: false,
+                type: DefenseAdjustmentTypeEnum.CONDITION_ADJUSTMENT,
+                slug: ConditionAccessors.getSlug(condition),
+            });
+            return;
+        }
+        const subtypeName = ModifierAccessors.getFriendlySubtypeName(modifier);
+        defenseAdjustments.push({
+            name: subtypeName === null ? '' : subtypeName,
+            dataOrigin: ModifierAccessors.getDataOrigin(modifier),
+            isCustom: false,
+            type: DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT,
+            slug: FormatUtils.slugify(ModifierAccessors.getFriendlySubtypeName(modifier)),
+        });
+    });
+    return defenseAdjustments;
+}
+/**
+ *
+ * @param customDamageAdjustments
+ * @param modifiers
+ * @param ruleData
+ */
+export function generateActiveVulnerabilities(customDamageAdjustments, modifiers, ruleData) {
+    const damageAdjustments = [];
+    customDamageAdjustments.forEach((adjustment) => {
+        damageAdjustments.push({
+            name: adjustment.name === null ? '' : adjustment.name,
+            dataOrigin: deriveCustomDefenseAdjustmentDataOrigin(adjustment),
+            isCustom: true,
+            type: DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT,
+            slug: FormatUtils.slugify(adjustment.name),
+        });
+    });
+    modifiers.forEach((modifier) => {
+        let name;
+        const damageAdjustment = RuleDataUtils.getDamageAdjustmentBySlug(ModifierAccessors.getSubType(modifier), DamageAdjustmentTypeEnum.VULNERABILITY, ruleData);
+        if (damageAdjustment) {
+            name = damageAdjustment.name;
+        }
+        else {
+            name = ModifierAccessors.getFriendlySubtypeName(modifier);
+        }
+        damageAdjustments.push({
+            name,
+            dataOrigin: ModifierAccessors.getDataOrigin(modifier),
+            isCustom: false,
+            type: DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT,
+            slug: FormatUtils.slugify(name),
+        });
+    });
+    return damageAdjustments;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function generateResistanceData(ruleData) {
+    return RuleDataAccessors.getDamageAdjustments(ruleData).filter(isResistanceDamageAdjustment);
+}
+/**
+ *
+ * @param ruleData
+ */
+export function generateVulnerabilityData(ruleData) {
+    return RuleDataAccessors.getDamageAdjustments(ruleData).filter(isVulnerabilityDamageAdjustment);
+}
+/**
+ *
+ * @param ruleData
+ */
+export function generateImmunityData(ruleData) {
+    return RuleDataAccessors.getDamageAdjustments(ruleData).filter(isImmunityDamageAdjustment);
+}
+/**
+ *
+ * @param customDamageAdjustments
+ */
+export function generateCustomResistanceDamageAdjustments(customDamageAdjustments) {
+    return customDamageAdjustments.filter(isResistanceDamageAdjustment);
+}
+/**
+ *
+ * @param customDamageAdjustments
+ */
+export function generateCustomImmunityDamageAdjustments(customDamageAdjustments) {
+    return customDamageAdjustments.filter(isImmunityDamageAdjustment);
+}
+/**
+ *
+ * @param customDamageAdjustments
+ */
+export function generateCustomVulnerabilityDamageAdjustments(customDamageAdjustments) {
+    return customDamageAdjustments.filter(isVulnerabilityDamageAdjustment);
+}
+/**
+ *
+ * @param customDefenseAdjustments
+ * @param ruleData
+ */
+export function generateCustomDamageAdjustments(customDefenseAdjustments, ruleData) {
+    const damageAdjustmentLookup = RuleDataAccessors.getDamageAdjustmentsLookup(ruleData);
+    return customDefenseAdjustments
+        .filter((adjustment) => adjustment.type === DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT)
+        .map((adjustment) => {
+        const damageAdjustmentData = HelperUtils.lookupDataOrFallback(damageAdjustmentLookup, adjustment.adjustmentId);
+        if (damageAdjustmentData !== null) {
+            return Object.assign(Object.assign({}, damageAdjustmentData), { source: adjustment.source === null ? '' : adjustment.source });
+        }
+        return null;
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param customDefenseAdjustments
+ * @param ruleData
+ */
+export function generateCustomConditionAdjustments(customDefenseAdjustments, ruleData) {
+    const conditionDataLookup = RuleDataAccessors.getConditionLookup(ruleData);
+    return customDefenseAdjustments
+        .filter((adjustment) => adjustment.type === DefenseAdjustmentTypeEnum.CONDITION_ADJUSTMENT)
+        .map((adjustment) => {
+        const conditionData = HelperUtils.lookupDataOrFallback(conditionDataLookup, adjustment.adjustmentId);
+        if (conditionData !== null) {
+            return Object.assign(Object.assign({}, conditionData), { source: adjustment.source === null ? '' : adjustment.source });
+        }
+        return null;
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/HitPoints.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/HitPoints.js
new file mode 100644
index 0000000..e0bbc53
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/HitPoints.js
@@ -0,0 +1,314 @@
+import { AbilityAccessors } from '../../Ability';
+import { ActionAccessors } from '../../Action';
+import { ClassAccessors } from '../../Class';
+import { ClassFeatureAccessors } from '../../ClassFeature';
+import { AbilityStatEnum, PreferenceHitPointTypeEnum } from '../../Core';
+import { DataOriginTypeEnum } from '../../DataOrigin';
+import { DiceUtils } from '../../Dice';
+import { EntityUtils } from '../../Entity';
+import { FeatAccessors } from '../../Feat';
+import { HelperUtils } from '../../Helper';
+import { ItemAccessors } from '../../Item';
+import { ModifierAccessors, ModifierDerivers, ModifierValidators } from '../../Modifier';
+import { RaceAccessors } from '../../Race';
+import { RacialTraitAccessors } from '../../RacialTrait';
+import { RuleDataAccessors } from '../../RuleData';
+import { ProtectionSupplierTypeEnum } from '../constants';
+import { deriveItemProtectionSupplierAvailabilityStatus, deriveProtectionSupplierAvailabilityStatus, } from '../derivers';
+/**
+ *
+ * @param hitPointParts
+ * @param currentLevel
+ * @param classes
+ * @param abilityLookup
+ * @param raceModifiers
+ * @param classesModifiers
+ * @param miscModifiers
+ * @param globalModifiers
+ * @param preferences
+ * @param ruleData
+ */
+export function generateHitPointInfo(hitPointParts, currentLevel, classes, abilityLookup, raceModifiers, classesModifiers, miscModifiers, globalModifiers, preferences, ruleData) {
+    return getHitPointInfo(hitPointParts.baseHp, hitPointParts.overrideHp, hitPointParts.bonusHp, hitPointParts.tempHp, hitPointParts.removedHp, currentLevel, classes, abilityLookup, raceModifiers, classesModifiers, miscModifiers, globalModifiers, preferences, ruleData);
+}
+/**
+ * //TODO better naming that fits generator convention
+ * @param baseHp
+ * @param overrideHp
+ * @param bonusHp
+ * @param tempHp
+ * @param removedHp
+ * @param currentLevel
+ * @param classes
+ * @param abilityLookup
+ * @param raceModifiers
+ * @param classesModifiers
+ * @param miscModifiers
+ * @param globalModifiers
+ * @param preferences
+ * @param ruleData
+ */
+export function getHitPointInfo(baseHp, overrideHp, bonusHp, tempHp, removedHp, currentLevel, classes, abilityLookup, raceModifiers, classesModifiers, miscModifiers, globalModifiers, preferences, ruleData) {
+    const classesHitDice = classes.map((charClass) => ({
+        dice: {
+            diceCount: ClassAccessors.getLevel(charClass),
+            diceValue: ClassAccessors.getHitDiceType(charClass),
+            diceMultiplier: null,
+            diceString: null,
+            fixedValue: null,
+        },
+        charClass,
+    }));
+    const hitPointSources = [];
+    let conStat;
+    let conStatModifier;
+    if (Object.keys(abilityLookup).length) {
+        conStat = abilityLookup[AbilityStatEnum.CONSTITUTION] || 0;
+        conStatModifier = AbilityAccessors.getModifier(conStat);
+    }
+    if (conStatModifier) {
+        const source = AbilityAccessors.getLabel(conStat);
+        hitPointSources.push({
+            amount: currentLevel * conStatModifier,
+            source: source === null ? 'UNK' : source,
+        });
+    }
+    const racialHpPerLevelModifiers = raceModifiers.filter((modifier) => ModifierValidators.isBonusHitPointsPerLevelModifier(modifier));
+    const classesHpPerLevelModifiers = classesModifiers.filter((modifier) => ModifierValidators.isBonusHitPointsPerLevelModifier(modifier));
+    const miscHpPerLevelModifiers = miscModifiers.filter((modifier) => ModifierValidators.isBonusHitPointsPerLevelModifier(modifier));
+    if (racialHpPerLevelModifiers.length) {
+        racialHpPerLevelModifiers.reduce((acc, modifier) => {
+            const value = ModifierAccessors.getValue(modifier);
+            if (value !== null) {
+                acc.push({
+                    amount: currentLevel * value,
+                    source: EntityUtils.getDataOriginName(ModifierAccessors.getDataOrigin(modifier)),
+                });
+            }
+            return acc;
+        }, hitPointSources);
+    }
+    if (classesHpPerLevelModifiers.length) {
+        classesHpPerLevelModifiers.reduce((acc, modifier) => {
+            const value = ModifierAccessors.getValue(modifier);
+            const dataOrigin = ModifierAccessors.getDataOrigin(modifier);
+            const dataOriginType = ModifierAccessors.getDataOriginType(modifier);
+            if (dataOriginType === DataOriginTypeEnum.CLASS_FEATURE && value !== null) {
+                acc.push({
+                    amount: ClassAccessors.getLevel(dataOrigin.parent) * value,
+                    source: EntityUtils.getDataOriginName(ModifierAccessors.getDataOrigin(modifier)),
+                });
+            }
+            return acc;
+        }, hitPointSources);
+    }
+    if (miscHpPerLevelModifiers.length) {
+        miscHpPerLevelModifiers.reduce((acc, modifier) => {
+            const value = ModifierAccessors.getValue(modifier);
+            if (value !== null) {
+                acc.push({
+                    amount: currentLevel * value,
+                    source: EntityUtils.getDataOriginName(ModifierAccessors.getDataOrigin(modifier)),
+                });
+            }
+            return acc;
+        }, hitPointSources);
+    }
+    const globalBonusHpModifiers = globalModifiers.filter((modifier) => ModifierValidators.isBonusHitPointsModifier(modifier));
+    if (globalBonusHpModifiers.length) {
+        globalBonusHpModifiers.reduce((acc, modifier) => {
+            const statId = ModifierAccessors.getStatId(modifier);
+            if (statId !== null) {
+                const stat = HelperUtils.lookupDataOrFallback(abilityLookup, statId);
+                if (stat !== null) {
+                    const statModifier = AbilityAccessors.getModifier(stat);
+                    acc.push({
+                        amount: statModifier === null ? 0 : statModifier,
+                        source: EntityUtils.getDataOriginName(ModifierAccessors.getDataOrigin(modifier)),
+                    });
+                }
+            }
+            else {
+                const hpIncrease = ModifierAccessors.getValue(modifier);
+                if (!!hpIncrease) {
+                    acc.push({
+                        amount: hpIncrease,
+                        source: EntityUtils.getDataOriginName(ModifierAccessors.getDataOrigin(modifier)),
+                    });
+                }
+            }
+            return acc;
+        }, hitPointSources);
+    }
+    const totalHitPointSources = hitPointSources.reduce((acc, hitPointSource) => (acc += hitPointSource.amount), 0);
+    const totalAvgClassHitDie = classes.reduce((acc, charClass) => {
+        const hitDiceType = ClassAccessors.getHitDiceType(charClass);
+        const level = ClassAccessors.getLevel(charClass);
+        if (ClassAccessors.isStartingClass(charClass)) {
+            acc += hitDiceType;
+            acc += Math.floor((level - 1) * DiceUtils.getAverageDieValue(hitDiceType));
+        }
+        else {
+            acc += Math.floor(level * DiceUtils.getAverageDieValue(hitDiceType));
+        }
+        return acc;
+    }, 0);
+    const totalFixedClassHitDie = classes.reduce((acc, charClass) => {
+        const hitDiceType = ClassAccessors.getHitDiceType(charClass);
+        const level = ClassAccessors.getLevel(charClass);
+        if (ClassAccessors.isStartingClass(charClass)) {
+            acc += hitDiceType;
+            acc += (level - 1) * DiceUtils.getFixedDieValue(hitDiceType);
+        }
+        else {
+            acc += level * DiceUtils.getFixedDieValue(hitDiceType);
+        }
+        return acc;
+    }, 0);
+    const totalClassHitDieMax = classes.reduce((acc, charClass) => (acc += ClassAccessors.getLevel(charClass) * ClassAccessors.getHitDiceType(charClass)), 0);
+    const totalFixedValueHp = totalFixedClassHitDie + totalHitPointSources;
+    const totalAverageHp = totalAvgClassHitDie + totalHitPointSources;
+    const possibleMaxHitPoints = totalClassHitDieMax + totalHitPointSources;
+    let finalBaseHp = baseHp;
+    if (preferences && preferences.hitPointType === PreferenceHitPointTypeEnum.FIXED) {
+        finalBaseHp = totalFixedClassHitDie;
+    }
+    const baseTotalHp = finalBaseHp + totalHitPointSources;
+    let totalHp = baseTotalHp + (bonusHp ? bonusHp : 0);
+    if (overrideHp !== null) {
+        totalHp = overrideHp;
+    }
+    const finalTotalHp = Math.max(totalHp, RuleDataAccessors.getMinimumHpTotal(ruleData));
+    const finalRemovedHp = Math.min(finalTotalHp, removedHp);
+    return {
+        baseHp: finalBaseHp,
+        baseTotalHp,
+        bonusHp,
+        classesHitDice,
+        hitPointSources,
+        overrideHp,
+        possibleMaxHitPoints,
+        remainingHp: finalTotalHp - finalRemovedHp,
+        removedHp: finalRemovedHp,
+        tempHp,
+        totalAverageHp,
+        totalFixedValueHp,
+        totalHitPointSources,
+        totalHp: finalTotalHp,
+    };
+}
+/**
+ *
+ * @param classes
+ * @param race
+ * @param feats
+ * @param items
+ * @param modifierData
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ * @param characterId
+ */
+export function generateProtectionSuppliers(classes, race, feats, items, modifierData, abilityLookup, ruleData, proficiencyBonus, characterId) {
+    let protectionSuppliers = [];
+    if (race !== null) {
+        RaceAccessors.getRacialTraits(race).forEach((racialTrait) => {
+            const modifiers = RacialTraitAccessors.getModifiers(racialTrait);
+            const foundProtectionModifier = modifiers.find(ModifierValidators.isProtectionZeroHpModifier);
+            if (!foundProtectionModifier) {
+                return;
+            }
+            const actions = RacialTraitAccessors.getActions(racialTrait);
+            if (actions.length !== 1) {
+                return;
+            }
+            const action = actions[0];
+            const limitedUse = ActionAccessors.getLimitedUse(action);
+            if (!limitedUse) {
+                return;
+            }
+            protectionSuppliers.push({
+                type: ProtectionSupplierTypeEnum.RACIAL_TRAIT,
+                data: racialTrait,
+                modifier: foundProtectionModifier,
+                setHpValue: ModifierDerivers.deriveValue(foundProtectionModifier, modifierData),
+                key: [ProtectionSupplierTypeEnum.RACIAL_TRAIT, RacialTraitAccessors.getUniqueKey(racialTrait)].join('-'),
+                availabilityStatus: deriveProtectionSupplierAvailabilityStatus(limitedUse, abilityLookup, ruleData, proficiencyBonus),
+                action,
+            });
+        });
+    }
+    classes.forEach((charClass) => {
+        ClassAccessors.getClassFeatures(charClass).forEach((classFeature) => {
+            const modifiers = ClassFeatureAccessors.getModifiers(classFeature);
+            const foundProtectionModifier = modifiers.find(ModifierValidators.isProtectionZeroHpModifier);
+            if (!foundProtectionModifier) {
+                return;
+            }
+            const actions = ClassFeatureAccessors.getActions(classFeature);
+            if (actions.length !== 1) {
+                return;
+            }
+            const action = actions[0];
+            const limitedUse = ActionAccessors.getLimitedUse(action);
+            if (!limitedUse) {
+                return;
+            }
+            protectionSuppliers.push({
+                type: ProtectionSupplierTypeEnum.CLASS_FEATURE,
+                data: classFeature,
+                modifier: foundProtectionModifier,
+                setHpValue: ModifierDerivers.deriveValue(foundProtectionModifier, modifierData),
+                key: [ProtectionSupplierTypeEnum.CLASS_FEATURE, ClassFeatureAccessors.getUniqueKey(classFeature)].join('-'),
+                availabilityStatus: deriveProtectionSupplierAvailabilityStatus(limitedUse, abilityLookup, ruleData, proficiencyBonus),
+                action,
+            });
+        });
+    });
+    feats.forEach((feat) => {
+        const modifiers = FeatAccessors.getModifiers(feat);
+        const foundProtectionModifier = modifiers.find(ModifierValidators.isProtectionZeroHpModifier);
+        if (!foundProtectionModifier) {
+            return;
+        }
+        const actions = FeatAccessors.getActions(feat);
+        if (actions.length !== 1) {
+            return;
+        }
+        const action = actions[0];
+        const limitedUse = ActionAccessors.getLimitedUse(action);
+        if (!limitedUse) {
+            return;
+        }
+        protectionSuppliers.push({
+            type: ProtectionSupplierTypeEnum.FEAT,
+            data: feat,
+            modifier: foundProtectionModifier,
+            setHpValue: ModifierDerivers.deriveValue(foundProtectionModifier, modifierData),
+            key: [ProtectionSupplierTypeEnum.FEAT, FeatAccessors.getUniqueKey(feat)].join('-'),
+            availabilityStatus: deriveProtectionSupplierAvailabilityStatus(limitedUse, abilityLookup, ruleData, proficiencyBonus),
+            action,
+        });
+    });
+    items.forEach((item) => {
+        const modifiers = ItemAccessors.getModifiers(item);
+        const foundProtectionModifier = modifiers.find(ModifierValidators.isProtectionZeroHpModifier);
+        if (!foundProtectionModifier) {
+            return;
+        }
+        const limitedUse = ItemAccessors.getLimitedUse(item);
+        if (limitedUse === null) {
+            return;
+        }
+        protectionSuppliers.push({
+            type: ProtectionSupplierTypeEnum.ITEM,
+            data: item,
+            modifier: foundProtectionModifier,
+            setHpValue: ModifierDerivers.deriveValue(foundProtectionModifier, modifierData),
+            key: [ProtectionSupplierTypeEnum.ITEM, ItemAccessors.getUniqueKey(item)].join('-'),
+            availabilityStatus: deriveItemProtectionSupplierAvailabilityStatus(item, foundProtectionModifier, limitedUse, abilityLookup, ruleData, proficiencyBonus, characterId),
+            action: null,
+        });
+    });
+    return protectionSuppliers;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Initiative.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Initiative.js
new file mode 100644
index 0000000..14d65cc
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Initiative.js
@@ -0,0 +1,58 @@
+import { AbilityAccessors } from '../../Ability';
+import { AbilityStatEnum } from '../../Core';
+import { ModifierBonusTypeEnum, ModifierDerivers, ModifierUtils, ModifierValidators } from '../../Modifier';
+/**
+ *
+ * @param modifiers
+ * @param abilityLookup
+ * @param profBonus
+ */
+export function getInitiative(modifiers, abilityLookup, profBonus) {
+    const bonusInitiativeModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusInitiativeModifier(modifier));
+    const bonusInitiativeModifierTotal = abilityLookup
+        ? ModifierDerivers.sumModifiers(bonusInitiativeModifiers, abilityLookup)
+        : 0;
+    const includeProficiencyBonus = ModifierUtils.countModifierBonusTypes(bonusInitiativeModifiers, ModifierBonusTypeEnum.PROFICIENCY_BONUS) > 0;
+    let halfProficiency = false;
+    if (modifiers.filter((modifier) => ModifierValidators.isHalfProficiencyInitiativeModifier(modifier)).length) {
+        halfProficiency = true;
+    }
+    let halfProficiencyRoundUp = false;
+    if (modifiers.filter((modifier) => ModifierValidators.isHalfProficiencyRoundUpInitiativeModifier(modifier)).length) {
+        halfProficiencyRoundUp = true;
+    }
+    let modifierProficiencyBonus = 0;
+    if (includeProficiencyBonus) {
+        modifierProficiencyBonus = profBonus;
+    }
+    else if (halfProficiencyRoundUp) {
+        modifierProficiencyBonus = Math.ceil(profBonus / 2);
+    }
+    else if (halfProficiency) {
+        modifierProficiencyBonus = Math.floor(profBonus / 2);
+    }
+    let dexAbility;
+    let dexAbilityModifier;
+    if (Object.keys(abilityLookup).length) {
+        dexAbility = abilityLookup[AbilityStatEnum.DEXTERITY];
+        dexAbilityModifier = AbilityAccessors.getModifier(dexAbility) || 0;
+    }
+    return dexAbilityModifier + bonusInitiativeModifierTotal + modifierProficiencyBonus;
+}
+/**
+ *
+ * @param processedInitiative
+ * @param initiativeScore
+ *
+ * @returns number
+ */
+export function getStaticInitiative(processedInitiative, initiativeScore) {
+    return processedInitiative + initiativeScore.amount;
+}
+/**
+ * //TODO use array.some prototype
+ * @param modifiers
+ */
+export function generateHasInitiativeAdvantage(modifiers) {
+    return modifiers.filter((modifier) => ModifierValidators.isAdvantageInitiativeModifier(modifier)).length > 0;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Language.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Language.js
new file mode 100644
index 0000000..71fb831
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Language.js
@@ -0,0 +1,12 @@
+import { TypeScriptUtils } from '../../../utils';
+import { ModifierAccessors, ModifierValidators } from '../../Modifier';
+/**
+ *
+ * @param modifiers
+ */
+export function generateLanguages(modifiers) {
+    return modifiers
+        .filter((modifier) => ModifierValidators.isLanguageModifier(modifier))
+        .map((modifier) => ModifierAccessors.getFriendlySubtypeName(modifier))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Proficiency.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Proficiency.js
new file mode 100644
index 0000000..d648a0a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Proficiency.js
@@ -0,0 +1,169 @@
+import { orderBy } from 'lodash';
+import { EntityUtils } from '../../Entity';
+import { HelperUtils } from '../../Helper';
+import { ModifierAccessors, ModifierValidators } from '../../Modifier';
+import { RuleDataAccessors, RuleDataUtils } from '../../RuleData';
+import { AdjustmentTypeEnum, ProficiencyAdjustmentTypeEnum, ValueAccessors, ValueUtils, } from '../../Value';
+import { deriveProficiencyBonus } from '../derivers';
+import { isCustomSkillProficiency } from '../validators';
+/**
+ *
+ * @param typeValueLookup
+ * @param modifiers
+ */
+export function generateProficiencyLookup(typeValueLookup, modifiers) {
+    let proficiencyLookup = {};
+    ProficiencyAdjustmentTypeEnum.forEach((typeId) => {
+        const values = ValueUtils.getTypeData(typeValueLookup, typeId);
+        values.forEach((value) => {
+            proficiencyLookup = Object.assign(Object.assign({}, proficiencyLookup), { [ValueAccessors.getEntityKey(value)]: 1 });
+        });
+    });
+    modifiers
+        .filter((modifier) => ModifierValidators.isProficiencyModifier(modifier) && ModifierAccessors.getEntityId(modifier))
+        .forEach((modifier) => {
+        proficiencyLookup = Object.assign(Object.assign({}, proficiencyLookup), { [ModifierAccessors.getEntityKey(modifier)]: 1 });
+    });
+    return proficiencyLookup;
+}
+/**
+ *
+ * @param currentLevel
+ * @param modifiers
+ * @param ruleData
+ */
+export function generateProficiencyBonus(currentLevel, modifiers, ruleData) {
+    return deriveProficiencyBonus(currentLevel, modifiers, ruleData);
+}
+/**
+ *
+ * @param customProficiencies
+ * @param valueLookupByType
+ * @param modifiers
+ * @param ruleData
+ */
+export function generateProficiencyGroups(customProficiencies, valueLookupByType, modifiers, ruleData) {
+    const decoratedProficiencyGroups = RuleDataAccessors.getProficiencyGroups(ruleData).map((group) => (Object.assign(Object.assign({}, group), { modifiers: [], custom: [], values: [] })));
+    const proficiencyGroupLookup = {};
+    const customProficiencyGroupLookup = {};
+    const customAdjustmentGroupLookup = {};
+    decoratedProficiencyGroups.forEach((group, groupIdx) => {
+        if (group.entityTypeIds !== null) {
+            group.entityTypeIds.forEach((entityTypeId) => {
+                proficiencyGroupLookup[entityTypeId] = groupIdx;
+            });
+        }
+        if (group.customAdjustments !== null) {
+            group.customAdjustments.forEach((adjustmentTypeId) => {
+                customAdjustmentGroupLookup[adjustmentTypeId] = groupIdx;
+            });
+        }
+        customProficiencyGroupLookup[group.customProficiencyGroup] = groupIdx;
+    });
+    modifiers.forEach((modifier) => {
+        const entityTypeId = ModifierAccessors.getEntityTypeId(modifier);
+        const isMasteryModifier = ModifierValidators.isValidWeaponMasteryModifier(modifier);
+        if (entityTypeId !== null && !isMasteryModifier) {
+            const groupLookupIdx = proficiencyGroupLookup[entityTypeId];
+            if (typeof groupLookupIdx !== 'undefined') {
+                decoratedProficiencyGroups[groupLookupIdx].modifiers.push(modifier);
+            }
+        }
+    });
+    customProficiencies.forEach((proficiency) => {
+        const groupLookupIdx = customProficiencyGroupLookup[proficiency.type];
+        if (typeof groupLookupIdx !== 'undefined') {
+            decoratedProficiencyGroups[groupLookupIdx].custom.push(proficiency);
+        }
+    });
+    Object.keys(customAdjustmentGroupLookup).forEach((adjustmentTypeId) => {
+        if (valueLookupByType.hasOwnProperty(adjustmentTypeId)) {
+            const groupLookupIdx = customAdjustmentGroupLookup[adjustmentTypeId];
+            decoratedProficiencyGroups[groupLookupIdx].values.push(...valueLookupByType[adjustmentTypeId]);
+        }
+    });
+    const proficiencyGroups = decoratedProficiencyGroups.map((group) => {
+        if (group.label === 'Weapons') {
+            RuleDataAccessors.getWeaponCategories(ruleData).forEach((category) => {
+                if (group.modifiers.find((modifier) => ModifierValidators.isValidProficiencyWeaponCategoryModifier(modifier, category))) {
+                    group.modifiers = group.modifiers.filter((modifier) => {
+                        const weapon = RuleDataUtils.getWeaponByEntityId(ModifierAccessors.getEntityId(modifier), ModifierAccessors.getEntityTypeId(modifier), ruleData);
+                        return !weapon || (weapon && weapon.categoryId !== category.id);
+                    });
+                }
+            });
+        }
+        const uniqueProficiencyGroups = {};
+        group.modifiers.forEach((modifier) => {
+            const friendlySubTypeName = ModifierAccessors.getFriendlySubtypeName(modifier);
+            if (friendlySubTypeName !== null) {
+                if (!uniqueProficiencyGroups.hasOwnProperty(friendlySubTypeName)) {
+                    uniqueProficiencyGroups[friendlySubTypeName] = {
+                        label: friendlySubTypeName,
+                        sources: [],
+                        restriction: ModifierAccessors.getRestriction(modifier),
+                    };
+                }
+                uniqueProficiencyGroups[friendlySubTypeName].sources.push(EntityUtils.getDataOriginName(ModifierAccessors.getDataOrigin(modifier), undefined, true));
+            }
+        });
+        group.custom.forEach((proficiency) => {
+            const proficiencyName = proficiency.name;
+            if (proficiencyName !== null) {
+                if (!uniqueProficiencyGroups.hasOwnProperty(proficiencyName)) {
+                    uniqueProficiencyGroups[proficiencyName] = {
+                        label: proficiencyName,
+                        sources: [],
+                    };
+                }
+                if (proficiency.notes !== null) {
+                    uniqueProficiencyGroups[proficiencyName].sources.push(proficiency.notes);
+                }
+            }
+        });
+        const armorNameLookup = RuleDataUtils.getArmorNameLookup(ruleData);
+        const weaponNameLookup = RuleDataUtils.getWeaponNameLookup(ruleData);
+        const toolNameLookup = RuleDataUtils.getToolNameLookup(ruleData);
+        group.values.forEach((charValue) => {
+            let name = '';
+            const valueId = ValueAccessors.getValueIntId(charValue);
+            const notes = ValueAccessors.getNotes(charValue);
+            if (valueId !== null) {
+                switch (ValueAccessors.getTypeId(charValue)) {
+                    case AdjustmentTypeEnum.ARMOR_PROFICIENCY_LEVEL:
+                        name = armorNameLookup[valueId];
+                        break;
+                    case AdjustmentTypeEnum.WEAPON_PROFICIENCY_LEVEL:
+                        name = weaponNameLookup[valueId];
+                        break;
+                    case AdjustmentTypeEnum.TOOL_PROFICIENCY_LEVEL:
+                        name = toolNameLookup[valueId];
+                        break;
+                    case AdjustmentTypeEnum.LANGUAGE_PROFICIENCY_LEVEL:
+                        name = RuleDataUtils.getLanguageName(valueId, ruleData);
+                        break;
+                    default:
+                    // not implemented
+                }
+            }
+            if (!uniqueProficiencyGroups.hasOwnProperty(name)) {
+                uniqueProficiencyGroups[name] = {
+                    label: name,
+                    sources: [],
+                };
+            }
+            uniqueProficiencyGroups[name].sources.push(notes ? notes : 'Custom');
+        });
+        return Object.assign(Object.assign({}, group), { modifierGroups: orderBy(HelperUtils.convertObjectToArray(uniqueProficiencyGroups), [
+                (modifierGroup) => modifierGroup.label,
+            ]) });
+    });
+    return proficiencyGroups;
+}
+/**
+ *
+ * @param proficiencies
+ */
+export function generateCustomSkillProficiencies(proficiencies) {
+    return proficiencies.filter(isCustomSkillProficiency);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Progression.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Progression.js
new file mode 100644
index 0000000..26b94f6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Progression.js
@@ -0,0 +1,50 @@
+import { ClassAccessors } from '../../Class';
+import { ClassFeatureAccessors, ClassFeatureUtils } from '../../ClassFeature';
+import { PreferenceProgressionTypeEnum } from '../../Core';
+import { ItemUtils } from '../../Item';
+import { deriveCurrentLevelXp, deriveNextLevelXp, deriveXpLevel } from '../derivers';
+/**
+ *
+ * @param xp
+ * @param preferences
+ * @param totalClassLevel
+ * @param ruleData
+ */
+export function generateCurrentLevel(xp, preferences, totalClassLevel, ruleData) {
+    if (preferences !== null && preferences.progressionType === PreferenceProgressionTypeEnum.XP) {
+        return deriveXpLevel(xp, ruleData);
+    }
+    return totalClassLevel;
+}
+/**
+ *
+ * @param classLevel
+ * @param currentLevel
+ * @param currentLevelXp
+ * @param ruleData
+ */
+export function generateExperienceInfo(classLevel, currentLevel, currentLevelXp, ruleData) {
+    return {
+        classLevel,
+        currentLevel,
+        currentLevelXp,
+        currentLevelStartingXp: deriveCurrentLevelXp(currentLevel, ruleData),
+        nextLevelXp: deriveNextLevelXp(currentLevel, ruleData),
+    };
+}
+/**
+ *
+ * @param classes
+ * @param equippedItems
+ */
+export function generateMartialArtsLevelScale(classes, equippedItems) {
+    if (equippedItems.filter(ItemUtils.isArmorContract).length) {
+        return null;
+    }
+    const martialArtsClass = classes.find((charClass) => ClassAccessors.getClassFeatures(charClass).filter((feature) => ClassFeatureUtils.doesEnableMartialArts(feature)).length > 0);
+    if (martialArtsClass) {
+        const classFeature = ClassAccessors.getClassFeatures(martialArtsClass).find((feature) => ClassFeatureUtils.doesEnableMartialArts(feature));
+        return classFeature ? ClassFeatureAccessors.getLevelScale(classFeature) : null;
+    }
+    return null;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/SavingThrow.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/SavingThrow.js
new file mode 100644
index 0000000..002b2d1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/SavingThrow.js
@@ -0,0 +1,102 @@
+import { groupBy } from 'lodash';
+import { AbilityStatEnum, SaveTypeEnum, SituationalBonusSavingThrowTypeEnum } from '../../Core';
+import { DiceAdjustmentRollTypeEnum, DiceAdjustmentTypeEnum, DiceDerivers } from '../../Dice';
+import { FormatUtils } from '../../Format';
+import { ModifierAccessors, ModifierDerivers, ModifierValidators } from '../../Modifier';
+import { RuleDataAccessors, RuleDataUtils } from '../../RuleData';
+import { deriveSaveTypeName } from '../derivers';
+/**
+ *
+ * @param highestShield
+ * @param modifiers
+ * @param ruleData
+ */
+export function generateSituationalBonusSavingThrows(highestShield, modifiers, ruleData) {
+    const saves = [];
+    RuleDataAccessors.getStats(ruleData).forEach((statData) => {
+        if (statData.id === AbilityStatEnum.DEXTERITY) {
+            const bonusShieldAcModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusShieldAcOnDexSavesModifier(modifier));
+            if (highestShield) {
+                bonusShieldAcModifiers.forEach((modifier) => {
+                    saves.push({
+                        key: ModifierAccessors.getEntityKey(modifier),
+                        statId: statData.id,
+                        value: highestShield.armorClass,
+                        extra: modifier,
+                        type: SituationalBonusSavingThrowTypeEnum.MODIFIER,
+                    });
+                });
+            }
+        }
+    });
+    return saves;
+}
+/**
+ *
+ * @param situationalBonusSavingThrows
+ */
+export function generateSituationalBonusSavingThrowsLookup(situationalBonusSavingThrows) {
+    return groupBy(situationalBonusSavingThrows, 'statId');
+}
+/**
+ *
+ * @param type
+ * @param modifier
+ */
+export function generateSavingThrowModifierSummary(type, modifier) {
+    let tooltipParts = [];
+    if (type === SaveTypeEnum.BONUS) {
+        let valueTotal = ModifierAccessors.getValueTotal(modifier);
+        if (valueTotal) {
+            tooltipParts.push(FormatUtils.renderSignedNumber(valueTotal));
+        }
+    }
+    tooltipParts.push(deriveSaveTypeName(type));
+    let abilityName = ModifierDerivers.deriveSavingThrowModifierAbilityName(modifier);
+    if (abilityName) {
+        tooltipParts.push(`on ${abilityName}`);
+    }
+    else {
+        if (!modifier.restriction) {
+            tooltipParts.push('on saves');
+        }
+    }
+    let restrictionText = ModifierAccessors.getRestriction(modifier);
+    if (restrictionText) {
+        tooltipParts.push(restrictionText);
+    }
+    return tooltipParts.join(' ');
+}
+/**
+ *
+ * @param adjustment
+ * @param ruleData
+ */
+export function generateSavingThrowAdjustmentSummary(adjustment, ruleData) {
+    let tooltipParts = [];
+    if (adjustment.type === DiceAdjustmentTypeEnum.BONUS) {
+        if (adjustment.amount) {
+            tooltipParts.push(FormatUtils.renderSignedNumber(adjustment.amount));
+        }
+    }
+    tooltipParts.push(DiceDerivers.deriveDiceAdjustmentTypeName(adjustment.type));
+    let abilityName = null;
+    if (adjustment.statId) {
+        abilityName = RuleDataUtils.getStatNameById(adjustment.statId, ruleData);
+    }
+    if (abilityName) {
+        tooltipParts.push(`on ${abilityName}`);
+    }
+    else if (adjustment.rollType === DiceAdjustmentRollTypeEnum.DEATH_SAVE) {
+        tooltipParts.push('on death saves');
+    }
+    if (adjustment.restriction) {
+        tooltipParts.push(adjustment.restriction);
+    }
+    else {
+        if (adjustment.rollType === DiceAdjustmentRollTypeEnum.SAVE) {
+            tooltipParts.push('on saves');
+        }
+    }
+    return tooltipParts.join(' ');
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Senses.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Senses.js
new file mode 100644
index 0000000..f77a86b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Senses.js
@@ -0,0 +1,124 @@
+import { keyBy } from 'lodash';
+import { SenseTypeEnum } from '../../Core';
+import { ModifierDerivers, ModifierValidators } from '../../Modifier';
+import { RuleDataUtils } from '../../RuleData';
+import { derivePassiveInsight, derivePassiveInvestigation, derivePassivePerception } from '../derivers';
+/**
+ *
+ * @param senseKey
+ * @param modifiers
+ * @param abilityLookup
+ * @param customSenseLookup
+ */
+export function getSenseDistanceByKeyBonusTakeHighest(senseKey, modifiers, abilityLookup, customSenseLookup) {
+    const customSenseData = customSenseLookup[senseKey];
+    if (customSenseData) {
+        const customDistance = customSenseData.distance;
+        if (customDistance !== null) {
+            return customDistance;
+        }
+    }
+    const typeModifierKey = RuleDataUtils.getSenseTypeModifierKey(senseKey);
+    const setSenseModifiers = modifiers.filter((modifier) => ModifierValidators.isValidSetSenseModifier(modifier, typeModifierKey));
+    if (setSenseModifiers.length) {
+        return ModifierDerivers.deriveHighestModifierValue(setSenseModifiers, abilityLookup);
+    }
+    const baseSenseModifiers = modifiers.filter((modifier) => ModifierValidators.isValidSetBaseSenseModifier(modifier, typeModifierKey));
+    const highestBaseSenseModifierValue = ModifierDerivers.deriveHighestModifierValue(baseSenseModifiers, abilityLookup);
+    const bonusSenseModifiers = modifiers.filter((modifier) => ModifierValidators.isValidSenseModifier(modifier, typeModifierKey) ||
+        ModifierValidators.isValidBonusSenseModifier(modifier, typeModifierKey));
+    const highestBonusSenseModifierValue = ModifierDerivers.deriveHighestModifierValue(bonusSenseModifiers, abilityLookup);
+    return highestBaseSenseModifierValue + highestBonusSenseModifierValue;
+}
+/**
+ * @deprecated use getSenseDistanceByKeyBonusTakeHighest
+ */
+export const getSenseDistanceByKey = getSenseDistanceByKeyBonusTakeHighest;
+/**
+ *
+ * @param senseKey
+ * @param modifiers
+ * @param abilityLookup
+ * @param customSenseLookup
+ */
+export function getSenseDistanceByKeyBonusTakeAll(senseKey, modifiers, abilityLookup, customSenseLookup) {
+    const customSenseData = customSenseLookup[senseKey];
+    if (customSenseData) {
+        const customDistance = customSenseData.distance;
+        if (customDistance !== null) {
+            return customDistance;
+        }
+    }
+    const typeModifierKey = RuleDataUtils.getSenseTypeModifierKey(senseKey);
+    const setSenseModifiers = modifiers.filter((modifier) => ModifierValidators.isValidSetSenseModifier(modifier, typeModifierKey));
+    if (setSenseModifiers.length) {
+        return ModifierDerivers.deriveHighestModifierValue(setSenseModifiers, abilityLookup);
+    }
+    const baseSenseModifiers = modifiers.filter((modifier) => ModifierValidators.isValidSetBaseSenseModifier(modifier, typeModifierKey));
+    const highestBaseSenseModifierValue = ModifierDerivers.deriveHighestModifierValue(baseSenseModifiers, abilityLookup);
+    const bonusSenseModifiers = modifiers.filter((modifier) => ModifierValidators.isValidSenseModifier(modifier, typeModifierKey) ||
+        ModifierValidators.isValidBonusSenseModifier(modifier, typeModifierKey));
+    const totalBonusSenseModifierValue = bonusSenseModifiers.reduce((total, modifier) => total + ModifierDerivers.getModifierValue(modifier, abilityLookup), 0);
+    return highestBaseSenseModifierValue + totalBonusSenseModifierValue;
+}
+/**
+ *
+ * @param modifiers
+ * @param abilityLookup
+ * @param customSenseLookup
+ */
+export function generateSenseInfo(modifiers, abilityLookup, customSenseLookup) {
+    return {
+        [SenseTypeEnum.BLINDSIGHT]: getSenseDistanceByKeyBonusTakeHighest(SenseTypeEnum.BLINDSIGHT, modifiers, abilityLookup, customSenseLookup),
+        [SenseTypeEnum.DARKVISION]: getSenseDistanceByKeyBonusTakeAll(SenseTypeEnum.DARKVISION, modifiers, abilityLookup, customSenseLookup),
+        [SenseTypeEnum.PASSIVE_PERCEPTION]: getSenseDistanceByKeyBonusTakeHighest(SenseTypeEnum.PASSIVE_PERCEPTION, modifiers, abilityLookup, customSenseLookup),
+        [SenseTypeEnum.TREMORSENSE]: getSenseDistanceByKeyBonusTakeHighest(SenseTypeEnum.TREMORSENSE, modifiers, abilityLookup, customSenseLookup),
+        [SenseTypeEnum.TRUESIGHT]: getSenseDistanceByKeyBonusTakeHighest(SenseTypeEnum.TRUESIGHT, modifiers, abilityLookup, customSenseLookup),
+    };
+}
+/**
+ *
+ * @param skills
+ * @param modifiers
+ * @param abilityLookup
+ * @param overrideValue
+ */
+export function generatePassivePerception(skills, modifiers, abilityLookup, overrideValue) {
+    if (overrideValue !== null) {
+        return overrideValue;
+    }
+    return derivePassivePerception(skills, modifiers, abilityLookup);
+}
+/**
+ *
+ * @param skills
+ * @param modifiers
+ * @param abilityLookup
+ * @param overrideValue
+ */
+export function generatePassiveInvestigation(skills, modifiers, abilityLookup, overrideValue) {
+    if (overrideValue !== null) {
+        return overrideValue;
+    }
+    return derivePassiveInvestigation(skills, modifiers, abilityLookup);
+}
+/**
+ *
+ * @param skills
+ * @param modifiers
+ * @param abilityLookup
+ * @param overrideValue
+ */
+export function generatePassiveInsight(skills, modifiers, abilityLookup, overrideValue) {
+    if (overrideValue !== null) {
+        return overrideValue;
+    }
+    return derivePassiveInsight(skills, modifiers, abilityLookup);
+}
+/**
+ *
+ * @param senses
+ */
+export function generateCustomSenseLookup(senses) {
+    return keyBy(senses, 'senseId');
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Source.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Source.js
new file mode 100644
index 0000000..3ef2ac3
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Source.js
@@ -0,0 +1,29 @@
+import { CampaignSettingAccessors } from '../../CampaignSetting';
+import { FeatureFlagEnum, FeatureFlagInfoUtils } from '../../FeatureFlagInfo';
+import { RuleDataAccessors } from '../../RuleData';
+/**
+ *
+ * @param activeSourceCategories
+ * @param campaignSetting
+ * @param ruleData
+ */
+export function generateActiveSources(activeSourceCategories, customCampaignSetting, campaignSetting, ruleData, featureFlagInfo) {
+    // console.log('customCampaignSetting', customCampaignSetting);
+    const isCampaignSettingsActive = FeatureFlagInfoUtils.getFeatureFlagInfoValue(FeatureFlagEnum.RELEASE_GATE_CAMPAIGN_SETTINGS, featureFlagInfo);
+    const sourceData = RuleDataAccessors.getSourceData(ruleData);
+    let campaignSettingSources = [];
+    if (customCampaignSetting) {
+        if (customCampaignSetting.campaignSettingId) {
+            campaignSettingSources = CampaignSettingAccessors.getAvailableSourceIds(campaignSetting[0]);
+        }
+        else {
+            campaignSettingSources = CampaignSettingAccessors.getEnabledSourceIds(customCampaignSetting);
+        }
+    }
+    // Return the Campaign Setting sources if the feature is enabled and they have been set
+    if (isCampaignSettingsActive && (campaignSettingSources === null || campaignSettingSources === void 0 ? void 0 : campaignSettingSources.length)) {
+        return sourceData.filter((source) => campaignSettingSources === null || campaignSettingSources === void 0 ? void 0 : campaignSettingSources.includes(source.id));
+    }
+    // Otherwise return the sources mapped to the specified Source Category
+    return sourceData.filter((source) => activeSourceCategories.includes(source.sourceCategoryId));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Speeds.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Speeds.js
new file mode 100644
index 0000000..60c8d0d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Speeds.js
@@ -0,0 +1,138 @@
+import { keyBy } from 'lodash';
+import { SpeedMovementKeyEnum, WeightSpeedTypeEnum } from '../../Core';
+import { ModifierDerivers, ModifierValidators } from '../../Modifier';
+import { RaceAccessors } from '../../Race';
+import { RuleDataUtils } from '../../RuleData';
+/**
+ *
+ * @param speedMovementKey
+ * @param baseWeightSpeedLookup
+ * @param weightSpeedType
+ * @param mirrorSpeed
+ * @param armorSpeedAdjustment
+ * @param modifiers
+ * @param customSpeedLookup
+ * @param equippedArmor
+ */
+export function generateSpeedInfoByKey(speedMovementKey, baseWeightSpeedLookup, weightSpeedType, mirrorSpeed, armorSpeedAdjustment, modifiers, customSpeedLookup, equippedArmor) {
+    if (baseWeightSpeedLookup === null) {
+        return null;
+    }
+    const speedReductionRemoveModifiers = modifiers.filter((modifier) => ModifierValidators.isSpeedReductionRemoveModifier(modifier));
+    const hasSpeedReductionRemove = speedReductionRemoveModifiers.length > 0;
+    // set up initial speed
+    let finalSpeed = baseWeightSpeedLookup[speedMovementKey];
+    // calc based on standard modifiers
+    const setModifiers = modifiers.filter((modifier) => ModifierValidators.isValidSetSpeedModifier(modifier, speedMovementKey));
+    if (setModifiers.length) {
+        finalSpeed = ModifierDerivers.deriveHighestModifierValue(setModifiers);
+    }
+    else {
+        const innateSetModifiers = modifiers.filter((modifier) => ModifierValidators.isValidSetInnateSpeedModifier(modifier, speedMovementKey));
+        let baseMovementSpeed = baseWeightSpeedLookup[speedMovementKey];
+        if (baseMovementSpeed === null) {
+            baseMovementSpeed = 0;
+        }
+        const baseSpeed = Math.max(baseMovementSpeed, ModifierDerivers.deriveHighestModifierValue(innateSetModifiers));
+        if (baseSpeed === 0) {
+            finalSpeed = baseSpeed;
+        }
+        else {
+            const speedAdjustmentModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusSpeedModifier(modifier, speedMovementKey));
+            const speedAdjustmentModifierTotal = ModifierDerivers.sumModifiers(speedAdjustmentModifiers);
+            let unarmoredBonus = 0;
+            if (!equippedArmor) {
+                const unarmoredBonusModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusUnarmoredMovementModifier(modifier));
+                unarmoredBonus = ModifierDerivers.sumModifiers(unarmoredBonusModifiers);
+            }
+            finalSpeed = baseSpeed + speedAdjustmentModifierTotal + armorSpeedAdjustment + unarmoredBonus;
+        }
+    }
+    // check if there are any speed reductions
+    if (!hasSpeedReductionRemove && finalSpeed !== 0) {
+        let speed = finalSpeed;
+        if (weightSpeedType === WeightSpeedTypeEnum.ENCUMBERED) {
+            speed -= 10;
+        }
+        else if (weightSpeedType === WeightSpeedTypeEnum.HEAVILY_ENCUMBERED) {
+            speed -= 20;
+        }
+        finalSpeed = Math.max(0, speed);
+    }
+    // check for custom speed overrides
+    const movementId = RuleDataUtils.getMovementTypeBySpeedMovementKey(speedMovementKey);
+    if (movementId !== null) {
+        const speed = customSpeedLookup[movementId];
+        if (speed && speed.distance !== null) {
+            finalSpeed = speed.distance;
+        }
+    }
+    // Have to do another pass to check if any of the speed set modifiers are null, if so use the mirror speed (most likely walking)
+    if (mirrorSpeed !== null) {
+        const speedSetModifiers = modifiers.filter((modifier) => ModifierValidators.isValidSetInnateSpeedModifier(modifier, speedMovementKey));
+        const nullSpeedSetModifiers = speedSetModifiers.filter((modifier) => ModifierDerivers.deriveFixedModifierValue(modifier, null) === null);
+        if (nullSpeedSetModifiers.length) {
+            finalSpeed = mirrorSpeed;
+        }
+    }
+    return finalSpeed;
+}
+/**
+ *
+ * @param weightSpeeds
+ * @param weightSpeedType
+ * @param armorSpeedAdjustment
+ * @param modifiers
+ * @param customSpeedLookup
+ * @param equippedArmor
+ */
+export function generateSpeedInfo(weightSpeeds, weightSpeedType, armorSpeedAdjustment, modifiers, customSpeedLookup, equippedArmor) {
+    const baseWeightSpeedLookup = weightSpeeds ? weightSpeeds[WeightSpeedTypeEnum.NORMAL] : null;
+    const walkingSpeed = generateSpeedInfoByKey(SpeedMovementKeyEnum.WALK, baseWeightSpeedLookup, weightSpeedType, null, armorSpeedAdjustment, modifiers, customSpeedLookup, equippedArmor);
+    return {
+        [SpeedMovementKeyEnum.WALK]: walkingSpeed,
+        [SpeedMovementKeyEnum.FLY]: generateSpeedInfoByKey(SpeedMovementKeyEnum.FLY, baseWeightSpeedLookup, weightSpeedType, walkingSpeed, armorSpeedAdjustment, modifiers, customSpeedLookup, equippedArmor),
+        [SpeedMovementKeyEnum.CLIMB]: generateSpeedInfoByKey(SpeedMovementKeyEnum.CLIMB, baseWeightSpeedLookup, weightSpeedType, walkingSpeed, armorSpeedAdjustment, modifiers, customSpeedLookup, equippedArmor),
+        [SpeedMovementKeyEnum.BURROW]: generateSpeedInfoByKey(SpeedMovementKeyEnum.BURROW, baseWeightSpeedLookup, weightSpeedType, walkingSpeed, armorSpeedAdjustment, modifiers, customSpeedLookup, equippedArmor),
+        [SpeedMovementKeyEnum.SWIM]: generateSpeedInfoByKey(SpeedMovementKeyEnum.SWIM, baseWeightSpeedLookup, weightSpeedType, walkingSpeed, armorSpeedAdjustment, modifiers, customSpeedLookup, equippedArmor),
+    };
+}
+/**
+ *
+ * @param speedInfo
+ * @param customSpeedLookup
+ * @param ruleData
+ */
+export function generateSpeeds(speedInfo, customSpeedLookup, ruleData) {
+    return Object.keys(speedInfo).map((movementKey, idx) => {
+        const movementAmount = speedInfo[movementKey];
+        let source = '';
+        const movementType = RuleDataUtils.getMovementTypeBySpeedMovementKey(movementKey);
+        if (movementType && customSpeedLookup[movementType]) {
+            source = customSpeedLookup[movementType].source;
+        }
+        return {
+            distance: movementAmount,
+            type: movementType,
+            source,
+            name: RuleDataUtils.getMovementDescription(movementType, ruleData),
+        };
+    });
+}
+/**
+ *
+ * @param race
+ */
+export function generateWeightSpeeds(race) {
+    if (race === null) {
+        return null;
+    }
+    return RaceAccessors.getWeightSpeeds(race);
+}
+/**
+ *
+ * @param speeds
+ */
+export function generateCustomSpeedLookup(speeds) {
+    return keyBy(speeds, 'movementId');
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Spellcaster.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Spellcaster.js
new file mode 100644
index 0000000..6b3c608
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Spellcaster.js
@@ -0,0 +1,118 @@
+import { AbilityAccessors } from '../../Ability';
+import { ClassAccessors } from '../../Class';
+import { ModifierDerivers, ModifierValidators } from '../../Modifier';
+/**
+ *
+ * @param modifiers
+ * @param xpInfo
+ * @param proficiencyBonus
+ * @param abilityLookup
+ * @param spellListDataOriginLookup
+ */
+export function generateOverallSpellInfo(modifiers, xpInfo, proficiencyBonus, abilityLookup, spellListDataOriginLookup) {
+    const bonusCantripDamageModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusCantripDamage(modifier));
+    const bonusCantripDamageModifierTotal = ModifierDerivers.sumModifiers(bonusCantripDamageModifiers, abilityLookup);
+    return {
+        bonusCantripDamage: bonusCantripDamageModifierTotal,
+        characterLevel: xpInfo.currentLevel,
+        proficiencyBonus,
+        abilityLookup,
+        modifiers,
+        spellListDataOriginLookup,
+    };
+}
+/**
+ *
+ * @param classes
+ * @param characterLevel
+ * @param spellSlots
+ * @param pactMagicSlots
+ * @param castableSpellLevels
+ * @param castablePactMagicLevels
+ * @param availableSpellLevels
+ * @param availablePactMagicLevels
+ * @param maxLevel
+ * @param abilityLookup
+ * @param classSpellInfoLookup
+ */
+export function generateSpellCasterInfo(classes, characterLevel, spellSlots, pactMagicSlots, castableSpellLevels, castablePactMagicLevels, availableSpellLevels, availablePactMagicLevels, maxLevel, abilityLookup, classSpellInfoLookup) {
+    var _a, _b, _c, _d;
+    const castingInfo = {
+        modifiers: [],
+        spellAttacks: [],
+        saveDcs: [],
+    };
+    for (let i = 0; i < classes.length; i++) {
+        const charClass = classes[i];
+        const spellRules = ClassAccessors.getSpellRules(charClass);
+        if (spellRules === null) {
+            continue;
+        }
+        let modifier = 0;
+        if (spellRules.spellcastingAbilityStatId) {
+            modifier = AbilityAccessors.getModifier(abilityLookup[spellRules.spellcastingAbilityStatId]);
+        }
+        const classSpellInfo = classSpellInfoLookup[ClassAccessors.getId(charClass)];
+        const spellAttack = classSpellInfo.toHit;
+        const saveDc = classSpellInfo.spellSaveDc;
+        if (ClassAccessors.isSpellcastingActive(charClass) || ClassAccessors.isPactMagicActive(charClass)) {
+            const existingModifierIndex = castingInfo.modifiers.findIndex((existingModifier) => existingModifier.value === modifier);
+            if (existingModifierIndex > -1) {
+                castingInfo.modifiers[existingModifierIndex].sources.push(charClass);
+            }
+            else {
+                castingInfo.modifiers.push({
+                    value: modifier,
+                    sources: [charClass],
+                });
+            }
+            const existingSpellAttackIndex = castingInfo.spellAttacks.findIndex((existingSpellAttack) => existingSpellAttack.value === spellAttack);
+            if (existingSpellAttackIndex > -1) {
+                castingInfo.spellAttacks[existingSpellAttackIndex].sources.push(charClass);
+            }
+            else {
+                castingInfo.spellAttacks.push({
+                    value: spellAttack,
+                    sources: [charClass],
+                });
+            }
+            const existingSaveDcIndex = castingInfo.saveDcs.findIndex((existingSaveDc) => existingSaveDc.value === saveDc);
+            if (existingSaveDcIndex > -1) {
+                castingInfo.saveDcs[existingSaveDcIndex].sources.push(charClass);
+            }
+            else {
+                castingInfo.saveDcs.push({
+                    value: saveDc,
+                    sources: [charClass],
+                });
+            }
+        }
+    }
+    const firstAvailableSpellSlotLevel = (_a = availableSpellLevels.sort()[0]) !== null && _a !== void 0 ? _a : null;
+    const firstAvailablePactMagicSlotLevel = (_b = availablePactMagicLevels.sort()[0]) !== null && _b !== void 0 ? _b : null;
+    const lastAvailableSpellSlotLevel = (_c = availableSpellLevels.sort().reverse()[0]) !== null && _c !== void 0 ? _c : null;
+    const lastAvailablePactMagicSlotLevel = (_d = availablePactMagicLevels.sort().reverse()[0]) !== null && _d !== void 0 ? _d : null;
+    return {
+        characterLevel,
+        spellSlots,
+        pactMagicSlots,
+        castableSpellLevels,
+        castablePactMagicLevels,
+        availableSpellLevels,
+        availablePactMagicLevels,
+        firstAvailableSpellSlotLevel,
+        firstAvailablePactMagicSlotLevel,
+        lastAvailableSpellSlotLevel,
+        lastAvailablePactMagicSlotLevel,
+        maxLevel,
+        castingInfo,
+    };
+}
+/**
+ *
+ * @param classSpellLists
+ * @param characterSpells
+ */
+export function generateHasSpells(classSpellLists, characterSpells) {
+    return !!(classSpellLists.length || characterSpells.length);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/generators/Weight.js b/ddb_main/packages/rules-engine/es/engine/Character/generators/Weight.js
new file mode 100644
index 0000000..bbc697e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/generators/Weight.js
@@ -0,0 +1,106 @@
+import { ContainerAccessors, ContainerTypeEnum } from '../../Container';
+import { ItemDerivers, ItemValidators } from '../../Item';
+import { RuleDataAccessors } from '../../RuleData';
+/**
+ *
+ * @param currencies
+ * @param preferences
+ * @param ruleData
+ */
+export function generateCoinWeight(currencies, preferences, ruleData) {
+    let weight = 0;
+    if (currencies === null) {
+        return weight;
+    }
+    if (preferences !== null && !preferences.ignoreCoinWeight) {
+        RuleDataAccessors.getCurrencyData(ruleData).forEach((currencyInfo) => {
+            if (currencyInfo.name !== null) {
+                const heldCurrencyAmount = currencies[currencyInfo.name.toLowerCase()];
+                if (heldCurrencyAmount) {
+                    weight += currencyInfo.weight * heldCurrencyAmount;
+                }
+            }
+        });
+    }
+    return weight;
+}
+/**
+ *
+ * @param allItems
+ * @param customItems
+ * @returns {number}
+ */
+export function generateItemWeight(allItems, customItems) {
+    return ItemDerivers.deriveItemsWeightTotal(allItems) + ItemDerivers.deriveItemsWeightTotal(customItems);
+}
+/**
+ *
+ * @param characterContainers
+ * @param partyContainers
+ * @param characterId
+ * @returns {number}
+ */
+export function generateContainerItemWeight(characterContainers, partyContainers, characterId) {
+    return [...characterContainers, ...partyContainers].reduce((acc, container) => {
+        const type = ContainerAccessors.getContainerType(container);
+        const isEquipped = ContainerAccessors.isEquipped(container);
+        if (type === ContainerTypeEnum.ITEM && isEquipped) {
+            // A container item
+            const containerItem = ContainerAccessors.getItem(container);
+            // Ignore containers equipped to someone else in the party inventory
+            if (containerItem && ItemValidators.isEquippedToCurrentCharacter(containerItem, characterId)) {
+                const appliedWeight = ContainerAccessors.getWeightInfo(container).itemApplied;
+                acc += appliedWeight;
+            }
+        }
+        if (type === ContainerTypeEnum.CHARACTER || type === ContainerTypeEnum.CAMPAIGN) {
+            // Based on the generateContainerWeightInfo generator,
+            // when looking at the top level party inventory,
+            // applied weight only includes items that are equipped to you.
+            const appliedWeight = ContainerAccessors.getWeightInfo(container).itemApplied;
+            acc += appliedWeight;
+        }
+        return acc;
+    }, 0);
+}
+/**
+ *
+ * @param characterContainers
+ * @param partyContainers
+ * @param characterId
+ * @param preferences
+ * @returns {number}
+ */
+export function generateCointainerCoinWeight(characterContainers, partyContainers, characterId, preferences) {
+    // 0 when ignoring coin weight
+    if (!preferences || preferences.ignoreCoinWeight) {
+        return 0;
+    }
+    // Whether cointainers are enabled or not, the process is the same.
+    // All the coins will be in the top level character container if cointainers are off.
+    return [...characterContainers, ...partyContainers].reduce((acc, container) => {
+        const type = ContainerAccessors.getContainerType(container);
+        const isEquipped = ContainerAccessors.isEquipped(container);
+        if (type === ContainerTypeEnum.ITEM && isEquipped) {
+            const containerItem = ContainerAccessors.getItem(container);
+            if (containerItem && ItemValidators.isEquippedToCurrentCharacter(containerItem, characterId)) {
+                const appliedWeight = ContainerAccessors.getWeightInfo(container).coinApplied;
+                acc += appliedWeight;
+            }
+        }
+        if (type === ContainerTypeEnum.CHARACTER || type === ContainerTypeEnum.CAMPAIGN) {
+            const appliedWeight = ContainerAccessors.getWeightInfo(container).coinApplied;
+            acc += appliedWeight;
+        }
+        return acc;
+    }, 0);
+}
+/**
+ * //TODO could include suppliers data
+ * @param itemWeight
+ * @param coinWeight
+ */
+export function generateTotalWeight(itemWeight, coinWeight) {
+    // When coin weight is ignored, coinWeight will be 0.
+    return itemWeight + coinWeight;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/hacks/HitPoints.js b/ddb_main/packages/rules-engine/es/engine/Character/hacks/HitPoints.js
new file mode 100644
index 0000000..ee0c716
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/hacks/HitPoints.js
@@ -0,0 +1,26 @@
+/**
+ *
+ * @param baseHp
+ * @param overrideHp
+ * @param bonusHp
+ * @param tempHp
+ * @param removedHp
+ * https://github.com/reduxjs/reselect/issues/378
+ */
+export function hack__generateHitPointParts(baseHp, overrideHp, bonusHp, tempHp, removedHp) {
+    return {
+        baseHp,
+        overrideHp,
+        bonusHp,
+        tempHp,
+        removedHp,
+    };
+}
+export function hack__generateSpecialWeaponPropertiesEnabled(hexWeaponEnabled, pactWeaponEnabled, improvedPactWeaponEnabled, dedicatedWeaponEnabled) {
+    return {
+        hexWeaponEnabled,
+        pactWeaponEnabled,
+        improvedPactWeaponEnabled,
+        dedicatedWeaponEnabled,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/index.js b/ddb_main/packages/rules-engine/es/engine/Character/index.js
new file mode 100644
index 0000000..22d75ba
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/index.js
@@ -0,0 +1,11 @@
+import * as CharacterConstants from './constants';
+import * as CharacterDerivers from './derivers';
+import * as CharacterGenerators from './generators';
+import * as CharacterHacks from './hacks';
+import * as CharacterTypings from './typings';
+import * as CharacterUtils from './utils';
+import * as CharacterValidators from './validators';
+export * from './typings';
+export * from './constants';
+export { CharacterDerivers, CharacterValidators, CharacterGenerators, CharacterUtils, CharacterHacks };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, CharacterConstants), CharacterDerivers), CharacterValidators), CharacterGenerators), CharacterTypings), CharacterUtils), CharacterHacks);
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/utils/Configuration.js b/ddb_main/packages/rules-engine/es/engine/Character/utils/Configuration.js
new file mode 100644
index 0000000..7d82aba
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/utils/Configuration.js
@@ -0,0 +1,51 @@
+/**
+ *
+ * @param preKey
+ */
+export function getPreferenceKey(preKey) {
+    switch (preKey) {
+        case 'abilityScoreDisplayType':
+            return preKey;
+        case 'enableDarkMode':
+            return preKey;
+        case 'enableContainerCurrency':
+            return preKey;
+        case 'enableOptionalClassFeatures':
+            return preKey;
+        case 'enableOptionalOrigins':
+            return preKey;
+        case 'encumbranceType':
+            return preKey;
+        case 'enforceFeatRules':
+            return preKey;
+        case 'enforceMulticlassRules':
+            return preKey;
+        case 'hitPointType':
+            return preKey;
+        case 'ignoreCoinWeight':
+            return preKey;
+        case 'primaryMovement':
+            return preKey;
+        case 'primarySense':
+            return preKey;
+        case 'privacyType':
+            return preKey;
+        case 'progressionType':
+            return preKey;
+        case 'sharingType':
+            return preKey;
+        case 'showCompanions':
+            return preKey;
+        case 'showScaledSpells':
+            return preKey;
+        case 'showUnarmedStrike':
+            return preKey;
+        case 'showWildShape':
+            return preKey;
+        case 'useHomebrewContent':
+            return preKey;
+        default:
+        //not implemented
+    }
+    return null;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/utils/Defenses.js b/ddb_main/packages/rules-engine/es/engine/Character/utils/Defenses.js
new file mode 100644
index 0000000..9c24a94
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/utils/Defenses.js
@@ -0,0 +1,24 @@
+import { groupBy } from 'lodash';
+import { EntityUtils } from '../../Entity';
+/**
+ *
+ * @param defenseAdjustments
+ */
+export function groupDefenseAdjustments(defenseAdjustments) {
+    const groupedDefenseAdjustments = [];
+    const keyedGroupDefenseAdjustments = groupBy(defenseAdjustments, 'name');
+    Object.keys(keyedGroupDefenseAdjustments).forEach((groupKey) => {
+        const damageAdjustments = keyedGroupDefenseAdjustments[groupKey];
+        groupedDefenseAdjustments.push({
+            name: groupKey,
+            sources: damageAdjustments
+                .map((adjustment) => {
+                return EntityUtils.getDataOriginName(adjustment.dataOrigin, undefined, true);
+            })
+                .sort(),
+            hasCustom: !!damageAdjustments.find((adjustment) => adjustment.isCustom),
+            damageAdjustments,
+        });
+    });
+    return groupedDefenseAdjustments;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/utils/HitPoints.js b/ddb_main/packages/rules-engine/es/engine/Character/utils/HitPoints.js
new file mode 100644
index 0000000..b67cc9a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/utils/HitPoints.js
@@ -0,0 +1,31 @@
+/**
+ *
+ * @param hitPointInfo
+ * @param hpDiff
+ */
+export function calculateHitPoints(hitPointInfo, hpDiff) {
+    let newTemp;
+    let newHp;
+    const hpTemp = hitPointInfo.tempHp ? hitPointInfo.tempHp : 0;
+    if (hpDiff < 0) {
+        newTemp = Math.max(hpTemp + hpDiff, 0);
+        if (Math.abs(hpDiff) > hpTemp) {
+            newHp = hitPointInfo.remainingHp + (hpTemp + hpDiff);
+        }
+        else {
+            newHp = hitPointInfo.remainingHp;
+        }
+    }
+    else {
+        newTemp = hitPointInfo.tempHp;
+        newHp = Math.min(hitPointInfo.remainingHp + hpDiff, hitPointInfo.totalHp);
+    }
+    newHp = Math.max(0, newHp);
+    const newRemovedHp = hitPointInfo.totalHp - newHp;
+    return {
+        newTemp,
+        newHp,
+        newRemovedHp,
+        startHp: hitPointInfo.remainingHp,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/utils/Weight.js b/ddb_main/packages/rules-engine/es/engine/Character/utils/Weight.js
new file mode 100644
index 0000000..5b7add2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/utils/Weight.js
@@ -0,0 +1,118 @@
+import { CreatureSizeEnum } from '../../Core';
+import { ModifierAccessors, ModifierDerivers, ModifierSubTypeEnum, ModifierValidators } from '../../Modifier';
+/**
+ *
+ * @param sizeId
+ * @param modifiers
+ */
+export function getEncumbranceSize(sizeId, modifiers) {
+    let encumbranceSize = sizeId;
+    let isSmallerOverride = false;
+    let isLargerOverride = false;
+    const carryingCapacitySizeModifiers = modifiers.filter((modifier) => ModifierValidators.isCarryingCapacitySizeModifier(modifier));
+    carryingCapacitySizeModifiers.forEach((modifier) => {
+        switch (ModifierAccessors.getSubType(modifier)) {
+            case ModifierSubTypeEnum.TINY:
+                isSmallerOverride = true;
+                break;
+            case ModifierSubTypeEnum.LARGE:
+            case ModifierSubTypeEnum.HUGE:
+            case ModifierSubTypeEnum.GARGANTUAN:
+                isLargerOverride = true;
+                break;
+            default:
+            // not implemented
+        }
+    });
+    if (isSmallerOverride) {
+        encumbranceSize = CreatureSizeEnum.TINY;
+    }
+    if (isLargerOverride) {
+        encumbranceSize = CreatureSizeEnum.LARGE;
+    }
+    return encumbranceSize;
+}
+/**
+ *
+ * @param value
+ * @param encumbranceSizeId
+ */
+export function getEncumbranceSizeScaledValue(value, encumbranceSizeId) {
+    switch (encumbranceSizeId) {
+        case CreatureSizeEnum.TINY:
+            return value / 2;
+        case CreatureSizeEnum.LARGE:
+        case CreatureSizeEnum.HUGE:
+        case CreatureSizeEnum.GARGANTUAN:
+            return value * 2;
+        default:
+        // not implemented
+    }
+    return value;
+}
+/**
+ *
+ * @param value
+ * @param modifiers
+ */
+export function getCarryCapacityModifierScaledValue(value, modifiers) {
+    // get weight multiplied by any multipliers, positive is times, negative is division (ex: 2 is times two, -3 is divide by 3)
+    const carryingCapacityMultiplierModifiers = modifiers.filter((modifier) => ModifierValidators.isCarringCapacityMultiplierModifier(modifier));
+    const highestCarryingCapacityMultiplier = ModifierDerivers.deriveHighestModifierValue(carryingCapacityMultiplierModifiers);
+    if (highestCarryingCapacityMultiplier) {
+        if (highestCarryingCapacityMultiplier < 0) {
+            return (value /= Math.abs(highestCarryingCapacityMultiplier));
+        }
+        return (value *= highestCarryingCapacityMultiplier);
+    }
+    return value;
+}
+/**
+ *
+ * @param strengthScale
+ * @param strScore
+ * @param size
+ * @param modifiers
+ */
+export function getStrengthScaledCarryCapacity(strengthScale, strScore, size, modifiers) {
+    const sizeId = size ? size.id : null;
+    const baseWeight = strScore * strengthScale;
+    const encumbranceSize = getEncumbranceSize(sizeId, modifiers);
+    let weight = getEncumbranceSizeScaledValue(baseWeight, encumbranceSize);
+    weight = getCarryCapacityModifierScaledValue(weight, modifiers);
+    return weight;
+}
+/**
+ *
+ * @param strScore
+ * @param size
+ * @param modifiers
+ */
+export function getCarryCapacity(strScore, size, modifiers) {
+    return getStrengthScaledCarryCapacity(15, strScore, size, modifiers);
+}
+/**
+ *
+ * @param carryCapacity
+ */
+export function getPushDragLiftWeight(carryCapacity) {
+    return carryCapacity * 2;
+}
+/**
+ *
+ * @param strScore
+ * @param size
+ * @param modifiers
+ */
+export function getEncumberedWeight(strScore, size, modifiers) {
+    return getStrengthScaledCarryCapacity(5, strScore, size, modifiers);
+}
+/**
+ *
+ * @param strScore
+ * @param size
+ * @param modifiers
+ */
+export function getHeavilyEncumberedWeight(strScore, size, modifiers) {
+    return getStrengthScaledCarryCapacity(10, strScore, size, modifiers);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/validators/Defenses.js b/ddb_main/packages/rules-engine/es/engine/Character/validators/Defenses.js
new file mode 100644
index 0000000..cc23274
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/validators/Defenses.js
@@ -0,0 +1,22 @@
+import { DamageAdjustmentTypeEnum } from '../../Core';
+/**
+ *
+ * @param damageAdjustment
+ */
+export function isResistanceDamageAdjustment(damageAdjustment) {
+    return damageAdjustment.type === DamageAdjustmentTypeEnum.RESISTANCE;
+}
+/**
+ *
+ * @param damageAdjustment
+ */
+export function isVulnerabilityDamageAdjustment(damageAdjustment) {
+    return damageAdjustment.type === DamageAdjustmentTypeEnum.VULNERABILITY;
+}
+/**
+ *
+ * @param damageAdjustment
+ */
+export function isImmunityDamageAdjustment(damageAdjustment) {
+    return damageAdjustment.type === DamageAdjustmentTypeEnum.IMMUNITY;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/validators/Proficiency.js b/ddb_main/packages/rules-engine/es/engine/Character/validators/Proficiency.js
new file mode 100644
index 0000000..39a8bff
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/validators/Proficiency.js
@@ -0,0 +1,8 @@
+import { CustomProficiencyTypeEnum } from '../../Core';
+/**
+ *
+ * @param proficiency
+ */
+export function isCustomSkillProficiency(proficiency) {
+    return proficiency.type === CustomProficiencyTypeEnum.SKILL;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Character/validators/Source.js b/ddb_main/packages/rules-engine/es/engine/Character/validators/Source.js
new file mode 100644
index 0000000..aa409e0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Character/validators/Source.js
@@ -0,0 +1,22 @@
+import { SourceTypeEnum } from '../../Core';
+/**
+ *
+ * @param source
+ */
+export function isPrimarySource(source) {
+    return source.sourceType === SourceTypeEnum.PRIMARY;
+}
+/**
+ *
+ * @param source
+ */
+export function isSecondarySource(source) {
+    return source.sourceType === SourceTypeEnum.SECONDARY;
+}
+/**
+ *
+ * @param source
+ */
+export function isHiddenSource(source) {
+    return source.sourceType === SourceTypeEnum.HIDDEN;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Choice/accessors.js b/ddb_main/packages/rules-engine/es/engine/Choice/accessors.js
new file mode 100644
index 0000000..a8db64d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Choice/accessors.js
@@ -0,0 +1,123 @@
+/**
+ *
+ * @param choice
+ */
+export function getComponentId(choice) {
+    return choice.componentId;
+}
+/**
+ *
+ * @param choice
+ */
+export function getComponentTypeId(choice) {
+    return choice.componentTypeId;
+}
+/**
+ *
+ * @param choice
+ */
+export function getDefaultSubtypes(choice) {
+    var _a;
+    return (_a = choice.defaultSubtypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param choice
+ */
+export function getId(choice) {
+    return choice.id;
+}
+/**
+ *
+ * @param choice
+ */
+export function isInfinite(choice) {
+    return choice.isInfinite;
+}
+/**
+ *
+ * @param choice
+ */
+export function isOptional(choice) {
+    return choice.isOptional;
+}
+/**
+ *
+ * @param choice
+ */
+export function getLabel(choice) {
+    return choice.label;
+}
+/**
+ *
+ * @param choice
+ */
+export function getOptions(choice) {
+    var _a;
+    return (_a = choice.options) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param choice
+ */
+export function getOptionIds(choice) {
+    var _a;
+    return (_a = choice.optionIds) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param choice
+ */
+export function getDisplayOrder(choice) {
+    return choice.displayOrder;
+}
+/**
+ *
+ * @param choice
+ */
+export function getOptionValue(choice) {
+    return choice.optionValue;
+}
+/**
+ *
+ * @param choice
+ */
+export function getParentChoiceId(choice) {
+    return choice.parentChoiceId;
+}
+/**
+ *
+ * @param choice
+ */
+export function getSubType(choice) {
+    return choice.subType;
+}
+/**
+ *
+ * @param choice
+ */
+export function getType(choice) {
+    return choice.type;
+}
+/**
+ *
+ * @param choice
+ */
+export function getDataOrigin(choice) {
+    return choice.dataOrigin;
+}
+/**
+ *
+ * @param choice
+ */
+export function getUniqueKey(choice) {
+    return getId(choice);
+}
+/**
+ *
+ * @param choice
+ */
+export function getTagConstraints(choice) {
+    var _a;
+    return (_a = choice.tagConstraints) !== null && _a !== void 0 ? _a : [];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Choice/generators.js b/ddb_main/packages/rules-engine/es/engine/Choice/generators.js
new file mode 100644
index 0000000..1be7821
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Choice/generators.js
@@ -0,0 +1,97 @@
+import { groupBy, orderBy } from 'lodash';
+import { DataOriginGenerators } from '../DataOrigin';
+import { HelperUtils } from '../Helper';
+import { getComponentId, getComponentTypeId, getDisplayOrder, getId, getLabel, getOptionIds, getParentChoiceId, getType, } from './accessors';
+/**
+ *
+ * @param choice
+ */
+export function generateDataOriginKey(choice) {
+    return DataOriginGenerators.generateDataOriginKey(getComponentId(choice), getComponentTypeId(choice));
+}
+/**
+ * @name generateChoiceComponentLookup
+ * @param choices
+ * @param choiceDefinitions
+ * @description it takes choices and fills out the options via the optionIds and the choiceDefinitions and returns a lookup
+ */
+export function generateChoiceComponentLookup(choices, choiceDefinitions) {
+    if (choiceDefinitions.length > 0) {
+        choices.forEach((choice) => {
+            var _a;
+            // find the collection of choice definitions for this choice
+            const options = ((_a = choiceDefinitions.find(({ id }) => id === `${getComponentTypeId(choice)}-${getType(choice)}`)) === null || _a === void 0 ? void 0 : _a.options) || null;
+            const optionIds = getOptionIds(choice);
+            if (options && optionIds.length) {
+                // set existing list to empty array for phase 1 support
+                choice.options = [];
+                for (let i = 0; i < optionIds.length; i++) {
+                    const optionId = optionIds[i];
+                    // find the definition of the choice to add back to the list
+                    const option = options.find((c) => c.id === optionId);
+                    if (option) {
+                        choice.options.push(option);
+                    }
+                }
+            }
+        });
+    }
+    return groupBy(choices, (choice) => generateDataOriginKey(choice));
+}
+/**
+ *
+ * @param proficiencyModifiers
+ * @param expertiseModifiers
+ * @param languageModifiers
+ * @param kenseiModifiers
+ * @param abilityLookup
+ * @param classSpellLists
+ */
+export function generateChoiceData(proficiencyModifiers, expertiseModifiers, languageModifiers, kenseiModifiers, abilityLookup, classSpellLists) {
+    return {
+        proficiencyModifiers,
+        expertiseModifiers,
+        languageModifiers,
+        kenseiModifiers,
+        abilityLookup,
+        classSpellLists,
+    };
+}
+/**
+ *
+ * @param id
+ * @param entityTypeId
+ * @param choiceLookup
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ */
+export function generateBaseChoices(id, entityTypeId, choiceLookup, dataOriginType, primary, parent = null) {
+    const choices = HelperUtils.lookupDataOrFallback(choiceLookup, DataOriginGenerators.generateDataOriginKey(id, entityTypeId));
+    if (!choices) {
+        return [];
+    }
+    // create a sub choice lookup for later
+    const subChoiceLookup = groupBy(choices.filter((choice) => getParentChoiceId(choice) !== null), (choice) => getParentChoiceId(choice));
+    // get all choices that aren't children and sort them
+    const orderedParentChoices = orderBy(choices.filter((choice) => getParentChoiceId(choice) === null), [getDisplayOrder, getType, (choice) => { var _a, _b; return (_b = (_a = getLabel(choice)) === null || _a === void 0 ? void 0 : _a.toLowerCase()) !== null && _b !== void 0 ? _b : null; }, getId]);
+    // iterate over all non children choices, add choice, and then all ordered children after it into a flat array for parity
+    const orderedChoices = [];
+    orderedParentChoices.forEach((parentChoice) => {
+        orderedChoices.push(parentChoice);
+        const id = getId(parentChoice);
+        if (id !== null) {
+            let subChoices = HelperUtils.lookupDataOrFallback(subChoiceLookup, id);
+            if (subChoices !== null) {
+                let orderedSubChoices = orderBy(subChoices, [
+                    getDisplayOrder,
+                    getType,
+                    (choice) => { var _a, _b; return (_b = (_a = getLabel(choice)) === null || _a === void 0 ? void 0 : _a.toLowerCase()) !== null && _b !== void 0 ? _b : null; },
+                    getId,
+                ]);
+                orderedChoices.push(...orderedSubChoices);
+            }
+        }
+    });
+    return orderedChoices.map((choice) => (Object.assign(Object.assign({}, choice), { dataOrigin: DataOriginGenerators.generateDataOrigin(dataOriginType, primary, parent) })));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Choice/index.js b/ddb_main/packages/rules-engine/es/engine/Choice/index.js
new file mode 100644
index 0000000..0aacf75
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Choice/index.js
@@ -0,0 +1,7 @@
+import * as ChoiceAccessors from './accessors';
+import * as ChoiceGenerators from './generators';
+import * as ChoiceTypings from './typings';
+import * as ChoiceUtils from './utils';
+export * from './typings';
+export { ChoiceAccessors, ChoiceGenerators, ChoiceUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign({}, ChoiceAccessors), ChoiceGenerators), ChoiceTypings), ChoiceUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Choice/utils.js b/ddb_main/packages/rules-engine/es/engine/Choice/utils.js
new file mode 100644
index 0000000..1fdb467
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Choice/utils.js
@@ -0,0 +1,211 @@
+import { orderBy } from 'lodash';
+import { TypeScriptUtils } from "../../utils";
+import { ClassAccessors } from '../Class';
+import { AbilityStatEnum, BuilderChoiceSubtypeEnum } from '../Core';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { EntityUtils } from '../Entity';
+import { HelperUtils } from '../Helper';
+import { ModifierAccessors } from '../Modifier';
+import { SourceUtils } from '../Source';
+import { SpellUtils } from '../Spell';
+import { getDefaultSubtypes, getOptions, getOptionValue, isOptional } from './accessors';
+export function isOnlyDefaultSelected(choice) {
+    const defaultSubtypes = getDefaultSubtypes(choice);
+    if (defaultSubtypes.length !== 1) {
+        return false;
+    }
+    if (!getOptionValue(choice)) {
+        return false;
+    }
+    const selectedOption = getSelectedOption(choice);
+    if (selectedOption) {
+        return selectedOption.label === defaultSubtypes[0];
+    }
+    return false;
+}
+export function getSelectedOption(choice) {
+    return getOptions(choice).find((option) => option.id === getOptionValue(choice));
+}
+export function isOptionSelected(choice) {
+    return !!getSelectedOption(choice);
+}
+export function isTodo(choice) {
+    return !isOptional(choice) && getOptionValue(choice) === null;
+}
+// Given a Choice, return options for a select element that are potentially grouped by sourceCategory
+//used in DetailChoiceFeat.tsx for feat choices
+export function getSortedChoiceOptionsInfo(choice, ruleData, entityRestrictionData) {
+    var _a;
+    const options = getOptions(choice);
+    let description;
+    // If every option in the array has a null sourceId, ignore sorting by sourceId.
+    // If any option has a non-null sourceId, sort by sourceId.
+    const shouldSortBySourceId = options.some((option) => option.hasOwnProperty('sourceId') && option.sourceId !== null);
+    let featChoiceOptions;
+    //If the options have a sourceId, group them by Source Category (for now this should only be BuilderChoiceTypeEnum.ENTITY_SPELL_OPTION - we also have to do this in FeatureChoice for spell options)
+    if (shouldSortBySourceId) {
+        // Map over the options to mock parts of a DefinitionContract.
+        const groupedOptions = SourceUtils.getSimpleSourcedDefinitionContracts(options);
+        //If there is a chosen option, set detailChoiceDesc to its description.
+        const chosenOption = options.find((option) => option.id === getOptionValue(choice));
+        description = (_a = chosenOption === null || chosenOption === void 0 ? void 0 : chosenOption.description) !== null && _a !== void 0 ? _a : '';
+        featChoiceOptions = SourceUtils.getGroupedOptionsBySourceCategory(groupedOptions, ruleData, chosenOption === null || chosenOption === void 0 ? void 0 : chosenOption.id, entityRestrictionData);
+    }
+    else {
+        featChoiceOptions = options.map((option) => (Object.assign(Object.assign({}, option), { value: option.id })));
+        featChoiceOptions = orderBy(featChoiceOptions, 'label');
+    }
+    return {
+        options: featChoiceOptions,
+        description,
+    };
+}
+// filter Choice options based on modifiers and default subtypes that identify when a user has made a choice from another source. We filter those options out or we append the source data origin name next to the option label
+export function getRemainingOptions(options, modifiers, defaultSubtypes, showBackgroundProficiencyOptions, optionValue) {
+    let remainingSubtypes = [];
+    let selectedOption = options.find((option) => option.value === optionValue);
+    //if there is a default option set, the default option is granted automatically.
+    //defaultSubtypes would be an array of remaining options and we need to filter out anything that is already found in a modifier from another source
+    if (defaultSubtypes) {
+        if (defaultSubtypes.length > 1) {
+            defaultSubtypes.forEach((defaultSubtype) => {
+                if (!modifiers.find((modifier) => modifier.friendlySubtypeName === defaultSubtype) ||
+                    (selectedOption && selectedOption.label === defaultSubtype)) {
+                    remainingSubtypes.push(defaultSubtype);
+                }
+            });
+        }
+        else if (defaultSubtypes.length === 1 &&
+            !modifiers.find((modifier) => modifier.friendlySubtypeName === defaultSubtypes[0])) {
+            remainingSubtypes = [...defaultSubtypes];
+        }
+    }
+    // If there are any remaining subtypes, only show those
+    if (remainingSubtypes.length) {
+        options = options.filter((option) => remainingSubtypes.includes(option.label ? option.label : '') || optionValue === option.value);
+    }
+    else {
+        // If there aren't any remaining subtype defaults, just show the normal list of options
+        if (modifiers.length) {
+            options = options.reduce((acc, option) => {
+                // Find any existing modifiers that are the current option
+                let optionModifiers = modifiers.filter((modifier) => modifier.friendlySubtypeName === option.label);
+                let backgroundOptionModifier = null;
+                if (showBackgroundProficiencyOptions && optionModifiers.length) {
+                    // If there are any existing modifiers, find out if any of them are from a background
+                    const foundBackgroundOptionModifier = optionModifiers.find((modifier) => !ModifierAccessors.isGranted(modifier) &&
+                        ModifierAccessors.getDataOriginType(modifier) === DataOriginTypeEnum.BACKGROUND);
+                    if (foundBackgroundOptionModifier) {
+                        backgroundOptionModifier = foundBackgroundOptionModifier;
+                    }
+                }
+                if (!optionModifiers.length || backgroundOptionModifier || optionValue === option.value) {
+                    let value = typeof option.value === 'string' ? HelperUtils.parseInputInt(option.value) : option.value;
+                    //append the dataOrigin of the modifier (background) to the option label so the user knows where the option was selected
+                    if (value !== null) {
+                        acc.push(Object.assign(Object.assign({}, option), { value: value, label: backgroundOptionModifier
+                                ? `${option.label} (${EntityUtils.getDataOriginName(ModifierAccessors.getDataOrigin(backgroundOptionModifier))})`
+                                : option.label }));
+                    }
+                }
+                return acc;
+            }, []);
+        }
+    }
+    return options;
+}
+//TODO this was abstracted from DetailChoice.tsx and needs to be broken down to smaller utils and simplified
+//TODO also need to remove the Array<any> type when gathering the renderOptions and fix the typing
+export function getSortedRenderOptions(options, classId, subType, entityRestrictionData, languages, ruleData, defaultSubtypes, showBackgroundProficiencyOptions, choiceInfo, optionValue) {
+    const { classSpellLists, proficiencyModifiers, languageModifiers, expertiseModifiers, kenseiModifiers, abilityLookup, } = choiceInfo;
+    // TODO need to get rid of this any and fix the typing
+    // let renderOptions: Array<FeatureChoiceOption | HtmlSelectOptionGroup> = options;
+    let renderOptions = options;
+    switch (subType) {
+        case BuilderChoiceSubtypeEnum.PROFICIENCY:
+            renderOptions = getRemainingOptions(renderOptions, [...proficiencyModifiers, ...expertiseModifiers], defaultSubtypes, showBackgroundProficiencyOptions, optionValue);
+            break;
+        case BuilderChoiceSubtypeEnum.LANGUAGE:
+            //handle languages based on other language choices made
+            renderOptions = getRemainingOptions(renderOptions, languageModifiers, defaultSubtypes, showBackgroundProficiencyOptions, optionValue);
+            //create lookup from ruledata - name: rpgSourceId
+            const languageNameLookup = languages.reduce((acc, curr) => {
+                var _a;
+                return Object.assign(Object.assign({}, acc), { [(_a = curr.name) !== null && _a !== void 0 ? _a : '']: curr.rpgSourceId });
+            }, {});
+            //transform language options to choiceOptionContracts to attach sourceId for grouping by Source Category
+            const choiceOptionContracts = renderOptions.map((option) => {
+                return {
+                    label: option.label,
+                    id: option.id,
+                    description: option.description,
+                    sourceId: option.label ? HelperUtils.lookupDataOrFallback(languageNameLookup, option.label) : null,
+                };
+            });
+            const groupedOptions = SourceUtils.getSimpleSourcedDefinitionContracts(choiceOptionContracts);
+            //group languages by source category
+            renderOptions = SourceUtils.getGroupedOptionsBySourceCategory(groupedOptions, ruleData, optionValue, entityRestrictionData, 'Other');
+            break;
+        case BuilderChoiceSubtypeEnum.KENSEI:
+            renderOptions = getRemainingOptions(renderOptions, kenseiModifiers, defaultSubtypes, showBackgroundProficiencyOptions, optionValue);
+            break;
+        case BuilderChoiceSubtypeEnum.EXPERTISE:
+            renderOptions = renderOptions.filter((option) => (proficiencyModifiers.find((modifier) => ModifierAccessors.getFriendlySubtypeName(modifier) === option.label) &&
+                !expertiseModifiers.find((modifier) => ModifierAccessors.getFriendlySubtypeName(modifier) === option.label)) ||
+                optionValue === option.value);
+            break;
+        case BuilderChoiceSubtypeEnum.EXPERTISE_NO_REQUIREMENT:
+            renderOptions = renderOptions.filter((option) => !expertiseModifiers.find((modifier) => ModifierAccessors.getFriendlySubtypeName(modifier) === option.label) || optionValue === option.value);
+            break;
+        case BuilderChoiceSubtypeEnum.KNOWN_SPELLS:
+            const spellList = classSpellLists.find((classSpellList) => ClassAccessors.getId(classSpellList.charClass) === classId);
+            if (spellList) {
+                renderOptions = renderOptions
+                    .map((topOption) => {
+                    if ('options' in topOption && topOption.options) {
+                        return Object.assign(Object.assign({}, topOption), { options: topOption.options.filter((option) => SpellUtils.isSpellKnown(spellList, Number(option.value)) ||
+                                optionValue === option.value) });
+                    }
+                    else {
+                        const singleOption = topOption;
+                        return SpellUtils.isSpellKnown(spellList, Number(singleOption.value)) ||
+                            optionValue === singleOption.value
+                            ? singleOption
+                            : null;
+                    }
+                })
+                    .filter(TypeScriptUtils.isNotNullOrUndefined);
+            }
+            break;
+        case BuilderChoiceSubtypeEnum.ABILITY_SCORE: {
+            renderOptions = renderOptions.filter((option) => {
+                let abilityId = null;
+                switch (option.label) {
+                    case 'Charisma Score':
+                        abilityId = AbilityStatEnum.CHARISMA;
+                        break;
+                    case 'Constitution Score':
+                        abilityId = AbilityStatEnum.CONSTITUTION;
+                        break;
+                    case 'Dexterity Score':
+                        abilityId = AbilityStatEnum.DEXTERITY;
+                        break;
+                    case 'Intelligence Score':
+                        abilityId = AbilityStatEnum.INTELLIGENCE;
+                        break;
+                    case 'Strength Score':
+                        abilityId = AbilityStatEnum.STRENGTH;
+                        break;
+                    case 'Wisdom Score':
+                        abilityId = AbilityStatEnum.WISDOM;
+                        break;
+                }
+                return !abilityId || (abilityId && !abilityLookup[abilityId].isMaxed) || optionValue === option.value;
+            });
+            break;
+        }
+    }
+    return renderOptions.length > 0 && renderOptions[0].hasOwnProperty('optGroupLabel')
+        ? orderBy(renderOptions, 'sortOrder')
+        : orderBy(renderOptions, 'label');
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Class/accessors.js b/ddb_main/packages/rules-engine/es/engine/Class/accessors.js
new file mode 100644
index 0000000..011bcdc
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Class/accessors.js
@@ -0,0 +1,535 @@
+/**
+ *
+ * @param charClass
+ */
+export function getDefinition(charClass) {
+    return charClass.definition;
+}
+/**
+ * @param charClass
+ */
+export function getName(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getId(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionHitDiceType(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.hitDice) !== null && _b !== void 0 ? _b : 0;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getHitDiceType(charClass) {
+    return getDefinitionHitDiceType(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionSpellcastingStatId(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.spellCastingAbilityId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionSpellContainerName(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.spellContainerName) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getSpellContainerName(charClass) {
+    return getDefinitionSpellContainerName(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionKnowsAllSpells(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.knowsAllSpells) !== null && _b !== void 0 ? _b : null;
+}
+export function getKnowsAllSpells(charClass) {
+    return getDefinitionKnowsAllSpells(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionSpellPrepareType(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.spellPrepareType) !== null && _b !== void 0 ? _b : null;
+}
+export function getSpellPrepareType(charClass) {
+    return getDefinitionSpellPrepareType(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionSpellCastingLearningStyle(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.spellCastingLearningStyle) !== null && _b !== void 0 ? _b : null;
+}
+export function getSpellCastingLearningStyle(charClass) {
+    return charClass.spellCastingLearningStyle;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getPortraitUrl(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.portraitAvatarUrl) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param charClass
+ */
+export function getAvatarUrl(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.avatarUrl) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param charClass
+ */
+export function getLargeAvatarUrl(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.largeAvatarUrl) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param charClass
+ */
+export function isKnownSpellcaster(charClass) {
+    const spellRules = getSpellRules(charClass);
+    return spellRules.isKnownSpellcaster;
+}
+/**
+ *
+ * @param charClass
+ */
+export function isPreparedSpellcaster(charClass) {
+    const spellRules = getSpellRules(charClass);
+    return spellRules.isPreparedSpellcaster;
+}
+/**
+ *
+ * @param charClass
+ */
+export function isSpellbookSpellcaster(charClass) {
+    const spellRules = getSpellRules(charClass);
+    return spellRules.isSpellbookSpellcaster;
+}
+/**
+ *
+ * @param charClass
+ */
+export function isRitualSpellCaster(charClass) {
+    const spellRules = getSpellRules(charClass);
+    return spellRules.isRitualSpellCaster;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getCanCastSpells(charClass) {
+    getDefinitionCanCastSpells(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionCanCastSpells(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.canCastSpells) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionDescription(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDescription(charClass) {
+    return getDefinitionDescription(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionEquipmentDescription(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.equipmentDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getEquipmentDescription(charClass) {
+    return getDefinitionEquipmentDescription(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getMoreDetailsUrl(charClass) {
+    return getDefinitionMoreDetailsUrl(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionMoreDetailsUrl(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.moreDetailsUrl) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionParentClassId(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.parentClassId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getParentClassId(charClass) {
+    return getDefinitionParentClassId(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionSubclassDefinition(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.subclassDefinition) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getWealthDice(charClass) {
+    return getDefinitionWealthDice(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionWealthDice(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.wealthDice) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionClassFeatures(charClass) {
+    var _a;
+    return (_a = charClass.classFeatures) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param charClass
+ */
+export function getMappingEntityTypeId(charClass) {
+    return charClass.entityTypeId;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getHitDiceUsed(charClass) {
+    return charClass.hitDiceUsed;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getMappingId(charClass) {
+    return charClass.id;
+}
+/**
+ *
+ * @param charClass
+ */
+export function isStartingClass(charClass) {
+    return charClass.isStartingClass;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getLevel(charClass) {
+    return charClass.level;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getSubclassName(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.subclassDefinition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getSubclass(charClass) {
+    return charClass.subclassDefinition;
+}
+/**
+ * this field will always return null until character service updates to populate it
+ * @param charClass
+ */
+export function getSubclassDefinitionId(charClass) {
+    return charClass.subclassDefinitionId;
+}
+/**
+ *
+ * @param charClass
+ */
+export function isPactMagicActive(charClass) {
+    return charClass.isPactMagicActive;
+}
+/**
+ *
+ * @param charClass
+ */
+export function isSpellcastingActive(charClass) {
+    return charClass.isSpellcastingActive;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getSlug(charClass) {
+    return charClass.slug;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getSpellRules(charClass) {
+    return charClass.spellRules;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getActions(charClass) {
+    return charClass.actions;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getActiveClassFeatures(charClass) {
+    return charClass.activeClassFeatures;
+}
+/**
+ * @deprecated only used for typescript parody because of spells being in two different states within the same location
+ * @param charClass
+ */
+export function getBaseClassSpells(charClass) {
+    return charClass.spells;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getClassFeatures(charClass) {
+    var _a;
+    return (_a = charClass.classFeatures) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param charClass
+ */
+export function getEnablesHexWeapon(charClass) {
+    return charClass.enablesHexWeapon;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getEnablesPactWeapon(charClass) {
+    return charClass.enablesPactWeapon;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getEnablesDedicatedWeapon(charClass) {
+    return charClass.enablesDedicatedWeapon;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getFeats(charClass) {
+    return charClass.feats;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getFeatureSpells(charClass) {
+    return charClass.featureSpells;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getModifiers(charClass) {
+    return charClass.modifiers;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getOrderedClassFeatures(charClass) {
+    return charClass.orderedClassFeatures;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getSpells(charClass) {
+    return charClass.spells;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getUniqueClassFeatures(charClass) {
+    return charClass.uniqueClassFeatures;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getVisibileClassFeatures(charClass) {
+    return charClass.visibleClassFeatures;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getActiveId(charClass) {
+    return charClass.activeId;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionPrimaryAbilities(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.primaryAbilities) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param charClass
+ */
+export function getPrimaryAbilities(charClass) {
+    return getDefinitionPrimaryAbilities(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionPrerequisites(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.prerequisites) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param charClass
+ */
+export function getPrerequisites(charClass) {
+    return getDefinitionPrerequisites(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionSpellConfiguration(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.spellRules) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getSpellConfiguration(charClass) {
+    return getDefinitionSpellConfiguration(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionSources(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.sources) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param charClass
+ */
+export function getSources(charClass) {
+    return getDefinitionSources(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getDefinitionIsHomebrew(charClass) {
+    var _a, _b;
+    return (_b = (_a = charClass.definition) === null || _a === void 0 ? void 0 : _a.isHomebrew) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param charClass
+ */
+export function isHomebrew(charClass) {
+    return getDefinitionIsHomebrew(charClass);
+}
+/**
+ *
+ * @param charClass
+ */
+export function getSpellListIds(charClass) {
+    return charClass.spellListIds;
+}
+/**
+ *
+ * @param charClass
+ */
+export function getOptionalClassFeatures(charClass) {
+    return charClass.optionalClassFeatures;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Class/derivers.js b/ddb_main/packages/rules-engine/es/engine/Class/derivers.js
new file mode 100644
index 0000000..dba8e22
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Class/derivers.js
@@ -0,0 +1,296 @@
+import { orderBy } from 'lodash';
+import { ChoiceUtils } from '../Choice';
+import { ClassFeatureAccessors, ClassFeatureUtils, ClassFeatureValidators } from '../ClassFeature';
+import { DB_STRING_BOOK_OF_ANCIENT_SECRETS, DB_STRING_INFUSE_ITEM, FeatureTypeEnum, } from '../Core';
+import { DataOriginGenerators } from '../DataOrigin';
+import { HelperUtils } from '../Helper';
+import { ModifierValidators } from '../Modifier';
+import { OptionalClassFeatureAccessors } from '../OptionalClassFeature';
+import { DefaultSpellCastingLearningStyle, SpellDerivers } from '../Spell';
+import { getActiveId, getDefinitionClassFeatures, getDefinitionSpellcastingStatId, getId, getLevel, getMappingId, getSubclass, getClassFeatures, getDefinitionSpellCastingLearningStyle, } from './accessors';
+/**
+ *
+ * @param charClass
+ * @param subclassDefinition
+ */
+export function deriveSpellcastingStatId(charClass, subclassDefinition) {
+    if (subclassDefinition && subclassDefinition.spellCastingAbilityId !== null) {
+        return subclassDefinition.spellCastingAbilityId;
+    }
+    return getDefinitionSpellcastingStatId(charClass);
+}
+/**
+ *
+ * @param charClass
+ * @param subclassDefinition
+ */
+export function deriveSpellCastingLearningStyle(charClass) {
+    var _a;
+    const subclassDefinition = getSubclass(charClass);
+    if (subclassDefinition === null || subclassDefinition === void 0 ? void 0 : subclassDefinition.spellCastingLearningStyle) {
+        return subclassDefinition.spellCastingLearningStyle;
+    }
+    return (_a = getDefinitionSpellCastingLearningStyle(charClass)) !== null && _a !== void 0 ? _a : DefaultSpellCastingLearningStyle;
+}
+/**
+ *
+ * @param classFeatures
+ * @param classLevel
+ */
+export function deriveIsSpellcastingActive(classFeatures, classLevel) {
+    const spellcastingFeature = classFeatures.find((feature) => ClassFeatureUtils.doesEnableSpellcasting(feature));
+    return !!spellcastingFeature && ClassFeatureAccessors.getRequiredLevel(spellcastingFeature) <= classLevel;
+}
+/**
+ *
+ * @param classFeatures
+ * @param classLevel
+ */
+export function deriveIsPactMagicActive(classFeatures, classLevel) {
+    const pactMagicFeature = classFeatures.find((feature) => ClassFeatureUtils.doesEnablePactMagic(feature));
+    return !!pactMagicFeature && ClassFeatureAccessors.getRequiredLevel(pactMagicFeature) <= classLevel;
+}
+/**
+ *
+ * @param charClass
+ * @param allClassSpells
+ * @param allClassAlwaysPreparedSpells
+ * @param allClassAlwaysKnownSpells
+ */
+export function deriveSpells(charClass, allClassSpells, allClassAlwaysPreparedSpells, allClassAlwaysKnownSpells) {
+    const classSpells = allClassSpells.find((classSpell) => classSpell.characterClassId === getMappingId(charClass));
+    const spells = [];
+    if (classSpells === null || classSpells === void 0 ? void 0 : classSpells.spells) {
+        spells.push(...classSpells.spells);
+    }
+    let classSpellMappingLookup = {};
+    const alwaysPreparedSpells = HelperUtils.lookupDataOrFallback(allClassAlwaysPreparedSpells, deriveActiveId(charClass));
+    const alwaysKnownSpells = HelperUtils.lookupDataOrFallback(allClassAlwaysKnownSpells, deriveActiveId(charClass));
+    // If we have any "always" spells, make a lookup of the existing class spell mappings
+    if (alwaysKnownSpells !== null || alwaysPreparedSpells !== null) {
+        if (classSpells === null || classSpells === void 0 ? void 0 : classSpells.spells) {
+            classSpellMappingLookup = classSpells.spells.reduce((acc, spell) => {
+                acc[SpellDerivers.deriveKnownKey(spell)] = true;
+                return acc;
+            }, {});
+        }
+    }
+    // exclude always prepared spells that we are already sent in the class spell mappings
+    if (alwaysPreparedSpells !== null) {
+        alwaysPreparedSpells.forEach((spell) => {
+            const knownKey = SpellDerivers.deriveKnownKey(spell);
+            if (!HelperUtils.lookupDataOrFallback(classSpellMappingLookup, knownKey, false)) {
+                spells.push(spell);
+                classSpellMappingLookup[knownKey] = true;
+            }
+        });
+    }
+    // exclude always known spells that we are already sent in the class spell mappings
+    if (alwaysKnownSpells !== null) {
+        alwaysKnownSpells.forEach((spell) => {
+            if (!HelperUtils.lookupDataOrFallback(classSpellMappingLookup, SpellDerivers.deriveKnownKey(spell), false)) {
+                spells.push(spell);
+            }
+        });
+    }
+    return spells;
+}
+/**
+ * The classFeatures being passed in here are updated during BaseCharClass generation and cannot be accessed off charClass
+ * fix this to eventually not have class and class features from separate stages
+ *
+ * @param charClass
+ * @param classFeatures
+ * @param choiceLookup
+ * @param ruleData
+ */
+export function deriveSpellRules(charClass, classFeatures, choiceLookup, ruleData) {
+    const abilityId = deriveSpellcastingStatId(charClass, getSubclass(charClass));
+    let enablesRitualCasting = false;
+    classFeatures.forEach((feature) => {
+        const id = ClassFeatureAccessors.getId(feature);
+        const entityTypeId = ClassFeatureAccessors.getEntityTypeId(feature);
+        const choicesFallback = [];
+        const choices = HelperUtils.lookupDataOrFallback(choiceLookup, DataOriginGenerators.generateDataOriginKey(id, entityTypeId), choicesFallback);
+        if (choices.length > 0) {
+            choices.forEach((choice) => {
+                const selectedOption = ChoiceUtils.getSelectedOption(choice);
+                if (!enablesRitualCasting &&
+                    selectedOption &&
+                    selectedOption.label === DB_STRING_BOOK_OF_ANCIENT_SECRETS) {
+                    enablesRitualCasting = true;
+                }
+            });
+        }
+    });
+    return SpellDerivers.deriveClassSpellRules(charClass, abilityId, ruleData, enablesRitualCasting);
+}
+/**
+ *
+ * @param charClass
+ * @param classFeatures
+ * @param appContext
+ */
+export function deriveClassFeatureGroups(charClass, classFeatures, appContext) {
+    const activeFeatures = classFeatures.filter((feature) => ClassFeatureAccessors.getRequiredLevel(feature) <= getLevel(charClass));
+    const visibleFeatures = activeFeatures.filter((feature) => appContext === null || !ClassFeatureUtils.getHideInContext(feature, appContext));
+    const orderedFeatures = deriveOrderedClassFeatures(visibleFeatures);
+    const uniqueFeatures = orderedFeatures.reduce((acc, feature) => {
+        const existingFeatureIdx = acc.findIndex((accFeature) => ClassFeatureAccessors.getName(accFeature) === ClassFeatureAccessors.getName(feature));
+        if (existingFeatureIdx > 0) {
+            acc[existingFeatureIdx] = feature;
+        }
+        else {
+            acc.push(feature);
+        }
+        return acc;
+    }, []);
+    return {
+        activeFeatures,
+        visibleFeatures,
+        orderedFeatures,
+        uniqueFeatures,
+    };
+}
+/**
+ *
+ * @param classFeatures
+ */
+export function deriveOrderedClassFeatures(classFeatures) {
+    return orderBy(classFeatures, [
+        (classFeature) => ClassFeatureAccessors.getRequiredLevel(classFeature),
+        (classFeature) => ClassFeatureAccessors.getDisplayOrder(classFeature),
+        (classFeature) => ClassFeatureAccessors.getName(classFeature),
+    ]);
+}
+/**
+ *
+ * @param classFeatures
+ */
+export function deriveDedicatedHexAndPactWeaponEnabled(classFeatures, classModifiers) {
+    let enablesHexWeapon = false;
+    let enablesPactWeapon = false;
+    let enablesDedicatedWeapon = false;
+    classModifiers.forEach((modifier) => {
+        if (!enablesPactWeapon && ModifierValidators.isEnablePactWeaponModifier(modifier)) {
+            enablesPactWeapon = true;
+            return;
+        }
+        if (!enablesHexWeapon && ModifierValidators.isEnableHexWeaponModifier(modifier)) {
+            enablesHexWeapon = true;
+            return;
+        }
+    });
+    //TODO remove this once we have dedicated weapon driven by modifiers
+    classFeatures.forEach((feature) => {
+        if (!enablesDedicatedWeapon && ClassFeatureUtils.doesEnableDedicatedWeapon(feature)) {
+            enablesDedicatedWeapon = true;
+        }
+    });
+    return {
+        enablesHexWeapon,
+        enablesPactWeapon,
+        enablesDedicatedWeapon,
+    };
+}
+/**
+ *
+ * @param charClass
+ */
+export function deriveActiveId(charClass) {
+    const subclass = getSubclass(charClass);
+    if (subclass === null) {
+        return getId(charClass);
+    }
+    return subclass.id;
+}
+/**
+ *
+ * @param classes
+ */
+export function deriveIsMulticlassCharacter(classes) {
+    return classes.length > 1;
+}
+/**
+ *
+ * @param charClass
+ */
+export function deriveUniqueKey(charClass) {
+    return `class-${getActiveId(charClass)}`;
+}
+/**
+ *
+ * @param classFeatures
+ * @param classLevel
+ */
+export function deriveSpellListIds(classFeatures, classLevel) {
+    let spellLidsIds = [];
+    classFeatures
+        .filter((classFeature) => ClassFeatureAccessors.getRequiredLevel(classFeature) <= classLevel)
+        .forEach((classFeature) => {
+        spellLidsIds.push(...ClassFeatureAccessors.getSpellListIds(classFeature));
+    });
+    return spellLidsIds;
+}
+/**
+ * has mirrored deriver RaceDerivers.deriveConsolidatedRacialTraits
+ *   - most likely update together
+ *
+ * @param charClass
+ * @param optionalClassFeatures
+ * @param enableOptionalClassFeatures
+ */
+export function deriveConsolidatedClassFeatures(charClass, optionalClassFeatures, enableOptionalClassFeatures) {
+    //filtering because after generating CharClass, this function is used in getUpdateEnableOptionalClassFeaturesSpellListIdsToRemove
+    //      to determine updated look of race and we don't store original definition info for classes
+    const originalDefinitionClassFeatures = getDefinitionClassFeatures(charClass).filter((feature) => ClassFeatureAccessors.getFeatureType(feature) === FeatureTypeEnum.GRANTED);
+    if (!enableOptionalClassFeatures) {
+        return originalDefinitionClassFeatures;
+    }
+    const additionalClassFeatures = [];
+    const definitionKeysToRemove = new Set();
+    optionalClassFeatures.forEach((optionalClassFeature) => {
+        const classFeature = OptionalClassFeatureAccessors.getClassFeature(optionalClassFeature);
+        if (classFeature === null) {
+            return;
+        }
+        const featureType = ClassFeatureAccessors.getFeatureType(classFeature);
+        switch (featureType) {
+            case FeatureTypeEnum.REPLACEMENT: {
+                const affectedDefinitionKey = OptionalClassFeatureAccessors.getAffectedClassFeatureDefinitionKey(optionalClassFeature);
+                const affectedFeatureKeys = ClassFeatureAccessors.getAffectedFeatureDefinitionKeys(classFeature);
+                //verify this is a valid replacement
+                if (affectedDefinitionKey &&
+                    affectedFeatureKeys.includes(affectedDefinitionKey) &&
+                    ClassFeatureValidators.isValidClassClassFeature(charClass, classFeature)) {
+                    definitionKeysToRemove.add(affectedDefinitionKey);
+                    additionalClassFeatures.push(classFeature);
+                }
+                break;
+            }
+            case FeatureTypeEnum.ADDITIONAL:
+            case FeatureTypeEnum.GRANTED:
+            default:
+                if (ClassFeatureValidators.isValidClassClassFeature(charClass, classFeature)) {
+                    additionalClassFeatures.push(classFeature);
+                }
+        }
+    });
+    //remove definitionKeysToRemove
+    const filteredDefinitionClassFeatures = originalDefinitionClassFeatures.filter((feature) => !definitionKeysToRemove.has(ClassFeatureAccessors.getDefinitionKey(feature)));
+    return [...filteredDefinitionClassFeatures, ...additionalClassFeatures];
+}
+/**
+ *
+ * @param charClass
+ */
+export function deriveMaxInfusions(charClass) {
+    var _a;
+    const features = getClassFeatures(charClass);
+    const infuseFeature = features.find((classFeature) => ClassFeatureAccessors.getName(classFeature) === DB_STRING_INFUSE_ITEM);
+    if (infuseFeature) {
+        const infusionLevelScale = ClassFeatureAccessors.getLevelScale(infuseFeature);
+        return (_a = infusionLevelScale === null || infusionLevelScale === void 0 ? void 0 : infusionLevelScale.fixedValue) !== null && _a !== void 0 ? _a : 0;
+    }
+    return null;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Class/generators.js b/ddb_main/packages/rules-engine/es/engine/Class/generators.js
new file mode 100644
index 0000000..666623e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Class/generators.js
@@ -0,0 +1,385 @@
+import { keyBy, orderBy } from 'lodash';
+import { AbilityDerivers } from '../Ability';
+import { CharacterDerivers, } from '../Character';
+import { ClassFeatureAccessors, ClassFeatureGenerators } from '../ClassFeature';
+import { DB_STRING_IMPROVED_PACT_WEAPON } from '../Core';
+import { DataOriginDataInfoKeyEnum, DataOriginTypeEnum } from '../DataOrigin';
+import { FormatUtils } from '../Format';
+import { ModifierDerivers, ModifierValidators } from '../Modifier';
+import { OptionAccessors } from '../Option';
+import { SpellAccessors, SpellDerivers, SpellGenerators, } from '../Spell';
+import { getActiveId, getBaseClassSpells, getClassFeatures, getDefinitionClassFeatures, getEnablesDedicatedWeapon, getEnablesHexWeapon, getEnablesPactWeapon, getId, getLevel, getMappingId, getName, getSlug, getSpellPrepareType, getSpellRules, getSpells, getSubclass, isPactMagicActive, isSpellcastingActive, isStartingClass, } from './accessors';
+import { deriveActiveId, deriveClassFeatureGroups, deriveConsolidatedClassFeatures, deriveDedicatedHexAndPactWeaponEnabled, deriveIsPactMagicActive, deriveIsSpellcastingActive, deriveSpellCastingLearningStyle, deriveSpellListIds, deriveSpellRules, deriveSpells, deriveUniqueKey, } from './derivers';
+export function generateBaseCharClasses(charClasses, optionalClassFeatures, allClassSpells, allClassAlwaysPreparedSpells, allClassAlwaysKnownSpells, appContext, ruleData, classesLookupData, definitionPool, characterPreferences, characterId, choiceComponents, baseFeats) {
+    const orderedClasses = orderBy(charClasses, [(charClass) => isStartingClass(charClass), (charClass) => getName(charClass)], ['desc', 'asc']);
+    const hack__baseCharClasses = orderedClasses.map((charClass) => hack__generateHackBaseCharClass(charClass, optionalClassFeatures, ruleData, classesLookupData, characterPreferences.enableOptionalClassFeatures));
+    return hack__baseCharClasses.map((charClass) => generateBaseCharClass(charClass, optionalClassFeatures, allClassSpells, allClassAlwaysPreparedSpells, allClassAlwaysKnownSpells, appContext, ruleData, classesLookupData, definitionPool, characterId, choiceComponents, baseFeats));
+}
+export function hack__generateHackBaseCharClass(charClass, optionalClassFeatures, ruleData, classesLookupData, enableOptionalClassFeatures) {
+    const consolidatedClassFeatureDefinitions = deriveConsolidatedClassFeatures(charClass, optionalClassFeatures, enableOptionalClassFeatures);
+    return Object.assign(Object.assign({}, charClass), { spellRules: deriveSpellRules(charClass, consolidatedClassFeatureDefinitions, classesLookupData.choiceLookup, ruleData), isSpellcastingActive: deriveIsSpellcastingActive(consolidatedClassFeatureDefinitions, getLevel(charClass)), isPactMagicActive: deriveIsPactMagicActive(consolidatedClassFeatureDefinitions, getLevel(charClass)), classFeatures: consolidatedClassFeatureDefinitions });
+}
+/**
+ *
+ * @param charClass
+ * @param classSpells
+ * @param classFeatures
+ */
+function updateClassFeatures(charClass, classSpells, classFeatures) {
+    return classFeatures.map((classFeature) => {
+        const spells = SpellGenerators.updateClassFeatureSpells(ClassFeatureAccessors.getSpells(classFeature), classSpells);
+        const options = ClassFeatureAccessors.getOptions(classFeature).map((option) => {
+            const spells = SpellGenerators.updateClassFeatureSpells(OptionAccessors.getSpells(option), classSpells);
+            return Object.assign(Object.assign({}, option), { spells });
+        });
+        return Object.assign(Object.assign({}, classFeature), { spells,
+            options });
+    });
+}
+export function generateBaseCharClass(charClass, optionalClassFeatures, allClassSpells, allClassAlwaysPreparedSpells, allClassAlwaysKnownSpells, appContext, ruleData, classesLookupData, definitionPool, characterId, choiceComponents, baseFeats) {
+    const classModifiers = [];
+    const featureSpells = [];
+    const feats = [];
+    const actions = [];
+    const generatedClassFeatures = getDefinitionClassFeatures(charClass).map((classFeature) => ClassFeatureGenerators.generateClassFeature(charClass, classFeature, ruleData, classesLookupData, definitionPool, characterId, choiceComponents, baseFeats));
+    // update modifiers, feats and actions arrays based on classFeatures
+    generatedClassFeatures.forEach((generatedClassFeature) => {
+        classModifiers.push(...ClassFeatureAccessors.getModifiers(generatedClassFeature));
+        feats.push(...ClassFeatureAccessors.getFeats(generatedClassFeature));
+        actions.push(...ClassFeatureAccessors.getActions(generatedClassFeature));
+        ClassFeatureAccessors.getOptions(generatedClassFeature).forEach((option) => {
+            classModifiers.push(...OptionAccessors.getModifiers(option));
+            feats.push(...OptionAccessors.getFeats(option));
+            actions.push(...OptionAccessors.getActions(option));
+        });
+    });
+    const classSpells = deriveSpells(charClass, allClassSpells, allClassAlwaysPreparedSpells, allClassAlwaysKnownSpells);
+    const updatedFeatures = updateClassFeatures(charClass, classSpells, generatedClassFeatures);
+    // update spells array base on updated classFeatures
+    updatedFeatures.forEach((classFeature) => {
+        featureSpells.push(...ClassFeatureAccessors.getSpells(classFeature));
+        ClassFeatureAccessors.getOptions(classFeature).forEach((option) => {
+            featureSpells.push(...OptionAccessors.getSpells(option));
+        });
+    });
+    const { activeFeatures, visibleFeatures, orderedFeatures, uniqueFeatures } = deriveClassFeatureGroups(charClass, updatedFeatures, appContext);
+    // do any class features or modifiers enable hex, pact or dedicated weapons
+    //TODO eventually should just be able to use modifiers here and not have to check class feature names
+    const { enablesHexWeapon, enablesPactWeapon, enablesDedicatedWeapon } = deriveDedicatedHexAndPactWeaponEnabled(updatedFeatures, classModifiers);
+    return Object.assign(Object.assign({}, charClass), { activeId: deriveActiveId(charClass), spells: SpellGenerators.updateClassSpells(featureSpells, classSpells), modifiers: classModifiers, featureSpells, classFeatures: updatedFeatures, optionalClassFeatures, activeClassFeatures: activeFeatures, visibleClassFeatures: visibleFeatures, orderedClassFeatures: orderedFeatures, uniqueClassFeatures: uniqueFeatures, feats,
+        actions,
+        enablesDedicatedWeapon,
+        enablesHexWeapon,
+        enablesPactWeapon, slug: FormatUtils.cobaltSlugify(getName(charClass)), spellListIds: deriveSpellListIds(updatedFeatures, getLevel(charClass)), spellCastingLearningStyle: deriveSpellCastingLearningStyle(charClass) });
+}
+export function generateClassFeatureLookup(baseCharClasses) {
+    const lookup = {};
+    for (const baseCharClass of baseCharClasses) {
+        for (const classFeature of baseCharClass.classFeatures) {
+            if (classFeature.definition) {
+                lookup[classFeature.definition.id] = classFeature;
+            }
+        }
+    }
+    return lookup;
+}
+/**
+ *
+ * @param classes
+ */
+export function generateTotalClassLevel(classes) {
+    return classes.reduce((acc, charClass) => (acc += getLevel(charClass)), 0);
+}
+/**
+ *
+ * @param classes
+ * @param ruleData
+ * @param proficiencyBonus
+ * @param modifiers
+ * @param abilityLookup
+ */
+export function generateClassSpellInfoLookup(classes, ruleData, proficiencyBonus, modifiers, abilityLookup) {
+    const lookup = {};
+    classes.forEach((charClass) => {
+        var _a;
+        const classId = getId(charClass);
+        const classSlug = getSlug(charClass);
+        const classLevel = getLevel(charClass);
+        const classSpellRules = getSpellRules(charClass);
+        const spellPrepareType = getSpellPrepareType(charClass);
+        const spellcastingModifier = AbilityDerivers.deriveStatModifier(classSpellRules.spellcastingAbilityStatId, abilityLookup);
+        const knownCantripsMax = classSpellRules.levelCantripsKnownMaxes
+            ? classSpellRules.levelCantripsKnownMaxes[classLevel]
+            : null;
+        const preparedSpellsMax = classSpellRules.levelPreparedSpellMaxes
+            ? (_a = classSpellRules.levelPreparedSpellMaxes[classLevel]) !== null && _a !== void 0 ? _a : null // coallesce if the array is shorter than the class level, happens for prepared classes not using OSIRIS rules
+            : null;
+        const prepareMax = preparedSpellsMax !== null && preparedSpellsMax !== void 0 ? preparedSpellsMax : SpellDerivers.deriveSpellPrepareMax(spellPrepareType, classLevel, spellcastingModifier);
+        const baseToHitModifier = SpellDerivers.deriveSpellAttackModifier(proficiencyBonus, spellcastingModifier);
+        const bonusSpellSaveDcModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusSpellSaveDc(modifier));
+        const bonusSpellSaveDcModifierTotal = ModifierDerivers.sumModifiers(bonusSpellSaveDcModifiers, abilityLookup);
+        const bonusClassCantripDamageModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusClassCantripDamageModifier(modifier, classSlug));
+        const bonusClassCantripDamageModifierTotal = ModifierDerivers.sumModifiers(bonusClassCantripDamageModifiers, abilityLookup);
+        const classSaveDcModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusClassSpellSaveDcModifier(modifier, classSlug));
+        const classSaveDcModifierTotal = ModifierDerivers.sumModifiers(classSaveDcModifiers, abilityLookup);
+        const bonusSpellAttackModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusSpellAttackModifier(modifier, null));
+        const bonusSpellAttackModifierTotal = ModifierDerivers.sumModifiers(bonusSpellAttackModifiers, abilityLookup);
+        const classSpellAttackModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusClassSpellAttackModifier(modifier, classSlug));
+        const classSpellAttackModifierTotal = ModifierDerivers.sumModifiers(classSpellAttackModifiers, abilityLookup);
+        const classSpellDamageModifiers = modifiers.filter((modifier) => ModifierValidators.isValidDamageClassSpellAttackModifier(modifier, classSlug));
+        const classSpellDamageModifierTotal = ModifierDerivers.sumModifiers(classSpellDamageModifiers, abilityLookup);
+        const spellSaveDc = CharacterDerivers.deriveAttackSaveValue(proficiencyBonus, spellcastingModifier) +
+            bonusSpellSaveDcModifierTotal +
+            classSaveDcModifierTotal;
+        const bonusSpellAttack = bonusSpellAttackModifierTotal + classSpellAttackModifierTotal;
+        const toHit = baseToHitModifier + bonusSpellAttack;
+        lookup[classId] = {
+            spellcastingModifier,
+            baseToHitModifier,
+            bonusSpellAttack,
+            spellDamage: classSpellDamageModifierTotal,
+            bonusCantripDamage: bonusClassCantripDamageModifierTotal,
+            spellSaveDc,
+            toHit,
+            knownCantripsMax,
+            prepareMax,
+            knowsAllSpells: classSpellRules.knowsAllSpells,
+        };
+    });
+    return lookup;
+}
+/**
+ *
+ * @param charClasses
+ * @param classSpellInfoLookup
+ * @param overallSpellInfo
+ * @param spellListDataOriginLookup
+ * @param valueLookup
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateCharClasses(charClasses, classSpellInfoLookup, overallSpellInfo, spellListDataOriginLookup, valueLookup, ruleData, modifierData) {
+    return charClasses.map((charClass) => generateCharClass(charClass, classSpellInfoLookup, overallSpellInfo, spellListDataOriginLookup, valueLookup, ruleData, modifierData));
+}
+/**
+ *
+ * @param charClass
+ * @param classSpellInfoLookup
+ * @param overallSpellInfo
+ * @param spellListDataOriginLookup
+ * @param valueLookup
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateCharClass(charClass, classSpellInfoLookup, overallSpellInfo, spellListDataOriginLookup, valueLookup, ruleData, modifierData) {
+    const classSpellInfo = classSpellInfoLookup[getId(charClass)];
+    const generatedSpells = getBaseClassSpells(charClass).map((spell) => {
+        const dataOriginSpell = SpellGenerators.generateDataOriginSpell(spell, DataOriginTypeEnum.CLASS, charClass, null, spellListDataOriginLookup);
+        return SpellGenerators.generateClassSpell(dataOriginSpell, classSpellInfo, overallSpellInfo, valueLookup, ruleData, modifierData);
+    });
+    return Object.assign(Object.assign({}, charClass), { spells: generatedSpells });
+}
+/**
+ *
+ * @param classes
+ */
+export function generateStartingClass(classes) {
+    const startingClass = classes.find((charClass) => isStartingClass(charClass));
+    return startingClass ? startingClass : null;
+}
+/**
+ *
+ * @param classes
+ */
+export function generateHexWeaponEnabled(classes) {
+    let hexWeaponEnabled = false;
+    classes.forEach((charClass) => {
+        hexWeaponEnabled = getEnablesHexWeapon(charClass) || hexWeaponEnabled;
+    });
+    return hexWeaponEnabled;
+}
+/**
+ *
+ * @param classes
+ */
+export function generatePactWeaponEnabled(classes) {
+    let pactWeaponEnabled = false;
+    classes.forEach((charClass) => {
+        pactWeaponEnabled = getEnablesPactWeapon(charClass) || pactWeaponEnabled;
+    });
+    return pactWeaponEnabled;
+}
+/**
+ *
+ * @param classes
+ */
+export function generateImprovedPactWeaponEnabled(classes) {
+    let improvedPactWeaponEnabled = false;
+    classes.forEach((charClass) => {
+        if (improvedPactWeaponEnabled) {
+            return;
+        }
+        const features = getClassFeatures(charClass);
+        features.forEach((feature) => {
+            if (improvedPactWeaponEnabled) {
+                return;
+            }
+            const options = ClassFeatureAccessors.getOptions(feature);
+            options.forEach((option) => {
+                improvedPactWeaponEnabled =
+                    improvedPactWeaponEnabled || OptionAccessors.getName(option) === DB_STRING_IMPROVED_PACT_WEAPON;
+            });
+        });
+    });
+    return improvedPactWeaponEnabled;
+}
+/**
+ *
+ * @param classes
+ */
+export function generateDedicatedWeaponEnabled(classes) {
+    let dedicatedWeaponEnabled = false;
+    classes.forEach((charClass) => {
+        dedicatedWeaponEnabled = getEnablesDedicatedWeapon(charClass) || dedicatedWeaponEnabled;
+    });
+    return dedicatedWeaponEnabled;
+}
+/**
+ *
+ * @param classes
+ */
+export function generateClassLevelLookup(classes) {
+    return classes.reduce((acc, charClass) => {
+        var _a, _b;
+        acc[getId(charClass)] = getLevel(charClass);
+        // add subclass level - this is used for Druid Circle of the Moon creature rules
+        const subclassId = (_b = (_a = getSubclass(charClass)) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : null;
+        if (subclassId) {
+            acc[subclassId] = getLevel(charClass);
+        }
+        return acc;
+    }, {});
+}
+/**
+ *
+ * @param modifierLookup
+ * @param spellLookup
+ * @param actionLookup
+ * @param choiceLookup
+ * @param optionLookup
+ * @param valueLookup
+ * @param featLookup
+ * @param infusionChoiceInfusionLookup
+ * @param knownInfusionLookupByChoiceKey
+ * @param spellListDataOriginLookup
+ */
+export function generateClassesLookupData(modifierLookup, spellLookup, actionLookup, choiceLookup, optionLookup, valueLookup, featLookup, infusionChoiceInfusionLookup, knownInfusionLookupByChoiceKey, spellListDataOriginLookup) {
+    return {
+        modifierLookup,
+        spellLookup,
+        actionLookup,
+        choiceLookup,
+        optionLookup,
+        valueLookup,
+        featLookup,
+        infusionChoiceInfusionLookup,
+        knownInfusionLookupByChoiceKey,
+        spellListDataOriginLookup,
+    };
+}
+/**
+ *
+ * @param classes
+ */
+export function generateSpellcastingClasses(classes) {
+    return classes.filter(isSpellcastingActive);
+}
+/**
+ *
+ * @param classes
+ */
+export function generatePactMagicClasses(classes) {
+    return classes.filter(isPactMagicActive);
+}
+/**
+ *
+ * @param spellcastingClasses
+ * @param pactMagicClasses
+ */
+export function generateAggregatedSpellClasses(spellcastingClasses, pactMagicClasses) {
+    return [...spellcastingClasses, ...pactMagicClasses];
+}
+/**
+ *
+ * @param classes
+ */
+export function generateClassMappingIdLookupByActiveId(classes) {
+    return classes.reduce((acc, charClass) => {
+        acc[getActiveId(charClass)] = getMappingId(charClass);
+        return acc;
+    }, {});
+}
+/**
+ *
+ * @param classes
+ * @param isMulticlassCharacter
+ */
+export function generateClassesModifiers(classes, isMulticlassCharacter) {
+    const modifiers = [];
+    if (classes.length === 0) {
+        return modifiers;
+    }
+    classes.forEach((charClass) => {
+        getClassFeatures(charClass).forEach((classFeature) => {
+            modifiers.push(...ClassFeatureAccessors.getModifiers(classFeature).filter((modifier) => ModifierValidators.isValidClassModifier(modifier, charClass, isMulticlassCharacter)));
+            ClassFeatureAccessors.getOptions(classFeature).forEach((option) => {
+                modifiers.push(...OptionAccessors.getModifiers(option).filter((modifier) => ModifierValidators.isValidClassModifier(modifier, charClass, isMulticlassCharacter)));
+            });
+        });
+    });
+    return modifiers;
+}
+/**
+ *
+ * @param classes
+ */
+export function generateRefClassData(classes) {
+    let data = {};
+    classes.forEach((charClass) => {
+        data[deriveUniqueKey(charClass)] = {
+            [DataOriginDataInfoKeyEnum.PRIMARY]: charClass,
+            [DataOriginDataInfoKeyEnum.PARENT]: null,
+        };
+    });
+    return data;
+}
+/**
+ *
+ * @param classes
+ */
+export function generateClassSpellListSpellsLookup(classes) {
+    const lookup = {};
+    classes.forEach((charClass) => {
+        const spells = getSpells(charClass);
+        spells.forEach((spell) => {
+            const spellListId = SpellAccessors.getSpellListId(spell);
+            if (spellListId !== null) {
+                if (!lookup[spellListId]) {
+                    lookup[spellListId] = [];
+                }
+                lookup[spellListId].push({
+                    spell,
+                    charClass,
+                });
+            }
+        });
+    });
+    return lookup;
+}
+/**
+ *
+ * @param classes
+ */
+export function generateBaseClassLookup(classes) {
+    return keyBy(classes, (baseClass) => getMappingId(baseClass));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Class/index.js b/ddb_main/packages/rules-engine/es/engine/Class/index.js
new file mode 100644
index 0000000..a0a362b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Class/index.js
@@ -0,0 +1,9 @@
+import * as ClassAccessors from './accessors';
+import * as ClassDerivers from './derivers';
+import * as ClassGenerators from './generators';
+import * as ClassTypings from './typings';
+import * as ClassUtils from './utils';
+import * as ClassValidators from './validators';
+export * from './typings';
+export { ClassAccessors, ClassGenerators, ClassDerivers, ClassValidators, ClassUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, ClassAccessors), ClassGenerators), ClassTypings), ClassDerivers), ClassValidators), ClassUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Class/utils.js b/ddb_main/packages/rules-engine/es/engine/Class/utils.js
new file mode 100644
index 0000000..dacf2c6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Class/utils.js
@@ -0,0 +1,18 @@
+import { difference } from 'lodash';
+import { getLevel, getOptionalClassFeatures, getSpellListIds } from './accessors';
+import { deriveConsolidatedClassFeatures, deriveSpellListIds } from './derivers';
+/**
+ *
+ * @param classes
+ * @param newEnableOptionalClassFeatures
+ */
+export function getUpdateEnableOptionalClassFeaturesSpellListIdsToRemove(classes, newEnableOptionalClassFeatures) {
+    const spellListIdsToRemove = [];
+    classes.forEach((charClass) => {
+        const existingSpellListIds = getSpellListIds(charClass);
+        const newClassFeatures = deriveConsolidatedClassFeatures(charClass, getOptionalClassFeatures(charClass), newEnableOptionalClassFeatures);
+        const newSpellListIds = deriveSpellListIds(newClassFeatures, getLevel(charClass));
+        spellListIdsToRemove.push(...difference(existingSpellListIds, newSpellListIds));
+    });
+    return spellListIdsToRemove;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Class/validators.js b/ddb_main/packages/rules-engine/es/engine/Class/validators.js
new file mode 100644
index 0000000..2d51431
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Class/validators.js
@@ -0,0 +1,11 @@
+import { getId, getSubclass } from './accessors';
+/**
+ *
+ * @param charClass
+ * @param id
+ */
+export function isValidClassId(charClass, id) {
+    var _a, _b;
+    const subClassId = (_b = (_a = getSubclass(charClass)) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+    return id === getId(charClass) || id === subClassId;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/ClassFeature/accessors.js b/ddb_main/packages/rules-engine/es/engine/ClassFeature/accessors.js
new file mode 100644
index 0000000..5c53854
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/ClassFeature/accessors.js
@@ -0,0 +1,429 @@
+import { ActivationAccessors } from '../Activation';
+import { FeatureTypeEnum } from '../Core';
+/**
+ *
+ * @param feature
+ */
+export function getDefinition(feature) {
+    return feature.definition;
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionKey(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.definitionKey) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param feature
+ */
+export function getName(feature) {
+    return getDefinitionName(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionName(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param feature
+ */
+export function getId(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param feature
+ */
+export function getEntityTypeId(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.entityTypeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param feature
+ */
+export function getUniqueKey(feature) {
+    return `${getId(feature)}-${getEntityTypeId(feature)}`;
+}
+/**
+ *
+ * @param feature
+ */
+export function getDescription(feature) {
+    return getDefinitionDescription(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionDescription(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param feature
+ */
+export function getSourceId(feature) {
+    return getDefinitionSourceId(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionSourceId(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.sourceId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param feature
+ */
+export function getSourcePage(feature) {
+    return getDefinitionSourcePage(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionSourcePage(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.sourcePageNumber) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param feature
+ */
+export function getActivation(feature) {
+    return getDefinitionActivation(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionActivation(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.activation) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param feature
+ */
+export function getActivationTime(feature) {
+    return ActivationAccessors.getTime(getActivation(feature));
+}
+/**
+ *
+ * @param feature
+ */
+export function getActivationType(feature) {
+    return ActivationAccessors.getType(getActivation(feature));
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionLevelScales(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.levelScales) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param feature
+ */
+export function getLevelScales(feature) {
+    return getDefinitionLevelScales(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionLimitedUse(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.limitedUse) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param feature
+ */
+export function getLimitedUse(feature) {
+    return getDefinitionLimitedUse(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getMultiClassDescription(feature) {
+    return getDefinitionMultiClassDescription(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionMultiClassDescription(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.multiClassDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param feature
+ */
+export function getSnippet(feature) {
+    return getDefinitionSnippet(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionSnippet(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.snippet) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param feature
+ */
+export function getDisplayOrder(feature) {
+    return getDefinitionDisplayOrder(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionDisplayOrder(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.displayOrder) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param feature
+ */
+export function getHideInBuilder(feature) {
+    return getDefinitionHideInBuilder(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionHideInBuilder(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.hideInBuilder) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param feature
+ */
+export function getHideInSheet(feature) {
+    return getDefinitionHideInSheet(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionHideInSheet(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.hideInSheet) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ * @deprecated see getDefinitionIsSubClassFeature
+ * @param feature
+ */
+export function getIsSubClassFeature(feature) {
+    return getDefinitionIsSubClassFeature(feature);
+}
+/**
+ * @deprecated we are switching to the property "classId" instead for more useful information
+ * @param feature
+ */
+export function getDefinitionIsSubClassFeature(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.isSubClassFeature) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionClassId(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.classId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param feature
+ */
+export function getClassId(feature) {
+    return getDefinitionClassId(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getRequiredLevel(feature) {
+    return getDefinitionRequiredLevel(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionRequiredLevel(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.requiredLevel) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionCreatureRules(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.creatureRules) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param feature
+ */
+export function getCreatureRules(feature) {
+    return getDefinitionCreatureRules(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionSpellListIds(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.spellListIds) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param feature
+ */
+export function getSpellListIds(feature) {
+    return getDefinitionSpellListIds(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getAffectedFeatureDefinitionKeys(feature) {
+    return getDefinitionAffectedFeatureDefinitionKeys(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionAffectedFeatureDefinitionKeys(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.affectedFeatureDefinitionKeys) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param feature
+ */
+export function getSources(feature) {
+    return getDefinitionSources(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionSources(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.sources) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param feature
+ */
+export function getFeatureType(feature) {
+    return getDefinitionFeatureType(feature);
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionFeatureType(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.featureType) !== null && _b !== void 0 ? _b : FeatureTypeEnum.GRANTED;
+}
+/**
+ *
+ * @param feature
+ */
+export function getLevelScale(feature) {
+    return feature.levelScale;
+}
+/**
+ *
+ * @param feature
+ */
+export function getOptions(feature) {
+    return feature.options;
+}
+/**
+ *
+ * @param feature
+ */
+export function getActions(feature) {
+    return feature.actions;
+}
+/**
+ *
+ * @param feature
+ */
+export function getChoices(feature) {
+    return feature.choices;
+}
+/**
+ *
+ * @param feature
+ */
+export function getModifiers(feature) {
+    return feature.modifiers;
+}
+/**
+ *
+ * @param feature
+ */
+export function getSpells(feature) {
+    return feature.spells;
+}
+/**
+ *
+ * @param feature
+ */
+export function getFeats(feature) {
+    return feature.feats;
+}
+/**
+ *
+ * @param feature
+ */
+export function getInfusionChoices(feature) {
+    return feature.infusionChoices;
+}
+/**
+ *
+ * @param feature
+ */
+export function getInfusionRules(feature) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(feature)) === null || _a === void 0 ? void 0 : _a.infusionRules) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param feature
+ */
+export function getAccessType(feature) {
+    return feature.accessType;
+}
+export function getFeatListContracts(featureContract) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(featureContract)) === null || _a === void 0 ? void 0 : _a.grantedFeats) !== null && _b !== void 0 ? _b : [];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/ClassFeature/generators.js b/ddb_main/packages/rules-engine/es/engine/ClassFeature/generators.js
new file mode 100644
index 0000000..fa8ff2d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/ClassFeature/generators.js
@@ -0,0 +1,93 @@
+import { ActionGenerators } from '../Action';
+import { ChoiceGenerators } from '../Choice';
+import { ClassAccessors } from '../Class';
+import { CreatureRuleGenerators } from '../CreatureRule';
+import { DataOriginDataInfoKeyEnum, DataOriginGenerators, DataOriginTypeEnum, } from '../DataOrigin';
+import { DefinitionPoolUtils } from '../DefinitionPool';
+import { FeatGenerators } from '../Feat';
+import { FeatList } from '../FeatList';
+import { InfusionChoiceGenerators } from '../InfusionChoice';
+import { ModifierGenerators } from '../Modifier';
+import { OptionAccessors, OptionGenerators } from '../Option';
+import { SpellGenerators } from '../Spell';
+import { getCreatureRules, getDefinitionKey, getEntityTypeId, getFeatListContracts, getId, getInfusionRules, getOptions, getUniqueKey, } from './accessors';
+export function generateClassFeature(charClass, classFeature, ruleData, classesLookupData, definitionPool, characterId, choiceComponents, baseFeats) {
+    const id = getId(classFeature);
+    const entityTypeId = getEntityTypeId(classFeature);
+    const { actionLookup, choiceLookup, modifierLookup, spellLookup, valueLookup, featLookup, optionLookup, infusionChoiceInfusionLookup, knownInfusionLookupByChoiceKey, spellListDataOriginLookup, } = classesLookupData;
+    const actions = ActionGenerators.generateBaseActions(id, entityTypeId, actionLookup, valueLookup, DataOriginTypeEnum.CLASS_FEATURE, classFeature, charClass);
+    const choices = ChoiceGenerators.generateBaseChoices(id, entityTypeId, choiceLookup, DataOriginTypeEnum.CLASS_FEATURE, classFeature, charClass);
+    const modifiers = ModifierGenerators.generateModifiers(id, entityTypeId, modifierLookup, DataOriginTypeEnum.CLASS_FEATURE, classFeature, charClass);
+    const spells = SpellGenerators.generateBaseSpells(id, entityTypeId, spellLookup, DataOriginTypeEnum.CLASS_FEATURE, classFeature, charClass, ruleData, spellListDataOriginLookup, valueLookup);
+    const feats = FeatGenerators.generateDataOriginFeats(id, entityTypeId, featLookup, DataOriginTypeEnum.CLASS_FEATURE, classFeature, charClass);
+    const options = generateClassFeatureOptions(classFeature, charClass, featLookup, actionLookup, spellLookup, optionLookup, modifierLookup, valueLookup, spellListDataOriginLookup, ruleData);
+    const infusionChoices = InfusionChoiceGenerators.generateInfusionChoices(getInfusionRules(classFeature), DataOriginTypeEnum.CLASS_FEATURE, classFeature, charClass, infusionChoiceInfusionLookup, knownInfusionLookupByChoiceKey, characterId);
+    const featLists = getFeatListContracts(classFeature).map((contract) => new FeatList(contract, choiceComponents.definitionKeyNameMap, baseFeats));
+    return Object.assign(Object.assign({}, classFeature), { actions,
+        choices,
+        feats,
+        modifiers,
+        spells,
+        options,
+        infusionChoices, accessType: DefinitionPoolUtils.getDefinitionAccessType(getDefinitionKey(classFeature), definitionPool), featLists });
+}
+/**
+ *
+ * @param classFeature
+ * @param charClass
+ * @param featLookup
+ * @param actionLookup
+ * @param spellLookup
+ * @param optionLookup
+ * @param modifierLookup
+ * @param valueLookup
+ * @param spellListDataOriginLookup
+ * @param ruleData
+ */
+export function generateClassFeatureOptions(classFeature, charClass, featLookup, actionLookup, spellLookup, optionLookup, modifierLookup, valueLookup, spellListDataOriginLookup, ruleData) {
+    const baseOptions = OptionGenerators.generateDataOriginBaseOptions(getId(classFeature), getEntityTypeId(classFeature), optionLookup, DataOriginTypeEnum.CLASS_FEATURE, classFeature, charClass);
+    return OptionGenerators.generateOptions(baseOptions, DataOriginTypeEnum.CLASS_FEATURE, featLookup, actionLookup, spellLookup, optionLookup, modifierLookup, valueLookup, spellListDataOriginLookup, ruleData, classFeature, charClass);
+}
+/**
+ *
+ * @param classes
+ * @param xpInfo
+ * @param ruleData
+ */
+export function generateClassCreatureRules(classes, xpInfo, ruleData) {
+    const rules = [];
+    classes.forEach((charClass) => {
+        const features = ClassAccessors.getActiveClassFeatures(charClass);
+        features.forEach((feature) => {
+            const dataOrigin = DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.CLASS_FEATURE, feature, charClass);
+            const featureRules = getCreatureRules(feature);
+            featureRules.forEach((rule) => {
+                rules.push(CreatureRuleGenerators.generateRule(rule, dataOrigin, xpInfo, ruleData));
+            });
+            const options = getOptions(feature);
+            options.forEach((option) => {
+                const optionRules = OptionAccessors.getCreatureRules(option);
+                optionRules.forEach((rule) => {
+                    rules.push(CreatureRuleGenerators.generateRule(rule, dataOrigin, xpInfo, ruleData));
+                });
+            });
+        });
+    });
+    return rules;
+}
+/**
+ *
+ * @param classes
+ */
+export function generateRefClassFeatureData(classes) {
+    let data = {};
+    classes.forEach((charClass) => {
+        ClassAccessors.getClassFeatures(charClass).forEach((classFeature) => {
+            data[getUniqueKey(classFeature)] = {
+                [DataOriginDataInfoKeyEnum.PRIMARY]: classFeature,
+                [DataOriginDataInfoKeyEnum.PARENT]: charClass,
+            };
+        });
+    });
+    return data;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/ClassFeature/index.js b/ddb_main/packages/rules-engine/es/engine/ClassFeature/index.js
new file mode 100644
index 0000000..656ad77
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/ClassFeature/index.js
@@ -0,0 +1,9 @@
+import * as ClassFeatureAccessors from './accessors';
+import * as ClassFeatureGenerators from './generators';
+import * as ClassFeatureSimulators from './simulators';
+import * as ClassFeatureTypings from './typings';
+import * as ClassFeatureUtils from './utils';
+import * as ClassFeatureValidators from './validators';
+export * from './typings';
+export { ClassFeatureAccessors, ClassFeatureGenerators, ClassFeatureSimulators, ClassFeatureUtils, ClassFeatureValidators, };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, ClassFeatureAccessors), ClassFeatureGenerators), ClassFeatureSimulators), ClassFeatureTypings), ClassFeatureUtils), ClassFeatureValidators);
diff --git a/ddb_main/packages/rules-engine/es/engine/ClassFeature/simulators.js b/ddb_main/packages/rules-engine/es/engine/ClassFeature/simulators.js
new file mode 100644
index 0000000..7d49020
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/ClassFeature/simulators.js
@@ -0,0 +1,42 @@
+import { ClassAccessors } from '../Class';
+import { DefinitionPoolUtils } from '../DefinitionPool';
+import { FeatList } from '../FeatList';
+import { getFeatListContracts } from './accessors';
+export function simulateClassFeature(definitionKey, definitionPool, 
+// Optional args. Sometimes this method is called just to get an object that kind of looks like
+// a class feature, but is only used for a few properties.
+classes, choiceComponents, baseFeats) {
+    var _a;
+    const definition = DefinitionPoolUtils.getClassFeatureDefinition(definitionKey, definitionPool);
+    if (definition === null) {
+        return null;
+    }
+    let levelScale = null;
+    if (definition === null || definition === void 0 ? void 0 : definition.levelScales) {
+        // Find class that correlates to feature
+        const classFeatureClass = classes === null || classes === void 0 ? void 0 : classes.find((classIterator) => ClassAccessors.getId(classIterator) === definition.classId);
+        if (classFeatureClass) {
+            // Find max level scale of appropriate level
+            (_a = definition.levelScales) === null || _a === void 0 ? void 0 : _a.forEach((definitionLevelScale) => {
+                if (definitionLevelScale.level <= classFeatureClass.level) {
+                    levelScale = definitionLevelScale;
+                }
+            });
+        }
+    }
+    const classFeatureMapping = simulateClassFeatureContract({
+        definition,
+        levelScale,
+    });
+    const featLists = choiceComponents && baseFeats
+        ? getFeatListContracts(classFeatureMapping).map((contract) => new FeatList(contract, choiceComponents.definitionKeyNameMap, baseFeats))
+        : [];
+    return Object.assign(Object.assign({}, classFeatureMapping), { actions: [], choices: [], feats: [], modifiers: [], options: [], spells: [], infusionChoices: [], accessType: DefinitionPoolUtils.getDefinitionAccessType(definitionKey, definitionPool), featLists });
+}
+/**
+ *
+ * @param classFeatureProps
+ */
+export function simulateClassFeatureContract(classFeatureProps) {
+    return Object.assign({ levelScale: null, definition: null }, classFeatureProps);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/ClassFeature/utils.js b/ddb_main/packages/rules-engine/es/engine/ClassFeature/utils.js
new file mode 100644
index 0000000..bd486a1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/ClassFeature/utils.js
@@ -0,0 +1,27 @@
+import { ClassAccessors } from '../Class';
+import { AppContextTypeEnum, DB_STRING_MARTIAL_ARTS, DB_STRING_PACT_MAGIC, DB_STRING_SPELLCASTING, DB_STRING_DEDICATED_WEAPON, } from '../Core';
+import { getHideInBuilder, getHideInSheet, getLevelScale, getName } from './accessors';
+export function doesEnableSpellcasting(feature) {
+    return getName(feature) === DB_STRING_SPELLCASTING;
+}
+export function doesEnablePactMagic(feature) {
+    return getName(feature) === DB_STRING_PACT_MAGIC;
+}
+export function doesEnableDedicatedWeapon(feature) {
+    return getName(feature) === DB_STRING_DEDICATED_WEAPON;
+}
+export function doesEnableMartialArts(feature) {
+    return getName(feature).indexOf(DB_STRING_MARTIAL_ARTS) === 0;
+}
+export function getContextData(feature, charClass) {
+    return {
+        levelScale: getLevelScale(feature),
+        classLevel: charClass ? ClassAccessors.getLevel(charClass) : null,
+    };
+}
+export function getHideInContext(feature, context) {
+    if (context === AppContextTypeEnum.SHEET) {
+        return getHideInSheet(feature);
+    }
+    return getHideInBuilder(feature);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/ClassFeature/validators.js b/ddb_main/packages/rules-engine/es/engine/ClassFeature/validators.js
new file mode 100644
index 0000000..b898dd0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/ClassFeature/validators.js
@@ -0,0 +1,10 @@
+import { ClassValidators } from '../Class';
+import { getClassId } from './accessors';
+/**
+ *
+ * @param charClass
+ * @param classFeature
+ */
+export function isValidClassClassFeature(charClass, classFeature) {
+    return ClassValidators.isValidClassId(charClass, getClassId(classFeature));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Condition/accessors.js b/ddb_main/packages/rules-engine/es/engine/Condition/accessors.js
new file mode 100644
index 0000000..a5b5a75
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Condition/accessors.js
@@ -0,0 +1,132 @@
+/**
+ *
+ * @param condition
+ */
+export function getUniqueKey(condition) {
+    return `${getId(condition)}-${getEntityTypeId(condition)}`;
+}
+/**
+ *
+ * @param condition
+ */
+export function getContractId(condition) {
+    return condition.id;
+}
+/**
+ *
+ * @param condition
+ */
+export function getContractLevel(condition) {
+    return condition.level;
+}
+/**
+ *
+ * @param condition
+ */
+export function getDescription(condition) {
+    return getDefinitionDescription(condition);
+}
+export function getDefinitionDescription(condition) {
+    var _a, _b;
+    return (_b = (_a = condition.definition) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param condition
+ */
+export function getEntityTypeId(condition) {
+    return getDefinitionEntityTypeId(condition);
+}
+/**
+ *
+ * @param condition
+ */
+export function getDefinitionEntityTypeId(condition) {
+    var _a, _b;
+    return (_b = (_a = condition.definition) === null || _a === void 0 ? void 0 : _a.entityTypeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param condition
+ */
+export function getId(condition) {
+    return getDefinitionId(condition);
+}
+/**
+ *
+ * @param condition
+ */
+export function getDefinitionId(condition) {
+    var _a, _b;
+    return (_b = (_a = condition.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param condition
+ */
+export function getDefinitionLevels(condition) {
+    var _a, _b;
+    return (_b = (_a = condition.definition) === null || _a === void 0 ? void 0 : _a.levels) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param condition
+ */
+export function getName(condition) {
+    return getDefinitionName(condition);
+}
+/**
+ *
+ * @param condition
+ */
+export function getDefinitionName(condition) {
+    var _a, _b;
+    return (_b = (_a = condition.definition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param condition
+ */
+export function getSlug(condition) {
+    return getDefinitionSlug(condition);
+}
+export function getDefinitionSlug(condition) {
+    var _a, _b;
+    return (_b = (_a = condition.definition) === null || _a === void 0 ? void 0 : _a.slug) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param condition
+ */
+export function getType(condition) {
+    return getDefinitionType(condition);
+}
+/**
+ *
+ * @param condition
+ */
+export function getDefinitionType(condition) {
+    var _a, _b;
+    return (_b = (_a = condition.definition) === null || _a === void 0 ? void 0 : _a.type) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param condition
+ */
+export function getLevels(condition) {
+    return condition.levels;
+}
+/**
+ *
+ * @param condition
+ */
+export function getModifiers(condition) {
+    return condition.modifiers;
+}
+/**
+ *
+ * @param condition
+ */
+export function getActiveLevel(condition) {
+    return condition.level;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Condition/constants.js b/ddb_main/packages/rules-engine/es/engine/Condition/constants.js
new file mode 100644
index 0000000..4d0ffb2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Condition/constants.js
@@ -0,0 +1,23 @@
+export var ConditionTypeEnum;
+(function (ConditionTypeEnum) {
+    ConditionTypeEnum[ConditionTypeEnum["STANDARD"] = 1] = "STANDARD";
+    ConditionTypeEnum[ConditionTypeEnum["SPECIAL"] = 2] = "SPECIAL";
+})(ConditionTypeEnum || (ConditionTypeEnum = {}));
+export var ConditionIdEnum;
+(function (ConditionIdEnum) {
+    ConditionIdEnum[ConditionIdEnum["BLINDED"] = 1] = "BLINDED";
+    ConditionIdEnum[ConditionIdEnum["CHARMED"] = 2] = "CHARMED";
+    ConditionIdEnum[ConditionIdEnum["DEAFENED"] = 3] = "DEAFENED";
+    ConditionIdEnum[ConditionIdEnum["EXHAUSTION"] = 4] = "EXHAUSTION";
+    ConditionIdEnum[ConditionIdEnum["FRIGHTENED"] = 5] = "FRIGHTENED";
+    ConditionIdEnum[ConditionIdEnum["GRAPPLED"] = 6] = "GRAPPLED";
+    ConditionIdEnum[ConditionIdEnum["INCAPACITATED"] = 7] = "INCAPACITATED";
+    ConditionIdEnum[ConditionIdEnum["INVISIBLE"] = 8] = "INVISIBLE";
+    ConditionIdEnum[ConditionIdEnum["PARALYZED"] = 9] = "PARALYZED";
+    ConditionIdEnum[ConditionIdEnum["PETRIFIED"] = 10] = "PETRIFIED";
+    ConditionIdEnum[ConditionIdEnum["POISONED"] = 11] = "POISONED";
+    ConditionIdEnum[ConditionIdEnum["PRONE"] = 12] = "PRONE";
+    ConditionIdEnum[ConditionIdEnum["RESTRAINED"] = 13] = "RESTRAINED";
+    ConditionIdEnum[ConditionIdEnum["STUNNED"] = 14] = "STUNNED";
+    ConditionIdEnum[ConditionIdEnum["UNCONSCIOUS"] = 15] = "UNCONSCIOUS";
+})(ConditionIdEnum || (ConditionIdEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Condition/generators.js b/ddb_main/packages/rules-engine/es/engine/Condition/generators.js
new file mode 100644
index 0000000..00d07d8
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Condition/generators.js
@@ -0,0 +1,74 @@
+import { TypeScriptUtils } from '../../utils';
+import { ConditionLevelGenerators } from '../ConditionLevel';
+import { DataOriginDataInfoKeyEnum, DataOriginTypeEnum } from '../DataOrigin';
+import { ModifierGenerators } from '../Modifier';
+import { RuleDataUtils } from '../RuleData';
+import { getContractId, getContractLevel, getDefinitionLevels, getEntityTypeId, getId, getModifiers, getUniqueKey, } from './accessors';
+/**
+ *
+ * @param conditions
+ * @param modifierLookup
+ * @param ruleData
+ */
+export function generateConditions(conditions, modifierLookup, ruleData) {
+    return conditions
+        .map((characterCondition) => generateCondition(characterCondition, modifierLookup, ruleData))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param condition
+ * @param modifierLookup
+ * @param ruleData
+ */
+export function generateCondition(condition, modifierLookup, ruleData) {
+    const baseCondition = RuleDataUtils.getConditionInfo(getContractId(condition), ruleData);
+    if (baseCondition === null) {
+        return null;
+    }
+    const modifiers = ModifierGenerators.generateModifiers(getId(baseCondition), getEntityTypeId(baseCondition), modifierLookup, DataOriginTypeEnum.CONDITION, baseCondition);
+    let allModifiers = [];
+    let levels = [];
+    if (baseCondition.definition) {
+        const levelModifiers = [];
+        const foundLevels = getDefinitionLevels(baseCondition).map((level) => {
+            let conditionLevel = null;
+            if (level) {
+                conditionLevel = ConditionLevelGenerators.generateConditionLevel(level, baseCondition, modifierLookup);
+                levelModifiers.push(...conditionLevel.modifiers);
+            }
+            return conditionLevel;
+        });
+        levels = foundLevels.filter(TypeScriptUtils.isNotNullOrUndefined);
+        allModifiers = [...modifiers, ...levelModifiers];
+    }
+    return Object.assign(Object.assign({}, baseCondition), { level: getContractLevel(condition), modifiers: allModifiers, levels });
+}
+/**
+ *
+ * @param conditions
+ */
+export function generateConditionModifiers(conditions) {
+    const modifiers = [];
+    if (conditions.length === 0) {
+        return modifiers;
+    }
+    conditions.forEach((condition) => {
+        modifiers.push(...getModifiers(condition));
+    });
+    return modifiers;
+}
+/**
+ *
+ * @param conditions
+ */
+export function generateRefConditionData(conditions) {
+    let data = {};
+    conditions.forEach((condition) => {
+        data[getUniqueKey(condition)] = {
+            [DataOriginDataInfoKeyEnum.PRIMARY]: condition,
+            [DataOriginDataInfoKeyEnum.PARENT]: null,
+        };
+    });
+    return data;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Condition/index.js b/ddb_main/packages/rules-engine/es/engine/Condition/index.js
new file mode 100644
index 0000000..cfa06cc
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Condition/index.js
@@ -0,0 +1,9 @@
+import * as ConditionAccessors from './accessors';
+import * as ConditionConstants from './constants';
+import * as ConditionGenerators from './generators';
+import * as ConditionTypings from './typings';
+import * as ConditionUtils from './utils';
+export * from './typings';
+export * from './constants';
+export { ConditionAccessors, ConditionGenerators, ConditionUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, ConditionAccessors), ConditionConstants), ConditionGenerators), ConditionTypings), ConditionUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Condition/utils.js b/ddb_main/packages/rules-engine/es/engine/Condition/utils.js
new file mode 100644
index 0000000..974c06f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Condition/utils.js
@@ -0,0 +1,20 @@
+import { ConditionLevelAccessors } from '../ConditionLevel';
+import { getDefinitionLevels } from './accessors';
+/**
+ *
+ * @param condition
+ */
+export function getLevelEffectLookup(condition) {
+    const levels = getDefinitionLevels(condition);
+    if (levels.length === 0) {
+        return null;
+    }
+    return levels.reduce((acc, levelData) => {
+        const level = ConditionLevelAccessors.getLevel(levelData);
+        const effect = ConditionLevelAccessors.getEffect(levelData);
+        if (!acc[level] && effect !== null) {
+            acc[level] = effect;
+        }
+        return acc;
+    }, {});
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/ConditionLevel/accessors.js b/ddb_main/packages/rules-engine/es/engine/ConditionLevel/accessors.js
new file mode 100644
index 0000000..e9ac4e6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/ConditionLevel/accessors.js
@@ -0,0 +1,74 @@
+/**
+ *
+ * @param conditionLevel
+ */
+export function getUniqueKey(conditionLevel) {
+    return `${getId(conditionLevel)}-${getEntityTypeId(conditionLevel)}`;
+}
+/**
+ *
+ * @param conditionLevel
+ */
+export function getEffect(conditionLevel) {
+    return getDefinitionEffect(conditionLevel);
+}
+/**
+ *
+ * @param conditionLevel
+ */
+export function getDefinitionEffect(conditionLevel) {
+    var _a, _b;
+    return (_b = (_a = conditionLevel.definition) === null || _a === void 0 ? void 0 : _a.effect) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param conditionLevel
+ */
+export function getEntityTypeId(conditionLevel) {
+    return getDefinitionEntityTypeId(conditionLevel);
+}
+/**
+ *
+ * @param conditionLevel
+ */
+export function getDefinitionEntityTypeId(conditionLevel) {
+    var _a, _b;
+    return (_b = (_a = conditionLevel.definition) === null || _a === void 0 ? void 0 : _a.entityTypeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param conditionLevel
+ */
+export function getId(conditionLevel) {
+    return getDefinitionId(conditionLevel);
+}
+/**
+ *
+ * @param conditionLevel
+ */
+export function getDefinitionId(conditionLevel) {
+    var _a, _b;
+    return (_b = (_a = conditionLevel.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param conditionLevel
+ */
+export function getLevel(conditionLevel) {
+    return getDefinitionLevel(conditionLevel);
+}
+/**
+ *
+ * @param conditionLevel
+ */
+export function getDefinitionLevel(conditionLevel) {
+    var _a, _b;
+    return (_b = (_a = conditionLevel.definition) === null || _a === void 0 ? void 0 : _a.level) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param conditionLevel
+ */
+export function getModifiers(conditionLevel) {
+    return conditionLevel.modifiers;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/ConditionLevel/generators.js b/ddb_main/packages/rules-engine/es/engine/ConditionLevel/generators.js
new file mode 100644
index 0000000..4bfb8a1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/ConditionLevel/generators.js
@@ -0,0 +1,13 @@
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { ModifierGenerators } from '../Modifier';
+import { getEntityTypeId, getId } from './accessors';
+/**
+ *
+ * @param conditionLevel
+ * @param condition
+ * @param modifierLookup
+ */
+export function generateConditionLevel(conditionLevel, condition, modifierLookup) {
+    const modifiers = ModifierGenerators.generateModifiers(getId(conditionLevel), getEntityTypeId(conditionLevel), modifierLookup, DataOriginTypeEnum.CONDITION, condition);
+    return Object.assign(Object.assign({}, conditionLevel), { modifiers });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/ConditionLevel/index.js b/ddb_main/packages/rules-engine/es/engine/ConditionLevel/index.js
new file mode 100644
index 0000000..11a0b75
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/ConditionLevel/index.js
@@ -0,0 +1,6 @@
+import * as ConditionLevelAccessors from './accessors';
+import * as ConditionLevelGenerators from './generators';
+import * as ConditionLevelTypings from './typings';
+export * from './typings';
+export { ConditionLevelAccessors, ConditionLevelGenerators };
+export default Object.assign(Object.assign(Object.assign({}, ConditionLevelAccessors), ConditionLevelGenerators), ConditionLevelTypings);
diff --git a/ddb_main/packages/rules-engine/es/engine/Container/accessors.js b/ddb_main/packages/rules-engine/es/engine/Container/accessors.js
new file mode 100644
index 0000000..d63895e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Container/accessors.js
@@ -0,0 +1,36 @@
+export function getName(container) {
+    return container.name;
+}
+export function getMappingId(container) {
+    return container.mappingId;
+}
+export function getDefinitionKey(container) {
+    return container.definitionKey;
+}
+export function getItemMappingIds(container) {
+    return container.itemMappingIds;
+}
+export function getInfusedItemMappingIds(container) {
+    return container.infusedItemMappingIds;
+}
+export function hasInfusions(container) {
+    return container.hasInfusions;
+}
+export function getContainerType(container) {
+    return container.containerType;
+}
+export function isShared(container) {
+    return container.isShared;
+}
+export function getWeightInfo(container) {
+    return container.weightInfo;
+}
+export function isEquipped(container) {
+    return container.isEquipped;
+}
+export function getCoin(container) {
+    return container.coin;
+}
+export function getItem(container) {
+    return container.item;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Container/constants.js b/ddb_main/packages/rules-engine/es/engine/Container/constants.js
new file mode 100644
index 0000000..d63abf8
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Container/constants.js
@@ -0,0 +1,7 @@
+export var ContainerTypeEnum;
+(function (ContainerTypeEnum) {
+    ContainerTypeEnum[ContainerTypeEnum["CHARACTER"] = 1581111423] = "CHARACTER";
+    ContainerTypeEnum[ContainerTypeEnum["ITEM"] = 1439493548] = "ITEM";
+    ContainerTypeEnum[ContainerTypeEnum["CAMPAIGN"] = 618115330] = "CAMPAIGN";
+    ContainerTypeEnum[ContainerTypeEnum["SHOPPE"] = -1] = "SHOPPE";
+})(ContainerTypeEnum || (ContainerTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Container/generators.js b/ddb_main/packages/rules-engine/es/engine/Container/generators.js
new file mode 100644
index 0000000..bd5f6cb
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Container/generators.js
@@ -0,0 +1,171 @@
+import { keyBy, sortBy } from 'lodash';
+import { ConfigUtils } from '../../config';
+import { CampaignAccessors, CampaignUtils } from '../Campaign';
+import { generateCoinWeight } from '../Character/generators';
+import { DefinitionHacks } from '../Definition';
+import { FeatureFlagEnum, FeatureFlagInfoUtils } from '../FeatureFlagInfo';
+import { ItemAccessors, ItemDerivers, ItemValidators } from '../Item';
+import { getDefinitionKey, getName, isShared } from './accessors';
+import { ContainerTypeEnum } from './constants';
+function generateInitialCoins() {
+    return {
+        cp: 0,
+        sp: 0,
+        ep: 0,
+        gp: 0,
+        pp: 0,
+    };
+}
+/**
+ *
+ * @param items
+ * @param customItems
+ * @param characterId
+ * @param partyInfo
+ * @param partyInventory
+ * @param featureFlagInfo
+ * @param characterCoin
+ * @param preferences
+ * @param ruleData
+ */
+export function generateContainers(items, customItems, characterId, partyInfo, partyInventory, featureFlagInfo, characterCoin, preferences, ruleData) {
+    let sharingStateActive = false;
+    if (partyInfo && CampaignUtils.isSharingStateActive(CampaignAccessors.getSharingState(partyInfo))) {
+        sharingStateActive = true;
+    }
+    const partyInventoryActive = FeatureFlagInfoUtils.getFeatureFlagInfoValue(FeatureFlagEnum.RELEASE_GATE_IMS, featureFlagInfo) &&
+        sharingStateActive;
+    const rulesEngineConfig = ConfigUtils.getCurrentRulesEngineConfig();
+    // Do we want to display Cointainers? You betcha!
+    const canCointainer = (preferences === null || preferences === void 0 ? void 0 : preferences.enableContainerCurrency) && (rulesEngineConfig === null || rulesEngineConfig === void 0 ? void 0 : rulesEngineConfig.canUseCurrencyContainers);
+    //if includeCustomItems on the config is true - customItems are added on the Inventory as Items
+    //if includeCustomItems on the config is false/undefined (mobile until v5.1 support) - use the customItem contracts on the character JSON
+    const { includeCustomItems } = ConfigUtils.getCurrentRulesEngineConfig();
+    const includeCustomItemContractsInEquipment = !includeCustomItems;
+    const equipmentContainer = generateContainer(characterId, ContainerTypeEnum.CHARACTER, 'Equipment', 
+    //TODO v5.1: All customItems mappings belong to character container for mobile until they can support customItems in containers
+    includeCustomItemContractsInEquipment ? [...customItems, ...items] : items, false, null, characterCoin, characterId, preferences, ruleData);
+    const itemContainers = items
+        .filter(ItemAccessors.isContainer)
+        .map((containerItem) => {
+        var _a;
+        return generateContainer(ItemAccessors.getMappingId(containerItem), ContainerTypeEnum.ITEM, ItemAccessors.getName(containerItem), items, false, containerItem, canCointainer ? (_a = ItemAccessors.getCurrency(containerItem)) !== null && _a !== void 0 ? _a : generateInitialCoins() : null, characterId, preferences, ruleData);
+    });
+    const campaignId = partyInfo ? CampaignAccessors.getId(partyInfo) : null;
+    let partyEquipmentContainer = null;
+    let partyContainers = [];
+    if (partyInventoryActive && campaignId) {
+        partyEquipmentContainer = generateContainer(campaignId, ContainerTypeEnum.CAMPAIGN, 'Party Equipment', partyInventory, true, null, partyInfo ? CampaignAccessors.getCoin(partyInfo) : null, characterId, preferences, ruleData);
+        partyContainers = partyInventory
+            .filter(ItemAccessors.isContainer)
+            .map((containerItem) => {
+            var _a;
+            return generateContainer(ItemAccessors.getMappingId(containerItem), ContainerTypeEnum.ITEM, ItemAccessors.getName(containerItem), partyInventory, true, containerItem, canCointainer ? (_a = ItemAccessors.getCurrency(containerItem)) !== null && _a !== void 0 ? _a : generateInitialCoins() : null, characterId, preferences, ruleData);
+        });
+    }
+    const playerContainers = sortBy(itemContainers, (container) => getName(container));
+    return partyInventoryActive && partyEquipmentContainer
+        ? [equipmentContainer, ...playerContainers, partyEquipmentContainer, ...partyContainers]
+        : [equipmentContainer, ...playerContainers];
+}
+/**
+ *
+ * @param mappingId
+ * @param containerType
+ * @param name
+ * @param availableInventory
+ * @param isShared
+ * @param item
+ * @param coin
+ * @param characterId
+ * @param preferences
+ * @param ruleData
+ */
+export function generateContainer(mappingId, containerType, name, availableInventory, isShared, item, coin, characterId, preferences, ruleData) {
+    let definitionKey = DefinitionHacks.hack__generateDefinitionKey(containerType, mappingId);
+    const contents = availableInventory.filter((item) => ItemAccessors.getContainerDefinitionKey(item) === definitionKey && !ItemAccessors.isContainer(item));
+    const infusedItems = contents.filter(ItemAccessors.getInfusion);
+    return {
+        containerType,
+        coin,
+        definitionKey,
+        mappingId,
+        name,
+        hasInfusions: !!infusedItems.length,
+        item,
+        infusedItemMappingIds: infusedItems.map(ItemAccessors.getMappingId),
+        itemMappingIds: contents.map(ItemAccessors.getMappingId),
+        isEquipped: item ? ItemAccessors.isEquipped(item) : null,
+        isShared,
+        weightInfo: generateContainerWeightInfo(containerType, contents, item, characterId, coin, preferences, ruleData),
+    };
+}
+export function generateContainerWeightInfo(type, containerInventory, item, characterId, coin, preferences, ruleData) {
+    // Item total is the weight of all of the items in the container
+    const itemTotal = ItemDerivers.deriveItemsWeightTotal(containerInventory);
+    const coinTotal = generateCoinWeight(coin, preferences, ruleData);
+    const total = itemTotal + coinTotal;
+    // Default case is the character equipment container. All of its weight is applied.
+    let capacity = 0;
+    let itemApplied = itemTotal;
+    let coinApplied = coinTotal;
+    let applied = total;
+    if (type === ContainerTypeEnum.ITEM && item) {
+        // Case: It's a container, either in the character or party inventory.
+        // The weight of the container itself (5lbs for a backpack, for example)
+        // should be added in.
+        // Some containers, such as bags of holding, have a weight multiplier to nullify
+        // the weight of the contents.
+        // The weight multiplier also affects coins.
+        capacity = ItemAccessors.getCapacityWeight(item);
+        const itemWeight = ItemAccessors.getWeight(item);
+        const weightMultiplier = ItemAccessors.getWeightMultiplier(item);
+        itemApplied = itemWeight + itemTotal * weightMultiplier;
+        coinApplied = coinTotal * weightMultiplier;
+        applied = itemApplied + coinApplied;
+    }
+    else if (type === ContainerTypeEnum.CAMPAIGN) {
+        // Special case: This is the top level party inventory.
+        // Go through the items. Only items equipped to the current character
+        // are added to the applied weight.
+        itemApplied = containerInventory.reduce((acc, containerItem) => {
+            const itemEquippedToCharacter = ItemValidators.isEquippedToCurrentCharacter(containerItem, characterId);
+            if (itemEquippedToCharacter) {
+                return acc + ItemAccessors.getWeight(containerItem);
+            }
+            return acc;
+        }, 0);
+        coinApplied = 0; // never apply coin weight from the top level party inventory
+        applied = itemApplied;
+    }
+    return {
+        applied,
+        capacity,
+        total,
+        itemTotal,
+        coinTotal,
+        itemApplied,
+        coinApplied,
+    };
+}
+/**
+ *
+ * @param containers
+ */
+export function generateCharacterContainers(containers) {
+    return containers.filter((container) => !isShared(container));
+}
+/**
+ *
+ * @param containers
+ */
+export function generatePartyContainers(containers) {
+    return containers.filter(isShared);
+}
+/**
+ *
+ * @param containers
+ */
+export function generateContainerLookup(containers) {
+    return keyBy(containers, (container) => getDefinitionKey(container));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Container/index.js b/ddb_main/packages/rules-engine/es/engine/Container/index.js
new file mode 100644
index 0000000..8701ae0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Container/index.js
@@ -0,0 +1,10 @@
+import * as ContainerAccessors from './accessors';
+import * as ContainerConstants from './constants';
+import * as ContainerGenerators from './generators';
+import * as ContainerTypings from './typings';
+import * as ContainerUtils from './utils';
+import * as ContainerValidators from './validators';
+export * from './typings';
+export * from './constants';
+export { ContainerAccessors, ContainerGenerators, ContainerValidators, ContainerUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, ContainerAccessors), ContainerConstants), ContainerGenerators), ContainerTypings), ContainerValidators), ContainerUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Container/utils.js b/ddb_main/packages/rules-engine/es/engine/Container/utils.js
new file mode 100644
index 0000000..04b10ae
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Container/utils.js
@@ -0,0 +1,84 @@
+import { ContainerAccessors } from '.';
+import { PartyInventorySharingStateEnum } from '../Campaign';
+import { ItemAccessors } from '../Item';
+import { getDefinitionKey, getItemMappingIds, getName } from './accessors';
+import { ContainerTypeEnum } from './constants';
+/**
+ *
+ * @param containers
+ * @param excludedDefinitionKeys
+ * @returns {Array<Container>}
+ */
+export function getAvailableContainers(containers, excludedDefinitionKeys) {
+    return containers.filter((container) => !excludedDefinitionKeys.includes(getDefinitionKey(container)));
+}
+/**
+ * @param characterId
+ * @returns {string}
+ */
+export function getCharacterContainerDefinitionKey(characterId) {
+    return `${ContainerTypeEnum.CHARACTER}:${characterId}`;
+}
+/**
+ * @param campaignId
+ * @returns {string}
+ */
+export function getPartyContainerDefinitionKey(campaignId) {
+    return `${ContainerTypeEnum.CAMPAIGN}:${campaignId}`;
+}
+/**
+ *
+ * @param containers
+ * @param itemContainerDefinitionKey
+ * @returns {Container | null}
+ */
+export function getItemParentContainer(containers, itemContainerDefinitionKey) {
+    var _a;
+    return (_a = containers.find((container) => getDefinitionKey(container) === itemContainerDefinitionKey)) !== null && _a !== void 0 ? _a : null;
+}
+/**
+ *
+ * @param container
+ * @param inventory
+ * @returns {Array<Item>}
+ */
+export function getInventoryItems(container, inventory) {
+    return inventory.filter((item) => getItemMappingIds(container).includes(ItemAccessors.getMappingId(item)));
+}
+/**
+ *
+ * @param currentContainerDefinitionKey
+ * @param containers
+ * @returns {Array<MenuOption>}
+ */
+export function getGroupedOptions(currentContainerDefinitionKey, containers, label, sharingState) {
+    const excludedKeys = [];
+    if (currentContainerDefinitionKey) {
+        excludedKeys.push(currentContainerDefinitionKey);
+    }
+    const availableContainers = getAvailableContainers(containers, excludedKeys);
+    const characterContainers = availableContainers.filter((container) => !ContainerAccessors.isShared(container));
+    const partyContainers = availableContainers.filter(ContainerAccessors.isShared);
+    const options = [];
+    if (characterContainers.length) {
+        options.push({
+            label,
+            options: characterContainers.map((container) => ({
+                value: getDefinitionKey(container),
+                label: getName(container),
+            })),
+        });
+    }
+    // Only display Party inventory if there are containers and the sharing state is turned to on
+    // ( e.g. hide these containers as options when OFF and in DELETE_ONLY )
+    if (partyContainers.length && sharingState === PartyInventorySharingStateEnum.ON) {
+        options.push({
+            label: `${!characterContainers.length ? `${label} ` : ''}Party Inventory`,
+            options: partyContainers.map((container) => ({
+                value: getDefinitionKey(container),
+                label: getName(container),
+            })),
+        });
+    }
+    return options;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Container/validators.js b/ddb_main/packages/rules-engine/es/engine/Container/validators.js
new file mode 100644
index 0000000..124cfac
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Container/validators.js
@@ -0,0 +1,40 @@
+import { DefinitionHacks } from '../Definition';
+import { HelperUtils } from '../Helper';
+import { getDefinitionKey, getWeightInfo, isShared } from './accessors';
+import { ContainerTypeEnum } from './constants';
+/**
+ *
+ * @param container
+ * @returns
+ */
+export function isCharacterContainer(container) {
+    return DefinitionHacks.hack__getDefinitionKeyType(getDefinitionKey(container)) === ContainerTypeEnum.CHARACTER;
+}
+/**
+ *
+ * @param container
+ * @returns {boolean}
+ */
+export function isPartyContainer(container) {
+    return isPartyContainerDefinitionKey(getDefinitionKey(container));
+}
+/**
+ *
+ * @param containerDefinitionKey
+ * @returns {boolean}
+ */
+export function isPartyContainerDefinitionKey(containerDefinitionKey) {
+    return DefinitionHacks.hack__getDefinitionKeyType(containerDefinitionKey) === ContainerTypeEnum.CAMPAIGN;
+}
+export function validateIsShared(containerDefinitionKey, containerLookup) {
+    const container = HelperUtils.lookupDataOrFallback(containerLookup, containerDefinitionKey);
+    return container ? isShared(container) : false;
+}
+/**
+ *
+ * @param container
+ */
+export function isOverCapacity(container) {
+    const weightInfo = getWeightInfo(container);
+    return weightInfo.total > weightInfo.capacity;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Core/constants.js b/ddb_main/packages/rules-engine/es/engine/Core/constants.js
new file mode 100644
index 0000000..a19b7d0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Core/constants.js
@@ -0,0 +1,402 @@
+export const FEET_IN_MILES = 5280;
+export const POUNDS_IN_TON = 2000;
+export var AppContextTypeEnum;
+(function (AppContextTypeEnum) {
+    AppContextTypeEnum["BUILDER"] = "BUILDER";
+    AppContextTypeEnum["SHEET"] = "SHEET";
+})(AppContextTypeEnum || (AppContextTypeEnum = {}));
+export var AbilityScoreTypeEnum;
+(function (AbilityScoreTypeEnum) {
+    AbilityScoreTypeEnum[AbilityScoreTypeEnum["STANDARD_ARRAY"] = 1] = "STANDARD_ARRAY";
+    AbilityScoreTypeEnum[AbilityScoreTypeEnum["MANUAL"] = 2] = "MANUAL";
+    AbilityScoreTypeEnum[AbilityScoreTypeEnum["POINT_BUY"] = 3] = "POINT_BUY";
+})(AbilityScoreTypeEnum || (AbilityScoreTypeEnum = {}));
+export var AbilityStatEnum;
+(function (AbilityStatEnum) {
+    AbilityStatEnum[AbilityStatEnum["STRENGTH"] = 1] = "STRENGTH";
+    AbilityStatEnum[AbilityStatEnum["DEXTERITY"] = 2] = "DEXTERITY";
+    AbilityStatEnum[AbilityStatEnum["CONSTITUTION"] = 3] = "CONSTITUTION";
+    AbilityStatEnum[AbilityStatEnum["INTELLIGENCE"] = 4] = "INTELLIGENCE";
+    AbilityStatEnum[AbilityStatEnum["WISDOM"] = 5] = "WISDOM";
+    AbilityStatEnum[AbilityStatEnum["CHARISMA"] = 6] = "CHARISMA";
+})(AbilityStatEnum || (AbilityStatEnum = {}));
+export var AbilitySkillEnum;
+(function (AbilitySkillEnum) {
+    AbilitySkillEnum[AbilitySkillEnum["ATHLETICS"] = 2] = "ATHLETICS";
+    AbilitySkillEnum[AbilitySkillEnum["ACROBATICS"] = 3] = "ACROBATICS";
+    AbilitySkillEnum[AbilitySkillEnum["SLEIGHT_OF_HAND"] = 4] = "SLEIGHT_OF_HAND";
+    AbilitySkillEnum[AbilitySkillEnum["STEALTH"] = 5] = "STEALTH";
+    AbilitySkillEnum[AbilitySkillEnum["ARCANA"] = 6] = "ARCANA";
+    AbilitySkillEnum[AbilitySkillEnum["HISTORY"] = 7] = "HISTORY";
+    AbilitySkillEnum[AbilitySkillEnum["INVESTIGATION"] = 8] = "INVESTIGATION";
+    AbilitySkillEnum[AbilitySkillEnum["NATURE"] = 9] = "NATURE";
+    AbilitySkillEnum[AbilitySkillEnum["RELIGION"] = 10] = "RELIGION";
+    AbilitySkillEnum[AbilitySkillEnum["ANIMAL_HANDLING"] = 11] = "ANIMAL_HANDLING";
+    AbilitySkillEnum[AbilitySkillEnum["INSIGHT"] = 12] = "INSIGHT";
+    AbilitySkillEnum[AbilitySkillEnum["MEDICINE"] = 13] = "MEDICINE";
+    AbilitySkillEnum[AbilitySkillEnum["PERCEPTION"] = 14] = "PERCEPTION";
+    AbilitySkillEnum[AbilitySkillEnum["SURVIVAL"] = 15] = "SURVIVAL";
+    AbilitySkillEnum[AbilitySkillEnum["DECEPTION"] = 16] = "DECEPTION";
+    AbilitySkillEnum[AbilitySkillEnum["INTIMIDATION"] = 17] = "INTIMIDATION";
+    AbilitySkillEnum[AbilitySkillEnum["PERFORMANCE"] = 18] = "PERFORMANCE";
+    AbilitySkillEnum[AbilitySkillEnum["PERSUASION"] = 19] = "PERSUASION";
+})(AbilitySkillEnum || (AbilitySkillEnum = {}));
+export var AttackTypeRangeEnum;
+(function (AttackTypeRangeEnum) {
+    AttackTypeRangeEnum[AttackTypeRangeEnum["MELEE"] = 1] = "MELEE";
+    AttackTypeRangeEnum[AttackTypeRangeEnum["RANGED"] = 2] = "RANGED";
+})(AttackTypeRangeEnum || (AttackTypeRangeEnum = {}));
+export var AdjustmentDataTypeEnum;
+(function (AdjustmentDataTypeEnum) {
+    AdjustmentDataTypeEnum[AdjustmentDataTypeEnum["INTEGER"] = 1] = "INTEGER";
+    AdjustmentDataTypeEnum[AdjustmentDataTypeEnum["DECIMAL"] = 2] = "DECIMAL";
+    AdjustmentDataTypeEnum[AdjustmentDataTypeEnum["STRING"] = 3] = "STRING";
+    AdjustmentDataTypeEnum[AdjustmentDataTypeEnum["BOOLEAN"] = 4] = "BOOLEAN";
+})(AdjustmentDataTypeEnum || (AdjustmentDataTypeEnum = {}));
+export var AdjustmentConstraintTypeEnum;
+(function (AdjustmentConstraintTypeEnum) {
+    AdjustmentConstraintTypeEnum[AdjustmentConstraintTypeEnum["MINIMUM"] = 1] = "MINIMUM";
+    AdjustmentConstraintTypeEnum[AdjustmentConstraintTypeEnum["MAXIMUM"] = 2] = "MAXIMUM";
+})(AdjustmentConstraintTypeEnum || (AdjustmentConstraintTypeEnum = {}));
+export var DamageAdjustmentTypeEnum;
+(function (DamageAdjustmentTypeEnum) {
+    DamageAdjustmentTypeEnum[DamageAdjustmentTypeEnum["RESISTANCE"] = 1] = "RESISTANCE";
+    DamageAdjustmentTypeEnum[DamageAdjustmentTypeEnum["IMMUNITY"] = 2] = "IMMUNITY";
+    DamageAdjustmentTypeEnum[DamageAdjustmentTypeEnum["VULNERABILITY"] = 3] = "VULNERABILITY";
+})(DamageAdjustmentTypeEnum || (DamageAdjustmentTypeEnum = {}));
+export var DefenseAdjustmentTypeEnum;
+(function (DefenseAdjustmentTypeEnum) {
+    DefenseAdjustmentTypeEnum[DefenseAdjustmentTypeEnum["CONDITION_ADJUSTMENT"] = 1] = "CONDITION_ADJUSTMENT";
+    DefenseAdjustmentTypeEnum[DefenseAdjustmentTypeEnum["DAMAGE_ADJUSTMENT"] = 2] = "DAMAGE_ADJUSTMENT";
+})(DefenseAdjustmentTypeEnum || (DefenseAdjustmentTypeEnum = {}));
+export var WeaponCategoryEnum;
+(function (WeaponCategoryEnum) {
+    WeaponCategoryEnum[WeaponCategoryEnum["SIMPLE"] = 1] = "SIMPLE";
+    WeaponCategoryEnum[WeaponCategoryEnum["MARTIAL"] = 2] = "MARTIAL";
+    WeaponCategoryEnum[WeaponCategoryEnum["FIREARMS"] = 3] = "FIREARMS";
+})(WeaponCategoryEnum || (WeaponCategoryEnum = {}));
+export var WeightTypeEnum;
+(function (WeightTypeEnum) {
+    WeightTypeEnum[WeightTypeEnum["HALF"] = 1] = "HALF";
+    WeightTypeEnum[WeightTypeEnum["NORMAL"] = 2] = "NORMAL";
+    WeightTypeEnum[WeightTypeEnum["DOUBLE"] = 3] = "DOUBLE";
+})(WeightTypeEnum || (WeightTypeEnum = {}));
+export var ProficiencyLevelEnum;
+(function (ProficiencyLevelEnum) {
+    ProficiencyLevelEnum[ProficiencyLevelEnum["NONE"] = 1] = "NONE";
+    ProficiencyLevelEnum[ProficiencyLevelEnum["HALF"] = 2] = "HALF";
+    ProficiencyLevelEnum[ProficiencyLevelEnum["FULL"] = 3] = "FULL";
+    ProficiencyLevelEnum[ProficiencyLevelEnum["EXPERT"] = 4] = "EXPERT";
+})(ProficiencyLevelEnum || (ProficiencyLevelEnum = {}));
+export var StealthCheckTypeEnum;
+(function (StealthCheckTypeEnum) {
+    StealthCheckTypeEnum[StealthCheckTypeEnum["NONE"] = 1] = "NONE";
+    StealthCheckTypeEnum[StealthCheckTypeEnum["DISADVANTAGE"] = 2] = "DISADVANTAGE";
+})(StealthCheckTypeEnum || (StealthCheckTypeEnum = {}));
+export var FeatureTypeEnum;
+(function (FeatureTypeEnum) {
+    FeatureTypeEnum[FeatureTypeEnum["GRANTED"] = 1] = "GRANTED";
+    FeatureTypeEnum[FeatureTypeEnum["ADDITIONAL"] = 2] = "ADDITIONAL";
+    FeatureTypeEnum[FeatureTypeEnum["REPLACEMENT"] = 3] = "REPLACEMENT";
+})(FeatureTypeEnum || (FeatureTypeEnum = {}));
+export const DB_STRING_WILDSHAPE_2024 = 'Wild Shape (2024)';
+export const DB_STRING_MEDIUM_ARMOR_MASTER = 'Medium Armor Master';
+export const DB_STRING_SPELLCASTING = 'Spellcasting';
+export const DB_STRING_PACT_MAGIC = 'Pact Magic';
+export const DB_STRING_ELDRITCH_ADEPT = 'Eldritch Adept';
+export const DB_STRING_MARTIAL_ARTS = 'Martial Arts';
+export const DB_STRING_DEDICATED_WEAPON = 'Dedicated Weapon';
+export const DB_STRING_INTEGRATED_PROTECTION = 'Integrated Protection';
+export const DB_STRING_IMPROVED_PACT_WEAPON = 'Improved Pact Weapon';
+export const DB_STRING_CARAPACE = 'Carapace';
+export const DB_STRING_VERDAN = 'Verdan';
+export const DB_STRING_BOOK_OF_ANCIENT_SECRETS = 'Book of Ancient Secrets';
+export const DB_STRING_INFUSE_ITEM = 'Infuse Item';
+export const DB_STRING_RITUAL_CASTER_BARD = 'Ritual Caster (Bard)';
+export const DB_STRING_RITUAL_CASTER_CLERIC = 'Ritual Caster (Cleric)';
+export const DB_STRING_RITUAL_CASTER_DRUID = 'Ritual Caster (Druid)';
+export const DB_STRING_RITUAL_CASTER_SORCERER = 'Ritual Caster (Sorcerer)';
+export const DB_STRING_RITUAL_CASTER_WARLOCK = 'Ritual Caster (Warlock)';
+export const DB_STRING_RITUAL_CASTER_WIZARD = 'Ritual Caster (Wizard)';
+export const DB_STRING_RITUAL_CASTER_LIST = [
+    DB_STRING_RITUAL_CASTER_BARD,
+    DB_STRING_RITUAL_CASTER_CLERIC,
+    DB_STRING_RITUAL_CASTER_DRUID,
+    DB_STRING_RITUAL_CASTER_SORCERER,
+    DB_STRING_RITUAL_CASTER_WARLOCK,
+    DB_STRING_RITUAL_CASTER_WIZARD,
+];
+export var PreferenceAbilityScoreDisplayTypeEnum;
+(function (PreferenceAbilityScoreDisplayTypeEnum) {
+    PreferenceAbilityScoreDisplayTypeEnum[PreferenceAbilityScoreDisplayTypeEnum["SCORES_TOP"] = 1] = "SCORES_TOP";
+    PreferenceAbilityScoreDisplayTypeEnum[PreferenceAbilityScoreDisplayTypeEnum["MODIFIERS_TOP"] = 2] = "MODIFIERS_TOP";
+})(PreferenceAbilityScoreDisplayTypeEnum || (PreferenceAbilityScoreDisplayTypeEnum = {}));
+export var PreferencePrivacyTypeEnum;
+(function (PreferencePrivacyTypeEnum) {
+    PreferencePrivacyTypeEnum[PreferencePrivacyTypeEnum["PRIVATE"] = 1] = "PRIVATE";
+    PreferencePrivacyTypeEnum[PreferencePrivacyTypeEnum["CAMPAIGN_ONLY"] = 2] = "CAMPAIGN_ONLY";
+    PreferencePrivacyTypeEnum[PreferencePrivacyTypeEnum["PUBLIC"] = 3] = "PUBLIC";
+})(PreferencePrivacyTypeEnum || (PreferencePrivacyTypeEnum = {}));
+export var PreferenceSharingTypeEnum;
+(function (PreferenceSharingTypeEnum) {
+    PreferenceSharingTypeEnum[PreferenceSharingTypeEnum["FULL"] = 1] = "FULL";
+    PreferenceSharingTypeEnum[PreferenceSharingTypeEnum["LIMITED"] = 2] = "LIMITED";
+    PreferenceSharingTypeEnum[PreferenceSharingTypeEnum["STAT_BLOCK"] = 3] = "STAT_BLOCK";
+})(PreferenceSharingTypeEnum || (PreferenceSharingTypeEnum = {}));
+export var PreferenceEncumbranceTypeEnum;
+(function (PreferenceEncumbranceTypeEnum) {
+    PreferenceEncumbranceTypeEnum[PreferenceEncumbranceTypeEnum["ENCUMBRANCE"] = 1] = "ENCUMBRANCE";
+    PreferenceEncumbranceTypeEnum[PreferenceEncumbranceTypeEnum["NONE"] = 2] = "NONE";
+    PreferenceEncumbranceTypeEnum[PreferenceEncumbranceTypeEnum["VARIANT"] = 3] = "VARIANT";
+})(PreferenceEncumbranceTypeEnum || (PreferenceEncumbranceTypeEnum = {}));
+export var PreferenceHitPointTypeEnum;
+(function (PreferenceHitPointTypeEnum) {
+    PreferenceHitPointTypeEnum[PreferenceHitPointTypeEnum["FIXED"] = 1] = "FIXED";
+    PreferenceHitPointTypeEnum[PreferenceHitPointTypeEnum["MANUAL"] = 2] = "MANUAL";
+})(PreferenceHitPointTypeEnum || (PreferenceHitPointTypeEnum = {}));
+export var PreferenceProgressionTypeEnum;
+(function (PreferenceProgressionTypeEnum) {
+    PreferenceProgressionTypeEnum[PreferenceProgressionTypeEnum["MILESTONE"] = 1] = "MILESTONE";
+    PreferenceProgressionTypeEnum[PreferenceProgressionTypeEnum["XP"] = 2] = "XP";
+})(PreferenceProgressionTypeEnum || (PreferenceProgressionTypeEnum = {}));
+export var SpeedMovementKeyEnum;
+(function (SpeedMovementKeyEnum) {
+    SpeedMovementKeyEnum["WALK"] = "walk";
+    SpeedMovementKeyEnum["FLY"] = "fly";
+    SpeedMovementKeyEnum["BURROW"] = "burrow";
+    SpeedMovementKeyEnum["SWIM"] = "swim";
+    SpeedMovementKeyEnum["CLIMB"] = "climb";
+})(SpeedMovementKeyEnum || (SpeedMovementKeyEnum = {}));
+export var MovementTypeEnum;
+(function (MovementTypeEnum) {
+    MovementTypeEnum[MovementTypeEnum["WALK"] = 1] = "WALK";
+    MovementTypeEnum[MovementTypeEnum["BURROW"] = 2] = "BURROW";
+    MovementTypeEnum[MovementTypeEnum["CLIMB"] = 3] = "CLIMB";
+    MovementTypeEnum[MovementTypeEnum["FLY"] = 4] = "FLY";
+    MovementTypeEnum[MovementTypeEnum["SWIM"] = 5] = "SWIM";
+})(MovementTypeEnum || (MovementTypeEnum = {}));
+export var SenseTypeEnum;
+(function (SenseTypeEnum) {
+    SenseTypeEnum[SenseTypeEnum["BLINDSIGHT"] = 1] = "BLINDSIGHT";
+    SenseTypeEnum[SenseTypeEnum["DARKVISION"] = 2] = "DARKVISION";
+    SenseTypeEnum[SenseTypeEnum["TREMORSENSE"] = 3] = "TREMORSENSE";
+    SenseTypeEnum[SenseTypeEnum["TRUESIGHT"] = 4] = "TRUESIGHT";
+    SenseTypeEnum[SenseTypeEnum["PASSIVE_PERCEPTION"] = 5] = "PASSIVE_PERCEPTION";
+})(SenseTypeEnum || (SenseTypeEnum = {}));
+export var NoteKeyEnum;
+(function (NoteKeyEnum) {
+    NoteKeyEnum["ALLIES"] = "allies";
+    NoteKeyEnum["ENEMIES"] = "enemies";
+    NoteKeyEnum["BACKSTORY"] = "backstory";
+    NoteKeyEnum["ORGANIZATIONS"] = "organizations";
+    NoteKeyEnum["OTHER"] = "otherNotes";
+    NoteKeyEnum["OTHER_HOLDINGS"] = "otherHoldings";
+    NoteKeyEnum["PERSONAL_POSSESSIONS"] = "personalPossessions";
+})(NoteKeyEnum || (NoteKeyEnum = {}));
+export var TraitTypeEnum;
+(function (TraitTypeEnum) {
+    TraitTypeEnum["PERSONALITY_TRAITS"] = "personalityTraits";
+    TraitTypeEnum["IDEALS"] = "ideals";
+    TraitTypeEnum["BONDS"] = "bonds";
+    TraitTypeEnum["FLAWS"] = "flaws";
+    TraitTypeEnum["APPEARANCE"] = "appearance";
+})(TraitTypeEnum || (TraitTypeEnum = {}));
+export var WeightSpeedTypeEnum;
+(function (WeightSpeedTypeEnum) {
+    WeightSpeedTypeEnum["NORMAL"] = "normal";
+    WeightSpeedTypeEnum["ENCUMBERED"] = "encumbered";
+    WeightSpeedTypeEnum["HEAVILY_ENCUMBERED"] = "heavilyEncumbered";
+    WeightSpeedTypeEnum["PUSH_DRAG_LIFT"] = "pushDragLift";
+    WeightSpeedTypeEnum["OVER_CARRYING_CAPACITY"] = "overCarryingCapacity";
+})(WeightSpeedTypeEnum || (WeightSpeedTypeEnum = {}));
+export var CustomProficiencyTypeEnum;
+(function (CustomProficiencyTypeEnum) {
+    CustomProficiencyTypeEnum[CustomProficiencyTypeEnum["SKILL"] = 1] = "SKILL";
+    CustomProficiencyTypeEnum[CustomProficiencyTypeEnum["TOOL"] = 2] = "TOOL";
+    CustomProficiencyTypeEnum[CustomProficiencyTypeEnum["LANGUAGE"] = 3] = "LANGUAGE";
+    CustomProficiencyTypeEnum[CustomProficiencyTypeEnum["ARMOR"] = 4] = "ARMOR";
+    CustomProficiencyTypeEnum[CustomProficiencyTypeEnum["WEAPON"] = 5] = "WEAPON";
+})(CustomProficiencyTypeEnum || (CustomProficiencyTypeEnum = {}));
+export var SaveTypeEnum;
+(function (SaveTypeEnum) {
+    SaveTypeEnum["ADVANTAGE"] = "Advantage";
+    SaveTypeEnum["DISADVANTAGE"] = "Disadvantage";
+    SaveTypeEnum["BONUS"] = "Bonus";
+})(SaveTypeEnum || (SaveTypeEnum = {}));
+export var CreatureSizeNameEnum;
+(function (CreatureSizeNameEnum) {
+    CreatureSizeNameEnum["TINY"] = "Tiny";
+    CreatureSizeNameEnum["SMALL"] = "Small";
+    CreatureSizeNameEnum["MEDIUM"] = "Medium";
+    CreatureSizeNameEnum["LARGE"] = "Large";
+    CreatureSizeNameEnum["HUGE"] = "Huge";
+    CreatureSizeNameEnum["GARGANTUAN"] = "Gargantuan";
+})(CreatureSizeNameEnum || (CreatureSizeNameEnum = {}));
+export var CreatureSizeEnum;
+(function (CreatureSizeEnum) {
+    CreatureSizeEnum[CreatureSizeEnum["TINY"] = 2] = "TINY";
+    CreatureSizeEnum[CreatureSizeEnum["SMALL"] = 3] = "SMALL";
+    CreatureSizeEnum[CreatureSizeEnum["MEDIUM"] = 4] = "MEDIUM";
+    CreatureSizeEnum[CreatureSizeEnum["LARGE"] = 5] = "LARGE";
+    CreatureSizeEnum[CreatureSizeEnum["HUGE"] = 6] = "HUGE";
+    CreatureSizeEnum[CreatureSizeEnum["GARGANTUAN"] = 7] = "GARGANTUAN";
+})(CreatureSizeEnum || (CreatureSizeEnum = {}));
+export var ActivatableTypeEnum;
+(function (ActivatableTypeEnum) {
+    ActivatableTypeEnum["ACTION"] = "ACTION";
+    ActivatableTypeEnum["RACE"] = "RACE";
+    ActivatableTypeEnum["OPTION"] = "OPTION";
+    ActivatableTypeEnum["CHARACTER_SPELL"] = "CHARACTER_SPELL";
+    ActivatableTypeEnum["CLASS_FEATURE"] = "CLASS_FEATURE";
+    ActivatableTypeEnum["CLASS_SPELL"] = "CLASS_SPELL";
+    ActivatableTypeEnum["FEAT"] = "FEAT";
+})(ActivatableTypeEnum || (ActivatableTypeEnum = {}));
+export var SituationalBonusSavingThrowTypeEnum;
+(function (SituationalBonusSavingThrowTypeEnum) {
+    SituationalBonusSavingThrowTypeEnum["MODIFIER"] = "MODIFIER";
+})(SituationalBonusSavingThrowTypeEnum || (SituationalBonusSavingThrowTypeEnum = {}));
+export var AbilityScoreStatTypeEnum;
+(function (AbilityScoreStatTypeEnum) {
+    AbilityScoreStatTypeEnum[AbilityScoreStatTypeEnum["BASE"] = 1] = "BASE";
+    AbilityScoreStatTypeEnum[AbilityScoreStatTypeEnum["BONUS"] = 2] = "BONUS";
+    AbilityScoreStatTypeEnum[AbilityScoreStatTypeEnum["OVERRIDE"] = 3] = "OVERRIDE";
+})(AbilityScoreStatTypeEnum || (AbilityScoreStatTypeEnum = {}));
+export var BuilderChoiceTypeEnum;
+(function (BuilderChoiceTypeEnum) {
+    BuilderChoiceTypeEnum[BuilderChoiceTypeEnum["ONE_MODIFIER_TYPE_CHOICE"] = 1] = "ONE_MODIFIER_TYPE_CHOICE";
+    BuilderChoiceTypeEnum[BuilderChoiceTypeEnum["MODIFIER_SUB_CHOICE"] = 2] = "MODIFIER_SUB_CHOICE";
+    BuilderChoiceTypeEnum[BuilderChoiceTypeEnum["FEATURE_OPTION"] = 3] = "FEATURE_OPTION";
+    BuilderChoiceTypeEnum[BuilderChoiceTypeEnum["ENTITY_SPELL_OPTION"] = 4] = "ENTITY_SPELL_OPTION";
+    BuilderChoiceTypeEnum[BuilderChoiceTypeEnum["DRAGONBORN_OPTION"] = 5] = "DRAGONBORN_OPTION";
+    BuilderChoiceTypeEnum[BuilderChoiceTypeEnum["FEAT_CHOICE_OPTION"] = 6] = "FEAT_CHOICE_OPTION";
+    BuilderChoiceTypeEnum[BuilderChoiceTypeEnum["SUB_CLASS_OPTION"] = 7] = "SUB_CLASS_OPTION";
+    BuilderChoiceTypeEnum[BuilderChoiceTypeEnum["RACIAL_TRAIT_OPTION"] = 8] = "RACIAL_TRAIT_OPTION";
+    BuilderChoiceTypeEnum[BuilderChoiceTypeEnum["FEAT_OPTION"] = 9] = "FEAT_OPTION";
+})(BuilderChoiceTypeEnum || (BuilderChoiceTypeEnum = {}));
+export var BuilderChoiceSubtypeEnum;
+(function (BuilderChoiceSubtypeEnum) {
+    BuilderChoiceSubtypeEnum[BuilderChoiceSubtypeEnum["PROFICIENCY"] = 1] = "PROFICIENCY";
+    BuilderChoiceSubtypeEnum[BuilderChoiceSubtypeEnum["EXPERTISE"] = 2] = "EXPERTISE";
+    BuilderChoiceSubtypeEnum[BuilderChoiceSubtypeEnum["LANGUAGE"] = 3] = "LANGUAGE";
+    BuilderChoiceSubtypeEnum[BuilderChoiceSubtypeEnum["KNOWN_SPELLS"] = 4] = "KNOWN_SPELLS";
+    BuilderChoiceSubtypeEnum[BuilderChoiceSubtypeEnum["ABILITY_SCORE"] = 5] = "ABILITY_SCORE";
+    BuilderChoiceSubtypeEnum[BuilderChoiceSubtypeEnum["EXPERTISE_NO_REQUIREMENT"] = 6] = "EXPERTISE_NO_REQUIREMENT";
+    BuilderChoiceSubtypeEnum[BuilderChoiceSubtypeEnum["KENSEI"] = 7] = "KENSEI";
+})(BuilderChoiceSubtypeEnum || (BuilderChoiceSubtypeEnum = {}));
+export var StartingEquipmentTypeEnum;
+(function (StartingEquipmentTypeEnum) {
+    StartingEquipmentTypeEnum[StartingEquipmentTypeEnum["MANUAL"] = 1] = "MANUAL";
+    StartingEquipmentTypeEnum[StartingEquipmentTypeEnum["MONEY"] = 2] = "MONEY";
+    StartingEquipmentTypeEnum[StartingEquipmentTypeEnum["GUIDED"] = 3] = "GUIDED";
+})(StartingEquipmentTypeEnum || (StartingEquipmentTypeEnum = {}));
+export var MulticlassSpellSlotRoundingEnum;
+(function (MulticlassSpellSlotRoundingEnum) {
+    MulticlassSpellSlotRoundingEnum[MulticlassSpellSlotRoundingEnum["DOWN"] = 1] = "DOWN";
+    MulticlassSpellSlotRoundingEnum[MulticlassSpellSlotRoundingEnum["UP"] = 2] = "UP";
+})(MulticlassSpellSlotRoundingEnum || (MulticlassSpellSlotRoundingEnum = {}));
+export var ProficiencyRoundingEnum;
+(function (ProficiencyRoundingEnum) {
+    ProficiencyRoundingEnum[ProficiencyRoundingEnum["DOWN"] = 1] = "DOWN";
+    ProficiencyRoundingEnum[ProficiencyRoundingEnum["UP"] = 2] = "UP";
+})(ProficiencyRoundingEnum || (ProficiencyRoundingEnum = {}));
+export var RuleKeyEnum;
+(function (RuleKeyEnum) {
+    RuleKeyEnum["ARMOR_CLASS"] = "Armor Class";
+    RuleKeyEnum["PROFICIENCY_BONUS"] = "Proficiency Bonus";
+    RuleKeyEnum["SAVING_THROWS"] = "Saving Throws";
+    RuleKeyEnum["INITIATIVE"] = "Initiative";
+    RuleKeyEnum["INSPIRATION"] = "Inspiration";
+    RuleKeyEnum["SPEED"] = "Speed";
+    RuleKeyEnum["SENSES"] = "Senses";
+    RuleKeyEnum["DEATH_SAVING_THROWS"] = "Death Saving Throws";
+})(RuleKeyEnum || (RuleKeyEnum = {}));
+export var ContentSharingSettingEnum;
+(function (ContentSharingSettingEnum) {
+    ContentSharingSettingEnum[ContentSharingSettingEnum["SCOPE_TO_ALL_CAMPAIGNS"] = 1] = "SCOPE_TO_ALL_CAMPAIGNS";
+    ContentSharingSettingEnum[ContentSharingSettingEnum["SCOPE_TO_INDIVIDUAL_CAMPAIGN"] = 2] = "SCOPE_TO_INDIVIDUAL_CAMPAIGN";
+})(ContentSharingSettingEnum || (ContentSharingSettingEnum = {}));
+export var CharacterColorEnum;
+(function (CharacterColorEnum) {
+    CharacterColorEnum["RED"] = "#C53131";
+    CharacterColorEnum["OFF_WHITE"] = "#FEFEFE";
+    CharacterColorEnum["DARKMODE_TRANSPARENT"] = "#10161ADB";
+    CharacterColorEnum["DARKMODE_BLACK"] = "#10161A";
+    CharacterColorEnum["DARKMODE_TEXT"] = "#b0b7bd";
+})(CharacterColorEnum || (CharacterColorEnum = {}));
+export var SourceTypeEnum;
+(function (SourceTypeEnum) {
+    SourceTypeEnum[SourceTypeEnum["PRIMARY"] = 1] = "PRIMARY";
+    SourceTypeEnum[SourceTypeEnum["SECONDARY"] = 2] = "SECONDARY";
+    SourceTypeEnum[SourceTypeEnum["HIDDEN"] = 3] = "HIDDEN";
+})(SourceTypeEnum || (SourceTypeEnum = {}));
+export var AdditionalTypeEnum;
+(function (AdditionalTypeEnum) {
+    AdditionalTypeEnum[AdditionalTypeEnum["ADDITIONAL_TARGETS"] = 1] = "ADDITIONAL_TARGETS";
+    AdditionalTypeEnum[AdditionalTypeEnum["EXTENDED_DURATION"] = 3] = "EXTENDED_DURATION";
+    AdditionalTypeEnum[AdditionalTypeEnum["EXTENDED_AREA"] = 9] = "EXTENDED_AREA";
+    AdditionalTypeEnum[AdditionalTypeEnum["ADDITIONAL_CREATURES"] = 11] = "ADDITIONAL_CREATURES";
+    AdditionalTypeEnum[AdditionalTypeEnum["SPECIAL"] = 12] = "SPECIAL";
+    AdditionalTypeEnum[AdditionalTypeEnum["ADDITIONAL_POINTS"] = 15] = "ADDITIONAL_POINTS";
+    AdditionalTypeEnum[AdditionalTypeEnum["ADDITIONAL_COUNT"] = 16] = "ADDITIONAL_COUNT";
+    AdditionalTypeEnum[AdditionalTypeEnum["EXTENDED_RANGE"] = 17] = "EXTENDED_RANGE";
+})(AdditionalTypeEnum || (AdditionalTypeEnum = {}));
+export var DisplayConfigurationTypeEnum;
+(function (DisplayConfigurationTypeEnum) {
+    DisplayConfigurationTypeEnum["RACIAL_TRAIT"] = "RACIALTRAIT";
+    DisplayConfigurationTypeEnum["ABILITY_SCORE"] = "ABILITYSCORE";
+    DisplayConfigurationTypeEnum["LANGUAGE"] = "LANGUAGE";
+    DisplayConfigurationTypeEnum["CLASS_FEATURE"] = "CLASSFEATURE";
+    DisplayConfigurationTypeEnum["ITEM"] = "ITEM";
+    DisplayConfigurationTypeEnum["FEAT"] = "FEAT";
+})(DisplayConfigurationTypeEnum || (DisplayConfigurationTypeEnum = {}));
+export var DisplayConfigurationValueEnum;
+(function (DisplayConfigurationValueEnum) {
+    DisplayConfigurationValueEnum[DisplayConfigurationValueEnum["OFF"] = 0] = "OFF";
+    DisplayConfigurationValueEnum[DisplayConfigurationValueEnum["ON"] = 1] = "ON";
+})(DisplayConfigurationValueEnum || (DisplayConfigurationValueEnum = {}));
+export var EntityTypeEnum;
+(function (EntityTypeEnum) {
+    EntityTypeEnum[EntityTypeEnum["CHARACTER"] = 1581111423] = "CHARACTER";
+    EntityTypeEnum[EntityTypeEnum["ITEM"] = 1439493548] = "ITEM";
+    EntityTypeEnum[EntityTypeEnum["CAMPAIGN"] = 618115330] = "CAMPAIGN";
+    EntityTypeEnum[EntityTypeEnum["FEAT_LIST"] = 67468084] = "FEAT_LIST";
+    EntityTypeEnum[EntityTypeEnum["CLASS_FEATURE_OPTION_KNOWN"] = 1362008556] = "CLASS_FEATURE_OPTION_KNOWN";
+    EntityTypeEnum[EntityTypeEnum["CLASS_FEATURE"] = 12168134] = "CLASS_FEATURE";
+})(EntityTypeEnum || (EntityTypeEnum = {}));
+export var CoinTypeEnum;
+(function (CoinTypeEnum) {
+    CoinTypeEnum["cp"] = "cp";
+    CoinTypeEnum["ep"] = "ep";
+    CoinTypeEnum["gp"] = "gp";
+    CoinTypeEnum["pp"] = "pp";
+    CoinTypeEnum["sp"] = "sp";
+})(CoinTypeEnum || (CoinTypeEnum = {}));
+export var CoinNamesEnum;
+(function (CoinNamesEnum) {
+    CoinNamesEnum["GOLD"] = "Gold";
+    CoinNamesEnum["COPPER"] = "Copper";
+    CoinNamesEnum["SILVER"] = "Silver";
+    CoinNamesEnum["ELECTRUM"] = "Electrum";
+    CoinNamesEnum["PLATINUM"] = "Platinum";
+})(CoinNamesEnum || (CoinNamesEnum = {}));
+//TODO move over more constants from App.ts in tools client and dedup usages
+export const SIGNED_32BIT_INT_MAX_VALUE = 1000000000;
+export const SIGNED_32BIT_INT_MIN_VALUE = -1000000000;
+export const CURRENCY_VALUE = {
+    MAX: SIGNED_32BIT_INT_MAX_VALUE,
+    MIN: 0,
+};
+export const INITIAL_ASI_TAG_NAME = '__INITIAL_ASI';
+export const DISPLAY_WITH_DATA_ORIGIN_TAG_NAME = '__DISPLAY_WITH_DATA_ORIGIN';
+export const DISGUISE_FEAT_TAG_NAME = '__DISGUISE_FEAT';
+export const DefaultCharacterName = 'Hero With No Name';
+export const ABILITY_STAT_MENTAL_LIST = [
+    AbilityStatEnum.INTELLIGENCE,
+    AbilityStatEnum.WISDOM,
+    AbilityStatEnum.CHARISMA,
+];
+export const ABILITY_STAT_PHYSICAL_LIST = [
+    AbilityStatEnum.STRENGTH,
+    AbilityStatEnum.DEXTERITY,
+    AbilityStatEnum.CONSTITUTION,
+];
diff --git a/ddb_main/packages/rules-engine/es/engine/Core/generators.js b/ddb_main/packages/rules-engine/es/engine/Core/generators.js
new file mode 100644
index 0000000..99989a6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Core/generators.js
@@ -0,0 +1,21 @@
+import { AbilityAccessors } from '../Ability';
+/**
+ *
+ * @param abilities
+ * @param armorClass
+ * @param hitPointInfo
+ * @param initiative
+ */
+export function generateSocialImageData(abilities, armorClass, hitPointInfo, initiative) {
+    const abilityScores = {};
+    abilities.forEach((ability) => {
+        const score = AbilityAccessors.getScore(ability);
+        abilityScores[AbilityAccessors.getId(ability)] = score === null ? 0 : score;
+    });
+    return {
+        abilityScores,
+        armorClass,
+        hitPoints: hitPointInfo.totalHp,
+        initiative,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Core/index.js b/ddb_main/packages/rules-engine/es/engine/Core/index.js
new file mode 100644
index 0000000..d56a66e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Core/index.js
@@ -0,0 +1,9 @@
+import * as CoreConstants from './constants';
+import * as CoreGenerators from './generators';
+import * as CoreSimulators from './simulators';
+import * as CoreTypings from './typings';
+import * as CoreUtils from './utils';
+export * from './typings';
+export * from './constants';
+export { CoreGenerators, CoreSimulators, CoreUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, CoreConstants), CoreGenerators), CoreSimulators), CoreTypings), CoreUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Core/simulators.js b/ddb_main/packages/rules-engine/es/engine/Core/simulators.js
new file mode 100644
index 0000000..b4e0019
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Core/simulators.js
@@ -0,0 +1,7 @@
+/**
+ *
+ * @param props
+ */
+export function simulateHigherLevelEntryContract(props) {
+    return Object.assign({ description: null, die: null, extendedAoe: null, level: null, targets: 0, totalCount: 0, range: null }, props);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Core/utils.js b/ddb_main/packages/rules-engine/es/engine/Core/utils.js
new file mode 100644
index 0000000..d666704
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Core/utils.js
@@ -0,0 +1,43 @@
+import { round } from 'lodash';
+import { RuleDataAccessors } from '../RuleData';
+import { CURRENCY_VALUE, FEET_IN_MILES } from './constants';
+export function convertFeetToMiles(number, precision = 2) {
+    return round(number / FEET_IN_MILES, precision);
+}
+/**
+ *
+ * @param key
+ * @param displayConfiguration
+ */
+export function getDisplayConfigurationValue(key, displayConfiguration) {
+    return displayConfiguration[key];
+}
+/**
+ *
+ * @param coin
+ * @param ruleData
+ */
+export function convertTotalCoinToGold(coin, ruleData) {
+    let totalGp = RuleDataAccessors.getCurrencyData(ruleData).reduce((acc, currency) => {
+        if (currency.name) {
+            let key = currency.name.toLowerCase();
+            if (coin.hasOwnProperty(key)) {
+                acc += coin[key] * currency.conversionFromGp;
+            }
+        }
+        return acc;
+    }, 0);
+    return Math.floor(totalGp);
+}
+/**
+ *
+ * @param multiplier
+ * @param adjustments
+ */
+export function getCurrencyTransactionAdjustment(multiplier, adjustments) {
+    let adjustedCurrency = {};
+    Object.keys(adjustments).forEach((coinKey) => {
+        adjustedCurrency[coinKey] = Math.min(adjustments[coinKey] * multiplier, CURRENCY_VALUE.MAX);
+    });
+    return adjustedCurrency;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Creature/accessors.js b/ddb_main/packages/rules-engine/es/engine/Creature/accessors.js
new file mode 100644
index 0000000..5e11692
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Creature/accessors.js
@@ -0,0 +1,849 @@
+import { StatBlockTypeEnum } from './constants';
+/**
+ *
+ * @param creature
+ */
+export function getUniqueKey(creature) {
+    return `${getMappingId(creature)}-${getMappingEntityTypeId(creature)}`;
+}
+/**
+ *
+ * @param creature
+ */
+export function getMappingId(creature) {
+    return creature.id;
+}
+/**
+ *
+ * @param creature
+ */
+export function getMappingEntityTypeId(creature) {
+    return creature.entityTypeId;
+}
+/**
+ *
+ * @param creature
+ */
+export function isActive(creature) {
+    return creature.isActive;
+}
+/**
+ *
+ * @param creature
+ */
+export function getRemoveHitPoints(creature) {
+    return creature.removedHitPoints;
+}
+/**
+ *
+ * @param creature
+ */
+export function getTemporaryHitPoints(creature) {
+    var _a;
+    return (_a = creature.temporaryHitPoints) !== null && _a !== void 0 ? _a : 0;
+}
+/**
+ *
+ * @param creature
+ */
+export function getGroupId(creature) {
+    return creature.groupId;
+}
+/**
+ *
+ * @param creature
+ */
+export function getId(creature) {
+    return getDefinitionId(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionId(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param creature
+ */
+export function getEntityTypeId(creature) {
+    return getDefinitionEntityTypeId(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionEntityTypeId(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.entityTypeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param creature
+ */
+export function getName(creature) {
+    var _a;
+    return (_a = creature.name) !== null && _a !== void 0 ? _a : getDefinitionName(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionAlignmentId(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.alignmentId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param creature
+ */
+export function getAlignmentId(creature) {
+    return creature.alignmentId;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionSizeId(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.sizeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param creature
+ */
+export function getSizeId(creature) {
+    return creature.sizeId;
+}
+/**
+ *
+ * @param creature
+ */
+export function getSizeInfo(creature) {
+    return creature.sizeInfo;
+}
+export function getDefinitionTypeId(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.typeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param creature
+ */
+export function getTypeId(creature) {
+    return creature.typeId;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionArmorClass(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.armorClass) !== null && _b !== void 0 ? _b : 0;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionName(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '';
+}
+export function getArmorClassDescription(creature) {
+    return getDefinitionArmorClassDescription(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionArmorClassDescription(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.armorClassDescription) !== null && _b !== void 0 ? _b : null;
+}
+export function getAverageHitPoints(creature) {
+    return getDefinitionAverageHitPoints(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionAverageHitPoints(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.averageHitPoints) !== null && _b !== void 0 ? _b : 0;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionStats(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.stats) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function getStats(creature) {
+    return creature.stats;
+}
+/**
+ *
+ * @param creature
+ */
+export function getChallengeInfo(creature) {
+    return creature.challengeInfo;
+}
+export function getLairChallengeInfo(creature) {
+    return creature.lairChallengeInfo;
+}
+/**
+ *
+ * @param creature
+ * @param fallback
+ */
+export function getChallengeProficiencyBonus(creature, fallback = 0) {
+    var _a;
+    const challengeInfo = getChallengeInfo(creature);
+    return (_a = challengeInfo === null || challengeInfo === void 0 ? void 0 : challengeInfo.proficiencyBonus) !== null && _a !== void 0 ? _a : fallback;
+}
+/**
+ *
+ * @param creature
+ */
+export function getHitPointDice(creature) {
+    return getDefinitionHitPointDice(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionHitPointDice(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.hitPointDice) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getMovements(creature) {
+    return getDefinitionMovements(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionMovements(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.movements) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function getMovementIds(creature) {
+    return creature.movementIds;
+}
+export function getMovementNames(creature) {
+    return creature.movementNames;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionDamageAdjustments(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.damageAdjustments) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function getDamageAdjustments(creature) {
+    return creature.damageAdjustments;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDamageVulnerabilities(creature) {
+    return creature.damageVulnerabilities;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDamageImmunities(creature) {
+    return creature.damageImmunities;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDamageResistances(creature) {
+    return creature.damageResistances;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionConditionImmunities(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.conditionImmunities) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function getConditionImmunities(creature) {
+    return creature.conditionImmunities;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionSubTypes(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.subTypes) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function getSubTypes(creature) {
+    return creature.subTypes;
+}
+/**
+ *
+ * @param creature
+ */
+export function getEnvironments(creature) {
+    return getDefinitionEnvironments(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionEnvironments(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.environments) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function getTags(creature) {
+    return getDefinitionTags(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionTags(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.tags) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function getSwarmInfo(creature) {
+    return getDefinitionSwarmInfo(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionSwarmInfo(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.swarm) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionSkills(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.skills) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function getSkills(creature) {
+    return creature.skills;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionSavingThrows(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.savingThrows) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function getSavingThrows(creature) {
+    return creature.savingThrows;
+}
+/**
+ *
+ * @param creature
+ */
+export function getSenses(creature) {
+    return getDefinitionSenses(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionSenses(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.senses) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionPassivePerception(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.passivePerception) !== null && _b !== void 0 ? _b : 0;
+}
+/**
+ *
+ * @param creature
+ */
+export function getPassivePerception(creature) {
+    return creature.passivePerception;
+}
+/**
+ *
+ * @param creature
+ */
+export function getLanguageDescription(creature) {
+    return getDefinitionLanguageDescription(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionLanguageDescription(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.languageDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getLanguageNote(creature) {
+    return getDefinitionLanguageNote(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionLanguageNote(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.languageNote) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getLanguages(creature) {
+    return getDefinitionLanguages(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionLanguages(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.languages) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function isHomebrew(creature) {
+    return getDefinitionIsHomebrew(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionIsHomebrew(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.isHomebrew) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param creature
+ */
+export function getVersion(creature) {
+    return getDefinitionVersion(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionVersion(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.version) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getChallengeRatingId(creature) {
+    return getDefinitionChallengeRatingId(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionChallengeRatingId(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.challengeRatingId) !== null && _b !== void 0 ? _b : -1;
+}
+export function getLairChallengeRatingId(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.lairChallengeRatingId) !== null && _b !== void 0 ? _b : -1;
+}
+export function getInitiative(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.initiative) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function isSwarm(creature) {
+    return getSwarmInfo(creature) !== null;
+}
+/**
+ *
+ * @param creature
+ */
+export function isLegendary(creature) {
+    return getDefinitionIsLegendary(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionIsLegendary(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.isLegendary) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param creature
+ */
+export function hasLair(creature) {
+    return getDefinitionHasLair(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionHasLair(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.hasLair) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param creature
+ */
+export function getAvatarUrl(creature) {
+    return getDefinitionAvatarUrl(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionAvatarUrl(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.avatarUrl) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param creature
+ */
+export function getLargeAvatarUrl(creature) {
+    return getDefinitionLargeAvatarUrl(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionLargeAvatarUrl(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.largeAvatarUrl) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param creature
+ */
+export function getBasicAvatarUrl(creature) {
+    return getDefinitionBasicAvatarUrl(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionBasicAvatarUrl(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.basicAvatarUrl) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getSpecialTraitsDescription(creature) {
+    return getDefinitionSpecialTraitsDescription(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionSpecialTraitsDescription(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.specialTraitsDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getActionsDescription(creature) {
+    return getDefinitionActionsDescription(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionActionsDescription(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.actionsDescription) !== null && _b !== void 0 ? _b : null;
+}
+export function getBonusActionsDescription(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.bonusActionsDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getReactionsDescription(creature) {
+    return getDefinitionReactionsDescription(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionReactionsDescription(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.reactionsDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getLegendaryActionsDescription(creature) {
+    return getDefinitionLegendaryActionsDescription(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionLegendaryActionsDescription(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.legendaryActionsDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getCharacteristicsDescription(creature) {
+    return getDefinitionCharacteristicsDescription(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionCharacteristicsDescription(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.characteristicsDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getLairDescription(creature) {
+    return getDefinitionLairDescription(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionLairDescription(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.lairDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getArmorClass(creature) {
+    return creature.armorClass;
+}
+/**
+ *
+ * @param creature
+ */
+export function getGroupInfo(creature) {
+    return creature.groupInfo;
+}
+/**
+ *
+ * @param creature
+ */
+export function getEnvironmentTags(creature) {
+    return creature.environmentTags;
+}
+/**
+ *
+ * @param creature
+ */
+export function getSubTypeTags(creature) {
+    return creature.subTypeTags;
+}
+/**
+ *
+ * @param creature
+ */
+export function getTypeTag(creature) {
+    return creature.typeTag;
+}
+/**
+ *
+ * @param creature
+ */
+export function getHitPointInfo(creature) {
+    return creature.hitPointInfo;
+}
+/**
+ *
+ * @param creature
+ */
+export function getNotes(creature) {
+    return creature.notes;
+}
+/**
+ *
+ * @param creature
+ */
+export function getGroupActionSnippet(creature) {
+    var _a;
+    const groupInfo = getGroupInfo(creature);
+    return (_a = groupInfo === null || groupInfo === void 0 ? void 0 : groupInfo.actionSnippet) !== null && _a !== void 0 ? _a : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getLevel(creature) {
+    return creature.level;
+}
+/**
+ *
+ * @param creature
+ */
+export function getInfusion(creature) {
+    return creature.infusion;
+}
+/**
+ *
+ * @param creature
+ */
+export function getFlags(creature) {
+    return creature.flags;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionSources(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.sources) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param creature
+ */
+export function getSources(creature) {
+    return getDefinitionSources(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function isCustomized(creature) {
+    return creature.isCustomized;
+}
+/**
+ *
+ * @param creature
+ */
+export function getDefinitionHideCr(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.hideCr) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param creature
+ */
+export function getHideCr(creature) {
+    return getDefinitionHideCr(creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function getGear(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.gear) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getSlug(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.slug) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param creature
+ */
+export function getStatBlockType(creature) {
+    var _a, _b;
+    return (_b = (_a = creature.definition) === null || _a === void 0 ? void 0 : _a.statBlockType) !== null && _b !== void 0 ? _b : StatBlockTypeEnum.CORE_RULES_2014;
+}
+/**
+ *
+ * @param creature
+ */
+export function getInitialTempHp(creature) {
+    return creature.initialTempHp;
+}
+/**
+ *
+ * @param creature
+ */
+export function getUseOwnerHp(creature) {
+    return creature.useOwnerHp;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Creature/constants.js b/ddb_main/packages/rules-engine/es/engine/Creature/constants.js
new file mode 100644
index 0000000..1cd9951
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Creature/constants.js
@@ -0,0 +1,41 @@
+import { AdjustmentTypeEnum } from '../Value';
+export var CreatureGroupFlagEnum;
+(function (CreatureGroupFlagEnum) {
+    CreatureGroupFlagEnum["ARMOR_ADD_PROFICIENCY_BONUS"] = "ACPB";
+    CreatureGroupFlagEnum["ATTACK_ROLLS_ADD_PROFICIENCY_BONUS"] = "ARPB";
+    CreatureGroupFlagEnum["DAMAGE_ROLLS_ADD_PROFICIENCY_BONUS"] = "DRPB";
+    CreatureGroupFlagEnum["PROFICIENT_SKILLS_ADD_PROFICIENCY_BONUS"] = "PSPB";
+    CreatureGroupFlagEnum["PROFICIENT_SAVING_THROWS_ADD_PROFICIENCY_BONUS"] = "STPB";
+    CreatureGroupFlagEnum["MAX_HIT_POINTS_LEVEL_MULTIPLIER_OPTION"] = "HPLM";
+    CreatureGroupFlagEnum["EVALUATE_OWNER_SKILL_PROFICIENCIES"] = "EOSKP";
+    CreatureGroupFlagEnum["EVALUATE_OWNER_SAVE_PROFICIENCIES"] = "EOSVP";
+    CreatureGroupFlagEnum["EVALUATE_OWNER_PASSIVE_PERCEPTION"] = "EOPP";
+    CreatureGroupFlagEnum["EVALUATE_UPDATED_PASSIVE_PERCEPTION"] = "EUPP";
+    CreatureGroupFlagEnum["CANNOT_BE_SWARM"] = "CBS";
+    CreatureGroupFlagEnum["CANNOT_USE_LEGENDARY_ACTIONS"] = "CULGA";
+    CreatureGroupFlagEnum["CANNOT_USE_LAIR_ACTIONS"] = "CULRA";
+    CreatureGroupFlagEnum["ARTIFICER_HP_MULTIPLIER"] = "AHM";
+    CreatureGroupFlagEnum["MAX_HIT_POINTS_ADD_INT_MODIFIER"] = "MHPAIM";
+    CreatureGroupFlagEnum["MAX_HIT_POINTS_ADD_MONSTER_CON_MODIFIER"] = "MHPAMCM";
+    CreatureGroupFlagEnum["USE_CHALLENGE_RATING_AS_LEVEL"] = "UCRAL";
+    CreatureGroupFlagEnum["MAX_HIT_POINTS_BASE_ARTIFICER_LEVEL"] = "MHPBAL";
+    CreatureGroupFlagEnum["USE_OWNER_MAX_HIT_POINTS"] = "UOMHP";
+    CreatureGroupFlagEnum["TEMP_HIT_POINTS_BASE_DRUID_LEVEL"] = "THPBDL";
+    CreatureGroupFlagEnum["TEMP_HIT_POINTS_BASE_DRUID_LEVEL_MULTIPLIER"] = "THPBDLM";
+    CreatureGroupFlagEnum["ARMOR_ADD_OWNER_WIS_PLUS_FIXED_VALUE"] = "AAOWPFV";
+})(CreatureGroupFlagEnum || (CreatureGroupFlagEnum = {}));
+export const CREATURE_CUSTOMIZATION_ADJUSTMENT_TYPES = [
+    AdjustmentTypeEnum.CREATURE_SIZE,
+    AdjustmentTypeEnum.CREATURE_TYPE_OVERRIDE,
+    AdjustmentTypeEnum.CREATURE_ALIGNMENT,
+    AdjustmentTypeEnum.CREATURE_AC,
+    AdjustmentTypeEnum.CREATURE_HIT_POINTS,
+    AdjustmentTypeEnum.CREATURE_NOTES,
+];
+export const DB_STRING_GROUP_SIDEKICK = 'Sidekick';
+export const DB_STRING_TAG_SIDEKICK = 'Sidekick';
+export var StatBlockTypeEnum;
+(function (StatBlockTypeEnum) {
+    StatBlockTypeEnum[StatBlockTypeEnum["CORE_RULES_2014"] = 0] = "CORE_RULES_2014";
+    StatBlockTypeEnum[StatBlockTypeEnum["CORE_RULES_2024"] = 1] = "CORE_RULES_2024";
+})(StatBlockTypeEnum || (StatBlockTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Creature/derivers.js b/ddb_main/packages/rules-engine/es/engine/Creature/derivers.js
new file mode 100644
index 0000000..c24f177
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Creature/derivers.js
@@ -0,0 +1,653 @@
+import { TypeScriptUtils } from '../../utils';
+import { AbilityAccessors, AbilityUtils } from '../Ability';
+import { CharacterDerivers } from '../Character';
+import { AbilitySkillEnum, AbilityStatEnum, ProficiencyLevelEnum, } from '../Core';
+import { HelperUtils } from '../Helper';
+import { InfusionAccessors } from '../Infusion';
+import { RuleDataAccessors, RuleDataUtils } from '../RuleData';
+import { SkillAccessors } from '../Skill';
+import { AdjustmentTypeEnum, ValueHacks, ValueUtils, ValueValidators } from '../Value';
+import { getAverageHitPoints, getChallengeProficiencyBonus, getChallengeRatingId, getDamageAdjustments, getDefinitionAlignmentId, getDefinitionArmorClass, getDefinitionConditionImmunities, getDefinitionDamageAdjustments, getDefinitionPassivePerception, getDefinitionSavingThrows, getDefinitionSizeId, getDefinitionSkills, getDefinitionStats, getDefinitionSubTypes, getDefinitionTypeId, getEnvironments, getId, getLairChallengeRatingId, getMappingEntityTypeId, getMappingId, getMovements, getRemoveHitPoints, getTemporaryHitPoints, getTypeId, } from './accessors';
+import { CREATURE_CUSTOMIZATION_ADJUSTMENT_TYPES, CreatureGroupFlagEnum } from './constants';
+import { getStatInfo, hasGroupFlag, shouldReplaceWithOwnerStat } from './utils';
+/**
+ *
+ * @param creature
+ */
+export function derivePreOwnerHitPointInfo(creature) {
+    const finalTotalHp = Math.max(getAverageHitPoints(creature), 0);
+    const finalBaseHp = finalTotalHp;
+    const finalRemovedHp = Math.min(finalTotalHp, getRemoveHitPoints(creature));
+    return {
+        baseHp: finalBaseHp,
+        tempHp: 0,
+        removedHp: finalRemovedHp,
+        bonusHp: 0,
+        overrideHp: 0,
+        totalHp: finalTotalHp,
+        remainingHp: finalTotalHp - finalRemovedHp,
+    };
+}
+/**
+ *
+ * @param creature
+ * @param ownerData
+ * @param valueLookup
+ * @param ruleData
+ */
+export function deriveHitPointInfo(creature, ownerData, valueLookup, ruleData) {
+    const flagLevelMultiplierHpPossibilities = [];
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.MAX_HIT_POINTS_LEVEL_MULTIPLIER_OPTION)) {
+        const flagInfo = RuleDataUtils.getCreatureGroupFlagInfo(CreatureGroupFlagEnum.MAX_HIT_POINTS_LEVEL_MULTIPLIER_OPTION, ruleData);
+        if (flagInfo) {
+            const contextClassLevel = flagInfo.valueContextId === null ? 0 : ownerData.classLevelLookup[flagInfo.valueContextId];
+            const contextValue = flagInfo.value === null ? 1 : flagInfo.value;
+            flagLevelMultiplierHpPossibilities.push((contextClassLevel ? contextClassLevel : 0) * contextValue);
+        }
+    }
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.ARTIFICER_HP_MULTIPLIER)) {
+        const flagInfo = RuleDataUtils.getCreatureGroupFlagInfo(CreatureGroupFlagEnum.ARTIFICER_HP_MULTIPLIER, ruleData);
+        if (flagInfo) {
+            const contextClassLevel = flagInfo.valueContextId === null ? 0 : ownerData.classLevelLookup[flagInfo.valueContextId];
+            const contextValue = flagInfo.value === null ? 1 : flagInfo.value;
+            flagLevelMultiplierHpPossibilities.push((contextClassLevel ? contextClassLevel : 0) * contextValue);
+        }
+    }
+    const definitionTotalHp = getAverageHitPoints(creature);
+    let finalTotalHp = Math.max(definitionTotalHp, ...flagLevelMultiplierHpPossibilities);
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.MAX_HIT_POINTS_BASE_ARTIFICER_LEVEL)) {
+        const flagInfo = RuleDataUtils.getCreatureGroupFlagInfo(CreatureGroupFlagEnum.MAX_HIT_POINTS_BASE_ARTIFICER_LEVEL, ruleData);
+        if (flagInfo && flagInfo.valueContextId !== null) {
+            finalTotalHp = HelperUtils.lookupDataOrFallback(ownerData.classLevelLookup, flagInfo.valueContextId, finalTotalHp);
+        }
+    }
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.MAX_HIT_POINTS_ADD_INT_MODIFIER)) {
+        const flagInfo = RuleDataUtils.getCreatureGroupFlagInfo(CreatureGroupFlagEnum.MAX_HIT_POINTS_ADD_INT_MODIFIER, ruleData);
+        if (flagInfo) {
+            const contextStatModifier = flagInfo.valueContextId === null ? null : ownerData.abilityLookup[flagInfo.valueContextId];
+            let finalModifier = 0;
+            if (contextStatModifier && contextStatModifier.modifier) {
+                finalModifier = contextStatModifier.modifier;
+            }
+            finalTotalHp = HelperUtils.clampInt(finalTotalHp + finalModifier, RuleDataAccessors.getMinimumHpTotal(ruleData));
+        }
+    }
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.MAX_HIT_POINTS_ADD_MONSTER_CON_MODIFIER)) {
+        const flagInfo = RuleDataUtils.getCreatureGroupFlagInfo(CreatureGroupFlagEnum.MAX_HIT_POINTS_ADD_MONSTER_CON_MODIFIER, ruleData);
+        if (flagInfo !== null && flagInfo.valueContextId) {
+            let contextStatModifier = 0;
+            const contextStatInfo = getStatInfo(creature, flagInfo.valueContextId);
+            if (contextStatInfo !== null && contextStatInfo.modifier !== null) {
+                contextStatModifier = contextStatInfo.modifier;
+            }
+            finalTotalHp = HelperUtils.clampInt(finalTotalHp + contextStatModifier, ruleData.minimumHpTotal);
+        }
+    }
+    //if there is an override for the creature's hit points, use that instead
+    const hpOverride = deriveOverridenValue(creature, AdjustmentTypeEnum.CREATURE_HIT_POINTS, null, valueLookup);
+    if (hpOverride) {
+        finalTotalHp = hpOverride;
+    }
+    const tempHp = getTemporaryHitPoints(creature);
+    const finalRemovedHp = Math.min(finalTotalHp, getRemoveHitPoints(creature));
+    return {
+        baseHp: finalTotalHp,
+        tempHp,
+        removedHp: finalRemovedHp,
+        bonusHp: 0,
+        overrideHp: 0,
+        totalHp: finalTotalHp,
+        remainingHp: finalTotalHp - finalRemovedHp,
+    };
+}
+/**
+ *
+ * @param creature
+ * @param ownerData
+ * @param ruleData
+ */
+export function deriveInitialTempHp(creature, ownerData, ruleData) {
+    let initialTempHp = 0;
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.TEMP_HIT_POINTS_BASE_DRUID_LEVEL)) {
+        const flagInfo = RuleDataUtils.getCreatureGroupFlagInfo(CreatureGroupFlagEnum.TEMP_HIT_POINTS_BASE_DRUID_LEVEL, ruleData);
+        if (flagInfo) {
+            //find the level of the class or subclass id that matches the valueContextId and use it as the initial temp hp
+            const contextClassLevel = flagInfo.valueContextId === null ? 0 : ownerData.classLevelLookup[flagInfo.valueContextId];
+            initialTempHp = contextClassLevel;
+        }
+    }
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.TEMP_HIT_POINTS_BASE_DRUID_LEVEL_MULTIPLIER)) {
+        const flagInfo = RuleDataUtils.getCreatureGroupFlagInfo(CreatureGroupFlagEnum.TEMP_HIT_POINTS_BASE_DRUID_LEVEL_MULTIPLIER, ruleData);
+        if (flagInfo) {
+            //find the level of the class or subclass id that matches the valueContextId and multiply it by the contextValue
+            const contextClassLevel = flagInfo.valueContextId === null ? 0 : ownerData.classLevelLookup[flagInfo.valueContextId];
+            //only multiply the tempHp if the there is a contextClassLevel
+            if (contextClassLevel > 0) {
+                const contextValue = flagInfo.value === null ? 1 : flagInfo.value;
+                initialTempHp = contextClassLevel * contextValue;
+            }
+        }
+    }
+    return initialTempHp;
+}
+/**
+ *
+ * @param creature
+ */
+export function deriveUseOwnerHp(creature) {
+    //If this is true, the CreaturePane will use the player HP tracker instead of the Creature HP tracker and MaxHP override should be hidden from creature customization
+    return hasGroupFlag(creature, CreatureGroupFlagEnum.USE_OWNER_MAX_HIT_POINTS);
+}
+/**
+ *
+ * @param creature
+ * @param skill
+ * @param ownerData
+ * @param ruleData
+ */
+export function deriveOwnerSkillModifier(creature, skill, ownerData, ruleData) {
+    var _a, _b, _c;
+    const skillInfo = RuleDataUtils.getSkillInfo(skill.id, ruleData);
+    let statModifier = 0;
+    let proficiencyBonus = ownerData.proficiencyBonus;
+    let otherBonuses = 0;
+    if (skillInfo) {
+        const statInfo = getStatInfo(creature, skillInfo.stat);
+        const ownerSkill = HelperUtils.lookupDataOrFallback(ownerData.skillLookup, skill.id);
+        statModifier = (_a = statInfo === null || statInfo === void 0 ? void 0 : statInfo.monster.modifier) !== null && _a !== void 0 ? _a : 0;
+        if (ownerSkill !== null) {
+            const ownerProficiencyLevel = SkillAccessors.getProficiencyLevel(ownerSkill);
+            // Creature gives proficiency bonus if the owner doesn't have any
+            let proficiencyLevel = ProficiencyLevelEnum.FULL;
+            if (ownerProficiencyLevel !== ProficiencyLevelEnum.NONE) {
+                proficiencyLevel = ownerProficiencyLevel;
+            }
+            proficiencyBonus = CharacterDerivers.deriveProficiencyBonusAmount(proficiencyLevel, ownerData.proficiencyBonus);
+            if (shouldReplaceWithOwnerStat(creature, skillInfo.stat)) {
+                if (SkillAccessors.getIsOverridden(ownerSkill)) {
+                    statModifier = (_b = SkillAccessors.getModifier(ownerSkill)) !== null && _b !== void 0 ? _b : 0;
+                    proficiencyBonus = 0;
+                }
+                else {
+                    statModifier = SkillAccessors.getStatModifier(ownerSkill);
+                    otherBonuses = SkillAccessors.getModifierBonuses(ownerSkill);
+                }
+            }
+            else {
+                const statInfo = getStatInfo(creature, skillInfo.stat);
+                statModifier = (_c = statInfo === null || statInfo === void 0 ? void 0 : statInfo.monster.modifier) !== null && _c !== void 0 ? _c : 0;
+            }
+        }
+    }
+    return statModifier + proficiencyBonus + otherBonuses;
+}
+/**
+ *
+ * @param creature
+ * @param stat
+ * @param ownerData
+ */
+export function deriveOwnerSaveModifier(creature, stat, ownerData) {
+    var _a, _b, _c;
+    const statInfo = getStatInfo(creature, stat.id);
+    let statModifier = 0;
+    let proficiencyBonus = ownerData.proficiencyBonus;
+    let otherBonuses = 0;
+    const ownerAbility = HelperUtils.lookupDataOrFallback(ownerData.abilityLookup, stat.id);
+    if (ownerAbility !== null) {
+        const ownerProficiencyLevel = AbilityAccessors.getProficiencyLevel(ownerAbility);
+        // Creature gives proficiency bonus if the owner doesn't have any
+        let proficiencyLevel = ProficiencyLevelEnum.FULL;
+        if (ownerProficiencyLevel !== ProficiencyLevelEnum.NONE) {
+            proficiencyLevel = ownerProficiencyLevel;
+        }
+        proficiencyBonus = CharacterDerivers.deriveProficiencyBonusAmount(proficiencyLevel, ownerData.proficiencyBonus);
+        if (shouldReplaceWithOwnerStat(creature, stat.id)) {
+            if (AbilityAccessors.getIsSaveOverridden(ownerAbility)) {
+                statModifier = (_a = AbilityAccessors.getSave(ownerAbility)) !== null && _a !== void 0 ? _a : 0;
+                proficiencyBonus = 0;
+            }
+            else {
+                statModifier = (_b = AbilityAccessors.getModifier(ownerAbility)) !== null && _b !== void 0 ? _b : 0;
+                otherBonuses = AbilityAccessors.getSaveBonuses(ownerAbility);
+            }
+        }
+        else {
+            statModifier = (_c = statInfo === null || statInfo === void 0 ? void 0 : statInfo.monster.modifier) !== null && _c !== void 0 ? _c : 0;
+        }
+    }
+    return statModifier + proficiencyBonus + otherBonuses;
+}
+/**
+ *
+ * @param creature
+ * @param skill
+ * @param ruleData
+ */
+export function deriveCreatureSkillModifier(creature, skill, ruleData) {
+    var _a, _b;
+    const skillInfo = RuleDataUtils.getSkillInfo(skill.skillId, ruleData);
+    let statModifier = 0;
+    if (skillInfo) {
+        const statInfo = getStatInfo(creature, skillInfo.stat);
+        statModifier = (_a = statInfo === null || statInfo === void 0 ? void 0 : statInfo.monster.modifier) !== null && _a !== void 0 ? _a : 0;
+    }
+    const proficiencyBonus = getChallengeProficiencyBonus(creature);
+    const otherBonuses = (_b = skill.additionalBonus) !== null && _b !== void 0 ? _b : 0;
+    return statModifier + proficiencyBonus + otherBonuses;
+}
+/**
+ *
+ * @param creature
+ * @param savingThrow
+ */
+export function deriveCreatureSaveModifier(creature, savingThrow) {
+    var _a, _b;
+    const statInfo = getStatInfo(creature, savingThrow.statId);
+    const statModifier = (_a = statInfo === null || statInfo === void 0 ? void 0 : statInfo.monster.modifier) !== null && _a !== void 0 ? _a : 0;
+    const proficiencyBonus = getChallengeProficiencyBonus(creature);
+    const otherBonuses = (_b = savingThrow.bonusModifier) !== null && _b !== void 0 ? _b : 0;
+    return statModifier + proficiencyBonus + otherBonuses;
+}
+/**
+ *
+ * @param creature
+ * @param ownerData
+ * @param ruleData
+ */
+export function deriveSkills(creature, ownerData, ruleData) {
+    const skills = RuleDataAccessors.getAbilitySkills(ruleData);
+    return skills
+        .map((skillInfo) => {
+        var _a;
+        const statInfo = RuleDataUtils.getStatInfo(skillInfo.stat, ruleData);
+        const creatureSkill = getDefinitionSkills(creature).find((skill) => skill.skillId === skillInfo.id);
+        const isCreatureProficient = !!creatureSkill;
+        const potentialModifiers = [];
+        if (hasGroupFlag(creature, CreatureGroupFlagEnum.EVALUATE_OWNER_SKILL_PROFICIENCIES)) {
+            const ownerSkill = HelperUtils.lookupDataOrFallback(ownerData.skillLookup, skillInfo.id);
+            const isOwnerProficient = ownerSkill !== null && SkillAccessors.getProficiencyLevel(ownerSkill) !== ProficiencyLevelEnum.NONE;
+            if (isCreatureProficient || isOwnerProficient) {
+                potentialModifiers.push(deriveOwnerSkillModifier(creature, skillInfo, ownerData, ruleData));
+            }
+            // Can potentially use creatures modifier if the owner is "proficient"
+            if (creatureSkill && isCreatureProficient && isOwnerProficient) {
+                potentialModifiers.push(deriveCreatureSkillModifier(creature, creatureSkill, ruleData));
+            }
+        }
+        else if (creatureSkill && isCreatureProficient) {
+            potentialModifiers.push(deriveCreatureSkillModifier(creature, creatureSkill, ruleData));
+        }
+        // if we didn't generate any potential modifiers, exit early and null will be filtered out
+        if (!potentialModifiers.length) {
+            return null;
+        }
+        const modifier = Math.max(...potentialModifiers);
+        let bonuses = 0;
+        if (hasGroupFlag(creature, CreatureGroupFlagEnum.PROFICIENT_SKILLS_ADD_PROFICIENCY_BONUS)) {
+            bonuses += ownerData.proficiencyBonus;
+        }
+        return {
+            id: skillInfo.id,
+            modifier: modifier + bonuses,
+            statKey: (_a = statInfo === null || statInfo === void 0 ? void 0 : statInfo.key) !== null && _a !== void 0 ? _a : 'UNK',
+        };
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param creature
+ * @param ownerData
+ * @param ruleData
+ */
+export function deriveSavingThrows(creature, ownerData, ruleData) {
+    const stats = RuleDataAccessors.getStats(ruleData);
+    return stats
+        .map((stat) => {
+        var _a;
+        const creatureSavingThrow = getDefinitionSavingThrows(creature).find((savingThrow) => savingThrow.statId === stat.id);
+        const isCreatureProficient = !!creatureSavingThrow;
+        const potentialModifiers = [];
+        if (hasGroupFlag(creature, CreatureGroupFlagEnum.EVALUATE_OWNER_SAVE_PROFICIENCIES)) {
+            const ownerAbility = HelperUtils.lookupDataOrFallback(ownerData.abilityLookup, stat.id);
+            const isOwnerProficient = ownerAbility !== null &&
+                AbilityAccessors.getProficiencyLevel(ownerAbility) !== ProficiencyLevelEnum.NONE;
+            if (isCreatureProficient || isOwnerProficient) {
+                potentialModifiers.push(deriveOwnerSaveModifier(creature, stat, ownerData));
+            }
+            // Can potentially use creatures modifier if the owner is "proficient"
+            if (creatureSavingThrow && isCreatureProficient && isOwnerProficient) {
+                potentialModifiers.push(deriveCreatureSaveModifier(creature, creatureSavingThrow));
+            }
+        }
+        else if (creatureSavingThrow && isCreatureProficient) {
+            potentialModifiers.push(deriveCreatureSaveModifier(creature, creatureSavingThrow));
+        }
+        // if we didn't generate any potential modifiers, exit early and null will be filtered out
+        if (!potentialModifiers.length) {
+            return null;
+        }
+        const modifier = Math.max(...potentialModifiers);
+        let bonuses = 0;
+        if (hasGroupFlag(creature, CreatureGroupFlagEnum.PROFICIENT_SAVING_THROWS_ADD_PROFICIENCY_BONUS)) {
+            bonuses += ownerData.proficiencyBonus;
+        }
+        return {
+            statId: stat.id,
+            modifier: modifier + bonuses,
+            statKey: (_a = stat.key) !== null && _a !== void 0 ? _a : '',
+        };
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param creature
+ * @param ownerData
+ * @param ruleData
+ */
+export function deriveStats(creature, ownerData, ruleData) {
+    return getDefinitionStats(creature).map((stat) => {
+        var _a;
+        const originalScore = stat.value;
+        let score = stat.value;
+        if (shouldReplaceWithOwnerStat(creature, stat.statId)) {
+            const ownerAbility = HelperUtils.lookupDataOrFallback(ownerData.abilityLookup, stat.statId);
+            if (ownerAbility !== null) {
+                score = AbilityAccessors.getScore(ownerAbility);
+            }
+        }
+        const statInfo = RuleDataUtils.getStatInfo(stat.statId, ruleData);
+        const statKey = (_a = statInfo === null || statInfo === void 0 ? void 0 : statInfo.key) !== null && _a !== void 0 ? _a : null;
+        const modifier = score === null ? null : AbilityUtils.getStatScoreModifier(score, ruleData);
+        const originalModifier = originalScore === null ? null : AbilityUtils.getStatScoreModifier(originalScore, ruleData);
+        return {
+            id: stat.statId,
+            score,
+            modifier,
+            statKey,
+            monster: {
+                score: originalScore,
+                modifier: originalModifier,
+            },
+        };
+    });
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function deriveDamageAdjustments(creature, ruleData) {
+    return getDefinitionDamageAdjustments(creature)
+        .map((damageAdjustmentId) => RuleDataUtils.getDamageAdjustmentInfo(damageAdjustmentId, ruleData))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function deriveConditionImmunities(creature, ruleData) {
+    return getDefinitionConditionImmunities(creature)
+        .map((conditionId) => RuleDataUtils.getConditionInfo(conditionId, ruleData))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param damageAdjustmentType
+ * @param creature
+ */
+export function deriveDamageAdjustmentType(damageAdjustmentType, creature) {
+    return getDamageAdjustments(creature).filter((damageAdjustment) => damageAdjustment.type === damageAdjustmentType);
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function deriveSubTypes(creature, ruleData) {
+    const subTypes = getDefinitionSubTypes(creature);
+    return subTypes
+        .map((subTypeId) => RuleDataUtils.getMonsterSubTypeInfo(subTypeId, ruleData))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param creature
+ * @param ownerData
+ * @param skillLookup
+ * @param ruleData
+ */
+export function derivePassivePerception(creature, ownerData, skillLookup, ruleData) {
+    if (!hasGroupFlag(creature, CreatureGroupFlagEnum.EVALUATE_UPDATED_PASSIVE_PERCEPTION)) {
+        return getDefinitionPassivePerception(creature);
+    }
+    let skillModifier = 0;
+    const perceptionInfo = skillLookup[AbilitySkillEnum.PERCEPTION];
+    if (perceptionInfo) {
+        skillModifier = perceptionInfo.modifier;
+    }
+    else {
+        // fallback to perception's stat modifier if perception isn't called out
+        const skillInfo = RuleDataUtils.getSkillInfo(AbilitySkillEnum.PERCEPTION, ruleData);
+        if (skillInfo) {
+            const statInfo = getStatInfo(creature, skillInfo.stat);
+            skillModifier = statInfo && statInfo.modifier !== null ? statInfo.modifier : 0;
+        }
+    }
+    const derivedPassivePerception = CharacterDerivers.derivePassiveSkill(skillModifier);
+    const passivePerceptionPossibilities = [derivedPassivePerception];
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.EVALUATE_OWNER_PASSIVE_PERCEPTION)) {
+        if (ownerData.passivePerception !== null) {
+            passivePerceptionPossibilities.push(ownerData.passivePerception);
+        }
+    }
+    return Math.max(...passivePerceptionPossibilities);
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function deriveEnvironmentTags(creature, ruleData) {
+    const envs = getEnvironments(creature);
+    return envs
+        .map((envId) => {
+        const envInfo = RuleDataUtils.getEnvironmentInfo(envId, ruleData);
+        if (envInfo) {
+            return envInfo.name;
+        }
+        return null;
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function deriveSubTypeTags(creature, ruleData) {
+    const subTypes = getDefinitionSubTypes(creature);
+    return subTypes
+        .map((subTypeId) => {
+        const info = RuleDataUtils.getMonsterSubTypeInfo(subTypeId, ruleData);
+        if (info) {
+            return info.name;
+        }
+        return null;
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function deriveTypeTag(creature, ruleData) {
+    return RuleDataUtils.getMonsterTypeName(getTypeId(creature), ruleData, null);
+}
+/**
+ *
+ * @param creature
+ */
+export function deriveMovementIds(creature) {
+    return getMovements(creature).map((movement) => movement.movementId);
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function deriveMovementNames(creature, ruleData) {
+    return getMovements(creature).map((movement) => RuleDataUtils.getMovementDescription(movement.movementId, ruleData));
+}
+/**
+ *
+ * @param creature
+ * @param ownerData
+ * @param valueLookup
+ */
+export function deriveArmorClass(creature, ownerData, valueLookup, ruleData) {
+    var _a;
+    const armorOverride = deriveOverridenValue(creature, AdjustmentTypeEnum.CREATURE_AC, null, valueLookup);
+    if (armorOverride) {
+        return armorOverride;
+    }
+    let bonuses = 0;
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.ARMOR_ADD_PROFICIENCY_BONUS)) {
+        bonuses += ownerData.proficiencyBonus;
+    }
+    let armorClass = getDefinitionArmorClass(creature);
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.ARMOR_ADD_OWNER_WIS_PLUS_FIXED_VALUE)) {
+        const flagInfo = RuleDataUtils.getCreatureGroupFlagInfo(CreatureGroupFlagEnum.ARMOR_ADD_OWNER_WIS_PLUS_FIXED_VALUE, ruleData);
+        if (flagInfo) {
+            const contextClassLevel = flagInfo.valueContextId === null ? 0 : ownerData.classLevelLookup[flagInfo.valueContextId];
+            //Check if the owner has a matching class or subclass to the contextValueId
+            if (contextClassLevel > 0) {
+                const ownerWisdomModifier = (_a = ownerData.abilityLookup[AbilityStatEnum.WISDOM].modifier) !== null && _a !== void 0 ? _a : 0;
+                const contextValue = flagInfo.value === null ? 0 : flagInfo.value;
+                //AC will should be the highest value between the current AC and the owner's wisdom modifier + the context value
+                armorClass = Math.max(armorClass, contextValue + ownerWisdomModifier);
+            }
+        }
+    }
+    //Add any final bonuses to the AC;
+    return armorClass + bonuses;
+}
+/**
+ *
+ * @param creature
+ * @param valueTypeId
+ * @param fallback
+ * @param valueLookup
+ */
+function deriveOverridenValue(creature, valueTypeId, fallback, valueLookup) {
+    if (valueLookup) {
+        const override = ValueUtils.getKeyValue(valueLookup, valueTypeId, ValueHacks.hack__toString(getMappingId(creature)), ValueHacks.hack__toString(getMappingEntityTypeId(creature)));
+        if (override) {
+            return override;
+        }
+    }
+    return fallback;
+}
+/**
+ *
+ * @param creature
+ * @param valueLookup
+ */
+export function deriveSizeId(creature, valueLookup) {
+    return deriveOverridenValue(creature, AdjustmentTypeEnum.CREATURE_SIZE, getDefinitionSizeId(creature), valueLookup);
+}
+/**
+ *
+ * @param creature
+ * @param valueLookup
+ */
+export function deriveTypeId(creature, valueLookup) {
+    return deriveOverridenValue(creature, AdjustmentTypeEnum.CREATURE_TYPE_OVERRIDE, getDefinitionTypeId(creature), valueLookup);
+}
+/**
+ *
+ * @param creature
+ * @param valueLookup
+ */
+export function deriveAlignmentId(creature, valueLookup) {
+    return deriveOverridenValue(creature, AdjustmentTypeEnum.CREATURE_ALIGNMENT, getDefinitionAlignmentId(creature), valueLookup);
+}
+/**
+ *
+ * @param creature
+ * @param valueLookup
+ */
+export function deriveNotes(creature, valueLookup) {
+    return deriveOverridenValue(creature, AdjustmentTypeEnum.CREATURE_NOTES, null, valueLookup);
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function deriveLevel(creature, ruleData) {
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.USE_CHALLENGE_RATING_AS_LEVEL)) {
+        const challengeInfo = RuleDataUtils.getChallengeInfo(getChallengeRatingId(creature), ruleData);
+        const level = challengeInfo ? challengeInfo.value : 0;
+        const maxCharLevel = RuleDataAccessors.getMaxCharacterLevel(ruleData);
+        return HelperUtils.clampInt(level, 1, maxCharLevel);
+    }
+    return null;
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function deriveChallengeInfo(creature, ruleData) {
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.USE_CHALLENGE_RATING_AS_LEVEL)) {
+        return null;
+    }
+    return RuleDataUtils.getChallengeInfo(getChallengeRatingId(creature), ruleData);
+}
+export function deriveLairChallengeInfo(creature, ruleData) {
+    if (hasGroupFlag(creature, CreatureGroupFlagEnum.USE_CHALLENGE_RATING_AS_LEVEL)) {
+        return null;
+    }
+    return RuleDataUtils.getChallengeInfo(getLairChallengeRatingId(creature), ruleData);
+}
+/**
+ *
+ * @param creature
+ * @param groupInfo
+ * @param infusion
+ */
+export function deriveFlags(creature, groupInfo, infusion) {
+    const flags = [];
+    if (groupInfo && groupInfo.flags !== null) {
+        flags.push(...groupInfo.flags);
+    }
+    if (infusion) {
+        const creatureData = InfusionAccessors.getCreatureData(infusion);
+        if (creatureData) {
+            const foundCreatureData = creatureData.find((creatureDataEntry) => creatureDataEntry.monsterId === getId(creature));
+            if (foundCreatureData && foundCreatureData.flags !== null) {
+                flags.push(...foundCreatureData.flags);
+            }
+        }
+    }
+    return flags;
+}
+/**
+ *
+ * @param creature
+ * @param valueLookup
+ */
+export function deriveIsCustomized(creature, valueLookup) {
+    let isCustomized = ValueValidators.validateHasCustomization(CREATURE_CUSTOMIZATION_ADJUSTMENT_TYPES, valueLookup, ValueHacks.hack__toString(getMappingId(creature)), ValueHacks.hack__toString(getMappingEntityTypeId(creature)));
+    if (!isCustomized) {
+        if (creature.name !== null && creature.name !== '') {
+            isCustomized = true;
+        }
+    }
+    return isCustomized;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Creature/generators.js b/ddb_main/packages/rules-engine/es/engine/Creature/generators.js
new file mode 100644
index 0000000..085443f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Creature/generators.js
@@ -0,0 +1,78 @@
+import { keyBy } from 'lodash';
+import { ClassGenerators } from '../Class';
+import { DamageAdjustmentTypeEnum } from '../Core';
+import { HelperUtils } from '../Helper';
+import { RuleDataUtils } from '../RuleData';
+import { getDefinitionArmorClass, getGroupId, getMappingId } from './accessors';
+import { deriveAlignmentId, deriveArmorClass, deriveChallengeInfo, deriveConditionImmunities, deriveDamageAdjustments, deriveDamageAdjustmentType, deriveEnvironmentTags, deriveFlags, deriveHitPointInfo, deriveInitialTempHp, deriveUseOwnerHp, deriveIsCustomized, deriveLairChallengeInfo, deriveLevel, deriveMovementIds, deriveMovementNames, deriveNotes, derivePassivePerception, derivePreOwnerHitPointInfo, deriveSavingThrows, deriveSizeId, deriveSkills, deriveStats, deriveSubTypes, deriveSubTypeTags, deriveTypeId, deriveTypeTag, } from './derivers';
+/**
+ *
+ * @param creatures
+ * @param ownerData
+ * @param valueLookup
+ * @param creatureInfusionLookup
+ * @param ruleData
+ */
+export function generateCreatures(creatures, ownerData, valueLookup, creatureInfusionLookup, ruleData) {
+    return creatures.map((creature) => generateCreature(creature, ownerData, valueLookup, creatureInfusionLookup, ruleData));
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ * @param valueLookup
+ * @param creatureInfusionLookup
+ */
+export function generateBaseCreature(creature, ruleData, valueLookup = {}, creatureInfusionLookup = {}) {
+    const sizeId = deriveSizeId(creature, valueLookup);
+    const groupInfo = RuleDataUtils.getCreatureGroupInfo(getGroupId(creature), ruleData);
+    const infusion = HelperUtils.lookupDataOrFallback(creatureInfusionLookup, getMappingId(creature));
+    return Object.assign(Object.assign({}, creature), { sizeId,
+        infusion,
+        groupInfo, typeId: deriveTypeId(creature, valueLookup), alignmentId: deriveAlignmentId(creature, valueLookup), flags: deriveFlags(creature, groupInfo, infusion), sizeInfo: RuleDataUtils.getCreatureSizeInfo(sizeId, ruleData), damageAdjustments: deriveDamageAdjustments(creature, ruleData), conditionImmunities: deriveConditionImmunities(creature, ruleData), subTypes: deriveSubTypes(creature, ruleData), environmentTags: deriveEnvironmentTags(creature, ruleData), subTypeTags: deriveSubTypeTags(creature, ruleData), hitPointInfo: derivePreOwnerHitPointInfo(creature), movementIds: deriveMovementIds(creature), movementNames: deriveMovementNames(creature, ruleData), armorClass: getDefinitionArmorClass(creature), notes: deriveNotes(creature, valueLookup) });
+}
+/**
+ *
+ * @param creature
+ * @param ownerData
+ * @param valueLookup
+ * @param creatureInfusionLookup
+ * @param ruleData
+ */
+export function generateCreature(creature, ownerData, valueLookup, creatureInfusionLookup, ruleData) {
+    // Generate all base non dependent, but still relevant data on the creature
+    const baseCreature = generateBaseCreature(creature, ruleData, valueLookup, creatureInfusionLookup);
+    // Generate all dependent data that is used to derive other properties
+    const stats = deriveStats(baseCreature, ownerData, ruleData);
+    const creatureStageOne = Object.assign(Object.assign({}, baseCreature), { stats, statLookup: keyBy(stats, 'id'), level: deriveLevel(baseCreature, ruleData), challengeInfo: deriveChallengeInfo(baseCreature, ruleData), lairChallengeInfo: deriveLairChallengeInfo(baseCreature, ruleData), typeTag: deriveTypeTag(baseCreature, ruleData) });
+    const savingThrows = deriveSavingThrows(creatureStageOne, ownerData, ruleData);
+    const skills = deriveSkills(creatureStageOne, ownerData, ruleData);
+    const skillLookup = keyBy(skills, 'id');
+    // return final generated creature with full derived data
+    return Object.assign(Object.assign({}, creatureStageOne), { damageVulnerabilities: deriveDamageAdjustmentType(DamageAdjustmentTypeEnum.VULNERABILITY, creatureStageOne), damageResistances: deriveDamageAdjustmentType(DamageAdjustmentTypeEnum.RESISTANCE, creatureStageOne), damageImmunities: deriveDamageAdjustmentType(DamageAdjustmentTypeEnum.IMMUNITY, creatureStageOne), savingThrows, savingThrowLookup: keyBy(savingThrows, 'statId'), skills,
+        skillLookup, passivePerception: derivePassivePerception(creatureStageOne, ownerData, skillLookup, ruleData), armorClass: deriveArmorClass(creatureStageOne, ownerData, valueLookup, ruleData), hitPointInfo: deriveHitPointInfo(creatureStageOne, ownerData, valueLookup, ruleData), initialTempHp: deriveInitialTempHp(creatureStageOne, ownerData, ruleData), useOwnerHp: deriveUseOwnerHp(creatureStageOne), isCustomized: deriveIsCustomized(creatureStageOne, valueLookup) });
+}
+/**
+ *
+ * @param classLevelLookup
+ * @param skillLookup
+ * @param proficiencyBonus
+ * @param abilityLookup
+ * @param passivePerception
+ */
+export function generateCreatureOwnerData(classes, skillLookup, proficiencyBonus, abilityLookup, passivePerception) {
+    return {
+        abilityLookup,
+        proficiencyBonus,
+        skillLookup,
+        classLevelLookup: ClassGenerators.generateClassLevelLookup(classes),
+        passivePerception,
+    };
+}
+/**
+ *
+ * @param creatures
+ */
+export function generateCreatureLookup(creatures) {
+    return keyBy(creatures, (creature) => getMappingId(creature));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Creature/index.js b/ddb_main/packages/rules-engine/es/engine/Creature/index.js
new file mode 100644
index 0000000..476195b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Creature/index.js
@@ -0,0 +1,13 @@
+import * as CreatureAccessors from './accessors';
+import * as CreatureConstants from './constants';
+import * as CreatureDerivers from './derivers';
+import * as CreatureGenerators from './generators';
+import * as CreatureNotes from './notes';
+import * as CreatureRenderers from './renderers';
+import * as CreatureSimulators from './simulators';
+import * as CreatureTypings from './typings';
+import * as CreatureUtils from './utils';
+export * from './typings';
+export * from './constants';
+export { CreatureAccessors, CreatureDerivers, CreatureGenerators, CreatureNotes, CreatureSimulators, CreatureUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, CreatureAccessors), CreatureConstants), CreatureDerivers), CreatureGenerators), CreatureNotes), CreatureTypings), CreatureSimulators), CreatureUtils), CreatureRenderers);
diff --git a/ddb_main/packages/rules-engine/es/engine/Creature/notes.js b/ddb_main/packages/rules-engine/es/engine/Creature/notes.js
new file mode 100644
index 0000000..e0ed095
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Creature/notes.js
@@ -0,0 +1,34 @@
+import { TypeScriptUtils } from '../../utils';
+import { InfusionAccessors } from '../Infusion';
+import { NoteGenerators } from '../Note';
+import { getEnvironmentTags, getInfusion, getNotes, getTags } from './accessors';
+export function getTagNoteComponents(creature) {
+    const tags = getTags(creature);
+    return NoteGenerators.createGroup(tags.map((tag) => NoteGenerators.createPlainText(tag)), ', ');
+}
+export function getEnvironmentNoteComponents(creature) {
+    const envTags = getEnvironmentTags(creature);
+    return NoteGenerators.createGroup(envTags.map((tag) => NoteGenerators.createPlainText(tag)), ', ');
+}
+function getUserNoteComponent(creature) {
+    const notes = getNotes(creature);
+    if (notes) {
+        return NoteGenerators.createPlainText(notes);
+    }
+    return null;
+}
+function getInfusionNoteComponent(creature) {
+    const infusion = getInfusion(creature);
+    if (infusion) {
+        return NoteGenerators.createPlainText(`Infusion: ${InfusionAccessors.getName(infusion)}`);
+    }
+    return null;
+}
+export function getNoteComponents(creature, ruleData) {
+    const notes = [];
+    notes.push(getUserNoteComponent(creature));
+    notes.push(getInfusionNoteComponent(creature));
+    notes.push(getTagNoteComponents(creature));
+    notes.push(getEnvironmentNoteComponents(creature));
+    return notes.filter(TypeScriptUtils.isNotNullOrUndefined);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Creature/renderers.js b/ddb_main/packages/rules-engine/es/engine/Creature/renderers.js
new file mode 100644
index 0000000..021a692
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Creature/renderers.js
@@ -0,0 +1,166 @@
+import { DiceRenderers } from '../Dice';
+import { FormatUtils } from '../Format';
+import { RuleDataUtils } from '../RuleData';
+import { getAlignmentId, getArmorClass, getArmorClassDescription, getChallengeInfo, getDefinitionName, getHideCr, getHitPointDice, getHitPointInfo, getInitiative, getLairChallengeInfo, getLanguageNote, getLanguages, getLevel, getMovements, getName, getPassivePerception, getSavingThrows, getSenses, getSizeId, getSkills, getStatBlockType, getSubTypes, getTypeId, } from './accessors';
+import { StatBlockTypeEnum } from './constants';
+import { getTypeName } from './utils';
+//Render a formatted meta text string for a given Creature
+export function renderMetaText(creature, ruleData, useBaseMonsterType) {
+    var _a, _b;
+    //CreatureLevel
+    const creatureLevel = getLevel(creature);
+    const level = creatureLevel !== null ? `${FormatUtils.ordinalize(creatureLevel)}-level` : '';
+    //CreatureSize
+    const sizeInfo = RuleDataUtils.getCreatureSizeInfo(getSizeId(creature), ruleData);
+    const size = (_a = sizeInfo === null || sizeInfo === void 0 ? void 0 : sizeInfo.name) !== null && _a !== void 0 ? _a : '';
+    //CreatureType
+    let type = '';
+    if (useBaseMonsterType) {
+        const typeInfo = RuleDataUtils.getMonsterTypeInfo(getTypeId(creature), ruleData);
+        if (typeInfo === null || typeInfo === void 0 ? void 0 : typeInfo.name) {
+            type = typeInfo.name;
+        }
+    }
+    else {
+        type = getTypeName(creature, ruleData);
+    }
+    //CreatureAlignment
+    const alignmentInfo = RuleDataUtils.getAlignmentInfo(getAlignmentId(creature), ruleData);
+    const alignment = (_b = alignmentInfo === null || alignmentInfo === void 0 ? void 0 : alignmentInfo.name) !== null && _b !== void 0 ? _b : '';
+    //Extra Text
+    let extraTextChunks = [];
+    //If the creature has a customized name that is differenct than the definition name, add the definition name
+    if (getName(creature) !== getDefinitionName(creature)) {
+        extraTextChunks.push(getDefinitionName(creature));
+    }
+    //Add any subtypes
+    const subTypes = getSubTypes(creature);
+    if (subTypes.length) {
+        subTypes.forEach((monsterInfo) => {
+            if (monsterInfo.name !== null) {
+                extraTextChunks.push(monsterInfo.name);
+            }
+        });
+    }
+    const extraText = extraTextChunks.join(', ');
+    return `${level} ${size} ${type}${extraText ? ` (${extraText})` : ''}${alignment ? `, ${alignment}` : ''}`.trim();
+}
+//Render a Creature's Armor Class with any additional description added
+export function renderArmorClass(creature) {
+    return `${getArmorClass(creature)} ${getArmorClassDescription(creature)}`.trim();
+}
+//Render a Creature's initative info: bonus (score)
+export function renderInitiativeInfo(creature) {
+    const initiativeInfo = getInitiative(creature);
+    if (initiativeInfo === null || initiativeInfo === void 0 ? void 0 : initiativeInfo.bonus) {
+        const { bonus, score } = initiativeInfo;
+        return `${FormatUtils.renderSignedNumber(bonus)} ${score ? `(${initiativeInfo.score})` : ''}`.trim();
+    }
+    return null;
+}
+//Render a Creature's total Hit Points and Hit Point Dice
+export function renderHitPointInfo(creature) {
+    const totalHp = getHitPointInfo(creature).totalHp;
+    const hitPointDice = getHitPointDice(creature);
+    const hpDiceText = hitPointDice ? ` (${DiceRenderers.renderDice(getHitPointDice(creature))})` : '';
+    return `${totalHp}${hpDiceText}`;
+}
+//Render a Creature's Speed info
+export function renderSpeedInfo(creature, ruleData) {
+    const movements = getMovements(creature);
+    if (movements.length) {
+        const movementDisplays = movements.map((movement, idx) => {
+            let label = '';
+            if (idx !== 0) {
+                label = RuleDataUtils.getMovementName(movement.movementId, ruleData);
+            }
+            return `${label} ${FormatUtils.renderDistance(movement.speed)} ${movement.notes ? movement.notes : ''}`.trim();
+        });
+        return movementDisplays.join(', ');
+    }
+    return '--';
+}
+//Render a Creature's Saving Throws info
+export function renderSavingThrows(creature) {
+    const savingThrows = getSavingThrows(creature);
+    if (!savingThrows.length) {
+        return null;
+    }
+    const savingThrowDisplays = savingThrows.map((savingThrow) => {
+        return `${savingThrow.statKey} ${FormatUtils.renderSignedNumber(savingThrow.modifier)}`;
+    });
+    return savingThrowDisplays.join(', ');
+}
+//Render a Creature's Skills info
+export function renderSkills(creature, ruleData) {
+    const skills = getSkills(creature);
+    if (!skills.length) {
+        return null;
+    }
+    const skillDisplays = skills.map((skill) => {
+        const skillInfo = RuleDataUtils.getSkillInfo(skill.id, ruleData);
+        const name = (skillInfo === null || skillInfo === void 0 ? void 0 : skillInfo.name) ? skillInfo.name : '';
+        const modifier = skill.modifier;
+        return `${name} ${FormatUtils.renderSignedNumber(modifier)}`;
+    });
+    return skillDisplays.join(', ');
+}
+//Render a Creature's Senses info
+export function renderSensesInfo(creature, ruleData) {
+    const senses = getSenses(creature);
+    const senseDisplays = senses.map((sense) => {
+        const senseInfo = RuleDataUtils.getSenseInfo(sense.senseId, ruleData);
+        const senseName = senseInfo ? senseInfo.name : '';
+        return `${senseName} ${sense.notes}`;
+    });
+    const senseDisplay = senseDisplays.length ? `${senseDisplays.join(', ')}, ` : '';
+    const passivePerception = getPassivePerception(creature);
+    return `${senseDisplay}Passive Perception ${passivePerception}`;
+}
+//Render a Creature's Languages info
+export function renderLanguages(creature, ruleData) {
+    const languages = getLanguages(creature);
+    const languageNote = getLanguageNote(creature);
+    let languageText = '';
+    if (languages.length || languageNote) {
+        let languageDisplays = languages.map((language) => {
+            const name = RuleDataUtils.getLanguageName(language.languageId, ruleData);
+            return `${name} ${language.notes}`.trim();
+        });
+        if (languageNote) {
+            languageDisplays.push(languageNote);
+        }
+        languageText = languageDisplays.join(', ');
+    }
+    else {
+        languageText = '--';
+    }
+    return languageText;
+}
+//Render a Creature's Challenge Rating info, adjusted for 2014 vs 2024 version
+export function renderChallengeRatingInfo(creature) {
+    const challengeInfo = getChallengeInfo(creature);
+    const hideCr = getHideCr(creature);
+    const statBlockType = getStatBlockType(creature);
+    if (!challengeInfo || hideCr) {
+        return null;
+    }
+    if (statBlockType === StatBlockTypeEnum.CORE_RULES_2024) {
+        const PBtext = `; PB ${FormatUtils.renderSignedNumber(challengeInfo.proficiencyBonus)}`;
+        const lairChallengeInfo = getLairChallengeInfo(creature);
+        const lairCRText = (lairChallengeInfo === null || lairChallengeInfo === void 0 ? void 0 : lairChallengeInfo.xp)
+            ? `, or ${FormatUtils.renderLocaleNumber(lairChallengeInfo.xp)} in lair`
+            : '';
+        return `${FormatUtils.renderChallengeRating(challengeInfo.value)} (XP ${FormatUtils.renderLocaleNumber(challengeInfo.xp)}${lairCRText}${PBtext})`;
+    }
+    return `${FormatUtils.renderChallengeRating(challengeInfo.value)} (${FormatUtils.renderLocaleNumber(challengeInfo.xp)} XP)`;
+}
+//render a Creature's Proficiency Bonus
+export function renderProficiencyBonus(creature) {
+    const challengeInfo = getChallengeInfo(creature);
+    const hideCr = getHideCr(creature);
+    if (!challengeInfo || hideCr) {
+        return null;
+    }
+    return FormatUtils.renderSignedNumber(challengeInfo.proficiencyBonus);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Creature/simulators.js b/ddb_main/packages/rules-engine/es/engine/Creature/simulators.js
new file mode 100644
index 0000000..43507a6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Creature/simulators.js
@@ -0,0 +1,23 @@
+import { deriveChallengeInfo, deriveLairChallengeInfo, deriveLevel, deriveTypeTag } from './derivers';
+import { generateBaseCreature } from './generators';
+/**
+ *
+ * @param creatureDefinition
+ * @param groupId
+ * @param ruleData
+ */
+export function simulateCreature(creatureDefinition, groupId, ruleData) {
+    const creature = {
+        definition: Object.assign({}, creatureDefinition),
+        description: null,
+        entityTypeId: -1,
+        groupId,
+        id: -1,
+        isActive: false,
+        name: null,
+        removedHitPoints: 0,
+        temporaryHitPoints: 0,
+    };
+    const baseCreature = generateBaseCreature(creature, ruleData);
+    return Object.assign(Object.assign({}, baseCreature), { level: deriveLevel(baseCreature, ruleData), challengeInfo: deriveChallengeInfo(baseCreature, ruleData), lairChallengeInfo: deriveLairChallengeInfo(baseCreature, ruleData), typeTag: deriveTypeTag(baseCreature, ruleData), statLookup: {}, stats: [], damageImmunities: [], damageResistances: [], damageVulnerabilities: [], passivePerception: null, savingThrowLookup: {}, savingThrows: [], skillLookup: {}, skills: [], isCustomized: false, hitPointInfo: Object.assign({}, baseCreature.hitPointInfo), initialTempHp: 0, useOwnerHp: false });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Creature/utils.js b/ddb_main/packages/rules-engine/es/engine/Creature/utils.js
new file mode 100644
index 0000000..797a2f9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Creature/utils.js
@@ -0,0 +1,174 @@
+import { orderBy } from 'lodash';
+import { HelperUtils } from '../Helper';
+import { InfusionAccessors } from '../Infusion';
+import { RuleDataUtils } from '../RuleData';
+import { getEnvironmentTags, getFlags, getGroupInfo, getInfusion, getMovements, getSavingThrows, getStats, getSubTypeTags, getSwarmInfo, getTags, getTypeId, getTypeTag, isSwarm, } from './accessors';
+import { CreatureGroupFlagEnum } from './constants';
+/**
+ *
+ * @param creature
+ * @param ruleData
+ * @param includeMultiParenthesis
+ */
+export function getTypeName(creature, ruleData, includeMultiParenthesis = true) {
+    const groupInfo = getGroupInfo(creature);
+    const typeId = getTypeId(creature);
+    let prefix = '';
+    let typeName = RuleDataUtils.getMonsterTypeName(typeId, ruleData);
+    if (!typeName) {
+        typeName = '';
+    }
+    if (isSwarm(creature)) {
+        const swarmInfo = getSwarmInfo(creature);
+        if (swarmInfo) {
+            const sizeInfo = RuleDataUtils.getCreatureSizeInfo(swarmInfo.sizeId, ruleData);
+            typeName = RuleDataUtils.getMonsterTypeName(swarmInfo.typeId, ruleData, undefined, true);
+            if (!typeName) {
+                typeName = '';
+            }
+            if (sizeInfo) {
+                prefix = `swarm of ${sizeInfo.name} `;
+            }
+        }
+    }
+    if (groupInfo && groupInfo.monsterTypes !== null && groupInfo.monsterTypes.length) {
+        if (groupInfo.monsterTypes.includes(typeId)) {
+            typeName = RuleDataUtils.getMonsterTypeName(typeId, ruleData, undefined, isSwarm(creature));
+            if (!typeName) {
+                typeName = '';
+            }
+        }
+        else {
+            let displayName = '';
+            groupInfo.monsterTypes.forEach((monsterTypeId, idx) => {
+                const parts = [];
+                if (idx !== 0) {
+                    parts.push(', ');
+                }
+                if (groupInfo && groupInfo.monsterTypes !== null && idx === groupInfo.monsterTypes.length - 1) {
+                    parts.push('or ');
+                }
+                const monsterTypeName = RuleDataUtils.getMonsterTypeName(monsterTypeId, ruleData, undefined, isSwarm(creature));
+                if (monsterTypeName) {
+                    parts.push(monsterTypeName);
+                }
+                displayName += parts.join('');
+            });
+            if (includeMultiParenthesis) {
+                typeName = `(${displayName})`;
+            }
+            else {
+                typeName = displayName;
+            }
+        }
+    }
+    return `${prefix}${typeName}`.trim();
+}
+/**
+ *
+ * @param creature
+ */
+export function getHighestMovementInfo(creature) {
+    return HelperUtils.getLast(getMovements(creature), 'speed');
+}
+/**
+ *
+ * @param creature
+ */
+export function getSearchTags(creature) {
+    const tags = [...getEnvironmentTags(creature), ...getTags(creature), ...getSubTypeTags(creature)];
+    const typeTag = getTypeTag(creature);
+    if (typeTag) {
+        tags.push(typeTag);
+    }
+    return tags;
+}
+/**
+ *
+ * @param creature
+ * @param flag
+ */
+export function hasGroupFlag(creature, flag) {
+    return getFlags(creature).includes(flag);
+}
+/**
+ *
+ * @param creature
+ * @param stat
+ */
+export function shouldReplaceWithOwnerStat(creature, stat) {
+    var _a, _b;
+    const groupInfo = getGroupInfo(creature);
+    return (_b = (_a = groupInfo === null || groupInfo === void 0 ? void 0 : groupInfo.ownerStats) === null || _a === void 0 ? void 0 : _a.includes(stat)) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param creature
+ * @param inventoryLookup
+ */
+export function getInfusionItem(creature, inventoryLookup) {
+    const infusion = getInfusion(creature);
+    if (infusion) {
+        return HelperUtils.lookupDataOrFallback(inventoryLookup, InfusionAccessors.getInventoryMappingId(infusion));
+    }
+    return null;
+}
+/**
+ *
+ * @param creature
+ * @param statId
+ */
+export function getStatInfo(creature, statId) {
+    return HelperUtils.lookupDataOrFallback(creature.statLookup, statId);
+}
+/**
+ *
+ * @param creature
+ * @param skillId
+ */
+export function getSkill(creature, skillId) {
+    return HelperUtils.lookupDataOrFallback(creature.skillLookup, skillId);
+}
+/**
+ *
+ * @param flagKey
+ * @param creature
+ */
+export function hasFlag(flagKey, creature) {
+    const groupInfo = getGroupInfo(creature);
+    if (groupInfo !== null) {
+        return Boolean(HelperUtils.lookupDataOrFallback(groupInfo.flagInfoLookup, flagKey));
+    }
+    return false;
+}
+/**
+ *
+ * @param creature
+ */
+export function canUseLairActions(creature) {
+    return !hasFlag(CreatureGroupFlagEnum.CANNOT_USE_LAIR_ACTIONS, creature);
+}
+/**
+ *
+ * @param creature
+ */
+export function canUseLegendaryActions(creature) {
+    return !hasFlag(CreatureGroupFlagEnum.CANNOT_USE_LEGENDARY_ACTIONS, creature);
+}
+export function getAbilities(creature) {
+    const stats = getStats(creature);
+    const savingThrows = getSavingThrows(creature);
+    const abilities = stats.map((stat) => {
+        var _a, _b;
+        const { id, modifier, score, statKey } = stat;
+        const saveModifier = (_b = (_a = savingThrows.find((save) => save.statId === id)) === null || _a === void 0 ? void 0 : _a.modifier) !== null && _b !== void 0 ? _b : modifier;
+        return {
+            id,
+            modifier: modifier !== null && modifier !== void 0 ? modifier : 0,
+            score: score !== null && score !== void 0 ? score : 0,
+            statKey: statKey !== null && statKey !== void 0 ? statKey : '',
+            saveModifier: saveModifier !== null && saveModifier !== void 0 ? saveModifier : 0,
+        };
+    });
+    return orderBy(abilities, 'id');
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/CreatureRule/accessors.js b/ddb_main/packages/rules-engine/es/engine/CreatureRule/accessors.js
new file mode 100644
index 0000000..0ba7ac8
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/CreatureRule/accessors.js
@@ -0,0 +1,80 @@
+/**
+ *
+ * @param rule
+ */
+export function getCreatureGroupId(rule) {
+    return rule.creatureGroupId;
+}
+/**
+ *
+ * @param rule
+ */
+export function getLevelDivisor(rule) {
+    return rule.levelDivisor;
+}
+/**
+ *
+ * @param rule
+ */
+export function getMaxChallengeRatingId(rule) {
+    return rule.maxChallengeRatingId;
+}
+/**
+ *
+ * @param rule
+ */
+export function getMonsterIds(rule) {
+    var _a;
+    return (_a = rule.monsterIds) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param rule
+ */
+export function getMonsterTypeId(rule) {
+    return rule.monsterTypeId;
+}
+/**
+ *
+ * @param rule
+ */
+export function getMovementIds(rule) {
+    var _a;
+    return (_a = rule.movementIds) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param rule
+ */
+export function getSizeIds(rule) {
+    var _a;
+    return (_a = rule.sizeIds) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param rule
+ */
+export function getContextLevelChallengeMax(rule) {
+    return rule.contextLevelChallengeMax;
+}
+/**
+ *
+ * @param rule
+ */
+export function getMaxChallengeInfo(rule) {
+    return rule.maxChallengeInfo;
+}
+/**
+ *
+ * @param rule
+ */
+export function getMaxChallengeValue(rule) {
+    return rule.maxChallengeValue;
+}
+/**
+ *
+ * @param rule
+ */
+export function getDataOrigin(rule) {
+    return rule.dataOrigin;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/CreatureRule/derivers.js b/ddb_main/packages/rules-engine/es/engine/CreatureRule/derivers.js
new file mode 100644
index 0000000..fee451c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/CreatureRule/derivers.js
@@ -0,0 +1,21 @@
+import { ClassAccessors } from '../Class';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { getLevelDivisor } from './accessors';
+export function deriveContextLevelChallengeMax(rule, dataOrigin, xpInfo) {
+    if (!getLevelDivisor(rule)) {
+        return null;
+    }
+    let levelDivisor = getLevelDivisor(rule);
+    if (levelDivisor === null) {
+        levelDivisor = 1;
+    }
+    if (dataOrigin) {
+        switch (dataOrigin.type) {
+            case DataOriginTypeEnum.CLASS_FEATURE:
+                return Math.floor(ClassAccessors.getLevel(dataOrigin.parent) / levelDivisor);
+            default:
+            // not implemented
+        }
+    }
+    return Math.floor(xpInfo.currentLevel / levelDivisor);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/CreatureRule/generators.js b/ddb_main/packages/rules-engine/es/engine/CreatureRule/generators.js
new file mode 100644
index 0000000..4093f6e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/CreatureRule/generators.js
@@ -0,0 +1,115 @@
+import { intersection, union, groupBy } from 'lodash';
+import { DataOriginGenerators, DataOriginTypeEnum } from '../DataOrigin';
+import { RuleDataUtils } from '../RuleData';
+import { getContextLevelChallengeMax, getCreatureGroupId, getMaxChallengeRatingId, getMaxChallengeValue, getMonsterTypeId, getMovementIds, getSizeIds, } from './accessors';
+import { deriveContextLevelChallengeMax } from './derivers';
+/**
+ *
+ * @param rule
+ * @param dataOrigin
+ * @param xpInfo
+ * @param ruleData
+ */
+export function generateRule(rule, dataOrigin, xpInfo, ruleData) {
+    const maxChallengeRatingId = getMaxChallengeRatingId(rule);
+    let maxChallengeInfo = null;
+    if (maxChallengeRatingId) {
+        maxChallengeInfo = RuleDataUtils.getChallengeInfo(maxChallengeRatingId, ruleData);
+    }
+    const contextLevelChallengeMax = deriveContextLevelChallengeMax(rule, dataOrigin, xpInfo);
+    let maxChallengeValue = null;
+    const possibleMaxes = [];
+    if (maxChallengeInfo !== null) {
+        possibleMaxes.push(maxChallengeInfo.value);
+    }
+    if (contextLevelChallengeMax != null) {
+        possibleMaxes.push(contextLevelChallengeMax);
+    }
+    if (possibleMaxes.length) {
+        maxChallengeValue = Math.max(...possibleMaxes);
+    }
+    const ruleInfo = Object.assign(Object.assign({}, rule), { maxChallengeInfo,
+        contextLevelChallengeMax,
+        maxChallengeValue });
+    return Object.assign(Object.assign({}, ruleInfo), { dataOrigin });
+}
+/**
+ *
+ * @param rules
+ */
+export function generateConsolidatedSingleTypeRule(rules) {
+    if (rules.length === 1) {
+        return rules[0];
+    }
+    const movementIdsGroups = [];
+    const sizeIdsGroups = [];
+    const maxChallengeValues = [];
+    const contextLevelChallengeMaxValues = [];
+    rules.forEach((rule) => {
+        movementIdsGroups.push(getMovementIds(rule));
+        sizeIdsGroups.push(getSizeIds(rule));
+        const maxChallengeValue = getMaxChallengeValue(rule);
+        if (maxChallengeValue !== null) {
+            maxChallengeValues.push(maxChallengeValue);
+        }
+        const contextLevelChallengeMax = getContextLevelChallengeMax(rule);
+        if (contextLevelChallengeMax !== null) {
+            contextLevelChallengeMaxValues.push(contextLevelChallengeMax);
+        }
+    });
+    const consolidatedRule = {
+        contextLevelChallengeMax: contextLevelChallengeMaxValues.length
+            ? Math.max(...contextLevelChallengeMaxValues)
+            : null,
+        creatureGroupId: getCreatureGroupId(rules[0]),
+        levelDivisor: null,
+        maxChallengeRatingId: null,
+        maxChallengeInfo: null,
+        monsterIds: [],
+        monsterTypeId: getMonsterTypeId(rules[0]),
+        movementIds: intersection(...movementIdsGroups),
+        sizeIds: union(...sizeIdsGroups),
+        maxChallengeValue: maxChallengeValues.length ? Math.max(...maxChallengeValues) : null,
+    };
+    return Object.assign({ dataOrigin: DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.SIMULATED) }, consolidatedRule);
+}
+/**
+ *
+ * @param rules
+ */
+export function consolidateRules(rules) {
+    const consolidatedRules = [];
+    const rulesByGroup = groupBy(rules, (rule) => getCreatureGroupId(rule));
+    Object.keys(rulesByGroup).forEach((groupId) => {
+        const groupRules = rulesByGroup[groupId];
+        const rulesByTypes = groupBy(groupRules, (rule) => getMonsterTypeId(rule));
+        Object.keys(rulesByTypes).forEach((typeId) => {
+            const rules = rulesByTypes[typeId];
+            // null is cast to string when it groups by null
+            if (typeId === 'null') {
+                consolidatedRules.push(...rules);
+            }
+            else {
+                consolidatedRules.push(generateConsolidatedSingleTypeRule(rules));
+            }
+        });
+    });
+    return consolidatedRules;
+}
+/**
+ *
+ * @param classRules
+ * @param raceRules
+ * @param featRules
+ */
+export function generateCreatureRules(classRules, raceRules, featRules) {
+    const allRules = [...classRules, ...raceRules, ...featRules];
+    return consolidateRules(allRules);
+}
+/**
+ *
+ * @param creatureRules
+ */
+export function generateCreatureGroupRulesLookup(creatureRules) {
+    return groupBy(creatureRules, (rule) => getCreatureGroupId(rule));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/CreatureRule/index.js b/ddb_main/packages/rules-engine/es/engine/CreatureRule/index.js
new file mode 100644
index 0000000..d3ebbbd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/CreatureRule/index.js
@@ -0,0 +1,8 @@
+import * as CreatureRuleAccessors from './accessors';
+import * as CreatureRuleDerivers from './derivers';
+import * as CreatureRuleGenerators from './generators';
+import * as CreatureRuleTypings from './typings';
+import * as CreatureRuleUtils from './utils';
+export * from './typings';
+export { CreatureRuleAccessors, CreatureRuleDerivers, CreatureRuleGenerators, CreatureRuleUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, CreatureRuleAccessors), CreatureRuleDerivers), CreatureRuleGenerators), CreatureRuleTypings), CreatureRuleUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/CreatureRule/utils.js b/ddb_main/packages/rules-engine/es/engine/CreatureRule/utils.js
new file mode 100644
index 0000000..6090018
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/CreatureRule/utils.js
@@ -0,0 +1,35 @@
+import { intersection } from 'lodash';
+import { CreatureAccessors } from '../Creature';
+import { getCreatureGroupId, getMaxChallengeValue, getMonsterIds, getMonsterTypeId, getMovementIds, getSizeIds, } from './accessors';
+export function isRuleGroup(rule, groupId) {
+    return getCreatureGroupId(rule) === groupId;
+}
+export function isValidCreature(creature, rule) {
+    const challengeInfo = CreatureAccessors.getChallengeInfo(creature);
+    // max challenge rating
+    const maxChallengeValue = getMaxChallengeValue(rule);
+    if (maxChallengeValue !== null && challengeInfo !== null && challengeInfo.value > maxChallengeValue) {
+        return false;
+    }
+    // specific monster id
+    const monsterIds = getMonsterIds(rule);
+    if (monsterIds.length && !monsterIds.includes(CreatureAccessors.getId(creature))) {
+        return false;
+    }
+    // monster type
+    if (getMonsterTypeId(rule) !== null && CreatureAccessors.getTypeId(creature) !== getMonsterTypeId(rule)) {
+        return false;
+    }
+    // size
+    const sizeIds = getSizeIds(rule);
+    if (sizeIds.length && !sizeIds.includes(CreatureAccessors.getSizeId(creature))) {
+        return false;
+    }
+    // excluded movements
+    const excludedMovementIds = getMovementIds(rule);
+    if (excludedMovementIds.length &&
+        intersection(CreatureAccessors.getMovementIds(creature), excludedMovementIds).length) {
+        return false;
+    }
+    return true;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/DataOrigin/constants.js b/ddb_main/packages/rules-engine/es/engine/DataOrigin/constants.js
new file mode 100644
index 0000000..cc843f6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/DataOrigin/constants.js
@@ -0,0 +1,22 @@
+export var DataOriginTypeEnum;
+(function (DataOriginTypeEnum) {
+    DataOriginTypeEnum["RACE"] = "race";
+    DataOriginTypeEnum["CLASS"] = "class";
+    DataOriginTypeEnum["CLASS_FEATURE"] = "class-feature";
+    DataOriginTypeEnum["CONDITION"] = "condition";
+    DataOriginTypeEnum["BACKGROUND"] = "background";
+    DataOriginTypeEnum["FEAT"] = "feat";
+    DataOriginTypeEnum["ITEM"] = "item";
+    DataOriginTypeEnum["RULE_DATA"] = "rule-data";
+    DataOriginTypeEnum["CUSTOM"] = "custom";
+    DataOriginTypeEnum["SIMULATED"] = "simulated";
+    DataOriginTypeEnum["ADHOC"] = "adhoc";
+    DataOriginTypeEnum["VEHICLE"] = "vehicle";
+    DataOriginTypeEnum["FEAT_LIST"] = "feat-list";
+    DataOriginTypeEnum["UNKNOWN"] = "unknown";
+})(DataOriginTypeEnum || (DataOriginTypeEnum = {}));
+export var DataOriginDataInfoKeyEnum;
+(function (DataOriginDataInfoKeyEnum) {
+    DataOriginDataInfoKeyEnum["PRIMARY"] = "primary";
+    DataOriginDataInfoKeyEnum["PARENT"] = "parent";
+})(DataOriginDataInfoKeyEnum || (DataOriginDataInfoKeyEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/DataOrigin/generators.js b/ddb_main/packages/rules-engine/es/engine/DataOrigin/generators.js
new file mode 100644
index 0000000..f18bd13
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/DataOrigin/generators.js
@@ -0,0 +1,65 @@
+import { DataOriginTypeEnum } from './constants';
+/**
+ *
+ * @param dataOriginId
+ * @param dataOriginTypeId
+ */
+export function generateDataOriginKey(dataOriginId, dataOriginTypeId) {
+    return `${dataOriginId}-${dataOriginTypeId}`;
+}
+/**
+ *
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ */
+export function generateDataOrigin(dataOriginType, primary = null, parent = null, parentDataOriginType = null) {
+    return {
+        type: dataOriginType,
+        primary,
+        parent,
+        parentType: parentDataOriginType,
+    };
+}
+/**
+ * This is v2 of dataOrigin concept where the data origin is just a reference that is eventually
+ * pieced together in the UI at runtime and not duplicated in parent/child relationship
+ *
+ * @param type
+ * @param key
+ */
+export function generateDataOriginRef(type, key) {
+    return {
+        type,
+        key,
+    };
+}
+/**
+ *
+ * @param backgroundData
+ * @param classData
+ * @param classFeatureData
+ * @param conditionData
+ * @param featData
+ * @param itemData
+ * @param raceData
+ * @param vehicleData
+ */
+export function generateDataOriginRefData(backgroundData, classData, classFeatureData, conditionData, featData, itemData, raceData, vehicleData, featListData) {
+    return {
+        [DataOriginTypeEnum.ADHOC]: {},
+        [DataOriginTypeEnum.BACKGROUND]: backgroundData,
+        [DataOriginTypeEnum.CLASS]: classData,
+        [DataOriginTypeEnum.CLASS_FEATURE]: classFeatureData,
+        [DataOriginTypeEnum.CONDITION]: conditionData,
+        [DataOriginTypeEnum.CUSTOM]: {},
+        [DataOriginTypeEnum.FEAT]: featData,
+        [DataOriginTypeEnum.ITEM]: itemData,
+        [DataOriginTypeEnum.RACE]: raceData,
+        [DataOriginTypeEnum.RULE_DATA]: {},
+        [DataOriginTypeEnum.SIMULATED]: {},
+        [DataOriginTypeEnum.UNKNOWN]: {},
+        [DataOriginTypeEnum.VEHICLE]: vehicleData,
+        [DataOriginTypeEnum.FEAT_LIST]: featListData,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/DataOrigin/index.js b/ddb_main/packages/rules-engine/es/engine/DataOrigin/index.js
new file mode 100644
index 0000000..ae19933
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/DataOrigin/index.js
@@ -0,0 +1,8 @@
+import * as DataOriginConstants from './constants';
+import * as DataOriginGenerators from './generators';
+import * as DataOriginTypings from './typings';
+import * as DataOriginUtils from './utils';
+export * from './constants';
+export * from './typings';
+export { DataOriginGenerators, DataOriginUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign({}, DataOriginConstants), DataOriginGenerators), DataOriginTypings), DataOriginUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/DataOrigin/utils.js b/ddb_main/packages/rules-engine/es/engine/DataOrigin/utils.js
new file mode 100644
index 0000000..0270909
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/DataOrigin/utils.js
@@ -0,0 +1,19 @@
+import { DataOriginDataInfoKeyEnum } from './constants';
+/**
+ *
+ * @param ref
+ * @param data
+ */
+export function getRefPrimary(ref, data) {
+    var _a, _b, _c;
+    return (_c = (_b = (_a = data === null || data === void 0 ? void 0 : data[ref.type]) === null || _a === void 0 ? void 0 : _a[ref.key]) === null || _b === void 0 ? void 0 : _b[DataOriginDataInfoKeyEnum.PRIMARY]) !== null && _c !== void 0 ? _c : null;
+}
+/**
+ *
+ * @param ref
+ * @param data
+ */
+export function getRefParent(ref, data) {
+    var _a, _b, _c;
+    return (_c = (_b = (_a = data === null || data === void 0 ? void 0 : data[ref.type]) === null || _a === void 0 ? void 0 : _a[ref.key]) === null || _b === void 0 ? void 0 : _b[DataOriginDataInfoKeyEnum.PARENT]) !== null && _c !== void 0 ? _c : null;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Decoration/accessors.js b/ddb_main/packages/rules-engine/es/engine/Decoration/accessors.js
new file mode 100644
index 0000000..ffb70d9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Decoration/accessors.js
@@ -0,0 +1,133 @@
+/**
+ *
+ * @param decorationContract
+ */
+export function getBackdropAvatarId(decorationContract) {
+    return decorationContract.backdropAvatarId;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getBackdropAvatarUrl(decorationContract) {
+    return decorationContract.backdropAvatarUrl;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getLargeBackdropAvatarId(decorationContract) {
+    return decorationContract.largeBackdropAvatarId;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getLargeBackdropAvatarUrl(decorationContract) {
+    return decorationContract.largeBackdropAvatarUrl;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getSmallBackdropAvatarId(decorationContract) {
+    return decorationContract.smallBackdropAvatarId;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getSmallBackdropAvatarUrl(decorationContract) {
+    return decorationContract.smallBackdropAvatarUrl;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getThumbnailBackdropAvatarId(decorationContract) {
+    return decorationContract.thumbnailBackdropAvatarId;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getThumbnailBackdropAvatarUrl(decorationContract) {
+    return decorationContract.thumbnailBackdropAvatarUrl;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getDefaultBackdrop(decorationContract) {
+    return decorationContract.defaultBackdrop;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getAvatarUrl(decorationContract) {
+    return decorationContract.avatarUrl;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getFrameAvatarUrl(decorationContract) {
+    return decorationContract.frameAvatarUrl;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getAvatarId(decorationContract) {
+    return decorationContract.avatarId;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getPortraitDecorationKey(decorationContract) {
+    return decorationContract.portraitDecorationKey;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getFrameAvatarDecorationKey(decorationContract) {
+    return decorationContract.frameAvatarDecorationKey;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getFrameAvatarId(decorationContract) {
+    return decorationContract.frameAvatarId;
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function getThemeColor(decorationContract) {
+    return decorationContract.themeColor;
+}
+/**
+ *
+ * @param decorationInfo
+ */
+export function getAvatarInfo(decorationInfo) {
+    return decorationInfo.avatarInfo;
+}
+/**
+ *
+ * @param decorationInfo
+ */
+export function getCharacterTheme(decorationInfo) {
+    return decorationInfo.characterTheme;
+}
+/**
+ *
+ * @param decorationInfo
+ */
+export function getBackdropInfo(decorationInfo) {
+    return decorationInfo.backdropInfo;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Decoration/generators.js b/ddb_main/packages/rules-engine/es/engine/Decoration/generators.js
new file mode 100644
index 0000000..92a02ce
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Decoration/generators.js
@@ -0,0 +1,91 @@
+import { CharacterColorEnum } from '../Core';
+import { HelperUtils } from '../Helper';
+import { getAvatarId, getAvatarUrl, getBackdropAvatarId, getBackdropAvatarUrl, getDefaultBackdrop, getFrameAvatarDecorationKey, getFrameAvatarId, getFrameAvatarUrl, getLargeBackdropAvatarId, getLargeBackdropAvatarUrl, getPortraitDecorationKey, getSmallBackdropAvatarId, getSmallBackdropAvatarUrl, getThemeColor, getThumbnailBackdropAvatarId, getThumbnailBackdropAvatarUrl, } from './accessors';
+/**
+ *
+ * @param decorationContract
+ * @param characterPreferences
+ */
+export function generateDecorationInfo(decorationContract, characterPreferences) {
+    return {
+        avatarInfo: generateAvatarInfo(decorationContract),
+        backdropInfo: generateBackdropInfo(decorationContract),
+        characterTheme: generateCharacterTheme(decorationContract ? getThemeColor(decorationContract) : null, characterPreferences),
+    };
+}
+/**
+ *
+ * @param decorationContract
+ */
+export function generateAvatarInfo(decorationContract) {
+    const frameId = decorationContract ? getFrameAvatarId(decorationContract) : null;
+    return {
+        avatarId: decorationContract ? getAvatarId(decorationContract) : null,
+        avatarUrl: decorationContract ? getAvatarUrl(decorationContract) : null,
+        portraitDecorationKey: decorationContract ? getPortraitDecorationKey(decorationContract) : null,
+        frameAvatarDecorationKey: decorationContract ? getFrameAvatarDecorationKey(decorationContract) : null,
+        frameId,
+        frameUrl: decorationContract ? getFrameAvatarUrl(decorationContract) : null,
+    };
+}
+/**
+ *
+ * @param themeColorContract
+ * @param characterPreferences
+ */
+export function generateCharacterTheme(themeColorContract, characterPreferences) {
+    var _a, _b, _c, _d;
+    //Dark Mode Preference
+    const isDarkMode = (_a = characterPreferences === null || characterPreferences === void 0 ? void 0 : characterPreferences.enableDarkMode) !== null && _a !== void 0 ? _a : false;
+    return {
+        name: (_b = themeColorContract === null || themeColorContract === void 0 ? void 0 : themeColorContract.name) !== null && _b !== void 0 ? _b : 'DDB Red',
+        backgroundColor: isDarkMode ? CharacterColorEnum.DARKMODE_TRANSPARENT : CharacterColorEnum.OFF_WHITE,
+        isDefault: themeColorContract === null,
+        themeColor: (_c = themeColorContract === null || themeColorContract === void 0 ? void 0 : themeColorContract.themeColor) !== null && _c !== void 0 ? _c : CharacterColorEnum.RED,
+        themeColorId: (_d = themeColorContract === null || themeColorContract === void 0 ? void 0 : themeColorContract.themeColorId) !== null && _d !== void 0 ? _d : null,
+        isDarkMode,
+    };
+}
+/**
+ *
+ * TODO DECO clean me up please
+ * @param decorationContract
+ */
+export function generateBackdropInfo(decorationContract) {
+    if (decorationContract === null) {
+        return {
+            backdropAvatarId: null,
+            backdropAvatarUrl: null,
+            largeBackdropAvatarId: null,
+            largeBackdropAvatarUrl: null,
+            smallBackdropAvatarId: null,
+            smallBackdropAvatarUrl: null,
+            thumbnailBackdropAvatarId: null,
+            thumbnailBackdropAvatarUrl: null,
+        };
+    }
+    const defaultBackdrop = getDefaultBackdrop(decorationContract);
+    const backdropAvatarId = getBackdropAvatarId(decorationContract);
+    if (backdropAvatarId === null) {
+        return {
+            backdropAvatarId,
+            backdropAvatarUrl: HelperUtils.lookupDataOrFallback(defaultBackdrop, 'backdropAvatarUrl'),
+            largeBackdropAvatarId: null,
+            largeBackdropAvatarUrl: HelperUtils.lookupDataOrFallback(defaultBackdrop, 'largeBackdropAvatarUrl'),
+            smallBackdropAvatarId: null,
+            smallBackdropAvatarUrl: HelperUtils.lookupDataOrFallback(defaultBackdrop, 'smallBackdropAvatarUrl'),
+            thumbnailBackdropAvatarId: null,
+            thumbnailBackdropAvatarUrl: HelperUtils.lookupDataOrFallback(defaultBackdrop, 'thumbnailBackdropAvatarUrl'),
+        };
+    }
+    return {
+        backdropAvatarId,
+        backdropAvatarUrl: getBackdropAvatarUrl(decorationContract),
+        largeBackdropAvatarId: getLargeBackdropAvatarId(decorationContract),
+        largeBackdropAvatarUrl: getLargeBackdropAvatarUrl(decorationContract),
+        smallBackdropAvatarId: getSmallBackdropAvatarId(decorationContract),
+        smallBackdropAvatarUrl: getSmallBackdropAvatarUrl(decorationContract),
+        thumbnailBackdropAvatarId: getThumbnailBackdropAvatarId(decorationContract),
+        thumbnailBackdropAvatarUrl: getThumbnailBackdropAvatarUrl(decorationContract),
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Decoration/index.js b/ddb_main/packages/rules-engine/es/engine/Decoration/index.js
new file mode 100644
index 0000000..84d6506
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Decoration/index.js
@@ -0,0 +1,7 @@
+import * as DecorationAccessors from './accessors';
+import * as DecorationGenerators from './generators';
+import * as DecorationTypings from './typings';
+import * as DecorationUtils from './utils';
+export * from './typings';
+export { DecorationAccessors, DecorationGenerators, DecorationUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign({}, DecorationAccessors), DecorationGenerators), DecorationTypings), DecorationUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Decoration/utils.js b/ddb_main/packages/rules-engine/es/engine/Decoration/utils.js
new file mode 100644
index 0000000..5d29289
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Decoration/utils.js
@@ -0,0 +1,15 @@
+import { getCharacterTheme } from './accessors';
+/**
+ *
+ * @param decorationInfo
+ */
+export function isDarkMode(decorationInfo) {
+    return getCharacterTheme(decorationInfo).isDarkMode;
+}
+/**
+ *
+ * @param decorationInfo
+ */
+export function isDefaultTheme(decorationInfo) {
+    return getCharacterTheme(decorationInfo).isDefault;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Definition/accessors.js b/ddb_main/packages/rules-engine/es/engine/Definition/accessors.js
new file mode 100644
index 0000000..11ad409
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Definition/accessors.js
@@ -0,0 +1,8 @@
+/**
+ *
+ * @param definition
+ */
+export function getDefinitionKey(definition) {
+    var _a;
+    return (_a = definition.definitionKey) !== null && _a !== void 0 ? _a : '';
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Definition/constants.js b/ddb_main/packages/rules-engine/es/engine/Definition/constants.js
new file mode 100644
index 0000000..4a971c7
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Definition/constants.js
@@ -0,0 +1,8 @@
+export const DEFINITION_KEY_SEPARATOR = ':';
+export var DefinitionTypeEnum;
+(function (DefinitionTypeEnum) {
+    DefinitionTypeEnum["VEHICLE"] = "vehicle";
+    DefinitionTypeEnum["INFUSION"] = "infusion";
+    DefinitionTypeEnum["CLASS_FEATURE"] = "class-feature";
+    DefinitionTypeEnum["RACIAL_TRAIT"] = "racial-trait";
+})(DefinitionTypeEnum || (DefinitionTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Definition/generators.js b/ddb_main/packages/rules-engine/es/engine/Definition/generators.js
new file mode 100644
index 0000000..a542008
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Definition/generators.js
@@ -0,0 +1,9 @@
+import { DEFINITION_KEY_SEPARATOR } from './constants';
+/**
+ *
+ * @param type
+ * @param id
+ */
+export function generateDefinitionKey(type, id) {
+    return `${type}${DEFINITION_KEY_SEPARATOR}${id}`;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Definition/hacks.js b/ddb_main/packages/rules-engine/es/engine/Definition/hacks.js
new file mode 100644
index 0000000..5891b2d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Definition/hacks.js
@@ -0,0 +1,25 @@
+import { HelperUtils } from '../Helper';
+import { DEFINITION_KEY_SEPARATOR } from './constants';
+import { getDefinitionKeyId, getDefinitionKeyType } from './utils';
+/**
+ *
+ * @param type
+ * @param id
+ */
+export function hack__generateDefinitionKey(type, id) {
+    return `${type}${DEFINITION_KEY_SEPARATOR}${id}`;
+}
+/**
+ *
+ * @param definitionKey
+ */
+export function hack__getDefinitionKeyId(definitionKey) {
+    return HelperUtils.parseInputInt(getDefinitionKeyId(definitionKey));
+}
+/**
+ *
+ * @param definitionKey
+ */
+export function hack__getDefinitionKeyType(definitionKey) {
+    return HelperUtils.parseInputInt(getDefinitionKeyType(definitionKey));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Definition/index.js b/ddb_main/packages/rules-engine/es/engine/Definition/index.js
new file mode 100644
index 0000000..6fb8c05
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Definition/index.js
@@ -0,0 +1,10 @@
+import * as DefinitionAccessors from './accessors';
+import * as DefinitionConstants from './constants';
+import * as DefinitionGenerators from './generators';
+import * as DefinitionHacks from './hacks';
+import * as DefinitionTypings from './typings';
+import * as DefinitionUtils from './utils';
+export * from './constants';
+export * from './typings';
+export { DefinitionAccessors, DefinitionGenerators, DefinitionHacks, DefinitionUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, DefinitionAccessors), DefinitionConstants), DefinitionGenerators), DefinitionHacks), DefinitionTypings), DefinitionUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Definition/utils.js b/ddb_main/packages/rules-engine/es/engine/Definition/utils.js
new file mode 100644
index 0000000..799d0ee
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Definition/utils.js
@@ -0,0 +1,15 @@
+import { DEFINITION_KEY_SEPARATOR } from './constants';
+/**
+ *
+ * @param definitionKey
+ */
+export function getDefinitionKeyType(definitionKey) {
+    return definitionKey.split(DEFINITION_KEY_SEPARATOR)[0];
+}
+/**
+ *
+ * @param definitionKey
+ */
+export function getDefinitionKeyId(definitionKey) {
+    return definitionKey.split(DEFINITION_KEY_SEPARATOR)[1];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/DefinitionPool/constants.js b/ddb_main/packages/rules-engine/es/engine/DefinitionPool/constants.js
new file mode 100644
index 0000000..e7b6335
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/DefinitionPool/constants.js
@@ -0,0 +1,5 @@
+export var DefinitionPoolTypeInfoKeyEnum;
+(function (DefinitionPoolTypeInfoKeyEnum) {
+    DefinitionPoolTypeInfoKeyEnum["DEFINITION_LOOKUP"] = "definitionLookup";
+    DefinitionPoolTypeInfoKeyEnum["ACCESS_TYPE_LOOKUP"] = "accessTypeLookup";
+})(DefinitionPoolTypeInfoKeyEnum || (DefinitionPoolTypeInfoKeyEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/DefinitionPool/generators.js b/ddb_main/packages/rules-engine/es/engine/DefinitionPool/generators.js
new file mode 100644
index 0000000..1aa6d3c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/DefinitionPool/generators.js
@@ -0,0 +1,16 @@
+import { keyBy } from 'lodash';
+import { DefinitionAccessors, DefinitionUtils } from '../Definition';
+/**
+ *
+ * @param definition
+ */
+export function generatePoolDefinitionType(definition) {
+    return DefinitionUtils.getDefinitionKeyType(DefinitionAccessors.getDefinitionKey(definition));
+}
+/**
+ *
+ * @param definitions
+ */
+export function generatePoolDefinitionItems(definitions) {
+    return keyBy(definitions, (definition) => DefinitionUtils.getDefinitionKeyId(DefinitionAccessors.getDefinitionKey(definition)));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/DefinitionPool/index.js b/ddb_main/packages/rules-engine/es/engine/DefinitionPool/index.js
new file mode 100644
index 0000000..b5990fa
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/DefinitionPool/index.js
@@ -0,0 +1,9 @@
+import * as DefinitionPoolConstants from './constants';
+import * as DefinitionPoolGenerators from './generators';
+import * as DefinitionPoolSimulators from './simulators';
+import * as DefinitionPoolTypings from './typings';
+import * as DefinitionPoolUtils from './utils';
+export * from './typings';
+export * from './constants';
+export { DefinitionPoolGenerators, DefinitionPoolSimulators, DefinitionPoolUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, DefinitionPoolConstants), DefinitionPoolGenerators), DefinitionPoolSimulators), DefinitionPoolTypings), DefinitionPoolUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/DefinitionPool/simulators.js b/ddb_main/packages/rules-engine/es/engine/DefinitionPool/simulators.js
new file mode 100644
index 0000000..0c3df7e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/DefinitionPool/simulators.js
@@ -0,0 +1,14 @@
+import { DefinitionUtils } from '../Definition';
+/**
+ *
+ * @param definitions
+ * @param accessType
+ */
+export function simulateAccessTypeLookup(definitions, accessType) {
+    return definitions.reduce((acc, definition) => {
+        if (definition.definitionKey) {
+            acc[DefinitionUtils.getDefinitionKeyId(definition.definitionKey)] = accessType;
+        }
+        return acc;
+    }, {});
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/DefinitionPool/utils.js b/ddb_main/packages/rules-engine/es/engine/DefinitionPool/utils.js
new file mode 100644
index 0000000..fbc1b02
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/DefinitionPool/utils.js
@@ -0,0 +1,132 @@
+import { values } from 'lodash';
+import { AccessTypeEnum, AccessUtils } from '../Access';
+import { DefinitionAccessors, DefinitionTypeEnum, DefinitionUtils } from '../Definition';
+import { DefinitionPoolTypeInfoKeyEnum } from './constants';
+/**
+ *
+ * @param type
+ * @param id
+ * @param definitionPool
+ */
+export function canAccessDefinition(type, id, definitionPool) {
+    const accessTypeLookup = getTypedDefinitionAccessTypeLookup(type, definitionPool);
+    if (accessTypeLookup && accessTypeLookup[id] && AccessUtils.isAccessible(accessTypeLookup[id])) {
+        return true;
+    }
+    return false;
+}
+/**
+ *
+ * @param type
+ * @param definitionPool
+ * @param includeNonAccessibleDefinition
+ */
+export function getTypedDefinitionList(type, definitionPool, includeNonAccessibleDefinition = false) {
+    const lookup = getTypedDefinitionLookup(type, definitionPool);
+    if (lookup) {
+        const definitions = values(lookup); // lodash values is giving typing conflicts
+        return definitions.filter((definition) => includeNonAccessibleDefinition ||
+            (!includeNonAccessibleDefinition &&
+                canAccessDefinition(DefinitionUtils.getDefinitionKeyType(DefinitionAccessors.getDefinitionKey(definition)), DefinitionUtils.getDefinitionKeyId(DefinitionAccessors.getDefinitionKey(definition)), definitionPool)));
+    }
+    return [];
+}
+/**
+ *
+ * @param type
+ * @param definitionPool
+ */
+export function getTypedDefinitionLookup(type, definitionPool) {
+    if (definitionPool[type]) {
+        return definitionPool[type][DefinitionPoolTypeInfoKeyEnum.DEFINITION_LOOKUP];
+    }
+    return null;
+}
+/**
+ *
+ * @param type
+ * @param definitionPool
+ */
+export function getTypedDefinitionAccessTypeLookup(type, definitionPool) {
+    if (definitionPool[type]) {
+        return definitionPool[type][DefinitionPoolTypeInfoKeyEnum.ACCESS_TYPE_LOOKUP];
+    }
+    return null;
+}
+/**
+ *
+ * @param definitionKey
+ * @param definitionPool
+ */
+export function getDefinitionAccessType(definitionKey, definitionPool) {
+    const type = DefinitionUtils.getDefinitionKeyType(definitionKey);
+    const typedDefinitionAccessLookup = getTypedDefinitionAccessTypeLookup(type, definitionPool);
+    const id = DefinitionUtils.getDefinitionKeyId(definitionKey);
+    if (typedDefinitionAccessLookup && typedDefinitionAccessLookup[id]) {
+        return typedDefinitionAccessLookup[id];
+    }
+    return AccessTypeEnum.NO_ACCESS;
+}
+/**
+ *
+ * @param definitionKey
+ * @param definitionPool
+ */
+export function getInfusionDefinition(definitionKey, definitionPool) {
+    const type = DefinitionTypeEnum.INFUSION;
+    const id = DefinitionUtils.getDefinitionKeyId(definitionKey);
+    const typedDefinitionLookup = getTypedDefinitionLookup(type, definitionPool);
+    if (typedDefinitionLookup && typedDefinitionLookup[id]) {
+        return typedDefinitionLookup[id];
+    }
+    return null;
+}
+/**
+ *
+ * @param definitionKey
+ * @param definitionPool
+ */
+export function getVehicleDefinition(definitionKey, definitionPool) {
+    const type = DefinitionTypeEnum.VEHICLE;
+    const id = DefinitionUtils.getDefinitionKeyId(definitionKey);
+    const typedDefinitionLookup = getTypedDefinitionLookup(type, definitionPool);
+    if (typedDefinitionLookup && typedDefinitionLookup[id]) {
+        return typedDefinitionLookup[id];
+    }
+    return null;
+}
+/**
+ *
+ * @param definitionPool
+ */
+export function getVehicleDefinitionList(definitionPool) {
+    return getTypedDefinitionList(DefinitionTypeEnum.VEHICLE, definitionPool);
+}
+/**
+ *
+ * @param definitionKey
+ * @param definitionPool
+ */
+export function getClassFeatureDefinition(definitionKey, definitionPool) {
+    const type = DefinitionTypeEnum.CLASS_FEATURE;
+    const id = DefinitionUtils.getDefinitionKeyId(definitionKey);
+    const typedDefinitionLookup = getTypedDefinitionLookup(type, definitionPool);
+    if (typedDefinitionLookup && typedDefinitionLookup[id]) {
+        return typedDefinitionLookup[id];
+    }
+    return null;
+}
+/**
+ *
+ * @param definitionKey
+ * @param definitionPool
+ */
+export function getRacialTraitDefinition(definitionKey, definitionPool) {
+    const type = DefinitionTypeEnum.RACIAL_TRAIT;
+    const id = DefinitionUtils.getDefinitionKeyId(definitionKey);
+    const typedDefinitionLookup = getTypedDefinitionLookup(type, definitionPool);
+    if (typedDefinitionLookup && typedDefinitionLookup[id]) {
+        return typedDefinitionLookup[id];
+    }
+    return null;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Dice/accessors.js b/ddb_main/packages/rules-engine/es/engine/Dice/accessors.js
new file mode 100644
index 0000000..0d3b089
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Dice/accessors.js
@@ -0,0 +1,35 @@
+/**
+ *
+ * @param die
+ */
+export function getCount(die) {
+    return die.diceCount;
+}
+/**
+ *
+ * @param die
+ */
+export function getMultiplier(die) {
+    return die.diceMultiplier;
+}
+/**
+ *
+ * @param die
+ */
+export function getString(die) {
+    return die.diceString;
+}
+/**
+ *
+ * @param die
+ */
+export function getValue(die) {
+    return die.diceValue;
+}
+/**
+ *
+ * @param die
+ */
+export function getFixedValue(die) {
+    return die.fixedValue;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Dice/constants.js b/ddb_main/packages/rules-engine/es/engine/Dice/constants.js
new file mode 100644
index 0000000..3af2f56
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Dice/constants.js
@@ -0,0 +1,21 @@
+export var DiceAdjustmentTypeEnum;
+(function (DiceAdjustmentTypeEnum) {
+    DiceAdjustmentTypeEnum["ADVANTAGE"] = "ADVANTAGE";
+    DiceAdjustmentTypeEnum["DISADVANTAGE"] = "DISADVANTAGE";
+    DiceAdjustmentTypeEnum["BONUS"] = "BONUS";
+})(DiceAdjustmentTypeEnum || (DiceAdjustmentTypeEnum = {}));
+export var UsableDiceAdjustmentTypeEnum;
+(function (UsableDiceAdjustmentTypeEnum) {
+    UsableDiceAdjustmentTypeEnum["NONE"] = "NONE";
+    UsableDiceAdjustmentTypeEnum["ADVANTAGE"] = "ADVANTAGE";
+    UsableDiceAdjustmentTypeEnum["DISADVANTAGE"] = "DISADVANTAGE";
+    UsableDiceAdjustmentTypeEnum["ADVANTAGE_DISADVANTAGE"] = "ADVANTAGE_DISADVANTAGE";
+})(UsableDiceAdjustmentTypeEnum || (UsableDiceAdjustmentTypeEnum = {}));
+export var DiceAdjustmentRollTypeEnum;
+(function (DiceAdjustmentRollTypeEnum) {
+    DiceAdjustmentRollTypeEnum["NONE"] = "NONE";
+    DiceAdjustmentRollTypeEnum["SAVE"] = "SAVE";
+    DiceAdjustmentRollTypeEnum["STAT_SAVE"] = "STAT_SAVE";
+    DiceAdjustmentRollTypeEnum["DEATH_SAVE"] = "DEATH_SAVE";
+    DiceAdjustmentRollTypeEnum["ABILITY_CHECK"] = "ABILITY_CHECK";
+})(DiceAdjustmentRollTypeEnum || (DiceAdjustmentRollTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Dice/derivers.js b/ddb_main/packages/rules-engine/es/engine/Dice/derivers.js
new file mode 100644
index 0000000..4eb6a9c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Dice/derivers.js
@@ -0,0 +1,76 @@
+import { DiceAdjustmentTypeEnum, UsableDiceAdjustmentTypeEnum } from './constants';
+/**
+ *
+ * @param advantageAdjustments
+ * @param disadvantageAdjustments
+ */
+export function deriveUsableDiceAdjustmentType(advantageAdjustments, disadvantageAdjustments) {
+    const advantageCount = advantageAdjustments.length;
+    const disadvantageCount = disadvantageAdjustments.length;
+    const hasAdvantage = advantageCount > 0;
+    const hasDisadvantage = disadvantageCount > 0;
+    if (hasAdvantage && !hasDisadvantage) {
+        return UsableDiceAdjustmentTypeEnum.ADVANTAGE;
+    }
+    if (!hasAdvantage && hasDisadvantage) {
+        return UsableDiceAdjustmentTypeEnum.DISADVANTAGE;
+    }
+    if (hasAdvantage && hasDisadvantage) {
+        const restrictedAdvantageCount = advantageAdjustments.filter((adjustment) => adjustment.restriction).length;
+        const restrictedDisadvantageCount = disadvantageAdjustments.filter((adjustment) => adjustment.restriction).length;
+        const fullAdvantageCount = advantageCount - restrictedAdvantageCount;
+        const fullDisadvantageCount = disadvantageCount - restrictedDisadvantageCount;
+        const hasFullAdvantage = fullAdvantageCount > 0;
+        const hasFullDisadvantage = fullDisadvantageCount > 0;
+        const hasRestrictedAdvantage = restrictedAdvantageCount > 0;
+        const hasRestrictedDisadvantage = restrictedDisadvantageCount > 0;
+        // Have both full types, means it always cancels and we dont care about restrictions
+        if (hasFullAdvantage && hasFullDisadvantage) {
+            return UsableDiceAdjustmentTypeEnum.NONE;
+        }
+        // Have either restricted advantage or disadvantage, you could possible use either, or none
+        if (hasRestrictedAdvantage || hasRestrictedDisadvantage) {
+            return UsableDiceAdjustmentTypeEnum.ADVANTAGE_DISADVANTAGE;
+        }
+    }
+    return UsableDiceAdjustmentTypeEnum.NONE;
+}
+/**
+ *
+ * @param levelScale
+ */
+export function deriveMartialArtsDamageDie(levelScale) {
+    // 2025 Update: Keeping this default from previous logic where we didn't have the levelScale.
+    let dice = {
+        diceCount: 1,
+        diceMultiplier: null,
+        diceString: '',
+        diceValue: 4,
+        fixedValue: null,
+    };
+    if (levelScale.dice) {
+        dice = levelScale.dice;
+    }
+    return dice;
+}
+/**
+ *
+ * @param type
+ */
+export function deriveDiceAdjustmentTypeName(type) {
+    let name = '';
+    switch (type) {
+        case DiceAdjustmentTypeEnum.ADVANTAGE:
+            name = 'Advantage';
+            break;
+        case DiceAdjustmentTypeEnum.DISADVANTAGE:
+            name = 'Disadvantage';
+            break;
+        case DiceAdjustmentTypeEnum.BONUS:
+            name = 'Bonus';
+            break;
+        default:
+        //not implemented
+    }
+    return name;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Dice/generators.js b/ddb_main/packages/rules-engine/es/engine/Dice/generators.js
new file mode 100644
index 0000000..68e9a01
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Dice/generators.js
@@ -0,0 +1,21 @@
+import { ModifierDerivers } from '../Modifier';
+import { DiceAdjustmentTypeEnum } from './constants';
+/**
+ *
+ * @param bonusSavingThrowModifiers
+ * @param advantageSavingThrowModifiers
+ * @param disadvantageSavingThrowModifiers
+ */
+export function generateSavingThrowDiceAdjustments(bonusSavingThrowModifiers, advantageSavingThrowModifiers, disadvantageSavingThrowModifiers) {
+    let diceAdjustments = [];
+    bonusSavingThrowModifiers.forEach((modifier) => {
+        diceAdjustments.push(ModifierDerivers.deriveDiceAdjustment(modifier, DiceAdjustmentTypeEnum.BONUS));
+    });
+    advantageSavingThrowModifiers.forEach((modifier) => {
+        diceAdjustments.push(ModifierDerivers.deriveDiceAdjustment(modifier, DiceAdjustmentTypeEnum.ADVANTAGE));
+    });
+    disadvantageSavingThrowModifiers.forEach((modifier) => {
+        diceAdjustments.push(ModifierDerivers.deriveDiceAdjustment(modifier, DiceAdjustmentTypeEnum.DISADVANTAGE));
+    });
+    return diceAdjustments;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Dice/index.js b/ddb_main/packages/rules-engine/es/engine/Dice/index.js
new file mode 100644
index 0000000..d6eda6f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Dice/index.js
@@ -0,0 +1,12 @@
+import * as DiceAccessors from './accessors';
+import * as DiceConstants from './constants';
+import * as DiceDerivers from './derivers';
+import * as DiceGenerators from './generators';
+import * as DiceRenderers from './renderers';
+import * as DiceSimulators from './simulators';
+import * as DiceTypings from './typings';
+import * as DiceUtils from './utils';
+export * from './constants';
+export * from './typings';
+export { DiceAccessors, DiceRenderers, DiceSimulators, DiceUtils, DiceDerivers, DiceGenerators };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, DiceAccessors), DiceRenderers), DiceSimulators), DiceUtils), DiceTypings), DiceConstants), DiceDerivers), DiceGenerators);
diff --git a/ddb_main/packages/rules-engine/es/engine/Dice/renderers.js b/ddb_main/packages/rules-engine/es/engine/Dice/renderers.js
new file mode 100644
index 0000000..5582272
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Dice/renderers.js
@@ -0,0 +1,35 @@
+import { groupBy } from 'lodash';
+import { FormatUtils } from '../Format';
+import { getCount, getFixedValue, getValue } from './accessors';
+/**
+ * Formats the specified dice to be a human readable string
+ * @param dice The dice that should be formatted
+ */
+export function renderDice(dice) {
+    if (Array.isArray(dice)) {
+        const diceGroups = groupBy(dice.map((die) => renderDie(die)));
+        return Object.keys(diceGroups)
+            .map((key) => `${key}${diceGroups[key].length > 1 ? ` (${diceGroups[key].length})` : ''}`)
+            .join(', ');
+    }
+    return renderDie(dice);
+}
+/**
+ * Formats the specified die to be a human readable string.
+ * @param die The die that should be formatted
+ */
+export function renderDie(die) {
+    if (die === null) {
+        return '';
+    }
+    const diceCount = getCount(die);
+    const diceValue = getValue(die);
+    const fixedValue = getFixedValue(die);
+    if (diceValue && diceCount) {
+        return `${diceCount}d${diceValue}${fixedValue ? FormatUtils.renderSignedNumber(fixedValue) : ''}`;
+    }
+    if (!diceValue && !diceCount && fixedValue) {
+        return FormatUtils.renderLocaleNumber(fixedValue);
+    }
+    return '';
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Dice/simulators.js b/ddb_main/packages/rules-engine/es/engine/Dice/simulators.js
new file mode 100644
index 0000000..2a80a22
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Dice/simulators.js
@@ -0,0 +1,7 @@
+/**
+ *
+ * @param props
+ */
+export function simulateDiceContract(props) {
+    return Object.assign({ diceCount: null, diceMultiplier: null, diceString: null, diceValue: null, fixedValue: null }, props);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Dice/utils.js b/ddb_main/packages/rules-engine/es/engine/Dice/utils.js
new file mode 100644
index 0000000..d40acb1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Dice/utils.js
@@ -0,0 +1,108 @@
+import { sortBy } from 'lodash';
+import { RuleDataAccessors } from '../RuleData';
+import { getCount, getFixedValue, getValue } from './accessors';
+/**
+ * Gets the lowest value for the specified die
+ * @param die The die used to produce the lowest value
+ */
+export function getDiceMinValue(die) {
+    const fixedValue = getFixedValue(die);
+    const count = getCount(die);
+    return (count ? count : 0) + (fixedValue ? fixedValue : 0);
+}
+/**
+ * Gets the highest value for the specified die
+ * @param die The die used to produce the highest value
+ */
+export function getDiceMaxValue(die) {
+    const fixedValue = getFixedValue(die);
+    let count = getCount(die);
+    if (count === null) {
+        count = 0;
+    }
+    const value = getValue(die);
+    const finalValue = value === null ? 0 : value;
+    return count * finalValue + (fixedValue ? fixedValue : 0);
+}
+/**
+ * Gets an array of all possible values produce by the specified die.
+ * @param die The die used to produce the range of values
+ */
+export function getDiceValuesRange(die) {
+    const minValue = getDiceMinValue(die);
+    const maxValue = getDiceMaxValue(die);
+    const values = [];
+    for (let i = minValue; i <= maxValue; i++) {
+        values.push(i);
+    }
+    return values;
+}
+/**
+ * Gets a random value from the specified die's range of values.
+ * @param die The die used to produce a random value
+ */
+export function getDiceRandomValue(die) {
+    const minValue = getDiceMinValue(die);
+    const maxValue = getDiceMaxValue(die);
+    return Math.floor(Math.random() * (maxValue - minValue + 1)) + minValue;
+}
+/**
+ * Gets the average roll for a specific die value.
+ * @param dieValue The die used to produce the average value
+ */
+export function getAverageDieValue(dieValue) {
+    return dieValue / 2 + 0.5;
+}
+/**
+ * Gets the average roll, rounded up, for a specified die value.
+ * @param dieValue The die used to produce the fixed value
+ */
+export function getFixedDieValue(dieValue) {
+    return dieValue / 2 + 1;
+}
+/**
+ * Gets the damage die used when a weapon with the versatile property is wielded with two hands.
+ * @param dieValue The damage die used when the weapon is used normally
+ * @param ruleData The config data provided by the server
+ */
+export function getVersatileDieValue(dieValue, ruleData) {
+    const diceValues = RuleDataAccessors.getDiceValues(ruleData);
+    if (diceValues === null) {
+        return 0;
+    }
+    const versatileIdx = Math.min(diceValues.length - 1, diceValues.indexOf(dieValue) + 1);
+    return diceValues[versatileIdx];
+}
+/**
+ * Obtains the highest die from a specified list of dice.
+ * @param dice The dice to search through
+ */
+export function getHighestDie(dice) {
+    if (!dice.length) {
+        return null;
+    }
+    const highestDie = sortBy(dice, [
+        (die) => {
+            let diceCount = getCount(die);
+            diceCount = diceCount ? diceCount : 0;
+            let diceValue = getValue(die);
+            diceValue = diceValue ? diceValue : 0;
+            const fixedValue = getFixedValue(die);
+            return diceCount * getAverageDieValue(diceValue) + (fixedValue ? fixedValue : 0);
+        },
+    ]).pop();
+    if (!highestDie) {
+        return null;
+    }
+    return highestDie;
+}
+/**
+ *
+ * @param diceContract
+ */
+export function getAverageDiceValue(diceContract) {
+    const fixedValue = diceContract.fixedValue ? diceContract.fixedValue : 0;
+    const diceValue = diceContract.diceValue !== null ? diceContract.diceValue : 0;
+    const diceCount = diceContract.diceCount !== null ? diceContract.diceCount : 0;
+    return Math.floor(getAverageDieValue(diceValue) * diceCount) + fixedValue;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Duration/accessors.js b/ddb_main/packages/rules-engine/es/engine/Duration/accessors.js
new file mode 100644
index 0000000..ae599f9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Duration/accessors.js
@@ -0,0 +1,21 @@
+/**
+ *
+ * @param duration
+ */
+export function getInterval(duration) {
+    return duration.durationInterval;
+}
+/**
+ *
+ * @param duration
+ */
+export function getUnit(duration) {
+    return duration.durationUnit;
+}
+/**
+ *
+ * @param duration
+ */
+export function getType(duration) {
+    return duration.durationType;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Duration/constants.js b/ddb_main/packages/rules-engine/es/engine/Duration/constants.js
new file mode 100644
index 0000000..2186682
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Duration/constants.js
@@ -0,0 +1,9 @@
+export var DurationUnitEnum;
+(function (DurationUnitEnum) {
+    DurationUnitEnum["ROUND"] = "Round";
+    DurationUnitEnum["MINUTE"] = "Minute";
+    DurationUnitEnum["HOUR"] = "Hour";
+    DurationUnitEnum["DAY"] = "Day";
+    DurationUnitEnum["UNTIL_DISPELLED"] = "Until Dispelled";
+    DurationUnitEnum["SPECIAL"] = "Special";
+})(DurationUnitEnum || (DurationUnitEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Duration/index.js b/ddb_main/packages/rules-engine/es/engine/Duration/index.js
new file mode 100644
index 0000000..e975e56
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Duration/index.js
@@ -0,0 +1,7 @@
+import * as DurationAccessors from './accessors';
+import * as DurationConstants from './constants';
+import * as DurationRenderers from './renderers';
+import * as DurationUtils from './utils';
+export * from './constants';
+export { DurationAccessors, DurationRenderers, DurationUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign({}, DurationAccessors), DurationConstants), DurationRenderers), DurationUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Duration/renderers.js b/ddb_main/packages/rules-engine/es/engine/Duration/renderers.js
new file mode 100644
index 0000000..b99bb61
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Duration/renderers.js
@@ -0,0 +1,73 @@
+import { FormatUtils } from '../Format';
+import { SpellDurationTypeEnum } from '../Spell';
+import { getInterval, getType, getUnit } from './accessors';
+import { DurationUnitEnum } from './constants';
+import { isSpellDurationContract } from './utils';
+/**
+ *
+ * @param duration
+ * @param usesConcentration
+ */
+export function renderDuration(duration, usesConcentration = false) {
+    const durationInterval = getInterval(duration);
+    const durationUnit = getUnit(duration);
+    let durationType = null;
+    if (isSpellDurationContract(duration)) {
+        durationType = getType(duration);
+    }
+    let durationString = '';
+    if (durationType !== null &&
+        durationType !== SpellDurationTypeEnum.TIME &&
+        durationType !== SpellDurationTypeEnum.CONCENTRATION) {
+        durationString += durationType;
+    }
+    if (durationInterval && durationInterval > 0) {
+        durationString += ` ${durationInterval} ${durationUnit}${durationInterval !== 1 ? 's' : ''}`;
+    }
+    durationString = durationString.trim();
+    if (usesConcentration) {
+        durationString = `Concentration, up to ${durationString}`;
+    }
+    return FormatUtils.upperCaseFirstLetterOnly(durationString);
+}
+/**
+ *
+ * @param duration
+ */
+export function renderDurationAbbreviation(duration) {
+    const durationInterval = getInterval(duration);
+    const durationUnit = getUnit(duration);
+    let durationType = null;
+    if (isSpellDurationContract(duration)) {
+        durationType = getType(duration);
+    }
+    let durationString = '';
+    if (durationType &&
+        durationType !== SpellDurationTypeEnum.TIME &&
+        durationType !== SpellDurationTypeEnum.CONCENTRATION) {
+        durationString = durationType;
+    }
+    else if (durationInterval && durationInterval > 0) {
+        durationString = `${durationInterval}${renderDurationUnitAbbreviation(durationUnit)}`;
+    }
+    return durationString;
+}
+/**
+ *
+ * @param unit
+ */
+export function renderDurationUnitAbbreviation(unit) {
+    switch (unit) {
+        case DurationUnitEnum.DAY:
+            return 'd';
+        case DurationUnitEnum.HOUR:
+            return 'h';
+        case DurationUnitEnum.MINUTE:
+            return 'm';
+        case DurationUnitEnum.ROUND:
+            return 'Rnd';
+        default:
+        // not implemented
+    }
+    return '';
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Duration/utils.js b/ddb_main/packages/rules-engine/es/engine/Duration/utils.js
new file mode 100644
index 0000000..72df2c0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Duration/utils.js
@@ -0,0 +1,7 @@
+/**
+ *
+ * @param duration
+ */
+export function isSpellDurationContract(duration) {
+    return duration.durationType !== undefined;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Entity/generators.js b/ddb_main/packages/rules-engine/es/engine/Entity/generators.js
new file mode 100644
index 0000000..7b94df9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Entity/generators.js
@@ -0,0 +1,11 @@
+/**
+ *
+ * @param preferences
+ * @param activeSourceLookup
+ */
+export function generateEntityRestrictionData(preferences, activeSourceLookup) {
+    return {
+        preferences,
+        activeSourceLookup,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Entity/index.js b/ddb_main/packages/rules-engine/es/engine/Entity/index.js
new file mode 100644
index 0000000..e5aa0d4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Entity/index.js
@@ -0,0 +1,6 @@
+import * as EntityGenerators from './generators';
+import * as EntityUtils from './utils';
+import * as EntityValidators from './validators';
+export * from './typings';
+export { EntityGenerators, EntityUtils, EntityValidators };
+export default Object.assign(Object.assign(Object.assign({}, EntityGenerators), EntityUtils), EntityValidators);
diff --git a/ddb_main/packages/rules-engine/es/engine/Entity/utils.js b/ddb_main/packages/rules-engine/es/engine/Entity/utils.js
new file mode 100644
index 0000000..735b31e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Entity/utils.js
@@ -0,0 +1,344 @@
+import { BackgroundAccessors } from '../Background';
+import { ClassAccessors } from '../Class';
+import { ClassFeatureAccessors } from '../ClassFeature';
+import { ConditionAccessors } from '../Condition';
+import { DataOriginTypeEnum, DataOriginUtils } from '../DataOrigin';
+import { FeatAccessors } from '../Feat';
+import { ItemAccessors } from '../Item';
+import { RaceAccessors } from '../Race';
+import { RacialTraitAccessors } from '../RacialTrait';
+import { VehicleAccessors } from '../Vehicle';
+import { validateIsRestrictedEntityDefinition } from './validators';
+/**
+ *
+ * @param dataOrigin
+ * @param defaultValue
+ * @param tryParent
+ */
+export function getDataOriginName(dataOrigin, defaultValue = '', tryParent = false) {
+    var _a;
+    let extraDisplay = null;
+    switch (dataOrigin.type) {
+        case DataOriginTypeEnum.RACE:
+            if (tryParent) {
+                extraDisplay = RaceAccessors.getFullName(dataOrigin.parent);
+            }
+            if (extraDisplay === null) {
+                extraDisplay = RacialTraitAccessors.getName(dataOrigin.primary);
+            }
+            break;
+        case DataOriginTypeEnum.CLASS:
+            extraDisplay = ClassAccessors.getName(dataOrigin.primary);
+            break;
+        case DataOriginTypeEnum.CLASS_FEATURE:
+            if (tryParent) {
+                extraDisplay = ClassAccessors.getName(dataOrigin.parent);
+            }
+            if (extraDisplay === null) {
+                extraDisplay = ClassFeatureAccessors.getName(dataOrigin.primary);
+            }
+            break;
+        case DataOriginTypeEnum.FEAT:
+            extraDisplay = FeatAccessors.getName(dataOrigin.primary);
+            break;
+        case DataOriginTypeEnum.BACKGROUND:
+            extraDisplay = BackgroundAccessors.getName(dataOrigin.primary);
+            break;
+        case DataOriginTypeEnum.ITEM:
+            extraDisplay = ItemAccessors.getDefinitionName(dataOrigin.primary);
+            break;
+        case DataOriginTypeEnum.CUSTOM:
+            extraDisplay = dataOrigin.primary === null ? null : dataOrigin.primary;
+            break;
+        case DataOriginTypeEnum.FEAT_LIST:
+            if (tryParent && dataOrigin.parent !== null) {
+                if (dataOrigin.parentType === DataOriginTypeEnum.BACKGROUND) {
+                    extraDisplay = ((_a = dataOrigin.parent.definition) === null || _a === void 0 ? void 0 : _a.name) || null;
+                }
+                else if (dataOrigin.parentType === DataOriginTypeEnum.CLASS_FEATURE) {
+                    extraDisplay = ClassFeatureAccessors.getName(dataOrigin.primary);
+                }
+            }
+            if (extraDisplay === null && dataOrigin.primary !== null) {
+                extraDisplay = dataOrigin.primary.name;
+            }
+            break;
+        default:
+        //not implemented
+    }
+    return extraDisplay === null ? defaultValue : extraDisplay;
+}
+/**
+ * Gets the id as a string of the primary origin if possible.
+ * @param dataOrigin the data origin object from an entity
+ * @returns id of the primary origin object as a string, or null
+ */
+export function tryGetPrimaryId(dataOrigin) {
+    // The data origin system is risky business because it is all `any` typed.
+    // The logic about the types is based on `getDataOriginName` above.
+    try {
+        let id;
+        switch (dataOrigin.type) {
+            case DataOriginTypeEnum.RACE:
+                id = RacialTraitAccessors.getId(dataOrigin.primary);
+                break;
+            case DataOriginTypeEnum.CLASS:
+                id = ClassAccessors.getId(dataOrigin.primary);
+                break;
+            case DataOriginTypeEnum.CLASS_FEATURE:
+                id = ClassFeatureAccessors.getId(dataOrigin.primary);
+                break;
+            case DataOriginTypeEnum.FEAT:
+                id = FeatAccessors.getId(dataOrigin.primary);
+                break;
+            case DataOriginTypeEnum.BACKGROUND:
+                id = BackgroundAccessors.getId(dataOrigin.primary);
+                break;
+            case DataOriginTypeEnum.ITEM:
+                id = ItemAccessors.getId(dataOrigin.primary);
+                break;
+            case DataOriginTypeEnum.FEAT_LIST:
+                if (dataOrigin.primary !== null) {
+                    id = dataOrigin.primary.id;
+                }
+                break;
+        }
+        return id ? `${id}` : null;
+    }
+    catch (e) {
+        console.log(e);
+        return null;
+    }
+}
+/**
+ * Gets the id as a string of parent origin if possible.
+ * Note that most entity types don't have a parent origin.
+ * @param dataOrigin the data origin object from an entity
+ * @returns id of the parent origin object as a string, or null
+ */
+export function tryGetParentId(dataOrigin) {
+    var _a;
+    // See comment above about the typings.
+    try {
+        let id;
+        switch (dataOrigin.type) {
+            case DataOriginTypeEnum.RACE:
+                id = RaceAccessors.getDefinitionKey(dataOrigin.parent);
+                break;
+            case DataOriginTypeEnum.CLASS_FEATURE:
+                id = ClassAccessors.getId(dataOrigin.parent);
+                break;
+            case DataOriginTypeEnum.FEAT_LIST:
+                if (dataOrigin.parentType === DataOriginTypeEnum.BACKGROUND && dataOrigin.parent !== null) {
+                    id = (_a = dataOrigin.parent.definition) === null || _a === void 0 ? void 0 : _a.id;
+                }
+                else if (dataOrigin.parentType === DataOriginTypeEnum.CLASS_FEATURE && dataOrigin.parent !== null) {
+                    id = ClassFeatureAccessors.getId(dataOrigin.parent);
+                }
+                break;
+        }
+        return id ? `${id}` : null;
+    }
+    catch (e) {
+        console.log(e);
+        return null;
+    }
+}
+/**
+ *
+ * @param ref
+ * @param refData
+ * @param defaultValue
+ * @param tryParent
+ */
+export function getDataOriginRefName(ref, refData, defaultValue, tryParent = false) {
+    var _a;
+    let extraDisplay = null;
+    switch (ref.type) {
+        case DataOriginTypeEnum.RACE: {
+            if (tryParent) {
+                const parent = DataOriginUtils.getRefParent(ref, refData);
+                if (parent !== null) {
+                    extraDisplay = RaceAccessors.getFullName(parent);
+                }
+            }
+            if (extraDisplay === null) {
+                const primary = DataOriginUtils.getRefPrimary(ref, refData);
+                if (primary !== null) {
+                    extraDisplay = RacialTraitAccessors.getName(primary);
+                }
+            }
+            break;
+        }
+        case DataOriginTypeEnum.CLASS: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary) {
+                extraDisplay = ClassAccessors.getName(primary);
+            }
+            break;
+        }
+        case DataOriginTypeEnum.CLASS_FEATURE: {
+            if (tryParent) {
+                const parent = DataOriginUtils.getRefParent(ref, refData);
+                if (parent !== null) {
+                    extraDisplay = ClassAccessors.getName(parent);
+                }
+            }
+            if (extraDisplay === null) {
+                const primary = DataOriginUtils.getRefPrimary(ref, refData);
+                if (primary !== null) {
+                    extraDisplay = ClassFeatureAccessors.getName(primary);
+                }
+            }
+            break;
+        }
+        case DataOriginTypeEnum.FEAT: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary !== null) {
+                extraDisplay = FeatAccessors.getName(primary);
+            }
+            break;
+        }
+        case DataOriginTypeEnum.BACKGROUND: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary !== null) {
+                extraDisplay = BackgroundAccessors.getName(primary);
+            }
+            break;
+        }
+        case DataOriginTypeEnum.ITEM: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary !== null) {
+                extraDisplay = ItemAccessors.getName(primary);
+            }
+            break;
+        }
+        case DataOriginTypeEnum.CUSTOM: {
+            extraDisplay = 'Custom';
+            break;
+        }
+        case DataOriginTypeEnum.UNKNOWN: {
+            extraDisplay = defaultValue !== null && defaultValue !== void 0 ? defaultValue : 'No Origin';
+            break;
+        }
+        default:
+        //not implemented
+    }
+    return (_a = extraDisplay !== null && extraDisplay !== void 0 ? extraDisplay : defaultValue) !== null && _a !== void 0 ? _a : '';
+}
+/**
+ *
+ * @param dataOrigin
+ * @param fallback
+ */
+export function getPrimaryDescription(dataOrigin, fallback = '') {
+    let description = fallback;
+    if (!dataOrigin) {
+        return description;
+    }
+    switch (dataOrigin.type) {
+        case DataOriginTypeEnum.RACE:
+            description = RacialTraitAccessors.getDescription(dataOrigin.primary);
+            break;
+        case DataOriginTypeEnum.FEAT:
+            const featDescription = FeatAccessors.getDescription(dataOrigin.primary);
+            description = featDescription === null ? '' : featDescription;
+            break;
+        case DataOriginTypeEnum.CLASS_FEATURE:
+            const classFeatureDescription = ClassFeatureAccessors.getDescription(dataOrigin.primary);
+            description = classFeatureDescription === null ? '' : classFeatureDescription;
+            break;
+        default:
+            if (dataOrigin.primary && dataOrigin.primary.definition && dataOrigin.primary.definition.description) {
+                description = dataOrigin.primary.definition.description;
+            }
+    }
+    return description === null ? '' : description;
+}
+/**
+ *
+ * @param ref
+ * @param refData
+ * @param fallback
+ */
+export function getDataOriginRefPrimaryDescription(ref, refData, fallback = '') {
+    let description = null;
+    switch (ref.type) {
+        case DataOriginTypeEnum.RACE: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary !== null) {
+                description = RacialTraitAccessors.getDescription(primary);
+            }
+            break;
+        }
+        case DataOriginTypeEnum.FEAT: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary !== null) {
+                description = FeatAccessors.getDescription(primary);
+            }
+            break;
+        }
+        case DataOriginTypeEnum.CLASS: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary) {
+                description = ClassAccessors.getDescription(primary);
+            }
+            break;
+        }
+        case DataOriginTypeEnum.CLASS_FEATURE: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary !== null) {
+                description = ClassFeatureAccessors.getDescription(primary);
+            }
+            break;
+        }
+        case DataOriginTypeEnum.BACKGROUND: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary !== null) {
+                description = BackgroundAccessors.getDescription(primary);
+            }
+            break;
+        }
+        case DataOriginTypeEnum.ITEM: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary !== null) {
+                description = ItemAccessors.getDescription(primary);
+            }
+            break;
+        }
+        case DataOriginTypeEnum.VEHICLE: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary !== null) {
+                description = VehicleAccessors.getDescription(primary);
+            }
+            break;
+        }
+        case DataOriginTypeEnum.CONDITION: {
+            const primary = DataOriginUtils.getRefPrimary(ref, refData);
+            if (primary !== null) {
+                description = ConditionAccessors.getDescription(primary);
+            }
+            break;
+        }
+        default:
+        // not implemented
+    }
+    return description !== null && description !== void 0 ? description : fallback;
+}
+/**
+ *
+ * @param entities
+ * @param entityRestrictionData
+ */
+export function filterNonRestrictedEntities(entities, entityRestrictionData) {
+    return entities.filter((entity) => entity.definition !== null &&
+        !validateIsRestrictedEntityDefinition(entity.definition, entityRestrictionData));
+}
+/**
+ *
+ * @param entityDefinitions
+ * @param entityRestrictionData
+ */
+export function filterNonRestrictedEntityDefinitions(entityDefinitions, entityRestrictionData) {
+    return entityDefinitions.filter((definition) => !validateIsRestrictedEntityDefinition(definition, entityRestrictionData));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Entity/validators.js b/ddb_main/packages/rules-engine/es/engine/Entity/validators.js
new file mode 100644
index 0000000..b8ea6ad
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Entity/validators.js
@@ -0,0 +1,19 @@
+import { HelperUtils } from '../Helper';
+/**
+ *
+ * @param entityDefinition
+ * @param entityRestrictionData
+ */
+export function validateIsRestrictedEntityDefinition(entityDefinition, entityRestrictionData) {
+    // check if entity is homebrew and then check current user preference
+    if (entityDefinition.isHomebrew) {
+        return !entityRestrictionData.preferences.useHomebrewContent;
+    }
+    // check if entity has sources and then filter based on current active sources
+    let sources = entityDefinition.sources;
+    if (sources !== null && sources.length > 0) {
+        return !sources.some((source) => HelperUtils.lookupDataOrFallback(entityRestrictionData.activeSourceLookup, source.sourceId) !== null);
+    }
+    // if entity isn't homebrew and it doesn't have sources it isn't restricted
+    return false;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Extra/accessors.js b/ddb_main/packages/rules-engine/es/engine/Extra/accessors.js
new file mode 100644
index 0000000..5f1128e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Extra/accessors.js
@@ -0,0 +1,72 @@
+export function getId(extra) {
+    return extra.id;
+}
+export function getMappingId(extra) {
+    return extra.mappingId;
+}
+export function getMappingEntityTypeId(extra) {
+    return extra.entityTypeId;
+}
+export function getUniqueKey(extra) {
+    return `${getMappingId(extra)}-${getMappingEntityTypeId(extra)}`;
+}
+export function getName(extra) {
+    return extra.name;
+}
+export function getSizeId(extra) {
+    return extra.sizeId;
+}
+export function getSizeInfo(extra) {
+    return extra.sizeInfo;
+}
+export function getType(extra) {
+    return extra.type;
+}
+export function getSearchTags(extra) {
+    return extra.searchTags;
+}
+export function getEnvironments(extra) {
+    return extra.environments;
+}
+export function getTags(extra) {
+    return extra.tags;
+}
+export function getMovementNames(extra) {
+    return extra.movementNames;
+}
+export function getMovementInfo(extra) {
+    return extra.movementInfo;
+}
+export function getAvatarUrl(extra) {
+    return extra.avatarUrl;
+}
+export function getArmorClassInfo(extra) {
+    return extra.armorClassInfo;
+}
+export function getHitPointInfo(extra) {
+    return extra.hitPointInfo;
+}
+export function getNoteComponents(extra) {
+    return extra.noteComponents;
+}
+export function getExtraType(extra) {
+    return extra.extraType;
+}
+export function getFilterTypes(extra) {
+    return extra.filterTypes;
+}
+export function getGroupId(extra) {
+    return extra.groupId;
+}
+export function isCustomized(extra) {
+    return extra.isCustomized;
+}
+export function getSources(extra) {
+    return extra.sources;
+}
+export function getMetaText(extra) {
+    return extra.metaText;
+}
+export function isHomebrew(extra) {
+    return extra.isHomebrew;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Extra/constants.js b/ddb_main/packages/rules-engine/es/engine/Extra/constants.js
new file mode 100644
index 0000000..161ab27
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Extra/constants.js
@@ -0,0 +1,11 @@
+export var ExtraTypeEnum;
+(function (ExtraTypeEnum) {
+    ExtraTypeEnum["VEHICLE"] = "Vehicle";
+    ExtraTypeEnum["CREATURE"] = "Creature";
+})(ExtraTypeEnum || (ExtraTypeEnum = {}));
+//This is "hacking" vehicles into the creature group system giving the vehicle group an id value of -1
+export const HACK_VEHICLE_GROUP_ID = -1;
+export var ExtraGroupTypeEnum;
+(function (ExtraGroupTypeEnum) {
+    ExtraGroupTypeEnum["VEHICLE"] = "vehicle";
+})(ExtraGroupTypeEnum || (ExtraGroupTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Extra/derivers.js b/ddb_main/packages/rules-engine/es/engine/Extra/derivers.js
new file mode 100644
index 0000000..37e3f1f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Extra/derivers.js
@@ -0,0 +1,154 @@
+import sortBy from 'lodash/sortBy';
+import { CreatureAccessors, CreatureUtils } from '../Creature';
+import { RuleDataUtils } from '../RuleData';
+import { VehicleAccessors, VehicleConfigurationKeyEnum, VehicleUtils } from '../Vehicle';
+import { VehicleComponentAccessors } from '../VehicleComponent';
+/**
+ *
+ * @param creature
+ */
+export function deriveCreatureArmorClassInfo(creature) {
+    return {
+        value: CreatureAccessors.getArmorClass(creature),
+        showTooltip: false,
+    };
+}
+/**
+ *
+ * @param creature
+ */
+export function deriveCreatureHitPointInfo(creature) {
+    return {
+        data: CreatureAccessors.getHitPointInfo(creature),
+        showTooltip: false,
+    };
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function deriveCreatureMovementInfo(creature, ruleData) {
+    let highestMovementInfo = CreatureUtils.getHighestMovementInfo(creature);
+    let data = null;
+    let label = null;
+    if (highestMovementInfo) {
+        data = highestMovementInfo;
+        label = RuleDataUtils.getMovementDescription(highestMovementInfo.movementId, ruleData);
+    }
+    return {
+        data,
+        label,
+        showTooltip: false,
+    };
+}
+/**
+ *
+ * @param vehicle
+ */
+export function deriveVehiclePrimaryArmorClassInfo(vehicle) {
+    const allComponents = VehicleAccessors.getAllComponentsData(vehicle);
+    const primaryComponent = VehicleAccessors.getPrimaryComponent(vehicle);
+    let value = null;
+    let showTooltip = true;
+    if (primaryComponent) {
+        showTooltip = allComponents.length !== 1;
+        const armorClassInfo = VehicleComponentAccessors.getArmorClassInfo(primaryComponent);
+        value = armorClassInfo.base;
+        if (armorClassInfo.moving !== null) {
+            value = armorClassInfo.moving;
+            showTooltip = armorClassInfo.moving !== armorClassInfo.base;
+        }
+    }
+    return {
+        value,
+        showTooltip,
+    };
+}
+/**
+ *
+ * @param vehicle
+ */
+export function deriveVehiclePrimaryHitPointInfo(vehicle) {
+    const allComponents = VehicleAccessors.getAllComponentsData(vehicle);
+    let showTooltip = false;
+    if (VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_COMPONENT_HIT_POINTS, vehicle)) {
+        let count = 0;
+        allComponents.forEach((component) => {
+            if (count > 1) {
+                return;
+            }
+            const hitPointInfo = VehicleComponentAccessors.getHitPointInfo(component);
+            if (hitPointInfo !== null) {
+                count += 1;
+            }
+        });
+        showTooltip = count > 1;
+    }
+    const primaryComponent = VehicleAccessors.getPrimaryComponent(vehicle);
+    return {
+        data: VehicleComponentAccessors.getHitPointInfo(primaryComponent),
+        showTooltip,
+    };
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveVehicleMovementInfo(vehicle, ruleData) {
+    let allSpeeds = [];
+    VehicleAccessors.getAllComponentsData(vehicle).forEach((component) => {
+        const speedInfos = VehicleComponentAccessors.getSpeedInfos(component);
+        if (speedInfos.length > 0) {
+            allSpeeds.push(...speedInfos);
+        }
+    });
+    let allModes = [];
+    allSpeeds.forEach((speedInfo) => {
+        if (speedInfo.modes !== null) {
+            speedInfo.modes.forEach((mode) => {
+                allModes.push(Object.assign(Object.assign({}, mode), { type: speedInfo.type }));
+            });
+        }
+    });
+    let highestMovementInfo = sortBy(allModes, [
+        (mode) => !mode.restrictionsText,
+        (mode) => !mode.description,
+        (mode) => mode.value,
+    ]).pop();
+    let showTooltip = true;
+    let data = null;
+    let label = null;
+    if (highestMovementInfo) {
+        if (allModes.length === 1 && !highestMovementInfo.restrictionsText && !highestMovementInfo.description) {
+            showTooltip = false;
+        }
+        data = {
+            movementId: highestMovementInfo.type,
+            speed: highestMovementInfo.value,
+            notes: '',
+        };
+        label = highestMovementInfo.type
+            ? RuleDataUtils.getVehicleMovementName(highestMovementInfo.type, ruleData)
+            : null;
+    }
+    return {
+        data,
+        label,
+        showTooltip,
+    };
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function deriveCreatureFilterTypes(creature, ruleData) {
+    let filterTypes = [];
+    const name = RuleDataUtils.getMonsterTypeName(CreatureAccessors.getTypeId(creature), ruleData);
+    if (name) {
+        filterTypes.push(name);
+    }
+    return filterTypes;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Extra/generators.js b/ddb_main/packages/rules-engine/es/engine/Extra/generators.js
new file mode 100644
index 0000000..3a14e76
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Extra/generators.js
@@ -0,0 +1,160 @@
+import { groupBy, orderBy } from 'lodash';
+import { CreatureAccessors, CreatureNotes, CreatureUtils } from '../Creature';
+import { RuleDataUtils } from '../RuleData';
+import { VehicleAccessors, VehicleNotes } from '../Vehicle';
+import { getGroupId } from './accessors';
+import { ExtraGroupTypeEnum, ExtraTypeEnum } from './constants';
+import { deriveCreatureArmorClassInfo, deriveCreatureFilterTypes, deriveCreatureHitPointInfo, deriveCreatureMovementInfo, deriveVehicleMovementInfo, deriveVehiclePrimaryArmorClassInfo, deriveVehiclePrimaryHitPointInfo, } from './derivers';
+/**
+ *
+ * @param creatures
+ * @param vehicles
+ * @param ruleData
+ */
+export function generateExtras(creatures, vehicles, ruleData) {
+    let creatureExtras = creatures.map((creature) => generateCreatureExtra(creature, ruleData));
+    let vehicleExtras = vehicles.map((vehicle) => generateVehicleExtra(vehicle, ruleData));
+    return [...creatureExtras, ...vehicleExtras];
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function generateCreatureExtra(creature, ruleData) {
+    return {
+        extraType: ExtraTypeEnum.CREATURE,
+        key: CreatureAccessors.getUniqueKey(creature),
+        entityTypeId: CreatureAccessors.getEntityTypeId(creature),
+        avatarUrl: CreatureAccessors.getAvatarUrl(creature),
+        name: CreatureAccessors.getName(creature),
+        armorClassInfo: deriveCreatureArmorClassInfo(creature),
+        movementNames: CreatureAccessors.getMovementNames(creature),
+        movementInfo: deriveCreatureMovementInfo(creature, ruleData),
+        isActive: CreatureAccessors.isActive(creature),
+        isCustomized: CreatureAccessors.isCustomized(creature),
+        isHomebrew: CreatureAccessors.isHomebrew(creature),
+        sizeId: CreatureAccessors.getSizeId(creature),
+        sizeInfo: RuleDataUtils.getCreatureSizeInfo(CreatureAccessors.getSizeId(creature), ruleData),
+        type: CreatureUtils.getTypeName(creature, ruleData),
+        hitPointInfo: deriveCreatureHitPointInfo(creature),
+        noteComponents: CreatureNotes.getNoteComponents(creature, ruleData),
+        searchTags: CreatureUtils.getSearchTags(creature),
+        tags: CreatureAccessors.getTags(creature),
+        mappingId: CreatureAccessors.getMappingId(creature),
+        id: CreatureAccessors.getId(creature),
+        groupId: CreatureAccessors.getGroupId(creature),
+        environments: CreatureAccessors.getEnvironments(creature),
+        filterTypes: deriveCreatureFilterTypes(creature, ruleData),
+        sources: CreatureAccessors.getSources(creature),
+        metaText: generateCreatureMeta(creature, ruleData),
+    };
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function generateVehicleExtra(vehicle, ruleData) {
+    return {
+        extraType: ExtraTypeEnum.VEHICLE,
+        key: VehicleAccessors.getUniqueKey(vehicle),
+        entityTypeId: -1,
+        avatarUrl: VehicleAccessors.getAvatarUrl(vehicle),
+        name: VehicleAccessors.getName(vehicle),
+        armorClassInfo: deriveVehiclePrimaryArmorClassInfo(vehicle),
+        movementNames: VehicleAccessors.getMovementNames(vehicle),
+        movementInfo: deriveVehicleMovementInfo(vehicle, ruleData),
+        isActive: null,
+        isCustomized: false,
+        isHomebrew: false,
+        sizeId: VehicleAccessors.getSizeId(vehicle),
+        sizeInfo: VehicleAccessors.getSizeInfo(vehicle),
+        type: VehicleAccessors.getTypeName(vehicle),
+        hitPointInfo: deriveVehiclePrimaryHitPointInfo(vehicle),
+        noteComponents: VehicleNotes.getNoteComponents(vehicle, ruleData),
+        searchTags: VehicleAccessors.getSearchTags(vehicle),
+        tags: [],
+        mappingId: VehicleAccessors.getMappingId(vehicle),
+        id: VehicleAccessors.getId(vehicle),
+        groupId: ExtraGroupTypeEnum.VEHICLE,
+        environments: [],
+        filterTypes: VehicleAccessors.getMovementNames(vehicle).map((name) => `Vehicle - ${name}`),
+        sources: VehicleAccessors.getSources(vehicle),
+        metaText: generateVehicleMeta(vehicle, ruleData),
+    };
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function generateCreatureMeta(creature, ruleData) {
+    let metaItems = [];
+    const sizeInfo = RuleDataUtils.getCreatureSizeInfo(CreatureAccessors.getSizeId(creature), ruleData);
+    let size = '';
+    if (sizeInfo && sizeInfo.name !== null) {
+        size = sizeInfo.name;
+    }
+    let type = CreatureUtils.getTypeName(creature, ruleData);
+    let extraTextChunks = [];
+    let subTypes = CreatureAccessors.getSubTypes(creature);
+    subTypes.forEach((monsterInfo) => {
+        if (monsterInfo.name !== null) {
+            extraTextChunks.push(monsterInfo.name);
+        }
+    });
+    let extraText = extraTextChunks.join(', ');
+    metaItems.push(`${size} ${type}${extraText ? ` (${extraText})` : ''}`.trim());
+    let envTags = CreatureAccessors.getEnvironmentTags(creature);
+    metaItems.push(envTags.join(', '));
+    return metaItems.filter((metaItem) => metaItem);
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function generateVehicleMeta(vehicle, ruleData) {
+    let metaText = [];
+    const sizeInfo = VehicleAccessors.getSizeInfo(vehicle);
+    let size = '';
+    if (sizeInfo && sizeInfo.name !== null) {
+        size = sizeInfo.name;
+    }
+    let type = VehicleAccessors.getType(vehicle);
+    let typeName = type === null ? '' : RuleDataUtils.getObjectTypeName(type, ruleData);
+    typeName = typeName ? typeName.toLowerCase() : '';
+    let primaryText = `${size} ${typeName}`.trim();
+    let movementTypesText = VehicleAccessors.getMovementNames(vehicle).join(', ');
+    metaText.push(`${primaryText}${movementTypesText ? ` (${movementTypesText})` : ''}`.trim());
+    return metaText;
+}
+export function generateGroups(extras) {
+    return groupBy(extras, (extra) => getGroupId(extra));
+}
+export function generateCurrentExtraGroupInfos(extras, ruleData) {
+    let groups = generateGroups(extras);
+    let groupIds = Object.keys(groups);
+    let groupInfos = [];
+    groupIds.forEach((groupId) => {
+        let groupInfo = null;
+        if (groupId === ExtraGroupTypeEnum.VEHICLE) {
+            groupInfo = {
+                isPrimary: false,
+                name: 'Vehicle',
+                id: groupId,
+            };
+        }
+        else {
+            const creatureGroupInfo = RuleDataUtils.getCreatureGroupInfo(parseInt(groupId), ruleData);
+            if (creatureGroupInfo) {
+                groupInfo = creatureGroupInfo;
+            }
+        }
+        if (groupInfo) {
+            groupInfos.push(groupInfo);
+        }
+    });
+    return orderBy(groupInfos, [(extraGroup) => extraGroup.isPrimary, (extraGroup) => extraGroup.name], ['desc']);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Extra/index.js b/ddb_main/packages/rules-engine/es/engine/Extra/index.js
new file mode 100644
index 0000000..bcf210d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Extra/index.js
@@ -0,0 +1,10 @@
+import * as ExtraAccessors from './accessors';
+import * as ExtraConstants from './constants';
+import * as ExtraDerivers from './derivers';
+import * as ExtraGenerators from './generators';
+import * as ExtraTypings from './typings';
+import * as ExtraUtils from './utils';
+export * from './typings';
+export * from './constants';
+export { ExtraAccessors, ExtraDerivers, ExtraGenerators, ExtraUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, ExtraAccessors), ExtraConstants), ExtraDerivers), ExtraGenerators), ExtraTypings), ExtraUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Extra/utils.js b/ddb_main/packages/rules-engine/es/engine/Extra/utils.js
new file mode 100644
index 0000000..f6243c7
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Extra/utils.js
@@ -0,0 +1,19 @@
+import { HelperUtils } from '../Helper';
+import { getExtraType, getMappingId } from './accessors';
+import { ExtraTypeEnum } from './constants';
+export function getTypedExtra(extra, lookup, defaultValue = null) {
+    const mappingId = getMappingId(extra);
+    return HelperUtils.lookupDataOrFallback(lookup, mappingId, defaultValue);
+}
+export function isCreature(extra) {
+    return getExtraType(extra) === ExtraTypeEnum.CREATURE;
+}
+export function isVehicle(extra) {
+    return getExtraType(extra) === ExtraTypeEnum.VEHICLE;
+}
+export function getCreatureExtras(extras) {
+    return extras.filter(isCreature);
+}
+export function getVehicleExtras(extras) {
+    return extras.filter(isVehicle);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Feat/accessors.js b/ddb_main/packages/rules-engine/es/engine/Feat/accessors.js
new file mode 100644
index 0000000..cdb803c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Feat/accessors.js
@@ -0,0 +1,283 @@
+import { ActivationAccessors } from '../Activation';
+import { PrerequisiteAccessors } from '../Prerequisite';
+/**
+ *
+ * @param feat
+ */
+export function getDefinition(feat) {
+    return feat.definition;
+}
+/**
+ *
+ * @param feat
+ */
+export function getId(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param feat
+ */
+export function getEntityTypeId(feat) {
+    return getDefinitionEntityTypeId(feat);
+}
+/**
+ *
+ * @param feat
+ */
+export function getDefinitionEntityTypeId(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.entityTypeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param feat
+ */
+export function getUniqueKey(feat) {
+    return `${getId(feat)}-${getEntityTypeId(feat)}`;
+}
+/**
+ *
+ * @param feat
+ */
+export function getName(feat) {
+    return getDefinitionName(feat);
+}
+/**
+ *
+ * @param feat
+ */
+export function getDefinitionName(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param feat
+ */
+export function getActivation(feat) {
+    return getDefinitionActivation(feat);
+}
+/**
+ *
+ * @param feat
+ */
+export function getDefinitionActivation(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.activation) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param feat
+ */
+export function getActivationTime(feat) {
+    return ActivationAccessors.getTime(getActivation(feat));
+}
+/**
+ *
+ * @param feat
+ */
+export function getActivationType(feat) {
+    return ActivationAccessors.getType(getActivation(feat));
+}
+/**
+ *
+ * @param feat
+ */
+export function getSnippet(feat) {
+    return getDefinitionSnippet(feat);
+}
+/**
+ *
+ * @param feat
+ */
+export function getDefinitionSnippet(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.snippet) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param feat
+ */
+export function getDescription(feat) {
+    return getDefinitionDescription(feat);
+}
+/**
+ *
+ * @param feat
+ */
+export function getDefinitionDescription(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param feat
+ */
+export function getCreatureRules(feat) {
+    return getDefinitionCreatureRules(feat);
+}
+/**
+ *
+ * @param feat
+ */
+export function getDefinitionCreatureRules(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.creatureRules) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param feat
+ */
+export function getPrerequisites(feat) {
+    return getDefinitionPrerequisites(feat);
+}
+/**
+ *
+ * @param feat
+ */
+export function getDefinitionPrerequisites(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.prerequisites) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param feat
+ */
+export function getPrerequisiteDescription(feat) {
+    const prerequisites = getPrerequisites(feat);
+    return PrerequisiteAccessors.getDescription(prerequisites);
+}
+/**
+ *
+ * @param feat
+ */
+export function getComponentId(feat) {
+    return feat.componentId;
+}
+/**
+ *
+ * @param feat
+ */
+export function getComponentTypeId(feat) {
+    return feat.componentTypeId;
+}
+/**
+ *
+ * @param feat
+ */
+export function getOptions(feat) {
+    return feat.options;
+}
+/**
+ *
+ * @param feat
+ */
+export function getActions(feat) {
+    return feat.actions;
+}
+/**
+ *
+ * @param feat
+ */
+export function getChoices(feat) {
+    return feat.choices;
+}
+/**
+ *
+ * @param feat
+ */
+export function getModifiers(feat) {
+    return feat.modifiers;
+}
+/**
+ *
+ * @param feat
+ */
+export function getSpells(feat) {
+    return feat.spells;
+}
+/**
+ *
+ * @param feat
+ */
+export function getDataOrigin(feat) {
+    return feat.dataOrigin;
+}
+/**
+ *
+ * @param feat
+ */
+export function getDataOriginType(feat) {
+    const dataOrigin = getDataOrigin(feat);
+    return dataOrigin.type;
+}
+/**
+ *
+ * @param feat
+ */
+export function getDefinitionSources(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.sources) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param feat
+ */
+export function getSources(feat) {
+    return getDefinitionSources(feat);
+}
+/**
+ *
+ * @param feat
+ */
+export function getDefinitionIsHomebrew(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.isHomebrew) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param feat
+ */
+export function isHomebrew(feat) {
+    return getDefinitionIsHomebrew(feat);
+}
+/**
+ *
+ * @param feat
+ */
+export function getCategories(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.categories) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param feat
+ */
+export function getDefinitionIsRepeatable(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.isRepeatable) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param feat
+ */
+export function isRepeatable(feat) {
+    return getDefinitionIsRepeatable(feat);
+}
+/**
+ *
+ * @param feat
+ */
+export function getDefinitionRepeatableParentId(feat) {
+    var _a, _b;
+    return (_b = (_a = feat.definition) === null || _a === void 0 ? void 0 : _a.repeatableParentId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param feat
+ */
+export function getRepeatableParentId(feat) {
+    return getDefinitionRepeatableParentId(feat);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Feat/generators.js b/ddb_main/packages/rules-engine/es/engine/Feat/generators.js
new file mode 100644
index 0000000..814486c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Feat/generators.js
@@ -0,0 +1,344 @@
+import { groupBy, keyBy } from 'lodash';
+import { FeatAccessors } from '.';
+import { ActionGenerators } from '../Action';
+import { BackgroundAccessors } from '../Background';
+import { ChoiceGenerators } from '../Choice';
+import { ClassAccessors } from '../Class';
+import { ClassFeatureAccessors } from '../ClassFeature';
+import { EntityTypeEnum, INITIAL_ASI_TAG_NAME, DISPLAY_WITH_DATA_ORIGIN_TAG_NAME, BuilderChoiceTypeEnum, } from '../Core';
+import { CreatureRuleGenerators } from '../CreatureRule';
+import { DataOriginDataInfoKeyEnum, DataOriginGenerators, DataOriginTypeEnum, } from '../DataOrigin';
+import { tryGetParentId, tryGetPrimaryId } from '../Entity/utils';
+import { HelperUtils } from '../Helper';
+import { ModifierGenerators } from '../Modifier';
+import { OptionAccessors, OptionGenerators } from '../Option';
+import { RaceAccessors } from '../Race';
+import { SpellGenerators } from '../Spell';
+import { getComponentId, getComponentTypeId, getCreatureRules, getEntityTypeId, getId, getModifiers, getOptions, getUniqueKey, } from './accessors';
+/**
+ *
+ * @param feat
+ */
+export function generateDataOriginKey(feat) {
+    const componentId = getComponentId(feat);
+    const componentTypeId = getComponentTypeId(feat);
+    return DataOriginGenerators.generateDataOriginKey(componentId ? componentId : -1, componentTypeId ? componentTypeId : -1);
+}
+/**
+ *
+ * @param feats
+ * @param optionLookup
+ * @param actionLookup
+ * @param choiceLookup
+ * @param modifierLookup
+ * @param spellLookup
+ * @param valueLookup
+ * @param spellListDataOriginLookup
+ * @param ruleData
+ */
+export function generateBaseFeats(feats, optionLookup, actionLookup, choiceLookup, modifierLookup, spellLookup, valueLookup, spellListDataOriginLookup, ruleData) {
+    return feats.map((feat) => generateBaseFeat(feat, optionLookup, actionLookup, choiceLookup, modifierLookup, spellLookup, valueLookup, spellListDataOriginLookup, ruleData));
+}
+/**
+ *
+ * @param feat
+ * @param optionLookup
+ * @param actionLookup
+ * @param choiceLookup
+ * @param modifierLookup
+ * @param spellLookup
+ * @param valueLookup
+ * @param spellListDataOriginLookup
+ * @param ruleData
+ */
+export function generateBaseFeat(feat, optionLookup, actionLookup, choiceLookup, modifierLookup, spellLookup, valueLookup, spellListDataOriginLookup, ruleData) {
+    const id = getId(feat);
+    const entityTypeId = getEntityTypeId(feat);
+    const actions = ActionGenerators.generateBaseActions(id, entityTypeId, actionLookup, valueLookup, DataOriginTypeEnum.FEAT, feat);
+    const choices = ChoiceGenerators.generateBaseChoices(id, entityTypeId, choiceLookup, DataOriginTypeEnum.FEAT, feat);
+    const spells = SpellGenerators.generateBaseSpells(id, entityTypeId, spellLookup, DataOriginTypeEnum.FEAT, feat, feat, ruleData, spellListDataOriginLookup, valueLookup);
+    const modifiers = ModifierGenerators.generateModifiers(id, entityTypeId, modifierLookup, DataOriginTypeEnum.FEAT, feat, feat);
+    const options = generateBaseFeatOptions(feat, actionLookup, spellLookup, optionLookup, modifierLookup, valueLookup, spellListDataOriginLookup, ruleData);
+    return Object.assign(Object.assign({}, feat), { actions,
+        choices,
+        spells,
+        modifiers,
+        options });
+}
+/**
+ * Returns a lookup mapping of Feat List Contracts by Feat List ID,
+ * for any Feat Lists that come from the Background.
+ */
+function getBackgroundFeatListsById(background) {
+    const mapping = new Map();
+    if (!background)
+        return mapping;
+    for (const featList of BackgroundAccessors.getFeatListContracts(background)) {
+        mapping.set(featList.id, featList);
+    }
+    return mapping;
+}
+/**
+ * Returns a lookup mapping of Feat List Contracts by Feat List ID,
+ * for any Feat Lists that come from Class Features.
+ */
+function getClassFeatureFeatListsById(classes) {
+    const mapping = new Map();
+    for (const cls of classes) {
+        for (const clsFeature of ClassAccessors.getClassFeatures(cls)) {
+            const featLists = ClassFeatureAccessors.getFeatListContracts(clsFeature);
+            for (const featList of featLists) {
+                mapping.set(featList.id, featList);
+            }
+        }
+    }
+    return mapping;
+}
+/**
+ * Returns a lookup mapping of Class Features by Feat List ID,
+ * for any Feat Lists that come from Class Features.
+ */
+function getClassFeaturesByFeatListId(classes) {
+    // this assumes a feat list only belongs to one class feature
+    const mapping = new Map();
+    for (const cls of classes) {
+        for (const clsFeature of ClassAccessors.getClassFeatures(cls)) {
+            const featLists = ClassFeatureAccessors.getFeatListContracts(clsFeature);
+            for (const featList of featLists) {
+                mapping.set(featList.id, clsFeature);
+            }
+        }
+    }
+    return mapping;
+}
+export function generateAggregatedFeats(baseFeats, classes, race, background, choicesFromClasses) {
+    const feats = [];
+    classes.forEach((charClass) => {
+        feats.push(...ClassAccessors.getFeats(charClass));
+    });
+    if (race) {
+        feats.push(...RaceAccessors.getFeats(race));
+    }
+    // Group entities by FeatList ID
+    const backgroundFeatListsById = getBackgroundFeatListsById(background);
+    const classFeatureFeatListsById = getClassFeatureFeatListsById(classes);
+    const classFeaturesByFeatListId = getClassFeaturesByFeatListId(classes);
+    baseFeats.forEach((feat) => {
+        if (feat.componentId === null) {
+            feats.push(Object.assign(Object.assign({}, feat), { dataOrigin: DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.ADHOC, feat) }));
+        }
+        else if (feat.componentTypeId === EntityTypeEnum.FEAT_LIST) {
+            // Find which entity this feat list comes from
+            const featListId = feat.componentId;
+            if (backgroundFeatListsById.has(featListId)) {
+                const featListContract = backgroundFeatListsById.get(featListId);
+                feats.push(Object.assign(Object.assign({}, feat), { dataOrigin: DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.FEAT_LIST, featListContract, // primary
+                    background, // parent
+                    DataOriginTypeEnum.BACKGROUND) }));
+            }
+            else if (classFeatureFeatListsById.has(featListId)) {
+                const featListContract = classFeatureFeatListsById.get(featListId);
+                const classFeature = classFeaturesByFeatListId.get(featListId);
+                feats.push(Object.assign(Object.assign({}, feat), { dataOrigin: DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.FEAT_LIST, featListContract, // primary
+                    classFeature, // parent
+                    DataOriginTypeEnum.CLASS_FEATURE) }));
+            }
+        }
+        else if (feat.componentTypeId === EntityTypeEnum.CLASS_FEATURE_OPTION_KNOWN) {
+            // These are feats that come from class feature options.
+            // Primary data origin is the class feature.
+            // Parent data origin is the class.
+            const dataOrigin = findClassFeatureOptionFeatDataOrigin(feat, classes, choicesFromClasses);
+            if (dataOrigin) {
+                feats.push(Object.assign(Object.assign({}, feat), { dataOrigin }));
+            }
+        }
+    });
+    return feats;
+}
+function findClassFeatureOptionFeatDataOrigin(feat, classes, choicesFromClasses) {
+    // It's not exactly a hack, but it is tricky to find the data origin
+    // for Feats that come from Class Feature Options.
+    // Search for the corresponding builder choice for this feat id.
+    const featId = FeatAccessors.getId(feat);
+    const choice = choicesFromClasses.find((c) => c.type === BuilderChoiceTypeEnum.FEAT_CHOICE_OPTION && c.optionValue === featId);
+    // Ensure that the builder choice has a parent, and the component type is the expected kind.
+    if ((choice === null || choice === void 0 ? void 0 : choice.parentChoiceId) && choice.componentTypeId === EntityTypeEnum.CLASS_FEATURE) {
+        // The parent choice key has the slot id in the second part.
+        const slotId = parseChoiceKey(choice.parentChoiceId)[1];
+        // Confirm that this slot matches the component id of the feat
+        if (slotId && feat.componentId === slotId) {
+            // The class feature id is the component id of the builder choice.
+            const classFeatureId = choice.componentId;
+            // Find the class and class feature that it came from
+            for (const cls of classes) {
+                for (const classFeature of ClassAccessors.getClassFeatures(cls)) {
+                    if (ClassFeatureAccessors.getId(classFeature) === classFeatureId) {
+                        // Make the data origin. Finally!
+                        return DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.CLASS_FEATURE, // primary type
+                        classFeature, // primary
+                        cls, // parent
+                        DataOriginTypeEnum.CLASS);
+                    }
+                }
+            }
+        }
+    }
+    return null;
+}
+function parseChoiceKey(choiceKey) {
+    // choice keys are hyphen separated strings of numbers, with 1, 2, or 3 parts.
+    return choiceKey.split('-').map((part) => parseInt(part));
+}
+/**
+ *
+ * @param feats
+ */
+export function generateFeatComponentLookup(feats) {
+    return groupBy(feats, (feat) => generateDataOriginKey(feat));
+}
+/**
+ *
+ * @param feats
+ */
+export function generateFeatLookup(feats) {
+    return keyBy(feats, (feat) => getId(feat));
+}
+/**
+ *
+ * @param feats
+ * @param xpInfo
+ * @param ruleData
+ */
+export function generateFeatCreatureRules(feats, xpInfo, ruleData) {
+    const rules = [];
+    feats.forEach((feat) => {
+        const dataOrigin = DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.FEAT, feat);
+        const featureRules = getCreatureRules(feat);
+        featureRules.forEach((rule) => {
+            rules.push(CreatureRuleGenerators.generateRule(rule, dataOrigin, xpInfo, ruleData));
+        });
+    });
+    return rules;
+}
+/**
+ *
+ * @param feat
+ * @param actionLookup
+ * @param spellLookup
+ * @param optionLookup
+ * @param modifierLookup
+ * @param valueLookup
+ * @param spellListDataOriginLookup
+ * @param ruleData
+ */
+export function generateBaseFeatOptions(feat, actionLookup, spellLookup, optionLookup, modifierLookup, valueLookup, spellListDataOriginLookup, ruleData) {
+    const featId = getId(feat);
+    const featEntityTypeId = getEntityTypeId(feat);
+    const baseOptions = OptionGenerators.generateDataOriginBaseOptions(featId, featEntityTypeId, optionLookup, DataOriginTypeEnum.FEAT, feat);
+    return OptionGenerators.generateOptions(baseOptions, DataOriginTypeEnum.FEAT, {}, actionLookup, spellLookup, optionLookup, modifierLookup, valueLookup, spellListDataOriginLookup, ruleData, feat);
+}
+/**
+ *
+ * @param id
+ * @param entityTypeId
+ * @param featLookup
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ */
+export function generateDataOriginFeats(id, entityTypeId, featLookup, dataOriginType, primary, parent = null) {
+    const feats = HelperUtils.lookupDataOrFallback(featLookup, DataOriginGenerators.generateDataOriginKey(id, entityTypeId));
+    if (!feats) {
+        return [];
+    }
+    return feats.map((feat) => (Object.assign(Object.assign({}, feat), { dataOrigin: DataOriginGenerators.generateDataOrigin(dataOriginType, primary, parent) })));
+}
+/**
+ *
+ * @param feats
+ */
+export function generateFeatModifiers(feats) {
+    const modifiers = [];
+    if (feats.length === 0) {
+        return modifiers;
+    }
+    feats.forEach((feat) => {
+        modifiers.push(...getModifiers(feat));
+        getOptions(feat).forEach((option) => {
+            modifiers.push(...OptionAccessors.getModifiers(option));
+        });
+    });
+    return modifiers;
+}
+/**
+ *
+ * @param feats
+ */
+export function generateRefFeatData(feats) {
+    let data = {};
+    feats.forEach((feat) => {
+        data[getUniqueKey(feat)] = {
+            [DataOriginDataInfoKeyEnum.PRIMARY]: feat,
+            [DataOriginDataInfoKeyEnum.PARENT]: null,
+        };
+    });
+    return data;
+}
+export function generateIsInitialAsiFromFeat(feats) {
+    return feats.some((feat) => FeatAccessors.getCategories(feat).some((cat) => cat.tagName === INITIAL_ASI_TAG_NAME));
+}
+export function generateStandardFeats(feats) {
+    return feats.filter((feat) => !FeatAccessors.getCategories(feat).some((cat) => cat.tagName === DISPLAY_WITH_DATA_ORIGIN_TAG_NAME));
+}
+const makeLookup = () => ({
+    [DataOriginTypeEnum.ADHOC]: {},
+    [DataOriginTypeEnum.BACKGROUND]: {},
+    [DataOriginTypeEnum.CLASS]: {},
+    [DataOriginTypeEnum.CLASS_FEATURE]: {},
+    [DataOriginTypeEnum.CONDITION]: {},
+    [DataOriginTypeEnum.CUSTOM]: {},
+    [DataOriginTypeEnum.FEAT]: {},
+    [DataOriginTypeEnum.ITEM]: {},
+    [DataOriginTypeEnum.RACE]: {},
+    [DataOriginTypeEnum.RULE_DATA]: {},
+    [DataOriginTypeEnum.SIMULATED]: {},
+    [DataOriginTypeEnum.UNKNOWN]: {},
+    [DataOriginTypeEnum.VEHICLE]: {},
+    [DataOriginTypeEnum.FEAT_LIST]: {},
+});
+/**
+ * Builds a multilayered lookup object for feats that are tagged as data origin only.
+ */
+export function generateDataOriginPairedFeats(feats) {
+    const dataOriginOnly = feats.filter((feat) => FeatAccessors.getCategories(feat).some((cat) => cat.tagName === DISPLAY_WITH_DATA_ORIGIN_TAG_NAME));
+    const lookup = { byPrimary: makeLookup(), byParent: makeLookup() };
+    for (const feat of dataOriginOnly) {
+        const dataOrigin = FeatAccessors.getDataOrigin(feat);
+        // primary
+        if (dataOrigin.primary) {
+            const id = tryGetPrimaryId(dataOrigin);
+            if (id) {
+                if (!lookup.byPrimary[dataOrigin.type].hasOwnProperty(id)) {
+                    lookup.byPrimary[dataOrigin.type][id] = [feat];
+                }
+                else {
+                    lookup.byPrimary[dataOrigin.type][id].push(feat);
+                }
+            }
+        }
+        // parent
+        if (dataOrigin.parent && dataOrigin.parentType) {
+            const id = tryGetParentId(dataOrigin);
+            if (id) {
+                if (!lookup.byParent[dataOrigin.parentType].hasOwnProperty(id)) {
+                    lookup.byParent[dataOrigin.parentType][id] = [feat];
+                }
+                else {
+                    lookup.byParent[dataOrigin.parentType][id].push(feat);
+                }
+            }
+        }
+    }
+    return lookup;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Feat/index.js b/ddb_main/packages/rules-engine/es/engine/Feat/index.js
new file mode 100644
index 0000000..ed0f8ed
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Feat/index.js
@@ -0,0 +1,8 @@
+import * as FeatAccessors from './accessors';
+import * as FeatGenerators from './generators';
+import * as FeatSimulators from './simulators';
+import * as FeatTypings from './typings';
+import * as FeatUtils from './utils';
+export * from './typings';
+export { FeatAccessors, FeatGenerators, FeatSimulators, FeatUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, FeatAccessors), FeatGenerators), FeatSimulators), FeatTypings), FeatUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Feat/simulators.js b/ddb_main/packages/rules-engine/es/engine/Feat/simulators.js
new file mode 100644
index 0000000..67953b6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Feat/simulators.js
@@ -0,0 +1,19 @@
+import { DataOriginGenerators, DataOriginTypeEnum } from '../DataOrigin';
+/**
+ *
+ * @param definition
+ */
+export function simulateFeat(definition) {
+    return {
+        dataOrigin: DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.SIMULATED),
+        actions: [],
+        definition,
+        definitionId: definition.id,
+        componentId: -1,
+        componentTypeId: -1,
+        choices: [],
+        spells: [],
+        modifiers: [],
+        options: [],
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Feat/utils.js b/ddb_main/packages/rules-engine/es/engine/Feat/utils.js
new file mode 100644
index 0000000..d258fb5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Feat/utils.js
@@ -0,0 +1,50 @@
+import { FeatAccessors } from '.';
+import { DB_STRING_ELDRITCH_ADEPT, DB_STRING_MEDIUM_ARMOR_MASTER, DISGUISE_FEAT_TAG_NAME, INITIAL_ASI_TAG_NAME, } from '../Core';
+import { getId, getName, getRepeatableParentId, isRepeatable } from './accessors';
+/**
+ *
+ * @param feat
+ */
+export function isEldritchAdept(feat) {
+    return getName(feat) === DB_STRING_ELDRITCH_ADEPT;
+}
+export function isMediumArmorMaster(feat) {
+    return getName(feat) === DB_STRING_MEDIUM_ARMOR_MASTER;
+}
+export function doesTagSatisfyConstraint(tag, constraint) {
+    return tag.entityTagId === constraint.entityTagId;
+}
+export function doesSatisfyTagConstraints(tags, constraints) {
+    // For every constraint C,
+    return constraints.every((constraint) => {
+        // There exists at least one tag T such that
+        return tags.some((tag) => {
+            // T satisfies/matches C (i.e. T.entityTagId === C.entityTagId)
+            return this.doesTagSatisfyConstraint(tag, constraint);
+        });
+    });
+}
+/*
+ * Some feats, such as the ASI feats granted to new backgrounds
+ * aren't Feats in the official sense. We're just using the feat
+ * data structure to support other rules.
+ * Another example is the Weapon Mastery class feature, which
+ * actually just grants a special Weapon Mastery feat.
+ *
+ * Returns true when it is representing something other than a feat.
+ * Returns false when the feat is a real feat from the rules.
+ */
+export function isHiddenFeat(feat) {
+    return FeatAccessors.getCategories(feat).some(
+    // TODO: Consider simplifying the logic by adding the __DISGUISE_FEAT tag to initial ASI feats.
+    (cat) => cat.tagName === INITIAL_ASI_TAG_NAME || cat.tagName === DISGUISE_FEAT_TAG_NAME);
+}
+/**
+ * @param feat
+ */
+export const getRepeatableGroupId = (feat) => {
+    if (!isRepeatable(feat)) {
+        return null;
+    }
+    return getRepeatableParentId(feat) || getId(feat);
+};
diff --git a/ddb_main/packages/rules-engine/es/engine/FeatList/FeatList.js b/ddb_main/packages/rules-engine/es/engine/FeatList/FeatList.js
new file mode 100644
index 0000000..0ed28cb
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/FeatList/FeatList.js
@@ -0,0 +1,78 @@
+import { sortBy } from 'lodash';
+import { characterActions } from "../../actions";
+import { getDispatch } from '../../config/utils';
+import { EntityTypeEnum } from '../Core';
+import { DataOriginTypeEnum } from '../DataOrigin';
+export class FeatList {
+    constructor(definition, definitionKeyNameMap, baseFeats) {
+        this.definition = definition;
+        this.baseFeatLookup = this.buildBaseFeatLookup(baseFeats);
+        this.availableChoices = this.buildChoices(definitionKeyNameMap);
+        this.chosenFeatId = this.findChosenFeatId(baseFeats);
+    }
+    buildBaseFeatLookup(baseFeats) {
+        var _a;
+        // Group the character's feats by id
+        const baseFeatLookup = {};
+        for (const baseFeat of baseFeats) {
+            const featId = ((_a = baseFeat.definition) === null || _a === void 0 ? void 0 : _a.id) || baseFeat.definitionId;
+            baseFeatLookup[featId] = baseFeat;
+        }
+        return baseFeatLookup;
+    }
+    buildChoices(definitionKeyNameMap) {
+        let choices = [];
+        for (const featId of this.definition.featIds) {
+            // If the character already has a feat from somewhere else, don't include it in the list of choices.
+            // Do include the feat if the character has the feat because of this feat list.
+            if (!this.baseFeatLookup.hasOwnProperty(featId) ||
+                (this.baseFeatLookup.hasOwnProperty(featId) &&
+                    this.baseFeatLookup[featId].componentTypeId === EntityTypeEnum.FEAT_LIST &&
+                    this.baseFeatLookup[featId].componentId === this.definition.id)) {
+                const defKey = `${DataOriginTypeEnum.FEAT}:${featId}`;
+                if (definitionKeyNameMap.hasOwnProperty(defKey)) {
+                    choices.push({ value: featId, label: definitionKeyNameMap[defKey] });
+                }
+            }
+        }
+        choices = sortBy(choices, (x) => x.label);
+        return choices;
+    }
+    findChosenFeatId(baseFeats) {
+        var _a;
+        for (const baseFeat of baseFeats) {
+            if (baseFeat.componentTypeId === EntityTypeEnum.FEAT_LIST && baseFeat.componentId === this.definition.id) {
+                return ((_a = baseFeat.definition) === null || _a === void 0 ? void 0 : _a.id) || baseFeat.definitionId;
+            }
+        }
+        return null;
+    }
+    hasChoiceToMake() {
+        return this.chosenFeatId === null && this.availableChoices.length > 0;
+    }
+    isSingleFeat() {
+        // Sometimes FeatLists only have one Feat in them. In that case, the backend
+        // would have already assigned the Feat to the Character.
+        // In that case, there's no choice to make - just show the Feat to the user.
+        return (this.chosenFeatId !== null &&
+            this.definition.featIds.length === 1 &&
+            this.definition.featIds[0] === this.chosenFeatId);
+    }
+    isEmpty() {
+        // Due to entitlements, it is possible that all of the choices got filtered out.
+        // Or, the feat list was configured incorrectly, with no feats!
+        return this.chosenFeatId === null && this.definition.featIds.length === 0;
+    }
+    alreadyHasEveryFeat() {
+        // Since you can get Feats from various places, it is possible that there is nothing to
+        // show to the user because they already have the feat(s).
+        return this.definition.featIds.every((x) => this.baseFeatLookup.hasOwnProperty(x));
+    }
+    handleChoiceSelected(newValue, oldValue, accept, reject) {
+        const featId = parseInt(newValue, 10);
+        this.chosenFeatId = featId !== -1 ? featId : null;
+        const action = characterActions.setEntityFeat(this.chosenFeatId, this.definition.id, EntityTypeEnum.FEAT_LIST);
+        getDispatch()(action);
+        accept();
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/FeatureFlagInfo/constants.js b/ddb_main/packages/rules-engine/es/engine/FeatureFlagInfo/constants.js
new file mode 100644
index 0000000..e6ccc50
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/FeatureFlagInfo/constants.js
@@ -0,0 +1,27 @@
+export var FeatureFlagEnum;
+(function (FeatureFlagEnum) {
+    // Brian added this in 06/2021 expected to be removed in 10/2021
+    FeatureFlagEnum["RELEASE_GATE_IMS"] = "release-gate-ims";
+    // Julie added this on 4/19/22 expected to be removed in ?? TODO
+    FeatureFlagEnum["RELEASE_GATE_GFS_BLESSINGS_UI"] = "release-gate-gfs-blessings-ui";
+    // Brian added this on 10/24/22 expected to remove in 11/2022
+    FeatureFlagEnum["RELEASE_GATE_CAMPAIGN_SETTINGS"] = "release-gate-character-sheet-campaign-settings";
+    // Tim added this on 02/23/23 expected to remove in ??
+    FeatureFlagEnum["RELEASE_GATE_CHARACTER_SHEET_TOUR"] = "release-gate-character-sheet-tour";
+    // Brittany added this on 2/24/2023
+    FeatureFlagEnum["RELEASE_GATE_PREMADE_CHARACTERS"] = "release-gate-premade-characters";
+})(FeatureFlagEnum || (FeatureFlagEnum = {}));
+export const FEATURE_FLAG_LIST = [
+    FeatureFlagEnum.RELEASE_GATE_IMS,
+    FeatureFlagEnum.RELEASE_GATE_GFS_BLESSINGS_UI,
+    FeatureFlagEnum.RELEASE_GATE_CAMPAIGN_SETTINGS,
+    FeatureFlagEnum.RELEASE_GATE_CHARACTER_SHEET_TOUR,
+    FeatureFlagEnum.RELEASE_GATE_PREMADE_CHARACTERS,
+];
+export const DEFAULT_FEATURE_FLAG_INFO = {
+    [FeatureFlagEnum.RELEASE_GATE_IMS]: false,
+    [FeatureFlagEnum.RELEASE_GATE_GFS_BLESSINGS_UI]: false,
+    [FeatureFlagEnum.RELEASE_GATE_CAMPAIGN_SETTINGS]: false,
+    [FeatureFlagEnum.RELEASE_GATE_CHARACTER_SHEET_TOUR]: false,
+    [FeatureFlagEnum.RELEASE_GATE_PREMADE_CHARACTERS]: false,
+};
diff --git a/ddb_main/packages/rules-engine/es/engine/FeatureFlagInfo/index.js b/ddb_main/packages/rules-engine/es/engine/FeatureFlagInfo/index.js
new file mode 100644
index 0000000..a4edf01
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/FeatureFlagInfo/index.js
@@ -0,0 +1,6 @@
+import * as FeatureFlagInfoTypings from './typings';
+import * as FeatureFlagInfoUtils from './utils';
+export * from './typings';
+export * from './constants';
+export { FeatureFlagInfoUtils };
+export default Object.assign(Object.assign({}, FeatureFlagInfoTypings), FeatureFlagInfoUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/FeatureFlagInfo/utils.js b/ddb_main/packages/rules-engine/es/engine/FeatureFlagInfo/utils.js
new file mode 100644
index 0000000..14e2b03
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/FeatureFlagInfo/utils.js
@@ -0,0 +1,8 @@
+/**
+ *
+ * @param key
+ * @param featureFlagInfo
+ */
+export function getFeatureFlagInfoValue(key, featureFlagInfo) {
+    return featureFlagInfo[key];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Format/index.js b/ddb_main/packages/rules-engine/es/engine/Format/index.js
new file mode 100644
index 0000000..276d0b4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Format/index.js
@@ -0,0 +1,3 @@
+import * as FormatUtils from './utils';
+export { FormatUtils };
+export default Object.assign({}, FormatUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Format/utils.js b/ddb_main/packages/rules-engine/es/engine/Format/utils.js
new file mode 100644
index 0000000..1d72d70
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Format/utils.js
@@ -0,0 +1,278 @@
+import { CoreUtils, FEET_IN_MILES, POUNDS_IN_TON } from '../Core';
+/**
+ * Gets the ordinal suffix for the specified number
+ * @param number The number to get the suffix for
+ */
+export function getOrdinalSuffix(number) {
+    switch (number) {
+        case 1:
+            return 'st';
+        case 2:
+            return 'nd';
+        case 3:
+            return 'rd';
+        default:
+            return 'th';
+    }
+}
+/**
+ * Converts the specified number to an ordinal string
+ * @param number The number to convert
+ */
+export function ordinalize(number) {
+    let ret = '';
+    switch (number) {
+        case 1:
+            ret = '1st';
+            break;
+        case 2:
+            ret = '2nd';
+            break;
+        case 3:
+            ret = '3rd';
+            break;
+        default:
+            ret = `${number}th`;
+    }
+    return ret;
+}
+/**
+ *
+ * @param str
+ * @param fallback
+ */
+export function cobaltSlugify(str, fallback = '') {
+    if (!str) {
+        return fallback;
+    }
+    return (str
+        // nonAsciiRegex removal
+        .replace(/[^\x00-\x7F]/g, '')
+        .toLowerCase()
+        // single quotes
+        .replace(/'/g, '')
+        // remove entities, replace with a space.
+        .replace(/&\w+;/g, ' ')
+        // replace any non-word character with a space.
+        .replace(/\W+/g, ' ')
+        // remove any leading or trailing whitespace.
+        .trim()
+        // change any spaces to dashes
+        .replace(/\s+/g, '-')
+        // remove start dashes
+        .replace(/^-+/, '')
+        // remove end dashes
+        .replace(/-+$/, ''));
+}
+/**
+ * Formats the specified string as a slug and will fallback on the optional argument
+ * if the specified string is null
+ * @param str The string to be formatted
+ * @param fallback The fallback if the str argument is null
+ */
+export function slugify(str, fallback = '') {
+    if (!str) {
+        return fallback;
+    }
+    return str
+        .toLowerCase()
+        .replace(/[^\w\d\-_]+/g, '-')
+        .replace(/[\-]+/g, '-')
+        .replace(/^-/, '')
+        .replace(/-$/, '');
+}
+/**
+ * Formats the specified string as a slug in camelCase format
+ * and will fallback to the optional argument if the specified string is null
+ * @param str The string to be formatted
+ * @param fallback The fallback if the str argument is null
+ */
+export function camelSlugify(str, fallback = '') {
+    if (!str) {
+        return fallback;
+    }
+    const result = slugify(str, fallback).replace(new RegExp('[-][a-z]', 'ig'), (s) => s.substr(1, 1).toUpperCase());
+    return result.charAt(0).toLowerCase() + result.slice(1);
+}
+/**
+ *
+ * @param str
+ * @param fallback
+ */
+export function stripTooltipTags(str, fallback = '') {
+    if (!str) {
+        return fallback;
+    }
+    return str.replace(/\[[^\]]+]([^;\]]*?);?([^;\]]*?)\[\/[^\]]+]/g, '$2');
+}
+/**
+ * Formats the specified number as a distance with the appropriate unit
+ * @param distance The distance measured in feet to format
+ */
+export function renderDistance(distance) {
+    let displayNumber = distance;
+    let label = 'ft.';
+    if (distance !== 0 && distance % FEET_IN_MILES === 0) {
+        displayNumber = CoreUtils.convertFeetToMiles(distance);
+        label = `mile${Math.abs(displayNumber) === 1 ? '' : 's'}`;
+    }
+    return `${displayNumber} ${label}`;
+}
+/**
+ * Formats the specified number as a weight with unit
+ * @param weight The weight expressed as a number
+ */
+export function renderWeight(weight) {
+    return `${Math.ceil(weight)} lb`;
+}
+/**
+ *
+ * @param weight
+ */
+export function renderWeightTons(weight) {
+    const weightTons = weight / POUNDS_IN_TON;
+    if (weightTons === 1) {
+        return `${weightTons} ton`;
+    }
+    const roundedWeight = Math.round(weightTons * 100) / 100;
+    return `${roundedWeight} tons`;
+}
+/**
+ * Formats the specified spell level for display
+ * @param level The spell level
+ */
+export function renderSpellLevelName(level) {
+    let levelName;
+    if (level === 0) {
+        levelName = 'Cantrip';
+    }
+    else {
+        levelName = `${ordinalize(level)} Level`;
+    }
+    return levelName;
+}
+/**
+ * Formats the specified spell level for display in an express form
+ * @param level The spell level
+ */
+export function renderSpellLevelShortName(level) {
+    if (level === 0) {
+        return 'Cantrip';
+    }
+    return ordinalize(level);
+}
+/**
+ * Formats the specified spell level for display in an abbreviated form
+ * @param level The spell level
+ */
+export function renderSpellLevelAbbreviation(level) {
+    let levelName;
+    if (level === 0) {
+        levelName = '- 0 -';
+    }
+    else {
+        levelName = ordinalize(level);
+    }
+    return levelName;
+}
+/**
+ * Wrapper function
+ * @param number
+ */
+export function renderLocaleNumber(number) {
+    return number.toLocaleString();
+}
+/**
+ * Formats a specified numeric representation of challenge rating for display
+ * @param challengeRating The challenge rating to format
+ */
+export function renderChallengeRating(challengeRating) {
+    switch (challengeRating) {
+        case 0.125:
+            return '1/8';
+        case 0.25:
+            return '1/4';
+        case 0.5:
+            return '1/2';
+        default:
+            return renderLocaleNumber(challengeRating);
+    }
+}
+/**
+ * Formats the specified number for display with an explicit sign (positive or negative)
+ * and represents commonly used decimal numbers as fractions
+ * @param number The number to format for display
+ */
+export function renderSignedNumber(number) {
+    return number >= 0 ? `+${number}` : renderLocaleNumber(number);
+}
+/**
+ * Converts a substring from uppercase letters to lowercase within a specified string
+ * @param str The string to perform the operation on
+ * @param start The start index in str
+ * @param length The number of characters to lowercase
+ */
+export function lowerCaseLetters(str, start, length = 1) {
+    let startPart = str.substring(0, start);
+    let lowerStrPart = str.substring(start, start + length);
+    if (lowerStrPart) {
+        lowerStrPart = lowerStrPart.toLowerCase();
+    }
+    const remainingStrPart = str.substring(start + length);
+    return startPart + lowerStrPart + remainingStrPart;
+}
+/**
+ *
+ * @param str
+ */
+export function upperCaseFirstLetterOnly(str) {
+    let firstLetter = str.substring(0, 1);
+    if (firstLetter) {
+        firstLetter = firstLetter.toUpperCase();
+    }
+    return firstLetter + str.substring(1).toLowerCase();
+}
+// renderNonOxfordCommaList(['movement', 'control', 'weapon']);
+// > movement, control and weapon
+// renderNonOxfordCommaList(['control', 'weapon']);
+// > control and weapon
+// renderNonOxfordCommaList(['weapon']);
+// > weapon
+/**
+ *
+ * @param arr
+ */
+export function renderNonOxfordCommaList(arr) {
+    return [arr.slice(0, arr.length - 1).join(', '), arr[arr.length - 1]].filter((text) => text).join(' and ');
+}
+/**
+ *
+ * @param number
+ */
+export function convertSingleDigitIntToWord(number) {
+    switch (number) {
+        case 0:
+            return 'zero';
+        case 1:
+            return 'one';
+        case 2:
+            return 'two';
+        case 3:
+            return 'three';
+        case 4:
+            return 'four';
+        case 5:
+            return 'five';
+        case 6:
+            return 'six';
+        case 7:
+            return 'seven';
+        case 8:
+            return 'eight';
+        case 9:
+            return 'nine';
+        default:
+        //not implemented
+    }
+    return '';
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Helper/index.js b/ddb_main/packages/rules-engine/es/engine/Helper/index.js
new file mode 100644
index 0000000..4056bd0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Helper/index.js
@@ -0,0 +1,3 @@
+import * as HelperUtils from './utils';
+export { HelperUtils };
+export default Object.assign({}, HelperUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Helper/utils.js b/ddb_main/packages/rules-engine/es/engine/Helper/utils.js
new file mode 100644
index 0000000..b0bab94
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Helper/utils.js
@@ -0,0 +1,95 @@
+import { sortBy, reduce } from 'lodash';
+/**
+ *
+ * @param obj - Keyed object to be converted to an array
+ * @returns An array of the object's keys' values
+ */
+export function convertObjectToArray(obj) {
+    return Object.keys(obj).reduce((acc, objKey) => {
+        acc.push(obj[objKey]);
+        return acc;
+    }, []);
+}
+/**
+ *
+ * @param collection
+ * @param sortStrategies
+ */
+export function getLast(collection, sortStrategies = []) {
+    if (!collection.length) {
+        return null;
+    }
+    const lastItem = sortBy(collection, sortStrategies).pop();
+    return lastItem !== null && lastItem !== void 0 ? lastItem : null;
+}
+export function parseInputInt(value, fallback = null) {
+    if (value === '') {
+        return fallback;
+    }
+    if (value === null) {
+        return null;
+    }
+    const number = parseInt(value);
+    if (isNaN(number)) {
+        return fallback;
+    }
+    return number;
+}
+export function parseInputFloat(value, fallback = null) {
+    if (value === '') {
+        return fallback;
+    }
+    if (value === null) {
+        return fallback;
+    }
+    const number = parseFloat(value);
+    if (isNaN(number)) {
+        return fallback;
+    }
+    return number;
+}
+/**
+ *
+ * @param number
+ * @param min
+ * @param max
+ */
+export function clampInt(number, min = null, max = null) {
+    let clampedNumber = number;
+    if (min !== null) {
+        clampedNumber = Math.max(clampedNumber, min);
+    }
+    if (max !== null) {
+        clampedNumber = Math.min(clampedNumber, max);
+    }
+    return clampedNumber;
+}
+/**
+ *
+ */
+export function generateGuid() {
+    function s4() {
+        return Math.floor((1 + Math.random()) * 0x10000)
+            .toString(16)
+            .substring(1);
+    }
+    return `${s4() + s4()}-${s4()}-${s4()}-${s4()}-${s4()}${s4()}${s4()}`;
+}
+export function lookupDataOrFallback(lookup, identifier, fallback = null) {
+    if (!lookup) {
+        return fallback;
+    }
+    if (lookup.hasOwnProperty(identifier)) {
+        return lookup[identifier];
+    }
+    return fallback;
+}
+export function generateNonNullLookup(collection, iterateeFunc) {
+    return reduce(collection, (acc, item) => {
+        const iteratee = iterateeFunc(item);
+        if (iteratee !== null && !acc[iteratee]) {
+            acc[iteratee] = item;
+        }
+        return acc;
+    }, {});
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Infusion/accessors.js b/ddb_main/packages/rules-engine/es/engine/Infusion/accessors.js
new file mode 100644
index 0000000..8b1b53e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Infusion/accessors.js
@@ -0,0 +1,185 @@
+export function getChoiceKey(infusion) {
+    return infusion.choiceKey;
+}
+export function getCharacterId(infusion) {
+    return infusion.characterId;
+}
+export function getUniqueKey(infusion) {
+    return infusion.uniqueKey;
+}
+export function getCreatureMappingId(infusion) {
+    return infusion.creatureMappingId;
+}
+export function getDefinitionKey(infusion) {
+    return infusion.definitionKey;
+}
+export function getInventoryMappingId(infusion) {
+    return infusion.inventoryMappingId;
+}
+export function getItemId(infusion) {
+    return infusion.itemId;
+}
+export function getItemTypeId(infusion) {
+    return infusion.itemTypeId;
+}
+export function getModifierGroupId(infusion) {
+    return infusion.modifierGroupId;
+}
+export function getMonsterId(infusion) {
+    return infusion.monsterId;
+}
+export function getDefinitionActions(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.actions) !== null && _b !== void 0 ? _b : [];
+}
+export function getActions(infusion) {
+    return getDefinitionActions(infusion);
+}
+export function getDefinitionAllowDuplicates(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.allowDuplicates) !== null && _b !== void 0 ? _b : false;
+}
+export function getAllowDuplicates(infusion) {
+    return getDefinitionAllowDuplicates(infusion);
+}
+export function getDefinitionCreatureData(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.creatureData) !== null && _b !== void 0 ? _b : null;
+}
+export function getCreatureData(infusion) {
+    return getDefinitionCreatureData(infusion);
+}
+export function getDefinitionDefinitionKey(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.definitionKey) !== null && _b !== void 0 ? _b : null;
+}
+export function getDefinitionDescription(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+export function getDescription(infusion) {
+    return getDefinitionDescription(infusion);
+}
+export function getId(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : null;
+}
+export function getDefinitionItemRuleData(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.itemRuleData) !== null && _b !== void 0 ? _b : null;
+}
+export function getItemRuleData(infusion) {
+    return getDefinitionItemRuleData(infusion);
+}
+export function getDefinitionLevel(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.level) !== null && _b !== void 0 ? _b : null;
+}
+export function getLevel(infusion) {
+    return getDefinitionLevel(infusion);
+}
+export function getDefinitionModifierData(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.modifierData) !== null && _b !== void 0 ? _b : [];
+}
+export function getModifierData(infusion) {
+    return getDefinitionModifierData(infusion);
+}
+export function getDefinitionModifierDataType(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.modifierDataType) !== null && _b !== void 0 ? _b : null;
+}
+export function getModifierDataType(infusion) {
+    return getDefinitionModifierDataType(infusion);
+}
+export function getDefinitionName(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : null;
+}
+export function getName(infusion) {
+    return getDefinitionName(infusion);
+}
+export function getDefinitionRequiresAttunement(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.requiresAttunement) !== null && _b !== void 0 ? _b : false;
+}
+export function requiresAttunement(infusion) {
+    return getDefinitionRequiresAttunement(infusion);
+}
+export function getDefinitionSnippet(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.snippet) !== null && _b !== void 0 ? _b : null;
+}
+export function getSnippet(infusion) {
+    return getDefinitionSnippet(infusion);
+}
+export function getDefinitionType(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.type) !== null && _b !== void 0 ? _b : null;
+}
+export function getType(infusion) {
+    return getDefinitionType(infusion);
+}
+/**
+ *
+ * @param infusion
+ */
+export function getAccessType(infusion) {
+    return infusion.accessType;
+}
+/**
+ *
+ * @param infusion
+ */
+export function getSelectedModifierData(infusion) {
+    return infusion.selectedModifierData;
+}
+/**
+ * The deprecation is a lie
+ *
+ * see hack__requiresItemChoice() for details about why
+ *
+ * @deprecated
+ * @param infusion
+ * @returns {boolean}
+ */
+export function requiresItemChoice(infusion) {
+    return infusion.requiresItemChoice;
+}
+/**
+ *
+ * @param infusion
+ */
+export function requiresModifierDataChoice(infusion) {
+    return infusion.requiresModifierDataChoice;
+}
+/**
+ *
+ * @param infusion
+ */
+export function getDefinitionSources(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.sources) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param infusion
+ */
+export function getSources(infusion) {
+    return getDefinitionSources(infusion);
+}
+/**
+ *
+ * @param infusion
+ */
+export function getDefinitionIsHomebrew(infusion) {
+    var _a, _b;
+    return (_b = (_a = infusion.definition) === null || _a === void 0 ? void 0 : _a.isHomebrew) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param infusion
+ */
+export function isHomebrew(infusion) {
+    return getDefinitionIsHomebrew(infusion);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Infusion/constants.js b/ddb_main/packages/rules-engine/es/engine/Infusion/constants.js
new file mode 100644
index 0000000..75d0e2e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Infusion/constants.js
@@ -0,0 +1,20 @@
+export var InfusionTypeEnum;
+(function (InfusionTypeEnum) {
+    InfusionTypeEnum["REPLICATE"] = "replicate";
+    InfusionTypeEnum["AUGMENT"] = "augment";
+    InfusionTypeEnum["CREATURE"] = "creature";
+})(InfusionTypeEnum || (InfusionTypeEnum = {}));
+export var InfusionModifierDataTypeEnum;
+(function (InfusionModifierDataTypeEnum) {
+    InfusionModifierDataTypeEnum["GRANTED"] = "granted";
+    InfusionModifierDataTypeEnum["CLASS_LEVEL"] = "class-level";
+    InfusionModifierDataTypeEnum["DAMAGE_TYPE_CHOICE"] = "damage-type-choice";
+})(InfusionModifierDataTypeEnum || (InfusionModifierDataTypeEnum = {}));
+export var InfusionItemDataRuleTypeEnum;
+(function (InfusionItemDataRuleTypeEnum) {
+    InfusionItemDataRuleTypeEnum["ITEM"] = "item";
+    InfusionItemDataRuleTypeEnum["ARMOR_TYPE"] = "armor-type";
+    InfusionItemDataRuleTypeEnum["WEAPON_CATEGORY"] = "weapon-category";
+    InfusionItemDataRuleTypeEnum["GEAR_TYPE"] = "gear-type";
+    InfusionItemDataRuleTypeEnum["WEAPON_PROPERTY"] = "weapon-property";
+})(InfusionItemDataRuleTypeEnum || (InfusionItemDataRuleTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Infusion/derivers.js b/ddb_main/packages/rules-engine/es/engine/Infusion/derivers.js
new file mode 100644
index 0000000..b4a837e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Infusion/derivers.js
@@ -0,0 +1,42 @@
+import { getModifierData, getModifierDataType, getModifierGroupId, getType } from './accessors';
+import { InfusionModifierDataTypeEnum, InfusionTypeEnum } from './constants';
+/**
+ * TODO this needs to consider item information for knownInfusions to be true.
+ * see hack__requiresItemChoice() for more info
+ *
+ * @param infusion
+ */
+export function deriveRequiresItemChoice(infusion) {
+    return getType(infusion) !== InfusionTypeEnum.REPLICATE;
+}
+/**
+ *
+ * @param infusion
+ */
+export function deriveRequiresModifierDataChoice(infusion) {
+    const modifierDataType = getModifierDataType(infusion);
+    if (modifierDataType === null || modifierDataType === InfusionModifierDataTypeEnum.GRANTED) {
+        return false;
+    }
+    return true;
+}
+/**
+ *
+ * @param infusion
+ */
+export function deriveSelectedModifierData(infusion) {
+    const modifierGroupId = getModifierGroupId(infusion);
+    const modifierData = getModifierData(infusion);
+    const modifierDataType = getModifierDataType(infusion);
+    switch (modifierDataType) {
+        case InfusionModifierDataTypeEnum.GRANTED:
+            return modifierData[0];
+        case InfusionModifierDataTypeEnum.CLASS_LEVEL:
+        case InfusionModifierDataTypeEnum.DAMAGE_TYPE_CHOICE:
+            const foundModifierGroup = modifierData.find((dataItem) => dataItem.id === modifierGroupId);
+            return foundModifierGroup ? foundModifierGroup : null;
+        default:
+        // not implemented
+    }
+    return null;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Infusion/generators.js b/ddb_main/packages/rules-engine/es/engine/Infusion/generators.js
new file mode 100644
index 0000000..56923e0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Infusion/generators.js
@@ -0,0 +1,65 @@
+import { keyBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { DefinitionPoolUtils } from '../DefinitionPool';
+import { HelperUtils } from '../Helper';
+import { getCharacterId, getChoiceKey, getCreatureMappingId, getDefinitionKey, getInventoryMappingId, getUniqueKey, } from './accessors';
+import { deriveRequiresItemChoice, deriveRequiresModifierDataChoice, deriveSelectedModifierData } from './derivers';
+/**
+ *
+ * @param infusions
+ */
+export function generateInventoryInfusionLookup(infusions) {
+    return keyBy(infusions, (infusion) => getInventoryMappingId(infusion));
+}
+/**
+ *
+ * @param infusions
+ */
+export function generateInfusionChoiceInfusionLookup(infusions) {
+    return HelperUtils.generateNonNullLookup(infusions, getUniqueKey);
+}
+/**
+ *
+ * @param infusions
+ */
+export function generateCreatureInfusionLookup(infusions) {
+    return HelperUtils.generateNonNullLookup(infusions, getCreatureMappingId);
+}
+/**
+ *
+ * @param infusionMapping
+ * @param definition
+ */
+export function generateBaseInfusion(infusionMapping, definition) {
+    const characterId = getCharacterId(infusionMapping);
+    const uniqueKey = `${characterId}-${getChoiceKey(infusionMapping)}`;
+    return Object.assign(Object.assign({}, infusionMapping), { definition,
+        uniqueKey });
+}
+/**
+ *
+ * @param infusionMappings
+ * @param definitionPool
+ */
+export function generateInfusions(infusionMappings, definitionPool) {
+    return infusionMappings
+        .map((infusionMapping) => generateInfusion(infusionMapping, definitionPool))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param infusionMapping
+ * @param definitionPool
+ */
+export function generateInfusion(infusionMapping, definitionPool) {
+    const definitionKey = getDefinitionKey(infusionMapping);
+    if (definitionKey === null) {
+        return null;
+    }
+    const definition = DefinitionPoolUtils.getInfusionDefinition(definitionKey, definitionPool);
+    if (definition === null) {
+        return null;
+    }
+    const baseInfusion = generateBaseInfusion(infusionMapping, definition);
+    return Object.assign(Object.assign({}, baseInfusion), { accessType: DefinitionPoolUtils.getDefinitionAccessType(definitionKey, definitionPool), selectedModifierData: deriveSelectedModifierData(baseInfusion), requiresItemChoice: deriveRequiresItemChoice(baseInfusion), requiresModifierDataChoice: deriveRequiresModifierDataChoice(baseInfusion) });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Infusion/hacks.js b/ddb_main/packages/rules-engine/es/engine/Infusion/hacks.js
new file mode 100644
index 0000000..88a4f2b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Infusion/hacks.js
@@ -0,0 +1,34 @@
+import { HelperUtils } from '../Helper';
+import { getType } from './accessors';
+import { InfusionTypeEnum } from './constants';
+/**
+ * This is a temporary workaround til we have item definition game data service.  Once we can
+ * load item definitions as needed, we can fully calculate requiresItemChoice at the
+ * same time as we generate the infusion
+ * @param infusion
+ * @param itemId
+ * @param itemCanBeAddedLookup
+ * @returns {boolean}
+ */
+export function hack__requiresItemChoice(infusion, itemId = null, itemCanBeAddedLookup = {}) {
+    if (getType(infusion) !== InfusionTypeEnum.REPLICATE) {
+        return true;
+    }
+    return !this.hack__itemCanBeAddedToInventory(infusion, itemId, itemCanBeAddedLookup);
+}
+/**
+ *
+ * @param infusion
+ * @param itemId
+ * @param itemCanBeAddedLookup
+ */
+export function hack__itemCanBeAddedToInventory(infusion, itemId, itemCanBeAddedLookup) {
+    if (getType(infusion) !== InfusionTypeEnum.REPLICATE) {
+        return true;
+    }
+    const fallback = false;
+    if (itemId === null) {
+        return fallback;
+    }
+    return HelperUtils.lookupDataOrFallback(itemCanBeAddedLookup, itemId, fallback);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Infusion/index.js b/ddb_main/packages/rules-engine/es/engine/Infusion/index.js
new file mode 100644
index 0000000..01a0e40
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Infusion/index.js
@@ -0,0 +1,13 @@
+import * as InfusionAccessors from './accessors';
+import * as InfusionConstants from './constants';
+import * as InfusionDerivers from './derivers';
+import * as InfusionGenerators from './generators';
+import * as InfusionHacks from './hacks';
+import * as InfusionSimulators from './simulators';
+import * as InfusionTypings from './typings';
+import * as InfusionUtils from './utils';
+import * as InfusionValidators from './validators';
+export * from './typings';
+export * from './constants';
+export { InfusionAccessors, InfusionDerivers, InfusionGenerators, InfusionHacks, InfusionSimulators, InfusionUtils, InfusionValidators, };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, InfusionAccessors), InfusionConstants), InfusionDerivers), InfusionGenerators), InfusionHacks), InfusionSimulators), InfusionTypings), InfusionUtils), InfusionValidators);
diff --git a/ddb_main/packages/rules-engine/es/engine/Infusion/simulators.js b/ddb_main/packages/rules-engine/es/engine/Infusion/simulators.js
new file mode 100644
index 0000000..11cc4c5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Infusion/simulators.js
@@ -0,0 +1,27 @@
+import { DefinitionPoolUtils } from '../DefinitionPool';
+import { deriveRequiresItemChoice, deriveRequiresModifierDataChoice, deriveSelectedModifierData } from './derivers';
+import { generateBaseInfusion } from './generators';
+/**
+ *
+ * @param definitionKey
+ * @param definitionPool
+ */
+export function simulateInfusion(definitionKey, definitionPool) {
+    const infusionDefinition = DefinitionPoolUtils.getInfusionDefinition(definitionKey, definitionPool);
+    if (infusionDefinition === null) {
+        return null;
+    }
+    const simulatedMapping = {
+        characterId: -1,
+        choiceKey: '',
+        creatureMappingId: -1,
+        definitionKey,
+        inventoryMappingId: -1,
+        modifierGroupId: '',
+        monsterId: -1,
+        itemId: -1,
+        itemTypeId: -1,
+    };
+    const baseInfusion = generateBaseInfusion(simulatedMapping, infusionDefinition);
+    return Object.assign(Object.assign({}, baseInfusion), { accessType: DefinitionPoolUtils.getDefinitionAccessType(definitionKey, definitionPool), selectedModifierData: deriveSelectedModifierData(baseInfusion), requiresItemChoice: deriveRequiresItemChoice(baseInfusion), requiresModifierDataChoice: deriveRequiresModifierDataChoice(baseInfusion) });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Infusion/utils.js b/ddb_main/packages/rules-engine/es/engine/Infusion/utils.js
new file mode 100644
index 0000000..f6fdcbf
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Infusion/utils.js
@@ -0,0 +1,26 @@
+import { ItemAccessors } from '../Item';
+import { getItemRuleData } from './accessors';
+import { hack__itemCanBeAddedToInventory } from './hacks';
+import { validateItemByInfusionRules } from './validators';
+/**
+ *
+ * @param items
+ * @param infusion
+ * @param itemId
+ * @param itemCanBeAddedLookup
+ */
+export function filterAvailableItems(items, infusion, itemId = null, itemCanBeAddedLookup = {}) {
+    if (itemId !== null && !hack__itemCanBeAddedToInventory(infusion, itemId, itemCanBeAddedLookup)) {
+        return items.filter((item) => itemId === ItemAccessors.getGroupedId(item));
+    }
+    const itemRuleData = getItemRuleData(infusion);
+    if (itemRuleData === null) {
+        return [];
+    }
+    let availableItems = [];
+    const andRules = itemRuleData.itemRules !== null ? itemRuleData.itemRules : [];
+    if (andRules.length) {
+        availableItems = items.filter((item) => validateItemByInfusionRules(item, andRules));
+    }
+    return availableItems;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Infusion/validators.js b/ddb_main/packages/rules-engine/es/engine/Infusion/validators.js
new file mode 100644
index 0000000..76c26bb
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Infusion/validators.js
@@ -0,0 +1,68 @@
+import { ItemAccessors } from '../Item';
+import { getLevel } from './accessors';
+import { InfusionItemDataRuleTypeEnum } from './constants';
+/**
+ *
+ * @param rule
+ * @param item
+ */
+export function validateItemByCost(rule, item) {
+    if (rule.costMinimum === null) {
+        return true;
+    }
+    return ItemAccessors.getCost(item) >= rule.costMinimum;
+}
+/**
+ *
+ * @param rule
+ * @param item
+ */
+export function validateItemByRuleType(rule, item) {
+    switch (rule.type) {
+        case InfusionItemDataRuleTypeEnum.ARMOR_TYPE:
+            return ItemAccessors.getArmorTypeId(item) === rule.entityId;
+        case InfusionItemDataRuleTypeEnum.GEAR_TYPE:
+            return ItemAccessors.getGearTypeId(item) === rule.entityId;
+        case InfusionItemDataRuleTypeEnum.ITEM:
+            return (ItemAccessors.getDefinitionId(item) === rule.entityId &&
+                ItemAccessors.getDefinitionEntityTypeId(item) === rule.entityTypeId);
+        case InfusionItemDataRuleTypeEnum.WEAPON_PROPERTY:
+            return ItemAccessors.getProperties(item).some((property) => property.id === rule.entityId);
+        case InfusionItemDataRuleTypeEnum.WEAPON_CATEGORY:
+            return ItemAccessors.getCategoryId(item) === rule.entityId;
+        default:
+        // not implemented
+    }
+    return false;
+}
+/**
+ *
+ * @param rule
+ * @param item
+ */
+export function validateItemByItemRule(rule, item) {
+    return (ItemAccessors.getInfusion(item) === null &&
+        !ItemAccessors.isMagic(item) &&
+        validateItemByRuleType(rule, item) &&
+        validateItemByCost(rule, item));
+}
+/**
+ *
+ * @param infusion
+ * @param contextLevel
+ */
+export function validateIsAvailableByContextLevel(infusion, contextLevel) {
+    const infusionLevel = getLevel(infusion);
+    if (contextLevel !== null && infusionLevel !== null && infusionLevel <= contextLevel) {
+        return true;
+    }
+    return false;
+}
+/**
+ *
+ * @param item
+ * @param andRules
+ */
+export function validateItemByInfusionRules(item, andRules) {
+    return andRules.every((andRule) => !!andRule.rules && andRule.rules.some((orRule) => validateItemByItemRule(orRule, item)));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/InfusionChoice/accessors.js b/ddb_main/packages/rules-engine/es/engine/InfusionChoice/accessors.js
new file mode 100644
index 0000000..1e29d4b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/InfusionChoice/accessors.js
@@ -0,0 +1,25 @@
+export function getLevel(infusionChoice) {
+    return infusionChoice.level;
+}
+export function getKey(infusionChoice) {
+    return infusionChoice.choiceKey;
+}
+export function getKnownInfusion(infusionChoice) {
+    return infusionChoice.knownInfusion;
+}
+export function getInfusion(infusionChoice) {
+    return infusionChoice.infusion;
+}
+export function getDataOrigin(infusionChoice) {
+    return infusionChoice.dataOrigin;
+}
+export function getDataOriginType(infusionChoice) {
+    const dataOrigin = getDataOrigin(infusionChoice);
+    return dataOrigin.type;
+}
+export function getForcedModifierData(infusionChoice) {
+    return infusionChoice.forcedModifierData;
+}
+export function canInfuse(infusionChoice) {
+    return infusionChoice.canInfuse;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/InfusionChoice/derivers.js b/ddb_main/packages/rules-engine/es/engine/InfusionChoice/derivers.js
new file mode 100644
index 0000000..bb5c1f8
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/InfusionChoice/derivers.js
@@ -0,0 +1,52 @@
+import { orderBy } from 'lodash';
+import { ClassAccessors } from '../Class';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { InfusionAccessors, InfusionModifierDataTypeEnum, InfusionTypeEnum } from '../Infusion';
+import { KnownInfusionAccessors } from '../KnownInfusion';
+import { getKnownInfusion, getDataOrigin, getDataOriginType } from './accessors';
+/**
+ *
+ * @param infusionChoice
+ */
+export function deriveForcedModifierData(infusionChoice) {
+    const knownInfusion = getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+        return null;
+    }
+    const simulatedInfusion = KnownInfusionAccessors.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+        return null;
+    }
+    const modifierData = InfusionAccessors.getModifierData(simulatedInfusion);
+    const modifierDataType = InfusionAccessors.getModifierDataType(simulatedInfusion);
+    const dataOriginType = getDataOriginType(infusionChoice);
+    if (dataOriginType === DataOriginTypeEnum.CLASS_FEATURE &&
+        modifierDataType === InfusionModifierDataTypeEnum.CLASS_LEVEL) {
+        const dataOrigin = getDataOrigin(infusionChoice);
+        const charClass = dataOrigin.parent;
+        const classLevel = ClassAccessors.getLevel(charClass);
+        const orderedModifierData = orderBy(modifierData, (data) => data.value, 'desc');
+        const foundModifierData = orderedModifierData.find((data) => data.value !== null && classLevel >= data.value);
+        return foundModifierData ? foundModifierData : null;
+    }
+    return null;
+}
+/**
+ *
+ * @param infusionChoice
+ */
+export function deriveCanInfuse(infusionChoice) {
+    const knownInfusion = getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+        return false;
+    }
+    const simulatedInfusion = KnownInfusionAccessors.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+        return false;
+    }
+    if (InfusionAccessors.getType(simulatedInfusion) === InfusionTypeEnum.REPLICATE) {
+        const itemId = KnownInfusionAccessors.getItemId(knownInfusion);
+        return itemId !== null;
+    }
+    return true;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/InfusionChoice/generators.js b/ddb_main/packages/rules-engine/es/engine/InfusionChoice/generators.js
new file mode 100644
index 0000000..918c8e5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/InfusionChoice/generators.js
@@ -0,0 +1,79 @@
+import { TypeScriptUtils } from '../../utils';
+import { ClassAccessors } from '../Class';
+import { ClassFeatureAccessors } from '../ClassFeature';
+import { DataOriginGenerators } from '../DataOrigin';
+import { HelperUtils } from '../Helper';
+import { getKey } from './accessors';
+import { deriveCanInfuse, deriveForcedModifierData } from './derivers';
+import { validateIsAvailable } from './validators';
+/**
+ *
+ * @param infusionChoiceDefinition
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ * @param infusionChoiceInfusionLookup
+ * @param knownInfusionLookupByChoiceKey
+ */
+export function generateDataOriginBaseInfusionChoice(infusionChoiceDefinition, dataOriginType, primary, parent, infusionChoiceInfusionLookup, knownInfusionLookupByChoiceKey, characterId) {
+    const choiceKey = getKey(infusionChoiceDefinition);
+    if (!choiceKey) {
+        return null;
+    }
+    const lookupKey = `${characterId}-${choiceKey}`;
+    return Object.assign(Object.assign({}, infusionChoiceDefinition), { dataOrigin: DataOriginGenerators.generateDataOrigin(dataOriginType, primary, parent), infusion: HelperUtils.lookupDataOrFallback(infusionChoiceInfusionLookup, lookupKey), knownInfusion: HelperUtils.lookupDataOrFallback(knownInfusionLookupByChoiceKey, lookupKey) });
+}
+/**
+ *
+ * @param dataOriginBaseInfusionChoice
+ */
+export function generateInfusionChoice(dataOriginBaseInfusionChoice) {
+    return Object.assign(Object.assign({}, dataOriginBaseInfusionChoice), { forcedModifierData: deriveForcedModifierData(dataOriginBaseInfusionChoice), canInfuse: deriveCanInfuse(dataOriginBaseInfusionChoice) });
+}
+/**
+ *
+ * @param infusionChoices
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ * @param infusionChoiceInfusionLookup
+ * @param knownInfusionLookupByChoiceKey
+ */
+export function generateInfusionChoices(infusionChoices, dataOriginType, primary, parent, infusionChoiceInfusionLookup, knownInfusionLookupByChoiceKey, characterId) {
+    return infusionChoices
+        .map((infusionChoiceDefinition) => {
+        const dataOriginBaseInfusionChoice = generateDataOriginBaseInfusionChoice(infusionChoiceDefinition, dataOriginType, primary, parent, infusionChoiceInfusionLookup, knownInfusionLookupByChoiceKey, characterId);
+        if (!dataOriginBaseInfusionChoice) {
+            return null;
+        }
+        return generateInfusionChoice(dataOriginBaseInfusionChoice);
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param classes
+ */
+export function generateAggregatedInfusionChoices(classes) {
+    const chosenItems = [];
+    classes.forEach((charClass) => {
+        ClassAccessors.getClassFeatures(charClass).forEach((feature) => {
+            chosenItems.push(...ClassFeatureAccessors.getInfusionChoices(feature));
+        });
+    });
+    return chosenItems;
+}
+/**
+ *
+ * @param infusionChoices
+ */
+export function generateAvailableInfusionChoices(infusionChoices) {
+    return infusionChoices.filter(validateIsAvailable);
+}
+/**
+ *
+ * @param infusionChoices
+ */
+export function generateInfusionChoiceLookup(infusionChoices) {
+    return HelperUtils.generateNonNullLookup(infusionChoices, getKey);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/InfusionChoice/index.js b/ddb_main/packages/rules-engine/es/engine/InfusionChoice/index.js
new file mode 100644
index 0000000..cf10fdd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/InfusionChoice/index.js
@@ -0,0 +1,8 @@
+import * as InfusionChoiceAccessors from './accessors';
+import * as InfusionChoiceDerivers from './derivers';
+import * as InfusionChoiceGenerators from './generators';
+import * as InfusionChoiceTypings from './typings';
+import * as InfusionChoiceValidators from './validators';
+export * from './typings';
+export { InfusionChoiceAccessors, InfusionChoiceDerivers, InfusionChoiceGenerators, InfusionChoiceValidators };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, InfusionChoiceAccessors), InfusionChoiceDerivers), InfusionChoiceGenerators), InfusionChoiceTypings), InfusionChoiceValidators);
diff --git a/ddb_main/packages/rules-engine/es/engine/InfusionChoice/validators.js b/ddb_main/packages/rules-engine/es/engine/InfusionChoice/validators.js
new file mode 100644
index 0000000..9896697
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/InfusionChoice/validators.js
@@ -0,0 +1,24 @@
+import { ClassAccessors } from '../Class';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { getLevel, getDataOrigin, getDataOriginType } from './accessors';
+/**
+ *
+ * @param infusionChoice
+ */
+export function validateIsAvailable(infusionChoice) {
+    const dataOrigin = getDataOrigin(infusionChoice);
+    const dataOriginType = getDataOriginType(infusionChoice);
+    if (dataOrigin) {
+        switch (dataOriginType) {
+            case DataOriginTypeEnum.CLASS_FEATURE:
+                const charClass = dataOrigin.parent;
+                if (getLevel(infusionChoice) <= ClassAccessors.getLevel(charClass)) {
+                    return true;
+                }
+                break;
+            default:
+            // not implemented
+        }
+    }
+    return false;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Item/accessors.js b/ddb_main/packages/rules-engine/es/engine/Item/accessors.js
new file mode 100644
index 0000000..2acb6f5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Item/accessors.js
@@ -0,0 +1,1042 @@
+import { StealthCheckTypeEnum } from '../Core';
+/**
+ *
+ * @param item
+ */
+export function getDefinition(item) {
+    return item.definition;
+}
+/**
+ *
+ * @param item
+ */
+export function getUniqueKey(item) {
+    return `${getMappingId(item)}-${getMappingEntityTypeId(item)}`;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionName(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getId(item) {
+    return getDefinitionId(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionId(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param item
+ */
+export function getEntityTypeId(item) {
+    return getDefinitionEntityTypeId(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionEntityTypeId(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.entityTypeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefintionFilterType(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.filterType) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getArmorTypeId(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.armorTypeId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getGearTypeId(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.gearTypeId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getBaseItemId(item) {
+    return getDefinitionBaseItemId(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionBaseItemId(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.baseItemId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionAvatarUrl(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.avatarUrl) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getName(item) {
+    return item.name;
+}
+/**
+ *
+ * @param item
+ */
+export function getDescription(item) {
+    return getDefinitionDescription(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionDescription(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getLargeImageUrl(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.largeAvatarUrl) !== null && _b !== void 0 ? _b : null;
+}
+export function getSpells(item) {
+    return item.spells;
+}
+/**
+ *
+ * @param item
+ */
+export function getTags(item) {
+    return getDefinitionTags(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionTags(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.tags) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param item
+ */
+export function getVersion(item) {
+    return getDefinitionVersion(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionVersion(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.version) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function hasProficiency(item) {
+    return item.proficiency;
+}
+/**
+ *
+ * @param item
+ */
+export function getMappingId(item) {
+    return item.id;
+}
+/**
+ *
+ * @param item
+ */
+export function getContainerEntityId(item) {
+    return item.containerEntityId;
+}
+/**
+ *
+ * @param item
+ */
+export function getContainerEntityTypeId(item) {
+    return item.containerEntityTypeId;
+}
+/**
+ *
+ * @param item
+ */
+export function getContainerDefinitionKey(item) {
+    return item.containerDefinitionKey;
+}
+/**
+ *
+ * @param item
+ */
+export function getMappingEntityTypeId(item) {
+    return item.entityTypeId;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionKey(item) {
+    return item.definitionKey;
+}
+/**
+ *
+ * @param item
+ */
+export function getDisplayAsAttack(item) {
+    return item.displayAsAttack;
+}
+/**
+ *
+ * @param item
+ */
+export function getChargesUsed(item) {
+    return item.chargesUsed;
+}
+/**
+ *
+ * @param item
+ */
+export function getLimitedUse(item) {
+    return item.limitedUse;
+}
+/**
+ *
+ * @param item
+ */
+export function isCustomized(item) {
+    return item.isCustomized;
+}
+/**
+ *
+ * @param item
+ */
+export function isEquipped(item) {
+    return item.equipped;
+}
+/**
+ *
+ * @param item
+ */
+export function canOffhand(item) {
+    return item.canOffhand;
+}
+/**
+ *
+ * @param item
+ */
+export function getCategoryId(item) {
+    return getDefinitionCategoryId(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionCategoryId(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.categoryId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function isConsumable(item) {
+    return getDefinitionIsConsumable(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionIsConsumable(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.isConsumable) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionIsHomebrew(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.isHomebrew) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param item
+ */
+export function isMagic(item) {
+    return item.isMagic;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionMagic(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.magic) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param item
+ */
+export function isStackable(item) {
+    return getDefinitionIsStackable(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionIsStackable(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.stackable) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param item
+ */
+export function canAttune(item) {
+    return item.canAttune;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionCanAttune(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.canAttune) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param item
+ */
+export function getLevelInfusionGranted(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.levelInfusionGranted) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getAttunementDescription(item) {
+    return getDefinitionAttunementDescription(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionAttunementDescription(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.attunementDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function canEquip(item) {
+    return item.canEquip;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionCanEquip(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.canEquip) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param item
+ * @returns boolean
+ */
+export function getDefinitionIsContainer(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.isContainer) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param item
+ * @returns boolean
+ */
+export function isContainer(item) {
+    return getDefinitionIsContainer(item);
+}
+/**
+ *
+ * @param item
+ */
+export function isAttuned(item) {
+    return item.isAttuned;
+}
+/**
+ *
+ * @param item
+ */
+export function isPack(item) {
+    if (item.definition) {
+        return isDefinitionPack(item.definition);
+    }
+    return false;
+}
+/**
+ *
+ * @param itemDefinition
+ */
+export function isDefinitionPack(itemDefinition) {
+    return itemDefinition.isPack;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionCost(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.cost) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function isMonkWeapon(item) {
+    return getDefinitionIsMonkWeapon(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionIsMonkWeapon(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.isMonkWeapon) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param item
+ */
+export function getItemWeaponBehaviors(item) {
+    return getDefinitionWeaponBehaviors(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionWeaponBehaviors(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.weaponBehaviors) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param item
+ */
+export function getArmorDefinitionAc(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.armorClass) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getItemRequiredStr(item) {
+    return getDefinitionStrengthRequirement(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getAttackType(item) {
+    return getDefinitionAttackType(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionAttackType(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.attackType) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getBaseTypeId(item) {
+    return getDefinitionBaseTypeId(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionBaseTypeId(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.baseTypeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param item
+ */
+export function getType(item) {
+    return item.type;
+}
+/**
+ *
+ * @param item
+ */
+export function getReach(item) {
+    return item.reach;
+}
+/**
+ *
+ * @param item
+ */
+export function getRange(item) {
+    return getDefinitionRange(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionRange(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.range) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getLongRange(item) {
+    return getDefinitionLongRange(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionLongRange(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.longRange) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getVersatileDamage(item) {
+    return item.versatileDamage;
+}
+/**
+ *
+ * @param item
+ */
+export function getAdditionalDamages(item) {
+    return item.additionalDamages;
+}
+/**
+ *
+ * @param item
+ */
+export function getFixedDamage(item) {
+    return getDefinitionFixedDamage(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionFixedDamage(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.fixedDamage) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionGrantedModifiers(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.grantedModifiers) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param item
+ */
+export function isDedicatedWeapon(item) {
+    return item.isDedicatedWeapon;
+}
+/**
+ *
+ * @param item
+ */
+export function canBeDedicatedWeapon(item) {
+    return item.canBeDedicatedWeapon;
+}
+/**
+ *
+ * @param item
+ */
+export function isHexWeapon(item) {
+    return item.isHexWeapon;
+}
+/**
+ *
+ * @param item
+ */
+export function canHexWeapon(item) {
+    return item.canHexWeapon;
+}
+/**
+ *
+ * @param item
+ */
+export function isPactWeapon(item) {
+    return item.isPactWeapon;
+}
+/**
+ *
+ * @param item
+ */
+export function canPactWeapon(item) {
+    return item.canPactWeapon;
+}
+/**
+ *
+ * @param item
+ */
+export function hexWeaponEnabled(item) {
+    return item.hexWeaponEnabled;
+}
+/**
+ *
+ * @param item
+ */
+export function pactWeaponEnabled(item) {
+    return item.pactWeaponEnabled;
+}
+/**
+ *
+ * @param item
+ */
+export function getMasteryName(item) {
+    return item.masteryName;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionStealthCheck(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.stealthCheck) !== null && _b !== void 0 ? _b : StealthCheckTypeEnum.NONE;
+}
+/**
+ *
+ * @param item
+ */
+export function getStealthCheck(item) {
+    return item.stealthCheck;
+}
+/**
+ *
+ * @param item
+ */
+export function getStrengthRequirement(item) {
+    return getDefinitionStrengthRequirement(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionStrengthRequirement(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.strengthRequirement) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getToHit(item) {
+    return item.toHit;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionDamage(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.damage) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getDamage(item) {
+    return item.damage;
+}
+/**
+ *
+ * @param item
+ */
+export function getDamageType(item) {
+    return item.damageType;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionDamageType(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.damageType) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getBaseArmorName(item) {
+    return getDefinitionBaseArmorName(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionBaseArmorName(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.baseArmorName) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getSubType(item) {
+    return getDefinitionSubType(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionSubType(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.subType) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getRarity(item) {
+    return getDefinitionRarity(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionRarity(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.rarity) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getQuantity(item) {
+    return item.quantity;
+}
+/**
+ *
+ * @param item
+ */
+export function getBundleSize(item) {
+    return getDefinitionBundleSize(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionBundleSize(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.bundleSize) !== null && _b !== void 0 ? _b : 1;
+}
+/**
+ *
+ * @param item
+ */
+export function getWeightDefinition(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.weight) !== null && _b !== void 0 ? _b : 0;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionCapacity(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.capacity) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionCapacityWeight(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.capacityWeight) !== null && _b !== void 0 ? _b : 0;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionWeightMultiplier(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.weightMultiplier) !== null && _b !== void 0 ? _b : 1;
+}
+/**
+ *
+ * @param item
+ */
+export function getCapacity(item) {
+    return getDefinitionCapacity(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getCapacityWeight(item) {
+    return item.capacityWeight;
+}
+/**
+ *
+ * @param item
+ */
+export function getWeightMultiplier(item) {
+    return getDefinitionWeightMultiplier(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionSnippet(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.snippet) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ * @param item
+ */
+export function isOffhand(item) {
+    return item.isOffhand;
+}
+/**
+ * @param item
+ */
+export function isSilvered(item) {
+    return item.isSilvered;
+}
+/**
+ * @param item
+ */
+export function isAdamantine(item) {
+    return item.isAdamantine;
+}
+/**
+ * @param item
+ */
+export function getCost(item) {
+    return item.cost;
+}
+/**
+ * @param item
+ */
+export function getWeight(item) {
+    return item.weight;
+}
+/**
+ * @param item
+ */
+export function isDisplayAsAttack(item) {
+    return item.isDisplayAsAttack;
+}
+/**
+ *
+ * @param item
+ */
+export function getNotes(item) {
+    return item.notes;
+}
+/**
+ *
+ * @param item
+ */
+export function getCategoryInfo(item) {
+    return item.categoryInfo;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionProperties(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.properties) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param item
+ */
+export function getProperties(item) {
+    return item.properties;
+}
+/**
+ *
+ * @param item
+ */
+export function getBaseType(item) {
+    return item.baseItemType;
+}
+/**
+ *
+ * @param item
+ */
+export function getModifiers(item) {
+    return item.modifiers;
+}
+/**
+ *
+ * @param item
+ */
+export function getMetaItems(item) {
+    return item.metaItems;
+}
+/**
+ * @param item
+ */
+export function getArmorClass(item) {
+    return item.armorClass;
+}
+/**
+ * @param item
+ */
+export function getAvatarUrl(item) {
+    return item.avatarUrl;
+}
+/**
+ *
+ * @param item
+ */
+export function getOriginalContract(item) {
+    return item.originalContract;
+}
+/**
+ *
+ * @param item
+ */
+export function getInfusion(item) {
+    return item.infusion;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionCanBeAddedToInventory(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.canBeAddedToInventory) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param item
+ */
+export function canBeAddedToInventory(item) {
+    return getDefinitionCanBeAddedToInventory(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionGroupedId(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.groupedId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param item
+ */
+export function getGroupedId(item) {
+    return getDefinitionGroupedId(item);
+}
+/**
+ *
+ * @param item
+ */
+export function getInfusionActions(item) {
+    return item.infusionActions;
+}
+/**
+ *
+ * @param item
+ */
+export function getDefinitionSources(item) {
+    var _a, _b;
+    return (_b = (_a = item.definition) === null || _a === void 0 ? void 0 : _a.sources) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param item
+ */
+export function getSources(item) {
+    return getDefinitionSources(item);
+}
+/**
+ * @param item
+ */
+export function isCustom(item) {
+    return item.isCustom;
+}
+/**
+ *
+ * @param item
+ * @returns {number | null}
+ */
+export function getEquippedEntityId(item) {
+    return item.equippedEntityId;
+}
+/**
+ *
+ * @param item
+ * @returns {number | null}
+ */
+export function getEquippedEntityTypeId(item) {
+    return item.equippedEntityTypeId;
+}
+/**
+ *
+ * @param item
+ * @returns {CharacterCurrencyContract}
+ */
+export function getCurrency(item) {
+    return item.currency;
+}
+export function isLegacy(item) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(item)) === null || _a === void 0 ? void 0 : _a.isLegacy) !== null && _b !== void 0 ? _b : false;
+}
+export function getPrimarySourceCategoryId(item) {
+    return item.primarySourceCategoryId;
+}
+export function getSecondarySourceCategoryIds(item) {
+    return item.secondarySourceCategoryIds;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Item/constants.js b/ddb_main/packages/rules-engine/es/engine/Item/constants.js
new file mode 100644
index 0000000..4f1eafc
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Item/constants.js
@@ -0,0 +1,81 @@
+import { AdjustmentTypeEnum } from '../Value';
+export var ItemBaseTypeEnum;
+(function (ItemBaseTypeEnum) {
+    ItemBaseTypeEnum["ARMOR"] = "ARMOR";
+    ItemBaseTypeEnum["GEAR"] = "GEAR";
+    ItemBaseTypeEnum["WEAPON"] = "WEAPON";
+})(ItemBaseTypeEnum || (ItemBaseTypeEnum = {}));
+export var ItemBaseTypeIdEnum;
+(function (ItemBaseTypeIdEnum) {
+    ItemBaseTypeIdEnum[ItemBaseTypeIdEnum["ARMOR"] = 701257905] = "ARMOR";
+    ItemBaseTypeIdEnum[ItemBaseTypeIdEnum["GEAR"] = 2103445194] = "GEAR";
+    ItemBaseTypeIdEnum[ItemBaseTypeIdEnum["WEAPON"] = 1782728300] = "WEAPON";
+})(ItemBaseTypeIdEnum || (ItemBaseTypeIdEnum = {}));
+export var ItemTypeEnum;
+(function (ItemTypeEnum) {
+    ItemTypeEnum[ItemTypeEnum["ARMOR"] = 1] = "ARMOR";
+    ItemTypeEnum[ItemTypeEnum["ARTIFACT"] = 2] = "ARTIFACT";
+    ItemTypeEnum[ItemTypeEnum["POTION"] = 3] = "POTION";
+    ItemTypeEnum[ItemTypeEnum["RING"] = 4] = "RING";
+    ItemTypeEnum[ItemTypeEnum["ROD"] = 5] = "ROD";
+    ItemTypeEnum[ItemTypeEnum["SCROLL"] = 6] = "SCROLL";
+    ItemTypeEnum[ItemTypeEnum["STAFF"] = 7] = "STAFF";
+    ItemTypeEnum[ItemTypeEnum["WAND"] = 8] = "WAND";
+    ItemTypeEnum[ItemTypeEnum["WEAPON"] = 9] = "WEAPON";
+    ItemTypeEnum[ItemTypeEnum["WONDROUS_ITEM"] = 10] = "WONDROUS_ITEM";
+})(ItemTypeEnum || (ItemTypeEnum = {}));
+export var ArmorTypeEnum;
+(function (ArmorTypeEnum) {
+    ArmorTypeEnum[ArmorTypeEnum["LIGHT_ARMOR"] = 1] = "LIGHT_ARMOR";
+    ArmorTypeEnum[ArmorTypeEnum["MEDIUM_ARMOR"] = 2] = "MEDIUM_ARMOR";
+    ArmorTypeEnum[ArmorTypeEnum["HEAVY_ARMOR"] = 3] = "HEAVY_ARMOR";
+    ArmorTypeEnum[ArmorTypeEnum["SHIELD"] = 4] = "SHIELD";
+})(ArmorTypeEnum || (ArmorTypeEnum = {}));
+export var WeaponTypeEnum;
+(function (WeaponTypeEnum) {
+    WeaponTypeEnum["AMMUNITION"] = "Ammunition";
+})(WeaponTypeEnum || (WeaponTypeEnum = {}));
+export var WeaponPropertyEnum;
+(function (WeaponPropertyEnum) {
+    WeaponPropertyEnum["VERSATILE"] = "Versatile";
+    WeaponPropertyEnum["AMMUNITION"] = "Ammunition";
+    WeaponPropertyEnum["LOADING"] = "Loading";
+    WeaponPropertyEnum["TWO_HANDED"] = "Two-Handed";
+    WeaponPropertyEnum["FINESSE"] = "Finesse";
+    WeaponPropertyEnum["LIGHT"] = "Light";
+    WeaponPropertyEnum["THROWN"] = "Thrown";
+    WeaponPropertyEnum["HEAVY"] = "Heavy";
+    WeaponPropertyEnum["RANGE"] = "Range";
+    WeaponPropertyEnum["REACH"] = "Reach";
+    WeaponPropertyEnum["SPECIAL"] = "Special";
+})(WeaponPropertyEnum || (WeaponPropertyEnum = {}));
+export var ItemRarityNameEnum;
+(function (ItemRarityNameEnum) {
+    ItemRarityNameEnum["COMMON"] = "Common";
+    ItemRarityNameEnum["UNCOMMON"] = "Uncommon";
+    ItemRarityNameEnum["RARE"] = "Rare";
+    ItemRarityNameEnum["VERY_RARE"] = "Very Rare";
+    ItemRarityNameEnum["LEGENDARY"] = "Legendary";
+    ItemRarityNameEnum["ARTIFACT"] = "Artifact";
+})(ItemRarityNameEnum || (ItemRarityNameEnum = {}));
+//ONLY USED FOR INFUSIONS CURRENTLY
+export const FUTURE_ITEM_DEFINITION_TYPE = 'magic-item';
+export const MAGIC_ITEM_ENTITY_TYPE_ID = 112130694;
+export const CUSTOM_ITEM_DEFINITION_ENTITY_TYPE_ID = 988229960;
+export const ITEM_CUSTOMIZATION_ADJUSTMENT_TYPES = [
+    AdjustmentTypeEnum.COST_OVERRIDE,
+    AdjustmentTypeEnum.FIXED_VALUE_BONUS,
+    AdjustmentTypeEnum.DISPLAY_AS_ATTACK,
+    AdjustmentTypeEnum.IS_ADAMANTINE,
+    AdjustmentTypeEnum.IS_OFFHAND,
+    AdjustmentTypeEnum.IS_PROFICIENT,
+    AdjustmentTypeEnum.IS_SILVER,
+    AdjustmentTypeEnum.NAME_OVERRIDE,
+    AdjustmentTypeEnum.NOTES,
+    AdjustmentTypeEnum.TO_HIT_OVERRIDE,
+    AdjustmentTypeEnum.TO_HIT_BONUS,
+    AdjustmentTypeEnum.SAVE_DC_OVERRIDE,
+    AdjustmentTypeEnum.SAVE_DC_BONUS,
+    AdjustmentTypeEnum.WEIGHT_OVERRIDE,
+    AdjustmentTypeEnum.CAPACITY_WEIGHT_OVERRIDE,
+];
diff --git a/ddb_main/packages/rules-engine/es/engine/Item/derivers.js b/ddb_main/packages/rules-engine/es/engine/Item/derivers.js
new file mode 100644
index 0000000..44f5352
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Item/derivers.js
@@ -0,0 +1,973 @@
+import { flatten, round, uniqBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { AbilityAccessors } from '../Ability';
+import { ActionAccessors, ActionGenerators } from '../Action';
+import { CharacterValidators } from '../Character';
+import { AbilityStatEnum, AttackTypeRangeEnum, PreferenceEncumbranceTypeEnum, StealthCheckTypeEnum } from '../Core';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { DefinitionHacks } from '../Definition';
+import { HelperUtils } from '../Helper';
+import { InfusionAccessors, InfusionTypeEnum } from '../Infusion';
+import { LimitedUseAccessors } from '../LimitedUse';
+import { ModifierAccessors, ModifierDerivers, ModifierValidators } from '../Modifier';
+import { isValidWeaponMasteryModifier } from '../Modifier/validators';
+import { RuleDataAccessors, RuleDataUtils } from '../RuleData';
+import { AdjustmentTypeEnum, ValueAccessors, ValueHacks, ValueUtils, ValueValidators, } from '../Value';
+import { getArmorDefinitionAc, getArmorTypeId, getAttackType, getBaseItemId, getBaseTypeId, getBundleSize, getCategoryId, getDefinitionAvatarUrl, getDefinitionCanAttune, getDefinitionCanEquip, getDefinitionCapacityWeight, getDefinitionCost, getDefinitionDamageType, getDefinitionId, getDefinitionMagic, getDefinitionName, getDefinitionProperties, getDefinitionStealthCheck, getDescription, getGearTypeId, getItemRequiredStr, getItemWeaponBehaviors, getLimitedUse, getMappingEntityTypeId, getMappingId, getModifiers, getQuantity, getSources, getWeight, getWeightDefinition, isEquipped, isMagic, isMonkWeapon, isStackable, } from './accessors';
+import { ArmorTypeEnum, FUTURE_ITEM_DEFINITION_TYPE, ITEM_CUSTOMIZATION_ADJUSTMENT_TYPES, ItemBaseTypeEnum, ItemBaseTypeIdEnum, ItemTypeEnum, WeaponPropertyEnum, } from './constants';
+import { hack__deriveStealthMediumArmorMasterShouldReturnStealthDefinition } from './hacks';
+import { hasWeaponProperty, isArmorContract, isBaseArmor, isBaseGear, isBaseWeapon, hasItemWeaponBehaviors, isWeaponContract, isAmmunition, isGearContract, } from './utils';
+import { isCustomItem, validateIsWeaponLike } from './validators';
+/**
+ *
+ * @param item
+ */
+export function deriveArmorClass(item) {
+    if (!isArmorContract(item)) {
+        return null;
+    }
+    const definitionArmorClass = getArmorDefinitionAc(item);
+    return deriveArmorModifierAcTotal(item) + (definitionArmorClass === null ? 0 : definitionArmorClass);
+}
+/**
+ *
+ * @param weapon
+ * @param valueLookup
+ */
+export function deriveIsOffhand(weapon, valueLookup) {
+    return !!ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.IS_OFFHAND, ValueHacks.hack__toString(getMappingId(weapon)), ValueHacks.hack__toString(getMappingEntityTypeId(weapon)));
+}
+/**
+ *
+ * @param weapon
+ * @param valueLookup
+ */
+export function deriveIsSilvered(weapon, valueLookup) {
+    return !!ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.IS_SILVER, ValueHacks.hack__toString(getMappingId(weapon)), ValueHacks.hack__toString(getMappingEntityTypeId(weapon)));
+}
+/**
+ *
+ * @param weapon
+ * @param valueLookup
+ */
+export function deriveIsAdamantine(weapon, valueLookup) {
+    return !!ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.IS_ADAMANTINE, ValueHacks.hack__toString(getMappingId(weapon)), ValueHacks.hack__toString(getMappingEntityTypeId(weapon)));
+}
+/**
+ *
+ * @param item
+ * @param infusion
+ */
+export function deriveCanAttune(item, infusion) {
+    if (infusion && InfusionAccessors.getType(infusion) !== InfusionTypeEnum.REPLICATE) {
+        return InfusionAccessors.requiresAttunement(infusion);
+    }
+    return getDefinitionCanAttune(item);
+}
+/**
+ *
+ * @param item
+ * @param infusion
+ */
+export function deriveCanEquip(item, infusion) {
+    if (infusion !== null) {
+        return true;
+    }
+    return getDefinitionCanEquip(item);
+}
+/**
+ *
+ * @param item
+ * @param ruleData
+ */
+export function deriveCategoryInfo(item, ruleData) {
+    if (!isWeaponContract(item)) {
+        return null;
+    }
+    return RuleDataUtils.getWeaponCategoryInfo(getCategoryId(item), ruleData);
+}
+/**
+ *
+ * @param item
+ * @param valueLookup
+ */
+export function deriveIsDisplayAsAttack(item, valueLookup) {
+    const override = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.DISPLAY_AS_ATTACK, ValueHacks.hack__toString(getMappingId(item)), ValueHacks.hack__toString(getMappingEntityTypeId(item)));
+    const defaultIsDisplayAsAttack = deriveDefaultIsDisplayAsAttack(item);
+    return (defaultIsDisplayAsAttack && (override === null || override)) || !!override;
+}
+/**
+ *
+ * @param baseTypeId
+ */
+export function deriveBaseTypeNameFromId(baseTypeId) {
+    switch (baseTypeId) {
+        case ItemBaseTypeIdEnum.WEAPON:
+            return 'Weapon';
+        case ItemBaseTypeIdEnum.ARMOR:
+            return 'Armor';
+        case ItemBaseTypeIdEnum.GEAR:
+            return 'Gear';
+        default:
+        // not implemented
+    }
+    return '';
+}
+/**
+ *
+ * @param item
+ * @param valueLookup
+ */
+export function deriveCost(item, valueLookup) {
+    const override = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.COST_OVERRIDE, ValueHacks.hack__toString(getMappingId(item)), ValueHacks.hack__toString(getMappingEntityTypeId(item)));
+    const quantity = getQuantity(item);
+    const bundleSize = getBundleSize(item);
+    let costPerItem = getDefinitionCost(item);
+    if (costPerItem === null) {
+        costPerItem = 0;
+    }
+    if (override !== null) {
+        costPerItem = override;
+    }
+    if (isStackable(item)) {
+        costPerItem /= bundleSize === 0 ? 1 : bundleSize;
+    }
+    return round(costPerItem * quantity, 2);
+}
+/**
+ *
+ * @param item
+ * @param globalModifiers
+ */
+export function deriveStealthCheck(item, globalModifiers) {
+    if (!isArmorContract(item)) {
+        return StealthCheckTypeEnum.NONE;
+    }
+    const itemModifiers = getModifiers(item);
+    const definitionCheck = getDefinitionStealthCheck(item);
+    if (definitionCheck === StealthCheckTypeEnum.DISADVANTAGE) {
+        const filteredGlobalModifiers = globalModifiers.filter((modifier) => ModifierValidators.isStealthDisadvantageRemoveModifier(modifier));
+        if (itemModifiers.find((modifier) => ModifierValidators.isStealthDisadvantageRemoveModifier(modifier)) ||
+            filteredGlobalModifiers.length) {
+            if (hack__deriveStealthMediumArmorMasterShouldReturnStealthDefinition(item, filteredGlobalModifiers)) {
+                return definitionCheck;
+            }
+            return StealthCheckTypeEnum.NONE;
+        }
+    }
+    return definitionCheck;
+}
+/**
+ *
+ * @param item
+ * @param ruleData
+ */
+export function deriveAvatarUrl(item, ruleData) {
+    let previewImageUrl = getDefinitionAvatarUrl(item);
+    switch (getBaseTypeId(item)) {
+        case ItemBaseTypeIdEnum.WEAPON:
+            if (!previewImageUrl) {
+                previewImageUrl = ruleData.defaultWeaponImageUrl;
+            }
+            break;
+        case ItemBaseTypeIdEnum.ARMOR:
+            if (!previewImageUrl) {
+                previewImageUrl = ruleData.defaultArmorImageUrl;
+            }
+            break;
+        case ItemBaseTypeIdEnum.GEAR:
+            if (!previewImageUrl) {
+                previewImageUrl = ruleData.defaultGearImageUrl;
+            }
+            break;
+    }
+    if (!previewImageUrl && isCustomItem(item)) {
+        previewImageUrl = ruleData.defaultGearImageUrl;
+    }
+    if (previewImageUrl) {
+        return previewImageUrl;
+    }
+    return '';
+}
+/**
+ *
+ * @param item
+ */
+export function deriveBaseType(item) {
+    if (isArmorContract(item)) {
+        return ItemBaseTypeEnum.ARMOR;
+    }
+    else if (isWeaponContract(item)) {
+        return ItemBaseTypeEnum.WEAPON;
+    }
+    return ItemBaseTypeEnum.GEAR;
+}
+/**
+ *
+ * @param item
+ * @param valueLookup
+ */
+export function deriveWeight(item, valueLookup) {
+    const quantity = getQuantity(item);
+    const bundleSize = getBundleSize(item);
+    const isItemStackable = isStackable(item);
+    const weight = getWeightDefinition(item);
+    const weightOverride = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.WEIGHT_OVERRIDE, ValueHacks.hack__toString(getMappingId(item)), ValueHacks.hack__toString(getMappingEntityTypeId(item)));
+    let baseWeight = weight;
+    if (weightOverride !== null) {
+        baseWeight = weightOverride;
+    }
+    if (!baseWeight) {
+        return 0;
+    }
+    if (isItemStackable) {
+        if (quantity) {
+            return round(baseWeight * (quantity / (bundleSize === 0 ? 1 : bundleSize)), 2);
+        }
+        return 0;
+    }
+    return baseWeight;
+}
+/**
+ *
+ * @param item
+ * @param valueLookup
+ */
+export function deriveCapacityWeight(item, valueLookup) {
+    const capacityWeight = getDefinitionCapacityWeight(item);
+    const capacityOverride = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.CAPACITY_WEIGHT_OVERRIDE, ValueHacks.hack__toString(getMappingId(item)), ValueHacks.hack__toString(getMappingEntityTypeId(item)));
+    return capacityOverride !== null && capacityOverride !== void 0 ? capacityOverride : capacityWeight;
+}
+/**
+ *
+ * @param items
+ * @param initialValue
+ */
+export function deriveItemsWeightTotal(items, initialValue = 0) {
+    return items.reduce((acc, item) => (acc += getWeight(item)), initialValue);
+}
+/**
+ *
+ * @param armor
+ * @param modifiers
+ * @param abilityLookup
+ */
+export function deriveArmorDexBonusMax(armor, modifiers, abilityLookup) {
+    const armorTypeId = getArmorTypeId(armor);
+    switch (armorTypeId) {
+        case ArmorTypeEnum.MEDIUM_ARMOR:
+            const dexAbility = abilityLookup[AbilityStatEnum.DEXTERITY];
+            const dexAbilityScore = AbilityAccessors.getScore(dexAbility);
+            if (dexAbility && dexAbilityScore !== null && dexAbilityScore >= 16) {
+                const maxModifiers = modifiers.filter((modifier) => ModifierValidators.isSetAcMaxDexModifierModifier(modifier));
+                const maxArmoredModifiers = modifiers.filter((modifier) => ModifierValidators.isSetAcMaxDexArmoredModifier(modifier));
+                const maxModifierPossibilities = [];
+                if (maxModifiers.length) {
+                    maxModifierPossibilities.push(ModifierDerivers.deriveHighestModifierValue(maxModifiers));
+                }
+                if (maxArmoredModifiers.length) {
+                    maxModifierPossibilities.push(ModifierDerivers.deriveHighestModifierValue(maxArmoredModifiers));
+                }
+                if (maxModifierPossibilities.length) {
+                    return Math.max(...maxModifierPossibilities);
+                }
+            }
+            return 2;
+        case ArmorTypeEnum.HEAVY_ARMOR:
+            return 0;
+        default:
+        // not implemented
+    }
+    return null;
+}
+/**
+ *
+ * @param modifiers
+ */
+export function deriveUnarmoredDexBonusMax(modifiers) {
+    const maxDexModifiers = modifiers.filter((modifier) => ModifierValidators.isSetAcMaxDexModifierModifier(modifier));
+    const maxDexUnarmoredModifiers = modifiers.filter((modifier) => ModifierValidators.isSetAcMaxDexUnarmoredModifier(modifier));
+    const maxDexValuePossibilities = [];
+    if (maxDexModifiers.length) {
+        maxDexValuePossibilities.push(ModifierDerivers.deriveHighestModifierValue(maxDexModifiers));
+    }
+    if (maxDexUnarmoredModifiers.length) {
+        maxDexValuePossibilities.push(ModifierDerivers.deriveHighestModifierValue(maxDexUnarmoredModifiers));
+    }
+    if (maxDexValuePossibilities.length) {
+        return Math.max(...maxDexValuePossibilities);
+    }
+    return null;
+}
+/**
+ *
+ * @param localModifiers
+ * @param globalModifiers
+ * @param abilityLookup
+ */
+export function deriveUnarmoredDexBonus(localModifiers, globalModifiers, abilityLookup) {
+    let bonus = 0;
+    if (Object.keys(abilityLookup).length) {
+        const dexMod = abilityLookup[AbilityStatEnum.DEXTERITY];
+        bonus = AbilityAccessors.getModifier(dexMod) || 0;
+    }
+    const ignoreUnarmoredDexBonusModifiers = localModifiers.filter((modifier) => ModifierValidators.isIgnoreUnarmoredDexAcBonusModifier(modifier));
+    if (ignoreUnarmoredDexBonusModifiers.length) {
+        return 0;
+    }
+    const max = deriveUnarmoredDexBonusMax(globalModifiers);
+    return Math.min(bonus, max === null ? Number.MAX_VALUE : max);
+}
+/**
+ *
+ * @param armor
+ * @param dexModifier
+ * @param modifiers
+ * @param abilityLookup
+ */
+export function deriveArmorDexBonus(armor, dexModifier, modifiers, abilityLookup) {
+    switch (getArmorTypeId(armor)) {
+        case ArmorTypeEnum.HEAVY_ARMOR:
+        case ArmorTypeEnum.SHIELD:
+            return 0;
+    }
+    const armorDexBonusMax = deriveArmorDexBonusMax(armor, modifiers, abilityLookup);
+    return armorDexBonusMax === null ? dexModifier : Math.min(armorDexBonusMax, dexModifier);
+}
+/**
+ *
+ * @param armor
+ * @param dexModifier
+ * @param modifiers
+ * @param abilityLookup
+ * @param ruleData
+ */
+export function deriveArmorAc(armor, dexModifier, modifiers, abilityLookup, ruleData) {
+    let armorAc = ruleData.noArmorAcAmount;
+    if (armor) {
+        const definitionArmorClass = getArmorDefinitionAc(armor);
+        if (definitionArmorClass !== null) {
+            armorAc = definitionArmorClass;
+        }
+    }
+    return armorAc + deriveArmorDexBonus(armor, dexModifier, modifiers, abilityLookup);
+}
+/**
+ *
+ * @param armorItems
+ * @param dexModifier
+ * @param modifiers
+ * @param abilityLookup
+ * @param ruleData
+ */
+export function deriveHighestArmorAcItem(armorItems, dexModifier, modifiers, abilityLookup, ruleData) {
+    const armorAc = armorItems.map((item) => {
+        const armorAc = deriveArmorAc(item, dexModifier, modifiers, abilityLookup, ruleData);
+        const modifierAc = deriveArmorModifierAcTotal(item);
+        const definitionArmorClass = getArmorDefinitionAc(item);
+        return {
+            item,
+            armorClassWithDex: armorAc + modifierAc,
+            armorClass: (definitionArmorClass === null ? 0 : definitionArmorClass) + modifierAc,
+        };
+    });
+    return HelperUtils.getLast(armorAc, ['armorClassWithDex']);
+}
+/**
+ *
+ * @param equippedItems
+ * @param strScore
+ * @param preferences
+ * @param modifiers
+ */
+export function deriveArmorSpeedAdjustmentAmount(equippedItems, strScore, preferences, modifiers) {
+    if (preferences.encumbranceType === PreferenceEncumbranceTypeEnum.VARIANT ||
+        modifiers.some(ModifierValidators.isIgnoreHeavyArmorSpeedReductionModifier)) {
+        return 0;
+    }
+    const armorItems = equippedItems.filter(isArmorContract);
+    const encumberingArmorItem = armorItems.find((item) => {
+        const reqStr = getItemRequiredStr(item);
+        return reqStr && reqStr > strScore;
+    });
+    if (encumberingArmorItem) {
+        return -10;
+    }
+    return 0;
+}
+/**
+ *
+ * @param item
+ * @param globalModifiers
+ * @param isPactWeapon
+ * @param valueLookupByType
+ * @param ruleData
+ */
+export function deriveIsProficient(item, globalModifiers, isPactWeapon, valueLookupByType, ruleData) {
+    if (isBaseWeapon(item)) {
+        if (globalModifiers.filter((modifier) => ModifierValidators.isValidWeaponProficiencyModifier(modifier, item))
+            .length) {
+            return true;
+        }
+        if (valueLookupByType.hasOwnProperty(AdjustmentTypeEnum.WEAPON_PROFICIENCY_LEVEL)) {
+            const charValues = valueLookupByType[AdjustmentTypeEnum.WEAPON_PROFICIENCY_LEVEL];
+            if (charValues.find((charValue) => ValueAccessors.getValueIntId(charValue) === getBaseItemId(item))) {
+                return true;
+            }
+        }
+        return isPactWeapon;
+    }
+    if (isBaseArmor(item)) {
+        if (globalModifiers.filter((modifier) => ModifierValidators.isValidArmorProficiencyModifier(modifier, item))
+            .length) {
+            return true;
+        }
+        if (valueLookupByType.hasOwnProperty(AdjustmentTypeEnum.ARMOR_PROFICIENCY_LEVEL)) {
+            const charValues = valueLookupByType[AdjustmentTypeEnum.ARMOR_PROFICIENCY_LEVEL];
+            if (charValues.find((charValue) => ValueAccessors.getValueIntId(charValue) === getBaseItemId(item))) {
+                return true;
+            }
+        }
+    }
+    if (!isBaseGear(item)) {
+        if (getModifiers(item).filter((modifier) => ModifierValidators.isProficiencySelfModifier(modifier)).length) {
+            return true;
+        }
+    }
+    return false;
+}
+/**
+ *
+ * @param item
+ * @param modifiers
+ */
+export function deriveIsMonkWeapon(item, modifiers) {
+    if (!isWeaponContract(item)) {
+        return false;
+    }
+    const monkWeaponModifiers = modifiers.filter((modifier) => ModifierValidators.isMonkWeaponModifier(modifier));
+    return (isMonkWeapon(item) ||
+        !!monkWeaponModifiers.find((modifier) => ModifierValidators.isValidWeaponSubTypeModifier(modifier, item)));
+}
+/**
+ *
+ * @param item
+ * @param valueLookup
+ */
+export function deriveIsCustomized(item, valueLookup) {
+    return isCustomItem(item)
+        ? false
+        : ValueValidators.validateHasCustomization(ITEM_CUSTOMIZATION_ADJUSTMENT_TYPES, valueLookup, ValueHacks.hack__toString(getMappingId(item)), ValueHacks.hack__toString(getMappingEntityTypeId(item)));
+}
+/**
+ *
+ * @param item
+ */
+export function deriveWeaponAdditionalDamage(item) {
+    let additionalDamages = [];
+    if (!isWeaponContract(item)) {
+        return additionalDamages;
+    }
+    const itemModifiers = getModifiers(item);
+    const additionalDamageModifiers = itemModifiers.filter((modifier) => ModifierValidators.isWeaponAdditionalDamageModifier(modifier));
+    if (additionalDamageModifiers.length) {
+        additionalDamages = additionalDamageModifiers.map((modifier) => {
+            const damageValue = ModifierAccessors.getValue(modifier);
+            return {
+                damageType: ModifierAccessors.getFriendlySubtypeName(modifier),
+                damage: damageValue ? damageValue : ModifierAccessors.getDice(modifier),
+                info: ModifierAccessors.getRestriction(modifier),
+                id: ModifierAccessors.getId(modifier),
+            };
+        });
+    }
+    return additionalDamages;
+}
+/**
+ *
+ * @param item
+ * @param modifiers
+ * @param ruleData
+ */
+export function deriveWeaponReach(item, modifiers, ruleData) {
+    let reach = null;
+    if (!isBaseWeapon(item)) {
+        return reach;
+    }
+    if (getAttackType(item) === AttackTypeRangeEnum.MELEE) {
+        const baseReach = ruleData.baseWeaponReach;
+        const bonusReachModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusMeleeReachModifier(modifier));
+        const bonusReachModifierTotal = ModifierDerivers.sumModifiers(bonusReachModifiers);
+        let reachPropertyTotal = 0;
+        if (hasWeaponProperty(item, WeaponPropertyEnum.REACH)) {
+            reachPropertyTotal = ruleData.weaponPropertyReachDistance;
+        }
+        reach = baseReach + reachPropertyTotal + bonusReachModifierTotal;
+    }
+    return reach;
+}
+/**
+ *
+ * @param item
+ * @param modifiers
+ * @param martialArtsLevel
+ */
+export function deriveAvailableWeaponAbilities(item, modifiers, martialArtsLevelScale, isDedicatedWeapon, isPactWeapon, isHexWeapon) {
+    const availableAbilities = [];
+    const attackType = getAttackType(item);
+    if (attackType === AttackTypeRangeEnum.MELEE || hasWeaponProperty(item, WeaponPropertyEnum.FINESSE)) {
+        availableAbilities.push(AbilityStatEnum.STRENGTH);
+    }
+    if (attackType === AttackTypeRangeEnum.RANGED ||
+        (martialArtsLevelScale !== null && (deriveIsMonkWeapon(item, modifiers) || isDedicatedWeapon)) ||
+        hasWeaponProperty(item, WeaponPropertyEnum.FINESSE)) {
+        availableAbilities.push(AbilityStatEnum.DEXTERITY);
+    }
+    if (isMagic(item)) {
+        const magicItemBonusModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusMagicItemAttackWithStatModifier(modifier));
+        magicItemBonusModifiers.forEach((modifier) => {
+            const entityId = ModifierAccessors.getEntityId(modifier);
+            if (entityId !== null && !availableAbilities.includes(entityId)) {
+                availableAbilities.push(entityId);
+            }
+        });
+    }
+    //handle PactWeapon modifiers
+    if (isPactWeapon) {
+        //Get the enable Pact modifier
+        const enablePactModifier = modifiers.find((modifier) => ModifierValidators.isEnablePactWeaponModifier(modifier));
+        //Get the origin of the enable Pact Modifier
+        const pactDataOrigin = enablePactModifier && ModifierAccessors.getDataOrigin(enablePactModifier);
+        if (pactDataOrigin) {
+            const replacementAbilities = deriveReplacementWeaponAbilities(modifiers, pactDataOrigin);
+            replacementAbilities.forEach((ability) => {
+                if (!availableAbilities.includes(ability)) {
+                    availableAbilities.push(ability);
+                }
+            });
+        }
+    }
+    //handle HexWeapon modifiers
+    if (isHexWeapon) {
+        //Get the enable Hex modifier
+        const enableHexModifier = modifiers.find((modifier) => ModifierValidators.isEnableHexWeaponModifier(modifier));
+        //Get the origin of the enable Hex Modifier
+        const hexDataOrigin = enableHexModifier && ModifierAccessors.getDataOrigin(enableHexModifier);
+        if (hexDataOrigin) {
+            const replacementAbilities = deriveReplacementWeaponAbilities(modifiers, hexDataOrigin);
+            replacementAbilities.forEach((ability) => {
+                if (!availableAbilities.includes(ability)) {
+                    availableAbilities.push(ability);
+                }
+            });
+        }
+    }
+    return availableAbilities;
+}
+export function deriveReplacementWeaponAbilities(modifiers, enableModifierDataOrigin) {
+    let replacementAbilities = [];
+    const replaceAbilityModifiers = modifiers.filter((modifier) => ModifierValidators.isReplaceWeaponAbilityModifier(modifier));
+    if (replaceAbilityModifiers.length > 0) {
+        replaceAbilityModifiers.forEach((replaceAbilityModifier) => {
+            var _a, _b;
+            //get the id of the Ability Stat on the replace weapon ability modifier
+            const statId = ModifierAccessors.getEntityId(replaceAbilityModifier);
+            //get the data origin of the replace weapon ability modifier
+            const dataOrigin = ModifierAccessors.getDataOrigin(replaceAbilityModifier);
+            if (statId &&
+                dataOrigin.type === enableModifierDataOrigin.type &&
+                ((_a = dataOrigin.primary.definition) === null || _a === void 0 ? void 0 : _a.id) === ((_b = enableModifierDataOrigin.primary.definition) === null || _b === void 0 ? void 0 : _b.id) &&
+                !replacementAbilities.includes(statId)) {
+                replacementAbilities.push(statId);
+            }
+        });
+    }
+    return replacementAbilities;
+}
+/**
+ *
+ * @param item
+ * @param modifiers
+ */
+export function deriveCanWeaponOffhand(item, modifiers) {
+    if (!isBaseWeapon(item)) {
+        return false;
+    }
+    const ignoreOffhandLightRestrictionsModifiers = modifiers.filter((modifier) => ModifierValidators.isIgnoreOffhandLightRestrictionsModifier(modifier));
+    let canOffhand = false;
+    if (hasWeaponProperty(item, WeaponPropertyEnum.LIGHT) || ignoreOffhandLightRestrictionsModifiers.length > 0) {
+        canOffhand = true;
+    }
+    return canOffhand;
+}
+/**
+ *
+ * @param weapon
+ */
+export function deriveCanPactWeapon(weapon) {
+    return getAttackType(weapon) === AttackTypeRangeEnum.MELEE;
+}
+/**
+ *
+ * @param item
+ * @param proficiency
+ */
+export function deriveCanHexWeapon(item, proficiency) {
+    if (!isBaseWeapon(item) && !validateIsWeaponLike(item)) {
+        return false;
+    }
+    return proficiency && !hasWeaponProperty(item, WeaponPropertyEnum.TWO_HANDED);
+}
+/**
+ *
+ * @param item
+ * @param proficiency
+ */
+export function deriveCanBeDedicatedWeapon(item, proficiency) {
+    if (!isBaseWeapon(item) && !validateIsWeaponLike(item)) {
+        return false;
+    }
+    return (proficiency &&
+        !hasWeaponProperty(item, WeaponPropertyEnum.HEAVY) &&
+        !hasWeaponProperty(item, WeaponPropertyEnum.SPECIAL));
+}
+/**
+ *
+ * @param item
+ * @param modifiers
+ */
+export function deriveMasteryName(item, modifiers) {
+    if (getBaseTypeId(item) !== ItemBaseTypeIdEnum.WEAPON) {
+        return null;
+    }
+    //get modifiers that are weaponmastery
+    const masteryModifiers = modifiers.filter((modifier) => isValidWeaponMasteryModifier(modifier));
+    //get entity id from modifier and match to item baseWeaponid
+    const masteryModifier = masteryModifiers.find((modifier) => ModifierAccessors.getEntityId(modifier) === getBaseItemId(item));
+    return masteryModifier ? ModifierAccessors.getFriendlySubtypeName(masteryModifier) : null;
+}
+/**
+ *
+ * @param item
+ * @param valueLookup
+ */
+export function deriveName(item, valueLookup) {
+    const override = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.NAME_OVERRIDE, ValueHacks.hack__toString(getMappingId(item)), ValueHacks.hack__toString(getMappingEntityTypeId(item)));
+    if (override !== null && override !== '') {
+        return override;
+    }
+    const definitionName = getDefinitionName(item);
+    if (definitionName === null) {
+        return '';
+    }
+    return definitionName;
+}
+/**
+ *
+ * @param item
+ * @param valueLookup
+ */
+export function deriveNotes(item, valueLookup) {
+    const notes = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.NOTES, ValueHacks.hack__toString(getMappingId(item)), ValueHacks.hack__toString(getMappingEntityTypeId(item)));
+    if (notes !== null && notes !== '') {
+        return notes;
+    }
+    return null;
+}
+/**
+ *
+ * @param item
+ * @param modifiers
+ * @param ruleData
+ */
+export function deriveProperties(item, modifiers, ruleData) {
+    let properties = [];
+    if (isArmorContract(item)) {
+        return properties;
+    }
+    if (isWeaponContract(item)) {
+        properties = getDefinitionProperties(item);
+    }
+    else if (hasItemWeaponBehaviors(item)) {
+        const behavior = getItemWeaponBehaviors(item);
+        const firstBehavior = behavior[0];
+        properties = firstBehavior.properties === null ? [] : firstBehavior.properties;
+    }
+    const weaponPropertyModifiers = modifiers.filter((modifier) => ModifierValidators.isWeaponPropertyModifier(modifier));
+    const weaponPropertyModifierInfos = weaponPropertyModifiers
+        .map((modifier) => {
+        const entityId = ModifierAccessors.getEntityId(modifier);
+        if (entityId === null) {
+            return null;
+        }
+        const configWeaponProperty = RuleDataUtils.getWeaponPropertyInfo(entityId, ruleData);
+        if (configWeaponProperty === null) {
+            return null;
+        }
+        return {
+            id: configWeaponProperty.id,
+            description: configWeaponProperty.description,
+            name: configWeaponProperty.name,
+            notes: '',
+        };
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    properties = uniqBy([...properties, ...weaponPropertyModifierInfos], (property) => property.name);
+    const ignoreWeaponPropertyModifiers = modifiers.filter((modifier) => ModifierValidators.isIgnoreWeaponPropertyModifier(modifier));
+    if (ignoreWeaponPropertyModifiers.length) {
+        const ignoreWeaponPropertyModifiersNames = ignoreWeaponPropertyModifiers
+            .map((modifier) => ModifierAccessors.getFriendlySubtypeName(modifier))
+            .filter(TypeScriptUtils.isNotNullOrUndefined);
+        properties = properties.filter((property) => property.name !== null && !ignoreWeaponPropertyModifiersNames.includes(property.name));
+    }
+    return properties;
+}
+/**
+ *
+ * @param armorItems
+ */
+export function deriveValidGlobalModifiersFromArmor(armorItems) {
+    if (!armorItems.length) {
+        return [];
+    }
+    // get all armor modifiers that aren't AC bonuses
+    return flatten(armorItems.map((item) => getModifiers(item).filter((modifier) => !ModifierValidators.isBonusArmorModifier(modifier) &&
+        !ModifierValidators.isProficiencySelfModifier(modifier) &&
+        isEquipped(item) &&
+        ModifierValidators.isValidAttunedItemModifier(modifier, item))));
+}
+/**
+ *
+ * @param weaponItems
+ */
+export function deriveValidGlobalModifiersFromWeapons(weaponItems) {
+    if (!weaponItems.length) {
+        return [];
+    }
+    // get all weapon modifiers that aren't bonus magic
+    return flatten(weaponItems.map((item) => getModifiers(item).filter((modifier) => !ModifierValidators.isBonusMagicModifier(modifier) &&
+        !ModifierValidators.isProficiencySelfModifier(modifier) &&
+        !ModifierValidators.isReplaceDamageTypeModifier(modifier) &&
+        !ModifierValidators.isWeaponPropertyModifier(modifier) &&
+        !ModifierValidators.isWeaponAdditionalDamageModifier(modifier) &&
+        isEquipped(item) &&
+        ModifierValidators.isValidAttunedItemModifier(modifier, item))));
+}
+/**
+ *
+ * @param gearItems
+ */
+export function deriveValidGlobalModifiersFromGear(gearItems) {
+    if (!gearItems.length) {
+        return [];
+    }
+    return flatten(gearItems.map((item) => getModifiers(item).filter((modifier) => isEquipped(item) &&
+        (!hasItemWeaponBehaviors(item) ||
+            (hasItemWeaponBehaviors(item) && !ModifierValidators.isBonusMagicModifier(modifier))) &&
+        !ModifierValidators.isProficiencySelfModifier(modifier) &&
+        ModifierValidators.isValidAttunedItemModifier(modifier, item))));
+}
+/**
+ *
+ * @param item
+ */
+export function deriveValidArmorStatModifiers(item) {
+    return getModifiers(item).filter((modifier) => ModifierValidators.isBonusArmorModifier(modifier) &&
+        ModifierValidators.isValidAttunedItemModifier(modifier, item));
+}
+/**
+ *
+ * @param item
+ */
+export function deriveArmorModifierAcTotal(item) {
+    const validModifiers = deriveValidArmorStatModifiers(item);
+    return ModifierDerivers.sumModifiers(validModifiers);
+}
+/**
+ *
+ * @param item
+ * @param modifiers
+ */
+export function deriveDamageType(item, modifiers) {
+    let damageType = getDefinitionDamageType(item);
+    const replaceDamageTypeModifiers = modifiers.filter((modifier) => ModifierValidators.isReplaceDamageTypeModifier(modifier));
+    if (replaceDamageTypeModifiers.length) {
+        damageType = ModifierAccessors.getFriendlySubtypeName(replaceDamageTypeModifiers[0]);
+    }
+    return damageType;
+}
+/**
+ *
+ * @param item
+ */
+export function deriveDefinitionKey(item) {
+    return DefinitionHacks.hack__generateDefinitionKey(FUTURE_ITEM_DEFINITION_TYPE, getDefinitionId(item));
+}
+/**
+ *
+ * @param infusion
+ * @param valueLookup
+ * @param item
+ */
+export function deriveInfusionActions(infusion, valueLookup, item) {
+    if (infusion === null) {
+        return [];
+    }
+    const itemLimitedUse = getLimitedUse(item);
+    const baseActions = ActionGenerators.generateDataOriginBaseActions(InfusionAccessors.getDefinitionActions(infusion), valueLookup, DataOriginTypeEnum.ITEM, item);
+    return baseActions.map((action) => {
+        const actionLimitedUse = ActionAccessors.getLimitedUse(action);
+        // TODO I don't like this but im not sure how to fix it. and moving on because of time
+        // possibly calculate in ActionDerivers.deriveLimitedUse
+        if (actionLimitedUse !== null) {
+            return Object.assign(Object.assign({}, action), { limitedUse: Object.assign(Object.assign({}, actionLimitedUse), { numberUsed: itemLimitedUse === null ? 0 : LimitedUseAccessors.getNumberUsed(itemLimitedUse) }) });
+        }
+        return action;
+    });
+}
+/**
+ *
+ * @param infusionActions
+ * @param itemLimitedUse
+ */
+export function deriveLimitedUse(infusionActions, itemLimitedUse) {
+    // if we have no infusion actions, we will just keep what we have
+    if (infusionActions.length === 0) {
+        return itemLimitedUse;
+    }
+    // This is for when we updated charges used to null, but still have limited use object
+    if (itemLimitedUse !== null && LimitedUseAccessors.getNumberUsed(itemLimitedUse) === null) {
+        return null;
+    }
+    const limitedUseInfusionAction = infusionActions.find((action) => ActionAccessors.getLimitedUse(action) !== null);
+    if (!limitedUseInfusionAction) {
+        return itemLimitedUse;
+    }
+    // We made assumption that all of the limited use must be the same for all actions on items
+    const actionLimitedUse = ActionAccessors.getLimitedUse(limitedUseInfusionAction);
+    if (actionLimitedUse) {
+        return {
+            resetType: actionLimitedUse.resetType === null ? null : actionLimitedUse.resetType.toString(),
+            resetTypeDescription: null,
+            maxUses: actionLimitedUse.maxUses,
+            numberUsed: itemLimitedUse === null ? 0 : itemLimitedUse.numberUsed,
+        };
+    }
+    return itemLimitedUse;
+}
+/**
+ *
+ * @param item
+ * @param infusion
+ */
+export function deriveIsMagic(item, infusion) {
+    if (infusion) {
+        return true;
+    }
+    return getDefinitionMagic(item);
+}
+/**
+ *
+ * @param item
+ */
+export function deriveDefaultIsDisplayAsAttack(item) {
+    if (!isEquipped(item)) {
+        return false;
+    }
+    return validateIsWeaponLike(item);
+}
+/**
+ *
+ * @param item
+ * @param ruleData
+ */
+export function deriveType(item, ruleData) {
+    if (isArmorContract(item)) {
+        const armorTypeId = getArmorTypeId(item);
+        if (armorTypeId !== null) {
+            const armorType = HelperUtils.lookupDataOrFallback(RuleDataAccessors.getArmorTypeLookup(ruleData), armorTypeId);
+            if (armorType !== null) {
+                return armorType.name;
+            }
+        }
+    }
+    else if (isWeaponContract(item)) {
+        if (isAmmunition(item)) {
+            return 'Ammunition';
+        }
+        const weapon = RuleDataUtils.getWeaponByEntityId(getBaseItemId(item), getBaseTypeId(item), ruleData);
+        if (weapon !== null) {
+            return weapon.name;
+        }
+    }
+    else if (isGearContract(item)) {
+        if (!getDefinitionMagic(item)) {
+            return 'Gear';
+        }
+        const gearTypeId = getGearTypeId(item);
+        switch (gearTypeId) {
+            case ItemTypeEnum.ARMOR:
+                return 'Armor';
+            case ItemTypeEnum.ARTIFACT:
+                return 'Artifact';
+            case ItemTypeEnum.POTION:
+                return 'Potion';
+            case ItemTypeEnum.RING:
+                return 'Ring';
+            case ItemTypeEnum.ROD:
+                return 'Rod';
+            case ItemTypeEnum.SCROLL:
+                return 'Scroll';
+            case ItemTypeEnum.STAFF:
+                return 'Staff';
+            case ItemTypeEnum.WAND:
+                return 'Wand';
+            case ItemTypeEnum.WEAPON:
+                return 'Weapon';
+            case ItemTypeEnum.WONDROUS_ITEM:
+                return 'Wondrous item';
+            default:
+            // not implemented
+        }
+    }
+    else if (isCustomItem(item)) {
+        return 'Custom';
+    }
+    return null;
+}
+/**
+ *
+ * @param item
+ * @param notes
+ */
+export function deriveOriginalCustomContract(item, notes) {
+    if (isCustomItem(item)) {
+        return {
+            id: getDefinitionId(item),
+            name: getDefinitionName(item),
+            weight: getWeightDefinition(item),
+            cost: getDefinitionCost(item),
+            quantity: getQuantity(item),
+            description: getDescription(item),
+            notes,
+        };
+    }
+    return null;
+}
+export function derivePrimarySourceCategoryId(item, ruleData) {
+    var _a;
+    const primarySources = getSources(item).filter(CharacterValidators.isPrimarySource);
+    if (!primarySources.length) {
+        return 0;
+    }
+    const source = HelperUtils.lookupDataOrFallback(RuleDataAccessors.getSourceDataLookup(ruleData), primarySources[0].sourceId);
+    return ((_a = source === null || source === void 0 ? void 0 : source.sourceCategory) === null || _a === void 0 ? void 0 : _a.id) || 0;
+}
+export function deriveSecondarySourceCategoryIds(item, ruleData) {
+    const secondarySources = getSources(item).filter(CharacterValidators.isSecondarySource);
+    return secondarySources.map((source) => {
+        var _a;
+        const sourceData = HelperUtils.lookupDataOrFallback(RuleDataAccessors.getSourceDataLookup(ruleData), source.sourceId);
+        return ((_a = sourceData === null || sourceData === void 0 ? void 0 : sourceData.sourceCategory) === null || _a === void 0 ? void 0 : _a.id) || 0;
+    });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Item/generators.js b/ddb_main/packages/rules-engine/es/engine/Item/generators.js
new file mode 100644
index 0000000..20218ba
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Item/generators.js
@@ -0,0 +1,439 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { keyBy, orderBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { CharacterDerivers } from '../Character';
+import { ContainerTypeEnum } from '../Container';
+import { StealthCheckTypeEnum } from '../Core';
+import { DataOriginDataInfoKeyEnum, DataOriginTypeEnum } from '../DataOrigin';
+import { DefinitionHacks } from '../Definition';
+import { DiceAccessors, DiceDerivers, DiceUtils } from '../Dice';
+import { HelperUtils } from '../Helper';
+import { InfusionAccessors } from '../Infusion';
+import { LimitedUseAccessors, LimitedUseUtils } from '../LimitedUse';
+import { ModifierDerivers, ModifierGenerators, ModifierValidators, } from '../Modifier';
+import { RuleDataAccessors } from '../RuleData';
+import { SpellGenerators } from '../Spell';
+import { AdjustmentTypeEnum, ValueAccessors, ValueHacks, ValueUtils, } from '../Value';
+import { getDefinitionDamage, getEntityTypeId, getFixedDamage, getId, getItemWeaponBehaviors, getLimitedUse, getMappingEntityTypeId, getMappingId, getModifiers, getName, getUniqueKey, isAttuned, isDisplayAsAttack, isEquipped, } from './accessors';
+import { ItemBaseTypeEnum, ItemRarityNameEnum, WeaponPropertyEnum } from './constants';
+import { deriveArmorClass, deriveAvailableWeaponAbilities, deriveAvatarUrl, deriveBaseType, deriveCanAttune, deriveCanBeDedicatedWeapon, deriveCanEquip, deriveCanHexWeapon, deriveCanWeaponOffhand, deriveCapacityWeight, deriveCategoryInfo, deriveCost, deriveDamageType, deriveDefinitionKey, deriveInfusionActions, deriveIsAdamantine, deriveIsCustomized, deriveIsDisplayAsAttack, deriveIsMagic, deriveIsMonkWeapon, deriveIsOffhand, deriveIsProficient, deriveIsSilvered, deriveLimitedUse, deriveMasteryName, deriveName, deriveNotes, deriveOriginalCustomContract, derivePrimarySourceCategoryId, deriveProperties, deriveSecondarySourceCategoryIds, deriveStealthCheck, deriveType, deriveValidGlobalModifiersFromArmor, deriveValidGlobalModifiersFromGear, deriveValidGlobalModifiersFromWeapons, deriveWeaponAdditionalDamage, deriveWeaponReach, deriveWeight, } from './derivers';
+import { hasItemWeaponBehaviors, hasWeaponProperty, isAmmunition, isArmorContract, isBaseWeapon, isGearContract, isWeaponContract, } from './utils';
+import { isCustomItem, isEquippedToCurrentCharacter, validateIsWeaponLike } from './validators';
+/**
+ *
+ * @param customItems
+ * @param ruleData
+ * @param characterId
+ */
+export function generateCustomItems(customItems, ruleData, characterId) {
+    return customItems.map((item) => generateCustomItem(item, ruleData, characterId));
+}
+/**
+ * TODO v5.1: should be able to remove this generator and all usages after mobile can support customItems as Items
+ * @param customItem
+ * @param ruleData
+ * @param characterId
+ */
+export function generateCustomItem(customItem, ruleData, characterId) {
+    var _a, _b;
+    const { id, quantity, notes, weight } = customItem, customItemData = __rest(customItem, ["id", "quantity", "notes", "weight"]);
+    const definition = Object.assign(Object.assign({}, customItemData), { armorTypeId: null, armorClass: null, attackType: null, attunementDescription: null, avatarUrl: RuleDataAccessors.getDefaultGearImageUrl(ruleData), baseArmorName: null, baseItemId: null, baseTypeId: -1, bundleSize: 1, canAttune: false, canBeAddedToInventory: false, canEquip: false, capacity: null, capacityWeight: 0, categoryId: null, damage: null, damageType: null, entityTypeId: -1, filterType: null, fixedDamage: null, gearTypeId: null, grantedModifiers: [], groupedId: null, id: -1, isConsumable: false, isContainer: false, isHomebrew: false, isLegacy: false, isMonkWeapon: false, isPack: false, largeAvatarUrl: null, levelInfusionGranted: null, longRange: null, magic: false, properties: [], range: null, rarity: ItemRarityNameEnum.COMMON, snippet: null, sourcePageNumber: null, sources: [], stackable: true, stealthCheck: StealthCheckTypeEnum.NONE, strengthRequirement: null, subType: null, tags: [], type: 'Custom', version: null, weaponBehaviors: [], weight: weight !== null && weight !== void 0 ? weight : 0, weightMultiplier: 1 });
+    const simulatedContract = {
+        chargesUsed: 0,
+        containerEntityId: characterId,
+        containerEntityTypeId: ContainerTypeEnum.CHARACTER,
+        containerDefinitionKey: DefinitionHacks.hack__generateDefinitionKey(ContainerTypeEnum.CHARACTER, characterId),
+        definition,
+        currency: null,
+        definitionId: -1,
+        definitionTypeId: -1,
+        displayAsAttack: false,
+        entityTypeId: -1,
+        equipped: false,
+        equippedEntityId: null,
+        equippedEntityTypeId: null,
+        id,
+        isAttuned: false,
+        limitedUse: null,
+        quantity: quantity !== null && quantity !== void 0 ? quantity : 1,
+    };
+    return Object.assign(Object.assign({}, simulatedContract), { avatarUrl: (_a = definition.avatarUrl) !== null && _a !== void 0 ? _a : '', armorClass: null, baseItemType: ItemBaseTypeEnum.GEAR, additionalDamages: [], versatileDamage: null, reach: null, canAttune: false, canBeDedicatedWeapon: false, canEquip: false, canHexWeapon: false, canOffhand: false, canPactWeapon: false, categoryInfo: null, definitionKey: '', hexWeaponEnabled: false, isDedicatedWeapon: false, isHexWeapon: false, isPactWeapon: false, metaItems: [], pactWeaponEnabled: false, toHit: null, damage: null, infusion: null, infusionActions: [], isOffhand: false, isAdamantine: false, isMagic: false, isSilvered: false, damageType: definition.damageType, displayAsAttack: false, isCustom: true, isCustomized: false, isDisplayAsAttack: false, proficiency: false, modifiers: [], originalContract: customItem, spells: [], type: null, name: (_b = definition.name) !== null && _b !== void 0 ? _b : 'Unidentified Item', cost: deriveCost(simulatedContract, {}), weight: deriveWeight(simulatedContract, {}), capacityWeight: deriveCapacityWeight(simulatedContract, {}), notes, properties: [], stealthCheck: StealthCheckTypeEnum.NONE, masteryName: null, primarySourceCategoryId: -1, secondarySourceCategoryIds: [] });
+}
+/**
+ *
+ * @param baseWeapon
+ * @param parentItem
+ * @param valueLookup
+ * @param ruleData
+ */
+export function generateWeaponBehaviorBaseItem(baseWeapon, parentItem, valueLookup, ruleData) {
+    if (parentItem.definition === null) {
+        return null;
+    }
+    const item = Object.assign(Object.assign({}, parentItem), { definition: Object.assign(Object.assign(Object.assign({}, parentItem.definition), baseWeapon), { fixedDamage: null }) });
+    return Object.assign(Object.assign({}, item), { avatarUrl: deriveAvatarUrl(item, ruleData), baseItemType: ItemBaseTypeEnum.WEAPON, canAttune: deriveCanAttune(item, null), canEquip: deriveCanEquip(item, null), categoryInfo: deriveCategoryInfo(item, ruleData), cost: deriveCost(item, valueLookup), damageType: deriveDamageType(item, []), definitionKey: deriveDefinitionKey(item), isAdamantine: deriveIsAdamantine(item, valueLookup), isCustom: isCustomItem(item), isCustomized: deriveIsCustomized(item, valueLookup), isDisplayAsAttack: deriveIsDisplayAsAttack(item, valueLookup), isOffhand: deriveIsOffhand(item, valueLookup), isSilvered: deriveIsSilvered(item, valueLookup), isMagic: deriveIsMagic(item, null), infusion: null, infusionActions: [], modifiers: getModifiers(parentItem), name: deriveName(item, valueLookup), notes: deriveNotes(item, valueLookup), originalContract: null, properties: deriveProperties(item, [], ruleData), spells: [], type: deriveType(item, ruleData), weight: deriveWeight(item, valueLookup), capacityWeight: deriveCapacityWeight(item, valueLookup) });
+}
+/**
+ *
+ * @param items
+ * @param abilityLookup
+ * @param proficiencyBonus
+ * @param modifiers
+ * @param entityValueLookup
+ * @param typeValueLookup
+ * @param valueLookup
+ * @param martialArtsLevelScale
+ * @param ruleData
+ * @param hack__characterSpecialWeaponPropertiesEnabled
+ */
+export function generateItems(items, abilityLookup, proficiencyBonus, modifiers, entityValueLookup, typeValueLookup, valueLookup, martialArtsLevelScale, ruleData, hack__characterSpecialWeaponPropertiesEnabled) {
+    const { hexWeaponEnabled, pactWeaponEnabled, improvedPactWeaponEnabled, dedicatedWeaponEnabled } = hack__characterSpecialWeaponPropertiesEnabled;
+    return items.map((item) => generateItem(item, abilityLookup, proficiencyBonus, modifiers, entityValueLookup, typeValueLookup, valueLookup, martialArtsLevelScale, hexWeaponEnabled, pactWeaponEnabled, improvedPactWeaponEnabled, ruleData, dedicatedWeaponEnabled));
+}
+/**
+ *
+ * @param item
+ * @param abilityLookup
+ * @param proficiencyBonus
+ * @param modifiers
+ * @param entityValueLookup
+ * @param typeValueLookup
+ * @param valueLookup
+ * @param martialArtsLevel
+ * @param hexWeaponEnabled
+ * @param pactWeaponEnabled
+ * @param improvedPactWeaponEnabled
+ * @param ruleData
+ * @param dedicatedWeaponEnabled
+ */
+export function generateItem(item, abilityLookup, proficiencyBonus, modifiers, entityValueLookup, typeValueLookup, valueLookup, martialArtsLevelScale, hexWeaponEnabled, pactWeaponEnabled, improvedPactWeaponEnabled, ruleData, dedicatedWeaponEnabled) {
+    const mappingId = getMappingId(item);
+    const mappingIdString = ValueHacks.hack__toString(mappingId);
+    const mappingEntityTypeId = getMappingEntityTypeId(item);
+    const mappingEntityTypeIdString = ValueHacks.hack__toString(mappingEntityTypeId);
+    const dataLookup = ValueUtils.getEntityData(entityValueLookup, mappingIdString, mappingEntityTypeIdString);
+    const isOffhand = ValueUtils.getIsOffhand(valueLookup, mappingIdString, mappingEntityTypeIdString);
+    const damageBonus = ValueUtils.getFixedValueBonus(valueLookup, mappingIdString, mappingEntityTypeIdString);
+    const toHitBonus = ValueUtils.getToHitBonus(valueLookup, mappingIdString, mappingEntityTypeIdString);
+    const toHitOverride = ValueUtils.getToHitOverride(valueLookup, mappingIdString, mappingEntityTypeIdString);
+    const itemModifiers = getModifiers(item);
+    const isMonkWeapon = deriveIsMonkWeapon(item, modifiers);
+    const isOffhandWeapon = !!isOffhand;
+    const canOffhand = deriveCanWeaponOffhand(item, modifiers);
+    let canPactWeapon = false;
+    let isPactWeapon = false;
+    if (pactWeaponEnabled && (isBaseWeapon(item) || validateIsWeaponLike(item)) && !isAmmunition(item)) {
+        canPactWeapon = pactWeaponEnabled;
+        isPactWeapon =
+            dataLookup.hasOwnProperty(AdjustmentTypeEnum.IS_PACT_WEAPON) &&
+                !!ValueAccessors.getValue(dataLookup[AdjustmentTypeEnum.IS_PACT_WEAPON]);
+    }
+    const proficiency = deriveIsProficient(item, modifiers, isPactWeapon, typeValueLookup, ruleData);
+    let canHexWeapon = false;
+    let isHexWeapon = false;
+    if (hexWeaponEnabled && (isBaseWeapon(item) || validateIsWeaponLike(item)) && !isAmmunition(item)) {
+        canHexWeapon = deriveCanHexWeapon(item, proficiency);
+        isHexWeapon =
+            dataLookup.hasOwnProperty(AdjustmentTypeEnum.IS_HEXBLADE) &&
+                !!ValueAccessors.getValue(dataLookup[AdjustmentTypeEnum.IS_HEXBLADE]);
+    }
+    let canBeDedicatedWeapon = false;
+    let isDedicatedWeapon = false;
+    if (dedicatedWeaponEnabled && (isBaseWeapon(item) || validateIsWeaponLike(item)) && !isAmmunition(item)) {
+        canBeDedicatedWeapon = deriveCanBeDedicatedWeapon(item, proficiency);
+        isDedicatedWeapon =
+            dataLookup.hasOwnProperty(AdjustmentTypeEnum.IS_DEDICATED_WEAPON) &&
+                !!ValueAccessors.getValue(dataLookup[AdjustmentTypeEnum.IS_DEDICATED_WEAPON]);
+    }
+    const reach = deriveWeaponReach(item, modifiers, ruleData);
+    const additionalDamages = deriveWeaponAdditionalDamage(item);
+    let newDamage = null;
+    let versatileDamage = null;
+    let bestAbilityToHit = null;
+    const metaItems = [];
+    if (isBaseWeapon(item)) {
+        const adjustmentDamageBonus = damageBonus === null ? 0 : damageBonus;
+        const adjustmentToHitBonus = toHitBonus === null ? 0 : toHitBonus;
+        // get the current item bonus magic modifiers
+        const bonusMagicModifiers = itemModifiers.filter((modifier) => ModifierValidators.isBonusMagicModifier(modifier) &&
+            ModifierValidators.isValidAttunedItemModifier(modifier, item));
+        let bonusMagicModifierTotal = ModifierDerivers.sumModifiers(bonusMagicModifiers);
+        if (bonusMagicModifierTotal <= 0 && improvedPactWeaponEnabled && isPactWeapon) {
+            bonusMagicModifierTotal = 1;
+            // TODO hard coded for now, should be supplied from server data
+        }
+        // get anything else that may increase bonus magic
+        const globalBonusMagicModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusMagicModifier(modifier));
+        const globalBonusMagicModifierTotal = ModifierDerivers.sumModifiers(globalBonusMagicModifiers);
+        const totalModifierBonusMagic = globalBonusMagicModifierTotal + bonusMagicModifierTotal;
+        // test for proficiency
+        const weaponProficiencyBonus = proficiency ? proficiencyBonus : 0;
+        // figure out the best stat to use with weapon
+        let bestAbilityDamageBonus = 0;
+        if (isBaseWeapon(item) && !isAmmunition(item)) {
+            // find out about bonus toHit for current weapon
+            const bonusToHitModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusWeaponToHitModifier(modifier, item, ruleData));
+            const bonusToHitModifierTotal = ModifierDerivers.sumModifiers(bonusToHitModifiers, abilityLookup);
+            //get all the available ability stats for the weapon
+            const availableAbilities = deriveAvailableWeaponAbilities(item, modifiers, martialArtsLevelScale, isDedicatedWeapon, isPactWeapon, isHexWeapon);
+            // transform the available ability stats to have toHit and damage bonuses
+            const abilityPossibilities = CharacterDerivers.deriveAttackAbilityPossibilities(availableAbilities, modifiers, weaponProficiencyBonus, abilityLookup);
+            const bestAbility = HelperUtils.getLast(abilityPossibilities, ['toHit', 'modifier']);
+            if (bestAbility !== null) {
+                bestAbilityToHit =
+                    bestAbility.toHit + adjustmentToHitBonus + totalModifierBonusMagic + bonusToHitModifierTotal;
+                if (toHitOverride !== null) {
+                    bestAbilityToHit = toHitOverride;
+                }
+                const ignoreOffhandModifierRestrictionsModifiers = modifiers.filter((modifier) => ModifierValidators.isIgnoreOffhandModifierRestrictionsModifier(modifier));
+                if (isOffhandWeapon && ignoreOffhandModifierRestrictionsModifiers.length === 0) {
+                    bestAbilityDamageBonus = Math.min(0, bestAbility.damageBonus);
+                }
+                else {
+                    bestAbilityDamageBonus = bestAbility.damageBonus;
+                }
+            }
+        }
+        // generate new damage based on all the above info
+        const damage = getDefinitionDamage(item);
+        if (damage) {
+            const allDamageDice = [damage];
+            let martialArtsDie = null;
+            if (martialArtsLevelScale !== null && (isMonkWeapon || isDedicatedWeapon)) {
+                martialArtsDie = DiceDerivers.deriveMartialArtsDamageDie(martialArtsLevelScale);
+                allDamageDice.push(martialArtsDie);
+            }
+            const highestDamageDie = DiceUtils.getHighestDie(allDamageDice);
+            if (highestDamageDie !== null) {
+                const damageModifiers = modifiers.filter((modifier) => ModifierValidators.isValidWeaponDamageModifier(modifier, item, ruleData));
+                const damageModifierTotal = ModifierDerivers.sumModifiers(damageModifiers, abilityLookup);
+                const fixedDieValue = DiceAccessors.getFixedValue(highestDamageDie);
+                const damageFixedValue = fixedDieValue === null ? 0 : fixedDieValue;
+                newDamage = Object.assign(Object.assign({}, highestDamageDie), { fixedValue: damageFixedValue +
+                        totalModifierBonusMagic +
+                        damageModifierTotal +
+                        bestAbilityDamageBonus +
+                        adjustmentDamageBonus });
+                if (!isOffhandWeapon && hasWeaponProperty(item, WeaponPropertyEnum.VERSATILE)) {
+                    const versatileDamageModifiers = modifiers.filter((modifier) => ModifierValidators.isValidWeaponDamageModifier(modifier, item, ruleData, true));
+                    const versatileDamageModifierTotal = ModifierDerivers.sumModifiers(versatileDamageModifiers, abilityLookup);
+                    const versatileDieValuePossibilities = [];
+                    const diceValue = DiceAccessors.getValue(damage);
+                    const baseDamageVersatileDie = diceValue === null ? 0 : ruleData.versatileDieLookup[diceValue];
+                    versatileDieValuePossibilities.push(baseDamageVersatileDie);
+                    if (martialArtsLevelScale !== null && (isMonkWeapon || isDedicatedWeapon) && martialArtsDie) {
+                        const martialArtsDamageVersatileDie = DiceAccessors.getValue(martialArtsDie);
+                        if (martialArtsDamageVersatileDie !== null) {
+                            versatileDieValuePossibilities.push(martialArtsDamageVersatileDie);
+                        }
+                    }
+                    versatileDamage = Object.assign(Object.assign({}, newDamage), { diceValue: Math.max(...versatileDieValuePossibilities), fixedValue: damageFixedValue +
+                            totalModifierBonusMagic +
+                            versatileDamageModifierTotal +
+                            bestAbilityDamageBonus +
+                            adjustmentDamageBonus });
+                }
+            }
+        }
+        else {
+            const fixedDamage = getFixedDamage(item);
+            if (fixedDamage) {
+                newDamage = fixedDamage + totalModifierBonusMagic + bestAbilityDamageBonus + adjustmentDamageBonus;
+            }
+        }
+        if (martialArtsLevelScale !== null && (isMonkWeapon || isDedicatedWeapon)) {
+            metaItems.push('Martial Arts');
+        }
+    }
+    return Object.assign(Object.assign({}, item), { armorClass: deriveArmorClass(item), stealthCheck: deriveStealthCheck(item, modifiers), toHit: bestAbilityToHit, proficiency,
+        metaItems,
+        canOffhand,
+        isHexWeapon,
+        canHexWeapon,
+        isPactWeapon,
+        canPactWeapon,
+        isDedicatedWeapon,
+        canBeDedicatedWeapon,
+        hexWeaponEnabled,
+        pactWeaponEnabled, damage: newDamage, versatileDamage,
+        additionalDamages,
+        reach, masteryName: deriveMasteryName(item, modifiers), primarySourceCategoryId: derivePrimarySourceCategoryId(item, ruleData), secondarySourceCategoryIds: deriveSecondarySourceCategoryIds(item, ruleData) });
+}
+/**
+ *
+ * @param items
+ * @param modifierLookup
+ * @param spellLookup
+ * @param valueLookup
+ * @param inventoryInfusionLookup
+ * @param ruleData
+ */
+export function generateBaseItems(items, modifierLookup, spellLookup, valueLookup, inventoryInfusionLookup, ruleData) {
+    return items.map((item) => generateBaseItem(item, modifierLookup, spellLookup, valueLookup, inventoryInfusionLookup, ruleData));
+}
+/**
+ *
+ * @param item
+ * @param modifierLookup
+ * @param spellLookup
+ * @param valueLookup
+ * @param inventoryInfusionLookup
+ * @param ruleData
+ */
+export function generateBaseItem(item, modifierLookup, spellLookup, valueLookup, inventoryInfusionLookup, ruleData) {
+    const id = getId(item);
+    const entityTypeId = getEntityTypeId(item);
+    const infusion = HelperUtils.lookupDataOrFallback(inventoryInfusionLookup, getMappingId(item));
+    let infusionModifiers = [];
+    if (infusion) {
+        const selectedModifierData = InfusionAccessors.getSelectedModifierData(infusion);
+        if (selectedModifierData && selectedModifierData.modifiers) {
+            infusionModifiers = selectedModifierData.modifiers;
+        }
+    }
+    const modifiers = ModifierGenerators.generateModifiers(id, entityTypeId, modifierLookup, DataOriginTypeEnum.ITEM, item, null, infusionModifiers);
+    const baseSpells = SpellGenerators.generateBaseSpells(id, entityTypeId, spellLookup, DataOriginTypeEnum.ITEM, item, null, ruleData, {}, {});
+    const infusionActions = deriveInfusionActions(infusion, valueLookup, item);
+    const notes = deriveNotes(item, valueLookup);
+    return Object.assign(Object.assign({}, item), { avatarUrl: deriveAvatarUrl(item, ruleData), baseItemType: deriveBaseType(item), canAttune: deriveCanAttune(item, infusion), canEquip: deriveCanEquip(item, infusion), categoryInfo: deriveCategoryInfo(item, ruleData), cost: deriveCost(item, valueLookup), definitionKey: deriveDefinitionKey(item), damageType: deriveDamageType(item, modifiers), infusion,
+        infusionActions, isAdamantine: deriveIsAdamantine(item, valueLookup), isCustom: isCustomItem(item), isCustomized: deriveIsCustomized(item, valueLookup), isDisplayAsAttack: deriveIsDisplayAsAttack(item, valueLookup), isMagic: deriveIsMagic(item, infusion), isOffhand: deriveIsOffhand(item, valueLookup), isSilvered: deriveIsSilvered(item, valueLookup), limitedUse: deriveLimitedUse(infusionActions, getLimitedUse(item)), modifiers, name: deriveName(item, valueLookup), notes, originalContract: deriveOriginalCustomContract(item, notes), properties: deriveProperties(item, modifiers, ruleData), spells: baseSpells.map((spell) => updateBaseItemSpells(item, spell)), type: deriveType(item, ruleData), weight: deriveWeight(item, valueLookup), capacityWeight: deriveCapacityWeight(item, valueLookup) });
+}
+/**
+ *
+ * @param item
+ * @param spell
+ */
+function updateBaseItemSpells(item, spell) {
+    let spellLimitedUse = null;
+    if (spell.limitedUse) {
+        spellLimitedUse = spell.limitedUse;
+        const itemLimitedUse = getLimitedUse(item);
+        if (itemLimitedUse !== null) {
+            spellLimitedUse = Object.assign(Object.assign(Object.assign({}, spellLimitedUse), item.limitedUse), { 
+                // TODO fix when resetType on ItemLimitedUse is no longer a string
+                resetType: LimitedUseUtils.getResetTypeIdByName(LimitedUseAccessors.getResetTypeName(itemLimitedUse)) });
+        }
+    }
+    return Object.assign(Object.assign({}, spell), { limitedUse: spellLimitedUse });
+}
+/**
+ *
+ * @param items
+ * @param abilityLookup
+ * @param proficiencyBonus
+ * @param modifiers
+ * @param entityValueLookup
+ * @param typeValueLookup
+ * @param valueLookup
+ * @param martialArtsLevel
+ * @param ruleData
+ * @param hack__characterSpecialWeaponPropertiesEnabled
+ * @param characterId
+ */
+export function generateGearWeaponItems(items, abilityLookup, proficiencyBonus, modifiers, entityValueLookup, typeValueLookup, valueLookup, martialArtsLevelScale, ruleData, hack__characterSpecialWeaponPropertiesEnabled, characterId) {
+    const { hexWeaponEnabled, pactWeaponEnabled, improvedPactWeaponEnabled, dedicatedWeaponEnabled } = hack__characterSpecialWeaponPropertiesEnabled;
+    return items
+        .filter(isGearContract)
+        .filter((item) => hasItemWeaponBehaviors(item))
+        .filter((item) => isEquippedToCurrentCharacter(item, characterId))
+        .map((gearItem) => getItemWeaponBehaviors(gearItem)
+        .map((itemDefinition) => {
+        const simulatedBaseItem = generateWeaponBehaviorBaseItem(itemDefinition, gearItem, valueLookup, ruleData);
+        if (simulatedBaseItem === null) {
+            return null;
+        }
+        return generateItem(simulatedBaseItem, abilityLookup, proficiencyBonus, modifiers, entityValueLookup, typeValueLookup, valueLookup, martialArtsLevelScale, hexWeaponEnabled, pactWeaponEnabled, improvedPactWeaponEnabled, ruleData, dedicatedWeaponEnabled);
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined))
+        .reduce((acc, itemBehaviors) => {
+        acc.push(...itemBehaviors);
+        return acc;
+    }, []);
+}
+/**
+ *
+ * @param ruleData
+ * @param modifiers
+ */
+export function generateAttunedItemCountMax(ruleData, modifiers) {
+    const setAttunementModifiers = modifiers.filter((modifier) => ModifierValidators.isSetAttunementSlotsModifier(modifier));
+    if (setAttunementModifiers.length) {
+        const highestModifierValue = ModifierDerivers.deriveHighestModifierValue(setAttunementModifiers, null);
+        return HelperUtils.clampInt(highestModifierValue, RuleDataAccessors.getMinAttunedItemCountMax(ruleData), RuleDataAccessors.getMaxAttunedItemCountMax(ruleData));
+    }
+    return RuleDataAccessors.getDefaultAttunedItemCountMax(ruleData);
+}
+/**
+ *
+ * @param attunedItems
+ * @param attunedItemCountMax
+ */
+export function generateHasMaxAttunedItems(attunedItems, attunedItemCountMax) {
+    return attunedItems.length >= attunedItemCountMax;
+}
+/**
+ *
+ * @param items
+ */
+export function generateInventoryLookup(items) {
+    return keyBy(items, (item) => getMappingId(item));
+}
+/**
+ *
+ * @param items
+ * @param characterId
+ */
+export function generateEquippedItems(items, characterId) {
+    return items.filter((item) => isEquipped(item) && isEquippedToCurrentCharacter(item, characterId));
+}
+/**
+ *
+ * @param equippedItems
+ * @param attunedItemCountMax
+ */
+export function generateEquippedAttunedItems(equippedItems, attunedItemCountMax) {
+    return equippedItems.filter(isAttuned).slice(0, attunedItemCountMax);
+}
+/**
+ *
+ * @param equippedItems
+ * @param gearWeaponItems
+ */
+export function generateOrderedItemAttacks(equippedItems, gearWeaponItems) {
+    const equippedWeaponItems = equippedItems.filter(isWeaponContract);
+    return orderBy([...equippedWeaponItems, ...gearWeaponItems].filter(isDisplayAsAttack), [(item) => getName(item)]);
+}
+/**
+ *
+ * @param equippedItems
+ */
+export function generateValidEquipmentModifiers(equippedItems) {
+    const armorModifiers = deriveValidGlobalModifiersFromArmor(equippedItems.filter(isArmorContract));
+    const weaponModifiers = deriveValidGlobalModifiersFromWeapons(equippedItems.filter(isWeaponContract));
+    const gearModifiers = deriveValidGlobalModifiersFromGear(equippedItems.filter(isGearContract));
+    return [...armorModifiers, ...weaponModifiers, ...gearModifiers];
+}
+/**
+ *
+ * @param items
+ */
+export function generateRefItemData(items) {
+    let data = {};
+    items.forEach((item) => {
+        data[getUniqueKey(item)] = {
+            [DataOriginDataInfoKeyEnum.PRIMARY]: item,
+            [DataOriginDataInfoKeyEnum.PARENT]: null,
+        };
+    });
+    return data;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Item/hacks.js b/ddb_main/packages/rules-engine/es/engine/Item/hacks.js
new file mode 100644
index 0000000..dffe4e1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Item/hacks.js
@@ -0,0 +1,61 @@
+import { DB_STRING_CARAPACE, DB_STRING_INTEGRATED_PROTECTION } from '../Core';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { ModifierAccessors, ModifierDerivers, ModifierValidators } from '../Modifier';
+import { RacialTraitAccessors } from '../RacialTrait';
+import { getArmorTypeId } from './accessors';
+import { ArmorTypeEnum } from './constants';
+/**
+ * TODO fix this dirty dirty hack for Integrated Protection
+ * @param modifier
+ * @param modifierData
+ * @param hasLightArmorProficiency
+ */
+export function hack__getSetUnarmoredModifierValue(modifier, modifierData, hasLightArmorProficiency) {
+    const dataOrigin = ModifierAccessors.getDataOrigin(modifier);
+    const dataOriginType = ModifierAccessors.getDataOriginType(modifier);
+    if (dataOriginType === DataOriginTypeEnum.RACE &&
+        RacialTraitAccessors.getName(dataOrigin.primary) === DB_STRING_INTEGRATED_PROTECTION &&
+        ModifierAccessors.getValue(modifier) === 1 &&
+        !hasLightArmorProficiency) {
+        return ModifierDerivers.deriveValue(modifier, modifierData, undefined, false);
+    }
+    return ModifierDerivers.deriveValue(modifier, modifierData);
+}
+/**
+ * TODO fix this dirty dirty hack for Carapace
+ * @param modifier
+ * @param modifierData
+ * @param isWearingHeavyArmor
+ */
+export function hack__deriveBonusArmorModifierValue(modifier, modifierData, isWearingHeavyArmor) {
+    const dataOrigin = ModifierAccessors.getDataOrigin(modifier);
+    const dataOriginType = ModifierAccessors.getDataOriginType(modifier);
+    if (dataOriginType === DataOriginTypeEnum.RACE &&
+        RacialTraitAccessors.getName(dataOrigin.primary) === DB_STRING_CARAPACE &&
+        ModifierAccessors.getValue(modifier) === 1 &&
+        isWearingHeavyArmor) {
+        return 0;
+    }
+    return ModifierDerivers.deriveValue(modifier, modifierData);
+}
+// This is a very CLEAN hack, but should probably not be here
+// If we have a global modifier turning off disadvantage on stealth, and it is
+// medium armor master, we need to check if this is medium armor
+// since we only remove disadvantage in that case for that modifier
+/**
+ *
+ * @param item
+ * @param modifiers
+ * @returns {boolean}
+ */
+export function hack__deriveStealthMediumArmorMasterShouldReturnStealthDefinition(item, modifiers) {
+    if (modifiers.length === 1) {
+        if (ModifierValidators.isStealthDisadvantageRemoveModifierForMediumArmor(modifiers[0])) {
+            const armorType = getArmorTypeId(item);
+            if (armorType && armorType !== ArmorTypeEnum.MEDIUM_ARMOR) {
+                return true;
+            }
+        }
+    }
+    return false;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Item/index.js b/ddb_main/packages/rules-engine/es/engine/Item/index.js
new file mode 100644
index 0000000..dfce16c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Item/index.js
@@ -0,0 +1,14 @@
+import * as ItemAccessors from './accessors';
+import * as ItemConstants from './constants';
+import * as ItemDerivers from './derivers';
+import * as ItemGenerators from './generators';
+import * as ItemHacks from './hacks';
+import * as ItemNotes from './notes';
+import * as ItemSimulators from './simulators';
+import * as ItemTypings from './typings';
+import * as ItemUtils from './utils';
+import * as ItemValidators from './validators';
+export * from './typings';
+export * from './constants';
+export { ItemAccessors, ItemDerivers, ItemGenerators, ItemHacks, ItemNotes, ItemSimulators, ItemUtils, ItemValidators };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, ItemAccessors), ItemConstants), ItemDerivers), ItemGenerators), ItemHacks), ItemNotes), ItemTypings), ItemSimulators), ItemUtils), ItemValidators);
diff --git a/ddb_main/packages/rules-engine/es/engine/Item/notes.js b/ddb_main/packages/rules-engine/es/engine/Item/notes.js
new file mode 100644
index 0000000..5b31649
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Item/notes.js
@@ -0,0 +1,217 @@
+import { TypeScriptUtils } from '../../utils';
+import { AttackTypeRangeEnum, StealthCheckTypeEnum } from '../Core';
+import { InfusionAccessors } from '../Infusion';
+import { LimitedUseAccessors, LimitedUseDerivers } from '../LimitedUse';
+import { NoteGenerators } from '../Note';
+import { SpellAccessors } from '../Spell';
+import { getAdditionalDamages, getAttackType, getLimitedUse, getLongRange, getNotes, getProperties, getRange, getStealthCheck, getStrengthRequirement, getTags, isAdamantine, isOffhand, isSilvered, getArmorClass, getInfusion, isCustom, } from './accessors';
+import { WeaponPropertyEnum } from './constants';
+import { deriveCategoryInfo } from './derivers';
+import { getApplicableWeaponSpellDamageGroups, hasWeaponProperty, isBaseArmor, isBaseGear, isBaseWeapon, isShield, } from './utils';
+import { validateIsWeaponLike } from './validators';
+/**
+ *
+ * @param item
+ * @param ruleData
+ * @param abilityLookup
+ * @param proficiencyBonus
+ */
+function getLimitedUseNoteComponent(item, ruleData, abilityLookup, proficiencyBonus) {
+    const limitedUse = getLimitedUse(item);
+    if (!limitedUse) {
+        return null;
+    }
+    const maxUses = LimitedUseDerivers.deriveMaxUses(limitedUse, abilityLookup, ruleData, proficiencyBonus);
+    const numberUsed = LimitedUseAccessors.getNumberUsed(limitedUse);
+    const numberRemaining = maxUses - numberUsed;
+    if (maxUses === 1) {
+        return NoteGenerators.createPlainText(`1 Charge${numberUsed === 1 ? ' (Used)' : ''}`);
+    }
+    return NoteGenerators.createPlainText(`${numberRemaining}/${maxUses} Charges`);
+}
+function getPropertyNoteComponents(item) {
+    const properties = getProperties(item);
+    if (!properties.length) {
+        return null;
+    }
+    const notes = [];
+    properties.forEach((property, idx) => {
+        if (property.name !== null) {
+            notes.push(NoteGenerators.createPlainText(property.name));
+        }
+    });
+    return NoteGenerators.createGroup(notes, ', ');
+}
+function getRangeNoteComponent(item) {
+    if (getAttackType(item) === AttackTypeRangeEnum.RANGED ||
+        hasWeaponProperty(item, WeaponPropertyEnum.THROWN) ||
+        hasWeaponProperty(item, WeaponPropertyEnum.RANGE)) {
+        const range = getRange(item);
+        const longRange = getLongRange(item);
+        return NoteGenerators.createPlainText(`Range (${range}/${longRange})`);
+    }
+    return null;
+}
+function getUserNoteComponent(item) {
+    const notes = getNotes(item);
+    if (notes) {
+        return NoteGenerators.createPlainText(notes);
+    }
+    return null;
+}
+function getWeaponSpellDamageGroupsNoteComponents(item, weaponSpellDamageGroups, ruleData) {
+    const filteredSpellDamage = getApplicableWeaponSpellDamageGroups(item, weaponSpellDamageGroups);
+    if (!filteredSpellDamage.length) {
+        return null;
+    }
+    const notes = [];
+    filteredSpellDamage.forEach((spellDamageGroup) => {
+        const damageNotes = spellDamageGroup.damageDice.map((damage) => NoteGenerators.createDamage(damage.type, damage.dice, damage.restriction ? damage.restriction : ''));
+        const groupNotes = [
+            NoteGenerators.createPlainText(SpellAccessors.getName(spellDamageGroup.spell)),
+            NoteGenerators.createGroup(damageNotes, ', '),
+        ].filter(TypeScriptUtils.isNotNullOrUndefined);
+        notes.push(NoteGenerators.createGroup(groupNotes, ': '));
+    });
+    return NoteGenerators.createGroup(notes.filter(TypeScriptUtils.isNotNullOrUndefined), ', ');
+}
+/**
+ *
+ * @param item
+ * @param weaponSpellDamageGroups
+ * @param ruleData
+ * @param abilityLookup
+ * @param proficiencyBonus
+ */
+function getWeaponNoteComponents(item, weaponSpellDamageGroups, ruleData, abilityLookup, proficiencyBonus) {
+    const notes = [];
+    if (isBaseWeapon(item)) {
+        const additionalDamages = getAdditionalDamages(item);
+        if (additionalDamages) {
+            additionalDamages.forEach((additionalDamage, idx) => {
+                if (additionalDamage.damage !== null && additionalDamage.damageType !== null) {
+                    notes.push(NoteGenerators.createGroup([
+                        NoteGenerators.createPlainText('+'),
+                        NoteGenerators.createDamage(additionalDamage.damageType, additionalDamage.damage, additionalDamage.info),
+                    ], ''));
+                }
+            });
+        }
+    }
+    notes.push(getLimitedUseNoteComponent(item, ruleData, abilityLookup, proficiencyBonus));
+    if (isBaseWeapon(item)) {
+        const category = deriveCategoryInfo(item, ruleData);
+        if (category && category.name) {
+            notes.push(NoteGenerators.createPlainText(category.name));
+        }
+        if (isOffhand(item)) {
+            notes.push(NoteGenerators.createPlainText('Dual Wield'));
+        }
+        if (isSilvered(item)) {
+            notes.push(NoteGenerators.createPlainText('Silvered'));
+        }
+        if (isAdamantine(item)) {
+            notes.push(NoteGenerators.createPlainText('Adamantine'));
+        }
+    }
+    if (isBaseWeapon(item) || isBaseGear(item)) {
+        notes.push(getPropertyNoteComponents(item));
+    }
+    if (isBaseWeapon(item)) {
+        notes.push(getRangeNoteComponent(item));
+    }
+    notes.push(getWeaponSpellDamageGroupsNoteComponents(item, weaponSpellDamageGroups, ruleData));
+    notes.push(getUserNoteComponent(item));
+    return notes.filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param item
+ * @param ruleData
+ * @param abilityLookup
+ * @param proficiencyBonus
+ */
+function getArmorNoteComponents(item, ruleData, abilityLookup, proficiencyBonus) {
+    const notes = [];
+    notes.push(getLimitedUseNoteComponent(item, ruleData, abilityLookup, proficiencyBonus));
+    const armorClass = getArmorClass(item);
+    const strengthRequirement = getStrengthRequirement(item);
+    const stealthCheck = getStealthCheck(item);
+    if (isShield(item)) {
+        notes.push(NoteGenerators.createPlainText(`+${armorClass} AC`));
+    }
+    else {
+        notes.push(NoteGenerators.createPlainText(`AC ${armorClass}`));
+    }
+    if (strengthRequirement) {
+        notes.push(NoteGenerators.createPlainText(`Str ${strengthRequirement}`));
+    }
+    if (stealthCheck === StealthCheckTypeEnum.DISADVANTAGE) {
+        notes.push(NoteGenerators.createGroup([
+            NoteGenerators.createPlainText('Stealth'),
+            NoteGenerators.createDisadvantageIcon(),
+        ]));
+    }
+    notes.push(getUserNoteComponent(item));
+    return notes.filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param item
+ * @param ruleData
+ * @param abilityLookup
+ * @param proficiencyBonus
+ */
+function getGearNoteComponents(item, ruleData, abilityLookup, proficiencyBonus) {
+    const notes = [];
+    notes.push(getLimitedUseNoteComponent(item, ruleData, abilityLookup, proficiencyBonus));
+    const tags = getTags(item);
+    tags.forEach((tag) => {
+        notes.push(NoteGenerators.createPlainText(tag));
+    });
+    notes.push(getUserNoteComponent(item));
+    return notes.filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+function getCustomNoteComponents(item) {
+    const notes = [];
+    notes.push(getUserNoteComponent(item));
+    return notes.filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+function getInfusionNoteComponents(item, infusion) {
+    const notes = [];
+    notes.push(NoteGenerators.createPlainText(`Infusion: ${InfusionAccessors.getName(infusion)}`));
+    return notes;
+}
+/**
+ *
+ * @param item
+ * @param weaponSpellDamageGroups
+ * @param ruleData
+ * @param abilityLookup
+ * @param proficiencyBonus
+ */
+export function getNoteComponents(item, weaponSpellDamageGroups, ruleData, abilityLookup, proficiencyBonus) {
+    const notes = [];
+    const infusion = getInfusion(item);
+    if (infusion) {
+        notes.push(...getInfusionNoteComponents(item, infusion));
+    }
+    if (isBaseWeapon(item)) {
+        notes.push(...getWeaponNoteComponents(item, weaponSpellDamageGroups, ruleData, abilityLookup, proficiencyBonus));
+    }
+    else if (isBaseArmor(item)) {
+        notes.push(...getArmorNoteComponents(item, ruleData, abilityLookup, proficiencyBonus));
+    }
+    else if (isCustom(item)) {
+        notes.push(...getCustomNoteComponents(item));
+    }
+    else if (isBaseGear(item)) {
+        if (validateIsWeaponLike(item)) {
+            notes.push(...getWeaponNoteComponents(item, weaponSpellDamageGroups, ruleData, abilityLookup, proficiencyBonus));
+        }
+        else {
+            notes.push(...getGearNoteComponents(item, ruleData, abilityLookup, proficiencyBonus));
+        }
+    }
+    return notes.filter(TypeScriptUtils.isNotNullOrUndefined);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Item/simulators.js b/ddb_main/packages/rules-engine/es/engine/Item/simulators.js
new file mode 100644
index 0000000..433ffd2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Item/simulators.js
@@ -0,0 +1,24 @@
+import { StealthCheckTypeEnum } from '../Core';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { ModifierGenerators } from '../Modifier';
+import { getBundleSize, getDefinitionDamage, getDefinitionGrantedModifiers } from './accessors';
+import { deriveArmorClass, deriveAvatarUrl, deriveBaseType, deriveCanAttune, deriveCanEquip, deriveCapacityWeight, deriveCategoryInfo, deriveCost, deriveDamageType, deriveDefinitionKey, deriveIsDisplayAsAttack, deriveIsMagic, deriveIsProficient, deriveName, derivePrimarySourceCategoryId, deriveProperties, deriveSecondarySourceCategoryIds, deriveType, deriveWeaponAdditionalDamage, deriveWeaponReach, deriveWeight, } from './derivers';
+/**
+ *
+ * @param itemDefinition
+ * @param globalModifiers
+ * @param valueLookupByType
+ * @param ruleData
+ * @param overrides
+ */
+export function simulateItem(itemDefinition, globalModifiers, valueLookupByType, ruleData, overrides) {
+    var _a, _b;
+    const simulatedItemContract = Object.assign({ chargesUsed: 0, containerEntityId: -1, containerEntityTypeId: -1, containerDefinitionKey: '-1:-1', currency: null, definition: itemDefinition, definitionId: itemDefinition.id, definitionTypeId: -1, displayAsAttack: null, entityTypeId: -1, equipped: false, equippedEntityId: null, equippedEntityTypeId: null, id: -1, isAttuned: false, limitedUse: null, quantity: 1 }, ((_a = overrides === null || overrides === void 0 ? void 0 : overrides.simulatedItemContract) !== null && _a !== void 0 ? _a : {}));
+    const modifiers = (_b = getDefinitionGrantedModifiers(simulatedItemContract)) !== null && _b !== void 0 ? _b : [];
+    const simulatedItem = Object.assign(Object.assign({}, simulatedItemContract), { avatarUrl: deriveAvatarUrl(simulatedItemContract, ruleData), baseItemType: deriveBaseType(simulatedItemContract), canAttune: deriveCanAttune(simulatedItemContract, null), canEquip: deriveCanEquip(simulatedItemContract, null), categoryInfo: deriveCategoryInfo(simulatedItemContract, ruleData), cost: deriveCost(simulatedItemContract, {}), damageType: deriveDamageType(simulatedItemContract, []), definitionKey: deriveDefinitionKey(simulatedItemContract), isAdamantine: false, isCustom: false, isCustomized: false, isDisplayAsAttack: deriveIsDisplayAsAttack(simulatedItemContract, {}), isOffhand: false, isSilvered: false, isMagic: deriveIsMagic(simulatedItemContract, null), infusion: null, infusionActions: [], modifiers: modifiers.map((modifier) => ModifierGenerators.generateModifier(modifier, DataOriginTypeEnum.SIMULATED, null)), name: deriveName(simulatedItemContract, {}), notes: null, originalContract: null, properties: deriveProperties(simulatedItemContract, [], ruleData), spells: [], type: deriveType(simulatedItemContract, ruleData), weight: deriveWeight(simulatedItemContract, {}), capacityWeight: deriveCapacityWeight(simulatedItemContract, {}) });
+    const additionalDamages = deriveWeaponAdditionalDamage(simulatedItem);
+    const reach = deriveWeaponReach(simulatedItem, globalModifiers, ruleData);
+    const proficiency = deriveIsProficient(simulatedItem, globalModifiers, false, valueLookupByType, ruleData);
+    return Object.assign(Object.assign({}, simulatedItem), { armorClass: deriveArmorClass(simulatedItem), proficiency, quantity: getBundleSize(simulatedItem), canBeDedicatedWeapon: false, canHexWeapon: false, canOffhand: false, canPactWeapon: false, hexWeaponEnabled: false, isDedicatedWeapon: false, isHexWeapon: false, isPactWeapon: false, masteryName: null, metaItems: [], pactWeaponEnabled: false, toHit: 0, damage: getDefinitionDamage(simulatedItem), categoryInfo: deriveCategoryInfo(simulatedItem, ruleData), stealthCheck: StealthCheckTypeEnum.NONE, additionalDamages,
+        reach, versatileDamage: null, primarySourceCategoryId: derivePrimarySourceCategoryId(simulatedItem, ruleData), secondarySourceCategoryIds: deriveSecondarySourceCategoryIds(simulatedItem, ruleData) });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Item/utils.js b/ddb_main/packages/rules-engine/es/engine/Item/utils.js
new file mode 100644
index 0000000..20fbdb5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Item/utils.js
@@ -0,0 +1,179 @@
+import { orderBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { ActionAccessors } from '../Action';
+import { ContainerValidators } from '../Container';
+import { ValueHacks, ValueUtils } from '../Value';
+import { canAttune, getArmorTypeId, getAttackType, getBaseItemId, getBaseType, getBaseTypeId, getContainerDefinitionKey, getGearTypeId, getItemWeaponBehaviors, getMappingEntityTypeId, getMappingId, getMasteryName, getName, getPrimarySourceCategoryId, getProperties, getRarity, getSecondarySourceCategoryIds, isAttuned, isContainer, } from './accessors';
+import { ArmorTypeEnum, ItemBaseTypeEnum, ItemBaseTypeIdEnum, ItemRarityNameEnum, ItemTypeEnum, } from './constants';
+//TODO probably move alot of these to validators and validate naming :)
+export function isShield(armor) {
+    return getArmorTypeId(armor) === ArmorTypeEnum.SHIELD;
+}
+export function isAmmunition(item) {
+    return isWeaponContract(item) && getBaseItemId(item) === null;
+}
+export function isStaff(item) {
+    return getGearTypeId(item) === ItemTypeEnum.STAFF;
+}
+export function isRod(item) {
+    return getGearTypeId(item) === ItemTypeEnum.ROD;
+}
+export function isWand(item) {
+    return getGearTypeId(item) === ItemTypeEnum.WAND;
+}
+export function isAvailableToAttune(item) {
+    return canAttune(item) && !isAttuned(item);
+}
+export function hasItemWeaponBehaviors(item) {
+    return getItemWeaponBehaviors(item) && getItemWeaponBehaviors(item).length > 0;
+}
+/**
+ * @param item
+ */
+export function isWeaponContract(item) {
+    return getBaseTypeId(item) === ItemBaseTypeIdEnum.WEAPON;
+}
+/**
+ * @param item
+ */
+export function isArmorContract(item) {
+    return getBaseTypeId(item) === ItemBaseTypeIdEnum.ARMOR;
+}
+/**
+ * @param item
+ */
+export function isGearContract(item) {
+    return getBaseTypeId(item) === ItemBaseTypeIdEnum.GEAR;
+}
+/**
+ * @param item
+ */
+export function isBaseWeapon(item) {
+    return getBaseType(item) === ItemBaseTypeEnum.WEAPON;
+}
+/**
+ * @param item
+ */
+export function isBaseArmor(item) {
+    return getBaseType(item) === ItemBaseTypeEnum.ARMOR;
+}
+/**
+ * @param item
+ */
+export function isBaseGear(item) {
+    return getBaseType(item) === ItemBaseTypeEnum.GEAR;
+}
+/**
+ *
+ * @param item
+ */
+export function getWeaponBehaviorAttackTypes(item) {
+    let attackTypes = [];
+    if (isWeaponContract(item)) {
+        return [];
+    }
+    const weaponBehaviors = getItemWeaponBehaviors(item);
+    if (weaponBehaviors && weaponBehaviors.length) {
+        attackTypes = weaponBehaviors.map((behavior) => behavior.attackType);
+    }
+    return attackTypes.filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param item
+ * @param propertyName
+ */
+export function hasWeaponProperty(item, propertyName) {
+    return !!getProperties(item).find((property) => property.name === propertyName);
+}
+/**
+ *
+ * @param item
+ * @param weaponSpellDamageGroups
+ */
+export function getApplicableWeaponSpellDamageGroups(item, weaponSpellDamageGroups) {
+    const behaviorAttackTypes = getWeaponBehaviorAttackTypes(item);
+    return weaponSpellDamageGroups.filter((spellDamage) => (isWeaponContract(item) && spellDamage.attackTypeRange === getAttackType(item)) ||
+        (spellDamage.attackTypeRange && behaviorAttackTypes.includes(spellDamage.attackTypeRange)));
+}
+/**
+ *
+ * @param item
+ */
+export function getRarityLevel(item) {
+    switch (getRarity(item)) {
+        case ItemRarityNameEnum.ARTIFACT:
+            return 5;
+        case ItemRarityNameEnum.LEGENDARY:
+            return 4;
+        case ItemRarityNameEnum.VERY_RARE:
+            return 3;
+        case ItemRarityNameEnum.RARE:
+            return 2;
+        case ItemRarityNameEnum.UNCOMMON:
+            return 1;
+        case ItemRarityNameEnum.COMMON:
+        default:
+            return 0;
+    }
+}
+/**
+ *
+ * @param items
+ * @param attunedItemCountMax
+ */
+export function getAttunedSlots(items, attunedItemCountMax) {
+    const attunedSlots = [];
+    for (let i = 0; i < attunedItemCountMax; i++) {
+        attunedSlots.push(items[i] ? items[i] : null);
+    }
+    return attunedSlots;
+}
+export function sortInventoryItems(items, sortContainers) {
+    const sortCriteria = [
+        sortContainers ? (item) => isContainer(item) : () => { } /* no-op */,
+        (item) => getRarityLevel(item),
+        (item) => getName(item),
+        (item) => getMappingId(item),
+    ];
+    const sortOrder = ['desc', 'desc', 'asc', 'asc'];
+    return orderBy(items, sortCriteria, sortOrder);
+}
+export function isShared(item, containerLookup) {
+    const containerDefinitionKey = getContainerDefinitionKey(item);
+    return ContainerValidators.validateIsShared(containerDefinitionKey, containerLookup);
+}
+/**
+ *
+ * @param entityValueLookup
+ * @param items
+ */
+export function getInventoryValuesMappings(entityValueLookup, items) {
+    const itemValueLookups = items
+        .map((item) => ValueUtils.getEntityData(entityValueLookup, ValueHacks.hack__toString(getMappingId(item)), ValueHacks.hack__toString(getMappingEntityTypeId(item))))
+        .filter((lookup) => Object.keys(lookup).length > 0);
+    const itemValuesContracts = [];
+    for (let i = 0; i < itemValueLookups.length; i++) {
+        itemValuesContracts.push(...Object.values(itemValueLookups[i]));
+    }
+    return itemValuesContracts;
+}
+/**
+ *
+ * @param item
+ * @param actions
+ */
+export function getMasteryAction(item, actions) {
+    var _a;
+    const masteryName = getMasteryName(item);
+    if (masteryName) {
+        //Find the action where the actionName matches the masteryName (meaning the name is equal to the modifier friendly subtype name of the weapon mastery modifier type group)
+        return ((_a = actions.find((action) => {
+            return masteryName === ActionAccessors.getDefinitionName(action);
+        })) !== null && _a !== void 0 ? _a : null);
+    }
+    return null;
+}
+export function getAllSourceCategoryIds(item) {
+    return [getPrimarySourceCategoryId(item), ...getSecondarySourceCategoryIds(item)];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Item/validators.js b/ddb_main/packages/rules-engine/es/engine/Item/validators.js
new file mode 100644
index 0000000..bdf58fd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Item/validators.js
@@ -0,0 +1,76 @@
+import { canAttune, isAttuned, getEquippedEntityId, isEquipped, hasProficiency, isOffhand, getDefinitionEntityTypeId, } from './accessors';
+import { CUSTOM_ITEM_DEFINITION_ENTITY_TYPE_ID } from './constants';
+import { isGearContract, hasItemWeaponBehaviors, isWeaponContract, isAmmunition, isArmorContract, isShield, } from './utils';
+/**
+ *
+ * @param item
+ */
+export function validateIsWeaponLike(item) {
+    if (isGearContract(item) && hasItemWeaponBehaviors(item)) {
+        return true;
+    }
+    if (isWeaponContract(item) && !isAmmunition(item)) {
+        return true;
+    }
+    return false;
+}
+/**
+ *
+ * @param item
+ */
+export function isNonProficientEquippedArmorItem(item) {
+    return isArmorContract(item) && !!isEquipped(item) && !hasProficiency(item);
+}
+/**
+ *
+ * @param item
+ */
+export function isEquippedMainhandWeapon(item) {
+    return isWeaponContract(item) && !isOffhand(item) && !!isEquipped(item);
+}
+/**
+ *
+ * @param item
+ */
+export function isEquippedOffhandWeapon(item) {
+    return isWeaponContract(item) && isOffhand(item) && !!isEquipped(item);
+}
+/**
+ *
+ * @param item
+ */
+export function isEquippedShield(item) {
+    return isArmorContract(item) && isShield(item) && !!isEquipped(item);
+}
+/**
+ *
+ * @param item
+ */
+export function isEquippedNonShieldArmor(item) {
+    return isArmorContract(item) && !isShield(item) && !!isEquipped(item);
+}
+/**
+ *
+ * @param item
+ */
+export function validateCanContributeActions(item) {
+    if (canAttune(item)) {
+        return !!isAttuned(item);
+    }
+    return true;
+}
+/**
+ *
+ * @param item
+ * @param characterId
+ */
+export function isEquippedToCurrentCharacter(item, characterId) {
+    return getEquippedEntityId(item) === characterId;
+}
+/**
+ *
+ * @param item
+ */
+export function isCustomItem(item) {
+    return getDefinitionEntityTypeId(item) === CUSTOM_ITEM_DEFINITION_ENTITY_TYPE_ID;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/KnownInfusion/accessors.js b/ddb_main/packages/rules-engine/es/engine/KnownInfusion/accessors.js
new file mode 100644
index 0000000..8976b34
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/KnownInfusion/accessors.js
@@ -0,0 +1,42 @@
+import { HelperUtils } from '../Helper';
+export function getCharacterId(knownInfusion) {
+    return knownInfusion.characterId;
+}
+export function getChoiceKey(knownInfusion) {
+    return knownInfusion.choiceKey;
+}
+export function getUniqueKey(knownInfusion) {
+    return knownInfusion.uniqueKey;
+}
+export function getDefinitionKey(knownInfusion) {
+    return knownInfusion.definitionKey;
+}
+export function getMappingId(knownInfusion) {
+    return knownInfusion.id;
+}
+/**
+ * TODO remove this once it is a string
+ * @param knownInfusion
+ * @returns {number | null}
+ */
+export function getItemId(knownInfusion) {
+    if (knownInfusion.itemId !== null) {
+        return HelperUtils.parseInputInt(knownInfusion.itemId);
+    }
+    return null;
+}
+export function getItemName(knownInfusion) {
+    return knownInfusion.itemName;
+}
+export function getItemTypeId(knownInfusion) {
+    return knownInfusion.itemTypeId;
+}
+export function getLegacyItemTypeId(knownInfusion) {
+    return knownInfusion.legacyItemTypeId;
+}
+export function getSimulatedInfusion(knownInfusion) {
+    return knownInfusion.simulatedInfusion;
+}
+export function getItemDefinitionKey(knownInfusion) {
+    return knownInfusion.itemDefinitionKey;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/KnownInfusion/derivers.js b/ddb_main/packages/rules-engine/es/engine/KnownInfusion/derivers.js
new file mode 100644
index 0000000..a8efb26
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/KnownInfusion/derivers.js
@@ -0,0 +1,14 @@
+import { DefinitionHacks } from '../Definition';
+import { getItemId, getItemTypeId } from './accessors';
+/**
+ *
+ * @param knownInfusionMapping
+ */
+export function deriveItemDefinitionKey(knownInfusionMapping) {
+    const itemTypeId = getItemTypeId(knownInfusionMapping);
+    const itemId = getItemId(knownInfusionMapping);
+    if (!itemTypeId || !itemId) {
+        return null;
+    }
+    return DefinitionHacks.hack__generateDefinitionKey(itemTypeId, itemId);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/KnownInfusion/generators.js b/ddb_main/packages/rules-engine/es/engine/KnownInfusion/generators.js
new file mode 100644
index 0000000..14ca455
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/KnownInfusion/generators.js
@@ -0,0 +1,58 @@
+import { TypeScriptUtils } from '../../utils';
+import { HelperUtils } from '../Helper';
+import { InfusionAccessors, InfusionSimulators, InfusionTypeEnum } from '../Infusion';
+import { getUniqueKey, getDefinitionKey, getItemDefinitionKey, getSimulatedInfusion, getChoiceKey } from './accessors';
+import { deriveItemDefinitionKey } from './derivers';
+/**
+ *
+ * @param knownInfusions
+ */
+export function generateKnownInfusionLookupByChoiceKey(knownInfusions) {
+    return HelperUtils.generateNonNullLookup(knownInfusions, getUniqueKey);
+}
+/**
+ *
+ * @param knownInfusions
+ */
+export function generateKnownInfusionLookup(knownInfusions) {
+    return HelperUtils.generateNonNullLookup(knownInfusions, getDefinitionKey);
+}
+/**
+ *
+ * @param knownInfusions
+ */
+export function generateKnownReplicatedItems(knownInfusions) {
+    return knownInfusions.reduce((acc, knownInfusion) => {
+        const simulatedInfusion = getSimulatedInfusion(knownInfusion);
+        if (simulatedInfusion !== null && InfusionAccessors.getType(simulatedInfusion) === InfusionTypeEnum.REPLICATE) {
+            const itemDefinitionKey = getItemDefinitionKey(knownInfusion);
+            if (itemDefinitionKey !== null) {
+                acc = [...acc, itemDefinitionKey];
+            }
+        }
+        return acc;
+    }, []);
+}
+/**
+ *
+ * @param knownInfusions
+ * @param definitionPool
+ */
+export function generateKnownInfusions(knownInfusions, definitionPool, characterId) {
+    return knownInfusions
+        .map((knownInfusionMapping) => generateKnownInfusion(knownInfusionMapping, definitionPool, characterId))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param knownInfusionMapping
+ * @param definitionPool
+ */
+export function generateKnownInfusion(knownInfusionMapping, definitionPool, characterId) {
+    const definitionKey = getDefinitionKey(knownInfusionMapping);
+    if (!definitionKey) {
+        return null;
+    }
+    const uniqueKey = `${characterId}-${getChoiceKey(knownInfusionMapping)}`;
+    return Object.assign(Object.assign({}, knownInfusionMapping), { simulatedInfusion: InfusionSimulators.simulateInfusion(definitionKey, definitionPool), itemDefinitionKey: deriveItemDefinitionKey(knownInfusionMapping), uniqueKey });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/KnownInfusion/index.js b/ddb_main/packages/rules-engine/es/engine/KnownInfusion/index.js
new file mode 100644
index 0000000..322ac02
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/KnownInfusion/index.js
@@ -0,0 +1,7 @@
+import * as KnownInfusionAccessors from './accessors';
+import * as KnownInfusionDerivers from './derivers';
+import * as KnownInfusionGenerators from './generators';
+import * as KnownInfusionTypings from './typings';
+export * from './typings';
+export { KnownInfusionAccessors, KnownInfusionDerivers, KnownInfusionGenerators };
+export default Object.assign(Object.assign(Object.assign(Object.assign({}, KnownInfusionAccessors), KnownInfusionDerivers), KnownInfusionGenerators), KnownInfusionTypings);
diff --git a/ddb_main/packages/rules-engine/es/engine/LimitedUse/accessors.js b/ddb_main/packages/rules-engine/es/engine/LimitedUse/accessors.js
new file mode 100644
index 0000000..486b617
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/LimitedUse/accessors.js
@@ -0,0 +1,91 @@
+import { isLimitedUseContract } from './utils';
+/**
+ *
+ * @param limitedUse
+ */
+export function getName(limitedUse) {
+    return limitedUse.name;
+}
+/**
+ *
+ * @param limitedUse
+ */
+export function getResetType(limitedUse) {
+    return limitedUse.resetType;
+}
+/**
+ *
+ * @param limitedUse
+ */
+export function getOperator(limitedUse) {
+    return limitedUse.operator;
+}
+/**
+ *
+ * @param limitedUse
+ */
+export function getInitialMaxUses(limitedUse) {
+    var _a;
+    return (_a = limitedUse.maxUses) !== null && _a !== void 0 ? _a : 0;
+}
+/**
+ *
+ * @param limitedUse
+ */
+export function getNumberUsed(limitedUse) {
+    return limitedUse.numberUsed;
+}
+/**
+ *
+ * @param limitedUse
+ */
+export function getMinNumberConsumed(limitedUse) {
+    var _a;
+    const definitionMin = (_a = limitedUse.minNumberConsumed) !== null && _a !== void 0 ? _a : getMaxNumberConsumed(limitedUse);
+    return Math.max(1, definitionMin);
+}
+/**
+ *
+ * @param limitedUse
+ */
+export function getMaxNumberConsumed(limitedUse) {
+    return limitedUse.maxNumberConsumed;
+}
+/**
+ *
+ * @param limitedUse
+ */
+export function getStatModifierUsesId(limitedUse) {
+    if (isLimitedUseContract(limitedUse)) {
+        return limitedUse.statModifierUsesId;
+    }
+    return null;
+}
+/**
+ *
+ * @param limitedUse
+ */
+export function getResetTypeName(limitedUse) {
+    return limitedUse.resetType;
+}
+/**
+ *
+ * @param limitedUse
+ */
+export function getResetTypeDescription(limitedUse) {
+    return limitedUse.resetTypeDescription;
+}
+/**
+ *
+ * @param limitedUse
+ */
+export function getUseProficiencyBonus(limitedUse) {
+    return limitedUse.useProficiencyBonus;
+}
+/**
+ *
+ * @param limitedUse
+ */
+export function getProficiencyBonusOperator(limitedUse) {
+    return limitedUse.proficiencyBonusOperator;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/LimitedUse/constants.js b/ddb_main/packages/rules-engine/es/engine/LimitedUse/constants.js
new file mode 100644
index 0000000..67f7c4d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/LimitedUse/constants.js
@@ -0,0 +1,19 @@
+export var LimitedUseResetTypeEnum;
+(function (LimitedUseResetTypeEnum) {
+    LimitedUseResetTypeEnum[LimitedUseResetTypeEnum["SHORT_REST"] = 1] = "SHORT_REST";
+    LimitedUseResetTypeEnum[LimitedUseResetTypeEnum["LONG_REST"] = 2] = "LONG_REST";
+    LimitedUseResetTypeEnum[LimitedUseResetTypeEnum["DAWN"] = 3] = "DAWN";
+    LimitedUseResetTypeEnum[LimitedUseResetTypeEnum["OTHER"] = 4] = "OTHER";
+})(LimitedUseResetTypeEnum || (LimitedUseResetTypeEnum = {}));
+export var LimitedUseResetTypeNameEnum;
+(function (LimitedUseResetTypeNameEnum) {
+    LimitedUseResetTypeNameEnum["SHORT_REST"] = "Short Rest";
+    LimitedUseResetTypeNameEnum["LONG_REST"] = "Long Rest";
+    LimitedUseResetTypeNameEnum["DAWN"] = "Dawn";
+    LimitedUseResetTypeNameEnum["OTHER"] = "Other";
+})(LimitedUseResetTypeNameEnum || (LimitedUseResetTypeNameEnum = {}));
+export var EntityLimitedUseScaleOperatorEnum;
+(function (EntityLimitedUseScaleOperatorEnum) {
+    EntityLimitedUseScaleOperatorEnum[EntityLimitedUseScaleOperatorEnum["ADDITION"] = 1] = "ADDITION";
+    EntityLimitedUseScaleOperatorEnum[EntityLimitedUseScaleOperatorEnum["MULTIPLICATION"] = 2] = "MULTIPLICATION";
+})(EntityLimitedUseScaleOperatorEnum || (EntityLimitedUseScaleOperatorEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/LimitedUse/derivers.js b/ddb_main/packages/rules-engine/es/engine/LimitedUse/derivers.js
new file mode 100644
index 0000000..7814523
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/LimitedUse/derivers.js
@@ -0,0 +1,85 @@
+import { AbilityAccessors } from '../Ability';
+import { RuleDataAccessors } from '../RuleData';
+import { getInitialMaxUses, getNumberUsed, getOperator, getStatModifierUsesId, getUseProficiencyBonus, getProficiencyBonusOperator, } from './accessors';
+import { EntityLimitedUseScaleOperatorEnum } from './constants';
+import { isLimitedUseContract } from './utils';
+/**
+ *
+ * @param limitedUse
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function deriveMaxUses(limitedUse, abilityLookup, ruleData, proficiencyBonus) {
+    let initialMaxUses = getInitialMaxUses(limitedUse);
+    let minimumUses = RuleDataAccessors.getMinimumLimitedUseMaxUse(ruleData);
+    const statModifierUsesId = getStatModifierUsesId(limitedUse);
+    let scaledMaxUses = 0;
+    // If we are using a stat modifier
+    if (statModifierUsesId) {
+        const ability = abilityLookup[statModifierUsesId];
+        const abilityModifier = AbilityAccessors.getModifier(ability);
+        if (abilityModifier !== null) {
+            scaledMaxUses = abilityModifier;
+            // If it uses the multiplication operator, the min uses is the multiplier, there is no
+            // fixed value anymore since it is the multiplier now
+            if (isLimitedUseContract(limitedUse) &&
+                getOperator(limitedUse) === EntityLimitedUseScaleOperatorEnum.MULTIPLICATION) {
+                scaledMaxUses *= initialMaxUses;
+                minimumUses = initialMaxUses;
+                initialMaxUses = 0;
+            }
+        }
+        // If proficiency bonus flag is turned on
+        if (isLimitedUseContract(limitedUse) && getUseProficiencyBonus(limitedUse)) {
+            // If we are multiplying the proficiency bonus
+            if (getProficiencyBonusOperator(limitedUse) === EntityLimitedUseScaleOperatorEnum.MULTIPLICATION) {
+                // If we need to add the initial bonus, do that now before we reset it
+                // for the multiplication math
+                if (getOperator(limitedUse) === EntityLimitedUseScaleOperatorEnum.ADDITION) {
+                    scaledMaxUses += initialMaxUses;
+                }
+                scaledMaxUses *= proficiencyBonus;
+                minimumUses = initialMaxUses;
+                initialMaxUses = 0;
+            }
+            else {
+                // then we are adding the proficiency bonus
+                scaledMaxUses += proficiencyBonus;
+            }
+        }
+    }
+    else {
+        // Not using stat modifier, check for proficiency bonus use
+        if (isLimitedUseContract(limitedUse) && getUseProficiencyBonus(limitedUse)) {
+            // If proficiency bonus flag is turned on
+            if (getProficiencyBonusOperator(limitedUse) === EntityLimitedUseScaleOperatorEnum.MULTIPLICATION) {
+                scaledMaxUses = initialMaxUses * proficiencyBonus;
+                minimumUses = initialMaxUses;
+                initialMaxUses = 0;
+            }
+            else {
+                // Add proficiency bonus
+                scaledMaxUses += proficiencyBonus;
+            }
+        }
+    }
+    return Math.max(minimumUses, initialMaxUses + scaledMaxUses);
+}
+/**
+ *
+ * @param limitedUse
+ * @param abilityLookup
+ * @param ruleData
+ */
+export function deriveHasUsesAvailable(limitedUse, abilityLookup, ruleData, proficiencyBonus) {
+    if (!limitedUse) {
+        return true;
+    }
+    const maxUses = deriveMaxUses(limitedUse, abilityLookup, ruleData, proficiencyBonus);
+    const numberUsed = getNumberUsed(limitedUse);
+    if (numberUsed < maxUses) {
+        return true;
+    }
+    return false;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/LimitedUse/index.js b/ddb_main/packages/rules-engine/es/engine/LimitedUse/index.js
new file mode 100644
index 0000000..69cc1cd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/LimitedUse/index.js
@@ -0,0 +1,8 @@
+import * as LimitedUseAccessors from './accessors';
+import * as LimitedUseConstants from './constants';
+import * as LimitedUseDerivers from './derivers';
+import * as LimitedUseRenderers from './renderers';
+import * as LimitedUseUtils from './utils';
+export * from './constants';
+export { LimitedUseAccessors, LimitedUseDerivers, LimitedUseRenderers, LimitedUseUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, LimitedUseAccessors), LimitedUseConstants), LimitedUseDerivers), LimitedUseRenderers), LimitedUseUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/LimitedUse/renderers.js b/ddb_main/packages/rules-engine/es/engine/LimitedUse/renderers.js
new file mode 100644
index 0000000..a3a1b1c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/LimitedUse/renderers.js
@@ -0,0 +1,20 @@
+import { LimitedUseResetTypeEnum } from './constants';
+/**
+ *
+ * @param resetType
+ */
+export function renderLimitedUseResetAbbreviation(resetType) {
+    switch (resetType) {
+        case LimitedUseResetTypeEnum.LONG_REST:
+            return 'LR';
+        case LimitedUseResetTypeEnum.SHORT_REST:
+            return 'SR';
+        case LimitedUseResetTypeEnum.DAWN:
+            return 'D';
+        case LimitedUseResetTypeEnum.OTHER:
+            return 'O';
+        default:
+        // not implemented
+    }
+    return '';
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/LimitedUse/utils.js b/ddb_main/packages/rules-engine/es/engine/LimitedUse/utils.js
new file mode 100644
index 0000000..f8aa205
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/LimitedUse/utils.js
@@ -0,0 +1,14 @@
+import { LimitedUseResetTypeEnum } from './constants';
+/**
+ *
+ * @param limitedUse
+ */
+export function isLimitedUseContract(limitedUse) {
+    return limitedUse.statModifierUsesId !== undefined;
+}
+export function getResetTypeIdByName(name) {
+    if (name !== null && LimitedUseResetTypeEnum[name]) {
+        return LimitedUseResetTypeEnum[name];
+    }
+    return LimitedUseResetTypeEnum.OTHER;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Modifier/accessors.js b/ddb_main/packages/rules-engine/es/engine/Modifier/accessors.js
new file mode 100644
index 0000000..5d6ce4d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Modifier/accessors.js
@@ -0,0 +1,185 @@
+/**
+ *
+ * @param modifier
+ */
+export function getComponentId(modifier) {
+    return modifier.componentId;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getComponentTypeId(modifier) {
+    return modifier.componentTypeId;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getDice(modifier) {
+    return modifier.dice;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getStatId(modifier) {
+    return modifier.statId;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getSubType(modifier) {
+    return modifier.subType;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getType(modifier) {
+    return modifier.type;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getFriendlyTypeName(modifier) {
+    return modifier.friendlyTypeName;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getFriendlySubtypeName(modifier) {
+    return modifier.friendlySubtypeName;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getRestriction(modifier) {
+    return modifier.restriction;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getValue(modifier) {
+    return modifier.value;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getEntityId(modifier) {
+    return modifier.entityId;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getEntityTypeId(modifier) {
+    return modifier.entityTypeId;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getEntityKey(modifier) {
+    return `${getEntityId(modifier)}-${getEntityTypeId(modifier)}`;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isGranted(modifier) {
+    return modifier.isGranted;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getDataOrigin(modifier) {
+    return modifier.dataOrigin;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getDataOriginType(modifier) {
+    const dataOrigin = getDataOrigin(modifier);
+    return dataOrigin.type;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getBonusTypes(modifier) {
+    var _a;
+    return (_a = modifier.bonusTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param modifier
+ */
+export function getId(modifier) {
+    return modifier.id;
+}
+/**
+ *
+ * @param modifier
+ */
+export function requiresAttunement(modifier) {
+    return modifier.requiresAttunement;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getAtHigherLevels(modifier) {
+    return modifier.atHigherLevels;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getCount(modifier) {
+    return modifier.count;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getDie(modifier) {
+    return modifier.die;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getDurationUnit(modifier) {
+    return modifier.durationUnit;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getUsePrimaryStat(modifier) {
+    return modifier.usePrimaryStat;
+}
+/**
+ *
+ * @param modifier
+ */
+export function getValueTotal(modifier) {
+    var _a;
+    return (_a = modifier.valueTotal) !== null && _a !== void 0 ? _a : 0;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isAvailableToMulticlass(modifier) {
+    return modifier.availableToMulticlass;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Modifier/constants.js b/ddb_main/packages/rules-engine/es/engine/Modifier/constants.js
new file mode 100644
index 0000000..c1cfc98
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Modifier/constants.js
@@ -0,0 +1,326 @@
+export var ModifierBonusTypeEnum;
+(function (ModifierBonusTypeEnum) {
+    ModifierBonusTypeEnum[ModifierBonusTypeEnum["PROFICIENCY_BONUS"] = 1] = "PROFICIENCY_BONUS";
+    ModifierBonusTypeEnum[ModifierBonusTypeEnum["ATTUNED_ITEM_COUNT"] = 2] = "ATTUNED_ITEM_COUNT";
+    ModifierBonusTypeEnum[ModifierBonusTypeEnum["SPELL_LEVEL"] = 3] = "SPELL_LEVEL";
+})(ModifierBonusTypeEnum || (ModifierBonusTypeEnum = {}));
+export var ModifierTypeEnum;
+(function (ModifierTypeEnum) {
+    ModifierTypeEnum["SET_BASE"] = "set-base";
+    ModifierTypeEnum["BONUS"] = "bonus";
+    ModifierTypeEnum["SET"] = "set";
+    ModifierTypeEnum["STACKING_BONUS"] = "stacking-bonus";
+    ModifierTypeEnum["RESISTANCE"] = "resistance";
+    ModifierTypeEnum["IMMUNITY"] = "immunity";
+    ModifierTypeEnum["VULNERABILITY"] = "vulnerability";
+    ModifierTypeEnum["HALF_PROFICIENCY"] = "half-proficiency";
+    ModifierTypeEnum["HALF_PROFICIENCY_ROUND_UP"] = "half-proficiency-round-up";
+    ModifierTypeEnum["PROFICIENCY"] = "proficiency";
+    ModifierTypeEnum["TWICE_PROFICIENCY"] = "twice-proficiency";
+    ModifierTypeEnum["EXPERTISE"] = "expertise";
+    ModifierTypeEnum["DAMAGE"] = "damage";
+    ModifierTypeEnum["ADVANTAGE"] = "advantage";
+    ModifierTypeEnum["DISADVANTAGE"] = "disadvantage";
+    ModifierTypeEnum["SENSE"] = "sense";
+    ModifierTypeEnum["LANGUAGE"] = "language";
+    ModifierTypeEnum["IGNORE"] = "ignore";
+    ModifierTypeEnum["SIZE"] = "size";
+    ModifierTypeEnum["SPEED_REDUCTION"] = "speed-reduction";
+    ModifierTypeEnum["CARRYING_CAPACITY"] = "carrying-capacity";
+    ModifierTypeEnum["NATURAL_WEAPON"] = "natural-weapon";
+    ModifierTypeEnum["ELDRITCH_BLAST"] = "eldritch-blast";
+    ModifierTypeEnum["REPLACE_DAMAGE_TYPE"] = "replace-damage-type";
+    ModifierTypeEnum["REPLACE_WEAPON_ABILITY"] = "replace-weapon-ability";
+    ModifierTypeEnum["WEAPON_PROPERTY"] = "weapon-property";
+    ModifierTypeEnum["IGNORE_WEAPON_PROPERTY"] = "ignore-weapon-property";
+    ModifierTypeEnum["MONK_WEAPON"] = "monk-weapon";
+    ModifierTypeEnum["KENSEI"] = "kensei";
+    ModifierTypeEnum["PROTECTION"] = "protection";
+    ModifierTypeEnum["STEALTH_DISADVANTAGE"] = "stealth-disadvantage";
+    ModifierTypeEnum["WEAPON_MASTERY"] = "weapon-mastery";
+    ModifierTypeEnum["ENABLE_FEATURE"] = "enable-feature";
+})(ModifierTypeEnum || (ModifierTypeEnum = {}));
+export var ModifierSubTypeEnum;
+(function (ModifierSubTypeEnum) {
+    ModifierSubTypeEnum["ARMOR_CLASS"] = "armor-class";
+    ModifierSubTypeEnum["MAGIC"] = "magic";
+    ModifierSubTypeEnum["SPELL_SAVE_DC"] = "spell-save-dc";
+    ModifierSubTypeEnum["PROFICIENCY"] = "proficiency";
+    ModifierSubTypeEnum["PROFICIENCY_BONUS"] = "proficiency-bonus";
+    ModifierSubTypeEnum["ALL"] = "all";
+    ModifierSubTypeEnum["SELF"] = "self";
+    ModifierSubTypeEnum["REMOVE"] = "remove";
+    ModifierSubTypeEnum["DEATH"] = "death";
+    ModifierSubTypeEnum["ATTUNEMENT_SLOTS"] = "attunement-slots";
+    ModifierSubTypeEnum["INITIATIVE"] = "initiative";
+    ModifierSubTypeEnum["PASSIVE_PERCEPTION"] = "passive-perception";
+    ModifierSubTypeEnum["PASSIVE_INVESTIGATION"] = "passive-investigation";
+    ModifierSubTypeEnum["PASSIVE_INSIGHT"] = "passive-insight";
+    ModifierSubTypeEnum["AC_MAX_DEX_MODIFIER"] = "ac-max-dex-modifier";
+    ModifierSubTypeEnum["AC_MAX_DEX_ARMORED_MODIFIER"] = "ac-max-dex-armored-modifier";
+    ModifierSubTypeEnum["AC_MAX_DEX_UNARMORED_MODIFIER"] = "ac-max-dex-unarmored-modifier";
+    ModifierSubTypeEnum["SHIELD_AC_ON_DEX_SAVES"] = "shield-ac-on-dex-saves";
+    ModifierSubTypeEnum["OFFHAND_MODIFIER_RESTRICTIONS"] = "dual-wield-modifier-restrictions";
+    ModifierSubTypeEnum["OFFHAND_LIGHT_RESTRICTIONS"] = "dual-wield-light-restrictions";
+    ModifierSubTypeEnum["DUAL_WIELD_ARMOR_CLASS"] = "dual-wield-armor-class";
+    ModifierSubTypeEnum["EXTRA_ATTACKS"] = "extra-attacks";
+    ModifierSubTypeEnum["CANTRIP_DAMAGE"] = "cantrip-damage";
+    ModifierSubTypeEnum["WEAPON_ATTACKS"] = "weapon-attacks";
+    ModifierSubTypeEnum["MELEE_ATTACKS"] = "melee-attacks";
+    ModifierSubTypeEnum["RANGED_ATTACKS"] = "ranged-attacks";
+    ModifierSubTypeEnum["SPELL_ATTACKS"] = "spell-attacks";
+    ModifierSubTypeEnum["NATURAL_ATTACKS"] = "natural-attacks";
+    ModifierSubTypeEnum["MELEE_WEAPON_ATTACKS"] = "melee-weapon-attacks";
+    ModifierSubTypeEnum["RANGED_WEAPON_ATTACKS"] = "ranged-weapon-attacks";
+    ModifierSubTypeEnum["MELEE_SPELL_ATTACKS"] = "melee-spell-attacks";
+    ModifierSubTypeEnum["RANGED_SPELL_ATTACKS"] = "ranged-spell-attacks";
+    ModifierSubTypeEnum["MELEE_NATURAL_ATTACKS"] = "melee-natural-attacks";
+    ModifierSubTypeEnum["RANGED_NATURAL_ATTACKS"] = "ranged-natural-attacks";
+    ModifierSubTypeEnum["MELEE_UNARMED_ATTACKS"] = "melee-unarmed-attacks";
+    ModifierSubTypeEnum["RANGED_UNARMED_ATTACKS"] = "ranged-unarmed-attacks";
+    ModifierSubTypeEnum["UNARMED_ATTACKS"] = "unarmed-attacks";
+    ModifierSubTypeEnum["STRENGTH_ATTACKS"] = "strength-attacks";
+    ModifierSubTypeEnum["DEXTERITY_ATTACKS"] = "dexterity-attacks";
+    ModifierSubTypeEnum["ONE_HANDED_WEAPON_ATTACKS"] = "one-handed-weapon-attacks";
+    ModifierSubTypeEnum["TWO_HANDED_WEAPON_ATTACKS"] = "two-handed-weapon-attacks";
+    ModifierSubTypeEnum["ONE_HANDED_MELEE_ATTACKS"] = "one-handed-melee-attacks";
+    ModifierSubTypeEnum["TWO_HANDED_MELEE_ATTACKS"] = "two-handed-melee-attacks";
+    ModifierSubTypeEnum["ONE_HANDED_RANGED_ATTACKS"] = "one-handed-ranged-attacks";
+    ModifierSubTypeEnum["TWO_HANDED_RANGED_ATTACKS"] = "two-handed-ranged-attacks";
+    ModifierSubTypeEnum["THROWN_WEAPON_ATTACKS"] = "thrown-weapon-attacks";
+    ModifierSubTypeEnum["THROWN_MELEE_ATTACKS"] = "thrown-melee-attacks";
+    ModifierSubTypeEnum["THROWN_RANGED_ATTACKS"] = "thrown-ranged-attacks";
+    ModifierSubTypeEnum["UNARMORED_DEX_AC_BONUS"] = "unarmored-dex-ac-bonus";
+    ModifierSubTypeEnum["UNARMORED_ARMOR_CLASS"] = "unarmored-armor-class";
+    ModifierSubTypeEnum["ARMORED_ARMOR_CLASS"] = "armored-armor-class";
+    ModifierSubTypeEnum["UNARMORED_WHILE_ARMORED"] = "unarmored-while-armored";
+    ModifierSubTypeEnum["MINIMUM_BASE_ARMOR"] = "minimum-base-armor";
+    ModifierSubTypeEnum["UNARMED_DAMAGE_DIE"] = "unarmed-damage-die";
+    ModifierSubTypeEnum["HIT_POINTS"] = "hit-points";
+    ModifierSubTypeEnum["HIT_POINTS_PER_LEVEL"] = "hit-points-per-level";
+    ModifierSubTypeEnum["TEMPORARY_HIT_POINTS"] = "temporary-hit-points";
+    ModifierSubTypeEnum["GARGANTUAN"] = "gargantuan";
+    ModifierSubTypeEnum["HUGE"] = "huge";
+    ModifierSubTypeEnum["LARGE"] = "large";
+    ModifierSubTypeEnum["MEDIUM"] = "medium";
+    ModifierSubTypeEnum["SMALL"] = "small";
+    ModifierSubTypeEnum["TINY"] = "tiny";
+    ModifierSubTypeEnum["MULTIPLIER"] = "multiplier";
+    ModifierSubTypeEnum["STRENGTH_SCORE"] = "strength-score";
+    ModifierSubTypeEnum["DEXTERITY_SCORE"] = "dexterity-score";
+    ModifierSubTypeEnum["CONSTITUTION_SCORE"] = "constitution-score";
+    ModifierSubTypeEnum["INTELLIGENCE_SCORE"] = "intelligence-score";
+    ModifierSubTypeEnum["WISDOM_SCORE"] = "wisdom-score";
+    ModifierSubTypeEnum["CHARISMA_SCORE"] = "charisma-score";
+    ModifierSubTypeEnum["CHOOSE_AN_ABILITY_SCORE"] = "choose-an-ability-score";
+    ModifierSubTypeEnum["SPEED"] = "speed";
+    ModifierSubTypeEnum["SPEED_WALKING"] = "speed-walking";
+    ModifierSubTypeEnum["SPEED_FLYING"] = "speed-flying";
+    ModifierSubTypeEnum["SPEED_CLIMBING"] = "speed-climbing";
+    ModifierSubTypeEnum["SPEED_SWIMMING"] = "speed-swimming";
+    ModifierSubTypeEnum["SPEED_BURROWING"] = "speed-burrowing";
+    ModifierSubTypeEnum["INNATE_SPEED_WALKING"] = "innate-speed-walking";
+    ModifierSubTypeEnum["INNATE_SPEED_FLYING"] = "innate-speed-flying";
+    ModifierSubTypeEnum["INNATE_SPEED_CLIMBING"] = "innate-speed-climbing";
+    ModifierSubTypeEnum["INNATE_SPEED_SWIMMING"] = "innate-speed-swimming";
+    ModifierSubTypeEnum["INNATE_SPEED_BURROWING"] = "innate-speed-burrowing";
+    ModifierSubTypeEnum["UNARMORED_MOVEMENT"] = "unarmored-movement";
+    ModifierSubTypeEnum["SAVING_THROWS"] = "saving-throws";
+    ModifierSubTypeEnum["STRENGTH_SAVING_THROWS"] = "strength-saving-throws";
+    ModifierSubTypeEnum["DEXTERITY_SAVING_THROWS"] = "dexterity-saving-throws";
+    ModifierSubTypeEnum["CONSTITUTION_SAVING_THROWS"] = "constitution-saving-throws";
+    ModifierSubTypeEnum["INTELLIGENCE_SAVING_THROWS"] = "intelligence-saving-throws";
+    ModifierSubTypeEnum["WISDOM_SAVING_THROWS"] = "wisdom-saving-throws";
+    ModifierSubTypeEnum["CHARISMA_SAVING_THROWS"] = "charisma-saving-throws";
+    ModifierSubTypeEnum["DEATH_SAVING_THROWS"] = "death-saving-throws";
+    ModifierSubTypeEnum["ABILITY_SCORE_MAXIMUM"] = "ability-score-maximum";
+    ModifierSubTypeEnum["ABILITY_CHECKS"] = "ability-checks";
+    ModifierSubTypeEnum["STRENGTH_ABILITY_CHECKS"] = "strength-ability-checks";
+    ModifierSubTypeEnum["DEXTERITY_ABILITY_CHECKS"] = "dexterity-ability-checks";
+    ModifierSubTypeEnum["CONSTITUTION_ABILITY_CHECKS"] = "constitution-ability-checks";
+    ModifierSubTypeEnum["INTELLIGENCE_ABILITY_CHECKS"] = "intelligence-ability-checks";
+    ModifierSubTypeEnum["WISDOM_ABILITY_CHECKS"] = "wisdom-ability-checks";
+    ModifierSubTypeEnum["CHARISMA_ABILITY_CHECKS"] = "charisma-ability-checks";
+    ModifierSubTypeEnum["CRITICAL_HITS"] = "critical-hits";
+    ModifierSubTypeEnum["ACID"] = "acid";
+    ModifierSubTypeEnum["BLUDGEONING"] = "bludgeoning";
+    ModifierSubTypeEnum["COLD"] = "cold";
+    ModifierSubTypeEnum["FIRE"] = "fire";
+    ModifierSubTypeEnum["FORCE"] = "force";
+    ModifierSubTypeEnum["LIGHTNING"] = "lightning";
+    ModifierSubTypeEnum["NECROTIC"] = "necrotic";
+    ModifierSubTypeEnum["PIERCING"] = "piercing";
+    ModifierSubTypeEnum["POISON"] = "poison";
+    ModifierSubTypeEnum["PSYCHIC"] = "psychic";
+    ModifierSubTypeEnum["RADIANT"] = "radiant";
+    ModifierSubTypeEnum["SLASHING"] = "slashing";
+    ModifierSubTypeEnum["THUNDER"] = "thunder";
+    ModifierSubTypeEnum["BLUDGEONING_PIERCING_SLASHING_NONMAGIC"] = "bludgeoning--piercing--and-slashing-from-nonmagical-weapons";
+    ModifierSubTypeEnum["BLINDSIGHT"] = "blindsight";
+    ModifierSubTypeEnum["DARKVISION"] = "darkvision";
+    ModifierSubTypeEnum["TREMORSENSE"] = "tremorsense";
+    ModifierSubTypeEnum["TRUESIGHT"] = "truesight";
+    ModifierSubTypeEnum["NATURAL_WEAPON"] = "natural-weapon";
+    ModifierSubTypeEnum["UNARMED_STRIKE"] = "unarmed-strike";
+    ModifierSubTypeEnum["HEAVY_ARMOR_SPEED_REDUCTION"] = "heavy-armor-speed-reduction";
+    // Armor
+    ModifierSubTypeEnum["LIGHT_ARMOR"] = "light-armor";
+    ModifierSubTypeEnum["MEDIUM_ARMOR"] = "medium-armor";
+    ModifierSubTypeEnum["HEAVY_ARMOR"] = "heavy-armor";
+    ModifierSubTypeEnum["SHIELDS"] = "shields";
+    // light armor
+    ModifierSubTypeEnum["PADDED"] = "padded";
+    ModifierSubTypeEnum["LEATHER"] = "leather";
+    ModifierSubTypeEnum["STUDDED_LEATHER"] = "studded-leather";
+    ModifierSubTypeEnum["PRIDE_SILK_OUTFIT"] = "pride-silk-outfit";
+    ModifierSubTypeEnum["BARK_ARMOR"] = "bark-armor";
+    // medium armor
+    ModifierSubTypeEnum["HIDE"] = "hide";
+    ModifierSubTypeEnum["CHAIN_SHIRT"] = "chain-shirt";
+    ModifierSubTypeEnum["SCALE_MAIL"] = "scale-mail";
+    ModifierSubTypeEnum["BREASTPLATE"] = "breastplate";
+    ModifierSubTypeEnum["HALF_PLATE"] = "half-plate";
+    ModifierSubTypeEnum["SPIKED_ARMOR"] = "spiked-armor";
+    ModifierSubTypeEnum["SCUMWEED_ARMOR"] = "scumweed-armor";
+    // heavy armor
+    ModifierSubTypeEnum["RING_MAIL"] = "ring-mail";
+    ModifierSubTypeEnum["CHAIN_MAIL"] = "chain-mail";
+    ModifierSubTypeEnum["SPLINT"] = "splint";
+    ModifierSubTypeEnum["PLATE"] = "plate";
+    ModifierSubTypeEnum["POWERED_ARMOR"] = "powered-armor";
+    ModifierSubTypeEnum["DIVERS_ARMOR"] = "divers-armor";
+    // shields
+    ModifierSubTypeEnum["SHIELD"] = "shield";
+    ModifierSubTypeEnum["POT_LID"] = "pot-lid";
+    ModifierSubTypeEnum["PROPERTY_AMMUNITION"] = "ammunition";
+    ModifierSubTypeEnum["PROPERTY_FINESSE"] = "finesse";
+    ModifierSubTypeEnum["PROPERTY_HEAVY"] = "heavy";
+    ModifierSubTypeEnum["PROPERTY_LIGHT"] = "light";
+    ModifierSubTypeEnum["PROPERTY_LOADING"] = "loading";
+    ModifierSubTypeEnum["PROPERTY_RANGE"] = "range";
+    ModifierSubTypeEnum["PROPERTY_REACH"] = "reach";
+    ModifierSubTypeEnum["PROPERTY_SPECIAL"] = "special";
+    ModifierSubTypeEnum["PROPERTY_THROWN"] = "thrown";
+    ModifierSubTypeEnum["PROPERTY_TWO_HANDED"] = "two-handed";
+    ModifierSubTypeEnum["PROPERTY_VERSATILE"] = "versatile";
+    ModifierSubTypeEnum["MELEE_REACH"] = "melee-reach";
+    // edlritch blast
+    ModifierSubTypeEnum["BONUS_DAMAGE"] = "bonus-damage";
+    ModifierSubTypeEnum["BONUS_RANGE"] = "bonus-range";
+    ModifierSubTypeEnum["SPELL_ATTACK_RANGE_MULTIPLIER"] = "spell-attack-range-multiplier";
+    ModifierSubTypeEnum["ZERO_HP"] = "0-hp";
+    ModifierSubTypeEnum["MAGIC_ITEM_ATTACK_WITH_STRENGTH"] = "magic-item-attack-with-strength";
+    ModifierSubTypeEnum["MAGIC_ITEM_ATTACK_WITH_DEXTERITY"] = "magic-item-attack-with-dexterity";
+    ModifierSubTypeEnum["MAGIC_ITEM_ATTACK_WITH_CONSTITUTION"] = "magic-item-attack-with-constitution";
+    ModifierSubTypeEnum["MAGIC_ITEM_ATTACK_WITH_INTELLIGENCE"] = "magic-item-attack-with-intelligence";
+    ModifierSubTypeEnum["MAGIC_ITEM_ATTACK_WITH_WISDOM"] = "magic-item-attack-with-wisdom";
+    ModifierSubTypeEnum["MAGIC_ITEM_ATTACK_WITH_CHARISMA"] = "magic-item-attack-with-charisma";
+    // Spell Groups
+    ModifierSubTypeEnum["SPELL_GROUP_HEALING"] = "spell-group-healing";
+    // Warlock Feature
+    ModifierSubTypeEnum["ENABLE_PACT_WEAPON"] = "enable-pact-weapon";
+    ModifierSubTypeEnum["ENABLE_HEX_WEAPON"] = "enable-hex-weapon";
+})(ModifierSubTypeEnum || (ModifierSubTypeEnum = {}));
+export const SIZE_LIST = [
+    ModifierSubTypeEnum.GARGANTUAN,
+    ModifierSubTypeEnum.HUGE,
+    ModifierSubTypeEnum.LARGE,
+    ModifierSubTypeEnum.MEDIUM,
+    ModifierSubTypeEnum.SMALL,
+    ModifierSubTypeEnum.TINY,
+];
+export const DAMAGE_ADJUSTMENT_LIST = [
+    ModifierSubTypeEnum.ACID,
+    ModifierSubTypeEnum.BLUDGEONING,
+    ModifierSubTypeEnum.COLD,
+    ModifierSubTypeEnum.FIRE,
+    ModifierSubTypeEnum.FORCE,
+    ModifierSubTypeEnum.LIGHTNING,
+    ModifierSubTypeEnum.NECROTIC,
+    ModifierSubTypeEnum.PIERCING,
+    ModifierSubTypeEnum.POISON,
+    ModifierSubTypeEnum.PSYCHIC,
+    ModifierSubTypeEnum.RADIANT,
+    ModifierSubTypeEnum.SLASHING,
+    ModifierSubTypeEnum.THUNDER,
+    ModifierSubTypeEnum.BLUDGEONING_PIERCING_SLASHING_NONMAGIC,
+];
+export const LIGHT_ARMOR_LIST = [
+    ModifierSubTypeEnum.PADDED,
+    ModifierSubTypeEnum.LEATHER,
+    ModifierSubTypeEnum.STUDDED_LEATHER,
+    ModifierSubTypeEnum.PRIDE_SILK_OUTFIT,
+    ModifierSubTypeEnum.BARK_ARMOR,
+];
+export const MEDIUM_ARMOR_LIST = [
+    ModifierSubTypeEnum.HIDE,
+    ModifierSubTypeEnum.CHAIN_SHIRT,
+    ModifierSubTypeEnum.SCALE_MAIL,
+    ModifierSubTypeEnum.BREASTPLATE,
+    ModifierSubTypeEnum.HALF_PLATE,
+    ModifierSubTypeEnum.SPIKED_ARMOR,
+    ModifierSubTypeEnum.SCUMWEED_ARMOR,
+];
+export const HEAVY_ARMOR_LIST = [
+    ModifierSubTypeEnum.RING_MAIL,
+    ModifierSubTypeEnum.CHAIN_MAIL,
+    ModifierSubTypeEnum.SPLINT,
+    ModifierSubTypeEnum.PLATE,
+    ModifierSubTypeEnum.POWERED_ARMOR,
+    ModifierSubTypeEnum.DIVERS_ARMOR,
+];
+export const SHIELDS_LIST = [
+    ModifierSubTypeEnum.SHIELD,
+    ModifierSubTypeEnum.POT_LID,
+];
+export const ALL_ARMOR_LIST = [
+    ...LIGHT_ARMOR_LIST,
+    ...MEDIUM_ARMOR_LIST,
+    ...HEAVY_ARMOR_LIST,
+    ...SHIELDS_LIST,
+];
+export const PROPERTY_LIST = [
+    ModifierSubTypeEnum.PROPERTY_AMMUNITION,
+    ModifierSubTypeEnum.PROPERTY_FINESSE,
+    ModifierSubTypeEnum.PROPERTY_HEAVY,
+    ModifierSubTypeEnum.PROPERTY_LIGHT,
+    ModifierSubTypeEnum.PROPERTY_LOADING,
+    ModifierSubTypeEnum.PROPERTY_RANGE,
+    ModifierSubTypeEnum.PROPERTY_REACH,
+    // ModifierSubTypeEnum.PROPERTY_SPECIAL,
+    ModifierSubTypeEnum.PROPERTY_THROWN,
+    ModifierSubTypeEnum.PROPERTY_TWO_HANDED,
+    ModifierSubTypeEnum.PROPERTY_VERSATILE,
+];
+export const MAGIC_ITEM_ATTACK_WITH_STAT_LIST = [
+    ModifierSubTypeEnum.MAGIC_ITEM_ATTACK_WITH_STRENGTH,
+    ModifierSubTypeEnum.MAGIC_ITEM_ATTACK_WITH_DEXTERITY,
+    ModifierSubTypeEnum.MAGIC_ITEM_ATTACK_WITH_CONSTITUTION,
+    ModifierSubTypeEnum.MAGIC_ITEM_ATTACK_WITH_INTELLIGENCE,
+    ModifierSubTypeEnum.MAGIC_ITEM_ATTACK_WITH_WISDOM,
+    ModifierSubTypeEnum.MAGIC_ITEM_ATTACK_WITH_CHARISMA,
+];
+export const STAT_SAVING_THROW_LIST = [
+    ModifierSubTypeEnum.STRENGTH_SAVING_THROWS,
+    ModifierSubTypeEnum.DEXTERITY_SAVING_THROWS,
+    ModifierSubTypeEnum.CONSTITUTION_SAVING_THROWS,
+    ModifierSubTypeEnum.INTELLIGENCE_SAVING_THROWS,
+    ModifierSubTypeEnum.WISDOM_SAVING_THROWS,
+    ModifierSubTypeEnum.CHARISMA_SAVING_THROWS,
+];
+export const STAT_ABILITY_CHECK_LIST = [
+    ModifierSubTypeEnum.STRENGTH_ABILITY_CHECKS,
+    ModifierSubTypeEnum.DEXTERITY_ABILITY_CHECKS,
+    ModifierSubTypeEnum.CONSTITUTION_ABILITY_CHECKS,
+    ModifierSubTypeEnum.INTELLIGENCE_ABILITY_CHECKS,
+    ModifierSubTypeEnum.WISDOM_ABILITY_CHECKS,
+    ModifierSubTypeEnum.CHARISMA_ABILITY_CHECKS,
+];
+export const STAT_ABILITY_SCORE_LIST = [
+    ModifierSubTypeEnum.STRENGTH_SCORE,
+    ModifierSubTypeEnum.DEXTERITY_SCORE,
+    ModifierSubTypeEnum.CONSTITUTION_SCORE,
+    ModifierSubTypeEnum.INTELLIGENCE_SCORE,
+    ModifierSubTypeEnum.WISDOM_SCORE,
+    ModifierSubTypeEnum.CHARISMA_SCORE,
+];
diff --git a/ddb_main/packages/rules-engine/es/engine/Modifier/derivers.js b/ddb_main/packages/rules-engine/es/engine/Modifier/derivers.js
new file mode 100644
index 0000000..5e739d2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Modifier/derivers.js
@@ -0,0 +1,246 @@
+import { AbilityAccessors } from '../Ability';
+import { AbilityStatEnum } from '../Core';
+import { DiceAdjustmentRollTypeEnum } from '../Dice';
+import { HelperUtils } from '../Helper';
+import { getBonusTypes, getDataOrigin, getId, getRestriction, getStatId, getSubType, getValue, getValueTotal, } from './accessors';
+import { STAT_ABILITY_CHECK_LIST, ModifierBonusTypeEnum, ModifierSubTypeEnum, STAT_SAVING_THROW_LIST, } from './constants';
+/**
+ *
+ * @param modifier
+ * @param abilityLookup
+ * @param minimumValue
+ */
+export function deriveStatScaledModifierValue(modifier, abilityLookup, minimumValue = 0) {
+    const statId = getStatId(modifier);
+    if (abilityLookup === null || statId === null) {
+        return 0;
+    }
+    const stat = abilityLookup[statId];
+    if (!stat) {
+        return 0;
+    }
+    const statModifier = AbilityAccessors.getModifier(stat);
+    if (statModifier === null) {
+        return minimumValue;
+    }
+    return Math.max(statModifier, minimumValue);
+}
+/**
+ *
+ * @param modifier
+ * @param defaultValue
+ */
+export function deriveFixedModifierValue(modifier, defaultValue = 0) {
+    const value = getValue(modifier);
+    return value === null ? defaultValue : value;
+}
+/**
+ * @deprecated deriveValue
+ * @param modifier
+ * @param abilityLookup
+ * @param minimumValue
+ */
+export function getModifierValue(modifier, abilityLookup, minimumValue = 0) {
+    let value = 0;
+    if (abilityLookup !== null && getStatId(modifier) !== null) {
+        value += deriveStatScaledModifierValue(modifier, abilityLookup, minimumValue);
+    }
+    const fixedValue = deriveFixedModifierValue(modifier);
+    return value + (fixedValue === null ? 0 : fixedValue);
+}
+// TODO rename to sumModifierValues
+// TODO go through uses of this and remove any places where I am summing scaled and fixed separately outside of this
+// TODO go through uses and add stats to sum so stat scaling can be used automagically
+/**
+ * @deprecated deriveTotalValue
+ * @param modifiers
+ * @param abilityLookup
+ * @param minimumValue
+ * @param initialValue
+ */
+export function sumModifiers(modifiers, abilityLookup = null, minimumValue = 0, initialValue = 0) {
+    return modifiers.reduce((acc, modifier) => (acc += getModifierValue(modifier, abilityLookup, minimumValue)), initialValue);
+}
+/**
+ *
+ * @param modifier
+ * @param modifierData
+ * @param minimumValue
+ * @param includeBonusTypes
+ * @param additionalBonusValueLookup - A lookup that maps an additional ModifierBonusTypeEnum to its bonus value. eg Disciple of Life
+ */
+export function deriveValue(modifier, modifierData, minimumValue = 0, includeBonusTypes = true, additionalBonusValueLookup = {}) {
+    let baseValue = 0;
+    if (getStatId(modifier) !== null) {
+        baseValue = deriveStatScaledModifierValue(modifier, modifierData.abilityLookup, minimumValue);
+    }
+    const fixedValue = deriveFixedModifierValue(modifier);
+    if (fixedValue !== null) {
+        baseValue += fixedValue;
+    }
+    let bonusValue = 0;
+    const modifierBonusTypes = getBonusTypes(modifier);
+    if (includeBonusTypes && modifierBonusTypes) {
+        if (modifierBonusTypes.includes(ModifierBonusTypeEnum.PROFICIENCY_BONUS)) {
+            bonusValue += modifierData.proficiencyBonus;
+        }
+        if (modifierBonusTypes.includes(ModifierBonusTypeEnum.ATTUNED_ITEM_COUNT)) {
+            bonusValue += modifierData.attunedItemCount;
+        }
+        if (modifierBonusTypes.includes(ModifierBonusTypeEnum.SPELL_LEVEL)) {
+            bonusValue += HelperUtils.lookupDataOrFallback(additionalBonusValueLookup, ModifierBonusTypeEnum.SPELL_LEVEL, 0);
+        }
+    }
+    return baseValue + bonusValue;
+}
+/**
+ *
+ * @param modifiers
+ * @param modifierData
+ * @param minimumValue
+ * @param initialValue
+ */
+export function deriveTotalValue(modifiers, modifierData, minimumValue = 0, initialValue = 0) {
+    return modifiers.reduce((acc, modifier) => (acc += deriveValue(modifier, modifierData, minimumValue)), initialValue);
+}
+/**
+ *
+ * @param modifiers
+ * @param modifierData
+ * @param minimumValue
+ * @param includeBonusTypes
+ * @param additionalBonusValueLookup
+ */
+export function deriveHighestValue(modifiers, modifierData, minimumValue = 0, includeBonusTypes = true, additionalBonusValueLookup = {}) {
+    if (!modifiers.length) {
+        return 0;
+    }
+    return Math.max(...modifiers.map((modifier) => deriveValue(modifier, modifierData, minimumValue, includeBonusTypes, additionalBonusValueLookup)));
+}
+/**
+ *
+ * @param modifiers
+ * @param modifierData
+ * @param fallback
+ */
+export function deriveHighestValueModifier(modifiers, modifierData, fallback = null) {
+    if (!modifiers.length) {
+        return fallback;
+    }
+    return HelperUtils.getLast(modifiers, (modifier) => deriveValue(modifier, modifierData));
+}
+/**
+ * @deprecated deriveHighestValue
+ * @param modifiers
+ * @param abilityLookup
+ */
+export function deriveHighestModifierValue(modifiers, abilityLookup = null) {
+    if (!modifiers.length) {
+        return 0;
+    }
+    return Math.max(...modifiers.map((modifier) => getModifierValue(modifier, abilityLookup)));
+}
+/**
+ *
+ * @param modifier
+ * @param type
+ */
+export function deriveDiceAdjustment(modifier, type) {
+    var _a;
+    return {
+        type,
+        rollType: deriveRollType(modifier),
+        statId: deriveStatId(modifier),
+        dataOrigin: getDataOrigin(modifier),
+        restriction: getRestriction(modifier),
+        uniqueKey: (_a = getId(modifier)) !== null && _a !== void 0 ? _a : HelperUtils.generateGuid(),
+        amount: getValueTotal(modifier),
+    };
+}
+/**
+ *
+ * @param modifier
+ */
+export function deriveRollType(modifier) {
+    const subType = getSubType(modifier);
+    if (subType === null) {
+        return DiceAdjustmentRollTypeEnum.NONE;
+    }
+    switch (subType) {
+        case ModifierSubTypeEnum.SAVING_THROWS:
+            return DiceAdjustmentRollTypeEnum.SAVE;
+        case ModifierSubTypeEnum.DEATH_SAVING_THROWS:
+            return DiceAdjustmentRollTypeEnum.DEATH_SAVE;
+        case ModifierSubTypeEnum.ABILITY_CHECKS:
+            return DiceAdjustmentRollTypeEnum.ABILITY_CHECK;
+        default:
+        //not implemented
+    }
+    if (STAT_SAVING_THROW_LIST.includes(subType)) {
+        return DiceAdjustmentRollTypeEnum.STAT_SAVE;
+    }
+    else if (STAT_ABILITY_CHECK_LIST.includes(subType)) {
+        return DiceAdjustmentRollTypeEnum.ABILITY_CHECK;
+    }
+    return DiceAdjustmentRollTypeEnum.NONE;
+}
+/**
+ *
+ * @param modifier
+ */
+export function deriveStatId(modifier) {
+    let statId = null;
+    switch (getSubType(modifier)) {
+        case ModifierSubTypeEnum.STRENGTH_SAVING_THROWS:
+            statId = AbilityStatEnum.STRENGTH;
+            break;
+        case ModifierSubTypeEnum.DEXTERITY_SAVING_THROWS:
+            statId = AbilityStatEnum.DEXTERITY;
+            break;
+        case ModifierSubTypeEnum.CONSTITUTION_SAVING_THROWS:
+            statId = AbilityStatEnum.CONSTITUTION;
+            break;
+        case ModifierSubTypeEnum.INTELLIGENCE_SAVING_THROWS:
+            statId = AbilityStatEnum.INTELLIGENCE;
+            break;
+        case ModifierSubTypeEnum.WISDOM_SAVING_THROWS:
+            statId = AbilityStatEnum.WISDOM;
+            break;
+        case ModifierSubTypeEnum.CHARISMA_SAVING_THROWS:
+            statId = AbilityStatEnum.CHARISMA;
+            break;
+        default:
+        // not implemented
+    }
+    return statId;
+}
+/**
+ *
+ * @param modifier
+ */
+export function deriveSavingThrowModifierAbilityName(modifier) {
+    let abilityName = '';
+    switch (getSubType(modifier)) {
+        case ModifierSubTypeEnum.STRENGTH_SAVING_THROWS:
+            abilityName = 'STR';
+            break;
+        case ModifierSubTypeEnum.DEXTERITY_SAVING_THROWS:
+            abilityName = 'DEX';
+            break;
+        case ModifierSubTypeEnum.CONSTITUTION_SAVING_THROWS:
+            abilityName = 'CON';
+            break;
+        case ModifierSubTypeEnum.INTELLIGENCE_SAVING_THROWS:
+            abilityName = 'INT';
+            break;
+        case ModifierSubTypeEnum.WISDOM_SAVING_THROWS:
+            abilityName = 'WIS';
+            break;
+        case ModifierSubTypeEnum.CHARISMA_SAVING_THROWS:
+            abilityName = 'CHA';
+            break;
+        default:
+        // not implemented
+    }
+    return abilityName;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Modifier/generators.js b/ddb_main/packages/rules-engine/es/engine/Modifier/generators.js
new file mode 100644
index 0000000..f9f4cf6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Modifier/generators.js
@@ -0,0 +1,259 @@
+import { groupBy, orderBy, uniqBy } from 'lodash';
+import { AbilityDerivers } from '../Ability';
+import * as CampaignAccessors from '../Campaign/accessors';
+import { AbilityStatEnum } from '../Core';
+import { DataOriginGenerators } from '../DataOrigin';
+import { HelperUtils } from '../Helper';
+import { ItemValidators } from '../Item';
+import { RuleDataAccessors } from '../RuleData';
+import { getComponentId, getComponentTypeId, getId, getRestriction, getSubType } from './accessors';
+import { ModifierSubTypeEnum } from './constants';
+import { deriveValue } from './derivers';
+import { hack__updateDisadvantageModifiers } from './hacks';
+import { isExpertiseModifier, isImmunityModifier, isKenseiWeaponModifier, isLanguageModifier, isProficiencyModifier, isResistanceModifier, isValidAdvantageSaveModifier, isValidBonusSaveModifier, isValidBonusStatScoreModifier, isValidDisadvantageSaveModifier, isVulnerabilityModifier, } from './validators';
+/**
+ *
+ * @param modifier
+ */
+export function generateDataOriginKey(modifier) {
+    return DataOriginGenerators.generateDataOriginKey(getComponentId(modifier), getComponentTypeId(modifier));
+}
+/**
+ *
+ * @param modifiers
+ */
+export function generateModifierComponentLookup(modifiers) {
+    return groupBy(modifiers, (modifier) => generateDataOriginKey(modifier));
+}
+/**
+ *
+ * @param modifiers
+ * @param partyInfo
+ */
+export function generateItemModifierLookup(modifiers, partyInfo) {
+    const partyItemModifiers = partyInfo ? CampaignAccessors.getItemModifiers(partyInfo) : [];
+    return generateModifierComponentLookup(uniqBy([...partyItemModifiers, ...modifiers], (modifier) => getId(modifier)));
+}
+/**
+ *
+ * @param proficiencyBonus
+ * @param attunedItems
+ */
+export function generateModifierDataPreAbilities(proficiencyBonus, attunedItems) {
+    return {
+        abilityLookup: null,
+        proficiencyBonus,
+        attunedItemCount: attunedItems.length,
+    };
+}
+/**
+ *
+ * @param abilityLookup
+ * @param modifierDataPreAbilities
+ * @param attunedItems
+ */
+export function generateModifierData(abilityLookup, modifierDataPreAbilities, attunedItems) {
+    return Object.assign(Object.assign({}, modifierDataPreAbilities), { abilityLookup, attunedItemCount: attunedItems.length });
+}
+/**
+ *
+ * @param abilityLookup
+ */
+export function generateDexModifier(abilityLookup) {
+    return AbilityDerivers.deriveStatModifier(AbilityStatEnum.DEXTERITY, abilityLookup);
+}
+/**
+ *
+ * @param abilityLookup
+ */
+export function generateConModifier(abilityLookup) {
+    return AbilityDerivers.deriveStatModifier(AbilityStatEnum.CONSTITUTION, abilityLookup);
+}
+/**
+ *
+ * @param abilityLookup
+ */
+export function generateStrScore(abilityLookup) {
+    return AbilityDerivers.deriveStatScore(AbilityStatEnum.STRENGTH, abilityLookup);
+}
+/**
+ *
+ * @param modifiers
+ */
+export function generateUniqueProficiencyModifiers(modifiers) {
+    return uniqBy(modifiers, (modifier) => getSubType(modifier));
+}
+/**
+ *
+ * @param modifiers
+ * @param modifierData
+ * @param ruleData
+ */
+export function generateBonusSavingThrowModifiers(modifiers, modifierData, ruleData) {
+    let saveModifiers = modifiers.filter((modifier) => isValidBonusSaveModifier(modifier));
+    RuleDataAccessors.getStats(ruleData).forEach((statData) => {
+        saveModifiers = [
+            ...saveModifiers,
+            ...modifiers.filter((modifier) => isValidBonusSaveModifier(modifier, statData.id)),
+        ];
+    });
+    const orderedSaveModifiers = orderBy(uniqBy(saveModifiers, 'id'), [(modifier) => getSubType(modifier) === ModifierSubTypeEnum.SAVING_THROWS, 'friendlySubtypeName'], ['desc']);
+    return orderedSaveModifiers.map((saveModifier) => {
+        const valueTotal = deriveValue(saveModifier, modifierData, 1);
+        return Object.assign(Object.assign({}, saveModifier), { valueTotal });
+    });
+}
+/**
+ *
+ * @param modifiers
+ * @param ruleData
+ */
+export function generateAdvantageSavingThrowModifiers(modifiers, ruleData) {
+    let saveModifiers = modifiers.filter((modifier) => isValidAdvantageSaveModifier(modifier));
+    RuleDataAccessors.getStats(ruleData).forEach((statData) => {
+        saveModifiers = [
+            ...saveModifiers,
+            ...modifiers.filter((modifier) => isValidAdvantageSaveModifier(modifier, statData.id)),
+        ];
+    });
+    return uniqBy(saveModifiers, 'id');
+}
+/**
+ *
+ * @param modifiers
+ * @param equippedItems
+ * @param ruleData
+ */
+export function generateDisadvantageSavingThrowModifiers(modifiers, equippedItems, ruleData) {
+    let saveModifiers = modifiers.filter(isValidDisadvantageSaveModifier);
+    RuleDataAccessors.getStats(ruleData).forEach((statData) => {
+        saveModifiers = [
+            ...saveModifiers,
+            ...modifiers.filter((modifier) => isValidDisadvantageSaveModifier(modifier, statData.id)),
+        ];
+    });
+    saveModifiers = hack__updateDisadvantageModifiers(saveModifiers, equippedItems.filter(ItemValidators.isNonProficientEquippedArmorItem));
+    return uniqBy(saveModifiers, 'id');
+}
+/**
+ *
+ * @param modifiers
+ * @param abilityId
+ */
+export function generateBonusStatScoreModifiers(modifiers, abilityId) {
+    return modifiers.filter((modifier) => isValidBonusStatScoreModifier(modifier, abilityId));
+}
+/**
+ *
+ * @param modifiers
+ */
+export function generateProficiencyModifiers(modifiers) {
+    return modifiers.filter(isProficiencyModifier);
+}
+/**
+ *
+ * @param modifiers
+ */
+export function generateExpertiseModifiers(modifiers) {
+    return modifiers.filter(isExpertiseModifier);
+}
+/**
+ *
+ * @param modifiers
+ */
+export function generateLanguageModifiers(modifiers) {
+    return modifiers.filter(isLanguageModifier);
+}
+/**
+ *
+ * @param modifiers
+ */
+export function generateKenseiModifiers(modifiers) {
+    return modifiers.filter(isKenseiWeaponModifier);
+}
+/**
+ *
+ * @param modifiers
+ */
+export function generateResistanceModifiers(modifiers) {
+    return modifiers.filter(isResistanceModifier);
+}
+/**
+ *
+ * @param modifiers
+ */
+export function generateImmunityModifiers(modifiers) {
+    return modifiers.filter(isImmunityModifier);
+}
+/**
+ *
+ * @param modifiers
+ */
+export function generateVulnerabilityModifiers(modifiers) {
+    return modifiers.filter(isVulnerabilityModifier);
+}
+/**
+ *
+ * @param modifiers
+ */
+export function generateRestrictedBonusSavingThrowModifiers(modifiers) {
+    return modifiers.filter(getRestriction);
+}
+/**
+ *
+ * @param id
+ * @param entityTypeId
+ * @param modifierLookup
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ * @param extraModifiers
+ */
+export function generateModifiers(id, entityTypeId, modifierLookup, dataOriginType, primary, parent = null, extraModifiers = []) {
+    const modifierContractFallback = [];
+    const sourceModifierContracts = HelperUtils.lookupDataOrFallback(modifierLookup, DataOriginGenerators.generateDataOriginKey(id, entityTypeId), modifierContractFallback);
+    const modifierContracts = [...extraModifiers, ...sourceModifierContracts];
+    let modifiers = [];
+    if (modifierContracts.length > 0) {
+        modifiers = modifierContracts.map((modifier) => generateModifier(modifier, dataOriginType, primary, parent));
+    }
+    return modifiers;
+}
+/**
+ *
+ * @param modifierContract
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ */
+export function generateModifier(modifierContract, dataOriginType, primary, parent = null) {
+    return Object.assign(Object.assign({}, modifierContract), { dataOrigin: DataOriginGenerators.generateDataOrigin(dataOriginType, primary, parent) });
+}
+/**
+ *
+ * @param equipmentModifiers
+ * @param featModifiers
+ * @param backgroundModifiers
+ */
+export function generateMiscModifiers(equipmentModifiers, featModifiers, backgroundModifiers) {
+    return [...equipmentModifiers, ...featModifiers, ...backgroundModifiers];
+}
+/**
+ *
+ * @param raceModifiers
+ * @param classModifiers
+ * @param featModifiers
+ * @param backgroundModifiers
+ * @param equipmentModifiers
+ * @param conditionModifiers
+ */
+export function generateValidGlobalModifiers(raceModifiers, classModifiers, featModifiers, backgroundModifiers, equipmentModifiers, conditionModifiers) {
+    return [
+        ...raceModifiers,
+        ...classModifiers,
+        ...featModifiers,
+        ...backgroundModifiers,
+        ...equipmentModifiers,
+        ...conditionModifiers,
+    ];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Modifier/hacks.js b/ddb_main/packages/rules-engine/es/engine/Modifier/hacks.js
new file mode 100644
index 0000000..03120aa
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Modifier/hacks.js
@@ -0,0 +1,30 @@
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { getSubType, getType } from './accessors';
+import { ModifierSubTypeEnum, ModifierTypeEnum } from './constants';
+import { generateModifier } from './generators';
+import { simulateModifierContract } from './simulators';
+// TODO remove for "Integrated Protection" hack fix
+export function hack__isProficiencyLightArmor(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.PROFICIENCY && getSubType(modifier) === ModifierSubTypeEnum.LIGHT_ARMOR);
+}
+export function hack__updateDisadvantageModifiers(disadvantageSaveModifiers, nonProficientArmorItems) {
+    nonProficientArmorItems.forEach((item) => {
+        disadvantageSaveModifiers.push(generateModifier(simulateModifierContract({
+            id: 'SIMULATED_DISADV_STR_SAVES_ARMOR_PROF',
+            friendlyTypeName: 'Disadvantage',
+            friendlySubtypeName: 'Strength Saving Throws',
+            type: ModifierTypeEnum.DISADVANTAGE,
+            subType: ModifierSubTypeEnum.STRENGTH_SAVING_THROWS,
+            restriction: 'when not proficient with armor worn',
+        }), DataOriginTypeEnum.ITEM, item));
+        disadvantageSaveModifiers.push(generateModifier(simulateModifierContract({
+            id: 'SIMULATED_DISADV_DEX_SAVES_ARMOR_PROF',
+            friendlyTypeName: 'Disadvantage',
+            friendlySubtypeName: 'Dexterity Saving Throws',
+            type: ModifierTypeEnum.DISADVANTAGE,
+            subType: ModifierSubTypeEnum.DEXTERITY_SAVING_THROWS,
+            restriction: 'when not proficient with armor worn',
+        }), DataOriginTypeEnum.ITEM, item));
+    });
+    return disadvantageSaveModifiers;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Modifier/index.js b/ddb_main/packages/rules-engine/es/engine/Modifier/index.js
new file mode 100644
index 0000000..e0cecfb
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Modifier/index.js
@@ -0,0 +1,13 @@
+import * as ModifierAccessors from './accessors';
+import * as ModifierConstants from './constants';
+import * as ModifierDerivers from './derivers';
+import * as ModifierGenerators from './generators';
+import * as ModifierHacks from './hacks';
+import * as ModifierSimulators from './simulators';
+import * as ModifierTypings from './typings';
+import * as ModifierUtils from './utils';
+import * as ModifierValidators from './validators';
+export * from './constants';
+export * from './typings';
+export { ModifierAccessors, ModifierDerivers, ModifierGenerators, ModifierHacks, ModifierSimulators, ModifierUtils, ModifierValidators, };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, ModifierAccessors), ModifierConstants), ModifierDerivers), ModifierGenerators), ModifierHacks), ModifierSimulators), ModifierTypings), ModifierUtils), ModifierValidators);
diff --git a/ddb_main/packages/rules-engine/es/engine/Modifier/simulators.js b/ddb_main/packages/rules-engine/es/engine/Modifier/simulators.js
new file mode 100644
index 0000000..085b411
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Modifier/simulators.js
@@ -0,0 +1,7 @@
+/**
+ *
+ * @param modifierDefinitionProps
+ */
+export function simulateModifierContract(modifierDefinitionProps) {
+    return Object.assign({ availableToMulticlass: null, bonusTypes: null, componentId: -1, componentTypeId: -1, dice: null, duration: null, entityId: null, entityTypeId: null, fixedValue: null, friendlySubtypeName: null, friendlyTypeName: null, id: null, isGranted: true, modifierSubTypeId: -1, modifierTypeId: -1, requiresAttunement: false, restriction: null, statId: null, subType: null, type: null, value: null }, modifierDefinitionProps);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Modifier/utils.js b/ddb_main/packages/rules-engine/es/engine/Modifier/utils.js
new file mode 100644
index 0000000..bf101ad
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Modifier/utils.js
@@ -0,0 +1,26 @@
+import { getBonusTypes } from './accessors';
+/**
+ *
+ * @param modifiers
+ * @param modifierBonusType
+ */
+export function countModifierBonusTypes(modifiers, modifierBonusType) {
+    let count = 0;
+    for (let i = 0; i < modifiers.length; i++) {
+        const modifier = modifiers[i];
+        const modifierBonusTypes = getBonusTypes(modifier);
+        if (modifierBonusTypes && modifierBonusTypes.includes(modifierBonusType)) {
+            count += 1;
+        }
+    }
+    return count;
+}
+/**
+ *
+ * @param modifiers
+ * @param filter
+ * @param filterArgs
+ */
+export function filterModifiers(modifiers, filter, filterArgs = []) {
+    return modifiers.filter((modifier) => filter(modifier, ...filterArgs));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Modifier/validators.js b/ddb_main/packages/rules-engine/es/engine/Modifier/validators.js
new file mode 100644
index 0000000..ec91b73
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Modifier/validators.js
@@ -0,0 +1,1492 @@
+import { ActionAccessors, AttackSubtypeEnum } from '../Action';
+import { ClassAccessors } from '../Class';
+import { AbilityStatEnum, AttackTypeRangeEnum, SpeedMovementKeyEnum } from '../Core';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { FeatUtils } from '../Feat';
+import { FormatUtils } from '../Format';
+import { ItemAccessors, ItemUtils, WeaponPropertyEnum } from '../Item';
+import { SpellAccessors, SpellGroupEnum } from '../Spell';
+import { getDataOrigin, getDataOriginType, getEntityId, getEntityTypeId, getStatId, getSubType, getType, isAvailableToMulticlass, requiresAttunement, } from './accessors';
+import { ALL_ARMOR_LIST, DAMAGE_ADJUSTMENT_LIST, HEAVY_ARMOR_LIST, LIGHT_ARMOR_LIST, MAGIC_ITEM_ATTACK_WITH_STAT_LIST, MEDIUM_ARMOR_LIST, ModifierSubTypeEnum, ModifierTypeEnum, PROPERTY_LIST, SHIELDS_LIST, SIZE_LIST, STAT_ABILITY_SCORE_LIST, } from './constants';
+/**
+ *
+ * @param modifier
+ */
+export function isLanguageModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.LANGUAGE;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isDamageModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.DAMAGE;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSetExtraAttacksModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.SET && getSubType(modifier) === ModifierSubTypeEnum.EXTRA_ATTACKS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSetAcMaxDexModifierModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.SET && getSubType(modifier) === ModifierSubTypeEnum.AC_MAX_DEX_MODIFIER);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSetAcMaxDexArmoredModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.SET &&
+        getSubType(modifier) === ModifierSubTypeEnum.AC_MAX_DEX_ARMORED_MODIFIER);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSetAcMaxDexUnarmoredModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.SET &&
+        getSubType(modifier) === ModifierSubTypeEnum.AC_MAX_DEX_UNARMORED_MODIFIER);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusInitiativeModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return getSubType(modifier) === ModifierSubTypeEnum.INITIATIVE;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isAdvantageInitiativeModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.ADVANTAGE) {
+        return false;
+    }
+    return getSubType(modifier) === ModifierSubTypeEnum.INITIATIVE;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSetArmoredArmorClassModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.SET) {
+        return false;
+    }
+    return getSubType(modifier) === ModifierSubTypeEnum.ARMORED_ARMOR_CLASS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusArmoredArmorClassModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return getSubType(modifier) === ModifierSubTypeEnum.ARMORED_ARMOR_CLASS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSetUnarmoredArmorClassModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.SET) {
+        return false;
+    }
+    return getSubType(modifier) === ModifierSubTypeEnum.UNARMORED_ARMOR_CLASS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusUnarmoredArmorClassModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return getSubType(modifier) === ModifierSubTypeEnum.UNARMORED_ARMOR_CLASS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isIgnoreUnarmoredDexAcBonusModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.IGNORE) {
+        return false;
+    }
+    return getSubType(modifier) === ModifierSubTypeEnum.UNARMORED_DEX_AC_BONUS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSetMinimumBaseArmorModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.SET && getSubType(modifier) === ModifierSubTypeEnum.MINIMUM_BASE_ARMOR);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isHalfProficiencyInitiativeModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.HALF_PROFICIENCY) {
+        return false;
+    }
+    return getSubType(modifier) === ModifierSubTypeEnum.INITIATIVE;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isHalfProficiencyRoundUpInitiativeModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.HALF_PROFICIENCY_ROUND_UP) {
+        return false;
+    }
+    return getSubType(modifier) === ModifierSubTypeEnum.INITIATIVE;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusMagicModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === ModifierSubTypeEnum.MAGIC;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusArmorModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === ModifierSubTypeEnum.ARMOR_CLASS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isProficiencySelfModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.PROFICIENCY && getSubType(modifier) === ModifierSubTypeEnum.SELF;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isResistanceModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.RESISTANCE;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isImmunityModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.IMMUNITY;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isVulnerabilityModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.VULNERABILITY;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusProficiencyBonusModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === ModifierSubTypeEnum.PROFICIENCY_BONUS);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isWeaponAttackModifier(modifier) {
+    return getSubType(modifier) === ModifierSubTypeEnum.WEAPON_ATTACKS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isWeaponAdditionalDamageModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.DAMAGE) {
+        return false;
+    }
+    const subType = getSubType(modifier);
+    if (subType === null) {
+        return false;
+    }
+    return DAMAGE_ADJUSTMENT_LIST.includes(subType);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isReplaceDamageTypeModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.REPLACE_DAMAGE_TYPE) {
+        return false;
+    }
+    const subType = getSubType(modifier);
+    if (subType === null) {
+        return false;
+    }
+    return DAMAGE_ADJUSTMENT_LIST.includes(subType);
+}
+export function isReplaceWeaponAbilityModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.REPLACE_WEAPON_ABILITY) {
+        return false;
+    }
+    const subType = getSubType(modifier);
+    if (subType === null) {
+        return false;
+    }
+    return STAT_ABILITY_SCORE_LIST.includes(subType);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isWeaponPropertySubTypeModifier(modifier) {
+    const subType = getSubType(modifier);
+    if (subType === null) {
+        return false;
+    }
+    return PROPERTY_LIST.includes(subType);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isWeaponPropertyModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.WEAPON_PROPERTY) {
+        return false;
+    }
+    return isWeaponPropertySubTypeModifier(modifier);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isIgnoreWeaponPropertyModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.IGNORE_WEAPON_PROPERTY) {
+        return false;
+    }
+    return isWeaponPropertySubTypeModifier(modifier);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusSpellAttackRangeMultiplierModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.BONUS &&
+        getSubType(modifier) === ModifierSubTypeEnum.SPELL_ATTACK_RANGE_MULTIPLIER);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isEldritchBlastBonusDamageModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.ELDRITCH_BLAST &&
+        getSubType(modifier) === ModifierSubTypeEnum.BONUS_DAMAGE);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isEldritchBlastBonusRangeModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.ELDRITCH_BLAST &&
+        getSubType(modifier) === ModifierSubTypeEnum.BONUS_RANGE);
+}
+export function isEnablePactWeaponModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.ENABLE_FEATURE &&
+        getSubType(modifier) === ModifierSubTypeEnum.ENABLE_PACT_WEAPON);
+}
+export function isEnableHexWeaponModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.ENABLE_FEATURE &&
+        getSubType(modifier) === ModifierSubTypeEnum.ENABLE_HEX_WEAPON);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isArmorModifier(modifier) {
+    const subType = getSubType(modifier);
+    if (subType === null) {
+        return false;
+    }
+    return ALL_ARMOR_LIST.includes(subType);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSpellAttackModifier(modifier) {
+    return getSubType(modifier) === ModifierSubTypeEnum.SPELL_ATTACKS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSetUnarmedDamageDieModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.SET && getSubType(modifier) === ModifierSubTypeEnum.UNARMED_DAMAGE_DIE);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isProficiencyModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.PROFICIENCY;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isExpertiseModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.EXPERTISE;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusUnarmoredMovementModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === ModifierSubTypeEnum.UNARMORED_MOVEMENT);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusHitPointsPerLevelModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return getSubType(modifier) === ModifierSubTypeEnum.HIT_POINTS_PER_LEVEL;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusHitPointsModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === ModifierSubTypeEnum.HIT_POINTS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSpellDamageModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.DAMAGE;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSpellHealingHitPointsModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === ModifierSubTypeEnum.HIT_POINTS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSpellHealingTempHitPointsModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.BONUS &&
+        getSubType(modifier) === ModifierSubTypeEnum.TEMPORARY_HIT_POINTS);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isIgnoreOffhandModifierRestrictionsModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.IGNORE &&
+        getSubType(modifier) === ModifierSubTypeEnum.OFFHAND_MODIFIER_RESTRICTIONS);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isIgnoreOffhandLightRestrictionsModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.IGNORE &&
+        getSubType(modifier) === ModifierSubTypeEnum.OFFHAND_LIGHT_RESTRICTIONS);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusDualWieldAcModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.BONUS &&
+        getSubType(modifier) === ModifierSubTypeEnum.DUAL_WIELD_ARMOR_CLASS);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isCarringCapacityMultiplierModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.CARRYING_CAPACITY &&
+        getSubType(modifier) === ModifierSubTypeEnum.MULTIPLIER);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isCarryingCapacitySizeModifier(modifier) {
+    const subType = getSubType(modifier);
+    if (subType === null) {
+        return false;
+    }
+    return getType(modifier) === ModifierTypeEnum.CARRYING_CAPACITY && SIZE_LIST.includes(subType);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSizeModifier(modifier) {
+    const subType = getSubType(modifier);
+    if (subType === null) {
+        return false;
+    }
+    return getType(modifier) === ModifierTypeEnum.SIZE && SIZE_LIST.includes(subType);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusPassivePerceptionModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === ModifierSubTypeEnum.PASSIVE_PERCEPTION);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusPassiveInvestigationModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.BONUS &&
+        getSubType(modifier) === ModifierSubTypeEnum.PASSIVE_INVESTIGATION);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusPassiveInsightModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === ModifierSubTypeEnum.PASSIVE_INSIGHT;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusMeleeReachModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === ModifierSubTypeEnum.MELEE_REACH;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isKenseiWeaponModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.KENSEI) {
+        return false;
+    }
+    return true;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isMonkWeaponModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.MONK_WEAPON) {
+        return false;
+    }
+    return true;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isProtectionModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.PROTECTION;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isProtectionZeroHpModifier(modifier) {
+    return isProtectionModifier(modifier) && getSubType(modifier) === ModifierSubTypeEnum.ZERO_HP;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isStealthDisadvantageRemoveModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.STEALTH_DISADVANTAGE &&
+        getSubType(modifier) === ModifierSubTypeEnum.REMOVE);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSetDeathModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.SET && getSubType(modifier) === ModifierSubTypeEnum.DEATH;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSpeedReductionRemoveModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.SPEED_REDUCTION && getSubType(modifier) === ModifierSubTypeEnum.REMOVE);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isIgnoreUnarmoredWhileArmoredModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.IGNORE) {
+        return false;
+    }
+    return getSubType(modifier) === ModifierSubTypeEnum.UNARMORED_WHILE_ARMORED;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isArmorBranchingModifier(modifier) {
+    return (isSetMinimumBaseArmorModifier(modifier) ||
+        isSetUnarmoredArmorClassModifier(modifier) ||
+        isIgnoreUnarmoredDexAcBonusModifier(modifier) ||
+        isIgnoreUnarmoredWhileArmoredModifier(modifier));
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusShieldAcOnDexSavesModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.BONUS &&
+        getSubType(modifier) === ModifierSubTypeEnum.SHIELD_AC_ON_DEX_SAVES);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isSetAttunementSlotsModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.SET && getSubType(modifier) === ModifierSubTypeEnum.ATTUNEMENT_SLOTS;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isAdvantageDeathSavesModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.ADVANTAGE &&
+        getSubType(modifier) === ModifierSubTypeEnum.DEATH_SAVING_THROWS);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isDisadvantageDeathSavesModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.DISADVANTAGE &&
+        getSubType(modifier) === ModifierSubTypeEnum.DEATH_SAVING_THROWS);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isBonusMagicItemAttackWithStatModifier(modifier) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    const subType = getSubType(modifier);
+    if (subType === null) {
+        return false;
+    }
+    return MAGIC_ITEM_ATTACK_WITH_STAT_LIST.includes(subType);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isIgnoreHeavyArmorSpeedReductionModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.IGNORE &&
+        getSubType(modifier) === ModifierSubTypeEnum.HEAVY_ARMOR_SPEED_REDUCTION);
+}
+export function isStealthDisadvantageRemoveModifierForMediumArmor(modifier) {
+    const dataOrigin = getDataOrigin(modifier);
+    return (isStealthDisadvantageRemoveModifier(modifier) &&
+        getDataOriginType(modifier) === DataOriginTypeEnum.FEAT &&
+        FeatUtils.isMediumArmorMaster(dataOrigin.primary));
+}
+/**
+ * When a modifier is type bonus it might be associated with a spell group, eg SPELL_GROUP_HEALING for Disciple of Life
+ * @param modifier
+ * @param spellGroupId
+ */
+export function isValidBonusSpellGroupModifier(modifier, spellGroupId) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return isValidSpellGroupModifier(modifier, spellGroupId);
+}
+/**
+ * Check to see if a modifer has a valid spellGroupId
+ * @param modifier
+ * @param spellGroupId
+ */
+export function isValidSpellGroupModifier(modifier, spellGroupId) {
+    switch (spellGroupId) {
+        case SpellGroupEnum.HEALING:
+            return getSubType(modifier) === ModifierSubTypeEnum.SPELL_GROUP_HEALING;
+        default:
+            return false;
+    }
+}
+/**
+ *
+ * @param modifier
+ * @param senseKey
+ */
+export function isValidSenseModifier(modifier, senseKey) {
+    return getType(modifier) === ModifierTypeEnum.SENSE && getSubType(modifier) === senseKey;
+}
+/**
+ *
+ * @param modifier
+ * @param senseKey
+ */
+export function isValidSetBaseSenseModifier(modifier, senseKey) {
+    return getType(modifier) === ModifierTypeEnum.SET_BASE && getSubType(modifier) === senseKey;
+}
+/**
+ *
+ * @param modifier
+ * @param senseKey
+ */
+export function isValidSetSenseModifier(modifier, senseKey) {
+    return getType(modifier) === ModifierTypeEnum.SET && getSubType(modifier) === senseKey;
+}
+/**
+ *
+ * @param modifier
+ * @param senseKey
+ */
+export function isValidBonusSenseModifier(modifier, senseKey) {
+    return getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === senseKey;
+}
+/**
+ *
+ * @param modifier
+ */
+export function isValidBonusChooseAbilityScoreModifier(modifier) {
+    return (getType(modifier) === ModifierTypeEnum.BONUS &&
+        getSubType(modifier) === ModifierSubTypeEnum.CHOOSE_AN_ABILITY_SCORE);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidStatScoreModifier(modifier, abilityId) {
+    switch (abilityId) {
+        case AbilityStatEnum.STRENGTH:
+            return getSubType(modifier) === ModifierSubTypeEnum.STRENGTH_SCORE;
+        case AbilityStatEnum.CHARISMA:
+            return getSubType(modifier) === ModifierSubTypeEnum.CHARISMA_SCORE;
+        case AbilityStatEnum.INTELLIGENCE:
+            return getSubType(modifier) === ModifierSubTypeEnum.INTELLIGENCE_SCORE;
+        case AbilityStatEnum.CONSTITUTION:
+            return getSubType(modifier) === ModifierSubTypeEnum.CONSTITUTION_SCORE;
+        case AbilityStatEnum.DEXTERITY:
+            return getSubType(modifier) === ModifierSubTypeEnum.DEXTERITY_SCORE;
+        case AbilityStatEnum.WISDOM:
+            return getSubType(modifier) === ModifierSubTypeEnum.WISDOM_SCORE;
+        default:
+            return false;
+    }
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidBonusStatScoreModifier(modifier, abilityId) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return isValidStatScoreModifier(modifier, abilityId);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidStackingBonusStatScoreModifier(modifier, abilityId) {
+    if (getType(modifier) !== ModifierTypeEnum.STACKING_BONUS) {
+        return false;
+    }
+    return isValidStatScoreModifier(modifier, abilityId);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidSetStatScoreModifier(modifier, abilityId) {
+    if (getType(modifier) !== ModifierTypeEnum.SET) {
+        return false;
+    }
+    return isValidStatScoreModifier(modifier, abilityId);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidStatMaxModifier(modifier, abilityId) {
+    if (getSubType(modifier) !== ModifierSubTypeEnum.ABILITY_SCORE_MAXIMUM) {
+        return false;
+    }
+    const statId = getStatId(modifier);
+    if (!statId) {
+        return false;
+    }
+    return statId === abilityId;
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidBonusStatMaxModifier(modifier, abilityId) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return isValidStatMaxModifier(modifier, abilityId);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidSaveModifier(modifier, abilityId = null) {
+    if (getSubType(modifier) === ModifierSubTypeEnum.SAVING_THROWS) {
+        return true;
+    }
+    switch (abilityId) {
+        case AbilityStatEnum.STRENGTH:
+            return getSubType(modifier) === ModifierSubTypeEnum.STRENGTH_SAVING_THROWS;
+        case AbilityStatEnum.CHARISMA:
+            return getSubType(modifier) === ModifierSubTypeEnum.CHARISMA_SAVING_THROWS;
+        case AbilityStatEnum.INTELLIGENCE:
+            return getSubType(modifier) === ModifierSubTypeEnum.INTELLIGENCE_SAVING_THROWS;
+        case AbilityStatEnum.CONSTITUTION:
+            return getSubType(modifier) === ModifierSubTypeEnum.CONSTITUTION_SAVING_THROWS;
+        case AbilityStatEnum.DEXTERITY:
+            return getSubType(modifier) === ModifierSubTypeEnum.DEXTERITY_SAVING_THROWS;
+        case AbilityStatEnum.WISDOM:
+            return getSubType(modifier) === ModifierSubTypeEnum.WISDOM_SAVING_THROWS;
+        default:
+            return false;
+    }
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidBonusSaveModifier(modifier, abilityId = null) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return isValidSaveModifier(modifier, abilityId);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidAdvantageSaveModifier(modifier, abilityId = null) {
+    if (getType(modifier) !== ModifierTypeEnum.ADVANTAGE) {
+        return false;
+    }
+    return isValidSaveModifier(modifier, abilityId);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidDisadvantageSaveModifier(modifier, abilityId = null) {
+    if (getType(modifier) !== ModifierTypeEnum.DISADVANTAGE) {
+        return false;
+    }
+    return isValidSaveModifier(modifier, abilityId);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidProficiencySaveModifier(modifier, abilityId = null) {
+    if (getType(modifier) !== ModifierTypeEnum.PROFICIENCY) {
+        return false;
+    }
+    return isValidSaveModifier(modifier, abilityId);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidSetSaveModifier(modifier, abilityId = null) {
+    if (getType(modifier) !== ModifierTypeEnum.SET) {
+        return false;
+    }
+    return isValidSaveModifier(modifier, abilityId);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidStatAttackModifier(modifier, abilityId) {
+    switch (abilityId) {
+        case AbilityStatEnum.STRENGTH:
+            return getSubType(modifier) === ModifierSubTypeEnum.STRENGTH_ATTACKS;
+        case AbilityStatEnum.DEXTERITY:
+            return getSubType(modifier) === ModifierSubTypeEnum.DEXTERITY_ATTACKS;
+    }
+    return false;
+}
+/**
+ *
+ * @param modifier
+ * @param armor
+ */
+export function isValidArmorTypeModifier(modifier, armor) {
+    const armorTypeSlug = FormatUtils.cobaltSlugify(ItemAccessors.getBaseArmorName(armor));
+    if (getSubType(modifier) === ModifierSubTypeEnum.LIGHT_ARMOR) {
+        return LIGHT_ARMOR_LIST.indexOf(armorTypeSlug) > -1;
+    }
+    else if (getSubType(modifier) === ModifierSubTypeEnum.MEDIUM_ARMOR) {
+        return MEDIUM_ARMOR_LIST.indexOf(armorTypeSlug) > -1;
+    }
+    else if (getSubType(modifier) === ModifierSubTypeEnum.HEAVY_ARMOR) {
+        return HEAVY_ARMOR_LIST.indexOf(armorTypeSlug) > -1;
+    }
+    else if (getSubType(modifier) === ModifierSubTypeEnum.SHIELDS) {
+        return SHIELDS_LIST.indexOf(armorTypeSlug) > -1;
+    }
+    else if (isArmorModifier(modifier)) {
+        return getSubType(modifier) === armorTypeSlug;
+    }
+    return false;
+}
+/**
+ *
+ * @param modifier
+ * @param category
+ */
+export function isValidProficiencyWeaponCategoryModifier(modifier, category) {
+    if (getType(modifier) !== ModifierTypeEnum.PROFICIENCY) {
+        return false;
+    }
+    return isValidWeaponCategoryModifierEntity(modifier, category);
+}
+/**
+ *
+ * @param modifier
+ * @param category
+ */
+export function isValidWeaponCategoryModifierEntity(modifier, category) {
+    if (!category) {
+        return false;
+    }
+    return category.entityTypeId === getEntityTypeId(modifier) && category.id === getEntityId(modifier);
+}
+/**
+ *
+ * @param modifier
+ * @param weapon
+ */
+export function isValidWeaponModifier(modifier, weapon) {
+    if (isValidWeaponCategoryModifierEntity(modifier, ItemAccessors.getCategoryInfo(weapon))) {
+        return true;
+    }
+    if (isValidWeaponSubTypeModifier(modifier, weapon)) {
+        return true;
+    }
+    return false;
+}
+/**
+ *
+ * @param modifier
+ * @param weapon
+ */
+export function isValidWeaponSubTypeModifier(modifier, weapon) {
+    return (ItemAccessors.getBaseItemId(weapon) === getEntityId(modifier) &&
+        ItemAccessors.getBaseTypeId(weapon) === getEntityTypeId(modifier));
+}
+/**
+ *
+ * @param modifier
+ * @param attackTypeRange
+ */
+export function isValidWeaponRangeTypeModifier(modifier, attackTypeRange) {
+    switch (attackTypeRange) {
+        case AttackTypeRangeEnum.MELEE:
+            switch (getSubType(modifier)) {
+                case ModifierSubTypeEnum.MELEE_ATTACKS:
+                case ModifierSubTypeEnum.MELEE_WEAPON_ATTACKS:
+                    return true;
+            }
+            break;
+        case AttackTypeRangeEnum.RANGED:
+            switch (getSubType(modifier)) {
+                case ModifierSubTypeEnum.RANGED_ATTACKS:
+                case ModifierSubTypeEnum.RANGED_WEAPON_ATTACKS:
+                    return true;
+            }
+            break;
+    }
+    return false;
+}
+/**
+ *
+ * @param modifier
+ * @param action
+ */
+export function isValidActionWeaponModifier(modifier, action) {
+    const attackRangeType = ActionAccessors.getAttackRangeId(action);
+    const attackSubtype = ActionAccessors.getAttackSubtypeId(action);
+    if (isWeaponAttackModifier(modifier)) {
+        return true;
+    }
+    if (isValidWeaponRangeTypeModifier(modifier, attackRangeType)) {
+        return true;
+    }
+    if (attackSubtype === AttackSubtypeEnum.NATURAL) {
+        if (getSubType(modifier) === ModifierSubTypeEnum.NATURAL_ATTACKS) {
+            return true;
+        }
+        if (attackRangeType === AttackTypeRangeEnum.MELEE &&
+            getSubType(modifier) === ModifierSubTypeEnum.MELEE_NATURAL_ATTACKS) {
+            return true;
+        }
+        if (attackRangeType === AttackTypeRangeEnum.RANGED &&
+            getSubType(modifier) === ModifierSubTypeEnum.RANGED_NATURAL_ATTACKS) {
+            return true;
+        }
+    }
+    if (attackSubtype === AttackSubtypeEnum.UNARMED) {
+        switch (getSubType(modifier)) {
+            case ModifierSubTypeEnum.UNARMED_ATTACKS:
+            case ModifierSubTypeEnum.NATURAL_ATTACKS:
+                return true;
+        }
+        if (attackRangeType === AttackTypeRangeEnum.MELEE &&
+            (getSubType(modifier) === ModifierSubTypeEnum.MELEE_UNARMED_ATTACKS ||
+                getSubType(modifier) === ModifierSubTypeEnum.MELEE_NATURAL_ATTACKS)) {
+            return true;
+        }
+        if (attackRangeType === AttackTypeRangeEnum.RANGED &&
+            (getSubType(modifier) === ModifierSubTypeEnum.RANGED_UNARMED_ATTACKS ||
+                getSubType(modifier) === ModifierSubTypeEnum.RANGED_NATURAL_ATTACKS)) {
+            return true;
+        }
+    }
+    return false;
+}
+/**
+ *
+ * @param modifier
+ * @param weapon
+ * @param ruleData
+ * @param isVersatileCheck
+ */
+export function isValidItemWeaponModifier(modifier, weapon, ruleData, isVersatileCheck = false) {
+    if (isWeaponAttackModifier(modifier)) {
+        return true;
+    }
+    if (isValidWeaponRangeTypeModifier(modifier, ItemAccessors.getAttackType(weapon))) {
+        return true;
+    }
+    switch (getSubType(modifier)) {
+        case ModifierSubTypeEnum.ONE_HANDED_WEAPON_ATTACKS:
+            return !ItemUtils.hasWeaponProperty(weapon, WeaponPropertyEnum.TWO_HANDED) && !isVersatileCheck;
+        case ModifierSubTypeEnum.TWO_HANDED_WEAPON_ATTACKS:
+            return ItemUtils.hasWeaponProperty(weapon, WeaponPropertyEnum.TWO_HANDED) || isVersatileCheck;
+        case ModifierSubTypeEnum.THROWN_WEAPON_ATTACKS:
+            return ItemUtils.hasWeaponProperty(weapon, WeaponPropertyEnum.THROWN) || isVersatileCheck;
+    }
+    switch (ItemAccessors.getAttackType(weapon)) {
+        case AttackTypeRangeEnum.MELEE:
+            switch (getSubType(modifier)) {
+                case ModifierSubTypeEnum.ONE_HANDED_MELEE_ATTACKS:
+                    return !ItemUtils.hasWeaponProperty(weapon, WeaponPropertyEnum.TWO_HANDED) && !isVersatileCheck;
+                case ModifierSubTypeEnum.TWO_HANDED_MELEE_ATTACKS:
+                    return ItemUtils.hasWeaponProperty(weapon, WeaponPropertyEnum.TWO_HANDED) || isVersatileCheck;
+                case ModifierSubTypeEnum.THROWN_MELEE_ATTACKS:
+                    return ItemUtils.hasWeaponProperty(weapon, WeaponPropertyEnum.THROWN) || isVersatileCheck;
+            }
+            break;
+        case AttackTypeRangeEnum.RANGED:
+            switch (getSubType(modifier)) {
+                case ModifierSubTypeEnum.ONE_HANDED_RANGED_ATTACKS:
+                    return !ItemUtils.hasWeaponProperty(weapon, WeaponPropertyEnum.TWO_HANDED) && !isVersatileCheck;
+                case ModifierSubTypeEnum.TWO_HANDED_RANGED_ATTACKS:
+                    return ItemUtils.hasWeaponProperty(weapon, WeaponPropertyEnum.TWO_HANDED) || isVersatileCheck;
+                case ModifierSubTypeEnum.THROWN_RANGED_ATTACKS:
+                    return ItemUtils.hasWeaponProperty(weapon, WeaponPropertyEnum.THROWN) || isVersatileCheck;
+            }
+            break;
+    }
+    return isValidWeaponModifier(modifier, weapon);
+}
+/**
+ *
+ * @param modifier
+ * @param weapon
+ */
+export function isValidWeaponProficiencyModifier(modifier, weapon) {
+    if (getType(modifier) !== ModifierTypeEnum.PROFICIENCY) {
+        return false;
+    }
+    return isValidWeaponModifier(modifier, weapon);
+}
+/**
+ *
+ * @param modifier
+ * @param armor
+ */
+export function isValidArmorProficiencyModifier(modifier, armor) {
+    if (getType(modifier) !== ModifierTypeEnum.PROFICIENCY) {
+        return false;
+    }
+    return isValidArmorTypeModifier(modifier, armor);
+}
+/**
+ *
+ * @param modifier
+ * @param weapon
+ * @param ruleData
+ * @param isVersatileCheck
+ */
+export function isValidWeaponDamageModifier(modifier, weapon, ruleData, isVersatileCheck = false) {
+    if (getType(modifier) !== ModifierTypeEnum.DAMAGE) {
+        return false;
+    }
+    return isValidItemWeaponModifier(modifier, weapon, ruleData, isVersatileCheck);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidDamageStatAttackModifier(modifier, abilityId) {
+    if (getType(modifier) !== ModifierTypeEnum.DAMAGE) {
+        return false;
+    }
+    return isValidStatAttackModifier(modifier, abilityId);
+}
+export function isBonusSpellSaveDc(modifier) {
+    return getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === ModifierSubTypeEnum.SPELL_SAVE_DC;
+}
+/**
+ *
+ * @param modifier
+ * @param baseClassSlug
+ */
+export function isValidBonusClassSpellSaveDcModifier(modifier, baseClassSlug) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    const classModifierString = `${baseClassSlug}-spell-save-dc`;
+    return classModifierString === getSubType(modifier);
+}
+export function isBonusCantripDamage(modifier) {
+    return getType(modifier) === ModifierTypeEnum.BONUS && getSubType(modifier) === ModifierSubTypeEnum.CANTRIP_DAMAGE;
+}
+/**
+ *
+ * @param modifier
+ * @param baseClassSlug
+ */
+export function isValidBonusClassCantripDamageModifier(modifier, baseClassSlug) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    const classModifierString = `${baseClassSlug}-cantrip-damage`;
+    return classModifierString === getSubType(modifier);
+}
+/**
+ *
+ * @param modifier
+ * @param attackTypeRange
+ */
+export function isValidSpellAttackRangeModifier(modifier, attackTypeRange) {
+    switch (attackTypeRange) {
+        case AttackTypeRangeEnum.MELEE:
+            switch (getSubType(modifier)) {
+                case ModifierSubTypeEnum.MELEE_ATTACKS:
+                case ModifierSubTypeEnum.MELEE_SPELL_ATTACKS:
+                    return true;
+            }
+            break;
+        case AttackTypeRangeEnum.RANGED:
+            switch (getSubType(modifier)) {
+                case ModifierSubTypeEnum.RANGED_ATTACKS:
+                case ModifierSubTypeEnum.RANGED_SPELL_ATTACKS:
+                    return true;
+            }
+            break;
+        default:
+        // not implemented
+    }
+    return false;
+}
+/**
+ *
+ * @param modifier
+ * @param spell
+ */
+export function isValidSpellAttackModifier(modifier, spell) {
+    if (isSpellAttackModifier(modifier)) {
+        return true;
+    }
+    if (spell && isValidSpellAttackRangeModifier(modifier, SpellAccessors.getAttackType(spell))) {
+        return true;
+    }
+    return false;
+}
+/**
+ *
+ * @param modifier
+ * @param spell
+ */
+export function isValidBonusSpellAttackModifier(modifier, spell) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return isValidSpellAttackModifier(modifier, spell);
+}
+/**
+ *
+ * @param modifier
+ * @param spell
+ */
+export function isValidDamageSpellAttackModifier(modifier, spell) {
+    if (getType(modifier) !== ModifierTypeEnum.DAMAGE) {
+        return false;
+    }
+    return isValidSpellAttackModifier(modifier, spell);
+}
+/**
+ *
+ * @param modifier
+ * @param baseClassSlug
+ */
+export function isValidBonusClassSpellAttackModifier(modifier, baseClassSlug) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    const classModifierString = `${baseClassSlug}-spell-attacks`;
+    return classModifierString === getSubType(modifier);
+}
+/**
+ *
+ * @param modifier
+ * @param baseClassSlug
+ */
+export function isValidDamageClassSpellAttackModifier(modifier, baseClassSlug) {
+    if (getType(modifier) !== ModifierTypeEnum.DAMAGE) {
+        return false;
+    }
+    const classModifierString = `${baseClassSlug}-spell-attacks`;
+    return classModifierString === getSubType(modifier);
+}
+/**
+ *
+ * @param modifier
+ * @param weapon
+ * @param ruleData
+ */
+export function isValidBonusWeaponToHitModifier(modifier, weapon, ruleData) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return isValidItemWeaponModifier(modifier, weapon, ruleData);
+}
+/**
+ *
+ * @param modifier
+ * @param abilityId
+ */
+export function isValidBonusStatAttackModifier(modifier, abilityId) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return isValidStatAttackModifier(modifier, abilityId);
+}
+/**
+ *
+ * @param modifier
+ * @param action
+ */
+export function isValidBonusActionWeaponToHitModifier(modifier, action) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return isValidActionWeaponModifier(modifier, action);
+}
+/**
+ *
+ * @param modifier
+ * @param action
+ */
+export function isValidDamageActionWeaponModifier(modifier, action) {
+    if (getType(modifier) !== ModifierTypeEnum.DAMAGE) {
+        return false;
+    }
+    return isValidActionWeaponModifier(modifier, action);
+}
+/**
+ *
+ * @param modifier
+ * @param action
+ */
+export function isValidActionSpellModifier(modifier, action) {
+    if (isSpellAttackModifier(modifier)) {
+        return true;
+    }
+    const attackRangeType = ActionAccessors.getAttackRangeId(action);
+    if (isValidSpellAttackRangeModifier(modifier, attackRangeType)) {
+        return true;
+    }
+    return false;
+}
+/**
+ *
+ * @param modifier
+ * @param action
+ */
+export function isValidBonusActionSpellToHitModifier(modifier, action) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return isValidActionSpellModifier(modifier, action);
+}
+/**
+ *
+ * @param modifier
+ * @param action
+ */
+export function isValidDamageActionSpellModifier(modifier, action) {
+    if (getType(modifier) !== ModifierTypeEnum.DAMAGE) {
+        return false;
+    }
+    return isValidActionSpellModifier(modifier, action);
+}
+/**
+ *
+ * @param modifier
+ * @param skill
+ */
+export function isValidAbilitySkillModifier(modifier, skill) {
+    if (getSubType(modifier) === ModifierSubTypeEnum.ABILITY_CHECKS) {
+        return true;
+    }
+    switch (getSubType(modifier)) {
+        case ModifierSubTypeEnum.STRENGTH_ABILITY_CHECKS:
+            return skill.stat === AbilityStatEnum.STRENGTH;
+        case ModifierSubTypeEnum.DEXTERITY_ABILITY_CHECKS:
+            return skill.stat === AbilityStatEnum.DEXTERITY;
+        case ModifierSubTypeEnum.CONSTITUTION_ABILITY_CHECKS:
+            return skill.stat === AbilityStatEnum.CONSTITUTION;
+        case ModifierSubTypeEnum.INTELLIGENCE_ABILITY_CHECKS:
+            return skill.stat === AbilityStatEnum.INTELLIGENCE;
+        case ModifierSubTypeEnum.WISDOM_ABILITY_CHECKS:
+            return skill.stat === AbilityStatEnum.WISDOM;
+        case ModifierSubTypeEnum.CHARISMA_ABILITY_CHECKS:
+            return skill.stat === AbilityStatEnum.CHARISMA;
+    }
+    if (getEntityId(modifier) === skill.id && getEntityTypeId(modifier) === skill.entityTypeId) {
+        return true;
+    }
+    return false;
+}
+/**
+ *
+ * @param modifier
+ * @param skill
+ */
+export function isValidAbilitySkillBonusModifier(modifier, skill) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return isValidAbilitySkillModifier(modifier, skill);
+}
+/**
+ *
+ * @param modifier
+ * @param skill
+ */
+export function isValidAbilitySkillProficiencyModifier(modifier, skill) {
+    if (getType(modifier) !== ModifierTypeEnum.PROFICIENCY) {
+        return false;
+    }
+    return isValidAbilitySkillModifier(modifier, skill);
+}
+/**
+ *
+ * @param modifier
+ * @param skill
+ */
+export function isValidAbilitySkillExpertiseModifier(modifier, skill) {
+    if (getType(modifier) !== ModifierTypeEnum.EXPERTISE) {
+        return false;
+    }
+    return isValidAbilitySkillModifier(modifier, skill);
+}
+/**
+ *
+ * @param modifier
+ * @param skill
+ */
+export function isValidAbilitySkillHalfProficiencyModifier(modifier, skill) {
+    if (getType(modifier) !== ModifierTypeEnum.HALF_PROFICIENCY) {
+        return false;
+    }
+    return isValidAbilitySkillModifier(modifier, skill);
+}
+/**
+ *
+ * @param modifier
+ * @param skill
+ */
+export function isValidAbilitySkillHalfProficiencyRoundUpModifier(modifier, skill) {
+    if (getType(modifier) !== ModifierTypeEnum.HALF_PROFICIENCY_ROUND_UP) {
+        return false;
+    }
+    return isValidAbilitySkillModifier(modifier, skill);
+}
+/**
+ *
+ * @param modifier
+ * @param movement
+ */
+export function isValidSpeedModifier(modifier, movement) {
+    if (getSubType(modifier) === ModifierSubTypeEnum.SPEED) {
+        return true;
+    }
+    switch (movement) {
+        case SpeedMovementKeyEnum.WALK:
+            return getSubType(modifier) === ModifierSubTypeEnum.SPEED_WALKING;
+        case SpeedMovementKeyEnum.FLY:
+            return getSubType(modifier) === ModifierSubTypeEnum.SPEED_FLYING;
+        case SpeedMovementKeyEnum.BURROW:
+            return getSubType(modifier) === ModifierSubTypeEnum.SPEED_BURROWING;
+        case SpeedMovementKeyEnum.SWIM:
+            return getSubType(modifier) === ModifierSubTypeEnum.SPEED_SWIMMING;
+        case SpeedMovementKeyEnum.CLIMB:
+            return getSubType(modifier) === ModifierSubTypeEnum.SPEED_CLIMBING;
+    }
+    return false;
+}
+/**
+ *
+ * @param modifier
+ * @param movement
+ */
+export function isValidInnateSpeedModifier(modifier, movement) {
+    switch (movement) {
+        case SpeedMovementKeyEnum.WALK:
+            return getSubType(modifier) === ModifierSubTypeEnum.INNATE_SPEED_WALKING;
+        case SpeedMovementKeyEnum.FLY:
+            return getSubType(modifier) === ModifierSubTypeEnum.INNATE_SPEED_FLYING;
+        case SpeedMovementKeyEnum.BURROW:
+            return getSubType(modifier) === ModifierSubTypeEnum.INNATE_SPEED_BURROWING;
+        case SpeedMovementKeyEnum.SWIM:
+            return getSubType(modifier) === ModifierSubTypeEnum.INNATE_SPEED_SWIMMING;
+        case SpeedMovementKeyEnum.CLIMB:
+            return getSubType(modifier) === ModifierSubTypeEnum.INNATE_SPEED_CLIMBING;
+    }
+    return false;
+}
+/**
+ *
+ * @param modifier
+ * @param movement
+ */
+export function isValidBonusSpeedModifier(modifier, movement) {
+    if (getType(modifier) !== ModifierTypeEnum.BONUS) {
+        return false;
+    }
+    return isValidSpeedModifier(modifier, movement);
+}
+/**
+ *
+ * @param modifier
+ * @param movement
+ */
+export function isValidSetSpeedModifier(modifier, movement) {
+    if (getType(modifier) !== ModifierTypeEnum.SET) {
+        return false;
+    }
+    return isValidSpeedModifier(modifier, movement);
+}
+/**
+ *
+ * @param modifier
+ * @param movement
+ */
+export function isValidSetInnateSpeedModifier(modifier, movement) {
+    if (getType(modifier) !== ModifierTypeEnum.SET) {
+        return false;
+    }
+    return isValidInnateSpeedModifier(modifier, movement);
+}
+/**
+ *
+ * @param modifier
+ * @param item
+ */
+export function isValidAttunedItemModifier(modifier, item) {
+    if (requiresAttunement(modifier) && ItemAccessors.canAttune(item)) {
+        return !!ItemAccessors.isAttuned(item);
+    }
+    return true;
+}
+/**
+ *
+ * @param modifier
+ * @param charClass
+ * @param isMulticlassCharacter
+ */
+export function isValidClassModifier(modifier, charClass, isMulticlassCharacter) {
+    if (isMulticlassCharacter) {
+        return isAvailableToMulticlass(modifier) || ClassAccessors.isStartingClass(charClass);
+    }
+    return true;
+}
+/**
+ *
+ * @param modifier
+ * @param skill
+ */
+export function isValidSkillAdvantageModifier(modifier, skill) {
+    if (getType(modifier) !== ModifierTypeEnum.ADVANTAGE) {
+        return false;
+    }
+    return isValidAbilitySkillModifier(modifier, skill);
+}
+/**
+ *
+ * @param modifier
+ * @param skill
+ */
+export function isValidSkillDisadvantageModifier(modifier, skill) {
+    if (getType(modifier) !== ModifierTypeEnum.DISADVANTAGE) {
+        return false;
+    }
+    return isValidAbilitySkillModifier(modifier, skill);
+}
+/**
+ *
+ * @param modifier
+ */
+export function isValidWeaponMasteryModifier(modifier) {
+    return getType(modifier) === ModifierTypeEnum.WEAPON_MASTERY;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Note/accessors.js b/ddb_main/packages/rules-engine/es/engine/Note/accessors.js
new file mode 100644
index 0000000..e71dd42
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Note/accessors.js
@@ -0,0 +1,7 @@
+/**
+ *
+ * @param note
+ */
+export function getType(note) {
+    return note.type;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Note/constants.js b/ddb_main/packages/rules-engine/es/engine/Note/constants.js
new file mode 100644
index 0000000..1c16656
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Note/constants.js
@@ -0,0 +1,16 @@
+export var NoteTypeEnum;
+(function (NoteTypeEnum) {
+    NoteTypeEnum["GROUP"] = "GROUP";
+    NoteTypeEnum["PLAIN_TEXT"] = "PLAIN_TEXT";
+    NoteTypeEnum["TOOLTIP"] = "TOOLTIP";
+    NoteTypeEnum["DAMAGE"] = "DAMAGE";
+    NoteTypeEnum["DISADVANTAGE_ICON"] = "DISADVANTAGE_ICON";
+    NoteTypeEnum["DISTANCE"] = "DISTANCE";
+    NoteTypeEnum["AOE_ICON"] = "AOE_ICON";
+})(NoteTypeEnum || (NoteTypeEnum = {}));
+export var DisplayIntentionEnum;
+(function (DisplayIntentionEnum) {
+    DisplayIntentionEnum["SCALED"] = "scaled";
+    DisplayIntentionEnum["POSITIVE"] = "positive";
+    DisplayIntentionEnum["NEGATIVE"] = "negative";
+})(DisplayIntentionEnum || (DisplayIntentionEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Note/generators.js b/ddb_main/packages/rules-engine/es/engine/Note/generators.js
new file mode 100644
index 0000000..bb05bdd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Note/generators.js
@@ -0,0 +1,66 @@
+import { NoteTypeEnum } from './constants';
+export function createGroup(notes, separator = ' ', key = null) {
+    if (!notes.length) {
+        return null;
+    }
+    return {
+        type: NoteTypeEnum.GROUP,
+        data: {
+            key,
+            separator,
+            notes,
+        },
+    };
+}
+export function createPlainText(text, displayIntention = null) {
+    return {
+        type: NoteTypeEnum.PLAIN_TEXT,
+        data: {
+            text,
+            displayIntention,
+        },
+    };
+}
+export function createTooltip(text, tooltip = null, tooltipOpts = {}, displayIntention = null) {
+    return {
+        type: NoteTypeEnum.TOOLTIP,
+        data: {
+            text,
+            tooltip,
+            displayIntention,
+            tooltipOpts,
+        },
+    };
+}
+export function createDamage(type, damage, info = '') {
+    return {
+        type: NoteTypeEnum.DAMAGE,
+        data: {
+            type,
+            damage,
+            info,
+        },
+    };
+}
+export function createDisadvantageIcon() {
+    return {
+        type: NoteTypeEnum.DISADVANTAGE_ICON,
+        data: {},
+    };
+}
+export function createDistance(distance) {
+    return {
+        type: NoteTypeEnum.DISTANCE,
+        data: {
+            distance,
+        },
+    };
+}
+export function createAoeIcon(type) {
+    return {
+        type: NoteTypeEnum.AOE_ICON,
+        data: {
+            type,
+        },
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Note/index.js b/ddb_main/packages/rules-engine/es/engine/Note/index.js
new file mode 100644
index 0000000..4ebc4ac
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Note/index.js
@@ -0,0 +1,9 @@
+import * as NoteAccessors from './accessors';
+import * as NoteConstants from './constants';
+import * as NoteGenerators from './generators';
+import * as NoteTypings from './typings';
+import * as NoteUtils from './utils';
+export * from './constants';
+export * from './typings';
+export { NoteAccessors, NoteGenerators, NoteUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, NoteAccessors), NoteConstants), NoteGenerators), NoteTypings), NoteUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Note/utils.js b/ddb_main/packages/rules-engine/es/engine/Note/utils.js
new file mode 100644
index 0000000..37dc642
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Note/utils.js
@@ -0,0 +1,65 @@
+import { DiceRenderers } from '../Dice';
+import { FormatUtils } from '../Format';
+import { getType } from './accessors';
+import { DisplayIntentionEnum, NoteTypeEnum } from './constants';
+function renderNotePlainText(note) {
+    return `${note.data.text}${note.data.displayIntention === DisplayIntentionEnum.SCALED ? '*' : ''}`;
+}
+function renderNoteDistance(note) {
+    return FormatUtils.renderDistance(note.data.distance);
+}
+function renderNoteAoeIcon(note) {
+    return ` ${note.data.type}`; // space intentional
+}
+function renderNoteDamage(note) {
+    let damageDisplay = '';
+    if (note.data.damage !== null) {
+        if (typeof note.data.damage === 'number') {
+            damageDisplay = String(note.data.damage);
+        }
+        else {
+            damageDisplay = DiceRenderers.renderDice(note.data.damage);
+        }
+    }
+    return `${damageDisplay} ${note.data.type}`.trim();
+}
+function renderNoteDisadvantageIcon() {
+    return ' Disadvantage'; // space intentional
+}
+function renderNote(note) {
+    if (note === null) {
+        return null;
+    }
+    switch (getType(note)) {
+        case NoteTypeEnum.PLAIN_TEXT:
+        case NoteTypeEnum.TOOLTIP:
+            return renderNotePlainText(note);
+        case NoteTypeEnum.DISTANCE:
+            return renderNoteDistance(note);
+        case NoteTypeEnum.AOE_ICON:
+            return renderNoteAoeIcon(note);
+        case NoteTypeEnum.DAMAGE:
+            return renderNoteDamage(note);
+        case NoteTypeEnum.DISADVANTAGE_ICON:
+            return renderNoteDisadvantageIcon();
+        case NoteTypeEnum.GROUP:
+            return renderNoteGroup(note.data.notes, note.data.separator);
+    }
+    return null;
+}
+function renderNoteGroup(notes, separator = ' ') {
+    if (notes === null) {
+        return null;
+    }
+    return notes
+        .map((note, idx) => {
+        if (note === null) {
+            return null;
+        }
+        return `${renderNote(note)}${idx + 1 < notes.length ? separator : ''}`;
+    })
+        .join('');
+}
+export function renderNoteComponents(notes) {
+    return renderNoteGroup(notes, ', ');
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Option/accessors.js b/ddb_main/packages/rules-engine/es/engine/Option/accessors.js
new file mode 100644
index 0000000..3f500e4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Option/accessors.js
@@ -0,0 +1,199 @@
+/**
+ *
+ * @param option
+ */
+export function getId(option) {
+    return getDefinitionId(option);
+}
+/**
+ *
+ * @param option
+ */
+export function getDefinitionId(option) {
+    var _a, _b;
+    return (_b = (_a = option.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param option
+ */
+export function getEntityTypeId(option) {
+    return getDefinitionEntityTypeId(option);
+}
+/**
+ *
+ * @param option
+ */
+export function getDefinitionEntityTypeId(option) {
+    var _a, _b;
+    return (_b = (_a = option.definition) === null || _a === void 0 ? void 0 : _a.entityTypeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param option
+ */
+export function getUniqueKey(option) {
+    return `${getId(option)}-${getEntityTypeId(option)}`;
+}
+/**
+ *
+ * @param option
+ */
+export function getActivation(option) {
+    return getDefinitionActivation(option);
+}
+/**
+ *
+ * @param option
+ */
+export function getDefinitionActivation(option) {
+    var _a, _b;
+    return (_b = (_a = option.definition) === null || _a === void 0 ? void 0 : _a.activation) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param option
+ */
+export function getName(option) {
+    return getDefinitionName(option);
+}
+/**
+ *
+ * @param option
+ */
+export function getDefinitionName(option) {
+    var _a, _b;
+    return (_b = (_a = option.definition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param option
+ */
+export function getSourceId(option) {
+    return getDefinitionSourceId(option);
+}
+/**
+ *
+ * @param option
+ */
+export function getDefinitionSourceId(option) {
+    var _a, _b;
+    return (_b = (_a = option.definition) === null || _a === void 0 ? void 0 : _a.sourceId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param option
+ */
+export function getSourcePage(option) {
+    return getDefinitionSourcePage(option);
+}
+/**
+ *
+ * @param option
+ */
+export function getDefinitionSourcePage(option) {
+    var _a, _b;
+    return (_b = (_a = option.definition) === null || _a === void 0 ? void 0 : _a.sourcePageNumber) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param option
+ */
+export function getSnippet(option) {
+    return getDefinitionSnippet(option);
+}
+/**
+ *
+ * @param option
+ */
+export function getDefinitionSnippet(option) {
+    var _a, _b;
+    return (_b = (_a = option.definition) === null || _a === void 0 ? void 0 : _a.snippet) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param option
+ */
+export function getDescription(option) {
+    return getDefinitionDescription(option);
+}
+/**
+ *
+ * @param option
+ */
+export function getDefinitionDescription(option) {
+    var _a, _b;
+    return (_b = (_a = option.definition) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param option
+ */
+export function getCreatureRules(option) {
+    return getDefinitionCreatureRules(option);
+}
+/**
+ *
+ * @param option
+ */
+export function getDefinitionCreatureRules(option) {
+    var _a, _b;
+    return (_b = (_a = option.definition) === null || _a === void 0 ? void 0 : _a.creatureRules) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param option
+ */
+export function getComponentId(option) {
+    return option.componentId;
+}
+/**
+ *
+ * @param option
+ */
+export function getComponentTypeId(option) {
+    return option.componentTypeId;
+}
+/**
+ *
+ * @param option
+ */
+export function getDataOrigin(option) {
+    return option.dataOrigin;
+}
+/**
+ *
+ * @param option
+ */
+export function getDataOriginType(option) {
+    const dataOrigin = getDataOrigin(option);
+    return dataOrigin.type;
+}
+/**
+ *
+ * @param option
+ */
+export function getActions(option) {
+    return option.actions;
+}
+/**
+ *
+ * @param option
+ */
+export function getFeats(option) {
+    return option.feats;
+}
+/**
+ *
+ * @param option
+ */
+export function getSpells(option) {
+    return option.spells;
+}
+/**
+ *
+ * @param option
+ */
+export function getModifiers(option) {
+    return option.modifiers;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Option/generators.js b/ddb_main/packages/rules-engine/es/engine/Option/generators.js
new file mode 100644
index 0000000..9562978
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Option/generators.js
@@ -0,0 +1,60 @@
+import { groupBy } from 'lodash';
+import { ActionGenerators } from '../Action';
+import { DataOriginGenerators } from '../DataOrigin';
+import { FeatGenerators } from '../Feat';
+import { HelperUtils } from '../Helper';
+import { ModifierGenerators } from '../Modifier';
+import { SpellGenerators } from '../Spell';
+import { getComponentId, getComponentTypeId, getId, getEntityTypeId } from './accessors';
+/**
+ *
+ * @param option
+ */
+export function generateDataOriginKey(option) {
+    return DataOriginGenerators.generateDataOriginKey(getComponentId(option), getComponentTypeId(option));
+}
+/**
+ *
+ * @param options
+ */
+export function generateOptionComponentLookup(options) {
+    return groupBy(options, (option) => generateDataOriginKey(option));
+}
+/**
+ *
+ * @param id
+ * @param entityTypeId
+ * @param optionLookup
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ */
+export function generateDataOriginBaseOptions(id, entityTypeId, optionLookup, dataOriginType, primary, parent = null) {
+    const options = HelperUtils.lookupDataOrFallback(optionLookup, DataOriginGenerators.generateDataOriginKey(id, entityTypeId));
+    if (!options) {
+        return [];
+    }
+    return options.map((option) => (Object.assign(Object.assign({}, option), { dataOrigin: DataOriginGenerators.generateDataOrigin(dataOriginType, primary, parent) })));
+}
+/**
+ *
+ * @param baseOptions
+ * @param dataOriginType
+ * @param featLookup
+ * @param actionLookup
+ * @param spellLookup
+ * @param optionLookup
+ * @param modifierLookup
+ * @param valueLookup
+ * @param spellListDataOriginLookup
+ * @param ruleData
+ * @param primary
+ * @param parent
+ */
+export function generateOptions(baseOptions, dataOriginType, featLookup, actionLookup, spellLookup, optionLookup, modifierLookup, valueLookup, spellListDataOriginLookup, ruleData, primary, parent = null) {
+    return baseOptions.map((option) => {
+        const id = getId(option);
+        const entityTypeId = getEntityTypeId(option);
+        return Object.assign(Object.assign({}, option), { feats: FeatGenerators.generateDataOriginFeats(id, entityTypeId, featLookup, dataOriginType, primary, parent), actions: ActionGenerators.generateBaseActions(id, entityTypeId, actionLookup, valueLookup, dataOriginType, primary, parent), spells: SpellGenerators.generateBaseSpells(id, entityTypeId, spellLookup, dataOriginType, primary, parent, ruleData, spellListDataOriginLookup, valueLookup), modifiers: ModifierGenerators.generateModifiers(id, entityTypeId, modifierLookup, dataOriginType, primary, parent) });
+    });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Option/index.js b/ddb_main/packages/rules-engine/es/engine/Option/index.js
new file mode 100644
index 0000000..27f524d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Option/index.js
@@ -0,0 +1,7 @@
+import * as OptionAccessors from './accessors';
+import * as OptionGenerators from './generators';
+import * as OptionTypings from './typings';
+import * as OptionUtils from './utils';
+export * from './typings';
+export { OptionAccessors, OptionGenerators, OptionUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign({}, OptionAccessors), OptionGenerators), OptionTypings), OptionUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Option/utils.js b/ddb_main/packages/rules-engine/es/engine/Option/utils.js
new file mode 100644
index 0000000..8a86f20
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Option/utils.js
@@ -0,0 +1,29 @@
+import { ClassAccessors } from '../Class';
+import { ClassFeatureAccessors } from '../ClassFeature';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { getDataOrigin, getDataOriginType } from './accessors';
+export function getContextData(option) {
+    const dataOrigin = getDataOrigin(option);
+    const dataOriginType = getDataOriginType(option);
+    let classLevel;
+    switch (dataOriginType) {
+        case DataOriginTypeEnum.CLASS_FEATURE:
+            classLevel = ClassAccessors.getLevel(dataOrigin.parent);
+            break;
+        default:
+        // not implemented
+    }
+    return {
+        classLevel,
+    };
+}
+export function getLevelScale(option) {
+    const dataOrigin = getDataOrigin(option);
+    const dataOriginType = getDataOriginType(option);
+    switch (dataOriginType) {
+        case DataOriginTypeEnum.CLASS_FEATURE:
+            return ClassFeatureAccessors.getLevelScale(dataOrigin.primary);
+        default:
+            return null;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/accessors.js b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/accessors.js
new file mode 100644
index 0000000..8248e5f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/accessors.js
@@ -0,0 +1,42 @@
+/**
+ *
+ * @param feature
+ */
+export function getClassFeatureId(feature) {
+    return feature.classFeatureId;
+}
+/**
+ *
+ * @param feature
+ */
+export function getAffectedClassFeatureId(feature) {
+    return feature.affectedClassFeatureId;
+}
+/**
+ *
+ * @param feature
+ */
+export function getDefinitionKey(feature) {
+    return feature.classFeatureDefinitionKey;
+}
+/**
+ *
+ * @param feature
+ */
+export function getAffectedClassFeatureDefinitionKey(feature) {
+    return feature.affectedClassFeatureDefinitionKey;
+}
+/**
+ *
+ * @param feature
+ */
+export function getClassFeature(feature) {
+    return feature.classFeature;
+}
+/**
+ *
+ * @param feature
+ */
+export function getAccessType(feature) {
+    return feature.accessType;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/derivers.js b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/derivers.js
new file mode 100644
index 0000000..1393064
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/derivers.js
@@ -0,0 +1,9 @@
+import { DefinitionHacks, DefinitionTypeEnum } from '../Definition';
+/**
+ * use hack until ids are strings
+ *
+ * @param id
+ */
+export function deriveDefinitionKey(id) {
+    return DefinitionHacks.hack__generateDefinitionKey(DefinitionTypeEnum.CLASS_FEATURE, id);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/generators.js b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/generators.js
new file mode 100644
index 0000000..9e92dc6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/generators.js
@@ -0,0 +1,24 @@
+import { TypeScriptUtils } from '../../utils';
+import { ClassFeatureSimulators } from '../ClassFeature';
+import { DefinitionPoolUtils } from '../DefinitionPool';
+import { HelperUtils } from '../Helper';
+import { getDefinitionKey } from './accessors';
+export function generateOptionalClassFeatures(optionalClassFeatureMappings, definitionPool, classes, choiceComponents, baseFeats) {
+    return optionalClassFeatureMappings
+        .map((mapping) => generateOptionalClassFeature(mapping, definitionPool, classes, choiceComponents, baseFeats))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+export function generateOptionalClassFeature(optionalClassFeatureMapping, definitionPool, classes, choiceComponents, baseFeats) {
+    const definitionKey = getDefinitionKey(optionalClassFeatureMapping);
+    if (definitionKey === null) {
+        return null;
+    }
+    return Object.assign(Object.assign({}, optionalClassFeatureMapping), { classFeature: ClassFeatureSimulators.simulateClassFeature(definitionKey, definitionPool, classes, choiceComponents, baseFeats), accessType: DefinitionPoolUtils.getDefinitionAccessType(definitionKey, definitionPool) });
+}
+/**
+ *
+ * @param optionalClassFeatures
+ */
+export function generateOptionalClassFeatureLookup(optionalClassFeatures) {
+    return HelperUtils.generateNonNullLookup(optionalClassFeatures, getDefinitionKey);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/index.js b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/index.js
new file mode 100644
index 0000000..76e6af3
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/index.js
@@ -0,0 +1,9 @@
+import * as OptionalClassFeatureAccessors from './accessors';
+import * as OptionalClassFeatureDerivers from './derivers';
+import * as OptionalClassFeatureGenerators from './generators';
+import * as OptionalClassFeatureSimulators from './simulators';
+import * as OptionalClassFeatureTypings from './typings';
+import * as OptionalClassFeatureUtils from './utils';
+export * from './typings';
+export { OptionalClassFeatureAccessors, OptionalClassFeatureDerivers, OptionalClassFeatureGenerators, OptionalClassFeatureSimulators, OptionalClassFeatureUtils, };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, OptionalClassFeatureAccessors), OptionalClassFeatureDerivers), OptionalClassFeatureGenerators), OptionalClassFeatureTypings), OptionalClassFeatureSimulators), OptionalClassFeatureUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/simulators.js b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/simulators.js
new file mode 100644
index 0000000..0877ac4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/simulators.js
@@ -0,0 +1,14 @@
+import { deriveDefinitionKey } from './derivers';
+/**
+ *
+ * @param classFeatureId
+ * @param affectedClassFeatureId
+ */
+export function simulateOptionalClassFeatureContract(classFeatureId, affectedClassFeatureId) {
+    return {
+        affectedClassFeatureId,
+        affectedClassFeatureDefinitionKey: affectedClassFeatureId ? deriveDefinitionKey(affectedClassFeatureId) : null,
+        classFeatureDefinitionKey: classFeatureId ? deriveDefinitionKey(classFeatureId) : null,
+        classFeatureId,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/utils.js b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/utils.js
new file mode 100644
index 0000000..23af977
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalClassFeature/utils.js
@@ -0,0 +1,39 @@
+import { ClassFeatureAccessors } from '../ClassFeature';
+import { FeatureTypeEnum } from '../Core';
+import { getAffectedClassFeatureId, getClassFeature } from './accessors';
+/**
+ *
+ * @param optionalClassFeature
+ */
+export function getOptionalClassFeatureSpellListIds(optionalClassFeature) {
+    const spellListIds = [];
+    const classFeature = getClassFeature(optionalClassFeature);
+    if (classFeature) {
+        spellListIds.push(...ClassFeatureAccessors.getSpellListIds(classFeature));
+    }
+    return spellListIds;
+}
+/**
+ *
+ * @param optionalClassFeature
+ * @param data
+ */
+export function getUpdateMappingSpellListIdsToRemove(optionalClassFeature, data) {
+    const spellListIds = [];
+    const existingAffectedClassFeatureId = getAffectedClassFeatureId(optionalClassFeature);
+    const classFeature = getClassFeature(optionalClassFeature);
+    if (classFeature &&
+        ClassFeatureAccessors.getFeatureType(classFeature) === FeatureTypeEnum.REPLACEMENT &&
+        existingAffectedClassFeatureId !== null &&
+        data.affectedClassFeatureId === null) {
+        spellListIds.push(...getOptionalClassFeatureSpellListIds(optionalClassFeature));
+    }
+    return spellListIds;
+}
+/**
+ *
+ * @param optionalClassFeature
+ */
+export function getRemoveMappingSpellListIds(optionalClassFeature) {
+    return getOptionalClassFeatureSpellListIds(optionalClassFeature);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/accessors.js b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/accessors.js
new file mode 100644
index 0000000..2f94475
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/accessors.js
@@ -0,0 +1,42 @@
+/**
+ *
+ * @param origin
+ */
+export function getRacialTraitId(origin) {
+    return origin.racialTraitId;
+}
+/**
+ *
+ * @param origin
+ */
+export function getAffectedRacialTraitId(origin) {
+    return origin.affectedRacialTraitId;
+}
+/**
+ *
+ * @param origin
+ */
+export function getDefinitionKey(origin) {
+    return origin.racialTraitDefinitionKey;
+}
+/**
+ *
+ * @param origin
+ */
+export function getAffectedRacialTraitDefinitionKey(origin) {
+    return origin.affectedRacialTraitDefinitionKey;
+}
+/**
+ *
+ * @param origin
+ */
+export function getRacialTrait(origin) {
+    return origin.racialTrait;
+}
+/**
+ *
+ * @param origin
+ */
+export function getAccessType(origin) {
+    return origin.accessType;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/derivers.js b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/derivers.js
new file mode 100644
index 0000000..0978a0e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/derivers.js
@@ -0,0 +1,9 @@
+import { DefinitionHacks, DefinitionTypeEnum } from '../Definition';
+/**
+ * use hack until ids are strings
+ *
+ * @param id
+ */
+export function deriveDefinitionKey(id) {
+    return DefinitionHacks.hack__generateDefinitionKey(DefinitionTypeEnum.RACIAL_TRAIT, id);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/generators.js b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/generators.js
new file mode 100644
index 0000000..8efbe19
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/generators.js
@@ -0,0 +1,34 @@
+import { TypeScriptUtils } from '../../utils';
+import { DefinitionPoolUtils } from '../DefinitionPool';
+import { HelperUtils } from '../Helper';
+import { RacialTraitSimulators } from '../RacialTrait';
+import { getDefinitionKey } from './accessors';
+/**
+ *
+ * @param optionalOriginMappings
+ * @param definitionPool
+ */
+export function generateOptionalOrigins(optionalOriginMappings, definitionPool) {
+    return optionalOriginMappings
+        .map((mapping) => generateOptionalOrigin(mapping, definitionPool))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param optionalOriginMapping
+ * @param definitionPool
+ */
+export function generateOptionalOrigin(optionalOriginMapping, definitionPool) {
+    const definitionKey = getDefinitionKey(optionalOriginMapping);
+    if (definitionKey === null) {
+        return null;
+    }
+    return Object.assign(Object.assign({}, optionalOriginMapping), { racialTrait: RacialTraitSimulators.simulateRacialTrait(definitionKey, definitionPool), accessType: DefinitionPoolUtils.getDefinitionAccessType(definitionKey, definitionPool) });
+}
+/**
+ *
+ * @param optionalOrigins
+ */
+export function generateOptionalOriginLookup(optionalOrigins) {
+    return HelperUtils.generateNonNullLookup(optionalOrigins, getDefinitionKey);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/index.js b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/index.js
new file mode 100644
index 0000000..f335ea2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/index.js
@@ -0,0 +1,9 @@
+import * as OptionalOriginAccessors from './accessors';
+import * as OptionalOriginDerivers from './derivers';
+import * as OptionalOriginGenerators from './generators';
+import * as OptionalOriginSimulators from './simulators';
+import * as OptionalOriginTypings from './typings';
+import * as OptionalOriginUtils from './utils';
+export * from './typings';
+export { OptionalOriginAccessors, OptionalOriginDerivers, OptionalOriginGenerators, OptionalOriginSimulators, OptionalOriginUtils, };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, OptionalOriginAccessors), OptionalOriginDerivers), OptionalOriginGenerators), OptionalOriginTypings), OptionalOriginUtils), OptionalOriginSimulators);
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/simulators.js b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/simulators.js
new file mode 100644
index 0000000..981287e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/simulators.js
@@ -0,0 +1,14 @@
+import { deriveDefinitionKey } from './derivers';
+/**
+ *
+ * @param racialTraitId
+ * @param affectedRacialTraitId
+ */
+export function simulateOptionalOriginContract(racialTraitId, affectedRacialTraitId) {
+    return {
+        affectedRacialTraitId,
+        affectedRacialTraitDefinitionKey: affectedRacialTraitId ? deriveDefinitionKey(affectedRacialTraitId) : null,
+        racialTraitDefinitionKey: racialTraitId ? deriveDefinitionKey(racialTraitId) : null,
+        racialTraitId,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/utils.js b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/utils.js
new file mode 100644
index 0000000..b011756
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/OptionalOrigin/utils.js
@@ -0,0 +1,39 @@
+import { FeatureTypeEnum } from '../Core';
+import { RacialTraitAccessors } from '../RacialTrait';
+import { getAffectedRacialTraitId, getRacialTrait } from './accessors';
+/**
+ *
+ * @param optionalOrigin
+ */
+export function getOptionalOriginSpellListIds(optionalOrigin) {
+    const spellListIds = [];
+    const racialTrait = getRacialTrait(optionalOrigin);
+    if (racialTrait) {
+        spellListIds.push(...RacialTraitAccessors.getSpellListIds(racialTrait));
+    }
+    return spellListIds;
+}
+/**
+ *
+ * @param optionalOrigin
+ * @param data
+ */
+export function getUpdateMappingSpellListIdsToRemove(optionalOrigin, data) {
+    const spellListIds = [];
+    const existingAffectedRacialTraitId = getAffectedRacialTraitId(optionalOrigin);
+    const racialTrait = getRacialTrait(optionalOrigin);
+    if (racialTrait &&
+        RacialTraitAccessors.getFeatureType(racialTrait) === FeatureTypeEnum.REPLACEMENT &&
+        existingAffectedRacialTraitId !== null &&
+        data.affectedRacialTraitId === null) {
+        spellListIds.push(...getOptionalOriginSpellListIds(optionalOrigin));
+    }
+    return spellListIds;
+}
+/**
+ *
+ * @param optionalOrigin
+ */
+export function getRemoveMappingSpellListIds(optionalOrigin) {
+    return getOptionalOriginSpellListIds(optionalOrigin);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Organization/accessors.js b/ddb_main/packages/rules-engine/es/engine/Organization/accessors.js
new file mode 100644
index 0000000..98d89a2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Organization/accessors.js
@@ -0,0 +1,21 @@
+/**
+ *
+ * @param org
+ */
+export function getId(org) {
+    return org.id;
+}
+/**
+ *
+ * @param org
+ */
+export function getName(org) {
+    return org.name;
+}
+/**
+ *
+ * @param org
+ */
+export function getDescription(org) {
+    return org.description;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Organization/index.js b/ddb_main/packages/rules-engine/es/engine/Organization/index.js
new file mode 100644
index 0000000..6887777
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Organization/index.js
@@ -0,0 +1,3 @@
+import * as OrganizationAccessors from './accessors';
+export { OrganizationAccessors };
+export default Object.assign({}, OrganizationAccessors);
diff --git a/ddb_main/packages/rules-engine/es/engine/Pdf/generators.js b/ddb_main/packages/rules-engine/es/engine/Pdf/generators.js
new file mode 100644
index 0000000..117b601
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Pdf/generators.js
@@ -0,0 +1,1080 @@
+import { orderBy, uniqBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { AbilityAccessors } from '../Ability';
+import { ActionAccessors, ActionNotes, ActionTypeEnum } from '../Action';
+import { ActivationAccessors, ActivationRenderers, ActivationTypeEnum } from '../Activation';
+import { BackgroundAccessors } from '../Background';
+import { AttackSourceTypeEnum, CharacterValidators, CharacterGenerators, } from '../Character';
+import { ChoiceAccessors } from '../Choice';
+import { ClassAccessors } from '../Class';
+import { ClassFeatureAccessors, ClassFeatureUtils } from '../ClassFeature';
+import { ActivatableTypeEnum, BuilderChoiceTypeEnum, PreferenceAbilityScoreDisplayTypeEnum, PreferenceEncumbranceTypeEnum, PreferenceProgressionTypeEnum, SaveTypeEnum, } from '../Core';
+import { CreatureAccessors, CreatureNotes } from '../Creature';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { DiceRenderers } from '../Dice';
+import { DurationRenderers } from '../Duration';
+import { EntityUtils } from '../Entity';
+import { FeatAccessors } from '../Feat';
+import { FormatUtils } from '../Format';
+import { ItemAccessors, ItemNotes, ItemValidators } from '../Item';
+import { LimitedUseAccessors, LimitedUseDerivers } from '../LimitedUse';
+import { ModifierAccessors, ModifierValidators } from '../Modifier';
+import { NoteUtils } from '../Note';
+import { OptionAccessors, OptionUtils } from '../Option';
+import { RaceAccessors } from '../Race';
+import { RacialTraitAccessors, RacialTraitDerivers } from '../RacialTrait';
+import { RuleDataAccessors, RuleDataUtils } from '../RuleData';
+import { SkillAccessors } from '../Skill';
+import { SnippetUtils } from '../Snippet';
+import { SpellAccessors, SpellDerivers, SpellNotes, SpellUtils, } from '../Spell';
+import { getScaleType } from '../Spell/accessors';
+import { PdfGenerators } from './index';
+/**
+ *
+ * @param action
+ */
+export function generateContext(action) {
+    let classLevel = 0;
+    let levelScale = null;
+    let dataOrigin = ActionAccessors.getDataOrigin(action);
+    let dataOriginType = ActionAccessors.getDataOriginType(action);
+    switch (dataOriginType) {
+        case DataOriginTypeEnum.CLASS_FEATURE:
+            classLevel = ClassAccessors.getLevel(dataOrigin.parent);
+            levelScale = ClassFeatureAccessors.getLevelScale(dataOrigin.primary);
+            break;
+        case DataOriginTypeEnum.RACE:
+        case DataOriginTypeEnum.FEAT:
+        default:
+        // not implemented
+    }
+    return {
+        classLevel,
+        levelScale,
+        limitedUse: ActionAccessors.getLimitedUse(action),
+    };
+}
+/**
+ *
+ * @param limitedUse
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateLimitedUse(limitedUse, abilityLookup, ruleData, proficiencyBonus) {
+    let limitedUseInfo = null;
+    if (limitedUse) {
+        limitedUseInfo = {
+            resetType: LimitedUseAccessors.getResetType(limitedUse),
+            maxUses: LimitedUseDerivers.deriveMaxUses(limitedUse, abilityLookup, ruleData, proficiencyBonus),
+        };
+    }
+    return limitedUseInfo;
+}
+/**
+ *
+ * @param spell
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateFeatureSpell(spell, abilityLookup, ruleData, proficiencyBonus) {
+    // TODO fix once spells are updated
+    return {
+        name: SpellAccessors.getName(spell),
+        level: SpellAccessors.getLevel(spell),
+        limitedUse: generateLimitedUse(SpellAccessors.getLimitedUse(spell), abilityLookup, ruleData, proficiencyBonus),
+    };
+}
+/**
+ *
+ * @param spells
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateFeatureSpells(spells, abilityLookup, ruleData, proficiencyBonus) {
+    return spells.map((spell) => generateFeatureSpell(spell, abilityLookup, ruleData, proficiencyBonus));
+}
+/**
+ *
+ * @param action
+ * @param snippetData
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateAction(action, snippetData, abilityLookup, ruleData, proficiencyBonus) {
+    let limitedUse = ActionAccessors.getLimitedUse(action);
+    let activation = ActionAccessors.getActivation(action);
+    return {
+        name: ActionAccessors.getName(action),
+        limitedUse: generateLimitedUse(limitedUse, abilityLookup, ruleData, proficiencyBonus),
+        snippet: SnippetUtils.convertSnippetToText(ActionAccessors.getSnippet(action), generateContext(action), snippetData, proficiencyBonus),
+        type: ActionAccessors.getActionTypeId(action),
+        activation: activation ? ActivationRenderers.renderActivation(activation, ruleData) : null,
+    };
+}
+/**
+ *
+ * @param actions
+ * @param snippetData
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateActions(actions, snippetData, abilityLookup, ruleData, proficiencyBonus) {
+    return actions.map((action) => generateAction(action, snippetData, abilityLookup, ruleData, proficiencyBonus));
+}
+/**
+ *
+ * @param choice
+ * @param ruleData
+ */
+export function generateChoice(choice, ruleData) {
+    if (ChoiceAccessors.getType(choice) !== BuilderChoiceTypeEnum.SUB_CLASS_OPTION) {
+        return null;
+    }
+    let optionValue = ChoiceAccessors.getOptionValue(choice);
+    if (optionValue === null) {
+        return null;
+    }
+    let dataOrigin = ChoiceAccessors.getDataOrigin(choice);
+    let value = null;
+    if (optionValue && dataOrigin.parent !== null) {
+        value = ClassAccessors.getSubclassName(dataOrigin.parent);
+    }
+    return {
+        type: ChoiceAccessors.getType(choice),
+        value,
+    };
+}
+/**
+ *
+ * @param choices
+ * @param ruleData
+ */
+export function generateChoices(choices, ruleData) {
+    return choices.map((choice) => generateChoice(choice, ruleData)).filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param options
+ * @param snippetData
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateOptions(options, snippetData, abilityLookup, ruleData, proficiencyBonus) {
+    let optionSummaries = options.map((option) => ({
+        name: OptionAccessors.getName(option),
+        page: generatePageRef(OptionAccessors.getSourceId(option), OptionAccessors.getSourcePage(option), ruleData),
+        snippet: SnippetUtils.convertSnippetToText(OptionAccessors.getSnippet(option), OptionUtils.getContextData(option), snippetData, proficiencyBonus),
+        spells: generateFeatureSpells(OptionAccessors.getSpells(option), abilityLookup, ruleData, proficiencyBonus),
+        actions: generateActions(OptionAccessors.getActions(option), snippetData, abilityLookup, ruleData, proficiencyBonus),
+    }));
+    return orderBy(optionSummaries, 'name');
+}
+/**
+ *
+ * @param label
+ * @param type
+ * @param activatables
+ * @param snippetData
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateActionGroup(label, type, activatables, snippetData, abilityLookup, ruleData, proficiencyBonus) {
+    let actions = [];
+    let spells = [];
+    activatables.forEach((activatable) => {
+        if (ActivationAccessors.getType(activatable.activation) === type) {
+            switch (activatable.type) {
+                case ActivatableTypeEnum.ACTION:
+                    actions.push(generateAction(activatable.entity, snippetData, abilityLookup, ruleData, proficiencyBonus));
+                    break;
+                case ActivatableTypeEnum.CLASS_SPELL:
+                case ActivatableTypeEnum.CHARACTER_SPELL:
+                default:
+                // not implemented
+            }
+        }
+    });
+    return {
+        type,
+        label,
+        actions,
+        spells,
+    };
+}
+/**
+ *
+ * @param activatables
+ * @param snippetData
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateActionGroups(activatables, snippetData, abilityLookup, ruleData, proficiencyBonus) {
+    return [
+        generateActionGroup('Actions', ActivationTypeEnum.ACTION, activatables, snippetData, abilityLookup, ruleData, proficiencyBonus),
+        generateActionGroup('Bonus Actions', ActivationTypeEnum.BONUS_ACTION, activatables, snippetData, abilityLookup, ruleData, proficiencyBonus),
+        generateActionGroup('Reactions', ActivationTypeEnum.REACTION, activatables, snippetData, abilityLookup, ruleData, proficiencyBonus),
+        generateActionGroup('Special', ActivationTypeEnum.SPECIAL, activatables, snippetData, abilityLookup, ruleData, proficiencyBonus),
+    ];
+}
+/**
+ *
+ * @param sourceId
+ * @param pageNumber
+ * @param ruleData
+ */
+export function generatePageRef(sourceId, pageNumber, ruleData) {
+    let pageString = '';
+    if (sourceId !== null) {
+        let sourceDataLookup = RuleDataAccessors.getSourceDataLookup(ruleData);
+        let pageSourceInfo = sourceDataLookup[sourceId];
+        if (pageSourceInfo) {
+            pageString = `${pageSourceInfo.name} ${pageNumber ? pageNumber : ''}`;
+        }
+    }
+    return pageString.trim();
+}
+/**
+ *
+ * @param sources
+ * @param ruleData
+ */
+export function generateSourcesString(sources, ruleData) {
+    return sources
+        .filter(CharacterValidators.isPrimarySource)
+        .map((source) => generatePageRef(source.sourceId, source.pageNumber, ruleData))
+        .join(', ');
+}
+/**
+ *
+ * @param senseInfo
+ * @param senseKey
+ * @param ruleData
+ */
+export function generateSense(senseInfo, senseKey, ruleData) {
+    let senseValue = null;
+    if (senseInfo.hasOwnProperty(senseKey)) {
+        senseValue = senseInfo[senseKey];
+    }
+    let configSenseInfo = RuleDataUtils.getSenseInfo(parseInt(senseKey), ruleData);
+    return {
+        label: configSenseInfo !== null && configSenseInfo.name !== null ? configSenseInfo.name : '',
+        distance: senseValue,
+    };
+}
+/**
+ *
+ * @param senseInfo
+ * @param ruleData
+ */
+export function generateSenses(senseInfo, ruleData) {
+    return Object.keys(senseInfo).map((senseKey) => generateSense(senseInfo, senseKey, ruleData));
+}
+/**
+ *
+ * @param charClass
+ */
+export function generateClass(charClass) {
+    const name = ClassAccessors.getName(charClass);
+    return {
+        name: name === null ? '' : name,
+        level: ClassAccessors.getLevel(charClass),
+    };
+}
+/**
+ *
+ * @param ability
+ * @param preferences
+ */
+export function generateAbility(ability, preferences) {
+    const score = AbilityAccessors.getScore(ability);
+    const modifier = AbilityAccessors.getModifier(ability);
+    const save = AbilityAccessors.getSave(ability);
+    const statKey = AbilityAccessors.getStatKey(ability);
+    const label = AbilityAccessors.getLabel(ability);
+    const proficiencyLevel = AbilityAccessors.getProficiencyLevel(ability);
+    let primary = modifier === null ? '' : FormatUtils.renderSignedNumber(modifier);
+    let secondary = score === null ? '' : '' + score;
+    if (preferences.abilityScoreDisplayType === PreferenceAbilityScoreDisplayTypeEnum.SCORES_TOP) {
+        [primary, secondary] = [secondary, primary];
+    }
+    return {
+        display: {
+            primary,
+            secondary,
+        },
+        score: score,
+        modifier: modifier,
+        savingThrow: save,
+        savingThrowProficiencyLevel: proficiencyLevel,
+        key: statKey,
+        name: label === null ? '' : label,
+    };
+}
+/**
+ *
+ * @param bonusSavingThrowModifiers
+ * @param advantageSavingThrowModifiers
+ * @param disadvantageSavingThrowModifiers
+ */
+export function generateSavingThrowSummaries(bonusSavingThrowModifiers, advantageSavingThrowModifiers, disadvantageSavingThrowModifiers) {
+    let summaries = [];
+    bonusSavingThrowModifiers.forEach((modifier) => {
+        summaries.push(CharacterGenerators.generateSavingThrowModifierSummary(SaveTypeEnum.BONUS, modifier));
+    });
+    advantageSavingThrowModifiers.forEach((modifier) => {
+        summaries.push(CharacterGenerators.generateSavingThrowModifierSummary(SaveTypeEnum.ADVANTAGE, modifier));
+    });
+    disadvantageSavingThrowModifiers.forEach((modifier) => {
+        summaries.push(CharacterGenerators.generateSavingThrowModifierSummary(SaveTypeEnum.DISADVANTAGE, modifier));
+    });
+    return summaries;
+}
+/**
+ *
+ * @param skill
+ * @param ruleData
+ */
+export function generateSkill(skill, ruleData) {
+    const name = SkillAccessors.getName(skill);
+    const statId = SkillAccessors.getStat(skill);
+    let statKey = '';
+    if (statId !== null) {
+        const statName = RuleDataUtils.getStatNameById(statId, ruleData);
+        if (statName !== null) {
+            statKey = statName;
+        }
+    }
+    return {
+        proficiencyLevel: SkillAccessors.getProficiencyLevel(skill),
+        name: name === null ? '' : name,
+        modifier: SkillAccessors.getModifier(skill),
+        statKey,
+    };
+}
+/**
+ *
+ * @param defenseAdjustmentGroup
+ */
+export function generateDefense(defenseAdjustmentGroup) {
+    return {
+        name: defenseAdjustmentGroup.name,
+        source: defenseAdjustmentGroup.sources.join(', '),
+        isCustom: defenseAdjustmentGroup.hasCustom,
+    };
+}
+/**
+ *
+ * @param resistances
+ * @param immunities
+ * @param vulnerabilities
+ */
+export function generateDefenses(resistances, immunities, vulnerabilities) {
+    return {
+        resistances: resistances.map((defenseGroup) => generateDefense(defenseGroup)),
+        immunities: immunities.map((defenseGroup) => generateDefense(defenseGroup)),
+        vulnerabilities: vulnerabilities.map((defenseGroup) => generateDefense(defenseGroup)),
+    };
+}
+/**
+ *
+ * @param ruleData
+ */
+export function generateBasicActions(ruleData) {
+    return RuleDataAccessors.getBasicActions(ruleData)
+        .map((basicAction) => basicAction.name)
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param hitPointInfo
+ */
+export function generateHitDice(hitPointInfo) {
+    return hitPointInfo.classesHitDice.map((classHitDice) => ({
+        dice: classHitDice.dice,
+        diceString: DiceRenderers.renderDie(classHitDice.dice),
+    }));
+}
+/**
+ *
+ * @param charClass
+ * @param classSpellInfoLookup
+ * @param propertyKey
+ * @param fallback
+ */
+export function generateSpellcastingInfoValue(charClass, classSpellInfoLookup, propertyKey, fallback) {
+    let spellInfoLookup = classSpellInfoLookup[ClassAccessors.getId(charClass)];
+    if (!spellInfoLookup) {
+        return fallback;
+    }
+    if (!spellInfoLookup.hasOwnProperty(propertyKey)) {
+        return fallback;
+    }
+    return spellInfoLookup[propertyKey];
+}
+/**
+ *
+ * @param classSpellLists
+ * @param classSpellInfoLookup
+ */
+export function generateSpellcastingInfo(classSpellLists, classSpellInfoLookup) {
+    return {
+        classNames: classSpellLists.map((classSpellList) => {
+            let name = ClassAccessors.getName(classSpellList.charClass);
+            return name === null ? '' : name;
+        }),
+        spellcastingAbilities: classSpellLists.map((classSpellList) => classSpellList.spellcastingAbility === null ? '' : classSpellList.spellcastingAbility),
+        spellSaveDifficulties: classSpellLists.map((classSpellList) => generateSpellcastingInfoValue(classSpellList.charClass, classSpellInfoLookup, 'spellSaveDc', 0)),
+        spellAttackBonuses: classSpellLists.map((classSpellList) => generateSpellcastingInfoValue(classSpellList.charClass, classSpellInfoLookup, 'toHit', 0)),
+    };
+}
+/**
+ *
+ * @param action
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+function generateAttack_Action(action, abilityLookup, ruleData, proficiencyBonus) {
+    if (ActionAccessors.getActionTypeId(action) !== ActionTypeEnum.WEAPON ||
+        !ActionAccessors.requiresAttackRoll(action)) {
+        return null;
+    }
+    let damage = ActionAccessors.getDamage(action);
+    let damageDisplay = '';
+    if (damage.value !== null) {
+        damageDisplay = typeof damage.value === 'number' ? damage.value : DiceRenderers.renderDice(damage.value);
+    }
+    let damageString = `${damageDisplay} ${damage.type ? damage.type.name : ''}`;
+    let noteComponents = ActionNotes.getNoteComponents(action, ruleData, abilityLookup, proficiencyBonus);
+    const toHit = ActionAccessors.getToHit(action);
+    return {
+        name: ActionAccessors.getName(action),
+        toHit: toHit === null ? 0 : toHit,
+        damageString: damageString.trim(),
+        notes: NoteUtils.renderNoteComponents(noteComponents),
+    };
+}
+/**
+ *
+ * @param item
+ * @param weaponSpellDamageGroups
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+function generateAttack_Item(item, weaponSpellDamageGroups, abilityLookup, ruleData, proficiencyBonus) {
+    if (!ItemValidators.validateIsWeaponLike(item)) {
+        return null;
+    }
+    let damage = ItemAccessors.getDamage(item);
+    let damageDisplay = '';
+    if (damage !== null) {
+        damageDisplay = typeof damage === 'number' ? damage : DiceRenderers.renderDice(damage);
+    }
+    let damageString = `${damageDisplay} ${ItemAccessors.getDamageType(item)}`;
+    let noteComponents = ItemNotes.getNoteComponents(item, weaponSpellDamageGroups, ruleData, abilityLookup, proficiencyBonus);
+    const toHit = ItemAccessors.getToHit(item);
+    return {
+        name: ItemAccessors.getName(item),
+        toHit: toHit === null ? 0 : toHit,
+        damageString: damageString.trim(),
+        notes: NoteUtils.renderNoteComponents(noteComponents),
+    };
+}
+/**
+ *
+ * @param spell
+ * @param characterLevel
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+function generateAttack_Spell(spell, characterLevel, abilityLookup, ruleData, proficiencyBonus) {
+    if (!SpellAccessors.isCantrip(spell) || !SpellAccessors.getRequiresAttackRoll(spell)) {
+        return null;
+    }
+    let damageString = '';
+    const modifiers = SpellAccessors.getModifiers(spell);
+    let damageModifiers = modifiers.filter((modifier) => ModifierValidators.isSpellDamageModifier(modifier));
+    if (damageModifiers.length) {
+        let modifier = damageModifiers[0];
+        const atHigherLevels = ModifierAccessors.getAtHigherLevels(modifier);
+        // TODO: V5 do we need this extra check julie/brian for context
+        let scaleType = atHigherLevels ? getScaleType(spell) : null;
+        let points = atHigherLevels && atHigherLevels.points ? atHigherLevels.points : [];
+        let atHigherDamage = SpellDerivers.getSpellScaledAtHigher(spell, scaleType, points, characterLevel, 0);
+        let scaledDamageDie = SpellUtils.getSpellFinalScaledDie(spell, modifier, atHigherDamage);
+        if (scaledDamageDie !== null) {
+            damageString = `${DiceRenderers.renderDice(scaledDamageDie)} ${modifier.friendlySubtypeName}`;
+        }
+    }
+    const startingCastLevel = SpellDerivers.deriveStartingCastLevel(spell);
+    let noteComponents = SpellNotes.getNoteComponents(spell, startingCastLevel, characterLevel, abilityLookup, ruleData, 0, proficiencyBonus);
+    const toHit = SpellAccessors.getToHit(spell);
+    return {
+        name: SpellAccessors.getName(spell),
+        toHit: toHit === null ? 0 : toHit,
+        damageString: damageString.trim(),
+        notes: NoteUtils.renderNoteComponents(noteComponents),
+    };
+}
+/**
+ *
+ * @param attack
+ * @param characterLevel
+ * @param weaponSpellDamageGroups
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateAttack(attack, characterLevel, weaponSpellDamageGroups, abilityLookup, ruleData, proficiencyBonus) {
+    switch (attack.type) {
+        case AttackSourceTypeEnum.ACTION:
+        case AttackSourceTypeEnum.CUSTOM:
+            return generateAttack_Action(attack.data, abilityLookup, ruleData, proficiencyBonus);
+        case AttackSourceTypeEnum.ITEM:
+            return generateAttack_Item(attack.data, weaponSpellDamageGroups, abilityLookup, ruleData, proficiencyBonus);
+        case AttackSourceTypeEnum.SPELL:
+            return generateAttack_Spell(attack.data, characterLevel, abilityLookup, ruleData, proficiencyBonus);
+        default:
+        // not implemented
+    }
+    return null;
+}
+/**
+ *
+ * @param attacks
+ * @param characterLevel
+ * @param weaponSpellDamageGroups
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateAttacks(attacks, characterLevel, weaponSpellDamageGroups, abilityLookup, ruleData, proficiencyBonus) {
+    return attacks
+        .map((attack) => generateAttack(attack, characterLevel, weaponSpellDamageGroups, abilityLookup, ruleData, proficiencyBonus))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param item
+ */
+export function generateItem(item) {
+    return {
+        name: ItemAccessors.getName(item),
+        quantity: ItemAccessors.getQuantity(item),
+        weight: ItemAccessors.getWeight(item),
+    };
+}
+/**
+ *
+ * @param items
+ * @param customItems
+ */
+export function generateItems(items, customItems) {
+    return [...items, ...customItems].map((item) => generateItem(item));
+}
+/**
+ *
+ * @param items
+ */
+export function generateAttunedItems(items) {
+    return items.filter((item) => ItemAccessors.isAttuned(item)).map((item) => generateItem(item));
+}
+/**
+ *
+ * @param feat
+ * @param snippetData
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateFeat(feat, snippetData, abilityLookup, ruleData, proficiencyBonus) {
+    return {
+        name: FeatAccessors.getName(feat),
+        page: generateSourcesString(FeatAccessors.getSources(feat), ruleData),
+        snippet: SnippetUtils.convertSnippetToText(FeatAccessors.getSnippet(feat), {}, snippetData, proficiencyBonus),
+        options: generateOptions(feat.options, snippetData, abilityLookup, ruleData, proficiencyBonus),
+        spells: generateFeatureSpells(feat.spells, abilityLookup, ruleData, proficiencyBonus),
+        actions: generateActions(feat.actions, snippetData, abilityLookup, ruleData, proficiencyBonus),
+    };
+}
+/**
+ *
+ * @param charClass
+ * @param classFeature
+ * @param snippetData
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateClassFeature(charClass, classFeature, snippetData, abilityLookup, ruleData, proficiencyBonus) {
+    return {
+        name: ClassFeatureAccessors.getName(classFeature),
+        page: generatePageRef(ClassFeatureAccessors.getSourceId(classFeature), ClassFeatureAccessors.getSourcePage(classFeature), ruleData),
+        levelScale: ClassFeatureAccessors.getLevelScale(classFeature),
+        snippet: SnippetUtils.convertSnippetToText(ClassFeatureAccessors.getSnippet(classFeature), ClassFeatureUtils.getContextData(classFeature, charClass), snippetData, proficiencyBonus),
+        options: generateOptions(ClassFeatureAccessors.getOptions(classFeature), snippetData, abilityLookup, ruleData, proficiencyBonus),
+        spells: generateFeatureSpells(ClassFeatureAccessors.getSpells(classFeature), abilityLookup, ruleData, proficiencyBonus),
+        actions: generateActions(ClassFeatureAccessors.getActions(classFeature), snippetData, abilityLookup, ruleData, proficiencyBonus),
+        choices: generateChoices(ClassFeatureAccessors.getChoices(classFeature), ruleData),
+    };
+}
+/**
+ *
+ * @param charClass
+ * @param snippetData
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateClassFeatureClass(charClass, snippetData, abilityLookup, ruleData, proficiencyBonus) {
+    const mappedClassFeatures = ClassAccessors.getUniqueClassFeatures(charClass).map((feature) => generateClassFeature(charClass, feature, snippetData, abilityLookup, ruleData, proficiencyBonus));
+    const name = ClassAccessors.getName(charClass);
+    return {
+        className: name === null ? '' : name,
+        level: ClassAccessors.getLevel(charClass),
+        features: uniqBy(mappedClassFeatures, (feature) => feature.name),
+    };
+}
+/**
+ *
+ * @param racialTrait
+ * @param snippetData
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateRacialTrait(racialTrait, snippetData, abilityLookup, ruleData, proficiencyBonus) {
+    return {
+        name: RacialTraitAccessors.getName(racialTrait),
+        page: generatePageRef(RacialTraitAccessors.getSourceId(racialTrait), RacialTraitAccessors.getSourcePage(racialTrait), ruleData),
+        snippet: SnippetUtils.convertSnippetToText(RacialTraitAccessors.getSnippet(racialTrait), RacialTraitDerivers.deriveContextData(racialTrait), snippetData, proficiencyBonus),
+        options: generateOptions(racialTrait.options, snippetData, abilityLookup, ruleData, proficiencyBonus),
+        spells: generateFeatureSpells(racialTrait.spells, abilityLookup, ruleData, proficiencyBonus),
+        actions: generateActions(racialTrait.actions, snippetData, abilityLookup, ruleData, proficiencyBonus),
+    };
+}
+/**
+ *
+ * @param race
+ * @param snippetData
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateRacialTraits(race, snippetData, abilityLookup, ruleData, proficiencyBonus) {
+    if (race === null) {
+        return [];
+    }
+    return RaceAccessors.getVisibleRacialTraits(race).map((racialTrait) => generateRacialTrait(racialTrait, snippetData, abilityLookup, ruleData, proficiencyBonus));
+}
+/**
+ *
+ * @param race
+ */
+export function generateRace(race) {
+    if (race === null) {
+        return '';
+    }
+    const fullName = RaceAccessors.getFullName(race);
+    return fullName === null ? '' : fullName;
+}
+/**
+ *
+ * @param background
+ */
+export function generateBackground(background) {
+    if (background === null) {
+        return null;
+    }
+    if (BackgroundAccessors.getHasCustomBackground(background)) {
+        return 'Custom Background';
+    }
+    return BackgroundAccessors.getName(background);
+}
+/**
+ *
+ * @param spell
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateSpell(spell, abilityLookup, ruleData, proficiencyBonus) {
+    const level = SpellAccessors.getLevel(spell);
+    const components = SpellAccessors.getComponents(spell)
+        .map((componentId) => {
+        const spellComponentInfo = RuleDataUtils.getSpellComponentInfo(componentId, ruleData);
+        return spellComponentInfo ? spellComponentInfo.shortName : null;
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    let activation = SpellAccessors.getActivation(spell);
+    let duration = SpellAccessors.getDuration(spell);
+    let durationString = '';
+    if (duration) {
+        durationString = DurationRenderers.renderDuration(duration, SpellAccessors.getConcentration(spell));
+    }
+    let dataOriginName = EntityUtils.getDataOriginName(SpellAccessors.getDataOrigin(spell));
+    let requiresSavingThrow = SpellAccessors.getRequiresSavingThrow(spell);
+    let requiresAttackRoll = SpellAccessors.getRequiresAttackRoll(spell);
+    let range = SpellAccessors.getRange(spell);
+    let rangeAreas = [];
+    // TODO need to change origin to id and then use constants here for comparison
+    if (range && range.origin && range.origin !== 'Ranged') {
+        rangeAreas.push(range.origin);
+    }
+    if (range && range.rangeValue) {
+        rangeAreas.push(FormatUtils.renderDistance(range.rangeValue));
+    }
+    if (range && range.aoeValue) {
+        rangeAreas.push(`${FormatUtils.renderDistance(range.aoeValue)} ${range.aoeType}`.trim());
+    }
+    const startingCastLevel = SpellDerivers.deriveStartingCastLevel(spell);
+    // TODO "level" seems to be incorrect here, but it wont matter with this update and will be removed once we make the updates in DCP-1412
+    let noteComponents = SpellNotes.getNoteComponents(spell, startingCastLevel, level, abilityLookup, ruleData, 0, proficiencyBonus);
+    let isCastAsRitual = SpellAccessors.isCastAsRitual(spell);
+    let attackType = SpellAccessors.getAttackType(spell);
+    return {
+        name: SpellAccessors.getName(spell),
+        canPrepare: SpellAccessors.canPrepare(spell),
+        alwaysPrepared: SpellAccessors.isAlwaysPrepared(spell),
+        requiresSavingThrow,
+        attackSaveStatKey: requiresSavingThrow ? SpellUtils.getSaveDcAbilityShortName(spell, ruleData) : null,
+        attackSaveValue: requiresSavingThrow ? SpellAccessors.getAttackSaveValue(spell) : null,
+        requiresAttackRoll,
+        toHit: requiresAttackRoll ? SpellAccessors.getToHit(spell) : null,
+        attackType: attackType ? RuleDataUtils.getAttackTypeRangeName(attackType) : null,
+        components: components.join(','),
+        castingTime: activation
+            ? ActivationRenderers.renderCastingTimeAbbreviation(activation, isCastAsRitual ? 10 : 0)
+            : null,
+        duration: durationString.trim(),
+        page: generateSourcesString(SpellAccessors.getSources(spell), ruleData),
+        source: dataOriginName.trim(),
+        range: rangeAreas.join('/'),
+        isRitual: SpellAccessors.isRitual(spell),
+        isConcentration: SpellAccessors.getConcentration(spell),
+        notes: NoteUtils.renderNoteComponents(noteComponents),
+    };
+}
+/**
+ *
+ * @param classSpells
+ * @param characterSpells
+ * @param abilityLookup
+ * @param ruleData
+ * @param proficiencyBonus
+ */
+export function generateSpells(classSpells, characterSpells, abilityLookup, ruleData, proficiencyBonus) {
+    let exportSpells = [];
+    for (let i = 0; i <= RuleDataAccessors.getMaxSpellLevel(ruleData); i++) {
+        exportSpells.push([]);
+    }
+    [...classSpells, ...characterSpells].forEach((spell) => {
+        const startingCastLevel = SpellDerivers.deriveStartingCastLevel(spell);
+        exportSpells[startingCastLevel].push(generateSpell(spell, abilityLookup, ruleData, proficiencyBonus));
+    });
+    return exportSpells;
+}
+/**
+ *
+ * @param spellSlots
+ * @param pactMagicSlots
+ * @param ruleData
+ */
+export function generateSpellSlots(spellSlots, pactMagicSlots, ruleData) {
+    let exportSpellSlots = [];
+    for (let i = 0; i <= RuleDataAccessors.getMaxSpellLevel(ruleData); i++) {
+        let spellLevelSlots = spellSlots.find((slotLevel) => slotLevel.level === i);
+        let pactMagicLevelSlots = pactMagicSlots.find((slotLevel) => slotLevel.level === i);
+        let combined = [];
+        if (spellLevelSlots) {
+            combined.push(spellLevelSlots.available);
+        }
+        if (pactMagicLevelSlots) {
+            combined.push(pactMagicLevelSlots.available);
+        }
+        exportSpellSlots.push({
+            combined,
+            spell: spellLevelSlots ? spellLevelSlots.available : 0,
+            pactMagic: pactMagicLevelSlots ? pactMagicLevelSlots.available : 0,
+        });
+    }
+    return exportSpellSlots;
+}
+/**
+ *
+ * @param proficiencyModifiers
+ */
+export function generateProficiencies(proficiencyModifiers) {
+    let proficiencies = proficiencyModifiers
+        .map((modifier) => ModifierAccessors.getFriendlySubtypeName(modifier))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    return orderBy(proficiencies);
+}
+/**
+ *
+ * @param proficiencyGroups
+ */
+export function generateProficiencyGroups(proficiencyGroups) {
+    return proficiencyGroups.map((proficiencyGroup) => {
+        return {
+            label: proficiencyGroup.label === null ? '' : proficiencyGroup.label,
+            proficiencies: proficiencyGroup.modifierGroups.map((modifierGroup) => modifierGroup.label),
+        };
+    });
+}
+/**
+ *
+ * @param currentXp
+ * @param preferences
+ */
+export function generateXp(currentXp, preferences) {
+    if (preferences.progressionType === PreferenceProgressionTypeEnum.MILESTONE) {
+        return '(Milestone)';
+    }
+    return currentXp.toLocaleString();
+}
+/**
+ *
+ * @param creature
+ * @param ruleData
+ */
+export function generateCreature(creature, ruleData) {
+    let hitPointInfo = CreatureAccessors.getHitPointInfo(creature);
+    let groupInfo = CreatureAccessors.getGroupInfo(creature);
+    return {
+        name: CreatureAccessors.getName(creature),
+        hitPoints: hitPointInfo.totalHp,
+        groupInfo: {
+            isPrimary: groupInfo ? groupInfo.isPrimary : null,
+            isMisc: groupInfo ? groupInfo.isMisc : null,
+            id: groupInfo ? groupInfo.id : null,
+            name: groupInfo ? groupInfo.name : null,
+        },
+        notes: NoteUtils.renderNoteComponents(CreatureNotes.getNoteComponents(creature, ruleData)),
+    };
+}
+/**
+ * TODO evaluate whether this logic isn't somewhere else?
+ * @param carryCapactiy
+ * @param encumberedWeight
+ * @param preferences
+ */
+export function generateEncumberedWeightInfo(carryCapactiy, encumberedWeight, preferences) {
+    if (preferences.encumbranceType === PreferenceEncumbranceTypeEnum.VARIANT) {
+        return encumberedWeight;
+    }
+    else if (preferences.encumbranceType === PreferenceEncumbranceTypeEnum.NONE) {
+        return 0;
+    }
+    return carryCapactiy;
+}
+/**
+ * TODO evaluate whether this logic isn't somewhere else?
+ * @param pushDragLiftWeight
+ * @param preferences
+ */
+export function generatePushDragLiftWeight(pushDragLiftWeight, preferences) {
+    if (preferences.encumbranceType === PreferenceEncumbranceTypeEnum.NONE) {
+        return 0;
+    }
+    return pushDragLiftWeight;
+}
+/**
+ *
+ * @param alignment
+ */
+export function generateAlignment(alignment) {
+    return alignment === null ? null : alignment.name;
+}
+/**
+ *
+ * @param size
+ */
+export function generateSize(size) {
+    return size === null ? null : size.name;
+}
+/**
+ *
+ * @param skills
+ * @param customSkills
+ * @param spellSlots
+ * @param pactMagicSlots
+ * @param creatures
+ * @param attacks
+ * @param weaponSpellDamageGroups
+ * @param classSpells
+ * @param characterSpells
+ * @param characterLevel
+ * @param abilityLookup
+ * @param ruleData
+ * @param hack__pdfDataBucket1AndBucket2Parts
+ */
+export function generatePdfDataBucket1(skills, customSkills, spellSlots, pactMagicSlots, creatures, attacks, weaponSpellDamageGroups, classSpells, characterSpells, characterLevel, hack__pdfDataBucket1AndBucket2Parts) {
+    const { abilityLookup, ruleData, proficiencyBonus } = hack__pdfDataBucket1AndBucket2Parts;
+    return {
+        attacks: PdfGenerators.generateAttacks(attacks, characterLevel, weaponSpellDamageGroups, abilityLookup, ruleData, proficiencyBonus),
+        basicActions: PdfGenerators.generateBasicActions(ruleData),
+        creatures: creatures.map((creature) => PdfGenerators.generateCreature(creature, ruleData)),
+        customSkills: customSkills.map((skill) => PdfGenerators.generateSkill(skill, ruleData)),
+        level: characterLevel,
+        skills: skills.map((skill) => PdfGenerators.generateSkill(skill, ruleData)),
+        spells: PdfGenerators.generateSpells(classSpells, characterSpells, abilityLookup, ruleData, proficiencyBonus),
+        spellSlots: PdfGenerators.generateSpellSlots(spellSlots, pactMagicSlots, ruleData),
+    };
+}
+/**
+ *
+ * @param activatables
+ * @param classes
+ * @param race
+ * @param feats
+ * @param bonusSavingThrowModifiers
+ * @param advantageSavingThrowModifiers
+ * @param disadvantageSavingThrowModifiers
+ * @param items
+ * @param customItems
+ * @param snippetData
+ * @param abilityLookup
+ * @param ruleData
+ */
+export function generatePdfDataBucket2(activatables, classes, race, feats, bonusSavingThrowModifiers, advantageSavingThrowModifiers, disadvantageSavingThrowModifiers, items, customItems, snippetData, hack__pdfDataBucket1AndBucket2Parts) {
+    const { abilityLookup, ruleData, proficiencyBonus } = hack__pdfDataBucket1AndBucket2Parts;
+    return {
+        actions: PdfGenerators.generateActionGroups(activatables, snippetData, abilityLookup, ruleData, proficiencyBonus),
+        attunedItems: PdfGenerators.generateAttunedItems(items),
+        classes: classes.map((charClass) => PdfGenerators.generateClass(charClass)),
+        classFeatures: classes.map((charClass) => PdfGenerators.generateClassFeatureClass(charClass, snippetData, abilityLookup, ruleData, proficiencyBonus)),
+        feats: feats.map((feat) => PdfGenerators.generateFeat(feat, snippetData, abilityLookup, ruleData, proficiencyBonus)),
+        items: PdfGenerators.generateItems(items, customItems),
+        race: PdfGenerators.generateRace(race),
+        racialTraits: PdfGenerators.generateRacialTraits(race, snippetData, abilityLookup, ruleData, proficiencyBonus),
+        savingThrowSummaries: PdfGenerators.generateSavingThrowSummaries(bonusSavingThrowModifiers, advantageSavingThrowModifiers, disadvantageSavingThrowModifiers),
+    };
+}
+/**
+ *
+ * @param resistances
+ * @param immunities
+ * @param vulnerabilities
+ * @param hitPointInfo
+ * @param classSpellLists
+ * @param classSpellInfoLookup
+ * @param background
+ * @param proficiencyGroups
+ * @param proficiencyModifiers
+ * @param passivePerception
+ * @param passiveInsight
+ * @param passiveInvestigation
+ */
+export function generatePdfDataBucket3(resistances, immunities, vulnerabilities, hitPointInfo, classSpellLists, classSpellInfoLookup, background, proficiencyGroups, proficiencyModifiers, passivePerception, passiveInsight, passiveInvestigation) {
+    return {
+        background: PdfGenerators.generateBackground(background),
+        defenses: PdfGenerators.generateDefenses(resistances, immunities, vulnerabilities),
+        hitDice: PdfGenerators.generateHitDice(hitPointInfo),
+        hitPointMax: hitPointInfo.totalHp,
+        passivePerception,
+        passiveInsight,
+        passiveInvestigation,
+        proficiencies: PdfGenerators.generateProficiencies(proficiencyModifiers),
+        proficiencyGroups: PdfGenerators.generateProficiencyGroups(proficiencyGroups),
+        spellcastingInfo: PdfGenerators.generateSpellcastingInfo(classSpellLists, classSpellInfoLookup),
+    };
+}
+/**
+ *
+ * @param abilities
+ * @param currentXp
+ * @param carryCapacity
+ * @param encumberedWeight
+ * @param pushDragLiftWeight
+ * @param totalWeight
+ * @param armorClass
+ * @param initiative
+ * @param speeds
+ * @param senseInfo
+ * @param ruleData
+ * @param preferences
+ */
+export function generatePdfDataBucket4(abilities, currentXp, carryCapacity, encumberedWeight, pushDragLiftWeight, totalWeight, armorClass, initiative, speeds, senseInfo, ruleData, preferences) {
+    return {
+        armorClass,
+        encumberedWeight: PdfGenerators.generateEncumberedWeightInfo(carryCapacity, encumberedWeight, preferences),
+        initiative,
+        pushDragLiftWeight: PdfGenerators.generatePushDragLiftWeight(pushDragLiftWeight, preferences),
+        senses: PdfGenerators.generateSenses(senseInfo, ruleData),
+        speeds,
+        stats: abilities.map((ability) => PdfGenerators.generateAbility(ability, preferences)),
+        totalWeight,
+        xp: PdfGenerators.generateXp(currentXp, preferences),
+    };
+}
+/**
+ *
+ * @param age
+ * @param height
+ * @param weight
+ * @param eyes
+ * @param skin
+ * @param hair
+ * @param size
+ * @param faith
+ * @param gender
+ * @param alignment
+ */
+export function generatePdfDataBucket5(age, height, weight, eyes, skin, hair, size, faith, gender, alignment) {
+    return {
+        characteristics: {
+            age,
+            height,
+            weight,
+            eyes,
+            skin,
+            hair,
+            size: PdfGenerators.generateSize(size),
+            faith,
+            gender,
+            alignment: PdfGenerators.generateAlignment(alignment),
+        },
+    };
+}
+/**
+ *
+ * @param currencies
+ * @param languages
+ * @param name
+ * @param notes
+ * @param proficiencyBonus
+ * @param traits
+ */
+export function generatePdfDataBucket6(currencies, languages, name, notes, proficiencyBonus, traits) {
+    return {
+        currencies,
+        languages,
+        name,
+        notes,
+        proficiencyBonus,
+        traits,
+    };
+}
+/**
+ *
+ * @param pdfDataBucket1
+ * @param pdfDataBucket2
+ * @param pdfDataBucket3
+ * @param pdfDataBucket4
+ * @param pdfDataBucket5
+ * @param pdfDataBucket6
+ */
+export function generatePdfData(pdfDataBucket1, pdfDataBucket2, pdfDataBucket3, pdfDataBucket4, pdfDataBucket5, pdfDataBucket6) {
+    return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, pdfDataBucket1), pdfDataBucket2), pdfDataBucket3), pdfDataBucket4), pdfDataBucket5), pdfDataBucket6);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Pdf/hacks.js b/ddb_main/packages/rules-engine/es/engine/Pdf/hacks.js
new file mode 100644
index 0000000..90b638d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Pdf/hacks.js
@@ -0,0 +1,13 @@
+/**
+ *
+ * @param ruleData
+ * @param abilityLookup
+ * @param proficiencyBonus
+ */
+export function hack__generatePdfDataBucket1AndBucket2Parts(ruleData, abilityLookup, proficiencyBonus) {
+    return {
+        ruleData,
+        abilityLookup,
+        proficiencyBonus,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Pdf/index.js b/ddb_main/packages/rules-engine/es/engine/Pdf/index.js
new file mode 100644
index 0000000..818cfbc
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Pdf/index.js
@@ -0,0 +1,6 @@
+import * as PdfGenerators from './generators';
+import * as PdfHacks from './hacks';
+import * as PdfTypings from './typings';
+export * from './typings';
+export { PdfGenerators, PdfHacks };
+export default Object.assign(Object.assign(Object.assign({}, PdfGenerators), PdfTypings), PdfHacks);
diff --git a/ddb_main/packages/rules-engine/es/engine/Prerequisite/accessors.js b/ddb_main/packages/rules-engine/es/engine/Prerequisite/accessors.js
new file mode 100644
index 0000000..4ba7c96
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Prerequisite/accessors.js
@@ -0,0 +1,87 @@
+/**
+ *
+ * @param prerequisite
+ */
+export function getType(prerequisite) {
+    return prerequisite.type;
+}
+/**
+ *
+ * @param prerequisite
+ */
+export function getValue(prerequisite) {
+    return prerequisite.value;
+}
+/**
+ *
+ * @param prerequisite
+ */
+export function getEntityId(prerequisite) {
+    return prerequisite.entityId;
+}
+/**
+ *
+ * @param prerequisite
+ */
+export function getEntityTypeId(prerequisite) {
+    return prerequisite.entityTypeId;
+}
+/**
+ *
+ * @param prerequisite
+ */
+export function getEntityKey(prerequisite) {
+    return `${getEntityId(prerequisite)}-${getEntityTypeId(prerequisite)}`;
+}
+/**
+ *
+ * @param prerequisite
+ */
+export function getFriendlySubtypeName(prerequisite) {
+    return prerequisite.friendlySubTypeName;
+}
+/**
+ *
+ * @param prerequisite
+ */
+export function getFriendlyTypeName(prerequisite) {
+    return prerequisite.friendlyTypeName;
+}
+/**
+ *
+ * @param prerequisiteGroup
+ */
+export function getPrerequisites(prerequisiteGroup) {
+    var _a;
+    return (_a = prerequisiteGroup.prerequisiteMappings) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param prerequisiteGroup
+ */
+export function getGroupDescription(prerequisiteGroup) {
+    return prerequisiteGroup.description;
+}
+/**
+ *
+ * @param prerequisiteGrouping
+ */
+export function getDescription(prerequisiteGrouping) {
+    return prerequisiteGrouping
+        .filter((prerequisiteGroup) => !getHidePrerequisite(prerequisiteGroup))
+        .map((prerequisiteGroup) => getGroupDescription(prerequisiteGroup))
+        .join(' ');
+}
+/**
+ *
+ * @param prerequisite
+ */
+export function getSubType(prerequisite) {
+    return prerequisite.subType;
+}
+/**
+ * @param prerequisite
+ */
+export function getHidePrerequisite(prerequisite) {
+    return prerequisite.hidePrerequisite;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Prerequisite/constants.js b/ddb_main/packages/rules-engine/es/engine/Prerequisite/constants.js
new file mode 100644
index 0000000..edefceb
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Prerequisite/constants.js
@@ -0,0 +1,17 @@
+export var PrerequisiteTypeEnum;
+(function (PrerequisiteTypeEnum) {
+    PrerequisiteTypeEnum["ABILITY_SCORE"] = "ability-score";
+    PrerequisiteTypeEnum["CUSTOM_VALUE"] = "custom-value";
+    PrerequisiteTypeEnum["PROFICIENCY"] = "proficiency";
+    PrerequisiteTypeEnum["SPECIES"] = "species";
+    PrerequisiteTypeEnum["SIZE"] = "size";
+    PrerequisiteTypeEnum["SPECIES_OPTION"] = "species-option";
+    PrerequisiteTypeEnum["LEVEL"] = "level";
+    PrerequisiteTypeEnum["CLASS"] = "class";
+    PrerequisiteTypeEnum["FEAT"] = "feat";
+    PrerequisiteTypeEnum["CLASS_FEATURE"] = "class-feature";
+})(PrerequisiteTypeEnum || (PrerequisiteTypeEnum = {}));
+export var PrerequisiteSubTypeEnum;
+(function (PrerequisiteSubTypeEnum) {
+    PrerequisiteSubTypeEnum["CHARACTER_LEVEL"] = "character-level";
+})(PrerequisiteSubTypeEnum || (PrerequisiteSubTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Prerequisite/generators.js b/ddb_main/packages/rules-engine/es/engine/Prerequisite/generators.js
new file mode 100644
index 0000000..639b6e4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Prerequisite/generators.js
@@ -0,0 +1,11 @@
+export function generatePrerequisiteData(race, proficiencyLookup, abilityLookup, characterLevel, baseClassLookup, featLookup, classFeatureLookup) {
+    return {
+        race,
+        proficiencyLookup,
+        abilityLookup,
+        characterLevel,
+        baseClassLookup,
+        featLookup,
+        classFeatureLookup,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Prerequisite/index.js b/ddb_main/packages/rules-engine/es/engine/Prerequisite/index.js
new file mode 100644
index 0000000..3681238
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Prerequisite/index.js
@@ -0,0 +1,10 @@
+import * as PrerequisiteAccessors from './accessors';
+import * as PrerequisiteConstants from './constants';
+import * as PrerequisiteGenerators from './generators';
+import * as PrerequisiteTypings from './typings';
+import * as PrerequisiteUtils from './utils';
+import * as PrerequisiteValidators from './validators';
+export * from './constants';
+export * from './typings';
+export { PrerequisiteAccessors, PrerequisiteGenerators, PrerequisiteUtils, PrerequisiteValidators };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, PrerequisiteAccessors), PrerequisiteConstants), PrerequisiteGenerators), PrerequisiteTypings), PrerequisiteUtils), PrerequisiteValidators);
diff --git a/ddb_main/packages/rules-engine/es/engine/Prerequisite/utils.js b/ddb_main/packages/rules-engine/es/engine/Prerequisite/utils.js
new file mode 100644
index 0000000..c769fef
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Prerequisite/utils.js
@@ -0,0 +1,211 @@
+import { AbilityAccessors } from '../Ability';
+import { FormatUtils } from '../Format';
+import { getEntityId, getFriendlySubtypeName, getPrerequisites, getSubType, getType, getValue } from './accessors';
+import { PrerequisiteSubTypeEnum, PrerequisiteTypeEnum } from './constants';
+import { validatePrerequisite } from './validators';
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function getPrerequisiteFailure(prerequisite, prerequisiteData) {
+    switch (getType(prerequisite)) {
+        case PrerequisiteTypeEnum.ABILITY_SCORE:
+            return getPrerequisiteFailureAbilityScore(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.PROFICIENCY:
+            return getPrerequisiteFailureProficiency(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.SPECIES:
+            return getPrerequisiteFailureRace(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.SIZE:
+            return getPrerequisiteFailureSize(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.SPECIES_OPTION:
+            return getPrerequisiteFailureSubrace(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.LEVEL:
+            return getPrerequisiteFailureLevel(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.CLASS:
+            return getPrerequisiteFailureClass(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.FEAT:
+            return getPrerequisiteFailureFeat(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.CLASS_FEATURE:
+            return getPrerequisiteFailureClassFeature(prerequisite);
+        case PrerequisiteTypeEnum.CUSTOM_VALUE:
+        default:
+        // not defined
+    }
+    return null;
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function getPrerequisiteFailureLevel(prerequisite, prerequisiteData) {
+    let requiredDescription = '';
+    switch (getSubType(prerequisite)) {
+        case PrerequisiteSubTypeEnum.CHARACTER_LEVEL:
+            let value = getValue(prerequisite);
+            value = value ? value : 1;
+            requiredDescription = `${FormatUtils.ordinalize(value)} Level`;
+            break;
+        default:
+        // not implemented
+    }
+    return {
+        type: PrerequisiteTypeEnum.LEVEL,
+        data: {
+            requiredChoice: getFriendlySubtypeName(prerequisite),
+            requiredDescription,
+        },
+    };
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function getPrerequisiteFailureAbilityScore(prerequisite, prerequisiteData) {
+    let statKey = '';
+    let currentAmount = null;
+    const entityId = getEntityId(prerequisite);
+    if (entityId !== null) {
+        const ability = prerequisiteData.abilityLookup[entityId];
+        statKey = AbilityAccessors.getStatKey(ability);
+        currentAmount = AbilityAccessors.getScore(ability);
+    }
+    return {
+        type: PrerequisiteTypeEnum.ABILITY_SCORE,
+        data: {
+            statKey,
+            currentAmount,
+            requiredValue: getValue(prerequisite),
+            requiredChoice: getFriendlySubtypeName(prerequisite),
+            requiredDescription: `${getFriendlySubtypeName(prerequisite)} ${getValue(prerequisite)}+`,
+        },
+    };
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function getPrerequisiteFailureProficiency(prerequisite, prerequisiteData) {
+    return {
+        type: PrerequisiteTypeEnum.PROFICIENCY,
+        data: {
+            requiredChoice: getFriendlySubtypeName(prerequisite),
+            requiredDescription: `${getFriendlySubtypeName(prerequisite)} Proficiency`,
+        },
+    };
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function getPrerequisiteFailureRace(prerequisite, prerequisiteData) {
+    return {
+        type: PrerequisiteTypeEnum.SPECIES,
+        data: {
+            requiredChoice: getFriendlySubtypeName(prerequisite),
+            requiredDescription: getFriendlySubtypeName(prerequisite),
+        },
+    };
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function getPrerequisiteFailureSubrace(prerequisite, prerequisiteData) {
+    return {
+        type: PrerequisiteTypeEnum.SPECIES_OPTION,
+        data: {
+            requiredChoice: getFriendlySubtypeName(prerequisite),
+            requiredDescription: getFriendlySubtypeName(prerequisite),
+        },
+    };
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function getPrerequisiteFailureSize(prerequisite, prerequisiteData) {
+    return {
+        type: PrerequisiteTypeEnum.SIZE,
+        data: {
+            requiredChoice: getFriendlySubtypeName(prerequisite),
+            requiredDescription: `${getFriendlySubtypeName(prerequisite)} Size`,
+        },
+    };
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function getPrerequisiteFailureClass(prerequisite, prerequisiteData) {
+    return {
+        type: PrerequisiteTypeEnum.CLASS,
+        data: {
+            requiredChoice: getFriendlySubtypeName(prerequisite),
+            requiredDescription: `${getFriendlySubtypeName(prerequisite)}`,
+        },
+    };
+}
+export const getPrerequisiteFailureClassFeature = (prerequisite) => ({
+    type: PrerequisiteTypeEnum.CLASS_FEATURE,
+    data: {
+        requiredChoice: prerequisite.friendlySubTypeName,
+        requiredDescription: prerequisite.friendlySubTypeName,
+    },
+});
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function getPrerequisiteFailureFeat(prerequisite, prerequisiteData) {
+    return {
+        type: PrerequisiteTypeEnum.FEAT,
+        data: {
+            requiredChoice: getFriendlySubtypeName(prerequisite),
+            requiredDescription: `${getFriendlySubtypeName(prerequisite)}`,
+        },
+    };
+}
+/**
+ *
+ * @param prerequisiteGrouping
+ * @param prerequisiteData
+ */
+export function getPrerequisiteGroupingFailures(prerequisiteGrouping, prerequisiteData) {
+    const groupingFailures = [];
+    if (prerequisiteGrouping !== null) {
+        prerequisiteGrouping.forEach((prerequisiteGroup) => {
+            const groupFailures = [];
+            const prerequisites = getPrerequisites(prerequisiteGroup);
+            prerequisites.forEach((prerequisite) => {
+                if (!validatePrerequisite(prerequisite, prerequisiteData)) {
+                    const prereqFailure = getPrerequisiteFailure(prerequisite, prerequisiteData);
+                    if (prereqFailure) {
+                        groupFailures.push(prereqFailure);
+                    }
+                }
+            });
+            groupingFailures.push(groupFailures);
+        });
+    }
+    return groupingFailures.filter((group) => group.length);
+}
+/**
+ * Get all prerequisites of a specific type
+ * @param type
+ * @param prereqGroups
+ */
+export function getPrereqsByType(type, prereqGroups) {
+    return prereqGroups.reduce((acc, prereq) => {
+        const featMappings = getPrerequisites(prereq).filter((mapping) => getType(mapping) === type);
+        return acc.concat(featMappings);
+    }, []);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Prerequisite/validators.js b/ddb_main/packages/rules-engine/es/engine/Prerequisite/validators.js
new file mode 100644
index 0000000..6385815
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Prerequisite/validators.js
@@ -0,0 +1,210 @@
+import { AbilityAccessors } from '../Ability';
+import { ClassAccessors } from '../Class';
+import { HelperUtils } from '../Helper';
+import { RaceAccessors } from '../Race';
+import { getEntityId, getEntityKey, getEntityTypeId, getPrerequisites, getSubType, getType, getValue, } from './accessors';
+import { PrerequisiteSubTypeEnum, PrerequisiteTypeEnum } from './constants';
+import { getPrereqsByType } from './utils';
+/**
+ *
+ * @param prerequisiteGrouping
+ * @param prerequisiteData
+ */
+export function validatePrerequisiteGrouping(prerequisiteGrouping, prerequisiteData) {
+    if (prerequisiteGrouping === null) {
+        return true;
+    }
+    let isValid = !prerequisiteGrouping.length;
+    prerequisiteGrouping.forEach((prerequisiteGroup) => {
+        if (isValid) {
+            return;
+        }
+        let meetsGroupPrereqs = true;
+        const prerequisites = getPrerequisites(prerequisiteGroup);
+        prerequisites.forEach((prerequisite) => {
+            if (!meetsGroupPrereqs) {
+                return;
+            }
+            meetsGroupPrereqs = validatePrerequisite(prerequisite, prerequisiteData);
+        });
+        isValid = isValid || meetsGroupPrereqs;
+    });
+    return isValid;
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function validatePrerequisite(prerequisite, prerequisiteData) {
+    switch (getType(prerequisite)) {
+        case PrerequisiteTypeEnum.ABILITY_SCORE:
+            return validatePrerequisiteAbilityScore(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.PROFICIENCY:
+            return validatePrerequisiteProficiency(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.SPECIES:
+            return validatePrerequisiteRace(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.SPECIES_OPTION:
+            return validatePrerequisiteSubrace(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.SIZE:
+            return validatePrerequisiteSize(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.LEVEL:
+            return validatePrerequisiteLevel(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.CLASS:
+            return validatePrerequisiteClass(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.FEAT:
+            return validatePrerequisiteFeat(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.CLASS_FEATURE:
+            return validatePrerequisiteClassFeature(prerequisite, prerequisiteData);
+        case PrerequisiteTypeEnum.CUSTOM_VALUE:
+        default:
+        // not defined
+    }
+    return true;
+}
+export function validatePrerequisiteClassFeature(prerequisite, prerequisiteData) {
+    if (!prerequisite.entityId)
+        return true;
+    return Object.prototype.hasOwnProperty.call(prerequisiteData.classFeatureLookup, prerequisite.entityId);
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function validatePrerequisiteLevel(prerequisite, prerequisiteData) {
+    switch (getSubType(prerequisite)) {
+        case PrerequisiteSubTypeEnum.CHARACTER_LEVEL:
+            const value = getValue(prerequisite);
+            return prerequisiteData.characterLevel >= (value ? value : 0);
+        default:
+        // not implemented
+    }
+    return true;
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function validatePrerequisiteAbilityScore(prerequisite, prerequisiteData) {
+    const entityId = getEntityId(prerequisite);
+    if (entityId === null) {
+        return true;
+    }
+    const ability = prerequisiteData.abilityLookup[entityId];
+    const abilityScore = AbilityAccessors.getScore(ability);
+    if (abilityScore === null) {
+        return true;
+    }
+    const value = getValue(prerequisite);
+    if (value === null) {
+        return true;
+    }
+    return abilityScore >= value;
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function validatePrerequisiteProficiency(prerequisite, prerequisiteData) {
+    return prerequisiteData.proficiencyLookup.hasOwnProperty(getEntityKey(prerequisite));
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function validatePrerequisiteRace(prerequisite, prerequisiteData) {
+    if (!prerequisiteData.race) {
+        return true;
+    }
+    // check if race is a base race
+    if (RaceAccessors.getBaseRaceId(prerequisiteData.race) === getEntityId(prerequisite) &&
+        RaceAccessors.getBaseRaceTypeId(prerequisiteData.race) === getEntityTypeId(prerequisite)) {
+        return true;
+    }
+    // check if race is specific race
+    return validatePrerequisiteEntityRace(prerequisite, prerequisiteData);
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function validatePrerequisiteSubrace(prerequisite, prerequisiteData) {
+    if (!prerequisiteData.race) {
+        return true;
+    }
+    // check if race is specific race
+    return validatePrerequisiteEntityRace(prerequisite, prerequisiteData);
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+function validatePrerequisiteEntityRace(prerequisite, prerequisiteData) {
+    if (!prerequisiteData.race) {
+        return true;
+    }
+    return (RaceAccessors.getEntityRaceId(prerequisiteData.race) === getEntityId(prerequisite) &&
+        RaceAccessors.getEntityRaceTypeId(prerequisiteData.race) === getEntityTypeId(prerequisite));
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function validatePrerequisiteSize(prerequisite, prerequisiteData) {
+    if (!prerequisiteData.race) {
+        return true;
+    }
+    const sizeInfo = RaceAccessors.getSizeInfo(prerequisiteData.race);
+    if (!sizeInfo) {
+        return true;
+    }
+    return sizeInfo.id === getEntityId(prerequisite) && sizeInfo.entityTypeId === getEntityTypeId(prerequisite);
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function validatePrerequisiteClass(prerequisite, prerequisiteData) {
+    const entityId = getEntityId(prerequisite);
+    if (entityId === null) {
+        return true;
+    }
+    return Object.values(prerequisiteData.baseClassLookup).some((charClass) => ClassAccessors.getId(charClass) === entityId);
+}
+/**
+ * @param prerequisiteGrouping
+ * @param prerequisiteData
+ */
+export function validatePrerequisiteGroupingFeat(prerequisiteGrouping, prerequisiteData) {
+    if (prerequisiteGrouping === null) {
+        return true;
+    }
+    const mappings = getPrereqsByType(PrerequisiteTypeEnum.FEAT, prerequisiteGrouping);
+    let isValid = true;
+    mappings.forEach((prerequisite) => {
+        if (!validatePrerequisiteFeat(prerequisite, prerequisiteData)) {
+            isValid = false;
+        }
+    });
+    return isValid;
+}
+/**
+ *
+ * @param prerequisite
+ * @param prerequisiteData
+ */
+export function validatePrerequisiteFeat(prerequisite, prerequisiteData) {
+    const entityId = getEntityId(prerequisite);
+    if (entityId === null) {
+        return true;
+    }
+    return !!HelperUtils.lookupDataOrFallback(prerequisiteData.featLookup, entityId);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Race/accessors.js b/ddb_main/packages/rules-engine/es/engine/Race/accessors.js
new file mode 100644
index 0000000..cb5b82c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Race/accessors.js
@@ -0,0 +1,253 @@
+import { DefinitionGenerators } from '../Definition';
+/**
+ *
+ * @param race
+ */
+export function getAvatarUrl(race) {
+    return race.avatarUrl;
+}
+/**
+ *
+ * @param race
+ */
+export function getLargeAvatarUrl(race) {
+    return race.largeAvatarUrl;
+}
+/**
+ *
+ * @param race
+ */
+export function getPortraitAvatarUrl(race) {
+    return race.portraitAvatarUrl;
+}
+/**
+ *
+ * @param race
+ */
+export function getMoreDetailsUrl(race) {
+    return race.moreDetailsUrl;
+}
+/**
+ *
+ * @param race
+ */
+export function getBaseName(race) {
+    return race.baseName;
+}
+/**
+ *
+ * @param race
+ */
+export function getBaseRaceId(race) {
+    return race.baseRaceId;
+}
+/**
+ *
+ * @param race
+ */
+export function getBaseRaceName(race) {
+    return race.baseRaceName;
+}
+/**
+ *
+ * @param race
+ */
+export function getBaseRaceTypeId(race) {
+    return race.baseRaceTypeId;
+}
+/**
+ *
+ * @param race
+ */
+export function getDescription(race) {
+    return race.description;
+}
+/**
+ *
+ * @param race
+ */
+export function getEntityRaceId(race) {
+    return race.entityRaceId;
+}
+/**
+ *
+ * @param race
+ */
+export function getEntityRaceTypeId(race) {
+    return race.entityRaceTypeId;
+}
+/**
+ *
+ * @param race
+ */
+export function getFeatIds(race) {
+    var _a;
+    return (_a = race.featIds) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param race
+ */
+export function getFullName(race) {
+    return race.fullName;
+}
+/**
+ *
+ * @param race
+ */
+export function getGroupIds(race) {
+    var _a;
+    return (_a = race.groupIds) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param race
+ */
+export function getIsHomebrew(race) {
+    return race.isHomebrew;
+}
+/**
+ *
+ * @param race
+ */
+export function getIsSubRace(race) {
+    return race.isSubRace;
+}
+/**
+ *
+ * @param race
+ */
+export function getSizeInfo(race) {
+    return race.sizeInfo;
+}
+/**
+ *
+ * @param race
+ */
+export function getSize(race) {
+    return race.size;
+}
+/**
+ *
+ * @param race
+ */
+export function getSizeId(race) {
+    return race.sizeId;
+}
+/**
+ *
+ * @param race
+ */
+export function getSubRaceShortName(race) {
+    return race.subRaceShortName;
+}
+/**
+ *
+ * @param race
+ */
+export function getDefinitionRacialTraits(race) {
+    var _a;
+    return (_a = race.racialTraits) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param race
+ */
+export function getType(race) {
+    return race.type;
+}
+/**
+ *
+ * @param race
+ */
+export function getVisibleRacialTraits(race) {
+    return race.visibleRacialTraits;
+}
+/**
+ *
+ * @param race
+ */
+export function getWeightSpeeds(race) {
+    return race.weightSpeeds;
+}
+/**
+ *
+ * @param race
+ */
+export function getRacialTraits(race) {
+    return race.racialTraits;
+}
+/**
+ *
+ * @param race
+ */
+export function getFeats(race) {
+    return race.feats;
+}
+/**
+ *
+ * @param race
+ */
+export function getModifiers(race) {
+    return race.modifiers;
+}
+/**
+ *
+ * @param race
+ */
+export function getActions(race) {
+    return race.actions;
+}
+/**
+ *
+ * @param race
+ */
+export function getSpells(race) {
+    return race.spells;
+}
+/**
+ *
+ * @param race
+ */
+export function getDefinitionSources(race) {
+    var _a;
+    return (_a = race.sources) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param race
+ */
+export function getSources(race) {
+    return getDefinitionSources(race);
+}
+/**
+ * This will be replaced once we have definitionKey on the entity, so no need to derive it
+ * @param race
+ */
+export function getDefinitionKey(race) {
+    return DefinitionGenerators.generateDefinitionKey(getEntityRaceTypeId(race).toString(), getEntityRaceId(race).toString());
+}
+/**
+ *
+ * @param race
+ */
+export function getSpellListIds(race) {
+    return race.spellListIds;
+}
+/**
+ *
+ * @param race
+ */
+export function getOptionalOrigins(race) {
+    return race.optionalOrigins;
+}
+/**
+ *
+ * @param race
+ */
+export function getCalledOutRacialTraits(race) {
+    return race.calledOutRacialTraits;
+}
+export function getIsLegacy(race) {
+    return race.isLegacy;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Race/constants.js b/ddb_main/packages/rules-engine/es/engine/Race/constants.js
new file mode 100644
index 0000000..8d79536
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Race/constants.js
@@ -0,0 +1,6 @@
+export var RaceTypeEnum;
+(function (RaceTypeEnum) {
+    RaceTypeEnum[RaceTypeEnum["BASE_RACE"] = 1] = "BASE_RACE";
+    RaceTypeEnum[RaceTypeEnum["SUB_RACE"] = 2] = "SUB_RACE";
+    RaceTypeEnum[RaceTypeEnum["VARIANT"] = 3] = "VARIANT";
+})(RaceTypeEnum || (RaceTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Race/derivers.js b/ddb_main/packages/rules-engine/es/engine/Race/derivers.js
new file mode 100644
index 0000000..39670fc
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Race/derivers.js
@@ -0,0 +1,212 @@
+import { groupBy, orderBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { CreatureSizeEnum, CreatureSizeNameEnum, FeatureTypeEnum } from '../Core';
+import { FormatUtils } from '../Format';
+import { HelperUtils } from '../Helper';
+import { ModifierAccessors, ModifierSubTypeEnum, ModifierValidators, STAT_ABILITY_SCORE_LIST, } from '../Modifier';
+import { OptionalOriginAccessors } from '../OptionalOrigin';
+import { RacialTraitAccessors, RacialTraitDerivers, RacialTraitValidators } from '../RacialTrait';
+import { RuleDataUtils } from '../RuleData';
+import { getDefinitionRacialTraits } from './accessors';
+import { hack__deriveRaceSize } from './hacks';
+/**
+ * has mirrored deriver ClassDerivers.deriveConsolidatedClassFeatures
+ *   - most likely update together
+ *
+ * @param race
+ * @param optionalOrigins
+ * @param enableOptionalOrigins
+ */
+export function deriveConsolidatedRacialTraits(race, optionalOrigins, enableOptionalOrigins) {
+    //filtering because after generating Race, this function is used in getUpdateEnableOptionalOriginsSpellListIdsToRemove
+    //      to determine updated look of race and we don't store original definition info for race
+    const originalDefinitionRacialTraits = getDefinitionRacialTraits(race).filter((trait) => RacialTraitAccessors.getFeatureType(trait) === FeatureTypeEnum.GRANTED);
+    if (!enableOptionalOrigins) {
+        return originalDefinitionRacialTraits;
+    }
+    const additionalRacialTraits = [];
+    const definitionKeysToRemove = new Set();
+    optionalOrigins.forEach((optionalOrigin) => {
+        const racialTrait = OptionalOriginAccessors.getRacialTrait(optionalOrigin);
+        if (racialTrait === null) {
+            return;
+        }
+        const featureType = RacialTraitAccessors.getFeatureType(racialTrait);
+        switch (featureType) {
+            case FeatureTypeEnum.REPLACEMENT: {
+                const affectedDefinitionKey = OptionalOriginAccessors.getAffectedRacialTraitDefinitionKey(optionalOrigin);
+                const affectedFeatureKeys = RacialTraitAccessors.getAffectedFeatureDefinitionKeys(racialTrait);
+                //verify this is a valid replacement
+                if (affectedDefinitionKey &&
+                    affectedFeatureKeys.includes(affectedDefinitionKey) &&
+                    RacialTraitValidators.isValidRaceRacialTrait(race, racialTrait)) {
+                    definitionKeysToRemove.add(affectedDefinitionKey);
+                    additionalRacialTraits.push(racialTrait);
+                }
+                break;
+            }
+            case FeatureTypeEnum.ADDITIONAL:
+            case FeatureTypeEnum.GRANTED:
+            default:
+                if (RacialTraitValidators.isValidRaceRacialTrait(race, racialTrait)) {
+                    additionalRacialTraits.push(racialTrait);
+                }
+                break;
+        }
+    });
+    //remove definitionKeysToRemove
+    const filteredDefinitionRacialTraits = originalDefinitionRacialTraits.filter((trait) => !definitionKeysToRemove.has(RacialTraitAccessors.getDefinitionKey(trait)));
+    return [...filteredDefinitionRacialTraits, ...additionalRacialTraits];
+}
+/**
+ *
+ * @param racialTraits
+ * @param appContext
+ */
+export function deriveVisibleRacialTraits(racialTraits, appContext) {
+    return racialTraits.filter((racialTrait) => !RacialTraitDerivers.deriveHideInContext(racialTrait, appContext));
+}
+/**
+ *
+ * @param racialTraits
+ */
+export function deriveOrderedRacialTraits(racialTraits) {
+    return orderBy(racialTraits, [
+        (racialTrait) => RacialTraitAccessors.getDisplayOrder(racialTrait),
+        (racialTrait) => RacialTraitAccessors.getName(racialTrait),
+    ]);
+}
+/**
+ *
+ * @param racialTraits
+ * @param ruleData
+ */
+export function deriveCalledOutRacialTraits(racialTraits, ruleData) {
+    const filteredTraits = racialTraits.filter((trait) => RacialTraitAccessors.isCalledOut(trait));
+    const orderedTraits = deriveOrderedRacialTraits(filteredTraits);
+    const calledOutTraitNames = [];
+    const abilityScoreIncreases = [];
+    const abilityScoreIncreasesToChoose = [];
+    const modifierLookupBySubType = {};
+    orderedTraits.forEach((trait) => {
+        const name = RacialTraitAccessors.getName(trait);
+        const modifiers = RacialTraitAccessors.getModifiers(trait);
+        if (modifiers.length) {
+            //aggregate all ability score related modifiers into a lookup
+            let abilityModifiersCount = 0;
+            modifiers.forEach((modifier) => {
+                const statId = ModifierAccessors.getEntityId(modifier);
+                if ((statId && ModifierValidators.isValidBonusStatScoreModifier(modifier, statId)) ||
+                    ModifierValidators.isValidBonusChooseAbilityScoreModifier(modifier)) {
+                    abilityModifiersCount++;
+                    const modifierSubType = ModifierAccessors.getSubType(modifier);
+                    if (!modifierSubType) {
+                        return;
+                    }
+                    if (!modifierLookupBySubType.hasOwnProperty(modifierSubType)) {
+                        modifierLookupBySubType[modifierSubType] = [];
+                    }
+                    modifierLookupBySubType[modifierSubType].push(modifier);
+                }
+            });
+            if (abilityModifiersCount === 0) {
+                calledOutTraitNames.push(name);
+            }
+        }
+        else {
+            calledOutTraitNames.push(name);
+        }
+    });
+    let hasAllAbilityStatScoreGrantedBonuses = false;
+    const modifierSubTypeStrings = Object.keys(modifierLookupBySubType);
+    const filteredSubTypeStrings = modifierSubTypeStrings.filter((subType) => subType !== ModifierSubTypeEnum.CHOOSE_AN_ABILITY_SCORE);
+    if (filteredSubTypeStrings.length === STAT_ABILITY_SCORE_LIST.length &&
+        filteredSubTypeStrings.every((subType) => STAT_ABILITY_SCORE_LIST.includes(subType))) {
+        //TODO should check all the values are the same (this is only applies to Humans right now)
+        hasAllAbilityStatScoreGrantedBonuses = true;
+        abilityScoreIncreases.push(`+1 to All Ability Scores`);
+    }
+    modifierSubTypeStrings.forEach((modifierSubType) => {
+        const modifiers = HelperUtils.lookupDataOrFallback(modifierLookupBySubType, modifierSubType);
+        if (modifiers !== null) {
+            if (modifierSubType === ModifierSubTypeEnum.CHOOSE_AN_ABILITY_SCORE) {
+                const modifiersByValueLookup = groupBy(modifiers, (modifier) => ModifierAccessors.getValue(modifier));
+                Object.keys(modifiersByValueLookup).forEach((value) => {
+                    const lookupModifiers = HelperUtils.lookupDataOrFallback(modifiersByValueLookup, value);
+                    if (lookupModifiers !== null) {
+                        const numberOfModifiers = lookupModifiers.length;
+                        abilityScoreIncreasesToChoose.push(`+${value} to ${FormatUtils.upperCaseFirstLetterOnly(FormatUtils.convertSingleDigitIntToWord(numberOfModifiers))} Other Ability Score${numberOfModifiers > 1 ? 's' : ''}`);
+                    }
+                });
+            }
+            else if (!hasAllAbilityStatScoreGrantedBonuses) {
+                const statId = ModifierAccessors.getEntityId(modifiers[0]);
+                if (!statId) {
+                    return;
+                }
+                const modifiersValueTotal = modifiers.reduce((acc, modifier) => {
+                    const value = ModifierAccessors.getValue(modifier);
+                    if (value !== null) {
+                        acc += value;
+                    }
+                    return acc;
+                }, 0);
+                abilityScoreIncreases.push(`+${modifiersValueTotal} ${RuleDataUtils.getStatNameById(statId, ruleData, true)}`);
+            }
+        }
+    });
+    return [...abilityScoreIncreases, ...abilityScoreIncreasesToChoose, ...calledOutTraitNames];
+}
+/**
+ *
+ * @param racialTraits
+ */
+export function deriveSpellListIds(racialTraits) {
+    const spellListIds = [];
+    racialTraits.forEach((feature) => {
+        spellListIds.push(...RacialTraitAccessors.getSpellListIds(feature));
+    });
+    return spellListIds;
+}
+/**
+ *
+ * @param race
+ * @param experienceInfo
+ * @param raceModifiers
+ */
+export function deriveRaceSize(race, experienceInfo, raceModifiers) {
+    //temp hack handles specific race size for granted level size changes - need to set up logic for that
+    let [sizeId, size] = hack__deriveRaceSize(race, experienceInfo);
+    let sizeModifiersIds = raceModifiers
+        .filter(ModifierValidators.isSizeModifier)
+        .map(ModifierAccessors.getEntityId)
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    let largestSizeModifierId = sizeModifiersIds.length ? Math.max(...sizeModifiersIds) : null;
+    if (largestSizeModifierId !== null) {
+        sizeId = largestSizeModifierId;
+        size = deriveRaceSizeName(sizeId);
+    }
+    return [sizeId, size];
+}
+/**
+ *
+ * @param sizeId
+ */
+export function deriveRaceSizeName(sizeId) {
+    switch (sizeId) {
+        case CreatureSizeEnum.TINY:
+            return CreatureSizeNameEnum.TINY;
+        case CreatureSizeEnum.SMALL:
+            return CreatureSizeNameEnum.SMALL;
+        case CreatureSizeEnum.MEDIUM:
+            return CreatureSizeNameEnum.MEDIUM;
+        case CreatureSizeEnum.LARGE:
+            return CreatureSizeNameEnum.LARGE;
+        case CreatureSizeEnum.HUGE:
+            return CreatureSizeNameEnum.HUGE;
+        case CreatureSizeEnum.GARGANTUAN:
+            return CreatureSizeNameEnum.GARGANTUAN;
+        default:
+            return null;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Race/generators.js b/ddb_main/packages/rules-engine/es/engine/Race/generators.js
new file mode 100644
index 0000000..1989712
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Race/generators.js
@@ -0,0 +1,150 @@
+import { CreatureRuleGenerators } from '../CreatureRule';
+import { DataOriginDataInfoKeyEnum, DataOriginGenerators, DataOriginTypeEnum, } from '../DataOrigin';
+import { OptionAccessors } from '../Option';
+import { RacialTraitAccessors, RacialTraitGenerators } from '../RacialTrait';
+import { RuleDataUtils } from '../RuleData';
+import { getRacialTraits, getSpellListIds, getVisibleRacialTraits } from './accessors';
+import { deriveCalledOutRacialTraits, deriveConsolidatedRacialTraits, deriveOrderedRacialTraits, deriveRaceSize, deriveSpellListIds, deriveVisibleRacialTraits, } from './derivers';
+import { hack__filterOutAsi } from './hacks';
+/**
+ *
+ * @param optionLookup
+ * @param actionLookup
+ * @param choiceLookup
+ * @param modifierLookup
+ * @param spellLookup
+ * @param featLookup
+ * @param valueLookup
+ * @param spellListDataOriginLookup
+ */
+export function generateRaceLookupData(optionLookup, actionLookup, choiceLookup, modifierLookup, spellLookup, featLookup, valueLookup, spellListDataOriginLookup) {
+    return {
+        actionLookup,
+        choiceLookup,
+        featLookup,
+        modifierLookup,
+        optionLookup,
+        spellListDataOriginLookup,
+        spellLookup,
+        valueLookup,
+    };
+}
+/**
+ *
+ * @param race
+ * @param optionalOrigins
+ * @param raceLookupData
+ * @param experienceInfo
+ * @param appContext
+ * @param ruleData
+ * @param definitionPool
+ * @param characterPreferences
+ */
+export function generateRace(race, optionalOrigins, raceLookupData, experienceInfo, appContext, ruleData, definitionPool, characterPreferences, isInitialAsiFromFeat) {
+    if (!race) {
+        return race;
+    }
+    const raceModifiers = [];
+    const raceSpells = [];
+    const raceFeats = [];
+    const raceActions = [];
+    // Process racial traits:
+    // Consolidate from multiple sources, apply filtering, apply ordering,
+    // then generate the hydrated RacialTrait from the contracts.
+    const traitContracts = deriveOrderedRacialTraits(hack__filterOutAsi(deriveConsolidatedRacialTraits(race, optionalOrigins, characterPreferences.enableOptionalOrigins), isInitialAsiFromFeat));
+    const generatedRacialTraits = traitContracts.map((racialTrait) => {
+        const generatedRacialTrait = RacialTraitGenerators.generateRacialTrait(race, racialTrait, raceLookupData.optionLookup, raceLookupData.actionLookup, raceLookupData.choiceLookup, raceLookupData.modifierLookup, raceLookupData.spellLookup, raceLookupData.featLookup, raceLookupData.valueLookup, raceLookupData.spellListDataOriginLookup, ruleData, definitionPool);
+        raceModifiers.push(...RacialTraitAccessors.getModifiers(generatedRacialTrait));
+        raceSpells.push(...RacialTraitAccessors.getSpells(generatedRacialTrait));
+        raceFeats.push(...RacialTraitAccessors.getFeats(generatedRacialTrait));
+        raceActions.push(...RacialTraitAccessors.getActions(generatedRacialTrait));
+        RacialTraitAccessors.getOptions(generatedRacialTrait).forEach((option) => {
+            raceSpells.push(...OptionAccessors.getSpells(option));
+            raceFeats.push(...OptionAccessors.getFeats(option));
+            raceActions.push(...OptionAccessors.getActions(option));
+            raceModifiers.push(...OptionAccessors.getModifiers(option));
+        });
+        return generatedRacialTrait;
+    });
+    const visibleRacialTraits = deriveVisibleRacialTraits(generatedRacialTraits, appContext);
+    const [sizeId, size] = deriveRaceSize(race, experienceInfo, raceModifiers);
+    const sizeInfo = RuleDataUtils.getCreatureSizeInfo(sizeId, ruleData);
+    return Object.assign(Object.assign({}, race), { modifiers: raceModifiers, racialTraits: generatedRacialTraits, optionalOrigins,
+        visibleRacialTraits, calledOutRacialTraits: deriveCalledOutRacialTraits(generatedRacialTraits, ruleData), spells: raceSpells, feats: raceFeats, actions: raceActions, sizeInfo,
+        sizeId,
+        size, spellListIds: deriveSpellListIds(generatedRacialTraits) });
+}
+/**
+ *
+ * @param race
+ * @param xpInfo
+ * @param ruleData
+ */
+export function generateRaceCreatureRules(race, xpInfo, ruleData) {
+    const rules = [];
+    if (!race) {
+        return rules;
+    }
+    getRacialTraits(race).forEach((racialTrait) => {
+        const dataOrigin = DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.RACE, racialTrait, race);
+        const featureRules = RacialTraitAccessors.getCreatureRules(racialTrait);
+        featureRules.forEach((rule) => {
+            rules.push(CreatureRuleGenerators.generateRule(rule, dataOrigin, xpInfo, ruleData));
+        });
+        const options = RacialTraitAccessors.getOptions(racialTrait);
+        options.forEach((option) => {
+            const optionRules = OptionAccessors.getCreatureRules(option);
+            optionRules.forEach((rule) => {
+                rules.push(CreatureRuleGenerators.generateRule(rule, dataOrigin, xpInfo, ruleData));
+            });
+        });
+    });
+    return rules;
+}
+/**
+ *
+ * @param race
+ */
+export function generateRaceModifiers(race) {
+    const modifiers = [];
+    if (race === null) {
+        return modifiers;
+    }
+    getRacialTraits(race).forEach((racialTrait) => {
+        modifiers.push(...RacialTraitAccessors.getModifiers(racialTrait));
+        RacialTraitAccessors.getOptions(racialTrait).forEach((option) => {
+            modifiers.push(...OptionAccessors.getModifiers(option));
+        });
+    });
+    return modifiers;
+}
+/**
+ *
+ * @param race
+ */
+export function generateRefRaceData(race) {
+    let data = {};
+    if (race !== null) {
+        getRacialTraits(race).forEach((racialTrait) => {
+            data[RacialTraitAccessors.getUniqueKey(racialTrait)] = {
+                [DataOriginDataInfoKeyEnum.PRIMARY]: racialTrait,
+                [DataOriginDataInfoKeyEnum.PARENT]: race,
+            };
+        });
+    }
+    return data;
+}
+/**
+ *
+ * @param race
+ */
+export function generateGlobalSpellListIds(race) {
+    return race ? getSpellListIds(race) : [];
+}
+export function generateCurrentLevelRacialTraits(race, characterLevel) {
+    const traits = race ? getVisibleRacialTraits(race) : [];
+    return traits.filter((trait) => {
+        const requiredLevel = RacialTraitAccessors.getRequiredLevel(trait);
+        return characterLevel >= requiredLevel;
+    });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Race/hacks.js b/ddb_main/packages/rules-engine/es/engine/Race/hacks.js
new file mode 100644
index 0000000..1bb910d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Race/hacks.js
@@ -0,0 +1,26 @@
+import { CreatureSizeEnum, CreatureSizeNameEnum, DB_STRING_VERDAN, INITIAL_ASI_TAG_NAME, } from '../Core';
+import { RacialTraitAccessors } from '../RacialTrait';
+import { getSize, getSizeId } from './accessors';
+//temp hack handles specific race size for granted level size changes - need to set up logic for that
+/**
+ *
+ * @param race
+ * @param experienceInfo
+ */
+export function hack__deriveRaceSize(race, experienceInfo) {
+    let sizeId = getSizeId(race);
+    let size = getSize(race);
+    if (race.baseName === DB_STRING_VERDAN && experienceInfo.currentLevel >= 5 && !race.isHomebrew) {
+        sizeId = CreatureSizeEnum.MEDIUM;
+        size = CreatureSizeNameEnum.MEDIUM;
+    }
+    return [sizeId, size];
+}
+export function hack__filterOutAsi(traits, isInitialAsiFromFeat) {
+    if (!isInitialAsiFromFeat) {
+        // no changes needed if the initial ASI isn't coming from a Background Feat
+        return traits;
+    }
+    // Keep traits that aren't the initial ASI
+    return traits.filter((trait) => !RacialTraitAccessors.getCategories(trait).some((cat) => cat.tagName === INITIAL_ASI_TAG_NAME));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Race/index.js b/ddb_main/packages/rules-engine/es/engine/Race/index.js
new file mode 100644
index 0000000..c030d82
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Race/index.js
@@ -0,0 +1,12 @@
+import * as RaceAccessors from './accessors';
+import * as RaceConstants from './constants';
+import * as RaceDerivers from './derivers';
+import * as RaceGenerators from './generators';
+import * as RaceHacks from './hacks';
+import * as RaceTypings from './typings';
+import * as RaceUtils from './utils';
+import * as RaceValidators from './validators';
+export * from './constants';
+export * from './typings';
+export { RaceAccessors, RaceDerivers, RaceGenerators, RaceUtils, RaceHacks, RaceValidators };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, RaceAccessors), RaceConstants), RaceDerivers), RaceGenerators), RaceHacks), RaceTypings), RaceUtils), RaceValidators);
diff --git a/ddb_main/packages/rules-engine/es/engine/Race/utils.js b/ddb_main/packages/rules-engine/es/engine/Race/utils.js
new file mode 100644
index 0000000..a39f9d4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Race/utils.js
@@ -0,0 +1,14 @@
+import { difference } from 'lodash';
+import { getOptionalOrigins, getSpellListIds } from './accessors';
+import { deriveConsolidatedRacialTraits, deriveSpellListIds } from './derivers';
+/**
+ *
+ * @param race
+ * @param newEnableOptionalOrigins
+ */
+export function getUpdateEnableOptionalOriginsSpellListIdsToRemove(race, newEnableOptionalOrigins) {
+    const existingSpellListIds = getSpellListIds(race);
+    const newRacialTraits = deriveConsolidatedRacialTraits(race, getOptionalOrigins(race), newEnableOptionalOrigins);
+    const newSpellListIds = deriveSpellListIds(newRacialTraits);
+    return difference(existingSpellListIds, newSpellListIds);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Race/validators.js b/ddb_main/packages/rules-engine/es/engine/Race/validators.js
new file mode 100644
index 0000000..20c32c2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Race/validators.js
@@ -0,0 +1,9 @@
+import { getBaseRaceId, getEntityRaceId } from './accessors';
+/**
+ *
+ * @param race
+ * @param id
+ */
+export function isValidRaceId(race, id) {
+    return id === getBaseRaceId(race) || id === getEntityRaceId(race);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RacialTrait/accessors.js b/ddb_main/packages/rules-engine/es/engine/RacialTrait/accessors.js
new file mode 100644
index 0000000..60b627b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RacialTrait/accessors.js
@@ -0,0 +1,392 @@
+import { ActivationAccessors } from '../Activation';
+import { FeatureTypeEnum, } from '../Core';
+/**
+ *
+ * @param racialTrait
+ */
+export function getUniqueKey(racialTrait) {
+    return `${getId(racialTrait)}-${getEntityTypeId(racialTrait)}`;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinition(racialTrait) {
+    return racialTrait.definition;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionKey(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.definitionKey) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getName(racialTrait) {
+    return getDefinitionName(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionName(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getId(racialTrait) {
+    return getDefinitionId(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionId(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getEntityTypeId(racialTrait) {
+    return getDefinitionEntityTypeId(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionEntityTypeId(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.entityTypeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getEntityRaceId(racialTrait) {
+    return getDefinitionEntityRaceId(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionEntityRaceId(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.entityRaceId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getEntityRaceTypeId(racialTrait) {
+    return getDefinitionEntityRaceTypeId(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionEntityRaceTypeId(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.entityRaceTypeId) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDescription(racialTrait) {
+    return getDefinitionDescription(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionDescription(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getSourceId(racialTrait) {
+    return getDefinitionSourceId(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionSourceId(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.sourceId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getSourcePage(racialTrait) {
+    return getDefinitionSourcePage(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionSourcePage(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.sourcePageNumber) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getActivation(racialTrait) {
+    return getDefinitionActivation(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionActivation(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.activation) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getActivationTime(racialTrait) {
+    return ActivationAccessors.getTime(getActivation(racialTrait));
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getActivationType(racialTrait) {
+    return ActivationAccessors.getType(getActivation(racialTrait));
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getSnippet(racialTrait) {
+    return getDefinitionSnippet(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionSnippet(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.snippet) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDisplayOrder(racialTrait) {
+    return getDefinitionDisplayOrder(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionDisplayOrder(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.displayOrder) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getHideInBuilder(racialTrait) {
+    return getDefinitionHideInBuilder(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionHideInBuilder(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.hideInBuilder) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getHideInSheet(racialTrait) {
+    return getDefinitionHideInSheet(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionHideInSheet(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.hideInSheet) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getCreatureRules(racialTrait) {
+    return getDefinitionCreatureRules(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionCreatureRules(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.creatureRules) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionSpellListIds(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.spellListIds) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getSpellListIds(racialTrait) {
+    return getDefinitionSpellListIds(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionAffectedFeatureDefinitionKeys(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.affectedFeatureDefinitionKeys) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getAffectedFeatureDefinitionKeys(racialTrait) {
+    return getDefinitionAffectedFeatureDefinitionKeys(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getFeatureType(racialTrait) {
+    return getDefinitionFeatureType(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionFeatureType(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.featureType) !== null && _b !== void 0 ? _b : FeatureTypeEnum.GRANTED;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getSources(racialTrait) {
+    return getDefinitionSources(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionSources(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.sources) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function isCalledOut(racialTrait) {
+    return getDefinitionIsCalledOut(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getDefinitionIsCalledOut(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.isCalledOut) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getSpells(racialTrait) {
+    return racialTrait.spells;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getOptions(racialTrait) {
+    return racialTrait.options;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getActions(racialTrait) {
+    return racialTrait.actions;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getChoices(racialTrait) {
+    return racialTrait.choices;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getFeats(racialTrait) {
+    return racialTrait.feats;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getModifiers(racialTrait) {
+    return racialTrait.modifiers;
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function getAccessType(racialTrait) {
+    return racialTrait.accessType;
+}
+/**
+ *
+ * @param racialTrait
+ * @returns {Record<string, number>}
+ */
+export function getDisplayConfiguration(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = racialTrait.definition) === null || _a === void 0 ? void 0 : _a.displayConfiguration) !== null && _b !== void 0 ? _b : null;
+}
+export function getRequiredLevel(racialTrait) {
+    return getDefinitionRequiredLevel(racialTrait);
+}
+export function getDefinitionRequiredLevel(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.requiredLevel) !== null && _b !== void 0 ? _b : 0;
+}
+export function getCategories(racialTrait) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(racialTrait)) === null || _a === void 0 ? void 0 : _a.categories) !== null && _b !== void 0 ? _b : [];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RacialTrait/derivers.js b/ddb_main/packages/rules-engine/es/engine/RacialTrait/derivers.js
new file mode 100644
index 0000000..404da67
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RacialTrait/derivers.js
@@ -0,0 +1,20 @@
+import { AppContextTypeEnum } from '../Core';
+import { getHideInBuilder, getHideInSheet } from './accessors';
+/**
+ *
+ * @param racialTrait
+ * @param context
+ */
+export function deriveHideInContext(racialTrait, context) {
+    if (context !== null && context === AppContextTypeEnum.SHEET) {
+        return getHideInSheet(racialTrait);
+    }
+    return getHideInBuilder(racialTrait);
+}
+/**
+ *
+ * @param racialTrait
+ */
+export function deriveContextData(racialTrait) {
+    return {};
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RacialTrait/generators.js b/ddb_main/packages/rules-engine/es/engine/RacialTrait/generators.js
new file mode 100644
index 0000000..58efaff
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RacialTrait/generators.js
@@ -0,0 +1,58 @@
+import { ActionGenerators } from '../Action';
+import { ChoiceGenerators } from '../Choice';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { DefinitionPoolUtils } from '../DefinitionPool';
+import { FeatGenerators } from '../Feat';
+import { ModifierGenerators } from '../Modifier';
+import { OptionGenerators } from '../Option';
+import { SpellGenerators } from '../Spell';
+import { getDefinitionKey, getEntityTypeId, getId } from './accessors';
+/**
+ *
+ * @param race
+ * @param racialTrait
+ * @param optionLookup
+ * @param actionLookup
+ * @param choiceLookup
+ * @param modifierLookup
+ * @param spellLookup
+ * @param featLookup
+ * @param valueLookup
+ * @param spellListDataOriginLookup
+ * @param ruleData
+ * @param definitionPool
+ */
+export function generateRacialTrait(race, racialTrait, optionLookup, actionLookup, choiceLookup, modifierLookup, spellLookup, featLookup, valueLookup, spellListDataOriginLookup, ruleData, definitionPool) {
+    const id = getId(racialTrait);
+    const entityTypeId = getEntityTypeId(racialTrait);
+    const actions = ActionGenerators.generateBaseActions(id, entityTypeId, actionLookup, valueLookup, DataOriginTypeEnum.RACE, racialTrait, race);
+    const choices = ChoiceGenerators.generateBaseChoices(id, entityTypeId, choiceLookup, DataOriginTypeEnum.RACE, racialTrait, race);
+    const spells = SpellGenerators.generateBaseSpells(id, entityTypeId, spellLookup, DataOriginTypeEnum.RACE, racialTrait, race, ruleData, spellListDataOriginLookup, valueLookup);
+    const modifiers = ModifierGenerators.generateModifiers(id, entityTypeId, modifierLookup, DataOriginTypeEnum.RACE, racialTrait, race);
+    const feats = FeatGenerators.generateDataOriginFeats(id, entityTypeId, featLookup, DataOriginTypeEnum.RACE, racialTrait, race);
+    const options = generateRacialTraitOptions(racialTrait, race, featLookup, actionLookup, spellLookup, optionLookup, modifierLookup, valueLookup, spellListDataOriginLookup, ruleData);
+    const generatedRacialTrait = Object.assign(Object.assign({}, racialTrait), { actions,
+        choices,
+        feats,
+        modifiers,
+        spells,
+        options, accessType: DefinitionPoolUtils.getDefinitionAccessType(getDefinitionKey(racialTrait), definitionPool) });
+    return generatedRacialTrait;
+}
+/**
+ *
+ * @param racialTrait
+ * @param race
+ * @param featLookup
+ * @param actionLookup
+ * @param spellLookup
+ * @param optionLookup
+ * @param modifierLookup
+ * @param valueLookup
+ * @param spellListDataOriginLookup
+ * @param ruleData
+ */
+export function generateRacialTraitOptions(racialTrait, race, featLookup, actionLookup, spellLookup, optionLookup, modifierLookup, valueLookup, spellListDataOriginLookup, ruleData) {
+    const baseOptions = OptionGenerators.generateDataOriginBaseOptions(getId(racialTrait), getEntityTypeId(racialTrait), optionLookup, DataOriginTypeEnum.RACE, racialTrait, race);
+    return OptionGenerators.generateOptions(baseOptions, DataOriginTypeEnum.RACE, featLookup, actionLookup, spellLookup, optionLookup, modifierLookup, valueLookup, spellListDataOriginLookup, ruleData, racialTrait, race);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RacialTrait/index.js b/ddb_main/packages/rules-engine/es/engine/RacialTrait/index.js
new file mode 100644
index 0000000..e090352
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RacialTrait/index.js
@@ -0,0 +1,10 @@
+import * as RacialTraitAccessors from './accessors';
+import * as RacialTraitDerivers from './derivers';
+import * as RacialTraitGenerators from './generators';
+import * as RacialTraitSimulators from './simulators';
+import * as RacialTraitTypings from './typings';
+import * as RacialTraitUtils from './utils';
+import * as RacialTraitValidators from './validators';
+export * from './typings';
+export { RacialTraitAccessors, RacialTraitDerivers, RacialTraitGenerators, RacialTraitSimulators, RacialTraitUtils, RacialTraitValidators, };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, RacialTraitAccessors), RacialTraitDerivers), RacialTraitGenerators), RacialTraitSimulators), RacialTraitTypings), RacialTraitUtils), RacialTraitValidators);
diff --git a/ddb_main/packages/rules-engine/es/engine/RacialTrait/simulators.js b/ddb_main/packages/rules-engine/es/engine/RacialTrait/simulators.js
new file mode 100644
index 0000000..f0b15ea
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RacialTrait/simulators.js
@@ -0,0 +1,30 @@
+import { AccessTypeEnum } from '../Access';
+import { DefinitionPoolUtils } from '../DefinitionPool';
+/**
+ *
+ * @param definitionKey
+ * @param definitionPool
+ */
+export function simulateRacialTrait(definitionKey, definitionPool) {
+    const definition = DefinitionPoolUtils.getRacialTraitDefinition(definitionKey, definitionPool);
+    if (definition === null) {
+        return null;
+    }
+    const racialTraitMapping = simulateRacialTraitContract({ definition });
+    return simulateRacialTraitFromContract(racialTraitMapping, DefinitionPoolUtils.getDefinitionAccessType(definitionKey, definitionPool));
+}
+/**
+ *
+ * @param racialTraitMapping
+ * @param accessType
+ */
+export function simulateRacialTraitFromContract(racialTraitMapping, accessType) {
+    return Object.assign(Object.assign({}, racialTraitMapping), { actions: [], choices: [], feats: [], modifiers: [], options: [], spells: [], accessType: accessType !== null && accessType !== void 0 ? accessType : AccessTypeEnum.OWNED });
+}
+/**
+ *
+ * @param racialTraitProps
+ */
+export function simulateRacialTraitContract(racialTraitProps) {
+    return Object.assign({ definition: null }, racialTraitProps);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RacialTrait/utils.js b/ddb_main/packages/rules-engine/es/engine/RacialTrait/utils.js
new file mode 100644
index 0000000..faa6089
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RacialTrait/utils.js
@@ -0,0 +1,12 @@
+import { CoreUtils, DisplayConfigurationValueEnum } from '../Core';
+import { getDisplayConfiguration } from './accessors';
+export function filterRacialTraitsByDisplayConfigurationType(racialTraits, displayConfigurationTypes) {
+    return racialTraits.filter((racialTrait) => {
+        const displayConfiguration = getDisplayConfiguration(racialTrait);
+        if (!displayConfiguration) {
+            return true;
+        }
+        const displayConfigurationValues = displayConfigurationTypes.map((displayConfigurationType) => CoreUtils.getDisplayConfigurationValue(displayConfigurationType, displayConfiguration));
+        return displayConfigurationValues.some((displayConfigurationValue) => displayConfigurationValue === DisplayConfigurationValueEnum.ON);
+    });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RacialTrait/validators.js b/ddb_main/packages/rules-engine/es/engine/RacialTrait/validators.js
new file mode 100644
index 0000000..2c1a8fc
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RacialTrait/validators.js
@@ -0,0 +1,10 @@
+import { RaceValidators } from '../Race';
+import { getEntityRaceId } from './accessors';
+/**
+ *
+ * @param race
+ * @param racialTrait
+ */
+export function isValidRaceRacialTrait(race, racialTrait) {
+    return RaceValidators.isValidRaceId(race, getEntityRaceId(racialTrait));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RuleData/accessors.js b/ddb_main/packages/rules-engine/es/engine/RuleData/accessors.js
new file mode 100644
index 0000000..56fc19f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RuleData/accessors.js
@@ -0,0 +1,1073 @@
+/**
+ *
+ * @param ruleData
+ */
+export function getAbilityScoreDisplayTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.abilityScoreDisplayTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAbilitySkills(ruleData) {
+    var _a;
+    return (_a = ruleData.abilitySkills) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getActivationTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.activationTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAdditionalLevelTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.additionalLevelTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAdjustmentDataTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.adjustmentDataTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAdjustmentTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.adjustmentTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAlignments(ruleData) {
+    var _a;
+    return (_a = ruleData.alignments) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAoeTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.aoeTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getArmor(ruleData) {
+    var _a;
+    return (_a = ruleData.armor) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getArmorTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.armorTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getBaseWeaponReach(ruleData) {
+    return ruleData.baseWeaponReach;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getBasicActions(ruleData) {
+    var _a;
+    return (_a = ruleData.basicActions) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getBasicMaxStatScore(ruleData) {
+    return ruleData.basicMaxStatScore;
+}
+/**
+ *
+ * @param ruleData
+ * @returns {Array<BuilderHelperTextInfoContract>}
+ */
+export function getBuilderHelperText(ruleData) {
+    return ruleData.builderHelperText;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getChallengeRatings(ruleData) {
+    var _a;
+    return (_a = ruleData.challengeRatings) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getClassSpellTypeId(ruleData) {
+    return ruleData.classSpellTypeId;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getConditionTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.conditionTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getConditions(ruleData) {
+    var _a;
+    return (_a = ruleData.conditions) !== null && _a !== void 0 ? _a : [];
+}
+export function getCoverTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.coverTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCreatureGroupCategories(ruleData) {
+    var _a;
+    return (_a = ruleData.creatureGroupCategories) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCreatureGroupFlags(ruleData) {
+    var _a;
+    return (_a = ruleData.creatureGroupFlags) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCreatureGroups(ruleData) {
+    var _a;
+    return (_a = ruleData.creatureGroups) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCreatureSizes(ruleData) {
+    var _a;
+    return (_a = ruleData.creatureSizes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCurrencyData(ruleData) {
+    var _a;
+    return (_a = ruleData.currencyData) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDamageAdjustments(ruleData) {
+    var _a;
+    return (_a = ruleData.damageAdjustments) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDamageTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.damageTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDefaultArmorImageUrl(ruleData) {
+    return ruleData.defaultArmorImageUrl;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDefaultGearImageUrl(ruleData) {
+    return ruleData.defaultGearImageUrl;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDefaultRaceImageUrl(ruleData) {
+    return ruleData.defaultRacePortraitUrl;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDefaultWeaponImageUrl(ruleData) {
+    return ruleData.defaultWeaponImageUrl;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDiceValues(ruleData) {
+    var _a;
+    return (_a = ruleData.diceValues) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getEnvironments(ruleData) {
+    var _a;
+    return (_a = ruleData.environments) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getGearTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.gearTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getInitiativeScore(ruleData) {
+    return ruleData.initiativeScore;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getLanguageTypeId(ruleData) {
+    return ruleData.languageTypeId;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getLanguages(ruleData) {
+    var _a;
+    return (_a = ruleData.languages) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getLevelExperiencePoints(ruleData) {
+    var _a;
+    return (_a = ruleData.levelExperiencePoints) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getLevelProficiencyBonuses(ruleData) {
+    var _a;
+    return (_a = ruleData.levelProficiencyBonuses) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getLifestyles(ruleData) {
+    var _a;
+    return (_a = ruleData.lifestyles) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getLimitedUseResetTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.limitedUseResetTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getLongRestMinimumHitDiceUsedRecovered(ruleData) {
+    return ruleData.longRestMinimumHitDiceUsedRecovered;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDefaultAttunedItemCountMax(ruleData) {
+    return ruleData.defaultAttunedItemCountMax;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMaxAttunedItemCountMax(ruleData) {
+    return ruleData.maxAttunedItemCountMax;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMinAttunedItemCountMax(ruleData) {
+    return ruleData.minAttunedItemCountMax;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMaxCharacterLevel(ruleData) {
+    return ruleData.maxCharacterLevel;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMaxDeathsavesFail(ruleData) {
+    return ruleData.maxDeathsavesFail;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMaxDeathsavesSuccess(ruleData) {
+    return ruleData.maxDeathsavesSuccess;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMaxSpellLevel(ruleData) {
+    return ruleData.maxSpellLevel;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMaxStatScore(ruleData) {
+    return ruleData.maxStatScore;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMinStatScore(ruleData) {
+    return ruleData.minStatScore;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMinimumHpTotal(ruleData) {
+    return ruleData.minimumHpTotal;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMinimumLimitedUseMaxUse(ruleData) {
+    return ruleData.minimumLimitedUseMaxUse;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMonsterSubTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.monsterSubTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMonsterTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.monsterTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMovements(ruleData) {
+    var _a;
+    return (_a = ruleData.movements) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMultiClassSpellSlots(ruleData) {
+    var _a;
+    let fallback = [
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+    ];
+    return (_a = ruleData.multiClassSpellSlots) !== null && _a !== void 0 ? _a : fallback;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getNaturalActions(ruleData) {
+    var _a;
+    return (_a = ruleData.naturalActions) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getNoArmorAcAmount(ruleData) {
+    return ruleData.noArmorAcAmount;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getPactMagicMultiClassSpellSlots(ruleData) {
+    var _a;
+    let fallback = [
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+        [],
+    ];
+    return (_a = ruleData.pactMagicMultiClassSpellSlots) !== null && _a !== void 0 ? _a : fallback;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getPrivacyTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.privacyTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getProficiencyGroups(ruleData) {
+    var _a;
+    return (_a = ruleData.proficiencyGroups) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getRaceGroups(ruleData) {
+    var _a;
+    return (_a = ruleData.raceGroups) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getRangeTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.rangeTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getRestoreTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.restoreTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getRitualCastingTimeMinuteAddition(ruleData) {
+    return ruleData.ritualCastingTimeMinuteAddition;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getRules(ruleData) {
+    var _a;
+    return (_a = ruleData.rules) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSenses(ruleData) {
+    var _a;
+    return (_a = ruleData.senses) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSharingTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.sharingTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSourceCategories(ruleData) {
+    var _a;
+    return (_a = ruleData.sourceCategories) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSourceCategoryLookup(ruleData) {
+    return ruleData.sourceCategoryLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSources(ruleData) {
+    var _a;
+    return (_a = ruleData.sources) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSpellComponents(ruleData) {
+    var _a;
+    return (_a = ruleData.spellComponents) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSpellConditionTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.spellConditionTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSpellRangeTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.spellRangeTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getStatModifiers(ruleData) {
+    var _a;
+    return (_a = ruleData.statModifiers) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getStats(ruleData) {
+    var _a;
+    return (_a = ruleData.stats) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getStealthCheckTypes(ruleData) {
+    var _a;
+    return (_a = ruleData.stealthCheckTypes) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getStringMartialArts(ruleData) {
+    return ruleData.stringMartialArts;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getStringPactMagic(ruleData) {
+    return ruleData.stringPactMagic;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getStringSpellCasting(ruleData) {
+    return ruleData.stringSpellCasting;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getStringSpellEldritchBlast(ruleData) {
+    return ruleData.stringSpellEldritchBlast;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getToolTypeId(ruleData) {
+    return ruleData.toolTypeId;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getTools(ruleData) {
+    var _a;
+    return (_a = ruleData.tools) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getWeaponCategories(ruleData) {
+    var _a;
+    return (_a = ruleData.weaponCategories) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getWeaponProperties(ruleData) {
+    var _a;
+    return (_a = ruleData.weaponProperties) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getWeaponPropertyReachDistance(ruleData) {
+    return ruleData.weaponPropertyReachDistance;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getWeapons(ruleData) {
+    var _a;
+    return (_a = ruleData.weapons) !== null && _a !== void 0 ? _a : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAbilitySkillLookup(ruleData) {
+    return ruleData.abilitySkillLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getActivationTypesLookup(ruleData) {
+    return ruleData.activationTypesLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAdjustmentDataTypesLookup(ruleData) {
+    return ruleData.adjustmentDataTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAdjustmentTypesLookup(ruleData) {
+    return ruleData.adjustmentTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAlignmentLookup(ruleData) {
+    return ruleData.alignmentLookup;
+}
+export function getLifestyleLookup(ruleData) {
+    return ruleData.lifestyleLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAoeTypeLookup(ruleData) {
+    return ruleData.aoeTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getBasicActionsLookup(ruleData) {
+    return ruleData.basicActionLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getChallengeRatingLookup(ruleData) {
+    return ruleData.challengeRatingLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getConditionLookup(ruleData) {
+    return ruleData.conditionLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCreatureGroupCategoryLookup(ruleData) {
+    return ruleData.creatureGroupCategoryLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCreatureGroupFlagLookup(ruleData) {
+    return ruleData.creatureGroupFlagLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCreatureGroupLookup(ruleData) {
+    return ruleData.creatureGroupLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCreatureSizeLookup(ruleData) {
+    return ruleData.creatureSizeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCurrencyDataLookup(ruleData) {
+    return ruleData.currencyDataLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCoverTypeLookup(ruleData) {
+    return ruleData.coverTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDamageAdjustmentsLookup(ruleData) {
+    return ruleData.damageAdjustmentsLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDamageTypeLookup(ruleData) {
+    return ruleData.damageTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getEnvironmentLookup(ruleData) {
+    return ruleData.environmentLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getImmunityDamageAdjustments(ruleData) {
+    return ruleData.immunityDamageAdjustments;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getLanguageLookup(ruleData) {
+    return ruleData.languageLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getLevelProficiencyBonusesLookup(ruleData) {
+    return ruleData.levelProficiencyBonusesLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getLimitedUseResetTypeLookup(ruleData) {
+    return ruleData.limitedUseResetTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMonsterSubTypeLookup(ruleData) {
+    return ruleData.monsterSubTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMonsterTypeLookup(ruleData) {
+    return ruleData.monsterTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMovementLookup(ruleData) {
+    return ruleData.movementLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getRangeTypeLookup(ruleData) {
+    return ruleData.rangeTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getResistanceDamageAdjustments(ruleData) {
+    return ruleData.resistanceDamageAdjustments;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getRuleLookup(ruleData) {
+    return ruleData.ruleLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSenseLookup(ruleData) {
+    return ruleData.senseLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSpellComponentsLookup(ruleData) {
+    return ruleData.spellComponentsLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSpellRangeTypeLookup(ruleData) {
+    return ruleData.spellRangeTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getStatModifiersLookup(ruleData) {
+    return ruleData.statModifiersLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getStatsLookup(ruleData) {
+    return ruleData.statsLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getStatKeyLookup(ruleData) {
+    return ruleData.statKeyLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getStealthCheckTypeLookup(ruleData) {
+    return ruleData.stealthCheckTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getVersatileDieLookup(ruleData) {
+    return ruleData.versatileDieLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getVulnerabilityDamageAdjustments(ruleData) {
+    return ruleData.vulnerabilityDamageAdjustments;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getWeaponCategoryLookup(ruleData) {
+    return ruleData.weaponCategoryLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getWeaponLookupByEntityId(ruleData) {
+    return ruleData.weaponLookupByEntityId;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSourceDataLookup(ruleData) {
+    return ruleData.sourceDataLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSourceData(ruleData) {
+    return ruleData.sourceData;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getVehicleRuleData(ruleData) {
+    return ruleData.vehicleRuleData;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getVehicleDimensionRanges(ruleData) {
+    var _a, _b;
+    return (_b = (_a = getVehicleRuleData(ruleData)) === null || _a === void 0 ? void 0 : _a.vehicleDimensionRanges) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getVehicleWeightRanges(ruleData) {
+    var _a, _b;
+    return (_b = (_a = getVehicleRuleData(ruleData)) === null || _a === void 0 ? void 0 : _a.vehicleWeightRanges) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getVehicleMovementTypes(ruleData) {
+    var _a, _b;
+    return (_b = (_a = getVehicleRuleData(ruleData)) === null || _a === void 0 ? void 0 : _a.vehicleMovementTypes) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getObjectTypes(ruleData) {
+    var _a, _b;
+    return (_b = (_a = getVehicleRuleData(ruleData)) === null || _a === void 0 ? void 0 : _a.objectTypes) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getComponentTypes(ruleData) {
+    var _a, _b;
+    return (_b = (_a = getVehicleRuleData(ruleData)) === null || _a === void 0 ? void 0 : _a.componentTypes) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getVehicleMovementLookup(ruleData) {
+    return ruleData.vehicleMovementLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getObjectTypeLookup(ruleData) {
+    return ruleData.objectTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getComponentTypeLookup(ruleData) {
+    return ruleData.componentTypeLookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getArmorTypeLookup(ruleData) {
+    return ruleData.armorTypeLookup;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RuleData/constants.js b/ddb_main/packages/rules-engine/es/engine/RuleData/constants.js
new file mode 100644
index 0000000..4807f01
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RuleData/constants.js
@@ -0,0 +1,4 @@
+export var RuleDataTypeEnum;
+(function (RuleDataTypeEnum) {
+    RuleDataTypeEnum["VEHICLE"] = "vehicle";
+})(RuleDataTypeEnum || (RuleDataTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/RuleData/derivers.js b/ddb_main/packages/rules-engine/es/engine/RuleData/derivers.js
new file mode 100644
index 0000000..de9c0ac
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RuleData/derivers.js
@@ -0,0 +1,51 @@
+import { getDamageAdjustments, getDiceValues, getLevelProficiencyBonuses, getStatModifiers, getStats, } from './accessors';
+/**
+ *
+ * @param ruleData
+ */
+export function deriveStatKeyLookup(ruleData) {
+    return getStats(ruleData).reduce((acc, stat) => {
+        acc[stat.id] = stat.key === null ? '' : stat.key.toLowerCase();
+        return acc;
+    }, {});
+}
+/**
+ *
+ * @param adjustmentType
+ * @param ruleData
+ */
+export function deriveDamageAdjustmentsByType(adjustmentType, ruleData) {
+    return getDamageAdjustments(ruleData).filter((adjustment) => adjustment.type === adjustmentType);
+}
+/**
+ *
+ * @param ruleData
+ */
+export function deriveLevelProficiencyBonusesLookup(ruleData) {
+    return getLevelProficiencyBonuses(ruleData).reduce((acc, item) => {
+        acc[item.level] = item.bonus;
+        return acc;
+    }, {});
+}
+/**
+ *
+ * @param ruleData
+ */
+export function deriveStatModifiersLookup(ruleData) {
+    return getStatModifiers(ruleData).reduce((acc, item) => {
+        acc[item.value] = item.modifier;
+        return acc;
+    }, {});
+}
+/**
+ *
+ * @param ruleData
+ */
+export function deriveVersatileDieLookup(ruleData) {
+    return getDiceValues(ruleData).reduce((acc, dieValue) => {
+        const diceValues = getDiceValues(ruleData);
+        const versatileIdx = Math.min(diceValues.length - 1, diceValues.indexOf(dieValue) + 1);
+        acc[dieValue] = diceValues[versatileIdx];
+        return acc;
+    }, {});
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RuleData/generators.js b/ddb_main/packages/rules-engine/es/engine/RuleData/generators.js
new file mode 100644
index 0000000..d16e2c9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RuleData/generators.js
@@ -0,0 +1,328 @@
+import { has, keyBy, orderBy, sortBy } from 'lodash';
+import { AttackSubtypeEnum } from '../Action';
+import { ConditionAccessors } from '../Condition';
+import { DamageAdjustmentTypeEnum, ProficiencyLevelEnum, SourceTypeEnum, } from '../Core';
+import { FormatUtils } from '../Format';
+import { RuleDataPoolAccessors } from '../RuleDataPool';
+import { SourceUtils } from '../Source';
+import { getAbilitySkills, getActivationTypes, getAdjustmentDataTypes, getAdjustmentTypes, getAlignments, getAoeTypes, getArmor, getArmorTypes, getBasicActions, getChallengeRatings, getComponentTypes, getConditions, getCoverTypes, getCreatureGroupCategories, getCreatureGroupFlags, getCreatureGroups, getCreatureSizes, getCurrencyData, getDamageAdjustments, getDamageTypes, getDiceValues, getEnvironments, getLanguages, getLifestyles, getLimitedUseResetTypes, getMonsterSubTypes, getMonsterTypes, getMovements, getObjectTypes, getRangeTypes, getRules, getSenses, getSourceCategories, getSources, getSpellComponents, getSpellRangeTypes, getStats, getStealthCheckTypes, getTools, getVehicleMovementTypes, getWeaponCategories, getWeaponProperties, getWeapons, } from './accessors';
+import { RuleDataTypeEnum } from './constants';
+import { deriveDamageAdjustmentsByType, deriveLevelProficiencyBonusesLookup, deriveStatKeyLookup, deriveStatModifiersLookup, deriveVersatileDieLookup, } from './derivers';
+import { getCreatureGroupInfo, getProficiencyLevelName, getWeaponCategoryName } from './utils';
+/**
+ *
+ * @param ruleDataContract
+ * @param ruleDataPool
+ */
+export function generateRuleData(ruleDataContract, ruleDataPool) {
+    const ruleDataStageOne = Object.assign(Object.assign({}, ruleDataContract), { vehicleRuleData: RuleDataPoolAccessors.getRuleData(RuleDataTypeEnum.VEHICLE, ruleDataPool) });
+    let sourceData = generateSourceData(ruleDataContract);
+    let sourceCategories = getSourceCategories(ruleDataContract);
+    return Object.assign(Object.assign({}, ruleDataStageOne), { abilitySkillLookup: keyBy(getAbilitySkills(ruleDataContract), 'id'), activationTypesLookup: keyBy(getActivationTypes(ruleDataContract), 'id'), adjustmentDataTypeLookup: keyBy(getAdjustmentDataTypes(ruleDataContract), 'id'), adjustmentTypeLookup: keyBy(getAdjustmentTypes(ruleDataContract), 'id'), alignmentLookup: keyBy(getAlignments(ruleDataContract), 'id'), aoeTypeLookup: keyBy(getAoeTypes(ruleDataContract), 'id'), armorTypeLookup: keyBy(getArmorTypes(ruleDataContract), (armorType) => armorType.id), basicActionLookup: keyBy(getBasicActions(ruleDataContract), 'id'), challengeRatingLookup: keyBy(getChallengeRatings(ruleDataContract), 'id'), componentTypeLookup: keyBy(getComponentTypes(ruleDataStageOne), 'type'), conditionLookup: keyBy(getConditions(ruleDataContract), (condition) => ConditionAccessors.getId(condition)), coverTypeLookup: keyBy(getCoverTypes(ruleDataContract), 'type'), creatureGroupCategoryLookup: keyBy(getCreatureGroupCategories(ruleDataContract), 'id'), creatureGroupFlagLookup: keyBy(getCreatureGroupFlags(ruleDataContract), 'key'), creatureGroupLookup: keyBy(getCreatureGroups(ruleDataContract), 'id'), creatureSizeLookup: keyBy(getCreatureSizes(ruleDataContract), 'id'), currencyDataLookup: keyBy(getCurrencyData(ruleDataContract), 'name'), damageAdjustmentsLookup: keyBy(getDamageAdjustments(ruleDataContract), 'id'), damageTypeLookup: keyBy(getDamageTypes(ruleDataContract), 'id'), environmentLookup: keyBy(getEnvironments(ruleDataContract), 'id'), immunityDamageAdjustments: deriveDamageAdjustmentsByType(DamageAdjustmentTypeEnum.IMMUNITY, ruleDataContract), languageLookup: keyBy(getLanguages(ruleDataContract), 'id'), levelProficiencyBonusesLookup: deriveLevelProficiencyBonusesLookup(ruleDataContract), lifestyleLookup: keyBy(getLifestyles(ruleDataContract), 'id'), limitedUseResetTypeLookup: keyBy(getLimitedUseResetTypes(ruleDataContract), 'id'), monsterSubTypeLookup: keyBy(getMonsterSubTypes(ruleDataContract), 'id'), monsterTypeLookup: keyBy(getMonsterTypes(ruleDataContract), 'id'), movementLookup: keyBy(getMovements(ruleDataContract), 'id'), objectTypeLookup: keyBy(getObjectTypes(ruleDataStageOne), 'type'), rangeTypeLookup: keyBy(getRangeTypes(ruleDataContract), 'id'), resistanceDamageAdjustments: deriveDamageAdjustmentsByType(DamageAdjustmentTypeEnum.RESISTANCE, ruleDataContract), ruleLookup: keyBy(getRules(ruleDataContract), 'name'), senseLookup: keyBy(getSenses(ruleDataContract), 'id'), sourceData, sourceDataLookup: generateSourceDataLookup(sourceData), sourceCategoryLookup: generateSourceCategoryLookup(sourceCategories), spellComponentsLookup: keyBy(getSpellComponents(ruleDataContract), 'id'), spellRangeTypeLookup: keyBy(getSpellRangeTypes(ruleDataContract), 'id'), statModifiersLookup: deriveStatModifiersLookup(ruleDataContract), statsLookup: keyBy(getStats(ruleDataContract), 'id'), statKeyLookup: deriveStatKeyLookup(ruleDataContract), stealthCheckTypeLookup: keyBy(getStealthCheckTypes(ruleDataContract), 'id'), vulnerabilityDamageAdjustments: deriveDamageAdjustmentsByType(DamageAdjustmentTypeEnum.VULNERABILITY, ruleDataContract), vehicleMovementLookup: keyBy(getVehicleMovementTypes(ruleDataStageOne), 'type'), versatileDieLookup: deriveVersatileDieLookup(ruleDataContract), weaponCategoryLookup: keyBy(getWeaponCategories(ruleDataContract), 'id'), weaponLookupByEntityId: keyBy(getWeapons(ruleDataContract), (weapon) => `${weapon.entityTypeId}-${weapon.id}`), weaponPropertyLookup: keyBy(getWeaponProperties(ruleDataContract), (weaponProperty) => weaponProperty.id) });
+}
+/**
+ *
+ * @param ruleData
+ */
+export function generateSourceData(ruleData) {
+    const sources = getSources(ruleData);
+    const sourceCategories = getSourceCategories(ruleData);
+    return sources.map((data) => {
+        const sourceCategory = sourceCategories.find((cat) => cat.id === data.sourceCategoryId);
+        return Object.assign(Object.assign({}, data), { sourceCategory: sourceCategory ? sourceCategory : null });
+    });
+}
+/**
+ * @param sourceData
+ */
+export function generateSourceDataLookup(sourceData) {
+    return keyBy(sourceData, 'id');
+}
+/**
+ * @param sourceData
+ */
+export function generateSourceCategoryLookup(sourceCategories) {
+    return keyBy(sourceCategories, 'id');
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDamageTypeOptions(ruleData) {
+    return sortBy(getDamageTypes(ruleData), 'name').map((type) => ({
+        label: type.name,
+        value: type.id,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ * @param useFullname
+ */
+export function getStatOptions(ruleData, useFullname = false) {
+    return getStats(ruleData).map((stat) => ({
+        label: useFullname ? stat.name : stat.key,
+        value: stat.id,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getChallengeOptions(ruleData) {
+    return getChallengeRatings(ruleData).map((challengeRating) => ({
+        label: FormatUtils.renderChallengeRating(challengeRating.value),
+        value: challengeRating.value,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCreatureGroupGroupedOptions(ruleData) {
+    const primaryGroups = [];
+    const otherGroups = [];
+    getCreatureGroups(ruleData).forEach((group) => {
+        const groupInfo = getCreatureGroupInfo(group.id, ruleData);
+        if (groupInfo) {
+            if (groupInfo.isPrimary) {
+                primaryGroups.push(group);
+            }
+            else {
+                otherGroups.push(group);
+            }
+        }
+    });
+    const options = [
+        ...orderBy(primaryGroups.map((group) => ({
+            label: group.name,
+            value: group.id,
+        })), 'label'),
+        ...otherGroups.map((group) => ({
+            label: group.name,
+            value: group.id,
+        })),
+    ];
+    return options;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getMonsterTypeOptions(ruleData) {
+    return getMonsterTypes(ruleData).map((monsterType) => ({
+        label: monsterType.name,
+        value: monsterType.id,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCreatureSizeOptions(ruleData) {
+    return getCreatureSizes(ruleData).map((size) => ({
+        label: size.name,
+        value: size.id,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ * @param includeNonCharacterAlignments
+ */
+export function getAlignmentOptions(ruleData, includeNonCharacterAlignments = false) {
+    const options = getAlignments(ruleData)
+        .filter((alignment) => {
+        if (includeNonCharacterAlignments && !alignment.availableToCharacter) {
+            return true;
+        }
+        return alignment.availableToCharacter;
+    })
+        .map((alignment) => ({
+        label: alignment.name,
+        value: alignment.id,
+    }));
+    return orderBy(options, 'label');
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getCreatureGroupOptions(ruleData) {
+    const options = getCreatureGroups(ruleData).map((group) => ({
+        label: group.name,
+        value: group.id,
+    }));
+    return orderBy(options, 'label');
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAttackRangeTypeOptions(ruleData) {
+    return getRangeTypes(ruleData).map((type) => ({
+        label: type.name,
+        value: type.id,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getDieTypeOptions(ruleData) {
+    return getDiceValues(ruleData).map((dieValue) => ({
+        label: FormatUtils.renderLocaleNumber(dieValue),
+        value: dieValue,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getActivationTypeOptions(ruleData) {
+    return getActivationTypes(ruleData).map((activationType) => ({
+        label: activationType.name,
+        value: activationType.id,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getSpellRangeTypeOptions(ruleData) {
+    return getSpellRangeTypes(ruleData).map((spellRangeType) => ({
+        label: spellRangeType.name,
+        value: spellRangeType.id,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAoeTypeOptions(ruleData) {
+    return getAoeTypes(ruleData).map((aoeType) => ({
+        label: aoeType.name,
+        value: aoeType.id,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getAttackSubtypeOptions(ruleData) {
+    return [
+        {
+            label: 'Natural',
+            value: AttackSubtypeEnum.NATURAL,
+        },
+        {
+            label: 'Unarmed Strike',
+            value: AttackSubtypeEnum.UNARMED,
+        },
+    ];
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getProficiencyLevelOptions(ruleData) {
+    const levels = [
+        ProficiencyLevelEnum.NONE,
+        ProficiencyLevelEnum.HALF,
+        ProficiencyLevelEnum.FULL,
+        ProficiencyLevelEnum.EXPERT,
+    ];
+    return levels.map((level) => ({
+        label: getProficiencyLevelName(level),
+        value: level,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ * @param excludeIds
+ */
+export function getArmorOptions(ruleData, excludeIds = []) {
+    const filteredArmor = getArmor(ruleData).filter((item) => !excludeIds.includes(item.id));
+    const sortedArmor = orderBy(filteredArmor, 'name');
+    return sortedArmor.map((item) => ({
+        label: item.name,
+        value: item.id,
+    }));
+}
+/**
+ *
+ * @param ruleData
+ * @param excludeIds
+ */
+export function getWeaponOptions(ruleData, excludeIds = []) {
+    const filteredWeapons = getWeapons(ruleData).filter((item) => !excludeIds.includes(item.id));
+    return getWeaponCategories(ruleData).map((category) => {
+        const categoryWeapons = filteredWeapons.filter((weapon) => weapon.categoryId === category.id);
+        const orderedWeapons = orderBy(categoryWeapons, 'name');
+        return {
+            optGroupLabel: getWeaponCategoryName(category.id, ruleData),
+            options: orderedWeapons.map((weapon) => ({
+                label: weapon.name,
+                value: weapon.id,
+            })),
+        };
+    });
+}
+/**
+ *
+ * @param ruleData
+ * @param excludeIds
+ */
+export function getLanguageOptions(ruleData, excludeIds = [], entityRestrictionData) {
+    const filtered = getLanguages(ruleData).filter((item) => {
+        // If restriction data is provided, filter out sources not in the activeSourceLookup
+        if ((entityRestrictionData === null || entityRestrictionData === void 0 ? void 0 : entityRestrictionData.activeSourceLookup) && item.rpgSourceId) {
+            return !excludeIds.includes(item.id) && has(entityRestrictionData.activeSourceLookup, item.rpgSourceId);
+        }
+        return !excludeIds.includes(item.id);
+    });
+    const sorted = orderBy(filtered, 'name');
+    return sorted.map((item) => ({
+        label: item.name,
+        value: item.id,
+    }));
+}
+export function getLanguageOptionsGroupedBySourceCategory(ruleData, excludeIds = [], entityRestrictionData) {
+    const filtered = getLanguages(ruleData).filter((item) => {
+        // If restriction data is provided, filter out sources not in the activeSourceLookup
+        if ((entityRestrictionData === null || entityRestrictionData === void 0 ? void 0 : entityRestrictionData.activeSourceLookup) && item.rpgSourceId) {
+            return !excludeIds.includes(item.id) && has(entityRestrictionData.activeSourceLookup, item.rpgSourceId);
+        }
+        return !excludeIds.includes(item.id);
+    });
+    const simpleContracts = filtered.map((language) => {
+        return {
+            id: language.id,
+            name: language.name,
+            sources: language.rpgSourceId
+                ? [
+                    {
+                        sourceId: language.rpgSourceId,
+                        pageNumber: null,
+                        sourceType: SourceTypeEnum.PRIMARY,
+                    },
+                ]
+                : null,
+        };
+    });
+    return SourceUtils.getGroupedOptionsBySourceCategory(simpleContracts, ruleData, null, undefined, 'Other');
+}
+/**
+ *
+ * @param ruleData
+ * @param excludeIds
+ */
+export function getToolOptions(ruleData, excludeIds = []) {
+    const filtered = getTools(ruleData).filter((item) => !excludeIds.includes(item.id));
+    const sorted = orderBy(filtered, 'name');
+    return sorted.map((item) => ({
+        label: item.name,
+        value: item.id,
+    }));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RuleData/index.js b/ddb_main/packages/rules-engine/es/engine/RuleData/index.js
new file mode 100644
index 0000000..155d7a7
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RuleData/index.js
@@ -0,0 +1,10 @@
+import * as RuleDataAccessors from './accessors';
+import * as RuleDataConstants from './constants';
+import * as RuleDataDerivers from './derivers';
+import * as RuleDataGenerators from './generators';
+import * as RuleDataTypings from './typings';
+import * as RuleDataUtils from './utils';
+export * from './typings';
+export * from './constants';
+export { RuleDataAccessors, RuleDataDerivers, RuleDataGenerators, RuleDataUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, RuleDataAccessors), RuleDataConstants), RuleDataDerivers), RuleDataGenerators), RuleDataTypings), RuleDataUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/RuleData/utils.js b/ddb_main/packages/rules-engine/es/engine/RuleData/utils.js
new file mode 100644
index 0000000..5979196
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RuleData/utils.js
@@ -0,0 +1,806 @@
+import { has, keyBy, orderBy, sortBy, uniqBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { ActivationAccessors } from '../Activation';
+import { ConditionAccessors } from '../Condition';
+import { AttackTypeRangeEnum, CoreUtils, CustomProficiencyTypeEnum, DisplayConfigurationValueEnum, MovementTypeEnum, NoteKeyEnum, ProficiencyLevelEnum, SenseTypeEnum, SpeedMovementKeyEnum, TraitTypeEnum, WeightSpeedTypeEnum, } from '../Core';
+import { HelperUtils } from '../Helper';
+import { ModifierSubTypeEnum } from '../Modifier';
+import { getAdjustmentTypesLookup, getAoeTypeLookup, getArmor, getBasicActions, getBasicActionsLookup, getBuilderHelperText, getComponentTypeLookup, getConditionLookup, getConditions, getCreatureGroupLookup, getDamageAdjustments, getDamageTypeLookup, getLanguageLookup, getLanguages, getLevelProficiencyBonusesLookup, getLimitedUseResetTypeLookup, getMovementLookup, getObjectTypeLookup, getRangeTypeLookup, getRuleLookup, getSenseLookup, getSourceDataLookup, getSpellComponentsLookup, getSpellRangeTypeLookup, getStatKeyLookup, getStatsLookup, getTools, getVehicleMovementLookup, getWeaponCategoryLookup, getWeaponLookupByEntityId, getWeaponProperties, getWeapons, } from './accessors';
+/**
+ *
+ * @param abilityId
+ * @param ruleData
+ */
+export function getStatInfo(abilityId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.statsLookup, abilityId, null);
+}
+/**
+ *
+ * @param activationType
+ * @param ruleData
+ */
+export function getActivationTypeInfo(activationType, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.activationTypesLookup, activationType, null);
+}
+/**
+ *
+ * @param conditionId
+ * @param ruleData
+ */
+export function getConditionInfo(conditionId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.conditionLookup, conditionId, null);
+}
+/**
+ *
+ * @param monsterTypeId
+ * @param ruleData
+ */
+export function getMonsterTypeInfo(monsterTypeId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.monsterTypeLookup, monsterTypeId, null);
+}
+/**
+ *
+ * @param monsterTypeId
+ * @param ruleData
+ * @param fallback
+ * @param pluralize
+ */
+export function getMonsterTypeName(monsterTypeId, ruleData, fallback = '', pluralize = false) {
+    const typeInfo = getMonsterTypeInfo(monsterTypeId, ruleData);
+    let name = fallback;
+    if (typeInfo) {
+        name = pluralize ? typeInfo.pluralizedName : typeInfo.name;
+    }
+    return name;
+}
+/**
+ *
+ * @param monsterSubTypeId
+ * @param ruleData
+ */
+export function getMonsterSubTypeInfo(monsterSubTypeId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.monsterSubTypeLookup, monsterSubTypeId, null);
+}
+/**
+ *
+ * @param creatureSizeId
+ * @param ruleData
+ */
+export function getCreatureSizeInfo(creatureSizeId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.creatureSizeLookup, creatureSizeId, null);
+}
+/**
+ *
+ * @param creatureGroupCategoryId
+ * @param ruleData
+ */
+export function getCreatureGroupCategoryInfo(creatureGroupCategoryId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.creatureGroupCategoryLookup, creatureGroupCategoryId, null);
+}
+/**
+ *
+ * @param creatureGroupFlagKey
+ * @param ruleData
+ */
+export function getCreatureGroupFlagInfo(creatureGroupFlagKey, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.creatureGroupFlagLookup, creatureGroupFlagKey, null);
+}
+/**
+ *
+ * @param alignmentId
+ * @param ruleData
+ */
+export function getAlignmentInfo(alignmentId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.alignmentLookup, alignmentId, null);
+}
+/**
+ *
+ * @param skillId
+ * @param ruleData
+ */
+export function getSkillInfo(skillId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.abilitySkillLookup, skillId, null);
+}
+/**
+ *
+ * @param creatureGroupId
+ * @param ruleData
+ */
+export function getCreatureGroupInfo(creatureGroupId, ruleData) {
+    const definitionInfo = HelperUtils.lookupDataOrFallback(getCreatureGroupLookup(ruleData), creatureGroupId, null);
+    if (definitionInfo !== null && definitionInfo.flags !== null) {
+        const flagInfos = definitionInfo.flags
+            .map((flagKey) => getCreatureGroupFlagInfo(flagKey, ruleData))
+            .filter(TypeScriptUtils.isNotNullOrUndefined);
+        return Object.assign(Object.assign({}, definitionInfo), { categoryInfo: getCreatureGroupCategoryInfo(definitionInfo.categoryId, ruleData), flagInfos, flagInfoLookup: keyBy(flagInfos, 'key') });
+    }
+    return null;
+}
+/**
+ *
+ * @param challengeRatingId
+ * @param ruleData
+ */
+export function getChallengeInfo(challengeRatingId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.challengeRatingLookup, challengeRatingId, null);
+}
+/**
+ *
+ * @param damageAdjustmentId
+ * @param ruleData
+ */
+export function getDamageAdjustmentInfo(damageAdjustmentId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.damageAdjustmentsLookup, damageAdjustmentId, null);
+}
+/**
+ *
+ * @param environmentId
+ * @param ruleData
+ */
+export function getEnvironmentInfo(environmentId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(ruleData.environmentLookup, environmentId, null);
+}
+/**
+ *
+ * @param environmentId
+ * @param ruleData
+ * @param fallback
+ */
+export function getEnvironmentName(environmentId, ruleData, fallback = '') {
+    const info = getEnvironmentInfo(environmentId, ruleData);
+    let name = fallback;
+    if (info && info.name !== null) {
+        name = info.name;
+    }
+    return name;
+}
+/**
+ *
+ * @param categoryId
+ * @param ruleData
+ */
+export function getWeaponCategoryInfo(categoryId, ruleData) {
+    if (categoryId !== null) {
+        return HelperUtils.lookupDataOrFallback(getWeaponCategoryLookup(ruleData), categoryId, null);
+    }
+    return null;
+}
+/**
+ *
+ * @param propertyId
+ * @param ruleData
+ */
+export function getWeaponPropertyInfo(propertyId, ruleData) {
+    const propertyInfo = getWeaponProperties(ruleData).find((propertyItem) => propertyItem.id === propertyId);
+    return propertyInfo ? propertyInfo : null;
+}
+/**
+ * @deprecated Use getAbilityShortName
+ * @param abilityId
+ * @param ruleData
+ */
+export function getAbilityKey(abilityId, ruleData) {
+    if (abilityId === null) {
+        return null;
+    }
+    return HelperUtils.lookupDataOrFallback(getStatKeyLookup(ruleData), abilityId, null);
+}
+/**
+ *
+ * @param abilityId
+ * @param ruleData
+ */
+export function getAbilityShortName(abilityId, ruleData) {
+    if (abilityId === null) {
+        return null;
+    }
+    const key = HelperUtils.lookupDataOrFallback(getStatKeyLookup(ruleData), abilityId, null);
+    if (!key) {
+        return null;
+    }
+    return key.toUpperCase();
+}
+/**
+ *
+ * @param damageTypeId
+ * @param ruleData
+ */
+export function getDamageType(damageTypeId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getDamageTypeLookup(ruleData), damageTypeId, null);
+}
+/**
+ *
+ * @param abilityId
+ * @param ruleData
+ * @param useFullname
+ */
+export function getStatNameById(abilityId, ruleData, useFullname = false) {
+    const stat = HelperUtils.lookupDataOrFallback(getStatsLookup(ruleData), abilityId, null);
+    if (!stat) {
+        return null;
+    }
+    return useFullname ? stat.name : stat.key;
+}
+/**
+ *
+ * @param rangeTypeId
+ * @param ruleData
+ */
+export function getAttackRangeType(rangeTypeId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getRangeTypeLookup(ruleData), rangeTypeId, null);
+}
+/**
+ *
+ * @param id
+ */
+export function getSpeedMovementKeyById(id) {
+    switch (id) {
+        case MovementTypeEnum.WALK:
+            return SpeedMovementKeyEnum.WALK;
+        case MovementTypeEnum.FLY:
+            return SpeedMovementKeyEnum.FLY;
+        case MovementTypeEnum.SWIM:
+            return SpeedMovementKeyEnum.SWIM;
+        case MovementTypeEnum.CLIMB:
+            return SpeedMovementKeyEnum.CLIMB;
+        case MovementTypeEnum.BURROW:
+            return SpeedMovementKeyEnum.BURROW;
+        default:
+            return '';
+    }
+}
+/**
+ *
+ * @param key
+ */
+export function getMovementTypeBySpeedMovementKey(key) {
+    switch (key) {
+        case SpeedMovementKeyEnum.WALK:
+            return MovementTypeEnum.WALK;
+        case SpeedMovementKeyEnum.FLY:
+            return MovementTypeEnum.FLY;
+        case SpeedMovementKeyEnum.SWIM:
+            return MovementTypeEnum.SWIM;
+        case SpeedMovementKeyEnum.CLIMB:
+            return MovementTypeEnum.CLIMB;
+        case SpeedMovementKeyEnum.BURROW:
+            return MovementTypeEnum.BURROW;
+        default:
+        // not implemented
+    }
+    return null;
+}
+/**
+ *
+ * @param key
+ * @param ruleData
+ */
+export function getSpeedMovementKeyLabel(key, ruleData) {
+    const movementTypeId = getMovementTypeBySpeedMovementKey(key);
+    return getMovementDescription(movementTypeId, ruleData);
+}
+/**
+ *
+ * @param movementId
+ * @param ruleData
+ */
+export function getMovementName(movementId, ruleData) {
+    const movementInfo = getMovementInfo(movementId, ruleData);
+    if (movementInfo !== null && movementInfo.name !== null) {
+        return movementInfo.name;
+    }
+    return '';
+}
+/**
+ *
+ * @param movementId
+ * @param ruleData
+ */
+export function getMovementInfo(movementId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getMovementLookup(ruleData), movementId);
+}
+/**
+ *
+ * @param movementId
+ * @param ruleData
+ */
+export function getMovementDescription(movementId, ruleData) {
+    if (movementId === null) {
+        return '';
+    }
+    const movementInfo = getMovementInfo(movementId, ruleData);
+    if (movementInfo !== null && movementInfo.description !== null) {
+        return movementInfo.description;
+    }
+    return '';
+}
+/**
+ * @deprecated use getSenseInfo()
+ * @param key
+ */
+export function getSenseTypeLabel(key) {
+    switch (key) {
+        case SenseTypeEnum.BLINDSIGHT:
+            return 'Blindsight';
+        case SenseTypeEnum.DARKVISION:
+            return 'Darkvision';
+        case SenseTypeEnum.TREMORSENSE:
+            return 'Tremorsense';
+        case SenseTypeEnum.TRUESIGHT:
+            return 'Truesight';
+        case SenseTypeEnum.PASSIVE_PERCEPTION:
+        default:
+            return 'Passive Perception';
+    }
+}
+/**
+ *
+ * @param senseId
+ * @param ruleData
+ */
+export function getSenseInfo(senseId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getSenseLookup(ruleData), senseId, null);
+}
+/**
+ *
+ * @param key
+ */
+export function getSenseTypeModifierKey(key) {
+    switch (key) {
+        case SenseTypeEnum.BLINDSIGHT:
+            return ModifierSubTypeEnum.BLINDSIGHT;
+        case SenseTypeEnum.DARKVISION:
+            return ModifierSubTypeEnum.DARKVISION;
+        case SenseTypeEnum.TREMORSENSE:
+            return ModifierSubTypeEnum.TREMORSENSE;
+        case SenseTypeEnum.TRUESIGHT:
+            return ModifierSubTypeEnum.TRUESIGHT;
+        case SenseTypeEnum.PASSIVE_PERCEPTION:
+            return ModifierSubTypeEnum.PASSIVE_PERCEPTION;
+        default:
+            return '';
+    }
+}
+/**
+ *
+ * @param noteKey
+ */
+export function getNoteKeyName(noteKey) {
+    switch (noteKey) {
+        case NoteKeyEnum.ORGANIZATIONS:
+            return 'Organizations';
+        case NoteKeyEnum.ALLIES:
+            return 'Allies';
+        case NoteKeyEnum.BACKSTORY:
+            return 'Backstory';
+        case NoteKeyEnum.ENEMIES:
+            return 'Enemies';
+        case NoteKeyEnum.OTHER:
+            return 'Other';
+        case NoteKeyEnum.OTHER_HOLDINGS:
+            return 'Other Holdings';
+        case NoteKeyEnum.PERSONAL_POSSESSIONS:
+            return 'Other Possessions';
+        default:
+        // not implemented
+    }
+    return '';
+}
+/**
+ *
+ * @param type
+ */
+export function getTraitTypeName(type) {
+    switch (type) {
+        case TraitTypeEnum.APPEARANCE:
+            return 'Appearance';
+        case TraitTypeEnum.BONDS:
+            return 'Bonds';
+        case TraitTypeEnum.FLAWS:
+            return 'Flaws';
+        case TraitTypeEnum.IDEALS:
+            return 'Ideals';
+        case TraitTypeEnum.PERSONALITY_TRAITS:
+            return 'Personality Traits';
+        default:
+        // not implemented
+    }
+    return '';
+}
+/**
+ *
+ * @param weightSpeedType
+ */
+export function getWeightSpeedTypeLabel(weightSpeedType) {
+    switch (weightSpeedType) {
+        case WeightSpeedTypeEnum.NORMAL:
+            return 'Unencumbered';
+        case WeightSpeedTypeEnum.ENCUMBERED:
+            return 'Encumbered';
+        case WeightSpeedTypeEnum.HEAVILY_ENCUMBERED:
+            return 'Heavily Encumbered';
+        case WeightSpeedTypeEnum.PUSH_DRAG_LIFT:
+            return 'Push, Drag, Lift';
+        case WeightSpeedTypeEnum.OVER_CARRYING_CAPACITY:
+            return 'Over Carrying Capacity';
+        default:
+        // not implemented
+    }
+    return '';
+}
+/**
+ *
+ * @param type
+ */
+export function getProficiencyTypeLabel(type) {
+    switch (type) {
+        case CustomProficiencyTypeEnum.SKILL:
+            return 'Skill';
+        case CustomProficiencyTypeEnum.TOOL:
+            return 'Tool';
+        case CustomProficiencyTypeEnum.LANGUAGE:
+            return 'Language';
+        case CustomProficiencyTypeEnum.ARMOR:
+            return 'Armor';
+        case CustomProficiencyTypeEnum.WEAPON:
+            return 'Weapon';
+        default:
+        // not implemented
+    }
+    return '';
+}
+/**
+ *
+ * @param actionTypeRange
+ */
+export function getAttackTypeRangeName(actionTypeRange) {
+    switch (actionTypeRange) {
+        case AttackTypeRangeEnum.RANGED:
+            return 'Ranged';
+        case AttackTypeRangeEnum.MELEE:
+            return 'Melee';
+        default:
+        // not implemented
+    }
+    return '';
+}
+/**
+ *
+ * @param componentId
+ * @param ruleData
+ */
+export function getSpellComponentInfo(componentId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getSpellComponentsLookup(ruleData), componentId, null);
+}
+/**
+ *
+ * @param ruleKey
+ * @param ruleData
+ */
+export function getRule(ruleKey, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getRuleLookup(ruleData), ruleKey, null);
+}
+/**
+ *
+ * @param aoeTypeId
+ * @param ruleData
+ */
+export function getAoeType(aoeTypeId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getAoeTypeLookup(ruleData), aoeTypeId, null);
+}
+/**
+ *
+ * @param spellRangeTypeId
+ * @param ruleData
+ */
+export function getSpellRangeType(spellRangeTypeId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getSpellRangeTypeLookup(ruleData), spellRangeTypeId, null);
+}
+/**
+ *
+ * @param conditionId
+ * @param ruleData
+ */
+export function getCondition(conditionId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getConditionLookup(ruleData), conditionId, null);
+}
+/**
+ *
+ * @param proficiencyLevel
+ */
+export function getProficiencyLevelName(proficiencyLevel) {
+    switch (proficiencyLevel) {
+        case ProficiencyLevelEnum.NONE:
+            return 'Not Proficient';
+        case ProficiencyLevelEnum.HALF:
+            return 'Half Proficient';
+        case ProficiencyLevelEnum.FULL:
+            return 'Proficient';
+        case ProficiencyLevelEnum.EXPERT:
+            return 'Expertise';
+        default:
+        // not implemented
+    }
+    return '';
+}
+/**
+ *
+ * @param id
+ * @param ruleData
+ */
+export function getAdjustmentDataType(id, ruleData) {
+    const adjustmentType = HelperUtils.lookupDataOrFallback(getAdjustmentTypesLookup(ruleData), id, null);
+    if (adjustmentType) {
+        return adjustmentType.dataType;
+    }
+    return null;
+}
+/**
+ *
+ * @param id
+ * @param ruleData
+ */
+export function getAdjustmentName(id, ruleData) {
+    const adjustmentType = HelperUtils.lookupDataOrFallback(getAdjustmentTypesLookup(ruleData), id, null);
+    if (adjustmentType) {
+        return adjustmentType.name;
+    }
+    return null;
+}
+/**
+ *
+ * @param id
+ * @param ruleData
+ */
+export function getAdjustmentConstraintLookup(id, ruleData) {
+    const adjustmentType = HelperUtils.lookupDataOrFallback(getAdjustmentTypesLookup(ruleData), id, null);
+    if (adjustmentType) {
+        return keyBy(adjustmentType.constraints, 'id');
+    }
+    return {};
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getArmorNameLookup(ruleData) {
+    const sortedArmor = orderBy(getArmor(ruleData), 'name');
+    const lookup = {};
+    sortedArmor.forEach((item) => {
+        if (item.id !== null) {
+            lookup[item.id] = item.name === null ? '' : item.name;
+        }
+    });
+    return lookup;
+}
+/**
+ *
+ * @param categoryId
+ * @param ruleData
+ */
+export function getWeaponCategory(categoryId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getWeaponCategoryLookup(ruleData), categoryId, null);
+}
+/**
+ *
+ * @param categoryId
+ * @param ruleData
+ * @param fallback
+ */
+export function getWeaponCategoryName(categoryId, ruleData, fallback = '') {
+    const weaponCategory = getWeaponCategory(categoryId, ruleData);
+    if (weaponCategory !== null && weaponCategory.name !== null) {
+        return weaponCategory.name;
+    }
+    return fallback;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getWeaponNameLookup(ruleData) {
+    const sortedWeapons = orderBy(getWeapons(ruleData), 'name');
+    const lookup = {};
+    sortedWeapons.forEach((item) => {
+        if (item.id !== null) {
+            lookup[item.id] = item.name === null ? '' : item.name;
+        }
+    });
+    return lookup;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getLanguageNameLookup(ruleData) {
+    const lookup = {};
+    getLanguages(ruleData).forEach((language) => {
+        if (language.id !== null) {
+            lookup[language.id] = language.name === null ? '' : language.name;
+        }
+    });
+    return lookup;
+}
+/**
+ *
+ * @param languageId
+ * @param ruleData
+ * @param fallback
+ */
+export function getLanguageName(languageId, ruleData, fallback = '') {
+    const language = HelperUtils.lookupDataOrFallback(getLanguageLookup(ruleData), languageId, null);
+    if (language !== null && language.name !== null) {
+        return language.name;
+    }
+    return fallback;
+}
+/**
+ *
+ * @param ruleData
+ */
+export function getToolNameLookup(ruleData) {
+    const sorted = orderBy(getTools(ruleData), 'name');
+    const lookup = {};
+    sorted.forEach((item) => {
+        if (item.id !== null) {
+            lookup[item.id] = item.name === null ? '' : item.name;
+        }
+    });
+    return lookup;
+}
+/**
+ *
+ * @param id
+ * @param entityTypeId
+ * @param ruleData
+ */
+export function getWeaponByEntityId(id, entityTypeId, ruleData) {
+    if (id === null || entityTypeId === null) {
+        return null;
+    }
+    return HelperUtils.lookupDataOrFallback(getWeaponLookupByEntityId(ruleData), `${entityTypeId}-${id}`, null);
+}
+/**
+ *
+ * @param basicActionId
+ * @param ruleData
+ */
+export function getBasicAction(basicActionId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getBasicActionsLookup(ruleData), basicActionId, null);
+}
+/**
+ *
+ * @param resetTypeId
+ * @param ruleData
+ */
+export function getLimitedUseResetTypeName(resetTypeId, ruleData) {
+    const resetType = HelperUtils.lookupDataOrFallback(getLimitedUseResetTypeLookup(ruleData), resetTypeId);
+    if (resetType !== null && resetType.name !== null) {
+        return resetType.name;
+    }
+    return 'Special';
+}
+/**
+ *
+ * @param activationType
+ * @param ruleData
+ */
+export function getActivationTypeBasicActions(activationType, ruleData) {
+    const basicActions = getBasicActions(ruleData);
+    return basicActions.filter((basicAction) => ActivationAccessors.getType(basicAction.activation) === activationType);
+}
+/**
+ *
+ * @param level
+ * @param ruleData
+ */
+export function getLevelProficiencyBonus(level, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getLevelProficiencyBonusesLookup(ruleData), level, 0);
+}
+/**
+ *
+ * @param slug
+ * @param ruleData
+ */
+export function getConditionBySlug(slug, ruleData) {
+    if (slug === null) {
+        return null;
+    }
+    const conditionData = getConditions(ruleData);
+    const condition = conditionData.find((condition) => ConditionAccessors.getSlug(condition) === slug);
+    if (condition) {
+        return condition;
+    }
+    return null;
+}
+/**
+ *
+ * @param slug
+ * @param damageAdjustmentType
+ * @param ruleData
+ */
+export function getDamageAdjustmentBySlug(slug, damageAdjustmentType, ruleData) {
+    if (slug === null) {
+        return slug;
+    }
+    const damageAdjustmentData = getDamageAdjustments(ruleData);
+    const damageAdjustment = damageAdjustmentData.find((adjustment) => adjustment.type === damageAdjustmentType && adjustment.slug === slug);
+    if (damageAdjustment) {
+        return damageAdjustment;
+    }
+    return null;
+}
+/**
+ *
+ * @param movementType
+ * @param ruleData
+ * @param fallback
+ */
+export function getVehicleMovementName(movementType, ruleData, fallback = null) {
+    const movementInfo = HelperUtils.lookupDataOrFallback(getVehicleMovementLookup(ruleData), movementType, null);
+    if (movementInfo) {
+        return movementInfo.name;
+    }
+    return fallback;
+}
+/**
+ *
+ * @param type
+ * @param ruleData
+ */
+export function getObjectTypeInfo(type, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getObjectTypeLookup(ruleData), type);
+}
+/**
+ *
+ * @param type
+ * @param ruleData
+ * @param fallback
+ */
+export function getObjectTypeName(type, ruleData, fallback = null) {
+    const objectType = getObjectTypeInfo(type, ruleData);
+    if (objectType) {
+        return objectType.name;
+    }
+    return fallback;
+}
+/**
+ *
+ * @param sourceId
+ * @param ruleData
+ */
+export function getSourceDataInfo(sourceId, ruleData) {
+    return HelperUtils.lookupDataOrFallback(getSourceDataLookup(ruleData), sourceId);
+}
+/**
+ *
+ * @param type
+ * @param ruleData
+ * @param fallback
+ */
+export function getComponentTypeName(type, ruleData, fallback = null) {
+    const componentTypeInfo = HelperUtils.lookupDataOrFallback(getComponentTypeLookup(ruleData), type);
+    if (componentTypeInfo) {
+        return componentTypeInfo.name;
+    }
+    return fallback;
+}
+export function getBuilderHelperTextByDefinitionKey(definitionKey, ruleData, displayConfigurationType) {
+    const builderHelperText = getBuilderHelperText(ruleData);
+    return builderHelperText
+        .filter((builderText) => {
+        if ((has(builderText, 'isInclusive') && builderText.isInclusive) || !has(builderText, 'isInclusive')) {
+            return builderText.definitionKeys.includes(definitionKey);
+        }
+        return !builderText.definitionKeys.includes(definitionKey);
+    })
+        .filter((builderText) => CoreUtils.getDisplayConfigurationValue(displayConfigurationType, builderText.displayConfiguration) ===
+        DisplayConfigurationValueEnum.ON);
+}
+export function getBuilderHelperTextByDefinitionKeys(definitionKeys, ruleData, displayConfigurationType) {
+    let builderTexts = [];
+    definitionKeys.forEach((definitionKey) => {
+        builderTexts = builderTexts.concat(getBuilderHelperTextByDefinitionKey(definitionKey, ruleData, displayConfigurationType));
+    });
+    return sortBy(uniqBy(builderTexts, 'id'), 'displayOrder');
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RuleDataPool/accessors.js b/ddb_main/packages/rules-engine/es/engine/RuleDataPool/accessors.js
new file mode 100644
index 0000000..cfc86e7
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RuleDataPool/accessors.js
@@ -0,0 +1,3 @@
+export function getRuleData(key, ruleDataPool) {
+    return ruleDataPool[key];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/RuleDataPool/index.js b/ddb_main/packages/rules-engine/es/engine/RuleDataPool/index.js
new file mode 100644
index 0000000..fdf8584
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/RuleDataPool/index.js
@@ -0,0 +1,5 @@
+import * as RuleDataPoolAccessors from './accessors';
+import * as RuleDataPoolTypings from './typings';
+export * from './typings';
+export { RuleDataPoolAccessors };
+export default Object.assign(Object.assign({}, RuleDataPoolAccessors), RuleDataPoolTypings);
diff --git a/ddb_main/packages/rules-engine/es/engine/Skill/accessors.js b/ddb_main/packages/rules-engine/es/engine/Skill/accessors.js
new file mode 100644
index 0000000..5603314
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Skill/accessors.js
@@ -0,0 +1,140 @@
+/**
+ *
+ * @param skill
+ */
+export function getDescription(skill) {
+    return skill.description;
+}
+/**
+ *
+ * @param skill
+ */
+export function getEntityTypeId(skill) {
+    return skill.entityTypeId;
+}
+/**
+ *
+ * @param skill
+ */
+export function getExpertise(skill) {
+    return skill.expertise;
+}
+/**
+ *
+ * @param skill
+ */
+export function getHalfProficiency(skill) {
+    return skill.halfProficiency;
+}
+/**
+ *
+ * @param skill
+ */
+export function getId(skill) {
+    return skill.id;
+}
+/**
+ *
+ * @param skill
+ */
+export function getIsOverridden(skill) {
+    return skill.isOverridden;
+}
+/**
+ *
+ * @param skill
+ */
+export function getModifier(skill) {
+    return skill.modifier;
+}
+/**
+ *
+ * @param skill
+ */
+export function getModifierBonuses(skill) {
+    return skill.modifierBonuses;
+}
+/**
+ *
+ * @param skill
+ */
+export function getName(skill) {
+    return skill.name;
+}
+/**
+ *
+ * @param skill
+ */
+export function getProficiency(skill) {
+    return skill.proficiency;
+}
+/**
+ *
+ * @param skill
+ */
+export function getProficiencyBonus(skill) {
+    return skill.proficiencyBonus;
+}
+/**
+ *
+ * @param skill
+ */
+export function getProficiencyLevel(skill) {
+    return skill.proficiencyLevel;
+}
+/**
+ *
+ * @param skill
+ */
+export function getStat(skill) {
+    return skill.stat;
+}
+/**
+ *
+ * @param skill
+ */
+export function getStatModifier(skill) {
+    return skill.statModifier;
+}
+/**
+ *
+ * @param skill
+ */
+export function isCustom(skill) {
+    return skill.isCustom;
+}
+/**
+ *
+ * @param skill
+ */
+export function getNotes(skill) {
+    return skill.notes;
+}
+/**
+ *
+ * @param skill
+ */
+export function getOriginalContract(skill) {
+    return skill.originalContract;
+}
+/**
+ *
+ * @param skill
+ */
+export function getAdvantageAdjustments(skill) {
+    return skill.advantageAdjustments;
+}
+/**
+ *
+ * @param skill
+ */
+export function getDisadvantageAdjustments(skill) {
+    return skill.disadvantageAdjustments;
+}
+/**
+ *
+ * @param skill
+ */
+export function getUsableDiceAdjustmentType(skill) {
+    return skill.usableDiceAdjustmentType;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Skill/derivers.js b/ddb_main/packages/rules-engine/es/engine/Skill/derivers.js
new file mode 100644
index 0000000..4f3c9b2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Skill/derivers.js
@@ -0,0 +1,45 @@
+import { AbilitySkillEnum, StealthCheckTypeEnum } from '../Core';
+import { DataOriginGenerators, DataOriginTypeEnum } from '../DataOrigin';
+import { DiceAdjustmentRollTypeEnum, DiceAdjustmentTypeEnum } from '../Dice';
+import { ItemAccessors } from '../Item';
+import { ModifierDerivers, ModifierValidators } from '../Modifier';
+import { hack__updateDisadvantageAdjustments } from './hacks';
+/**
+ *
+ * @param skill
+ * @param modifiers
+ */
+export function deriveAdvantageAdjustments(skill, modifiers) {
+    return modifiers
+        .filter((modifier) => ModifierValidators.isValidSkillAdvantageModifier(modifier, skill))
+        .map((modifier) => ModifierDerivers.deriveDiceAdjustment(modifier, DiceAdjustmentTypeEnum.ADVANTAGE));
+}
+/**
+ *
+ * @param skill
+ * @param modifiers
+ * @param equippedArmor
+ * @param nonProficientEquippedArmor
+ */
+export function deriveDisadvantageAdjustments(skill, modifiers, equippedArmor, nonProficientEquippedArmor) {
+    let skillDiceAdjustments = modifiers
+        .filter((modifier) => ModifierValidators.isValidSkillDisadvantageModifier(modifier, skill))
+        .map((modifier) => ModifierDerivers.deriveDiceAdjustment(modifier, DiceAdjustmentTypeEnum.DISADVANTAGE));
+    if (skill.id === AbilitySkillEnum.STEALTH) {
+        equippedArmor.forEach((item) => {
+            if (ItemAccessors.getStealthCheck(item) === StealthCheckTypeEnum.DISADVANTAGE) {
+                skillDiceAdjustments.push({
+                    type: DiceAdjustmentTypeEnum.DISADVANTAGE,
+                    rollType: DiceAdjustmentRollTypeEnum.ABILITY_CHECK,
+                    dataOrigin: DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.ITEM, item),
+                    restriction: 'with armor worn',
+                    uniqueKey: [ItemAccessors.getUniqueKey(item), 'INNATE'].join('-'),
+                    statId: null,
+                    amount: null,
+                });
+            }
+        });
+    }
+    skillDiceAdjustments = hack__updateDisadvantageAdjustments(skill, skillDiceAdjustments, nonProficientEquippedArmor);
+    return skillDiceAdjustments;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Skill/generators.js b/ddb_main/packages/rules-engine/es/engine/Skill/generators.js
new file mode 100644
index 0000000..0bb8eb6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Skill/generators.js
@@ -0,0 +1,211 @@
+import { keyBy } from 'lodash';
+import { AbilityDerivers } from '../Ability';
+import { CharacterDerivers } from '../Character';
+import { ProficiencyLevelEnum, ProficiencyRoundingEnum } from '../Core';
+import { DiceDerivers } from '../Dice';
+import { ItemUtils, ItemValidators } from '../Item';
+import { ModifierDerivers, ModifierValidators } from '../Modifier';
+import { RuleDataAccessors } from '../RuleData';
+import { AdjustmentTypeEnum, ValueHacks, ValueUtils } from '../Value';
+import { getId } from './accessors';
+import { deriveAdvantageAdjustments, deriveDisadvantageAdjustments } from './derivers';
+/**
+ *
+ * @param proficiencies
+ * @param proficiencyBonus
+ * @param abilityLookup
+ * @param modifiers
+ * @param equippedItems
+ */
+export function generateCustomSkills(proficiencies, proficiencyBonus, abilityLookup, modifiers, equippedItems) {
+    const equippedArmor = equippedItems.filter(ItemUtils.isArmorContract);
+    const nonProficientEquippedArmor = equippedItems.filter(ItemValidators.isNonProficientEquippedArmorItem);
+    return proficiencies.map((skill) => generateCustomSkill(skill, proficiencyBonus, abilityLookup, modifiers, equippedArmor, nonProficientEquippedArmor));
+}
+/**
+ *
+ * @param customSkill
+ * @param proficiencyBonus
+ * @param abilityLookup
+ * @param modifiers
+ * @param equippedArmor
+ * @param nonProficientEquippedArmor
+ */
+export function generateCustomSkill(customSkill, proficiencyBonus, abilityLookup, modifiers, equippedArmor, nonProficientEquippedArmor) {
+    var _a, _b, _c;
+    let modifier = null;
+    let statModifier = 0;
+    let skillProficiencyBonus = 0;
+    const proficiencyLevel = customSkill.proficiencyLevel ? customSkill.proficiencyLevel : ProficiencyLevelEnum.NONE;
+    const name = customSkill.name ? customSkill.name : 'Unknown Custom Skill';
+    if (customSkill.statId) {
+        statModifier = AbilityDerivers.deriveStatModifier(customSkill.statId, abilityLookup);
+        if (statModifier !== null) {
+            skillProficiencyBonus = CharacterDerivers.deriveProficiencyBonusAmount(proficiencyLevel, proficiencyBonus);
+        }
+    }
+    let modifierBonuses = 0;
+    if (customSkill.override !== null) {
+        modifier = customSkill.override;
+    }
+    else if (statModifier !== null) {
+        const miscBonus = (_a = customSkill.miscBonus) !== null && _a !== void 0 ? _a : 0;
+        const magicBonus = (_b = customSkill.magicBonus) !== null && _b !== void 0 ? _b : 0;
+        modifierBonuses = miscBonus + magicBonus;
+        modifier = statModifier + skillProficiencyBonus + modifierBonuses;
+    }
+    const simulatedSkillContract = {
+        description: null,
+        entityTypeId: -1,
+        id: -1,
+        name: null,
+        stat: (_c = customSkill.statId) !== null && _c !== void 0 ? _c : -1,
+    };
+    const advantageAdjustments = deriveAdvantageAdjustments(simulatedSkillContract, modifiers);
+    const disadvantageAdjustments = deriveDisadvantageAdjustments(simulatedSkillContract, modifiers, equippedArmor, nonProficientEquippedArmor);
+    return {
+        description: customSkill.description,
+        entityTypeId: -1,
+        id: customSkill.id,
+        name,
+        stat: customSkill.statId,
+        isOverridden: customSkill.override !== null,
+        modifier,
+        modifierBonuses,
+        expertise: proficiencyLevel === ProficiencyLevelEnum.EXPERT,
+        halfProficiency: proficiencyLevel === ProficiencyLevelEnum.HALF,
+        proficiency: proficiencyLevel === ProficiencyLevelEnum.FULL,
+        proficiencyLevel,
+        proficiencyBonus: skillProficiencyBonus,
+        notes: customSkill.notes,
+        statModifier,
+        isCustom: true,
+        originalContract: customSkill,
+        advantageAdjustments,
+        disadvantageAdjustments,
+        usableDiceAdjustmentType: DiceDerivers.deriveUsableDiceAdjustmentType(advantageAdjustments, disadvantageAdjustments),
+    };
+}
+/**
+ *
+ * @param skill
+ * @param abilityLookup
+ * @param modifiers
+ * @param proficiencyBonus
+ * @param valueLookup
+ * @param equippedArmor
+ * @param nonProficientEquippedArmor
+ */
+export function generateSkill(skill, abilityLookup, modifiers, proficiencyBonus, valueLookup, equippedArmor, nonProficientEquippedArmor) {
+    let stat = skill.stat;
+    const statOverride = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.SKILL_STAT_OVERRIDE, ValueHacks.hack__toString(skill.id), ValueHacks.hack__toString(skill.entityTypeId));
+    if (statOverride !== null) {
+        stat = statOverride;
+    }
+    const statModifier = AbilityDerivers.deriveStatModifier(stat, abilityLookup);
+    // This is done so that Modifier validators can check for correct stat ID
+    const overriddenSkill = Object.assign(Object.assign({}, skill), { stat });
+    let proficiencyLevel = ProficiencyLevelEnum.NONE;
+    let proficiencyRounding = ProficiencyRoundingEnum.DOWN;
+    let halfProficiency = false;
+    if (modifiers.filter((modifier) => ModifierValidators.isValidAbilitySkillHalfProficiencyModifier(modifier, overriddenSkill)).length) {
+        halfProficiency = true;
+        proficiencyLevel = ProficiencyLevelEnum.HALF;
+    }
+    if (modifiers.filter((modifier) => ModifierValidators.isValidAbilitySkillHalfProficiencyRoundUpModifier(modifier, overriddenSkill)).length) {
+        halfProficiency = true;
+        proficiencyRounding = ProficiencyRoundingEnum.UP;
+        proficiencyLevel = ProficiencyLevelEnum.HALF;
+    }
+    let proficiency = false;
+    if (modifiers.filter((modifier) => ModifierValidators.isValidAbilitySkillProficiencyModifier(modifier, overriddenSkill)).length) {
+        proficiency = true;
+        proficiencyLevel = ProficiencyLevelEnum.FULL;
+    }
+    let expertise = false;
+    if (modifiers.filter((modifier) => ModifierValidators.isValidAbilitySkillExpertiseModifier(modifier, overriddenSkill)).length) {
+        expertise = true;
+        proficiencyLevel = ProficiencyLevelEnum.EXPERT;
+    }
+    const levelOverride = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.SKILL_PROFICIENCY_LEVEL, ValueHacks.hack__toString(overriddenSkill.id), ValueHacks.hack__toString(overriddenSkill.entityTypeId));
+    if (levelOverride !== null) {
+        // TODO need to fix this ugliness to be based on proficiency level (components and half round up need to be considered)
+        switch (levelOverride) {
+            case ProficiencyLevelEnum.EXPERT:
+                halfProficiency = false;
+                proficiencyRounding = ProficiencyRoundingEnum.DOWN;
+                proficiency = false;
+                expertise = true;
+                break;
+            case ProficiencyLevelEnum.FULL:
+                halfProficiency = false;
+                proficiencyRounding = ProficiencyRoundingEnum.DOWN;
+                proficiency = true;
+                expertise = false;
+                break;
+            case ProficiencyLevelEnum.HALF:
+                halfProficiency = true;
+                proficiencyRounding = ProficiencyRoundingEnum.DOWN;
+                proficiency = false;
+                expertise = false;
+                break;
+            case ProficiencyLevelEnum.NONE:
+                halfProficiency = false;
+                proficiencyRounding = ProficiencyRoundingEnum.DOWN;
+                proficiency = false;
+                expertise = false;
+                break;
+            default:
+            // not implemented
+        }
+        proficiencyLevel = levelOverride;
+    }
+    const overrideValue = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.SKILL_OVERRIDE, ValueHacks.hack__toString(overriddenSkill.id), ValueHacks.hack__toString(overriddenSkill.entityTypeId));
+    let modifier = 0;
+    let modifierBonuses = 0;
+    let skillProficiencyBonus = 0;
+    const isOverridden = overrideValue !== null;
+    if (!isOverridden) {
+        const bonusAbilitySkillModifiers = modifiers.filter((modifier) => ModifierValidators.isValidAbilitySkillBonusModifier(modifier, overriddenSkill));
+        const bonusAbilitySkillModifierTotal = ModifierDerivers.sumModifiers(bonusAbilitySkillModifiers, abilityLookup);
+        const miscBonus = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.SKILL_MISC_BONUS, ValueHacks.hack__toString(overriddenSkill.id), ValueHacks.hack__toString(overriddenSkill.entityTypeId), 0);
+        const magicBonus = ValueUtils.getKeyValue(valueLookup, AdjustmentTypeEnum.SKILL_MAGIC_BONUS, ValueHacks.hack__toString(overriddenSkill.id), ValueHacks.hack__toString(overriddenSkill.entityTypeId), 0);
+        modifierBonuses = miscBonus + magicBonus + bonusAbilitySkillModifierTotal;
+        skillProficiencyBonus = CharacterDerivers.deriveProficiencyBonusAmount(proficiencyLevel, proficiencyBonus, proficiencyRounding);
+        modifier = statModifier + skillProficiencyBonus + modifierBonuses;
+    }
+    else {
+        modifier = overrideValue;
+    }
+    const advantageAdjustments = deriveAdvantageAdjustments(overriddenSkill, modifiers);
+    const disadvantageAdjustments = deriveDisadvantageAdjustments(overriddenSkill, modifiers, equippedArmor, nonProficientEquippedArmor);
+    return Object.assign(Object.assign({}, overriddenSkill), { statModifier,
+        modifier,
+        modifierBonuses, proficiencyBonus: skillProficiencyBonus, proficiencyLevel,
+        proficiency,
+        halfProficiency,
+        expertise,
+        isOverridden, isCustom: false, notes: null, originalContract: null, advantageAdjustments,
+        disadvantageAdjustments, usableDiceAdjustmentType: DiceDerivers.deriveUsableDiceAdjustmentType(advantageAdjustments, disadvantageAdjustments) });
+}
+/**
+ *
+ * @param abilityLookup
+ * @param modifiers
+ * @param proficiencyBonus
+ * @param ruleData
+ * @param valueLookup
+ * @param equippedItems
+ */
+export function generateSkills(abilityLookup, modifiers, proficiencyBonus, ruleData, valueLookup, equippedItems) {
+    const equippedArmor = equippedItems.filter(ItemUtils.isArmorContract);
+    const nonProficientEquippedArmor = equippedItems.filter(ItemValidators.isNonProficientEquippedArmorItem);
+    return RuleDataAccessors.getAbilitySkills(ruleData).map((skill) => generateSkill(skill, abilityLookup, modifiers, proficiencyBonus, valueLookup, equippedArmor, nonProficientEquippedArmor));
+}
+/**
+ *
+ * @param skills
+ */
+export function generateSkillLookup(skills) {
+    return keyBy(skills, (skill) => getId(skill));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Skill/hacks.js b/ddb_main/packages/rules-engine/es/engine/Skill/hacks.js
new file mode 100644
index 0000000..d70a32c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Skill/hacks.js
@@ -0,0 +1,32 @@
+import { AbilityStatEnum } from '../Core';
+import { DataOriginGenerators, DataOriginTypeEnum } from '../DataOrigin';
+import { DiceAdjustmentRollTypeEnum, DiceAdjustmentTypeEnum } from '../Dice';
+import { ItemAccessors } from '../Item';
+/**
+ *
+ * @param skill
+ * @param skillDiceAdjustments
+ * @param nonProficientEquippedArmor
+ */
+export function hack__updateDisadvantageAdjustments(skill, skillDiceAdjustments, nonProficientEquippedArmor) {
+    const newDiceAdjustments = [];
+    switch (skill.stat) {
+        case AbilityStatEnum.STRENGTH:
+        case AbilityStatEnum.DEXTERITY:
+            nonProficientEquippedArmor.forEach((item) => {
+                newDiceAdjustments.push({
+                    type: DiceAdjustmentTypeEnum.DISADVANTAGE,
+                    rollType: DiceAdjustmentRollTypeEnum.ABILITY_CHECK,
+                    dataOrigin: DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.ITEM, item),
+                    restriction: 'when not proficient with armor worn',
+                    uniqueKey: [ItemAccessors.getUniqueKey(item), 'NOT_PROFICIENT'].join('-'),
+                    statId: null,
+                    amount: null,
+                });
+            });
+            break;
+        default:
+        // not implemented;
+    }
+    return [...skillDiceAdjustments, ...newDiceAdjustments];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Skill/index.js b/ddb_main/packages/rules-engine/es/engine/Skill/index.js
new file mode 100644
index 0000000..6c758d4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Skill/index.js
@@ -0,0 +1,8 @@
+import * as SkillAccessors from './accessors';
+import * as SkillDerivers from './derivers';
+import * as SkillGenerators from './generators';
+import * as SkillTypings from './typings';
+import * as SkillValidators from './validators';
+export * from './typings';
+export { SkillAccessors, SkillDerivers, SkillGenerators, SkillValidators };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, SkillAccessors), SkillDerivers), SkillGenerators), SkillTypings), SkillValidators);
diff --git a/ddb_main/packages/rules-engine/es/engine/Skill/validators.js b/ddb_main/packages/rules-engine/es/engine/Skill/validators.js
new file mode 100644
index 0000000..0371da9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Skill/validators.js
@@ -0,0 +1,23 @@
+import { UsableDiceAdjustmentTypeEnum } from '../Dice';
+import { getUsableDiceAdjustmentType } from './accessors';
+/**
+ *
+ * @param skill
+ */
+export function isAdvantageUsableDiceAdjustmentType(skill) {
+    return getUsableDiceAdjustmentType(skill) === UsableDiceAdjustmentTypeEnum.ADVANTAGE;
+}
+/**
+ *
+ * @param skill
+ */
+export function isDisadvantageUsableDiceAdjustmentType(skill) {
+    return getUsableDiceAdjustmentType(skill) === UsableDiceAdjustmentTypeEnum.DISADVANTAGE;
+}
+/**
+ *
+ * @param skill
+ */
+export function isAdvantageDisadvantageUsableDiceAdjustmentType(skill) {
+    return getUsableDiceAdjustmentType(skill) === UsableDiceAdjustmentTypeEnum.ADVANTAGE_DISADVANTAGE;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Snippet/constants.js b/ddb_main/packages/rules-engine/es/engine/Snippet/constants.js
new file mode 100644
index 0000000..c1461c1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Snippet/constants.js
@@ -0,0 +1,64 @@
+export var SnippetSymbolEnum;
+(function (SnippetSymbolEnum) {
+    SnippetSymbolEnum["POST_PROCESS"] = "#";
+    SnippetSymbolEnum["VALUE_MODIFIER"] = "@";
+    SnippetSymbolEnum["PARAMETER"] = ":";
+    SnippetSymbolEnum["LIST_OPTION"] = ",";
+})(SnippetSymbolEnum || (SnippetSymbolEnum = {}));
+export var SnippetMathOperatorEnum;
+(function (SnippetMathOperatorEnum) {
+    SnippetMathOperatorEnum["ADDITION"] = "+";
+    SnippetMathOperatorEnum["SUBTRACTION"] = "-";
+    SnippetMathOperatorEnum["DIVISION"] = "/";
+    SnippetMathOperatorEnum["MULTIPLICATION"] = "*";
+})(SnippetMathOperatorEnum || (SnippetMathOperatorEnum = {}));
+export var SnippetTagValueTypeEnum;
+(function (SnippetTagValueTypeEnum) {
+    SnippetTagValueTypeEnum["SAVE_DC"] = "savedc";
+    SnippetTagValueTypeEnum["SPELL_ATTACK"] = "spellattack";
+    SnippetTagValueTypeEnum["SCALE_VALUE"] = "scalevalue";
+    SnippetTagValueTypeEnum["MODIFIER"] = "modifier";
+    SnippetTagValueTypeEnum["ABILITY_SCORE"] = "abilityscore";
+    SnippetTagValueTypeEnum["FIXED_VALUE"] = "fixedvalue";
+    SnippetTagValueTypeEnum["CLASS_LEVEL"] = "classlevel";
+    SnippetTagValueTypeEnum["CHARACTER_LEVEL"] = "characterlevel";
+    SnippetTagValueTypeEnum["PROFICIENCY"] = "proficiency";
+    SnippetTagValueTypeEnum["MAX_HP"] = "maxhp";
+    SnippetTagValueTypeEnum["LIMITED_USE"] = "limiteduse";
+})(SnippetTagValueTypeEnum || (SnippetTagValueTypeEnum = {}));
+export var SnippetValueModifierTypeEnum;
+(function (SnippetValueModifierTypeEnum) {
+    SnippetValueModifierTypeEnum["MIN"] = "min";
+    SnippetValueModifierTypeEnum["MAX"] = "max";
+    SnippetValueModifierTypeEnum["ROUND_DOWN"] = "rounddown";
+    SnippetValueModifierTypeEnum["ROUND_UP"] = "roundup";
+})(SnippetValueModifierTypeEnum || (SnippetValueModifierTypeEnum = {}));
+export var SnippetPostProcessTypeEnum;
+(function (SnippetPostProcessTypeEnum) {
+    SnippetPostProcessTypeEnum["SIGNED_NUMBER"] = "signed";
+    SnippetPostProcessTypeEnum["UNSIGNED_NUMBER"] = "unsigned";
+    SnippetPostProcessTypeEnum["MIN"] = "min";
+    SnippetPostProcessTypeEnum["MAX"] = "max";
+    SnippetPostProcessTypeEnum["ROUND_UP"] = "roundup";
+    SnippetPostProcessTypeEnum["ROUND_DOWN"] = "rounddown";
+})(SnippetPostProcessTypeEnum || (SnippetPostProcessTypeEnum = {}));
+export var SnippetAbilityKeyEnum;
+(function (SnippetAbilityKeyEnum) {
+    SnippetAbilityKeyEnum["STRENGTH"] = "str";
+    SnippetAbilityKeyEnum["DEXTERITY"] = "dex";
+    SnippetAbilityKeyEnum["CONSTITUTION"] = "con";
+    SnippetAbilityKeyEnum["INTELLIGENCE"] = "int";
+    SnippetAbilityKeyEnum["WISDOM"] = "wis";
+    SnippetAbilityKeyEnum["CHARISMA"] = "cha";
+})(SnippetAbilityKeyEnum || (SnippetAbilityKeyEnum = {}));
+export var SnippetContentChunkTypeEnum;
+(function (SnippetContentChunkTypeEnum) {
+    SnippetContentChunkTypeEnum["TEXT"] = "TEXT";
+    SnippetContentChunkTypeEnum["TAG"] = "TAG";
+})(SnippetContentChunkTypeEnum || (SnippetContentChunkTypeEnum = {}));
+export var SnippetTagDataTypeEnum;
+(function (SnippetTagDataTypeEnum) {
+    SnippetTagDataTypeEnum["STRING"] = "STRING";
+    SnippetTagDataTypeEnum["NUMBER"] = "NUMBER";
+    SnippetTagDataTypeEnum["ERROR"] = "ERROR";
+})(SnippetTagDataTypeEnum || (SnippetTagDataTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Snippet/generators.js b/ddb_main/packages/rules-engine/es/engine/Snippet/generators.js
new file mode 100644
index 0000000..a3c8ead
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Snippet/generators.js
@@ -0,0 +1,19 @@
+/**
+ *
+ * @param proficiencyBonus
+ * @param abilityKeyLookup
+ * @param abilityLookup
+ * @param xpInfo
+ * @param hitPointInfo
+ * @param ruleData
+ */
+export function generateSnippetData(proficiencyBonus, abilityKeyLookup, abilityLookup, xpInfo, hitPointInfo, ruleData) {
+    return {
+        proficiencyBonus,
+        abilityKeyLookup,
+        abilityLookup,
+        xpInfo,
+        hitPointInfo,
+        ruleData,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Snippet/index.js b/ddb_main/packages/rules-engine/es/engine/Snippet/index.js
new file mode 100644
index 0000000..f4a2795
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Snippet/index.js
@@ -0,0 +1,8 @@
+import * as SnippetConstants from './constants';
+import * as SnippetGenerators from './generators';
+import * as SnippetTypings from './typings';
+import * as SnippetUtils from './utils';
+export * from './constants';
+export * from './typings';
+export { SnippetGenerators, SnippetUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign({}, SnippetConstants), SnippetGenerators), SnippetTypings), SnippetUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Snippet/utils.js b/ddb_main/packages/rules-engine/es/engine/Snippet/utils.js
new file mode 100644
index 0000000..9f22835
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Snippet/utils.js
@@ -0,0 +1,917 @@
+import { isFinite, toNumber } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { AbilityAccessors } from '../Ability';
+import { CharacterDerivers } from '../Character';
+import { DiceRenderers } from '../Dice';
+import { FormatUtils } from '../Format';
+import { LimitedUseDerivers } from '../LimitedUse';
+import { SpellDerivers } from '../Spell';
+import { SnippetAbilityKeyEnum, SnippetContentChunkTypeEnum, SnippetMathOperatorEnum, SnippetPostProcessTypeEnum, SnippetSymbolEnum, SnippetTagDataTypeEnum, SnippetTagValueTypeEnum, SnippetValueModifierTypeEnum, } from './constants';
+const snippetTagValues = Object.keys(SnippetTagValueTypeEnum)
+    .map((tagValueType) => SnippetTagValueTypeEnum[tagValueType])
+    .join('|')
+    .toLowerCase();
+const groupFragmentRegExpr = new RegExp(['\\(([^\\(\\)]*?)\\)(?:', SnippetSymbolEnum.VALUE_MODIFIER, '([^+*\\-\\/]+)?)?'].join(''));
+const tagValueRegExpr = new RegExp([
+    '((?:',
+    snippetTagValues,
+    ')(?:\\',
+    SnippetSymbolEnum.PARAMETER,
+    '[^',
+    SnippetSymbolEnum.VALUE_MODIFIER,
+    '+*\\-\\/]+)?)(?:',
+    SnippetSymbolEnum.VALUE_MODIFIER,
+    '([^+*\\-\\/]+)?)?',
+].join(''));
+/**
+ *
+ * @param key
+ */
+export function validateAbilityKey(key) {
+    if (!isSnippetAbilityKeyEnum(key)) {
+        throw new Error(`Invalid Ability Key: ${key}`);
+    }
+}
+/**
+ *
+ * @param key
+ */
+export function isSnippetAbilityKeyEnum(key) {
+    switch (key) {
+        case SnippetAbilityKeyEnum.STRENGTH:
+        case SnippetAbilityKeyEnum.DEXTERITY:
+        case SnippetAbilityKeyEnum.CONSTITUTION:
+        case SnippetAbilityKeyEnum.INTELLIGENCE:
+        case SnippetAbilityKeyEnum.WISDOM:
+        case SnippetAbilityKeyEnum.CHARISMA:
+            return true;
+        default:
+        // not implemented
+    }
+    return false;
+}
+/**
+ *
+ * @param key
+ */
+export function isSnippetValueModifierTypeEnum(key) {
+    switch (key) {
+        case SnippetValueModifierTypeEnum.MAX:
+        case SnippetValueModifierTypeEnum.MIN:
+        case SnippetValueModifierTypeEnum.ROUND_DOWN:
+        case SnippetValueModifierTypeEnum.ROUND_UP:
+            return true;
+        default:
+        // not implemented
+    }
+    return false;
+}
+/**
+ *
+ * @param key
+ */
+export function isSnippetPostProcessTypeEnum(key) {
+    switch (key) {
+        case SnippetPostProcessTypeEnum.MAX:
+        case SnippetPostProcessTypeEnum.MIN:
+        case SnippetPostProcessTypeEnum.ROUND_DOWN:
+        case SnippetPostProcessTypeEnum.ROUND_UP:
+        case SnippetPostProcessTypeEnum.SIGNED_NUMBER:
+        case SnippetPostProcessTypeEnum.UNSIGNED_NUMBER:
+            return true;
+        default:
+        // not implemented
+    }
+    return false;
+}
+/**
+ *
+ * @param key
+ */
+export function isSnippetTagValueTypeEnum(key) {
+    switch (key) {
+        case SnippetTagValueTypeEnum.SCALE_VALUE:
+        case SnippetTagValueTypeEnum.LIMITED_USE:
+        case SnippetTagValueTypeEnum.CLASS_LEVEL:
+        case SnippetTagValueTypeEnum.ABILITY_SCORE:
+        case SnippetTagValueTypeEnum.CHARACTER_LEVEL:
+        case SnippetTagValueTypeEnum.MAX_HP:
+        case SnippetTagValueTypeEnum.PROFICIENCY:
+        case SnippetTagValueTypeEnum.SPELL_ATTACK:
+        case SnippetTagValueTypeEnum.SAVE_DC:
+        case SnippetTagValueTypeEnum.MODIFIER:
+        case SnippetTagValueTypeEnum.FIXED_VALUE:
+            return true;
+        default:
+        // not implemented
+    }
+    return false;
+}
+/**
+ *
+ * @param type
+ */
+export function isSignedTagValueType(type) {
+    switch (type) {
+        case SnippetTagValueTypeEnum.SPELL_ATTACK:
+        case SnippetTagValueTypeEnum.MODIFIER:
+            return true;
+        default:
+        // not implemented
+    }
+    return false;
+}
+/**
+ *
+ * @param contextData
+ */
+export function isLevelScaleFixedValue(contextData) {
+    if (!contextData.levelScale) {
+        return false;
+    }
+    return contextData.levelScale.fixedValue !== null && contextData.levelScale.dice === null;
+}
+/**
+ *
+ * @param rawSnippetTag
+ * @param contextData
+ */
+export function isValidStringTagValueType(rawSnippetTag, contextData) {
+    const tagValueStringTypesRegExp = new RegExp(['^(', [SnippetTagValueTypeEnum.SCALE_VALUE].join('|').toLowerCase(), ')$'].join(''));
+    let match = rawSnippetTag.match(tagValueStringTypesRegExp);
+    if (match) {
+        switch (match[1]) {
+            case SnippetTagValueTypeEnum.SCALE_VALUE:
+                return !isLevelScaleFixedValue(contextData);
+            default:
+            // not implemented
+        }
+    }
+    return false;
+}
+/**
+ *
+ * @param type
+ */
+export function isLastPostProcessType(type) {
+    switch (type) {
+        case SnippetPostProcessTypeEnum.SIGNED_NUMBER:
+        case SnippetPostProcessTypeEnum.UNSIGNED_NUMBER:
+            return true;
+    }
+    return false;
+}
+/**
+ *
+ * @param numberString
+ */
+export function isParsableNumber(numberString) {
+    return !isNaN(toNumber(numberString)) || numberString === '-' || numberString === '.';
+}
+/**
+ *
+ * @param expression
+ * @param operator
+ */
+export function hasOperator(expression, operator) {
+    return expression.indexOf(operator) > -1;
+}
+/**
+ *
+ * @param str
+ */
+export function throwMismatchedParens(str) {
+    let level = 0;
+    for (let i = 0; i < str.length; i++) {
+        let char = str[i];
+        if (char === '(') {
+            level += 1;
+        }
+        if (char === ')') {
+            if (level === 0) {
+                throw new Error('Mismatching parenthesis');
+            }
+            level -= 1;
+        }
+    }
+    if (level !== 0) {
+        throw new Error('Mismatching parenthesis');
+    }
+}
+/**
+ *
+ * @param str
+ */
+export function throwInvalidSnippetCharacters(str) {
+    const keywordMatches = str.match(/[a-z]+/g);
+    keywordMatches === null || keywordMatches === void 0 ? void 0 : keywordMatches.forEach((keyword) => {
+        if (isSnippetTagValueTypeEnum(keyword) ||
+            isSnippetAbilityKeyEnum(keyword) ||
+            isSnippetValueModifierTypeEnum(keyword) ||
+            isSnippetPostProcessTypeEnum(keyword)) {
+            return;
+        }
+        else {
+            throw new Error(`Invalid keyword: ${keyword}`);
+        }
+    });
+    const invalidSymbolMatches = str.match(/[^a-z\d+*\-\/#@:,()]/);
+    if (invalidSymbolMatches) {
+        throw new Error(`Invalid symbol: ${invalidSymbolMatches[0]}`);
+    }
+    const invalidValueModifierMatches = str.match(/[^a-z@)]+(@[a-z,:\d]*)/);
+    if (invalidValueModifierMatches) {
+        throw new Error(`Value modifier cannot be used at current location: ${invalidValueModifierMatches[1]}`);
+    }
+}
+/**
+ *
+ * @param str
+ */
+export function deriveFormattedTag(str) {
+    return str
+        .toLowerCase()
+        .replace(/\s+/g, '')
+        .replace(/-\(/g, '-1*(')
+        .replace(/\)\(/g, ')*(')
+        .replace(/-/g, '+-')
+        .replace(/--/g, '+')
+        .replace(/\+\+/g, '+')
+        .replace(/\(\+/g, '(')
+        .replace(/(\d)\(/g, '$1*(')
+        .replace(/^\++/, '');
+}
+/**
+ *
+ * @param str
+ */
+export function deriveListOptions(str) {
+    return str.split(SnippetSymbolEnum.LIST_OPTION);
+}
+/**
+ *
+ * @param stats
+ * @param snippetData
+ */
+export function deriveStatModifierValue(stats, snippetData) {
+    const modifierValues = stats
+        .map((statKey) => {
+        validateAbilityKey(statKey);
+        return AbilityAccessors.getModifier(snippetData.abilityKeyLookup[statKey]);
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    return Math.max(...modifierValues);
+}
+/**
+ *
+ * @param stats
+ * @param snippetData
+ */
+export function deriveAbilityScoreValue(stats, snippetData) {
+    const modifierValues = stats
+        .map((statKey) => {
+        validateAbilityKey(statKey);
+        return AbilityAccessors.getScore(snippetData.abilityKeyLookup[statKey]);
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    return Math.max(...modifierValues);
+}
+/**
+ *
+ * @param contextData
+ */
+export function deriveLevelScaleDiceValue(contextData) {
+    if (!contextData.levelScale) {
+        throw new Error('No level scale data available');
+    }
+    if (contextData.levelScale.dice === null) {
+        throw new Error('Has level scale, but no dice value available');
+    }
+    return DiceRenderers.renderDice(contextData.levelScale.dice);
+}
+/**
+ *
+ * @param contextData
+ */
+export function deriveLevelScaleFixedValue(contextData) {
+    if (!contextData.levelScale) {
+        throw new Error('No level scale data available');
+    }
+    if (contextData.levelScale.fixedValue === null) {
+        throw new Error('Has level scale, but no numeric value available');
+    }
+    return contextData.levelScale.fixedValue;
+}
+/**
+ *
+ * @param tagValue
+ * @param contextData
+ */
+export function deriveStringTagValue(tagValue, contextData) {
+    const { type, params } = tagValue;
+    switch (type) {
+        case SnippetTagValueTypeEnum.SCALE_VALUE:
+            return deriveLevelScaleDiceValue(contextData);
+    }
+    throw new Error('Unknown string tag');
+}
+/**
+ *
+ * @param tagValue
+ * @param contextData
+ * @param snippetData
+ * @param proficiencyBonus
+ */
+export function deriveNumericTagValue(tagValue, contextData, snippetData, proficiencyBonus) {
+    const { type, params } = tagValue;
+    let value = 0;
+    switch (type) {
+        case SnippetTagValueTypeEnum.SAVE_DC:
+            if (params.length < 1) {
+                throw new Error('Save DC missing ability key');
+            }
+            return CharacterDerivers.deriveAttackSaveValue(snippetData.proficiencyBonus, deriveStatModifierValue(deriveListOptions(params[0]), snippetData));
+        case SnippetTagValueTypeEnum.SPELL_ATTACK:
+            if (params.length < 1) {
+                throw new Error('Spell attack missing ability key');
+            }
+            return SpellDerivers.deriveSpellAttackModifier(snippetData.proficiencyBonus, deriveStatModifierValue(deriveListOptions(params[0]), snippetData));
+        case SnippetTagValueTypeEnum.MODIFIER: {
+            if (params.length < 1) {
+                throw new Error('Modifier missing ability key');
+            }
+            return deriveStatModifierValue(deriveListOptions(params[0]), snippetData);
+        }
+        case SnippetTagValueTypeEnum.ABILITY_SCORE: {
+            if (params.length < 1) {
+                throw new Error('Ability score missing ability key');
+            }
+            return deriveAbilityScoreValue(deriveListOptions(params[0]), snippetData);
+        }
+        case SnippetTagValueTypeEnum.SCALE_VALUE:
+            return deriveLevelScaleFixedValue(contextData);
+        case SnippetTagValueTypeEnum.FIXED_VALUE:
+            if (params.length < 1) {
+                throw new Error('Fixed value is missing');
+            }
+            value = toNumber(params[0]);
+            if (!isFinite(value)) {
+                throw new Error('Fixed value is not a number');
+            }
+            return value;
+        case SnippetTagValueTypeEnum.CLASS_LEVEL: {
+            if (!contextData.classLevel) {
+                throw new Error('No class level data available');
+            }
+            return contextData.classLevel;
+        }
+        case SnippetTagValueTypeEnum.CHARACTER_LEVEL: {
+            return snippetData.xpInfo.currentLevel;
+        }
+        case SnippetTagValueTypeEnum.PROFICIENCY: {
+            return snippetData.proficiencyBonus;
+        }
+        case SnippetTagValueTypeEnum.MAX_HP: {
+            return snippetData.hitPointInfo.totalHp;
+        }
+        case SnippetTagValueTypeEnum.LIMITED_USE: {
+            if (!contextData.limitedUse) {
+                throw new Error('No limited use data available');
+            }
+            return LimitedUseDerivers.deriveMaxUses(contextData.limitedUse, snippetData.abilityLookup, snippetData.ruleData, proficiencyBonus);
+        }
+    }
+}
+/**
+ *
+ * @param str
+ */
+export function parseSnippetParams(str) {
+    if (!str.length) {
+        throw new Error('Invalid parameter');
+    }
+    const [key, ...params] = str.split(SnippetSymbolEnum.PARAMETER);
+    if (!key.length) {
+        throw new Error('Invalid parameter key');
+    }
+    return {
+        key,
+        params: params.filter(Boolean),
+    };
+}
+/**
+ *
+ * @param str
+ */
+export function parseSnippetPostProcessParams(str) {
+    const { key, params } = parseSnippetParams(str);
+    if (!isSnippetPostProcessTypeEnum(key)) {
+        throw new Error(`Unknown post process type: ${key}`);
+    }
+    return {
+        type: key,
+        params,
+    };
+}
+/**
+ *
+ * @param str
+ */
+export function parseSnippetTagValue(str) {
+    const { key, params } = parseSnippetParams(str);
+    if (!isSnippetTagValueTypeEnum(key)) {
+        throw new Error(`Unknown value type: ${key}`);
+    }
+    return {
+        type: key,
+        params,
+    };
+}
+/**
+ *
+ * @param str
+ */
+export function parseSnippetValueModifierParams(str) {
+    const { key, params } = parseSnippetParams(str);
+    if (!isSnippetValueModifierTypeEnum(key)) {
+        throw new Error(`Unknown value modifier type: ${key}`);
+    }
+    return {
+        type: key,
+        params,
+    };
+}
+/**
+ *
+ * @param str
+ */
+export function parseRawTagInfo(str) {
+    if (!str.length) {
+        throw new Error('Invalid tag');
+    }
+    const [expression, rawPostProcess] = str.split(SnippetSymbolEnum.POST_PROCESS);
+    if (!expression.length) {
+        throw new Error('Missing tag expression');
+    }
+    let postProcess = rawPostProcess;
+    if (rawPostProcess === undefined || rawPostProcess === '') {
+        postProcess = null;
+    }
+    return {
+        expression,
+        postProcess,
+    };
+}
+/**
+ *
+ * @param value
+ * @param valueModifierString
+ */
+export function applyValueModifierString(value, valueModifierString) {
+    let modifiedValue = value;
+    const valueModifiers = deriveListOptions(valueModifierString);
+    valueModifiers.forEach((valueModifierString) => {
+        const { type, params } = parseSnippetValueModifierParams(valueModifierString);
+        modifiedValue = deriveModifiedValue(modifiedValue, type, params);
+    });
+    return modifiedValue;
+}
+/**
+ *
+ * @param value
+ * @param postProcessesString
+ * @param intrinsicSignedNumber
+ */
+export function applyPostProcessString(value, postProcessesString, intrinsicSignedNumber = false) {
+    if (typeof value === 'string' && !value) {
+        return value;
+    }
+    let processedValue = value;
+    let postProcesses = postProcessesString === null || !postProcessesString.length ? [] : deriveListOptions(postProcessesString);
+    if (intrinsicSignedNumber &&
+        !postProcesses.includes(SnippetPostProcessTypeEnum.SIGNED_NUMBER) &&
+        !postProcesses.includes(SnippetPostProcessTypeEnum.UNSIGNED_NUMBER)) {
+        postProcesses = [...postProcesses, SnippetPostProcessTypeEnum.SIGNED_NUMBER];
+    }
+    postProcesses.forEach((postProcessString, idx) => {
+        const { type, params } = parseSnippetPostProcessParams(postProcessString);
+        const isLast = idx + 1 === postProcesses.length;
+        if (isLastPostProcessType(type) && !isLast) {
+            throw new Error(`"${type}" post process must be the last to run`);
+        }
+        processedValue = derivePostProcessedValue(processedValue, type, params);
+    });
+    return processedValue;
+}
+/**
+ *
+ * @param value
+ * @param modifierType
+ * @param params
+ */
+export function deriveModifiedValue(value, modifierType, params) {
+    switch (modifierType) {
+        case SnippetValueModifierTypeEnum.MAX:
+            if (params.length < 1) {
+                throw new Error('Max value modifier is missing a number');
+            }
+            const maxValue = toNumber(params[0]);
+            if (!isFinite(maxValue)) {
+                throw new Error('Max value modifier is not a number');
+            }
+            return Math.min(maxValue, value);
+        case SnippetValueModifierTypeEnum.MIN:
+            if (params.length < 1) {
+                throw new Error('Min value modifier is missing a number');
+            }
+            const minValue = toNumber(params[0]);
+            if (!isFinite(minValue)) {
+                throw new Error('Min value modifier is not a number');
+            }
+            return Math.max(minValue, value);
+        case SnippetValueModifierTypeEnum.ROUND_UP:
+            return Math.ceil(value);
+        case SnippetValueModifierTypeEnum.ROUND_DOWN:
+            return Math.floor(value);
+    }
+}
+/**
+ *
+ * @param value
+ * @param type
+ * @param params
+ */
+export function derivePostProcessedValue(value, type, params) {
+    switch (type) {
+        case SnippetPostProcessTypeEnum.MAX:
+            if (typeof value !== 'number') {
+                throw new Error('Max post process must be used on number value');
+            }
+            if (params.length < 1) {
+                throw new Error('Max post process is missing a number');
+            }
+            const maxValue = toNumber(params[0]);
+            return Math.min(maxValue, value);
+        case SnippetPostProcessTypeEnum.MIN:
+            if (typeof value !== 'number') {
+                throw new Error('Min post process must be used on number value');
+            }
+            if (params.length < 1) {
+                throw new Error('Min post process is missing a number');
+            }
+            const minValue = toNumber(params[0]);
+            return Math.max(minValue, value);
+        case SnippetPostProcessTypeEnum.ROUND_DOWN:
+            if (typeof value !== 'number') {
+                throw new Error('Post process value being rounded is not a number');
+            }
+            return Math.floor(value);
+        case SnippetPostProcessTypeEnum.ROUND_UP:
+            if (typeof value !== 'number') {
+                throw new Error('Post process value being rounded is not a number');
+            }
+            return Math.ceil(value);
+        case SnippetPostProcessTypeEnum.SIGNED_NUMBER:
+            if (typeof value !== 'number') {
+                return value;
+            }
+            return FormatUtils.renderSignedNumber(value);
+        case SnippetPostProcessTypeEnum.UNSIGNED_NUMBER:
+            return value;
+    }
+}
+/**
+ *
+ * @param haystack
+ * @param operatorIdx
+ * @param direction
+ */
+export function deriveExpressionValueFragmentSide(haystack, operatorIdx, direction) {
+    const limit = direction == -1 ? 0 : haystack.length;
+    let i = operatorIdx + direction;
+    let term = '';
+    while (i * direction <= limit) {
+        if (isParsableNumber(haystack[i])) {
+            if (direction == 1) {
+                term = term + haystack[i];
+            }
+            else {
+                term = haystack[i] + term;
+            }
+            i += direction;
+        }
+        else {
+            return term;
+        }
+    }
+    return term;
+}
+/**
+ *
+ * @param expression
+ * @param operator
+ */
+export function deriveExpressionValueFragment(expression, operator) {
+    if (hasOperator(expression, operator)) {
+        const middleIndex = expression.indexOf(operator);
+        const left = deriveExpressionValueFragmentSide(expression, middleIndex, -1);
+        const right = deriveExpressionValueFragmentSide(expression, middleIndex, 1);
+        const value = deriveExpressionValue(left, right, operator);
+        return expression.replace(left + operator + right, value.toString());
+    }
+    return expression;
+}
+/**
+ *
+ * @param left
+ * @param right
+ * @param operator
+ */
+export function deriveExpressionValue(left, right, operator) {
+    switch (operator) {
+        case SnippetMathOperatorEnum.ADDITION:
+            return parseFloat(left) + parseFloat(right);
+        case SnippetMathOperatorEnum.MULTIPLICATION:
+            return parseFloat(left) * parseFloat(right);
+        case SnippetMathOperatorEnum.DIVISION:
+            return parseFloat(left) / parseFloat(right);
+        case SnippetMathOperatorEnum.SUBTRACTION:
+            return parseFloat(left) - parseFloat(right);
+    }
+}
+/**
+ *
+ * @param expression
+ */
+export function deriveExpression(expression) {
+    while (hasOperator(expression, SnippetMathOperatorEnum.MULTIPLICATION) ||
+        hasOperator(expression, SnippetMathOperatorEnum.DIVISION)) {
+        let multiply = true;
+        if (expression.indexOf(SnippetMathOperatorEnum.MULTIPLICATION) <
+            expression.indexOf(SnippetMathOperatorEnum.DIVISION)) {
+            multiply = hasOperator(expression, SnippetMathOperatorEnum.MULTIPLICATION);
+        }
+        else {
+            multiply = !hasOperator(expression, SnippetMathOperatorEnum.DIVISION);
+        }
+        if (multiply) {
+            expression = deriveExpressionValueFragment(expression, SnippetMathOperatorEnum.MULTIPLICATION);
+        }
+        else {
+            expression = deriveExpressionValueFragment(expression, SnippetMathOperatorEnum.DIVISION);
+        }
+    }
+    while (hasOperator(expression, SnippetMathOperatorEnum.ADDITION)) {
+        expression = deriveExpressionValueFragment(expression, SnippetMathOperatorEnum.ADDITION);
+    }
+    return toNumber(expression);
+}
+/**
+ *
+ * @param tagExpression
+ * @param contextData
+ * @param snippetData
+ * @param proficiencyBonus
+ */
+export function generateFragmentExpression(tagExpression, contextData, snippetData, proficiencyBonus) {
+    let hasSignedValue = false;
+    let updatedExpression = tagExpression;
+    let match;
+    while ((match = updatedExpression.match(tagValueRegExpr))) {
+        const tagRaw = match[0];
+        const tagValue = match[1];
+        const tagValueModifier = match[2];
+        const snippetTagValue = parseSnippetTagValue(tagValue);
+        if (!hasSignedValue) {
+            hasSignedValue = isSignedTagValueType(snippetTagValue.type);
+        }
+        let value = deriveNumericTagValue(snippetTagValue, contextData, snippetData, proficiencyBonus);
+        if (tagValueModifier) {
+            value = applyValueModifierString(value, tagValueModifier);
+        }
+        updatedExpression = updatedExpression.replace(tagRaw, value.toString());
+    }
+    return {
+        original: tagExpression,
+        expression: updatedExpression,
+        hasSignedValue,
+    };
+}
+/**
+ *
+ * @param rawSnippetTag
+ * @param contextData
+ * @param snippetData
+ * @param proficiencyBonus
+ */
+export function generateSnippetTag(rawSnippetTag, contextData, snippetData, proficiencyBonus) {
+    const { expression, postProcess } = parseRawTagInfo(deriveFormattedTag(rawSnippetTag));
+    const snippetBaseTag = {
+        raw: rawSnippetTag,
+    };
+    if (isValidStringTagValueType(rawSnippetTag, contextData)) {
+        const snippetTagValue = parseSnippetTagValue(rawSnippetTag);
+        return Object.assign(Object.assign({}, snippetBaseTag), { type: SnippetTagDataTypeEnum.STRING, value: deriveStringTagValue(snippetTagValue, contextData) });
+    }
+    throwMismatchedParens(rawSnippetTag);
+    throwInvalidSnippetCharacters(rawSnippetTag);
+    let hasSignedValue = false;
+    let updatedExpression = expression;
+    // solve grouped parens first
+    let match;
+    while ((match = updatedExpression.match(groupFragmentRegExpr))) {
+        let groupFragmentRaw = match[0];
+        let groupFragmentExpression = match[1];
+        let groupFragmentValueModifier = match[2];
+        let tagFragmentExpression = generateFragmentExpression(groupFragmentExpression, contextData, snippetData, proficiencyBonus);
+        if (!hasSignedValue) {
+            hasSignedValue = tagFragmentExpression.hasSignedValue;
+        }
+        let value = deriveExpression(tagFragmentExpression.expression);
+        if (groupFragmentValueModifier) {
+            value = applyValueModifierString(value, groupFragmentValueModifier);
+        }
+        updatedExpression = updatedExpression.replace(groupFragmentRaw, value.toString());
+    }
+    let fragmentExpression = generateFragmentExpression(updatedExpression, contextData, snippetData, proficiencyBonus);
+    let value = deriveExpression(fragmentExpression.expression);
+    if (!hasSignedValue) {
+        hasSignedValue = fragmentExpression.hasSignedValue;
+    }
+    value = applyPostProcessString(value, postProcess, hasSignedValue);
+    if (typeof value === 'number') {
+        return Object.assign(Object.assign({}, snippetBaseTag), { type: SnippetTagDataTypeEnum.NUMBER, value });
+    }
+    else {
+        return Object.assign(Object.assign({}, snippetBaseTag), { type: SnippetTagDataTypeEnum.STRING, value });
+    }
+}
+/**
+ *
+ * @param id
+ */
+export function generateSnippetTagPlaceholder(id) {
+    return `__SNIPPET_PLACEHOLDER_${id}__`;
+}
+/**
+ *
+ * @param snippetTag
+ */
+export function generateSnippetContentTagChunk(snippetTag) {
+    return {
+        type: SnippetContentChunkTypeEnum.TAG,
+        data: snippetTag,
+    };
+}
+/**
+ *
+ * @param str
+ */
+export function generateSnippetContentTextChunk(str) {
+    return {
+        type: SnippetContentChunkTypeEnum.TEXT,
+        data: str,
+    };
+}
+/**
+ *
+ * @param snippetString
+ * @param placeholders
+ * @param placeholderLookup
+ */
+export function generateSnippetContentChunks(snippetString, placeholders, placeholderLookup) {
+    let chunks = [];
+    placeholders.forEach((placeholder) => {
+        let strIdx = snippetString.indexOf(placeholder);
+        if (strIdx > -1) {
+            let prePlaceholder = snippetString.slice(0, strIdx);
+            let postPlaceholder = snippetString.slice(strIdx + placeholder.length);
+            if (prePlaceholder) {
+                chunks = [...generateSnippetContentChunks(prePlaceholder, placeholders, placeholderLookup)];
+            }
+            chunks = [...chunks, generateSnippetContentTagChunk(placeholderLookup[placeholder])];
+            if (postPlaceholder) {
+                chunks = [...chunks, ...generateSnippetContentChunks(postPlaceholder, placeholders, placeholderLookup)];
+            }
+        }
+    });
+    if (!chunks.length) {
+        chunks.push(generateSnippetContentTextChunk(snippetString));
+    }
+    return chunks;
+}
+/**
+ *
+ * @param snippetString
+ * @param contextData
+ * @param snippetData
+ * @param proficiencyBonus
+ */
+export function generateSnippetChunks(snippetString, contextData, snippetData, proficiencyBonus) {
+    let match;
+    let placeholderSnippetString = snippetString;
+    let placeholders = [];
+    let rawSnippetTags = [];
+    // find all snippet tags and put placeholders
+    while ((match = placeholderSnippetString.match(/\{\{([^\}]*)\}\}/))) {
+        const rawSnippetTag = match[0];
+        const rawSnippetTagContent = match[1];
+        const placeholder = generateSnippetTagPlaceholder(rawSnippetTags.length);
+        rawSnippetTags.push(rawSnippetTagContent);
+        placeholders.push(placeholder);
+        placeholderSnippetString = placeholderSnippetString.split(rawSnippetTag).join(placeholder);
+    }
+    // parse all snippet tags that were found
+    let placeholderLookup = {};
+    rawSnippetTags.forEach((rawSnippetTag, idx) => {
+        const key = generateSnippetTagPlaceholder(idx);
+        try {
+            placeholderLookup[key] = generateSnippetTag(rawSnippetTag, contextData, snippetData, proficiencyBonus);
+        }
+        catch (error) {
+            const errorSnippetTag = {
+                type: SnippetTagDataTypeEnum.ERROR,
+                raw: rawSnippetTag,
+                value: error.message,
+            };
+            placeholderLookup[key] = errorSnippetTag;
+        }
+    });
+    // break apart the original string into chunks
+    return generateSnippetContentChunks(placeholderSnippetString, placeholders, placeholderLookup);
+}
+/**
+ *
+ * @param snippetString
+ * @param contextData
+ * @param snippetData
+ * @param outputHtml
+ * @param proficiencyBonus
+ * @deprecated this will be moving to character component Snippet
+ *
+ */
+export function convertSnippetToHtml(snippetString, contextData, snippetData, outputHtml = true, proficiencyBonus) {
+    if (snippetString === null) {
+        return null;
+    }
+    const snippetChunks = generateSnippetChunks(snippetString, contextData, snippetData, proficiencyBonus);
+    const htmlChunkString = snippetChunks
+        .map((contentChunk) => {
+        switch (contentChunk.type) {
+            case SnippetContentChunkTypeEnum.TAG:
+                switch (contentChunk.data.type) {
+                    case SnippetTagDataTypeEnum.ERROR:
+                        const errorMessage = `${contentChunk.data.raw} - ${contentChunk.data.value}`;
+                        return `<span class="ddbc-snippet__tag--error" title="${contentChunk.data.raw}">${errorMessage}</span>`;
+                    case SnippetTagDataTypeEnum.NUMBER:
+                        return `<Tooltip title="${contentChunk.data.raw}"><span class="ddbc-snippet__tag">${contentChunk.data.value.toLocaleString()}</span></Tooltip>`;
+                    case SnippetTagDataTypeEnum.STRING:
+                    default:
+                        return `<Tooltip title="${contentChunk.data.raw}"><span class="ddbc-snippet__tag">${contentChunk.data.value}</span></Tooltip>`;
+                }
+            case SnippetContentChunkTypeEnum.TEXT:
+            default:
+                return contentChunk.data;
+        }
+    })
+        .join('');
+    return `<p>${htmlChunkString.replace(/\s*\n+?\s*\n*/g, '</p><p>')}</p>`;
+}
+/**
+ *
+ * @param snippetString
+ * @param contextData
+ * @param snippetData
+ * @param proficiencyBonus
+ */
+export function convertSnippetToText(snippetString, contextData, snippetData, proficiencyBonus) {
+    if (snippetString === null) {
+        return null;
+    }
+    const snippetChunks = generateSnippetChunks(snippetString, contextData, snippetData, proficiencyBonus);
+    return snippetChunks
+        .map((contentChunk) => {
+        switch (contentChunk.type) {
+            case SnippetContentChunkTypeEnum.TAG:
+                switch (contentChunk.data.type) {
+                    case SnippetTagDataTypeEnum.ERROR:
+                        let messageParts = [];
+                        if (contentChunk.data.raw.trim()) {
+                            messageParts.push(contentChunk.data.raw);
+                        }
+                        messageParts.push(contentChunk.data.value);
+                        return messageParts.join(' - ');
+                    case SnippetTagDataTypeEnum.NUMBER:
+                        return contentChunk.data.value.toLocaleString();
+                    case SnippetTagDataTypeEnum.STRING:
+                    default:
+                        return contentChunk.data.value;
+                }
+            case SnippetContentChunkTypeEnum.TEXT:
+                return contentChunk.data;
+            default:
+            // not implemented
+        }
+    })
+        .join('');
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Source/index.js b/ddb_main/packages/rules-engine/es/engine/Source/index.js
new file mode 100644
index 0000000..93e1aeb
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Source/index.js
@@ -0,0 +1,3 @@
+import * as SourceUtils from './utils';
+export { SourceUtils };
+export default Object.assign({}, SourceUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Source/utils.js b/ddb_main/packages/rules-engine/es/engine/Source/utils.js
new file mode 100644
index 0000000..d1629dd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Source/utils.js
@@ -0,0 +1,124 @@
+import { has, orderBy, uniqBy } from 'lodash';
+import { TypeScriptUtils } from "../../utils";
+import { CharacterValidators } from '../Character';
+import { SourceTypeEnum, } from '../Core';
+import { HelperUtils } from '../Helper';
+import { RuleDataUtils, RuleDataAccessors } from '../RuleData';
+export const getSourceFullNames = (sources, ruleData) => {
+    return sources
+        .map((sourceMapping) => RuleDataUtils.getSourceDataInfo(sourceMapping.sourceId, ruleData))
+        .map((source) => source === null || source === void 0 ? void 0 : source.description)
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+};
+//Given an array of choiceOptionContracts, return an array of SimpleSourcedDefinitionContracts (these are used to create grouped options in a select dropdown)
+export const getSimpleSourcedDefinitionContracts = (choiceOptionContracts) => {
+    return choiceOptionContracts.map((contract) => {
+        //If the contract has a sourceId, create a source contract with a sourceType of PRIMARY
+        const sources = contract.sourceId
+            ? [
+                {
+                    sourceId: contract.sourceId,
+                    pageNumber: null,
+                    sourceType: SourceTypeEnum.PRIMARY,
+                },
+            ]
+            : null;
+        return {
+            sources: sources,
+            name: contract.label,
+            id: contract.id,
+            description: contract.description,
+        };
+    });
+};
+// Takes an array of any entity's DefinitionContract and returns an array of sorted HtmlSelectOptionGroup representing each Source Category and a sorted array of options.
+export const getGroupedOptionsBySourceCategory = (items, ruleData, optionValue, entityRestrictionData, labelFallback) => {
+    let groupedOptions = [];
+    //filter any items with a sourceId based on active and entitled sources
+    if (entityRestrictionData) {
+        items = items.filter((item) => {
+            var _a, _b;
+            //always include the option that is selected
+            if (item.id === optionValue) {
+                return true;
+            }
+            const primarySources = ((_a = item.sources) === null || _a === void 0 ? void 0 : _a.filter(CharacterValidators.isPrimarySource)) || [];
+            const sourceId = ((_b = primarySources[0]) === null || _b === void 0 ? void 0 : _b.sourceId) || null;
+            if (sourceId) {
+                return has(entityRestrictionData.activeSourceLookup, sourceId);
+            }
+            //filter out homebrew content if the user has it disabled and there is not labelFallback passed in (Label fallback is only used if the item should not be considered Homebrew when sourceId is null)
+            if (entityRestrictionData.preferences.useHomebrewContent === false && !labelFallback && !sourceId) {
+                return false;
+            }
+            return true;
+        });
+    }
+    items.forEach((item) => {
+        var _a, _b, _c;
+        //get the primary sources for each entity (there should only be one)
+        const primarySources = ((_a = item.sources) === null || _a === void 0 ? void 0 : _a.filter(CharacterValidators.isPrimarySource)) || [];
+        //get the source data for each source contract
+        const sources = primarySources
+            .map((source) => HelperUtils.lookupDataOrFallback(RuleDataAccessors.getSourceDataLookup(ruleData), source.sourceId))
+            .filter(TypeScriptUtils.isNotNullOrUndefined);
+        //get the source category name for the first source contract or default to Homebrew
+        const label = labelFallback ? labelFallback : 'Homebrew';
+        const sourceCategoryName = sources.length > 0 && sources[0].sourceCategory && sources[0].sourceCategory.name
+            ? sources[0].sourceCategory.name
+            : label;
+        const option = {
+            label: item.name,
+            value: item.id,
+            id: item.id,
+            description: item.description ? item.description : '',
+        };
+        // Search the availableGroupedOptions array for the source category
+        const index = groupedOptions.findIndex((element) => element.optGroupLabel === sourceCategoryName);
+        // If the source category wasn't found, add it as a new option group.
+        if (index < 0) {
+            groupedOptions.push({
+                optGroupLabel: sourceCategoryName,
+                sortOrder: (_c = (_b = sources[0]) === null || _b === void 0 ? void 0 : _b.sourceCategory) === null || _c === void 0 ? void 0 : _c.sortOrder,
+                options: [option],
+            });
+            // Otherwise, add the option to the existing source category's array of options.
+        }
+        else {
+            groupedOptions[index].options.push(option);
+        }
+    });
+    // Return ordered category groups with ordered options within each group
+    return orderBy(groupedOptions, 'sortOrder').map((group) => {
+        //TODO - sort options by lowercase
+        return {
+            optGroupLabel: group.optGroupLabel,
+            options: orderBy(group.options, 'label'),
+        };
+    });
+};
+//Given an array of entity Definitions, return an array of SimpleSourceCategoryContracts including Homebrew
+export const getSimpleSourceCategoriesData = (items, ruleData, activeSourceCategories) => {
+    const filteredCategories = items.flatMap((item) => {
+        var _a, _b, _c;
+        const sources = item.sources || [];
+        // Get the data for the first source category
+        const sourceData = sources
+            .map((source) => HelperUtils.lookupDataOrFallback(RuleDataAccessors.getSourceDataLookup(ruleData), source.sourceId))
+            .find(TypeScriptUtils.isNotNullOrUndefined); //Find the first non-null source data
+        // Map source category data to a simple source category object
+        const category = {
+            id: ((_a = sourceData === null || sourceData === void 0 ? void 0 : sourceData.sourceCategory) === null || _a === void 0 ? void 0 : _a.id) || 0,
+            name: ((_b = sourceData === null || sourceData === void 0 ? void 0 : sourceData.sourceCategory) === null || _b === void 0 ? void 0 : _b.name) || 'Homebrew',
+            sortOrder: (_c = sourceData === null || sourceData === void 0 ? void 0 : sourceData.sourceCategory) === null || _c === void 0 ? void 0 : _c.sortOrder,
+        };
+        // Look for the sourceCategory in the user preferences array or include Homebrew if id is 0
+        if (category.id === 0 || activeSourceCategories.includes(category.id)) {
+            return category;
+        }
+        // If the source was not found in user preferences ignore it
+        return [];
+    });
+    const uniqueSourceCategories = uniqBy(filteredCategories, (sourceCategory) => sourceCategory.id);
+    return orderBy(uniqueSourceCategories, 'sortOrder');
+};
diff --git a/ddb_main/packages/rules-engine/es/engine/Spell/accessors.js b/ddb_main/packages/rules-engine/es/engine/Spell/accessors.js
new file mode 100644
index 0000000..9d09fca
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Spell/accessors.js
@@ -0,0 +1,832 @@
+import { ActivationAccessors } from '../Activation';
+/**
+ *
+ * @param spell
+ */
+export function getDefinition(spell) {
+    return spell.definition;
+}
+/**
+ *
+ * @param spell
+ */
+export function getUniqueKey(spell) {
+    return spell.uniqueKey;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionName(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getAttackType(spell) {
+    return getDefinitionAttackType(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionAttackType(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.attackType) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getId(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : -1;
+}
+/**
+ *
+ * @param spell - The spell in question
+ */
+export function getSpellGroups(spell) {
+    var _a;
+    return ((_a = getDefinition(spell)) === null || _a === void 0 ? void 0 : _a.spellGroups) || [];
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionRange(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.range) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionRangeArea(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.rangeArea) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getMappingId(spell) {
+    return spell.id;
+}
+/**
+ *
+ * @param spell
+ */
+export function getMappingEntityTypeId(spell) {
+    return spell.entityTypeId;
+}
+/**
+ *
+ * @param spell
+ */
+export function getLimitedUse(spell) {
+    return spell.limitedUse;
+}
+/**
+ *
+ * @param spell
+ */
+export function getActivation(spell) {
+    return spell.activation;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionActivation(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.activation) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getActivationTime(spell) {
+    return ActivationAccessors.getTime(getActivation(spell));
+}
+/**
+ *
+ * @param spell
+ */
+export function getActivationType(spell) {
+    return ActivationAccessors.getType(getActivation(spell));
+}
+/**
+ *
+ * @param spell
+ */
+export function getCastingTimeDescription(spell) {
+    return getDefinitionCastingTimeDescription(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionCastingTimeDescription(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.castingTimeDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getTags(spell) {
+    return getDefinitionTags(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionTags(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.tags) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionTempHpDice(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.tempHpDice) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param spell
+ */
+export function getConditions(spell) {
+    return getDefinitionConditions(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionConditions(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.conditions) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionDamageEffect(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.damageEffect) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getLevel(spell) {
+    return getDefinitionLevel(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionLevel(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.level) !== null && _b !== void 0 ? _b : 0;
+}
+/**
+ *
+ * @param spell
+ */
+export function getSchool(spell) {
+    return getDefinitionSchool(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionSchool(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.school) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionSnippet(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.snippet) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDescription(spell) {
+    return getDefinitionDescription(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionDescription(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionIsHomebrew(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.isHomebrew) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param spell
+ */
+export function getVersion(spell) {
+    return getDefinitionVersion(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionVersion(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.version) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getUsesSpellSlot(spell) {
+    if (isCantrip(spell)) {
+        return false;
+    }
+    return spell.usesSpellSlot;
+}
+/**
+ *
+ * @param spell
+ */
+export function isDisplayAsAttack(spell) {
+    return spell.displayAsAttack;
+}
+/**
+ *
+ * @param spell
+ */
+export function isAlwaysPrepared(spell) {
+    return spell.alwaysPrepared;
+}
+/**
+ *
+ * @param spell
+ */
+export function isCantrip(spell) {
+    return getLevel(spell) === 0;
+}
+/**
+ *
+ * @param spell
+ */
+export function isAttack(spell) {
+    return getDefinitionRequiresAttackRoll(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionRequiresAttackRoll(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.requiresAttackRoll) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param spell
+ */
+export function asPartOfWeaponAttack(spell) {
+    return getDefinitionAsPartOfWeaponAttack(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionAsPartOfWeaponAttack(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.asPartOfWeaponAttack) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param spell
+ */
+export function getToHit(spell) {
+    return spell.toHit;
+}
+/**
+ *
+ * @param spell
+ */
+export function canRemove(spell) {
+    return spell.canRemove;
+}
+/**
+ *
+ * @param spell
+ */
+export function canPrepare(spell) {
+    return spell.canPrepare;
+}
+/**
+ *
+ * @param spell
+ */
+export function canAdd(spell) {
+    return spell.canAdd;
+}
+/**
+ *
+ * @param spell
+ */
+export function getModifiers(spell) {
+    return spell.modifiers;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionModifiers(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.modifiers) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param spell
+ */
+export function getCastAtLevel(spell) {
+    return spell.castAtLevel;
+}
+/**
+ *
+ * @param spell
+ */
+export function getCastOnlyAsRitual(spell) {
+    return spell.castOnlyAsRitual;
+}
+/**
+ *
+ * @param spell
+ */
+export function getRitualCastingType(spell) {
+    return spell.ritualCastingType;
+}
+/**
+ *
+ * @param spell
+ */
+export function getBaseLevelAtWill(spell) {
+    return spell.baseLevelAtWill;
+}
+/**
+ *
+ * @param spell
+ */
+export function getConcentration(spell) {
+    return getDefinitionConcentration(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionConcentration(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.concentration) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param spell
+ */
+export function getRitual(spell) {
+    return getDefinitionRitual(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionRitual(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.ritual) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param spell
+ */
+export function isCustomized(spell) {
+    return spell.isCustomized;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDuration(spell) {
+    return getDefinitionDuration(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionDuration(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionHealing(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.healing) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionHealingDice(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.healingDice) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param spell
+ */
+export function getComponents(spell) {
+    return getDefinitionComponents(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionComponents(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.components) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param spell
+ */
+export function getComponentsDescription(spell) {
+    return getDefinitionComponentsDescription(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionComponentsDescription(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.componentsDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getRange(spell) {
+    return spell.range;
+}
+/**
+ *
+ * @param spell
+ */
+export function getRescriction(spell) {
+    return spell.restriction;
+}
+/**
+ *
+ * @param spell
+ */
+export function getAdditionalDescription(spell) {
+    return spell.additionalDescription;
+}
+/**
+ *
+ * @param spell
+ */
+export function getRequiresAttackRoll(spell) {
+    return getDefinitionRequiresAttackRoll(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getRequiresSavingThrow(spell) {
+    return getDefinitionRequiresSavingThrow(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionRequiresSavingThrow(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.requiresSavingThrow) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param spell
+ */
+export function getAtHigherLevels(spell) {
+    return spell.atHigherLevels;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionAtHigherLevels(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.atHigherLevels) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getCanCastAtHigherLevel(spell) {
+    return getDefinitionCanCastAtHigherLevel(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionCanCastAtHigherLevel(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.canCastAtHigherLevel) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param spell
+ */
+export function getAttackSaveValue(spell) {
+    return spell.attackSaveValue;
+}
+/**
+ *
+ * @param spell
+ */
+export function getBonusFixedDamage(spell) {
+    return spell.bonusFixedDamage;
+}
+/**
+ *
+ * @param spell
+ */
+export function getSaveDcAbility(spell) {
+    return getDefinitionSaveDcAbility(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionSaveDcAbility(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.saveDcAbilityId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionScaleType(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.scaleType) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param spell
+ */
+export function getScaleType(spell) {
+    return getDefinitionScaleType(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function getNotes(spell) {
+    return spell.notes;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDataOrigin(spell) {
+    return spell.dataOrigin;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDataOriginType(spell) {
+    const dataOrigin = getDataOrigin(spell);
+    return dataOrigin.type;
+}
+/**
+ *
+ * @param spell
+ */
+export function getExpandedDataOriginRef(spell) {
+    return spell.expandedDataOriginRef;
+}
+/**
+ *
+ * @param spell
+ */
+export function getAtWillLimitedUseLevel(spell) {
+    return spell.atWillLimitedUseLevel;
+}
+/**
+ *
+ * @param spell
+ */
+export function getComponentId(spell) {
+    return spell.componentId;
+}
+/**
+ *
+ * @param spell
+ */
+export function getComponentTypeId(spell) {
+    return spell.componentTypeId;
+}
+/**
+ *
+ * @param spell
+ */
+export function countsAsKnownSpell(spell) {
+    return spell.countsAsKnownSpell;
+}
+/**
+ *
+ * @param spell
+ */
+export function getSpellCastingAbilityId(spell) {
+    return spell.spellCastingAbilityId;
+}
+/**
+ *
+ * @param spell
+ */
+export function getOverrideSaveDc(spell) {
+    return spell.overrideSaveDc;
+}
+/**
+ *
+ * @param spell
+ */
+export function getSpellListId(spell) {
+    return spell.spellListId;
+}
+/**
+ *
+ * @param spell
+ * @param useOverride
+ */
+export function getName(spell, useOverride = true) {
+    var _a;
+    if (useOverride && spell.name) {
+        return spell.name;
+    }
+    return (_a = getDefinitionName(spell)) !== null && _a !== void 0 ? _a : '';
+}
+/**
+ *
+ * @param spell
+ */
+export function getCharacterLevel(spell) {
+    return spell.characterLevel;
+}
+/**
+ *
+ * @param spell
+ */
+export function getEntity(spell) {
+    return spell.entity;
+}
+/**
+ *
+ * @param spell
+ */
+export function getSpellcastingModifier(spell) {
+    return spell.spellcastingModifier;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionId(spell) {
+    return spell.definitionId;
+}
+/**
+ *
+ * @param spell
+ */
+export function getIsSignatureSpell(spell) {
+    return spell.isSignatureSpell;
+}
+/**
+ * This is the mapping value of whether it is prepared, but may be false and the spell has
+ * alwaysPrepared, so if you are checking for if the spell really is prepared use isPrepared()
+ * @param spell
+ */
+export function getPrepared(spell) {
+    return spell.prepared;
+}
+/**
+ *
+ * @param spell
+ */
+export function isPrepared(spell) {
+    return spell.isPrepared;
+}
+/**
+ *
+ * @param spell
+ */
+export function isRitual(spell) {
+    return spell.isRitual;
+}
+/**
+ * @param spell
+ */
+export function isActive(spell) {
+    return spell.isActive;
+}
+/**
+ *
+ * @param spell
+ */
+export function isCastAsRitual(spell) {
+    return spell.isCastAsRitual;
+}
+/**
+ *
+ * @param spell
+ */
+export function getDefinitionSources(spell) {
+    var _a, _b;
+    return (_b = (_a = spell.definition) === null || _a === void 0 ? void 0 : _a.sources) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param spell
+ */
+export function getSources(spell) {
+    return getDefinitionSources(spell);
+}
+/**
+ *
+ * @param spell - The spell in question
+ */
+export function getSpellGroupInfoLookup(spell) {
+    return spell.spellGroupInfoLookup;
+}
+/**
+ *
+ * @param spell
+ */
+export function isAtWill(spell) {
+    return spell.isAtWill;
+}
+/**
+ *
+ * @param spell
+ */
+export function isLimitedUseAvailableAtScaledAmount(spell) {
+    return spell.isLimitedUseAvailableAtScaledAmount;
+}
+/**
+ *
+ * @param spell
+ */
+export function getScaledAmount(spell) {
+    return spell.scaledAmount;
+}
+/**
+ *
+ * @param spell
+ */
+export function getCastLevel(spell) {
+    return spell.castLevel;
+}
+/**
+ *
+ * @param spell
+ */
+export function getMaxUses(spell) {
+    return spell.maxUses;
+}
+/**
+ *
+ * @param spell
+ */
+export function getConsumedUses(spell) {
+    return spell.consumedUses;
+}
+export function isLegacy(spell) {
+    var _a, _b;
+    return (_b = (_a = getDefinition(spell)) === null || _a === void 0 ? void 0 : _a.isLegacy) !== null && _b !== void 0 ? _b : false;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Spell/constants.js b/ddb_main/packages/rules-engine/es/engine/Spell/constants.js
new file mode 100644
index 0000000..0eaf136
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Spell/constants.js
@@ -0,0 +1,78 @@
+import { AdjustmentTypeEnum } from '../Value';
+export const DB_STRING_SPELL_ELDRITCH_BLAST = 'Eldritch Blast';
+export var SpellRangeTypeEnum;
+(function (SpellRangeTypeEnum) {
+    SpellRangeTypeEnum[SpellRangeTypeEnum["SELF"] = 1] = "SELF";
+    SpellRangeTypeEnum[SpellRangeTypeEnum["TOUCH"] = 2] = "TOUCH";
+    SpellRangeTypeEnum[SpellRangeTypeEnum["RANGED"] = 3] = "RANGED";
+    SpellRangeTypeEnum[SpellRangeTypeEnum["SIGHT"] = 4] = "SIGHT";
+    SpellRangeTypeEnum[SpellRangeTypeEnum["UNLIMITED"] = 9] = "UNLIMITED";
+})(SpellRangeTypeEnum || (SpellRangeTypeEnum = {}));
+export var SpellRangeTypeNameEnum;
+(function (SpellRangeTypeNameEnum) {
+    SpellRangeTypeNameEnum["SELF"] = "Self";
+    SpellRangeTypeNameEnum["TOUCH"] = "Touch";
+    SpellRangeTypeNameEnum["RANGED"] = "Ranged";
+    SpellRangeTypeNameEnum["SIGHT"] = "Sight";
+    SpellRangeTypeNameEnum["UNLIMITED"] = "Unlimited";
+})(SpellRangeTypeNameEnum || (SpellRangeTypeNameEnum = {}));
+export var SpellConditionTypeEnum;
+(function (SpellConditionTypeEnum) {
+    SpellConditionTypeEnum[SpellConditionTypeEnum["APPLY"] = 1] = "APPLY";
+    SpellConditionTypeEnum[SpellConditionTypeEnum["REMOVE"] = 2] = "REMOVE";
+    SpellConditionTypeEnum[SpellConditionTypeEnum["SUPRESS"] = 3] = "SUPRESS";
+})(SpellConditionTypeEnum || (SpellConditionTypeEnum = {}));
+export var SpellDurationTypeEnum;
+(function (SpellDurationTypeEnum) {
+    SpellDurationTypeEnum["INSTANTANEOUS"] = "Instantaneous";
+    SpellDurationTypeEnum["CONCENTRATION"] = "Concentration";
+    SpellDurationTypeEnum["TIME"] = "Time";
+    SpellDurationTypeEnum["SPECIAL"] = "Special";
+    SpellDurationTypeEnum["UNIT_DISPELLED"] = "Unit Dispelled";
+    SpellDurationTypeEnum["UNIT_DISPELLED_TRIGGERED"] = "Unit Dispelled or Triggered";
+})(SpellDurationTypeEnum || (SpellDurationTypeEnum = {}));
+export var SpellPrepareTypeEnum;
+(function (SpellPrepareTypeEnum) {
+    SpellPrepareTypeEnum[SpellPrepareTypeEnum["LEVEL"] = 1] = "LEVEL";
+    SpellPrepareTypeEnum[SpellPrepareTypeEnum["HALF_LEVEL"] = 2] = "HALF_LEVEL";
+})(SpellPrepareTypeEnum || (SpellPrepareTypeEnum = {}));
+export var SpellScaleTypeNameEnum;
+(function (SpellScaleTypeNameEnum) {
+    SpellScaleTypeNameEnum["CHARACTER_LEVEL"] = "characterlevel";
+    SpellScaleTypeNameEnum["SPELL_SCALE"] = "spellscale";
+    SpellScaleTypeNameEnum["SPELL_LEVEL"] = "spelllevel";
+})(SpellScaleTypeNameEnum || (SpellScaleTypeNameEnum = {}));
+export var RitualCastingTypeEnum;
+(function (RitualCastingTypeEnum) {
+    RitualCastingTypeEnum[RitualCastingTypeEnum["CAN_CAST_AS_RITUAL"] = 1] = "CAN_CAST_AS_RITUAL";
+    RitualCastingTypeEnum[RitualCastingTypeEnum["MUST_CAST_AS_RITUAL"] = 2] = "MUST_CAST_AS_RITUAL";
+})(RitualCastingTypeEnum || (RitualCastingTypeEnum = {}));
+export var SpellGroupEnum;
+(function (SpellGroupEnum) {
+    SpellGroupEnum[SpellGroupEnum["HEALING"] = 1] = "HEALING";
+})(SpellGroupEnum || (SpellGroupEnum = {}));
+export const SPELL_CUSTOMIZATION_ADJUSTMENT_TYPES = [
+    AdjustmentTypeEnum.SAVE_DC_BONUS,
+    AdjustmentTypeEnum.SAVE_DC_OVERRIDE,
+    AdjustmentTypeEnum.FIXED_VALUE_BONUS,
+    AdjustmentTypeEnum.NAME_OVERRIDE,
+    AdjustmentTypeEnum.TO_HIT_BONUS,
+    AdjustmentTypeEnum.TO_HIT_OVERRIDE,
+    AdjustmentTypeEnum.NOTES,
+    AdjustmentTypeEnum.DISPLAY_AS_ATTACK,
+];
+export var SpellCastingLearningStyle;
+(function (SpellCastingLearningStyle) {
+    SpellCastingLearningStyle[SpellCastingLearningStyle["Prepared"] = 1] = "Prepared";
+    SpellCastingLearningStyle[SpellCastingLearningStyle["Learned"] = 2] = "Learned";
+})(SpellCastingLearningStyle || (SpellCastingLearningStyle = {}));
+;
+export const SpellCastingLearningStyleAddText = {
+    [SpellCastingLearningStyle.Learned]: "Learn",
+    [SpellCastingLearningStyle.Prepared]: "Prepare",
+};
+export const SpellCastingLearningStyleRemoveText = {
+    [SpellCastingLearningStyle.Learned]: "Delete",
+    [SpellCastingLearningStyle.Prepared]: "Unprepare",
+};
+export const DefaultSpellCastingLearningStyle = SpellCastingLearningStyle.Learned;
diff --git a/ddb_main/packages/rules-engine/es/engine/Spell/derivers.js b/ddb_main/packages/rules-engine/es/engine/Spell/derivers.js
new file mode 100644
index 0000000..ce8a25c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Spell/derivers.js
@@ -0,0 +1,1320 @@
+import { TypeScriptUtils } from '../../utils';
+import { AbilityAccessors, AbilityDerivers } from '../Ability';
+import { CharacterDerivers } from '../Character';
+import { ClassAccessors } from '../Class';
+import { AdditionalTypeEnum, CoreSimulators, MulticlassSpellSlotRoundingEnum } from '../Core';
+import { DataOriginGenerators, DataOriginTypeEnum } from '../DataOrigin';
+import { DiceAccessors, DiceSimulators } from '../Dice';
+import { HelperUtils } from '../Helper';
+import { ItemAccessors } from '../Item';
+import { LimitedUseAccessors } from '../LimitedUse';
+import { ModifierAccessors, ModifierDerivers, ModifierValidators } from '../Modifier';
+import { RuleDataAccessors } from '../RuleData';
+import { AdjustmentTypeEnum, ValueHacks, ValueUtils, ValueValidators } from '../Value';
+import { getCastAtLevel, getCharacterLevel, getDataOrigin, getDataOriginType, getDefinitionAtHigherLevels, getDefinitionModifiers, getDefinitionName, getExpandedDataOriginRef, getLevel, getLimitedUse, getMappingEntityTypeId, getMappingId, getModifiers, getOverrideSaveDc, getRange, getRequiresSavingThrow, getRitual, getRitualCastingType, getScaleType, getSpellCastingAbilityId, getSpellListId, getUsesSpellSlot, isActive, isAlwaysPrepared, isAttack, isCantrip, isRitual, } from './accessors';
+import { DB_STRING_SPELL_ELDRITCH_BLAST, RitualCastingTypeEnum, SPELL_CUSTOMIZATION_ADJUSTMENT_TYPES, SpellPrepareTypeEnum, SpellScaleTypeNameEnum, } from './constants';
+import { getSpellFinalScaledDie } from './utils';
+/**
+ * Calculates the Spellcasting Ability Modifier for the specified Proficiency Bonus and Ability Score Modifier,
+ * @param profBonus The proficiency bonus
+ * @param statModifier The modifier from the Ability Score
+ */
+export function deriveSpellAttackModifier(profBonus, statModifier) {
+    return profBonus + statModifier;
+}
+/**
+ * Determines if the specified spell is currently prepared
+ * @param spell The spell in question
+ * @param includeAlwaysPrepared When set to true, "Always Prepared" spells will be return true even if they are not prepared.
+ */
+export function deriveIsPrepared(spell, includeAlwaysPrepared = true) {
+    return spell.prepared || (includeAlwaysPrepared && isAlwaysPrepared(spell));
+}
+/**
+ * Determines if the specified spell can be cast as a ritual
+ * @param spell The spell in question
+ */
+export function deriveCanCastAsRitual(spell) {
+    return getRitualCastingType(spell) === RitualCastingTypeEnum.CAN_CAST_AS_RITUAL;
+}
+/**
+ * Determines if the spell can only be cast as a ritual
+ * @param spell The spell in question
+ */
+export function deriveMustCastAsRitual(spell) {
+    return getRitualCastingType(spell) === RitualCastingTypeEnum.MUST_CAST_AS_RITUAL;
+}
+/**
+ *
+ * @param spell
+ */
+export function deriveIsRitual(spell) {
+    const dataOrigin = getDataOrigin(spell);
+    const dataOriginType = getDataOriginType(spell);
+    if (dataOrigin) {
+        switch (dataOriginType) {
+            case DataOriginTypeEnum.CLASS:
+            case DataOriginTypeEnum.CLASS_FEATURE:
+                return getRitual(spell) && deriveIsCastedByRitualSpellcaster(spell);
+            case DataOriginTypeEnum.RACE:
+            case DataOriginTypeEnum.FEAT:
+            case DataOriginTypeEnum.ITEM:
+                return deriveCanCastAsRitual(spell) || deriveMustCastAsRitual(spell);
+            case DataOriginTypeEnum.SIMULATED:
+                return getRitual(spell);
+            default:
+            // not implemented
+        }
+    }
+    return false;
+}
+/**
+ *
+ * @param spell
+ */
+export function deriveIsCastAsRitual(spell) {
+    if (!getDataOrigin(spell) || !isRitual(spell)) {
+        return false;
+    }
+    // if we have an override to only cast, then don't let them cast with spell slot at all
+    if (deriveMustCastAsRitual(spell)) {
+        return true;
+    }
+    // otherwise if the spell isn't active, but we got to this point, it could only be cast as ritual
+    return !isActive(spell);
+}
+/**
+ *
+ * @param spell
+ */
+export function deriveExpandedContextIds(spell) {
+    let contextId = null;
+    let contextTypeId = null;
+    const expandedDataOriginRef = getExpandedDataOriginRef(spell);
+    if (expandedDataOriginRef) {
+        const dataOrigin = getDataOrigin(spell);
+        const dataOriginType = getDataOriginType(spell);
+        switch (dataOriginType) {
+            case DataOriginTypeEnum.CLASS:
+                const charClass = dataOrigin.primary;
+                contextId = ClassAccessors.getMappingId(charClass);
+                contextTypeId = ClassAccessors.getMappingEntityTypeId(charClass);
+                break;
+            default:
+            // not implemented
+        }
+    }
+    return [contextId, contextTypeId];
+}
+/**
+ * TODO - move to utils
+ * @param level
+ * @param slotLevels
+ */
+export function getCastLevelAvailableCount(level, slotLevels) {
+    const slotLevel = slotLevels.find((slotLevel) => slotLevel.level === level);
+    if (!slotLevel) {
+        return null;
+    }
+    return slotLevel.available - slotLevel.used;
+}
+/**
+ * TODO - move to utils
+ * @param spell
+ * @param scaledAmount
+ */
+export function getConsumedLimitedUse(spell, scaledAmount) {
+    const limitedUse = getLimitedUse(spell);
+    if (limitedUse === null) {
+        return 0;
+    }
+    const minConsumed = LimitedUseAccessors.getMinNumberConsumed(limitedUse);
+    if (getDataOriginType(spell) === DataOriginTypeEnum.ITEM) {
+        return minConsumed + scaledAmount;
+    }
+    return minConsumed;
+}
+/**
+ *
+ * @param spell
+ */
+export function deriveStartingCastLevel(spell) {
+    if (isCantrip(spell)) {
+        return getLevel(spell);
+    }
+    const castAtLevel = getCastAtLevel(spell);
+    let startingCastLevel = getLevel(spell);
+    if (castAtLevel !== null) {
+        startingCastLevel = castAtLevel;
+    }
+    return startingCastLevel;
+}
+/**
+ * TODO - move to utils
+ * @param spell
+ * @param spellCasterInfo
+ * @param ruleData
+ * @param initialCastLevel
+ */
+export function getMinCastLevel(spell, spellCasterInfo, ruleData, initialCastLevel = null) {
+    const { startLevel, endLevel } = getCastLevelRange(spell, spellCasterInfo, ruleData);
+    let castLevel = deriveStartingCastLevel(spell);
+    if (initialCastLevel !== null) {
+        castLevel = initialCastLevel;
+    }
+    return Math.max(castLevel, startLevel);
+}
+/**
+ * TODO - move to utils
+ * @param spell
+ * @param spellCasterInfo
+ * @param ruleData
+ * @param initialCastLevel
+ */
+export function getCastableLevels(spell, spellCasterInfo, ruleData, initialCastLevel = null) {
+    const { startLevel, endLevel } = getCastLevelRange(spell, spellCasterInfo, ruleData);
+    const usesSpellSlot = getUsesSpellSlot(spell);
+    const castAtLevel = getCastAtLevel(spell);
+    const castableLevels = [];
+    for (let i = startLevel; i <= endLevel; i++) {
+        if (initialCastLevel !== null && initialCastLevel === i) {
+            castableLevels.push(i);
+        }
+        else if (castAtLevel !== null && castAtLevel === i) {
+            castableLevels.push(i);
+        }
+        else if (getDataOriginType(spell) === DataOriginTypeEnum.ITEM) {
+            castableLevels.push(i);
+        }
+        else if (usesSpellSlot) {
+            if (spellCasterInfo.availableSpellLevels.includes(i) ||
+                spellCasterInfo.availablePactMagicLevels.includes(i)) {
+                castableLevels.push(i);
+            }
+        }
+    }
+    return castableLevels;
+}
+/**
+ * TODO - move to utils
+ * @param spell
+ * @param spellCasterInfo
+ * @param ruleData
+ */
+export function getCastLevelRange(spell, spellCasterInfo, ruleData) {
+    let startLevel = getLevel(spell);
+    let endLevel = getLevel(spell);
+    const castAtLevel = getCastAtLevel(spell);
+    const limitedUse = getLimitedUse(spell);
+    if (isCantrip(spell)) {
+        return {
+            startLevel,
+            endLevel,
+        };
+    }
+    if (getUsesSpellSlot(spell)) {
+        const availableLevels = [
+            ...spellCasterInfo.availableSpellLevels,
+            ...spellCasterInfo.availablePactMagicLevels,
+        ].filter((level) => level >= getLevel(spell));
+        startLevel = Math.max(getLevel(spell), Math.min(...availableLevels));
+        endLevel = Math.max(getLevel(spell), ...availableLevels);
+        if (limitedUse && getDataOriginType(spell) === DataOriginTypeEnum.CLASS_FEATURE) {
+            const dataOrigin = getDataOrigin(spell);
+            const charClass = dataOrigin.parent;
+            if (ClassAccessors.isPactMagicActive(charClass)) {
+                startLevel = Math.min(...spellCasterInfo.availablePactMagicLevels);
+                endLevel = Math.max(...spellCasterInfo.availablePactMagicLevels);
+            }
+            else {
+                startLevel = Math.max(getLevel(spell), Math.min(...spellCasterInfo.availableSpellLevels));
+                endLevel = Math.max(getLevel(spell), ...spellCasterInfo.availableSpellLevels);
+            }
+        }
+    }
+    if (getDataOriginType(spell) !== DataOriginTypeEnum.CLASS) {
+        if (castAtLevel === null) {
+            switch (getDataOriginType(spell)) {
+                case DataOriginTypeEnum.ITEM:
+                    let itemSpellLevelDiff = 0;
+                    if (limitedUse) {
+                        const minNumberConsumed = LimitedUseAccessors.getMinNumberConsumed(limitedUse);
+                        let maxNumberConsumed = LimitedUseAccessors.getMaxNumberConsumed(limitedUse);
+                        if (maxNumberConsumed === null) {
+                            maxNumberConsumed = minNumberConsumed;
+                        }
+                        itemSpellLevelDiff = maxNumberConsumed - minNumberConsumed;
+                    }
+                    endLevel = startLevel + itemSpellLevelDiff;
+                    break;
+                default:
+                // not implemented
+            }
+        }
+        else {
+            startLevel = castAtLevel;
+            endLevel = castAtLevel;
+        }
+    }
+    const maxSpellLevel = RuleDataAccessors.getMaxSpellLevel(ruleData);
+    return {
+        startLevel: HelperUtils.clampInt(startLevel, 1, maxSpellLevel),
+        endLevel: HelperUtils.clampInt(endLevel, 1, maxSpellLevel),
+    };
+}
+/**
+ * TODO - move to validators
+ * @param spell
+ * @param scaleType
+ * @param higherLevelsItems
+ * @param castLevel
+ */
+export function isSpellScaledByCastLevel(spell, scaleType, higherLevelsItems, castLevel) {
+    if (scaleType === null) {
+        return false;
+    }
+    if (scaleType === SpellScaleTypeNameEnum.CHARACTER_LEVEL) {
+        return false;
+    }
+    if (getCastAtLevel(spell) === castLevel) {
+        return false;
+    }
+    if (!higherLevelsItems.length) {
+        return false;
+    }
+    return !!spellLevelFilter(higherLevelsItems, castLevel);
+}
+/**
+ * TODO - move to utils
+ * @param spell
+ * @param scaleType
+ * @param higherLevelsItems
+ * @param characterLevel //deprecated and will be removed, DCP-1412
+ * @param castLevel
+ */
+export function getSpellScaledAtHigher(spell, scaleType, higherLevelsItems, characterLevel, castLevel) {
+    if (scaleType === null) {
+        return null;
+    }
+    const castAtLevel = getCastAtLevel(spell);
+    if (scaleType === SpellScaleTypeNameEnum.CHARACTER_LEVEL) {
+        return characterLevelFilter(higherLevelsItems, getCharacterLevel(spell));
+    }
+    else if (scaleType === SpellScaleTypeNameEnum.SPELL_SCALE || scaleType === SpellScaleTypeNameEnum.SPELL_LEVEL) {
+        return spellLevelFilter(higherLevelsItems, castAtLevel === null ? castLevel : castAtLevel);
+    }
+    return null;
+}
+/**
+ * TODO - move to utils
+ * @param spell
+ * @param characterLevel
+ */
+export function getScaledDamage(spell, characterLevel = null) {
+    const damageDice = [];
+    const castLevel = deriveStartingCastLevel(spell);
+    const damageModifiers = getModifiers(spell).filter((modifier) => ModifierValidators.isSpellDamageModifier(modifier));
+    damageModifiers.map((modifier) => {
+        const { atHigherLevels } = modifier;
+        if (atHigherLevels !== null && atHigherLevels.points !== null) {
+            const atHigherDamage = getSpellScaledAtHigher(spell, getScaleType(spell), atHigherLevels.points, characterLevel, castLevel);
+            const scaledDamageDie = getSpellFinalScaledDie(spell, modifier, atHigherDamage);
+            const type = ModifierAccessors.getFriendlySubtypeName(modifier);
+            if (scaledDamageDie !== null && type !== null) {
+                damageDice.push({
+                    dice: scaledDamageDie,
+                    type,
+                    restriction: ModifierAccessors.getRestriction(modifier),
+                });
+            }
+        }
+    });
+    return damageDice;
+}
+/**
+ * TODO - move to validators
+ * @param spell
+ * @param level
+ * @param spellCasterInfo
+ */
+export function isSpellAvailableAtLevel(spell, level, spellCasterInfo) {
+    if (isCantrip(spell)) {
+        return true;
+    }
+    if (spellCasterInfo.availableSpellLevels.includes(level) ||
+        spellCasterInfo.availablePactMagicLevels.includes(level)) {
+        return true;
+    }
+    return false;
+}
+/**
+ * NOTE: leaving for now, this will go away eventually once we generate higher level locally
+ * @param higherLevelsItems
+ * @param characterLevel
+ */
+function characterLevelFilter(higherLevelsItems, characterLevel) {
+    if (characterLevel === null) {
+        return null;
+    }
+    if (!higherLevelsItems.length) {
+        return null;
+    }
+    return HelperUtils.getLast(higherLevelsItems.filter((item) => item.level !== null && item.level <= characterLevel), ['level']);
+}
+/**
+ * NOTE: leaving for now, this will go away eventually once we generate higher level locally
+ * @param higherLevelsItems
+ * @param castLevel
+ */
+function spellLevelFilter(higherLevelsItems, castLevel) {
+    if (castLevel === null) {
+        return null;
+    }
+    if (!higherLevelsItems.length) {
+        return null;
+    }
+    return HelperUtils.getLast(higherLevelsItems.filter((item) => item.level === null || item.level <= castLevel), ['level']);
+}
+/**
+ *
+ * @param prepareType
+ * @param level
+ * @param modifier
+ */
+export function deriveSpellPrepareMax(prepareType, level, modifier) {
+    switch (prepareType) {
+        case SpellPrepareTypeEnum.LEVEL:
+            return Math.max(modifier + level, 1);
+        case SpellPrepareTypeEnum.HALF_LEVEL:
+            return Math.max(modifier + Math.floor(level / 2), 1);
+        default:
+        // not implemented
+    }
+    return null;
+}
+/**
+ *
+ * @param charClass
+ * @param abilityId
+ * @param ruleData
+ * @param overrideIsRitualSpellCaster
+ */
+export function deriveClassSpellRules(charClass, abilityId, ruleData, overrideIsRitualSpellCaster = false) {
+    var _a;
+    const spellcastingAbilityStatId = abilityId;
+    let spellcastingAbilityStat = null;
+    if (spellcastingAbilityStatId) {
+        spellcastingAbilityStat = ruleData.statsLookup[spellcastingAbilityStatId].key;
+    }
+    const configSpellRules = ClassAccessors.getSpellConfiguration(charClass);
+    let filteredLevelCantripsKnownMaxes = [];
+    if (configSpellRules && configSpellRules.levelCantripsKnownMaxes !== null) {
+        filteredLevelCantripsKnownMaxes = configSpellRules.levelCantripsKnownMaxes.filter((max) => max !== 0);
+    }
+    const spellPrepareType = ClassAccessors.getSpellPrepareType(charClass);
+    const knowsAllSpells = ClassAccessors.getKnowsAllSpells(charClass);
+    const hasSpellPrepareMax = spellPrepareType !== null;
+    const isKnownSpellcaster = !hasSpellPrepareMax;
+    const isSpellbookSpellcaster = hasSpellPrepareMax && !knowsAllSpells;
+    const isPreparedSpellcaster = hasSpellPrepareMax && !isSpellbookSpellcaster;
+    let isRitualSpellCaster = false;
+    if (overrideIsRitualSpellCaster) {
+        isRitualSpellCaster = true;
+    }
+    else {
+        isRitualSpellCaster = configSpellRules === null ? false : configSpellRules.isRitualSpellCaster;
+    }
+    let levelCantripsKnownMaxes = null;
+    if (filteredLevelCantripsKnownMaxes.length) {
+        levelCantripsKnownMaxes = configSpellRules === null ? null : configSpellRules.levelCantripsKnownMaxes;
+    }
+    let levelSpellKnownMaxes = [];
+    if (configSpellRules !== null && configSpellRules.levelSpellKnownMaxes) {
+        levelSpellKnownMaxes = configSpellRules.levelSpellKnownMaxes.filter(TypeScriptUtils.isNotNullOrUndefined);
+    }
+    let levelPreparedSpellMaxes = [];
+    if (configSpellRules !== null && configSpellRules.levelPreparedSpellMaxes) {
+        levelPreparedSpellMaxes = configSpellRules.levelPreparedSpellMaxes.filter(TypeScriptUtils.isNotNullOrUndefined);
+    }
+    let levelSpellSlots = [];
+    if (configSpellRules !== null) {
+        levelSpellSlots = (_a = configSpellRules.levelSpellSlots) !== null && _a !== void 0 ? _a : [
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+            [],
+        ];
+    }
+    return {
+        spellcastingAbilityStat,
+        spellcastingAbilityStatId,
+        knowsAllSpells,
+        levelCantripsKnownMaxes,
+        levelSpellKnownMaxes,
+        levelPreparedSpellMaxes,
+        levelSpellSlots,
+        isRitualSpellCaster,
+        isKnownSpellcaster,
+        isSpellbookSpellcaster,
+        isPreparedSpellcaster,
+    };
+}
+/**
+ *
+ * @param pactMagicClasses
+ * @param ruleData
+ */
+export function deriveClassPactMagicSlots(pactMagicClasses, ruleData) {
+    let pactMagicSlotsAvailable = [];
+    if (pactMagicClasses.length > 1) {
+        pactMagicSlotsAvailable = deriveMulticlassSlots(pactMagicClasses, ruleData, RuleDataAccessors.getPactMagicMultiClassSpellSlots(ruleData));
+    }
+    else if (pactMagicClasses.length === 1) {
+        pactMagicSlotsAvailable = deriveClassLevelSpellSlots(pactMagicClasses[0]);
+    }
+    return pactMagicSlotsAvailable;
+}
+/**
+ *
+ * @param spellcastingClasses
+ * @param ruleData
+ */
+export function deriveClassSpellSlots(spellcastingClasses, ruleData) {
+    let spellSlotsAvailable = [];
+    if (spellcastingClasses.length > 1) {
+        spellSlotsAvailable = deriveMulticlassSlots(spellcastingClasses, ruleData, RuleDataAccessors.getMultiClassSpellSlots(ruleData));
+    }
+    else if (spellcastingClasses.length === 1) {
+        spellSlotsAvailable = deriveClassLevelSpellSlots(spellcastingClasses[0]);
+    }
+    return spellSlotsAvailable;
+}
+/**
+ *
+ * @param charClass
+ */
+export function deriveClassLevelSpellSlots(charClass) {
+    const classLevel = ClassAccessors.getLevel(charClass);
+    const configSpellRules = ClassAccessors.getSpellConfiguration(charClass);
+    return configSpellRules && configSpellRules.levelSpellSlots ? configSpellRules.levelSpellSlots[classLevel] : [];
+}
+/**
+ *
+ * @param charClasses
+ * @param ruleData
+ * @param spellSlotsData
+ */
+export function deriveMulticlassSlots(charClasses, ruleData, spellSlotsData) {
+    if (spellSlotsData === null) {
+        return [];
+    }
+    const combinedLevel = charClasses.reduce((acc, charClass) => {
+        const configSpellRules = ClassAccessors.getSpellConfiguration(charClass);
+        if (configSpellRules !== null && configSpellRules.multiClassSpellSlotDivisor !== null) {
+            const levelContribution = ClassAccessors.getLevel(charClass) / configSpellRules.multiClassSpellSlotDivisor;
+            if (configSpellRules.multiClassSpellSlotRounding === MulticlassSpellSlotRoundingEnum.UP) {
+                acc += Math.ceil(levelContribution);
+            }
+            else {
+                acc += Math.floor(levelContribution);
+            }
+        }
+        return acc;
+    }, 0);
+    return spellSlotsData[combinedLevel];
+}
+/**
+ *
+ * @param knownCantripsMax
+ * @param activeCantripsCount
+ */
+export function deriveIsCantripsKnownMaxed(knownCantripsMax, activeCantripsCount) {
+    let cantripsKnownMaxed = false;
+    if (knownCantripsMax === null) {
+        cantripsKnownMaxed = true;
+    }
+    else {
+        cantripsKnownMaxed = activeCantripsCount >= knownCantripsMax;
+    }
+    return cantripsKnownMaxed;
+}
+/**
+ *
+ * @param knownSpellsMax
+ * @param knownSpellCount
+ * @param knowAllClassSpells
+ */
+export function deriveIsSpellsKnownMaxed(knownSpellsMax, knownSpellCount, knowAllClassSpells) {
+    let spellsKnownMaxed = false;
+    if (knowAllClassSpells) {
+        spellsKnownMaxed = true;
+    }
+    else if (knownSpellsMax === null) {
+        spellsKnownMaxed = false;
+    }
+    else {
+        spellsKnownMaxed = knownSpellCount >= knownSpellsMax;
+    }
+    return spellsKnownMaxed;
+}
+/**
+ *
+ * @param spellSlots
+ * @param pactMagicSlots
+ * @param ruleData
+ */
+export function deriveCombinedSpellSlotsInfo(spellSlots, pactMagicSlots, ruleData) {
+    const maxSpellLevel = RuleDataAccessors.getMaxSpellLevel(ruleData);
+    const combinedSpellSlots = [];
+    for (let i = 1; i <= maxSpellLevel; i++) {
+        const pactMagicSlotLevel = pactMagicSlots.find((slotLevel) => slotLevel.level === i);
+        const spellSlotLevel = spellSlots.find((slotLevel) => slotLevel.level === i);
+        const pactMagicAvailable = pactMagicSlotLevel ? pactMagicSlotLevel.available : 0;
+        const pactMagicUsed = pactMagicSlotLevel ? pactMagicSlotLevel.used : 0;
+        const spellAvailable = spellSlotLevel ? spellSlotLevel.available : 0;
+        const spellUsed = spellSlotLevel ? spellSlotLevel.used : 0;
+        combinedSpellSlots.push({
+            level: i,
+            available: pactMagicAvailable + spellAvailable,
+            used: pactMagicUsed + spellUsed,
+            remaining: pactMagicAvailable + spellAvailable - (pactMagicUsed + spellUsed),
+        });
+    }
+    return combinedSpellSlots;
+}
+/**
+ *
+ * @param spellcastingClasses
+ * @param spellSlotsData
+ * @param ruleData
+ */
+export function deriveSpellSlotsInfo(spellcastingClasses, spellSlotsData, ruleData) {
+    const spellSlotsAvailable = deriveClassSpellSlots(spellcastingClasses, ruleData);
+    return spellSlotsAvailable
+        .map((availableCount, idx) => {
+        if (availableCount === 0) {
+            return null;
+        }
+        return {
+            available: availableCount,
+            used: spellSlotsData.length ? spellSlotsData[idx].used : 0,
+            level: idx + 1,
+        };
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param pactMagicClasses
+ * @param pactMagicSlotsData
+ * @param ruleData
+ */
+export function derivePactMagicSlotsInfo(pactMagicClasses, pactMagicSlotsData, ruleData) {
+    const pactMagicSlotsAvailable = deriveClassPactMagicSlots(pactMagicClasses, ruleData);
+    return pactMagicSlotsAvailable
+        .map((availableCount, idx) => {
+        if (availableCount === 0) {
+            return null;
+        }
+        return {
+            available: availableCount,
+            used: pactMagicSlotsData.length ? pactMagicSlotsData[idx].used : 0,
+            level: idx + 1,
+        };
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined)
+        .reduce((acc, slot) => {
+        if (slot.available !== 0) {
+            acc.push(slot);
+        }
+        return acc;
+    }, []);
+}
+/**
+ * TODO refactor this to supply base toHit and bonus toHit so that it doesn't have to know if bonuses are added in already
+ * @param spell
+ * @param modifiers
+ * @param abilityLookup
+ * @param profBonus
+ * @param fallbackToHit
+ * @param valueLookup
+ */
+export function deriveSpellToHit(spell, modifiers, abilityLookup, profBonus, fallbackToHit, valueLookup) {
+    let toHit = null;
+    if (isAttack(spell)) {
+        const toHitOverride = deriveCustomValue(spell, AdjustmentTypeEnum.TO_HIT_OVERRIDE, null, valueLookup);
+        let toHitBonus = deriveCustomValue(spell, AdjustmentTypeEnum.TO_HIT_BONUS, 0, valueLookup);
+        toHitBonus = toHitBonus === null ? 0 : toHitBonus;
+        if (toHitOverride !== null) {
+            return toHitOverride;
+        }
+        let baseToHit = 0;
+        const spellCastingAbilityId = getSpellCastingAbilityId(spell);
+        if (spellCastingAbilityId === null) {
+            baseToHit = fallbackToHit;
+        }
+        else {
+            baseToHit = deriveSpellAttackModifier(profBonus, AbilityDerivers.deriveStatModifier(spellCastingAbilityId, abilityLookup));
+        }
+        const dataOriginType = getDataOrigin(spell) ? getDataOriginType(spell) : null;
+        if (dataOriginType !== DataOriginTypeEnum.CLASS && dataOriginType !== DataOriginTypeEnum.CLASS_FEATURE) {
+            // find out about bonus toHit for current spell
+            const bonusToHitModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusSpellAttackModifier(modifier, spell));
+            baseToHit += ModifierDerivers.sumModifiers(bonusToHitModifiers, abilityLookup);
+        }
+        toHit = baseToHit + toHitBonus;
+    }
+    return toHit;
+}
+/**
+ *
+ * @param spell
+ * @param abilityLookup
+ * @param fallbackModifier
+ */
+export function deriveSpellSpellcastingModifier(spell, abilityLookup, fallbackModifier) {
+    const spellCastingAbilityId = getSpellCastingAbilityId(spell);
+    if (spellCastingAbilityId !== null) {
+        const ability = abilityLookup[spellCastingAbilityId];
+        const abilityModifier = AbilityAccessors.getModifier(ability);
+        if (ability && abilityModifier !== null) {
+            return abilityModifier;
+        }
+        return fallbackModifier;
+    }
+    return fallbackModifier;
+}
+/**
+ *
+ * @param spell
+ */
+export function deriveIsCastedBySpellbookSpellcaster(spell) {
+    const dataOrigin = getDataOrigin(spell);
+    return !!(dataOrigin.primary !== null && ClassAccessors.isSpellbookSpellcaster(dataOrigin.primary));
+}
+/**
+ *
+ * @param spell
+ */
+export function deriveIsCastedByRitualSpellcaster(spell) {
+    const dataOrigin = getDataOrigin(spell);
+    const dataOriginType = getDataOriginType(spell);
+    switch (dataOriginType) {
+        case DataOriginTypeEnum.CLASS:
+            return !!(dataOrigin.primary !== null &&
+                ClassAccessors.isRitualSpellCaster(dataOrigin.primary));
+        case DataOriginTypeEnum.CLASS_FEATURE:
+            return !!(dataOrigin.parent !== null &&
+                ClassAccessors.isRitualSpellCaster(dataOrigin.parent));
+    }
+    return false;
+}
+/**
+ *
+ * @param spell
+ */
+export function deriveIsActive(spell) {
+    switch (getDataOriginType(spell)) {
+        case DataOriginTypeEnum.CLASS:
+            const dataOrigin = getDataOrigin(spell);
+            const spellIsPepared = deriveIsPrepared(spell);
+            const charClass = dataOrigin.primary;
+            return (isCantrip(spell) ||
+                (ClassAccessors.isPreparedSpellcaster(charClass) && spellIsPepared) ||
+                ClassAccessors.isKnownSpellcaster(charClass) ||
+                (ClassAccessors.isSpellbookSpellcaster(charClass) && spellIsPepared));
+        default:
+            return true;
+    }
+}
+/**
+ *
+ * @param spell
+ * @param modifiers
+ * @param abilityLookup
+ * @param fixedDamageBonus
+ * @param valueLookup
+ */
+export function deriveSpellBonusFixedDamage(spell, modifiers, abilityLookup, fixedDamageBonus, valueLookup) {
+    let adjustmentDamageBonus = deriveCustomValue(spell, AdjustmentTypeEnum.FIXED_VALUE_BONUS, 0, valueLookup);
+    adjustmentDamageBonus = adjustmentDamageBonus === null ? 0 : adjustmentDamageBonus;
+    const damageSpellAttackModifiers = modifiers.filter((modifier) => ModifierValidators.isValidDamageSpellAttackModifier(modifier, spell));
+    const damageSpellAttackModifierTotal = ModifierDerivers.sumModifiers(damageSpellAttackModifiers, abilityLookup);
+    let extraDamageBonus = 0;
+    if (getDefinitionName(spell) === DB_STRING_SPELL_ELDRITCH_BLAST) {
+        const eldritchBlastBonusDamageModifiers = modifiers.filter((modifier) => ModifierValidators.isEldritchBlastBonusDamageModifier(modifier));
+        const edlritchBlastBonusDamageTotal = ModifierDerivers.sumModifiers(eldritchBlastBonusDamageModifiers, abilityLookup);
+        extraDamageBonus += edlritchBlastBonusDamageTotal;
+    }
+    return damageSpellAttackModifierTotal + fixedDamageBonus + adjustmentDamageBonus + extraDamageBonus;
+}
+/**
+ *
+ * @param spell
+ * @param modifiers
+ * @param proficiencyBonus
+ * @param abilityLookup
+ * @param fallbackBaseSaveDc
+ * @param valueLookup
+ */
+export function deriveSpellAttackSaveValue(spell, modifiers, proficiencyBonus, abilityLookup, fallbackBaseSaveDc, valueLookup) {
+    if (!getRequiresSavingThrow(spell)) {
+        return null;
+    }
+    const saveDcOverride = deriveCustomValue(spell, AdjustmentTypeEnum.SAVE_DC_OVERRIDE, null, valueLookup);
+    let saveDcBonus = deriveCustomValue(spell, AdjustmentTypeEnum.SAVE_DC_BONUS, 0, valueLookup);
+    saveDcBonus = saveDcBonus === null ? 0 : saveDcBonus;
+    if (saveDcOverride !== null) {
+        return saveDcOverride;
+    }
+    const overrideSaveDc = getOverrideSaveDc(spell);
+    if (overrideSaveDc !== null) {
+        return overrideSaveDc;
+    }
+    let saveDc = 0;
+    const spellCastingAbilityId = getSpellCastingAbilityId(spell);
+    if (spellCastingAbilityId === null) {
+        saveDc = fallbackBaseSaveDc + saveDcBonus;
+    }
+    else {
+        const abilityModifier = AbilityDerivers.deriveStatModifier(spellCastingAbilityId, abilityLookup);
+        saveDc = CharacterDerivers.deriveAttackSaveValue(proficiencyBonus, abilityModifier) + saveDcBonus;
+    }
+    switch (getDataOriginType(spell)) {
+        case DataOriginTypeEnum.CLASS:
+        case DataOriginTypeEnum.CLASS_FEATURE:
+        case DataOriginTypeEnum.ITEM:
+            break;
+        default:
+            const bonusToHitModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusSpellSaveDc(modifier));
+            saveDc += ModifierDerivers.sumModifiers(bonusToHitModifiers, abilityLookup);
+    }
+    return saveDc;
+}
+/**
+ *
+ * @param spell
+ * @param modifiers
+ * @param abilityLookup
+ */
+export function deriveSpellRange(spell, modifiers, abilityLookup) {
+    const range = getRange(spell);
+    let extraRangeBonus = 0;
+    if (getDefinitionName(spell) === DB_STRING_SPELL_ELDRITCH_BLAST) {
+        const eldritchBlastBonusRangeModifiers = modifiers.filter((modifier) => ModifierValidators.isEldritchBlastBonusRangeModifier(modifier));
+        const edlritchBlastBonusRangeTotal = ModifierDerivers.sumModifiers(eldritchBlastBonusRangeModifiers, abilityLookup);
+        extraRangeBonus += edlritchBlastBonusRangeTotal;
+    }
+    let spellAttackRangeMultiplierTotal = 1;
+    if (isAttack(spell)) {
+        const spellAttackRangeMultiplierModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusSpellAttackRangeMultiplierModifier(modifier));
+        spellAttackRangeMultiplierTotal = Math.max(1, ModifierDerivers.sumModifiers(spellAttackRangeMultiplierModifiers, abilityLookup, 1));
+    }
+    return (((range !== null && range.rangeValue ? range.rangeValue : 0) + extraRangeBonus) *
+        spellAttackRangeMultiplierTotal);
+}
+/**
+ *
+ * @param spell
+ * @param valueLookup
+ */
+export function deriveIsCustomized(spell, valueLookup) {
+    const [contextId, contextTypeId] = deriveExpandedContextIds(spell);
+    return ValueValidators.validateHasCustomization(SPELL_CUSTOMIZATION_ADJUSTMENT_TYPES, valueLookup, ValueHacks.hack__toString(getMappingId(spell)), ValueHacks.hack__toString(getMappingEntityTypeId(spell)), ValueHacks.hack__toString(contextId), ValueHacks.hack__toString(contextTypeId));
+}
+/**
+ *
+ * @param spell
+ * @param spellListDataOriginLookup
+ */
+export function deriveExpandedDataOriginRef(spell, spellListDataOriginLookup) {
+    const spellListId = getSpellListId(spell);
+    if (spellListId !== null) {
+        const dataOriginRef = HelperUtils.lookupDataOrFallback(spellListDataOriginLookup, spellListId);
+        if (dataOriginRef === null) {
+            return DataOriginGenerators.generateDataOriginRef(DataOriginTypeEnum.UNKNOWN, '');
+        }
+        return dataOriginRef;
+    }
+    return null;
+}
+/**
+ *
+ * @param spell
+ * @param valueTypeId
+ * @param fallback
+ * @param valueLookup
+ */
+function deriveCustomValue(spell, valueTypeId, fallback, valueLookup) {
+    if (valueLookup) {
+        const [contextId, contextTypeId] = deriveExpandedContextIds(spell);
+        return ValueUtils.getKeyValue(valueLookup, valueTypeId, ValueHacks.hack__toString(getMappingId(spell)), ValueHacks.hack__toString(getMappingEntityTypeId(spell)), fallback, ValueHacks.hack__toString(contextId), ValueHacks.hack__toString(contextTypeId));
+    }
+    return fallback;
+}
+/**
+ *
+ * @param spell
+ * @param valueLookup
+ */
+export function deriveNotes(spell, valueLookup) {
+    return deriveCustomValue(spell, AdjustmentTypeEnum.NOTES, null, valueLookup);
+}
+/**
+ *
+ * @param spell
+ * @param valueLookup
+ */
+export function deriveName(spell, valueLookup) {
+    const definitionName = getDefinitionName(spell);
+    let fallbackName = '';
+    if (definitionName !== null) {
+        fallbackName = definitionName;
+    }
+    return deriveCustomValue(spell, AdjustmentTypeEnum.NAME_OVERRIDE, fallbackName, valueLookup);
+}
+/**
+ *
+ * @param spell
+ * @param modifiers
+ * @param abilityLookup
+ */
+export function deriveRange(spell, modifiers, abilityLookup) {
+    let range = null;
+    if (spell.range !== null) {
+        range = Object.assign(Object.assign({}, spell.range), { rangeValue: deriveSpellRange(spell, modifiers, abilityLookup) });
+    }
+    return range;
+}
+/**
+ *
+ * @param spell
+ * @param classInfo
+ */
+export function deriveCanRemove(spell, classInfo) {
+    let canRemove = false;
+    if (getLevel(spell) === 0) {
+        if (classInfo.knownCantripsMax !== null) {
+            canRemove = true;
+        }
+    }
+    else if (!classInfo.knowsAllSpells) {
+        canRemove = true;
+    }
+    return canRemove;
+}
+/**
+ *
+ * @param spell
+ * @param classInfo
+ */
+export function deriveCanPrepare(spell, classInfo) {
+    let canPrepare = !!classInfo.prepareMax;
+    if (getLevel(spell) === 0 || isAlwaysPrepared(spell)) {
+        canPrepare = false;
+    }
+    return canPrepare;
+}
+/**
+ *
+ * @param spell
+ * @param valueLookup
+ */
+export function deriveIsDisplayAsAttack(spell, valueLookup) {
+    return deriveCustomValue(spell, AdjustmentTypeEnum.DISPLAY_AS_ATTACK, null, valueLookup);
+}
+/**
+ *
+ * @param spell
+ * @param characterLevel
+ */
+export function deriveCharacterLevel(spell, characterLevel) {
+    var _a;
+    if (getScaleType(spell) === SpellScaleTypeNameEnum.CHARACTER_LEVEL) {
+        return (_a = getCastAtLevel(spell)) !== null && _a !== void 0 ? _a : characterLevel;
+    }
+    return characterLevel;
+}
+/**
+ *
+ * @param spell
+ */
+export function deriveUniqueKey(spell) {
+    let sourceId = '';
+    switch (getDataOriginType(spell)) {
+        case DataOriginTypeEnum.ITEM:
+            sourceId = ItemAccessors.getUniqueKey(getDataOrigin(spell).primary);
+            break;
+        case DataOriginTypeEnum.CLASS:
+            sourceId = ClassAccessors.getId(getDataOrigin(spell).primary);
+            break;
+        default:
+        // not implemented
+    }
+    return `${deriveKnownKey(spell)}-${sourceId}`;
+}
+/**
+ *
+ * @param spell
+ */
+export function deriveKnownKey(spell) {
+    return `${getMappingId(spell)}-${getMappingEntityTypeId(spell)}`;
+}
+/**
+ *
+ * @param spell
+ */
+export function deriveLeveledKnownKey(spell, castLevel) {
+    return `${getMappingId(spell)}-${getMappingEntityTypeId(spell)}-${castLevel}`;
+}
+/**
+ *
+ * @param scaleType
+ * @param higherLevelDefinition
+ * @param spell
+ * @param ruleData
+ */
+export function deriveAtHigherLevelAdditionalCountEntries(scaleType, higherLevelDefinition, spell, ruleData) {
+    var _a, _b, _c;
+    const entries = [];
+    if (scaleType === SpellScaleTypeNameEnum.SPELL_SCALE) {
+        const spellLevel = getLevel(spell);
+        const maxSpellLevel = RuleDataAccessors.getMaxSpellLevel(ruleData);
+        const levelIncrement = (_a = higherLevelDefinition.level) !== null && _a !== void 0 ? _a : 1;
+        const start = spellLevel + levelIncrement;
+        let j = 1;
+        for (let i = start; i <= maxSpellLevel; i += levelIncrement, j++) {
+            entries.push(CoreSimulators.simulateHigherLevelEntryContract({
+                level: i,
+                description: higherLevelDefinition.details,
+                totalCount: j * ((_b = higherLevelDefinition.value) !== null && _b !== void 0 ? _b : 1),
+            }));
+        }
+    }
+    else {
+        entries.push(CoreSimulators.simulateHigherLevelEntryContract({
+            level: higherLevelDefinition.level,
+            description: higherLevelDefinition.details,
+            totalCount: (_c = higherLevelDefinition.value) !== null && _c !== void 0 ? _c : 1,
+        }));
+    }
+    return entries;
+}
+/**
+ *
+ * @param scaleType
+ * @param higherLevelDefinition
+ * @param spell
+ * @param ruleData
+ */
+export function deriveAtHigherLevelAdditionalTargetsEntries(scaleType, higherLevelDefinition, spell, ruleData) {
+    var _a, _b, _c;
+    const entries = [];
+    if (scaleType === SpellScaleTypeNameEnum.SPELL_SCALE) {
+        const spellLevel = getLevel(spell);
+        const maxSpellLevel = RuleDataAccessors.getMaxSpellLevel(ruleData);
+        const levelIncrement = (_a = higherLevelDefinition.level) !== null && _a !== void 0 ? _a : 1;
+        const start = spellLevel + levelIncrement;
+        let j = 1;
+        for (let i = start; i <= maxSpellLevel; i += levelIncrement, j++) {
+            entries.push(CoreSimulators.simulateHigherLevelEntryContract({
+                level: i,
+                description: higherLevelDefinition.details,
+                targets: j * ((_b = higherLevelDefinition.value) !== null && _b !== void 0 ? _b : 1),
+            }));
+        }
+    }
+    else {
+        entries.push(CoreSimulators.simulateHigherLevelEntryContract({
+            level: higherLevelDefinition.level,
+            description: higherLevelDefinition.details,
+            targets: (_c = higherLevelDefinition.value) !== null && _c !== void 0 ? _c : 1,
+        }));
+    }
+    return entries;
+}
+/**
+ *
+ * @param scaleType
+ * @param higherLevelDefinition
+ * @param spell
+ * @param ruleData
+ */
+export function deriveAtHigherLevelExtendedAreaEntries(scaleType, higherLevelDefinition, spell, ruleData) {
+    var _a, _b, _c;
+    const entries = [];
+    if (scaleType === SpellScaleTypeNameEnum.SPELL_SCALE) {
+        const spellRange = getRange(spell);
+        const spellLevel = getLevel(spell);
+        const maxSpellLevel = RuleDataAccessors.getMaxSpellLevel(ruleData);
+        const levelIncrement = (_a = higherLevelDefinition.level) !== null && _a !== void 0 ? _a : 1;
+        const start = spellLevel + levelIncrement;
+        let j = 1;
+        for (let i = start; i <= maxSpellLevel; i += levelIncrement, j++) {
+            entries.push(CoreSimulators.simulateHigherLevelEntryContract({
+                level: i,
+                description: higherLevelDefinition.details,
+                extendedAoe: j * ((_b = higherLevelDefinition.value) !== null && _b !== void 0 ? _b : 1) + ((_c = spellRange === null || spellRange === void 0 ? void 0 : spellRange.aoeValue) !== null && _c !== void 0 ? _c : 0),
+            }));
+        }
+    }
+    else {
+        entries.push(CoreSimulators.simulateHigherLevelEntryContract({
+            level: higherLevelDefinition.level,
+            description: higherLevelDefinition.details,
+            extendedAoe: higherLevelDefinition.value,
+        }));
+    }
+    return entries;
+}
+/**
+ *
+ * @param scaleType
+ * @param higherLevelDefinition
+ * @param spell
+ * @param ruleData
+ */
+export function deriveAtHigherLevelCommonDescriptionEntries(scaleType, higherLevelDefinition, spell, ruleData) {
+    const entries = [];
+    if (scaleType === SpellScaleTypeNameEnum.SPELL_SCALE) {
+        let levelIncrement = higherLevelDefinition.level;
+        if (levelIncrement === null) {
+            entries.push(CoreSimulators.simulateHigherLevelEntryContract({
+                level: higherLevelDefinition.level,
+                description: higherLevelDefinition.details,
+            }));
+        }
+        else {
+            const spellLevel = getLevel(spell);
+            const maxSpellLevel = RuleDataAccessors.getMaxSpellLevel(ruleData);
+            const start = spellLevel + levelIncrement;
+            for (let i = start; i <= maxSpellLevel; i += levelIncrement) {
+                entries.push(CoreSimulators.simulateHigherLevelEntryContract({
+                    level: i,
+                    description: higherLevelDefinition.details,
+                }));
+            }
+        }
+    }
+    else {
+        entries.push(CoreSimulators.simulateHigherLevelEntryContract({
+            level: higherLevelDefinition.level,
+            description: higherLevelDefinition.details,
+        }));
+    }
+    return entries;
+}
+export function deriveAtHigherLevelExtendedRangeEntries(scaleType, higherLevelDefinition, spell, ruleData) {
+    var _a, _b, _c;
+    const entries = [];
+    if (scaleType === SpellScaleTypeNameEnum.SPELL_SCALE) {
+        const spellRange = getRange(spell);
+        const spellLevel = getLevel(spell);
+        const maxSpellLevel = RuleDataAccessors.getMaxSpellLevel(ruleData);
+        const levelIncrement = (_a = higherLevelDefinition.level) !== null && _a !== void 0 ? _a : 1;
+        const start = spellLevel + levelIncrement;
+        let j = 1;
+        for (let i = start; i <= maxSpellLevel; i += levelIncrement, j++) {
+            entries.push(CoreSimulators.simulateHigherLevelEntryContract({
+                level: i,
+                description: higherLevelDefinition.details,
+                range: j * ((_b = higherLevelDefinition.value) !== null && _b !== void 0 ? _b : 1) + ((_c = spellRange === null || spellRange === void 0 ? void 0 : spellRange.rangeValue) !== null && _c !== void 0 ? _c : 0),
+            }));
+        }
+    }
+    else {
+        entries.push(CoreSimulators.simulateHigherLevelEntryContract({
+            level: higherLevelDefinition.level,
+            description: higherLevelDefinition.details,
+            range: higherLevelDefinition.value,
+        }));
+    }
+    return entries;
+}
+/**
+ *
+ * @param spell
+ * @param ruleData
+ */
+export function deriveAtHigherLevels(spell, ruleData) {
+    var _a;
+    const higherLevelData = getDefinitionAtHigherLevels(spell);
+    // TODO V5: do we need the check this julie/brian for context
+    const scaleType = higherLevelData ? getScaleType(spell) : null;
+    if (higherLevelData === null || scaleType === null) {
+        return null;
+    }
+    const additionalAttacks = [];
+    const additionalTargets = [];
+    const areaOfEffect = [];
+    const creatures = [];
+    const duration = [];
+    const special = [];
+    const range = [];
+    (_a = higherLevelData.higherLevelDefinitions) === null || _a === void 0 ? void 0 : _a.forEach((higherLevelDefinition) => {
+        switch (higherLevelDefinition.typeId) {
+            case AdditionalTypeEnum.ADDITIONAL_COUNT:
+                additionalAttacks.push(...deriveAtHigherLevelAdditionalCountEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.ADDITIONAL_TARGETS:
+                additionalTargets.push(...deriveAtHigherLevelAdditionalTargetsEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.EXTENDED_AREA:
+                areaOfEffect.push(...deriveAtHigherLevelExtendedAreaEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.EXTENDED_DURATION:
+                duration.push(...deriveAtHigherLevelCommonDescriptionEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.ADDITIONAL_CREATURES:
+                creatures.push(...deriveAtHigherLevelCommonDescriptionEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.EXTENDED_RANGE:
+                range.push(...deriveAtHigherLevelExtendedRangeEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.ADDITIONAL_POINTS:
+            case AdditionalTypeEnum.SPECIAL:
+            default:
+                special.push(...deriveAtHigherLevelCommonDescriptionEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+        }
+    });
+    return {
+        additionalAttacks,
+        additionalTargets,
+        areaOfEffect,
+        creatures,
+        duration,
+        higherLevelDefinitions: higherLevelData.higherLevelDefinitions,
+        points: [],
+        special,
+        range,
+    };
+}
+/**
+ *
+ * @param modifier
+ * @param spell
+ * @param ruleData
+ */
+export function deriveModifier(modifier, spell, ruleData) {
+    var _a;
+    const higherLevelData = ModifierAccessors.getAtHigherLevels(modifier);
+    // TODO V5: do we need the check this julie/brian for context
+    const scaleType = higherLevelData ? getScaleType(spell) : null;
+    if (higherLevelData === null || scaleType === null) {
+        return modifier;
+    }
+    const additionalAttacks = [];
+    const additionalTargets = [];
+    const areaOfEffect = [];
+    const creatures = [];
+    const duration = [];
+    const points = [];
+    const special = [];
+    const range = [];
+    (_a = higherLevelData.higherLevelDefinitions) === null || _a === void 0 ? void 0 : _a.forEach((higherLevelDefinition) => {
+        var _a, _b, _c, _d;
+        switch (higherLevelDefinition.typeId) {
+            case AdditionalTypeEnum.ADDITIONAL_POINTS:
+                if (scaleType === SpellScaleTypeNameEnum.SPELL_SCALE) {
+                    const spellLevel = getLevel(spell);
+                    const maxSpellLevel = RuleDataAccessors.getMaxSpellLevel(ruleData);
+                    const defDice = higherLevelDefinition.dice;
+                    const defDiceValue = defDice === null ? null : DiceAccessors.getValue(defDice);
+                    const defDiceCount = defDice === null ? null : DiceAccessors.getCount(defDice);
+                    const modifierDice = ModifierAccessors.getDie(modifier);
+                    const modifierDiceValue = modifierDice === null ? null : DiceAccessors.getValue(modifierDice);
+                    const modifierDiceCount = modifierDice === null ? null : DiceAccessors.getCount(modifierDice);
+                    const modifierDiceFixed = modifierDice === null ? null : DiceAccessors.getFixedValue(modifierDice);
+                    let levelIncrement = (_a = higherLevelDefinition.level) !== null && _a !== void 0 ? _a : 1;
+                    let start = spellLevel + levelIncrement;
+                    let j = 1;
+                    for (let i = start; i <= maxSpellLevel; i += levelIncrement, j++) {
+                        // Dice count will be base spell modifier dice count plus the product of the iteration of the spell level bonus and the dice count of the bonus
+                        let newDiceCount = (modifierDiceCount !== null && modifierDiceCount !== void 0 ? modifierDiceCount : 0) + j * (defDiceCount !== null && defDiceCount !== void 0 ? defDiceCount : 0);
+                        // Add bonus fixed value to base fixed value
+                        let newFixedValue = (modifierDiceFixed !== null && modifierDiceFixed !== void 0 ? modifierDiceFixed : 0) + j * ((_b = higherLevelDefinition.value) !== null && _b !== void 0 ? _b : 0);
+                        points.push(CoreSimulators.simulateHigherLevelEntryContract({
+                            level: i,
+                            description: higherLevelDefinition.details,
+                            die: DiceSimulators.simulateDiceContract({
+                                diceCount: newDiceCount,
+                                diceValue: defDiceValue !== null && defDiceValue !== void 0 ? defDiceValue : modifierDiceValue,
+                                fixedValue: newFixedValue,
+                            }),
+                        }));
+                    }
+                }
+                else {
+                    const defDice = higherLevelDefinition.dice;
+                    points.push(CoreSimulators.simulateHigherLevelEntryContract({
+                        level: higherLevelDefinition.level,
+                        description: higherLevelDefinition.details,
+                        die: DiceSimulators.simulateDiceContract({
+                            diceCount: defDice === null ? null : DiceAccessors.getCount(defDice),
+                            diceValue: (_c = (defDice === null ? null : DiceAccessors.getValue(defDice))) !== null && _c !== void 0 ? _c : (_d = ModifierAccessors.getDie(modifier)) === null || _d === void 0 ? void 0 : _d.diceValue,
+                            fixedValue: defDice === null ? null : DiceAccessors.getFixedValue(defDice),
+                        }),
+                    }));
+                }
+                break;
+            case AdditionalTypeEnum.ADDITIONAL_COUNT:
+                additionalAttacks.push(...deriveAtHigherLevelAdditionalCountEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.ADDITIONAL_TARGETS:
+                additionalTargets.push(...deriveAtHigherLevelAdditionalTargetsEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.EXTENDED_AREA:
+                areaOfEffect.push(...deriveAtHigherLevelExtendedAreaEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.EXTENDED_RANGE:
+                range.push(...deriveAtHigherLevelExtendedRangeEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.EXTENDED_DURATION:
+                duration.push(...deriveAtHigherLevelCommonDescriptionEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.ADDITIONAL_CREATURES:
+                creatures.push(...deriveAtHigherLevelCommonDescriptionEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+            case AdditionalTypeEnum.SPECIAL:
+            default:
+                special.push(...deriveAtHigherLevelCommonDescriptionEntries(scaleType, higherLevelDefinition, spell, ruleData));
+                break;
+        }
+    });
+    return Object.assign(Object.assign({}, modifier), { atHigherLevels: {
+            additionalAttacks,
+            additionalTargets,
+            areaOfEffect,
+            creatures,
+            duration,
+            higherLevelDefinitions: higherLevelData.higherLevelDefinitions,
+            points,
+            special,
+            range,
+        } });
+}
+/**
+ *
+ * @param spell
+ * @param ruleData
+ */
+export function deriveModifiers(spell, ruleData) {
+    return getDefinitionModifiers(spell).map((modifier) => deriveModifier(modifier, spell, ruleData));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Spell/generators.js b/ddb_main/packages/rules-engine/es/engine/Spell/generators.js
new file mode 100644
index 0000000..9a6d8a3
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Spell/generators.js
@@ -0,0 +1,702 @@
+import { flatten, groupBy, orderBy, uniqBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { AbilityDerivers } from '../Ability';
+import { BackgroundAccessors, BackgroundDerivers } from '../Background';
+import { CampaignAccessors } from '../Campaign';
+import { CharacterDerivers, } from '../Character';
+import { ClassAccessors } from '../Class';
+import { ClassFeatureAccessors, ClassFeatureSimulators } from '../ClassFeature';
+import { DB_STRING_RITUAL_CASTER_LIST } from '../Core';
+import { DataOriginGenerators, DataOriginTypeEnum } from '../DataOrigin';
+import { FeatAccessors } from '../Feat';
+import { HelperUtils } from '../Helper';
+import { ItemAccessors, ItemDerivers, ItemValidators } from '../Item';
+import { LimitedUseDerivers } from '../LimitedUse';
+import { ModifierAccessors, ModifierBonusTypeEnum, ModifierDerivers, ModifierValidators, } from '../Modifier';
+import { OptionalClassFeatureAccessors } from '../OptionalClassFeature';
+import { OptionalOriginAccessors } from '../OptionalOrigin';
+import { RaceAccessors } from '../Race';
+import { RacialTraitAccessors, RacialTraitSimulators } from '../RacialTrait';
+import { RuleDataAccessors } from '../RuleData';
+import { asPartOfWeaponAttack, countsAsKnownSpell, getAttackType, getAtWillLimitedUseLevel, getBaseLevelAtWill, getComponentId, getComponentTypeId, getDataOrigin, getDataOriginType, getId, getLevel, getLimitedUse, getMappingId, getName, getSpellGroups, isActive, isAlwaysPrepared, isAttack, isCantrip, isDisplayAsAttack, } from './accessors';
+import { deriveAtHigherLevels, deriveCanPrepare, deriveCanRemove, deriveCharacterLevel, deriveExpandedDataOriginRef, deriveIsActive, deriveIsCantripsKnownMaxed, deriveIsCastAsRitual, deriveIsCastedByRitualSpellcaster, deriveIsCastedBySpellbookSpellcaster, deriveIsCustomized, deriveIsDisplayAsAttack, deriveIsPrepared, deriveIsRitual, deriveIsSpellsKnownMaxed, deriveKnownKey, deriveModifiers, deriveName, deriveNotes, deriveRange, deriveSpellAttackModifier, deriveSpellAttackSaveValue, deriveSpellBonusFixedDamage, deriveSpellPrepareMax, deriveSpellSpellcastingModifier, deriveSpellToHit, deriveStartingCastLevel, deriveUniqueKey, getCastLevelRange, getConsumedLimitedUse, getScaledDamage, } from './derivers';
+import { getScaledRange } from './utils';
+import { validateIsAtWill, validateIsLimitedUseAvailableAtScaledAmount, validateShouldShowCharacterSpellAtLevel, validateShouldShowClassSpellAtLevel, } from './validators';
+/**
+ *
+ * @param dataOriginSpell
+ * @param valueLookup
+ * @param ruleData
+ */
+export function generateBaseSpell(dataOriginSpell, valueLookup, ruleData) {
+    return Object.assign(Object.assign({}, dataOriginSpell), { modifiers: deriveModifiers(dataOriginSpell, ruleData), isPrepared: deriveIsPrepared(dataOriginSpell), isActive: deriveIsActive(dataOriginSpell), isRitual: deriveIsRitual(dataOriginSpell), name: deriveName(dataOriginSpell, valueLookup), uniqueKey: deriveUniqueKey(dataOriginSpell), isCustomized: deriveIsCustomized(dataOriginSpell, valueLookup), atHigherLevels: deriveAtHigherLevels(dataOriginSpell, ruleData) });
+}
+/**
+ *
+ * @param spell
+ * @param classInfo
+ * @param overallInfo
+ * @param valueLookup
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateClassSpell(spell, classInfo, overallInfo, valueLookup, ruleData, modifierData) {
+    const { proficiencyBonus, modifiers, abilityLookup, characterLevel, bonusCantripDamage } = overallInfo;
+    const baseSpell = generateBaseSpell(spell, valueLookup, ruleData);
+    let classFixedDamageTotal = classInfo.spellDamage;
+    if (isCantrip(baseSpell)) {
+        classFixedDamageTotal += bonusCantripDamage + classInfo.bonusCantripDamage;
+    }
+    return Object.assign(Object.assign({}, baseSpell), { range: deriveRange(baseSpell, modifiers, abilityLookup), name: deriveName(baseSpell, valueLookup), displayAsAttack: deriveIsDisplayAsAttack(baseSpell, valueLookup), isCastAsRitual: deriveIsCastAsRitual(baseSpell), notes: deriveNotes(baseSpell, valueLookup), toHit: deriveSpellToHit(baseSpell, modifiers, abilityLookup, proficiencyBonus, classInfo.toHit, valueLookup), attackSaveValue: deriveSpellAttackSaveValue(baseSpell, modifiers, proficiencyBonus, abilityLookup, classInfo.spellSaveDc, valueLookup), bonusFixedDamage: deriveSpellBonusFixedDamage(baseSpell, modifiers, abilityLookup, classFixedDamageTotal, valueLookup), spellcastingModifier: classInfo.spellcastingModifier, characterLevel: deriveCharacterLevel(baseSpell, characterLevel), canRemove: deriveCanRemove(baseSpell, classInfo), canPrepare: deriveCanPrepare(baseSpell, classInfo), canAdd: false, entity: null, spellGroupInfoLookup: generateSpellGroupInfoLookup(baseSpell, modifiers, modifierData) });
+}
+/**
+ *
+ * @param spell
+ * @param modifiers
+ * @param modifierData
+ */
+export function generateSpellGroupInfo(spell, spellGroupId, spellGroupModifiers, modifierData) {
+    const highestGroupModifier = ModifierDerivers.deriveHighestValueModifier(spellGroupModifiers, modifierData);
+    if (!highestGroupModifier) {
+        return null;
+    }
+    return {
+        spellGroupId,
+        bonusFixedValue: ModifierDerivers.deriveValue(highestGroupModifier, modifierData, 0, true, {
+            [ModifierBonusTypeEnum.SPELL_LEVEL]: getLevel(spell),
+        }),
+        useCastLevel: ModifierAccessors.getBonusTypes(highestGroupModifier).includes(ModifierBonusTypeEnum.SPELL_LEVEL),
+    };
+}
+/**
+ *
+ * @param spell
+ * @param modifiers
+ * @param modifierData
+ */
+export function generateSpellGroupInfoLookup(spell, modifiers, modifierData) {
+    const spellGroupInfos = getSpellGroups(spell)
+        .map((spellGroupId) => {
+        const spellGroupModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusSpellGroupModifier(modifier, spellGroupId));
+        return generateSpellGroupInfo(spell, spellGroupId, spellGroupModifiers, modifierData);
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    return HelperUtils.generateNonNullLookup(spellGroupInfos, (spellGroupInfo) => spellGroupInfo.spellGroupId);
+}
+/**
+ *
+ * @param toHitFallback
+ * @param attackSaveFallback
+ * @param bonusFixedDamageFallback
+ * @param spellcastingModifier
+ */
+export function generateCharacterSpell_contextInfo(toHitFallback, attackSaveFallback, bonusFixedDamageFallback, spellcastingModifier) {
+    return {
+        toHitFallback,
+        attackSaveFallback,
+        bonusFixedDamageFallback,
+        spellcastingModifier,
+    };
+}
+/**
+ *
+ * @param spell
+ * @param overallInfo
+ * @param contextInfo
+ * @param valueLookup
+ * @param ruleData
+ */
+export function generateCharacterSpell(spell, overallInfo, contextInfo, valueLookup, ruleData, modifierData) {
+    const { proficiencyBonus, modifiers, abilityLookup, characterLevel } = overallInfo;
+    const baseSpell = generateBaseSpell(spell, valueLookup, ruleData);
+    return Object.assign(Object.assign({}, baseSpell), { range: deriveRange(baseSpell, modifiers, abilityLookup), name: deriveName(baseSpell, valueLookup), displayAsAttack: deriveIsDisplayAsAttack(baseSpell, valueLookup), isCastAsRitual: deriveIsCastAsRitual(baseSpell), notes: deriveNotes(baseSpell, valueLookup), toHit: deriveSpellToHit(baseSpell, modifiers, abilityLookup, proficiencyBonus, contextInfo.toHitFallback, valueLookup), attackSaveValue: deriveSpellAttackSaveValue(baseSpell, modifiers, proficiencyBonus, abilityLookup, contextInfo.attackSaveFallback, valueLookup), bonusFixedDamage: deriveSpellBonusFixedDamage(baseSpell, modifiers, abilityLookup, contextInfo.bonusFixedDamageFallback, valueLookup), spellcastingModifier: deriveSpellSpellcastingModifier(baseSpell, abilityLookup, contextInfo.spellcastingModifier), canPrepare: false, canRemove: false, characterLevel: deriveCharacterLevel(baseSpell, characterLevel), canAdd: false, entity: null, spellGroupInfoLookup: generateSpellGroupInfoLookup(baseSpell, modifiers, modifierData) });
+}
+/**
+ *
+ * @param featureSpells
+ * @param classSpells
+ */
+export function updateClassSpells(featureSpells, classSpells) {
+    featureSpells.forEach((spell, spellIdx) => {
+        if (getAtWillLimitedUseLevel(spell) !== null) {
+            const classSpellIdx = classSpells.findIndex((decoratedSpell) => getId(decoratedSpell) === getId(spell));
+            if (classSpellIdx > -1) {
+                const classSpell = classSpells[classSpellIdx];
+                const spellAlwaysPrepared = isAlwaysPrepared(spell);
+                classSpells[classSpellIdx] = Object.assign(Object.assign({}, classSpell), { alwaysPrepared: spellAlwaysPrepared ? spellAlwaysPrepared : isAlwaysPrepared(classSpell) });
+            }
+        }
+    });
+    const alwaysPreparedSpellIds = classSpells.filter((spell) => isAlwaysPrepared(spell)).map((spell) => getId(spell));
+    let finalSpells = classSpells;
+    if (alwaysPreparedSpellIds.length) {
+        finalSpells = classSpells.filter((spell) => {
+            if (!isAlwaysPrepared(spell) && alwaysPreparedSpellIds.includes(getId(spell))) {
+                return false;
+            }
+            return true;
+        });
+    }
+    return finalSpells;
+}
+/**
+ *
+ * @param featureSpells
+ * @param classSpells
+ */
+export function updateClassFeatureSpells(featureSpells, classSpells) {
+    return featureSpells.map((spell, spellIdx) => {
+        if (getBaseLevelAtWill(spell)) {
+            const decoratedSpellIdx = classSpells.findIndex((decoratedSpell) => getId(decoratedSpell) === getId(spell));
+            if (decoratedSpellIdx > -1) {
+                const decoratedSpell = classSpells[decoratedSpellIdx];
+                return Object.assign(Object.assign({}, spell), { prepared: deriveIsPrepared(decoratedSpell) });
+            }
+        }
+        return spell;
+    });
+}
+/**
+ *
+ * @param characterLevel
+ * @param charClasses
+ * @param abilityLookup
+ * @param profBonus
+ * @param modifiers
+ */
+export function generateClassSpellLists(characterLevel, charClasses, abilityLookup, profBonus, modifiers) {
+    return charClasses.map((charClass) => generateClassSpellsInfo(characterLevel, charClass, abilityLookup, profBonus, modifiers));
+}
+/**
+ *
+ * @param characterLevel
+ * @param charClass
+ * @param abilityLookup
+ * @param profBonus
+ * @param modifiers
+ */
+export function generateClassSpellsInfo(characterLevel, charClass, abilityLookup, profBonus, modifiers) {
+    var _a;
+    let decoratedSpells = ClassAccessors.getSpells(charClass);
+    const classSlug = ClassAccessors.getSlug(charClass);
+    const classLevel = ClassAccessors.getLevel(charClass);
+    const classSpellRules = ClassAccessors.getSpellRules(charClass);
+    const spellPrepareType = ClassAccessors.getSpellPrepareType(charClass);
+    const spellcastingModifier = AbilityDerivers.deriveStatModifier(classSpellRules.spellcastingAbilityStatId, abilityLookup);
+    const knownCantripsMax = classSpellRules.levelCantripsKnownMaxes
+        ? classSpellRules.levelCantripsKnownMaxes[classLevel]
+        : null;
+    const knownSpellsMax = classSpellRules.levelSpellKnownMaxes
+        ? classSpellRules.levelSpellKnownMaxes[classLevel]
+        : null;
+    const preparedSpellsMax = classSpellRules.levelPreparedSpellMaxes
+        ? (_a = classSpellRules.levelPreparedSpellMaxes[classLevel]) !== null && _a !== void 0 ? _a : null // coallesce if the array is shorter than the class level, happens for prepared classes not using OSIRIS rules
+        : null;
+    const prepareMax = preparedSpellsMax !== null && preparedSpellsMax !== void 0 ? preparedSpellsMax : deriveSpellPrepareMax(spellPrepareType, classLevel, spellcastingModifier);
+    const canAddSpells = !classSpellRules.knowsAllSpells || knownCantripsMax !== null || knownSpellsMax === null;
+    const baseToHitModifier = deriveSpellAttackModifier(profBonus, spellcastingModifier);
+    const bonusSpellSaveDcModifiers = modifiers.filter((modifier) => ModifierValidators.isBonusSpellSaveDc(modifier));
+    const bonusSpellSaveDcModifierTotal = ModifierDerivers.sumModifiers(bonusSpellSaveDcModifiers, abilityLookup);
+    const classSaveDcModifiers = modifiers.filter((modifier) => ModifierValidators.isValidBonusClassSpellSaveDcModifier(modifier, classSlug));
+    const classSaveDcModifierTotal = ModifierDerivers.sumModifiers(classSaveDcModifiers, abilityLookup);
+    const spellSaveDc = CharacterDerivers.deriveAttackSaveValue(profBonus, spellcastingModifier) +
+        bonusSpellSaveDcModifierTotal +
+        classSaveDcModifierTotal;
+    decoratedSpells = orderBy(decoratedSpells, [(spell) => getLevel(spell), (spell) => getName(spell)]);
+    const activeSpells = decoratedSpells.filter((spell) => deriveIsActive(spell));
+    let activeCantripsCount = decoratedSpells.filter((s) => countsAsKnownSpell(s) && isCantrip(s)).length;
+    const activeFeatureCantripCount = ClassAccessors.getFeatureSpells(charClass).filter((s) => countsAsKnownSpell(s) && isCantrip(s)).length;
+    activeCantripsCount += activeFeatureCantripCount;
+    let knownSpellCount = decoratedSpells.filter((s) => countsAsKnownSpell(s) && !isCantrip(s)).length;
+    const knownFeatureSpellCount = ClassAccessors.getFeatureSpells(charClass).filter((s) => countsAsKnownSpell(s) && !isCantrip(s)).length;
+    knownSpellCount += knownFeatureSpellCount;
+    const preparedSpellCount = decoratedSpells.filter((s) => !isCantrip(s) && deriveIsPrepared(s, false) && countsAsKnownSpell(s)).length;
+    const knownSpellNames = decoratedSpells.map((spell) => getName(spell, false));
+    const knownSpellIds = decoratedSpells.map((spell) => deriveKnownKey(spell));
+    const isSpellsKnownMaxed = deriveIsSpellsKnownMaxed(knownSpellsMax, knownSpellCount, classSpellRules.knowsAllSpells);
+    const isCantripsKnownMaxed = deriveIsCantripsKnownMaxed(knownCantripsMax, activeCantripsCount);
+    const isPrepareMaxed = !!prepareMax && preparedSpellCount >= prepareMax;
+    let ritualSpells = [];
+    if (classSpellRules.isRitualSpellCaster) {
+        ritualSpells = decoratedSpells.filter((spell) => deriveIsRitual(spell) &&
+            (isCantrip(spell) ||
+                (classSpellRules.isPreparedSpellcaster && deriveIsPrepared(spell)) ||
+                classSpellRules.isKnownSpellcaster ||
+                classSpellRules.isSpellbookSpellcaster));
+    }
+    return {
+        charClass,
+        knownSpellcaster: classSpellRules.isKnownSpellcaster,
+        preparedSpellcaster: classSpellRules.isPreparedSpellcaster,
+        spellbookSpellcaster: classSpellRules.isSpellbookSpellcaster,
+        spellcastingModifier,
+        spellcastingAbility: classSpellRules.spellcastingAbilityStat,
+        attackSaveValue: spellSaveDc,
+        toHitValue: baseToHitModifier,
+        prepareMax,
+        knownCantripsMax,
+        knownSpellsMax,
+        canAddSpells,
+        isSpellsKnownMaxed,
+        isCantripsKnownMaxed,
+        isPrepareMaxed,
+        spells: decoratedSpells,
+        activeSpells,
+        ritualSpells,
+        knownSpellNames,
+        knownSpellIds,
+        activeCantripsCount,
+        activeFeatureCantripCount,
+        knownSpellCount,
+        knownFeatureSpellCount,
+        preparedSpellCount,
+    };
+}
+/**
+ *
+ * @param spell
+ */
+export function generateDataOriginKey(spell) {
+    return DataOriginGenerators.generateDataOriginKey(getComponentId(spell), getComponentTypeId(spell));
+}
+/**
+ *
+ * @param spells
+ */
+export function generateSpellComponentLookup(spells) {
+    return groupBy(spells, (spell) => generateDataOriginKey(spell));
+}
+/**
+ *
+ * @param spells
+ * @param partyInfo
+ */
+export function generateItemSpellLookup(spells, partyInfo) {
+    const partyItemSpells = partyInfo ? CampaignAccessors.getItemSpells(partyInfo) : [];
+    return generateSpellComponentLookup(uniqBy([...partyItemSpells, ...spells], (spell) => getMappingId(spell)));
+}
+/**
+ *
+ * @param modifiers
+ * @param items
+ * @param feats
+ * @param race
+ * @param classes
+ * @param proficiencyBonus
+ * @param abilityLookup
+ * @param classSpellInfoLookup
+ * @param overallSpellInfo
+ * @param valueLookup
+ * @param ruleData
+ * @param modifierData
+ */
+export function generateCharacterSpells(modifiers, items, feats, race, classes, proficiencyBonus, abilityLookup, classSpellInfoLookup, overallSpellInfo, valueLookup, ruleData, modifierData) {
+    /**
+     * NOTE: Talked through, and we decided that any character spell cannot be forced
+     * to go lower than a 0 value for each of these highest values.  You shouldn't be forced
+     * to take a -1 into your calculation if you are very unoptimized
+     */
+    let highestMiscAttackSave = CharacterDerivers.deriveAttackSaveValue(proficiencyBonus, 0);
+    let highestMiscToHit = proficiencyBonus;
+    let highestSpellcastingModifier = 0;
+    let highestFixedDamage = 0;
+    classes.forEach((charClass) => {
+        if (ClassAccessors.isSpellcastingActive(charClass) || ClassAccessors.isPactMagicActive(charClass)) {
+            // TODO fix lookup
+            const classSpellInfo = classSpellInfoLookup[ClassAccessors.getId(charClass)];
+            if (classSpellInfo.spellSaveDc > highestMiscAttackSave) {
+                highestMiscAttackSave = classSpellInfo.spellSaveDc;
+            }
+            if (classSpellInfo.baseToHitModifier > highestMiscToHit) {
+                highestMiscToHit = classSpellInfo.baseToHitModifier;
+            }
+            if (classSpellInfo.spellcastingModifier > highestSpellcastingModifier) {
+                highestSpellcastingModifier = classSpellInfo.spellcastingModifier;
+            }
+            if (classSpellInfo.spellDamage > highestFixedDamage) {
+                highestFixedDamage = classSpellInfo.spellDamage;
+            }
+        }
+    });
+    const spells = [];
+    items.forEach((item) => {
+        const itemSpells = ItemAccessors.getSpells(item);
+        const updatedSpells = itemSpells.map((spell) => {
+            const contextInfo = generateCharacterSpell_contextInfo(highestMiscToHit, highestMiscAttackSave, isCantrip(spell) ? overallSpellInfo.bonusCantripDamage : highestFixedDamage, highestSpellcastingModifier);
+            return generateCharacterSpell(spell, overallSpellInfo, contextInfo, valueLookup, ruleData, modifierData);
+        });
+        spells.push(...updatedSpells);
+    });
+    const featureFallbackToHit = CharacterDerivers.deriveAttackModifier(proficiencyBonus, 0);
+    const featureFallbackSaveDc = CharacterDerivers.deriveAttackSaveValue(proficiencyBonus, 0);
+    const featureFallbackSpellcastingModifier = 0;
+    const featureFixedDamage = 0;
+    feats.forEach((feat) => {
+        const featSpells = FeatAccessors.getSpells(feat);
+        const updatedSpells = featSpells.map((spell) => {
+            const contextInfo = generateCharacterSpell_contextInfo(featureFallbackToHit, featureFallbackSaveDc, isCantrip(spell) ? overallSpellInfo.bonusCantripDamage : featureFixedDamage, featureFallbackSpellcastingModifier);
+            return generateCharacterSpell(spell, overallSpellInfo, contextInfo, valueLookup, ruleData, modifierData);
+        });
+        spells.push(...updatedSpells);
+    });
+    if (race) {
+        const raceSpells = RaceAccessors.getSpells(race);
+        const updatedRaceSpells = raceSpells.map((spell) => {
+            const contextInfo = generateCharacterSpell_contextInfo(featureFallbackToHit, featureFallbackSaveDc, isCantrip(spell) ? overallSpellInfo.bonusCantripDamage : featureFixedDamage, featureFallbackSpellcastingModifier);
+            return generateCharacterSpell(spell, overallSpellInfo, contextInfo, valueLookup, ruleData, modifierData);
+        });
+        spells.push(...updatedRaceSpells);
+    }
+    classes.forEach((charClass) => {
+        const classSpellInfo = classSpellInfoLookup[ClassAccessors.getId(charClass)];
+        ClassAccessors.getFeatureSpells(charClass).forEach((spell) => {
+            let fixedDamageTotal = classSpellInfo.spellDamage;
+            if (isCantrip(spell)) {
+                fixedDamageTotal += overallSpellInfo.bonusCantripDamage + classSpellInfo.bonusCantripDamage;
+            }
+            const contextInfo = generateCharacterSpell_contextInfo(classSpellInfo.toHit, classSpellInfo.spellSaveDc, fixedDamageTotal, classSpellInfo.spellcastingModifier);
+            spells.push(generateCharacterSpell(spell, overallSpellInfo, contextInfo, valueLookup, ruleData, modifierData));
+        });
+    });
+    return spells;
+}
+/**
+ *
+ * @param spellSlots
+ */
+export function generateMaxSpellSlotLevel(spellSlots) {
+    if (spellSlots.length) {
+        const sortedSlot = HelperUtils.getLast(spellSlots, ['level']);
+        if (sortedSlot) {
+            return sortedSlot.level;
+        }
+        return 0;
+    }
+    return 0;
+}
+/**
+ *
+ * @param maxSpellSlotLevel
+ * @param maxPactMagicSlotLevel
+ */
+export function generateCombinedMaxSpellSlotLevel(maxSpellSlotLevel, maxPactMagicSlotLevel) {
+    return Math.max(maxSpellSlotLevel, maxPactMagicSlotLevel);
+}
+/**
+ *
+ * @param spellSlots
+ */
+export function generateAvailableSpellSlotLevels(spellSlots) {
+    return spellSlots.filter((slot) => slot.available > 0).map((slot) => slot.level);
+}
+/**
+ *
+ * @param spellSlots
+ */
+export function generateCastableSpellSlotLevels(spellSlots) {
+    return spellSlots.filter((slot) => slot.available - slot.used > 0).map((slot) => slot.level);
+}
+/**
+ *
+ * @param classes
+ */
+export function generateClassSpells(classes) {
+    const spells = [];
+    for (let i = 0; i < classes.length; i++) {
+        const charClass = classes[i];
+        spells.push(...ClassAccessors.getSpells(charClass));
+    }
+    return spells;
+}
+/**
+ *
+ * @param classSpells
+ */
+export function generateActiveClassSpells(classSpells) {
+    return classSpells.filter(isActive);
+}
+/**
+ *
+ * @param attackClassSpellLists
+ * @param characterSpells
+ */
+export function generateActiveSpellAttackList(attackClassSpellLists, characterSpells) {
+    return [
+        ...flatten(attackClassSpellLists.map((ClassSpellInfo) => ClassSpellInfo.activeSpells)),
+        ...characterSpells,
+    ].filter((spell) => !asPartOfWeaponAttack(spell) &&
+        ((isAttack(spell) && (isDisplayAsAttack(spell) || isDisplayAsAttack(spell) === null)) ||
+            isDisplayAsAttack(spell)));
+}
+/**
+ *
+ * @param classSpells
+ * @param characterSpells
+ * @param xpInfo
+ */
+export function generateWeaponSpellDamageGroups(classSpells, characterSpells, xpInfo) {
+    const damageSources = [];
+    classSpells.forEach((spell) => {
+        if (!asPartOfWeaponAttack(spell)) {
+            return;
+        }
+        const damageDice = getScaledDamage(spell);
+        if (damageDice.length) {
+            damageSources.push({
+                spell,
+                damageDice,
+                attackTypeRange: getAttackType(spell),
+            });
+        }
+    });
+    characterSpells.forEach((spell) => {
+        if (!asPartOfWeaponAttack(spell)) {
+            return;
+        }
+        const damageDice = getScaledDamage(spell);
+        if (damageDice.length) {
+            damageSources.push({
+                spell,
+                damageDice,
+                attackTypeRange: getAttackType(spell),
+            });
+        }
+    });
+    return damageSources;
+}
+/**
+ *
+ * @param activeCharacterSpells
+ * @param classSpells
+ */
+export function generateRitualSpells(activeCharacterSpells, classSpells) {
+    const ritualCharacterSpells = activeCharacterSpells.filter((spell) => {
+        const dataOrigin = getDataOrigin(spell);
+        const dataOriginType = getDataOriginType(spell);
+        if (dataOriginType === DataOriginTypeEnum.FEAT &&
+            DB_STRING_RITUAL_CASTER_LIST.includes(FeatAccessors.getName(dataOrigin.primary)) &&
+            deriveIsRitual(spell)) {
+            return true;
+        }
+        return false;
+    });
+    const ritualClassSpells = classSpells.filter((spell) => {
+        if (deriveIsRitual(spell) && deriveIsCastedByRitualSpellcaster(spell)) {
+            if (deriveIsCastedBySpellbookSpellcaster(spell)) {
+                return true;
+            }
+            return deriveIsActive(spell);
+        }
+        return false;
+    });
+    return [...ritualCharacterSpells, ...ritualClassSpells];
+}
+/**
+ *
+ * @param spell
+ * @param castLevel
+ * @param spellCasterInfo
+ * @param ruleData
+ * @param abilityLookup
+ * @param proficiencyBonus
+ */
+function generateScaledSpell(spell, castLevel, spellCasterInfo, ruleData, abilityLookup, proficiencyBonus) {
+    const startingCastLevel = deriveStartingCastLevel(spell);
+    const scaledAmount = Math.max(0, castLevel - startingCastLevel);
+    const limitedUse = getLimitedUse(spell);
+    let maxUses = null;
+    if (limitedUse != null) {
+        maxUses = LimitedUseDerivers.deriveMaxUses(limitedUse, abilityLookup, ruleData, proficiencyBonus);
+    }
+    const isLimitedUseAvailableAtScaledAmount = validateIsLimitedUseAvailableAtScaledAmount(spell, castLevel, scaledAmount, abilityLookup, ruleData, spellCasterInfo, proficiencyBonus);
+    return Object.assign(Object.assign({}, spell), { range: getScaledRange(spell, castLevel), consumedUses: getConsumedLimitedUse(spell, scaledAmount), isAtWill: validateIsAtWill(spell, castLevel), isLimitedUseAvailableAtScaledAmount,
+        castLevel,
+        maxUses,
+        scaledAmount });
+}
+/**
+ *
+ * @param xpInfo
+ * @param classSpells
+ * @param characterSpells
+ * @param proficiencyBonus
+ * @param spellCasterInfo
+ * @param ruleData
+ * @param preferences
+ * @param abilityLookup
+ */
+export function generateLevelSpells(xpInfo, classSpells, characterSpells, proficiencyBonus, spellCasterInfo, ruleData, preferences, abilityLookup) {
+    const maxSpellLevel = RuleDataAccessors.getMaxSpellLevel(ruleData);
+    const levels = [];
+    // Setup array to exist for all possible spell levels cantrip => maxSpellLevel
+    for (let i = 0; i <= maxSpellLevel; i++) {
+        levels.push([]);
+    }
+    classSpells.forEach((spell) => {
+        const startLevel = getLevel(spell);
+        for (let i = startLevel; i <= maxSpellLevel; i++) {
+            if (validateShouldShowClassSpellAtLevel(spell, i, spellCasterInfo, preferences)) {
+                levels[i].push(generateScaledSpell(spell, i, spellCasterInfo, ruleData, abilityLookup, proficiencyBonus));
+            }
+        }
+    });
+    characterSpells.forEach((spell) => {
+        const { startLevel, endLevel } = getCastLevelRange(spell, spellCasterInfo, ruleData);
+        for (let i = startLevel; i <= endLevel; i++) {
+            if (validateShouldShowCharacterSpellAtLevel(spell, i, spellCasterInfo, preferences)) {
+                levels[i].push(generateScaledSpell(spell, i, spellCasterInfo, ruleData, abilityLookup, proficiencyBonus));
+            }
+        }
+    });
+    const sortOrderLookup = {
+        [DataOriginTypeEnum.RACE]: 1,
+        [DataOriginTypeEnum.CLASS]: 2,
+        [DataOriginTypeEnum.FEAT]: 3,
+        [DataOriginTypeEnum.BACKGROUND]: 4,
+        [DataOriginTypeEnum.ITEM]: 5,
+    };
+    const sortedLevels = [];
+    for (let i = 0; i <= maxSpellLevel; i++) {
+        sortedLevels.push(orderBy(levels[i], [
+            (spell) => getName(spell),
+            (spell) => {
+                const type = getDataOriginType(spell);
+                let orderNum = 100;
+                if (type !== null) {
+                    const lookupOrderNum = sortOrderLookup[type];
+                    if (lookupOrderNum) {
+                        orderNum = lookupOrderNum;
+                    }
+                }
+                return orderNum;
+            },
+        ]));
+    }
+    return sortedLevels;
+}
+/**
+ *
+ * @param spell
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ * @param spellListDataOriginLookup
+ */
+export function generateDataOriginSpell(spell, dataOriginType, primary, parent, spellListDataOriginLookup) {
+    return Object.assign(Object.assign({}, spell), { dataOrigin: DataOriginGenerators.generateDataOrigin(dataOriginType, primary, parent), expandedDataOriginRef: deriveExpandedDataOriginRef(spell, spellListDataOriginLookup) });
+}
+/**
+ *
+ * @param id
+ * @param entityTypeId
+ * @param spellLookup
+ * @param dataOriginType
+ * @param primary
+ * @param parent
+ * @param ruleData
+ * @param spellListDataOriginLookup
+ * @param valueLookup
+ */
+export function generateBaseSpells(id, entityTypeId, spellLookup, dataOriginType, primary, parent, ruleData, spellListDataOriginLookup, valueLookup) {
+    const spells = HelperUtils.lookupDataOrFallback(spellLookup, DataOriginGenerators.generateDataOriginKey(id, entityTypeId));
+    if (!spells) {
+        return [];
+    }
+    return spells.map((spell) => {
+        const dataOriginSpell = generateDataOriginSpell(spell, dataOriginType, primary, parent, spellListDataOriginLookup);
+        return generateBaseSpell(dataOriginSpell, valueLookup, ruleData);
+    });
+}
+/**
+ *
+ * @param spells
+ * @param inventoryInfusionLookup
+ * @param characterId
+ */
+export function generateActiveCharacterSpells(spells, inventoryInfusionLookup, characterId) {
+    return spells.filter((spell) => {
+        const dataOrigin = getDataOrigin(spell);
+        const dataOriginType = getDataOriginType(spell);
+        if (dataOriginType === DataOriginTypeEnum.ITEM) {
+            const item = dataOrigin.primary;
+            const mappingId = ItemAccessors.getMappingId(item);
+            const infusion = HelperUtils.lookupDataOrFallback(inventoryInfusionLookup, mappingId);
+            if (ItemDerivers.deriveCanAttune(item, infusion)) {
+                return ItemValidators.isEquippedToCurrentCharacter(item, characterId) && ItemAccessors.isAttuned(item);
+            }
+            return ItemValidators.isEquippedToCurrentCharacter(item, characterId);
+        }
+        return true;
+    });
+}
+/**
+ *
+ * @param race
+ * @param classes
+ * @param background
+ * @param optionalOrigins
+ * @param optionalClassFeatures
+ * @param definitionPool
+ */
+export function generateSpellListDataOriginLookup(race, classes, background, optionalOrigins, optionalClassFeatures, definitionPool) {
+    let lookup = {};
+    if (race !== null) {
+        RaceAccessors.getDefinitionRacialTraits(race).forEach((feature) => {
+            const uniqueKey = RacialTraitAccessors.getUniqueKey(feature);
+            RacialTraitAccessors.getSpellListIds(feature).forEach((spellListId) => {
+                lookup[spellListId] = DataOriginGenerators.generateDataOriginRef(DataOriginTypeEnum.RACE, uniqueKey);
+            });
+        });
+    }
+    if (background !== null) {
+        const uniqueKey = BackgroundDerivers.deriveUniqueKey(background);
+        BackgroundAccessors.getSpellListIds(background).forEach((spellListId) => {
+            lookup[spellListId] = DataOriginGenerators.generateDataOriginRef(DataOriginTypeEnum.BACKGROUND, uniqueKey);
+        });
+    }
+    classes.forEach((charClass) => {
+        ClassAccessors.getDefinitionClassFeatures(charClass).forEach((feature) => {
+            const uniqueKey = ClassFeatureAccessors.getUniqueKey(feature);
+            ClassFeatureAccessors.getSpellListIds(feature).forEach((spellListId) => {
+                lookup[spellListId] = DataOriginGenerators.generateDataOriginRef(DataOriginTypeEnum.CLASS_FEATURE, uniqueKey);
+            });
+        });
+    });
+    optionalOrigins.forEach((optionalOrigin) => {
+        const definitionKey = OptionalOriginAccessors.getDefinitionKey(optionalOrigin);
+        if (!definitionKey) {
+            return;
+        }
+        const racialTrait = RacialTraitSimulators.simulateRacialTrait(definitionKey, definitionPool);
+        if (!racialTrait) {
+            return;
+        }
+        const uniqueKey = RacialTraitAccessors.getUniqueKey(racialTrait);
+        RacialTraitAccessors.getSpellListIds(racialTrait).forEach((spellListId) => {
+            lookup[spellListId] = DataOriginGenerators.generateDataOriginRef(DataOriginTypeEnum.RACE, uniqueKey);
+        });
+    });
+    optionalClassFeatures.forEach((optionalClassFeature) => {
+        const definitionKey = OptionalClassFeatureAccessors.getDefinitionKey(optionalClassFeature);
+        if (!definitionKey) {
+            return;
+        }
+        const feature = ClassFeatureSimulators.simulateClassFeature(definitionKey, definitionPool, classes);
+        if (!feature) {
+            return;
+        }
+        const uniqueKey = ClassFeatureAccessors.getUniqueKey(feature);
+        ClassFeatureAccessors.getSpellListIds(feature).forEach((spellListId) => {
+            lookup[spellListId] = DataOriginGenerators.generateDataOriginRef(DataOriginTypeEnum.CLASS_FEATURE, uniqueKey);
+        });
+    });
+    return lookup;
+}
+/**
+ *
+ * @param raceSpellListIds
+ * @param backgroundSpellListIds
+ */
+export function generateGlobalSpellListIds(raceSpellListIds, backgroundSpellListIds) {
+    return [...raceSpellListIds, ...backgroundSpellListIds];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Spell/hacks.js b/ddb_main/packages/rules-engine/es/engine/Spell/hacks.js
new file mode 100644
index 0000000..d5de057
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Spell/hacks.js
@@ -0,0 +1,25 @@
+import { HelperUtils } from '../Helper';
+import { ModifierValidators } from '../Modifier';
+import { getSpellGroupInfoLookup } from './accessors';
+import { SpellGroupEnum } from './constants';
+/**
+ * We needed to display very contextual verbiage for
+ * spells that did damage and the healed based on that
+ * damage on SpellDetail.tsx via SpellCaster.tsx on
+ * the healing node.
+ * - Ask Julie or Brian Life Domain Cleric
+ * @param modifiers
+ * @param spell
+ * @param scaledHealingDie
+ */
+export function hack__isHealingDieAdditionalBonusFixedValue(modifiers, spell, scaledHealingDie) {
+    if (!scaledHealingDie) {
+        return false;
+    }
+    const damageModifiers = modifiers.filter((modifier) => ModifierValidators.isSpellDamageModifier(modifier));
+    return (damageModifiers.length > 0 &&
+        HelperUtils.lookupDataOrFallback(getSpellGroupInfoLookup(spell), SpellGroupEnum.HEALING, false) &&
+        !scaledHealingDie.diceValue &&
+        !scaledHealingDie.diceCount &&
+        scaledHealingDie.fixedValue !== null);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Spell/index.js b/ddb_main/packages/rules-engine/es/engine/Spell/index.js
new file mode 100644
index 0000000..d835850
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Spell/index.js
@@ -0,0 +1,14 @@
+import * as SpellAccessors from './accessors';
+import * as SpellConstants from './constants';
+import * as SpellDerivers from './derivers';
+import * as SpellGenerators from './generators';
+import * as SpellHacks from './hacks';
+import * as SpellNotes from './notes';
+import * as SpellSimulators from './simulators';
+import * as SpellTypings from './typings';
+import * as SpellUtils from './utils';
+import * as SpellValidators from './validators';
+export * from './constants';
+export * from './typings';
+export { SpellAccessors, SpellDerivers, SpellGenerators, SpellNotes, SpellSimulators, SpellUtils, SpellValidators, SpellHacks, };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, SpellAccessors), SpellConstants), SpellDerivers), SpellGenerators), SpellNotes), SpellSimulators), SpellTypings), SpellUtils), SpellValidators), SpellHacks);
diff --git a/ddb_main/packages/rules-engine/es/engine/Spell/notes.js b/ddb_main/packages/rules-engine/es/engine/Spell/notes.js
new file mode 100644
index 0000000..3e05d70
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Spell/notes.js
@@ -0,0 +1,160 @@
+import { TypeScriptUtils } from '../../utils';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { DurationAccessors, DurationRenderers } from '../Duration';
+import { FormatUtils } from '../Format';
+import { LimitedUseAccessors, LimitedUseDerivers, LimitedUseRenderers } from '../LimitedUse';
+import { NoteGenerators } from '../Note';
+import { DisplayIntentionEnum } from '../Note';
+import { RuleDataUtils } from '../RuleData';
+import { getAtHigherLevels, getComponents, getConcentration, getDuration, getLimitedUse, getNotes, getRange, getDataOriginType, isCantrip, getScaleType, } from './accessors';
+import { SpellDurationTypeEnum } from './constants';
+import { getConsumedLimitedUse, getSpellScaledAtHigher, isSpellScaledByCastLevel } from './derivers';
+/**
+ *
+ * @param spell
+ * @param castLevel
+ * @param characterLevel
+ */
+export function getScaledNoteComponent(spell, castLevel, characterLevel) {
+    const atHigherLevels = getAtHigherLevels(spell);
+    if (!atHigherLevels) {
+        return null;
+    }
+    const scaleType = getScaleType(spell);
+    const additionalAttacks = atHigherLevels.additionalAttacks === null ? [] : atHigherLevels.additionalAttacks;
+    const additionalTargets = atHigherLevels.additionalTargets === null ? [] : atHigherLevels.additionalTargets;
+    const areaOfEffect = atHigherLevels.areaOfEffect === null ? [] : atHigherLevels.areaOfEffect;
+    const duration = atHigherLevels.duration === null ? [] : atHigherLevels.duration;
+    const creatures = atHigherLevels.creatures === null ? [] : atHigherLevels.creatures;
+    const special = atHigherLevels.special === null ? [] : atHigherLevels.special;
+    if (!additionalAttacks.length &&
+        !additionalTargets.length &&
+        !areaOfEffect.length &&
+        !duration.length &&
+        !creatures.length &&
+        !special.length) {
+        return null;
+    }
+    let isScaled = false;
+    isScaled = isScaled || isSpellScaledByCastLevel(spell, getScaleType(spell), additionalAttacks, castLevel);
+    isScaled = isScaled || isSpellScaledByCastLevel(spell, getScaleType(spell), additionalTargets, castLevel);
+    isScaled = isScaled || isSpellScaledByCastLevel(spell, getScaleType(spell), areaOfEffect, castLevel);
+    isScaled = isScaled || isSpellScaledByCastLevel(spell, getScaleType(spell), duration, castLevel);
+    isScaled = isScaled || isSpellScaledByCastLevel(spell, getScaleType(spell), creatures, castLevel);
+    isScaled = isScaled || isSpellScaledByCastLevel(spell, getScaleType(spell), special, castLevel);
+    let higherDisplay;
+    const additionalAttackInfo = getSpellScaledAtHigher(spell, scaleType, additionalAttacks, characterLevel, castLevel);
+    if (additionalAttackInfo) {
+        const totalCount = additionalAttackInfo.totalCount;
+        const additionalAttackCount = isCantrip(spell) ? totalCount + 1 : totalCount;
+        const additionalAttackLabel = isCantrip(spell) ? '' : '+';
+        higherDisplay = `Count: ${additionalAttackLabel}${additionalAttackCount}`;
+    }
+    const additionalTargetInfo = getSpellScaledAtHigher(spell, scaleType, additionalTargets, characterLevel, castLevel);
+    if (!higherDisplay && additionalTargetInfo) {
+        higherDisplay = `Targets: +${additionalTargetInfo.targets}`;
+    }
+    const aoeInfo = getSpellScaledAtHigher(spell, scaleType, areaOfEffect, characterLevel, castLevel);
+    if (!higherDisplay && aoeInfo) {
+        const extArea = aoeInfo.extendedAoe;
+        if (extArea) {
+            higherDisplay = `Ext. Area: ${FormatUtils.renderDistance(extArea)}`;
+        }
+    }
+    const durationInfo = getSpellScaledAtHigher(spell, scaleType, duration, characterLevel, castLevel);
+    if (!higherDisplay && durationInfo) {
+        higherDisplay = `Ext. D: ${durationInfo.description}`;
+    }
+    const creatureInfo = getSpellScaledAtHigher(spell, scaleType, creatures, characterLevel, castLevel);
+    if (!higherDisplay && creatureInfo) {
+        higherDisplay = `Creatures: ${creatureInfo.description}`;
+    }
+    const specialInfo = getSpellScaledAtHigher(spell, scaleType, special, characterLevel, castLevel);
+    if (!higherDisplay && specialInfo) {
+        higherDisplay = `Special: ${specialInfo.description}`;
+    }
+    if (!higherDisplay) {
+        return null;
+    }
+    const displayIntention = isScaled ? DisplayIntentionEnum.SCALED : null;
+    return NoteGenerators.createPlainText(higherDisplay, displayIntention);
+}
+/**
+ *
+ * @param spell
+ */
+function getUserNoteComponent(spell) {
+    const notes = getNotes(spell);
+    if (notes) {
+        return NoteGenerators.createPlainText(notes);
+    }
+    return null;
+}
+/**
+ *
+ * @param spell
+ * @param castLevel
+ * @param characterLevel
+ * @param abilityLookup
+ * @param ruleData
+ * @param scaledAmount
+ * @param proficiencyBonus
+ */
+export function getNoteComponents(spell, castLevel, characterLevel, abilityLookup, ruleData, scaledAmount = 0, proficiencyBonus) {
+    const notes = [];
+    const range = getRange(spell);
+    const components = getComponents(spell);
+    const duration = getDuration(spell);
+    const limitedUse = getLimitedUse(spell);
+    if (limitedUse) {
+        const consumedAmount = getConsumedLimitedUse(spell, scaledAmount);
+        const maxUses = LimitedUseDerivers.deriveMaxUses(limitedUse, abilityLookup, ruleData, proficiencyBonus);
+        const numberUsed = LimitedUseAccessors.getNumberUsed(limitedUse);
+        const numberRemaining = maxUses - numberUsed;
+        if (getDataOriginType(spell) === DataOriginTypeEnum.ITEM) {
+            if (consumedAmount !== null) {
+                if (maxUses === 1) {
+                    const isUsed = numberUsed === 1;
+                    notes.push(NoteGenerators.createPlainText(`1 Charge${isUsed ? ' (Used)' : ''}`));
+                }
+                else {
+                    notes.push(NoteGenerators.createPlainText(`${consumedAmount} Charge${consumedAmount !== 1 ? 's' : ''} (${numberRemaining}/${maxUses})`));
+                }
+            }
+        }
+        else if (maxUses === 1) {
+            const resetType = LimitedUseAccessors.getResetType(limitedUse);
+            const resetTypeAbbr = LimitedUseRenderers.renderLimitedUseResetAbbreviation(resetType);
+            const isUsed = numberUsed === 1;
+            const limitedUseResetTypeName = resetType === null ? '' : RuleDataUtils.getLimitedUseResetTypeName(resetType, ruleData);
+            notes.push(NoteGenerators.createTooltip(`1/${resetTypeAbbr}${isUsed ? ' (Used)' : ''}`, `Once per ${limitedUseResetTypeName}${isUsed ? ' (Used)' : ''}`, {
+                dynamicTitle: true,
+            }));
+        }
+        else {
+            notes.push(NoteGenerators.createPlainText(`${consumedAmount} Use${consumedAmount !== 1 ? 's' : ''} (${numberRemaining}/${maxUses})`));
+        }
+    }
+    const scaledNotesNode = getScaledNoteComponent(spell, castLevel, characterLevel);
+    if (scaledNotesNode) {
+        notes.push(scaledNotesNode);
+    }
+    if (duration && DurationAccessors.getType(duration) !== SpellDurationTypeEnum.INSTANTANEOUS) {
+        notes.push(NoteGenerators.createTooltip(`D: ${DurationRenderers.renderDurationAbbreviation(duration)}`, `${DurationRenderers.renderDuration(duration, getConcentration(spell))} Duration`));
+    }
+    if (range && range.aoeValue !== null && range.aoeType !== null) {
+        notes.push(NoteGenerators.createGroup([NoteGenerators.createDistance(range.aoeValue), NoteGenerators.createAoeIcon(range.aoeType)], ''));
+    }
+    if (components) {
+        const componentNoteParts = [];
+        components.forEach((componentId, idx) => {
+            const componentInfo = RuleDataUtils.getSpellComponentInfo(componentId, ruleData);
+            if (componentInfo && componentInfo.shortName !== null) {
+                componentNoteParts.push(NoteGenerators.createTooltip(componentInfo.shortName, componentInfo.name));
+            }
+        });
+        notes.push(NoteGenerators.createGroup(componentNoteParts, '/'));
+    }
+    notes.push(getUserNoteComponent(spell));
+    return notes.filter(TypeScriptUtils.isNotNullOrUndefined);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Spell/simulators.js b/ddb_main/packages/rules-engine/es/engine/Spell/simulators.js
new file mode 100644
index 0000000..13d7c2c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Spell/simulators.js
@@ -0,0 +1,16 @@
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { deriveCharacterLevel, deriveIsCastAsRitual, deriveName } from './derivers';
+import { generateBaseSpell, generateDataOriginSpell } from './generators';
+/**
+ *
+ * @param spell
+ * @param overallInfo
+ * @param ruleData
+ * @param primary
+ * @param parent
+ */
+export function simulateSpell(spell, overallInfo, ruleData, primary, parent) {
+    const dataOriginSpell = generateDataOriginSpell(spell, DataOriginTypeEnum.SIMULATED, primary, parent, overallInfo.spellListDataOriginLookup);
+    const baseSpell = generateBaseSpell(dataOriginSpell, {}, ruleData);
+    return Object.assign(Object.assign({}, baseSpell), { attackSaveValue: null, bonusFixedDamage: 0, canPrepare: false, canRemove: false, characterLevel: deriveCharacterLevel(baseSpell, overallInfo.characterLevel), isCustomized: false, isCastAsRitual: deriveIsCastAsRitual(baseSpell), name: deriveName(baseSpell, {}), notes: '', spellcastingModifier: 0, toHit: null, canAdd: true, entity: spell, spellGroupInfoLookup: {} });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Spell/utils.js b/ddb_main/packages/rules-engine/es/engine/Spell/utils.js
new file mode 100644
index 0000000..32407e9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Spell/utils.js
@@ -0,0 +1,86 @@
+import { DiceAccessors } from '../Dice';
+import { HelperUtils } from '../Helper';
+import { ModifierAccessors, ModifierValidators } from '../Modifier';
+import { RuleDataUtils } from '../RuleData';
+import { SpellGroupEnum } from '../Spell';
+import { getAtHigherLevels, getBonusFixedDamage, getLevel, getRange, getSaveDcAbility, getScaleType, getSpellcastingModifier, getSpellGroupInfoLookup, } from './accessors';
+import { getSpellScaledAtHigher } from './derivers';
+/**
+ * @deprecated
+ */
+export function getSaveDcAbilityKey(spell, ruleData) {
+    return RuleDataUtils.getAbilityKey(getSaveDcAbility(spell), ruleData);
+}
+export function getSaveDcAbilityShortName(spell, ruleData) {
+    return RuleDataUtils.getAbilityShortName(getSaveDcAbility(spell), ruleData);
+}
+/**
+ * @param spell
+ * @param modifier
+ * @param atHigherLevelInfo
+ * @param castLevel
+ */
+export function getSpellFinalScaledDie(spell, modifier, atHigherLevelInfo, castLevel = null) {
+    let scaledDie = atHigherLevelInfo === null ? ModifierAccessors.getDie(modifier) : atHigherLevelInfo.die;
+    if (scaledDie === null) {
+        return null;
+    }
+    const fixedDiceValue = DiceAccessors.getFixedValue(scaledDie);
+    let fixedValue = (fixedDiceValue === null ? 0 : fixedDiceValue) + getBonusFixedDamage(spell);
+    if (ModifierAccessors.getUsePrimaryStat(modifier)) {
+        fixedValue += getSpellcastingModifier(spell);
+    }
+    const isHealingHitModifier = ModifierValidators.isSpellHealingHitPointsModifier(modifier);
+    const spellGroupInfoLookup = getSpellGroupInfoLookup(spell);
+    const healingGroupInfo = HelperUtils.lookupDataOrFallback(spellGroupInfoLookup, SpellGroupEnum.HEALING);
+    if (isHealingHitModifier && healingGroupInfo) {
+        fixedValue += healingGroupInfo.bonusFixedValue;
+        if (healingGroupInfo.useCastLevel && castLevel) {
+            fixedValue += castLevel - getLevel(spell);
+        }
+    }
+    return Object.assign(Object.assign({}, scaledDie), { fixedValue });
+}
+export function getScaledRange(spell, castLevel) {
+    var _a, _b, _c;
+    const spellRange = getRange(spell);
+    if (spellRange === null) {
+        return null;
+    }
+    const higherLevel = getSpellScaledAtHigher(spell, getScaleType(spell), (_b = (_a = getAtHigherLevels(spell)) === null || _a === void 0 ? void 0 : _a.range) !== null && _b !== void 0 ? _b : [], null, castLevel);
+    return Object.assign(Object.assign({}, spellRange), { rangeValue: (_c = higherLevel === null || higherLevel === void 0 ? void 0 : higherLevel.range) !== null && _c !== void 0 ? _c : spellRange.rangeValue });
+}
+/**
+ *
+ * @param spell
+ */
+export function makeKnownKey(mappingId, mappingEntityTypeId) {
+    return `${mappingId}-${mappingEntityTypeId}`;
+}
+/**
+ *
+ * @param spell
+ */
+export function makeLeveledKnownKey(mappingId, mappingEntityTypeId, castLevel) {
+    return `${makeKnownKey(mappingId, mappingEntityTypeId)}-${castLevel}`;
+}
+/**
+ * Given a ClassSpellInfo object and a SpellID, determine if the spell is known by the character
+ * using RPGSpell ID as key
+ * @param spellList
+ * @param spellId
+ * @returns
+ */
+export const isSpellKnown = (spellList, spellId) => spellList.spells.some(
+// Compare the given SpellID with the Spell Definition ID
+// SpellID is the ID of the record from RPGSpell (SQL Server: Waterdeep)
+(spell) => {
+    var _a;
+    return ((_a = spell.definition) === null || _a === void 0 ? void 0 : _a.id) === spellId &&
+        spellList.knownSpellIds.some(
+        // Compare the resulting Spell's ID with the KnownSpellID
+        // KnownSpellID is a combination of the ClassMappingID of the record from CharacterSpellMapping (MySQL: YawningPortal)
+        // and the EntityTypeID of its granting feature (i.e.- a Wizard's class spells will be granted as RPGClassSpellMapping) in 
+        // the format of "{ClassMappingID}-{EntityTypeID}"
+        (knownSpellId) => spell.id === Number(knownSpellId.split('-')[0]));
+});
diff --git a/ddb_main/packages/rules-engine/es/engine/Spell/validators.js b/ddb_main/packages/rules-engine/es/engine/Spell/validators.js
new file mode 100644
index 0000000..be0278d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Spell/validators.js
@@ -0,0 +1,184 @@
+import { ClassAccessors } from '../Class';
+import { DataOriginTypeEnum } from '../DataOrigin';
+import { FeatUtils } from '../Feat';
+import { LimitedUseAccessors, LimitedUseDerivers } from '../LimitedUse';
+import { getBaseLevelAtWill, getCanCastAtHigherLevel, getCastAtLevel, getDataOrigin, getDataOriginType, getLevel, getLimitedUse, getUsesSpellSlot, isActive, isCantrip, isRitual, } from './accessors';
+import { deriveIsActive, deriveIsCastedByRitualSpellcaster, deriveIsCastedBySpellbookSpellcaster, deriveIsPrepared, deriveIsRitual, deriveMustCastAsRitual, getCastLevelAvailableCount, getConsumedLimitedUse, isSpellAvailableAtLevel, } from './derivers';
+/**
+ *
+ * @param spell
+ * @param level
+ * @param spellCasterInfo
+ */
+export function validateHasShownSpellSlotsBeforeLevel(spell, level, spellCasterInfo) {
+    if ((spellCasterInfo.firstAvailableSpellSlotLevel !== null &&
+        spellCasterInfo.lastAvailableSpellSlotLevel !== null &&
+        spellCasterInfo.firstAvailableSpellSlotLevel < level &&
+        spellCasterInfo.lastAvailableSpellSlotLevel >= getLevel(spell)) ||
+        (spellCasterInfo.firstAvailablePactMagicSlotLevel !== null &&
+            spellCasterInfo.lastAvailablePactMagicSlotLevel !== null &&
+            spellCasterInfo.firstAvailablePactMagicSlotLevel < level &&
+            spellCasterInfo.lastAvailablePactMagicSlotLevel >= getLevel(spell))) {
+        return true;
+    }
+    return false;
+}
+/**
+ *
+ * @param spell
+ * @param level
+ * @param spellCasterInfo
+ * @param preferences
+ */
+export function validateShouldShowClassSpellAtLevel(spell, level, spellCasterInfo, preferences) {
+    if (!deriveIsActive(spell)) {
+        if (deriveIsRitual(spell) &&
+            getLevel(spell) === level &&
+            deriveIsCastedByRitualSpellcaster(spell) &&
+            deriveIsCastedBySpellbookSpellcaster(spell)) {
+            return true;
+        }
+        else {
+            return false;
+        }
+    }
+    if (isCantrip(spell)) {
+        return getLevel(spell) === level;
+    }
+    // show spells that have to show at a specific level
+    if (getCastAtLevel(spell) === level) {
+        return true;
+    }
+    if (isSpellAvailableAtLevel(spell, level, spellCasterInfo)) {
+        if (getLevel(spell) === level) {
+            // Check for normal spellcasting rules if a spell is just supposed to show at current level
+            return true;
+        }
+        else {
+            // show scalable spells
+            if (preferences.showScaledSpells && getCanCastAtHigherLevel(spell)) {
+                return true;
+            }
+            // Force scale spells that don't normally scale, but this is first time slots are available (warlocks)
+            if (!validateHasShownSpellSlotsBeforeLevel(spell, level, spellCasterInfo)) {
+                return true;
+            }
+        }
+    }
+    return false;
+}
+/**
+ *
+ * @param spell
+ * @param level
+ * @param spellCasterInfo
+ * @param preferences
+ */
+export function validateShouldShowCharacterSpellAtLevel(spell, level, spellCasterInfo, preferences) {
+    if (isCantrip(spell)) {
+        return getLevel(spell) === level;
+    }
+    if (getUsesSpellSlot(spell)) {
+        if (isSpellAvailableAtLevel(spell, level, spellCasterInfo)) {
+            if (preferences.showScaledSpells) {
+                return true;
+            }
+            else {
+                return getLevel(spell) === level;
+            }
+        }
+        else {
+            return false;
+        }
+    }
+    if (getBaseLevelAtWill(spell)) {
+        return deriveIsPrepared(spell);
+    }
+    if (preferences.showScaledSpells) {
+        return true;
+    }
+    else {
+        if (getCastAtLevel(spell) === level) {
+            return true;
+        }
+        return getLevel(spell) === level;
+    }
+}
+/**
+ *
+ * @param spell
+ * @param castLevel
+ */
+export function validateIsAtWill(spell, castLevel) {
+    const limitedUse = getLimitedUse(spell);
+    const usesSpellSlot = getUsesSpellSlot(spell);
+    const baseLevelAtWill = getBaseLevelAtWill(spell);
+    if (isCantrip(spell)) {
+        return limitedUse === null;
+    }
+    if (baseLevelAtWill && castLevel === getLevel(spell)) {
+        return true;
+    }
+    if (!limitedUse && !usesSpellSlot) {
+        return true;
+    }
+    if (isRitual(spell) && deriveMustCastAsRitual(spell)) {
+        return true;
+    }
+    if (isRitual(spell) &&
+        !isActive(spell) &&
+        deriveIsCastedByRitualSpellcaster(spell) &&
+        deriveIsCastedBySpellbookSpellcaster(spell)) {
+        return true;
+    }
+    return false;
+}
+/**
+ *
+ * @param spell
+ * @param castLevel
+ * @param scaledAmount
+ * @param abilityLookup
+ * @param ruleData
+ * @param spellCasterInfo
+ * @param proficiencyBonus
+ */
+export function validateIsLimitedUseAvailableAtScaledAmount(spell, castLevel, scaledAmount, abilityLookup, ruleData, spellCasterInfo, proficiencyBonus) {
+    const limitedUse = getLimitedUse(spell);
+    if (limitedUse === null) {
+        return false;
+    }
+    const maxUses = LimitedUseDerivers.deriveMaxUses(limitedUse, abilityLookup, ruleData, proficiencyBonus);
+    const numberUsed = LimitedUseAccessors.getNumberUsed(limitedUse);
+    const usesSpellSlots = getUsesSpellSlot(spell);
+    const consumedAmount = getConsumedLimitedUse(spell, scaledAmount);
+    let isAvailable = numberUsed + consumedAmount <= maxUses;
+    let areSpellSlotsAvailable;
+    if (isAvailable && usesSpellSlots) {
+        const dataOrigin = getDataOrigin(spell);
+        const dataOriginType = getDataOriginType(spell);
+        if (dataOriginType === DataOriginTypeEnum.CLASS_FEATURE &&
+            ClassAccessors.isPactMagicActive(dataOrigin.parent)) {
+            areSpellSlotsAvailable = getCastLevelAvailableCount(castLevel, spellCasterInfo.pactMagicSlots);
+        }
+        else {
+            areSpellSlotsAvailable = getCastLevelAvailableCount(castLevel, spellCasterInfo.spellSlots);
+        }
+        if (areSpellSlotsAvailable !== null) {
+            isAvailable = areSpellSlotsAvailable > 0;
+        }
+    }
+    return isAvailable;
+}
+/**
+ *
+ * @param spell
+ */
+export function isValidToUsePactSlots(spell) {
+    const dataOrigin = getDataOrigin(spell);
+    const dataOriginType = getDataOriginType(spell);
+    return ((dataOriginType === DataOriginTypeEnum.CLASS_FEATURE &&
+        ClassAccessors.isPactMagicActive(dataOrigin.parent)) ||
+        (dataOriginType === DataOriginTypeEnum.FEAT &&
+            FeatUtils.isEldritchAdept(dataOrigin.parent)));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/StartingEquipment/constants.js b/ddb_main/packages/rules-engine/es/engine/StartingEquipment/constants.js
new file mode 100644
index 0000000..7bff9db
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/StartingEquipment/constants.js
@@ -0,0 +1,12 @@
+export var StartingEquipmentRuleTypeEnum;
+(function (StartingEquipmentRuleTypeEnum) {
+    StartingEquipmentRuleTypeEnum[StartingEquipmentRuleTypeEnum["WEAPON"] = 1] = "WEAPON";
+    StartingEquipmentRuleTypeEnum[StartingEquipmentRuleTypeEnum["ARMOR"] = 2] = "ARMOR";
+    StartingEquipmentRuleTypeEnum[StartingEquipmentRuleTypeEnum["GEAR"] = 3] = "GEAR";
+    StartingEquipmentRuleTypeEnum[StartingEquipmentRuleTypeEnum["WEAPON_TYPE"] = 4] = "WEAPON_TYPE";
+    StartingEquipmentRuleTypeEnum[StartingEquipmentRuleTypeEnum["GEAR_TYPE"] = 5] = "GEAR_TYPE";
+    StartingEquipmentRuleTypeEnum[StartingEquipmentRuleTypeEnum["ARMOR_TYPE"] = 6] = "ARMOR_TYPE";
+    StartingEquipmentRuleTypeEnum[StartingEquipmentRuleTypeEnum["CUSTOM"] = 7] = "CUSTOM";
+    StartingEquipmentRuleTypeEnum[StartingEquipmentRuleTypeEnum["GOLD_VALUE"] = 8] = "GOLD_VALUE";
+    StartingEquipmentRuleTypeEnum[StartingEquipmentRuleTypeEnum["INSTRUCTION"] = 9] = "INSTRUCTION";
+})(StartingEquipmentRuleTypeEnum || (StartingEquipmentRuleTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/StartingEquipment/derivers.js b/ddb_main/packages/rules-engine/es/engine/StartingEquipment/derivers.js
new file mode 100644
index 0000000..1c365c3
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/StartingEquipment/derivers.js
@@ -0,0 +1,17 @@
+import { StartingEquipmentRuleTypeEnum } from './constants';
+/**
+ *
+ * @param ruleType
+ */
+export function deriveIsEquipmentStartingEquipmentRuleType(ruleType) {
+    switch (ruleType) {
+        case StartingEquipmentRuleTypeEnum.ARMOR:
+        case StartingEquipmentRuleTypeEnum.ARMOR_TYPE:
+        case StartingEquipmentRuleTypeEnum.GEAR:
+        case StartingEquipmentRuleTypeEnum.GEAR_TYPE:
+        case StartingEquipmentRuleTypeEnum.WEAPON:
+        case StartingEquipmentRuleTypeEnum.WEAPON_TYPE:
+            return true;
+    }
+    return false;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/StartingEquipment/index.js b/ddb_main/packages/rules-engine/es/engine/StartingEquipment/index.js
new file mode 100644
index 0000000..3de213a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/StartingEquipment/index.js
@@ -0,0 +1,5 @@
+import * as StartingEquipmentConstants from './constants';
+import * as StartingEquipmentDerivers from './derivers';
+export * from './constants';
+export { StartingEquipmentDerivers };
+export default Object.assign(Object.assign({}, StartingEquipmentConstants), StartingEquipmentDerivers);
diff --git a/ddb_main/packages/rules-engine/es/engine/Value/accessors.js b/ddb_main/packages/rules-engine/es/engine/Value/accessors.js
new file mode 100644
index 0000000..a591ec5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Value/accessors.js
@@ -0,0 +1,84 @@
+import { HelperUtils } from '../Helper';
+import { generateEntityContextKey, generateEntityKey, generateUniqueKey } from './generators';
+/**
+ *
+ * @param charValue
+ */
+export function getUniqueKey(charValue) {
+    return generateUniqueKey(getTypeId(charValue), getValueId(charValue), getValueTypeId(charValue), getContextId(charValue), getContextTypeId(charValue));
+}
+/**
+ *
+ * @param charValue
+ */
+export function getEntityContextKey(charValue) {
+    return generateEntityContextKey(getValueId(charValue), getValueTypeId(charValue), getContextId(charValue), getContextTypeId(charValue));
+}
+/**
+ *
+ * @param charValue
+ */
+export function getEntityKey(charValue) {
+    return generateEntityKey(getValueId(charValue), getValueTypeId(charValue));
+}
+/**
+ *
+ * @param charValue
+ */
+export function getContextId(charValue) {
+    return charValue.contextId;
+}
+/**
+ *
+ * @param charValue
+ */
+export function getContextTypeId(charValue) {
+    return charValue.contextTypeId;
+}
+/**
+ *
+ * @param charValue
+ */
+export function getNotes(charValue) {
+    var _a;
+    return (_a = charValue === null || charValue === void 0 ? void 0 : charValue.notes) !== null && _a !== void 0 ? _a : null;
+}
+/**
+ *
+ * @param charValue
+ */
+export function getTypeId(charValue) {
+    return charValue.typeId;
+}
+/**
+ *
+ * @param charValue
+ */
+export function getValue(charValue) {
+    var _a;
+    return (_a = charValue === null || charValue === void 0 ? void 0 : charValue.value) !== null && _a !== void 0 ? _a : null;
+}
+/**
+ *
+ * @param charValue
+ */
+export function getValueId(charValue) {
+    return charValue.valueId;
+}
+/**
+ * temporary to handle transition for ids/entityTypeIds from numbers to strings
+ * @param charValue
+ */
+export function getValueIntId(charValue) {
+    if (charValue.valueId !== null) {
+        return HelperUtils.parseInputInt(charValue.valueId, -1);
+    }
+    return null;
+}
+/**
+ *
+ * @param charValue
+ */
+export function getValueTypeId(charValue) {
+    return charValue.valueTypeId;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Value/constants.js b/ddb_main/packages/rules-engine/es/engine/Value/constants.js
new file mode 100644
index 0000000..fa57325
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Value/constants.js
@@ -0,0 +1,62 @@
+export var AdjustmentTypeEnum;
+(function (AdjustmentTypeEnum) {
+    AdjustmentTypeEnum[AdjustmentTypeEnum["OVERRIDE_AC"] = 1] = "OVERRIDE_AC";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["MAGIC_BONUS_AC"] = 2] = "MAGIC_BONUS_AC";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["MISC_BONUS_AC"] = 3] = "MISC_BONUS_AC";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["OVERRIDE_BASE_ARMOR"] = 4] = "OVERRIDE_BASE_ARMOR";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["OVERRIDE_PASSIVE_PERCEPTION"] = 5] = "OVERRIDE_PASSIVE_PERCEPTION";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["OVERRIDE_PASSIVE_INVESTIGATION"] = 6] = "OVERRIDE_PASSIVE_INVESTIGATION";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["OVERRIDE_PASSIVE_INSIGHT"] = 7] = "OVERRIDE_PASSIVE_INSIGHT";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["NAME_OVERRIDE"] = 8] = "NAME_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["NOTES"] = 9] = "NOTES";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["FIXED_VALUE_BONUS"] = 10] = "FIXED_VALUE_BONUS";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["FIXED_VALUE_OVERRIDE"] = 11] = "FIXED_VALUE_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["TO_HIT_BONUS"] = 12] = "TO_HIT_BONUS";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["TO_HIT_OVERRIDE"] = 13] = "TO_HIT_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SAVE_DC_BONUS"] = 14] = "SAVE_DC_BONUS";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SAVE_DC_OVERRIDE"] = 15] = "SAVE_DC_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["DISPLAY_AS_ATTACK"] = 16] = "DISPLAY_AS_ATTACK";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["IS_PROFICIENT"] = 17] = "IS_PROFICIENT";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["IS_OFFHAND"] = 18] = "IS_OFFHAND";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["COST_OVERRIDE"] = 19] = "COST_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["IS_SILVER"] = 20] = "IS_SILVER";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["IS_ADAMANTINE"] = 21] = "IS_ADAMANTINE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["WEIGHT_OVERRIDE"] = 22] = "WEIGHT_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SKILL_OVERRIDE"] = 23] = "SKILL_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SKILL_MISC_BONUS"] = 24] = "SKILL_MISC_BONUS";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SKILL_MAGIC_BONUS"] = 25] = "SKILL_MAGIC_BONUS";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SKILL_PROFICIENCY_LEVEL"] = 26] = "SKILL_PROFICIENCY_LEVEL";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SKILL_STAT_OVERRIDE"] = 27] = "SKILL_STAT_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["IS_PACT_WEAPON"] = 28] = "IS_PACT_WEAPON";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["IS_HEXBLADE"] = 29] = "IS_HEXBLADE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["DICE_TYPE_OVERRIDE"] = 30] = "DICE_TYPE_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["DICE_COUNT_OVERRIDE"] = 31] = "DICE_COUNT_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["ARMOR_PROFICIENCY_LEVEL"] = 32] = "ARMOR_PROFICIENCY_LEVEL";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["WEAPON_PROFICIENCY_LEVEL"] = 33] = "WEAPON_PROFICIENCY_LEVEL";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["TOOL_PROFICIENCY_LEVEL"] = 34] = "TOOL_PROFICIENCY_LEVEL";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["LANGUAGE_PROFICIENCY_LEVEL"] = 35] = "LANGUAGE_PROFICIENCY_LEVEL";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SENSE_OVERRIDE"] = 36] = "SENSE_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["MOVEMENT_OVERRIDE"] = 37] = "MOVEMENT_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SAVING_THROW_OVERRIDE"] = 38] = "SAVING_THROW_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SAVING_THROW_MISC_BONUS"] = 39] = "SAVING_THROW_MISC_BONUS";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SAVING_THROW_MAGIC_BONUS"] = 40] = "SAVING_THROW_MAGIC_BONUS";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["SAVING_THROW_PROFICIENCY_LEVEL"] = 41] = "SAVING_THROW_PROFICIENCY_LEVEL";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["CREATURE_AC"] = 42] = "CREATURE_AC";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["CREATURE_HIT_POINTS"] = 43] = "CREATURE_HIT_POINTS";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["CREATURE_TYPE_OVERRIDE"] = 44] = "CREATURE_TYPE_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["CREATURE_ALIGNMENT"] = 45] = "CREATURE_ALIGNMENT";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["CREATURE_SIZE"] = 46] = "CREATURE_SIZE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["CREATURE_NOTES"] = 47] = "CREATURE_NOTES";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["IS_DEDICATED_WEAPON"] = 48] = "IS_DEDICATED_WEAPON";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["CAPACITY_OVERRIDE"] = 49] = "CAPACITY_OVERRIDE";
+    AdjustmentTypeEnum[AdjustmentTypeEnum["CAPACITY_WEIGHT_OVERRIDE"] = 50] = "CAPACITY_WEIGHT_OVERRIDE";
+})(AdjustmentTypeEnum || (AdjustmentTypeEnum = {}));
+export const ProficiencyAdjustmentTypeEnum = [
+    AdjustmentTypeEnum.IS_PROFICIENT,
+    AdjustmentTypeEnum.SKILL_PROFICIENCY_LEVEL,
+    AdjustmentTypeEnum.ARMOR_PROFICIENCY_LEVEL,
+    AdjustmentTypeEnum.WEAPON_PROFICIENCY_LEVEL,
+    AdjustmentTypeEnum.TOOL_PROFICIENCY_LEVEL,
+    AdjustmentTypeEnum.LANGUAGE_PROFICIENCY_LEVEL,
+    AdjustmentTypeEnum.SAVING_THROW_PROFICIENCY_LEVEL,
+];
diff --git a/ddb_main/packages/rules-engine/es/engine/Value/generators.js b/ddb_main/packages/rules-engine/es/engine/Value/generators.js
new file mode 100644
index 0000000..9126427
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Value/generators.js
@@ -0,0 +1,66 @@
+import { groupBy, keyBy } from 'lodash';
+import { getEntityContextKey, getTypeId, getUniqueKey } from './accessors';
+/**
+ *
+ * @param typeId
+ * @param valueId
+ * @param valueTypeId
+ * @param contextId
+ * @param contextTypeId
+ * @returns
+ */
+export function generateUniqueKey(typeId, valueId = null, valueTypeId = null, contextId = null, contextTypeId = null) {
+    return `${typeId}-${valueId}-${valueTypeId}-${contextId}-${contextTypeId}`;
+}
+/**
+ *
+ * @param valueId
+ * @param valueTypeId
+ * @param contextId
+ * @param contextTypeId
+ * @returns
+ */
+export function generateEntityContextKey(valueId = null, valueTypeId = null, contextId = null, contextTypeId = null) {
+    if (valueId === null) {
+        return 'null';
+    }
+    return `${valueId}-${valueTypeId}-${contextId}-${contextTypeId}`;
+}
+/**
+ *
+ * @param valueId
+ * @param valueTypeId
+ * @returns
+ */
+export function generateEntityKey(valueId = null, valueTypeId = null) {
+    if (valueId === null) {
+        return 'null';
+    }
+    return `${valueId}-${valueTypeId}`;
+}
+/**
+ *
+ * @param values
+ */
+export function generateCharacterValueLookup(values) {
+    return keyBy(values, (value) => getUniqueKey(value));
+}
+/**
+ *
+ * @param values
+ */
+export function generateCharacterEntityValueLookup(values) {
+    const groups = groupBy(values, (value) => getEntityContextKey(value));
+    const lookup = {};
+    Object.keys(groups).forEach((groupKey) => {
+        lookup[groupKey] = keyBy(groups[groupKey], 'typeId');
+    });
+    return lookup;
+}
+/**
+ *
+ * @param values
+ */
+export function generateCharacterTypeValueLookup(values) {
+    return groupBy(values, (value) => getTypeId(value));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Value/hacks.js b/ddb_main/packages/rules-engine/es/engine/Value/hacks.js
new file mode 100644
index 0000000..157f19e
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Value/hacks.js
@@ -0,0 +1,4 @@
+export function hack__toString(number) {
+    var _a;
+    return (_a = number === null || number === void 0 ? void 0 : number.toString()) !== null && _a !== void 0 ? _a : null;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Value/index.js b/ddb_main/packages/rules-engine/es/engine/Value/index.js
new file mode 100644
index 0000000..2d3ef6b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Value/index.js
@@ -0,0 +1,11 @@
+import * as ValueAccessors from './accessors';
+import * as ValueConstants from './constants';
+import * as ValueGenerators from './generators';
+import * as ValueHacks from './hacks';
+import * as ValueTypings from './typings';
+import * as ValueUtils from './utils';
+import * as ValueValidators from './validators';
+export * from './constants';
+export * from './typings';
+export { ValueAccessors, ValueGenerators, ValueHacks, ValueUtils, ValueValidators };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, ValueAccessors), ValueConstants), ValueGenerators), ValueHacks), ValueTypings), ValueUtils), ValueValidators);
diff --git a/ddb_main/packages/rules-engine/es/engine/Value/utils.js b/ddb_main/packages/rules-engine/es/engine/Value/utils.js
new file mode 100644
index 0000000..035dadd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Value/utils.js
@@ -0,0 +1,291 @@
+import { keyBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { getNotes, getValue, getValueId, getValueIntId } from './accessors';
+import { AdjustmentTypeEnum } from './constants';
+import { generateEntityContextKey, generateUniqueKey } from './generators';
+/**
+ *
+ * @param valueLookup
+ * @param typeId
+ * @param valueId
+ * @param valueTypeId
+ * @param contextId
+ * @param contextTypeId
+ * @returns
+ */
+export function getData(valueLookup, typeId, valueId = null, valueTypeId = null, contextId = null, contextTypeId = null) {
+    const key = generateUniqueKey(typeId, valueId, valueTypeId, contextId, contextTypeId);
+    if (valueLookup.hasOwnProperty(key)) {
+        return valueLookup[key];
+    }
+    return null;
+}
+/**
+ *
+ * @param valueLookup
+ * @param typeIds
+ * @param valueId
+ * @param valueTypeId
+ * @param contextId
+ * @param contextTypeId
+ * @returns
+ */
+export function getDataLookup(valueLookup, typeIds, valueId = null, valueTypeId = null, contextId = null, contextTypeId = null) {
+    const data = typeIds
+        .map((typeId) => getData(valueLookup, typeId, valueId, valueTypeId, contextId, contextTypeId))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    return keyBy(data, 'typeId');
+}
+/**
+ *
+ * @param entityValueLookup
+ * @param valueId
+ * @param valueTypeId
+ * @param contextId
+ * @param contextTypeId
+ * @returns
+ */
+export function getEntityData(entityValueLookup, valueId, valueTypeId, contextId = null, contextTypeId = null) {
+    const key = generateEntityContextKey(valueId, valueTypeId, contextId, contextTypeId);
+    if (entityValueLookup.hasOwnProperty(key)) {
+        return entityValueLookup[key];
+    }
+    return {};
+}
+/**
+ *
+ * @param typeValueLookup
+ * @param typeId
+ * @returns
+ */
+export function getTypeData(typeValueLookup, typeId) {
+    if (typeId === null) {
+        return [];
+    }
+    if (typeValueLookup.hasOwnProperty(typeId)) {
+        return typeValueLookup[typeId];
+    }
+    return [];
+}
+/**
+ *
+ * @param typeValueLookup
+ * @param typeId
+ * @returns
+ */
+export function getTypeValues(typeValueLookup, typeId) {
+    return getTypeData(typeValueLookup, typeId)
+        .map((charValue) => getValue(charValue))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param  typeValueLookup
+ * @param  typeId
+ * @returns
+ */
+export function getTypeValueIds(typeValueLookup, typeId) {
+    return getTypeData(typeValueLookup, typeId)
+        .map((charValue) => getValueId(charValue))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param  typeValueLookup
+ * @param  typeId
+ * @returns
+ */
+export function getTypeValueIntIds(typeValueLookup, typeId) {
+    return getTypeData(typeValueLookup, typeId)
+        .map((charValue) => getValueIntId(charValue))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param  valueLookup
+ * @param  typeId
+ * @param  valueId
+ * @param  valueTypeId
+ * @param  defaultValue
+ * @param  contextId
+ * @param  contextTypeId
+ * @returns
+ */
+export function getKeyValue(valueLookup, typeId, valueId = null, valueTypeId = null, defaultValue = null, contextId = null, contextTypeId = null) {
+    const charValue = getData(valueLookup, typeId, valueId, valueTypeId, contextId, contextTypeId);
+    if (charValue !== null) {
+        return getValue(charValue);
+    }
+    return defaultValue;
+}
+/**
+ *
+ * @param  valueLookup
+ * @param  typeId
+ * @param  valueId
+ * @param  valueTypeId
+ * @param  defaultValue
+ * @param  contextId
+ * @param  contextTypeId
+ * @returns
+ */
+export function getKeyNotes(valueLookup, typeId, valueId = null, valueTypeId = null, defaultValue = null, contextId = null, contextTypeId = null) {
+    const charValue = getData(valueLookup, typeId, valueId, valueTypeId, contextId, contextTypeId);
+    if (charValue !== null) {
+        return getNotes(charValue);
+    }
+    return defaultValue;
+}
+/**
+ *
+ * @param valueLookup
+ * @param typeId
+ * @param valueId
+ * @param valueTypeId
+ * @param defaultValue
+ * @param contextId
+ * @param contextTypeId
+ */
+export function getTypedKeyValue(valueLookup, typeId, valueId = null, valueTypeId = null, defaultValue = null, contextId = null, contextTypeId = null) {
+    return getKeyValue(valueLookup, typeId, valueId, valueTypeId, defaultValue, contextId, contextTypeId);
+}
+/**
+ *
+ * @param characterValue
+ * @param defaultValue
+ */
+export function getCharacterValueValue(characterValue, defaultValue = null) {
+    const value = getValue(characterValue);
+    if (value === null) {
+        return defaultValue;
+    }
+    return value;
+}
+/**
+ *
+ * @param characterValue
+ * @param defaultValue
+ */
+export function getTypedCharacterValueValue(characterValue, defaultValue = null) {
+    return getCharacterValueValue(characterValue, defaultValue);
+}
+/**
+ *
+ * @param valueLookup
+ * @param valueId
+ * @param valueTypeId
+ * @param defaultValue
+ * @param contextId
+ * @param contextTypeId
+ */
+export function getSavingThrowMiscBonusValue(valueLookup, valueId = null, valueTypeId = null, defaultValue = 0, contextId = null, contextTypeId = null) {
+    return getTypedKeyValue(valueLookup, AdjustmentTypeEnum.SAVING_THROW_MISC_BONUS, valueId, valueTypeId, defaultValue, contextId, contextTypeId);
+}
+/**
+ *
+ * @param valueLookup
+ * @param valueId
+ * @param valueTypeId
+ * @param defaultValue
+ * @param contextId
+ * @param contextTypeId
+ */
+export function getSavingThrowMagicBonusValue(valueLookup, valueId = null, valueTypeId = null, defaultValue = 0, contextId = null, contextTypeId = null) {
+    return getTypedKeyValue(valueLookup, AdjustmentTypeEnum.SAVING_THROW_MAGIC_BONUS, valueId, valueTypeId, defaultValue, contextId, contextTypeId);
+}
+/**
+ *
+ * @param valueLookup
+ * @param valueId
+ * @param valueTypeId
+ * @param defaultValue
+ * @param contextId
+ * @param contextTypeId
+ */
+export function getSavingThrowOverrideValue(valueLookup, valueId = null, valueTypeId = null, defaultValue = null, contextId = null, contextTypeId = null) {
+    return getTypedKeyValue(valueLookup, AdjustmentTypeEnum.SAVING_THROW_OVERRIDE, valueId, valueTypeId, defaultValue, contextId, contextTypeId);
+}
+/**
+ *
+ * @param valueLookup
+ * @param valueId
+ * @param valueTypeId
+ * @param defaultValue
+ * @param contextId
+ * @param contextTypeId
+ */
+export function getSavingThrowProficiencyLevelValue(valueLookup, valueId = null, valueTypeId = null, defaultValue = null, contextId = null, contextTypeId = null) {
+    return getTypedKeyValue(valueLookup, AdjustmentTypeEnum.SAVING_THROW_PROFICIENCY_LEVEL, valueId, valueTypeId, defaultValue, contextId, contextTypeId);
+}
+/**
+ *
+ * @param valueLookup
+ * @param defaultValue
+ */
+export function getOverridePassivePerceptionValue(valueLookup, defaultValue = null) {
+    return getTypedKeyValue(valueLookup, AdjustmentTypeEnum.OVERRIDE_PASSIVE_PERCEPTION, undefined, undefined, defaultValue);
+}
+/**
+ *
+ * @param valueLookup
+ * @param defaultValue
+ */
+export function getOverridePassiveInvestigationValue(valueLookup, defaultValue = null) {
+    return getTypedKeyValue(valueLookup, AdjustmentTypeEnum.OVERRIDE_PASSIVE_INVESTIGATION, undefined, undefined, defaultValue);
+}
+/**
+ *
+ * @param valueLookup
+ * @param defaultValue
+ */
+export function getOverridePassiveInsightValue(valueLookup, defaultValue = null) {
+    return getTypedKeyValue(valueLookup, AdjustmentTypeEnum.OVERRIDE_PASSIVE_INSIGHT, undefined, undefined, defaultValue);
+}
+/**
+ *
+ * @param valueLookup
+ * @param valueId
+ * @param valueTypeId
+ * @param defaultValue
+ * @param contextId
+ * @param contextTypeId
+ */
+export function getIsOffhand(valueLookup, valueId = null, valueTypeId = null, defaultValue = null, contextId = null, contextTypeId = null) {
+    return getTypedKeyValue(valueLookup, AdjustmentTypeEnum.IS_OFFHAND, valueId, valueTypeId, defaultValue, contextId, contextTypeId);
+}
+/**
+ *
+ * @param valueLookup
+ * @param valueId
+ * @param valueTypeId
+ * @param defaultValue
+ * @param contextId
+ * @param contextTypeId
+ */
+export function getFixedValueBonus(valueLookup, valueId = null, valueTypeId = null, defaultValue = null, contextId = null, contextTypeId = null) {
+    return getTypedKeyValue(valueLookup, AdjustmentTypeEnum.FIXED_VALUE_BONUS, valueId, valueTypeId, defaultValue, contextId, contextTypeId);
+}
+/**
+ *
+ * @param valueLookup
+ * @param valueId
+ * @param valueTypeId
+ * @param defaultValue
+ * @param contextId
+ * @param contextTypeId
+ */
+export function getToHitBonus(valueLookup, valueId = null, valueTypeId = null, defaultValue = null, contextId = null, contextTypeId = null) {
+    return getTypedKeyValue(valueLookup, AdjustmentTypeEnum.TO_HIT_BONUS, valueId, valueTypeId, defaultValue, contextId, contextTypeId);
+}
+/**
+ *
+ * @param valueLookup
+ * @param valueId
+ * @param valueTypeId
+ * @param defaultValue
+ * @param contextId
+ * @param contextTypeId
+ */
+export function getToHitOverride(valueLookup, valueId = null, valueTypeId = null, defaultValue = null, contextId = null, contextTypeId = null) {
+    return getTypedKeyValue(valueLookup, AdjustmentTypeEnum.TO_HIT_OVERRIDE, valueId, valueTypeId, defaultValue, contextId, contextTypeId);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Value/validators.js b/ddb_main/packages/rules-engine/es/engine/Value/validators.js
new file mode 100644
index 0000000..d716c35
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Value/validators.js
@@ -0,0 +1,22 @@
+import { ValueUtils } from './index';
+/**
+ *
+ * @param customizationTypes
+ * @param valueLookup
+ * @param valueId
+ * @param valueTypeId
+ * @param contextId
+ * @param contextTypeId
+ */
+export function validateHasCustomization(customizationTypes, valueLookup, valueId = null, valueTypeId = null, contextId = null, contextTypeId = null) {
+    return customizationTypes.some((typeId) => {
+        const value = ValueUtils.getKeyValue(valueLookup, typeId, valueId, valueTypeId, null, contextId, contextTypeId);
+        if (value !== null && value !== '') {
+            return true;
+        }
+        const notes = ValueUtils.getKeyNotes(valueLookup, typeId, valueId, valueTypeId, null, contextId, contextTypeId);
+        if (notes !== null && notes !== '') {
+            return true;
+        }
+    });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Vehicle/accessors.js b/ddb_main/packages/rules-engine/es/engine/Vehicle/accessors.js
new file mode 100644
index 0000000..b5430f1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Vehicle/accessors.js
@@ -0,0 +1,653 @@
+import { TypeScriptUtils } from '../../utils';
+/**
+ *
+ * @param vehicle
+ */
+export function getAccessType(vehicle) {
+    return vehicle.accessType;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getId(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getMappingId(vehicle) {
+    return vehicle.id;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getCharacterId(vehicle) {
+    return vehicle.characterId;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionKey(vehicle) {
+    return vehicle.definitionKey;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionDefinitionKey(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.definitionKey) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionId(vehicle) {
+    return vehicle.definitionId;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getUniqueKey(vehicle) {
+    return vehicle.uniqueKey;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getAvatarUrl(vehicle) {
+    return getDefinitionAvatarUrl(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionAvatarUrl(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.avatarUrl) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getName(vehicle) {
+    return vehicle.name ? vehicle.name : getDefinitionName(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionName(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : null;
+}
+export function getSlug(vehicle) {
+    return getDefinitionSlug(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionSlug(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.slug) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionStats(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.stats) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getActionsText(vehicle) {
+    return getDefinitionActionsText(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionActionsText(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.actionsText) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionActions(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.actions) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getActions(vehicle) {
+    return vehicle.actions;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getActionSummaries(vehicle) {
+    return getDefinitionComponentActionSummaries(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionComponentActionSummaries(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.componentActionSummaries) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getAllActions(vehicle) {
+    return vehicle.allActions;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getCargoCapacity(vehicle) {
+    return getDefinitionCargoCapacity(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionCargoCapacity(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.cargoCapacity) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getCargoCapacityDescription(vehicle) {
+    return getDefinitionCargoCapacityDescription(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionCargoCapacityDescription(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.cargoCapacityDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getEnabledConditions(vehicle) {
+    return getDefinitionEnabledConditions(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionEnabledConditions(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.enabledConditions) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getActiveConditionLookup(vehicle) {
+    return vehicle.activeConditionLookup;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getActiveConditions(vehicle) {
+    return vehicle.activeConditions;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getConditions(vehicle) {
+    return vehicle.conditions;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getRemainingFuel(vehicle) {
+    return vehicle.remainingFuel;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionFuelData(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.fuelData) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getFuelData(vehicle) {
+    return vehicle.fuelData;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getPrimaryComponent(vehicle) {
+    return vehicle.primaryComponent;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getComponents(vehicle) {
+    return vehicle.components;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getActionStations(vehicle) {
+    return vehicle.actionStations;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionComponents(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.components) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getConditionImmunities(vehicle) {
+    return getDefinitionConditionImmunities(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionConditionImmunities(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.conditionImmunities) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getCreatureCapacityDescriptions(vehicle) {
+    return vehicle.creatureCapacityDescriptions;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getCreatureCapacity(vehicle) {
+    return getDefinitionCreatureCapacity(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionCreatureCapacity(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.creatureCapacity) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDamageImmunities(vehicle) {
+    return getDefinitionDamageImmunities(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionDamageImmunities(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.damageImmunities) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getLength(vehicle) {
+    return getDefinitionLength(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionLength(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getWidth(vehicle) {
+    return getDefinitionWidth(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionWidth(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.width) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getLevels(vehicle) {
+    return getDefinitionLevels(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionLevels(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.levels) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getStats(vehicle) {
+    return vehicle.stats;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getTravelPace(vehicle) {
+    return getDefinitionTravelPace(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionTravelPace(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.travelPace) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getTravelPaceEffectiveHours(vehicle) {
+    return getDefinitionTravelPaceEffectiveHours(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionTravelPaceEffectiveHours(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.travelPaceEffectiveHours) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getLargeAvatarUrl(vehicle) {
+    return getDefinitionLargeAvatarUrl(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionLargeAvatarUrl(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.largeAvatarUrl) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getType(vehicle) {
+    return getDefinitionType(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionType(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.type) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getUrl(vehicle) {
+    return getDefinitionUrl(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionUrl(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getWeight(vehicle) {
+    return getDefinitionWeight(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionWeight(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.weight) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getConfigurations(vehicle) {
+    return getDefinitionConfigurations(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionConfigurations(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.configurations) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getConfigurationLookup(vehicle) {
+    return vehicle.configurationLookup;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getConfigurationValueLookup(vehicle) {
+    return vehicle.configurationValueLookup;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getStatLookup(vehicle) {
+    return vehicle.statLookup;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getFeatures(vehicle) {
+    return vehicle.features;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionFeatures(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.features) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDamageImmunityInfos(vehicle) {
+    return vehicle.damageImmunityInfos;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getConditionImmunityInfos(vehicle) {
+    return vehicle.conditionImmunityInfos;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getSizeId(vehicle) {
+    return vehicle.sizeId;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionSizeId(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.sizeId) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getSizeInfo(vehicle) {
+    return vehicle.sizeInfo;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getNotes(vehicle) {
+    return vehicle.notes;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionDescription(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDescription(vehicle) {
+    return vehicle.description;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getObjectTypeInfo(vehicle) {
+    return vehicle.objectTypeInfo;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getMovementKeys(vehicle) {
+    return vehicle.movementKeys;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getMovementNames(vehicle) {
+    return vehicle.movementNames;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getTypeName(vehicle) {
+    var _a, _b;
+    return (_b = (_a = getObjectTypeInfo(vehicle)) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getSearchTags(vehicle) {
+    return [getDefinitionName(vehicle), getTypeName(vehicle)].filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getAllComponentsData(vehicle) {
+    return [...getComponents(vehicle), ...getActionStations(vehicle)];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionSources(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.sources) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getSources(vehicle) {
+    return getDefinitionSources(vehicle);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDefinitionIsHomebrew(vehicle) {
+    var _a, _b;
+    return (_b = (_a = vehicle.definition) === null || _a === void 0 ? void 0 : _a.isHomebrew) !== null && _b !== void 0 ? _b : false;
+}
+/**
+ *
+ * @param vehicle
+ */
+export function isHomebrew(vehicle) {
+    return getDefinitionIsHomebrew(vehicle);
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Vehicle/constants.js b/ddb_main/packages/rules-engine/es/engine/Vehicle/constants.js
new file mode 100644
index 0000000..41d22bd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Vehicle/constants.js
@@ -0,0 +1,44 @@
+export var VehicleConfigurationKeyEnum;
+(function (VehicleConfigurationKeyEnum) {
+    VehicleConfigurationKeyEnum["ENABLE_TRAVEL_PACE"] = "ETP";
+    VehicleConfigurationKeyEnum["ENABLE_COMPONENTS"] = "EC";
+    VehicleConfigurationKeyEnum["ENABLE_ACTION_STATIONS"] = "EAS";
+    VehicleConfigurationKeyEnum["ENABLE_LEVELS"] = "EL";
+    VehicleConfigurationKeyEnum["ENABLE_COMPONENT_HIT_POINTS"] = "ECHP";
+    VehicleConfigurationKeyEnum["ENABLE_COMPONENT_ARMOR_CLASS"] = "ECAC";
+    VehicleConfigurationKeyEnum["ENABLE_COMPONENT_SPEEDS"] = "ECS";
+    VehicleConfigurationKeyEnum["ENABLE_COMPONENT_MISHAP_THRESHOLD"] = "ECMT";
+    VehicleConfigurationKeyEnum["ENABLE_COMPONENT_DAMAGE_THRESHOLD"] = "ECDT";
+    VehicleConfigurationKeyEnum["ENABLE_COMPONENT_ARMOR_CLASS_MOTIONLESS"] = "ECACM";
+    VehicleConfigurationKeyEnum["ENABLE_COMPONENT_CREW_REQUIREMENTS"] = "ECCR";
+    VehicleConfigurationKeyEnum["ENABLE_COMPONENT_COVER"] = "ECC";
+    VehicleConfigurationKeyEnum["ENABLE_COMPONENT_REMOVAL"] = "ECR";
+    VehicleConfigurationKeyEnum["ENABLE_FEATURES"] = "EF";
+    VehicleConfigurationKeyEnum["ENABLE_CONDITIONS_TRACKING"] = "ECT";
+    VehicleConfigurationKeyEnum["ENABLE_FUEL_TRACKING"] = "EFT";
+    VehicleConfigurationKeyEnum["PRIMARY_COMPONENT_MANAGE_TYPE"] = "PCMT";
+    VehicleConfigurationKeyEnum["SIZE_TYPE"] = "ST";
+    VehicleConfigurationKeyEnum["DISPLAY_TYPE"] = "DT";
+})(VehicleConfigurationKeyEnum || (VehicleConfigurationKeyEnum = {}));
+export var VehicleConfigurationDisplayTypeEnum;
+(function (VehicleConfigurationDisplayTypeEnum) {
+    VehicleConfigurationDisplayTypeEnum["SHIP"] = "ship";
+    VehicleConfigurationDisplayTypeEnum["INFERNAL_WAR_MACHINE"] = "infernal-war-machine";
+    VehicleConfigurationDisplayTypeEnum["SPELLJAMMER"] = "spelljammer";
+})(VehicleConfigurationDisplayTypeEnum || (VehicleConfigurationDisplayTypeEnum = {}));
+export var VehicleConfigurationPrimaryComponentManageTypeEnum;
+(function (VehicleConfigurationPrimaryComponentManageTypeEnum) {
+    VehicleConfigurationPrimaryComponentManageTypeEnum["COMPONENT"] = "component";
+    VehicleConfigurationPrimaryComponentManageTypeEnum["VEHICLE"] = "vehicle";
+    VehicleConfigurationPrimaryComponentManageTypeEnum["ALL"] = "all";
+})(VehicleConfigurationPrimaryComponentManageTypeEnum || (VehicleConfigurationPrimaryComponentManageTypeEnum = {}));
+export var VehicleConfigurationSizeTypeEnum;
+(function (VehicleConfigurationSizeTypeEnum) {
+    VehicleConfigurationSizeTypeEnum["WEIGHT"] = "weight";
+    VehicleConfigurationSizeTypeEnum["DIMENSION"] = "dimension";
+})(VehicleConfigurationSizeTypeEnum || (VehicleConfigurationSizeTypeEnum = {}));
+export var VehicleComponentGroupTypeEnum;
+(function (VehicleComponentGroupTypeEnum) {
+    VehicleComponentGroupTypeEnum["ACTION_STATION"] = "action-station";
+    VehicleComponentGroupTypeEnum["COMPONENT"] = "component";
+})(VehicleComponentGroupTypeEnum || (VehicleComponentGroupTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/Vehicle/derivers.js b/ddb_main/packages/rules-engine/es/engine/Vehicle/derivers.js
new file mode 100644
index 0000000..6c96c16
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Vehicle/derivers.js
@@ -0,0 +1,302 @@
+import { sortBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { AbilityUtils } from '../Ability';
+import { AccessTypeEnum } from '../Access';
+import { ProficiencyLevelEnum } from '../Core';
+import { DefinitionUtils } from '../Definition';
+import { DefinitionPoolUtils } from '../DefinitionPool';
+import { HelperUtils } from '../Helper';
+import { RuleDataAccessors, RuleDataUtils } from '../RuleData';
+import { VehicleComponentAccessors } from '../VehicleComponent';
+import { getAllComponentsData, getConditionImmunities, getCreatureCapacity, getDamageImmunities, getDefinitionActions, getDefinitionKey, getDefinitionStats, getDescription, getLength, getType, getWeight, getWidth, } from './accessors';
+import { VehicleComponentGroupTypeEnum, VehicleConfigurationDisplayTypeEnum, VehicleConfigurationKeyEnum, VehicleConfigurationSizeTypeEnum, } from './constants';
+import { generateVehicleAction } from './generators';
+import { getConfigurationValue } from './utils';
+/**
+ *
+ * @param vehicleDefinition
+ * @param ruleData
+ */
+export function deriveStats(vehicleDefinition, ruleData) {
+    if (vehicleDefinition.stats === null) {
+        return [];
+    }
+    return vehicleDefinition.stats.map((stat) => {
+        const score = stat.value;
+        return {
+            id: stat.id,
+            score,
+            statKey: stat.name,
+            modifier: score === null ? null : AbilityUtils.getStatScoreModifier(score, ruleData),
+        };
+    });
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveAbilities(vehicle, ruleData) {
+    const stats = getDefinitionStats(vehicle);
+    return stats.map((stat) => {
+        const score = stat.value;
+        const name = stat.name ? stat.name : '';
+        const statScoreModifier = score === null ? null : AbilityUtils.getStatScoreModifier(score, ruleData);
+        return {
+            label: name,
+            id: stat.id,
+            entityTypeId: -1,
+            name,
+            statKey: name,
+            totalScore: score,
+            score,
+            maxStatScore: RuleDataAccessors.getMaxStatScore(ruleData),
+            isMaxed: !!score && score >= RuleDataAccessors.getMaxStatScore(ruleData),
+            modifier: statScoreModifier,
+            baseScore: score,
+            racialBonus: 0,
+            classBonuses: 0,
+            miscBonus: 0,
+            setScore: 0,
+            stackingBonus: 0,
+            otherBonus: 0,
+            overrideScore: null,
+            proficiency: false,
+            proficiencyLevel: ProficiencyLevelEnum.NONE,
+            isSaveProficiencyModified: false,
+            isSaveModifierModified: false,
+            save: statScoreModifier ? statScoreModifier : 0,
+            saveBonuses: 0,
+            isSaveOverridden: false,
+            allStatBonusSuppliers: [],
+            statSetScoreSuppliers: [],
+            statMaxBonusSuppliers: [],
+            stackingBonusSuppliers: [],
+        };
+    });
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveCreatureCapacityDescriptions(vehicle, ruleData) {
+    const creatureCapacityInfos = getCreatureCapacity(vehicle);
+    const descriptions = creatureCapacityInfos.map((capacity) => {
+        var _a;
+        let sizeName = '';
+        if (capacity.sizeId !== null) {
+            const sizeInfo = RuleDataUtils.getCreatureSizeInfo(capacity.sizeId, ruleData);
+            if (sizeInfo && sizeInfo.name) {
+                sizeName = sizeInfo.name;
+            }
+        }
+        const isSpelljammer = getConfigurationValue(VehicleConfigurationKeyEnum.DISPLAY_TYPE, vehicle) ===
+            VehicleConfigurationDisplayTypeEnum.SPELLJAMMER;
+        const needsParens = isSpelljammer && capacity.type !== null;
+        return `${capacity.capacity} ${sizeName} ${needsParens ? '(' : ''}${(_a = capacity.type) !== null && _a !== void 0 ? _a : ''}${needsParens ? ')' : ''}`.trim();
+    });
+    return descriptions;
+}
+/**
+ *
+ * @param abilityLookup
+ */
+export function deriveModifierData(abilityLookup) {
+    return {
+        proficiencyBonus: 0,
+        abilityLookup,
+        attunedItemCount: 0,
+    };
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveDamageImmunities(vehicle, ruleData) {
+    return getDamageImmunities(vehicle)
+        .map((damageImmunityId) => RuleDataUtils.getDamageType(damageImmunityId, ruleData))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveConditionImmunities(vehicle, ruleData) {
+    return getConditionImmunities(vehicle)
+        .map((conditionId) => RuleDataUtils.getCondition(conditionId, ruleData))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveSizeId(vehicle, ruleData) {
+    const sizeType = getConfigurationValue(VehicleConfigurationKeyEnum.SIZE_TYPE, vehicle);
+    let ranges = [];
+    let value = null;
+    switch (sizeType) {
+        case VehicleConfigurationSizeTypeEnum.WEIGHT:
+            ranges = sortBy(RuleDataAccessors.getVehicleWeightRanges(ruleData), (range) => range.minSize);
+            value = getWeight(vehicle);
+            break;
+        case VehicleConfigurationSizeTypeEnum.DIMENSION:
+            ranges = sortBy(RuleDataAccessors.getVehicleDimensionRanges(ruleData), (range) => range.minSize);
+            const dimensions = [];
+            const width = getWidth(vehicle);
+            if (width !== null) {
+                dimensions.push(width);
+            }
+            const length = getLength(vehicle);
+            if (length !== null) {
+                dimensions.push(length);
+            }
+            value = dimensions.length > 0 ? Math.max(...dimensions) : null;
+            break;
+        default:
+        // not implemented
+    }
+    let sizeId = null;
+    if (value !== null && ranges.length > 0) {
+        const compareValue = value;
+        ranges.forEach((range) => {
+            if (compareValue >= range.minSize) {
+                sizeId = range.sizeId;
+            }
+        });
+    }
+    return sizeId;
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveSizeInfo(vehicle, ruleData) {
+    const sizeId = deriveSizeId(vehicle, ruleData);
+    if (sizeId === null) {
+        return null;
+    }
+    return RuleDataUtils.getCreatureSizeInfo(sizeId, ruleData);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function deriveNotes(vehicle) {
+    const description = getDescription(vehicle);
+    if (!description) {
+        return description;
+    }
+    return null;
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveObjectTypeInfo(vehicle, ruleData) {
+    const type = getType(vehicle);
+    if (type === null) {
+        return null;
+    }
+    return RuleDataUtils.getObjectTypeInfo(type, ruleData);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function deriveMovementKeys(vehicle) {
+    const movementKeys = [];
+    getAllComponentsData(vehicle).forEach((component) => {
+        VehicleComponentAccessors.getSpeedInfos(component).forEach((speed) => {
+            if (speed.type && !movementKeys.includes(speed.type)) {
+                movementKeys.push(speed.type);
+            }
+        });
+    });
+    return movementKeys;
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveMovementNames(vehicle, ruleData) {
+    return deriveMovementKeys(vehicle)
+        .map((typeKey) => RuleDataUtils.getVehicleMovementName(typeKey, ruleData))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function deriveDefinitionId(vehicle) {
+    const definitionKey = getDefinitionKey(vehicle);
+    if (!definitionKey) {
+        return null;
+    }
+    return DefinitionUtils.getDefinitionKeyId(definitionKey);
+}
+/**
+ *
+ * @param vehicle
+ * @param definitionPool
+ */
+export function deriveAccessType(vehicle, definitionPool) {
+    let accessType = AccessTypeEnum.NO_ACCESS;
+    const definitionKey = getDefinitionKey(vehicle);
+    if (definitionKey !== null) {
+        accessType = DefinitionPoolUtils.getDefinitionAccessType(definitionKey, definitionPool);
+    }
+    return accessType;
+}
+/**
+ *
+ * @param configurationLookup
+ * @param configurationKey
+ * @param defaultValue
+ */
+export function deriveConfigurationValueLookupValue(configurationLookup, configurationKey, defaultValue) {
+    const configurationInfo = HelperUtils.lookupDataOrFallback(configurationLookup, configurationKey);
+    if (configurationInfo !== null) {
+        return configurationInfo.value;
+    }
+    return defaultValue;
+}
+/**
+ *
+ * @param components
+ */
+export function deriveComponentListsByGroupType(components) {
+    const componentTypes = [];
+    const actionStationsTypes = [];
+    components.forEach((component) => {
+        const groupType = VehicleComponentAccessors.getGroupType(component);
+        switch (groupType) {
+            case VehicleComponentGroupTypeEnum.COMPONENT:
+                componentTypes.push(component);
+                break;
+            case VehicleComponentGroupTypeEnum.ACTION_STATION:
+                actionStationsTypes.push(component);
+                break;
+            default:
+            // not implemented
+        }
+    });
+    return {
+        components: componentTypes,
+        actionStations: actionStationsTypes,
+    };
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveActions(vehicle, ruleData) {
+    return getDefinitionActions(vehicle).map((actionContract) => generateVehicleAction(vehicle, actionContract, ruleData));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Vehicle/generators.js b/ddb_main/packages/rules-engine/es/engine/Vehicle/generators.js
new file mode 100644
index 0000000..f620b7d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Vehicle/generators.js
@@ -0,0 +1,232 @@
+import { keyBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { ActionGenerators } from '../Action';
+import { ConditionAccessors } from '../Condition';
+import { ConditionLevelGenerators } from '../ConditionLevel';
+import { DataOriginDataInfoKeyEnum, DataOriginGenerators, DataOriginTypeEnum, } from '../DataOrigin';
+import { DefinitionPoolUtils } from '../DefinitionPool';
+import { RuleDataUtils } from '../RuleData';
+import { VehicleComponentAccessors, VehicleComponentGenerators } from '../VehicleComponent';
+import { getActions, getAllComponentsData, getConditions, getDefinitionFeatures, getDefinitionFuelData, getDefinitionKey, getFeatures, getMappingId, getRemainingFuel, getUniqueKey, } from './accessors';
+import { VehicleConfigurationDisplayTypeEnum, VehicleConfigurationKeyEnum, VehicleConfigurationPrimaryComponentManageTypeEnum, VehicleConfigurationSizeTypeEnum, } from './constants';
+import { deriveAbilities, deriveAccessType, deriveActions, deriveComponentListsByGroupType, deriveConditionImmunities, deriveConfigurationValueLookupValue, deriveCreatureCapacityDescriptions, deriveDamageImmunities, deriveDefinitionId, deriveModifierData, deriveMovementKeys, deriveMovementNames, deriveNotes, deriveObjectTypeInfo, deriveSizeId, deriveSizeInfo, deriveStats, } from './derivers';
+/**
+ *
+ * @param vehicle
+ */
+export function generateUniqueKey(vehicle) {
+    return `${getMappingId(vehicle)}-${getDefinitionKey(vehicle)}`;
+}
+/**
+ *
+ * @param vehicle
+ * @param action
+ * @param ruleData
+ */
+export function generateVehicleAction(vehicle, action, ruleData) {
+    const baseAction = ActionGenerators.generateBaseAction(action, {});
+    const dataOriginBaseAction = Object.assign(Object.assign({}, baseAction), { dataOrigin: DataOriginGenerators.generateDataOrigin(DataOriginTypeEnum.VEHICLE, vehicle) });
+    const abilities = deriveAbilities(vehicle, ruleData);
+    const abilityLookup = keyBy(abilities, 'id');
+    const modifierData = deriveModifierData(abilityLookup);
+    const proficiencyBonus = 0;
+    const modifiers = [];
+    const valueLookup = {};
+    const martialArtsLevelScale = null;
+    return ActionGenerators.generateAction(dataOriginBaseAction, proficiencyBonus, abilityLookup, modifiers, valueLookup, martialArtsLevelScale, ruleData, modifierData);
+}
+/**
+ *
+ * @param conditionMapping
+ * @param ruleData
+ */
+export function generateVehicleCondition(conditionMapping, ruleData) {
+    const baseCondition = RuleDataUtils.getConditionInfo(conditionMapping.conditionId, ruleData);
+    if (baseCondition === null) {
+        return null;
+    }
+    const decoratedCondition = {
+        definition: baseCondition.definition,
+    };
+    let levels = [];
+    if (baseCondition.definition !== null) {
+        const foundLevels = ConditionAccessors.getDefinitionLevels(decoratedCondition).map((level) => {
+            let decoratedLevel = null;
+            if (level) {
+                decoratedLevel = ConditionLevelGenerators.generateConditionLevel(level, decoratedCondition, {});
+            }
+            return decoratedLevel;
+        });
+        levels = foundLevels.filter(TypeScriptUtils.isNotNullOrUndefined);
+    }
+    return Object.assign(Object.assign({}, decoratedCondition), { level: conditionMapping.level, levels, modifiers: [] });
+}
+/**
+ *
+ * @param vehicleDefinition
+ */
+export function generateConfigurationLookup(vehicleDefinition) {
+    const lookup = {};
+    if (vehicleDefinition.configurations === null) {
+        return lookup;
+    }
+    vehicleDefinition.configurations.forEach((configInfo) => {
+        if (configInfo.key !== null) {
+            lookup[configInfo.key] = configInfo;
+        }
+    });
+    return lookup;
+}
+/**
+ *
+ * @param vehicleDefinition
+ */
+export function generateConfigurationValueLookup(vehicleDefinition) {
+    const configurationLookup = generateConfigurationLookup(vehicleDefinition);
+    return {
+        [VehicleConfigurationKeyEnum.DISPLAY_TYPE]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.DISPLAY_TYPE, VehicleConfigurationDisplayTypeEnum.SHIP),
+        [VehicleConfigurationKeyEnum.SIZE_TYPE]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.SIZE_TYPE, VehicleConfigurationSizeTypeEnum.DIMENSION),
+        [VehicleConfigurationKeyEnum.PRIMARY_COMPONENT_MANAGE_TYPE]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.PRIMARY_COMPONENT_MANAGE_TYPE, VehicleConfigurationPrimaryComponentManageTypeEnum.COMPONENT),
+        [VehicleConfigurationKeyEnum.ENABLE_TRAVEL_PACE]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_TRAVEL_PACE, true),
+        [VehicleConfigurationKeyEnum.ENABLE_COMPONENTS]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_COMPONENTS, true),
+        [VehicleConfigurationKeyEnum.ENABLE_ACTION_STATIONS]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_ACTION_STATIONS, false),
+        [VehicleConfigurationKeyEnum.ENABLE_LEVELS]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_LEVELS, true),
+        [VehicleConfigurationKeyEnum.ENABLE_COMPONENT_HIT_POINTS]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_COMPONENT_HIT_POINTS, true),
+        [VehicleConfigurationKeyEnum.ENABLE_COMPONENT_ARMOR_CLASS]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_COMPONENT_ARMOR_CLASS, true),
+        [VehicleConfigurationKeyEnum.ENABLE_COMPONENT_SPEEDS]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_COMPONENT_SPEEDS, true),
+        [VehicleConfigurationKeyEnum.ENABLE_COMPONENT_MISHAP_THRESHOLD]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_COMPONENT_MISHAP_THRESHOLD, false),
+        [VehicleConfigurationKeyEnum.ENABLE_COMPONENT_DAMAGE_THRESHOLD]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_COMPONENT_DAMAGE_THRESHOLD, true),
+        [VehicleConfigurationKeyEnum.ENABLE_COMPONENT_ARMOR_CLASS_MOTIONLESS]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_COMPONENT_ARMOR_CLASS_MOTIONLESS, false),
+        [VehicleConfigurationKeyEnum.ENABLE_COMPONENT_CREW_REQUIREMENTS]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_COMPONENT_CREW_REQUIREMENTS, false),
+        [VehicleConfigurationKeyEnum.ENABLE_COMPONENT_COVER]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_COMPONENT_COVER, false),
+        [VehicleConfigurationKeyEnum.ENABLE_COMPONENT_REMOVAL]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_COMPONENT_REMOVAL, true),
+        [VehicleConfigurationKeyEnum.ENABLE_FEATURES]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_FEATURES, false),
+        [VehicleConfigurationKeyEnum.ENABLE_CONDITIONS_TRACKING]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_CONDITIONS_TRACKING, false),
+        [VehicleConfigurationKeyEnum.ENABLE_FUEL_TRACKING]: deriveConfigurationValueLookupValue(configurationLookup, VehicleConfigurationKeyEnum.ENABLE_FUEL_TRACKING, false),
+    };
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function generateFeatures(vehicle, ruleData) {
+    const features = getDefinitionFeatures(vehicle);
+    return features.map((feature) => {
+        let actions = null;
+        if (feature.actions !== null) {
+            actions = feature.actions.map((action) => generateVehicleAction(vehicle, action, ruleData));
+        }
+        return Object.assign(Object.assign({}, feature), { actions });
+    });
+}
+/**
+ *
+ * @param vehicleMapping
+ * @param ruleData
+ */
+export function generateActiveConditions(vehicleMapping, ruleData) {
+    const conditions = getConditions(vehicleMapping);
+    if (conditions === null) {
+        return [];
+    }
+    return conditions
+        .map((conditionInfo) => generateVehicleCondition(conditionInfo, ruleData))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param vehicle
+ */
+export function generateFuelData(vehicle) {
+    const remainingFuel = getRemainingFuel(vehicle);
+    const fuelData = getDefinitionFuelData(vehicle);
+    if (fuelData === null) {
+        return null;
+    }
+    return Object.assign(Object.assign({}, fuelData), { remainingFuel });
+}
+/**
+ *
+ * @param vehicle
+ */
+export function generateAggregatedActions(vehicle) {
+    const allActions = [...getActions(vehicle)];
+    const features = getFeatures(vehicle);
+    if (features) {
+        features.forEach((feature) => {
+            if (feature.actions !== null) {
+                feature.actions.forEach((action) => {
+                    allActions.push(action);
+                });
+            }
+        });
+    }
+    getAllComponentsData(vehicle).forEach((component) => {
+        VehicleComponentAccessors.getActions(component).forEach((action) => {
+            allActions.push(action);
+        });
+    });
+    return allActions;
+}
+/**
+ *
+ * @param vehicles
+ * @param vehicleComponentLookup
+ * @param definitionPool
+ * @param ruleData
+ */
+export function generateVehicles(vehicles, vehicleComponentLookup, definitionPool, ruleData) {
+    return vehicles
+        .map((vehicle) => generateVehicle(vehicle, vehicleComponentLookup, definitionPool, ruleData))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param vehicleMapping
+ * @param vehicleComponentLookup
+ * @param definitionPool
+ * @param ruleData
+ */
+export function generateVehicle(vehicleMapping, vehicleComponentLookup, definitionPool, ruleData) {
+    const definitionKey = getDefinitionKey(vehicleMapping);
+    if (definitionKey === null) {
+        return null;
+    }
+    const definition = DefinitionPoolUtils.getVehicleDefinition(definitionKey, definitionPool);
+    if (definition === null) {
+        return null;
+    }
+    const stats = deriveStats(definition, ruleData);
+    const activeConditions = generateActiveConditions(vehicleMapping, ruleData);
+    const baseVehicle = Object.assign(Object.assign({}, vehicleMapping), { definition, definitionId: deriveDefinitionId(vehicleMapping), accessType: deriveAccessType(vehicleMapping, definitionPool), stats, statLookup: keyBy(stats, 'id'), configurationLookup: generateConfigurationLookup(definition), configurationValueLookup: generateConfigurationValueLookup(definition), activeConditions, activeConditionLookup: keyBy(activeConditions, (condition) => ConditionAccessors.getId(condition)) });
+    const generatedComponents = VehicleComponentGenerators.generateVehicleComponents(vehicleMapping, baseVehicle, vehicleComponentLookup, ruleData);
+    const primaryComponent = generatedComponents.find((component) => VehicleComponentAccessors.getIsPrimary(component));
+    if (!primaryComponent) {
+        return null;
+    }
+    const groupedComponents = deriveComponentListsByGroupType(generatedComponents);
+    const componentizedVehicle = Object.assign(Object.assign(Object.assign({}, baseVehicle), groupedComponents), { primaryComponent, uniqueKey: generateUniqueKey(baseVehicle), damageImmunityInfos: deriveDamageImmunities(baseVehicle, ruleData), conditionImmunityInfos: deriveConditionImmunities(baseVehicle, ruleData), creatureCapacityDescriptions: deriveCreatureCapacityDescriptions(baseVehicle, ruleData), sizeId: deriveSizeId(baseVehicle, ruleData), sizeInfo: deriveSizeInfo(baseVehicle, ruleData), notes: deriveNotes(baseVehicle), objectTypeInfo: deriveObjectTypeInfo(baseVehicle, ruleData), actions: deriveActions(baseVehicle, ruleData), features: generateFeatures(baseVehicle, ruleData), fuelData: generateFuelData(baseVehicle) });
+    return Object.assign(Object.assign({}, componentizedVehicle), { movementKeys: deriveMovementKeys(componentizedVehicle), movementNames: deriveMovementNames(componentizedVehicle, ruleData), allActions: generateAggregatedActions(componentizedVehicle) });
+}
+/**
+ *
+ * @param vehicles
+ */
+export function generateRefVehicleData(vehicles) {
+    let data = {};
+    vehicles.forEach((vehicle) => {
+        data[getUniqueKey(vehicle)] = {
+            [DataOriginDataInfoKeyEnum.PRIMARY]: vehicle,
+            [DataOriginDataInfoKeyEnum.PARENT]: null,
+        };
+    });
+    return data;
+}
+/**
+ *
+ * @param vehicles
+ */
+export function generateVehicleLookup(vehicles) {
+    return keyBy(vehicles, (vehicle) => getMappingId(vehicle));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Vehicle/index.js b/ddb_main/packages/rules-engine/es/engine/Vehicle/index.js
new file mode 100644
index 0000000..f79259b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Vehicle/index.js
@@ -0,0 +1,12 @@
+import * as VehicleAccessors from './accessors';
+import * as VehicleConstants from './constants';
+import * as VehicleDerivers from './derivers';
+import * as VehicleGenerators from './generators';
+import * as VehicleNotes from './notes';
+import * as VehicleSimulators from './simulators';
+import * as VehicleTypings from './typings';
+import * as VehicleUtils from './utils';
+export * from './constants';
+export * from './typings';
+export { VehicleAccessors, VehicleDerivers, VehicleGenerators, VehicleNotes, VehicleSimulators, VehicleUtils };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, VehicleAccessors), VehicleConstants), VehicleDerivers), VehicleGenerators), VehicleNotes), VehicleSimulators), VehicleTypings), VehicleUtils);
diff --git a/ddb_main/packages/rules-engine/es/engine/Vehicle/notes.js b/ddb_main/packages/rules-engine/es/engine/Vehicle/notes.js
new file mode 100644
index 0000000..3c6967f
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Vehicle/notes.js
@@ -0,0 +1,109 @@
+import { ConditionAccessors } from '../Condition';
+import { DisplayIntentionEnum, NoteGenerators } from '../Note';
+import { RuleDataUtils } from '../RuleData';
+import { VehicleComponentAccessors } from '../VehicleComponent';
+import { getActiveConditions, getAllComponentsData, getCreatureCapacity, getDescription, getPrimaryComponent, } from './accessors';
+import { VehicleConfigurationKeyEnum } from './constants';
+import { getConfigurationValue } from './utils';
+/**
+ *
+ * @param vehicle
+ */
+export function getConditionsNotesComponents(vehicle) {
+    return NoteGenerators.createGroup(getActiveConditions(vehicle).map((condition) => {
+        const name = ConditionAccessors.getName(condition);
+        const level = ConditionAccessors.getActiveLevel(condition);
+        let note = name;
+        if (level !== null) {
+            note = `${name} (Level ${level})`;
+        }
+        return NoteGenerators.createPlainText(note, DisplayIntentionEnum.NEGATIVE);
+    }), ', ');
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getUserDescriptionNoteComponents(vehicle) {
+    const description = getDescription(vehicle);
+    if (!description) {
+        return null;
+    }
+    return NoteGenerators.createPlainText(description);
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function getCreatureCapacityNoteComponents(vehicle, ruleData) {
+    const creatureCapacityInfos = getCreatureCapacity(vehicle);
+    const creatureCapacityDescriptions = creatureCapacityInfos.map((capacity) => {
+        var _a;
+        let sizeName = '';
+        if (capacity.sizeId !== null) {
+            const sizeInfo = RuleDataUtils.getCreatureSizeInfo(capacity.sizeId, ruleData);
+            if (sizeInfo && sizeInfo.name) {
+                sizeName = sizeInfo.name;
+            }
+        }
+        return `${capacity.capacity} ${sizeName} ${(_a = capacity.type) !== null && _a !== void 0 ? _a : 'crew'}`.trim();
+    });
+    if (creatureCapacityDescriptions.length === 0) {
+        return null;
+    }
+    return NoteGenerators.createGroup(creatureCapacityDescriptions.map((capacityInfo) => NoteGenerators.createPlainText(capacityInfo)), ', ');
+}
+/**
+ *
+ * @param vehicle
+ */
+export function getDamageTakenNotesComponents(vehicle) {
+    const primaryComponent = getPrimaryComponent(vehicle);
+    if (primaryComponent === null) {
+        return null;
+    }
+    let damageNote = null;
+    const primaryComponentHitPointInfo = VehicleComponentAccessors.getHitPointInfo(primaryComponent);
+    if (primaryComponentHitPointInfo !== null && primaryComponentHitPointInfo.remainingHp === 0) {
+        damageNote = 'Wrecked';
+    }
+    else if (getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_COMPONENT_HIT_POINTS, vehicle)) {
+        let count = 0;
+        getAllComponentsData(vehicle).forEach((component) => {
+            const hitPointInfo = VehicleComponentAccessors.getHitPointInfo(component);
+            if (hitPointInfo !== null && hitPointInfo.remainingHp < hitPointInfo.totalHp) {
+                count += 1;
+            }
+        });
+        if (count > 0) {
+            damageNote = `Damaged Components: ${count}`;
+        }
+    }
+    return damageNote !== null ? NoteGenerators.createPlainText(damageNote, DisplayIntentionEnum.NEGATIVE) : null;
+}
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function getNoteComponents(vehicle, ruleData) {
+    const notes = [];
+    const descriptionNotes = getUserDescriptionNoteComponents(vehicle);
+    if (descriptionNotes) {
+        notes.push(descriptionNotes);
+    }
+    const damageTakenNotes = getDamageTakenNotesComponents(vehicle);
+    if (damageTakenNotes) {
+        notes.push(damageTakenNotes);
+    }
+    const conditionsNotes = getConditionsNotesComponents(vehicle);
+    if (conditionsNotes) {
+        notes.push(conditionsNotes);
+    }
+    const creatureCapacityNotes = getCreatureCapacityNoteComponents(vehicle, ruleData);
+    if (creatureCapacityNotes) {
+        notes.push(creatureCapacityNotes);
+    }
+    return notes;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Vehicle/simulators.js b/ddb_main/packages/rules-engine/es/engine/Vehicle/simulators.js
new file mode 100644
index 0000000..fc69fb1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Vehicle/simulators.js
@@ -0,0 +1,35 @@
+import { keyBy } from 'lodash';
+import { VehicleComponentAccessors, VehicleComponentSimulators } from '../VehicleComponent';
+import { deriveAccessType, deriveActions, deriveComponentListsByGroupType, deriveConditionImmunities, deriveCreatureCapacityDescriptions, deriveDamageImmunities, deriveDefinitionId, deriveMovementKeys, deriveMovementNames, deriveNotes, deriveObjectTypeInfo, deriveSizeId, deriveSizeInfo, deriveStats, } from './derivers';
+import { generateAggregatedActions, generateConfigurationLookup, generateConfigurationValueLookup, generateFeatures, generateUniqueKey, } from './generators';
+/**
+ *
+ * @param vehicleDefinition
+ * @param definitionPool
+ * @param ruleData
+ */
+export function simulateVehicle(vehicleDefinition, definitionPool, ruleData) {
+    const { definitionKey, name } = vehicleDefinition;
+    if (definitionKey === null) {
+        return null;
+    }
+    const simulatedMapping = {
+        characterId: -1,
+        definitionKey,
+        id: -1,
+        name,
+        description: null,
+        conditions: [],
+        remainingFuel: 0,
+    };
+    const stats = deriveStats(vehicleDefinition, ruleData);
+    const baseVehicle = Object.assign(Object.assign({}, simulatedMapping), { stats, statLookup: keyBy(stats, 'id'), definition: vehicleDefinition, activeConditions: [], activeConditionLookup: {}, configurationLookup: generateConfigurationLookup(vehicleDefinition), configurationValueLookup: generateConfigurationValueLookup(vehicleDefinition), definitionId: deriveDefinitionId(simulatedMapping), accessType: deriveAccessType(simulatedMapping, definitionPool) });
+    const simulatedComponents = VehicleComponentSimulators.simulateVehicleComponents(baseVehicle, ruleData);
+    const primaryComponent = simulatedComponents.find((component) => VehicleComponentAccessors.getIsPrimary(component));
+    if (!primaryComponent) {
+        return null;
+    }
+    const groupedComponents = deriveComponentListsByGroupType(simulatedComponents);
+    const componentizedVehicle = Object.assign(Object.assign(Object.assign({}, baseVehicle), groupedComponents), { primaryComponent, uniqueKey: generateUniqueKey(baseVehicle), damageImmunityInfos: deriveDamageImmunities(baseVehicle, ruleData), conditionImmunityInfos: deriveConditionImmunities(baseVehicle, ruleData), creatureCapacityDescriptions: deriveCreatureCapacityDescriptions(baseVehicle, ruleData), sizeId: deriveSizeId(baseVehicle, ruleData), sizeInfo: deriveSizeInfo(baseVehicle, ruleData), notes: deriveNotes(baseVehicle), objectTypeInfo: deriveObjectTypeInfo(baseVehicle, ruleData), actions: deriveActions(baseVehicle, ruleData), features: generateFeatures(baseVehicle, ruleData), fuelData: null });
+    return Object.assign(Object.assign({}, componentizedVehicle), { movementKeys: deriveMovementKeys(componentizedVehicle), movementNames: deriveMovementNames(componentizedVehicle, ruleData), allActions: generateAggregatedActions(componentizedVehicle) });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/Vehicle/utils.js b/ddb_main/packages/rules-engine/es/engine/Vehicle/utils.js
new file mode 100644
index 0000000..f91b8cb
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/Vehicle/utils.js
@@ -0,0 +1,18 @@
+import { HelperUtils } from '../Helper';
+import { getConfigurationValueLookup } from './accessors';
+/**
+ *
+ * @param key
+ * @param configurationLookup
+ */
+export function getConfigurationInfo(key, configurationLookup) {
+    return HelperUtils.lookupDataOrFallback(configurationLookup, key);
+}
+/**
+ *
+ * @param key
+ * @param vehicle
+ */
+export function getConfigurationValue(key, vehicle) {
+    return getConfigurationValueLookup(vehicle)[key];
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/VehicleComponent/accessors.js b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/accessors.js
new file mode 100644
index 0000000..feb84a3
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/accessors.js
@@ -0,0 +1,381 @@
+import { TypeScriptUtils } from '../../utils';
+import { VehicleComponentGroupTypeEnum } from '../Vehicle';
+/**
+ *
+ * @param component
+ */
+export function getActions(component) {
+    return component.actions;
+}
+/**
+ * @deprecated - this was a generated string of action name and description snippet that we no longer get on the definition
+ * @param component
+ */
+export function getDefinitionActionsDescription(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.actionsDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ * @deprecated - this was a generated string of action name and description snippet that we no longer get on the definition
+ * @param component
+ */
+export function getActionsDescription(component) {
+    return getDefinitionActionsDescription(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getComponentId(component) {
+    return component.componentId;
+}
+/**
+ *
+ * @param component
+ */
+export function getCosts(component) {
+    return getDefinitionCosts(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionCosts(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.costs) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param component
+ */
+export function getArmorClass(component) {
+    return getDefinitionArmorClass(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionArmorClass(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.armorClass) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param component
+ */
+export function getArmorClassDescription(component) {
+    return getDefinitionArmorClassDescription(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionArmorClassDescription(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.armorClassDescription) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param component
+ */
+export function getArmorClassInfo(component) {
+    return component.armorClassInfo;
+}
+/**
+ *
+ * @param component
+ */
+export function getCoverType(component) {
+    return getDefinitionCoverType(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionCoverType(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.coverType) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param component
+ */
+export function getRequiredCrew(component) {
+    return getDefinitionRequiredCrew(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionRequiredCrew(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.requiredCrew) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param component
+ */
+export function getMishapThreshold(component) {
+    return getDefinitionMishapThreshold(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionMishapThreshold(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.mishapThreshold) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param component
+ */
+export function getDamageThreshold(component) {
+    return getDefinitionDamageThreshold(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionDamageThreshold(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.damageThreshold) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param component
+ */
+export function getMappingDescription(component) {
+    return component.description;
+}
+/**
+ *
+ * @param component
+ */
+export function getDescription(component) {
+    return component.description;
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionDescription(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.description) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param component
+ */
+export function getDisplayOrder(component) {
+    return component.displayOrder;
+}
+/**
+ *
+ * @param component
+ */
+export function getHitPoints(component) {
+    return getDefinitionHitPoints(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionHitPoints(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.hitPoints) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param component
+ */
+export function getIsRemovable(component) {
+    return component.isRemovable;
+}
+/**
+ *
+ * @param component
+ */
+export function getLevelId(component) {
+    return component.levelId;
+}
+/**
+ *
+ * @param component
+ */
+export function getVehicleLevelId(component) {
+    return component.vehicleLevelId;
+}
+/**
+ *
+ * @param component
+ */
+export function getName(component) {
+    var _a;
+    return (_a = component.name) !== null && _a !== void 0 ? _a : getDefinitionName(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionName(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param component
+ */
+export function getSpeedInfos(component) {
+    return component.speedInfos;
+}
+/**
+ *
+ * @param component
+ */
+export function getSpeeds(component) {
+    return getDefinitionSpeeds(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionSpeeds(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.speeds) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param component
+ */
+export function getTypes(component) {
+    return getDefinitionTypes(component);
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionTypes(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.types) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param component
+ */
+export function getId(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : null;
+}
+/**
+ *
+ * @param component
+ */
+export function getMappingId(component) {
+    return component.id;
+}
+/**
+ *
+ * @param component
+ */
+export function getCharacterId(component) {
+    return component.characterId;
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionDefinitionKey(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.definitionKey) !== null && _b !== void 0 ? _b : '';
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionKey(component) {
+    var _a;
+    return (_a = component.definitionKey) !== null && _a !== void 0 ? _a : '';
+}
+/**
+ *
+ * @param component
+ */
+export function getDefinitionActions(component) {
+    var _a, _b;
+    return (_b = (_a = component.definition) === null || _a === void 0 ? void 0 : _a.actions) !== null && _b !== void 0 ? _b : [];
+}
+/**
+ *
+ * @param component
+ */
+export function getIsPrimary(component) {
+    return component.isPrimaryComponent;
+}
+/**
+ *
+ * @param component
+ */
+export function getGroupType(component) {
+    if (component.definition && component.definition.groupType !== null) {
+        const groupType = component.definition
+            .groupType;
+        switch (groupType) {
+            case VehicleComponentGroupTypeEnum.COMPONENT:
+            case VehicleComponentGroupTypeEnum.ACTION_STATION:
+                return groupType;
+            default:
+                TypeScriptUtils.testUnreachable(groupType);
+        }
+    }
+    return VehicleComponentGroupTypeEnum.COMPONENT;
+}
+/**
+ *
+ * @param component
+ */
+export function getUniqueKey(component) {
+    return component.uniqueKey;
+}
+/**
+ *
+ * @param component
+ */
+export function getUniquenessFactor(component) {
+    return component.uniquenessFactor;
+}
+/**
+ *
+ * @param component
+ */
+export function getHitPointSpeedAdjustments(component) {
+    return component.hitPointSpeedAdjustments;
+}
+/**
+ *
+ * @param component
+ */
+export function getHitPointInfo(component) {
+    return component.hitPointInfo;
+}
+/**
+ *
+ * @param component
+ */
+export function getRemovedHitPoints(component) {
+    return component.removedHitPoints;
+}
+/**
+ *
+ * @param component
+ */
+export function getVehicleMappingId(component) {
+    return component.vehicleMappingId;
+}
+/**
+ *
+ * @param component
+ */
+export function getTypeNames(component) {
+    return component.typeNames;
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/VehicleComponent/constants.js b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/constants.js
new file mode 100644
index 0000000..377e5ac
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/constants.js
@@ -0,0 +1,10 @@
+export var ComponentAdjustmentEnum;
+(function (ComponentAdjustmentEnum) {
+    ComponentAdjustmentEnum["HIT_POINT_SPEED_ADJUSTMENT"] = "speed";
+})(ComponentAdjustmentEnum || (ComponentAdjustmentEnum = {}));
+//TODO new for spelljammers
+export var ComponentCostTypeEnum;
+(function (ComponentCostTypeEnum) {
+    ComponentCostTypeEnum["COMPONENT"] = "component";
+    ComponentCostTypeEnum["AMMUNITION"] = "ammunition";
+})(ComponentCostTypeEnum || (ComponentCostTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/engine/VehicleComponent/derivers.js b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/derivers.js
new file mode 100644
index 0000000..73a778b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/derivers.js
@@ -0,0 +1,111 @@
+import { TypeScriptUtils } from '../../utils';
+import { AbilityStatEnum } from '../Core';
+import { HelperUtils } from '../Helper';
+import { RuleDataUtils } from '../RuleData';
+import { VehicleAccessors, VehicleUtils } from '../Vehicle';
+import { VehicleConfigurationKeyEnum, VehicleGenerators } from '../Vehicle';
+import { getArmorClass, getArmorClassDescription, getDefinitionActions, getDefinitionSpeeds, getHitPoints, getRemovedHitPoints, getTypes, } from './accessors';
+import { ComponentAdjustmentEnum } from './constants';
+/**
+ *
+ * @param component
+ * @param vehicle
+ */
+export function deriveArmorClassInfo(component, vehicle) {
+    const enableMotionlessArmorClass = VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_COMPONENT_ARMOR_CLASS_MOTIONLESS, vehicle);
+    const armorClass = getArmorClass(component);
+    let movingArmorClass = null;
+    if (enableMotionlessArmorClass && armorClass !== null) {
+        const dexScore = HelperUtils.lookupDataOrFallback(VehicleAccessors.getStatLookup(vehicle), AbilityStatEnum.DEXTERITY);
+        let dexModifier = 0;
+        if (dexScore !== null && dexScore.modifier !== null) {
+            dexModifier = dexScore.modifier;
+        }
+        movingArmorClass = armorClass + dexModifier;
+    }
+    return {
+        base: armorClass,
+        moving: movingArmorClass,
+        description: getArmorClassDescription(component),
+    };
+}
+/**
+ *
+ * @param component
+ * @param ruleData
+ */
+export function deriveTypeNames(component, ruleData) {
+    return getTypes(component)
+        .map((type) => {
+        if (type.type === null) {
+            return null;
+        }
+        return RuleDataUtils.getComponentTypeName(type.type, ruleData);
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param component
+ * @param ruleData
+ */
+export function deriveSpeedInfos(component, ruleData) {
+    return getDefinitionSpeeds(component).map((speedInfo) => {
+        if (speedInfo.modes === null) {
+            return speedInfo;
+        }
+        const modes = speedInfo.modes.map((mode) => {
+            const movementInfo = mode.movementId === null ? null : RuleDataUtils.getMovementInfo(mode.movementId, ruleData);
+            return Object.assign(Object.assign({}, mode), { movementInfo });
+        });
+        return Object.assign(Object.assign({}, speedInfo), { modes });
+    });
+}
+/**
+ *
+ * @param component
+ */
+export function deriveHitPointInfo(component) {
+    const hitPoints = getHitPoints(component);
+    if (hitPoints === null) {
+        return null;
+    }
+    const removedHp = getRemovedHitPoints(component);
+    return {
+        baseHp: hitPoints,
+        bonusHp: null,
+        overrideHp: null,
+        remainingHp: hitPoints - removedHp,
+        removedHp,
+        tempHp: null,
+        totalHp: hitPoints,
+    };
+}
+/**
+ *
+ * @param component
+ */
+export function deriveHitPointSpeedAdjustments(component) {
+    const adjustments = [];
+    getTypes(component).forEach((type) => {
+        if (type.adjustments) {
+            type.adjustments.forEach((adjustment) => {
+                if (adjustment.type && adjustment.type === ComponentAdjustmentEnum.HIT_POINT_SPEED_ADJUSTMENT) {
+                    if (adjustment.values) {
+                        adjustments.push(...adjustment.values);
+                    }
+                }
+            });
+        }
+    });
+    return adjustments;
+}
+/**
+ *
+ * @param component
+ * @param ruleData
+ * @param vehicle
+ */
+export function deriveActions(component, ruleData, vehicle) {
+    return getDefinitionActions(component).map((actionContract) => VehicleGenerators.generateVehicleAction(vehicle, actionContract, ruleData));
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/VehicleComponent/generators.js b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/generators.js
new file mode 100644
index 0000000..c39171d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/generators.js
@@ -0,0 +1,71 @@
+import { groupBy, keyBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { DefinitionAccessors } from '../Definition';
+import { HelperUtils } from '../Helper';
+import { VehicleAccessors } from '../Vehicle';
+import { getCosts, getDefinitionKey, getMappingId, getName, getTypes, getVehicleMappingId } from './accessors';
+import { deriveActions, deriveArmorClassInfo, deriveHitPointInfo, deriveHitPointSpeedAdjustments, deriveSpeedInfos, deriveTypeNames, } from './derivers';
+/**
+ *
+ * @param components
+ */
+export function generateVehicleComponentLookup(components) {
+    return groupBy(components, (component) => getVehicleMappingId(component));
+}
+/**
+ *
+ * @param component
+ */
+export function generateUniqueKey(component) {
+    const types = getTypes(component).map((type) => (type.type ? type.type : ''));
+    const id = getMappingId(component);
+    return `${id}-${types.join('-')}-${getName(component)}`;
+}
+/**
+ *
+ * @param component
+ */
+export function generateUniquenessFactor(component) {
+    const factors = [];
+    const name = getName(component);
+    if (name) {
+        factors.push(name);
+    }
+    getTypes(component).forEach((type) => {
+        if (type.type) {
+            factors.push(type.type);
+        }
+    });
+    return factors.join('|');
+}
+/**
+ *
+ * @param vehicleMapping
+ * @param vehicle
+ * @param vehicleComponentLookup
+ * @param ruleData
+ */
+export function generateVehicleComponents(vehicleMapping, vehicle, vehicleComponentLookup, ruleData) {
+    const componentDefinitionMappingLookup = keyBy(VehicleAccessors.getDefinitionComponents(vehicle), (componentDefinition) => DefinitionAccessors.getDefinitionKey(componentDefinition));
+    const chracterVehicleComponentMappings = HelperUtils.lookupDataOrFallback(vehicleComponentLookup, VehicleAccessors.getMappingId(vehicleMapping), []);
+    return chracterVehicleComponentMappings
+        .map((componentMapping) => {
+        const componentDefinitionMapping = HelperUtils.lookupDataOrFallback(componentDefinitionMappingLookup, getDefinitionKey(componentMapping), null);
+        return generateVehicleComponent(componentMapping, componentDefinitionMapping, ruleData, vehicle);
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param componentMapping
+ * @param componentDefinitionMapping
+ * @param ruleData
+ * @param vehicle
+ */
+export function generateVehicleComponent(componentMapping, componentDefinitionMapping, ruleData, vehicle) {
+    if (componentDefinitionMapping === null) {
+        return null;
+    }
+    const baseVehicleComponent = Object.assign(Object.assign({}, componentMapping), componentDefinitionMapping);
+    return Object.assign(Object.assign({}, baseVehicleComponent), { armorClassInfo: deriveArmorClassInfo(baseVehicleComponent, vehicle), costs: getCosts(baseVehicleComponent), uniqueKey: generateUniqueKey(baseVehicleComponent), uniquenessFactor: generateUniquenessFactor(baseVehicleComponent), hitPointSpeedAdjustments: deriveHitPointSpeedAdjustments(baseVehicleComponent), actions: deriveActions(baseVehicleComponent, ruleData, vehicle), hitPointInfo: deriveHitPointInfo(baseVehicleComponent), typeNames: deriveTypeNames(baseVehicleComponent, ruleData), speedInfos: deriveSpeedInfos(baseVehicleComponent, ruleData) });
+}
diff --git a/ddb_main/packages/rules-engine/es/engine/VehicleComponent/index.js b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/index.js
new file mode 100644
index 0000000..9df4370
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/index.js
@@ -0,0 +1,10 @@
+import * as VehicleComponentAccessors from './accessors';
+import * as VehicleComponentConstants from './constants';
+import * as VehicleComponentDerivers from './derivers';
+import * as VehicleComponentGenerators from './generators';
+import * as VehicleComponentSimulators from './simulators';
+import * as VehicleComponentTypings from './typings';
+export * from './constants';
+export * from './typings';
+export { VehicleComponentAccessors, VehicleComponentDerivers, VehicleComponentGenerators, VehicleComponentSimulators };
+export default Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, VehicleComponentAccessors), VehicleComponentConstants), VehicleComponentDerivers), VehicleComponentGenerators), VehicleComponentTypings), VehicleComponentSimulators);
diff --git a/ddb_main/packages/rules-engine/es/engine/VehicleComponent/simulators.js b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/simulators.js
new file mode 100644
index 0000000..fe6238c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/engine/VehicleComponent/simulators.js
@@ -0,0 +1,37 @@
+import { keyBy } from 'lodash';
+import { TypeScriptUtils } from '../../utils';
+import { DefinitionAccessors, DefinitionUtils } from '../Definition';
+import { HelperUtils } from '../Helper';
+import { VehicleAccessors } from '../Vehicle';
+import { getCosts, getDefinitionName } from './accessors';
+import { deriveActions, deriveArmorClassInfo, deriveHitPointInfo, deriveHitPointSpeedAdjustments, deriveSpeedInfos, deriveTypeNames, } from './derivers';
+import { generateUniqueKey, generateUniquenessFactor } from './generators';
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function simulateVehicleComponents(vehicle, ruleData) {
+    const definitionComponents = VehicleAccessors.getDefinitionComponents(vehicle);
+    const componentDefinitionLookup = keyBy(definitionComponents, (componentDefinition) => DefinitionAccessors.getDefinitionKey(componentDefinition));
+    return definitionComponents
+        .map((componentMapping) => {
+        const definitionMapping = HelperUtils.lookupDataOrFallback(componentDefinitionLookup, DefinitionAccessors.getDefinitionKey(componentMapping), null);
+        if (definitionMapping === null) {
+            return null;
+        }
+        return simulateVehicleComponent(definitionMapping, vehicle, ruleData);
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+/**
+ *
+ * @param componentDefinitionMapping
+ * @param vehicle
+ * @param ruleData
+ */
+export function simulateVehicleComponent(componentDefinitionMapping, vehicle, ruleData) {
+    const definitionKey = DefinitionAccessors.getDefinitionKey(componentDefinitionMapping);
+    const baseVehicleComponent = Object.assign(Object.assign({}, componentDefinitionMapping), { characterId: -1, id: -1, definitionKey, componentId: DefinitionUtils.getDefinitionKeyId(definitionKey), vehicleLevelId: null, vehicleMappingId: VehicleAccessors.getMappingId(vehicle), name: getDefinitionName(componentDefinitionMapping), removedHitPoints: 0 });
+    return Object.assign(Object.assign({}, baseVehicleComponent), { uniqueKey: generateUniqueKey(baseVehicleComponent), costs: getCosts(baseVehicleComponent), armorClassInfo: deriveArmorClassInfo(baseVehicleComponent, vehicle), uniquenessFactor: generateUniquenessFactor(baseVehicleComponent), hitPointSpeedAdjustments: deriveHitPointSpeedAdjustments(baseVehicleComponent), actions: deriveActions(baseVehicleComponent, ruleData, vehicle), hitPointInfo: deriveHitPointInfo(baseVehicleComponent), typeNames: deriveTypeNames(baseVehicleComponent, ruleData), speedInfos: deriveSpeedInfos(baseVehicleComponent, ruleData) });
+}
diff --git a/ddb_main/packages/rules-engine/es/generated/index.js b/ddb_main/packages/rules-engine/es/generated/index.js
new file mode 100644
index 0000000..9c5db7d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/generated/index.js
@@ -0,0 +1,25 @@
+// shouldn't the above be here, suffixed Contract?
+const _WATERDEEP_ENTITLEMENT_FILTER = '1.1.0';
+const _WATERDEEP_DATA_CONTRACTS = '2.1.0-alpha9.74';
+export const initialChoiceComponentState = {
+    background: [],
+    class: [],
+    feat: [],
+    item: [],
+    race: [],
+    choiceDefinitions: [],
+    definitionKeyNameMap: {},
+};
+export var PremadeInfoStatus;
+(function (PremadeInfoStatus) {
+    PremadeInfoStatus["DRAFT"] = "Draft";
+    PremadeInfoStatus["PUBLISHED"] = "Published";
+    PremadeInfoStatus["ARCHIVED"] = "Archived";
+})(PremadeInfoStatus || (PremadeInfoStatus = {}));
+export var CharacterStatusSlug;
+(function (CharacterStatusSlug) {
+    CharacterStatusSlug["ACTIVE"] = "active";
+    CharacterStatusSlug["DELETED"] = "deleted";
+    CharacterStatusSlug["LOCKED"] = "locked";
+    CharacterStatusSlug["PREMADE"] = "premade";
+})(CharacterStatusSlug || (CharacterStatusSlug = {}));
diff --git a/ddb_main/packages/rules-engine/es/logger/constants.js b/ddb_main/packages/rules-engine/es/logger/constants.js
new file mode 100644
index 0000000..38f36a5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/logger/constants.js
@@ -0,0 +1,7 @@
+export var LogMessageType;
+(function (LogMessageType) {
+    LogMessageType["INFO"] = "INFO";
+    LogMessageType["ERROR"] = "ERROR";
+    LogMessageType["WARNING"] = "WARNING";
+    LogMessageType["CRITICAL"] = "CRITICAL";
+})(LogMessageType || (LogMessageType = {}));
diff --git a/ddb_main/packages/rules-engine/es/logger/utils.js b/ddb_main/packages/rules-engine/es/logger/utils.js
new file mode 100644
index 0000000..859466d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/logger/utils.js
@@ -0,0 +1,26 @@
+import { ConfigUtils } from '../config';
+/**
+ *
+ * @param error
+ * @param contextData
+ */
+export function logError(error, contextData = null) {
+    let config = ConfigUtils.getCurrentRulesEngineConfig();
+    if (config === null || config === void 0 ? void 0 : config.onLogError) {
+        return config.onLogError(error, contextData);
+    }
+    return null;
+}
+/**
+ *
+ * @param message
+ * @param messageType
+ * @param contextData
+ */
+export function logMessage(message, messageType, contextData = null) {
+    let config = ConfigUtils.getCurrentRulesEngineConfig();
+    if (config === null || config === void 0 ? void 0 : config.onLogMessage) {
+        return config.onLogMessage(message, messageType, contextData);
+    }
+    return null;
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/AbilityManager.js b/ddb_main/packages/rules-engine/es/managers/AbilityManager.js
new file mode 100644
index 0000000..fe345a2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/AbilityManager.js
@@ -0,0 +1,93 @@
+import { characterActions } from "../actions";
+import { AbilityAccessors } from "../engine/Ability";
+import { AbilityScoreStatTypeEnum } from "../engine/Core";
+import { HelperUtils } from "../engine/Helper";
+import { RuleDataAccessors } from "../engine/RuleData";
+import { rulesEngineSelectors } from "../selectors";
+import { FeaturesManager } from './FeaturesManager';
+export const abilityDefinitionMap = new Map();
+const abilityMangerMap = new Map();
+export const getAbilityManager = (params) => {
+    const { ability } = params;
+    const abilityId = AbilityAccessors.getId(ability);
+    if (abilityMangerMap.has(abilityId)) {
+        const abilityManager = abilityMangerMap.get(abilityId);
+        if (!abilityManager) {
+            throw new Error(`AbilityManager for ability ${abilityId} is null`);
+        }
+        if (abilityManager.ability === ability) {
+            return abilityManager;
+        }
+    }
+    const newAbilityManager = new AbilityManager(params);
+    abilityMangerMap.set(abilityId, newAbilityManager);
+    return newAbilityManager;
+};
+export class AbilityManager extends FeaturesManager {
+    constructor(params) {
+        super(params);
+        //Accessors
+        this.getId = () => AbilityAccessors.getId(this.ability);
+        this.getEntityTypeId = () => AbilityAccessors.getEntityTypeId(this.ability);
+        this.getName = () => AbilityAccessors.getName(this.ability);
+        this.getLabel = () => AbilityAccessors.getLabel(this.ability);
+        this.getStatKey = () => AbilityAccessors.getStatKey(this.ability);
+        this.getBaseScore = () => AbilityAccessors.getBaseScore(this.ability);
+        this.getTotalScore = () => AbilityAccessors.getTotalScore(this.ability);
+        this.getModifier = () => AbilityAccessors.getModifier(this.ability);
+        this.getMaxStatScore = () => AbilityAccessors.getMaxStatScore(this.ability);
+        this.getProficiencyLevel = () => AbilityAccessors.getProficiencyLevel(this.ability);
+        this.getIsSaveProficiencyModified = () => AbilityAccessors.getIsSaveProficiencyModified(this.ability);
+        this.getSave = () => AbilityAccessors.getSave(this.ability);
+        this.getIsSaveModifierModified = () => AbilityAccessors.getIsSaveModifierModified(this.ability);
+        this.getOverrideScore = () => AbilityAccessors.getOverrideScore(this.ability);
+        this.getOtherBonus = () => AbilityAccessors.getOtherBonus(this.ability);
+        this.getRacialBonus = () => AbilityAccessors.getRacialBonus(this.ability);
+        this.getClassBonuses = () => AbilityAccessors.getClassBonuses(this.ability);
+        this.getMiscBonus = () => AbilityAccessors.getMiscBonus(this.ability);
+        this.getSetScore = () => AbilityAccessors.getSetScore(this.ability);
+        this.getStackingBonus = () => AbilityAccessors.getStackingBonus(this.ability);
+        this.getAllStatBonusSuppliers = () => AbilityAccessors.getAllStatBonusSuppliers(this.ability);
+        this.getStatSetScoreSuppliers = () => AbilityAccessors.getStatSetScoreSuppliers(this.ability);
+        this.getStatMaxBonusSuppliers = () => AbilityAccessors.getStatMaxBonusSuppliers(this.ability);
+        this.getStackingBonusSuppliers = () => AbilityAccessors.getStackingBonusSuppliers(this.ability);
+        //handlers
+        this.handleScoreChange = (value) => {
+            this.dispatch(characterActions.abilityScoreSet(this.getId(), AbilityScoreStatTypeEnum.BASE, value));
+        };
+        this.handleOverrideScoreChange = (value) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const minStatScore = RuleDataAccessors.getMinStatScore(ruleData);
+            const maxStatScore = RuleDataAccessors.getMaxStatScore(ruleData);
+            if (value !== null) {
+                value = HelperUtils.clampInt(value, minStatScore, maxStatScore);
+            }
+            this.dispatch(characterActions.abilityScoreSet(this.getId(), AbilityScoreStatTypeEnum.OVERRIDE, value));
+            return value;
+        };
+        this.handleOtherBonusChange = (value) => {
+            // TODO: lets get a why to this
+            const minBonusScore = -10;
+            const maxBonusScore = 10;
+            if (value !== null) {
+                value = HelperUtils.clampInt(value, minBonusScore, maxBonusScore);
+            }
+            this.dispatch(characterActions.abilityScoreSet(this.getId(), AbilityScoreStatTypeEnum.BONUS, value));
+            return value;
+        };
+        this.params = params;
+        this.ability = params.ability;
+    }
+    //Rule data accessors
+    getAbilityRuleData() {
+        const ruleData = rulesEngineSelectors.getRuleData(this.state);
+        const abilityDataLookup = RuleDataAccessors.getStatsLookup(ruleData);
+        return abilityDataLookup[this.getId()];
+    }
+    getCompendiumText() {
+        const abilityRuleData = this.getAbilityRuleData();
+        // TODO: we should accessor all the things?
+        // maybe gfs will be the time to do it?
+        return abilityRuleData.compendiumText;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/ActionManager.js b/ddb_main/packages/rules-engine/es/managers/ActionManager.js
new file mode 100644
index 0000000..91b33b4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/ActionManager.js
@@ -0,0 +1,127 @@
+import { ActionAccessors } from "../engine/Action";
+import { ActivationRenderers } from "../engine/Activation";
+import { ClassFeatureUtils, ClassUtils, Constants, EntityUtils, HelperUtils, ItemUtils, RuleDataUtils, rulesEngineSelectors, } from "../index";
+import { BaseManager } from './BaseManager';
+export const actionManagerMap = new Map();
+export const getActionManager = (params) => {
+    const { action } = params;
+    const key = action.uniqueKey;
+    if (actionManagerMap.has(key)) {
+        const actionManager = actionManagerMap.get(key);
+        if (!actionManager) {
+            throw new Error(`ActionManager for action ${key} is null`);
+        }
+        if (actionManager.action === action) {
+            return actionManager;
+        }
+    }
+    const newActionManager = new ActionManager(params);
+    actionManagerMap.set(key, newActionManager);
+    return newActionManager;
+};
+export class ActionManager extends BaseManager {
+    constructor(params) {
+        super(params);
+        // Accessors
+        this.getLimitedUse = () => ActionAccessors.getLimitedUse(this.action);
+        this.getName = () => ActionAccessors.getName(this.action);
+        this.getDataOrigin = () => ActionAccessors.getDataOrigin(this.action);
+        this.getDataOriginType = () => ActionAccessors.getDataOriginType(this.action);
+        this.getMappingId = () => ActionAccessors.getMappingId(this.action);
+        this.getMappingEntityTypeId = () => ActionAccessors.getMappingEntityTypeId(this.action);
+        this.getSnippet = () => ActionAccessors.getSnippet(this.action);
+        this.getUniqueKey = () => ActionAccessors.getUniqueKey(this.action);
+        this.getProficiency = () => ActionAccessors.isProficient(this.action);
+        this.getDamage = () => ActionAccessors.getDamage(this.action);
+        this.getRequiresAttackRoll = () => ActionAccessors.requiresAttackRoll(this.action);
+        this.getToHit = () => ActionAccessors.getToHit(this.action);
+        this.getRequiresSavingThrow = () => ActionAccessors.requiresSavingThrow(this.action);
+        this.getSaveStatId = () => ActionAccessors.getSaveStatId(this.action);
+        this.getAttackSaveValue = () => ActionAccessors.getAttackSaveValue(this.action);
+        this.getAttackRangeId = () => ActionAccessors.getAttackRangeId(this.action);
+        this.isOffhand = () => ActionAccessors.isOffhand(this.action);
+        this.getActionTypeId = () => ActionAccessors.getActionTypeId(this.action);
+        this.isCustomized = () => ActionAccessors.isCustomized(this.action);
+        this.getAttackRange = () => ActionAccessors.getRange(this.action);
+        this.getAttackReach = () => ActionAccessors.getReach(this.action);
+        this.getActivation = () => ActionAccessors.getActivation(this.action);
+        // Utils
+        this.getClassLevel = () => ClassUtils.getLevel(this.getDataOrigin().parent); // when CLASS_FEATURE
+        this.getScaleValue = () => ClassFeatureUtils.getLevelScale(this.getDataOrigin().primary); // when CLASS_FEATURE
+        this.getItem = () => {
+            // WHEN ITEM
+            const inventoryLookup = rulesEngineSelectors.getInventoryLookup(this.state);
+            const itemContract = this.getDataOrigin().primary;
+            const itemMappingId = ItemUtils.getMappingId(itemContract);
+            return HelperUtils.lookupDataOrFallback(inventoryLookup, itemMappingId);
+        };
+        this.getMetaItems = () => {
+            const damage = this.getDamage();
+            const attackTypeId = this.getAttackRangeId();
+            let attackType = null;
+            if (attackTypeId) {
+                attackType = RuleDataUtils.getAttackTypeRangeName(attackTypeId);
+            }
+            const isOffhand = this.isOffhand();
+            let combinedMetaItems = [];
+            if (attackType) {
+                combinedMetaItems.push(`${attackType} Attack`);
+            }
+            if (damage.isMartialArts) {
+                combinedMetaItems.push('Martial Arts');
+            }
+            if (damage.value && damage.dataOrigin) {
+                combinedMetaItems.push(EntityUtils.getDataOriginName(damage.dataOrigin));
+            }
+            switch (this.getActionTypeId()) {
+                case Constants.ActionTypeEnum.WEAPON:
+                    if (isOffhand) {
+                        combinedMetaItems.push('Dual Wield');
+                    }
+                    break;
+                default:
+                // not implemented
+            }
+            if (this.isCustomized()) {
+                combinedMetaItems.push('Customized');
+            }
+            return combinedMetaItems;
+        };
+        this.getActionType = (rangeType) => {
+            const actionTypeId = this.getActionTypeId();
+            let actionType = actionTypeId;
+            switch (actionTypeId) {
+                case Constants.ActionTypeEnum.WEAPON:
+                    if (rangeType === Constants.AttackTypeRangeEnum.MELEE) {
+                        actionType = Constants.ActionTypeEnum.GENERAL;
+                    }
+                    break;
+                case Constants.ActionTypeEnum.GENERAL:
+                    if (rangeType === Constants.AttackTypeRangeEnum.MELEE) {
+                        actionType = Constants.ActionTypeEnum.WEAPON;
+                    }
+                    break;
+                case Constants.ActionTypeEnum.SPELL:
+                    break;
+                default:
+                //not implemented
+            }
+            return actionType;
+        };
+        this.getRenderedActivation = () => {
+            let activation = this.getActivation();
+            return activation
+                ? ActivationRenderers.renderActivation(activation, rulesEngineSelectors.getRuleData(this.state))
+                : null;
+        };
+        this.params = params;
+        this.action = params.action;
+    }
+    static getActionManager(key) {
+        const actionManager = actionManagerMap.get(key);
+        if (!actionManager) {
+            throw new Error(`ActionManager for action ${key} is null`);
+        }
+        return actionManager;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/ActionsManager.js b/ddb_main/packages/rules-engine/es/managers/ActionsManager.js
new file mode 100644
index 0000000..548e9be
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/ActionsManager.js
@@ -0,0 +1,86 @@
+import { orderBy } from 'lodash';
+import { RuleDataUtils } from "../engine/RuleData";
+import { Constants } from "../index";
+import { getActionManager } from "./ActionManager";
+import { getActivatableManager } from "./ActivatableManager";
+import { getAttackManager } from "./AttackManager";
+import { MessageManager } from "./MessageManager";
+import { rulesEngineSelectors } from "../selectors";
+export var ActivationGroupKeyEnum;
+(function (ActivationGroupKeyEnum) {
+    ActivationGroupKeyEnum["ACTIONS"] = "ACTIONS";
+    ActivationGroupKeyEnum["BONUS_ACTIONS"] = "BONUS_ACTIONS";
+    ActivationGroupKeyEnum["REACTIONS"] = "REACTIONS";
+    ActivationGroupKeyEnum["OTHER"] = "OTHER";
+})(ActivationGroupKeyEnum || (ActivationGroupKeyEnum = {}));
+export class ActionsManager extends MessageManager {
+    constructor(params) {
+        super(params);
+        this.params = params;
+    }
+    getActions() {
+        const actions = rulesEngineSelectors.getActions(this.state);
+        return actions.map((action) => getActionManager(Object.assign(Object.assign({}, this.params), { action })));
+    }
+    getCustomActions() {
+        const customActions = rulesEngineSelectors.getCustomActions(this.state);
+        return customActions.map((action) => getActionManager(Object.assign(Object.assign({}, this.params), { action })));
+    }
+    getAttacksPerActionInfo() {
+        return rulesEngineSelectors.getAttacksPerActionInfo(this.state);
+    }
+    getAttackGroups() {
+        const attackGroups = {};
+        const attacks = rulesEngineSelectors.getAttacks(this.state);
+        const attackManagers = attacks.map((attack) => getAttackManager(Object.assign(Object.assign({}, this.params), { attack })));
+        attackGroups[ActivationGroupKeyEnum.ACTIONS] = attackManagers.filter((manager) => manager.isActionGroup());
+        attackGroups[ActivationGroupKeyEnum.BONUS_ACTIONS] = attackManagers.filter((manager) => manager.isBonusActionGroup());
+        attackGroups[ActivationGroupKeyEnum.REACTIONS] = attackManagers.filter((manager) => manager.isReactionGroup());
+        attackGroups[ActivationGroupKeyEnum.OTHER] = attackManagers.filter((manager) => manager.isOtherGroup());
+        return attackGroups;
+    }
+    getBasicActions() {
+        const ruleData = rulesEngineSelectors.getRuleData(this.state);
+        return ruleData.basicActions;
+    }
+    getBasicActionGroups() {
+        const basicActionGroups = {};
+        const ruleData = rulesEngineSelectors.getRuleData(this.state);
+        const actionBasicActions = RuleDataUtils.getActivationTypeBasicActions(Constants.ActivationTypeEnum.ACTION, ruleData);
+        const bonusBasicActions = RuleDataUtils.getActivationTypeBasicActions(Constants.ActivationTypeEnum.BONUS_ACTION, ruleData);
+        const reactionBasicActions = RuleDataUtils.getActivationTypeBasicActions(Constants.ActivationTypeEnum.REACTION, ruleData);
+        const otherBasicActions = [
+            ...RuleDataUtils.getActivationTypeBasicActions(Constants.ActivationTypeEnum.NO_ACTION, ruleData),
+            ...RuleDataUtils.getActivationTypeBasicActions(Constants.ActivationTypeEnum.MINUTE, ruleData),
+            ...RuleDataUtils.getActivationTypeBasicActions(Constants.ActivationTypeEnum.HOUR, ruleData),
+            ...RuleDataUtils.getActivationTypeBasicActions(Constants.ActivationTypeEnum.SPECIAL, ruleData),
+        ];
+        basicActionGroups[ActivationGroupKeyEnum.ACTIONS] = ActionsManager.sortBasicActions(actionBasicActions);
+        basicActionGroups[ActivationGroupKeyEnum.BONUS_ACTIONS] = ActionsManager.sortBasicActions(bonusBasicActions);
+        basicActionGroups[ActivationGroupKeyEnum.REACTIONS] = ActionsManager.sortBasicActions(reactionBasicActions);
+        basicActionGroups[ActivationGroupKeyEnum.OTHER] = ActionsManager.sortBasicActions(otherBasicActions);
+        return basicActionGroups;
+    }
+    static sortBasicActions(basicActions) {
+        return orderBy(basicActions, [(basicAction) => basicAction.name], ['asc']);
+    }
+    getActionGroups() {
+        const actionGroups = {};
+        const activatables = rulesEngineSelectors.getActivatables(this.state);
+        const activatableManagers = activatables.map((activatable) => getActivatableManager(Object.assign(Object.assign({}, this.params), { activatable })));
+        actionGroups[ActivationGroupKeyEnum.ACTIONS] = activatableManagers.filter((manager) => manager.isActionGroup());
+        actionGroups[ActivationGroupKeyEnum.BONUS_ACTIONS] = activatableManagers.filter((manager) => manager.isBonusActionGroup());
+        actionGroups[ActivationGroupKeyEnum.REACTIONS] = activatableManagers.filter((manager) => manager.isReactionGroup());
+        actionGroups[ActivationGroupKeyEnum.OTHER] = activatableManagers.filter((manager) => manager.isOtherGroup());
+        return actionGroups;
+    }
+    getRitualSpellGroups() {
+        const ritualSpellGroups = {};
+        const ritualSpells = rulesEngineSelectors.getRitualSpells(this.state);
+        ritualSpellGroups[ActivationGroupKeyEnum.ACTIONS] = [];
+        ritualSpellGroups[ActivationGroupKeyEnum.BONUS_ACTIONS] = [];
+        ritualSpellGroups[ActivationGroupKeyEnum.REACTIONS] = [];
+        ritualSpellGroups[ActivationGroupKeyEnum.OTHER] = ritualSpells;
+        return ritualSpellGroups;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/ActivatableManager.js b/ddb_main/packages/rules-engine/es/managers/ActivatableManager.js
new file mode 100644
index 0000000..ad4d177
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/ActivatableManager.js
@@ -0,0 +1,56 @@
+import { ActionAccessors } from "../engine/Action";
+import { ActivatableTypeEnum } from "../engine/Core";
+import { ActionManager, Constants } from "../index";
+import { BaseManager } from './BaseManager';
+export const activatableManagerMap = new Map();
+export const getActivatableManager = (params) => {
+    const { activatable } = params;
+    const key = activatable.key;
+    if (activatableManagerMap.has(key)) {
+        const activatableManager = activatableManagerMap.get(key);
+        if (!activatableManager) {
+            throw new Error(`ActivatableManager for activatable ${key} is null`);
+        }
+        if (activatableManager.activatable === activatable) {
+            return activatableManager;
+        }
+    }
+    const newActivatableManager = new ActivatableManager(params);
+    activatableManagerMap.set(key, newActivatableManager);
+    return newActivatableManager;
+};
+export class ActivatableManager extends BaseManager {
+    constructor(params) {
+        super(params);
+        // Accessors
+        this.getSortText = () => this.activatable.sortText;
+        this.getType = () => this.activatable.type;
+        this.getActivationType = () => this.activatable.activation.activationType;
+        this.getEntity = () => this.activatable.entity;
+        this.getEntityAsActionManager = () => {
+            const action = this.getEntity();
+            return ActionManager.getActionManager(ActionAccessors.getUniqueKey(action));
+        };
+        // Utils
+        this.isFeature = () => {
+            const type = this.getType();
+            return type !== ActivatableTypeEnum.CLASS_SPELL && type !== ActivatableTypeEnum.CHARACTER_SPELL;
+        };
+        this.isSpell = () => {
+            const type = this.getType();
+            return type === ActivatableTypeEnum.CLASS_SPELL || type === ActivatableTypeEnum.CHARACTER_SPELL;
+        };
+        this.isAction = () => this.getType() === ActivatableTypeEnum.ACTION;
+        this.isActionGroup = () => this.getActivationType() === Constants.ActivationTypeEnum.ACTION && !this.isSpell();
+        this.isBonusActionGroup = () => this.getActivationType() === Constants.ActivationTypeEnum.BONUS_ACTION;
+        this.isReactionGroup = () => this.getActivationType() === Constants.ActivationTypeEnum.REACTION;
+        this.isOtherGroup = () => {
+            const activationType = this.getActivationType();
+            return (activationType !== Constants.ActivationTypeEnum.ACTION &&
+                activationType !== Constants.ActivationTypeEnum.BONUS_ACTION &&
+                activationType !== Constants.ActivationTypeEnum.REACTION);
+        };
+        this.params = params;
+        this.activatable = params.activatable;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/AttackManager.js b/ddb_main/packages/rules-engine/es/managers/AttackManager.js
new file mode 100644
index 0000000..53244d8
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/AttackManager.js
@@ -0,0 +1,107 @@
+import { ActionAccessors } from "../engine/Action";
+import { ItemAccessors, WeaponTypeEnum } from "../engine/Item";
+import { RuleDataUtils } from "../engine/RuleData";
+import { ActionManager, Constants, rulesEngineSelectors, } from "../index";
+import { BaseManager } from './BaseManager';
+export const attackManagerMap = new Map();
+export const getAttackManager = (params) => {
+    const { attack } = params;
+    const key = attack.key;
+    if (attackManagerMap.has(key)) {
+        const attackManager = attackManagerMap.get(key);
+        if (!attackManager) {
+            throw new Error(`AttackManager for attack ${key} is null`);
+        }
+        if (attackManager.attack === attack) {
+            return attackManager;
+        }
+    }
+    const newAttackManager = new AttackManager(params);
+    attackManagerMap.set(key, newAttackManager);
+    return newAttackManager;
+};
+export class AttackManager extends BaseManager {
+    constructor(params) {
+        super(params);
+        // Accessors
+        this.getType = () => this.attack.type;
+        this.getActivation = () => this.attack.activation;
+        this.getData = () => this.attack.data;
+        this.getKey = () => this.attack.key;
+        // Utils
+        this.isActionGroup = () => this.getActivation() === Constants.ActivationTypeEnum.ACTION;
+        this.isBonusActionGroup = () => this.getActivation() === Constants.ActivationTypeEnum.BONUS_ACTION;
+        this.isReactionGroup = () => this.getActivation() === Constants.ActivationTypeEnum.REACTION;
+        this.isOtherGroup = () => {
+            const activationType = this.getActivation();
+            return (activationType !== Constants.ActivationTypeEnum.ACTION &&
+                activationType !== Constants.ActivationTypeEnum.BONUS_ACTION &&
+                activationType !== Constants.ActivationTypeEnum.REACTION);
+        };
+        this.getActionManager = () => {
+            const action = this.getData();
+            return ActionManager.getActionManager(ActionAccessors.getUniqueKey(action));
+        };
+        this.getLeveledSpellManager = (spellsManager) => {
+            const spell = this.getData();
+            return spellsManager.getLeveledSpellManagerBySpell(spell);
+        };
+        this.getItem = () => {
+            return this.getData();
+        };
+        this.getItemActionMeta = () => {
+            const item = this.getItem();
+            const combinedMetaItems = [];
+            const type = ItemAccessors.getType(item);
+            if (type === WeaponTypeEnum.AMMUNITION) {
+                combinedMetaItems.push('Ammunition');
+            }
+            else {
+                const isHexWeapon = ItemAccessors.isHexWeapon(item);
+                const isPactWeapon = ItemAccessors.isPactWeapon(item);
+                const isDedicatedWeapon = ItemAccessors.isDedicatedWeapon(item);
+                if (isHexWeapon || isPactWeapon || isDedicatedWeapon) {
+                    if (isHexWeapon) {
+                        combinedMetaItems.push('Hex Weapon');
+                    }
+                    if (isPactWeapon) {
+                        combinedMetaItems.push('Pact Weapon');
+                    }
+                    if (isDedicatedWeapon) {
+                        combinedMetaItems.push('Dedicated Weapon');
+                    }
+                }
+                else {
+                    const attackType = ItemAccessors.getAttackType(item);
+                    let attackTypeName = '';
+                    if (attackType) {
+                        attackTypeName = RuleDataUtils.getAttackTypeRangeName(attackType);
+                    }
+                    combinedMetaItems.push(`${attackTypeName} Weapon`);
+                }
+            }
+            if (ItemAccessors.isOffhand(item)) {
+                combinedMetaItems.push('Dual Wield');
+            }
+            if (ItemAccessors.isAdamantine(item)) {
+                combinedMetaItems.push('Adamantine');
+            }
+            if (ItemAccessors.isSilvered(item)) {
+                combinedMetaItems.push('Silvered');
+            }
+            if (ItemAccessors.isCustomized(item)) {
+                combinedMetaItems.push('Customized');
+            }
+            if (ItemAccessors.getMasteryName(item)) {
+                combinedMetaItems.push('Mastery');
+            }
+            const metaItems = ItemAccessors.getMetaItems(item);
+            return [...combinedMetaItems, ...metaItems];
+        };
+        this.getWeaponSpellDamageGroups = () => {
+            return rulesEngineSelectors.getWeaponSpellDamageGroups(this.state);
+        };
+        this.params = params;
+        this.attack = params.attack;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/AttributesManager.js b/ddb_main/packages/rules-engine/es/managers/AttributesManager.js
new file mode 100644
index 0000000..8564aba
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/AttributesManager.js
@@ -0,0 +1,68 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { orderBy } from 'lodash';
+import { AbilityAccessors } from "../engine/Ability";
+import { FeatureFlagEnum } from "../engine/FeatureFlagInfo";
+import { characterSelectors, featureFlagInfoSelectors, rulesEngineSelectors } from "../selectors";
+import { getAbilityManager } from './AbilityManager';
+import { FeatureFlagManager } from './FeatureFlagManager';
+// import { BlessingManager, getBlessingManager } from './FeatureManager';
+import { FeaturesManager } from './FeaturesManager';
+import { transformAbilityScores } from './utils/modifierTransformers';
+export class AttributesManager extends FeaturesManager {
+    constructor(params) {
+        super(params);
+        this.getHighestAbilityScore = (abilities) => {
+            let orderedAbilities = orderBy(abilities, [(ability) => ability.getTotalScore(), (ability) => ability.getLabel()], ['desc', 'asc']);
+            return orderedAbilities[0];
+        };
+        this.params = params;
+    }
+    getAbilities() {
+        return __awaiter(this, void 0, void 0, function* () {
+            const abilities = rulesEngineSelectors.getAbilities(this.state);
+            const featureFlagsManager = new FeatureFlagManager(featureFlagInfoSelectors.getFeatureFlagInfo(this.state));
+            const hasAccessToBlessing = featureFlagsManager.getFlag(FeatureFlagEnum.RELEASE_GATE_GFS_BLESSINGS_UI);
+            if (!hasAccessToBlessing) {
+                return abilities.map((ability) => {
+                    return getAbilityManager(Object.assign(Object.assign({}, this.params), { ability }));
+                });
+            }
+            else {
+                // TODO: GFS this is all the wrong place
+                // it should just be
+                // const abilities = getCharacter.abilities ...
+                const validGlobalModifiers = this.getValidGlobalModifiers();
+                const baseStats = characterSelectors.getStats(this.state);
+                const ruleData = rulesEngineSelectors.getRuleData(this.state);
+                const { generatedFeature } = transformAbilityScores(validGlobalModifiers, baseStats, ruleData);
+                // TODO: GFS THERE IS SOME MORE TO DO HERE
+                const characterFeatureManagers = yield this.getCharacterFeatures();
+                // TODO: GFS this should be part of the process and I should just ask for the the object here.
+                const myAbilityState = this.processCharacter(generatedFeature);
+                return abilities.map((ability) => {
+                    var _a, _b, _c, _d, _e, _f;
+                    const name = (_b = (_a = AbilityAccessors.getLabel(ability)) === null || _a === void 0 ? void 0 : _a.toLowerCase()) !== null && _b !== void 0 ? _b : 'The ability with no name';
+                    return getAbilityManager(Object.assign(Object.assign({}, this.params), { ability: Object.assign(Object.assign({}, ability), { maxStatScore: (_c = myAbilityState.attributes[name].max) !== null && _c !== void 0 ? _c : null, modifier: (_d = myAbilityState.attributes[name].modifier) !== null && _d !== void 0 ? _d : null, score: (_e = myAbilityState.attributes[name].value) !== null && _e !== void 0 ? _e : null, totalScore: (_f = myAbilityState.attributes[name].value) !== null && _f !== void 0 ? _f : null }) }));
+                });
+            }
+        });
+    }
+    getAbilitiesWithoutBlessings() {
+        const abilities = rulesEngineSelectors.getAbilities(this.state);
+        return abilities.map((ability) => {
+            return getAbilityManager(Object.assign(Object.assign({}, this.params), { ability }));
+        });
+    }
+    getValidGlobalModifiers() {
+        const validGlobalModifiers = rulesEngineSelectors.getValidGlobalModifiers(this.state);
+        return validGlobalModifiers;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/BaseManager.js b/ddb_main/packages/rules-engine/es/managers/BaseManager.js
new file mode 100644
index 0000000..956dc92
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/BaseManager.js
@@ -0,0 +1,52 @@
+import { getCurrentRulesEngineConfig } from '../config/utils';
+export class BaseManager {
+    constructor(params = {}) {
+        this.randomId = 0; // helpful for debugging
+        this.setState = (newState) => {
+            var _a;
+            const state = newState || ((_a = getCurrentRulesEngineConfig().store) === null || _a === void 0 ? void 0 : _a.getState()) || null;
+            this.state = state;
+        };
+        this.getState = () => this.state || null;
+        this.setDispatch = (newDispatch) => {
+            var _a;
+            const dispatch = newDispatch || ((_a = getCurrentRulesEngineConfig().store) === null || _a === void 0 ? void 0 : _a.dispatch) || null;
+            if (dispatch) {
+                this.dispatch = dispatch;
+            }
+        };
+        this.getDispatch = () => this.dispatch;
+        this.setState(params.state);
+        this.setDispatch(params.dispatch);
+        this.subscribeToStateUpdates(function init() { });
+        // this random id can be used to help debug if there are more than one instance
+        this.randomId = Math.floor(Math.random() * 1000000);
+        this.name = 'BaseManager';
+    }
+    updateState() {
+        const store = getCurrentRulesEngineConfig().store;
+        if (store) {
+            this.setState(store.getState());
+        }
+    }
+    subscribeToStateUpdates(callback) {
+        if (getCurrentRulesEngineConfig().store) {
+            const store = getCurrentRulesEngineConfig().store;
+            if (this.unsubscribe) {
+                this.unsubscribe();
+            }
+            this.unsubscribe = store === null || store === void 0 ? void 0 : store.subscribe(() => {
+                this.setState(store.getState());
+                if (callback) {
+                    callback();
+                }
+            });
+            return this.unsubscribe;
+        }
+        return () => {
+            if (this.unsubscribe) {
+                this.unsubscribe();
+            }
+        };
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/CharacterFeaturesManager.js b/ddb_main/packages/rules-engine/es/managers/CharacterFeaturesManager.js
new file mode 100644
index 0000000..e812c98
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/CharacterFeaturesManager.js
@@ -0,0 +1,186 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { orderBy } from 'lodash';
+import { characterActions } from "../actions";
+import { ApiAdapterUtils } from "../apiAdapter";
+import { CharacterUtils } from "../engine/Character";
+import { FeatAccessors, FeatSimulators } from "../engine/Feat";
+import { HelperUtils } from "../engine/Helper";
+import { featDefinitionMap, getFeatManager } from "./FeatManager";
+import { apiCreatorSelectors, rulesEngineSelectors } from "../selectors";
+import { FeaturesManager } from './FeaturesManager';
+export class CharacterFeaturesManager extends FeaturesManager {
+    constructor(params) {
+        super(params);
+        //TODO GFS THIS!!!!
+        this.getBlessings = () => __awaiter(this, void 0, void 0, function* () {
+            // TODO get the blessings only?
+            /**
+             * this could be on the character obj under blessings key
+             */
+            const blessingManagers = yield this.getCharacterFeatures();
+            this.blessingManagers = blessingManagers;
+            return blessingManagers;
+        });
+        this.getBlessing = (id) => { var _a; return (_a = this.blessingManagers.find((blessing) => id === blessing.getId())) !== null && _a !== void 0 ? _a : null; };
+        // TODO is there value in moving these to hasFeatures and hasBlessings
+        this.hasBlessings = () => __awaiter(this, void 0, void 0, function* () {
+            const blessings = yield this.getBlessings();
+            return blessings.length > 0;
+        });
+        this.hasBlessing = (blessing) => !!this.blessingManagers.find((characterBlessing) => characterBlessing.getId() === blessing.getId());
+        this.handlePreferenceChange = (preferenceKey, value) => {
+            const typedPrefKey = CharacterUtils.getPreferenceKey(preferenceKey);
+            if (typedPrefKey !== null) {
+                this.dispatch(characterActions.preferenceChoose(typedPrefKey, value));
+            }
+        };
+        this.params = params;
+        this.blessingManagers = [];
+    }
+    mapFeatsToManagers(feats) {
+        return feats.map((feat) => getFeatManager(Object.assign(Object.assign({}, this.params), { feat })));
+    }
+    /**
+     * Gets feat managers for all of the feats on the character.
+     */
+    getFeats() {
+        const feats = rulesEngineSelectors.getFeats(this.state);
+        return this.mapFeatsToManagers(feats);
+    }
+    /**
+     * Gets feat managers for all feats except those tagged as being data origin only.
+     */
+    getStandardFeats() {
+        const feats = rulesEngineSelectors.getStandardFeats(this.state);
+        return this.mapFeatsToManagers(feats);
+    }
+    /**
+     * Gets feat managers for feats with the designated primary data origin,
+     * but only for feats that are tagged as being data origin only.
+     * Useful for secret feats that come from Class Features or Racial Traits
+     */
+    getDataOriginOnlyFeatsByPrimary(primaryType, primaryId) {
+        var _a;
+        const lookup = rulesEngineSelectors.getDataOriginOnlyFeatLookup(this.state);
+        const feats = (_a = lookup.byPrimary[primaryType][primaryId]) !== null && _a !== void 0 ? _a : [];
+        return this.mapFeatsToManagers(feats);
+    }
+    /**
+     * Gets feat managers for feats with the designated parent data origin,
+     * but only for feats that are tagged as being data origin only.
+     * Useful for secret feats that come from Backgrounds via Feat Lists
+     */
+    getDataOriginOnlyFeatsByParent(parentType, parentId) {
+        var _a;
+        const lookup = rulesEngineSelectors.getDataOriginOnlyFeatLookup(this.state);
+        const feats = (_a = lookup.byParent[parentType][parentId]) !== null && _a !== void 0 ? _a : [];
+        return this.mapFeatsToManagers(feats);
+    }
+    getFeatLookup() {
+        return HelperUtils.generateNonNullLookup(this.getFeats(), (feat) => feat.getId());
+    }
+    getFeatById(id) {
+        return HelperUtils.lookupDataOrFallback(this.getFeatLookup(), id);
+    }
+    updateFeatShoppe(currentShoppe) {
+        const feats = currentShoppe.map((manager) => {
+            const currentManager = this.getFeatById(manager.getId());
+            if (currentManager) {
+                return currentManager;
+            }
+            else {
+                const featDefinitionContract = featDefinitionMap.get(manager.getId());
+                if (featDefinitionContract) {
+                    const simFeat = FeatSimulators.simulateFeat(featDefinitionContract);
+                    return getFeatManager(Object.assign(Object.assign({}, this.params), { feat: simFeat }));
+                }
+                return manager;
+            }
+        });
+        return feats;
+    }
+    transformLoadedFeats(data) {
+        const feats = data.map((definition) => {
+            featDefinitionMap.set(definition.id, definition);
+            const simFeat = FeatSimulators.simulateFeat(definition);
+            const featManager = this.getFeatById(FeatAccessors.getId(simFeat));
+            return featManager ? featManager : getFeatManager(Object.assign(Object.assign({}, this.params), { feat: simFeat }));
+        });
+        return orderBy(feats, (feat) => feat.getName());
+    }
+    getFeatShoppe(additionalConfig) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const loadFeats = apiCreatorSelectors.makeLoadAvailableFeats(this.state);
+            const response = yield loadFeats(additionalConfig);
+            let data = ApiAdapterUtils.getResponseData(response);
+            if (data) {
+                return this.transformLoadedFeats(data);
+            }
+            return [];
+        });
+    }
+    getBlessingShoppe(additionalConfig) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const blessings = yield this.getFeaturesShoppe({
+                params: {
+                    category: 'blessing',
+                },
+            });
+            return orderBy(blessings, (blessing) => blessing.getName());
+        });
+    }
+    //UTILS
+    // filter to only allow one of each simulated repeatable feat group
+    filterUniqueSimulatedRepeatableFeats(feats, parentFeats) {
+        const tracker = new Set();
+        return feats.filter((feat) => {
+            if (!feat.isSimulatedRepeatableFeat()) {
+                return true;
+            }
+            const repeatableGroupId = feat.getRepeatableGroupId();
+            if (repeatableGroupId !== null) {
+                // find the parent of repeatable feat group
+                const parentFeat = parentFeats.find((f) => f.getId() === repeatableGroupId);
+                // don't include repeatable feats if the parent is not added
+                if (parentFeat === null || parentFeat === void 0 ? void 0 : parentFeat.isSimulatedRepeatableFeat()) {
+                    return parentFeat.getId() === feat.getId();
+                }
+                if (tracker.has(repeatableGroupId)) {
+                    return false;
+                }
+                tracker.add(repeatableGroupId);
+                return true;
+            }
+            return false;
+        });
+    }
+    //get an array of feats that are available to be added to the character
+    getAvailableFeats(feats) {
+        const available = feats.filter((feat) => feat.canAdd());
+        const allRepeatableParentFeats = feats.filter((feat) => feat.isRepeatableFeatParent());
+        return this.filterUniqueSimulatedRepeatableFeats(available, allRepeatableParentFeats);
+    }
+    //get an array of feats that are not available to be added to the character due to prerequisites not being met
+    getUnavailableFeats(feats) {
+        const getUnavailableFeats = feats.filter((feat) => !feat.canAdd());
+        const allRepeatableParentFeats = feats.filter((feat) => feat.isRepeatableFeatParent());
+        return this.filterUniqueSimulatedRepeatableFeats(getUnavailableFeats, allRepeatableParentFeats);
+    }
+    // PREFERENCES
+    getEnforceFeatRules() {
+        const preferences = rulesEngineSelectors.getCharacterPreferences(this.state);
+        return preferences.enforceFeatRules;
+    }
+    setEnforceFeatRules(value) {
+        const preferenceKey = 'enforceFeatRules';
+        this.handlePreferenceChange(preferenceKey, value);
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/CoinManager.js b/ddb_main/packages/rules-engine/es/managers/CoinManager.js
new file mode 100644
index 0000000..98aa068
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/CoinManager.js
@@ -0,0 +1,357 @@
+import { characterActions, serviceDataActions } from '../actions';
+import { ConfigUtils } from '../config';
+import { rulesEngineConfig } from '../config/utils';
+import { ContainerAccessors } from '../engine/Container';
+import { CoreUtils, CURRENCY_VALUE } from '../engine/Core';
+import { DefinitionHacks } from '../engine/Definition';
+import { FormatUtils } from '../engine/Format';
+import { HelperUtils } from '../engine/Helper';
+import { NotificationTypeEnum } from '../notification';
+import { rulesEngineSelectors } from '../selectors';
+import { InventoryManager } from './InventoryManager';
+export class CoinManager extends InventoryManager {
+    constructor(params) {
+        super(params);
+        //Coin Action Handlers
+        this.handleTransaction = ({ coin, containerDefinitionKey, multiplier }, onSuccess, onError) => {
+            var _a, _b;
+            const adjustedCurrency = CoreUtils.getCurrencyTransactionAdjustment(multiplier, coin);
+            const containerLookup = rulesEngineSelectors.getContainerLookup(this.state);
+            const container = HelperUtils.lookupDataOrFallback(containerLookup, containerDefinitionKey);
+            const isEmpty = Object.keys(coin).length === 0;
+            if (!isEmpty && container) {
+                const destinationEntityTypeId = ContainerAccessors.getContainerType(container);
+                const destinationEntityId = ContainerAccessors.getMappingId(container);
+                const currentCoins = this.getContainerCoin(containerDefinitionKey);
+                if (multiplier === 1) {
+                    const validAddCoin = this.calculateAddCoinPayload(currentCoins, coin.cp || 0, coin.ep || 0, coin.gp || 0, coin.pp || 0, coin.sp || 0);
+                    if (!validAddCoin) {
+                        (_a = rulesEngineConfig === null || rulesEngineConfig === void 0 ? void 0 : rulesEngineConfig.onNotification) === null || _a === void 0 ? void 0 : _a.call(rulesEngineConfig, 'Failed to add coins', `The max amount allowed for each currency type is ${FormatUtils.renderLocaleNumber(CURRENCY_VALUE.MAX)}`, NotificationTypeEnum.ERROR);
+                        return;
+                    }
+                }
+                else {
+                    const validRemoveCoin = this.calculateRemoveCoinPayload(currentCoins, coin.cp || 0, coin.ep || 0, coin.gp || 0, coin.pp || 0, coin.sp || 0);
+                    if (!validRemoveCoin) {
+                        (_b = rulesEngineConfig === null || rulesEngineConfig === void 0 ? void 0 : rulesEngineConfig.onNotification) === null || _b === void 0 ? void 0 : _b.call(rulesEngineConfig, 'Failed to remove coins', `The min amount allowed for each currency type is ${FormatUtils.renderLocaleNumber(CURRENCY_VALUE.MIN)}`, NotificationTypeEnum.ERROR);
+                        return;
+                    }
+                }
+                this.dispatch(characterActions.currencyTransactionSet(Object.assign(Object.assign({}, adjustedCurrency), { destinationEntityId: destinationEntityId, destinationEntityTypeId: destinationEntityTypeId }), () => {
+                    typeof onSuccess === 'function' && onSuccess();
+                }, () => {
+                    typeof onError === 'function' && onError();
+                }));
+            }
+        };
+        this.handleCoinSet = ({ coin, containerDefinitionKey }, onSuccess, onError) => {
+            const destinationEntityId = DefinitionHacks.hack__getDefinitionKeyId(containerDefinitionKey);
+            const destinationEntityTypeId = DefinitionHacks.hack__getDefinitionKeyType(containerDefinitionKey);
+            if (destinationEntityId && destinationEntityTypeId) {
+                if (containerDefinitionKey === this.getCharacterContainerDefinitionKey()) {
+                    this.dispatch(characterActions.currenciesSet(coin, destinationEntityTypeId, destinationEntityId));
+                }
+                else if (containerDefinitionKey === this.getPartyEquipmentContainerDefinitionKey()) {
+                    this.dispatch(serviceDataActions.partyCurrenciesSet(coin, destinationEntityTypeId, destinationEntityId, () => {
+                        typeof onSuccess === 'function' && onSuccess();
+                        const data = {};
+                        const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                        this.sendMessage({ data, eventType });
+                    }));
+                }
+            }
+        };
+        this.handleAmountSet = ({ key, amount, containerDefinitionKey }, onSuccess, onError) => {
+            switch (key) {
+                case 'pp':
+                    this.handlePlatinumSet({ amount, containerDefinitionKey }, onSuccess, onError);
+                    break;
+                case 'gp':
+                    this.handleGoldSet({ amount, containerDefinitionKey }, onSuccess, onError);
+                    break;
+                case 'sp':
+                    this.handleSilverSet({ amount, containerDefinitionKey }, onSuccess, onError);
+                    break;
+                case 'ep':
+                    this.handleElectrumSet({ amount, containerDefinitionKey }, onSuccess, onError);
+                    break;
+                case 'cp':
+                    this.handleCopperSet({ amount, containerDefinitionKey }, onSuccess, onError);
+                    break;
+                default:
+                //not implemented
+            }
+        };
+        this.handlePlatinumSet = ({ amount, containerDefinitionKey }, onSuccess, onError) => {
+            const destinationEntityId = DefinitionHacks.hack__getDefinitionKeyId(containerDefinitionKey);
+            const destinationEntityTypeId = DefinitionHacks.hack__getDefinitionKeyType(containerDefinitionKey);
+            if (destinationEntityId && destinationEntityTypeId) {
+                if (containerDefinitionKey === this.getCharacterContainerDefinitionKey()) {
+                    this.dispatch(characterActions.currencyPlatinumSet(amount, destinationEntityTypeId, destinationEntityId));
+                }
+                else if (containerDefinitionKey === this.getPartyEquipmentContainerDefinitionKey()) {
+                    this.dispatch(serviceDataActions.partyCurrencyPlatinumSet(amount, destinationEntityTypeId, destinationEntityId, () => {
+                        typeof onSuccess === 'function' && onSuccess();
+                        const data = {};
+                        const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                        this.sendMessage({ data, eventType });
+                    }));
+                }
+                else {
+                    const isShared = this.isSharedContainerDefinitionKey(containerDefinitionKey);
+                    if (isShared) {
+                        this.dispatch(serviceDataActions.partyItemCurrencyPlatinumSet(amount, destinationEntityTypeId, destinationEntityId, () => {
+                            typeof onSuccess === 'function' && onSuccess();
+                            const data = {};
+                            const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                            this.sendMessage({ data, eventType });
+                        }));
+                    }
+                    else {
+                        this.dispatch(characterActions.itemCurrencyPlatinumSet(amount, destinationEntityTypeId, destinationEntityId));
+                    }
+                }
+            }
+        };
+        this.handleGoldSet = ({ amount, containerDefinitionKey }, onSuccess, onError) => {
+            const destinationEntityId = DefinitionHacks.hack__getDefinitionKeyId(containerDefinitionKey);
+            const destinationEntityTypeId = DefinitionHacks.hack__getDefinitionKeyType(containerDefinitionKey);
+            if (destinationEntityId && destinationEntityTypeId) {
+                if (containerDefinitionKey === this.getCharacterContainerDefinitionKey()) {
+                    this.dispatch(characterActions.currencyGoldSet(amount, destinationEntityTypeId, destinationEntityId));
+                }
+                else if (containerDefinitionKey === this.getPartyEquipmentContainerDefinitionKey()) {
+                    this.dispatch(serviceDataActions.partyCurrencyGoldSet(amount, destinationEntityTypeId, destinationEntityId, () => {
+                        typeof onSuccess === 'function' && onSuccess();
+                        const data = {};
+                        const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                        this.sendMessage({ data, eventType });
+                    }));
+                }
+                else {
+                    const isShared = this.isSharedContainerDefinitionKey(containerDefinitionKey);
+                    if (isShared) {
+                        this.dispatch(serviceDataActions.partyItemCurrencyGoldSet(amount, destinationEntityTypeId, destinationEntityId, () => {
+                            typeof onSuccess === 'function' && onSuccess();
+                            const data = {};
+                            const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                            this.sendMessage({ data, eventType });
+                        }));
+                    }
+                    else {
+                        this.dispatch(characterActions.itemCurrencyGoldSet(amount, destinationEntityTypeId, destinationEntityId));
+                    }
+                }
+            }
+        };
+        this.handleElectrumSet = ({ amount, containerDefinitionKey }, onSuccess, onError) => {
+            const destinationEntityId = DefinitionHacks.hack__getDefinitionKeyId(containerDefinitionKey);
+            const destinationEntityTypeId = DefinitionHacks.hack__getDefinitionKeyType(containerDefinitionKey);
+            if (destinationEntityId && destinationEntityTypeId) {
+                if (containerDefinitionKey === this.getCharacterContainerDefinitionKey()) {
+                    this.dispatch(characterActions.currencyElectrumSet(amount, destinationEntityTypeId, destinationEntityId));
+                }
+                else if (containerDefinitionKey === this.getPartyEquipmentContainerDefinitionKey()) {
+                    this.dispatch(serviceDataActions.partyCurrencyElectrumSet(amount, destinationEntityTypeId, destinationEntityId, () => {
+                        typeof onSuccess === 'function' && onSuccess();
+                        const data = {};
+                        const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                        this.sendMessage({ data, eventType });
+                    }));
+                }
+                else {
+                    const isShared = this.isSharedContainerDefinitionKey(containerDefinitionKey);
+                    if (isShared) {
+                        this.dispatch(serviceDataActions.partyItemCurrencyElectrumSet(amount, destinationEntityTypeId, destinationEntityId, () => {
+                            typeof onSuccess === 'function' && onSuccess();
+                            const data = {};
+                            const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                            this.sendMessage({ data, eventType });
+                        }));
+                    }
+                    else {
+                        this.dispatch(characterActions.itemCurrencyElectrumSet(amount, destinationEntityTypeId, destinationEntityId));
+                    }
+                }
+            }
+        };
+        this.handleSilverSet = ({ amount, containerDefinitionKey }, onSuccess, onError) => {
+            const destinationEntityId = DefinitionHacks.hack__getDefinitionKeyId(containerDefinitionKey);
+            const destinationEntityTypeId = DefinitionHacks.hack__getDefinitionKeyType(containerDefinitionKey);
+            if (destinationEntityId && destinationEntityTypeId) {
+                if (containerDefinitionKey === this.getCharacterContainerDefinitionKey()) {
+                    this.dispatch(characterActions.currencySilverSet(amount, destinationEntityTypeId, destinationEntityId));
+                }
+                else if (containerDefinitionKey === this.getPartyEquipmentContainerDefinitionKey()) {
+                    this.dispatch(serviceDataActions.partyCurrencySilverSet(amount, destinationEntityTypeId, destinationEntityId, () => {
+                        typeof onSuccess === 'function' && onSuccess();
+                        const data = {};
+                        const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                        this.sendMessage({ data, eventType });
+                    }));
+                }
+                else {
+                    const isShared = this.isSharedContainerDefinitionKey(containerDefinitionKey);
+                    if (isShared) {
+                        this.dispatch(serviceDataActions.partyItemCurrencySilverSet(amount, destinationEntityTypeId, destinationEntityId, () => {
+                            typeof onSuccess === 'function' && onSuccess();
+                            const data = {};
+                            const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                            this.sendMessage({ data, eventType });
+                        }));
+                    }
+                    else {
+                        this.dispatch(characterActions.itemCurrencySilverSet(amount, destinationEntityTypeId, destinationEntityId));
+                    }
+                }
+            }
+        };
+        this.handleCopperSet = ({ amount, containerDefinitionKey }, onSuccess, onError) => {
+            const destinationEntityId = DefinitionHacks.hack__getDefinitionKeyId(containerDefinitionKey);
+            const destinationEntityTypeId = DefinitionHacks.hack__getDefinitionKeyType(containerDefinitionKey);
+            if (destinationEntityId && destinationEntityTypeId) {
+                if (containerDefinitionKey === this.getCharacterContainerDefinitionKey()) {
+                    this.dispatch(characterActions.currencyCopperSet(amount, destinationEntityTypeId, destinationEntityId));
+                }
+                else if (containerDefinitionKey === this.getPartyEquipmentContainerDefinitionKey()) {
+                    this.dispatch(serviceDataActions.partyCurrencyCopperSet(amount, destinationEntityTypeId, destinationEntityId, () => {
+                        typeof onSuccess === 'function' && onSuccess();
+                        const data = {};
+                        const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                        this.sendMessage({ data, eventType });
+                    }));
+                }
+                else {
+                    const isShared = this.isSharedContainerDefinitionKey(containerDefinitionKey);
+                    if (isShared) {
+                        this.dispatch(serviceDataActions.partyItemCurrencyCopperSet(amount, destinationEntityTypeId, destinationEntityId, () => {
+                            typeof onSuccess === 'function' && onSuccess();
+                            const data = {};
+                            const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                            this.sendMessage({ data, eventType });
+                        }));
+                    }
+                    else {
+                        this.dispatch(characterActions.itemCurrencyCopperSet(amount, destinationEntityTypeId, destinationEntityId));
+                    }
+                }
+            }
+        };
+        // Validators
+        this.canAddCoin = (coin, containerDefinitionKey) => {
+            const containerLookup = rulesEngineSelectors.getContainerLookup(this.state);
+            const container = HelperUtils.lookupDataOrFallback(containerLookup, containerDefinitionKey);
+            const isShared = container ? ContainerAccessors.isShared(container) : false;
+            if (isShared && this.isSharingTurnedDeleteOnly()) {
+                return false;
+            }
+            return true;
+        };
+        this.canRemoveCoin = (coin, containerDefinitionKey) => {
+            const containerLookup = rulesEngineSelectors.getContainerLookup(this.state);
+            const container = HelperUtils.lookupDataOrFallback(containerLookup, containerDefinitionKey);
+            const isShared = container ? ContainerAccessors.isShared(container) : false;
+            if (isShared && this.isSharingTurnedDeleteOnly()) {
+                let hasNegatives = Object.values(coin).some((value) => value < 0);
+                return !hasNegatives;
+            }
+            return true;
+        };
+        this.canUseCointainers = () => {
+            const rulesEngineConfig = ConfigUtils.getCurrentRulesEngineConfig();
+            const preferences = rulesEngineSelectors.getPreferences(this.state);
+            return !!((preferences === null || preferences === void 0 ? void 0 : preferences.enableContainerCurrency) && (rulesEngineConfig === null || rulesEngineConfig === void 0 ? void 0 : rulesEngineConfig.canUseCurrencyContainers));
+        };
+        //Utils
+        this.getTotalContainerCoinInGold = (containerDefinitionKey) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const coin = this.getContainerCoin(containerDefinitionKey);
+            return coin ? CoreUtils.convertTotalCoinToGold(coin, ruleData) : 0;
+        };
+        this.getContainerCoin = (containerDefinitionKey) => {
+            const containerLookup = rulesEngineSelectors.getContainerLookup(this.state);
+            const container = HelperUtils.lookupDataOrFallback(containerLookup, containerDefinitionKey);
+            return container ? ContainerAccessors.getCoin(container) : null;
+        };
+        this.getAllPartyCoin = () => {
+            const partyContainers = rulesEngineSelectors.getPartyInventoryContainers(this.state);
+            return partyContainers.reduce((acc, container) => {
+                const containerCoin = ContainerAccessors.getCoin(container);
+                return containerCoin
+                    ? {
+                        cp: containerCoin.cp ? acc.cp + containerCoin.cp : acc.cp,
+                        sp: containerCoin.sp ? acc.sp + containerCoin.sp : acc.sp,
+                        ep: containerCoin.ep ? acc.ep + containerCoin.ep : acc.ep,
+                        gp: containerCoin.gp ? acc.gp + containerCoin.gp : acc.gp,
+                        pp: containerCoin.pp ? acc.pp + containerCoin.pp : acc.pp,
+                    }
+                    : acc;
+            }, { cp: 0, sp: 0, ep: 0, gp: 0, pp: 0 });
+        };
+        this.getAllCharacterCoin = () => {
+            const characterContainers = rulesEngineSelectors.getCharacterInventoryContainers(this.state);
+            return characterContainers.reduce((acc, container) => {
+                const containerCoin = ContainerAccessors.getCoin(container);
+                return containerCoin
+                    ? {
+                        cp: containerCoin.cp ? acc.cp + containerCoin.cp : acc.cp,
+                        sp: containerCoin.sp ? acc.sp + containerCoin.sp : acc.sp,
+                        ep: containerCoin.ep ? acc.ep + containerCoin.ep : acc.ep,
+                        gp: containerCoin.gp ? acc.gp + containerCoin.gp : acc.gp,
+                        pp: containerCoin.pp ? acc.pp + containerCoin.pp : acc.pp,
+                    }
+                    : acc;
+            }, { cp: 0, sp: 0, ep: 0, gp: 0, pp: 0 });
+        };
+    }
+    calculateAddCoinPayload(currentCoins, copper, electrum, gold, platinum, silver) {
+        const cp = copper !== 0 ? this.calculateModifiedMaxValue(currentCoins === null || currentCoins === void 0 ? void 0 : currentCoins.cp, copper) : 0;
+        const ep = electrum !== 0 ? this.calculateModifiedMaxValue(currentCoins === null || currentCoins === void 0 ? void 0 : currentCoins.ep, electrum) : 0;
+        const gp = gold !== 0 ? this.calculateModifiedMaxValue(currentCoins === null || currentCoins === void 0 ? void 0 : currentCoins.gp, gold) : 0;
+        const pp = platinum !== 0 ? this.calculateModifiedMaxValue(currentCoins === null || currentCoins === void 0 ? void 0 : currentCoins.pp, platinum) : 0;
+        const sp = silver !== 0 ? this.calculateModifiedMaxValue(currentCoins === null || currentCoins === void 0 ? void 0 : currentCoins.sp, silver) : 0;
+        return this.calculateCoinPayload(cp, ep, gp, pp, sp);
+    }
+    calculateRemoveCoinPayload(currentCoins, copper, electrum, gold, platinum, silver) {
+        const cp = copper !== 0 ? this.calculateModifiedMinValue(currentCoins === null || currentCoins === void 0 ? void 0 : currentCoins.cp, copper) : 0;
+        const ep = electrum !== 0 ? this.calculateModifiedMinValue(currentCoins === null || currentCoins === void 0 ? void 0 : currentCoins.ep, electrum) : 0;
+        const gp = gold !== 0 ? this.calculateModifiedMinValue(currentCoins === null || currentCoins === void 0 ? void 0 : currentCoins.gp, gold) : 0;
+        const pp = platinum !== 0 ? this.calculateModifiedMinValue(currentCoins === null || currentCoins === void 0 ? void 0 : currentCoins.pp, platinum) : 0;
+        const sp = silver !== 0 ? this.calculateModifiedMinValue(currentCoins === null || currentCoins === void 0 ? void 0 : currentCoins.sp, silver) : 0;
+        return this.calculateCoinPayload(cp, ep, gp, pp, sp);
+    }
+    calculateCoinPayload(cp, ep, gp, pp, sp) {
+        const coinPayload = {};
+        if (cp === null || ep === null || gp === null || pp === null || sp === null)
+            return null;
+        if (cp !== 0)
+            coinPayload.cp = cp;
+        if (ep !== 0)
+            coinPayload.ep = ep;
+        if (gp !== 0)
+            coinPayload.gp = gp;
+        if (pp !== 0)
+            coinPayload.pp = pp;
+        if (sp !== 0)
+            coinPayload.sp = sp;
+        return coinPayload;
+    }
+    calculateModifiedMinValue(baseValue, value) {
+        const result = (baseValue || 0) - value;
+        if (result >= CURRENCY_VALUE.MIN) {
+            return value;
+        }
+        else {
+            return null;
+        }
+    }
+    calculateModifiedMaxValue(baseValue, value) {
+        const result = (baseValue || 0) + value;
+        if (result <= CURRENCY_VALUE.MAX) {
+            return value;
+        }
+        else {
+            return null;
+        }
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/ContainerManager.js b/ddb_main/packages/rules-engine/es/managers/ContainerManager.js
new file mode 100644
index 0000000..1847c00
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/ContainerManager.js
@@ -0,0 +1,163 @@
+import { sortBy } from 'lodash';
+import { SourceUtils } from "../engine/Source";
+import { TypeScriptUtils } from "../utils";
+import { ContainerAccessors, ContainerUtils, ContainerValidators } from '../engine/Container';
+import { ItemUtils, ItemAccessors } from '../engine/Item';
+import { rulesEngineSelectors } from '../selectors';
+import { getItemManager } from './ItemManager';
+import { MessageManager } from './MessageManager';
+import * as FilterUtils from './utils/Filter';
+const containerManagerMap = new Map();
+export const getContainerManager = (params) => {
+    const { container } = params;
+    const containerId = ContainerAccessors.getDefinitionKey(container);
+    if (containerManagerMap.has(containerId)) {
+        const containerManager = containerManagerMap.get(containerId);
+        if (!containerManager) {
+            throw new Error(`ContainerManager for container ${containerId} is null`);
+        }
+        if (containerManager.container === container) {
+            return containerManager;
+        }
+    }
+    const newContainerManger = new ContainerManager(params);
+    containerManagerMap.set(containerId, newContainerManger);
+    return newContainerManger;
+};
+export class ContainerManager extends MessageManager {
+    constructor(params) {
+        super(params);
+        this.getContainerItem = () => {
+            const item = ContainerAccessors.getItem(this.container);
+            return item ? this.generateItemManager(item) : null;
+        };
+        this.getFilteredItems = (filterOptions, items) => {
+            const { filterTypes = [], filterQuery = '', filterProficient = false, filterBasic = false, filterMagic = false, filterContainer = false, filterSourceCategories = [], } = filterOptions;
+            return items.filter((item) => {
+                if (filterSourceCategories.length !== 0) {
+                    const itemSourceCategories = ItemUtils.getAllSourceCategoryIds(item);
+                    if (!filterSourceCategories.some((id) => itemSourceCategories.includes(id))) {
+                        return false;
+                    }
+                }
+                if (filterProficient &&
+                    (ItemUtils.isWeaponContract(item) || ItemUtils.isArmorContract(item)) &&
+                    !item.proficiency) {
+                    return false;
+                }
+                let filterType = ItemAccessors.getDefintionFilterType(item);
+                if (filterTypes.length !== 0 && filterType !== null && !filterTypes.includes(filterType)) {
+                    return false;
+                }
+                let searchTags = [];
+                if (ItemUtils.isGearContract(item)) {
+                    let subType = ItemAccessors.getSubType(item);
+                    if (subType) {
+                        searchTags.push(subType);
+                    }
+                }
+                if (filterQuery !== '' &&
+                    !FilterUtils.doesQueryMatchData(filterQuery, ItemAccessors.getName(item), searchTags)) {
+                    return false;
+                }
+                if (filterMagic && !filterBasic && !ItemAccessors.isMagic(item)) {
+                    return false;
+                }
+                if (filterBasic && !filterMagic && ItemAccessors.isMagic(item)) {
+                    return false;
+                }
+                if (filterContainer && !filterBasic && !filterMagic && !ItemAccessors.isContainer(item)) {
+                    return false;
+                }
+                return true;
+            });
+        };
+        // get the items from a list of items...
+        // this logic needs to be consolidated in the incentory manager via
+        // the filter logic
+        /**
+         * TODO IMS: filtering and sorting as params then no need to inventory to be passed
+         * @returns Array<ItemManager>
+         */
+        this.getInventoryItems = (controls) => {
+            const { filteredInventory = null, includeContainer = false, filterOptions = {
+                filterTypes: [],
+                filterQuery: '',
+                filterProficient: false,
+                filterBasic: false,
+                filterMagic: false,
+                filterContainer: false,
+                filterSourceCategories: [],
+            }, paginationOptions = {
+                currentPage: 0,
+                pageSize: null,
+            }, isShoppe, } = controls || {};
+            const { currentPage = 0, pageSize = null } = paginationOptions || {};
+            const allItems = rulesEngineSelectors.getAllInventoryItems(this.state);
+            const items = this.overrideItems
+                ? this.overrideItems
+                : ContainerUtils.getInventoryItems(this.container, filteredInventory ? filteredInventory : allItems);
+            if (includeContainer) {
+                const containerItem = ContainerAccessors.getItem(this.container);
+                if (containerItem) {
+                    items.push(containerItem);
+                }
+            }
+            let filteredItems = filterOptions ? this.getFilteredItems(filterOptions, items) : items;
+            if (isShoppe) {
+                filteredItems = sortBy(filteredItems, [
+                    (item) => ItemUtils.getRarityLevel(item),
+                    (item) => ItemAccessors.getName(item),
+                ]);
+            }
+            else {
+                filteredItems = ItemUtils.sortInventoryItems(filteredItems, includeContainer);
+            }
+            let paginatedItems = pageSize === null ? filteredItems : filteredItems.slice(0, (currentPage + 1) * pageSize);
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const activeSourceCategories = rulesEngineSelectors.getActiveSourceCategories(this.state);
+            const itemDefinitions = items
+                .map((item) => ItemAccessors.getDefinition(item))
+                .filter(TypeScriptUtils.isNotNullOrUndefined);
+            const sourceCategories = SourceUtils.getSimpleSourceCategoriesData(itemDefinitions, ruleData, activeSourceCategories);
+            return {
+                items: paginatedItems.map((item) => this.generateItemManager(item)),
+                totalItems: filteredItems.length,
+                sourceCategories,
+            };
+        };
+        this.getInventoryItemsCount = () => {
+            return rulesEngineSelectors.getAllInventoryItems(this.state).length;
+        };
+        // TODO should we make a new one that has coin? or rework the current one?
+        // generateCoinManager = () => {
+        //     return new CoinManager()
+        // }
+        // Accessors
+        this.getDefinitionKey = () => ContainerAccessors.getDefinitionKey(this.container);
+        this.getMappingId = () => ContainerAccessors.getMappingId(this.container);
+        this.getName = () => ContainerAccessors.getName(this.container);
+        this.isShared = () => ContainerAccessors.isShared(this.container);
+        this.getWeightInfo = () => ContainerAccessors.getWeightInfo(this.container);
+        this.isEquipped = () => ContainerAccessors.isEquipped(this.container);
+        this.hasInfusions = () => ContainerAccessors.hasInfusions(this.container);
+        this.getCoin = () => ContainerAccessors.getCoin(this.container);
+        // Validators
+        this.isCharacterContainer = () => ContainerValidators.isCharacterContainer(this.container);
+        this.isSharedOtherContainerDefinitionKey = (otherContainerDefinitionKey) => {
+            const containerLookup = rulesEngineSelectors.getContainerLookup(this.state);
+            return ContainerValidators.validateIsShared(otherContainerDefinitionKey, containerLookup);
+        };
+        this.params = params;
+        this.container = params.container;
+        this.overrideItems = (params === null || params === void 0 ? void 0 : params.overrideItems) || null;
+    }
+    generateItemManager(item) {
+        return getItemManager(Object.assign(Object.assign({}, this.params), { container: this, item }));
+    }
+}
+// Static Helpers ... not sure I like this but this might be better?
+ContainerManager.isSharedContainerDefinitionKey = (state, containerDefinitionKey) => {
+    const containerLookup = rulesEngineSelectors.getContainerLookup(state);
+    return ContainerValidators.validateIsShared(containerDefinitionKey, containerLookup);
+};
diff --git a/ddb_main/packages/rules-engine/es/managers/ExtraManager.js b/ddb_main/packages/rules-engine/es/managers/ExtraManager.js
new file mode 100644
index 0000000..dce0b63
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/ExtraManager.js
@@ -0,0 +1,184 @@
+import { CreatureSimulators } from "../engine/Creature";
+import { DefinitionGenerators } from "../engine/Definition";
+import { DefinitionPoolUtils } from "../engine/DefinitionPool";
+import { HelperUtils } from "../engine/Helper";
+import { RuleDataUtils } from "../engine/RuleData";
+import { VehicleSimulators } from "../engine/Vehicle";
+import { TypeScriptUtils } from "../utils";
+import { characterActions, serviceDataActions } from '../actions';
+import { ExtraAccessors, ExtraUtils } from '../engine/Extra';
+import { rulesEngineSelectors, serviceDataSelectors } from '../selectors';
+import { BaseManager } from './BaseManager';
+import { getVehicleManager } from './VehicleManager';
+const extraManagerMap = new Map();
+export const getExtraManager = (params) => {
+    const { extra } = params;
+    const extraId = ExtraAccessors.getId(extra);
+    if (extraManagerMap.has(extraId)) {
+        const extraManager = extraManagerMap.get(extraId);
+        if (!extraManager) {
+            throw new Error(`ExtraManager for extra ${extraId} is null`);
+        }
+        if (extraManager.extra === extra) {
+            return extraManager;
+        }
+    }
+    const newExtraManger = new ExtraManager(params);
+    extraManagerMap.set(extraId, newExtraManger);
+    return newExtraManger;
+};
+export class ExtraManager extends BaseManager {
+    constructor(params) {
+        super(params);
+        //Handlers
+        this.handleAcceptOnSuccess = (onSuccess) => {
+            return () => {
+                typeof onSuccess === 'function' && onSuccess();
+            };
+        };
+        this.handleRejectOnError = (onError) => {
+            return () => {
+                typeof onError === 'function' && onError();
+            };
+        };
+        this.handleAdd = ({ quantity, selectedGroup }, onSuccess, onError) => {
+            var _a;
+            const extraId = this.getId();
+            if (this.isCreature()) {
+                if (selectedGroup && typeof extraId === 'number') {
+                    let names = [];
+                    if (quantity > 1) {
+                        for (let i = 1; i <= quantity; i++) {
+                            names.push(`${this.getName()} ${i}`);
+                        }
+                    }
+                    else {
+                        names.push(null);
+                    }
+                    this.dispatch(characterActions.creatureCreate(selectedGroup, extraId, names, this.handleAcceptOnSuccess(onSuccess)));
+                }
+            }
+            else if (this.isVehicle()) {
+                if (typeof extraId === 'string') {
+                    this.dispatch(serviceDataActions.vehicleMappingCreate(extraId, (_a = this.getName()) !== null && _a !== void 0 ? _a : 'Vehicle', this.handleAcceptOnSuccess(onSuccess)));
+                }
+            }
+        };
+        this.handleRemove = (onSuccess, onError) => {
+            const mappingId = this.getMappingId();
+            if (this.isCreature()) {
+                this.dispatch(characterActions.creatureRemove(mappingId));
+            }
+            else if (this.isVehicle()) {
+                this.getExtraData().handleRemove();
+            }
+        };
+        this.handleSetActive = ({ isActive }, onSuccess, onError) => {
+            this.dispatch(characterActions.creatureActiveSet(this.getMappingId(), isActive));
+        };
+        this.getExtraData = () => {
+            if (this.isCreature()) {
+                //this lookup is only creatures mapped to the character
+                const creatureLookup = rulesEngineSelectors.getCreatureLookup(this.state);
+                return ExtraUtils.getTypedExtra(this.extra, creatureLookup);
+            }
+            else if (this.isVehicle()) {
+                //this lookup is only vehicles mapped to the character
+                const vehicleLookup = rulesEngineSelectors.getVehicleLookup(this.state);
+                const vehicle = ExtraUtils.getTypedExtra(this.extra, vehicleLookup);
+                if (vehicle === null) {
+                    return null;
+                }
+                return getVehicleManager({ vehicle });
+            }
+            else {
+                return null;
+            }
+        };
+        //TODO this could probably use some clean up and not have to pass in the lookup etc. maybe make the lookup as a selector? or put creatures in the definitionPool?
+        this.simulateExtraData = (groupId, creatureLookup) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            if (this.isCreature()) {
+                const definition = HelperUtils.lookupDataOrFallback(creatureLookup !== null && creatureLookup !== void 0 ? creatureLookup : {}, this.getId());
+                if (!definition || groupId === null) {
+                    return null;
+                }
+                return CreatureSimulators.simulateCreature(definition, groupId, ruleData);
+            }
+            else if (this.isVehicle()) {
+                const definitionPool = serviceDataSelectors.getDefinitionPool(this.state);
+                const type = this.getType();
+                if (!type) {
+                    return null;
+                }
+                const vehicleDefinitionKey = DefinitionGenerators.generateDefinitionKey(type, String(this.getId()));
+                const vehicleDefinition = DefinitionPoolUtils.getVehicleDefinition(vehicleDefinitionKey, definitionPool);
+                if (!vehicleDefinition) {
+                    return null;
+                }
+                const vehicle = VehicleSimulators.simulateVehicle(vehicleDefinition, definitionPool, ruleData);
+                if (vehicle === null) {
+                    return null;
+                }
+                return getVehicleManager({
+                    vehicle,
+                });
+            }
+            else {
+                return null;
+            }
+        };
+        //Utils
+        this.getSourceNames = () => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            //TODO could/should use SourceUtils.getSourceFullNames
+            const sources = this.getSources();
+            return sources
+                .map((sourceMapping) => RuleDataUtils.getSourceDataInfo(sourceMapping.sourceId, ruleData))
+                .filter(TypeScriptUtils.isNotNullOrUndefined)
+                .map((sourceDataInfo) => sourceDataInfo.description)
+                .filter(TypeScriptUtils.isNotNullOrUndefined);
+        };
+        this.getEnvironmentNames = () => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            let names = [];
+            this.getEnvironments().forEach((id) => {
+                const name = RuleDataUtils.getEnvironmentName(id, ruleData);
+                if (name !== '') {
+                    names.push(name);
+                }
+            });
+            return names;
+        };
+        //Accessors
+        this.isCreature = () => ExtraUtils.isCreature(this.extra);
+        this.isVehicle = () => ExtraUtils.isVehicle(this.extra);
+        this.getName = () => ExtraAccessors.getName(this.extra);
+        this.getSources = () => ExtraAccessors.getSources(this.extra);
+        this.isHomebrew = () => ExtraAccessors.isHomebrew(this.extra);
+        this.getMetaText = () => ExtraAccessors.getMetaText(this.extra);
+        this.getUniqueKey = () => ExtraAccessors.getUniqueKey(this.extra);
+        this.getGroupId = () => ExtraAccessors.getGroupId(this.extra);
+        this.getId = () => ExtraAccessors.getId(this.extra);
+        this.getMappingId = () => ExtraAccessors.getMappingId(this.extra);
+        this.getTags = () => ExtraAccessors.getTags(this.extra);
+        this.getEnvironments = () => ExtraAccessors.getEnvironments(this.extra);
+        this.getMovementNames = () => ExtraAccessors.getMovementNames(this.extra);
+        this.getMovementInfo = () => ExtraAccessors.getMovementInfo(this.extra);
+        this.getFilterTypes = () => ExtraAccessors.getFilterTypes(this.extra);
+        this.getSearchTags = () => ExtraAccessors.getSearchTags(this.extra);
+        this.getSizeInfo = () => ExtraAccessors.getSizeInfo(this.extra);
+        this.getType = () => ExtraAccessors.getType(this.extra);
+        this.getHitPointInfo = () => ExtraAccessors.getHitPointInfo(this.extra);
+        this.getArmorClassInfo = () => ExtraAccessors.getArmorClassInfo(this.extra);
+        this.getAvatarUrl = () => ExtraAccessors.getAvatarUrl(this.extra);
+        this.getNoteComponents = () => ExtraAccessors.getNoteComponents(this.extra);
+        this.getExtraType = () => ExtraAccessors.getExtraType(this.extra);
+        this.isCustomized = () => ExtraAccessors.isCustomized(this.extra);
+        this.params = params;
+        this.extra = params.extra;
+        if (!this.extra) {
+            throw new Error('constructed without Extra');
+        }
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/ExtrasManager.js b/ddb_main/packages/rules-engine/es/managers/ExtrasManager.js
new file mode 100644
index 0000000..fb633f5
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/ExtrasManager.js
@@ -0,0 +1,337 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { groupBy } from 'lodash';
+import * as ApiAdapterUtils from "../apiAdapter/utils";
+import { CreatureRuleUtils } from "../engine/CreatureRule";
+import { DefinitionTypeEnum } from "../engine/Definition";
+import { DefinitionPoolUtils } from "../engine/DefinitionPool";
+import { TypeScriptUtils } from "../utils";
+import { characterActions, serviceDataActions } from '../actions';
+import { CreatureAccessors, CreatureGroupFlagEnum, CreatureSimulators, DB_STRING_GROUP_SIDEKICK, DB_STRING_TAG_SIDEKICK, } from '../engine/Creature';
+import { ExtraAccessors, ExtraGenerators, ExtraUtils, HACK_VEHICLE_GROUP_ID, } from '../engine/Extra';
+import { RuleDataGenerators, RuleDataUtils } from '../engine/RuleData';
+import { VehicleSimulators } from '../engine/Vehicle';
+import { apiCreatorSelectors, rulesEngineSelectors, serviceDataSelectors } from '../selectors';
+import { getExtraManager } from './ExtraManager';
+import { MessageManager } from './MessageManager';
+export class ExtrasManager extends MessageManager {
+    constructor(params) {
+        super(params);
+        //Shoppe
+        //TODO optimize to not make api calls when updates are called (see FeatShoppe)
+        this.getExtrasShoppe = ({ groupId, onSuccess, additionalConfig, }) => __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            const loadAvailableMonsters = apiCreatorSelectors.makeLoadAvailableMonsters(this.state);
+            const loadAvailableVehicles = apiCreatorSelectors.makeLoadAvailableVehicles(this.state);
+            const monsterResponse = (yield loadAvailableMonsters(additionalConfig));
+            const vehicleResponse = yield loadAvailableVehicles(additionalConfig);
+            // forced to do any because of stupid typings - pulled from ExtraManagePane - fix it eventually?
+            const monsterResponseDefinitions = (_a = ApiAdapterUtils.getResponseData(monsterResponse)) !== null && _a !== void 0 ? _a : [];
+            const vehicleResponseDefinitions = ApiAdapterUtils.getResponseData(vehicleResponse);
+            const transformedCreatures = groupId !== null ? this.transformLoadedCreatures(monsterResponseDefinitions, groupId) : [];
+            if (vehicleResponseDefinitions !== null && vehicleResponseDefinitions.definitionData.length > 0) {
+                this.dispatch(serviceDataActions.definitionPoolAdd(vehicleResponseDefinitions.definitionData, vehicleResponseDefinitions.accessTypes));
+            }
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const definitionPool = serviceDataSelectors.getDefinitionPool(this.state);
+            const vehicleDefinitions = DefinitionPoolUtils.getTypedDefinitionList(DefinitionTypeEnum.VEHICLE, definitionPool);
+            let vehicles = vehicleDefinitions
+                .map((vehicleDef) => VehicleSimulators.simulateVehicle(vehicleDef, definitionPool, ruleData))
+                .filter(TypeScriptUtils.isNotNullOrUndefined)
+                .map((vehicle) => this.generateVehicleExtraManager(vehicle));
+            //TODO should this be something we store somehwere other than the shoppe?
+            const creatureDefinitionLookup = monsterResponseDefinitions.reduce((lookup, definition) => {
+                const id = definition.id;
+                lookup[id] = definition;
+                return lookup;
+            }, {});
+            const shoppeState = {
+                creatureDefinitionLookup,
+                creatureDefinitions: monsterResponseDefinitions,
+                creatures: transformedCreatures.map((creature) => this.generateCreatureExtraManager(creature)),
+                vehicles,
+            };
+            onSuccess(shoppeState);
+            return shoppeState;
+        });
+        //Update Shoppe with a selected group
+        this.updateExtrasShoppe = ({ currentShoppe, groupId, onSuccess, }) => {
+            const transformedCreatures = groupId !== null ? this.transformLoadedCreatures(currentShoppe.creatureDefinitions, groupId) : [];
+            const newShoppeState = Object.assign(Object.assign({}, currentShoppe), { creatures: transformedCreatures.map((creature) => this.generateCreatureExtraManager(creature)) });
+            onSuccess(newShoppeState);
+            return newShoppeState;
+        };
+        this.transformLoadedCreatures = (creatureDefinitions, groupId) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            if (groupId === null) {
+                return [];
+            }
+            return creatureDefinitions.map((definition) => CreatureSimulators.simulateCreature(definition, groupId, ruleData));
+        };
+        //TODO this could use some cleanup?
+        this.getCreaturesFilteredByRules = (creatures, creatureDefinitionLookup, groupId) => {
+            const creatureRules = rulesEngineSelectors.getCreatureRules(this.state);
+            const creatureDatas = creatures.map((manager) => manager.simulateExtraData(groupId, creatureDefinitionLookup));
+            let groupCreatures = this.getCreaturesFilteredByGroupFlags(creatureDatas, groupId);
+            let filteredCreatures = [];
+            let unmatchedCreatures = [...groupCreatures];
+            let hasRules = false;
+            creatureRules.forEach((rule) => {
+                if (groupId === null || !CreatureRuleUtils.isRuleGroup(rule, groupId)) {
+                    return;
+                }
+                let testableCreatures = [...unmatchedCreatures];
+                unmatchedCreatures = [];
+                testableCreatures.forEach((creature) => {
+                    if (CreatureRuleUtils.isValidCreature(creature, rule)) {
+                        filteredCreatures.push(creature);
+                    }
+                    else {
+                        unmatchedCreatures.push(creature);
+                    }
+                });
+                hasRules = true;
+            });
+            return hasRules
+                ? filteredCreatures.map((creature) => this.generateCreatureExtraManager(creature))
+                : groupCreatures.map((creature) => this.generateCreatureExtraManager(creature));
+        };
+        //Handlers
+        this.handleAcceptOnSuccess = (onSuccess) => {
+            return () => {
+                typeof onSuccess === 'function' && onSuccess();
+            };
+        };
+        this.handleRejectOnError = (onError) => {
+            return () => {
+                typeof onError === 'function' && onError();
+            };
+        };
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.handleAdd = ({ extra, quantity, selectedGroup }, onSuccess, onError) => {
+            var _a;
+            const extraId = ExtraAccessors.getId(extra);
+            if (ExtraUtils.isCreature(extra)) {
+                if (selectedGroup && typeof extraId === 'number') {
+                    let names = [];
+                    if (quantity > 1) {
+                        for (let i = 1; i <= quantity; i++) {
+                            names.push(`${ExtraAccessors.getName(extra)} ${i}`);
+                        }
+                    }
+                    else {
+                        names.push(null);
+                    }
+                    this.dispatch(characterActions.creatureCreate(selectedGroup, extraId, names, this.handleAcceptOnSuccess(onSuccess)));
+                }
+            }
+            else if (ExtraUtils.isVehicle(extra)) {
+                if (typeof extraId === 'string') {
+                    this.dispatch(serviceDataActions.vehicleMappingCreate(extraId, (_a = ExtraAccessors.getName(extra)) !== null && _a !== void 0 ? _a : 'Vehicle', this.handleAcceptOnSuccess(onSuccess)));
+                }
+            }
+        };
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.handleRemove = ({ extra }, onSuccess, onError) => {
+            const mappingId = ExtraAccessors.getMappingId(extra);
+            if (ExtraUtils.isCreature(extra)) {
+                this.dispatch(characterActions.creatureRemove(mappingId));
+            }
+            else if (ExtraUtils.isVehicle(extra)) {
+                this.dispatch(serviceDataActions.vehicleMappingRemove(mappingId));
+            }
+        };
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.handleSetActive = ({ extra, isActive }, onSuccess, onError) => {
+            this.dispatch(characterActions.creatureActiveSet(ExtraAccessors.getMappingId(extra), isActive));
+        };
+        //Getters?
+        this.getCharacterExtras = () => {
+            return rulesEngineSelectors.getExtras(this.state);
+        };
+        this.getCharacterExtraManagers = () => {
+            return this.getCharacterExtras().map((extra) => getExtraManager(Object.assign(Object.assign({}, this.params), { extra })));
+        };
+        //START HERE!!!!!!!!!!!! Extras.tsx - manager :)
+        // getCharacterVehicles = () => {
+        // }
+        // getAllVehicles = () => {
+        // }
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.getExtraData = (extra) => {
+            if (ExtraUtils.isCreature(extra)) {
+                const creatureLookup = rulesEngineSelectors.getCreatureLookup(this.state);
+                return ExtraUtils.getTypedExtra(extra, creatureLookup);
+            }
+            else if (ExtraUtils.isVehicle(extra)) {
+                const vehicleLookup = rulesEngineSelectors.getVehicleLookup(this.state);
+                return ExtraUtils.getTypedExtra(extra, vehicleLookup);
+            }
+            else {
+                return null;
+            }
+        };
+        //UTILS
+        //should this be in generators?
+        this.generateExtrasGroupsManagers = (extraManagers) => {
+            return groupBy(extraManagers, (extra) => extra.getGroupId());
+        };
+        //TODO these are probably managers - or use other filter utils
+        this.getExtrasGroups = (filteredExtras) => {
+            const extras = filteredExtras !== null && filteredExtras !== void 0 ? filteredExtras : this.getCharacterExtraManagers();
+            return this.generateExtrasGroupsManagers(extras);
+        };
+        this.getGroupInfosForExtras = (filteredExtras) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const extraManagers = filteredExtras !== null && filteredExtras !== void 0 ? filteredExtras : this.getCharacterExtraManagers();
+            const extras = extraManagers.map((manager) => manager.extra);
+            return ExtraGenerators.generateCurrentExtraGroupInfos(extras, ruleData);
+        };
+        /**
+         *
+         * @deprecated for getGroupInfosForExtras
+         */
+        this.getCurrentGroupInfos = (filteredExtras) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const extras = filteredExtras !== null && filteredExtras !== void 0 ? filteredExtras : this.getCharacterExtras();
+            return ExtraGenerators.generateCurrentExtraGroupInfos(extras, ruleData);
+        };
+        this.getGroupOptions = () => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            let creatureGroupOptions = RuleDataGenerators.getCreatureGroupGroupedOptions(ruleData);
+            return [
+                {
+                    optGroupLabel: 'Creature',
+                    options: creatureGroupOptions,
+                },
+                {
+                    optGroupLabel: 'Object',
+                    options: [
+                        {
+                            label: 'Vehicle',
+                            value: HACK_VEHICLE_GROUP_ID,
+                        },
+                    ],
+                },
+            ];
+        };
+        this.hack__isSidekickGroup = (groupId) => {
+            const creatureGroupInfo = this.getCreatureGroupInfo(groupId);
+            return !!creatureGroupInfo && creatureGroupInfo.name === DB_STRING_GROUP_SIDEKICK;
+        };
+        //TODO move to CreatureManager or ExtraManager
+        this.getCreatureGroupInfo = (groupId) => {
+            if (groupId === null) {
+                return null;
+            }
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            return RuleDataUtils.getCreatureGroupInfo(groupId, ruleData);
+        };
+        //TODO move to CreatureManager or ExtraManager
+        this.getCreaturesFilteredByGroupFlags = (creatures, groupId) => {
+            if (groupId === null) {
+                return creatures;
+            }
+            let groupInfo = this.getCreatureGroupInfo(groupId);
+            if (groupInfo && groupInfo.flagInfoLookup[CreatureGroupFlagEnum.CANNOT_BE_SWARM]) {
+                creatures = creatures.filter((creature) => !CreatureAccessors.isSwarm(creature));
+            }
+            if (this.hack__isSidekickGroup(groupId)) {
+                creatures = creatures.filter((creature) => CreatureAccessors.getTags(creature).includes(DB_STRING_TAG_SIDEKICK));
+            }
+            return creatures;
+        };
+        this.getChallengeOptions = () => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            return RuleDataGenerators.getChallengeOptions(ruleData);
+        };
+        this.generateVehicleExtraManager = (vehicle) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            return getExtraManager(Object.assign(Object.assign({}, this.params), { extra: ExtraGenerators.generateVehicleExtra(vehicle, ruleData) }));
+        };
+        this.generateCreatureExtraManager = (creature) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            return getExtraManager(Object.assign(Object.assign({}, this.params), { extra: ExtraGenerators.generateCreatureExtra(creature, ruleData) }));
+        };
+        /**
+         * @deprecated - for VehicleManager
+         */
+        this.generateVehicleMeta = (vehicle) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            return ExtraGenerators.generateVehicleMeta(vehicle, ruleData);
+        };
+        this.generateCreatureMeta = (creature) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            return ExtraGenerators.generateCreatureMeta(creature, ruleData);
+        };
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.getSourceNames = (extra) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const sources = this.getSources(extra);
+            return sources
+                .map((sourceMapping) => RuleDataUtils.getSourceDataInfo(sourceMapping.sourceId, ruleData))
+                .filter(TypeScriptUtils.isNotNullOrUndefined)
+                .map((sourceDataInfo) => sourceDataInfo.description)
+                .filter(TypeScriptUtils.isNotNullOrUndefined);
+        };
+        //Accessors
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.isCreature = (extra) => ExtraUtils.isCreature(extra);
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.isVehicle = (extra) => ExtraUtils.isVehicle(extra);
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.getName = (extra) => ExtraAccessors.getName(extra);
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.getSources = (extra) => ExtraAccessors.getSources(extra);
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.isHomebrew = (extra) => ExtraAccessors.isHomebrew(extra);
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.getMetaText = (extra) => ExtraAccessors.getMetaText(extra);
+        /**
+         * @deprecated
+         * should use ExtraManager
+         */
+        this.getUniqueKey = (extra) => ExtraAccessors.getUniqueKey(extra);
+        this.params = params;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/FeatManager.js b/ddb_main/packages/rules-engine/es/managers/FeatManager.js
new file mode 100644
index 0000000..ee10d20
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/FeatManager.js
@@ -0,0 +1,126 @@
+import { characterActions } from "../actions";
+import { ChoiceUtils } from "../engine/Choice";
+import { DisplayConfigurationTypeEnum } from "../engine/Core";
+import { DataOriginTypeEnum } from "../engine/DataOrigin";
+import { DefinitionHacks } from "../engine/Definition";
+import { FeatAccessors, FeatUtils } from "../engine/Feat";
+import { PrerequisiteUtils, PrerequisiteValidators } from "../engine/Prerequisite";
+import { RuleDataUtils } from "../engine/RuleData";
+import { SourceUtils } from "../engine/Source";
+import { rulesEngineSelectors } from "../selectors";
+import { BaseManager } from './BaseManager';
+export const featDefinitionMap = new Map();
+const featMangerMap = new Map();
+export const getFeatManager = (params) => {
+    const { feat } = params;
+    const featId = FeatAccessors.getId(feat);
+    if (featMangerMap.has(featId)) {
+        const FeatManager = featMangerMap.get(featId);
+        if (!FeatManager) {
+            throw new Error(`FeatManager for feat ${featId} is null`);
+        }
+        if (FeatManager.params.feat === feat) {
+            return FeatManager;
+        }
+    }
+    const newFeatManager = new FeatManager(params);
+    featMangerMap.set(featId, newFeatManager);
+    return newFeatManager;
+};
+export class FeatManager extends BaseManager {
+    constructor(params) {
+        super(params);
+        this.handleAcceptOnSuccess = (onSuccess) => {
+            return () => {
+                typeof onSuccess === 'function' && onSuccess();
+            };
+        };
+        this.handleRejectOnError = (onError) => {
+            return () => {
+                typeof onError === 'function' && onError();
+            };
+        };
+        this.handleAdd = (onSuccess, onError) => {
+            return this.dispatch(characterActions.adhocFeatCreate(this.getId()));
+        };
+        this.handleRemove = (onSuccess, onError) => {
+            featMangerMap.delete(this.getId());
+            return this.dispatch(characterActions.adhocFeatRemove(this.getId()));
+        };
+        //Accessors
+        this.getId = () => FeatAccessors.getId(this.feat);
+        this.getEntityTypeId = () => FeatAccessors.getEntityTypeId(this.feat);
+        this.getName = () => FeatAccessors.getName(this.feat);
+        this.getDataOrigin = () => FeatAccessors.getDataOrigin(this.feat);
+        this.getDataOriginType = () => FeatAccessors.getDataOriginType(this.feat);
+        this.getActions = () => FeatAccessors.getActions(this.feat);
+        this.getChoices = () => FeatAccessors.getChoices(this.feat);
+        this.getOptions = () => FeatAccessors.getOptions(this.feat);
+        this.getSpells = () => FeatAccessors.getSpells(this.feat);
+        this.getPrerequisites = () => FeatAccessors.getPrerequisites(this.feat);
+        this.getPrerequisiteDescription = () => FeatAccessors.getPrerequisiteDescription(this.feat);
+        this.getDescription = () => FeatAccessors.getDescription(this.feat);
+        this.getSources = () => FeatAccessors.getSources(this.feat);
+        this.getSnippet = () => FeatAccessors.getSnippet(this.feat);
+        this.isRepeatable = () => FeatAccessors.isRepeatable(this.feat);
+        this.getRepeatableParentId = () => FeatAccessors.getRepeatableParentId(this.feat);
+        this.isHomebrew = () => FeatAccessors.isHomebrew(this.feat);
+        this.getDefinition = () => FeatAccessors.getDefinition(this.feat);
+        // Possible TODO for the future: We may add data to Entity Tags to distinguish
+        // user-facing categories from technical-only tags.
+        this.getCategories = () => FeatAccessors.getCategories(this.feat);
+        //Utils
+        this.getPrerequisiteFailures = () => {
+            const prerequisiteData = rulesEngineSelectors.getPrerequisiteData(this.state);
+            return PrerequisiteUtils.getPrerequisiteGroupingFailures(this.getPrerequisites(), prerequisiteData);
+        };
+        this.getRepeatableGroupId = () => FeatUtils.getRepeatableGroupId(this.feat);
+        this.isRepeatableFeatParent = () => this.isRepeatable() && this.getRepeatableParentId() === null;
+        this.getDefinitionKey = () => {
+            return DefinitionHacks.hack__generateDefinitionKey(this.getEntityTypeId(), this.getId());
+        };
+        this.getHelperText = () => {
+            return RuleDataUtils.getBuilderHelperTextByDefinitionKeys([this.getDefinitionKey()], rulesEngineSelectors.getRuleData(this.state), DisplayConfigurationTypeEnum.FEAT);
+        };
+        //validate that a feat meets its prereqs
+        this.canAdd = () => {
+            const prerequisiteData = rulesEngineSelectors.getPrerequisiteData(this.state);
+            const prereqs = this.getPrerequisites();
+            return PrerequisiteValidators.validatePrerequisiteGrouping(prereqs, prerequisiteData);
+        };
+        this.isHiddenFeat = () => FeatUtils.isHiddenFeat(this.feat);
+        this.isSimulatedRepeatableFeat = () => {
+            return this.isRepeatable() && this.getDataOriginType() === DataOriginTypeEnum.SIMULATED;
+        };
+        this.getPrimarySourceName = () => this.isHomebrew()
+            ? 'Homebrew'
+            : SourceUtils.getSourceFullNames(this.getSources(), rulesEngineSelectors.getRuleData(this.state))[0];
+        this.getSourceCategory = () => {
+            var _a;
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const sources = this.getSources();
+            if (sources.length === 0)
+                return null;
+            const sourceData = RuleDataUtils.getSourceDataInfo(sources[0].sourceId, ruleData);
+            return (_a = sourceData === null || sourceData === void 0 ? void 0 : sourceData.sourceCategory) !== null && _a !== void 0 ? _a : null;
+        };
+        this.params = params;
+        this.feat = params.feat;
+    }
+    static getFeatManager(id) {
+        const featManager = featMangerMap.get(id);
+        if (!featManager) {
+            throw new Error(`featManager for feat ${id} is null`);
+        }
+        return featManager;
+    }
+    handleChoiceChange(featId, choiceType, choiceId, optionValue) {
+        this.dispatch(characterActions.featChoiceSetRequest(featId, choiceType, choiceId, optionValue));
+    }
+    hasUnfinishedChoices() {
+        return this.getUnfinishedChoices().length > 0;
+    }
+    getUnfinishedChoices() {
+        return this.getChoices().filter((choice) => ChoiceUtils.isTodo(choice));
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/FeatureFlagManager.js b/ddb_main/packages/rules-engine/es/managers/FeatureFlagManager.js
new file mode 100644
index 0000000..f901e2a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/FeatureFlagManager.js
@@ -0,0 +1,26 @@
+import { DEFAULT_FEATURE_FLAG_INFO, FeatureFlagInfoUtils, FeatureFlagEnum, } from '../engine/FeatureFlagInfo';
+export class FeatureFlagManager {
+    // TODO: let make this optional and just get it with the rules engine config...
+    constructor(featureFlagInfo) {
+        this.featureFlagInfo = DEFAULT_FEATURE_FLAG_INFO;
+        this.FLAGS = FeatureFlagEnum;
+        /**
+         *
+         * @param flag the name of a flag
+         * @returns its current value
+         *
+         * Try featureFlagManager.getFlag(featureFlagManager.NAME_OF_FLAG)
+         */
+        this.getFlag = (flag) => {
+            return FeatureFlagInfoUtils.getFeatureFlagInfoValue(flag, this.featureFlagInfo);
+        };
+        /**
+         *
+         * @param featureFlagInfo the new feature flags
+         */
+        this.update = (featureFlagInfo) => {
+            this.featureFlagInfo = featureFlagInfo;
+        };
+        this.featureFlagInfo = featureFlagInfo;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/FeatureManager.js b/ddb_main/packages/rules-engine/es/managers/FeatureManager.js
new file mode 100644
index 0000000..8e3c183
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/FeatureManager.js
@@ -0,0 +1,46 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { ApiRequests } from "../api";
+export class FeatureManager {
+    constructor(params) {
+        this.handleAcceptOnSuccess = (onSuccess) => {
+            typeof onSuccess === 'function' && onSuccess();
+        };
+        this.handleRejectOnError = (onError) => {
+            typeof onError === 'function' && onError();
+        };
+        this.handleAdd = (onSuccess, onError) => __awaiter(this, void 0, void 0, function* () {
+            yield ApiRequests.postCharacterFeature({ featureId: this.getId() });
+            this.bustCache();
+            this.handleAcceptOnSuccess(onSuccess);
+            this.runSubscriptions();
+        });
+        this.handleRemove = (onSuccess, onError) => __awaiter(this, void 0, void 0, function* () {
+            // featureManagerMap.delete(this.getId()); //TODO GFS do we still need to do it this way
+            yield ApiRequests.deleteCharacterFeature({ featureId: this.getId() });
+            this.bustCache();
+            this.handleAcceptOnSuccess(onSuccess);
+            this.runSubscriptions();
+        });
+        //Accessors
+        this.getId = () => this.feature.featureId;
+        this.getStatements = () => this.feature.statements;
+        this.getFeature = () => this.feature;
+        // Label accessors
+        // TODO what are the default/standard ones?
+        //TODO GFS: talk about role.toLowerCase
+        this.getName = () => { var _a, _b; return (_b = (_a = this.feature.labels.find((label) => label.role.toLowerCase() === 'name')) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : 'FEATURE WITH NO NAME'; }; //TODO GFS ENUMS for all of these
+        this.getDescription = () => { var _a, _b; return (_b = (_a = this.feature.labels.find((label) => label.role.toLowerCase() === 'description')) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : ''; };
+        this.params = params;
+        this.feature = params.feature;
+        this.runSubscriptions = params.runSubscriptions;
+        this.bustCache = params.bustCache;
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/FeaturesManager.js b/ddb_main/packages/rules-engine/es/managers/FeaturesManager.js
new file mode 100644
index 0000000..746ae23
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/FeaturesManager.js
@@ -0,0 +1,166 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { generateCharacterState } from '@dndbeyond/character-gfs';
+import { ApiRequests } from "../api";
+import { ApiAdapterUtils } from "../apiAdapter";
+import { getCurrentRulesEngineConfig } from "../config/utils";
+import { HelperUtils } from "../engine/Helper";
+import { apiCreatorSelectors, rulesEngineSelectors } from "../selectors";
+import { TypeScriptUtils } from "../utils";
+import { FeatureManager } from './FeatureManager';
+import { MessageManager } from './MessageManager';
+export const featureMap = new Map();
+export const subscriptionsMap = new Map();
+const featureManagerMap = new Map();
+export const getFeatureManager = (params) => {
+    const { feature } = params;
+    const featureId = feature.featureId; //TODO GFS Accessors?
+    if (featureManagerMap.has(featureId)) {
+        const FeatureManager = featureManagerMap.get(featureId);
+        if (!FeatureManager) {
+            throw new Error(`FeatureManager for feature ${featureId} is null`);
+        }
+        if (FeatureManager.params.feature === feature) {
+            return FeatureManager;
+        }
+    }
+    const newFeatureManager = new FeatureManager(params);
+    featureManagerMap.set(featureId, newFeatureManager);
+    return newFeatureManager;
+};
+// we want this cached across all instances of the FeaturesManager
+let rootCharacterFeatureManagers = null; // needs
+let allCharacterFeatureManagers = null; // needs
+let availableFeaturesResponseData = null; // not required to bust
+export class FeaturesManager extends MessageManager {
+    constructor(params = {}) {
+        super(params);
+        // these values are used for caching and may need to be busted when the character changes
+        this.randomId = 0; // helpful for debugging
+        this.runSubscriptions = () => {
+            subscriptionsMap.forEach((cb) => cb());
+        };
+        this.transformLoadedFeatures = (features) => {
+            return features.map((feature) => {
+                featureMap.set(feature.featureId, feature);
+                return getFeatureManager({ feature, runSubscriptions: this.runSubscriptions, bustCache: this.bustCache });
+            });
+        };
+        this.getAvailableFeatures = (additionalConfig) => __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            if (availableFeaturesResponseData) {
+                return availableFeaturesResponseData;
+            }
+            const loadFeatures = apiCreatorSelectors.makeLoadAvailableFeatures(this.state);
+            const response = yield loadFeatures(additionalConfig);
+            availableFeaturesResponseData = (_a = ApiAdapterUtils.getResponseData(response)) !== null && _a !== void 0 ? _a : [];
+            availableFeaturesResponseData.map((feature) => {
+                featureMap.set(feature.featureId, feature);
+            });
+            return availableFeaturesResponseData;
+        });
+        this.getFeaturesShoppe = (additionalConfig) => __awaiter(this, void 0, void 0, function* () {
+            let data = yield this.getAvailableFeatures(additionalConfig);
+            if (data) {
+                return this.transformLoadedFeatures(data);
+            }
+            return [];
+        });
+        this.getAllCharacterFeatures = (rootCharacterFeatureIds) => __awaiter(this, void 0, void 0, function* () {
+            var _b;
+            if (allCharacterFeatureManagers) {
+                return allCharacterFeatureManagers;
+            }
+            const allFeaturesAndSubFeatureResponse = yield ApiRequests.postFeaturesAndSubfeatures({
+                featureIds: rootCharacterFeatureIds,
+            });
+            const allFeaturesAndSubFeatureData = (_b = ApiAdapterUtils.getResponseData(allFeaturesAndSubFeatureResponse)) !== null && _b !== void 0 ? _b : [];
+            allFeaturesAndSubFeatureData.map((feature) => {
+                featureMap.set(feature.featureId, feature);
+            });
+            const allFeaturesAndSubFeatureIds = allFeaturesAndSubFeatureData.map((feature) => feature.featureId);
+            allCharacterFeatureManagers = allFeaturesAndSubFeatureIds
+                .map((id) => {
+                const feature = featureMap.get(id);
+                return feature
+                    ? getFeatureManager({ feature, runSubscriptions: this.runSubscriptions, bustCache: this.bustCache })
+                    : null;
+            })
+                .filter(TypeScriptUtils.isNotNullOrUndefined);
+            return allCharacterFeatureManagers || [];
+        });
+        this.bustCache = () => __awaiter(this, void 0, void 0, function* () {
+            availableFeaturesResponseData = null;
+            rootCharacterFeatureManagers = null;
+            allCharacterFeatureManagers = null;
+        });
+        this.getCharacterFeatures = () => __awaiter(this, void 0, void 0, function* () {
+            var _c;
+            if (rootCharacterFeatureManagers) {
+                return rootCharacterFeatureManagers;
+            }
+            const characterId = rulesEngineSelectors.getId(this.state);
+            const characterFeatureResponse = yield ApiRequests.getCharacterFeatures({ characterId });
+            const characterFeatureData = (_c = ApiAdapterUtils.getResponseData(characterFeatureResponse)) !== null && _c !== void 0 ? _c : [];
+            const characterFeatureIds = characterFeatureData.map((feature) => feature.id);
+            if (characterFeatureIds.length > 0) {
+                yield this.getAvailableFeatures({
+                    params: {
+                        category: 'blessing',
+                    },
+                });
+                yield this.getAllCharacterFeatures(characterFeatureIds);
+            }
+            rootCharacterFeatureManagers = characterFeatureIds
+                .map((id) => {
+                const feature = featureMap.get(id);
+                return feature
+                    ? getFeatureManager({ feature, runSubscriptions: this.runSubscriptions, bustCache: this.bustCache })
+                    : null;
+            })
+                .filter(TypeScriptUtils.isNotNullOrUndefined);
+            return rootCharacterFeatureManagers;
+        });
+        this.processCharacter = (generatedFeature) => {
+            featureMap.set(generatedFeature.featureId, generatedFeature);
+            return generateCharacterState({
+                rootFeatureIds: [
+                    generatedFeature.featureId,
+                    ...((rootCharacterFeatureManagers === null || rootCharacterFeatureManagers === void 0 ? void 0 : rootCharacterFeatureManagers.map((featureManager) => featureManager.getId())) || []),
+                ],
+                featureMap,
+            });
+        };
+        this.randomId = Math.floor(Math.random() * 1000000);
+    }
+}
+// manage subscriptions
+FeaturesManager.subscribeToUpdates = ({ onUpdate, shouldInit = true }) => {
+    // TODO: maybe from lib.
+    const mapKey = HelperUtils.generateGuid();
+    // connect to redux for updates
+    let unsubscribe;
+    if (getCurrentRulesEngineConfig().store) {
+        const store = getCurrentRulesEngineConfig().store;
+        unsubscribe = store === null || store === void 0 ? void 0 : store.subscribe(() => {
+            onUpdate();
+        });
+    }
+    subscriptionsMap.set(mapKey, onUpdate);
+    if (shouldInit) {
+        onUpdate();
+    }
+    return () => {
+        subscriptionsMap.delete(mapKey);
+        if (unsubscribe) {
+            unsubscribe();
+        }
+    };
+};
diff --git a/ddb_main/packages/rules-engine/es/managers/InventoryManager.js b/ddb_main/packages/rules-engine/es/managers/InventoryManager.js
new file mode 100644
index 0000000..148ec4d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/InventoryManager.js
@@ -0,0 +1,411 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import * as ApiAdapterUtils from "../apiAdapter/utils";
+import { characterActions } from '../actions';
+import { ContainerAccessors, ContainerGenerators, ContainerTypeEnum, ContainerUtils, ContainerValidators, } from '../engine/Container';
+import { EntityTypeEnum, DefaultCharacterName } from '../engine/Core';
+import { DefinitionHacks } from '../engine/Definition';
+import { HelperUtils } from '../engine/Helper';
+import { InfusionAccessors } from '../engine/Infusion';
+import { ItemAccessors, ItemSimulators, ItemUtils, ItemValidators } from '../engine/Item';
+import { ValueHacks } from '../engine/Value';
+import { apiCreatorSelectors, characterSelectors, rulesEngineSelectors } from '../selectors';
+import { getContainerManager } from './ContainerManager';
+import { PartyManager } from './PartyManager';
+export class InventoryManager extends PartyManager {
+    constructor(params) {
+        super(params);
+        this.transformLoadedItems = (data) => {
+            const globalModifiers = rulesEngineSelectors.getValidGlobalModifiers(this.state);
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const valueLookupByType = rulesEngineSelectors.getCharacterValueLookupByType(this.state);
+            return data
+                .filter((item) => item.canBeAddedToInventory)
+                .map((definition) => ItemSimulators.simulateItem(definition, globalModifiers, valueLookupByType, ruleData, {
+                simulatedItemContract: {
+                    id: definition.id,
+                },
+            }));
+        };
+        /**
+         *
+         * Below methods are being depricated in favor of
+         * moving the methods to container and item managers
+         *
+         */
+        this.handleAcceptOnSuccess = (isShared, onSuccess) => {
+            return () => {
+                typeof onSuccess === 'function' && onSuccess();
+                if (isShared) {
+                    const data = {};
+                    const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                    this.sendMessage({ data, eventType });
+                }
+            };
+        };
+        this.handleRejectOnError = (onError, isShared) => {
+            return () => {
+                typeof onError === 'function' && onError();
+            };
+        };
+        //Item Action Handlers
+        /**
+         * @deprecated
+         */
+        this.handleAdd = ({ item, amount, containerDefinitionKey }, onSuccess, onError) => {
+            const isShared = this.isSharedContainerDefinitionKey(containerDefinitionKey);
+            this.dispatch(characterActions.itemCreate(item, amount, this.handleAcceptOnSuccess(isShared, onSuccess), this.handleRejectOnError(onError), containerDefinitionKey));
+        };
+        this.handleCustomAdd = ({ customItem, containerDefinitionKey }, onSuccess, onError) => {
+            var _a;
+            const isShared = this.isSharedContainerDefinitionKey(containerDefinitionKey);
+            this.dispatch(characterActions.customItemCreate((_a = customItem.name) !== null && _a !== void 0 ? _a : this.getDefaultCustomItemName(), customItem.description, customItem.cost, customItem.quantity, customItem.weight, customItem.notes, containerDefinitionKey, isShared ? this.getPartyId() : null, this.handleAcceptOnSuccess(isShared, onSuccess)));
+        };
+        /**
+         * @deprecated
+         */
+        this.handleMove = ({ item, containerDefinitionKey }, onSuccess, onError) => {
+            const definitionKeyId = DefinitionHacks.hack__getDefinitionKeyId(containerDefinitionKey);
+            const definitionKeyType = DefinitionHacks.hack__getDefinitionKeyType(containerDefinitionKey);
+            if (definitionKeyId && definitionKeyType) {
+                const isShared = this.isSharedContainerDefinitionKey(containerDefinitionKey) || this.isShared(item);
+                this.dispatch(characterActions.itemMoveSet(ItemAccessors.getMappingId(item), definitionKeyId, definitionKeyType, this.handleAcceptOnSuccess(isShared, onSuccess)));
+            }
+        };
+        /**
+         * @deprecated
+         */
+        this.handleRemove = ({ item }, onSuccess, onError) => {
+            const isCustomItem = ItemAccessors.isCustom(item);
+            const isShared = this.isShared(item);
+            if (isCustomItem) {
+                this.dispatch(characterActions.customItemDestroy(ItemAccessors.getDefinitionId(item), ItemAccessors.getMappingId(item), isShared ? this.getPartyId() : null, this.handleAcceptOnSuccess(isShared, onSuccess)));
+            }
+            else {
+                const isContainer = ItemAccessors.isContainer(item);
+                const infusion = ItemAccessors.getInfusion(item);
+                this.dispatch(characterActions.itemDestroy(ItemAccessors.getMappingId(item), isContainer && infusion ? false : true, this.handleAcceptOnSuccess(isShared, onSuccess)));
+            }
+        };
+        /**
+         * @deprecated
+         */
+        this.handleEquip = ({ item }, onSuccess, onError) => {
+            const characterId = rulesEngineSelectors.getId(this.state);
+            const isShared = this.isShared(item);
+            this.dispatch(characterActions.itemEquippedSet(ItemAccessors.getMappingId(item), true, characterId, EntityTypeEnum.CHARACTER, this.handleAcceptOnSuccess(isShared, onSuccess)));
+        };
+        /**
+         * @deprecated
+         */
+        this.handleUnequip = ({ item }, onSuccess, onError) => {
+            const isShared = this.isShared(item);
+            this.dispatch(characterActions.itemEquippedSet(ItemAccessors.getMappingId(item), false, null, null, this.handleAcceptOnSuccess(isShared, onSuccess)));
+        };
+        this.handleAttune = ({ item }, onSuccess, onError) => {
+            const isShared = this.isShared(item);
+            this.dispatch(characterActions.itemAttuneSet(ItemAccessors.getMappingId(item), true, this.handleAcceptOnSuccess(isShared, onSuccess)));
+        };
+        this.handleUnattune = ({ item }, onSuccess, onError) => {
+            const isShared = this.isShared(item);
+            this.dispatch(characterActions.itemAttuneSet(ItemAccessors.getMappingId(item), false, this.handleAcceptOnSuccess(isShared, onSuccess)));
+        };
+        this.handleQuantitySet = ({ item, quantity }, onSuccess, onError) => {
+            const originalQuantity = ItemAccessors.getQuantity(item);
+            if (originalQuantity === quantity) {
+                return;
+            }
+            const isShared = this.isShared(item);
+            const isCustomItem = ItemAccessors.isCustom(item);
+            if (isCustomItem) {
+                this.handleCustomEdit({ item, adjustments: { quantity } }, onSuccess, onError);
+            }
+            else {
+                this.dispatch(characterActions.itemQuantitySet(ItemAccessors.getMappingId(item), quantity, this.handleAcceptOnSuccess(isShared, onSuccess)));
+            }
+        };
+        /**
+         * @deprecated - moved to the item
+         * @param param0
+         * @param onSuccess
+         * @param onError
+         */
+        this.handleChargesSet = ({ item, used }, onSuccess, onError) => {
+            const isShared = this.isShared(item);
+            this.dispatch(characterActions.itemChargesSet(ItemAccessors.getMappingId(item), used, this.handleAcceptOnSuccess(isShared, onSuccess)));
+        };
+        this.handleCustomEdit = ({ item, adjustments }, onSuccess, onError) => {
+            const isShared = this.isShared(item);
+            let originalContract = ItemAccessors.getOriginalContract(item);
+            if (originalContract !== null) {
+                let newProperties = Object.assign(Object.assign({}, originalContract), adjustments);
+                this.dispatch(characterActions.customItemSet(ItemAccessors.getDefinitionId(item), newProperties, ItemAccessors.getMappingId(item), isShared ? this.getPartyId() : null, this.handleAcceptOnSuccess(isShared, onSuccess)));
+            }
+        };
+        this.handleCustomizationSet = ({ item, adjustmentType, value }, onSuccess, onError) => {
+            const isShared = this.isShared(item);
+            this.dispatch(characterActions.valueSet(adjustmentType, value, null, ValueHacks.hack__toString(ItemAccessors.getMappingId(item)), ValueHacks.hack__toString(ItemAccessors.getMappingEntityTypeId(item)), null, null, isShared ? this.getPartyId() : null, this.handleAcceptOnSuccess(isShared, onSuccess)));
+        };
+        this.handleCustomizationsRemove = ({ item }, onSuccess, onError) => {
+            const isShared = this.isShared(item);
+            this.dispatch(characterActions.itemCustomizationsDelete(ItemAccessors.getMappingId(item), ItemAccessors.getMappingEntityTypeId(item), isShared ? this.getPartyId() : null, this.handleAcceptOnSuccess(isShared, onSuccess)));
+        };
+        // Validators
+        this.canAddToContainer = (container) => {
+            const isShared = ContainerAccessors.isShared(container);
+            return !isShared || this.isSharingTurnedOn();
+        };
+        /**
+         * @deprecated
+         */
+        this.canEquipUnequipItem = (item) => {
+            const isShared = this.isShared(item);
+            const canEquip = ItemAccessors.canEquip(item);
+            const isEquipped = ItemAccessors.isEquipped(item);
+            if (isShared && canEquip) {
+                if (this.isSharingTurnedOn() || (this.isSharingTurnedDeleteOnly() && isEquipped)) {
+                    return isEquipped ? this.isEquippedToCurrentCharacter(item) : true;
+                }
+                return false;
+            }
+            return canEquip;
+        };
+        this.canAttuneUnattuneItem = (item) => {
+            const hasMaxAttunedItems = rulesEngineSelectors.hasMaxAttunedItems(this.state);
+            const isShared = this.isShared(item);
+            const canAttune = ItemAccessors.canAttune(item);
+            const isAttuned = ItemAccessors.isAttuned(item);
+            if (!isAttuned) {
+                if (isShared) {
+                    if (this.isSharingTurnedDeleteOnly()) {
+                        return false;
+                    }
+                    return this.isEquippedToCurrentCharacter(item) && !hasMaxAttunedItems && canAttune;
+                }
+                return !hasMaxAttunedItems && canAttune;
+            }
+            else {
+                if (isShared) {
+                    return this.isEquippedToCurrentCharacter(item);
+                }
+                return true;
+            }
+        };
+        this.canModifyQuantity = (item) => {
+            const isShared = this.isShared(item);
+            const isStackable = ItemAccessors.isStackable(item);
+            if (isShared && isStackable) {
+                return this.isSharingTurnedOn();
+            }
+            return isStackable;
+        };
+        this.canCustomizeItem = (item) => {
+            const isShared = this.isShared(item);
+            if (isShared) {
+                return this.isSharingTurnedOn();
+            }
+            return true;
+        };
+        this.canUseItemCharges = (item) => {
+            const isShared = this.isShared(item);
+            if (isShared) {
+                return this.isSharingTurnedOn();
+            }
+            return !!ItemAccessors.getLimitedUse(item);
+        };
+        this.canRemoveItem = (item) => {
+            const isShared = this.isShared(item);
+            if (isShared) {
+                const infusion = ItemAccessors.getInfusion(item);
+                if (infusion) {
+                    const infusionCharacterId = InfusionAccessors.getCharacterId(infusion);
+                    if (infusionCharacterId !== rulesEngineSelectors.getId(this.state)) {
+                        return false;
+                    }
+                }
+                return ItemAccessors.isEquipped(item)
+                    ? this.isSharingTurnedOnOrDeleteOnly() && this.isEquippedToCurrentCharacter(item)
+                    : this.isSharingTurnedOnOrDeleteOnly();
+            }
+            return true;
+        };
+        this.canMoveItem = (item) => {
+            // If you are changing this, you may want to change the canRemoveItem above
+            const isShared = this.isShared(item);
+            if (isShared) {
+                const infusion = ItemAccessors.getInfusion(item);
+                if (infusion) {
+                    const infusionCharacterId = InfusionAccessors.getCharacterId(infusion);
+                    if (infusionCharacterId !== rulesEngineSelectors.getId(this.state)) {
+                        return false;
+                    }
+                }
+                return ItemAccessors.isEquipped(item)
+                    ? this.isSharingTurnedOnOrDeleteOnly() && this.isEquippedToCurrentCharacter(item)
+                    : this.isSharingTurnedOnOrDeleteOnly();
+            }
+            else if (this.isSharingTurnedDeleteOnly()) {
+                const localContainers = rulesEngineSelectors.getCharacterInventoryContainers(this.state);
+                return localContainers.length > 1;
+            }
+            const containerLookup = rulesEngineSelectors.getContainerLookup(this.state);
+            return Object.keys(containerLookup).length > 1;
+        };
+        this.canShareItem = (item) => {
+            const isContainer = ItemAccessors.isContainer(item);
+            if (!isContainer) {
+                return false;
+            }
+            const isShared = this.isShared(item);
+            return !isShared && this.isSharingTurnedOn();
+        };
+        this.canClaimItem = (item) => {
+            const isContainer = ItemAccessors.isContainer(item);
+            if (!isContainer || (ItemAccessors.isEquipped(item) && !this.isEquippedToCurrentCharacter(item))) {
+                return false;
+            }
+            const containerLookup = rulesEngineSelectors.getContainerLookup(this.state);
+            const isShared = this.isShared(item);
+            if (isShared) {
+                // If container is shared and has items equipped to others, then it can't be claimed
+                const definitionKey = DefinitionHacks.hack__generateDefinitionKey(EntityTypeEnum.ITEM, ItemAccessors.getMappingId(item));
+                const container = HelperUtils.lookupDataOrFallback(containerLookup, definitionKey);
+                if (container) {
+                    const infusion = ItemAccessors.getInfusion(item);
+                    if (infusion) {
+                        const infusionCharacterId = InfusionAccessors.getCharacterId(infusion);
+                        if (infusionCharacterId !== rulesEngineSelectors.getId(this.state)) {
+                            return false;
+                        }
+                    }
+                    const inventory = rulesEngineSelectors.getAllInventoryItems(this.state);
+                    const inventoryItems = ContainerUtils.getInventoryItems(container, inventory);
+                    const itemsEquippedToOthers = inventoryItems.filter((item) => ItemAccessors.isEquipped(item) && !this.isEquippedToCurrentCharacter(item));
+                    if (itemsEquippedToOthers.length) {
+                        return false;
+                    }
+                }
+                return this.isSharingTurnedOnOrDeleteOnly();
+            }
+            return false;
+        };
+        this.isSharedContainerDefinitionKey = (containerDefinitionKey) => {
+            const containerLookup = rulesEngineSelectors.getContainerLookup(this.state);
+            return ContainerValidators.validateIsShared(containerDefinitionKey, containerLookup);
+        };
+        this.isShared = (item) => {
+            const containerLookup = rulesEngineSelectors.getContainerLookup(this.state);
+            return ItemUtils.isShared(item, containerLookup);
+        };
+        /**
+         * @deprecated
+         */
+        this.isEquippedToCurrentCharacter = (item) => {
+            const characterId = rulesEngineSelectors.getId(this.state);
+            return ItemValidators.isEquippedToCurrentCharacter(item, characterId);
+        };
+        this.isInfused = (item) => {
+            const infusion = ItemAccessors.getInfusion(item);
+            return !!infusion;
+        };
+        /**
+         * @deprecated
+         */
+        this.getEquippedCharacterName = (item) => {
+            var _a;
+            const equippedEntityId = ItemAccessors.getEquippedEntityId(item);
+            if (this.isEquippedToCurrentCharacter(item)) {
+                return (_a = rulesEngineSelectors.getName(this.state)) !== null && _a !== void 0 ? _a : '';
+            }
+            if (equippedEntityId) {
+                return this.getPartyMemberName(equippedEntityId);
+            }
+            return DefaultCharacterName;
+        };
+        this.getPartyEquipmentContainerDefinitionKey = () => {
+            const partyId = this.getPartyId();
+            if (partyId) {
+                return ContainerUtils.getPartyContainerDefinitionKey(partyId);
+            }
+            return null;
+        };
+        this.getCharacterContainerDefinitionKey = () => {
+            const characterId = rulesEngineSelectors.getId(this.state);
+            return ContainerUtils.getCharacterContainerDefinitionKey(characterId);
+        };
+        this.getDefaultCustomItemName = () => {
+            const customItems = rulesEngineSelectors.getCustomItems(this.state);
+            return `Custom Item ${customItems.length + 1}`;
+        };
+        this.params = params;
+    }
+    getCharacterContainers() {
+        const characterContainers = rulesEngineSelectors.getCharacterInventoryContainers(this.state);
+        return this.generateContainerManagers(characterContainers);
+    }
+    getPartyContainers() {
+        const partyContainers = rulesEngineSelectors.getPartyInventoryContainers(this.state);
+        return this.generateContainerManagers(partyContainers);
+    }
+    getAllContainers() {
+        const containers = rulesEngineSelectors.getInventoryContainers(this.state);
+        return this.generateContainerManagers(containers);
+    }
+    getContainer(containerDefinitionKey) {
+        const containerLookup = rulesEngineSelectors.getContainerLookup(this.state);
+        const container = HelperUtils.lookupDataOrFallback(containerLookup, containerDefinitionKey);
+        return container ? getContainerManager(Object.assign(Object.assign({}, this.params), { container })) : null;
+    }
+    generateContainerManagers(containers) {
+        return containers.map((container) => getContainerManager(Object.assign(Object.assign({}, this.params), { container })));
+    }
+    // TODO: this can be cached sometimes? recall when pane closes and opens? needs a cache reset function?
+    getInventoryShoppe({ onSuccess, additionalApiConfig, }) {
+        var _a, _b;
+        return __awaiter(this, void 0, void 0, function* () {
+            const characterId = characterSelectors.getId(this.state);
+            const loadItems = apiCreatorSelectors.makeLoadAvailableItems(this.state);
+            //set up pagination params
+            let paginationParams = {
+                page: 0,
+                pageSize: 1000,
+            };
+            //set up vars to hold all response data and track totalItemsCount and totalPages
+            const allResponseDataItems = [];
+            let totalItemsCount = 0;
+            let totalPages = 0;
+            //request items until all items are loaded
+            while (paginationParams.page <= totalPages) {
+                const requestConfig = Object.assign(Object.assign({}, additionalApiConfig), { params: Object.assign(Object.assign({}, paginationParams), additionalApiConfig === null || additionalApiConfig === void 0 ? void 0 : additionalApiConfig.params) });
+                const response = yield loadItems(requestConfig);
+                //on first iteration - set total items count
+                if (paginationParams.page === 0) {
+                    totalItemsCount = (_b = (_a = response.data.pagination) === null || _a === void 0 ? void 0 : _a.total) !== null && _b !== void 0 ? _b : 0;
+                    //calculate how many more calls we need to make after the first page
+                    totalPages = Math.ceil(totalItemsCount / paginationParams.pageSize) - 1;
+                }
+                const data = ApiAdapterUtils.getResponseData(response);
+                //if we don't get any data back, break out of the loop
+                if (!data || data.length === 0) {
+                    break;
+                }
+                //add data to the all response data array and increment the page
+                allResponseDataItems.push(...data);
+                paginationParams.page += 1;
+            }
+            let transformedItems = this.transformLoadedItems(allResponseDataItems);
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const shoppeContainer = ContainerGenerators.generateContainer(-1, ContainerTypeEnum.SHOPPE, 'Item Shoppe', transformedItems, false, null, null, characterId, null, ruleData);
+            const shoppeManager = getContainerManager(Object.assign(Object.assign({}, this.params), { container: shoppeContainer, overrideItems: transformedItems }));
+            onSuccess(shoppeManager);
+            return shoppeManager;
+        });
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/ItemManager.js b/ddb_main/packages/rules-engine/es/managers/ItemManager.js
new file mode 100644
index 0000000..14b6fc2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/ItemManager.js
@@ -0,0 +1,243 @@
+import { characterActions } from "../actions";
+import { ContainerAccessors, ContainerTypeEnum, ContainerValidators } from "../engine/Container";
+import { LimitedUseAccessors } from "../engine/LimitedUse";
+import { RuleDataUtils } from "../engine/RuleData";
+import { rulesEngineSelectors } from "../selectors";
+import { EntityTypeEnum, DefaultCharacterName } from '../engine/Core';
+import { DefinitionHacks } from '../engine/Definition';
+import { ItemAccessors, ItemNotes, ItemUtils, ItemValidators } from '../engine/Item';
+import { ContainerManager } from './ContainerManager';
+import { PartyManager } from './PartyManager';
+const itemMangerMap = new Map();
+export const getItem = (itemId) => {
+    const itemManager = itemMangerMap.get(itemId);
+    if (!itemManager) {
+        throw new Error(`ItemManager for item ${itemId} is null`);
+    }
+    return itemManager;
+};
+export const getItemManager = (params) => {
+    const { item } = params;
+    const itemId = ItemAccessors.getMappingId(item);
+    if (itemMangerMap.has(itemId)) {
+        const itemManager = itemMangerMap.get(itemId);
+        if (!itemManager) {
+            throw new Error(`ItemManager for item ${itemId} is null`);
+        }
+        if (itemManager.item === item) {
+            return itemManager;
+        }
+    }
+    const newItemManger = new ItemManager(params);
+    itemMangerMap.set(itemId, newItemManger);
+    return newItemManger;
+};
+export class ItemManager extends PartyManager {
+    constructor(params) {
+        super(params);
+        // Actions
+        this.handleAdd = ({ amount, containerDefinitionKey }, onSuccess, onError) => {
+            var _a;
+            // const container = this.requiresContainer();
+            let itemDestinationContainerDefinitionKey = containerDefinitionKey;
+            // TODO: IS THERE A SELECTOR FOR THIS? -> move to container manager?
+            const containers = rulesEngineSelectors.getInventoryContainers(this.state);
+            // Default to the character container if none is passed
+            if (!itemDestinationContainerDefinitionKey) {
+                itemDestinationContainerDefinitionKey = ContainerAccessors.getDefinitionKey((_a = containers.find(ContainerValidators.isCharacterContainer)) !== null && _a !== void 0 ? _a : containers[0]);
+            }
+            const isShared = ContainerManager.isSharedContainerDefinitionKey(this.state, itemDestinationContainerDefinitionKey);
+            this.dispatch(characterActions.itemCreate(this.item, amount, this.handleAcceptOnSuccess(isShared, onSuccess), this.handleRejectOnError(onError), containerDefinitionKey));
+        };
+        this.handleRemove = (onSuccess, onError) => {
+            const isShared = this.isShared();
+            if (this.isCustom()) {
+                this.dispatch(characterActions.customItemDestroy(this.getDefinitionId(), this.getMappingId(), isShared ? this.getPartyId() : null, this.handleAcceptOnSuccess(isShared, onSuccess)));
+            }
+            else {
+                const isContainer = this.isContainer();
+                const infusion = this.getInfusion();
+                this.dispatch(characterActions.itemDestroy(this.getMappingId(), isContainer && infusion ? false : true, this.handleAcceptOnSuccess(isShared, onSuccess)));
+            }
+        };
+        this.handleMove = ({ containerDefinitionKey }, onSuccess, onError) => {
+            const definitionKeyId = DefinitionHacks.hack__getDefinitionKeyId(containerDefinitionKey);
+            const definitionKeyType = DefinitionHacks.hack__getDefinitionKeyType(containerDefinitionKey);
+            if (definitionKeyId && definitionKeyType) {
+                const isShared = this.requiresContainer().isSharedOtherContainerDefinitionKey(containerDefinitionKey) || this.isShared();
+                this.dispatch(characterActions.itemMoveSet(this.getMappingId(), definitionKeyId, definitionKeyType, this.handleAcceptOnSuccess(isShared, onSuccess)));
+            }
+        };
+        this.handleEquip = (onSuccess, onError) => {
+            const characterId = rulesEngineSelectors.getId(this.state);
+            this.dispatch(characterActions.itemEquippedSet(ItemAccessors.getMappingId(this.item), true, characterId, EntityTypeEnum.CHARACTER, this.handleAcceptOnSuccess(this.isShared(), onSuccess)));
+        };
+        this.handleUnequip = (onSuccess, onError) => {
+            this.dispatch(characterActions.itemEquippedSet(ItemAccessors.getMappingId(this.item), false, null, null, this.handleAcceptOnSuccess(this.isShared(), onSuccess)));
+        };
+        this.handleItemLimitedUseSet = (uses) => {
+            this.dispatch(characterActions.itemChargesSet(this.getMappingId(), uses, this.handleAcceptOnSuccess(this.isShared())));
+        };
+        this.getItem = () => this.item;
+        // Accessors
+        this.getUniqueKey = () => `${ItemAccessors.getUniqueKey(this.item)}-${this.requiresContainer().getDefinitionKey()}`;
+        this.isEquipped = () => ItemAccessors.isEquipped(this.item);
+        this.getMappingId = () => ItemAccessors.getMappingId(this.item);
+        this.getType = () => ItemAccessors.getType(this.item);
+        this.isHexWeapon = () => ItemAccessors.isHexWeapon(this.item);
+        this.isPactWeapon = () => ItemAccessors.isPactWeapon(this.item);
+        this.isDedicatedWeapon = () => ItemAccessors.isDedicatedWeapon(this.item);
+        this.isOffhand = () => ItemAccessors.isOffhand(this.item);
+        this.getBaseArmorName = () => ItemAccessors.getBaseArmorName(this.item);
+        this.getSubType = () => ItemAccessors.getSubType(this.item);
+        this.getQuantity = () => ItemAccessors.getQuantity(this.item);
+        this.isStackable = () => ItemAccessors.isStackable(this.item);
+        this.getWeight = () => ItemAccessors.getWeight(this.item);
+        this.getCost = () => ItemAccessors.getCost(this.item);
+        this.getAvatarUrl = () => ItemAccessors.getAvatarUrl(this.item);
+        this.isContainer = () => ItemAccessors.isContainer(this.item);
+        this.getName = () => ItemAccessors.getName(this.item);
+        this.isCustom = () => ItemAccessors.isCustom(this.item);
+        this.getDefinitionId = () => ItemAccessors.getDefinitionId(this.item);
+        this.getInfusion = () => ItemAccessors.getInfusion(this.item);
+        this.getContainerDefinitionKey = () => ItemAccessors.getContainerDefinitionKey(this.item);
+        this.hasProficiency = () => ItemAccessors.hasProficiency(this.item);
+        this.isMagic = () => ItemAccessors.isMagic(this.item);
+        this.getDefintionFilterType = () => ItemAccessors.getDefintionFilterType(this.item);
+        this.isPack = () => ItemAccessors.isPack(this.item);
+        this.getBundleSize = () => ItemAccessors.getBundleSize(this.item);
+        this.getAttackType = () => ItemAccessors.getAttackType(this.item);
+        this.isAdamantine = () => ItemAccessors.isAdamantine(this.item);
+        this.isSilvered = () => ItemAccessors.isSilvered(this.item);
+        this.isCustomized = () => ItemAccessors.isCustomized(this.item);
+        this.getRange = () => ItemAccessors.getRange(this.item);
+        this.getLongRange = () => ItemAccessors.getLongRange(this.item);
+        this.getReach = () => ItemAccessors.getReach(this.item);
+        this.getToHit = () => ItemAccessors.getToHit(this.item);
+        this.getDamage = () => ItemAccessors.getDamage(this.item);
+        this.getVersatileDamage = () => ItemAccessors.getVersatileDamage(this.item);
+        this.getDamageType = () => ItemAccessors.getDamageType(this.item);
+        this.getMasteryName = () => ItemAccessors.getMasteryName(this.item);
+        this.isLegacy = () => ItemAccessors.isLegacy(this.item);
+        this.getPrimarySourceCategoryId = () => ItemAccessors.getPrimarySourceCategoryId(this.item);
+        this.getSecondarySourceCategoryIds = () => ItemAccessors.getSecondarySourceCategoryIds(this.item);
+        this.getAllSourceCategoryIds = () => ItemUtils.getAllSourceCategoryIds(this.item);
+        // Validator
+        this.isShared = () => this.requiresContainer().isShared();
+        this.isArmorContract = () => ItemUtils.isArmorContract(this.item);
+        this.isGearContract = () => ItemUtils.isGearContract(this.item);
+        this.isWeaponContract = () => ItemUtils.isWeaponContract(this.item);
+        this.canEquipUnequipItem = () => {
+            const isShared = this.isShared();
+            const canEquip = ItemAccessors.canEquip(this.item);
+            const isEquipped = ItemAccessors.isEquipped(this.item);
+            if (isShared && canEquip) {
+                if (this.isSharingTurnedOn() || (this.isSharingTurnedDeleteOnly() && isEquipped)) {
+                    return isEquipped ? this.isEquippedToCurrentCharacter() : true;
+                }
+                return false;
+            }
+            return canEquip;
+        };
+        this.isEquippedToCurrentCharacter = () => {
+            const characterId = rulesEngineSelectors.getId(this.state);
+            return ItemValidators.isEquippedToCurrentCharacter(this.item, characterId);
+        };
+        // Utils
+        this.getRarityLevel = () => ItemUtils.getRarityLevel(this.item);
+        this.generateContainerDefinitionKey = () => {
+            return DefinitionHacks.hack__generateDefinitionKey(ContainerTypeEnum.ITEM, this.getMappingId());
+        };
+        this.getEquippedCharacterName = () => {
+            var _a;
+            const equippedEntityId = ItemAccessors.getEquippedEntityId(this.item);
+            if (this.isEquippedToCurrentCharacter()) {
+                return (_a = rulesEngineSelectors.getName(this.state)) !== null && _a !== void 0 ? _a : '';
+            }
+            if (equippedEntityId) {
+                return this.getPartyMemberName(equippedEntityId);
+            }
+            return DefaultCharacterName;
+        };
+        this.getNotes = () => {
+            const weaponSpellDamageGroups = rulesEngineSelectors.getWeaponSpellDamageGroups(this.state);
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const abilityLookup = rulesEngineSelectors.getAbilityLookup(this.state);
+            const proficiencyBonus = rulesEngineSelectors.getProficiencyBonus(this.state);
+            return ItemNotes.getNoteComponents(this.item, weaponSpellDamageGroups, ruleData, abilityLookup, proficiencyBonus);
+        };
+        this.getMetaText = () => {
+            let metaItems = [];
+            if (this.isLegacy()) {
+                metaItems.push('Legacy');
+            }
+            const type = this.getType();
+            if (type !== null) {
+                metaItems.push(type);
+            }
+            if (this.isHexWeapon()) {
+                metaItems.push('Hex Weapon');
+            }
+            if (this.isPactWeapon()) {
+                metaItems.push('Pact Weapon');
+            }
+            if (this.isDedicatedWeapon()) {
+                metaItems.push('Dedicated Weapon');
+            }
+            if (this.isOffhand()) {
+                metaItems.push('Dual Wield');
+            }
+            if (this.isArmorContract()) {
+                let baseArmorName = this.getBaseArmorName();
+                if (baseArmorName) {
+                    metaItems.push(baseArmorName);
+                }
+            }
+            else if (this.isGearContract()) {
+                let subType = this.getSubType();
+                if (subType) {
+                    metaItems.push(subType);
+                }
+            }
+            if (this.getMasteryName()) {
+                metaItems.push('Mastery');
+            }
+            if (this.isEquipped() && !this.isEquippedToCurrentCharacter()) {
+                metaItems.push(`Equipped by ${this.getEquippedCharacterName()}`);
+            }
+            return metaItems;
+        };
+        this.getNumberUsed = () => {
+            const limitedUse = ItemAccessors.getLimitedUse(this.item);
+            if (limitedUse !== null) {
+                return LimitedUseAccessors.getNumberUsed(limitedUse);
+            }
+            return null;
+        };
+        this.getAttackTypeName = () => {
+            const attackType = this.getAttackType();
+            let attackTypeName = '';
+            if (attackType) {
+                attackTypeName = RuleDataUtils.getAttackTypeRangeName(attackType);
+            }
+            return attackTypeName;
+        };
+        this.getMasteryAction = () => {
+            const actions = rulesEngineSelectors.getActions(this.state);
+            return ItemUtils.getMasteryAction(this.item, actions);
+        };
+        this.item = params.item;
+        this.container = params.container || null;
+    }
+    /**
+     *
+     * @description This method is used to throw an error incase the manager was not created with a container
+     */
+    requiresContainer() {
+        if (this.container === null) {
+            throw new Error('Item does not have a container');
+        }
+        return this.container;
+    }
+}
+ItemManager.getItem = getItem;
diff --git a/ddb_main/packages/rules-engine/es/managers/LeveledSpellManager.js b/ddb_main/packages/rules-engine/es/managers/LeveledSpellManager.js
new file mode 100644
index 0000000..94dfdb0
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/LeveledSpellManager.js
@@ -0,0 +1,329 @@
+import { characterActions } from "../actions";
+import { ActivationAccessors } from "../engine/Activation";
+import { ClassAccessors } from "../engine/Class";
+import { ConditionAccessors } from "../engine/Condition";
+import { DataOriginTypeEnum } from "../engine/DataOrigin";
+import { DiceRenderers } from "../engine/Dice";
+import { EntityUtils } from "../engine/Entity";
+import { HelperUtils } from "../engine/Helper";
+import { ItemAccessors } from "../engine/Item";
+import { LimitedUseAccessors } from "../engine/LimitedUse";
+import { ModifierAccessors, ModifierValidators } from "../engine/Modifier";
+import { RuleDataUtils } from "../engine/RuleData";
+import { SpellAccessors, SpellDerivers, SpellNotes, SpellUtils, SpellValidators } from "../engine/Spell";
+import { FormatUtils } from "../index";
+import { rulesEngineSelectors } from "../selectors";
+import { ItemManager } from './ItemManager';
+import { getSpellManager } from './SpellManager';
+import { SpellsManager } from './SpellsManager';
+export const leveledSpellManagerMap = new Map();
+export const getLeveledSpellManager = (params) => {
+    const { spell } = params;
+    const spellManager = getSpellManager(params);
+    const leveledKnownKey = spellManager.deriveLeveledKnownKey(SpellAccessors.getCastLevel(spell));
+    if (leveledSpellManagerMap.has(leveledKnownKey)) {
+        const leveledSpellManager = leveledSpellManagerMap.get(leveledKnownKey);
+        if (!leveledSpellManager) {
+            throw new Error(`leveledSpellManager for spell ${leveledKnownKey} is null`);
+        }
+        if (leveledSpellManager.spell === spell) {
+            return leveledSpellManager;
+        }
+    }
+    const newLeveledSpellManager = new LeveledSpellManager(params);
+    leveledSpellManagerMap.set(leveledKnownKey, newLeveledSpellManager);
+    return newLeveledSpellManager;
+};
+export class LeveledSpellManager extends SpellsManager {
+    constructor(params) {
+        super(params);
+        // Handlers
+        this.onSpellLimitedUseSet = (uses) => {
+            const mappingId = this.getMappingId();
+            const mappingTypeId = this.getMappingEntityTypeId();
+            if (mappingId !== null && mappingTypeId !== null) {
+                this.dispatch(characterActions.spellUseSet(mappingId, mappingTypeId, uses, this.getDataOriginType()));
+            }
+        };
+        this.onUse = (useSpellSlot, usePactMagicSlot, dataOriginType, uses, mappingId, mappingTypeId) => {
+            if (useSpellSlot) {
+                this.handleSpellSlotChange(1, this.getCastLevel());
+            }
+            if (usePactMagicSlot) {
+                this.handlePactSlotChange(1, this.getCastLevel());
+            }
+            if (uses !== null && mappingId !== null && mappingTypeId !== null) {
+                switch (dataOriginType) {
+                    case DataOriginTypeEnum.ITEM:
+                        const item = ItemManager.getItem(mappingId);
+                        item.handleItemLimitedUseSet(uses);
+                        break;
+                    default:
+                        this.onSpellLimitedUseSet(uses);
+                }
+            }
+        };
+        this.handleSpellUse = (useSpellSlot, usePactMagicSlot) => {
+            let dataOrigin = this.getDataOrigin();
+            let dataOriginType = this.getDataOriginType();
+            let limitedUse = this.getLimitedUse();
+            let uses = null;
+            let mappingId = null;
+            let mappingTypeId = null;
+            if (limitedUse) {
+                let numberUsed = LimitedUseAccessors.getNumberUsed(limitedUse);
+                let minConsumed = LimitedUseAccessors.getMinNumberConsumed(limitedUse);
+                let consumedAmount = minConsumed + this.getScaledAmount();
+                if (dataOriginType === DataOriginTypeEnum.ITEM) {
+                    uses = numberUsed + consumedAmount;
+                    mappingId = ItemAccessors.getMappingId(dataOrigin.primary);
+                    mappingTypeId = ItemAccessors.getMappingEntityTypeId(dataOrigin.primary);
+                }
+                else {
+                    uses = numberUsed + 1;
+                    mappingId = this.getMappingId();
+                    mappingTypeId = this.getMappingEntityTypeId();
+                }
+            }
+            if (this.onUse) {
+                this.onUse(useSpellSlot, usePactMagicSlot, dataOriginType, uses, mappingId, mappingTypeId);
+            }
+        };
+        this.handleCastClick = (bothSlotsCallback) => {
+            let usesSpellSlot = this.getUsesSpellSlot();
+            let limitedUse = this.getLimitedUse();
+            let spellSlotLevel = this.getSpellSlotInfo();
+            let pactMagicLevel = this.getPactSlotInfo();
+            let doesSpellSlotExist = !!spellSlotLevel && spellSlotLevel.available > 0;
+            let doesPactSlotExist = !!pactMagicLevel && pactMagicLevel.available > 0;
+            let isSpellSlotAvailable = false;
+            if (doesSpellSlotExist && spellSlotLevel) {
+                isSpellSlotAvailable = spellSlotLevel.used < spellSlotLevel.available;
+            }
+            let isPactSlotAvailable = false;
+            if (doesPactSlotExist && pactMagicLevel) {
+                isPactSlotAvailable = pactMagicLevel.used < pactMagicLevel.available;
+            }
+            if (usesSpellSlot) {
+                if (limitedUse) {
+                    const spellDataOrigin = this.getDataOrigin();
+                    const spellDataOriginType = this.getDataOriginType();
+                    if (spellDataOriginType === DataOriginTypeEnum.CLASS_FEATURE &&
+                        ClassAccessors.isPactMagicActive(spellDataOrigin.parent)) {
+                        if (isPactSlotAvailable) {
+                            this.handleSpellUse(false, true);
+                        }
+                    }
+                    else {
+                        if (isSpellSlotAvailable) {
+                            this.handleSpellUse(true, false);
+                        }
+                    }
+                }
+                else {
+                    if (doesSpellSlotExist && doesPactSlotExist) {
+                        if (!bothSlotsCallback) {
+                            throw new Error('No callback passed for encountering both slots');
+                        }
+                        bothSlotsCallback();
+                    }
+                    else {
+                        if (isSpellSlotAvailable) {
+                            this.handleSpellUse(true, false);
+                        }
+                        else if (isPactSlotAvailable) {
+                            this.handleSpellUse(false, true);
+                        }
+                    }
+                }
+            }
+            else {
+                this.handleSpellUse(false, false);
+            }
+        };
+        // Accessors
+        this.getId = () => SpellAccessors.getId(this.spell);
+        this.getDataOrigin = () => SpellAccessors.getDataOrigin(this.spell);
+        this.getDataOriginType = () => SpellAccessors.getDataOriginType(this.spell);
+        this.getLimitedUse = () => SpellAccessors.getLimitedUse(this.spell);
+        this.getScaledAmount = () => SpellAccessors.getScaledAmount(this.spell);
+        this.getScaleType = () => SpellAccessors.getScaleType(this.spell);
+        this.getMappingId = () => SpellAccessors.getMappingId(this.spell);
+        this.getMappingEntityTypeId = () => SpellAccessors.getMappingEntityTypeId(this.spell);
+        this.getUsesSpellSlot = () => SpellAccessors.getUsesSpellSlot(this.spell);
+        this.getName = () => SpellAccessors.getName(this.spell);
+        this.asPartOfWeaponAttack = () => SpellAccessors.asPartOfWeaponAttack(this.spell);
+        this.getRequiresAttackRoll = () => SpellAccessors.getRequiresAttackRoll(this.spell);
+        this.getRequiresSavingThrow = () => SpellAccessors.getRequiresSavingThrow(this.spell);
+        this.getToHit = () => SpellAccessors.getToHit(this.spell);
+        this.getAttackSaveValue = () => SpellAccessors.getAttackSaveValue(this.spell);
+        this.getSaveDcAbilityKey = () => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            return SpellUtils.getSaveDcAbilityKey(this.spell, ruleData);
+        };
+        this.getRange = () => SpellAccessors.getRange(this.spell);
+        this.getActivation = () => SpellAccessors.getActivation(this.spell);
+        this.getCastLevel = () => SpellAccessors.getCastLevel(this.spell);
+        this.getLevel = () => SpellAccessors.getLevel(this.spell);
+        this.isAtWill = () => SpellAccessors.isAtWill(this.spell);
+        this.getMaxUses = () => SpellAccessors.getMaxUses(this.spell);
+        this.getConsumedUses = () => SpellAccessors.getConsumedUses(this.spell);
+        this.isLimitedUseAvailableAtScaledAmount = () => SpellAccessors.isLimitedUseAvailableAtScaledAmount(this.spell);
+        this.getLimitedUseNumberUsed = () => {
+            const limitedUse = this.getLimitedUse();
+            if (limitedUse) {
+                return LimitedUseAccessors.getNumberUsed(limitedUse);
+            }
+            else {
+                return null;
+            }
+        };
+        this.getExpandedDataOriginRef = () => SpellAccessors.getExpandedDataOriginRef(this.spell);
+        this.isCastAsRitual = () => SpellAccessors.isCastAsRitual(this.spell);
+        this.getNoteComponents = () => {
+            var _a;
+            const castLevel = this.getCastLevel();
+            const characterLevel = (_a = rulesEngineSelectors.getExperienceInfo(this.state)) === null || _a === void 0 ? void 0 : _a.currentLevel;
+            const abilityLookup = rulesEngineSelectors.getAbilityLookup(this.state);
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const spellScaledAmount = this.getScaledAmount();
+            const proficiencyBonus = rulesEngineSelectors.getProficiencyBonus(this.state);
+            return SpellNotes.getNoteComponents(this.spell, castLevel, characterLevel, abilityLookup, ruleData, spellScaledAmount, proficiencyBonus);
+        };
+        this.isCustomized = () => SpellAccessors.isCustomized(this.spell);
+        this.getConcentration = () => SpellAccessors.getConcentration(this.spell);
+        this.isRitual = () => SpellAccessors.isRitual(this.spell);
+        this.getCharacterLevel = () => SpellAccessors.getCharacterLevel(this.spell);
+        this.getModifiers = () => SpellAccessors.getModifiers(this.spell);
+        this.getTags = () => SpellAccessors.getTags(this.spell);
+        this.getConditions = () => SpellAccessors.getConditions(this.spell);
+        this.isLegacy = () => SpellAccessors.isLegacy(this.spell);
+        this.isValidToUsePactSlots = () => SpellValidators.isValidToUsePactSlots(this.spell);
+        // Utils
+        this.getActivationTime = () => ActivationAccessors.getTime(this.getActivation());
+        this.getActivationUnit = () => ActivationAccessors.getType(this.getActivation());
+        this.getFriendlySubtypeName = (modifier) => { var _a; return (_a = ModifierAccessors.getFriendlySubtypeName(modifier)) !== null && _a !== void 0 ? _a : ''; };
+        this.getPrimaryConditionName = () => {
+            const spellCondition = this.getConditions()[0];
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            let condition = RuleDataUtils.getCondition(spellCondition.conditionId, ruleData);
+            if (condition) {
+                return ConditionAccessors.getName(condition);
+            }
+            return null;
+        };
+        this.getDamageModifiers = (modifiers) => {
+            return modifiers.filter((modifier) => ModifierValidators.isSpellDamageModifier(modifier));
+        };
+        this.getHitPointHealingModifiers = (modifiers) => {
+            return modifiers.filter((modifier) => ModifierValidators.isSpellHealingHitPointsModifier(modifier));
+        };
+        this.getTempHitPointHealingModifiers = (modifiers) => {
+            return modifiers.filter((modifier) => ModifierValidators.isSpellHealingTempHitPointsModifier(modifier));
+        };
+        this.getEffectModifierDiceContract = (modifier) => {
+            const scaleType = this.getScaleType();
+            const points = this.getHigherLevelEntryContracts(modifier);
+            const atHigherDamage = SpellDerivers.getSpellScaledAtHigher(this.spell, scaleType, points, this.getCharacterLevel(), this.getCastLevel());
+            return SpellUtils.getSpellFinalScaledDie(this.spell, modifier, atHigherDamage);
+        };
+        this.getEffectRenderedDiceModifier = (modifier) => {
+            const scaledDamageDie = this.getEffectModifierDiceContract(modifier);
+            return DiceRenderers.renderDice(scaledDamageDie);
+        };
+        this.getHigherLevelEntryContracts = (modifier) => {
+            const atHigherLevels = ModifierAccessors.getAtHigherLevels(modifier);
+            let points = [];
+            if (atHigherLevels && atHigherLevels.points !== null) {
+                points = atHigherLevels.points;
+            }
+            return points;
+        };
+        this.getUsedSpellSlotLevelAmount = (changeAmount, spellSlots) => {
+            const foundSlotLevel = spellSlots.find((spellSlot) => spellSlot.level === this.getCastLevel());
+            if (!foundSlotLevel) {
+                return null;
+            }
+            const usedAmount = foundSlotLevel.used + changeAmount;
+            const maxAmount = foundSlotLevel.available;
+            return HelperUtils.clampInt(usedAmount, 0, maxAmount);
+        };
+        this.getSpellSlotInfo = () => {
+            const spellCasterInfo = rulesEngineSelectors.getSpellCasterInfo(this.state);
+            const { spellSlots } = spellCasterInfo;
+            let spellSlotInfo = spellSlots.find((spellSlotGroup) => spellSlotGroup.level === this.getCastLevel());
+            return spellSlotInfo ? spellSlotInfo : null;
+        };
+        this.getPactSlotInfo = () => {
+            const spellCasterInfo = rulesEngineSelectors.getSpellCasterInfo(this.state);
+            const { pactMagicSlots } = spellCasterInfo;
+            let spellSlotInfo = pactMagicSlots.find((pactSlotGroup) => pactSlotGroup.level === this.getCastLevel());
+            return spellSlotInfo ? spellSlotInfo : null;
+        };
+        this.getExpandedDataOriginRefName = () => {
+            const expandedDataOriginRef = this.getExpandedDataOriginRef();
+            if (expandedDataOriginRef) {
+                const dataOriginRefData = rulesEngineSelectors.getDataOriginRefData(this.state);
+                return EntityUtils.getDataOriginRefName(expandedDataOriginRef, dataOriginRefData);
+            }
+            else {
+                return null;
+            }
+        };
+        this.getDataOriginName = () => EntityUtils.getDataOriginName(this.getDataOrigin());
+        this.getClassId = () => {
+            if (this.getDataOriginType() === DataOriginTypeEnum.CLASS) {
+                return ClassAccessors.getMappingId(this.getDataOrigin().primary);
+            }
+            else {
+                return null;
+            }
+        };
+        this.getSchoolName = () => SpellAccessors.getSchool(this.spell);
+        this.getSchoolIconSlug = () => {
+            const school = this.getSchoolName();
+            return FormatUtils.slugify(school);
+        };
+        this.getActionMetaItems = () => {
+            const metaItems = [];
+            metaItems.push(FormatUtils.renderSpellLevelName(this.getLevel()));
+            const spellDataOrigin = this.getDataOrigin();
+            if (spellDataOrigin) {
+                const dataOriginName = this.getDataOriginName();
+                metaItems.push(dataOriginName);
+            }
+            let expandedDataOriginRefName = this.getExpandedDataOriginRefName();
+            if (expandedDataOriginRefName) {
+                metaItems.push(expandedDataOriginRefName);
+            }
+            if (this.getConcentration()) {
+                metaItems.push('Concentration');
+            }
+            if (this.isCustomized()) {
+                metaItems.push('Customized');
+            }
+            return metaItems;
+        };
+        this.deriveKnownKey = () => {
+            return SpellDerivers.deriveKnownKey(this.spell);
+        };
+        this.deriveLeveledKnownKey = (castLevel) => {
+            return SpellDerivers.deriveLeveledKnownKey(this.spell, castLevel);
+        };
+        this.params = params;
+        this.spell = params.spell;
+    }
+    static getLeveledSpellManager(knownLevelKey) {
+        const leveledSpellManager = leveledSpellManagerMap.get(knownLevelKey);
+        if (!leveledSpellManager) {
+            throw new Error(`SpellManager for spell ${knownLevelKey} is null`);
+        }
+        return leveledSpellManager;
+    }
+    static makeKnownKey(mappingId, mappingEntityTypeId) {
+        return SpellUtils.makeKnownKey(mappingId, mappingEntityTypeId);
+    }
+    static makeLeveledKnownKey(mappingId, mappingEntityTypeId, castLevel) {
+        return SpellUtils.makeLeveledKnownKey(mappingId, mappingEntityTypeId, castLevel);
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/MessageManager.js b/ddb_main/packages/rules-engine/es/managers/MessageManager.js
new file mode 100644
index 0000000..ab94149
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/MessageManager.js
@@ -0,0 +1,84 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { getCurrentRulesEngineConfig } from '../config/utils';
+import { generateGuid } from '../engine/Helper/utils';
+import { characterSelectors } from '../selectors';
+import { BaseManager } from './BaseManager';
+const messageManagerGuid = generateGuid();
+let isSubscribed = false;
+let listeningFor = {};
+export class MessageManager extends BaseManager {
+    constructor(params = {}) {
+        super(params);
+        this.setMessageBroker = (newMessageBroker) => {
+            const messageBroker = newMessageBroker || getCurrentRulesEngineConfig().messageBroker;
+            if (!messageBroker) {
+                if (process.env.NODE_ENV === 'development') {
+                    console.warn('[MessageManager]: The message manager was not able to set the messageBroker');
+                }
+                this.messageBroker = null;
+                return;
+            }
+            this.messageBroker = messageBroker;
+            if (!isSubscribed) {
+                this.subscribeToMessages();
+            }
+            isSubscribed = true;
+        };
+        this.getMessageBroker = () => {
+            if (this.messageBroker === null) {
+                // This class may have been instantiated before the message broker is ready.
+                // If so, try getting it from the rules engine config, which may have updated.
+                this.setMessageBroker();
+            }
+            return this.messageBroker;
+        };
+        this.sendMessage = (_a) => {
+            var _b, _c, _d;
+            var { data, entityId, entityType, eventType, messageScope, messageTarget, persist } = _a, rest = __rest(_a, ["data", "entityId", "entityType", "eventType", "messageScope", "messageTarget", "persist"]);
+            if (!eventType) {
+                throw new Error(`[MessageManager]: The message manager send method needs a valid eventType - ${eventType}`);
+            }
+            (_b = this.getMessageBroker()) === null || _b === void 0 ? void 0 : _b.dispatch(Object.assign({ data: Object.assign({ messageManagerGuid: this.messageManagerGuid, shouldUpdate: false }, data), entityId: entityId || this.characterId, entityType: entityType || 'character', 
+                //pending, fulfilled, or rejected
+                eventType, persist: persist || false, messageScope: messageScope || 'gameId', messageTarget: messageTarget ||
+                    ((_c = characterSelectors.getCampaign(this.state)) === null || _c === void 0 ? void 0 : _c.id.toString()) ||
+                    ((_d = this.getMessageBroker()) === null || _d === void 0 ? void 0 : _d.gameId) }, rest));
+        };
+        this.subscribeToMessages = () => {
+            var _a;
+            (_a = this.messageBroker) === null || _a === void 0 ? void 0 : _a.subscribe((msg) => {
+                try {
+                    const { messageManagerGuid, shouldUpdate } = msg === null || msg === void 0 ? void 0 : msg.data;
+                    listeningFor[msg.eventType](shouldUpdate || this.messageManagerGuid !== messageManagerGuid);
+                }
+                catch (error) {
+                    if (process.env.NODE_ENV === 'development') {
+                        console.warn(`[MessageManager]: The message manager recieved an event it does not handle(${msg.eventType})`);
+                    }
+                }
+            });
+        };
+        this.addSubscriptions = (newSubs) => {
+            listeningFor = Object.assign(Object.assign({}, listeningFor), newSubs);
+        };
+        this.EVENT_TYPES = {
+            //pending, fulfilled, or rejected
+            //TODO: add more verbose actions? chat with team about it?
+            //if we add more here - we should strongly consider changing ITEM_SHARED_FULFILLED name to something related to "update"
+            ITEM_SHARED_FULFILLED: 'character-sheet/item-shared/fulfilled',
+        };
+        this.setMessageBroker(params.messageBroker);
+        this.messageManagerGuid = messageManagerGuid;
+        this.characterId = this.state ? characterSelectors.getId(this.state).toString() : '';
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/PartyManager.js b/ddb_main/packages/rules-engine/es/managers/PartyManager.js
new file mode 100644
index 0000000..dbd5777
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/PartyManager.js
@@ -0,0 +1,56 @@
+import { serviceDataActions } from '../actions';
+import { CampaignAccessors, CampaignUtils } from '../engine/Campaign';
+import { PartyInventorySharingStateEnum } from '../engine/Campaign/constants';
+import { serviceDataSelectors } from '../selectors';
+import { MessageManager } from './MessageManager';
+export class PartyManager extends MessageManager {
+    constructor(params) {
+        super(params);
+        // Data Requests
+        this.updateSharedInventory = (shouldUpdate) => {
+            if (shouldUpdate) {
+                this.dispatch(serviceDataActions.partyInventoryRequest());
+            }
+        };
+        this.handleAcceptOnSuccess = (isShared, onSuccess) => {
+            return () => {
+                typeof onSuccess === 'function' && onSuccess();
+                if (isShared) {
+                    const data = {};
+                    const eventType = this.EVENT_TYPES.ITEM_SHARED_FULFILLED;
+                    this.sendMessage({ data, eventType });
+                }
+            };
+        };
+        this.handleRejectOnError = (onError, isShared) => {
+            return () => {
+                typeof onError === 'function' && onError();
+            };
+        };
+        // Accessors
+        this.getSharingState = () => {
+            var _a;
+            const partyInfo = serviceDataSelectors.getPartyInfo(this.state);
+            return (_a = (partyInfo && CampaignAccessors.getSharingState(partyInfo))) !== null && _a !== void 0 ? _a : PartyInventorySharingStateEnum.OFF; // if we get null return off
+        };
+        this.getPartyId = () => {
+            const partyInfo = serviceDataSelectors.getPartyInfo(this.state);
+            return partyInfo ? CampaignAccessors.getId(partyInfo) : null;
+        };
+        this.getPartyMemberName = (equippedEntityId) => {
+            const partyInfo = serviceDataSelectors.getPartyInfo(this.state);
+            if (partyInfo) {
+                return CampaignUtils.getCharacterName(partyInfo, equippedEntityId);
+            }
+            return '';
+        };
+        // Validators
+        this.isSharingTurnedOn = () => this.getSharingState() === PartyInventorySharingStateEnum.ON;
+        this.isSharingTurnedOff = () => this.getSharingState() === PartyInventorySharingStateEnum.OFF;
+        this.isSharingTurnedDeleteOnly = () => this.getSharingState() === PartyInventorySharingStateEnum.DELETE_ONLY;
+        this.isSharingTurnedOnOrDeleteOnly = () => CampaignUtils.isSharingStateActive(this.getSharingState());
+        this.addSubscriptions({
+            [this.EVENT_TYPES.ITEM_SHARED_FULFILLED]: this.updateSharedInventory,
+        });
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/SpellManager.js b/ddb_main/packages/rules-engine/es/managers/SpellManager.js
new file mode 100644
index 0000000..6d92119
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/SpellManager.js
@@ -0,0 +1,120 @@
+import { characterActions } from "../actions";
+import { ClassAccessors } from "../engine/Class";
+import { HelperUtils } from "../engine/Helper";
+import { RuleDataAccessors } from "../engine/RuleData";
+import { SpellAccessors, SpellDerivers, SpellUtils } from "../engine/Spell";
+import { rulesEngineSelectors } from "../selectors";
+import { TypeScriptUtils } from "../utils";
+import { BaseManager } from './BaseManager';
+export const spellManagerMap = new Map();
+export const getSpellManager = (params) => {
+    const { spell, classId } = params;
+    const spellId = SpellDerivers.deriveKnownKey(spell);
+    let spellKey = spellId;
+    if (classId) {
+        spellKey = `${spellId}-${classId}`;
+    }
+    if (spellManagerMap.has(spellKey)) {
+        const spellManager = spellManagerMap.get(spellKey);
+        if (!spellManager) {
+            throw new Error(`SpellManager for spell ${spellId} is null`);
+        }
+        if (spellManager.spell === spell) {
+            return spellManager;
+        }
+        else {
+            spellManager.updateSpell(params);
+            spellManagerMap.set(spellKey, spellManager);
+            return spellManager;
+        }
+    }
+    const newSpellManager = new SpellManager(params);
+    spellManagerMap.set(spellKey, newSpellManager);
+    return newSpellManager;
+};
+export class SpellManager extends BaseManager {
+    constructor(params) {
+        super(params);
+        // Handlers
+        this.handlePrepare = ({ characterClassId }, onSuccess, onError) => {
+            this.bustCache();
+            this.dispatch(characterActions.spellPreparedSet(this.spell, characterClassId, true, onSuccess));
+        };
+        this.handleUnprepare = ({ characterClassId }, onSuccess, onError) => {
+            this.bustCache();
+            this.dispatch(characterActions.spellPreparedSet(this.spell, characterClassId, false, onSuccess));
+        };
+        this.handleRemove = ({ characterClassId }, onSuccess, onError) => {
+            this.bustCache();
+            this.dispatch(characterActions.spellRemove(this.spell, characterClassId, onSuccess));
+        };
+        this.handleAdd = ({ characterClassId }, onSuccess, onError) => {
+            this.bustCache();
+            this.dispatch(characterActions.spellCreate(this.spell, characterClassId, onSuccess));
+        };
+        // Accessors
+        this.getLevel = () => SpellAccessors.getLevel(this.spell);
+        this.getName = () => SpellAccessors.getName(this.spell);
+        this.getExpandedDataOriginRef = () => SpellAccessors.getExpandedDataOriginRef(this.spell);
+        this.getUniqueKey = () => SpellAccessors.getUniqueKey(this.spell);
+        this.getId = () => SpellAccessors.getId(this.spell);
+        this.getDataOrigin = () => SpellAccessors.getDataOrigin(this.spell);
+        this.isPrepared = () => SpellAccessors.isPrepared(this.spell);
+        this.isAlwaysPrepared = () => SpellAccessors.isAlwaysPrepared(this.spell);
+        this.isCantrip = () => SpellAccessors.isCantrip(this.spell);
+        this.canRemove = () => SpellAccessors.canRemove(this.spell);
+        this.canPrepare = () => SpellAccessors.canPrepare(this.spell);
+        this.canAdd = () => SpellAccessors.canAdd(this.spell);
+        this.isCustomized = () => SpellAccessors.isCustomized(this.spell);
+        this.getConcentration = () => SpellAccessors.getConcentration(this.spell);
+        this.isRitual = () => SpellAccessors.isRitual(this.spell);
+        this.isLegacy = () => SpellAccessors.isLegacy(this.spell);
+        this.getSources = () => SpellAccessors.getSources(this.spell);
+        this.getDefinition = () => SpellAccessors.getDefinition(this.spell);
+        this.getPrimarySourceCategoryId = () => {
+            var _a, _b;
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const sources = this.getSources()
+                .map((source) => HelperUtils.lookupDataOrFallback(RuleDataAccessors.getSourceDataLookup(ruleData), source.sourceId))
+                .filter(TypeScriptUtils.isNotNullOrUndefined);
+            return ((_b = (_a = sources[0]) === null || _a === void 0 ? void 0 : _a.sourceCategory) === null || _b === void 0 ? void 0 : _b.id) || 0;
+        };
+        /*
+        Temporary solution, until Spells and Spell Managers dependence get fixed
+         */
+        this.getSpell = () => this.spell;
+        // Utils
+        this.isSpellbookCaster = () => {
+            return ClassAccessors.isSpellbookSpellcaster(this.getDataOrigin().primary);
+        };
+        this.deriveKnownKey = () => {
+            return SpellDerivers.deriveKnownKey(this.spell);
+        };
+        this.deriveLeveledKnownKey = (castLevel) => {
+            return SpellDerivers.deriveLeveledKnownKey(this.spell, castLevel);
+        };
+        this.params = params;
+        this.spell = params.spell;
+        this.bustCache = params.bustCache || function NOOP() { };
+        this.name = 'SpellManager';
+    }
+    updateSpell(params) {
+        this.params = params;
+        this.spell = params.spell;
+        this.bustCache = params.bustCache || function NOOP() { };
+        this.name = 'SpellManager';
+    }
+    static getSpellManager(knownKey) {
+        const spellManager = spellManagerMap.get(knownKey);
+        if (!spellManager) {
+            throw new Error(`SpellManager for spell ${knownKey} is null`);
+        }
+        return spellManager;
+    }
+    static makeKnownKey(mappingId, mappingEntityTypeId) {
+        return SpellUtils.makeKnownKey(mappingId, mappingEntityTypeId);
+    }
+    static makeLeveledKnownKey(mappingId, mappingEntityTypeId, castLevel) {
+        return SpellUtils.makeLeveledKnownKey(mappingId, mappingEntityTypeId, castLevel);
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/SpellsManager.js b/ddb_main/packages/rules-engine/es/managers/SpellsManager.js
new file mode 100644
index 0000000..254bed9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/SpellsManager.js
@@ -0,0 +1,256 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { characterActions, serviceDataActions } from "../actions";
+import { ApiRequestHelpers } from "../api";
+import { ApiAdapterUtils } from "../apiAdapter";
+import { ClassAccessors } from "../engine/Class";
+import { HelperUtils } from "../engine/Helper";
+import { SourceUtils } from "../engine/Source";
+import { SpellDerivers, SpellSimulators } from "../engine/Spell";
+import { apiCreatorSelectors, rulesEngineSelectors } from "../selectors";
+import { getOverallSpellInfo } from "../selectors/composite/engine";
+import { TypeScriptUtils } from "../utils";
+import { getLeveledSpellManager, LeveledSpellManager } from './LeveledSpellManager';
+import { MessageManager } from './MessageManager';
+import { getSpellManager, SpellManager } from './SpellManager';
+let spellShoppe = null;
+let apiResponses = {};
+let spellsManager = null;
+// TODO: this seems like a good pattern might want to implement else where
+export function getSpellsManager(params) {
+    if (spellsManager) {
+        return spellsManager;
+    }
+    spellsManager = new SpellsManager(params);
+    return spellsManager;
+}
+export class SpellsManager extends MessageManager {
+    constructor(params) {
+        super(params);
+        this.handleSpellSlotSet = (used, castLevel) => {
+            const spellLevelSpellSlotRequestsDataKey = ApiRequestHelpers.getSpellLevelSpellSlotRequestsDataKey(castLevel);
+            if (spellLevelSpellSlotRequestsDataKey !== null) {
+                this.dispatch(characterActions.spellLevelSpellSlotsSet({
+                    [spellLevelSpellSlotRequestsDataKey]: used,
+                }));
+            }
+        };
+        this.handleSpellSlotChange = (changeAmount, castLevel) => {
+            const spellSlots = rulesEngineSelectors.getSpellSlots(this.state);
+            const usedAmount = this.getUsedSpellSlotLevelAmount(changeAmount, spellSlots, castLevel);
+            if (usedAmount !== null) {
+                this.handleSpellSlotSet(usedAmount, castLevel);
+            }
+        };
+        this.handlePactSlotSet = (used, castLevel) => {
+            const spellLevelPactMagicRequestsDataKey = ApiRequestHelpers.getSpellLevelPactMagicRequestsDataKey(castLevel);
+            if (spellLevelPactMagicRequestsDataKey !== null) {
+                this.dispatch(characterActions.spellLevelPactMagicSlotsSet({
+                    [spellLevelPactMagicRequestsDataKey]: used,
+                }));
+            }
+        };
+        this.handlePactSlotChange = (changeAmount, castLevel) => {
+            const pactMagicSlots = rulesEngineSelectors.getPactMagicSlots(this.state);
+            const usedAmount = this.getUsedSpellSlotLevelAmount(changeAmount, pactMagicSlots, castLevel);
+            if (usedAmount !== null) {
+                this.handlePactSlotSet(usedAmount, castLevel);
+            }
+        };
+        this.getUsedSpellSlotLevelAmount = (changeAmount, spellSlots, castLevel) => {
+            const foundSlotLevel = spellSlots.find((spellSlot) => spellSlot.level === castLevel);
+            if (!foundSlotLevel) {
+                return null;
+            }
+            const usedAmount = foundSlotLevel.used + changeAmount;
+            const maxAmount = foundSlotLevel.available;
+            return HelperUtils.clampInt(usedAmount, 0, maxAmount);
+        };
+        this.handleAlwaysKnownLoad = (spells, classId) => {
+            this.dispatch(serviceDataActions.classAlwaysKnownSpellsSet(spells, classId));
+        };
+        this.transformLoadedSpells = (data) => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const overallSpellInfo = getOverallSpellInfo(this.state);
+            return data.map((definition) => SpellSimulators.simulateSpell(definition, overallSpellInfo, ruleData, null, null));
+        };
+        this.params = params;
+        this.name = 'SpellsManager';
+    }
+    bustCache() {
+        spellShoppe = null;
+    }
+    getLevelSpells() {
+        const levelSpells = rulesEngineSelectors.getLevelSpells(this.state);
+        return levelSpells.map((spells) => {
+            return spells.map((spell) => getLeveledSpellManager(Object.assign(Object.assign({}, this.params), { spell })));
+        });
+    }
+    getSpellCasterInfo() {
+        return rulesEngineSelectors.getSpellCasterInfo(this.state);
+    }
+    getClassName(charClass) {
+        const name = ClassAccessors.getName(charClass);
+        return name ? name : '';
+    }
+    getCharacterClassId(classId) {
+        const charClasses = rulesEngineSelectors.getClasses(this.state);
+        const charClassFound = charClasses.find((clazz) => {
+            return ClassAccessors.getActiveId(clazz) === classId;
+        });
+        if (charClassFound) {
+            return ClassAccessors.getMappingId(charClassFound);
+        }
+        else {
+            return null;
+        }
+    }
+    getLeveledSpell(knownLevelKey) {
+        const leveledSpellManager = LeveledSpellManager.getLeveledSpellManager(knownLevelKey);
+        if (!leveledSpellManager) {
+            throw new Error(`leveledSpellManager for spell ${knownLevelKey} is null`);
+        }
+        return leveledSpellManager;
+    }
+    getLeveledSpellManagerBySpell(spell) {
+        const spellCasterInfo = rulesEngineSelectors.getSpellCasterInfo(this.state);
+        const ruleData = rulesEngineSelectors.getRuleData(this.state);
+        const minCastLevel = SpellDerivers.getMinCastLevel(spell, spellCasterInfo, ruleData);
+        const leveledKnownKey = SpellDerivers.deriveLeveledKnownKey(spell, minCastLevel);
+        let result = null;
+        try {
+            result = this.getLeveledSpell(leveledKnownKey);
+        }
+        catch (error) {
+            // noop
+        }
+        return result;
+    }
+    getSpellManagers(spells, classId) {
+        const managers = spells.map((spell) => getSpellManager(Object.assign(Object.assign({}, this.params), { spell, bustCache: this.bustCache, classId })));
+        return managers.filter((manager, index) => managers.indexOf(manager) === index);
+    }
+    getSpell(knownKey) {
+        const spellManager = SpellManager.getSpellManager(knownKey);
+        if (!spellManager) {
+            throw new Error(`spellManager for spell ${knownKey} is null`);
+        }
+        return spellManager;
+    }
+    getSpellShoppe(shouldBustCache) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!spellShoppe || shouldBustCache) {
+                const classKnownSpells = apiCreatorSelectors.makeLoadClassAlwaysKnownSpells(this.state);
+                const classRemainingSpells = apiCreatorSelectors.makeLoadClassRemainingSpells(this.state);
+                const ruleData = rulesEngineSelectors.getRuleData(this.state);
+                let classSpellLists = rulesEngineSelectors.getClassSpellLists(this.state);
+                const classSpells = {};
+                const availableSpellRequests = classSpellLists.map((classSpellList, i) => {
+                    var _a;
+                    const classId = ClassAccessors.getActiveId(classSpellList.charClass);
+                    if (!shouldBustCache && ((_a = apiResponses === null || apiResponses === void 0 ? void 0 : apiResponses[classId]) === null || _a === void 0 ? void 0 : _a.availableSpells)) {
+                        return Promise.resolve(apiResponses[classId].availableSpells);
+                    }
+                    const availableRequest = classRemainingSpells(classSpellList.charClass);
+                    if (availableRequest) {
+                        return availableRequest();
+                    }
+                    return Promise.resolve(null);
+                });
+                const knownSpellRequests = classSpellLists.map((classSpellList, i) => {
+                    var _a;
+                    const classId = ClassAccessors.getActiveId(classSpellList.charClass);
+                    if (!shouldBustCache && ((_a = apiResponses === null || apiResponses === void 0 ? void 0 : apiResponses[classId]) === null || _a === void 0 ? void 0 : _a.knownSpells)) {
+                        return Promise.resolve(apiResponses[classId].knownSpells);
+                    }
+                    const knownRequest = classKnownSpells(classSpellList.charClass);
+                    if (knownRequest) {
+                        return knownRequest();
+                    }
+                    return Promise.resolve(null);
+                });
+                const availableSpellResponses = yield Promise.all(availableSpellRequests);
+                const knownSpellResponses = yield Promise.all(knownSpellRequests);
+                classSpellLists.forEach((classSpellList, index) => {
+                    // Dispatch any known spells into the store first
+                    const classId = ClassAccessors.getActiveId(classSpellList.charClass);
+                    apiResponses[classId] = (apiResponses === null || apiResponses === void 0 ? void 0 : apiResponses[classId]) ? apiResponses === null || apiResponses === void 0 ? void 0 : apiResponses[classId] : {};
+                    const knownSpellResponse = knownSpellResponses[index];
+                    if (knownSpellResponse) {
+                        apiResponses[classId].knownSpells = knownSpellResponse;
+                        const spellData = ApiAdapterUtils.getResponseData(knownSpellResponse);
+                        if (spellData) {
+                            this.dispatch(serviceDataActions.classAlwaysKnownSpellsSet(spellData, classId));
+                        }
+                    }
+                });
+                // Get new spelllists with properly generated spells
+                classSpellLists = rulesEngineSelectors.getClassSpellLists(this.state);
+                classSpellLists.forEach((classSpellList, index) => {
+                    const knownSpellIds = classSpellList.knownSpellIds;
+                    const availableSpellResponse = availableSpellResponses[index];
+                    const classId = ClassAccessors.getActiveId(classSpellList.charClass);
+                    apiResponses[classId] = (apiResponses === null || apiResponses === void 0 ? void 0 : apiResponses[classId]) ? apiResponses === null || apiResponses === void 0 ? void 0 : apiResponses[classId] : {};
+                    let availableSpells = [];
+                    if (availableSpellResponse) {
+                        apiResponses[classId].availableSpells = availableSpellResponse;
+                        const spellData = ApiAdapterUtils.getResponseData(availableSpellResponse);
+                        const transformed = this.transformLoadedSpells(spellData || []);
+                        const filtered = transformed.filter((spell) => !knownSpellIds.includes(SpellDerivers.deriveKnownKey(spell)));
+                        availableSpells = this.getSpellManagers(filtered, classId);
+                    }
+                    const knownSpells = this.getSpellManagers(classSpellList.spells, classId);
+                    const activeSpells = this.getSpellManagers(classSpellList.activeSpells, classId);
+                    const availableSpellDefinitions = [...availableSpells, ...knownSpells, ...activeSpells]
+                        .map((spellManager) => spellManager.getDefinition())
+                        .filter(TypeScriptUtils.isNotNullOrUndefined);
+                    const activeSourceCategories = rulesEngineSelectors.getActiveSourceCategories(this.state);
+                    const sourceCategories = SourceUtils.getSimpleSourceCategoriesData(availableSpellDefinitions, ruleData, activeSourceCategories);
+                    classSpells[classId] = {
+                        availableSpells,
+                        knownSpells,
+                        activeSpells,
+                        sourceCategories,
+                    };
+                });
+                spellShoppe = classSpells;
+                return spellShoppe;
+            }
+            else {
+                return spellShoppe;
+            }
+        });
+    }
+    getSpellClasses() {
+        return rulesEngineSelectors.getSpellClasses(this.state);
+    }
+    getClassSpellLists() {
+        return rulesEngineSelectors.getClassSpellLists(this.state);
+    }
+    getCharClassByActiveId(activeId) {
+        var _a;
+        const spellClasses = this.getSpellClasses();
+        return (_a = spellClasses.find((charClass) => charClass.activeId === activeId)) !== null && _a !== void 0 ? _a : null;
+    }
+    getClassSpellInfoByActiveId(activeId) {
+        var _a;
+        const spellClasses = this.getClassSpellLists();
+        return (_a = spellClasses.find((classSpellInfo) => classSpellInfo.charClass.activeId === activeId)) !== null && _a !== void 0 ? _a : null;
+    }
+}
+SpellsManager.getUsedSpellSlotLevelAmount = (changeAmount, spellSlots, castLevel) => {
+    const foundSlotLevel = spellSlots.find((spellSlot) => spellSlot.level === castLevel);
+    if (!foundSlotLevel) {
+        return null;
+    }
+    const usedAmount = foundSlotLevel.used + changeAmount;
+    const maxAmount = foundSlotLevel.available;
+    return HelperUtils.clampInt(usedAmount, 0, maxAmount);
+};
diff --git a/ddb_main/packages/rules-engine/es/managers/VehicleComponentManager.js b/ddb_main/packages/rules-engine/es/managers/VehicleComponentManager.js
new file mode 100644
index 0000000..941f847
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/VehicleComponentManager.js
@@ -0,0 +1,173 @@
+import { serviceDataActions } from "../actions";
+import { ActionAccessors } from "../engine/Action";
+import { CharacterUtils } from "../engine/Character";
+import { HelperUtils } from "../engine/Helper";
+import { RuleDataAccessors } from "../engine/RuleData";
+import { VehicleConfigurationPrimaryComponentManageTypeEnum } from "../engine/Vehicle";
+import { VehicleComponentAccessors } from "../engine/VehicleComponent";
+import { rulesEngineSelectors } from "../selectors";
+import { BaseManager } from './BaseManager';
+const vehicleComponentManagerMap = new Map();
+export const getVehicleComponentManager = (params) => {
+    var _a;
+    const { vehicleComponent } = params;
+    const vehicleId = (_a = VehicleComponentAccessors.getId(vehicleComponent)) !== null && _a !== void 0 ? _a : '';
+    if (vehicleComponentManagerMap.has(vehicleId)) {
+        const vehicleComponentManager = vehicleComponentManagerMap.get(vehicleId);
+        if (!vehicleComponentManager) {
+            throw new Error(`VehicleManager for vehicle ${vehicleId} is null`);
+        }
+        if (vehicleComponentManager.vehicleComponent === vehicleComponent) {
+            return vehicleComponentManager;
+        }
+    }
+    const newVehicleManger = new VehicleComponentManager(params);
+    vehicleComponentManagerMap.set(vehicleId, newVehicleManger);
+    return newVehicleManger;
+};
+export class VehicleComponentManager extends BaseManager {
+    constructor(params) {
+        super(params);
+        // Actions
+        this.handleHitPointAdjustment = ({ hitPointDiff }, onSuccess, onError) => {
+            const hitPointInfo = this.getHitPointInfo();
+            if (hitPointInfo === null) {
+                return;
+            }
+            let newHitPoints = CharacterUtils.calculateHitPoints(hitPointInfo, hitPointDiff);
+            this.dispatch(serviceDataActions.vehicleComponentMappingHitPointsSet(this.getMappingId(), newHitPoints.newRemovedHp));
+        };
+        // Accessors
+        this.getMappingId = () => VehicleComponentAccessors.getMappingId(this.vehicleComponent);
+        this.getHitPointInfo = () => VehicleComponentAccessors.getHitPointInfo(this.vehicleComponent);
+        this.getName = () => VehicleComponentAccessors.getName(this.vehicleComponent);
+        this.getTypeNames = () => VehicleComponentAccessors.getTypeNames(this.vehicleComponent);
+        this.getUniqueKey = () => VehicleComponentAccessors.getUniqueKey(this.vehicleComponent);
+        this.getArmorClassInfo = () => VehicleComponentAccessors.getArmorClassInfo(this.vehicleComponent);
+        this.getSpeedInfos = () => VehicleComponentAccessors.getSpeedInfos(this.vehicleComponent);
+        this.getCosts = () => VehicleComponentAccessors.getCosts(this.vehicleComponent);
+        this.getIsPrimary = () => VehicleComponentAccessors.getIsPrimary(this.vehicleComponent);
+        this.getActions = () => VehicleComponentAccessors.getActions(this.vehicleComponent);
+        this.getDisplayOrder = () => VehicleComponentAccessors.getDisplayOrder(this.vehicleComponent);
+        this.getIsRemovable = () => VehicleComponentAccessors.getIsRemovable(this.vehicleComponent);
+        this.getUniquenessFactor = () => VehicleComponentAccessors.getUniquenessFactor(this.vehicleComponent);
+        this.getCoverType = () => VehicleComponentAccessors.getCoverType(this.vehicleComponent);
+        this.getRequiredCrew = () => VehicleComponentAccessors.getRequiredCrew(this.vehicleComponent);
+        this.getDamageThreshold = () => VehicleComponentAccessors.getDamageThreshold(this.vehicleComponent);
+        this.getMishapThreshold = () => VehicleComponentAccessors.getMishapThreshold(this.vehicleComponent);
+        this.getHitPoints = () => VehicleComponentAccessors.getDefinitionHitPoints(this.vehicleComponent);
+        this.getHitPointSpeedAdjustments = () => VehicleComponentAccessors.getHitPointSpeedAdjustments(this.vehicleComponent);
+        this.getVehicleMappingId = () => VehicleComponentAccessors.getVehicleMappingId(this.vehicleComponent);
+        this.getDescription = () => VehicleComponentAccessors.getDescription(this.vehicleComponent);
+        // Utils
+        this.generateVehicleComponentCoverType = () => {
+            if (!this.vehicle.getEnableComponentCover()) {
+                return null;
+            }
+            const coverType = this.getCoverType();
+            if (coverType === null) {
+                return null;
+            }
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const coverTypeLookup = RuleDataAccessors.getCoverTypeLookup(ruleData);
+            const cover = HelperUtils.lookupDataOrFallback(coverTypeLookup, coverType);
+            return cover ? cover.name : null;
+        };
+        this.generateVehicleComponentRequiredCrew = () => {
+            const enableRequiredCrew = this.vehicle.getEnableComponentCrewRequirements();
+            return enableRequiredCrew ? this.getRequiredCrew() : null;
+        };
+        this.generateVehicleComponentArmorClassInfo = () => {
+            const enableArmorClass = this.vehicle.getEnableComponentArmorClass();
+            if (enableArmorClass && this.allowComponentProperty()) {
+                return this.getArmorClassInfo();
+            }
+            return null;
+        };
+        this.generateEnableComponentManagement = () => {
+            if (this.generateVehicleBlockComponentHitPointInfo() !== null) {
+                return true;
+            }
+            return false;
+        };
+        this.generateVehicleBlockComponentInfo = () => {
+            const uniqueKey = this.getUniqueKey();
+            return {
+                actions: this.getActions().map((action) => {
+                    return {
+                        name: ActionAccessors.getName(action),
+                        description: ActionAccessors.getDescription(action),
+                        key: `${ActionAccessors.getName(action)}-${ActionAccessors.getUniqueKey(action)}`,
+                        ammo: ActionAccessors.getAmmunition(action),
+                    };
+                }),
+                count: 1,
+                description: this.getDescription(),
+                displayOrder: this.getDisplayOrder(),
+                isPrimaryComponent: this.getIsPrimary(),
+                isRemovable: this.getIsRemovable(),
+                name: this.getName(),
+                typeNames: this.getTypeNames(),
+                coverType: this.generateVehicleComponentCoverType(),
+                requiredCrew: this.generateVehicleComponentRequiredCrew(),
+                key: uniqueKey,
+                uniqueKey,
+                uniquenessFactor: this.getUniquenessFactor(),
+                id: this.getMappingId(),
+                vehicleId: this.vehicle.getMappingId(),
+                displayType: this.vehicle.getDisplayType(),
+                armorClassInfo: this.generateVehicleComponentArmorClassInfo(),
+                speedInfos: this.generateVehicleComponentSpeedInfos(),
+                hitPointInfo: this.generateVehicleBlockComponentHitPointInfo(),
+                enableComponentManagement: this.generateEnableComponentManagement(),
+                costInfos: this.getCosts(),
+                width: this.vehicle.getWidth(),
+                length: this.vehicle.getLength(),
+            };
+        };
+        this.params = params;
+        this.vehicleComponent = params.vehicleComponent;
+        this.vehicle = params.vehicle;
+    }
+    // Validators
+    allowComponentProperty() {
+        const primaryManageType = this.vehicle.getPrimaryComponentManageType();
+        const isPrimaryComponent = this.getIsPrimary();
+        return !(primaryManageType === VehicleConfigurationPrimaryComponentManageTypeEnum.VEHICLE && isPrimaryComponent);
+    }
+    generateVehicleComponentSpeedInfos() {
+        const enableSpeeds = this.vehicle.getEnableComponentSpeeds();
+        if (enableSpeeds && this.allowComponentProperty()) {
+            return this.getSpeedInfos();
+        }
+        return [];
+    }
+    generateVehicleBlockComponentHitPointInfo() {
+        if (!this.allowComponentProperty()) {
+            return null;
+        }
+        const enableComponentHitPoints = this.vehicle.getEnableComponentHitPoints();
+        if (!enableComponentHitPoints) {
+            return null;
+        }
+        let damageThreshold = null;
+        if (this.vehicle.getEnableComponentDamageThreshold()) {
+            damageThreshold = this.getDamageThreshold();
+        }
+        let mishapThreshold = null;
+        if (this.vehicle.getEnableComponentMishapThreshold()) {
+            mishapThreshold = this.getMishapThreshold();
+        }
+        let componentHitPointInfo = this.getHitPointInfo();
+        const definitionHitPoints = this.getHitPoints();
+        return {
+            remainingHp: componentHitPointInfo !== null ? componentHitPointInfo.remainingHp : definitionHitPoints,
+            tempHp: componentHitPointInfo !== null ? componentHitPointInfo.tempHp : null,
+            totalHp: componentHitPointInfo !== null ? componentHitPointInfo.totalHp : definitionHitPoints,
+            removedHp: componentHitPointInfo !== null ? componentHitPointInfo.removedHp : 0,
+            hitPointSpeedAdjustments: this.getHitPointSpeedAdjustments(),
+            damageThreshold,
+            mishapThreshold,
+        };
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/VehicleManager.js b/ddb_main/packages/rules-engine/es/managers/VehicleManager.js
new file mode 100644
index 0000000..fc95621
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/VehicleManager.js
@@ -0,0 +1,228 @@
+import { AccessUtils } from "../engine/Access";
+import { ActionValidators } from "../engine/Action";
+import { ActivationTypeEnum } from "../engine/Activation";
+import { ConditionAccessors } from "../engine/Condition";
+import { ExtraGenerators } from "../engine/Extra";
+import { RuleDataUtils } from "../engine/RuleData";
+import { SourceUtils } from "../engine/Source";
+import { TypeScriptUtils } from "../utils";
+import { ActionUtils } from '..';
+import { serviceDataActions } from '../actions';
+import { VehicleAccessors, VehicleConfigurationDisplayTypeEnum, VehicleConfigurationKeyEnum, VehicleConfigurationPrimaryComponentManageTypeEnum, VehicleUtils, } from '../engine/Vehicle';
+import { rulesEngineSelectors } from '../selectors';
+import { BaseManager } from './BaseManager';
+import { getVehicleComponentManager } from './VehicleComponentManager';
+const vehicleManagerMap = new Map();
+export const getVehicleManager = (params) => {
+    const { vehicle } = params;
+    const vehicleId = VehicleAccessors.getId(vehicle);
+    if (vehicleManagerMap.has(vehicleId)) {
+        const vehicleManager = vehicleManagerMap.get(vehicleId);
+        if (!vehicleManager) {
+            throw new Error(`VehicleManager for vehicle ${vehicleId} is null`);
+        }
+        if (vehicleManager.vehicle === vehicle) {
+            return vehicleManager;
+        }
+    }
+    const newVehicleManger = new VehicleManager(params);
+    vehicleManagerMap.set(vehicleId, newVehicleManger);
+    return newVehicleManger;
+};
+export class VehicleManager extends BaseManager {
+    constructor(params) {
+        super(params);
+        // Actions
+        this.handleRemove = (onSuccess, onError) => {
+            this.dispatch(serviceDataActions.vehicleMappingRemove(this.getMappingId()));
+        };
+        this.handleDataUpdate = ({ properties }, onSuccess, onError) => {
+            this.dispatch(serviceDataActions.vehicleMappingDataSet(this.getMappingId(), properties));
+        };
+        this.handleFuelChange = ({ remainingFuel }, onSuccess, onError) => {
+            this.dispatch(serviceDataActions.vehicleMappingRemainingFuelSet(this.getMappingId(), remainingFuel));
+        };
+        this.handleConditionLevelChange = (conditionId, newLevel, prevLevel) => {
+            const vehicleId = this.getMappingId();
+            if (!prevLevel && newLevel !== null) {
+                this.dispatch(serviceDataActions.vehicleMappingConditionAdd(vehicleId, conditionId, newLevel));
+            }
+            else if (!newLevel) {
+                this.dispatch(serviceDataActions.vehicleMappingConditionRemove(vehicleId, conditionId));
+            }
+            else {
+                this.dispatch(serviceDataActions.vehicleMappingConditionSet(vehicleId, conditionId, newLevel));
+            }
+        };
+        // Accessors
+        this.getAccessType = () => VehicleAccessors.getAccessType(this.vehicle);
+        this.getMappingId = () => VehicleAccessors.getMappingId(this.vehicle);
+        this.getPrimaryComponent = () => getVehicleComponentManager({
+            vehicle: this,
+            vehicleComponent: VehicleAccessors.getPrimaryComponent(this.vehicle),
+        });
+        this.getName = () => VehicleAccessors.getName(this.vehicle);
+        this.getDescription = () => VehicleAccessors.getDescription(this.vehicle);
+        this.getLargeAvatarUrl = () => VehicleAccessors.getLargeAvatarUrl(this.vehicle);
+        this.getDefinitionName = () => VehicleAccessors.getDefinitionName(this.vehicle);
+        this.getMovementNames = () => VehicleAccessors.getMovementNames(this.vehicle);
+        this.getDefinitionDescription = () => VehicleAccessors.getDefinitionDescription(this.vehicle);
+        this.getSources = () => VehicleAccessors.getSources(this.vehicle);
+        this.getFuelData = () => VehicleAccessors.getFuelData(this.vehicle);
+        this.getEnabledConditions = () => VehicleAccessors.getEnabledConditions(this.vehicle);
+        this.getActiveConditionLookup = () => VehicleAccessors.getActiveConditionLookup(this.vehicle);
+        this.getPrimaryComponentManageType = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.PRIMARY_COMPONENT_MANAGE_TYPE, this.vehicle);
+        this.getDisplayType = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.DISPLAY_TYPE, this.vehicle);
+        this.getEnableConditionTracking = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_CONDITIONS_TRACKING, this.vehicle);
+        this.getEnableFuelTracking = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_FUEL_TRACKING, this.vehicle);
+        this.getEnableActionStations = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_ACTION_STATIONS, this.vehicle);
+        this.getEnableTravelPace = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_TRAVEL_PACE, this.vehicle);
+        this.getEnableComponentCover = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_COMPONENT_COVER, this.vehicle);
+        this.getEnableComponentArmorClass = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_COMPONENT_ARMOR_CLASS, this.vehicle);
+        this.getEnableComponentSpeeds = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_COMPONENT_SPEEDS, this.vehicle);
+        this.getEnableComponentHitPoints = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_COMPONENT_HIT_POINTS, this.vehicle);
+        this.getEnableComponentDamageThreshold = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_COMPONENT_DAMAGE_THRESHOLD, this.vehicle);
+        this.getEnableComponentMishapThreshold = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_COMPONENT_MISHAP_THRESHOLD, this.vehicle);
+        this.getEnableComponents = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_COMPONENTS, this.vehicle);
+        this.getEnableComponentCrewRequirements = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_COMPONENT_CREW_REQUIREMENTS, this.vehicle);
+        this.getUrl = () => VehicleAccessors.getUrl(this.vehicle);
+        this.getUniqueKey = () => VehicleAccessors.getUniqueKey(this.vehicle);
+        this.getAvatarUrl = () => VehicleAccessors.getAvatarUrl(this.vehicle);
+        this.isHomebrew = () => VehicleAccessors.isHomebrew(this.vehicle);
+        this.getType = () => VehicleAccessors.getType(this.vehicle);
+        this.getComponents = () => {
+            return VehicleAccessors.getComponents(this.vehicle).map((vehicleComponent) => getVehicleComponentManager(Object.assign(Object.assign({}, this.params), { vehicle: this, vehicleComponent })));
+        };
+        this.getActionStations = () => {
+            return VehicleAccessors.getActionStations(this.vehicle).map((vehicleComponent) => getVehicleComponentManager(Object.assign(Object.assign({}, this.params), { vehicle: this, vehicleComponent })));
+        };
+        this.getEnableFeatures = () => VehicleUtils.getConfigurationValue(VehicleConfigurationKeyEnum.ENABLE_FEATURES, this.vehicle);
+        this.getFeatures = () => VehicleAccessors.getFeatures(this.vehicle);
+        this.getWeight = () => VehicleAccessors.getWeight(this.vehicle);
+        this.getWidth = () => VehicleAccessors.getWidth(this.vehicle);
+        this.getLength = () => VehicleAccessors.getLength(this.vehicle);
+        this.getSizeInfo = () => VehicleAccessors.getSizeInfo(this.vehicle);
+        this.getCargoCapacity = () => VehicleAccessors.getCargoCapacity(this.vehicle);
+        this.getCargoCapacityDescription = () => VehicleAccessors.getCargoCapacityDescription(this.vehicle);
+        this.getConditionImmunityInfos = () => VehicleAccessors.getConditionImmunityInfos(this.vehicle);
+        this.getCreatureCapacityDescriptions = () => VehicleAccessors.getCreatureCapacityDescriptions(this.vehicle);
+        this.getCreatureCapacity = () => VehicleAccessors.getCreatureCapacity(this.vehicle);
+        this.getDamageImmunityInfos = () => VehicleAccessors.getDamageImmunityInfos(this.vehicle);
+        this.getActionSummaries = () => VehicleAccessors.getActionSummaries(this.vehicle);
+        this.getActionsText = () => VehicleAccessors.getActionsText(this.vehicle);
+        this.getStats = () => VehicleAccessors.getStats(this.vehicle);
+        this.getTravelPace = () => VehicleAccessors.getTravelPace(this.vehicle);
+        this.getTravelPaceEffectiveHours = () => VehicleAccessors.getTravelPaceEffectiveHours(this.vehicle);
+        this.getAllActions = () => VehicleAccessors.getAllActions(this.vehicle);
+        // Validators
+        this.isAccessible = () => AccessUtils.isAccessible(this.getAccessType());
+        this.isSpelljammer = () => this.getDisplayType() === VehicleConfigurationDisplayTypeEnum.SPELLJAMMER;
+        this.isInfernalWarMachine = () => this.getDisplayType() === VehicleConfigurationDisplayTypeEnum.INFERNAL_WAR_MACHINE;
+        this.isShip = () => this.getDisplayType() === VehicleConfigurationDisplayTypeEnum.SHIP;
+        // Utils
+        this.generateVehicleMeta = () => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            return ExtraGenerators.generateVehicleMeta(this.vehicle, ruleData);
+        };
+        this.getSourceNames = () => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            return SourceUtils.getSourceFullNames(this.getSources(), ruleData);
+        };
+        this.getResolvedEnabledConditions = () => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            return this.getEnabledConditions().map((id) => RuleDataUtils.getCondition(id, ruleData));
+        };
+        this.getVehicleSizeName = () => { var _a, _b; return (_b = (_a = this.getSizeInfo()) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : null; };
+        this.getVehicleTypeName = () => {
+            const ruleData = rulesEngineSelectors.getRuleData(this.state);
+            const type = this.getType();
+            if (type === null) {
+                return null;
+            }
+            return RuleDataUtils.getObjectTypeName(type, ruleData);
+        };
+        this.getVehicleCargoCapacityInfo = () => {
+            return {
+                weight: this.getCargoCapacity(),
+                description: this.getCargoCapacityDescription(),
+            };
+        };
+        this.generateVehicleConditionImmunityNames = () => {
+            return this.getConditionImmunityInfos().map((conditionInfo) => ConditionAccessors.getName(conditionInfo));
+        };
+        this.generateVehicleDamageImmunityNames = () => {
+            return this.getDamageImmunityInfos()
+                .map((immunityInfo) => immunityInfo.name)
+                .filter(TypeScriptUtils.isNotNullOrUndefined);
+        };
+        this.generateFeatures = () => {
+            return this.getEnableFeatures() ? this.getFeatures() : [];
+        };
+        this.generateVehicleComponentTravelPaceInfo = () => {
+            const enableTravelPace = this.getEnableTravelPace();
+            if (!enableTravelPace) {
+                return null;
+            }
+            const pace = this.getTravelPace();
+            const effectiveHours = this.getTravelPaceEffectiveHours();
+            return pace !== null
+                ? {
+                    pace,
+                    effectiveHours,
+                }
+                : null;
+        };
+        this.params = params;
+        this.vehicle = params.vehicle;
+    }
+    generateVehicleBlockActionsSummaries() {
+        const ruleData = rulesEngineSelectors.getRuleData(this.state);
+        return this.getActionSummaries().map((action) => {
+            let sourceInfo = null;
+            if (action.sourceId !== null) {
+                sourceInfo = RuleDataUtils.getSourceDataInfo(action.sourceId, ruleData);
+            }
+            return Object.assign(Object.assign({}, action), { sourceName: sourceInfo ? sourceInfo.name : null, sourceFullName: sourceInfo ? sourceInfo.description : null });
+        });
+    }
+    generateVehicleActionsSummaries() {
+        return {
+            actionsText: this.getActionsText(),
+            actionsSummaries: this.generateVehicleBlockActionsSummaries(),
+        };
+    }
+    generateVehicleActionStationsInfo() {
+        return this.getActionStations().map((station) => station.generateVehicleBlockComponentInfo());
+    }
+    generateVehicleComponentsBlockInfo() {
+        return this.getComponents().map((component) => component.generateVehicleBlockComponentInfo());
+    }
+    generateVehicleActionInfo(action) {
+        return {
+            name: ActionUtils.getName(action),
+            description: ActionUtils.getDescription(action),
+            key: `${ActionUtils.getName(action)}-${ActionUtils.getUniqueKey(action)}`,
+            ammo: ActionUtils.getAmmunition(action),
+        };
+    }
+    generateVehicleBlockActions(activationType, actions) {
+        return actions
+            .filter((action) => ActionValidators.validateIsActivationType(action, activationType))
+            .map(this.generateVehicleActionInfo);
+    }
+    generateVehicleBlockActionsInfo() {
+        const allActions = this.getAllActions();
+        return {
+            reactions: this.generateVehicleBlockActions(ActivationTypeEnum.REACTION, allActions),
+            bonusActions: this.generateVehicleBlockActions(ActivationTypeEnum.BONUS_ACTION, allActions),
+            special: this.generateVehicleBlockActions(ActivationTypeEnum.SPECIAL, allActions),
+        };
+    }
+    generateVehicleBlockPrimaryHitPointInfo() {
+        const primaryManageType = this.getPrimaryComponentManageType();
+        if (primaryManageType === VehicleConfigurationPrimaryComponentManageTypeEnum.COMPONENT) {
+            return null;
+        }
+        return this.getPrimaryComponent().generateVehicleBlockComponentHitPointInfo();
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/utils/Filter/utils.js b/ddb_main/packages/rules-engine/es/managers/utils/Filter/utils.js
new file mode 100644
index 0000000..9353bf9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/utils/Filter/utils.js
@@ -0,0 +1,79 @@
+/**
+ *
+ * @param input
+ * @param startIdx
+ * @param pieceIdx
+ * @param pieceCharIdx
+ * @param pieces
+ */
+export function checkQueryPiece(input, startIdx, pieceIdx, pieceCharIdx, pieces) {
+    let i;
+    let ch;
+    let length = input.length;
+    for (i = startIdx; i < length; i++) {
+        ch = input.charAt(i);
+        switch (ch) {
+            case ' ':
+            case '-':
+            case '.':
+            case '"':
+                continue; //ignore spaces, dashes, periods, and double quotes
+            default:
+                if (pieceIdx < pieces.length) {
+                    let piece = pieces[pieceIdx];
+                    if (pieceCharIdx < piece.length && ch === piece.charAt(pieceCharIdx)) {
+                        //if current character matches, check next character in piece
+                        if (checkQueryPiece(input, i + 1, pieceIdx, pieceCharIdx + 1, pieces)) {
+                            return true;
+                        }
+                        //if path for next character doesn't match, try path from start of next piece
+                        if (checkQueryPiece(input, i + 1, pieceIdx + 1, 0, pieces)) {
+                            return true;
+                        }
+                    }
+                    if (pieceCharIdx === 0) {
+                        //if first character of piece doesn't match, allow skipping that piece
+                        if (checkQueryPiece(input, i, pieceIdx + 1, 0, pieces)) {
+                            return true;
+                        }
+                    }
+                }
+                return false; //no match if no path above reaches end of input string
+        }
+    }
+    return true; //match if reached end of input string
+}
+/**
+ *
+ * @param query
+ * @param primaryText
+ * @param tags
+ */
+export function doesQueryMatchData(query, primaryText, tags = []) {
+    let input = query.toLowerCase().trim();
+    if (!input) {
+        // if there is no query don't filter anything
+        return true;
+    }
+    let processedPrimaryText = primaryText ? primaryText.replace(/["+]/g, '').toLowerCase().trim() : '';
+    let processedTags = tags && tags.length ? tags.map((tag) => (tag ? tag.toLowerCase().trim() : tag)) : [];
+    let pieces = processedPrimaryText.split(/[ -]/);
+    if (checkQueryPiece(input, 0, 0, 0, pieces)) {
+        //don't filter out item if heading matches
+        return true;
+    }
+    // if heading isn't a match, see if input is an exact match for associated tags
+    if (!processedTags.length) {
+        // filter out item if no tags specified
+        return false;
+    }
+    let tagMatch = false;
+    processedTags.forEach((tag) => {
+        if (tagMatch || !tag) {
+            return;
+        }
+        let pieces = tag.split(/[ -]/);
+        tagMatch = checkQueryPiece(input, 0, 0, 0, pieces);
+    });
+    return tagMatch;
+}
diff --git a/ddb_main/packages/rules-engine/es/managers/utils/modifierTransformers/abilityScores.js b/ddb_main/packages/rules-engine/es/managers/utils/modifierTransformers/abilityScores.js
new file mode 100644
index 0000000..c05caa7
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/managers/utils/modifierTransformers/abilityScores.js
@@ -0,0 +1,148 @@
+import { ExpressionOperators, StatementOperators } from '@dndbeyond/character-gfs';
+import { ModifierAccessors, ModifierTypeEnum, ModifierValidators } from "../../../engine/Modifier";
+import { RuleDataUtils } from "../../../engine/RuleData";
+export function transformAbilityScores(validGlobalModifiers, baseStats, ruleData) {
+    const abilityScoreModifiers = validGlobalModifiers.filter((modifier) => {
+        return (ModifierValidators.isValidStatScoreModifier(modifier, 1) ||
+            ModifierValidators.isValidStatScoreModifier(modifier, 2) ||
+            ModifierValidators.isValidStatScoreModifier(modifier, 3) ||
+            ModifierValidators.isValidStatScoreModifier(modifier, 4) ||
+            ModifierValidators.isValidStatScoreModifier(modifier, 5) ||
+            ModifierValidators.isValidStatScoreModifier(modifier, 6));
+    });
+    const baseAbilityScores = baseStats.flatMap((stat) => {
+        var _a, _b, _c;
+        if (stat.id) {
+            const statName = (_b = (_a = RuleDataUtils.getStatNameById(stat.id, ruleData, true)) === null || _a === void 0 ? void 0 : _a.toLowerCase()) !== null && _b !== void 0 ? _b : '';
+            stat.value = (_c = stat.value) !== null && _c !== void 0 ? _c : 0;
+            // Math.floor((stat.value - 10) / 2)
+            return [
+                {
+                    precedence: 0.5,
+                    target: ['attributes', statName, 'value'],
+                    operator: StatementOperators.SET,
+                    operand: {
+                        operator: ExpressionOperators.STATIC_VALUE,
+                        values: [stat.value],
+                        operands: null,
+                    },
+                },
+                {
+                    precedence: 0.5,
+                    target: ['attributes', statName, 'modifier'],
+                    operator: StatementOperators.SET,
+                    operand: {
+                        operator: ExpressionOperators.FLOOR,
+                        values: null,
+                        operands: [
+                            {
+                                operator: ExpressionOperators.MULTIPLY,
+                                values: null,
+                                operands: [
+                                    {
+                                        operator: ExpressionOperators.STATIC_VALUE,
+                                        values: [0.5],
+                                        operands: null,
+                                    },
+                                    {
+                                        operator: ExpressionOperators.ADD,
+                                        values: null,
+                                        operands: [
+                                            {
+                                                operator: ExpressionOperators.STATIC_VALUE,
+                                                values: [-10],
+                                                operands: null,
+                                            },
+                                            {
+                                                operator: ExpressionOperators.DYNAMIC_VALUE,
+                                                values: ['attributes', statName, 'value'],
+                                                operands: null,
+                                            },
+                                        ],
+                                    },
+                                ],
+                            },
+                        ],
+                    },
+                },
+                {
+                    precedence: 0.5,
+                    target: ['attributes', statName, 'max'],
+                    operator: StatementOperators.SET,
+                    operand: {
+                        operator: ExpressionOperators.STATIC_VALUE,
+                        values: [20],
+                        operands: null,
+                    },
+                },
+            ];
+        }
+        return [];
+    });
+    const gfsAbilityScores = abilityScoreModifiers.map((abilityScoreModifier) => {
+        var _a, _b, _c, _d;
+        const modifierType = ModifierAccessors.getType(abilityScoreModifier);
+        switch (modifierType) {
+            case ModifierTypeEnum.SET:
+                return {
+                    precedence: 0.5,
+                    target: [
+                        'attributes',
+                        (_a = ModifierAccessors.getSubType(abilityScoreModifier)) === null || _a === void 0 ? void 0 : _a.replace('-score', ''),
+                        'value',
+                    ],
+                    operator: StatementOperators.SET,
+                    operand: {
+                        operator: ExpressionOperators.STATIC_VALUE,
+                        values: [ModifierAccessors.getValue(abilityScoreModifier)],
+                    },
+                };
+            case ModifierTypeEnum.BONUS:
+            default:
+                return {
+                    precedence: 0.5,
+                    target: [
+                        'attributes',
+                        (_b = ModifierAccessors.getSubType(abilityScoreModifier)) === null || _b === void 0 ? void 0 : _b.replace('-score', ''),
+                        'value',
+                    ],
+                    operator: StatementOperators.SET,
+                    operand: {
+                        operator: ExpressionOperators.ADD,
+                        values: null,
+                        operands: [
+                            {
+                                operator: ExpressionOperators.DYNAMIC_VALUE,
+                                operands: null,
+                                values: [
+                                    'attributes',
+                                    (_c = ModifierAccessors.getSubType(abilityScoreModifier)) === null || _c === void 0 ? void 0 : _c.replace('-score', ''),
+                                    'value',
+                                ],
+                            },
+                            {
+                                operator: ExpressionOperators.STATIC_VALUE,
+                                values: [(_d = ModifierAccessors.getValue(abilityScoreModifier)) !== null && _d !== void 0 ? _d : 0],
+                                operands: null,
+                            },
+                        ],
+                    },
+                };
+        }
+    });
+    const generatedFeature = {
+        meta: {
+            name: 'Generated Ability Scores',
+            category: 'Generated',
+        },
+        statements: [...baseAbilityScores, ...gfsAbilityScores],
+        featureId: 'generated-ability-scores',
+        labels: [],
+        sources: [],
+        subfeatures: [],
+        acceptableInputs: {},
+        primarySource: null,
+        secondarySources: [],
+    };
+    return { baseAbilityScores, gfsAbilityScores, generatedFeature };
+}
diff --git a/ddb_main/packages/rules-engine/es/notification/constants.js b/ddb_main/packages/rules-engine/es/notification/constants.js
new file mode 100644
index 0000000..c8cce96
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/notification/constants.js
@@ -0,0 +1,8 @@
+export var NotificationTypeEnum;
+(function (NotificationTypeEnum) {
+    NotificationTypeEnum["INFO"] = "INFO";
+    NotificationTypeEnum["SUCCESS"] = "SUCCESS";
+    NotificationTypeEnum["ERROR"] = "ERROR";
+    NotificationTypeEnum["WARNING"] = "WARNING";
+    NotificationTypeEnum["CRITICAL"] = "CRITICAL";
+})(NotificationTypeEnum || (NotificationTypeEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/notification/utils.js b/ddb_main/packages/rules-engine/es/notification/utils.js
new file mode 100644
index 0000000..571cbfd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/notification/utils.js
@@ -0,0 +1,14 @@
+import { ConfigUtils } from '../config';
+import { NotificationTypeEnum } from './constants';
+/**
+ *
+ * @param title
+ * @param message
+ * @param notificationType
+ */
+export function dispatchMessage(title, message, notificationType = NotificationTypeEnum.SUCCESS) {
+    const rulesEngineConfig = ConfigUtils.getCurrentRulesEngineConfig();
+    if (rulesEngineConfig === null || rulesEngineConfig === void 0 ? void 0 : rulesEngineConfig.onNotification) {
+        rulesEngineConfig.onNotification(title, message, notificationType);
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/reducers/character.js b/ddb_main/packages/rules-engine/es/reducers/character.js
new file mode 100644
index 0000000..a927f6d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/reducers/character.js
@@ -0,0 +1,1322 @@
+import * as actionTypes from '../actions/character/actionTypes';
+import * as serviceDataActionTypes from '../actions/serviceData/actionTypes';
+import { ActionAccessors } from '../engine/Action';
+import { CreatureAccessors } from '../engine/Creature';
+import { DataOriginTypeEnum } from '../engine/DataOrigin';
+import { DefinitionHacks } from '../engine/Definition';
+import { LimitedUseResetTypeEnum } from '../engine/LimitedUse';
+import { SpellAccessors } from '../engine/Spell';
+import { initialChoiceComponentState, } from '../generated';
+import { updateSpellSlots } from './utils';
+export const initialCoinState = {
+    cp: 0,
+    ep: 0,
+    gp: 0,
+    pp: 0,
+    sp: 0,
+};
+export function currencies(state = initialCoinState, action) {
+    let newCurrencies = state;
+    if (newCurrencies === null) {
+        newCurrencies = {
+            cp: 0,
+            ep: 0,
+            gp: 0,
+            pp: 0,
+            sp: 0,
+        };
+    }
+    switch (action.type) {
+        case actionTypes.CURRENCIES_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_CURRENCIES_SET_COMMIT:
+            return Object.assign({}, action.payload);
+        case actionTypes.CURRENCY_COPPER_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_COPPER_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_COPPER_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_CURRENCY_COPPER_SET_COMMIT:
+            return Object.assign(Object.assign({}, newCurrencies), { cp: action.payload.amount });
+        case actionTypes.CURRENCY_ELECTRUM_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_ELECTRUM_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_ELECTRUM_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_CURRENCY_ELECTRUM_SET_COMMIT:
+            return Object.assign(Object.assign({}, newCurrencies), { ep: action.payload.amount });
+        case actionTypes.CURRENCY_GOLD_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_GOLD_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_GOLD_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_CURRENCY_GOLD_SET_COMMIT:
+            return Object.assign(Object.assign({}, newCurrencies), { gp: action.payload.amount });
+        case actionTypes.CURRENCY_PLATINUM_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_PLATINUM_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_PLATINUM_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_CURRENCY_PLATINUM_SET_COMMIT:
+            return Object.assign(Object.assign({}, newCurrencies), { pp: action.payload.amount });
+        case actionTypes.CURRENCY_SILVER_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_SILVER_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_SILVER_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_CURRENCY_SILVER_SET_COMMIT:
+            return Object.assign(Object.assign({}, newCurrencies), { sp: action.payload.amount });
+        case actionTypes.ITEM_CURRENCY_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_SET_COMMIT:
+            return state
+                ? Object.assign(Object.assign({}, state), action.payload.currency) : Object.assign({}, action.payload.currency);
+        default:
+        //not implemented
+    }
+    return newCurrencies;
+}
+const initialLimitedUseState = {
+    maxNumberConsumed: 0,
+    maxUses: 0,
+    minNumberConsumed: 0,
+    name: '',
+    numberUsed: 0,
+    operator: null,
+    resetDice: null,
+    resetType: LimitedUseResetTypeEnum.SHORT_REST,
+    statModifierUsesId: null,
+    proficiencyBonusOperator: null,
+    useProficiencyBonus: false,
+};
+function limitedUse(state = initialLimitedUseState, action) {
+    switch (action.type) {
+        case actionTypes.ACTION_USE_SET_COMMIT:
+        case actionTypes.SPELL_USE_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { numberUsed: action.payload.uses });
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialItemLimitedUseState = {
+    maxUses: 0,
+    numberUsed: 0,
+    resetType: null,
+    resetTypeDescription: null,
+};
+function itemLimitedUse(state = initialItemLimitedUseState, action) {
+    switch (action.type) {
+        case actionTypes.ITEM_CHARGES_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CHARGES_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { numberUsed: action.payload.uses });
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialStatEntityState = {
+    id: -1,
+    value: null,
+    name: '',
+};
+function statEntity(state = initialStatEntityState, action) {
+    switch (action.type) {
+        case actionTypes.ABILITY_SCORE_BASE_SET_COMMIT:
+        case actionTypes.ABILITY_SCORE_OVERRIDE_SET_COMMIT:
+        case actionTypes.ABILITY_SCORE_BONUS_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { value: action.payload.value });
+        default:
+        // not implemented
+    }
+    return state;
+}
+function getKeyedComponentData(state, action, actionKey, key) {
+    if (action.payload[actionKey].hasOwnProperty(key)) {
+        return action.payload[actionKey][key];
+    }
+    return state[key];
+}
+const initialActionComponentState = {
+    background: [],
+    class: [],
+    feat: [],
+    item: [],
+    race: [],
+};
+function actionComponents(state = initialActionComponentState, action) {
+    if (!action.payload.hasOwnProperty('actions')) {
+        return state;
+    }
+    switch (action.type) {
+        case actionTypes.ACTIONS_SET_COMMIT:
+        case actionTypes.CHARACTER_COMPONENTS_SET_COMMIT:
+            return {
+                background: getKeyedComponentData(state, action, 'actions', 'background'),
+                class: getKeyedComponentData(state, action, 'actions', 'class'),
+                feat: getKeyedComponentData(state, action, 'actions', 'feat'),
+                item: getKeyedComponentData(state, action, 'actions', 'item'),
+                race: getKeyedComponentData(state, action, 'actions', 'race'),
+            };
+        default:
+        // not implemented
+    }
+    return state;
+}
+function choiceComponents(state = initialChoiceComponentState, action) {
+    if (!action.payload.hasOwnProperty('choices')) {
+        return state;
+    }
+    switch (action.type) {
+        case actionTypes.CHOICES_SET_COMMIT:
+        case actionTypes.CHARACTER_COMPONENTS_SET_COMMIT:
+            return {
+                background: getKeyedComponentData(state, action, 'choices', 'background'),
+                class: getKeyedComponentData(state, action, 'choices', 'class'),
+                feat: getKeyedComponentData(state, action, 'choices', 'feat'),
+                item: getKeyedComponentData(state, action, 'choices', 'item'),
+                race: getKeyedComponentData(state, action, 'choices', 'race'),
+                choiceDefinitions: getKeyedComponentData(state, action, 'choices', 'choiceDefinitions'),
+                definitionKeyNameMap: getKeyedComponentData(state, action, 'choices', 'definitionKeyNameMap'),
+            };
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialModifierComponentState = {
+    background: [],
+    class: [],
+    condition: [],
+    feat: [],
+    item: [],
+    race: [],
+};
+function modifierComponents(state = initialModifierComponentState, action) {
+    if (!action.payload.hasOwnProperty('modifiers')) {
+        return state;
+    }
+    switch (action.type) {
+        case actionTypes.MODIFIERS_SET_COMMIT:
+        case actionTypes.CHARACTER_COMPONENTS_SET_COMMIT:
+            return {
+                background: getKeyedComponentData(state, action, 'modifiers', 'background'),
+                class: getKeyedComponentData(state, action, 'modifiers', 'class'),
+                condition: getKeyedComponentData(state, action, 'modifiers', 'condition'),
+                feat: getKeyedComponentData(state, action, 'modifiers', 'feat'),
+                item: getKeyedComponentData(state, action, 'modifiers', 'item'),
+                race: getKeyedComponentData(state, action, 'modifiers', 'race'),
+            };
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialOptionComponentState = {
+    background: [],
+    class: [],
+    feat: [],
+    item: [],
+    race: [],
+};
+function optionComponents(state = initialOptionComponentState, action) {
+    if (!action.payload.hasOwnProperty('options')) {
+        return state;
+    }
+    switch (action.type) {
+        case actionTypes.OPTIONS_SET_COMMIT:
+        case actionTypes.CHARACTER_COMPONENTS_SET_COMMIT:
+            return {
+                background: getKeyedComponentData(state, action, 'options', 'background'),
+                class: getKeyedComponentData(state, action, 'options', 'class'),
+                feat: getKeyedComponentData(state, action, 'options', 'feat'),
+                item: getKeyedComponentData(state, action, 'options', 'item'),
+                race: getKeyedComponentData(state, action, 'options', 'race'),
+            };
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialSpellComponentState = {
+    background: [],
+    class: [],
+    feat: [],
+    item: [],
+    race: [],
+};
+function spellComponents(state = initialSpellComponentState, action) {
+    if (!action.payload.hasOwnProperty('spells')) {
+        return state;
+    }
+    switch (action.type) {
+        case actionTypes.CHARACTER_SPELLS_SET_COMMIT:
+        case actionTypes.CHARACTER_COMPONENTS_SET_COMMIT:
+            return {
+                background: getKeyedComponentData(state, action, 'spells', 'background'),
+                class: getKeyedComponentData(state, action, 'spells', 'class'),
+                feat: getKeyedComponentData(state, action, 'spells', 'feat'),
+                item: getKeyedComponentData(state, action, 'spells', 'item'),
+                race: getKeyedComponentData(state, action, 'spells', 'race'),
+            };
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialItemState = {
+    chargesUsed: 0,
+    containerEntityId: -1,
+    containerEntityTypeId: -1,
+    containerDefinitionKey: '-1:-1',
+    currency: null,
+    definition: null,
+    definitionId: -1,
+    definitionTypeId: -1,
+    displayAsAttack: null,
+    entityTypeId: -1,
+    equipped: null,
+    equippedEntityId: null,
+    equippedEntityTypeId: null,
+    id: -1,
+    isAttuned: null,
+    limitedUse: null,
+    quantity: -1,
+};
+export function itemReducer(state = initialItemState, action) {
+    switch (action.type) {
+        case actionTypes.ITEM_EQUIPPED_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_EQUIPPED_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { equipped: action.payload.value, equippedEntityId: action.payload.equippedEntityId, equippedEntityTypeId: action.payload.equippedEntityTypeId });
+        case actionTypes.ITEM_ATTUNE_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_ATTUNE_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { isAttuned: action.payload.value });
+        case actionTypes.ITEM_QUANTITY_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_QUANTITY_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { quantity: action.payload.quantity });
+        case actionTypes.ITEM_CHARGES_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CHARGES_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { limitedUse: itemLimitedUse(state.limitedUse === null ? undefined : state.limitedUse, action) });
+        case actionTypes.ITEM_MOVE_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_MOVE_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { containerEntityId: action.payload.containerEntityId, containerEntityTypeId: action.payload.containerEntityTypeId, containerDefinitionKey: DefinitionHacks.hack__generateDefinitionKey(action.payload.containerEntityTypeId, action.payload.containerEntityId) });
+        case actionTypes.ITEM_CURRENCY_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_COPPER_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_ELECTRUM_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_GOLD_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_PLATINUM_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_SILVER_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_COPPER_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_ELECTRUM_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_GOLD_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_PLATINUM_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_SILVER_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { currency: currencies(state.currency, action) });
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialInventoryState = [];
+export function inventory(state = initialInventoryState, action) {
+    switch (action.type) {
+        case serviceDataActionTypes.PARTY_ITEM_EQUIPPED_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_ATTUNE_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_QUANTITY_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CHARGES_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_MOVE_SET_COMMIT:
+        case actionTypes.ITEM_EQUIPPED_SET_COMMIT:
+        case actionTypes.ITEM_ATTUNE_SET_COMMIT:
+        case actionTypes.ITEM_QUANTITY_SET_COMMIT:
+        case actionTypes.ITEM_CHARGES_SET_COMMIT:
+        case actionTypes.ITEM_MOVE_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_SET_COMMIT: {
+            const itemIdx = state.findIndex((item) => item.id === action.payload.id);
+            return itemIdx > -1
+                ? [...state.slice(0, itemIdx), itemReducer(state[itemIdx], action), ...state.slice(itemIdx + 1)]
+                : [...state];
+        }
+        case serviceDataActionTypes.PARTY_ITEM_REMOVE_COMMIT:
+        case actionTypes.ITEM_REMOVE_COMMIT:
+            return state.filter((entity) => entity.id !== action.payload.id);
+        case serviceDataActionTypes.PARTY_ITEM_ADD_COMMIT:
+        case actionTypes.ITEM_ADD_COMMIT: {
+            const itemIdx = state.findIndex((item) => item.id === action.payload.item.id);
+            if (itemIdx > -1) {
+                return [...state.slice(0, itemIdx), action.payload.item, ...state.slice(itemIdx + 1)];
+            }
+            return [...state, action.payload.item];
+        }
+        case actionTypes.ITEM_CURRENCY_COPPER_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_SILVER_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_ELECTRUM_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_GOLD_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_PLATINUM_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_COPPER_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_SILVER_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_ELECTRUM_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_GOLD_SET_COMMIT:
+        case serviceDataActionTypes.PARTY_ITEM_CURRENCY_PLATINUM_SET_COMMIT: {
+            const itemIdx = state.findIndex((item) => item.id === action.payload.destinationEntityId);
+            return itemIdx > -1
+                ? [...state.slice(0, itemIdx), itemReducer(state[itemIdx], action), ...state.slice(itemIdx + 1)]
+                : [...state];
+        }
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialSpellState = {
+    activation: null,
+    additionalDescription: null,
+    alwaysPrepared: false,
+    atWillLimitedUseLevel: null,
+    baseLevelAtWill: false,
+    castAtLevel: null,
+    castOnlyAsRitual: false,
+    componentId: -1,
+    componentTypeId: -1,
+    countsAsKnownSpell: false,
+    definition: null,
+    definitionId: -1,
+    displayAsAttack: null,
+    entityTypeId: -1,
+    id: -1,
+    isSignatureSpell: false,
+    limitedUse: null,
+    overrideSaveDc: null,
+    prepared: false,
+    range: null,
+    restriction: null,
+    ritualCastingType: null,
+    spellCastingAbilityId: null,
+    spellListId: null,
+    usesSpellSlot: false,
+};
+function spellEntity(state = initialSpellState, action) {
+    switch (action.type) {
+        case actionTypes.SPELL_PREPARED_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { prepared: action.payload.prepared });
+        case actionTypes.SPELL_USE_SET_COMMIT:
+            if (!state.limitedUse) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { limitedUse: limitedUse(state.limitedUse, action) });
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialSlotEntitiesState = [];
+function slotEntities(state = initialSlotEntitiesState, action) {
+    switch (action.type) {
+        case actionTypes.SPELL_LEVEL_SPELL_SLOTS_SET_COMMIT: {
+            let newSpellSlots = [...state];
+            Object.keys(action.payload).forEach((key) => {
+                let spellLevel = null;
+                switch (key) {
+                    case 'level1':
+                        spellLevel = 1;
+                        break;
+                    case 'level2':
+                        spellLevel = 2;
+                        break;
+                    case 'level3':
+                        spellLevel = 3;
+                        break;
+                    case 'level4':
+                        spellLevel = 4;
+                        break;
+                    case 'level5':
+                        spellLevel = 5;
+                        break;
+                    case 'level6':
+                        spellLevel = 6;
+                        break;
+                    case 'level7':
+                        spellLevel = 7;
+                        break;
+                    case 'level8':
+                        spellLevel = 8;
+                        break;
+                    case 'level9':
+                        spellLevel = 9;
+                        break;
+                }
+                const payloadLevelValue = action.payload[key];
+                const slotsUsed = payloadLevelValue === undefined ? null : payloadLevelValue;
+                newSpellSlots = updateSpellSlots(newSpellSlots, spellLevel, slotsUsed);
+            });
+            return newSpellSlots;
+        }
+        case actionTypes.SPELL_LEVEL_PACT_MAGIC_SLOTS_SET_COMMIT: {
+            let newSpellSlots = [...state];
+            Object.keys(action.payload).forEach((key) => {
+                let spellLevel = null;
+                switch (key) {
+                    case 'level1':
+                        spellLevel = 1;
+                        break;
+                    case 'level2':
+                        spellLevel = 2;
+                        break;
+                    case 'level3':
+                        spellLevel = 3;
+                        break;
+                    case 'level4':
+                        spellLevel = 4;
+                        break;
+                    case 'level5':
+                        spellLevel = 5;
+                        break;
+                }
+                const payloadLevelValue = action.payload[key];
+                const slotsUsed = payloadLevelValue === undefined ? null : payloadLevelValue;
+                newSpellSlots = updateSpellSlots(newSpellSlots, spellLevel, slotsUsed);
+            });
+            return newSpellSlots;
+        }
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialClassState = {
+    definition: null,
+    definitionId: -1,
+    entityTypeId: -1,
+    id: -1,
+    isStartingClass: false,
+    level: -1,
+    subclassDefinition: null,
+    subclassDefinitionId: -1,
+    classFeatures: [],
+    hitDiceUsed: 0,
+};
+function classEntity(state = initialClassState, action) {
+    switch (action.type) {
+        case actionTypes.CLASS_SET:
+            return Object.assign({}, action.payload);
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialOptionalClassFeatureState = {
+    affectedClassFeatureId: null,
+    affectedClassFeatureDefinitionKey: null,
+    classFeatureDefinitionKey: null,
+    classFeatureId: -1,
+};
+function optionalClassFeature(state = initialOptionalClassFeatureState, action) {
+    switch (action.type) {
+        case actionTypes.OPTIONAL_CLASS_FEATURE_SET_COMMIT: {
+            return Object.assign(Object.assign({}, state), action.payload);
+        }
+        default:
+        //not implemented
+    }
+    return state;
+}
+const initialOptionalClassFeaturesState = [];
+function optionalClassFeatures(state = initialOptionalClassFeaturesState, action) {
+    switch (action.type) {
+        case actionTypes.OPTIONAL_CLASS_FEATURE_ADD_COMMIT: {
+            return [...state, action.payload.optionalClassFeature];
+        }
+        case actionTypes.OPTIONAL_CLASS_FEATURE_REMOVE_COMMIT: {
+            return state.filter((featureMapping) => featureMapping.classFeatureId !== action.payload.classFeatureId);
+        }
+        case actionTypes.OPTIONAL_CLASS_FEATURE_SET_COMMIT: {
+            const optionalFeatureIndex = state.findIndex((featureMapping) => featureMapping.classFeatureId === action.payload.classFeatureId);
+            return [
+                ...state.slice(0, optionalFeatureIndex),
+                optionalClassFeature(state[optionalFeatureIndex], action),
+                ...state.slice(optionalFeatureIndex + 1),
+            ];
+        }
+        default:
+        //not implemented
+    }
+    return state;
+}
+const initialOptionalOriginState = {
+    affectedRacialTraitId: null,
+    affectedRacialTraitDefinitionKey: null,
+    racialTraitDefinitionKey: null,
+    racialTraitId: -1,
+};
+function optionalOrigin(state = initialOptionalOriginState, action) {
+    switch (action.type) {
+        case actionTypes.OPTIONAL_ORIGIN_SET_COMMIT: {
+            return Object.assign(Object.assign({}, state), action.payload);
+        }
+        default:
+        //not implemented
+    }
+    return state;
+}
+const initialOptionalOriginsState = [];
+function optionalOrigins(state = initialOptionalOriginsState, action) {
+    switch (action.type) {
+        case actionTypes.OPTIONAL_ORIGIN_ADD_COMMIT: {
+            return [...state, action.payload.optionalOrigin];
+        }
+        case actionTypes.OPTIONAL_ORIGIN_REMOVE_COMMIT: {
+            return state.filter((featureMapping) => featureMapping.racialTraitId !== action.payload.racialTraitId);
+        }
+        case actionTypes.OPTIONAL_ORIGIN_SET_COMMIT: {
+            const optionalFeatureIndex = state.findIndex((featureMapping) => featureMapping.racialTraitId === action.payload.racialTraitId);
+            return [
+                ...state.slice(0, optionalFeatureIndex),
+                optionalOrigin(state[optionalFeatureIndex], action),
+                ...state.slice(optionalFeatureIndex + 1),
+            ];
+        }
+        default:
+        //not implemented
+    }
+    return state;
+}
+const initialCampaignSettingState = {
+    campaignSettingId: 1,
+    enabledSourceIds: [],
+};
+function campaignSetting(state = initialCampaignSettingState, action) {
+    switch (action.type) {
+        case actionTypes.CAMPAIGN_SETTING_SET_COMMIT: {
+            return Object.assign(Object.assign({}, state), action.payload);
+        }
+        default:
+        //not implemented
+    }
+    return state;
+}
+const initialActionState = {
+    abilityModifierStatId: null,
+    actionType: null,
+    activation: null,
+    ammunition: null,
+    attackSubtype: null,
+    attackTypeRange: null,
+    componentId: -1,
+    componentTypeId: -1,
+    damageTypeId: null,
+    description: '',
+    dice: null,
+    displayAsAttack: null,
+    entityTypeId: null,
+    fixedSaveDc: null,
+    fixedToHit: null,
+    id: null,
+    isMartialArts: false,
+    isProficient: false,
+    limitedUse: null,
+    name: '',
+    numberOfTargets: null,
+    onMissDescription: '',
+    range: null,
+    saveFailDescription: '',
+    saveStatId: null,
+    saveSuccessDescription: '',
+    snippet: '',
+    spellRangeType: null,
+    value: null,
+};
+function characterAction(state = initialActionState, action) {
+    switch (action.type) {
+        case actionTypes.ACTION_USE_SET_COMMIT:
+            if (!state.limitedUse) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { limitedUse: limitedUse(state.limitedUse, action) });
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialCreatureEntityState = {
+    definition: null,
+    description: null,
+    entityTypeId: -1,
+    groupId: -1,
+    id: -1,
+    isActive: false,
+    name: '',
+    removedHitPoints: 0,
+    temporaryHitPoints: null,
+};
+function creatureEntity(state = initialCreatureEntityState, action) {
+    switch (action.type) {
+        case actionTypes.CREATURE_ACTIVE_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { isActive: action.payload.isActive });
+        case actionTypes.CREATURE_HIT_POINTS_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { removedHitPoints: action.payload.removedHitPoints, temporaryHitPoints: action.payload.temporaryHitPoints });
+        case actionTypes.CREATURE_DATA_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), action.payload.properties);
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialClassSpellsEntityState = {
+    characterClassId: 0,
+    spells: [],
+    entityTypeId: -1,
+};
+function classSpellsEntity(state = initialClassSpellsEntityState, action) {
+    switch (action.type) {
+        case actionTypes.SPELL_ADD_COMMIT:
+            if (state.spells === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { spells: [...state.spells, action.payload.spell] });
+        case actionTypes.SPELL_REMOVE_COMMIT:
+            if (state.spells === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { spells: state.spells.filter((spell) => !(SpellAccessors.getMappingEntityTypeId(spell) === action.payload.entityTypeId &&
+                    SpellAccessors.getMappingId(spell) === action.payload.id)) });
+        case actionTypes.SPELL_PREPARED_SET_COMMIT: {
+            if (state.spells === null) {
+                return state;
+            }
+            const spellIdx = state.spells.findIndex((spell) => SpellAccessors.getMappingEntityTypeId(spell) === action.payload.entityTypeId &&
+                SpellAccessors.getMappingId(spell) === action.payload.id);
+            if (spellIdx < 0) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { spells: [
+                    ...state.spells.slice(0, spellIdx),
+                    spellEntity(state.spells[spellIdx], action),
+                    ...state.spells.slice(spellIdx + 1),
+                ] });
+        }
+        default:
+        // not implemented
+    }
+    return state;
+}
+function getComponentDataOriginKey(dataOriginType) {
+    switch (dataOriginType) {
+        case DataOriginTypeEnum.BACKGROUND:
+            return 'background';
+        case DataOriginTypeEnum.CLASS_FEATURE:
+            return 'class';
+        case DataOriginTypeEnum.FEAT:
+            return 'feat';
+        case DataOriginTypeEnum.ITEM:
+            return 'item';
+        case DataOriginTypeEnum.RACE:
+            return 'race';
+        default:
+        // not implemented
+    }
+    return '';
+}
+const characterConfigInitialState = {
+    abilityScoreType: null,
+    showHelpText: false,
+    startingEquipmentType: null,
+};
+function characterConfiguration(state = characterConfigInitialState, action) {
+    switch (action.type) {
+        case actionTypes.SHOW_HELP_TEXT_SET:
+            return Object.assign(Object.assign({}, state), { showHelpText: action.payload.showHelpText });
+        case actionTypes.ABILITY_SCORE_TYPE_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { abilityScoreType: action.payload.abilityScoreType });
+        case actionTypes.STARTING_EQUIPMENT_TYPE_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { startingEquipmentType: action.payload.startingEquipmentType });
+        default:
+        // not implemented
+    }
+    return state;
+}
+export const initialState = {
+    actions: null,
+    activeSourceCategories: [],
+    adjustmentXp: null,
+    age: null,
+    alignmentId: null,
+    background: null,
+    baseHitPoints: 0,
+    bonusHitPoints: null,
+    bonusStats: [],
+    campaign: null,
+    campaignSetting: null,
+    canEdit: true,
+    characterValues: [],
+    choices: null,
+    classSpells: [],
+    classes: [],
+    conditions: [],
+    configuration: null,
+    creatures: [],
+    currencies: null,
+    currentXp: 0,
+    customActions: [],
+    customDefenseAdjustments: [],
+    customItems: [],
+    customProficiencies: [],
+    customSenses: [],
+    customSpeeds: [],
+    deathSaves: null,
+    decorations: null,
+    eyes: null,
+    faith: '',
+    feats: [],
+    gender: null,
+    hair: null,
+    height: null,
+    id: 0,
+    inspiration: false,
+    inventory: [],
+    lifestyle: null,
+    lifestyleId: null,
+    modifiers: null,
+    name: null,
+    notes: null,
+    optionalClassFeatures: [],
+    optionalOrigins: [],
+    options: null,
+    overrideHitPoints: null,
+    overrideStats: [],
+    pactMagic: [],
+    preferences: null,
+    race: null,
+    raceDefinitionId: null,
+    raceDefinitionTypeId: null,
+    readonlyUrl: '',
+    removedHitPoints: 0,
+    skin: null,
+    socialName: '',
+    spellSlots: [],
+    spells: null,
+    stats: [],
+    temporaryHitPoints: 0,
+    traits: null,
+    userId: -1,
+    username: '',
+    weight: null,
+    isAssignedToPlayer: false,
+    premadeInfo: null,
+    status: null,
+    statusSlug: null,
+};
+function character(state = initialState, action) {
+    switch (action.type) {
+        case actionTypes.CHARACTER_SET:
+            return Object.assign(Object.assign({}, state), action.payload);
+        case actionTypes.ALIGNMENT_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { alignmentId: action.payload.alignmentId });
+        case actionTypes.LIFESTYLE_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { lifestyleId: action.payload.lifestyleId });
+        case actionTypes.FAITH_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { faith: action.payload.faith });
+        case actionTypes.NAME_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { name: action.payload.name });
+        case actionTypes.HAIR_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { hair: action.payload.hair });
+        case actionTypes.SKIN_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { skin: action.payload.skin });
+        case actionTypes.EYES_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { eyes: action.payload.eyes });
+        case actionTypes.HEIGHT_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { height: action.payload.height });
+        case actionTypes.WEIGHT_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { weight: action.payload.weight });
+        case actionTypes.AGE_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { age: action.payload.age });
+        case actionTypes.GENDER_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { gender: action.payload.gender });
+        case actionTypes.RACE_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { race: action.payload.race });
+        case actionTypes.CLASS_ADD:
+            if (state.classes === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { classes: [...state.classes, action.payload.charClass] });
+        case actionTypes.CLASSES_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { classes: action.payload.classes });
+        case actionTypes.CLASS_SET: {
+            if (state.classes === null) {
+                return state;
+            }
+            const classIdx = state.classes.findIndex((charClass) => charClass.id === action.payload.id);
+            return Object.assign(Object.assign({}, state), { classes: [
+                    ...state.classes.slice(0, classIdx),
+                    classEntity(state.classes[classIdx], action),
+                    ...state.classes.slice(classIdx + 1),
+                ] });
+        }
+        case actionTypes.OPTIONAL_CLASS_FEATURE_ADD_COMMIT:
+        case actionTypes.OPTIONAL_CLASS_FEATURE_SET_COMMIT:
+        case actionTypes.OPTIONAL_CLASS_FEATURE_REMOVE_COMMIT: {
+            if (state.optionalClassFeatures === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { optionalClassFeatures: optionalClassFeatures(state.optionalClassFeatures, action) });
+        }
+        case actionTypes.OPTIONAL_ORIGIN_ADD_COMMIT:
+        case actionTypes.OPTIONAL_ORIGIN_SET_COMMIT:
+        case actionTypes.OPTIONAL_ORIGIN_REMOVE_COMMIT: {
+            if (state.optionalOrigins === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { optionalOrigins: optionalOrigins(state.optionalOrigins, action) });
+        }
+        case actionTypes.CAMPAIGN_SETTING_SET_COMMIT:
+            if (state.campaignSetting === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { campaignSetting: campaignSetting(state.campaignSetting, action) });
+        case actionTypes.NOTE_SET_COMMIT:
+            if (state.notes === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { notes: Object.assign(Object.assign({}, state.notes), { [action.payload.noteType]: action.payload.content }) });
+        case actionTypes.TRAIT_SET_COMMIT:
+            if (state.traits === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { traits: Object.assign(Object.assign({}, state.traits), { [action.payload.traitType]: action.payload.content }) });
+        case actionTypes.ITEM_REMOVE_COMMIT:
+        case actionTypes.ITEM_ADD_COMMIT:
+        case actionTypes.ITEM_EQUIPPED_SET_COMMIT:
+        case actionTypes.ITEM_ATTUNE_SET_COMMIT:
+        case actionTypes.ITEM_QUANTITY_SET_COMMIT:
+        case actionTypes.ITEM_CHARGES_SET_COMMIT:
+        case actionTypes.ITEM_MOVE_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_COPPER_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_SILVER_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_ELECTRUM_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_GOLD_SET_COMMIT:
+        case actionTypes.ITEM_CURRENCY_PLATINUM_SET_COMMIT:
+            if (state.inventory === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { inventory: inventory(state.inventory, action) });
+        case actionTypes.CUSTOM_ITEM_ADD_COMMIT:
+            if (state.customItems === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customItems: [...state.customItems, action.payload.item] });
+        case actionTypes.CUSTOM_ITEM_SET_COMMIT: {
+            if (state.customItems === null) {
+                return state;
+            }
+            const itemIdx = state.customItems.findIndex((item) => item.id === action.payload.id);
+            const item = Object.assign(Object.assign({}, state.customItems[itemIdx]), action.payload.properties);
+            return Object.assign(Object.assign({}, state), { customItems: [...state.customItems.slice(0, itemIdx), item, ...state.customItems.slice(itemIdx + 1)] });
+        }
+        case actionTypes.CUSTOM_ITEM_REMOVE_COMMIT:
+            if (state.customItems === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customItems: state.customItems.filter((item) => item.id !== action.payload.id) });
+        case actionTypes.XP_SET:
+            return Object.assign(Object.assign({}, state), { currentXp: action.payload.currentXp });
+        case actionTypes.BASE_HIT_POINTS_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { baseHitPoints: action.payload.baseHitPoints });
+        case actionTypes.BONUS_HIT_POINTS_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { bonusHitPoints: action.payload.bonusHitPoints });
+        case actionTypes.OVERRIDE_HIT_POINTS_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { overrideHitPoints: action.payload.overrideHitPoints });
+        case actionTypes.ABILITY_SCORE_BASE_SET_COMMIT: {
+            if (state.stats === null) {
+                return state;
+            }
+            const statIdx = state.stats.findIndex((stat) => stat.id === action.payload.statId);
+            return Object.assign(Object.assign({}, state), { stats: [
+                    ...state.stats.slice(0, statIdx),
+                    statEntity(state.stats[statIdx], action),
+                    ...state.stats.slice(statIdx + 1),
+                ] });
+        }
+        case actionTypes.ABILITY_SCORE_OVERRIDE_SET_COMMIT: {
+            if (state.overrideStats === null) {
+                return state;
+            }
+            const statIdx = state.overrideStats.findIndex((stat) => stat.id === action.payload.statId);
+            return Object.assign(Object.assign({}, state), { overrideStats: [
+                    ...state.overrideStats.slice(0, statIdx),
+                    statEntity(state.overrideStats[statIdx], action),
+                    ...state.overrideStats.slice(statIdx + 1),
+                ] });
+        }
+        case actionTypes.ABILITY_SCORE_BONUS_SET_COMMIT: {
+            if (state.bonusStats === null) {
+                return state;
+            }
+            const statIdx = state.bonusStats.findIndex((stat) => stat.id === action.payload.statId);
+            return Object.assign(Object.assign({}, state), { bonusStats: [
+                    ...state.bonusStats.slice(0, statIdx),
+                    statEntity(state.bonusStats[statIdx], action),
+                    ...state.bonusStats.slice(statIdx + 1),
+                ] });
+        }
+        case actionTypes.CURRENCIES_SET_COMMIT:
+        case actionTypes.CURRENCY_COPPER_SET_COMMIT:
+        case actionTypes.CURRENCY_ELECTRUM_SET_COMMIT:
+        case actionTypes.CURRENCY_GOLD_SET_COMMIT:
+        case actionTypes.CURRENCY_PLATINUM_SET_COMMIT:
+        case actionTypes.CURRENCY_SILVER_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { currencies: currencies(state.currencies, action) });
+        case actionTypes.SPELL_PREPARED_SET_COMMIT:
+        case actionTypes.SPELL_ADD_COMMIT:
+        case actionTypes.SPELL_REMOVE_COMMIT: {
+            if (state.classSpells === null) {
+                return state;
+            }
+            const classSpellIdx = state.classSpells.findIndex((classSpell) => classSpell.characterClassId === action.payload.characterClassId);
+            if (classSpellIdx < 0) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { classSpells: [
+                    ...state.classSpells.slice(0, classSpellIdx),
+                    classSpellsEntity(state.classSpells[classSpellIdx], action),
+                    ...state.classSpells.slice(classSpellIdx + 1),
+                ] });
+        }
+        case actionTypes.BACKGROUND_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { background: action.payload.background });
+        case actionTypes.BACKGROUND_HAS_CUSTOM_SET_COMMIT:
+            if (state.background === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { background: Object.assign(Object.assign({}, state.background), { hasCustomBackground: action.payload.hasCustomBackground }) });
+        case actionTypes.FEATS_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { feats: [...action.payload.feats] });
+        case actionTypes.PREFERENCE_SET_COMMIT:
+            if (state.preferences === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { preferences: Object.assign(Object.assign({}, state.preferences), action.payload) });
+        case actionTypes.ACTIVE_SOURCE_CATEGORIES_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { activeSourceCategories: action.payload.activeSourceCategories });
+        case actionTypes.PORTRAIT_SET_COMMIT:
+            if (state.decorations === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { decorations: Object.assign(Object.assign({}, state.decorations), { avatarId: action.payload.avatarId, avatarUrl: action.payload.avatarUrl }) });
+        case actionTypes.HIT_POINTS_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { removedHitPoints: action.payload.removedHitPoints, temporaryHitPoints: action.payload.temporaryHitPoints });
+        case actionTypes.CONDITIONS_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { conditions: [...action.payload.conditions] });
+        case actionTypes.XP_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { currentXp: action.payload.currentXp });
+        case actionTypes.INSPIRATION_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { inspiration: action.payload.inspiration });
+        case actionTypes.DEATHSAVES_SET_COMMIT:
+            if (state.deathSaves === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { deathSaves: Object.assign(Object.assign({}, state.deathSaves), { failCount: action.payload.fails, successCount: action.payload.successes }) });
+        case actionTypes.MOVEMENT_ADD_COMMIT:
+            if (state.customSpeeds === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customSpeeds: [...state.customSpeeds, action.payload] });
+        case actionTypes.MOVEMENT_SET_COMMIT:
+            if (state.customSpeeds === null) {
+                return state;
+            }
+            const customSpeedIdx = state.customSpeeds.findIndex((speed) => speed.movementId === action.payload.movementId);
+            return Object.assign(Object.assign({}, state), { customSpeeds: [
+                    ...state.customSpeeds.slice(0, customSpeedIdx),
+                    Object.assign({}, action.payload),
+                    ...state.customSpeeds.slice(customSpeedIdx + 1),
+                ] });
+        case actionTypes.MOVEMENT_REMOVE_COMMIT:
+            if (state.customSpeeds === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customSpeeds: state.customSpeeds.filter((movement) => movement.movementId !== action.payload.movementId) });
+        case actionTypes.SENSE_ADD_COMMIT:
+            if (state.customSenses === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customSenses: [...state.customSenses, action.payload] });
+        case actionTypes.SENSE_SET_COMMIT:
+            if (state.customSenses === null) {
+                return state;
+            }
+            const customSenseIdx = state.customSenses.findIndex((sense) => sense.senseId === action.payload.senseId);
+            return Object.assign(Object.assign({}, state), { customSenses: [
+                    ...state.customSenses.slice(0, customSenseIdx),
+                    Object.assign({}, action.payload),
+                    ...state.customSenses.slice(customSenseIdx + 1),
+                ] });
+        case actionTypes.SENSE_REMOVE_COMMIT:
+            if (state.customSenses === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customSenses: state.customSenses.filter((sense) => sense.senseId !== action.payload.senseId) });
+        case actionTypes.CUSTOM_ACTION_ADD_COMMIT:
+            if (state.customActions === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customActions: [...state.customActions, action.payload.action] });
+        case actionTypes.CUSTOM_ACTION_REMOVE_COMMIT:
+            if (state.customActions === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customActions: state.customActions.filter((attack) => attack.id !== action.payload.id) });
+        case actionTypes.CUSTOM_ACTION_SET_COMMIT: {
+            if (state.customActions === null) {
+                return state;
+            }
+            const customActionIdx = state.customActions.findIndex((attack) => attack.id === action.payload.id);
+            return Object.assign(Object.assign({}, state), { customActions: [
+                    ...state.customActions.slice(0, customActionIdx),
+                    Object.assign(Object.assign({}, state.customActions[customActionIdx]), action.payload.properties),
+                    ...state.customActions.slice(customActionIdx + 1),
+                ] });
+        }
+        // TODO this needs data update
+        case actionTypes.CUSTOM_PROFICIENCY_ADD_COMMIT:
+            if (state.customProficiencies === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customProficiencies: [...state.customProficiencies, action.payload.proficiency] });
+        case actionTypes.CUSTOM_PROFICIENCY_REMOVE_COMMIT:
+            if (state.customProficiencies === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customProficiencies: state.customProficiencies.filter((proficiency) => proficiency.id !== action.payload.id) });
+        case actionTypes.CUSTOM_PROFICIENCY_SET_COMMIT: {
+            if (state.customProficiencies === null) {
+                return state;
+            }
+            const customProfIdx = state.customProficiencies.findIndex((proficiency) => proficiency.id === action.payload.id);
+            return Object.assign(Object.assign({}, state), { customProficiencies: [
+                    ...state.customProficiencies.slice(0, customProfIdx),
+                    Object.assign(Object.assign({}, state.customProficiencies[customProfIdx]), action.payload.properties),
+                    ...state.customProficiencies.slice(customProfIdx + 1),
+                ] });
+        }
+        case actionTypes.CUSTOM_DEFENSE_ADJUSTMENT_ADD_COMMIT:
+            if (state.customDefenseAdjustments === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customDefenseAdjustments: [...state.customDefenseAdjustments, action.payload] });
+        case actionTypes.CUSTOM_DEFENSE_ADJUSTMENT_SET_COMMIT:
+            if (state.customDefenseAdjustments === null) {
+                return state;
+            }
+            const customDefenseIdx = state.customDefenseAdjustments.findIndex((adjustment) => adjustment.adjustmentId === action.payload.adjustmentId && adjustment.type === action.payload.type);
+            return Object.assign(Object.assign({}, state), { customDefenseAdjustments: [
+                    ...state.customDefenseAdjustments.slice(0, customDefenseIdx),
+                    Object.assign({}, action.payload),
+                    ...state.customDefenseAdjustments.slice(customDefenseIdx + 1),
+                ] });
+        case actionTypes.CUSTOM_DEFENSE_ADJUSTMENT_REMOVE_COMMIT:
+            if (state.customDefenseAdjustments === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { customDefenseAdjustments: state.customDefenseAdjustments.filter((adjustment) => !(adjustment.type === action.payload.type &&
+                    adjustment.adjustmentId === action.payload.adjustmentId)) });
+        case actionTypes.FRAME_SET_COMMIT:
+            if (state.decorations === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { decorations: Object.assign(Object.assign({}, state.decorations), { frameAvatarId: action.payload.frame.frameAvatarId, frameAvatarUrl: action.payload.frame.frameAvatarUrl, frameAvatarDecorationKey: action.payload.frame.decorationKey }) });
+        case actionTypes.THEME_SET_COMMIT:
+            if (state.decorations === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { decorations: Object.assign(Object.assign({}, state.decorations), { themeColor: action.payload.themeColor }) });
+        case actionTypes.BACKDROP_SET_COMMIT: {
+            const { backdropAvatarId, backdropAvatarUrl, largeBackdropAvatarId, largeBackdropAvatarUrl, smallBackdropAvatarId, smallBackdropAvatarUrl, thumbnailBackdropAvatarId, thumbnailBackdropAvatarUrl, } = action.payload.backdrop;
+            if (state.decorations === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { decorations: Object.assign(Object.assign({}, state.decorations), { backdropAvatarId,
+                    backdropAvatarUrl,
+                    largeBackdropAvatarId,
+                    largeBackdropAvatarUrl,
+                    smallBackdropAvatarId,
+                    smallBackdropAvatarUrl,
+                    thumbnailBackdropAvatarId,
+                    thumbnailBackdropAvatarUrl }) });
+        }
+        case actionTypes.SPELL_LEVEL_PACT_MAGIC_SLOTS_SET_COMMIT:
+            if (state.pactMagic === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { pactMagic: slotEntities(state.pactMagic, action) });
+        case actionTypes.SPELL_LEVEL_SPELL_SLOTS_SET_COMMIT:
+            if (state.spellSlots === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { spellSlots: slotEntities(state.spellSlots, action) });
+        case actionTypes.ACTION_USE_SET_COMMIT: {
+            if (state.actions === null) {
+                return state;
+            }
+            const componentDataOriginKey = getComponentDataOriginKey(action.payload.dataOriginType);
+            const actionIdx = state.actions[componentDataOriginKey].findIndex((charAction) => ActionAccessors.getId(charAction) === action.payload.id &&
+                ActionAccessors.getEntityTypeId(charAction) === action.payload.entityTypeId);
+            return Object.assign(Object.assign({}, state), { actions: Object.assign(Object.assign({}, state.actions), { [componentDataOriginKey]: [
+                        ...state.actions[componentDataOriginKey].slice(0, actionIdx),
+                        characterAction(state.actions[componentDataOriginKey][actionIdx], action),
+                        ...state.actions[componentDataOriginKey].slice(actionIdx + 1),
+                    ] }) });
+        }
+        case actionTypes.SPELL_USE_SET_COMMIT: {
+            if (state.spells === null) {
+                return state;
+            }
+            const componentDataOriginKey = getComponentDataOriginKey(action.payload.dataOriginType);
+            const spellIdx = state.spells[componentDataOriginKey].findIndex((spell) => SpellAccessors.getMappingId(spell) === action.payload.id &&
+                SpellAccessors.getMappingEntityTypeId(spell) === action.payload.entityTypeId);
+            return Object.assign(Object.assign({}, state), { spells: Object.assign(Object.assign({}, state.spells), { [componentDataOriginKey]: [
+                        ...state.spells[componentDataOriginKey].slice(0, spellIdx),
+                        spellEntity(state.spells[componentDataOriginKey][spellIdx], action),
+                        ...state.spells[componentDataOriginKey].slice(spellIdx + 1),
+                    ] }) });
+        }
+        case actionTypes.CHOICES_SET_COMMIT:
+            if (state.choices === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { choices: choiceComponents(state.choices, action) });
+        case actionTypes.MODIFIERS_SET_COMMIT:
+            if (state.modifiers === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { modifiers: modifierComponents(state.modifiers, action) });
+        case actionTypes.ACTIONS_SET_COMMIT:
+            if (state.actions === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { actions: actionComponents(state.actions, action) });
+        case actionTypes.PACT_MAGIC_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { pactMagic: action.payload.pactMagic });
+        case actionTypes.SPELLS_SLOTS_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { spellSlots: action.payload.spellSlots });
+        case actionTypes.CHARACTER_SPELLS_SET_COMMIT:
+            if (state.spells === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { spells: spellComponents(state.spells, action) });
+        case actionTypes.OPTIONS_SET_COMMIT:
+            if (state.options === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { options: optionComponents(state.options, action) });
+        case actionTypes.CHARACTER_COMPONENTS_SET_COMMIT: {
+            let updatedState = Object.assign({}, state);
+            if (state.actions !== null) {
+                updatedState = Object.assign(Object.assign({}, updatedState), { actions: actionComponents(state.actions, action) });
+            }
+            if (state.choices !== null) {
+                updatedState = Object.assign(Object.assign({}, updatedState), { choices: choiceComponents(state.choices, action) });
+            }
+            if (state.modifiers !== null) {
+                updatedState = Object.assign(Object.assign({}, updatedState), { modifiers: modifierComponents(state.modifiers, action) });
+            }
+            if (state.options !== null) {
+                updatedState = Object.assign(Object.assign({}, updatedState), { options: optionComponents(state.options, action) });
+            }
+            if (state.spells !== null) {
+                updatedState = Object.assign(Object.assign({}, updatedState), { spells: spellComponents(state.spells, action) });
+            }
+            if (state.classSpells !== null && action.payload.classSpells) {
+                updatedState = Object.assign(Object.assign({}, updatedState), { classSpells: [...action.payload.classSpells] });
+            }
+            return updatedState;
+        }
+        case actionTypes.VALUE_SET_COMMIT: {
+            if (state.characterValues === null) {
+                return state;
+            }
+            // TODO move this to a saga handler that uses an existing lookup to test for presence
+            const { typeId, value, notes, valueId, valueTypeId, contextId, contextTypeId } = action.payload;
+            const valueInfo = {
+                typeId,
+                value,
+                notes,
+                valueId,
+                valueTypeId,
+                contextId,
+                contextTypeId,
+            };
+            const idx = state.characterValues.findIndex((charValue) => charValue.typeId === typeId &&
+                charValue.valueId === valueId &&
+                charValue.valueTypeId === valueTypeId &&
+                charValue.contextId === contextId &&
+                charValue.contextTypeId === contextTypeId);
+            if (idx > -1 && value === null && notes === null) {
+                return Object.assign(Object.assign({}, state), { characterValues: state.characterValues.filter((charValue, valueIdx) => valueIdx !== idx) });
+            }
+            let newCharacterValues;
+            if (idx > -1) {
+                newCharacterValues = [
+                    ...state.characterValues.slice(0, idx),
+                    valueInfo,
+                    ...state.characterValues.slice(idx + 1),
+                ];
+            }
+            else {
+                newCharacterValues = [...state.characterValues, valueInfo];
+            }
+            return Object.assign(Object.assign({}, state), { characterValues: newCharacterValues });
+        }
+        case actionTypes.VALUE_REMOVE_COMMIT: {
+            if (state.characterValues === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { characterValues: state.characterValues.filter((charValue) => !(charValue.typeId === action.payload.typeId &&
+                    charValue.valueId === action.payload.valueId &&
+                    charValue.valueTypeId === action.payload.valueTypeId &&
+                    charValue.contextId === action.payload.contextId &&
+                    charValue.contextTypeId === action.payload.contextTypeId)) });
+        }
+        case actionTypes.ENTITY_VALUES_REMOVE_COMMIT: {
+            if (state.characterValues === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { characterValues: state.characterValues.filter((charValue) => !(charValue.valueId === action.payload.valueId &&
+                    charValue.valueTypeId === action.payload.valueTypeId &&
+                    charValue.contextId === action.payload.contextId &&
+                    charValue.contextTypeId === action.payload.contextTypeId)) });
+        }
+        case actionTypes.CREATURE_ADD_COMMIT:
+            if (state.creatures === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { creatures: [...state.creatures, action.payload.creature] });
+        case actionTypes.CREATURE_REMOVE_COMMIT:
+            if (state.creatures === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { creatures: state.creatures.filter((creature) => action.payload.id !== CreatureAccessors.getMappingId(creature)) });
+        case actionTypes.CREATURE_DATA_SET_COMMIT:
+        case actionTypes.CREATURE_ACTIVE_SET_COMMIT:
+        case actionTypes.CREATURE_HIT_POINTS_SET_COMMIT: {
+            if (state.creatures === null) {
+                return state;
+            }
+            const idx = state.creatures.findIndex((creature) => action.payload.id === CreatureAccessors.getMappingId(creature));
+            return Object.assign(Object.assign({}, state), { creatures: [
+                    ...state.creatures.slice(0, idx),
+                    creatureEntity(state.creatures[idx], action),
+                    ...state.creatures.slice(idx + 1),
+                ] });
+        }
+        case actionTypes.ABILITY_SCORE_TYPE_SET_COMMIT:
+        case actionTypes.SHOW_HELP_TEXT_SET:
+        case actionTypes.STARTING_EQUIPMENT_TYPE_SET_COMMIT:
+            if (state.configuration === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { configuration: characterConfiguration(state.configuration, action) });
+        case actionTypes.ACTIVE_SOURCES_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { campaignSetting: action.payload });
+        case actionTypes.PREMADE_INFO_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { premadeInfo: action.payload });
+        case actionTypes.PREMADE_INFO_REMOVE_COMMIT:
+            return Object.assign(Object.assign({}, state), { premadeInfo: null });
+        case actionTypes.STATUS_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { status: action.payload.status });
+        case actionTypes.STATUS_SLUG_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { statusSlug: action.payload.statusSlug });
+        default:
+        // not implemented
+    }
+    return state;
+}
+export default character;
diff --git a/ddb_main/packages/rules-engine/es/reducers/characterEnv.js b/ddb_main/packages/rules-engine/es/reducers/characterEnv.js
new file mode 100644
index 0000000..da085a3
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/reducers/characterEnv.js
@@ -0,0 +1,16 @@
+import * as actionTypes from '../actions/characterEnv/actionTypes';
+import { CharacterLoadingStatusEnum } from './constants';
+export const initialEnvState = {
+    context: null,
+    loadingStatus: CharacterLoadingStatusEnum.NOT_INITIALIZED,
+};
+function characterEnv(state = initialEnvState, action) {
+    switch (action.type) {
+        case actionTypes.DATA_SET:
+            return Object.assign(Object.assign({}, state), action.payload);
+        default:
+        // not implemented
+    }
+    return state;
+}
+export default characterEnv;
diff --git a/ddb_main/packages/rules-engine/es/reducers/constants.js b/ddb_main/packages/rules-engine/es/reducers/constants.js
new file mode 100644
index 0000000..df67e69
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/reducers/constants.js
@@ -0,0 +1,7 @@
+export var CharacterLoadingStatusEnum;
+(function (CharacterLoadingStatusEnum) {
+    CharacterLoadingStatusEnum["NOT_INITIALIZED"] = "NOT_INITIALIZED";
+    CharacterLoadingStatusEnum["LOADING"] = "LOADING";
+    CharacterLoadingStatusEnum["LOADED"] = "LOADED";
+    CharacterLoadingStatusEnum["ERROR"] = "ERROR";
+})(CharacterLoadingStatusEnum || (CharacterLoadingStatusEnum = {}));
diff --git a/ddb_main/packages/rules-engine/es/reducers/featureFlagInfo.js b/ddb_main/packages/rules-engine/es/reducers/featureFlagInfo.js
new file mode 100644
index 0000000..0204a88
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/reducers/featureFlagInfo.js
@@ -0,0 +1,12 @@
+import * as actionTypes from '../actions/featureFlagInfo/actionTypes';
+import { DEFAULT_FEATURE_FLAG_INFO } from '../engine/FeatureFlagInfo';
+export const initialState = DEFAULT_FEATURE_FLAG_INFO;
+export default function featureFlagInfoReducer(state = initialState, action) {
+    switch (action.type) {
+        case actionTypes.DATA_SET:
+            return action.payload;
+        default:
+        // not implemented
+    }
+    return state;
+}
diff --git a/ddb_main/packages/rules-engine/es/reducers/index.js b/ddb_main/packages/rules-engine/es/reducers/index.js
new file mode 100644
index 0000000..6873fa8
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/reducers/index.js
@@ -0,0 +1,12 @@
+import character from './character';
+import characterEnv from './characterEnv';
+import featureFlagInfo from './featureFlagInfo';
+import ruleData from './ruleData';
+import serviceData from './serviceData';
+import syncTransaction from './syncTransaction';
+export const characterReducer = character;
+export const characterEnvReducer = characterEnv;
+export const featureFlagInfoReducer = featureFlagInfo;
+export const ruleDataReducer = ruleData;
+export const serviceDataReducer = serviceData;
+export const syncTransactionReducer = syncTransaction;
diff --git a/ddb_main/packages/rules-engine/es/reducers/ruleData.js b/ddb_main/packages/rules-engine/es/reducers/ruleData.js
new file mode 100644
index 0000000..1d6d2b6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/reducers/ruleData.js
@@ -0,0 +1,111 @@
+import * as actionTypes from '../actions/ruleData/actionTypes';
+export const initialState = {
+    abilityScoreDisplayTypes: [],
+    abilitySkills: [],
+    activationTypes: [],
+    additionalLevelTypes: [],
+    adjustmentDataTypes: [],
+    adjustmentTypes: [],
+    alignments: [],
+    aoeTypes: [],
+    armor: [],
+    armorTypes: [],
+    backgroundSpellTypeId: -1,
+    baseGearTypeIds: [],
+    baseTypeArmorId: 0,
+    baseTypeGearId: 0,
+    baseTypeWeaponId: 0,
+    baseWeaponReach: 0,
+    basicActions: [],
+    basicMaxStatScore: 0,
+    builderHelperText: [],
+    challengeRatings: [],
+    classSpellTypeId: -1,
+    conditionTypes: [],
+    conditions: [],
+    coverTypes: [],
+    creatureGroupCategories: [],
+    creatureGroupFlags: [],
+    creatureGroups: [],
+    creatureSizes: [],
+    currencyData: [],
+    damageAdjustments: [],
+    damageTypes: [],
+    defaultArmorImageUrl: '',
+    defaultAttunedItemCountMax: 0,
+    defaultGearImageUrl: '',
+    defaultRacePortraitUrl: '',
+    defaultWeaponImageUrl: '',
+    diceValues: [],
+    environments: [],
+    gearTypes: [],
+    initiativeScore: {
+        amount: 0,
+        advantage: 0,
+        disadvantage: 0,
+    },
+    languageTypeId: -1,
+    languages: [],
+    levelExperiencePoints: [],
+    levelProficiencyBonuses: [],
+    lifestyles: [],
+    limitedUseResetTypes: [],
+    longRestMinimumHitDiceUsedRecovered: 0,
+    maxAttunedItemCountMax: 0,
+    maxCharacterLevel: 0,
+    maxDeathsavesFail: 0,
+    maxDeathsavesSuccess: 0,
+    maxExhaustionLevel: 0,
+    maxSpellLevel: 0,
+    maxStatScore: 0,
+    minAttunedItemCountMax: 0,
+    minExhaustionLevel: 0,
+    minStatScore: 0,
+    minimumHpTotal: 0,
+    minimumLimitedUseMaxUse: 0,
+    monsterSubTypes: [],
+    monsterTypes: [],
+    movements: [],
+    multiClassSpellSlots: [],
+    naturalActions: [],
+    noArmorAcAmount: 0,
+    operators: [],
+    pactMagicMultiClassSpellSlots: [],
+    privacyTypes: [],
+    proficiencyGroups: [],
+    raceGroups: [],
+    rangeTypes: [],
+    restoreTypes: [],
+    ritualCastingTimeMinuteAddition: 0,
+    rules: [],
+    senses: [],
+    sharingTypes: [],
+    sourceCategories: [],
+    sources: [],
+    spellComponents: [],
+    spellConditionTypes: [],
+    spellRangeTypes: [],
+    statModifiers: [],
+    stats: [],
+    stealthCheckTypes: [],
+    stringMartialArts: '',
+    stringPactMagic: '',
+    stringSpellCasting: '',
+    stringSpellEldritchBlast: '',
+    toolTypeId: -1,
+    tools: [],
+    weaponCategories: [],
+    weaponProperties: [],
+    weaponPropertyReachDistance: 0,
+    weapons: [],
+};
+function ruleData(state = initialState, action) {
+    switch (action.type) {
+        case actionTypes.DATA_SET:
+            return Object.assign(Object.assign({}, state), action.payload);
+        default:
+        // not implemented
+    }
+    return state;
+}
+export default ruleData;
diff --git a/ddb_main/packages/rules-engine/es/reducers/serviceData.js b/ddb_main/packages/rules-engine/es/reducers/serviceData.js
new file mode 100644
index 0000000..4096145
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/reducers/serviceData.js
@@ -0,0 +1,317 @@
+import * as actionTypes from '../actions/serviceData/actionTypes';
+import { DefinitionTypeEnum, DefinitionUtils } from '../engine/Definition';
+import { InfusionAccessors } from '../engine/Infusion';
+import { KnownInfusionAccessors } from '../engine/KnownInfusion';
+import { RuleDataTypeEnum } from '../engine/RuleData';
+import { VehicleAccessors } from '../engine/Vehicle';
+import { VehicleComponentAccessors } from '../engine/VehicleComponent';
+import { currencies, initialCoinState, inventory } from './character';
+const initialKnownInfusionState = {
+    characterId: -1,
+    choiceKey: null,
+    definitionKey: null,
+    id: -1,
+    itemId: null,
+    itemName: null,
+    itemTypeId: null,
+    legacyItemTypeId: -1,
+};
+function knownInfusionEntity(state = initialKnownInfusionState, action) {
+    switch (action.type) {
+        case actionTypes.KNOWN_INFUSION_MAPPING_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), action.payload);
+    }
+    return state;
+}
+const initialVehicleEntityState = {
+    id: -1,
+    characterId: -1,
+    definitionKey: null,
+    name: null,
+    description: null,
+    conditions: [],
+    remainingFuel: 0,
+};
+function vehicleEntity(state = initialVehicleEntityState, action) {
+    switch (action.type) {
+        case actionTypes.VEHICLE_MAPPING_DATA_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), action.payload.properties);
+        case actionTypes.VEHICLE_MAPPING_REMAINING_FUEL_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { remainingFuel: action.payload.remainingFuel });
+        case actionTypes.VEHICLE_MAPPING_CONDITION_ADD_COMMIT:
+            if (state.conditions === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { conditions: [...state.conditions, action.payload.mappingContract] });
+        case actionTypes.VEHICLE_MAPPING_CONDITION_REMOVE_COMMIT:
+            if (state.conditions === null) {
+                return state;
+            }
+            return Object.assign(Object.assign({}, state), { conditions: state.conditions.filter((condition) => condition.conditionId !== action.payload.conditionId) });
+        case actionTypes.VEHICLE_MAPPING_CONDITION_SET_COMMIT:
+            if (state.conditions === null) {
+                return state;
+            }
+            let conditionIdx = state.conditions.findIndex((condition) => condition.conditionId === action.payload.mappingContract.conditionId);
+            return Object.assign(Object.assign({}, state), { conditions: [
+                    ...state.conditions.slice(0, conditionIdx),
+                    action.payload.mappingContract,
+                    ...state.conditions.slice(conditionIdx + 1),
+                ] });
+    }
+    return state;
+}
+const initialComponentEntityState = {
+    id: -1,
+    characterId: -1,
+    componentId: '',
+    definitionKey: null,
+    removedHitPoints: 0,
+    name: null,
+    description: null,
+    vehicleMappingId: null,
+    vehicleLevelId: null,
+};
+function componentEntity(state = initialComponentEntityState, action) {
+    switch (action.type) {
+        case actionTypes.VEHICLE_COMPONENT_MAPPING_HIT_POINTS_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { removedHitPoints: action.payload.removedHitPoints });
+    }
+    return state;
+}
+const initialPoolTypeState = {
+    definitionLookup: {},
+    accessTypeLookup: {},
+};
+function definitionPoolType(state = initialPoolTypeState, action) {
+    switch (action.type) {
+        case actionTypes.DEFINITION_POOL_ADD_COMMIT:
+            return Object.assign(Object.assign({}, state), { definitionLookup: Object.assign(Object.assign({}, state.definitionLookup), action.payload.definitions), accessTypeLookup: Object.assign(Object.assign({}, state.accessTypeLookup), action.payload.definitionAccessTypeLookup) });
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialInfusionPoolState = {
+    definitionLookup: {},
+    accessTypeLookup: {},
+};
+const initialVehiclePoolState = {
+    definitionLookup: {},
+    accessTypeLookup: {},
+};
+const initialClassFeaturePoolState = {
+    definitionLookup: {},
+    accessTypeLookup: {},
+};
+const initialRacialTraitPoolState = {
+    definitionLookup: {},
+    accessTypeLookup: {},
+};
+const initialPoolState = {
+    [DefinitionTypeEnum.INFUSION]: initialInfusionPoolState,
+    [DefinitionTypeEnum.VEHICLE]: initialVehiclePoolState,
+    [DefinitionTypeEnum.CLASS_FEATURE]: initialClassFeaturePoolState,
+    [DefinitionTypeEnum.RACIAL_TRAIT]: initialRacialTraitPoolState,
+};
+function definitionPoolPool(state = initialPoolState, action) {
+    switch (action.type) {
+        case actionTypes.DEFINITION_POOL_ADD_COMMIT:
+            return Object.assign(Object.assign({}, state), { [action.payload.type]: definitionPoolType(state[action.payload.type], action) });
+        default:
+        // not implemented
+    }
+    return state;
+}
+const initialPartyInfoState = {
+    characters: null,
+    coin: initialCoinState,
+    description: null,
+    dmUserId: -1,
+    dmUsername: null,
+    id: -1,
+    link: null,
+    name: null,
+    publicNotes: null,
+    partyInventory: [],
+    sharingState: 0,
+    modifiers: null,
+    spells: null,
+};
+function partyInfo(partyInfoState = initialPartyInfoState, action) {
+    switch (action.type) {
+        case actionTypes.PARTY_ITEM_ADD_COMMIT:
+        case actionTypes.PARTY_ITEM_REMOVE_COMMIT:
+        case actionTypes.PARTY_ITEM_EQUIPPED_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_ATTUNE_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_QUANTITY_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CHARGES_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_MOVE_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_SILVER_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_GOLD_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_ELECTRUM_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_COPPER_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_PLATINUM_SET_COMMIT:
+            if (partyInfoState) {
+                return Object.assign(Object.assign({}, partyInfoState), { partyInventory: inventory(partyInfoState.partyInventory, action) });
+            }
+            return null;
+        case actionTypes.PARTY_CURRENCIES_SET_COMMIT:
+        case actionTypes.PARTY_CURRENCY_SILVER_SET_COMMIT:
+        case actionTypes.PARTY_CURRENCY_GOLD_SET_COMMIT:
+        case actionTypes.PARTY_CURRENCY_ELECTRUM_SET_COMMIT:
+        case actionTypes.PARTY_CURRENCY_COPPER_SET_COMMIT:
+        case actionTypes.PARTY_CURRENCY_PLATINUM_SET_COMMIT:
+            if (partyInfoState) {
+                return Object.assign(Object.assign({}, partyInfoState), { coin: currencies(partyInfoState.coin, action) });
+            }
+            return null;
+        case actionTypes.PARTY_CAMPAIGN_INFO_SET:
+            return action.payload
+                ? Object.assign(Object.assign({}, partyInfoState), action.payload) : partyInfoState;
+        default:
+            return null;
+    }
+}
+export const initialState = {
+    classAlwaysKnownSpells: {},
+    classAlwaysPreparedSpells: {},
+    definitionPool: initialPoolState,
+    infusionsMappings: [],
+    knownInfusionsMappings: [],
+    vehicleComponentMappings: [],
+    vehicleMappings: [],
+    ruleDataPool: {
+        [RuleDataTypeEnum.VEHICLE]: null,
+    },
+    partyInfo: null,
+    campaignSettings: [],
+};
+function serviceData(state = initialState, action) {
+    var _a;
+    switch (action.type) {
+        case actionTypes.DEFINITION_POOL_ADD_COMMIT:
+            return Object.assign(Object.assign({}, state), { definitionPool: definitionPoolPool(state.definitionPool, action) });
+        case actionTypes.RULE_DATA_POOL_KEY_SET_COMMIT:
+            return Object.assign(Object.assign({}, state), { ruleDataPool: Object.assign(Object.assign({}, state.ruleDataPool), { [action.payload.key]: action.payload.data }) });
+        case actionTypes.VEHICLE_MAPPING_ADD_COMMIT:
+            // Check if vehicle already exists in the mapping list
+            if (state.vehicleMappings.some((v) => v.id === action.payload.vehicle.id))
+                return state;
+            // Add the vehicle to the list
+            return Object.assign(Object.assign({}, state), { vehicleMappings: [...state.vehicleMappings, action.payload.vehicle] });
+        case actionTypes.VEHICLE_MAPPING_REMOVE_COMMIT:
+            return Object.assign(Object.assign({}, state), { vehicleMappings: state.vehicleMappings.filter((vehicle) => action.payload.id !== VehicleAccessors.getMappingId(vehicle)) });
+        case actionTypes.VEHICLE_MAPPING_REMAINING_FUEL_SET_COMMIT:
+        case actionTypes.VEHICLE_MAPPING_CONDITION_ADD_COMMIT:
+        case actionTypes.VEHICLE_MAPPING_CONDITION_SET_COMMIT:
+        case actionTypes.VEHICLE_MAPPING_CONDITION_REMOVE_COMMIT: {
+            let idx = state.vehicleMappings.findIndex((vehicle) => action.payload.vehicleMappingId === VehicleAccessors.getMappingId(vehicle));
+            return Object.assign(Object.assign({}, state), { vehicleMappings: [
+                    ...state.vehicleMappings.slice(0, idx),
+                    vehicleEntity(state.vehicleMappings[idx], action),
+                    ...state.vehicleMappings.slice(idx + 1),
+                ] });
+        }
+        case actionTypes.VEHICLE_MAPPING_DATA_SET_COMMIT: {
+            let idx = state.vehicleMappings.findIndex((vehicle) => action.payload.id === VehicleAccessors.getMappingId(vehicle));
+            return Object.assign(Object.assign({}, state), { vehicleMappings: [
+                    ...state.vehicleMappings.slice(0, idx),
+                    vehicleEntity(state.vehicleMappings[idx], action),
+                    ...state.vehicleMappings.slice(idx + 1),
+                ] });
+        }
+        case actionTypes.VEHICLE_COMPONENT_MAPPING_ADD_COMMIT: {
+            // Check if the component already exists in the mapping list
+            if (state.vehicleComponentMappings.some((component) => action.payload.component.id === component.id &&
+                action.payload.component.vehicleMappingId === component.vehicleMappingId))
+                return state;
+            return Object.assign(Object.assign({}, state), { vehicleComponentMappings: [...state.vehicleComponentMappings, action.payload.component] });
+        }
+        case actionTypes.VEHICLE_COMPONENT_MAPPING_REMOVE_COMMIT: {
+            return Object.assign(Object.assign({}, state), { vehicleComponentMappings: state.vehicleComponentMappings.filter((component) => VehicleComponentAccessors.getMappingId(component) !== action.payload.id) });
+        }
+        case actionTypes.VEHICLE_COMPONENT_MAPPING_HIT_POINTS_SET_COMMIT: {
+            let idx = state.vehicleComponentMappings.findIndex((component) => action.payload.id === VehicleComponentAccessors.getMappingId(component));
+            return Object.assign(Object.assign({}, state), { vehicleComponentMappings: [
+                    ...state.vehicleComponentMappings.slice(0, idx),
+                    componentEntity(state.vehicleComponentMappings[idx], action),
+                    ...state.vehicleComponentMappings.slice(idx + 1),
+                ] });
+        }
+        case actionTypes.KNOWN_INFUSION_MAPPING_REMOVE_COMMIT: {
+            return Object.assign(Object.assign({}, state), { knownInfusionsMappings: state.knownInfusionsMappings.filter((knownInfusion) => KnownInfusionAccessors.getChoiceKey(knownInfusion) !== action.payload.choiceKey) });
+        }
+        case actionTypes.KNOWN_INFUSION_MAPPING_ADD_COMMIT: {
+            // Check if the known infusion already exists in the mapping list
+            if (state.infusionsMappings.some((infusion) => infusion.inventoryMappingId === action.payload.id))
+                return state;
+            // Add the known infusion to the list
+            return Object.assign(Object.assign({}, state), { knownInfusionsMappings: [...state.knownInfusionsMappings, action.payload] });
+        }
+        case actionTypes.KNOWN_INFUSION_MAPPING_SET_COMMIT: {
+            let idx = state.knownInfusionsMappings.findIndex((knownInfusion) => KnownInfusionAccessors.getChoiceKey(knownInfusion) === action.payload.choiceKey);
+            return Object.assign(Object.assign({}, state), { knownInfusionsMappings: [
+                    ...state.knownInfusionsMappings.slice(0, idx),
+                    knownInfusionEntity(state.knownInfusionsMappings[idx], action),
+                    ...state.knownInfusionsMappings.slice(idx + 1),
+                ] });
+        }
+        case actionTypes.INFUSION_MAPPING_ADD_COMMIT:
+            // Check if the infusion already exists in the mapping list
+            if (state.infusionsMappings.some((infusion) => infusion.inventoryMappingId === action.payload.inventoryMappingId &&
+                infusion.creatureMappingId === action.payload.creatureMappingId))
+                return state;
+            // Add the infusion to the list
+            return Object.assign(Object.assign({}, state), { infusionsMappings: [...state.infusionsMappings, action.payload] });
+        case actionTypes.INFUSION_MAPPING_REMOVE_COMMIT: {
+            return Object.assign(Object.assign({}, state), { infusionsMappings: state.infusionsMappings.filter((infusion) => {
+                    const definitionKey = InfusionAccessors.getDefinitionKey(infusion);
+                    if (definitionKey === null) {
+                        return false;
+                    }
+                    if (DefinitionUtils.getDefinitionKeyId(definitionKey) === action.payload.infusionId &&
+                        InfusionAccessors.getInventoryMappingId(infusion) === action.payload.inventoryMappingId) {
+                        return false;
+                    }
+                    return true;
+                }) });
+        }
+        case actionTypes.CLASS_ALWAYS_KNOWN_SPELLS_SET_COMMIT: {
+            return Object.assign(Object.assign({}, state), { classAlwaysKnownSpells: Object.assign(Object.assign({}, state.classAlwaysKnownSpells), { [action.payload.classId]: action.payload.spells }) });
+        }
+        case actionTypes.CLASS_ALWAYS_PREPARED_SPELLS_SET_COMMIT: {
+            return Object.assign(Object.assign({}, state), { classAlwaysPreparedSpells: Object.assign(Object.assign({}, state.classAlwaysPreparedSpells), { [action.payload.classId]: action.payload.spells }) });
+        }
+        case actionTypes.PARTY_CAMPAIGN_INFO_SET:
+        case actionTypes.PARTY_CURRENCIES_SET_COMMIT:
+        case actionTypes.PARTY_CURRENCY_SILVER_SET_COMMIT:
+        case actionTypes.PARTY_CURRENCY_GOLD_SET_COMMIT:
+        case actionTypes.PARTY_CURRENCY_ELECTRUM_SET_COMMIT:
+        case actionTypes.PARTY_CURRENCY_COPPER_SET_COMMIT:
+        case actionTypes.PARTY_CURRENCY_PLATINUM_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_SILVER_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_GOLD_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_ELECTRUM_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_COPPER_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CURRENCY_PLATINUM_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_ADD_COMMIT:
+        case actionTypes.PARTY_ITEM_REMOVE_COMMIT:
+        case actionTypes.PARTY_ITEM_EQUIPPED_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_CHARGES_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_QUANTITY_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_ATTUNE_SET_COMMIT:
+        case actionTypes.PARTY_ITEM_MOVE_SET_COMMIT: {
+            return Object.assign(Object.assign({}, state), { partyInfo: (_a = partyInfo(state.partyInfo, action)) !== null && _a !== void 0 ? _a : null });
+        }
+        case actionTypes.CAMPAIGN_SETTINGS_SET_COMMIT: {
+            return Object.assign(Object.assign({}, state), { campaignSettings: action.payload });
+        }
+        default:
+        // not implemented
+    }
+    return state;
+}
+export default serviceData;
diff --git a/ddb_main/packages/rules-engine/es/reducers/syncTransaction.js b/ddb_main/packages/rules-engine/es/reducers/syncTransaction.js
new file mode 100644
index 0000000..1eb93a2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/reducers/syncTransaction.js
@@ -0,0 +1,17 @@
+import * as actionTypes from '../actions/syncTransaction/actionTypes';
+export const initialState = {
+    active: false,
+    initiator: null,
+};
+function syncTransaction(state = initialState, action) {
+    switch (action.type) {
+        case actionTypes.ACTIVATE:
+            return Object.assign(Object.assign({}, state), { active: true, initiator: action.payload.initiator });
+        case actionTypes.DEACTIVATE:
+            return Object.assign(Object.assign({}, state), { active: false, initiator: null });
+        default:
+        // not implemented
+    }
+    return state;
+}
+export default syncTransaction;
diff --git a/ddb_main/packages/rules-engine/es/reducers/utils.js b/ddb_main/packages/rules-engine/es/reducers/utils.js
new file mode 100644
index 0000000..8de1838
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/reducers/utils.js
@@ -0,0 +1,15 @@
+/**
+ *
+ * @param spellSlots
+ * @param spellLevel
+ * @param slotsUsed
+ */
+export function updateSpellSlots(spellSlots, spellLevel, slotsUsed) {
+    let newSpellSlots = [...spellSlots];
+    const levelIdx = newSpellSlots.findIndex((entity) => entity.level === spellLevel);
+    if (levelIdx > -1 && slotsUsed !== null) {
+        const newSlot = Object.assign(Object.assign({}, newSpellSlots[levelIdx]), { used: slotsUsed });
+        newSpellSlots = [...newSpellSlots.slice(0, levelIdx), newSlot, ...newSpellSlots.slice(levelIdx + 1)];
+    }
+    return newSpellSlots;
+}
diff --git a/ddb_main/packages/rules-engine/es/sagas/SagaHelpers.js b/ddb_main/packages/rules-engine/es/sagas/SagaHelpers.js
new file mode 100644
index 0000000..3099bc4
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/sagas/SagaHelpers.js
@@ -0,0 +1,20 @@
+import { call } from 'redux-saga/effects';
+import * as ApiAdapterUtils from '../apiAdapter/utils';
+/**
+ *
+ * @param apiMakeRequest
+ * @param requestParams
+ */
+export function* getApiRequestData(apiMakeRequest, requestParams, apiAdapterConfig) {
+    const response = yield call(sendApiRequest, apiMakeRequest, requestParams, apiAdapterConfig);
+    return ApiAdapterUtils.getResponseData(response);
+}
+/**
+ *
+ * @param apiMakeRequest
+ * @param requestParams
+ */
+export function* sendApiRequest(apiMakeRequest, requestParams, apiAdapterConfig) {
+    const response = yield call(apiMakeRequest, requestParams, apiAdapterConfig);
+    return response;
+}
diff --git a/ddb_main/packages/rules-engine/es/sagas/character/hacks.js b/ddb_main/packages/rules-engine/es/sagas/character/hacks.js
new file mode 100644
index 0000000..7aee644
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/sagas/character/hacks.js
@@ -0,0 +1,78 @@
+import { call, put, select } from 'redux-saga/effects';
+import { serviceDataActions } from '../../actions/serviceData';
+import { ApiHacks } from '../../api';
+import * as ApiAdapterUtils from '../../apiAdapter/utils';
+import { AccessTypeEnum } from '../../engine/Access';
+import { ClassAccessors } from '../../engine/Class';
+import { ClassFeatureAccessors } from '../../engine/ClassFeature';
+import { DefinitionPoolSimulators } from '../../engine/DefinitionPool';
+import { RaceAccessors } from '../../engine/Race';
+import { RacialTraitAccessors } from '../../engine/RacialTrait';
+import * as rulesEngineSelectors from '../../selectors/composite/engine';
+import { TypeScriptUtils } from '../../utils';
+/**
+ *
+ * same as handleLoadDefinitions but using the temporary characterService game-data requests
+ *
+ * @param definitionType
+ * @param definitionIds
+ */
+export function* hack__handleLoadDefinitions(definitionType, definitionIds) {
+    try {
+        // make the requests from the definition ids
+        const serviceResponse = yield call(ApiHacks.hack__characterServiceMakeGetIdsDefinitionTypeRequest(definitionType), {
+            ids: definitionIds,
+        });
+        let responseData = ApiAdapterUtils.getResponseData(serviceResponse);
+        if (responseData !== null) {
+            // compile all the definition and accessType responses
+            yield put(serviceDataActions.definitionPoolAdd(responseData.definitionData, responseData.accessTypes));
+        }
+    }
+    catch (error) { }
+}
+/**
+ *
+ */
+export function* hack__simulateOwnedDefinitionData() {
+    const race = yield select(rulesEngineSelectors.getRace);
+    if (race) {
+        yield call(hack__simulateOwnedRacialTraitDefinitionData, race);
+    }
+    yield call(hack__simulateOwnedClassFeatureDefinitionData);
+}
+/**
+ *
+ * @param race
+ */
+export function* hack__simulateOwnedRacialTraitDefinitionData(race) {
+    const racialTraitDefinitions = RaceAccessors.getDefinitionRacialTraits(race)
+        .map((contract) => {
+        var _a;
+        return (_a = RacialTraitAccessors.getDefinition(contract)) !== null && _a !== void 0 ? _a : null;
+    })
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    const racialTraitAccessTypeLookup = DefinitionPoolSimulators.simulateAccessTypeLookup(racialTraitDefinitions, AccessTypeEnum.OWNED);
+    if (racialTraitDefinitions.length) {
+        yield put(serviceDataActions.definitionPoolAdd(racialTraitDefinitions, racialTraitAccessTypeLookup));
+    }
+}
+/**
+ *
+ */
+export function* hack__simulateOwnedClassFeatureDefinitionData() {
+    const classes = yield select(rulesEngineSelectors.getClasses);
+    const classFeatureDefinitions = [];
+    classes.forEach((charClass) => {
+        ClassAccessors.getDefinitionClassFeatures(charClass).forEach((featureContract) => {
+            const definition = ClassFeatureAccessors.getDefinition(featureContract);
+            if (definition !== null) {
+                classFeatureDefinitions.push(definition);
+            }
+        });
+    });
+    const classFeatureAccessTypeLookup = DefinitionPoolSimulators.simulateAccessTypeLookup(classFeatureDefinitions, AccessTypeEnum.OWNED);
+    if (classFeatureDefinitions.length) {
+        yield put(serviceDataActions.definitionPoolAdd(classFeatureDefinitions, classFeatureAccessTypeLookup));
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/sagas/character/handlers.js b/ddb_main/packages/rules-engine/es/sagas/character/handlers.js
new file mode 100644
index 0000000..48f4d5a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/sagas/character/handlers.js
@@ -0,0 +1,2212 @@
+import { all, call, put, select } from 'redux-saga/effects';
+import { characterActions, characterEnvActions, featureFlagInfoActions, ruleDataActions, serviceDataActions, } from '../../actions';
+import { ApiRequests } from '../../api';
+import * as ApiUtils from '../../api/utils';
+import * as ApiAdapterUtils from '../../apiAdapter/utils';
+import { ConfigUtils } from '../../config';
+import { BackgroundAccessors } from '../../engine/Background';
+import { CampaignAccessors, PartyInventorySharingStateEnum } from '../../engine/Campaign';
+import { CharacterDerivers } from '../../engine/Character';
+import { ChoiceAccessors } from '../../engine/Choice';
+import { ClassAccessors, ClassUtils } from '../../engine/Class';
+import { ClassFeatureAccessors, ClassFeatureValidators } from '../../engine/ClassFeature';
+import { ContainerAccessors, ContainerTypeEnum, ContainerUtils, ContainerValidators, } from '../../engine/Container';
+import { AbilityScoreStatTypeEnum, AbilityScoreTypeEnum, BuilderChoiceSubtypeEnum, BuilderChoiceTypeEnum, EntityTypeEnum, PreferenceProgressionTypeEnum, StartingEquipmentTypeEnum, } from '../../engine/Core';
+import { CreatureAccessors } from '../../engine/Creature';
+import { DefinitionHacks, DefinitionTypeEnum, DefinitionUtils } from '../../engine/Definition';
+import { hack__generateDefinitionKey } from '../../engine/Definition/hacks';
+import { FeatAccessors } from '../../engine/Feat';
+import { FeatureFlagEnum } from '../../engine/FeatureFlagInfo';
+import { HelperUtils } from '../../engine/Helper';
+import { InfusionAccessors } from '../../engine/Infusion';
+import { InfusionChoiceAccessors, InfusionChoiceValidators } from '../../engine/InfusionChoice';
+import { ItemAccessors, ItemDerivers, ItemUtils } from '../../engine/Item';
+import { KnownInfusionAccessors } from '../../engine/KnownInfusion';
+import { ModifierAccessors } from '../../engine/Modifier';
+import { OptionalClassFeatureAccessors, OptionalClassFeatureSimulators, OptionalClassFeatureUtils, } from '../../engine/OptionalClassFeature';
+import { OptionalOriginAccessors, OptionalOriginSimulators, OptionalOriginUtils } from '../../engine/OptionalOrigin';
+import { RaceAccessors, RaceUtils } from '../../engine/Race';
+import { RacialTraitAccessors } from '../../engine/RacialTrait';
+import { RuleDataAccessors, RuleDataTypeEnum } from '../../engine/RuleData';
+import { SpellAccessors, SpellDerivers } from '../../engine/Spell';
+import { AdjustmentTypeEnum, ValueHacks } from '../../engine/Value';
+import { VehicleAccessors } from '../../engine/Vehicle';
+import * as NotificationUtils from '../../notification/utils';
+import { CharacterLoadingStatusEnum } from '../../reducers/constants';
+import * as SagaHelpers from '../../sagas/SagaHelpers';
+import { characterSelectors, serviceDataSelectors } from '../../selectors';
+import * as rulesEngineSelectors from '../../selectors/composite/engine';
+import { TypeScriptUtils } from '../../utils';
+import { callCommitAction } from '../../utils/ReduxActionUtils';
+import { serviceDataSagaHandlers } from '../serviceData';
+import { hack__handleLoadDefinitions, hack__simulateOwnedClassFeatureDefinitionData, hack__simulateOwnedDefinitionData, hack__simulateOwnedRacialTraitDefinitionData, } from './hacks';
+//TODO - could make an autoUpdate func that runs all update handlers with optional data - we do these combos in a few places so could be useful
+//TODO TCoE - pull out api handlers into own file
+/**
+ *
+ * @param definitionType
+ * @param definitionIds
+ */
+export function* handleLoadDefinitions(definitionType, definitionIds) {
+    try {
+        // make the requests from the definition ids
+        const serviceResponse = yield call(ApiUtils.makeGetIdsDefinitionTypeRequest(definitionType), {
+            ids: definitionIds,
+        });
+        let responseData = ApiAdapterUtils.getResponseData(serviceResponse);
+        if (responseData !== null) {
+            // compile all the definition and accessType responses
+            yield put(serviceDataActions.definitionPoolAdd(responseData.definitionData, responseData.accessTypes));
+        }
+    }
+    catch (error) { }
+}
+/**
+ *
+ */
+export function* handleLoadAlwaysKnownSpells() {
+    const background = yield select(rulesEngineSelectors.getBackgroundInfo);
+    let backgroundId;
+    if (background !== null && !background.hasCustomBackground) {
+        backgroundId = BackgroundAccessors.getId(background);
+    }
+    const classes = yield select(rulesEngineSelectors.getClasses);
+    const alwaysPreparedClasses = classes.filter((charClass) => ClassAccessors.getKnowsAllSpells(charClass));
+    const requests = alwaysPreparedClasses.map((charClass) => () => ApiRequests.getCharacterGameDataAlwaysKnownSpells({
+        params: {
+            classId: ClassAccessors.getActiveId(charClass),
+            classLevel: ClassAccessors.getLevel(charClass),
+            backgroundId,
+        },
+    }));
+    const classAlwaysKnownSpellResponses = yield all(requests.map(call));
+    for (let i = 0; i < classAlwaysKnownSpellResponses.length; i++) {
+        const response = classAlwaysKnownSpellResponses[i];
+        const data = ApiAdapterUtils.getResponseData(response);
+        const charClass = alwaysPreparedClasses[i];
+        if (data !== null && charClass) {
+            yield put(callCommitAction(serviceDataActions.classAlwaysKnownSpellsSet, data, ClassAccessors.getActiveId(charClass)));
+        }
+    }
+}
+/**
+ *
+ */
+export function* handleLoadCharacterLazyData() {
+    yield call(handleLoadAlwaysKnownSpells);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleCharacterLoad(action) {
+    yield put(characterEnvActions.dataSet({
+        loadingStatus: CharacterLoadingStatusEnum.LOADING,
+    }));
+    const flags = Object.values(FeatureFlagEnum);
+    const [characterResponse, configDataResponse, featureFlagInfoResponse, vehicleConfigDataResponse] = yield all([
+        call(ApiUtils.makeGetCharacterRequest(action.payload.characterId)),
+        call(ApiRequests.getCharacterRuleData, {
+            params: action.payload.requestParams,
+        }),
+        call(ApiRequests.getFeatureFlag, { flags }),
+        call(ApiRequests.getGameDataRuleDataVehicle, {
+            removeDefaultParams: true,
+            params: action.payload.requestParams,
+        }),
+    ]);
+    // get the response data
+    const characterJson = ApiAdapterUtils.getResponseData(characterResponse);
+    if (characterJson !== null) {
+        yield put(characterActions.characterSet(characterJson));
+    }
+    // get the rule data response data put it into the state
+    const configDataJson = ApiAdapterUtils.getResponseData(configDataResponse);
+    if (configDataJson !== null) {
+        yield put(ruleDataActions.dataSet(configDataJson));
+    }
+    // get the feature flag info response data put it into the state
+    const featureFlagInfoJson = ApiAdapterUtils.getResponseData(featureFlagInfoResponse);
+    if (featureFlagInfoJson !== null) {
+        yield put(featureFlagInfoActions.dataSet(featureFlagInfoJson));
+    }
+    yield put(serviceDataActions.partyInventoryRequest());
+    // get the vehicle rule data response data put it into the state
+    const vehicleConfigDataSourceData = ApiAdapterUtils.getResponseData(vehicleConfigDataResponse);
+    if (vehicleConfigDataSourceData !== null) {
+        yield put(callCommitAction(serviceDataActions.ruleDataPoolKeySet, RuleDataTypeEnum.VEHICLE, vehicleConfigDataSourceData));
+    }
+    const [vehicleMappingsResponse, componentMappingsResponse, infusionsKnownResponse, infusionResponse] = yield all([
+        call(ApiRequests.getCharacterVehicles),
+        call(ApiRequests.getCharacterVehicleComponents),
+        call(ApiRequests.getCharacterKnownInfusions),
+        call(ApiRequests.getCharacterInfusionItems),
+    ]);
+    const vehicleMappings = ApiAdapterUtils.getResponseData(vehicleMappingsResponse);
+    const componentMappings = ApiAdapterUtils.getResponseData(componentMappingsResponse);
+    const infusionMappings = ApiAdapterUtils.getResponseData(infusionResponse);
+    const knownInfusionMappings = ApiAdapterUtils.getResponseData(infusionsKnownResponse);
+    // get all infusion definitions
+    let infusionDefinitionIds = new Set();
+    if (infusionMappings !== null && infusionMappings.length) {
+        for (let i = 0; i < infusionMappings.length; i++) {
+            const mapping = infusionMappings[i];
+            yield put(callCommitAction(serviceDataActions.infusionMappingAdd, mapping));
+            const definitionKey = InfusionAccessors.getDefinitionKey(mapping);
+            if (definitionKey !== null) {
+                infusionDefinitionIds.add(DefinitionUtils.getDefinitionKeyId(definitionKey));
+            }
+        }
+    }
+    if (knownInfusionMappings !== null && knownInfusionMappings.length) {
+        for (let i = 0; i < knownInfusionMappings.length; i++) {
+            const mapping = knownInfusionMappings[i];
+            yield put(callCommitAction(serviceDataActions.knownInfusionMappingAdd, mapping));
+            const definitionKey = KnownInfusionAccessors.getDefinitionKey(mapping);
+            if (definitionKey !== null) {
+                infusionDefinitionIds.add(DefinitionUtils.getDefinitionKeyId(definitionKey));
+            }
+        }
+    }
+    if (infusionDefinitionIds.size > 0) {
+        yield call(handleLoadDefinitions, DefinitionTypeEnum.INFUSION, Array.from(infusionDefinitionIds));
+    }
+    // get vehicle definitions
+    const definitionIds = new Set();
+    if (vehicleMappings !== null && vehicleMappings.length) {
+        for (let i = 0; i < vehicleMappings.length; i++) {
+            const mapping = vehicleMappings[i];
+            yield put(callCommitAction(serviceDataActions.vehicleMappingAdd, mapping));
+            const definitionKey = VehicleAccessors.getDefinitionKey(mapping);
+            if (definitionKey !== null) {
+                definitionIds.add(DefinitionUtils.getDefinitionKeyId(definitionKey));
+            }
+        }
+        yield call(handleLoadDefinitions, DefinitionTypeEnum.VEHICLE, Array.from(definitionIds));
+    }
+    if (componentMappings !== null && componentMappings.length) {
+        for (let i = 0; i < componentMappings.length; i++) {
+            yield put(callCommitAction(serviceDataActions.vehicleComponentMappingAdd, componentMappings[i]));
+        }
+    }
+    //simulate game-data responses for granted class features and racial traits and add to definitionPool
+    yield call(hack__simulateOwnedDefinitionData);
+    //get optional class feature definitions
+    const optionalClassFeatureMappings = yield select(characterSelectors.getOptionalClassFeatures);
+    const optionalClassFeatureDefinitionIds = new Set();
+    optionalClassFeatureMappings === null || optionalClassFeatureMappings === void 0 ? void 0 : optionalClassFeatureMappings.forEach((mapping) => {
+        const definitionKey = OptionalClassFeatureAccessors.getDefinitionKey(mapping);
+        if (definitionKey !== null) {
+            const id = DefinitionHacks.hack__getDefinitionKeyId(definitionKey);
+            if (id !== null) {
+                optionalClassFeatureDefinitionIds.add(id);
+            }
+        }
+    });
+    if (optionalClassFeatureDefinitionIds.size) {
+        yield call(hack__handleLoadDefinitions, DefinitionTypeEnum.CLASS_FEATURE, Array.from(optionalClassFeatureDefinitionIds));
+    }
+    //get optional origin definitions
+    const optionalOriginsMappings = yield select(characterSelectors.getOptionalOrigins);
+    const optionalOriginDefinitionIds = new Set();
+    optionalOriginsMappings === null || optionalOriginsMappings === void 0 ? void 0 : optionalOriginsMappings.forEach((mapping) => {
+        const definitionKey = OptionalOriginAccessors.getDefinitionKey(mapping);
+        if (definitionKey !== null) {
+            const id = DefinitionHacks.hack__getDefinitionKeyId(definitionKey);
+            if (id !== null) {
+                optionalOriginDefinitionIds.add(id);
+            }
+        }
+    });
+    if (optionalOriginDefinitionIds.size) {
+        yield call(hack__handleLoadDefinitions, DefinitionTypeEnum.RACIAL_TRAIT, Array.from(optionalOriginDefinitionIds));
+    }
+    yield call(autoUpdateClassAlwaysPreparedSpells);
+    if (action.payload.config.includeAlwaysKnownSpells) {
+        yield call(handleLoadAlwaysKnownSpells);
+    }
+    yield call(handleLoadCharacterLazyData);
+    // Get all available campaign settings
+    const isCampaignSettingsActive = featureFlagInfoJson === null || featureFlagInfoJson === void 0 ? void 0 : featureFlagInfoJson[FeatureFlagEnum.RELEASE_GATE_CAMPAIGN_SETTINGS];
+    if (isCampaignSettingsActive) {
+        const allCampaignSettingsResponse = yield call(ApiRequests.getAllCampaignSettings);
+        const allCampaignSettings = ApiAdapterUtils.getResponseData(allCampaignSettingsResponse);
+        yield put(callCommitAction(serviceDataActions.campaignSettingsSet, allCampaignSettings));
+    }
+    yield put(characterEnvActions.dataSet({
+        loadingStatus: CharacterLoadingStatusEnum.LOADED,
+    }));
+}
+/**
+ *
+ */
+export function* autoUpdateClassAlwaysPreparedSpells(classIdLimiters = []) {
+    const classes = yield select(rulesEngineSelectors.getClasses);
+    const alwaysPreparedClasses = classes
+        .filter((charClass) => classIdLimiters.length ? classIdLimiters.includes(ClassAccessors.getActiveId(charClass)) : true)
+        .filter((charClass) => ClassAccessors.getKnowsAllSpells(charClass));
+    const requests = alwaysPreparedClasses.map((charClass) => () => ApiRequests.getCharacterGameDataAlwaysPreparedSpells({
+        params: {
+            classId: ClassAccessors.getActiveId(charClass),
+            classLevel: ClassAccessors.getLevel(charClass),
+        },
+    }));
+    const classAlwaysPreparedSpellResponses = yield all(requests.map(call));
+    for (let i = 0; i < classAlwaysPreparedSpellResponses.length; i++) {
+        const response = classAlwaysPreparedSpellResponses[i];
+        const data = ApiAdapterUtils.getResponseData(response);
+        const charClass = alwaysPreparedClasses[i];
+        if (data !== null && charClass) {
+            yield put(callCommitAction(serviceDataActions.classAlwaysPreparedSpellsSet, data, ClassAccessors.getActiveId(charClass)));
+        }
+    }
+}
+/**
+ *
+ * @param spellListIds
+ */
+export function* apiRemoveSpellsBySpellListIds(spellListIds) {
+    var _a;
+    if (!spellListIds.length) {
+        return;
+    }
+    yield call(SagaHelpers.getApiRequestData, ApiRequests.deleteCharacterSpellRemoveBySpellListIds, {
+        spellListIds,
+    });
+    const spellListIdLookup = spellListIds.reduce((acc, id) => {
+        acc[id] = true;
+        return acc;
+    }, {});
+    //TODO use generateClassSpellListSpellsLookup
+    const classes = yield select(rulesEngineSelectors.getClasses);
+    for (let i = 0; i < classes.length; i++) {
+        const charClass = classes[i];
+        const classMappingId = ClassAccessors.getMappingId(charClass);
+        const spells = ClassAccessors.getSpells(charClass);
+        for (let j = 0; j < spells.length; j++) {
+            const spell = spells[j];
+            if (HelperUtils.lookupDataOrFallback(spellListIdLookup, (_a = SpellAccessors.getSpellListId(spell)) !== null && _a !== void 0 ? _a : -1, false)) {
+                yield put(callCommitAction(characterActions.spellRemove, spell, classMappingId));
+            }
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleConditionAdd(action) {
+    const hitPointInfo = yield select(rulesEngineSelectors.getHitPointInfo);
+    const totalHp = hitPointInfo.totalHp;
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterCondition, Object.assign(Object.assign({}, action.payload), { totalHp }));
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleConditionSet(action) {
+    const hitPointInfo = yield select(rulesEngineSelectors.getHitPointInfo);
+    const totalHp = hitPointInfo.totalHp;
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterCondition, Object.assign(Object.assign({}, action.payload), { totalHp }));
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleConditionRemove(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.deleteCharacterCondition, action.payload);
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleRestoreLife(action) {
+    const { restoreType } = action.payload;
+    const hitPointInfo = yield select(rulesEngineSelectors.getHitPointInfo);
+    const totalHp = hitPointInfo.totalHp;
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterLifeRestore, { totalHp, restoreType });
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleAdhocFeatCreate(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterFeatAdHoc, action.payload);
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleAdhocFeatRemove(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.deleteCharacterFeatAdHoc, action.payload);
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleSetEntityFeat(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postEntityFeat, action.payload);
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleSendSocialImageData(action) {
+    const socialImageData = yield select(rulesEngineSelectors.getSocialImageData);
+    const isSheetReady = yield select(rulesEngineSelectors.isCharacterSheetReady);
+    if (isSheetReady) {
+        yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterDecorationSocialImage, socialImageData);
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleAbilityScoreSet(action) {
+    let { statId, type, value } = action.payload;
+    let requestParams = {
+        statId,
+        type,
+        value,
+    };
+    yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterAbilityScore, requestParams);
+    switch (action.payload.type) {
+        case AbilityScoreStatTypeEnum.OVERRIDE:
+            yield put(callCommitAction(characterActions.abilityScoreOverrideSet, statId, value));
+            break;
+        case AbilityScoreStatTypeEnum.BONUS:
+            yield put(callCommitAction(characterActions.abilityScoreBonusSet, statId, value));
+            break;
+        case AbilityScoreStatTypeEnum.BASE:
+            yield put(callCommitAction(characterActions.abilityScoreBaseSet, statId, value));
+            break;
+        default:
+        // not implemented
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handlePreferenceChoose(action) {
+    const { key, value } = action.payload;
+    switch (key) {
+        case 'enableOptionalClassFeatures': {
+            const classes = yield select(rulesEngineSelectors.getClasses);
+            if (typeof value === 'boolean') {
+                const spellListIdsToRemove = ClassUtils.getUpdateEnableOptionalClassFeaturesSpellListIdsToRemove(classes, value);
+                yield call(apiRemoveSpellsBySpellListIds, spellListIdsToRemove);
+            }
+            break;
+        }
+        case 'enableOptionalOrigins': {
+            const race = yield select(rulesEngineSelectors.getRace);
+            if (race && typeof value === 'boolean') {
+                const spellListIdsToRemove = RaceUtils.getUpdateEnableOptionalOriginsSpellListIdsToRemove(race, value);
+                yield call(apiRemoveSpellsBySpellListIds, spellListIdsToRemove);
+            }
+            break;
+        }
+        default:
+        //not implemented
+    }
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterPreferences, {
+        [key]: value,
+    });
+    yield put(callCommitAction(characterActions.preferenceSet, key, value));
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handlePortraitUpload(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterDecorationPortraitCustom, action.payload);
+    const { avatarId, avatarUrl } = data;
+    yield put(callCommitAction(characterActions.portraitSet, avatarId, avatarUrl));
+}
+/**
+ *
+ * @param action
+ */
+export function* handleRandomNameRequest(action) {
+    const race = yield select(rulesEngineSelectors.getRace);
+    let reqParams = {};
+    if (race !== null) {
+        reqParams = {
+            raceDefinitionKey: RaceAccessors.getDefinitionKey(race),
+        };
+    }
+    const name = yield call(SagaHelpers.getApiRequestData, ApiRequests.getCharacterNameRandom, {
+        params: reqParams,
+    });
+    yield put(characterActions.nameSet(name));
+}
+/**
+ *
+ * @param action
+ */
+export function* handleRaceChoose(action) {
+    const { race } = action.payload;
+    const existingRace = yield select(rulesEngineSelectors.getRace);
+    if (existingRace !== null) {
+        yield call(apiRemoveSpellsBySpellListIds, RaceAccessors.getSpellListIds(existingRace));
+        const existingOptionalOrigins = yield select(rulesEngineSelectors.getOptionalOrigins);
+        const optionalOriginsIdsToRemove = existingOptionalOrigins.map(OptionalOriginAccessors.getRacialTraitId);
+        yield call(apiRemoveOptionalOriginsCollection, {
+            racialTraitIds: optionalOriginsIdsToRemove,
+        });
+    }
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterRace, {
+        entityRaceId: RaceAccessors.getEntityRaceId(race),
+        entityRaceTypeId: RaceAccessors.getEntityRaceTypeId(race),
+    });
+    yield call(hack__simulateOwnedRacialTraitDefinitionData, race);
+    yield call(handleDataUpdates, data);
+    yield call(autoUpdateChoices);
+}
+/**
+ *
+ * @param apiPayload
+ */
+export function* apiRemoveOptionalOriginsCollection(apiPayload) {
+    if (!apiPayload.racialTraitIds.length) {
+        return;
+    }
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.deleteCharacterOptionalFeatureOriginCollection, apiPayload);
+    for (let i = 0; i < apiPayload.racialTraitIds.length; i++) {
+        yield put(callCommitAction(characterActions.optionalOriginRemove, apiPayload.racialTraitIds[i]));
+    }
+    return data;
+}
+/**
+ *
+ * @param action
+ */
+export function* handleClassAddRequest(action) {
+    const { charClass, level } = action.payload;
+    const { id } = charClass;
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterClass, {
+        classId: id,
+        level,
+    });
+    const preferences = yield select(rulesEngineSelectors.getCharacterPreferences);
+    const currentLevel = yield select(rulesEngineSelectors.getCurrentLevel);
+    const totalClassLevel = yield select(rulesEngineSelectors.getTotalClassLevel);
+    if (preferences.progressionType === PreferenceProgressionTypeEnum.XP && totalClassLevel > currentLevel) {
+        const ruleData = yield select(rulesEngineSelectors.getRuleData);
+        yield put(characterActions.xpSet(CharacterDerivers.deriveCurrentLevelXp(totalClassLevel, ruleData)));
+    }
+    yield call(handleDataUpdates, data);
+    yield call(autoUpdateChoices);
+    yield call(hack__simulateOwnedClassFeatureDefinitionData);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleClassRemoveRequest(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.deleteCharacterClass, action.payload);
+    const baseClassLookup = yield select(rulesEngineSelectors.getBaseClassLookup);
+    const charClassToRemove = HelperUtils.lookupDataOrFallback(baseClassLookup, action.payload.characterClassId);
+    const optionalClassFeatures = yield select(rulesEngineSelectors.getOptionalClassFeatures);
+    const optionalFeatureDefinitionKeys = new Set();
+    optionalClassFeatures.forEach((feature) => {
+        if (charClassToRemove === null) {
+            return;
+        }
+        const definitionKey = OptionalClassFeatureAccessors.getDefinitionKey(feature);
+        if (definitionKey === null) {
+            return;
+        }
+        const classFeature = OptionalClassFeatureAccessors.getClassFeature(feature);
+        if (classFeature === null) {
+            return;
+        }
+        if (ClassFeatureValidators.isValidClassClassFeature(charClassToRemove, classFeature)) {
+            optionalFeatureDefinitionKeys.add(definitionKey);
+        }
+    });
+    const idsToRemove = Array.from(optionalFeatureDefinitionKeys)
+        .map(DefinitionHacks.hack__getDefinitionKeyId)
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    yield call(apiRemoveOptionalClassFeatureCollection, {
+        classFeatureIds: idsToRemove,
+    });
+    if (action.payload.newCharacterXp !== null) {
+        yield put(characterActions.xpSet(action.payload.newCharacterXp));
+    }
+    yield call(handleDataUpdates, data);
+    yield call(autoUpdateInfusions);
+    yield call(autoUpdateChoices);
+}
+/**
+ *
+ * @param apiPayload
+ */
+export function* apiRemoveOptionalClassFeatureCollection(apiPayload) {
+    if (!apiPayload.classFeatureIds.length) {
+        return;
+    }
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.deleteCharacterOptionalFeatureClassFeatureCollection, apiPayload);
+    for (let i = 0; i < apiPayload.classFeatureIds.length; i++) {
+        yield put(callCommitAction(characterActions.optionalClassFeatureRemove, apiPayload.classFeatureIds[i]));
+    }
+    return data;
+}
+/**
+ *
+ * @param action
+ */
+export function* handleOptionalClassFeatureCreate(action) {
+    const data = yield call(apiOptionalClassFeatureCreate, action.payload);
+    //may need autoUpdateInfusions at some point
+    yield call(handleDataUpdates, data);
+    yield call(autoUpdateChoices);
+}
+/**
+ *
+ * @param apiPayload
+ */
+export function* apiOptionalClassFeatureCreate(apiPayload) {
+    const optionalClassFeatureResponseData = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterOptionalFeatureClassFeature, apiPayload);
+    const mappingContract = OptionalClassFeatureSimulators.simulateOptionalClassFeatureContract(apiPayload.classFeatureId, apiPayload.affectedClassFeatureId);
+    yield put(callCommitAction(characterActions.optionalClassFeatureAdd, mappingContract));
+    return optionalClassFeatureResponseData;
+}
+/**
+ *
+ * @param action
+ */
+export function* handleOptionalClassFeatureSetRequest(action) {
+    const optionalClassFeatures = yield select(rulesEngineSelectors.getOptionalClassFeatures);
+    const optionalFeature = optionalClassFeatures.find((feature) => OptionalClassFeatureAccessors.getClassFeatureId(feature) === action.payload.classFeatureId);
+    if (!optionalFeature) {
+        return;
+    }
+    const spellListIds = OptionalClassFeatureUtils.getUpdateMappingSpellListIdsToRemove(optionalFeature, action.payload);
+    yield call(apiRemoveSpellsBySpellListIds, spellListIds);
+    const data = yield call(apiOptionalClassFeatureSet, action.payload);
+    //may need autoUpdateInfusions at some point
+    yield call(handleDataUpdates, data);
+    yield call(autoUpdateChoices);
+}
+/**
+ *
+ * @param apiPayload
+ */
+export function* apiOptionalClassFeatureSet(apiPayload) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterOptionalFeatureClassFeature, apiPayload);
+    const newMappingContract = OptionalClassFeatureSimulators.simulateOptionalClassFeatureContract(apiPayload.classFeatureId, apiPayload.affectedClassFeatureId);
+    yield put(callCommitAction(characterActions.optionalClassFeatureSet, Object.assign({}, newMappingContract)));
+    return data;
+}
+/**
+ *
+ * @param action
+ */
+export function* handleOptionalClassFeatureDestroy(action) {
+    const optionalClassFeatures = yield select(rulesEngineSelectors.getOptionalClassFeatures);
+    const optionalFeature = optionalClassFeatures.find((feature) => OptionalClassFeatureAccessors.getClassFeatureId(feature) === action.payload.classFeatureId);
+    if (!optionalFeature) {
+        return;
+    }
+    const spellListIds = OptionalClassFeatureUtils.getRemoveMappingSpellListIds(optionalFeature);
+    yield call(apiRemoveSpellsBySpellListIds, spellListIds);
+    const data = yield call(apiOptionalClassFeatureDestroy, action.payload);
+    //may need autoUpdateInfusions at some point
+    yield call(handleDataUpdates, data);
+    yield call(autoUpdateChoices);
+}
+/**
+ *
+ * @param apiPayload
+ */
+export function* apiOptionalClassFeatureDestroy(apiPayload) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.deleteCharacterOptionalFeatureClassFeature, apiPayload);
+    yield put(callCommitAction(characterActions.optionalClassFeatureRemove, apiPayload.classFeatureId));
+    return data;
+}
+/**
+ *
+ * @param action
+ */
+export function* handleOptionalOriginCreate(action) {
+    const data = yield call(apiOptionalOriginCreate, action.payload);
+    yield call(handleDataUpdates, data);
+    yield call(autoUpdateChoices);
+}
+/**
+ *
+ * @param apiPayload
+ */
+export function* apiOptionalOriginCreate(apiPayload) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterOptionalFeatureOrigin, apiPayload);
+    const mappingContract = OptionalOriginSimulators.simulateOptionalOriginContract(apiPayload.racialTraitId, apiPayload.affectedRacialTraitId);
+    yield put(callCommitAction(characterActions.optionalOriginAdd, mappingContract));
+    return data;
+}
+/**
+ *
+ * @param action
+ */
+export function* handleOptionalOriginSetRequest(action) {
+    const optionalOrigins = yield select(rulesEngineSelectors.getOptionalOrigins);
+    const optionalOrigin = optionalOrigins.find((origin) => OptionalOriginAccessors.getRacialTraitId(origin) === action.payload.racialTraitId);
+    if (!optionalOrigin) {
+        return;
+    }
+    const spellListIds = OptionalOriginUtils.getUpdateMappingSpellListIdsToRemove(optionalOrigin, action.payload);
+    yield call(apiRemoveSpellsBySpellListIds, spellListIds);
+    const data = yield call(apiOptionalOriginSet, action.payload);
+    yield call(handleDataUpdates, data);
+    yield call(autoUpdateChoices);
+}
+/**
+ *
+ * @param apiPayload
+ */
+export function* apiOptionalOriginSet(apiPayload) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterOptionalFeatureOrigin, apiPayload);
+    const newMappingContract = OptionalOriginSimulators.simulateOptionalOriginContract(apiPayload.racialTraitId, apiPayload.affectedRacialTraitId);
+    yield put(callCommitAction(characterActions.optionalOriginSet, Object.assign({}, newMappingContract)));
+    return data;
+}
+/**
+ *
+ * @param action
+ */
+export function* handleOptionalOriginDestroy(action) {
+    const optionalOrigins = yield select(rulesEngineSelectors.getOptionalOrigins);
+    const optionalOrigin = optionalOrigins.find((origin) => OptionalOriginAccessors.getRacialTraitId(origin) === action.payload.racialTraitId);
+    if (!optionalOrigin) {
+        return;
+    }
+    const spellListIds = OptionalOriginUtils.getRemoveMappingSpellListIds(optionalOrigin);
+    yield call(apiRemoveSpellsBySpellListIds, spellListIds);
+    const data = yield call(apiOptionalOriginDestroy, action.payload);
+    yield call(handleDataUpdates, data);
+    yield call(autoUpdateChoices);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleCampaignSettingSetRequest(action) {
+    const CampaignSetting = yield select(rulesEngineSelectors.getCampaignSetting);
+    if (!CampaignSetting) {
+        return;
+    }
+    const data = yield call(apiCampaignSettingSet, action.payload);
+    yield call(handleDataUpdates, data);
+    yield call(autoUpdateChoices);
+}
+/**
+ *
+ * @param apiPayload
+ */
+export function* apiCampaignSettingSet(apiPayload) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterCampaignSetting, apiPayload);
+    yield put(callCommitAction(characterActions.campaignSettingSet, Object.assign({}, apiPayload)));
+    return data;
+}
+/**
+ *
+ * @param apiPayload
+ */
+export function* apiOptionalOriginDestroy(apiPayload) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.deleteCharacterOptionalFeatureOrigin, apiPayload);
+    yield put(callCommitAction(characterActions.optionalOriginRemove, apiPayload.racialTraitId));
+    return data;
+}
+/**
+ *
+ * @param action
+ */
+export function* handleCustomItemCreate(action) {
+    //TODO v5.1: remove when mobile moves up - keep the if logic - remove everything in the else
+    const containerLookup = yield select(rulesEngineSelectors.getContainerLookup);
+    const { includeCustomItems } = ConfigUtils.getCurrentRulesEngineConfig();
+    const { quantity, description, containerDefinitionKey, cost, name, notes, weight, partyId } = action.payload;
+    const isSharedContainer = containerDefinitionKey
+        ? ContainerValidators.validateIsShared(containerDefinitionKey, containerLookup)
+        : false;
+    if (includeCustomItems) {
+        const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterCustomItem, {
+            quantity,
+            description,
+            cost,
+            name,
+            notes,
+            weight,
+            containerEntityId: containerDefinitionKey
+                ? DefinitionHacks.hack__getDefinitionKeyId(containerDefinitionKey)
+                : null,
+            containerEntityTypeId: containerDefinitionKey
+                ? DefinitionHacks.hack__getDefinitionKeyType(containerDefinitionKey)
+                : null,
+            partyId: isSharedContainer ? partyId : null,
+        });
+        //put data for item/notes and customItem
+        if (data.addItems) {
+            if (notes) {
+                yield put(callCommitAction(characterActions.valueSet, AdjustmentTypeEnum.NOTES, notes, null, ValueHacks.hack__toString(ItemAccessors.getMappingId(data.addItems[0])), ValueHacks.hack__toString(ItemAccessors.getMappingEntityTypeId(data.addItems[0])), null, null, partyId));
+            }
+            const customItem = ItemDerivers.deriveOriginalCustomContract(data.addItems[0], notes);
+            yield put(callCommitAction(characterActions.customItemAdd, customItem));
+            yield call(handleCommitAddItems, data.addItems);
+        }
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+        yield call(handleDataUpdates, data);
+    }
+    else {
+        const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterCustomItemV5, action.payload);
+        yield put(callCommitAction(characterActions.customItemAdd, data));
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleCustomItemDestroy(action) {
+    //TODO v5.1: remove when mobile moves up
+    //no longer need useCustomItems flag
+    //keep the if logic - remove everything in the else
+    const { includeCustomItems } = ConfigUtils.getCurrentRulesEngineConfig();
+    const { id, partyId, mappingId } = action.payload;
+    if (includeCustomItems) {
+        const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.deleteCharacterCustomItem, action.payload);
+        //if partyId is passed in, the item is shared
+        if (!partyId) {
+            // remove Item and CustomItem from character
+            yield put(callCommitAction(characterActions.itemRemove, mappingId));
+            yield put(callCommitAction(characterActions.customItemRemove, id));
+        }
+        else {
+            // remove Item from party
+            yield put(callCommitAction(serviceDataActions.partyItemRemove, mappingId));
+        }
+    }
+    else {
+        //Calls the V5 version and commits to character custom items
+        yield put(characterActions.customItemRemove(id));
+    }
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+export function* handleCustomItemSet(action) {
+    //TODO v5.1: remove when mobile moves up
+    //no longer need useCustomItems flag
+    //keep the if logic - remove everything in the else
+    const { includeCustomItems } = ConfigUtils.getCurrentRulesEngineConfig();
+    const { id, properties, mappingId, partyId } = action.payload;
+    if (includeCustomItems) {
+        const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterCustomItem, Object.assign({ id,
+            mappingId, partyId: partyId !== null && partyId !== void 0 ? partyId : null }, properties));
+        //if partyId is passed in, the item is shared
+        if (!partyId) {
+            // update Item and CustomItem from character
+            yield put(callCommitAction(characterActions.customItemSet, id, properties));
+        }
+        if (data.addItems) {
+            if (typeof properties.notes !== undefined) {
+                yield put(callCommitAction(characterActions.valueSet, AdjustmentTypeEnum.NOTES, properties.notes, null, ValueHacks.hack__toString(ItemAccessors.getMappingId(data.addItems[0])), ValueHacks.hack__toString(ItemAccessors.getMappingEntityTypeId(data.addItems[0])), null, null, partyId));
+            }
+            yield call(handleCommitAddItems, data.addItems);
+        }
+    }
+    else {
+        //Calls the V5 version and commits to character custom items
+        const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterCustomItemV5, Object.assign({ id }, properties));
+        yield put(callCommitAction(characterActions.customItemSet, id, properties));
+    }
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleItemCustomizationsDelete(action) {
+    const { mappingId, mappingEntityTypeId, partyId } = action.payload;
+    const id = ValueHacks.hack__toString(mappingId);
+    const entityTypeId = ValueHacks.hack__toString(mappingEntityTypeId);
+    yield put(characterActions.entityValuesRemove(id, entityTypeId, null, null, partyId));
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+export function* handleContainerDestroy(item, removeContents) {
+    const itemMappingId = ItemAccessors.getMappingId(item);
+    const containerLookup = yield select(rulesEngineSelectors.getContainerLookup);
+    const inventoryLookup = yield select(rulesEngineSelectors.getInventoryLookup);
+    const partyInventoryLookup = yield select(rulesEngineSelectors.getPartyInventoryLookup);
+    const container = HelperUtils.lookupDataOrFallback(containerLookup, DefinitionHacks.hack__generateDefinitionKey(ContainerTypeEnum.ITEM, itemMappingId));
+    if (container) {
+        if (removeContents) {
+            const itemMappingIdsToRemove = ContainerAccessors.getItemMappingIds(container);
+            for (let i = 0; i < itemMappingIdsToRemove.length; i++) {
+                const foundItem = HelperUtils.lookupDataOrFallback(inventoryLookup, itemMappingIdsToRemove[i]);
+                const foundPartyItem = HelperUtils.lookupDataOrFallback(partyInventoryLookup, itemMappingIdsToRemove[i]);
+                if (foundItem || foundPartyItem) {
+                    let infusion;
+                    if (foundItem) {
+                        infusion = ItemAccessors.getInfusion(foundItem);
+                    }
+                    else if (foundPartyItem) {
+                        infusion = ItemAccessors.getInfusion(foundPartyItem);
+                    }
+                    if (infusion) {
+                        const infusionId = InfusionAccessors.getId(infusion);
+                        if (infusionId !== null) {
+                            yield put(callCommitAction(serviceDataActions.infusionMappingRemove, infusionId, itemMappingIdsToRemove[i]));
+                        }
+                    }
+                }
+                if (foundItem) {
+                    yield put(callCommitAction(characterActions.itemRemove, itemMappingIdsToRemove[i], true));
+                }
+                else if (foundPartyItem) {
+                    yield put(callCommitAction(serviceDataActions.partyItemRemove, itemMappingIdsToRemove[i], true));
+                }
+            }
+        }
+        else {
+            const itemMappingIdsToMove = ContainerAccessors.getItemMappingIds(container);
+            const isShared = ContainerAccessors.isShared(container);
+            const characterId = yield select(rulesEngineSelectors.getId);
+            for (let i = 0; i < itemMappingIdsToMove.length; i++) {
+                if (isShared) {
+                    const campaign = yield select(rulesEngineSelectors.getCampaign);
+                    if (campaign) {
+                        yield put(callCommitAction(serviceDataActions.partyItemMoveSet, itemMappingIdsToMove[i], CampaignAccessors.getId(campaign), ContainerTypeEnum.CAMPAIGN));
+                    }
+                }
+                else {
+                    yield put(callCommitAction(characterActions.itemMoveSet, itemMappingIdsToMove[i], characterId, ContainerTypeEnum.CHARACTER));
+                }
+            }
+            const infusion = ItemAccessors.getInfusion(item);
+            if (infusion) {
+                yield put(callCommitAction(serviceDataActions.infusionMappingRemove, InfusionAccessors.getId(infusion), itemMappingId));
+            }
+        }
+        if (ContainerAccessors.isShared(container)) {
+            yield put(serviceDataActions.partyItemRemove(itemMappingId, removeContents));
+        }
+        else {
+            yield put(characterActions.itemRemove(itemMappingId, removeContents));
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleItemDestroy(action) {
+    const { id, removeContainerContents } = action.payload;
+    // handle the case where the item is the characters item
+    const inventoryLookup = yield select(rulesEngineSelectors.getInventoryLookup);
+    let item = HelperUtils.lookupDataOrFallback(inventoryLookup, id);
+    if (item) {
+        //if item isContainer, handle removing container and contents
+        if (ItemAccessors.isContainer(item)) {
+            yield call(handleContainerDestroy, item, removeContainerContents);
+        }
+        else {
+            //item is not container, just remove it (removeContainerContents should be false for now)
+            yield put(characterActions.itemRemove(id, false));
+        }
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+        return;
+    }
+    //handle the case where the item is the party's item
+    const partyInventoryLookup = yield select(rulesEngineSelectors.getPartyInventoryLookup);
+    item = HelperUtils.lookupDataOrFallback(partyInventoryLookup, id);
+    if (item) {
+        //if item isContainer, handle removing container and contents
+        //  TODO IMS: check that this works with shared containers
+        if (ItemAccessors.isContainer(item)) {
+            yield call(handleContainerDestroy, item, removeContainerContents);
+        }
+        else {
+            //item is not container, just remove it (removeContainerContents should be false for now)
+            yield put(serviceDataActions.partyItemRemove(id, false));
+            const partyInfo = yield select(serviceDataSelectors.getPartyInfo);
+            if (partyInfo &&
+                CampaignAccessors.getSharingState(partyInfo) === PartyInventorySharingStateEnum.DELETE_ONLY) {
+                const partyInventory = CampaignAccessors.getPartyBaseInventoryContracts(partyInfo);
+                // If all that is left if what we just deleted
+                if (partyInventory.length === 1 && ItemAccessors.getId(partyInventory[0]) === id) {
+                    yield put(serviceDataActions.partyCampaignInfoSet(Object.assign(Object.assign({}, partyInfo), { sharingState: PartyInventorySharingStateEnum.OFF })));
+                }
+            }
+        }
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+        return;
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleItemCreate(action) {
+    var _a, _b;
+    const { item, quantity, containerDefinitionKey } = action.payload;
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterInventoryItem, {
+        equipment: [
+            {
+                containerEntityId: containerDefinitionKey
+                    ? DefinitionHacks.hack__getDefinitionKeyId(containerDefinitionKey)
+                    : undefined,
+                containerEntityTypeId: containerDefinitionKey
+                    ? DefinitionHacks.hack__getDefinitionKeyType(containerDefinitionKey)
+                    : undefined,
+                entityId: ItemAccessors.getDefinitionId(item),
+                entityTypeId: ItemAccessors.getDefinitionEntityTypeId(item),
+                quantity,
+            },
+        ],
+    }, { onError: (_a = action === null || action === void 0 ? void 0 : action.meta) === null || _a === void 0 ? void 0 : _a.reject, onSuccess: (_b = action === null || action === void 0 ? void 0 : action.meta) === null || _b === void 0 ? void 0 : _b.accept });
+    if (data.addItems) {
+        yield call(handleCommitAddItems, data.addItems);
+    }
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+    yield call(handleDataUpdates, data);
+}
+function* handleCommitAddItems(addItems) {
+    const containers = yield select(rulesEngineSelectors.getInventoryContainers);
+    for (let i = 0; i < addItems.length; i++) {
+        const itemContainer = ContainerUtils.getItemParentContainer(containers, ItemAccessors.getContainerDefinitionKey(addItems[i]));
+        if (itemContainer && ContainerAccessors.isShared(itemContainer)) {
+            yield put(callCommitAction(serviceDataActions.partyItemAdd, addItems[i]));
+        }
+        else {
+            yield put(callCommitAction(characterActions.itemAdd, addItems[i]));
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleItemMove(action) {
+    var _a;
+    const containerLookup = yield select(rulesEngineSelectors.getContainerLookup);
+    const inventoryLookup = yield select(rulesEngineSelectors.getInventoryLookup);
+    const partyInventoryLookup = yield select(rulesEngineSelectors.getPartyInventoryLookup);
+    const item = (_a = HelperUtils.lookupDataOrFallback(inventoryLookup, action.payload.id)) !== null && _a !== void 0 ? _a : HelperUtils.lookupDataOrFallback(partyInventoryLookup, action.payload.id);
+    if (!item) {
+        return;
+    }
+    const isCurrentContainerShared = ItemUtils.isShared(item, containerLookup);
+    const isDestinationContainerShared = ContainerValidators.validateIsShared(DefinitionHacks.hack__generateDefinitionKey(action.payload.containerEntityTypeId, action.payload.containerEntityId), containerLookup);
+    const isItemContainer = ItemAccessors.isContainer(item);
+    yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterInventoryItemMove, action.payload);
+    if (isCurrentContainerShared) {
+        //currently in party
+        if (isDestinationContainerShared) {
+            //still in party
+            yield put(callCommitAction(serviceDataActions.partyItemMoveSet, action.payload.id, action.payload.containerEntityId, action.payload.containerEntityTypeId));
+        }
+        else {
+            if (isItemContainer) {
+                const inventoryItems = yield select(rulesEngineSelectors.getPartyInventory);
+                const itemContainer = HelperUtils.lookupDataOrFallback(containerLookup, DefinitionHacks.hack__generateDefinitionKey(EntityTypeEnum.ITEM, ItemAccessors.getMappingId(item)));
+                // If item is container we need to move contents to inventory
+                if (itemContainer) {
+                    const inventoryInContainer = ContainerUtils.getInventoryItems(itemContainer, inventoryItems);
+                    for (let i = 0; i < inventoryInContainer.length; i++) {
+                        yield put(callCommitAction(characterActions.itemAdd, Object.assign(Object.assign({}, inventoryInContainer[i]), { containerEntityId: ContainerAccessors.getMappingId(itemContainer), containerEntityTypeId: ContainerAccessors.getContainerType(itemContainer), containerDefinitionKey: ContainerAccessors.getDefinitionKey(itemContainer) })));
+                        yield put(callCommitAction(serviceDataActions.partyItemRemove, ItemAccessors.getMappingId(inventoryInContainer[i])));
+                    }
+                }
+            }
+            //moving to character
+            yield put(callCommitAction(characterActions.itemAdd, Object.assign(Object.assign({}, item), { containerEntityId: action.payload.containerEntityId, containerEntityTypeId: action.payload.containerEntityTypeId, containerDefinitionKey: DefinitionHacks.hack__generateDefinitionKey(action.payload.containerEntityTypeId, action.payload.containerEntityId) })));
+            yield put(callCommitAction(serviceDataActions.partyItemRemove, ItemAccessors.getMappingId(item)));
+        }
+    }
+    else {
+        //currently on character
+        if (isDestinationContainerShared) {
+            if (isItemContainer) {
+                const inventoryItems = yield select(rulesEngineSelectors.getInventory);
+                const itemContainer = HelperUtils.lookupDataOrFallback(containerLookup, DefinitionHacks.hack__generateDefinitionKey(EntityTypeEnum.ITEM, ItemAccessors.getMappingId(item)));
+                // If item is container we need to move contents to party inventory
+                if (itemContainer) {
+                    const inventoryInContainer = ContainerUtils.getInventoryItems(itemContainer, inventoryItems);
+                    for (let i = 0; i < inventoryInContainer.length; i++) {
+                        yield put(callCommitAction(serviceDataActions.partyItemAdd, Object.assign(Object.assign({}, inventoryInContainer[i]), { containerEntityId: ContainerAccessors.getMappingId(itemContainer), containerEntityTypeId: ContainerAccessors.getContainerType(itemContainer), containerDefinitionKey: ContainerAccessors.getDefinitionKey(itemContainer) })));
+                        yield put(callCommitAction(characterActions.itemRemove, ItemAccessors.getMappingId(inventoryInContainer[i])));
+                    }
+                }
+            }
+            //moving to party
+            yield put(callCommitAction(serviceDataActions.partyItemAdd, Object.assign(Object.assign({}, item), { containerEntityId: action.payload.containerEntityId, containerEntityTypeId: action.payload.containerEntityTypeId, containerDefinitionKey: DefinitionHacks.hack__generateDefinitionKey(action.payload.containerEntityTypeId, action.payload.containerEntityId) })));
+            yield put(callCommitAction(characterActions.itemRemove, ItemAccessors.getMappingId(item)));
+        }
+        else {
+            //still on character
+            yield put(callCommitAction(characterActions.itemMoveSet, action.payload.id, action.payload.containerEntityId, action.payload.containerEntityTypeId));
+        }
+    }
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleItemEquippedSet(action) {
+    var _a;
+    // If we are unequipping and item is attuned, unattune it as well
+    const containerLookup = yield select(rulesEngineSelectors.getContainerLookup);
+    const inventoryLookup = yield select(rulesEngineSelectors.getInventoryLookup);
+    const partyInventoryLookup = yield select(rulesEngineSelectors.getPartyInventoryLookup);
+    const item = (_a = HelperUtils.lookupDataOrFallback(inventoryLookup, action.payload.id)) !== null && _a !== void 0 ? _a : HelperUtils.lookupDataOrFallback(partyInventoryLookup, action.payload.id);
+    if (!action.payload.value) {
+        if (item !== null && ItemAccessors.isAttuned(item)) {
+            yield put(characterActions.itemAttuneSet(action.payload.id, false));
+        }
+    }
+    const equipParams = {
+        id: action.payload.id,
+        value: action.payload.value,
+    };
+    yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterInventoryItemEquipped, equipParams);
+    if (item) {
+        if (ItemUtils.isShared(item, containerLookup)) {
+            yield put(callCommitAction(serviceDataActions.partyItemEquippedSet, ...Object.values(action.payload)));
+        }
+        else {
+            yield put(callCommitAction(characterActions.itemEquippedSet, ...Object.values(action.payload)));
+        }
+    }
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+export function* handleItemAttuneSet(action) {
+    var _a;
+    const containerLookup = yield select(rulesEngineSelectors.getContainerLookup);
+    const inventoryLookup = yield select(rulesEngineSelectors.getInventoryLookup);
+    const partyInventoryLookup = yield select(rulesEngineSelectors.getPartyInventoryLookup);
+    const item = (_a = HelperUtils.lookupDataOrFallback(inventoryLookup, action.payload.id)) !== null && _a !== void 0 ? _a : HelperUtils.lookupDataOrFallback(partyInventoryLookup, action.payload.id);
+    const attuneParams = Object.assign({}, action.payload);
+    yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterInventoryItemAttuned, attuneParams);
+    if (item) {
+        if (ItemUtils.isShared(item, containerLookup)) {
+            yield put(callCommitAction(serviceDataActions.partyItemAttuneSet, ...Object.values(action.payload)));
+        }
+        else {
+            yield put(callCommitAction(characterActions.itemAttuneSet, ...Object.values(action.payload)));
+        }
+    }
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+export function* handleItemQuantitySet(action) {
+    var _a;
+    const containerLookup = yield select(rulesEngineSelectors.getContainerLookup);
+    const inventoryLookup = yield select(rulesEngineSelectors.getInventoryLookup);
+    const partyInventoryLookup = yield select(rulesEngineSelectors.getPartyInventoryLookup);
+    const item = (_a = HelperUtils.lookupDataOrFallback(inventoryLookup, action.payload.id)) !== null && _a !== void 0 ? _a : HelperUtils.lookupDataOrFallback(partyInventoryLookup, action.payload.id);
+    const quantityParams = Object.assign({}, action.payload);
+    yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterInventoryItemQuantity, quantityParams);
+    if (item) {
+        if (ItemUtils.isShared(item, containerLookup)) {
+            yield put(callCommitAction(serviceDataActions.partyItemQuantitySet, ...Object.values(action.payload)));
+        }
+        else {
+            yield put(callCommitAction(characterActions.itemQuantitySet, ...Object.values(action.payload)));
+        }
+    }
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+export function* handleItemChargesSet(action) {
+    var _a;
+    const containerLookup = yield select(rulesEngineSelectors.getContainerLookup);
+    const inventoryLookup = yield select(rulesEngineSelectors.getInventoryLookup);
+    const partyInventoryLookup = yield select(rulesEngineSelectors.getPartyInventoryLookup);
+    const item = (_a = HelperUtils.lookupDataOrFallback(inventoryLookup, action.payload.id)) !== null && _a !== void 0 ? _a : HelperUtils.lookupDataOrFallback(partyInventoryLookup, action.payload.id);
+    const chargeParams = Object.assign(Object.assign({}, action.payload), { charges: action.payload.uses });
+    yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterInventoryItemCharge, chargeParams);
+    if (item) {
+        if (ItemUtils.isShared(item, containerLookup)) {
+            yield put(callCommitAction(serviceDataActions.partyItemChargesSet, ...Object.values(action.payload)));
+        }
+        else {
+            yield put(callCommitAction(characterActions.itemChargesSet, ...Object.values(action.payload)));
+        }
+    }
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleStartingEquipmentAdd(action) {
+    const { items, gold, custom } = action.payload;
+    if (items && !items.length && !gold && custom && !custom.length) {
+        yield put(characterActions.startingEquipmentTypeSet(StartingEquipmentTypeEnum.GUIDED));
+        if (action.meta.reject) {
+            action.meta.reject();
+        }
+        return;
+    }
+    let itemsResponse = null;
+    if (items && items.length) {
+        let params = {
+            equipment: items,
+        };
+        itemsResponse = yield call(SagaHelpers.sendApiRequest, ApiRequests.postCharacterInventoryItem, params);
+    }
+    let goldResponse = null;
+    if (gold) {
+        const currentCurrencies = yield select(characterSelectors.getCurrencies);
+        const currentGold = currentCurrencies === null ? 0 : currentCurrencies.gp;
+        let goldParams = {
+            amount: currentGold + gold,
+        };
+        goldResponse = yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterInventoryCurrencyGold, goldParams);
+        yield put(callCommitAction(characterActions.currencyGoldSet, goldParams.amount));
+    }
+    let customResponse = null;
+    if (custom && custom.length) {
+        const currentNotes = yield select(characterSelectors.getNotes);
+        const personalPossessions = `${currentNotes && currentNotes.personalPossessions ? currentNotes.personalPossessions + '\n' : ''}${custom.join('\n')}`;
+        const noteParams = {
+            personalPossessions,
+        };
+        customResponse = yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterDescriptionNotes, noteParams);
+        yield put(callCommitAction(characterActions.noteSet, 'personalPossessions', personalPossessions));
+    }
+    if ((itemsResponse && itemsResponse.data.success) ||
+        (goldResponse && goldResponse.data.success) ||
+        (customResponse && customResponse.data.success)) {
+        if (itemsResponse && itemsResponse.data.success) {
+            const data = ApiAdapterUtils.getResponseData(itemsResponse);
+            if (data && data.addItems) {
+                for (let i = 0; i < data.addItems.length; i++) {
+                    yield put(callCommitAction(characterActions.itemAdd, data.addItems[i]));
+                }
+            }
+        }
+        yield put(characterActions.startingEquipmentTypeSet(StartingEquipmentTypeEnum.GUIDED));
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+    }
+    else {
+        //TODO do something with error
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleStartingGoldAdd(action) {
+    const { gold } = action.payload;
+    let goldResponse = null;
+    if (gold) {
+        const currentCurrencies = yield select(characterSelectors.getCurrencies);
+        const currentGold = currentCurrencies === null ? 0 : currentCurrencies.gp;
+        let goldParams = {
+            amount: currentGold + gold,
+        };
+        goldResponse = yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterInventoryCurrencyGold, goldParams);
+        yield put(callCommitAction(characterActions.currencyGoldSet, goldParams.amount));
+    }
+    if (goldResponse && goldResponse.data.success) {
+        yield put(characterActions.startingEquipmentTypeSet(StartingEquipmentTypeEnum.GUIDED));
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+    }
+    else {
+        //TODO do something with error
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleCurrencyTransactionSet(action) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    let data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterInventoryCurrencyTransaction, action.payload, {
+        onSuccess: action.meta.accept,
+        onError: action.meta.reject,
+    });
+    // if the request fails because it is offline(mobile-only) the we still want to process the change.
+    if (data.isOfflineResponse && action.payload.destinationEntityTypeId && action.payload.destinationEntityId) {
+        const containerEntityTypeId = action.payload.destinationEntityTypeId;
+        const containerEntityId = action.payload.destinationEntityId;
+        const containerDefinitionKey = hack__generateDefinitionKey(containerEntityTypeId, containerEntityId);
+        const containerLookup = yield select(rulesEngineSelectors.getContainerLookup);
+        const container = HelperUtils.lookupDataOrFallback(containerLookup, containerDefinitionKey);
+        if (container) {
+            const coins = container
+                ? ContainerAccessors.getCoin(container)
+                : null;
+            if (coins) {
+                data.cp = (coins.cp || 0) + ((_b = (_a = action.payload) === null || _a === void 0 ? void 0 : _a.cp) !== null && _b !== void 0 ? _b : 0);
+                data.ep = (coins.ep || 0) + ((_d = (_c = action.payload) === null || _c === void 0 ? void 0 : _c.ep) !== null && _d !== void 0 ? _d : 0);
+                data.gp = (coins.gp || 0) + ((_f = (_e = action.payload) === null || _e === void 0 ? void 0 : _e.gp) !== null && _f !== void 0 ? _f : 0);
+                data.pp = (coins.pp || 0) + ((_h = (_g = action.payload) === null || _g === void 0 ? void 0 : _g.pp) !== null && _h !== void 0 ? _h : 0);
+                data.sp = (coins.sp || 0) + ((_k = (_j = action.payload) === null || _j === void 0 ? void 0 : _j.sp) !== null && _k !== void 0 ? _k : 0);
+            }
+        }
+    }
+    if (data) {
+        if (action.payload.destinationEntityTypeId === ContainerTypeEnum.CHARACTER) {
+            yield put(callCommitAction(characterActions.currenciesSet, data));
+        }
+        else if (action.payload.destinationEntityTypeId === ContainerTypeEnum.CAMPAIGN) {
+            yield put(callCommitAction(serviceDataActions.partyCurrenciesSet, data));
+        }
+        else if (action.payload.destinationEntityId && action.payload.destinationEntityTypeId) {
+            const containerLookup = yield select(rulesEngineSelectors.getContainerLookup);
+            const isShared = ContainerValidators.validateIsShared(hack__generateDefinitionKey(action.payload.destinationEntityTypeId, action.payload.destinationEntityId), containerLookup);
+            if (isShared) {
+                yield put(callCommitAction(serviceDataActions.partyItemCurrencySet, data, action.payload.destinationEntityId));
+            }
+            else {
+                yield put(callCommitAction(characterActions.itemCurrencySet, data, action.payload.destinationEntityId));
+            }
+        }
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleRacialTraitChoiceSetRequest(action) {
+    const { racialTraitId, choiceId } = action.payload;
+    yield call(apiRacialTraitChoiceSet, action);
+    const race = yield select(rulesEngineSelectors.getRace);
+    if (race) {
+        const racialTrait = RaceAccessors.getRacialTraits(race).find((racialTrait) => RacialTraitAccessors.getId(racialTrait) === racialTraitId);
+        if (racialTrait) {
+            const racialTraitChoice = RacialTraitAccessors.getChoices(racialTrait).find((choice) => ChoiceAccessors.getId(choice) === choiceId);
+            if (racialTraitChoice) {
+                yield call(autoUpdateChoices, racialTraitChoice);
+            }
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+function* apiRacialTraitChoiceSet(action) {
+    const { racialTraitId, choiceType, choiceId, optionValue } = action.payload;
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterRaceRacialTraitChoice, {
+        racialTraitId,
+        type: choiceType,
+        choiceKey: choiceId,
+        choiceValue: optionValue,
+    });
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleClassFeatureChoiceSetRequest(action) {
+    const { classId, classFeatureId, choiceId, choiceType, optionValue } = action.payload;
+    let oldClasses = yield select(rulesEngineSelectors.getClasses);
+    let oldCharClass = oldClasses.find((charClass) => ClassAccessors.getActiveId(charClass) === classId);
+    if (choiceType === BuilderChoiceTypeEnum.SUB_CLASS_OPTION && oldCharClass) {
+        const subclass = ClassAccessors.getSubclass(oldCharClass);
+        if (subclass !== null) {
+            const spellListIds = ClassAccessors.getActiveClassFeatures(oldCharClass)
+                .filter((classFeature) => ClassFeatureAccessors.getClassId(classFeature) === subclass.id)
+                .map(ClassFeatureAccessors.getSpellListIds)
+                .reduce((acc, ids) => acc.concat(ids), []);
+            yield call(apiRemoveSpellsBySpellListIds, spellListIds);
+        }
+    }
+    yield call(apiClassFeatureChoiceSet, action);
+    const classes = yield select(rulesEngineSelectors.getClasses);
+    const charClass = classes.find((charClass) => !!oldCharClass && ClassAccessors.getId(charClass) === ClassAccessors.getId(oldCharClass));
+    if (charClass) {
+        const classFeature = ClassAccessors.getClassFeatures(charClass).find((classFeature) => ClassFeatureAccessors.getId(classFeature) === classFeatureId);
+        if (classFeature) {
+            const classFeatureChoice = ClassFeatureAccessors.getChoices(classFeature).find((choice) => ChoiceAccessors.getId(choice) === choiceId);
+            yield call(autoUpdateChoices, classFeatureChoice);
+        }
+        if (optionValue !== null && choiceType === BuilderChoiceTypeEnum.SUB_CLASS_OPTION) {
+            // Need to get the "new" activeId since the subclass ID has changed
+            yield call(autoUpdateClassAlwaysPreparedSpells, [ClassAccessors.getActiveId(charClass)]);
+            yield call(hack__simulateOwnedClassFeatureDefinitionData);
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+function* apiClassFeatureChoiceSet(action) {
+    const { classId, classFeatureId, choiceType, choiceId, optionValue, parentChoiceId } = action.payload;
+    const classMappingIdLookup = yield select(rulesEngineSelectors.getClassMappingIdLookupByActiveId);
+    const classMappingId = HelperUtils.lookupDataOrFallback(classMappingIdLookup, classId);
+    if (classMappingId !== null) {
+        const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterClassFeatureChoice, {
+            classId,
+            classMappingId,
+            classFeatureId,
+            type: choiceType,
+            choiceKey: choiceId,
+            choiceValue: optionValue,
+            parentChoiceId,
+        });
+        yield call(handleDataUpdates, data);
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleFeatChoiceSetRequest(action) {
+    const { featId, choiceId } = action.payload;
+    yield call(apiFeatChoiceSet, action);
+    const feats = yield select(rulesEngineSelectors.getFeats);
+    const feat = feats.find((feat) => FeatAccessors.getId(feat) === featId);
+    if (feat) {
+        const featChoice = FeatAccessors.getChoices(feat).find((choice) => ChoiceAccessors.getId(choice) === choiceId);
+        yield call(autoUpdateChoices, featChoice);
+    }
+}
+/**
+ *
+ * @param action
+ */
+function* apiFeatChoiceSet(action) {
+    const { featId, choiceType, choiceId, optionValue } = action.payload;
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterFeatChoice, {
+        id: featId,
+        type: choiceType,
+        choiceKey: choiceId,
+        choiceValue: optionValue,
+    });
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+function* apiClassLevelSet(action) {
+    const { classId, level, newCharacterXp } = action.payload;
+    const classMappingIdLookup = yield select(rulesEngineSelectors.getClassMappingIdLookupByActiveId);
+    const classMappingId = HelperUtils.lookupDataOrFallback(classMappingIdLookup, classId);
+    if (classMappingId !== null) {
+        const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterClassLevel, {
+            classId,
+            classMappingId,
+            level,
+        });
+        if (newCharacterXp !== null) {
+            yield put(characterActions.xpSet(newCharacterXp));
+        }
+        yield call(handleDataUpdates, data);
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleClassLevelSetRequest(action) {
+    const { classId, level } = action.payload;
+    let oldClasses = yield select(rulesEngineSelectors.getClasses);
+    let oldCharClass = oldClasses.find((charClass) => ClassAccessors.getActiveId(charClass) === classId);
+    if (oldCharClass) {
+        const oldLevel = ClassAccessors.getLevel(oldCharClass);
+        // if leveling down
+        if (level < oldLevel) {
+            const oldClassId = ClassAccessors.getId(oldCharClass);
+            const removedClassFeatures = ClassAccessors.getActiveClassFeatures(oldCharClass).filter((classFeature) => ClassFeatureAccessors.getRequiredLevel(classFeature) > level);
+            const isRemovingSubclass = removedClassFeatures.some((feature) => ClassFeatureAccessors.getChoices(feature).some((choice) => ChoiceAccessors.getType(choice) === BuilderChoiceTypeEnum.SUB_CLASS_OPTION));
+            const removedSpellListIds = ClassAccessors.getActiveClassFeatures(oldCharClass)
+                .filter((classFeature) => ClassFeatureAccessors.getRequiredLevel(classFeature) > level ||
+                (isRemovingSubclass && ClassFeatureAccessors.getClassId(classFeature) !== oldClassId))
+                .map(ClassFeatureAccessors.getSpellListIds)
+                .reduce((acc, spellListIds) => acc.concat(spellListIds), []);
+            yield call(apiRemoveSpellsBySpellListIds, removedSpellListIds);
+        }
+    }
+    yield call(apiClassLevelSet, action);
+    yield call(autoUpdateInfusions);
+    yield call(autoUpdateChoices);
+    yield call(autoUpdateClassAlwaysPreparedSpells, [action.payload.classId]);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleXpSetRequest(action) {
+    const { currentXp } = action.payload;
+    yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterProgression, { currentXp });
+    yield put(characterActions.xpSet(currentXp));
+}
+/**
+ *
+ * @param action
+ */
+export function* handleSpellCreate(action) {
+    const { characterClassId, spell } = action.payload;
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterSpell, {
+        characterClassId,
+        spellId: SpellAccessors.getId(spell),
+        id: SpellAccessors.getMappingId(spell),
+        entityTypeId: SpellAccessors.getMappingEntityTypeId(spell),
+    });
+    yield put(callCommitAction(characterActions.spellAdd, data, characterClassId));
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleSpellRemove(action) {
+    const { spell } = action.payload;
+    let mappingId = SpellAccessors.getMappingId(spell);
+    let mappingEntityTypeId = SpellAccessors.getMappingEntityTypeId(spell);
+    let [contextId, contextTypeId] = SpellDerivers.deriveExpandedContextIds(spell);
+    yield put(callCommitAction(characterActions.entityValuesRemove, mappingId, mappingEntityTypeId, contextId, contextTypeId));
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleSpellPrepareSet(action) {
+    // If this is preparing a spell, we need to find out if this is a known spellcaster who may not be
+    // mapped to the spell directly yet.  We can use the service data we got for class always known spells
+    // to simulate adding the mapping to the state without waiting for the server.
+    const spellClasses = yield select(rulesEngineSelectors.getSpellClasses);
+    let mappedSpell;
+    for (let i = 0; i < spellClasses.length; i++) {
+        const charClass = spellClasses[i];
+        const characterClassId = ClassAccessors.getMappingId(charClass);
+        if (action.payload.characterClassId !== characterClassId) {
+            continue;
+        }
+        const classSpellMappings = yield select(characterSelectors.getClassSpells);
+        const classSpellMapping = classSpellMappings.find((classSpellMapping) => classSpellMapping.characterClassId === characterClassId);
+        if (!classSpellMapping || !classSpellMapping.spells) {
+            continue;
+        }
+        mappedSpell = classSpellMapping.spells.find((spell) => {
+            return (SpellAccessors.getMappingId(spell) === action.payload.id &&
+                SpellAccessors.getMappingEntityTypeId(spell) === action.payload.entityTypeId &&
+                SpellAccessors.getId(spell) === action.payload.spellId);
+        });
+        if (!ClassAccessors.getKnowsAllSpells(charClass)) {
+            continue;
+        }
+        if (!mappedSpell) {
+            const classAlwaysKnownSpells = yield select(serviceDataSelectors.getClassAlwaysKnownSpells);
+            const alwaysKnownSpells = HelperUtils.lookupDataOrFallback(classAlwaysKnownSpells, ClassAccessors.getActiveId(charClass));
+            if (alwaysKnownSpells) {
+                const spellContract = alwaysKnownSpells.find((spell) => {
+                    return (SpellAccessors.getMappingId(spell) === action.payload.id &&
+                        SpellAccessors.getMappingEntityTypeId(spell) === action.payload.entityTypeId &&
+                        SpellAccessors.getId(spell) === action.payload.spellId);
+                });
+                if (spellContract) {
+                    yield put(callCommitAction(characterActions.spellAdd, spellContract, ClassAccessors.getMappingId(charClass)));
+                    yield put(callCommitAction(characterActions.spellPreparedSet, spellContract, characterClassId, action.payload.prepared));
+                }
+            }
+        }
+    }
+    if (mappedSpell) {
+        yield put(callCommitAction(characterActions.spellPreparedSet, mappedSpell, action.payload.characterClassId, action.payload.prepared));
+    }
+    yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterSpellPrepared, action.payload);
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleSpellCustomizationsDelete(action) {
+    const { mappingId, mappingEntityTypeId, contextId, contextTypeId } = action.payload;
+    yield put(characterActions.entityValuesRemove(ValueHacks.hack__toString(mappingId), ValueHacks.hack__toString(mappingEntityTypeId), ValueHacks.hack__toString(contextId), ValueHacks.hack__toString(contextTypeId)));
+}
+/**
+ * @param action
+ * @param data
+ */
+function* updateBackgroundResult(action, data) {
+    yield call(handleDataUpdates, data);
+    yield call(autoUpdateChoices);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleBackgroundSetRequest(action) {
+    const existingBackground = yield select(rulesEngineSelectors.getBackgroundInfo);
+    if (existingBackground !== null) {
+        yield call(apiRemoveSpellsBySpellListIds, BackgroundAccessors.getSpellListIds(existingBackground));
+    }
+    yield put(callCommitAction(characterActions.backgroundHasCustomSet, false));
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterBackground, action.payload);
+    yield call(updateBackgroundResult, action, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleBackgroundChoiceSetRequest(action) {
+    yield call(apiBackgroundChoiceSet, action);
+}
+/**
+ *
+ * @param action
+ */
+function* apiBackgroundChoiceSet(action) {
+    const { choiceType, choiceId, optionValue } = action.payload;
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterBackgroundChoice, {
+        type: choiceType,
+        choiceKey: choiceId,
+        choiceValue: optionValue,
+    });
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleBackgroundHasCustomSetRequest(action) {
+    // if you are switching to a custom background, attempt to remove any spells if the background has spellListIds
+    if (action.payload.hasCustomBackground) {
+        const existingBackground = yield select(rulesEngineSelectors.getBackgroundInfo);
+        if (existingBackground !== null) {
+            yield call(apiRemoveSpellsBySpellListIds, BackgroundAccessors.getSpellListIds(existingBackground));
+        }
+    }
+    yield put(callCommitAction(characterActions.backgroundHasCustomSet, action.payload.hasCustomBackground));
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterConfigurationHasCustomBackground, action.payload);
+    yield call(updateBackgroundResult, action, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleBackgroundCustomSetRequest(action) {
+    const { properties } = action.payload;
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterCustomBackground, {
+        name: properties.name,
+        description: properties.description,
+        backgroundFeatureId: properties.featureId,
+        backgroundCharacteristicsId: properties.characteristicsId,
+        backgroundType: properties.modifierType,
+    });
+    yield call(updateBackgroundResult, action, data);
+}
+/**
+ *
+ */
+export function* autoUpdateInfusions() {
+    const choices = yield select(rulesEngineSelectors.getInfusionChoices);
+    // handle choices that exist are could be invalid
+    for (let i = 0; i < choices.length; i++) {
+        const choice = choices[i];
+        let isAvailable = InfusionChoiceValidators.validateIsAvailable(choice);
+        if (!isAvailable) {
+            const knownInfusion = InfusionChoiceAccessors.getKnownInfusion(choice);
+            const choiceKey = InfusionChoiceAccessors.getKey(choice);
+            if (knownInfusion && choiceKey !== null) {
+                yield call(serviceDataSagaHandlers.handleKnownInfusionDestroy, serviceDataActions.knownInfusionMappingDestroy(choiceKey));
+            }
+        }
+    }
+    const infusionChoiceLookup = yield select(rulesEngineSelectors.getInfusionChoiceLookup);
+    const knownInfusions = yield select(rulesEngineSelectors.getKnownInfusions);
+    // handle known infusions that exist that no longer have a choice (ex: class remove)
+    if (knownInfusions.length) {
+        for (let i = 0; i < knownInfusions.length; i++) {
+            const knownInfusion = knownInfusions[i];
+            const choiceKey = KnownInfusionAccessors.getChoiceKey(knownInfusion);
+            if (choiceKey !== null && !HelperUtils.lookupDataOrFallback(infusionChoiceLookup, choiceKey)) {
+                yield call(serviceDataSagaHandlers.handleKnownInfusionDestroy, serviceDataActions.knownInfusionMappingDestroy(choiceKey));
+            }
+        }
+    }
+}
+/**
+ *
+ * @param lastChoice
+ */
+function* autoUpdateChoices(lastChoice = null) {
+    yield call(autoUpdateProficiencyChoices, lastChoice);
+    yield call(autoUpdateClassFeatureChoices);
+    yield call(autoUpdateRacialTraitChoices);
+    yield call(autoUpdateBackgroundChoices);
+    yield call(autoUpdateExpertiseChoices);
+}
+/**
+ *
+ * @param choice
+ * @param lastChoice
+ */
+function isOtherProficiencyChoice(choice, lastChoice) {
+    return (ChoiceAccessors.getType(choice) === BuilderChoiceTypeEnum.MODIFIER_SUB_CHOICE &&
+        (ChoiceAccessors.getSubType(choice) === BuilderChoiceSubtypeEnum.PROFICIENCY ||
+            ChoiceAccessors.getSubType(choice) === BuilderChoiceSubtypeEnum.EXPERTISE_NO_REQUIREMENT) &&
+        ChoiceAccessors.getOptionValue(choice) !== null &&
+        (!lastChoice || (!!lastChoice && ChoiceAccessors.getId(lastChoice) !== ChoiceAccessors.getId(choice))));
+}
+/**
+ *
+ * @param lastChoice
+ */
+function* autoUpdateProficiencyChoices(lastChoice) {
+    let builderChoiceInfo = yield select(rulesEngineSelectors.getChoiceInfo);
+    let background = yield select(rulesEngineSelectors.getBackgroundInfo);
+    if (background) {
+        let choices = BackgroundAccessors.getChoices(background);
+        for (let choice of choices) {
+            if (isOtherProficiencyChoice(choice, lastChoice)) {
+                let selectedChoiceOption = ChoiceAccessors.getOptions(choice).find((option) => option.id === ChoiceAccessors.getOptionValue(choice));
+                let existingProficiencyModifiers = [];
+                // TODO fix once https://intellij-support.jetbrains.com/hc/en-us/community/posts/360003813400-Typescript-expression-can-t-follow-value-has-been-checked-for-undefined-outside-of-it
+                existingProficiencyModifiers = builderChoiceInfo.proficiencyModifiers.filter((modifier) => selectedChoiceOption &&
+                    ModifierAccessors.getFriendlySubtypeName(modifier) === selectedChoiceOption.label);
+                if (existingProficiencyModifiers.length > 1) {
+                    let choiceId = ChoiceAccessors.getId(choice);
+                    if (choiceId !== null) {
+                        yield call(apiBackgroundChoiceSet, {
+                            type: 'SIMULATED_CHOICE',
+                            payload: {
+                                choiceType: ChoiceAccessors.getType(choice),
+                                choiceId: choiceId,
+                                optionValue: null,
+                            },
+                        });
+                        if (selectedChoiceOption) {
+                            NotificationUtils.dispatchMessage('Background Proficiency Removed', `The ${selectedChoiceOption.label} skill was removed from your background. Choose a new background skill in the Background section.`);
+                        }
+                    }
+                }
+                builderChoiceInfo = yield select(rulesEngineSelectors.getChoiceInfo);
+            }
+        }
+    }
+    let classes = yield select(rulesEngineSelectors.getClasses);
+    for (let charClass of classes) {
+        let classFeatures = ClassAccessors.getClassFeatures(charClass);
+        for (let classFeature of classFeatures) {
+            let choices = ClassFeatureAccessors.getChoices(classFeature);
+            for (let choice of choices) {
+                if (isOtherProficiencyChoice(choice, lastChoice)) {
+                    let selectedFeatureChoiceOption = ChoiceAccessors.getOptions(choice).find((option) => option.id === ChoiceAccessors.getOptionValue(choice));
+                    // TODO fix once https://intellij-support.jetbrains.com/hc/en-us/community/posts/360003813400-Typescript-expression-can-t-follow-value-has-been-checked-for-undefined-outside-of-it
+                    let existingProficiencyModifiers = builderChoiceInfo.proficiencyModifiers.filter((modifier) => selectedFeatureChoiceOption &&
+                        ModifierAccessors.getFriendlySubtypeName(modifier) === selectedFeatureChoiceOption.label);
+                    if (existingProficiencyModifiers.length > 1) {
+                        let classId = charClass.subclassDefinition === null
+                            ? ClassAccessors.getId(charClass)
+                            : charClass.subclassDefinition.id;
+                        yield call(apiClassFeatureChoiceSet, {
+                            type: 'SIMULATED_CHOICE',
+                            payload: {
+                                classId,
+                                classFeatureId: ClassFeatureAccessors.getId(classFeature),
+                                choiceType: ChoiceAccessors.getType(choice),
+                                choiceId: ChoiceAccessors.getId(choice),
+                                optionValue: null,
+                                parentChoiceId: ChoiceAccessors.getParentChoiceId(choice),
+                            },
+                        });
+                        if (selectedFeatureChoiceOption) {
+                            NotificationUtils.dispatchMessage('Class Feature Proficiency Removed', `The ${selectedFeatureChoiceOption.label} proficiency was removed from the "${ClassFeatureAccessors.getName(classFeature)}" class feature.
+                                 Choose a new proficiency skill in the Class section.`);
+                        }
+                    }
+                    builderChoiceInfo = yield select(rulesEngineSelectors.getChoiceInfo);
+                }
+            }
+        }
+    }
+    let race = yield select(rulesEngineSelectors.getRace);
+    if (race) {
+        let racialTraits = RaceAccessors.getRacialTraits(race);
+        for (let racialTrait of racialTraits) {
+            let choices = RacialTraitAccessors.getChoices(racialTrait);
+            for (let choice of choices) {
+                if (isOtherProficiencyChoice(choice, lastChoice)) {
+                    let selectedTraitChoiceOption = ChoiceAccessors.getOptions(choice).find((option) => option.id === ChoiceAccessors.getOptionValue(choice));
+                    // TODO fix once https://intellij-support.jetbrains.com/hc/en-us/community/posts/360003813400-Typescript-expression-can-t-follow-value-has-been-checked-for-undefined-outside-of-it
+                    let existingProficiencyModifiers = builderChoiceInfo.proficiencyModifiers.filter((modifier) => selectedTraitChoiceOption &&
+                        ModifierAccessors.getFriendlySubtypeName(modifier) === selectedTraitChoiceOption.label);
+                    if (existingProficiencyModifiers.length > 1) {
+                        yield call(apiRacialTraitChoiceSet, {
+                            type: 'SIMULATED_CHOICE',
+                            payload: {
+                                racialTraitId: RacialTraitAccessors.getId(racialTrait),
+                                choiceType: ChoiceAccessors.getType(choice),
+                                choiceId: ChoiceAccessors.getId(choice),
+                                optionValue: null,
+                            },
+                        });
+                        if (selectedTraitChoiceOption) {
+                            NotificationUtils.dispatchMessage('Racial Trait Proficiency Removed', `The ${selectedTraitChoiceOption.label} proficiency was removed from the "${RacialTraitAccessors.getName(racialTrait)}" racial trait.
+                                Choose a new proficiency skill in the Race section.`);
+                        }
+                    }
+                    builderChoiceInfo = yield select(rulesEngineSelectors.getChoiceInfo);
+                }
+            }
+        }
+    }
+}
+/**
+ *
+ */
+function* autoUpdateExpertiseChoices() {
+    let builderChoiceInfo = yield select(rulesEngineSelectors.getChoiceInfo);
+    let classes = yield select(rulesEngineSelectors.getClasses);
+    for (let charClass of classes) {
+        let classFeatures = ClassAccessors.getClassFeatures(charClass);
+        for (let classFeature of classFeatures) {
+            let choices = ClassFeatureAccessors.getChoices(classFeature);
+            for (let choice of choices) {
+                if (ChoiceAccessors.getType(choice) === BuilderChoiceTypeEnum.MODIFIER_SUB_CHOICE &&
+                    ChoiceAccessors.getSubType(choice) === BuilderChoiceSubtypeEnum.EXPERTISE &&
+                    ChoiceAccessors.getOptionValue(choice)) {
+                    let selectedFeatureChoiceOption = ChoiceAccessors.getOptions(choice).find((option) => option.id === ChoiceAccessors.getOptionValue(choice));
+                    // TODO fix once https://intellij-support.jetbrains.com/hc/en-us/community/posts/360003813400-Typescript-expression-can-t-follow-value-has-been-checked-for-undefined-outside-of-it
+                    let existingProficiencyModifier = builderChoiceInfo.proficiencyModifiers.find((modifier) => !!selectedFeatureChoiceOption &&
+                        ModifierAccessors.getFriendlySubtypeName(modifier) === selectedFeatureChoiceOption.label);
+                    if (!existingProficiencyModifier) {
+                        let classId = charClass.subclassDefinition === null
+                            ? ClassAccessors.getId(charClass)
+                            : charClass.subclassDefinition.id;
+                        yield call(apiClassFeatureChoiceSet, {
+                            type: 'SIMULATED_CHOICE',
+                            payload: {
+                                classId,
+                                classFeatureId: ClassFeatureAccessors.getId(classFeature),
+                                choiceType: ChoiceAccessors.getType(choice),
+                                choiceId: ChoiceAccessors.getId(choice),
+                                optionValue: null,
+                                parentChoiceId: ChoiceAccessors.getParentChoiceId(choice),
+                            },
+                        });
+                        if (selectedFeatureChoiceOption) {
+                            NotificationUtils.dispatchMessage('Class Feature Expertise Removed', `The ${selectedFeatureChoiceOption.label} expertise was removed from the "${ClassFeatureAccessors.getName(classFeature)}" class feature.
+                                Choose a new expertise skill in the Class section.`);
+                        }
+                    }
+                }
+            }
+        }
+    }
+    let race = yield select(rulesEngineSelectors.getRace);
+    if (race) {
+        let racialTraits = RaceAccessors.getRacialTraits(race);
+        for (let racialTrait of racialTraits) {
+            let choices = RacialTraitAccessors.getChoices(racialTrait);
+            for (let choice of choices) {
+                if (ChoiceAccessors.getType(choice) === BuilderChoiceTypeEnum.MODIFIER_SUB_CHOICE &&
+                    ChoiceAccessors.getSubType(choice) === BuilderChoiceSubtypeEnum.EXPERTISE &&
+                    ChoiceAccessors.getOptionValue(choice)) {
+                    let selectedTraitChoiceOption = ChoiceAccessors.getOptions(choice).find((option) => option.id === ChoiceAccessors.getOptionValue(choice));
+                    // TODO fix once https://intellij-support.jetbrains.com/hc/en-us/community/posts/360003813400-Typescript-expression-can-t-follow-value-has-been-checked-for-undefined-outside-of-it
+                    let existingProficiencyModifier = builderChoiceInfo.proficiencyModifiers.find((modifier) => !!selectedTraitChoiceOption &&
+                        ModifierAccessors.getFriendlySubtypeName(modifier) === selectedTraitChoiceOption.label);
+                    if (!existingProficiencyModifier) {
+                        yield call(apiRacialTraitChoiceSet, {
+                            type: 'SIMULATED_CHOICE',
+                            payload: {
+                                racialTraitId: RacialTraitAccessors.getId(racialTrait),
+                                choiceType: ChoiceAccessors.getType(choice),
+                                choiceId: ChoiceAccessors.getId(choice),
+                                optionValue: null,
+                            },
+                        });
+                        if (selectedTraitChoiceOption) {
+                            NotificationUtils.dispatchMessage('Racial Trait Expertise Removed', `The ${selectedTraitChoiceOption.label} expertise was removed from the "${RacialTraitAccessors.getName(racialTrait)}" racial trait.
+                                Choose a new expertise skill in the Race section.`);
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+/**
+ *
+ */
+function* autoUpdateBackgroundChoices() {
+    let background = yield select(rulesEngineSelectors.getBackgroundInfo);
+    let choicesChanged = 0;
+    if (background) {
+        let choices = BackgroundAccessors.getChoices(background);
+        for (let choice of choices) {
+            let choiceInfo = yield select(rulesEngineSelectors.getChoiceInfo);
+            let defaultSubtypes = ChoiceAccessors.getDefaultSubtypes(choice);
+            if (defaultSubtypes.length === 1 &&
+                !choiceInfo.proficiencyModifiers.find((modifier) => ModifierAccessors.getFriendlySubtypeName(modifier) === defaultSubtypes[0])) {
+                const selectOption = ChoiceAccessors.getOptions(choice).find((option) => option.label === defaultSubtypes[0]);
+                if (selectOption) {
+                    let choiceId = ChoiceAccessors.getId(choice);
+                    if (choiceId !== null) {
+                        yield call(apiBackgroundChoiceSet, {
+                            type: 'SIMULATED_CHOICE',
+                            payload: {
+                                choiceType: ChoiceAccessors.getType(choice),
+                                choiceId: choiceId,
+                                optionValue: selectOption.id,
+                            },
+                        });
+                        choicesChanged += 1;
+                    }
+                }
+            }
+        }
+    }
+    return choicesChanged;
+}
+/**
+ *
+ */
+function* autoUpdateClassFeatureChoices() {
+    let classes = yield select(rulesEngineSelectors.getClasses);
+    let choicesChanged = 0;
+    for (let charClass of classes) {
+        let subclass = ClassAccessors.getSubclass(charClass);
+        let classId = subclass === null ? ClassAccessors.getId(charClass) : subclass.id;
+        let classFeatures = ClassAccessors.getClassFeatures(charClass);
+        for (let classFeature of classFeatures) {
+            let choices = ClassFeatureAccessors.getChoices(classFeature);
+            for (let choice of choices) {
+                let choiceInfo = yield select(rulesEngineSelectors.getChoiceInfo);
+                let defaultSubtypes = ChoiceAccessors.getDefaultSubtypes(choice);
+                if (defaultSubtypes.length === 1 &&
+                    !choiceInfo.proficiencyModifiers.find((modifier) => ModifierAccessors.getFriendlySubtypeName(modifier) === defaultSubtypes[0])) {
+                    const selectOption = ChoiceAccessors.getOptions(choice).find((option) => option.label === defaultSubtypes[0]);
+                    if (selectOption) {
+                        yield call(apiClassFeatureChoiceSet, {
+                            type: 'SIMULATED_CHOICE',
+                            payload: {
+                                classId,
+                                classFeatureId: ClassFeatureAccessors.getId(classFeature),
+                                choiceType: ChoiceAccessors.getType(choice),
+                                choiceId: ChoiceAccessors.getId(choice),
+                                optionValue: selectOption.id,
+                                parentChoiceId: ChoiceAccessors.getParentChoiceId(choice),
+                            },
+                        });
+                        choicesChanged += 1;
+                    }
+                }
+            }
+        }
+    }
+    return choicesChanged;
+}
+/**
+ *
+ */
+function* autoUpdateRacialTraitChoices() {
+    let race = yield select(rulesEngineSelectors.getRace);
+    let choicesChanged = 0;
+    if (race) {
+        let racialTraits = RaceAccessors.getRacialTraits(race);
+        for (let racialTrait of racialTraits) {
+            let choices = RacialTraitAccessors.getChoices(racialTrait);
+            for (let choice of choices) {
+                let choiceInfo = yield select(rulesEngineSelectors.getChoiceInfo);
+                let defaultSubtypes = ChoiceAccessors.getDefaultSubtypes(choice);
+                if (defaultSubtypes.length === 1 &&
+                    !choiceInfo.proficiencyModifiers.find((modifier) => ModifierAccessors.getFriendlySubtypeName(modifier) === defaultSubtypes[0])) {
+                    const selectOption = ChoiceAccessors.getOptions(choice).find((option) => option.label === defaultSubtypes[0]);
+                    if (selectOption) {
+                        yield call(apiRacialTraitChoiceSet, {
+                            type: 'SIMULATED_CHOICE',
+                            payload: {
+                                racialTraitId: RacialTraitAccessors.getId(racialTrait),
+                                choiceType: ChoiceAccessors.getType(choice),
+                                choiceId: ChoiceAccessors.getId(choice),
+                                optionValue: selectOption.id,
+                            },
+                        });
+                        choicesChanged += 1;
+                    }
+                }
+            }
+        }
+    }
+    return choicesChanged;
+}
+/**
+ *
+ * @param action
+ */
+export function* handleCustomProficiencyCreate(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterCustomProficiency, action.payload);
+    yield put(callCommitAction(characterActions.customProficiencyAdd, data));
+}
+/**
+ *
+ * @param action
+ */
+export function* handleCustomActionCreate(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterCustomAction, action.payload);
+    yield put(callCommitAction(characterActions.customActionAdd, data));
+}
+/**
+ *
+ * @param action
+ */
+export function* handleActionCustomizationsDelete(action) {
+    const { mappingId, mappingEntityTypeId } = action.payload;
+    yield put(characterActions.entityValuesRemove(mappingId, mappingEntityTypeId));
+}
+/**
+ *
+ * @param apiPayload
+ */
+export function* apiCreatureCreate(apiPayload) {
+    const creatureResponseData = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterCreature, apiPayload);
+    for (let i = 0; i < creatureResponseData.length; i++) {
+        let creatureData = creatureResponseData[i];
+        yield put(callCommitAction(characterActions.creatureAdd, creatureData));
+    }
+    return creatureResponseData;
+}
+/**
+ *
+ * @param action
+ */
+export function* handleCreatureCreate(action) {
+    yield call(apiCreatureCreate, action.payload);
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleCreatureCustomizationsDelete(action) {
+    const { mappingId, mappingEntityTypeId } = action.payload;
+    const creatureLookup = yield select(rulesEngineSelectors.getCreatureLookup);
+    const creature = HelperUtils.lookupDataOrFallback(creatureLookup, mappingId);
+    if (creature !== null) {
+        const creatureProperties = {
+            description: null,
+            groupId: CreatureAccessors.getGroupId(creature),
+            name: null,
+        };
+        yield put(characterActions.creatureDataSet(mappingId, creatureProperties));
+    }
+    yield put(characterActions.entityValuesRemove(ValueHacks.hack__toString(mappingId), ValueHacks.hack__toString(mappingEntityTypeId)));
+}
+/**
+ *
+ * @param apiPayload
+ */
+export function* apiItemsCreate(apiPayload) {
+    const itemResponseData = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterInventoryItem, apiPayload);
+    const addedItems = itemResponseData.addItems === null ? [] : itemResponseData.addItems;
+    for (let i = 0; i < addedItems.length; i++) {
+        yield put(callCommitAction(characterActions.itemAdd, addedItems[i]));
+    }
+    yield call(handleDataUpdates, itemResponseData);
+    return addedItems;
+}
+/**
+ *
+ * @param action
+ */
+export function* handleShortRest(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterRestShort, action.payload);
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param action
+ */
+export function* handleLongRest(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.postCharacterRestLong, action.payload);
+    yield call(handleDataUpdates, data);
+}
+/**
+ *
+ * @param result
+ */
+function* handleDataUpdates(result) {
+    let resultKeys = Object.keys(result);
+    let componentUpdates = {};
+    for (let i = 0; i < resultKeys.length; i++) {
+        switch (resultKeys[i]) {
+            case 'actions':
+                componentUpdates.actions = result.actions;
+                break;
+            case 'activeSourceCategories':
+                yield put(callCommitAction(characterActions.activeSourceCategoriesSet, result.activeSourceCategories));
+                break;
+            case 'background':
+                yield put(callCommitAction(characterActions.backgroundSet, result.background));
+                break;
+            case 'bonusHitPoints':
+                yield put(callCommitAction(characterActions.bonusHitPointsSet, result.bonusHitPoints));
+                break;
+            case 'classes':
+                yield put(callCommitAction(characterActions.classesSet, result.classes));
+                break;
+            case 'choices':
+                componentUpdates.choices = result.choices;
+                break;
+            case 'feats':
+                yield put(callCommitAction(characterActions.featsSet, result.feats));
+                break;
+            case 'baseHitPoints':
+                yield put(callCommitAction(characterActions.baseHitPointsSet, result.baseHitPoints));
+                break;
+            case 'modifiers':
+                componentUpdates.modifiers = result.modifiers;
+                break;
+            case 'options':
+                componentUpdates.options = result.options;
+                break;
+            case 'overrideHitPoints':
+                yield put(callCommitAction(characterActions.overrideHitPointsSet, result.overrideHitPoints));
+                break;
+            case 'pactMagic':
+                yield put(callCommitAction(characterActions.pactMagicSet, result.pactMagic));
+                break;
+            case 'race':
+                yield put(callCommitAction(characterActions.raceSet, result.race));
+                break;
+            case 'spellSlots':
+                yield put(callCommitAction(characterActions.spellSlotsSet, result.spellSlots));
+                break;
+            case 'spells':
+                componentUpdates.spells = result.spells;
+                break;
+            case 'temporaryHitPoints':
+                //TODO get separate updates for these
+                if (result.hasOwnProperty('removedHitPoints')) {
+                    yield put(callCommitAction(characterActions.hitPointsSet, result.removedHitPoints, result.temporaryHitPoints));
+                }
+                break;
+            case 'removedHitPoints':
+                if (result.hasOwnProperty('temporaryHitPoints')) {
+                    yield put(callCommitAction(characterActions.hitPointsSet, result.removedHitPoints, result.temporaryHitPoints));
+                }
+                break;
+            case 'conditions':
+                yield put(callCommitAction(characterActions.conditionsSet, result.conditions));
+                break;
+            case 'deathSaves':
+                yield put(callCommitAction(characterActions.deathSavesSet, result.deathSaves.failCount, result.deathSaves.successCount));
+                break;
+        }
+    }
+    let classSpells = yield select(characterSelectors.getClassSpells);
+    let updateClassSpells = false;
+    if (result.hasOwnProperty('removeClassSpells')) {
+        classSpells = classSpells.filter((classSpell) => !result.removeClassSpells.includes(classSpell.characterClassId));
+        updateClassSpells = true;
+    }
+    if (result.hasOwnProperty('updateClassSpells')) {
+        result.updateClassSpells.forEach((updateClassSpell) => {
+            let idx = classSpells.findIndex((classSpell) => classSpell.characterClassId === updateClassSpell.characterClassId);
+            classSpells[idx] = updateClassSpell;
+        });
+        updateClassSpells = true;
+    }
+    if (result.hasOwnProperty('addClassSpells')) {
+        classSpells = [...classSpells, ...result.addClassSpells];
+        updateClassSpells = true;
+    }
+    if (result.hasOwnProperty('classSpells')) {
+        classSpells = result.classSpells;
+        updateClassSpells = true;
+    }
+    if (updateClassSpells) {
+        componentUpdates['classSpells'] = classSpells;
+    }
+    if (Object.keys(componentUpdates).length) {
+        yield put(callCommitAction(characterActions.characterComponentsSet, componentUpdates));
+    }
+}
+export function* handleShowHelpTextSetRequest(action) {
+    yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterHelpText, action.payload);
+    yield put(characterActions.showHelpTextSet(action.payload.showHelpText));
+}
+export function* handleStartingEquipmentTypeSet(action) {
+    yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterInventoryStartingType, action.payload);
+    yield put(characterActions.startingEquipmentTypeSetCommit(action.payload));
+}
+export function* handleSetAbilityScoreTypeRequest(action) {
+    const { abilityScoreType } = action.payload;
+    let requestParams = {
+        abilityScoreType,
+    };
+    yield call(SagaHelpers.sendApiRequest, ApiRequests.putCharacterAbilityScoreType, requestParams);
+    yield put(characterActions.abilityScoreTypeSetCommit(abilityScoreType));
+    let newScoreValue;
+    switch (action.payload.abilityScoreType) {
+        case AbilityScoreTypeEnum.STANDARD_ARRAY:
+        case AbilityScoreTypeEnum.MANUAL:
+            newScoreValue = null;
+            break;
+        case AbilityScoreTypeEnum.POINT_BUY:
+        default:
+            newScoreValue = 8;
+            break;
+    }
+    const ruleData = yield select(rulesEngineSelectors.getRuleData);
+    const stats = RuleDataAccessors.getStats(ruleData);
+    for (let i = 0; i < stats.length; i++) {
+        let statData = stats[i];
+        yield put(callCommitAction(characterActions.abilityScoreBaseSet, statData.id, newScoreValue));
+    }
+}
+export function* handlePremadeInfoGet(action) {
+    const premadeCharacterResponse = yield call(SagaHelpers.sendApiRequest, ApiRequests.getPremadeInfo, { characterId: action.payload.characterId });
+    let responseData = ApiAdapterUtils.getResponseData(premadeCharacterResponse);
+    if (responseData) {
+        yield put(characterActions.premadeInfoSetCommit(responseData));
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/sagas/character/index.js b/ddb_main/packages/rules-engine/es/sagas/character/index.js
new file mode 100644
index 0000000..d63ea45
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/sagas/character/index.js
@@ -0,0 +1,6 @@
+import * as hacks from './hacks';
+import * as handlers from './handlers';
+import saga from './saga';
+export const characterSagaHacks = hacks;
+export const characterSagaHandlers = handlers;
+export const characterSaga = saga;
diff --git a/ddb_main/packages/rules-engine/es/sagas/character/saga.js b/ddb_main/packages/rules-engine/es/sagas/character/saga.js
new file mode 100644
index 0000000..c446aa9
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/sagas/character/saga.js
@@ -0,0 +1,482 @@
+import { uniqueId } from 'lodash';
+import { call, put, select, takeEvery } from 'redux-saga/effects';
+import * as characterSelectors from "../../selectors/character";
+import * as types from '../../actions/character/actionTypes';
+import { syncTransactionActions } from '../../actions/syncTransaction';
+import * as apiShared from '../../api/requests';
+import { OverrideApiException } from '../../apiAdapter';
+import { SpellAccessors } from '../../engine/Spell';
+import { CharacterLoadingStatusEnum } from '../../reducers/constants';
+import * as characterEnvSelectors from '../../selectors/characterEnv';
+import * as syncTransactionSelectors from '../../selectors/syncTransaction';
+import * as sagaHandlers from './handlers';
+const SYNC_ACTION_LOOKUP = {
+    //ACTION
+    [types.CUSTOM_ACTION_CREATE]: true,
+    //BACKGROUND
+    [types.BACKGROUND_CHOOSE]: true,
+    [types.BACKGROUND_CHOICE_SET_REQUEST]: true,
+    [types.BACKGROUND_HAS_CUSTOM_SET_REQUEST]: true,
+    [types.BACKGROUND_CUSTOM_SET_REQUEST]: true,
+    //CHARACTER
+    [types.XP_SET_REQUEST]: true,
+    [types.RANDOM_NAME_REQUEST]: true,
+    [types.RESTORE_LIFE]: true,
+    [types.PORTRAIT_UPLOAD]: true,
+    [types.CUSTOM_PROFICIENCY_CREATE]: true,
+    [types.SHORT_REST]: true,
+    [types.LONG_REST]: true,
+    [types.STARTING_EQUIPMENT_ADD_REQUEST]: true,
+    [types.STARTING_GOLD_ADD_REQUEST]: true,
+    //CLASS
+    [types.CLASS_ADD_REQUEST]: true,
+    [types.CLASS_REMOVE_REQUEST]: true,
+    [types.CLASS_LEVEL_SET_REQUEST]: true,
+    //CLASS_FEATURE
+    [types.CLASS_FEATURE_CHOICE_SET_REQUEST]: true,
+    //CONDITION
+    [types.CONDITION_ADD]: true,
+    [types.CONDITION_SET]: true,
+    [types.CONDITION_REMOVE]: true,
+    //CONFIGURATION
+    [types.ABILITY_SCORE_TYPE_SET_REQUEST]: true,
+    //CORE
+    [types.ACTIVE_SOURCE_CATEGORIES_SET]: true,
+    [types.ACTIVE_SOURCES_SET]: true,
+    [types.PREFERENCE_CHOOSE]: true,
+    [types.SEND_SOCIAL_IMAGE_DATA]: true,
+    //CREATURE
+    [types.CREATURE_CREATE]: true,
+    //FEAT
+    [types.FEAT_CHOICE_SET_REQUEST]: true,
+    [types.ADHOC_FEAT_CREATE]: true,
+    [types.ADHOC_FEAT_REMOVE]: true,
+    [types.SET_ENTITY_FEAT]: true,
+    //ITEM
+    [types.ITEM_CREATE]: true,
+    [types.CUSTOM_ITEM_CREATE]: true,
+    [types.ITEM_DESTROY]: true,
+    [types.CUSTOM_ITEM_DESTROY]: true,
+    //CURRENCY
+    [types.CURRENCY_TRANSACTION_SET]: true,
+    //OPTIONAL_FEATURES
+    [types.OPTIONAL_CLASS_FEATURE_CREATE]: true,
+    [types.OPTIONAL_CLASS_FEATURE_SET_REQUEST]: true,
+    [types.OPTIONAL_CLASS_FEATURE_DESTROY]: true,
+    [types.OPTIONAL_ORIGIN_CREATE]: true,
+    [types.OPTIONAL_ORIGIN_SET_REQUEST]: true,
+    [types.OPTIONAL_ORIGIN_DESTROY]: true,
+    //RACE
+    [types.RACE_CHOOSE]: true,
+    //RACIAL_TRAIT
+    [types.RACIAL_TRAIT_CHOICE_SET_REQUEST]: true,
+    //SPELL
+    [types.SPELL_CREATE]: true,
+    [types.SPELL_REMOVE]: true,
+};
+/**
+ *
+ * @param action
+ */
+function isSyncAction(action) {
+    return !!SYNC_ACTION_LOOKUP[action.type];
+}
+/**
+ *
+ * @param meta
+ * //TODO find a better solution for checking props on meta
+ */
+function isCommonCommitAction(meta) {
+    return meta.commit !== undefined;
+}
+/**
+ *
+ * @param meta
+ * //TODO find a better solution for checking props on meta
+ */
+function isPostAction(meta) {
+    return meta.postAction !== undefined;
+}
+/**
+ *
+ */
+export default function* saga() {
+    yield takeEvery(Object.keys(types).map((key) => types[key]), filter);
+}
+/**
+ *
+ * @param action
+ */
+function* filter(action) {
+    var _a;
+    const characterLoadingStatus = yield select(characterEnvSelectors.getLoadingStatus);
+    //TODO: CanEdit
+    // const isReadonly: ReturnType<typeof characterEnvSelectors.getIsReadonly> = yield select(
+    //     characterEnvSelectors.getIsReadonly,
+    // );
+    const canEdit = yield select(characterSelectors.getCanEdit);
+    if (!canEdit && characterLoadingStatus === CharacterLoadingStatusEnum.LOADED) {
+        return;
+    }
+    let transactionInitiatorId = null;
+    if (action.meta) {
+        transactionInitiatorId = yield call(executeSyncTransactionActivate, action);
+        try {
+            yield call(executeApi, action);
+            yield call(executeHandler, action);
+            yield call(executePostAction, action);
+            yield call(executeSyncTransactionDeactivate, action, transactionInitiatorId);
+        }
+        catch (error) {
+            if (error instanceof OverrideApiException) {
+                yield call(executeSyncTransactionDeactivate, action, transactionInitiatorId);
+                if ((_a = action.meta) === null || _a === void 0 ? void 0 : _a.reject) {
+                    action.meta.reject();
+                }
+            }
+            else {
+                throw error;
+            }
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+function* executePostAction(action) {
+    if (isPostAction(action.meta)) {
+        for (let i = 0; i < action.meta.postAction.type.length; i++) {
+            yield put({
+                type: action.meta.postAction.type[i],
+                payload: action.payload,
+            });
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+function* executeSyncTransactionActivate(action) {
+    const isSyncTransactionActive = yield select(syncTransactionSelectors.getActive);
+    let transactionInitiatorId = null;
+    if (isSyncAction(action) && !isSyncTransactionActive) {
+        transactionInitiatorId = uniqueId();
+        yield put(syncTransactionActions.activate(transactionInitiatorId));
+    }
+    return transactionInitiatorId;
+}
+/**
+ *
+ * @param action
+ * @param transactionInitiatorId
+ */
+function* executeSyncTransactionDeactivate(action, transactionInitiatorId) {
+    if (isSyncAction(action)) {
+        let syncTransactionInitiator = yield select(syncTransactionSelectors.getInitiator);
+        if (syncTransactionInitiator === transactionInitiatorId) {
+            yield put(syncTransactionActions.deactivate());
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+function* executeApi(action) {
+    let apiLookup = {
+        // ACTION
+        [types.ACTION_USE_SET]: apiShared.putCharacterActionLimitedUse,
+        [types.CUSTOM_ACTION_REMOVE]: apiShared.deleteCharacterCustomAction,
+        [types.CUSTOM_ACTION_SET]: apiShared.putCharacterCustomAction,
+        //CHARACTER
+        [types.XP_SET]: apiShared.putCharacterProgression,
+        [types.NAME_SET]: apiShared.putCharacterDescriptionName,
+        [types.NOTE_SET]: apiShared.putCharacterDescriptionNotes,
+        [types.TRAIT_SET]: apiShared.putCharacterDescriptionTraits,
+        [types.BASE_HIT_POINTS_SET]: apiShared.putCharacterLifeHpBase,
+        [types.BONUS_HIT_POINTS_SET]: apiShared.putCharacterLifeHpBonus,
+        [types.OVERRIDE_HIT_POINTS_SET]: apiShared.putCharacterLifeHpOverride,
+        [types.HAIR_SET]: apiShared.putCharacterDescriptionHair,
+        [types.SKIN_SET]: apiShared.putCharacterDescriptionSkin,
+        [types.EYES_SET]: apiShared.putCharacterDescriptionEyes,
+        [types.HEIGHT_SET]: apiShared.putCharacterDescriptionHeight,
+        [types.WEIGHT_SET]: apiShared.putCharacterDescriptionWeight,
+        [types.AGE_SET]: apiShared.putCharacterDescriptionAge,
+        [types.GENDER_SET]: apiShared.putCharacterDescriptionGender,
+        [types.ALIGNMENT_SET]: apiShared.putCharacterDescriptionAlignment,
+        [types.LIFESTYLE_SET]: apiShared.putCharacterDescriptionLifestyle,
+        [types.FAITH_SET]: apiShared.putCharacterDescriptionFaith,
+        [types.PORTRAIT_SET]: apiShared.putCharacterDecorationPortrait,
+        [types.HIT_POINTS_SET]: apiShared.putCharacterLifeHpDamageTaken,
+        [types.INSPIRATION_SET]: apiShared.putCharacterInspiration,
+        [types.CURRENCIES_SET]: apiShared.putCharacterInventoryCurrency,
+        [types.CURRENCY_COPPER_SET]: apiShared.putCharacterInventoryCurrencyCopper,
+        [types.ITEM_CURRENCY_COPPER_SET]: apiShared.putCharacterInventoryCurrencyCopper,
+        [types.CURRENCY_ELECTRUM_SET]: apiShared.putCharacterInventoryCurrencyElectrum,
+        [types.ITEM_CURRENCY_ELECTRUM_SET]: apiShared.putCharacterInventoryCurrencyElectrum,
+        [types.CURRENCY_GOLD_SET]: apiShared.putCharacterInventoryCurrencyGold,
+        [types.ITEM_CURRENCY_GOLD_SET]: apiShared.putCharacterInventoryCurrencyGold,
+        [types.CURRENCY_PLATINUM_SET]: apiShared.putCharacterInventoryCurrencyPlatinum,
+        [types.ITEM_CURRENCY_PLATINUM_SET]: apiShared.putCharacterInventoryCurrencyPlatinum,
+        [types.CURRENCY_SILVER_SET]: apiShared.putCharacterInventoryCurrencySilver,
+        [types.ITEM_CURRENCY_SILVER_SET]: apiShared.putCharacterInventoryCurrencySilver,
+        [types.DEATHSAVES_SET]: apiShared.putCharacterLifeDeathSaves,
+        [types.MOVEMENT_ADD]: apiShared.postCharacterCustomMovement,
+        [types.MOVEMENT_SET]: apiShared.putCharacterCustomMovement,
+        [types.MOVEMENT_REMOVE]: apiShared.deleteCharacterCustomMovement,
+        [types.SENSE_ADD]: apiShared.postCharacterCustomSense,
+        [types.SENSE_SET]: apiShared.putCharacterCustomSense,
+        [types.SENSE_REMOVE]: apiShared.deleteCharacterCustomSense,
+        [types.CUSTOM_PROFICIENCY_REMOVE]: apiShared.deleteCharacterCustomProficiency,
+        [types.CUSTOM_PROFICIENCY_SET]: apiShared.putCharacterCustomProficiency,
+        [types.CUSTOM_DEFENSE_ADJUSTMENT_ADD]: apiShared.postCharacterCustomDefenseAdjustment,
+        [types.CUSTOM_DEFENSE_ADJUSTMENT_SET]: apiShared.putCharacterCustomDefenseAdjustment,
+        [types.CUSTOM_DEFENSE_ADJUSTMENT_REMOVE]: apiShared.deleteCharacterCustomDefenseAdjustment,
+        //CORE
+        [types.ACTIVE_SOURCE_CATEGORIES_SET]: apiShared.putCharacterSourceCategories,
+        [types.ACTIVE_SOURCES_SET]: apiShared.putCharacterSources,
+        [types.BACKDROP_SET]: apiShared.putCharacterDecorationBackdrop,
+        [types.FRAME_SET]: apiShared.putCharacterDecorationFrame,
+        [types.THEME_SET]: apiShared.putCharacterDecorationThemeColor,
+        //CREATURE
+        [types.CREATURE_REMOVE]: apiShared.deleteCharacterCreature,
+        [types.CREATURE_DATA_SET]: apiShared.putCharacterCreature,
+        [types.CREATURE_HIT_POINTS_SET]: apiShared.putCharacterCreatureHp,
+        [types.CREATURE_ACTIVE_SET]: apiShared.putCharacterCreatureStatus,
+        //ITEM
+        //TODO v5.1: remove this v5 guy when mobile moves up to Custom Items
+        [types.CUSTOM_ITEM_REMOVE]: apiShared.deleteCharacterCustomItemV5,
+        [types.ITEM_REMOVE]: apiShared.deleteCharacterInventoryItem,
+        //SPELL
+        [types.SPELL_REMOVE]: apiShared.deleteCharacterSpell,
+        [types.SPELL_USE_SET]: apiShared.putCharacterActionLimitedUse,
+        [types.SPELL_LEVEL_SPELL_SLOTS_SET]: apiShared.putCharacterSpellSlots,
+        [types.SPELL_LEVEL_PACT_MAGIC_SLOTS_SET]: apiShared.putCharacterSpellPactMagic,
+        //VALUE
+        [types.VALUE_SET]: apiShared.putCharacterCustomValue,
+        [types.VALUE_REMOVE]: apiShared.deleteCharacterCustomValue,
+        [types.ENTITY_VALUES_REMOVE]: apiShared.deleteCharacterCustomEntityValues,
+        //PREMADE INFO
+        [types.PREMADE_INFO_ADD]: apiShared.addPremadeInfo,
+        [types.PREMADE_INFO_UPDATE]: apiShared.setPremadeInfo,
+        [types.PREMADE_INFO_DELETE]: apiShared.deletePremadeInfo,
+    };
+    let apiPayload = action.payload;
+    //transforming payloads where api payload is different from action payload
+    switch (action.type) {
+        //ACTION
+        case types.ACTION_USE_SET: {
+            const payload = {
+                id: action.payload.id,
+                entityTypeId: action.payload.entityTypeId,
+                uses: action.payload.uses,
+            };
+            apiPayload = payload;
+            break;
+        }
+        case types.CUSTOM_ACTION_SET: {
+            const payload = Object.assign({ id: action.payload.id }, action.payload.properties);
+            apiPayload = payload;
+            break;
+        }
+        //CHARACTER
+        case types.NOTE_SET: {
+            const payload = {
+                [action.payload.noteType]: action.payload.content,
+            };
+            apiPayload = payload;
+            break;
+        }
+        case types.TRAIT_SET: {
+            const payload = {
+                [action.payload.traitType]: action.payload.content,
+            };
+            apiPayload = payload;
+            break;
+        }
+        case types.DEATHSAVES_SET: {
+            const payload = {
+                failCount: action.payload.fails,
+                successCount: action.payload.successes,
+            };
+            apiPayload = payload;
+            break;
+        }
+        case types.CUSTOM_PROFICIENCY_SET: {
+            const payload = Object.assign({ id: action.payload.id }, action.payload.properties);
+            apiPayload = payload;
+            break;
+        }
+        //CORE
+        case types.BACKDROP_SET: {
+            const { backdropAvatarId, largeBackdropAvatarId, smallBackdropAvatarId, thumbnailBackdropAvatarId } = action.payload.backdrop;
+            const payload = {
+                backdropAvatarId,
+                largeBackdropAvatarId,
+                smallBackdropAvatarId,
+                thumbnailBackdropAvatarId,
+            };
+            apiPayload = payload;
+            break;
+        }
+        case types.FRAME_SET: {
+            const { frameAvatarId } = action.payload.frame;
+            const payload = {
+                frameAvatarId,
+            };
+            apiPayload = payload;
+            break;
+        }
+        case types.THEME_SET: {
+            const { themeColor } = action.payload;
+            const payload = {
+                themeColorId: themeColor ? themeColor.themeColorId : themeColor,
+            };
+            apiPayload = payload;
+            break;
+        }
+        //CREATURE
+        case types.CREATURE_DATA_SET: {
+            const payload = Object.assign({ id: action.payload.id }, action.payload.properties);
+            apiPayload = payload;
+            break;
+        }
+        //ITEM
+        case types.ITEM_CHARGES_SET: {
+            const payload = {
+                id: action.payload.id,
+                charges: action.payload.uses,
+            };
+            apiPayload = payload;
+            break;
+        }
+        //SPELL
+        case types.SPELL_REMOVE: {
+            const { spell, characterClassId } = action.payload;
+            const payload = {
+                spellId: SpellAccessors.getId(spell),
+                characterClassId,
+                entityTypeId: SpellAccessors.getMappingEntityTypeId(spell),
+                id: SpellAccessors.getMappingId(spell),
+            };
+            apiPayload = payload;
+            break;
+        }
+        case types.SPELL_USE_SET: {
+            const { id, entityTypeId, uses } = action.payload;
+            const payload = {
+                id,
+                entityTypeId,
+                uses,
+            };
+            apiPayload = payload;
+            break;
+        }
+        default:
+        // not implemented
+    }
+    let apiRequest = apiLookup[action.type] ? apiLookup[action.type] : null;
+    if (isCommonCommitAction(action.meta) && apiRequest !== null) {
+        yield put({
+            type: action.meta.commit.type,
+            payload: action.payload,
+            meta: {},
+        });
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+    }
+    if (apiRequest !== null) {
+        yield call(apiRequest, apiPayload);
+    }
+}
+function* executeHandler(action) {
+    let handlerLookup = {
+        //ACTION
+        [types.ACTION_CUSTOMIZATIONS_DELETE]: sagaHandlers.handleActionCustomizationsDelete,
+        [types.CUSTOM_ACTION_CREATE]: sagaHandlers.handleCustomActionCreate,
+        //BACKGROUND
+        [types.BACKGROUND_CHOOSE]: sagaHandlers.handleBackgroundSetRequest,
+        [types.BACKGROUND_CHOICE_SET_REQUEST]: sagaHandlers.handleBackgroundChoiceSetRequest,
+        [types.BACKGROUND_HAS_CUSTOM_SET_REQUEST]: sagaHandlers.handleBackgroundHasCustomSetRequest,
+        [types.BACKGROUND_CUSTOM_SET_REQUEST]: sagaHandlers.handleBackgroundCustomSetRequest,
+        //CAMPAIGN_SETTING
+        [types.CAMPAIGN_SETTING_SET_REQUEST]: sagaHandlers.handleCampaignSettingSetRequest,
+        //CHARACTER
+        [types.CHARACTER_LOAD]: sagaHandlers.handleCharacterLoad,
+        [types.XP_SET_REQUEST]: sagaHandlers.handleXpSetRequest,
+        [types.RANDOM_NAME_REQUEST]: sagaHandlers.handleRandomNameRequest,
+        [types.RESTORE_LIFE]: sagaHandlers.handleRestoreLife,
+        [types.PORTRAIT_UPLOAD]: sagaHandlers.handlePortraitUpload,
+        [types.CUSTOM_PROFICIENCY_CREATE]: sagaHandlers.handleCustomProficiencyCreate,
+        [types.SHORT_REST]: sagaHandlers.handleShortRest,
+        [types.LONG_REST]: sagaHandlers.handleLongRest,
+        [types.ABILITY_SCORE_SET]: sagaHandlers.handleAbilityScoreSet,
+        [types.STARTING_EQUIPMENT_ADD_REQUEST]: sagaHandlers.handleStartingEquipmentAdd,
+        [types.STARTING_GOLD_ADD_REQUEST]: sagaHandlers.handleStartingGoldAdd,
+        [types.LOAD_LAZY_CHARACTER_DATA]: sagaHandlers.handleLoadCharacterLazyData,
+        //CLASS
+        [types.CLASS_ADD_REQUEST]: sagaHandlers.handleClassAddRequest,
+        [types.CLASS_REMOVE_REQUEST]: sagaHandlers.handleClassRemoveRequest,
+        [types.CLASS_LEVEL_SET_REQUEST]: sagaHandlers.handleClassLevelSetRequest,
+        //CLASS_FEATURE
+        [types.CLASS_FEATURE_CHOICE_SET_REQUEST]: sagaHandlers.handleClassFeatureChoiceSetRequest,
+        //CONDITION
+        [types.CONDITION_SET]: sagaHandlers.handleConditionSet,
+        [types.CONDITION_ADD]: sagaHandlers.handleConditionAdd,
+        [types.CONDITION_REMOVE]: sagaHandlers.handleConditionRemove,
+        //CONFIGURATION
+        [types.ABILITY_SCORE_TYPE_SET_REQUEST]: sagaHandlers.handleSetAbilityScoreTypeRequest,
+        [types.SHOW_HELP_TEXT_SET_REQUEST]: sagaHandlers.handleShowHelpTextSetRequest,
+        [types.STARTING_EQUIPMENT_TYPE_SET]: sagaHandlers.handleStartingEquipmentTypeSet,
+        //CORE
+        [types.PREFERENCE_CHOOSE]: sagaHandlers.handlePreferenceChoose,
+        [types.SEND_SOCIAL_IMAGE_DATA]: sagaHandlers.handleSendSocialImageData,
+        //CREATURE
+        [types.CREATURE_CREATE]: sagaHandlers.handleCreatureCreate,
+        [types.CREATURE_CUSTOMIZATIONS_DELETE]: sagaHandlers.handleCreatureCustomizationsDelete,
+        //FEAT
+        [types.FEAT_CHOICE_SET_REQUEST]: sagaHandlers.handleFeatChoiceSetRequest,
+        [types.ADHOC_FEAT_CREATE]: sagaHandlers.handleAdhocFeatCreate,
+        [types.ADHOC_FEAT_REMOVE]: sagaHandlers.handleAdhocFeatRemove,
+        [types.SET_ENTITY_FEAT]: sagaHandlers.handleSetEntityFeat,
+        //ITEM
+        [types.ITEM_CREATE]: sagaHandlers.handleItemCreate,
+        [types.CUSTOM_ITEM_CREATE]: sagaHandlers.handleCustomItemCreate,
+        [types.CUSTOM_ITEM_SET]: sagaHandlers.handleCustomItemSet,
+        [types.ITEM_CUSTOMIZATIONS_DELETE]: sagaHandlers.handleItemCustomizationsDelete,
+        [types.ITEM_EQUIPPED_SET]: sagaHandlers.handleItemEquippedSet,
+        [types.ITEM_ATTUNE_SET]: sagaHandlers.handleItemAttuneSet,
+        [types.ITEM_QUANTITY_SET]: sagaHandlers.handleItemQuantitySet,
+        [types.ITEM_DESTROY]: sagaHandlers.handleItemDestroy,
+        [types.CUSTOM_ITEM_DESTROY]: sagaHandlers.handleCustomItemDestroy,
+        [types.ITEM_CHARGES_SET]: sagaHandlers.handleItemChargesSet,
+        [types.ITEM_MOVE_SET]: sagaHandlers.handleItemMove,
+        //CURRENCY
+        [types.CURRENCY_TRANSACTION_SET]: sagaHandlers.handleCurrencyTransactionSet,
+        //OPTIONAL_FEATURES
+        [types.OPTIONAL_CLASS_FEATURE_CREATE]: sagaHandlers.handleOptionalClassFeatureCreate,
+        [types.OPTIONAL_CLASS_FEATURE_SET_REQUEST]: sagaHandlers.handleOptionalClassFeatureSetRequest,
+        [types.OPTIONAL_CLASS_FEATURE_DESTROY]: sagaHandlers.handleOptionalClassFeatureDestroy,
+        [types.OPTIONAL_ORIGIN_CREATE]: sagaHandlers.handleOptionalOriginCreate,
+        [types.OPTIONAL_ORIGIN_SET_REQUEST]: sagaHandlers.handleOptionalOriginSetRequest,
+        [types.OPTIONAL_ORIGIN_DESTROY]: sagaHandlers.handleOptionalOriginDestroy,
+        //RACE
+        [types.RACE_CHOOSE]: sagaHandlers.handleRaceChoose,
+        //RACIAL_TRAIT
+        [types.RACIAL_TRAIT_CHOICE_SET_REQUEST]: sagaHandlers.handleRacialTraitChoiceSetRequest,
+        //SPELL
+        [types.SPELL_CREATE]: sagaHandlers.handleSpellCreate,
+        [types.SPELL_REMOVE]: sagaHandlers.handleSpellRemove,
+        [types.SPELL_CUSTOMIZATIONS_DELETE]: sagaHandlers.handleSpellCustomizationsDelete,
+        [types.SPELL_PREPARED_SET]: sagaHandlers.handleSpellPrepareSet,
+        //PREMADE INFO
+        [types.PREMADE_INFO_GET]: sagaHandlers.handlePremadeInfoGet,
+    };
+    let handler = handlerLookup[action.type] ? handlerLookup[action.type] : null;
+    if (handler !== null) {
+        yield call(handler, action);
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/sagas/serviceData/handlers.js b/ddb_main/packages/rules-engine/es/sagas/serviceData/handlers.js
new file mode 100644
index 0000000..69819b2
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/sagas/serviceData/handlers.js
@@ -0,0 +1,347 @@
+import { call, put, select } from 'redux-saga/effects';
+import { characterActions, serviceDataActions } from '../../actions';
+import { ApiRequests } from '../../api';
+import * as apiShared from '../../api/requests';
+import { CampaignAccessors, PartyInventorySharingStateEnum } from '../../engine/Campaign';
+import { CreatureAccessors } from '../../engine/Creature';
+import { DefinitionAccessors, DefinitionTypeEnum, DefinitionUtils } from '../../engine/Definition';
+import { DefinitionPoolUtils } from '../../engine/DefinitionPool';
+import { FeatureFlagEnum, FeatureFlagInfoUtils } from '../../engine/FeatureFlagInfo';
+import { HelperUtils } from '../../engine/Helper';
+import { InfusionAccessors, InfusionTypeEnum } from '../../engine/Infusion';
+import { InfusionChoiceAccessors } from '../../engine/InfusionChoice';
+import { ItemAccessors, ItemUtils } from '../../engine/Item';
+import { KnownInfusionAccessors } from '../../engine/KnownInfusion';
+import { ValueAccessors } from '../../engine/Value';
+import { VehicleAccessors, VehicleSimulators } from '../../engine/Vehicle';
+import { VehicleComponentAccessors } from '../../engine/VehicleComponent';
+import { initialCoinState } from '../../reducers/character';
+import * as SagaHelpers from '../../sagas/SagaHelpers';
+import { characterSelectors, featureFlagInfoSelectors, rulesEngineSelectors, serviceDataSelectors, } from '../../selectors';
+import { TypeScriptUtils } from '../../utils';
+import { callCommitAction } from '../../utils/ReduxActionUtils';
+import { apiCreatureCreate, apiItemsCreate, handleLoadDefinitions } from '../character/handlers';
+/**
+ *
+ * @param action
+ */
+export function* handleKnownInfusionCreate(action) {
+    const newKnownInfusionMapping = yield call(SagaHelpers.getApiRequestData, apiShared.postCharacterKnownInfusion, action.payload);
+    yield put(callCommitAction(serviceDataActions.knownInfusionMappingAdd, newKnownInfusionMapping));
+}
+/**
+ *
+ * @param action
+ */
+export function* handleKnownInfusionDestroy(action) {
+    const choiceKey = action.payload.choiceKey;
+    const knownInfusionLookup = yield select(rulesEngineSelectors.getKnownInfusionLookupByChoiceKey);
+    const knownInfusion = HelperUtils.lookupDataOrFallback(knownInfusionLookup, choiceKey);
+    if (knownInfusion) {
+        const infusionChoiceInfusionLookup = yield select(rulesEngineSelectors.getInfusionChoiceInfusionLookup);
+        const infusion = HelperUtils.lookupDataOrFallback(infusionChoiceInfusionLookup, choiceKey);
+        if (infusion) {
+            const infusionId = InfusionAccessors.getId(infusion);
+            if (infusionId !== null) {
+                yield call(handleInfusionDestroy, serviceDataActions.infusionMappingDestroy(infusionId, InfusionAccessors.getInventoryMappingId(infusion)));
+            }
+        }
+    }
+    const responseData = yield call(SagaHelpers.getApiRequestData, apiShared.deleteCharacterKnownInfusion, action.payload);
+    yield put(callCommitAction(serviceDataActions.knownInfusionMappingRemove, action.payload.choiceKey));
+}
+/**
+ *
+ * @param action
+ */
+export function* handleInfusionCreate(action) {
+    const infusionId = action.payload.infusionId;
+    const choiceKey = action.payload.choiceKey;
+    const choiceLookup = yield select(rulesEngineSelectors.getInfusionChoiceLookup);
+    if (choiceKey === null) {
+        return;
+    }
+    const infusionChoice = HelperUtils.lookupDataOrFallback(choiceLookup, choiceKey);
+    if (infusionChoice === null) {
+        return;
+    }
+    const knownInfusion = InfusionChoiceAccessors.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+        return;
+    }
+    const simulatedInfusion = KnownInfusionAccessors.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+        return;
+    }
+    let infusionInventoryMappingId = action.payload.inventoryMappingId;
+    let itemId = null;
+    let itemEntityTypeId = null;
+    let containerEntityId = null;
+    let containerEntityTypeId = null;
+    if (action.payload.itemId && action.payload.itemTypeId) {
+        itemId = action.payload.itemId;
+        itemEntityTypeId = action.payload.itemTypeId;
+    }
+    if (action.payload.containerEntityId && action.payload.containerEntityTypeId) {
+        containerEntityId = action.payload.containerEntityId;
+        containerEntityTypeId = action.payload.containerEntityTypeId;
+    }
+    if (itemId !== null && itemEntityTypeId !== null) {
+        const addedItems = yield call(apiItemsCreate, {
+            equipment: [
+                {
+                    containerEntityId,
+                    containerEntityTypeId,
+                    entityId: itemId,
+                    entityTypeId: itemEntityTypeId,
+                    quantity: 1,
+                },
+            ],
+        });
+        infusionInventoryMappingId = addedItems[0].id;
+    }
+    let creatureMappingId = null;
+    if (InfusionAccessors.getType(simulatedInfusion) === InfusionTypeEnum.CREATURE) {
+        const creatureData = InfusionAccessors.getCreatureData(simulatedInfusion);
+        if (creatureData && creatureData.length) {
+            // Hardcoded to first entry until we adjust data to allow for more than 1 monster
+            const apiPayload = {
+                groupId: creatureData[0].creatureGroupId,
+                monsterId: creatureData[0].monsterId,
+                names: [null],
+            };
+            const addedCreatures = yield call(apiCreatureCreate, apiPayload);
+            creatureMappingId = CreatureAccessors.getMappingId(addedCreatures[0]);
+        }
+    }
+    if (infusionInventoryMappingId === null) {
+        return;
+    }
+    const payload = {
+        infusionId,
+        inventoryMappingId: infusionInventoryMappingId,
+        creatureMappingId,
+        modifierGroupId: action.payload.modifierGroupId,
+        choiceKey,
+    };
+    const infusionResponseData = yield call(SagaHelpers.getApiRequestData, apiShared.postCharacterInfusion, payload);
+    yield put(callCommitAction(serviceDataActions.infusionMappingAdd, infusionResponseData));
+}
+/**
+ *
+ * @param action
+ */
+export function* handleInfusionsDestroy(action) {
+    const { ids } = action.payload;
+    const inventoryLookup = yield select(rulesEngineSelectors.getInventoryLookup);
+    for (let i = 0; i < ids.length; i++) {
+        const foundItem = HelperUtils.lookupDataOrFallback(inventoryLookup, ids[i]);
+        if (foundItem) {
+            const infusion = ItemAccessors.getInfusion(foundItem);
+            if (infusion) {
+                const infusionId = InfusionAccessors.getId(infusion);
+                if (infusionId !== null) {
+                    yield put(serviceDataActions.infusionMappingDestroy(infusionId, ids[i]));
+                }
+            }
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleInfusionDestroy(action) {
+    const inventoryInfusionLookup = yield select(rulesEngineSelectors.getInventoryInfusionLookup);
+    // If this handler gets anymore complicated, come back and rethink these saga flows
+    const foundInfusion = HelperUtils.lookupDataOrFallback(inventoryInfusionLookup, action.payload.inventoryMappingId);
+    if (foundInfusion) {
+        const infusionType = InfusionAccessors.getType(foundInfusion);
+        const creatureMappingId = InfusionAccessors.getCreatureMappingId(foundInfusion);
+        if (infusionType === InfusionTypeEnum.CREATURE && creatureMappingId !== null) {
+            yield put(characterActions.creatureRemove(creatureMappingId));
+        }
+        const inventoryMappingId = InfusionAccessors.getInventoryMappingId(foundInfusion);
+        //if infused item is a REPLICATE type remove the item from inventory
+        //otherwise leave the item but un-attune and reset charges
+        if (infusionType === InfusionTypeEnum.REPLICATE && inventoryMappingId !== null) {
+            yield put(characterActions.itemRemove(inventoryMappingId, true));
+            // Mapping was removed on the backend due to being an item
+            // Only call commit action to mirror backend
+            yield put(callCommitAction(serviceDataActions.infusionMappingRemove, action.payload.infusionId, action.payload.inventoryMappingId));
+        }
+        else {
+            const inventoryLookup = yield select(rulesEngineSelectors.getInventoryLookup);
+            const foundItem = HelperUtils.lookupDataOrFallback(inventoryLookup, action.payload.inventoryMappingId);
+            if (foundItem) {
+                if (ItemAccessors.isAttuned(foundItem)) {
+                    yield put(characterActions.itemAttuneSet(inventoryMappingId, false));
+                }
+                const limitedUse = ItemAccessors.getLimitedUse(foundItem);
+                if (limitedUse !== null) {
+                    // TODO IMS Infusions come back here and switch this out
+                    yield put(characterActions.itemChargesSet(ItemAccessors.getMappingId(foundItem), 0));
+                }
+            }
+            yield put(serviceDataActions.infusionMappingRemove(action.payload.infusionId, action.payload.inventoryMappingId));
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleVehicleCreate(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, apiShared.postCharacterVehicle, action.payload);
+    let newVehicleMapping = data;
+    yield put(callCommitAction(serviceDataActions.vehicleMappingAdd, newVehicleMapping));
+    let definitionPool = yield select(serviceDataSelectors.getDefinitionPool);
+    let ruleData = yield select(rulesEngineSelectors.getRuleData);
+    let definitionKey = VehicleAccessors.getDefinitionKey(newVehicleMapping);
+    if (definitionKey === null) {
+        return;
+    }
+    let vehicleDefinition = DefinitionPoolUtils.getVehicleDefinition(definitionKey, definitionPool);
+    if (vehicleDefinition === null) {
+        return;
+    }
+    let simulatedVehicle = VehicleSimulators.simulateVehicle(vehicleDefinition, definitionPool, ruleData);
+    if (simulatedVehicle === null) {
+        return;
+    }
+    let vehicleComponents = VehicleAccessors.getDefinitionComponents(simulatedVehicle);
+    let componentIds = vehicleComponents
+        .map((component) => DefinitionUtils.getDefinitionKeyId(DefinitionAccessors.getDefinitionKey(component)))
+        .filter(TypeScriptUtils.isNotNullOrUndefined);
+    const componentsData = yield call(SagaHelpers.getApiRequestData, apiShared.postCharacterVehicleComponent, {
+        vehicleMappingId: VehicleAccessors.getMappingId(newVehicleMapping),
+        componentIds,
+    });
+    const componentMappings = componentsData;
+    for (let i = 0; i < componentMappings.length; i++) {
+        let componentMapping = componentMappings[i];
+        yield put(callCommitAction(serviceDataActions.vehicleComponentMappingAdd, componentMapping));
+    }
+    if (action.meta.accept) {
+        action.meta.accept();
+    }
+}
+/**
+ *
+ * @param action
+ */
+export function* handleVehicleRemove(action) {
+    const vehicles = yield select(rulesEngineSelectors.getVehicles);
+    const responseData = yield call(SagaHelpers.getApiRequestData, apiShared.deleteCharacterVehicle, action.payload);
+    let vehicle = vehicles.find((vehicle) => VehicleAccessors.getMappingId(vehicle) === action.payload.id);
+    if (vehicle) {
+        let vehicleComponents = VehicleAccessors.getAllComponentsData(vehicle);
+        yield put(callCommitAction(serviceDataActions.vehicleMappingRemove, action.payload.id));
+        for (let i = 0; i < vehicleComponents.length; i++) {
+            yield put(callCommitAction(serviceDataActions.vehicleComponentMappingRemove, VehicleComponentAccessors.getMappingId(vehicleComponents[i])));
+        }
+    }
+}
+export function* handlePartyInventoryRequest(action) {
+    var _a, _b, _c, _d, _e, _f;
+    const featureFlagInfo = yield select(featureFlagInfoSelectors.getFeatureFlagInfo);
+    const partyFlag = FeatureFlagInfoUtils.getFeatureFlagInfoValue(FeatureFlagEnum.RELEASE_GATE_IMS, featureFlagInfo);
+    // Party Inventory
+    if (partyFlag) {
+        const campaignInfo = yield select(characterSelectors.getCampaign);
+        if (campaignInfo) {
+            const data = yield call(SagaHelpers.getApiRequestData, apiShared.getPartyInventory, { campaignId: CampaignAccessors.getId(campaignInfo) });
+            // This sets the data in the serviceData.partyInfo state
+            yield put(serviceDataActions.partyCampaignInfoSet(Object.assign(Object.assign({}, campaignInfo), { sharingState: (_a = data === null || data === void 0 ? void 0 : data.sharingState) !== null && _a !== void 0 ? _a : PartyInventorySharingStateEnum.OFF, partyInventory: (_b = data === null || data === void 0 ? void 0 : data.partyItems) !== null && _b !== void 0 ? _b : [], spells: (_c = data === null || data === void 0 ? void 0 : data.spells) !== null && _c !== void 0 ? _c : null, modifiers: (_d = data === null || data === void 0 ? void 0 : data.modifiers) !== null && _d !== void 0 ? _d : null, coin: (_e = data === null || data === void 0 ? void 0 : data.currency) !== null && _e !== void 0 ? _e : initialCoinState })));
+            yield call(handleUpdatePartyInventoryValues, data);
+            // Party infusions set into serviceData
+            if ((_f = data.partyInfusions) === null || _f === void 0 ? void 0 : _f.length) {
+                let infusionDefinitionIds = new Set();
+                for (let i = 0; i < data.partyInfusions.length; i++) {
+                    const mapping = data.partyInfusions[i];
+                    yield put(callCommitAction(serviceDataActions.infusionMappingAdd, mapping));
+                    const definitionKey = InfusionAccessors.getDefinitionKey(mapping);
+                    if (definitionKey !== null) {
+                        infusionDefinitionIds.add(DefinitionUtils.getDefinitionKeyId(definitionKey));
+                    }
+                }
+                if (infusionDefinitionIds.size > 0) {
+                    yield call(handleLoadDefinitions, DefinitionTypeEnum.INFUSION, Array.from(infusionDefinitionIds));
+                }
+            }
+        }
+    }
+}
+function* handleUpdatePartyInventoryValues(data) {
+    if (data === null || data === void 0 ? void 0 : data.partyValues) {
+        for (let i = 0; i < data.partyValues.length; i++) {
+            const valueContract = data.partyValues[i];
+            yield put(callCommitAction(characterActions.valueSet, ValueAccessors.getTypeId(valueContract), ValueAccessors.getValue(valueContract), ValueAccessors.getNotes(valueContract), ValueAccessors.getValueId(valueContract), ValueAccessors.getValueTypeId(valueContract), ValueAccessors.getContextId(valueContract), ValueAccessors.getContextTypeId(valueContract)));
+        }
+        const characterValueLookupByEntity = yield select(characterSelectors.getCharacterValueLookupByEntity);
+        const characterValueLookup = yield select(characterSelectors.getCharacterValueLookup);
+        const partyItemValuesContracts = ItemUtils.getInventoryValuesMappings(characterValueLookupByEntity, data.partyItems);
+        const currentPartyItemValueKeys = partyItemValuesContracts.map((value) => ValueAccessors.getUniqueKey(value));
+        const newPartyItemValueKeys = data.partyValues.map((value) => ValueAccessors.getUniqueKey(value));
+        for (let i = 0; i < currentPartyItemValueKeys.length; i++) {
+            const valueContractKey = currentPartyItemValueKeys[i];
+            const valueContract = HelperUtils.lookupDataOrFallback(characterValueLookup, valueContractKey);
+            if (valueContract && !newPartyItemValueKeys.includes(currentPartyItemValueKeys[i])) {
+                yield put(callCommitAction(characterActions.valueRemove, valueContract.typeId, valueContract.valueId, valueContract.valueTypeId, valueContract.contextId, valueContract.contextTypeId));
+            }
+        }
+    }
+}
+export function* handlePartyCurrencyCopperSet(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterInventoryCurrencyCopper, action.payload);
+    if (data) {
+        yield call(handlePartyCoinUpdate, data, action.payload.destinationEntityId);
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+    }
+}
+export function* handlePartyCurrencySilverSet(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterInventoryCurrencySilver, action.payload);
+    if (data) {
+        yield call(handlePartyCoinUpdate, data, action.payload.destinationEntityId);
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+    }
+}
+export function* handlePartyCurrencyElectrumSet(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterInventoryCurrencyElectrum, action.payload);
+    if (data) {
+        yield call(handlePartyCoinUpdate, data, action.payload.destinationEntityId);
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+    }
+}
+export function* handlePartyCurrencyPlatinumSet(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterInventoryCurrencyPlatinum, action.payload);
+    if (data) {
+        yield call(handlePartyCoinUpdate, data, action.payload.destinationEntityId);
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+    }
+}
+export function* handlePartyCurrencyGoldSet(action) {
+    const data = yield call(SagaHelpers.getApiRequestData, ApiRequests.putCharacterInventoryCurrencyGold, action.payload);
+    if (data) {
+        yield call(handlePartyCoinUpdate, data, action.payload.destinationEntityId);
+        if (action.meta.accept) {
+            action.meta.accept();
+        }
+    }
+}
+function* handlePartyCoinUpdate(data, destinationEntityId) {
+    if (destinationEntityId) {
+        yield put(callCommitAction(serviceDataActions.partyItemCurrencySet, data, destinationEntityId));
+    }
+    else {
+        yield put(callCommitAction(serviceDataActions.partyCurrenciesSet, data));
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/sagas/serviceData/index.js b/ddb_main/packages/rules-engine/es/sagas/serviceData/index.js
new file mode 100644
index 0000000..595fea6
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/sagas/serviceData/index.js
@@ -0,0 +1,4 @@
+import * as handlers from './handlers';
+import saga from './saga';
+export const serviceDataSagaHandlers = handlers;
+export const serviceDataSaga = saga;
diff --git a/ddb_main/packages/rules-engine/es/sagas/serviceData/saga.js b/ddb_main/packages/rules-engine/es/sagas/serviceData/saga.js
new file mode 100644
index 0000000..c216717
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/sagas/serviceData/saga.js
@@ -0,0 +1,240 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { uniqueId } from 'lodash';
+import { call, put, select, takeEvery } from 'redux-saga/effects';
+import * as characterSelectors from "../../selectors/character";
+import * as types from '../../actions/serviceData/actionTypes';
+import { syncTransactionActions } from '../../actions/syncTransaction';
+import * as apiShared from '../../api/requests';
+import { OverrideApiException } from '../../apiAdapter';
+import { CharacterLoadingStatusEnum } from '../../reducers/constants';
+import * as characterEnvSelectors from '../../selectors/characterEnv';
+import * as syncTransactionSelectors from '../../selectors/syncTransaction';
+import { characterSagaHandlers } from '../character';
+import * as sagaHandlers from './handlers';
+const SYNC_ACTION_LOOKUP = {
+    //KNOWN_INFUSION
+    [types.KNOWN_INFUSION_MAPPING_CREATE]: true,
+    [types.KNOWN_INFUSION_MAPPING_DESTROY]: true,
+    //INFUSION
+    [types.INFUSION_MAPPING_CREATE]: true,
+    [types.INFUSION_MAPPING_DESTROY]: true,
+    //VEHICLE
+    [types.VEHICLE_MAPPING_CREATE]: true,
+};
+/**
+ *
+ * @param action
+ */
+function isSyncAction(action) {
+    return !!SYNC_ACTION_LOOKUP[action.type];
+}
+/**
+ *
+ * @param meta
+ * //TODO find a better solution for checking props on meta
+ */
+function isCommonCommitAction(meta) {
+    return meta.commit !== undefined;
+}
+/**
+ *
+ * @param meta
+ * //TODO find a better solution for checking props on meta
+ */
+function isPostAction(meta) {
+    return meta.postAction !== undefined;
+}
+/**
+ *
+ */
+export default function* saga() {
+    yield takeEvery(Object.keys(types).map((key) => types[key]), filter);
+}
+/**
+ *
+ * @param action
+ */
+function* filter(action) {
+    var _a;
+    const characterLoadingStatus = yield select(characterEnvSelectors.getLoadingStatus);
+    const canEdit = yield select(characterSelectors.getCanEdit);
+    if (!canEdit && characterLoadingStatus === CharacterLoadingStatusEnum.LOADED) {
+        return;
+    }
+    let transactionInitiatorId = null;
+    if (action.meta) {
+        transactionInitiatorId = yield call(executeSyncTransactionActivate, action);
+        try {
+            yield call(executeApi, action);
+            yield call(executeHandler, action);
+            yield call(executePostAction, action);
+            yield call(executeSyncTransactionDeactivate, action, transactionInitiatorId);
+        }
+        catch (error) {
+            if (error instanceof OverrideApiException) {
+                yield call(executeSyncTransactionDeactivate, action, transactionInitiatorId);
+                if ((_a = action.meta) === null || _a === void 0 ? void 0 : _a.reject) {
+                    action.meta.reject();
+                }
+            }
+            else {
+                throw error;
+            }
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+function* executePostAction(action) {
+    if (isPostAction(action.meta)) {
+        for (let i = 0; i < action.meta.postAction.type.length; i++) {
+            yield put({
+                type: action.meta.postAction.type[i],
+                payload: action.payload,
+            });
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+function* executeSyncTransactionActivate(action) {
+    const isSyncTransactionActive = yield select(syncTransactionSelectors.getActive);
+    let transactionInitiatorId = null;
+    if (isSyncAction(action) && !isSyncTransactionActive) {
+        transactionInitiatorId = uniqueId();
+        yield put(syncTransactionActions.activate(transactionInitiatorId));
+    }
+    return transactionInitiatorId;
+}
+/**
+ *
+ * @param action
+ * @param transactionInitiatorId
+ */
+function* executeSyncTransactionDeactivate(action, transactionInitiatorId) {
+    if (isSyncAction(action)) {
+        let syncTransactionInitiator = yield select(syncTransactionSelectors.getInitiator);
+        if (syncTransactionInitiator === transactionInitiatorId) {
+            yield put(syncTransactionActions.deactivate());
+        }
+    }
+}
+/**
+ *
+ * @param action
+ */
+function* executeApi(action) {
+    let apiLookup = {
+        //KNOWN_INFUSION
+        [types.KNOWN_INFUSION_MAPPING_SET]: apiShared.putCharacterKnownInfusion,
+        [types.KNOWN_INFUSION_MAPPING_REMOVE]: apiShared.deleteCharacterKnownInfusion,
+        //INFUSION
+        [types.INFUSION_MAPPING_REMOVE]: apiShared.deleteCharacterInfusion,
+        //VEHICLE_COMPONENT
+        [types.VEHICLE_COMPONENT_MAPPING_HIT_POINTS_SET]: apiShared.putCharacterVehicleComponentHp,
+        //VEHICLE
+        [types.VEHICLE_MAPPING_DATA_SET]: apiShared.putCharacterVehicle,
+        [types.VEHICLE_MAPPING_CONDITION_REMOVE]: apiShared.deleteCharacterVehicleCondition,
+        [types.VEHICLE_MAPPING_CONDITION_ADD]: apiShared.postCharacterVehicleCondition,
+        [types.VEHICLE_MAPPING_CONDITION_SET]: apiShared.putCharacterVehicleCondition,
+        [types.VEHICLE_MAPPING_REMAINING_FUEL_SET]: apiShared.putCharacterVehicleFuel,
+        //PARTY_ITEM
+        [types.PARTY_ITEM_REMOVE]: apiShared.deleteCharacterInventoryItem,
+    };
+    let apiPayload = action.payload;
+    //transforming payloads where api payload is different from action payload
+    switch (action.type) {
+        //KNOWN_INFUSION
+        case types.KNOWN_INFUSION_MAPPING_SET: {
+            const _a = action.payload, { definitionKey } = _a, knownInfusionSetPayload = __rest(_a, ["definitionKey"]);
+            const payload = knownInfusionSetPayload;
+            apiPayload = payload;
+            break;
+        }
+        //VEHICLE
+        case types.VEHICLE_MAPPING_DATA_SET: {
+            const payload = Object.assign({ id: action.payload.id }, action.payload.properties);
+            apiPayload = payload;
+            break;
+        }
+        case types.VEHICLE_MAPPING_REMAINING_FUEL_SET: {
+            const payload = {
+                id: action.payload.vehicleMappingId,
+                remainingFuel: action.payload.remainingFuel,
+            };
+            apiPayload = payload;
+            break;
+        }
+        case types.VEHICLE_MAPPING_CONDITION_SET: {
+            const payload = Object.assign({ vehicleMappingId: action.payload.vehicleMappingId }, action.payload.mappingContract);
+            apiPayload = payload;
+            break;
+        }
+        case types.VEHICLE_MAPPING_CONDITION_ADD: {
+            const payload = Object.assign({ vehicleMappingId: action.payload.vehicleMappingId }, action.payload.mappingContract);
+            apiPayload = payload;
+            break;
+        }
+        default:
+        // not implemented
+    }
+    let apiRequest = apiLookup[action.type] ? apiLookup[action.type] : null;
+    if (isCommonCommitAction(action.meta)) {
+        yield put({
+            type: action.meta.commit.type,
+            payload: action.payload,
+            meta: {},
+        });
+        if (apiRequest !== null && action.meta.accept) {
+            action.meta.accept();
+        }
+    }
+    if (apiRequest !== null) {
+        yield call(apiRequest, apiPayload);
+    }
+}
+function* executeHandler(action) {
+    let handlerLookup = {
+        //KNOWN_INFUSION
+        [types.KNOWN_INFUSION_MAPPING_CREATE]: sagaHandlers.handleKnownInfusionCreate,
+        [types.KNOWN_INFUSION_MAPPING_DESTROY]: sagaHandlers.handleKnownInfusionDestroy,
+        //INFUSION
+        [types.INFUSION_MAPPING_CREATE]: sagaHandlers.handleInfusionCreate,
+        [types.INFUSION_MAPPING_DESTROY]: sagaHandlers.handleInfusionDestroy,
+        [types.INFUSION_MAPPINGS_DESTROY]: sagaHandlers.handleInfusionsDestroy,
+        //VEHICLE
+        [types.VEHICLE_MAPPING_CREATE]: sagaHandlers.handleVehicleCreate,
+        [types.VEHICLE_MAPPING_REMOVE]: sagaHandlers.handleVehicleRemove,
+        //PARTY INVENTORY
+        [types.PARTY_INVENTORY_REQUEST]: sagaHandlers.handlePartyInventoryRequest,
+        [types.PARTY_CURRENCY_TRANSACTION_SET]: characterSagaHandlers.handleCurrencyTransactionSet,
+        [types.PARTY_CURRENCY_COPPER_SET]: sagaHandlers.handlePartyCurrencyCopperSet,
+        [types.PARTY_CURRENCY_ELECTRUM_SET]: sagaHandlers.handlePartyCurrencyElectrumSet,
+        [types.PARTY_CURRENCY_GOLD_SET]: sagaHandlers.handlePartyCurrencyGoldSet,
+        [types.PARTY_CURRENCY_PLATINUM_SET]: sagaHandlers.handlePartyCurrencyPlatinumSet,
+        [types.PARTY_CURRENCY_SILVER_SET]: sagaHandlers.handlePartyCurrencySilverSet,
+        [types.PARTY_ITEM_CURRENCY_COPPER_SET]: sagaHandlers.handlePartyCurrencyCopperSet,
+        [types.PARTY_ITEM_CURRENCY_ELECTRUM_SET]: sagaHandlers.handlePartyCurrencyElectrumSet,
+        [types.PARTY_ITEM_CURRENCY_GOLD_SET]: sagaHandlers.handlePartyCurrencyGoldSet,
+        [types.PARTY_ITEM_CURRENCY_PLATINUM_SET]: sagaHandlers.handlePartyCurrencyPlatinumSet,
+        [types.PARTY_ITEM_CURRENCY_SILVER_SET]: sagaHandlers.handlePartyCurrencySilverSet,
+    };
+    let handler = handlerLookup[action.type] ? handlerLookup[action.type] : null;
+    if (handler !== null) {
+        yield call(handler, action);
+    }
+}
diff --git a/ddb_main/packages/rules-engine/es/selectors/character.js b/ddb_main/packages/rules-engine/es/selectors/character.js
new file mode 100644
index 0000000..30e9a82
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/selectors/character.js
@@ -0,0 +1,126 @@
+import { createSelector } from 'reselect';
+import { CharacterGenerators } from '../engine/Character';
+import { ValueGenerators } from '../engine/Value';
+import { initialChoiceComponentState, } from '../generated';
+import { SelectorHelpers } from '../utils';
+export const getActions = (state) => state.character.actions;
+export const getActiveSourceCategories = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.activeSourceCategories);
+export const getAdjustmentXp = (state) => state.character.adjustmentXp;
+export const getAge = (state) => state.character.age;
+export const getAlignmentId = (state) => state.character.alignmentId;
+export const getBackground = (state) => state.character.background;
+export const getBaseHp = (state) => state.character.baseHitPoints;
+export const getBonusHp = (state) => state.character.bonusHitPoints;
+export const getBonusStats = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.bonusStats);
+export const getCampaign = (state) => state.character.campaign;
+export const getCampaignSetting = (state) => state.character.campaignSetting;
+export const getCanEdit = (state) => state.character.canEdit;
+export const getIsAssignedToPlayer = (state) => state.character.isAssignedToPlayer;
+export const getCharacterValues = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.characterValues);
+export const getChoices = (state) => state.character.choices || initialChoiceComponentState;
+export const getClassSpells = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.classSpells);
+export const getClasses = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.classes);
+export const getConditions = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.conditions);
+export const getConfiguration = (state) => state.character.configuration;
+export const getCreatures = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.creatures);
+export const getCurrencies = (state) => state.character.currencies;
+export const getCurrentXp = (state) => state.character.currentXp;
+export const getCustomActions = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.customActions);
+export const getCustomDefenseAdjustments = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.customDefenseAdjustments);
+export const getCustomItems = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.customItems);
+export const getCustomProficiencies = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.customProficiencies);
+export const getCustomSenses = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.customSenses);
+export const getCustomSpeeds = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.customSpeeds);
+export const getDeathSaves = (state) => state.character.deathSaves;
+export const getDecorations = (state) => state.character.decorations;
+export const getEyes = (state) => state.character.eyes;
+export const getFaith = (state) => state.character.faith;
+export const getFeats = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.feats);
+export const getGender = (state) => state.character.gender;
+export const getHair = (state) => state.character.hair;
+export const getHeight = (state) => state.character.height;
+export const getId = (state) => state.character.id;
+export const getInspiration = (state) => state.character.inspiration;
+export const getInventory = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.inventory);
+export const getLifestyleId = (state) => state.character.lifestyleId;
+export const getModifiers = (state) => state.character.modifiers;
+export const getName = (state) => state.character.name;
+export const getNotes = (state) => state.character.notes;
+export const getOptionalClassFeatures = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.optionalClassFeatures);
+export const getOptionalOrigins = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.optionalOrigins);
+export const getOptions = (state) => state.character.options;
+export const getOverrideHp = (state) => state.character.overrideHitPoints;
+export const getOverrideStats = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.overrideStats);
+export const getPactMagicSlots = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.pactMagic);
+export const getPreferences = (state) => state.character.preferences;
+export const getRace = (state) => state.character.race;
+export const getReadOnlyUrl = (state) => state.character.readonlyUrl;
+export const getRemovedHp = (state) => state.character.removedHitPoints;
+export const getSkin = (state) => state.character.skin;
+export const getSpellSlots = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.spellSlots);
+export const getSpells = (state) => state.character.spells;
+export const getStats = (state) => SelectorHelpers.getArrayOrNullFallback(state.character.stats);
+export const getTempHp = (state) => state.character.temporaryHitPoints;
+export const getTraits = (state) => state.character.traits;
+export const getUserId = (state) => state.character.userId;
+export const getUsername = (state) => state.character.username;
+export const getWeight = (state) => state.character.weight;
+export const getDeathSavesFailCount = (state) => state.character.deathSaves === null ? null : state.character.deathSaves.failCount;
+export const getDeathSavesSuccessCount = (state) => state.character.deathSaves === null ? null : state.character.deathSaves.successCount;
+export const getActions_class = (state) => state.character.actions === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.actions.class);
+export const getActions_feat = (state) => state.character.actions === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.actions.feat);
+export const getActions_race = (state) => state.character.actions === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.actions.race);
+export const getChoices_background = (state) => state.character.choices === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.choices.background);
+export const getChoices_class = (state) => state.character.choices === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.choices.class);
+export const getChoices_feat = (state) => state.character.choices === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.choices.feat);
+export const getChoices_race = (state) => state.character.choices === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.choices.race);
+/**
+ * @name getChoices_choiceDefinitions()
+ * @param state
+ * @returns {Array<BuilderChoiceDefinitions>}
+ * Returns empty array if Character choices is null
+ * or choices definitions if choices property is populated.
+ */
+export const getChoices_choiceDefinitions = (state) => state.character.choices === null
+    ? []
+    : SelectorHelpers.getArrayOrNullFallback(state.character.choices.choiceDefinitions);
+export const getModifiers_background = (state) => state.character.modifiers === null
+    ? []
+    : SelectorHelpers.getArrayOrNullFallback(state.character.modifiers.background);
+export const getModifiers_class = (state) => state.character.modifiers === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.modifiers.class);
+export const getModifiers_condition = (state) => state.character.modifiers === null
+    ? []
+    : SelectorHelpers.getArrayOrNullFallback(state.character.modifiers.condition);
+export const getModifiers_feat = (state) => state.character.modifiers === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.modifiers.feat);
+export const getModifiers_item = (state) => state.character.modifiers === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.modifiers.item);
+export const getModifiers_race = (state) => state.character.modifiers === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.modifiers.race);
+export const getOptions_class = (state) => state.character.options === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.options.class);
+export const getOptions_feat = (state) => state.character.options === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.options.feat);
+export const getOptions_race = (state) => state.character.options === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.options.race);
+export const getSpells_class = (state) => state.character.spells === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.spells.class);
+export const getSpells_feat = (state) => state.character.spells === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.spells.feat);
+export const getSpells_item = (state) => state.character.spells === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.spells.item);
+export const getSpells_race = (state) => state.character.spells === null ? [] : SelectorHelpers.getArrayOrNullFallback(state.character.spells.race);
+/**
+ * @returns {CustomSpeedLookup}
+ */
+export const getCustomSpeedLookup = createSelector([getCustomSpeeds], CharacterGenerators.generateCustomSpeedLookup);
+/**
+ * @returns {CustomSenseLookup}
+ */
+export const getCustomSenseLookup = createSelector([getCustomSenses], CharacterGenerators.generateCustomSenseLookup);
+/**
+ * @returns {ValueLookup}
+ */
+export const getCharacterValueLookup = createSelector([getCharacterValues], ValueGenerators.generateCharacterValueLookup);
+/**
+ * @returns {EntityValueLookup}
+ */
+export const getCharacterValueLookupByEntity = createSelector([getCharacterValues], ValueGenerators.generateCharacterEntityValueLookup);
+/**
+ * @returns {TypeValueLookup}
+ */
+export const getCharacterValueLookupByType = createSelector([getCharacterValues], ValueGenerators.generateCharacterTypeValueLookup);
+export const getPremadeInfo = (state) => state.character.premadeInfo;
+export const getStatus = (state) => state.character.status;
+export const getStatusSlug = (state) => state.character.statusSlug;
diff --git a/ddb_main/packages/rules-engine/es/selectors/characterEnv.js b/ddb_main/packages/rules-engine/es/selectors/characterEnv.js
new file mode 100644
index 0000000..3c73336
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/selectors/characterEnv.js
@@ -0,0 +1,2 @@
+export const getContext = (state) => state.characterEnv.context;
+export const getLoadingStatus = (state) => state.characterEnv.loadingStatus;
diff --git a/ddb_main/packages/rules-engine/es/selectors/composite/apiCreator/creators.js b/ddb_main/packages/rules-engine/es/selectors/composite/apiCreator/creators.js
new file mode 100644
index 0000000..f47b612
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/selectors/composite/apiCreator/creators.js
@@ -0,0 +1,171 @@
+import { merge } from 'lodash';
+import { createSelector } from 'reselect';
+import { ApiRequests, ApiUtils } from "../../../api";
+import { ApiAdapterUtils } from "../../../apiAdapter";
+import { BackgroundAccessors } from "../../../engine/Background";
+import { ClassAccessors } from "../../../engine/Class";
+import { DefinitionTypeEnum } from "../../../engine/Definition";
+import { EntityUtils, } from "../../../engine/Entity";
+import { RaceAccessors } from "../../../engine/Race";
+import * as characterSelectors from "../../character";
+import * as rulesEngineSelectors from "../engine";
+function restrictGameDataDefinitionResponseData(response, entityRestrictionData, characterId) {
+    let originalData = ApiAdapterUtils.getResponseData(response);
+    if (originalData !== null && characterId !== null && response.data.data !== undefined) {
+        response.data.data.definitionData = EntityUtils.filterNonRestrictedEntityDefinitions(originalData.definitionData, entityRestrictionData);
+    }
+    return response;
+}
+function restrictEntityDefinitionResponseData(response, entityRestrictionData, characterId) {
+    let originalData = ApiAdapterUtils.getResponseData(response);
+    if (originalData !== null && characterId !== null) {
+        const filteredDataData = EntityUtils.filterNonRestrictedEntityDefinitions(originalData, entityRestrictionData);
+        const newResponseData = Object.assign({}, response.data, { data: filteredDataData });
+        return Object.assign({}, response, { data: newResponseData });
+    }
+    return response;
+}
+function restrictEntityResponseData(response, entityRestrictionData, characterId) {
+    let originalData = ApiAdapterUtils.getResponseData(response);
+    if (originalData !== null && characterId !== null) {
+        const filteredDataData = EntityUtils.filterNonRestrictedEntities(originalData, entityRestrictionData);
+        const newResponseData = Object.assign({}, response.data, { data: filteredDataData });
+        return Object.assign({}, response, { data: newResponseData });
+    }
+    return response;
+}
+export const makeLoadAvailableClasses = createSelector([rulesEngineSelectors.getEntityRestrictionData, characterSelectors.getId], (entityRestrictionData, characterId) => (additionalConfig) => {
+    return ApiRequests.getCharacterGameDataClasses(additionalConfig).then((response) => restrictEntityDefinitionResponseData(response, entityRestrictionData, characterId));
+});
+export const makeLoadAvailableSubclasses = createSelector([rulesEngineSelectors.getEntityRestrictionData, characterSelectors.getId], (entityRestrictionData, characterId) => (baseClassId, additionalConfig) => {
+    const requiredConfig = {
+        params: {
+            baseClassId,
+        },
+    };
+    return ApiRequests.getCharacterGameDataSubclasses(merge({}, additionalConfig, requiredConfig)).then((response) => restrictEntityDefinitionResponseData(response, entityRestrictionData, characterId));
+});
+export const makeLoadAvailableRaces = createSelector([rulesEngineSelectors.getEntityRestrictionData, characterSelectors.getId], (entityRestrictionData, characterId) => (additionalConfig) => {
+    return ApiRequests.getCharacterGameDataRaces(additionalConfig).then((response) => restrictEntityDefinitionResponseData(response, entityRestrictionData, characterId));
+});
+export const makeLoadAvailableFeats = createSelector([rulesEngineSelectors.getEntityRestrictionData, characterSelectors.getId], (entityRestrictionData, characterId) => (additionalConfig) => {
+    return ApiRequests.getCharacterGameDataFeats(additionalConfig).then((response) => restrictEntityDefinitionResponseData(response, entityRestrictionData, characterId));
+});
+export const makeLoadAvailableItems = createSelector([rulesEngineSelectors.getEntityRestrictionData, characterSelectors.getId], (entityRestrictionData, characterId) => (additionalConfig) => {
+    return ApiRequests.getCharacterGameDataItems(additionalConfig).then((response) => restrictEntityDefinitionResponseData(response, entityRestrictionData, characterId));
+});
+export const makeLoadAvailableMonsters = createSelector([rulesEngineSelectors.getEntityRestrictionData, characterSelectors.getId], (entityRestrictionData, characterId) => (additionalConfig) => {
+    return ApiRequests.getCharacterGameDataMonsters(additionalConfig).then((response) => restrictEntityDefinitionResponseData(response, entityRestrictionData, characterId));
+});
+export const makeLoadAvailableInfusions = createSelector([rulesEngineSelectors.getEntityRestrictionData, characterSelectors.getId], (entityRestrictionData, characterId) => (additionalConfig) => {
+    return ApiUtils.makeGetAllDefinitionTypeRequest(DefinitionTypeEnum.INFUSION)(additionalConfig).then((response) => restrictGameDataDefinitionResponseData(response, entityRestrictionData, characterId));
+});
+export const makeLoadAvailableVehicles = createSelector([rulesEngineSelectors.getEntityRestrictionData, characterSelectors.getId], (entityRestrictionData, characterId) => (additionalConfig) => {
+    return ApiUtils.makeGetAllDefinitionTypeRequest(DefinitionTypeEnum.VEHICLE)(additionalConfig).then((response) => restrictGameDataDefinitionResponseData(response, entityRestrictionData, characterId));
+});
+export const makeLoadClassStartingEquipment = createSelector([rulesEngineSelectors.getStartingClass], (startingClass) => {
+    let id = -1;
+    if (startingClass) {
+        id = ClassAccessors.getId(startingClass);
+    }
+    return (additionalConfig) => {
+        const requiredConfig = {
+            params: {
+                id,
+            },
+        };
+        return ApiRequests.getCharacterGameDataClassStartingEquipment(merge({}, additionalConfig, requiredConfig));
+    };
+});
+export const makeLoadBackgroundStartingEquipment = createSelector([rulesEngineSelectors.getBackgroundInfo], (backgroundInfo) => {
+    let id = -1;
+    if (backgroundInfo) {
+        id = BackgroundAccessors.getId(backgroundInfo);
+    }
+    return (additionalConfig) => {
+        const requiredConfig = {
+            params: {
+                id,
+            },
+        };
+        return ApiRequests.getCharacterGameDataBackgroundStartingEquipment(merge({}, additionalConfig, requiredConfig));
+    };
+});
+export const makeLoadClassRemainingSpells = createSelector([
+    rulesEngineSelectors.getGlobalSpellListIds,
+    rulesEngineSelectors.getEntityRestrictionData,
+    characterSelectors.getId,
+], (globalSpellListIds, entityRestrictionData, characterId) => {
+    return (charClass) => {
+        if (!ClassAccessors.isSpellcastingActive(charClass) && !ClassAccessors.isPactMagicActive(charClass)) {
+            return null;
+        }
+        return (additionalConfig) => {
+            const requiredConfig = {
+                params: {
+                    classId: ClassAccessors.getActiveId(charClass),
+                    classLevel: ClassAccessors.getLevel(charClass),
+                    spellListIds: [...globalSpellListIds, ...ClassAccessors.getSpellListIds(charClass)],
+                },
+            };
+            return ApiRequests.getCharacterGameDataSpells(merge({}, additionalConfig, requiredConfig)).then((response) => restrictEntityResponseData(response, entityRestrictionData, characterId));
+        };
+    };
+});
+export const makeLoadClassAlwaysKnownSpells = createSelector([
+    rulesEngineSelectors.getClasses,
+    rulesEngineSelectors.getGlobalSpellListIds,
+    rulesEngineSelectors.getEntityRestrictionData,
+    characterSelectors.getId,
+], (classes, globalSpellListIds, entityRestrictionData, characterId) => {
+    return (charClass) => {
+        if (!ClassAccessors.getKnowsAllSpells(charClass)) {
+            return null;
+        }
+        return (additionalConfig) => {
+            const requiredConfig = {
+                params: {
+                    classId: ClassAccessors.getActiveId(charClass),
+                    classLevel: ClassAccessors.getLevel(charClass),
+                    spellListIds: [...globalSpellListIds, ...ClassAccessors.getSpellListIds(charClass)],
+                },
+            };
+            return ApiRequests.getCharacterGameDataAlwaysKnownSpells(merge({}, additionalConfig, requiredConfig)).then((response) => restrictEntityResponseData(response, entityRestrictionData, characterId));
+        };
+    };
+});
+export const makeLoadAvailableBackgrounds = createSelector([rulesEngineSelectors.getEntityRestrictionData, characterSelectors.getId], (entityRestrictionData, characterId) => (additionalConfig) => {
+    return ApiRequests.getCharacterGameDataBackgrounds(additionalConfig).then((response) => restrictEntityDefinitionResponseData(response, entityRestrictionData, characterId));
+});
+export const makeLoadAvailableOptionalRacialTraits = createSelector([rulesEngineSelectors.getRace], (race) => (additionalConfig) => {
+    const requiredConfig = {
+        params: {
+            entityRaceId: race ? RaceAccessors.getEntityRaceId(race) : -1,
+            entityRaceTypeId: race ? RaceAccessors.getEntityRaceTypeId(race) : -1,
+        },
+    };
+    return ApiRequests.getCharacterGameDataRacialTraits(merge({}, additionalConfig, requiredConfig));
+});
+export const makeLoadAvailableOptionalClassFeatures = createSelector([rulesEngineSelectors.getClasses], (classes) => {
+    return (charClass) => {
+        return (additionalConfig) => {
+            const requiredConfig = {
+                params: {
+                    classId: ClassAccessors.getActiveId(charClass),
+                },
+            };
+            return ApiRequests.getCharacterGameDataClassFeatures(merge({}, additionalConfig, requiredConfig));
+        };
+    };
+});
+//----------------------------
+// BELOW LIES GFS
+//----------------------------
+// TODO: restrictEntityDefinitionResponseData is filtering by homebrew and sources categories based on preferences
+//  so maybe that should just be part of the api.
+//  if you change it during game you would have to make the api call again.
+export const makeLoadAvailableFeatures = createSelector([rulesEngineSelectors.getEntityRestrictionData, characterSelectors.getId], (entityRestrictionData, characterId) => (additionalConfig) => {
+    return ApiRequests.getCharacterGameDataFeatures(additionalConfig).then((response) => 
+    // restrictEntityDefinitionResponseData(response, entityRestrictionData, characterId)
+    response);
+});
diff --git a/ddb_main/packages/rules-engine/es/selectors/composite/apiCreator/index.js b/ddb_main/packages/rules-engine/es/selectors/composite/apiCreator/index.js
new file mode 100644
index 0000000..f555f3c
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/selectors/composite/apiCreator/index.js
@@ -0,0 +1,8 @@
+import * as apiCreatorCreators from './creators';
+import * as apiCreatorTypings from './typings';
+export * from './creators';
+export * from './typings';
+export default {
+    apiCreatorCreators,
+    apiCreatorTypings,
+};
diff --git a/ddb_main/packages/rules-engine/es/selectors/composite/engine.js b/ddb_main/packages/rules-engine/es/selectors/composite/engine.js
new file mode 100644
index 0000000..012a67b
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/selectors/composite/engine.js
@@ -0,0 +1,1535 @@
+import { createSelector } from 'reselect';
+import { ApiGenerators } from '../../api';
+import { AbilityGenerators } from '../../engine/Ability';
+import { ActionGenerators } from '../../engine/Action';
+import { BackgroundGenerators } from '../../engine/Background';
+import { CampaignGenerators } from '../../engine/Campaign';
+import { CharacterDerivers, CharacterGenerators, CharacterHacks, CharacterUtils, } from '../../engine/Character';
+import { ChoiceGenerators } from '../../engine/Choice';
+import { ClassDerivers, ClassGenerators } from '../../engine/Class';
+import { ClassFeatureGenerators } from '../../engine/ClassFeature';
+import { ConditionGenerators } from '../../engine/Condition';
+import { ContainerGenerators } from '../../engine/Container';
+import { CoreGenerators } from '../../engine/Core';
+import { CreatureGenerators } from '../../engine/Creature';
+import { CreatureRuleGenerators } from '../../engine/CreatureRule';
+import { DataOriginGenerators } from '../../engine/DataOrigin';
+import { DecorationAccessors, DecorationGenerators } from '../../engine/Decoration';
+import { DiceGenerators } from '../../engine/Dice';
+import { EntityGenerators } from '../../engine/Entity';
+import { ExtraGenerators } from '../../engine/Extra';
+import { FeatGenerators } from '../../engine/Feat';
+import { InfusionGenerators } from '../../engine/Infusion';
+import { InfusionChoiceGenerators } from '../../engine/InfusionChoice';
+import { ItemDerivers, ItemGenerators, ItemUtils } from '../../engine/Item';
+import { KnownInfusionGenerators } from '../../engine/KnownInfusion';
+import { ModifierGenerators } from '../../engine/Modifier';
+import { OptionGenerators } from '../../engine/Option';
+import { OptionalClassFeatureGenerators } from '../../engine/OptionalClassFeature';
+import { OptionalOriginGenerators } from '../../engine/OptionalOrigin';
+import { PdfGenerators, PdfHacks } from '../../engine/Pdf';
+import { PrerequisiteGenerators } from '../../engine/Prerequisite';
+import { RaceGenerators } from '../../engine/Race';
+import { RuleDataAccessors, RuleDataGenerators } from '../../engine/RuleData';
+import { SkillGenerators } from '../../engine/Skill';
+import { SnippetGenerators } from '../../engine/Snippet';
+import { SpellDerivers, SpellGenerators } from '../../engine/Spell';
+import { ValueUtils } from '../../engine/Value';
+import { VehicleGenerators } from '../../engine/Vehicle';
+import { VehicleComponentGenerators } from '../../engine/VehicleComponent';
+import * as characterSelectors from '../character';
+import * as characterEnvSelectors from '../characterEnv';
+import * as featureFlagInfoSelectors from '../featureFlagInfo';
+import * as ruleDataSelectors from '../ruleData';
+import * as serviceDataSelectors from '../serviceData';
+/**
+ * PassThrough exports from other selectors
+ */
+export * from './app/characterPassThrough';
+/**
+ * @returns {RequiredGameDataServiceParams}
+ */
+export const getRequiredGameDataServiceParams = createSelector([characterSelectors.getCampaign], ApiGenerators.generateRequiredGameDataServiceParams);
+/**
+ * @returns {RequiredCharacterServiceParams}
+ */
+export const getRequiredCharacterServiceParams = createSelector([characterSelectors.getId], ApiGenerators.generateRequiredCharacterServiceParams);
+/**
+ * @returns {RuleData}
+ */
+export const getRuleData = createSelector([ruleDataSelectors.getAllData, serviceDataSelectors.getRuleDataPool], RuleDataGenerators.generateRuleData);
+/**
+ * @returns {SpellListDataOriginLookup}
+ */
+export const getSpellListDataOriginLookup = createSelector([
+    characterSelectors.getRace,
+    characterSelectors.getClasses,
+    characterSelectors.getBackground,
+    characterSelectors.getOptionalOrigins,
+    characterSelectors.getOptionalClassFeatures,
+    serviceDataSelectors.getDefinitionPool,
+], SpellGenerators.generateSpellListDataOriginLookup);
+/**
+ * @returns {Record<string, Array<ActionContract>>}
+ */
+export const getFeatActionLookup = createSelector([characterSelectors.getActions_feat], ActionGenerators.generateActionComponentLookup);
+/**
+ * @returns {Record<string, Array<ModifierContract>>}
+ */
+export const getFeatModifierLookup = createSelector([characterSelectors.getModifiers_feat], ModifierGenerators.generateModifierComponentLookup);
+/**
+ * @returns {Record<string, Array<CharacterOptionContract>>}
+ */
+export const getFeatOptionLookup = createSelector([characterSelectors.getOptions_feat], OptionGenerators.generateOptionComponentLookup);
+/**
+ * @returns {Record<string, Array<BuilderChoiceContract>>}
+ */
+export const getFeatChoiceLookup = createSelector([characterSelectors.getChoices_feat, characterSelectors.getChoices_choiceDefinitions], ChoiceGenerators.generateChoiceComponentLookup);
+/**
+ * @returns {Record<string, Array<BaseSpellContract>>}
+ */
+export const getFeatSpellsLookup = createSelector([characterSelectors.getSpells_feat], SpellGenerators.generateSpellComponentLookup);
+/**
+ * @returns {Record<string, Array<ModifierContract>>}
+ */
+export const getConditionModifierLookup = createSelector([characterSelectors.getModifiers_condition], ModifierGenerators.generateModifierComponentLookup);
+/**
+ * @returns {Record<string, Array<ModifierContract>>}
+ */
+export const getRaceModifierLookup = createSelector([characterSelectors.getModifiers_race], ModifierGenerators.generateModifierComponentLookup);
+/**
+ * @returns {Record<string, Array<BaseSpellContract>>}
+ */
+export const getRaceSpellLookup = createSelector([characterSelectors.getSpells_race], SpellGenerators.generateSpellComponentLookup);
+/**
+ * @returns {Record<string, Array<ActionContract>>}
+ */
+export const getRaceActionLookup = createSelector([characterSelectors.getActions_race], ActionGenerators.generateActionComponentLookup);
+/**
+ * @returns {Record<string, Array<BuilderChoiceContract>>}
+ */
+export const getRaceChoiceLookup = createSelector([characterSelectors.getChoices_race, characterSelectors.getChoices_choiceDefinitions], ChoiceGenerators.generateChoiceComponentLookup);
+/**
+ * @returns {Record<string, Array<CharacterOptionContract>>}
+ */
+export const getRaceOptionLookup = createSelector([characterSelectors.getOptions_race], OptionGenerators.generateOptionComponentLookup);
+/**
+ * @returns {Record<string, Array<BuilderChoiceContract>>}
+ */
+export const getClassChoiceLookup = createSelector([characterSelectors.getChoices_class, characterSelectors.getChoices_choiceDefinitions], ChoiceGenerators.generateChoiceComponentLookup);
+/**
+ * @returns {Record<string, Array<ModifierContract>>}
+ */
+export const getClassModifierLookup = createSelector([characterSelectors.getModifiers_class], ModifierGenerators.generateModifierComponentLookup);
+/**
+ * @returns {Record<string, Array<BaseSpellContract>>}
+ */
+export const getClassSpellLookup = createSelector([characterSelectors.getSpells_class], SpellGenerators.generateSpellComponentLookup);
+/**
+ * @returns {Record<string, Array<ActionContract>>}
+ */
+export const getClassActionLookup = createSelector([characterSelectors.getActions_class], ActionGenerators.generateActionComponentLookup);
+/**
+ * @returns {Record<string, Array<CharacterOptionContract>>}
+ */
+export const getClassOptionLookup = createSelector([characterSelectors.getOptions_class], OptionGenerators.generateOptionComponentLookup);
+/**
+ * @returns {CharacterConfiguration}
+ */
+export const getCharacterConfiguration = createSelector([characterSelectors.getConfiguration], CharacterGenerators.generateCharacterConfiguration);
+/**
+ * @returns {CharacterPreferences}
+ */
+export const getCharacterPreferences = createSelector([characterSelectors.getPreferences, featureFlagInfoSelectors.getFeatureFlagInfo], CharacterGenerators.generateCharacterPreferences);
+/**
+ * @returns {CharacterNotes}
+ */
+export const getCharacterNotes = createSelector([characterSelectors.getNotes], CharacterGenerators.generateCharacterNotes);
+/**
+ * @returns {CharacterTraits}
+ */
+export const getCharacterTraits = createSelector([characterSelectors.getTraits], CharacterGenerators.generateCharacterTraits);
+/**
+ * @returns {Array<number>}
+ */
+export const getActiveSourceCategories = createSelector([characterSelectors.getActiveSourceCategories], (sourceCategories) => sourceCategories);
+/**
+ * @returns {Array<SourceData>}
+ */
+export const getActiveSources = createSelector([
+    getActiveSourceCategories,
+    characterSelectors.getCampaignSetting,
+    serviceDataSelectors.getCampaignSettings,
+    getRuleData,
+    featureFlagInfoSelectors.getFeatureFlagInfo,
+], CharacterGenerators.generateActiveSources);
+/**
+ * @returns {Record<number, SourceData>}
+ */
+export const getActiveSourceLookup = createSelector([getActiveSources], RuleDataGenerators.generateSourceDataLookup);
+/**
+ * @returns {EntityRestrictionData}
+ */
+export const getEntityRestrictionData = createSelector([getCharacterPreferences, getActiveSourceLookup], EntityGenerators.generateEntityRestrictionData);
+/**
+ * @returns {Record<string, Array<ModifierContract>>}
+ */
+export const getBackgroundModifierLookup = createSelector([characterSelectors.getModifiers_background], ModifierGenerators.generateModifierComponentLookup);
+/**
+ * @returns {Record<string, Array<BuilderChoiceContract>>}
+ */
+export const getBackgroundChoiceLookup = createSelector([characterSelectors.getChoices_background, characterSelectors.getChoices_choiceDefinitions], ChoiceGenerators.generateChoiceComponentLookup);
+/**
+ * @returns {Array<BaseFeat>}
+ */
+export const getBaseFeats = createSelector([
+    characterSelectors.getFeats,
+    getFeatOptionLookup,
+    getFeatActionLookup,
+    getFeatChoiceLookup,
+    getFeatModifierLookup,
+    getFeatSpellsLookup,
+    characterSelectors.getCharacterValueLookup,
+    getSpellListDataOriginLookup,
+    getRuleData,
+], FeatGenerators.generateBaseFeats);
+/**
+ * @returns {Record<string, Array<FeatDetailsContract>>}
+ */
+export const getBaseFeatLookup = createSelector([getBaseFeats], FeatGenerators.generateFeatComponentLookup);
+/**
+ * @returns {Background | null}
+ */
+export const getBackgroundInfo = createSelector([
+    characterSelectors.getBackground,
+    getBackgroundModifierLookup,
+    getBackgroundChoiceLookup,
+    characterSelectors.getChoices,
+    getBaseFeats,
+], BackgroundGenerators.generateBackground);
+/**
+ * @returns {Array<Condition>}
+ */
+export const getActiveConditions = createSelector([characterSelectors.getConditions, getConditionModifierLookup, getRuleData], ConditionGenerators.generateConditions);
+/**
+ * @returns {Array<OptionalClassFeature>}
+ */
+export const getOptionalClassFeatures = createSelector([
+    characterSelectors.getOptionalClassFeatures,
+    serviceDataSelectors.getDefinitionPool,
+    characterSelectors.getClasses,
+    characterSelectors.getChoices,
+    getBaseFeats,
+], OptionalClassFeatureGenerators.generateOptionalClassFeatures);
+/**
+ * @returns {OptionalClassFeatureLookup}
+ */
+export const getOptionalClassFeatureLookup = createSelector([getOptionalClassFeatures], OptionalClassFeatureGenerators.generateOptionalClassFeatureLookup);
+/**
+ * @returns {Array<OptionalOrigin>}
+ */
+export const getOptionalOrigins = createSelector([characterSelectors.getOptionalOrigins, serviceDataSelectors.getDefinitionPool], OptionalOriginGenerators.generateOptionalOrigins);
+/**
+ * @returns {OptionalOriginLookup}
+ */
+export const getOptionalOriginLookup = createSelector([getOptionalOrigins], OptionalOriginGenerators.generateOptionalOriginLookup);
+/**
+ *
+ */
+export const getKnownInfusions = createSelector([serviceDataSelectors.getKnownInfusionsMappings, serviceDataSelectors.getDefinitionPool, characterSelectors.getId], KnownInfusionGenerators.generateKnownInfusions);
+/**
+ *
+ */
+export const getKnownInfusionLookup = createSelector([getKnownInfusions], KnownInfusionGenerators.generateKnownInfusionLookup);
+/**
+ *
+ */
+export const getKnownInfusionLookupByChoiceKey = createSelector([getKnownInfusions], KnownInfusionGenerators.generateKnownInfusionLookupByChoiceKey);
+/**
+ *
+ */
+export const getKnownReplicatedItems = createSelector([getKnownInfusions], KnownInfusionGenerators.generateKnownReplicatedItems);
+/**
+ *
+ */
+export const getInfusions = createSelector([serviceDataSelectors.getInfusionsMappings, serviceDataSelectors.getDefinitionPool], InfusionGenerators.generateInfusions);
+/**
+ *
+ */
+export const getInfusionChoiceInfusionLookup = createSelector([getInfusions], InfusionGenerators.generateInfusionChoiceInfusionLookup);
+/**
+ *
+ */
+export const getInventoryInfusionLookup = createSelector([getInfusions], InfusionGenerators.generateInventoryInfusionLookup);
+/**
+ *
+ */
+export const getCreatureInfusionLookup = createSelector([getInfusions], InfusionGenerators.generateCreatureInfusionLookup);
+/**
+ * @returns {ClassesLookupData}
+ */
+const getClassesLookupData = createSelector([
+    getClassModifierLookup,
+    getClassSpellLookup,
+    getClassActionLookup,
+    getClassChoiceLookup,
+    getClassOptionLookup,
+    characterSelectors.getCharacterValueLookup,
+    getBaseFeatLookup,
+    getInfusionChoiceInfusionLookup,
+    getKnownInfusionLookupByChoiceKey,
+    getSpellListDataOriginLookup,
+], ClassGenerators.generateClassesLookupData);
+/**
+ * @returns {Array<BaseCharClass>}
+ */
+const getBaseClasses = createSelector([
+    characterSelectors.getClasses,
+    getOptionalClassFeatures,
+    characterSelectors.getClassSpells,
+    serviceDataSelectors.getClassAlwaysPreparedSpells,
+    serviceDataSelectors.getClassAlwaysKnownSpells,
+    characterEnvSelectors.getContext,
+    getRuleData,
+    getClassesLookupData,
+    serviceDataSelectors.getDefinitionPool,
+    getCharacterPreferences,
+    characterSelectors.getId,
+    characterSelectors.getChoices,
+    getBaseFeats,
+], ClassGenerators.generateBaseCharClasses);
+/**
+ * @returns {Record<number, ClassFeature>}
+ */
+export const getClassFeatureLookup = createSelector([getBaseClasses], ClassGenerators.generateClassFeatureLookup);
+/**
+ * @returns {BaseClassLookup}
+ */
+export const getBaseClassLookup = createSelector([getBaseClasses], ClassGenerators.generateBaseClassLookup);
+/**
+ * @returns {ClassMappingIdLookup}
+ */
+export const getClassMappingIdLookupByActiveId = createSelector([getBaseClasses], ClassGenerators.generateClassMappingIdLookupByActiveId);
+/**
+ * @returns {boolean}
+ */
+export const isMulticlassCharacter = createSelector([getBaseClasses], ClassDerivers.deriveIsMulticlassCharacter);
+/**
+ *
+ */
+export const getInfusionChoices = createSelector([getBaseClasses], InfusionChoiceGenerators.generateAggregatedInfusionChoices);
+/**
+ *
+ */
+export const getAvailableInfusionChoices = createSelector([getInfusionChoices], InfusionChoiceGenerators.generateAvailableInfusionChoices);
+/**
+ *
+ */
+export const getInfusionChoiceLookup = createSelector([getInfusionChoices], InfusionChoiceGenerators.generateInfusionChoiceLookup);
+/**
+ * @returns {number}
+ */
+export const getTotalClassLevel = createSelector([getBaseClasses], ClassGenerators.generateTotalClassLevel);
+/**
+ * @returns {number}
+ */
+export const getCurrentLevel = createSelector([characterSelectors.getCurrentXp, characterSelectors.getPreferences, getTotalClassLevel, getRuleData], CharacterGenerators.generateCurrentLevel);
+/**
+ * @returns {ExperienceInfo}
+ */
+export const getExperienceInfo = createSelector([getTotalClassLevel, getCurrentLevel, characterSelectors.getCurrentXp, getRuleData], CharacterGenerators.generateExperienceInfo);
+/**
+ * @returns {Hack__RaceDataLookups}
+ */
+const getRaceLookupData = createSelector([
+    getRaceOptionLookup,
+    getRaceActionLookup,
+    getRaceChoiceLookup,
+    getRaceModifierLookup,
+    getRaceSpellLookup,
+    getBaseFeatLookup,
+    characterSelectors.getCharacterValueLookup,
+    getSpellListDataOriginLookup,
+], RaceGenerators.generateRaceLookupData);
+/**
+ * @returns {boolean}
+ */
+export const getIsInitialAsiFromFeat = createSelector([characterSelectors.getFeats], FeatGenerators.generateIsInitialAsiFromFeat);
+/**
+ * @returns {Race | null}
+ */
+export const getRace = createSelector([
+    characterSelectors.getRace,
+    getOptionalOrigins,
+    getRaceLookupData,
+    getExperienceInfo,
+    characterEnvSelectors.getContext,
+    getRuleData,
+    serviceDataSelectors.getDefinitionPool,
+    getCharacterPreferences,
+    getIsInitialAsiFromFeat,
+], RaceGenerators.generateRace);
+/**
+ * @returns {Array<Feat>}
+ */
+export const getFeats = createSelector([getBaseFeats, getBaseClasses, getRace, characterSelectors.getBackground, characterSelectors.getChoices_class], FeatGenerators.generateAggregatedFeats);
+/**
+ * All the feats, except those tagged as data origin only.
+ * @returns {Array<Feat>}
+ */
+export const getStandardFeats = createSelector([getFeats], FeatGenerators.generateStandardFeats);
+/**
+ * The feats that are tagged as being paired with a data origin.
+ * For example, the new background ASI feats should only ever be displayed
+ * with the data origin, not with other feats.
+ * @returns {DataOriginFeatLookup}
+ */
+export const getDataOriginOnlyFeatLookup = createSelector([getFeats], FeatGenerators.generateDataOriginPairedFeats);
+/**
+ * @returns {Record<number, Feat>}
+ */
+export const getFeatLookup = createSelector([getFeats], FeatGenerators.generateFeatLookup);
+/**
+ * @returns {Array<number>}
+ */
+export const getGlobalRaceSpellListIds = createSelector([getRace], RaceGenerators.generateGlobalSpellListIds);
+/**
+ * @returns {Array<number>}
+ */
+export const getGlobalBackgroundSpellListIds = createSelector([getBackgroundInfo], BackgroundGenerators.generateGlobalSpellListIds);
+/**
+ * @returns {Array<number>}
+ */
+export const getGlobalSpellListIds = createSelector([getGlobalRaceSpellListIds, getGlobalBackgroundSpellListIds], SpellGenerators.generateGlobalSpellListIds);
+/**
+ * @returns {DecorationInfo}
+ */
+export const getDecorationInfo = createSelector([characterSelectors.getDecorations, characterSelectors.getPreferences], DecorationGenerators.generateDecorationInfo);
+/**
+ * @returns {CharacterTheme}
+ */
+export const getCharacterTheme = createSelector([getDecorationInfo], DecorationAccessors.getCharacterTheme);
+/**
+ * @returns {Record<string, Array<ModifierContract>>}
+ */
+export const getItemModifierLookup = createSelector([characterSelectors.getModifiers_item, serviceDataSelectors.getPartyInfo], ModifierGenerators.generateItemModifierLookup);
+/**
+ * @returns {Record<string, Array<BaseSpellContract>>}
+ */
+export const getItemSpellLookup = createSelector([characterSelectors.getSpells_item, serviceDataSelectors.getPartyInfo], SpellGenerators.generateItemSpellLookup);
+/**
+ * returns all BaseItems from characters inventory
+ * @returns {Array<BaseItem>}
+ */
+const getBaseInventory = createSelector([
+    characterSelectors.getInventory,
+    getItemModifierLookup,
+    getItemSpellLookup,
+    characterSelectors.getCharacterValueLookup,
+    getInventoryInfusionLookup,
+    getRuleData,
+], ItemGenerators.generateBaseItems);
+/**
+ * returns all shared BaseItems from party inventory
+ * @returns {Array<BaseItem>}
+ */
+const getBasePartyInventory = createSelector([
+    serviceDataSelectors.getPartyInfo,
+    getItemModifierLookup,
+    getItemSpellLookup,
+    characterSelectors.getCharacterValueLookup,
+    getInventoryInfusionLookup,
+    getRuleData,
+], CampaignGenerators.generateBasePartyInventory);
+/**
+ * returns all BaseItems from all Inventories
+ * @returns {Array<BaseItem>}
+ */
+const getAllBaseInventory = createSelector([getBaseInventory, getBasePartyInventory], (getBaseInventory, getBasePartyInventory) => [...getBaseInventory, ...getBasePartyInventory]);
+/**
+ * returns all BaseItems equipped to current character
+ * @returns {Array<BaseItem>}
+ */
+const getEquippedBaseItems = createSelector([getAllBaseInventory, characterSelectors.getId], ItemGenerators.generateEquippedItems);
+/**
+ * @returns {SizeContract | null}
+ */
+export const getSize = createSelector([getRace], CharacterGenerators.generateSize);
+/**
+ * @returns {WeightSpeedContract | null}
+ */
+export const getWeightSpeeds = createSelector([getRace], CharacterGenerators.generateWeightSpeeds);
+/**
+ * @returns {AlignmentContract | null}
+ */
+export const getAlignment = createSelector([characterSelectors.getAlignmentId, getRuleData], CharacterGenerators.generateAlignment);
+/**
+ * @returns {CharacterLifestyleContract | null}
+ */
+export const getLifestyle = createSelector([characterSelectors.getLifestyleId, getRuleData], CharacterGenerators.generateLifestyle);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getRaceModifiers = createSelector([getRace], RaceGenerators.generateRaceModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getClassesModifiers = createSelector([getBaseClasses, isMulticlassCharacter], ClassGenerators.generateClassesModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getFeatModifiers = createSelector([getBaseFeats], FeatGenerators.generateFeatModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getBackgroundModifiers = createSelector([getBackgroundInfo], BackgroundGenerators.generateBackgroundModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getValidEquipmentModifiers = createSelector([getEquippedBaseItems], ItemGenerators.generateValidEquipmentModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getMiscModifiers = createSelector([getValidEquipmentModifiers, getFeatModifiers, getBackgroundModifiers], ModifierGenerators.generateMiscModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getConditionModifiers = createSelector([getActiveConditions], ConditionGenerators.generateConditionModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getValidGlobalModifiers = createSelector([
+    getRaceModifiers,
+    getClassesModifiers,
+    getFeatModifiers,
+    getBackgroundModifiers,
+    getValidEquipmentModifiers,
+    getConditionModifiers,
+], ModifierGenerators.generateValidGlobalModifiers);
+/**
+ * @returns {DeathSaveInfo}
+ */
+export const getDeathSaveInfo = createSelector([characterSelectors.getDeathSaves, getValidGlobalModifiers], CharacterGenerators.generateDeathSaveInfo);
+/**
+ * @returns {Record<string, number>}
+ */
+export const getProficiencyLookup = createSelector([characterSelectors.getCharacterValueLookupByType, getValidGlobalModifiers], CharacterGenerators.generateProficiencyLookup);
+/**
+ * @returns {number}
+ */
+export const getProficiencyBonus = createSelector([getCurrentLevel, getValidGlobalModifiers, getRuleData], CharacterGenerators.generateProficiencyBonus);
+/**
+ * @returns {number}
+ */
+export const getAttunedItemCountMax = createSelector([getRuleData, getValidGlobalModifiers], ItemGenerators.generateAttunedItemCountMax);
+/**
+ * @returns {Array<BaseItem>}
+ */
+const getAttunedBaseItems = createSelector([getEquippedBaseItems, getAttunedItemCountMax], ItemGenerators.generateEquippedAttunedItems);
+/**
+ * @returns {ModifierData}
+ */
+const getModifierDataPreAbilities = createSelector([getProficiencyBonus, getAttunedBaseItems], ModifierGenerators.generateModifierDataPreAbilities);
+/**
+ * @returns {Array<Ability>}
+ */
+export const getAbilities = createSelector([
+    characterSelectors.getStats,
+    characterSelectors.getBonusStats,
+    characterSelectors.getOverrideStats,
+    getRaceModifiers,
+    getClassesModifiers,
+    getMiscModifiers,
+    getValidGlobalModifiers,
+    getProficiencyBonus,
+    getModifierDataPreAbilities,
+    getRuleData,
+    characterSelectors.getCharacterValueLookup,
+], AbilityGenerators.generateAbilities);
+/**
+ * @returns {Array<RacialTrait>}
+ */
+export const getCurrentLevelRacialTraits = createSelector([getRace, getTotalClassLevel], RaceGenerators.generateCurrentLevelRacialTraits);
+/**
+ * @returns {Record<number, Ability>}
+ */
+export const getAbilityLookup = createSelector([getAbilities], AbilityGenerators.generateAbilityLookup);
+/**
+ * @returns {Record<string, Ability>}
+ */
+export const getAbilityKeyLookup = createSelector([getAbilities], AbilityGenerators.generateAbilityKeyLookup);
+/**
+ * @returns {PrerequisiteData}
+ */
+export const getPrerequisiteData = createSelector([
+    getRace,
+    getProficiencyLookup,
+    getAbilityLookup,
+    getCurrentLevel,
+    getBaseClassLookup,
+    getFeatLookup,
+    getClassFeatureLookup,
+], PrerequisiteGenerators.generatePrerequisiteData);
+/**
+ * @returns {number}
+ */
+export const getDexModifier = createSelector([getAbilityLookup], ModifierGenerators.generateDexModifier);
+/**
+ * @returns {number}
+ */
+export const getConModifier = createSelector([getAbilityLookup], ModifierGenerators.generateConModifier);
+/**
+ * @returns {number}
+ */
+export const getStrScore = createSelector([getAbilityLookup], ModifierGenerators.generateStrScore);
+/**
+ * @returns {ModifierData}
+ */
+export const getModifierData = createSelector([getAbilityLookup, getModifierDataPreAbilities, getAttunedBaseItems], ModifierGenerators.generateModifierData);
+/**
+ * @returns {Record<number, ClassSpellcasterInfo>}
+ */
+export const getClassSpellInfoLookup = createSelector([getBaseClasses, getRuleData, getProficiencyBonus, getValidGlobalModifiers, getAbilityLookup], ClassGenerators.generateClassSpellInfoLookup);
+/**
+ * @returns {OverallSpellInfo}
+ */
+export const getOverallSpellInfo = createSelector([getValidGlobalModifiers, getExperienceInfo, getProficiencyBonus, getAbilityLookup, getSpellListDataOriginLookup], CharacterGenerators.generateOverallSpellInfo);
+/**
+ * @returns {Array<CharClass>}
+ */
+export const getClasses = createSelector([
+    getBaseClasses,
+    getClassSpellInfoLookup,
+    getOverallSpellInfo,
+    getSpellListDataOriginLookup,
+    characterSelectors.getCharacterValueLookup,
+    getRuleData,
+    getModifierData,
+], ClassGenerators.generateCharClasses);
+/**
+ *
+ */
+export const getClassSpellListSpellsLookup = createSelector([getClasses], ClassGenerators.generateClassSpellListSpellsLookup);
+/**
+ * @returns {CharClass | null}
+ */
+export const getStartingClass = createSelector([getClasses], ClassGenerators.generateStartingClass);
+/**
+ * @returns {Array<CreatureRule>}
+ */
+export const getClassCreatureRules = createSelector([getClasses, getExperienceInfo, getRuleData], ClassFeatureGenerators.generateClassCreatureRules);
+/**
+ * @returns {Array<CreatureRule>}
+ */
+export const getRaceCreatureRules = createSelector([getRace, getExperienceInfo, getRuleData], RaceGenerators.generateRaceCreatureRules);
+/**
+ * @returns {Array<CreatureRule>}
+ */
+export const getFeatCreatureRules = createSelector([getFeats, getExperienceInfo, getRuleData], FeatGenerators.generateFeatCreatureRules);
+/**
+ * @returns {Array<CreatureRule>}
+ */
+export const getCreatureRules = createSelector([getClassCreatureRules, getRaceCreatureRules, getFeatCreatureRules], CreatureRuleGenerators.generateCreatureRules);
+/**
+ * @returns {Record<number, Array<CreatureRule>>}
+ */
+export const getCreatureGroupRulesLookup = createSelector([getCreatureRules], CreatureRuleGenerators.generateCreatureGroupRulesLookup);
+/**
+ * @returns {LevelScaleContract | null}
+ */
+export const getMartialArtsLevelScale = createSelector([getClasses, getEquippedBaseItems], CharacterGenerators.generateMartialArtsLevelScale);
+/**
+ * @returns {Array<DataOriginBaseAction>}
+ */
+export const getInnateNaturalActions = createSelector([getRuleData, characterSelectors.getCharacterValueLookup], ActionGenerators.generateInnateBaseActions);
+/**
+ * @returns {Array<CustomProficiencyContract>}
+ */
+export const getCustomSkillProficiencies = createSelector([characterSelectors.getCustomProficiencies], CharacterGenerators.generateCustomSkillProficiencies);
+/**
+ * @returns {Array<string>}
+ */
+export const getLanguages = createSelector([getValidGlobalModifiers], CharacterGenerators.generateLanguages);
+/**
+ * @returns {number | null}
+ */
+export const getOverridePassivePerception = createSelector([characterSelectors.getCharacterValueLookup], ValueUtils.getOverridePassivePerceptionValue);
+/**
+ * @returns {number | null}
+ */
+export const getOverridePassiveInvestigation = createSelector([characterSelectors.getCharacterValueLookup], ValueUtils.getOverridePassiveInvestigationValue);
+/**
+ * @returns {number | null}
+ */
+export const getOverridePassiveInsight = createSelector([characterSelectors.getCharacterValueLookup], ValueUtils.getOverridePassiveInsightValue);
+/**
+ * @returns {number}
+ */
+export const getProcessedInitiative = createSelector([getValidGlobalModifiers, getAbilityLookup, getProficiencyBonus], CharacterGenerators.getInitiative);
+/**
+ * @returns {boolean}
+ */
+export const getHasInitiativeAdvantage = createSelector([getValidGlobalModifiers], CharacterGenerators.generateHasInitiativeAdvantage);
+/**
+ * @returns {number}
+ */
+export const getStaticInitiative = createSelector([getProcessedInitiative, ruleDataSelectors.getInitiativeScore], CharacterGenerators.getStaticInitiative);
+/**
+ * @returns {boolean}
+ */
+export const getDedicatedWeaponEnabled = createSelector([getClasses], ClassGenerators.generateDedicatedWeaponEnabled);
+/**
+ * @returns {boolean}
+ */
+export const getHexWeaponEnabled = createSelector([getClasses], ClassGenerators.generateHexWeaponEnabled);
+/**
+ * @returns {boolean}
+ */
+export const getPactWeaponEnabled = createSelector([getClasses], ClassGenerators.generatePactWeaponEnabled);
+/**
+ * @returns {boolean}
+ */
+export const getImprovedPactWeaponEnabled = createSelector([getClasses], ClassGenerators.generateImprovedPactWeaponEnabled);
+/**
+ * TODO: add return here
+ */
+export const hack__getSpecialWeaponPropertiesEnabled = createSelector([getHexWeaponEnabled, getPactWeaponEnabled, getImprovedPactWeaponEnabled, getDedicatedWeaponEnabled], CharacterHacks.hack__generateSpecialWeaponPropertiesEnabled);
+/**
+ * TODO v5.1: should be able to remove this selector and all usages after mobile can support customItems as Items
+ * @returns {Array<Item>}
+ */
+export const getCustomItems = createSelector([characterSelectors.getCustomItems, getRuleData, characterSelectors.getId], ItemGenerators.generateCustomItems);
+/**
+ * returns Items in characters inventory
+ * @returns {Array<Item>}
+ */
+export const getInventory = createSelector([
+    getBaseInventory,
+    getAbilityLookup,
+    getProficiencyBonus,
+    getValidGlobalModifiers,
+    characterSelectors.getCharacterValueLookupByEntity,
+    characterSelectors.getCharacterValueLookupByType,
+    characterSelectors.getCharacterValueLookup,
+    getMartialArtsLevelScale,
+    getRuleData,
+    hack__getSpecialWeaponPropertiesEnabled,
+], ItemGenerators.generateItems);
+/**
+ * returns Items in party inventory
+ * @returns {Array<Item>}
+ */
+export const getPartyInventory = createSelector([
+    getBasePartyInventory,
+    getAbilityLookup,
+    getProficiencyBonus,
+    getValidGlobalModifiers,
+    characterSelectors.getCharacterValueLookupByEntity,
+    characterSelectors.getCharacterValueLookupByType,
+    characterSelectors.getCharacterValueLookup,
+    getMartialArtsLevelScale,
+    getRuleData,
+    hack__getSpecialWeaponPropertiesEnabled,
+], ItemGenerators.generateItems);
+/**
+ * returns all Items in all inventories
+ * @returns {Array<Item>}
+ */
+export const getAllInventoryItems = createSelector([getInventory, getPartyInventory], (getInventory, getPartyInventory) => [...getInventory, ...getPartyInventory]);
+/**
+ *
+ */
+export const getInventoryLookup = createSelector([getInventory], ItemGenerators.generateInventoryLookup);
+/**
+ *
+ */
+export const getPartyInventoryLookup = createSelector([getPartyInventory], ItemGenerators.generateInventoryLookup);
+/**
+ * TODO v5.1: remove customItems from this selector when mobile moves up to 5.1 customItems as Items
+ * @returns {Array<Container>}
+ */
+export const getInventoryContainers = createSelector([
+    getInventory,
+    getCustomItems,
+    characterSelectors.getId,
+    serviceDataSelectors.getPartyInfo,
+    getPartyInventory,
+    featureFlagInfoSelectors.getFeatureFlagInfo,
+    characterSelectors.getCurrencies,
+    characterSelectors.getPreferences,
+    getRuleData,
+], ContainerGenerators.generateContainers);
+export const getCharacterInventoryContainers = createSelector([getInventoryContainers], ContainerGenerators.generateCharacterContainers);
+export const getPartyInventoryContainers = createSelector([getInventoryContainers], ContainerGenerators.generatePartyContainers);
+/**
+ * @returns {ContainerLookup}
+ */
+export const getContainerLookup = createSelector([getInventoryContainers], ContainerGenerators.generateContainerLookup);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getProficiencyModifiers = createSelector([getValidGlobalModifiers], ModifierGenerators.generateProficiencyModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getExpertiseModifiers = createSelector([getValidGlobalModifiers], ModifierGenerators.generateExpertiseModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getUniqueProficiencyModifiers = createSelector([getProficiencyModifiers], ModifierGenerators.generateUniqueProficiencyModifiers);
+/**
+ * returns all items equipped to current character from both inventory and party inventory
+ * @returns {Array<Item>}
+ */
+export const getEquippedItems = createSelector([getAllInventoryItems, characterSelectors.getId], ItemGenerators.generateEquippedItems);
+/**
+ * @returns {ArmorItemArmorClass | null}
+ */
+export const getHighestAcEquippedArmor = createSelector([getEquippedItems, getDexModifier, getValidGlobalModifiers, getAbilityLookup, getRuleData], CharacterGenerators.generateHighestAcEquippedArmor);
+/**
+ * @returns {ArmorItemArmorClass | null}
+ */
+export const getHighestAcEquippedShield = createSelector([getEquippedItems, getDexModifier, getValidGlobalModifiers, getAbilityLookup, getRuleData], CharacterGenerators.generateHighestAcEquippedShield);
+/**
+ * @returns {Array<Skill>}
+ */
+export const getCustomSkills = createSelector([getCustomSkillProficiencies, getProficiencyBonus, getAbilityLookup, getValidGlobalModifiers, getEquippedItems], SkillGenerators.generateCustomSkills);
+/**
+ * @returns {Array<Skill>}
+ */
+export const getSkills = createSelector([
+    getAbilityLookup,
+    getValidGlobalModifiers,
+    getProficiencyBonus,
+    getRuleData,
+    characterSelectors.getCharacterValueLookup,
+    getEquippedItems,
+], SkillGenerators.generateSkills);
+/**
+ * @returns {Record<number, Skill>}
+ */
+export const getSkillLookup = createSelector([getSkills], SkillGenerators.generateSkillLookup);
+/**
+ * @returns {number | null}
+ */
+export const getPassivePerception = createSelector([getSkills, getValidGlobalModifiers, getAbilityLookup, getOverridePassivePerception], CharacterGenerators.generatePassivePerception);
+/**
+ * @returns {number | null}
+ */
+export const getPassiveInvestigation = createSelector([getSkills, getValidGlobalModifiers, getAbilityLookup, getOverridePassiveInvestigation], CharacterGenerators.generatePassiveInvestigation);
+/**
+ * @returns {number | null}
+ */
+export const getPassiveInsight = createSelector([getSkills, getValidGlobalModifiers, getAbilityLookup, getOverridePassiveInsight], CharacterGenerators.generatePassiveInsight);
+/**
+ * note - inventory here is only to check for infusion actions,
+ *        item attacks are added in getAttacks selector
+ * @returns {Array<Action>}
+ */
+export const getActions = createSelector([
+    getFeats,
+    getRace,
+    getClasses,
+    getInnateNaturalActions,
+    getInventory,
+    getProficiencyBonus,
+    getAbilityLookup,
+    getValidGlobalModifiers,
+    getMartialArtsLevelScale,
+    getRuleData,
+    getModifierData,
+    characterSelectors.getCharacterValueLookup,
+], ActionGenerators.generateAggregatedActions);
+/**
+ * @returns {ActionLookup}
+ */
+export const getActionLookup = createSelector([getActions], ActionGenerators.generateActionLookup);
+/**
+ * @returns {ArmorClassAdjustments}
+ */
+export const getAcAdjustments = createSelector([characterSelectors.getCharacterValueLookup], CharacterGenerators.generateArmorClassAdjustments);
+/**
+ * @returns {Array<ArmorClassSupplier>}
+ */
+export const getArmorClassSuppliers = createSelector([
+    getHighestAcEquippedArmor,
+    getHighestAcEquippedShield,
+    getValidGlobalModifiers,
+    getAbilityLookup,
+    getEquippedItems,
+    characterSelectors.getCharacterValueLookup,
+    getRuleData,
+    getModifierData,
+], CharacterGenerators.generateArmorClassSuppliers);
+/**
+ * @returns {number}
+ */
+export const getAcTotal = createSelector([getArmorClassSuppliers, getAcAdjustments], CharacterGenerators.generateArmorClassTotal);
+/**
+ * @returns {number}
+ */
+export const getCarryCapacity = createSelector([getStrScore, getSize, getValidGlobalModifiers], CharacterUtils.getCarryCapacity);
+/**
+ * @returns {number}
+ */
+export const getPushDragLiftWeight = createSelector([getCarryCapacity], CharacterUtils.getPushDragLiftWeight);
+/**
+ * @returns {number}
+ */
+export const getEncumberedWeight = createSelector([getStrScore, getSize, getValidGlobalModifiers], CharacterUtils.getEncumberedWeight);
+/**
+ * @returns {number}
+ */
+export const getHeavilyEncumberedWeight = createSelector([getStrScore, getSize, getValidGlobalModifiers], CharacterUtils.getHeavilyEncumberedWeight);
+/**
+ * @returns {number}
+ * @deprecated move to getCointainerCoinWeight
+ */
+export const getCoinWeight = createSelector([characterSelectors.getCurrencies, characterSelectors.getPreferences, getRuleData], CharacterGenerators.generateCoinWeight);
+/**
+ * @returns {number}
+ * @deprecated move to getContainerItemWeight
+ */
+export const getItemWeight = createSelector([getInventory, getCustomItems], CharacterGenerators.generateItemWeight);
+/**
+ * @returns {number}
+ */
+export const getContainerItemWeight = createSelector([getCharacterInventoryContainers, getPartyInventoryContainers, characterSelectors.getId], CharacterGenerators.generateContainerItemWeight);
+/**
+ * @returns {number}
+ */
+export const getCointainerCoinWeight = createSelector([
+    getCharacterInventoryContainers,
+    getPartyInventoryContainers,
+    characterSelectors.getId,
+    characterSelectors.getPreferences,
+], CharacterGenerators.generateCointainerCoinWeight);
+/**
+ * @returns {number}
+ * @deprecated move to getTotalCarriedWeight
+ */
+export const getTotalWeight = createSelector([getItemWeight, getCoinWeight], CharacterGenerators.generateTotalWeight);
+/**
+ * @returns {number}
+ */
+export const getTotalCarriedWeight = createSelector([getContainerItemWeight, getCointainerCoinWeight], CharacterGenerators.generateTotalWeight);
+/**
+ * @returns {number}
+ */
+export const getArmorSpeedAdjustmentAmount = createSelector([getEquippedItems, getStrScore, getCharacterPreferences, getValidGlobalModifiers], ItemDerivers.deriveArmorSpeedAdjustmentAmount);
+/**
+ * @returns {WeightSpeedTypeEnum}
+ * @deprecated move to getCurrentCarriedWeightType
+ */
+export const getCurrentWeightType = createSelector([getTotalWeight, getStrScore, getSize, characterSelectors.getPreferences, getValidGlobalModifiers], CharacterDerivers.deriveCurrentWeightSpeedType);
+/**
+ * @returns {WeightSpeedTypeEnum}
+ */
+export const getCurrentCarriedWeightType = createSelector([getTotalCarriedWeight, getStrScore, getSize, characterSelectors.getPreferences, getValidGlobalModifiers], CharacterDerivers.deriveCurrentWeightSpeedType);
+/**
+ * @returns {SpeedInfo}
+ * @deprecated move to getCurrentCarriedWeightSpeed
+ */
+export const getCurrentWeightSpeed = createSelector([
+    getWeightSpeeds,
+    getCurrentWeightType,
+    getArmorSpeedAdjustmentAmount,
+    getValidGlobalModifiers,
+    characterSelectors.getCustomSpeedLookup,
+    getHighestAcEquippedArmor,
+], CharacterGenerators.generateSpeedInfo);
+/**
+ * @returns {SpeedInfo}
+ */
+export const getCurrentCarriedWeightSpeed = createSelector([
+    getWeightSpeeds,
+    getCurrentCarriedWeightType,
+    getArmorSpeedAdjustmentAmount,
+    getValidGlobalModifiers,
+    characterSelectors.getCustomSpeedLookup,
+    getHighestAcEquippedArmor,
+], CharacterGenerators.generateSpeedInfo);
+/**
+ * @returns {Array<Speed>}
+ */
+export const getSpeeds = createSelector([getCurrentCarriedWeightSpeed, characterSelectors.getCustomSpeedLookup, getRuleData], CharacterGenerators.generateSpeeds);
+/**
+ * @returns {Array<Item>}
+ */
+export const getAttunedItems = createSelector([getEquippedItems, getAttunedItemCountMax], ItemGenerators.generateEquippedAttunedItems);
+/**
+ * @returns {boolean}
+ */
+export const hasMaxAttunedItems = createSelector([getAttunedItems, getAttunedItemCountMax], ItemGenerators.generateHasMaxAttunedItems);
+/**
+ * @returns {Array<Item | null>}
+ */
+export const getAttunedSlots = createSelector([getAttunedItems, getAttunedItemCountMax], ItemUtils.getAttunedSlots);
+/**
+ * @returns {Array<Spell>}
+ */
+export const getCharacterSpells = createSelector([
+    getValidGlobalModifiers,
+    getAllInventoryItems,
+    getFeats,
+    getRace,
+    getClasses,
+    getProficiencyBonus,
+    getAbilityLookup,
+    getClassSpellInfoLookup,
+    getOverallSpellInfo,
+    characterSelectors.getCharacterValueLookup,
+    getRuleData,
+    getModifierData,
+], SpellGenerators.generateCharacterSpells);
+/**
+ * @returns {Array<Spell>}
+ */
+export const getActiveCharacterSpells = createSelector([getCharacterSpells, getInventoryInfusionLookup, characterSelectors.getId], SpellGenerators.generateActiveCharacterSpells);
+/**
+ * @returns {Array<CharClass>}
+ */
+export const getSpellcastingClasses = createSelector([getClasses], ClassGenerators.generateSpellcastingClasses);
+/**
+ * @returns {Array<CharClass>}
+ */
+export const getPactMagicClasses = createSelector([getClasses], ClassGenerators.generatePactMagicClasses);
+/**
+ * @returns {Array<SpellSlotContract>}
+ */
+export const getPactMagicSlots = createSelector([getPactMagicClasses, characterSelectors.getPactMagicSlots, getRuleData], SpellDerivers.derivePactMagicSlotsInfo);
+/**
+ * @returns {Array<SpellSlotContract>}
+ */
+export const getSpellSlots = createSelector([getSpellcastingClasses, characterSelectors.getSpellSlots, getRuleData], SpellDerivers.deriveSpellSlotsInfo);
+/**
+ * @returns {Array<SpellSlotInfo>}
+ */
+export const getCombinedSpellSlots = createSelector([getSpellSlots, getPactMagicSlots, getRuleData], SpellDerivers.deriveCombinedSpellSlotsInfo);
+/**
+ * @returns {number}
+ */
+export const getMaxSpellSlotLevel = createSelector([getSpellSlots], SpellGenerators.generateMaxSpellSlotLevel);
+/**
+ * @returns {number}
+ */
+export const getMaxPactMagicSlotLevel = createSelector([getPactMagicSlots], SpellGenerators.generateMaxSpellSlotLevel);
+/**
+ * @returns {number}
+ */
+export const getCombinedMaxSpellSlotLevel = createSelector([getMaxSpellSlotLevel, getMaxPactMagicSlotLevel], SpellGenerators.generateCombinedMaxSpellSlotLevel);
+/**
+ * @returns {Array<number>}
+ */
+export const getAvailableSpellSlotLevels = createSelector([getSpellSlots], SpellGenerators.generateAvailableSpellSlotLevels);
+/**
+ * @returns {Array<number>}
+ */
+export const getAvailablePactMagicSlotLevels = createSelector([getPactMagicSlots], SpellGenerators.generateAvailableSpellSlotLevels);
+/**
+ * @returns {Array<number>}
+ */
+export const getCastableSpellSlotLevels = createSelector([getSpellSlots], SpellGenerators.generateCastableSpellSlotLevels);
+/**
+ * @returns {Array<number>}
+ */
+export const getCastablePactMagicSlotLevels = createSelector([getPactMagicSlots], SpellGenerators.generateCastableSpellSlotLevels);
+/**
+ * @return {Array<CharClass>}
+ */
+export const getSpellClasses = createSelector([getSpellcastingClasses, getPactMagicClasses], ClassGenerators.generateAggregatedSpellClasses);
+/**
+ * @returns {Array<ClassSpellInfo>}
+ */
+export const getClassSpellLists = createSelector([getTotalClassLevel, getSpellClasses, getAbilityLookup, getProficiencyBonus, getValidGlobalModifiers], SpellGenerators.generateClassSpellLists);
+/**
+ * @returns {Array<Spell>}
+ */
+export const getClassSpells = createSelector([getSpellClasses], SpellGenerators.generateClassSpells);
+/**
+ * @returns {Array<Spell>}
+ */
+export const getActiveClassSpells = createSelector([getClassSpells], SpellGenerators.generateActiveClassSpells);
+/**
+ * return all active spell attacks for getAttacks
+ * @returns {Array<Spell>}
+ */
+export const getActiveSpellAttackList = createSelector([getClassSpellLists, getActiveCharacterSpells], SpellGenerators.generateActiveSpellAttackList);
+/**
+ * @returns {Array<WeaponSpellDamageGroup>}
+ */
+export const getWeaponSpellDamageGroups = createSelector([getActiveClassSpells, getActiveCharacterSpells, getExperienceInfo], SpellGenerators.generateWeaponSpellDamageGroups);
+/**
+ * returns all equipped, weapon behavior Gear Items - used in getItemAttacks
+ * @returns {Array<Item>}
+ */
+export const getGearWeaponItems = createSelector([
+    getAllBaseInventory,
+    getAbilityLookup,
+    getProficiencyBonus,
+    getValidGlobalModifiers,
+    characterSelectors.getCharacterValueLookupByEntity,
+    characterSelectors.getCharacterValueLookupByType,
+    characterSelectors.getCharacterValueLookup,
+    getMartialArtsLevelScale,
+    getRuleData,
+    hack__getSpecialWeaponPropertiesEnabled,
+    characterSelectors.getId,
+], ItemGenerators.generateGearWeaponItems);
+/**
+ * returns all Gear and Weapon items with attacks or marked display as attack
+ * @returns {Array<Item>}
+ */
+export const getItemAttacks = createSelector([getEquippedItems, getGearWeaponItems], ItemGenerators.generateOrderedItemAttacks);
+/**
+ * @returns {SpellCasterInfo}
+ */
+export const getSpellCasterInfo = createSelector([
+    getClasses,
+    getTotalClassLevel,
+    getSpellSlots,
+    getPactMagicSlots,
+    getCastableSpellSlotLevels,
+    getCastablePactMagicSlotLevels,
+    getAvailableSpellSlotLevels,
+    getAvailablePactMagicSlotLevels,
+    getCombinedMaxSpellSlotLevel,
+    getAbilityLookup,
+    getClassSpellInfoLookup,
+], CharacterGenerators.generateSpellCasterInfo);
+/**
+ * @returns {Array<Action>}
+ */
+export const getCustomActions = createSelector([
+    characterSelectors.getCustomActions,
+    getProficiencyBonus,
+    getAbilityLookup,
+    characterSelectors.getCharacterValueLookup,
+    getValidGlobalModifiers,
+    getMartialArtsLevelScale,
+    getRuleData,
+    getModifierData,
+], ActionGenerators.generateCustomActions);
+/**
+ * @returns {Array<Activatable>}
+ */
+export const getActivatables = createSelector([
+    getActiveCharacterSpells,
+    getActiveClassSpells,
+    getClasses,
+    getRace,
+    getBaseFeats,
+    getInnateNaturalActions,
+    getCustomActions,
+    getEquippedItems,
+], CharacterGenerators.generateActivatables);
+/**
+ * @returns {Array<Spell>}
+ */
+export const getRitualSpells = createSelector([getActiveCharacterSpells, getClassSpells], SpellGenerators.generateRitualSpells);
+/**
+ * @returns {Array<Array<ScaledSpell>>}
+ */
+export const getLevelSpells = createSelector([
+    getExperienceInfo,
+    getClassSpells,
+    getActiveCharacterSpells,
+    getProficiencyBonus,
+    getSpellCasterInfo,
+    getRuleData,
+    getCharacterPreferences,
+    getAbilityLookup,
+], SpellGenerators.generateLevelSpells);
+/**
+ * https://github.com/reduxjs/reselect/issues/378
+ */
+const hack__getHitPointParts = createSelector([
+    characterSelectors.getBaseHp,
+    characterSelectors.getOverrideHp,
+    characterSelectors.getBonusHp,
+    characterSelectors.getTempHp,
+    characterSelectors.getRemovedHp,
+], CharacterHacks.hack__generateHitPointParts);
+/**
+ * @returns {CharacterHitPointInfo}
+ */
+export const getHitPointInfo = createSelector([
+    hack__getHitPointParts,
+    getTotalClassLevel,
+    getClasses,
+    getAbilityLookup,
+    getRaceModifiers,
+    getClassesModifiers,
+    getMiscModifiers,
+    getValidGlobalModifiers,
+    characterSelectors.getPreferences,
+    getRuleData,
+], CharacterGenerators.generateHitPointInfo);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getLanguageModifiers = createSelector([getValidGlobalModifiers], ModifierGenerators.generateLanguageModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getKenseiModifiers = createSelector([getValidGlobalModifiers], ModifierGenerators.generateKenseiModifiers);
+/**
+ * @returns {Array<ProtectionSupplier>}
+ */
+export const getProtectionSuppliers = createSelector([
+    getClasses,
+    getRace,
+    getFeats,
+    getAllInventoryItems,
+    getModifierData,
+    getAbilityLookup,
+    getRuleData,
+    getProficiencyBonus,
+    characterSelectors.getId,
+], CharacterGenerators.generateProtectionSuppliers);
+/**
+ * @returns {CreatureOwnerData}
+ */
+export const getCreatureOwnerData = createSelector([getClasses, getSkillLookup, getProficiencyBonus, getAbilityLookup, getPassivePerception], CreatureGenerators.generateCreatureOwnerData);
+/**
+ * @returns {Array<Creature>}
+ */
+export const getCreatures = createSelector([
+    characterSelectors.getCreatures,
+    getCreatureOwnerData,
+    characterSelectors.getCharacterValueLookup,
+    getCreatureInfusionLookup,
+    getRuleData,
+], CreatureGenerators.generateCreatures);
+/**
+ * @returns {CreatureLookup}
+ */
+export const getCreatureLookup = createSelector([getCreatures], CreatureGenerators.generateCreatureLookup);
+/**
+ *
+ */
+export const getVehicleComponentLookup = createSelector([serviceDataSelectors.getVehicleComponentMappings], VehicleComponentGenerators.generateVehicleComponentLookup);
+/**
+ *
+ */
+export const getVehicles = createSelector([
+    serviceDataSelectors.getVehicleMappings,
+    getVehicleComponentLookup,
+    serviceDataSelectors.getDefinitionPool,
+    getRuleData,
+], VehicleGenerators.generateVehicles);
+/**
+ *
+ */
+export const getVehicleLookup = createSelector([getVehicles], VehicleGenerators.generateVehicleLookup);
+/**
+ * @returns {ChoiceData}
+ */
+export const getChoiceInfo = createSelector([
+    getProficiencyModifiers,
+    getExpertiseModifiers,
+    getLanguageModifiers,
+    getKenseiModifiers,
+    getAbilityLookup,
+    getClassSpellLists,
+], ChoiceGenerators.generateChoiceData);
+/**
+ * @returns {Array<DamageAdjustmentContract>}
+ */
+export const getResistanceData = createSelector([getRuleData], CharacterGenerators.generateResistanceData);
+/**
+ * @returns {Array<DamageAdjustmentContract>}
+ */
+export const getVulnerabilityData = createSelector([getRuleData], CharacterGenerators.generateVulnerabilityData);
+/**
+ * @returns {Array<DamageAdjustmentContract>}
+ */
+export const getDamageImmunityData = createSelector([getRuleData], CharacterGenerators.generateImmunityData);
+/**
+ * @returns {Array<ConditionContract>}
+ */
+export const getConditionImmunityData = createSelector([getRuleData], RuleDataAccessors.getConditions);
+/**
+ * @returns {DeathCauseEnum}
+ */
+export const getDeathCause = createSelector([characterSelectors.getDeathSaves, getValidGlobalModifiers, getRuleData], CharacterGenerators.generateDeathCause);
+/**
+ * @returns {boolean}
+ */
+export const isDead = createSelector([getDeathCause], CharacterGenerators.generateIsDead);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getValidResistanceModifiers = createSelector([getValidGlobalModifiers], ModifierGenerators.generateResistanceModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getValidImmunityModifiers = createSelector([getValidGlobalModifiers], ModifierGenerators.generateImmunityModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getValidVulnerabilityModifiers = createSelector([getValidGlobalModifiers], ModifierGenerators.generateVulnerabilityModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getBonusSavingThrowModifiers = createSelector([getValidGlobalModifiers, getModifierData, getRuleData], ModifierGenerators.generateBonusSavingThrowModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getRestrictedBonusSavingThrowModifiers = createSelector([getBonusSavingThrowModifiers], ModifierGenerators.generateRestrictedBonusSavingThrowModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getAdvantageSavingThrowModifiers = createSelector([getValidGlobalModifiers, getRuleData], ModifierGenerators.generateAdvantageSavingThrowModifiers);
+/**
+ * @returns {Array<Modifier>}
+ */
+export const getDisadvantageSavingThrowModifiers = createSelector([getValidGlobalModifiers, getEquippedItems, getRuleData], ModifierGenerators.generateDisadvantageSavingThrowModifiers);
+/**
+ * @returns {Array<SituationalSavingThrowInfo>}
+ */
+export const getSituationalBonusSavingThrows = createSelector([getHighestAcEquippedShield, getValidGlobalModifiers, getRuleData], CharacterGenerators.generateSituationalBonusSavingThrows);
+/**
+ * @returns {Record<number, Array<SituationalSavingThrowInfo>>}
+ */
+export const getSituationalBonusSavingThrowsLookup = createSelector([getSituationalBonusSavingThrows], CharacterGenerators.generateSituationalBonusSavingThrowsLookup);
+/**
+ * @returns {Array<DiceAdjustment>}
+ */
+export const getSavingThrowDiceAdjustments = createSelector([getBonusSavingThrowModifiers, getAdvantageSavingThrowModifiers, getDisadvantageSavingThrowModifiers], DiceGenerators.generateSavingThrowDiceAdjustments);
+/**
+ * @returns {Array<CustomDamageAdjustment>}
+ */
+export const getCustomDamageAdjustments = createSelector([characterSelectors.getCustomDefenseAdjustments, getRuleData], CharacterGenerators.generateCustomDamageAdjustments);
+/**
+ * @returns {Array<CustomConditionAdjustment>}
+ */
+export const getCustomConditionAdjustments = createSelector([characterSelectors.getCustomDefenseAdjustments, getRuleData], CharacterGenerators.generateCustomConditionAdjustments);
+/**
+ * @returns {Array<CustomDamageAdjustment>}
+ */
+export const getCustomResistanceDamageAdjustments = createSelector([getCustomDamageAdjustments], CharacterGenerators.generateCustomResistanceDamageAdjustments);
+/**
+ * @returns {Array<CustomDamageAdjustment>}
+ */
+export const getCustomImmunityDamageAdjustments = createSelector([getCustomDamageAdjustments], CharacterGenerators.generateCustomImmunityDamageAdjustments);
+/**
+ * @returns {Array<CustomDamageAdjustment>}
+ */
+export const getCustomVulnerabilityDamageAdjustments = createSelector([getCustomDamageAdjustments], CharacterGenerators.generateCustomVulnerabilityDamageAdjustments);
+/**
+ * @returns {Array<DefenseAdjustment>}
+ */
+export const getActiveResistances = createSelector([getCustomResistanceDamageAdjustments, getValidResistanceModifiers, getRuleData], CharacterGenerators.generateActiveResistances);
+/**
+ * @returns {Array<DefenseAdjustment>}
+ */
+export const getActiveImmunities = createSelector([getCustomImmunityDamageAdjustments, getCustomConditionAdjustments, getValidImmunityModifiers, getRuleData], CharacterGenerators.generateActiveImmunities);
+/**
+ * @returns {Array<DefenseAdjustment>}
+ */
+export const getActiveVulnerabilities = createSelector([getCustomVulnerabilityDamageAdjustments, getValidVulnerabilityModifiers, getRuleData], CharacterGenerators.generateActiveVulnerabilities);
+/**
+ * @returns {Array<DefenseAdjustmentGroup>}
+ */
+export const getActiveGroupedResistances = createSelector([getActiveResistances], CharacterUtils.groupDefenseAdjustments);
+/**
+ * @returns {Array<DefenseAdjustmentGroup>}
+ */
+export const getActiveGroupedImmunities = createSelector([getActiveImmunities], CharacterUtils.groupDefenseAdjustments);
+/**
+ * @returns {Array<DefenseAdjustmentGroup>}
+ */
+export const getActiveGroupedVulnerabilities = createSelector([getActiveVulnerabilities], CharacterUtils.groupDefenseAdjustments);
+/**
+ * @returns {boolean}
+ */
+export const hasSpells = createSelector([getClassSpellLists, getActiveCharacterSpells], CharacterGenerators.generateHasSpells);
+/**
+ * @returns {Array<Attack>}
+ */
+export const getAttacks = createSelector([getActions, getItemAttacks, getActiveSpellAttackList, getCustomActions], CharacterGenerators.generateAttacks);
+/**
+ * @returns {SenseInfo}
+ */
+export const getSenseInfo = createSelector([getValidGlobalModifiers, getAbilityLookup, characterSelectors.getCustomSenseLookup], CharacterGenerators.generateSenseInfo);
+/**
+ * @returns {AttacksPerActionInfo}
+ */
+export const getAttacksPerActionInfo = createSelector([getValidGlobalModifiers], CharacterGenerators.generateAttacksPerActionInfo);
+/**
+ * @returns {Array<ProficiencyGroup>}
+ */
+export const getProficiencyGroups = createSelector([
+    characterSelectors.getCustomProficiencies,
+    characterSelectors.getCharacterValueLookupByType,
+    getValidGlobalModifiers,
+    getRuleData,
+], CharacterGenerators.generateProficiencyGroups);
+/**
+ * @returns {SnippetData}
+ */
+export const getSnippetData = createSelector([getProficiencyBonus, getAbilityKeyLookup, getAbilityLookup, getExperienceInfo, getHitPointInfo, getRuleData], SnippetGenerators.generateSnippetData);
+/**
+ * @returns {boolean}
+ */
+export const isCharacterSheetReady = createSelector([characterSelectors.getRace, characterSelectors.getClasses, characterSelectors.getStats, getCharacterConfiguration], CharacterGenerators.generateIsCharacterSheetReady);
+/**
+ *  @returns {SocialImageData}
+ */
+export const getSocialImageData = createSelector([getAbilities, getAcTotal, getHitPointInfo, getProcessedInitiative], CoreGenerators.generateSocialImageData);
+/**
+ *  @returns {DataOriginRefDataTypedData<Background, null>}
+ */
+export const getDataOriginRefBackgroundData = createSelector([getBackgroundInfo], BackgroundGenerators.generateRefBackgroundData);
+/**
+ *  @returns {DataOriginRefDataTypedData<CharClass, null>}
+ */
+export const getDataOriginRefClassData = createSelector([getClasses], ClassGenerators.generateRefClassData);
+/**
+ *  @returns {DataOriginRefDataTypedData<ClassFeature, CharClass>}
+ */
+export const getDataOriginRefClassFeatureData = createSelector([getClasses], ClassFeatureGenerators.generateRefClassFeatureData);
+/**
+ *  @returns {DataOriginRefDataTypedData<Condition, null>}
+ */
+export const getDataOriginRefConditionData = createSelector([getActiveConditions], ConditionGenerators.generateRefConditionData);
+/**
+ *  @returns {DataOriginRefDataTypedData<Feat, null>}
+ */
+export const getDataOriginRefFeatData = createSelector([getFeats], FeatGenerators.generateRefFeatData);
+/**
+ *  @returns {DataOriginRefDataTypedData<Item, null>}
+ */
+export const getDataOriginRefItemData = createSelector([getInventory], ItemGenerators.generateRefItemData);
+/**
+ *  @returns {DataOriginRefDataTypedData<RacialTrait, Race>}
+ */
+export const getDataOriginRefRaceData = createSelector([getRace], RaceGenerators.generateRefRaceData);
+/**
+ *  @returns {DataOriginRefDataTypedData<Vehicle, null>}
+ */
+export const getDataOriginRefVehicleData = createSelector([getVehicles], VehicleGenerators.generateRefVehicleData);
+function refDataFeatListGenerator() {
+    // Dummy generator. No extra data is needed for Feat Lists
+    return {};
+}
+export const getDataOriginRefFeatListData = createSelector([], refDataFeatListGenerator);
+/**
+ *  @returns {DataOriginRefData}
+ */
+export const getDataOriginRefData = createSelector([
+    getDataOriginRefBackgroundData,
+    getDataOriginRefClassData,
+    getDataOriginRefClassFeatureData,
+    getDataOriginRefConditionData,
+    getDataOriginRefFeatData,
+    getDataOriginRefItemData,
+    getDataOriginRefRaceData,
+    getDataOriginRefVehicleData,
+    getDataOriginRefFeatListData,
+], DataOriginGenerators.generateDataOriginRefData);
+/**
+ * @returns {Array<Extra>}
+ */
+export const getExtras = createSelector([getCreatures, getVehicles, getRuleData], ExtraGenerators.generateExtras);
+/**
+ * @returns {Hack__PdfDataBucket1AndBucket2Parts}
+ */
+const hack__getPdfDataBucket1AndBucket2Parts = createSelector([getRuleData, getAbilityLookup, getProficiencyBonus], PdfHacks.hack__generatePdfDataBucket1AndBucket2Parts);
+/**
+ * @returns {PdfDataBucket1}
+ */
+export const getPdfDataBucket1 = createSelector([
+    getSkills,
+    getCustomSkills,
+    getSpellSlots,
+    getPactMagicSlots,
+    getCreatures,
+    getAttacks,
+    getWeaponSpellDamageGroups,
+    getClassSpells,
+    getActiveCharacterSpells,
+    getCurrentLevel,
+    hack__getPdfDataBucket1AndBucket2Parts,
+], PdfGenerators.generatePdfDataBucket1);
+/**
+ * @returns {PdfDataBucket2}
+ */
+export const getPdfDataBucket2 = createSelector([
+    getActivatables,
+    getClasses,
+    getRace,
+    getFeats,
+    getBonusSavingThrowModifiers,
+    getAdvantageSavingThrowModifiers,
+    getDisadvantageSavingThrowModifiers,
+    getInventory,
+    getCustomItems,
+    getSnippetData,
+    hack__getPdfDataBucket1AndBucket2Parts,
+], PdfGenerators.generatePdfDataBucket2);
+/**
+ * @returns {PdfDataBucket3}
+ */
+export const getPdfDataBucket3 = createSelector([
+    getActiveGroupedResistances,
+    getActiveGroupedImmunities,
+    getActiveGroupedVulnerabilities,
+    getHitPointInfo,
+    getClassSpellLists,
+    getClassSpellInfoLookup,
+    getBackgroundInfo,
+    getProficiencyGroups,
+    getUniqueProficiencyModifiers,
+    getPassivePerception,
+    getPassiveInsight,
+    getPassiveInvestigation,
+], PdfGenerators.generatePdfDataBucket3);
+/**
+ * @returns {PdfDataBucket4}
+ */
+export const getPdfDataBucket4 = createSelector([
+    getAbilities,
+    characterSelectors.getCurrentXp,
+    getCarryCapacity,
+    getEncumberedWeight,
+    getPushDragLiftWeight,
+    getTotalWeight,
+    getAcTotal,
+    getProcessedInitiative,
+    getSpeeds,
+    getSenseInfo,
+    getRuleData,
+    getCharacterPreferences,
+], PdfGenerators.generatePdfDataBucket4);
+/**
+ * @returns {PdfDataBucket5}
+ */
+export const getPdfDataBucket5 = createSelector([
+    characterSelectors.getAge,
+    characterSelectors.getHeight,
+    characterSelectors.getWeight,
+    characterSelectors.getEyes,
+    characterSelectors.getSkin,
+    characterSelectors.getHair,
+    getSize,
+    characterSelectors.getFaith,
+    characterSelectors.getGender,
+    getAlignment,
+], PdfGenerators.generatePdfDataBucket5);
+/**
+ * @returns {PdfDataBucket6}
+ */
+export const getPdfDataBucket6 = createSelector([
+    characterSelectors.getCurrencies,
+    getLanguages,
+    characterSelectors.getName,
+    getCharacterNotes,
+    getProficiencyBonus,
+    getCharacterTraits,
+], PdfGenerators.generatePdfDataBucket6);
+/**
+ *  @returns {PdfData}
+ */
+export const getPdfExportData = createSelector([getPdfDataBucket1, getPdfDataBucket2, getPdfDataBucket3, getPdfDataBucket4, getPdfDataBucket5, getPdfDataBucket6], PdfGenerators.generatePdfData);
diff --git a/ddb_main/packages/rules-engine/es/selectors/featureFlagInfo.js b/ddb_main/packages/rules-engine/es/selectors/featureFlagInfo.js
new file mode 100644
index 0000000..96bdb34
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/selectors/featureFlagInfo.js
@@ -0,0 +1 @@
+export const getFeatureFlagInfo = (state) => state.featureFlagInfo;
diff --git a/ddb_main/packages/rules-engine/es/selectors/index.js b/ddb_main/packages/rules-engine/es/selectors/index.js
new file mode 100644
index 0000000..9b18a24
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/selectors/index.js
@@ -0,0 +1,16 @@
+import * as character from './character';
+import * as characterEnv from './characterEnv';
+import * as apiCreator from './composite/apiCreator';
+import * as rulesEngine from './composite/engine';
+import * as featureFlagInfo from './featureFlagInfo';
+import * as ruleData from './ruleData';
+import * as serviceData from './serviceData';
+import * as syncTransaction from './syncTransaction';
+export const characterSelectors = character;
+export const ruleDataSelectors = ruleData;
+export const characterEnvSelectors = characterEnv;
+export const featureFlagInfoSelectors = featureFlagInfo;
+export const serviceDataSelectors = serviceData;
+export const syncTransactionSelectors = syncTransaction;
+export const rulesEngineSelectors = rulesEngine;
+export const apiCreatorSelectors = apiCreator;
diff --git a/ddb_main/packages/rules-engine/es/selectors/ruleData.js b/ddb_main/packages/rules-engine/es/selectors/ruleData.js
new file mode 100644
index 0000000..a5dbe6d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/selectors/ruleData.js
@@ -0,0 +1,79 @@
+export const getAllData = (state) => state.ruleData;
+export const getAbilityScoreDisplayTypes = (state) => state.ruleData.abilityScoreDisplayTypes;
+export const getAbilitySkills = (state) => state.ruleData.abilitySkills;
+export const getActivationTypes = (state) => state.ruleData.activationTypes;
+export const getAdditionalLevelTypes = (state) => state.ruleData.additionalLevelTypes;
+export const getAdjustmentDataTypes = (state) => state.ruleData.adjustmentDataTypes;
+export const getAdjustmentTypes = (state) => state.ruleData.adjustmentTypes;
+export const getAlignments = (state) => state.ruleData.alignments;
+export const getAoeTypes = (state) => state.ruleData.aoeTypes;
+export const getArmor = (state) => state.ruleData.armor;
+export const getBasicActions = (state) => state.ruleData.basicActions;
+export const getBaseWeaponReach = (state) => state.ruleData.baseWeaponReach;
+export const getBasicMaxStatScore = (state) => state.ruleData.basicMaxStatScore;
+export const getChallengeRatings = (state) => state.ruleData.challengeRatings;
+export const getConditionTypes = (state) => state.ruleData.conditionTypes;
+export const getConditions = (state) => state.ruleData.conditions;
+export const getCreatureGroupCategories = (state) => state.ruleData.creatureGroupCategories;
+export const getCreatureGroupFlags = (state) => state.ruleData.creatureGroupFlags;
+export const getCreatureGroups = (state) => state.ruleData.creatureGroups;
+export const getCreatureSizes = (state) => state.ruleData.creatureSizes;
+export const getCurrencyData = (state) => state.ruleData.currencyData;
+export const getDamageAdjustments = (state) => state.ruleData.damageAdjustments;
+export const getDamageTypes = (state) => state.ruleData.damageTypes;
+export const getDefaultArmorImageUrl = (state) => state.ruleData.defaultArmorImageUrl;
+export const getDefaultAttunedItemCountMax = (state) => state.ruleData.defaultAttunedItemCountMax;
+export const getDefaultGearImageUrl = (state) => state.ruleData.defaultGearImageUrl;
+export const getDefaultRacePortraitUrl = (state) => state.ruleData.defaultRacePortraitUrl;
+export const getDefaultWeaponImageUrl = (state) => state.ruleData.defaultWeaponImageUrl;
+export const getDiceValues = (state) => state.ruleData.diceValues;
+export const getEnvironments = (state) => state.ruleData.environments;
+export const getInitiativeScore = (state) => state.ruleData.initiativeScore;
+export const getLanguageTypeId = (state) => state.ruleData.languageTypeId;
+export const getLanguages = (state) => state.ruleData.languages;
+export const getLevelExperiencePoints = (state) => state.ruleData.levelExperiencePoints;
+export const getLevelProficiencyBonuses = (state) => state.ruleData.levelProficiencyBonuses;
+export const getLifestyles = (state) => state.ruleData.lifestyles;
+export const getLimitedUseResetTypes = (state) => state.ruleData.limitedUseResetTypes;
+export const getLongRestMinimumHitDiceUsedRecovered = (state) => state.ruleData.longRestMinimumHitDiceUsedRecovered;
+export const getMaxAttunedItemCountMax = (state) => state.ruleData.maxAttunedItemCountMax;
+export const getMaxCharacterLevel = (state) => state.ruleData.maxCharacterLevel;
+export const getMaxDeathsavesFail = (state) => state.ruleData.maxDeathsavesFail;
+export const getMaxDeathsavesSuccess = (state) => state.ruleData.maxDeathsavesSuccess;
+export const getMaxSpellLevel = (state) => state.ruleData.maxSpellLevel;
+export const getMaxStatScore = (state) => state.ruleData.maxStatScore;
+export const getMinAttunedItemCountMax = (state) => state.ruleData.minAttunedItemCountMax;
+export const getMinStatScore = (state) => state.ruleData.minStatScore;
+export const getMinimumHpTotal = (state) => state.ruleData.minimumHpTotal;
+export const getMinimumLimitedUseMaxUse = (state) => state.ruleData.minimumLimitedUseMaxUse;
+export const getMonsterSubTypes = (state) => state.ruleData.monsterSubTypes;
+export const getMonsterTypes = (state) => state.ruleData.monsterTypes;
+export const getMovements = (state) => state.ruleData.movements;
+export const getMultiClassSpellSlots = (state) => state.ruleData.multiClassSpellSlots;
+export const getNaturalActions = (state) => state.ruleData.naturalActions;
+export const getNoArmorAcAmount = (state) => state.ruleData.noArmorAcAmount;
+export const getPactMagicMultiClassSpellSlots = (state) => state.ruleData.pactMagicMultiClassSpellSlots;
+export const getPrivacyTypes = (state) => state.ruleData.privacyTypes;
+export const getProficiencyGroups = (state) => state.ruleData.proficiencyGroups;
+export const getRaceGroups = (state) => state.ruleData.raceGroups;
+export const getRangeTypes = (state) => state.ruleData.rangeTypes;
+export const getRitualCastingTimeMinuteAddition = (state) => state.ruleData.ritualCastingTimeMinuteAddition;
+export const getRules = (state) => state.ruleData.rules;
+export const getSenses = (state) => state.ruleData.senses;
+export const getSharingTypes = (state) => state.ruleData.sharingTypes;
+export const getSourceCategories = (state) => state.ruleData.sourceCategories;
+export const getSources = (state) => state.ruleData.sources;
+export const getSpellComponents = (state) => state.ruleData.spellComponents;
+export const getSpellConditionTypes = (state) => state.ruleData.spellConditionTypes;
+export const getSpellRangeTypes = (state) => state.ruleData.spellRangeTypes;
+export const getStatModifiers = (state) => state.ruleData.statModifiers;
+export const getStats = (state) => state.ruleData.stats;
+export const getStealthCheckTypes = (state) => state.ruleData.stealthCheckTypes;
+export const getStringMartialArts = (state) => state.ruleData.stringMartialArts;
+export const getStringPactMagic = (state) => state.ruleData.stringPactMagic;
+export const getStringSpellCasting = (state) => state.ruleData.stringSpellCasting;
+export const getStringSpellEldritchBlast = (state) => state.ruleData.stringSpellEldritchBlast;
+export const getWeapons = (state) => state.ruleData.weapons;
+export const getWeaponCategories = (state) => state.ruleData.weaponCategories;
+export const getWeaponProperties = (state) => state.ruleData.weaponProperties;
+export const getWeaponPropertyReachDistance = (state) => state.ruleData.weaponPropertyReachDistance;
diff --git a/ddb_main/packages/rules-engine/es/selectors/serviceData.js b/ddb_main/packages/rules-engine/es/selectors/serviceData.js
new file mode 100644
index 0000000..f73eb1d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/selectors/serviceData.js
@@ -0,0 +1,10 @@
+export const getClassAlwaysKnownSpells = (state) => state.serviceData.classAlwaysKnownSpells;
+export const getClassAlwaysPreparedSpells = (state) => state.serviceData.classAlwaysPreparedSpells;
+export const getDefinitionPool = (state) => state.serviceData.definitionPool;
+export const getKnownInfusionsMappings = (state) => state.serviceData.knownInfusionsMappings;
+export const getInfusionsMappings = (state) => state.serviceData.infusionsMappings;
+export const getRuleDataPool = (state) => state.serviceData.ruleDataPool;
+export const getVehicleComponentMappings = (state) => state.serviceData.vehicleComponentMappings;
+export const getVehicleMappings = (state) => state.serviceData.vehicleMappings;
+export const getPartyInfo = (state) => state.serviceData.partyInfo;
+export const getCampaignSettings = (state) => state.serviceData.campaignSettings;
diff --git a/ddb_main/packages/rules-engine/es/selectors/syncTransaction.js b/ddb_main/packages/rules-engine/es/selectors/syncTransaction.js
new file mode 100644
index 0000000..8f02e43
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/selectors/syncTransaction.js
@@ -0,0 +1,2 @@
+export const getActive = (state) => state.syncTransaction.active;
+export const getInitiator = (state) => state.syncTransaction.initiator;
diff --git a/ddb_main/packages/rules-engine/es/utils/ReduxActionUtils.js b/ddb_main/packages/rules-engine/es/utils/ReduxActionUtils.js
new file mode 100644
index 0000000..34cddc1
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/utils/ReduxActionUtils.js
@@ -0,0 +1,12 @@
+/**
+ *
+ * @param {function} actionCreator
+ * @param {...*} params
+ */
+export function callCommitAction(actionCreator, ...params) {
+    let action = actionCreator(...params);
+    return {
+        type: action.meta.commit.type,
+        payload: action.payload,
+    };
+}
diff --git a/ddb_main/packages/rules-engine/es/utils/SelectorHelpers.js b/ddb_main/packages/rules-engine/es/utils/SelectorHelpers.js
new file mode 100644
index 0000000..0d3078d
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/utils/SelectorHelpers.js
@@ -0,0 +1,4 @@
+export function getArrayOrNullFallback(value) {
+    let fallback = [];
+    return value === null ? fallback : value;
+}
diff --git a/ddb_main/packages/rules-engine/es/utils/TypeScriptUtils.js b/ddb_main/packages/rules-engine/es/utils/TypeScriptUtils.js
new file mode 100644
index 0000000..dbe9b2a
--- /dev/null
+++ b/ddb_main/packages/rules-engine/es/utils/TypeScriptUtils.js
@@ -0,0 +1,16 @@
+/**
+ * https://github.com/Microsoft/TypeScript/issues/16069#issuecomment-369374214
+ * Used to get around array filter function that errors because it doesn't recognize the filter
+ * is removing nulls
+ * @param input
+ */
+export function isNotNullOrUndefined(input) {
+    return input !== null;
+}
+/**
+ *
+ * @param x
+ */
+export function testUnreachable(x) {
+    // not implemented, only here for param check
+}
diff --git a/ddb_main/packages/rules-engine/node_modules/reselect/es/defaultMemoize.js b/ddb_main/packages/rules-engine/node_modules/reselect/es/defaultMemoize.js
new file mode 100644
index 0000000..e694cbd
--- /dev/null
+++ b/ddb_main/packages/rules-engine/node_modules/reselect/es/defaultMemoize.js
@@ -0,0 +1,147 @@
+// Cache implementation based on Erik Rasmussen's `lru-memoize`:
+// https://github.com/erikras/lru-memoize
+var NOT_FOUND = 'NOT_FOUND';
+
+function createSingletonCache(equals) {
+  var entry;
+  return {
+    get: function get(key) {
+      if (entry && equals(entry.key, key)) {
+        return entry.value;
+      }
+
+      return NOT_FOUND;
+    },
+    put: function put(key, value) {
+      entry = {
+        key: key,
+        value: value
+      };
+    },
+    getEntries: function getEntries() {
+      return entry ? [entry] : [];
+    },
+    clear: function clear() {
+      entry = undefined;
+    }
+  };
+}
+
+function createLruCache(maxSize, equals) {
+  var entries = [];
+
+  function get(key) {
+    var cacheIndex = entries.findIndex(function (entry) {
+      return equals(key, entry.key);
+    }); // We found a cached entry
+
+    if (cacheIndex > -1) {
+      var entry = entries[cacheIndex]; // Cached entry not at top of cache, move it to the top
+
+      if (cacheIndex > 0) {
+        entries.splice(cacheIndex, 1);
+        entries.unshift(entry);
+      }
+
+      return entry.value;
+    } // No entry found in cache, return sentinel
+
+
+    return NOT_FOUND;
+  }
+
+  function put(key, value) {
+    if (get(key) === NOT_FOUND) {
+      // TODO Is unshift slow?
+      entries.unshift({
+        key: key,
+        value: value
+      });
+
+      if (entries.length > maxSize) {
+        entries.pop();
+      }
+    }
+  }
+
+  function getEntries() {
+    return entries;
+  }
+
+  function clear() {
+    entries = [];
+  }
+
+  return {
+    get: get,
+    put: put,
+    getEntries: getEntries,
+    clear: clear
+  };
+}
+
+export var defaultEqualityCheck = function defaultEqualityCheck(a, b) {
+  return a === b;
+};
+export function createCacheKeyComparator(equalityCheck) {
+  return function areArgumentsShallowlyEqual(prev, next) {
+    if (prev === null || next === null || prev.length !== next.length) {
+      return false;
+    } // Do this in a for loop (and not a `forEach` or an `every`) so we can determine equality as fast as possible.
+
+
+    var length = prev.length;
+
+    for (var i = 0; i < length; i++) {
+      if (!equalityCheck(prev[i], next[i])) {
+        return false;
+      }
+    }
+
+    return true;
+  };
+}
+// defaultMemoize now supports a configurable cache size with LRU behavior,
+// and optional comparison of the result value with existing values
+export function defaultMemoize(func, equalityCheckOrOptions) {
+  var providedOptions = typeof equalityCheckOrOptions === 'object' ? equalityCheckOrOptions : {
+    equalityCheck: equalityCheckOrOptions
+  };
+  var _providedOptions$equa = providedOptions.equalityCheck,
+      equalityCheck = _providedOptions$equa === void 0 ? defaultEqualityCheck : _providedOptions$equa,
+      _providedOptions$maxS = providedOptions.maxSize,
+      maxSize = _providedOptions$maxS === void 0 ? 1 : _providedOptions$maxS,
+      resultEqualityCheck = providedOptions.resultEqualityCheck;
+  var comparator = createCacheKeyComparator(equalityCheck);
+  var cache = maxSize === 1 ? createSingletonCache(comparator) : createLruCache(maxSize, comparator); // we reference arguments instead of spreading them for performance reasons
+
+  function memoized() {
+    var value = cache.get(arguments);
+
+    if (value === NOT_FOUND) {
+      // @ts-ignore
+      value = func.apply(null, arguments);
+
+      if (resultEqualityCheck) {
+        var entries = cache.getEntries();
+        var matchingEntry = entries.find(function (entry) {
+          return resultEqualityCheck(entry.value, value);
+        });
+
+        if (matchingEntry) {
+          value = matchingEntry.value;
+        }
+      }
+
+      cache.put(arguments, value);
+    }
+
+    return value;
+  }
+
+  memoized.clearCache = function () {
+    return cache.clear();
+  };
+
+  return memoized;
+}
\ No newline at end of file
diff --git a/ddb_main/packages/rules-engine/node_modules/reselect/es/index.js b/ddb_main/packages/rules-engine/node_modules/reselect/es/index.js
new file mode 100644
index 0000000..1609952
--- /dev/null
+++ b/ddb_main/packages/rules-engine/node_modules/reselect/es/index.js
@@ -0,0 +1,130 @@
+import { defaultMemoize, defaultEqualityCheck } from './defaultMemoize';
+export { defaultMemoize, defaultEqualityCheck };
+
+function getDependencies(funcs) {
+  var dependencies = Array.isArray(funcs[0]) ? funcs[0] : funcs;
+
+  if (!dependencies.every(function (dep) {
+    return typeof dep === 'function';
+  })) {
+    var dependencyTypes = dependencies.map(function (dep) {
+      return typeof dep === 'function' ? "function " + (dep.name || 'unnamed') + "()" : typeof dep;
+    }).join(', ');
+    throw new Error("createSelector expects all input-selectors to be functions, but received the following types: [" + dependencyTypes + "]");
+  }
+
+  return dependencies;
+}
+
+export function createSelectorCreator(memoize) {
+  for (var _len = arguments.length, memoizeOptionsFromArgs = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    memoizeOptionsFromArgs[_key - 1] = arguments[_key];
+  }
+
+  var createSelector = function createSelector() {
+    for (var _len2 = arguments.length, funcs = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+      funcs[_key2] = arguments[_key2];
+    }
+
+    var _recomputations = 0;
+
+    var _lastResult; // Due to the intricacies of rest params, we can't do an optional arg after `...funcs`.
+    // So, start by declaring the default value here.
+    // (And yes, the words 'memoize' and 'options' appear too many times in this next sequence.)
+
+
+    var directlyPassedOptions = {
+      memoizeOptions: undefined
+    }; // Normally, the result func or "output selector" is the last arg
+
+    var resultFunc = funcs.pop(); // If the result func is actually an _object_, assume it's our options object
+
+    if (typeof resultFunc === 'object') {
+      directlyPassedOptions = resultFunc; // and pop the real result func off
+
+      resultFunc = funcs.pop();
+    }
+
+    if (typeof resultFunc !== 'function') {
+      throw new Error("createSelector expects an output function after the inputs, but received: [" + typeof resultFunc + "]");
+    } // Determine which set of options we're using. Prefer options passed directly,
+    // but fall back to options given to createSelectorCreator.
+
+
+    var _directlyPassedOption = directlyPassedOptions,
+        _directlyPassedOption2 = _directlyPassedOption.memoizeOptions,
+        memoizeOptions = _directlyPassedOption2 === void 0 ? memoizeOptionsFromArgs : _directlyPassedOption2; // Simplifying assumption: it's unlikely that the first options arg of the provided memoizer
+    // is an array. In most libs I've looked at, it's an equality function or options object.
+    // Based on that, if `memoizeOptions` _is_ an array, we assume it's a full
+    // user-provided array of options. Otherwise, it must be just the _first_ arg, and so
+    // we wrap it in an array so we can apply it.
+
+    var finalMemoizeOptions = Array.isArray(memoizeOptions) ? memoizeOptions : [memoizeOptions];
+    var dependencies = getDependencies(funcs);
+    var memoizedResultFunc = memoize.apply(void 0, [function () {
+      _recomputations++; // apply arguments instead of spreading for performance.
+
+      return resultFunc.apply(null, arguments);
+    }].concat(finalMemoizeOptions)); // If a selector is called with the exact same arguments we don't need to traverse our dependencies again.
+
+    var selector = memoize(function () {
+      var params = [];
+      var length = dependencies.length;
+
+      for (var i = 0; i < length; i++) {
+        // apply arguments instead of spreading and mutate a local list of params for performance.
+        // @ts-ignore
+        params.push(dependencies[i].apply(null, arguments));
+      } // apply arguments instead of spreading for performance.
+
+
+      _lastResult = memoizedResultFunc.apply(null, params);
+      return _lastResult;
+    });
+    Object.assign(selector, {
+      resultFunc: resultFunc,
+      memoizedResultFunc: memoizedResultFunc,
+      dependencies: dependencies,
+      lastResult: function lastResult() {
+        return _lastResult;
+      },
+      recomputations: function recomputations() {
+        return _recomputations;
+      },
+      resetRecomputations: function resetRecomputations() {
+        return _recomputations = 0;
+      }
+    });
+    return selector;
+  }; // @ts-ignore
+
+
+  return createSelector;
+}
+export var createSelector = /* #__PURE__ */createSelectorCreator(defaultMemoize);
+// Manual definition of state and output arguments
+export var createStructuredSelector = function createStructuredSelector(selectors, selectorCreator) {
+  if (selectorCreator === void 0) {
+    selectorCreator = createSelector;
+  }
+
+  if (typeof selectors !== 'object') {
+    throw new Error('createStructuredSelector expects first argument to be an object ' + ("where each property is a selector, instead received a " + typeof selectors));
+  }
+
+  var objectKeys = Object.keys(selectors);
+  var resultSelector = selectorCreator( // @ts-ignore
+  objectKeys.map(function (key) {
+    return selectors[key];
+  }), function () {
+    for (var _len3 = arguments.length, values = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+      values[_key3] = arguments[_key3];
+    }
+
+    return values.reduce(function (composition, value, index) {
+      composition[objectKeys[index]] = value;
+      return composition;
+    }, {});
+  });
+  return resultSelector;
+};
\ No newline at end of file
diff --git "a/ddb_main/react-jsx-parser/external \"react\"" "b/ddb_main/react-jsx-parser/external \"react\""
new file mode 100644
index 0000000..5d837f7
--- /dev/null
+++ "b/ddb_main/react-jsx-parser/external \"react\""	
@@ -0,0 +1 @@
+module.exports = __WEBPACK_EXTERNAL_MODULE__297__;
\ No newline at end of file
diff --git a/ddb_main/react-jsx-parser/node_modules/acorn-jsx/index.js b/ddb_main/react-jsx-parser/node_modules/acorn-jsx/index.js
new file mode 100644
index 0000000..aed0558
--- /dev/null
+++ b/ddb_main/react-jsx-parser/node_modules/acorn-jsx/index.js
@@ -0,0 +1,496 @@
+'use strict';
+
+const XHTMLEntities = require('./xhtml');
+
+const hexNumber = /^[\da-fA-F]+$/;
+const decimalNumber = /^\d+$/;
+
+// The map to `acorn-jsx` tokens from `acorn` namespace objects.
+const acornJsxMap = new WeakMap();
+
+// Get the original tokens for the given `acorn` namespace object.
+function getJsxTokens(acorn) {
+  acorn = acorn.Parser.acorn || acorn;
+  let acornJsx = acornJsxMap.get(acorn);
+  if (!acornJsx) {
+    const tt = acorn.tokTypes;
+    const TokContext = acorn.TokContext;
+    const TokenType = acorn.TokenType;
+    const tc_oTag = new TokContext('<tag', false);
+    const tc_cTag = new TokContext('</tag', false);
+    const tc_expr = new TokContext('<tag>...</tag>', true, true);
+    const tokContexts = {
+      tc_oTag: tc_oTag,
+      tc_cTag: tc_cTag,
+      tc_expr: tc_expr
+    };
+    const tokTypes = {
+      jsxName: new TokenType('jsxName'),
+      jsxText: new TokenType('jsxText', {beforeExpr: true}),
+      jsxTagStart: new TokenType('jsxTagStart', {startsExpr: true}),
+      jsxTagEnd: new TokenType('jsxTagEnd')
+    };
+
+    tokTypes.jsxTagStart.updateContext = function() {
+      this.context.push(tc_expr); // treat as beginning of JSX expression
+      this.context.push(tc_oTag); // start opening tag context
+      this.exprAllowed = false;
+    };
+    tokTypes.jsxTagEnd.updateContext = function(prevType) {
+      let out = this.context.pop();
+      if (out === tc_oTag && prevType === tt.slash || out === tc_cTag) {
+        this.context.pop();
+        this.exprAllowed = this.curContext() === tc_expr;
+      } else {
+        this.exprAllowed = true;
+      }
+    };
+
+    acornJsx = { tokContexts: tokContexts, tokTypes: tokTypes };
+    acornJsxMap.set(acorn, acornJsx);
+  }
+
+  return acornJsx;
+}
+
+// Transforms JSX element name to string.
+
+function getQualifiedJSXName(object) {
+  if (!object)
+    return object;
+
+  if (object.type === 'JSXIdentifier')
+    return object.name;
+
+  if (object.type === 'JSXNamespacedName')
+    return object.namespace.name + ':' + object.name.name;
+
+  if (object.type === 'JSXMemberExpression')
+    return getQualifiedJSXName(object.object) + '.' +
+    getQualifiedJSXName(object.property);
+}
+
+module.exports = function(options) {
+  options = options || {};
+  return function(Parser) {
+    return plugin({
+      allowNamespaces: options.allowNamespaces !== false,
+      allowNamespacedObjects: !!options.allowNamespacedObjects,
+      autoCloseVoidElements: !!options.autoCloseVoidElements,
+    }, Parser);
+  };
+};
+
+// This is `tokTypes` of the peer dep.
+// This can be different instances from the actual `tokTypes` this plugin uses.
+Object.defineProperty(module.exports, "tokTypes", {
+  get: function get_tokTypes() {
+    return getJsxTokens(require("acorn")).tokTypes;
+  },
+  configurable: true,
+  enumerable: true
+});
+
+function plugin(options, Parser) {
+  const acorn = Parser.acorn || require("acorn");
+  const acornJsx = getJsxTokens(acorn);
+  const tt = acorn.tokTypes;
+  const tok = acornJsx.tokTypes;
+  const tokContexts = acorn.tokContexts;
+  const tc_oTag = acornJsx.tokContexts.tc_oTag;
+  const tc_cTag = acornJsx.tokContexts.tc_cTag;
+  const tc_expr = acornJsx.tokContexts.tc_expr;
+  const isNewLine = acorn.isNewLine;
+  const isIdentifierStart = acorn.isIdentifierStart;
+  const isIdentifierChar = acorn.isIdentifierChar;
+
+  return class extends Parser {
+    // Expose actual `tokTypes` and `tokContexts` to other plugins.
+    static get acornJsx() {
+      return acornJsx;
+    }
+
+    // Reads inline JSX contents token.
+    jsx_readToken() {
+      let out = '', chunkStart = this.pos;
+      for (;;) {
+        if (this.pos >= this.input.length)
+          this.raise(this.start, 'Unterminated JSX contents');
+        let ch = this.input.charCodeAt(this.pos);
+
+        switch (ch) {
+        case 60: // '<'
+        case 123: // '{'
+          if (this.pos === this.start) {
+            if (ch === 60 && this.exprAllowed) {
+              ++this.pos;
+              return this.finishToken(tok.jsxTagStart);
+            }
+            return this.getTokenFromCode(ch);
+          }
+          out += this.input.slice(chunkStart, this.pos);
+          return this.finishToken(tok.jsxText, out);
+
+        case 38: // '&'
+          out += this.input.slice(chunkStart, this.pos);
+          out += this.jsx_readEntity();
+          chunkStart = this.pos;
+          break;
+
+        case 62: // '>'
+        case 125: // '}'
+          this.raise(
+            this.pos,
+            "Unexpected token `" + this.input[this.pos] + "`. Did you mean `" +
+              (ch === 62 ? "&gt;" : "&rbrace;") + "` or " + "`{\"" + this.input[this.pos] + "\"}" + "`?"
+          );
+
+        default:
+          if (isNewLine(ch)) {
+            out += this.input.slice(chunkStart, this.pos);
+            out += this.jsx_readNewLine(true);
+            chunkStart = this.pos;
+          } else {
+            ++this.pos;
+          }
+        }
+      }
+    }
+
+    jsx_readNewLine(normalizeCRLF) {
+      let ch = this.input.charCodeAt(this.pos);
+      let out;
+      ++this.pos;
+      if (ch === 13 && this.input.charCodeAt(this.pos) === 10) {
+        ++this.pos;
+        out = normalizeCRLF ? '\n' : '\r\n';
+      } else {
+        out = String.fromCharCode(ch);
+      }
+      if (this.options.locations) {
+        ++this.curLine;
+        this.lineStart = this.pos;
+      }
+
+      return out;
+    }
+
+    jsx_readString(quote) {
+      let out = '', chunkStart = ++this.pos;
+      for (;;) {
+        if (this.pos >= this.input.length)
+          this.raise(this.start, 'Unterminated string constant');
+        let ch = this.input.charCodeAt(this.pos);
+        if (ch === quote) break;
+        if (ch === 38) { // '&'
+          out += this.input.slice(chunkStart, this.pos);
+          out += this.jsx_readEntity();
+          chunkStart = this.pos;
+        } else if (isNewLine(ch)) {
+          out += this.input.slice(chunkStart, this.pos);
+          out += this.jsx_readNewLine(false);
+          chunkStart = this.pos;
+        } else {
+          ++this.pos;
+        }
+      }
+      out += this.input.slice(chunkStart, this.pos++);
+      return this.finishToken(tt.string, out);
+    }
+
+    jsx_readEntity() {
+      let str = '', count = 0, entity;
+      let ch = this.input[this.pos];
+      if (ch !== '&')
+        this.raise(this.pos, 'Entity must start with an ampersand');
+      let startPos = ++this.pos;
+      while (this.pos < this.input.length && count++ < 10) {
+        ch = this.input[this.pos++];
+        if (ch === ';') {
+          if (str[0] === '#') {
+            if (str[1] === 'x') {
+              str = str.substr(2);
+              if (hexNumber.test(str))
+                entity = String.fromCharCode(parseInt(str, 16));
+            } else {
+              str = str.substr(1);
+              if (decimalNumber.test(str))
+                entity = String.fromCharCode(parseInt(str, 10));
+            }
+          } else {
+            entity = XHTMLEntities[str];
+          }
+          break;
+        }
+        str += ch;
+      }
+      if (!entity) {
+        this.pos = startPos;
+        return '&';
+      }
+      return entity;
+    }
+
+    // Read a JSX identifier (valid tag or attribute name).
+    //
+    // Optimized version since JSX identifiers can't contain
+    // escape characters and so can be read as single slice.
+    // Also assumes that first character was already checked
+    // by isIdentifierStart in readToken.
+
+    jsx_readWord() {
+      let ch, start = this.pos;
+      do {
+        ch = this.input.charCodeAt(++this.pos);
+      } while (isIdentifierChar(ch) || ch === 45); // '-'
+      return this.finishToken(tok.jsxName, this.input.slice(start, this.pos));
+    }
+
+    // Parse next token as JSX identifier
+
+    jsx_parseIdentifier() {
+      let node = this.startNode();
+      if (this.type === tok.jsxName)
+        node.name = this.value;
+      else if (this.type.keyword)
+        node.name = this.type.keyword;
+      else
+        this.unexpected();
+      this.next();
+      return this.finishNode(node, 'JSXIdentifier');
+    }
+
+    // Parse namespaced identifier.
+
+    jsx_parseNamespacedName() {
+      let startPos = this.start, startLoc = this.startLoc;
+      let name = this.jsx_parseIdentifier();
+      if (!options.allowNamespaces || !this.eat(tt.colon)) return name;
+      var node = this.startNodeAt(startPos, startLoc);
+      node.namespace = name;
+      node.name = this.jsx_parseIdentifier();
+      return this.finishNode(node, 'JSXNamespacedName');
+    }
+
+    // Parses element name in any form - namespaced, member
+    // or single identifier.
+
+    jsx_parseElementName() {
+      if (this.type === tok.jsxTagEnd) return '';
+      let startPos = this.start, startLoc = this.startLoc;
+      let node = this.jsx_parseNamespacedName();
+      if (this.type === tt.dot && node.type === 'JSXNamespacedName' && !options.allowNamespacedObjects) {
+        this.unexpected();
+      }
+      while (this.eat(tt.dot)) {
+        let newNode = this.startNodeAt(startPos, startLoc);
+        newNode.object = node;
+        newNode.property = this.jsx_parseIdentifier();
+        node = this.finishNode(newNode, 'JSXMemberExpression');
+      }
+      return node;
+    }
+
+    // Parses any type of JSX attribute value.
+
+    jsx_parseAttributeValue() {
+      switch (this.type) {
+      case tt.braceL:
+        let node = this.jsx_parseExpressionContainer();
+        if (node.expression.type === 'JSXEmptyExpression')
+          this.raise(node.start, 'JSX attributes must only be assigned a non-empty expression');
+        return node;
+
+      case tok.jsxTagStart:
+      case tt.string:
+        return this.parseExprAtom();
+
+      default:
+        this.raise(this.start, 'JSX value should be either an expression or a quoted JSX text');
+      }
+    }
+
+    // JSXEmptyExpression is unique type since it doesn't actually parse anything,
+    // and so it should start at the end of last read token (left brace) and finish
+    // at the beginning of the next one (right brace).
+
+    jsx_parseEmptyExpression() {
+      let node = this.startNodeAt(this.lastTokEnd, this.lastTokEndLoc);
+      return this.finishNodeAt(node, 'JSXEmptyExpression', this.start, this.startLoc);
+    }
+
+    // Parses JSX expression enclosed into curly brackets.
+
+    jsx_parseExpressionContainer() {
+      let node = this.startNode();
+      this.next();
+      node.expression = this.type === tt.braceR
+        ? this.jsx_parseEmptyExpression()
+        : this.parseExpression();
+      this.expect(tt.braceR);
+      return this.finishNode(node, 'JSXExpressionContainer');
+    }
+
+    // Parses following JSX attribute name-value pair.
+
+    jsx_parseAttribute() {
+      let node = this.startNode();
+      if (this.eat(tt.braceL)) {
+        this.expect(tt.ellipsis);
+        node.argument = this.parseMaybeAssign();
+        this.expect(tt.braceR);
+        return this.finishNode(node, 'JSXSpreadAttribute');
+      }
+      node.name = this.jsx_parseNamespacedName();
+      node.value = this.eat(tt.eq) ? this.jsx_parseAttributeValue() : null;
+      return this.finishNode(node, 'JSXAttribute');
+    }
+
+    // Parses JSX opening tag starting after '<'.
+
+    jsx_parseOpeningElementAt(startPos, startLoc) {
+      let node = this.startNodeAt(startPos, startLoc);
+      node.attributes = [];
+      let nodeName = this.jsx_parseElementName();
+      if (nodeName) node.name = nodeName;
+      while (this.type !== tt.slash && this.type !== tok.jsxTagEnd)
+        node.attributes.push(this.jsx_parseAttribute());
+      node.selfClosing = this.eat(tt.slash);
+      this.expect(tok.jsxTagEnd);
+      const VOID_ELEMENTS = [
+        'area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input', 'keygen',
+        'link', 'menuitem', 'meta', 'param', 'source', 'track', 'wbr'
+      ]
+      if (options.autoCloseVoidElements && nodeName && VOID_ELEMENTS.includes(nodeName.name)) {
+        node.selfClosing = true;
+      }
+      return this.finishNode(node, nodeName ? 'JSXOpeningElement' : 'JSXOpeningFragment');
+    }
+
+    // Parses JSX closing tag starting after '</'.
+
+    jsx_parseClosingElementAt(startPos, startLoc) {
+      let node = this.startNodeAt(startPos, startLoc);
+      let nodeName = this.jsx_parseElementName();
+      if (nodeName) node.name = nodeName;
+      this.expect(tok.jsxTagEnd);
+      return this.finishNode(node, nodeName ? 'JSXClosingElement' : 'JSXClosingFragment');
+    }
+
+    // Parses entire JSX element, including it's opening tag
+    // (starting after '<'), attributes, contents and closing tag.
+
+    jsx_parseElementAt(startPos, startLoc) {
+      let node = this.startNodeAt(startPos, startLoc);
+      let children = [];
+      let openingElement = this.jsx_parseOpeningElementAt(startPos, startLoc);
+      let closingElement = null;
+
+      if (!openingElement.selfClosing) {
+        contents: for (;;) {
+          switch (this.type) {
+          case tok.jsxTagStart:
+            startPos = this.start; startLoc = this.startLoc;
+            this.next();
+            if (this.eat(tt.slash)) {
+              closingElement = this.jsx_parseClosingElementAt(startPos, startLoc);
+              break contents;
+            }
+            children.push(this.jsx_parseElementAt(startPos, startLoc));
+            break;
+
+          case tok.jsxText:
+            children.push(this.parseExprAtom());
+            break;
+
+          case tt.braceL:
+            children.push(this.jsx_parseExpressionContainer());
+            break;
+
+          default:
+            this.unexpected();
+          }
+        }
+        if (getQualifiedJSXName(closingElement.name) !== getQualifiedJSXName(openingElement.name)) {
+          this.raise(
+            closingElement.start,
+            'Expected corresponding JSX closing tag for <' + getQualifiedJSXName(openingElement.name) + '>');
+        }
+      }
+      let fragmentOrElement = openingElement.name ? 'Element' : 'Fragment';
+
+      node['opening' + fragmentOrElement] = openingElement;
+      node['closing' + fragmentOrElement] = closingElement;
+      node.children = children;
+      if (this.type === tt.relational && this.value === "<") {
+        this.raise(this.start, "Adjacent JSX elements must be wrapped in an enclosing tag");
+      }
+      return this.finishNode(node, 'JSX' + fragmentOrElement);
+    }
+
+    // Parse JSX text
+
+    jsx_parseText() {
+      let node = this.parseLiteral(this.value);
+      node.type = "JSXText";
+      return node;
+    }
+
+    // Parses entire JSX element from current position.
+
+    jsx_parseElement() {
+      let startPos = this.start, startLoc = this.startLoc;
+      this.next();
+      return this.jsx_parseElementAt(startPos, startLoc);
+    }
+
+    parseExprAtom(refShortHandDefaultPos) {
+      if (this.type === tok.jsxText)
+        return this.jsx_parseText();
+      else if (this.type === tok.jsxTagStart)
+        return this.jsx_parseElement();
+      else
+        return super.parseExprAtom(refShortHandDefaultPos);
+    }
+
+    readToken(code) {
+      let context = this.curContext();
+
+      if (context === tc_expr) return this.jsx_readToken();
+
+      if (context === tc_oTag || context === tc_cTag) {
+        if (isIdentifierStart(code)) return this.jsx_readWord();
+
+        if (code == 62) {
+          ++this.pos;
+          return this.finishToken(tok.jsxTagEnd);
+        }
+
+        if ((code === 34 || code === 39) && context == tc_oTag)
+          return this.jsx_readString(code);
+      }
+
+      if (code === 60 && this.exprAllowed && this.input.charCodeAt(this.pos + 1) !== 33) {
+        ++this.pos;
+        return this.finishToken(tok.jsxTagStart);
+      }
+      return super.readToken(code);
+    }
+
+    updateContext(prevType) {
+      if (this.type == tt.braceL) {
+        var curContext = this.curContext();
+        if (curContext == tc_oTag) this.context.push(tokContexts.b_expr);
+        else if (curContext == tc_expr) this.context.push(tokContexts.b_tmpl);
+        else super.updateContext(prevType);
+        this.exprAllowed = true;
+      } else if (this.type === tt.slash && prevType === tok.jsxTagStart) {
+        this.context.length -= 2; // do not consider JSX expr -> JSX open tag -> ... anymore
+        this.context.push(tc_cTag); // reconsider as closing tag context
+        this.exprAllowed = false;
+      } else {
+        return super.updateContext(prevType);
+      }
+    }
+  };
+}
diff --git a/ddb_main/react-jsx-parser/node_modules/acorn-jsx/xhtml.js b/ddb_main/react-jsx-parser/node_modules/acorn-jsx/xhtml.js
new file mode 100644
index 0000000..c152009
--- /dev/null
+++ b/ddb_main/react-jsx-parser/node_modules/acorn-jsx/xhtml.js
@@ -0,0 +1,255 @@
+module.exports = {
+  quot: '\u0022',
+  amp: '&',
+  apos: '\u0027',
+  lt: '<',
+  gt: '>',
+  nbsp: '\u00A0',
+  iexcl: '\u00A1',
+  cent: '\u00A2',
+  pound: '\u00A3',
+  curren: '\u00A4',
+  yen: '\u00A5',
+  brvbar: '\u00A6',
+  sect: '\u00A7',
+  uml: '\u00A8',
+  copy: '\u00A9',
+  ordf: '\u00AA',
+  laquo: '\u00AB',
+  not: '\u00AC',
+  shy: '\u00AD',
+  reg: '\u00AE',
+  macr: '\u00AF',
+  deg: '\u00B0',
+  plusmn: '\u00B1',
+  sup2: '\u00B2',
+  sup3: '\u00B3',
+  acute: '\u00B4',
+  micro: '\u00B5',
+  para: '\u00B6',
+  middot: '\u00B7',
+  cedil: '\u00B8',
+  sup1: '\u00B9',
+  ordm: '\u00BA',
+  raquo: '\u00BB',
+  frac14: '\u00BC',
+  frac12: '\u00BD',
+  frac34: '\u00BE',
+  iquest: '\u00BF',
+  Agrave: '\u00C0',
+  Aacute: '\u00C1',
+  Acirc: '\u00C2',
+  Atilde: '\u00C3',
+  Auml: '\u00C4',
+  Aring: '\u00C5',
+  AElig: '\u00C6',
+  Ccedil: '\u00C7',
+  Egrave: '\u00C8',
+  Eacute: '\u00C9',
+  Ecirc: '\u00CA',
+  Euml: '\u00CB',
+  Igrave: '\u00CC',
+  Iacute: '\u00CD',
+  Icirc: '\u00CE',
+  Iuml: '\u00CF',
+  ETH: '\u00D0',
+  Ntilde: '\u00D1',
+  Ograve: '\u00D2',
+  Oacute: '\u00D3',
+  Ocirc: '\u00D4',
+  Otilde: '\u00D5',
+  Ouml: '\u00D6',
+  times: '\u00D7',
+  Oslash: '\u00D8',
+  Ugrave: '\u00D9',
+  Uacute: '\u00DA',
+  Ucirc: '\u00DB',
+  Uuml: '\u00DC',
+  Yacute: '\u00DD',
+  THORN: '\u00DE',
+  szlig: '\u00DF',
+  agrave: '\u00E0',
+  aacute: '\u00E1',
+  acirc: '\u00E2',
+  atilde: '\u00E3',
+  auml: '\u00E4',
+  aring: '\u00E5',
+  aelig: '\u00E6',
+  ccedil: '\u00E7',
+  egrave: '\u00E8',
+  eacute: '\u00E9',
+  ecirc: '\u00EA',
+  euml: '\u00EB',
+  igrave: '\u00EC',
+  iacute: '\u00ED',
+  icirc: '\u00EE',
+  iuml: '\u00EF',
+  eth: '\u00F0',
+  ntilde: '\u00F1',
+  ograve: '\u00F2',
+  oacute: '\u00F3',
+  ocirc: '\u00F4',
+  otilde: '\u00F5',
+  ouml: '\u00F6',
+  divide: '\u00F7',
+  oslash: '\u00F8',
+  ugrave: '\u00F9',
+  uacute: '\u00FA',
+  ucirc: '\u00FB',
+  uuml: '\u00FC',
+  yacute: '\u00FD',
+  thorn: '\u00FE',
+  yuml: '\u00FF',
+  OElig: '\u0152',
+  oelig: '\u0153',
+  Scaron: '\u0160',
+  scaron: '\u0161',
+  Yuml: '\u0178',
+  fnof: '\u0192',
+  circ: '\u02C6',
+  tilde: '\u02DC',
+  Alpha: '\u0391',
+  Beta: '\u0392',
+  Gamma: '\u0393',
+  Delta: '\u0394',
+  Epsilon: '\u0395',
+  Zeta: '\u0396',
+  Eta: '\u0397',
+  Theta: '\u0398',
+  Iota: '\u0399',
+  Kappa: '\u039A',
+  Lambda: '\u039B',
+  Mu: '\u039C',
+  Nu: '\u039D',
+  Xi: '\u039E',
+  Omicron: '\u039F',
+  Pi: '\u03A0',
+  Rho: '\u03A1',
+  Sigma: '\u03A3',
+  Tau: '\u03A4',
+  Upsilon: '\u03A5',
+  Phi: '\u03A6',
+  Chi: '\u03A7',
+  Psi: '\u03A8',
+  Omega: '\u03A9',
+  alpha: '\u03B1',
+  beta: '\u03B2',
+  gamma: '\u03B3',
+  delta: '\u03B4',
+  epsilon: '\u03B5',
+  zeta: '\u03B6',
+  eta: '\u03B7',
+  theta: '\u03B8',
+  iota: '\u03B9',
+  kappa: '\u03BA',
+  lambda: '\u03BB',
+  mu: '\u03BC',
+  nu: '\u03BD',
+  xi: '\u03BE',
+  omicron: '\u03BF',
+  pi: '\u03C0',
+  rho: '\u03C1',
+  sigmaf: '\u03C2',
+  sigma: '\u03C3',
+  tau: '\u03C4',
+  upsilon: '\u03C5',
+  phi: '\u03C6',
+  chi: '\u03C7',
+  psi: '\u03C8',
+  omega: '\u03C9',
+  thetasym: '\u03D1',
+  upsih: '\u03D2',
+  piv: '\u03D6',
+  ensp: '\u2002',
+  emsp: '\u2003',
+  thinsp: '\u2009',
+  zwnj: '\u200C',
+  zwj: '\u200D',
+  lrm: '\u200E',
+  rlm: '\u200F',
+  ndash: '\u2013',
+  mdash: '\u2014',
+  lsquo: '\u2018',
+  rsquo: '\u2019',
+  sbquo: '\u201A',
+  ldquo: '\u201C',
+  rdquo: '\u201D',
+  bdquo: '\u201E',
+  dagger: '\u2020',
+  Dagger: '\u2021',
+  bull: '\u2022',
+  hellip: '\u2026',
+  permil: '\u2030',
+  prime: '\u2032',
+  Prime: '\u2033',
+  lsaquo: '\u2039',
+  rsaquo: '\u203A',
+  oline: '\u203E',
+  frasl: '\u2044',
+  euro: '\u20AC',
+  image: '\u2111',
+  weierp: '\u2118',
+  real: '\u211C',
+  trade: '\u2122',
+  alefsym: '\u2135',
+  larr: '\u2190',
+  uarr: '\u2191',
+  rarr: '\u2192',
+  darr: '\u2193',
+  harr: '\u2194',
+  crarr: '\u21B5',
+  lArr: '\u21D0',
+  uArr: '\u21D1',
+  rArr: '\u21D2',
+  dArr: '\u21D3',
+  hArr: '\u21D4',
+  forall: '\u2200',
+  part: '\u2202',
+  exist: '\u2203',
+  empty: '\u2205',
+  nabla: '\u2207',
+  isin: '\u2208',
+  notin: '\u2209',
+  ni: '\u220B',
+  prod: '\u220F',
+  sum: '\u2211',
+  minus: '\u2212',
+  lowast: '\u2217',
+  radic: '\u221A',
+  prop: '\u221D',
+  infin: '\u221E',
+  ang: '\u2220',
+  and: '\u2227',
+  or: '\u2228',
+  cap: '\u2229',
+  cup: '\u222A',
+  'int': '\u222B',
+  there4: '\u2234',
+  sim: '\u223C',
+  cong: '\u2245',
+  asymp: '\u2248',
+  ne: '\u2260',
+  equiv: '\u2261',
+  le: '\u2264',
+  ge: '\u2265',
+  sub: '\u2282',
+  sup: '\u2283',
+  nsub: '\u2284',
+  sube: '\u2286',
+  supe: '\u2287',
+  oplus: '\u2295',
+  otimes: '\u2297',
+  perp: '\u22A5',
+  sdot: '\u22C5',
+  lceil: '\u2308',
+  rceil: '\u2309',
+  lfloor: '\u230A',
+  rfloor: '\u230B',
+  lang: '\u2329',
+  rang: '\u232A',
+  loz: '\u25CA',
+  spades: '\u2660',
+  clubs: '\u2663',
+  hearts: '\u2665',
+  diams: '\u2666'
+};
diff --git a/ddb_main/react-jsx-parser/node_modules/acorn/dist/acorn.js b/ddb_main/react-jsx-parser/node_modules/acorn/dist/acorn.js
new file mode 100644
index 0000000..e88d102
--- /dev/null
+++ b/ddb_main/react-jsx-parser/node_modules/acorn/dist/acorn.js
@@ -0,0 +1,5292 @@
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
+  typeof define === 'function' && define.amd ? define(['exports'], factory) :
+  (global = global || self, factory(global.acorn = {}));
+}(this, (function (exports) { 'use strict';
+
+  // Reserved word lists for various dialects of the language
+
+  var reservedWords = {
+    3: "abstract boolean byte char class double enum export extends final float goto implements import int interface long native package private protected public short static super synchronized throws transient volatile",
+    5: "class enum extends super const export import",
+    6: "enum",
+    strict: "implements interface let package private protected public static yield",
+    strictBind: "eval arguments"
+  };
+
+  // And the keywords
+
+  var ecma5AndLessKeywords = "break case catch continue debugger default do else finally for function if return switch throw try var while with null true false instanceof typeof void delete new in this";
+
+  var keywords = {
+    5: ecma5AndLessKeywords,
+    "5module": ecma5AndLessKeywords + " export import",
+    6: ecma5AndLessKeywords + " const class extends export import super"
+  };
+
+  var keywordRelationalOperator = /^in(stanceof)?$/;
+
+  // ## Character categories
+
+  // Big ugly regular expressions that match characters in the
+  // whitespace, identifier, and identifier-start categories. These
+  // are only applied when a character is found to actually have a
+  // code point above 128.
+  // Generated by `bin/generate-identifier-regex.js`.
+  var nonASCIIidentifierStartChars = "\xaa\xb5\xba\xc0-\xd6\xd8-\xf6\xf8-\u02c1\u02c6-\u02d1\u02e0-\u02e4\u02ec\u02ee\u0370-\u0374\u0376\u0377\u037a-\u037d\u037f\u0386\u0388-\u038a\u038c\u038e-\u03a1\u03a3-\u03f5\u03f7-\u0481\u048a-\u052f\u0531-\u0556\u0559\u0560-\u0588\u05d0-\u05ea\u05ef-\u05f2\u0620-\u064a\u066e\u066f\u0671-\u06d3\u06d5\u06e5\u06e6\u06ee\u06ef\u06fa-\u06fc\u06ff\u0710\u0712-\u072f\u074d-\u07a5\u07b1\u07ca-\u07ea\u07f4\u07f5\u07fa\u0800-\u0815\u081a\u0824\u0828\u0840-\u0858\u0860-\u086a\u08a0-\u08b4\u08b6-\u08c7\u0904-\u0939\u093d\u0950\u0958-\u0961\u0971-\u0980\u0985-\u098c\u098f\u0990\u0993-\u09a8\u09aa-\u09b0\u09b2\u09b6-\u09b9\u09bd\u09ce\u09dc\u09dd\u09df-\u09e1\u09f0\u09f1\u09fc\u0a05-\u0a0a\u0a0f\u0a10\u0a13-\u0a28\u0a2a-\u0a30\u0a32\u0a33\u0a35\u0a36\u0a38\u0a39\u0a59-\u0a5c\u0a5e\u0a72-\u0a74\u0a85-\u0a8d\u0a8f-\u0a91\u0a93-\u0aa8\u0aaa-\u0ab0\u0ab2\u0ab3\u0ab5-\u0ab9\u0abd\u0ad0\u0ae0\u0ae1\u0af9\u0b05-\u0b0c\u0b0f\u0b10\u0b13-\u0b28\u0b2a-\u0b30\u0b32\u0b33\u0b35-\u0b39\u0b3d\u0b5c\u0b5d\u0b5f-\u0b61\u0b71\u0b83\u0b85-\u0b8a\u0b8e-\u0b90\u0b92-\u0b95\u0b99\u0b9a\u0b9c\u0b9e\u0b9f\u0ba3\u0ba4\u0ba8-\u0baa\u0bae-\u0bb9\u0bd0\u0c05-\u0c0c\u0c0e-\u0c10\u0c12-\u0c28\u0c2a-\u0c39\u0c3d\u0c58-\u0c5a\u0c60\u0c61\u0c80\u0c85-\u0c8c\u0c8e-\u0c90\u0c92-\u0ca8\u0caa-\u0cb3\u0cb5-\u0cb9\u0cbd\u0cde\u0ce0\u0ce1\u0cf1\u0cf2\u0d04-\u0d0c\u0d0e-\u0d10\u0d12-\u0d3a\u0d3d\u0d4e\u0d54-\u0d56\u0d5f-\u0d61\u0d7a-\u0d7f\u0d85-\u0d96\u0d9a-\u0db1\u0db3-\u0dbb\u0dbd\u0dc0-\u0dc6\u0e01-\u0e30\u0e32\u0e33\u0e40-\u0e46\u0e81\u0e82\u0e84\u0e86-\u0e8a\u0e8c-\u0ea3\u0ea5\u0ea7-\u0eb0\u0eb2\u0eb3\u0ebd\u0ec0-\u0ec4\u0ec6\u0edc-\u0edf\u0f00\u0f40-\u0f47\u0f49-\u0f6c\u0f88-\u0f8c\u1000-\u102a\u103f\u1050-\u1055\u105a-\u105d\u1061\u1065\u1066\u106e-\u1070\u1075-\u1081\u108e\u10a0-\u10c5\u10c7\u10cd\u10d0-\u10fa\u10fc-\u1248\u124a-\u124d\u1250-\u1256\u1258\u125a-\u125d\u1260-\u1288\u128a-\u128d\u1290-\u12b0\u12b2-\u12b5\u12b8-\u12be\u12c0\u12c2-\u12c5\u12c8-\u12d6\u12d8-\u1310\u1312-\u1315\u1318-\u135a\u1380-\u138f\u13a0-\u13f5\u13f8-\u13fd\u1401-\u166c\u166f-\u167f\u1681-\u169a\u16a0-\u16ea\u16ee-\u16f8\u1700-\u170c\u170e-\u1711\u1720-\u1731\u1740-\u1751\u1760-\u176c\u176e-\u1770\u1780-\u17b3\u17d7\u17dc\u1820-\u1878\u1880-\u18a8\u18aa\u18b0-\u18f5\u1900-\u191e\u1950-\u196d\u1970-\u1974\u1980-\u19ab\u19b0-\u19c9\u1a00-\u1a16\u1a20-\u1a54\u1aa7\u1b05-\u1b33\u1b45-\u1b4b\u1b83-\u1ba0\u1bae\u1baf\u1bba-\u1be5\u1c00-\u1c23\u1c4d-\u1c4f\u1c5a-\u1c7d\u1c80-\u1c88\u1c90-\u1cba\u1cbd-\u1cbf\u1ce9-\u1cec\u1cee-\u1cf3\u1cf5\u1cf6\u1cfa\u1d00-\u1dbf\u1e00-\u1f15\u1f18-\u1f1d\u1f20-\u1f45\u1f48-\u1f4d\u1f50-\u1f57\u1f59\u1f5b\u1f5d\u1f5f-\u1f7d\u1f80-\u1fb4\u1fb6-\u1fbc\u1fbe\u1fc2-\u1fc4\u1fc6-\u1fcc\u1fd0-\u1fd3\u1fd6-\u1fdb\u1fe0-\u1fec\u1ff2-\u1ff4\u1ff6-\u1ffc\u2071\u207f\u2090-\u209c\u2102\u2107\u210a-\u2113\u2115\u2118-\u211d\u2124\u2126\u2128\u212a-\u2139\u213c-\u213f\u2145-\u2149\u214e\u2160-\u2188\u2c00-\u2c2e\u2c30-\u2c5e\u2c60-\u2ce4\u2ceb-\u2cee\u2cf2\u2cf3\u2d00-\u2d25\u2d27\u2d2d\u2d30-\u2d67\u2d6f\u2d80-\u2d96\u2da0-\u2da6\u2da8-\u2dae\u2db0-\u2db6\u2db8-\u2dbe\u2dc0-\u2dc6\u2dc8-\u2dce\u2dd0-\u2dd6\u2dd8-\u2dde\u3005-\u3007\u3021-\u3029\u3031-\u3035\u3038-\u303c\u3041-\u3096\u309b-\u309f\u30a1-\u30fa\u30fc-\u30ff\u3105-\u312f\u3131-\u318e\u31a0-\u31bf\u31f0-\u31ff\u3400-\u4dbf\u4e00-\u9ffc\ua000-\ua48c\ua4d0-\ua4fd\ua500-\ua60c\ua610-\ua61f\ua62a\ua62b\ua640-\ua66e\ua67f-\ua69d\ua6a0-\ua6ef\ua717-\ua71f\ua722-\ua788\ua78b-\ua7bf\ua7c2-\ua7ca\ua7f5-\ua801\ua803-\ua805\ua807-\ua80a\ua80c-\ua822\ua840-\ua873\ua882-\ua8b3\ua8f2-\ua8f7\ua8fb\ua8fd\ua8fe\ua90a-\ua925\ua930-\ua946\ua960-\ua97c\ua984-\ua9b2\ua9cf\ua9e0-\ua9e4\ua9e6-\ua9ef\ua9fa-\ua9fe\uaa00-\uaa28\uaa40-\uaa42\uaa44-\uaa4b\uaa60-\uaa76\uaa7a\uaa7e-\uaaaf\uaab1\uaab5\uaab6\uaab9-\uaabd\uaac0\uaac2\uaadb-\uaadd\uaae0-\uaaea\uaaf2-\uaaf4\uab01-\uab06\uab09-\uab0e\uab11-\uab16\uab20-\uab26\uab28-\uab2e\uab30-\uab5a\uab5c-\uab69\uab70-\uabe2\uac00-\ud7a3\ud7b0-\ud7c6\ud7cb-\ud7fb\uf900-\ufa6d\ufa70-\ufad9\ufb00-\ufb06\ufb13-\ufb17\ufb1d\ufb1f-\ufb28\ufb2a-\ufb36\ufb38-\ufb3c\ufb3e\ufb40\ufb41\ufb43\ufb44\ufb46-\ufbb1\ufbd3-\ufd3d\ufd50-\ufd8f\ufd92-\ufdc7\ufdf0-\ufdfb\ufe70-\ufe74\ufe76-\ufefc\uff21-\uff3a\uff41-\uff5a\uff66-\uffbe\uffc2-\uffc7\uffca-\uffcf\uffd2-\uffd7\uffda-\uffdc";
+  var nonASCIIidentifierChars = "\u200c\u200d\xb7\u0300-\u036f\u0387\u0483-\u0487\u0591-\u05bd\u05bf\u05c1\u05c2\u05c4\u05c5\u05c7\u0610-\u061a\u064b-\u0669\u0670\u06d6-\u06dc\u06df-\u06e4\u06e7\u06e8\u06ea-\u06ed\u06f0-\u06f9\u0711\u0730-\u074a\u07a6-\u07b0\u07c0-\u07c9\u07eb-\u07f3\u07fd\u0816-\u0819\u081b-\u0823\u0825-\u0827\u0829-\u082d\u0859-\u085b\u08d3-\u08e1\u08e3-\u0903\u093a-\u093c\u093e-\u094f\u0951-\u0957\u0962\u0963\u0966-\u096f\u0981-\u0983\u09bc\u09be-\u09c4\u09c7\u09c8\u09cb-\u09cd\u09d7\u09e2\u09e3\u09e6-\u09ef\u09fe\u0a01-\u0a03\u0a3c\u0a3e-\u0a42\u0a47\u0a48\u0a4b-\u0a4d\u0a51\u0a66-\u0a71\u0a75\u0a81-\u0a83\u0abc\u0abe-\u0ac5\u0ac7-\u0ac9\u0acb-\u0acd\u0ae2\u0ae3\u0ae6-\u0aef\u0afa-\u0aff\u0b01-\u0b03\u0b3c\u0b3e-\u0b44\u0b47\u0b48\u0b4b-\u0b4d\u0b55-\u0b57\u0b62\u0b63\u0b66-\u0b6f\u0b82\u0bbe-\u0bc2\u0bc6-\u0bc8\u0bca-\u0bcd\u0bd7\u0be6-\u0bef\u0c00-\u0c04\u0c3e-\u0c44\u0c46-\u0c48\u0c4a-\u0c4d\u0c55\u0c56\u0c62\u0c63\u0c66-\u0c6f\u0c81-\u0c83\u0cbc\u0cbe-\u0cc4\u0cc6-\u0cc8\u0cca-\u0ccd\u0cd5\u0cd6\u0ce2\u0ce3\u0ce6-\u0cef\u0d00-\u0d03\u0d3b\u0d3c\u0d3e-\u0d44\u0d46-\u0d48\u0d4a-\u0d4d\u0d57\u0d62\u0d63\u0d66-\u0d6f\u0d81-\u0d83\u0dca\u0dcf-\u0dd4\u0dd6\u0dd8-\u0ddf\u0de6-\u0def\u0df2\u0df3\u0e31\u0e34-\u0e3a\u0e47-\u0e4e\u0e50-\u0e59\u0eb1\u0eb4-\u0ebc\u0ec8-\u0ecd\u0ed0-\u0ed9\u0f18\u0f19\u0f20-\u0f29\u0f35\u0f37\u0f39\u0f3e\u0f3f\u0f71-\u0f84\u0f86\u0f87\u0f8d-\u0f97\u0f99-\u0fbc\u0fc6\u102b-\u103e\u1040-\u1049\u1056-\u1059\u105e-\u1060\u1062-\u1064\u1067-\u106d\u1071-\u1074\u1082-\u108d\u108f-\u109d\u135d-\u135f\u1369-\u1371\u1712-\u1714\u1732-\u1734\u1752\u1753\u1772\u1773\u17b4-\u17d3\u17dd\u17e0-\u17e9\u180b-\u180d\u1810-\u1819\u18a9\u1920-\u192b\u1930-\u193b\u1946-\u194f\u19d0-\u19da\u1a17-\u1a1b\u1a55-\u1a5e\u1a60-\u1a7c\u1a7f-\u1a89\u1a90-\u1a99\u1ab0-\u1abd\u1abf\u1ac0\u1b00-\u1b04\u1b34-\u1b44\u1b50-\u1b59\u1b6b-\u1b73\u1b80-\u1b82\u1ba1-\u1bad\u1bb0-\u1bb9\u1be6-\u1bf3\u1c24-\u1c37\u1c40-\u1c49\u1c50-\u1c59\u1cd0-\u1cd2\u1cd4-\u1ce8\u1ced\u1cf4\u1cf7-\u1cf9\u1dc0-\u1df9\u1dfb-\u1dff\u203f\u2040\u2054\u20d0-\u20dc\u20e1\u20e5-\u20f0\u2cef-\u2cf1\u2d7f\u2de0-\u2dff\u302a-\u302f\u3099\u309a\ua620-\ua629\ua66f\ua674-\ua67d\ua69e\ua69f\ua6f0\ua6f1\ua802\ua806\ua80b\ua823-\ua827\ua82c\ua880\ua881\ua8b4-\ua8c5\ua8d0-\ua8d9\ua8e0-\ua8f1\ua8ff-\ua909\ua926-\ua92d\ua947-\ua953\ua980-\ua983\ua9b3-\ua9c0\ua9d0-\ua9d9\ua9e5\ua9f0-\ua9f9\uaa29-\uaa36\uaa43\uaa4c\uaa4d\uaa50-\uaa59\uaa7b-\uaa7d\uaab0\uaab2-\uaab4\uaab7\uaab8\uaabe\uaabf\uaac1\uaaeb-\uaaef\uaaf5\uaaf6\uabe3-\uabea\uabec\uabed\uabf0-\uabf9\ufb1e\ufe00-\ufe0f\ufe20-\ufe2f\ufe33\ufe34\ufe4d-\ufe4f\uff10-\uff19\uff3f";
+
+  var nonASCIIidentifierStart = new RegExp("[" + nonASCIIidentifierStartChars + "]");
+  var nonASCIIidentifier = new RegExp("[" + nonASCIIidentifierStartChars + nonASCIIidentifierChars + "]");
+
+  nonASCIIidentifierStartChars = nonASCIIidentifierChars = null;
+
+  // These are a run-length and offset encoded representation of the
+  // >0xffff code points that are a valid part of identifiers. The
+  // offset starts at 0x10000, and each pair of numbers represents an
+  // offset to the next range, and then a size of the range. They were
+  // generated by bin/generate-identifier-regex.js
+
+  // eslint-disable-next-line comma-spacing
+  var astralIdentifierStartCodes = [0,11,2,25,2,18,2,1,2,14,3,13,35,122,70,52,268,28,4,48,48,31,14,29,6,37,11,29,3,35,5,7,2,4,43,157,19,35,5,35,5,39,9,51,157,310,10,21,11,7,153,5,3,0,2,43,2,1,4,0,3,22,11,22,10,30,66,18,2,1,11,21,11,25,71,55,7,1,65,0,16,3,2,2,2,28,43,28,4,28,36,7,2,27,28,53,11,21,11,18,14,17,111,72,56,50,14,50,14,35,349,41,7,1,79,28,11,0,9,21,107,20,28,22,13,52,76,44,33,24,27,35,30,0,3,0,9,34,4,0,13,47,15,3,22,0,2,0,36,17,2,24,85,6,2,0,2,3,2,14,2,9,8,46,39,7,3,1,3,21,2,6,2,1,2,4,4,0,19,0,13,4,159,52,19,3,21,2,31,47,21,1,2,0,185,46,42,3,37,47,21,0,60,42,14,0,72,26,230,43,117,63,32,7,3,0,3,7,2,1,2,23,16,0,2,0,95,7,3,38,17,0,2,0,29,0,11,39,8,0,22,0,12,45,20,0,35,56,264,8,2,36,18,0,50,29,113,6,2,1,2,37,22,0,26,5,2,1,2,31,15,0,328,18,190,0,80,921,103,110,18,195,2749,1070,4050,582,8634,568,8,30,114,29,19,47,17,3,32,20,6,18,689,63,129,74,6,0,67,12,65,1,2,0,29,6135,9,1237,43,8,8952,286,50,2,18,3,9,395,2309,106,6,12,4,8,8,9,5991,84,2,70,2,1,3,0,3,1,3,3,2,11,2,0,2,6,2,64,2,3,3,7,2,6,2,27,2,3,2,4,2,0,4,6,2,339,3,24,2,24,2,30,2,24,2,30,2,24,2,30,2,24,2,30,2,24,2,7,2357,44,11,6,17,0,370,43,1301,196,60,67,8,0,1205,3,2,26,2,1,2,0,3,0,2,9,2,3,2,0,2,0,7,0,5,0,2,0,2,0,2,2,2,1,2,0,3,0,2,0,2,0,2,0,2,0,2,1,2,0,3,3,2,6,2,3,2,3,2,0,2,9,2,16,6,2,2,4,2,16,4421,42717,35,4148,12,221,3,5761,15,7472,3104,541,1507,4938];
+
+  // eslint-disable-next-line comma-spacing
+  var astralIdentifierCodes = [509,0,227,0,150,4,294,9,1368,2,2,1,6,3,41,2,5,0,166,1,574,3,9,9,370,1,154,10,176,2,54,14,32,9,16,3,46,10,54,9,7,2,37,13,2,9,6,1,45,0,13,2,49,13,9,3,2,11,83,11,7,0,161,11,6,9,7,3,56,1,2,6,3,1,3,2,10,0,11,1,3,6,4,4,193,17,10,9,5,0,82,19,13,9,214,6,3,8,28,1,83,16,16,9,82,12,9,9,84,14,5,9,243,14,166,9,71,5,2,1,3,3,2,0,2,1,13,9,120,6,3,6,4,0,29,9,41,6,2,3,9,0,10,10,47,15,406,7,2,7,17,9,57,21,2,13,123,5,4,0,2,1,2,6,2,0,9,9,49,4,2,1,2,4,9,9,330,3,19306,9,135,4,60,6,26,9,1014,0,2,54,8,3,82,0,12,1,19628,1,5319,4,4,5,9,7,3,6,31,3,149,2,1418,49,513,54,5,49,9,0,15,0,23,4,2,14,1361,6,2,16,3,6,2,1,2,4,262,6,10,9,419,13,1495,6,110,6,6,9,4759,9,787719,239];
+
+  // This has a complexity linear to the value of the code. The
+  // assumption is that looking up astral identifier characters is
+  // rare.
+  function isInAstralSet(code, set) {
+    var pos = 0x10000;
+    for (var i = 0; i < set.length; i += 2) {
+      pos += set[i];
+      if (pos > code) { return false }
+      pos += set[i + 1];
+      if (pos >= code) { return true }
+    }
+  }
+
+  // Test whether a given character code starts an identifier.
+
+  function isIdentifierStart(code, astral) {
+    if (code < 65) { return code === 36 }
+    if (code < 91) { return true }
+    if (code < 97) { return code === 95 }
+    if (code < 123) { return true }
+    if (code <= 0xffff) { return code >= 0xaa && nonASCIIidentifierStart.test(String.fromCharCode(code)) }
+    if (astral === false) { return false }
+    return isInAstralSet(code, astralIdentifierStartCodes)
+  }
+
+  // Test whether a given character is part of an identifier.
+
+  function isIdentifierChar(code, astral) {
+    if (code < 48) { return code === 36 }
+    if (code < 58) { return true }
+    if (code < 65) { return false }
+    if (code < 91) { return true }
+    if (code < 97) { return code === 95 }
+    if (code < 123) { return true }
+    if (code <= 0xffff) { return code >= 0xaa && nonASCIIidentifier.test(String.fromCharCode(code)) }
+    if (astral === false) { return false }
+    return isInAstralSet(code, astralIdentifierStartCodes) || isInAstralSet(code, astralIdentifierCodes)
+  }
+
+  // ## Token types
+
+  // The assignment of fine-grained, information-carrying type objects
+  // allows the tokenizer to store the information it has about a
+  // token in a way that is very cheap for the parser to look up.
+
+  // All token type variables start with an underscore, to make them
+  // easy to recognize.
+
+  // The `beforeExpr` property is used to disambiguate between regular
+  // expressions and divisions. It is set on all token types that can
+  // be followed by an expression (thus, a slash after them would be a
+  // regular expression).
+  //
+  // The `startsExpr` property is used to check if the token ends a
+  // `yield` expression. It is set on all token types that either can
+  // directly start an expression (like a quotation mark) or can
+  // continue an expression (like the body of a string).
+  //
+  // `isLoop` marks a keyword as starting a loop, which is important
+  // to know when parsing a label, in order to allow or disallow
+  // continue jumps to that label.
+
+  var TokenType = function TokenType(label, conf) {
+    if ( conf === void 0 ) conf = {};
+
+    this.label = label;
+    this.keyword = conf.keyword;
+    this.beforeExpr = !!conf.beforeExpr;
+    this.startsExpr = !!conf.startsExpr;
+    this.isLoop = !!conf.isLoop;
+    this.isAssign = !!conf.isAssign;
+    this.prefix = !!conf.prefix;
+    this.postfix = !!conf.postfix;
+    this.binop = conf.binop || null;
+    this.updateContext = null;
+  };
+
+  function binop(name, prec) {
+    return new TokenType(name, {beforeExpr: true, binop: prec})
+  }
+  var beforeExpr = {beforeExpr: true}, startsExpr = {startsExpr: true};
+
+  // Map keyword names to token types.
+
+  var keywords$1 = {};
+
+  // Succinct definitions of keyword token types
+  function kw(name, options) {
+    if ( options === void 0 ) options = {};
+
+    options.keyword = name;
+    return keywords$1[name] = new TokenType(name, options)
+  }
+
+  var types = {
+    num: new TokenType("num", startsExpr),
+    regexp: new TokenType("regexp", startsExpr),
+    string: new TokenType("string", startsExpr),
+    name: new TokenType("name", startsExpr),
+    eof: new TokenType("eof"),
+
+    // Punctuation token types.
+    bracketL: new TokenType("[", {beforeExpr: true, startsExpr: true}),
+    bracketR: new TokenType("]"),
+    braceL: new TokenType("{", {beforeExpr: true, startsExpr: true}),
+    braceR: new TokenType("}"),
+    parenL: new TokenType("(", {beforeExpr: true, startsExpr: true}),
+    parenR: new TokenType(")"),
+    comma: new TokenType(",", beforeExpr),
+    semi: new TokenType(";", beforeExpr),
+    colon: new TokenType(":", beforeExpr),
+    dot: new TokenType("."),
+    question: new TokenType("?", beforeExpr),
+    questionDot: new TokenType("?."),
+    arrow: new TokenType("=>", beforeExpr),
+    template: new TokenType("template"),
+    invalidTemplate: new TokenType("invalidTemplate"),
+    ellipsis: new TokenType("...", beforeExpr),
+    backQuote: new TokenType("`", startsExpr),
+    dollarBraceL: new TokenType("${", {beforeExpr: true, startsExpr: true}),
+
+    // Operators. These carry several kinds of properties to help the
+    // parser use them properly (the presence of these properties is
+    // what categorizes them as operators).
+    //
+    // `binop`, when present, specifies that this operator is a binary
+    // operator, and will refer to its precedence.
+    //
+    // `prefix` and `postfix` mark the operator as a prefix or postfix
+    // unary operator.
+    //
+    // `isAssign` marks all of `=`, `+=`, `-=` etcetera, which act as
+    // binary operators with a very low precedence, that should result
+    // in AssignmentExpression nodes.
+
+    eq: new TokenType("=", {beforeExpr: true, isAssign: true}),
+    assign: new TokenType("_=", {beforeExpr: true, isAssign: true}),
+    incDec: new TokenType("++/--", {prefix: true, postfix: true, startsExpr: true}),
+    prefix: new TokenType("!/~", {beforeExpr: true, prefix: true, startsExpr: true}),
+    logicalOR: binop("||", 1),
+    logicalAND: binop("&&", 2),
+    bitwiseOR: binop("|", 3),
+    bitwiseXOR: binop("^", 4),
+    bitwiseAND: binop("&", 5),
+    equality: binop("==/!=/===/!==", 6),
+    relational: binop("</>/<=/>=", 7),
+    bitShift: binop("<</>>/>>>", 8),
+    plusMin: new TokenType("+/-", {beforeExpr: true, binop: 9, prefix: true, startsExpr: true}),
+    modulo: binop("%", 10),
+    star: binop("*", 10),
+    slash: binop("/", 10),
+    starstar: new TokenType("**", {beforeExpr: true}),
+    coalesce: binop("??", 1),
+
+    // Keyword token types.
+    _break: kw("break"),
+    _case: kw("case", beforeExpr),
+    _catch: kw("catch"),
+    _continue: kw("continue"),
+    _debugger: kw("debugger"),
+    _default: kw("default", beforeExpr),
+    _do: kw("do", {isLoop: true, beforeExpr: true}),
+    _else: kw("else", beforeExpr),
+    _finally: kw("finally"),
+    _for: kw("for", {isLoop: true}),
+    _function: kw("function", startsExpr),
+    _if: kw("if"),
+    _return: kw("return", beforeExpr),
+    _switch: kw("switch"),
+    _throw: kw("throw", beforeExpr),
+    _try: kw("try"),
+    _var: kw("var"),
+    _const: kw("const"),
+    _while: kw("while", {isLoop: true}),
+    _with: kw("with"),
+    _new: kw("new", {beforeExpr: true, startsExpr: true}),
+    _this: kw("this", startsExpr),
+    _super: kw("super", startsExpr),
+    _class: kw("class", startsExpr),
+    _extends: kw("extends", beforeExpr),
+    _export: kw("export"),
+    _import: kw("import", startsExpr),
+    _null: kw("null", startsExpr),
+    _true: kw("true", startsExpr),
+    _false: kw("false", startsExpr),
+    _in: kw("in", {beforeExpr: true, binop: 7}),
+    _instanceof: kw("instanceof", {beforeExpr: true, binop: 7}),
+    _typeof: kw("typeof", {beforeExpr: true, prefix: true, startsExpr: true}),
+    _void: kw("void", {beforeExpr: true, prefix: true, startsExpr: true}),
+    _delete: kw("delete", {beforeExpr: true, prefix: true, startsExpr: true})
+  };
+
+  // Matches a whole line break (where CRLF is considered a single
+  // line break). Used to count lines.
+
+  var lineBreak = /\r\n?|\n|\u2028|\u2029/;
+  var lineBreakG = new RegExp(lineBreak.source, "g");
+
+  function isNewLine(code, ecma2019String) {
+    return code === 10 || code === 13 || (!ecma2019String && (code === 0x2028 || code === 0x2029))
+  }
+
+  var nonASCIIwhitespace = /[\u1680\u2000-\u200a\u202f\u205f\u3000\ufeff]/;
+
+  var skipWhiteSpace = /(?:\s|\/\/.*|\/\*[^]*?\*\/)*/g;
+
+  var ref = Object.prototype;
+  var hasOwnProperty = ref.hasOwnProperty;
+  var toString = ref.toString;
+
+  // Checks if an object has a property.
+
+  function has(obj, propName) {
+    return hasOwnProperty.call(obj, propName)
+  }
+
+  var isArray = Array.isArray || (function (obj) { return (
+    toString.call(obj) === "[object Array]"
+  ); });
+
+  function wordsRegexp(words) {
+    return new RegExp("^(?:" + words.replace(/ /g, "|") + ")$")
+  }
+
+  // These are used when `options.locations` is on, for the
+  // `startLoc` and `endLoc` properties.
+
+  var Position = function Position(line, col) {
+    this.line = line;
+    this.column = col;
+  };
+
+  Position.prototype.offset = function offset (n) {
+    return new Position(this.line, this.column + n)
+  };
+
+  var SourceLocation = function SourceLocation(p, start, end) {
+    this.start = start;
+    this.end = end;
+    if (p.sourceFile !== null) { this.source = p.sourceFile; }
+  };
+
+  // The `getLineInfo` function is mostly useful when the
+  // `locations` option is off (for performance reasons) and you
+  // want to find the line/column position for a given character
+  // offset. `input` should be the code string that the offset refers
+  // into.
+
+  function getLineInfo(input, offset) {
+    for (var line = 1, cur = 0;;) {
+      lineBreakG.lastIndex = cur;
+      var match = lineBreakG.exec(input);
+      if (match && match.index < offset) {
+        ++line;
+        cur = match.index + match[0].length;
+      } else {
+        return new Position(line, offset - cur)
+      }
+    }
+  }
+
+  // A second argument must be given to configure the parser process.
+  // These options are recognized (only `ecmaVersion` is required):
+
+  var defaultOptions = {
+    // `ecmaVersion` indicates the ECMAScript version to parse. Must be
+    // either 3, 5, 6 (or 2015), 7 (2016), 8 (2017), 9 (2018), 10
+    // (2019), 11 (2020), 12 (2021), or `"latest"` (the latest version
+    // the library supports). This influences support for strict mode,
+    // the set of reserved words, and support for new syntax features.
+    ecmaVersion: null,
+    // `sourceType` indicates the mode the code should be parsed in.
+    // Can be either `"script"` or `"module"`. This influences global
+    // strict mode and parsing of `import` and `export` declarations.
+    sourceType: "script",
+    // `onInsertedSemicolon` can be a callback that will be called
+    // when a semicolon is automatically inserted. It will be passed
+    // the position of the comma as an offset, and if `locations` is
+    // enabled, it is given the location as a `{line, column}` object
+    // as second argument.
+    onInsertedSemicolon: null,
+    // `onTrailingComma` is similar to `onInsertedSemicolon`, but for
+    // trailing commas.
+    onTrailingComma: null,
+    // By default, reserved words are only enforced if ecmaVersion >= 5.
+    // Set `allowReserved` to a boolean value to explicitly turn this on
+    // an off. When this option has the value "never", reserved words
+    // and keywords can also not be used as property names.
+    allowReserved: null,
+    // When enabled, a return at the top level is not considered an
+    // error.
+    allowReturnOutsideFunction: false,
+    // When enabled, import/export statements are not constrained to
+    // appearing at the top of the program.
+    allowImportExportEverywhere: false,
+    // When enabled, await identifiers are allowed to appear at the top-level scope,
+    // but they are still not allowed in non-async functions.
+    allowAwaitOutsideFunction: false,
+    // When enabled, hashbang directive in the beginning of file
+    // is allowed and treated as a line comment.
+    allowHashBang: false,
+    // When `locations` is on, `loc` properties holding objects with
+    // `start` and `end` properties in `{line, column}` form (with
+    // line being 1-based and column 0-based) will be attached to the
+    // nodes.
+    locations: false,
+    // A function can be passed as `onToken` option, which will
+    // cause Acorn to call that function with object in the same
+    // format as tokens returned from `tokenizer().getToken()`. Note
+    // that you are not allowed to call the parser from the
+    // callback—that will corrupt its internal state.
+    onToken: null,
+    // A function can be passed as `onComment` option, which will
+    // cause Acorn to call that function with `(block, text, start,
+    // end)` parameters whenever a comment is skipped. `block` is a
+    // boolean indicating whether this is a block (`/* */`) comment,
+    // `text` is the content of the comment, and `start` and `end` are
+    // character offsets that denote the start and end of the comment.
+    // When the `locations` option is on, two more parameters are
+    // passed, the full `{line, column}` locations of the start and
+    // end of the comments. Note that you are not allowed to call the
+    // parser from the callback—that will corrupt its internal state.
+    onComment: null,
+    // Nodes have their start and end characters offsets recorded in
+    // `start` and `end` properties (directly on the node, rather than
+    // the `loc` object, which holds line/column data. To also add a
+    // [semi-standardized][range] `range` property holding a `[start,
+    // end]` array with the same numbers, set the `ranges` option to
+    // `true`.
+    //
+    // [range]: https://bugzilla.mozilla.org/show_bug.cgi?id=745678
+    ranges: false,
+    // It is possible to parse multiple files into a single AST by
+    // passing the tree produced by parsing the first file as
+    // `program` option in subsequent parses. This will add the
+    // toplevel forms of the parsed file to the `Program` (top) node
+    // of an existing parse tree.
+    program: null,
+    // When `locations` is on, you can pass this to record the source
+    // file in every node's `loc` object.
+    sourceFile: null,
+    // This value, if given, is stored in every node, whether
+    // `locations` is on or off.
+    directSourceFile: null,
+    // When enabled, parenthesized expressions are represented by
+    // (non-standard) ParenthesizedExpression nodes
+    preserveParens: false
+  };
+
+  // Interpret and default an options object
+
+  var warnedAboutEcmaVersion = false;
+
+  function getOptions(opts) {
+    var options = {};
+
+    for (var opt in defaultOptions)
+      { options[opt] = opts && has(opts, opt) ? opts[opt] : defaultOptions[opt]; }
+
+    if (options.ecmaVersion === "latest") {
+      options.ecmaVersion = 1e8;
+    } else if (options.ecmaVersion == null) {
+      if (!warnedAboutEcmaVersion && typeof console === "object" && console.warn) {
+        warnedAboutEcmaVersion = true;
+        console.warn("Since Acorn 8.0.0, options.ecmaVersion is required.\nDefaulting to 2020, but this will stop working in the future.");
+      }
+      options.ecmaVersion = 11;
+    } else if (options.ecmaVersion >= 2015) {
+      options.ecmaVersion -= 2009;
+    }
+
+    if (options.allowReserved == null)
+      { options.allowReserved = options.ecmaVersion < 5; }
+
+    if (isArray(options.onToken)) {
+      var tokens = options.onToken;
+      options.onToken = function (token) { return tokens.push(token); };
+    }
+    if (isArray(options.onComment))
+      { options.onComment = pushComment(options, options.onComment); }
+
+    return options
+  }
+
+  function pushComment(options, array) {
+    return function(block, text, start, end, startLoc, endLoc) {
+      var comment = {
+        type: block ? "Block" : "Line",
+        value: text,
+        start: start,
+        end: end
+      };
+      if (options.locations)
+        { comment.loc = new SourceLocation(this, startLoc, endLoc); }
+      if (options.ranges)
+        { comment.range = [start, end]; }
+      array.push(comment);
+    }
+  }
+
+  // Each scope gets a bitset that may contain these flags
+  var
+      SCOPE_TOP = 1,
+      SCOPE_FUNCTION = 2,
+      SCOPE_VAR = SCOPE_TOP | SCOPE_FUNCTION,
+      SCOPE_ASYNC = 4,
+      SCOPE_GENERATOR = 8,
+      SCOPE_ARROW = 16,
+      SCOPE_SIMPLE_CATCH = 32,
+      SCOPE_SUPER = 64,
+      SCOPE_DIRECT_SUPER = 128;
+
+  function functionFlags(async, generator) {
+    return SCOPE_FUNCTION | (async ? SCOPE_ASYNC : 0) | (generator ? SCOPE_GENERATOR : 0)
+  }
+
+  // Used in checkLVal* and declareName to determine the type of a binding
+  var
+      BIND_NONE = 0, // Not a binding
+      BIND_VAR = 1, // Var-style binding
+      BIND_LEXICAL = 2, // Let- or const-style binding
+      BIND_FUNCTION = 3, // Function declaration
+      BIND_SIMPLE_CATCH = 4, // Simple (identifier pattern) catch binding
+      BIND_OUTSIDE = 5; // Special case for function names as bound inside the function
+
+  var Parser = function Parser(options, input, startPos) {
+    this.options = options = getOptions(options);
+    this.sourceFile = options.sourceFile;
+    this.keywords = wordsRegexp(keywords[options.ecmaVersion >= 6 ? 6 : options.sourceType === "module" ? "5module" : 5]);
+    var reserved = "";
+    if (options.allowReserved !== true) {
+      reserved = reservedWords[options.ecmaVersion >= 6 ? 6 : options.ecmaVersion === 5 ? 5 : 3];
+      if (options.sourceType === "module") { reserved += " await"; }
+    }
+    this.reservedWords = wordsRegexp(reserved);
+    var reservedStrict = (reserved ? reserved + " " : "") + reservedWords.strict;
+    this.reservedWordsStrict = wordsRegexp(reservedStrict);
+    this.reservedWordsStrictBind = wordsRegexp(reservedStrict + " " + reservedWords.strictBind);
+    this.input = String(input);
+
+    // Used to signal to callers of `readWord1` whether the word
+    // contained any escape sequences. This is needed because words with
+    // escape sequences must not be interpreted as keywords.
+    this.containsEsc = false;
+
+    // Set up token state
+
+    // The current position of the tokenizer in the input.
+    if (startPos) {
+      this.pos = startPos;
+      this.lineStart = this.input.lastIndexOf("\n", startPos - 1) + 1;
+      this.curLine = this.input.slice(0, this.lineStart).split(lineBreak).length;
+    } else {
+      this.pos = this.lineStart = 0;
+      this.curLine = 1;
+    }
+
+    // Properties of the current token:
+    // Its type
+    this.type = types.eof;
+    // For tokens that include more information than their type, the value
+    this.value = null;
+    // Its start and end offset
+    this.start = this.end = this.pos;
+    // And, if locations are used, the {line, column} object
+    // corresponding to those offsets
+    this.startLoc = this.endLoc = this.curPosition();
+
+    // Position information for the previous token
+    this.lastTokEndLoc = this.lastTokStartLoc = null;
+    this.lastTokStart = this.lastTokEnd = this.pos;
+
+    // The context stack is used to superficially track syntactic
+    // context to predict whether a regular expression is allowed in a
+    // given position.
+    this.context = this.initialContext();
+    this.exprAllowed = true;
+
+    // Figure out if it's a module code.
+    this.inModule = options.sourceType === "module";
+    this.strict = this.inModule || this.strictDirective(this.pos);
+
+    // Used to signify the start of a potential arrow function
+    this.potentialArrowAt = -1;
+
+    // Positions to delayed-check that yield/await does not exist in default parameters.
+    this.yieldPos = this.awaitPos = this.awaitIdentPos = 0;
+    // Labels in scope.
+    this.labels = [];
+    // Thus-far undefined exports.
+    this.undefinedExports = Object.create(null);
+
+    // If enabled, skip leading hashbang line.
+    if (this.pos === 0 && options.allowHashBang && this.input.slice(0, 2) === "#!")
+      { this.skipLineComment(2); }
+
+    // Scope tracking for duplicate variable names (see scope.js)
+    this.scopeStack = [];
+    this.enterScope(SCOPE_TOP);
+
+    // For RegExp validation
+    this.regexpState = null;
+  };
+
+  var prototypeAccessors = { inFunction: { configurable: true },inGenerator: { configurable: true },inAsync: { configurable: true },allowSuper: { configurable: true },allowDirectSuper: { configurable: true },treatFunctionsAsVar: { configurable: true },inNonArrowFunction: { configurable: true } };
+
+  Parser.prototype.parse = function parse () {
+    var node = this.options.program || this.startNode();
+    this.nextToken();
+    return this.parseTopLevel(node)
+  };
+
+  prototypeAccessors.inFunction.get = function () { return (this.currentVarScope().flags & SCOPE_FUNCTION) > 0 };
+  prototypeAccessors.inGenerator.get = function () { return (this.currentVarScope().flags & SCOPE_GENERATOR) > 0 };
+  prototypeAccessors.inAsync.get = function () { return (this.currentVarScope().flags & SCOPE_ASYNC) > 0 };
+  prototypeAccessors.allowSuper.get = function () { return (this.currentThisScope().flags & SCOPE_SUPER) > 0 };
+  prototypeAccessors.allowDirectSuper.get = function () { return (this.currentThisScope().flags & SCOPE_DIRECT_SUPER) > 0 };
+  prototypeAccessors.treatFunctionsAsVar.get = function () { return this.treatFunctionsAsVarInScope(this.currentScope()) };
+  prototypeAccessors.inNonArrowFunction.get = function () { return (this.currentThisScope().flags & SCOPE_FUNCTION) > 0 };
+
+  Parser.extend = function extend () {
+      var plugins = [], len = arguments.length;
+      while ( len-- ) plugins[ len ] = arguments[ len ];
+
+    var cls = this;
+    for (var i = 0; i < plugins.length; i++) { cls = plugins[i](cls); }
+    return cls
+  };
+
+  Parser.parse = function parse (input, options) {
+    return new this(options, input).parse()
+  };
+
+  Parser.parseExpressionAt = function parseExpressionAt (input, pos, options) {
+    var parser = new this(options, input, pos);
+    parser.nextToken();
+    return parser.parseExpression()
+  };
+
+  Parser.tokenizer = function tokenizer (input, options) {
+    return new this(options, input)
+  };
+
+  Object.defineProperties( Parser.prototype, prototypeAccessors );
+
+  var pp = Parser.prototype;
+
+  // ## Parser utilities
+
+  var literal = /^(?:'((?:\\.|[^'\\])*?)'|"((?:\\.|[^"\\])*?)")/;
+  pp.strictDirective = function(start) {
+    for (;;) {
+      // Try to find string literal.
+      skipWhiteSpace.lastIndex = start;
+      start += skipWhiteSpace.exec(this.input)[0].length;
+      var match = literal.exec(this.input.slice(start));
+      if (!match) { return false }
+      if ((match[1] || match[2]) === "use strict") {
+        skipWhiteSpace.lastIndex = start + match[0].length;
+        var spaceAfter = skipWhiteSpace.exec(this.input), end = spaceAfter.index + spaceAfter[0].length;
+        var next = this.input.charAt(end);
+        return next === ";" || next === "}" ||
+          (lineBreak.test(spaceAfter[0]) &&
+           !(/[(`.[+\-/*%<>=,?^&]/.test(next) || next === "!" && this.input.charAt(end + 1) === "="))
+      }
+      start += match[0].length;
+
+      // Skip semicolon, if any.
+      skipWhiteSpace.lastIndex = start;
+      start += skipWhiteSpace.exec(this.input)[0].length;
+      if (this.input[start] === ";")
+        { start++; }
+    }
+  };
+
+  // Predicate that tests whether the next token is of the given
+  // type, and if yes, consumes it as a side effect.
+
+  pp.eat = function(type) {
+    if (this.type === type) {
+      this.next();
+      return true
+    } else {
+      return false
+    }
+  };
+
+  // Tests whether parsed token is a contextual keyword.
+
+  pp.isContextual = function(name) {
+    return this.type === types.name && this.value === name && !this.containsEsc
+  };
+
+  // Consumes contextual keyword if possible.
+
+  pp.eatContextual = function(name) {
+    if (!this.isContextual(name)) { return false }
+    this.next();
+    return true
+  };
+
+  // Asserts that following token is given contextual keyword.
+
+  pp.expectContextual = function(name) {
+    if (!this.eatContextual(name)) { this.unexpected(); }
+  };
+
+  // Test whether a semicolon can be inserted at the current position.
+
+  pp.canInsertSemicolon = function() {
+    return this.type === types.eof ||
+      this.type === types.braceR ||
+      lineBreak.test(this.input.slice(this.lastTokEnd, this.start))
+  };
+
+  pp.insertSemicolon = function() {
+    if (this.canInsertSemicolon()) {
+      if (this.options.onInsertedSemicolon)
+        { this.options.onInsertedSemicolon(this.lastTokEnd, this.lastTokEndLoc); }
+      return true
+    }
+  };
+
+  // Consume a semicolon, or, failing that, see if we are allowed to
+  // pretend that there is a semicolon at this position.
+
+  pp.semicolon = function() {
+    if (!this.eat(types.semi) && !this.insertSemicolon()) { this.unexpected(); }
+  };
+
+  pp.afterTrailingComma = function(tokType, notNext) {
+    if (this.type === tokType) {
+      if (this.options.onTrailingComma)
+        { this.options.onTrailingComma(this.lastTokStart, this.lastTokStartLoc); }
+      if (!notNext)
+        { this.next(); }
+      return true
+    }
+  };
+
+  // Expect a token of a given type. If found, consume it, otherwise,
+  // raise an unexpected token error.
+
+  pp.expect = function(type) {
+    this.eat(type) || this.unexpected();
+  };
+
+  // Raise an unexpected token error.
+
+  pp.unexpected = function(pos) {
+    this.raise(pos != null ? pos : this.start, "Unexpected token");
+  };
+
+  function DestructuringErrors() {
+    this.shorthandAssign =
+    this.trailingComma =
+    this.parenthesizedAssign =
+    this.parenthesizedBind =
+    this.doubleProto =
+      -1;
+  }
+
+  pp.checkPatternErrors = function(refDestructuringErrors, isAssign) {
+    if (!refDestructuringErrors) { return }
+    if (refDestructuringErrors.trailingComma > -1)
+      { this.raiseRecoverable(refDestructuringErrors.trailingComma, "Comma is not permitted after the rest element"); }
+    var parens = isAssign ? refDestructuringErrors.parenthesizedAssign : refDestructuringErrors.parenthesizedBind;
+    if (parens > -1) { this.raiseRecoverable(parens, "Parenthesized pattern"); }
+  };
+
+  pp.checkExpressionErrors = function(refDestructuringErrors, andThrow) {
+    if (!refDestructuringErrors) { return false }
+    var shorthandAssign = refDestructuringErrors.shorthandAssign;
+    var doubleProto = refDestructuringErrors.doubleProto;
+    if (!andThrow) { return shorthandAssign >= 0 || doubleProto >= 0 }
+    if (shorthandAssign >= 0)
+      { this.raise(shorthandAssign, "Shorthand property assignments are valid only in destructuring patterns"); }
+    if (doubleProto >= 0)
+      { this.raiseRecoverable(doubleProto, "Redefinition of __proto__ property"); }
+  };
+
+  pp.checkYieldAwaitInDefaultParams = function() {
+    if (this.yieldPos && (!this.awaitPos || this.yieldPos < this.awaitPos))
+      { this.raise(this.yieldPos, "Yield expression cannot be a default value"); }
+    if (this.awaitPos)
+      { this.raise(this.awaitPos, "Await expression cannot be a default value"); }
+  };
+
+  pp.isSimpleAssignTarget = function(expr) {
+    if (expr.type === "ParenthesizedExpression")
+      { return this.isSimpleAssignTarget(expr.expression) }
+    return expr.type === "Identifier" || expr.type === "MemberExpression"
+  };
+
+  var pp$1 = Parser.prototype;
+
+  // ### Statement parsing
+
+  // Parse a program. Initializes the parser, reads any number of
+  // statements, and wraps them in a Program node.  Optionally takes a
+  // `program` argument.  If present, the statements will be appended
+  // to its body instead of creating a new node.
+
+  pp$1.parseTopLevel = function(node) {
+    var exports = Object.create(null);
+    if (!node.body) { node.body = []; }
+    while (this.type !== types.eof) {
+      var stmt = this.parseStatement(null, true, exports);
+      node.body.push(stmt);
+    }
+    if (this.inModule)
+      { for (var i = 0, list = Object.keys(this.undefinedExports); i < list.length; i += 1)
+        {
+          var name = list[i];
+
+          this.raiseRecoverable(this.undefinedExports[name].start, ("Export '" + name + "' is not defined"));
+        } }
+    this.adaptDirectivePrologue(node.body);
+    this.next();
+    node.sourceType = this.options.sourceType;
+    return this.finishNode(node, "Program")
+  };
+
+  var loopLabel = {kind: "loop"}, switchLabel = {kind: "switch"};
+
+  pp$1.isLet = function(context) {
+    if (this.options.ecmaVersion < 6 || !this.isContextual("let")) { return false }
+    skipWhiteSpace.lastIndex = this.pos;
+    var skip = skipWhiteSpace.exec(this.input);
+    var next = this.pos + skip[0].length, nextCh = this.input.charCodeAt(next);
+    // For ambiguous cases, determine if a LexicalDeclaration (or only a
+    // Statement) is allowed here. If context is not empty then only a Statement
+    // is allowed. However, `let [` is an explicit negative lookahead for
+    // ExpressionStatement, so special-case it first.
+    if (nextCh === 91) { return true } // '['
+    if (context) { return false }
+
+    if (nextCh === 123) { return true } // '{'
+    if (isIdentifierStart(nextCh, true)) {
+      var pos = next + 1;
+      while (isIdentifierChar(this.input.charCodeAt(pos), true)) { ++pos; }
+      var ident = this.input.slice(next, pos);
+      if (!keywordRelationalOperator.test(ident)) { return true }
+    }
+    return false
+  };
+
+  // check 'async [no LineTerminator here] function'
+  // - 'async /*foo*/ function' is OK.
+  // - 'async /*\n*/ function' is invalid.
+  pp$1.isAsyncFunction = function() {
+    if (this.options.ecmaVersion < 8 || !this.isContextual("async"))
+      { return false }
+
+    skipWhiteSpace.lastIndex = this.pos;
+    var skip = skipWhiteSpace.exec(this.input);
+    var next = this.pos + skip[0].length;
+    return !lineBreak.test(this.input.slice(this.pos, next)) &&
+      this.input.slice(next, next + 8) === "function" &&
+      (next + 8 === this.input.length || !isIdentifierChar(this.input.charAt(next + 8)))
+  };
+
+  // Parse a single statement.
+  //
+  // If expecting a statement and finding a slash operator, parse a
+  // regular expression literal. This is to handle cases like
+  // `if (foo) /blah/.exec(foo)`, where looking at the previous token
+  // does not help.
+
+  pp$1.parseStatement = function(context, topLevel, exports) {
+    var starttype = this.type, node = this.startNode(), kind;
+
+    if (this.isLet(context)) {
+      starttype = types._var;
+      kind = "let";
+    }
+
+    // Most types of statements are recognized by the keyword they
+    // start with. Many are trivial to parse, some require a bit of
+    // complexity.
+
+    switch (starttype) {
+    case types._break: case types._continue: return this.parseBreakContinueStatement(node, starttype.keyword)
+    case types._debugger: return this.parseDebuggerStatement(node)
+    case types._do: return this.parseDoStatement(node)
+    case types._for: return this.parseForStatement(node)
+    case types._function:
+      // Function as sole body of either an if statement or a labeled statement
+      // works, but not when it is part of a labeled statement that is the sole
+      // body of an if statement.
+      if ((context && (this.strict || context !== "if" && context !== "label")) && this.options.ecmaVersion >= 6) { this.unexpected(); }
+      return this.parseFunctionStatement(node, false, !context)
+    case types._class:
+      if (context) { this.unexpected(); }
+      return this.parseClass(node, true)
+    case types._if: return this.parseIfStatement(node)
+    case types._return: return this.parseReturnStatement(node)
+    case types._switch: return this.parseSwitchStatement(node)
+    case types._throw: return this.parseThrowStatement(node)
+    case types._try: return this.parseTryStatement(node)
+    case types._const: case types._var:
+      kind = kind || this.value;
+      if (context && kind !== "var") { this.unexpected(); }
+      return this.parseVarStatement(node, kind)
+    case types._while: return this.parseWhileStatement(node)
+    case types._with: return this.parseWithStatement(node)
+    case types.braceL: return this.parseBlock(true, node)
+    case types.semi: return this.parseEmptyStatement(node)
+    case types._export:
+    case types._import:
+      if (this.options.ecmaVersion > 10 && starttype === types._import) {
+        skipWhiteSpace.lastIndex = this.pos;
+        var skip = skipWhiteSpace.exec(this.input);
+        var next = this.pos + skip[0].length, nextCh = this.input.charCodeAt(next);
+        if (nextCh === 40 || nextCh === 46) // '(' or '.'
+          { return this.parseExpressionStatement(node, this.parseExpression()) }
+      }
+
+      if (!this.options.allowImportExportEverywhere) {
+        if (!topLevel)
+          { this.raise(this.start, "'import' and 'export' may only appear at the top level"); }
+        if (!this.inModule)
+          { this.raise(this.start, "'import' and 'export' may appear only with 'sourceType: module'"); }
+      }
+      return starttype === types._import ? this.parseImport(node) : this.parseExport(node, exports)
+
+      // If the statement does not start with a statement keyword or a
+      // brace, it's an ExpressionStatement or LabeledStatement. We
+      // simply start parsing an expression, and afterwards, if the
+      // next token is a colon and the expression was a simple
+      // Identifier node, we switch to interpreting it as a label.
+    default:
+      if (this.isAsyncFunction()) {
+        if (context) { this.unexpected(); }
+        this.next();
+        return this.parseFunctionStatement(node, true, !context)
+      }
+
+      var maybeName = this.value, expr = this.parseExpression();
+      if (starttype === types.name && expr.type === "Identifier" && this.eat(types.colon))
+        { return this.parseLabeledStatement(node, maybeName, expr, context) }
+      else { return this.parseExpressionStatement(node, expr) }
+    }
+  };
+
+  pp$1.parseBreakContinueStatement = function(node, keyword) {
+    var isBreak = keyword === "break";
+    this.next();
+    if (this.eat(types.semi) || this.insertSemicolon()) { node.label = null; }
+    else if (this.type !== types.name) { this.unexpected(); }
+    else {
+      node.label = this.parseIdent();
+      this.semicolon();
+    }
+
+    // Verify that there is an actual destination to break or
+    // continue to.
+    var i = 0;
+    for (; i < this.labels.length; ++i) {
+      var lab = this.labels[i];
+      if (node.label == null || lab.name === node.label.name) {
+        if (lab.kind != null && (isBreak || lab.kind === "loop")) { break }
+        if (node.label && isBreak) { break }
+      }
+    }
+    if (i === this.labels.length) { this.raise(node.start, "Unsyntactic " + keyword); }
+    return this.finishNode(node, isBreak ? "BreakStatement" : "ContinueStatement")
+  };
+
+  pp$1.parseDebuggerStatement = function(node) {
+    this.next();
+    this.semicolon();
+    return this.finishNode(node, "DebuggerStatement")
+  };
+
+  pp$1.parseDoStatement = function(node) {
+    this.next();
+    this.labels.push(loopLabel);
+    node.body = this.parseStatement("do");
+    this.labels.pop();
+    this.expect(types._while);
+    node.test = this.parseParenExpression();
+    if (this.options.ecmaVersion >= 6)
+      { this.eat(types.semi); }
+    else
+      { this.semicolon(); }
+    return this.finishNode(node, "DoWhileStatement")
+  };
+
+  // Disambiguating between a `for` and a `for`/`in` or `for`/`of`
+  // loop is non-trivial. Basically, we have to parse the init `var`
+  // statement or expression, disallowing the `in` operator (see
+  // the second parameter to `parseExpression`), and then check
+  // whether the next token is `in` or `of`. When there is no init
+  // part (semicolon immediately after the opening parenthesis), it
+  // is a regular `for` loop.
+
+  pp$1.parseForStatement = function(node) {
+    this.next();
+    var awaitAt = (this.options.ecmaVersion >= 9 && (this.inAsync || (!this.inFunction && this.options.allowAwaitOutsideFunction)) && this.eatContextual("await")) ? this.lastTokStart : -1;
+    this.labels.push(loopLabel);
+    this.enterScope(0);
+    this.expect(types.parenL);
+    if (this.type === types.semi) {
+      if (awaitAt > -1) { this.unexpected(awaitAt); }
+      return this.parseFor(node, null)
+    }
+    var isLet = this.isLet();
+    if (this.type === types._var || this.type === types._const || isLet) {
+      var init$1 = this.startNode(), kind = isLet ? "let" : this.value;
+      this.next();
+      this.parseVar(init$1, true, kind);
+      this.finishNode(init$1, "VariableDeclaration");
+      if ((this.type === types._in || (this.options.ecmaVersion >= 6 && this.isContextual("of"))) && init$1.declarations.length === 1) {
+        if (this.options.ecmaVersion >= 9) {
+          if (this.type === types._in) {
+            if (awaitAt > -1) { this.unexpected(awaitAt); }
+          } else { node.await = awaitAt > -1; }
+        }
+        return this.parseForIn(node, init$1)
+      }
+      if (awaitAt > -1) { this.unexpected(awaitAt); }
+      return this.parseFor(node, init$1)
+    }
+    var refDestructuringErrors = new DestructuringErrors;
+    var init = this.parseExpression(true, refDestructuringErrors);
+    if (this.type === types._in || (this.options.ecmaVersion >= 6 && this.isContextual("of"))) {
+      if (this.options.ecmaVersion >= 9) {
+        if (this.type === types._in) {
+          if (awaitAt > -1) { this.unexpected(awaitAt); }
+        } else { node.await = awaitAt > -1; }
+      }
+      this.toAssignable(init, false, refDestructuringErrors);
+      this.checkLValPattern(init);
+      return this.parseForIn(node, init)
+    } else {
+      this.checkExpressionErrors(refDestructuringErrors, true);
+    }
+    if (awaitAt > -1) { this.unexpected(awaitAt); }
+    return this.parseFor(node, init)
+  };
+
+  pp$1.parseFunctionStatement = function(node, isAsync, declarationPosition) {
+    this.next();
+    return this.parseFunction(node, FUNC_STATEMENT | (declarationPosition ? 0 : FUNC_HANGING_STATEMENT), false, isAsync)
+  };
+
+  pp$1.parseIfStatement = function(node) {
+    this.next();
+    node.test = this.parseParenExpression();
+    // allow function declarations in branches, but only in non-strict mode
+    node.consequent = this.parseStatement("if");
+    node.alternate = this.eat(types._else) ? this.parseStatement("if") : null;
+    return this.finishNode(node, "IfStatement")
+  };
+
+  pp$1.parseReturnStatement = function(node) {
+    if (!this.inFunction && !this.options.allowReturnOutsideFunction)
+      { this.raise(this.start, "'return' outside of function"); }
+    this.next();
+
+    // In `return` (and `break`/`continue`), the keywords with
+    // optional arguments, we eagerly look for a semicolon or the
+    // possibility to insert one.
+
+    if (this.eat(types.semi) || this.insertSemicolon()) { node.argument = null; }
+    else { node.argument = this.parseExpression(); this.semicolon(); }
+    return this.finishNode(node, "ReturnStatement")
+  };
+
+  pp$1.parseSwitchStatement = function(node) {
+    this.next();
+    node.discriminant = this.parseParenExpression();
+    node.cases = [];
+    this.expect(types.braceL);
+    this.labels.push(switchLabel);
+    this.enterScope(0);
+
+    // Statements under must be grouped (by label) in SwitchCase
+    // nodes. `cur` is used to keep the node that we are currently
+    // adding statements to.
+
+    var cur;
+    for (var sawDefault = false; this.type !== types.braceR;) {
+      if (this.type === types._case || this.type === types._default) {
+        var isCase = this.type === types._case;
+        if (cur) { this.finishNode(cur, "SwitchCase"); }
+        node.cases.push(cur = this.startNode());
+        cur.consequent = [];
+        this.next();
+        if (isCase) {
+          cur.test = this.parseExpression();
+        } else {
+          if (sawDefault) { this.raiseRecoverable(this.lastTokStart, "Multiple default clauses"); }
+          sawDefault = true;
+          cur.test = null;
+        }
+        this.expect(types.colon);
+      } else {
+        if (!cur) { this.unexpected(); }
+        cur.consequent.push(this.parseStatement(null));
+      }
+    }
+    this.exitScope();
+    if (cur) { this.finishNode(cur, "SwitchCase"); }
+    this.next(); // Closing brace
+    this.labels.pop();
+    return this.finishNode(node, "SwitchStatement")
+  };
+
+  pp$1.parseThrowStatement = function(node) {
+    this.next();
+    if (lineBreak.test(this.input.slice(this.lastTokEnd, this.start)))
+      { this.raise(this.lastTokEnd, "Illegal newline after throw"); }
+    node.argument = this.parseExpression();
+    this.semicolon();
+    return this.finishNode(node, "ThrowStatement")
+  };
+
+  // Reused empty array added for node fields that are always empty.
+
+  var empty = [];
+
+  pp$1.parseTryStatement = function(node) {
+    this.next();
+    node.block = this.parseBlock();
+    node.handler = null;
+    if (this.type === types._catch) {
+      var clause = this.startNode();
+      this.next();
+      if (this.eat(types.parenL)) {
+        clause.param = this.parseBindingAtom();
+        var simple = clause.param.type === "Identifier";
+        this.enterScope(simple ? SCOPE_SIMPLE_CATCH : 0);
+        this.checkLValPattern(clause.param, simple ? BIND_SIMPLE_CATCH : BIND_LEXICAL);
+        this.expect(types.parenR);
+      } else {
+        if (this.options.ecmaVersion < 10) { this.unexpected(); }
+        clause.param = null;
+        this.enterScope(0);
+      }
+      clause.body = this.parseBlock(false);
+      this.exitScope();
+      node.handler = this.finishNode(clause, "CatchClause");
+    }
+    node.finalizer = this.eat(types._finally) ? this.parseBlock() : null;
+    if (!node.handler && !node.finalizer)
+      { this.raise(node.start, "Missing catch or finally clause"); }
+    return this.finishNode(node, "TryStatement")
+  };
+
+  pp$1.parseVarStatement = function(node, kind) {
+    this.next();
+    this.parseVar(node, false, kind);
+    this.semicolon();
+    return this.finishNode(node, "VariableDeclaration")
+  };
+
+  pp$1.parseWhileStatement = function(node) {
+    this.next();
+    node.test = this.parseParenExpression();
+    this.labels.push(loopLabel);
+    node.body = this.parseStatement("while");
+    this.labels.pop();
+    return this.finishNode(node, "WhileStatement")
+  };
+
+  pp$1.parseWithStatement = function(node) {
+    if (this.strict) { this.raise(this.start, "'with' in strict mode"); }
+    this.next();
+    node.object = this.parseParenExpression();
+    node.body = this.parseStatement("with");
+    return this.finishNode(node, "WithStatement")
+  };
+
+  pp$1.parseEmptyStatement = function(node) {
+    this.next();
+    return this.finishNode(node, "EmptyStatement")
+  };
+
+  pp$1.parseLabeledStatement = function(node, maybeName, expr, context) {
+    for (var i$1 = 0, list = this.labels; i$1 < list.length; i$1 += 1)
+      {
+      var label = list[i$1];
+
+      if (label.name === maybeName)
+        { this.raise(expr.start, "Label '" + maybeName + "' is already declared");
+    } }
+    var kind = this.type.isLoop ? "loop" : this.type === types._switch ? "switch" : null;
+    for (var i = this.labels.length - 1; i >= 0; i--) {
+      var label$1 = this.labels[i];
+      if (label$1.statementStart === node.start) {
+        // Update information about previous labels on this node
+        label$1.statementStart = this.start;
+        label$1.kind = kind;
+      } else { break }
+    }
+    this.labels.push({name: maybeName, kind: kind, statementStart: this.start});
+    node.body = this.parseStatement(context ? context.indexOf("label") === -1 ? context + "label" : context : "label");
+    this.labels.pop();
+    node.label = expr;
+    return this.finishNode(node, "LabeledStatement")
+  };
+
+  pp$1.parseExpressionStatement = function(node, expr) {
+    node.expression = expr;
+    this.semicolon();
+    return this.finishNode(node, "ExpressionStatement")
+  };
+
+  // Parse a semicolon-enclosed block of statements, handling `"use
+  // strict"` declarations when `allowStrict` is true (used for
+  // function bodies).
+
+  pp$1.parseBlock = function(createNewLexicalScope, node, exitStrict) {
+    if ( createNewLexicalScope === void 0 ) createNewLexicalScope = true;
+    if ( node === void 0 ) node = this.startNode();
+
+    node.body = [];
+    this.expect(types.braceL);
+    if (createNewLexicalScope) { this.enterScope(0); }
+    while (this.type !== types.braceR) {
+      var stmt = this.parseStatement(null);
+      node.body.push(stmt);
+    }
+    if (exitStrict) { this.strict = false; }
+    this.next();
+    if (createNewLexicalScope) { this.exitScope(); }
+    return this.finishNode(node, "BlockStatement")
+  };
+
+  // Parse a regular `for` loop. The disambiguation code in
+  // `parseStatement` will already have parsed the init statement or
+  // expression.
+
+  pp$1.parseFor = function(node, init) {
+    node.init = init;
+    this.expect(types.semi);
+    node.test = this.type === types.semi ? null : this.parseExpression();
+    this.expect(types.semi);
+    node.update = this.type === types.parenR ? null : this.parseExpression();
+    this.expect(types.parenR);
+    node.body = this.parseStatement("for");
+    this.exitScope();
+    this.labels.pop();
+    return this.finishNode(node, "ForStatement")
+  };
+
+  // Parse a `for`/`in` and `for`/`of` loop, which are almost
+  // same from parser's perspective.
+
+  pp$1.parseForIn = function(node, init) {
+    var isForIn = this.type === types._in;
+    this.next();
+
+    if (
+      init.type === "VariableDeclaration" &&
+      init.declarations[0].init != null &&
+      (
+        !isForIn ||
+        this.options.ecmaVersion < 8 ||
+        this.strict ||
+        init.kind !== "var" ||
+        init.declarations[0].id.type !== "Identifier"
+      )
+    ) {
+      this.raise(
+        init.start,
+        ((isForIn ? "for-in" : "for-of") + " loop variable declaration may not have an initializer")
+      );
+    }
+    node.left = init;
+    node.right = isForIn ? this.parseExpression() : this.parseMaybeAssign();
+    this.expect(types.parenR);
+    node.body = this.parseStatement("for");
+    this.exitScope();
+    this.labels.pop();
+    return this.finishNode(node, isForIn ? "ForInStatement" : "ForOfStatement")
+  };
+
+  // Parse a list of variable declarations.
+
+  pp$1.parseVar = function(node, isFor, kind) {
+    node.declarations = [];
+    node.kind = kind;
+    for (;;) {
+      var decl = this.startNode();
+      this.parseVarId(decl, kind);
+      if (this.eat(types.eq)) {
+        decl.init = this.parseMaybeAssign(isFor);
+      } else if (kind === "const" && !(this.type === types._in || (this.options.ecmaVersion >= 6 && this.isContextual("of")))) {
+        this.unexpected();
+      } else if (decl.id.type !== "Identifier" && !(isFor && (this.type === types._in || this.isContextual("of")))) {
+        this.raise(this.lastTokEnd, "Complex binding patterns require an initialization value");
+      } else {
+        decl.init = null;
+      }
+      node.declarations.push(this.finishNode(decl, "VariableDeclarator"));
+      if (!this.eat(types.comma)) { break }
+    }
+    return node
+  };
+
+  pp$1.parseVarId = function(decl, kind) {
+    decl.id = this.parseBindingAtom();
+    this.checkLValPattern(decl.id, kind === "var" ? BIND_VAR : BIND_LEXICAL, false);
+  };
+
+  var FUNC_STATEMENT = 1, FUNC_HANGING_STATEMENT = 2, FUNC_NULLABLE_ID = 4;
+
+  // Parse a function declaration or literal (depending on the
+  // `statement & FUNC_STATEMENT`).
+
+  // Remove `allowExpressionBody` for 7.0.0, as it is only called with false
+  pp$1.parseFunction = function(node, statement, allowExpressionBody, isAsync) {
+    this.initFunction(node);
+    if (this.options.ecmaVersion >= 9 || this.options.ecmaVersion >= 6 && !isAsync) {
+      if (this.type === types.star && (statement & FUNC_HANGING_STATEMENT))
+        { this.unexpected(); }
+      node.generator = this.eat(types.star);
+    }
+    if (this.options.ecmaVersion >= 8)
+      { node.async = !!isAsync; }
+
+    if (statement & FUNC_STATEMENT) {
+      node.id = (statement & FUNC_NULLABLE_ID) && this.type !== types.name ? null : this.parseIdent();
+      if (node.id && !(statement & FUNC_HANGING_STATEMENT))
+        // If it is a regular function declaration in sloppy mode, then it is
+        // subject to Annex B semantics (BIND_FUNCTION). Otherwise, the binding
+        // mode depends on properties of the current scope (see
+        // treatFunctionsAsVar).
+        { this.checkLValSimple(node.id, (this.strict || node.generator || node.async) ? this.treatFunctionsAsVar ? BIND_VAR : BIND_LEXICAL : BIND_FUNCTION); }
+    }
+
+    var oldYieldPos = this.yieldPos, oldAwaitPos = this.awaitPos, oldAwaitIdentPos = this.awaitIdentPos;
+    this.yieldPos = 0;
+    this.awaitPos = 0;
+    this.awaitIdentPos = 0;
+    this.enterScope(functionFlags(node.async, node.generator));
+
+    if (!(statement & FUNC_STATEMENT))
+      { node.id = this.type === types.name ? this.parseIdent() : null; }
+
+    this.parseFunctionParams(node);
+    this.parseFunctionBody(node, allowExpressionBody, false);
+
+    this.yieldPos = oldYieldPos;
+    this.awaitPos = oldAwaitPos;
+    this.awaitIdentPos = oldAwaitIdentPos;
+    return this.finishNode(node, (statement & FUNC_STATEMENT) ? "FunctionDeclaration" : "FunctionExpression")
+  };
+
+  pp$1.parseFunctionParams = function(node) {
+    this.expect(types.parenL);
+    node.params = this.parseBindingList(types.parenR, false, this.options.ecmaVersion >= 8);
+    this.checkYieldAwaitInDefaultParams();
+  };
+
+  // Parse a class declaration or literal (depending on the
+  // `isStatement` parameter).
+
+  pp$1.parseClass = function(node, isStatement) {
+    this.next();
+
+    // ecma-262 14.6 Class Definitions
+    // A class definition is always strict mode code.
+    var oldStrict = this.strict;
+    this.strict = true;
+
+    this.parseClassId(node, isStatement);
+    this.parseClassSuper(node);
+    var classBody = this.startNode();
+    var hadConstructor = false;
+    classBody.body = [];
+    this.expect(types.braceL);
+    while (this.type !== types.braceR) {
+      var element = this.parseClassElement(node.superClass !== null);
+      if (element) {
+        classBody.body.push(element);
+        if (element.type === "MethodDefinition" && element.kind === "constructor") {
+          if (hadConstructor) { this.raise(element.start, "Duplicate constructor in the same class"); }
+          hadConstructor = true;
+        }
+      }
+    }
+    this.strict = oldStrict;
+    this.next();
+    node.body = this.finishNode(classBody, "ClassBody");
+    return this.finishNode(node, isStatement ? "ClassDeclaration" : "ClassExpression")
+  };
+
+  pp$1.parseClassElement = function(constructorAllowsSuper) {
+    var this$1 = this;
+
+    if (this.eat(types.semi)) { return null }
+
+    var method = this.startNode();
+    var tryContextual = function (k, noLineBreak) {
+      if ( noLineBreak === void 0 ) noLineBreak = false;
+
+      var start = this$1.start, startLoc = this$1.startLoc;
+      if (!this$1.eatContextual(k)) { return false }
+      if (this$1.type !== types.parenL && (!noLineBreak || !this$1.canInsertSemicolon())) { return true }
+      if (method.key) { this$1.unexpected(); }
+      method.computed = false;
+      method.key = this$1.startNodeAt(start, startLoc);
+      method.key.name = k;
+      this$1.finishNode(method.key, "Identifier");
+      return false
+    };
+
+    method.kind = "method";
+    method.static = tryContextual("static");
+    var isGenerator = this.eat(types.star);
+    var isAsync = false;
+    if (!isGenerator) {
+      if (this.options.ecmaVersion >= 8 && tryContextual("async", true)) {
+        isAsync = true;
+        isGenerator = this.options.ecmaVersion >= 9 && this.eat(types.star);
+      } else if (tryContextual("get")) {
+        method.kind = "get";
+      } else if (tryContextual("set")) {
+        method.kind = "set";
+      }
+    }
+    if (!method.key) { this.parsePropertyName(method); }
+    var key = method.key;
+    var allowsDirectSuper = false;
+    if (!method.computed && !method.static && (key.type === "Identifier" && key.name === "constructor" ||
+        key.type === "Literal" && key.value === "constructor")) {
+      if (method.kind !== "method") { this.raise(key.start, "Constructor can't have get/set modifier"); }
+      if (isGenerator) { this.raise(key.start, "Constructor can't be a generator"); }
+      if (isAsync) { this.raise(key.start, "Constructor can't be an async method"); }
+      method.kind = "constructor";
+      allowsDirectSuper = constructorAllowsSuper;
+    } else if (method.static && key.type === "Identifier" && key.name === "prototype") {
+      this.raise(key.start, "Classes may not have a static property named prototype");
+    }
+    this.parseClassMethod(method, isGenerator, isAsync, allowsDirectSuper);
+    if (method.kind === "get" && method.value.params.length !== 0)
+      { this.raiseRecoverable(method.value.start, "getter should have no params"); }
+    if (method.kind === "set" && method.value.params.length !== 1)
+      { this.raiseRecoverable(method.value.start, "setter should have exactly one param"); }
+    if (method.kind === "set" && method.value.params[0].type === "RestElement")
+      { this.raiseRecoverable(method.value.params[0].start, "Setter cannot use rest params"); }
+    return method
+  };
+
+  pp$1.parseClassMethod = function(method, isGenerator, isAsync, allowsDirectSuper) {
+    method.value = this.parseMethod(isGenerator, isAsync, allowsDirectSuper);
+    return this.finishNode(method, "MethodDefinition")
+  };
+
+  pp$1.parseClassId = function(node, isStatement) {
+    if (this.type === types.name) {
+      node.id = this.parseIdent();
+      if (isStatement)
+        { this.checkLValSimple(node.id, BIND_LEXICAL, false); }
+    } else {
+      if (isStatement === true)
+        { this.unexpected(); }
+      node.id = null;
+    }
+  };
+
+  pp$1.parseClassSuper = function(node) {
+    node.superClass = this.eat(types._extends) ? this.parseExprSubscripts() : null;
+  };
+
+  // Parses module export declaration.
+
+  pp$1.parseExport = function(node, exports) {
+    this.next();
+    // export * from '...'
+    if (this.eat(types.star)) {
+      if (this.options.ecmaVersion >= 11) {
+        if (this.eatContextual("as")) {
+          node.exported = this.parseIdent(true);
+          this.checkExport(exports, node.exported.name, this.lastTokStart);
+        } else {
+          node.exported = null;
+        }
+      }
+      this.expectContextual("from");
+      if (this.type !== types.string) { this.unexpected(); }
+      node.source = this.parseExprAtom();
+      this.semicolon();
+      return this.finishNode(node, "ExportAllDeclaration")
+    }
+    if (this.eat(types._default)) { // export default ...
+      this.checkExport(exports, "default", this.lastTokStart);
+      var isAsync;
+      if (this.type === types._function || (isAsync = this.isAsyncFunction())) {
+        var fNode = this.startNode();
+        this.next();
+        if (isAsync) { this.next(); }
+        node.declaration = this.parseFunction(fNode, FUNC_STATEMENT | FUNC_NULLABLE_ID, false, isAsync);
+      } else if (this.type === types._class) {
+        var cNode = this.startNode();
+        node.declaration = this.parseClass(cNode, "nullableID");
+      } else {
+        node.declaration = this.parseMaybeAssign();
+        this.semicolon();
+      }
+      return this.finishNode(node, "ExportDefaultDeclaration")
+    }
+    // export var|const|let|function|class ...
+    if (this.shouldParseExportStatement()) {
+      node.declaration = this.parseStatement(null);
+      if (node.declaration.type === "VariableDeclaration")
+        { this.checkVariableExport(exports, node.declaration.declarations); }
+      else
+        { this.checkExport(exports, node.declaration.id.name, node.declaration.id.start); }
+      node.specifiers = [];
+      node.source = null;
+    } else { // export { x, y as z } [from '...']
+      node.declaration = null;
+      node.specifiers = this.parseExportSpecifiers(exports);
+      if (this.eatContextual("from")) {
+        if (this.type !== types.string) { this.unexpected(); }
+        node.source = this.parseExprAtom();
+      } else {
+        for (var i = 0, list = node.specifiers; i < list.length; i += 1) {
+          // check for keywords used as local names
+          var spec = list[i];
+
+          this.checkUnreserved(spec.local);
+          // check if export is defined
+          this.checkLocalExport(spec.local);
+        }
+
+        node.source = null;
+      }
+      this.semicolon();
+    }
+    return this.finishNode(node, "ExportNamedDeclaration")
+  };
+
+  pp$1.checkExport = function(exports, name, pos) {
+    if (!exports) { return }
+    if (has(exports, name))
+      { this.raiseRecoverable(pos, "Duplicate export '" + name + "'"); }
+    exports[name] = true;
+  };
+
+  pp$1.checkPatternExport = function(exports, pat) {
+    var type = pat.type;
+    if (type === "Identifier")
+      { this.checkExport(exports, pat.name, pat.start); }
+    else if (type === "ObjectPattern")
+      { for (var i = 0, list = pat.properties; i < list.length; i += 1)
+        {
+          var prop = list[i];
+
+          this.checkPatternExport(exports, prop);
+        } }
+    else if (type === "ArrayPattern")
+      { for (var i$1 = 0, list$1 = pat.elements; i$1 < list$1.length; i$1 += 1) {
+        var elt = list$1[i$1];
+
+          if (elt) { this.checkPatternExport(exports, elt); }
+      } }
+    else if (type === "Property")
+      { this.checkPatternExport(exports, pat.value); }
+    else if (type === "AssignmentPattern")
+      { this.checkPatternExport(exports, pat.left); }
+    else if (type === "RestElement")
+      { this.checkPatternExport(exports, pat.argument); }
+    else if (type === "ParenthesizedExpression")
+      { this.checkPatternExport(exports, pat.expression); }
+  };
+
+  pp$1.checkVariableExport = function(exports, decls) {
+    if (!exports) { return }
+    for (var i = 0, list = decls; i < list.length; i += 1)
+      {
+      var decl = list[i];
+
+      this.checkPatternExport(exports, decl.id);
+    }
+  };
+
+  pp$1.shouldParseExportStatement = function() {
+    return this.type.keyword === "var" ||
+      this.type.keyword === "const" ||
+      this.type.keyword === "class" ||
+      this.type.keyword === "function" ||
+      this.isLet() ||
+      this.isAsyncFunction()
+  };
+
+  // Parses a comma-separated list of module exports.
+
+  pp$1.parseExportSpecifiers = function(exports) {
+    var nodes = [], first = true;
+    // export { x, y as z } [from '...']
+    this.expect(types.braceL);
+    while (!this.eat(types.braceR)) {
+      if (!first) {
+        this.expect(types.comma);
+        if (this.afterTrailingComma(types.braceR)) { break }
+      } else { first = false; }
+
+      var node = this.startNode();
+      node.local = this.parseIdent(true);
+      node.exported = this.eatContextual("as") ? this.parseIdent(true) : node.local;
+      this.checkExport(exports, node.exported.name, node.exported.start);
+      nodes.push(this.finishNode(node, "ExportSpecifier"));
+    }
+    return nodes
+  };
+
+  // Parses import declaration.
+
+  pp$1.parseImport = function(node) {
+    this.next();
+    // import '...'
+    if (this.type === types.string) {
+      node.specifiers = empty;
+      node.source = this.parseExprAtom();
+    } else {
+      node.specifiers = this.parseImportSpecifiers();
+      this.expectContextual("from");
+      node.source = this.type === types.string ? this.parseExprAtom() : this.unexpected();
+    }
+    this.semicolon();
+    return this.finishNode(node, "ImportDeclaration")
+  };
+
+  // Parses a comma-separated list of module imports.
+
+  pp$1.parseImportSpecifiers = function() {
+    var nodes = [], first = true;
+    if (this.type === types.name) {
+      // import defaultObj, { x, y as z } from '...'
+      var node = this.startNode();
+      node.local = this.parseIdent();
+      this.checkLValSimple(node.local, BIND_LEXICAL);
+      nodes.push(this.finishNode(node, "ImportDefaultSpecifier"));
+      if (!this.eat(types.comma)) { return nodes }
+    }
+    if (this.type === types.star) {
+      var node$1 = this.startNode();
+      this.next();
+      this.expectContextual("as");
+      node$1.local = this.parseIdent();
+      this.checkLValSimple(node$1.local, BIND_LEXICAL);
+      nodes.push(this.finishNode(node$1, "ImportNamespaceSpecifier"));
+      return nodes
+    }
+    this.expect(types.braceL);
+    while (!this.eat(types.braceR)) {
+      if (!first) {
+        this.expect(types.comma);
+        if (this.afterTrailingComma(types.braceR)) { break }
+      } else { first = false; }
+
+      var node$2 = this.startNode();
+      node$2.imported = this.parseIdent(true);
+      if (this.eatContextual("as")) {
+        node$2.local = this.parseIdent();
+      } else {
+        this.checkUnreserved(node$2.imported);
+        node$2.local = node$2.imported;
+      }
+      this.checkLValSimple(node$2.local, BIND_LEXICAL);
+      nodes.push(this.finishNode(node$2, "ImportSpecifier"));
+    }
+    return nodes
+  };
+
+  // Set `ExpressionStatement#directive` property for directive prologues.
+  pp$1.adaptDirectivePrologue = function(statements) {
+    for (var i = 0; i < statements.length && this.isDirectiveCandidate(statements[i]); ++i) {
+      statements[i].directive = statements[i].expression.raw.slice(1, -1);
+    }
+  };
+  pp$1.isDirectiveCandidate = function(statement) {
+    return (
+      statement.type === "ExpressionStatement" &&
+      statement.expression.type === "Literal" &&
+      typeof statement.expression.value === "string" &&
+      // Reject parenthesized strings.
+      (this.input[statement.start] === "\"" || this.input[statement.start] === "'")
+    )
+  };
+
+  var pp$2 = Parser.prototype;
+
+  // Convert existing expression atom to assignable pattern
+  // if possible.
+
+  pp$2.toAssignable = function(node, isBinding, refDestructuringErrors) {
+    if (this.options.ecmaVersion >= 6 && node) {
+      switch (node.type) {
+      case "Identifier":
+        if (this.inAsync && node.name === "await")
+          { this.raise(node.start, "Cannot use 'await' as identifier inside an async function"); }
+        break
+
+      case "ObjectPattern":
+      case "ArrayPattern":
+      case "AssignmentPattern":
+      case "RestElement":
+        break
+
+      case "ObjectExpression":
+        node.type = "ObjectPattern";
+        if (refDestructuringErrors) { this.checkPatternErrors(refDestructuringErrors, true); }
+        for (var i = 0, list = node.properties; i < list.length; i += 1) {
+          var prop = list[i];
+
+        this.toAssignable(prop, isBinding);
+          // Early error:
+          //   AssignmentRestProperty[Yield, Await] :
+          //     `...` DestructuringAssignmentTarget[Yield, Await]
+          //
+          //   It is a Syntax Error if |DestructuringAssignmentTarget| is an |ArrayLiteral| or an |ObjectLiteral|.
+          if (
+            prop.type === "RestElement" &&
+            (prop.argument.type === "ArrayPattern" || prop.argument.type === "ObjectPattern")
+          ) {
+            this.raise(prop.argument.start, "Unexpected token");
+          }
+        }
+        break
+
+      case "Property":
+        // AssignmentProperty has type === "Property"
+        if (node.kind !== "init") { this.raise(node.key.start, "Object pattern can't contain getter or setter"); }
+        this.toAssignable(node.value, isBinding);
+        break
+
+      case "ArrayExpression":
+        node.type = "ArrayPattern";
+        if (refDestructuringErrors) { this.checkPatternErrors(refDestructuringErrors, true); }
+        this.toAssignableList(node.elements, isBinding);
+        break
+
+      case "SpreadElement":
+        node.type = "RestElement";
+        this.toAssignable(node.argument, isBinding);
+        if (node.argument.type === "AssignmentPattern")
+          { this.raise(node.argument.start, "Rest elements cannot have a default value"); }
+        break
+
+      case "AssignmentExpression":
+        if (node.operator !== "=") { this.raise(node.left.end, "Only '=' operator can be used for specifying default value."); }
+        node.type = "AssignmentPattern";
+        delete node.operator;
+        this.toAssignable(node.left, isBinding);
+        break
+
+      case "ParenthesizedExpression":
+        this.toAssignable(node.expression, isBinding, refDestructuringErrors);
+        break
+
+      case "ChainExpression":
+        this.raiseRecoverable(node.start, "Optional chaining cannot appear in left-hand side");
+        break
+
+      case "MemberExpression":
+        if (!isBinding) { break }
+
+      default:
+        this.raise(node.start, "Assigning to rvalue");
+      }
+    } else if (refDestructuringErrors) { this.checkPatternErrors(refDestructuringErrors, true); }
+    return node
+  };
+
+  // Convert list of expression atoms to binding list.
+
+  pp$2.toAssignableList = function(exprList, isBinding) {
+    var end = exprList.length;
+    for (var i = 0; i < end; i++) {
+      var elt = exprList[i];
+      if (elt) { this.toAssignable(elt, isBinding); }
+    }
+    if (end) {
+      var last = exprList[end - 1];
+      if (this.options.ecmaVersion === 6 && isBinding && last && last.type === "RestElement" && last.argument.type !== "Identifier")
+        { this.unexpected(last.argument.start); }
+    }
+    return exprList
+  };
+
+  // Parses spread element.
+
+  pp$2.parseSpread = function(refDestructuringErrors) {
+    var node = this.startNode();
+    this.next();
+    node.argument = this.parseMaybeAssign(false, refDestructuringErrors);
+    return this.finishNode(node, "SpreadElement")
+  };
+
+  pp$2.parseRestBinding = function() {
+    var node = this.startNode();
+    this.next();
+
+    // RestElement inside of a function parameter must be an identifier
+    if (this.options.ecmaVersion === 6 && this.type !== types.name)
+      { this.unexpected(); }
+
+    node.argument = this.parseBindingAtom();
+
+    return this.finishNode(node, "RestElement")
+  };
+
+  // Parses lvalue (assignable) atom.
+
+  pp$2.parseBindingAtom = function() {
+    if (this.options.ecmaVersion >= 6) {
+      switch (this.type) {
+      case types.bracketL:
+        var node = this.startNode();
+        this.next();
+        node.elements = this.parseBindingList(types.bracketR, true, true);
+        return this.finishNode(node, "ArrayPattern")
+
+      case types.braceL:
+        return this.parseObj(true)
+      }
+    }
+    return this.parseIdent()
+  };
+
+  pp$2.parseBindingList = function(close, allowEmpty, allowTrailingComma) {
+    var elts = [], first = true;
+    while (!this.eat(close)) {
+      if (first) { first = false; }
+      else { this.expect(types.comma); }
+      if (allowEmpty && this.type === types.comma) {
+        elts.push(null);
+      } else if (allowTrailingComma && this.afterTrailingComma(close)) {
+        break
+      } else if (this.type === types.ellipsis) {
+        var rest = this.parseRestBinding();
+        this.parseBindingListItem(rest);
+        elts.push(rest);
+        if (this.type === types.comma) { this.raise(this.start, "Comma is not permitted after the rest element"); }
+        this.expect(close);
+        break
+      } else {
+        var elem = this.parseMaybeDefault(this.start, this.startLoc);
+        this.parseBindingListItem(elem);
+        elts.push(elem);
+      }
+    }
+    return elts
+  };
+
+  pp$2.parseBindingListItem = function(param) {
+    return param
+  };
+
+  // Parses assignment pattern around given atom if possible.
+
+  pp$2.parseMaybeDefault = function(startPos, startLoc, left) {
+    left = left || this.parseBindingAtom();
+    if (this.options.ecmaVersion < 6 || !this.eat(types.eq)) { return left }
+    var node = this.startNodeAt(startPos, startLoc);
+    node.left = left;
+    node.right = this.parseMaybeAssign();
+    return this.finishNode(node, "AssignmentPattern")
+  };
+
+  // The following three functions all verify that a node is an lvalue —
+  // something that can be bound, or assigned to. In order to do so, they perform
+  // a variety of checks:
+  //
+  // - Check that none of the bound/assigned-to identifiers are reserved words.
+  // - Record name declarations for bindings in the appropriate scope.
+  // - Check duplicate argument names, if checkClashes is set.
+  //
+  // If a complex binding pattern is encountered (e.g., object and array
+  // destructuring), the entire pattern is recursively checked.
+  //
+  // There are three versions of checkLVal*() appropriate for different
+  // circumstances:
+  //
+  // - checkLValSimple() shall be used if the syntactic construct supports
+  //   nothing other than identifiers and member expressions. Parenthesized
+  //   expressions are also correctly handled. This is generally appropriate for
+  //   constructs for which the spec says
+  //
+  //   > It is a Syntax Error if AssignmentTargetType of [the production] is not
+  //   > simple.
+  //
+  //   It is also appropriate for checking if an identifier is valid and not
+  //   defined elsewhere, like import declarations or function/class identifiers.
+  //
+  //   Examples where this is used include:
+  //     a += …;
+  //     import a from '…';
+  //   where a is the node to be checked.
+  //
+  // - checkLValPattern() shall be used if the syntactic construct supports
+  //   anything checkLValSimple() supports, as well as object and array
+  //   destructuring patterns. This is generally appropriate for constructs for
+  //   which the spec says
+  //
+  //   > It is a Syntax Error if [the production] is neither an ObjectLiteral nor
+  //   > an ArrayLiteral and AssignmentTargetType of [the production] is not
+  //   > simple.
+  //
+  //   Examples where this is used include:
+  //     (a = …);
+  //     const a = …;
+  //     try { … } catch (a) { … }
+  //   where a is the node to be checked.
+  //
+  // - checkLValInnerPattern() shall be used if the syntactic construct supports
+  //   anything checkLValPattern() supports, as well as default assignment
+  //   patterns, rest elements, and other constructs that may appear within an
+  //   object or array destructuring pattern.
+  //
+  //   As a special case, function parameters also use checkLValInnerPattern(),
+  //   as they also support defaults and rest constructs.
+  //
+  // These functions deliberately support both assignment and binding constructs,
+  // as the logic for both is exceedingly similar. If the node is the target of
+  // an assignment, then bindingType should be set to BIND_NONE. Otherwise, it
+  // should be set to the appropriate BIND_* constant, like BIND_VAR or
+  // BIND_LEXICAL.
+  //
+  // If the function is called with a non-BIND_NONE bindingType, then
+  // additionally a checkClashes object may be specified to allow checking for
+  // duplicate argument names. checkClashes is ignored if the provided construct
+  // is an assignment (i.e., bindingType is BIND_NONE).
+
+  pp$2.checkLValSimple = function(expr, bindingType, checkClashes) {
+    if ( bindingType === void 0 ) bindingType = BIND_NONE;
+
+    var isBind = bindingType !== BIND_NONE;
+
+    switch (expr.type) {
+    case "Identifier":
+      if (this.strict && this.reservedWordsStrictBind.test(expr.name))
+        { this.raiseRecoverable(expr.start, (isBind ? "Binding " : "Assigning to ") + expr.name + " in strict mode"); }
+      if (isBind) {
+        if (bindingType === BIND_LEXICAL && expr.name === "let")
+          { this.raiseRecoverable(expr.start, "let is disallowed as a lexically bound name"); }
+        if (checkClashes) {
+          if (has(checkClashes, expr.name))
+            { this.raiseRecoverable(expr.start, "Argument name clash"); }
+          checkClashes[expr.name] = true;
+        }
+        if (bindingType !== BIND_OUTSIDE) { this.declareName(expr.name, bindingType, expr.start); }
+      }
+      break
+
+    case "ChainExpression":
+      this.raiseRecoverable(expr.start, "Optional chaining cannot appear in left-hand side");
+      break
+
+    case "MemberExpression":
+      if (isBind) { this.raiseRecoverable(expr.start, "Binding member expression"); }
+      break
+
+    case "ParenthesizedExpression":
+      if (isBind) { this.raiseRecoverable(expr.start, "Binding parenthesized expression"); }
+      return this.checkLValSimple(expr.expression, bindingType, checkClashes)
+
+    default:
+      this.raise(expr.start, (isBind ? "Binding" : "Assigning to") + " rvalue");
+    }
+  };
+
+  pp$2.checkLValPattern = function(expr, bindingType, checkClashes) {
+    if ( bindingType === void 0 ) bindingType = BIND_NONE;
+
+    switch (expr.type) {
+    case "ObjectPattern":
+      for (var i = 0, list = expr.properties; i < list.length; i += 1) {
+        var prop = list[i];
+
+      this.checkLValInnerPattern(prop, bindingType, checkClashes);
+      }
+      break
+
+    case "ArrayPattern":
+      for (var i$1 = 0, list$1 = expr.elements; i$1 < list$1.length; i$1 += 1) {
+        var elem = list$1[i$1];
+
+      if (elem) { this.checkLValInnerPattern(elem, bindingType, checkClashes); }
+      }
+      break
+
+    default:
+      this.checkLValSimple(expr, bindingType, checkClashes);
+    }
+  };
+
+  pp$2.checkLValInnerPattern = function(expr, bindingType, checkClashes) {
+    if ( bindingType === void 0 ) bindingType = BIND_NONE;
+
+    switch (expr.type) {
+    case "Property":
+      // AssignmentProperty has type === "Property"
+      this.checkLValInnerPattern(expr.value, bindingType, checkClashes);
+      break
+
+    case "AssignmentPattern":
+      this.checkLValPattern(expr.left, bindingType, checkClashes);
+      break
+
+    case "RestElement":
+      this.checkLValPattern(expr.argument, bindingType, checkClashes);
+      break
+
+    default:
+      this.checkLValPattern(expr, bindingType, checkClashes);
+    }
+  };
+
+  // A recursive descent parser operates by defining functions for all
+
+  var pp$3 = Parser.prototype;
+
+  // Check if property name clashes with already added.
+  // Object/class getters and setters are not allowed to clash —
+  // either with each other or with an init property — and in
+  // strict mode, init properties are also not allowed to be repeated.
+
+  pp$3.checkPropClash = function(prop, propHash, refDestructuringErrors) {
+    if (this.options.ecmaVersion >= 9 && prop.type === "SpreadElement")
+      { return }
+    if (this.options.ecmaVersion >= 6 && (prop.computed || prop.method || prop.shorthand))
+      { return }
+    var key = prop.key;
+    var name;
+    switch (key.type) {
+    case "Identifier": name = key.name; break
+    case "Literal": name = String(key.value); break
+    default: return
+    }
+    var kind = prop.kind;
+    if (this.options.ecmaVersion >= 6) {
+      if (name === "__proto__" && kind === "init") {
+        if (propHash.proto) {
+          if (refDestructuringErrors) {
+            if (refDestructuringErrors.doubleProto < 0)
+              { refDestructuringErrors.doubleProto = key.start; }
+            // Backwards-compat kludge. Can be removed in version 6.0
+          } else { this.raiseRecoverable(key.start, "Redefinition of __proto__ property"); }
+        }
+        propHash.proto = true;
+      }
+      return
+    }
+    name = "$" + name;
+    var other = propHash[name];
+    if (other) {
+      var redefinition;
+      if (kind === "init") {
+        redefinition = this.strict && other.init || other.get || other.set;
+      } else {
+        redefinition = other.init || other[kind];
+      }
+      if (redefinition)
+        { this.raiseRecoverable(key.start, "Redefinition of property"); }
+    } else {
+      other = propHash[name] = {
+        init: false,
+        get: false,
+        set: false
+      };
+    }
+    other[kind] = true;
+  };
+
+  // ### Expression parsing
+
+  // These nest, from the most general expression type at the top to
+  // 'atomic', nondivisible expression types at the bottom. Most of
+  // the functions will simply let the function(s) below them parse,
+  // and, *if* the syntactic construct they handle is present, wrap
+  // the AST node that the inner parser gave them in another node.
+
+  // Parse a full expression. The optional arguments are used to
+  // forbid the `in` operator (in for loops initalization expressions)
+  // and provide reference for storing '=' operator inside shorthand
+  // property assignment in contexts where both object expression
+  // and object pattern might appear (so it's possible to raise
+  // delayed syntax error at correct position).
+
+  pp$3.parseExpression = function(noIn, refDestructuringErrors) {
+    var startPos = this.start, startLoc = this.startLoc;
+    var expr = this.parseMaybeAssign(noIn, refDestructuringErrors);
+    if (this.type === types.comma) {
+      var node = this.startNodeAt(startPos, startLoc);
+      node.expressions = [expr];
+      while (this.eat(types.comma)) { node.expressions.push(this.parseMaybeAssign(noIn, refDestructuringErrors)); }
+      return this.finishNode(node, "SequenceExpression")
+    }
+    return expr
+  };
+
+  // Parse an assignment expression. This includes applications of
+  // operators like `+=`.
+
+  pp$3.parseMaybeAssign = function(noIn, refDestructuringErrors, afterLeftParse) {
+    if (this.isContextual("yield")) {
+      if (this.inGenerator) { return this.parseYield(noIn) }
+      // The tokenizer will assume an expression is allowed after
+      // `yield`, but this isn't that kind of yield
+      else { this.exprAllowed = false; }
+    }
+
+    var ownDestructuringErrors = false, oldParenAssign = -1, oldTrailingComma = -1;
+    if (refDestructuringErrors) {
+      oldParenAssign = refDestructuringErrors.parenthesizedAssign;
+      oldTrailingComma = refDestructuringErrors.trailingComma;
+      refDestructuringErrors.parenthesizedAssign = refDestructuringErrors.trailingComma = -1;
+    } else {
+      refDestructuringErrors = new DestructuringErrors;
+      ownDestructuringErrors = true;
+    }
+
+    var startPos = this.start, startLoc = this.startLoc;
+    if (this.type === types.parenL || this.type === types.name)
+      { this.potentialArrowAt = this.start; }
+    var left = this.parseMaybeConditional(noIn, refDestructuringErrors);
+    if (afterLeftParse) { left = afterLeftParse.call(this, left, startPos, startLoc); }
+    if (this.type.isAssign) {
+      var node = this.startNodeAt(startPos, startLoc);
+      node.operator = this.value;
+      if (this.type === types.eq)
+        { left = this.toAssignable(left, false, refDestructuringErrors); }
+      if (!ownDestructuringErrors) {
+        refDestructuringErrors.parenthesizedAssign = refDestructuringErrors.trailingComma = refDestructuringErrors.doubleProto = -1;
+      }
+      if (refDestructuringErrors.shorthandAssign >= left.start)
+        { refDestructuringErrors.shorthandAssign = -1; } // reset because shorthand default was used correctly
+      if (this.type === types.eq)
+        { this.checkLValPattern(left); }
+      else
+        { this.checkLValSimple(left); }
+      node.left = left;
+      this.next();
+      node.right = this.parseMaybeAssign(noIn);
+      return this.finishNode(node, "AssignmentExpression")
+    } else {
+      if (ownDestructuringErrors) { this.checkExpressionErrors(refDestructuringErrors, true); }
+    }
+    if (oldParenAssign > -1) { refDestructuringErrors.parenthesizedAssign = oldParenAssign; }
+    if (oldTrailingComma > -1) { refDestructuringErrors.trailingComma = oldTrailingComma; }
+    return left
+  };
+
+  // Parse a ternary conditional (`?:`) operator.
+
+  pp$3.parseMaybeConditional = function(noIn, refDestructuringErrors) {
+    var startPos = this.start, startLoc = this.startLoc;
+    var expr = this.parseExprOps(noIn, refDestructuringErrors);
+    if (this.checkExpressionErrors(refDestructuringErrors)) { return expr }
+    if (this.eat(types.question)) {
+      var node = this.startNodeAt(startPos, startLoc);
+      node.test = expr;
+      node.consequent = this.parseMaybeAssign();
+      this.expect(types.colon);
+      node.alternate = this.parseMaybeAssign(noIn);
+      return this.finishNode(node, "ConditionalExpression")
+    }
+    return expr
+  };
+
+  // Start the precedence parser.
+
+  pp$3.parseExprOps = function(noIn, refDestructuringErrors) {
+    var startPos = this.start, startLoc = this.startLoc;
+    var expr = this.parseMaybeUnary(refDestructuringErrors, false);
+    if (this.checkExpressionErrors(refDestructuringErrors)) { return expr }
+    return expr.start === startPos && expr.type === "ArrowFunctionExpression" ? expr : this.parseExprOp(expr, startPos, startLoc, -1, noIn)
+  };
+
+  // Parse binary operators with the operator precedence parsing
+  // algorithm. `left` is the left-hand side of the operator.
+  // `minPrec` provides context that allows the function to stop and
+  // defer further parser to one of its callers when it encounters an
+  // operator that has a lower precedence than the set it is parsing.
+
+  pp$3.parseExprOp = function(left, leftStartPos, leftStartLoc, minPrec, noIn) {
+    var prec = this.type.binop;
+    if (prec != null && (!noIn || this.type !== types._in)) {
+      if (prec > minPrec) {
+        var logical = this.type === types.logicalOR || this.type === types.logicalAND;
+        var coalesce = this.type === types.coalesce;
+        if (coalesce) {
+          // Handle the precedence of `tt.coalesce` as equal to the range of logical expressions.
+          // In other words, `node.right` shouldn't contain logical expressions in order to check the mixed error.
+          prec = types.logicalAND.binop;
+        }
+        var op = this.value;
+        this.next();
+        var startPos = this.start, startLoc = this.startLoc;
+        var right = this.parseExprOp(this.parseMaybeUnary(null, false), startPos, startLoc, prec, noIn);
+        var node = this.buildBinary(leftStartPos, leftStartLoc, left, right, op, logical || coalesce);
+        if ((logical && this.type === types.coalesce) || (coalesce && (this.type === types.logicalOR || this.type === types.logicalAND))) {
+          this.raiseRecoverable(this.start, "Logical expressions and coalesce expressions cannot be mixed. Wrap either by parentheses");
+        }
+        return this.parseExprOp(node, leftStartPos, leftStartLoc, minPrec, noIn)
+      }
+    }
+    return left
+  };
+
+  pp$3.buildBinary = function(startPos, startLoc, left, right, op, logical) {
+    var node = this.startNodeAt(startPos, startLoc);
+    node.left = left;
+    node.operator = op;
+    node.right = right;
+    return this.finishNode(node, logical ? "LogicalExpression" : "BinaryExpression")
+  };
+
+  // Parse unary operators, both prefix and postfix.
+
+  pp$3.parseMaybeUnary = function(refDestructuringErrors, sawUnary) {
+    var startPos = this.start, startLoc = this.startLoc, expr;
+    if (this.isContextual("await") && (this.inAsync || (!this.inFunction && this.options.allowAwaitOutsideFunction))) {
+      expr = this.parseAwait();
+      sawUnary = true;
+    } else if (this.type.prefix) {
+      var node = this.startNode(), update = this.type === types.incDec;
+      node.operator = this.value;
+      node.prefix = true;
+      this.next();
+      node.argument = this.parseMaybeUnary(null, true);
+      this.checkExpressionErrors(refDestructuringErrors, true);
+      if (update) { this.checkLValSimple(node.argument); }
+      else if (this.strict && node.operator === "delete" &&
+               node.argument.type === "Identifier")
+        { this.raiseRecoverable(node.start, "Deleting local variable in strict mode"); }
+      else { sawUnary = true; }
+      expr = this.finishNode(node, update ? "UpdateExpression" : "UnaryExpression");
+    } else {
+      expr = this.parseExprSubscripts(refDestructuringErrors);
+      if (this.checkExpressionErrors(refDestructuringErrors)) { return expr }
+      while (this.type.postfix && !this.canInsertSemicolon()) {
+        var node$1 = this.startNodeAt(startPos, startLoc);
+        node$1.operator = this.value;
+        node$1.prefix = false;
+        node$1.argument = expr;
+        this.checkLValSimple(expr);
+        this.next();
+        expr = this.finishNode(node$1, "UpdateExpression");
+      }
+    }
+
+    if (!sawUnary && this.eat(types.starstar))
+      { return this.buildBinary(startPos, startLoc, expr, this.parseMaybeUnary(null, false), "**", false) }
+    else
+      { return expr }
+  };
+
+  // Parse call, dot, and `[]`-subscript expressions.
+
+  pp$3.parseExprSubscripts = function(refDestructuringErrors) {
+    var startPos = this.start, startLoc = this.startLoc;
+    var expr = this.parseExprAtom(refDestructuringErrors);
+    if (expr.type === "ArrowFunctionExpression" && this.input.slice(this.lastTokStart, this.lastTokEnd) !== ")")
+      { return expr }
+    var result = this.parseSubscripts(expr, startPos, startLoc);
+    if (refDestructuringErrors && result.type === "MemberExpression") {
+      if (refDestructuringErrors.parenthesizedAssign >= result.start) { refDestructuringErrors.parenthesizedAssign = -1; }
+      if (refDestructuringErrors.parenthesizedBind >= result.start) { refDestructuringErrors.parenthesizedBind = -1; }
+    }
+    return result
+  };
+
+  pp$3.parseSubscripts = function(base, startPos, startLoc, noCalls) {
+    var maybeAsyncArrow = this.options.ecmaVersion >= 8 && base.type === "Identifier" && base.name === "async" &&
+        this.lastTokEnd === base.end && !this.canInsertSemicolon() && base.end - base.start === 5 &&
+        this.potentialArrowAt === base.start;
+    var optionalChained = false;
+
+    while (true) {
+      var element = this.parseSubscript(base, startPos, startLoc, noCalls, maybeAsyncArrow, optionalChained);
+
+      if (element.optional) { optionalChained = true; }
+      if (element === base || element.type === "ArrowFunctionExpression") {
+        if (optionalChained) {
+          var chainNode = this.startNodeAt(startPos, startLoc);
+          chainNode.expression = element;
+          element = this.finishNode(chainNode, "ChainExpression");
+        }
+        return element
+      }
+
+      base = element;
+    }
+  };
+
+  pp$3.parseSubscript = function(base, startPos, startLoc, noCalls, maybeAsyncArrow, optionalChained) {
+    var optionalSupported = this.options.ecmaVersion >= 11;
+    var optional = optionalSupported && this.eat(types.questionDot);
+    if (noCalls && optional) { this.raise(this.lastTokStart, "Optional chaining cannot appear in the callee of new expressions"); }
+
+    var computed = this.eat(types.bracketL);
+    if (computed || (optional && this.type !== types.parenL && this.type !== types.backQuote) || this.eat(types.dot)) {
+      var node = this.startNodeAt(startPos, startLoc);
+      node.object = base;
+      node.property = computed ? this.parseExpression() : this.parseIdent(this.options.allowReserved !== "never");
+      node.computed = !!computed;
+      if (computed) { this.expect(types.bracketR); }
+      if (optionalSupported) {
+        node.optional = optional;
+      }
+      base = this.finishNode(node, "MemberExpression");
+    } else if (!noCalls && this.eat(types.parenL)) {
+      var refDestructuringErrors = new DestructuringErrors, oldYieldPos = this.yieldPos, oldAwaitPos = this.awaitPos, oldAwaitIdentPos = this.awaitIdentPos;
+      this.yieldPos = 0;
+      this.awaitPos = 0;
+      this.awaitIdentPos = 0;
+      var exprList = this.parseExprList(types.parenR, this.options.ecmaVersion >= 8, false, refDestructuringErrors);
+      if (maybeAsyncArrow && !optional && !this.canInsertSemicolon() && this.eat(types.arrow)) {
+        this.checkPatternErrors(refDestructuringErrors, false);
+        this.checkYieldAwaitInDefaultParams();
+        if (this.awaitIdentPos > 0)
+          { this.raise(this.awaitIdentPos, "Cannot use 'await' as identifier inside an async function"); }
+        this.yieldPos = oldYieldPos;
+        this.awaitPos = oldAwaitPos;
+        this.awaitIdentPos = oldAwaitIdentPos;
+        return this.parseArrowExpression(this.startNodeAt(startPos, startLoc), exprList, true)
+      }
+      this.checkExpressionErrors(refDestructuringErrors, true);
+      this.yieldPos = oldYieldPos || this.yieldPos;
+      this.awaitPos = oldAwaitPos || this.awaitPos;
+      this.awaitIdentPos = oldAwaitIdentPos || this.awaitIdentPos;
+      var node$1 = this.startNodeAt(startPos, startLoc);
+      node$1.callee = base;
+      node$1.arguments = exprList;
+      if (optionalSupported) {
+        node$1.optional = optional;
+      }
+      base = this.finishNode(node$1, "CallExpression");
+    } else if (this.type === types.backQuote) {
+      if (optional || optionalChained) {
+        this.raise(this.start, "Optional chaining cannot appear in the tag of tagged template expressions");
+      }
+      var node$2 = this.startNodeAt(startPos, startLoc);
+      node$2.tag = base;
+      node$2.quasi = this.parseTemplate({isTagged: true});
+      base = this.finishNode(node$2, "TaggedTemplateExpression");
+    }
+    return base
+  };
+
+  // Parse an atomic expression — either a single token that is an
+  // expression, an expression started by a keyword like `function` or
+  // `new`, or an expression wrapped in punctuation like `()`, `[]`,
+  // or `{}`.
+
+  pp$3.parseExprAtom = function(refDestructuringErrors) {
+    // If a division operator appears in an expression position, the
+    // tokenizer got confused, and we force it to read a regexp instead.
+    if (this.type === types.slash) { this.readRegexp(); }
+
+    var node, canBeArrow = this.potentialArrowAt === this.start;
+    switch (this.type) {
+    case types._super:
+      if (!this.allowSuper)
+        { this.raise(this.start, "'super' keyword outside a method"); }
+      node = this.startNode();
+      this.next();
+      if (this.type === types.parenL && !this.allowDirectSuper)
+        { this.raise(node.start, "super() call outside constructor of a subclass"); }
+      // The `super` keyword can appear at below:
+      // SuperProperty:
+      //     super [ Expression ]
+      //     super . IdentifierName
+      // SuperCall:
+      //     super ( Arguments )
+      if (this.type !== types.dot && this.type !== types.bracketL && this.type !== types.parenL)
+        { this.unexpected(); }
+      return this.finishNode(node, "Super")
+
+    case types._this:
+      node = this.startNode();
+      this.next();
+      return this.finishNode(node, "ThisExpression")
+
+    case types.name:
+      var startPos = this.start, startLoc = this.startLoc, containsEsc = this.containsEsc;
+      var id = this.parseIdent(false);
+      if (this.options.ecmaVersion >= 8 && !containsEsc && id.name === "async" && !this.canInsertSemicolon() && this.eat(types._function))
+        { return this.parseFunction(this.startNodeAt(startPos, startLoc), 0, false, true) }
+      if (canBeArrow && !this.canInsertSemicolon()) {
+        if (this.eat(types.arrow))
+          { return this.parseArrowExpression(this.startNodeAt(startPos, startLoc), [id], false) }
+        if (this.options.ecmaVersion >= 8 && id.name === "async" && this.type === types.name && !containsEsc) {
+          id = this.parseIdent(false);
+          if (this.canInsertSemicolon() || !this.eat(types.arrow))
+            { this.unexpected(); }
+          return this.parseArrowExpression(this.startNodeAt(startPos, startLoc), [id], true)
+        }
+      }
+      return id
+
+    case types.regexp:
+      var value = this.value;
+      node = this.parseLiteral(value.value);
+      node.regex = {pattern: value.pattern, flags: value.flags};
+      return node
+
+    case types.num: case types.string:
+      return this.parseLiteral(this.value)
+
+    case types._null: case types._true: case types._false:
+      node = this.startNode();
+      node.value = this.type === types._null ? null : this.type === types._true;
+      node.raw = this.type.keyword;
+      this.next();
+      return this.finishNode(node, "Literal")
+
+    case types.parenL:
+      var start = this.start, expr = this.parseParenAndDistinguishExpression(canBeArrow);
+      if (refDestructuringErrors) {
+        if (refDestructuringErrors.parenthesizedAssign < 0 && !this.isSimpleAssignTarget(expr))
+          { refDestructuringErrors.parenthesizedAssign = start; }
+        if (refDestructuringErrors.parenthesizedBind < 0)
+          { refDestructuringErrors.parenthesizedBind = start; }
+      }
+      return expr
+
+    case types.bracketL:
+      node = this.startNode();
+      this.next();
+      node.elements = this.parseExprList(types.bracketR, true, true, refDestructuringErrors);
+      return this.finishNode(node, "ArrayExpression")
+
+    case types.braceL:
+      return this.parseObj(false, refDestructuringErrors)
+
+    case types._function:
+      node = this.startNode();
+      this.next();
+      return this.parseFunction(node, 0)
+
+    case types._class:
+      return this.parseClass(this.startNode(), false)
+
+    case types._new:
+      return this.parseNew()
+
+    case types.backQuote:
+      return this.parseTemplate()
+
+    case types._import:
+      if (this.options.ecmaVersion >= 11) {
+        return this.parseExprImport()
+      } else {
+        return this.unexpected()
+      }
+
+    default:
+      this.unexpected();
+    }
+  };
+
+  pp$3.parseExprImport = function() {
+    var node = this.startNode();
+
+    // Consume `import` as an identifier for `import.meta`.
+    // Because `this.parseIdent(true)` doesn't check escape sequences, it needs the check of `this.containsEsc`.
+    if (this.containsEsc) { this.raiseRecoverable(this.start, "Escape sequence in keyword import"); }
+    var meta = this.parseIdent(true);
+
+    switch (this.type) {
+    case types.parenL:
+      return this.parseDynamicImport(node)
+    case types.dot:
+      node.meta = meta;
+      return this.parseImportMeta(node)
+    default:
+      this.unexpected();
+    }
+  };
+
+  pp$3.parseDynamicImport = function(node) {
+    this.next(); // skip `(`
+
+    // Parse node.source.
+    node.source = this.parseMaybeAssign();
+
+    // Verify ending.
+    if (!this.eat(types.parenR)) {
+      var errorPos = this.start;
+      if (this.eat(types.comma) && this.eat(types.parenR)) {
+        this.raiseRecoverable(errorPos, "Trailing comma is not allowed in import()");
+      } else {
+        this.unexpected(errorPos);
+      }
+    }
+
+    return this.finishNode(node, "ImportExpression")
+  };
+
+  pp$3.parseImportMeta = function(node) {
+    this.next(); // skip `.`
+
+    var containsEsc = this.containsEsc;
+    node.property = this.parseIdent(true);
+
+    if (node.property.name !== "meta")
+      { this.raiseRecoverable(node.property.start, "The only valid meta property for import is 'import.meta'"); }
+    if (containsEsc)
+      { this.raiseRecoverable(node.start, "'import.meta' must not contain escaped characters"); }
+    if (this.options.sourceType !== "module")
+      { this.raiseRecoverable(node.start, "Cannot use 'import.meta' outside a module"); }
+
+    return this.finishNode(node, "MetaProperty")
+  };
+
+  pp$3.parseLiteral = function(value) {
+    var node = this.startNode();
+    node.value = value;
+    node.raw = this.input.slice(this.start, this.end);
+    if (node.raw.charCodeAt(node.raw.length - 1) === 110) { node.bigint = node.raw.slice(0, -1).replace(/_/g, ""); }
+    this.next();
+    return this.finishNode(node, "Literal")
+  };
+
+  pp$3.parseParenExpression = function() {
+    this.expect(types.parenL);
+    var val = this.parseExpression();
+    this.expect(types.parenR);
+    return val
+  };
+
+  pp$3.parseParenAndDistinguishExpression = function(canBeArrow) {
+    var startPos = this.start, startLoc = this.startLoc, val, allowTrailingComma = this.options.ecmaVersion >= 8;
+    if (this.options.ecmaVersion >= 6) {
+      this.next();
+
+      var innerStartPos = this.start, innerStartLoc = this.startLoc;
+      var exprList = [], first = true, lastIsComma = false;
+      var refDestructuringErrors = new DestructuringErrors, oldYieldPos = this.yieldPos, oldAwaitPos = this.awaitPos, spreadStart;
+      this.yieldPos = 0;
+      this.awaitPos = 0;
+      // Do not save awaitIdentPos to allow checking awaits nested in parameters
+      while (this.type !== types.parenR) {
+        first ? first = false : this.expect(types.comma);
+        if (allowTrailingComma && this.afterTrailingComma(types.parenR, true)) {
+          lastIsComma = true;
+          break
+        } else if (this.type === types.ellipsis) {
+          spreadStart = this.start;
+          exprList.push(this.parseParenItem(this.parseRestBinding()));
+          if (this.type === types.comma) { this.raise(this.start, "Comma is not permitted after the rest element"); }
+          break
+        } else {
+          exprList.push(this.parseMaybeAssign(false, refDestructuringErrors, this.parseParenItem));
+        }
+      }
+      var innerEndPos = this.start, innerEndLoc = this.startLoc;
+      this.expect(types.parenR);
+
+      if (canBeArrow && !this.canInsertSemicolon() && this.eat(types.arrow)) {
+        this.checkPatternErrors(refDestructuringErrors, false);
+        this.checkYieldAwaitInDefaultParams();
+        this.yieldPos = oldYieldPos;
+        this.awaitPos = oldAwaitPos;
+        return this.parseParenArrowList(startPos, startLoc, exprList)
+      }
+
+      if (!exprList.length || lastIsComma) { this.unexpected(this.lastTokStart); }
+      if (spreadStart) { this.unexpected(spreadStart); }
+      this.checkExpressionErrors(refDestructuringErrors, true);
+      this.yieldPos = oldYieldPos || this.yieldPos;
+      this.awaitPos = oldAwaitPos || this.awaitPos;
+
+      if (exprList.length > 1) {
+        val = this.startNodeAt(innerStartPos, innerStartLoc);
+        val.expressions = exprList;
+        this.finishNodeAt(val, "SequenceExpression", innerEndPos, innerEndLoc);
+      } else {
+        val = exprList[0];
+      }
+    } else {
+      val = this.parseParenExpression();
+    }
+
+    if (this.options.preserveParens) {
+      var par = this.startNodeAt(startPos, startLoc);
+      par.expression = val;
+      return this.finishNode(par, "ParenthesizedExpression")
+    } else {
+      return val
+    }
+  };
+
+  pp$3.parseParenItem = function(item) {
+    return item
+  };
+
+  pp$3.parseParenArrowList = function(startPos, startLoc, exprList) {
+    return this.parseArrowExpression(this.startNodeAt(startPos, startLoc), exprList)
+  };
+
+  // New's precedence is slightly tricky. It must allow its argument to
+  // be a `[]` or dot subscript expression, but not a call — at least,
+  // not without wrapping it in parentheses. Thus, it uses the noCalls
+  // argument to parseSubscripts to prevent it from consuming the
+  // argument list.
+
+  var empty$1 = [];
+
+  pp$3.parseNew = function() {
+    if (this.containsEsc) { this.raiseRecoverable(this.start, "Escape sequence in keyword new"); }
+    var node = this.startNode();
+    var meta = this.parseIdent(true);
+    if (this.options.ecmaVersion >= 6 && this.eat(types.dot)) {
+      node.meta = meta;
+      var containsEsc = this.containsEsc;
+      node.property = this.parseIdent(true);
+      if (node.property.name !== "target")
+        { this.raiseRecoverable(node.property.start, "The only valid meta property for new is 'new.target'"); }
+      if (containsEsc)
+        { this.raiseRecoverable(node.start, "'new.target' must not contain escaped characters"); }
+      if (!this.inNonArrowFunction)
+        { this.raiseRecoverable(node.start, "'new.target' can only be used in functions"); }
+      return this.finishNode(node, "MetaProperty")
+    }
+    var startPos = this.start, startLoc = this.startLoc, isImport = this.type === types._import;
+    node.callee = this.parseSubscripts(this.parseExprAtom(), startPos, startLoc, true);
+    if (isImport && node.callee.type === "ImportExpression") {
+      this.raise(startPos, "Cannot use new with import()");
+    }
+    if (this.eat(types.parenL)) { node.arguments = this.parseExprList(types.parenR, this.options.ecmaVersion >= 8, false); }
+    else { node.arguments = empty$1; }
+    return this.finishNode(node, "NewExpression")
+  };
+
+  // Parse template expression.
+
+  pp$3.parseTemplateElement = function(ref) {
+    var isTagged = ref.isTagged;
+
+    var elem = this.startNode();
+    if (this.type === types.invalidTemplate) {
+      if (!isTagged) {
+        this.raiseRecoverable(this.start, "Bad escape sequence in untagged template literal");
+      }
+      elem.value = {
+        raw: this.value,
+        cooked: null
+      };
+    } else {
+      elem.value = {
+        raw: this.input.slice(this.start, this.end).replace(/\r\n?/g, "\n"),
+        cooked: this.value
+      };
+    }
+    this.next();
+    elem.tail = this.type === types.backQuote;
+    return this.finishNode(elem, "TemplateElement")
+  };
+
+  pp$3.parseTemplate = function(ref) {
+    if ( ref === void 0 ) ref = {};
+    var isTagged = ref.isTagged; if ( isTagged === void 0 ) isTagged = false;
+
+    var node = this.startNode();
+    this.next();
+    node.expressions = [];
+    var curElt = this.parseTemplateElement({isTagged: isTagged});
+    node.quasis = [curElt];
+    while (!curElt.tail) {
+      if (this.type === types.eof) { this.raise(this.pos, "Unterminated template literal"); }
+      this.expect(types.dollarBraceL);
+      node.expressions.push(this.parseExpression());
+      this.expect(types.braceR);
+      node.quasis.push(curElt = this.parseTemplateElement({isTagged: isTagged}));
+    }
+    this.next();
+    return this.finishNode(node, "TemplateLiteral")
+  };
+
+  pp$3.isAsyncProp = function(prop) {
+    return !prop.computed && prop.key.type === "Identifier" && prop.key.name === "async" &&
+      (this.type === types.name || this.type === types.num || this.type === types.string || this.type === types.bracketL || this.type.keyword || (this.options.ecmaVersion >= 9 && this.type === types.star)) &&
+      !lineBreak.test(this.input.slice(this.lastTokEnd, this.start))
+  };
+
+  // Parse an object literal or binding pattern.
+
+  pp$3.parseObj = function(isPattern, refDestructuringErrors) {
+    var node = this.startNode(), first = true, propHash = {};
+    node.properties = [];
+    this.next();
+    while (!this.eat(types.braceR)) {
+      if (!first) {
+        this.expect(types.comma);
+        if (this.options.ecmaVersion >= 5 && this.afterTrailingComma(types.braceR)) { break }
+      } else { first = false; }
+
+      var prop = this.parseProperty(isPattern, refDestructuringErrors);
+      if (!isPattern) { this.checkPropClash(prop, propHash, refDestructuringErrors); }
+      node.properties.push(prop);
+    }
+    return this.finishNode(node, isPattern ? "ObjectPattern" : "ObjectExpression")
+  };
+
+  pp$3.parseProperty = function(isPattern, refDestructuringErrors) {
+    var prop = this.startNode(), isGenerator, isAsync, startPos, startLoc;
+    if (this.options.ecmaVersion >= 9 && this.eat(types.ellipsis)) {
+      if (isPattern) {
+        prop.argument = this.parseIdent(false);
+        if (this.type === types.comma) {
+          this.raise(this.start, "Comma is not permitted after the rest element");
+        }
+        return this.finishNode(prop, "RestElement")
+      }
+      // To disallow parenthesized identifier via `this.toAssignable()`.
+      if (this.type === types.parenL && refDestructuringErrors) {
+        if (refDestructuringErrors.parenthesizedAssign < 0) {
+          refDestructuringErrors.parenthesizedAssign = this.start;
+        }
+        if (refDestructuringErrors.parenthesizedBind < 0) {
+          refDestructuringErrors.parenthesizedBind = this.start;
+        }
+      }
+      // Parse argument.
+      prop.argument = this.parseMaybeAssign(false, refDestructuringErrors);
+      // To disallow trailing comma via `this.toAssignable()`.
+      if (this.type === types.comma && refDestructuringErrors && refDestructuringErrors.trailingComma < 0) {
+        refDestructuringErrors.trailingComma = this.start;
+      }
+      // Finish
+      return this.finishNode(prop, "SpreadElement")
+    }
+    if (this.options.ecmaVersion >= 6) {
+      prop.method = false;
+      prop.shorthand = false;
+      if (isPattern || refDestructuringErrors) {
+        startPos = this.start;
+        startLoc = this.startLoc;
+      }
+      if (!isPattern)
+        { isGenerator = this.eat(types.star); }
+    }
+    var containsEsc = this.containsEsc;
+    this.parsePropertyName(prop);
+    if (!isPattern && !containsEsc && this.options.ecmaVersion >= 8 && !isGenerator && this.isAsyncProp(prop)) {
+      isAsync = true;
+      isGenerator = this.options.ecmaVersion >= 9 && this.eat(types.star);
+      this.parsePropertyName(prop, refDestructuringErrors);
+    } else {
+      isAsync = false;
+    }
+    this.parsePropertyValue(prop, isPattern, isGenerator, isAsync, startPos, startLoc, refDestructuringErrors, containsEsc);
+    return this.finishNode(prop, "Property")
+  };
+
+  pp$3.parsePropertyValue = function(prop, isPattern, isGenerator, isAsync, startPos, startLoc, refDestructuringErrors, containsEsc) {
+    if ((isGenerator || isAsync) && this.type === types.colon)
+      { this.unexpected(); }
+
+    if (this.eat(types.colon)) {
+      prop.value = isPattern ? this.parseMaybeDefault(this.start, this.startLoc) : this.parseMaybeAssign(false, refDestructuringErrors);
+      prop.kind = "init";
+    } else if (this.options.ecmaVersion >= 6 && this.type === types.parenL) {
+      if (isPattern) { this.unexpected(); }
+      prop.kind = "init";
+      prop.method = true;
+      prop.value = this.parseMethod(isGenerator, isAsync);
+    } else if (!isPattern && !containsEsc &&
+               this.options.ecmaVersion >= 5 && !prop.computed && prop.key.type === "Identifier" &&
+               (prop.key.name === "get" || prop.key.name === "set") &&
+               (this.type !== types.comma && this.type !== types.braceR && this.type !== types.eq)) {
+      if (isGenerator || isAsync) { this.unexpected(); }
+      prop.kind = prop.key.name;
+      this.parsePropertyName(prop);
+      prop.value = this.parseMethod(false);
+      var paramCount = prop.kind === "get" ? 0 : 1;
+      if (prop.value.params.length !== paramCount) {
+        var start = prop.value.start;
+        if (prop.kind === "get")
+          { this.raiseRecoverable(start, "getter should have no params"); }
+        else
+          { this.raiseRecoverable(start, "setter should have exactly one param"); }
+      } else {
+        if (prop.kind === "set" && prop.value.params[0].type === "RestElement")
+          { this.raiseRecoverable(prop.value.params[0].start, "Setter cannot use rest params"); }
+      }
+    } else if (this.options.ecmaVersion >= 6 && !prop.computed && prop.key.type === "Identifier") {
+      if (isGenerator || isAsync) { this.unexpected(); }
+      this.checkUnreserved(prop.key);
+      if (prop.key.name === "await" && !this.awaitIdentPos)
+        { this.awaitIdentPos = startPos; }
+      prop.kind = "init";
+      if (isPattern) {
+        prop.value = this.parseMaybeDefault(startPos, startLoc, this.copyNode(prop.key));
+      } else if (this.type === types.eq && refDestructuringErrors) {
+        if (refDestructuringErrors.shorthandAssign < 0)
+          { refDestructuringErrors.shorthandAssign = this.start; }
+        prop.value = this.parseMaybeDefault(startPos, startLoc, this.copyNode(prop.key));
+      } else {
+        prop.value = this.copyNode(prop.key);
+      }
+      prop.shorthand = true;
+    } else { this.unexpected(); }
+  };
+
+  pp$3.parsePropertyName = function(prop) {
+    if (this.options.ecmaVersion >= 6) {
+      if (this.eat(types.bracketL)) {
+        prop.computed = true;
+        prop.key = this.parseMaybeAssign();
+        this.expect(types.bracketR);
+        return prop.key
+      } else {
+        prop.computed = false;
+      }
+    }
+    return prop.key = this.type === types.num || this.type === types.string ? this.parseExprAtom() : this.parseIdent(this.options.allowReserved !== "never")
+  };
+
+  // Initialize empty function node.
+
+  pp$3.initFunction = function(node) {
+    node.id = null;
+    if (this.options.ecmaVersion >= 6) { node.generator = node.expression = false; }
+    if (this.options.ecmaVersion >= 8) { node.async = false; }
+  };
+
+  // Parse object or class method.
+
+  pp$3.parseMethod = function(isGenerator, isAsync, allowDirectSuper) {
+    var node = this.startNode(), oldYieldPos = this.yieldPos, oldAwaitPos = this.awaitPos, oldAwaitIdentPos = this.awaitIdentPos;
+
+    this.initFunction(node);
+    if (this.options.ecmaVersion >= 6)
+      { node.generator = isGenerator; }
+    if (this.options.ecmaVersion >= 8)
+      { node.async = !!isAsync; }
+
+    this.yieldPos = 0;
+    this.awaitPos = 0;
+    this.awaitIdentPos = 0;
+    this.enterScope(functionFlags(isAsync, node.generator) | SCOPE_SUPER | (allowDirectSuper ? SCOPE_DIRECT_SUPER : 0));
+
+    this.expect(types.parenL);
+    node.params = this.parseBindingList(types.parenR, false, this.options.ecmaVersion >= 8);
+    this.checkYieldAwaitInDefaultParams();
+    this.parseFunctionBody(node, false, true);
+
+    this.yieldPos = oldYieldPos;
+    this.awaitPos = oldAwaitPos;
+    this.awaitIdentPos = oldAwaitIdentPos;
+    return this.finishNode(node, "FunctionExpression")
+  };
+
+  // Parse arrow function expression with given parameters.
+
+  pp$3.parseArrowExpression = function(node, params, isAsync) {
+    var oldYieldPos = this.yieldPos, oldAwaitPos = this.awaitPos, oldAwaitIdentPos = this.awaitIdentPos;
+
+    this.enterScope(functionFlags(isAsync, false) | SCOPE_ARROW);
+    this.initFunction(node);
+    if (this.options.ecmaVersion >= 8) { node.async = !!isAsync; }
+
+    this.yieldPos = 0;
+    this.awaitPos = 0;
+    this.awaitIdentPos = 0;
+
+    node.params = this.toAssignableList(params, true);
+    this.parseFunctionBody(node, true, false);
+
+    this.yieldPos = oldYieldPos;
+    this.awaitPos = oldAwaitPos;
+    this.awaitIdentPos = oldAwaitIdentPos;
+    return this.finishNode(node, "ArrowFunctionExpression")
+  };
+
+  // Parse function body and check parameters.
+
+  pp$3.parseFunctionBody = function(node, isArrowFunction, isMethod) {
+    var isExpression = isArrowFunction && this.type !== types.braceL;
+    var oldStrict = this.strict, useStrict = false;
+
+    if (isExpression) {
+      node.body = this.parseMaybeAssign();
+      node.expression = true;
+      this.checkParams(node, false);
+    } else {
+      var nonSimple = this.options.ecmaVersion >= 7 && !this.isSimpleParamList(node.params);
+      if (!oldStrict || nonSimple) {
+        useStrict = this.strictDirective(this.end);
+        // If this is a strict mode function, verify that argument names
+        // are not repeated, and it does not try to bind the words `eval`
+        // or `arguments`.
+        if (useStrict && nonSimple)
+          { this.raiseRecoverable(node.start, "Illegal 'use strict' directive in function with non-simple parameter list"); }
+      }
+      // Start a new scope with regard to labels and the `inFunction`
+      // flag (restore them to their old value afterwards).
+      var oldLabels = this.labels;
+      this.labels = [];
+      if (useStrict) { this.strict = true; }
+
+      // Add the params to varDeclaredNames to ensure that an error is thrown
+      // if a let/const declaration in the function clashes with one of the params.
+      this.checkParams(node, !oldStrict && !useStrict && !isArrowFunction && !isMethod && this.isSimpleParamList(node.params));
+      // Ensure the function name isn't a forbidden identifier in strict mode, e.g. 'eval'
+      if (this.strict && node.id) { this.checkLValSimple(node.id, BIND_OUTSIDE); }
+      node.body = this.parseBlock(false, undefined, useStrict && !oldStrict);
+      node.expression = false;
+      this.adaptDirectivePrologue(node.body.body);
+      this.labels = oldLabels;
+    }
+    this.exitScope();
+  };
+
+  pp$3.isSimpleParamList = function(params) {
+    for (var i = 0, list = params; i < list.length; i += 1)
+      {
+      var param = list[i];
+
+      if (param.type !== "Identifier") { return false
+    } }
+    return true
+  };
+
+  // Checks function params for various disallowed patterns such as using "eval"
+  // or "arguments" and duplicate parameters.
+
+  pp$3.checkParams = function(node, allowDuplicates) {
+    var nameHash = Object.create(null);
+    for (var i = 0, list = node.params; i < list.length; i += 1)
+      {
+      var param = list[i];
+
+      this.checkLValInnerPattern(param, BIND_VAR, allowDuplicates ? null : nameHash);
+    }
+  };
+
+  // Parses a comma-separated list of expressions, and returns them as
+  // an array. `close` is the token type that ends the list, and
+  // `allowEmpty` can be turned on to allow subsequent commas with
+  // nothing in between them to be parsed as `null` (which is needed
+  // for array literals).
+
+  pp$3.parseExprList = function(close, allowTrailingComma, allowEmpty, refDestructuringErrors) {
+    var elts = [], first = true;
+    while (!this.eat(close)) {
+      if (!first) {
+        this.expect(types.comma);
+        if (allowTrailingComma && this.afterTrailingComma(close)) { break }
+      } else { first = false; }
+
+      var elt = (void 0);
+      if (allowEmpty && this.type === types.comma)
+        { elt = null; }
+      else if (this.type === types.ellipsis) {
+        elt = this.parseSpread(refDestructuringErrors);
+        if (refDestructuringErrors && this.type === types.comma && refDestructuringErrors.trailingComma < 0)
+          { refDestructuringErrors.trailingComma = this.start; }
+      } else {
+        elt = this.parseMaybeAssign(false, refDestructuringErrors);
+      }
+      elts.push(elt);
+    }
+    return elts
+  };
+
+  pp$3.checkUnreserved = function(ref) {
+    var start = ref.start;
+    var end = ref.end;
+    var name = ref.name;
+
+    if (this.inGenerator && name === "yield")
+      { this.raiseRecoverable(start, "Cannot use 'yield' as identifier inside a generator"); }
+    if (this.inAsync && name === "await")
+      { this.raiseRecoverable(start, "Cannot use 'await' as identifier inside an async function"); }
+    if (this.keywords.test(name))
+      { this.raise(start, ("Unexpected keyword '" + name + "'")); }
+    if (this.options.ecmaVersion < 6 &&
+      this.input.slice(start, end).indexOf("\\") !== -1) { return }
+    var re = this.strict ? this.reservedWordsStrict : this.reservedWords;
+    if (re.test(name)) {
+      if (!this.inAsync && name === "await")
+        { this.raiseRecoverable(start, "Cannot use keyword 'await' outside an async function"); }
+      this.raiseRecoverable(start, ("The keyword '" + name + "' is reserved"));
+    }
+  };
+
+  // Parse the next token as an identifier. If `liberal` is true (used
+  // when parsing properties), it will also convert keywords into
+  // identifiers.
+
+  pp$3.parseIdent = function(liberal, isBinding) {
+    var node = this.startNode();
+    if (this.type === types.name) {
+      node.name = this.value;
+    } else if (this.type.keyword) {
+      node.name = this.type.keyword;
+
+      // To fix https://github.com/acornjs/acorn/issues/575
+      // `class` and `function` keywords push new context into this.context.
+      // But there is no chance to pop the context if the keyword is consumed as an identifier such as a property name.
+      // If the previous token is a dot, this does not apply because the context-managing code already ignored the keyword
+      if ((node.name === "class" || node.name === "function") &&
+          (this.lastTokEnd !== this.lastTokStart + 1 || this.input.charCodeAt(this.lastTokStart) !== 46)) {
+        this.context.pop();
+      }
+    } else {
+      this.unexpected();
+    }
+    this.next(!!liberal);
+    this.finishNode(node, "Identifier");
+    if (!liberal) {
+      this.checkUnreserved(node);
+      if (node.name === "await" && !this.awaitIdentPos)
+        { this.awaitIdentPos = node.start; }
+    }
+    return node
+  };
+
+  // Parses yield expression inside generator.
+
+  pp$3.parseYield = function(noIn) {
+    if (!this.yieldPos) { this.yieldPos = this.start; }
+
+    var node = this.startNode();
+    this.next();
+    if (this.type === types.semi || this.canInsertSemicolon() || (this.type !== types.star && !this.type.startsExpr)) {
+      node.delegate = false;
+      node.argument = null;
+    } else {
+      node.delegate = this.eat(types.star);
+      node.argument = this.parseMaybeAssign(noIn);
+    }
+    return this.finishNode(node, "YieldExpression")
+  };
+
+  pp$3.parseAwait = function() {
+    if (!this.awaitPos) { this.awaitPos = this.start; }
+
+    var node = this.startNode();
+    this.next();
+    node.argument = this.parseMaybeUnary(null, true);
+    return this.finishNode(node, "AwaitExpression")
+  };
+
+  var pp$4 = Parser.prototype;
+
+  // This function is used to raise exceptions on parse errors. It
+  // takes an offset integer (into the current `input`) to indicate
+  // the location of the error, attaches the position to the end
+  // of the error message, and then raises a `SyntaxError` with that
+  // message.
+
+  pp$4.raise = function(pos, message) {
+    var loc = getLineInfo(this.input, pos);
+    message += " (" + loc.line + ":" + loc.column + ")";
+    var err = new SyntaxError(message);
+    err.pos = pos; err.loc = loc; err.raisedAt = this.pos;
+    throw err
+  };
+
+  pp$4.raiseRecoverable = pp$4.raise;
+
+  pp$4.curPosition = function() {
+    if (this.options.locations) {
+      return new Position(this.curLine, this.pos - this.lineStart)
+    }
+  };
+
+  var pp$5 = Parser.prototype;
+
+  var Scope = function Scope(flags) {
+    this.flags = flags;
+    // A list of var-declared names in the current lexical scope
+    this.var = [];
+    // A list of lexically-declared names in the current lexical scope
+    this.lexical = [];
+    // A list of lexically-declared FunctionDeclaration names in the current lexical scope
+    this.functions = [];
+  };
+
+  // The functions in this module keep track of declared variables in the current scope in order to detect duplicate variable names.
+
+  pp$5.enterScope = function(flags) {
+    this.scopeStack.push(new Scope(flags));
+  };
+
+  pp$5.exitScope = function() {
+    this.scopeStack.pop();
+  };
+
+  // The spec says:
+  // > At the top level of a function, or script, function declarations are
+  // > treated like var declarations rather than like lexical declarations.
+  pp$5.treatFunctionsAsVarInScope = function(scope) {
+    return (scope.flags & SCOPE_FUNCTION) || !this.inModule && (scope.flags & SCOPE_TOP)
+  };
+
+  pp$5.declareName = function(name, bindingType, pos) {
+    var redeclared = false;
+    if (bindingType === BIND_LEXICAL) {
+      var scope = this.currentScope();
+      redeclared = scope.lexical.indexOf(name) > -1 || scope.functions.indexOf(name) > -1 || scope.var.indexOf(name) > -1;
+      scope.lexical.push(name);
+      if (this.inModule && (scope.flags & SCOPE_TOP))
+        { delete this.undefinedExports[name]; }
+    } else if (bindingType === BIND_SIMPLE_CATCH) {
+      var scope$1 = this.currentScope();
+      scope$1.lexical.push(name);
+    } else if (bindingType === BIND_FUNCTION) {
+      var scope$2 = this.currentScope();
+      if (this.treatFunctionsAsVar)
+        { redeclared = scope$2.lexical.indexOf(name) > -1; }
+      else
+        { redeclared = scope$2.lexical.indexOf(name) > -1 || scope$2.var.indexOf(name) > -1; }
+      scope$2.functions.push(name);
+    } else {
+      for (var i = this.scopeStack.length - 1; i >= 0; --i) {
+        var scope$3 = this.scopeStack[i];
+        if (scope$3.lexical.indexOf(name) > -1 && !((scope$3.flags & SCOPE_SIMPLE_CATCH) && scope$3.lexical[0] === name) ||
+            !this.treatFunctionsAsVarInScope(scope$3) && scope$3.functions.indexOf(name) > -1) {
+          redeclared = true;
+          break
+        }
+        scope$3.var.push(name);
+        if (this.inModule && (scope$3.flags & SCOPE_TOP))
+          { delete this.undefinedExports[name]; }
+        if (scope$3.flags & SCOPE_VAR) { break }
+      }
+    }
+    if (redeclared) { this.raiseRecoverable(pos, ("Identifier '" + name + "' has already been declared")); }
+  };
+
+  pp$5.checkLocalExport = function(id) {
+    // scope.functions must be empty as Module code is always strict.
+    if (this.scopeStack[0].lexical.indexOf(id.name) === -1 &&
+        this.scopeStack[0].var.indexOf(id.name) === -1) {
+      this.undefinedExports[id.name] = id;
+    }
+  };
+
+  pp$5.currentScope = function() {
+    return this.scopeStack[this.scopeStack.length - 1]
+  };
+
+  pp$5.currentVarScope = function() {
+    for (var i = this.scopeStack.length - 1;; i--) {
+      var scope = this.scopeStack[i];
+      if (scope.flags & SCOPE_VAR) { return scope }
+    }
+  };
+
+  // Could be useful for `this`, `new.target`, `super()`, `super.property`, and `super[property]`.
+  pp$5.currentThisScope = function() {
+    for (var i = this.scopeStack.length - 1;; i--) {
+      var scope = this.scopeStack[i];
+      if (scope.flags & SCOPE_VAR && !(scope.flags & SCOPE_ARROW)) { return scope }
+    }
+  };
+
+  var Node = function Node(parser, pos, loc) {
+    this.type = "";
+    this.start = pos;
+    this.end = 0;
+    if (parser.options.locations)
+      { this.loc = new SourceLocation(parser, loc); }
+    if (parser.options.directSourceFile)
+      { this.sourceFile = parser.options.directSourceFile; }
+    if (parser.options.ranges)
+      { this.range = [pos, 0]; }
+  };
+
+  // Start an AST node, attaching a start offset.
+
+  var pp$6 = Parser.prototype;
+
+  pp$6.startNode = function() {
+    return new Node(this, this.start, this.startLoc)
+  };
+
+  pp$6.startNodeAt = function(pos, loc) {
+    return new Node(this, pos, loc)
+  };
+
+  // Finish an AST node, adding `type` and `end` properties.
+
+  function finishNodeAt(node, type, pos, loc) {
+    node.type = type;
+    node.end = pos;
+    if (this.options.locations)
+      { node.loc.end = loc; }
+    if (this.options.ranges)
+      { node.range[1] = pos; }
+    return node
+  }
+
+  pp$6.finishNode = function(node, type) {
+    return finishNodeAt.call(this, node, type, this.lastTokEnd, this.lastTokEndLoc)
+  };
+
+  // Finish node at given position
+
+  pp$6.finishNodeAt = function(node, type, pos, loc) {
+    return finishNodeAt.call(this, node, type, pos, loc)
+  };
+
+  pp$6.copyNode = function(node) {
+    var newNode = new Node(this, node.start, this.startLoc);
+    for (var prop in node) { newNode[prop] = node[prop]; }
+    return newNode
+  };
+
+  // The algorithm used to determine whether a regexp can appear at a
+
+  var TokContext = function TokContext(token, isExpr, preserveSpace, override, generator) {
+    this.token = token;
+    this.isExpr = !!isExpr;
+    this.preserveSpace = !!preserveSpace;
+    this.override = override;
+    this.generator = !!generator;
+  };
+
+  var types$1 = {
+    b_stat: new TokContext("{", false),
+    b_expr: new TokContext("{", true),
+    b_tmpl: new TokContext("${", false),
+    p_stat: new TokContext("(", false),
+    p_expr: new TokContext("(", true),
+    q_tmpl: new TokContext("`", true, true, function (p) { return p.tryReadTemplateToken(); }),
+    f_stat: new TokContext("function", false),
+    f_expr: new TokContext("function", true),
+    f_expr_gen: new TokContext("function", true, false, null, true),
+    f_gen: new TokContext("function", false, false, null, true)
+  };
+
+  var pp$7 = Parser.prototype;
+
+  pp$7.initialContext = function() {
+    return [types$1.b_stat]
+  };
+
+  pp$7.braceIsBlock = function(prevType) {
+    var parent = this.curContext();
+    if (parent === types$1.f_expr || parent === types$1.f_stat)
+      { return true }
+    if (prevType === types.colon && (parent === types$1.b_stat || parent === types$1.b_expr))
+      { return !parent.isExpr }
+
+    // The check for `tt.name && exprAllowed` detects whether we are
+    // after a `yield` or `of` construct. See the `updateContext` for
+    // `tt.name`.
+    if (prevType === types._return || prevType === types.name && this.exprAllowed)
+      { return lineBreak.test(this.input.slice(this.lastTokEnd, this.start)) }
+    if (prevType === types._else || prevType === types.semi || prevType === types.eof || prevType === types.parenR || prevType === types.arrow)
+      { return true }
+    if (prevType === types.braceL)
+      { return parent === types$1.b_stat }
+    if (prevType === types._var || prevType === types._const || prevType === types.name)
+      { return false }
+    return !this.exprAllowed
+  };
+
+  pp$7.inGeneratorContext = function() {
+    for (var i = this.context.length - 1; i >= 1; i--) {
+      var context = this.context[i];
+      if (context.token === "function")
+        { return context.generator }
+    }
+    return false
+  };
+
+  pp$7.updateContext = function(prevType) {
+    var update, type = this.type;
+    if (type.keyword && prevType === types.dot)
+      { this.exprAllowed = false; }
+    else if (update = type.updateContext)
+      { update.call(this, prevType); }
+    else
+      { this.exprAllowed = type.beforeExpr; }
+  };
+
+  // Token-specific context update code
+
+  types.parenR.updateContext = types.braceR.updateContext = function() {
+    if (this.context.length === 1) {
+      this.exprAllowed = true;
+      return
+    }
+    var out = this.context.pop();
+    if (out === types$1.b_stat && this.curContext().token === "function") {
+      out = this.context.pop();
+    }
+    this.exprAllowed = !out.isExpr;
+  };
+
+  types.braceL.updateContext = function(prevType) {
+    this.context.push(this.braceIsBlock(prevType) ? types$1.b_stat : types$1.b_expr);
+    this.exprAllowed = true;
+  };
+
+  types.dollarBraceL.updateContext = function() {
+    this.context.push(types$1.b_tmpl);
+    this.exprAllowed = true;
+  };
+
+  types.parenL.updateContext = function(prevType) {
+    var statementParens = prevType === types._if || prevType === types._for || prevType === types._with || prevType === types._while;
+    this.context.push(statementParens ? types$1.p_stat : types$1.p_expr);
+    this.exprAllowed = true;
+  };
+
+  types.incDec.updateContext = function() {
+    // tokExprAllowed stays unchanged
+  };
+
+  types._function.updateContext = types._class.updateContext = function(prevType) {
+    if (prevType.beforeExpr && prevType !== types._else &&
+        !(prevType === types.semi && this.curContext() !== types$1.p_stat) &&
+        !(prevType === types._return && lineBreak.test(this.input.slice(this.lastTokEnd, this.start))) &&
+        !((prevType === types.colon || prevType === types.braceL) && this.curContext() === types$1.b_stat))
+      { this.context.push(types$1.f_expr); }
+    else
+      { this.context.push(types$1.f_stat); }
+    this.exprAllowed = false;
+  };
+
+  types.backQuote.updateContext = function() {
+    if (this.curContext() === types$1.q_tmpl)
+      { this.context.pop(); }
+    else
+      { this.context.push(types$1.q_tmpl); }
+    this.exprAllowed = false;
+  };
+
+  types.star.updateContext = function(prevType) {
+    if (prevType === types._function) {
+      var index = this.context.length - 1;
+      if (this.context[index] === types$1.f_expr)
+        { this.context[index] = types$1.f_expr_gen; }
+      else
+        { this.context[index] = types$1.f_gen; }
+    }
+    this.exprAllowed = true;
+  };
+
+  types.name.updateContext = function(prevType) {
+    var allowed = false;
+    if (this.options.ecmaVersion >= 6 && prevType !== types.dot) {
+      if (this.value === "of" && !this.exprAllowed ||
+          this.value === "yield" && this.inGeneratorContext())
+        { allowed = true; }
+    }
+    this.exprAllowed = allowed;
+  };
+
+  // This file contains Unicode properties extracted from the ECMAScript
+  // specification. The lists are extracted like so:
+  // $$('#table-binary-unicode-properties > figure > table > tbody > tr > td:nth-child(1) code').map(el => el.innerText)
+
+  // #table-binary-unicode-properties
+  var ecma9BinaryProperties = "ASCII ASCII_Hex_Digit AHex Alphabetic Alpha Any Assigned Bidi_Control Bidi_C Bidi_Mirrored Bidi_M Case_Ignorable CI Cased Changes_When_Casefolded CWCF Changes_When_Casemapped CWCM Changes_When_Lowercased CWL Changes_When_NFKC_Casefolded CWKCF Changes_When_Titlecased CWT Changes_When_Uppercased CWU Dash Default_Ignorable_Code_Point DI Deprecated Dep Diacritic Dia Emoji Emoji_Component Emoji_Modifier Emoji_Modifier_Base Emoji_Presentation Extender Ext Grapheme_Base Gr_Base Grapheme_Extend Gr_Ext Hex_Digit Hex IDS_Binary_Operator IDSB IDS_Trinary_Operator IDST ID_Continue IDC ID_Start IDS Ideographic Ideo Join_Control Join_C Logical_Order_Exception LOE Lowercase Lower Math Noncharacter_Code_Point NChar Pattern_Syntax Pat_Syn Pattern_White_Space Pat_WS Quotation_Mark QMark Radical Regional_Indicator RI Sentence_Terminal STerm Soft_Dotted SD Terminal_Punctuation Term Unified_Ideograph UIdeo Uppercase Upper Variation_Selector VS White_Space space XID_Continue XIDC XID_Start XIDS";
+  var ecma10BinaryProperties = ecma9BinaryProperties + " Extended_Pictographic";
+  var ecma11BinaryProperties = ecma10BinaryProperties;
+  var ecma12BinaryProperties = ecma11BinaryProperties + " EBase EComp EMod EPres ExtPict";
+  var unicodeBinaryProperties = {
+    9: ecma9BinaryProperties,
+    10: ecma10BinaryProperties,
+    11: ecma11BinaryProperties,
+    12: ecma12BinaryProperties
+  };
+
+  // #table-unicode-general-category-values
+  var unicodeGeneralCategoryValues = "Cased_Letter LC Close_Punctuation Pe Connector_Punctuation Pc Control Cc cntrl Currency_Symbol Sc Dash_Punctuation Pd Decimal_Number Nd digit Enclosing_Mark Me Final_Punctuation Pf Format Cf Initial_Punctuation Pi Letter L Letter_Number Nl Line_Separator Zl Lowercase_Letter Ll Mark M Combining_Mark Math_Symbol Sm Modifier_Letter Lm Modifier_Symbol Sk Nonspacing_Mark Mn Number N Open_Punctuation Ps Other C Other_Letter Lo Other_Number No Other_Punctuation Po Other_Symbol So Paragraph_Separator Zp Private_Use Co Punctuation P punct Separator Z Space_Separator Zs Spacing_Mark Mc Surrogate Cs Symbol S Titlecase_Letter Lt Unassigned Cn Uppercase_Letter Lu";
+
+  // #table-unicode-script-values
+  var ecma9ScriptValues = "Adlam Adlm Ahom Ahom Anatolian_Hieroglyphs Hluw Arabic Arab Armenian Armn Avestan Avst Balinese Bali Bamum Bamu Bassa_Vah Bass Batak Batk Bengali Beng Bhaiksuki Bhks Bopomofo Bopo Brahmi Brah Braille Brai Buginese Bugi Buhid Buhd Canadian_Aboriginal Cans Carian Cari Caucasian_Albanian Aghb Chakma Cakm Cham Cham Cherokee Cher Common Zyyy Coptic Copt Qaac Cuneiform Xsux Cypriot Cprt Cyrillic Cyrl Deseret Dsrt Devanagari Deva Duployan Dupl Egyptian_Hieroglyphs Egyp Elbasan Elba Ethiopic Ethi Georgian Geor Glagolitic Glag Gothic Goth Grantha Gran Greek Grek Gujarati Gujr Gurmukhi Guru Han Hani Hangul Hang Hanunoo Hano Hatran Hatr Hebrew Hebr Hiragana Hira Imperial_Aramaic Armi Inherited Zinh Qaai Inscriptional_Pahlavi Phli Inscriptional_Parthian Prti Javanese Java Kaithi Kthi Kannada Knda Katakana Kana Kayah_Li Kali Kharoshthi Khar Khmer Khmr Khojki Khoj Khudawadi Sind Lao Laoo Latin Latn Lepcha Lepc Limbu Limb Linear_A Lina Linear_B Linb Lisu Lisu Lycian Lyci Lydian Lydi Mahajani Mahj Malayalam Mlym Mandaic Mand Manichaean Mani Marchen Marc Masaram_Gondi Gonm Meetei_Mayek Mtei Mende_Kikakui Mend Meroitic_Cursive Merc Meroitic_Hieroglyphs Mero Miao Plrd Modi Modi Mongolian Mong Mro Mroo Multani Mult Myanmar Mymr Nabataean Nbat New_Tai_Lue Talu Newa Newa Nko Nkoo Nushu Nshu Ogham Ogam Ol_Chiki Olck Old_Hungarian Hung Old_Italic Ital Old_North_Arabian Narb Old_Permic Perm Old_Persian Xpeo Old_South_Arabian Sarb Old_Turkic Orkh Oriya Orya Osage Osge Osmanya Osma Pahawh_Hmong Hmng Palmyrene Palm Pau_Cin_Hau Pauc Phags_Pa Phag Phoenician Phnx Psalter_Pahlavi Phlp Rejang Rjng Runic Runr Samaritan Samr Saurashtra Saur Sharada Shrd Shavian Shaw Siddham Sidd SignWriting Sgnw Sinhala Sinh Sora_Sompeng Sora Soyombo Soyo Sundanese Sund Syloti_Nagri Sylo Syriac Syrc Tagalog Tglg Tagbanwa Tagb Tai_Le Tale Tai_Tham Lana Tai_Viet Tavt Takri Takr Tamil Taml Tangut Tang Telugu Telu Thaana Thaa Thai Thai Tibetan Tibt Tifinagh Tfng Tirhuta Tirh Ugaritic Ugar Vai Vaii Warang_Citi Wara Yi Yiii Zanabazar_Square Zanb";
+  var ecma10ScriptValues = ecma9ScriptValues + " Dogra Dogr Gunjala_Gondi Gong Hanifi_Rohingya Rohg Makasar Maka Medefaidrin Medf Old_Sogdian Sogo Sogdian Sogd";
+  var ecma11ScriptValues = ecma10ScriptValues + " Elymaic Elym Nandinagari Nand Nyiakeng_Puachue_Hmong Hmnp Wancho Wcho";
+  var ecma12ScriptValues = ecma11ScriptValues + " Chorasmian Chrs Diak Dives_Akuru Khitan_Small_Script Kits Yezi Yezidi";
+  var unicodeScriptValues = {
+    9: ecma9ScriptValues,
+    10: ecma10ScriptValues,
+    11: ecma11ScriptValues,
+    12: ecma12ScriptValues
+  };
+
+  var data = {};
+  function buildUnicodeData(ecmaVersion) {
+    var d = data[ecmaVersion] = {
+      binary: wordsRegexp(unicodeBinaryProperties[ecmaVersion] + " " + unicodeGeneralCategoryValues),
+      nonBinary: {
+        General_Category: wordsRegexp(unicodeGeneralCategoryValues),
+        Script: wordsRegexp(unicodeScriptValues[ecmaVersion])
+      }
+    };
+    d.nonBinary.Script_Extensions = d.nonBinary.Script;
+
+    d.nonBinary.gc = d.nonBinary.General_Category;
+    d.nonBinary.sc = d.nonBinary.Script;
+    d.nonBinary.scx = d.nonBinary.Script_Extensions;
+  }
+  buildUnicodeData(9);
+  buildUnicodeData(10);
+  buildUnicodeData(11);
+  buildUnicodeData(12);
+
+  var pp$8 = Parser.prototype;
+
+  var RegExpValidationState = function RegExpValidationState(parser) {
+    this.parser = parser;
+    this.validFlags = "gim" + (parser.options.ecmaVersion >= 6 ? "uy" : "") + (parser.options.ecmaVersion >= 9 ? "s" : "");
+    this.unicodeProperties = data[parser.options.ecmaVersion >= 12 ? 12 : parser.options.ecmaVersion];
+    this.source = "";
+    this.flags = "";
+    this.start = 0;
+    this.switchU = false;
+    this.switchN = false;
+    this.pos = 0;
+    this.lastIntValue = 0;
+    this.lastStringValue = "";
+    this.lastAssertionIsQuantifiable = false;
+    this.numCapturingParens = 0;
+    this.maxBackReference = 0;
+    this.groupNames = [];
+    this.backReferenceNames = [];
+  };
+
+  RegExpValidationState.prototype.reset = function reset (start, pattern, flags) {
+    var unicode = flags.indexOf("u") !== -1;
+    this.start = start | 0;
+    this.source = pattern + "";
+    this.flags = flags;
+    this.switchU = unicode && this.parser.options.ecmaVersion >= 6;
+    this.switchN = unicode && this.parser.options.ecmaVersion >= 9;
+  };
+
+  RegExpValidationState.prototype.raise = function raise (message) {
+    this.parser.raiseRecoverable(this.start, ("Invalid regular expression: /" + (this.source) + "/: " + message));
+  };
+
+  // If u flag is given, this returns the code point at the index (it combines a surrogate pair).
+  // Otherwise, this returns the code unit of the index (can be a part of a surrogate pair).
+  RegExpValidationState.prototype.at = function at (i, forceU) {
+      if ( forceU === void 0 ) forceU = false;
+
+    var s = this.source;
+    var l = s.length;
+    if (i >= l) {
+      return -1
+    }
+    var c = s.charCodeAt(i);
+    if (!(forceU || this.switchU) || c <= 0xD7FF || c >= 0xE000 || i + 1 >= l) {
+      return c
+    }
+    var next = s.charCodeAt(i + 1);
+    return next >= 0xDC00 && next <= 0xDFFF ? (c << 10) + next - 0x35FDC00 : c
+  };
+
+  RegExpValidationState.prototype.nextIndex = function nextIndex (i, forceU) {
+      if ( forceU === void 0 ) forceU = false;
+
+    var s = this.source;
+    var l = s.length;
+    if (i >= l) {
+      return l
+    }
+    var c = s.charCodeAt(i), next;
+    if (!(forceU || this.switchU) || c <= 0xD7FF || c >= 0xE000 || i + 1 >= l ||
+        (next = s.charCodeAt(i + 1)) < 0xDC00 || next > 0xDFFF) {
+      return i + 1
+    }
+    return i + 2
+  };
+
+  RegExpValidationState.prototype.current = function current (forceU) {
+      if ( forceU === void 0 ) forceU = false;
+
+    return this.at(this.pos, forceU)
+  };
+
+  RegExpValidationState.prototype.lookahead = function lookahead (forceU) {
+      if ( forceU === void 0 ) forceU = false;
+
+    return this.at(this.nextIndex(this.pos, forceU), forceU)
+  };
+
+  RegExpValidationState.prototype.advance = function advance (forceU) {
+      if ( forceU === void 0 ) forceU = false;
+
+    this.pos = this.nextIndex(this.pos, forceU);
+  };
+
+  RegExpValidationState.prototype.eat = function eat (ch, forceU) {
+      if ( forceU === void 0 ) forceU = false;
+
+    if (this.current(forceU) === ch) {
+      this.advance(forceU);
+      return true
+    }
+    return false
+  };
+
+  function codePointToString(ch) {
+    if (ch <= 0xFFFF) { return String.fromCharCode(ch) }
+    ch -= 0x10000;
+    return String.fromCharCode((ch >> 10) + 0xD800, (ch & 0x03FF) + 0xDC00)
+  }
+
+  /**
+   * Validate the flags part of a given RegExpLiteral.
+   *
+   * @param {RegExpValidationState} state The state to validate RegExp.
+   * @returns {void}
+   */
+  pp$8.validateRegExpFlags = function(state) {
+    var validFlags = state.validFlags;
+    var flags = state.flags;
+
+    for (var i = 0; i < flags.length; i++) {
+      var flag = flags.charAt(i);
+      if (validFlags.indexOf(flag) === -1) {
+        this.raise(state.start, "Invalid regular expression flag");
+      }
+      if (flags.indexOf(flag, i + 1) > -1) {
+        this.raise(state.start, "Duplicate regular expression flag");
+      }
+    }
+  };
+
+  /**
+   * Validate the pattern part of a given RegExpLiteral.
+   *
+   * @param {RegExpValidationState} state The state to validate RegExp.
+   * @returns {void}
+   */
+  pp$8.validateRegExpPattern = function(state) {
+    this.regexp_pattern(state);
+
+    // The goal symbol for the parse is |Pattern[~U, ~N]|. If the result of
+    // parsing contains a |GroupName|, reparse with the goal symbol
+    // |Pattern[~U, +N]| and use this result instead. Throw a *SyntaxError*
+    // exception if _P_ did not conform to the grammar, if any elements of _P_
+    // were not matched by the parse, or if any Early Error conditions exist.
+    if (!state.switchN && this.options.ecmaVersion >= 9 && state.groupNames.length > 0) {
+      state.switchN = true;
+      this.regexp_pattern(state);
+    }
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-Pattern
+  pp$8.regexp_pattern = function(state) {
+    state.pos = 0;
+    state.lastIntValue = 0;
+    state.lastStringValue = "";
+    state.lastAssertionIsQuantifiable = false;
+    state.numCapturingParens = 0;
+    state.maxBackReference = 0;
+    state.groupNames.length = 0;
+    state.backReferenceNames.length = 0;
+
+    this.regexp_disjunction(state);
+
+    if (state.pos !== state.source.length) {
+      // Make the same messages as V8.
+      if (state.eat(0x29 /* ) */)) {
+        state.raise("Unmatched ')'");
+      }
+      if (state.eat(0x5D /* ] */) || state.eat(0x7D /* } */)) {
+        state.raise("Lone quantifier brackets");
+      }
+    }
+    if (state.maxBackReference > state.numCapturingParens) {
+      state.raise("Invalid escape");
+    }
+    for (var i = 0, list = state.backReferenceNames; i < list.length; i += 1) {
+      var name = list[i];
+
+      if (state.groupNames.indexOf(name) === -1) {
+        state.raise("Invalid named capture referenced");
+      }
+    }
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-Disjunction
+  pp$8.regexp_disjunction = function(state) {
+    this.regexp_alternative(state);
+    while (state.eat(0x7C /* | */)) {
+      this.regexp_alternative(state);
+    }
+
+    // Make the same message as V8.
+    if (this.regexp_eatQuantifier(state, true)) {
+      state.raise("Nothing to repeat");
+    }
+    if (state.eat(0x7B /* { */)) {
+      state.raise("Lone quantifier brackets");
+    }
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-Alternative
+  pp$8.regexp_alternative = function(state) {
+    while (state.pos < state.source.length && this.regexp_eatTerm(state))
+      { }
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-Term
+  pp$8.regexp_eatTerm = function(state) {
+    if (this.regexp_eatAssertion(state)) {
+      // Handle `QuantifiableAssertion Quantifier` alternative.
+      // `state.lastAssertionIsQuantifiable` is true if the last eaten Assertion
+      // is a QuantifiableAssertion.
+      if (state.lastAssertionIsQuantifiable && this.regexp_eatQuantifier(state)) {
+        // Make the same message as V8.
+        if (state.switchU) {
+          state.raise("Invalid quantifier");
+        }
+      }
+      return true
+    }
+
+    if (state.switchU ? this.regexp_eatAtom(state) : this.regexp_eatExtendedAtom(state)) {
+      this.regexp_eatQuantifier(state);
+      return true
+    }
+
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-Assertion
+  pp$8.regexp_eatAssertion = function(state) {
+    var start = state.pos;
+    state.lastAssertionIsQuantifiable = false;
+
+    // ^, $
+    if (state.eat(0x5E /* ^ */) || state.eat(0x24 /* $ */)) {
+      return true
+    }
+
+    // \b \B
+    if (state.eat(0x5C /* \ */)) {
+      if (state.eat(0x42 /* B */) || state.eat(0x62 /* b */)) {
+        return true
+      }
+      state.pos = start;
+    }
+
+    // Lookahead / Lookbehind
+    if (state.eat(0x28 /* ( */) && state.eat(0x3F /* ? */)) {
+      var lookbehind = false;
+      if (this.options.ecmaVersion >= 9) {
+        lookbehind = state.eat(0x3C /* < */);
+      }
+      if (state.eat(0x3D /* = */) || state.eat(0x21 /* ! */)) {
+        this.regexp_disjunction(state);
+        if (!state.eat(0x29 /* ) */)) {
+          state.raise("Unterminated group");
+        }
+        state.lastAssertionIsQuantifiable = !lookbehind;
+        return true
+      }
+    }
+
+    state.pos = start;
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-Quantifier
+  pp$8.regexp_eatQuantifier = function(state, noError) {
+    if ( noError === void 0 ) noError = false;
+
+    if (this.regexp_eatQuantifierPrefix(state, noError)) {
+      state.eat(0x3F /* ? */);
+      return true
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-QuantifierPrefix
+  pp$8.regexp_eatQuantifierPrefix = function(state, noError) {
+    return (
+      state.eat(0x2A /* * */) ||
+      state.eat(0x2B /* + */) ||
+      state.eat(0x3F /* ? */) ||
+      this.regexp_eatBracedQuantifier(state, noError)
+    )
+  };
+  pp$8.regexp_eatBracedQuantifier = function(state, noError) {
+    var start = state.pos;
+    if (state.eat(0x7B /* { */)) {
+      var min = 0, max = -1;
+      if (this.regexp_eatDecimalDigits(state)) {
+        min = state.lastIntValue;
+        if (state.eat(0x2C /* , */) && this.regexp_eatDecimalDigits(state)) {
+          max = state.lastIntValue;
+        }
+        if (state.eat(0x7D /* } */)) {
+          // SyntaxError in https://www.ecma-international.org/ecma-262/8.0/#sec-term
+          if (max !== -1 && max < min && !noError) {
+            state.raise("numbers out of order in {} quantifier");
+          }
+          return true
+        }
+      }
+      if (state.switchU && !noError) {
+        state.raise("Incomplete quantifier");
+      }
+      state.pos = start;
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-Atom
+  pp$8.regexp_eatAtom = function(state) {
+    return (
+      this.regexp_eatPatternCharacters(state) ||
+      state.eat(0x2E /* . */) ||
+      this.regexp_eatReverseSolidusAtomEscape(state) ||
+      this.regexp_eatCharacterClass(state) ||
+      this.regexp_eatUncapturingGroup(state) ||
+      this.regexp_eatCapturingGroup(state)
+    )
+  };
+  pp$8.regexp_eatReverseSolidusAtomEscape = function(state) {
+    var start = state.pos;
+    if (state.eat(0x5C /* \ */)) {
+      if (this.regexp_eatAtomEscape(state)) {
+        return true
+      }
+      state.pos = start;
+    }
+    return false
+  };
+  pp$8.regexp_eatUncapturingGroup = function(state) {
+    var start = state.pos;
+    if (state.eat(0x28 /* ( */)) {
+      if (state.eat(0x3F /* ? */) && state.eat(0x3A /* : */)) {
+        this.regexp_disjunction(state);
+        if (state.eat(0x29 /* ) */)) {
+          return true
+        }
+        state.raise("Unterminated group");
+      }
+      state.pos = start;
+    }
+    return false
+  };
+  pp$8.regexp_eatCapturingGroup = function(state) {
+    if (state.eat(0x28 /* ( */)) {
+      if (this.options.ecmaVersion >= 9) {
+        this.regexp_groupSpecifier(state);
+      } else if (state.current() === 0x3F /* ? */) {
+        state.raise("Invalid group");
+      }
+      this.regexp_disjunction(state);
+      if (state.eat(0x29 /* ) */)) {
+        state.numCapturingParens += 1;
+        return true
+      }
+      state.raise("Unterminated group");
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-ExtendedAtom
+  pp$8.regexp_eatExtendedAtom = function(state) {
+    return (
+      state.eat(0x2E /* . */) ||
+      this.regexp_eatReverseSolidusAtomEscape(state) ||
+      this.regexp_eatCharacterClass(state) ||
+      this.regexp_eatUncapturingGroup(state) ||
+      this.regexp_eatCapturingGroup(state) ||
+      this.regexp_eatInvalidBracedQuantifier(state) ||
+      this.regexp_eatExtendedPatternCharacter(state)
+    )
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-InvalidBracedQuantifier
+  pp$8.regexp_eatInvalidBracedQuantifier = function(state) {
+    if (this.regexp_eatBracedQuantifier(state, true)) {
+      state.raise("Nothing to repeat");
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-SyntaxCharacter
+  pp$8.regexp_eatSyntaxCharacter = function(state) {
+    var ch = state.current();
+    if (isSyntaxCharacter(ch)) {
+      state.lastIntValue = ch;
+      state.advance();
+      return true
+    }
+    return false
+  };
+  function isSyntaxCharacter(ch) {
+    return (
+      ch === 0x24 /* $ */ ||
+      ch >= 0x28 /* ( */ && ch <= 0x2B /* + */ ||
+      ch === 0x2E /* . */ ||
+      ch === 0x3F /* ? */ ||
+      ch >= 0x5B /* [ */ && ch <= 0x5E /* ^ */ ||
+      ch >= 0x7B /* { */ && ch <= 0x7D /* } */
+    )
+  }
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-PatternCharacter
+  // But eat eager.
+  pp$8.regexp_eatPatternCharacters = function(state) {
+    var start = state.pos;
+    var ch = 0;
+    while ((ch = state.current()) !== -1 && !isSyntaxCharacter(ch)) {
+      state.advance();
+    }
+    return state.pos !== start
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-ExtendedPatternCharacter
+  pp$8.regexp_eatExtendedPatternCharacter = function(state) {
+    var ch = state.current();
+    if (
+      ch !== -1 &&
+      ch !== 0x24 /* $ */ &&
+      !(ch >= 0x28 /* ( */ && ch <= 0x2B /* + */) &&
+      ch !== 0x2E /* . */ &&
+      ch !== 0x3F /* ? */ &&
+      ch !== 0x5B /* [ */ &&
+      ch !== 0x5E /* ^ */ &&
+      ch !== 0x7C /* | */
+    ) {
+      state.advance();
+      return true
+    }
+    return false
+  };
+
+  // GroupSpecifier ::
+  //   [empty]
+  //   `?` GroupName
+  pp$8.regexp_groupSpecifier = function(state) {
+    if (state.eat(0x3F /* ? */)) {
+      if (this.regexp_eatGroupName(state)) {
+        if (state.groupNames.indexOf(state.lastStringValue) !== -1) {
+          state.raise("Duplicate capture group name");
+        }
+        state.groupNames.push(state.lastStringValue);
+        return
+      }
+      state.raise("Invalid group");
+    }
+  };
+
+  // GroupName ::
+  //   `<` RegExpIdentifierName `>`
+  // Note: this updates `state.lastStringValue` property with the eaten name.
+  pp$8.regexp_eatGroupName = function(state) {
+    state.lastStringValue = "";
+    if (state.eat(0x3C /* < */)) {
+      if (this.regexp_eatRegExpIdentifierName(state) && state.eat(0x3E /* > */)) {
+        return true
+      }
+      state.raise("Invalid capture group name");
+    }
+    return false
+  };
+
+  // RegExpIdentifierName ::
+  //   RegExpIdentifierStart
+  //   RegExpIdentifierName RegExpIdentifierPart
+  // Note: this updates `state.lastStringValue` property with the eaten name.
+  pp$8.regexp_eatRegExpIdentifierName = function(state) {
+    state.lastStringValue = "";
+    if (this.regexp_eatRegExpIdentifierStart(state)) {
+      state.lastStringValue += codePointToString(state.lastIntValue);
+      while (this.regexp_eatRegExpIdentifierPart(state)) {
+        state.lastStringValue += codePointToString(state.lastIntValue);
+      }
+      return true
+    }
+    return false
+  };
+
+  // RegExpIdentifierStart ::
+  //   UnicodeIDStart
+  //   `$`
+  //   `_`
+  //   `\` RegExpUnicodeEscapeSequence[+U]
+  pp$8.regexp_eatRegExpIdentifierStart = function(state) {
+    var start = state.pos;
+    var forceU = this.options.ecmaVersion >= 11;
+    var ch = state.current(forceU);
+    state.advance(forceU);
+
+    if (ch === 0x5C /* \ */ && this.regexp_eatRegExpUnicodeEscapeSequence(state, forceU)) {
+      ch = state.lastIntValue;
+    }
+    if (isRegExpIdentifierStart(ch)) {
+      state.lastIntValue = ch;
+      return true
+    }
+
+    state.pos = start;
+    return false
+  };
+  function isRegExpIdentifierStart(ch) {
+    return isIdentifierStart(ch, true) || ch === 0x24 /* $ */ || ch === 0x5F /* _ */
+  }
+
+  // RegExpIdentifierPart ::
+  //   UnicodeIDContinue
+  //   `$`
+  //   `_`
+  //   `\` RegExpUnicodeEscapeSequence[+U]
+  //   <ZWNJ>
+  //   <ZWJ>
+  pp$8.regexp_eatRegExpIdentifierPart = function(state) {
+    var start = state.pos;
+    var forceU = this.options.ecmaVersion >= 11;
+    var ch = state.current(forceU);
+    state.advance(forceU);
+
+    if (ch === 0x5C /* \ */ && this.regexp_eatRegExpUnicodeEscapeSequence(state, forceU)) {
+      ch = state.lastIntValue;
+    }
+    if (isRegExpIdentifierPart(ch)) {
+      state.lastIntValue = ch;
+      return true
+    }
+
+    state.pos = start;
+    return false
+  };
+  function isRegExpIdentifierPart(ch) {
+    return isIdentifierChar(ch, true) || ch === 0x24 /* $ */ || ch === 0x5F /* _ */ || ch === 0x200C /* <ZWNJ> */ || ch === 0x200D /* <ZWJ> */
+  }
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-AtomEscape
+  pp$8.regexp_eatAtomEscape = function(state) {
+    if (
+      this.regexp_eatBackReference(state) ||
+      this.regexp_eatCharacterClassEscape(state) ||
+      this.regexp_eatCharacterEscape(state) ||
+      (state.switchN && this.regexp_eatKGroupName(state))
+    ) {
+      return true
+    }
+    if (state.switchU) {
+      // Make the same message as V8.
+      if (state.current() === 0x63 /* c */) {
+        state.raise("Invalid unicode escape");
+      }
+      state.raise("Invalid escape");
+    }
+    return false
+  };
+  pp$8.regexp_eatBackReference = function(state) {
+    var start = state.pos;
+    if (this.regexp_eatDecimalEscape(state)) {
+      var n = state.lastIntValue;
+      if (state.switchU) {
+        // For SyntaxError in https://www.ecma-international.org/ecma-262/8.0/#sec-atomescape
+        if (n > state.maxBackReference) {
+          state.maxBackReference = n;
+        }
+        return true
+      }
+      if (n <= state.numCapturingParens) {
+        return true
+      }
+      state.pos = start;
+    }
+    return false
+  };
+  pp$8.regexp_eatKGroupName = function(state) {
+    if (state.eat(0x6B /* k */)) {
+      if (this.regexp_eatGroupName(state)) {
+        state.backReferenceNames.push(state.lastStringValue);
+        return true
+      }
+      state.raise("Invalid named reference");
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-CharacterEscape
+  pp$8.regexp_eatCharacterEscape = function(state) {
+    return (
+      this.regexp_eatControlEscape(state) ||
+      this.regexp_eatCControlLetter(state) ||
+      this.regexp_eatZero(state) ||
+      this.regexp_eatHexEscapeSequence(state) ||
+      this.regexp_eatRegExpUnicodeEscapeSequence(state, false) ||
+      (!state.switchU && this.regexp_eatLegacyOctalEscapeSequence(state)) ||
+      this.regexp_eatIdentityEscape(state)
+    )
+  };
+  pp$8.regexp_eatCControlLetter = function(state) {
+    var start = state.pos;
+    if (state.eat(0x63 /* c */)) {
+      if (this.regexp_eatControlLetter(state)) {
+        return true
+      }
+      state.pos = start;
+    }
+    return false
+  };
+  pp$8.regexp_eatZero = function(state) {
+    if (state.current() === 0x30 /* 0 */ && !isDecimalDigit(state.lookahead())) {
+      state.lastIntValue = 0;
+      state.advance();
+      return true
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-ControlEscape
+  pp$8.regexp_eatControlEscape = function(state) {
+    var ch = state.current();
+    if (ch === 0x74 /* t */) {
+      state.lastIntValue = 0x09; /* \t */
+      state.advance();
+      return true
+    }
+    if (ch === 0x6E /* n */) {
+      state.lastIntValue = 0x0A; /* \n */
+      state.advance();
+      return true
+    }
+    if (ch === 0x76 /* v */) {
+      state.lastIntValue = 0x0B; /* \v */
+      state.advance();
+      return true
+    }
+    if (ch === 0x66 /* f */) {
+      state.lastIntValue = 0x0C; /* \f */
+      state.advance();
+      return true
+    }
+    if (ch === 0x72 /* r */) {
+      state.lastIntValue = 0x0D; /* \r */
+      state.advance();
+      return true
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-ControlLetter
+  pp$8.regexp_eatControlLetter = function(state) {
+    var ch = state.current();
+    if (isControlLetter(ch)) {
+      state.lastIntValue = ch % 0x20;
+      state.advance();
+      return true
+    }
+    return false
+  };
+  function isControlLetter(ch) {
+    return (
+      (ch >= 0x41 /* A */ && ch <= 0x5A /* Z */) ||
+      (ch >= 0x61 /* a */ && ch <= 0x7A /* z */)
+    )
+  }
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-RegExpUnicodeEscapeSequence
+  pp$8.regexp_eatRegExpUnicodeEscapeSequence = function(state, forceU) {
+    if ( forceU === void 0 ) forceU = false;
+
+    var start = state.pos;
+    var switchU = forceU || state.switchU;
+
+    if (state.eat(0x75 /* u */)) {
+      if (this.regexp_eatFixedHexDigits(state, 4)) {
+        var lead = state.lastIntValue;
+        if (switchU && lead >= 0xD800 && lead <= 0xDBFF) {
+          var leadSurrogateEnd = state.pos;
+          if (state.eat(0x5C /* \ */) && state.eat(0x75 /* u */) && this.regexp_eatFixedHexDigits(state, 4)) {
+            var trail = state.lastIntValue;
+            if (trail >= 0xDC00 && trail <= 0xDFFF) {
+              state.lastIntValue = (lead - 0xD800) * 0x400 + (trail - 0xDC00) + 0x10000;
+              return true
+            }
+          }
+          state.pos = leadSurrogateEnd;
+          state.lastIntValue = lead;
+        }
+        return true
+      }
+      if (
+        switchU &&
+        state.eat(0x7B /* { */) &&
+        this.regexp_eatHexDigits(state) &&
+        state.eat(0x7D /* } */) &&
+        isValidUnicode(state.lastIntValue)
+      ) {
+        return true
+      }
+      if (switchU) {
+        state.raise("Invalid unicode escape");
+      }
+      state.pos = start;
+    }
+
+    return false
+  };
+  function isValidUnicode(ch) {
+    return ch >= 0 && ch <= 0x10FFFF
+  }
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-IdentityEscape
+  pp$8.regexp_eatIdentityEscape = function(state) {
+    if (state.switchU) {
+      if (this.regexp_eatSyntaxCharacter(state)) {
+        return true
+      }
+      if (state.eat(0x2F /* / */)) {
+        state.lastIntValue = 0x2F; /* / */
+        return true
+      }
+      return false
+    }
+
+    var ch = state.current();
+    if (ch !== 0x63 /* c */ && (!state.switchN || ch !== 0x6B /* k */)) {
+      state.lastIntValue = ch;
+      state.advance();
+      return true
+    }
+
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-DecimalEscape
+  pp$8.regexp_eatDecimalEscape = function(state) {
+    state.lastIntValue = 0;
+    var ch = state.current();
+    if (ch >= 0x31 /* 1 */ && ch <= 0x39 /* 9 */) {
+      do {
+        state.lastIntValue = 10 * state.lastIntValue + (ch - 0x30 /* 0 */);
+        state.advance();
+      } while ((ch = state.current()) >= 0x30 /* 0 */ && ch <= 0x39 /* 9 */)
+      return true
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-CharacterClassEscape
+  pp$8.regexp_eatCharacterClassEscape = function(state) {
+    var ch = state.current();
+
+    if (isCharacterClassEscape(ch)) {
+      state.lastIntValue = -1;
+      state.advance();
+      return true
+    }
+
+    if (
+      state.switchU &&
+      this.options.ecmaVersion >= 9 &&
+      (ch === 0x50 /* P */ || ch === 0x70 /* p */)
+    ) {
+      state.lastIntValue = -1;
+      state.advance();
+      if (
+        state.eat(0x7B /* { */) &&
+        this.regexp_eatUnicodePropertyValueExpression(state) &&
+        state.eat(0x7D /* } */)
+      ) {
+        return true
+      }
+      state.raise("Invalid property name");
+    }
+
+    return false
+  };
+  function isCharacterClassEscape(ch) {
+    return (
+      ch === 0x64 /* d */ ||
+      ch === 0x44 /* D */ ||
+      ch === 0x73 /* s */ ||
+      ch === 0x53 /* S */ ||
+      ch === 0x77 /* w */ ||
+      ch === 0x57 /* W */
+    )
+  }
+
+  // UnicodePropertyValueExpression ::
+  //   UnicodePropertyName `=` UnicodePropertyValue
+  //   LoneUnicodePropertyNameOrValue
+  pp$8.regexp_eatUnicodePropertyValueExpression = function(state) {
+    var start = state.pos;
+
+    // UnicodePropertyName `=` UnicodePropertyValue
+    if (this.regexp_eatUnicodePropertyName(state) && state.eat(0x3D /* = */)) {
+      var name = state.lastStringValue;
+      if (this.regexp_eatUnicodePropertyValue(state)) {
+        var value = state.lastStringValue;
+        this.regexp_validateUnicodePropertyNameAndValue(state, name, value);
+        return true
+      }
+    }
+    state.pos = start;
+
+    // LoneUnicodePropertyNameOrValue
+    if (this.regexp_eatLoneUnicodePropertyNameOrValue(state)) {
+      var nameOrValue = state.lastStringValue;
+      this.regexp_validateUnicodePropertyNameOrValue(state, nameOrValue);
+      return true
+    }
+    return false
+  };
+  pp$8.regexp_validateUnicodePropertyNameAndValue = function(state, name, value) {
+    if (!has(state.unicodeProperties.nonBinary, name))
+      { state.raise("Invalid property name"); }
+    if (!state.unicodeProperties.nonBinary[name].test(value))
+      { state.raise("Invalid property value"); }
+  };
+  pp$8.regexp_validateUnicodePropertyNameOrValue = function(state, nameOrValue) {
+    if (!state.unicodeProperties.binary.test(nameOrValue))
+      { state.raise("Invalid property name"); }
+  };
+
+  // UnicodePropertyName ::
+  //   UnicodePropertyNameCharacters
+  pp$8.regexp_eatUnicodePropertyName = function(state) {
+    var ch = 0;
+    state.lastStringValue = "";
+    while (isUnicodePropertyNameCharacter(ch = state.current())) {
+      state.lastStringValue += codePointToString(ch);
+      state.advance();
+    }
+    return state.lastStringValue !== ""
+  };
+  function isUnicodePropertyNameCharacter(ch) {
+    return isControlLetter(ch) || ch === 0x5F /* _ */
+  }
+
+  // UnicodePropertyValue ::
+  //   UnicodePropertyValueCharacters
+  pp$8.regexp_eatUnicodePropertyValue = function(state) {
+    var ch = 0;
+    state.lastStringValue = "";
+    while (isUnicodePropertyValueCharacter(ch = state.current())) {
+      state.lastStringValue += codePointToString(ch);
+      state.advance();
+    }
+    return state.lastStringValue !== ""
+  };
+  function isUnicodePropertyValueCharacter(ch) {
+    return isUnicodePropertyNameCharacter(ch) || isDecimalDigit(ch)
+  }
+
+  // LoneUnicodePropertyNameOrValue ::
+  //   UnicodePropertyValueCharacters
+  pp$8.regexp_eatLoneUnicodePropertyNameOrValue = function(state) {
+    return this.regexp_eatUnicodePropertyValue(state)
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-CharacterClass
+  pp$8.regexp_eatCharacterClass = function(state) {
+    if (state.eat(0x5B /* [ */)) {
+      state.eat(0x5E /* ^ */);
+      this.regexp_classRanges(state);
+      if (state.eat(0x5D /* ] */)) {
+        return true
+      }
+      // Unreachable since it threw "unterminated regular expression" error before.
+      state.raise("Unterminated character class");
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-ClassRanges
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-NonemptyClassRanges
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-NonemptyClassRangesNoDash
+  pp$8.regexp_classRanges = function(state) {
+    while (this.regexp_eatClassAtom(state)) {
+      var left = state.lastIntValue;
+      if (state.eat(0x2D /* - */) && this.regexp_eatClassAtom(state)) {
+        var right = state.lastIntValue;
+        if (state.switchU && (left === -1 || right === -1)) {
+          state.raise("Invalid character class");
+        }
+        if (left !== -1 && right !== -1 && left > right) {
+          state.raise("Range out of order in character class");
+        }
+      }
+    }
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-ClassAtom
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-ClassAtomNoDash
+  pp$8.regexp_eatClassAtom = function(state) {
+    var start = state.pos;
+
+    if (state.eat(0x5C /* \ */)) {
+      if (this.regexp_eatClassEscape(state)) {
+        return true
+      }
+      if (state.switchU) {
+        // Make the same message as V8.
+        var ch$1 = state.current();
+        if (ch$1 === 0x63 /* c */ || isOctalDigit(ch$1)) {
+          state.raise("Invalid class escape");
+        }
+        state.raise("Invalid escape");
+      }
+      state.pos = start;
+    }
+
+    var ch = state.current();
+    if (ch !== 0x5D /* ] */) {
+      state.lastIntValue = ch;
+      state.advance();
+      return true
+    }
+
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-ClassEscape
+  pp$8.regexp_eatClassEscape = function(state) {
+    var start = state.pos;
+
+    if (state.eat(0x62 /* b */)) {
+      state.lastIntValue = 0x08; /* <BS> */
+      return true
+    }
+
+    if (state.switchU && state.eat(0x2D /* - */)) {
+      state.lastIntValue = 0x2D; /* - */
+      return true
+    }
+
+    if (!state.switchU && state.eat(0x63 /* c */)) {
+      if (this.regexp_eatClassControlLetter(state)) {
+        return true
+      }
+      state.pos = start;
+    }
+
+    return (
+      this.regexp_eatCharacterClassEscape(state) ||
+      this.regexp_eatCharacterEscape(state)
+    )
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-ClassControlLetter
+  pp$8.regexp_eatClassControlLetter = function(state) {
+    var ch = state.current();
+    if (isDecimalDigit(ch) || ch === 0x5F /* _ */) {
+      state.lastIntValue = ch % 0x20;
+      state.advance();
+      return true
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-HexEscapeSequence
+  pp$8.regexp_eatHexEscapeSequence = function(state) {
+    var start = state.pos;
+    if (state.eat(0x78 /* x */)) {
+      if (this.regexp_eatFixedHexDigits(state, 2)) {
+        return true
+      }
+      if (state.switchU) {
+        state.raise("Invalid escape");
+      }
+      state.pos = start;
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-DecimalDigits
+  pp$8.regexp_eatDecimalDigits = function(state) {
+    var start = state.pos;
+    var ch = 0;
+    state.lastIntValue = 0;
+    while (isDecimalDigit(ch = state.current())) {
+      state.lastIntValue = 10 * state.lastIntValue + (ch - 0x30 /* 0 */);
+      state.advance();
+    }
+    return state.pos !== start
+  };
+  function isDecimalDigit(ch) {
+    return ch >= 0x30 /* 0 */ && ch <= 0x39 /* 9 */
+  }
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-HexDigits
+  pp$8.regexp_eatHexDigits = function(state) {
+    var start = state.pos;
+    var ch = 0;
+    state.lastIntValue = 0;
+    while (isHexDigit(ch = state.current())) {
+      state.lastIntValue = 16 * state.lastIntValue + hexToInt(ch);
+      state.advance();
+    }
+    return state.pos !== start
+  };
+  function isHexDigit(ch) {
+    return (
+      (ch >= 0x30 /* 0 */ && ch <= 0x39 /* 9 */) ||
+      (ch >= 0x41 /* A */ && ch <= 0x46 /* F */) ||
+      (ch >= 0x61 /* a */ && ch <= 0x66 /* f */)
+    )
+  }
+  function hexToInt(ch) {
+    if (ch >= 0x41 /* A */ && ch <= 0x46 /* F */) {
+      return 10 + (ch - 0x41 /* A */)
+    }
+    if (ch >= 0x61 /* a */ && ch <= 0x66 /* f */) {
+      return 10 + (ch - 0x61 /* a */)
+    }
+    return ch - 0x30 /* 0 */
+  }
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-LegacyOctalEscapeSequence
+  // Allows only 0-377(octal) i.e. 0-255(decimal).
+  pp$8.regexp_eatLegacyOctalEscapeSequence = function(state) {
+    if (this.regexp_eatOctalDigit(state)) {
+      var n1 = state.lastIntValue;
+      if (this.regexp_eatOctalDigit(state)) {
+        var n2 = state.lastIntValue;
+        if (n1 <= 3 && this.regexp_eatOctalDigit(state)) {
+          state.lastIntValue = n1 * 64 + n2 * 8 + state.lastIntValue;
+        } else {
+          state.lastIntValue = n1 * 8 + n2;
+        }
+      } else {
+        state.lastIntValue = n1;
+      }
+      return true
+    }
+    return false
+  };
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-OctalDigit
+  pp$8.regexp_eatOctalDigit = function(state) {
+    var ch = state.current();
+    if (isOctalDigit(ch)) {
+      state.lastIntValue = ch - 0x30; /* 0 */
+      state.advance();
+      return true
+    }
+    state.lastIntValue = 0;
+    return false
+  };
+  function isOctalDigit(ch) {
+    return ch >= 0x30 /* 0 */ && ch <= 0x37 /* 7 */
+  }
+
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-Hex4Digits
+  // https://www.ecma-international.org/ecma-262/8.0/#prod-HexDigit
+  // And HexDigit HexDigit in https://www.ecma-international.org/ecma-262/8.0/#prod-HexEscapeSequence
+  pp$8.regexp_eatFixedHexDigits = function(state, length) {
+    var start = state.pos;
+    state.lastIntValue = 0;
+    for (var i = 0; i < length; ++i) {
+      var ch = state.current();
+      if (!isHexDigit(ch)) {
+        state.pos = start;
+        return false
+      }
+      state.lastIntValue = 16 * state.lastIntValue + hexToInt(ch);
+      state.advance();
+    }
+    return true
+  };
+
+  // Object type used to represent tokens. Note that normally, tokens
+  // simply exist as properties on the parser object. This is only
+  // used for the onToken callback and the external tokenizer.
+
+  var Token = function Token(p) {
+    this.type = p.type;
+    this.value = p.value;
+    this.start = p.start;
+    this.end = p.end;
+    if (p.options.locations)
+      { this.loc = new SourceLocation(p, p.startLoc, p.endLoc); }
+    if (p.options.ranges)
+      { this.range = [p.start, p.end]; }
+  };
+
+  // ## Tokenizer
+
+  var pp$9 = Parser.prototype;
+
+  // Move to the next token
+
+  pp$9.next = function(ignoreEscapeSequenceInKeyword) {
+    if (!ignoreEscapeSequenceInKeyword && this.type.keyword && this.containsEsc)
+      { this.raiseRecoverable(this.start, "Escape sequence in keyword " + this.type.keyword); }
+    if (this.options.onToken)
+      { this.options.onToken(new Token(this)); }
+
+    this.lastTokEnd = this.end;
+    this.lastTokStart = this.start;
+    this.lastTokEndLoc = this.endLoc;
+    this.lastTokStartLoc = this.startLoc;
+    this.nextToken();
+  };
+
+  pp$9.getToken = function() {
+    this.next();
+    return new Token(this)
+  };
+
+  // If we're in an ES6 environment, make parsers iterable
+  if (typeof Symbol !== "undefined")
+    { pp$9[Symbol.iterator] = function() {
+      var this$1 = this;
+
+      return {
+        next: function () {
+          var token = this$1.getToken();
+          return {
+            done: token.type === types.eof,
+            value: token
+          }
+        }
+      }
+    }; }
+
+  // Toggle strict mode. Re-reads the next number or string to please
+  // pedantic tests (`"use strict"; 010;` should fail).
+
+  pp$9.curContext = function() {
+    return this.context[this.context.length - 1]
+  };
+
+  // Read a single token, updating the parser object's token-related
+  // properties.
+
+  pp$9.nextToken = function() {
+    var curContext = this.curContext();
+    if (!curContext || !curContext.preserveSpace) { this.skipSpace(); }
+
+    this.start = this.pos;
+    if (this.options.locations) { this.startLoc = this.curPosition(); }
+    if (this.pos >= this.input.length) { return this.finishToken(types.eof) }
+
+    if (curContext.override) { return curContext.override(this) }
+    else { this.readToken(this.fullCharCodeAtPos()); }
+  };
+
+  pp$9.readToken = function(code) {
+    // Identifier or keyword. '\uXXXX' sequences are allowed in
+    // identifiers, so '\' also dispatches to that.
+    if (isIdentifierStart(code, this.options.ecmaVersion >= 6) || code === 92 /* '\' */)
+      { return this.readWord() }
+
+    return this.getTokenFromCode(code)
+  };
+
+  pp$9.fullCharCodeAtPos = function() {
+    var code = this.input.charCodeAt(this.pos);
+    if (code <= 0xd7ff || code >= 0xe000) { return code }
+    var next = this.input.charCodeAt(this.pos + 1);
+    return (code << 10) + next - 0x35fdc00
+  };
+
+  pp$9.skipBlockComment = function() {
+    var startLoc = this.options.onComment && this.curPosition();
+    var start = this.pos, end = this.input.indexOf("*/", this.pos += 2);
+    if (end === -1) { this.raise(this.pos - 2, "Unterminated comment"); }
+    this.pos = end + 2;
+    if (this.options.locations) {
+      lineBreakG.lastIndex = start;
+      var match;
+      while ((match = lineBreakG.exec(this.input)) && match.index < this.pos) {
+        ++this.curLine;
+        this.lineStart = match.index + match[0].length;
+      }
+    }
+    if (this.options.onComment)
+      { this.options.onComment(true, this.input.slice(start + 2, end), start, this.pos,
+                             startLoc, this.curPosition()); }
+  };
+
+  pp$9.skipLineComment = function(startSkip) {
+    var start = this.pos;
+    var startLoc = this.options.onComment && this.curPosition();
+    var ch = this.input.charCodeAt(this.pos += startSkip);
+    while (this.pos < this.input.length && !isNewLine(ch)) {
+      ch = this.input.charCodeAt(++this.pos);
+    }
+    if (this.options.onComment)
+      { this.options.onComment(false, this.input.slice(start + startSkip, this.pos), start, this.pos,
+                             startLoc, this.curPosition()); }
+  };
+
+  // Called at the start of the parse and after every token. Skips
+  // whitespace and comments, and.
+
+  pp$9.skipSpace = function() {
+    loop: while (this.pos < this.input.length) {
+      var ch = this.input.charCodeAt(this.pos);
+      switch (ch) {
+      case 32: case 160: // ' '
+        ++this.pos;
+        break
+      case 13:
+        if (this.input.charCodeAt(this.pos + 1) === 10) {
+          ++this.pos;
+        }
+      case 10: case 8232: case 8233:
+        ++this.pos;
+        if (this.options.locations) {
+          ++this.curLine;
+          this.lineStart = this.pos;
+        }
+        break
+      case 47: // '/'
+        switch (this.input.charCodeAt(this.pos + 1)) {
+        case 42: // '*'
+          this.skipBlockComment();
+          break
+        case 47:
+          this.skipLineComment(2);
+          break
+        default:
+          break loop
+        }
+        break
+      default:
+        if (ch > 8 && ch < 14 || ch >= 5760 && nonASCIIwhitespace.test(String.fromCharCode(ch))) {
+          ++this.pos;
+        } else {
+          break loop
+        }
+      }
+    }
+  };
+
+  // Called at the end of every token. Sets `end`, `val`, and
+  // maintains `context` and `exprAllowed`, and skips the space after
+  // the token, so that the next one's `start` will point at the
+  // right position.
+
+  pp$9.finishToken = function(type, val) {
+    this.end = this.pos;
+    if (this.options.locations) { this.endLoc = this.curPosition(); }
+    var prevType = this.type;
+    this.type = type;
+    this.value = val;
+
+    this.updateContext(prevType);
+  };
+
+  // ### Token reading
+
+  // This is the function that is called to fetch the next token. It
+  // is somewhat obscure, because it works in character codes rather
+  // than characters, and because operator parsing has been inlined
+  // into it.
+  //
+  // All in the name of speed.
+  //
+  pp$9.readToken_dot = function() {
+    var next = this.input.charCodeAt(this.pos + 1);
+    if (next >= 48 && next <= 57) { return this.readNumber(true) }
+    var next2 = this.input.charCodeAt(this.pos + 2);
+    if (this.options.ecmaVersion >= 6 && next === 46 && next2 === 46) { // 46 = dot '.'
+      this.pos += 3;
+      return this.finishToken(types.ellipsis)
+    } else {
+      ++this.pos;
+      return this.finishToken(types.dot)
+    }
+  };
+
+  pp$9.readToken_slash = function() { // '/'
+    var next = this.input.charCodeAt(this.pos + 1);
+    if (this.exprAllowed) { ++this.pos; return this.readRegexp() }
+    if (next === 61) { return this.finishOp(types.assign, 2) }
+    return this.finishOp(types.slash, 1)
+  };
+
+  pp$9.readToken_mult_modulo_exp = function(code) { // '%*'
+    var next = this.input.charCodeAt(this.pos + 1);
+    var size = 1;
+    var tokentype = code === 42 ? types.star : types.modulo;
+
+    // exponentiation operator ** and **=
+    if (this.options.ecmaVersion >= 7 && code === 42 && next === 42) {
+      ++size;
+      tokentype = types.starstar;
+      next = this.input.charCodeAt(this.pos + 2);
+    }
+
+    if (next === 61) { return this.finishOp(types.assign, size + 1) }
+    return this.finishOp(tokentype, size)
+  };
+
+  pp$9.readToken_pipe_amp = function(code) { // '|&'
+    var next = this.input.charCodeAt(this.pos + 1);
+    if (next === code) {
+      if (this.options.ecmaVersion >= 12) {
+        var next2 = this.input.charCodeAt(this.pos + 2);
+        if (next2 === 61) { return this.finishOp(types.assign, 3) }
+      }
+      return this.finishOp(code === 124 ? types.logicalOR : types.logicalAND, 2)
+    }
+    if (next === 61) { return this.finishOp(types.assign, 2) }
+    return this.finishOp(code === 124 ? types.bitwiseOR : types.bitwiseAND, 1)
+  };
+
+  pp$9.readToken_caret = function() { // '^'
+    var next = this.input.charCodeAt(this.pos + 1);
+    if (next === 61) { return this.finishOp(types.assign, 2) }
+    return this.finishOp(types.bitwiseXOR, 1)
+  };
+
+  pp$9.readToken_plus_min = function(code) { // '+-'
+    var next = this.input.charCodeAt(this.pos + 1);
+    if (next === code) {
+      if (next === 45 && !this.inModule && this.input.charCodeAt(this.pos + 2) === 62 &&
+          (this.lastTokEnd === 0 || lineBreak.test(this.input.slice(this.lastTokEnd, this.pos)))) {
+        // A `-->` line comment
+        this.skipLineComment(3);
+        this.skipSpace();
+        return this.nextToken()
+      }
+      return this.finishOp(types.incDec, 2)
+    }
+    if (next === 61) { return this.finishOp(types.assign, 2) }
+    return this.finishOp(types.plusMin, 1)
+  };
+
+  pp$9.readToken_lt_gt = function(code) { // '<>'
+    var next = this.input.charCodeAt(this.pos + 1);
+    var size = 1;
+    if (next === code) {
+      size = code === 62 && this.input.charCodeAt(this.pos + 2) === 62 ? 3 : 2;
+      if (this.input.charCodeAt(this.pos + size) === 61) { return this.finishOp(types.assign, size + 1) }
+      return this.finishOp(types.bitShift, size)
+    }
+    if (next === 33 && code === 60 && !this.inModule && this.input.charCodeAt(this.pos + 2) === 45 &&
+        this.input.charCodeAt(this.pos + 3) === 45) {
+      // `<!--`, an XML-style comment that should be interpreted as a line comment
+      this.skipLineComment(4);
+      this.skipSpace();
+      return this.nextToken()
+    }
+    if (next === 61) { size = 2; }
+    return this.finishOp(types.relational, size)
+  };
+
+  pp$9.readToken_eq_excl = function(code) { // '=!'
+    var next = this.input.charCodeAt(this.pos + 1);
+    if (next === 61) { return this.finishOp(types.equality, this.input.charCodeAt(this.pos + 2) === 61 ? 3 : 2) }
+    if (code === 61 && next === 62 && this.options.ecmaVersion >= 6) { // '=>'
+      this.pos += 2;
+      return this.finishToken(types.arrow)
+    }
+    return this.finishOp(code === 61 ? types.eq : types.prefix, 1)
+  };
+
+  pp$9.readToken_question = function() { // '?'
+    var ecmaVersion = this.options.ecmaVersion;
+    if (ecmaVersion >= 11) {
+      var next = this.input.charCodeAt(this.pos + 1);
+      if (next === 46) {
+        var next2 = this.input.charCodeAt(this.pos + 2);
+        if (next2 < 48 || next2 > 57) { return this.finishOp(types.questionDot, 2) }
+      }
+      if (next === 63) {
+        if (ecmaVersion >= 12) {
+          var next2$1 = this.input.charCodeAt(this.pos + 2);
+          if (next2$1 === 61) { return this.finishOp(types.assign, 3) }
+        }
+        return this.finishOp(types.coalesce, 2)
+      }
+    }
+    return this.finishOp(types.question, 1)
+  };
+
+  pp$9.getTokenFromCode = function(code) {
+    switch (code) {
+    // The interpretation of a dot depends on whether it is followed
+    // by a digit or another two dots.
+    case 46: // '.'
+      return this.readToken_dot()
+
+    // Punctuation tokens.
+    case 40: ++this.pos; return this.finishToken(types.parenL)
+    case 41: ++this.pos; return this.finishToken(types.parenR)
+    case 59: ++this.pos; return this.finishToken(types.semi)
+    case 44: ++this.pos; return this.finishToken(types.comma)
+    case 91: ++this.pos; return this.finishToken(types.bracketL)
+    case 93: ++this.pos; return this.finishToken(types.bracketR)
+    case 123: ++this.pos; return this.finishToken(types.braceL)
+    case 125: ++this.pos; return this.finishToken(types.braceR)
+    case 58: ++this.pos; return this.finishToken(types.colon)
+
+    case 96: // '`'
+      if (this.options.ecmaVersion < 6) { break }
+      ++this.pos;
+      return this.finishToken(types.backQuote)
+
+    case 48: // '0'
+      var next = this.input.charCodeAt(this.pos + 1);
+      if (next === 120 || next === 88) { return this.readRadixNumber(16) } // '0x', '0X' - hex number
+      if (this.options.ecmaVersion >= 6) {
+        if (next === 111 || next === 79) { return this.readRadixNumber(8) } // '0o', '0O' - octal number
+        if (next === 98 || next === 66) { return this.readRadixNumber(2) } // '0b', '0B' - binary number
+      }
+
+    // Anything else beginning with a digit is an integer, octal
+    // number, or float.
+    case 49: case 50: case 51: case 52: case 53: case 54: case 55: case 56: case 57: // 1-9
+      return this.readNumber(false)
+
+    // Quotes produce strings.
+    case 34: case 39: // '"', "'"
+      return this.readString(code)
+
+    // Operators are parsed inline in tiny state machines. '=' (61) is
+    // often referred to. `finishOp` simply skips the amount of
+    // characters it is given as second argument, and returns a token
+    // of the type given by its first argument.
+
+    case 47: // '/'
+      return this.readToken_slash()
+
+    case 37: case 42: // '%*'
+      return this.readToken_mult_modulo_exp(code)
+
+    case 124: case 38: // '|&'
+      return this.readToken_pipe_amp(code)
+
+    case 94: // '^'
+      return this.readToken_caret()
+
+    case 43: case 45: // '+-'
+      return this.readToken_plus_min(code)
+
+    case 60: case 62: // '<>'
+      return this.readToken_lt_gt(code)
+
+    case 61: case 33: // '=!'
+      return this.readToken_eq_excl(code)
+
+    case 63: // '?'
+      return this.readToken_question()
+
+    case 126: // '~'
+      return this.finishOp(types.prefix, 1)
+    }
+
+    this.raise(this.pos, "Unexpected character '" + codePointToString$1(code) + "'");
+  };
+
+  pp$9.finishOp = function(type, size) {
+    var str = this.input.slice(this.pos, this.pos + size);
+    this.pos += size;
+    return this.finishToken(type, str)
+  };
+
+  pp$9.readRegexp = function() {
+    var escaped, inClass, start = this.pos;
+    for (;;) {
+      if (this.pos >= this.input.length) { this.raise(start, "Unterminated regular expression"); }
+      var ch = this.input.charAt(this.pos);
+      if (lineBreak.test(ch)) { this.raise(start, "Unterminated regular expression"); }
+      if (!escaped) {
+        if (ch === "[") { inClass = true; }
+        else if (ch === "]" && inClass) { inClass = false; }
+        else if (ch === "/" && !inClass) { break }
+        escaped = ch === "\\";
+      } else { escaped = false; }
+      ++this.pos;
+    }
+    var pattern = this.input.slice(start, this.pos);
+    ++this.pos;
+    var flagsStart = this.pos;
+    var flags = this.readWord1();
+    if (this.containsEsc) { this.unexpected(flagsStart); }
+
+    // Validate pattern
+    var state = this.regexpState || (this.regexpState = new RegExpValidationState(this));
+    state.reset(start, pattern, flags);
+    this.validateRegExpFlags(state);
+    this.validateRegExpPattern(state);
+
+    // Create Literal#value property value.
+    var value = null;
+    try {
+      value = new RegExp(pattern, flags);
+    } catch (e) {
+      // ESTree requires null if it failed to instantiate RegExp object.
+      // https://github.com/estree/estree/blob/a27003adf4fd7bfad44de9cef372a2eacd527b1c/es5.md#regexpliteral
+    }
+
+    return this.finishToken(types.regexp, {pattern: pattern, flags: flags, value: value})
+  };
+
+  // Read an integer in the given radix. Return null if zero digits
+  // were read, the integer value otherwise. When `len` is given, this
+  // will return `null` unless the integer has exactly `len` digits.
+
+  pp$9.readInt = function(radix, len, maybeLegacyOctalNumericLiteral) {
+    // `len` is used for character escape sequences. In that case, disallow separators.
+    var allowSeparators = this.options.ecmaVersion >= 12 && len === undefined;
+
+    // `maybeLegacyOctalNumericLiteral` is true if it doesn't have prefix (0x,0o,0b)
+    // and isn't fraction part nor exponent part. In that case, if the first digit
+    // is zero then disallow separators.
+    var isLegacyOctalNumericLiteral = maybeLegacyOctalNumericLiteral && this.input.charCodeAt(this.pos) === 48;
+
+    var start = this.pos, total = 0, lastCode = 0;
+    for (var i = 0, e = len == null ? Infinity : len; i < e; ++i, ++this.pos) {
+      var code = this.input.charCodeAt(this.pos), val = (void 0);
+
+      if (allowSeparators && code === 95) {
+        if (isLegacyOctalNumericLiteral) { this.raiseRecoverable(this.pos, "Numeric separator is not allowed in legacy octal numeric literals"); }
+        if (lastCode === 95) { this.raiseRecoverable(this.pos, "Numeric separator must be exactly one underscore"); }
+        if (i === 0) { this.raiseRecoverable(this.pos, "Numeric separator is not allowed at the first of digits"); }
+        lastCode = code;
+        continue
+      }
+
+      if (code >= 97) { val = code - 97 + 10; } // a
+      else if (code >= 65) { val = code - 65 + 10; } // A
+      else if (code >= 48 && code <= 57) { val = code - 48; } // 0-9
+      else { val = Infinity; }
+      if (val >= radix) { break }
+      lastCode = code;
+      total = total * radix + val;
+    }
+
+    if (allowSeparators && lastCode === 95) { this.raiseRecoverable(this.pos - 1, "Numeric separator is not allowed at the last of digits"); }
+    if (this.pos === start || len != null && this.pos - start !== len) { return null }
+
+    return total
+  };
+
+  function stringToNumber(str, isLegacyOctalNumericLiteral) {
+    if (isLegacyOctalNumericLiteral) {
+      return parseInt(str, 8)
+    }
+
+    // `parseFloat(value)` stops parsing at the first numeric separator then returns a wrong value.
+    return parseFloat(str.replace(/_/g, ""))
+  }
+
+  function stringToBigInt(str) {
+    if (typeof BigInt !== "function") {
+      return null
+    }
+
+    // `BigInt(value)` throws syntax error if the string contains numeric separators.
+    return BigInt(str.replace(/_/g, ""))
+  }
+
+  pp$9.readRadixNumber = function(radix) {
+    var start = this.pos;
+    this.pos += 2; // 0x
+    var val = this.readInt(radix);
+    if (val == null) { this.raise(this.start + 2, "Expected number in radix " + radix); }
+    if (this.options.ecmaVersion >= 11 && this.input.charCodeAt(this.pos) === 110) {
+      val = stringToBigInt(this.input.slice(start, this.pos));
+      ++this.pos;
+    } else if (isIdentifierStart(this.fullCharCodeAtPos())) { this.raise(this.pos, "Identifier directly after number"); }
+    return this.finishToken(types.num, val)
+  };
+
+  // Read an integer, octal integer, or floating-point number.
+
+  pp$9.readNumber = function(startsWithDot) {
+    var start = this.pos;
+    if (!startsWithDot && this.readInt(10, undefined, true) === null) { this.raise(start, "Invalid number"); }
+    var octal = this.pos - start >= 2 && this.input.charCodeAt(start) === 48;
+    if (octal && this.strict) { this.raise(start, "Invalid number"); }
+    var next = this.input.charCodeAt(this.pos);
+    if (!octal && !startsWithDot && this.options.ecmaVersion >= 11 && next === 110) {
+      var val$1 = stringToBigInt(this.input.slice(start, this.pos));
+      ++this.pos;
+      if (isIdentifierStart(this.fullCharCodeAtPos())) { this.raise(this.pos, "Identifier directly after number"); }
+      return this.finishToken(types.num, val$1)
+    }
+    if (octal && /[89]/.test(this.input.slice(start, this.pos))) { octal = false; }
+    if (next === 46 && !octal) { // '.'
+      ++this.pos;
+      this.readInt(10);
+      next = this.input.charCodeAt(this.pos);
+    }
+    if ((next === 69 || next === 101) && !octal) { // 'eE'
+      next = this.input.charCodeAt(++this.pos);
+      if (next === 43 || next === 45) { ++this.pos; } // '+-'
+      if (this.readInt(10) === null) { this.raise(start, "Invalid number"); }
+    }
+    if (isIdentifierStart(this.fullCharCodeAtPos())) { this.raise(this.pos, "Identifier directly after number"); }
+
+    var val = stringToNumber(this.input.slice(start, this.pos), octal);
+    return this.finishToken(types.num, val)
+  };
+
+  // Read a string value, interpreting backslash-escapes.
+
+  pp$9.readCodePoint = function() {
+    var ch = this.input.charCodeAt(this.pos), code;
+
+    if (ch === 123) { // '{'
+      if (this.options.ecmaVersion < 6) { this.unexpected(); }
+      var codePos = ++this.pos;
+      code = this.readHexChar(this.input.indexOf("}", this.pos) - this.pos);
+      ++this.pos;
+      if (code > 0x10FFFF) { this.invalidStringToken(codePos, "Code point out of bounds"); }
+    } else {
+      code = this.readHexChar(4);
+    }
+    return code
+  };
+
+  function codePointToString$1(code) {
+    // UTF-16 Decoding
+    if (code <= 0xFFFF) { return String.fromCharCode(code) }
+    code -= 0x10000;
+    return String.fromCharCode((code >> 10) + 0xD800, (code & 1023) + 0xDC00)
+  }
+
+  pp$9.readString = function(quote) {
+    var out = "", chunkStart = ++this.pos;
+    for (;;) {
+      if (this.pos >= this.input.length) { this.raise(this.start, "Unterminated string constant"); }
+      var ch = this.input.charCodeAt(this.pos);
+      if (ch === quote) { break }
+      if (ch === 92) { // '\'
+        out += this.input.slice(chunkStart, this.pos);
+        out += this.readEscapedChar(false);
+        chunkStart = this.pos;
+      } else {
+        if (isNewLine(ch, this.options.ecmaVersion >= 10)) { this.raise(this.start, "Unterminated string constant"); }
+        ++this.pos;
+      }
+    }
+    out += this.input.slice(chunkStart, this.pos++);
+    return this.finishToken(types.string, out)
+  };
+
+  // Reads template string tokens.
+
+  var INVALID_TEMPLATE_ESCAPE_ERROR = {};
+
+  pp$9.tryReadTemplateToken = function() {
+    this.inTemplateElement = true;
+    try {
+      this.readTmplToken();
+    } catch (err) {
+      if (err === INVALID_TEMPLATE_ESCAPE_ERROR) {
+        this.readInvalidTemplateToken();
+      } else {
+        throw err
+      }
+    }
+
+    this.inTemplateElement = false;
+  };
+
+  pp$9.invalidStringToken = function(position, message) {
+    if (this.inTemplateElement && this.options.ecmaVersion >= 9) {
+      throw INVALID_TEMPLATE_ESCAPE_ERROR
+    } else {
+      this.raise(position, message);
+    }
+  };
+
+  pp$9.readTmplToken = function() {
+    var out = "", chunkStart = this.pos;
+    for (;;) {
+      if (this.pos >= this.input.length) { this.raise(this.start, "Unterminated template"); }
+      var ch = this.input.charCodeAt(this.pos);
+      if (ch === 96 || ch === 36 && this.input.charCodeAt(this.pos + 1) === 123) { // '`', '${'
+        if (this.pos === this.start && (this.type === types.template || this.type === types.invalidTemplate)) {
+          if (ch === 36) {
+            this.pos += 2;
+            return this.finishToken(types.dollarBraceL)
+          } else {
+            ++this.pos;
+            return this.finishToken(types.backQuote)
+          }
+        }
+        out += this.input.slice(chunkStart, this.pos);
+        return this.finishToken(types.template, out)
+      }
+      if (ch === 92) { // '\'
+        out += this.input.slice(chunkStart, this.pos);
+        out += this.readEscapedChar(true);
+        chunkStart = this.pos;
+      } else if (isNewLine(ch)) {
+        out += this.input.slice(chunkStart, this.pos);
+        ++this.pos;
+        switch (ch) {
+        case 13:
+          if (this.input.charCodeAt(this.pos) === 10) { ++this.pos; }
+        case 10:
+          out += "\n";
+          break
+        default:
+          out += String.fromCharCode(ch);
+          break
+        }
+        if (this.options.locations) {
+          ++this.curLine;
+          this.lineStart = this.pos;
+        }
+        chunkStart = this.pos;
+      } else {
+        ++this.pos;
+      }
+    }
+  };
+
+  // Reads a template token to search for the end, without validating any escape sequences
+  pp$9.readInvalidTemplateToken = function() {
+    for (; this.pos < this.input.length; this.pos++) {
+      switch (this.input[this.pos]) {
+      case "\\":
+        ++this.pos;
+        break
+
+      case "$":
+        if (this.input[this.pos + 1] !== "{") {
+          break
+        }
+      // falls through
+
+      case "`":
+        return this.finishToken(types.invalidTemplate, this.input.slice(this.start, this.pos))
+
+      // no default
+      }
+    }
+    this.raise(this.start, "Unterminated template");
+  };
+
+  // Used to read escaped characters
+
+  pp$9.readEscapedChar = function(inTemplate) {
+    var ch = this.input.charCodeAt(++this.pos);
+    ++this.pos;
+    switch (ch) {
+    case 110: return "\n" // 'n' -> '\n'
+    case 114: return "\r" // 'r' -> '\r'
+    case 120: return String.fromCharCode(this.readHexChar(2)) // 'x'
+    case 117: return codePointToString$1(this.readCodePoint()) // 'u'
+    case 116: return "\t" // 't' -> '\t'
+    case 98: return "\b" // 'b' -> '\b'
+    case 118: return "\u000b" // 'v' -> '\u000b'
+    case 102: return "\f" // 'f' -> '\f'
+    case 13: if (this.input.charCodeAt(this.pos) === 10) { ++this.pos; } // '\r\n'
+    case 10: // ' \n'
+      if (this.options.locations) { this.lineStart = this.pos; ++this.curLine; }
+      return ""
+    case 56:
+    case 57:
+      if (this.strict) {
+        this.invalidStringToken(
+          this.pos - 1,
+          "Invalid escape sequence"
+        );
+      }
+      if (inTemplate) {
+        var codePos = this.pos - 1;
+
+        this.invalidStringToken(
+          codePos,
+          "Invalid escape sequence in template string"
+        );
+
+        return null
+      }
+    default:
+      if (ch >= 48 && ch <= 55) {
+        var octalStr = this.input.substr(this.pos - 1, 3).match(/^[0-7]+/)[0];
+        var octal = parseInt(octalStr, 8);
+        if (octal > 255) {
+          octalStr = octalStr.slice(0, -1);
+          octal = parseInt(octalStr, 8);
+        }
+        this.pos += octalStr.length - 1;
+        ch = this.input.charCodeAt(this.pos);
+        if ((octalStr !== "0" || ch === 56 || ch === 57) && (this.strict || inTemplate)) {
+          this.invalidStringToken(
+            this.pos - 1 - octalStr.length,
+            inTemplate
+              ? "Octal literal in template string"
+              : "Octal literal in strict mode"
+          );
+        }
+        return String.fromCharCode(octal)
+      }
+      if (isNewLine(ch)) {
+        // Unicode new line characters after \ get removed from output in both
+        // template literals and strings
+        return ""
+      }
+      return String.fromCharCode(ch)
+    }
+  };
+
+  // Used to read character escape sequences ('\x', '\u', '\U').
+
+  pp$9.readHexChar = function(len) {
+    var codePos = this.pos;
+    var n = this.readInt(16, len);
+    if (n === null) { this.invalidStringToken(codePos, "Bad character escape sequence"); }
+    return n
+  };
+
+  // Read an identifier, and return it as a string. Sets `this.containsEsc`
+  // to whether the word contained a '\u' escape.
+  //
+  // Incrementally adds only escaped chars, adding other chunks as-is
+  // as a micro-optimization.
+
+  pp$9.readWord1 = function() {
+    this.containsEsc = false;
+    var word = "", first = true, chunkStart = this.pos;
+    var astral = this.options.ecmaVersion >= 6;
+    while (this.pos < this.input.length) {
+      var ch = this.fullCharCodeAtPos();
+      if (isIdentifierChar(ch, astral)) {
+        this.pos += ch <= 0xffff ? 1 : 2;
+      } else if (ch === 92) { // "\"
+        this.containsEsc = true;
+        word += this.input.slice(chunkStart, this.pos);
+        var escStart = this.pos;
+        if (this.input.charCodeAt(++this.pos) !== 117) // "u"
+          { this.invalidStringToken(this.pos, "Expecting Unicode escape sequence \\uXXXX"); }
+        ++this.pos;
+        var esc = this.readCodePoint();
+        if (!(first ? isIdentifierStart : isIdentifierChar)(esc, astral))
+          { this.invalidStringToken(escStart, "Invalid Unicode escape"); }
+        word += codePointToString$1(esc);
+        chunkStart = this.pos;
+      } else {
+        break
+      }
+      first = false;
+    }
+    return word + this.input.slice(chunkStart, this.pos)
+  };
+
+  // Read an identifier or keyword token. Will check for reserved
+  // words when necessary.
+
+  pp$9.readWord = function() {
+    var word = this.readWord1();
+    var type = types.name;
+    if (this.keywords.test(word)) {
+      type = keywords$1[word];
+    }
+    return this.finishToken(type, word)
+  };
+
+  // Acorn is a tiny, fast JavaScript parser written in JavaScript.
+
+  var version = "8.0.5";
+
+  Parser.acorn = {
+    Parser: Parser,
+    version: version,
+    defaultOptions: defaultOptions,
+    Position: Position,
+    SourceLocation: SourceLocation,
+    getLineInfo: getLineInfo,
+    Node: Node,
+    TokenType: TokenType,
+    tokTypes: types,
+    keywordTypes: keywords$1,
+    TokContext: TokContext,
+    tokContexts: types$1,
+    isIdentifierChar: isIdentifierChar,
+    isIdentifierStart: isIdentifierStart,
+    Token: Token,
+    isNewLine: isNewLine,
+    lineBreak: lineBreak,
+    lineBreakG: lineBreakG,
+    nonASCIIwhitespace: nonASCIIwhitespace
+  };
+
+  // The main exported interface (under `self.acorn` when in the
+  // browser) is a `parse` function that takes a code string and
+  // returns an abstract syntax tree as specified by [Mozilla parser
+  // API][api].
+  //
+  // [api]: https://developer.mozilla.org/en-US/docs/SpiderMonkey/Parser_API
+
+  function parse(input, options) {
+    return Parser.parse(input, options)
+  }
+
+  // This function tries to parse a single expression at a given
+  // offset in a string. Useful for parsing mixed-language formats
+  // that embed JavaScript expressions.
+
+  function parseExpressionAt(input, pos, options) {
+    return Parser.parseExpressionAt(input, pos, options)
+  }
+
+  // Acorn is organized as a tokenizer and a recursive-descent parser.
+  // The `tokenizer` export provides an interface to the tokenizer.
+
+  function tokenizer(input, options) {
+    return Parser.tokenizer(input, options)
+  }
+
+  exports.Node = Node;
+  exports.Parser = Parser;
+  exports.Position = Position;
+  exports.SourceLocation = SourceLocation;
+  exports.TokContext = TokContext;
+  exports.Token = Token;
+  exports.TokenType = TokenType;
+  exports.defaultOptions = defaultOptions;
+  exports.getLineInfo = getLineInfo;
+  exports.isIdentifierChar = isIdentifierChar;
+  exports.isIdentifierStart = isIdentifierStart;
+  exports.isNewLine = isNewLine;
+  exports.keywordTypes = keywords$1;
+  exports.lineBreak = lineBreak;
+  exports.lineBreakG = lineBreakG;
+  exports.nonASCIIwhitespace = nonASCIIwhitespace;
+  exports.parse = parse;
+  exports.parseExpressionAt = parseExpressionAt;
+  exports.tokContexts = types$1;
+  exports.tokTypes = types;
+  exports.tokenizer = tokenizer;
+  exports.version = version;
+
+  Object.defineProperty(exports, '__esModule', { value: true });
+
+})));
+//# sourceMappingURL=acorn.js.map
diff --git a/ddb_main/react-jsx-parser/node_modules/acorn/dist/acorn.mjs b/ddb_main/react-jsx-parser/node_modules/acorn/dist/acorn.mjs
new file mode 100644
index 0000000..9bc666b
--- /dev/null
+++ b/ddb_main/react-jsx-parser/node_modules/acorn/dist/acorn.mjs
@@ -0,0 +1,5261 @@
+// Reserved word lists for various dialects of the language
+
+var reservedWords = {
+  3: "abstract boolean byte char class double enum export extends final float goto implements import int interface long native package private protected public short static super synchronized throws transient volatile",
+  5: "class enum extends super const export import",
+  6: "enum",
+  strict: "implements interface let package private protected public static yield",
+  strictBind: "eval arguments"
+};
+
+// And the keywords
+
+var ecma5AndLessKeywords = "break case catch continue debugger default do else finally for function if return switch throw try var while with null true false instanceof typeof void delete new in this";
+
+var keywords = {
+  5: ecma5AndLessKeywords,
+  "5module": ecma5AndLessKeywords + " export import",
+  6: ecma5AndLessKeywords + " const class extends export import super"
+};
+
+var keywordRelationalOperator = /^in(stanceof)?$/;
+
+// ## Character categories
+
+// Big ugly regular expressions that match characters in the
+// whitespace, identifier, and identifier-start categories. These
+// are only applied when a character is found to actually have a
+// code point above 128.
+// Generated by `bin/generate-identifier-regex.js`.
+var nonASCIIidentifierStartChars = "\xaa\xb5\xba\xc0-\xd6\xd8-\xf6\xf8-\u02c1\u02c6-\u02d1\u02e0-\u02e4\u02ec\u02ee\u0370-\u0374\u0376\u0377\u037a-\u037d\u037f\u0386\u0388-\u038a\u038c\u038e-\u03a1\u03a3-\u03f5\u03f7-\u0481\u048a-\u052f\u0531-\u0556\u0559\u0560-\u0588\u05d0-\u05ea\u05ef-\u05f2\u0620-\u064a\u066e\u066f\u0671-\u06d3\u06d5\u06e5\u06e6\u06ee\u06ef\u06fa-\u06fc\u06ff\u0710\u0712-\u072f\u074d-\u07a5\u07b1\u07ca-\u07ea\u07f4\u07f5\u07fa\u0800-\u0815\u081a\u0824\u0828\u0840-\u0858\u0860-\u086a\u08a0-\u08b4\u08b6-\u08c7\u0904-\u0939\u093d\u0950\u0958-\u0961\u0971-\u0980\u0985-\u098c\u098f\u0990\u0993-\u09a8\u09aa-\u09b0\u09b2\u09b6-\u09b9\u09bd\u09ce\u09dc\u09dd\u09df-\u09e1\u09f0\u09f1\u09fc\u0a05-\u0a0a\u0a0f\u0a10\u0a13-\u0a28\u0a2a-\u0a30\u0a32\u0a33\u0a35\u0a36\u0a38\u0a39\u0a59-\u0a5c\u0a5e\u0a72-\u0a74\u0a85-\u0a8d\u0a8f-\u0a91\u0a93-\u0aa8\u0aaa-\u0ab0\u0ab2\u0ab3\u0ab5-\u0ab9\u0abd\u0ad0\u0ae0\u0ae1\u0af9\u0b05-\u0b0c\u0b0f\u0b10\u0b13-\u0b28\u0b2a-\u0b30\u0b32\u0b33\u0b35-\u0b39\u0b3d\u0b5c\u0b5d\u0b5f-\u0b61\u0b71\u0b83\u0b85-\u0b8a\u0b8e-\u0b90\u0b92-\u0b95\u0b99\u0b9a\u0b9c\u0b9e\u0b9f\u0ba3\u0ba4\u0ba8-\u0baa\u0bae-\u0bb9\u0bd0\u0c05-\u0c0c\u0c0e-\u0c10\u0c12-\u0c28\u0c2a-\u0c39\u0c3d\u0c58-\u0c5a\u0c60\u0c61\u0c80\u0c85-\u0c8c\u0c8e-\u0c90\u0c92-\u0ca8\u0caa-\u0cb3\u0cb5-\u0cb9\u0cbd\u0cde\u0ce0\u0ce1\u0cf1\u0cf2\u0d04-\u0d0c\u0d0e-\u0d10\u0d12-\u0d3a\u0d3d\u0d4e\u0d54-\u0d56\u0d5f-\u0d61\u0d7a-\u0d7f\u0d85-\u0d96\u0d9a-\u0db1\u0db3-\u0dbb\u0dbd\u0dc0-\u0dc6\u0e01-\u0e30\u0e32\u0e33\u0e40-\u0e46\u0e81\u0e82\u0e84\u0e86-\u0e8a\u0e8c-\u0ea3\u0ea5\u0ea7-\u0eb0\u0eb2\u0eb3\u0ebd\u0ec0-\u0ec4\u0ec6\u0edc-\u0edf\u0f00\u0f40-\u0f47\u0f49-\u0f6c\u0f88-\u0f8c\u1000-\u102a\u103f\u1050-\u1055\u105a-\u105d\u1061\u1065\u1066\u106e-\u1070\u1075-\u1081\u108e\u10a0-\u10c5\u10c7\u10cd\u10d0-\u10fa\u10fc-\u1248\u124a-\u124d\u1250-\u1256\u1258\u125a-\u125d\u1260-\u1288\u128a-\u128d\u1290-\u12b0\u12b2-\u12b5\u12b8-\u12be\u12c0\u12c2-\u12c5\u12c8-\u12d6\u12d8-\u1310\u1312-\u1315\u1318-\u135a\u1380-\u138f\u13a0-\u13f5\u13f8-\u13fd\u1401-\u166c\u166f-\u167f\u1681-\u169a\u16a0-\u16ea\u16ee-\u16f8\u1700-\u170c\u170e-\u1711\u1720-\u1731\u1740-\u1751\u1760-\u176c\u176e-\u1770\u1780-\u17b3\u17d7\u17dc\u1820-\u1878\u1880-\u18a8\u18aa\u18b0-\u18f5\u1900-\u191e\u1950-\u196d\u1970-\u1974\u1980-\u19ab\u19b0-\u19c9\u1a00-\u1a16\u1a20-\u1a54\u1aa7\u1b05-\u1b33\u1b45-\u1b4b\u1b83-\u1ba0\u1bae\u1baf\u1bba-\u1be5\u1c00-\u1c23\u1c4d-\u1c4f\u1c5a-\u1c7d\u1c80-\u1c88\u1c90-\u1cba\u1cbd-\u1cbf\u1ce9-\u1cec\u1cee-\u1cf3\u1cf5\u1cf6\u1cfa\u1d00-\u1dbf\u1e00-\u1f15\u1f18-\u1f1d\u1f20-\u1f45\u1f48-\u1f4d\u1f50-\u1f57\u1f59\u1f5b\u1f5d\u1f5f-\u1f7d\u1f80-\u1fb4\u1fb6-\u1fbc\u1fbe\u1fc2-\u1fc4\u1fc6-\u1fcc\u1fd0-\u1fd3\u1fd6-\u1fdb\u1fe0-\u1fec\u1ff2-\u1ff4\u1ff6-\u1ffc\u2071\u207f\u2090-\u209c\u2102\u2107\u210a-\u2113\u2115\u2118-\u211d\u2124\u2126\u2128\u212a-\u2139\u213c-\u213f\u2145-\u2149\u214e\u2160-\u2188\u2c00-\u2c2e\u2c30-\u2c5e\u2c60-\u2ce4\u2ceb-\u2cee\u2cf2\u2cf3\u2d00-\u2d25\u2d27\u2d2d\u2d30-\u2d67\u2d6f\u2d80-\u2d96\u2da0-\u2da6\u2da8-\u2dae\u2db0-\u2db6\u2db8-\u2dbe\u2dc0-\u2dc6\u2dc8-\u2dce\u2dd0-\u2dd6\u2dd8-\u2dde\u3005-\u3007\u3021-\u3029\u3031-\u3035\u3038-\u303c\u3041-\u3096\u309b-\u309f\u30a1-\u30fa\u30fc-\u30ff\u3105-\u312f\u3131-\u318e\u31a0-\u31bf\u31f0-\u31ff\u3400-\u4dbf\u4e00-\u9ffc\ua000-\ua48c\ua4d0-\ua4fd\ua500-\ua60c\ua610-\ua61f\ua62a\ua62b\ua640-\ua66e\ua67f-\ua69d\ua6a0-\ua6ef\ua717-\ua71f\ua722-\ua788\ua78b-\ua7bf\ua7c2-\ua7ca\ua7f5-\ua801\ua803-\ua805\ua807-\ua80a\ua80c-\ua822\ua840-\ua873\ua882-\ua8b3\ua8f2-\ua8f7\ua8fb\ua8fd\ua8fe\ua90a-\ua925\ua930-\ua946\ua960-\ua97c\ua984-\ua9b2\ua9cf\ua9e0-\ua9e4\ua9e6-\ua9ef\ua9fa-\ua9fe\uaa00-\uaa28\uaa40-\uaa42\uaa44-\uaa4b\uaa60-\uaa76\uaa7a\uaa7e-\uaaaf\uaab1\uaab5\uaab6\uaab9-\uaabd\uaac0\uaac2\uaadb-\uaadd\uaae0-\uaaea\uaaf2-\uaaf4\uab01-\uab06\uab09-\uab0e\uab11-\uab16\uab20-\uab26\uab28-\uab2e\uab30-\uab5a\uab5c-\uab69\uab70-\uabe2\uac00-\ud7a3\ud7b0-\ud7c6\ud7cb-\ud7fb\uf900-\ufa6d\ufa70-\ufad9\ufb00-\ufb06\ufb13-\ufb17\ufb1d\ufb1f-\ufb28\ufb2a-\ufb36\ufb38-\ufb3c\ufb3e\ufb40\ufb41\ufb43\ufb44\ufb46-\ufbb1\ufbd3-\ufd3d\ufd50-\ufd8f\ufd92-\ufdc7\ufdf0-\ufdfb\ufe70-\ufe74\ufe76-\ufefc\uff21-\uff3a\uff41-\uff5a\uff66-\uffbe\uffc2-\uffc7\uffca-\uffcf\uffd2-\uffd7\uffda-\uffdc";
+var nonASCIIidentifierChars = "\u200c\u200d\xb7\u0300-\u036f\u0387\u0483-\u0487\u0591-\u05bd\u05bf\u05c1\u05c2\u05c4\u05c5\u05c7\u0610-\u061a\u064b-\u0669\u0670\u06d6-\u06dc\u06df-\u06e4\u06e7\u06e8\u06ea-\u06ed\u06f0-\u06f9\u0711\u0730-\u074a\u07a6-\u07b0\u07c0-\u07c9\u07eb-\u07f3\u07fd\u0816-\u0819\u081b-\u0823\u0825-\u0827\u0829-\u082d\u0859-\u085b\u08d3-\u08e1\u08e3-\u0903\u093a-\u093c\u093e-\u094f\u0951-\u0957\u0962\u0963\u0966-\u096f\u0981-\u0983\u09bc\u09be-\u09c4\u09c7\u09c8\u09cb-\u09cd\u09d7\u09e2\u09e3\u09e6-\u09ef\u09fe\u0a01-\u0a03\u0a3c\u0a3e-\u0a42\u0a47\u0a48\u0a4b-\u0a4d\u0a51\u0a66-\u0a71\u0a75\u0a81-\u0a83\u0abc\u0abe-\u0ac5\u0ac7-\u0ac9\u0acb-\u0acd\u0ae2\u0ae3\u0ae6-\u0aef\u0afa-\u0aff\u0b01-\u0b03\u0b3c\u0b3e-\u0b44\u0b47\u0b48\u0b4b-\u0b4d\u0b55-\u0b57\u0b62\u0b63\u0b66-\u0b6f\u0b82\u0bbe-\u0bc2\u0bc6-\u0bc8\u0bca-\u0bcd\u0bd7\u0be6-\u0bef\u0c00-\u0c04\u0c3e-\u0c44\u0c46-\u0c48\u0c4a-\u0c4d\u0c55\u0c56\u0c62\u0c63\u0c66-\u0c6f\u0c81-\u0c83\u0cbc\u0cbe-\u0cc4\u0cc6-\u0cc8\u0cca-\u0ccd\u0cd5\u0cd6\u0ce2\u0ce3\u0ce6-\u0cef\u0d00-\u0d03\u0d3b\u0d3c\u0d3e-\u0d44\u0d46-\u0d48\u0d4a-\u0d4d\u0d57\u0d62\u0d63\u0d66-\u0d6f\u0d81-\u0d83\u0dca\u0dcf-\u0dd4\u0dd6\u0dd8-\u0ddf\u0de6-\u0def\u0df2\u0df3\u0e31\u0e34-\u0e3a\u0e47-\u0e4e\u0e50-\u0e59\u0eb1\u0eb4-\u0ebc\u0ec8-\u0ecd\u0ed0-\u0ed9\u0f18\u0f19\u0f20-\u0f29\u0f35\u0f37\u0f39\u0f3e\u0f3f\u0f71-\u0f84\u0f86\u0f87\u0f8d-\u0f97\u0f99-\u0fbc\u0fc6\u102b-\u103e\u1040-\u1049\u1056-\u1059\u105e-\u1060\u1062-\u1064\u1067-\u106d\u1071-\u1074\u1082-\u108d\u108f-\u109d\u135d-\u135f\u1369-\u1371\u1712-\u1714\u1732-\u1734\u1752\u1753\u1772\u1773\u17b4-\u17d3\u17dd\u17e0-\u17e9\u180b-\u180d\u1810-\u1819\u18a9\u1920-\u192b\u1930-\u193b\u1946-\u194f\u19d0-\u19da\u1a17-\u1a1b\u1a55-\u1a5e\u1a60-\u1a7c\u1a7f-\u1a89\u1a90-\u1a99\u1ab0-\u1abd\u1abf\u1ac0\u1b00-\u1b04\u1b34-\u1b44\u1b50-\u1b59\u1b6b-\u1b73\u1b80-\u1b82\u1ba1-\u1bad\u1bb0-\u1bb9\u1be6-\u1bf3\u1c24-\u1c37\u1c40-\u1c49\u1c50-\u1c59\u1cd0-\u1cd2\u1cd4-\u1ce8\u1ced\u1cf4\u1cf7-\u1cf9\u1dc0-\u1df9\u1dfb-\u1dff\u203f\u2040\u2054\u20d0-\u20dc\u20e1\u20e5-\u20f0\u2cef-\u2cf1\u2d7f\u2de0-\u2dff\u302a-\u302f\u3099\u309a\ua620-\ua629\ua66f\ua674-\ua67d\ua69e\ua69f\ua6f0\ua6f1\ua802\ua806\ua80b\ua823-\ua827\ua82c\ua880\ua881\ua8b4-\ua8c5\ua8d0-\ua8d9\ua8e0-\ua8f1\ua8ff-\ua909\ua926-\ua92d\ua947-\ua953\ua980-\ua983\ua9b3-\ua9c0\ua9d0-\ua9d9\ua9e5\ua9f0-\ua9f9\uaa29-\uaa36\uaa43\uaa4c\uaa4d\uaa50-\uaa59\uaa7b-\uaa7d\uaab0\uaab2-\uaab4\uaab7\uaab8\uaabe\uaabf\uaac1\uaaeb-\uaaef\uaaf5\uaaf6\uabe3-\uabea\uabec\uabed\uabf0-\uabf9\ufb1e\ufe00-\ufe0f\ufe20-\ufe2f\ufe33\ufe34\ufe4d-\ufe4f\uff10-\uff19\uff3f";
+
+var nonASCIIidentifierStart = new RegExp("[" + nonASCIIidentifierStartChars + "]");
+var nonASCIIidentifier = new RegExp("[" + nonASCIIidentifierStartChars + nonASCIIidentifierChars + "]");
+
+nonASCIIidentifierStartChars = nonASCIIidentifierChars = null;
+
+// These are a run-length and offset encoded representation of the
+// >0xffff code points that are a valid part of identifiers. The
+// offset starts at 0x10000, and each pair of numbers represents an
+// offset to the next range, and then a size of the range. They were
+// generated by bin/generate-identifier-regex.js
+
+// eslint-disable-next-line comma-spacing
+var astralIdentifierStartCodes = [0,11,2,25,2,18,2,1,2,14,3,13,35,122,70,52,268,28,4,48,48,31,14,29,6,37,11,29,3,35,5,7,2,4,43,157,19,35,5,35,5,39,9,51,157,310,10,21,11,7,153,5,3,0,2,43,2,1,4,0,3,22,11,22,10,30,66,18,2,1,11,21,11,25,71,55,7,1,65,0,16,3,2,2,2,28,43,28,4,28,36,7,2,27,28,53,11,21,11,18,14,17,111,72,56,50,14,50,14,35,349,41,7,1,79,28,11,0,9,21,107,20,28,22,13,52,76,44,33,24,27,35,30,0,3,0,9,34,4,0,13,47,15,3,22,0,2,0,36,17,2,24,85,6,2,0,2,3,2,14,2,9,8,46,39,7,3,1,3,21,2,6,2,1,2,4,4,0,19,0,13,4,159,52,19,3,21,2,31,47,21,1,2,0,185,46,42,3,37,47,21,0,60,42,14,0,72,26,230,43,117,63,32,7,3,0,3,7,2,1,2,23,16,0,2,0,95,7,3,38,17,0,2,0,29,0,11,39,8,0,22,0,12,45,20,0,35,56,264,8,2,36,18,0,50,29,113,6,2,1,2,37,22,0,26,5,2,1,2,31,15,0,328,18,190,0,80,921,103,110,18,195,2749,1070,4050,582,8634,568,8,30,114,29,19,47,17,3,32,20,6,18,689,63,129,74,6,0,67,12,65,1,2,0,29,6135,9,1237,43,8,8952,286,50,2,18,3,9,395,2309,106,6,12,4,8,8,9,5991,84,2,70,2,1,3,0,3,1,3,3,2,11,2,0,2,6,2,64,2,3,3,7,2,6,2,27,2,3,2,4,2,0,4,6,2,339,3,24,2,24,2,30,2,24,2,30,2,24,2,30,2,24,2,30,2,24,2,7,2357,44,11,6,17,0,370,43,1301,196,60,67,8,0,1205,3,2,26,2,1,2,0,3,0,2,9,2,3,2,0,2,0,7,0,5,0,2,0,2,0,2,2,2,1,2,0,3,0,2,0,2,0,2,0,2,0,2,1,2,0,3,3,2,6,2,3,2,3,2,0,2,9,2,16,6,2,2,4,2,16,4421,42717,35,4148,12,221,3,5761,15,7472,3104,541,1507,4938];
+
+// eslint-disable-next-line comma-spacing
+var astralIdentifierCodes = [509,0,227,0,150,4,294,9,1368,2,2,1,6,3,41,2,5,0,166,1,574,3,9,9,370,1,154,10,176,2,54,14,32,9,16,3,46,10,54,9,7,2,37,13,2,9,6,1,45,0,13,2,49,13,9,3,2,11,83,11,7,0,161,11,6,9,7,3,56,1,2,6,3,1,3,2,10,0,11,1,3,6,4,4,193,17,10,9,5,0,82,19,13,9,214,6,3,8,28,1,83,16,16,9,82,12,9,9,84,14,5,9,243,14,166,9,71,5,2,1,3,3,2,0,2,1,13,9,120,6,3,6,4,0,29,9,41,6,2,3,9,0,10,10,47,15,406,7,2,7,17,9,57,21,2,13,123,5,4,0,2,1,2,6,2,0,9,9,49,4,2,1,2,4,9,9,330,3,19306,9,135,4,60,6,26,9,1014,0,2,54,8,3,82,0,12,1,19628,1,5319,4,4,5,9,7,3,6,31,3,149,2,1418,49,513,54,5,49,9,0,15,0,23,4,2,14,1361,6,2,16,3,6,2,1,2,4,262,6,10,9,419,13,1495,6,110,6,6,9,4759,9,787719,239];
+
+// This has a complexity linear to the value of the code. The
+// assumption is that looking up astral identifier characters is
+// rare.
+function isInAstralSet(code, set) {
+  var pos = 0x10000;
+  for (var i = 0; i < set.length; i += 2) {
+    pos += set[i];
+    if (pos > code) { return false }
+    pos += set[i + 1];
+    if (pos >= code) { return true }
+  }
+}
+
+// Test whether a given character code starts an identifier.
+
+function isIdentifierStart(code, astral) {
+  if (code < 65) { return code === 36 }
+  if (code < 91) { return true }
+  if (code < 97) { return code === 95 }
+  if (code < 123) { return true }
+  if (code <= 0xffff) { return code >= 0xaa && nonASCIIidentifierStart.test(String.fromCharCode(code)) }
+  if (astral === false) { return false }
+  return isInAstralSet(code, astralIdentifierStartCodes)
+}
+
+// Test whether a given character is part of an identifier.
+
+function isIdentifierChar(code, astral) {
+  if (code < 48) { return code === 36 }
+  if (code < 58) { return true }
+  if (code < 65) { return false }
+  if (code < 91) { return true }
+  if (code < 97) { return code === 95 }
+  if (code < 123) { return true }
+  if (code <= 0xffff) { return code >= 0xaa && nonASCIIidentifier.test(String.fromCharCode(code)) }
+  if (astral === false) { return false }
+  return isInAstralSet(code, astralIdentifierStartCodes) || isInAstralSet(code, astralIdentifierCodes)
+}
+
+// ## Token types
+
+// The assignment of fine-grained, information-carrying type objects
+// allows the tokenizer to store the information it has about a
+// token in a way that is very cheap for the parser to look up.
+
+// All token type variables start with an underscore, to make them
+// easy to recognize.
+
+// The `beforeExpr` property is used to disambiguate between regular
+// expressions and divisions. It is set on all token types that can
+// be followed by an expression (thus, a slash after them would be a
+// regular expression).
+//
+// The `startsExpr` property is used to check if the token ends a
+// `yield` expression. It is set on all token types that either can
+// directly start an expression (like a quotation mark) or can
+// continue an expression (like the body of a string).
+//
+// `isLoop` marks a keyword as starting a loop, which is important
+// to know when parsing a label, in order to allow or disallow
+// continue jumps to that label.
+
+var TokenType = function TokenType(label, conf) {
+  if ( conf === void 0 ) conf = {};
+
+  this.label = label;
+  this.keyword = conf.keyword;
+  this.beforeExpr = !!conf.beforeExpr;
+  this.startsExpr = !!conf.startsExpr;
+  this.isLoop = !!conf.isLoop;
+  this.isAssign = !!conf.isAssign;
+  this.prefix = !!conf.prefix;
+  this.postfix = !!conf.postfix;
+  this.binop = conf.binop || null;
+  this.updateContext = null;
+};
+
+function binop(name, prec) {
+  return new TokenType(name, {beforeExpr: true, binop: prec})
+}
+var beforeExpr = {beforeExpr: true}, startsExpr = {startsExpr: true};
+
+// Map keyword names to token types.
+
+var keywords$1 = {};
+
+// Succinct definitions of keyword token types
+function kw(name, options) {
+  if ( options === void 0 ) options = {};
+
+  options.keyword = name;
+  return keywords$1[name] = new TokenType(name, options)
+}
+
+var types = {
+  num: new TokenType("num", startsExpr),
+  regexp: new TokenType("regexp", startsExpr),
+  string: new TokenType("string", startsExpr),
+  name: new TokenType("name", startsExpr),
+  eof: new TokenType("eof"),
+
+  // Punctuation token types.
+  bracketL: new TokenType("[", {beforeExpr: true, startsExpr: true}),
+  bracketR: new TokenType("]"),
+  braceL: new TokenType("{", {beforeExpr: true, startsExpr: true}),
+  braceR: new TokenType("}"),
+  parenL: new TokenType("(", {beforeExpr: true, startsExpr: true}),
+  parenR: new TokenType(")"),
+  comma: new TokenType(",", beforeExpr),
+  semi: new TokenType(";", beforeExpr),
+  colon: new TokenType(":", beforeExpr),
+  dot: new TokenType("."),
+  question: new TokenType("?", beforeExpr),
+  questionDot: new TokenType("?."),
+  arrow: new TokenType("=>", beforeExpr),
+  template: new TokenType("template"),
+  invalidTemplate: new TokenType("invalidTemplate"),
+  ellipsis: new TokenType("...", beforeExpr),
+  backQuote: new TokenType("`", startsExpr),
+  dollarBraceL: new TokenType("${", {beforeExpr: true, startsExpr: true}),
+
+  // Operators. These carry several kinds of properties to help the
+  // parser use them properly (the presence of these properties is
+  // what categorizes them as operators).
+  //
+  // `binop`, when present, specifies that this operator is a binary
+  // operator, and will refer to its precedence.
+  //
+  // `prefix` and `postfix` mark the operator as a prefix or postfix
+  // unary operator.
+  //
+  // `isAssign` marks all of `=`, `+=`, `-=` etcetera, which act as
+  // binary operators with a very low precedence, that should result
+  // in AssignmentExpression nodes.
+
+  eq: new TokenType("=", {beforeExpr: true, isAssign: true}),
+  assign: new TokenType("_=", {beforeExpr: true, isAssign: true}),
+  incDec: new TokenType("++/--", {prefix: true, postfix: true, startsExpr: true}),
+  prefix: new TokenType("!/~", {beforeExpr: true, prefix: true, startsExpr: true}),
+  logicalOR: binop("||", 1),
+  logicalAND: binop("&&", 2),
+  bitwiseOR: binop("|", 3),
+  bitwiseXOR: binop("^", 4),
+  bitwiseAND: binop("&", 5),
+  equality: binop("==/!=/===/!==", 6),
+  relational: binop("</>/<=/>=", 7),
+  bitShift: binop("<</>>/>>>", 8),
+  plusMin: new TokenType("+/-", {beforeExpr: true, binop: 9, prefix: true, startsExpr: true}),
+  modulo: binop("%", 10),
+  star: binop("*", 10),
+  slash: binop("/", 10),
+  starstar: new TokenType("**", {beforeExpr: true}),
+  coalesce: binop("??", 1),
+
+  // Keyword token types.
+  _break: kw("break"),
+  _case: kw("case", beforeExpr),
+  _catch: kw("catch"),
+  _continue: kw("continue"),
+  _debugger: kw("debugger"),
+  _default: kw("default", beforeExpr),
+  _do: kw("do", {isLoop: true, beforeExpr: true}),
+  _else: kw("else", beforeExpr),
+  _finally: kw("finally"),
+  _for: kw("for", {isLoop: true}),
+  _function: kw("function", startsExpr),
+  _if: kw("if"),
+  _return: kw("return", beforeExpr),
+  _switch: kw("switch"),
+  _throw: kw("throw", beforeExpr),
+  _try: kw("try"),
+  _var: kw("var"),
+  _const: kw("const"),
+  _while: kw("while", {isLoop: true}),
+  _with: kw("with"),
+  _new: kw("new", {beforeExpr: true, startsExpr: true}),
+  _this: kw("this", startsExpr),
+  _super: kw("super", startsExpr),
+  _class: kw("class", startsExpr),
+  _extends: kw("extends", beforeExpr),
+  _export: kw("export"),
+  _import: kw("import", startsExpr),
+  _null: kw("null", startsExpr),
+  _true: kw("true", startsExpr),
+  _false: kw("false", startsExpr),
+  _in: kw("in", {beforeExpr: true, binop: 7}),
+  _instanceof: kw("instanceof", {beforeExpr: true, binop: 7}),
+  _typeof: kw("typeof", {beforeExpr: true, prefix: true, startsExpr: true}),
+  _void: kw("void", {beforeExpr: true, prefix: true, startsExpr: true}),
+  _delete: kw("delete", {beforeExpr: true, prefix: true, startsExpr: true})
+};
+
+// Matches a whole line break (where CRLF is considered a single
+// line break). Used to count lines.
+
+var lineBreak = /\r\n?|\n|\u2028|\u2029/;
+var lineBreakG = new RegExp(lineBreak.source, "g");
+
+function isNewLine(code, ecma2019String) {
+  return code === 10 || code === 13 || (!ecma2019String && (code === 0x2028 || code === 0x2029))
+}
+
+var nonASCIIwhitespace = /[\u1680\u2000-\u200a\u202f\u205f\u3000\ufeff]/;
+
+var skipWhiteSpace = /(?:\s|\/\/.*|\/\*[^]*?\*\/)*/g;
+
+var ref = Object.prototype;
+var hasOwnProperty = ref.hasOwnProperty;
+var toString = ref.toString;
+
+// Checks if an object has a property.
+
+function has(obj, propName) {
+  return hasOwnProperty.call(obj, propName)
+}
+
+var isArray = Array.isArray || (function (obj) { return (
+  toString.call(obj) === "[object Array]"
+); });
+
+function wordsRegexp(words) {
+  return new RegExp("^(?:" + words.replace(/ /g, "|") + ")$")
+}
+
+// These are used when `options.locations` is on, for the
+// `startLoc` and `endLoc` properties.
+
+var Position = function Position(line, col) {
+  this.line = line;
+  this.column = col;
+};
+
+Position.prototype.offset = function offset (n) {
+  return new Position(this.line, this.column + n)
+};
+
+var SourceLocation = function SourceLocation(p, start, end) {
+  this.start = start;
+  this.end = end;
+  if (p.sourceFile !== null) { this.source = p.sourceFile; }
+};
+
+// The `getLineInfo` function is mostly useful when the
+// `locations` option is off (for performance reasons) and you
+// want to find the line/column position for a given character
+// offset. `input` should be the code string that the offset refers
+// into.
+
+function getLineInfo(input, offset) {
+  for (var line = 1, cur = 0;;) {
+    lineBreakG.lastIndex = cur;
+    var match = lineBreakG.exec(input);
+    if (match && match.index < offset) {
+      ++line;
+      cur = match.index + match[0].length;
+    } else {
+      return new Position(line, offset - cur)
+    }
+  }
+}
+
+// A second argument must be given to configure the parser process.
+// These options are recognized (only `ecmaVersion` is required):
+
+var defaultOptions = {
+  // `ecmaVersion` indicates the ECMAScript version to parse. Must be
+  // either 3, 5, 6 (or 2015), 7 (2016), 8 (2017), 9 (2018), 10
+  // (2019), 11 (2020), 12 (2021), or `"latest"` (the latest version
+  // the library supports). This influences support for strict mode,
+  // the set of reserved words, and support for new syntax features.
+  ecmaVersion: null,
+  // `sourceType` indicates the mode the code should be parsed in.
+  // Can be either `"script"` or `"module"`. This influences global
+  // strict mode and parsing of `import` and `export` declarations.
+  sourceType: "script",
+  // `onInsertedSemicolon` can be a callback that will be called
+  // when a semicolon is automatically inserted. It will be passed
+  // the position of the comma as an offset, and if `locations` is
+  // enabled, it is given the location as a `{line, column}` object
+  // as second argument.
+  onInsertedSemicolon: null,
+  // `onTrailingComma` is similar to `onInsertedSemicolon`, but for
+  // trailing commas.
+  onTrailingComma: null,
+  // By default, reserved words are only enforced if ecmaVersion >= 5.
+  // Set `allowReserved` to a boolean value to explicitly turn this on
+  // an off. When this option has the value "never", reserved words
+  // and keywords can also not be used as property names.
+  allowReserved: null,
+  // When enabled, a return at the top level is not considered an
+  // error.
+  allowReturnOutsideFunction: false,
+  // When enabled, import/export statements are not constrained to
+  // appearing at the top of the program.
+  allowImportExportEverywhere: false,
+  // When enabled, await identifiers are allowed to appear at the top-level scope,
+  // but they are still not allowed in non-async functions.
+  allowAwaitOutsideFunction: false,
+  // When enabled, hashbang directive in the beginning of file
+  // is allowed and treated as a line comment.
+  allowHashBang: false,
+  // When `locations` is on, `loc` properties holding objects with
+  // `start` and `end` properties in `{line, column}` form (with
+  // line being 1-based and column 0-based) will be attached to the
+  // nodes.
+  locations: false,
+  // A function can be passed as `onToken` option, which will
+  // cause Acorn to call that function with object in the same
+  // format as tokens returned from `tokenizer().getToken()`. Note
+  // that you are not allowed to call the parser from the
+  // callback—that will corrupt its internal state.
+  onToken: null,
+  // A function can be passed as `onComment` option, which will
+  // cause Acorn to call that function with `(block, text, start,
+  // end)` parameters whenever a comment is skipped. `block` is a
+  // boolean indicating whether this is a block (`/* */`) comment,
+  // `text` is the content of the comment, and `start` and `end` are
+  // character offsets that denote the start and end of the comment.
+  // When the `locations` option is on, two more parameters are
+  // passed, the full `{line, column}` locations of the start and
+  // end of the comments. Note that you are not allowed to call the
+  // parser from the callback—that will corrupt its internal state.
+  onComment: null,
+  // Nodes have their start and end characters offsets recorded in
+  // `start` and `end` properties (directly on the node, rather than
+  // the `loc` object, which holds line/column data. To also add a
+  // [semi-standardized][range] `range` property holding a `[start,
+  // end]` array with the same numbers, set the `ranges` option to
+  // `true`.
+  //
+  // [range]: https://bugzilla.mozilla.org/show_bug.cgi?id=745678
+  ranges: false,
+  // It is possible to parse multiple files into a single AST by
+  // passing the tree produced by parsing the first file as
+  // `program` option in subsequent parses. This will add the
+  // toplevel forms of the parsed file to the `Program` (top) node
+  // of an existing parse tree.
+  program: null,
+  // When `locations` is on, you can pass this to record the source
+  // file in every node's `loc` object.
+  sourceFile: null,
+  // This value, if given, is stored in every node, whether
+  // `locations` is on or off.
+  directSourceFile: null,
+  // When enabled, parenthesized expressions are represented by
+  // (non-standard) ParenthesizedExpression nodes
+  preserveParens: false
+};
+
+// Interpret and default an options object
+
+var warnedAboutEcmaVersion = false;
+
+function getOptions(opts) {
+  var options = {};
+
+  for (var opt in defaultOptions)
+    { options[opt] = opts && has(opts, opt) ? opts[opt] : defaultOptions[opt]; }
+
+  if (options.ecmaVersion === "latest") {
+    options.ecmaVersion = 1e8;
+  } else if (options.ecmaVersion == null) {
+    if (!warnedAboutEcmaVersion && typeof console === "object" && console.warn) {
+      warnedAboutEcmaVersion = true;
+      console.warn("Since Acorn 8.0.0, options.ecmaVersion is required.\nDefaulting to 2020, but this will stop working in the future.");
+    }
+    options.ecmaVersion = 11;
+  } else if (options.ecmaVersion >= 2015) {
+    options.ecmaVersion -= 2009;
+  }
+
+  if (options.allowReserved == null)
+    { options.allowReserved = options.ecmaVersion < 5; }
+
+  if (isArray(options.onToken)) {
+    var tokens = options.onToken;
+    options.onToken = function (token) { return tokens.push(token); };
+  }
+  if (isArray(options.onComment))
+    { options.onComment = pushComment(options, options.onComment); }
+
+  return options
+}
+
+function pushComment(options, array) {
+  return function(block, text, start, end, startLoc, endLoc) {
+    var comment = {
+      type: block ? "Block" : "Line",
+      value: text,
+      start: start,
+      end: end
+    };
+    if (options.locations)
+      { comment.loc = new SourceLocation(this, startLoc, endLoc); }
+    if (options.ranges)
+      { comment.range = [start, end]; }
+    array.push(comment);
+  }
+}
+
+// Each scope gets a bitset that may contain these flags
+var
+    SCOPE_TOP = 1,
+    SCOPE_FUNCTION = 2,
+    SCOPE_VAR = SCOPE_TOP | SCOPE_FUNCTION,
+    SCOPE_ASYNC = 4,
+    SCOPE_GENERATOR = 8,
+    SCOPE_ARROW = 16,
+    SCOPE_SIMPLE_CATCH = 32,
+    SCOPE_SUPER = 64,
+    SCOPE_DIRECT_SUPER = 128;
+
+function functionFlags(async, generator) {
+  return SCOPE_FUNCTION | (async ? SCOPE_ASYNC : 0) | (generator ? SCOPE_GENERATOR : 0)
+}
+
+// Used in checkLVal* and declareName to determine the type of a binding
+var
+    BIND_NONE = 0, // Not a binding
+    BIND_VAR = 1, // Var-style binding
+    BIND_LEXICAL = 2, // Let- or const-style binding
+    BIND_FUNCTION = 3, // Function declaration
+    BIND_SIMPLE_CATCH = 4, // Simple (identifier pattern) catch binding
+    BIND_OUTSIDE = 5; // Special case for function names as bound inside the function
+
+var Parser = function Parser(options, input, startPos) {
+  this.options = options = getOptions(options);
+  this.sourceFile = options.sourceFile;
+  this.keywords = wordsRegexp(keywords[options.ecmaVersion >= 6 ? 6 : options.sourceType === "module" ? "5module" : 5]);
+  var reserved = "";
+  if (options.allowReserved !== true) {
+    reserved = reservedWords[options.ecmaVersion >= 6 ? 6 : options.ecmaVersion === 5 ? 5 : 3];
+    if (options.sourceType === "module") { reserved += " await"; }
+  }
+  this.reservedWords = wordsRegexp(reserved);
+  var reservedStrict = (reserved ? reserved + " " : "") + reservedWords.strict;
+  this.reservedWordsStrict = wordsRegexp(reservedStrict);
+  this.reservedWordsStrictBind = wordsRegexp(reservedStrict + " " + reservedWords.strictBind);
+  this.input = String(input);
+
+  // Used to signal to callers of `readWord1` whether the word
+  // contained any escape sequences. This is needed because words with
+  // escape sequences must not be interpreted as keywords.
+  this.containsEsc = false;
+
+  // Set up token state
+
+  // The current position of the tokenizer in the input.
+  if (startPos) {
+    this.pos = startPos;
+    this.lineStart = this.input.lastIndexOf("\n", startPos - 1) + 1;
+    this.curLine = this.input.slice(0, this.lineStart).split(lineBreak).length;
+  } else {
+    this.pos = this.lineStart = 0;
+    this.curLine = 1;
+  }
+
+  // Properties of the current token:
+  // Its type
+  this.type = types.eof;
+  // For tokens that include more information than their type, the value
+  this.value = null;
+  // Its start and end offset
+  this.start = this.end = this.pos;
+  // And, if locations are used, the {line, column} object
+  // corresponding to those offsets
+  this.startLoc = this.endLoc = this.curPosition();
+
+  // Position information for the previous token
+  this.lastTokEndLoc = this.lastTokStartLoc = null;
+  this.lastTokStart = this.lastTokEnd = this.pos;
+
+  // The context stack is used to superficially track syntactic
+  // context to predict whether a regular expression is allowed in a
+  // given position.
+  this.context = this.initialContext();
+  this.exprAllowed = true;
+
+  // Figure out if it's a module code.
+  this.inModule = options.sourceType === "module";
+  this.strict = this.inModule || this.strictDirective(this.pos);
+
+  // Used to signify the start of a potential arrow function
+  this.potentialArrowAt = -1;
+
+  // Positions to delayed-check that yield/await does not exist in default parameters.
+  this.yieldPos = this.awaitPos = this.awaitIdentPos = 0;
+  // Labels in scope.
+  this.labels = [];
+  // Thus-far undefined exports.
+  this.undefinedExports = Object.create(null);
+
+  // If enabled, skip leading hashbang line.
+  if (this.pos === 0 && options.allowHashBang && this.input.slice(0, 2) === "#!")
+    { this.skipLineComment(2); }
+
+  // Scope tracking for duplicate variable names (see scope.js)
+  this.scopeStack = [];
+  this.enterScope(SCOPE_TOP);
+
+  // For RegExp validation
+  this.regexpState = null;
+};
+
+var prototypeAccessors = { inFunction: { configurable: true },inGenerator: { configurable: true },inAsync: { configurable: true },allowSuper: { configurable: true },allowDirectSuper: { configurable: true },treatFunctionsAsVar: { configurable: true },inNonArrowFunction: { configurable: true } };
+
+Parser.prototype.parse = function parse () {
+  var node = this.options.program || this.startNode();
+  this.nextToken();
+  return this.parseTopLevel(node)
+};
+
+prototypeAccessors.inFunction.get = function () { return (this.currentVarScope().flags & SCOPE_FUNCTION) > 0 };
+prototypeAccessors.inGenerator.get = function () { return (this.currentVarScope().flags & SCOPE_GENERATOR) > 0 };
+prototypeAccessors.inAsync.get = function () { return (this.currentVarScope().flags & SCOPE_ASYNC) > 0 };
+prototypeAccessors.allowSuper.get = function () { return (this.currentThisScope().flags & SCOPE_SUPER) > 0 };
+prototypeAccessors.allowDirectSuper.get = function () { return (this.currentThisScope().flags & SCOPE_DIRECT_SUPER) > 0 };
+prototypeAccessors.treatFunctionsAsVar.get = function () { return this.treatFunctionsAsVarInScope(this.currentScope()) };
+prototypeAccessors.inNonArrowFunction.get = function () { return (this.currentThisScope().flags & SCOPE_FUNCTION) > 0 };
+
+Parser.extend = function extend () {
+    var plugins = [], len = arguments.length;
+    while ( len-- ) plugins[ len ] = arguments[ len ];
+
+  var cls = this;
+  for (var i = 0; i < plugins.length; i++) { cls = plugins[i](cls); }
+  return cls
+};
+
+Parser.parse = function parse (input, options) {
+  return new this(options, input).parse()
+};
+
+Parser.parseExpressionAt = function parseExpressionAt (input, pos, options) {
+  var parser = new this(options, input, pos);
+  parser.nextToken();
+  return parser.parseExpression()
+};
+
+Parser.tokenizer = function tokenizer (input, options) {
+  return new this(options, input)
+};
+
+Object.defineProperties( Parser.prototype, prototypeAccessors );
+
+var pp = Parser.prototype;
+
+// ## Parser utilities
+
+var literal = /^(?:'((?:\\.|[^'\\])*?)'|"((?:\\.|[^"\\])*?)")/;
+pp.strictDirective = function(start) {
+  for (;;) {
+    // Try to find string literal.
+    skipWhiteSpace.lastIndex = start;
+    start += skipWhiteSpace.exec(this.input)[0].length;
+    var match = literal.exec(this.input.slice(start));
+    if (!match) { return false }
+    if ((match[1] || match[2]) === "use strict") {
+      skipWhiteSpace.lastIndex = start + match[0].length;
+      var spaceAfter = skipWhiteSpace.exec(this.input), end = spaceAfter.index + spaceAfter[0].length;
+      var next = this.input.charAt(end);
+      return next === ";" || next === "}" ||
+        (lineBreak.test(spaceAfter[0]) &&
+         !(/[(`.[+\-/*%<>=,?^&]/.test(next) || next === "!" && this.input.charAt(end + 1) === "="))
+    }
+    start += match[0].length;
+
+    // Skip semicolon, if any.
+    skipWhiteSpace.lastIndex = start;
+    start += skipWhiteSpace.exec(this.input)[0].length;
+    if (this.input[start] === ";")
+      { start++; }
+  }
+};
+
+// Predicate that tests whether the next token is of the given
+// type, and if yes, consumes it as a side effect.
+
+pp.eat = function(type) {
+  if (this.type === type) {
+    this.next();
+    return true
+  } else {
+    return false
+  }
+};
+
+// Tests whether parsed token is a contextual keyword.
+
+pp.isContextual = function(name) {
+  return this.type === types.name && this.value === name && !this.containsEsc
+};
+
+// Consumes contextual keyword if possible.
+
+pp.eatContextual = function(name) {
+  if (!this.isContextual(name)) { return false }
+  this.next();
+  return true
+};
+
+// Asserts that following token is given contextual keyword.
+
+pp.expectContextual = function(name) {
+  if (!this.eatContextual(name)) { this.unexpected(); }
+};
+
+// Test whether a semicolon can be inserted at the current position.
+
+pp.canInsertSemicolon = function() {
+  return this.type === types.eof ||
+    this.type === types.braceR ||
+    lineBreak.test(this.input.slice(this.lastTokEnd, this.start))
+};
+
+pp.insertSemicolon = function() {
+  if (this.canInsertSemicolon()) {
+    if (this.options.onInsertedSemicolon)
+      { this.options.onInsertedSemicolon(this.lastTokEnd, this.lastTokEndLoc); }
+    return true
+  }
+};
+
+// Consume a semicolon, or, failing that, see if we are allowed to
+// pretend that there is a semicolon at this position.
+
+pp.semicolon = function() {
+  if (!this.eat(types.semi) && !this.insertSemicolon()) { this.unexpected(); }
+};
+
+pp.afterTrailingComma = function(tokType, notNext) {
+  if (this.type === tokType) {
+    if (this.options.onTrailingComma)
+      { this.options.onTrailingComma(this.lastTokStart, this.lastTokStartLoc); }
+    if (!notNext)
+      { this.next(); }
+    return true
+  }
+};
+
+// Expect a token of a given type. If found, consume it, otherwise,
+// raise an unexpected token error.
+
+pp.expect = function(type) {
+  this.eat(type) || this.unexpected();
+};
+
+// Raise an unexpected token error.
+
+pp.unexpected = function(pos) {
+  this.raise(pos != null ? pos : this.start, "Unexpected token");
+};
+
+function DestructuringErrors() {
+  this.shorthandAssign =
+  this.trailingComma =
+  this.parenthesizedAssign =
+  this.parenthesizedBind =
+  this.doubleProto =
+    -1;
+}
+
+pp.checkPatternErrors = function(refDestructuringErrors, isAssign) {
+  if (!refDestructuringErrors) { return }
+  if (refDestructuringErrors.trailingComma > -1)
+    { this.raiseRecoverable(refDestructuringErrors.trailingComma, "Comma is not permitted after the rest element"); }
+  var parens = isAssign ? refDestructuringErrors.parenthesizedAssign : refDestructuringErrors.parenthesizedBind;
+  if (parens > -1) { this.raiseRecoverable(parens, "Parenthesized pattern"); }
+};
+
+pp.checkExpressionErrors = function(refDestructuringErrors, andThrow) {
+  if (!refDestructuringErrors) { return false }
+  var shorthandAssign = refDestructuringErrors.shorthandAssign;
+  var doubleProto = refDestructuringErrors.doubleProto;
+  if (!andThrow) { return shorthandAssign >= 0 || doubleProto >= 0 }
+  if (shorthandAssign >= 0)
+    { this.raise(shorthandAssign, "Shorthand property assignments are valid only in destructuring patterns"); }
+  if (doubleProto >= 0)
+    { this.raiseRecoverable(doubleProto, "Redefinition of __proto__ property"); }
+};
+
+pp.checkYieldAwaitInDefaultParams = function() {
+  if (this.yieldPos && (!this.awaitPos || this.yieldPos < this.awaitPos))
+    { this.raise(this.yieldPos, "Yield expression cannot be a default value"); }
+  if (this.awaitPos)
+    { this.raise(this.awaitPos, "Await expression cannot be a default value"); }
+};
+
+pp.isSimpleAssignTarget = function(expr) {
+  if (expr.type === "ParenthesizedExpression")
+    { return this.isSimpleAssignTarget(expr.expression) }
+  return expr.type === "Identifier" || expr.type === "MemberExpression"
+};
+
+var pp$1 = Parser.prototype;
+
+// ### Statement parsing
+
+// Parse a program. Initializes the parser, reads any number of
+// statements, and wraps them in a Program node.  Optionally takes a
+// `program` argument.  If present, the statements will be appended
+// to its body instead of creating a new node.
+
+pp$1.parseTopLevel = function(node) {
+  var exports = Object.create(null);
+  if (!node.body) { node.body = []; }
+  while (this.type !== types.eof) {
+    var stmt = this.parseStatement(null, true, exports);
+    node.body.push(stmt);
+  }
+  if (this.inModule)
+    { for (var i = 0, list = Object.keys(this.undefinedExports); i < list.length; i += 1)
+      {
+        var name = list[i];
+
+        this.raiseRecoverable(this.undefinedExports[name].start, ("Export '" + name + "' is not defined"));
+      } }
+  this.adaptDirectivePrologue(node.body);
+  this.next();
+  node.sourceType = this.options.sourceType;
+  return this.finishNode(node, "Program")
+};
+
+var loopLabel = {kind: "loop"}, switchLabel = {kind: "switch"};
+
+pp$1.isLet = function(context) {
+  if (this.options.ecmaVersion < 6 || !this.isContextual("let")) { return false }
+  skipWhiteSpace.lastIndex = this.pos;
+  var skip = skipWhiteSpace.exec(this.input);
+  var next = this.pos + skip[0].length, nextCh = this.input.charCodeAt(next);
+  // For ambiguous cases, determine if a LexicalDeclaration (or only a
+  // Statement) is allowed here. If context is not empty then only a Statement
+  // is allowed. However, `let [` is an explicit negative lookahead for
+  // ExpressionStatement, so special-case it first.
+  if (nextCh === 91) { return true } // '['
+  if (context) { return false }
+
+  if (nextCh === 123) { return true } // '{'
+  if (isIdentifierStart(nextCh, true)) {
+    var pos = next + 1;
+    while (isIdentifierChar(this.input.charCodeAt(pos), true)) { ++pos; }
+    var ident = this.input.slice(next, pos);
+    if (!keywordRelationalOperator.test(ident)) { return true }
+  }
+  return false
+};
+
+// check 'async [no LineTerminator here] function'
+// - 'async /*foo*/ function' is OK.
+// - 'async /*\n*/ function' is invalid.
+pp$1.isAsyncFunction = function() {
+  if (this.options.ecmaVersion < 8 || !this.isContextual("async"))
+    { return false }
+
+  skipWhiteSpace.lastIndex = this.pos;
+  var skip = skipWhiteSpace.exec(this.input);
+  var next = this.pos + skip[0].length;
+  return !lineBreak.test(this.input.slice(this.pos, next)) &&
+    this.input.slice(next, next + 8) === "function" &&
+    (next + 8 === this.input.length || !isIdentifierChar(this.input.charAt(next + 8)))
+};
+
+// Parse a single statement.
+//
+// If expecting a statement and finding a slash operator, parse a
+// regular expression literal. This is to handle cases like
+// `if (foo) /blah/.exec(foo)`, where looking at the previous token
+// does not help.
+
+pp$1.parseStatement = function(context, topLevel, exports) {
+  var starttype = this.type, node = this.startNode(), kind;
+
+  if (this.isLet(context)) {
+    starttype = types._var;
+    kind = "let";
+  }
+
+  // Most types of statements are recognized by the keyword they
+  // start with. Many are trivial to parse, some require a bit of
+  // complexity.
+
+  switch (starttype) {
+  case types._break: case types._continue: return this.parseBreakContinueStatement(node, starttype.keyword)
+  case types._debugger: return this.parseDebuggerStatement(node)
+  case types._do: return this.parseDoStatement(node)
+  case types._for: return this.parseForStatement(node)
+  case types._function:
+    // Function as sole body of either an if statement or a labeled statement
+    // works, but not when it is part of a labeled statement that is the sole
+    // body of an if statement.
+    if ((context && (this.strict || context !== "if" && context !== "label")) && this.options.ecmaVersion >= 6) { this.unexpected(); }
+    return this.parseFunctionStatement(node, false, !context)
+  case types._class:
+    if (context) { this.unexpected(); }
+    return this.parseClass(node, true)
+  case types._if: return this.parseIfStatement(node)
+  case types._return: return this.parseReturnStatement(node)
+  case types._switch: return this.parseSwitchStatement(node)
+  case types._throw: return this.parseThrowStatement(node)
+  case types._try: return this.parseTryStatement(node)
+  case types._const: case types._var:
+    kind = kind || this.value;
+    if (context && kind !== "var") { this.unexpected(); }
+    return this.parseVarStatement(node, kind)
+  case types._while: return this.parseWhileStatement(node)
+  case types._with: return this.parseWithStatement(node)
+  case types.braceL: return this.parseBlock(true, node)
+  case types.semi: return this.parseEmptyStatement(node)
+  case types._export:
+  case types._import:
+    if (this.options.ecmaVersion > 10 && starttype === types._import) {
+      skipWhiteSpace.lastIndex = this.pos;
+      var skip = skipWhiteSpace.exec(this.input);
+      var next = this.pos + skip[0].length, nextCh = this.input.charCodeAt(next);
+      if (nextCh === 40 || nextCh === 46) // '(' or '.'
+        { return this.parseExpressionStatement(node, this.parseExpression()) }
+    }
+
+    if (!this.options.allowImportExportEverywhere) {
+      if (!topLevel)
+        { this.raise(this.start, "'import' and 'export' may only appear at the top level"); }
+      if (!this.inModule)
+        { this.raise(this.start, "'import' and 'export' may appear only with 'sourceType: module'"); }
+    }
+    return starttype === types._import ? this.parseImport(node) : this.parseExport(node, exports)
+
+    // If the statement does not start with a statement keyword or a
+    // brace, it's an ExpressionStatement or LabeledStatement. We
+    // simply start parsing an expression, and afterwards, if the
+    // next token is a colon and the expression was a simple
+    // Identifier node, we switch to interpreting it as a label.
+  default:
+    if (this.isAsyncFunction()) {
+      if (context) { this.unexpected(); }
+      this.next();
+      return this.parseFunctionStatement(node, true, !context)
+    }
+
+    var maybeName = this.value, expr = this.parseExpression();
+    if (starttype === types.name && expr.type === "Identifier" && this.eat(types.colon))
+      { return this.parseLabeledStatement(node, maybeName, expr, context) }
+    else { return this.parseExpressionStatement(node, expr) }
+  }
+};
+
+pp$1.parseBreakContinueStatement = function(node, keyword) {
+  var isBreak = keyword === "break";
+  this.next();
+  if (this.eat(types.semi) || this.insertSemicolon()) { node.label = null; }
+  else if (this.type !== types.name) { this.unexpected(); }
+  else {
+    node.label = this.parseIdent();
+    this.semicolon();
+  }
+
+  // Verify that there is an actual destination to break or
+  // continue to.
+  var i = 0;
+  for (; i < this.labels.length; ++i) {
+    var lab = this.labels[i];
+    if (node.label == null || lab.name === node.label.name) {
+      if (lab.kind != null && (isBreak || lab.kind === "loop")) { break }
+      if (node.label && isBreak) { break }
+    }
+  }
+  if (i === this.labels.length) { this.raise(node.start, "Unsyntactic " + keyword); }
+  return this.finishNode(node, isBreak ? "BreakStatement" : "ContinueStatement")
+};
+
+pp$1.parseDebuggerStatement = function(node) {
+  this.next();
+  this.semicolon();
+  return this.finishNode(node, "DebuggerStatement")
+};
+
+pp$1.parseDoStatement = function(node) {
+  this.next();
+  this.labels.push(loopLabel);
+  node.body = this.parseStatement("do");
+  this.labels.pop();
+  this.expect(types._while);
+  node.test = this.parseParenExpression();
+  if (this.options.ecmaVersion >= 6)
+    { this.eat(types.semi); }
+  else
+    { this.semicolon(); }
+  return this.finishNode(node, "DoWhileStatement")
+};
+
+// Disambiguating between a `for` and a `for`/`in` or `for`/`of`
+// loop is non-trivial. Basically, we have to parse the init `var`
+// statement or expression, disallowing the `in` operator (see
+// the second parameter to `parseExpression`), and then check
+// whether the next token is `in` or `of`. When there is no init
+// part (semicolon immediately after the opening parenthesis), it
+// is a regular `for` loop.
+
+pp$1.parseForStatement = function(node) {
+  this.next();
+  var awaitAt = (this.options.ecmaVersion >= 9 && (this.inAsync || (!this.inFunction && this.options.allowAwaitOutsideFunction)) && this.eatContextual("await")) ? this.lastTokStart : -1;
+  this.labels.push(loopLabel);
+  this.enterScope(0);
+  this.expect(types.parenL);
+  if (this.type === types.semi) {
+    if (awaitAt > -1) { this.unexpected(awaitAt); }
+    return this.parseFor(node, null)
+  }
+  var isLet = this.isLet();
+  if (this.type === types._var || this.type === types._const || isLet) {
+    var init$1 = this.startNode(), kind = isLet ? "let" : this.value;
+    this.next();
+    this.parseVar(init$1, true, kind);
+    this.finishNode(init$1, "VariableDeclaration");
+    if ((this.type === types._in || (this.options.ecmaVersion >= 6 && this.isContextual("of"))) && init$1.declarations.length === 1) {
+      if (this.options.ecmaVersion >= 9) {
+        if (this.type === types._in) {
+          if (awaitAt > -1) { this.unexpected(awaitAt); }
+        } else { node.await = awaitAt > -1; }
+      }
+      return this.parseForIn(node, init$1)
+    }
+    if (awaitAt > -1) { this.unexpected(awaitAt); }
+    return this.parseFor(node, init$1)
+  }
+  var refDestructuringErrors = new DestructuringErrors;
+  var init = this.parseExpression(true, refDestructuringErrors);
+  if (this.type === types._in || (this.options.ecmaVersion >= 6 && this.isContextual("of"))) {
+    if (this.options.ecmaVersion >= 9) {
+      if (this.type === types._in) {
+        if (awaitAt > -1) { this.unexpected(awaitAt); }
+      } else { node.await = awaitAt > -1; }
+    }
+    this.toAssignable(init, false, refDestructuringErrors);
+    this.checkLValPattern(init);
+    return this.parseForIn(node, init)
+  } else {
+    this.checkExpressionErrors(refDestructuringErrors, true);
+  }
+  if (awaitAt > -1) { this.unexpected(awaitAt); }
+  return this.parseFor(node, init)
+};
+
+pp$1.parseFunctionStatement = function(node, isAsync, declarationPosition) {
+  this.next();
+  return this.parseFunction(node, FUNC_STATEMENT | (declarationPosition ? 0 : FUNC_HANGING_STATEMENT), false, isAsync)
+};
+
+pp$1.parseIfStatement = function(node) {
+  this.next();
+  node.test = this.parseParenExpression();
+  // allow function declarations in branches, but only in non-strict mode
+  node.consequent = this.parseStatement("if");
+  node.alternate = this.eat(types._else) ? this.parseStatement("if") : null;
+  return this.finishNode(node, "IfStatement")
+};
+
+pp$1.parseReturnStatement = function(node) {
+  if (!this.inFunction && !this.options.allowReturnOutsideFunction)
+    { this.raise(this.start, "'return' outside of function"); }
+  this.next();
+
+  // In `return` (and `break`/`continue`), the keywords with
+  // optional arguments, we eagerly look for a semicolon or the
+  // possibility to insert one.
+
+  if (this.eat(types.semi) || this.insertSemicolon()) { node.argument = null; }
+  else { node.argument = this.parseExpression(); this.semicolon(); }
+  return this.finishNode(node, "ReturnStatement")
+};
+
+pp$1.parseSwitchStatement = function(node) {
+  this.next();
+  node.discriminant = this.parseParenExpression();
+  node.cases = [];
+  this.expect(types.braceL);
+  this.labels.push(switchLabel);
+  this.enterScope(0);
+
+  // Statements under must be grouped (by label) in SwitchCase
+  // nodes. `cur` is used to keep the node that we are currently
+  // adding statements to.
+
+  var cur;
+  for (var sawDefault = false; this.type !== types.braceR;) {
+    if (this.type === types._case || this.type === types._default) {
+      var isCase = this.type === types._case;
+      if (cur) { this.finishNode(cur, "SwitchCase"); }
+      node.cases.push(cur = this.startNode());
+      cur.consequent = [];
+      this.next();
+      if (isCase) {
+        cur.test = this.parseExpression();
+      } else {
+        if (sawDefault) { this.raiseRecoverable(this.lastTokStart, "Multiple default clauses"); }
+        sawDefault = true;
+        cur.test = null;
+      }
+      this.expect(types.colon);
+    } else {
+      if (!cur) { this.unexpected(); }
+      cur.consequent.push(this.parseStatement(null));
+    }
+  }
+  this.exitScope();
+  if (cur) { this.finishNode(cur, "SwitchCase"); }
+  this.next(); // Closing brace
+  this.labels.pop();
+  return this.finishNode(node, "SwitchStatement")
+};
+
+pp$1.parseThrowStatement = function(node) {
+  this.next();
+  if (lineBreak.test(this.input.slice(this.lastTokEnd, this.start)))
+    { this.raise(this.lastTokEnd, "Illegal newline after throw"); }
+  node.argument = this.parseExpression();
+  this.semicolon();
+  return this.finishNode(node, "ThrowStatement")
+};
+
+// Reused empty array added for node fields that are always empty.
+
+var empty = [];
+
+pp$1.parseTryStatement = function(node) {
+  this.next();
+  node.block = this.parseBlock();
+  node.handler = null;
+  if (this.type === types._catch) {
+    var clause = this.startNode();
+    this.next();
+    if (this.eat(types.parenL)) {
+      clause.param = this.parseBindingAtom();
+      var simple = clause.param.type === "Identifier";
+      this.enterScope(simple ? SCOPE_SIMPLE_CATCH : 0);
+      this.checkLValPattern(clause.param, simple ? BIND_SIMPLE_CATCH : BIND_LEXICAL);
+      this.expect(types.parenR);
+    } else {
+      if (this.options.ecmaVersion < 10) { this.unexpected(); }
+      clause.param = null;
+      this.enterScope(0);
+    }
+    clause.body = this.parseBlock(false);
+    this.exitScope();
+    node.handler = this.finishNode(clause, "CatchClause");
+  }
+  node.finalizer = this.eat(types._finally) ? this.parseBlock() : null;
+  if (!node.handler && !node.finalizer)
+    { this.raise(node.start, "Missing catch or finally clause"); }
+  return this.finishNode(node, "TryStatement")
+};
+
+pp$1.parseVarStatement = function(node, kind) {
+  this.next();
+  this.parseVar(node, false, kind);
+  this.semicolon();
+  return this.finishNode(node, "VariableDeclaration")
+};
+
+pp$1.parseWhileStatement = function(node) {
+  this.next();
+  node.test = this.parseParenExpression();
+  this.labels.push(loopLabel);
+  node.body = this.parseStatement("while");
+  this.labels.pop();
+  return this.finishNode(node, "WhileStatement")
+};
+
+pp$1.parseWithStatement = function(node) {
+  if (this.strict) { this.raise(this.start, "'with' in strict mode"); }
+  this.next();
+  node.object = this.parseParenExpression();
+  node.body = this.parseStatement("with");
+  return this.finishNode(node, "WithStatement")
+};
+
+pp$1.parseEmptyStatement = function(node) {
+  this.next();
+  return this.finishNode(node, "EmptyStatement")
+};
+
+pp$1.parseLabeledStatement = function(node, maybeName, expr, context) {
+  for (var i$1 = 0, list = this.labels; i$1 < list.length; i$1 += 1)
+    {
+    var label = list[i$1];
+
+    if (label.name === maybeName)
+      { this.raise(expr.start, "Label '" + maybeName + "' is already declared");
+  } }
+  var kind = this.type.isLoop ? "loop" : this.type === types._switch ? "switch" : null;
+  for (var i = this.labels.length - 1; i >= 0; i--) {
+    var label$1 = this.labels[i];
+    if (label$1.statementStart === node.start) {
+      // Update information about previous labels on this node
+      label$1.statementStart = this.start;
+      label$1.kind = kind;
+    } else { break }
+  }
+  this.labels.push({name: maybeName, kind: kind, statementStart: this.start});
+  node.body = this.parseStatement(context ? context.indexOf("label") === -1 ? context + "label" : context : "label");
+  this.labels.pop();
+  node.label = expr;
+  return this.finishNode(node, "LabeledStatement")
+};
+
+pp$1.parseExpressionStatement = function(node, expr) {
+  node.expression = expr;
+  this.semicolon();
+  return this.finishNode(node, "ExpressionStatement")
+};
+
+// Parse a semicolon-enclosed block of statements, handling `"use
+// strict"` declarations when `allowStrict` is true (used for
+// function bodies).
+
+pp$1.parseBlock = function(createNewLexicalScope, node, exitStrict) {
+  if ( createNewLexicalScope === void 0 ) createNewLexicalScope = true;
+  if ( node === void 0 ) node = this.startNode();
+
+  node.body = [];
+  this.expect(types.braceL);
+  if (createNewLexicalScope) { this.enterScope(0); }
+  while (this.type !== types.braceR) {
+    var stmt = this.parseStatement(null);
+    node.body.push(stmt);
+  }
+  if (exitStrict) { this.strict = false; }
+  this.next();
+  if (createNewLexicalScope) { this.exitScope(); }
+  return this.finishNode(node, "BlockStatement")
+};
+
+// Parse a regular `for` loop. The disambiguation code in
+// `parseStatement` will already have parsed the init statement or
+// expression.
+
+pp$1.parseFor = function(node, init) {
+  node.init = init;
+  this.expect(types.semi);
+  node.test = this.type === types.semi ? null : this.parseExpression();
+  this.expect(types.semi);
+  node.update = this.type === types.parenR ? null : this.parseExpression();
+  this.expect(types.parenR);
+  node.body = this.parseStatement("for");
+  this.exitScope();
+  this.labels.pop();
+  return this.finishNode(node, "ForStatement")
+};
+
+// Parse a `for`/`in` and `for`/`of` loop, which are almost
+// same from parser's perspective.
+
+pp$1.parseForIn = function(node, init) {
+  var isForIn = this.type === types._in;
+  this.next();
+
+  if (
+    init.type === "VariableDeclaration" &&
+    init.declarations[0].init != null &&
+    (
+      !isForIn ||
+      this.options.ecmaVersion < 8 ||
+      this.strict ||
+      init.kind !== "var" ||
+      init.declarations[0].id.type !== "Identifier"
+    )
+  ) {
+    this.raise(
+      init.start,
+      ((isForIn ? "for-in" : "for-of") + " loop variable declaration may not have an initializer")
+    );
+  }
+  node.left = init;
+  node.right = isForIn ? this.parseExpression() : this.parseMaybeAssign();
+  this.expect(types.parenR);
+  node.body = this.parseStatement("for");
+  this.exitScope();
+  this.labels.pop();
+  return this.finishNode(node, isForIn ? "ForInStatement" : "ForOfStatement")
+};
+
+// Parse a list of variable declarations.
+
+pp$1.parseVar = function(node, isFor, kind) {
+  node.declarations = [];
+  node.kind = kind;
+  for (;;) {
+    var decl = this.startNode();
+    this.parseVarId(decl, kind);
+    if (this.eat(types.eq)) {
+      decl.init = this.parseMaybeAssign(isFor);
+    } else if (kind === "const" && !(this.type === types._in || (this.options.ecmaVersion >= 6 && this.isContextual("of")))) {
+      this.unexpected();
+    } else if (decl.id.type !== "Identifier" && !(isFor && (this.type === types._in || this.isContextual("of")))) {
+      this.raise(this.lastTokEnd, "Complex binding patterns require an initialization value");
+    } else {
+      decl.init = null;
+    }
+    node.declarations.push(this.finishNode(decl, "VariableDeclarator"));
+    if (!this.eat(types.comma)) { break }
+  }
+  return node
+};
+
+pp$1.parseVarId = function(decl, kind) {
+  decl.id = this.parseBindingAtom();
+  this.checkLValPattern(decl.id, kind === "var" ? BIND_VAR : BIND_LEXICAL, false);
+};
+
+var FUNC_STATEMENT = 1, FUNC_HANGING_STATEMENT = 2, FUNC_NULLABLE_ID = 4;
+
+// Parse a function declaration or literal (depending on the
+// `statement & FUNC_STATEMENT`).
+
+// Remove `allowExpressionBody` for 7.0.0, as it is only called with false
+pp$1.parseFunction = function(node, statement, allowExpressionBody, isAsync) {
+  this.initFunction(node);
+  if (this.options.ecmaVersion >= 9 || this.options.ecmaVersion >= 6 && !isAsync) {
+    if (this.type === types.star && (statement & FUNC_HANGING_STATEMENT))
+      { this.unexpected(); }
+    node.generator = this.eat(types.star);
+  }
+  if (this.options.ecmaVersion >= 8)
+    { node.async = !!isAsync; }
+
+  if (statement & FUNC_STATEMENT) {
+    node.id = (statement & FUNC_NULLABLE_ID) && this.type !== types.name ? null : this.parseIdent();
+    if (node.id && !(statement & FUNC_HANGING_STATEMENT))
+      // If it is a regular function declaration in sloppy mode, then it is
+      // subject to Annex B semantics (BIND_FUNCTION). Otherwise, the binding
+      // mode depends on properties of the current scope (see
+      // treatFunctionsAsVar).
+      { this.checkLValSimple(node.id, (this.strict || node.generator || node.async) ? this.treatFunctionsAsVar ? BIND_VAR : BIND_LEXICAL : BIND_FUNCTION); }
+  }
+
+  var oldYieldPos = this.yieldPos, oldAwaitPos = this.awaitPos, oldAwaitIdentPos = this.awaitIdentPos;
+  this.yieldPos = 0;
+  this.awaitPos = 0;
+  this.awaitIdentPos = 0;
+  this.enterScope(functionFlags(node.async, node.generator));
+
+  if (!(statement & FUNC_STATEMENT))
+    { node.id = this.type === types.name ? this.parseIdent() : null; }
+
+  this.parseFunctionParams(node);
+  this.parseFunctionBody(node, allowExpressionBody, false);
+
+  this.yieldPos = oldYieldPos;
+  this.awaitPos = oldAwaitPos;
+  this.awaitIdentPos = oldAwaitIdentPos;
+  return this.finishNode(node, (statement & FUNC_STATEMENT) ? "FunctionDeclaration" : "FunctionExpression")
+};
+
+pp$1.parseFunctionParams = function(node) {
+  this.expect(types.parenL);
+  node.params = this.parseBindingList(types.parenR, false, this.options.ecmaVersion >= 8);
+  this.checkYieldAwaitInDefaultParams();
+};
+
+// Parse a class declaration or literal (depending on the
+// `isStatement` parameter).
+
+pp$1.parseClass = function(node, isStatement) {
+  this.next();
+
+  // ecma-262 14.6 Class Definitions
+  // A class definition is always strict mode code.
+  var oldStrict = this.strict;
+  this.strict = true;
+
+  this.parseClassId(node, isStatement);
+  this.parseClassSuper(node);
+  var classBody = this.startNode();
+  var hadConstructor = false;
+  classBody.body = [];
+  this.expect(types.braceL);
+  while (this.type !== types.braceR) {
+    var element = this.parseClassElement(node.superClass !== null);
+    if (element) {
+      classBody.body.push(element);
+      if (element.type === "MethodDefinition" && element.kind === "constructor") {
+        if (hadConstructor) { this.raise(element.start, "Duplicate constructor in the same class"); }
+        hadConstructor = true;
+      }
+    }
+  }
+  this.strict = oldStrict;
+  this.next();
+  node.body = this.finishNode(classBody, "ClassBody");
+  return this.finishNode(node, isStatement ? "ClassDeclaration" : "ClassExpression")
+};
+
+pp$1.parseClassElement = function(constructorAllowsSuper) {
+  var this$1 = this;
+
+  if (this.eat(types.semi)) { return null }
+
+  var method = this.startNode();
+  var tryContextual = function (k, noLineBreak) {
+    if ( noLineBreak === void 0 ) noLineBreak = false;
+
+    var start = this$1.start, startLoc = this$1.startLoc;
+    if (!this$1.eatContextual(k)) { return false }
+    if (this$1.type !== types.parenL && (!noLineBreak || !this$1.canInsertSemicolon())) { return true }
+    if (method.key) { this$1.unexpected(); }
+    method.computed = false;
+    method.key = this$1.startNodeAt(start, startLoc);
+    method.key.name = k;
+    this$1.finishNode(method.key, "Identifier");
+    return false
+  };
+
+  method.kind = "method";
+  method.static = tryContextual("static");
+  var isGenerator = this.eat(types.star);
+  var isAsync = false;
+  if (!isGenerator) {
+    if (this.options.ecmaVersion >= 8 && tryContextual("async", true)) {
+      isAsync = true;
+      isGenerator = this.options.ecmaVersion >= 9 && this.eat(types.star);
+    } else if (tryContextual("get")) {
+      method.kind = "get";
+    } else if (tryContextual("set")) {
+      method.kind = "set";
+    }
+  }
+  if (!method.key) { this.parsePropertyName(method); }
+  var key = method.key;
+  var allowsDirectSuper = false;
+  if (!method.computed && !method.static && (key.type === "Identifier" && key.name === "constructor" ||
+      key.type === "Literal" && key.value === "constructor")) {
+    if (method.kind !== "method") { this.raise(key.start, "Constructor can't have get/set modifier"); }
+    if (isGenerator) { this.raise(key.start, "Constructor can't be a generator"); }
+    if (isAsync) { this.raise(key.start, "Constructor can't be an async method"); }
+    method.kind = "constructor";
+    allowsDirectSuper = constructorAllowsSuper;
+  } else if (method.static && key.type === "Identifier" && key.name === "prototype") {
+    this.raise(key.start, "Classes may not have a static property named prototype");
+  }
+  this.parseClassMethod(method, isGenerator, isAsync, allowsDirectSuper);
+  if (method.kind === "get" && method.value.params.length !== 0)
+    { this.raiseRecoverable(method.value.start, "getter should have no params"); }
+  if (method.kind === "set" && method.value.params.length !== 1)
+    { this.raiseRecoverable(method.value.start, "setter should have exactly one param"); }
+  if (method.kind === "set" && method.value.params[0].type === "RestElement")
+    { this.raiseRecoverable(method.value.params[0].start, "Setter cannot use rest params"); }
+  return method
+};
+
+pp$1.parseClassMethod = function(method, isGenerator, isAsync, allowsDirectSuper) {
+  method.value = this.parseMethod(isGenerator, isAsync, allowsDirectSuper);
+  return this.finishNode(method, "MethodDefinition")
+};
+
+pp$1.parseClassId = function(node, isStatement) {
+  if (this.type === types.name) {
+    node.id = this.parseIdent();
+    if (isStatement)
+      { this.checkLValSimple(node.id, BIND_LEXICAL, false); }
+  } else {
+    if (isStatement === true)
+      { this.unexpected(); }
+    node.id = null;
+  }
+};
+
+pp$1.parseClassSuper = function(node) {
+  node.superClass = this.eat(types._extends) ? this.parseExprSubscripts() : null;
+};
+
+// Parses module export declaration.
+
+pp$1.parseExport = function(node, exports) {
+  this.next();
+  // export * from '...'
+  if (this.eat(types.star)) {
+    if (this.options.ecmaVersion >= 11) {
+      if (this.eatContextual("as")) {
+        node.exported = this.parseIdent(true);
+        this.checkExport(exports, node.exported.name, this.lastTokStart);
+      } else {
+        node.exported = null;
+      }
+    }
+    this.expectContextual("from");
+    if (this.type !== types.string) { this.unexpected(); }
+    node.source = this.parseExprAtom();
+    this.semicolon();
+    return this.finishNode(node, "ExportAllDeclaration")
+  }
+  if (this.eat(types._default)) { // export default ...
+    this.checkExport(exports, "default", this.lastTokStart);
+    var isAsync;
+    if (this.type === types._function || (isAsync = this.isAsyncFunction())) {
+      var fNode = this.startNode();
+      this.next();
+      if (isAsync) { this.next(); }
+      node.declaration = this.parseFunction(fNode, FUNC_STATEMENT | FUNC_NULLABLE_ID, false, isAsync);
+    } else if (this.type === types._class) {
+      var cNode = this.startNode();
+      node.declaration = this.parseClass(cNode, "nullableID");
+    } else {
+      node.declaration = this.parseMaybeAssign();
+      this.semicolon();
+    }
+    return this.finishNode(node, "ExportDefaultDeclaration")
+  }
+  // export var|const|let|function|class ...
+  if (this.shouldParseExportStatement()) {
+    node.declaration = this.parseStatement(null);
+    if (node.declaration.type === "VariableDeclaration")
+      { this.checkVariableExport(exports, node.declaration.declarations); }
+    else
+      { this.checkExport(exports, node.declaration.id.name, node.declaration.id.start); }
+    node.specifiers = [];
+    node.source = null;
+  } else { // export { x, y as z } [from '...']
+    node.declaration = null;
+    node.specifiers = this.parseExportSpecifiers(exports);
+    if (this.eatContextual("from")) {
+      if (this.type !== types.string) { this.unexpected(); }
+      node.source = this.parseExprAtom();
+    } else {
+      for (var i = 0, list = node.specifiers; i < list.length; i += 1) {
+        // check for keywords used as local names
+        var spec = list[i];
+
+        this.checkUnreserved(spec.local);
+        // check if export is defined
+        this.checkLocalExport(spec.local);
+      }
+
+      node.source = null;
+    }
+    this.semicolon();
+  }
+  return this.finishNode(node, "ExportNamedDeclaration")
+};
+
+pp$1.checkExport = function(exports, name, pos) {
+  if (!exports) { return }
+  if (has(exports, name))
+    { this.raiseRecoverable(pos, "Duplicate export '" + name + "'"); }
+  exports[name] = true;
+};
+
+pp$1.checkPatternExport = function(exports, pat) {
+  var type = pat.type;
+  if (type === "Identifier")
+    { this.checkExport(exports, pat.name, pat.start); }
+  else if (type === "ObjectPattern")
+    { for (var i = 0, list = pat.properties; i < list.length; i += 1)
+      {
+        var prop = list[i];
+
+        this.checkPatternExport(exports, prop);
+      } }
+  else if (type === "ArrayPattern")
+    { for (var i$1 = 0, list$1 = pat.elements; i$1 < list$1.length; i$1 += 1) {
+      var elt = list$1[i$1];
+
+        if (elt) { this.checkPatternExport(exports, elt); }
+    } }
+  else if (type === "Property")
+    { this.checkPatternExport(exports, pat.value); }
+  else if (type === "AssignmentPattern")
+    { this.checkPatternExport(exports, pat.left); }
+  else if (type === "RestElement")
+    { this.checkPatternExport(exports, pat.argument); }
+  else if (type === "ParenthesizedExpression")
+    { this.checkPatternExport(exports, pat.expression); }
+};
+
+pp$1.checkVariableExport = function(exports, decls) {
+  if (!exports) { return }
+  for (var i = 0, list = decls; i < list.length; i += 1)
+    {
+    var decl = list[i];
+
+    this.checkPatternExport(exports, decl.id);
+  }
+};
+
+pp$1.shouldParseExportStatement = function() {
+  return this.type.keyword === "var" ||
+    this.type.keyword === "const" ||
+    this.type.keyword === "class" ||
+    this.type.keyword === "function" ||
+    this.isLet() ||
+    this.isAsyncFunction()
+};
+
+// Parses a comma-separated list of module exports.
+
+pp$1.parseExportSpecifiers = function(exports) {
+  var nodes = [], first = true;
+  // export { x, y as z } [from '...']
+  this.expect(types.braceL);
+  while (!this.eat(types.braceR)) {
+    if (!first) {
+      this.expect(types.comma);
+      if (this.afterTrailingComma(types.braceR)) { break }
+    } else { first = false; }
+
+    var node = this.startNode();
+    node.local = this.parseIdent(true);
+    node.exported = this.eatContextual("as") ? this.parseIdent(true) : node.local;
+    this.checkExport(exports, node.exported.name, node.exported.start);
+    nodes.push(this.finishNode(node, "ExportSpecifier"));
+  }
+  return nodes
+};
+
+// Parses import declaration.
+
+pp$1.parseImport = function(node) {
+  this.next();
+  // import '...'
+  if (this.type === types.string) {
+    node.specifiers = empty;
+    node.source = this.parseExprAtom();
+  } else {
+    node.specifiers = this.parseImportSpecifiers();
+    this.expectContextual("from");
+    node.source = this.type === types.string ? this.parseExprAtom() : this.unexpected();
+  }
+  this.semicolon();
+  return this.finishNode(node, "ImportDeclaration")
+};
+
+// Parses a comma-separated list of module imports.
+
+pp$1.parseImportSpecifiers = function() {
+  var nodes = [], first = true;
+  if (this.type === types.name) {
+    // import defaultObj, { x, y as z } from '...'
+    var node = this.startNode();
+    node.local = this.parseIdent();
+    this.checkLValSimple(node.local, BIND_LEXICAL);
+    nodes.push(this.finishNode(node, "ImportDefaultSpecifier"));
+    if (!this.eat(types.comma)) { return nodes }
+  }
+  if (this.type === types.star) {
+    var node$1 = this.startNode();
+    this.next();
+    this.expectContextual("as");
+    node$1.local = this.parseIdent();
+    this.checkLValSimple(node$1.local, BIND_LEXICAL);
+    nodes.push(this.finishNode(node$1, "ImportNamespaceSpecifier"));
+    return nodes
+  }
+  this.expect(types.braceL);
+  while (!this.eat(types.braceR)) {
+    if (!first) {
+      this.expect(types.comma);
+      if (this.afterTrailingComma(types.braceR)) { break }
+    } else { first = false; }
+
+    var node$2 = this.startNode();
+    node$2.imported = this.parseIdent(true);
+    if (this.eatContextual("as")) {
+      node$2.local = this.parseIdent();
+    } else {
+      this.checkUnreserved(node$2.imported);
+      node$2.local = node$2.imported;
+    }
+    this.checkLValSimple(node$2.local, BIND_LEXICAL);
+    nodes.push(this.finishNode(node$2, "ImportSpecifier"));
+  }
+  return nodes
+};
+
+// Set `ExpressionStatement#directive` property for directive prologues.
+pp$1.adaptDirectivePrologue = function(statements) {
+  for (var i = 0; i < statements.length && this.isDirectiveCandidate(statements[i]); ++i) {
+    statements[i].directive = statements[i].expression.raw.slice(1, -1);
+  }
+};
+pp$1.isDirectiveCandidate = function(statement) {
+  return (
+    statement.type === "ExpressionStatement" &&
+    statement.expression.type === "Literal" &&
+    typeof statement.expression.value === "string" &&
+    // Reject parenthesized strings.
+    (this.input[statement.start] === "\"" || this.input[statement.start] === "'")
+  )
+};
+
+var pp$2 = Parser.prototype;
+
+// Convert existing expression atom to assignable pattern
+// if possible.
+
+pp$2.toAssignable = function(node, isBinding, refDestructuringErrors) {
+  if (this.options.ecmaVersion >= 6 && node) {
+    switch (node.type) {
+    case "Identifier":
+      if (this.inAsync && node.name === "await")
+        { this.raise(node.start, "Cannot use 'await' as identifier inside an async function"); }
+      break
+
+    case "ObjectPattern":
+    case "ArrayPattern":
+    case "AssignmentPattern":
+    case "RestElement":
+      break
+
+    case "ObjectExpression":
+      node.type = "ObjectPattern";
+      if (refDestructuringErrors) { this.checkPatternErrors(refDestructuringErrors, true); }
+      for (var i = 0, list = node.properties; i < list.length; i += 1) {
+        var prop = list[i];
+
+      this.toAssignable(prop, isBinding);
+        // Early error:
+        //   AssignmentRestProperty[Yield, Await] :
+        //     `...` DestructuringAssignmentTarget[Yield, Await]
+        //
+        //   It is a Syntax Error if |DestructuringAssignmentTarget| is an |ArrayLiteral| or an |ObjectLiteral|.
+        if (
+          prop.type === "RestElement" &&
+          (prop.argument.type === "ArrayPattern" || prop.argument.type === "ObjectPattern")
+        ) {
+          this.raise(prop.argument.start, "Unexpected token");
+        }
+      }
+      break
+
+    case "Property":
+      // AssignmentProperty has type === "Property"
+      if (node.kind !== "init") { this.raise(node.key.start, "Object pattern can't contain getter or setter"); }
+      this.toAssignable(node.value, isBinding);
+      break
+
+    case "ArrayExpression":
+      node.type = "ArrayPattern";
+      if (refDestructuringErrors) { this.checkPatternErrors(refDestructuringErrors, true); }
+      this.toAssignableList(node.elements, isBinding);
+      break
+
+    case "SpreadElement":
+      node.type = "RestElement";
+      this.toAssignable(node.argument, isBinding);
+      if (node.argument.type === "AssignmentPattern")
+        { this.raise(node.argument.start, "Rest elements cannot have a default value"); }
+      break
+
+    case "AssignmentExpression":
+      if (node.operator !== "=") { this.raise(node.left.end, "Only '=' operator can be used for specifying default value."); }
+      node.type = "AssignmentPattern";
+      delete node.operator;
+      this.toAssignable(node.left, isBinding);
+      break
+
+    case "ParenthesizedExpression":
+      this.toAssignable(node.expression, isBinding, refDestructuringErrors);
+      break
+
+    case "ChainExpression":
+      this.raiseRecoverable(node.start, "Optional chaining cannot appear in left-hand side");
+      break
+
+    case "MemberExpression":
+      if (!isBinding) { break }
+
+    default:
+      this.raise(node.start, "Assigning to rvalue");
+    }
+  } else if (refDestructuringErrors) { this.checkPatternErrors(refDestructuringErrors, true); }
+  return node
+};
+
+// Convert list of expression atoms to binding list.
+
+pp$2.toAssignableList = function(exprList, isBinding) {
+  var end = exprList.length;
+  for (var i = 0; i < end; i++) {
+    var elt = exprList[i];
+    if (elt) { this.toAssignable(elt, isBinding); }
+  }
+  if (end) {
+    var last = exprList[end - 1];
+    if (this.options.ecmaVersion === 6 && isBinding && last && last.type === "RestElement" && last.argument.type !== "Identifier")
+      { this.unexpected(last.argument.start); }
+  }
+  return exprList
+};
+
+// Parses spread element.
+
+pp$2.parseSpread = function(refDestructuringErrors) {
+  var node = this.startNode();
+  this.next();
+  node.argument = this.parseMaybeAssign(false, refDestructuringErrors);
+  return this.finishNode(node, "SpreadElement")
+};
+
+pp$2.parseRestBinding = function() {
+  var node = this.startNode();
+  this.next();
+
+  // RestElement inside of a function parameter must be an identifier
+  if (this.options.ecmaVersion === 6 && this.type !== types.name)
+    { this.unexpected(); }
+
+  node.argument = this.parseBindingAtom();
+
+  return this.finishNode(node, "RestElement")
+};
+
+// Parses lvalue (assignable) atom.
+
+pp$2.parseBindingAtom = function() {
+  if (this.options.ecmaVersion >= 6) {
+    switch (this.type) {
+    case types.bracketL:
+      var node = this.startNode();
+      this.next();
+      node.elements = this.parseBindingList(types.bracketR, true, true);
+      return this.finishNode(node, "ArrayPattern")
+
+    case types.braceL:
+      return this.parseObj(true)
+    }
+  }
+  return this.parseIdent()
+};
+
+pp$2.parseBindingList = function(close, allowEmpty, allowTrailingComma) {
+  var elts = [], first = true;
+  while (!this.eat(close)) {
+    if (first) { first = false; }
+    else { this.expect(types.comma); }
+    if (allowEmpty && this.type === types.comma) {
+      elts.push(null);
+    } else if (allowTrailingComma && this.afterTrailingComma(close)) {
+      break
+    } else if (this.type === types.ellipsis) {
+      var rest = this.parseRestBinding();
+      this.parseBindingListItem(rest);
+      elts.push(rest);
+      if (this.type === types.comma) { this.raise(this.start, "Comma is not permitted after the rest element"); }
+      this.expect(close);
+      break
+    } else {
+      var elem = this.parseMaybeDefault(this.start, this.startLoc);
+      this.parseBindingListItem(elem);
+      elts.push(elem);
+    }
+  }
+  return elts
+};
+
+pp$2.parseBindingListItem = function(param) {
+  return param
+};
+
+// Parses assignment pattern around given atom if possible.
+
+pp$2.parseMaybeDefault = function(startPos, startLoc, left) {
+  left = left || this.parseBindingAtom();
+  if (this.options.ecmaVersion < 6 || !this.eat(types.eq)) { return left }
+  var node = this.startNodeAt(startPos, startLoc);
+  node.left = left;
+  node.right = this.parseMaybeAssign();
+  return this.finishNode(node, "AssignmentPattern")
+};
+
+// The following three functions all verify that a node is an lvalue —
+// something that can be bound, or assigned to. In order to do so, they perform
+// a variety of checks:
+//
+// - Check that none of the bound/assigned-to identifiers are reserved words.
+// - Record name declarations for bindings in the appropriate scope.
+// - Check duplicate argument names, if checkClashes is set.
+//
+// If a complex binding pattern is encountered (e.g., object and array
+// destructuring), the entire pattern is recursively checked.
+//
+// There are three versions of checkLVal*() appropriate for different
+// circumstances:
+//
+// - checkLValSimple() shall be used if the syntactic construct supports
+//   nothing other than identifiers and member expressions. Parenthesized
+//   expressions are also correctly handled. This is generally appropriate for
+//   constructs for which the spec says
+//
+//   > It is a Syntax Error if AssignmentTargetType of [the production] is not
+//   > simple.
+//
+//   It is also appropriate for checking if an identifier is valid and not
+//   defined elsewhere, like import declarations or function/class identifiers.
+//
+//   Examples where this is used include:
+//     a += …;
+//     import a from '…';
+//   where a is the node to be checked.
+//
+// - checkLValPattern() shall be used if the syntactic construct supports
+//   anything checkLValSimple() supports, as well as object and array
+//   destructuring patterns. This is generally appropriate for constructs for
+//   which the spec says
+//
+//   > It is a Syntax Error if [the production] is neither an ObjectLiteral nor
+//   > an ArrayLiteral and AssignmentTargetType of [the production] is not
+//   > simple.
+//
+//   Examples where this is used include:
+//     (a = …);
+//     const a = …;
+//     try { … } catch (a) { … }
+//   where a is the node to be checked.
+//
+// - checkLValInnerPattern() shall be used if the syntactic construct supports
+//   anything checkLValPattern() supports, as well as default assignment
+//   patterns, rest elements, and other constructs that may appear within an
+//   object or array destructuring pattern.
+//
+//   As a special case, function parameters also use checkLValInnerPattern(),
+//   as they also support defaults and rest constructs.
+//
+// These functions deliberately support both assignment and binding constructs,
+// as the logic for both is exceedingly similar. If the node is the target of
+// an assignment, then bindingType should be set to BIND_NONE. Otherwise, it
+// should be set to the appropriate BIND_* constant, like BIND_VAR or
+// BIND_LEXICAL.
+//
+// If the function is called with a non-BIND_NONE bindingType, then
+// additionally a checkClashes object may be specified to allow checking for
+// duplicate argument names. checkClashes is ignored if the provided construct
+// is an assignment (i.e., bindingType is BIND_NONE).
+
+pp$2.checkLValSimple = function(expr, bindingType, checkClashes) {
+  if ( bindingType === void 0 ) bindingType = BIND_NONE;
+
+  var isBind = bindingType !== BIND_NONE;
+
+  switch (expr.type) {
+  case "Identifier":
+    if (this.strict && this.reservedWordsStrictBind.test(expr.name))
+      { this.raiseRecoverable(expr.start, (isBind ? "Binding " : "Assigning to ") + expr.name + " in strict mode"); }
+    if (isBind) {
+      if (bindingType === BIND_LEXICAL && expr.name === "let")
+        { this.raiseRecoverable(expr.start, "let is disallowed as a lexically bound name"); }
+      if (checkClashes) {
+        if (has(checkClashes, expr.name))
+          { this.raiseRecoverable(expr.start, "Argument name clash"); }
+        checkClashes[expr.name] = true;
+      }
+      if (bindingType !== BIND_OUTSIDE) { this.declareName(expr.name, bindingType, expr.start); }
+    }
+    break
+
+  case "ChainExpression":
+    this.raiseRecoverable(expr.start, "Optional chaining cannot appear in left-hand side");
+    break
+
+  case "MemberExpression":
+    if (isBind) { this.raiseRecoverable(expr.start, "Binding member expression"); }
+    break
+
+  case "ParenthesizedExpression":
+    if (isBind) { this.raiseRecoverable(expr.start, "Binding parenthesized expression"); }
+    return this.checkLValSimple(expr.expression, bindingType, checkClashes)
+
+  default:
+    this.raise(expr.start, (isBind ? "Binding" : "Assigning to") + " rvalue");
+  }
+};
+
+pp$2.checkLValPattern = function(expr, bindingType, checkClashes) {
+  if ( bindingType === void 0 ) bindingType = BIND_NONE;
+
+  switch (expr.type) {
+  case "ObjectPattern":
+    for (var i = 0, list = expr.properties; i < list.length; i += 1) {
+      var prop = list[i];
+
+    this.checkLValInnerPattern(prop, bindingType, checkClashes);
+    }
+    break
+
+  case "ArrayPattern":
+    for (var i$1 = 0, list$1 = expr.elements; i$1 < list$1.length; i$1 += 1) {
+      var elem = list$1[i$1];
+
+    if (elem) { this.checkLValInnerPattern(elem, bindingType, checkClashes); }
+    }
+    break
+
+  default:
+    this.checkLValSimple(expr, bindingType, checkClashes);
+  }
+};
+
+pp$2.checkLValInnerPattern = function(expr, bindingType, checkClashes) {
+  if ( bindingType === void 0 ) bindingType = BIND_NONE;
+
+  switch (expr.type) {
+  case "Property":
+    // AssignmentProperty has type === "Property"
+    this.checkLValInnerPattern(expr.value, bindingType, checkClashes);
+    break
+
+  case "AssignmentPattern":
+    this.checkLValPattern(expr.left, bindingType, checkClashes);
+    break
+
+  case "RestElement":
+    this.checkLValPattern(expr.argument, bindingType, checkClashes);
+    break
+
+  default:
+    this.checkLValPattern(expr, bindingType, checkClashes);
+  }
+};
+
+// A recursive descent parser operates by defining functions for all
+
+var pp$3 = Parser.prototype;
+
+// Check if property name clashes with already added.
+// Object/class getters and setters are not allowed to clash —
+// either with each other or with an init property — and in
+// strict mode, init properties are also not allowed to be repeated.
+
+pp$3.checkPropClash = function(prop, propHash, refDestructuringErrors) {
+  if (this.options.ecmaVersion >= 9 && prop.type === "SpreadElement")
+    { return }
+  if (this.options.ecmaVersion >= 6 && (prop.computed || prop.method || prop.shorthand))
+    { return }
+  var key = prop.key;
+  var name;
+  switch (key.type) {
+  case "Identifier": name = key.name; break
+  case "Literal": name = String(key.value); break
+  default: return
+  }
+  var kind = prop.kind;
+  if (this.options.ecmaVersion >= 6) {
+    if (name === "__proto__" && kind === "init") {
+      if (propHash.proto) {
+        if (refDestructuringErrors) {
+          if (refDestructuringErrors.doubleProto < 0)
+            { refDestructuringErrors.doubleProto = key.start; }
+          // Backwards-compat kludge. Can be removed in version 6.0
+        } else { this.raiseRecoverable(key.start, "Redefinition of __proto__ property"); }
+      }
+      propHash.proto = true;
+    }
+    return
+  }
+  name = "$" + name;
+  var other = propHash[name];
+  if (other) {
+    var redefinition;
+    if (kind === "init") {
+      redefinition = this.strict && other.init || other.get || other.set;
+    } else {
+      redefinition = other.init || other[kind];
+    }
+    if (redefinition)
+      { this.raiseRecoverable(key.start, "Redefinition of property"); }
+  } else {
+    other = propHash[name] = {
+      init: false,
+      get: false,
+      set: false
+    };
+  }
+  other[kind] = true;
+};
+
+// ### Expression parsing
+
+// These nest, from the most general expression type at the top to
+// 'atomic', nondivisible expression types at the bottom. Most of
+// the functions will simply let the function(s) below them parse,
+// and, *if* the syntactic construct they handle is present, wrap
+// the AST node that the inner parser gave them in another node.
+
+// Parse a full expression. The optional arguments are used to
+// forbid the `in` operator (in for loops initalization expressions)
+// and provide reference for storing '=' operator inside shorthand
+// property assignment in contexts where both object expression
+// and object pattern might appear (so it's possible to raise
+// delayed syntax error at correct position).
+
+pp$3.parseExpression = function(noIn, refDestructuringErrors) {
+  var startPos = this.start, startLoc = this.startLoc;
+  var expr = this.parseMaybeAssign(noIn, refDestructuringErrors);
+  if (this.type === types.comma) {
+    var node = this.startNodeAt(startPos, startLoc);
+    node.expressions = [expr];
+    while (this.eat(types.comma)) { node.expressions.push(this.parseMaybeAssign(noIn, refDestructuringErrors)); }
+    return this.finishNode(node, "SequenceExpression")
+  }
+  return expr
+};
+
+// Parse an assignment expression. This includes applications of
+// operators like `+=`.
+
+pp$3.parseMaybeAssign = function(noIn, refDestructuringErrors, afterLeftParse) {
+  if (this.isContextual("yield")) {
+    if (this.inGenerator) { return this.parseYield(noIn) }
+    // The tokenizer will assume an expression is allowed after
+    // `yield`, but this isn't that kind of yield
+    else { this.exprAllowed = false; }
+  }
+
+  var ownDestructuringErrors = false, oldParenAssign = -1, oldTrailingComma = -1;
+  if (refDestructuringErrors) {
+    oldParenAssign = refDestructuringErrors.parenthesizedAssign;
+    oldTrailingComma = refDestructuringErrors.trailingComma;
+    refDestructuringErrors.parenthesizedAssign = refDestructuringErrors.trailingComma = -1;
+  } else {
+    refDestructuringErrors = new DestructuringErrors;
+    ownDestructuringErrors = true;
+  }
+
+  var startPos = this.start, startLoc = this.startLoc;
+  if (this.type === types.parenL || this.type === types.name)
+    { this.potentialArrowAt = this.start; }
+  var left = this.parseMaybeConditional(noIn, refDestructuringErrors);
+  if (afterLeftParse) { left = afterLeftParse.call(this, left, startPos, startLoc); }
+  if (this.type.isAssign) {
+    var node = this.startNodeAt(startPos, startLoc);
+    node.operator = this.value;
+    if (this.type === types.eq)
+      { left = this.toAssignable(left, false, refDestructuringErrors); }
+    if (!ownDestructuringErrors) {
+      refDestructuringErrors.parenthesizedAssign = refDestructuringErrors.trailingComma = refDestructuringErrors.doubleProto = -1;
+    }
+    if (refDestructuringErrors.shorthandAssign >= left.start)
+      { refDestructuringErrors.shorthandAssign = -1; } // reset because shorthand default was used correctly
+    if (this.type === types.eq)
+      { this.checkLValPattern(left); }
+    else
+      { this.checkLValSimple(left); }
+    node.left = left;
+    this.next();
+    node.right = this.parseMaybeAssign(noIn);
+    return this.finishNode(node, "AssignmentExpression")
+  } else {
+    if (ownDestructuringErrors) { this.checkExpressionErrors(refDestructuringErrors, true); }
+  }
+  if (oldParenAssign > -1) { refDestructuringErrors.parenthesizedAssign = oldParenAssign; }
+  if (oldTrailingComma > -1) { refDestructuringErrors.trailingComma = oldTrailingComma; }
+  return left
+};
+
+// Parse a ternary conditional (`?:`) operator.
+
+pp$3.parseMaybeConditional = function(noIn, refDestructuringErrors) {
+  var startPos = this.start, startLoc = this.startLoc;
+  var expr = this.parseExprOps(noIn, refDestructuringErrors);
+  if (this.checkExpressionErrors(refDestructuringErrors)) { return expr }
+  if (this.eat(types.question)) {
+    var node = this.startNodeAt(startPos, startLoc);
+    node.test = expr;
+    node.consequent = this.parseMaybeAssign();
+    this.expect(types.colon);
+    node.alternate = this.parseMaybeAssign(noIn);
+    return this.finishNode(node, "ConditionalExpression")
+  }
+  return expr
+};
+
+// Start the precedence parser.
+
+pp$3.parseExprOps = function(noIn, refDestructuringErrors) {
+  var startPos = this.start, startLoc = this.startLoc;
+  var expr = this.parseMaybeUnary(refDestructuringErrors, false);
+  if (this.checkExpressionErrors(refDestructuringErrors)) { return expr }
+  return expr.start === startPos && expr.type === "ArrowFunctionExpression" ? expr : this.parseExprOp(expr, startPos, startLoc, -1, noIn)
+};
+
+// Parse binary operators with the operator precedence parsing
+// algorithm. `left` is the left-hand side of the operator.
+// `minPrec` provides context that allows the function to stop and
+// defer further parser to one of its callers when it encounters an
+// operator that has a lower precedence than the set it is parsing.
+
+pp$3.parseExprOp = function(left, leftStartPos, leftStartLoc, minPrec, noIn) {
+  var prec = this.type.binop;
+  if (prec != null && (!noIn || this.type !== types._in)) {
+    if (prec > minPrec) {
+      var logical = this.type === types.logicalOR || this.type === types.logicalAND;
+      var coalesce = this.type === types.coalesce;
+      if (coalesce) {
+        // Handle the precedence of `tt.coalesce` as equal to the range of logical expressions.
+        // In other words, `node.right` shouldn't contain logical expressions in order to check the mixed error.
+        prec = types.logicalAND.binop;
+      }
+      var op = this.value;
+      this.next();
+      var startPos = this.start, startLoc = this.startLoc;
+      var right = this.parseExprOp(this.parseMaybeUnary(null, false), startPos, startLoc, prec, noIn);
+      var node = this.buildBinary(leftStartPos, leftStartLoc, left, right, op, logical || coalesce);
+      if ((logical && this.type === types.coalesce) || (coalesce && (this.type === types.logicalOR || this.type === types.logicalAND))) {
+        this.raiseRecoverable(this.start, "Logical expressions and coalesce expressions cannot be mixed. Wrap either by parentheses");
+      }
+      return this.parseExprOp(node, leftStartPos, leftStartLoc, minPrec, noIn)
+    }
+  }
+  return left
+};
+
+pp$3.buildBinary = function(startPos, startLoc, left, right, op, logical) {
+  var node = this.startNodeAt(startPos, startLoc);
+  node.left = left;
+  node.operator = op;
+  node.right = right;
+  return this.finishNode(node, logical ? "LogicalExpression" : "BinaryExpression")
+};
+
+// Parse unary operators, both prefix and postfix.
+
+pp$3.parseMaybeUnary = function(refDestructuringErrors, sawUnary) {
+  var startPos = this.start, startLoc = this.startLoc, expr;
+  if (this.isContextual("await") && (this.inAsync || (!this.inFunction && this.options.allowAwaitOutsideFunction))) {
+    expr = this.parseAwait();
+    sawUnary = true;
+  } else if (this.type.prefix) {
+    var node = this.startNode(), update = this.type === types.incDec;
+    node.operator = this.value;
+    node.prefix = true;
+    this.next();
+    node.argument = this.parseMaybeUnary(null, true);
+    this.checkExpressionErrors(refDestructuringErrors, true);
+    if (update) { this.checkLValSimple(node.argument); }
+    else if (this.strict && node.operator === "delete" &&
+             node.argument.type === "Identifier")
+      { this.raiseRecoverable(node.start, "Deleting local variable in strict mode"); }
+    else { sawUnary = true; }
+    expr = this.finishNode(node, update ? "UpdateExpression" : "UnaryExpression");
+  } else {
+    expr = this.parseExprSubscripts(refDestructuringErrors);
+    if (this.checkExpressionErrors(refDestructuringErrors)) { return expr }
+    while (this.type.postfix && !this.canInsertSemicolon()) {
+      var node$1 = this.startNodeAt(startPos, startLoc);
+      node$1.operator = this.value;
+      node$1.prefix = false;
+      node$1.argument = expr;
+      this.checkLValSimple(expr);
+      this.next();
+      expr = this.finishNode(node$1, "UpdateExpression");
+    }
+  }
+
+  if (!sawUnary && this.eat(types.starstar))
+    { return this.buildBinary(startPos, startLoc, expr, this.parseMaybeUnary(null, false), "**", false) }
+  else
+    { return expr }
+};
+
+// Parse call, dot, and `[]`-subscript expressions.
+
+pp$3.parseExprSubscripts = function(refDestructuringErrors) {
+  var startPos = this.start, startLoc = this.startLoc;
+  var expr = this.parseExprAtom(refDestructuringErrors);
+  if (expr.type === "ArrowFunctionExpression" && this.input.slice(this.lastTokStart, this.lastTokEnd) !== ")")
+    { return expr }
+  var result = this.parseSubscripts(expr, startPos, startLoc);
+  if (refDestructuringErrors && result.type === "MemberExpression") {
+    if (refDestructuringErrors.parenthesizedAssign >= result.start) { refDestructuringErrors.parenthesizedAssign = -1; }
+    if (refDestructuringErrors.parenthesizedBind >= result.start) { refDestructuringErrors.parenthesizedBind = -1; }
+  }
+  return result
+};
+
+pp$3.parseSubscripts = function(base, startPos, startLoc, noCalls) {
+  var maybeAsyncArrow = this.options.ecmaVersion >= 8 && base.type === "Identifier" && base.name === "async" &&
+      this.lastTokEnd === base.end && !this.canInsertSemicolon() && base.end - base.start === 5 &&
+      this.potentialArrowAt === base.start;
+  var optionalChained = false;
+
+  while (true) {
+    var element = this.parseSubscript(base, startPos, startLoc, noCalls, maybeAsyncArrow, optionalChained);
+
+    if (element.optional) { optionalChained = true; }
+    if (element === base || element.type === "ArrowFunctionExpression") {
+      if (optionalChained) {
+        var chainNode = this.startNodeAt(startPos, startLoc);
+        chainNode.expression = element;
+        element = this.finishNode(chainNode, "ChainExpression");
+      }
+      return element
+    }
+
+    base = element;
+  }
+};
+
+pp$3.parseSubscript = function(base, startPos, startLoc, noCalls, maybeAsyncArrow, optionalChained) {
+  var optionalSupported = this.options.ecmaVersion >= 11;
+  var optional = optionalSupported && this.eat(types.questionDot);
+  if (noCalls && optional) { this.raise(this.lastTokStart, "Optional chaining cannot appear in the callee of new expressions"); }
+
+  var computed = this.eat(types.bracketL);
+  if (computed || (optional && this.type !== types.parenL && this.type !== types.backQuote) || this.eat(types.dot)) {
+    var node = this.startNodeAt(startPos, startLoc);
+    node.object = base;
+    node.property = computed ? this.parseExpression() : this.parseIdent(this.options.allowReserved !== "never");
+    node.computed = !!computed;
+    if (computed) { this.expect(types.bracketR); }
+    if (optionalSupported) {
+      node.optional = optional;
+    }
+    base = this.finishNode(node, "MemberExpression");
+  } else if (!noCalls && this.eat(types.parenL)) {
+    var refDestructuringErrors = new DestructuringErrors, oldYieldPos = this.yieldPos, oldAwaitPos = this.awaitPos, oldAwaitIdentPos = this.awaitIdentPos;
+    this.yieldPos = 0;
+    this.awaitPos = 0;
+    this.awaitIdentPos = 0;
+    var exprList = this.parseExprList(types.parenR, this.options.ecmaVersion >= 8, false, refDestructuringErrors);
+    if (maybeAsyncArrow && !optional && !this.canInsertSemicolon() && this.eat(types.arrow)) {
+      this.checkPatternErrors(refDestructuringErrors, false);
+      this.checkYieldAwaitInDefaultParams();
+      if (this.awaitIdentPos > 0)
+        { this.raise(this.awaitIdentPos, "Cannot use 'await' as identifier inside an async function"); }
+      this.yieldPos = oldYieldPos;
+      this.awaitPos = oldAwaitPos;
+      this.awaitIdentPos = oldAwaitIdentPos;
+      return this.parseArrowExpression(this.startNodeAt(startPos, startLoc), exprList, true)
+    }
+    this.checkExpressionErrors(refDestructuringErrors, true);
+    this.yieldPos = oldYieldPos || this.yieldPos;
+    this.awaitPos = oldAwaitPos || this.awaitPos;
+    this.awaitIdentPos = oldAwaitIdentPos || this.awaitIdentPos;
+    var node$1 = this.startNodeAt(startPos, startLoc);
+    node$1.callee = base;
+    node$1.arguments = exprList;
+    if (optionalSupported) {
+      node$1.optional = optional;
+    }
+    base = this.finishNode(node$1, "CallExpression");
+  } else if (this.type === types.backQuote) {
+    if (optional || optionalChained) {
+      this.raise(this.start, "Optional chaining cannot appear in the tag of tagged template expressions");
+    }
+    var node$2 = this.startNodeAt(startPos, startLoc);
+    node$2.tag = base;
+    node$2.quasi = this.parseTemplate({isTagged: true});
+    base = this.finishNode(node$2, "TaggedTemplateExpression");
+  }
+  return base
+};
+
+// Parse an atomic expression — either a single token that is an
+// expression, an expression started by a keyword like `function` or
+// `new`, or an expression wrapped in punctuation like `()`, `[]`,
+// or `{}`.
+
+pp$3.parseExprAtom = function(refDestructuringErrors) {
+  // If a division operator appears in an expression position, the
+  // tokenizer got confused, and we force it to read a regexp instead.
+  if (this.type === types.slash) { this.readRegexp(); }
+
+  var node, canBeArrow = this.potentialArrowAt === this.start;
+  switch (this.type) {
+  case types._super:
+    if (!this.allowSuper)
+      { this.raise(this.start, "'super' keyword outside a method"); }
+    node = this.startNode();
+    this.next();
+    if (this.type === types.parenL && !this.allowDirectSuper)
+      { this.raise(node.start, "super() call outside constructor of a subclass"); }
+    // The `super` keyword can appear at below:
+    // SuperProperty:
+    //     super [ Expression ]
+    //     super . IdentifierName
+    // SuperCall:
+    //     super ( Arguments )
+    if (this.type !== types.dot && this.type !== types.bracketL && this.type !== types.parenL)
+      { this.unexpected(); }
+    return this.finishNode(node, "Super")
+
+  case types._this:
+    node = this.startNode();
+    this.next();
+    return this.finishNode(node, "ThisExpression")
+
+  case types.name:
+    var startPos = this.start, startLoc = this.startLoc, containsEsc = this.containsEsc;
+    var id = this.parseIdent(false);
+    if (this.options.ecmaVersion >= 8 && !containsEsc && id.name === "async" && !this.canInsertSemicolon() && this.eat(types._function))
+      { return this.parseFunction(this.startNodeAt(startPos, startLoc), 0, false, true) }
+    if (canBeArrow && !this.canInsertSemicolon()) {
+      if (this.eat(types.arrow))
+        { return this.parseArrowExpression(this.startNodeAt(startPos, startLoc), [id], false) }
+      if (this.options.ecmaVersion >= 8 && id.name === "async" && this.type === types.name && !containsEsc) {
+        id = this.parseIdent(false);
+        if (this.canInsertSemicolon() || !this.eat(types.arrow))
+          { this.unexpected(); }
+        return this.parseArrowExpression(this.startNodeAt(startPos, startLoc), [id], true)
+      }
+    }
+    return id
+
+  case types.regexp:
+    var value = this.value;
+    node = this.parseLiteral(value.value);
+    node.regex = {pattern: value.pattern, flags: value.flags};
+    return node
+
+  case types.num: case types.string:
+    return this.parseLiteral(this.value)
+
+  case types._null: case types._true: case types._false:
+    node = this.startNode();
+    node.value = this.type === types._null ? null : this.type === types._true;
+    node.raw = this.type.keyword;
+    this.next();
+    return this.finishNode(node, "Literal")
+
+  case types.parenL:
+    var start = this.start, expr = this.parseParenAndDistinguishExpression(canBeArrow);
+    if (refDestructuringErrors) {
+      if (refDestructuringErrors.parenthesizedAssign < 0 && !this.isSimpleAssignTarget(expr))
+        { refDestructuringErrors.parenthesizedAssign = start; }
+      if (refDestructuringErrors.parenthesizedBind < 0)
+        { refDestructuringErrors.parenthesizedBind = start; }
+    }
+    return expr
+
+  case types.bracketL:
+    node = this.startNode();
+    this.next();
+    node.elements = this.parseExprList(types.bracketR, true, true, refDestructuringErrors);
+    return this.finishNode(node, "ArrayExpression")
+
+  case types.braceL:
+    return this.parseObj(false, refDestructuringErrors)
+
+  case types._function:
+    node = this.startNode();
+    this.next();
+    return this.parseFunction(node, 0)
+
+  case types._class:
+    return this.parseClass(this.startNode(), false)
+
+  case types._new:
+    return this.parseNew()
+
+  case types.backQuote:
+    return this.parseTemplate()
+
+  case types._import:
+    if (this.options.ecmaVersion >= 11) {
+      return this.parseExprImport()
+    } else {
+      return this.unexpected()
+    }
+
+  default:
+    this.unexpected();
+  }
+};
+
+pp$3.parseExprImport = function() {
+  var node = this.startNode();
+
+  // Consume `import` as an identifier for `import.meta`.
+  // Because `this.parseIdent(true)` doesn't check escape sequences, it needs the check of `this.containsEsc`.
+  if (this.containsEsc) { this.raiseRecoverable(this.start, "Escape sequence in keyword import"); }
+  var meta = this.parseIdent(true);
+
+  switch (this.type) {
+  case types.parenL:
+    return this.parseDynamicImport(node)
+  case types.dot:
+    node.meta = meta;
+    return this.parseImportMeta(node)
+  default:
+    this.unexpected();
+  }
+};
+
+pp$3.parseDynamicImport = function(node) {
+  this.next(); // skip `(`
+
+  // Parse node.source.
+  node.source = this.parseMaybeAssign();
+
+  // Verify ending.
+  if (!this.eat(types.parenR)) {
+    var errorPos = this.start;
+    if (this.eat(types.comma) && this.eat(types.parenR)) {
+      this.raiseRecoverable(errorPos, "Trailing comma is not allowed in import()");
+    } else {
+      this.unexpected(errorPos);
+    }
+  }
+
+  return this.finishNode(node, "ImportExpression")
+};
+
+pp$3.parseImportMeta = function(node) {
+  this.next(); // skip `.`
+
+  var containsEsc = this.containsEsc;
+  node.property = this.parseIdent(true);
+
+  if (node.property.name !== "meta")
+    { this.raiseRecoverable(node.property.start, "The only valid meta property for import is 'import.meta'"); }
+  if (containsEsc)
+    { this.raiseRecoverable(node.start, "'import.meta' must not contain escaped characters"); }
+  if (this.options.sourceType !== "module")
+    { this.raiseRecoverable(node.start, "Cannot use 'import.meta' outside a module"); }
+
+  return this.finishNode(node, "MetaProperty")
+};
+
+pp$3.parseLiteral = function(value) {
+  var node = this.startNode();
+  node.value = value;
+  node.raw = this.input.slice(this.start, this.end);
+  if (node.raw.charCodeAt(node.raw.length - 1) === 110) { node.bigint = node.raw.slice(0, -1).replace(/_/g, ""); }
+  this.next();
+  return this.finishNode(node, "Literal")
+};
+
+pp$3.parseParenExpression = function() {
+  this.expect(types.parenL);
+  var val = this.parseExpression();
+  this.expect(types.parenR);
+  return val
+};
+
+pp$3.parseParenAndDistinguishExpression = function(canBeArrow) {
+  var startPos = this.start, startLoc = this.startLoc, val, allowTrailingComma = this.options.ecmaVersion >= 8;
+  if (this.options.ecmaVersion >= 6) {
+    this.next();
+
+    var innerStartPos = this.start, innerStartLoc = this.startLoc;
+    var exprList = [], first = true, lastIsComma = false;
+    var refDestructuringErrors = new DestructuringErrors, oldYieldPos = this.yieldPos, oldAwaitPos = this.awaitPos, spreadStart;
+    this.yieldPos = 0;
+    this.awaitPos = 0;
+    // Do not save awaitIdentPos to allow checking awaits nested in parameters
+    while (this.type !== types.parenR) {
+      first ? first = false : this.expect(types.comma);
+      if (allowTrailingComma && this.afterTrailingComma(types.parenR, true)) {
+        lastIsComma = true;
+        break
+      } else if (this.type === types.ellipsis) {
+        spreadStart = this.start;
+        exprList.push(this.parseParenItem(this.parseRestBinding()));
+        if (this.type === types.comma) { this.raise(this.start, "Comma is not permitted after the rest element"); }
+        break
+      } else {
+        exprList.push(this.parseMaybeAssign(false, refDestructuringErrors, this.parseParenItem));
+      }
+    }
+    var innerEndPos = this.start, innerEndLoc = this.startLoc;
+    this.expect(types.parenR);
+
+    if (canBeArrow && !this.canInsertSemicolon() && this.eat(types.arrow)) {
+      this.checkPatternErrors(refDestructuringErrors, false);
+      this.checkYieldAwaitInDefaultParams();
+      this.yieldPos = oldYieldPos;
+      this.awaitPos = oldAwaitPos;
+      return this.parseParenArrowList(startPos, startLoc, exprList)
+    }
+
+    if (!exprList.length || lastIsComma) { this.unexpected(this.lastTokStart); }
+    if (spreadStart) { this.unexpected(spreadStart); }
+    this.checkExpressionErrors(refDestructuringErrors, true);
+    this.yieldPos = oldYieldPos || this.yieldPos;
+    this.awaitPos = oldAwaitPos || this.awaitPos;
+
+    if (exprList.length > 1) {
+      val = this.startNodeAt(innerStartPos, innerStartLoc);
+      val.expressions = exprList;
+      this.finishNodeAt(val, "SequenceExpression", innerEndPos, innerEndLoc);
+    } else {
+      val = exprList[0];
+    }
+  } else {
+    val = this.parseParenExpression();
+  }
+
+  if (this.options.preserveParens) {
+    var par = this.startNodeAt(startPos, startLoc);
+    par.expression = val;
+    return this.finishNode(par, "ParenthesizedExpression")
+  } else {
+    return val
+  }
+};
+
+pp$3.parseParenItem = function(item) {
+  return item
+};
+
+pp$3.parseParenArrowList = function(startPos, startLoc, exprList) {
+  return this.parseArrowExpression(this.startNodeAt(startPos, startLoc), exprList)
+};
+
+// New's precedence is slightly tricky. It must allow its argument to
+// be a `[]` or dot subscript expression, but not a call — at least,
+// not without wrapping it in parentheses. Thus, it uses the noCalls
+// argument to parseSubscripts to prevent it from consuming the
+// argument list.
+
+var empty$1 = [];
+
+pp$3.parseNew = function() {
+  if (this.containsEsc) { this.raiseRecoverable(this.start, "Escape sequence in keyword new"); }
+  var node = this.startNode();
+  var meta = this.parseIdent(true);
+  if (this.options.ecmaVersion >= 6 && this.eat(types.dot)) {
+    node.meta = meta;
+    var containsEsc = this.containsEsc;
+    node.property = this.parseIdent(true);
+    if (node.property.name !== "target")
+      { this.raiseRecoverable(node.property.start, "The only valid meta property for new is 'new.target'"); }
+    if (containsEsc)
+      { this.raiseRecoverable(node.start, "'new.target' must not contain escaped characters"); }
+    if (!this.inNonArrowFunction)
+      { this.raiseRecoverable(node.start, "'new.target' can only be used in functions"); }
+    return this.finishNode(node, "MetaProperty")
+  }
+  var startPos = this.start, startLoc = this.startLoc, isImport = this.type === types._import;
+  node.callee = this.parseSubscripts(this.parseExprAtom(), startPos, startLoc, true);
+  if (isImport && node.callee.type === "ImportExpression") {
+    this.raise(startPos, "Cannot use new with import()");
+  }
+  if (this.eat(types.parenL)) { node.arguments = this.parseExprList(types.parenR, this.options.ecmaVersion >= 8, false); }
+  else { node.arguments = empty$1; }
+  return this.finishNode(node, "NewExpression")
+};
+
+// Parse template expression.
+
+pp$3.parseTemplateElement = function(ref) {
+  var isTagged = ref.isTagged;
+
+  var elem = this.startNode();
+  if (this.type === types.invalidTemplate) {
+    if (!isTagged) {
+      this.raiseRecoverable(this.start, "Bad escape sequence in untagged template literal");
+    }
+    elem.value = {
+      raw: this.value,
+      cooked: null
+    };
+  } else {
+    elem.value = {
+      raw: this.input.slice(this.start, this.end).replace(/\r\n?/g, "\n"),
+      cooked: this.value
+    };
+  }
+  this.next();
+  elem.tail = this.type === types.backQuote;
+  return this.finishNode(elem, "TemplateElement")
+};
+
+pp$3.parseTemplate = function(ref) {
+  if ( ref === void 0 ) ref = {};
+  var isTagged = ref.isTagged; if ( isTagged === void 0 ) isTagged = false;
+
+  var node = this.startNode();
+  this.next();
+  node.expressions = [];
+  var curElt = this.parseTemplateElement({isTagged: isTagged});
+  node.quasis = [curElt];
+  while (!curElt.tail) {
+    if (this.type === types.eof) { this.raise(this.pos, "Unterminated template literal"); }
+    this.expect(types.dollarBraceL);
+    node.expressions.push(this.parseExpression());
+    this.expect(types.braceR);
+    node.quasis.push(curElt = this.parseTemplateElement({isTagged: isTagged}));
+  }
+  this.next();
+  return this.finishNode(node, "TemplateLiteral")
+};
+
+pp$3.isAsyncProp = function(prop) {
+  return !prop.computed && prop.key.type === "Identifier" && prop.key.name === "async" &&
+    (this.type === types.name || this.type === types.num || this.type === types.string || this.type === types.bracketL || this.type.keyword || (this.options.ecmaVersion >= 9 && this.type === types.star)) &&
+    !lineBreak.test(this.input.slice(this.lastTokEnd, this.start))
+};
+
+// Parse an object literal or binding pattern.
+
+pp$3.parseObj = function(isPattern, refDestructuringErrors) {
+  var node = this.startNode(), first = true, propHash = {};
+  node.properties = [];
+  this.next();
+  while (!this.eat(types.braceR)) {
+    if (!first) {
+      this.expect(types.comma);
+      if (this.options.ecmaVersion >= 5 && this.afterTrailingComma(types.braceR)) { break }
+    } else { first = false; }
+
+    var prop = this.parseProperty(isPattern, refDestructuringErrors);
+    if (!isPattern) { this.checkPropClash(prop, propHash, refDestructuringErrors); }
+    node.properties.push(prop);
+  }
+  return this.finishNode(node, isPattern ? "ObjectPattern" : "ObjectExpression")
+};
+
+pp$3.parseProperty = function(isPattern, refDestructuringErrors) {
+  var prop = this.startNode(), isGenerator, isAsync, startPos, startLoc;
+  if (this.options.ecmaVersion >= 9 && this.eat(types.ellipsis)) {
+    if (isPattern) {
+      prop.argument = this.parseIdent(false);
+      if (this.type === types.comma) {
+        this.raise(this.start, "Comma is not permitted after the rest element");
+      }
+      return this.finishNode(prop, "RestElement")
+    }
+    // To disallow parenthesized identifier via `this.toAssignable()`.
+    if (this.type === types.parenL && refDestructuringErrors) {
+      if (refDestructuringErrors.parenthesizedAssign < 0) {
+        refDestructuringErrors.parenthesizedAssign = this.start;
+      }
+      if (refDestructuringErrors.parenthesizedBind < 0) {
+        refDestructuringErrors.parenthesizedBind = this.start;
+      }
+    }
+    // Parse argument.
+    prop.argument = this.parseMaybeAssign(false, refDestructuringErrors);
+    // To disallow trailing comma via `this.toAssignable()`.
+    if (this.type === types.comma && refDestructuringErrors && refDestructuringErrors.trailingComma < 0) {
+      refDestructuringErrors.trailingComma = this.start;
+    }
+    // Finish
+    return this.finishNode(prop, "SpreadElement")
+  }
+  if (this.options.ecmaVersion >= 6) {
+    prop.method = false;
+    prop.shorthand = false;
+    if (isPattern || refDestructuringErrors) {
+      startPos = this.start;
+      startLoc = this.startLoc;
+    }
+    if (!isPattern)
+      { isGenerator = this.eat(types.star); }
+  }
+  var containsEsc = this.containsEsc;
+  this.parsePropertyName(prop);
+  if (!isPattern && !containsEsc && this.options.ecmaVersion >= 8 && !isGenerator && this.isAsyncProp(prop)) {
+    isAsync = true;
+    isGenerator = this.options.ecmaVersion >= 9 && this.eat(types.star);
+    this.parsePropertyName(prop, refDestructuringErrors);
+  } else {
+    isAsync = false;
+  }
+  this.parsePropertyValue(prop, isPattern, isGenerator, isAsync, startPos, startLoc, refDestructuringErrors, containsEsc);
+  return this.finishNode(prop, "Property")
+};
+
+pp$3.parsePropertyValue = function(prop, isPattern, isGenerator, isAsync, startPos, startLoc, refDestructuringErrors, containsEsc) {
+  if ((isGenerator || isAsync) && this.type === types.colon)
+    { this.unexpected(); }
+
+  if (this.eat(types.colon)) {
+    prop.value = isPattern ? this.parseMaybeDefault(this.start, this.startLoc) : this.parseMaybeAssign(false, refDestructuringErrors);
+    prop.kind = "init";
+  } else if (this.options.ecmaVersion >= 6 && this.type === types.parenL) {
+    if (isPattern) { this.unexpected(); }
+    prop.kind = "init";
+    prop.method = true;
+    prop.value = this.parseMethod(isGenerator, isAsync);
+  } else if (!isPattern && !containsEsc &&
+             this.options.ecmaVersion >= 5 && !prop.computed && prop.key.type === "Identifier" &&
+             (prop.key.name === "get" || prop.key.name === "set") &&
+             (this.type !== types.comma && this.type !== types.braceR && this.type !== types.eq)) {
+    if (isGenerator || isAsync) { this.unexpected(); }
+    prop.kind = prop.key.name;
+    this.parsePropertyName(prop);
+    prop.value = this.parseMethod(false);
+    var paramCount = prop.kind === "get" ? 0 : 1;
+    if (prop.value.params.length !== paramCount) {
+      var start = prop.value.start;
+      if (prop.kind === "get")
+        { this.raiseRecoverable(start, "getter should have no params"); }
+      else
+        { this.raiseRecoverable(start, "setter should have exactly one param"); }
+    } else {
+      if (prop.kind === "set" && prop.value.params[0].type === "RestElement")
+        { this.raiseRecoverable(prop.value.params[0].start, "Setter cannot use rest params"); }
+    }
+  } else if (this.options.ecmaVersion >= 6 && !prop.computed && prop.key.type === "Identifier") {
+    if (isGenerator || isAsync) { this.unexpected(); }
+    this.checkUnreserved(prop.key);
+    if (prop.key.name === "await" && !this.awaitIdentPos)
+      { this.awaitIdentPos = startPos; }
+    prop.kind = "init";
+    if (isPattern) {
+      prop.value = this.parseMaybeDefault(startPos, startLoc, this.copyNode(prop.key));
+    } else if (this.type === types.eq && refDestructuringErrors) {
+      if (refDestructuringErrors.shorthandAssign < 0)
+        { refDestructuringErrors.shorthandAssign = this.start; }
+      prop.value = this.parseMaybeDefault(startPos, startLoc, this.copyNode(prop.key));
+    } else {
+      prop.value = this.copyNode(prop.key);
+    }
+    prop.shorthand = true;
+  } else { this.unexpected(); }
+};
+
+pp$3.parsePropertyName = function(prop) {
+  if (this.options.ecmaVersion >= 6) {
+    if (this.eat(types.bracketL)) {
+      prop.computed = true;
+      prop.key = this.parseMaybeAssign();
+      this.expect(types.bracketR);
+      return prop.key
+    } else {
+      prop.computed = false;
+    }
+  }
+  return prop.key = this.type === types.num || this.type === types.string ? this.parseExprAtom() : this.parseIdent(this.options.allowReserved !== "never")
+};
+
+// Initialize empty function node.
+
+pp$3.initFunction = function(node) {
+  node.id = null;
+  if (this.options.ecmaVersion >= 6) { node.generator = node.expression = false; }
+  if (this.options.ecmaVersion >= 8) { node.async = false; }
+};
+
+// Parse object or class method.
+
+pp$3.parseMethod = function(isGenerator, isAsync, allowDirectSuper) {
+  var node = this.startNode(), oldYieldPos = this.yieldPos, oldAwaitPos = this.awaitPos, oldAwaitIdentPos = this.awaitIdentPos;
+
+  this.initFunction(node);
+  if (this.options.ecmaVersion >= 6)
+    { node.generator = isGenerator; }
+  if (this.options.ecmaVersion >= 8)
+    { node.async = !!isAsync; }
+
+  this.yieldPos = 0;
+  this.awaitPos = 0;
+  this.awaitIdentPos = 0;
+  this.enterScope(functionFlags(isAsync, node.generator) | SCOPE_SUPER | (allowDirectSuper ? SCOPE_DIRECT_SUPER : 0));
+
+  this.expect(types.parenL);
+  node.params = this.parseBindingList(types.parenR, false, this.options.ecmaVersion >= 8);
+  this.checkYieldAwaitInDefaultParams();
+  this.parseFunctionBody(node, false, true);
+
+  this.yieldPos = oldYieldPos;
+  this.awaitPos = oldAwaitPos;
+  this.awaitIdentPos = oldAwaitIdentPos;
+  return this.finishNode(node, "FunctionExpression")
+};
+
+// Parse arrow function expression with given parameters.
+
+pp$3.parseArrowExpression = function(node, params, isAsync) {
+  var oldYieldPos = this.yieldPos, oldAwaitPos = this.awaitPos, oldAwaitIdentPos = this.awaitIdentPos;
+
+  this.enterScope(functionFlags(isAsync, false) | SCOPE_ARROW);
+  this.initFunction(node);
+  if (this.options.ecmaVersion >= 8) { node.async = !!isAsync; }
+
+  this.yieldPos = 0;
+  this.awaitPos = 0;
+  this.awaitIdentPos = 0;
+
+  node.params = this.toAssignableList(params, true);
+  this.parseFunctionBody(node, true, false);
+
+  this.yieldPos = oldYieldPos;
+  this.awaitPos = oldAwaitPos;
+  this.awaitIdentPos = oldAwaitIdentPos;
+  return this.finishNode(node, "ArrowFunctionExpression")
+};
+
+// Parse function body and check parameters.
+
+pp$3.parseFunctionBody = function(node, isArrowFunction, isMethod) {
+  var isExpression = isArrowFunction && this.type !== types.braceL;
+  var oldStrict = this.strict, useStrict = false;
+
+  if (isExpression) {
+    node.body = this.parseMaybeAssign();
+    node.expression = true;
+    this.checkParams(node, false);
+  } else {
+    var nonSimple = this.options.ecmaVersion >= 7 && !this.isSimpleParamList(node.params);
+    if (!oldStrict || nonSimple) {
+      useStrict = this.strictDirective(this.end);
+      // If this is a strict mode function, verify that argument names
+      // are not repeated, and it does not try to bind the words `eval`
+      // or `arguments`.
+      if (useStrict && nonSimple)
+        { this.raiseRecoverable(node.start, "Illegal 'use strict' directive in function with non-simple parameter list"); }
+    }
+    // Start a new scope with regard to labels and the `inFunction`
+    // flag (restore them to their old value afterwards).
+    var oldLabels = this.labels;
+    this.labels = [];
+    if (useStrict) { this.strict = true; }
+
+    // Add the params to varDeclaredNames to ensure that an error is thrown
+    // if a let/const declaration in the function clashes with one of the params.
+    this.checkParams(node, !oldStrict && !useStrict && !isArrowFunction && !isMethod && this.isSimpleParamList(node.params));
+    // Ensure the function name isn't a forbidden identifier in strict mode, e.g. 'eval'
+    if (this.strict && node.id) { this.checkLValSimple(node.id, BIND_OUTSIDE); }
+    node.body = this.parseBlock(false, undefined, useStrict && !oldStrict);
+    node.expression = false;
+    this.adaptDirectivePrologue(node.body.body);
+    this.labels = oldLabels;
+  }
+  this.exitScope();
+};
+
+pp$3.isSimpleParamList = function(params) {
+  for (var i = 0, list = params; i < list.length; i += 1)
+    {
+    var param = list[i];
+
+    if (param.type !== "Identifier") { return false
+  } }
+  return true
+};
+
+// Checks function params for various disallowed patterns such as using "eval"
+// or "arguments" and duplicate parameters.
+
+pp$3.checkParams = function(node, allowDuplicates) {
+  var nameHash = Object.create(null);
+  for (var i = 0, list = node.params; i < list.length; i += 1)
+    {
+    var param = list[i];
+
+    this.checkLValInnerPattern(param, BIND_VAR, allowDuplicates ? null : nameHash);
+  }
+};
+
+// Parses a comma-separated list of expressions, and returns them as
+// an array. `close` is the token type that ends the list, and
+// `allowEmpty` can be turned on to allow subsequent commas with
+// nothing in between them to be parsed as `null` (which is needed
+// for array literals).
+
+pp$3.parseExprList = function(close, allowTrailingComma, allowEmpty, refDestructuringErrors) {
+  var elts = [], first = true;
+  while (!this.eat(close)) {
+    if (!first) {
+      this.expect(types.comma);
+      if (allowTrailingComma && this.afterTrailingComma(close)) { break }
+    } else { first = false; }
+
+    var elt = (void 0);
+    if (allowEmpty && this.type === types.comma)
+      { elt = null; }
+    else if (this.type === types.ellipsis) {
+      elt = this.parseSpread(refDestructuringErrors);
+      if (refDestructuringErrors && this.type === types.comma && refDestructuringErrors.trailingComma < 0)
+        { refDestructuringErrors.trailingComma = this.start; }
+    } else {
+      elt = this.parseMaybeAssign(false, refDestructuringErrors);
+    }
+    elts.push(elt);
+  }
+  return elts
+};
+
+pp$3.checkUnreserved = function(ref) {
+  var start = ref.start;
+  var end = ref.end;
+  var name = ref.name;
+
+  if (this.inGenerator && name === "yield")
+    { this.raiseRecoverable(start, "Cannot use 'yield' as identifier inside a generator"); }
+  if (this.inAsync && name === "await")
+    { this.raiseRecoverable(start, "Cannot use 'await' as identifier inside an async function"); }
+  if (this.keywords.test(name))
+    { this.raise(start, ("Unexpected keyword '" + name + "'")); }
+  if (this.options.ecmaVersion < 6 &&
+    this.input.slice(start, end).indexOf("\\") !== -1) { return }
+  var re = this.strict ? this.reservedWordsStrict : this.reservedWords;
+  if (re.test(name)) {
+    if (!this.inAsync && name === "await")
+      { this.raiseRecoverable(start, "Cannot use keyword 'await' outside an async function"); }
+    this.raiseRecoverable(start, ("The keyword '" + name + "' is reserved"));
+  }
+};
+
+// Parse the next token as an identifier. If `liberal` is true (used
+// when parsing properties), it will also convert keywords into
+// identifiers.
+
+pp$3.parseIdent = function(liberal, isBinding) {
+  var node = this.startNode();
+  if (this.type === types.name) {
+    node.name = this.value;
+  } else if (this.type.keyword) {
+    node.name = this.type.keyword;
+
+    // To fix https://github.com/acornjs/acorn/issues/575
+    // `class` and `function` keywords push new context into this.context.
+    // But there is no chance to pop the context if the keyword is consumed as an identifier such as a property name.
+    // If the previous token is a dot, this does not apply because the context-managing code already ignored the keyword
+    if ((node.name === "class" || node.name === "function") &&
+        (this.lastTokEnd !== this.lastTokStart + 1 || this.input.charCodeAt(this.lastTokStart) !== 46)) {
+      this.context.pop();
+    }
+  } else {
+    this.unexpected();
+  }
+  this.next(!!liberal);
+  this.finishNode(node, "Identifier");
+  if (!liberal) {
+    this.checkUnreserved(node);
+    if (node.name === "await" && !this.awaitIdentPos)
+      { this.awaitIdentPos = node.start; }
+  }
+  return node
+};
+
+// Parses yield expression inside generator.
+
+pp$3.parseYield = function(noIn) {
+  if (!this.yieldPos) { this.yieldPos = this.start; }
+
+  var node = this.startNode();
+  this.next();
+  if (this.type === types.semi || this.canInsertSemicolon() || (this.type !== types.star && !this.type.startsExpr)) {
+    node.delegate = false;
+    node.argument = null;
+  } else {
+    node.delegate = this.eat(types.star);
+    node.argument = this.parseMaybeAssign(noIn);
+  }
+  return this.finishNode(node, "YieldExpression")
+};
+
+pp$3.parseAwait = function() {
+  if (!this.awaitPos) { this.awaitPos = this.start; }
+
+  var node = this.startNode();
+  this.next();
+  node.argument = this.parseMaybeUnary(null, true);
+  return this.finishNode(node, "AwaitExpression")
+};
+
+var pp$4 = Parser.prototype;
+
+// This function is used to raise exceptions on parse errors. It
+// takes an offset integer (into the current `input`) to indicate
+// the location of the error, attaches the position to the end
+// of the error message, and then raises a `SyntaxError` with that
+// message.
+
+pp$4.raise = function(pos, message) {
+  var loc = getLineInfo(this.input, pos);
+  message += " (" + loc.line + ":" + loc.column + ")";
+  var err = new SyntaxError(message);
+  err.pos = pos; err.loc = loc; err.raisedAt = this.pos;
+  throw err
+};
+
+pp$4.raiseRecoverable = pp$4.raise;
+
+pp$4.curPosition = function() {
+  if (this.options.locations) {
+    return new Position(this.curLine, this.pos - this.lineStart)
+  }
+};
+
+var pp$5 = Parser.prototype;
+
+var Scope = function Scope(flags) {
+  this.flags = flags;
+  // A list of var-declared names in the current lexical scope
+  this.var = [];
+  // A list of lexically-declared names in the current lexical scope
+  this.lexical = [];
+  // A list of lexically-declared FunctionDeclaration names in the current lexical scope
+  this.functions = [];
+};
+
+// The functions in this module keep track of declared variables in the current scope in order to detect duplicate variable names.
+
+pp$5.enterScope = function(flags) {
+  this.scopeStack.push(new Scope(flags));
+};
+
+pp$5.exitScope = function() {
+  this.scopeStack.pop();
+};
+
+// The spec says:
+// > At the top level of a function, or script, function declarations are
+// > treated like var declarations rather than like lexical declarations.
+pp$5.treatFunctionsAsVarInScope = function(scope) {
+  return (scope.flags & SCOPE_FUNCTION) || !this.inModule && (scope.flags & SCOPE_TOP)
+};
+
+pp$5.declareName = function(name, bindingType, pos) {
+  var redeclared = false;
+  if (bindingType === BIND_LEXICAL) {
+    var scope = this.currentScope();
+    redeclared = scope.lexical.indexOf(name) > -1 || scope.functions.indexOf(name) > -1 || scope.var.indexOf(name) > -1;
+    scope.lexical.push(name);
+    if (this.inModule && (scope.flags & SCOPE_TOP))
+      { delete this.undefinedExports[name]; }
+  } else if (bindingType === BIND_SIMPLE_CATCH) {
+    var scope$1 = this.currentScope();
+    scope$1.lexical.push(name);
+  } else if (bindingType === BIND_FUNCTION) {
+    var scope$2 = this.currentScope();
+    if (this.treatFunctionsAsVar)
+      { redeclared = scope$2.lexical.indexOf(name) > -1; }
+    else
+      { redeclared = scope$2.lexical.indexOf(name) > -1 || scope$2.var.indexOf(name) > -1; }
+    scope$2.functions.push(name);
+  } else {
+    for (var i = this.scopeStack.length - 1; i >= 0; --i) {
+      var scope$3 = this.scopeStack[i];
+      if (scope$3.lexical.indexOf(name) > -1 && !((scope$3.flags & SCOPE_SIMPLE_CATCH) && scope$3.lexical[0] === name) ||
+          !this.treatFunctionsAsVarInScope(scope$3) && scope$3.functions.indexOf(name) > -1) {
+        redeclared = true;
+        break
+      }
+      scope$3.var.push(name);
+      if (this.inModule && (scope$3.flags & SCOPE_TOP))
+        { delete this.undefinedExports[name]; }
+      if (scope$3.flags & SCOPE_VAR) { break }
+    }
+  }
+  if (redeclared) { this.raiseRecoverable(pos, ("Identifier '" + name + "' has already been declared")); }
+};
+
+pp$5.checkLocalExport = function(id) {
+  // scope.functions must be empty as Module code is always strict.
+  if (this.scopeStack[0].lexical.indexOf(id.name) === -1 &&
+      this.scopeStack[0].var.indexOf(id.name) === -1) {
+    this.undefinedExports[id.name] = id;
+  }
+};
+
+pp$5.currentScope = function() {
+  return this.scopeStack[this.scopeStack.length - 1]
+};
+
+pp$5.currentVarScope = function() {
+  for (var i = this.scopeStack.length - 1;; i--) {
+    var scope = this.scopeStack[i];
+    if (scope.flags & SCOPE_VAR) { return scope }
+  }
+};
+
+// Could be useful for `this`, `new.target`, `super()`, `super.property`, and `super[property]`.
+pp$5.currentThisScope = function() {
+  for (var i = this.scopeStack.length - 1;; i--) {
+    var scope = this.scopeStack[i];
+    if (scope.flags & SCOPE_VAR && !(scope.flags & SCOPE_ARROW)) { return scope }
+  }
+};
+
+var Node = function Node(parser, pos, loc) {
+  this.type = "";
+  this.start = pos;
+  this.end = 0;
+  if (parser.options.locations)
+    { this.loc = new SourceLocation(parser, loc); }
+  if (parser.options.directSourceFile)
+    { this.sourceFile = parser.options.directSourceFile; }
+  if (parser.options.ranges)
+    { this.range = [pos, 0]; }
+};
+
+// Start an AST node, attaching a start offset.
+
+var pp$6 = Parser.prototype;
+
+pp$6.startNode = function() {
+  return new Node(this, this.start, this.startLoc)
+};
+
+pp$6.startNodeAt = function(pos, loc) {
+  return new Node(this, pos, loc)
+};
+
+// Finish an AST node, adding `type` and `end` properties.
+
+function finishNodeAt(node, type, pos, loc) {
+  node.type = type;
+  node.end = pos;
+  if (this.options.locations)
+    { node.loc.end = loc; }
+  if (this.options.ranges)
+    { node.range[1] = pos; }
+  return node
+}
+
+pp$6.finishNode = function(node, type) {
+  return finishNodeAt.call(this, node, type, this.lastTokEnd, this.lastTokEndLoc)
+};
+
+// Finish node at given position
+
+pp$6.finishNodeAt = function(node, type, pos, loc) {
+  return finishNodeAt.call(this, node, type, pos, loc)
+};
+
+pp$6.copyNode = function(node) {
+  var newNode = new Node(this, node.start, this.startLoc);
+  for (var prop in node) { newNode[prop] = node[prop]; }
+  return newNode
+};
+
+// The algorithm used to determine whether a regexp can appear at a
+
+var TokContext = function TokContext(token, isExpr, preserveSpace, override, generator) {
+  this.token = token;
+  this.isExpr = !!isExpr;
+  this.preserveSpace = !!preserveSpace;
+  this.override = override;
+  this.generator = !!generator;
+};
+
+var types$1 = {
+  b_stat: new TokContext("{", false),
+  b_expr: new TokContext("{", true),
+  b_tmpl: new TokContext("${", false),
+  p_stat: new TokContext("(", false),
+  p_expr: new TokContext("(", true),
+  q_tmpl: new TokContext("`", true, true, function (p) { return p.tryReadTemplateToken(); }),
+  f_stat: new TokContext("function", false),
+  f_expr: new TokContext("function", true),
+  f_expr_gen: new TokContext("function", true, false, null, true),
+  f_gen: new TokContext("function", false, false, null, true)
+};
+
+var pp$7 = Parser.prototype;
+
+pp$7.initialContext = function() {
+  return [types$1.b_stat]
+};
+
+pp$7.braceIsBlock = function(prevType) {
+  var parent = this.curContext();
+  if (parent === types$1.f_expr || parent === types$1.f_stat)
+    { return true }
+  if (prevType === types.colon && (parent === types$1.b_stat || parent === types$1.b_expr))
+    { return !parent.isExpr }
+
+  // The check for `tt.name && exprAllowed` detects whether we are
+  // after a `yield` or `of` construct. See the `updateContext` for
+  // `tt.name`.
+  if (prevType === types._return || prevType === types.name && this.exprAllowed)
+    { return lineBreak.test(this.input.slice(this.lastTokEnd, this.start)) }
+  if (prevType === types._else || prevType === types.semi || prevType === types.eof || prevType === types.parenR || prevType === types.arrow)
+    { return true }
+  if (prevType === types.braceL)
+    { return parent === types$1.b_stat }
+  if (prevType === types._var || prevType === types._const || prevType === types.name)
+    { return false }
+  return !this.exprAllowed
+};
+
+pp$7.inGeneratorContext = function() {
+  for (var i = this.context.length - 1; i >= 1; i--) {
+    var context = this.context[i];
+    if (context.token === "function")
+      { return context.generator }
+  }
+  return false
+};
+
+pp$7.updateContext = function(prevType) {
+  var update, type = this.type;
+  if (type.keyword && prevType === types.dot)
+    { this.exprAllowed = false; }
+  else if (update = type.updateContext)
+    { update.call(this, prevType); }
+  else
+    { this.exprAllowed = type.beforeExpr; }
+};
+
+// Token-specific context update code
+
+types.parenR.updateContext = types.braceR.updateContext = function() {
+  if (this.context.length === 1) {
+    this.exprAllowed = true;
+    return
+  }
+  var out = this.context.pop();
+  if (out === types$1.b_stat && this.curContext().token === "function") {
+    out = this.context.pop();
+  }
+  this.exprAllowed = !out.isExpr;
+};
+
+types.braceL.updateContext = function(prevType) {
+  this.context.push(this.braceIsBlock(prevType) ? types$1.b_stat : types$1.b_expr);
+  this.exprAllowed = true;
+};
+
+types.dollarBraceL.updateContext = function() {
+  this.context.push(types$1.b_tmpl);
+  this.exprAllowed = true;
+};
+
+types.parenL.updateContext = function(prevType) {
+  var statementParens = prevType === types._if || prevType === types._for || prevType === types._with || prevType === types._while;
+  this.context.push(statementParens ? types$1.p_stat : types$1.p_expr);
+  this.exprAllowed = true;
+};
+
+types.incDec.updateContext = function() {
+  // tokExprAllowed stays unchanged
+};
+
+types._function.updateContext = types._class.updateContext = function(prevType) {
+  if (prevType.beforeExpr && prevType !== types._else &&
+      !(prevType === types.semi && this.curContext() !== types$1.p_stat) &&
+      !(prevType === types._return && lineBreak.test(this.input.slice(this.lastTokEnd, this.start))) &&
+      !((prevType === types.colon || prevType === types.braceL) && this.curContext() === types$1.b_stat))
+    { this.context.push(types$1.f_expr); }
+  else
+    { this.context.push(types$1.f_stat); }
+  this.exprAllowed = false;
+};
+
+types.backQuote.updateContext = function() {
+  if (this.curContext() === types$1.q_tmpl)
+    { this.context.pop(); }
+  else
+    { this.context.push(types$1.q_tmpl); }
+  this.exprAllowed = false;
+};
+
+types.star.updateContext = function(prevType) {
+  if (prevType === types._function) {
+    var index = this.context.length - 1;
+    if (this.context[index] === types$1.f_expr)
+      { this.context[index] = types$1.f_expr_gen; }
+    else
+      { this.context[index] = types$1.f_gen; }
+  }
+  this.exprAllowed = true;
+};
+
+types.name.updateContext = function(prevType) {
+  var allowed = false;
+  if (this.options.ecmaVersion >= 6 && prevType !== types.dot) {
+    if (this.value === "of" && !this.exprAllowed ||
+        this.value === "yield" && this.inGeneratorContext())
+      { allowed = true; }
+  }
+  this.exprAllowed = allowed;
+};
+
+// This file contains Unicode properties extracted from the ECMAScript
+// specification. The lists are extracted like so:
+// $$('#table-binary-unicode-properties > figure > table > tbody > tr > td:nth-child(1) code').map(el => el.innerText)
+
+// #table-binary-unicode-properties
+var ecma9BinaryProperties = "ASCII ASCII_Hex_Digit AHex Alphabetic Alpha Any Assigned Bidi_Control Bidi_C Bidi_Mirrored Bidi_M Case_Ignorable CI Cased Changes_When_Casefolded CWCF Changes_When_Casemapped CWCM Changes_When_Lowercased CWL Changes_When_NFKC_Casefolded CWKCF Changes_When_Titlecased CWT Changes_When_Uppercased CWU Dash Default_Ignorable_Code_Point DI Deprecated Dep Diacritic Dia Emoji Emoji_Component Emoji_Modifier Emoji_Modifier_Base Emoji_Presentation Extender Ext Grapheme_Base Gr_Base Grapheme_Extend Gr_Ext Hex_Digit Hex IDS_Binary_Operator IDSB IDS_Trinary_Operator IDST ID_Continue IDC ID_Start IDS Ideographic Ideo Join_Control Join_C Logical_Order_Exception LOE Lowercase Lower Math Noncharacter_Code_Point NChar Pattern_Syntax Pat_Syn Pattern_White_Space Pat_WS Quotation_Mark QMark Radical Regional_Indicator RI Sentence_Terminal STerm Soft_Dotted SD Terminal_Punctuation Term Unified_Ideograph UIdeo Uppercase Upper Variation_Selector VS White_Space space XID_Continue XIDC XID_Start XIDS";
+var ecma10BinaryProperties = ecma9BinaryProperties + " Extended_Pictographic";
+var ecma11BinaryProperties = ecma10BinaryProperties;
+var ecma12BinaryProperties = ecma11BinaryProperties + " EBase EComp EMod EPres ExtPict";
+var unicodeBinaryProperties = {
+  9: ecma9BinaryProperties,
+  10: ecma10BinaryProperties,
+  11: ecma11BinaryProperties,
+  12: ecma12BinaryProperties
+};
+
+// #table-unicode-general-category-values
+var unicodeGeneralCategoryValues = "Cased_Letter LC Close_Punctuation Pe Connector_Punctuation Pc Control Cc cntrl Currency_Symbol Sc Dash_Punctuation Pd Decimal_Number Nd digit Enclosing_Mark Me Final_Punctuation Pf Format Cf Initial_Punctuation Pi Letter L Letter_Number Nl Line_Separator Zl Lowercase_Letter Ll Mark M Combining_Mark Math_Symbol Sm Modifier_Letter Lm Modifier_Symbol Sk Nonspacing_Mark Mn Number N Open_Punctuation Ps Other C Other_Letter Lo Other_Number No Other_Punctuation Po Other_Symbol So Paragraph_Separator Zp Private_Use Co Punctuation P punct Separator Z Space_Separator Zs Spacing_Mark Mc Surrogate Cs Symbol S Titlecase_Letter Lt Unassigned Cn Uppercase_Letter Lu";
+
+// #table-unicode-script-values
+var ecma9ScriptValues = "Adlam Adlm Ahom Ahom Anatolian_Hieroglyphs Hluw Arabic Arab Armenian Armn Avestan Avst Balinese Bali Bamum Bamu Bassa_Vah Bass Batak Batk Bengali Beng Bhaiksuki Bhks Bopomofo Bopo Brahmi Brah Braille Brai Buginese Bugi Buhid Buhd Canadian_Aboriginal Cans Carian Cari Caucasian_Albanian Aghb Chakma Cakm Cham Cham Cherokee Cher Common Zyyy Coptic Copt Qaac Cuneiform Xsux Cypriot Cprt Cyrillic Cyrl Deseret Dsrt Devanagari Deva Duployan Dupl Egyptian_Hieroglyphs Egyp Elbasan Elba Ethiopic Ethi Georgian Geor Glagolitic Glag Gothic Goth Grantha Gran Greek Grek Gujarati Gujr Gurmukhi Guru Han Hani Hangul Hang Hanunoo Hano Hatran Hatr Hebrew Hebr Hiragana Hira Imperial_Aramaic Armi Inherited Zinh Qaai Inscriptional_Pahlavi Phli Inscriptional_Parthian Prti Javanese Java Kaithi Kthi Kannada Knda Katakana Kana Kayah_Li Kali Kharoshthi Khar Khmer Khmr Khojki Khoj Khudawadi Sind Lao Laoo Latin Latn Lepcha Lepc Limbu Limb Linear_A Lina Linear_B Linb Lisu Lisu Lycian Lyci Lydian Lydi Mahajani Mahj Malayalam Mlym Mandaic Mand Manichaean Mani Marchen Marc Masaram_Gondi Gonm Meetei_Mayek Mtei Mende_Kikakui Mend Meroitic_Cursive Merc Meroitic_Hieroglyphs Mero Miao Plrd Modi Modi Mongolian Mong Mro Mroo Multani Mult Myanmar Mymr Nabataean Nbat New_Tai_Lue Talu Newa Newa Nko Nkoo Nushu Nshu Ogham Ogam Ol_Chiki Olck Old_Hungarian Hung Old_Italic Ital Old_North_Arabian Narb Old_Permic Perm Old_Persian Xpeo Old_South_Arabian Sarb Old_Turkic Orkh Oriya Orya Osage Osge Osmanya Osma Pahawh_Hmong Hmng Palmyrene Palm Pau_Cin_Hau Pauc Phags_Pa Phag Phoenician Phnx Psalter_Pahlavi Phlp Rejang Rjng Runic Runr Samaritan Samr Saurashtra Saur Sharada Shrd Shavian Shaw Siddham Sidd SignWriting Sgnw Sinhala Sinh Sora_Sompeng Sora Soyombo Soyo Sundanese Sund Syloti_Nagri Sylo Syriac Syrc Tagalog Tglg Tagbanwa Tagb Tai_Le Tale Tai_Tham Lana Tai_Viet Tavt Takri Takr Tamil Taml Tangut Tang Telugu Telu Thaana Thaa Thai Thai Tibetan Tibt Tifinagh Tfng Tirhuta Tirh Ugaritic Ugar Vai Vaii Warang_Citi Wara Yi Yiii Zanabazar_Square Zanb";
+var ecma10ScriptValues = ecma9ScriptValues + " Dogra Dogr Gunjala_Gondi Gong Hanifi_Rohingya Rohg Makasar Maka Medefaidrin Medf Old_Sogdian Sogo Sogdian Sogd";
+var ecma11ScriptValues = ecma10ScriptValues + " Elymaic Elym Nandinagari Nand Nyiakeng_Puachue_Hmong Hmnp Wancho Wcho";
+var ecma12ScriptValues = ecma11ScriptValues + " Chorasmian Chrs Diak Dives_Akuru Khitan_Small_Script Kits Yezi Yezidi";
+var unicodeScriptValues = {
+  9: ecma9ScriptValues,
+  10: ecma10ScriptValues,
+  11: ecma11ScriptValues,
+  12: ecma12ScriptValues
+};
+
+var data = {};
+function buildUnicodeData(ecmaVersion) {
+  var d = data[ecmaVersion] = {
+    binary: wordsRegexp(unicodeBinaryProperties[ecmaVersion] + " " + unicodeGeneralCategoryValues),
+    nonBinary: {
+      General_Category: wordsRegexp(unicodeGeneralCategoryValues),
+      Script: wordsRegexp(unicodeScriptValues[ecmaVersion])
+    }
+  };
+  d.nonBinary.Script_Extensions = d.nonBinary.Script;
+
+  d.nonBinary.gc = d.nonBinary.General_Category;
+  d.nonBinary.sc = d.nonBinary.Script;
+  d.nonBinary.scx = d.nonBinary.Script_Extensions;
+}
+buildUnicodeData(9);
+buildUnicodeData(10);
+buildUnicodeData(11);
+buildUnicodeData(12);
+
+var pp$8 = Parser.prototype;
+
+var RegExpValidationState = function RegExpValidationState(parser) {
+  this.parser = parser;
+  this.validFlags = "gim" + (parser.options.ecmaVersion >= 6 ? "uy" : "") + (parser.options.ecmaVersion >= 9 ? "s" : "");
+  this.unicodeProperties = data[parser.options.ecmaVersion >= 12 ? 12 : parser.options.ecmaVersion];
+  this.source = "";
+  this.flags = "";
+  this.start = 0;
+  this.switchU = false;
+  this.switchN = false;
+  this.pos = 0;
+  this.lastIntValue = 0;
+  this.lastStringValue = "";
+  this.lastAssertionIsQuantifiable = false;
+  this.numCapturingParens = 0;
+  this.maxBackReference = 0;
+  this.groupNames = [];
+  this.backReferenceNames = [];
+};
+
+RegExpValidationState.prototype.reset = function reset (start, pattern, flags) {
+  var unicode = flags.indexOf("u") !== -1;
+  this.start = start | 0;
+  this.source = pattern + "";
+  this.flags = flags;
+  this.switchU = unicode && this.parser.options.ecmaVersion >= 6;
+  this.switchN = unicode && this.parser.options.ecmaVersion >= 9;
+};
+
+RegExpValidationState.prototype.raise = function raise (message) {
+  this.parser.raiseRecoverable(this.start, ("Invalid regular expression: /" + (this.source) + "/: " + message));
+};
+
+// If u flag is given, this returns the code point at the index (it combines a surrogate pair).
+// Otherwise, this returns the code unit of the index (can be a part of a surrogate pair).
+RegExpValidationState.prototype.at = function at (i, forceU) {
+    if ( forceU === void 0 ) forceU = false;
+
+  var s = this.source;
+  var l = s.length;
+  if (i >= l) {
+    return -1
+  }
+  var c = s.charCodeAt(i);
+  if (!(forceU || this.switchU) || c <= 0xD7FF || c >= 0xE000 || i + 1 >= l) {
+    return c
+  }
+  var next = s.charCodeAt(i + 1);
+  return next >= 0xDC00 && next <= 0xDFFF ? (c << 10) + next - 0x35FDC00 : c
+};
+
+RegExpValidationState.prototype.nextIndex = function nextIndex (i, forceU) {
+    if ( forceU === void 0 ) forceU = false;
+
+  var s = this.source;
+  var l = s.length;
+  if (i >= l) {
+    return l
+  }
+  var c = s.charCodeAt(i), next;
+  if (!(forceU || this.switchU) || c <= 0xD7FF || c >= 0xE000 || i + 1 >= l ||
+      (next = s.charCodeAt(i + 1)) < 0xDC00 || next > 0xDFFF) {
+    return i + 1
+  }
+  return i + 2
+};
+
+RegExpValidationState.prototype.current = function current (forceU) {
+    if ( forceU === void 0 ) forceU = false;
+
+  return this.at(this.pos, forceU)
+};
+
+RegExpValidationState.prototype.lookahead = function lookahead (forceU) {
+    if ( forceU === void 0 ) forceU = false;
+
+  return this.at(this.nextIndex(this.pos, forceU), forceU)
+};
+
+RegExpValidationState.prototype.advance = function advance (forceU) {
+    if ( forceU === void 0 ) forceU = false;
+
+  this.pos = this.nextIndex(this.pos, forceU);
+};
+
+RegExpValidationState.prototype.eat = function eat (ch, forceU) {
+    if ( forceU === void 0 ) forceU = false;
+
+  if (this.current(forceU) === ch) {
+    this.advance(forceU);
+    return true
+  }
+  return false
+};
+
+function codePointToString(ch) {
+  if (ch <= 0xFFFF) { return String.fromCharCode(ch) }
+  ch -= 0x10000;
+  return String.fromCharCode((ch >> 10) + 0xD800, (ch & 0x03FF) + 0xDC00)
+}
+
+/**
+ * Validate the flags part of a given RegExpLiteral.
+ *
+ * @param {RegExpValidationState} state The state to validate RegExp.
+ * @returns {void}
+ */
+pp$8.validateRegExpFlags = function(state) {
+  var validFlags = state.validFlags;
+  var flags = state.flags;
+
+  for (var i = 0; i < flags.length; i++) {
+    var flag = flags.charAt(i);
+    if (validFlags.indexOf(flag) === -1) {
+      this.raise(state.start, "Invalid regular expression flag");
+    }
+    if (flags.indexOf(flag, i + 1) > -1) {
+      this.raise(state.start, "Duplicate regular expression flag");
+    }
+  }
+};
+
+/**
+ * Validate the pattern part of a given RegExpLiteral.
+ *
+ * @param {RegExpValidationState} state The state to validate RegExp.
+ * @returns {void}
+ */
+pp$8.validateRegExpPattern = function(state) {
+  this.regexp_pattern(state);
+
+  // The goal symbol for the parse is |Pattern[~U, ~N]|. If the result of
+  // parsing contains a |GroupName|, reparse with the goal symbol
+  // |Pattern[~U, +N]| and use this result instead. Throw a *SyntaxError*
+  // exception if _P_ did not conform to the grammar, if any elements of _P_
+  // were not matched by the parse, or if any Early Error conditions exist.
+  if (!state.switchN && this.options.ecmaVersion >= 9 && state.groupNames.length > 0) {
+    state.switchN = true;
+    this.regexp_pattern(state);
+  }
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-Pattern
+pp$8.regexp_pattern = function(state) {
+  state.pos = 0;
+  state.lastIntValue = 0;
+  state.lastStringValue = "";
+  state.lastAssertionIsQuantifiable = false;
+  state.numCapturingParens = 0;
+  state.maxBackReference = 0;
+  state.groupNames.length = 0;
+  state.backReferenceNames.length = 0;
+
+  this.regexp_disjunction(state);
+
+  if (state.pos !== state.source.length) {
+    // Make the same messages as V8.
+    if (state.eat(0x29 /* ) */)) {
+      state.raise("Unmatched ')'");
+    }
+    if (state.eat(0x5D /* ] */) || state.eat(0x7D /* } */)) {
+      state.raise("Lone quantifier brackets");
+    }
+  }
+  if (state.maxBackReference > state.numCapturingParens) {
+    state.raise("Invalid escape");
+  }
+  for (var i = 0, list = state.backReferenceNames; i < list.length; i += 1) {
+    var name = list[i];
+
+    if (state.groupNames.indexOf(name) === -1) {
+      state.raise("Invalid named capture referenced");
+    }
+  }
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-Disjunction
+pp$8.regexp_disjunction = function(state) {
+  this.regexp_alternative(state);
+  while (state.eat(0x7C /* | */)) {
+    this.regexp_alternative(state);
+  }
+
+  // Make the same message as V8.
+  if (this.regexp_eatQuantifier(state, true)) {
+    state.raise("Nothing to repeat");
+  }
+  if (state.eat(0x7B /* { */)) {
+    state.raise("Lone quantifier brackets");
+  }
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-Alternative
+pp$8.regexp_alternative = function(state) {
+  while (state.pos < state.source.length && this.regexp_eatTerm(state))
+    { }
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-Term
+pp$8.regexp_eatTerm = function(state) {
+  if (this.regexp_eatAssertion(state)) {
+    // Handle `QuantifiableAssertion Quantifier` alternative.
+    // `state.lastAssertionIsQuantifiable` is true if the last eaten Assertion
+    // is a QuantifiableAssertion.
+    if (state.lastAssertionIsQuantifiable && this.regexp_eatQuantifier(state)) {
+      // Make the same message as V8.
+      if (state.switchU) {
+        state.raise("Invalid quantifier");
+      }
+    }
+    return true
+  }
+
+  if (state.switchU ? this.regexp_eatAtom(state) : this.regexp_eatExtendedAtom(state)) {
+    this.regexp_eatQuantifier(state);
+    return true
+  }
+
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-Assertion
+pp$8.regexp_eatAssertion = function(state) {
+  var start = state.pos;
+  state.lastAssertionIsQuantifiable = false;
+
+  // ^, $
+  if (state.eat(0x5E /* ^ */) || state.eat(0x24 /* $ */)) {
+    return true
+  }
+
+  // \b \B
+  if (state.eat(0x5C /* \ */)) {
+    if (state.eat(0x42 /* B */) || state.eat(0x62 /* b */)) {
+      return true
+    }
+    state.pos = start;
+  }
+
+  // Lookahead / Lookbehind
+  if (state.eat(0x28 /* ( */) && state.eat(0x3F /* ? */)) {
+    var lookbehind = false;
+    if (this.options.ecmaVersion >= 9) {
+      lookbehind = state.eat(0x3C /* < */);
+    }
+    if (state.eat(0x3D /* = */) || state.eat(0x21 /* ! */)) {
+      this.regexp_disjunction(state);
+      if (!state.eat(0x29 /* ) */)) {
+        state.raise("Unterminated group");
+      }
+      state.lastAssertionIsQuantifiable = !lookbehind;
+      return true
+    }
+  }
+
+  state.pos = start;
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-Quantifier
+pp$8.regexp_eatQuantifier = function(state, noError) {
+  if ( noError === void 0 ) noError = false;
+
+  if (this.regexp_eatQuantifierPrefix(state, noError)) {
+    state.eat(0x3F /* ? */);
+    return true
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-QuantifierPrefix
+pp$8.regexp_eatQuantifierPrefix = function(state, noError) {
+  return (
+    state.eat(0x2A /* * */) ||
+    state.eat(0x2B /* + */) ||
+    state.eat(0x3F /* ? */) ||
+    this.regexp_eatBracedQuantifier(state, noError)
+  )
+};
+pp$8.regexp_eatBracedQuantifier = function(state, noError) {
+  var start = state.pos;
+  if (state.eat(0x7B /* { */)) {
+    var min = 0, max = -1;
+    if (this.regexp_eatDecimalDigits(state)) {
+      min = state.lastIntValue;
+      if (state.eat(0x2C /* , */) && this.regexp_eatDecimalDigits(state)) {
+        max = state.lastIntValue;
+      }
+      if (state.eat(0x7D /* } */)) {
+        // SyntaxError in https://www.ecma-international.org/ecma-262/8.0/#sec-term
+        if (max !== -1 && max < min && !noError) {
+          state.raise("numbers out of order in {} quantifier");
+        }
+        return true
+      }
+    }
+    if (state.switchU && !noError) {
+      state.raise("Incomplete quantifier");
+    }
+    state.pos = start;
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-Atom
+pp$8.regexp_eatAtom = function(state) {
+  return (
+    this.regexp_eatPatternCharacters(state) ||
+    state.eat(0x2E /* . */) ||
+    this.regexp_eatReverseSolidusAtomEscape(state) ||
+    this.regexp_eatCharacterClass(state) ||
+    this.regexp_eatUncapturingGroup(state) ||
+    this.regexp_eatCapturingGroup(state)
+  )
+};
+pp$8.regexp_eatReverseSolidusAtomEscape = function(state) {
+  var start = state.pos;
+  if (state.eat(0x5C /* \ */)) {
+    if (this.regexp_eatAtomEscape(state)) {
+      return true
+    }
+    state.pos = start;
+  }
+  return false
+};
+pp$8.regexp_eatUncapturingGroup = function(state) {
+  var start = state.pos;
+  if (state.eat(0x28 /* ( */)) {
+    if (state.eat(0x3F /* ? */) && state.eat(0x3A /* : */)) {
+      this.regexp_disjunction(state);
+      if (state.eat(0x29 /* ) */)) {
+        return true
+      }
+      state.raise("Unterminated group");
+    }
+    state.pos = start;
+  }
+  return false
+};
+pp$8.regexp_eatCapturingGroup = function(state) {
+  if (state.eat(0x28 /* ( */)) {
+    if (this.options.ecmaVersion >= 9) {
+      this.regexp_groupSpecifier(state);
+    } else if (state.current() === 0x3F /* ? */) {
+      state.raise("Invalid group");
+    }
+    this.regexp_disjunction(state);
+    if (state.eat(0x29 /* ) */)) {
+      state.numCapturingParens += 1;
+      return true
+    }
+    state.raise("Unterminated group");
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-ExtendedAtom
+pp$8.regexp_eatExtendedAtom = function(state) {
+  return (
+    state.eat(0x2E /* . */) ||
+    this.regexp_eatReverseSolidusAtomEscape(state) ||
+    this.regexp_eatCharacterClass(state) ||
+    this.regexp_eatUncapturingGroup(state) ||
+    this.regexp_eatCapturingGroup(state) ||
+    this.regexp_eatInvalidBracedQuantifier(state) ||
+    this.regexp_eatExtendedPatternCharacter(state)
+  )
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-InvalidBracedQuantifier
+pp$8.regexp_eatInvalidBracedQuantifier = function(state) {
+  if (this.regexp_eatBracedQuantifier(state, true)) {
+    state.raise("Nothing to repeat");
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-SyntaxCharacter
+pp$8.regexp_eatSyntaxCharacter = function(state) {
+  var ch = state.current();
+  if (isSyntaxCharacter(ch)) {
+    state.lastIntValue = ch;
+    state.advance();
+    return true
+  }
+  return false
+};
+function isSyntaxCharacter(ch) {
+  return (
+    ch === 0x24 /* $ */ ||
+    ch >= 0x28 /* ( */ && ch <= 0x2B /* + */ ||
+    ch === 0x2E /* . */ ||
+    ch === 0x3F /* ? */ ||
+    ch >= 0x5B /* [ */ && ch <= 0x5E /* ^ */ ||
+    ch >= 0x7B /* { */ && ch <= 0x7D /* } */
+  )
+}
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-PatternCharacter
+// But eat eager.
+pp$8.regexp_eatPatternCharacters = function(state) {
+  var start = state.pos;
+  var ch = 0;
+  while ((ch = state.current()) !== -1 && !isSyntaxCharacter(ch)) {
+    state.advance();
+  }
+  return state.pos !== start
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-ExtendedPatternCharacter
+pp$8.regexp_eatExtendedPatternCharacter = function(state) {
+  var ch = state.current();
+  if (
+    ch !== -1 &&
+    ch !== 0x24 /* $ */ &&
+    !(ch >= 0x28 /* ( */ && ch <= 0x2B /* + */) &&
+    ch !== 0x2E /* . */ &&
+    ch !== 0x3F /* ? */ &&
+    ch !== 0x5B /* [ */ &&
+    ch !== 0x5E /* ^ */ &&
+    ch !== 0x7C /* | */
+  ) {
+    state.advance();
+    return true
+  }
+  return false
+};
+
+// GroupSpecifier ::
+//   [empty]
+//   `?` GroupName
+pp$8.regexp_groupSpecifier = function(state) {
+  if (state.eat(0x3F /* ? */)) {
+    if (this.regexp_eatGroupName(state)) {
+      if (state.groupNames.indexOf(state.lastStringValue) !== -1) {
+        state.raise("Duplicate capture group name");
+      }
+      state.groupNames.push(state.lastStringValue);
+      return
+    }
+    state.raise("Invalid group");
+  }
+};
+
+// GroupName ::
+//   `<` RegExpIdentifierName `>`
+// Note: this updates `state.lastStringValue` property with the eaten name.
+pp$8.regexp_eatGroupName = function(state) {
+  state.lastStringValue = "";
+  if (state.eat(0x3C /* < */)) {
+    if (this.regexp_eatRegExpIdentifierName(state) && state.eat(0x3E /* > */)) {
+      return true
+    }
+    state.raise("Invalid capture group name");
+  }
+  return false
+};
+
+// RegExpIdentifierName ::
+//   RegExpIdentifierStart
+//   RegExpIdentifierName RegExpIdentifierPart
+// Note: this updates `state.lastStringValue` property with the eaten name.
+pp$8.regexp_eatRegExpIdentifierName = function(state) {
+  state.lastStringValue = "";
+  if (this.regexp_eatRegExpIdentifierStart(state)) {
+    state.lastStringValue += codePointToString(state.lastIntValue);
+    while (this.regexp_eatRegExpIdentifierPart(state)) {
+      state.lastStringValue += codePointToString(state.lastIntValue);
+    }
+    return true
+  }
+  return false
+};
+
+// RegExpIdentifierStart ::
+//   UnicodeIDStart
+//   `$`
+//   `_`
+//   `\` RegExpUnicodeEscapeSequence[+U]
+pp$8.regexp_eatRegExpIdentifierStart = function(state) {
+  var start = state.pos;
+  var forceU = this.options.ecmaVersion >= 11;
+  var ch = state.current(forceU);
+  state.advance(forceU);
+
+  if (ch === 0x5C /* \ */ && this.regexp_eatRegExpUnicodeEscapeSequence(state, forceU)) {
+    ch = state.lastIntValue;
+  }
+  if (isRegExpIdentifierStart(ch)) {
+    state.lastIntValue = ch;
+    return true
+  }
+
+  state.pos = start;
+  return false
+};
+function isRegExpIdentifierStart(ch) {
+  return isIdentifierStart(ch, true) || ch === 0x24 /* $ */ || ch === 0x5F /* _ */
+}
+
+// RegExpIdentifierPart ::
+//   UnicodeIDContinue
+//   `$`
+//   `_`
+//   `\` RegExpUnicodeEscapeSequence[+U]
+//   <ZWNJ>
+//   <ZWJ>
+pp$8.regexp_eatRegExpIdentifierPart = function(state) {
+  var start = state.pos;
+  var forceU = this.options.ecmaVersion >= 11;
+  var ch = state.current(forceU);
+  state.advance(forceU);
+
+  if (ch === 0x5C /* \ */ && this.regexp_eatRegExpUnicodeEscapeSequence(state, forceU)) {
+    ch = state.lastIntValue;
+  }
+  if (isRegExpIdentifierPart(ch)) {
+    state.lastIntValue = ch;
+    return true
+  }
+
+  state.pos = start;
+  return false
+};
+function isRegExpIdentifierPart(ch) {
+  return isIdentifierChar(ch, true) || ch === 0x24 /* $ */ || ch === 0x5F /* _ */ || ch === 0x200C /* <ZWNJ> */ || ch === 0x200D /* <ZWJ> */
+}
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-AtomEscape
+pp$8.regexp_eatAtomEscape = function(state) {
+  if (
+    this.regexp_eatBackReference(state) ||
+    this.regexp_eatCharacterClassEscape(state) ||
+    this.regexp_eatCharacterEscape(state) ||
+    (state.switchN && this.regexp_eatKGroupName(state))
+  ) {
+    return true
+  }
+  if (state.switchU) {
+    // Make the same message as V8.
+    if (state.current() === 0x63 /* c */) {
+      state.raise("Invalid unicode escape");
+    }
+    state.raise("Invalid escape");
+  }
+  return false
+};
+pp$8.regexp_eatBackReference = function(state) {
+  var start = state.pos;
+  if (this.regexp_eatDecimalEscape(state)) {
+    var n = state.lastIntValue;
+    if (state.switchU) {
+      // For SyntaxError in https://www.ecma-international.org/ecma-262/8.0/#sec-atomescape
+      if (n > state.maxBackReference) {
+        state.maxBackReference = n;
+      }
+      return true
+    }
+    if (n <= state.numCapturingParens) {
+      return true
+    }
+    state.pos = start;
+  }
+  return false
+};
+pp$8.regexp_eatKGroupName = function(state) {
+  if (state.eat(0x6B /* k */)) {
+    if (this.regexp_eatGroupName(state)) {
+      state.backReferenceNames.push(state.lastStringValue);
+      return true
+    }
+    state.raise("Invalid named reference");
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-CharacterEscape
+pp$8.regexp_eatCharacterEscape = function(state) {
+  return (
+    this.regexp_eatControlEscape(state) ||
+    this.regexp_eatCControlLetter(state) ||
+    this.regexp_eatZero(state) ||
+    this.regexp_eatHexEscapeSequence(state) ||
+    this.regexp_eatRegExpUnicodeEscapeSequence(state, false) ||
+    (!state.switchU && this.regexp_eatLegacyOctalEscapeSequence(state)) ||
+    this.regexp_eatIdentityEscape(state)
+  )
+};
+pp$8.regexp_eatCControlLetter = function(state) {
+  var start = state.pos;
+  if (state.eat(0x63 /* c */)) {
+    if (this.regexp_eatControlLetter(state)) {
+      return true
+    }
+    state.pos = start;
+  }
+  return false
+};
+pp$8.regexp_eatZero = function(state) {
+  if (state.current() === 0x30 /* 0 */ && !isDecimalDigit(state.lookahead())) {
+    state.lastIntValue = 0;
+    state.advance();
+    return true
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-ControlEscape
+pp$8.regexp_eatControlEscape = function(state) {
+  var ch = state.current();
+  if (ch === 0x74 /* t */) {
+    state.lastIntValue = 0x09; /* \t */
+    state.advance();
+    return true
+  }
+  if (ch === 0x6E /* n */) {
+    state.lastIntValue = 0x0A; /* \n */
+    state.advance();
+    return true
+  }
+  if (ch === 0x76 /* v */) {
+    state.lastIntValue = 0x0B; /* \v */
+    state.advance();
+    return true
+  }
+  if (ch === 0x66 /* f */) {
+    state.lastIntValue = 0x0C; /* \f */
+    state.advance();
+    return true
+  }
+  if (ch === 0x72 /* r */) {
+    state.lastIntValue = 0x0D; /* \r */
+    state.advance();
+    return true
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-ControlLetter
+pp$8.regexp_eatControlLetter = function(state) {
+  var ch = state.current();
+  if (isControlLetter(ch)) {
+    state.lastIntValue = ch % 0x20;
+    state.advance();
+    return true
+  }
+  return false
+};
+function isControlLetter(ch) {
+  return (
+    (ch >= 0x41 /* A */ && ch <= 0x5A /* Z */) ||
+    (ch >= 0x61 /* a */ && ch <= 0x7A /* z */)
+  )
+}
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-RegExpUnicodeEscapeSequence
+pp$8.regexp_eatRegExpUnicodeEscapeSequence = function(state, forceU) {
+  if ( forceU === void 0 ) forceU = false;
+
+  var start = state.pos;
+  var switchU = forceU || state.switchU;
+
+  if (state.eat(0x75 /* u */)) {
+    if (this.regexp_eatFixedHexDigits(state, 4)) {
+      var lead = state.lastIntValue;
+      if (switchU && lead >= 0xD800 && lead <= 0xDBFF) {
+        var leadSurrogateEnd = state.pos;
+        if (state.eat(0x5C /* \ */) && state.eat(0x75 /* u */) && this.regexp_eatFixedHexDigits(state, 4)) {
+          var trail = state.lastIntValue;
+          if (trail >= 0xDC00 && trail <= 0xDFFF) {
+            state.lastIntValue = (lead - 0xD800) * 0x400 + (trail - 0xDC00) + 0x10000;
+            return true
+          }
+        }
+        state.pos = leadSurrogateEnd;
+        state.lastIntValue = lead;
+      }
+      return true
+    }
+    if (
+      switchU &&
+      state.eat(0x7B /* { */) &&
+      this.regexp_eatHexDigits(state) &&
+      state.eat(0x7D /* } */) &&
+      isValidUnicode(state.lastIntValue)
+    ) {
+      return true
+    }
+    if (switchU) {
+      state.raise("Invalid unicode escape");
+    }
+    state.pos = start;
+  }
+
+  return false
+};
+function isValidUnicode(ch) {
+  return ch >= 0 && ch <= 0x10FFFF
+}
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-IdentityEscape
+pp$8.regexp_eatIdentityEscape = function(state) {
+  if (state.switchU) {
+    if (this.regexp_eatSyntaxCharacter(state)) {
+      return true
+    }
+    if (state.eat(0x2F /* / */)) {
+      state.lastIntValue = 0x2F; /* / */
+      return true
+    }
+    return false
+  }
+
+  var ch = state.current();
+  if (ch !== 0x63 /* c */ && (!state.switchN || ch !== 0x6B /* k */)) {
+    state.lastIntValue = ch;
+    state.advance();
+    return true
+  }
+
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-DecimalEscape
+pp$8.regexp_eatDecimalEscape = function(state) {
+  state.lastIntValue = 0;
+  var ch = state.current();
+  if (ch >= 0x31 /* 1 */ && ch <= 0x39 /* 9 */) {
+    do {
+      state.lastIntValue = 10 * state.lastIntValue + (ch - 0x30 /* 0 */);
+      state.advance();
+    } while ((ch = state.current()) >= 0x30 /* 0 */ && ch <= 0x39 /* 9 */)
+    return true
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-CharacterClassEscape
+pp$8.regexp_eatCharacterClassEscape = function(state) {
+  var ch = state.current();
+
+  if (isCharacterClassEscape(ch)) {
+    state.lastIntValue = -1;
+    state.advance();
+    return true
+  }
+
+  if (
+    state.switchU &&
+    this.options.ecmaVersion >= 9 &&
+    (ch === 0x50 /* P */ || ch === 0x70 /* p */)
+  ) {
+    state.lastIntValue = -1;
+    state.advance();
+    if (
+      state.eat(0x7B /* { */) &&
+      this.regexp_eatUnicodePropertyValueExpression(state) &&
+      state.eat(0x7D /* } */)
+    ) {
+      return true
+    }
+    state.raise("Invalid property name");
+  }
+
+  return false
+};
+function isCharacterClassEscape(ch) {
+  return (
+    ch === 0x64 /* d */ ||
+    ch === 0x44 /* D */ ||
+    ch === 0x73 /* s */ ||
+    ch === 0x53 /* S */ ||
+    ch === 0x77 /* w */ ||
+    ch === 0x57 /* W */
+  )
+}
+
+// UnicodePropertyValueExpression ::
+//   UnicodePropertyName `=` UnicodePropertyValue
+//   LoneUnicodePropertyNameOrValue
+pp$8.regexp_eatUnicodePropertyValueExpression = function(state) {
+  var start = state.pos;
+
+  // UnicodePropertyName `=` UnicodePropertyValue
+  if (this.regexp_eatUnicodePropertyName(state) && state.eat(0x3D /* = */)) {
+    var name = state.lastStringValue;
+    if (this.regexp_eatUnicodePropertyValue(state)) {
+      var value = state.lastStringValue;
+      this.regexp_validateUnicodePropertyNameAndValue(state, name, value);
+      return true
+    }
+  }
+  state.pos = start;
+
+  // LoneUnicodePropertyNameOrValue
+  if (this.regexp_eatLoneUnicodePropertyNameOrValue(state)) {
+    var nameOrValue = state.lastStringValue;
+    this.regexp_validateUnicodePropertyNameOrValue(state, nameOrValue);
+    return true
+  }
+  return false
+};
+pp$8.regexp_validateUnicodePropertyNameAndValue = function(state, name, value) {
+  if (!has(state.unicodeProperties.nonBinary, name))
+    { state.raise("Invalid property name"); }
+  if (!state.unicodeProperties.nonBinary[name].test(value))
+    { state.raise("Invalid property value"); }
+};
+pp$8.regexp_validateUnicodePropertyNameOrValue = function(state, nameOrValue) {
+  if (!state.unicodeProperties.binary.test(nameOrValue))
+    { state.raise("Invalid property name"); }
+};
+
+// UnicodePropertyName ::
+//   UnicodePropertyNameCharacters
+pp$8.regexp_eatUnicodePropertyName = function(state) {
+  var ch = 0;
+  state.lastStringValue = "";
+  while (isUnicodePropertyNameCharacter(ch = state.current())) {
+    state.lastStringValue += codePointToString(ch);
+    state.advance();
+  }
+  return state.lastStringValue !== ""
+};
+function isUnicodePropertyNameCharacter(ch) {
+  return isControlLetter(ch) || ch === 0x5F /* _ */
+}
+
+// UnicodePropertyValue ::
+//   UnicodePropertyValueCharacters
+pp$8.regexp_eatUnicodePropertyValue = function(state) {
+  var ch = 0;
+  state.lastStringValue = "";
+  while (isUnicodePropertyValueCharacter(ch = state.current())) {
+    state.lastStringValue += codePointToString(ch);
+    state.advance();
+  }
+  return state.lastStringValue !== ""
+};
+function isUnicodePropertyValueCharacter(ch) {
+  return isUnicodePropertyNameCharacter(ch) || isDecimalDigit(ch)
+}
+
+// LoneUnicodePropertyNameOrValue ::
+//   UnicodePropertyValueCharacters
+pp$8.regexp_eatLoneUnicodePropertyNameOrValue = function(state) {
+  return this.regexp_eatUnicodePropertyValue(state)
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-CharacterClass
+pp$8.regexp_eatCharacterClass = function(state) {
+  if (state.eat(0x5B /* [ */)) {
+    state.eat(0x5E /* ^ */);
+    this.regexp_classRanges(state);
+    if (state.eat(0x5D /* ] */)) {
+      return true
+    }
+    // Unreachable since it threw "unterminated regular expression" error before.
+    state.raise("Unterminated character class");
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-ClassRanges
+// https://www.ecma-international.org/ecma-262/8.0/#prod-NonemptyClassRanges
+// https://www.ecma-international.org/ecma-262/8.0/#prod-NonemptyClassRangesNoDash
+pp$8.regexp_classRanges = function(state) {
+  while (this.regexp_eatClassAtom(state)) {
+    var left = state.lastIntValue;
+    if (state.eat(0x2D /* - */) && this.regexp_eatClassAtom(state)) {
+      var right = state.lastIntValue;
+      if (state.switchU && (left === -1 || right === -1)) {
+        state.raise("Invalid character class");
+      }
+      if (left !== -1 && right !== -1 && left > right) {
+        state.raise("Range out of order in character class");
+      }
+    }
+  }
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-ClassAtom
+// https://www.ecma-international.org/ecma-262/8.0/#prod-ClassAtomNoDash
+pp$8.regexp_eatClassAtom = function(state) {
+  var start = state.pos;
+
+  if (state.eat(0x5C /* \ */)) {
+    if (this.regexp_eatClassEscape(state)) {
+      return true
+    }
+    if (state.switchU) {
+      // Make the same message as V8.
+      var ch$1 = state.current();
+      if (ch$1 === 0x63 /* c */ || isOctalDigit(ch$1)) {
+        state.raise("Invalid class escape");
+      }
+      state.raise("Invalid escape");
+    }
+    state.pos = start;
+  }
+
+  var ch = state.current();
+  if (ch !== 0x5D /* ] */) {
+    state.lastIntValue = ch;
+    state.advance();
+    return true
+  }
+
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-ClassEscape
+pp$8.regexp_eatClassEscape = function(state) {
+  var start = state.pos;
+
+  if (state.eat(0x62 /* b */)) {
+    state.lastIntValue = 0x08; /* <BS> */
+    return true
+  }
+
+  if (state.switchU && state.eat(0x2D /* - */)) {
+    state.lastIntValue = 0x2D; /* - */
+    return true
+  }
+
+  if (!state.switchU && state.eat(0x63 /* c */)) {
+    if (this.regexp_eatClassControlLetter(state)) {
+      return true
+    }
+    state.pos = start;
+  }
+
+  return (
+    this.regexp_eatCharacterClassEscape(state) ||
+    this.regexp_eatCharacterEscape(state)
+  )
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-ClassControlLetter
+pp$8.regexp_eatClassControlLetter = function(state) {
+  var ch = state.current();
+  if (isDecimalDigit(ch) || ch === 0x5F /* _ */) {
+    state.lastIntValue = ch % 0x20;
+    state.advance();
+    return true
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-HexEscapeSequence
+pp$8.regexp_eatHexEscapeSequence = function(state) {
+  var start = state.pos;
+  if (state.eat(0x78 /* x */)) {
+    if (this.regexp_eatFixedHexDigits(state, 2)) {
+      return true
+    }
+    if (state.switchU) {
+      state.raise("Invalid escape");
+    }
+    state.pos = start;
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-DecimalDigits
+pp$8.regexp_eatDecimalDigits = function(state) {
+  var start = state.pos;
+  var ch = 0;
+  state.lastIntValue = 0;
+  while (isDecimalDigit(ch = state.current())) {
+    state.lastIntValue = 10 * state.lastIntValue + (ch - 0x30 /* 0 */);
+    state.advance();
+  }
+  return state.pos !== start
+};
+function isDecimalDigit(ch) {
+  return ch >= 0x30 /* 0 */ && ch <= 0x39 /* 9 */
+}
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-HexDigits
+pp$8.regexp_eatHexDigits = function(state) {
+  var start = state.pos;
+  var ch = 0;
+  state.lastIntValue = 0;
+  while (isHexDigit(ch = state.current())) {
+    state.lastIntValue = 16 * state.lastIntValue + hexToInt(ch);
+    state.advance();
+  }
+  return state.pos !== start
+};
+function isHexDigit(ch) {
+  return (
+    (ch >= 0x30 /* 0 */ && ch <= 0x39 /* 9 */) ||
+    (ch >= 0x41 /* A */ && ch <= 0x46 /* F */) ||
+    (ch >= 0x61 /* a */ && ch <= 0x66 /* f */)
+  )
+}
+function hexToInt(ch) {
+  if (ch >= 0x41 /* A */ && ch <= 0x46 /* F */) {
+    return 10 + (ch - 0x41 /* A */)
+  }
+  if (ch >= 0x61 /* a */ && ch <= 0x66 /* f */) {
+    return 10 + (ch - 0x61 /* a */)
+  }
+  return ch - 0x30 /* 0 */
+}
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-annexB-LegacyOctalEscapeSequence
+// Allows only 0-377(octal) i.e. 0-255(decimal).
+pp$8.regexp_eatLegacyOctalEscapeSequence = function(state) {
+  if (this.regexp_eatOctalDigit(state)) {
+    var n1 = state.lastIntValue;
+    if (this.regexp_eatOctalDigit(state)) {
+      var n2 = state.lastIntValue;
+      if (n1 <= 3 && this.regexp_eatOctalDigit(state)) {
+        state.lastIntValue = n1 * 64 + n2 * 8 + state.lastIntValue;
+      } else {
+        state.lastIntValue = n1 * 8 + n2;
+      }
+    } else {
+      state.lastIntValue = n1;
+    }
+    return true
+  }
+  return false
+};
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-OctalDigit
+pp$8.regexp_eatOctalDigit = function(state) {
+  var ch = state.current();
+  if (isOctalDigit(ch)) {
+    state.lastIntValue = ch - 0x30; /* 0 */
+    state.advance();
+    return true
+  }
+  state.lastIntValue = 0;
+  return false
+};
+function isOctalDigit(ch) {
+  return ch >= 0x30 /* 0 */ && ch <= 0x37 /* 7 */
+}
+
+// https://www.ecma-international.org/ecma-262/8.0/#prod-Hex4Digits
+// https://www.ecma-international.org/ecma-262/8.0/#prod-HexDigit
+// And HexDigit HexDigit in https://www.ecma-international.org/ecma-262/8.0/#prod-HexEscapeSequence
+pp$8.regexp_eatFixedHexDigits = function(state, length) {
+  var start = state.pos;
+  state.lastIntValue = 0;
+  for (var i = 0; i < length; ++i) {
+    var ch = state.current();
+    if (!isHexDigit(ch)) {
+      state.pos = start;
+      return false
+    }
+    state.lastIntValue = 16 * state.lastIntValue + hexToInt(ch);
+    state.advance();
+  }
+  return true
+};
+
+// Object type used to represent tokens. Note that normally, tokens
+// simply exist as properties on the parser object. This is only
+// used for the onToken callback and the external tokenizer.
+
+var Token = function Token(p) {
+  this.type = p.type;
+  this.value = p.value;
+  this.start = p.start;
+  this.end = p.end;
+  if (p.options.locations)
+    { this.loc = new SourceLocation(p, p.startLoc, p.endLoc); }
+  if (p.options.ranges)
+    { this.range = [p.start, p.end]; }
+};
+
+// ## Tokenizer
+
+var pp$9 = Parser.prototype;
+
+// Move to the next token
+
+pp$9.next = function(ignoreEscapeSequenceInKeyword) {
+  if (!ignoreEscapeSequenceInKeyword && this.type.keyword && this.containsEsc)
+    { this.raiseRecoverable(this.start, "Escape sequence in keyword " + this.type.keyword); }
+  if (this.options.onToken)
+    { this.options.onToken(new Token(this)); }
+
+  this.lastTokEnd = this.end;
+  this.lastTokStart = this.start;
+  this.lastTokEndLoc = this.endLoc;
+  this.lastTokStartLoc = this.startLoc;
+  this.nextToken();
+};
+
+pp$9.getToken = function() {
+  this.next();
+  return new Token(this)
+};
+
+// If we're in an ES6 environment, make parsers iterable
+if (typeof Symbol !== "undefined")
+  { pp$9[Symbol.iterator] = function() {
+    var this$1 = this;
+
+    return {
+      next: function () {
+        var token = this$1.getToken();
+        return {
+          done: token.type === types.eof,
+          value: token
+        }
+      }
+    }
+  }; }
+
+// Toggle strict mode. Re-reads the next number or string to please
+// pedantic tests (`"use strict"; 010;` should fail).
+
+pp$9.curContext = function() {
+  return this.context[this.context.length - 1]
+};
+
+// Read a single token, updating the parser object's token-related
+// properties.
+
+pp$9.nextToken = function() {
+  var curContext = this.curContext();
+  if (!curContext || !curContext.preserveSpace) { this.skipSpace(); }
+
+  this.start = this.pos;
+  if (this.options.locations) { this.startLoc = this.curPosition(); }
+  if (this.pos >= this.input.length) { return this.finishToken(types.eof) }
+
+  if (curContext.override) { return curContext.override(this) }
+  else { this.readToken(this.fullCharCodeAtPos()); }
+};
+
+pp$9.readToken = function(code) {
+  // Identifier or keyword. '\uXXXX' sequences are allowed in
+  // identifiers, so '\' also dispatches to that.
+  if (isIdentifierStart(code, this.options.ecmaVersion >= 6) || code === 92 /* '\' */)
+    { return this.readWord() }
+
+  return this.getTokenFromCode(code)
+};
+
+pp$9.fullCharCodeAtPos = function() {
+  var code = this.input.charCodeAt(this.pos);
+  if (code <= 0xd7ff || code >= 0xe000) { return code }
+  var next = this.input.charCodeAt(this.pos + 1);
+  return (code << 10) + next - 0x35fdc00
+};
+
+pp$9.skipBlockComment = function() {
+  var startLoc = this.options.onComment && this.curPosition();
+  var start = this.pos, end = this.input.indexOf("*/", this.pos += 2);
+  if (end === -1) { this.raise(this.pos - 2, "Unterminated comment"); }
+  this.pos = end + 2;
+  if (this.options.locations) {
+    lineBreakG.lastIndex = start;
+    var match;
+    while ((match = lineBreakG.exec(this.input)) && match.index < this.pos) {
+      ++this.curLine;
+      this.lineStart = match.index + match[0].length;
+    }
+  }
+  if (this.options.onComment)
+    { this.options.onComment(true, this.input.slice(start + 2, end), start, this.pos,
+                           startLoc, this.curPosition()); }
+};
+
+pp$9.skipLineComment = function(startSkip) {
+  var start = this.pos;
+  var startLoc = this.options.onComment && this.curPosition();
+  var ch = this.input.charCodeAt(this.pos += startSkip);
+  while (this.pos < this.input.length && !isNewLine(ch)) {
+    ch = this.input.charCodeAt(++this.pos);
+  }
+  if (this.options.onComment)
+    { this.options.onComment(false, this.input.slice(start + startSkip, this.pos), start, this.pos,
+                           startLoc, this.curPosition()); }
+};
+
+// Called at the start of the parse and after every token. Skips
+// whitespace and comments, and.
+
+pp$9.skipSpace = function() {
+  loop: while (this.pos < this.input.length) {
+    var ch = this.input.charCodeAt(this.pos);
+    switch (ch) {
+    case 32: case 160: // ' '
+      ++this.pos;
+      break
+    case 13:
+      if (this.input.charCodeAt(this.pos + 1) === 10) {
+        ++this.pos;
+      }
+    case 10: case 8232: case 8233:
+      ++this.pos;
+      if (this.options.locations) {
+        ++this.curLine;
+        this.lineStart = this.pos;
+      }
+      break
+    case 47: // '/'
+      switch (this.input.charCodeAt(this.pos + 1)) {
+      case 42: // '*'
+        this.skipBlockComment();
+        break
+      case 47:
+        this.skipLineComment(2);
+        break
+      default:
+        break loop
+      }
+      break
+    default:
+      if (ch > 8 && ch < 14 || ch >= 5760 && nonASCIIwhitespace.test(String.fromCharCode(ch))) {
+        ++this.pos;
+      } else {
+        break loop
+      }
+    }
+  }
+};
+
+// Called at the end of every token. Sets `end`, `val`, and
+// maintains `context` and `exprAllowed`, and skips the space after
+// the token, so that the next one's `start` will point at the
+// right position.
+
+pp$9.finishToken = function(type, val) {
+  this.end = this.pos;
+  if (this.options.locations) { this.endLoc = this.curPosition(); }
+  var prevType = this.type;
+  this.type = type;
+  this.value = val;
+
+  this.updateContext(prevType);
+};
+
+// ### Token reading
+
+// This is the function that is called to fetch the next token. It
+// is somewhat obscure, because it works in character codes rather
+// than characters, and because operator parsing has been inlined
+// into it.
+//
+// All in the name of speed.
+//
+pp$9.readToken_dot = function() {
+  var next = this.input.charCodeAt(this.pos + 1);
+  if (next >= 48 && next <= 57) { return this.readNumber(true) }
+  var next2 = this.input.charCodeAt(this.pos + 2);
+  if (this.options.ecmaVersion >= 6 && next === 46 && next2 === 46) { // 46 = dot '.'
+    this.pos += 3;
+    return this.finishToken(types.ellipsis)
+  } else {
+    ++this.pos;
+    return this.finishToken(types.dot)
+  }
+};
+
+pp$9.readToken_slash = function() { // '/'
+  var next = this.input.charCodeAt(this.pos + 1);
+  if (this.exprAllowed) { ++this.pos; return this.readRegexp() }
+  if (next === 61) { return this.finishOp(types.assign, 2) }
+  return this.finishOp(types.slash, 1)
+};
+
+pp$9.readToken_mult_modulo_exp = function(code) { // '%*'
+  var next = this.input.charCodeAt(this.pos + 1);
+  var size = 1;
+  var tokentype = code === 42 ? types.star : types.modulo;
+
+  // exponentiation operator ** and **=
+  if (this.options.ecmaVersion >= 7 && code === 42 && next === 42) {
+    ++size;
+    tokentype = types.starstar;
+    next = this.input.charCodeAt(this.pos + 2);
+  }
+
+  if (next === 61) { return this.finishOp(types.assign, size + 1) }
+  return this.finishOp(tokentype, size)
+};
+
+pp$9.readToken_pipe_amp = function(code) { // '|&'
+  var next = this.input.charCodeAt(this.pos + 1);
+  if (next === code) {
+    if (this.options.ecmaVersion >= 12) {
+      var next2 = this.input.charCodeAt(this.pos + 2);
+      if (next2 === 61) { return this.finishOp(types.assign, 3) }
+    }
+    return this.finishOp(code === 124 ? types.logicalOR : types.logicalAND, 2)
+  }
+  if (next === 61) { return this.finishOp(types.assign, 2) }
+  return this.finishOp(code === 124 ? types.bitwiseOR : types.bitwiseAND, 1)
+};
+
+pp$9.readToken_caret = function() { // '^'
+  var next = this.input.charCodeAt(this.pos + 1);
+  if (next === 61) { return this.finishOp(types.assign, 2) }
+  return this.finishOp(types.bitwiseXOR, 1)
+};
+
+pp$9.readToken_plus_min = function(code) { // '+-'
+  var next = this.input.charCodeAt(this.pos + 1);
+  if (next === code) {
+    if (next === 45 && !this.inModule && this.input.charCodeAt(this.pos + 2) === 62 &&
+        (this.lastTokEnd === 0 || lineBreak.test(this.input.slice(this.lastTokEnd, this.pos)))) {
+      // A `-->` line comment
+      this.skipLineComment(3);
+      this.skipSpace();
+      return this.nextToken()
+    }
+    return this.finishOp(types.incDec, 2)
+  }
+  if (next === 61) { return this.finishOp(types.assign, 2) }
+  return this.finishOp(types.plusMin, 1)
+};
+
+pp$9.readToken_lt_gt = function(code) { // '<>'
+  var next = this.input.charCodeAt(this.pos + 1);
+  var size = 1;
+  if (next === code) {
+    size = code === 62 && this.input.charCodeAt(this.pos + 2) === 62 ? 3 : 2;
+    if (this.input.charCodeAt(this.pos + size) === 61) { return this.finishOp(types.assign, size + 1) }
+    return this.finishOp(types.bitShift, size)
+  }
+  if (next === 33 && code === 60 && !this.inModule && this.input.charCodeAt(this.pos + 2) === 45 &&
+      this.input.charCodeAt(this.pos + 3) === 45) {
+    // `<!--`, an XML-style comment that should be interpreted as a line comment
+    this.skipLineComment(4);
+    this.skipSpace();
+    return this.nextToken()
+  }
+  if (next === 61) { size = 2; }
+  return this.finishOp(types.relational, size)
+};
+
+pp$9.readToken_eq_excl = function(code) { // '=!'
+  var next = this.input.charCodeAt(this.pos + 1);
+  if (next === 61) { return this.finishOp(types.equality, this.input.charCodeAt(this.pos + 2) === 61 ? 3 : 2) }
+  if (code === 61 && next === 62 && this.options.ecmaVersion >= 6) { // '=>'
+    this.pos += 2;
+    return this.finishToken(types.arrow)
+  }
+  return this.finishOp(code === 61 ? types.eq : types.prefix, 1)
+};
+
+pp$9.readToken_question = function() { // '?'
+  var ecmaVersion = this.options.ecmaVersion;
+  if (ecmaVersion >= 11) {
+    var next = this.input.charCodeAt(this.pos + 1);
+    if (next === 46) {
+      var next2 = this.input.charCodeAt(this.pos + 2);
+      if (next2 < 48 || next2 > 57) { return this.finishOp(types.questionDot, 2) }
+    }
+    if (next === 63) {
+      if (ecmaVersion >= 12) {
+        var next2$1 = this.input.charCodeAt(this.pos + 2);
+        if (next2$1 === 61) { return this.finishOp(types.assign, 3) }
+      }
+      return this.finishOp(types.coalesce, 2)
+    }
+  }
+  return this.finishOp(types.question, 1)
+};
+
+pp$9.getTokenFromCode = function(code) {
+  switch (code) {
+  // The interpretation of a dot depends on whether it is followed
+  // by a digit or another two dots.
+  case 46: // '.'
+    return this.readToken_dot()
+
+  // Punctuation tokens.
+  case 40: ++this.pos; return this.finishToken(types.parenL)
+  case 41: ++this.pos; return this.finishToken(types.parenR)
+  case 59: ++this.pos; return this.finishToken(types.semi)
+  case 44: ++this.pos; return this.finishToken(types.comma)
+  case 91: ++this.pos; return this.finishToken(types.bracketL)
+  case 93: ++this.pos; return this.finishToken(types.bracketR)
+  case 123: ++this.pos; return this.finishToken(types.braceL)
+  case 125: ++this.pos; return this.finishToken(types.braceR)
+  case 58: ++this.pos; return this.finishToken(types.colon)
+
+  case 96: // '`'
+    if (this.options.ecmaVersion < 6) { break }
+    ++this.pos;
+    return this.finishToken(types.backQuote)
+
+  case 48: // '0'
+    var next = this.input.charCodeAt(this.pos + 1);
+    if (next === 120 || next === 88) { return this.readRadixNumber(16) } // '0x', '0X' - hex number
+    if (this.options.ecmaVersion >= 6) {
+      if (next === 111 || next === 79) { return this.readRadixNumber(8) } // '0o', '0O' - octal number
+      if (next === 98 || next === 66) { return this.readRadixNumber(2) } // '0b', '0B' - binary number
+    }
+
+  // Anything else beginning with a digit is an integer, octal
+  // number, or float.
+  case 49: case 50: case 51: case 52: case 53: case 54: case 55: case 56: case 57: // 1-9
+    return this.readNumber(false)
+
+  // Quotes produce strings.
+  case 34: case 39: // '"', "'"
+    return this.readString(code)
+
+  // Operators are parsed inline in tiny state machines. '=' (61) is
+  // often referred to. `finishOp` simply skips the amount of
+  // characters it is given as second argument, and returns a token
+  // of the type given by its first argument.
+
+  case 47: // '/'
+    return this.readToken_slash()
+
+  case 37: case 42: // '%*'
+    return this.readToken_mult_modulo_exp(code)
+
+  case 124: case 38: // '|&'
+    return this.readToken_pipe_amp(code)
+
+  case 94: // '^'
+    return this.readToken_caret()
+
+  case 43: case 45: // '+-'
+    return this.readToken_plus_min(code)
+
+  case 60: case 62: // '<>'
+    return this.readToken_lt_gt(code)
+
+  case 61: case 33: // '=!'
+    return this.readToken_eq_excl(code)
+
+  case 63: // '?'
+    return this.readToken_question()
+
+  case 126: // '~'
+    return this.finishOp(types.prefix, 1)
+  }
+
+  this.raise(this.pos, "Unexpected character '" + codePointToString$1(code) + "'");
+};
+
+pp$9.finishOp = function(type, size) {
+  var str = this.input.slice(this.pos, this.pos + size);
+  this.pos += size;
+  return this.finishToken(type, str)
+};
+
+pp$9.readRegexp = function() {
+  var escaped, inClass, start = this.pos;
+  for (;;) {
+    if (this.pos >= this.input.length) { this.raise(start, "Unterminated regular expression"); }
+    var ch = this.input.charAt(this.pos);
+    if (lineBreak.test(ch)) { this.raise(start, "Unterminated regular expression"); }
+    if (!escaped) {
+      if (ch === "[") { inClass = true; }
+      else if (ch === "]" && inClass) { inClass = false; }
+      else if (ch === "/" && !inClass) { break }
+      escaped = ch === "\\";
+    } else { escaped = false; }
+    ++this.pos;
+  }
+  var pattern = this.input.slice(start, this.pos);
+  ++this.pos;
+  var flagsStart = this.pos;
+  var flags = this.readWord1();
+  if (this.containsEsc) { this.unexpected(flagsStart); }
+
+  // Validate pattern
+  var state = this.regexpState || (this.regexpState = new RegExpValidationState(this));
+  state.reset(start, pattern, flags);
+  this.validateRegExpFlags(state);
+  this.validateRegExpPattern(state);
+
+  // Create Literal#value property value.
+  var value = null;
+  try {
+    value = new RegExp(pattern, flags);
+  } catch (e) {
+    // ESTree requires null if it failed to instantiate RegExp object.
+    // https://github.com/estree/estree/blob/a27003adf4fd7bfad44de9cef372a2eacd527b1c/es5.md#regexpliteral
+  }
+
+  return this.finishToken(types.regexp, {pattern: pattern, flags: flags, value: value})
+};
+
+// Read an integer in the given radix. Return null if zero digits
+// were read, the integer value otherwise. When `len` is given, this
+// will return `null` unless the integer has exactly `len` digits.
+
+pp$9.readInt = function(radix, len, maybeLegacyOctalNumericLiteral) {
+  // `len` is used for character escape sequences. In that case, disallow separators.
+  var allowSeparators = this.options.ecmaVersion >= 12 && len === undefined;
+
+  // `maybeLegacyOctalNumericLiteral` is true if it doesn't have prefix (0x,0o,0b)
+  // and isn't fraction part nor exponent part. In that case, if the first digit
+  // is zero then disallow separators.
+  var isLegacyOctalNumericLiteral = maybeLegacyOctalNumericLiteral && this.input.charCodeAt(this.pos) === 48;
+
+  var start = this.pos, total = 0, lastCode = 0;
+  for (var i = 0, e = len == null ? Infinity : len; i < e; ++i, ++this.pos) {
+    var code = this.input.charCodeAt(this.pos), val = (void 0);
+
+    if (allowSeparators && code === 95) {
+      if (isLegacyOctalNumericLiteral) { this.raiseRecoverable(this.pos, "Numeric separator is not allowed in legacy octal numeric literals"); }
+      if (lastCode === 95) { this.raiseRecoverable(this.pos, "Numeric separator must be exactly one underscore"); }
+      if (i === 0) { this.raiseRecoverable(this.pos, "Numeric separator is not allowed at the first of digits"); }
+      lastCode = code;
+      continue
+    }
+
+    if (code >= 97) { val = code - 97 + 10; } // a
+    else if (code >= 65) { val = code - 65 + 10; } // A
+    else if (code >= 48 && code <= 57) { val = code - 48; } // 0-9
+    else { val = Infinity; }
+    if (val >= radix) { break }
+    lastCode = code;
+    total = total * radix + val;
+  }
+
+  if (allowSeparators && lastCode === 95) { this.raiseRecoverable(this.pos - 1, "Numeric separator is not allowed at the last of digits"); }
+  if (this.pos === start || len != null && this.pos - start !== len) { return null }
+
+  return total
+};
+
+function stringToNumber(str, isLegacyOctalNumericLiteral) {
+  if (isLegacyOctalNumericLiteral) {
+    return parseInt(str, 8)
+  }
+
+  // `parseFloat(value)` stops parsing at the first numeric separator then returns a wrong value.
+  return parseFloat(str.replace(/_/g, ""))
+}
+
+function stringToBigInt(str) {
+  if (typeof BigInt !== "function") {
+    return null
+  }
+
+  // `BigInt(value)` throws syntax error if the string contains numeric separators.
+  return BigInt(str.replace(/_/g, ""))
+}
+
+pp$9.readRadixNumber = function(radix) {
+  var start = this.pos;
+  this.pos += 2; // 0x
+  var val = this.readInt(radix);
+  if (val == null) { this.raise(this.start + 2, "Expected number in radix " + radix); }
+  if (this.options.ecmaVersion >= 11 && this.input.charCodeAt(this.pos) === 110) {
+    val = stringToBigInt(this.input.slice(start, this.pos));
+    ++this.pos;
+  } else if (isIdentifierStart(this.fullCharCodeAtPos())) { this.raise(this.pos, "Identifier directly after number"); }
+  return this.finishToken(types.num, val)
+};
+
+// Read an integer, octal integer, or floating-point number.
+
+pp$9.readNumber = function(startsWithDot) {
+  var start = this.pos;
+  if (!startsWithDot && this.readInt(10, undefined, true) === null) { this.raise(start, "Invalid number"); }
+  var octal = this.pos - start >= 2 && this.input.charCodeAt(start) === 48;
+  if (octal && this.strict) { this.raise(start, "Invalid number"); }
+  var next = this.input.charCodeAt(this.pos);
+  if (!octal && !startsWithDot && this.options.ecmaVersion >= 11 && next === 110) {
+    var val$1 = stringToBigInt(this.input.slice(start, this.pos));
+    ++this.pos;
+    if (isIdentifierStart(this.fullCharCodeAtPos())) { this.raise(this.pos, "Identifier directly after number"); }
+    return this.finishToken(types.num, val$1)
+  }
+  if (octal && /[89]/.test(this.input.slice(start, this.pos))) { octal = false; }
+  if (next === 46 && !octal) { // '.'
+    ++this.pos;
+    this.readInt(10);
+    next = this.input.charCodeAt(this.pos);
+  }
+  if ((next === 69 || next === 101) && !octal) { // 'eE'
+    next = this.input.charCodeAt(++this.pos);
+    if (next === 43 || next === 45) { ++this.pos; } // '+-'
+    if (this.readInt(10) === null) { this.raise(start, "Invalid number"); }
+  }
+  if (isIdentifierStart(this.fullCharCodeAtPos())) { this.raise(this.pos, "Identifier directly after number"); }
+
+  var val = stringToNumber(this.input.slice(start, this.pos), octal);
+  return this.finishToken(types.num, val)
+};
+
+// Read a string value, interpreting backslash-escapes.
+
+pp$9.readCodePoint = function() {
+  var ch = this.input.charCodeAt(this.pos), code;
+
+  if (ch === 123) { // '{'
+    if (this.options.ecmaVersion < 6) { this.unexpected(); }
+    var codePos = ++this.pos;
+    code = this.readHexChar(this.input.indexOf("}", this.pos) - this.pos);
+    ++this.pos;
+    if (code > 0x10FFFF) { this.invalidStringToken(codePos, "Code point out of bounds"); }
+  } else {
+    code = this.readHexChar(4);
+  }
+  return code
+};
+
+function codePointToString$1(code) {
+  // UTF-16 Decoding
+  if (code <= 0xFFFF) { return String.fromCharCode(code) }
+  code -= 0x10000;
+  return String.fromCharCode((code >> 10) + 0xD800, (code & 1023) + 0xDC00)
+}
+
+pp$9.readString = function(quote) {
+  var out = "", chunkStart = ++this.pos;
+  for (;;) {
+    if (this.pos >= this.input.length) { this.raise(this.start, "Unterminated string constant"); }
+    var ch = this.input.charCodeAt(this.pos);
+    if (ch === quote) { break }
+    if (ch === 92) { // '\'
+      out += this.input.slice(chunkStart, this.pos);
+      out += this.readEscapedChar(false);
+      chunkStart = this.pos;
+    } else {
+      if (isNewLine(ch, this.options.ecmaVersion >= 10)) { this.raise(this.start, "Unterminated string constant"); }
+      ++this.pos;
+    }
+  }
+  out += this.input.slice(chunkStart, this.pos++);
+  return this.finishToken(types.string, out)
+};
+
+// Reads template string tokens.
+
+var INVALID_TEMPLATE_ESCAPE_ERROR = {};
+
+pp$9.tryReadTemplateToken = function() {
+  this.inTemplateElement = true;
+  try {
+    this.readTmplToken();
+  } catch (err) {
+    if (err === INVALID_TEMPLATE_ESCAPE_ERROR) {
+      this.readInvalidTemplateToken();
+    } else {
+      throw err
+    }
+  }
+
+  this.inTemplateElement = false;
+};
+
+pp$9.invalidStringToken = function(position, message) {
+  if (this.inTemplateElement && this.options.ecmaVersion >= 9) {
+    throw INVALID_TEMPLATE_ESCAPE_ERROR
+  } else {
+    this.raise(position, message);
+  }
+};
+
+pp$9.readTmplToken = function() {
+  var out = "", chunkStart = this.pos;
+  for (;;) {
+    if (this.pos >= this.input.length) { this.raise(this.start, "Unterminated template"); }
+    var ch = this.input.charCodeAt(this.pos);
+    if (ch === 96 || ch === 36 && this.input.charCodeAt(this.pos + 1) === 123) { // '`', '${'
+      if (this.pos === this.start && (this.type === types.template || this.type === types.invalidTemplate)) {
+        if (ch === 36) {
+          this.pos += 2;
+          return this.finishToken(types.dollarBraceL)
+        } else {
+          ++this.pos;
+          return this.finishToken(types.backQuote)
+        }
+      }
+      out += this.input.slice(chunkStart, this.pos);
+      return this.finishToken(types.template, out)
+    }
+    if (ch === 92) { // '\'
+      out += this.input.slice(chunkStart, this.pos);
+      out += this.readEscapedChar(true);
+      chunkStart = this.pos;
+    } else if (isNewLine(ch)) {
+      out += this.input.slice(chunkStart, this.pos);
+      ++this.pos;
+      switch (ch) {
+      case 13:
+        if (this.input.charCodeAt(this.pos) === 10) { ++this.pos; }
+      case 10:
+        out += "\n";
+        break
+      default:
+        out += String.fromCharCode(ch);
+        break
+      }
+      if (this.options.locations) {
+        ++this.curLine;
+        this.lineStart = this.pos;
+      }
+      chunkStart = this.pos;
+    } else {
+      ++this.pos;
+    }
+  }
+};
+
+// Reads a template token to search for the end, without validating any escape sequences
+pp$9.readInvalidTemplateToken = function() {
+  for (; this.pos < this.input.length; this.pos++) {
+    switch (this.input[this.pos]) {
+    case "\\":
+      ++this.pos;
+      break
+
+    case "$":
+      if (this.input[this.pos + 1] !== "{") {
+        break
+      }
+    // falls through
+
+    case "`":
+      return this.finishToken(types.invalidTemplate, this.input.slice(this.start, this.pos))
+
+    // no default
+    }
+  }
+  this.raise(this.start, "Unterminated template");
+};
+
+// Used to read escaped characters
+
+pp$9.readEscapedChar = function(inTemplate) {
+  var ch = this.input.charCodeAt(++this.pos);
+  ++this.pos;
+  switch (ch) {
+  case 110: return "\n" // 'n' -> '\n'
+  case 114: return "\r" // 'r' -> '\r'
+  case 120: return String.fromCharCode(this.readHexChar(2)) // 'x'
+  case 117: return codePointToString$1(this.readCodePoint()) // 'u'
+  case 116: return "\t" // 't' -> '\t'
+  case 98: return "\b" // 'b' -> '\b'
+  case 118: return "\u000b" // 'v' -> '\u000b'
+  case 102: return "\f" // 'f' -> '\f'
+  case 13: if (this.input.charCodeAt(this.pos) === 10) { ++this.pos; } // '\r\n'
+  case 10: // ' \n'
+    if (this.options.locations) { this.lineStart = this.pos; ++this.curLine; }
+    return ""
+  case 56:
+  case 57:
+    if (this.strict) {
+      this.invalidStringToken(
+        this.pos - 1,
+        "Invalid escape sequence"
+      );
+    }
+    if (inTemplate) {
+      var codePos = this.pos - 1;
+
+      this.invalidStringToken(
+        codePos,
+        "Invalid escape sequence in template string"
+      );
+
+      return null
+    }
+  default:
+    if (ch >= 48 && ch <= 55) {
+      var octalStr = this.input.substr(this.pos - 1, 3).match(/^[0-7]+/)[0];
+      var octal = parseInt(octalStr, 8);
+      if (octal > 255) {
+        octalStr = octalStr.slice(0, -1);
+        octal = parseInt(octalStr, 8);
+      }
+      this.pos += octalStr.length - 1;
+      ch = this.input.charCodeAt(this.pos);
+      if ((octalStr !== "0" || ch === 56 || ch === 57) && (this.strict || inTemplate)) {
+        this.invalidStringToken(
+          this.pos - 1 - octalStr.length,
+          inTemplate
+            ? "Octal literal in template string"
+            : "Octal literal in strict mode"
+        );
+      }
+      return String.fromCharCode(octal)
+    }
+    if (isNewLine(ch)) {
+      // Unicode new line characters after \ get removed from output in both
+      // template literals and strings
+      return ""
+    }
+    return String.fromCharCode(ch)
+  }
+};
+
+// Used to read character escape sequences ('\x', '\u', '\U').
+
+pp$9.readHexChar = function(len) {
+  var codePos = this.pos;
+  var n = this.readInt(16, len);
+  if (n === null) { this.invalidStringToken(codePos, "Bad character escape sequence"); }
+  return n
+};
+
+// Read an identifier, and return it as a string. Sets `this.containsEsc`
+// to whether the word contained a '\u' escape.
+//
+// Incrementally adds only escaped chars, adding other chunks as-is
+// as a micro-optimization.
+
+pp$9.readWord1 = function() {
+  this.containsEsc = false;
+  var word = "", first = true, chunkStart = this.pos;
+  var astral = this.options.ecmaVersion >= 6;
+  while (this.pos < this.input.length) {
+    var ch = this.fullCharCodeAtPos();
+    if (isIdentifierChar(ch, astral)) {
+      this.pos += ch <= 0xffff ? 1 : 2;
+    } else if (ch === 92) { // "\"
+      this.containsEsc = true;
+      word += this.input.slice(chunkStart, this.pos);
+      var escStart = this.pos;
+      if (this.input.charCodeAt(++this.pos) !== 117) // "u"
+        { this.invalidStringToken(this.pos, "Expecting Unicode escape sequence \\uXXXX"); }
+      ++this.pos;
+      var esc = this.readCodePoint();
+      if (!(first ? isIdentifierStart : isIdentifierChar)(esc, astral))
+        { this.invalidStringToken(escStart, "Invalid Unicode escape"); }
+      word += codePointToString$1(esc);
+      chunkStart = this.pos;
+    } else {
+      break
+    }
+    first = false;
+  }
+  return word + this.input.slice(chunkStart, this.pos)
+};
+
+// Read an identifier or keyword token. Will check for reserved
+// words when necessary.
+
+pp$9.readWord = function() {
+  var word = this.readWord1();
+  var type = types.name;
+  if (this.keywords.test(word)) {
+    type = keywords$1[word];
+  }
+  return this.finishToken(type, word)
+};
+
+// Acorn is a tiny, fast JavaScript parser written in JavaScript.
+
+var version = "8.0.5";
+
+Parser.acorn = {
+  Parser: Parser,
+  version: version,
+  defaultOptions: defaultOptions,
+  Position: Position,
+  SourceLocation: SourceLocation,
+  getLineInfo: getLineInfo,
+  Node: Node,
+  TokenType: TokenType,
+  tokTypes: types,
+  keywordTypes: keywords$1,
+  TokContext: TokContext,
+  tokContexts: types$1,
+  isIdentifierChar: isIdentifierChar,
+  isIdentifierStart: isIdentifierStart,
+  Token: Token,
+  isNewLine: isNewLine,
+  lineBreak: lineBreak,
+  lineBreakG: lineBreakG,
+  nonASCIIwhitespace: nonASCIIwhitespace
+};
+
+// The main exported interface (under `self.acorn` when in the
+// browser) is a `parse` function that takes a code string and
+// returns an abstract syntax tree as specified by [Mozilla parser
+// API][api].
+//
+// [api]: https://developer.mozilla.org/en-US/docs/SpiderMonkey/Parser_API
+
+function parse(input, options) {
+  return Parser.parse(input, options)
+}
+
+// This function tries to parse a single expression at a given
+// offset in a string. Useful for parsing mixed-language formats
+// that embed JavaScript expressions.
+
+function parseExpressionAt(input, pos, options) {
+  return Parser.parseExpressionAt(input, pos, options)
+}
+
+// Acorn is organized as a tokenizer and a recursive-descent parser.
+// The `tokenizer` export provides an interface to the tokenizer.
+
+function tokenizer(input, options) {
+  return Parser.tokenizer(input, options)
+}
+
+export { Node, Parser, Position, SourceLocation, TokContext, Token, TokenType, defaultOptions, getLineInfo, isIdentifierChar, isIdentifierStart, isNewLine, keywords$1 as keywordTypes, lineBreak, lineBreakG, nonASCIIwhitespace, parse, parseExpressionAt, types$1 as tokContexts, types as tokTypes, tokenizer, version };
+//# sourceMappingURL=acorn.mjs.map
diff --git a/ddb_main/react-jsx-parser/source/components/JsxParser.tsx b/ddb_main/react-jsx-parser/source/components/JsxParser.tsx
new file mode 100644
index 0000000..d40b15d
--- /dev/null
+++ b/ddb_main/react-jsx-parser/source/components/JsxParser.tsx
@@ -0,0 +1,349 @@
+/* global JSX */
+import * as Acorn from 'acorn'
+import * as AcornJSX from 'acorn-jsx'
+import React, { Fragment, ComponentType, ExoticComponent } from 'react'
+import ATTRIBUTES from '../constants/attributeNames'
+import { canHaveChildren, canHaveWhitespace } from '../constants/specialTags'
+import { randomHash } from '../helpers/hash'
+import { parseStyle } from '../helpers/parseStyle'
+import { resolvePath } from '../helpers/resolvePath'
+
+type ParsedJSX = JSX.Element | boolean | string
+type ParsedTree = ParsedJSX | ParsedJSX[] | null
+export type TProps = {
+	allowUnknownElements?: boolean,
+	autoCloseVoidElements?: boolean,
+	bindings?: { [key: string]: unknown; },
+	blacklistedAttrs?: Array<string | RegExp>,
+	blacklistedTags?: string[],
+	className?: string,
+	components?: Record<string, ComponentType | ExoticComponent>,
+	componentsOnly?: boolean,
+	disableFragments?: boolean,
+	disableKeyGeneration?: boolean,
+	jsx?: string,
+	onError?: (error: Error) => void,
+	showWarnings?: boolean,
+	renderError?: (props: { error: string }) => JSX.Element | null,
+	renderInWrapper?: boolean,
+	renderUnrecognized?: (tagName: string) => JSX.Element | null,
+}
+type Scope = Record<string, any>
+
+/* eslint-disable consistent-return */
+export default class JsxParser extends React.Component<TProps> {
+	static displayName = 'JsxParser'
+	static defaultProps: TProps = {
+		allowUnknownElements: true,
+		autoCloseVoidElements: false,
+		bindings: {},
+		blacklistedAttrs: [/^on.+/i],
+		blacklistedTags: ['script'],
+		className: '',
+		components: {},
+		componentsOnly: false,
+		disableFragments: false,
+		disableKeyGeneration: false,
+		jsx: '',
+		onError: () => { },
+		showWarnings: false,
+		renderError: undefined,
+		renderInWrapper: true,
+		renderUnrecognized: () => null,
+	}
+
+	private ParsedChildren: ParsedTree = null
+
+	#parseJSX = (jsx: string): JSX.Element | JSX.Element[] | null => {
+		const parser = Acorn.Parser.extend(AcornJSX.default({
+			autoCloseVoidElements: this.props.autoCloseVoidElements,
+		}))
+		const wrappedJsx = `<root>${jsx}</root>`
+		let parsed: AcornJSX.Expression[] = []
+		try {
+			// @ts-ignore - AcornJsx doesn't have typescript typings
+			parsed = parser.parse(wrappedJsx, { ecmaVersion: 'latest' })
+			// @ts-ignore - AcornJsx doesn't have typescript typings
+			parsed = parsed.body[0].expression.children || []
+		} catch (error) {
+			if (this.props.showWarnings) console.warn(error) // eslint-disable-line no-console
+			if (this.props.onError) this.props.onError(error)
+			if (this.props.renderError) {
+				return this.props.renderError({ error: String(error) })
+			}
+			return null
+		}
+
+		return parsed.map(p => this.#parseExpression(p)).filter(Boolean)
+	}
+
+	#parseExpression = (expression: AcornJSX.Expression, scope?: Scope): any => {
+		switch (expression.type) {
+		case 'JSXAttribute':
+			if (expression.value === null) return true
+			return this.#parseExpression(expression.value, scope)
+		case 'JSXElement':
+		case 'JSXFragment':
+			return this.#parseElement(expression, scope)
+		case 'JSXExpressionContainer':
+			return this.#parseExpression(expression.expression, scope)
+		case 'JSXText':
+			const key = this.props.disableKeyGeneration ? undefined : randomHash()
+			return this.props.disableFragments
+				? expression.value
+				: <Fragment key={key}>{expression.value}</Fragment>
+		case 'ArrayExpression':
+			return expression.elements.map(ele => this.#parseExpression(ele, scope)) as ParsedTree
+		case 'BinaryExpression':
+			/* eslint-disable eqeqeq,max-len */
+			switch (expression.operator) {
+			case '-': return this.#parseExpression(expression.left) - this.#parseExpression(expression.right)
+			case '!=': return this.#parseExpression(expression.left) != this.#parseExpression(expression.right)
+			case '!==': return this.#parseExpression(expression.left) !== this.#parseExpression(expression.right)
+			case '*': return this.#parseExpression(expression.left) * this.#parseExpression(expression.right)
+			case '**': return this.#parseExpression(expression.left) ** this.#parseExpression(expression.right)
+			case '/': return this.#parseExpression(expression.left) / this.#parseExpression(expression.right)
+			case '%': return this.#parseExpression(expression.left) % this.#parseExpression(expression.right)
+			case '+': return this.#parseExpression(expression.left) + this.#parseExpression(expression.right)
+			case '<': return this.#parseExpression(expression.left) < this.#parseExpression(expression.right)
+			case '<=': return this.#parseExpression(expression.left) <= this.#parseExpression(expression.right)
+			case '==': return this.#parseExpression(expression.left) == this.#parseExpression(expression.right)
+			case '===': return this.#parseExpression(expression.left) === this.#parseExpression(expression.right)
+			case '>': return this.#parseExpression(expression.left) > this.#parseExpression(expression.right)
+			case '>=': return this.#parseExpression(expression.left) >= this.#parseExpression(expression.right)
+				/* eslint-enable eqeqeq,max-len */
+			}
+			return undefined
+		case 'CallExpression':
+			const parsedCallee = this.#parseExpression(expression.callee)
+			if (parsedCallee === undefined) {
+				this.props.onError!(new Error(`The expression '${expression.callee}' could not be resolved, resulting in an undefined return value.`))
+				return undefined
+			}
+			return parsedCallee(...expression.arguments.map(
+				arg => this.#parseExpression(arg, expression.callee),
+			))
+		case 'ConditionalExpression':
+			return this.#parseExpression(expression.test)
+				? this.#parseExpression(expression.consequent)
+				: this.#parseExpression(expression.alternate)
+		case 'ExpressionStatement':
+			return this.#parseExpression(expression.expression)
+		case 'Identifier':
+			if (scope && expression.name in scope) {
+				return scope[expression.name]
+			}
+			return (this.props.bindings || {})[expression.name]
+
+		case 'Literal':
+			return expression.value
+		case 'LogicalExpression':
+			const left = this.#parseExpression(expression.left)
+			if (expression.operator === '||' && left) return left
+			if ((expression.operator === '&&' && left) || (expression.operator === '||' && !left)) {
+				return this.#parseExpression(expression.right)
+			}
+			return false
+		case 'MemberExpression':
+			return this.#parseMemberExpression(expression, scope)
+		case 'ObjectExpression':
+			const object: Record<string, any> = {}
+			expression.properties.forEach(prop => {
+				object[prop.key.name! || prop.key.value!] = this.#parseExpression(prop.value)
+			})
+			return object
+		case 'TemplateElement':
+			return expression.value.cooked
+		case 'TemplateLiteral':
+			return [...expression.expressions, ...expression.quasis]
+				.sort((a, b) => {
+					if (a.start < b.start) return -1
+					return 1
+				})
+				.map(item => this.#parseExpression(item))
+				.join('')
+		case 'UnaryExpression':
+			switch (expression.operator) {
+			case '+': return expression.argument.value
+			case '-': return -expression.argument.value
+			case '!': return !expression.argument.value
+			}
+			return undefined
+		case 'ArrowFunctionExpression':
+			if (expression.async || expression.generator) {
+				this.props.onError?.(new Error('Async and generator arrow functions are not supported.'))
+			}
+			return (...args: any[]) : any => {
+				const functionScope: Record<string, any> = {}
+				expression.params.forEach((param, idx) => {
+					functionScope[param.name] = args[idx]
+				})
+				return this.#parseExpression(expression.body, functionScope)
+			}
+		}
+	}
+
+	#parseMemberExpression = (expression: AcornJSX.MemberExpression, scope?: Scope): any => {
+		// eslint-disable-next-line prefer-destructuring
+		let { object } = expression
+		const path = [expression.property?.name ?? JSON.parse(expression.property?.raw ?? '""')]
+
+		if (expression.object.type !== 'Literal') {
+			while (object && ['MemberExpression', 'Literal'].includes(object?.type)) {
+				const { property } = (object as AcornJSX.MemberExpression)
+				if ((object as AcornJSX.MemberExpression).computed) {
+					path.unshift(this.#parseExpression(property!, scope))
+				} else {
+					path.unshift(property?.name ?? JSON.parse(property?.raw ?? '""'))
+				}
+
+				object = (object as AcornJSX.MemberExpression).object
+			}
+		}
+
+		const target = this.#parseExpression(object, scope)
+		try {
+			let parent = target
+			const member = path.reduce((value, next) => {
+				parent = value
+				return value[next]
+			}, target)
+			if (typeof member === 'function') return member.bind(parent)
+
+			return member
+		} catch {
+			const name = (object as AcornJSX.MemberExpression)?.name || 'unknown'
+			this.props.onError!(new Error(`Unable to parse ${name}["${path.join('"]["')}"]}`))
+		}
+	}
+
+	#parseName = (element: AcornJSX.JSXIdentifier | AcornJSX.JSXMemberExpression): string => {
+		if (element.type === 'JSXIdentifier') { return element.name }
+		return `${this.#parseName(element.object)}.${this.#parseName(element.property)}`
+	}
+
+	#parseElement = (
+		element: AcornJSX.JSXElement | AcornJSX.JSXFragment,
+		scope?: Scope,
+	): JSX.Element | JSX.Element[] | null => {
+		const { allowUnknownElements, components, componentsOnly, onError } = this.props
+		const { children: childNodes = [] } = element
+		const openingTag = element.type === 'JSXElement'
+			? element.openingElement
+			: element.openingFragment
+		const { attributes = [] } = openingTag
+		const name = element.type === 'JSXElement'
+			? this.#parseName(openingTag.name)
+			: ''
+
+		const blacklistedAttrs = (this.props.blacklistedAttrs || [])
+			.map(attr => (attr instanceof RegExp ? attr : new RegExp(attr, 'i')))
+		const blacklistedTags = (this.props.blacklistedTags || [])
+			.map(tag => tag.trim().toLowerCase()).filter(Boolean)
+
+		if (/^(html|head|body)$/i.test(name)) {
+			return childNodes.map(c => this.#parseElement(c, scope)) as JSX.Element[]
+		}
+		const tagName = name.trim().toLowerCase()
+		if (blacklistedTags.indexOf(tagName) !== -1) {
+			onError!(new Error(`The tag <${name}> is blacklisted, and will not be rendered.`))
+			return null
+		}
+
+		if (name !== '' && !resolvePath(components, name)) {
+			if (componentsOnly) {
+				onError!(new Error(`The component <${name}> is unrecognized, and will not be rendered.`))
+				return this.props.renderUnrecognized!(name)
+			}
+
+			if (!allowUnknownElements && document.createElement(name) instanceof HTMLUnknownElement) {
+				onError!(new Error(`The tag <${name}> is unrecognized in this browser, and will not be rendered.`))
+				return this.props.renderUnrecognized!(name)
+			}
+		}
+
+		let children
+		const component = element.type === 'JSXElement'
+			? resolvePath(components, name)
+			: Fragment
+
+		if (component || canHaveChildren(name)) {
+			children = childNodes.map(node => this.#parseExpression(node, scope))
+			if (!component && !canHaveWhitespace(name)) {
+				children = children.filter(child => (
+					typeof child !== 'string' || !/^\s*$/.test(child)
+				))
+			}
+
+			if (children.length === 0) {
+				children = undefined
+			} else if (children.length === 1) {
+				[children] = children
+			} else if (children.length > 1 && !this.props.disableKeyGeneration) {
+				// Add `key` to any child that is a react element (by checking if it has `.type`) if one
+				// does not already exist.
+				children = children.map((child, key) => (
+					(child?.type && !child?.key) ? { ...child, key: child.key || key } : child
+				))
+			}
+		}
+
+		const props: { [key: string]: any } = {
+			key: this.props.disableKeyGeneration ? undefined : randomHash(),
+		}
+		attributes.forEach( // eslint-disable-next-line max-len
+			(expr: AcornJSX.JSXAttribute | AcornJSX.JSXAttributeExpression | AcornJSX.JSXSpreadAttribute) => {
+				if (expr.type === 'JSXAttribute') {
+					const rawName = expr.name.name
+					const attributeName = ATTRIBUTES[rawName] || rawName
+					// if the value is null, this is an implicitly "true" prop, such as readOnly
+					const value = this.#parseExpression(expr, scope)
+
+					const matches = blacklistedAttrs.filter(re => re.test(attributeName))
+					if (matches.length === 0) {
+						props[attributeName] = value
+					}
+				} else if (
+					(expr.type === 'JSXSpreadAttribute' && expr.argument.type === 'Identifier')
+					|| expr.argument!.type === 'MemberExpression'
+				) {
+					const value = this.#parseExpression(expr.argument!, scope)
+					if (typeof value === 'object') {
+						Object.keys(value).forEach(rawName => {
+							const attributeName: string = ATTRIBUTES[rawName] || rawName
+							const matches = blacklistedAttrs.filter(re => re.test(attributeName))
+							if (matches.length === 0) {
+								props[attributeName] = value[rawName]
+							}
+						})
+					}
+				}
+			},
+		)
+
+		if (typeof props.style === 'string') {
+			props.style = parseStyle(props.style)
+		}
+		const lowerName = name.toLowerCase()
+		if (lowerName === 'option') {
+			children = children.props.children
+		}
+
+		return React.createElement(component || lowerName, props, children)
+	}
+
+	render = (): JSX.Element => {
+		const jsx = (this.props.jsx || '').trim().replace(/<!DOCTYPE([^>]*)>/g, '')
+		this.ParsedChildren = this.#parseJSX(jsx)
+		const className = [...new Set(['jsx-parser', ...String(this.props.className).split(' ')])]
+			.filter(Boolean)
+			.join(' ')
+
+		return (
+			this.props.renderInWrapper
+				? <div className={className}>{this.ParsedChildren}</div>
+				: <>{this.ParsedChildren}</>
+		)
+	}
+}
+/* eslint-enable consistent-return */
diff --git a/ddb_main/react-jsx-parser/source/constants/attributeNames.ts b/ddb_main/react-jsx-parser/source/constants/attributeNames.ts
new file mode 100644
index 0000000..5692314
--- /dev/null
+++ b/ddb_main/react-jsx-parser/source/constants/attributeNames.ts
@@ -0,0 +1,7 @@
+export default {
+	class: 'className',
+	for: 'htmlFor',
+	maxlength: 'maxLength',
+	colspan: 'colSpan',
+	rowspan: 'rowSpan',
+} as Record<string, string>
diff --git a/ddb_main/react-jsx-parser/source/constants/specialTags.ts b/ddb_main/react-jsx-parser/source/constants/specialTags.ts
new file mode 100644
index 0000000..6812f9e
--- /dev/null
+++ b/ddb_main/react-jsx-parser/source/constants/specialTags.ts
@@ -0,0 +1,35 @@
+const VOID_ELEMENTS = [
+	'area',
+	'base',
+	'br',
+	'col',
+	'embed',
+	'hr',
+	'img',
+	'input',
+	'keygen',
+	'link',
+	'menuitem',
+	'meta',
+	'param',
+	'source',
+	'track',
+	'wbr',
+]
+
+const NO_WHITESPACE = [
+	'table',
+	'tbody',
+	'tfoot',
+	'thead',
+	'tr',
+]
+
+export default VOID_ELEMENTS
+
+export function canHaveChildren(tagName: string): boolean {
+	return VOID_ELEMENTS.indexOf(tagName.toLowerCase()) === -1
+}
+export function canHaveWhitespace(tagName: string): boolean {
+	return NO_WHITESPACE.indexOf(tagName.toLowerCase()) !== -1
+}
diff --git a/ddb_main/react-jsx-parser/source/helpers/camelCase.ts b/ddb_main/react-jsx-parser/source/helpers/camelCase.ts
new file mode 100644
index 0000000..b230a15
--- /dev/null
+++ b/ddb_main/react-jsx-parser/source/helpers/camelCase.ts
@@ -0,0 +1,15 @@
+/**
+ * Converts a string from other cases to camelCase
+ * @param string the value to camelCase
+ * @example
+ * camelCase('foo-bar') // 'fooBar'
+ */
+export const camelCase = (string: string) => string
+	.replace(/([A-Z])([A-Z])/g, '$1 $2')
+	.replace(/([a-z])([A-Z])/g, '$1 $2')
+	.replace(/[^a-zA-Z\u00C0-\u00ff]/g, ' ')
+	.toLowerCase()
+	.split(' ')
+	.filter(value => value)
+	.map((s, i) => (i > 0 ? s[0].toUpperCase() + s.slice(1) : s))
+	.join('')
diff --git a/ddb_main/react-jsx-parser/source/helpers/hash.ts b/ddb_main/react-jsx-parser/source/helpers/hash.ts
new file mode 100644
index 0000000..a47712d
--- /dev/null
+++ b/ddb_main/react-jsx-parser/source/helpers/hash.ts
@@ -0,0 +1,21 @@
+/**
+ * Hashes a value
+ * @param value the value to hash
+ * @param radix the base-n to hash into (default 16)
+ */
+export const hash = (value: string = '', radix: number = 16): string => {
+	const string = String(value)
+	let h = 0
+	string.split('').forEach((char: string) => {
+		/* eslint-disable no-bitwise */
+		h = ((h << 5) - h) + char.charCodeAt(0)
+		h &= h // Convert to 32-bit integer
+		/* eslint-enable no-bitwise */
+	})
+	return Math.abs(h).toString(radix)
+}
+
+/**
+ * Hashes a Math.random() value, returning it in base16
+ */
+export const randomHash = () => hash(Math.random().toString())
diff --git a/ddb_main/react-jsx-parser/source/helpers/parseStyle.ts b/ddb_main/react-jsx-parser/source/helpers/parseStyle.ts
new file mode 100644
index 0000000..a208513
--- /dev/null
+++ b/ddb_main/react-jsx-parser/source/helpers/parseStyle.ts
@@ -0,0 +1,29 @@
+import { camelCase } from './camelCase'
+
+type Style = string | Partial<CSSStyleDeclaration>
+
+/**
+ * Converts a CSS Style string
+ * @param {string | Partial<CSSStyleDeclaration>} style A string to convert, or object to return
+ * @returns {Partial<CSSStyleDeclaration>} a partial CSSStyleDeclaration
+ */
+export const parseStyle = (style: Style): Partial<CSSStyleDeclaration> | undefined => {
+	switch (typeof style) {
+	case 'string':
+		return style.split(';').filter(r => r)
+			.reduce((map, rule) => {
+				const name = rule.slice(0, rule.indexOf(':')).trim()
+				const value = rule.slice(rule.indexOf(':') + 1).trim()
+
+				return {
+					...map,
+					[camelCase(name)]: value,
+				}
+			}, {})
+	case 'object':
+		return style
+
+	default:
+		return undefined
+	}
+}
diff --git a/ddb_main/react-jsx-parser/source/helpers/resolvePath.ts b/ddb_main/react-jsx-parser/source/helpers/resolvePath.ts
new file mode 100644
index 0000000..ff412f3
--- /dev/null
+++ b/ddb_main/react-jsx-parser/source/helpers/resolvePath.ts
@@ -0,0 +1,26 @@
+const pathToArrayPath = (path: string) => {
+	if (path == null || path === '') return []
+	return path.split('.')
+}
+
+const resolveArrayPath = (object: any, path: string[]): string | undefined => {
+	const [property, ...subPath] = path
+	if (object == null || property == null) {
+		return undefined
+	}
+	return subPath.length === 0
+		? object[property]
+		: resolveArrayPath(object[property], subPath)
+}
+
+/**
+ * Returns the result of a path query from an object
+ * @param {any} object the object to search
+ * @param {string} path the path, whose value will be retrieved
+ * @returns {any} the value (undefined if the path doesn't exist)
+ * @example
+ * resolvePath({ foo: { bar: { baz: 3 } } }, 'foo.bar.baz') // 3
+ */
+export const resolvePath = (object: any, path: string): any => (
+	resolveArrayPath(object, pathToArrayPath(path))
+)
diff --git a/ddb_main/react-jsx-parser/webpack/bootstrap b/ddb_main/react-jsx-parser/webpack/bootstrap
new file mode 100644
index 0000000..ae49597
--- /dev/null
+++ b/ddb_main/react-jsx-parser/webpack/bootstrap
@@ -0,0 +1,23 @@
+// The module cache
+var __webpack_module_cache__ = {};
+
+// The require function
+function __webpack_require__(moduleId) {
+	// Check if module is in cache
+	if(__webpack_module_cache__[moduleId]) {
+		return __webpack_module_cache__[moduleId].exports;
+	}
+	// Create a new module (and put it into the cache)
+	var module = __webpack_module_cache__[moduleId] = {
+		// no module.id needed
+		// no module.loaded needed
+		exports: {}
+	};
+
+	// Execute the module function
+	__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+
+	// Return the exports of the module
+	return module.exports;
+}
+
diff --git a/ddb_main/react-jsx-parser/webpack/runtime/compat get default export b/ddb_main/react-jsx-parser/webpack/runtime/compat get default export
new file mode 100644
index 0000000..3a06ef5
--- /dev/null
+++ b/ddb_main/react-jsx-parser/webpack/runtime/compat get default export	
@@ -0,0 +1,8 @@
+// getDefaultExport function for compatibility with non-harmony modules
+__webpack_require__.n = (module) => {
+	var getter = module && module.__esModule ?
+		() => (module['default']) :
+		() => (module);
+	__webpack_require__.d(getter, { a: getter });
+	return getter;
+};
\ No newline at end of file
diff --git a/ddb_main/react-jsx-parser/webpack/runtime/define property getters b/ddb_main/react-jsx-parser/webpack/runtime/define property getters
new file mode 100644
index 0000000..6d4b7a5
--- /dev/null
+++ b/ddb_main/react-jsx-parser/webpack/runtime/define property getters	
@@ -0,0 +1,8 @@
+// define getter functions for harmony exports
+__webpack_require__.d = (exports, definition) => {
+	for(var key in definition) {
+		if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+			Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+		}
+	}
+};
\ No newline at end of file
diff --git a/ddb_main/react-jsx-parser/webpack/runtime/hasOwnProperty shorthand b/ddb_main/react-jsx-parser/webpack/runtime/hasOwnProperty shorthand
new file mode 100644
index 0000000..d82c3b8
--- /dev/null
+++ b/ddb_main/react-jsx-parser/webpack/runtime/hasOwnProperty shorthand	
@@ -0,0 +1 @@
+__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
\ No newline at end of file
diff --git a/ddb_main/react-jsx-parser/webpack/runtime/make namespace object b/ddb_main/react-jsx-parser/webpack/runtime/make namespace object
new file mode 100644
index 0000000..02445d9
--- /dev/null
+++ b/ddb_main/react-jsx-parser/webpack/runtime/make namespace object	
@@ -0,0 +1,7 @@
+// define __esModule on exports
+__webpack_require__.r = (exports) => {
+	if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+		Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+	}
+	Object.defineProperty(exports, '__esModule', { value: true });
+};
\ No newline at end of file
diff --git a/ddb_main/react-jsx-parser/webpack/startup b/ddb_main/react-jsx-parser/webpack/startup
new file mode 100644
index 0000000..e6f8a92
--- /dev/null
+++ b/ddb_main/react-jsx-parser/webpack/startup
@@ -0,0 +1,4 @@
+// module exports must be returned from runtime so entry inlining is disabled
+// startup
+// Load entry module and return exports
+return __webpack_require__(272);
diff --git a/ddb_main/react-jsx-parser/webpack/universalModuleDefinition b/ddb_main/react-jsx-parser/webpack/universalModuleDefinition
new file mode 100644
index 0000000..463d448
--- /dev/null
+++ b/ddb_main/react-jsx-parser/webpack/universalModuleDefinition
@@ -0,0 +1,11 @@
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory(require("react"));
+	else if(typeof define === 'function' && define.amd)
+		define("react-jsx-parser", ["react"], factory);
+	else if(typeof exports === 'object')
+		exports["react-jsx-parser"] = factory(require("react"));
+	else
+		root["react-jsx-parser"] = factory(root["react"]);
+})(this, function(__WEBPACK_EXTERNAL_MODULE__297__) {
+return 
\ No newline at end of file
diff --git a/ddb_main/routes/index.tsx b/ddb_main/routes/index.tsx
new file mode 100644
index 0000000..9f272ad
--- /dev/null
+++ b/ddb_main/routes/index.tsx
@@ -0,0 +1,173 @@
+import { useQuery } from "react-query";
+import { useMatch } from "react-router-dom";
+import { Routes as Router, Route, Navigate } from "react-router-dom";
+
+import config from "../config";
+import { useAuth } from "../contexts/Authentication";
+import { getCharacters } from "../helpers/characterServiceApi";
+import type { AppUserState } from "../hooks/useUser";
+import { getStatus } from "../state/selectors/characterUtils";
+import { MyCharacters } from "../subApps/listing";
+import { getUrlWithParams } from "../tools/js/CharacterBuilder/utils/navigationUtils";
+import { CharacterStatusEnum, QueryResponseData } from "../types";
+import MaxCharactersMessage from "./max-characters-message";
+import SheetBuilderApp from "./sheet-builder-app";
+
+const BASE_PATHNAME = config.basePathname;
+
+/**
+ *
+ * RequireAuth checks if you are logged in and redirects to the login page if you are not.
+ * To use just wrap your element prop in a Route component in it.
+ * For example a the Character Sheet has a AnonymousRoute view so it is not wrapped in a RequireAuth.
+ */
+function RequireAuth({ children }: { children: JSX.Element }) {
+  let user = useAuth();
+  const isCharactersListing = useMatch({ path: BASE_PATHNAME, end: true });
+
+  // loading state
+  if (user === undefined) {
+    return null;
+  }
+  // not authenticated
+  if (user === null) {
+    // Should only ever happen in local dev when not using app-shell locally
+    // if you remove this it will reveal a memory leak :)
+    if (process.env.NODE_ENV === "development" && isCharactersListing) {
+      return (
+        <div>{"YOU ARE NOT LOGGED IN. THIS VIEW IS HANDLED BY APP SHELL"}</div>
+      );
+    }
+
+    window.location.href = getUrlWithParams();
+  }
+  // authenticated
+  return children;
+}
+
+/**
+ *
+ * GetCharacters uses the renderProp pattern to handle requiring getting all characters. when a user is logged in.
+ * This ensure that locked users are not able to use this part of the app until the resolved thier locked characters.
+ * This was setup this way to avoid having to make a new api call to get the characters when the user is Anonymous.
+ * Therefore, keeping our api calls to a minimum and minimizing errors from failed api calls.
+ * Note: this could be simpler but complexity was added to make typescript happy.
+ */
+function GetCallCharacters({
+  children,
+}: {
+  children: (QueryResponseData) => void;
+}): JSX.Element {
+  const isCharactersListing = useMatch({ path: BASE_PATHNAME, end: true });
+
+  const { isLoading, data, refetch, error } = useQuery<
+    QueryResponseData,
+    Error
+  >("repoData", () => getCharacters(), {
+    refetchOnWindowFocus: false,
+    refetchInterval: 24 * 60 * 60 * 1000,
+  });
+  if (isLoading) {
+    return <>{null}</>;
+  }
+  if (!error && data?.data?.canUnlockCharacters && !isCharactersListing) {
+    return (
+      <>
+        <Navigate to={BASE_PATHNAME} replace />
+      </>
+    );
+  }
+  return <>{children({ isLoading, data, refetch, error })}</>;
+}
+
+type AppRoute = {
+  path: string;
+  element: JSX.Element;
+};
+
+const getRoutes = (user: AppUserState): Array<AppRoute> => [
+  {
+    path: `${BASE_PATHNAME}/builder/*`,
+    element: (
+      <RequireAuth>
+        <GetCallCharacters>
+          {({ data }) => {
+            const numberOfCharacters =
+              data?.data?.characters?.filter(
+                (character) =>
+                  getStatus(character) === CharacterStatusEnum.Active
+              ).length ?? 0;
+            const maxCharacterSlotsAllowed =
+              data?.data?.characterSlotLimit ?? Infinity;
+            const hasMaxCharacters =
+              numberOfCharacters >= maxCharacterSlotsAllowed;
+            if (hasMaxCharacters) {
+              return (
+                <Navigate to={`${BASE_PATHNAME}/max-characters`} replace />
+              );
+            }
+            return <SheetBuilderApp />;
+          }}
+        </GetCallCharacters>
+      </RequireAuth>
+    ),
+  },
+  {
+    path: `${BASE_PATHNAME}/:characterId/builder/*`,
+    element: (
+      <RequireAuth>
+        <GetCallCharacters>{() => <SheetBuilderApp />}</GetCallCharacters>
+      </RequireAuth>
+    ),
+  },
+  {
+    path: `${BASE_PATHNAME}/:characterId/:shareId`,
+    element: user ? (
+      <GetCallCharacters>{() => <SheetBuilderApp />}</GetCallCharacters>
+    ) : (
+      <SheetBuilderApp />
+    ),
+  },
+  {
+    path: `${BASE_PATHNAME}/:characterId`,
+    element: user ? (
+      <GetCallCharacters>{() => <SheetBuilderApp />}</GetCallCharacters>
+    ) : (
+      <SheetBuilderApp />
+    ),
+  },
+  {
+    path: `${BASE_PATHNAME}/max-characters`,
+    element: <MaxCharactersMessage />,
+  },
+  {
+    path: BASE_PATHNAME,
+    element: (
+      <RequireAuth>
+        <GetCallCharacters>
+          {({ isLoading, data, refetch, error }) => (
+            <MyCharacters
+              characterQuery={{ isLoading, data, refetch, error }}
+            />
+          )}
+        </GetCallCharacters>
+      </RequireAuth>
+    ),
+  },
+  {
+    path: "/",
+    element: <Navigate to={BASE_PATHNAME} replace />,
+  },
+];
+
+export const Routes = () => {
+  const user = useAuth();
+
+  return (
+    <Router>
+      {getRoutes(user).map((props: AppRoute) => (
+        <Route key={props.path} {...props} />
+      ))}
+    </Router>
+  );
+};
diff --git a/ddb_main/routes/max-characters-message.tsx b/ddb_main/routes/max-characters-message.tsx
new file mode 100644
index 0000000..eb2a9b0
--- /dev/null
+++ b/ddb_main/routes/max-characters-message.tsx
@@ -0,0 +1,34 @@
+import Box from "@mui/material/Box";
+import Stack from "@mui/material/Stack";
+
+import { MaxCharactersMessageText } from "~/components/MaxCharactersMessageText";
+
+import { DDB_MEDIA_URL } from "../constants";
+
+export const MaxCharactersMessage = () => {
+  return (
+    <Box
+      sx={{
+        width: "100%",
+        height: "calc(100vh - 114px)",
+        background: `url("${DDB_MEDIA_URL}/attachments/1/614/builder1k.jpg") no-repeat center 0px, url("${DDB_MEDIA_URL}/attachments/0/84/background_texture.png") #f9f9f9 !important`,
+      }}
+      justifyContent="center"
+      display="flex"
+    >
+      <Stack
+        justifyContent="center"
+        sx={{
+          padding: "20px",
+          "& > :not(style)": { padding: "20px" },
+          maxWidth: "650px",
+          height: "auto",
+        }}
+      >
+        <MaxCharactersMessageText includeTitle={true} useLinks={true} />
+      </Stack>
+    </Box>
+  );
+};
+
+export default MaxCharactersMessage;
diff --git a/ddb_main/routes/sheet-builder-app.tsx b/ddb_main/routes/sheet-builder-app.tsx
new file mode 100644
index 0000000..33eb4e1
--- /dev/null
+++ b/ddb_main/routes/sheet-builder-app.tsx
@@ -0,0 +1,17 @@
+import { useParams } from "react-router-dom";
+
+import useUserName from "~/hooks/useUserName";
+import { SheetBuilderApp } from "~/tools/js";
+
+export default function Builder() {
+  const { characterId } = useParams();
+  const username = useUserName();
+  let parsedId: number | null = null;
+  try {
+    if (characterId) {
+      parsedId = parseInt(characterId, 10);
+    }
+  } catch (e) {}
+
+  return <SheetBuilderApp characterId={parsedId} readOnly={!username} />;
+}
diff --git a/ddb_main/src/Components/AutoExpandTextInput/AutoExpandTextInput.jsx b/ddb_main/src/Components/AutoExpandTextInput/AutoExpandTextInput.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Breadcrumbs/Breadcrumbs.jsx b/ddb_main/src/Components/Breadcrumbs/Breadcrumbs.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Button/Button.jsx b/ddb_main/src/Components/Button/Button.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Button/index.js b/ddb_main/src/Components/Button/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/ClampedInput/ClampedInput.jsx b/ddb_main/src/Components/ClampedInput/ClampedInput.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/ClampedInput/index.js b/ddb_main/src/Components/ClampedInput/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/ErrorBoundary/ErrorBoundary.jsx b/ddb_main/src/Components/ErrorBoundary/ErrorBoundary.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/AvatarIcon/AvatarIcon.jsx b/ddb_main/src/Components/Icons/AvatarIcon/AvatarIcon.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/AvatarIcon/index.js b/ddb_main/src/Components/Icons/AvatarIcon/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/CheckboxSvg/CheckboxSvg.jsx b/ddb_main/src/Components/Icons/CheckboxSvg/CheckboxSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/CheckboxSvg/index.js b/ddb_main/src/Components/Icons/CheckboxSvg/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/ChevronDownSvg/ChevronDownSvg.jsx b/ddb_main/src/Components/Icons/ChevronDownSvg/ChevronDownSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/ChevronDownSvg/index.js b/ddb_main/src/Components/Icons/ChevronDownSvg/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/ChevronLeftSvg/ChevronLeftSvg.jsx b/ddb_main/src/Components/Icons/ChevronLeftSvg/ChevronLeftSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/ChevronRightSvg/ChevronRightSvg.jsx b/ddb_main/src/Components/Icons/ChevronRightSvg/ChevronRightSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/ChevronUpSvg/ChevronUpSvg.jsx b/ddb_main/src/Components/Icons/ChevronUpSvg/ChevronUpSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/CoatOfArmsSvg/CoatOfArmsSvg.jsx b/ddb_main/src/Components/Icons/CoatOfArmsSvg/CoatOfArmsSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/CoatOfArmsSvg/index.js b/ddb_main/src/Components/Icons/CoatOfArmsSvg/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/DoubleChevronLeftSvg/DoubleChevronLeftSvg.tsx b/ddb_main/src/Components/Icons/DoubleChevronLeftSvg/DoubleChevronLeftSvg.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/DoubleChevronLeftSvg/index.ts b/ddb_main/src/Components/Icons/DoubleChevronLeftSvg/index.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/DoubleChevronRightSvg/DoubleChevronRightSvg.tsx b/ddb_main/src/Components/Icons/DoubleChevronRightSvg/DoubleChevronRightSvg.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/DoubleChevronRightSvg/index.ts b/ddb_main/src/Components/Icons/DoubleChevronRightSvg/index.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/LoadingRingSvg/LoadingRingSvg.jsx b/ddb_main/src/Components/Icons/LoadingRingSvg/LoadingRingSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/LockSvg/LockSvg.tsx b/ddb_main/src/Components/Icons/LockSvg/LockSvg.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/LockSvg/index.ts b/ddb_main/src/Components/Icons/LockSvg/index.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/MagnifyingGlassSvg/MagnifyingGlassSvg.jsx b/ddb_main/src/Components/Icons/MagnifyingGlassSvg/MagnifyingGlassSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/MagnifyingGlassSvg/index.js b/ddb_main/src/Components/Icons/MagnifyingGlassSvg/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/MinusIconSvg/MinusIconSvg.jsx b/ddb_main/src/Components/Icons/MinusIconSvg/MinusIconSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/MinusIconSvg/index.js b/ddb_main/src/Components/Icons/MinusIconSvg/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/PlusIconSvg/PlusIconSvg.jsx b/ddb_main/src/Components/Icons/PlusIconSvg/PlusIconSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/PlusIconSvg/index.js b/ddb_main/src/Components/Icons/PlusIconSvg/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/ScrollSvg/ScrollSvg.jsx b/ddb_main/src/Components/Icons/ScrollSvg/ScrollSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/ScrollSvg/index.js b/ddb_main/src/Components/Icons/ScrollSvg/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/SortOrderIcon/SortOrderIcon.jsx b/ddb_main/src/Components/Icons/SortOrderIcon/SortOrderIcon.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/SortOrderIcon/index.js b/ddb_main/src/Components/Icons/SortOrderIcon/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/SwordsSvg/SwordsSvg.jsx b/ddb_main/src/Components/Icons/SwordsSvg/SwordsSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/SwordsSvg/index.js b/ddb_main/src/Components/Icons/SwordsSvg/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/ThroneSvg/ThroneSvg.jsx b/ddb_main/src/Components/Icons/ThroneSvg/ThroneSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/ThroneSvg/index.js b/ddb_main/src/Components/Icons/ThroneSvg/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/TrumpetSvg/TrumpetSvg.jsx b/ddb_main/src/Components/Icons/TrumpetSvg/TrumpetSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/TrumpetSvg/index.js b/ddb_main/src/Components/Icons/TrumpetSvg/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/UnlockSvg/UnlockSvg.tsx b/ddb_main/src/Components/Icons/UnlockSvg/UnlockSvg.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/UnlockSvg/index.ts b/ddb_main/src/Components/Icons/UnlockSvg/index.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/XIconSvg/XIconSvg.jsx b/ddb_main/src/Components/Icons/XIconSvg/XIconSvg.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Icons/XIconSvg/index.js b/ddb_main/src/Components/Icons/XIconSvg/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/InputCheckbox/InputCheckbox.jsx b/ddb_main/src/Components/InputCheckbox/InputCheckbox.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/InputCheckbox/index.js b/ddb_main/src/Components/InputCheckbox/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/InputSelectDropdown/InputSelectDropdown.jsx b/ddb_main/src/Components/InputSelectDropdown/InputSelectDropdown.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/InputStepper/InputStepper.jsx b/ddb_main/src/Components/InputStepper/InputStepper.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/Callout/Callout.jsx b/ddb_main/src/Components/LandingPages/Callout/Callout.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/Callout/index.js b/ddb_main/src/Components/LandingPages/Callout/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/CenterFeature/CenterFeature.jsx b/ddb_main/src/Components/LandingPages/CenterFeature/CenterFeature.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/CenterFeature/index.js b/ddb_main/src/Components/LandingPages/CenterFeature/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/CharacterSheet/CharacterSheetLandingPage.jsx b/ddb_main/src/Components/LandingPages/CharacterSheet/CharacterSheetLandingPage.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/CombatTracker/CombatTrackerLandingPage.jsx b/ddb_main/src/Components/LandingPages/CombatTracker/CombatTrackerLandingPage.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/DToB/DarkTidesOfBilgewaterLandingPage.jsx b/ddb_main/src/Components/LandingPages/DToB/DarkTidesOfBilgewaterLandingPage.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/EGtW/ExplorersGuideToWildemountLandingPage.jsx b/ddb_main/src/Components/LandingPages/EGtW/ExplorersGuideToWildemountLandingPage.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/Hero/Hero.jsx b/ddb_main/src/Components/LandingPages/Hero/Hero.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/Hero/index.js b/ddb_main/src/Components/LandingPages/Hero/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/KeyHighlights/Highlight.jsx b/ddb_main/src/Components/LandingPages/KeyHighlights/Highlight.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/KeyHighlights/KeyHighlights.jsx b/ddb_main/src/Components/LandingPages/KeyHighlights/KeyHighlights.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/KeyHighlights/index.js b/ddb_main/src/Components/LandingPages/KeyHighlights/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/PlayerApp/PlayerAppLandingPage.jsx b/ddb_main/src/Components/LandingPages/PlayerApp/PlayerAppLandingPage.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/ResponsiveBackgroundImage/ResponsiveBackgroundImage.jsx b/ddb_main/src/Components/LandingPages/ResponsiveBackgroundImage/ResponsiveBackgroundImage.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/ResponsiveBackgroundImage/index.js b/ddb_main/src/Components/LandingPages/ResponsiveBackgroundImage/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/SideFeature/SideFeature.jsx b/ddb_main/src/Components/LandingPages/SideFeature/SideFeature.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/SideFeature/index.js b/ddb_main/src/Components/LandingPages/SideFeature/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/VideoFeature/VideoFeature.jsx b/ddb_main/src/Components/LandingPages/VideoFeature/VideoFeature.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LandingPages/VideoFeature/index.js b/ddb_main/src/Components/LandingPages/VideoFeature/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LinkButton/LinkButton.jsx b/ddb_main/src/Components/LinkButton/LinkButton.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/LinkButton/index.js b/ddb_main/src/Components/LinkButton/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Listing/Listing.jsx b/ddb_main/src/Components/Listing/Listing.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Listing/ListingActionTypes.js b/ddb_main/src/Components/Listing/ListingActionTypes.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Listing/ListingHeaderLabel.jsx b/ddb_main/src/Components/Listing/ListingHeaderLabel.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Listing/ListingReducer.js b/ddb_main/src/Components/Listing/ListingReducer.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Listing/ListingSelectors.js b/ddb_main/src/Components/Listing/ListingSelectors.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Listing/PaginationActionTypes.js b/ddb_main/src/Components/Listing/PaginationActionTypes.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Listing/PaginationControls.jsx b/ddb_main/src/Components/Listing/PaginationControls.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Listing/PaginationReducer.js b/ddb_main/src/Components/Listing/PaginationReducer.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Listing/PaginationSelectors.js b/ddb_main/src/Components/Listing/PaginationSelectors.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Listing/configureListingStore.js b/ddb_main/src/Components/Listing/configureListingStore.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Listing/reducer.js b/ddb_main/src/Components/Listing/reducer.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Modal/Modal.jsx b/ddb_main/src/Components/Modal/Modal.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/NonSortableLabel/NonSortableLabel.jsx b/ddb_main/src/Components/NonSortableLabel/NonSortableLabel.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Responsive/MediaQuery.jsx b/ddb_main/src/Components/Responsive/MediaQuery.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Responsive/useMediaQuery.js b/ddb_main/src/Components/Responsive/useMediaQuery.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/RichTextEditor/RichTextEditor.jsx b/ddb_main/src/Components/RichTextEditor/RichTextEditor.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/SearchField/SearchField.jsx b/ddb_main/src/Components/SearchField/SearchField.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Sidebar/LockControl.tsx b/ddb_main/src/Components/Sidebar/LockControl.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Sidebar/SidebarControls.tsx b/ddb_main/src/Components/Sidebar/SidebarControls.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Sidebar/VisibilityControl.tsx b/ddb_main/src/Components/Sidebar/VisibilityControl.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/SortableLabel/SortableLabel.jsx b/ddb_main/src/Components/SortableLabel/SortableLabel.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/SubscriptionsBanner/SubscriptionsBanner.jsx b/ddb_main/src/Components/SubscriptionsBanner/SubscriptionsBanner.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Components/Tabs/Tabs.jsx b/ddb_main/src/Components/Tabs/Tabs.jsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Constants/ReleaseType/ReleaseType.js b/ddb_main/src/Constants/ReleaseType/ReleaseType.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Constants/ReleaseType/ReleaseTypeClassMap.js b/ddb_main/src/Constants/ReleaseType/ReleaseTypeClassMap.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Constants/ReleaseType/ReleaseTypeLabelMap.js b/ddb_main/src/Constants/ReleaseType/ReleaseTypeLabelMap.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Constants/SortOrderType/SortOrderType.js b/ddb_main/src/Constants/SortOrderType/SortOrderType.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Constants/SortOrderType/SortOrderTypeLabelMap.js b/ddb_main/src/Constants/SortOrderType/SortOrderTypeLabelMap.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Constants/SortOrderType/index.js b/ddb_main/src/Constants/SortOrderType/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/Input/callAll.js b/ddb_main/src/Utils/Input/callAll.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/Input/ifAll.js b/ddb_main/src/Utils/Input/ifAll.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/Input/isCtrl.js b/ddb_main/src/Utils/Input/isCtrl.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/Input/isEscape.js b/ddb_main/src/Utils/Input/isEscape.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/Input/isY.js b/ddb_main/src/Utils/Input/isY.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/Input/isZ.js b/ddb_main/src/Utils/Input/isZ.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/Input/onEscape.js b/ddb_main/src/Utils/Input/onEscape.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/Input/onRedoHotkey.js b/ddb_main/src/Utils/Input/onRedoHotkey.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/Input/onUndoHotkey.js b/ddb_main/src/Utils/Input/onUndoHotkey.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/getDisplayName.js b/ddb_main/src/Utils/getDisplayName.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/getPopupPortalRoot.js b/ddb_main/src/Utils/getPopupPortalRoot.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/isFunction.js b/ddb_main/src/Utils/isFunction.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/mapProps.js b/ddb_main/src/Utils/mapProps.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/pipe.js b/ddb_main/src/Utils/pipe.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/renderIfProp.js b/ddb_main/src/Utils/renderIfProp.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/Utils/withPortal.js b/ddb_main/src/Utils/withPortal.js
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/AspectRatio/AspectRatio.tsx b/ddb_main/src/components/AspectRatio/AspectRatio.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/Avatar/Avatar.tsx b/ddb_main/src/components/Avatar/Avatar.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DiceMessage/DiceMessage.tsx b/ddb_main/src/components/DiceMessage/DiceMessage.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DiceMessageWrapper/DiceMessageWrapper.tsx b/ddb_main/src/components/DiceMessageWrapper/DiceMessageWrapper.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DiceMessageWrapper/images/Divider.tsx b/ddb_main/src/components/DiceMessageWrapper/images/Divider.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DiceMessageWrapper/images/DividerResult.tsx b/ddb_main/src/components/DiceMessageWrapper/images/DividerResult.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DiceThumbnail/DiceThumbnail.tsx b/ddb_main/src/components/DiceThumbnail/DiceThumbnail.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DiceThumbnails/DiceThumbnails.tsx b/ddb_main/src/components/DiceThumbnails/DiceThumbnails.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DiceThumbnails/images/CloseIcon.tsx b/ddb_main/src/components/DiceThumbnails/images/CloseIcon.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DiceThumbnails/images/ExternalLinkIcon.tsx b/ddb_main/src/components/DiceThumbnails/images/ExternalLinkIcon.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DieIcon/DieIcon.tsx b/ddb_main/src/components/DieIcon/DieIcon.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DieIcon/images/D10.tsx b/ddb_main/src/components/DieIcon/images/D10.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DieIcon/images/D100.tsx b/ddb_main/src/components/DieIcon/images/D100.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DieIcon/images/D12.tsx b/ddb_main/src/components/DieIcon/images/D12.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DieIcon/images/D20.tsx b/ddb_main/src/components/DieIcon/images/D20.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DieIcon/images/D4.tsx b/ddb_main/src/components/DieIcon/images/D4.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DieIcon/images/D6.tsx b/ddb_main/src/components/DieIcon/images/D6.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/DieIcon/images/D8.tsx b/ddb_main/src/components/DieIcon/images/D8.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/Flex/Flex.tsx b/ddb_main/src/components/Flex/Flex.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/GameLog/GameLog.tsx b/ddb_main/src/components/GameLog/GameLog.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/GameLog/images/EmptyStateIcon.tsx b/ddb_main/src/components/GameLog/images/EmptyStateIcon.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/GameLogButton/GameLogButton.tsx b/ddb_main/src/components/GameLogButton/GameLogButton.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/GameLogContextProvider/GameLogContextProvider.tsx b/ddb_main/src/components/GameLogContextProvider/GameLogContextProvider.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/GameLogEntry/GameLogEntry.tsx b/ddb_main/src/components/GameLogEntry/GameLogEntry.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/GameLogHeader/GameLogHeader.tsx b/ddb_main/src/components/GameLogHeader/GameLogHeader.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/GameLogHeader/TargetIcon.tsx b/ddb_main/src/components/GameLogHeader/TargetIcon.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/GameLogNotification/GameLogNotification.tsx b/ddb_main/src/components/GameLogNotification/GameLogNotification.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/GameLogNotificationMessage/GameLogNotificationMessage.tsx b/ddb_main/src/components/GameLogNotificationMessage/GameLogNotificationMessage.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/GameLogNotificationWrapper/GameLogNotificationWrapper.tsx b/ddb_main/src/components/GameLogNotificationWrapper/GameLogNotificationWrapper.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/Sentinel/Sentinel.tsx b/ddb_main/src/components/Sentinel/Sentinel.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/TimeAgo/TimeAgo.tsx b/ddb_main/src/components/TimeAgo/TimeAgo.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/icons/ArrowDownIcon/ArrowDownIcon.tsx b/ddb_main/src/components/icons/ArrowDownIcon/ArrowDownIcon.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/icons/ArrowUpIcon/ArrowUpIcon.tsx b/ddb_main/src/components/icons/ArrowUpIcon/ArrowUpIcon.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/icons/CheckIcon/CheckIcon.tsx b/ddb_main/src/components/icons/CheckIcon/CheckIcon.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/icons/DungeonMasterIcon/DungeonMasterIcon.tsx b/ddb_main/src/components/icons/DungeonMasterIcon/DungeonMasterIcon.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/icons/EveryoneIcon/EveryoneIcon.tsx b/ddb_main/src/components/icons/EveryoneIcon/EveryoneIcon.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/components/icons/SelfIcon/SelfIcon.tsx b/ddb_main/src/components/icons/SelfIcon/SelfIcon.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/helpers/getMessageName.ts b/ddb_main/src/helpers/getMessageName.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/hooks/useActiveCampaign/useActiveCampaign.ts b/ddb_main/src/hooks/useActiveCampaign/useActiveCampaign.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/hooks/useActiveCharacters/useActiveCharacters.ts b/ddb_main/src/hooks/useActiveCharacters/useActiveCharacters.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/hooks/useActivePlayers/useActivePlayers.ts b/ddb_main/src/hooks/useActivePlayers/useActivePlayers.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/hooks/useAwaitMessageBroker/useAwaitMessageBroker.ts b/ddb_main/src/hooks/useAwaitMessageBroker/useAwaitMessageBroker.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/hooks/useDiceFamilies/useDiceFamilies.ts b/ddb_main/src/hooks/useDiceFamilies/useDiceFamilies.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/hooks/useFetchHistory/useFetchHistory.ts b/ddb_main/src/hooks/useFetchHistory/useFetchHistory.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/hooks/useInfiniteScroll/useInfiniteScroll.ts b/ddb_main/src/hooks/useInfiniteScroll/useInfiniteScroll.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/hooks/useInterval/useInterval.ts b/ddb_main/src/hooks/useInterval/useInterval.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/hooks/useMessageBroker/useMessageBroker.ts b/ddb_main/src/hooks/useMessageBroker/useMessageBroker.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/lib/MessageBroker.ts b/ddb_main/src/lib/MessageBroker.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/lib/constants.ts b/ddb_main/src/lib/constants.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/lib/getMessageBroker.ts b/ddb_main/src/lib/getMessageBroker.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/lib/helpers/index.ts b/ddb_main/src/lib/helpers/index.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/lib/helpers/mobileApp.ts b/ddb_main/src/lib/helpers/mobileApp.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/lib/types.ts b/ddb_main/src/lib/types.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/shared/makeStyles.ts b/ddb_main/src/shared/makeStyles.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/shared/themes.ts b/ddb_main/src/shared/themes.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/src/shared/variables.ts b/ddb_main/src/shared/variables.ts
new file mode 100644
index 0000000..e69de29
diff --git a/ddb_main/state/selectors/characterUtils.ts b/ddb_main/state/selectors/characterUtils.ts
new file mode 100644
index 0000000..88cd69a
--- /dev/null
+++ b/ddb_main/state/selectors/characterUtils.ts
@@ -0,0 +1,180 @@
+import { createSelector } from "reselect";
+
+import { DefaultCharacterName } from "~/constants";
+
+import config from "../../config";
+import {
+  AppData,
+  CharacterData,
+  QueryResponseData,
+  ShortCharacterContract,
+  SortTypeEnum,
+} from "../../types";
+
+const BASE_PATHNAME = config.basePathname;
+
+export const getCharacter = (state: CharacterData) => state || {};
+
+export const getId = createSelector([getCharacter], ({ id }) => id);
+
+// Username is added by MyCharactersListing since it comes from the JWT, not the API
+export const getUsername = createSelector(
+  [getCharacter],
+  ({ userName }) => userName
+);
+
+export const getName = createSelector(
+  [getCharacter],
+  ({ name }) => name || DefaultCharacterName
+);
+
+export const getLevel = createSelector([getCharacter], ({ level }) => level);
+
+export const getStatus = createSelector([getCharacter], ({ status }) => status);
+
+export const getStatusSlug = createSelector(
+  [getCharacter],
+  ({ statusSlug }) => statusSlug
+);
+
+export const getClassDescription = createSelector(
+  [getCharacter],
+  ({ classDescription }) => classDescription
+);
+
+export const getRaceName = createSelector(
+  [getCharacter],
+  ({ raceName }) => raceName
+);
+
+export const getSecondaryInfo = createSelector(
+  [getCharacter],
+  ({ characterSecondaryInfo }) => characterSecondaryInfo
+);
+
+export const getAvatarUrl = createSelector(
+  [getCharacter],
+  ({ avatarUrl }) => avatarUrl
+);
+
+export const getBackdropUrl = createSelector(
+  [getCharacter],
+  ({ backdropUrl }) => backdropUrl
+);
+
+export const getCoverImageUrl = createSelector(
+  [getCharacter],
+  ({ coverImageUrl }) => coverImageUrl
+);
+
+export const getCreatedDate = createSelector(
+  [getCharacter],
+  ({ createdDate }) => createdDate
+);
+
+export const getLastModifiedDate = createSelector(
+  [getCharacter],
+  ({ lastModifiedDate }) => lastModifiedDate
+);
+
+export const getIsAssigned = createSelector(
+  [getCharacter],
+  ({ isAssigned }) => isAssigned
+);
+
+export const getCampaignId = createSelector(
+  [getCharacter],
+  ({ campaignId }) => campaignId
+);
+
+export const isInCampaign = createSelector([getCampaignId], Boolean);
+
+export const getCampaignName = createSelector(
+  [getCharacter],
+  ({ campaignName }) => campaignName
+);
+
+export const getCampaignDetailsLink = createSelector(
+  [getCampaignId],
+  (id) => `${config.ddbBaseUrl}/campaigns/${id}`
+);
+
+export const getDetailsLink = createSelector(
+  [getUsername, getId],
+  (username, id) => `${BASE_PATHNAME}/${id}`
+);
+
+export const getEditLink = createSelector(
+  [getUsername, getId],
+  (username, id) => `${BASE_PATHNAME}/${id}/builder/home/basic`
+);
+
+export const getSearchableTerms = createSelector(
+  [
+    isInCampaign,
+    getLevel,
+    getName,
+    getClassDescription,
+    getRaceName,
+    getCampaignName,
+  ],
+  (isInCampaign, level, name, classDescription, raceName, campaignName) =>
+    [
+      isInCampaign && "campaign",
+      level.toString(),
+      `level ${level}`,
+      `lvl ${level}`,
+      name,
+      classDescription,
+      raceName,
+      campaignName,
+    ].filter(Boolean)
+);
+
+// Analytics labels to use if a match is found in getSearchableTerms (by index)
+export const getSearchableTermsAnalyticsLabel = createSelector(
+  [isInCampaign, getLevel],
+  (isInCampaign, level) =>
+    [
+      isInCampaign && "campaign",
+      "# (level)",
+      `level #`,
+      `lvl #`,
+      "name",
+      "class description",
+      "race name",
+      "campaign name",
+    ].filter(Boolean)
+);
+
+export const generateCharacter = (
+  character: ShortCharacterContract,
+  userName: string | null
+): CharacterData => {
+  return {
+    ...character,
+    userName,
+  };
+};
+
+export const generateAppData = (
+  userName: string | null,
+  data?: QueryResponseData
+): AppData => {
+  const characters = data?.data?.characters || [];
+
+  return {
+    characters: characters.map((character) =>
+      generateCharacter(character, userName)
+    ),
+    maxCharacterSlotsAllowed: data?.data?.characterSlotLimit || null,
+    hasLockedCharacters: data?.data?.canUnlockCharacters || false,
+  };
+};
+
+export const SortByPropMap = {
+  [SortTypeEnum.Created]: getCreatedDate,
+  [SortTypeEnum.Level]: getLevel,
+  [SortTypeEnum.Modified]: getLastModifiedDate,
+  [SortTypeEnum.Name]: getName,
+};
diff --git a/ddb_main/subApps/builder/components/ConfirmClassModal/ConfirmClassModal.tsx b/ddb_main/subApps/builder/components/ConfirmClassModal/ConfirmClassModal.tsx
new file mode 100644
index 0000000..9a4310b
--- /dev/null
+++ b/ddb_main/subApps/builder/components/ConfirmClassModal/ConfirmClassModal.tsx
@@ -0,0 +1,126 @@
+import { orderBy } from "lodash";
+import { FC, Fragment, useMemo } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import { v4 as uuidv4 } from "uuid";
+
+import ArrowRightIcon from "@dndbeyond/fontawesome-cache/svgs/solid/arrow-right.svg";
+
+import { Accordion } from "~/components/Accordion";
+import { Button } from "~/components/Button";
+import { CollapsibleContent } from "~/components/CollapsibleContent";
+import { ConfirmModal, ConfirmModalProps } from "~/components/ConfirmModal";
+import { HtmlContent } from "~/components/HtmlContent";
+import { Reference } from "~/components/Reference";
+import { isNotNullOrUndefined } from "~/helpers/validation";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { builderSelectors } from "~/tools/js/CharacterBuilder/selectors";
+
+import styles from "./styles.module.css";
+
+export interface ConfirmClassModalProps
+  extends Omit<ConfirmModalProps, "onConfirm"> {}
+
+export const ConfirmClassModal: FC<ConfirmClassModalProps> = ({
+  className,
+  onClose,
+  ...props
+}) => {
+  const dispatch = useDispatch();
+  const confirmClass = useSelector(builderSelectors.getConfirmClass);
+  const {
+    ruleData,
+    characterActions,
+    ruleDataUtils: RuleDataUtils,
+    formatUtils: FormatUtils,
+  } = useCharacterEngine();
+
+  const classFeatures = useMemo(() => {
+    return orderBy(confirmClass?.classFeatures, [
+      (classFeature) => classFeature.requiredLevel,
+      (classFeature) => classFeature.displayOrder,
+      (classFeature) => classFeature.name,
+    ]);
+  }, [confirmClass]);
+
+  const onConfirm = () => {
+    if (confirmClass) {
+      dispatch(characterActions.classAddRequest(confirmClass, 1));
+    }
+    onClose();
+  };
+
+  return confirmClass ? (
+    <ConfirmModal
+      onClose={onClose}
+      heading="Confirm Add Class"
+      onConfirm={onConfirm}
+      confirmButtonText="Add Class"
+      useMobileFullScreen
+      {...props}
+    >
+      <>
+        <div className={styles.confirmClassHeader}>
+          <div>
+            <h3 className={styles.name}>{confirmClass.name}</h3>
+            {confirmClass?.sources
+              ?.map((sourceMapping) =>
+                RuleDataUtils.getSourceDataInfo(
+                  sourceMapping.sourceId,
+                  ruleData
+                )
+              )
+              .filter(isNotNullOrUndefined)
+              .map((source, idx) => (
+                <Fragment key={uuidv4()}>
+                  {idx > 0 ? " / " : " "}
+                  <Reference name={source.description} />
+                </Fragment>
+              ))}
+            {confirmClass.description && (
+              <HtmlContent html={confirmClass.description} withoutTooltips />
+            )}
+          </div>
+          {confirmClass.portraitAvatarUrl && (
+            <img
+              className={styles.image}
+              src={confirmClass.portraitAvatarUrl}
+              alt={confirmClass.name || "Class image"}
+            />
+          )}
+        </div>
+        {confirmClass.moreDetailsUrl && (
+          <div className={styles.detailsLink}>
+            <Button
+              href={confirmClass.moreDetailsUrl}
+              variant="builder-text"
+              size="x-small"
+              target="_blank"
+              rel="noreferrer"
+            >
+              {confirmClass.name} Details Page <ArrowRightIcon />
+            </Button>
+          </div>
+        )}
+        <div className={styles.classFeatures}>
+          {classFeatures.map((feature) => (
+            <Accordion
+              summary={feature.name}
+              summaryMetaItems={
+                feature.requiredLevel
+                  ? [`${FormatUtils.ordinalize(feature.requiredLevel)} level`]
+                  : undefined
+              }
+              key={uuidv4()}
+              variant="paper"
+              forceShow
+            >
+              <CollapsibleContent className={styles.description}>
+                {feature.description}
+              </CollapsibleContent>
+            </Accordion>
+          ))}
+        </div>
+      </>
+    </ConfirmModal>
+  ) : null;
+};
diff --git a/ddb_main/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesContent/ConfirmSpeciesContent.tsx b/ddb_main/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesContent/ConfirmSpeciesContent.tsx
new file mode 100644
index 0000000..cea1b62
--- /dev/null
+++ b/ddb_main/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesContent/ConfirmSpeciesContent.tsx
@@ -0,0 +1,51 @@
+import { FC, HTMLAttributes } from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import { BuilderHelperTextInfoContract } from "@dndbeyond/character-rules-engine";
+
+import { Accordion } from "~/components/Accordion";
+import { CollapsibleContent } from "~/components/CollapsibleContent";
+import { HelperTextAccordion } from "~/components/HelperTextAccordion";
+
+import styles from "./styles.module.css";
+
+export interface ConfirmSpeciesContentProps
+  extends HTMLAttributes<HTMLDivElement> {
+  heading: string;
+  helpItems: BuilderHelperTextInfoContract[];
+  speciesTraits: { name: string; description: string | null }[];
+}
+
+export const ConfirmSpeciesContent: FC<ConfirmSpeciesContentProps> = ({
+  heading,
+  helpItems,
+  speciesTraits,
+  ...props
+}) => {
+  return (
+    <div {...props}>
+      <h3>{heading}</h3>
+      {helpItems.length > 0 && (
+        <HelperTextAccordion builderHelperText={helpItems} />
+      )}
+      {speciesTraits.length > 0 && (
+        <div>
+          {speciesTraits.map(({ name, description }) => {
+            return (
+              <Accordion
+                summary={name}
+                key={uuidv4()}
+                variant="paper"
+                forceShow
+              >
+                <CollapsibleContent className={styles.description}>
+                  {description}
+                </CollapsibleContent>
+              </Accordion>
+            );
+          })}
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesHeader/ConfirmSpeciesHeader.tsx b/ddb_main/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesHeader/ConfirmSpeciesHeader.tsx
new file mode 100644
index 0000000..ef0e638
--- /dev/null
+++ b/ddb_main/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesHeader/ConfirmSpeciesHeader.tsx
@@ -0,0 +1,40 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, ReactNode } from "react";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { LegacyBadge } from "~/components/LegacyBadge";
+
+import styles from "./styles.module.css";
+
+export interface ConfirmSpeciesHeaderProps
+  extends HTMLAttributes<HTMLDivElement> {
+  heading: string;
+  content: string;
+  imageUrl: string;
+  isLegacy?: boolean;
+  sources?: ReactNode;
+}
+
+export const ConfirmSpeciesHeader: FC<ConfirmSpeciesHeaderProps> = ({
+  className,
+  heading,
+  content,
+  imageUrl,
+  isLegacy,
+  sources,
+  ...props
+}) => {
+  return (
+    <div className={clsx([styles.confirmSpeciesHeader, className])} {...props}>
+      <div>
+        <h3 className={styles.fullName}>
+          {heading}
+          {isLegacy && <LegacyBadge id={heading || ""} />}
+        </h3>
+        {sources}
+        <HtmlContent html={content} withoutTooltips />
+      </div>
+      <img className={styles.image} src={imageUrl} alt={heading} />
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesModal.tsx b/ddb_main/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesModal.tsx
new file mode 100644
index 0000000..81783af
--- /dev/null
+++ b/ddb_main/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesModal.tsx
@@ -0,0 +1,201 @@
+import clsx from "clsx";
+import React, { FC } from "react";
+import { useDispatch } from "react-redux";
+
+import ArrowRightIcon from "@dndbeyond/fontawesome-cache/svgs/solid/arrow-right.svg";
+
+import { Button } from "~/components/Button";
+import { ConfirmModal, ConfirmModalProps } from "~/components/ConfirmModal";
+import { Reference } from "~/components/Reference";
+import { SummaryList } from "~/components/SummaryList";
+import { AppContextTypeEnum, DisplayConfigurationTypeEnum } from "~/constants";
+import { isNotNullOrUndefined } from "~/helpers/validation";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { Feat, RacialTraitContract as RacialTrait } from "~/types";
+
+import { useSpeciesContext } from "../../contexts/Species";
+import { ConfirmSpeciesContent } from "./ConfirmSpeciesContent";
+import { ConfirmSpeciesHeader } from "./ConfirmSpeciesHeader";
+import styles from "./styles.module.css";
+
+export interface ConfirmSpeciesModalProps
+  extends Omit<ConfirmModalProps, "onConfirm"> {
+  feats?: Feat[];
+}
+
+export const ConfirmSpeciesModal: FC<ConfirmSpeciesModalProps> = ({
+  className,
+  feats,
+  onClose,
+  ...props
+}) => {
+  const dispatch = useDispatch();
+  const {
+    characterActions: { raceChoose },
+    definitionUtils: { hack__generateDefinitionKey: generateDefinitionKey },
+    featUtils: { getId: getFeatId, getName: getFeatName },
+    raceUtils: {
+      deriveCalledOutRacialTraits,
+      deriveOrderedRacialTraits,
+      deriveVisibleRacialTraits: deriveVisibleTraits,
+      getDefinitionRacialTraits,
+      getEntityRaceId,
+      getEntityRaceTypeId,
+      getFeatIds,
+      getMoreDetailsUrl,
+    },
+    racialTraitUtils: {
+      filterRacialTraitsByDisplayConfigurationType: filterRacialTraits,
+      getName: getRacialTraitName,
+      getDescription: getRacialTraitDescription,
+      simulateRacialTraitFromContract,
+    },
+    ruleData,
+    ruleDataUtils: {
+      getBuilderHelperTextByDefinitionKeys: getHelperText,
+      getSourceDataInfo,
+    },
+    race: species,
+  } = useCharacterEngine();
+  const { defaultSpeciesImageUrl: defaultImageUrl, selectedSpecies } =
+    useSpeciesContext();
+
+  const { description, fullName, isLegacy, portraitAvatarUrl, sources } =
+    selectedSpecies || {};
+
+  const previewUrl = portraitAvatarUrl || defaultImageUrl;
+
+  let missingFeatDependencies: Feat[] = [];
+
+  if (feats && species && selectedSpecies) {
+    let speciesFeatIds = getFeatIds(species);
+    let confirmSpeciesFeatIds = getFeatIds(selectedSpecies);
+    feats.forEach((feat) => {
+      if (
+        speciesFeatIds.includes(getFeatId(feat)) &&
+        !confirmSpeciesFeatIds.includes(getFeatId(feat))
+      ) {
+        missingFeatDependencies.push(feat);
+      }
+    });
+  }
+
+  // Get listing url for species
+  const moreDetailsUrl = selectedSpecies
+    ? getMoreDetailsUrl(selectedSpecies)
+    : "";
+
+  // Get species traits
+  const speciesTraits =
+    selectedSpecies && getDefinitionRacialTraits(selectedSpecies);
+
+  const simulatedSpeciesTraits = speciesTraits?.map((speciesTrait) =>
+    simulateRacialTraitFromContract(speciesTrait)
+  );
+
+  const calledOutSpeciesTraits =
+    simulatedSpeciesTraits &&
+    deriveCalledOutRacialTraits(simulatedSpeciesTraits, ruleData);
+
+  const onConfirm = () => {
+    if (selectedSpecies) dispatch(raceChoose(selectedSpecies));
+    onClose();
+  };
+
+  const definitionKey =
+    (selectedSpecies &&
+      generateDefinitionKey(
+        getEntityRaceTypeId(selectedSpecies),
+        getEntityRaceId(selectedSpecies)
+      )) ||
+    "";
+
+  const builderText = getHelperText(
+    [definitionKey],
+    ruleData,
+    DisplayConfigurationTypeEnum.RACIAL_TRAIT
+  );
+
+  const orderedSpeciesTraits: RacialTrait[] = speciesTraits
+    ? deriveOrderedRacialTraits(speciesTraits)
+    : [];
+
+  let visibleSpeciesTraits: RacialTrait[] = deriveVisibleTraits(
+    orderedSpeciesTraits,
+    AppContextTypeEnum.BUILDER
+  );
+
+  visibleSpeciesTraits = filterRacialTraits(visibleSpeciesTraits, [
+    DisplayConfigurationTypeEnum.RACIAL_TRAIT,
+  ]);
+
+  const sourceList = sources
+    ?.map((sourceMapping) =>
+      getSourceDataInfo(sourceMapping.sourceId, ruleData)
+    )
+    .filter(isNotNullOrUndefined)
+    .map((source, idx) => (
+      <React.Fragment key={`${source}-${idx}`}>
+        {idx > 0 ? " / " : " "}
+        <Reference name={source.description} />
+      </React.Fragment>
+    ));
+
+  return (
+    <ConfirmModal
+      className={clsx([styles.confirmSpeciesModal, className])}
+      onClose={onClose}
+      heading={`${species ? "Confirm Change" : "Confirm"} Species`}
+      onConfirm={onConfirm}
+      useMobileFullScreen
+      {...props}
+    >
+      {missingFeatDependencies.length > 0 && (
+        <div className="builder-message builder-message-warning">
+          By changing your species, you will have invalid feat selection(s):
+          {" " +
+            missingFeatDependencies.map((feat) => getFeatName(feat)).join(", ")}
+        </div>
+      )}
+      {selectedSpecies && (
+        <div className={styles.content}>
+          <ConfirmSpeciesHeader
+            heading={fullName || ""}
+            content={description || ""}
+            imageUrl={previewUrl}
+            isLegacy={isLegacy}
+            sources={sourceList}
+          />
+          {calledOutSpeciesTraits && calledOutSpeciesTraits.length > 0 && (
+            <SummaryList
+              list={calledOutSpeciesTraits}
+              title="Species Traits"
+              className={styles.summaryList}
+            />
+          )}
+          {moreDetailsUrl && (
+            <div className={styles.detailsLink}>
+              <Button
+                href={moreDetailsUrl}
+                variant="builder-text"
+                size="x-small"
+                target="_blank"
+                rel="noreferrer"
+              >
+                {fullName} Details Page <ArrowRightIcon />
+              </Button>
+            </div>
+          )}
+          <ConfirmSpeciesContent
+            heading={`${fullName} Traits`}
+            helpItems={builderText}
+            speciesTraits={visibleSpeciesTraits.map((trait) => ({
+              name: getRacialTraitName(trait),
+              description: getRacialTraitDescription(trait),
+            }))}
+          />
+        </div>
+      )}
+    </ConfirmModal>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/EditorWithDialog/EditorWithDialog.tsx b/ddb_main/subApps/builder/components/EditorWithDialog/EditorWithDialog.tsx
new file mode 100644
index 0000000..c28c7aa
--- /dev/null
+++ b/ddb_main/subApps/builder/components/EditorWithDialog/EditorWithDialog.tsx
@@ -0,0 +1,108 @@
+import clsx from "clsx";
+import React, {
+  cloneElement,
+  FC,
+  HTMLAttributes,
+  ReactElement,
+  useRef,
+  useState,
+} from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import { Button } from "~/components/Button";
+import { ConfirmModal } from "~/components/ConfirmModal";
+import { Textarea } from "~/components/Textarea";
+
+import styles from "./styles.module.css";
+
+interface EditorWithDialogProps extends HTMLAttributes<HTMLDivElement> {
+  heading: ReactElement;
+  placeholder: string;
+  content: string;
+  editButtonLabel: string;
+  addButtonLabel: string;
+  onSave?: (content: string) => void;
+  extraNode?: React.ReactNode;
+  saveOnBlur?: boolean;
+}
+
+export const EditorWithDialog: FC<EditorWithDialogProps> = ({
+  addButtonLabel,
+  className,
+  editButtonLabel,
+  content = "",
+  extraNode,
+  heading,
+  onSave,
+  placeholder,
+  saveOnBlur = true,
+  ...props
+}) => {
+  const [isOpen, setIsOpen] = useState(false);
+  const textareaInput = useRef<HTMLDivElement>(null);
+  const id = uuidv4();
+  const headingNode = cloneElement(heading, { className: styles.heading });
+
+  const handleInputBlur = (content: string): void => {
+    if (saveOnBlur) {
+      if (onSave) onSave(content);
+    }
+  };
+
+  const handleShowModal = () => {
+    setIsOpen(true);
+  };
+
+  const handleCloseModal = () => {
+    setIsOpen(false);
+  };
+
+  const modalHeading: string = content.trim().length
+    ? editButtonLabel
+    : addButtonLabel;
+  const buttonLabel: string = modalHeading;
+
+  return (
+    <div className={clsx([styles.container, className])} {...props}>
+      <header className={styles.header}>
+        {headingNode}
+        <Button onClick={handleShowModal} size="xx-small" color="builder-green">
+          {buttonLabel}
+        </Button>
+      </header>
+      {content.trim().length > 0 && (
+        <div className={styles.preview} data-testid="textarea-editor-preview">
+          {content}
+        </div>
+      )}
+      <ConfirmModal
+        heading={modalHeading}
+        open={isOpen}
+        onClose={handleCloseModal}
+        onConfirm={handleCloseModal}
+        data-testid="textarea-editor-modal"
+        modal
+        variant="confirm-only"
+        confirmButtonText={"Save and Close"}
+        color="builder-green"
+        useMobileFullScreen
+      >
+        <div className={styles.content}>
+          <label className={styles.title} htmlFor={id}>
+            {heading}
+          </label>
+          <Textarea
+            className={styles.textarea}
+            ref={textareaInput}
+            id={id}
+            placeholder={placeholder}
+            value={content}
+            onInputKeyUp={() => {}}
+            onInputBlur={handleInputBlur}
+          />
+          {extraNode && <div className={styles.extra}>{extraNode}</div>}
+        </div>
+      </ConfirmModal>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/EquipmentActions/EquipmentActions.tsx b/ddb_main/subApps/builder/components/EquipmentActions/EquipmentActions.tsx
new file mode 100644
index 0000000..baf4ccb
--- /dev/null
+++ b/ddb_main/subApps/builder/components/EquipmentActions/EquipmentActions.tsx
@@ -0,0 +1,54 @@
+import { FC } from "react";
+
+import { Button } from "~/components/Button";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useEquipmentMethods } from "~/subApps/builder/hooks/useEquipmentMethods";
+import { Item } from "~/types";
+
+export interface EquipmentActionsProps {
+  item: Item;
+  equipLabel: string;
+  unequipLabel: string;
+}
+
+export const EquipmentActions: FC<EquipmentActionsProps> = ({
+  item,
+  equipLabel,
+  unequipLabel,
+}) => {
+  const { itemUtils } = useCharacterEngine();
+  const { onToggleEquip } = useEquipmentMethods();
+  const isEquipped = itemUtils.isEquipped(item);
+  const isStackable = itemUtils.isStackable(item);
+  const canEquip = itemUtils.canEquip(item);
+  const quantity = itemUtils.getQuantity(item);
+
+  const handleToggleEquip = (e) => onToggleEquip(e, item);
+
+  return (
+    <>
+      {isStackable && (
+        <div className="equipment-list-item-callout-quantity">
+          <span className="equipment-list-item-callout-quantity-extra">
+            Qty
+          </span>
+          <span className="equipment-list-item-callout-quantity-value">
+            {quantity}
+          </span>
+        </div>
+      )}
+      {canEquip && (
+        <div className="equipment-list-item-callout-action">
+          <Button
+            onClick={handleToggleEquip}
+            size="xx-small"
+            color="builder-green"
+            variant={isEquipped ? "solid" : "outline"}
+          >
+            {isEquipped ? unequipLabel : equipLabel}
+          </Button>
+        </div>
+      )}
+    </>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/HpManageModal/HpManageModal.tsx b/ddb_main/subApps/builder/components/HpManageModal/HpManageModal.tsx
new file mode 100644
index 0000000..e411a54
--- /dev/null
+++ b/ddb_main/subApps/builder/components/HpManageModal/HpManageModal.tsx
@@ -0,0 +1,253 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useMemo, useState } from "react";
+import { useDispatch } from "react-redux";
+
+import {
+  characterActions,
+  ClassUtils,
+  Constants,
+  DiceUtils,
+  FormatUtils,
+  HelperUtils,
+  RuleDataUtils,
+} from "@dndbeyond/character-rules-engine";
+
+import { ConfirmModal, ConfirmModalProps } from "~/components/ConfirmModal";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import {
+  HP_BASE_MAX_VALUE,
+  HP_BONUS_VALUE,
+  HP_OVERRIDE_MAX_VALUE,
+} from "~/subApps/sheet/constants";
+import { FormInputField } from "~/tools/js/Shared/components/common/FormInputField";
+
+import styles from "./styles.module.css";
+
+export interface HpManageModalProps
+  extends Omit<ConfirmModalProps, "onConfirm"> {}
+
+export const HpManageModal: FC<HpManageModalProps> = ({
+  onClose,
+  ...props
+}) => {
+  const dispatch = useDispatch();
+  const { hpInfo, preferences, ruleData } = useCharacterEngine();
+
+  const [baseHp, setBaseHp] = useState(hpInfo.baseHp);
+  const [bonusHp, setBonusHp] = useState(hpInfo.bonusHp);
+  const [overrideHp, setOverrideHp] = useState(hpInfo.overrideHp);
+
+  const reset = () => {
+    setBaseHp(hpInfo.baseHp);
+    setBonusHp(hpInfo.bonusHp);
+    setOverrideHp(hpInfo.overrideHp);
+  };
+
+  const handleClose = () => {
+    onClose();
+    reset();
+  };
+
+  const onConfirm = () => {
+    if (baseHp !== hpInfo.baseHp) {
+      dispatch(characterActions.baseHitPointsSet(baseHp));
+    }
+
+    if (bonusHp !== hpInfo.bonusHp) {
+      dispatch(characterActions.bonusHitPointsSet(bonusHp));
+    }
+
+    if (overrideHp !== hpInfo.overrideHp) {
+      dispatch(characterActions.overrideHitPointsSet(overrideHp));
+    }
+
+    onClose();
+    reset();
+  };
+
+  const transformBaseHp = (value: string): number => {
+    let parsedNumber = HelperUtils.parseInputInt(
+      value,
+      RuleDataUtils.getMinimumHpTotal(ruleData)
+    );
+    return HelperUtils.clampInt(
+      parsedNumber,
+      RuleDataUtils.getMinimumHpTotal(ruleData),
+      HP_BASE_MAX_VALUE
+    );
+  };
+
+  const transformBonusHp = (value: string): number | null => {
+    let parsedNumber = HelperUtils.parseInputInt(value);
+    if (parsedNumber === null) {
+      return parsedNumber;
+    }
+    return HelperUtils.clampInt(
+      parsedNumber,
+      HP_BONUS_VALUE.MIN,
+      HP_BONUS_VALUE.MAX
+    );
+  };
+
+  const transformOverrideHp = (value: string): number | null => {
+    let parsedNumber = HelperUtils.parseInputInt(value, null);
+    if (parsedNumber === null) {
+      return parsedNumber;
+    }
+    return HelperUtils.clampInt(
+      parsedNumber,
+      RuleDataUtils.getMinimumHpTotal(ruleData)
+    );
+  };
+
+  const handleOverrideHpUpdate = (value: number | null): void => {
+    const newOverride =
+      value === null
+        ? null
+        : HelperUtils.clampInt(
+            value,
+            RuleDataUtils.getMinimumHpTotal(ruleData),
+            HP_OVERRIDE_MAX_VALUE
+          );
+
+    setOverrideHp(newOverride);
+  };
+
+  const totalHp = useMemo(() => {
+    let totalHp: number =
+      baseHp + hpInfo.totalHitPointSources + (bonusHp === null ? 0 : bonusHp);
+    if (overrideHp !== null) {
+      totalHp = overrideHp;
+    }
+
+    return Math.max(RuleDataUtils.getMinimumHpTotal(ruleData), totalHp);
+  }, [baseHp, bonusHp, overrideHp, hpInfo, ruleData]);
+
+  return (
+    <ConfirmModal
+      onClose={handleClose}
+      heading="Manage Hit Points"
+      onConfirm={onConfirm}
+      confirmButtonText="Apply"
+      useMobileFullScreen
+      {...props}
+    >
+      {/* Total Max Hit Points */}
+      <div className={styles.hpManageModal}>
+        <p className={styles.total}>
+          <span className={styles.totalLabel}>Maximum Hit Points</span>
+          <span className={styles.totalValue}>{totalHp}</span>
+        </p>
+
+        {/* Hit Point Controls */}
+        <div className={styles.controls}>
+          {preferences.hitPointType ===
+          Constants.PreferenceHitPointTypeEnum.FIXED ? (
+            <p className={styles.baseHp}>
+              <span className={clsx([styles.baseHpLabel])}>Fixed HP</span>
+              <span className={styles.baseHpValue}>{baseHp}</span>
+            </p>
+          ) : (
+            <FormInputField
+              label="Rolled HP"
+              initialValue={baseHp}
+              type="number"
+              onBlur={(value) => setBaseHp(value as number)}
+              transformValueOnBlur={transformBaseHp}
+            />
+          )}
+          <FormInputField
+            label="HP Modifier"
+            initialValue={bonusHp}
+            type="number"
+            placeholder={"--"}
+            onBlur={(value) => setBonusHp(value as number)}
+            transformValueOnBlur={transformBonusHp}
+          />
+          <FormInputField
+            inputAttributes={
+              {
+                min: RuleDataUtils.getMinimumHpTotal(ruleData),
+                max: HP_OVERRIDE_MAX_VALUE,
+              } as HTMLAttributes<HTMLInputElement>
+            }
+            label="Override HP"
+            initialValue={overrideHp}
+            type="number"
+            placeholder={"--"}
+            onBlur={handleOverrideHpUpdate}
+            transformValueOnBlur={transformOverrideHp}
+          />
+        </div>
+
+        {/* Hit Point Bonus Sources */}
+        {hpInfo.hitPointSources.length > 0 && (
+          <div className={styles.hpSources}>
+            <h3>Hit Point Bonuses</h3>
+            {hpInfo.hitPointSources.map((hitPointSource, idx) => (
+              <p key={`${idx}:${hitPointSource.source}`}>
+                {FormatUtils.renderSignedNumber(hitPointSource.amount)} from{" "}
+                {hitPointSource.source}
+              </p>
+            ))}
+          </div>
+        )}
+
+        {/* Hit Dice & Potential Values */}
+        <div className={styles.info}>
+          <div className={styles.infoGroup}>
+            <h3>Hit Dice</h3>
+            {hpInfo.classesHitDice.map((classHitDice) => (
+              <div key={ClassUtils.getId(classHitDice.charClass)}>
+                <span className={styles.infoLabel}>
+                  {ClassUtils.getName(classHitDice.charClass)}:
+                </span>
+                <span>{DiceUtils.renderDie(classHitDice.dice)}</span>
+              </div>
+            ))}
+          </div>
+          <div className={styles.infoGroup}>
+            <h3>Potential Values</h3>
+            <div>
+              <span className={styles.infoLabel}>Total Fixed Value HP:</span>
+              <span>{hpInfo.totalFixedValueHp}</span>
+            </div>
+            <div>
+              <span className={styles.infoLabel}>Total Average HP:</span>
+              <span>{hpInfo.totalAverageHp}</span>
+            </div>
+            <div>
+              <span className={styles.infoLabel}>Total Possible HP:</span>
+              <span>{hpInfo.possibleMaxHitPoints}</span>
+            </div>
+          </div>
+        </div>
+
+        {/* HP Help */}
+        <div className={styles.help}>
+          <h3>Max Hit Points</h3>
+          <p>
+            Your hit point maximum is determined by the number you roll for your
+            hit dice each level or a fixed value determined by your hit dice and
+            your Constitution modifier
+          </p>
+
+          <h3>Bonus Hit Points</h3>
+          <p>
+            Use this field to record any miscellaneous bonus hit points you want
+            to add to your normal hit point maximum. These hit points are
+            different from temporary hit points, which you can add on your
+            character sheet during play.
+          </p>
+
+          <h3>Override Hit Points</h3>
+          <p>
+            Use this field to override your typical hit point maximum. The
+            number you enter here will display as your hit point maximum on your
+            character sheet.
+          </p>
+        </div>
+      </div>
+    </ConfirmModal>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/HpSummary/HpSummary.tsx b/ddb_main/subApps/builder/components/HpSummary/HpSummary.tsx
new file mode 100644
index 0000000..a478365
--- /dev/null
+++ b/ddb_main/subApps/builder/components/HpSummary/HpSummary.tsx
@@ -0,0 +1,80 @@
+import { orderBy } from "lodash";
+import { FC, HTMLAttributes, useMemo, useState } from "react";
+
+import { DiceContract, DiceUtils } from "@dndbeyond/character-rules-engine";
+
+import { Button } from "~/components/Button";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+
+import { HpManageModal } from "../HpManageModal";
+import styles from "./styles.module.css";
+
+export interface HpSummaryProps extends HTMLAttributes<HTMLDivElement> {}
+
+export const HpSummary: FC<HpSummaryProps> = ({ className, ...props }) => {
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const { hpInfo } = useCharacterEngine();
+
+  const openModal = () => {
+    setIsModalOpen(true);
+  };
+
+  const closeModal = () => {
+    setIsModalOpen(false);
+  };
+
+  const hitDiceStrings = useMemo(() => {
+    const hitDice = hpInfo.classesHitDice.map(
+      (classHitDice) => classHitDice.dice
+    );
+    const combinedHitDice: Array<DiceContract> = [];
+    hitDice.forEach((hitDie) => {
+      const existingDieIdx = combinedHitDice.findIndex(
+        (hitDice) => hitDice.diceValue === hitDie.diceValue
+      );
+      if (existingDieIdx > -1) {
+        let existingDie = combinedHitDice[existingDieIdx];
+        combinedHitDice[existingDieIdx] = {
+          ...combinedHitDice[existingDieIdx],
+          diceCount:
+            (existingDie.diceCount !== null ? existingDie.diceCount : 0) +
+            (hitDie.diceCount !== null ? hitDie.diceCount : 0),
+        };
+      } else {
+        combinedHitDice.push(hitDie);
+      }
+    });
+
+    return orderBy(combinedHitDice, ["diceValue"]).map((hitDie) =>
+      DiceUtils.renderDie(hitDie)
+    );
+  }, [hpInfo]);
+
+  return (
+    <div {...props}>
+      <div className={styles.hpSummaryContent}>
+        <div>
+          <p>
+            <span className={styles.label}>Max Hit Points:</span>
+            <span data-testid="hit-point-max">{hpInfo.totalHp}</span>
+          </p>
+          <p>
+            <span className={styles.label}>Hit Dice:</span>
+            <span data-testid="hit-point-dice">
+              {hitDiceStrings.join(" + ")}
+            </span>
+          </p>
+        </div>
+        <Button
+          className={styles.button}
+          variant="builder"
+          size="x-small"
+          onClick={openModal}
+        >
+          Manage HP
+        </Button>
+      </div>
+      <HpManageModal open={isModalOpen} onClose={closeModal} />
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/Listing/Listing.tsx b/ddb_main/subApps/builder/components/Listing/Listing.tsx
new file mode 100644
index 0000000..6d7f45c
--- /dev/null
+++ b/ddb_main/subApps/builder/components/Listing/Listing.tsx
@@ -0,0 +1,55 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import { GroupedListingItem, ListingItem } from "../../types";
+import { ListingGroup } from "./ListingGroup";
+import { ListingItemButton } from "./ListingItemButton/ListingItemButton";
+import styles from "./styles.module.css";
+
+export interface ListingProps extends HTMLAttributes<HTMLDivElement> {
+  items: Array<ListingItem | GroupedListingItem>;
+  disabledIds?: Array<number | string>;
+  onQuickSelect?: (entity: ListingItem["entity"]) => void;
+}
+
+/**
+ * A generic listing component that displays a list of items. Items cannot be
+ * internal because it is used for both races/species and classes. Keeping the
+ * data fetch outside this component allows for more flexibility.
+ */
+
+export const Listing: FC<ListingProps> = ({
+  className,
+  items,
+  disabledIds,
+  onQuickSelect,
+  ...props
+}) => {
+  return (
+    <div className={clsx([styles.listing, className])} {...props}>
+      {items.length > 0 ? (
+        items.map((item) => {
+          const isDisabled = disabledIds && disabledIds.includes(item.id);
+
+          return item.type === "group" ? (
+            <ListingGroup
+              item={item as GroupedListingItem}
+              key={item.id + "group"}
+              disabledIds={disabledIds}
+              onQuickSelect={onQuickSelect}
+            />
+          ) : (
+            <ListingItemButton
+              item={item as ListingItem}
+              isDisabled={isDisabled}
+              key={item.id}
+              onQuickSelect={onQuickSelect}
+            />
+          );
+        })
+      ) : (
+        <p className={styles.notFound}>No Listings Found</p>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/Listing/ListingGroup/ListingGroup.tsx b/ddb_main/subApps/builder/components/Listing/ListingGroup/ListingGroup.tsx
new file mode 100644
index 0000000..cb9388b
--- /dev/null
+++ b/ddb_main/subApps/builder/components/Listing/ListingGroup/ListingGroup.tsx
@@ -0,0 +1,90 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, MouseEvent, useState } from "react";
+
+import ChevronDown from "@dndbeyond/fontawesome-cache/svgs/solid/chevron-down.svg";
+
+import { LegacyBadge } from "~/components/LegacyBadge";
+import { GroupedListingItem } from "~/subApps/builder/types";
+
+import { ListingItemButton } from "../ListingItemButton";
+import styles from "./styles.module.css";
+
+export interface ListingGroupProps extends HTMLAttributes<HTMLDetailsElement> {
+  item: GroupedListingItem;
+  disabledIds?: Array<number | string>;
+  onQuickSelect?: (entity: GroupedListingItem["entity"]) => void;
+}
+
+export const ListingGroup: FC<ListingGroupProps> = ({
+  className,
+  item,
+  disabledIds,
+  onQuickSelect,
+  ...props
+}) => {
+  const {
+    entityTypeId,
+    error,
+    heading,
+    id,
+    image,
+    isLegacy,
+    metaItems,
+    text,
+    type,
+    onClick,
+    ...itemProps
+  } = item;
+
+  const [isOpen, setIsOpen] = useState<boolean>(false);
+
+  const handleToggle = (e: MouseEvent) => {
+    e.preventDefault();
+    setIsOpen(!isOpen);
+  };
+
+  return (
+    <details className={styles.details} key={id} open={isOpen} {...props}>
+      <summary
+        className={clsx([styles.summary, className])}
+        onClick={handleToggle}
+      >
+        {image && (
+          <img src={image} alt={`${heading} avatar`} className={styles.image} />
+        )}
+        <div>
+          <header className={styles.header}>
+            <h3 className={styles.heading}>
+              {heading}{" "}
+              <span
+                className={styles.count}
+              >{`(${itemProps.listItems.length})`}</span>
+            </h3>
+            {isLegacy && <LegacyBadge className={styles.tag} />}
+          </header>
+          {text && <p className={styles.text}>{text}</p>}
+          {metaItems && metaItems.length > 0 && (
+            <div className={styles.metaItems}>
+              {metaItems.map((metaItem, idx) => (
+                <span className={styles[metaItem.type]} key={idx}>
+                  {metaItem.text}
+                </span>
+              ))}
+            </div>
+          )}
+        </div>
+        <ChevronDown className={styles.icon} />
+      </summary>
+      <div className={styles.content}>
+        {itemProps.listItems.map((item) => (
+          <ListingItemButton
+            item={item}
+            isDisabled={disabledIds && disabledIds.includes(item.id)}
+            key={item.id}
+            onQuickSelect={onQuickSelect}
+          />
+        ))}
+      </div>
+    </details>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/Listing/ListingItemButton/ListingItemButton.tsx b/ddb_main/subApps/builder/components/Listing/ListingItemButton/ListingItemButton.tsx
new file mode 100644
index 0000000..ce36e86
--- /dev/null
+++ b/ddb_main/subApps/builder/components/Listing/ListingItemButton/ListingItemButton.tsx
@@ -0,0 +1,78 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, MouseEvent } from "react";
+
+import ChevronRight from "@dndbeyond/fontawesome-cache/svgs/solid/chevron-right.svg";
+
+import { LegacyBadge } from "~/components/LegacyBadge";
+import { ListingItem } from "~/subApps/builder/types";
+
+import styles from "./styles.module.css";
+
+export interface ListingItemProps extends HTMLAttributes<HTMLButtonElement> {
+  item: ListingItem;
+  isDisabled?: boolean;
+  onQuickSelect?: (entity: ListingItem["entity"]) => void;
+}
+
+export const ListingItemButton: FC<ListingItemProps> = ({
+  className,
+  item,
+  isDisabled,
+  onQuickSelect,
+  ...props
+}) => {
+  const {
+    entityTypeId,
+    error,
+    heading,
+    id,
+    image,
+    isLegacy,
+    metaItems,
+    text,
+    type,
+    onClick,
+    ...itemProps
+  } = item;
+
+  const handleClick = (e: MouseEvent) => {
+    e.preventDefault();
+    //QuickSelect is from Quick and RandomBuild modes only
+    if (onQuickSelect && !isDisabled) {
+      onQuickSelect(item.entity);
+    } else if (onClick && !isDisabled) {
+      onClick(id);
+    }
+  };
+
+  return (
+    <button
+      className={clsx([styles.button, className])}
+      onClick={handleClick}
+      aria-disabled={isDisabled}
+      key={id}
+      {...props}
+    >
+      {image && (
+        <img src={image} alt={`${heading} avatar`} className={styles.image} />
+      )}
+      <div>
+        <header className={styles.header}>
+          <h3 className={styles.heading}>{heading}</h3>
+          {isLegacy && <LegacyBadge className={styles.tag} />}
+        </header>
+        {text && <p className={styles.text}>{text}</p>}
+        {metaItems && metaItems.length > 0 && (
+          <div className={styles.metaItems}>
+            {metaItems.map((metaItem, idx) => (
+              <span className={styles[metaItem.type]} key={idx}>
+                {metaItem.text}
+              </span>
+            ))}
+          </div>
+        )}
+      </div>
+      <ChevronRight className={styles.icon} />
+    </button>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/PortraitName/PortraitName.tsx b/ddb_main/subApps/builder/components/PortraitName/PortraitName.tsx
new file mode 100644
index 0000000..a1bcbca
--- /dev/null
+++ b/ddb_main/subApps/builder/components/PortraitName/PortraitName.tsx
@@ -0,0 +1,209 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useEffect, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import { CharacterPortraitContract } from "@dndbeyond/character-rules-engine";
+import ShuffleIcon from "@dndbeyond/fontawesome-cache/svgs/solid/shuffle.svg";
+import { LabelChip } from "@dndbeyond/ttui/components/LabelChip";
+
+import { Button } from "~/components/Button";
+import { ConfirmModal } from "~/components/ConfirmModal";
+import {
+  CharacterNameLimitMsg,
+  InputLimits,
+  DefaultCharacterName,
+} from "~/constants";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { builderActions } from "~/tools/js/CharacterBuilder/actions";
+import { builderSelectors } from "~/tools/js/CharacterBuilder/selectors";
+import { FormInputField } from "~/tools/js/Shared/components/common/FormInputField";
+import { PortraitManager } from "~/tools/js/Shared/containers/panes/DecoratePane";
+import Tooltip from "~/tools/js/commonComponents/Tooltip";
+import { CharacterAvatarPortrait } from "~/tools/js/smartComponents/CharacterAvatar";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  hidePortrait?: boolean;
+  handleNameUpdate?: (newValue: string) => void;
+  fullWidth?: boolean;
+  useDefaultCharacterName?: boolean;
+}
+
+export const PortraitName: FC<Props> = ({
+  fullWidth,
+  hidePortrait,
+  handleNameUpdate,
+  useDefaultCharacterName,
+  ...props
+}) => {
+  const dispatch = useDispatch();
+  const { characterActions, decorationUtils, decorationInfo, characterName } =
+    useCharacterEngine();
+  const [localValue, setLocalValue] = useState(characterName);
+
+  const suggestedNames = useSelector(builderSelectors.getSuggestedNames);
+
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const [selectedPortrait, setSelectedPortrait] =
+    useState<CharacterPortraitContract | null>(null);
+  const [showSuggestions, setShowSuggestions] = useState(false);
+  const [currentSuggestedNames, setCurrentSuggestedNames] = useState<
+    Array<string>
+  >([]);
+
+  useEffect(() => {
+    setCurrentSuggestedNames(suggestedNames);
+  }, [suggestedNames]);
+
+  const handleNameFieldSet = (value: string | null): void => {
+    let updatedName = value ?? "";
+
+    // If the flag useDefaultCharacterName is true and value is falsy, set the name to the DefaultCharacterName
+    if (useDefaultCharacterName) updatedName = value || DefaultCharacterName;
+
+    setLocalValue(updatedName);
+    if (handleNameUpdate) {
+      handleNameUpdate(updatedName);
+    } else {
+      dispatch(characterActions.nameSet(updatedName));
+    }
+  };
+
+  const handleShowSuggestions = (): void => {
+    if (currentSuggestedNames.length === 0) {
+      dispatch(builderActions.suggestedNamesRequest());
+    }
+
+    setShowSuggestions(!showSuggestions);
+  };
+
+  const handleSuggestMoreClick = (): void => {
+    dispatch(builderActions.suggestedNamesRequest());
+  };
+
+  const onConfirmPortrait = (): void => {
+    if (selectedPortrait?.avatarId && selectedPortrait?.avatarUrl) {
+      dispatch(
+        characterActions.portraitSet(
+          selectedPortrait.avatarId,
+          selectedPortrait.avatarUrl
+        )
+      );
+    }
+    closeModal();
+  };
+
+  const handleSelectPortrait = (portrait: CharacterPortraitContract): void => {
+    setSelectedPortrait(portrait);
+  };
+
+  const handlePortraitClick = (): void => {
+    setIsModalOpen(true);
+  };
+
+  const closeModal = (): void => {
+    setIsModalOpen(false);
+    setSelectedPortrait(null);
+  };
+
+  const avatarUrl = decorationUtils.getAvatarInfo(decorationInfo).avatarUrl;
+
+  return (
+    <div {...props}>
+      <div
+        className={clsx([styles.nameContainer, fullWidth && styles.fullwidth])}
+      >
+        {!hidePortrait && (
+          <>
+            <div onClick={handlePortraitClick}>
+              <CharacterAvatarPortrait
+                className={clsx([styles.avatar, !avatarUrl && styles.empty])}
+                avatarUrl={avatarUrl}
+                data-testid="character-portrait"
+              />
+            </div>
+            <ConfirmModal
+              open={isModalOpen}
+              onClose={closeModal}
+              onConfirm={onConfirmPortrait}
+              heading="Manage Portrait"
+              className={styles.portraitManagerModal}
+              confirmButtonText="Apply"
+              useMobileFullScreen
+            >
+              <PortraitManager handleSelectPortrait={handleSelectPortrait} />
+            </ConfirmModal>
+          </>
+        )}
+        <div className={styles.inputContainer}>
+          <FormInputField
+            label="Character Name"
+            onBlur={handleNameFieldSet}
+            initialValue={localValue}
+            inputAttributes={
+              {
+                spellCheck: false,
+                autoComplete: "off",
+              } as HTMLAttributes<HTMLInputElement>
+            }
+            maxLength={InputLimits.characterNameMaxLength}
+            maxLengthErrorMsg={CharacterNameLimitMsg}
+          />
+          <Button
+            className={styles.suggestionButton}
+            onClick={handleShowSuggestions}
+            size="xx-small"
+            variant="text"
+            forceThemeMode="light"
+          >
+            {showSuggestions ? "Hide" : "Show"} Suggestions
+          </Button>
+        </div>
+      </div>
+      {showSuggestions && (
+        <div>
+          <div className={styles.suggestionsContainer}>
+            <div className={styles.suggestionsLabel}>Suggestions:</div>
+            <div>
+              <Tooltip title="Shuffle Suggestions">
+                <Button
+                  variant="text"
+                  size="xx-small"
+                  onClick={handleSuggestMoreClick}
+                  className={styles.shuffleButton}
+                >
+                  <ShuffleIcon className={styles.shuffleIcon} />
+                </Button>
+              </Tooltip>
+            </div>
+            <div className={styles.suggestions}>
+              {currentSuggestedNames.map((name: string, index: number) => (
+                <LabelChip
+                  key={index}
+                  onClick={() => handleNameFieldSet(name)}
+                  className={styles.suggestion}
+                  data-testid="suggestion-chip"
+                >
+                  {name}
+                </LabelChip>
+              ))}
+            </div>
+          </div>
+          <div className={styles.credit}>
+            Names by
+            <Button
+              className={styles.creditLink}
+              href="http://www.fantasynamegenerators.com/"
+              target="_blank"
+              rel="noreferrer"
+              variant="text"
+            >
+              <span className={styles.creditText}>Fantasy Name Generators</span>
+            </Button>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/Search/Search.tsx b/ddb_main/subApps/builder/components/Search/Search.tsx
new file mode 100644
index 0000000..5b903ce
--- /dev/null
+++ b/ddb_main/subApps/builder/components/Search/Search.tsx
@@ -0,0 +1,32 @@
+import clsx from "clsx";
+import { ChangeEvent, FC, HTMLAttributes } from "react";
+
+import styles from "./styles.module.css";
+
+export interface SearchProps extends HTMLAttributes<HTMLInputElement> {
+  placeholder?: string;
+  value: string;
+  onChange: (e: ChangeEvent<HTMLInputElement>) => void;
+}
+
+export const Search: FC<SearchProps> = ({
+  className,
+  placeholder = "Search...",
+  value,
+  onChange,
+  ...props
+}) => (
+  <input
+    type="search"
+    className={clsx([styles.search, className])}
+    value={value}
+    onChange={onChange}
+    placeholder={placeholder}
+    spellCheck={false}
+    autoComplete={"off"}
+    {...props}
+  />
+);
+{
+  /* {showAddAmountControls ? this.renderAmountControls() : null} */
+}
diff --git a/ddb_main/subApps/builder/components/SpeciesDisplay/SpeciesDisplay.tsx b/ddb_main/subApps/builder/components/SpeciesDisplay/SpeciesDisplay.tsx
new file mode 100644
index 0000000..6cc81ba
--- /dev/null
+++ b/ddb_main/subApps/builder/components/SpeciesDisplay/SpeciesDisplay.tsx
@@ -0,0 +1,70 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+import { useNavigate } from "react-router-dom";
+
+import { Button } from "~/components/Button";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { navigationConfig } from "~/tools/js/CharacterBuilder/config";
+
+import { RouteKey } from "../../constants";
+import styles from "./styles.module.css";
+
+export interface SpeciesDisplayProps extends HTMLAttributes<HTMLDivElement> {
+  onRequestAction?: () => void;
+  actionText?: string;
+  headingText?: string;
+}
+
+export const SpeciesDisplay: FC<SpeciesDisplayProps> = ({
+  actionText,
+  className,
+  headingText,
+  ...props
+}) => {
+  const navigate = useNavigate();
+  const { characterId, race, ruleData, ruleDataUtils } = useCharacterEngine();
+
+  const { baseName, fullName, portraitAvatarUrl, subRaceShortName } =
+    race || {};
+  const portrait =
+    portraitAvatarUrl || ruleDataUtils.getDefaultRaceImageUrl(ruleData);
+
+  // Navigate back to the class manage page
+  const handleNavigate = (): void =>
+    navigate(
+      navigationConfig
+        .getRouteDefPath(RouteKey.RACE_MANAGE)
+        .replace(":characterId", characterId)
+    );
+
+  return (
+    <div className={clsx([styles.speciesDisplay, className])} {...props}>
+      <h3 className={styles.heading}>{headingText || `Selected Species`}</h3>
+      <div className={styles.content}>
+        {portrait && (
+          <img
+            className={styles.portrait}
+            src={portrait}
+            alt={fullName || baseName || ""}
+            width={50}
+            height={50}
+          />
+        )}
+        <p className={styles.species}>
+          {subRaceShortName && (
+            <span className={styles.subspecies}>{subRaceShortName}</span>
+          )}
+          {baseName}
+        </p>
+        <Button
+          className={styles.button}
+          onClick={handleNavigate}
+          size="xx-small"
+          variant="builder"
+        >
+          {actionText || `Change Species`}
+        </Button>
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/components/Spinner/Spinner.tsx b/ddb_main/subApps/builder/components/Spinner/Spinner.tsx
new file mode 100644
index 0000000..db8549e
--- /dev/null
+++ b/ddb_main/subApps/builder/components/Spinner/Spinner.tsx
@@ -0,0 +1,21 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, ReactNode } from "react";
+
+import { AnimatedLoadingRingSvg } from "~/tools/js/smartComponents/Svg";
+
+interface SpinnerProps extends HTMLAttributes<HTMLDivElement> {
+  label?: ReactNode;
+}
+
+export const Spinner: FC<SpinnerProps> = ({
+  label = "Loading",
+  className,
+  ...props
+}) => {
+  return (
+    <div className={clsx(["ddbc-loading-placeholder", className])} {...props}>
+      <AnimatedLoadingRingSvg className="ddbc-loading-placeholder__icon" />
+      <span className="ddbc-loading-placeholder__label">{label}</span>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/constants.ts b/ddb_main/subApps/builder/constants.ts
new file mode 100644
index 0000000..c5d6247
--- /dev/null
+++ b/ddb_main/subApps/builder/constants.ts
@@ -0,0 +1,52 @@
+export const NavigationType = {
+  HelpPage: "HelpPage",
+  Page: "StandardPage",
+  Section: "Section",
+  External: "External",
+};
+
+export const RouteKey = {
+  QUICK_BUILD: "ROUTE:QUICK_BUILD",
+  RANDOMIZE_BUILD: "ROUTE:RANDOMIZE_BUILD",
+
+  HOME_HELP: "ROUTE:HOME_HELP",
+  HOME_INTRODUCTION: "ROUTE:HOME_INTRODUCTION",
+  HOME_BASIC_INFO: "ROUTE:HOME_BASIC_INFO",
+
+  RACE_HELP: "ROUTE:RACE_HELP",
+  RACE_CHOOSE: "ROUTE:RACE_CHOOSE",
+  RACE_MANAGE: "ROUTE:RACE_MANAGE",
+
+  CLASS_HELP: "ROUTE:CLASS_HELP",
+  CLASS_CHOOSE: "ROUTE:CLASS_CHOOSE",
+  CLASS_MANAGE: "ROUTE:CLASS_MANAGE",
+
+  ABILITY_SCORES_HELP: "ROUTE:ABILITY_SCORES_HELP",
+  ABILITY_SCORES_MANAGE: "ROUTE:ABILITY_SCORES_MANAGE",
+
+  DESCRIPTION_HELP: "ROUTE:DESCRIPTION_HELP",
+  DESCRIPTION_MANAGE: "ROUTE:DESCRIPTION_MANAGE",
+
+  EQUIPMENT_HELP: "ROUTE:EQUIPMENT_HELP",
+  EQUIPMENT_MANAGE: "ROUTE:EQUIPMENT_MANAGE",
+
+  WHATS_NEXT: "ROUTE:WHATS_NEXT",
+};
+
+export const SectionKey = {
+  HOME: "SECTION:HOME",
+  RACE: "SECTION:RACE",
+  CLASS: "SECTION:CLASS",
+  ABILITY_SCORES: "SECTION:ABILITY_SCORES",
+  DESCRIPTION: "SECTION:DESCRIPTION",
+  EQUIPMENT: "SECTION:EQUIPMENT",
+  QUICK_BUILD: "SECTION:QUICK_BUILD",
+  RANDOMIZE: "SECTION:RANDOMIZE",
+  WHATS_NEXT: "SECTION:WHATS_NEXT",
+};
+
+export const BuilderMethod = {
+  QUICK: "QUICK",
+  STEP_BY_STEP: "STEP_BY_STEP",
+  RANDOMIZE: "RANDOMIZE",
+};
diff --git a/ddb_main/subApps/builder/contexts/Builder/Builder.tsx b/ddb_main/subApps/builder/contexts/Builder/Builder.tsx
new file mode 100644
index 0000000..8152885
--- /dev/null
+++ b/ddb_main/subApps/builder/contexts/Builder/Builder.tsx
@@ -0,0 +1,66 @@
+import { createContext, FC, useContext, useState } from "react";
+
+import { BuilderMethod } from "../../types";
+
+export interface BuilderContextType {
+  builderMethod: BuilderMethod | null;
+  isCharacterLoading: boolean;
+  isCharacterLoaded: boolean;
+  pdfUrl: string | null;
+  setBuilderMethod: (method: BuilderMethod) => void;
+  suggestedNames: string[];
+}
+
+export const BuilderContext = createContext<BuilderContextType>({
+  builderMethod: null,
+  isCharacterLoading: true,
+  isCharacterLoaded: false,
+  pdfUrl: null,
+  setBuilderMethod: () => {},
+  suggestedNames: [],
+});
+
+export const BuilderProvider: FC = ({ children }) => {
+  const [builderMethod, setBuilderMethodState] = useState<BuilderMethod | null>(
+    null
+  );
+  const [isCharacterLoading, setIsCharacterLoading] = useState(true);
+  const [isCharacterLoaded, setIsCharacterLoaded] = useState(false);
+  const [pdfUrl, setPdfUrl] = useState<string | null>(null);
+  const [suggestedNames, setSuggestedNames] = useState<string[]>([]);
+
+  const setBuilderMethod = async (method: BuilderMethod) => {
+    // Handle setting the builder method via fetch
+  };
+
+  // const response = yield call(ApiRequests.getCharacterRuleData, {
+  //   params: { v: appConfig.version },
+  // });
+  // const data: UnpackMakeApiResponseData<
+  //   typeof ApiRequests.getCharacterRuleData
+  // > | null = ApiAdapterUtils.getResponseData(response);
+
+  // if (data !== null) {
+  //   yield put(ruleDataActions.dataSet(data));
+  // }
+  // yield put(builderActions.builderMethodSetCommit(action.payload));
+
+  return (
+    <BuilderContext.Provider
+      value={{
+        builderMethod,
+        isCharacterLoading,
+        isCharacterLoaded,
+        pdfUrl,
+        setBuilderMethod,
+        suggestedNames,
+      }}
+    >
+      {children}
+    </BuilderContext.Provider>
+  );
+};
+
+export const useBuilderContext = () => {
+  return useContext(BuilderContext);
+};
diff --git a/ddb_main/subApps/builder/contexts/Class/Class.tsx b/ddb_main/subApps/builder/contexts/Class/Class.tsx
new file mode 100644
index 0000000..0134897
--- /dev/null
+++ b/ddb_main/subApps/builder/contexts/Class/Class.tsx
@@ -0,0 +1,90 @@
+import { createContext, FC, useContext, useEffect, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import { ApiAdapterUtils } from "@dndbeyond/character-rules-engine";
+
+import { builderActions } from "~/tools/js/CharacterBuilder/actions";
+import { apiCreatorSelectors } from "~/tools/js/Shared/selectors";
+import { ClassDefinitionContract as ClassDef } from "~/types";
+
+/**
+ * A context to provide data to the application without causing a re-render or
+ * unnecessary fetches and transforms. This context is used in places where
+ * character-specific data is not needed.
+ */
+export interface ClassContextType {
+  query: string;
+  setQuery: (query: string) => void;
+  filteredClasses: Array<ClassDef>;
+  allClasses: Array<ClassDef>;
+  handleSelectClass: (id: number) => void;
+  isLoading: boolean;
+  isModalShowing: boolean;
+  closeModal: () => void;
+}
+
+export const ClassContext = createContext<ClassContextType>(null!);
+
+export const ClassProvider: FC = ({ children }) => {
+  const dispatch = useDispatch();
+  const [query, setQuery] = useState("");
+  const [allClasses, setAllClasses] = useState<Array<ClassDef>>([]);
+  const [isLoading, setIsLoading] = useState(true);
+  const [isModalShowing, setIsModalShowing] = useState(false);
+  const closeModal = () => setIsModalShowing(false);
+
+  const loadClasses = useSelector(apiCreatorSelectors.makeLoadAvailableClasses);
+
+  const handleSelectClass = (id: number) => {
+    const entity = allClasses.find((c) => c.id === id);
+    if (entity) {
+      dispatch(builderActions.confirmClassSet(entity));
+      setIsModalShowing(true);
+      window.scrollTo(0, 0);
+    }
+  };
+
+  // Handle searching through items
+  const filteredClasses = query
+    ? allClasses.filter((c) =>
+        c.name?.toLowerCase().includes(query.toLowerCase())
+      )
+    : allClasses;
+
+  useEffect(() => {
+    const getAllData = async () => {
+      // Load all classes
+      const response = await loadClasses();
+      const classes = ApiAdapterUtils.getResponseData(response) || [];
+
+      setAllClasses(classes);
+
+      if (classes.length > 0) {
+        setIsLoading(false);
+      }
+    };
+
+    getAllData();
+  }, [loadClasses]);
+
+  return (
+    <ClassContext.Provider
+      value={{
+        query,
+        setQuery,
+        filteredClasses,
+        allClasses,
+        handleSelectClass,
+        isLoading,
+        isModalShowing,
+        closeModal,
+      }}
+    >
+      {children}
+    </ClassContext.Provider>
+  );
+};
+
+export const useClassContext = () => {
+  return useContext(ClassContext);
+};
diff --git a/ddb_main/subApps/builder/contexts/ModalManager/ModalManager.tsx b/ddb_main/subApps/builder/contexts/ModalManager/ModalManager.tsx
new file mode 100644
index 0000000..97311a6
--- /dev/null
+++ b/ddb_main/subApps/builder/contexts/ModalManager/ModalManager.tsx
@@ -0,0 +1,59 @@
+import { createContext, FC, useContext, useState } from "react";
+
+import { ConfirmModal, ConfirmModalProps } from "~/components/ConfirmModal";
+
+export interface ModalData {
+  content: React.ReactNode;
+  props: Omit<ConfirmModalProps, "open">;
+}
+export interface ModalManagerContextType {
+  createModal: (modalData: ModalData) => void;
+}
+
+export const ModalManagerContext = createContext<ModalManagerContextType>(
+  null!
+);
+
+export const ModalManagerProvider: FC = ({ children }) => {
+  const [modalData, setModalData] = useState<ModalData | null>(null);
+
+  const createModal = (modalData: ModalData) => {
+    setModalData(modalData);
+  };
+
+  const removeModal = () => {
+    setModalData(null);
+  };
+
+  const handleClose = () => {
+    removeModal();
+    if (modalData) {
+      modalData.props.onClose();
+    }
+  };
+
+  const handleConfirm = () => {
+    removeModal();
+    if (modalData) {
+      modalData.props.onConfirm();
+    }
+  };
+
+  return (
+    <ModalManagerContext.Provider value={{ createModal }}>
+      {children}
+      <ConfirmModal
+        {...modalData?.props}
+        onConfirm={handleConfirm}
+        onClose={handleClose}
+        open={!!modalData}
+      >
+        {modalData?.content}
+      </ConfirmModal>
+    </ModalManagerContext.Provider>
+  );
+};
+
+export const useModalManager = () => {
+  return useContext(ModalManagerContext);
+};
diff --git a/ddb_main/subApps/builder/contexts/Species/Species.tsx b/ddb_main/subApps/builder/contexts/Species/Species.tsx
new file mode 100644
index 0000000..0dc0315
--- /dev/null
+++ b/ddb_main/subApps/builder/contexts/Species/Species.tsx
@@ -0,0 +1,302 @@
+import { groupBy, keyBy, uniqBy } from "lodash";
+import { createContext, FC, useContext, useEffect, useState } from "react";
+import { useSelector } from "react-redux";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useSource } from "~/hooks/useSource";
+import { apiCreatorSelectors } from "~/tools/js/Shared/selectors";
+import { TypeScriptUtils } from "~/tools/js/Shared/utils";
+import {
+  HtmlSelectOption,
+  HtmlSelectOptionGroup,
+  RaceDefinitionContract as RaceDef,
+  RaceDefinitionContract,
+  SimpleSourcedDefinitionContract,
+} from "~/types";
+
+import { GroupedListingItem, ListingItem } from "../../types";
+
+export interface SpeciesContextType {
+  closeModal: () => void;
+  defaultSpeciesImageUrl: string;
+  isLegacyShowing: boolean;
+  isModalShowing: boolean;
+  query: string;
+  selectedSpecies?: RaceDef;
+  setQuery: (query: string) => void;
+  source: string;
+  sourceOptions: (HtmlSelectOptionGroup | HtmlSelectOption)[];
+  filteredSpecies: RaceDef[];
+  allSpecies: RaceDef[];
+  toggleLegacyContent: () => void;
+  transformSpecies: (data: RaceDef[]) => ListingItem[];
+  setSource: (source: string) => void;
+  isLoading: boolean;
+  getSpeciesInGroups: (
+    species: ListingItem[]
+  ) => (ListingItem | GroupedListingItem)[];
+}
+
+export const SpeciesContext = createContext<SpeciesContextType>(null!);
+
+export const SpeciesProvider: FC = ({ children }) => {
+  const {
+    apiAdapterUtils: { getResponseData },
+    raceUtils: { getSubRaceShortName, getBaseName, getIsHomebrew, getSources },
+    ruleData,
+    ruleDataUtils: { getDefaultRaceImageUrl, getRaceGroups },
+    characterUtils: { isPrimarySource },
+  } = useCharacterEngine();
+  const { getSourceDescription, getGroupedOptionsBySourceCategory } =
+    useSource();
+
+  const [allSpecies, setAllSpecies] = useState<Array<RaceDef>>([]);
+  const [isLegacyShowing, setIsLegacyShowing] = useState(true);
+  const [isModalShowing, setIsModalShowing] = useState(false);
+  const [query, setQuery] = useState("");
+  const [selectedSpecies, setSelectedSpecies] = useState<RaceDef>();
+  const [source, setSource] = useState("");
+  const [sourceOptions, setSourceOptions] = useState<
+    (HtmlSelectOptionGroup | HtmlSelectOption)[]
+  >([]);
+  const [isLoading, setIsLoading] = useState(true);
+
+  const loadSpecies = useSelector(apiCreatorSelectors.makeLoadAvailableRaces);
+
+  const defaultSpeciesImageUrl = getDefaultRaceImageUrl(ruleData) ?? "";
+
+  const handleFilteredSpecies = () => {
+    let filtered = allSpecies;
+    //Check legacy toggle
+    if (!isLegacyShowing) {
+      filtered = filtered.filter((s) => !s.isLegacy);
+    }
+
+    // Check sources
+    if (source !== "") {
+      if (source === "HOMEBREW") {
+        filtered = filtered.filter((s) => s.isHomebrew);
+      } else {
+        filtered = filtered.filter((s) =>
+          s.sources?.some(({ sourceId }) => source === sourceId.toString())
+        );
+      }
+    }
+    // Check querys
+    if (query !== "") {
+      filtered = filtered.filter((s) => {
+        return s.fullName?.toLowerCase().includes(query.toLowerCase());
+      });
+    }
+    return filtered;
+  };
+  // Handle searching through items
+  const filteredSpecies = handleFilteredSpecies();
+
+  const onSelectSpecies = (id: string) => {
+    const entity = allSpecies.find(
+      (s) => `${s.entityRaceId}-${s.entityRaceTypeId}` === id
+    );
+    if (entity) {
+      setSelectedSpecies(entity);
+      setIsModalShowing(true);
+      window.scrollTo(0, 0);
+    }
+  };
+
+  const closeModal = () => setIsModalShowing(false);
+
+  const toggleLegacyContent = () => {
+    setIsLegacyShowing(!isLegacyShowing);
+  };
+
+  //Transform Species data into ListingItems
+  const transformSpecies = (data: RaceDef[]): ListingItem[] => {
+    return data.map((species) => {
+      const shortName = getSubRaceShortName(species);
+      const baseName = getBaseName(species);
+      const heading = shortName ? `${shortName} ${baseName}` : baseName || "";
+      const text = getIsHomebrew(species)
+        ? "Homebrew"
+        : getSourceDescription(species?.sources?.[0]?.sourceId || 0) || "";
+
+      return {
+        type: "species",
+        id: `${species.entityRaceId}-${species.entityRaceTypeId}`,
+        entityTypeId: species.entityRaceTypeId,
+        heading,
+        text,
+        image: species.portraitAvatarUrl || defaultSpeciesImageUrl,
+        entity: species,
+        isLegacy: species.isLegacy,
+        onClick: onSelectSpecies,
+      };
+    });
+  };
+
+  // get the ListingItems for species, both grouped and individual
+  const getSpeciesInGroups = (
+    species: ListingItem[]
+  ): (ListingItem | GroupedListingItem)[] => {
+    let groupedSpecies: ListingItem[] = [];
+    let unGroupedSpecies: ListingItem[] = [];
+
+    //species that have a groupId go into the groupedSpecies array and species that don't have a groupId go into the unGroupedSpecies array
+    species.forEach((s) => {
+      const groupIds = (s.entity as RaceDefinitionContract)?.groupIds;
+      if (groupIds && groupIds.length > 0) {
+        groupIds.forEach((groupId) => {
+          groupedSpecies.push({
+            ...s,
+            groupId,
+          });
+        });
+      } else {
+        unGroupedSpecies.push(s);
+      }
+    });
+
+    //Create a lookup of grouped species by groupId
+    const groupedSpeciesLookup = groupBy(groupedSpecies, "groupId");
+    //Create a lookup from all Species Groups from rules data
+    const groupDataLookup = keyBy(getRaceGroups(ruleData), "id");
+    //This array will hold the final list of grouped species
+    const groups: GroupedListingItem[] = [];
+
+    //Iterate through the grouped species lookup to create final groupings
+    Object.keys(groupedSpeciesLookup).forEach((groupId) => {
+      const groupItems = groupedSpeciesLookup[groupId];
+      //If the group only has one item, it is not a group - put it in the unGroupedSpecies array, otherwise create the Grouped Listing Item for the group
+      if (groupItems.length === 1) {
+        unGroupedSpecies.push(groupItems[0]);
+      } else {
+        const groupInfo = groupDataLookup[parseInt(groupId)];
+        groups.push({
+          id: groupId,
+          type: "group",
+          image: groupInfo.avatarUrl ?? "",
+          heading: groupInfo.name ?? "",
+          groupId: parseInt(groupId),
+          listItems: groupItems,
+          onClick: undefined,
+        });
+      }
+    });
+
+    return [...groups, ...unGroupedSpecies];
+  };
+
+  const getSpecies = async () => {
+    const species = getResponseData(await loadSpecies()) || [];
+
+    setAllSpecies(species);
+    if (species.length > 0) {
+      setIsLoading(false);
+    }
+  };
+
+  // Set the source options when the species are loaded
+  useEffect(() => {
+    let shouldContaineHomebrewCategory = false;
+    let sourceShouldReset = true;
+
+    const sourcesData: Array<SimpleSourcedDefinitionContract> = allSpecies
+      .map((species) => {
+        //Flag homebrew category
+        if (species.isHomebrew) {
+          if (!shouldContaineHomebrewCategory) {
+            shouldContaineHomebrewCategory = true;
+          }
+
+          //don't reset source state if we have a homebrew category and the current source is homebrew
+          if (shouldContaineHomebrewCategory && source === "HOMEBREW") {
+            sourceShouldReset = false;
+          }
+          return null;
+        }
+
+        const primarySourceId =
+          getSources(species).filter(isPrimarySource)[0]?.sourceId;
+
+        //If there is no primary source and the above filter hasn't already returned null for isHombrew, return null
+        if (!primarySourceId) {
+          return null;
+        }
+
+        //don't reset source state if the current source is the sourceId of a species
+        if (primarySourceId.toString() === source) {
+          sourceShouldReset = false;
+        }
+
+        return {
+          sources: getSources(species),
+          name: getSourceDescription(primarySourceId) || "Unknown",
+          id: primarySourceId,
+        };
+      })
+      .filter(TypeScriptUtils.isNotNullOrUndefined);
+
+    const uniqueSources = uniqBy(sourcesData, "id");
+    const groupedOptions = getGroupedOptionsBySourceCategory(uniqueSources);
+
+    const homebrewOptions: HtmlSelectOption[] = [
+      {
+        label: "Homebrew",
+        value: "HOMEBREW",
+      },
+      {
+        label: "---------",
+        disabled: true,
+        value: "-----",
+      },
+    ];
+    const sourceOptions: (HtmlSelectOptionGroup | HtmlSelectOption)[] = [];
+    if (shouldContaineHomebrewCategory) {
+      sourceOptions.push(...homebrewOptions);
+    }
+
+    sourceOptions.push(...groupedOptions);
+
+    setSourceOptions(sourceOptions);
+
+    //reset source state if the source isn't valid for the list of current species so that the list is updated
+    if (sourceShouldReset) {
+      setSource("");
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [allSpecies, source]);
+
+  useEffect(() => {
+    getSpecies();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [loadSpecies]);
+
+  return (
+    <SpeciesContext.Provider
+      value={{
+        closeModal,
+        defaultSpeciesImageUrl,
+        isLegacyShowing,
+        isModalShowing,
+        query,
+        selectedSpecies,
+        setQuery,
+        sourceOptions,
+        filteredSpecies,
+        allSpecies,
+        toggleLegacyContent,
+        transformSpecies,
+        source,
+        setSource,
+        isLoading,
+        getSpeciesInGroups,
+      }}
+    >
+      {children}
+    </SpeciesContext.Provider>
+  );
+};
+
+export const useSpeciesContext = () => {
+  return useContext(SpeciesContext);
+};
diff --git a/ddb_main/subApps/builder/helpers/getMissingRequirements.ts b/ddb_main/subApps/builder/helpers/getMissingRequirements.ts
new file mode 100644
index 0000000..c1c1e31
--- /dev/null
+++ b/ddb_main/subApps/builder/helpers/getMissingRequirements.ts
@@ -0,0 +1,16 @@
+import { PrerequisiteFailure } from "../types";
+
+// Format a group of PrerequisiteFailures into a human-readable string
+const formatReq = (group: Array<PrerequisiteFailure>) =>
+  group.map(({ data }) => {
+    const key = data.statKey?.toUpperCase() || "";
+    const value = data.requiredValue;
+    const amount = data.currentAmount === null ? "None" : data.currentAmount;
+
+    return `${key} ${value} (${amount})`;
+  });
+
+// Loop through groups of PrerequisiteFailures and format them into a human-readable string
+export const getMissingRequirements = (
+  groups: Array<Array<PrerequisiteFailure>>
+) => groups.map((group) => formatReq(group).join(", ")).join(" or ");
diff --git a/ddb_main/subApps/builder/hooks/useEquipmentMethods.tsx b/ddb_main/subApps/builder/hooks/useEquipmentMethods.tsx
new file mode 100644
index 0000000..1d2e45a
--- /dev/null
+++ b/ddb_main/subApps/builder/hooks/useEquipmentMethods.tsx
@@ -0,0 +1,148 @@
+import { useDispatch } from "react-redux";
+
+import { ContainerTypeEnum } from "~/constants";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useUnpropagatedClick } from "~/hooks/useUnpropagatedClick";
+import { useInventoryManager } from "~/tools/js/Shared/managers/InventoryManagerContext";
+import { Item } from "~/types";
+
+import { useModalManager } from "../contexts/ModalManager";
+
+export const useEquipmentMethods = () => {
+  const dispatch = useDispatch();
+  const {
+    containerLookup,
+    containerUtils,
+    definitionUtils,
+    helperUtils,
+    itemUtils,
+    infusionUtils,
+    serviceDataActions,
+  } = useCharacterEngine();
+  const { inventoryManager } = useInventoryManager();
+  const { createModal } = useModalManager();
+
+  const launchContainerRemovalModal = (item: Item) =>
+    createModal({
+      content: (
+        <div className="equipment-manage__warning">
+          <p>
+            Removing the <strong>{itemUtils.getName(item)}</strong> will also
+            remove all of its contents.
+          </p>
+        </div>
+      ),
+      props: {
+        heading: `Remove ${itemUtils.getName(item)}`,
+        onConfirm: () => {
+          inventoryManager.handleRemove({ item });
+        },
+        onClose: () => {}, //Do nothing
+        variant: "remove",
+        size: "fit-content",
+        confirmButtonText: "Remove",
+      },
+    });
+
+  const onRemove = (item) => {
+    const isContainer = itemUtils.isContainer(item);
+    if (isContainer) {
+      launchContainerRemovalModal(item);
+    } else {
+      inventoryManager.handleRemove({ item });
+    }
+  };
+
+  const onRemoveInfusion = (item) => {
+    const infusion = itemUtils.getInfusion(item);
+    if (infusion) {
+      const infusionId = infusionUtils.getId(infusion);
+      if (infusionId === null) {
+        return;
+      }
+
+      if (itemUtils.isContainer(item)) {
+        const container = helperUtils.lookupDataOrFallback(
+          containerLookup,
+          definitionUtils.hack__generateDefinitionKey(
+            ContainerTypeEnum.ITEM,
+            itemUtils.getMappingId(item)
+          )
+        );
+        if (container) {
+          if (containerUtils.hasInfusions(container)) {
+            // Pop up the infusion modal
+            createModal({
+              content: (
+                <div className="equipment-manage__warning">
+                  <p>
+                    <strong>Notice:</strong> In accordance with Artificer
+                    guidance the Waste Management Guild of Sharn (the City of
+                    Towers) requires the removal of all Infusions prior to
+                    disposal of any items.
+                  </p>
+                </div>
+              ),
+              props: {
+                heading: `Remove ${itemUtils.getName(item)}: Infusions?`,
+                onConfirm: () => {
+                  dispatch(
+                    serviceDataActions.infusionMappingsDestroy(
+                      containerUtils.getInfusedItemMappingIds(container)
+                    )
+                  );
+                  launchContainerRemovalModal(item);
+                },
+                onClose: () => {}, //Do nothing
+                variant: "remove",
+                size: "fit-content",
+                confirmButtonText: "Remove",
+              },
+            });
+          } else {
+            // pop up the container modal
+            launchContainerRemovalModal(item);
+          }
+        }
+      } else {
+        dispatch(
+          serviceDataActions.infusionMappingDestroy(
+            infusionId,
+            infusionUtils.getInventoryMappingId(infusion)
+          )
+        );
+      }
+    }
+  };
+
+  const onUnequip = (item) => inventoryManager.handleUnequip({ item });
+
+  const onEquip = (item) => inventoryManager.handleEquip({ item });
+
+  const onAttune = (item) => inventoryManager.handleAttune({ item });
+
+  const onUnattune = (item) => inventoryManager.handleUnattune({ item });
+
+  const onQuantitySet = (item, quantity) =>
+    inventoryManager.handleQuantitySet({ item, quantity });
+
+  const onToggleEquip = useUnpropagatedClick((e, item: Item) => {
+    const isEquipped = itemUtils.isEquipped(item);
+    if (isEquipped) {
+      if (onUnequip) onUnequip(item);
+    } else {
+      if (onEquip) onEquip(item);
+    }
+  });
+
+  return {
+    onAttune,
+    onEquip,
+    onQuantitySet,
+    onRemove,
+    onRemoveInfusion,
+    onToggleEquip,
+    onUnattune,
+    onUnequip,
+  };
+};
diff --git a/ddb_main/subApps/builder/routes/BuilderTypeChoicePage/BuilderTypeChoicePage.tsx b/ddb_main/subApps/builder/routes/BuilderTypeChoicePage/BuilderTypeChoicePage.tsx
new file mode 100644
index 0000000..908f057
--- /dev/null
+++ b/ddb_main/subApps/builder/routes/BuilderTypeChoicePage/BuilderTypeChoicePage.tsx
@@ -0,0 +1,169 @@
+import clsx from "clsx";
+import { HTMLAttributes, ReactNode, useEffect, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import { useNavigate, Link } from "react-router-dom";
+
+import {
+  characterEnvSelectors,
+  Constants,
+} from "@dndbeyond/character-rules-engine";
+import ChevronRight from "@dndbeyond/fontawesome-cache/svgs/solid/chevron-right.svg";
+
+import { Button } from "~/components/Button";
+import { Checkbox } from "~/components/Checkbox";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { builderActions } from "~/tools/js/CharacterBuilder/actions";
+import { navigationConfig } from "~/tools/js/CharacterBuilder/config";
+import { NavigationUtils } from "~/tools/js/CharacterBuilder/utils";
+
+import { BuilderMethod, RouteKey } from "../../constants";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  isEnabled?: boolean;
+}
+
+export const BuilderTypeChoicePage: React.FC<Props> = ({
+  isEnabled = true,
+  className,
+  ...props
+}) => {
+  const params = new URLSearchParams(globalThis.location.search);
+  const isMobileApp = params.get("platform");
+  const [showHelpText, setShowHelpText] = useState(false);
+  const dispatch = useDispatch();
+  const navigate = useNavigate();
+  const { characterId } = useCharacterEngine();
+  const characterIsLoading = useSelector(
+    characterEnvSelectors.getLoadingStatus
+  );
+
+  useEffect(() => {
+    if (characterIsLoading === Constants.CharacterLoadingStatusEnum.LOADED) {
+      navigate(NavigationUtils.getCharacterBuilderUrl(characterId), {
+        replace: true,
+      });
+    }
+  }, [characterIsLoading, characterId, navigate]);
+
+  const handleMethodSet = (method: string) => {
+    if (method === BuilderMethod.STEP_BY_STEP) {
+      dispatch(builderActions.stepBuildRequest(showHelpText));
+    } else {
+      dispatch(builderActions.builderMethodSet(method));
+    }
+  };
+
+  const onKeyUp = (
+    evt: React.KeyboardEvent<HTMLDivElement>,
+    method: string
+  ): void => {
+    if (evt.key === "Enter") {
+      handleMethodSet(method);
+    }
+  };
+
+  const renderFooter = (text: string = "Start Building") => (
+    <div className={clsx([styles.cardFooter, styles.font])}>
+      <p>{text}</p>
+      <ChevronRight className={styles.icon} />
+    </div>
+  );
+
+  const renderCardContent = (
+    title: string,
+    description: string,
+    extraNode?: ReactNode
+  ) => (
+    <div className={styles.cardContent}>
+      <h3 className={clsx([styles.cardTitle, styles.font])}>{title}</h3>
+      <p className={clsx([styles.cardDescription, styles.font])}>
+        {description}
+      </p>
+      {extraNode}
+    </div>
+  );
+
+  return (
+    <div className={clsx([styles.page, className])} {...props}>
+      <h1 className={styles.header}>Character Creation Method</h1>
+      <h2 className={clsx([styles.header])}>
+        Choose how you would like to create your character
+      </h2>
+      <section className={styles.grid}>
+        {/* STANDARD BUILD */}
+        <div
+          onClick={() => handleMethodSet(BuilderMethod.STEP_BY_STEP)}
+          onKeyUp={(event) => onKeyUp(event, BuilderMethod.STEP_BY_STEP)}
+          className={styles.card}
+          role="button"
+          tabIndex={0}
+        >
+          <div className={clsx([styles.img, styles.standardBuild])} />
+          {renderCardContent(
+            "Standard",
+            "Create a character using a step-by-step approach",
+            <div
+              onClick={(e) => {
+                e.stopPropagation();
+                if (isEnabled) setShowHelpText(!showHelpText);
+              }}
+              className={styles.helpCheckbox}
+            >
+              <Checkbox
+                id="q-include-help"
+                aria-labelledby="include-help-text"
+                checked={showHelpText}
+                disabled={!isEnabled}
+                darkMode
+              />
+              <label
+                id="include-help-text"
+                htmlFor="q-include-help"
+                className={styles.helpText}
+              >
+                <strong>Beginner?</strong> Show help text
+              </label>
+            </div>
+          )}
+          {renderFooter()}
+        </div>
+        {/* PREMADES */}
+        {!isMobileApp && (
+          <Button href="/characters/premade" className={styles.card}>
+            <div className={clsx([styles.img, styles.premades])} />
+            {renderCardContent(
+              "Premade",
+              "Browse a selection of ready-to-play, premade characters and claim one to your account."
+            )}
+            {renderFooter("Start Browsing")}
+          </Button>
+        )}
+        {/* QUICK BUILD */}
+        <Link
+          className={styles.card}
+          to={navigationConfig.getRouteDefPath(RouteKey.QUICK_BUILD)}
+          onClick={() => handleMethodSet(BuilderMethod.QUICK)}
+        >
+          {renderCardContent(
+            "Quick Build",
+            "Choose a species and class to quickly create a level 1 character."
+          )}
+          {renderFooter()}
+        </Link>
+        {/* RANDOM BUILD */}
+        <Link
+          className={styles.card}
+          to={navigationConfig.getRouteDefPath(RouteKey.RANDOMIZE_BUILD)}
+          onClick={() => handleMethodSet(BuilderMethod.RANDOMIZE)}
+        >
+          {renderCardContent(
+            "Random",
+            "Roll up a randomized character! You can optionally set some parameters such as level, species, and class."
+          )}
+          {renderFooter()}
+        </Link>
+      </section>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/routes/Class/ClassHeader/ClassHeader.tsx b/ddb_main/subApps/builder/routes/Class/ClassHeader/ClassHeader.tsx
new file mode 100644
index 0000000..bd5ec54
--- /dev/null
+++ b/ddb_main/subApps/builder/routes/Class/ClassHeader/ClassHeader.tsx
@@ -0,0 +1,330 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, ReactNode } from "react";
+import { useDispatch } from "react-redux";
+
+import {
+  characterActions,
+  CharacterUtils,
+  CharClass,
+  ClassUtils,
+  Constants,
+  FormatUtils,
+  HelperUtils,
+  HtmlSelectOption,
+} from "@dndbeyond/character-rules-engine";
+import CloseIcon from "@dndbeyond/fontawesome-cache/svgs/solid/x.svg";
+
+import { Button } from "~/components/Button";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useModalManager } from "~/subApps/builder/contexts/ModalManager";
+import { Select } from "~/tools/js/smartComponents/legacy";
+
+import styles from "./styles.module.css";
+
+export interface ClassHeaderProps extends HTMLAttributes<HTMLDivElement> {
+  charClass: CharClass;
+  isMulticlass: boolean;
+  levelsRemaining: number;
+}
+
+export const ClassHeader: FC<ClassHeaderProps> = ({
+  charClass,
+  isMulticlass,
+  levelsRemaining,
+  className,
+  ...props
+}) => {
+  const dispatch = useDispatch();
+  const { preferences, ruleData, classes, currentLevel, totalClassLevel } =
+    useCharacterEngine();
+  const { createModal } = useModalManager();
+
+  const portraitAvatarUrl = ClassUtils.getPortraitUrl(charClass);
+  const isStartingClass = ClassUtils.isStartingClass(charClass);
+  const level = ClassUtils.getLevel(charClass);
+  const name = ClassUtils.getName(charClass);
+  const subclassDefinition = ClassUtils.getSubclass(charClass);
+  const classId = ClassUtils.getActiveId(charClass);
+
+  const levelsDiff: number = currentLevel - totalClassLevel;
+  const isTypeMilestone: boolean =
+    preferences.progressionType ===
+    Constants.PreferenceProgressionTypeEnum.MILESTONE;
+  const isTypeXp: boolean =
+    preferences.progressionType === Constants.PreferenceProgressionTypeEnum.XP;
+  const hasLevelXpDiff: boolean = levelsDiff !== 0 && isTypeXp;
+
+  let levelOptions: Array<HtmlSelectOption> = [];
+  for (let i = 1; i <= level + levelsRemaining; i++) {
+    levelOptions.push({
+      label: "" + i,
+      value: i,
+    });
+  }
+
+  const handleLevelChangePromise = (
+    newLevel: string,
+    oldLevel: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const newLevelValue = HelperUtils.parseInputInt(newLevel, 0);
+    const oldLevelValue = HelperUtils.parseInputInt(oldLevel, 0);
+
+    const newTotalClassLevel: number = classes.reduce(
+      (acc: number, oldClass) =>
+        (acc += oldClass.id === charClass.id ? newLevelValue : oldClass.level),
+      0
+    );
+    const isLevelUp: boolean = newLevelValue > oldLevelValue;
+    const isLevelDown: boolean = newLevelValue < oldLevelValue;
+
+    // Modals to handle milestone
+    if (isLevelUp && isTypeMilestone) {
+      dispatch(characterActions.classLevelSetRequest(classId, newLevelValue));
+      accept();
+    }
+
+    if (isLevelDown && isTypeMilestone) {
+      createModal({
+        content: (
+          <div>
+            {renderModalIntro(currentLevel, newTotalClassLevel)}
+            <p>Are you sure you want to level down in the {name} class?</p>
+            <p>
+              Your hit points will be reduced by the fixed amount and class
+              feature choices you have made for the higher levels will be lost.
+            </p>
+          </div>
+        ),
+        props: {
+          heading: "Level Down",
+          color: "secondary",
+          confirmButtonText: "Level Down",
+          size: "fit-content",
+          onConfirm: () => {
+            dispatch(
+              characterActions.classLevelSetRequest(classId, newLevelValue)
+            );
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    }
+
+    // Modals to handle progression
+    if (isLevelUp && isTypeXp) {
+      if (newTotalClassLevel <= currentLevel) {
+        dispatch(characterActions.classLevelSetRequest(classId, newLevelValue));
+        accept();
+      } else {
+        createModal({
+          content: (
+            <div>
+              {renderModalIntro(currentLevel, newTotalClassLevel)}
+              <p>Are you sure you want to level up in the {name} class?</p>
+              <p>
+                Your XP total will be increased to{" "}
+                {FormatUtils.renderLocaleNumber(
+                  CharacterUtils.deriveCurrentLevelXp(
+                    newTotalClassLevel,
+                    ruleData
+                  )
+                )}{" "}
+                to match your new level.
+              </p>
+            </div>
+          ),
+          props: {
+            heading: "Level Up",
+            confirmButtonText: "Level Up",
+            size: "fit-content",
+            onConfirm: () => {
+              dispatch(
+                characterActions.classLevelSetRequest(
+                  classId,
+                  newLevelValue,
+                  CharacterUtils.deriveCurrentLevelXp(
+                    newTotalClassLevel,
+                    ruleData
+                  )
+                )
+              );
+              accept();
+            },
+            onClose: () => {
+              reject();
+            },
+          },
+        });
+      }
+    }
+
+    if (isLevelDown && isTypeXp) {
+      createModal({
+        content: (
+          <div>
+            {renderModalIntro(currentLevel, newTotalClassLevel)}
+            <p>Are you sure you want to level down in the {name} class?</p>
+            <p>
+              Your hit points will be reduced by the fixed amount and class
+              feature choices you have made for the higher levels will be lost.
+            </p>
+            <p>
+              Your XP total will be decreased to{" "}
+              {FormatUtils.renderLocaleNumber(
+                CharacterUtils.deriveCurrentLevelXp(
+                  newTotalClassLevel,
+                  ruleData
+                )
+              )}{" "}
+              to match your new level.
+            </p>
+          </div>
+        ),
+        props: {
+          heading: "Level Down",
+          confirmButtonText: "Level Down",
+          color: "secondary",
+          size: "fit-content",
+          onConfirm: () => {
+            dispatch(
+              characterActions.classLevelSetRequest(
+                classId,
+                newLevelValue,
+                CharacterUtils.deriveCurrentLevelXp(
+                  newTotalClassLevel,
+                  ruleData
+                )
+              )
+            );
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    }
+  };
+
+  const handleRemoveClass = (): void => {
+    const newTotalClassLevel: number = classes.reduce(
+      (acc: number, oldClass) =>
+        (acc += oldClass.id === charClass.id ? 0 : oldClass.level),
+      0
+    );
+
+    createModal({
+      content: (
+        <div>
+          {renderModalIntro()}
+          <p>
+            Are you sure you want to remove all your levels in the {name} class?
+          </p>
+          <p>
+            Your hit points will be reduced by the fixed amount and class
+            feature choices you have made for the higher levels will be lost.
+          </p>
+          {isTypeXp && (
+            <p>Your XP total will be decreased to match your new level.</p>
+          )}
+        </div>
+      ),
+      props: {
+        heading: "Remove Class",
+        variant: "remove",
+        size: "fit-content",
+        confirmButtonText: "Remove",
+        onConfirm: () => {
+          let newCharacterXp: number | null = isTypeXp
+            ? CharacterUtils.deriveCurrentLevelXp(newTotalClassLevel, ruleData)
+            : null;
+          dispatch(
+            characterActions.classRemoveRequest(charClass.id, newCharacterXp)
+          );
+        },
+        onClose: () => {}, //Do nothing
+      },
+    });
+  };
+
+  const renderModalIntro = (
+    currentLevel: number | null = null,
+    newLevel: number | null = null
+  ): React.ReactNode => {
+    return (
+      <div className={styles.modalIntro}>
+        {classPortraitName}
+        {currentLevel !== null && newLevel !== null && (
+          <div className={styles.modalLevels}>
+            <div className={styles.modalLevel}>
+              Current Level: {currentLevel}
+            </div>
+            <div className={styles.modalLevel}>New Level: {newLevel}</div>
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  const classPortraitName: ReactNode = (
+    <>
+      <img
+        className={styles.classImg}
+        src={portraitAvatarUrl}
+        alt={`${name} Class avatar`}
+      />
+      <div className={styles.nameGroup}>
+        {subclassDefinition && (
+          <div className={styles.subclassName}>{subclassDefinition.name}</div>
+        )}
+        <div className={styles.name} data-testid="class-name">
+          {name}
+        </div>
+      </div>
+    </>
+  );
+
+  return (
+    <div
+      className={clsx([styles.classHeader, styles.container, className])}
+      {...props}
+    >
+      {isMulticlass && isStartingClass && (
+        <div className={styles.startingClass}>Starting Class</div>
+      )}
+      {classPortraitName}
+      <div className={styles.container}>
+        <div className={styles.levelManager}>
+          <label
+            className={styles.levelLabel}
+            htmlFor={`class-level-${classId}`}
+          >
+            {hasLevelXpDiff && <span className={styles.todoIcon}>!</span>}
+            Level
+          </label>
+          <Select
+            id={`class-level-${classId}`}
+            value={level}
+            options={levelOptions}
+            initialOptionRemoved={true}
+            onChangePromise={handleLevelChangePromise}
+          />
+        </div>
+        <Button
+          className={styles.removeClassButton}
+          size="x-small"
+          variant="text"
+          onClick={handleRemoveClass}
+          forceThemeMode="light"
+        >
+          <CloseIcon className={styles.icon} />
+        </Button>
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/routes/ClassChoose/ClassChoose.tsx b/ddb_main/subApps/builder/routes/ClassChoose/ClassChoose.tsx
new file mode 100644
index 0000000..9b3d9ab
--- /dev/null
+++ b/ddb_main/subApps/builder/routes/ClassChoose/ClassChoose.tsx
@@ -0,0 +1,410 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
+
+import { Accordion } from "~/components/Accordion";
+import { HtmlContent } from "~/components/HtmlContent";
+import { Link } from "~/components/Link";
+import { PreferenceProgressionTypeEnum as progressionType } from "~/constants";
+import { orderBy } from "~/helpers/sortUtils";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useSource } from "~/hooks/useSource";
+import { navigationConfig } from "~/tools/js/CharacterBuilder/config";
+
+import { Button } from "../../../../components/Button";
+import { ConfirmClassModal } from "../../components/ConfirmClassModal";
+import { Listing } from "../../components/Listing";
+import { PortraitName } from "../../components/PortraitName";
+import { Search } from "../../components/Search";
+import { Spinner } from "../../components/Spinner";
+import { RouteKey } from "../../constants";
+import { useClassContext } from "../../contexts/Class";
+import { getMissingRequirements } from "../../helpers/getMissingRequirements";
+import {
+  ClassDefinitionContract,
+  ClassItems,
+  ClassRequirements,
+  ListingItem,
+  MulticlassAvailability,
+} from "../../types";
+import styles from "./styles.module.css";
+
+//showHeader and OnQuickSelect are only be used from QuickBuild.tsx and RandomBuild.tsx
+export interface ClassChooseProps extends HTMLAttributes<HTMLDivElement> {
+  showHeader?: boolean;
+  onQuickSelect?: (charClass: ClassDefinitionContract) => void;
+}
+
+export interface SourceGroupMapping {
+  name: string;
+  id: number;
+  items: ClassDefinitionContract[];
+  sortOrder: number | undefined;
+  isOpen: boolean;
+}
+
+/**
+ * The page which lists all available classes for the user to choose
+ * from when building or updating a character. Can be found at
+ * `/characters/:characterId/builder/class/choose`.
+ */
+export const ClassChoose: FC<ClassChooseProps> = ({
+  showHeader = true,
+  className,
+  onQuickSelect,
+  ...props
+}) => {
+  const navigate = useNavigate();
+  const {
+    classes: charClasses,
+    preferences,
+    prerequisiteData,
+    startingClass,
+    totalClassLevel,
+    currentLevel,
+    characterId,
+    classUtils,
+    helperUtils,
+    prerequisiteUtils: {
+      validatePrerequisiteGrouping: validateGrouping,
+      getPrerequisiteGroupingFailures: getGroupingFailures,
+    },
+  } = useCharacterEngine();
+  const { allSources, getSourceCategoryDescription, getSourceCategoryGroups } =
+    useSource();
+  const {
+    filteredClasses,
+    allClasses,
+    handleSelectClass,
+    query,
+    setQuery,
+    isLoading,
+    isModalShowing,
+    closeModal,
+  } = useClassContext();
+
+  const [mappedSourceCategoryGroups, setMappedSourceCategoryGroups] = useState<
+    SourceGroupMapping[]
+  >([]);
+
+  useEffect(() => {
+    const sourceCategoryGroups = getSourceCategoryGroups(filteredClasses);
+    setMappedSourceCategoryGroups(
+      sourceCategoryGroups.map((group) => ({
+        ...group,
+        isOpen: true,
+      }))
+    );
+  }, [filteredClasses]);
+
+  // Determine if the character's XP will be adjusted when adding a new class
+  const willXpBeAdjusted =
+    charClasses.length > 0 &&
+    preferences.progressionType === progressionType.XP &&
+    totalClassLevel + 1 > currentLevel;
+
+  // Navigate back to the class manage page
+  const handleNavigate = (): void =>
+    navigate(
+      navigationConfig
+        .getRouteDefPath(RouteKey.CLASS_MANAGE)
+        .replace(":characterId", characterId)
+    );
+
+  // Return requirements for multiclassing based on existing classes
+  const getMulticlassAvailability = (
+    classes: ClassItems
+  ): Array<MulticlassAvailability> => {
+    const { enforceMulticlassRules } = preferences;
+    let canStartingClassMulticlass = false;
+    let startingClassRequirements: ClassRequirements = [];
+
+    if (enforceMulticlassRules) {
+      if (startingClass) {
+        canStartingClassMulticlass = validateGrouping(
+          classUtils.getPrerequisites(startingClass),
+          prerequisiteData
+        );
+        startingClassRequirements = getGroupingFailures(
+          classUtils.getPrerequisites(startingClass),
+          prerequisiteData
+        );
+      }
+    } else {
+      canStartingClassMulticlass = true;
+    }
+
+    return classes.map(
+      ({ id: classId, prerequisites }): MulticlassAvailability => {
+        let canMulticlass = false;
+        const missingRequirements = getGroupingFailures(
+          prerequisites,
+          prerequisiteData
+        );
+
+        if (enforceMulticlassRules) {
+          canMulticlass =
+            canStartingClassMulticlass &&
+            validateGrouping(prerequisites, prerequisiteData);
+        } else {
+          canMulticlass = true;
+        }
+
+        return {
+          classId,
+          canStartingClassMulticlass,
+          startingClassRequirements,
+          canMulticlass,
+          missingRequirements,
+        };
+      }
+    );
+  };
+
+  const getDisabledIds = (classes: ClassItems): Array<number> => {
+    if (startingClass === null || !classes.length) {
+      return [];
+    }
+
+    // const classDefinitions = classes.map((item) => item.entity);
+    const multiclassAvailability = getMulticlassAvailability(classes);
+
+    // disable any current classes
+    let currentClassIds = charClasses.map((charClass) =>
+      classUtils.getId(charClass)
+    );
+
+    // disable any multiclass options that don't meet required prerequisites
+    let canMulticlassIds = multiclassAvailability
+      .filter((classInfo) => !classInfo.canMulticlass)
+      .map((classInfo) => classInfo.classId);
+
+    return [...currentClassIds, ...canMulticlassIds];
+  };
+
+  // Transform the class items into a format that listing can use
+  const transformClassItems = (data: ClassItems): Array<ListingItem> => {
+    let classDefinitions = [...data];
+
+    // Get the multiclass availability for each class
+    const availability = getMulticlassAvailability(classDefinitions);
+
+    return classDefinitions.map((classItem: ClassDefinitionContract) => {
+      const { id, sources, name, portraitAvatarUrl } = classItem;
+      // Find the class in the character's classes
+      const existingClass = charClasses.find(
+        (cls) => classUtils.getId(cls) === id
+      );
+
+      // Find the multiclass info for the class
+      const multiclassInfo = availability.find((cls) => cls.classId === id);
+      let metaItems: Array<{ type: string; text: string }> = [];
+
+      // Add the source descriptions to the meta items
+      if (sources)
+        sources.forEach(({ sourceId }) => {
+          let source = helperUtils.lookupDataOrFallback(allSources, sourceId);
+
+          // If a source has a description and is toggleable, add it to the meta items
+          if (
+            source?.description !== null &&
+            source?.sourceCategory?.isToggleable
+          )
+            metaItems.push({
+              type: "normal",
+              text: source.description,
+            });
+        });
+
+      // If the character is already multiclassed
+      if (charClasses && charClasses.length >= 1) {
+        if (existingClass) {
+          const { level, isStartingClass } = existingClass;
+          const currentLevel = `Level ${level}`;
+          const startingClass = isStartingClass ? " • Starting Class" : "";
+
+          // Add the class level to the meta items
+          metaItems.push({
+            type: "normal",
+            text: `${currentLevel}${startingClass}`,
+          });
+        }
+        // If the class is the starting class
+        else if (multiclassInfo) {
+          const {
+            canMulticlass,
+            canStartingClassMulticlass,
+            missingRequirements,
+            startingClassRequirements,
+          } = multiclassInfo;
+          // Add an error message to the meta items
+          if (!canMulticlass || !canStartingClassMulticlass)
+            metaItems.push({
+              type: "error",
+              text: !canStartingClassMulticlass
+                ? `Starting class does not meet multiclass prerequisites: ${getMissingRequirements(
+                    startingClassRequirements
+                  )}`
+                : !canMulticlass
+                ? `Prerequisites not met: ${getMissingRequirements(
+                    missingRequirements
+                  )}`
+                : "",
+            });
+        }
+      }
+
+      return {
+        id,
+        metaItems,
+        entityTypeId: -1,
+        heading: name || "",
+        image: portraitAvatarUrl || null,
+        onClick: handleSelectClass,
+        entity: classItem,
+        type: "class",
+      };
+    });
+  };
+
+  const handleOverrideClick = (override): void => {
+    const updatedGroups = mappedSourceCategoryGroups.map((group) => ({
+      ...group,
+      isOpen: override,
+    }));
+
+    setMappedSourceCategoryGroups(updatedGroups);
+  };
+
+  const handleSourceCategoryClick = (id: string, state: boolean): void => {
+    const parsedId = parseInt(id);
+    const updatedGroups = mappedSourceCategoryGroups.map((group) => ({
+      ...group,
+      isOpen: group.id === parsedId ? state : group.isOpen,
+    }));
+
+    setMappedSourceCategoryGroups(updatedGroups);
+  };
+
+  return (
+    <div className={clsx([styles.page, className])} {...props}>
+      {showHeader && (
+        <>
+          <PortraitName />
+          <hr className={styles.divider} />
+          <h2 className={styles.title}>
+            Choose a Class{startingClass && " to Multiclass"}
+          </h2>
+          {startingClass && (
+            <>
+              <p className={styles.text}>
+                Learn more about multiclassing{" "}
+                <Link
+                  href="/sources/dnd/free-rules/creating-a-character#Multiclassing"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  here
+                </Link>
+                .
+              </p>
+              <p className={styles.multiclassMessage}>
+                Classes from the 2024 and 2014 rulebooks are not designed to be
+                multiclassed together.
+              </p>
+            </>
+          )}
+          {charClasses.length > 0 && (
+            <div className={styles.buttons}>
+              {willXpBeAdjusted && (
+                <p className={styles.error}>
+                  Your XP total will be adjusted when you add your new class.
+                </p>
+              )}
+              <Button
+                className={styles.navigateButton}
+                variant="builder"
+                onClick={handleNavigate}
+              >
+                Cancel Class Add
+              </Button>
+            </div>
+          )}
+        </>
+      )}
+      {isLoading ? (
+        <Spinner />
+      ) : (
+        <>
+          <Search
+            className={styles.search}
+            value={query}
+            onChange={(e) => setQuery(e.target.value)}
+          />
+
+          <div className={styles.collapseExpand}>
+            <Button
+              variant="text"
+              size="x-small"
+              className={styles.collapseExpandButton}
+              onClick={() => handleOverrideClick(false)}
+              forceThemeMode="light"
+            >
+              Collapse All
+            </Button>
+            <Button
+              variant="text"
+              size="x-small"
+              className={styles.collapseExpandButton}
+              onClick={() => handleOverrideClick(true)}
+              forceThemeMode="light"
+            >
+              Expand All
+            </Button>
+          </div>
+
+          {mappedSourceCategoryGroups.length > 0 ? (
+            mappedSourceCategoryGroups.map((category) => {
+              const description = getSourceCategoryDescription(category.id);
+              const metaItems = description
+                ? [
+                    <HtmlContent
+                      html={description}
+                      className={styles.accordionText}
+                    />,
+                  ]
+                : [];
+
+              return (
+                <Accordion
+                  id={category.id.toString()}
+                  className={styles.accordion}
+                  summary={<h3 className={styles.heading}>{category.name}</h3>}
+                  summaryMetaItems={metaItems}
+                  variant="text"
+                  resetOpen={allClasses.length !== filteredClasses.length}
+                  key={category.id}
+                  handleIsOpen={handleSourceCategoryClick}
+                  override={category.isOpen}
+                  forceShow
+                >
+                  <Listing
+                    items={orderBy(
+                      transformClassItems(category.items),
+                      "heading"
+                    )}
+                    disabledIds={getDisabledIds(category.items)}
+                    onQuickSelect={onQuickSelect}
+                  />
+                </Accordion>
+              );
+            })
+          ) : (
+            <p className={styles.notFound}>No Results Found</p>
+          )}
+        </>
+      )}
+      <ConfirmClassModal open={isModalShowing} onClose={closeModal} />
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/routes/QuickBuild/QuickBuild.tsx b/ddb_main/subApps/builder/routes/QuickBuild/QuickBuild.tsx
new file mode 100644
index 0000000..e4e0e21
--- /dev/null
+++ b/ddb_main/subApps/builder/routes/QuickBuild/QuickBuild.tsx
@@ -0,0 +1,113 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useState } from "react";
+import { useDispatch } from "react-redux";
+
+import { Accordion } from "~/components/Accordion";
+import { Button } from "~/components/Button";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { builderActions } from "~/tools/js/CharacterBuilder/actions";
+import ClassDisplaySimple from "~/tools/js/CharacterBuilder/components/ClassDisplaySimple";
+import SpeciesDisplaySimple from "~/tools/js/CharacterBuilder/components/SpeciesDisplaySimple";
+import { ClassDefinitionContract, RaceDefinitionContract } from "~/types";
+
+import { PortraitName } from "../../components/PortraitName";
+import { ClassChoose } from "../ClassChoose";
+import { SpeciesChoose } from "../SpeciesChoose";
+import styles from "./styles.module.css";
+
+export interface QuickBuildProps extends HTMLAttributes<HTMLDivElement> {}
+
+export const QuickBuild: FC<QuickBuildProps> = ({ className, ...props }) => {
+  const dispatch = useDispatch();
+  const { raceUtils, ruleData } = useCharacterEngine();
+
+  const [species, setSpecies] = useState<RaceDefinitionContract | null>(null);
+  const [charClass, setCharClass] = useState<ClassDefinitionContract | null>(
+    null
+  );
+  const [name, setName] = useState("");
+  const [isClassesOpen, setIsClassesOpen] = useState(false);
+  const [isSpeciesOpen, setIsSpeciesOpen] = useState(false);
+
+  const handleSubmit = (): void => {
+    dispatch(
+      builderActions.quickBuildRequest(
+        species ? raceUtils.getEntityRaceId(species) : null,
+        species ? raceUtils.getEntityRaceTypeId(species) : null,
+        charClass ? charClass.id : null,
+        name
+      )
+    );
+  };
+
+  const handleSelectSpecies = (species: RaceDefinitionContract): void => {
+    setSpecies(species);
+  };
+  const handleRemoveSpecies = (): void => {
+    setSpecies(null);
+    setIsSpeciesOpen(true);
+  };
+  const handleSelectClass = (charClass: ClassDefinitionContract): void => {
+    setCharClass(charClass);
+  };
+  const handleRemoveClass = (): void => {
+    setCharClass(null);
+    setIsClassesOpen(true);
+  };
+
+  return (
+    <div className={clsx([styles.page, className])} {...props}>
+      <h1 className={styles.title}>Quick Build</h1>
+      <p>
+        To create a level 1 character with recommended starting options, choose
+        a class and species below. You can provide a character name or leave it
+        blank to randomize one.
+      </p>
+      <hr className={styles.divider} />
+      {charClass ? (
+        <ClassDisplaySimple
+          onRequestChange={handleRemoveClass}
+          charClass={charClass}
+        />
+      ) : (
+        <Accordion
+          className={styles.accordion}
+          summary={<h3 className={styles.accordionHeading}>Choose Class</h3>}
+          variant="text"
+          resetOpen={isClassesOpen}
+        >
+          <ClassChoose showHeader={false} onQuickSelect={handleSelectClass} />
+        </Accordion>
+      )}
+      {species ? (
+        <SpeciesDisplaySimple
+          onRequestAction={handleRemoveSpecies}
+          headingText="Selected Species"
+          species={species}
+          ruleData={ruleData}
+        />
+      ) : (
+        <Accordion
+          className={styles.accordion}
+          summary={<h3 className={styles.accordionHeading}>Choose Species</h3>}
+          variant="text"
+          resetOpen={isSpeciesOpen}
+        >
+          <SpeciesChoose
+            showHeader={false}
+            onQuickSelect={handleSelectSpecies}
+          />
+        </Accordion>
+      )}
+      <PortraitName hidePortrait fullWidth handleNameUpdate={setName} />
+      <Button
+        className={styles.submitButton}
+        onClick={handleSubmit}
+        disabled={!species || !charClass}
+        variant="builder"
+      >
+        Create Character
+      </Button>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/routes/RandomBuild/RandomBuild.tsx b/ddb_main/subApps/builder/routes/RandomBuild/RandomBuild.tsx
new file mode 100644
index 0000000..754c9c7
--- /dev/null
+++ b/ddb_main/subApps/builder/routes/RandomBuild/RandomBuild.tsx
@@ -0,0 +1,174 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useState } from "react";
+import { useDispatch } from "react-redux";
+
+import { Select } from "@dndbeyond/character-components/es";
+
+import { Accordion } from "~/components/Accordion";
+import { Button } from "~/components/Button";
+import { Toggle } from "~/components/Toggle";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { builderActions } from "~/tools/js/CharacterBuilder/actions";
+import ClassDisplaySimple from "~/tools/js/CharacterBuilder/components/ClassDisplaySimple";
+import SpeciesDisplaySimple from "~/tools/js/CharacterBuilder/components/SpeciesDisplaySimple";
+import { ClassDefinitionContract, RaceDefinitionContract } from "~/types";
+
+import { PortraitName } from "../../components/PortraitName";
+import { ClassChoose } from "../ClassChoose";
+import { SpeciesChoose } from "../SpeciesChoose";
+import styles from "./styles.module.css";
+
+export interface RandomBuildProps extends HTMLAttributes<HTMLDivElement> {}
+
+export const RandomBuild: FC<RandomBuildProps> = ({ className, ...props }) => {
+  const dispatch = useDispatch();
+  const { raceUtils, ruleData, helperUtils } = useCharacterEngine();
+
+  const [species, setSpecies] = useState<RaceDefinitionContract | null>(null);
+  const [charClass, setCharClass] = useState<ClassDefinitionContract | null>(
+    null
+  );
+  const [name, setName] = useState("");
+  const [level, setLevel] = useState<number | null>(null);
+  const [allowMulticlass, setAllowMulticlass] = useState(false);
+  const [allowFeats, setAllowFeats] = useState(false);
+  const [isClassesOpen, setIsClassesOpen] = useState(false);
+  const [isSpeciesOpen, setIsSpeciesOpen] = useState(false);
+
+  const handleSubmit = (): void => {
+    dispatch(
+      builderActions.randomBuildRequest(
+        level,
+        species ? raceUtils.getEntityRaceId(species) : null,
+        species ? raceUtils.getEntityRaceTypeId(species) : null,
+        charClass ? charClass.id : null,
+        allowMulticlass,
+        allowFeats,
+        name
+      )
+    );
+  };
+
+  const handleSelectSpecies = (species: RaceDefinitionContract): void => {
+    setSpecies(species);
+  };
+  const handleRemoveSpecies = (): void => {
+    setSpecies(null);
+    setIsSpeciesOpen(true);
+  };
+  const handleSelectClass = (charClass: ClassDefinitionContract): void => {
+    setCharClass(charClass);
+  };
+  const handleRemoveClass = (): void => {
+    setCharClass(null);
+    setIsClassesOpen(true);
+  };
+  const handleLevelChange = (level: string): void => {
+    setLevel(helperUtils.parseInputInt(level));
+  };
+  const handleToggleAllowMulticlass = (): void => {
+    setAllowMulticlass(!allowMulticlass);
+  };
+  const handleToggleAllowFeats = (): void => {
+    setAllowFeats(!allowFeats);
+  };
+
+  const levels = Array.from(
+    new Array(ruleData.maxCharacterLevel),
+    (val, index) => index + 1
+  );
+
+  return (
+    <div className={clsx([styles.page, className])} {...props}>
+      <h1 className={styles.title}>Random Build</h1>
+      <p>
+        Create a randomized character. Make it completely random, or make
+        choices in some categories and randomize the rest. Once you've made your
+        selections, click <strong>Create Character</strong> to generate a
+        character sheet and start playing!
+      </p>
+      <hr className={styles.divider} />
+      <div className={styles.levelSelect}>
+        <label className={styles.label} id="choose-level">
+          Choose Level
+        </label>
+        <Select
+          className={styles.select}
+          placeholder={"--"}
+          options={levels.map((level) => ({
+            value: level,
+            label: level,
+          }))}
+          onChange={handleLevelChange}
+          aria-labelledby="choose-level"
+          value={level}
+        />
+      </div>
+      {charClass ? (
+        <ClassDisplaySimple
+          onRequestChange={handleRemoveClass}
+          charClass={charClass}
+        />
+      ) : (
+        <Accordion
+          className={styles.accordion}
+          summary={<h3 className={styles.accordionHeading}>Choose Class</h3>}
+          variant="text"
+          resetOpen={isClassesOpen}
+        >
+          <ClassChoose showHeader={false} onQuickSelect={handleSelectClass} />
+        </Accordion>
+      )}
+      {species ? (
+        <SpeciesDisplaySimple
+          onRequestAction={handleRemoveSpecies}
+          headingText="Selected Species"
+          species={species}
+          ruleData={ruleData}
+        />
+      ) : (
+        <Accordion
+          className={styles.accordion}
+          summary={<h3 className={styles.accordionHeading}>Choose Species</h3>}
+          variant="text"
+          resetOpen={isSpeciesOpen}
+        >
+          <SpeciesChoose
+            showHeader={false}
+            onQuickSelect={handleSelectSpecies}
+          />
+        </Accordion>
+      )}
+      <div className={styles.toggle}>
+        <label className={styles.label} id="allow-multiclass-label">
+          Allow Multiclass
+        </label>
+        <Toggle
+          onClick={handleToggleAllowMulticlass}
+          checked={allowMulticlass}
+          color="secondary"
+          aria-labelledby="allow-multiclass-label"
+        />
+      </div>
+      <div className={styles.toggle}>
+        <label className={styles.label} id="allow-feats-label">
+          Allow Feats
+        </label>
+        <Toggle
+          onClick={handleToggleAllowFeats}
+          checked={allowFeats}
+          color="secondary"
+          aria-labelledby="allow-feats-label"
+        />
+      </div>
+      <PortraitName hidePortrait fullWidth handleNameUpdate={setName} />
+      <Button
+        className={styles.submitButton}
+        onClick={handleSubmit}
+        variant="builder"
+      >
+        Create Character
+      </Button>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/builder/routes/SpeciesChoose/SpeciesChoose.tsx b/ddb_main/subApps/builder/routes/SpeciesChoose/SpeciesChoose.tsx
new file mode 100644
index 0000000..e75b718
--- /dev/null
+++ b/ddb_main/subApps/builder/routes/SpeciesChoose/SpeciesChoose.tsx
@@ -0,0 +1,244 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useEffect, useState } from "react";
+
+import CircleInfo from "@dndbeyond/fontawesome-cache/svgs/regular/circle-info.svg";
+
+import { Accordion } from "~/components/Accordion";
+import { HtmlContent } from "~/components/HtmlContent";
+import { Link } from "~/components/Link";
+import { Toggle } from "~/components/Toggle";
+import { Tooltip } from "~/components/Tooltip";
+import { orderBy } from "~/helpers/sortUtils";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useSource } from "~/hooks/useSource";
+import { Select } from "~/tools/js/smartComponents/legacy";
+import { RaceDefinitionContract } from "~/types";
+
+import { Button } from "../../../../components/Button";
+import { ConfirmSpeciesModal } from "../../components/ConfirmSpeciesModal";
+import { Listing } from "../../components/Listing";
+import { PortraitName } from "../../components/PortraitName";
+import { Search } from "../../components/Search";
+import { SpeciesDisplay } from "../../components/SpeciesDisplay";
+import { Spinner } from "../../components/Spinner";
+import { useSpeciesContext } from "../../contexts/Species";
+import styles from "./styles.module.css";
+
+//showHeader and OnQuickSelect are only be used from QuickBuild.tsx and RandomBuild.tsx
+export interface SpeciesChooseProps extends HTMLAttributes<HTMLDivElement> {
+  showHeader?: boolean;
+  onQuickSelect?: (species: RaceDefinitionContract) => void;
+}
+
+export interface SourceGroupMapping {
+  name: string;
+  id: number;
+  items: RaceDefinitionContract[];
+  sortOrder: number | undefined;
+  isOpen: boolean;
+}
+
+export const SpeciesChoose: FC<SpeciesChooseProps> = ({
+  showHeader = true,
+  onQuickSelect,
+  className,
+  ...props
+}) => {
+  const { race: currentSpecies } = useCharacterEngine();
+  const {
+    allSpecies,
+    closeModal,
+    filteredSpecies,
+    isLegacyShowing,
+    isModalShowing,
+    setSource,
+    source,
+    sourceOptions,
+    toggleLegacyContent,
+    transformSpecies,
+    query,
+    setQuery,
+    isLoading,
+    getSpeciesInGroups,
+  } = useSpeciesContext();
+  const { getSourceCategoryGroups, getSourceCategoryDescription } = useSource();
+  const [mappedSourceCategoryGroups, setMappedSourceCategoryGroups] = useState<
+    SourceGroupMapping[]
+  >([]);
+
+  useEffect(() => {
+    const sourceCategoryGroups = getSourceCategoryGroups(filteredSpecies);
+    setMappedSourceCategoryGroups(
+      sourceCategoryGroups.map((group) => ({
+        ...group,
+        isOpen: true,
+      }))
+    );
+  }, [filteredSpecies]);
+
+  const handleOverrideClick = (override): void => {
+    const updatedGroups = mappedSourceCategoryGroups.map((group) => ({
+      ...group,
+      isOpen: override,
+    }));
+
+    setMappedSourceCategoryGroups(updatedGroups);
+  };
+
+  const handleSourceCategoryClick = (id: string, state: boolean): void => {
+    const parsedId = parseInt(id);
+    const updatedGroups = mappedSourceCategoryGroups.map((group) => ({
+      ...group,
+      isOpen: group.id === parsedId ? state : group.isOpen,
+    }));
+
+    setMappedSourceCategoryGroups(updatedGroups);
+  };
+
+  return (
+    <div className={clsx([styles.speciesChoose, className])} {...props}>
+      {showHeader && (
+        <>
+          <PortraitName />
+          <hr className={styles.divider} />
+          <h2 className={styles.title}>
+            {currentSpecies ? "Change Origin: " : "Choose Origin: "}
+            {"Species"}
+          </h2>
+          {currentSpecies && (
+            <>
+              <SpeciesDisplay
+                headingText="Current Species"
+                actionText="Keep Species"
+              />
+              <h3 className={styles.title}>Select New Species</h3>
+            </>
+          )}
+        </>
+      )}
+
+      <div className={styles.filters}>
+        <div>
+          <div className={styles.label}>Filter Species Source(s)</div>
+          <Select
+            placeholder={"-- All Sources --"}
+            options={sourceOptions}
+            value={source}
+            onChange={(value) => setSource(value)}
+          />
+        </div>
+
+        <div className={styles.legacy}>
+          <Toggle
+            className={styles.toggle}
+            onClick={toggleLegacyContent}
+            checked={isLegacyShowing}
+            color="secondary"
+            aria-labelledby="legacy-content-label"
+          />
+          <label id="legacy-content-label">
+            Show Legacy Content{" "}
+            <>
+              <CircleInfo
+                data-tooltip-id="legacy-info"
+                data-tooltip-place="bottom"
+                className={styles.infoIcon}
+              />
+              <Tooltip id="legacy-info" clickable>
+                Legacy content doesn't reflect the latest rules and lore.{" "}
+                <Link
+                  href="https://dndbeyond.com/legacy"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  Learn More
+                </Link>
+              </Tooltip>
+            </>
+          </label>
+        </div>
+      </div>
+      <hr className={styles.divider} />
+      <div className={clsx([styles.text, styles.marketplace])}>
+        Looking for something not in the list below? Unlock all official options
+        in the <Link href="/marketplace">Marketplace</Link>.
+      </div>
+      {isLoading ? (
+        <Spinner />
+      ) : (
+        <>
+          <Search
+            className={styles.search}
+            value={query}
+            onChange={(e) => setQuery(e.target.value)}
+          />
+          <div className={styles.collapseExpand}>
+            <Button
+              variant="text"
+              size="x-small"
+              className={styles.collapseExpandButton}
+              onClick={() => handleOverrideClick(false)}
+              forceThemeMode="light"
+            >
+              Collapse All
+            </Button>
+            <Button
+              variant="text"
+              size="x-small"
+              className={styles.collapseExpandButton}
+              onClick={() => handleOverrideClick(true)}
+              forceThemeMode="light"
+            >
+              Expand All
+            </Button>
+          </div>
+          {mappedSourceCategoryGroups.length > 0 ? (
+            mappedSourceCategoryGroups.map((category) => {
+              const name = category.name;
+              const id = category.id;
+              const description = getSourceCategoryDescription(category.id);
+
+              const currentSpeciesId = currentSpecies
+                ? [
+                    `${currentSpecies.entityRaceId}-${currentSpecies.entityRaceTypeId}`,
+                  ]
+                : [];
+
+              const groupedSpecies = getSpeciesInGroups(
+                transformSpecies(category.items)
+              );
+
+              const metaItems = description
+                ? [<HtmlContent html={description} className={styles.text} />]
+                : [];
+
+              return (
+                <Accordion
+                  id={category.id.toString()}
+                  className={styles.accordion}
+                  summary={<h3 className={styles.heading}>{name}</h3>}
+                  summaryMetaItems={metaItems}
+                  variant="text"
+                  resetOpen={allSpecies.length !== filteredSpecies.length}
+                  key={id}
+                  forceShow
+                  override={category.isOpen}
+                  handleIsOpen={handleSourceCategoryClick}
+                >
+                  <Listing
+                    items={orderBy(groupedSpecies, "heading")}
+                    disabledIds={currentSpeciesId}
+                    onQuickSelect={onQuickSelect}
+                  />
+                </Accordion>
+              );
+            })
+          ) : (
+            <p className={styles.notFound}>No Results Found</p>
+          )}
+        </>
+      )}
+      <ConfirmSpeciesModal open={isModalShowing} onClose={closeModal} />
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/ApiStatusIndicator/ApiStatusIndicator.tsx b/ddb_main/subApps/listing/components/ApiStatusIndicator/ApiStatusIndicator.tsx
new file mode 100644
index 0000000..9694a59
--- /dev/null
+++ b/ddb_main/subApps/listing/components/ApiStatusIndicator/ApiStatusIndicator.tsx
@@ -0,0 +1,42 @@
+import React from "react";
+
+import CircleExclamation from "@dndbeyond/fontawesome-cache/svgs/solid/circle-exclamation.svg";
+import SpinnerThird from "@dndbeyond/fontawesome-cache/svgs/solid/spinner-third.svg";
+
+import styles from "./styles.module.css";
+
+export interface ApiStatusIndicatorProps {
+  isLoading: boolean;
+  error?: Error;
+  loadingMessage: string;
+  errorMessage: string;
+}
+export const ApiStatusIndicator: React.FC<ApiStatusIndicatorProps> = ({
+  isLoading,
+  error,
+  loadingMessage,
+  errorMessage,
+}) => {
+  if (!isLoading && !error) {
+    return null;
+  }
+
+  return (
+    <div className={styles.indicator}>
+      {isLoading && (
+        <>
+          <SpinnerThird className={styles.spinner} />
+          <span>{loadingMessage}</span>
+        </>
+      )}
+      {error && (
+        <>
+          <CircleExclamation className={styles.error} />
+          <span>{errorMessage}</span>
+        </>
+      )}
+    </div>
+  );
+};
+
+export default ApiStatusIndicator;
diff --git a/ddb_main/subApps/listing/components/CharacterCard/ActivateButton/ActivateButton.tsx b/ddb_main/subApps/listing/components/CharacterCard/ActivateButton/ActivateButton.tsx
new file mode 100644
index 0000000..fbc73fd
--- /dev/null
+++ b/ddb_main/subApps/listing/components/CharacterCard/ActivateButton/ActivateButton.tsx
@@ -0,0 +1,50 @@
+import { useState } from "react";
+
+import { Button } from "@dndbeyond/ttui/components/Button";
+
+import { CharacterData } from "~/types";
+
+import { logUnlockCharacterUnlocked } from "../../../../../helpers/analytics";
+import { UnlockConfirmation } from "../../CharacterGrid/UnlockConfirmation";
+import { ConfirmationModal } from "../../ConfirmationModal";
+
+interface ActivateButtonProps {
+  character: CharacterData;
+  activateCharacter: (character: CharacterData) => void;
+  maxCharacterSlotsAllowed: number | null;
+}
+
+export const ActivateButton: React.FC<ActivateButtonProps> = ({
+  character,
+  activateCharacter,
+  maxCharacterSlotsAllowed,
+}) => {
+  const [isOpen, setIsOpen] = useState(false);
+
+  return (
+    <div>
+      <ConfirmationModal
+        isOpen={isOpen}
+        onClose={() => {
+          setIsOpen(false);
+        }}
+        onConfirm={() => {
+          activateCharacter(character);
+          logUnlockCharacterUnlocked();
+          setIsOpen(false);
+        }}
+        title="Activate these characters?"
+        confirmText="Activate"
+        message={
+          <UnlockConfirmation
+            charactersToUnlock={[character]}
+            maxCharacterSlotsAllowed={maxCharacterSlotsAllowed}
+          />
+        }
+      />
+      <Button size="small" variant="text" onClick={() => setIsOpen(true)}>
+        Activate
+      </Button>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/CharacterCard/CharacterCard.tsx b/ddb_main/subApps/listing/components/CharacterCard/CharacterCard.tsx
new file mode 100644
index 0000000..9159aa7
--- /dev/null
+++ b/ddb_main/subApps/listing/components/CharacterCard/CharacterCard.tsx
@@ -0,0 +1,239 @@
+import clsx from "clsx";
+import { FC } from "react";
+
+import Lock from "@dndbeyond/fontawesome-cache/svgs/regular/lock.svg";
+import Check from "@dndbeyond/fontawesome-cache/svgs/sharp-regular/check.svg";
+import { Button } from "@dndbeyond/ttui/components/Button";
+
+import useApiCall from "~/hooks/useApiCall";
+
+import {
+  logCharacterCampaignClicked,
+  logUnlockCharacterLocked,
+  logUnlockCharacterUnlocked,
+} from "../../../../helpers/analytics";
+import {
+  copyCharacter as copyCharacterApi,
+  deleteCharacter as deleteCharacterApi,
+  leaveCampaign as leaveCampaignApi,
+  activateCharacter as activateCharacterApi,
+} from "../../../../helpers/characterServiceApi";
+import {
+  getAvatarUrl,
+  getBackdropUrl,
+  getCampaignDetailsLink,
+  getCampaignName,
+  getCoverImageUrl,
+  getDetailsLink,
+  getIsAssigned,
+  getName,
+  getSecondaryInfo,
+  getStatus,
+  getStatusSlug,
+  isInCampaign,
+} from "../../../../state/selectors/characterUtils";
+import { CharacterData, CharacterStatusEnum } from "../../../../types";
+import { ApiStatusIndicator } from "../ApiStatusIndicator";
+import "./CharacterCard.scss";
+import { CharacterCardLinks } from "./CharacterCardLinks";
+import { LeaveCampaignButton } from "./LeaveCampaignButton";
+import styles from "./styles.module.css";
+
+export interface CharacterCardProps {
+  character: CharacterData;
+  reloadListing: () => void;
+  lockCharacter: (character: CharacterData) => void;
+  unlockCharacter: (character: CharacterData) => void;
+  canUnlockMore: boolean;
+  hasLockedCharacters: boolean;
+  overCharacterLimit: boolean;
+  maxCharacterSlotsAllowed: number | null;
+  currentCharacterCount: number;
+}
+
+export const CharacterCard: FC<CharacterCardProps> = ({
+  character,
+  reloadListing,
+  lockCharacter,
+  unlockCharacter,
+  canUnlockMore,
+  hasLockedCharacters,
+  overCharacterLimit,
+  maxCharacterSlotsAllowed,
+  currentCharacterCount,
+}) => {
+  const [copyCharacter, isCopyingCharacter, errorCopyingCharacter] = useApiCall(
+    copyCharacterApi,
+    reloadListing
+  );
+
+  const [deleteCharacter, isDeletingCharacter, errorDeletingCharacter] =
+    useApiCall(deleteCharacterApi, reloadListing);
+
+  const [leaveCampaign, isLeavingCampaign, errorLeavingCampaign] = useApiCall(
+    leaveCampaignApi,
+    reloadListing
+  );
+
+  const [activateCharacter, isActivatingCharacter, errorActivatingCharacter] =
+    useApiCall(activateCharacterApi, reloadListing);
+
+  const isLocked = getStatus(character) === CharacterStatusEnum.Locked;
+
+  const handleToggleLock = () => {
+    if (isLocked) {
+      unlockCharacter(character);
+      logUnlockCharacterUnlocked();
+    } else {
+      lockCharacter(character);
+      logUnlockCharacterLocked();
+    }
+  };
+
+  return (
+    <li className="ddb-campaigns-character-card-wrapper j-characters-listing__item">
+      <div
+        className={clsx([`status-${getStatusSlug(character)}`, styles.card])}
+      >
+        <div className="ddb-campaigns-character-card-header">
+          {getBackdropUrl(character) ? (
+            <div
+              className="ddb-campaigns-character-card-header-cover-image ddb-campaigns-character-card-header-cover-image-user-backdrop"
+              style={{
+                backgroundImage: `url(${getBackdropUrl(character)})`,
+              }}
+            />
+          ) : (
+            <div
+              className="ddb-campaigns-character-card-header-cover-image"
+              style={{
+                backgroundImage: `url(${getCoverImageUrl(character)})`,
+              }}
+            />
+          )}
+          <div className="ddb-campaigns-character-card-header-upper">
+            {!hasLockedCharacters &&
+              getStatus(character) === CharacterStatusEnum.Active && (
+                // eslint-disable-next-line jsx-a11y/anchor-has-content
+                <a
+                  href={getDetailsLink(character)}
+                  className="ddb-campaigns-character-card-header-upper-details-link"
+                  // There already is a view link - this is just making the top area clickable so it shouldn't be tabbed to or announced
+                  tabIndex={-1}
+                  aria-hidden={true}
+                />
+              )}
+            <div className="ddb-campaigns-character-card-header-upper-portrait">
+              {getAvatarUrl(character) ? (
+                <div
+                  className="image user-selected-avatar"
+                  style={{
+                    backgroundImage: `url(${getAvatarUrl(character)})`,
+                  }}
+                />
+              ) : (
+                <div className="image default-character-avatar" />
+              )}
+            </div>
+            <div className="ddb-campaigns-character-card-header-upper-character-info">
+              <h2 className={styles.name}>{getName(character)}</h2>
+              <div className="ddb-campaigns-character-card-header-upper-character-info-secondary">
+                {getSecondaryInfo(character)}
+              </div>
+            </div>
+          </div>
+        </div>
+        {hasLockedCharacters && (
+          <Button
+            className={clsx([styles.cornerButton, isLocked && styles.locked])}
+            color="primary"
+            aria-label={isLocked ? "Click to unlock" : "Click to lock"}
+            onClick={handleToggleLock}
+            disabled={isLocked && !canUnlockMore}
+          >
+            {isLocked ? (
+              <Lock className={styles.lockIcon} />
+            ) : (
+              <Check className={styles.checkIcon} />
+            )}
+          </Button>
+        )}
+        {isInCampaign(character) && (
+          <div className="ddb-campaigns-character-card-campaign-links">
+            <div className="ddb-campaigns-character-card-campaign-links-campaign">
+              <strong>Campaign:</strong>{" "}
+              {!hasLockedCharacters ? (
+                <a
+                  className="ddb-campaigns-character-card-campaign-links-campaign-link"
+                  href={getCampaignDetailsLink(character)}
+                  onClick={() => logCharacterCampaignClicked()}
+                >
+                  {getCampaignName(character)}
+                </a>
+              ) : (
+                <span>{getCampaignName(character)}</span>
+              )}
+              {!getIsAssigned(character) && " (Unassigned)"}
+            </div>
+            <div className="ddb-campaigns-character-card-campaign-links-actions">
+              {!hasLockedCharacters && (
+                <LeaveCampaignButton
+                  character={character}
+                  leaveCampaign={() => leaveCampaign(character)}
+                />
+              )}
+            </div>
+          </div>
+        )}
+        <div className="ddb-campaigns-character-card-footer">
+          <div
+            className={[
+              "ddb-campaigns-character-card-footer-links",
+              hasLockedCharacters && "is-unlocking",
+            ]
+              .filter(Boolean)
+              .join(" ")}
+          >
+            <CharacterCardLinks
+              character={character}
+              hasLockedCharacters={hasLockedCharacters}
+              overCharacterLimit={overCharacterLimit}
+              copyCharacter={() => copyCharacter(character)}
+              deleteCharacter={() => deleteCharacter(character)}
+              lockCharacter={lockCharacter}
+              unlockCharacter={unlockCharacter}
+              canUnlockMore={canUnlockMore}
+              maxCharacterSlotsAllowed={maxCharacterSlotsAllowed}
+              activateCharacter={() => activateCharacter(character)}
+              currentCharacterCount={currentCharacterCount}
+            />
+          </div>
+          <ApiStatusIndicator
+            isLoading={isCopyingCharacter}
+            error={errorCopyingCharacter}
+            loadingMessage={`Copying ${getName(character)}`}
+            errorMessage={`Error copying ${getName(character)}`}
+          />
+          <ApiStatusIndicator
+            isLoading={isDeletingCharacter}
+            error={errorDeletingCharacter}
+            loadingMessage={`Deleting ${getName(character)}`}
+            errorMessage={`Error deleting ${getName(character)}`}
+          />
+          <ApiStatusIndicator
+            isLoading={isActivatingCharacter}
+            error={errorActivatingCharacter}
+            loadingMessage={`Activating ${getName(character)}`}
+            errorMessage={`Error activating ${getName(character)}`}
+          />
+          <ApiStatusIndicator
+            isLoading={isLeavingCampaign}
+            error={errorLeavingCampaign}
+            loadingMessage={`Leaving ${getCampaignName(character)}`}
+            errorMessage={`Error leaving ${getCampaignName(character)}`}
+          />
+        </div>
+      </div>
+    </li>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/CharacterCard/CharacterCardLinks/CharacterCardLinks.tsx b/ddb_main/subApps/listing/components/CharacterCard/CharacterCardLinks/CharacterCardLinks.tsx
new file mode 100644
index 0000000..0ca2e10
--- /dev/null
+++ b/ddb_main/subApps/listing/components/CharacterCard/CharacterCardLinks/CharacterCardLinks.tsx
@@ -0,0 +1,116 @@
+import { Button } from "@dndbeyond/ttui/components/Button";
+
+import { CharacterStatusEnum } from "~/types";
+
+import {
+  logCharacterEditClicked,
+  logCharacterViewClicked,
+  logUnlockCharacterLocked,
+  logUnlockCharacterUnlocked,
+} from "../../../../../helpers/analytics";
+import {
+  getDetailsLink,
+  getEditLink,
+  getStatus,
+} from "../../../../../state/selectors/characterUtils";
+import { ActivateButton } from "../ActivateButton";
+import type { CharacterCardProps } from "../CharacterCard";
+import { CopyButton } from "../CopyButton";
+import { DeleteButton } from "../DeleteButton";
+import styles from "./styles.module.css";
+
+interface CharacterCardLinksProps
+  extends Omit<CharacterCardProps, "reloadListing"> {
+  copyCharacter: () => void;
+  deleteCharacter: () => void;
+  activateCharacter: () => void;
+}
+
+export const CharacterCardLinks: React.FC<CharacterCardLinksProps> = ({
+  character,
+  hasLockedCharacters,
+  overCharacterLimit,
+  copyCharacter,
+  deleteCharacter,
+  lockCharacter,
+  unlockCharacter,
+  canUnlockMore,
+  maxCharacterSlotsAllowed,
+  activateCharacter,
+  currentCharacterCount,
+}) => {
+  const isLocked = getStatus(character) === CharacterStatusEnum.Locked;
+  const showActivateButton =
+    maxCharacterSlotsAllowed === null ||
+    currentCharacterCount < maxCharacterSlotsAllowed;
+
+  const handleToggleLock = () => {
+    if (isLocked) {
+      unlockCharacter(character);
+      logUnlockCharacterUnlocked();
+    } else {
+      lockCharacter(character);
+      logUnlockCharacterLocked();
+    }
+  };
+
+  if (hasLockedCharacters)
+    return (
+      <>
+        <Button
+          size="small"
+          variant={isLocked ? "outline" : "solid"}
+          onClick={handleToggleLock}
+          disabled={isLocked && !canUnlockMore}
+          title={
+            isLocked && !canUnlockMore
+              ? "Max characters selected to unlock. Lock other characters to unlock this character."
+              : undefined
+          }
+        >
+          {isLocked ? "Select" : "Deselect"}
+        </Button>
+        <p className={styles.text}>
+          {isLocked
+            ? "This Character will be deactivated."
+            : "This Character will be activated."}
+        </p>
+      </>
+    );
+
+  return (
+    <>
+      {!isLocked && (
+        <>
+          <Button
+            size="small"
+            variant="text"
+            href={getDetailsLink(character)}
+            onClick={() => logCharacterViewClicked()}
+          >
+            View
+          </Button>
+          <Button
+            size="small"
+            variant="text"
+            href={getEditLink(character)}
+            onClick={() => logCharacterEditClicked()}
+          >
+            Edit
+          </Button>
+          {!overCharacterLimit && (
+            <CopyButton character={character} copyCharacter={copyCharacter} />
+          )}
+        </>
+      )}
+      {isLocked && showActivateButton && (
+        <ActivateButton
+          character={character}
+          activateCharacter={activateCharacter}
+          maxCharacterSlotsAllowed={maxCharacterSlotsAllowed}
+        />
+      )}
+      <DeleteButton character={character} deleteCharacter={deleteCharacter} />
+    </>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/CharacterCard/CopyButton/CopyButton.tsx b/ddb_main/subApps/listing/components/CharacterCard/CopyButton/CopyButton.tsx
new file mode 100644
index 0000000..7144769
--- /dev/null
+++ b/ddb_main/subApps/listing/components/CharacterCard/CopyButton/CopyButton.tsx
@@ -0,0 +1,54 @@
+import { useState } from "react";
+
+import { Button } from "@dndbeyond/ttui/components/Button";
+
+import {
+  logCharacterCopyCancelled,
+  logCharacterCopyClicked,
+  logCharacterCopyConfirmed,
+} from "../../../../../helpers/analytics";
+import { getName } from "../../../../../state/selectors/characterUtils";
+import { CharacterData } from "../../../../../types";
+import { ConfirmationModal } from "../../ConfirmationModal";
+
+interface CopyProps {
+  character: CharacterData;
+  copyCharacter: () => void;
+}
+
+export const CopyButton: React.FC<CopyProps> = ({
+  character,
+  copyCharacter,
+}) => {
+  const [isOpen, setIsOpen] = useState(false);
+
+  return (
+    <div>
+      <ConfirmationModal
+        onClose={() => {
+          setIsOpen(false);
+          logCharacterCopyCancelled();
+        }}
+        isOpen={isOpen}
+        onConfirm={() => {
+          copyCharacter();
+          logCharacterCopyConfirmed();
+          setIsOpen(false);
+        }}
+        message={`Are you sure you want to copy ${getName(character)}?`}
+        title="Copy this character?"
+        confirmText="Copy"
+      />
+      <Button
+        variant="text"
+        size="small"
+        onClick={() => {
+          logCharacterCopyClicked();
+          setIsOpen(true);
+        }}
+      >
+        Copy
+      </Button>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/CharacterCard/DeleteButton/DeleteButton.tsx b/ddb_main/subApps/listing/components/CharacterCard/DeleteButton/DeleteButton.tsx
new file mode 100644
index 0000000..df8bce3
--- /dev/null
+++ b/ddb_main/subApps/listing/components/CharacterCard/DeleteButton/DeleteButton.tsx
@@ -0,0 +1,58 @@
+import { useState } from "react";
+
+import { Button } from "@dndbeyond/ttui/components/Button";
+
+import {
+  logCharacterDeleteCancelled,
+  logCharacterDeleteClicked,
+  logCharacterDeleteConfirmed,
+} from "../../../../../helpers/analytics";
+import { getName } from "../../../../../state/selectors/characterUtils";
+import { CharacterData } from "../../../../../types";
+import { ConfirmationModal } from "../../ConfirmationModal";
+
+interface DeleteButtonProps {
+  character: CharacterData;
+  deleteCharacter: () => void;
+}
+
+export const DeleteButton: React.FC<DeleteButtonProps> = ({
+  character,
+  deleteCharacter,
+}) => {
+  const [isOpen, setIsOpen] = useState(false);
+
+  return (
+    <div>
+      <ConfirmationModal
+        isOpen={isOpen}
+        onClose={() => {
+          logCharacterDeleteCancelled();
+          setIsOpen(false);
+        }}
+        onConfirm={() => {
+          deleteCharacter();
+          logCharacterDeleteConfirmed();
+          setIsOpen(false);
+        }}
+        message={`To delete ${getName(
+          character
+        )}, type the word DELETE into the field below.`}
+        title="Delete this character?"
+        typeValueToConfirm="delete"
+        confirmText="Delete"
+      />
+      <Button
+        size="small"
+        variant="text"
+        color="error"
+        onClick={() => {
+          logCharacterDeleteClicked();
+          setIsOpen(true);
+        }}
+      >
+        Delete
+      </Button>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/CharacterCard/LeaveCampaignButton/LeaveCampaignButton.tsx b/ddb_main/subApps/listing/components/CharacterCard/LeaveCampaignButton/LeaveCampaignButton.tsx
new file mode 100644
index 0000000..8be3ec2
--- /dev/null
+++ b/ddb_main/subApps/listing/components/CharacterCard/LeaveCampaignButton/LeaveCampaignButton.tsx
@@ -0,0 +1,57 @@
+import { useState } from "react";
+
+import {
+  logCharacterLeaveCampaignCancelled,
+  logCharacterLeaveCampaignClicked,
+  logCharacterLeaveCampaignConfirmed,
+} from "../../../../../helpers/analytics";
+import {
+  getCampaignName,
+  getName,
+} from "../../../../../state/selectors/characterUtils";
+import { CharacterData } from "../../../../../types";
+import { ConfirmationModal } from "../../ConfirmationModal";
+import styles from "./styles.module.css";
+
+interface LeaveCampaignProps {
+  character: CharacterData;
+  leaveCampaign: () => void;
+}
+
+export const LeaveCampaignButton: React.FC<LeaveCampaignProps> = ({
+  character,
+  leaveCampaign,
+}) => {
+  const [isOpen, setIsOpen] = useState(false);
+
+  return (
+    <div>
+      <ConfirmationModal
+        isOpen={isOpen}
+        onClose={() => {
+          logCharacterLeaveCampaignCancelled();
+          setIsOpen(false);
+        }}
+        onConfirm={() => {
+          leaveCampaign();
+          logCharacterLeaveCampaignConfirmed();
+          setIsOpen(false);
+        }}
+        message={`Are you sure you want ${getName(
+          character
+        )} to leave ${getCampaignName(character)}?`}
+        title="Leave this Campaign?"
+        confirmText="Leave"
+      />
+      <button
+        className={styles.button}
+        onClick={() => {
+          logCharacterLeaveCampaignClicked();
+          setIsOpen(true);
+        }}
+      >
+        Leave Campaign
+      </button>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/CharacterGrid/CharacterGrid.tsx b/ddb_main/subApps/listing/components/CharacterGrid/CharacterGrid.tsx
new file mode 100644
index 0000000..6e93979
--- /dev/null
+++ b/ddb_main/subApps/listing/components/CharacterGrid/CharacterGrid.tsx
@@ -0,0 +1,409 @@
+import React, { useCallback, useEffect, useState } from "react";
+
+import ArrowDown from "@dndbeyond/fontawesome-cache/svgs/regular/arrow-down-to-line.svg";
+import { Button } from "@dndbeyond/ttui/components/Button";
+
+import { MaxCharactersDialog } from "~/components/MaxCharactersDialog";
+import config from "~/config";
+import { UserPreferenceProvider } from "~/tools/js/smartComponents/UserPreference";
+
+import { logUnlockSubscribeClicked } from "../../../../helpers/analytics";
+import { byProp, createSortValue } from "../../../../helpers/sortUtils";
+import useLocalStorage from "../../../../hooks/useLocalStorage";
+import useSubscriptionTier, {
+  FREE_TIER,
+  HERO_TIER,
+} from "../../../../hooks/useSubscriptionTier";
+import useUserId from "../../../../hooks/useUserId";
+import {
+  getId,
+  getSearchableTerms,
+  getStatus,
+  SortByPropMap,
+} from "../../../../state/selectors/characterUtils";
+import {
+  CharacterData,
+  CharacterStatusEnum,
+  SortOrderEnum,
+  SortTypeEnum,
+} from "../../../../types";
+import { ApiStatusIndicator } from "../ApiStatusIndicator";
+import { CharacterCard } from "../CharacterCard";
+import { SubscriptionBanner } from "../SubscriptionBanner";
+import { SearchSort } from "./SearchSort";
+import { SecondaryHeader } from "./SecondaryHeader";
+import styles from "./styles.module.css";
+
+const overrideStatusForUnlock = ({
+  character,
+  characterIdsToUnlock,
+  hasLockedCharacters,
+}) => {
+  if (!hasLockedCharacters) {
+    return getStatus(character);
+  }
+
+  return characterIdsToUnlock.includes(getId(character))
+    ? CharacterStatusEnum.Active
+    : CharacterStatusEnum.Locked;
+};
+
+export interface SortState {
+  sortBy: SortTypeEnum;
+  sortOrder: SortOrderEnum;
+}
+
+export interface CharacterGridProps {
+  className?: string;
+  isLoading: boolean;
+  characters: Array<CharacterData>;
+  loadingError?: Error | null;
+  reload: () => void;
+  hasLockedCharacters: boolean;
+  maxCharacterSlotsAllowed: number | null;
+  hasMaxCharacters: boolean;
+}
+
+export const CharacterGrid: React.FC<CharacterGridProps> = ({
+  className = "",
+  isLoading,
+  characters,
+  loadingError,
+  reload,
+  hasLockedCharacters,
+  maxCharacterSlotsAllowed,
+  hasMaxCharacters,
+}) => {
+  const userId = useUserId();
+  const subscriptionTier = useSubscriptionTier();
+
+  const [sortPreference, setSortPreference] = useLocalStorage<string>(
+    `MY_CHARACTERS_SORT_PREFERENCE:${userId}`,
+    createSortValue(SortTypeEnum.Created, SortOrderEnum.Ascending)
+  );
+
+  const [search, setSearch] = useState("");
+  const [sort, setSort] = useState<SortState>({
+    sortBy: SortTypeEnum.Created,
+    sortOrder: SortOrderEnum.Ascending,
+  });
+  const [isMaxCharacterMessageOpen, setIsMaxCharacterMessageOpen] =
+    useState(false);
+  const [characterIdsToUnlock, setCharacterIdsToUnlock] = useState<
+    Array<number>
+  >([]);
+  const canUnlockMore: boolean = maxCharacterSlotsAllowed
+    ? characterIdsToUnlock.length < maxCharacterSlotsAllowed
+    : true;
+
+  useEffect(() => {
+    // Don't try to set the sort if there is no preference or if the listing is currently loading results
+    if (!sortPreference || isLoading) {
+      return;
+    }
+
+    const [sortPreferenceBy, sortPreferenceOrder] = sortPreference.split("-");
+
+    // If they are false then use the default
+    if (!sortPreferenceBy || !sortPreferenceOrder) {
+      return;
+    }
+
+    // Prevent an infinite loop of reloading once the sort preference has actually been applied
+    if (
+      sortPreferenceBy === sort.sortBy &&
+      sortPreferenceOrder === sort.sortOrder
+    ) {
+      return;
+    }
+
+    setSort({
+      sortBy: sortPreferenceBy as SortTypeEnum,
+      sortOrder: sortPreferenceOrder as SortOrderEnum,
+    });
+  }, [isLoading, sortPreference, sort]);
+
+  useEffect(() => {
+    if (hasLockedCharacters && characterIdsToUnlock.length === 0) {
+      setCharacterIdsToUnlock(
+        characters
+          .filter(
+            (character) => getStatus(character) === CharacterStatusEnum.Active
+          )
+          .map(getId)
+      );
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [hasLockedCharacters, characters]);
+
+  const unlockCharacter = useCallback(
+    (character: CharacterData) => {
+      if (!characterIdsToUnlock.includes(getId(character))) {
+        setCharacterIdsToUnlock([...characterIdsToUnlock, getId(character)]);
+      }
+    },
+    [characterIdsToUnlock]
+  );
+
+  const lockCharacter = useCallback(
+    (character: CharacterData) => {
+      if (characterIdsToUnlock.includes(getId(character))) {
+        setCharacterIdsToUnlock(
+          characterIdsToUnlock.filter((id) => id !== getId(character))
+        );
+      }
+    },
+    [characterIdsToUnlock]
+  );
+
+  let filteredCharacters = characters.filter((character) => {
+    return getSearchableTerms(character)
+      .join(" ")
+      .toLowerCase()
+      .includes(search.toLowerCase());
+  });
+
+  const sortByPropSelector = SortByPropMap[sort.sortBy];
+
+  if (sortByPropSelector) {
+    filteredCharacters = filteredCharacters.sort(byProp(sortByPropSelector));
+
+    if (sort.sortOrder === SortOrderEnum.Descending) {
+      filteredCharacters.reverse();
+    }
+  }
+
+  let lockedCharacters: Array<CharacterData> = [];
+  if (!hasLockedCharacters && canUnlockMore) {
+    lockedCharacters = filteredCharacters.filter(
+      (character) => getStatus(character) === CharacterStatusEnum.Locked
+    );
+    filteredCharacters = filteredCharacters.filter(
+      (character) => getStatus(character) === CharacterStatusEnum.Active
+    );
+  }
+
+  const characterCount: number = characters.filter(
+    (character) => getStatus(character) === CharacterStatusEnum.Active
+  ).length;
+  const overCharacterLimit: boolean =
+    maxCharacterSlotsAllowed !== null &&
+    characterCount >= maxCharacterSlotsAllowed;
+
+  const createCharacterHref = !hasMaxCharacters
+    ? `${config.basePathname}/builder`
+    : undefined;
+  const createCharacterOnClick = hasMaxCharacters
+    ? () => setIsMaxCharacterMessageOpen(true)
+    : undefined;
+
+  return (
+    <UserPreferenceProvider>
+      <div
+        className={[className, "ddb-characters-listing"]
+          .filter(Boolean)
+          .join(" ")}
+      >
+        <div className="ddb-characters-listing-header">
+          {/*
+                    The CTA component will be shown depending on some conditions:
+                    - If the user doesn't have a subscription, and has 6 characters, show the Hero CTA
+                    - If the user has a Hero subscription, show the Master CTA
+                    Remember that the Images for the CTA's are served by Waterdeep (then, the images could be shown as broken)
+                */}
+
+          {subscriptionTier === FREE_TIER &&
+            characterCount === maxCharacterSlotsAllowed && (
+              <SubscriptionBanner
+                iconType="hero"
+                text="Your party is full. Unlock unlimited character creation."
+                buttonLabel="Subscribe Now!"
+                onClick={() =>
+                  (window.location.href = `${config.ddbBaseUrl}/store/subscribe#plans`)
+                }
+              />
+            )}
+
+          {subscriptionTier.includes(HERO_TIER) &&
+            characterCount === maxCharacterSlotsAllowed && (
+              <SubscriptionBanner
+                iconType="master"
+                text="Unlock your full potential and EXCLUSIVE perks."
+                buttonLabel="Upgrade Now!"
+                onClick={() =>
+                  (window.location.href = `${config.ddbBaseUrl}/store/subscribe#plans`)
+                }
+              />
+            )}
+
+          <header className={styles.header}>
+            <h1 className={styles.h1}>My Characters</h1>
+            <Button
+              className={styles.button}
+              href={createCharacterHref}
+              onClick={createCharacterOnClick}
+            >
+              Create A Character
+            </Button>
+          </header>
+          <div className={styles.subheader}>
+            <p className={styles.slots}>
+              Slots:
+              <span className={styles.count}>
+                {characterCount}/
+                {/* TODO: Come back and use the subscription role to figure this out? This number won't be the same as our DB max int */}
+                {maxCharacterSlotsAllowed === null ||
+                maxCharacterSlotsAllowed === 2147483647
+                  ? "Unlimited"
+                  : `${maxCharacterSlotsAllowed} Used`}
+              </span>
+            </p>
+            <div className={styles.pdfLinkWrapper}>
+              <a
+                href="https://media.dndbeyond.com/compendium-images/free-rules/ph/character-sheet.pdf"
+                target="_blank"
+                className={styles.pdfLink}
+              >
+                <ArrowDown className={styles.pdfLinkSvg}></ArrowDown>
+                Download a blank character sheet
+              </a>
+            </div>
+          </div>
+
+          <div className="ddb-characters-listing-header-secondary">
+            <SecondaryHeader
+              hasLockedCharacters={hasLockedCharacters}
+              maxCharacterSlotsAllowed={maxCharacterSlotsAllowed}
+              characterCount={characterCount}
+              characters={characters}
+              characterIdsToUnlock={characterIdsToUnlock}
+              subscriptionTier={subscriptionTier}
+            />
+          </div>
+        </div>
+        <SearchSort
+          search={search}
+          onSearch={setSearch}
+          sort={sort}
+          onSort={setSort}
+          sortPreference={sortPreference}
+          onSortPreference={setSortPreference}
+        />
+        <div className="ddb-characters-listing-body j-characters-listing__content">
+          <div className="listing-container listing-container-ul RPGCharacter-listing">
+            <div className="listing-body">
+              <ul className="listing listing-rpgcharacter rpgcharacter-listing">
+                {filteredCharacters.map((character) => (
+                  <CharacterCard
+                    key={`listing-item_${getId(character)}`}
+                    character={{
+                      ...character,
+                      status: overrideStatusForUnlock({
+                        character,
+                        characterIdsToUnlock,
+                        hasLockedCharacters,
+                      }),
+                    }}
+                    hasLockedCharacters={hasLockedCharacters}
+                    overCharacterLimit={overCharacterLimit}
+                    reloadListing={reload}
+                    lockCharacter={lockCharacter}
+                    unlockCharacter={unlockCharacter}
+                    canUnlockMore={canUnlockMore}
+                    maxCharacterSlotsAllowed={maxCharacterSlotsAllowed}
+                    currentCharacterCount={characterCount}
+                  />
+                ))}
+              </ul>
+              {filteredCharacters.length === 0 && (
+                <>
+                  {!!search ? (
+                    <>
+                      <p className={styles.noResultsTitle}>
+                        It looks like we failed our investigation check.
+                      </p>
+                      <p className={styles.noResultsText}>
+                        Cast guidance on us by refining your search, and
+                        we&apos;ll try again!
+                      </p>
+                    </>
+                  ) : (
+                    <>
+                      <p className={styles.noResultsTitle}>
+                        Looks like you haven&apos;t created a character yet.
+                      </p>
+                      <p className={styles.noResultsText}>
+                        Start your adventure by creating a character!
+                      </p>
+                    </>
+                  )}
+                </>
+              )}
+            </div>
+            {lockedCharacters.length > 0 && (
+              <>
+                <h2 className={styles.deactivatedHeading}>
+                  Deactivated Characters
+                </h2>
+                <p className={styles.deactivatedText}>
+                  Activate characters by freeing up a slot, or add slots with a
+                  <Button
+                    className={styles.deactivatedButton}
+                    variant="text"
+                    size="small"
+                    href={`${config.ddbBaseUrl}/subscribe`}
+                    onClick={() => logUnlockSubscribeClicked()}
+                  >
+                    D&amp;D Beyond subscription.
+                  </Button>
+                </p>
+                <div className="listing-body">
+                  <ul className="listing listing-rpgcharacter rpgcharacter-listing">
+                    {lockedCharacters.map((character) => (
+                      <CharacterCard
+                        key={`listing-item_${getId(character)}`}
+                        character={{
+                          ...character,
+                          status: overrideStatusForUnlock({
+                            character,
+                            characterIdsToUnlock,
+                            hasLockedCharacters,
+                          }),
+                        }} // TODO can this logic go in the utils?
+                        hasLockedCharacters={hasLockedCharacters}
+                        overCharacterLimit={overCharacterLimit}
+                        reloadListing={reload}
+                        lockCharacter={lockCharacter}
+                        unlockCharacter={unlockCharacter}
+                        canUnlockMore={canUnlockMore}
+                        maxCharacterSlotsAllowed={maxCharacterSlotsAllowed}
+                        currentCharacterCount={characterCount}
+                      />
+                    ))}
+                  </ul>
+                </div>
+              </>
+            )}
+          </div>
+        </div>
+        <div className="ddb-characters-listing__loading-indicator-wrapper">
+          <ApiStatusIndicator
+            isLoading={isLoading}
+            error={loadingError || undefined}
+            loadingMessage={"Loading Characters"}
+            errorMessage={
+              loadingError ? loadingError.message : "Error Loading Characters"
+            }
+          ></ApiStatusIndicator>
+        </div>
+        <div className="ddbcl-my-characters-listing__version">
+          My Characters Version: v{config.version}
+        </div>
+        <MaxCharactersDialog
+          open={isMaxCharacterMessageOpen}
+          onClose={() => setIsMaxCharacterMessageOpen(false)}
+        />
+      </div>
+    </UserPreferenceProvider>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/CharacterGrid/FinalizeUnlock/FinalizeUnlock.tsx b/ddb_main/subApps/listing/components/CharacterGrid/FinalizeUnlock/FinalizeUnlock.tsx
new file mode 100644
index 0000000..a02d130
--- /dev/null
+++ b/ddb_main/subApps/listing/components/CharacterGrid/FinalizeUnlock/FinalizeUnlock.tsx
@@ -0,0 +1,81 @@
+import { useState } from "react";
+
+import { Button } from "@dndbeyond/ttui/components/Button";
+
+import {
+  logUnlockFinishUnlockingCancelled,
+  logUnlockFinishUnlockingClicked,
+  logUnlockFinishUnlockingConfirmed,
+} from "../../../../../helpers/analytics";
+import { CharacterData } from "../../../../../types";
+import { ConfirmationModal } from "../../ConfirmationModal";
+import { UnlockConfirmation } from "../UnlockConfirmation";
+import styles from "./styles.module.css";
+
+interface FinalizeUnlockProps {
+  charactersToUnlock: Array<CharacterData>;
+  maxCharacterSlotsAllowed: number | null;
+  finalizeUnlock: () => void;
+  disabled: boolean;
+}
+
+export const FinalizeUnlock: React.FC<FinalizeUnlockProps> = ({
+  charactersToUnlock,
+  finalizeUnlock,
+  disabled,
+  maxCharacterSlotsAllowed,
+}) => {
+  const [isOpen, setIsOpen] = useState(false);
+  const charactersToUnlockCount = charactersToUnlock.length;
+
+  const handleClose = () => {
+    logUnlockFinishUnlockingCancelled(
+      charactersToUnlockCount,
+      maxCharacterSlotsAllowed
+    );
+    setIsOpen(false);
+  };
+
+  const handleConfirm = () => {
+    finalizeUnlock();
+    logUnlockFinishUnlockingConfirmed(
+      charactersToUnlockCount,
+      maxCharacterSlotsAllowed
+    );
+    setIsOpen(false);
+  };
+
+  const handleClick = () => {
+    setIsOpen(true);
+    logUnlockFinishUnlockingClicked(
+      charactersToUnlockCount,
+      maxCharacterSlotsAllowed
+    );
+  };
+
+  return (
+    <>
+      <ConfirmationModal
+        onClose={handleClose}
+        isOpen={isOpen}
+        onConfirm={handleConfirm}
+        message={
+          <UnlockConfirmation
+            charactersToUnlock={charactersToUnlock}
+            maxCharacterSlotsAllowed={maxCharacterSlotsAllowed}
+            message={
+              <p className={styles.text}>
+                Other characters will remain deactivated until you free up a
+                slot or add slots with a D&D Beyond subscription.
+              </p>
+            }
+          />
+        }
+        title="Activate these characters?"
+      />
+      <Button size="large" disabled={disabled} onClick={handleClick}>
+        Continue
+      </Button>
+    </>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/CharacterGrid/SearchSort/SearchSort.tsx b/ddb_main/subApps/listing/components/CharacterGrid/SearchSort/SearchSort.tsx
new file mode 100644
index 0000000..9aa8274
--- /dev/null
+++ b/ddb_main/subApps/listing/components/CharacterGrid/SearchSort/SearchSort.tsx
@@ -0,0 +1,160 @@
+import {
+  ChangeEvent,
+  Dispatch,
+  FC,
+  SetStateAction,
+  useRef,
+  useState,
+} from "react";
+
+import Gear from "@dndbeyond/fontawesome-cache/svgs/regular/gear.svg";
+import CircleXMark from "@dndbeyond/fontawesome-cache/svgs/solid/circle-xmark.svg";
+import MagnifyingGlass from "@dndbeyond/fontawesome-cache/svgs/solid/magnifying-glass.svg";
+import { Button } from "@dndbeyond/ttui/components/Button";
+import { Select } from "@dndbeyond/ttui/components/Select";
+
+import PreferenceUpdateLocation from "~/tools/js/Shared/constants/PreferenceUpdateLocation";
+import CharacterSettingsModal from "~/tools/js/smartComponents/CharacterSettingsModal";
+import { SortOrderEnum, SortTypeEnum } from "~/types";
+
+import { logListingSortChanged } from "../../../../../helpers/analytics";
+import { createSortValue } from "../../../../../helpers/sortUtils";
+import { SortState } from "../CharacterGrid";
+import styles from "./styles.module.css";
+
+const sortOptions = [
+  {
+    value: createSortValue(SortTypeEnum.Created, SortOrderEnum.Descending),
+    label: "Created: Newest",
+  },
+  {
+    value: createSortValue(SortTypeEnum.Created, SortOrderEnum.Ascending),
+    label: "Created: Oldest",
+  },
+  {
+    value: createSortValue(SortTypeEnum.Name, SortOrderEnum.Ascending),
+    label: "Name: A to Z",
+  },
+  {
+    value: createSortValue(SortTypeEnum.Name, SortOrderEnum.Descending),
+    label: "Name: Z to A",
+  },
+  {
+    value: createSortValue(SortTypeEnum.Level, SortOrderEnum.Ascending),
+    label: "Level: Low to High",
+  },
+  {
+    value: createSortValue(SortTypeEnum.Level, SortOrderEnum.Descending),
+    label: "Level: High to Low",
+  },
+  {
+    value: createSortValue(SortTypeEnum.Modified, SortOrderEnum.Descending),
+    label: "Modified: Latest",
+  },
+  {
+    value: createSortValue(SortTypeEnum.Modified, SortOrderEnum.Ascending),
+    label: "Modified: Oldest",
+  },
+];
+
+interface SearchSortProps {
+  search: string;
+  onSearch: Dispatch<SetStateAction<string>>;
+  sort: SortState;
+  onSort: Dispatch<SetStateAction<SortState>>;
+  sortPreference: string;
+  onSortPreference: Dispatch<SetStateAction<string>>;
+}
+
+export const SearchSort: FC<SearchSortProps> = ({
+  search,
+  onSearch,
+  sort,
+  onSort,
+  sortPreference,
+  onSortPreference,
+}) => {
+  const [showSettingsModal, setShowSettingsModal] = useState(false);
+  const searchInputRef = useRef<HTMLInputElement>(null);
+
+  const handleSearchClick = () => {
+    if (searchInputRef.current) {
+      searchInputRef.current.focus();
+    }
+  };
+
+  const handleSort = (e: ChangeEvent<HTMLInputElement>) => {
+    const { value } = e.target;
+
+    const [sortBy, sortOrder] = value.split("-");
+
+    onSort({
+      sortBy: sortBy as SortTypeEnum,
+      sortOrder: sortOrder as SortOrderEnum,
+    });
+
+    onSortPreference(value);
+
+    logListingSortChanged(value);
+  };
+
+  const getSortValue =
+    sortOptions.find(
+      (opt) => opt.value === createSortValue(sort.sortBy, sort.sortOrder)
+    ) || sortOptions[0];
+
+  return (
+    <div className={styles.searchSort}>
+      <div className={styles.search} onClick={handleSearchClick}>
+        <MagnifyingGlass />
+        <label className={styles.searchLabel} htmlFor="search">
+          Search
+        </label>
+        <input
+          className={styles.searchInput}
+          type="search"
+          id="search"
+          placeholder={"Search by Name, Level, Class, Species, or Campaign"}
+          value={search}
+          onChange={(e) => onSearch(e.target.value)}
+          ref={searchInputRef}
+        />
+        {search && (
+          <button
+            className={styles.clearButton}
+            onClick={(e) => onSearch("")}
+            aria-label="Clear search terms"
+          >
+            <CircleXMark className={styles.clearIcon} />
+          </button>
+        )}
+      </div>
+      <Select
+        className={styles.sort}
+        placeholder="Select a movement"
+        name="sort"
+        label="Sort By"
+        value={getSortValue.label}
+        options={sortOptions}
+        onChange={handleSort}
+      />
+
+      <>
+        <Button
+          className={styles.settingsButton}
+          variant="outline"
+          size="small"
+          onClick={() => setShowSettingsModal(true)}
+        >
+          <Gear />
+          <span className={styles.settingsButtonText}>Settings</span>
+        </Button>
+        <CharacterSettingsModal
+          open={showSettingsModal}
+          updateLocation={PreferenceUpdateLocation.CharacterListing}
+          handleClose={() => setShowSettingsModal(false)}
+        />
+      </>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/CharacterGrid/SecondaryHeader/SecondaryHeader.tsx b/ddb_main/subApps/listing/components/CharacterGrid/SecondaryHeader/SecondaryHeader.tsx
new file mode 100644
index 0000000..a9cd766
--- /dev/null
+++ b/ddb_main/subApps/listing/components/CharacterGrid/SecondaryHeader/SecondaryHeader.tsx
@@ -0,0 +1,127 @@
+import { toWords } from "number-to-words";
+import { FC, useEffect, useRef } from "react";
+
+import SpinnerThird from "@dndbeyond/fontawesome-cache/svgs/regular/spinner-third.svg";
+
+import useApiCall from "~/hooks/useApiCall";
+
+import config from "../../../../../config";
+import { logUnlockSubscribeClicked } from "../../../../../helpers/analytics";
+import { unlockCharacters } from "../../../../../helpers/characterServiceApi";
+import { getId } from "../../../../../state/selectors/characterUtils";
+import { CharacterGridProps } from "../CharacterGrid";
+import { FinalizeUnlock } from "../FinalizeUnlock";
+import styles from "./styles.module.css";
+
+interface SecondaryHeaderProps
+  extends Pick<
+    CharacterGridProps,
+    "maxCharacterSlotsAllowed" | "characters" | "hasLockedCharacters"
+  > {
+  characterCount: number;
+  subscriptionTier: string;
+  characterIdsToUnlock: Array<number>;
+}
+
+export const SecondaryHeader: FC<SecondaryHeaderProps> = ({
+  hasLockedCharacters,
+  maxCharacterSlotsAllowed,
+  characterCount,
+  subscriptionTier,
+  characters,
+  characterIdsToUnlock,
+}) => {
+  const dialogRef = useRef<HTMLDialogElement>(null);
+  const [
+    finalizeUnlock,
+    isFinalizingUnlock,
+    // Unlock state depends on context state passed by Waterdeep on the root element so we have to do a full page reload after a successful unlock.
+  ] = useApiCall(unlockCharacters, () => window.location.reload());
+
+  useEffect(() => {
+    if (isFinalizingUnlock) {
+      // Hacky workaround since showModal() isn't
+      // supported by TypeScript <4.8.3
+      (dialogRef.current as any)?.showModal();
+    } else {
+      // Hacky workaround since close() isn't
+      // supported by TypeScript <4.8.3
+      (dialogRef.current as any)?.close();
+    }
+  }, [isFinalizingUnlock]);
+
+  if (hasLockedCharacters) {
+    return (
+      <>
+        {/* Loading Dialog */}
+        <dialog
+          className={styles.dialog}
+          ref={dialogRef}
+          onClick={(evt) => {
+            evt.stopPropagation();
+            evt.nativeEvent.stopImmediatePropagation();
+          }}
+        >
+          <SpinnerThird className={styles.spinner} />
+        </dialog>
+
+        {/* Max Characters Alert */}
+        <div className={styles.alert}>
+          <p className={styles.alertTitle}>Character Slots Exceeded</p>
+          Your current D&amp;D Beyond Membership is:{" "}
+          <strong>
+            {subscriptionTier.toUpperCase()} ({maxCharacterSlotsAllowed} slots).{" "}
+          </strong>
+          To continue, select up to{" "}
+          <strong>
+            {maxCharacterSlotsAllowed
+              ? `${toWords(
+                  maxCharacterSlotsAllowed
+                )} (${maxCharacterSlotsAllowed}) `
+              : "unlimited "}
+          </strong>
+          characters to activate. Your other characters will be deactivated
+          until you restore them by deleting an active character to free up a
+          slot, or by adding more slots with a{` `}
+          <a
+            href={`${config.ddbBaseUrl}/subscribe`}
+            onClick={() => logUnlockSubscribeClicked()}
+          >
+            D&amp;D Beyond Subscription
+          </a>
+        </div>
+
+        {/* Bottom Unlock Bar */}
+        <div className={styles.bottomBar}>
+          <div className={styles.bottomContainer}>
+            <p className={styles.bottomText}>
+              Selected:{" "}
+              <strong>
+                {characterIdsToUnlock.length} / {maxCharacterSlotsAllowed}
+              </strong>
+            </p>
+            <FinalizeUnlock
+              charactersToUnlock={characters.filter((character) =>
+                characterIdsToUnlock.includes(getId(character))
+              )}
+              finalizeUnlock={() => finalizeUnlock(characterIdsToUnlock)}
+              disabled={isFinalizingUnlock}
+              maxCharacterSlotsAllowed={maxCharacterSlotsAllowed}
+            />
+          </div>
+        </div>
+      </>
+    );
+  }
+
+  if (characterCount === 0) {
+    return (
+      <div className="ddb-characters-listing-count-active">
+        Character slots allow players to create characters. Once created, all of
+        your characters will appear in the list below.
+      </div>
+    );
+  }
+
+  return null;
+};
diff --git a/ddb_main/subApps/listing/components/CharacterGrid/UnlockConfirmation/UnlockConfirmation.tsx b/ddb_main/subApps/listing/components/CharacterGrid/UnlockConfirmation/UnlockConfirmation.tsx
new file mode 100644
index 0000000..ffd0837
--- /dev/null
+++ b/ddb_main/subApps/listing/components/CharacterGrid/UnlockConfirmation/UnlockConfirmation.tsx
@@ -0,0 +1,40 @@
+import { LabelChip } from "@dndbeyond/ttui/components/LabelChip";
+
+import { getName } from "../../../../../state/selectors/characterUtils";
+import { CharacterData } from "../../../../../types";
+import styles from "./styles.module.css";
+
+export interface UnlockConfirmationProps {
+  charactersToUnlock: Array<CharacterData>;
+  maxCharacterSlotsAllowed: number | null;
+  message?: React.ReactNode;
+}
+
+export const UnlockConfirmation: React.FC<UnlockConfirmationProps> = ({
+  charactersToUnlock,
+  maxCharacterSlotsAllowed,
+  message = null,
+}) => {
+  // TODO: Character Slots update copy
+  if (charactersToUnlock.length === 0)
+    return (
+      <p className={styles.unlockText}>
+        Are you sure you want to unlock no characters? All of your characters
+        will be permanently locked until a new subscription is applied to your
+        account, but you will be able to create and access up to{" "}
+        {maxCharacterSlotsAllowed} new characters. Locked characters do not
+        count towards your character limit.
+      </p>
+    );
+
+  return (
+    <div className={styles.pills}>
+      {charactersToUnlock.map(getName).map((characterName) => (
+        <LabelChip className={styles.pill} key={characterName}>
+          {characterName}
+        </LabelChip>
+      ))}
+      {message && message}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/ConfirmationModal/ConfirmationModal.tsx b/ddb_main/subApps/listing/components/ConfirmationModal/ConfirmationModal.tsx
new file mode 100644
index 0000000..0d6e0c6
--- /dev/null
+++ b/ddb_main/subApps/listing/components/ConfirmationModal/ConfirmationModal.tsx
@@ -0,0 +1,121 @@
+import * as React from "react";
+import { useEffect, useRef, useState } from "react";
+
+import TriangleExclamation from "@dndbeyond/fontawesome-cache/svgs/regular/triangle-exclamation.svg";
+import { Button } from "@dndbeyond/ttui/components/Button";
+
+import styles from "./styles.module.css";
+
+export interface ConfirmationModalProps {
+  onClose: () => void;
+  onConfirm: () => void;
+  typeValueToConfirm?: string;
+  isOpen: boolean;
+  message: React.ReactNode;
+  title: string;
+  confirmText?: string;
+}
+
+export const ConfirmationModal = ({
+  onClose,
+  onConfirm,
+  typeValueToConfirm,
+  isOpen,
+  message,
+  title,
+  confirmText = "Confirm",
+}: ConfirmationModalProps) => {
+  const [confirmEnabled, setConfirmEnabled] = useState(!typeValueToConfirm);
+  const [inputValue, setInputValue] = useState("");
+
+  const dialogRef = useRef<HTMLDialogElement>(null);
+
+  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    const { value } = e.target;
+    const isMatch =
+      value?.toLowerCase().trim() === typeValueToConfirm?.toLowerCase();
+
+    setInputValue(value);
+
+    if (isMatch) {
+      setConfirmEnabled(true);
+    } else if (confirmEnabled) {
+      setConfirmEnabled(false);
+    }
+  };
+
+  const handleConfirm = (e) => {
+    e.preventDefault();
+    if (confirmEnabled) onConfirm();
+  };
+
+  const handleClickBackdrop = (e) => {
+    const rect = dialogRef.current?.getBoundingClientRect();
+    const isClickInDialog =
+      rect &&
+      rect.top <= e.clientY &&
+      e.clientY <= rect.top + rect.height &&
+      rect.left <= e.clientX &&
+      e.clientX <= rect.left + rect.width;
+
+    if (!isClickInDialog) onClose();
+  };
+
+  useEffect(() => {
+    if (isOpen) {
+      // Hacky workaround since showModal() isn't
+      // supported by TypeScript <4.8.3
+      (dialogRef.current as any)?.showModal();
+    } else {
+      // Hacky workaround since close() isn't
+      // supported by TypeScript <4.8.3
+      (dialogRef.current as any)?.close();
+    }
+  }, [onClose, isOpen]);
+
+  return (
+    <dialog
+      className={styles.confirmationDialog}
+      ref={dialogRef}
+      onClick={handleClickBackdrop}
+      aria-labelledby="confirm-dialog"
+    >
+      <div className={styles.container}>
+        <header className={styles.header}>
+          <div id="confirm-dialog" className={styles.title}>
+            {title}
+          </div>
+          {!typeValueToConfirm ? (
+            <div className={styles.text}>{message}</div>
+          ) : (
+            <div className={styles.alert}>
+              <TriangleExclamation className={styles.alertIcon} />
+              <span className={styles.alertText}>{message}</span>
+            </div>
+          )}
+        </header>
+        {typeValueToConfirm && (
+          <input
+            type="text"
+            className={styles.input}
+            onChange={handleChange}
+            value={inputValue}
+            autoFocus
+          />
+        )}
+        <footer className={styles.footer}>
+          <Button variant="outline" onClick={onClose}>
+            Cancel
+          </Button>
+          <Button
+            autoFocus={confirmEnabled}
+            disabled={!confirmEnabled}
+            onClick={handleConfirm}
+          >
+            {confirmText}
+          </Button>
+        </footer>
+      </div>
+    </dialog>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/Header/Header.tsx b/ddb_main/subApps/listing/components/Header/Header.tsx
new file mode 100644
index 0000000..fc6a9f6
--- /dev/null
+++ b/ddb_main/subApps/listing/components/Header/Header.tsx
@@ -0,0 +1,65 @@
+/**
+ * @depricated is this shared?
+ */
+import config from "~/config";
+
+import "./Header.scss";
+
+const BASE_PATHNAME = config.basePathname;
+
+export function Header({ hasMaxCharacters }: { hasMaxCharacters: boolean }) {
+  return (
+    <header className="page-header">
+      <div className="page-header__backdrop"></div>
+      <div className="page-header__extras">
+        <div className="page-header__extra page-header__extra--content1">
+          <section className="atf" role="complementary">
+            {/* <!-- BREADCRUMBS --> */}
+            <nav className="b-breadcrumb b-breadcrumb-a">
+              {/* <!-- WRAPPER --> */}
+              <ul
+                className="b-breadcrumb-wrapper"
+                data-itemscope=""
+                data-itemtype="http://schema.org/BreadcrumbList"
+              >
+                {/* <!-- ITEM --> */}
+                <li
+                  className="b-breadcrumb-item"
+                  data-itemprop="itemListElement"
+                  data-itemscope=""
+                  data-itemtype="http://schema.org/ListItem"
+                >
+                  <a href="/" rel="up" data-itemprop="item">
+                    <span data-itemprop="name">Home</span>
+                  </a>
+                  <meta data-itemprop="position" content="1" />
+                </li>
+
+                {/* <!-- ITEM --> */}
+                <li
+                  className="b-breadcrumb-item"
+                  data-itemprop="itemListElement"
+                  data-itemscope=""
+                  data-itemtype="http://schema.org/ListItem"
+                >
+                  <a href={BASE_PATHNAME} rel="up" data-itemprop="item">
+                    <span data-itemprop="name">My Characters</span>
+                  </a>
+                  <meta data-itemprop="position" content="2" />
+                </li>
+              </ul>
+            </nav>
+          </section>
+        </div>
+        <div className="page-header__spacer"></div>
+      </div>
+      <div className="page-header__primary">
+        <div className="page-heading">
+          <div className="page-heading__content">
+            <h1 className="page-title">My Characters</h1>
+          </div>
+        </div>
+      </div>
+    </header>
+  );
+}
diff --git a/ddb_main/subApps/listing/components/MyCharacters/MyCharacters.tsx b/ddb_main/subApps/listing/components/MyCharacters/MyCharacters.tsx
new file mode 100644
index 0000000..67f8a2b
--- /dev/null
+++ b/ddb_main/subApps/listing/components/MyCharacters/MyCharacters.tsx
@@ -0,0 +1,136 @@
+import { useLayoutEffect, useEffect, useState } from "react";
+
+import { useHeadContext } from "~/contexts/Head";
+
+import { SessionNames } from "../../../../constants";
+import { initAnalytics } from "../../../../helpers/analytics";
+import { getFeatureFlagsFromCharacterService } from "../../../../helpers/characterServiceApi";
+import useLocalStorage from "../../../../hooks/useLocalStorage";
+import useUserId from "../../../../hooks/useUserId";
+import useUserName from "../../../../hooks/useUserName";
+import {
+  generateAppData,
+  getStatus,
+} from "../../../../state/selectors/characterUtils";
+import { CharacterStatusEnum, QueryResponseData } from "../../../../types";
+import { CharacterGrid } from "../CharacterGrid";
+import { Header } from "../Header";
+import { PlayerAppBanner } from "../PlayerAppBanner";
+import "./MyCharacters.scss";
+
+interface Props {
+  characterQuery: {
+    isLoading: boolean;
+    data: QueryResponseData | undefined;
+    refetch: () => void;
+    error: Error | null;
+  };
+}
+
+export const MyCharacters = ({ characterQuery }: Props) => {
+  useEffect(() => {
+    initAnalytics(SessionNames.DDB);
+  }, []);
+  const userId = useUserId();
+  const userName = useUserName();
+  const { setTitle } = useHeadContext();
+  const [storeUrls, setStoreUrls] = useState({
+    appleStoreLink: "",
+    googlePlayStoreLink: "",
+  });
+
+  useLayoutEffect(() => {
+    document
+      .getElementsByTagName("body")[0]
+      .classList.add(
+        "site",
+        "site-dndbeyond",
+        "site-www",
+        "body-mycontent",
+        "body-mycontent-characterindex"
+      );
+    return () => {
+      document
+        .getElementsByTagName("body")[0]
+        .classList.remove(
+          "site",
+          "site-dndbeyond",
+          "site-www",
+          "body-mycontent",
+          "body-mycontent-characterindex"
+        );
+    };
+  }, []);
+
+  useEffect(() => {
+    async function getFlags() {
+      try {
+        const flagResponse = await getFeatureFlagsFromCharacterService([
+          "players-app-apple-store-link",
+          "players-app-google-play-store-link",
+        ]);
+        const { data } = await flagResponse.json();
+        setStoreUrls({
+          appleStoreLink: data["players-app-apple-store-link"],
+          googlePlayStoreLink: data["players-app-google-play-store-link"],
+        });
+      } catch (e) {
+        /* no-op */
+      }
+    }
+    getFlags();
+  }, []);
+
+  useEffect(() => {
+    setTitle("My Characters");
+  }, [setTitle]);
+
+  const [playerAppBannerDismissed, setPlayerAppBannerDismissed] =
+    useLocalStorage(
+      `MY_CHARACTERS_PLAYER_APP_BANNER_DISMISSED:${userId}`,
+      false
+    );
+
+  const showPlayerAppBanner: boolean = !playerAppBannerDismissed;
+
+  const { isLoading, data, refetch, error } = characterQuery;
+  const { characters, hasLockedCharacters, maxCharacterSlotsAllowed } =
+    generateAppData(userName, data);
+  // Check for max active characters
+  const hasMaxCharacters =
+    characters?.filter(
+      (character) => getStatus(character) === CharacterStatusEnum.Active
+    ).length >= (maxCharacterSlotsAllowed ?? Infinity);
+
+  return (
+    <div className="my-characters-wrapper">
+      <Header hasMaxCharacters={hasMaxCharacters} />
+      <div className="content">
+        {showPlayerAppBanner && (
+          <PlayerAppBanner
+            appleStoreLink={storeUrls.appleStoreLink}
+            googlePlayStoreLink={storeUrls.googlePlayStoreLink}
+            onDismiss={() => setPlayerAppBannerDismissed(true)}
+          />
+        )}
+        <CharacterGrid
+          className="ddbcl-my-characters-listing"
+          hasLockedCharacters={hasLockedCharacters}
+          maxCharacterSlotsAllowed={maxCharacterSlotsAllowed}
+          characters={characters}
+          isLoading={isLoading}
+          hasMaxCharacters={hasMaxCharacters}
+          reload={refetch}
+          loadingError={error}
+        />
+        {showPlayerAppBanner && (
+          <PlayerAppBanner
+            appleStoreLink={storeUrls.appleStoreLink}
+            googlePlayStoreLink={storeUrls.googlePlayStoreLink}
+            onDismiss={() => setPlayerAppBannerDismissed(true)}
+          />
+        )}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/PlayerAppBanner/PlayerAppBanner.tsx b/ddb_main/subApps/listing/components/PlayerAppBanner/PlayerAppBanner.tsx
new file mode 100644
index 0000000..b224858
--- /dev/null
+++ b/ddb_main/subApps/listing/components/PlayerAppBanner/PlayerAppBanner.tsx
@@ -0,0 +1,90 @@
+import clsx from "clsx";
+import React from "react";
+
+import XMark from "@dndbeyond/fontawesome-cache/svgs/regular/xmark.svg";
+import { Button } from "@dndbeyond/ttui/components/Button";
+
+import {
+  logPlayerAppBannerClickedCta,
+  logPlayerAppBannerDismissed,
+} from "../../../../helpers/analytics";
+import appleStoreBadge from "../../../../images/apple-store-badge.svg?url";
+import cellphones from "../../../../images/cellphones.png";
+import googlePlayBadge from "../../../../images/google-play-badge.png";
+import styles from "./styles.module.css";
+
+export interface PlayerAppBannerProps {
+  appleStoreLink: string | "DISABLED";
+  className?: string;
+  googlePlayStoreLink: string | "DISABLED";
+  onDismiss: () => void;
+}
+
+export const PlayerAppBanner: React.FC<PlayerAppBannerProps> = ({
+  appleStoreLink,
+  className = "",
+  googlePlayStoreLink,
+  onDismiss,
+}) => {
+  const handleClose = () => {
+    logPlayerAppBannerDismissed();
+    onDismiss();
+  };
+
+  return (
+    <aside
+      className={clsx(["ddbcl-player-app-banner", styles.banner, className])}
+    >
+      <p className={styles.text}>Play Anywhere, Anytime</p>
+      <img
+        className={styles.image}
+        src={cellphones}
+        alt="3 cell phones with Dungeons & Dragons"
+        width={200}
+      />
+      <div className={styles.buttons}>
+        {appleStoreLink && appleStoreLink !== "DISABLED" && (
+          <a
+            className={styles.storeLink}
+            href={appleStoreLink}
+            target="_blank"
+            rel="noreferrer"
+            onClick={() => logPlayerAppBannerClickedCta("Apple")}
+            aria-label="Download the D&amp;D Beyond Player App on the Apple App Store"
+          >
+            <img
+              className={styles.storeImage}
+              src={appleStoreBadge}
+              alt="Apple app store button"
+              width={120}
+            />
+          </a>
+        )}
+        {googlePlayStoreLink && googlePlayStoreLink !== "DISABLED" && (
+          <a
+            className={styles.storeLink}
+            href={googlePlayStoreLink}
+            target="_blank"
+            rel="noreferrer"
+            onClick={() => logPlayerAppBannerClickedCta("Apple")}
+            aria-label="Download the D&amp;D Beyond Player App on Google Play"
+          >
+            <img
+              className={styles.storeImage}
+              src={googlePlayBadge}
+              alt="Google Play store button"
+              width={134}
+            />
+          </a>
+        )}
+        <Button
+          className={styles.closeButton}
+          onClick={handleClose}
+          aria-label="Dismiss player app banner"
+        >
+          <XMark className={styles.closeIcon} />
+        </Button>
+      </div>
+    </aside>
+  );
+};
diff --git a/ddb_main/subApps/listing/components/SubscriptionBanner/SubscriptionBanner.tsx b/ddb_main/subApps/listing/components/SubscriptionBanner/SubscriptionBanner.tsx
new file mode 100644
index 0000000..0ad9593
--- /dev/null
+++ b/ddb_main/subApps/listing/components/SubscriptionBanner/SubscriptionBanner.tsx
@@ -0,0 +1,43 @@
+import { HTMLAttributes } from "react";
+
+import { Button } from "~/components/Button";
+
+import heroIcon from "../../../../images/icons/hero-tier-icon.png";
+import masterIcon from "../../../../images/icons/master-tier-icon.png";
+import styles from "./styles.module.css";
+
+export interface SubscriptionBannerProps
+  extends HTMLAttributes<HTMLDivElement> {
+  iconType: "hero" | "master" | null;
+  text: string;
+  buttonLabel: string;
+  onClick: () => void;
+}
+
+export const SubscriptionBanner: React.FC<SubscriptionBannerProps> = ({
+  iconType,
+  text,
+  buttonLabel,
+  onClick,
+  ...props
+}) => {
+  return (
+    <div className={styles.container} data-testid="subscription-banner">
+      <div className={styles.detailContainer}>
+        {iconType && (
+          <img
+            src={iconType === "master" ? masterIcon : heroIcon}
+            alt={`${iconType} tier icon`}
+            className={styles.icon}
+          />
+        )}
+        <div className={styles.text}>{text || props.children}</div>
+      </div>
+      {onClick && (
+        <Button variant="builder" onClick={onClick} className={styles.button}>
+          {buttonLabel}
+        </Button>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/CreatureBlock/CreatureBlock.tsx b/ddb_main/subApps/sheet/components/CreatureBlock/CreatureBlock.tsx
new file mode 100644
index 0000000..b58216c
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/CreatureBlock/CreatureBlock.tsx
@@ -0,0 +1,399 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, ReactNode } from "react";
+
+import {
+  Creature,
+  CreatureUtils,
+  ConditionUtils,
+  DamageAdjustmentContract,
+  FormatUtils,
+  RuleData,
+  CreatureAbilityInfo,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+
+import {
+  AbilityStatMentalList,
+  AbilityStatPhysicalList,
+  DDB_MEDIA_URL,
+  StatBlockTypeEnum,
+} from "../../../../constants";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  variant: "default" | "basic";
+  creature: Creature;
+  ruleData: RuleData;
+}
+
+export const CreatureBlock: FC<Props> = ({
+  variant = "default",
+  creature,
+  ruleData,
+  className = "",
+}) => {
+  const statBlockType = CreatureUtils.getStatBlockType(creature);
+  const isVersion2024 = statBlockType === StatBlockTypeEnum.CORE_RULES_2024;
+
+  const getDamageAdjustment = (
+    type: "vulnerability" | "resistance" | "immunity"
+  ): string | null => {
+    let damageAdjustments: Array<DamageAdjustmentContract> = [];
+
+    switch (type) {
+      case "vulnerability":
+        damageAdjustments = CreatureUtils.getDamageVulnerabilities(creature);
+        break;
+      case "resistance":
+        damageAdjustments = CreatureUtils.getDamageResistances(creature);
+        break;
+      case "immunity":
+        damageAdjustments = CreatureUtils.getDamageImmunities(creature);
+        break;
+      default:
+        break;
+    }
+
+    if (!damageAdjustments.length) {
+      return null;
+    } else {
+      return damageAdjustments
+        .map((damageAdjustment) => damageAdjustment.name)
+        .join(", ");
+    }
+  };
+
+  const renderSeparator = (): ReactNode => {
+    if (isVersion2024) {
+      return null;
+    }
+    //TODO not hard-code the src url here?
+    return (
+      <img
+        className={styles.separator}
+        alt=""
+        src={`${DDB_MEDIA_URL}/file-attachments/0/579/stat-block-header-bar.svg`}
+      />
+    );
+  };
+
+  const renderStatTable = (
+    stats: Array<CreatureAbilityInfo>,
+    type: "physical" | "mental"
+  ): ReactNode => {
+    return (
+      <table className={clsx([styles.statTable, styles[type]])}>
+        <thead>
+          <tr>
+            <th />
+            <th />
+            <th>Mod</th>
+            <th>Save</th>
+          </tr>
+        </thead>
+        <tbody>
+          {stats.map((stat) => {
+            return (
+              <tr key={stat.id}>
+                <th>{stat.statKey}</th>
+                <td>{stat.score}</td>
+                <td className={styles.modifier}>
+                  {FormatUtils.renderSignedNumber(stat.modifier)}
+                </td>
+                <td className={styles.modifier}>
+                  {FormatUtils.renderSignedNumber(stat.saveModifier)}
+                </td>
+              </tr>
+            );
+          })}
+        </tbody>
+      </table>
+    );
+  };
+
+  const renderStats = (): ReactNode => {
+    const stats = CreatureUtils.getAbilities(creature);
+
+    if (isVersion2024) {
+      const mentalStats: Array<CreatureAbilityInfo> = [];
+      const physicalStats: Array<CreatureAbilityInfo> = [];
+
+      stats.forEach((ability) => {
+        if (AbilityStatPhysicalList.includes(ability.id)) {
+          physicalStats.push(ability);
+        }
+        if (AbilityStatMentalList.includes(ability.id)) {
+          mentalStats.push(ability);
+        }
+      });
+      return (
+        <div className={styles.stats}>
+          {renderStatTable(physicalStats, "physical")}
+          {renderStatTable(mentalStats, "mental")}
+        </div>
+      );
+    }
+
+    return (
+      <div className={styles.stats}>
+        {stats.map((stat) => {
+          const statKey: string = stat.statKey ? stat.statKey : "";
+          const modifier: number = stat.modifier ? stat.modifier : 0;
+          const score: number | null = stat.score;
+
+          return (
+            <div className={styles.stat} key={statKey}>
+              <h2 className={styles.statHeading}>{statKey}</h2>
+              <p className={styles.statScore}>{score}</p>
+              <p className={styles.statModifier}>
+                ({FormatUtils.renderSignedNumber(modifier)})
+              </p>
+            </div>
+          );
+        })}
+      </div>
+    );
+  };
+
+  const renderActions = (): ReactNode => {
+    let groupActionNode: ReactNode;
+    const groupActionSnippet = CreatureUtils.getGroupActionSnippet(creature);
+    if (groupActionSnippet) {
+      groupActionNode = <HtmlContent html={groupActionSnippet} />;
+    }
+
+    let actionsNode: ReactNode;
+    const actionsDescription = CreatureUtils.getActionsDescription(creature);
+    if (actionsDescription) {
+      actionsNode = <HtmlContent html={actionsDescription} />;
+    }
+
+    const contentNode: ReactNode = (
+      <>
+        {groupActionNode}
+        {actionsNode}
+      </>
+    );
+
+    return renderDescription("Actions", contentNode);
+  };
+
+  const renderLegendaryActions = (): ReactNode => {
+    if (!CreatureUtils.canUseLegendaryActions(creature)) {
+      return null;
+    }
+
+    return renderDescription(
+      "Legendary Actions",
+      CreatureUtils.getLegendaryActionsDescription(creature)
+    );
+  };
+
+  const renderSpecialDescription = (): ReactNode => {
+    const groupInfo = CreatureUtils.getGroupInfo(creature);
+    let groupNode: ReactNode;
+
+    if (groupInfo?.specialQualityText) {
+      let groupTitle: ReactNode;
+      if (groupInfo.specialQualityTitle) {
+        groupTitle = (
+          <>
+            <strong>
+              <em>{groupInfo.specialQualityTitle}</em>
+            </strong>
+            .{" "}
+          </>
+        );
+      }
+      groupNode = (
+        <p>
+          {groupTitle}
+          {groupInfo.specialQualityText}
+        </p>
+      );
+    }
+
+    let monsterNode: ReactNode;
+    const monsterDescription =
+      CreatureUtils.getSpecialTraitsDescription(creature);
+    if (monsterDescription) {
+      monsterNode = <HtmlContent html={monsterDescription} />;
+    }
+
+    let contentNode: ReactNode = null;
+    if (monsterNode || groupNode) {
+      contentNode = (
+        <>
+          {monsterNode}
+          {groupNode}
+        </>
+      );
+    }
+
+    return renderDescription("Traits", contentNode);
+  };
+
+  const renderDescription = (
+    label: string | null,
+    description: ReactNode
+  ): ReactNode => {
+    if (!description) {
+      return null;
+    }
+
+    let descriptionNode: ReactNode;
+    if (typeof description === "string") {
+      descriptionNode = (
+        <HtmlContent className={styles.description} html={description} />
+      );
+    } else {
+      descriptionNode = <div className={styles.description}>{description}</div>;
+    }
+
+    return (
+      <>
+        {label && <h2 className={styles.descriptionHeading}>{label}</h2>}
+        {descriptionNode}
+      </>
+    );
+  };
+
+  const renderAttribute = (label: string, content: string | null) => {
+    if (!content) {
+      return null;
+    }
+    return (
+      <div className={styles.attribute}>
+        <h2 className={styles.attributeLabel}>{label}</h2>
+        <p>{content}</p>
+      </div>
+    );
+  };
+
+  const renderImmunities = (): ReactNode => {
+    const damageImmunities = getDamageAdjustment("immunity");
+    const conditionImmunities = CreatureUtils.getConditionImmunities(creature)
+      .map((condition) => ConditionUtils.getName(condition))
+      .join(", ");
+
+    if (!isVersion2024) {
+      if (!damageImmunities && !conditionImmunities) {
+        return null;
+      }
+
+      const immunityChunks: Array<string> = [];
+      if (damageImmunities) {
+        immunityChunks.push(damageImmunities);
+      }
+      if (conditionImmunities) {
+        immunityChunks.push(conditionImmunities);
+      }
+      return renderAttribute("Immunities", immunityChunks.join("; "));
+    }
+
+    return (
+      <>
+        {renderAttribute("Damage Immunities", damageImmunities)}
+        {renderAttribute("Condition Immunities", conditionImmunities)}
+      </>
+    );
+  };
+
+  return (
+    <section
+      className={clsx([
+        className,
+        styles.creatureBlock,
+        isVersion2024 && styles.v2024,
+      ])}
+    >
+      <h1 className={styles.header}>{CreatureUtils.getName(creature)}</h1>
+      <p className={styles.meta}>
+        {CreatureUtils.renderMetaText(creature, ruleData, variant === "basic")}
+      </p>
+      {renderSeparator()}
+      {renderAttribute(
+        isVersion2024 ? "AC" : "Armor Class",
+        CreatureUtils.renderArmorClass(creature)
+      )}
+      {renderAttribute(
+        "Initiative",
+        CreatureUtils.renderInitiativeInfo(creature)
+      )}
+      {renderAttribute(
+        isVersion2024 ? "HP" : "Hit Points",
+        CreatureUtils.renderHitPointInfo(creature)
+      )}
+      {renderAttribute(
+        "Speed",
+        CreatureUtils.renderSpeedInfo(creature, ruleData)
+      )}
+      {variant === "default" && (
+        <>
+          {renderSeparator()}
+          {renderStats()}
+          {renderSeparator()}
+        </>
+      )}
+      {variant === "default" && (
+        <>
+          {!isVersion2024 &&
+            renderAttribute(
+              "Saving Throws",
+              CreatureUtils.renderSavingThrows(creature)
+            )}
+          {renderAttribute(
+            "Skills",
+            CreatureUtils.renderSkills(creature, ruleData)
+          )}
+          {renderAttribute(
+            isVersion2024 ? "Vulnerabilities" : "Damage Vulnerabilities",
+            getDamageAdjustment("vulnerability")
+          )}
+          {renderAttribute(
+            isVersion2024 ? "Resistances" : "Damage Resistances",
+            getDamageAdjustment("resistance")
+          )}
+          {renderImmunities()}
+          {renderAttribute("Gear", CreatureUtils.getGear(creature))}
+          {renderAttribute(
+            "Senses",
+            CreatureUtils.renderSensesInfo(creature, ruleData)
+          )}
+          {renderAttribute(
+            "Languages",
+            CreatureUtils.renderLanguages(creature, ruleData)
+          )}
+        </>
+      )}
+      {renderAttribute(
+        isVersion2024 ? "CR" : "Challenge",
+        CreatureUtils.renderChallengeRatingInfo(creature)
+      )}
+      {variant === "default" && (
+        <>
+          {!isVersion2024 &&
+            renderAttribute(
+              "Proficiency Bonus",
+              CreatureUtils.renderProficiencyBonus(creature)
+            )}
+          {renderSeparator()}
+          <div className={styles.descriptions}>
+            {renderSpecialDescription()}
+            {renderActions()}
+            {renderDescription(
+              "Bonus Actions",
+              CreatureUtils.getBonusActionsDescription(creature)
+            )}
+            {renderDescription(
+              "Reactions",
+              CreatureUtils.getReactionsDescription(creature)
+            )}
+            {renderLegendaryActions()}
+          </div>
+        </>
+      )}
+    </section>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/FeatureSnippet/FeatureSnippet.tsx b/ddb_main/subApps/sheet/components/FeatureSnippet/FeatureSnippet.tsx
new file mode 100644
index 0000000..c7c7eff
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/FeatureSnippet/FeatureSnippet.tsx
@@ -0,0 +1,285 @@
+import { keyBy } from "lodash";
+import React from "react";
+
+import { Snippet } from "@dndbeyond/character-components/es";
+import {
+  AbilityLookup,
+  BaseSpell,
+  BaseFeat,
+  Choice,
+  ChoiceUtils,
+  ClassDefinitionContract,
+  Constants,
+  DataOriginBaseAction,
+  DataOriginRefData,
+  InfusionChoice,
+  LevelScaleContract,
+  Option,
+  OptionUtils,
+  RuleData,
+  RuleDataUtils,
+  SnippetData,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Reference } from "~/components/Reference";
+import FeatureSnippetActions from "~/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetActions";
+import FeatureSnippetChoices from "~/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetChoices";
+import FeatureSnippetInfusionChoices from "~/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetInfusionChoices";
+import FeatureSnippetOption from "~/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetOption";
+import FeatureSnippetSpells from "~/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetSpells";
+
+import styles from "./styles.module.css";
+
+//TODO: tools/js/CharacterSheet/components/FeatureSnipper components still need to be gradually migrated to FC
+interface Props {
+  heading: React.ReactNode;
+  dataOriginExtra?: string;
+  extraMeta: Array<string>;
+  className: string;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  sourceId: number | null;
+  sourcePage: number | null;
+
+  spells: Array<BaseSpell>;
+  feats: Array<BaseFeat>;
+  actions: Array<DataOriginBaseAction>;
+  options: Array<Option>;
+  choices: Array<Choice>;
+  infusionChoices?: Array<InfusionChoice>;
+  dataOriginRefData: DataOriginRefData;
+
+  levelScale?: LevelScaleContract | null;
+  classLevel?: number;
+  subclass?: ClassDefinitionContract | null;
+
+  onActionClick?: (action: DataOriginBaseAction) => void;
+  onActionUseSet?: (action: DataOriginBaseAction, uses: number) => void;
+  onSpellClick?: (spell: BaseSpell) => void;
+  onSpellUseSet?: (spell: BaseSpell, uses: number) => void;
+  onFeatureClick: () => void;
+  onInfusionChoiceClick?: (infusionChoice: InfusionChoice) => void;
+
+  showHeader?: boolean;
+  showDescription?: boolean;
+
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+
+export const FeatureSnippet: React.FC<Props> = ({
+  heading,
+  dataOriginExtra,
+  extraMeta = [],
+  choices,
+  actions,
+  spells,
+  infusionChoices = [],
+  className,
+  snippetData,
+  sourceId,
+  sourcePage,
+  classLevel,
+  levelScale,
+  children,
+  abilityLookup,
+  ruleData,
+  subclass,
+  options,
+  feats,
+  dataOriginRefData,
+  onActionUseSet,
+  onActionClick,
+  onSpellClick,
+  onSpellUseSet,
+  onInfusionChoiceClick,
+  onFeatureClick,
+  showHeader = true,
+  showDescription = false,
+  isReadonly,
+  proficiencyBonus,
+  theme,
+}) => {
+  const handleFeatureClick = (evt: React.MouseEvent): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    if (onFeatureClick) {
+      onFeatureClick();
+    }
+  };
+
+  const getNonChoiceOptions = (): Array<Option> => {
+    let optionLookup = keyBy(options, (option) => OptionUtils.getId(option));
+    let usedOptionIds: Array<number> = [];
+
+    choices.forEach((choice) => {
+      const type = ChoiceUtils.getType(choice);
+      const optionValue = ChoiceUtils.getOptionValue(choice);
+
+      switch (type) {
+        case Constants.BuilderChoiceTypeEnum.RACIAL_TRAIT_OPTION:
+        case Constants.BuilderChoiceTypeEnum.FEAT_OPTION:
+        case Constants.BuilderChoiceTypeEnum.FEATURE_OPTION:
+          if (optionValue !== null && optionLookup[optionValue]) {
+            usedOptionIds.push(optionValue);
+          }
+          break;
+      }
+    });
+
+    return options.filter(
+      (option) => !usedOptionIds.includes(OptionUtils.getId(option))
+    );
+  };
+
+  const nonChoiceOptions = getNonChoiceOptions();
+  const classNames = [styles.snippet, className];
+  const metaItems: Array<React.ReactNode> = [];
+
+  if (levelScale) {
+    metaItems.push(
+      <span className={styles.levelScale}>{levelScale.description}</span>
+    );
+  }
+
+  metaItems.push(...extraMeta);
+
+  const sourceDataLookup = RuleDataUtils.getSourceDataLookup(ruleData);
+
+  if (sourceId) {
+    metaItems.push(
+      <Reference name={sourceDataLookup[sourceId]?.name} page={sourcePage} />
+    );
+  }
+
+  return (
+    <div className={classNames.join(" ")} onClick={handleFeatureClick}>
+      {showHeader && (
+        <div
+          className={`${styles.heading} ${
+            theme?.isDarkMode ? styles.headingDarkMode : ""
+          }`}
+        >
+          {heading}
+          <span className={styles.meta}>
+            {metaItems.map((metaItem, idx) => (
+              <span
+                className={`${styles.metaItem} ${
+                  theme?.isDarkMode ? styles.metaItemDarkMode : ""
+                }`}
+                key={idx}
+              >
+                {metaItem}
+              </span>
+            ))}
+          </span>
+          {dataOriginExtra && dataOriginExtra !== "Unknown" && (
+            <div>
+              <span className={styles.origin}>
+                <span className={styles.originLabel}>From</span>
+                <span className={styles.originName}>{dataOriginExtra}</span>
+              </span>
+            </div>
+          )}
+        </div>
+      )}
+      <div className={styles.content}>
+        <Snippet
+          snippetData={snippetData}
+          levelScale={levelScale}
+          classLevel={classLevel}
+          parseSnippet={!showDescription}
+          proficiencyBonus={proficiencyBonus}
+          theme={theme}
+        >
+          {children}
+        </Snippet>
+      </div>
+      {(choices.length > 0 ||
+        actions.length > 0 ||
+        spells.length > 0 ||
+        nonChoiceOptions.length > 0) && (
+        <div
+          className={styles.extra}
+          style={
+            theme?.isDarkMode ? { borderColor: theme.themeColor } : undefined
+          }
+        >
+          <FeatureSnippetChoices
+            choices={choices}
+            options={options}
+            onSpellClick={onSpellClick}
+            onSpellUseSet={onSpellUseSet}
+            onActionUseSet={onActionUseSet}
+            onActionClick={onActionClick}
+            ruleData={ruleData}
+            abilityLookup={abilityLookup}
+            subclass={subclass}
+            feats={feats}
+            sourceDataLookup={sourceDataLookup}
+            classLevel={classLevel}
+            snippetData={snippetData}
+            dataOriginRefData={dataOriginRefData}
+            showDescription={showDescription}
+            isInteractive={!isReadonly}
+            proficiencyBonus={proficiencyBonus}
+            theme={theme}
+          />
+          <FeatureSnippetActions
+            actions={actions}
+            abilityLookup={abilityLookup}
+            ruleData={ruleData}
+            onActionClick={onActionClick}
+            onActionUseSet={onActionUseSet}
+            isInteractive={!isReadonly}
+            proficiencyBonus={proficiencyBonus}
+            theme={theme}
+          />
+          <FeatureSnippetSpells
+            spells={spells}
+            abilityLookup={abilityLookup}
+            ruleData={ruleData}
+            onSpellClick={onSpellClick}
+            onSpellUseSet={onSpellUseSet}
+            isInteractive={!isReadonly}
+            dataOriginRefData={dataOriginRefData}
+            proficiencyBonus={proficiencyBonus}
+            theme={theme}
+          />
+          {nonChoiceOptions.length > 0 && (
+            <div className={styles.options}>
+              {nonChoiceOptions.map((option) => (
+                <FeatureSnippetOption
+                  key={OptionUtils.getId(option)}
+                  option={option}
+                  onSpellClick={onSpellClick}
+                  onSpellUseSet={onSpellUseSet}
+                  onActionUseSet={onActionUseSet}
+                  onActionClick={onActionClick}
+                  abilityLookup={abilityLookup}
+                  ruleData={ruleData}
+                  sourceDataLookup={sourceDataLookup}
+                  classLevel={classLevel}
+                  snippetData={snippetData}
+                  showDescription={showDescription}
+                  isInteractive={!isReadonly}
+                  dataOriginRefData={dataOriginRefData}
+                  proficiencyBonus={proficiencyBonus}
+                  theme={theme}
+                />
+              ))}
+            </div>
+          )}
+          <FeatureSnippetInfusionChoices
+            infusionChoices={infusionChoices}
+            onInfusionChoiceClick={onInfusionChoiceClick}
+          />
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/HitPointsBox/DeathSummary/DeathSummary.tsx b/ddb_main/subApps/sheet/components/HitPointsBox/DeathSummary/DeathSummary.tsx
new file mode 100644
index 0000000..7930f71
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/HitPointsBox/DeathSummary/DeathSummary.tsx
@@ -0,0 +1,104 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import { Constants } from "@dndbeyond/character-rules-engine";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {}
+
+export const DeathSummary: FC<Props> = ({ className, onClick, ...props }) => {
+  const { deathSaveInfo, ruleData, ruleDataUtils, deathCause, characterTheme } =
+    useCharacterEngine();
+
+  const renderDeathSavesSummaryMarkGroup = (
+    key: string,
+    label: string,
+    activeCount: number,
+    totalCount: number,
+    isDarkMode: boolean
+  ): React.ReactNode => {
+    let marks: Array<React.ReactNode> = [];
+    for (let i = 0; i < totalCount; i++) {
+      marks.push(
+        <span
+          key={`${key}-${i}`}
+          className={clsx([
+            styles.mark,
+            i < activeCount ? styles[`activeMark-${key}`] : styles.inactiveMark,
+            isDarkMode &&
+              i < activeCount &&
+              styles[`activeMarkDarkMode-${key}`],
+          ])}
+        />
+      );
+    }
+
+    return (
+      <div className={styles.group}>
+        <h2 className={styles.label}>{label}</h2>
+        <span className={styles.marks}>{marks}</span>
+      </div>
+    );
+  };
+
+  return (
+    <>
+      {/* If the death cause is exhaustion, render the exhaustion summary. Otherwise, render the death saves summary. */}
+      {deathCause === Constants.DeathCauseEnum.CONDITION ? (
+        <div
+          className={clsx([styles.container, className])}
+          onClick={onClick}
+          {...props}
+        >
+          <div className={styles.exhaustion}>
+            <div
+              className={clsx([
+                styles.icon,
+                characterTheme.isDarkMode && styles.iconDarkMode,
+              ])}
+            />
+            <h2 className={clsx([styles.label, styles.exhaustionLabel])}>
+              Exhaustion Level 6
+            </h2>
+          </div>
+          <h1 className={styles.deathLabel}>Death</h1>
+        </div>
+      ) : (
+        <div
+          className={clsx([styles.container, className])}
+          onClick={onClick}
+          {...props}
+        >
+          <div className={styles.deathSaves}>
+            <div
+              className={clsx([
+                styles.icon,
+                characterTheme.isDarkMode && styles.iconDarkMode,
+              ])}
+            />
+            <div className={styles.markGroupsContainer}>
+              {renderDeathSavesSummaryMarkGroup(
+                "fail",
+                "Failure",
+                deathSaveInfo.failCount,
+                ruleDataUtils.getMaxDeathsavesFail(ruleData),
+                characterTheme.isDarkMode
+              )}
+              {renderDeathSavesSummaryMarkGroup(
+                "success",
+                "Success",
+                deathSaveInfo.successCount,
+                ruleDataUtils.getMaxDeathsavesSuccess(ruleData),
+                characterTheme.isDarkMode
+              )}
+            </div>
+          </div>
+          <h1 className={styles.deathLabel}>Death Saves</h1>
+        </div>
+      )}
+    </>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/HitPointsBox/HitPointsBox.tsx b/ddb_main/subApps/sheet/components/HitPointsBox/HitPointsBox.tsx
new file mode 100644
index 0000000..983e4de
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/HitPointsBox/HitPointsBox.tsx
@@ -0,0 +1,62 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+import { useSelector } from "react-redux";
+
+import {
+  BeveledBoxSvg317x89,
+  BoxBackground,
+} from "@dndbeyond/character-components/es";
+import { Constants } from "@dndbeyond/character-rules-engine";
+
+import { useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+
+import { PaneComponentEnum } from "../Sidebar/types";
+import { DeathSummary } from "./DeathSummary";
+import { HitPointsQuickAdjust } from "./HitPointsQuickAdjust";
+import { HitPointsSummary } from "./HitPointsSummary";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {}
+
+export const HitPointsBox: FC<Props> = ({ className, ...props }) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+
+  const { hpInfo, deathCause, characterTheme } = useCharacterEngine();
+
+  const onClick = (evt: React.MouseEvent): void => {
+    if (!isReadonly) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      paneHistoryStart(PaneComponentEnum.HEALTH_MANAGE);
+    }
+  };
+
+  return (
+    <div
+      className={clsx([styles.hitPointsBox, className])}
+      onClick={onClick}
+      {...props}
+    >
+      <BoxBackground
+        StyleComponent={BeveledBoxSvg317x89}
+        theme={characterTheme}
+      />
+      {deathCause === Constants.DeathCauseEnum.CONDITION ||
+      hpInfo.remainingHp <= 0 ? (
+        <DeathSummary />
+      ) : (
+        <div className={styles.content}>
+          <h1 className={styles.label}>Hit Points</h1>
+          <HitPointsQuickAdjust />
+          <HitPointsSummary hpInfo={hpInfo} />
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/HitPointsBox/HitPointsQuickAdjust/HitPointsQuickAdjust.tsx b/ddb_main/subApps/sheet/components/HitPointsBox/HitPointsQuickAdjust/HitPointsQuickAdjust.tsx
new file mode 100644
index 0000000..ceec648
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/HitPointsBox/HitPointsQuickAdjust/HitPointsQuickAdjust.tsx
@@ -0,0 +1,136 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useEffect, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import { Button } from "~/components/Button";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useUnpropagatedClick } from "~/hooks/useUnpropagatedClick";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+
+import { HP_DAMAGE_TAKEN_VALUE } from "../../../constants";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement | HTMLButtonElement> {}
+
+export const HitPointsQuickAdjust: FC<Props> = ({ className, ...props }) => {
+  const dispatch = useDispatch();
+
+  const { hpInfo, characterActions, characterUtils, helperUtils } =
+    useCharacterEngine();
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+
+  const [adjustmentValue, setAdjustmentValue] = useState<number | null>(null);
+  const [isFocused, setIsFocused] = useState(false);
+  const [isHovered, setIsHovered] = useState(false);
+
+  const adjustHitPoints = (adjustmentSign: number): void => {
+    const difference = adjustmentSign * (adjustmentValue ?? 0);
+
+    const { newTemp, newRemovedHp } = characterUtils.calculateHitPoints(
+      hpInfo,
+      difference
+    );
+
+    dispatch(characterActions.hitPointsSet(newRemovedHp, newTemp));
+
+    setAdjustmentValue(null);
+    setIsHovered(false);
+  };
+
+  const onHealClick = useUnpropagatedClick(() => {
+    adjustHitPoints(1);
+  });
+
+  const onDamageClick = useUnpropagatedClick(() => {
+    adjustHitPoints(-1);
+  });
+
+  const onFocus = (): void => {
+    setIsFocused(true);
+  };
+
+  const onMouseEnter = (): void => {
+    setIsHovered(true);
+  };
+
+  const onMouseLeave = (): void => {
+    setIsHovered(false);
+  };
+
+  const onBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    setAdjustmentValue(helperUtils.parseInputInt(evt.target.value));
+    setIsFocused(false);
+  };
+
+  const onChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    setAdjustmentValue(helperUtils.parseInputInt(evt.target.value));
+  };
+
+  const onWheel = (evt: WheelEvent): void => {
+    if (isHovered || isFocused) {
+      evt.preventDefault();
+      let direction = evt.deltaY < 0 ? 1 : -1;
+      if (!isReadonly) {
+        let newValue = (adjustmentValue ?? 0) + direction;
+        newValue = helperUtils.clampInt(newValue ?? 0, 0, hpInfo.totalHp * 2);
+        setAdjustmentValue(newValue);
+      }
+    }
+  };
+
+  const onScroll = (evt: Event): void => {
+    if (isHovered || isFocused) {
+      evt.preventDefault();
+    }
+  };
+
+  useEffect(() => {
+    window.addEventListener("wheel", onWheel, { passive: false });
+    window.addEventListener("scroll", onScroll);
+    return () => {
+      window.removeEventListener("wheel", onWheel);
+      window.removeEventListener("scroll", onScroll);
+    };
+  });
+
+  return (
+    <div className={clsx([styles.container, className])} {...props}>
+      <Button
+        size="xx-small"
+        variant="outline"
+        themed
+        disabled={isReadonly}
+        onClick={onHealClick}
+        className={clsx([styles.button, styles.heal])}
+      >
+        Heal
+      </Button>
+      <input
+        className={styles.input}
+        data-testid="hp-adjust-input"
+        type="number"
+        aria-label="Hit Points Adjustment"
+        value={adjustmentValue ?? ""}
+        min={HP_DAMAGE_TAKEN_VALUE.MIN}
+        max={HP_DAMAGE_TAKEN_VALUE.MAX}
+        onClick={useUnpropagatedClick()}
+        onFocus={onFocus}
+        onMouseEnter={onMouseEnter}
+        onMouseLeave={onMouseLeave}
+        onChange={onChange}
+        onBlur={onBlur}
+        readOnly={isReadonly}
+      />
+      <Button
+        size="xx-small"
+        variant="outline"
+        themed
+        disabled={isReadonly}
+        onClick={onDamageClick}
+        className={clsx([styles.button, styles.damage])}
+      >
+        Damage
+      </Button>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/HitPointsBox/HitPointsSummary/HitPointsSummary.tsx b/ddb_main/subApps/sheet/components/HitPointsBox/HitPointsSummary/HitPointsSummary.tsx
new file mode 100644
index 0000000..c707fc7
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/HitPointsBox/HitPointsSummary/HitPointsSummary.tsx
@@ -0,0 +1,353 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useEffect, useState, useRef } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import { v4 as uuidv4 } from "uuid";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import accessibility from "~/styles/accessibility.module.css";
+import { HP_TEMP_VALUE } from "~/subApps/sheet/constants";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+import { CharacterHitPointInfo, Creature, HitPointInfo } from "~/types";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  hpInfo: CharacterHitPointInfo | HitPointInfo;
+  creature?: Creature;
+  showOriginalMax?: boolean;
+  showPermanentInputs?: boolean;
+}
+
+export const HitPointsSummary: FC<Props> = ({
+  hpInfo,
+  creature,
+  showOriginalMax = false,
+  showPermanentInputs = false,
+  className,
+  ...props
+}) => {
+  // TODO This hitpoints summary doesn't work as a generic component for vehicles yet. Works for creatures and characters.
+
+  const { characterActions, creatureUtils, helperUtils } = useCharacterEngine();
+
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+
+  const [isCurrentEditorVisible, setIsCurrentEditorVisible] = useState(false);
+  const [isTempEditorVisible, setIsTempEditorVisible] = useState(false);
+  const [currentValue, setCurrentValue] = useState<number | null>(
+    hpInfo.remainingHp
+  );
+  const [tempValue, setTempValue] = useState<number | null>(hpInfo.tempHp);
+  const [isMaxDifferent, setIsMaxDifferent] = useState<boolean>(false);
+
+  const currentEditorRef = useRef<HTMLInputElement | null>(null);
+  const tempEditorRef = useRef<HTMLInputElement | null>(null);
+
+  const currentId = uuidv4();
+  const tempId = uuidv4();
+
+  const dispatch = useDispatch();
+
+  /* --- Current hit point functions --- */
+
+  const onCurrentInputChange = (
+    evt: React.ChangeEvent<HTMLInputElement>
+  ): void => {
+    setCurrentValue(helperUtils.parseInputInt(evt.target.value));
+  };
+
+  const onCurrentInputClick = (
+    evt: React.MouseEvent<HTMLInputElement>
+  ): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+  };
+
+  const onCurrentClick = (evt: React.MouseEvent<HTMLButtonElement>): void => {
+    if (!isReadonly) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      setIsCurrentEditorVisible(true);
+    }
+  };
+
+  const dispatchCurrentHp = (value: number | null) => {
+    if (value === null) {
+      value = hpInfo.remainingHp;
+    } else {
+      let newRemovedAmount = hpInfo.totalHp - value;
+      newRemovedAmount = helperUtils.clampInt(
+        newRemovedAmount,
+        0,
+        hpInfo.totalHp
+      );
+      value = hpInfo.totalHp - newRemovedAmount;
+      if (newRemovedAmount !== hpInfo.removedHp) {
+        creature
+          ? dispatch(
+              characterActions.creatureHitPointsSet(
+                creatureUtils.getMappingId(creature),
+                newRemovedAmount,
+                hpInfo.tempHp ?? HP_TEMP_VALUE.MIN
+              )
+            )
+          : dispatch(
+              characterActions.hitPointsSet(
+                newRemovedAmount,
+                hpInfo.tempHp ?? HP_TEMP_VALUE.MIN
+              )
+            );
+      }
+    }
+    setCurrentValue(value);
+    setIsCurrentEditorVisible(false);
+  };
+
+  const onCurrentInputBlur = (
+    evt: React.FocusEvent<HTMLInputElement>
+  ): void => {
+    let current: number | null = helperUtils.parseInputInt(evt.target.value);
+    dispatchCurrentHp(current);
+  };
+
+  const onCurrentInputEnter = (
+    evt: React.KeyboardEvent<HTMLInputElement>
+  ): void => {
+    if (evt.key === "Enter") {
+      let current: number | null = helperUtils.parseInputInt(
+        evt.currentTarget.value
+      );
+      dispatchCurrentHp(current);
+    }
+  };
+
+  /* --- Temp hit point functions --- */
+
+  const onTempInputClick = (evt: React.MouseEvent<HTMLInputElement>): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+  };
+
+  const onTempClick = (evt: React.MouseEvent<HTMLButtonElement>): void => {
+    if (!isReadonly) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      setIsTempEditorVisible(true);
+    }
+  };
+
+  const onTempInputChange = (
+    evt: React.ChangeEvent<HTMLInputElement>
+  ): void => {
+    setTempValue(helperUtils.parseInputInt(evt.target.value));
+  };
+
+  const dispatchTempHp = (value: number | null) => {
+    if (value === null) {
+      value = hpInfo.tempHp;
+    } else {
+      value = helperUtils.clampInt(value, HP_TEMP_VALUE.MIN, HP_TEMP_VALUE.MAX);
+      if (value !== hpInfo.tempHp) {
+        creature
+          ? dispatch(
+              characterActions.creatureHitPointsSet(
+                creatureUtils.getMappingId(creature),
+                hpInfo.removedHp,
+                value
+              )
+            )
+          : dispatch(characterActions.hitPointsSet(hpInfo.removedHp, value));
+      }
+    }
+    setTempValue(value);
+    setIsTempEditorVisible(false);
+  };
+
+  const onTempInputBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    let temp: number | null = helperUtils.parseInputInt(evt.target.value);
+    dispatchTempHp(temp);
+  };
+
+  const onTempInputEnter = (
+    evt: React.KeyboardEvent<HTMLInputElement>
+  ): void => {
+    if (evt.key === "Enter") {
+      let temp: number | null = helperUtils.parseInputInt(
+        evt.currentTarget.value
+      );
+      dispatchTempHp(temp);
+    }
+  };
+
+  /* --- useEffects --- */
+
+  useEffect(() => {
+    if (isTempEditorVisible) {
+      tempEditorRef.current?.focus();
+    }
+  }, [isTempEditorVisible]);
+
+  useEffect(() => {
+    if (isCurrentEditorVisible) {
+      currentEditorRef.current?.focus();
+    }
+  }, [isCurrentEditorVisible]);
+
+  useEffect(() => {
+    setCurrentValue(hpInfo.remainingHp);
+  }, [hpInfo.remainingHp]);
+
+  useEffect(() => {
+    setTempValue(hpInfo.tempHp);
+  }, [hpInfo.tempHp]);
+
+  useEffect(() => {
+    if (showOriginalMax && (hpInfo.overrideHp || hpInfo.bonusHp)) {
+      setIsMaxDifferent(true);
+    } else {
+      setIsMaxDifferent(false);
+    }
+  }, [hpInfo.overrideHp, hpInfo.bonusHp, showOriginalMax]);
+
+  /* --- Render Functions --- */
+
+  const renderTempHitPoints = (): React.ReactNode => {
+    if (isTempEditorVisible || showPermanentInputs) {
+      return (
+        <div>
+          <input
+            data-testid="temp-hp-input"
+            id={tempId}
+            ref={tempEditorRef}
+            className={styles.input}
+            type="number"
+            value={tempValue ?? ""}
+            min={HP_TEMP_VALUE.MIN}
+            max={HP_TEMP_VALUE.MAX}
+            onChange={onTempInputChange}
+            onBlur={onTempInputBlur}
+            onClick={onTempInputClick}
+            onKeyDown={onTempInputEnter}
+          />
+        </div>
+      );
+    }
+
+    if (!tempValue) {
+      return (
+        <button
+          id={tempId}
+          className={clsx([
+            styles.valueButton,
+            styles.tempEmpty,
+            styles.number,
+          ])}
+          onClick={onTempClick}
+        >
+          --
+        </button>
+      );
+    }
+
+    return (
+      <button
+        id={tempId}
+        className={clsx([styles.valueButton, styles.number])}
+        onClick={onTempClick}
+      >
+        {tempValue}
+      </button>
+    );
+  };
+
+  return (
+    <div className={clsx([styles.container, className])} {...props}>
+      <div className={styles.innerContainer}>
+        <div className={styles.item}>
+          <label
+            htmlFor={currentId}
+            className={styles.label}
+            aria-label={`Current hit points ${currentValue}, change current hit points`}
+          >
+            Current
+          </label>
+          {isCurrentEditorVisible || showPermanentInputs ? (
+            <div>
+              <input
+                data-testid="current-hp-input"
+                id={currentId}
+                ref={currentEditorRef}
+                className={styles.input}
+                type="number"
+                value={currentValue ?? ""}
+                min={0}
+                max={hpInfo.totalHp}
+                onChange={onCurrentInputChange}
+                onBlur={onCurrentInputBlur}
+                onClick={onCurrentInputClick}
+                onKeyDown={onCurrentInputEnter}
+              />
+            </div>
+          ) : (
+            <button
+              id={currentId}
+              className={clsx([styles.valueButton, styles.number])}
+              onClick={onCurrentClick}
+            >
+              {currentValue}
+            </button>
+          )}
+        </div>
+        <div className={styles.item}>
+          <div className={styles.spacer} />
+          <span className={clsx([styles.number, styles.slash])}>/</span>
+        </div>
+        <div className={styles.item}>
+          <span className={styles.label} aria-hidden="true">
+            Max
+          </span>
+          <span
+            className={accessibility.screenreaderOnly}
+          >{`Max hit points`}</span>
+          <div className={clsx([styles.number, styles.maxContainer])}>
+            <span
+              data-testid="max-hp"
+              className={clsx([
+                styles.max,
+                isMaxDifferent &&
+                  "baseTotalHp" in hpInfo &&
+                  (hpInfo.totalHp - hpInfo.baseTotalHp > 0
+                    ? styles.positive
+                    : styles.negative),
+              ])}
+            >
+              {hpInfo.totalHp}
+            </span>
+            {isMaxDifferent && "baseTotalHp" in hpInfo && (
+              <span
+                data-testid="origin-max-hp"
+                className={clsx([styles.originalMax])}
+              >
+                ({hpInfo.baseTotalHp})
+              </span>
+            )}
+          </div>
+        </div>
+      </div>
+      <div className={clsx([styles.item, styles.temp])}>
+        <label
+          htmlFor={tempId}
+          aria-label={
+            !tempValue
+              ? "Temporary hit points 0, set temporary hit points"
+              : `Temporary hit points ${tempValue}, change temporary hit points`
+          }
+          className={styles.label}
+        >
+          Temp
+        </label>
+        {renderTempHitPoints()}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/InitiativeBox/InitiativeBox.tsx b/ddb_main/subApps/sheet/components/InitiativeBox/InitiativeBox.tsx
new file mode 100644
index 0000000..c6a5f44
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/InitiativeBox/InitiativeBox.tsx
@@ -0,0 +1,121 @@
+import { visuallyHidden } from "@mui/utils";
+import clsx from "clsx";
+import { FC, HTMLAttributes, useContext } from "react";
+import { useSelector } from "react-redux";
+import {
+  AdvantageIcon,
+  BoxBackground,
+  DigitalDiceWrapper,
+  InitiativeBoxSvg,
+} from "@dndbeyond/character-components/es";
+import { DiceTools, RollKind, RollType } from "@dndbeyond/dice";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+import { useSidebar } from "~/contexts/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "~/tools/js/Shared/selectors";
+import { isNotNullOrUndefined } from "~/tools/js/Shared/utils/TypeScript/utils";
+import { PaneComponentEnum } from "../Sidebar/types";
+import styles from "./styles.module.css";
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  isMobile?: boolean;
+  isTablet?: boolean;
+}
+export const InitiativeBox: FC<Props> = ({ isMobile, isTablet, ...props }) => {
+  const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+    useContext(GameLogContext);
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  const handleClick = (evt: React.MouseEvent): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    paneHistoryStart(PaneComponentEnum.INITIATIVE);
+  };
+
+  const {
+    hasInitiativeAdvantage,
+    processedInitiative: initiative,
+    characterTheme: theme,
+  } = useCharacterEngine();
+  const { isDarkMode } = useCharacterTheme();
+
+  const diceEnabled = useSelector(appEnvSelectors.getDiceEnabled);
+  const rollContext = useSelector(
+    characterRollContextSelectors.getCharacterRollContext
+  );
+
+  return (
+    <section
+      className={clsx([isMobile ? styles.boxMobile : styles.box])}
+      onClick={handleClick}
+      {...props}
+    >
+      {!isMobile && (
+        <div
+          className={clsx([
+            styles.label,
+            isDarkMode && !isTablet && styles.dark,
+          ])}
+          data-testid="combat-initiative-label"
+        >
+          Initiative
+        </div>
+      )}
+      <div className={isMobile ? styles.valueMobile : styles.value}>
+        {!isMobile && (
+          <>
+            <BoxBackground StyleComponent={InitiativeBoxSvg} theme={theme} />
+            <h2 style={visuallyHidden}>Initiative</h2>
+          </>
+        )}
+        
+        <DigitalDiceWrapper
+          diceNotation={DiceTools.CustomD20(initiative)}
+          rollType={RollType.Roll}
+          rollAction={"Initiative"}
+          rollKind={hasInitiativeAdvantage ? RollKind.Advantage : RollKind.None}
+          diceEnabled={diceEnabled}
+          themeColor={theme.themeColor}
+          rollContext={rollContext}
+          rollTargetOptions={
+            messageTargetOptions?.entities
+              ? Object.values(messageTargetOptions?.entities).filter(
+                  isNotNullOrUndefined
+                )
+              : undefined
+          }
+          rollTargetDefault={defaultMessageTargetOption}
+          userId={Number(userId)}
+        >
+          <NumberDisplay
+              number={initiative}
+              type="signed"
+              size="large"
+              className={clsx([
+                isMobile && !theme.isDarkMode && styles.numberColorOverride,
+              ])}
+          />
+        </DigitalDiceWrapper>
+      </div>
+      {hasInitiativeAdvantage && (
+        <div
+          className={clsx([styles.advantage, isMobile && styles.mobile])}
+          aria-label="Has advantage on initiative"
+        >
+          <AdvantageIcon
+            theme={theme}
+            className={styles.advantageIcon}
+            title={"Advantage on Initiative"}
+          />
+        </div>
+      )}
+      {isMobile && <div className={styles.labelMobile}>Initiative</div>}
+    </section>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Inspiration/Inspiration.tsx b/ddb_main/subApps/sheet/components/Inspiration/Inspiration.tsx
new file mode 100644
index 0000000..299128e
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Inspiration/Inspiration.tsx
@@ -0,0 +1,92 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import {
+  BoxBackground,
+  InspirationBoxSvg,
+  InspirationTokenSvg,
+} from "@dndbeyond/character-components/es";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  inspiration: boolean;
+  onToggle?: () => void;
+  onClick?: () => void;
+  isInteractive: boolean;
+  isMobile?: boolean;
+}
+export const Inspiration: FC<Props> = ({
+  inspiration,
+  onClick,
+  onToggle,
+  isInteractive,
+  isMobile,
+  ...props
+}) => {
+  const { characterTheme: theme } = useCharacterEngine();
+
+  const inspirationText = "Heroic Inspiration";
+
+  const handleToggleClick = (evt: React.MouseEvent): void => {
+    if (onToggle && isInteractive) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onToggle();
+    }
+  };
+
+  const handleClick = (evt: React.MouseEvent): void => {
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  if (isMobile) {
+    return (
+      <div className={styles.mobileWrapper} {...props}>
+        <div
+          className={clsx([
+            styles.mobileButton,
+            inspiration && styles.active,
+            isInteractive && styles.interactive,
+          ])}
+          onClick={handleToggleClick}
+          role="checkbox"
+          aria-checked={!!inspiration}
+          data-testid="inspiration"
+        >
+          {inspirationText}
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div onClick={handleClick} {...props}>
+      <div
+        className={clsx([styles.box, isInteractive && styles.interactive])}
+        onClick={handleToggleClick}
+        role="checkbox"
+        aria-checked={!!inspiration}
+        data-testid="inspiration"
+      >
+        <BoxBackground StyleComponent={InspirationBoxSvg} theme={theme} />
+        <div className={styles.status}>
+          {inspiration && <InspirationTokenSvg theme={theme} />}
+        </div>
+      </div>
+      <div
+        className={clsx([styles.label, theme.isDarkMode && styles.dark])}
+        onClick={handleClick}
+        data-testid="inspiration-label"
+      >
+        {inspirationText}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/MobileNav/MobileNav.tsx b/ddb_main/subApps/sheet/components/MobileNav/MobileNav.tsx
new file mode 100644
index 0000000..0d30067
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/MobileNav/MobileNav.tsx
@@ -0,0 +1,70 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, type MouseEvent } from "react";
+import { createPortal } from "react-dom";
+
+import GridIcon from "@dndbeyond/fontawesome-cache/svgs/solid/grid.svg";
+import { useIsVisible } from "@dndbeyond/ttui/hooks/useIsVisible";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { useUnpropagatedClick } from "~/hooks/useUnpropagatedClick";
+
+import { sidebarId } from "../../constants";
+import { ArrowsLeftIcon } from "../Sidebar/svgs/ArrowsLeftIcon";
+import { ArrowsRightIcon } from "../Sidebar/svgs/ArrowsRightIcon";
+import { SectionMenu } from "./SectionMenu";
+import styles from "./styles.module.css";
+
+export interface MobileNavProps extends HTMLAttributes<HTMLDivElement> {}
+
+export const MobileNav: FC<MobileNavProps> = ({ className, ...props }) => {
+  const {
+    ref,
+    isVisible: isMenuVisible,
+    setIsVisible: setIsMenuVisible,
+  } = useIsVisible(false);
+  const { sidebar } = useSidebar();
+
+  const handleToggleSidebar = useUnpropagatedClick(() => {
+    setIsMenuVisible(false);
+    sidebar.setIsVisible(!sidebar.isVisible);
+  });
+
+  const handleToggleMenu = () => {
+    setIsMenuVisible(!isMenuVisible);
+  };
+
+  const handleCloseMenu = (e?: MouseEvent) => {
+    e?.stopPropagation();
+    setIsMenuVisible(false);
+  };
+
+  return createPortal(
+    <div className={clsx([styles.mobileNav, className])} ref={ref} {...props}>
+      {!sidebar.isVisible && (
+        <div>
+          <button
+            className={styles.navToggle}
+            onClick={handleToggleMenu}
+            aria-label="Show navigation"
+          >
+            <GridIcon className={styles.icon} />
+          </button>
+          <SectionMenu open={isMenuVisible} onClose={handleCloseMenu} />
+        </div>
+      )}
+      <button
+        className={styles.sidebarToggle}
+        onClick={handleToggleSidebar}
+        aria-controls={sidebarId}
+        aria-label={`${sidebar.isVisible ? "Hide" : "Show"} sidebar`}
+      >
+        {sidebar.isVisible ? (
+          <ArrowsRightIcon className={styles.icon} />
+        ) : (
+          <ArrowsLeftIcon className={styles.icon} />
+        )}
+      </button>
+    </div>,
+    document.body
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/MobileNav/SectionButton/SectionButton.tsx b/ddb_main/subApps/sheet/components/MobileNav/SectionButton/SectionButton.tsx
new file mode 100644
index 0000000..eda0ec2
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/MobileNav/SectionButton/SectionButton.tsx
@@ -0,0 +1,24 @@
+import clsx from "clsx";
+import { FC } from "react";
+
+import { ButtonProps } from "@dndbeyond/ttui/components/Button";
+
+import { Button } from "~/components/Button";
+
+import styles from "./styles.module.css";
+
+export interface SectionButtonProps extends ButtonProps {}
+
+export const SectionButton: FC<SectionButtonProps> = ({
+  className,
+  onClick,
+  ...props
+}) => {
+  return (
+    <Button
+      className={clsx([styles.sectionButton, className])}
+      onClick={onClick}
+      {...props}
+    />
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/MobileNav/SectionMenu/SectionMenu.tsx b/ddb_main/subApps/sheet/components/MobileNav/SectionMenu/SectionMenu.tsx
new file mode 100644
index 0000000..2f5b776
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/MobileNav/SectionMenu/SectionMenu.tsx
@@ -0,0 +1,116 @@
+import clsx from "clsx";
+import { FC } from "react";
+import { createPortal } from "react-dom";
+import { useSelector } from "react-redux";
+
+import { rulesEngineSelectors } from "@dndbeyond/character-rules-engine";
+import { Dialog, DialogProps } from "@dndbeyond/ttui/components/Dialog";
+
+import { useSheetContext } from "~/subApps/sheet/contexts/Sheet";
+import {
+  ActionsIcon,
+  AttributesIcon,
+  DescriptionIcon,
+  EquipmentIcon,
+  ExtrasIcon,
+  FeatureTraitsIcon,
+  NotesIcon,
+  ProficienciesSvg,
+  SkillsIcon,
+  SpellsIcon,
+} from "~/svgs";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+
+import { SectionButton } from "../SectionButton";
+import styles from "./styles.module.css";
+
+export interface SectionMenuProps extends DialogProps {
+  open: boolean;
+}
+
+export const SectionMenu: FC<SectionMenuProps> = ({
+  className,
+  open,
+  ...props
+}) => {
+  const { setMobileActiveSectionId: setId } = useSheetContext();
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const hasSpells = useSelector(rulesEngineSelectors.hasSpells);
+
+  return createPortal(
+    <>
+      <Dialog
+        className={clsx([styles.sectionNav, className])}
+        open={open}
+        modal
+        {...props}
+      >
+        <SectionButton
+          className={styles.fullWidth}
+          onClick={() => setId("main")}
+        >
+          <AttributesIcon />
+          <span>
+            Abilities, Saves, Senses
+            <span className={styles.mobile}>
+              , Proficiencies, Training, Skills
+            </span>
+          </span>
+        </SectionButton>
+        <SectionButton
+          className={styles.mobile}
+          onClick={() => setId("skills")}
+        >
+          <SkillsIcon />
+          Skills
+        </SectionButton>
+        <SectionButton onClick={() => setId("actions")}>
+          <ActionsIcon />
+          Actions
+        </SectionButton>
+        <SectionButton onClick={() => setId("equipment")}>
+          <EquipmentIcon />
+          Inventory
+        </SectionButton>
+        {hasSpells && (
+          <SectionButton onClick={() => setId("spells")}>
+            <SpellsIcon />
+            Spells
+          </SectionButton>
+        )}
+        <SectionButton onClick={() => setId("features_traits")}>
+          <FeatureTraitsIcon />
+          Features & Traits
+        </SectionButton>
+        <SectionButton
+          className={styles.mobile}
+          onClick={() => setId("proficiencies")}
+        >
+          <ProficienciesSvg />
+          <span>Proficiencies & Training</span>
+        </SectionButton>
+        {!isReadonly && (
+          <SectionButton onClick={() => setId("description")}>
+            <DescriptionIcon />
+            Background
+          </SectionButton>
+        )}
+        {!isReadonly && (
+          <SectionButton onClick={() => setId("notes")}>
+            <NotesIcon />
+            Notes
+          </SectionButton>
+        )}
+        <SectionButton
+          className={hasSpells ? styles.fullWidth : ""}
+          onClick={() => setId("extras")}
+        >
+          <ExtrasIcon />
+          Extras
+        </SectionButton>
+      </Dialog>
+      {open && <div className={styles.backdrop} />}
+    </>,
+    document.body
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/Header/Header.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/Header/Header.tsx
new file mode 100644
index 0000000..d3874bd
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/Header/Header.tsx
@@ -0,0 +1,40 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, ReactNode } from "react";
+
+import { useUnpropagatedClick } from "~/hooks/useUnpropagatedClick";
+
+import styles from "./styles.module.css";
+
+interface HeaderProps extends HTMLAttributes<HTMLElement> {
+  callout?: ReactNode;
+  onClick?: () => void;
+  parent?: ReactNode;
+  preview?: ReactNode;
+}
+
+export const Header: FC<HeaderProps> = ({
+  callout,
+  children,
+  className,
+  onClick,
+  parent,
+  preview,
+  ...props
+}) => {
+  const handleClick = useUnpropagatedClick(onClick);
+
+  return (
+    <header className={clsx(["ct-sidebar__header", className])} {...props}>
+      <div onClick={handleClick} className={onClick && styles.interactive}>
+        {parent}
+      </div>
+      <div className="ct-sidebar__header-primary">
+        {preview}
+        <h1 className={clsx(["ct-sidebar__heading", styles.heading])}>
+          {children}
+        </h1>
+        {callout && <div className={styles.callout}>{callout}</div>}
+      </div>
+    </header>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/Heading/Heading.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/Heading/Heading.tsx
new file mode 100644
index 0000000..e3c5b40
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/Heading/Heading.tsx
@@ -0,0 +1,27 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import styles from "./styles.module.css";
+
+/**
+ * This component is used to render a subheading in the sidebar.
+ */
+
+type HeadingProps = HTMLAttributes<HTMLHeadingElement>;
+
+export const Heading: FC<HeadingProps> = ({
+  className,
+  children,
+  ...props
+}) => (
+  <h2
+    className={clsx([
+      "ct-sidebar__subheading",
+      props.onClick && styles.clickable,
+      className,
+    ])}
+    {...props}
+  >
+    {children}
+  </h2>
+);
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/Pane/Pane.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/Pane/Pane.tsx
new file mode 100644
index 0000000..141b22c
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/Pane/Pane.tsx
@@ -0,0 +1,57 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import { useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneBorder } from "~/svgs";
+
+import { PaneContent } from "../PaneContent";
+import { PaneControls } from "../PaneControls";
+import styles from "./styles.module.css";
+
+/**
+ * The Pane component serves as a way to render the active pane inside of the sidebar. It is a simple component that renders the children passed to it. It is used in the Sidebar component to render the active pane inside of the sidebar. The `isFullWidth` prop determines whether the pane should have padding on the left and right or not. Panes such as CharacterManagePane have items which should be full width. Most panes should have padding on the left and right.
+ **/
+interface PaneProps extends HTMLAttributes<HTMLDivElement> {
+  handlePrevious: () => void;
+  handleNext: () => void;
+  isFullWidth?: boolean;
+  forceDarkMode?: boolean;
+}
+
+export const Pane: FC<PaneProps> = ({
+  isFullWidth,
+  forceDarkMode,
+  handlePrevious,
+  handleNext,
+  ...props
+}) => {
+  const {
+    pane: { activePane },
+  } = useSidebar();
+
+  return (
+    <div className={styles.pane} {...props}>
+      <PaneBorder
+        className={clsx([styles.border, forceDarkMode && styles.dark])}
+      />
+      <div className={clsx([styles.gap, forceDarkMode && styles.dark])} />
+      <div
+        className={clsx([
+          styles.content,
+          forceDarkMode && styles.dark,
+          isFullWidth && styles.fullWidth,
+        ])}
+      >
+        <PaneControls handlePrevious={handlePrevious} handleNext={handleNext} />
+        <PaneContent activePane={activePane} />
+      </div>
+      <PaneBorder
+        className={clsx([
+          styles.border,
+          styles.bottom,
+          forceDarkMode && styles.dark,
+        ])}
+      />
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/PaneContent/PaneContent.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/PaneContent/PaneContent.tsx
new file mode 100644
index 0000000..e4943f2
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/PaneContent/PaneContent.tsx
@@ -0,0 +1,38 @@
+import { FC, HTMLAttributes } from "react";
+
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+
+import { getActiveEntryComponent } from "../../helpers/getActiveEntryComponent";
+import { PaneComponentInfo } from "../../types";
+import styles from "./styles.module.css";
+
+interface PaneContentProps extends HTMLAttributes<HTMLElement> {
+  activePane: PaneComponentInfo | null;
+}
+
+export const PaneContent: FC<PaneContentProps> = ({ activePane, ...props }) => {
+  const { isDarkMode } = useCharacterTheme();
+
+  // Empty pane
+  if (!activePane)
+    return (
+      <div className={styles.default} {...props}>
+        Select elements on the character sheet to display more information about
+      </div>
+    );
+
+  const Component = getActiveEntryComponent(activePane.type);
+
+  // Component not found
+  if (!Component) return <div {...props}>Component was not found.</div>;
+
+  // Return correct component
+  return (
+    <div className={styles.maxHeight} {...props}>
+      <Component
+        theme={isDarkMode ? "DARK" : "LIGHT"}
+        identifiers={activePane.identifiers}
+      />
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/PaneControls/PaneControls.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/PaneControls/PaneControls.tsx
new file mode 100644
index 0000000..ca8c884
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/PaneControls/PaneControls.tsx
@@ -0,0 +1,56 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import ChevronLeft from "@dndbeyond/fontawesome-cache/svgs/solid/chevron-left.svg";
+import ChevronRight from "@dndbeyond/fontawesome-cache/svgs/solid/chevron-right.svg";
+
+import { Button } from "~/components/Button";
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+import { useSidebar } from "~/contexts/Sidebar/Sidebar";
+
+import styles from "./styles.module.css";
+
+interface PaneControlsProps extends HTMLAttributes<HTMLElement> {
+  handlePrevious?: () => void;
+  handleNext?: () => void;
+}
+
+export const PaneControls: FC<PaneControlsProps> = ({
+  handlePrevious,
+  handleNext,
+  ...props
+}) => {
+  const { isDarkMode } = useCharacterTheme();
+  const {
+    pane: { activePane, showControls, isAtStart, isAtEnd },
+  } = useSidebar();
+
+  if (!activePane || !showControls) return null;
+
+  const forceDarkMode = !isDarkMode && activePane.type === "CHARACTER_MANAGE";
+
+  return (
+    <nav className={styles.controls} {...props}>
+      <Button
+        className={clsx([styles.button, forceDarkMode && styles.dark])}
+        size="xx-small"
+        variant="text"
+        disabled={isAtStart}
+        onClick={isAtStart ? undefined : handlePrevious}
+      >
+        <ChevronLeft />
+        <span className={styles.label}>Prev</span>
+      </Button>
+      <Button
+        className={clsx([styles.button, forceDarkMode && styles.dark])}
+        size="xx-small"
+        variant="text"
+        disabled={isAtEnd}
+        onClick={isAtEnd ? undefined : handleNext}
+      >
+        <span className={styles.label}>Next</span>
+        <ChevronRight />
+      </Button>
+    </nav>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/PaneInitFailureContent/PaneInitFailureContent.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/PaneInitFailureContent/PaneInitFailureContent.tsx
new file mode 100644
index 0000000..a63da37
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/PaneInitFailureContent/PaneInitFailureContent.tsx
@@ -0,0 +1,28 @@
+import { FC, useEffect } from "react";
+import { useDispatch } from "react-redux";
+
+import { useSidebar } from "~/contexts/Sidebar";
+
+import { toastMessageActions } from "../../../../../../tools/js/Shared/actions";
+
+interface Props {
+  errorMessage?: string;
+}
+export const PaneInitFailureContent: FC<Props> = ({ errorMessage }) => {
+  const dispatch = useDispatch();
+  const {
+    sidebar: { setIsVisible },
+  } = useSidebar();
+
+  useEffect(() => {
+    setIsVisible(false);
+    dispatch(
+      toastMessageActions.toastError(
+        "Content Error",
+        errorMessage ?? "We couldn't find that content! Please try again."
+      )
+    );
+  }, [errorMessage, dispatch]);
+
+  return null;
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenu.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenu.tsx
new file mode 100644
index 0000000..9ac5c26
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenu.tsx
@@ -0,0 +1,15 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLUListElement> {
+  className?: string;
+}
+export const PaneMenu: FC<Props> = ({ className, children, ...props }) => {
+  return (
+    <ul className={clsx([styles.menu, className])} {...props}>
+      {children}
+    </ul>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuGroup/PaneMenuGroup.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuGroup/PaneMenuGroup.tsx
new file mode 100644
index 0000000..708aac1
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuGroup/PaneMenuGroup.tsx
@@ -0,0 +1,25 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import { PaneMenuItem } from "../PaneMenuItem";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  className?: string;
+  label: string;
+}
+export const PaneMenuGroup: FC<Props> = ({
+  label,
+  className = "",
+  children,
+  ...props
+}) => {
+  return (
+    <div className={clsx([styles.group, className])} {...props}>
+      <PaneMenuItem menukey={label} className={styles.label}>
+        {label}
+      </PaneMenuItem>
+      {children}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuItem/PaneMenuItem.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuItem/PaneMenuItem.tsx
new file mode 100644
index 0000000..a2ad39c
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuItem/PaneMenuItem.tsx
@@ -0,0 +1,42 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import styles from "./styles.module.css";
+
+interface Props extends Omit<HTMLAttributes<HTMLDivElement>, "onClick"> {
+  onClick?: (menuKey: string) => void;
+  menukey: string;
+  className?: string;
+  prefixIcon?: React.ReactNode;
+  suffixIcon?: React.ReactNode;
+}
+export const PaneMenuItem: FC<Props> = ({
+  onClick,
+  menukey,
+  prefixIcon,
+  suffixIcon,
+  className,
+  children,
+  ...props
+}) => {
+  const handleClick = (evt: React.MouseEvent): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    if (onClick) {
+      onClick(menukey);
+    }
+  };
+
+  return (
+    <div
+      className={clsx([styles.item, className])}
+      onClick={handleClick}
+      {...props}
+    >
+      {prefixIcon && <div className={styles.prefixIcon}>{prefixIcon}</div>}
+      <div className={styles.label}>{children}</div>
+      <div className={styles.suffixIcon}>{suffixIcon}</div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/Preview/Preview.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/Preview/Preview.tsx
new file mode 100644
index 0000000..6413259
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/Preview/Preview.tsx
@@ -0,0 +1,25 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+interface PreviewProps extends HTMLAttributes<HTMLDivElement> {
+  imageUrl?: string;
+}
+
+export const Preview: FC<PreviewProps> = ({
+  children,
+  className,
+  imageUrl,
+  ...props
+}) => (
+  <div className={clsx(["ct-sidebar__header-preview", className])} {...props}>
+    {imageUrl ? (
+      <div
+        role="presentation"
+        className="ct-sidebar__header-preview-image"
+        style={{ backgroundImage: `url(${imageUrl})` }}
+      />
+    ) : (
+      children
+    )}
+  </div>
+);
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/ProgressBar/Bar/Bar.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/ProgressBar/Bar/Bar.tsx
new file mode 100644
index 0000000..65b1251
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/ProgressBar/Bar/Bar.tsx
@@ -0,0 +1,21 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import styles from "./styles.module.css";
+
+export interface BarProps extends HTMLAttributes<HTMLButtonElement> {
+  variant?: "active" | "implied" | "inactive";
+  value?: string | number | null;
+}
+
+export const Bar: FC<BarProps> = ({
+  children,
+  className,
+  variant = "inactive",
+  value,
+  ...props
+}) => (
+  <button className={clsx([styles.bar, styles[variant], className])} {...props}>
+    {children}
+  </button>
+);
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/ProgressBar/ProgressBar.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/ProgressBar/ProgressBar.tsx
new file mode 100644
index 0000000..fa71211
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/ProgressBar/ProgressBar.tsx
@@ -0,0 +1,58 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import { Bar } from "./Bar";
+import styles from "./styles.module.css";
+
+export interface ProgressBarProps
+  extends Omit<HTMLAttributes<HTMLDivElement>, "onClick"> {
+  options: Array<number>;
+  value: number | null;
+  onClick: (val: string | number | null) => void;
+  isInteractive?: boolean;
+}
+
+export const ProgressBar: FC<ProgressBarProps> = ({
+  className,
+  options,
+  value,
+  onClick,
+  isInteractive,
+  ...props
+}) => {
+  const handleClick = (val: number | null) => {
+    const isAlreadyNull = value === null && val === null;
+    if (!isInteractive || isAlreadyNull) return;
+    onClick(val);
+  };
+
+  return (
+    <div className={clsx([styles.progressBar, className])} {...props}>
+      <Bar
+        value={null}
+        variant={value !== null ? "implied" : "inactive"}
+        onClick={() => handleClick(null)}
+        aria-disabled={!isInteractive}
+      >
+        --
+      </Bar>
+      {options.map((number) => (
+        <Bar
+          variant={
+            number === value
+              ? "active"
+              : !!value && number < value
+              ? "implied"
+              : "inactive"
+          }
+          value={number}
+          onClick={() => handleClick(number)}
+          aria-disabled={!isInteractive}
+          key={`progress-bar-${number}`}
+        >
+          {number}
+        </Bar>
+      ))}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/QuickActions/QuickActions.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/QuickActions/QuickActions.tsx
new file mode 100644
index 0000000..6d17103
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/QuickActions/QuickActions.tsx
@@ -0,0 +1,31 @@
+import { FC, HTMLAttributes } from "react";
+
+import { ThemeButton } from "~/tools/js/Shared/components/common/Button";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  actions: { label: string; onClick: () => void; disabled: boolean }[];
+}
+
+export const QuickActions: FC<Props> = ({ actions, ...props }) => {
+  return (
+    <div className={styles.container}>
+      <div className={styles.title}>Quick Actions:</div>
+      <div className={styles.buttons}>
+        {actions.map((item, idx) => {
+          return (
+            <ThemeButton
+              key={idx}
+              size="medium"
+              onClick={item.onClick}
+              isInteractive={!item.disabled}
+            >
+              {item.label}
+            </ThemeButton>
+          );
+        })}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/Sidebar/Sidebar.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/Sidebar/Sidebar.tsx
new file mode 100644
index 0000000..c17cbd9
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/Sidebar/Sidebar.tsx
@@ -0,0 +1,171 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useEffect, useRef } from "react";
+import { createPortal } from "react-dom";
+import { useSelector } from "react-redux";
+import { DOWN, SwipeEventData, UP } from "react-swipeable";
+
+import { syncTransactionSelectors } from "@dndbeyond/character-rules-engine";
+
+import { Swipeable } from "~/components/Swipeable";
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+import { useSidebar } from "~/contexts/Sidebar";
+
+import { getPaneProperties } from "../../helpers/paneUtils";
+import { SidebarAlignmentEnum, SidebarPlacementEnum } from "../../types";
+import { Pane } from "../Pane";
+import { VisibilityControls } from "../VisiblilityControls";
+import styles from "./styles.module.css";
+
+export interface SidebarProps extends HTMLAttributes<HTMLDivElement> {
+  setSwipedAmount?: (amount: number) => void;
+}
+
+/**
+ * This component is responsible for rendering the sidebar and its contents. It uses volatile state to manage the visibility, placement, and alignment of the sidebar. It also uses the `Pane` component to render the active pane (the content of the sidebar) and the `VisibilityControls` component to render the controls for the sidebar. The sidebar is rendered as a portal to the body of the document.
+ */
+
+export const Sidebar: FC<SidebarProps> = ({
+  children,
+  className,
+  setSwipedAmount,
+  ...props
+}) => {
+  const sidebarRef = useRef<HTMLDivElement>(null);
+  const { isDarkMode } = useCharacterTheme();
+  const isSyncActive = useSelector(syncTransactionSelectors.getActive);
+  const {
+    sidebar: {
+      isLocked,
+      isVisible,
+      placement,
+      alignment,
+      setIsVisible,
+      setIsLocked,
+      setPlacement,
+      setAlignment,
+    },
+    pane: { activePane, paneHistoryNext, paneHistoryPrevious },
+  } = useSidebar();
+
+  const { isFullWidth, forceDarkMode } = getPaneProperties(activePane);
+
+  const handlePrevious = () => paneHistoryPrevious();
+
+  const handleNext = () => paneHistoryNext();
+
+  const handleTogglePlacement = (place: SidebarPlacementEnum) =>
+    setPlacement(place);
+
+  const handleToggleAlignment = (align: SidebarAlignmentEnum) =>
+    setAlignment(align);
+
+  const handleToggleLock = () => setIsLocked(!isLocked);
+
+  const handleToggleVisibility = () => {
+    if (isLocked) return;
+    if (isVisible && setSwipedAmount) setSwipedAmount(0);
+    setIsVisible(!isVisible);
+  };
+
+  const handleSwipe = ({ deltaX, dir }: SwipeEventData): void => {
+    const isVerticalChange = [UP, DOWN].includes(dir);
+    if (!isVerticalChange && setSwipedAmount) setSwipedAmount(deltaX);
+  };
+
+  const handleEscape = (e: KeyboardEvent) => {
+    if (
+      e.key === "Escape" &&
+      isVisible &&
+      !isLocked &&
+      placement !== SidebarPlacementEnum.FIXED
+    )
+      handleToggleVisibility();
+  };
+
+  const handleClickOutside = (e: MouseEvent) => {
+    const sidebar = sidebarRef.current;
+    const containsElement =
+      e.composedPath().indexOf(sidebar as EventTarget) !== -1;
+    const target = e.target as HTMLElement;
+    const isDiceControl = target?.classList?.contains(
+      "dice_notification_controls"
+    );
+    const isFixed = placement === SidebarPlacementEnum.FIXED;
+
+    // If element clicked is a dice control, don't close the sidebar
+    if (isDiceControl) return;
+
+    // If element clicked is not in the sidebar, and the sidebar is visible, not locked, and not fixed, close the sidebar
+    if (sidebar && !containsElement && isVisible && !isLocked && !isFixed)
+      handleToggleVisibility();
+  };
+
+  useEffect(() => {
+    document.body.addEventListener("keydown", handleEscape);
+    document.addEventListener("click", handleClickOutside);
+
+    return () => {
+      document.body.removeEventListener("keydown", handleEscape);
+      document.removeEventListener("click", handleClickOutside);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isVisible, isLocked, placement]);
+
+  return createPortal(
+    <div className="ct-sidebar__portal">
+      <div
+        className={clsx([
+          styles.mask,
+          isVisible ? styles.visible : styles.hidden,
+          isDarkMode && styles.dark,
+        ])}
+      />
+      <div>
+        <Swipeable
+          handlerFunctions={{
+            onSwipedRight: handleToggleVisibility,
+            onSwiping: handleSwipe,
+          }}
+        >
+          <div
+            role="dialog"
+            aria-label="Information Sidebar"
+            className={clsx([
+              "ct-sidebar",
+              styles.sidebar,
+              styles[alignment],
+              isVisible ? styles.visible : styles.hidden,
+              isFullWidth && "ct-sidebar--is-full-width",
+              isDarkMode && "ct-sidebar--is-dark-mode",
+            ])}
+            ref={sidebarRef}
+            {...props}
+          >
+            <div className="ct-sidebar__inner">
+              <VisibilityControls
+                isVisible={isVisible}
+                isLocked={isLocked}
+                placement={placement}
+                alignment={alignment}
+                onToggleVisibility={handleToggleVisibility}
+                onToggleLock={handleToggleLock}
+                onToggleAlignment={handleToggleAlignment}
+                onTogglePlacement={handleTogglePlacement}
+              />
+              {isVisible && (
+                <Pane
+                  isFullWidth={isFullWidth}
+                  forceDarkMode={forceDarkMode || isDarkMode}
+                  handlePrevious={handlePrevious}
+                  handleNext={handleNext}
+                />
+              )}
+            </div>
+            {isSyncActive && <div className={styles.syncBlocker} />}
+          </div>
+        </Swipeable>
+      </div>
+    </div>,
+    document.body
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/components/VisiblilityControls/VisibilityControls.tsx b/ddb_main/subApps/sheet/components/Sidebar/components/VisiblilityControls/VisibilityControls.tsx
new file mode 100644
index 0000000..1e66578
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/components/VisiblilityControls/VisibilityControls.tsx
@@ -0,0 +1,156 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import Lock from "@dndbeyond/fontawesome-cache/svgs/solid/lock.svg";
+import Unlock from "@dndbeyond/fontawesome-cache/svgs/solid/unlock.svg";
+
+import {
+  SidebarAlignmentEnum,
+  SidebarPlacementEnum,
+} from "~/subApps/sheet/components/Sidebar/types";
+import Tooltip from "~/tools/js/commonComponents/Tooltip";
+
+import { AlignLeftIcon } from "../../svgs/AlignLeftIcon";
+import { AlignRightIcon } from "../../svgs/AlignRightIcon";
+import { ArrowsLeftIcon } from "../../svgs/ArrowsLeftIcon";
+import { ArrowsRightIcon } from "../../svgs/ArrowsRightIcon";
+import { FixedIcon } from "../../svgs/FixedIcon";
+import { OverlayIcon } from "../../svgs/OverlayIcon";
+import styles from "./styles.module.css";
+
+interface VisibilityControlsProps extends HTMLAttributes<HTMLDivElement> {
+  isLocked: boolean;
+  isVisible: boolean;
+  placement: SidebarPlacementEnum;
+  alignment: SidebarAlignmentEnum;
+  onToggleLock: () => void;
+  onToggleVisibility: () => void;
+  onTogglePlacement: (val: "overlay" | "fixed") => void;
+  onToggleAlignment: (val: "left" | "right") => void;
+}
+
+export const VisibilityControls: FC<VisibilityControlsProps> = ({
+  className,
+  isLocked,
+  isVisible,
+  placement,
+  alignment,
+  onToggleLock,
+  onToggleVisibility,
+  onTogglePlacement,
+  onToggleAlignment,
+  ...props
+}) => {
+  const isActive = (value: "overlay" | "fixed" | "left" | "right") => {
+    if (placement === value || alignment === value) return styles.active;
+    return undefined;
+  };
+
+  const tippyOpts = {
+    dynamicTitle: true,
+    interactive: true,
+  };
+
+  return (
+    <div
+      className={clsx([
+        styles.controls,
+        alignment === "left" && styles.left,
+        className,
+      ])}
+      {...props}
+    >
+      {isLocked ? (
+        <Tooltip title="Locked" isDarkMode tippyOpts={tippyOpts}>
+          <button
+            className={styles.locked}
+            onClick={onToggleLock}
+            aria-label="Locked"
+          >
+            <Lock />
+          </button>
+        </Tooltip>
+      ) : (
+        <>
+          <div className={styles.visibility}>
+            <Tooltip
+              className={!isVisible ? styles.closed : ""}
+              title={isVisible ? "Hide Sidebar" : "Show Sidebar"}
+              isDarkMode
+              tippyOpts={{
+                ...tippyOpts,
+                placement: "top-end",
+              }}
+            >
+              <button
+                className={styles.arrows}
+                onClick={onToggleVisibility}
+                aria-label={isVisible ? "Hide sidebar" : "Show sidebar"}
+              >
+                {isVisible ? <ArrowsRightIcon /> : <ArrowsLeftIcon />}
+              </button>
+            </Tooltip>
+            <Tooltip
+              title="Unlocked"
+              isDarkMode
+              tippyOpts={tippyOpts}
+              className={!isVisible ? styles.hidden : ""}
+            >
+              <button onClick={onToggleLock} aria-label="Unlocked">
+                <Unlock />
+              </button>
+            </Tooltip>
+          </div>
+          <div
+            className={clsx([styles.overlay, !isVisible ? styles.hidden : ""])}
+          >
+            <Tooltip title="Overlay" isDarkMode tippyOpts={tippyOpts}>
+              <button
+                className={isActive("overlay")}
+                onClick={() => onTogglePlacement("overlay")}
+                aria-label="Set to overlay position"
+              >
+                <OverlayIcon />
+              </button>
+            </Tooltip>
+            <Tooltip title="Fixed" isDarkMode tippyOpts={tippyOpts}>
+              <button
+                className={isActive("fixed")}
+                onClick={() => onTogglePlacement("fixed")}
+                aria-label="Set to fixed position"
+              >
+                <FixedIcon />
+              </button>
+            </Tooltip>
+          </div>
+          <div
+            className={clsx([
+              styles.placement,
+              alignment === "left" && styles.left,
+              !isVisible ? styles.hidden : "",
+            ])}
+          >
+            <Tooltip title="Left" isDarkMode tippyOpts={tippyOpts}>
+              <button
+                className={isActive("left")}
+                onClick={() => onToggleAlignment("left")}
+                aria-label="Align Left"
+              >
+                <AlignLeftIcon />
+              </button>
+            </Tooltip>
+            <Tooltip title="Right" isDarkMode tippyOpts={tippyOpts}>
+              <button
+                className={isActive("right")}
+                onClick={() => onToggleAlignment("right")}
+                aria-label="Align Right"
+              >
+                <AlignRightIcon />
+              </button>
+            </Tooltip>
+          </div>
+        </>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/helpers/getActiveEntryComponent.ts b/ddb_main/subApps/sheet/components/Sidebar/helpers/getActiveEntryComponent.ts
new file mode 100644
index 0000000..b597e3f
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/helpers/getActiveEntryComponent.ts
@@ -0,0 +1,244 @@
+import { CreaturePane } from "~/subApps/sheet/components/Sidebar/panes/CreaturePane";
+import { GameLogPane } from "~/subApps/sheet/components/Sidebar/panes/GameLogPane";
+import BlessingPane from "~/tools/js/Shared/containers/panes/BlessingPane";
+import CharacterSpellPane from "~/tools/js/Shared/containers/panes/CharacterSpellPane";
+import ClassSpellPane from "~/tools/js/Shared/containers/panes/ClassSpellPane";
+import ConditionManagePane from "~/tools/js/Shared/containers/panes/ConditionManagePane";
+import ContainerPane from "~/tools/js/Shared/containers/panes/ContainerPane";
+import CurrencyPane from "~/tools/js/Shared/containers/panes/CurrencyPane";
+import CustomActionPane from "~/tools/js/Shared/containers/panes/CustomActionPane";
+import CustomActionsPane from "~/tools/js/Shared/containers/panes/CustomActionsPane";
+import CustomSkillPane from "~/tools/js/Shared/containers/panes/CustomSkillPane";
+import DecoratePane from "~/tools/js/Shared/containers/panes/DecoratePane";
+import DefenseManagePane from "~/tools/js/Shared/containers/panes/DefenseManagePane";
+import DescriptionPane from "~/tools/js/Shared/containers/panes/DescriptionPane";
+import EncumbrancePane from "~/tools/js/Shared/containers/panes/EncumbrancePane";
+import EquipmentManagePane from "~/tools/js/Shared/containers/panes/EquipmentManagePane";
+import { ExportPdfPane } from "~/tools/js/Shared/containers/panes/ExportPdfPane";
+import ExtraManagePane from "~/tools/js/Shared/containers/panes/ExtraManagePane";
+import InfusionChoicePane from "~/tools/js/Shared/containers/panes/InfusionChoicePane";
+import ItemPane from "~/tools/js/Shared/containers/panes/ItemPane";
+import LongRestPane from "~/tools/js/Shared/containers/panes/LongRestPane";
+import NoteManagePane from "~/tools/js/Shared/containers/panes/NoteManagePane";
+import { PreferencesHitPointConfirmPane } from "~/tools/js/Shared/containers/panes/PreferencesHitPointConfirmPane";
+import PreferencesOptionalClassFeaturesConfirmPane from "~/tools/js/Shared/containers/panes/PreferencesOptionalClassFeaturesConfirmPane/PreferencesOptionalClassFeaturesConfirmPane";
+import PreferencesOptionalOriginsConfirmPane from "~/tools/js/Shared/containers/panes/PreferencesOptionalOriginsConfirmPane/PreferencesOptionalOriginsConfirmPane";
+import PreferencesPane from "~/tools/js/Shared/containers/panes/PreferencesPane";
+import { PreferencesProgressionConfirmPane } from "~/tools/js/Shared/containers/panes/PreferencesProgressionConfirmPane";
+import ProficienciesPane from "~/tools/js/Shared/containers/panes/ProficienciesPane";
+import ProficiencyBonusPane from "~/tools/js/Shared/containers/panes/ProficiencyBonusPane";
+import SavingThrowsPane from "~/tools/js/Shared/containers/panes/SavingThrowsPane";
+import SenseManagePane from "~/tools/js/Shared/containers/panes/SenseManagePane";
+import SettingsPane from "~/tools/js/Shared/containers/panes/SettingsPane";
+import { ShareUrlPane } from "~/tools/js/Shared/containers/panes/ShareUrlPane";
+import ShortRestPane from "~/tools/js/Shared/containers/panes/ShortRestPane";
+import SkillPane from "~/tools/js/Shared/containers/panes/SkillPane";
+import SkillsPane from "~/tools/js/Shared/containers/panes/SkillsPane";
+import SpeciesTraitPane from "~/tools/js/Shared/containers/panes/SpeciesTraitPane";
+import SpeedManagePane from "~/tools/js/Shared/containers/panes/SpeedManagePane";
+import SpellManagePane from "~/tools/js/Shared/containers/panes/SpellManagePane";
+import StartingEquipmentPane from "~/tools/js/Shared/containers/panes/StartingEquipmentPane";
+import TraitPane from "~/tools/js/Shared/containers/panes/TraitPane";
+import VehicleComponentPane from "~/tools/js/Shared/containers/panes/VehicleComponentPane";
+import VehiclePane from "~/tools/js/Shared/containers/panes/VehiclePane";
+
+import { AbilityPane } from "../panes/AbilityPane";
+import { AbilitySavingThrowsPane } from "../panes/AbilitySavingThrowsPane";
+import { ActionPane } from "../panes/ActionPane";
+import { ArmorManagePane } from "../panes/ArmorManagePane";
+import { BackgroundPane } from "../panes/BackgroundPane";
+import { BasicActionPane } from "../panes/BasicActionPane";
+import { CampaignPane } from "../panes/CampaignPane";
+import { CharacterManagePane } from "../panes/CharacterManagePane";
+import { ClassFeaturePane } from "../panes/ClassFeaturePane";
+import { FeatPane } from "../panes/FeatPane";
+import { FeatsManagePane } from "../panes/FeatsManagePane";
+import { HitPointsManagePane } from "../panes/HitPointsManagePane";
+import { InitiativePane } from "../panes/InitiativePane";
+import { InspirationPane } from "../panes/InspirationPane";
+import { XpPane } from "../panes/XpPane";
+import { PaneComponentEnum, SidebarPaneComponent } from "../types";
+
+// Refactor this to a hook that returns a component?
+export const getActiveEntryComponent = (
+  componentType?: PaneComponentEnum
+): SidebarPaneComponent<any> | null => {
+  if (!componentType) return null;
+
+  switch (componentType) {
+    case PaneComponentEnum.HEALTH_MANAGE:
+      return HitPointsManagePane;
+
+    case PaneComponentEnum.ITEM_DETAIL:
+      return ItemPane;
+
+    case PaneComponentEnum.CHARACTER_SPELL_DETAIL:
+      return CharacterSpellPane;
+
+    case PaneComponentEnum.CLASS_SPELL_DETAIL:
+      return ClassSpellPane;
+
+    case PaneComponentEnum.ABILITY:
+      return AbilityPane;
+
+    case PaneComponentEnum.SKILLS:
+      return SkillsPane;
+
+    case PaneComponentEnum.PROFICIENCIES:
+      return ProficienciesPane;
+
+    case PaneComponentEnum.XP:
+      return XpPane;
+
+    case PaneComponentEnum.SHORT_REST:
+      return ShortRestPane;
+
+    case PaneComponentEnum.LONG_REST:
+      return LongRestPane;
+
+    case PaneComponentEnum.SPELL_MANAGE:
+      return SpellManagePane;
+
+    case PaneComponentEnum.CONDITION_MANAGE:
+      return ConditionManagePane;
+
+    case PaneComponentEnum.SPEED_MANAGE:
+      return SpeedManagePane;
+
+    case PaneComponentEnum.SENSE_MANAGE:
+      return SenseManagePane;
+
+    case PaneComponentEnum.DEFENSE_MANAGE:
+      return DefenseManagePane;
+
+    case PaneComponentEnum.ARMOR_MANAGE:
+      return ArmorManagePane;
+
+    case PaneComponentEnum.FEATS_MANAGE:
+      return FeatsManagePane;
+
+    case PaneComponentEnum.NOTE_MANAGE:
+      return NoteManagePane;
+
+    case PaneComponentEnum.TRAIT:
+      return TraitPane;
+
+    case PaneComponentEnum.CAMPAIGN:
+      return CampaignPane;
+
+    case PaneComponentEnum.EQUIPMENT_MANAGE:
+      return EquipmentManagePane;
+
+    case PaneComponentEnum.CURRENCY:
+      return CurrencyPane;
+
+    case PaneComponentEnum.ENCUMBRANCE:
+      return EncumbrancePane;
+
+    case PaneComponentEnum.STARTING_EQUIPMENT:
+      return StartingEquipmentPane;
+
+    case PaneComponentEnum.CUSTOM_ACTIONS:
+      return CustomActionsPane;
+
+    case PaneComponentEnum.CUSTOM_ACTION:
+      return CustomActionPane;
+
+    case PaneComponentEnum.CLASS_FEATURE_DETAIL:
+      return ClassFeaturePane;
+
+    case PaneComponentEnum.FEAT_DETAIL:
+      return FeatPane;
+
+    case PaneComponentEnum.SPECIES_TRAIT_DETAIL:
+      return SpeciesTraitPane;
+
+    case PaneComponentEnum.BACKGROUND:
+      return BackgroundPane;
+
+    case PaneComponentEnum.DESCRIPTION:
+      return DescriptionPane;
+
+    case PaneComponentEnum.PROFICIENCY_BONUS:
+      return ProficiencyBonusPane;
+
+    case PaneComponentEnum.INSPIRATION:
+      return InspirationPane;
+
+    case PaneComponentEnum.INITIATIVE:
+      return InitiativePane;
+
+    case PaneComponentEnum.ACTION:
+      return ActionPane;
+
+    case PaneComponentEnum.PREFERENCES:
+      return PreferencesPane;
+
+    case PaneComponentEnum.SKILL:
+      return SkillPane;
+
+    case PaneComponentEnum.CUSTOM_SKILL:
+      return CustomSkillPane;
+
+    case PaneComponentEnum.SAVING_THROWS:
+      return SavingThrowsPane;
+
+    case PaneComponentEnum.ABILITY_SAVING_THROW:
+      return AbilitySavingThrowsPane;
+
+    case PaneComponentEnum.BASIC_ACTION:
+      return BasicActionPane;
+
+    case PaneComponentEnum.PREFERENCES_HIT_POINT_CONFIRM:
+      return PreferencesHitPointConfirmPane;
+
+    case PaneComponentEnum.PREFERENCES_OPTIONAL_CLASS_FEATURES_CONFIRM:
+      return PreferencesOptionalClassFeaturesConfirmPane;
+
+    case PaneComponentEnum.PREFERENCES_OPTIONAL_ORIGINS_CONFIRM:
+      return PreferencesOptionalOriginsConfirmPane;
+
+    case PaneComponentEnum.PREFERENCES_PROGRESSION_CONFIRM:
+      return PreferencesProgressionConfirmPane;
+
+    case PaneComponentEnum.SHARE_URL:
+      return ShareUrlPane;
+
+    case PaneComponentEnum.CREATURE:
+      return CreaturePane;
+
+    case PaneComponentEnum.VEHICLE:
+      return VehiclePane;
+
+    case PaneComponentEnum.VEHICLE_COMPONENT:
+      return VehicleComponentPane;
+
+    case PaneComponentEnum.EXTRA_MANAGE:
+      return ExtraManagePane;
+
+    case PaneComponentEnum.INFUSION_CHOICE:
+      return InfusionChoicePane;
+
+    case PaneComponentEnum.EXPORT_PDF:
+      return ExportPdfPane;
+
+    case PaneComponentEnum.CHARACTER_MANAGE:
+      return CharacterManagePane;
+
+    case PaneComponentEnum.GAME_LOG:
+      return GameLogPane;
+
+    case PaneComponentEnum.CONTAINER:
+      return ContainerPane;
+
+    case PaneComponentEnum.DECORATE:
+      return DecoratePane;
+
+    case PaneComponentEnum.SETTINGS:
+      return SettingsPane;
+
+    case PaneComponentEnum.BLESSING_DETAIL:
+    default:
+      return BlessingPane;
+  }
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/helpers/paneUtils.ts b/ddb_main/subApps/sheet/components/Sidebar/helpers/paneUtils.ts
new file mode 100644
index 0000000..49c8d02
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/helpers/paneUtils.ts
@@ -0,0 +1,203 @@
+import {
+  BaseInventoryContract,
+  Hack__BaseCharClass,
+  FeatDetailsContract,
+  RacialTraitContract,
+  ClassFeatureUtils,
+  ClassUtils,
+  Constants,
+  DataOriginRef,
+  DataOriginRefData,
+  DataOriginUtils,
+  FeatUtils,
+  ItemUtils,
+  RacialTraitUtils,
+  DataOrigin,
+  Spell,
+  SpellUtils,
+  ClassFeatureContract,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneIdentifierUtils } from "~/tools/js/Shared/utils";
+
+import {
+  PaneComponentEnum,
+  PaneComponentInfo,
+  PaneComponentProperties,
+  PaneIdentifiers,
+} from "../types";
+
+// List any full width panes
+const fullWidthPanes = [PaneComponentEnum.CHARACTER_MANAGE];
+
+// Check to see if pane is in the list
+const isFullWidthPane = (activeEntry: PaneComponentInfo | null) =>
+  activeEntry?.type && fullWidthPanes.includes(activeEntry.type);
+
+// List any forced dark mode panes
+const darkModePanes = [PaneComponentEnum.CHARACTER_MANAGE];
+
+// Check to see if pane is in the list
+const forceDarkMode = (activeEntry: PaneComponentInfo | null) =>
+  activeEntry?.type && darkModePanes.includes(activeEntry.type);
+
+// Return optional pane props
+export const getPaneProperties = (
+  activeEntry: PaneComponentInfo | null
+): PaneComponentProperties => {
+  const props: PaneComponentProperties = {
+    isFullWidth: isFullWidthPane(activeEntry) ?? false,
+    forceDarkMode: forceDarkMode(activeEntry) ?? false,
+  };
+
+  return { ...props };
+};
+
+export function getSpellComponentInfo(spell: Spell): PaneComponentInfo {
+  let dataOrigin = SpellUtils.getDataOrigin(spell);
+  let dataOriginType = SpellUtils.getDataOriginType(spell);
+
+  let type: PaneComponentEnum = PaneComponentEnum.CHARACTER_SPELL_DETAIL;
+  let identifiers: PaneIdentifiers | null = null;
+
+  const mappingId = SpellUtils.getMappingId(spell);
+  if (mappingId !== null) {
+    if (dataOriginType === Constants.DataOriginTypeEnum.CLASS) {
+      type = PaneComponentEnum.CLASS_SPELL_DETAIL;
+      identifiers = PaneIdentifierUtils.generateClassSpell(
+        ClassUtils.getMappingId(dataOrigin.primary as Hack__BaseCharClass),
+        mappingId
+      );
+    } else {
+      identifiers = PaneIdentifierUtils.generateCharacterSpell(mappingId);
+    }
+  }
+
+  return {
+    type,
+    identifiers,
+  };
+}
+
+export function getDataOriginComponentInfo(
+  dataOrigin: DataOrigin
+): PaneComponentInfo {
+  let type: PaneComponentEnum = PaneComponentEnum.ERROR_404;
+  let identifiers: PaneIdentifiers | null = null;
+  switch (dataOrigin.type) {
+    case Constants.DataOriginTypeEnum.ITEM:
+      type = PaneComponentEnum.ITEM_DETAIL;
+      identifiers = PaneIdentifierUtils.generateItem(
+        ItemUtils.getMappingId(dataOrigin.primary as BaseInventoryContract)
+      );
+      break;
+
+    case Constants.DataOriginTypeEnum.CLASS_FEATURE:
+      type = PaneComponentEnum.CLASS_FEATURE_DETAIL;
+      identifiers = PaneIdentifierUtils.generateClassFeature(
+        ClassFeatureUtils.getId(dataOrigin.primary as ClassFeatureContract),
+        ClassUtils.getMappingId(dataOrigin.parent as Hack__BaseCharClass)
+      );
+      break;
+
+    case Constants.DataOriginTypeEnum.RACE:
+      type = PaneComponentEnum.SPECIES_TRAIT_DETAIL;
+      identifiers = PaneIdentifierUtils.generateRacialTrait(
+        RacialTraitUtils.getId(dataOrigin.primary as RacialTraitContract)
+      );
+      break;
+
+    case Constants.DataOriginTypeEnum.FEAT:
+      type = PaneComponentEnum.FEAT_DETAIL;
+      identifiers = PaneIdentifierUtils.generateFeat(
+        FeatUtils.getId(dataOrigin.primary as FeatDetailsContract)
+      );
+      break;
+
+    case Constants.DataOriginTypeEnum.BACKGROUND:
+      type = PaneComponentEnum.BACKGROUND;
+      break;
+
+    case Constants.DataOriginTypeEnum.FEAT_LIST:
+      if (dataOrigin.parentType === Constants.DataOriginTypeEnum.BACKGROUND) {
+        type = PaneComponentEnum.BACKGROUND;
+      }
+      break;
+
+    default:
+    // Not implemented
+  }
+
+  return {
+    type,
+    identifiers,
+  };
+}
+
+export function getDataOriginRefComponentInfo(
+  ref: DataOriginRef,
+  refData: DataOriginRefData
+): PaneComponentInfo {
+  let type: PaneComponentEnum = PaneComponentEnum.ERROR_404;
+  let identifiers: PaneIdentifiers | null = null;
+
+  switch (ref.type) {
+    case Constants.DataOriginTypeEnum.ITEM: {
+      const primary = DataOriginUtils.getRefPrimary(ref, refData);
+      if (primary !== null) {
+        type = PaneComponentEnum.ITEM_DETAIL;
+        identifiers = PaneIdentifierUtils.generateItem(
+          ItemUtils.getMappingId(primary)
+        );
+      }
+      break;
+    }
+
+    case Constants.DataOriginTypeEnum.CLASS_FEATURE: {
+      const primary = DataOriginUtils.getRefPrimary(ref, refData);
+      const parent = DataOriginUtils.getRefParent(ref, refData);
+      if (primary !== null && parent !== null) {
+        type = PaneComponentEnum.CLASS_FEATURE_DETAIL;
+        identifiers = PaneIdentifierUtils.generateClassFeature(
+          ClassFeatureUtils.getId(primary),
+          ClassUtils.getMappingId(parent)
+        );
+      }
+      break;
+    }
+
+    case Constants.DataOriginTypeEnum.RACE: {
+      const primary = DataOriginUtils.getRefPrimary(ref, refData);
+      if (primary !== null) {
+        type = PaneComponentEnum.SPECIES_TRAIT_DETAIL;
+        identifiers = PaneIdentifierUtils.generateRacialTrait(
+          RacialTraitUtils.getId(primary)
+        );
+      }
+      break;
+    }
+
+    case Constants.DataOriginTypeEnum.FEAT: {
+      const primary = DataOriginUtils.getRefPrimary(ref, refData);
+      if (primary !== null) {
+        type = PaneComponentEnum.FEAT_DETAIL;
+        identifiers = PaneIdentifierUtils.generateFeat(
+          FeatUtils.getId(primary)
+        );
+      }
+      break;
+    }
+
+    case Constants.DataOriginTypeEnum.BACKGROUND:
+      type = PaneComponentEnum.BACKGROUND;
+      break;
+
+    default:
+    // Not implemented
+  }
+
+  return {
+    type,
+    identifiers,
+  };
+}
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/AbilityPane/AbilityPane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/AbilityPane/AbilityPane.tsx
new file mode 100644
index 0000000..7e5cd6c
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/AbilityPane/AbilityPane.tsx
@@ -0,0 +1,83 @@
+import { FC, HTMLAttributes, ReactNode } from "react";
+import { useSelector } from "react-redux";
+
+import { AbilityScoreManager } from "~/components/AbilityScoreManager";
+import { HtmlContent } from "~/components/HtmlContent";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+import { useAbilities } from "~/hooks/useAbilities";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { PaneInitFailureContent } from "~/subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import { Preview } from "~/subApps/sheet/components/Sidebar/components/Preview";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+import { AbilityIcon } from "~/tools/js/smartComponents/Icons";
+
+import { PaneIdentifiersAbility } from "../../types";
+import styles from "./styles.module.css";
+
+/*
+AbilityPane is the specific Sidebar for each Ability on a character 
+(Strength, Dexterity, Constitution, Wisdom, Intelligence, Charisma)
+*/
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  identifiers: PaneIdentifiersAbility | null;
+}
+export const AbilityPane: FC<Props> = ({ identifiers, ...props }) => {
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const { isDarkMode } = useCharacterTheme();
+  const abilities = useAbilities();
+  const ability =
+    (identifiers &&
+      abilities.find((a) => a.getId() === identifiers?.ability.getId())) ||
+    identifiers?.ability;
+
+  if (!ability) {
+    return <PaneInitFailureContent />;
+  }
+
+  const statId = ability.getId();
+
+  let sidebarPreviewNode: ReactNode = (
+    <Preview>
+      <AbilityIcon
+        className={styles.icon}
+        statId={statId}
+        themeMode={isDarkMode ? "light" : "dark"}
+      />
+    </Preview>
+  );
+
+  const modifier = ability.getModifier();
+  const abilityCompendiumText = ability.getCompendiumText();
+  return (
+    <div key={statId} {...props}>
+      <Header preview={sidebarPreviewNode}>
+        {ability.getLabel()} {ability.getTotalScore()}
+        {modifier !== null && (
+          <span className={styles.modifier}>
+            (
+            <NumberDisplay
+              type="signed"
+              number={modifier}
+              className={styles.signedNumber}
+            />
+            )
+          </span>
+        )}
+      </Header>
+      <AbilityScoreManager
+        ability={ability}
+        showHeader={false}
+        isReadonly={isReadonly}
+      />
+      {abilityCompendiumText && (
+        <HtmlContent
+          className={styles.description}
+          html={abilityCompendiumText}
+          withoutTooltips
+        />
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/AbilitySavingThrowsPane/AbilitySavingThrowsPane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/AbilitySavingThrowsPane/AbilitySavingThrowsPane.tsx
new file mode 100644
index 0000000..7f1cbc3
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/AbilitySavingThrowsPane/AbilitySavingThrowsPane.tsx
@@ -0,0 +1,214 @@
+import { ComponentType, FC, HTMLAttributes, ReactNode } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import {
+  AbilityIcon,
+  Collapsible,
+  DarkModeNegativeBonusNegativeSvg,
+  DarkModePositiveBonusPositiveSvg,
+  NegativeBonusNegativeSvg,
+  PositiveBonusPositiveSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  AbilityUtils,
+  characterActions,
+  Constants,
+  FormatUtils,
+  ModifierUtils,
+  ValueUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { RuleKeyEnum } from "~/constants";
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+import { useSidebar } from "~/contexts/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useRuleData } from "~/hooks/useRuleData";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Preview } from "~/subApps/sheet/components/Sidebar/components/Preview";
+import { Ability, SituationalSavingThrowInfo, StatDataContract } from "~/types";
+
+import EditorBox from "../../../../../../tools/js/Shared/components/EditorBox";
+import ValueEditor from "../../../../../../tools/js/Shared/components/ValueEditor";
+import { appEnvSelectors } from "../../../../../../tools/js/Shared/selectors";
+import { PaneInitFailureContent } from "../../components/PaneInitFailureContent";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersAbilitySavingThrow,
+} from "../../types";
+import styles from "./styles.module.css";
+
+/*
+AbilitySavingThrowsPane is the specific Sidebar for each Ability Saving Throw on a character - (Strength, Dexterity, Constitution, Wisdom, Intelligence, Charisma) - it displays the details, modifiers, any customizations and overrides, as well as the situational bonuses.
+*/
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  identifiers: PaneIdentifiersAbilitySavingThrow | null;
+}
+
+export const AbilitySavingThrowsPane: FC<Props> = ({
+  identifiers,
+  ...props
+}) => {
+  const dispatch = useDispatch();
+
+  const {
+    ruleData,
+    situationalBonusSavingThrowsLookup,
+    abilityLookup,
+    entityValueLookup,
+  } = useCharacterEngine();
+  const { ruleDataUtils } = useRuleData();
+
+  const { isDarkMode } = useCharacterTheme();
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+
+  const abilityDataLookup = ruleDataUtils.getStatsLookup(ruleData);
+  const ability: Ability | null = identifiers && abilityLookup[identifiers.id];
+  const abilityData: StatDataContract | null =
+    identifiers && abilityDataLookup[identifiers.id];
+  const situationalBonusSavingThrowsInfo: SituationalSavingThrowInfo[] | null =
+    identifiers && situationalBonusSavingThrowsLookup[identifiers.id];
+
+  const rulesText = ruleDataUtils.getRule(RuleKeyEnum.SAVING_THROWS, ruleData);
+
+  const handleCustomDataUpdate = (
+    key: number,
+    value: any,
+    source: string
+  ): void => {
+    if (!abilityData) return;
+
+    dispatch(
+      characterActions.valueSet(
+        key,
+        value,
+        source,
+        ValueUtils.hack__toString(abilityData.id),
+        ValueUtils.hack__toString(abilityData.entityTypeId)
+      )
+    );
+  };
+
+  const handleParentClick = (): void => {
+    paneHistoryPush(PaneComponentEnum.SAVING_THROWS);
+  };
+
+  if (!ability || !abilityData) {
+    return <PaneInitFailureContent />;
+  }
+  const statId = AbilityUtils.getId(ability);
+
+  let sidebarPreviewNode: ReactNode = (
+    <Preview>
+      <AbilityIcon
+        className={styles.icon}
+        statId={statId}
+        themeMode={isDarkMode ? "light" : "dark"}
+      />
+    </Preview>
+  );
+
+  return (
+    <div key={statId} {...props}>
+      <Header
+        preview={sidebarPreviewNode}
+        parent="Saving Throws"
+        onClick={handleParentClick}
+      >
+        {abilityData.name} Saving Throw
+        <span className={styles.modifier}>
+          <NumberDisplay type="signed" number={AbilityUtils.getSave(ability)} />
+        </span>
+      </Header>
+      {!isReadonly && (
+        <Collapsible
+          layoutType={"minimal"}
+          header="Customize"
+          className={styles.customize}
+        >
+          <EditorBox className={styles.editorBox}>
+            <ValueEditor
+              dataLookup={ValueUtils.getEntityData(
+                entityValueLookup,
+                ValueUtils.hack__toString(abilityData.id),
+                ValueUtils.hack__toString(abilityData.entityTypeId)
+              )}
+              onDataUpdate={handleCustomDataUpdate}
+              valueEditors={[
+                Constants.AdjustmentTypeEnum.SAVING_THROW_OVERRIDE,
+                Constants.AdjustmentTypeEnum.SAVING_THROW_MAGIC_BONUS,
+                Constants.AdjustmentTypeEnum.SAVING_THROW_MISC_BONUS,
+                Constants.AdjustmentTypeEnum.SAVING_THROW_PROFICIENCY_LEVEL,
+              ]}
+              ruleData={ruleData}
+            />
+          </EditorBox>
+        </Collapsible>
+      )}
+      {situationalBonusSavingThrowsInfo && (
+        <div className={styles.situational}>
+          {situationalBonusSavingThrowsInfo.map((situationalBonus) => {
+            let abilityNode: ReactNode;
+
+            if (
+              situationalBonus.type ===
+              Constants.SituationalBonusSavingThrowTypeEnum.MODIFIER
+            ) {
+              let restriction = ModifierUtils.getRestriction(
+                situationalBonus.extra
+              );
+              if (restriction) {
+                restriction = restriction.trim();
+                restriction = FormatUtils.lowerCaseLetters(restriction, 0);
+                abilityNode = <>{restriction}</>;
+              }
+            }
+
+            if (!abilityNode) {
+              abilityNode = <>on saves</>;
+            }
+
+            const saveAmount = situationalBonus.value;
+            let IconComponent: ComponentType<any>;
+            if (situationalBonus.value >= 0) {
+              IconComponent = isDarkMode
+                ? DarkModePositiveBonusPositiveSvg
+                : PositiveBonusPositiveSvg;
+            } else {
+              IconComponent = isDarkMode
+                ? DarkModeNegativeBonusNegativeSvg
+                : NegativeBonusNegativeSvg;
+            }
+
+            return (
+              <div
+                className={styles.situationalBonus}
+                key={situationalBonus.key}
+              >
+                <IconComponent className={styles.situationalBonusIcon} />
+                <span className={styles.situationalBonusValue}>
+                  {saveAmount}
+                </span>
+                <span className={styles.situationalBonusRestriction}>
+                  {abilityNode}
+                </span>
+              </div>
+            );
+          })}
+        </div>
+      )}
+      {rulesText && rulesText.description && (
+        <HtmlContent
+          className={styles.description}
+          html={rulesText.description}
+          withoutTooltips
+        />
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/ActionPane/ActionPane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/ActionPane/ActionPane.tsx
new file mode 100644
index 0000000..1970567
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/ActionPane/ActionPane.tsx
@@ -0,0 +1,195 @@
+import { FC, HTMLAttributes, ReactNode } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import { ActionName } from "@dndbeyond/character-components/es";
+import {
+  ActionUtils,
+  characterActions,
+  InfusionUtils,
+  HelperUtils,
+  ItemUtils,
+  EntityUtils,
+  ItemManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemName } from "~/components/ItemName";
+import { DataOriginTypeEnum } from "~/constants";
+import { useSidebar } from "~/contexts/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { BaseInventoryContract } from "~/types";
+
+import { ActionDetail } from "../../../../../../tools/js/Shared/components/ActionDetail";
+import { appEnvSelectors } from "../../../../../../tools/js/Shared/selectors";
+import { PaneInitFailureContent } from "../../components/PaneInitFailureContent";
+import { getDataOriginComponentInfo } from "../../helpers/paneUtils";
+import { PaneComponentEnum, PaneIdentifiersAction } from "../../types";
+
+/*
+ActionPane is the Sidebar content that displays the details and usages of actions. If the Action is directly represented as an Item in the Actions section - it will display the ItemPane in the Sidebar. Some Items contain actions (reactions or bonus actions) when attuned - These will display seperately from the Item and when clicked they use the ActionPane with special data depending on the DataOrigin.
+*/
+
+interface ActionPaneProps extends HTMLAttributes<HTMLDivElement> {
+  identifiers: PaneIdentifiersAction | null;
+}
+export const ActionPane: FC<ActionPaneProps> = ({ identifiers, ...props }) => {
+  const {
+    actions,
+    abilityLookup,
+    ruleData,
+    entityValueLookup,
+    proficiencyBonus,
+    inventoryLookup,
+    characterTheme,
+  } = useCharacterEngine();
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const dispatch = useDispatch();
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+
+  const action = actions.find(
+    (action) =>
+      identifiers?.id === ActionUtils.getMappingId(action) &&
+      identifiers?.entityTypeId === ActionUtils.getMappingEntityTypeId(action)
+  );
+
+  const handleCustomDataUpdate = (
+    key: number,
+    value: string,
+    source: string
+  ): void => {
+    if (action) {
+      dispatch(
+        characterActions.valueSet(
+          key,
+          value,
+          source,
+          ActionUtils.getMappingId(action),
+          ActionUtils.getMappingEntityTypeId(action)
+        )
+      );
+    }
+  };
+
+  const handleRemoveCustomizations = (): void => {
+    if (action) {
+      const mappingId = ActionUtils.getMappingId(action);
+      const mappingEntityTypeId = ActionUtils.getMappingEntityTypeId(action);
+
+      if (mappingId !== null && mappingEntityTypeId !== null) {
+        dispatch(
+          characterActions.actionCustomizationsDelete(
+            mappingId,
+            mappingEntityTypeId
+          )
+        );
+      }
+    }
+  };
+
+  const handleLimitedUseSet = (uses: number): void => {
+    if (action) {
+      const mappingId = ActionUtils.getMappingId(action);
+      const mappingEntityTypeId = ActionUtils.getMappingEntityTypeId(action);
+
+      if (mappingId === null || mappingEntityTypeId === null) {
+        return;
+      }
+
+      let dataOriginType = ActionUtils.getDataOriginType(action);
+
+      if (dataOriginType === DataOriginTypeEnum.ITEM) {
+        const dataOrigin = ActionUtils.getDataOrigin(action);
+        const itemData = dataOrigin.primary as BaseInventoryContract;
+
+        const item = ItemManager.getItem(ItemUtils.getMappingId(itemData));
+        item.handleItemLimitedUseSet(uses);
+      } else {
+        dispatch(
+          characterActions.actionUseSet(
+            mappingId,
+            mappingEntityTypeId,
+            uses,
+            dataOriginType
+          )
+        );
+      }
+    }
+  };
+
+  const handleParentClick = (): void => {
+    if (action) {
+      let dataOrigin = ActionUtils.getDataOrigin(action);
+      let component = getDataOriginComponentInfo(dataOrigin);
+      if (component.type !== PaneComponentEnum.ERROR_404) {
+        paneHistoryPush(component.type, component.identifiers);
+      }
+    }
+  };
+
+  if (!action) {
+    return <PaneInitFailureContent />;
+  }
+
+  //We could do the dataOrigin stuff better, this could be refactored
+  //Check ItemPane and InfusionPanes for similar usages of DataOrigin
+  const dataOrigin = ActionUtils.getDataOrigin(action);
+  const dataOriginType = ActionUtils.getDataOriginType(action);
+
+  let name: ReactNode = null;
+  if (ActionUtils.getName(action) !== "") {
+    name = <ActionName theme={characterTheme} action={action} />;
+  }
+
+  let parentName: string | null = null;
+  let parentClick: (() => void) | undefined = undefined;
+
+  if (dataOriginType === DataOriginTypeEnum.ITEM) {
+    const itemContract = dataOrigin.primary as BaseInventoryContract;
+    const itemMappingId = ItemUtils.getMappingId(itemContract);
+    const item = HelperUtils.lookupDataOrFallback(
+      inventoryLookup,
+      itemMappingId
+    );
+
+    if (item !== null) {
+      let infusion = ItemUtils.getInfusion(item);
+      if (infusion) {
+        parentName = `Infusion: ${InfusionUtils.getName(infusion)}`;
+        parentClick = handleParentClick;
+      }
+
+      if (name === null) {
+        name = <ItemName item={item} onClick={handleParentClick} />;
+      }
+    }
+  } else {
+    if (dataOrigin.primary) {
+      parentName = EntityUtils.getDataOriginName(dataOrigin);
+      parentClick = handleParentClick;
+    }
+  }
+
+  return (
+    <div key={ActionUtils.getUniqueKey(action)} {...props}>
+      <Header parent={parentName} onClick={parentClick}>
+        {name}
+      </Header>
+      <ActionDetail
+        theme={characterTheme}
+        action={action}
+        abilityLookup={abilityLookup}
+        showCustomize={dataOriginType !== DataOriginTypeEnum.ITEM}
+        onCustomDataUpdate={handleCustomDataUpdate}
+        onCustomizationsRemove={handleRemoveCustomizations}
+        ruleData={ruleData}
+        entityValueLookup={entityValueLookup}
+        inventoryLookup={inventoryLookup}
+        isReadonly={isReadonly}
+        onLimitedUseSet={handleLimitedUseSet}
+        proficiencyBonus={proficiencyBonus}
+      />
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/ArmorManagePane/ArmorClassDetail/ArmorClassDetail.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/ArmorManagePane/ArmorClassDetail/ArmorClassDetail.tsx
new file mode 100644
index 0000000..98ebf43
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/ArmorManagePane/ArmorClassDetail/ArmorClassDetail.tsx
@@ -0,0 +1,137 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, ReactNode } from "react";
+
+import { DataOriginName } from "@dndbeyond/character-components/es";
+import {
+  FormatUtils,
+  ItemUtils,
+  ModifierUtils,
+} from "@dndbeyond/character-rules-engine";
+
+import { ItemName } from "~/components/ItemName";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { ArmorClassExtraTypeEnum, ArmorClassTypeEnum } from "~/constants";
+import { useSidebar } from "~/contexts/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { PaneIdentifierUtils } from "~/tools/js/Shared/utils";
+import { Item, DataOrigin, Modifier } from "~/types";
+
+import { getDataOriginComponentInfo } from "../../../helpers/paneUtils";
+import { PaneComponentEnum } from "../../../types";
+import styles from "./styles.module.css";
+
+export interface ArmorClassDetailProps extends HTMLAttributes<HTMLDivElement> {}
+
+export const ArmorClassDetail: FC<ArmorClassDetailProps> = ({
+  className,
+  ...props
+}) => {
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  const { acAdjustments, acSuppliers, characterTheme } = useCharacterEngine();
+  let hasOverrideAcAdjustment =
+    acAdjustments.overrideAc && acAdjustments.overrideAc.value !== null;
+
+  const handleItemDetailShow = (item: Item): void => {
+    paneHistoryPush(
+      PaneComponentEnum.ITEM_DETAIL,
+      PaneIdentifierUtils.generateItem(ItemUtils.getMappingId(item))
+    );
+  };
+
+  const handleDataOriginShowDetail = (dataOrigin: DataOrigin): void => {
+    let component = getDataOriginComponentInfo(dataOrigin);
+    if (component.type !== PaneComponentEnum.ERROR_404) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  return (
+    <div
+      className={clsx([
+        styles.items,
+        hasOverrideAcAdjustment && styles.itemsOverridden,
+      ])}
+    >
+      {acSuppliers.map((armorSupplier, idx) => {
+        const { type, amount, extra, extraType } = armorSupplier;
+
+        if (!amount) {
+          return null;
+        }
+
+        let amountDisplay: ReactNode;
+        switch (type) {
+          case ArmorClassTypeEnum.ARMOR:
+          case ArmorClassTypeEnum.OVERRIDE_BASE_ARMOR:
+            amountDisplay = amount;
+            break;
+          default:
+            amountDisplay = <NumberDisplay type="signed" number={amount} />;
+        }
+
+        let extraDisplay: ReactNode;
+        switch (type) {
+          case ArmorClassTypeEnum.DEX_BONUS:
+            extraDisplay = extra === null ? "" : `Max ${extra}`;
+            break;
+
+          default:
+            switch (extraType) {
+              case ArmorClassExtraTypeEnum.MODIFIER:
+                extraDisplay = (
+                  <DataOriginName
+                    dataOrigin={ModifierUtils.getDataOrigin(extra as Modifier)}
+                    onClick={handleDataOriginShowDetail}
+                    theme={characterTheme}
+                  />
+                );
+                break;
+
+              case ArmorClassExtraTypeEnum.ITEM:
+                if (extra) {
+                  extraDisplay = (
+                    <ItemName
+                      item={extra as Item}
+                      onClick={() => handleItemDetailShow(extra as Item)}
+                    />
+                  );
+                } else {
+                  extraDisplay = "None";
+                }
+                break;
+
+              case ArmorClassExtraTypeEnum.NUMBER:
+                extraDisplay = extra
+                  ? FormatUtils.renderLocaleNumber(extra as number)
+                  : "";
+                break;
+
+              case ArmorClassExtraTypeEnum.STRING:
+              default:
+                extraDisplay = extra;
+            }
+            break;
+        }
+
+        return (
+          <div
+            className={styles.item}
+            key={idx}
+            {...props}
+            data-testid="armor-class-detail"
+          >
+            <div className={styles.value}>{amountDisplay}</div>
+            <div className={styles.label}>
+              <span>{type}</span>
+              {extraDisplay && (
+                <span className={styles.source}>({extraDisplay})</span>
+              )}
+            </div>
+          </div>
+        );
+      })}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/ArmorManagePane/ArmorManagePane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/ArmorManagePane/ArmorManagePane.tsx
new file mode 100644
index 0000000..13e2898
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/ArmorManagePane/ArmorManagePane.tsx
@@ -0,0 +1,106 @@
+import { FC, HTMLAttributes } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import { Collapsible } from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  ValueUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { AdjustmentTypeEnum, RuleKeyEnum } from "~/constants";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useRuleData } from "~/hooks/useRuleData";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import EditorBox from "~/tools/js/Shared/components/EditorBox";
+import ValueEditor from "~/tools/js/Shared/components/ValueEditor";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+
+import { ArmorClassDetail } from "./ArmorClassDetail";
+import styles from "./styles.module.css";
+
+/*
+This is the sidebar information for Armor Class. It displays the sources of any Armor Class bonuses and you can provide customizations and overrides here.
+*/
+
+interface ArmorManagePaneProps extends HTMLAttributes<HTMLDivElement> {}
+export const ArmorManagePane: FC<ArmorManagePaneProps> = ({ ...props }) => {
+  const dispatch = useDispatch();
+  const { acAdjustments, acTotal, valueLookup, ruleData } =
+    useCharacterEngine();
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const { ruleDataUtils } = useRuleData();
+
+  const acRule =
+    ruleDataUtils.getRule(RuleKeyEnum.ARMOR_CLASS, ruleData)?.description ??
+    null;
+
+  const customizationValues = [
+    AdjustmentTypeEnum.OVERRIDE_AC,
+    AdjustmentTypeEnum.OVERRIDE_BASE_ARMOR,
+    AdjustmentTypeEnum.MAGIC_BONUS_AC,
+    AdjustmentTypeEnum.MISC_BONUS_AC,
+  ];
+
+  let hasOverrideAcAdjustment: boolean =
+    acAdjustments.overrideAc !== null &&
+    acAdjustments.overrideAc.value !== null;
+  let overrideAcAdjustmentSource: string | null =
+    hasOverrideAcAdjustment && acAdjustments.overrideAc
+      ? acAdjustments.overrideAc.notes
+      : "";
+
+  const handleCustomDataUpdate = (
+    key: number,
+    value: string,
+    source: string
+  ): void => {
+    dispatch(characterActions.valueSet(key, value, source));
+  };
+  return (
+    <div {...props}>
+      <Header>
+        Armor Class: {acTotal}
+        {hasOverrideAcAdjustment ? "*" : ""}
+        {hasOverrideAcAdjustment && (
+          <span className={styles.headingOverride}>
+            (
+            {overrideAcAdjustmentSource
+              ? overrideAcAdjustmentSource
+              : "Override"}
+            )
+          </span>
+        )}
+      </Header>
+      <ArmorClassDetail />
+      {/* AC CUSTOMIZATION */}
+      {!isReadonly && (
+        <Collapsible
+          layoutType={"minimal"}
+          header="Customize"
+          className={styles.customize}
+        >
+          <EditorBox className={styles.editorBox}>
+            <ValueEditor
+              dataLookup={ValueUtils.getDataLookup(
+                valueLookup,
+                customizationValues
+              )}
+              onDataUpdate={handleCustomDataUpdate}
+              valueEditors={customizationValues}
+              ruleData={ruleData}
+            />
+          </EditorBox>
+        </Collapsible>
+      )}
+      {/* AC Description */}
+      {acRule && (
+        <HtmlContent
+          className={styles.description}
+          html={acRule}
+          withoutTooltips
+        />
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/BackgroundPane/BackgroundPane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/BackgroundPane/BackgroundPane.tsx
new file mode 100644
index 0000000..6cf323d
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/BackgroundPane/BackgroundPane.tsx
@@ -0,0 +1,75 @@
+import { FC, HTMLAttributes } from "react";
+
+import { BackgroundUtils } from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useRuleData } from "~/hooks/useRuleData";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+import { PaneInitFailureContent } from "~/subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+
+import { FeatureSnippetChoices } from "../../../../../../tools/js/CharacterSheet/components/FeatureSnippet";
+import styles from "./styles.module.css";
+
+/*
+This is the Sidebar display for Background. You can access this Pane by clicking on the Background data displayed in the Description tab section of the Character Sheet.
+*/
+
+interface BackgroundPaneProps extends HTMLAttributes<HTMLDivElement> {}
+export const BackgroundPane: FC<BackgroundPaneProps> = ({ ...props }) => {
+  const {
+    ruleData,
+    abilityLookup,
+    backgroundInfo,
+    snippetData,
+    originRef,
+    proficiencyBonus,
+    characterTheme,
+  } = useCharacterEngine();
+
+  const { ruleDataUtils } = useRuleData();
+
+  if (!backgroundInfo) {
+    return <PaneInitFailureContent />;
+  }
+
+  const hasCustomBackground =
+    BackgroundUtils.getHasCustomBackground(backgroundInfo);
+  const description = BackgroundUtils.getDescription(backgroundInfo);
+  const featureName = BackgroundUtils.getFeatureName(backgroundInfo);
+
+  return (
+    <div {...props}>
+      <Header>{BackgroundUtils.getName(backgroundInfo)}</Header>
+      <div className={styles.data}>
+        <div className={styles.choices}>
+          <FeatureSnippetChoices
+            choices={BackgroundUtils.getChoices(backgroundInfo)}
+            ruleData={ruleData}
+            abilityLookup={abilityLookup}
+            snippetData={snippetData}
+            sourceDataLookup={ruleDataUtils.getSourceDataLookup(ruleData)}
+            dataOriginRefData={originRef}
+            proficiencyBonus={proficiencyBonus}
+            theme={characterTheme}
+          />
+        </div>
+      </div>
+      {hasCustomBackground ? (
+        <div className={styles.customDescription}>{description}</div>
+      ) : (
+        <HtmlContent html={description ? description : ""} withoutTooltips />
+      )}
+      {hasCustomBackground && featureName && (
+        <div>
+          <Heading>Feature: {featureName}</Heading>
+          <HtmlContent
+            html={BackgroundUtils.getFeatureDescription(backgroundInfo) ?? ""}
+            withoutTooltips
+          />
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/BasicActionPane/BasicActionPane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/BasicActionPane/BasicActionPane.tsx
new file mode 100644
index 0000000..82966b7
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/BasicActionPane/BasicActionPane.tsx
@@ -0,0 +1,41 @@
+import { FC, HTMLAttributes } from "react";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useRuleData } from "~/hooks/useRuleData";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+
+import { PaneInitFailureContent } from "../../components/PaneInitFailureContent";
+import { PaneIdentifiersBasicAction } from "../../types";
+
+/*
+This is the Sidebar display for Basic Actions. You can see this Pane by clicking on the Basic Actions (actions, bonus actions, reactions, etc.) displayed in the Actions section of the Character Sheet. Examples of Basic Actions include Attack, Dash, Disengage, Dodge, Help, Hide, Ready, Search, Use an Object, etc.
+*/
+
+interface BasicActionPaneProps extends HTMLAttributes<HTMLDivElement> {
+  identifiers: PaneIdentifiersBasicAction | null;
+}
+
+export const BasicActionPane: FC<BasicActionPaneProps> = ({
+  identifiers,
+  ...props
+}) => {
+  const { ruleData } = useCharacterEngine();
+  const { ruleDataUtils } = useRuleData();
+
+  const action =
+    identifiers && ruleDataUtils.getBasicAction(identifiers.id, ruleData);
+
+  if (action === null) {
+    return <PaneInitFailureContent />;
+  }
+
+  return (
+    <div {...props}>
+      <Header>{action.name}</Header>
+      {action.description !== null && (
+        <HtmlContent html={action.description} withoutTooltips />
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/CampaignPane/CampaignCharacter/CampaignCharacter.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/CampaignPane/CampaignCharacter/CampaignCharacter.tsx
new file mode 100644
index 0000000..57d0fab
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/CampaignPane/CampaignCharacter/CampaignCharacter.tsx
@@ -0,0 +1,69 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+import { useSelector } from "react-redux";
+
+import { CharacterAvatarPortrait } from "@dndbeyond/character-components/es";
+
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+
+import styles from "./styles.module.css";
+
+/*
+This is a single character in the CampaignPane. It displays the character's avatar, name, and user name.
+
+*/
+
+export interface CampaignCharacterProps extends HTMLAttributes<HTMLDivElement> {
+  characterId: number;
+  avatarUrl: string;
+  characterName: string;
+  userName: string;
+}
+
+export const CampaignCharacter: FC<CampaignCharacterProps> = ({
+  characterId,
+  avatarUrl,
+  characterName,
+  userName,
+  className,
+  ...props
+}) => {
+  const { isDarkMode } = useCharacterTheme();
+  const currentCharacterId = useSelector(appEnvSelectors.getCharacterId);
+  const isCurrentCharacter = currentCharacterId === characterId;
+
+  return (
+    <div
+      className={clsx([
+        styles.character,
+        isCurrentCharacter && styles.current,
+        className,
+      ])}
+      key={characterId}
+      {...props}
+    >
+      <CharacterAvatarPortrait
+        className={styles.preview}
+        avatarUrl={avatarUrl}
+      />
+      <div className={styles.content}>
+        <div className={styles.name}>
+          {isCurrentCharacter ? (
+            <span>{characterName}</span>
+          ) : (
+            <a
+              href={`/characters/${characterId}`}
+              className={clsx([styles.link, isDarkMode && styles.darkMode])}
+              target="_blank"
+              rel="noreferrer"
+            >
+              {characterName}
+            </a>
+          )}
+        </div>
+        <div className={styles.user}>{userName}</div>
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/CampaignPane/CampaignPane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/CampaignPane/CampaignPane.tsx
new file mode 100644
index 0000000..89c70a8
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/CampaignPane/CampaignPane.tsx
@@ -0,0 +1,100 @@
+import { FC, HTMLAttributes } from "react";
+import { useSelector } from "react-redux";
+
+import {
+  DarkPlayButtonSvg,
+  LightPlayButtonSvg,
+} from "@dndbeyond/character-components/es";
+
+import { Button } from "~/components/Button/Button";
+import { HtmlContent } from "~/components/HtmlContent";
+import { PreferencePrivacyTypeEnum } from "~/constants";
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { PaneInitFailureContent } from "~/subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+import { NavigationUtils } from "~/tools/js/Shared/utils";
+import { CampaignCharacterContract } from "~/types";
+
+import { CampaignCharacter } from "./CampaignCharacter";
+import styles from "./styles.module.css";
+
+/*
+This is the Sidebar for a Campaign. If the character has joined a Campaign, you can click on the campaign button in the Character Sheet header to see this Sidebar. It displays the Campaign name, maps link, DM, and all characters in the campaign. If the character is the DM, they will see all characters in the campaign. If the character is not the DM, they will only see characters that have been set to public or campaign only.
+*/
+
+interface CampaignPaneProps extends HTMLAttributes<HTMLDivElement> {}
+export const CampaignPane: FC<CampaignPaneProps> = ({ ...props }) => {
+  const { campaign, campaignUtils } = useCharacterEngine();
+  const { isDarkMode } = useCharacterTheme();
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+
+  if (!campaign) {
+    return <PaneInitFailureContent />;
+  }
+
+  const characters = campaignUtils.getCharacters(campaign);
+  const description = campaignUtils.getDescription(campaign);
+
+  const filteredCharacters = characters
+    ? characters.filter(
+        (character) =>
+          character.privacyType === PreferencePrivacyTypeEnum.PUBLIC ||
+          character.privacyType === PreferencePrivacyTypeEnum.CAMPAIGN_ONLY
+      )
+    : [];
+
+  const orderedCharacters = filteredCharacters.sort((a, b) =>
+    (a.characterName ?? "").localeCompare(b.characterName ?? "")
+  );
+
+  return (
+    <div {...props}>
+      <div className={styles.header}>
+        <Header>Campaign</Header>
+        <Button
+          href={NavigationUtils.getLaunchGameUrl(campaign)}
+          target="_blank"
+          size="x-small"
+          variant="text"
+          className={styles.launchButton}
+          themed
+        >
+          {isDarkMode ? <LightPlayButtonSvg /> : <DarkPlayButtonSvg />}
+          <span>Launch Game</span>
+        </Button>
+      </div>
+      <div className={styles.name}>
+        {isReadonly ? (
+          campaignUtils.getName(campaign)
+        ) : (
+          <a
+            className={styles.link}
+            href={campaignUtils.getLink(campaign) ?? ""}
+          >
+            {campaignUtils.getName(campaign)}
+          </a>
+        )}
+      </div>
+      {!isReadonly && description !== null && (
+        <HtmlContent html={description} withoutTooltips />
+      )}
+      <div className={styles.dm}>
+        <span className={styles.dmLabel}>DM:</span>
+        <span>{campaignUtils.getDmUsername(campaign)}</span>
+      </div>
+      <div className={styles.characters}>
+        {orderedCharacters.map((character: CampaignCharacterContract) => (
+          <CampaignCharacter
+            key={character.characterId}
+            characterId={character.characterId}
+            avatarUrl={character.avatarUrl ?? ""}
+            characterName={character.characterName ?? ""}
+            userName={character.username ?? ""}
+          />
+        ))}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/CharacterManagePane/CharacterManagePane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/CharacterManagePane/CharacterManagePane.tsx
new file mode 100644
index 0000000..b1658cf
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/CharacterManagePane/CharacterManagePane.tsx
@@ -0,0 +1,247 @@
+import { ComponentType, FC, HTMLAttributes, ReactNode } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import { useNavigate } from "react-router-dom";
+
+import {
+  LightLinkOutSvg,
+  ThemedBackdropSvg,
+  ThemedBuilderSvg,
+  ThemedExportSvg,
+  ThemedFrameSvg,
+  ThemedLongRestSvg,
+  ThemedManageLevelSvg,
+  ThemedManageXpSvg,
+  ThemedPortraitSvg,
+  ThemedPreferencesSvg,
+  ThemedShareSvg,
+  ThemedShortRestSvg,
+  ThemedThemeIconSvg,
+  ThemedChatBubbleSvg,
+} from "@dndbeyond/character-components/es";
+import D6 from "@dndbeyond/fontawesome-cache/svgs/regular/dice-d6.svg";
+
+import { Button } from "~/components/Button";
+import config from "~/config";
+import {
+  PreferencePrivacyTypeEnum,
+  PreferenceProgressionTypeEnum,
+} from "~/constants";
+import { useSidebar } from "~/contexts/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { sheetAppSelectors } from "~/tools/js/CharacterSheet/selectors";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+import { CharacterStatusSlug } from "~/types";
+
+import {
+  PaneMenu,
+  PaneMenuGroup,
+  PaneMenuItem,
+} from "../../components/PaneMenu";
+import { PaneComponentEnum } from "../../types";
+import { Overview } from "./Overview";
+import styles from "./styles.module.css";
+
+const BASE_PATHNAME = config.basePathname;
+
+interface CharacterManagePaneProps extends HTMLAttributes<HTMLDivElement> {}
+
+export const CharacterManagePane: FC<CharacterManagePaneProps> = ({
+  ...props
+}) => {
+  const navigate = useNavigate();
+
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const builderUrl = useSelector(sheetAppSelectors.getBuilderUrl);
+
+  const {
+    preferences,
+    decorationInfo,
+    helperUtils,
+    decorationUtils,
+    characterStatusSlug: characterStatus,
+    characterTheme,
+  } = useCharacterEngine();
+
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+
+  const handleXpMenuClick = (): void => {
+    paneHistoryPush(PaneComponentEnum.XP);
+  };
+
+  const handleGameLogMenuClick = (): void => {
+    paneHistoryPush(PaneComponentEnum.GAME_LOG);
+  };
+
+  const handleShortRestMenuClick = (): void => {
+    paneHistoryPush(PaneComponentEnum.SHORT_REST);
+  };
+
+  const handleLongRestMenuClick = (): void => {
+    paneHistoryPush(PaneComponentEnum.LONG_REST);
+  };
+
+  const handlePreferencesMenuClick = (): void => {
+    paneHistoryPush(PaneComponentEnum.PREFERENCES);
+  };
+
+  const handleShareMenuClick = (): void => {
+    paneHistoryPush(PaneComponentEnum.SHARE_URL);
+  };
+
+  const handlePdfClick = (): void => {
+    paneHistoryPush(PaneComponentEnum.EXPORT_PDF);
+  };
+
+  const handleBuilderClick = (): void => {
+    navigate(builderUrl);
+  };
+
+  //USE A LOOKUP TO GET EACH MENU ICON
+  const getMenuIconNode = (menuKey: string): ReactNode => {
+    const menuIconLookup: Record<string, ComponentType> = {
+      builder: ThemedBuilderSvg,
+      shortrest: ThemedShortRestSvg,
+      longrest: ThemedLongRestSvg,
+      share: ThemedShareSvg,
+      managelevel: ThemedManageLevelSvg,
+      managexp: ThemedManageXpSvg,
+      gamelog: ThemedChatBubbleSvg,
+      frame: ThemedFrameSvg,
+      backdrop: ThemedBackdropSvg,
+      theme: ThemedThemeIconSvg,
+      portrait: ThemedPortraitSvg,
+      preferences: ThemedPreferencesSvg,
+      downloadpdf: ThemedExportSvg,
+    };
+
+    const IconNode: ComponentType<any> | null =
+      menuIconLookup[menuKey] &&
+      helperUtils.lookupDataOrFallback(menuIconLookup, menuKey);
+
+    if (IconNode === null) {
+      return null;
+    }
+
+    if (menuKey === "gamelog") {
+      return (
+        <D6
+          className="ddbc-svg ddbc-svg--themed"
+          style={{ fill: characterTheme.themeColor }}
+        />
+      );
+    }
+
+    return (
+      <IconNode theme={decorationUtils.getCharacterTheme(decorationInfo)} />
+    );
+  };
+
+  return (
+    <div
+      className={styles.characterManagePane}
+      data-testid="character-manage-pane"
+      {...props}
+    >
+      <Overview />
+      {/* Display Readonly CTA or MENU */}
+      {isReadonly ? (
+        <div className={styles.readonlyBackground}>
+          <div className={styles.readonlyContent}>
+            <div>
+              You are viewing a{" "}
+              {characterStatus === CharacterStatusSlug.PREMADE
+                ? "premade"
+                : "read-only"}{" "}
+              Character Sheet.
+            </div>
+            <Button
+              className={styles.createCTA}
+              size="medium"
+              variant="solid"
+              target="_blank"
+              themed
+              href={`${BASE_PATHNAME}/builder`}
+              forceThemeMode="dark"
+            >
+              <span>Create a Character</span>
+              <LightLinkOutSvg />
+            </Button>
+          </div>
+        </div>
+      ) : (
+        <PaneMenu>
+          <PaneMenuGroup label="My Character">
+            <PaneMenuItem
+              menukey="builder"
+              prefixIcon={getMenuIconNode("builder")}
+              suffixIcon={<LightLinkOutSvg />}
+              onClick={handleBuilderClick}
+            >
+              Manage Character & Levels
+            </PaneMenuItem>
+            {preferences.progressionType ===
+              PreferenceProgressionTypeEnum.XP && (
+              <PaneMenuItem
+                menukey="managexp"
+                prefixIcon={getMenuIconNode("managexp")}
+                onClick={handleXpMenuClick}
+              >
+                Manage Experience
+              </PaneMenuItem>
+            )}
+            <PaneMenuItem
+              menukey="preferences"
+              prefixIcon={getMenuIconNode("preferences")}
+              onClick={handlePreferencesMenuClick}
+            >
+              Character Settings
+            </PaneMenuItem>
+          </PaneMenuGroup>
+          <PaneMenuGroup label="Play">
+            <PaneMenuItem
+              menukey="gamelog"
+              prefixIcon={getMenuIconNode("gamelog")}
+              onClick={handleGameLogMenuClick}
+            >
+              Game Log
+            </PaneMenuItem>
+            <PaneMenuItem
+              menukey="shortrest"
+              prefixIcon={getMenuIconNode("shortrest")}
+              onClick={handleShortRestMenuClick}
+            >
+              Short Rest
+            </PaneMenuItem>
+            <PaneMenuItem
+              menukey="longrest"
+              prefixIcon={getMenuIconNode("longrest")}
+              onClick={handleLongRestMenuClick}
+            >
+              Long Rest
+            </PaneMenuItem>
+          </PaneMenuGroup>
+          <PaneMenuGroup label="Share">
+            {preferences.privacyType === PreferencePrivacyTypeEnum.PUBLIC && (
+              <PaneMenuItem
+                menukey="share"
+                prefixIcon={getMenuIconNode("share")}
+                onClick={handleShareMenuClick}
+              >
+                Shareable Link
+              </PaneMenuItem>
+            )}
+            <PaneMenuItem
+              menukey="downloadpdf"
+              prefixIcon={getMenuIconNode("downloadpdf")}
+              onClick={handlePdfClick}
+            >
+              Export to PDF
+            </PaneMenuItem>
+          </PaneMenuGroup>
+        </PaneMenu>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/CharacterManagePane/Overview/Overview.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/CharacterManagePane/Overview/Overview.tsx
new file mode 100644
index 0000000..feed2fd
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/CharacterManagePane/Overview/Overview.tsx
@@ -0,0 +1,280 @@
+import clsx from "clsx";
+import {
+  ChangeEvent,
+  FC,
+  HTMLAttributes,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import {
+  CharacterAvatarPortrait,
+  CharacterName,
+  CharacterProgressionSummary,
+  CharacterSummary,
+  LightPencilSvg,
+  ThemedPaintBrushSvg,
+} from "@dndbeyond/character-components/es";
+
+import { Button } from "~/components/Button/Button";
+import {
+  CharacterNameLimitMsg,
+  DeathCauseEnum,
+  InputLimits,
+} from "~/constants";
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+import { useSidebar } from "~/contexts/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useMaxLengthErrorHandling } from "~/hooks/useErrorHandling/useMaxLengthErrorHandling";
+import useUserId from "~/hooks/useUserId";
+import { appEnvActions } from "~/tools/js/Shared/actions";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+import { CharacterStatusSlug } from "~/types";
+
+import { Popover } from "../../../../../../../components/Popover";
+import { PopoverContent } from "../../../../../../../components/PopoverContent";
+import { PaneComponentEnum } from "../../../types";
+import styles from "./styles.module.css";
+
+export interface OverviewProps extends HTMLAttributes<HTMLDivElement> {}
+
+export const Overview: FC<OverviewProps> = ({ className, ...props }) => {
+  const {
+    ruleData,
+    characterName,
+    characterGender: gender,
+    race: species,
+    experienceInfo: xpInfo,
+    deathCause,
+    preferences,
+    decorationInfo,
+    playerName,
+    playerId,
+    characterActions,
+    decorationUtils,
+    classUtils,
+    classes,
+    characterStatusSlug: characterStatus,
+  } = useCharacterEngine();
+  const dispatch = useDispatch();
+
+  const { isDarkMode } = useCharacterTheme();
+
+  const userId = useUserId();
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const canOverrideReadOnly = useSelector(
+    appEnvSelectors.getCanOverrideReadOnly
+  );
+
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+
+  const { MaxLengthErrorMessage, hideError, handleMaxLengthErrorMsg } =
+    useMaxLengthErrorHandling(
+      (characterName?.length ?? 0) >= InputLimits.characterNameMaxLength,
+      InputLimits.characterNameMaxLength,
+      CharacterNameLimitMsg
+    );
+
+  const isUserCharacter = playerId === Number(userId);
+  const isPremade = characterStatus === CharacterStatusSlug.PREMADE;
+
+  const [isNameEditorVisible, setIsNameEditorVisible] = useState(false);
+
+  const inputRef = useRef<HTMLInputElement>(null);
+
+  useEffect(() => {
+    if (isNameEditorVisible && inputRef.current) {
+      inputRef.current.focus();
+    }
+  }, [isNameEditorVisible]);
+
+  const handleNameClick = (): void => {
+    setIsNameEditorVisible(true);
+  };
+
+  const handleNameChange = (evt: ChangeEvent<HTMLInputElement>): void => {
+    const inputValue = evt.target.value;
+
+    if (inputValue !== characterName && inputValue !== "") {
+      dispatch(characterActions.nameSet(inputValue));
+    }
+
+    setIsNameEditorVisible(false);
+    hideError();
+  };
+
+  const handleToggleEdit = (status: boolean): void => {
+    dispatch(appEnvActions.dataSet({ isReadonly: status }));
+  };
+
+  const handleNameUpdate = (evt: ChangeEvent<HTMLInputElement>): void => {
+    handleMaxLengthErrorMsg(evt.target.value);
+  };
+
+  const handleDecorateMenuClick = (): void => {
+    paneHistoryPush(PaneComponentEnum.DECORATE);
+  };
+
+  const isEditingCharacterName = useMemo(
+    () => isNameEditorVisible && !isReadonly,
+    [isNameEditorVisible, isReadonly]
+  );
+
+  return (
+    <div
+      className={clsx([styles.intro, isDarkMode && styles.dark, className])}
+      {...props}
+    >
+      <div className={styles.summary}>
+        <CharacterAvatarPortrait
+          className={styles.avatar}
+          avatarUrl={decorationUtils.getAvatarInfo(decorationInfo).avatarUrl}
+        />
+        {
+          <div
+            className={clsx([
+              styles.characterName,
+              isEditingCharacterName && styles.editName,
+            ])}
+            onClick={isReadonly ? undefined : handleNameClick}
+          >
+            {isEditingCharacterName ? (
+              <>
+                <input
+                  ref={inputRef}
+                  type="text"
+                  defaultValue={characterName ?? ""}
+                  maxLength={InputLimits.characterNameMaxLength}
+                  onBlur={handleNameChange}
+                  onChange={handleNameUpdate}
+                  onFocus={handleNameUpdate}
+                />
+                <MaxLengthErrorMessage />
+              </>
+            ) : (
+              <>
+                <CharacterName
+                  name={characterName ?? ""}
+                  isDead={deathCause !== DeathCauseEnum.NONE}
+                  isFaceMenu={true}
+                />
+                {!isReadonly && <LightPencilSvg />}
+              </>
+            )}
+          </div>
+        }
+        {/* DISPLAY PLAYER NAME IF ITS NOT A PREMADE OR YOUR CHARACTER */}
+        {!isUserCharacter && !isPremade && (
+          <div>
+            <span className={styles.playerNameLabel}>Player: </span>
+            {playerName}
+          </div>
+        )}
+        {/* SHOW SPECIES, GENDER AND XP/LEVEL INFO */}
+        <div className={styles.description}>
+          <CharacterSummary
+            className={styles.summaryText}
+            classes={null}
+            species={species}
+            gender={gender}
+          />
+          <CharacterProgressionSummary
+            ruleData={ruleData}
+            progressionType={preferences.progressionType}
+            xpInfo={xpInfo}
+          />
+        </div>
+      </div>
+      {/* DISPLAY CLASS LIST */}
+      <div className={styles.classList}>
+        {classes.map((charClass) => (
+          <div className={styles.classItem} key={classUtils.getId(charClass)}>
+            <div
+              className={styles.classImage}
+              style={{
+                backgroundImage: `url(${classUtils.getPortraitUrl(charClass)})`,
+              }}
+            >
+              <div className={styles.classLevel}>
+                {classUtils.getLevel(charClass)}
+              </div>
+            </div>
+            <div className={styles.classSummary}>
+              <div>{classUtils.getName(charClass)}</div>
+              <div className={styles.classMeta}>
+                {classUtils.getSubclassName(charClass) ?? "No Subclass"}
+              </div>
+            </div>
+          </div>
+        ))}
+      </div>
+      <div className={styles.buttonGroup}>
+        {/* This is only for PREMADE characters */}
+        {canOverrideReadOnly && (
+          <div className={styles.featureCallout}>
+            {isReadonly ? (
+              <Popover
+                trigger={
+                  <Button
+                    size="x-small"
+                    variant="solid"
+                    className={clsx([styles.toggleButton])}
+                    forceThemeMode="dark"
+                  >
+                    <LightPencilSvg />
+                    <span>Enable Edit Premade</span>
+                  </Button>
+                }
+                maxWidth={284}
+                className={styles.popoverToggle}
+              >
+                <PopoverContent
+                  title="PROCEED WITH CAUTION!!!"
+                  content="⚠️ If you enable editing you will be modifying a published character ⚠️"
+                  confirmText="Enable"
+                  onConfirm={() => handleToggleEdit(false)}
+                  withCancel
+                />
+              </Popover>
+            ) : (
+              <Button
+                size="x-small"
+                variant="solid"
+                className={clsx([styles.toggleButton])}
+                forceThemeMode="dark"
+                onClick={() => handleToggleEdit(true)}
+              >
+                <LightPencilSvg />
+                <span>DISABLE Edit Premade</span>
+              </Button>
+            )}
+          </div>
+        )}
+
+        {/* DISPLAY DECORATE BUTTON AS A "FEATURE CALLOUT" */}
+        {!isReadonly && (
+          <div className={styles.featureCallout}>
+            <Button
+              size="x-small"
+              variant="outline"
+              className={styles.decorateButton}
+              forceThemeMode="dark"
+              themed
+              onClick={handleDecorateMenuClick}
+            >
+              <ThemedPaintBrushSvg
+                theme={decorationUtils.getCharacterTheme(decorationInfo)}
+              />
+              <span>Change Sheet Appearance</span>
+            </Button>
+          </div>
+        )}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/ClassFeaturePane/ClassFeaturePane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/ClassFeaturePane/ClassFeaturePane.tsx
new file mode 100644
index 0000000..f5f25a1
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/ClassFeaturePane/ClassFeaturePane.tsx
@@ -0,0 +1,385 @@
+import {
+  FC,
+  HTMLAttributes,
+  useContext,
+  useEffect,
+  useRef,
+  useState,
+} from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import {
+  ApiAdapterUtils,
+  FeatManager,
+} from "@dndbeyond/character-rules-engine";
+
+import { FeatureChoice } from "~/components/FeatureChoice";
+import { BuilderChoiceTypeEnum } from "~/constants";
+import { useSidebar } from "~/contexts/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Preview } from "~/subApps/sheet/components/Sidebar/components/Preview";
+import DataLoadingStatusEnum from "~/tools/js/Shared/constants/DataLoadingStatusEnum";
+import { CharacterFeaturesManagerContext } from "~/tools/js/Shared/managers/CharacterFeaturesManagerContext";
+import { apiCreatorSelectors } from "~/tools/js/Shared/selectors";
+import { AppLoggerUtils, PaneIdentifierUtils } from "~/tools/js/Shared/utils";
+import LoadingPlaceholder from "~/tools/js/smartComponents/LoadingPlaceholder";
+import {
+  Action,
+  CharClass,
+  ClassDefinitionContract,
+  ClassFeature,
+  Feat,
+  InfusionChoice,
+  Spell,
+} from "~/types";
+
+import { ClassFeatureSnippet } from "../../../../../../tools/js/CharacterSheet/components/FeatureSnippet";
+import { appEnvSelectors } from "../../../../../../tools/js/Shared/selectors";
+import { Heading } from "../../components/Heading";
+import { PaneInitFailureContent } from "../../components/PaneInitFailureContent";
+import { PaneComponentEnum, PaneIdentifiersClassFeature } from "../../types";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  identifiers: PaneIdentifiersClassFeature | null;
+}
+export const ClassFeaturePane: FC<Props> = ({ identifiers, ...props }) => {
+  const dispatch = useDispatch();
+  const {
+    infusionChoiceUtils,
+    actionUtils,
+    characterActions,
+    spellUtils,
+    classUtils,
+    classFeatureUtils,
+    classes,
+    feats,
+    snippetData,
+    ruleData,
+    abilityLookup,
+    proficiencyBonus,
+    originRef: dataOriginRefData,
+    characterTheme: theme,
+    choiceUtils,
+    featUtils,
+    helperUtils,
+  } = useCharacterEngine();
+
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+
+  const loadAvailableFeats = useSelector(
+    apiCreatorSelectors.makeLoadAvailableFeats
+  );
+  const loadAvailableSubclasses = useSelector(
+    apiCreatorSelectors.makeLoadAvailableSubclasses
+  );
+
+  const [subclassData, setSubclassData] = useState<
+    Array<ClassDefinitionContract>
+  >([]);
+  const [featsData, setFeatsData] = useState<Array<Feat>>([]);
+  const [featLoadingStatus, setFeatLoadingStatus] =
+    useState<DataLoadingStatusEnum>(DataLoadingStatusEnum.NOT_INITIALIZED);
+  const [subclassLoadingStatus, setSubclassLoadingStatus] =
+    useState<DataLoadingStatusEnum>(DataLoadingStatusEnum.NOT_INITIALIZED);
+  const currentCharClass = useRef<CharClass | null>(null);
+
+  const charClass = identifiers?.classMappingId
+    ? classes.find(
+        (charClass) =>
+          identifiers.classMappingId === classUtils.getMappingId(charClass)
+      )
+    : null;
+
+  const classFeature =
+    charClass?.classFeatures.find(
+      (feature) => identifiers?.id === classFeatureUtils.getId(feature)
+    ) ?? null;
+
+  const featureChoices = classFeature
+    ? classFeatureUtils.getChoices(classFeature)
+    : [];
+
+  const hasFeatChoice = featureChoices.some(
+    (choice) =>
+      choiceUtils.getType(choice) === BuilderChoiceTypeEnum.FEAT_CHOICE_OPTION
+  );
+
+  const hasSubclassChoice = featureChoices.some(
+    (choice) =>
+      choiceUtils.getType(choice) === BuilderChoiceTypeEnum.SUB_CLASS_OPTION
+  );
+
+  useEffect(() => {
+    const isSameClass = (
+      c1: CharClass | null,
+      c2: CharClass | null
+    ): boolean => {
+      if (!c1 || !c2) return false;
+      return classUtils.getId(c1) === classUtils.getId(c2);
+    };
+
+    if (
+      hasFeatChoice &&
+      featLoadingStatus === DataLoadingStatusEnum.NOT_INITIALIZED
+    ) {
+      setFeatLoadingStatus(DataLoadingStatusEnum.LOADING);
+
+      loadAvailableFeats({
+        //   cancelToken: new axios.CancelToken((c) => {
+        //     this.loadFeatsCanceler = c;
+        //   }),
+      })
+        .then((response) => {
+          let featsData: Array<Feat> = [];
+
+          const data = ApiAdapterUtils.getResponseData(response);
+          if (data !== null) {
+            featsData = data.map((definition) =>
+              featUtils.simulateFeat(definition)
+            );
+          }
+
+          setFeatsData(featsData);
+          setFeatLoadingStatus(DataLoadingStatusEnum.LOADED);
+          //   this.loadFeatsCanceler = null;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    }
+
+    if (
+      charClass &&
+      !isSameClass(charClass, currentCharClass.current) && // Only pull data if the class has changed from previous fetch
+      hasSubclassChoice &&
+      subclassLoadingStatus !== DataLoadingStatusEnum.LOADING // Check if its not already fetching data
+    ) {
+      currentCharClass.current = charClass; //Update ref of fetched class
+      setSubclassLoadingStatus(DataLoadingStatusEnum.LOADING);
+
+      loadAvailableSubclasses(classUtils.getId(charClass), {
+        // cancelToken: new axios.CancelToken((c) => {
+        //   this.loadSubclassesCanceler = c;
+        // }),
+      })
+        .then((response) => {
+          let subclassData: Array<ClassDefinitionContract> = [];
+
+          const data = ApiAdapterUtils.getResponseData(response);
+          if (data !== null) {
+            subclassData = data;
+          }
+
+          setSubclassData(subclassData);
+          setSubclassLoadingStatus(DataLoadingStatusEnum.LOADED);
+          //   this.loadSubclassesCanceler = null;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    }
+  }, [
+    hasFeatChoice,
+    hasSubclassChoice,
+    subclassLoadingStatus,
+    featLoadingStatus,
+    charClass,
+    classUtils,
+    featUtils,
+    loadAvailableFeats,
+    loadAvailableSubclasses,
+    currentCharClass,
+  ]);
+
+  const handleInfusionChoiceShow = (infusionChoice: InfusionChoice): void => {
+    const choiceKey = infusionChoiceUtils.getKey(infusionChoice);
+    if (choiceKey !== null) {
+      paneHistoryPush(
+        PaneComponentEnum.INFUSION_CHOICE,
+        PaneIdentifierUtils.generateInfusionChoice(choiceKey)
+      );
+    }
+  };
+
+  const handleChoiceChange = (
+    id: string,
+    type: number,
+    value: any,
+    parentChoiceId: string | null
+  ): void => {
+    if (!charClass || !classFeature) {
+      return;
+    }
+    dispatch(
+      characterActions.classFeatureChoiceSetRequest(
+        classUtils.getActiveId(charClass),
+        classFeatureUtils.getId(classFeature),
+        type,
+        id,
+        helperUtils.parseInputInt(value),
+        parentChoiceId
+      )
+    );
+  };
+
+  const handleActionUseSet = (action: Action, uses: number): void => {
+    const id = actionUtils.getId(action);
+    const entityTypeId = actionUtils.getEntityTypeId(action);
+    if (id !== null && entityTypeId !== null) {
+      dispatch(
+        characterActions.actionUseSet(
+          id,
+          entityTypeId,
+          uses,
+          actionUtils.getDataOriginType(action)
+        )
+      );
+    }
+  };
+
+  const handleSpellUseSet = (spell: Spell, uses: number): void => {
+    const mappingId = spellUtils.getMappingId(spell);
+    const mappingEntityTypeId = spellUtils.getMappingEntityTypeId(spell);
+    const dataOriginType = spellUtils.getDataOriginType(spell);
+
+    if (mappingId && mappingEntityTypeId && dataOriginType) {
+      dispatch(
+        characterActions.spellUseSet(
+          mappingId,
+          mappingEntityTypeId,
+          uses,
+          dataOriginType
+        )
+      );
+    }
+  };
+
+  const handleSpellDetailShow = (spell: Spell): void => {
+    const mappingId = spellUtils.getMappingId(spell);
+    if (mappingId !== null) {
+      paneHistoryPush(
+        PaneComponentEnum.CHARACTER_SPELL_DETAIL,
+        PaneIdentifierUtils.generateCharacterSpell(mappingId)
+      );
+    }
+  };
+
+  const handleClassFeatureShow = (
+    feature: ClassFeature,
+    charClass: CharClass
+  ): void => {
+    paneHistoryPush(
+      PaneComponentEnum.CLASS_FEATURE_DETAIL,
+      PaneIdentifierUtils.generateClassFeature(
+        classFeatureUtils.getId(feature),
+        classUtils.getMappingId(charClass)
+      )
+    );
+  };
+
+  const handleActionShow = (action: Action): void => {
+    const mappingId = actionUtils.getMappingId(action);
+    const mappingEntityTypeId = actionUtils.getMappingEntityTypeId(action);
+
+    if (mappingId !== null && mappingEntityTypeId !== null) {
+      paneHistoryPush(
+        PaneComponentEnum.ACTION,
+        PaneIdentifierUtils.generateAction(mappingId, mappingEntityTypeId)
+      );
+    }
+  };
+
+  const handleFeatShow = (feat: FeatManager): void => {
+    paneHistoryPush(
+      PaneComponentEnum.FEAT_DETAIL,
+      PaneIdentifierUtils.generateFeat(feat.getId())
+    );
+  };
+
+  const isDataLoaded = (): boolean => {
+    if (hasSubclassChoice) {
+      if (subclassLoadingStatus !== DataLoadingStatusEnum.LOADED) {
+        return false;
+      }
+    }
+    if (hasFeatChoice) {
+      if (featLoadingStatus !== DataLoadingStatusEnum.LOADED) {
+        return false;
+      }
+    }
+
+    return true;
+  };
+
+  if (!charClass || !classFeature) {
+    return <PaneInitFailureContent />;
+  }
+
+  return (
+    <div
+      key={`${classUtils.getMappingId(charClass)}-${classFeatureUtils.getId(
+        classFeature
+      )}`}
+      {...props}
+    >
+      <Header
+        parent={classUtils.getName(charClass)}
+        preview={<Preview imageUrl={classUtils.getPortraitUrl(charClass)} />}
+      >
+        {classFeatureUtils.getName(classFeature)}
+      </Header>
+      <ClassFeatureSnippet
+        charClass={charClass}
+        feature={classFeature}
+        onActionUseSet={handleActionUseSet}
+        onActionClick={handleActionShow}
+        onSpellClick={handleSpellDetailShow}
+        onSpellUseSet={handleSpellUseSet}
+        onFeatureClick={handleClassFeatureShow}
+        onInfusionChoiceClick={handleInfusionChoiceShow}
+        showHeader={false}
+        showDescription={true}
+        feats={feats}
+        snippetData={snippetData}
+        ruleData={ruleData}
+        abilityLookup={abilityLookup}
+        dataOriginRefData={dataOriginRefData}
+        isReadonly={isReadonly}
+        proficiencyBonus={proficiencyBonus}
+        theme={theme}
+        onFeatClick={handleFeatShow}
+        featuresManager={characterFeaturesManager}
+      />
+      {!isReadonly && featureChoices.length > 0 && (
+        <>
+          <Heading className={styles.heading}>{`Option${
+            featureChoices.length > 1 ? "s" : ""
+          }`}</Heading>
+          {isDataLoaded() ? (
+            featureChoices.map((choice) => (
+              <FeatureChoice
+                charClass={charClass}
+                choice={choice}
+                feature={classFeature}
+                featsData={featsData}
+                subclassData={subclassData}
+                className={styles.choice}
+                key={choiceUtils.getId(choice)}
+                onChoiceChange={handleChoiceChange}
+                collapseDescription={true}
+              />
+            ))
+          ) : (
+            <LoadingPlaceholder />
+          )}
+        </>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/CreaturePane/CreaturePane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/CreaturePane/CreaturePane.tsx
new file mode 100644
index 0000000..e9d9453
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/CreaturePane/CreaturePane.tsx
@@ -0,0 +1,606 @@
+import clsx from "clsx";
+import {
+  FC,
+  Fragment,
+  HTMLAttributes,
+  useCallback,
+  useEffect,
+  useState,
+} from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import {
+  Collapsible,
+  CollapsibleHeaderCallout,
+  CollapsibleHeaderContent,
+  CreatureName,
+  InfusionPreview,
+} from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  Constants,
+  Creature,
+  CreatureUtils,
+  InfusionUtils,
+  serviceDataActions,
+  SourceUtils,
+  ValueUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Button } from "~/components/Button";
+import { EditableName } from "~/components/EditableName";
+import { HtmlContent } from "~/components/HtmlContent";
+import { Reference } from "~/components/Reference";
+import { TagGroup } from "~/components/TagGroup";
+import { useSidebar } from "~/contexts/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { CreatureBlock } from "~/subApps/sheet/components/CreatureBlock";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+import { Preview } from "~/subApps/sheet/components/Sidebar/components/Preview";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersCreature,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import CustomizeDataEditor from "../../../../../../tools/js/Shared/components/CustomizeDataEditor";
+import EditorBox from "../../../../../../tools/js/Shared/components/EditorBox";
+import ValueEditor from "../../../../../../tools/js/Shared/components/ValueEditor";
+import { RemoveButton } from "../../../../../../tools/js/Shared/components/common/Button";
+import { appEnvSelectors } from "../../../../../../tools/js/Shared/selectors";
+import { PaneIdentifierUtils } from "../../../../../../tools/js/Shared/utils";
+import { DeathSummary } from "../../../HitPointsBox/DeathSummary";
+import { HitPointsSummary } from "../../../HitPointsBox/HitPointsSummary";
+import { PaneInitFailureContent } from "../../components/PaneInitFailureContent";
+import { QuickActions } from "../../components/QuickActions";
+import { HitPointsAdjuster } from "../HitPointsManagePane/HitPointsAdjuster";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  identifiers: PaneIdentifiersCreature | null;
+}
+
+export const CreaturePane: FC<Props> = ({ identifiers, ...props }) => {
+  const { pane } = useSidebar();
+
+  const {
+    ruleData,
+    creatures,
+    entityValueLookup,
+    snippetData,
+    infusionChoiceLookup,
+    proficiencyBonus,
+    characterTheme: theme,
+    hpInfo,
+    deathCause,
+  } = useCharacterEngine();
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const dispatch = useDispatch();
+
+  const getCreature = useCallback((): Creature | null => {
+    return (
+      creatures.find(
+        (creature) => identifiers?.id === CreatureUtils.getMappingId(creature)
+      ) ?? null
+    );
+  }, [creatures, identifiers]);
+
+  const [creature, setCreature] = useState<Creature | null>(getCreature());
+  const [isCustomizeClosed, setIsCustomizeClosed] = useState(true);
+
+  useEffect(() => {
+    const foundCreature = getCreature();
+
+    setCreature(foundCreature);
+  }, [getCreature]);
+
+  const getData = (): Record<string, any> => {
+    if (!creature) {
+      return {};
+    }
+
+    return {
+      name: CreatureUtils.getName(creature),
+      description: creature.description,
+      groupId: CreatureUtils.getGroupId(creature),
+    };
+  };
+
+  const handleToggleCustomize = () => {
+    setIsCustomizeClosed(!isCustomizeClosed);
+  };
+
+  const dispatchTempHp = (value: number): void => {
+    if (!creature) {
+      return;
+    }
+
+    const useOwnerHp = CreatureUtils.getUseOwnerHp(creature);
+    const id = CreatureUtils.getMappingId(creature);
+    const hitPointInfo = useOwnerHp
+      ? hpInfo
+      : CreatureUtils.getHitPointInfo(creature);
+
+    dispatch(
+      useOwnerHp
+        ? characterActions.hitPointsSet(hitPointInfo.removedHp, value)
+        : characterActions.creatureHitPointsSet(
+            id,
+            hitPointInfo.removedHp,
+            value
+          )
+    );
+  };
+
+  const handleQuickTempAction = (value: number): void => {
+    dispatchTempHp(value);
+  };
+
+  const handleSaveProperties = (properties: Record<string, any>): void => {
+    if (!creature) {
+      return;
+    }
+
+    const data = getData();
+    const prevData: Record<string, any> = data || {};
+
+    const newProperties: Record<string, any> = {
+      ...prevData,
+      ...properties,
+    };
+
+    dispatch(
+      characterActions.creatureDataSet(
+        CreatureUtils.getMappingId(creature),
+        newProperties as any
+      )
+    );
+  };
+
+  const handleDataUpdate = (data: Record<string, any>): void => {
+    if (!data.name) {
+      data.name = null;
+    }
+
+    handleSaveProperties(data);
+  };
+
+  const handleCustomDataUpdate = (
+    key: number,
+    value: string,
+    source: string | null
+  ): void => {
+    if (!creature) {
+      return;
+    }
+
+    dispatch(
+      characterActions.valueSet(
+        key,
+        value,
+        source,
+        ValueUtils.hack__toString(CreatureUtils.getMappingId(creature)),
+        ValueUtils.hack__toString(
+          CreatureUtils.getMappingEntityTypeId(creature)
+        )
+      )
+    );
+  };
+
+  const handleRemoveCustomizations = (): void => {
+    if (creature) {
+      dispatch(
+        characterActions.creatureCustomizationsDelete(
+          CreatureUtils.getMappingId(creature),
+          CreatureUtils.getMappingEntityTypeId(creature)
+        )
+      );
+    }
+  };
+
+  const handleRemove = (): void => {
+    if (!creature) {
+      return;
+    }
+
+    pane.paneHistoryStart(PaneComponentEnum.EXTRA_MANAGE);
+    dispatch(
+      characterActions.creatureRemove(CreatureUtils.getMappingId(creature))
+    );
+  };
+
+  const handleRemoveInfusion = (): void => {
+    if (!creature) {
+      return;
+    }
+
+    const infusion = CreatureUtils.getInfusion(creature);
+    if (infusion) {
+      const infusionId = InfusionUtils.getId(infusion);
+      if (infusionId === null) {
+        return;
+      }
+
+      const choiceKey = InfusionUtils.getChoiceKey(infusion);
+      if (choiceKey !== null) {
+        pane.paneHistoryStart(
+          PaneComponentEnum.INFUSION_CHOICE,
+          PaneIdentifierUtils.generateInfusionChoice(choiceKey)
+        );
+      }
+      dispatch(
+        serviceDataActions.infusionMappingDestroy(
+          infusionId,
+          InfusionUtils.getInventoryMappingId(infusion)
+        )
+      );
+    }
+  };
+
+  const handleInfusionClick = (): void => {
+    if (!creature) {
+      return;
+    }
+
+    const infusion = CreatureUtils.getInfusion(creature);
+    if (infusion) {
+      const choiceKey = InfusionUtils.getChoiceKey(infusion);
+      if (choiceKey !== null) {
+        pane.paneHistoryPush(
+          PaneComponentEnum.INFUSION_CHOICE,
+          PaneIdentifierUtils.generateInfusionChoice(choiceKey)
+        );
+      }
+    }
+  };
+
+  const handleDeathSummaryClick = (evt: React.MouseEvent): void => {
+    if (!isReadonly) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      pane.paneHistoryPush(PaneComponentEnum.HEALTH_MANAGE);
+    }
+  };
+
+  const renderHealthAdjuster = (): React.ReactNode => {
+    if (!creature) {
+      return null;
+    }
+
+    const creatureHpInfo = CreatureUtils.getHitPointInfo(creature);
+
+    // Key to check if the creature has useOwnerHp set to true
+    const creatureGroupName = CreatureUtils.getGroupInfo(creature)?.name;
+    const useOwnerHp = CreatureUtils.getUseOwnerHp(creature);
+    const initialTempHp = CreatureUtils.getInitialTempHp(creature);
+
+    const hp = useOwnerHp ? hpInfo : creatureHpInfo;
+
+    const tempHp = hp.tempHp ?? 0;
+
+    const extraNode: React.ReactNode = (
+      <>
+        <span className={clsx([tempHp > 0 && styles.hasTempHp])}>
+          {hp.remainingHp + tempHp}
+        </span>
+        <span className={styles.valueSep}>/</span>
+        <span className={clsx([tempHp > 0 && styles.hasTempHp])}>
+          {hp.totalHp + tempHp}
+        </span>
+      </>
+    );
+
+    const headerCalloutNode: React.ReactNode = (
+      <CollapsibleHeaderCallout extra={extraNode} value={null} />
+    );
+
+    const headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent
+        heading="Hit Points"
+        callout={headerCalloutNode}
+      />
+    );
+
+    return (
+      <div className={clsx([styles.adjuster, styles.hasSeparator])}>
+        <Collapsible header={headerNode}>
+          {useOwnerHp &&
+          (deathCause === Constants.DeathCauseEnum.CONDITION ||
+            hpInfo.remainingHp <= 0) ? (
+            <DeathSummary
+              className={styles.deathSummary}
+              onClick={handleDeathSummaryClick}
+            />
+          ) : (
+            <div className={styles.hitPointsContainer}>
+              {creatureGroupName === Constants.DB_STRING_WILDSHAPE_2024 &&
+                useOwnerHp && (
+                  <p className={clsx([styles.wildshapeInfo, styles.block])}>
+                    Wild Shape modifies your character's HP. Your sheet will
+                    reflect these changes.
+                  </p>
+                )}
+              <HitPointsSummary
+                hpInfo={hp}
+                creature={useOwnerHp ? undefined : creature}
+                showPermanentInputs
+              />
+              {!isReadonly && (
+                <HitPointsAdjuster
+                  hpInfo={hp}
+                  creature={useOwnerHp ? undefined : creature}
+                />
+              )}
+              {creatureGroupName === Constants.DB_STRING_WILDSHAPE_2024 &&
+                initialTempHp !== 0 && (
+                  <p className={styles.wildshapeInfo}>
+                    When you assume a Wild Shape form, you gain{" "}
+                    <b>{initialTempHp}</b> Temporary HP.
+                  </p>
+                )}
+              {!isReadonly && renderQuickActions()}
+            </div>
+          )}
+        </Collapsible>
+      </div>
+    );
+  };
+
+  const renderQuickActions = (): React.ReactNode => {
+    if (!creature) {
+      return null;
+    }
+
+    // If initialTempHp exists and is not 0, render a button to add the initial temp hp to the creature.
+    const initialTempHp = CreatureUtils.getInitialTempHp(creature);
+    if (!initialTempHp) {
+      return null;
+    }
+
+    const actions = [] as {
+      label: string;
+      onClick: () => void;
+      disabled: boolean;
+    }[];
+
+    actions.push({
+      label: `Set Temp HP to ${initialTempHp}`,
+      onClick: () => handleQuickTempAction(initialTempHp),
+      disabled: false,
+    });
+
+    return <QuickActions actions={actions}></QuickActions>;
+  };
+
+  const renderDescription = (
+    label: React.ReactNode,
+    description: string | null
+  ): React.ReactNode => {
+    if (!description) {
+      return null;
+    }
+
+    return (
+      <div className={styles.description}>
+        {label && <Heading>{label}</Heading>}
+        <HtmlContent html={description} withoutTooltips />
+      </div>
+    );
+  };
+
+  const renderTags = (): React.ReactNode => {
+    if (!creature) {
+      return null;
+    }
+
+    const tags = CreatureUtils.getTags(creature);
+    const envTags = CreatureUtils.getEnvironmentTags(creature);
+
+    return (
+      <>
+        {tags.length > 0 && <TagGroup label="Tags" tags={tags} />}
+        {envTags.length > 0 && <TagGroup label="Habitats" tags={envTags} />}
+      </>
+    );
+  };
+
+  const renderCustomize = (): React.ReactNode => {
+    if (isReadonly || !creature) {
+      return null;
+    }
+
+    const useOwnerHp = CreatureUtils.getUseOwnerHp(creature);
+
+    const optionRestrictions: Record<number, Array<number> | null> = {};
+    const groupInfo = CreatureUtils.getGroupInfo(creature);
+    if (groupInfo?.monsterTypes?.length) {
+      optionRestrictions[Constants.AdjustmentTypeEnum.CREATURE_TYPE_OVERRIDE] =
+        groupInfo.monsterTypes;
+    }
+
+    const isCustomized = CreatureUtils.isCustomized(creature);
+
+    const valueEditors = [
+      Constants.AdjustmentTypeEnum.CREATURE_SIZE,
+      Constants.AdjustmentTypeEnum.CREATURE_TYPE_OVERRIDE,
+      Constants.AdjustmentTypeEnum.CREATURE_ALIGNMENT,
+      Constants.AdjustmentTypeEnum.CREATURE_AC,
+      Constants.AdjustmentTypeEnum.CREATURE_HIT_POINTS,
+      Constants.AdjustmentTypeEnum.CREATURE_NOTES,
+    ];
+    // Filter out hitpoints if the creature has useOwnerHp set to true
+    if (useOwnerHp) {
+      valueEditors.splice(
+        valueEditors.indexOf(Constants.AdjustmentTypeEnum.CREATURE_HIT_POINTS),
+        1
+      );
+    }
+    const labelOverrides = {
+      [Constants.AdjustmentTypeEnum.CREATURE_AC]: "Armor Class",
+      [Constants.AdjustmentTypeEnum.CREATURE_ALIGNMENT]: "Alignment",
+      [Constants.AdjustmentTypeEnum.CREATURE_HIT_POINTS]: "Max HP",
+      [Constants.AdjustmentTypeEnum.CREATURE_SIZE]: "Size",
+      [Constants.AdjustmentTypeEnum.CREATURE_TYPE_OVERRIDE]: "Type",
+      [Constants.AdjustmentTypeEnum.CREATURE_NOTES]: "Notes",
+    };
+
+    return (
+      <div className={styles.hasSeparator}>
+        <Collapsible
+          layoutType={"minimal"}
+          header={`Customize${isCustomized ? "*" : ""}`}
+          collapsed={isCustomizeClosed}
+          onChangeHandler={handleToggleCustomize}
+        >
+          <EditorBox className={styles.editor}>
+            <CustomizeDataEditor
+              data={getData()}
+              enableName={true}
+              onDataUpdate={handleDataUpdate}
+            />
+            <ValueEditor
+              dataLookup={ValueUtils.getEntityData(
+                entityValueLookup,
+                ValueUtils.hack__toString(CreatureUtils.getMappingId(creature)),
+                ValueUtils.hack__toString(
+                  CreatureUtils.getMappingEntityTypeId(creature)
+                )
+              )}
+              onDataUpdate={handleCustomDataUpdate}
+              valueEditors={valueEditors}
+              labelOverrides={labelOverrides}
+              layoutType={"standard"}
+              optionRestrictions={optionRestrictions}
+              ruleData={ruleData}
+            />
+            <RemoveButton
+              enableConfirm={true}
+              size="medium"
+              style="filled"
+              disabled={!isCustomized}
+              isInteractive={isCustomized}
+              onClick={handleRemoveCustomizations}
+            >
+              {isCustomized ? "Remove" : "No"} Customizations
+            </RemoveButton>
+          </EditorBox>
+        </Collapsible>
+      </div>
+    );
+  };
+
+  const renderInfusionPreview = (): React.ReactNode => {
+    if (!creature) {
+      return null;
+    }
+
+    const infusion = CreatureUtils.getInfusion(creature);
+    if (infusion) {
+      return (
+        <div className={styles.hasSeparator}>
+          <InfusionPreview
+            infusion={infusion}
+            snippetData={snippetData}
+            ruleData={ruleData}
+            infusionChoiceLookup={infusionChoiceLookup}
+            onClick={handleInfusionClick}
+            proficiencyBonus={proficiencyBonus}
+          />
+        </div>
+      );
+    }
+
+    return null;
+  };
+
+  const key: string = creature ? CreatureUtils.getUniqueKey(creature) : "";
+  const groupInfo = creature ? CreatureUtils.getGroupInfo(creature) : null;
+  const largeAvatarUrl = creature
+    ? CreatureUtils.getLargeAvatarUrl(creature)
+    : null;
+
+  const infusion = creature ? CreatureUtils.getInfusion(creature) : null;
+
+  return (
+    <div key={key} {...props}>
+      {!creature ? (
+        <>
+          <Header>Missing Creature</Header>
+          <PaneInitFailureContent />
+        </>
+      ) : (
+        <>
+          <Header
+            parent={groupInfo?.name || null}
+            preview={
+              <Preview imageUrl={CreatureUtils.getAvatarUrl(creature)} />
+            }
+          >
+            <EditableName onClick={handleToggleCustomize}>
+              <CreatureName theme={theme} creature={creature} />
+            </EditableName>
+          </Header>
+          {CreatureUtils.isHomebrew(creature) ? (
+            <Reference isDarkMode={theme.isDarkMode} name="Homebrew" />
+          ) : (
+            SourceUtils.getSourceFullNames(
+              CreatureUtils.getSources(creature),
+              ruleData
+            ).map((source, idx) => {
+              return (
+                <Fragment key={source}>
+                  {idx > 0 ? " /" : ""}{" "}
+                  <Reference isDarkMode={theme.isDarkMode} name={source} />
+                </Fragment>
+              );
+            })
+          )}
+          {renderCustomize()}
+          {renderHealthAdjuster()}
+          <div className={styles.block}>
+            <CreatureBlock
+              variant="default"
+              creature={creature}
+              ruleData={ruleData}
+            />
+          </div>
+          {largeAvatarUrl && (
+            <img
+              className={styles.img}
+              src={largeAvatarUrl}
+              alt={CreatureUtils.getDefinitionName(creature)}
+            />
+          )}
+          {renderTags()}
+          {renderDescription(
+            null,
+            CreatureUtils.getCharacteristicsDescription(creature)
+          )}
+          {renderDescription(
+            "Lair",
+            CreatureUtils.getLairDescription(creature)
+          )}
+          {renderInfusionPreview()}
+          {!isReadonly && (
+            <div className={clsx([styles.hasSeparator, styles.removeButton])}>
+              <Button
+                variant="outline"
+                size="xx-small"
+                themed
+                onClick={() => {
+                  if (infusion) {
+                    handleRemoveInfusion();
+                  } else {
+                    handleRemove();
+                  }
+                }}
+              >
+                {infusion ? "Remove Infusion" : "Delete"}
+              </Button>
+            </div>
+          )}
+        </>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/FeatPane/FeatPane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatPane/FeatPane.tsx
new file mode 100644
index 0000000..6cca15f
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatPane/FeatPane.tsx
@@ -0,0 +1,187 @@
+import { FC, HTMLAttributes, useContext } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import { Accordion } from "~/components/Accordion";
+import { Button } from "~/components/Button";
+import { HelperTextAccordion } from "~/components/HelperTextAccordion";
+import { HtmlContent } from "~/components/HtmlContent";
+import { useSidebar } from "~/contexts/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { FeatFeatureSnippet } from "~/tools/js/CharacterSheet/components/FeatureSnippet";
+import { DetailChoiceFeat } from "~/tools/js/Shared/containers/DetailChoice";
+import { CharacterFeaturesManagerContext } from "~/tools/js/Shared/managers/CharacterFeaturesManagerContext";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+import { PaneIdentifierUtils } from "~/tools/js/Shared/utils";
+import { DdbBadgeSvg } from "~/tools/js/smartComponents/Svg";
+import { Action, Spell } from "~/types";
+
+import { Header } from "../../components/Header";
+import { PaneInitFailureContent } from "../../components/PaneInitFailureContent";
+import { getDataOriginComponentInfo } from "../../helpers/paneUtils";
+import { PaneComponentEnum, PaneIdentifiersFeat } from "../../types";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  identifiers: PaneIdentifiersFeat | null;
+}
+
+export const FeatPane: FC<Props> = ({ identifiers, ...props }) => {
+  const dispatch = useDispatch();
+  const {
+    actionUtils,
+    characterActions,
+    spellUtils,
+    snippetData,
+    ruleData,
+    abilityLookup,
+    proficiencyBonus,
+    originRef: dataOriginRefData,
+    characterTheme: theme,
+    entityUtils,
+  } = useCharacterEngine();
+
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+
+  const {
+    pane: { paneHistoryPush, paneHistoryStart },
+  } = useSidebar();
+
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+
+  const feat = identifiers?.id
+    ? characterFeaturesManager.getFeatById(identifiers.id)
+    : null;
+
+  const handleActionUseSet = (action: Action, uses: number): void => {
+    const id = actionUtils.getId(action);
+    const entityTypeId = actionUtils.getEntityTypeId(action);
+    if (id !== null && entityTypeId !== null) {
+      dispatch(
+        characterActions.actionUseSet(
+          id,
+          entityTypeId,
+          uses,
+          actionUtils.getDataOriginType(action)
+        )
+      );
+    }
+  };
+
+  const handleSpellUseSet = (spell: Spell, uses: number): void => {
+    const mappingId = spellUtils.getMappingId(spell);
+    const mappingEntityTypeId = spellUtils.getMappingEntityTypeId(spell);
+
+    if (mappingId && mappingEntityTypeId) {
+      dispatch(
+        characterActions.spellUseSet(
+          mappingId,
+          mappingEntityTypeId,
+          uses,
+          spellUtils.getDataOriginType(spell)
+        )
+      );
+    }
+  };
+
+  const handleSpellDetailShow = (spell: Spell): void => {
+    const mappingId = spellUtils.getMappingId(spell);
+    if (mappingId !== null) {
+      paneHistoryPush(
+        PaneComponentEnum.CHARACTER_SPELL_DETAIL,
+        PaneIdentifierUtils.generateCharacterSpell(mappingId)
+      );
+    }
+  };
+
+  const handleActionShow = (action: Action): void => {
+    const mappingId = actionUtils.getMappingId(action);
+    const mappingEntityTypeId = actionUtils.getMappingEntityTypeId(action);
+    if (mappingId !== null && mappingEntityTypeId !== null) {
+      paneHistoryPush(
+        PaneComponentEnum.ACTION,
+        PaneIdentifierUtils.generateAction(mappingId, mappingEntityTypeId)
+      );
+    }
+  };
+
+  const handleParentClick = (): void => {
+    if (feat) {
+      let component = getDataOriginComponentInfo(feat.getDataOrigin());
+      if (component.type !== PaneComponentEnum.ERROR_404) {
+        paneHistoryPush(component.type, component.identifiers);
+      }
+    }
+  };
+
+  if (feat === null) {
+    return <PaneInitFailureContent />;
+  }
+
+  const prerequisiteDescription = feat.getPrerequisiteDescription();
+
+  return (
+    <div key={feat.getId()} {...props}>
+      <Header
+        parent={entityUtils.getDataOriginName(feat.getDataOrigin(), "", true)}
+        onClick={handleParentClick}
+      >
+        {feat.getName()}
+      </Header>
+      <HelperTextAccordion
+        builderHelperText={feat.getHelperText()}
+        size="small"
+        useTheme
+      />
+      {prerequisiteDescription && (
+        <div className={styles.prereq}>
+          Prerequisite: {prerequisiteDescription}
+        </div>
+      )}
+      <FeatFeatureSnippet
+        feat={feat}
+        onActionUseSet={handleActionUseSet}
+        onActionClick={handleActionShow}
+        onSpellUseSet={handleSpellUseSet}
+        onSpellClick={handleSpellDetailShow}
+        onFeatureClick={() =>
+          paneHistoryStart(
+            PaneComponentEnum.FEAT_DETAIL,
+            PaneIdentifierUtils.generateFeat(feat.getId())
+          )
+        }
+        showHeader={false}
+        showDescription={true}
+        snippetData={snippetData}
+        ruleData={ruleData}
+        abilityLookup={abilityLookup}
+        dataOriginRefData={dataOriginRefData}
+        isReadonly={isReadonly}
+        proficiencyBonus={proficiencyBonus}
+        theme={theme}
+      />
+      {!isReadonly && feat.getChoices().length > 0 && (
+        <div className={styles.choices}>
+          <DetailChoiceFeat featId={feat.getId()} />
+        </div>
+      )}
+      {!feat.isHiddenFeat() &&
+        !isReadonly && ( // don't show "Delete" if readonly mode, or a hidden feat
+          <div className={styles.footer}>
+            <Button
+              variant="outline"
+              size="xx-small"
+              themed
+              onClick={() => {
+                paneHistoryStart(PaneComponentEnum.FEATS_MANAGE);
+                feat.handleRemove();
+              }}
+            >
+              Delete
+            </Button>
+          </div>
+        )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/BlessingShoppe/BlessingShoppe.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/BlessingShoppe/BlessingShoppe.tsx
new file mode 100644
index 0000000..892443a
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/BlessingShoppe/BlessingShoppe.tsx
@@ -0,0 +1,105 @@
+import { FC, useContext, useEffect, useState } from "react";
+
+import { FeatureManager } from "@dndbeyond/character-rules-engine";
+
+import { ThemeButton } from "~/tools/js/Shared/components/common/Button";
+import DataLoadingStatusEnum from "~/tools/js/Shared/constants/DataLoadingStatusEnum";
+import { CharacterFeaturesManagerContext } from "~/tools/js/Shared/managers/CharacterFeaturesManagerContext";
+import { AppLoggerUtils, AppNotificationUtils } from "~/tools/js/Shared/utils";
+import Collapsible, {
+  CollapsibleHeaderContent,
+} from "~/tools/js/smartComponents/Collapsible";
+
+export const BlessingShoppe: FC<{}> = () => {
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+
+  const [loadingStatus, setLoadingStatus] = useState<DataLoadingStatusEnum>(
+    DataLoadingStatusEnum.NOT_INITIALIZED
+  );
+  const [blessingShoppe, setBlessingShoppe] = useState<Array<FeatureManager>>(
+    []
+  );
+  const [blessings, setBlessings] = useState<Array<FeatureManager>>([]);
+
+  async function fetchBlessings() {
+    const blessings = await characterFeaturesManager.getBlessings();
+    setBlessings(blessings);
+  }
+
+  useEffect(() => {
+    if (loadingStatus !== DataLoadingStatusEnum.LOADED) {
+      characterFeaturesManager
+        .getBlessingShoppe()
+        .then((blessingShoppe) => {
+          setLoadingStatus(DataLoadingStatusEnum.LOADED);
+          setBlessingShoppe(blessingShoppe);
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    }
+    fetchBlessings();
+  }, [loadingStatus, characterFeaturesManager]);
+
+  return (
+    <div>
+      <p>
+        A blessing is usually bestowed by a god or a godlike being. A character
+        might receive a blessing from a deity for doing something truly
+        momentous — an accomplishment that catches the attention of both gods
+        and mortals.
+      </p>
+      <div>
+        {blessingShoppe.map((blessing) => {
+          return (
+            <Collapsible
+              key={blessing.getId()}
+              layoutType={"minimal"}
+              header={
+                <CollapsibleHeaderContent
+                  heading={blessing.getName()}
+                  callout={
+                    characterFeaturesManager.hasBlessing(blessing) ? (
+                      <ThemeButton
+                        onClick={() => {
+                          blessing.handleRemove(() => {
+                            fetchBlessings();
+                            // AppNotificationUtils.dispatchSuccess(
+                            //     'Removed Blessing',
+                            //     'You removed a blessing',
+                            // );
+                          });
+                        }}
+                        size="small"
+                      >
+                        Remove
+                      </ThemeButton>
+                    ) : (
+                      <ThemeButton
+                        onClick={() => {
+                          blessing.handleAdd(() => {
+                            fetchBlessings();
+                            AppNotificationUtils.dispatchSuccess(
+                              "Added Blessing",
+                              "You added a blessing"
+                            );
+                          });
+                        }}
+                        size="small"
+                        style="outline"
+                      >
+                        Add
+                      </ThemeButton>
+                    )
+                  }
+                />
+              }
+            >
+              {blessing.getDescription()}
+            </Collapsible>
+          );
+        })}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/Feat/Feat.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/Feat/Feat.tsx
new file mode 100644
index 0000000..77a8c65
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/Feat/Feat.tsx
@@ -0,0 +1,130 @@
+import clsx from "clsx";
+import { FC, ReactNode } from "react";
+
+import { FeatManager } from "@dndbeyond/character-rules-engine/es";
+
+import { Reference } from "~/components/Reference";
+import { DataOriginTypeEnum } from "~/constants";
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import Collapsible, {
+  CollapsibleHeaderContent,
+} from "~/tools/js/smartComponents/Collapsible";
+import { TodoIcon } from "~/tools/js/smartComponents/Icons";
+import PrerequisiteFailureSummary from "~/tools/js/smartComponents/PrerequisiteFailureSummary";
+import { CharacterTheme } from "~/types";
+
+import {
+  RemoveButton,
+  ThemeButton,
+} from "../../../../../../../tools/js/Shared/components/common/Button";
+import { FeatDetail } from "../FeatDetail";
+import styles from "./styles.module.css";
+
+interface Props {
+  feat: FeatManager;
+  enableRemove?: boolean;
+  enableAdd?: boolean;
+  showFailures?: boolean;
+  theme: CharacterTheme;
+}
+
+export const Feat: FC<Props> = ({
+  feat,
+  enableAdd = true,
+  enableRemove = true,
+  showFailures = false,
+  theme,
+}) => {
+  const { entityUtils } = useCharacterEngine();
+  const { isDarkMode } = useCharacterTheme();
+
+  let missingChoiceCount: number = feat.getUnfinishedChoices().length;
+  let calloutNode: ReactNode = null;
+  let dataOrigin = feat.getDataOrigin();
+  let dataOriginType = feat.getDataOriginType();
+
+  switch (dataOriginType) {
+    case DataOriginTypeEnum.ADHOC:
+      if (enableRemove) {
+        calloutNode = (
+          <RemoveButton
+            onClick={feat.handleRemove}
+            style="filled"
+            className={styles.button}
+          />
+        );
+      }
+      break;
+
+    case DataOriginTypeEnum.SIMULATED:
+      if (enableAdd) {
+        calloutNode = (
+          <ThemeButton
+            onClick={feat.handleAdd}
+            size="small"
+            style="outline"
+            className={styles.button}
+          >
+            Add
+          </ThemeButton>
+        );
+      }
+      break;
+
+    default:
+      const dataOriginExtra = entityUtils.getDataOriginName(
+        dataOrigin,
+        "Unknown",
+        true
+      );
+
+      calloutNode = (
+        <span className={styles.origin}>
+          <span className={styles.originLabel}>From</span>
+          <span className={styles.originName}>{dataOriginExtra}</span>
+        </span>
+      );
+  }
+
+  return (
+    <Collapsible
+      layoutType={"minimal"}
+      className={styles.feat}
+      header={
+        <CollapsibleHeaderContent
+          heading={
+            <div>
+              <div>
+                <span>{feat.getName()}</span>
+                {missingChoiceCount > 0 && (
+                  <TodoIcon
+                    theme={theme}
+                    title={`Choice${
+                      missingChoiceCount !== 1 ? "s" : ""
+                    } Needed`}
+                  />
+                )}
+              </div>
+              <span className={styles.source}>
+                <Reference name={feat.getPrimarySourceName()} />
+              </span>
+              {showFailures && (
+                <PrerequisiteFailureSummary
+                  failures={feat.getPrerequisiteFailures()}
+                  className={styles.failures}
+                />
+              )}
+            </div>
+          }
+          callout={calloutNode}
+        />
+      }
+    >
+      <FeatDetail
+        featManager={feat}
+        className={clsx([styles.detail, isDarkMode && styles.dark])}
+      />
+    </Collapsible>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatDetail/FeatDetail.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatDetail/FeatDetail.tsx
new file mode 100644
index 0000000..856b904
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatDetail/FeatDetail.tsx
@@ -0,0 +1,35 @@
+import { FC, HTMLAttributes } from "react";
+
+import { FeatManager } from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { DetailChoiceFeat } from "~/tools/js/Shared/containers/DetailChoice";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  featManager: FeatManager;
+}
+
+export const FeatDetail: FC<Props> = ({ featManager, className, ...props }) => {
+  const prerequisiteDescription = featManager.getPrerequisiteDescription();
+  const featDescription = featManager.getDescription();
+
+  return (
+    <div className={className} {...props}>
+      {prerequisiteDescription && (
+        <div className={styles.prereq}>
+          Prerequisite: {prerequisiteDescription}
+        </div>
+      )}
+      {featDescription && (
+        <HtmlContent html={featDescription} withoutTooltips />
+      )}
+      {featManager.getChoices().length > 0 && (
+        <div className={styles.choices}>
+          <DetailChoiceFeat featId={featManager.getId()} />
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatShoppe/FeatShoppe.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatShoppe/FeatShoppe.tsx
new file mode 100644
index 0000000..da4f542
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatShoppe/FeatShoppe.tsx
@@ -0,0 +1,131 @@
+import { FC, useContext, useEffect, useState } from "react";
+
+import { FeatManager } from "@dndbeyond/character-rules-engine";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useSource } from "~/hooks/useSource";
+import DataLoadingStatusEnum from "~/tools/js/Shared/constants/DataLoadingStatusEnum";
+import { CharacterFeaturesManagerContext } from "~/tools/js/Shared/managers/CharacterFeaturesManagerContext";
+import { AppLoggerUtils } from "~/tools/js/Shared/utils";
+import { isNotNullOrUndefined } from "~/tools/js/Shared/utils/TypeScript";
+import Collapsible, {
+  CollapsibleHeaderContent,
+  CollapsibleHeading,
+} from "~/tools/js/smartComponents/Collapsible";
+import LoadingPlaceholder from "~/tools/js/smartComponents/LoadingPlaceholder";
+
+import { Feat } from "../Feat/Feat";
+import styles from "../styles.module.css";
+
+export const FeatShoppe: FC<{}> = () => {
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+
+  const {
+    feats: currentCharacterFeats,
+    characterTheme: theme,
+    preferences,
+  } = useCharacterEngine();
+
+  const { getSourceCategoryGroups } = useSource();
+
+  const [loadingStatus, setLoadingStatus] = useState<DataLoadingStatusEnum>(
+    DataLoadingStatusEnum.NOT_INITIALIZED
+  );
+  const [featShoppe, setFeatShoppe] = useState<Array<FeatManager>>([]);
+
+  useEffect(() => {
+    if (loadingStatus !== DataLoadingStatusEnum.LOADED) {
+      characterFeaturesManager
+        .getFeatShoppe()
+        .then((featShoppe) => {
+          setLoadingStatus(DataLoadingStatusEnum.LOADED);
+          setFeatShoppe(featShoppe);
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    } else {
+      setFeatShoppe(characterFeaturesManager.updateFeatShoppe(featShoppe));
+    }
+  }, [currentCharacterFeats]);
+
+  const getFeatsInSourceCategoryGroups = (feats: FeatManager[]) => {
+    const featDefs = feats
+      .map((feat) => feat.getDefinition())
+      .filter(isNotNullOrUndefined);
+
+    return getSourceCategoryGroups(featDefs).map((group) => {
+      return {
+        ...group,
+        items: characterFeaturesManager.transformLoadedFeats(group.items),
+      };
+    });
+  };
+
+  return loadingStatus !== DataLoadingStatusEnum.LOADED ? (
+    <LoadingPlaceholder />
+  ) : (
+    <>
+      <div className={styles.featList}>
+        {getFeatsInSourceCategoryGroups(
+          characterFeaturesManager.getAvailableFeats(featShoppe)
+        ).map((group) => (
+          <Collapsible
+            key={group.id + "available"}
+            layoutType="minimal"
+            initiallyCollapsed={false}
+            header={<h2>{group.name}</h2>}
+          >
+            <div>
+              {group.items.map((feat) => (
+                <Feat theme={theme} key={feat.getId()} feat={feat} />
+              ))}
+            </div>
+          </Collapsible>
+        ))}
+      </div>
+      {characterFeaturesManager.getUnavailableFeats(featShoppe).length > 0 && (
+        <Collapsible
+          header={
+            <CollapsibleHeaderContent
+              heading={
+                <CollapsibleHeading>
+                  Unavailable Feats
+                  <span className={styles.unavailableCallout}>
+                    Prerequisites Not Met
+                  </span>
+                </CollapsibleHeading>
+              }
+            />
+          }
+          className={styles.featList}
+        >
+          <>
+            {getFeatsInSourceCategoryGroups(
+              characterFeaturesManager.getUnavailableFeats(featShoppe)
+            ).map((group) => (
+              <Collapsible
+                key={group.id + "unavailable"}
+                layoutType="minimal"
+                initiallyCollapsed={false}
+                header={<h2>{group.name}</h2>}
+              >
+                <div>
+                  {group.items.map((feat) => (
+                    <Feat
+                      theme={theme}
+                      key={feat.getId()}
+                      feat={feat}
+                      enableAdd={!preferences?.enforceFeatRules}
+                      showFailures={true}
+                    />
+                  ))}
+                </div>
+              </Collapsible>
+            ))}
+          </>
+        </Collapsible>
+      )}
+    </>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatsManagePane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatsManagePane.tsx
new file mode 100644
index 0000000..e7af3be
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatsManagePane.tsx
@@ -0,0 +1,66 @@
+import { FC } from "react";
+import { useSelector } from "react-redux";
+
+import { useFeatureFlags } from "~/contexts/FeatureFlag";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import SettingsButton from "~/tools/js/CharacterSheet/components/SettingsButton";
+import { SettingsContextsEnum } from "~/tools/js/Shared/containers/panes/SettingsPane/typings";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+import Collapsible, {
+  CollapsibleHeaderContent,
+  CollapsibleHeading,
+} from "~/tools/js/smartComponents/Collapsible";
+
+import { BlessingShoppe } from "./BlessingShoppe";
+import { FeatShoppe } from "./FeatShoppe";
+import styles from "./styles.module.css";
+
+export const FeatsManagePane: FC<{}> = () => {
+  const { gfsBlessingsUiFlag } = useFeatureFlags();
+
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  if (isReadonly) {
+    return null;
+  }
+
+  return (
+    <div>
+      <Header
+        callout={
+          <SettingsButton
+            context={SettingsContextsEnum.FEATURES}
+            isReadonly={isReadonly}
+          />
+        }
+      >
+        Manage {gfsBlessingsUiFlag ? "Features" : "Feats"}
+      </Header>
+      {gfsBlessingsUiFlag ? (
+        <Collapsible
+          header={
+            <CollapsibleHeaderContent
+              heading={<CollapsibleHeading>Add Feats</CollapsibleHeading>}
+            />
+          }
+          className={styles.featList}
+        >
+          <FeatShoppe />
+        </Collapsible>
+      ) : (
+        <FeatShoppe />
+      )}
+      {gfsBlessingsUiFlag && (
+        <Collapsible
+          header={
+            <CollapsibleHeaderContent
+              heading={<CollapsibleHeading>Add Blessings</CollapsibleHeading>}
+            />
+          }
+          className={styles.featList}
+        >
+          <BlessingShoppe />
+        </Collapsible>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/GameLogPane/GameLogPane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/GameLogPane/GameLogPane.tsx
new file mode 100644
index 0000000..d7af20e
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/GameLogPane/GameLogPane.tsx
@@ -0,0 +1,61 @@
+import clsx from "clsx";
+import { useEffect } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import { Dice } from "@dndbeyond/dice";
+import { GameLog } from "@dndbeyond/game-log-components";
+
+import { appEnvActions } from "~/tools/js/Shared/actions/appEnv";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+
+import styles from "./styles.module.css";
+
+export const GameLogPane = () => {
+  const dispatch = useDispatch();
+  const gameLog = useSelector(appEnvSelectors.getGameLog);
+  const characterId = useSelector(appEnvSelectors.getCharacterId);
+
+  useEffect(
+    () => {
+      const updateOpenState = (isOpen: boolean) => {
+        const lastMessageTime = new Date().getTime();
+
+        dispatch(
+          appEnvActions.dataSet({
+            gameLog: {
+              ...gameLog,
+              isOpen: isOpen,
+              lastMessageTime: lastMessageTime,
+            },
+          })
+        );
+
+        try {
+          localStorage.setItem(
+            `gameLog-lastMessageTime-${characterId}`,
+            lastMessageTime.toString()
+          );
+        } catch (e) {}
+
+        // turn the dice notifications off if the panel is open
+        Dice.setDiceNotificationEnabled(!isOpen);
+      };
+
+      updateOpenState(true);
+
+      return () => {
+        updateOpenState(false);
+      };
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+
+  return (
+    <div className={clsx(styles.gameLogPane)} data-testid="gamelog-pane">
+      {characterId && <GameLog />}
+    </div>
+  );
+};
+
+export default GameLogPane;
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/DeathSavesManager.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/DeathSavesManager.tsx
new file mode 100644
index 0000000..e4ab423
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/DeathSavesManager.tsx
@@ -0,0 +1,220 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useContext } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import {
+  DigitalDiceWrapper,
+  LightDiceSvg,
+} from "@dndbeyond/character-components/es";
+import { RollKind, RollRequest, RollType } from "@dndbeyond/dice";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { isNotNullOrUndefined } from "~/helpers/validation";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { getDataOriginComponentInfo } from "~/subApps/sheet/components/Sidebar/helpers/paneUtils";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+import DiceAdjustmentSummary from "~/tools/js/Shared/components/DiceAdjustmentSummary";
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "~/tools/js/Shared/selectors";
+import { DataOrigin } from "~/types";
+
+import { Heading } from "../../../components/Heading";
+import { DeathSavesMarks } from "./DeathSavesMarks";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  damageValue: number;
+}
+
+export const DeathSavesManager: FC<Props> = ({
+  damageValue,
+  className,
+  ...props
+}) => {
+  const {
+    characterTheme,
+    deathSaveInfo,
+    ruleData,
+    characterActions,
+    ruleDataUtils,
+  } = useCharacterEngine();
+
+  const isDiceEnabled = useSelector(appEnvSelectors.getDiceEnabled);
+  const characterRollContext = useSelector(
+    characterRollContextSelectors.getCharacterRollContext
+  );
+  const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+    useContext(GameLogContext);
+  const dispatch = useDispatch();
+
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+
+  const oneHPRestoreType = ruleDataUtils
+    .getRestoreTypes(ruleData)
+    .find((r) => r.name === "OneHP");
+
+  const hasAdvantage = deathSaveInfo.advantageAdjustments.length > 0;
+  const hasDisadvantage = deathSaveInfo.disadvantageAdjustments.length > 0;
+
+  let rollKind = RollKind.None;
+  if (hasAdvantage && !hasDisadvantage) {
+    rollKind = RollKind.Advantage;
+  } else if (hasDisadvantage && !hasAdvantage) {
+    rollKind = RollKind.Disadvantage;
+  }
+
+  /* --- On Click Functions --- */
+
+  const onClickDataOrigin = (dataOrigin: DataOrigin): void => {
+    let component = getDataOriginComponentInfo(dataOrigin);
+    if (component.type !== PaneComponentEnum.ERROR_404) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  const dispatchDeathSaves = (fails: number, successes: number) => {
+    dispatch(
+      characterActions.deathSavesSet(
+        Math.min(ruleDataUtils.getMaxDeathsavesFail(ruleData), fails),
+        Math.min(ruleDataUtils.getMaxDeathsavesSuccess(ruleData), successes)
+      )
+    );
+  };
+
+  const onFail = (evt?: React.MouseEvent, isCritical = false) => {
+    const uses = isCritical ? 2 : 1;
+
+    if (evt) {
+      evt.nativeEvent.stopImmediatePropagation();
+      evt.stopPropagation();
+    }
+
+    dispatchDeathSaves(
+      deathSaveInfo.failCount + uses,
+      deathSaveInfo.successCount
+    );
+  };
+
+  const onFailClear = (evt?: React.MouseEvent) => {
+    if (evt) {
+      evt.nativeEvent.stopImmediatePropagation();
+      evt.stopPropagation();
+    }
+
+    dispatchDeathSaves(deathSaveInfo.failCount - 1, deathSaveInfo.successCount);
+  };
+
+  const onSuccess = (evt?: React.MouseEvent) => {
+    if (evt) {
+      evt.nativeEvent.stopImmediatePropagation();
+      evt.stopPropagation();
+    }
+
+    dispatchDeathSaves(deathSaveInfo.failCount, deathSaveInfo.successCount + 1);
+  };
+
+  const onSuccessClear = (evt?: React.MouseEvent) => {
+    if (evt) {
+      evt.nativeEvent.stopImmediatePropagation();
+      evt.stopPropagation();
+    }
+
+    dispatchDeathSaves(deathSaveInfo.failCount, deathSaveInfo.successCount - 1);
+  };
+
+  return (
+    <div className={clsx([styles.column, className])} {...props}>
+      <div className={clsx([styles.row, styles.heading])}>
+        <Heading>Death Saves</Heading>
+        {isDiceEnabled && (
+          <DigitalDiceWrapper
+            diceNotation={"1d20"}
+            onRollResults={(rollRequest: RollRequest) => {
+              const roll = rollRequest.rolls[0].result?.total;
+
+              if (roll) {
+                if (roll === 1) {
+                  onFail(undefined, true);
+                } else if (roll === 20 && oneHPRestoreType) {
+                  dispatch(characterActions.restoreLife(oneHPRestoreType.id));
+                } else if (roll >= 10) {
+                  onSuccess.bind(this)();
+                } else {
+                  onFail.bind(this)();
+                }
+              }
+            }}
+            rollType={RollType.Save}
+            rollKind={rollKind}
+            rollAction={"Death"}
+            diceEnabled={isDiceEnabled}
+            rollContext={characterRollContext}
+            rollTargetOptions={
+              messageTargetOptions?.entities
+                ? Object.values(messageTargetOptions.entities).filter(
+                    isNotNullOrUndefined
+                  )
+                : undefined
+            }
+            rollTargetDefault={defaultMessageTargetOption}
+            userId={Number(userId)}
+          >
+            <LightDiceSvg />
+            <span>Roll</span>
+          </DigitalDiceWrapper>
+        )}
+      </div>
+      <div className={clsx([styles.row, styles.deathSavesGroups])}>
+        <DeathSavesMarks
+          label="Failures"
+          type="fails"
+          activeCount={deathSaveInfo.failCount}
+          willBeActiveCount={damageValue !== 0 ? 1 : 0}
+          totalCount={ruleData.maxDeathsavesFail}
+          onUse={onFail}
+          onClear={onFailClear}
+        />
+        <DeathSavesMarks
+          label="Successes"
+          type="successes"
+          activeCount={deathSaveInfo.successCount}
+          totalCount={ruleData.maxDeathsavesSuccess}
+          onUse={onSuccess}
+          onClear={onSuccessClear}
+        />
+      </div>
+      {(!!deathSaveInfo.advantageAdjustments.length ||
+        !!deathSaveInfo.disadvantageAdjustments.length) && (
+        <div className={styles.diceAdjustments}>
+          {deathSaveInfo.advantageAdjustments.map((diceAdjustment) => {
+            return (
+              <DiceAdjustmentSummary
+                key={diceAdjustment.uniqueKey}
+                diceAdjustment={diceAdjustment}
+                ruleData={ruleData}
+                theme={characterTheme}
+                onDataOriginClick={onClickDataOrigin}
+              />
+            );
+          })}
+          {deathSaveInfo.disadvantageAdjustments.map((diceAdjustment) => {
+            return (
+              <DiceAdjustmentSummary
+                key={diceAdjustment.uniqueKey}
+                diceAdjustment={diceAdjustment}
+                ruleData={ruleData}
+                theme={characterTheme}
+                onDataOriginClick={onClickDataOrigin}
+              />
+            );
+          })}
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/DeathSavesMarks/DeathSavesMarks.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/DeathSavesMarks/DeathSavesMarks.tsx
new file mode 100644
index 0000000..2cb02cd
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/DeathSavesMarks/DeathSavesMarks.tsx
@@ -0,0 +1,88 @@
+import clsx from "clsx";
+import { HTMLAttributes, FC } from "react";
+
+import { CloseSvg } from "@dndbeyond/character-components/es";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  type: "successes" | "fails";
+  label: string;
+  activeCount: number;
+  totalCount: number;
+  willBeActiveCount?: number;
+  onUse: (evt: React.MouseEvent) => void;
+  onClear: (evt: React.MouseEvent) => void;
+}
+
+export const DeathSavesMarks: FC<Props> = ({
+  type,
+  label,
+  activeCount,
+  totalCount,
+  willBeActiveCount = 0,
+  onUse,
+  onClear,
+  className,
+  ...props
+}) => {
+  // TODO: Need to make these marks accessible - they currently cannot be interacted with with a keyboard.
+
+  let marks: Array<React.ReactNode> = [];
+  let availableSlots: number = totalCount;
+
+  for (let i = 0; i < activeCount; i++) {
+    marks.push(
+      <span
+        className={styles.mark}
+        key={`${type}-active-${i}`}
+        onClick={onClear}
+      >
+        <CloseSvg
+          fillColor={type === "successes" ? "#00c797" : "#c53131"}
+          secondaryFillColor=""
+          key={`${type}-active-${i}`}
+          className={clsx([styles.mark, styles.activeMark])}
+        />
+      </span>
+    );
+  }
+
+  availableSlots -= activeCount;
+
+  for (let i = 0; i < Math.min(availableSlots, willBeActiveCount); i++) {
+    marks.push(
+      <span
+        key={`${type}-willbe-${i}`}
+        className={clsx([
+          styles.mark,
+          styles.willBeActive,
+          type === "fails" && styles.willBeFail,
+        ])}
+      />
+    );
+  }
+
+  availableSlots -= willBeActiveCount;
+
+  for (let i = 0; i < Math.min(availableSlots, totalCount); i++) {
+    marks.push(
+      <span
+        key={`${type}-inactive-${i}`}
+        className={clsx([styles.mark])}
+        onClick={onUse}
+      />
+    );
+  }
+
+  return (
+    <div
+      className={clsx([styles.container, className])}
+      data-testid={`${type}-group`}
+      {...props}
+    >
+      <p className={styles.label}>{label}</p>
+      <div className={styles.marks}>{marks}</div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsAdjuster/HitPointsAdjuster.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsAdjuster/HitPointsAdjuster.tsx
new file mode 100644
index 0000000..00ff1e8
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsAdjuster/HitPointsAdjuster.tsx
@@ -0,0 +1,537 @@
+import clsx from "clsx";
+import { createRef, FC, HTMLAttributes, useEffect, useState } from "react";
+import { useDispatch } from "react-redux";
+
+import { DataOriginName } from "@dndbeyond/character-components/es";
+import { Constants, ItemManager } from "@dndbeyond/character-rules-engine";
+
+import { Button } from "~/components/Button";
+import { Checkbox } from "~/components/Checkbox";
+import { ItemName } from "~/components/ItemName";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { HP_DAMAGE_TAKEN_VALUE } from "~/subApps/sheet/constants";
+import { Item, HitPointInfo, Creature } from "~/types";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  hpInfo: HitPointInfo;
+  creature?: Creature;
+  handleDamageUpdate?: (damageAmount: number) => void;
+  vibrationAmount?: number;
+}
+
+// TODO This hitpoints adjuster doesn't work as a generic component for vehicles yet.
+
+export const HitPointsAdjuster: FC<Props> = ({
+  hpInfo,
+  creature,
+  handleDamageUpdate,
+  vibrationAmount = 15,
+  className,
+  ...props
+}) => {
+  const {
+    characterTheme,
+    protectionSuppliers,
+    deathSaveInfo,
+    ruleData,
+    characterActions,
+    actionUtils,
+    characterUtils,
+    helperUtils,
+    itemUtils,
+    limitedUseUtils,
+    modifierUtils,
+    ruleDataUtils,
+    creatureUtils,
+  } = useCharacterEngine();
+
+  const getInitialActiveProtectionSupplierKey = (): string | null => {
+    const foundSupplier = protectionSuppliers.find(
+      (supplier) =>
+        supplier.availabilityStatus ===
+        Constants.ProtectionAvailabilityStatusEnum.AVAILABLE
+    );
+
+    if (foundSupplier) {
+      return foundSupplier.key;
+    }
+
+    return null;
+  };
+
+  const [tickCount, setTickCount] = useState(0);
+  const [healingAmount, setHealingAmount] = useState<number | null>(null);
+  const [damageAmount, setDamageAmount] = useState<number | null>(null);
+  const [hpDifference, setHpDifference] = useState(
+    characterUtils.calculateHitPoints(hpInfo, 0)
+  );
+  const [isValueChanged, setIsValueChanged] = useState<boolean>(false);
+  const [activeProtectionSupplierKey, setActiveProtectionSupplierKey] =
+    useState<string | null>(getInitialActiveProtectionSupplierKey());
+
+  const damageInput = createRef<HTMLInputElement>();
+  const healingInput = createRef<HTMLInputElement>();
+
+  const dispatch = useDispatch();
+
+  /* --- Helper Functions --- */
+
+  const reset = (newTemp: number | null): void => {
+    if (hpInfo.tempHp !== newTemp && newTemp !== null) {
+      creature
+        ? dispatch(
+            characterActions.creatureHitPointsSet(
+              creatureUtils.getMappingId(creature),
+              hpInfo.removedHp,
+              newTemp
+            )
+          )
+        : dispatch(characterActions.hitPointsSet(hpInfo.removedHp, newTemp));
+    }
+    setTickCount(0);
+    setHealingAmount(0);
+    setDamageAmount(0);
+    setIsValueChanged(false);
+    setActiveProtectionSupplierKey(getInitialActiveProtectionSupplierKey());
+  };
+
+  const onKeyUpSave = (evt: React.KeyboardEvent<HTMLInputElement>): void => {
+    if (evt.key === "Enter") {
+      onClickSave();
+    }
+  };
+
+  // onKeyDown must be used for the Escape key to reset the adjuster because the
+  // Sidebar uses onKeyDown to close when the Escape key is pressed.
+  const onKeyDownCancel = (
+    evt: React.KeyboardEvent<HTMLInputElement>
+  ): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    if (evt.key === "Escape") {
+      reset(hpInfo.tempHp);
+    }
+  };
+
+  /* --- On Input Change Functions --- */
+
+  const onChangeHealing = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    setTickCount(0);
+    setHealingAmount(
+      helperUtils.clampInt(
+        helperUtils.parseInputInt(evt.target.value, HP_DAMAGE_TAKEN_VALUE.MIN),
+        HP_DAMAGE_TAKEN_VALUE.MIN,
+        HP_DAMAGE_TAKEN_VALUE.MAX
+      )
+    );
+    setDamageAmount(0);
+    setIsValueChanged(true);
+  };
+
+  const onChangeDamage = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    setTickCount(0);
+    setHealingAmount(0);
+    setDamageAmount(
+      helperUtils.clampInt(
+        helperUtils.parseInputInt(evt.target.value, HP_DAMAGE_TAKEN_VALUE.MIN),
+        HP_DAMAGE_TAKEN_VALUE.MIN,
+        HP_DAMAGE_TAKEN_VALUE.MAX
+      ) * -1
+    );
+    setIsValueChanged(true);
+  };
+
+  /* --- On Click Functions --- */
+
+  const onClickIncrease = (): void => {
+    setHealingAmount(
+      healingAmount !== null && damageAmount === 0 ? healingAmount + 1 : 0
+    );
+    setDamageAmount(
+      damageAmount !== null && damageAmount < 0 ? damageAmount + 1 : 0
+    );
+    setIsValueChanged(true);
+
+    if (navigator.vibrate) {
+      navigator.vibrate(vibrationAmount);
+    }
+  };
+
+  const onClickDecrease = (): void => {
+    setHealingAmount(
+      healingAmount !== null && healingAmount > 0 ? healingAmount - 1 : 0
+    );
+    setDamageAmount(
+      damageAmount !== null && healingAmount === 0 ? damageAmount - 1 : 0
+    );
+    setIsValueChanged(true);
+
+    if (navigator.vibrate) {
+      navigator.vibrate(vibrationAmount);
+    }
+  };
+
+  const onClickSave = (): void => {
+    const { newTemp, startHp, newHp } = hpDifference;
+
+    let protectedHpResult: number | null = null;
+    if (!creature) {
+      if (
+        startHp !== 0 &&
+        newHp === 0 &&
+        activeProtectionSupplierKey !== null
+      ) {
+        let foundActiveSupplier = protectionSuppliers.find(
+          (supplier) => supplier.key === activeProtectionSupplierKey
+        );
+
+        if (foundActiveSupplier) {
+          protectedHpResult = foundActiveSupplier.setHpValue;
+
+          switch (foundActiveSupplier.type) {
+            case Constants.ProtectionSupplierTypeEnum.ITEM: {
+              const itemData = foundActiveSupplier.data as Item;
+              const item = ItemManager.getItem(
+                itemUtils.getMappingId(itemData)
+              );
+
+              const numberUsed = item.getNumberUsed();
+              if (numberUsed !== null) {
+                item.handleItemLimitedUseSet(numberUsed + 1);
+              }
+              break;
+            }
+            case Constants.ProtectionSupplierTypeEnum.RACIAL_TRAIT:
+            case Constants.ProtectionSupplierTypeEnum.CLASS_FEATURE:
+            case Constants.ProtectionSupplierTypeEnum.FEAT: {
+              let action = foundActiveSupplier.action;
+              if (action !== null) {
+                let limitedUse = actionUtils.getLimitedUse(action);
+                const id = actionUtils.getId(action);
+                const entityTypeId = actionUtils.getEntityTypeId(action);
+                const dataOriginType = actionUtils.getDataOriginType(action);
+
+                if (
+                  limitedUse !== null &&
+                  id !== null &&
+                  entityTypeId !== null
+                ) {
+                  const numberUsed = limitedUseUtils.getNumberUsed(limitedUse);
+                  dispatch(
+                    characterActions.actionUseSet(
+                      id,
+                      entityTypeId,
+                      numberUsed + 1,
+                      dataOriginType
+                    )
+                  );
+                }
+              }
+              break;
+            }
+            default:
+            // not implemented
+          }
+        }
+      }
+    }
+
+    let removedHp: number = 0;
+    if (protectedHpResult === null) {
+      removedHp = hpInfo.totalHp - newHp;
+    } else {
+      removedHp = hpInfo.totalHp - protectedHpResult;
+    }
+
+    creature
+      ? dispatch(
+          characterActions.creatureHitPointsSet(
+            creatureUtils.getMappingId(creature),
+            removedHp,
+            newTemp
+          )
+        )
+      : dispatch(characterActions.hitPointsSet(removedHp, newTemp));
+
+    const damage: number =
+      damageAmount === null
+        ? 0
+        : Math.min(
+            tickCount +
+              (healingAmount === null ? 0 : healingAmount) +
+              damageAmount,
+            0
+          );
+
+    if (startHp === 0 && !creature) {
+      if (newHp > 0) {
+        dispatch(characterActions.deathSavesSet(0, 0));
+      } else if (damage !== 0 && protectedHpResult === null) {
+        dispatch(
+          characterActions.deathSavesSet(
+            Math.min(
+              ruleDataUtils.getMaxDeathsavesFail(ruleData),
+              deathSaveInfo.failCount + 1
+            ),
+            Math.min(
+              ruleDataUtils.getMaxDeathsavesSuccess(ruleData),
+              deathSaveInfo.successCount
+            )
+          )
+        );
+        reset(hpInfo.tempHp);
+      }
+    }
+
+    if (startHp === newHp) {
+      reset(newTemp);
+    }
+  };
+
+  const onClickCancel = (): void => {
+    reset(hpInfo.tempHp);
+  };
+
+  /* --- useEffects --- */
+
+  useEffect(() => {
+    const difference: number =
+      (healingAmount === null ? 0 : healingAmount) +
+      (damageAmount === null ? 0 : damageAmount) +
+      tickCount;
+
+    setHpDifference(characterUtils.calculateHitPoints(hpInfo, difference));
+  }, [healingAmount, damageAmount, tickCount, hpInfo]);
+
+  useEffect(() => {
+    reset(hpInfo.tempHp);
+  }, [hpInfo, protectionSuppliers]);
+
+  useEffect(() => {
+    if (handleDamageUpdate) {
+      const damageValue: number =
+        damageAmount === null
+          ? 0
+          : Math.min(
+              tickCount +
+                (healingAmount === null ? 0 : healingAmount) +
+                damageAmount,
+              0
+            );
+      handleDamageUpdate(damageValue);
+    }
+  }, [tickCount, healingAmount, damageAmount]);
+
+  /* --- Render Functions --- */
+
+  const renderProtectionInfo = (): React.ReactNode => {
+    const { startHp, newHp } = hpDifference;
+
+    if (
+      !isValueChanged ||
+      startHp === 0 ||
+      newHp !== 0 ||
+      protectionSuppliers.length === 0
+    ) {
+      return null;
+    }
+
+    return (
+      <>
+        {protectionSuppliers.map((protectionSupplier) => {
+          if (
+            protectionSupplier.availabilityStatus !==
+            Constants.ProtectionAvailabilityStatusEnum.AVAILABLE
+          ) {
+            return null;
+          }
+
+          let dataOrigin = modifierUtils.getDataOrigin(
+            protectionSupplier.modifier
+          );
+          let isEnabled =
+            activeProtectionSupplierKey !== null &&
+            protectionSupplier.key === activeProtectionSupplierKey;
+
+          //TODO remove if check and ItemName => use DataOriginName when EntityDataOriginLookup is available to be passed as a prop to DataOriginName
+          let nameNode: React.ReactNode = null;
+          if (
+            protectionSupplier.type ===
+            Constants.ProtectionSupplierTypeEnum.ITEM
+          ) {
+            nameNode = <ItemName item={protectionSupplier.data as Item} />;
+          } else {
+            nameNode = (
+              <DataOriginName dataOrigin={dataOrigin} theme={characterTheme} />
+            );
+          }
+
+          return (
+            <div
+              className={clsx([styles.row, styles.protectionNotice])}
+              key={protectionSupplier.key}
+            >
+              <Checkbox
+                checked={isEnabled}
+                themed
+                darkMode={characterTheme.isDarkMode}
+                id={`${protectionSupplier.key}-checkbox`}
+                onClick={() => {
+                  isEnabled = !isEnabled;
+                  setActiveProtectionSupplierKey(
+                    isEnabled ? protectionSupplier.key : null
+                  );
+                }}
+              />
+              <label htmlFor={`${protectionSupplier.key}-checkbox`}>
+                Instead of dropping to 0 hit points, use{" "}
+                <strong>{nameNode}</strong> to set hit points to{" "}
+                <strong>{protectionSupplier.setHpValue}</strong>
+              </label>
+            </div>
+          );
+        })}
+      </>
+    );
+  };
+
+  return (
+    <div
+      className={clsx([styles.column, styles.container, className])}
+      {...props}
+    >
+      <div className={clsx([styles.row, styles.container])}>
+        <div className={clsx([styles.column, styles.inputsContainer])}>
+          <div
+            className={clsx([styles.inputContainer, styles.healingContainer])}
+          >
+            <label
+              htmlFor="healing-input"
+              className={clsx([styles.inputLabel, styles.positiveColor])}
+            >
+              Healing
+            </label>
+            <input
+              ref={healingInput}
+              type="number"
+              id="healing-input"
+              className={styles.input}
+              value={
+                healingAmount === null
+                  ? ""
+                  : Math.max(
+                      tickCount +
+                        healingAmount +
+                        (damageAmount === null ? 0 : damageAmount),
+                      0
+                    )
+              }
+              min={HP_DAMAGE_TAKEN_VALUE.MIN}
+              max={HP_DAMAGE_TAKEN_VALUE.MAX}
+              onChange={onChangeHealing}
+              onKeyUp={onKeyUpSave}
+              onKeyDown={onKeyDownCancel}
+            />
+          </div>
+          <div className={clsx([styles.row, styles.newValues])}>
+            <div
+              className={clsx([
+                styles.column,
+                hpDifference.newHp > hpDifference.startHp &&
+                  styles.positiveColor,
+                hpDifference.newHp < hpDifference.startHp &&
+                  styles.negativeColor,
+              ])}
+            >
+              <span className={styles.label}>New HP</span>
+              <span className={styles.value} data-testid="new-hp">
+                {hpDifference.newHp}
+              </span>
+            </div>
+            {hpInfo.tempHp !== null && hpInfo.tempHp > 0 && (
+              <div
+                className={clsx([
+                  styles.column,
+                  hpDifference.newTemp > hpInfo.tempHp && styles.positiveColor,
+                  hpDifference.newTemp < hpInfo.tempHp && styles.negativeColor,
+                ])}
+              >
+                <span className={styles.label}>New Temp</span>
+                <span className={styles.value} data-testid="new-temp-hp">
+                  {hpDifference.newTemp}
+                </span>
+              </div>
+            )}
+          </div>
+          <div
+            className={clsx([styles.inputContainer, styles.damageContainer])}
+          >
+            <label
+              htmlFor="damage-input"
+              className={clsx([styles.inputLabel, styles.negativeColor])}
+            >
+              Damage
+            </label>
+            <input
+              ref={damageInput}
+              type="number"
+              id="damage-input"
+              className={styles.input}
+              value={
+                damageAmount === null
+                  ? ""
+                  : Math.abs(
+                      Math.min(
+                        tickCount +
+                          (healingAmount === null ? 0 : healingAmount) +
+                          damageAmount,
+                        0
+                      )
+                    )
+              }
+              min={HP_DAMAGE_TAKEN_VALUE.MIN}
+              max={HP_DAMAGE_TAKEN_VALUE.MAX}
+              onChange={onChangeDamage}
+              onKeyUp={onKeyUpSave}
+              onKeyDown={onKeyDownCancel}
+            />
+          </div>
+        </div>
+        <div className={clsx([styles.column, styles.modifyButtons])}>
+          <Button
+            onClick={onClickIncrease}
+            themed
+            size="xx-small"
+            className={styles.increase}
+            aria-label="Increase Hit Points"
+          />
+          <Button
+            onClick={onClickDecrease}
+            themed
+            size="xx-small"
+            className={styles.decrease}
+            aria-label="Decrease Hit Points"
+          />
+        </div>
+      </div>
+      {!creature && renderProtectionInfo()}
+      {isValueChanged && (
+        <div className={clsx([styles.row, styles.applyButtons])}>
+          <Button onClick={onClickSave} size="xx-small" themed>
+            Apply Changes
+          </Button>
+          <Button
+            onClick={onClickCancel}
+            variant="outline"
+            size="xx-small"
+            themed
+          >
+            Cancel
+          </Button>
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsManagePane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsManagePane.tsx
new file mode 100644
index 0000000..6e50f53
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsManagePane.tsx
@@ -0,0 +1,104 @@
+import { FC, HTMLAttributes, useState } from "react";
+import { useDispatch } from "react-redux";
+
+import { Constants } from "@dndbeyond/character-rules-engine";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { RuleKeyEnum } from "~/constants";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+import { toastMessageActions } from "~/tools/js/Shared/actions";
+import { ShortModelInfoContract } from "~/types";
+
+import { HitPointsSummary } from "../../../HitPointsBox/HitPointsSummary";
+import { DeathSavesManager } from "./DeathSavesManager/DeathSavesManager";
+import { HitPointsAdjuster } from "./HitPointsAdjuster";
+import { HitPointsOverrides } from "./HitPointsOverrides";
+import { RestoreLifeManager } from "./RestoreLifeManager/RestoreLifeManager";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {}
+export const HitPointsManagePane: FC<Props> = ({ className, ...props }) => {
+  const { hpInfo, deathCause, ruleData, ruleDataUtils, characterActions } =
+    useCharacterEngine();
+  const dispatch = useDispatch();
+
+  const [damage, setDamage] = useState<number>(0);
+
+  const handleDamageUpdate = (damageValue: number) => {
+    setDamage(damageValue);
+  };
+
+  const onRestoreToLife = (restoreType: ShortModelInfoContract): void => {
+    const restoreChoice = restoreType.name === "Full" ? "full" : "1";
+
+    dispatch(characterActions.restoreLife(restoreType.id));
+    dispatch(
+      toastMessageActions.toastSuccess(
+        "Character Restored to Life",
+        `You have been restored to life with ${restoreChoice} HP.`
+      )
+    );
+  };
+
+  const renderDeathSavesRules = (): React.ReactNode => {
+    if (
+      hpInfo.remainingHp > 0 ||
+      (deathCause !== Constants.DeathCauseEnum.NONE &&
+        deathCause !== Constants.DeathCauseEnum.DEATHSAVES)
+    ) {
+      return null;
+    }
+
+    const deathSavesRule = ruleDataUtils.getRule(
+      RuleKeyEnum.DEATH_SAVING_THROWS,
+      ruleData
+    );
+
+    return (
+      <div>
+        <Heading>Death Saving Throws Rules</Heading>
+        <HtmlContent
+          html={deathSavesRule?.description ? deathSavesRule.description : ""}
+          withoutTooltips
+        />
+      </div>
+    );
+  };
+
+  return (
+    <div className={className} {...props}>
+      <Header>HP Management</Header>
+      <div className={styles.container}>
+        {hpInfo.remainingHp <= 0 &&
+          (deathCause === Constants.DeathCauseEnum.NONE ||
+            deathCause === Constants.DeathCauseEnum.DEATHSAVES) && (
+            <DeathSavesManager damageValue={damage} className={styles.border} />
+          )}
+        {deathCause !== Constants.DeathCauseEnum.NONE && (
+          <RestoreLifeManager
+            onSave={onRestoreToLife}
+            className={styles.border}
+          />
+        )}
+        <HitPointsSummary
+          hpInfo={hpInfo}
+          showOriginalMax
+          showPermanentInputs
+          className={styles.border}
+        />
+        <HitPointsAdjuster
+          hpInfo={hpInfo}
+          handleDamageUpdate={handleDamageUpdate}
+          className={styles.border}
+        />
+        <HitPointsOverrides className={styles.border} />
+        {hpInfo.remainingHp <= 0 &&
+          (deathCause === Constants.DeathCauseEnum.NONE ||
+            deathCause === Constants.DeathCauseEnum.DEATHSAVES) &&
+          renderDeathSavesRules()}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsOverrides/HitPointsOverrides.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsOverrides/HitPointsOverrides.tsx
new file mode 100644
index 0000000..1f13de9
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsOverrides/HitPointsOverrides.tsx
@@ -0,0 +1,150 @@
+import clsx from "clsx";
+import { createRef, FC, HTMLAttributes, useState } from "react";
+import { useDispatch } from "react-redux";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import {
+  HP_BONUS_VALUE,
+  HP_DAMAGE_TAKEN_VALUE,
+  HP_OVERRIDE_MAX_VALUE,
+  HP_TEMP_VALUE,
+} from "~/subApps/sheet/constants";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {}
+
+export const HitPointsOverrides: FC<Props> = ({ className, ...props }) => {
+  const { characterActions, hpInfo, ruleData, ruleDataUtils, helperUtils } =
+    useCharacterEngine();
+  const dispatch = useDispatch();
+
+  const [maxModifier, setMaxModifier] = useState<number | null>(hpInfo.bonusHp);
+  const [maxOverride, setMaxOverride] = useState<number | null>(
+    hpInfo.overrideHp
+  );
+
+  const maxModifierInput = createRef<HTMLInputElement>();
+  const maxOverrideInput = createRef<HTMLInputElement>();
+
+  /* --- Helper functions --- */
+
+  const updateDamageTaken = (maxHp: number) => {
+    if (hpInfo.totalHp !== null) {
+      let maxDiff = hpInfo.totalHp - maxHp;
+      if (maxDiff > 0) {
+        let newRemovedHp = Math.max(
+          HP_DAMAGE_TAKEN_VALUE.MIN,
+          hpInfo.removedHp - maxDiff
+        );
+        if (newRemovedHp !== hpInfo.removedHp) {
+          dispatch(
+            characterActions.hitPointsSet(
+              newRemovedHp,
+              hpInfo.tempHp ?? HP_TEMP_VALUE.MIN
+            )
+          );
+        }
+      }
+    }
+  };
+
+  const onKeyUp = (
+    func: any,
+    evt: React.KeyboardEvent<HTMLInputElement>
+  ): void => {
+    if (evt.key === "Enter") {
+      func(evt);
+    }
+  };
+
+  /* --- Max hit point modifier functions --- */
+
+  const onChangeMaxModifier = (evt: React.ChangeEvent<HTMLInputElement>) => {
+    setMaxModifier(helperUtils.parseInputInt(evt.target.value));
+  };
+
+  const onBlurMaxModifier = (evt: React.FocusEvent<HTMLInputElement>) => {
+    let value = helperUtils.parseInputInt(evt.target.value);
+    if (value !== null) {
+      value = helperUtils.clampInt(
+        value,
+        HP_BONUS_VALUE.MIN,
+        HP_BONUS_VALUE.MAX
+      );
+    }
+
+    if (value !== null) {
+      updateDamageTaken(hpInfo.baseTotalHp + value);
+    }
+
+    if (value !== hpInfo.bonusHp) {
+      dispatch(characterActions.bonusHitPointsSet(value));
+    }
+
+    setMaxModifier(value);
+  };
+
+  /* --- Max hit point override functions --- */
+
+  const onChangeMaxOverride = (evt: React.ChangeEvent<HTMLInputElement>) => {
+    setMaxOverride(helperUtils.parseInputInt(evt.target.value));
+  };
+
+  const onBlurMaxOverride = (evt: React.FocusEvent<HTMLInputElement>) => {
+    let value = helperUtils.parseInputInt(evt.target.value);
+    if (value !== null) {
+      value = helperUtils.clampInt(
+        value,
+        ruleDataUtils.getMinimumHpTotal(ruleData),
+        HP_OVERRIDE_MAX_VALUE
+      );
+    }
+
+    if (value !== null) {
+      updateDamageTaken(value);
+    }
+
+    if (value !== hpInfo.overrideHp) {
+      //TODO fix when it can accept null
+      dispatch(characterActions.overrideHitPointsSet(value as number));
+    }
+
+    setMaxOverride(value);
+  };
+
+  return (
+    <div className={clsx([styles.row, styles.overrides, className])} {...props}>
+      <label className={clsx([styles.column, styles.override, styles.label])}>
+        Max HP Modifier
+        <input
+          ref={maxModifierInput}
+          className={styles.input}
+          type="number"
+          value={maxModifier ?? ""}
+          min={HP_BONUS_VALUE.MIN}
+          max={HP_BONUS_VALUE.MAX}
+          onChange={onChangeMaxModifier}
+          onBlur={onBlurMaxModifier}
+          onKeyUp={onKeyUp.bind(this, onBlurMaxModifier)}
+          placeholder="--"
+        />
+      </label>
+      <label className={clsx([styles.column, styles.override, styles.label])}>
+        Override Max HP
+        <input
+          ref={maxOverrideInput}
+          className={styles.input}
+          type="number"
+          value={maxOverride ?? ""}
+          min={ruleDataUtils.getMinimumHpTotal(ruleData)}
+          max={HP_OVERRIDE_MAX_VALUE}
+          onChange={onChangeMaxOverride}
+          onBlur={onBlurMaxOverride}
+          onKeyUp={onKeyUp.bind(this, onBlurMaxOverride)}
+          placeholder="--"
+        />
+      </label>
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/RestoreLifeManager/RestoreLifeManager.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/RestoreLifeManager/RestoreLifeManager.tsx
new file mode 100644
index 0000000..d231219
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/RestoreLifeManager/RestoreLifeManager.tsx
@@ -0,0 +1,84 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useState } from "react";
+
+import {
+  ExclusiveCheckbox,
+  TypeScriptUtils,
+} from "@dndbeyond/character-components/es";
+
+import { Button } from "~/components/Button";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { ShortModelInfoContract } from "~/types";
+
+import { Heading } from "../../../components/Heading";
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  onSave?: (restoreType: ShortModelInfoContract) => void;
+}
+
+export const RestoreLifeManager: FC<Props> = ({
+  onSave,
+  className,
+  ...props
+}) => {
+  const { characterTheme, ruleData, ruleDataUtils } = useCharacterEngine();
+
+  const [activeChoice, setActiveChoice] = useState<number | null>(null);
+
+  const onClickRestore = () => {
+    if (onSave && activeChoice !== null) {
+      let restoreTypes = ruleDataUtils.getRestoreTypes(ruleData);
+      onSave(restoreTypes[activeChoice]);
+    }
+  };
+
+  const onClickReset = () => {
+    setActiveChoice(null);
+  };
+
+  const onSelection = (slotIdx: number) => {
+    setActiveChoice(slotIdx);
+  };
+
+  const renderRestoreLifeChoices = (): React.ReactNode => {
+    const restoreLifeChoices: Array<string> = ruleDataUtils
+      .getRestoreTypes(ruleData)
+      .map((type) => type.description)
+      .filter(TypeScriptUtils.isNotNullOrUndefined);
+
+    return (
+      <ExclusiveCheckbox
+        theme={characterTheme}
+        choices={restoreLifeChoices}
+        activeChoice={activeChoice}
+        onSelection={onSelection}
+      />
+    );
+  };
+
+  const renderActions = (): React.ReactNode => {
+    if (activeChoice === null) {
+      return null;
+    }
+
+    return (
+      <div className={styles.actions}>
+        <Button onClick={onClickRestore} themed size="xx-small">
+          Restore Life
+        </Button>
+        <Button onClick={onClickReset} themed size="xx-small" variant="outline">
+          Reset
+        </Button>
+      </div>
+    );
+  };
+
+  return (
+    <div className={clsx([className])} {...props}>
+      <Heading className={styles.heading}>Restore Life</Heading>
+      {renderRestoreLifeChoices()}
+      {renderActions()}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/InitiativePane/InitiativePane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/InitiativePane/InitiativePane.tsx
new file mode 100644
index 0000000..5a8867e
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/InitiativePane/InitiativePane.tsx
@@ -0,0 +1,91 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes } from "react";
+
+import { AdvantageIcon } from "@dndbeyond/character-components/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { RuleKeyEnum } from "~/constants";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useRuleData } from "~/hooks/useRuleData";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {}
+export const InitiativePane: FC<Props> = ({ ...props }) => {
+  const { ruleDataUtils, initiativeScore } = useRuleData();
+  const {
+    ruleData,
+    processedInitiative,
+    hasInitiativeAdvantage,
+    characterTheme,
+    formatUtils,
+  } = useCharacterEngine();
+
+  const staticTotal = processedInitiative + initiativeScore.amount;
+
+  let rule = ruleDataUtils.getRule(RuleKeyEnum.INITIATIVE, ruleData);
+
+  return (
+    <div {...props}>
+      <Header>
+        {hasInitiativeAdvantage && (
+          <AdvantageIcon
+            theme={characterTheme}
+            title={"Advantage on Initiative"}
+            className={styles.advantageIcon}
+          />
+        )}
+        Initiative{" "}
+        <span className={styles.modifier}>
+          (
+          <NumberDisplay
+            type="signed"
+            number={processedInitiative}
+            className={styles.signedNumber}
+          />
+          )
+        </span>
+      </Header>
+      <div className={styles.container}>
+        <p>
+          Initiative scores can replace rolls at your DM's discretion. Your
+          initiative score equals {initiativeScore.amount} plus your DEX
+          modifier.
+        </p>
+        <div
+          className={clsx([
+            styles.score,
+            hasInitiativeAdvantage && styles.isAdvantage,
+          ])}
+        >
+          <span className={styles.label}>Initiative Score: </span>
+          <span className={styles.amount}>{staticTotal}</span>
+        </div>
+        <div className={clsx([hasInitiativeAdvantage && styles.isAdvantage])}>
+          <span className={styles.labelSecondary}>
+            With Advantage (
+            {formatUtils.renderSignedNumber(initiativeScore.advantage)}):{" "}
+          </span>
+          <span className={styles.amount}>
+            {staticTotal + initiativeScore.advantage}
+          </span>
+        </div>
+        <div>
+          <span className={styles.labelSecondary}>
+            With Disadvantage (
+            {formatUtils.renderSignedNumber(initiativeScore.disadvantage)}):{" "}
+          </span>
+          <span className={styles.amount}>
+            {staticTotal + initiativeScore.disadvantage}
+          </span>
+        </div>
+      </div>
+      <HtmlContent
+        html={rule && rule.description ? rule.description : ""}
+        withoutTooltips
+      />
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/InspirationPane/InspirationPane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/InspirationPane/InspirationPane.tsx
new file mode 100644
index 0000000..7bbf377
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/InspirationPane/InspirationPane.tsx
@@ -0,0 +1,26 @@
+import { FC, HTMLAttributes } from "react";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { RuleKeyEnum } from "~/constants";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useRuleData } from "~/hooks/useRuleData";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {}
+export const InspirationPane: FC<Props> = ({ ...props }) => {
+  const { ruleData } = useCharacterEngine();
+  const { ruleDataUtils } = useRuleData();
+
+  let rule = ruleDataUtils.getRule(RuleKeyEnum.INSPIRATION, ruleData);
+  let description: string = "";
+  if (rule && rule.description) {
+    description = rule.description;
+  }
+
+  return (
+    <div {...props}>
+      <Header>Heroic Inspiration</Header>
+      <HtmlContent html={description} withoutTooltips />
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/panes/XpPane/XpPane.tsx b/ddb_main/subApps/sheet/components/Sidebar/panes/XpPane/XpPane.tsx
new file mode 100644
index 0000000..189eb2a
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/panes/XpPane/XpPane.tsx
@@ -0,0 +1,61 @@
+import { FC, HTMLAttributes, useEffect, useState } from "react";
+import { useDispatch } from "react-redux";
+
+import { characterActions } from "@dndbeyond/character-rules-engine/es";
+
+import { Button } from "~/components/Button";
+import { XpManager } from "~/components/XpManager";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { toastMessageActions } from "~/tools/js/Shared/actions";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {}
+export const XpPane: FC<Props> = ({ ...props }) => {
+  const dispatch = useDispatch();
+  const [newXpTotal, setNewXpTotal] = useState<number | null>(null);
+  const [shouldReset, setShouldReset] = useState<boolean>(false);
+
+  useEffect(() => {
+    setShouldReset(newXpTotal === null);
+  }, [newXpTotal]);
+
+  const handleReset = (): void => {
+    setNewXpTotal(null);
+  };
+
+  const handleSave = (): void => {
+    if (newXpTotal !== null) {
+      setNewXpTotal(null);
+
+      dispatch(characterActions.xpSet(newXpTotal));
+      dispatch(
+        toastMessageActions.toastSuccess(
+          "Experience Points Updated",
+          "You have successfully updated your XP"
+        )
+      );
+    }
+  };
+
+  const handleXpUpdates = (newXpTotal: number): void => {
+    setNewXpTotal(newXpTotal);
+  };
+
+  return (
+    <div {...props}>
+      <Header>Manage XP</Header>
+      <XpManager handleXpUpdates={handleXpUpdates} shouldReset={shouldReset} />
+      {newXpTotal !== null && (
+        <div className={styles.buttonGroup}>
+          <Button themed variant="solid" size="x-small" onClick={handleSave}>
+            Apply Changes
+          </Button>
+          <Button themed onClick={handleReset} size="x-small" variant="outline">
+            Cancel
+          </Button>
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/components/Sidebar/svgs/AlignLeftIcon/AlignLeftIcon.tsx b/ddb_main/subApps/sheet/components/Sidebar/svgs/AlignLeftIcon/AlignLeftIcon.tsx
new file mode 100644
index 0000000..1cc0a52
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/svgs/AlignLeftIcon/AlignLeftIcon.tsx
@@ -0,0 +1,18 @@
+import { FC, HTMLAttributes } from "react";
+
+type SvgProps = HTMLAttributes<SVGElement>;
+
+export const AlignLeftIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 24 24"
+    width="1em"
+    height="1em"
+    aria-labelledby="alignLeftTitle"
+    {...props}
+  >
+    <title id="alignLeftTitle">Sidebar Align Left Icon</title>
+    <path d="M21,3V21H9.5V3H21m3-3H6.5V24H24V0Z" />
+    <rect x="0.5" y="0.5" width="5.91" height="23" />
+    <path d="M5.91,1V23H1V1H5.91m1-1H0V24H6.91V0Z" />
+  </svg>
+);
diff --git a/ddb_main/subApps/sheet/components/Sidebar/svgs/AlignRightIcon/AlignRightIcon.tsx b/ddb_main/subApps/sheet/components/Sidebar/svgs/AlignRightIcon/AlignRightIcon.tsx
new file mode 100644
index 0000000..341fbf9
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/svgs/AlignRightIcon/AlignRightIcon.tsx
@@ -0,0 +1,18 @@
+import { FC, HTMLAttributes } from "react";
+
+type SvgProps = HTMLAttributes<SVGElement>;
+
+export const AlignRightIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 24 24"
+    width="1em"
+    height="1em"
+    aria-labelledby="alignRightTitle"
+    {...props}
+  >
+    <title id="alignRightTitle">Sidebar Align Right Icon</title>
+    <path d="M15.5,3V21H3V3H15.5m3-3H0V24H18.5V0Z" />
+    <rect x="17.59" y="0.5" width="5.91" height="23" />
+    <path d="M23,1V23H18.09V1H23m1-1H17.09V24H24V0Z" />
+  </svg>
+);
diff --git a/ddb_main/subApps/sheet/components/Sidebar/svgs/ArrowsLeftIcon/ArrowsLeftIcon.tsx b/ddb_main/subApps/sheet/components/Sidebar/svgs/ArrowsLeftIcon/ArrowsLeftIcon.tsx
new file mode 100644
index 0000000..81c423c
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/svgs/ArrowsLeftIcon/ArrowsLeftIcon.tsx
@@ -0,0 +1,17 @@
+import { FC, HTMLAttributes } from "react";
+
+type SvgProps = HTMLAttributes<SVGElement>;
+
+export const ArrowsLeftIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 16 16"
+    width="1em"
+    height="1em"
+    aria-labelledby="leftArrowsTitle"
+    {...props}
+  >
+    <title id="leftArrowsTitle">Left Arrows Icon</title>
+    <path d="M11,2.48,5,8l6,5.52a1.3,1.3,0,0,1-.21,2.12h0a2.25,2.25,0,0,1-2.68-.17L0,8,8.11.53A2.25,2.25,0,0,1,10.79.36h0A1.3,1.3,0,0,1,11,2.48Z" />
+    <polygon points="6.92 8 16 0 16 16 6.92 8" />
+  </svg>
+);
diff --git a/ddb_main/subApps/sheet/components/Sidebar/svgs/ArrowsRightIcon/ArrowsRightIcon.tsx b/ddb_main/subApps/sheet/components/Sidebar/svgs/ArrowsRightIcon/ArrowsRightIcon.tsx
new file mode 100644
index 0000000..92f4409
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/svgs/ArrowsRightIcon/ArrowsRightIcon.tsx
@@ -0,0 +1,17 @@
+import { FC, HTMLAttributes } from "react";
+
+type SvgProps = HTMLAttributes<SVGElement>;
+
+export const ArrowsRightIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 16 16"
+    width="1em"
+    height="1em"
+    aria-labelledby="rightArrowsTitle"
+    {...props}
+  >
+    <title id="rightArrowsTitle">Right Arrows Icon</title>
+    <path d="M5.21.36h0A2.25,2.25,0,0,1,7.89.53L16,8,7.89,15.47a2.25,2.25,0,0,1-2.68.17h0A1.3,1.3,0,0,1,5,13.52L11,8,5,2.48A1.3,1.3,0,0,1,5.21.36Z" />
+    <polygon points="9.09 8 0 0 0 16 9.09 8" />
+  </svg>
+);
diff --git a/ddb_main/subApps/sheet/components/Sidebar/svgs/FixedIcon/FixedIcon.tsx b/ddb_main/subApps/sheet/components/Sidebar/svgs/FixedIcon/FixedIcon.tsx
new file mode 100644
index 0000000..2ab2041
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/svgs/FixedIcon/FixedIcon.tsx
@@ -0,0 +1,28 @@
+import { FC, HTMLAttributes } from "react";
+
+type SvgProps = HTMLAttributes<SVGElement>;
+
+export const FixedIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 24 24"
+    width="1em"
+    height="1em"
+    aria-labelledby="fixedTitle"
+    {...props}
+  >
+    <title id="fixedTitle">Sidebar Fixed Icon</title>
+    <path d="M15.5,3V21H3V3H15.5m3-3H0V24H18.5V0Z" />
+    <rect x="17.59" y="0.5" width="5.91" height="23" />
+    <path d="M23,1V23H18.09V1H23m1-1H17.09V24H24V0Z" />
+    <line
+      fill="none"
+      stroke="#000"
+      strokeMiterlimit={10}
+      strokeWidth="3px"
+      x1="12"
+      y1="5.5"
+      x2="12"
+      y2="19"
+    />
+  </svg>
+);
diff --git a/ddb_main/subApps/sheet/components/Sidebar/svgs/OverlayIcon/OverlayIcon.tsx b/ddb_main/subApps/sheet/components/Sidebar/svgs/OverlayIcon/OverlayIcon.tsx
new file mode 100644
index 0000000..372db0b
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/svgs/OverlayIcon/OverlayIcon.tsx
@@ -0,0 +1,19 @@
+import { FC, HTMLAttributes } from "react";
+
+type SvgProps = HTMLAttributes<SVGElement>;
+
+export const OverlayIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 24 24"
+    width="1em"
+    height="1em"
+    aria-labelledby="overlayTitle"
+    {...props}
+  >
+    <title id="overlayTitle">Sidebar Overlay Icon</title>
+    <path d="M14.5,3V21H3V3H14.5m3-3H0V24H17.5V0Z" />
+    <rect x="17.59" y="0.5" width="5.91" height="23" />
+    <path d="M23,1V23H18.09V1H23m1-1H17.09V24H24V0Z" />
+    <polygon points="6.28 12.32 12.5 19.14 12.5 5.5 6.28 12.32" />
+  </svg>
+);
diff --git a/ddb_main/subApps/sheet/components/Sidebar/types.ts b/ddb_main/subApps/sheet/components/Sidebar/types.ts
new file mode 100644
index 0000000..c73f9c4
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/Sidebar/types.ts
@@ -0,0 +1,220 @@
+import {
+  AbilityManager,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+export interface PaneIdentifiersCommonId {
+  id: string | number;
+}
+
+export interface PaneIdentifiersIntId {
+  id: number;
+}
+
+export interface PaneIdentifiersAction extends PaneIdentifiersCommonId {
+  entityTypeId: string | null;
+}
+
+export interface PaneIdentifiersClassSpell {
+  classId: number;
+  spellId: number;
+  castLevel?: number;
+}
+
+export interface PaneIdentifiersNote {
+  noteType: string;
+}
+
+export interface PaneIdentifiersClassFeature extends PaneIdentifiersCommonId {
+  classMappingId: number;
+}
+
+export interface PaneIdentifiersBasicAction extends PaneIdentifiersIntId {}
+export interface PaneIdentifiersPreferenceHitPointConfirm
+  extends PaneIdentifiersIntId {}
+export interface PaneIdentifiersPreferenceProgressionConfirm
+  extends PaneIdentifiersIntId {}
+export interface PaneIdentifiersFeat extends PaneIdentifiersIntId {}
+
+export interface PaneIdentifiersItem extends PaneIdentifiersCommonId {}
+export interface PaneIdentifiersItem extends PaneIdentifiersCommonId {}
+export interface PaneIdentifiersCustomItem extends PaneIdentifiersCommonId {}
+export interface PaneIdentifiersCustomSkill extends PaneIdentifiersCommonId {}
+export interface PaneIdentifiersCustomAction extends PaneIdentifiersCommonId {}
+export interface PaneIdentifiersCharacterSpell extends PaneIdentifiersCommonId {
+  castLevel?: number;
+}
+export interface PaneIdentifiersRacialTrait extends PaneIdentifiersCommonId {}
+export interface PaneIdentifiersAbilitySavingThrow
+  extends PaneIdentifiersCommonId {}
+export interface PaneIdentifiersSkill extends PaneIdentifiersCommonId {}
+export interface PaneIdentifiersCreature extends PaneIdentifiersCommonId {}
+export interface PaneIdentifiersVehicle extends PaneIdentifiersCommonId {}
+export interface PaneIdentifiersInfusionChoice
+  extends PaneIdentifiersCommonId {}
+
+export interface PaneIdentifiersAbility {
+  ability: AbilityManager;
+}
+
+export interface PaneIdentifiersPreferenceOptionalClassFeaturesConfirm {
+  spellListIds: Array<number>;
+  newIsEnabled: boolean;
+}
+
+export interface PaneIdentifiersPreferenceOptionalOriginsConfirm {
+  spellListIds: Array<number>;
+  newIsEnabled: boolean;
+}
+
+export interface PaneIdentifiersVehicleComponent
+  extends PaneIdentifiersCommonId {
+  vehicleId: number;
+}
+
+export interface PaneIdentifiersVehicleActionStation
+  extends PaneIdentifiersCommonId {
+  vehicleId: number;
+}
+
+export interface PaneIdentifiersContainer {
+  containerDefinitionKey: string;
+  showAddItems?: boolean;
+}
+
+export interface PaneIdentifiersCurrencyContext {
+  containerDefinitionKeyContext: string | null;
+}
+
+export interface PaneIdentifiersSettingsContext {
+  context: string;
+}
+
+export interface PaneIdentifiersBlessing {
+  id: string;
+}
+
+export interface PaneIdentifiersTrait {
+  type: Constants.TraitTypeEnum;
+}
+
+export type PaneIdentifiers =
+  | PaneIdentifiersAction
+  | PaneIdentifiersClassSpell
+  | PaneIdentifiersNote
+  | PaneIdentifiersClassFeature
+  | PaneIdentifiersRacialTrait
+  | PaneIdentifiersItem
+  | PaneIdentifiersBasicAction
+  | PaneIdentifiersCharacterSpell
+  | PaneIdentifiersFeat
+  | PaneIdentifiersCustomAction
+  | PaneIdentifiersCustomItem
+  | PaneIdentifiersCustomSkill
+  | PaneIdentifiersAbility
+  | PaneIdentifiersSkill
+  | PaneIdentifiersAbilitySavingThrow
+  | PaneIdentifiersPreferenceHitPointConfirm
+  | PaneIdentifiersPreferenceOptionalClassFeaturesConfirm
+  | PaneIdentifiersPreferenceOptionalOriginsConfirm
+  | PaneIdentifiersPreferenceProgressionConfirm
+  | PaneIdentifiersCreature
+  | PaneIdentifiersVehicle
+  | PaneIdentifiersVehicleComponent
+  | PaneIdentifiersInfusionChoice
+  | PaneIdentifiersContainer
+  | PaneIdentifiersCurrencyContext
+  | PaneIdentifiersSettingsContext
+  | PaneIdentifiersBlessing
+  | PaneIdentifiersTrait;
+
+export interface PaneComponentProperties {
+  forceDarkMode?: boolean;
+  isFullWidth?: boolean;
+}
+
+export type SidebarPaneComponent<T> = React.ComponentType<T>;
+
+export interface PaneComponentInfo {
+  type: PaneComponentEnum;
+  identifiers?: PaneIdentifiers | null;
+}
+
+export enum PaneComponentEnum {
+  ERROR_404 = "ERROR_404",
+  ABILITY = "ABILITY",
+  ABILITY_SAVING_THROW = "ABILITY_SAVING_THROW",
+  ACTION = "ACTION",
+  ARMOR_MANAGE = "ARMOR_MANAGE",
+  BASIC_ACTION = "BASIC_ACTION",
+  BACKGROUND = "BACKGROUND",
+  BLESSING_DETAIL = "BLESSING_DETAIL",
+  CAMPAIGN = "CAMPAIGN",
+  CHARACTER_MANAGE = "CHARACTER_MANAGE",
+  CHARACTER_SPELL_DETAIL = "CHARACTER_SPELL_DETAIL",
+  CLASS_FEATURE_DETAIL = "CLASS_FEATURE_DETAIL",
+  CLASS_SPELL_DETAIL = "CLASS_SPELL_DETAIL",
+  CONDITION_MANAGE = "CONDITION_MANAGE",
+  CONTAINER = "CONTAINER",
+  CREATURE = "CREATURE",
+  CURRENCY = "CURRENCY",
+  CUSTOM_ACTIONS = "CUSTOM_ACTIONS",
+  CUSTOM_ACTION = "CUSTOM_ACTION",
+  CUSTOM_SKILL = "CUSTOM_SKILL",
+  DECORATE = "DECORATE",
+  DEFENSE_MANAGE = "DEFENSE_MANAGE",
+  DESCRIPTION = "DESCRIPTION",
+  ENCUMBRANCE = "ENCUMBRANCE",
+  EQUIPMENT_MANAGE = "EQUIPMENT_MANAGE",
+  EXPORT_PDF = "EXPORT_PDF",
+  EXTRA_MANAGE = "EXTRA_MANAGE",
+  FEAT_DETAIL = "FEAT_DETAIL",
+  FEATS_MANAGE = "FEATS_MANAGE",
+  GAME_LOG = "GAME_LOG",
+  HEALTH_MANAGE = "HEALTH_MANAGE",
+  INFUSION_CHOICE = "INFUSION_CHOICE",
+  INITIATIVE = "INITIATIVE",
+  INSPIRATION = "INSPIRATION",
+  ITEM_DETAIL = "ITEM_DETAIL",
+  LONG_REST = "LONG_REST",
+  NOTE_MANAGE = "NOTE_MANAGE",
+  POSSESSIONS_MANAGE = "POSSESSIONS_MANAGE",
+  PREFERENCES = "PREFERENCES",
+  PREFERENCES_HIT_POINT_CONFIRM = "PREFERENCES_HIT_POINT_CONFIRM",
+  PREFERENCES_OPTIONAL_CLASS_FEATURES_CONFIRM = "PREFERENCES_OPTIONAL_CLASS_FEATURES_CONFIRM",
+  PREFERENCES_OPTIONAL_ORIGINS_CONFIRM = "PREFERENCES_OPTIONAL_ORIGINS_CONFIRM",
+  PREFERENCES_PROGRESSION_CONFIRM = "PREFERENCES_PROGRESSION_CONFIRM",
+  PROFICIENCIES = "PROFICIENCIES",
+  PROFICIENCY_BONUS = "PROFICIENCY_BONUS",
+  SPECIES_TRAIT_DETAIL = "SPECIES_TRAIT_DETAIL",
+  SAVING_THROWS = "SAVING_THROWS",
+  SENSE_MANAGE = "SENSE_MANAGE",
+  SETTINGS = "SETTINGS",
+  SHARE_URL = "SHARE_URL",
+  SHORT_REST = "SHORT_REST",
+  SKILLS = "SKILLS",
+  SKILL = "SKILL",
+  SPEED_MANAGE = "SPEED_MANAGE",
+  SPELL_MANAGE = "SPELL_MANAGE",
+  STARTING_EQUIPMENT = "STARTING_EQUIPMENT",
+  TRAIT = "TRAIT",
+  VEHICLE = "VEHICLE",
+  VEHICLE_COMPONENT = "VEHICLE_COMPONENT",
+  VEHICLE_ACTION_STATION = "VEHICLE_ACTION_STATION",
+  XP = "XP",
+}
+
+export enum SidebarPlacementEnum {
+  FIXED = "fixed",
+  OVERLAY = "overlay",
+}
+
+export enum SidebarAlignmentEnum {
+  LEFT = "left",
+  RIGHT = "right",
+}
+
+export interface SidebarPositionInfo {
+  left: number | string;
+  right: number | string;
+}
diff --git a/ddb_main/subApps/sheet/components/SpeciesDetail/SpeciesDetail.tsx b/ddb_main/subApps/sheet/components/SpeciesDetail/SpeciesDetail.tsx
new file mode 100644
index 0000000..f8b59f0
--- /dev/null
+++ b/ddb_main/subApps/sheet/components/SpeciesDetail/SpeciesDetail.tsx
@@ -0,0 +1,85 @@
+import { FC } from "react";
+
+import {
+  AbilityLookup,
+  Action,
+  DataOriginRefData,
+  Feat,
+  RacialTrait,
+  RacialTraitUtils,
+  RuleData,
+  SnippetData,
+  Spell,
+  CharacterTheme,
+  FeatManager,
+  CharacterFeaturesManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { SpeciesTraitFeatureSnippet } from "~/tools/js/CharacterSheet/components/FeatureSnippet";
+
+export interface SpeciesDetailProps {
+  onActionUseSet: (action: Action, uses: number) => void;
+  onActionClick: (action: Action) => void;
+  onSpellClick: (spell: Spell) => void;
+  onSpellUseSet: (spell: Spell, uses: number) => void;
+  onFeatureClick: (feature: RacialTrait) => void;
+  feats: Array<Feat>;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  speciesTraits: RacialTrait[];
+  onFeatClick: (feat: FeatManager) => void;
+  featuresManager: CharacterFeaturesManager
+}
+
+export const SpeciesDetail: FC<SpeciesDetailProps> = ({
+  speciesTraits,
+  onActionUseSet,
+  onActionClick,
+  onSpellClick,
+  onSpellUseSet,
+  ruleData,
+  abilityLookup,
+  dataOriginRefData,
+  proficiencyBonus,
+  theme,
+  onFeatureClick,
+  feats,
+  isReadonly,
+  snippetData,
+  onFeatClick,
+  featuresManager
+}) => {
+  if (speciesTraits.length === 0) {
+    return null;
+  }
+  return (
+    <div>
+      {speciesTraits.map((speciesTrait) => (
+        <SpeciesTraitFeatureSnippet
+          key={RacialTraitUtils.getId(speciesTrait)}
+          speciesTrait={speciesTrait}
+          isReadonly={isReadonly}
+          snippetData={snippetData}
+          ruleData={ruleData}
+          abilityLookup={abilityLookup}
+          theme={theme}
+          feats={feats}
+          proficiencyBonus={proficiencyBonus}
+          dataOriginRefData={dataOriginRefData}
+          onActionUseSet={onActionUseSet}
+          onActionClick={onActionClick}
+          onSpellClick={onSpellClick}
+          onSpellUseSet={onSpellUseSet}
+          onFeatureClick={onFeatureClick}
+          onFeatClick={onFeatClick}
+          featuresManager={featuresManager}
+        />
+      ))}
+    </div>
+  );
+};
diff --git a/ddb_main/subApps/sheet/constants.ts b/ddb_main/subApps/sheet/constants.ts
new file mode 100644
index 0000000..96b83b7
--- /dev/null
+++ b/ddb_main/subApps/sheet/constants.ts
@@ -0,0 +1,23 @@
+export const sidebarId = "sidebar";
+
+export const SIGNED_32BIT_INT_MAX_VALUE = 1_000_000_000;
+export const SIGNED_32BIT_INT_MIN_VALUE = -1_000_000_000;
+
+export const HP_TEMP_VALUE = {
+  MAX: 999,
+  MIN: 0,
+};
+
+export const HP_BONUS_VALUE = {
+  MAX: 99,
+  MIN: -99,
+};
+
+export const HP_OVERRIDE_MAX_VALUE = 999;
+
+export const HP_BASE_MAX_VALUE = 500;
+
+export const HP_DAMAGE_TAKEN_VALUE = {
+  MAX: SIGNED_32BIT_INT_MAX_VALUE,
+  MIN: 0,
+};
diff --git a/ddb_main/subApps/sheet/contexts/Sheet/Sheet.tsx b/ddb_main/subApps/sheet/contexts/Sheet/Sheet.tsx
new file mode 100644
index 0000000..0c76d29
--- /dev/null
+++ b/ddb_main/subApps/sheet/contexts/Sheet/Sheet.tsx
@@ -0,0 +1,35 @@
+import { createContext, FC, useContext, useState } from "react";
+
+import { MobileSections } from "../../types";
+
+export interface SheetContextType {
+  mobileActiveSectionId: MobileSections;
+  setMobileActiveSectionId: (sectionId: MobileSections) => void;
+  setSwipedAmount: (amount: number) => void;
+  swipedAmount: number;
+}
+
+export const SheetContext = createContext<SheetContextType>(null!);
+
+export const SheetProvider: FC = ({ children }) => {
+  const [mobileActiveSectionId, setMobileActiveSectionId] =
+    useState<MobileSections>("main");
+  const [swipedAmount, setSwipedAmount] = useState(0);
+
+  return (
+    <SheetContext.Provider
+      value={{
+        mobileActiveSectionId,
+        setMobileActiveSectionId,
+        setSwipedAmount,
+        swipedAmount,
+      }}
+    >
+      {children}
+    </SheetContext.Provider>
+  );
+};
+
+export const useSheetContext = () => {
+  return useContext(SheetContext);
+};
diff --git a/ddb_main/svgs/Svgs.tsx b/ddb_main/svgs/Svgs.tsx
new file mode 100644
index 0000000..655ca1c
--- /dev/null
+++ b/ddb_main/svgs/Svgs.tsx
@@ -0,0 +1,347 @@
+import { FC, HTMLAttributes } from "react";
+
+import styles from "./styles.module.css";
+
+type SvgProps = HTMLAttributes<SVGElement>;
+
+/*** MOBILE MENU ICONS ***/
+
+export const AttributesIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 134 144"
+    width="1em"
+    height="1em"
+    aria-labelledby="attributesTitle"
+    {...props}
+  >
+    <title id="attributesTitle">Attributes Icon</title>
+    <g>
+      <path d="M95.2078222,31.6564445 C102.611927,36.9740755 106.365398,41.8804109 106.365398,41.8804109 L110.739645,44.7774205 C108.552521,43.3289157 104.178274,43.3289157 104.178274,43.3289157 C118.759099,49.122935 120.217182,59.2624686 120.217182,59.2624686 C119.48814,57.8139638 115.113893,57.8139638 115.113893,57.8139638 C124.591429,61.4352258 127.507594,73.0232643 127.507594,73.0232643 C126.049512,71.5747595 120.946223,71.5747595 120.946223,71.5747595 C127.507594,75.1960215 128.965677,85.3355552 128.965677,85.3355552 C126.049512,81.7142932 120.217182,81.7142932 120.217182,81.7142932 C131.1528,89.6810696 133.339924,107.78738 133.339924,107.78738 C131.1528,104.89037 129.694718,104.166118 129.694718,104.166118 C134.798007,115.754156 134.798007,125.169437 132.610883,132.411962 C132.610883,132.411962 132.610883,133.136214 132.610883,134.584719 C131.881842,136.757476 130.423759,141.10299 123.862388,144 C123.862388,144 124.591429,130.963457 113.65581,121.548175 C113.65581,121.548175 115.113893,133.136214 119.48814,137.481728 C119.48814,137.481728 111.468686,137.481728 107.82348,131.687709 C107.82348,131.687709 107.094439,137.481728 110.010604,141.827243 C110.010604,141.827243 94.7007375,138.930233 91.0555312,128.790699 C91.0555312,128.790699 88.8684074,136.033224 93.242655,143.275748 C93.242655,143.275748 71.3714172,142.551495 63.3519633,130.239204 C63.3519633,130.239204 65.5390871,135.308971 60.4357983,142.551495 C60.4357983,142.551495 50.2292206,139.654486 46.5840144,130.963457 C46.5840144,130.963457 43.6678493,137.481728 47.3130556,143.275748 C47.3130556,143.275748 34.9193542,143.275748 23.9837353,131.687709 C23.9837353,131.687709 23.9837353,138.205981 26.8999003,141.827243 C26.8999003,141.827243 19.6094877,137.481728 17.422364,132.411962 C17.422364,132.411962 9.40291011,119.375418 7.94482759,110.684389 L9.40291011,98.3720985 C9.40291011,98.3720985 10.1319514,94.0265841 11.5900339,91.1295744 C13.7771577,91.1295744 16.6933227,91.8538268 18.8804465,92.5780792 C25.4418178,96.1993413 42.2097668,104.166118 57.5196332,104.166118 C58.9777158,104.166118 60.4357983,104.166118 61.8938808,104.166118 C77.2037473,102.717613 84.4941599,91.1295744 87.4103249,85.3355552 C90.3264899,88.9568172 94.7007375,92.5780792 94.7007375,92.5780792 L98.3459438,96.1993413 L97.6169025,91.1295744 C96.8878613,87.5083124 94.7007375,82.4385456 93.242655,78.0930312 L94.7007375,78.8172836 L94.7007375,75.1960215 C94.7007375,73.7475167 93.9716962,72.2990119 93.9716962,70.8505071 C94.7007375,71.5747595 95.4297788,71.5747595 95.4297788,71.5747595 L99.8040263,73.7475167 L97.6169025,69.4020023 C96.15882,65.0564879 93.9716962,62.1594782 92.5136137,59.986721 L96.15882,59.986721 L93.9716962,57.0897114 C93.242655,56.365459 93.242655,56.365459 92.5136137,55.6412066 L98.3459438,56.365459 L94.7007375,52.744197 C93.242655,51.2956922 92.5136137,49.8471874 91.0555312,49.122935 L99.0749851,51.2956922 L95.4297788,46.9501777 C89.5974487,40.4319061 61.1648395,29.56812 56.0615507,27.3953628 C58.5157508,24.3477639 60.9699508,22.3260901 63.8587068,20.4669385 C63.5302449,20.2641653 63.3519633,20.1528388 63.3519633,20.1528388 C63.3519633,20.1528388 95.4297788,-5.19599542 134.068966,14.3588195 C134.068966,14.3588195 123.862388,14.3588195 120.217182,16.5315767 C120.217182,16.5315767 123.862388,15.8073243 125.32047,16.5315767 C125.32047,16.5315767 121.675264,18.7043339 116.571975,17.9800815 C116.571975,17.9800815 116.571975,18.7043339 120.946223,19.4285864 C120.946223,19.4285864 118.030058,22.325596 110.010604,22.325596 C110.010604,22.325596 112.197728,23.7741008 115.113893,23.7741008 C115.113893,23.7741008 112.926769,26.6711104 104.907315,26.6711104 C104.907315,26.6711104 105.636356,27.3953628 107.094439,27.3953628 C107.094439,27.3953628 103.449233,28.8438676 100.533068,28.1196152 C100.533068,28.1196152 101.99115,29.56812 102.720191,29.56812 C102.720191,29.56812 98.5159258,30.2642282 95.2078222,31.6564445 Z" />
+      <path d="M27.5139937 20.2690075C34.1884697 12.7639713 49.9667473-1.48054959 72.4965517.125097866 72.4965517.125097866 65.9756795 3.01673626 63.8020554 5.18546506 63.8020554 5.18546506 65.9756795 3.73964586 67.4247622 3.73964586 67.4247622 3.73964586 65.9756795 5.90837466 62.3529727 7.35419386 62.3529727 7.35419386 62.3529727 8.07710346 65.2511381 7.35419386 65.2511381 7.35419386 63.8020554 9.52292266 58.7302659 12.4145611 58.7302659 12.4145611 60.1793486 12.4145611 62.3529727 11.6916515 62.3529727 11.6916515 61.6928611 13.667526 57.2222477 15.733298 59.0313156 15.8896856 60.7620132 16.029109 62.3529727 16.029109 55.1075591 20.3665666 48.5866868 26.872753 45.6885214 38.4393066 39.8921905 60.1265946 28.2995287 60.1265946 18.880491 61.5724138 18.1559496 59.403685 15.2577842 57.9578658 12.3596187 56.5120466L10.1859946 55.789137C8.66754915 41.6488966 13.8672015 27.5086562 27.5139937 20.2690075zM83.1921978 70.2900455L85.3678858 68.8397832C84.6426564 66.6643899 83.9174271 65.2141277 83.9174271 65.2141277L86.0931151 63.7638654C84.6426564 60.8633409 83.1921978 59.4130787 82.4669685 59.4130787L73.7642169 51.4366364 79.5660513 54.3371609 81.0165099 52.1617675C81.0165099 52.1617675 81.0165099 52.1617675 81.7417392 52.1617675 82.4669685 52.1617675 83.1921978 52.8868986 83.9174271 52.8868986 81.0165099 50.7115053 79.5660513 49.2612431 79.5660513 49.2612431L73.7642169 44.1853252 80.2912806 46.3607186C73.0389876 42.0099319 62.160548 37.6591452 57.0839429 36.2088829L57.8091722 34.7586207C55.6334843 37.6591452 54.1830257 41.2848008 52.732567 44.9104563 52.0073377 47.8109808 51.2821084 49.9863742 50.5568791 52.1617675 50.5568791 52.1617675 51.2821084 52.1617675 51.2821084 52.1617675 55.6334843 52.1617675 63.6110066 55.7874231 63.6110066 60.1382098 63.6110066 64.4889965 57.8091722 72.4654388 53.4577964 72.4654388 49.8316498 72.4654388 44.0298154 68.1146521 43.3045861 64.4889965 38.9532103 68.8397832 33.8766051 68.1146521 30.2504586 68.1146521 33.8766051 73.1905699 30.9756879 78.9916189 30.9756879 79.71675L33.1513758 81.8921434 28.8 82.6172745 29.5252293 84.0675367C29.5252293 84.0675367 49.1064205 95.6696346 63.6110066 94.2193724 77.3903634 92.7691101 81.7417392 78.2664878 82.4669685 77.5413567L83.1921978 73.9157011C86.8334533 78.0123091 88.8958241 80.5440338 89.3793103 81.5108753 87.9288517 75.7098264 83.1921978 70.2900455 83.1921978 70.2900455zM7.88605046 92.9161468C7.91608043 92.9212845 7.94640383 92.9269787 7.97703405 92.933244 6.45759237 95.8728302 5.72032862 97.3241379 5.72032862 97.3241379 4.96060778 95.8543448 4.99385226 95.8387558 4.23413142 94.3689627 4.29313889 94.340423 4.35100539 94.3114841 4.4078161 94.2822376 4.34037678 94.3162933 4.27145113 94.3504225 4.20088694 94.3845517-6.43520483 77.481931 6.48004946 60.5793103 6.48004946 60.5793103 10.2786537 62.0491034 13.317537 65.7235862 14.8369787 69.398069 17.8758621 75.2772414 17.8758621 81.8913103 17.8758621 81.8913103 11.7980953 82.6262069 8.75921198 87.7704828 7.99949114 92.9147586 7.96120328 92.9147586 7.92339782 92.9152253 7.88605046 92.9161468z" />
+    </g>
+  </svg>
+);
+
+export const ActionsIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 149 144"
+    width="1em"
+    height="1em"
+    aria-labelledby="actionsTitle"
+    {...props}
+  >
+    <title id="actionsTitle">Actions Icon</title>
+    <g opacity=".89" transform="translate(.74)">
+      <path d="M132.39628,49.653393 C131.802145,45.5227285 130.482935,41.5048751 128.47568,37.7919268 C126.616052,35.4844132 123.845339,34.099057 120.883551,33.9958627 L120.37741,33.9958627 C116.024895,33.8911513 111.944792,36.1079 109.664073,39.8164943 C106.458508,30.5372265 102.999872,25.3070938 96.6730984,25.3070938 C91.6517967,25.1734503 86.8640495,27.4265078 83.7664805,31.3807963 C80.8077369,35.4487749 79.9911944,40.6934904 81.5731991,45.4684119 C81.5731991,46.5650526 82.5854828,48.5896201 83.4290526,51.2046865 C79.3039463,46.5925507 73.6320228,43.6515533 67.4855835,42.9377025 C64.1399815,42.9905965 61.0145904,44.6157999 59.0498856,47.3242654 C54.4946087,53.5666819 57.6158169,60.6526682 74.3184989,90.8524668 L79.4642746,100.300449 C75.5513209,99.7515725 71.6055386,99.4697309 67.6542975,99.4568787 C63.1649158,99.1352122 58.6572778,99.7381447 54.4102517,101.228375 C49.2943021,103.317841 45.9933934,108.176867 45.7655325,113.515879 L1.77149657,84.6100503 L49.9393318,84.6100503 L0,0 L64.7018032,41.5036339 L53.9884668,9.53233867 L79.1268467,25.3070938 L95.9982426,3.88042105 L116.328275,32.3087231 L136.742664,6.1580595 L132.39628,49.653393 Z M46.0261587,116.928377 C46.9188787,122.365388 51.5679176,126.421047 57.1096751,126.535469 C57.9230483,126.61779 58.7426542,126.61779 59.5560275,126.535469 C65.8189235,126.997519 71.9548286,128.53863 77.692778,131.090746 C78.0978182,131.72624 78.562983,132.346703 79.0838693,132.950268 L68.9196522,135.224238 L5.3144897,143.406865 L46.0261587,116.928377 Z" />
+      <path d="M96.6730984,33.7427918 C102.071945,33.7427918 108.398719,75.9212815 110.929428,75.9212815 C113.37578,75.9212815 114.303707,59.5560275 114.472421,54.4946087 C114.641135,49.4331899 115.400348,42.1784897 120.37741,42.1784897 C125.438828,42.1784897 123.582975,65.2079451 122.992476,68.7509382 C122.401977,72.2939314 122.992476,80.0547735 125.776256,80.0547735 C126.619826,80.0547735 127.716467,79.0424897 129.066178,76.2587094 C133.368384,67.8230114 141.719725,60.4839542 145.937574,60.4839542 C146.725159,60.4392854 147.447387,60.9207704 147.709071,61.6649519 C149.311854,66.0515149 134.380668,89.2496842 132.777886,92.0334645 C131.175103,94.8172449 132.777886,114.725492 131.343817,123.836046 C129.909748,132.9466 110.929428,134.971167 110.929428,134.971167 C97.9384531,134.971167 87.0564027,130.078462 84.6100503,125.270114 C82.1636979,120.461767 65.714087,116.834416 59.3029565,116.834416 L57.1096751,116.834416 C53.4823249,116.834416 52.2169703,110.760714 57.8688879,108.398719 C61.0160448,107.640007 64.2761704,107.468421 67.4855835,107.892577 C72.6240604,107.846637 77.7497143,108.413007 82.7541968,109.579716 C83.8186951,109.914848 84.9281127,110.085528 86.044119,110.085858 C89.1653272,110.085858 92.0334645,108.483076 90.177611,103.252943 C87.7312586,96.2513135 62.9303066,56.1817483 65.714087,52.6387551 C66.0388127,51.9329975 66.7126585,51.4516791 67.4855835,51.3734005 C71.7877895,51.3734005 80.5609153,59.3029565 85.6223341,67.7386545 C90.6837529,76.1743524 96.5887414,82.1636979 99.2881648,82.1636979 C99.7158392,82.1915906 100.128564,82.0011021 100.384805,81.6575561 C102.156302,79.2112037 91.1055378,48.7583341 89.5027551,43.3594874 C88.3952186,41.0895358 88.6479264,38.3911426 90.1576753,36.3663029 C91.6674242,34.3414633 94.1814682,33.3291541 96.6730984,33.7427918 Z" />
+    </g>
+  </svg>
+);
+
+export const EquipmentIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 172 135"
+    width="1em"
+    height="1em"
+    aria-labelledby="equipmentTitle"
+    {...props}
+  >
+    <title id="equipmentTitle">Equipment Icon</title>
+    <defs>
+      <polygon
+        id="icon---equipment-copy@2x-a"
+        points="0 .614 77.491 .614 77.491 134.399 0 134.399"
+      />
+    </defs>
+    <g fill="none" fillRule="evenodd">
+      <path d="M9.023232 60.475968L8.984832 61.704768 8.984832 61.935168 40.434432 63.509568 67.237632 64.815168 67.237632 60.475968C67.237632 60.130368 67.237632 59.784768 67.199232 59.435328L58.063872 54.907968 66.124032 49.493568C62.706432 29.909568 51.378432 15.317568 38.360832 15.163968L38.130432 15.163968C27.032832 15.163968 17.202432 25.570368 12.325632 40.661568L31.141632 42.888768 11.404032 43.810368C9.983232 48.955968 9.176832 54.600768 9.023232 60.475968M171.2256 59.3232C170.6496 38.5872 161.2416 20.7312 147.7248 11.976 156.5952 23.496 162.3552 40.5456 162.7776 59.9376L162.7776 64.008 171.264 63.8928 171.264 59.3232 171.2256 59.3232z" />
+      <polygon points="162.777 103.714 162.815 127.752 162.815 129.365 171.263 128.866 171.263 67.733 162.777 67.848" />
+      <g transform="translate(0 .226)">
+        <mask id="icon---equipment-copy@2x-b" fill="#fff">
+          <use xlinkHref="#icon---equipment-copy@2x-a" />
+        </mask>
+        <path
+          d="M44.2752,0.959232 L40.704,0.767232 L40.6272,0.767232 L38.1312,0.613632 C17.5488,0.613632 0.768,26.341632 0.0384,58.559232 L0,58.559232 L0,126.412032 L76.2624,134.399232 L77.4912,134.322432 L77.4912,127.064832 L77.4912,68.696832 L76.2624,68.696832 L73.4208,68.735232 L71.1168,68.620032 L71.1168,124.108032 L70.4256,124.031232 L68.4672,123.839232 L5.1456,117.234432 L5.2608,58.290432 C6.4896,31.679232 20.6976,11.096832 38.1312,11.096832 L38.208,11.096832 C54.1056,11.135232 67.3536,28.338432 70.4256,51.608832 C70.7328,53.797632 70.9248,56.024832 71.04,58.290432 L71.1168,58.290432 L71.1168,64.780032 L73.4976,64.895232 L76.2624,64.856832 L77.4912,64.856832 L77.4912,59.749632 C77.2224,47.500032 74.6112,36.133632 70.4256,26.687232 C64.3584,13.016832 54.9504,3.340032 44.2752,0.959232"
+          mask="url(#icon---equipment-copy@2x-b)"
+        />
+      </g>
+      <path d="M131.520768,74.9136 C134.554368,74.9136 136.973568,77.3712 136.973568,80.4048 C136.973568,82.2096 136.086528,83.8224 134.707968,84.8208 L134.707968,91.9248 L128.099328,92.5776 L128.099328,84.6288 C126.874368,83.6304 126.067968,82.0944 126.067968,80.4048 C126.067968,77.3712 128.487168,74.9136 131.520768,74.9136 Z M144.269568,98.3376 L144.269568,69 L116.045568,69.4224 L116.045568,100.0656 L144.269568,98.3376 Z" />
+      <polygon points="67.276 102.791 67.237 68.654 40.588 67.348 8.984 65.774 8.984 87.124 31.141 90.618 8.984 93.114 8.984 95.457 23.768 96.302 8.984 99.45 8.984 114.004 65.356 119.879 67.276 120.071 67.276 108.782 56.101 107.322 56.101 107.284 38.13 104.942 53.528 103.828" />
+      <polygon points="158.937 92.04 158.937 91.464 158.937 67.886 150.758 68.002 148.112 68.002 148.112 101.986 112.204 104.136 112.204 68.462 108.786 68.501 93.81 68.693 93.81 83.323 103.986 84.59 93.81 85.819 93.81 114.235 108.825 116.462 108.825 116.539 93.81 117.998 93.81 118.536 93.81 120.494 100.377 120.878 93.81 122.837 93.81 129.941 93.81 133.55 158.975 129.595 158.975 127.214 158.975 114.926 150.335 113.851 158.975 110.357" />
+      <path d="M88.283136,44.077248 C85.322496,29.062848 78.794496,16.429248 70.427136,8.749248 C67.163136,5.715648 63.588096,3.450048 59.828736,2.106048 L55.562496,1.875648 C61.249536,5.562048 66.314496,11.168448 70.427136,18.157248 C76.874496,29.216448 80.948736,43.808448 81.328896,59.936448 L81.328896,65.005248 L86.128896,64.966848 L89.968896,64.928448 L89.968896,59.974848 C89.853696,54.483648 89.243136,49.184448 88.283136,44.115648 L88.283136,44.077248 Z" />
+      <path d="M93.810816,64.852416 L108.786816,64.660416 L149.375616,64.161216 L158.937216,64.046016 L158.937216,59.975616 C158.860416,55.905216 158.476416,51.911616 157.900416,48.071616 L143.692416,48.263616 L143.500416,47.687616 L157.405056,44.961216 C157.251456,44.193216 157.094016,43.386816 156.902016,42.618816 L148.492416,41.658816 L156.210816,39.623616 C152.758656,25.799616 146.226816,14.356416 138.051456,7.521216 C135.052416,6.638016 131.942016,6.177216 128.716416,6.177216 L90.051456,3.911616 L90.009216,3.911616 L70.425216,2.759616 L69.238656,2.682816 C69.657216,2.951616 70.045056,3.258816 70.425216,3.566016 C77.682816,9.095616 83.711616,17.774016 87.858816,28.449216 L94.310016,28.871616 L104.758656,29.524416 L116.390016,30.254016 L105.330816,31.329216 L92.390016,32.596416 L89.433216,32.865216 C89.817216,34.170816 90.239616,35.476416 90.585216,36.820416 C92.505216,43.962816 93.618816,51.758016 93.810816,59.937216 L93.810816,64.852416 Z" />
+      <polygon points="81.331 68.846 81.331 127.905 81.331 134.318 89.971 133.78 89.971 129.288 89.971 117.998 89.971 68.769 86.131 68.808" />
+    </g>
+  </svg>
+);
+
+export const SkillsIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 146 144"
+    width="1em"
+    height="1em"
+    aria-labelledby="skillsTitle"
+    {...props}
+  >
+    <title id="skillsTitle">Skills Icon</title>
+    <g fill="none">
+      <polygon points="70.124 83.965 64.12 107.979 40.107 113.983 64.12 119.986 70.124 144 76.127 119.986 100.141 113.983 76.127 107.979" />
+      <polygon points="112.148 20.442 120.525 45.571 145.654 53.948 120.525 62.324 112.148 87.454 103.772 62.324 78.642 53.948 103.772 45.571" />
+      <path d="M27.7357796,31.981862 L37.104806,0.751773927 L46.4738324,31.981862 L73.3633378,41.940938 L46.4738324,51.9000141 L37.104806,83.1301022 L27.7357796,51.9000141 L0.846274211,41.940938 L27.7357796,31.981862 Z M37.104806,23.0953598 L32.9660154,36.8913285 L19.3320697,41.940938 L32.9660154,46.9905476 L37.104806,60.7865163 L41.2435966,46.9905476 L54.8775423,41.940938 L41.2435966,36.8913285 L37.104806,23.0953598 Z" />
+    </g>
+  </svg>
+);
+
+export const SpellsIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 102 139"
+    width="1em"
+    height="1em"
+    aria-labelledby="spellsTitle"
+    {...props}
+  >
+    <title id="spellsTitle">Spells Icon</title>
+    <defs>
+      <polygon
+        id="icon---spells-copy@2x-a"
+        points="0 .146 101.843 .146 101.843 105.6 0 105.6"
+      />
+      <polygon
+        id="icon---spells-copy@2x-c"
+        points=".774 .803 94.086 .803 94.086 68.055 .774 68.055"
+      />
+    </defs>
+    <g fill="none" fillRule="evenodd" transform="translate(0 -1)">
+      <g transform="translate(0 33.598)">
+        <mask id="icon---spells-copy@2x-b" fill="#fff">
+          <use xlinkHref="#icon---spells-copy@2x-a" />
+        </mask>
+        <path
+          d="M100.96928,73.6752 C92.78688,61.0512 100.36768,53.1216 99.41728,45.7808 C99.03648,42.8784 96.75168,38.5104 94.02528,34.1168 C94.02528,34.1168 94.02208,34.1136 94.02208,34.1136 C89.85248,27.4 84.64928,20.6352 83.59968,18.9904 C80.55008,14.2064 81.39488,11.096 78.54688,9.8192 C75.70208,8.5424 72.35488,16.424 72.58208,20.2608 C72.95328,26.5136 77.99968,33.7264 78.82848,35.4736 C79.66048,37.2208 79.57088,39.7008 78.19168,43.5664 C76.81248,47.4352 73.03008,46.8144 68.23328,44.712 C63.43328,42.6064 53.87808,34.5776 48.87648,28.9648 C43.87488,23.3552 36.01888,7.2144 34.93728,4.3216 C33.85568,1.4256 29.56448,-3.6496 27.45888,4.8016 C25.20928,13.8384 33.11648,27.976 38.06688,34.0976 C43.02048,40.2192 41.92608,43.2816 40.68128,44.5552 C39.43648,45.8288 32.57248,42.1072 28.39008,38.6384 C24.21408,35.1696 18.43808,25.0544 16.38368,21.5472 C14.33248,18.0432 10.11488,15.4224 8.66528,15.0384 C8.47328,14.9872 8.23008,14.9616 7.96768,14.9584 C7.94848,14.9552 7.93248,14.952 7.91328,14.952 C7.88448,14.952 7.84608,14.9648 7.81728,14.968 C7.45568,14.9744 7.06528,15.0352 6.66848,15.1504 C6.63008,15.1632 6.59168,15.1664 6.55008,15.1824 C6.13408,15.3168 5.74368,15.5344 5.38848,15.816 C5.35328,15.8448 5.30848,15.8512 5.27968,15.8768 C5.28288,15.8864 5.28288,15.896 5.28608,15.9056 C4.48928,16.6 3.97088,17.7008 4.32608,19.4352 C5.15168,23.4256 14.12128,42.7376 15.23488,44.0592 C16.35168,45.3808 30.31008,55.5024 30.32608,56.568 C30.34528,57.6304 30.92768,56.9776 26.41568,54.4432 C21.90368,51.912 12.47328,44.3952 11.06528,42.0432 C9.65728,39.6944 6.79008,35.5024 5.74368,34.7344 C4.69728,33.9632 2.32928,32.4592 0.54688,34.8624 C-1.23232,37.2688 1.75968,42.9552 3.36928,45.1152 C4.97568,47.272 8.98208,54.44 11.72128,57.1344 C14.46048,59.8256 26.90208,68.0272 28.46368,68.8464 C30.01888,69.6656 32.87648,70.4496 32.53408,71.7808 C32.19168,73.112 25.17728,68.5936 22.95328,67.8 C20.72608,67.0064 13.90688,60.8112 12.62688,59.96 C11.34368,59.1088 9.23808,60.1488 8.07648,61.1888 C6.91168,62.2256 8.51168,64.7792 13.00448,70.3408 C17.49408,75.9024 40.57888,86.3696 44.24288,87.9408 C47.91328,89.512 62.86048,100.0624 71.43968,105.0256 C79.76608,109.8416 107.04608,83.0544 100.96928,73.6752"
+          mask="url(#icon---spells-copy@2x-b)"
+        />
+      </g>
+      <g transform="translate(4.2 .398)">
+        <mask id="icon---spells-copy@2x-d" fill="#fff">
+          <use xlinkHref="#icon---spells-copy@2x-c" />
+        </mask>
+        <path
+          d="M5.0128,45.11136 C4.9456,42.25696 5.2848,39.31616 6.2448,36.36256 C7.8384,39.64256 10.1328,43.85056 12.2192,45.77696 L16.8656,50.06816 L15.672,43.85376 C15.6336,43.66176 12.4784,26.45536 22.5584,16.42336 C21.9952,20.38816 21.9952,25.39616 24.7344,28.23136 L25.3392,28.85216 L26.2032,28.86176 C26.6064,28.88416 35.88,28.89376 40.8048,22.23776 C43.6112,18.44256 44.3792,13.37696 43.0992,7.14016 C45.1248,8.25376 47.5696,10.11296 49.1248,13.05696 C51.4864,17.51776 51.3168,23.37376 48.6192,30.45856 C46.8752,35.04096 47.192,39.24576 49.4864,42.00096 C51.1408,43.97856 53.5696,44.88096 55.9696,44.44256 C58.5168,43.96576 60.5296,42.07456 61.4864,39.25216 C61.9184,37.98176 62.024,36.17376 62.1616,33.88256 C62.4208,29.44096 62.7792,23.38016 65.7712,19.07936 C64.664,23.93056 64.3312,30.36896 68.2832,35.15296 L71.0992,38.56096 L71.9312,34.21856 C71.9376,34.17696 72.568,31.01536 74.728,28.54816 C75.0032,33.19456 76.7504,40.79136 83.992,48.74976 C87.208,52.28256 88.9168,56.69856 89.5728,61.07936 C91.2048,63.49536 92.6928,65.83456 93.9856,68.05536 C94.5616,60.68256 92.7248,52.17056 87.0672,45.94976 C77.1056,35.00256 78.936,25.20416 79.016,24.80416 L79.8448,20.90656 L76.1712,22.45536 C72.904,23.83776 70.856,26.40736 69.6112,28.71776 C67.9344,22.21856 71.8352,14.05856 71.88,13.95936 L74.3088,8.96736 L69.2016,11.13376 C59.08,15.42816 58.4112,26.82656 58.0112,33.63936 C57.8992,35.45696 57.8,37.17536 57.5504,37.91136 C57.08,39.29056 56.2512,40.15776 55.2112,40.34976 C54.2992,40.51296 53.3552,40.14176 52.68,39.33536 C51.3776,37.77056 51.3136,35.07616 52.5072,31.94016 C55.6592,23.65536 55.7488,16.63136 52.776,11.06016 C48.8016,3.61056 40.8304,1.70016 40.4944,1.62336 L36.9392,0.80096 L38.0464,4.28256 C40.216,11.07616 40.0208,16.27936 37.4736,19.74496 C34.616,23.62976 29.384,24.47136 27.2208,24.65376 C25.6336,21.81856 26.6736,15.54656 27.8096,11.94336 L29.4384,6.79776 L24.7792,9.51776 C13.3712,16.18016 11.0992,28.38816 10.984,36.51616 C9.7392,34.11936 8.648,31.70016 8.104,30.39776 L6.408,26.34016 L4.3472,30.22816 C1.5888,35.44096 0.6384,40.64096 0.7888,45.55936 C1.6912,45.17536 2.6832,44.95136 3.7136,44.95136 C4.1744,44.95136 4.6,45.02496 5.0128,45.11136"
+          mask="url(#icon---spells-copy@2x-d)"
+        />
+      </g>
+    </g>
+  </svg>
+);
+
+export const FeatureTraitsIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 139 139"
+    width="1em"
+    height="1em"
+    aria-labelledby="featureTraitsTitle"
+    {...props}
+  >
+    <title id="featureTraitsTitle">Features and Traits Icon</title>
+    <g fillRule="evenodd" transform="translate(.353)">
+      <path
+        fillRule="nonzero"
+        d="M127.527552,75.108096 C127.354752,77.129856 127.066752,79.082496 126.605952,80.989056 C126.433152,81.910656 126.202752,82.889856 125.972352,83.811456 C125.511552,85.712256 124.935552,87.492096 124.244352,89.341056 C123.898752,90.199296 123.553152,91.120896 123.207552,91.990656 C122.861952,92.848896 122.458752,93.712896 122.055552,94.582656 C120.557952,97.629696 118.829952,100.509696 116.929152,103.222656 C116.122752,104.311296 115.316352,105.411456 114.452352,106.442496 L114.394752,106.500096 C111.975552,109.443456 109.325952,112.093056 106.388352,114.448896 C105.121152,115.491456 103.796352,116.470656 102.471552,117.392256 C99.764352,119.293056 96.884352,120.963456 93.889152,122.340096 C92.391552,123.031296 90.893952,123.670656 89.338752,124.240896 C83.002752,126.550656 76.205952,127.812096 69.121152,127.812096 C62.036352,127.812096 55.239552,126.550656 48.961152,124.240896 C47.405952,123.670656 45.908352,123.031296 44.410752,122.340096 C41.415552,120.900096 38.535552,119.293056 35.828352,117.392256 C35.194752,116.931456 34.561152,116.470656 33.927552,115.952256 C33.236352,115.549056 32.602752,115.030656 31.969152,114.448896 C30.471552,113.302656 29.089152,112.029696 27.764352,110.653056 C27.073152,110.019456 26.381952,109.380096 25.805952,108.631296 C25.114752,107.940096 24.538752,107.248896 23.905152,106.500096 L23.847552,106.442496 C22.983552,105.411456 22.177152,104.311296 21.370752,103.222656 C18.721152,99.530496 16.532352,95.498496 14.804352,91.241856 C14.458752,90.372096 14.113152,89.508096 13.825152,88.649856 C13.364352,87.319296 12.903552,85.942656 12.557952,84.560256 C12.212352,83.229696 11.866752,81.910656 11.636352,80.522496 C11.405952,79.600896 11.233152,78.679296 11.117952,77.763456 C11.002752,76.841856 10.887552,75.862656 10.772352,74.941056 C10.657152,74.192256 10.599552,73.380096 10.599552,72.579456 C10.541952,72.170496 10.541952,71.773056 10.541952,71.369856 C10.426752,70.621056 10.426752,69.872256 10.426752,69.123456 C10.426752,67.971456 10.484352,66.819456 10.599552,65.719296 C10.599552,64.573056 10.657152,63.472896 10.887552,62.378496 C11.060352,60.189696 11.405952,58.000896 11.981952,55.869696 C12.154752,54.948096 12.385152,54.032256 12.673152,53.162496 C13.594752,49.879296 14.804352,46.711296 16.244352,43.721856 C17.050752,41.988096 17.972352,40.323456 18.951552,38.710656 C19.930752,37.092096 20.967552,35.542656 22.119552,34.039296 C32.833152,19.702656 49.882752,10.429056 69.121152,10.429056 C88.359552,10.429056 105.466752,19.702656 116.180352,34.039296 C117.332352,35.542656 118.369152,37.092096 119.348352,38.710656 C120.327552,40.323456 121.249152,41.988096 122.055552,43.721856 C123.495552,46.711296 124.705152,49.879296 125.626752,53.162496 C125.914752,54.032256 126.145152,54.948096 126.317952,55.869696 C126.893952,58.000896 127.239552,60.189696 127.412352,62.378496 C127.642752,63.472896 127.700352,64.573056 127.700352,65.719296 C127.815552,66.819456 127.873152,67.971456 127.873152,69.123456 C127.873152,70.160256 127.873152,71.139456 127.757952,72.170496 C127.757952,73.149696 127.642752,74.128896 127.527552,75.108096 M69.121152,0.003456 C31.047552,0.003456 0.001152,30.992256 0.001152,69.123456 C0.001152,87.209856 7.028352,103.620096 18.433152,115.952256 C18.663552,116.240256 18.893952,116.522496 19.181952,116.752896 C31.796352,129.949056 49.479552,138.243456 69.121152,138.243456 C88.877952,138.243456 106.676352,129.891456 119.290752,116.580096 C119.405952,116.413056 119.521152,116.292096 119.636352,116.119296 C131.156352,103.792896 138.241152,87.261696 138.241152,69.123456 C138.241152,30.992256 107.252352,0.003456 69.121152,0.003456"
+      />
+      <path d="M114.393024,106.500672 C111.973824,109.444032 109.324224,112.093632 106.386624,114.449472 C99.589824,111.799872 92.044224,109.611072 87.378624,108.228672 C84.441024,107.364672 83.404224,107.082432 82.655424,106.731072 C80.581824,105.809472 79.084224,104.202432 78.450624,102.065472 C77.183424,97.745472 79.775424,92.964672 82.713024,88.471872 L83.173824,87.780672 C85.132224,84.785472 85.535424,84.272832 86.111424,81.329472 C86.514624,79.083072 88.185024,75.454272 90.316224,73.150272 C91.180224,71.710272 92.159424,67.563072 91.871424,66.065472 C91.065024,64.395072 89.740224,61.630272 89.970624,58.583232 C90.316224,54.142272 89.855424,49.943232 88.703424,46.308672 C87.436224,42.161472 83.289024,38.192832 78.450624,36.401472 C75.109824,35.191872 71.999424,35.082432 69.177024,35.082432 C66.239424,35.082432 63.186624,35.191872 59.788224,36.401472 C55.007424,38.192832 50.860224,42.161472 49.535424,46.308672 C48.383424,49.943232 47.980224,54.032832 48.268224,58.635072 C48.556224,61.803072 47.058624,64.804032 46.425024,66.065472 C46.137024,67.505472 47.116224,71.710272 47.922624,73.150272 C50.053824,75.454272 51.666624,78.973632 52.185024,81.214272 C52.761024,84.209472 53.106624,84.785472 55.065024,87.780672 L55.468224,88.299072 C58.521024,92.964672 61.113024,97.745472 59.845824,102.065472 C59.212224,104.202432 57.714624,105.809472 55.641024,106.731072 C54.892224,107.082432 53.855424,107.364672 50.917824,108.228672 C48.037824,109.092672 44.005824,110.244672 39.801024,111.684672 C38.937024,111.972672 38.073024,112.260672 37.209024,112.548672 C36.575424,112.721472 35.941824,112.951872 35.365824,113.182272 C34.213824,113.585472 33.119424,113.988672 32.025024,114.391872 C30.585024,113.182272 29.145024,111.972672 27.762624,110.653632 C27.129024,110.014272 26.437824,109.323072 25.804224,108.631872 C25.113024,107.940672 24.537024,107.249472 23.903424,106.500672 C32.140224,102.871872 42.220224,99.934272 47.980224,98.263872 C48.383424,98.148672 48.729024,98.033472 49.074624,97.924032 C48.671424,97.054272 47.980224,95.902272 46.885824,94.231872 L46.425024,93.483072 C44.178624,90.142272 42.969024,88.241472 41.989824,83.345472 C41.874624,82.711872 40.953024,80.868672 40.261824,80.183232 C37.554624,77.355072 34.732224,68.139072 36.575424,62.609472 C36.690624,62.379072 36.805824,61.981632 37.093824,61.463232 C37.727424,60.132672 37.900224,59.562432 37.900224,59.332032 C37.497024,53.451072 38.073024,48.042432 39.628224,43.204032 C41.932224,35.883072 48.268224,29.552832 56.217024,26.672832 C60.997824,24.939072 65.202624,24.708672 69.119424,24.708672 C73.036224,24.708672 77.298624,24.939072 82.021824,26.672832 C90.028224,29.604672 96.364224,35.940672 98.668224,43.204032 C100.223424,48.094272 100.799424,53.508672 100.338624,59.332032 C100.396224,59.614272 100.684224,60.363072 101.202624,61.463232 C101.490624,62.033472 101.663424,62.442432 101.721024,62.672832 C103.564224,68.202432 100.741824,77.355072 97.977024,80.183232 C97.343424,80.868672 96.421824,82.654272 96.306624,83.345472 C95.327424,88.241472 94.117824,90.142272 91.871424,93.483072 L91.525824,94.001472 C90.373824,95.792832 89.682624,97.054272 89.221824,97.924032 C89.567424,98.033472 89.913024,98.148672 90.316224,98.263872 C96.076224,99.934272 106.156224,102.871872 114.393024,106.500672" />
+    </g>
+  </svg>
+);
+
+export const ProficienciesSvg: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 145 144"
+    width="1em"
+    height="1em"
+    aria-labelledby="proficienciesTitle"
+    {...props}
+  >
+    <title id="proficienciesTitle">Proficiencies Icon</title>
+    <defs>
+      <polygon
+        id="icon---prof@2x-a"
+        points=".789 .79 42.018 .79 42.018 41.998 .789 41.998"
+      />
+      <polygon
+        id="icon---prof@2x-c"
+        points="0 0 124.418 0 124.418 124.416 0 124.416"
+      />
+    </defs>
+    <g fill="none" fillRule="evenodd">
+      <g transform="translate(102 102)">
+        <mask id="icon---prof@2x-b" fill="#fff">
+          <use xlinkHref="#icon---prof@2x-a" />
+        </mask>
+        <path
+          fill="none"
+          d="M38.571,38.5722 C36.315,40.8342 33.273,41.9982 30.315,41.9982 C27.357,41.9982 24.315,40.8342 22.059,38.5722 L0.789,17.3082 C7.185,12.7902 12.789,7.1802 17.307,0.7902 L38.571,22.0602 C43.173,26.6562 43.173,33.9762 38.571,38.5722"
+          mask="url(#icon---prof@2x-b)"
+        />
+      </g>
+      <path
+        fill="none"
+        d="M66.1038 73.8924L58.3098 73.8924 52.4478 38.6784C51.4398 32.6484 56.0898 27.1524 62.2098 27.1524 68.3238 27.1524 72.9798 32.6484 71.9718 38.6784L66.1038 73.8924zM70.0008 89.4726C70.0008 93.7746 66.5088 97.2606 62.2068 97.2606 57.9048 97.2606 54.4188 93.7746 54.4188 89.4726 54.4188 85.1706 57.9048 81.6786 62.2068 81.6786 66.5088 81.6786 70.0008 85.1706 70.0008 89.4726"
+      />
+      <mask id="icon---prof@2x-d" fill="#fff">
+        <use xlinkHref="#icon---prof@2x-c" />
+      </mask>
+      <path
+        fill="none"
+        d="M108.6198,62.25 C108.6198,87.762 87.7578,108.618 62.1678,108.618 C36.6558,108.618 15.7998,87.762 15.7998,62.25 C15.7998,36.654 36.6558,15.798 62.1678,15.798 C87.7578,15.798 108.6198,36.654 108.6198,62.25 M62.1678,0 C27.8838,0 -0.0042,27.882 -0.0042,62.166 C-0.0042,96.534 27.8838,124.416 62.1678,124.416 C96.5298,124.416 124.4178,96.534 124.4178,62.166 C124.4178,27.882 96.5298,0 62.1678,0"
+        mask="url(#icon---prof@2x-d)"
+      />
+    </g>
+  </svg>
+);
+
+export const DescriptionIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 139 136"
+    width="1em"
+    height="1em"
+    aria-labelledby="descriptionTitle"
+    {...props}
+  >
+    <title id="descriptionTitle">Description Icon</title>
+    <defs>
+      <polygon
+        id="icon---description-copy@2x-a"
+        points="0 .828 129.209 .828 129.209 125.717 0 125.717"
+      />
+      <polygon
+        id="icon---description-copy@2x-c"
+        points=".621 .796 81.849 .796 81.849 99.777 .621 99.777"
+      />
+    </defs>
+    <g fill="none" fillRule="evenodd" transform="translate(0 -1)">
+      <g transform="translate(0 10.483)">
+        <mask id="icon---description-copy@2x-b" fill="#fff">
+          <use xlinkHref="#icon---description-copy@2x-a" />
+        </mask>
+        <path
+          d="M109.708992,79.00928 L110.400192,78.83648 C114.720192,77.73632 118.412352,78.25472 121.292352,80.32832 C126.821952,84.36608 126.873792,92.48768 126.361152,95.36768 C120.422592,96.68672 117.542592,96.34688 115.641792,95.59808 C117.029952,92.54528 117.893952,88.91648 116.511552,85.74848 C115.180992,82.80512 112.882752,80.50688 109.708992,79.00928 M17.093952,44.04608 C12.710592,44.21888 9.260352,43.06688 6.950592,40.47488 C2.521152,35.57888 2.751552,26.93888 3.033792,23.82848 C8.620992,23.76512 12.422592,25.66592 14.150592,26.76608 C12.249792,29.46752 11.564352,32.98688 12.313152,36.38528 C12.940992,39.37472 14.611392,41.96672 17.093952,44.04608 M122.668992,78.42752 C119.212992,75.89888 114.892992,75.26528 109.829952,76.52672 L100.320192,79.00928 L105.273792,80.04608 C109.651392,80.96768 112.819392,83.32928 114.322752,86.66432 C115.589952,89.54432 114.553152,92.94848 112.992192,95.53472 L112.421952,96.57728 L93.753792,103.77728 L108.211392,94.78592 C105.331392,93.23648 102.629952,90.98432 100.383552,87.64928 C96.121152,82.00448 95.660352,74.56832 96.691392,66.33728 C87.129792,74.33792 76.243392,82.69568 64.153152,91.04768 L44.050752,114.60608 L52.742592,89.02592 C52.972992,87.58592 56.832192,67.42592 65.932992,45.25568 C66.341952,44.21888 67.090752,43.40672 68.069952,42.88832 C67.781952,41.79392 67.891392,40.70528 68.300352,39.72608 C72.902592,29.29472 78.092352,20.31488 83.731392,12.76928 L73.081152,14.83712 L85.753152,10.23488 L95.481792,6.65792 C94.502592,5.73632 93.523392,4.93568 92.549952,4.29632 C83.270592,-1.80352 71.813952,1.99808 71.813952,1.99808 L0.441792,21.00608 L0.268992,22.15808 C0.211392,22.72832 -1.568448,35.34848 4.819392,42.37568 C7.762752,45.65888 11.909952,47.15648 17.203392,46.92608 L25.042752,45.65888 L22.450752,43.92512 C18.470592,42.14528 15.820992,39.26528 15.072192,35.74592 C14.444352,32.75648 15.250752,29.64608 17.260992,27.39392 L18.240192,26.35712 C21.523392,28.89728 23.833152,32.06528 25.382592,35.22752 L42.201792,33.32672 L26.880192,38.68928 C27.461952,40.35392 27.922752,41.91488 28.210752,43.29728 L43.699392,38.91392 L28.780992,46.97792 C29.011392,48.59648 29.011392,49.57568 29.011392,49.57568 C29.011392,65.46752 22.329792,74.74688 20.204352,91.21472 L40.531392,84.82688 L19.743552,95.24672 C19.570752,97.32608 19.513152,99.56672 19.513152,101.92832 C19.513152,111.43808 24.230592,125.71712 43.301952,125.71712 C61.042752,125.71712 120.192192,100.89728 128.083392,97.55648 L128.140992,97.55648 C128.492352,97.32608 128.780352,97.26848 128.889792,97.20512 L129.120192,96.22592 C129.183552,95.70752 130.272192,83.95712 122.668992,78.42752"
+          mask="url(#icon---description-copy@2x-b)"
+        />
+      </g>
+      <g transform="translate(56.84 .963)">
+        <mask id="icon---description-copy@2x-d" fill="#fff">
+          <use xlinkHref="#icon---description-copy@2x-c" />
+        </mask>
+        <path
+          d="M73.467904,33.156672 L73.467904,33.208512 C67.949824,35.679552 61.573504,37.488192 55.243264,36.964032 C59.384704,39.394752 63.284224,41.059392 66.947584,42.297792 C63.670144,46.439232 59.666944,50.955072 54.817024,55.810752 C51.153664,55.338432 46.868224,54.048192 42.110464,51.525312 C44.155264,55.240512 47.110144,58.091712 50.203264,60.286272 C47.962624,62.475072 45.491584,64.709952 42.870784,67.042752 C40.111744,66.178752 37.444864,65.228352 35.405824,64.139712 C36.120064,66.564672 37.398784,68.707392 38.827264,70.469952 C29.357824,78.603072 16.127104,90.071232 2.187904,99.776832 C2.187904,99.684672 3.426304,97.829952 3.754624,97.357632 C3.800704,97.305792 3.800704,97.259712 3.852544,97.259712 C3.852544,97.207872 3.852544,97.207872 3.950464,97.207872 C23.695744,67.417152 57.673984,20.357952 74.994304,9.840192 C73.231744,10.462272 46.009984,20.928192 1.093504,99.114432 L0.995584,99.114432 C0.897664,99.298752 0.805504,99.684672 0.621184,99.776832 C0.621184,99.776832 4.324864,78.885312 13.465984,56.571072 C15.464704,58.379712 17.843584,60.142272 20.550784,61.611072 C18.845824,60.712512 17.181184,56.144832 15.793024,51.145152 C20.510464,40.679232 26.356864,30.155712 33.591424,21.452352 C35.590144,24.735552 38.349184,27.874752 42.254464,29.971392 C40.347904,28.116672 40.163584,20.830272 40.399744,14.223552 C43.867264,11.032512 47.582464,8.273472 51.625984,6.084672 C52.340224,8.987712 53.670784,12.172992 55.767424,15.698112 C55.295104,10.842432 56.723584,6.510912 58.952704,2.847552 C65.236864,0.802752 72.183424,0.180672 79.705984,1.465152 C79.705984,1.465152 87.464704,11.130432 73.467904,33.156672"
+          mask="url(#icon---description-copy@2x-d)"
+        />
+      </g>
+      <path d="M60.68736,98.2112 C53.32032,109.33376 47.90016,117.98528 46.09152,121.38368 C50.1408,113.78048 54.06912,106.71296 57.85344,100.10048 L57.9168,100.07744 C58.84992,99.44384 59.78304,98.81024 60.68736,98.2112" />
+      <path d="M75.68352,73.702976 C70.07904,81.150656 60.21216,96.420416 57.91392,100.078016 L60.68448,98.211776 L75.68352,73.702976 Z" />
+    </g>
+  </svg>
+);
+
+export const NotesIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 157 143"
+    width="1em"
+    height="1em"
+    aria-labelledby="notesTitle"
+    {...props}
+  >
+    <title id="notesTitle">Notes Icon</title>
+    <g transform="translate(.76)">
+      <polygon points="142.167 41.629 142.167 100.538 69.905 100.538 50.269 117.033 104.465 117.033 132.742 142.167 132.742 117.033 155.52 117.033 155.52 41.629" />
+      <path d="M22.7781818,120.174545 L22.7781818,87.9709091 L0,87.9709091 L0,0 L128.029091,0 L128.029091,87.9709091 L58.9090909,87.9709091 L22.7781818,120.174545 Z M11.7818182,76.1890909 L34.56,76.1890909 L34.56,94.2545455 L54.9818182,76.1890909 L117.032727,76.1890909 L117.032727,11.7818182 L12.5672727,11.7818182 L12.5672727,76.1890909 L11.7818182,76.1890909 Z" />
+    </g>
+  </svg>
+);
+
+export const ExtrasIcon: FC<SvgProps> = (props) => (
+  <svg
+    viewBox="0 0 21.41 4.34"
+    width="1em"
+    height="1em"
+    aria-labelledby="extrasTitle"
+    {...props}
+  >
+    <title id="extrasTitle">Extras Icon</title>
+    <circle cx="10.7" cy="2.17" r="2.17" />
+    <circle cx="2.17" cy="2.17" r="2.17" />
+    <circle cx="19.24" cy="2.17" r="2.17" />
+  </svg>
+);
+
+/**
+ * This component is a simple SVG that is used to render the top and bottom borders of the pane.
+ */
+export const PaneBorder: FC<SvgProps> = (props) => (
+  <svg viewBox="0 0 340 18" {...props}>
+    <path
+      className={styles.borderBg}
+      d="M328.1,6.19H201a57,57,0,0,1-30.15,9.14A54.55,54.55,0,0,1,141,6.19H12A30.25,30.25,0,0,1,.4,17.26V18H340v-.27A28.68,28.68,0,0,1,328.1,6.19Z"
+    />
+    <path
+      className={styles.borderStroke}
+      fill="none"
+      strokeMiterlimit="10px"
+      strokeWidth="3px"
+      d="M-46,22.28"
+    />
+    <path
+      className={styles.borderStroke}
+      fill="none"
+      strokeMiterlimit="10px"
+      strokeWidth="1.5px"
+      d="M168.15,3"
+    />
+    <path
+      className={styles.borderStroke}
+      fill="none"
+      strokeMiterlimit="10px"
+      strokeWidth="2px"
+      d="M339.6,17.09C328.4,12.16,325.17,1,325.17,1H169.42"
+    />
+    <path
+      className={styles.borderStroke}
+      fill="none"
+      strokeMiterlimit="10px"
+      strokeWidth="2px"
+      d="M.4,17.09C11.6,12.16,14.83,1,14.83,1H170.41"
+    />
+    <path
+      className={styles.borderStroke}
+      fill="none"
+      strokeMiterlimit="10px"
+      strokeWidth="1.5px"
+      d="M171.85,3.56"
+    />
+    <path
+      className={styles.borderStroke}
+      fill="none"
+      strokeMiterlimit="10px"
+      strokeWidth="2px"
+      d="M200.23,6.19c-7.16,6.12-20.56,8.32-30.35,8.32"
+    />
+    <path
+      className={styles.borderStroke}
+      fill="none"
+      strokeMiterlimit="10px"
+      strokeWidth="2px"
+      d="M170.12,14.51c-9.79,0-23.19-2.2-30.35-8.32"
+    />
+    <path
+      className={styles.borderFill}
+      d="M167.12,14.51a3,3,0,1,0,3-3,3,3,0,0,0-3,3"
+    />
+    <path
+      className={styles.borderStroke}
+      fill="none"
+      strokeMiterlimit="10px"
+      strokeWidth="3px"
+      d="M1.5,18V10.89A5.44,5.44,0,0,1,7,5.5h326.1a5.44,5.44,0,0,1,5.45,5.39V18"
+    />
+  </svg>
+);
diff --git a/ddb_main/theme/index.ts b/ddb_main/theme/index.ts
new file mode 100644
index 0000000..19f3f8f
--- /dev/null
+++ b/ddb_main/theme/index.ts
@@ -0,0 +1,29 @@
+import {
+  createLightTheme,
+  createDarkTheme,
+} from "@dndbeyond/ttui/mui/theme/createTheme";
+
+type PaletteOpt = "light" | "dark";
+
+export const getTheme = (lightOrDark: PaletteOpt = "light", primary?) => {
+  const primaryOverride = primary ? { primary: { main: primary } } : null;
+  const themeOverrides = {
+    palette: primaryOverride ?? {},
+    zIndex: { modal: 99999 },
+    components: {
+      MuiPaper: {
+        styleOverrides: {
+          root: {
+            backgroundImage: "none",
+          },
+        },
+      },
+    },
+  };
+
+  if (lightOrDark === "light") {
+    return createLightTheme(themeOverrides);
+  } else {
+    return createDarkTheme(themeOverrides);
+  }
+};
diff --git a/ddb_main/tools/js/CharacterBuilder/actions/builder/actionTypes.ts b/ddb_main/tools/js/CharacterBuilder/actions/builder/actionTypes.ts
new file mode 100644
index 0000000..5f9df32
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/actions/builder/actionTypes.ts
@@ -0,0 +1,15 @@
+export const QUICK_BUILD_REQUEST = "builder.QUICK_BUILD_REQUEST";
+export const RANDOM_BUILD_REQUEST = "builder.RANDOM_BUILD_REQUEST";
+export const STEP_BUILD_REQUEST = "builder.STEP_BUILD_REQUEST";
+export const CHARACTER_LOAD_REQUEST = "builder.CHARACTER_LOAD_REQUEST";
+export const BUILDER_METHOD_SET = "builder.BUILDER_METHOD_SET";
+export const BUILDER_METHOD_SET_COMMIT = "builder.BUILDER_METHOD_SET_COMMIT";
+export const CHARACTER_LOADING_SET_COMMIT =
+  "builder.CHARACTER_LOADING_SET_COMMIT";
+export const CHARACTER_LOADED_SET_COMMIT =
+  "builder.CHARACTER_LOADED_SET_COMMIT";
+export const CONFIRM_SPECIES_SET = "builder.CONFIRM_SPECIES_SET";
+export const CONFIRM_CLASS_SET = "builder.CONFIRM_CLASS_SET";
+export const SHOW_HELP_TEXT_SET = "builder.SHOW_HELP_TEXT_SET";
+export const SUGGESTED_NAMES_SET = "builder.SUGGESTED_NAMES_SET";
+export const SUGGESTED_NAMES_REQUEST = "builder.SUGGESTED_NAMES_REQUEST";
diff --git a/ddb_main/tools/js/CharacterBuilder/actions/builder/actions.ts b/ddb_main/tools/js/CharacterBuilder/actions/builder/actions.ts
new file mode 100644
index 0000000..2c3488a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/actions/builder/actions.ts
@@ -0,0 +1,169 @@
+import {
+  ClassDefinitionContract,
+  RaceDefinitionContract,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { builderActionTypes } from "../builder";
+import {
+  BuilderMethodSetAction,
+  BuilderMethodSetActionPayload,
+  BuilderMethodSetCommitAction,
+  CharacterLoadedSetCommitAction,
+  CharacterLoadingSetCommitAction,
+  CharacterLoadRequestAction,
+  ConfirmClassSetAction,
+  ConfirmSpeciesSetAction,
+  QuickBuildRequestAction,
+  RandomBuildRequestAction,
+  ShowHelpTextSetAction,
+  StepBuildRequestAction,
+  SuggestedNamesRequestAction,
+  SuggestedNamesSetAction,
+} from "./typings";
+
+export function characterLoadRequest(): CharacterLoadRequestAction {
+  return {
+    type: builderActionTypes.CHARACTER_LOAD_REQUEST,
+    payload: {},
+  };
+}
+
+export function quickBuildRequest(
+  entitySpeciesId: number | null,
+  entitySpeciesTypeId: number | null,
+  classId: number | null,
+  name: string | null
+): QuickBuildRequestAction {
+  return {
+    type: builderActionTypes.QUICK_BUILD_REQUEST,
+    payload: {
+      entityRaceId: entitySpeciesId,
+      entityRaceTypeId: entitySpeciesTypeId,
+      classId,
+      name,
+    },
+  };
+}
+
+export function randomBuildRequest(
+  level: number | null,
+  entitySpeciesId: number | null,
+  entitySpeciesTypeId: number | null,
+  classId: number | null,
+  allowMulticlass: boolean,
+  allowFeats: boolean,
+  name: string | null
+): RandomBuildRequestAction {
+  return {
+    type: builderActionTypes.RANDOM_BUILD_REQUEST,
+    payload: {
+      level,
+      entityRaceId: entitySpeciesId,
+      entityRaceTypeId: entitySpeciesTypeId,
+      classId,
+      allowMulticlass,
+      allowFeats,
+      name,
+    },
+  };
+}
+
+export function stepBuildRequest(
+  showHelpText: boolean
+): StepBuildRequestAction {
+  return {
+    type: builderActionTypes.STEP_BUILD_REQUEST,
+    payload: {
+      showHelpText,
+    },
+  };
+}
+
+export function characterLoadingSetCommit(
+  isLoading: boolean
+): CharacterLoadingSetCommitAction {
+  return {
+    type: builderActionTypes.CHARACTER_LOADING_SET_COMMIT,
+    payload: {
+      isLoading,
+    },
+  };
+}
+
+export function characterLoadedSetCommit(
+  isLoaded: boolean
+): CharacterLoadedSetCommitAction {
+  return {
+    type: builderActionTypes.CHARACTER_LOADED_SET_COMMIT,
+    payload: {
+      isLoaded,
+    },
+  };
+}
+
+export function showHelpTextSet(showHelpText: boolean): ShowHelpTextSetAction {
+  return {
+    type: builderActionTypes.SHOW_HELP_TEXT_SET,
+    payload: {
+      showHelpText,
+    },
+  };
+}
+
+export function builderMethodSet(method: string): BuilderMethodSetAction {
+  return {
+    type: builderActionTypes.BUILDER_METHOD_SET,
+    payload: {
+      method,
+    },
+  };
+}
+
+export function builderMethodSetCommit(
+  payload: BuilderMethodSetActionPayload
+): BuilderMethodSetCommitAction {
+  return {
+    type: builderActionTypes.BUILDER_METHOD_SET_COMMIT,
+    payload,
+  };
+}
+
+export function confirmSpeciesSet(
+  species: RaceDefinitionContract
+): ConfirmSpeciesSetAction {
+  return {
+    type: builderActionTypes.CONFIRM_SPECIES_SET,
+    payload: {
+      race: species,
+    },
+  };
+}
+
+export function confirmClassSet(
+  charClass: ClassDefinitionContract
+): ConfirmClassSetAction {
+  return {
+    type: builderActionTypes.CONFIRM_CLASS_SET,
+    payload: {
+      charClass,
+    },
+  };
+}
+
+export function suggestedNamesSet(
+  suggestedNames: Array<string>
+): SuggestedNamesSetAction {
+  return {
+    type: builderActionTypes.SUGGESTED_NAMES_SET,
+    payload: {
+      suggestedNames,
+    },
+  };
+}
+
+export function suggestedNamesRequest(): SuggestedNamesRequestAction {
+  return {
+    type: builderActionTypes.SUGGESTED_NAMES_REQUEST,
+    payload: {},
+  };
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/actions/builder/index.ts b/ddb_main/tools/js/CharacterBuilder/actions/builder/index.ts
new file mode 100644
index 0000000..e90e003
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/actions/builder/index.ts
@@ -0,0 +1,9 @@
+import * as actionTypes from "./actionTypes";
+import * as actions from "./actions";
+import * as typings from "./typings";
+
+export const builderActionTypes = actionTypes;
+export const builderActions = actions;
+export const builderTypings = typings;
+
+export * from "./typings";
diff --git a/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerManual/AbilityScoreManagerManual.tsx b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerManual/AbilityScoreManagerManual.tsx
new file mode 100644
index 0000000..04b2287
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerManual/AbilityScoreManagerManual.tsx
@@ -0,0 +1,52 @@
+import {
+  AbilityManager,
+  HelperUtils,
+} from "@dndbeyond/character-rules-engine/es";
+import { FormInputField } from "~/tools/js/Shared/components/common/FormInputField";
+
+
+interface Props {
+  abilities: Array<AbilityManager>;
+  minScore?: number;
+  maxScore?: number;
+}
+
+export default function AbilityScoreManagerManual({
+  abilities,
+  minScore = 3,
+  maxScore = 18,
+}: Props) {
+  const handleTransformValueOnBlur = (value: string): number | null => {
+    const parsedValue = HelperUtils.parseInputInt(value);
+    let clampedValue: number | null = null;
+    if (parsedValue !== null) {
+      clampedValue = HelperUtils.clampInt(parsedValue, minScore, maxScore);
+    }
+
+    return clampedValue;
+  };
+
+  return (
+    <div className=" ability-score-manager ability-score-manager-manual">
+      <div className="ability-score-manager-stats">
+        {abilities.map((abilityScore) => (
+          <div
+            className="ability-score-manager-stat"
+            key={abilityScore.getId()}
+            data-stat-id={abilityScore.getId()}
+          >
+            <FormInputField
+              transformValueOnBlur={handleTransformValueOnBlur}
+              onBlur={(value) => abilityScore.handleScoreChange(Number(value))}
+              label={abilityScore.getLabel() ?? ""}
+              initialValue={abilityScore.getBaseScore()}
+            />
+            <div className="ability-score-manager-stat-total">
+              Total: {abilityScore.getTotalScore() ?? "--"}
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerManual/index.ts b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerManual/index.ts
new file mode 100644
index 0000000..3bb6acd
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerManual/index.ts
@@ -0,0 +1,4 @@
+import AbilityScoreManagerManual from "./AbilityScoreManagerManual";
+
+export default AbilityScoreManagerManual;
+export { AbilityScoreManagerManual };
diff --git a/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerPointBuy/AbilityScoreManagerPointBuy.tsx b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerPointBuy/AbilityScoreManagerPointBuy.tsx
new file mode 100644
index 0000000..ad1ae87
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerPointBuy/AbilityScoreManagerPointBuy.tsx
@@ -0,0 +1,130 @@
+import { uniqueId } from "lodash";
+
+import { Select } from "@dndbeyond/character-components/es";
+import {
+  AbilityManager,
+  HelperUtils,
+  HtmlSelectOption,
+} from "@dndbeyond/character-rules-engine/es";
+
+const totalPoints: number = 27;
+const scoreChoices: Array<number> = [8, 9, 10, 11, 12, 13, 14, 15];
+const scorePoints: Record<number, number> = {
+  8: 0,
+  9: 1,
+  10: 2,
+  11: 3,
+  12: 4,
+  13: 5,
+  14: 7,
+  15: 9,
+};
+
+function renderScoreLabel(score: number, currentScore: number | null): string {
+  if (currentScore !== null) {
+    if (score > currentScore) {
+      const pointDiff = scorePoints[score] - scorePoints[currentScore];
+      return `${score} (-${pointDiff} Point${pointDiff === 1 ? "" : "s"})`;
+    } else if (score < currentScore) {
+      const pointDiff = scorePoints[currentScore] - scorePoints[score];
+      return `${score} (+${pointDiff} Point${pointDiff === 1 ? "" : "s"})`;
+    }
+  }
+
+  return "" + score;
+}
+
+interface Props {
+  abilities: Array<AbilityManager>;
+}
+export default function AbilityScoreManagerPointBuy({ abilities }: Props) {
+  const currentPoints = abilities.reduce((acc: number, abilityScore) => {
+    const baseScore = abilityScore.getBaseScore();
+    if (baseScore !== null) {
+      return acc + scorePoints[baseScore];
+    }
+    return acc;
+  }, 0);
+  const remainingPoints: number = totalPoints - currentPoints;
+
+  return (
+    <div className="ability-score-manager ability-score-manager-point">
+      <div className="ability-score-manager-points">
+        <div className="ability-score-manager-points-heading">
+          Points Remaining
+        </div>
+        <div className="ability-score-manager-points-value">
+          <span className="ability-score-manager-points-value-remaining">
+            {remainingPoints}
+          </span>
+          <span className="ability-score-manager-points-value-sep">/</span>
+          <span className="ability-score-manager-points-value-total">
+            {totalPoints}
+          </span>
+        </div>
+      </div>
+      <div className="ability-score-manager-stats">
+        {abilities.map((abilityScore) => {
+          const uId = uniqueId("qry_");
+          const baseScore = abilityScore.getBaseScore();
+          const availableScores = scoreChoices.reduce(
+            (acc: Array<number>, score) => {
+              let pointDiff = scorePoints[score];
+              if (baseScore !== null) {
+                pointDiff -= scorePoints[baseScore];
+              }
+
+              if (
+                pointDiff < 0 ||
+                (pointDiff > 0 && pointDiff <= remainingPoints) ||
+                score === abilityScore.getBaseScore()
+              ) {
+                acc.push(score);
+              }
+
+              return acc;
+            },
+            []
+          );
+          const availableScoreOptions: Array<HtmlSelectOption> =
+            availableScores.map((score) => ({
+              label: renderScoreLabel(score, abilityScore.getBaseScore()),
+              value: score,
+            }));
+
+          return (
+            <div
+              className="ability-score-manager-stat"
+              key={abilityScore.getId()}
+            >
+              <div className="builder-field form-select-field">
+                <span className="builder-field-label">
+                  <label
+                    className="builder-field-heading form-select-field-label"
+                    htmlFor={uId}
+                  >
+                    {abilityScore.getLabel()}
+                  </label>
+                </span>
+                <span className="builder-field-input">
+                  <Select
+                    id={uId}
+                    options={availableScoreOptions}
+                    value={abilityScore.getBaseScore()}
+                    onChange={(value) =>
+                      abilityScore.handleScoreChange(Number(value))
+                    }
+                    initialOptionRemoved={true}
+                  />
+                </span>
+                <div className="ability-score-manager-stat-total">
+                  Total: {abilityScore.getTotalScore() ?? "--"}
+                </div>
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerPointBuy/index.ts b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerPointBuy/index.ts
new file mode 100644
index 0000000..560be17
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerPointBuy/index.ts
@@ -0,0 +1,4 @@
+import AbilityScoreManagerPointBuy from "./AbilityScoreManagerPointBuy";
+
+export default AbilityScoreManagerPointBuy;
+export { AbilityScoreManagerPointBuy };
diff --git a/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerStandardArray/AbilityScoreManagerStandardArray.tsx b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerStandardArray/AbilityScoreManagerStandardArray.tsx
new file mode 100644
index 0000000..e343962
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerStandardArray/AbilityScoreManagerStandardArray.tsx
@@ -0,0 +1,82 @@
+import { uniqueId } from "lodash";
+
+import { Select } from "@dndbeyond/character-components/es";
+import {
+  AbilityManager,
+  HelperUtils,
+  HtmlSelectOption,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { TypeScriptUtils } from "../../../Shared/utils";
+
+const standardScores: Array<number> = [8, 10, 12, 13, 14, 15];
+
+interface Props {
+  abilities: Array<AbilityManager>;
+}
+export default function AbilityScoreManagerStandardArray({ abilities }: Props) {
+  const usedScores = abilities
+    .map((abilityScore) => abilityScore.getBaseScore())
+    .filter(TypeScriptUtils.isNotNullOrUndefined);
+
+  return (
+    <div className="ability-score-manager ability-score-manager-standard">
+      <div className="ability-score-manager-stats">
+        {abilities.map((abilityScore) => {
+          const uId = uniqueId("qry_");
+          const availableScores = standardScores.reduce(
+            (acc: Array<number>, score) => {
+              if (
+                !usedScores.includes(score) ||
+                score === abilityScore.getBaseScore()
+              ) {
+                acc.push(score);
+              }
+
+              return acc;
+            },
+            []
+          );
+          const availableScoreOptions: Array<HtmlSelectOption> =
+            availableScores.map((score) => ({
+              label: "" + score,
+              value: score,
+            }));
+
+          return (
+            <div
+              className="ability-score-manager-stat"
+              key={abilityScore.getId()}
+            >
+              <div className="builder-field form-select-field">
+                <span className="builder-field-label">
+                  <label
+                    className="builder-field-heading form-select-field-label"
+                    htmlFor={uId}
+                  >
+                    {abilityScore.getLabel()}
+                  </label>
+                </span>
+                <span className="builder-field-input">
+                  <Select
+                    id={uId}
+                    options={availableScoreOptions}
+                    value={abilityScore.getBaseScore()}
+                    onChange={(value) => {
+                      const parsedValue = HelperUtils.parseInputInt(value);
+                      abilityScore.handleScoreChange(parsedValue);
+                    }}
+                    placeholder={"--"}
+                  />
+                </span>
+                <div className="ability-score-manager-stat-total">
+                  Total: {abilityScore.getTotalScore() ?? "--"}
+                </div>
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerStandardArray/index.ts b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerStandardArray/index.ts
new file mode 100644
index 0000000..d2e13dc
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/AbilityScoreManagerStandardArray/index.ts
@@ -0,0 +1,4 @@
+import AbilityScoreManagerStandardArray from "./AbilityScoreManagerStandardArray";
+
+export default AbilityScoreManagerStandardArray;
+export { AbilityScoreManagerStandardArray };
diff --git a/ddb_main/tools/js/CharacterBuilder/components/Button/Button.tsx b/ddb_main/tools/js/CharacterBuilder/components/Button/Button.tsx
new file mode 100644
index 0000000..d1e9299
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/Button/Button.tsx
@@ -0,0 +1,34 @@
+import React from "react";
+
+import { Button } from "@dndbeyond/character-components/es";
+
+interface withBuilderProps {
+  clsNames: Array<string>;
+}
+function withBuilderButton<P extends object, C>(
+  WrappedComponent: React.JSXElementConstructor<P> & C
+) {
+  type Props = JSX.LibraryManagedAttributes<C, P>;
+  return class WithBuilderButton extends React.PureComponent<
+    Props & withBuilderProps
+  > {
+    static defaultProps = {
+      clsNames: [],
+    };
+
+    render() {
+      const { children, clsNames } = this.props;
+
+      return (
+        <WrappedComponent
+          {...(this.props as any)}
+          clsNames={[...clsNames, "builder-button"]}
+        >
+          {children}
+        </WrappedComponent>
+      );
+    }
+  };
+}
+
+export default withBuilderButton(Button);
diff --git a/ddb_main/tools/js/CharacterBuilder/components/Button/index.ts b/ddb_main/tools/js/CharacterBuilder/components/Button/index.ts
new file mode 100644
index 0000000..c1e95b0
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/Button/index.ts
@@ -0,0 +1,4 @@
+import Button from "./Button";
+
+export default Button;
+export { Button };
diff --git a/ddb_main/tools/js/CharacterBuilder/components/CharacterSheetOptions/RadioGroup/RadioGroup.tsx b/ddb_main/tools/js/CharacterBuilder/components/CharacterSheetOptions/RadioGroup/RadioGroup.tsx
new file mode 100644
index 0000000..cce5243
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/CharacterSheetOptions/RadioGroup/RadioGroup.tsx
@@ -0,0 +1,68 @@
+import FormControl from "@mui/material/FormControl";
+import FormControlLabel from "@mui/material/FormControlLabel";
+import FormLabel from "@mui/material/FormLabel";
+import Radio from "@mui/material/Radio";
+import MuiRadioGroup from "@mui/material/RadioGroup";
+import Typography from "@mui/material/Typography";
+import { ChangeEvent } from "react";
+
+import { TitleH3 } from "../shared-styles";
+
+type RadioGroupProps = {
+  name?: string;
+  defaultValue?: any;
+  label: string;
+  options?: any;
+  subtitle?: string;
+  onChange?: (event: ChangeEvent, value: any) => void;
+  disabled?: boolean;
+  value?: any;
+};
+
+export const RadioGroup = ({
+  name,
+  defaultValue,
+  label,
+  options,
+  subtitle,
+  onChange,
+  disabled = false,
+  value,
+}: RadioGroupProps) => {
+  return (
+    <FormControl disabled={disabled}>
+      <FormLabel
+        sx={{ ...TitleH3, color: "#000" }}
+        id={`radio-button-group-${label.split(" ").join("-")}`}
+      >
+        {label}
+      </FormLabel>
+      <Typography
+        variant="subtitle1"
+        sx={{ color: "#12181ca3", fontSize: "14px" }}
+      >
+        {subtitle}
+      </Typography>
+      <MuiRadioGroup
+        aria-labelledby={`radio-button-group-${label.split(" ").join("-")}`}
+        name={name}
+        onChange={onChange}
+        {...{
+          ...(defaultValue && { defaultValue }),
+          ...(value && { value }),
+        }}
+      >
+        {options.map((option) => {
+          return (
+            <FormControlLabel
+              value={option.value}
+              control={<Radio color="secondary" />}
+              label={option.label}
+              key={option.value}
+            />
+          );
+        })}
+      </MuiRadioGroup>
+    </FormControl>
+  );
+};
diff --git a/ddb_main/tools/js/CharacterBuilder/components/CharacterSheetOptions/RadioGroup/index.ts b/ddb_main/tools/js/CharacterBuilder/components/CharacterSheetOptions/RadioGroup/index.ts
new file mode 100644
index 0000000..7b27170
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/CharacterSheetOptions/RadioGroup/index.ts
@@ -0,0 +1,4 @@
+import { RadioGroup } from "./RadioGroup";
+
+export default RadioGroup;
+export { RadioGroup };
diff --git a/ddb_main/tools/js/CharacterBuilder/components/CharacterSheetOptions/shared-styles.ts b/ddb_main/tools/js/CharacterBuilder/components/CharacterSheetOptions/shared-styles.ts
new file mode 100644
index 0000000..f9c53db
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/CharacterSheetOptions/shared-styles.ts
@@ -0,0 +1,8 @@
+export const TitleH3 = {
+  fontSize: "16px",
+  fontWeight: "bold",
+  fontFamily: "Roboto Condensed",
+  letterSpacing: "normal",
+  lineHeight: 1.5,
+  marginTop: 4,
+};
diff --git a/ddb_main/tools/js/CharacterBuilder/components/ClassDisplaySimple/ClassDisplaySimple.tsx b/ddb_main/tools/js/CharacterBuilder/components/ClassDisplaySimple/ClassDisplaySimple.tsx
new file mode 100644
index 0000000..712f6a4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/ClassDisplaySimple/ClassDisplaySimple.tsx
@@ -0,0 +1,46 @@
+import React from "react";
+
+import { ClassDefinitionContract } from "@dndbeyond/character-rules-engine/es";
+
+import Button from "../Button";
+
+interface Props {
+  charClass: ClassDefinitionContract;
+  onRequestChange: () => void;
+}
+export default class ClassDisplaySimple extends React.PureComponent<Props> {
+  handleChangeClick = () => {
+    const { onRequestChange } = this.props;
+
+    if (onRequestChange) {
+      onRequestChange();
+    }
+  };
+
+  render() {
+    const { charClass } = this.props;
+
+    let portraitAvatarUrl = charClass.portraitAvatarUrl;
+
+    return (
+      <div className="builder-field builder-field-valid class-simple">
+        <div className="builder-field-heading">Selected Class</div>
+        <div className="class-simple-chosen">
+          <div className="class-simple-chosen-preview">
+            <img
+              className="class-simple-chosen-preview-img"
+              src={portraitAvatarUrl ? portraitAvatarUrl : ""}
+              alt=""
+            />
+          </div>
+          <div className="class-simple-chosen-heading">{charClass.name}</div>
+          <div className="class-simple-chosen-action">
+            <Button onClick={this.handleChangeClick} size="small">
+              Change
+            </Button>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/components/ClassDisplaySimple/index.ts b/ddb_main/tools/js/CharacterBuilder/components/ClassDisplaySimple/index.ts
new file mode 100644
index 0000000..fdcff47
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/ClassDisplaySimple/index.ts
@@ -0,0 +1,4 @@
+import ClassDisplaySimple from "./ClassDisplaySimple";
+
+export default ClassDisplaySimple;
+export { ClassDisplaySimple };
diff --git a/ddb_main/tools/js/CharacterBuilder/components/GrantedFeat/GrantedFeat.tsx b/ddb_main/tools/js/CharacterBuilder/components/GrantedFeat/GrantedFeat.tsx
new file mode 100644
index 0000000..b114052
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/GrantedFeat/GrantedFeat.tsx
@@ -0,0 +1,93 @@
+import React, { useContext } from "react";
+
+import { Select } from "@dndbeyond/character-components/es";
+import { FeatList, FormatUtils } from "@dndbeyond/character-rules-engine";
+
+import { Accordion } from "~/components/Accordion";
+import { FeatDetail } from "~/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatDetail";
+import { CharacterFeaturesManagerContext } from "~/tools/js/Shared/managers/CharacterFeaturesManagerContext";
+
+type GrantedFeatProps = {
+  featList: FeatList;
+  requiredLevel?: number;
+};
+
+export const GrantedFeat: React.FC<GrantedFeatProps> = ({
+  featList,
+  requiredLevel,
+}) => {
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+
+  // Only show the Feat List section if there is something to show.
+  if (featList.isEmpty()) {
+    return null;
+  }
+
+  let featContent: React.ReactNode | undefined;
+  let selectBox: React.ReactNode | undefined;
+  let infoMessage: React.ReactNode | undefined;
+  let hasUnfinishedChoices = featList.hasChoiceToMake();
+  let subtitleItems = ["Granted Feat"];
+
+  // Show a message when the character already has every feat in the feat list from somewhere else.
+  if (featList.alreadyHasEveryFeat() && featList.chosenFeatId === null) {
+    infoMessage = <p>This feat already exists on your character.</p>;
+  } else {
+    // Show the feat details if a feat has been chosen from the feat list.
+    if (featList.chosenFeatId !== null) {
+      const featId = featList.chosenFeatId;
+      const featManager = characterFeaturesManager.getFeatById(featId);
+
+      if (featManager !== null) {
+        const needToChooseFeatOptions =
+          featManager.getUnfinishedChoices().length > 0;
+        hasUnfinishedChoices = hasUnfinishedChoices || needToChooseFeatOptions;
+
+        featContent = <FeatDetail featManager={featManager} />;
+
+        if (featManager.isHiddenFeat()) {
+          subtitleItems = []; // don't call it a feat if it isn't really a feat.
+        }
+
+        const choiceCount = featManager.getChoices().length;
+        if (choiceCount) {
+          subtitleItems.push(
+            `${choiceCount} Choice${choiceCount !== 1 ? "s" : ""}`
+          );
+        }
+      }
+    }
+
+    // When there is more than one feat in the list, show the select box to choose one.
+    if (!featList.isSingleFeat()) {
+      selectBox = (
+        <Select
+          onChangePromise={(...args) => featList.handleChoiceSelected(...args)}
+          options={featList.availableChoices}
+          value={featList.chosenFeatId !== null ? featList.chosenFeatId : -1}
+          clsNames={["description-manage-background-granted-feat-chooser"]}
+        />
+      );
+    }
+  }
+
+  if (requiredLevel) {
+    subtitleItems.push(`${FormatUtils.ordinalize(requiredLevel)} level`);
+  }
+
+  return (
+    <Accordion
+      summary={featList.definition.name}
+      summaryMetaItems={subtitleItems}
+      showAlert={hasUnfinishedChoices}
+      variant="paper"
+      key={featList.definition.id}
+    >
+      {infoMessage}
+      {selectBox}
+      {featContent}
+    </Accordion>
+  );
+};
diff --git a/ddb_main/tools/js/CharacterBuilder/components/OptionalFeature/OptionalFeature.tsx b/ddb_main/tools/js/CharacterBuilder/components/OptionalFeature/OptionalFeature.tsx
new file mode 100644
index 0000000..01bf25b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/OptionalFeature/OptionalFeature.tsx
@@ -0,0 +1,263 @@
+import React from "react";
+
+import { Checkbox, Select } from "@dndbeyond/character-components/es";
+import {
+  Constants,
+  FormatUtils,
+  HtmlSelectOption,
+  AccessUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { CollapsibleContent } from "~/components/CollapsibleContent";
+import { Link } from "~/components/Link";
+
+export interface AffectedFeatureInfo {
+  name: string;
+  definitionKey: string;
+  disabled: boolean;
+}
+interface OptionalFeatureProps {
+  name: string;
+  requiredLevel?: number;
+  description: string | null;
+  featureType: Constants.FeatureTypeEnum | null;
+  definitionKey: string;
+  affectedFeatureDefinitionKey: string | null;
+  isSelected: boolean;
+  onSelection: (
+    definitionKey: string,
+    affectedFeatureDefinitionKey: string | null
+  ) => void;
+  onRemoveSelectionPromise?: (
+    definitionKey: string,
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onChangeReplacementPromise?: (
+    definitionKey: string,
+    newAffectedDefinitionKey: string | null,
+    oldAffectedDefinitionKey: string | null,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  affectedFeatures: Array<AffectedFeatureInfo>;
+  accessType: Constants.AccessTypeEnum;
+}
+export class OptionalFeature extends React.PureComponent<
+  OptionalFeatureProps,
+  {}
+> {
+  handleSelection = (isEnabled: boolean): void => {
+    const { featureType, onSelection, definitionKey, affectedFeatures } =
+      this.props;
+
+    switch (featureType) {
+      case Constants.FeatureTypeEnum.REPLACEMENT: {
+        if (isEnabled) {
+          const affectedFeatureDefinitionKey: string | null =
+            affectedFeatures.length === 1
+              ? affectedFeatures[0].definitionKey
+              : null;
+
+          onSelection(definitionKey, affectedFeatureDefinitionKey);
+        }
+        break;
+      }
+
+      case Constants.FeatureTypeEnum.ADDITIONAL: {
+        if (isEnabled) {
+          onSelection(definitionKey, null);
+        }
+
+        break;
+      }
+
+      default:
+      //not implemented
+    }
+  };
+
+  transformDefinitionKey = (definitionKey: string): string | null => {
+    return definitionKey.length ? definitionKey : null;
+  };
+
+  handleReplacementChangePromise = (
+    newAffectedDefinitionKey: string,
+    oldAffectedDefinitionKey: string,
+    accept: () => void,
+    reject: () => void
+  ) => {
+    const { onChangeReplacementPromise, definitionKey } = this.props;
+
+    if (onChangeReplacementPromise) {
+      onChangeReplacementPromise(
+        definitionKey,
+        this.transformDefinitionKey(newAffectedDefinitionKey),
+        this.transformDefinitionKey(oldAffectedDefinitionKey),
+        accept,
+        reject
+      );
+    }
+  };
+
+  handleUnselectPromise = (
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ) => {
+    const { onRemoveSelectionPromise, definitionKey } = this.props;
+
+    if (onRemoveSelectionPromise) {
+      onRemoveSelectionPromise(definitionKey, newIsEnabled, accept, reject);
+    }
+  };
+
+  renderReplacements = (): React.ReactNode => {
+    const {
+      affectedFeatures,
+      isSelected,
+      featureType,
+      affectedFeatureDefinitionKey,
+    } = this.props;
+
+    if (!affectedFeatures.length) {
+      return null;
+    }
+
+    const introText: Array<string> = ["Replaces:"];
+    const disabledText: string = "(already replaced)";
+    if (affectedFeatures.length === 1) {
+      introText.push(affectedFeatures[0].name);
+      if (affectedFeatures[0].disabled) {
+        introText.push(disabledText);
+      }
+    }
+
+    const options: Array<HtmlSelectOption> = [];
+    if (affectedFeatures.length > 1) {
+      affectedFeatures.forEach((feature) => {
+        const label: Array<string> = [feature.name];
+        if (feature.disabled) {
+          label.push(disabledText);
+        }
+
+        options.push({
+          label: label.join(" "),
+          value: feature.definitionKey,
+          disabled: feature.disabled,
+        });
+      });
+    }
+
+    const classNames: Array<string> = ["ct-optional-feature__select"];
+
+    if (
+      featureType === Constants.FeatureTypeEnum.REPLACEMENT &&
+      isSelected &&
+      affectedFeatureDefinitionKey === null
+    ) {
+      classNames.push("ct-optional-feature__select--todo");
+    }
+
+    return (
+      <React.Fragment>
+        <div className="ct-optional-feature__type">{introText.join(" ")}</div>
+        {options.length > 1 && (
+          <div className={classNames.join(" ")}>
+            <Select
+              options={options}
+              value={affectedFeatureDefinitionKey}
+              onChangePromise={this.handleReplacementChangePromise}
+              disabled={!isSelected}
+              preventClickPropagating={true}
+            />
+          </div>
+        )}
+      </React.Fragment>
+    );
+  };
+
+  renderFeatureTypeContent = (): React.ReactNode => {
+    const { featureType } = this.props;
+
+    switch (featureType) {
+      case Constants.FeatureTypeEnum.ADDITIONAL:
+        return (
+          <div className="ct-optional-feature__type">Additional feature</div>
+        );
+
+      case Constants.FeatureTypeEnum.REPLACEMENT:
+        return this.renderReplacements();
+
+      default:
+        return null;
+    }
+  };
+
+  renderDescription = (): React.ReactNode => {
+    const { description, accessType } = this.props;
+
+    let contentNode: React.ReactNode = null;
+    if (AccessUtils.isAccessible(accessType)) {
+      contentNode = description ? (
+        <CollapsibleContent className="ct-optional-feature__description">
+          {description}
+        </CollapsibleContent>
+      ) : null;
+    } else {
+      contentNode = (
+        <div className="ct-character-tools__marketplace-callout">
+          To fully unlock this feature, check out the{" "}
+          <Link href="/marketplace">Marketplace</Link>.
+        </div>
+      );
+    }
+
+    return contentNode;
+  };
+
+  render() {
+    const { isSelected, name, affectedFeatures, requiredLevel } = this.props;
+
+    const isDisabled: boolean =
+      affectedFeatures.length === 1 && affectedFeatures[0].disabled;
+
+    const classNames: Array<string> = ["ct-optional-feature"];
+    if (isDisabled) {
+      classNames.push("ct-optional-feature--is-disabled");
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ct-optional-feature__selection">
+          <div className="ct-optional-feature__checkmark">
+            <Checkbox
+              initiallyEnabled={isSelected}
+              onChange={this.handleSelection}
+              stopPropagation={true}
+              onChangePromise={
+                isSelected ? this.handleUnselectPromise : undefined
+              }
+              isInteractive={!isDisabled}
+            />
+          </div>
+        </div>
+        <div className="ct-optional-feature__primary">
+          <div className="ct-optional-feature__name">{name}</div>
+          {requiredLevel && (
+            <div className="ct-optional-feature__level">
+              {`${FormatUtils.ordinalize(requiredLevel)} level`}
+            </div>
+          )}
+          {this.renderDescription()}
+          <div className="ct-optional-feature__secondary">
+            {this.renderFeatureTypeContent()}
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default OptionalFeature;
diff --git a/ddb_main/tools/js/CharacterBuilder/components/Page/Page.tsx b/ddb_main/tools/js/CharacterBuilder/components/Page/Page.tsx
new file mode 100644
index 0000000..15923ec
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/Page/Page.tsx
@@ -0,0 +1,18 @@
+import React from "react";
+
+interface Props {
+  clsNames: Array<string>;
+}
+export default class Page extends React.PureComponent<Props> {
+  static defaultProps = {
+    clsNames: [],
+  };
+
+  render() {
+    const { clsNames, children } = this.props;
+
+    const conClassNames = [...clsNames, "builder-page"];
+
+    return <div className={conClassNames.join(" ")}>{children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/components/Page/index.ts b/ddb_main/tools/js/CharacterBuilder/components/Page/index.ts
new file mode 100644
index 0000000..a7074e8
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/Page/index.ts
@@ -0,0 +1,4 @@
+import Page from "./Page";
+
+export default Page;
+export { Page };
diff --git a/ddb_main/tools/js/CharacterBuilder/components/PageBody/PageBody.tsx b/ddb_main/tools/js/CharacterBuilder/components/PageBody/PageBody.tsx
new file mode 100644
index 0000000..ca6598a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/PageBody/PageBody.tsx
@@ -0,0 +1,23 @@
+import { FC, HTMLAttributes } from "react";
+import { useSelector } from "react-redux";
+
+import { BuilderMethod } from "~/subApps/builder/constants";
+
+import { PortraitName } from "../../../../../subApps/builder/components/PortraitName";
+import { builderSelectors } from "../../selectors";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {}
+export const PageBody: FC<Props> = ({ children, ...props }) => {
+  const builderMethod = useSelector(builderSelectors.getBuilderMethod);
+
+  return (
+    <div className="builder-page-body" {...props}>
+      {builderMethod === BuilderMethod.STEP_BY_STEP && (
+        <div className="builder-page-body-character-name">
+          <PortraitName useDefaultCharacterName={true} />
+        </div>
+      )}
+      {children}
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/CharacterBuilder/components/PageHeader/PageHeader.tsx b/ddb_main/tools/js/CharacterBuilder/components/PageHeader/PageHeader.tsx
new file mode 100644
index 0000000..bcaced4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/PageHeader/PageHeader.tsx
@@ -0,0 +1,9 @@
+import React from "react";
+
+export default class PageHeader extends React.PureComponent {
+  render() {
+    const { children } = this.props;
+
+    return <div className="builder-page-header">{children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/components/PageHeader/index.ts b/ddb_main/tools/js/CharacterBuilder/components/PageHeader/index.ts
new file mode 100644
index 0000000..e72af33
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/PageHeader/index.ts
@@ -0,0 +1,4 @@
+import PageHeader from "./PageHeader";
+
+export default PageHeader;
+export { PageHeader };
diff --git a/ddb_main/tools/js/CharacterBuilder/components/PageSubHeader/PageSubHeader.tsx b/ddb_main/tools/js/CharacterBuilder/components/PageSubHeader/PageSubHeader.tsx
new file mode 100644
index 0000000..883371a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/PageSubHeader/PageSubHeader.tsx
@@ -0,0 +1,9 @@
+import React from "react";
+
+export default class PageSubHeader extends React.PureComponent {
+  render() {
+    const { children } = this.props;
+
+    return <div className="builder-page-subheader">{children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/components/PageSubHeader/index.ts b/ddb_main/tools/js/CharacterBuilder/components/PageSubHeader/index.ts
new file mode 100644
index 0000000..85a51ac
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/PageSubHeader/index.ts
@@ -0,0 +1,4 @@
+import PageSubHeader from "./PageSubHeader";
+
+export default PageSubHeader;
+export { PageSubHeader };
diff --git a/ddb_main/tools/js/CharacterBuilder/components/SpeciesDisplaySimple/SpeciesDisplaySimple.tsx b/ddb_main/tools/js/CharacterBuilder/components/SpeciesDisplaySimple/SpeciesDisplaySimple.tsx
new file mode 100644
index 0000000..dcd5002
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/SpeciesDisplaySimple/SpeciesDisplaySimple.tsx
@@ -0,0 +1,63 @@
+import React from "react";
+
+import {
+  RaceDefinitionContract,
+  RuleData,
+  RuleDataUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import Button from "../Button";
+
+interface Props {
+  species: RaceDefinitionContract | null;
+  onRequestAction: () => void;
+  actionText: string;
+  headingText: string;
+  ruleData: RuleData;
+}
+export default class SpeciesDisplaySimple extends React.PureComponent<Props> {
+  static defaultProps = {
+    actionText: "Change",
+    headingText: "Selected ",
+  };
+
+  render() {
+    const { species, actionText, headingText, ruleData, onRequestAction } =
+      this.props;
+
+    if (species === null) {
+      return null;
+    }
+
+    const { portraitAvatarUrl, baseName, subRaceShortName } = species;
+    const previewUrl: string | null = portraitAvatarUrl
+      ? portraitAvatarUrl
+      : RuleDataUtils.getDefaultRaceImageUrl(ruleData);
+
+    return (
+      <div className="builder-field builder-field-valid race-simple">
+        <div className="builder-field-heading">{headingText}</div>
+        <div className="race-simple-content">
+          <div className="race-simple-preview">
+            <img
+              className="race-simple-preview-img"
+              src={previewUrl ? previewUrl : ""}
+              alt=""
+            />
+          </div>
+          <div className="race-simple-info">
+            {subRaceShortName ? (
+              <div className="race-simple-subclass">{subRaceShortName}</div>
+            ) : null}
+            <div className="race-simple-parent">{baseName}</div>
+          </div>
+          <div className="race-simple-action">
+            <Button onClick={onRequestAction} size="small">
+              {actionText}
+            </Button>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/components/SpeciesDisplaySimple/index.ts b/ddb_main/tools/js/CharacterBuilder/components/SpeciesDisplaySimple/index.ts
new file mode 100644
index 0000000..51128e3
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/SpeciesDisplaySimple/index.ts
@@ -0,0 +1,4 @@
+import SpeciesDisplaySimple from "./SpeciesDisplaySimple";
+
+export default SpeciesDisplaySimple;
+export { SpeciesDisplaySimple };
diff --git a/ddb_main/tools/js/CharacterBuilder/components/SpeciesTraitList/SpeciesTraitList.tsx b/ddb_main/tools/js/CharacterBuilder/components/SpeciesTraitList/SpeciesTraitList.tsx
new file mode 100644
index 0000000..a08d2e6
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/SpeciesTraitList/SpeciesTraitList.tsx
@@ -0,0 +1,74 @@
+import React from "react";
+
+import {
+  AnySimpleDataType,
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiResponse,
+  CharacterPreferences,
+  ChoiceData,
+  DefinitionPool,
+  FeatDefinitionContract,
+  FeatLookup,
+  OptionalOriginLookup,
+  PrerequisiteData,
+  RacialTrait,
+  RacialTraitUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { SpeciesManageSpeciesTrait } from "../../containers/pages/SpeciesManage";
+
+interface Props {
+  speciesTraits: RacialTrait[];
+  featLookup: FeatLookup;
+  loadAvailableFeats: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<FeatDefinitionContract[]>>;
+  handleSpeciesTraitChoiceChange: (
+    speciesTraitId: number,
+    choiceId: string,
+    choiceType: number,
+    optionValue: AnySimpleDataType
+  ) => void;
+  choiceInfo: ChoiceData;
+  prerequisiteData: PrerequisiteData;
+  preferences: CharacterPreferences;
+  optionalOriginLookup: OptionalOriginLookup;
+  definitionPool: DefinitionPool;
+  speciesName?: string | null;
+}
+
+const SpeciesTraitList: React.FC<Props> = ({
+  speciesTraits,
+  featLookup,
+  loadAvailableFeats,
+  handleSpeciesTraitChoiceChange,
+  choiceInfo,
+  prerequisiteData,
+  preferences,
+  optionalOriginLookup,
+  definitionPool,
+  speciesName,
+}) => {
+  return (
+    <>
+      {speciesTraits.map((speciesTrait) => (
+        <SpeciesManageSpeciesTrait
+          key={RacialTraitUtils.getId(speciesTrait)}
+          speciesTrait={speciesTrait}
+          featLookup={featLookup}
+          loadAvailableFeats={loadAvailableFeats}
+          onChoiceChange={handleSpeciesTraitChoiceChange}
+          choiceInfo={choiceInfo}
+          prerequisiteData={prerequisiteData}
+          preferences={preferences}
+          optionalOriginLookup={optionalOriginLookup}
+          definitionPool={definitionPool}
+          speciesName={speciesName}
+        />
+      ))}
+    </>
+  );
+};
+
+export default SpeciesTraitList;
diff --git a/ddb_main/tools/js/CharacterBuilder/components/SpeciesTraitList/index.ts b/ddb_main/tools/js/CharacterBuilder/components/SpeciesTraitList/index.ts
new file mode 100644
index 0000000..3f27b4d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/components/SpeciesTraitList/index.ts
@@ -0,0 +1,4 @@
+import SpeciesTraitList from "./SpeciesTraitList";
+
+export default SpeciesTraitList;
+export { SpeciesTraitList };
diff --git a/ddb_main/tools/js/CharacterBuilder/config/index.ts b/ddb_main/tools/js/CharacterBuilder/config/index.ts
new file mode 100644
index 0000000..4f7af5b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/config/index.ts
@@ -0,0 +1,8 @@
+import * as navigationConfig from "./navigation";
+
+export const BUILDER_DESKTOP_COMPONENT_START_WIDTH = 768;
+export const BUILDER_MQ_IS_MOBILE_SIZE = `(max-width: ${
+  BUILDER_DESKTOP_COMPONENT_START_WIDTH - 1
+}px)`;
+
+export { navigationConfig };
diff --git a/ddb_main/tools/js/CharacterBuilder/config/navigation.tsx b/ddb_main/tools/js/CharacterBuilder/config/navigation.tsx
new file mode 100644
index 0000000..7f00f28
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/config/navigation.tsx
@@ -0,0 +1,386 @@
+import React from "react";
+import { matchPath } from "react-router-dom";
+
+import {
+  FeatureFlagInfoState,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+// export interface RouteDefinition {
+//     key: string,
+//     type: string,
+//     path: string,
+//     Component: any,
+//     checkCanAccess: (routeDef:any, state:any) => boolean,
+// }
+import config from "~/config";
+import {
+  BuilderMethod,
+  NavigationType,
+  RouteKey,
+  SectionKey,
+} from "~/subApps/builder/constants";
+import { ClassChoose } from "~/subApps/builder/routes/ClassChoose";
+import { QuickBuild } from "~/subApps/builder/routes/QuickBuild";
+import { RandomBuild } from "~/subApps/builder/routes/RandomBuild";
+import { SpeciesChoose } from "~/subApps/builder/routes/SpeciesChoose";
+
+import AbilityScoresHelp from "../containers/pages/AbilityScoresHelp";
+import AbilityScoresManage from "../containers/pages/AbilityScoresManage";
+import ClassHelp from "../containers/pages/ClassHelp";
+import ClassesManage from "../containers/pages/ClassesManage";
+import DescriptionHelp from "../containers/pages/DescriptionHelp";
+import DescriptionManage from "../containers/pages/DescriptionManage";
+import EquipmentHelp from "../containers/pages/EquipmentHelp";
+import EquipmentManage from "../containers/pages/EquipmentManage";
+import HomeBasicInfo from "../containers/pages/HomeBasicInfo";
+import HomeHelp from "../containers/pages/HomeHelp";
+import SpeciesHelp from "../containers/pages/SpeciesHelp";
+import SpeciesManage from "../containers/pages/SpeciesManage";
+import WhatsNext from "../containers/pages/WhatsNext";
+import { NavigationUtils } from "../utils";
+
+const BASE_PATHNAME = config.basePathname;
+
+export const ROUTE_DEFINITIONS = {
+  [RouteKey.QUICK_BUILD]: {
+    key: RouteKey.QUICK_BUILD,
+    type: NavigationType.Page,
+    path: `${BASE_PATHNAME}/builder/quick-build`,
+    Component: QuickBuild,
+    getComponent: () => <QuickBuild />,
+    checkCanAccess: (routeDef, state) => {
+      return NavigationUtils.checkStdBuilderPageRequirements(routeDef, state);
+    },
+  },
+  [RouteKey.RANDOMIZE_BUILD]: {
+    key: RouteKey.RANDOMIZE_BUILD,
+    type: NavigationType.Page,
+    path: `${BASE_PATHNAME}/builder/randomize`,
+    Component: RandomBuild,
+    getComponent: () => <RandomBuild />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+  [RouteKey.HOME_BASIC_INFO]: {
+    key: RouteKey.HOME_BASIC_INFO,
+    type: NavigationType.Page,
+    path: `${BASE_PATHNAME}/:characterId/builder/home/basic`,
+    Component: HomeBasicInfo,
+    getComponent: () => <HomeBasicInfo />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+  [RouteKey.RACE_CHOOSE]: {
+    key: RouteKey.RACE_CHOOSE,
+    type: NavigationType.Page,
+    path: `${BASE_PATHNAME}/:characterId/builder/species/choose`,
+    Component: SpeciesChoose,
+    getComponent: () => <SpeciesChoose />,
+    checkCanAccess: (routeDef, state, dispatch) => {
+      if (!NavigationUtils.checkStdBuilderPageRequirements(routeDef, state)) {
+        return false;
+      }
+
+      if (rulesEngineSelectors.getRace(state) !== null) {
+        return false;
+      }
+
+      return true;
+    },
+  },
+  [RouteKey.RACE_MANAGE]: {
+    key: RouteKey.RACE_MANAGE,
+    type: NavigationType.Page,
+    path: `${BASE_PATHNAME}/:characterId/builder/species/manage`,
+    Component: SpeciesManage,
+    getComponent: () => <SpeciesManage />,
+    checkCanAccess: (routeDef, state, dispatch) => {
+      if (rulesEngineSelectors.getRace(state) === null) {
+        return false;
+      }
+
+      return true;
+    },
+  },
+  [RouteKey.CLASS_CHOOSE]: {
+    key: RouteKey.CLASS_CHOOSE,
+    type: NavigationType.Page,
+    path: `${BASE_PATHNAME}/:characterId/builder/class/choose`,
+    Component: ClassChoose,
+    getComponent: () => <ClassChoose />,
+    checkCanAccess: (routeDef, state, dispatch) => {
+      if (!NavigationUtils.checkStdBuilderPageRequirements(routeDef, state)) {
+        return false;
+      }
+
+      if (rulesEngineSelectors.getClasses(state).length > 0) {
+        return false;
+      }
+
+      return true;
+    },
+  },
+  [RouteKey.CLASS_MANAGE]: {
+    key: RouteKey.CLASS_MANAGE,
+    type: NavigationType.Page,
+    path: `${BASE_PATHNAME}/:characterId/builder/class/manage`,
+    Component: ClassesManage,
+    getComponent: () => <ClassesManage />,
+    checkCanAccess: (routeDef, state, dispatch) => {
+      if (!NavigationUtils.checkStdBuilderPageRequirements(routeDef, state)) {
+        return false;
+      }
+
+      if (rulesEngineSelectors.getClasses(state).length === 0) {
+        return false;
+      }
+
+      return true;
+    },
+  },
+  [RouteKey.ABILITY_SCORES_MANAGE]: {
+    key: RouteKey.ABILITY_SCORES_MANAGE,
+    type: NavigationType.Page,
+    path: `${BASE_PATHNAME}/:characterId/builder/ability-scores/manage`,
+    Component: AbilityScoresManage,
+    getComponent: () => <AbilityScoresManage />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+  [RouteKey.DESCRIPTION_MANAGE]: {
+    key: RouteKey.DESCRIPTION_MANAGE,
+    type: NavigationType.Page,
+    path: `${BASE_PATHNAME}/:characterId/builder/description/manage`,
+    Component: DescriptionManage,
+    getComponent: () => <DescriptionManage />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+  [RouteKey.EQUIPMENT_MANAGE]: {
+    key: RouteKey.EQUIPMENT_MANAGE,
+    type: NavigationType.Page,
+    path: `${BASE_PATHNAME}/:characterId/builder/equipment/manage`,
+    Component: EquipmentManage,
+    getComponent: () => <EquipmentManage />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+
+  [RouteKey.WHATS_NEXT]: {
+    key: RouteKey.WHATS_NEXT,
+    type: NavigationType.Page,
+    path: `${BASE_PATHNAME}/:characterId/builder/whats-next`,
+    Component: WhatsNext,
+    getComponent: () => <WhatsNext />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+
+  [RouteKey.HOME_HELP]: {
+    key: RouteKey.HOME_HELP,
+    type: NavigationType.HelpPage,
+    path: `${BASE_PATHNAME}/:characterId/builder/home/help`,
+    Component: HomeHelp,
+    getComponent: () => <HomeHelp />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+  [RouteKey.RACE_HELP]: {
+    key: RouteKey.RACE_HELP,
+    type: NavigationType.HelpPage,
+    path: `${BASE_PATHNAME}/:characterId/builder/species/help`,
+    Component: SpeciesHelp,
+    getComponent: () => <SpeciesHelp />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+  [RouteKey.CLASS_HELP]: {
+    key: RouteKey.CLASS_HELP,
+    type: NavigationType.HelpPage,
+    path: `${BASE_PATHNAME}/:characterId/builder/class/help`,
+    Component: ClassHelp,
+    getComponent: () => <ClassHelp />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+  [RouteKey.ABILITY_SCORES_HELP]: {
+    key: RouteKey.ABILITY_SCORES_HELP,
+    type: NavigationType.HelpPage,
+    path: `${BASE_PATHNAME}/:characterId/builder/ability-scores/help`,
+    Component: AbilityScoresHelp,
+    getComponent: () => <AbilityScoresHelp />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+  [RouteKey.DESCRIPTION_HELP]: {
+    key: RouteKey.DESCRIPTION_HELP,
+    type: NavigationType.HelpPage,
+    path: `${BASE_PATHNAME}/:characterId/builder/description/help`,
+    Component: DescriptionHelp,
+    getComponent: () => <DescriptionHelp />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+  [RouteKey.EQUIPMENT_HELP]: {
+    key: RouteKey.EQUIPMENT_HELP,
+    type: NavigationType.HelpPage,
+    path: `${BASE_PATHNAME}/:characterId/builder/equipment/help`,
+    Component: EquipmentHelp,
+    getComponent: () => <EquipmentHelp />,
+    checkCanAccess: (routeDef, state) =>
+      NavigationUtils.checkStdBuilderPageRequirements(routeDef, state),
+  },
+};
+export interface RouteDef {
+  key: string; // get the thing as an enum
+  type: typeof NavigationType;
+  path: string;
+  Component: React.ComponentType<any>;
+  getComponent: () => React.ComponentType<any>;
+  checkCanAccess?: (routeDef: RouteDef, state: any) => boolean;
+}
+
+export const getAllRouterRoutes = () => {
+  return Object.values(ROUTE_DEFINITIONS).map((routeDef: RouteDef) => ({
+    element: <routeDef.Component />,
+    path: routeDef.path,
+    routeDef,
+  }));
+};
+
+export const getRouteDef = (routeKey) => ROUTE_DEFINITIONS[routeKey];
+export const getRouteDefPath = (routeKey) => getRouteDef(routeKey).path;
+export const getRouteDefType = (routeKey) => getRouteDef(routeKey).type;
+
+export const NAVIGATION_DEFINITIONS = {
+  [BuilderMethod.QUICK]: [
+    {
+      type: NavigationType.Section,
+      key: SectionKey.QUICK_BUILD,
+      getLabel: () => "Quick Build",
+      routes: [getRouteDef(RouteKey.QUICK_BUILD)],
+    },
+  ],
+  [BuilderMethod.RANDOMIZE]: [
+    {
+      type: NavigationType.Section,
+      key: SectionKey.RANDOMIZE,
+      getLabel: () => "Randomize Build",
+      routes: [getRouteDef(RouteKey.RANDOMIZE_BUILD)],
+    },
+  ],
+  [BuilderMethod.STEP_BY_STEP]: [
+    {
+      type: NavigationType.Section,
+      key: SectionKey.HOME,
+      getLabel: () => "Home",
+      routes: [
+        getRouteDef(RouteKey.HOME_HELP),
+        getRouteDef(RouteKey.HOME_BASIC_INFO),
+      ],
+    },
+    {
+      type: NavigationType.Section,
+      key: SectionKey.CLASS,
+      getLabel: () => "1. Class",
+      routes: [
+        getRouteDef(RouteKey.CLASS_HELP),
+        getRouteDef(RouteKey.CLASS_CHOOSE),
+        getRouteDef(RouteKey.CLASS_MANAGE),
+      ],
+    },
+    {
+      type: NavigationType.Section,
+      key: SectionKey.DESCRIPTION,
+      getLabel: () => "2. Background",
+      routes: [
+        getRouteDef(RouteKey.DESCRIPTION_HELP),
+        getRouteDef(RouteKey.DESCRIPTION_MANAGE),
+      ],
+    },
+    {
+      type: NavigationType.Section,
+      key: SectionKey.RACE,
+      getLabel: () => "3. Species",
+      routes: [
+        getRouteDef(RouteKey.RACE_HELP),
+        getRouteDef(RouteKey.RACE_CHOOSE),
+        getRouteDef(RouteKey.RACE_MANAGE),
+      ],
+    },
+    {
+      type: NavigationType.Section,
+      key: SectionKey.ABILITY_SCORES,
+      getLabel: () => "4. Abilities",
+      routes: [
+        getRouteDef(RouteKey.ABILITY_SCORES_HELP),
+        getRouteDef(RouteKey.ABILITY_SCORES_MANAGE),
+      ],
+    },
+    {
+      type: NavigationType.Section,
+      key: SectionKey.EQUIPMENT,
+      getLabel: () => "5. Equipment",
+      routes: [
+        getRouteDef(RouteKey.EQUIPMENT_HELP),
+        getRouteDef(RouteKey.EQUIPMENT_MANAGE),
+      ],
+    },
+    {
+      type: NavigationType.Section,
+      key: SectionKey.WHATS_NEXT,
+      getLabel: () => "What's Next",
+      routes: [getRouteDef(RouteKey.WHATS_NEXT)],
+    },
+  ],
+};
+
+export function checkIsRouteInSection(testRouteDef, sectionRoutes) {
+  if (testRouteDef && sectionRoutes) {
+    return !!sectionRoutes.filter(
+      (routeDef) => routeDef.key === testRouteDef.key
+    ).length;
+  }
+
+  return false;
+}
+
+export function getNavigationSections(
+  builderMethod,
+  currentRouteDef,
+  featureFlags: FeatureFlagInfoState
+) {
+  const navConfig = getNavBuilderConfig(builderMethod, featureFlags);
+
+  return navConfig.map((section) => ({
+    ...section,
+    active: checkIsRouteInSection(currentRouteDef, section.routes),
+  }));
+}
+
+export function getNavBuilderConfig(
+  builderMethod,
+  featureFlags: FeatureFlagInfoState
+) {
+  if (builderMethod) {
+    return NAVIGATION_DEFINITIONS[builderMethod];
+  } else {
+    return [];
+  }
+}
+
+export function getCurrentRouteDef(currentPath) {
+  const routes = getAllRouterRoutes();
+
+  let matchedRouteDef: RouteDef | null = null;
+  routes.forEach((route) => {
+    const match = matchPath(route.path, currentPath);
+
+    if (match) {
+      matchedRouteDef = route.routeDef;
+    }
+  });
+
+  return matchedRouteDef;
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/AbilityScoreDiceManager/AbilityScoreDiceManager.tsx b/ddb_main/tools/js/CharacterBuilder/containers/AbilityScoreDiceManager/AbilityScoreDiceManager.tsx
new file mode 100644
index 0000000..942d4f0
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/AbilityScoreDiceManager/AbilityScoreDiceManager.tsx
@@ -0,0 +1,323 @@
+import React, { useCallback, useEffect, useMemo, useState } from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  DiceRollGroupManager,
+  LoadingPlaceholder,
+} from "@dndbeyond/character-components/es";
+import {
+  Ability,
+  AbilityUtils,
+  characterActions,
+  CharacterConfiguration,
+  DiceRolls,
+  HelperUtils,
+  HtmlSelectOption,
+  RollResultContract,
+  rulesEngineSelectors,
+  Constants,
+  RollGroupContract,
+} from "@dndbeyond/character-rules-engine/es";
+import {
+  DiceNotation,
+  DiceOperation,
+  DieTerm,
+  RollRequest,
+  RollRequestRoll,
+} from "@dndbeyond/dice";
+
+import { rollResultActions } from "../../../Shared/actions/rollResult";
+import * as toastActions from "../../../Shared/actions/toastMessage/actions";
+import DataLoadingStatusEnum from "../../../Shared/constants/DataLoadingStatusEnum";
+import { rollResultSelectors } from "../../../Shared/selectors";
+import {
+  RollResultUtils,
+  RollResultGroupsLookup,
+  RollStatusLookup,
+} from "../../../Shared/utils";
+import { BuilderAppState } from "../../typings";
+
+interface AbilityScore {
+  statId: number | null;
+  value: number | null;
+}
+interface AbilityScoreDiceManagerProps extends DispatchProp {
+  abilities: Array<Ability>;
+  configuration: CharacterConfiguration;
+  rollResultGroupsLookup: RollResultGroupsLookup;
+  simulatedGroupsLookup: RollResultGroupsLookup;
+  rollStatusLookup: RollStatusLookup;
+}
+const AbilityScoreDiceManager: React.FunctionComponent<
+  AbilityScoreDiceManagerProps
+> = ({
+  abilities,
+  configuration,
+  rollResultGroupsLookup,
+  simulatedGroupsLookup,
+  rollStatusLookup,
+  dispatch,
+}) => {
+  const SIMULATED_GROUP_COUNT: number = 1;
+  const SIMULATED_ROLL_RESULT_COUNT: number = 6;
+
+  const [loadingStatus, setLoadingStatus] = useState(
+    DataLoadingStatusEnum.NOT_INITIALIZED
+  );
+
+  const componentKey = useMemo<string | null>(
+    () =>
+      configuration.abilityScoreType
+        ? DiceRolls.generateAbilityManagerKey(configuration.abilityScoreType)
+        : null,
+    [configuration]
+  );
+
+  useEffect(() => {
+    if (componentKey) {
+      setLoadingStatus(DataLoadingStatusEnum.LOADING);
+      dispatch(
+        rollResultActions.rollResultGroupsLoad(
+          componentKey,
+          SIMULATED_GROUP_COUNT,
+          SIMULATED_ROLL_RESULT_COUNT
+        )
+      );
+    }
+  }, [setLoadingStatus]);
+
+  const diceRollGroups = useMemo<Array<RollGroupContract> | null>(() => {
+    if (!componentKey) {
+      return null;
+    }
+
+    let groups: Array<RollGroupContract> = [];
+    const simulatedGroups = RollResultUtils.getComponentOrderedGroups(
+      componentKey,
+      simulatedGroupsLookup
+    );
+    if (simulatedGroups.length) {
+      groups = simulatedGroups;
+    } else {
+      groups = RollResultUtils.getComponentOrderedGroups(
+        componentKey,
+        rollResultGroupsLookup
+      );
+    }
+
+    setLoadingStatus(DataLoadingStatusEnum.LOADED);
+
+    return groups.map((group) => {
+      return {
+        ...group,
+        rollResults: RollResultUtils.getGroupOrderedRollResults(
+          group.rollResults
+        ),
+      };
+    });
+  }, [
+    simulatedGroupsLookup,
+    rollResultGroupsLookup,
+    componentKey,
+    setLoadingStatus,
+  ]);
+
+  const diceRollRequest = useMemo<RollRequest>(() => {
+    const dieTerm: DieTerm = new DieTerm(4, "d6", DiceOperation.Max, 3);
+    const rollRequestRoll = new RollRequestRoll(new DiceNotation([dieTerm]));
+    return {
+      action: "Ability Score",
+      rolls: [rollRequestRoll],
+    };
+  }, []);
+
+  const abilityStatOptions = useMemo<Array<HtmlSelectOption>>(() => {
+    return abilities.map((ability) => {
+      return {
+        label: AbilityUtils.getName(ability),
+        value: String(AbilityUtils.getId(ability)),
+      };
+    });
+  }, [abilities]);
+
+  const handleRollError = useCallback((title: string): void => {
+    dispatch(
+      toastActions.toastError(title, "Please wait a few seconds and try again")
+    );
+  }, []);
+
+  const handleAddGroup = useCallback((): void => {
+    if (componentKey) {
+      dispatch(
+        rollResultActions.rollResultGroupCreate(
+          componentKey,
+          SIMULATED_ROLL_RESULT_COUNT
+        )
+      );
+    }
+  }, [componentKey]);
+
+  const handleRemoveGroup = useCallback(
+    (groupKey: string, nextGroupKey: string | null): void => {
+      if (componentKey) {
+        dispatch(
+          rollResultActions.rollResultGroupDestroy(
+            componentKey,
+            groupKey,
+            nextGroupKey
+          )
+        );
+      }
+    },
+    [componentKey]
+  );
+
+  const handleUpdateGroupRolls = useCallback(
+    (groupKey: string, rollResults: Array<RollResultContract>): void => {
+      if (componentKey) {
+        dispatch(
+          rollResultActions.rollResultGroupDiceRollsSet(
+            componentKey,
+            groupKey,
+            rollResults
+          )
+        );
+      }
+    },
+    [componentKey]
+  );
+
+  const handleSetScores = useCallback(
+    (groupKey: string, rollResults: Array<RollResultContract>): void => {
+      const abilityScores: Array<AbilityScore> = rollResults
+        .filter(
+          (roll) => roll.assignedValue !== null && roll.rollTotal !== null
+        )
+        .map((roll) => ({
+          statId: roll.assignedValue
+            ? HelperUtils.parseInputInt(roll.assignedValue)
+            : null,
+          value: roll.rollTotal,
+        }));
+
+      abilityScores.forEach((score) => {
+        // Flash ability score input if it was changed
+        const abilityScoreElement: HTMLElement | null = document.querySelector(
+          `.ability-score-manager [data-stat-id="${score.statId}"] input`
+        );
+        if (abilityScoreElement !== null) {
+          abilityScoreElement.classList.add("builder-field-update-animation");
+          setTimeout(() => {
+            abilityScoreElement.classList.remove(
+              "builder-field-update-animation"
+            );
+          }, 1000);
+        }
+
+        if (score.statId) {
+          dispatch(
+            characterActions.abilityScoreSet(
+              score.statId,
+              Constants.AbilityScoreStatTypeEnum.BASE,
+              score.value
+            )
+          );
+        }
+      });
+    },
+    []
+  );
+
+  const handleResetGroup = useCallback(
+    (groupKey: string, rollResults: Array<RollResultContract>) => {
+      rollResults = rollResults.map((rollResult: RollResultContract) => ({
+        ...rollResult,
+        rollTotal: null,
+        rollValues: [],
+        assignedValue: null,
+      }));
+
+      if (componentKey) {
+        dispatch(
+          rollResultActions.rollResultGroupReset(
+            componentKey,
+            groupKey,
+            rollResults
+          )
+        );
+      }
+    },
+    [componentKey]
+  );
+
+  const handleDiceRollSet = useCallback(
+    (
+      rollKey: string,
+      properties: Omit<Partial<RollResultContract>, "rollKey">,
+      nextRollKey: string | null
+    ) => {
+      if (componentKey) {
+        dispatch(
+          rollResultActions.rollResultDiceRollSet(
+            rollKey,
+            properties,
+            nextRollKey
+          )
+        );
+      }
+    },
+    [componentKey]
+  );
+
+  const handleSetRollStatus = useCallback(
+    (rollKey: string, status: DataLoadingStatusEnum) => {
+      dispatch(rollResultActions.rollResultDiceRollStatusSet(rollKey, status));
+    },
+    [rollStatusLookup]
+  );
+
+  if (!componentKey || !diceRollGroups?.length) {
+    return null;
+  }
+
+  return (
+    <div className="ct-ability-score-dice-manager">
+      {loadingStatus !== DataLoadingStatusEnum.LOADED ? (
+        <LoadingPlaceholder label="Loading Dice Groups" />
+      ) : (
+        <DiceRollGroupManager
+          componentKey={componentKey}
+          groups={diceRollGroups}
+          showAddGroupButton={true}
+          onAddGroup={handleAddGroup}
+          options={abilityStatOptions}
+          diceRollRequest={diceRollRequest}
+          exclusiveOptions={true}
+          confirmButtonText="Apply Ability Scores"
+          onConfirm={handleSetScores}
+          onUpdateGroup={handleUpdateGroupRolls}
+          onRollError={handleRollError}
+          onRemoveGroup={handleRemoveGroup}
+          onResetGroup={handleResetGroup}
+          onUpdateDiceRoll={handleDiceRollSet}
+          onSetRollStatus={handleSetRollStatus}
+          rollStatusLookup={rollStatusLookup}
+        />
+      )}
+    </div>
+  );
+};
+
+function mapStateToProps(state: BuilderAppState) {
+  return {
+    configuration: rulesEngineSelectors.getCharacterConfiguration(state),
+    abilities: rulesEngineSelectors.getAbilities(state),
+    rollStatusLookup: rollResultSelectors.getRollStatusLookup(state),
+    rollResultGroupsLookup:
+      rollResultSelectors.getRollResultComponentGroupsLookup(state),
+    simulatedGroupsLookup:
+      rollResultSelectors.getRollResultComponentSimulatedGroupsLookup(state),
+  };
+}
+
+export default connect(mapStateToProps)(AbilityScoreDiceManager);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/AbilityScoreTypeChooser/AbilityScoreTypeChooser.tsx b/ddb_main/tools/js/CharacterBuilder/containers/AbilityScoreTypeChooser/AbilityScoreTypeChooser.tsx
new file mode 100644
index 0000000..ce00cf7
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/AbilityScoreTypeChooser/AbilityScoreTypeChooser.tsx
@@ -0,0 +1,83 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { Select } from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  CharacterConfiguration,
+  Constants,
+  HelperUtils,
+  HtmlSelectOption,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { BuilderAppState } from "../../typings";
+
+interface Props extends DispatchProp {
+  configuration: CharacterConfiguration;
+  initialOptionRemoved: boolean;
+  onScoreMethodChange?: (value: number | null) => void;
+  hideTilAbilityScoreTypeSet: boolean;
+}
+class AbilityScoreTypeChooser extends React.PureComponent<Props> {
+  static defaultProps = {
+    initialOptionRemoved: true,
+    hideTilAbilityScoreTypeSet: false,
+  };
+
+  handleScoreMethodChange = (value: string): void => {
+    const { dispatch, onScoreMethodChange } = this.props;
+
+    const parsedValue = HelperUtils.parseInputInt(value);
+
+    dispatch(characterActions.abilityScoreTypeSetRequest(parsedValue));
+
+    if (onScoreMethodChange) {
+      onScoreMethodChange(parsedValue);
+    }
+  };
+
+  render() {
+    const { configuration, initialOptionRemoved, hideTilAbilityScoreTypeSet } =
+      this.props;
+
+    const scoreMethodOptions: Array<HtmlSelectOption> = [
+      {
+        label: "Standard Array",
+        value: Constants.AbilityScoreTypeEnum.STANDARD_ARRAY,
+      },
+      {
+        label: "Manual/Rolled",
+        value: Constants.AbilityScoreTypeEnum.MANUAL,
+      },
+      {
+        label: "Point Buy",
+        value: Constants.AbilityScoreTypeEnum.POINT_BUY,
+      },
+    ];
+
+    if (hideTilAbilityScoreTypeSet && configuration.abilityScoreType === null) {
+      return null;
+    }
+
+    return (
+      <div className="ability-score-type-chooser">
+        <Select
+          options={scoreMethodOptions}
+          onChange={this.handleScoreMethodChange}
+          initialOptionRemoved={initialOptionRemoved}
+          value={configuration.abilityScoreType}
+          placeholder="-- Choose a Generation Method --"
+        />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: BuilderAppState) {
+  return {
+    configuration: rulesEngineSelectors.getCharacterConfiguration(state),
+  };
+}
+
+export default connect(mapStateToProps)(AbilityScoreTypeChooser);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/AbilityScoreTypeChooser/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/AbilityScoreTypeChooser/index.ts
new file mode 100644
index 0000000..ca57f8b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/AbilityScoreTypeChooser/index.ts
@@ -0,0 +1,4 @@
+import AbilityScoreTypeChooser from "./AbilityScoreTypeChooser";
+
+export default AbilityScoreTypeChooser;
+export { AbilityScoreTypeChooser };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilder/CharacterBuilder.tsx b/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilder/CharacterBuilder.tsx
new file mode 100644
index 0000000..794c9cd
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilder/CharacterBuilder.tsx
@@ -0,0 +1,513 @@
+import React, { useState } from "react";
+import { connect, DispatchProp, useDispatch } from "react-redux";
+import { Route, Routes, useLocation, useNavigate } from "react-router-dom";
+
+import { CharacterAvatarPortrait } from "@dndbeyond/character-components/es";
+import {
+  characterSelectors,
+  CharacterStatusSlug,
+} from "@dndbeyond/character-rules-engine";
+import {
+  DecorationInfo,
+  DecorationUtils,
+  FormatUtils,
+  rulesEngineSelectors,
+  characterActions,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Link } from "~/components/Link";
+import { NotificationSystem } from "~/components/NotificationSystem";
+import config from "~/config";
+import { useFeatureFlags } from "~/contexts/FeatureFlag";
+import { useHeadContext } from "~/contexts/Head";
+import { BuilderMethod } from "~/subApps/builder/constants";
+import { ClassProvider } from "~/subApps/builder/contexts/Class";
+import { ModalManagerProvider } from "~/subApps/builder/contexts/ModalManager";
+import { SpeciesProvider } from "~/subApps/builder/contexts/Species";
+import { BuilderTypeChoicePage } from "~/subApps/builder/routes/BuilderTypeChoicePage";
+
+import { appEnvActions, toastMessageActions } from "../../../Shared/actions";
+import LoadingBlocker from "../../../Shared/components/LoadingBlocker";
+import { BuilderLinkButton } from "../../../Shared/components/common/LinkButton";
+import AppErrorTypeEnum from "../../../Shared/constants/AppErrorTypeEnum";
+import UserRoles from "../../../Shared/constants/UserRoles";
+import { DiceContainer } from "../../../Shared/containers/DiceContainer";
+import {
+  appEnvSelectors,
+  appInfoSelectors,
+  toastMessageSelectors,
+} from "../../../Shared/selectors";
+import { AppInfoErrorState } from "../../../Shared/stores/typings";
+import { builderActions } from "../../actions/builder";
+import { BUILDER_MQ_IS_MOBILE_SIZE } from "../../config";
+import { ROUTE_DEFINITIONS } from "../../config/navigation";
+import { builderSelectors } from "../../selectors";
+import { BuilderAppState } from "../../typings";
+import { getUrlWithParams } from "../../utils/navigationUtils";
+import NavigationSections from "../NavigationSections";
+import SynchronousBlocker from "../SynchronousBlocker";
+import TodoNavigation from "../TodoNavigation";
+import styles from "./styles.module.css";
+
+const BASE_PATHNAME = config.basePathname;
+
+interface Props extends DispatchProp {
+  appError: AppInfoErrorState | null;
+  toastMessages: any;
+  builderMethod: string | null;
+  isCharacterLoading: boolean;
+  isCharacterLoaded: boolean;
+  isMobile: boolean;
+  name: string | null;
+  username: string | null;
+  redirect: string;
+  characterId: number | null;
+  diceEnabled: boolean;
+  decorationInfo: DecorationInfo;
+  canEdit: boolean;
+  isReadonly: boolean;
+  userRoles: string[] | null | undefined;
+  characterStatus: string | null;
+}
+
+const RenderAuthError: React.FC<{ appError: Props["appError"] }> | null = ({
+  appError,
+}) => {
+  if (appError === null) {
+    return null;
+  }
+
+  let contentNode: React.ReactNode;
+  switch (appError.type) {
+    case AppErrorTypeEnum.AUTH_MISSING:
+      let signInUrl: string = `/sign-in?returnUrl=${encodeURIComponent(
+        window.location.pathname
+      )}`;
+      contentNode = (
+        <React.Fragment>
+          <p>
+            You are no longer signed into D&D Beyond. Go to the{" "}
+            <Link href={signInUrl}>Sign In page</Link> to continue the
+            adventure!
+          </p>
+        </React.Fragment>
+      );
+      break;
+
+    case AppErrorTypeEnum.API_FAIL:
+      contentNode = (
+        <React.Fragment>
+          <p>
+            Whoops! We rolled a 1 on our API check. We're heading into town to
+            visit the blacksmith for repairs.
+          </p>
+          <p>Try again after a Short Rest.</p>
+        </React.Fragment>
+      );
+      break;
+
+    case AppErrorTypeEnum.API_DATA_FAIL:
+      contentNode = (
+        <React.Fragment>
+          <p>
+            Whoops! We rolled a 1 on our API Data check. We're heading into town
+            to visit the blacksmith for repairs.
+          </p>
+          <p>Try again after a Short Rest.</p>
+        </React.Fragment>
+      );
+      break;
+
+    case AppErrorTypeEnum.AUTH_FAIL:
+      contentNode = (
+        <React.Fragment>
+          <p>
+            Whoops! We rolled a 1 on our Authentication check. We're heading
+            into town to visit the blacksmith for repairs.
+          </p>
+          <p>Try again after a Short Rest.</p>
+        </React.Fragment>
+      );
+      break;
+
+    case AppErrorTypeEnum.ACCESS_DENIED:
+      contentNode = (
+        <React.Fragment>
+          <p>You don't have access to this page.</p>
+          <p>
+            If you are trying to access a character sheet, make sure its privacy
+            setting is configured correctly for you to access it.
+          </p>
+          <p>
+            It is also possible that you are trying to enter the 403rd level of
+            the endless dungeon and the ancient dragon Rylzrayrth is rising up
+            to block your path...
+          </p>
+        </React.Fragment>
+      );
+      break;
+    case AppErrorTypeEnum.NOT_FOUND:
+      appError.errorId = null;
+      contentNode = (
+        <>
+          <p>
+            We live in a world of uncertainty. But certainly, the page you were
+            looking for isn’t here. Perhaps this halfling has stolen it and
+            hidden it in another place. Try searching for what you were looking
+            for in another realm.
+          </p>
+        </>
+      );
+      break;
+
+    case AppErrorTypeEnum.GENERIC:
+    default:
+      contentNode = (
+        <React.Fragment>
+          <p>
+            Whoops! We rolled a 1 on our check. We're heading into town to visit
+            the blacksmith for repairs.
+          </p>
+          <p>Try again after a Short Rest.</p>
+        </React.Fragment>
+      );
+      break;
+  }
+
+  return (
+    <div className="ct-character-sheet--failed">
+      <div
+        className={[
+          "ct-character-sheet__failed",
+          `ct-character-sheet__failed--${FormatUtils.slugify(appError.type)}`,
+        ].join(" ")}
+      >
+        <div className="ct-character-sheet__failed-content">
+          {contentNode}
+          {appError.errorId && (
+            <React.Fragment>
+              <div className="ct-character-sheet__failed-code">
+                <div className="ct-character-sheet__failed-code-label">
+                  Error Code
+                </div>
+                <div className="ct-character-sheet__failed-code-value">
+                  {appError.errorId}
+                </div>
+              </div>
+              <div className="ct-character-sheet__failed-code">
+                <div className="ct-character-sheet__failed-code-label">
+                  Version
+                </div>
+                <div className="ct-character-sheet__failed-code-value">
+                  {config.version}
+                </div>
+              </div>
+            </React.Fragment>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+};
+
+const checkForMessages = (
+  toastMessages,
+  dispatch,
+  notificationSystem
+): void => {
+  Object.keys(toastMessages).forEach((messageId) => {
+    if (!notificationSystem) {
+      return;
+    }
+
+    const message = toastMessages[messageId];
+    const { autoDismiss, dismissible, position } = message.meta;
+
+    if (!notificationSystem.current) {
+      return;
+    }
+
+    notificationSystem.current.addNotification({
+      title: message.payload.title,
+      message: message.payload.message,
+      level: message.meta.level,
+      autoDismiss,
+      dismissible,
+      position,
+      uid: messageId,
+      onRemove: () => dispatch(toastMessageActions.removeToast(messageId)),
+    });
+  });
+};
+
+const CharacterBuilder: React.FC<Props> | null = ({
+  appError,
+  toastMessages,
+  builderMethod,
+  isCharacterLoading,
+  isCharacterLoaded,
+  isMobile,
+  name,
+  username,
+  redirect,
+  characterId,
+  diceEnabled,
+  decorationInfo,
+  canEdit,
+  isReadonly,
+  userRoles,
+  characterStatus,
+}) => {
+  let mobileMql: MediaQueryList | null = null;
+  // useImperativeHandle is hard to type when we us our own context this will just disapear
+  const notificationSystem = React.createRef<any>();
+  const dispatch = useDispatch();
+  const navigate = useNavigate();
+  const { pathname } = useLocation();
+  const { setTitle } = useHeadContext();
+  const [isLoaded, setIsLoaded] = useState(false);
+
+  const { featureFlags } = useFeatureFlags();
+
+  React.useEffect(() => {
+    if (characterId !== null && !isLoaded) {
+      dispatch(builderActions.characterLoadRequest());
+      setIsLoaded(true);
+    }
+    mobileMql = window.matchMedia(BUILDER_MQ_IS_MOBILE_SIZE);
+    dispatch(appEnvActions.mobileSet(mobileMql.matches));
+    mobileMql.onchange = (e) => {
+      dispatch(appEnvActions.mobileSet(e.matches));
+    };
+  }, [characterId]);
+
+  React.useEffect(() => {
+    if (
+      isLoaded &&
+      characterId !== null &&
+      characterStatus === CharacterStatusSlug.PREMADE
+    ) {
+      const isLorekeeper =
+        userRoles?.includes(UserRoles.LOREKEEPER) ||
+        userRoles?.includes(UserRoles.ADMIN);
+      isLorekeeper && dispatch(characterActions.premadeInfoGet(characterId));
+    }
+  }, [characterId, characterStatus, isLoaded, userRoles]);
+
+  React.useEffect(() => {
+    //check for isCharacterLoaded and canEdit to set isReadonly and redirect, or is Random build to set isReadonly
+    if (isCharacterLoaded) {
+      dispatch(appEnvActions.dataSet({ isReadonly: !canEdit }));
+      if (!canEdit) {
+        navigate(getUrlWithParams(`${BASE_PATHNAME}/${characterId}`));
+      }
+    } else if (builderMethod && builderMethod === BuilderMethod.RANDOMIZE) {
+      dispatch(appEnvActions.dataSet({ isReadonly: !canEdit }));
+    }
+  }, [
+    isCharacterLoaded,
+    canEdit,
+    characterId,
+    navigate,
+    dispatch,
+    builderMethod,
+  ]);
+
+  React.useEffect(() => {
+    checkForMessages(toastMessages, dispatch, notificationSystem);
+  });
+
+  React.useLayoutEffect(() => {
+    const toolsTarget = document.getElementById("character-tools-target");
+    if (toolsTarget) {
+      toolsTarget.style.zIndex = "0";
+    }
+    return () => {
+      const toolsTarget = document.getElementById("character-tools-target");
+      if (toolsTarget) {
+        toolsTarget.style.zIndex = "auto";
+      }
+    };
+  });
+
+  React.useEffect(() => {
+    setTitle("Character Builder");
+  }, [setTitle]);
+
+  if (appError !== null) {
+    return <RenderAuthError appError={appError} />;
+  }
+
+  let clsNames: Array<string> = ["character-builder"];
+  if (builderMethod) {
+    clsNames.push(`character-builder-${FormatUtils.slugify(builderMethod)}`);
+  }
+
+  // useEffect above handles redirect but this blocks UI from showing
+  if (isReadonly && isCharacterLoaded) {
+    return null;
+  }
+
+  if (!isCharacterLoading && builderMethod === null) {
+    let anonNode: React.ReactNode;
+    if (!username) {
+      anonNode = (
+        <div className="character-builder-anon">
+          <div className="character-builder-anon-heading">
+            Start Your Adventure
+          </div>
+          <div className="character-builder-anon-content">
+            <p>
+              You need to be signed in to a D&amp;D Beyond account in order to
+              save characters. You can use your character sheet anywhere, on any
+              device.
+            </p>
+          </div>
+          <div className="character-builder-anon-actions">
+            <BuilderLinkButton size="oversized" url={redirect}>
+              Sign in or Create Account
+            </BuilderLinkButton>
+          </div>
+        </div>
+      );
+    }
+
+    return (
+      <Routes>
+        <Route
+          path="/"
+          element={
+            <div className="character-builder">
+              <SynchronousBlocker />
+              <div className="character-builder-inner">
+                {anonNode}
+                {<BuilderTypeChoicePage isEnabled={!!username} />}
+              </div>
+            </div>
+          }
+        ></Route>
+      </Routes>
+    );
+  }
+
+  clsNames.push(styles.characterBuilder);
+
+  if (diceEnabled) {
+    clsNames.push("character-builder--dice-enabled");
+  }
+
+  clsNames.push(styles.characterBuilder);
+
+  return (
+    <Routes>
+      <Route
+        path="/*"
+        element={
+          <div className={clsNames.join(" ")}>
+            {(characterId !== null || isCharacterLoading) && (
+              <LoadingBlocker isFinished={isCharacterLoaded} />
+            )}
+            {!isCharacterLoading && (
+              <ModalManagerProvider>
+                <ClassProvider>
+                  <SpeciesProvider>
+                    <SynchronousBlocker />
+                    <div className="character-builder-inner">
+                      {builderMethod === BuilderMethod.STEP_BY_STEP && (
+                        <React.Fragment>
+                          {!isMobile && (
+                            <div className="character-builder-page-header">
+                              <h1 className="character-builder-page-header-heading">
+                                Character Builder
+                              </h1>
+                              {name && (
+                                <div className="character-builder-page-header-summary">
+                                  <CharacterAvatarPortrait
+                                    className={
+                                      "character-builder-page-header-avatar"
+                                    }
+                                    avatarUrl={
+                                      DecorationUtils.getAvatarInfo(
+                                        decorationInfo
+                                      ).avatarUrl
+                                    }
+                                  />
+                                  <div className="character-builder-page-header-name">
+                                    {name}
+                                  </div>
+                                </div>
+                              )}
+                            </div>
+                          )}
+                          <NavigationSections
+                            pathname={pathname}
+                            characterId={characterId}
+                          />
+                          <TodoNavigation
+                            pathname={pathname}
+                            characterId={characterId}
+                          />
+                        </React.Fragment>
+                      )}
+                      <Routes>
+                        {Object.values(ROUTE_DEFINITIONS).map(
+                          ({ key, path, getComponent }) => {
+                            const Component = getComponent(featureFlags);
+                            // console.log('COMPONENT', Component);
+                            return (
+                              <Route
+                                key={key}
+                                path={path
+                                  .replace(`${BASE_PATHNAME}/builder/`, "")
+                                  .replace(
+                                    `${BASE_PATHNAME}/:characterId/builder/`,
+                                    ""
+                                  )}
+                                element={Component}
+                              />
+                            );
+                          }
+                        )}
+                        <Route
+                          path="/"
+                          element={<BuilderTypeChoicePage />}
+                        ></Route>
+                      </Routes>
+                    </div>
+                  </SpeciesProvider>
+                </ClassProvider>
+              </ModalManagerProvider>
+            )}
+            <NotificationSystem ref={notificationSystem} />
+            {diceEnabled && !isReadonly ? (
+              <DiceContainer canShow={isCharacterLoaded} />
+            ) : null}
+          </div>
+        }
+      ></Route>
+    </Routes>
+  );
+};
+
+function mapStateToProps(state: BuilderAppState) {
+  return {
+    toastMessages: toastMessageSelectors.getToastMessages(state),
+    builderMethod: builderSelectors.getBuilderMethod(state),
+    isCharacterLoading: builderSelectors.getIsCharacterLoading(state),
+    isCharacterLoaded: builderSelectors.getIsCharacterLoaded(state),
+    isMobile: appEnvSelectors.getIsMobile(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    name: rulesEngineSelectors.getName(state),
+    decorationInfo: rulesEngineSelectors.getDecorationInfo(state),
+    canEdit: rulesEngineSelectors.getCanEdit(state),
+    username: appEnvSelectors.getUsername(state),
+    redirect: appEnvSelectors.getRedirect(state),
+    appError: appInfoSelectors.getError(state),
+    characterId: appEnvSelectors.getCharacterId(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+    userRoles: appEnvSelectors.getUserRoles(state),
+    characterStatus: characterSelectors.getStatusSlug(state),
+  };
+}
+
+export default connect(mapStateToProps)(CharacterBuilder);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilder/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilder/index.ts
new file mode 100644
index 0000000..1e50554
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilder/index.ts
@@ -0,0 +1,4 @@
+import CharacterBuilder from "./CharacterBuilder";
+
+export default CharacterBuilder;
+export { CharacterBuilder };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilderContainer/CharacterBuilderContainer.tsx b/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilderContainer/CharacterBuilderContainer.tsx
new file mode 100644
index 0000000..51c7971
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilderContainer/CharacterBuilderContainer.tsx
@@ -0,0 +1,38 @@
+import { useLayoutEffect } from "react";
+
+import { BuilderProvider } from "~/subApps/builder/contexts/Builder";
+
+import ErrorBoundary from "../../../Shared/components/ErrorBoundary";
+import CharacterBuilder from "../CharacterBuilder";
+
+export function CharacterBuilderContainer(props) {
+  useLayoutEffect(() => {
+    document
+      .getElementsByTagName("body")[0]
+      .classList.add(
+        "site",
+        "body-rpgcharacterbuilder",
+        "site-dndbeyond",
+        "body-rpgcharacter"
+      );
+    return () => {
+      document
+        .getElementsByTagName("body")[0]
+        .classList.remove(
+          "site",
+          "body-rpgcharacterbuilder",
+          "site-dndbeyond",
+          "body-rpgcharacter"
+        );
+    };
+  }, []);
+  return (
+    <BuilderProvider>
+      <ErrorBoundary>
+        <CharacterBuilder />
+      </ErrorBoundary>
+    </BuilderProvider>
+  );
+}
+
+export default CharacterBuilderContainer;
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilderContainer/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilderContainer/index.ts
new file mode 100644
index 0000000..53ebe34
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/CharacterBuilderContainer/index.ts
@@ -0,0 +1,4 @@
+import CharacterBuilderContainer from "./CharacterBuilderContainer";
+
+export default CharacterBuilderContainer;
+export { CharacterBuilderContainer };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/HelpTextManager/HelpTextManager.tsx b/ddb_main/tools/js/CharacterBuilder/containers/HelpTextManager/HelpTextManager.tsx
new file mode 100644
index 0000000..0b7fe2f
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/HelpTextManager/HelpTextManager.tsx
@@ -0,0 +1,79 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  CharacterConfiguration,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { builderActions } from "../../actions";
+import { BuilderAppState } from "../../typings";
+
+interface Props extends DispatchProp {
+  configuration: CharacterConfiguration;
+}
+interface State {
+  enabled: boolean;
+}
+class HelpTextManager extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    const { configuration } = props;
+
+    this.state = {
+      enabled:
+        configuration.showHelpText === null
+          ? false
+          : configuration.showHelpText,
+    };
+  }
+
+  componentDidUpdate(prevProps: Props, prevState: State) {
+    const { configuration } = this.props;
+
+    this.setState({
+      enabled:
+        configuration.showHelpText === null
+          ? false
+          : configuration.showHelpText,
+    });
+  }
+
+  handleHelpTextChange = (evt: React.MouseEvent): void => {
+    const { dispatch } = this.props;
+    const { enabled } = this.state;
+
+    const isEnabled = !enabled;
+    this.setState({
+      enabled: isEnabled,
+    });
+
+    dispatch(builderActions.showHelpTextSet(isEnabled));
+  };
+
+  render() {
+    const { enabled } = this.state;
+
+    let classNames: Array<string> = ["help-text-manager"];
+    if (enabled) {
+      classNames.push("help-text-manager-enabled");
+    } else {
+      classNames.push("help-text-manager-disabled");
+    }
+
+    return (
+      <div className={classNames.join(" ")} onClick={this.handleHelpTextChange}>
+        <div className="help-text-manager-icon" />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: BuilderAppState) {
+  return {
+    configuration: rulesEngineSelectors.getCharacterConfiguration(state),
+  };
+}
+
+export default connect(mapStateToProps)(HelpTextManager);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/HelpTextManager/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/HelpTextManager/index.ts
new file mode 100644
index 0000000..618b436
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/HelpTextManager/index.ts
@@ -0,0 +1,4 @@
+import HelpTextManager from "./HelpTextManager";
+
+export default HelpTextManager;
+export { HelpTextManager };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/NavigationSections/NavigationSections.tsx b/ddb_main/tools/js/CharacterBuilder/containers/NavigationSections/NavigationSections.tsx
new file mode 100644
index 0000000..9b992a3
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/NavigationSections/NavigationSections.tsx
@@ -0,0 +1,234 @@
+import React from "react";
+import { connect } from "react-redux";
+import SwipeableViews from "react-swipeable-views";
+
+import { FeatureFlagContext } from "@dndbeyond/character-components/es";
+import {
+  characterSelectors,
+  CharacterStatusSlug,
+  featureFlagInfoSelectors,
+  FormatUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Link } from "~/components/Link";
+import { PremadeCharacterEditStatus } from "~/components/PremadeCharacterEditStatus";
+
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { MobileMessengerUtils } from "../../../Shared/utils";
+import { navigationConfig } from "../../config";
+import { builderEnvSelectors, builderSelectors } from "../../selectors";
+import { BuilderAppState } from "../../typings";
+import HelpTextManager from "../HelpTextManager";
+
+interface Props {
+  characterId: number | null;
+  builderMethod: string | null;
+  sections: Array<any>;
+  firstAvailableSectionRoutes: any;
+  isCharacterSheetReady: boolean;
+  characterSheetUrl: string;
+  activeSectionIdx: number;
+  isMobile: boolean;
+  characterStatus: CharacterStatusSlug | null;
+  isReadonly: boolean;
+}
+class NavigationSections extends React.PureComponent<Props> {
+  handleSheetShowClick = () => {
+    const { characterId } = this.props;
+
+    if (characterId !== null) {
+      MobileMessengerUtils.sendMessage(
+        MobileMessengerUtils.createShowCharacterSheetMessage(characterId)
+      );
+    }
+  };
+
+  renderNonMobileUi = (): React.ReactNode => {
+    const {
+      characterId,
+      sections,
+      firstAvailableSectionRoutes,
+      isCharacterSheetReady,
+      characterSheetUrl,
+    } = this.props;
+
+    let classNames: Array<string> = ["builder-sections-sheet"];
+    if (isCharacterSheetReady) {
+      classNames.push("builder-sections-sheet-ready");
+    } else {
+      classNames.push("builder-sections-sheet-disabled");
+    }
+
+    return (
+      <div className="builder-sections builder-sections-large">
+        <HelpTextManager />
+        <div className={classNames.join(" ")}>
+          {isCharacterSheetReady ? (
+            <Link
+              className="builder-sections-sheet-icon"
+              href={characterSheetUrl}
+              onClick={this.handleSheetShowClick}
+              useRouter
+            />
+          ) : (
+            <div className="builder-sections-sheet-icon" />
+          )}
+        </div>
+        <div className="builder-sections-large-routes">
+          {sections.map((section) => {
+            const firstRoute = firstAvailableSectionRoutes[section.key];
+            let clsNames: Array<string> = [
+              "builder-sections-link",
+              `builder-sections-${FormatUtils.slugify(section.key)}`,
+            ];
+            if (section.active) {
+              clsNames.push("builder-sections-link-active");
+            }
+            return (
+              <div className="builder-sections-view" key={section.key}>
+                <Link
+                  href={firstRoute.path.replace(":characterId", characterId)}
+                  className={clsNames.join(" ")}
+                  useRouter
+                >
+                  <FeatureFlagContext.Consumer>
+                    {(featureFlags) => section.getLabel(featureFlags)}
+                  </FeatureFlagContext.Consumer>
+                </Link>
+              </div>
+            );
+          })}
+        </div>
+      </div>
+    );
+  };
+
+  renderMobileUi = (): React.ReactNode => {
+    const {
+      characterId,
+      sections,
+      firstAvailableSectionRoutes,
+      activeSectionIdx,
+      isCharacterSheetReady,
+      characterSheetUrl,
+    } = this.props;
+
+    const scrollbarStyles: React.CSSProperties = {
+      padding: "0 37.5%",
+    };
+
+    let classNames = ["builder-sections-sheet"];
+    if (isCharacterSheetReady) {
+      classNames.push("builder-sections-sheet-ready");
+    } else {
+      classNames.push("builder-sections-sheet-disabled");
+    }
+
+    return (
+      <div className="builder-sections builder-sections-small">
+        <HelpTextManager />
+        <div className={classNames.join(" ")}>
+          {isCharacterSheetReady ? (
+            <Link
+              className="builder-sections-sheet-icon"
+              href={characterSheetUrl}
+              onClick={this.handleSheetShowClick}
+              useRouter
+            />
+          ) : (
+            <div className="builder-sections-sheet-icon" />
+          )}
+        </div>
+        <SwipeableViews
+          index={activeSectionIdx}
+          style={scrollbarStyles}
+          className="builder-sections-views"
+          ignoreNativeScroll={true}
+        >
+          {sections.map((section) => {
+            const firstRoute = firstAvailableSectionRoutes[section.key];
+            let clsNames: Array<string> = [
+              "builder-sections-link",
+              `builder-sections-${FormatUtils.slugify(section.key)}`,
+            ];
+            if (section.active) {
+              clsNames.push("builder-sections-link-active");
+            }
+            return (
+              <div className="builder-sections-view" key={section.key}>
+                <Link
+                  href={firstRoute.path.replace(":characterId", characterId)}
+                  className={clsNames.join(" ")}
+                  useRouter
+                >
+                  <FeatureFlagContext.Consumer>
+                    {(featureFlags) => section.getLabel(featureFlags)}
+                  </FeatureFlagContext.Consumer>
+                </Link>
+              </div>
+            );
+          })}
+        </SwipeableViews>
+      </div>
+    );
+  };
+
+  render() {
+    const { builderMethod, isMobile, characterStatus, isReadonly } = this.props;
+
+    if (builderMethod === null) {
+      return null;
+    }
+
+    return isMobile ? (
+      <>
+        {this.renderMobileUi()}
+        <PremadeCharacterEditStatus
+          characterStatus={characterStatus}
+          isReadonly={isReadonly}
+          isBuilderView
+        />
+      </>
+    ) : (
+      <>
+        {this.renderNonMobileUi()}
+        <PremadeCharacterEditStatus
+          characterStatus={characterStatus}
+          isReadonly={isReadonly}
+          isBuilderView
+        />
+      </>
+    );
+  }
+}
+
+function mapStateToProps(state: BuilderAppState, ownProps) {
+  const currentPath = ownProps.pathname;
+  const sections = navigationConfig.getNavigationSections(
+    builderSelectors.getBuilderMethod(state),
+    navigationConfig.getCurrentRouteDef(currentPath),
+    featureFlagInfoSelectors.getFeatureFlagInfo(state)
+  );
+
+  let activeSectionIdx: number = 0;
+  sections.forEach((section, idx) => {
+    if (section.active) {
+      activeSectionIdx = idx;
+    }
+  });
+
+  return {
+    sections,
+    firstAvailableSectionRoutes:
+      builderSelectors.getFirstAvailableSectionRoutes(state),
+    isCharacterSheetReady: builderSelectors.checkIsCharacterSheetReady(state),
+    characterSheetUrl: builderEnvSelectors.getCharacterSheetUrl(state),
+    builderMethod: builderSelectors.getBuilderMethod(state),
+    activeSectionIdx,
+    isMobile: appEnvSelectors.getIsMobile(state),
+    characterStatus: characterSelectors.getStatusSlug(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+  };
+}
+
+export default connect(mapStateToProps)(NavigationSections);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/NavigationSections/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/NavigationSections/index.ts
new file mode 100644
index 0000000..fc7b9bf
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/NavigationSections/index.ts
@@ -0,0 +1,4 @@
+import NavigationSections from "./NavigationSections";
+
+export default NavigationSections;
+export { NavigationSections };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/ProgressionManager/ProgressionManager.tsx b/ddb_main/tools/js/CharacterBuilder/containers/ProgressionManager/ProgressionManager.tsx
new file mode 100644
index 0000000..4ba6300
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/ProgressionManager/ProgressionManager.tsx
@@ -0,0 +1,120 @@
+import clsx from "clsx";
+import { FC, HTMLAttributes, useEffect, useMemo, useState } from "react";
+import { useDispatch } from "react-redux";
+
+import {
+  characterActions,
+  CharacterUtils,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Button } from "~/components/Button";
+import { ConfirmModal } from "~/components/ConfirmModal";
+import { XpManager } from "~/components/XpManager";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { toastMessageActions } from "~/tools/js/Shared/actions";
+
+import styles from "./styles.module.css";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {}
+
+export const ProgressionManager: FC<Props> = ({ ...props }) => {
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const [newXpTotal, setNewXpTotal] = useState<number | null>(null);
+  const [shouldReset, setShouldReset] = useState<boolean>(false);
+
+  const dispatch = useDispatch();
+  const { currentXp, preferences, totalClassLevel, ruleData } =
+    useCharacterEngine();
+
+  useEffect(() => {
+    setShouldReset(newXpTotal === null);
+  }, [newXpTotal]);
+
+  const handleManageXpClick = (): void => {
+    setIsModalOpen(true);
+  };
+
+  const closeModal = (): void => {
+    setNewXpTotal(null);
+    setIsModalOpen(false);
+  };
+
+  const onConfirm = (): void => {
+    if (newXpTotal !== null) {
+      closeModal();
+
+      dispatch(characterActions.xpSet(newXpTotal));
+      dispatch(
+        toastMessageActions.toastSuccess(
+          "Experience Points Updated",
+          "You have successfully updated your XP"
+        )
+      );
+    }
+  };
+
+  const handleXpUpdates = (newXpTotal: number): void => {
+    setNewXpTotal(newXpTotal);
+  };
+
+  const levelDiff = useMemo(() => {
+    const currentLevel = CharacterUtils.deriveXpLevel(currentXp, ruleData);
+    return currentLevel - totalClassLevel;
+  }, [currentXp, totalClassLevel]);
+
+  return (
+    <div className="progression-manager" {...props}>
+      <div className="progression-manager-info">
+        <div className="progression-manager-heading">
+          Character Level: {totalClassLevel}
+          {preferences.progressionType ===
+            Constants.PreferenceProgressionTypeEnum.XP &&
+            levelDiff !== 0 && (
+              <span
+                className={clsx([
+                  "progression-manager-heading-diff",
+                  levelDiff > 0 && "progression-manager-heading-diff-positive",
+                  levelDiff < 0 && "progression-manager-heading-diff-negative",
+                ])}
+              >
+                <span className="progression-manager-heading-diff-icon" />
+                <span className="progression-manager-heading-diff-amount">
+                  {Math.abs(levelDiff)}
+                </span>
+              </span>
+            )}
+        </div>
+      </div>
+      {preferences.progressionType ===
+      Constants.PreferenceProgressionTypeEnum.MILESTONE ? (
+        <div className="progression-manager-meta">Milestone Advancement</div>
+      ) : (
+        <div className="progression-manager-action">
+          <Button
+            color="info"
+            variant="builder-text"
+            size="x-small"
+            onClick={handleManageXpClick}
+          >
+            Manage XP
+          </Button>
+        </div>
+      )}
+      <ConfirmModal
+        open={isModalOpen}
+        onClose={closeModal}
+        onConfirm={onConfirm}
+        heading="Manage XP"
+        className={styles.xpManagerModal}
+        confirmButtonText="Apply"
+      >
+        <XpManager
+          handleXpUpdates={handleXpUpdates}
+          shouldReset={shouldReset}
+          className={styles.xpManager}
+        />
+      </ConfirmModal>
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/SynchronousBlocker/SynchronousBlocker.tsx b/ddb_main/tools/js/CharacterBuilder/containers/SynchronousBlocker/SynchronousBlocker.tsx
new file mode 100644
index 0000000..f6c1e2f
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/SynchronousBlocker/SynchronousBlocker.tsx
@@ -0,0 +1,127 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import { syncTransactionSelectors } from "@dndbeyond/character-rules-engine/es";
+
+import { BuilderAppState } from "../../typings";
+import { SyncBlockerLoadingPlaceholder } from "./SynchronousBlockerLoadingPlaceholder";
+
+let showBlockerTimerId: number;
+let hideBlockerTimerId: number;
+
+interface Props {
+  waitDelayToShow: number;
+  waitDelayToHide: number;
+  className: string;
+  syncActive: boolean;
+}
+interface State {
+  showBlocker: boolean;
+  transitioning: boolean;
+}
+class SynchronousBlocker extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    waitDelayToShow: 300,
+    waitDelayToHide: 0,
+    className: "",
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      showBlocker: false,
+      transitioning: false,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { syncActive, waitDelayToShow, waitDelayToHide } = this.props;
+
+    if (syncActive === prevProps.syncActive) {
+      return;
+    }
+
+    if (prevState.transitioning) {
+      return;
+    }
+
+    if (syncActive) {
+      window.clearTimeout(hideBlockerTimerId);
+      this.setState({
+        transitioning: true,
+      });
+      showBlockerTimerId = window.setTimeout(() => {
+        this.setState({
+          showBlocker: true,
+          transitioning: false,
+        });
+      }, waitDelayToShow);
+    } else {
+      window.clearTimeout(showBlockerTimerId);
+      if (waitDelayToHide) {
+        this.setState({
+          transitioning: true,
+        });
+        hideBlockerTimerId = window.setTimeout(() => {
+          this.setState({
+            showBlocker: false,
+            transitioning: false,
+          });
+        }, waitDelayToHide);
+      } else {
+        this.setState({
+          showBlocker: false,
+        });
+      }
+    }
+  }
+
+  handleOverlayClick = (evt: React.MouseEvent): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+  };
+
+  renderContent = (): React.ReactNode => {
+    const { children } = this.props;
+
+    if (children) {
+      return children;
+    }
+
+    return <SyncBlockerLoadingPlaceholder />;
+  };
+
+  render() {
+    const { transitioning } = this.state;
+    const { syncActive, className } = this.props;
+
+    const classNames: Array<string> = ["sync-blocker", className];
+    if (syncActive) {
+      classNames.push("sync-blocker-active");
+    } else {
+      classNames.push("sync-blocker-inactive");
+    }
+    if (transitioning) {
+      classNames.push("sync-blocker-transition-in-out");
+    }
+
+    return (
+      <div className={classNames.join(" ")} onClick={this.handleOverlayClick}>
+        {this.renderContent()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: BuilderAppState) {
+  return {
+    syncActive: syncTransactionSelectors.getActive(state),
+  };
+}
+
+export default connect(mapStateToProps)(SynchronousBlocker);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/SynchronousBlocker/SynchronousBlockerLoadingPlaceholder/SyncBlockerLoadingPlaceholder.tsx b/ddb_main/tools/js/CharacterBuilder/containers/SynchronousBlocker/SynchronousBlockerLoadingPlaceholder/SyncBlockerLoadingPlaceholder.tsx
new file mode 100644
index 0000000..12301c1
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/SynchronousBlocker/SynchronousBlockerLoadingPlaceholder/SyncBlockerLoadingPlaceholder.tsx
@@ -0,0 +1,15 @@
+import React from "react";
+
+import { AnimatedLoadingRingSvg } from "@dndbeyond/character-components/es";
+
+interface Props {}
+export default class SyncBlockerLoadingPlaceholder extends React.PureComponent<Props> {
+  render() {
+    return (
+      <div className="sync-blocker-group">
+        <div className="sync-blocker-logo" />
+        <AnimatedLoadingRingSvg className="sync-blocker-anim" />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/SynchronousBlocker/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/SynchronousBlocker/index.ts
new file mode 100644
index 0000000..6e07a80
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/SynchronousBlocker/index.ts
@@ -0,0 +1,5 @@
+import SynchronousBlocker from "./SynchronousBlocker";
+import SyncBlockerLoadingPlaceholder from "./SynchronousBlockerLoadingPlaceholder";
+
+export default SynchronousBlocker;
+export { SynchronousBlocker, SyncBlockerLoadingPlaceholder };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/TodoNavigation/TodoNavigation.tsx b/ddb_main/tools/js/CharacterBuilder/containers/TodoNavigation/TodoNavigation.tsx
new file mode 100644
index 0000000..dc92d07
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/TodoNavigation/TodoNavigation.tsx
@@ -0,0 +1,207 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  DisabledChevronLeftSvg,
+  DisabledChevronRightSvg,
+  LightChevronLeftSvg,
+  LightChevronRightSvg,
+} from "@dndbeyond/character-components/es";
+
+import { Link } from "~/components/Link";
+
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { navigationConfig } from "../../config";
+import { builderSelectors } from "../../selectors";
+import { BuilderAppState } from "../../typings";
+import { NavigationUtils } from "../../utils";
+
+interface PrevProps {
+  disabled: boolean;
+}
+class TodoNavigationPrev extends React.PureComponent<PrevProps> {
+  static defaultProps = {
+    disabled: false,
+  };
+
+  render() {
+    const { disabled } = this.props;
+
+    let conClassNames: Array<string> = [
+      "builder-navigation-large-action",
+      "builder-navigation-large-action-prev",
+    ];
+    if (disabled) {
+      conClassNames.push("builder-navigation-large-action-disabled");
+      conClassNames.push("builder-navigation-large-action-prev-disabled");
+    }
+
+    return (
+      <div className={conClassNames.join(" ")}>
+        <div className="builder-navigation-large-action-icon">
+          {disabled ? <DisabledChevronLeftSvg /> : <LightChevronLeftSvg />}
+        </div>
+        <div className="builder-navigation-large-action-text">Prev</div>
+      </div>
+    );
+  }
+}
+
+interface NextProps {
+  disabled: boolean;
+}
+class TodoNavigationNext extends React.PureComponent<NextProps> {
+  static defaultProps = {
+    disabled: false,
+  };
+
+  render() {
+    const { disabled } = this.props;
+
+    let conClassNames: Array<string> = [
+      "builder-navigation-large-action",
+      "builder-navigation-large-action-next",
+    ];
+    if (disabled) {
+      conClassNames.push("builder-navigation-large-action-disabled");
+      conClassNames.push("builder-navigation-large-action-next-disabled");
+    }
+
+    return (
+      <div className={conClassNames.join(" ")}>
+        <div className="builder-navigation-large-action-text">Next</div>
+        <div className="builder-navigation-large-action-icon">
+          {disabled ? <DisabledChevronRightSvg /> : <LightChevronRightSvg />}
+        </div>
+      </div>
+    );
+  }
+}
+
+interface Props {
+  prevRouteDef: any;
+  nextRouteDef: any;
+  builderMethod: string | null;
+  isMobile: boolean;
+  characterId: number | null;
+}
+class TodoNavigation extends React.PureComponent<Props> {
+  handleNavClick = (): void => {
+    window.scrollTo(0, 0);
+  };
+
+  renderNonMobileUi = (): React.ReactNode => {
+    const { prevRouteDef, nextRouteDef, characterId } = this.props;
+
+    return (
+      <div className="builder-navigation-large">
+        {prevRouteDef !== null ? (
+          <Link
+            className="builder-navigation-large-link"
+            href={prevRouteDef.path.replace(":characterId", characterId)}
+            onClick={this.handleNavClick}
+            useRouter
+          >
+            <TodoNavigationPrev />
+          </Link>
+        ) : (
+          <div className="builder-navigation-large-link">
+            <TodoNavigationPrev disabled={true} />
+          </div>
+        )}
+        {nextRouteDef !== null ? (
+          <Link
+            className="builder-navigation-large-link"
+            href={nextRouteDef.path.replace(":characterId", characterId)}
+            onClick={this.handleNavClick}
+            useRouter
+          >
+            <TodoNavigationNext />
+          </Link>
+        ) : (
+          <div className="builder-navigation-large-link">
+            <TodoNavigationNext disabled={true} />
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  renderMobileUi = (): React.ReactNode => {
+    const { prevRouteDef, nextRouteDef, characterId } = this.props;
+
+    return (
+      <div className="builder-navigation">
+        {prevRouteDef !== null ? (
+          <Link
+            className="builder-navigation-link"
+            href={prevRouteDef.path.replace(":characterId", characterId)}
+            onClick={this.handleNavClick}
+            useRouter
+          >
+            &lt; Prev
+          </Link>
+        ) : (
+          <div className="builder-navigation-link builder-navigation-link-disabled">
+            &lt; Prev
+          </div>
+        )}
+        {nextRouteDef !== null ? (
+          <Link
+            className="builder-navigation-link"
+            href={nextRouteDef.path.replace(":characterId", characterId)}
+            onClick={this.handleNavClick}
+            useRouter
+          >
+            Next &gt;
+          </Link>
+        ) : (
+          <div className="builder-navigation-link builder-navigation-link-disabled">
+            Next &gt;
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  render() {
+    const { isMobile, builderMethod } = this.props;
+
+    if (builderMethod === null) {
+      return null;
+    }
+
+    return isMobile ? this.renderMobileUi() : this.renderNonMobileUi();
+  }
+}
+
+function mapStateToProps(state: BuilderAppState, ownProps): Props {
+  const currentPath = ownProps.pathname;
+  const characterId = ownProps.characterId;
+  const currentRouteDef = navigationConfig.getCurrentRouteDef(currentPath);
+
+  let prevRouteDef, nextRouteDef;
+  if (currentRouteDef === null) {
+    prevRouteDef = null;
+    nextRouteDef = null;
+  } else {
+    prevRouteDef = NavigationUtils.getAvailablePrevRoute(
+      currentRouteDef,
+      state
+    );
+    nextRouteDef = NavigationUtils.getAvailableNextRoute(
+      currentRouteDef,
+      state
+    );
+  }
+
+  return {
+    prevRouteDef,
+    nextRouteDef,
+    builderMethod: builderSelectors.getBuilderMethod(state),
+    isMobile: appEnvSelectors.getIsMobile(state),
+    characterId,
+  };
+}
+
+export default connect(mapStateToProps)(TodoNavigation);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/TodoNavigation/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/TodoNavigation/index.ts
new file mode 100644
index 0000000..1f927fb
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/TodoNavigation/index.ts
@@ -0,0 +1,4 @@
+import TodoNavigation from "./TodoNavigation";
+
+export default TodoNavigation;
+export { TodoNavigation };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresHelp/AbilityScoresHelp.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresHelp/AbilityScoresHelp.tsx
new file mode 100644
index 0000000..7ac2dab
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresHelp/AbilityScoresHelp.tsx
@@ -0,0 +1,121 @@
+import React from "react";
+
+import { RouteKey } from "~/subApps/builder/constants";
+
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import PageHeader from "../../../components/PageHeader";
+import PageSubHeader from "../../../components/PageSubHeader";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+
+class AbilityScoresHelp extends React.PureComponent {
+  render() {
+    return (
+      <Page>
+        <PageBody>
+          <PageHeader>Determine Ability Scores</PageHeader>
+          <p>
+            Much of what your character does in the game depends on their six
+            abilities: <strong>Strength</strong>, <strong>Dexterity</strong>,{" "}
+            <strong>Constitution</strong>, <strong>Intelligence</strong>,{" "}
+            <strong>Wisdom</strong>, and <strong>Charisma</strong>. Each ability
+            has a score, which is a number you record for use during play.
+          </p>
+
+          <PageHeader>Generation Method</PageHeader>
+          <p>
+            You can determine ability scores in one of three ways, chosen in the
+            next step:
+          </p>
+
+          <PageSubHeader>Standard Array</PageSubHeader>
+          <p>
+            If you want to save time or don’t like the idea of randomly
+            determining ability scores, you can choose from a fixed list (15,
+            14, 13, 12, 10, 8).
+          </p>
+
+          <PageSubHeader>Manual or Random Generation</PageSubHeader>
+          <p>
+            Manually enter your ability scores. If you roll to randomly
+            determine scores, choose this option to record your results. The
+            standard method is to roll 4d6 and drop the lowest dice roll for
+            each score. This system is used when you select Roll in the Manual
+            category.
+          </p>
+
+          <PageSubHeader>Point Cost</PageSubHeader>
+          <p>
+            Customize your ability scores by spending points. If you are playing
+            an Adventurers League character, choose this option. You have 27
+            points to spend on your ability scores. The cost of each score is
+            shown on the Ability Score Point Costs table. For example, a score
+            of 14 costs 7 of your 27 points.
+          </p>
+
+          <h5>Ability Score Point Costs</h5>
+          <table
+            className="table-compendium"
+            style={
+              {
+                maxWidth: "420px",
+                "--sb-table-row-bg-hover": "#b3d3df",
+                "--sb-table-row-bg-dark": "#d7e8ee",
+                "--sb-table-row-bg-light": "#f1f7f9",
+                "--dark-sb-table-row-bg-light": "#5e7982",
+                "--dark-sb-table-row-bg-dark": "#5c7f8c",
+                "--dark-sb-table-row-bg-hover": "#78a2b0",
+              } as React.CSSProperties
+            }
+          >
+            <thead>
+              <tr>
+                <th>Score</th>
+                <th>Cost</th>
+              </tr>
+            </thead>
+            <tbody>
+              <tr>
+                <td>8</td>
+                <td>0</td>
+              </tr>
+              <tr>
+                <td>9</td>
+                <td>1</td>
+              </tr>
+              <tr>
+                <td>10</td>
+                <td>2</td>
+              </tr>
+              <tr>
+                <td>11</td>
+                <td>3</td>
+              </tr>
+              <tr>
+                <td>12</td>
+                <td>4</td>
+              </tr>
+              <tr>
+                <td>13</td>
+                <td>5</td>
+              </tr>
+              <tr>
+                <td>14</td>
+                <td>7</td>
+              </tr>
+              <tr>
+                <td>15</td>
+                <td>9</td>
+              </tr>
+            </tbody>
+          </table>
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+export default ConnectedBuilderPage(
+  AbilityScoresHelp,
+  RouteKey.ABILITY_SCORES_HELP
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresHelp/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresHelp/index.ts
new file mode 100644
index 0000000..a061313
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresHelp/index.ts
@@ -0,0 +1,4 @@
+import AbilityScoresHelp from "./AbilityScoresHelp";
+
+export default AbilityScoresHelp;
+export { AbilityScoresHelp };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresManage/AbilityScoresManage.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresManage/AbilityScoresManage.tsx
new file mode 100644
index 0000000..635d206
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresManage/AbilityScoresManage.tsx
@@ -0,0 +1,315 @@
+import React from "react";
+import { DispatchProp } from "react-redux";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+  CollapsibleHeading,
+  LightDiceSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  AbilityManager,
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiResponse,
+  characterActions,
+  CharacterConfiguration,
+  CharacterPreferences,
+  CharClass,
+  ChoiceData,
+  ClassUtils,
+  Constants,
+  DefinitionPool,
+  DefinitionUtils,
+  FeatDefinitionContract,
+  FeatLookup,
+  OptionalOriginLookup,
+  PrerequisiteData,
+  Race,
+  RaceUtils,
+  RacialTraitUtils,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  serviceDataSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+import { Dice } from "@dndbeyond/dice";
+
+import { AbilityScoreManager } from "~/components/AbilityScoreManager";
+import { HelperTextAccordion } from "~/components/HelperTextAccordion";
+import { useAbilities } from "~/hooks/useAbilities";
+import { RouteKey } from "~/subApps/builder/constants";
+
+import { appEnvActions } from "../../../../Shared/actions/appEnv";
+import {
+  apiCreatorSelectors,
+  appEnvSelectors,
+} from "../../../../Shared/selectors";
+import AbilityScoreManagerManual from "../../../components/AbilityScoreManagerManual";
+import AbilityScoreManagerPointBuy from "../../../components/AbilityScoreManagerPointBuy";
+import AbilityScoreManagerStandardArray from "../../../components/AbilityScoreManagerStandardArray";
+import { Button } from "../../../components/Button";
+import { Page } from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import { PageHeader } from "../../../components/PageHeader";
+import SpeciesTraitList from "../../../components/SpeciesTraitList";
+import { AbilityScoreDiceManager } from "../../AbilityScoreDiceManager";
+import AbilityScoreTypeChooser from "../../AbilityScoreTypeChooser";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+
+interface Props extends DispatchProp {
+  abilities: AbilityManager[];
+  configuration: CharacterConfiguration;
+  diceEnabled: boolean;
+  species: Race;
+  featLookup: FeatLookup;
+  loadAvailableFeats: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<FeatDefinitionContract[]>>;
+  choiceInfo: ChoiceData;
+  prerequisiteData: PrerequisiteData;
+  preferences: CharacterPreferences;
+  optionalOriginLookup: OptionalOriginLookup;
+  definitionPool: DefinitionPool;
+  charClasses: CharClass[];
+  ruleData: RuleData;
+}
+class AbilityScoresManage extends React.PureComponent<Props> {
+  static defaultProps = {
+    diceEnabled: false,
+  };
+
+  handleDiceEnable = (): void => {
+    const { dispatch, diceEnabled } = this.props;
+
+    if (diceEnabled) {
+      return;
+    }
+
+    const newDiceEnabledSetting: boolean = !diceEnabled;
+
+    try {
+      localStorage.setItem("dice-enabled", newDiceEnabledSetting.toString());
+      Dice.setEnabled(newDiceEnabledSetting);
+    } catch (e) {}
+
+    dispatch(
+      appEnvActions.dataSet({
+        diceEnabled: newDiceEnabledSetting,
+      })
+    );
+  };
+
+  renderAbilityScoreManager = (): React.ReactNode => {
+    const { abilities, configuration } = this.props;
+
+    switch (configuration.abilityScoreType) {
+      case Constants.AbilityScoreTypeEnum.MANUAL:
+        return <AbilityScoreManagerManual abilities={abilities} />;
+
+      case Constants.AbilityScoreTypeEnum.STANDARD_ARRAY:
+        return <AbilityScoreManagerStandardArray abilities={abilities} />;
+
+      case Constants.AbilityScoreTypeEnum.POINT_BUY:
+        return <AbilityScoreManagerPointBuy abilities={abilities} />;
+
+      default:
+      // not implemented
+    }
+
+    return null;
+  };
+
+  renderAbilityDice = (): React.ReactNode => {
+    const { diceEnabled } = this.props;
+
+    if (!diceEnabled) {
+      return (
+        <div className="ability-score-dice-control">
+          <span className="ability-score-dice-control-text">
+            Enable digital dice to assist with rolling your ability scores:
+          </span>
+          <Button size="medium" onClick={this.handleDiceEnable}>
+            <LightDiceSvg />
+            <span className="ability-score-dice-control-button-text">
+              Use Dice
+            </span>
+          </Button>
+        </div>
+      );
+    }
+
+    let headingNode: React.ReactNode = (
+      <CollapsibleHeading>Dice Roll Groups</CollapsibleHeading>
+    );
+
+    let headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent heading={headingNode} />
+    );
+
+    return (
+      <Collapsible
+        header={headerNode}
+        className="ability-score-dice"
+        initiallyCollapsed={false}
+      >
+        <AbilityScoreDiceManager />
+      </Collapsible>
+    );
+  };
+
+  handleSpeciesTraitChoiceChange = (
+    speciesTraitId,
+    choiceId,
+    choiceType,
+    optionValue
+  ): void => {
+    const { dispatch } = this.props;
+
+    dispatch(
+      characterActions.racialTraitChoiceSetRequest(
+        speciesTraitId,
+        choiceType,
+        choiceId,
+        optionValue
+      )
+    );
+  };
+
+  renderSpeciesTraits() {
+    const {
+      species,
+      featLookup,
+      loadAvailableFeats,
+      choiceInfo,
+      prerequisiteData,
+      preferences,
+      optionalOriginLookup,
+      definitionPool,
+    } = this.props;
+
+    if (!species) {
+      return null;
+    }
+
+    const speciesTraits = RaceUtils.getVisibleRacialTraits(species);
+    const filteredSpeciesTraits =
+      RacialTraitUtils.filterRacialTraitsByDisplayConfigurationType(
+        speciesTraits,
+        [Constants.DisplayConfigurationTypeEnum.ABILITY_SCORE]
+      );
+
+    return (
+      filteredSpeciesTraits.length > 0 && (
+        <SpeciesTraitList
+          speciesTraits={filteredSpeciesTraits}
+          featLookup={featLookup}
+          loadAvailableFeats={loadAvailableFeats}
+          handleSpeciesTraitChoiceChange={this.handleSpeciesTraitChoiceChange}
+          choiceInfo={choiceInfo}
+          prerequisiteData={prerequisiteData}
+          preferences={preferences}
+          optionalOriginLookup={optionalOriginLookup}
+          definitionPool={definitionPool}
+          speciesName={RaceUtils.getFullName(species)}
+        />
+      )
+    );
+  }
+
+  renderInformationCollapsible = (): React.ReactNode => {
+    const { ruleData, charClasses, species } = this.props;
+    if (charClasses.length === 0 || species === null) {
+      return null;
+    }
+
+    let definitionKeys: string[] = [];
+    if (species) {
+      definitionKeys.push(
+        DefinitionUtils.hack__generateDefinitionKey(
+          RaceUtils.getEntityRaceTypeId(species),
+          RaceUtils.getEntityRaceId(species)
+        )
+      );
+    }
+
+    if (charClasses.length > 0) {
+      definitionKeys = definitionKeys.concat(
+        charClasses.map((charClass) =>
+          DefinitionUtils.hack__generateDefinitionKey(
+            ClassUtils.getMappingEntityTypeId(charClass),
+            ClassUtils.getId(charClass)
+          )
+        )
+      );
+    }
+
+    const builderText = RuleDataUtils.getBuilderHelperTextByDefinitionKeys(
+      definitionKeys,
+      ruleData,
+      Constants.DisplayConfigurationTypeEnum.ABILITY_SCORE
+    );
+
+    return <HelperTextAccordion builderHelperText={builderText} />;
+  };
+
+  render() {
+    const { configuration, abilities } = this.props;
+
+    return (
+      <Page>
+        <PageBody>
+          <PageHeader>Ability Scores</PageHeader>
+          <AbilityScoreTypeChooser initialOptionRemoved={false} />
+          {this.renderInformationCollapsible()}
+          {this.renderAbilityScoreManager()}
+          {configuration.abilityScoreType ===
+            Constants.AbilityScoreTypeEnum.MANUAL && this.renderAbilityDice()}
+          {this.renderSpeciesTraits()}
+          <PageHeader>Score Calculations</PageHeader>
+          <p>
+            Calculations, including the base scores you set above and any
+            modifiers, are found below. You can also override any automatic
+            calculations or modify them under each ability summary.
+          </p>
+          <div className="ability-score-calcs">
+            {abilities.map((ability) => (
+              <AbilityScoreManager
+                ability={ability}
+                showHeader={true}
+                isReadonly={false}
+                isBuilder={true}
+              />
+            ))}
+          </div>
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+function AbilityScoresManageContainer(props) {
+  const abilities = useAbilities();
+  return <AbilityScoresManage {...props} abilities={abilities} />;
+}
+
+export default ConnectedBuilderPage(
+  AbilityScoresManageContainer,
+  RouteKey.ABILITY_SCORES_MANAGE,
+  (state) => {
+    return {
+      configuration: rulesEngineSelectors.getCharacterConfiguration(state),
+      diceEnabled: appEnvSelectors.getDiceEnabled(state),
+      species: rulesEngineSelectors.getRace(state),
+      featLookup: rulesEngineSelectors.getFeatLookup(state),
+      loadAvailableFeats: apiCreatorSelectors.makeLoadAvailableFeats(state),
+      choiceInfo: rulesEngineSelectors.getChoiceInfo(state),
+      prerequisiteData: rulesEngineSelectors.getPrerequisiteData(state),
+      preferences: rulesEngineSelectors.getCharacterPreferences(state),
+      optionalOriginLookup: rulesEngineSelectors.getOptionalOriginLookup(state),
+      definitionPool: serviceDataSelectors.getDefinitionPool(state),
+      charClasses: rulesEngineSelectors.getClasses(state),
+      ruleData: rulesEngineSelectors.getRuleData(state),
+    };
+  }
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresManage/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresManage/index.ts
new file mode 100644
index 0000000..e779534
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/AbilityScoresManage/index.ts
@@ -0,0 +1,4 @@
+import AbilityScoresManage from "./AbilityScoresManage";
+
+export default AbilityScoresManage;
+export { AbilityScoresManage };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassHelp/ClassHelp.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassHelp/ClassHelp.tsx
new file mode 100644
index 0000000..f260719
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassHelp/ClassHelp.tsx
@@ -0,0 +1,75 @@
+import React from "react";
+
+import { RouteKey } from "~/subApps/builder/constants";
+
+import { CollapsibleContent } from "../../../../../../components/CollapsibleContent";
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import PageHeader from "../../../components/PageHeader";
+import { BuilderAppState } from "../../../typings";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+
+interface Props {
+  isMobile: boolean;
+}
+class ClassHelp extends React.PureComponent<Props> {
+  render() {
+    const { isMobile } = this.props;
+
+    return (
+      <Page>
+        <PageBody>
+          <PageHeader>Choose your Class</PageHeader>
+
+          <CollapsibleContent
+            forceShow={!isMobile}
+            heading={
+              <p>
+                In the first step, choose a class for your character. Every
+                adventurer is a member of a class. Class broadly describes a
+                character's vocation, what special talents they possess, and the
+                tactics they are most likely to employ when exploring a dungeon,
+                fighting monsters, or engaging in a tense negotiation.
+              </p>
+            }
+          >
+            <p>
+              Your character receives a number of benefits from your chosen
+              class. These features are capabilities (such as Spellcasting) that
+              set your character apart from members of other classes. You also
+              gain a number of proficiencies: weapons, skills, saving throws,
+              and sometimes tools. Your proficiencies define many of the things
+              your character can do particularly well, from using certain
+              weapons to telling a convincing lie.
+            </p>
+          </CollapsibleContent>
+
+          <PageHeader>Multiclassing</PageHeader>
+
+          <p>
+            Adventurers sometimes advance in more than one class. A Rogue might
+            switch direction in life and swear the oath of a Paladin, A
+            Barbarian might discover latent magical ability and dabble in the
+            Sorcerer class while continuing to advance as a Barbarian.
+          </p>
+
+          <p>
+            The optional rules for combining classes in this way is called
+            Multiclassing.
+          </p>
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+export default ConnectedBuilderPage(
+  ClassHelp,
+  RouteKey.CLASS_HELP,
+  (state: BuilderAppState) => {
+    return {
+      isMobile: appEnvSelectors.getIsMobile(state),
+    };
+  }
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassHelp/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassHelp/index.ts
new file mode 100644
index 0000000..971bcda
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassHelp/index.ts
@@ -0,0 +1,4 @@
+import ClassHelp from "./ClassHelp";
+
+export default ClassHelp;
+export { ClassHelp };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManager/ClassManager.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManager/ClassManager.tsx
new file mode 100644
index 0000000..fa58a1d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManager/ClassManager.tsx
@@ -0,0 +1,484 @@
+import React from "react";
+
+import {
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiResponse,
+  BaseSpellContract,
+  CharacterPreferences,
+  CharacterTheme,
+  CharClass,
+  ChoiceData,
+  ClassDefinitionContract,
+  ClassFeatureDefinitionContract,
+  ClassFeatureUtils,
+  ClassSpellInfo,
+  ClassSpellListSpellsLookup,
+  ClassUtils,
+  Constants,
+  DataOriginRefData,
+  DefinitionPool,
+  DefinitionUtils,
+  EntitledEntity,
+  FeatDefinitionContract,
+  FeatLookup,
+  InfusionChoice,
+  InfusionDefinitionContract,
+  InventoryManager,
+  Modifier,
+  OptionalClassFeatureLookup,
+  OverallSpellInfo,
+  PrerequisiteData,
+  RuleData,
+  RuleDataUtils,
+  Spell,
+  SpellCasterInfo,
+  TypeValueLookup,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HelperTextAccordion } from "~/components/HelperTextAccordion";
+import { TabList } from "~/components/TabList";
+import { ClassHeader } from "~/subApps/builder/routes/Class/ClassHeader";
+
+import ClassSpellListManager from "../../../../../Shared/components/legacy/ClassSpellListManager";
+import {
+  ApiClassFeaturesRequest,
+  ApiSpellsRequest,
+} from "../../../../../Shared/selectors/composite/apiCreator";
+import ClassManagerFeature from "../ClassManagerFeature";
+import { OptionalFeatureManager } from "../OptionalFeatureManager";
+
+interface Props {
+  charClass: CharClass;
+  spellCasterInfo: SpellCasterInfo;
+  overallSpellInfo: OverallSpellInfo;
+  ruleData: RuleData;
+  prerequisiteData: PrerequisiteData;
+  choiceInfo: ChoiceData;
+  preferences: CharacterPreferences;
+  globalModifiers: Array<Modifier>;
+  typeValueLookup: TypeValueLookup;
+  definitionPool: DefinitionPool;
+  knownInfusionLookup: Record<string, InfusionChoice>;
+  knownReplicatedItems: Array<string>;
+  activeSourceCategories: Array<number>;
+  onClassFeatureChoiceChange: (
+    classId: number,
+    classFeatureId: number,
+    choiceType: any,
+    choiceId: string,
+    optionValue: number | null,
+    parentChoiceId: string | null
+  ) => void;
+  onSpellPrepare: (spell: Spell, classMappingId: number) => void;
+  onSpellUnprepare: (spell: Spell, classMappingId: number) => void;
+  onSpellRemove: (spell: Spell, classMappingId: number) => void;
+  onSpellAdd: (spell: Spell, classMappingId: number) => void;
+  onAlwaysKnownLoad: (
+    spells: Array<BaseSpellContract>,
+    classId: number
+  ) => void;
+  onInfusionChoiceItemChangePromise?: (
+    infusionChoiceKey: string,
+    infusionId: string,
+    itemDefinitionKey: string,
+    itemName: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceItemDestroyPromise?: (
+    infusionChoiceKey: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceChangePromise?: (
+    infusionChoiceKey: string,
+    infusionId: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceDestroyPromise?: (
+    infusionChoiceKey: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceCreatePromise?: (
+    infusionChoiceKey: string,
+    infusionId: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onOptionalFeatureSelection: (
+    definitionKey: string,
+    affectedClassFeatureDefinitionKey: string | null
+  ) => void;
+  onChangeReplacementPromise?: (
+    definitionKey: string,
+    newAffectedDefinitionKey: string | null,
+    oldAffectedDefinitionKey: string | null,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onRemoveSelectionPromise?: (
+    definitionKey: string,
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  classSpellList: ClassSpellInfo | null;
+  levelsRemaining: number;
+  isMulticlass: boolean;
+  loadAvailableSubclasses: (
+    baseClassId: number,
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<Array<ClassDefinitionContract>>>;
+  loadAvailableFeats: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<Array<FeatDefinitionContract>>>;
+  loadRemainingSpellList: ApiSpellsRequest | null;
+  loadAlwaysKnownSpells?: ApiSpellsRequest | null;
+  loadAvailableOptionalClassFeatures: ApiClassFeaturesRequest | null;
+  loadAvailableInfusions: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<
+    ApiResponse<EntitledEntity<InfusionDefinitionContract>>
+  >;
+  onDefinitionsLoaded?: (
+    definitions: Array<InfusionDefinitionContract>,
+    accessTypes: Record<string, number>
+  ) => void;
+  onFeatureDefinitionsLoaded?: (
+    definitionData: EntitledEntity<ClassFeatureDefinitionContract>
+  ) => void;
+  featLookup: FeatLookup;
+  dataOriginRefData: DataOriginRefData;
+  classSpellListSpellsLookup: ClassSpellListSpellsLookup;
+  optionalClassFeatureLookup: OptionalClassFeatureLookup;
+  theme: CharacterTheme;
+  inventoryManager: InventoryManager;
+}
+interface State {
+  showClassFeatures: boolean;
+  showAtHigherLevelsClassFeatures: boolean;
+}
+export default class ClassManager extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      showClassFeatures: true,
+      showAtHigherLevelsClassFeatures: false,
+    };
+  }
+
+  handleAtHigherLevelsTriggerClick = (evt: React.MouseEvent): void => {
+    this.setState((prevState) => ({
+      showAtHigherLevelsClassFeatures:
+        !prevState.showAtHigherLevelsClassFeatures,
+    }));
+  };
+
+  handleFeatureChoiceChange = (
+    classFeatureId: number,
+    choiceId: string,
+    choiceType: any,
+    optionValue: number | null,
+    parentChoiceId: string | null
+  ): void => {
+    const { onClassFeatureChoiceChange, charClass } = this.props;
+
+    if (onClassFeatureChoiceChange) {
+      onClassFeatureChoiceChange(
+        ClassUtils.getActiveId(charClass),
+        classFeatureId,
+        choiceType,
+        choiceId,
+        optionValue,
+        parentChoiceId
+      );
+    }
+  };
+
+  renderInformationCollapsible = (): React.ReactNode => {
+    const { ruleData, charClass } = this.props;
+    if (charClass === null) {
+      return null;
+    }
+
+    const definitionKey = DefinitionUtils.hack__generateDefinitionKey(
+      ClassUtils.getMappingEntityTypeId(charClass),
+      ClassUtils.getId(charClass)
+    );
+    const builderText = RuleDataUtils.getBuilderHelperTextByDefinitionKeys(
+      [definitionKey],
+      ruleData,
+      Constants.DisplayConfigurationTypeEnum.CLASS_FEATURE
+    );
+
+    return <HelperTextAccordion builderHelperText={builderText} />;
+  };
+
+  renderClassFeatureGroups = (): React.ReactNode => {
+    const { showClassFeatures, showAtHigherLevelsClassFeatures } = this.state;
+    const {
+      charClass,
+      choiceInfo,
+      prerequisiteData,
+      preferences,
+      loadAvailableSubclasses,
+      loadAvailableFeats,
+      typeValueLookup,
+      globalModifiers,
+      ruleData,
+      definitionPool,
+      loadAvailableInfusions,
+      onDefinitionsLoaded,
+      onInfusionChoiceItemChangePromise,
+      onInfusionChoiceItemDestroyPromise,
+      onInfusionChoiceChangePromise,
+      onInfusionChoiceDestroyPromise,
+      onInfusionChoiceCreatePromise,
+      featLookup,
+      knownInfusionLookup,
+      knownReplicatedItems,
+      optionalClassFeatureLookup,
+      inventoryManager,
+    } = this.props;
+
+    if (!showClassFeatures) {
+      return null;
+    }
+
+    const level = ClassUtils.getLevel(charClass);
+    const isStartingClass = ClassUtils.isStartingClass(charClass);
+
+    const visibleClassFeatures = ClassUtils.getVisibileClassFeatures(charClass);
+    const orderedVisibleFeatures = ClassUtils.deriveOrderedClassFeatures(
+      visibleClassFeatures
+    ).filter((feature) => ClassFeatureUtils.getRequiredLevel(feature) <= level);
+
+    const classFeatures = ClassUtils.getClassFeatures(charClass);
+    const orderedClassFeatures =
+      ClassUtils.deriveOrderedClassFeatures(classFeatures);
+    const atHigherLevelsClassFeatures = orderedClassFeatures.filter(
+      (feature) => ClassFeatureUtils.getRequiredLevel(feature) > level
+    );
+
+    return (
+      <div className="class-manager-features-groups">
+        {this.renderInformationCollapsible()}
+        {orderedVisibleFeatures.length > 0 && (
+          <div className="class-manager-features-group">
+            <div className="class-manager-features-group-items">
+              {orderedVisibleFeatures.map((feature) => (
+                <ClassManagerFeature
+                  key={ClassFeatureUtils.getId(feature)}
+                  charClass={charClass}
+                  feature={feature}
+                  isStartingClass={isStartingClass}
+                  onChoiceChange={this.handleFeatureChoiceChange}
+                  onInfusionChoiceItemChangePromise={
+                    onInfusionChoiceItemChangePromise
+                  }
+                  onInfusionChoiceItemDestroyPromise={
+                    onInfusionChoiceItemDestroyPromise
+                  }
+                  onInfusionChoiceChangePromise={onInfusionChoiceChangePromise}
+                  onInfusionChoiceDestroyPromise={
+                    onInfusionChoiceDestroyPromise
+                  }
+                  onInfusionChoiceCreatePromise={onInfusionChoiceCreatePromise}
+                  onDefinitionsLoaded={onDefinitionsLoaded}
+                  choiceInfo={choiceInfo}
+                  prerequisiteData={prerequisiteData}
+                  preferences={preferences}
+                  loadAvailableInfusions={loadAvailableInfusions}
+                  loadAvailableSubclasses={loadAvailableSubclasses}
+                  loadAvailableFeats={loadAvailableFeats}
+                  typeValueLookup={typeValueLookup}
+                  globalModifiers={globalModifiers}
+                  ruleData={ruleData}
+                  definitionPool={definitionPool}
+                  featLookup={featLookup}
+                  knownReplicatedItems={knownReplicatedItems}
+                  knownInfusionLookup={knownInfusionLookup}
+                  optionalClassFeatureLookup={optionalClassFeatureLookup}
+                  inventoryManager={inventoryManager}
+                />
+              ))}
+            </div>
+          </div>
+        )}
+        {atHigherLevelsClassFeatures.length > 0 && (
+          <div
+            className={`class-manager-features-group ${
+              showAtHigherLevelsClassFeatures
+                ? "class-manager-features-group-opened"
+                : "class-manager-features-group-collapsed"
+            }`}
+          >
+            <div className="class-manager-features-group-header">
+              <div
+                className="class-manager-features-group-heading"
+                onClick={this.handleAtHigherLevelsTriggerClick}
+              >
+                Available at Higher Levels ({atHigherLevelsClassFeatures.length}
+                )
+              </div>
+              <div
+                className="class-manager-features-group-trigger"
+                onClick={this.handleAtHigherLevelsTriggerClick}
+              />
+            </div>
+            {showAtHigherLevelsClassFeatures && (
+              <div className="class-manager-features-group-items">
+                {atHigherLevelsClassFeatures.map((feature) => (
+                  <ClassManagerFeature
+                    key={ClassFeatureUtils.getId(feature)}
+                    charClass={charClass}
+                    choiceInfo={choiceInfo}
+                    feature={feature}
+                    isStartingClass={isStartingClass}
+                    isActive={false}
+                    prerequisiteData={prerequisiteData}
+                    preferences={preferences}
+                    loadAvailableInfusions={loadAvailableInfusions}
+                    loadAvailableSubclasses={loadAvailableSubclasses}
+                    loadAvailableFeats={loadAvailableFeats}
+                    typeValueLookup={typeValueLookup}
+                    globalModifiers={globalModifiers}
+                    ruleData={ruleData}
+                    definitionPool={definitionPool}
+                    knownReplicatedItems={knownReplicatedItems}
+                    knownInfusionLookup={knownInfusionLookup}
+                    optionalClassFeatureLookup={optionalClassFeatureLookup}
+                    inventoryManager={inventoryManager}
+                  />
+                ))}
+              </div>
+            )}
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  renderClassFeatures = (): React.ReactNode => {
+    const { showClassFeatures } = this.state;
+
+    return (
+      <div
+        className={`class-manager-features ${
+          showClassFeatures
+            ? "class-manager-features-opened"
+            : "class-manager-features-collapsed"
+        }`}
+      >
+        {/*<div className="class-manager-features-header">*/}
+        {/*<div className="class-manager-features-heading" onClick={this.handleFeaturesTriggerClick}>Class Features</div>*/}
+        {/*<div className="class-manager-features-trigger" onClick={this.handleFeaturesTriggerClick} />*/}
+        {/*</div>*/}
+        {this.renderClassFeatureGroups()}
+      </div>
+    );
+  };
+
+  render() {
+    const {
+      charClass,
+      definitionPool,
+      levelsRemaining,
+      isMulticlass,
+      loadRemainingSpellList,
+      loadAlwaysKnownSpells,
+      loadAvailableOptionalClassFeatures,
+      preferences,
+      classSpellList,
+      spellCasterInfo,
+      ruleData,
+      overallSpellInfo,
+      onSpellAdd,
+      onSpellRemove,
+      onSpellPrepare,
+      onSpellUnprepare,
+      onAlwaysKnownLoad,
+      dataOriginRefData,
+      onOptionalFeatureSelection,
+      onRemoveSelectionPromise,
+      onChangeReplacementPromise,
+      onFeatureDefinitionsLoaded,
+      optionalClassFeatureLookup,
+      theme,
+      activeSourceCategories,
+    } = this.props;
+
+    return (
+      <div className="class-manager">
+        <ClassHeader
+          charClass={charClass}
+          isMulticlass={isMulticlass}
+          levelsRemaining={levelsRemaining}
+        />
+        <TabList
+          variant="toggle"
+          defaultActiveId={isMulticlass ? "none" : "features"}
+          tabs={[
+            {
+              label: "Class Features",
+              content: this.renderClassFeatures(),
+              id: "features",
+            },
+            preferences.enableOptionalClassFeatures
+              ? {
+                  label: "Optional Feature Manager",
+                  content: (
+                    <OptionalFeatureManager
+                      charClass={charClass}
+                      definitionPool={definitionPool}
+                      optionalClassFeatureLookup={optionalClassFeatureLookup}
+                      onDefinitionsLoaded={onFeatureDefinitionsLoaded}
+                      loadAvailableOptionalClassFeatures={
+                        loadAvailableOptionalClassFeatures
+                      }
+                      onSelection={onOptionalFeatureSelection}
+                      onChangeReplacementPromise={onChangeReplacementPromise}
+                      onRemoveSelectionPromise={onRemoveSelectionPromise}
+                      ruleData={ruleData}
+                    />
+                  ),
+                  id: "optional-features",
+                }
+              : null,
+            classSpellList
+              ? {
+                  label: "Spells",
+                  content: (
+                    <ClassSpellListManager
+                      {...(classSpellList as any)}
+                      loadRemainingSpellList={loadRemainingSpellList}
+                      loadAlwaysKnownSpells={loadAlwaysKnownSpells}
+                      onSpellPrepare={onSpellPrepare}
+                      onSpellUnprepare={onSpellUnprepare}
+                      onSpellRemove={onSpellRemove}
+                      onSpellAdd={onSpellAdd}
+                      onAlwaysKnownLoad={onAlwaysKnownLoad}
+                      showHeader={false}
+                      spellCasterInfo={spellCasterInfo}
+                      enableSpellcasting={false}
+                      enableCustomization={false}
+                      ruleData={ruleData}
+                      overallSpellInfo={overallSpellInfo}
+                      dataOriginRefData={dataOriginRefData}
+                      theme={theme}
+                      activeSourceCategories={activeSourceCategories}
+                    />
+                  ),
+                  id: "spells",
+                }
+              : null,
+          ]}
+        />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManager/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManager/index.ts
new file mode 100644
index 0000000..047b272
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManager/index.ts
@@ -0,0 +1,4 @@
+import ClassManager from "./ClassManager";
+
+export default ClassManager;
+export { ClassManager };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManagerFeature/ClassManagerFeature.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManagerFeature/ClassManagerFeature.tsx
new file mode 100644
index 0000000..5cbcbca
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManagerFeature/ClassManagerFeature.tsx
@@ -0,0 +1,673 @@
+import axios, { Canceler } from "axios";
+import React from "react";
+
+import { LoadingPlaceholder } from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiAdapterUtils,
+  ApiResponse,
+  CharacterPreferences,
+  CharClass,
+  ChoiceData,
+  ChoiceUtils,
+  ClassDefinitionContract,
+  ClassFeature,
+  ClassFeatureUtils,
+  ClassUtils,
+  Constants,
+  DefinitionPool,
+  EntitledEntity,
+  Feat,
+  FeatDefinitionContract,
+  FeatLookup,
+  FeatUtils,
+  FormatUtils,
+  HelperUtils,
+  InfusionChoice,
+  InfusionChoiceUtils,
+  InfusionDefinitionContract,
+  InfusionUtils,
+  InventoryManager,
+  KnownInfusionUtils,
+  Modifier,
+  OptionalClassFeatureLookup,
+  OptionalClassFeatureUtils,
+  PrerequisiteData,
+  RuleData,
+  RuleDataUtils,
+  SourceData,
+  TypeValueLookup,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Accordion } from "~/components/Accordion";
+import { CollapsibleContent } from "~/components/CollapsibleContent";
+import { FeatureChoice } from "~/components/FeatureChoice";
+import { Link } from "~/components/Link";
+import { GrantedFeat } from "~/tools/js/CharacterBuilder/components/GrantedFeat/GrantedFeat";
+
+import InfusionChoiceManager from "../../../../../Shared/components/InfusionChoiceManager";
+import DataLoadingStatusEnum from "../../../../../Shared/constants/DataLoadingStatusEnum";
+import { AppLoggerUtils, TypeScriptUtils } from "../../../../../Shared/utils";
+
+interface Props {
+  isActive: boolean;
+  charClass: CharClass;
+  choiceInfo: ChoiceData;
+  feature: ClassFeature;
+  prerequisiteData: PrerequisiteData;
+  isStartingClass: boolean;
+  preferences: CharacterPreferences;
+  globalModifiers: Array<Modifier>;
+  typeValueLookup: TypeValueLookup;
+  ruleData: RuleData;
+  definitionPool: DefinitionPool;
+  knownInfusionLookup: Record<string, InfusionChoice>;
+  knownReplicatedItems: Array<string>;
+  onChoiceChange?: (
+    classFeatureId: number,
+    choiceId: string,
+    type: any,
+    value: number | null,
+    parentChoiceId: string | null
+  ) => void;
+  onInfusionChoiceItemChangePromise?: (
+    infusionChoiceKey: string,
+    infusionId: string,
+    itemDefinitionKey: string,
+    itemName: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceItemDestroyPromise?: (
+    infusionChoiceKey: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceChangePromise?: (
+    infusionChoiceKey: string,
+    infusionId: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceDestroyPromise?: (
+    infusionChoiceKey: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceCreatePromise?: (
+    infusionChoiceKey: string,
+    infusionId: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  loadAvailableSubclasses: (
+    baseClassId: number,
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<Array<ClassDefinitionContract>>>;
+  loadAvailableFeats: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<Array<FeatDefinitionContract>>>;
+  loadAvailableInfusions: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<
+    ApiResponse<EntitledEntity<InfusionDefinitionContract>>
+  >;
+  onDefinitionsLoaded?: (
+    definitions: Array<InfusionDefinitionContract>,
+    accessTypes: Record<string, number>
+  ) => void;
+  featLookup: FeatLookup;
+  optionalClassFeatureLookup: OptionalClassFeatureLookup;
+  inventoryManager: InventoryManager;
+}
+interface State {
+  featData: Array<Feat>;
+  subclassData: Array<ClassDefinitionContract>;
+  hasFeatChoice: boolean;
+  hasSubclassChoice: boolean;
+  collapsibleOpened: boolean;
+  featLoadingStatus: DataLoadingStatusEnum;
+  subclassLoadingStatus: DataLoadingStatusEnum;
+}
+export default class ClassManagerFeature extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    isActive: true,
+    featLookup: {},
+  };
+
+  loadFeatsCanceler: null | Canceler = null;
+  loadSubclassesCanceler: null | Canceler = null;
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      featData: [],
+      subclassData: [],
+      hasFeatChoice: false,
+      hasSubclassChoice: false,
+      collapsibleOpened: false,
+      featLoadingStatus: DataLoadingStatusEnum.NOT_INITIALIZED,
+      subclassLoadingStatus: DataLoadingStatusEnum.NOT_INITIALIZED,
+    };
+  }
+
+  componentDidMount(): void {
+    this.setState(
+      {
+        hasFeatChoice: this.hasFeatChoice(this.props),
+        hasSubclassChoice: this.hasSubclassChoice(this.props),
+      },
+      () => {
+        this.conditionallyLoadFeatData();
+      }
+    );
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { feature } = this.props;
+    const { collapsibleOpened } = this.state;
+
+    if (feature !== prevProps.feature) {
+      this.setState(
+        {
+          hasFeatChoice: this.hasFeatChoice(this.props),
+          hasSubclassChoice: this.hasSubclassChoice(this.props),
+        },
+        () => {
+          this.conditionallyLoadFeatData();
+        }
+      );
+    }
+    if (collapsibleOpened && !prevState.collapsibleOpened) {
+      this.conditionallyLoadFeatData();
+    }
+  }
+
+  conditionallyLoadFeatData = (): void => {
+    const { loadAvailableFeats, loadAvailableSubclasses, charClass } =
+      this.props;
+    const {
+      hasFeatChoice,
+      hasSubclassChoice,
+      featLoadingStatus,
+      subclassLoadingStatus,
+      collapsibleOpened,
+    } = this.state;
+
+    if (
+      hasFeatChoice &&
+      collapsibleOpened &&
+      featLoadingStatus === DataLoadingStatusEnum.NOT_INITIALIZED
+    ) {
+      this.setState({
+        featLoadingStatus: DataLoadingStatusEnum.LOADING,
+      });
+
+      loadAvailableFeats({
+        cancelToken: new axios.CancelToken((c) => {
+          this.loadFeatsCanceler = c;
+        }),
+      })
+        .then((response) => {
+          let featData: Array<Feat> = [];
+
+          const data = ApiAdapterUtils.getResponseData(response);
+          if (data !== null) {
+            featData = data.map((definition) =>
+              FeatUtils.simulateFeat(definition)
+            );
+          }
+
+          this.setState({
+            featData,
+            featLoadingStatus: DataLoadingStatusEnum.LOADED,
+          });
+          this.loadFeatsCanceler = null;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    }
+
+    if (
+      hasSubclassChoice &&
+      collapsibleOpened &&
+      subclassLoadingStatus === DataLoadingStatusEnum.NOT_INITIALIZED
+    ) {
+      this.setState({
+        subclassLoadingStatus: DataLoadingStatusEnum.LOADING,
+      });
+
+      loadAvailableSubclasses(ClassUtils.getId(charClass), {
+        cancelToken: new axios.CancelToken((c) => {
+          this.loadSubclassesCanceler = c;
+        }),
+      })
+        .then((response) => {
+          let subclassData: Array<ClassDefinitionContract> = [];
+
+          const data = ApiAdapterUtils.getResponseData(response);
+          if (data !== null) {
+            subclassData = data;
+          }
+
+          this.setState({
+            subclassData,
+            subclassLoadingStatus: DataLoadingStatusEnum.LOADED,
+          });
+          this.loadSubclassesCanceler = null;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    }
+  };
+
+  componentWillUnmount(): void {
+    if (this.loadFeatsCanceler !== null) {
+      this.loadFeatsCanceler();
+    }
+    if (this.loadSubclassesCanceler !== null) {
+      this.loadSubclassesCanceler();
+    }
+  }
+
+  hasFeatChoice = (props: Props): boolean => {
+    const { feature } = props;
+
+    const choices = ClassFeatureUtils.getChoices(feature);
+    return choices.some(
+      (choice) =>
+        ChoiceUtils.getType(choice) ===
+        Constants.BuilderChoiceTypeEnum.FEAT_CHOICE_OPTION
+    );
+  };
+
+  hasSubclassChoice = (props: Props): boolean => {
+    const { feature } = props;
+
+    const choices = ClassFeatureUtils.getChoices(feature);
+    return choices.some(
+      (choice) =>
+        ChoiceUtils.getType(choice) ===
+        Constants.BuilderChoiceTypeEnum.SUB_CLASS_OPTION
+    );
+  };
+
+  isDataLoaded = (): boolean => {
+    const {
+      hasSubclassChoice,
+      hasFeatChoice,
+      subclassLoadingStatus,
+      featLoadingStatus,
+    } = this.state;
+
+    if (hasSubclassChoice) {
+      if (subclassLoadingStatus !== DataLoadingStatusEnum.LOADED) {
+        return false;
+      }
+    }
+    if (hasFeatChoice) {
+      if (featLoadingStatus !== DataLoadingStatusEnum.LOADED) {
+        return false;
+      }
+    }
+
+    return true;
+  };
+
+  handleCollapsibleOpened = (id: string, state: boolean): void => {
+    this.setState({
+      collapsibleOpened: state,
+    });
+  };
+
+  handleChoiceChange = (
+    id: string,
+    type: number,
+    value: any,
+    parentChoiceId: string | null
+  ): void => {
+    const { onChoiceChange, feature } = this.props;
+
+    if (onChoiceChange) {
+      onChoiceChange(
+        ClassFeatureUtils.getId(feature),
+        id,
+        type,
+        HelperUtils.parseInputInt(value),
+        parentChoiceId
+      );
+    }
+  };
+
+  getAvailableInfusionChoices = (): Array<InfusionChoice> => {
+    const { feature } = this.props;
+
+    return ClassFeatureUtils.getInfusionChoices(feature).filter(
+      InfusionChoiceUtils.validateIsAvailable
+    );
+  };
+
+  getInfusionChoiceCount = (): number => {
+    return this.getAvailableInfusionChoices().length;
+  };
+
+  getTodoInfusionChoiceCount = (): number => {
+    return this.getAvailableInfusionChoices().filter(
+      (infusionChoice) =>
+        InfusionChoiceUtils.getKnownInfusion(infusionChoice) === null
+    ).length;
+  };
+
+  getInfusionItemChoiceCount = (): number => {
+    return this.getAvailableInfusionChoices().filter((infusionChoice) => {
+      const knownInfusion =
+        InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+      if (knownInfusion === null) {
+        return false;
+      }
+      const simulatedInfusion =
+        KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+      if (simulatedInfusion === null) {
+        return false;
+      }
+      return (
+        InfusionUtils.getType(simulatedInfusion) ===
+        Constants.InfusionTypeEnum.REPLICATE
+      );
+    }).length;
+  };
+
+  getTodoInfusionItemChoiceCount = (): number => {
+    return this.getAvailableInfusionChoices().filter((infusionChoice) => {
+      const knownInfusion =
+        InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+      if (knownInfusion === null) {
+        return false;
+      }
+      const simulatedInfusion =
+        KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+      if (simulatedInfusion === null) {
+        return false;
+      }
+      if (
+        InfusionUtils.getType(simulatedInfusion) !==
+        Constants.InfusionTypeEnum.REPLICATE
+      ) {
+        return false;
+      }
+      if (KnownInfusionUtils.getItemId(knownInfusion) !== null) {
+        return false;
+      }
+      return true;
+    }).length;
+  };
+
+  getChoiceCount = (): number => {
+    const { feature } = this.props;
+    return ClassFeatureUtils.getChoices(feature).length;
+  };
+
+  getTodoChoiceCount = (): number => {
+    const { feature } = this.props;
+    return ClassFeatureUtils.getChoices(feature).filter(ChoiceUtils.isTodo)
+      .length;
+  };
+
+  getTotalChoiceCount = (): number => {
+    return (
+      this.getChoiceCount() +
+      this.getInfusionChoiceCount() +
+      this.getInfusionItemChoiceCount()
+    );
+  };
+
+  getTotalTodoCount = (): number => {
+    return (
+      this.getTodoChoiceCount() +
+      this.getTodoInfusionChoiceCount() +
+      this.getTodoInfusionItemChoiceCount()
+    );
+  };
+
+  getSubclassSources = (
+    subclass: ClassDefinitionContract
+  ): Array<SourceData> => {
+    const { ruleData } = this.props;
+
+    if (subclass.sources === null) {
+      return [];
+    }
+
+    return subclass.sources
+      .map((sourceMapping) =>
+        HelperUtils.lookupDataOrFallback(
+          RuleDataUtils.getSourceDataLookup(ruleData),
+          sourceMapping.sourceId
+        )
+      )
+      .filter(TypeScriptUtils.isNotNullOrUndefined);
+  };
+
+  getSubclassData = (): Array<ClassDefinitionContract> => {
+    const { subclassData } = this.state;
+    const { charClass } = this.props;
+
+    let data: Array<ClassDefinitionContract> = [...subclassData];
+
+    let existingSubclass = ClassUtils.getSubclass(charClass);
+    if (
+      existingSubclass !== null &&
+      !data.some(
+        (classDefinition) =>
+          existingSubclass !== null &&
+          classDefinition.id === existingSubclass.id
+      )
+    ) {
+      data.push(existingSubclass);
+    }
+
+    return data;
+  };
+
+  getClassFeatureDescription = (): string => {
+    const { feature, isStartingClass } = this.props;
+
+    const multiClassDescription =
+      ClassFeatureUtils.getMultiClassDescription(feature);
+    if (
+      !isStartingClass &&
+      multiClassDescription &&
+      multiClassDescription.length > 0
+    ) {
+      return multiClassDescription;
+    }
+
+    const description = ClassFeatureUtils.getDescription(feature);
+    return description === null ? "" : description;
+  };
+
+  renderChoices = (): React.ReactNode => {
+    const { isActive, feature, charClass } = this.props;
+    const { featData } = this.state;
+
+    if (!isActive) {
+      return null;
+    }
+
+    const choices = ClassFeatureUtils.getChoices(feature);
+
+    if (choices === null) {
+      return null;
+    }
+
+    return choices.map((choice) => (
+      <FeatureChoice
+        choice={choice}
+        charClass={charClass}
+        feature={feature}
+        featsData={featData}
+        subclassData={this.getSubclassData()}
+        onChoiceChange={this.handleChoiceChange}
+        key={ChoiceUtils.getId(choice)}
+      />
+    ));
+  };
+
+  getMetaItems = () => {
+    const { feature, optionalClassFeatureLookup, definitionPool } = this.props;
+    const choiceCount = this.getTotalChoiceCount();
+    const featureType = ClassFeatureUtils.getFeatureType(feature);
+    let metaItems: Array<string> = [];
+    // Display the number of choices if there are any
+    if (choiceCount) {
+      metaItems.push(`${choiceCount} Choice${choiceCount !== 1 ? "s" : ""}`);
+    }
+    // Display the required level
+    metaItems.push(
+      `${FormatUtils.ordinalize(
+        ClassFeatureUtils.getRequiredLevel(feature)
+      )} level`
+    );
+    // Display that this is an optional class feature if it is
+    if (featureType !== Constants.FeatureTypeEnum.GRANTED) {
+      metaItems.push("Optional Class Feature");
+    }
+    // Display the feature that this feature replaces if it is a replacement
+    if (featureType === Constants.FeatureTypeEnum.REPLACEMENT) {
+      const optionalFeature = HelperUtils.lookupDataOrFallback(
+        optionalClassFeatureLookup,
+        ClassFeatureUtils.getDefinitionKey(feature)
+      );
+
+      if (optionalFeature) {
+        const affectedDefinitionKey =
+          OptionalClassFeatureUtils.getAffectedClassFeatureDefinitionKey(
+            optionalFeature
+          );
+
+        if (affectedDefinitionKey) {
+          const replacedFeature = ClassFeatureUtils.simulateClassFeature(
+            affectedDefinitionKey,
+            definitionPool
+          );
+
+          if (replacedFeature) {
+            metaItems.push(
+              `Replaces ${ClassFeatureUtils.getName(replacedFeature)}`
+            );
+          }
+        }
+      }
+    }
+
+    return metaItems;
+  };
+
+  render() {
+    const {
+      isActive,
+      charClass,
+      definitionPool,
+      ruleData,
+      globalModifiers,
+      typeValueLookup,
+      loadAvailableInfusions,
+      onInfusionChoiceItemChangePromise,
+      onInfusionChoiceItemDestroyPromise,
+      onInfusionChoiceCreatePromise,
+      onInfusionChoiceDestroyPromise,
+      onInfusionChoiceChangePromise,
+      onDefinitionsLoaded,
+      knownReplicatedItems,
+      knownInfusionLookup,
+      feature,
+      inventoryManager,
+    } = this.props;
+    const { hasSubclassChoice, hasFeatChoice } = this.state;
+
+    // If the class feature grants feats, render those instead of the class feature.
+    if (feature.featLists.length > 0) {
+      return feature.featLists.map((fl) => (
+        <GrantedFeat
+          featList={fl}
+          key={fl.definition.id}
+          requiredLevel={ClassFeatureUtils.getRequiredLevel(feature)}
+        />
+      ));
+    }
+
+    const conClsNames: Array<string> = ["class-manager-feature-name"];
+    let contentNode: React.ReactNode;
+
+    if (isActive) {
+      if (this.getTotalTodoCount() > 0) {
+        conClsNames.push("collapsible-todo");
+      }
+
+      if (hasFeatChoice || hasSubclassChoice) {
+        if (this.isDataLoaded()) {
+          contentNode = this.renderChoices();
+        } else {
+          contentNode = <LoadingPlaceholder />;
+        }
+      } else {
+        contentNode = this.renderChoices();
+      }
+    }
+    const hasChoices = this.getTotalTodoCount() > 0;
+    const accordionId = ClassFeatureUtils.getId(feature).toString();
+
+    return (
+      <Accordion
+        id={accordionId}
+        summary={ClassFeatureUtils.getName(feature)}
+        summaryMetaItems={this.getMetaItems()}
+        variant="paper"
+        showAlert={hasChoices}
+        handleIsOpen={this.handleCollapsibleOpened}
+      >
+        <CollapsibleContent className="class-manager-feature-description">
+          {this.getClassFeatureDescription()}
+        </CollapsibleContent>
+        {isActive && hasSubclassChoice && (
+          <div className="ct-character-tools__marketplace-callout">
+            Looking for something not in the list below? Unlock all official
+            options in the <Link href="/marketplace">Marketplace</Link>.
+          </div>
+        )}
+        {contentNode}
+        {isActive && (
+          <InfusionChoiceManager
+            infusionChoices={this.getAvailableInfusionChoices()}
+            contextLevel={ClassUtils.getLevel(charClass)}
+            definitionPool={definitionPool}
+            ruleData={ruleData}
+            globalModifiers={globalModifiers}
+            typeValueLookup={typeValueLookup}
+            knownInfusionLookup={knownInfusionLookup}
+            knownReplicatedItems={knownReplicatedItems}
+            loadAvailableInfusions={loadAvailableInfusions}
+            onInfusionChoiceItemChangePromise={
+              onInfusionChoiceItemChangePromise
+            }
+            onInfusionChoiceItemDestroyPromise={
+              onInfusionChoiceItemDestroyPromise
+            }
+            onInfusionChoiceChangePromise={onInfusionChoiceChangePromise}
+            onInfusionChoiceDestroyPromise={onInfusionChoiceDestroyPromise}
+            onInfusionChoiceCreatePromise={onInfusionChoiceCreatePromise}
+            onDefinitionsLoaded={onDefinitionsLoaded}
+            inventoryManager={inventoryManager}
+          />
+        )}
+      </Accordion>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManagerFeature/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManagerFeature/index.ts
new file mode 100644
index 0000000..956cf5f
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassManagerFeature/index.ts
@@ -0,0 +1,4 @@
+import ClassManagerFeature from "./ClassManagerFeature";
+
+export default ClassManagerFeature;
+export { ClassManagerFeature };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassesManage.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassesManage.tsx
new file mode 100644
index 0000000..6949db6
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/ClassesManage.tsx
@@ -0,0 +1,1091 @@
+import React from "react";
+import { useContext } from "react";
+import { DispatchProp } from "react-redux";
+import { NavigateFunction, useNavigate } from "react-router-dom";
+
+import {
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiResponse,
+  BaseSpellContract,
+  characterActions,
+  CharacterPreferences,
+  CharClass,
+  ChoiceData,
+  ClassDefinitionContract,
+  ClassSpellInfo,
+  Constants,
+  DataOriginRefData,
+  DefinitionContract,
+  DefinitionPool,
+  DefinitionUtils,
+  EntitledEntity,
+  FeatLookup,
+  FeatDefinitionContract,
+  HelperUtils,
+  InfusionChoiceLookup,
+  InfusionChoiceUtils,
+  InfusionDefinitionContract,
+  InfusionUtils,
+  KnownInfusionUtils,
+  Modifier,
+  OverallSpellInfo,
+  PrerequisiteData,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  serviceDataActions,
+  serviceDataSelectors,
+  Spell,
+  SpellCasterInfo,
+  TypeValueLookup,
+  InfusionChoice,
+  ClassFeatureDefinitionContract,
+  ClassFeatureUtils,
+  ClassSpellListSpellsLookup,
+  OptionalClassFeatureLookup,
+  OptionalClassFeatureUtils,
+  CharacterTheme,
+  InventoryLookup,
+  ItemUtils,
+  InventoryManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HpSummary } from "~/subApps/builder/components/HpSummary";
+import { RouteKey } from "~/subApps/builder/constants";
+import {
+  ModalData,
+  useModalManager,
+} from "~/subApps/builder/contexts/ModalManager";
+
+import { SimpleClassSpellList } from "../../../../Shared/components/SimpleClassSpellList";
+import { InventoryManagerContext } from "../../../../Shared/managers/InventoryManagerContext";
+import { apiCreatorSelectors } from "../../../../Shared/selectors";
+import {
+  MakeClassBasedApiClassFeaturesRequest,
+  MakeClassBasedApiSpellsRequest,
+} from "../../../../Shared/selectors/composite/apiCreator";
+import { AppNotificationUtils } from "../../../../Shared/utils";
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import { navigationConfig } from "../../../config";
+import { ProgressionManager } from "../../ProgressionManager";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+import ClassManager from "./ClassManager";
+
+function getClassSpellList(
+  charClass: CharClass,
+  classSpellLists: Array<ClassSpellInfo>
+): ClassSpellInfo | null {
+  const foundClassSpellList = classSpellLists.find(
+    (classSpellList) => classSpellList.charClass.id === charClass.id
+  );
+  return foundClassSpellList ? foundClassSpellList : null;
+}
+
+interface Props extends DispatchProp {
+  ruleData: RuleData;
+  overallSpellInfo: OverallSpellInfo;
+  prerequisiteData: PrerequisiteData;
+  totalClassLevel: number;
+  choiceInfo: ChoiceData;
+  classSpellLists: Array<ClassSpellInfo>;
+  spellCasterInfo: SpellCasterInfo;
+  preferences: CharacterPreferences;
+  globalModifiers: Array<Modifier>;
+  typeValueLookup: TypeValueLookup;
+  definitionPool: DefinitionPool;
+  classes: Array<CharClass>;
+  loadAvailableOptionalClassFeatures: MakeClassBasedApiClassFeaturesRequest;
+  loadAvailableSubclasses: (
+    baseClassId: number,
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<Array<ClassDefinitionContract>>>;
+  loadAvailableFeats: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<Array<FeatDefinitionContract>>>;
+  loadAvailableInfusions: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<
+    ApiResponse<EntitledEntity<InfusionDefinitionContract>>
+  >;
+  makeLoadClassAlwaysKnownSpells: MakeClassBasedApiSpellsRequest;
+  makeLoadClassRemainingSpells: MakeClassBasedApiSpellsRequest;
+  infusionChoiceLookup: InfusionChoiceLookup;
+  featLookup: FeatLookup;
+  knownInfusionLookup: Record<string, InfusionChoice>;
+  knownReplicatedItems: Array<string>;
+  dataOriginRefData: DataOriginRefData;
+  classSpellListSpellsLookup: ClassSpellListSpellsLookup;
+  optionalClassFeatureLookup: OptionalClassFeatureLookup;
+  theme: CharacterTheme;
+  inventoryLookup: InventoryLookup;
+  inventoryManager: InventoryManager;
+  navigate: NavigateFunction;
+  characterId: number;
+  activeSourceCategories: Array<number>;
+  createModal: (modalData: ModalData) => void;
+}
+
+class ClassesManage extends React.PureComponent<Props> {
+  handleInfusionChoiceItemChangePromise = (
+    choiceKey: string,
+    infusionId: string,
+    itemDefinitionKey: string | null,
+    itemName: string | null,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    // Bag of Holding change to something else
+    const {
+      dispatch,
+      createModal,
+      infusionChoiceLookup,
+      inventoryLookup,
+      inventoryManager,
+    } = this.props;
+
+    let itemId: string | null = null;
+    let itemTypeId: string | null = null;
+    if (itemDefinitionKey !== null) {
+      itemId = DefinitionUtils.getDefinitionKeyId(itemDefinitionKey);
+      itemTypeId = DefinitionUtils.getDefinitionKeyType(itemDefinitionKey);
+    }
+
+    const infusionChoice = HelperUtils.lookupDataOrFallback(
+      infusionChoiceLookup,
+      choiceKey
+    );
+    if (infusionChoice === null) {
+      reject();
+      return;
+    }
+    const infusion = InfusionChoiceUtils.getInfusion(infusionChoice);
+
+    if (infusion) {
+      const knownInfusion =
+        InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+      let knownInfusionItemName: string | null = null;
+      if (knownInfusion !== null) {
+        knownInfusionItemName = KnownInfusionUtils.getItemName(knownInfusion);
+      }
+      const infusionId = InfusionUtils.getId(infusion);
+      if (infusionId === null) {
+        reject();
+        return;
+      }
+
+      // Get the item
+      const inventoryMappingId = InfusionUtils.getInventoryMappingId(infusion);
+      const item = HelperUtils.lookupDataOrFallback(
+        inventoryLookup,
+        inventoryMappingId
+      );
+
+      createModal({
+        content: (
+          <div>
+            <p>
+              You are about to remove the existing replicated item{" "}
+              <strong>{knownInfusionItemName}</strong>.
+            </p>
+            <p>
+              Are you sure you want to change your choice to{" "}
+              <strong>{itemName}</strong>?
+            </p>
+          </div>
+        ),
+        props: {
+          heading: "Change Infusion Item Warning",
+          color: "secondary",
+          size: "fit-content",
+          onConfirm: () => {
+            if (item) {
+              const isContainer = ItemUtils.isContainer(item);
+
+              if (isContainer) {
+                inventoryManager.handleRemove({ item });
+                dispatch(
+                  serviceDataActions.knownInfusionMappingSet(
+                    choiceKey,
+                    infusionId,
+                    itemId,
+                    itemTypeId,
+                    itemName
+                  )
+                );
+                accept();
+                return;
+              }
+            }
+            dispatch(
+              serviceDataActions.infusionMappingDestroy(
+                infusionId,
+                InfusionUtils.getInventoryMappingId(infusion)
+              )
+            );
+            dispatch(
+              serviceDataActions.knownInfusionMappingSet(
+                choiceKey,
+                infusionId,
+                itemId,
+                itemTypeId,
+                itemName
+              )
+            );
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    } else {
+      dispatch(
+        serviceDataActions.knownInfusionMappingSet(
+          choiceKey,
+          infusionId,
+          itemId,
+          itemTypeId,
+          itemName
+        )
+      );
+      accept();
+    }
+  };
+
+  handleInfusionChoiceItemDestroyPromise = (
+    choiceKey: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const {
+      dispatch,
+      createModal,
+      infusionChoiceLookup,
+      inventoryLookup,
+      inventoryManager,
+    } = this.props;
+
+    const infusionChoice = HelperUtils.lookupDataOrFallback(
+      infusionChoiceLookup,
+      choiceKey
+    );
+    if (infusionChoice === null) {
+      reject();
+      return;
+    }
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      reject();
+      return;
+    }
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+      reject();
+      return;
+    }
+    const simulatedInfusionId = InfusionUtils.getId(simulatedInfusion);
+    if (simulatedInfusionId === null) {
+      reject();
+      return;
+    }
+
+    const infusion = InfusionChoiceUtils.getInfusion(infusionChoice);
+
+    if (infusion) {
+      const infusionId = InfusionUtils.getId(infusion);
+      if (infusionId === null) {
+        reject();
+        return;
+      }
+
+      // Get the item
+      const inventoryMappingId = InfusionUtils.getInventoryMappingId(infusion);
+      const item = HelperUtils.lookupDataOrFallback(
+        inventoryLookup,
+        inventoryMappingId
+      );
+
+      createModal({
+        content: (
+          <div>
+            <p>
+              Are you sure you want to remove the existing replicated item{" "}
+              <strong>{KnownInfusionUtils.getItemName(knownInfusion)}</strong>?
+            </p>
+          </div>
+        ),
+        props: {
+          heading: "Remove Infusion Item Warning",
+          variant: "remove",
+          confirmButtonText: "Remove",
+          size: "fit-content",
+          onConfirm: () => {
+            if (item) {
+              const isContainer = ItemUtils.isContainer(item);
+
+              if (isContainer) {
+                inventoryManager.handleRemove({ item });
+                dispatch(
+                  serviceDataActions.knownInfusionMappingSet(
+                    choiceKey,
+                    simulatedInfusionId,
+                    null,
+                    null,
+                    null
+                  )
+                );
+                accept();
+                return;
+              }
+            }
+            dispatch(
+              serviceDataActions.infusionMappingDestroy(
+                infusionId,
+                InfusionUtils.getInventoryMappingId(infusion)
+              )
+            );
+            dispatch(
+              serviceDataActions.knownInfusionMappingSet(
+                choiceKey,
+                simulatedInfusionId,
+                null,
+                null,
+                null
+              )
+            );
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    } else {
+      dispatch(
+        serviceDataActions.knownInfusionMappingSet(
+          choiceKey,
+          simulatedInfusionId,
+          null,
+          null,
+          null
+        )
+      );
+      accept();
+    }
+  };
+
+  handleInfusionChoiceChangePromise = (
+    choiceKey: string,
+    infusionId: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    // Changing from replicate magic item to something else
+
+    const {
+      dispatch,
+      createModal,
+      infusionChoiceLookup,
+      definitionPool,
+      inventoryLookup,
+      inventoryManager,
+    } = this.props;
+
+    const infusionChoice = HelperUtils.lookupDataOrFallback(
+      infusionChoiceLookup,
+      choiceKey
+    );
+    if (infusionChoice === null) {
+      reject();
+      return;
+    }
+    const infusion = InfusionChoiceUtils.getInfusion(infusionChoice);
+
+    // if an infusion exists
+    if (infusion) {
+      const knownInfusion =
+        InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+      let knownInfusionName: string | null = null;
+      if (knownInfusion !== null) {
+        const simulatedInfusion =
+          KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+        if (simulatedInfusion !== null) {
+          knownInfusionName = InfusionUtils.getName(simulatedInfusion);
+        }
+      }
+
+      const definitionKey = DefinitionUtils.generateDefinitionKey(
+        Constants.DefinitionTypeEnum.INFUSION,
+        infusionId
+      );
+      const newInfusion = InfusionUtils.simulateInfusion(
+        definitionKey,
+        definitionPool
+      );
+      let newInfusionName: string | null = null;
+      if (newInfusion !== null) {
+        newInfusionName = InfusionUtils.getName(newInfusion);
+      }
+
+      const destroyInfusionId = InfusionUtils.getId(infusion);
+      if (destroyInfusionId === null) {
+        reject();
+        return;
+      }
+
+      // Get the item
+      const inventoryMappingId = InfusionUtils.getInventoryMappingId(infusion);
+      const item = HelperUtils.lookupDataOrFallback(
+        inventoryLookup,
+        inventoryMappingId
+      );
+
+      createModal({
+        content: (
+          <div>
+            <p>
+              You are about to remove all infusion data related to the{" "}
+              <strong>{knownInfusionName}</strong> Infusion.
+            </p>
+            <p>
+              Are you sure you want to change your infusion to{" "}
+              <strong>{newInfusionName}</strong>?
+            </p>
+          </div>
+        ),
+        props: {
+          heading: "Change Infusion Warning",
+          color: "secondary",
+          size: "fit-content",
+          onConfirm: () => {
+            if (item) {
+              const isContainer = ItemUtils.isContainer(item);
+
+              if (isContainer) {
+                inventoryManager.handleRemove({ item });
+                dispatch(
+                  serviceDataActions.knownInfusionMappingSet(
+                    choiceKey,
+                    infusionId,
+                    null,
+                    null,
+                    null
+                  )
+                );
+                accept();
+                return;
+              }
+            }
+            dispatch(
+              serviceDataActions.infusionMappingDestroy(
+                destroyInfusionId,
+                InfusionUtils.getInventoryMappingId(infusion)
+              )
+            );
+            dispatch(
+              serviceDataActions.knownInfusionMappingSet(
+                choiceKey,
+                infusionId,
+                null,
+                null,
+                null
+              )
+            );
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    } else {
+      dispatch(
+        serviceDataActions.knownInfusionMappingSet(
+          choiceKey,
+          infusionId,
+          null,
+          null,
+          null
+        )
+      );
+      accept();
+    }
+  };
+
+  handleInfusionChoiceDestroyPromise = (
+    choiceKey: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const {
+      dispatch,
+      createModal,
+      infusionChoiceLookup,
+      inventoryLookup,
+      inventoryManager,
+    } = this.props;
+
+    const infusionChoice = HelperUtils.lookupDataOrFallback(
+      infusionChoiceLookup,
+      choiceKey
+    );
+    if (infusionChoice === null) {
+      reject();
+      return;
+    }
+    const infusion = InfusionChoiceUtils.getInfusion(infusionChoice);
+
+    // if an infusion exists
+    if (infusion) {
+      const knownInfusion =
+        InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+      let knownInfusionName: string | null = null;
+      if (knownInfusion !== null) {
+        const simulatedInfusion =
+          KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+        if (simulatedInfusion !== null) {
+          knownInfusionName = InfusionUtils.getName(simulatedInfusion);
+        }
+      }
+
+      // Get the item
+      const inventoryMappingId = InfusionUtils.getInventoryMappingId(infusion);
+      const item = HelperUtils.lookupDataOrFallback(
+        inventoryLookup,
+        inventoryMappingId
+      );
+
+      createModal({
+        content: (
+          <div>
+            <p>
+              Are you sure you want to remove all infusion data related to the{" "}
+              <strong>{knownInfusionName}</strong> Infusion?
+            </p>
+          </div>
+        ),
+        props: {
+          heading: "Remove Infusion Warning",
+          variant: "remove",
+          size: "fit-content",
+          onConfirm: () => {
+            if (item) {
+              const isContainer = ItemUtils.isContainer(item);
+
+              if (isContainer) {
+                inventoryManager.handleRemove({ item });
+                dispatch(
+                  serviceDataActions.knownInfusionMappingDestroy(choiceKey)
+                );
+                accept();
+                return;
+              }
+            }
+            dispatch(serviceDataActions.knownInfusionMappingDestroy(choiceKey));
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    } else {
+      dispatch(serviceDataActions.knownInfusionMappingDestroy(choiceKey));
+      accept();
+    }
+  };
+
+  handleInfusionChoiceCreatePromise = (
+    choiceKey: string,
+    infusionId: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { dispatch } = this.props;
+
+    dispatch(
+      serviceDataActions.knownInfusionMappingCreate(choiceKey, infusionId)
+    );
+    accept();
+  };
+
+  handleOptionalFeatureSelection = (
+    definitionKey: string,
+    affectedClassFeatureDefinitionKey: string | null
+  ): void => {
+    const { dispatch } = this.props;
+
+    const classFeatureId =
+      DefinitionUtils.hack__getDefinitionKeyId(definitionKey);
+    if (!classFeatureId) {
+      return;
+    }
+
+    const affectedClassFeatureId = affectedClassFeatureDefinitionKey
+      ? DefinitionUtils.hack__getDefinitionKeyId(
+          affectedClassFeatureDefinitionKey
+        )
+      : null;
+
+    dispatch(
+      characterActions.optionalClassFeatureCreate(
+        classFeatureId,
+        affectedClassFeatureId
+      )
+    );
+  };
+
+  handleRemoveOptionalFeatureSelectionPromise = (
+    definitionKey: string,
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const {
+      dispatch,
+      createModal,
+      optionalClassFeatureLookup,
+      classSpellListSpellsLookup,
+    } = this.props;
+
+    const optionalFeature = HelperUtils.lookupDataOrFallback(
+      optionalClassFeatureLookup,
+      definitionKey
+    );
+    if (!optionalFeature) {
+      return;
+    }
+
+    const optionalClassFeature =
+      OptionalClassFeatureUtils.getClassFeature(optionalFeature);
+    if (!optionalClassFeature) {
+      return;
+    }
+
+    const classFeatureId =
+      OptionalClassFeatureUtils.getClassFeatureId(optionalFeature);
+    const spellListIds =
+      OptionalClassFeatureUtils.getRemoveMappingSpellListIds(optionalFeature);
+    const hasSpellsToRemove = spellListIds.some((id) =>
+      classSpellListSpellsLookup.hasOwnProperty(id)
+    );
+
+    if (!hasSpellsToRemove) {
+      dispatch(characterActions.optionalClassFeatureDestroy(classFeatureId));
+      accept();
+    } else {
+      createModal({
+        content: (
+          <div>
+            <p>
+              You are about to remove{" "}
+              <strong>{ClassFeatureUtils.getName(optionalClassFeature)}</strong>{" "}
+              from your character.
+            </p>
+            <p>
+              After doing so, the following spells provided by this feature will
+              be removed from your character:
+            </p>
+            <SimpleClassSpellList
+              spellListIds={spellListIds}
+              classSpellListSpellsLookup={classSpellListSpellsLookup}
+            />
+          </div>
+        ),
+        props: {
+          heading: "Optional Feature Warning",
+          variant: "remove",
+          size: "fit-content",
+          onConfirm: () => {
+            dispatch(
+              characterActions.optionalClassFeatureDestroy(classFeatureId)
+            );
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    }
+  };
+
+  handleOnChangeOptionalClassFeatureReplacementPromise = (
+    definitionKey: string,
+    newAffectedDefinitionKey: string | null,
+    oldAffectedDefinitionKey: string | null,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const {
+      dispatch,
+      createModal,
+      optionalClassFeatureLookup,
+      classSpellListSpellsLookup,
+    } = this.props;
+
+    if (newAffectedDefinitionKey === oldAffectedDefinitionKey) {
+      return;
+    }
+
+    const optionalFeature = HelperUtils.lookupDataOrFallback(
+      optionalClassFeatureLookup,
+      definitionKey
+    );
+    if (!optionalFeature) {
+      return;
+    }
+
+    const optionalClassFeature =
+      OptionalClassFeatureUtils.getClassFeature(optionalFeature);
+    if (!optionalClassFeature) {
+      return;
+    }
+
+    const classFeatureId =
+      OptionalClassFeatureUtils.getClassFeatureId(optionalFeature);
+    const newAffectedClassFeatureId: number | null = newAffectedDefinitionKey
+      ? DefinitionUtils.hack__getDefinitionKeyId(newAffectedDefinitionKey)
+      : null;
+    const spellListIds =
+      OptionalClassFeatureUtils.getUpdateMappingSpellListIdsToRemove(
+        optionalFeature,
+        {
+          affectedClassFeatureId: newAffectedClassFeatureId,
+        }
+      );
+    const hasSpellsToRemove = spellListIds.some((id) =>
+      classSpellListSpellsLookup.hasOwnProperty(id)
+    );
+
+    if (!hasSpellsToRemove) {
+      dispatch(
+        characterActions.optionalClassFeatureSetRequest(
+          classFeatureId,
+          newAffectedClassFeatureId
+        )
+      );
+      accept();
+    } else {
+      createModal({
+        content: (
+          <div>
+            <p>
+              You are about to change the Class Feature to be replaced by{" "}
+              <strong>{ClassFeatureUtils.getName(optionalClassFeature)}</strong>
+              .
+            </p>
+            <p>
+              After doing so, the following spells provided by this feature will
+              be removed from your character:
+            </p>
+            <SimpleClassSpellList
+              spellListIds={spellListIds}
+              classSpellListSpellsLookup={classSpellListSpellsLookup}
+            />
+          </div>
+        ),
+        props: {
+          heading: "Optional Feature Warning",
+          variant: "remove",
+          size: "fit-content",
+          onConfirm: () => {
+            dispatch(
+              characterActions.optionalClassFeatureSetRequest(
+                classFeatureId,
+                newAffectedClassFeatureId
+              )
+            );
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    }
+  };
+
+  handleSpellAdd = (
+    charClass: CharClass,
+    spell: Spell,
+    classMappingId: number
+  ): void => {
+    const { dispatch } = this.props;
+    dispatch(
+      characterActions.spellCreate(
+        spell,
+        classMappingId,
+        AppNotificationUtils.handleSpellCreateAccepted.bind(
+          this,
+          spell,
+          charClass
+        )
+      )
+    );
+  };
+
+  handlePrepare = (spell: Spell, characterClassId: number): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.spellPreparedSet(spell, characterClassId, true));
+  };
+
+  handleUnprepare = (spell: Spell, characterClassId: number): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.spellPreparedSet(spell, characterClassId, false));
+  };
+
+  handleRemove = (spell: Spell, characterClassId: number): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.spellRemove(spell, characterClassId));
+  };
+
+  handleAlwaysKnownLoad = (
+    spells: Array<BaseSpellContract>,
+    classId: number
+  ): void => {
+    const { dispatch } = this.props;
+    dispatch(serviceDataActions.classAlwaysKnownSpellsSet(spells, classId));
+  };
+
+  handleClassFeatureChoiceChange = (
+    classId: number,
+    classFeatureId: number,
+    choiceType: any,
+    choiceId: string,
+    optionValue: number | null,
+    parentChoiceId: string | null
+  ): void => {
+    const { dispatch } = this.props;
+    dispatch(
+      characterActions.classFeatureChoiceSetRequest(
+        classId,
+        classFeatureId,
+        choiceType,
+        choiceId,
+        optionValue,
+        parentChoiceId
+      )
+    );
+  };
+
+  handleDefinitionsLoaded = (
+    definitions: Array<DefinitionContract>,
+    accessTypes: Record<string, number>
+  ): void => {
+    const { dispatch } = this.props;
+    dispatch(serviceDataActions.definitionPoolAdd(definitions, accessTypes));
+  };
+
+  handleFeatureDefinitionsLoaded = (
+    entitledData: EntitledEntity<ClassFeatureDefinitionContract>
+  ): void => {
+    const { dispatch } = this.props;
+
+    dispatch(
+      serviceDataActions.definitionPoolAdd(
+        entitledData.definitionData,
+        entitledData.accessTypes
+      )
+    );
+  };
+
+  handleAddAnotherClass = (): void => {
+    const { navigate, characterId } = this.props;
+    navigate(
+      navigationConfig
+        .getRouteDefPath(RouteKey.CLASS_CHOOSE)
+        .replace(":characterId", characterId)
+    );
+  };
+
+  render() {
+    const {
+      classes,
+      totalClassLevel,
+      choiceInfo,
+      classSpellLists,
+      spellCasterInfo,
+      preferences,
+      ruleData,
+      loadAvailableFeats,
+      loadAvailableSubclasses,
+      loadAvailableInfusions,
+      loadAvailableOptionalClassFeatures,
+      makeLoadClassAlwaysKnownSpells,
+      makeLoadClassRemainingSpells,
+      globalModifiers,
+      typeValueLookup,
+      definitionPool,
+      overallSpellInfo,
+      prerequisiteData,
+      featLookup,
+      knownReplicatedItems,
+      knownInfusionLookup,
+      dataOriginRefData,
+      classSpellListSpellsLookup,
+      optionalClassFeatureLookup,
+      theme,
+      activeSourceCategories,
+      inventoryManager,
+    } = this.props;
+
+    const levelsRemaining: number = Math.max(
+      0,
+      RuleDataUtils.getMaxCharacterLevel(ruleData) - totalClassLevel
+    );
+
+    return (
+      <Page clsNames={["classes-manage"]}>
+        <PageBody>
+          <div className="classes-manage-primary">
+            <div className="classes-manage-primary-section classes-manage-primary-section-progression">
+              <ProgressionManager />
+            </div>
+            <HpSummary />
+          </div>
+          {classes.map((charClass) => (
+            <ClassManager
+              theme={theme}
+              charClass={charClass}
+              loadAvailableFeats={loadAvailableFeats}
+              loadAvailableSubclasses={loadAvailableSubclasses}
+              loadRemainingSpellList={makeLoadClassRemainingSpells(charClass)}
+              loadAlwaysKnownSpells={makeLoadClassAlwaysKnownSpells(charClass)}
+              loadAvailableOptionalClassFeatures={loadAvailableOptionalClassFeatures(
+                charClass
+              )}
+              loadAvailableInfusions={loadAvailableInfusions}
+              levelsRemaining={levelsRemaining}
+              onClassFeatureChoiceChange={this.handleClassFeatureChoiceChange}
+              onSpellPrepare={this.handlePrepare}
+              onSpellUnprepare={this.handleUnprepare}
+              onSpellRemove={this.handleRemove}
+              onSpellAdd={this.handleSpellAdd.bind(this, charClass)}
+              onAlwaysKnownLoad={this.handleAlwaysKnownLoad}
+              onInfusionChoiceItemChangePromise={
+                this.handleInfusionChoiceItemChangePromise
+              }
+              onInfusionChoiceItemDestroyPromise={
+                this.handleInfusionChoiceItemDestroyPromise
+              }
+              onInfusionChoiceChangePromise={
+                this.handleInfusionChoiceChangePromise
+              }
+              onInfusionChoiceDestroyPromise={
+                this.handleInfusionChoiceDestroyPromise
+              }
+              onInfusionChoiceCreatePromise={
+                this.handleInfusionChoiceCreatePromise
+              }
+              onOptionalFeatureSelection={this.handleOptionalFeatureSelection}
+              onRemoveSelectionPromise={
+                this.handleRemoveOptionalFeatureSelectionPromise
+              }
+              onChangeReplacementPromise={
+                this.handleOnChangeOptionalClassFeatureReplacementPromise
+              }
+              onDefinitionsLoaded={this.handleDefinitionsLoaded}
+              onFeatureDefinitionsLoaded={this.handleFeatureDefinitionsLoaded}
+              key={charClass.id}
+              isMulticlass={classes.length > 1}
+              choiceInfo={choiceInfo}
+              preferences={preferences}
+              classSpellList={getClassSpellList(charClass, classSpellLists)}
+              spellCasterInfo={spellCasterInfo}
+              ruleData={ruleData}
+              overallSpellInfo={overallSpellInfo}
+              prerequisiteData={prerequisiteData}
+              typeValueLookup={typeValueLookup}
+              globalModifiers={globalModifiers}
+              definitionPool={definitionPool}
+              featLookup={featLookup}
+              knownInfusionLookup={knownInfusionLookup}
+              knownReplicatedItems={knownReplicatedItems}
+              dataOriginRefData={dataOriginRefData}
+              optionalClassFeatureLookup={optionalClassFeatureLookup}
+              classSpellListSpellsLookup={classSpellListSpellsLookup}
+              activeSourceCategories={activeSourceCategories}
+              inventoryManager={inventoryManager}
+            />
+          ))}
+          {levelsRemaining !== 0 && (
+            <div className="classes-manage-actions">
+              <div
+                className="classes-manage-actions-action"
+                onClick={this.handleAddAnotherClass}
+              >
+                + Add Another Class
+              </div>
+            </div>
+          )}
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+function ClassesManageContainer(props) {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const navigate = useNavigate();
+  const { createModal } = useModalManager();
+
+  return (
+    <ClassesManage
+      inventoryManager={inventoryManager}
+      navigate={navigate}
+      createModal={createModal}
+      {...props}
+    />
+  );
+}
+
+export default ConnectedBuilderPage(
+  ClassesManageContainer,
+  RouteKey.CLASS_MANAGE,
+  (state) => {
+    return {
+      classes: rulesEngineSelectors.getClasses(state),
+      classSpellLists: rulesEngineSelectors.getClassSpellLists(state),
+      loadAvailableFeats: apiCreatorSelectors.makeLoadAvailableFeats(state),
+      loadAvailableSubclasses:
+        apiCreatorSelectors.makeLoadAvailableSubclasses(state),
+      loadAvailableInfusions:
+        apiCreatorSelectors.makeLoadAvailableInfusions(state),
+      loadAvailableOptionalClassFeatures:
+        apiCreatorSelectors.makeLoadAvailableOptionalClassFeatures(state),
+      makeLoadClassRemainingSpells:
+        apiCreatorSelectors.makeLoadClassRemainingSpells(state),
+      makeLoadClassAlwaysKnownSpells:
+        apiCreatorSelectors.makeLoadClassAlwaysKnownSpells(state),
+      totalClassLevel: rulesEngineSelectors.getTotalClassLevel(state),
+      choiceInfo: rulesEngineSelectors.getChoiceInfo(state),
+      preferences: rulesEngineSelectors.getCharacterPreferences(state),
+      spellCasterInfo: rulesEngineSelectors.getSpellCasterInfo(state),
+      overallSpellInfo: rulesEngineSelectors.getOverallSpellInfo(state),
+      ruleData: rulesEngineSelectors.getRuleData(state),
+      prerequisiteData: rulesEngineSelectors.getPrerequisiteData(state),
+      globalModifiers: rulesEngineSelectors.getValidGlobalModifiers(state),
+      typeValueLookup:
+        rulesEngineSelectors.getCharacterValueLookupByType(state),
+      definitionPool: serviceDataSelectors.getDefinitionPool(state),
+      infusionChoiceLookup: rulesEngineSelectors.getInfusionChoiceLookup(state),
+      featLookup: rulesEngineSelectors.getFeatLookup(state),
+      knownInfusionLookup: rulesEngineSelectors.getKnownInfusionLookup(state),
+      knownReplicatedItems: rulesEngineSelectors.getKnownReplicatedItems(state),
+      classSpellListSpellsLookup:
+        rulesEngineSelectors.getClassSpellListSpellsLookup(state),
+      dataOriginRefData: rulesEngineSelectors.getDataOriginRefData(state),
+      optionalClassFeatureLookup:
+        rulesEngineSelectors.getOptionalClassFeatureLookup(state),
+      theme: rulesEngineSelectors.getCharacterTheme(state),
+      inventoryLookup: rulesEngineSelectors.getInventoryLookup(state),
+      characterId: rulesEngineSelectors.getId(state),
+      activeSourceCategories:
+        rulesEngineSelectors.getActiveSourceCategories(state),
+    };
+  }
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/OptionalFeatureManager/OptionalFeatureManager.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/OptionalFeatureManager/OptionalFeatureManager.tsx
new file mode 100644
index 0000000..5900e22
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/OptionalFeatureManager/OptionalFeatureManager.tsx
@@ -0,0 +1,374 @@
+import axios, { Canceler } from "axios";
+import React from "react";
+
+import {
+  MarketplaceCta,
+  LoadingPlaceholder,
+} from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterUtils,
+  CharClass,
+  ClassFeature,
+  ClassFeatureUtils,
+  Constants,
+  DefinitionPool,
+  DefinitionPoolUtils,
+  DefinitionUtils,
+  OptionalClassFeature,
+  OptionalClassFeatureLookup,
+  OptionalClassFeatureUtils,
+  ClassUtils,
+  HelperUtils,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Link } from "~/components/Link";
+
+import DataLoadingStatusEnum from "../../../../../Shared/constants/DataLoadingStatusEnum";
+import {
+  ApiClassFeatureResponseData,
+  ApiClassFeaturesRequest,
+} from "../../../../../Shared/selectors/composite/apiCreator";
+import { AppLoggerUtils, TypeScriptUtils } from "../../../../../Shared/utils";
+import { OptionalFeature } from "../../../../components/OptionalFeature";
+import { AffectedFeatureInfo } from "../../../../components/OptionalFeature/OptionalFeature";
+import { PageSubHeader } from "../../../../components/PageSubHeader";
+
+interface OptionalFeatureManagerProps {
+  charClass: CharClass;
+  definitionPool: DefinitionPool;
+  optionalClassFeatureLookup: OptionalClassFeatureLookup;
+  loadAvailableOptionalClassFeatures?: ApiClassFeaturesRequest | null;
+  onDefinitionsLoaded?: (definitionData: ApiClassFeatureResponseData) => void;
+  onSelection: (
+    definitionKey: string,
+    affectedClassFeatureDefinitionKey: string | null
+  ) => void;
+  onChangeReplacementPromise?: (
+    definitionKey: string,
+    newAffectedDefinitionKey: string | null,
+    oldAffectedDefinitionKey: string | null,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onRemoveSelectionPromise?: (
+    definitionKey: string,
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  ruleData: RuleData;
+}
+interface OptionalFeatureManagerState {
+  loadingStatus: DataLoadingStatusEnum;
+}
+export class OptionalFeatureManager extends React.PureComponent<
+  OptionalFeatureManagerProps,
+  OptionalFeatureManagerState
+> {
+  loadOptionalOriginsCanceler: null | Canceler = null;
+
+  constructor(props: OptionalFeatureManagerProps) {
+    super(props);
+
+    this.state = {
+      loadingStatus: DataLoadingStatusEnum.NOT_LOADED,
+    };
+  }
+
+  componentDidMount() {
+    const { loadAvailableOptionalClassFeatures, onDefinitionsLoaded } =
+      this.props;
+
+    const { loadingStatus } = this.state;
+
+    if (
+      loadAvailableOptionalClassFeatures &&
+      loadingStatus === DataLoadingStatusEnum.NOT_LOADED
+    ) {
+      this.setState({
+        loadingStatus: DataLoadingStatusEnum.LOADING,
+      });
+
+      loadAvailableOptionalClassFeatures({
+        cancelToken: new axios.CancelToken((c) => {
+          this.loadOptionalOriginsCanceler = c;
+        }),
+      })
+        .then((response) => {
+          let data = ApiAdapterUtils.getResponseData(response);
+          if (data?.definitionData.length && onDefinitionsLoaded) {
+            onDefinitionsLoaded(data);
+          }
+
+          this.setState({
+            loadingStatus: DataLoadingStatusEnum.LOADED,
+          });
+          this.loadOptionalOriginsCanceler = null;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    } else {
+      this.setState({
+        loadingStatus: DataLoadingStatusEnum.LOADED,
+      });
+    }
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadOptionalOriginsCanceler !== null) {
+      this.loadOptionalOriginsCanceler();
+    }
+  }
+
+  getAffectedFeatureInfos = (
+    optionalClassFeature: ClassFeature
+  ): Array<AffectedFeatureInfo> => {
+    const { definitionPool, charClass } = this.props;
+
+    return ClassFeatureUtils.getAffectedFeatureDefinitionKeys(
+      optionalClassFeature
+    )
+      .map((definitionKey: string) =>
+        ClassFeatureUtils.simulateClassFeature(definitionKey, definitionPool)
+      )
+      .filter(TypeScriptUtils.isNotNullOrUndefined)
+      .map((affectedClassFeature: ClassFeature) => {
+        const definitionKey =
+          ClassFeatureUtils.getDefinitionKey(affectedClassFeature);
+        let disabled = ClassUtils.getOptionalClassFeatures(charClass).some(
+          (optionalFeatureMapping: OptionalClassFeature) =>
+            OptionalClassFeatureUtils.getDefinitionKey(
+              optionalFeatureMapping
+            ) !== ClassFeatureUtils.getDefinitionKey(optionalClassFeature) &&
+            OptionalClassFeatureUtils.getAffectedClassFeatureDefinitionKey(
+              optionalFeatureMapping
+            ) === definitionKey
+        );
+
+        return {
+          name: ClassFeatureUtils.getName(affectedClassFeature),
+          definitionKey,
+          disabled,
+        };
+      });
+  };
+
+  renderOptionalFeatureCta = (): React.ReactNode => {
+    return (
+      <div className="ct-optional-feature-manager__content">
+        <div className="ct-optional-feature-manager__content--empty">
+          <span>
+            You currently have no available optional class features for this
+            class
+          </span>
+          <div className="ct-character-tools__marketplace-callout">
+            Unlock all official options in the{" "}
+            <Link href="/marketplace">Marketplace</Link> or create them for{" "}
+            <Link href="/my-creations">Homebrew</Link> Subclasses.
+          </div>
+        </div>
+      </div>
+    );
+  };
+
+  render() {
+    const { loadingStatus } = this.state;
+    const {
+      definitionPool,
+      charClass,
+      optionalClassFeatureLookup,
+      onChangeReplacementPromise,
+      onRemoveSelectionPromise,
+      onSelection,
+    } = this.props;
+
+    let contentNode: React.ReactNode;
+    if (loadingStatus !== DataLoadingStatusEnum.LOADED) {
+      contentNode = <LoadingPlaceholder />;
+    } else {
+      let availableOptionalFeatures: Array<ClassFeature> =
+        DefinitionPoolUtils.getTypedDefinitionList(
+          Constants.DefinitionTypeEnum.CLASS_FEATURE,
+          definitionPool
+        )
+          .map((featureDefinition) =>
+            ClassFeatureUtils.simulateClassFeature(
+              DefinitionUtils.getDefinitionKey(featureDefinition),
+              definitionPool
+            )
+          )
+          .filter(TypeScriptUtils.isNotNullOrUndefined)
+          .filter((classFeature) =>
+            ClassFeatureUtils.isValidClassClassFeature(charClass, classFeature)
+          )
+          .filter(
+            (classFeature) =>
+              ClassFeatureUtils.getFeatureType(classFeature) !==
+              Constants.FeatureTypeEnum.GRANTED
+          );
+
+      let availableOptionalClassFeatureLookup =
+        HelperUtils.generateNonNullLookup(
+          availableOptionalFeatures,
+          ClassFeatureUtils.getDefinitionKey
+        );
+
+      const unEntitledOptionalClassFeatures: Array<ClassFeature> = [];
+      Object.keys(optionalClassFeatureLookup).forEach((definitionKey) => {
+        if (
+          !availableOptionalClassFeatureLookup.hasOwnProperty(definitionKey)
+        ) {
+          const classFeature = ClassFeatureUtils.simulateClassFeature(
+            definitionKey,
+            definitionPool
+          );
+          if (
+            classFeature &&
+            ClassFeatureUtils.isValidClassClassFeature(charClass, classFeature)
+          ) {
+            unEntitledOptionalClassFeatures.push(classFeature);
+          }
+        }
+      });
+
+      const consolidatedOptionalOrigins = [
+        ...availableOptionalFeatures,
+        ...unEntitledOptionalClassFeatures,
+      ].filter(
+        (feature) =>
+          !ClassFeatureUtils.getHideInContext(
+            feature,
+            Constants.AppContextTypeEnum.BUILDER
+          )
+      );
+
+      if (!consolidatedOptionalOrigins.length) {
+        contentNode = this.renderOptionalFeatureCta();
+      } else {
+        const replacementFeatures: Array<ClassFeature> = [];
+        const additionalFeatures: Array<ClassFeature> = [];
+        consolidatedOptionalOrigins.forEach((feature) => {
+          switch (ClassFeatureUtils.getFeatureType(feature)) {
+            case Constants.FeatureTypeEnum.ADDITIONAL:
+              additionalFeatures.push(feature);
+              break;
+            case Constants.FeatureTypeEnum.REPLACEMENT:
+              replacementFeatures.push(feature);
+              break;
+            default:
+            //not implemented
+          }
+        });
+
+        contentNode = (
+          <div className="ct-optional-feature-manager__content">
+            {replacementFeatures.length > 0 && (
+              <React.Fragment>
+                <PageSubHeader>Replacement Features</PageSubHeader>
+                {ClassUtils.deriveOrderedClassFeatures(replacementFeatures).map(
+                  (feature) => {
+                    const optionalFeatureMapping =
+                      HelperUtils.lookupDataOrFallback(
+                        optionalClassFeatureLookup,
+                        ClassFeatureUtils.getDefinitionKey(feature)
+                      );
+                    const affectedFeatureDefinitionKey: string | null =
+                      optionalFeatureMapping
+                        ? OptionalClassFeatureUtils.getAffectedClassFeatureDefinitionKey(
+                            optionalFeatureMapping
+                          )
+                        : null;
+
+                    return (
+                      <OptionalFeature
+                        key={ClassFeatureUtils.getDefinitionKey(feature)}
+                        name={ClassFeatureUtils.getName(feature)}
+                        description={ClassFeatureUtils.getDescription(feature)}
+                        requiredLevel={ClassFeatureUtils.getRequiredLevel(
+                          feature
+                        )}
+                        featureType={ClassFeatureUtils.getFeatureType(feature)}
+                        definitionKey={ClassFeatureUtils.getDefinitionKey(
+                          feature
+                        )}
+                        affectedFeatureDefinitionKey={
+                          affectedFeatureDefinitionKey
+                        }
+                        isSelected={!!optionalFeatureMapping ?? false}
+                        onSelection={onSelection}
+                        onChangeReplacementPromise={onChangeReplacementPromise}
+                        onRemoveSelectionPromise={onRemoveSelectionPromise}
+                        affectedFeatures={this.getAffectedFeatureInfos(feature)}
+                        accessType={ClassFeatureUtils.getAccessType(feature)}
+                      />
+                    );
+                  }
+                )}
+              </React.Fragment>
+            )}
+            {additionalFeatures.length > 0 && (
+              <React.Fragment>
+                <PageSubHeader>Additional Features</PageSubHeader>
+                {ClassUtils.deriveOrderedClassFeatures(additionalFeatures).map(
+                  (feature) => {
+                    const optionalFeatureMapping =
+                      HelperUtils.lookupDataOrFallback(
+                        optionalClassFeatureLookup,
+                        ClassFeatureUtils.getDefinitionKey(feature)
+                      );
+                    const affectedFeatureDefinitionKey: string | null =
+                      optionalFeatureMapping
+                        ? OptionalClassFeatureUtils.getAffectedClassFeatureDefinitionKey(
+                            optionalFeatureMapping
+                          )
+                        : null;
+
+                    return (
+                      <OptionalFeature
+                        key={ClassFeatureUtils.getDefinitionKey(feature)}
+                        name={ClassFeatureUtils.getName(feature)}
+                        description={ClassFeatureUtils.getDescription(feature)}
+                        requiredLevel={ClassFeatureUtils.getRequiredLevel(
+                          feature
+                        )}
+                        featureType={ClassFeatureUtils.getFeatureType(feature)}
+                        definitionKey={ClassFeatureUtils.getDefinitionKey(
+                          feature
+                        )}
+                        affectedFeatureDefinitionKey={
+                          affectedFeatureDefinitionKey
+                        }
+                        isSelected={!!optionalFeatureMapping ?? false}
+                        onSelection={onSelection}
+                        onChangeReplacementPromise={onChangeReplacementPromise}
+                        onRemoveSelectionPromise={onRemoveSelectionPromise}
+                        affectedFeatures={this.getAffectedFeatureInfos(feature)}
+                        accessType={ClassFeatureUtils.getAccessType(feature)}
+                      />
+                    );
+                  }
+                )}
+              </React.Fragment>
+            )}
+          </div>
+        );
+      }
+    }
+
+    return (
+      <div className="ct-optional-feature-manager">
+        <div className="ct-optional-feature-manager__intro">
+          Unlike the features in the Player’s Handbook, you don’t gain the
+          features here automatically. Consulting with your DM, you decide
+          whether to gain a feature in this section if you meet the level
+          requirement noted in the feature’s description. These features can be
+          selected separately from one another; you can use some, all, or none
+          of them.
+        </div>
+        {contentNode}
+      </div>
+    );
+  }
+}
+
+export default OptionalFeatureManager;
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/index.ts
new file mode 100644
index 0000000..ac0da12
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/ClassesManage/index.ts
@@ -0,0 +1,5 @@
+import ClassManagerFeature from "./ClassManagerFeature";
+import ClassesManage from "./ClassesManage";
+
+export default ClassesManage;
+export { ClassesManage, ClassManagerFeature };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/ConnectedBuilderPage/ConnectedBuilderPage.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/ConnectedBuilderPage/ConnectedBuilderPage.tsx
new file mode 100644
index 0000000..b897b8e
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/ConnectedBuilderPage/ConnectedBuilderPage.tsx
@@ -0,0 +1,55 @@
+import React from "react";
+import { connect } from "react-redux";
+import { Navigate } from "react-router-dom";
+
+import { navigationConfig } from "../../../config";
+import { BuilderAppState } from "../../../typings";
+import { NavigationUtils } from "../../../utils";
+
+interface Props {
+  isPageAccessible: boolean;
+  redirectRoute?: string | null;
+}
+const BuilderPage = (Wrapped) =>
+  class extends React.PureComponent<Props> {
+    render() {
+      const { isPageAccessible, redirectRoute } = this.props;
+
+      if (!isPageAccessible && redirectRoute) {
+        return <Navigate to={redirectRoute} />;
+      }
+
+      return (
+        <div>
+          <Wrapped {...this.props} />
+        </div>
+      );
+    }
+  };
+
+const ConnectedBuilderPage = (
+  Wrapped,
+  routeKey,
+  wrappedMapStateToProps = (state: BuilderAppState): any => ({})
+) => {
+  function mapStateToProps(state: BuilderAppState) {
+    // const isPageAccessible = checkIsRouteAccessible(routeKey, state);
+
+    const isPageAccessible = NavigationUtils.checkStdBuilderPageRequirements(
+      navigationConfig.getRouteDef(routeKey),
+      state
+    );
+
+    return {
+      ...wrappedMapStateToProps(state),
+      isPageAccessible,
+      redirectRoute: isPageAccessible
+        ? null
+        : NavigationUtils.getAvailableRouteRedirect(routeKey, state),
+    };
+  }
+
+  return connect(mapStateToProps)(BuilderPage(Wrapped));
+};
+
+export default ConnectedBuilderPage;
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/ConnectedBuilderPage/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/ConnectedBuilderPage/index.ts
new file mode 100644
index 0000000..4357aaf
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/ConnectedBuilderPage/index.ts
@@ -0,0 +1,4 @@
+import ConnectedBuilderPage from "./ConnectedBuilderPage";
+
+export default ConnectedBuilderPage;
+export { ConnectedBuilderPage };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionHelp/DescriptionHelp.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionHelp/DescriptionHelp.tsx
new file mode 100644
index 0000000..336f012
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionHelp/DescriptionHelp.tsx
@@ -0,0 +1,54 @@
+import React from "react";
+
+import { RouteKey } from "~/subApps/builder/constants";
+
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import PageHeader from "../../../components/PageHeader";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+
+interface Props {}
+class DescriptionHelp extends React.PureComponent<Props> {
+  render() {
+    return (
+      <Page>
+        <PageBody>
+          <PageHeader>Background</PageHeader>
+          <p>
+            Your character’s background describes where they came from, their
+            original occupation, and their place in the D&amp;D world.
+          </p>
+
+          <p>
+            Backgrounds from the Core D&amp;D source category give your
+            character ability score increases, an Origin feat, and proficiencies
+            in specific skills and tools.
+          </p>
+
+          <p>
+            Backgrounds from other sources give your character a background
+            feature (a general benefit) and proficiency in two skills, and it
+            might also give you additional languages or proficiency with certain
+            kinds of tools.
+          </p>
+
+          <PageHeader>Describe Your Character</PageHeader>
+          <p>
+            In this step, you will flesh your character out as a person. Your
+            character needs a name.
+          </p>
+
+          <p>
+            You’ll need to decide your character’s appearance and personality.
+            Choose your character’s alignment (the moral compass that guides his
+            or her decisions) and ideals. Identify the things your character
+            holds most dear, called bonds, and the flaws that could one day
+            undermine them.
+          </p>
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+export default ConnectedBuilderPage(DescriptionHelp, RouteKey.DESCRIPTION_HELP);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionHelp/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionHelp/index.ts
new file mode 100644
index 0000000..23e1288
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionHelp/index.ts
@@ -0,0 +1,4 @@
+import DescriptionHelp from "./DescriptionHelp";
+
+export default DescriptionHelp;
+export { DescriptionHelp };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionManage/DescriptionManage.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionManage/DescriptionManage.tsx
new file mode 100644
index 0000000..0429b60
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionManage/DescriptionManage.tsx
@@ -0,0 +1,1635 @@
+import axios, { Canceler } from "axios";
+import { orderBy } from "lodash";
+import React, { HTMLAttributes, useContext } from "react";
+import { DispatchProp } from "react-redux";
+
+import { LoadingPlaceholder, Select } from "@dndbeyond/character-components/es";
+import {
+  AlignmentContract,
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiAdapterUtils,
+  ApiResponse,
+  Background,
+  BackgroundCharacteristicContract,
+  BackgroundContract,
+  BackgroundDefinitionContract,
+  BackgroundUtils,
+  characterActions,
+  CharacterFeaturesManager,
+  CharacterLifestyleContract,
+  CharacterNotes,
+  CharacterPreferences,
+  CharacterTraits,
+  Choice,
+  ChoiceData,
+  ChoiceUtils,
+  Constants,
+  DefinitionPool,
+  DefinitionUtils,
+  FeatDefinitionContract,
+  FeatLookup,
+  FeatureChoiceOption,
+  HelperUtils,
+  HtmlSelectOption,
+  HtmlSelectOptionGroup,
+  Modifier,
+  ModifierUtils,
+  OptionalOriginLookup,
+  PrerequisiteData,
+  Race,
+  RuleData,
+  ruleDataSelectors,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  serviceDataSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Accordion } from "~/components/Accordion";
+import { CollapsibleContent } from "~/components/CollapsibleContent";
+import { HelperTextAccordion } from "~/components/HelperTextAccordion";
+import { HtmlContent } from "~/components/HtmlContent";
+import { Link } from "~/components/Link";
+import { useSource } from "~/hooks/useSource";
+import { EditorWithDialog } from "~/subApps/builder/components/EditorWithDialog";
+import { RouteKey } from "~/subApps/builder/constants";
+import {
+  ModalData,
+  useModalManager,
+} from "~/subApps/builder/contexts/ModalManager";
+import { FormInputField } from "~/tools/js/Shared/components/common/FormInputField";
+import { DetailChoice } from "~/tools/js/Shared/containers/DetailChoice";
+
+import { toastMessageActions } from "../../../../Shared/actions";
+import SuggestionTable from "../../../../Shared/components/SuggestionTable";
+import { CHARACTER_DESCRIPTION_NUMBER_VALUE } from "../../../../Shared/constants/App";
+import DataLoadingStatusEnum from "../../../../Shared/constants/DataLoadingStatusEnum";
+import { CharacterFeaturesManagerContext } from "../../../../Shared/managers/CharacterFeaturesManagerContext";
+import {
+  apiCreatorSelectors,
+  appEnvSelectors,
+} from "../../../../Shared/selectors";
+import { AppLoggerUtils } from "../../../../Shared/utils";
+import Button from "../../../components/Button";
+import { GrantedFeat } from "../../../components/GrantedFeat/GrantedFeat";
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import PageSubHeader from "../../../components/PageSubHeader";
+import { BuilderAppState } from "../../../typings";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+import styles from "./styles.module.css";
+
+interface CustomBackgroundManagerProps {
+  backgroundData: BackgroundDefinitionContract[];
+  name: string | null;
+  description: string | null;
+  featureId: number | null;
+  characteristicsId: number | null;
+  modifierType: number | null;
+  onSave: (properties: any) => void;
+}
+interface CustomBackgroundManagerState {
+  name: string | null;
+  description: string | null;
+  featureId: number | null;
+  characteristicsId: number | null;
+  modifierType: number | null;
+}
+class CustomBackgroundManager extends React.PureComponent<
+  CustomBackgroundManagerProps,
+  CustomBackgroundManagerState
+> {
+  constructor(props: CustomBackgroundManagerProps) {
+    super(props);
+
+    const { name, description, featureId, characteristicsId, modifierType } =
+      props;
+
+    this.state = {
+      name,
+      description,
+      featureId,
+      characteristicsId,
+      modifierType,
+    };
+  }
+
+  getStateProperties = (): any => {
+    const { name, description, featureId, characteristicsId, modifierType } =
+      this.state;
+    return {
+      name,
+      description,
+      featureId,
+      characteristicsId,
+      modifierType,
+    };
+  };
+
+  handleSave = (): void => {
+    const { onSave } = this.props;
+
+    if (onSave) {
+      onSave(this.getStateProperties());
+    }
+  };
+
+  handleMetaDataSet = (propertyKey: string, value: any): void => {
+    this.setState((prevState: CustomBackgroundManagerState) => ({
+      ...prevState,
+      [propertyKey]: value,
+    }));
+  };
+
+  handleTextInputBlur = (
+    propertyKey: string,
+    evt: React.FocusEvent<HTMLInputElement>
+  ): void => {
+    const value = evt.target.value;
+    this.handleMetaDataSet(propertyKey, value);
+  };
+
+  handleNumberSelectChange = (propertyKey: string, value: string): void => {
+    this.handleMetaDataSet(propertyKey, HelperUtils.parseInputInt(value));
+  };
+
+  render() {
+    const { backgroundData } = this.props;
+    const { name, description, featureId, characteristicsId, modifierType } =
+      this.state;
+
+    const orderedBackgrounds: BackgroundDefinitionContract[] = orderBy(
+      backgroundData,
+      (backgroundDefinition) => backgroundDefinition.name
+    );
+    const backgroundDataOptions: HtmlSelectOption[] = orderedBackgrounds.map(
+      (bg) => ({
+        label: bg.name,
+        value: bg.id,
+      })
+    );
+
+    let featureOptions = backgroundDataOptions;
+    let characteristicsOptions = backgroundDataOptions;
+    // TODO change this to use rules engine enum once available
+    let modifierTypeOptions: HtmlSelectOption[] = [
+      {
+        label: "2 Skills and 2 Tools",
+        value: Constants.BackgroundModifierTypeEnum.TWO_TOOLS,
+      },
+      {
+        label: "2 Skills and 2 Languages",
+        value: Constants.BackgroundModifierTypeEnum.TWO_LANGUAGES,
+      },
+      {
+        label: "2 Skills, 1 Tool, and 1 Language",
+        value: Constants.BackgroundModifierTypeEnum.ONE_TOOL_ONE_LANGUAGE,
+      },
+    ];
+
+    return (
+      <div className="custom-background">
+        <div className="custom-background-editor">
+          <div className="custom-background-properties">
+            <div className="custom-background-property custom-background-property-full">
+              <div className="custom-background-property-value">
+                <input
+                  type="text"
+                  defaultValue={name ? name : ""}
+                  onBlur={this.handleTextInputBlur.bind(this, "name")}
+                />
+              </div>
+              <div className="custom-background-property-label">Name</div>
+            </div>
+            <div className="custom-background-property custom-background-property-textarea">
+              <div className="custom-background-property-value">
+                <textarea
+                  defaultValue={description ? description : ""}
+                  onBlur={this.handleTextInputBlur.bind(this, "description")}
+                />
+              </div>
+              <div className="custom-background-property-label">
+                Description
+              </div>
+            </div>
+            <div className="custom-background-property custom-background-property-choice">
+              <div className="custom-background-property-value">
+                <Select
+                  onChange={this.handleNumberSelectChange.bind(
+                    this,
+                    "modifierType"
+                  )}
+                  options={modifierTypeOptions}
+                  value={modifierType}
+                  clsNames={[""]}
+                />
+              </div>
+              <div className="custom-background-property-label">
+                Proficiency/Language Choices
+              </div>
+            </div>
+            <div className="custom-background-property custom-background-property-choice">
+              <div className="custom-background-property-value">
+                <Select
+                  onChange={this.handleNumberSelectChange.bind(
+                    this,
+                    "featureId"
+                  )}
+                  options={featureOptions}
+                  value={featureId}
+                  clsNames={[""]}
+                />
+              </div>
+              <div className="custom-background-property-label">
+                Background Feature
+              </div>
+            </div>
+            <div className="custom-background-property custom-background-property-choice">
+              <div className="custom-background-property-value">
+                <Select
+                  onChange={this.handleNumberSelectChange.bind(
+                    this,
+                    "characteristicsId"
+                  )}
+                  options={characteristicsOptions}
+                  value={characteristicsId}
+                  clsNames={[""]}
+                />
+              </div>
+              <div className="custom-background-property-label">
+                Background Characteristics
+              </div>
+            </div>
+          </div>
+          <div className="custom-background-actions">
+            <Button onClick={this.handleSave}>Save</Button>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+interface Props extends DispatchProp {
+  ruleData: RuleData;
+  background: Background | null;
+  currentBackground: BackgroundContract | null;
+  alignmentData: AlignmentContract[];
+  alignment: AlignmentContract | null;
+  lifestyleData: CharacterLifestyleContract[];
+  lifestyle: CharacterLifestyleContract | null;
+  faith: string | null;
+  traits: CharacterTraits;
+  notes: CharacterNotes;
+  hair: string | null;
+  skin: string | null;
+  eyes: string | null;
+  height: string | null;
+  weight: number | null;
+  age: number | null;
+  gender: string | null;
+  isMobile: boolean;
+  choiceInfo: ChoiceData;
+  species: Race;
+  featLookup: FeatLookup;
+  prerequisiteData: PrerequisiteData;
+  preferences: CharacterPreferences;
+  optionalOriginLookup: OptionalOriginLookup;
+  definitionPool: DefinitionPool;
+  languages: Modifier[];
+  loadAvailableFeats: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<FeatDefinitionContract[]>>;
+  loadAvailableBackgrounds: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<BackgroundDefinitionContract[]>>;
+  characterFeaturesManager: CharacterFeaturesManager;
+  getGroupedOptionsBySourceCategory: (
+    backgrounds: BackgroundDefinitionContract[]
+  ) => HtmlSelectOptionGroup[];
+  createModal: (modal: ModalData) => void;
+}
+interface State {
+  customizeCollapsed: boolean;
+  backgroundData: BackgroundDefinitionContract[];
+  loadingStatus: DataLoadingStatusEnum;
+}
+class DescriptionManage extends React.PureComponent<Props, State> {
+  loadBackgroundsCanceler: null | Canceler = null;
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      customizeCollapsed: !this.isCustomBackgroundEmpty(props.background),
+      backgroundData: [],
+      loadingStatus: DataLoadingStatusEnum.NOT_INITIALIZED,
+    };
+  }
+
+  componentDidMount(): void {
+    const { loadAvailableBackgrounds } = this.props;
+
+    this.setState({
+      loadingStatus: DataLoadingStatusEnum.LOADING,
+    });
+
+    loadAvailableBackgrounds({
+      cancelToken: new axios.CancelToken((c) => {
+        this.loadBackgroundsCanceler = c;
+      }),
+    })
+      .then((response) => {
+        let apiData: BackgroundDefinitionContract[] = [];
+
+        const data = ApiAdapterUtils.getResponseData(response);
+        if (data !== null) {
+          apiData = data;
+        }
+
+        this.setState({
+          backgroundData: apiData,
+          loadingStatus: DataLoadingStatusEnum.LOADED,
+        });
+        this.loadBackgroundsCanceler = null;
+      })
+      .catch(AppLoggerUtils.handleAdhocApiError);
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadBackgroundsCanceler !== null) {
+      this.loadBackgroundsCanceler();
+    }
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { background } = this.props;
+
+    // if you have a custom background, and the previous background was not a custom background
+    if (
+      background &&
+      background.hasCustomBackground &&
+      prevProps.background &&
+      background.hasCustomBackground !==
+        prevProps.background.hasCustomBackground
+    ) {
+      // collapse it if you already have config in your custom background
+      this.setState({
+        customizeCollapsed: !this.isCustomBackgroundEmpty(background),
+      });
+    }
+  }
+
+  isCustomBackgroundEmpty = (background: Background | null): boolean => {
+    if (background === null) {
+      return false;
+    }
+
+    if (background.customBackground === null) {
+      return false;
+    }
+
+    const {
+      name,
+      description,
+      featuresBackground,
+      characteristicsBackground,
+      backgroundType,
+    } = background.customBackground;
+
+    return (
+      name === null &&
+      description === null &&
+      featuresBackground === null &&
+      characteristicsBackground === null &&
+      backgroundType === null
+    );
+  };
+
+  hasCharacteristics = (
+    backgroundDefinition: BackgroundDefinitionContract | null
+  ): boolean => {
+    if (backgroundDefinition === null) {
+      return false;
+    }
+
+    let { flaws, ideals, bonds, personalityTraits } = backgroundDefinition;
+    return (
+      (flaws !== null && flaws.length !== 0) ||
+      (ideals !== null && ideals.length !== 0) ||
+      (bonds !== null && bonds.length !== 0) ||
+      (personalityTraits !== null && personalityTraits.length !== 0)
+    );
+  };
+
+  getBackgroundData = (): BackgroundDefinitionContract[] => {
+    const { backgroundData } = this.state;
+    const { currentBackground } = this.props;
+
+    let data: BackgroundDefinitionContract[] = [...backgroundData];
+
+    if (
+      currentBackground !== null &&
+      !backgroundData.some(
+        (background) =>
+          currentBackground !== null &&
+          currentBackground.definition !== null &&
+          background.id === currentBackground.definition.id
+      )
+    ) {
+      if (currentBackground.definition !== null) {
+        data.push(currentBackground.definition);
+      }
+    }
+
+    return data;
+  };
+
+  getNoteContent = (noteType: string): string => {
+    const { notes } = this.props;
+
+    return notes[noteType] ? notes[noteType] : "";
+  };
+
+  getTraitContent = (traitType: string): string => {
+    const { traits } = this.props;
+
+    return traits[traitType] ? traits[traitType] : "";
+  };
+
+  handleSaveNote = (noteType: string, content: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.noteSet(noteType, content));
+  };
+
+  handleSaveTrait = (traitType: string, content: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.traitSet(traitType, content));
+  };
+
+  handleHairChange = (value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.hairSet(value));
+  };
+
+  handleSkinChange = (value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.skinSet(value));
+  };
+
+  handleEyesChange = (value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.eyesSet(value));
+  };
+
+  handleHeightChange = (value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.heightSet(value));
+  };
+
+  handleWeightChange = (value: string): void => {
+    const { dispatch } = this.props;
+    let parsedValue = HelperUtils.parseInputInt(value);
+    dispatch(characterActions.weightSet(parsedValue));
+  };
+
+  handleAgeChange = (value: string): void => {
+    const { dispatch } = this.props;
+    let parsedValue = HelperUtils.parseInputInt(value);
+    dispatch(characterActions.ageSet(parsedValue));
+  };
+
+  handleTransformValueToNumberOnBlur = (value: string): number | null => {
+    const parsedValue = HelperUtils.parseInputInt(value);
+    let clampedValue: number | null = null;
+    if (parsedValue !== null) {
+      clampedValue = HelperUtils.clampInt(
+        parsedValue,
+        CHARACTER_DESCRIPTION_NUMBER_VALUE.MIN,
+        CHARACTER_DESCRIPTION_NUMBER_VALUE.MAX
+      );
+    }
+
+    return clampedValue;
+  };
+
+  handleGenderChange = (value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.genderSet(value));
+  };
+
+  handleBackgroundChangePromise = (
+    newValue: string,
+    oldValue: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { dispatch, background, createModal } = this.props;
+
+    const newValueParsed = HelperUtils.parseInputInt(newValue);
+
+    if (newValueParsed === -1) {
+      dispatch(characterActions.backgroundHasCustomSetRequest(true));
+      accept();
+    } else {
+      if (background && background.hasCustomBackground) {
+        const backgroundData = this.getBackgroundData();
+        const selectedBackground = backgroundData.find(
+          (background) => background.id === newValueParsed
+        );
+
+        createModal({
+          content: (
+            <div className="">
+              {selectedBackground ? (
+                <p>
+                  Are you sure you want to change from your current{" "}
+                  <strong>Custom Background</strong> to{" "}
+                  <strong>{selectedBackground.name}</strong>?
+                </p>
+              ) : (
+                <p>
+                  Are you sure you want to remove your current{" "}
+                  <strong>Custom Background</strong>?
+                </p>
+              )}
+            </div>
+          ),
+          props: {
+            heading: selectedBackground
+              ? "Change Background"
+              : "Remove Background",
+            onConfirm: () => {
+              dispatch(characterActions.backgroundChoose(newValueParsed));
+              accept();
+            },
+            onClose: () => {
+              reject();
+            },
+            size: "fit-content",
+            variant: selectedBackground ? "default" : "remove",
+            confirmButtonText: selectedBackground ? "Confirm" : "Remove",
+          },
+        });
+      } else {
+        dispatch(characterActions.backgroundChoose(newValueParsed));
+        accept();
+      }
+    }
+  };
+
+  handleChoiceChange = (
+    choiceId: string,
+    choiceType: number,
+    choiceSubType: number | null,
+    optionValue: any
+  ): void => {
+    const { dispatch } = this.props;
+    dispatch(
+      characterActions.backgroundChoiceSetRequest(
+        choiceType,
+        choiceId,
+        optionValue
+      )
+    );
+  };
+
+  handleAlignmentChange = (value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.alignmentSet(HelperUtils.parseInputInt(value)));
+  };
+
+  handleLifestyleChange = (value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.lifestyleSet(HelperUtils.parseInputInt(value)));
+  };
+
+  handleFaithChange = (value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.faithSet(value));
+  };
+
+  handleCustomBackgroundSave = (properties: any): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.backgroundCustomSetRequest(properties));
+    this.setState({
+      customizeCollapsed: true,
+    });
+  };
+
+  handleConfigureClick = (evt: React.MouseEvent): void => {
+    this.setState((prevState) => ({
+      customizeCollapsed: !prevState.customizeCollapsed,
+    }));
+  };
+
+  handleBackgroundSuggestionUse = (
+    traitKey: string,
+    idx: number,
+    diceRoll: number,
+    description: string | null
+  ): void => {
+    const { dispatch } = this.props;
+
+    let newTraitContent: string = this.getTraitContent(traitKey);
+    if (newTraitContent.length) {
+      newTraitContent += "\n";
+    }
+    if (description) {
+      newTraitContent += description;
+    }
+
+    dispatch(characterActions.traitSet(traitKey, newTraitContent));
+
+    let toastTraitType: string = "";
+    switch (traitKey) {
+      case "personalityTraits":
+        toastTraitType = "Personality Trait";
+        break;
+      case "ideals":
+        toastTraitType = "Ideal";
+        break;
+      case "bonds":
+        toastTraitType = "Bond";
+        break;
+      case "flaws":
+        toastTraitType = "Flaw";
+        break;
+      default:
+      // not implemented
+    }
+
+    let descriptionMessage: string = "";
+    if (description) {
+      descriptionMessage =
+        description.length > 70
+          ? description.substr(0, 70) + "..."
+          : description;
+    }
+    dispatch(
+      toastMessageActions.toastSuccess(
+        `${toastTraitType} added to Personal Characteristics section`,
+        `${diceRoll} - ${descriptionMessage}`
+      )
+    );
+  };
+
+  handleSpeciesTraitChoiceChange = (
+    speciesTraitId,
+    choiceId,
+    choiceType,
+    optionValue
+  ): void => {
+    const { dispatch } = this.props;
+
+    dispatch(
+      characterActions.racialTraitChoiceSetRequest(
+        speciesTraitId,
+        choiceType,
+        choiceId,
+        optionValue
+      )
+    );
+  };
+
+  renderBackgroundGroupChoices = (choices: Choice[]): React.ReactNode => {
+    const { choiceInfo } = this.props;
+    return (
+      <div>
+        <div className="description-manage-background-choices-items">
+          {choices.map((choice) => {
+            let choiceId = ChoiceUtils.getId(choice);
+            let options = ChoiceUtils.getOptions(choice);
+
+            const availableOptions: Array<FeatureChoiceOption> = options.map(
+              (option) => ({
+                ...option,
+                value: option.id,
+              })
+            );
+
+            return (
+              <DetailChoice
+                {...choice}
+                choice={choice}
+                key={choiceId ? choiceId : ""}
+                options={availableOptions}
+                onChange={this.handleChoiceChange}
+                choiceInfo={choiceInfo}
+              />
+            );
+          })}
+        </div>
+      </div>
+    );
+  };
+
+  getSuggestionsHelpText = (traitKey: string, label: string): string => {
+    let text = `Describe your character's ${label}`;
+    switch (traitKey) {
+      case "personalityTraits":
+        text =
+          "What is your character like? How do their Ability Scores, like Wisdom or Charisma, contribute to their personality?";
+        break;
+      case "ideals":
+        text =
+          "What drives and motivates your character? What values do they hold most important? What are they fighting for?";
+        break;
+      case "bonds":
+        text =
+          "Whom does your character care most about? To what place do they feel a special connection? What is their most treasured possession?";
+        break;
+      case "flaws":
+        text =
+          "What are your character's vices or weaknesses? What do other people not like about them? What traits do they not like about themself? You can also consider their Ability Scores here.";
+        break;
+      default:
+    }
+    return text;
+  };
+
+  renderTextareaSuggestionList = (
+    label: string,
+    traitKey: string,
+    restrictionLabel?: string
+  ): React.ReactNode => {
+    const { background } = this.props;
+
+    if (
+      background &&
+      background.definition &&
+      background.definition[traitKey]
+    ) {
+      return background.definition[traitKey].length > 0 ? (
+        <div className="description-suggestion">
+          <div className="description-suggestion-info">
+            {this.getSuggestionsHelpText(traitKey, label)}
+          </div>
+          <div className="description-suggestion-heading">Suggestions</div>
+          <SuggestionTable
+            tableLabel={
+              label + (restrictionLabel ? ` (${restrictionLabel})` : "")
+            }
+            dieLabel={`d${background.definition[traitKey].length}`}
+            suggestions={background.definition[traitKey]}
+            onSuggestionUse={this.handleBackgroundSuggestionUse.bind(
+              this,
+              traitKey
+            )}
+          />
+        </div>
+      ) : (
+        <div className="description-suggestion">
+          <div className="description-suggestion-info">
+            {this.getSuggestionsHelpText(traitKey, label)}
+          </div>
+        </div>
+      );
+    }
+
+    return (
+      <div className="description-suggestion">
+        <div className="description-suggestion-info">
+          {this.getSuggestionsHelpText(traitKey, label)}
+        </div>
+        <div className="description-suggestion-heading">Suggestions</div>
+        <div className="description-suggestion-missing">
+          <p>Choose a background to get suggestions.</p>
+        </div>
+      </div>
+    );
+    //`
+  };
+
+  renderBackgroundSuggestionsList = (
+    suggestions: BackgroundCharacteristicContract[] | null,
+    label: string,
+    traitKey: string
+  ): React.ReactNode => {
+    if (suggestions === null) {
+      return null;
+    }
+
+    return (
+      <SuggestionTable
+        tableLabel={label}
+        dieLabel={`d${suggestions.length}`}
+        suggestions={suggestions}
+        onSuggestionUse={this.handleBackgroundSuggestionUse.bind(
+          this,
+          traitKey
+        )}
+      />
+    );
+  };
+
+  renderBackgroundSuggestionsUi = (
+    backgroundDefinition: BackgroundDefinitionContract
+  ): React.ReactNode => {
+    const { flaws, ideals, bonds, personalityTraits } = backgroundDefinition;
+
+    return (
+      <div className="background-suggestions">
+        {personalityTraits?.length
+          ? this.renderBackgroundSuggestionsList(
+              personalityTraits,
+              "Personality Traits (Choose Two)",
+              "personalityTraits"
+            )
+          : null}
+        {ideals?.length
+          ? this.renderBackgroundSuggestionsList(ideals, "Ideals", "ideals")
+          : null}
+        {bonds?.length
+          ? this.renderBackgroundSuggestionsList(bonds, "Bonds", "bonds")
+          : null}
+        {flaws?.length
+          ? this.renderBackgroundSuggestionsList(flaws, "Flaws", "flaws")
+          : null}
+      </div>
+    );
+  };
+
+  renderBackgroundDetailChoiceGroup = (
+    choices: Choice[],
+    label: string
+  ): React.ReactNode => {
+    const selectedDefaultChoices = choices.filter((choice) =>
+      ChoiceUtils.isOnlyDefaultSelected(choice)
+    );
+    let description: string = "";
+    if (selectedDefaultChoices.length) {
+      description = selectedDefaultChoices
+        .map((choice) => {
+          let defaultSubtypes = ChoiceUtils.getDefaultSubtypes(choice);
+          return defaultSubtypes ? defaultSubtypes[0] : "";
+        })
+        .join(", ");
+    }
+
+    const renderableChoices = choices.filter(
+      (choice) => !ChoiceUtils.isOnlyDefaultSelected(choice)
+    );
+
+    return (
+      <div>
+        {choices.length > 0 && (
+          <div className="description-manage-background-proficiency">
+            <span className="description-manage-background-proficiency-label">
+              {label}:
+            </span>
+            {description && (
+              <HtmlContent
+                className="description-manage-background-proficiency-desc"
+                html={description}
+                withoutTooltips
+              />
+            )}
+          </div>
+        )}
+        {renderableChoices.length > 0 &&
+          this.renderBackgroundGroupChoices(renderableChoices)}
+      </div>
+    );
+  };
+
+  renderBackgroundLanguageChoiceGroup = (
+    choices: Choice[],
+    label: string
+  ): React.ReactNode => {
+    const selectedDefaultChoices = choices.filter((choice) =>
+      ChoiceUtils.isOnlyDefaultSelected(choice)
+    );
+    let description: string = "";
+    if (selectedDefaultChoices.length) {
+      description = selectedDefaultChoices
+        .map((choice) => {
+          let defaultSubtypes = ChoiceUtils.getDefaultSubtypes(choice);
+          return defaultSubtypes ? defaultSubtypes[0] : "";
+        })
+        .join(", ");
+    }
+
+    const renderableChoices = choices.filter(
+      (choice) => !ChoiceUtils.isOnlyDefaultSelected(choice)
+    );
+
+    const hasTodoChoices: boolean = choices.some(
+      (choice) => ChoiceUtils.getOptionValue(choice) === null
+    );
+
+    return (
+      choices.length > 0 && (
+        <Accordion
+          summary={label}
+          summaryMetaItems={["Background Language"]}
+          showAlert={hasTodoChoices}
+          variant="paper"
+        >
+          <div className="description-manage-background-proficiency">
+            {description && (
+              <HtmlContent
+                className="description-manage-background-proficiency-desc"
+                html={description}
+                withoutTooltips
+              />
+            )}
+          </div>
+          {renderableChoices.length > 0 &&
+            this.renderBackgroundGroupChoices(renderableChoices)}
+        </Accordion>
+      )
+    );
+  };
+
+  renderBackgroundChoices = (
+    background: Background | null
+  ): React.ReactNode => {
+    if (background === null) {
+      return null;
+    }
+
+    const choices = BackgroundUtils.getChoices(background);
+
+    const skillChoices = choices.filter((choice) => {
+      let label = ChoiceUtils.getLabel(choice);
+      const test = label ? label.toLowerCase() : "";
+      return test.includes("choose") && test.includes("skill");
+    });
+
+    const toolChoices = choices.filter((choice) => {
+      let label = ChoiceUtils.getLabel(choice);
+      const test = label ? label.toLowerCase() : "";
+      return (
+        test.includes("choose") &&
+        (test.includes("tool") ||
+          test.includes("instrument") ||
+          test.includes("gaming set"))
+      );
+    });
+
+    const languageChoices = choices.filter((choice) => {
+      let label = ChoiceUtils.getLabel(choice);
+      const test = label ? label.toLowerCase() : "";
+      return test.includes("choose") && test.includes("language");
+    });
+
+    return (
+      <>
+        {this.renderBackgroundDetailChoiceGroup(
+          skillChoices,
+          "Skill Proficiencies"
+        )}
+        {this.renderBackgroundDetailChoiceGroup(
+          toolChoices,
+          "Tool Proficiencies"
+        )}
+        {this.renderBackgroundLanguageChoiceGroup(languageChoices, "Languages")}
+      </>
+    );
+  };
+
+  renderBackgroundFeature = (
+    backgroundDefinition: BackgroundDefinitionContract,
+    metaItems: string[] = []
+  ): React.ReactNode => {
+    const { featureName, featureDescription } = backgroundDefinition;
+
+    // Having a background feature is optional, based on whether there is a
+    // feature description or not. Technically, there could be a feature description
+    // and no feature name, which is ok.
+    if (!featureDescription) {
+      return null;
+    }
+
+    return (
+      <Accordion
+        summary={featureName || "Feature"}
+        summaryMetaItems={["Background Feature", ...metaItems]}
+        variant="paper"
+      >
+        <HtmlContent html={featureDescription} withoutTooltips />
+      </Accordion>
+    );
+  };
+
+  renderBackgroundDetailsUi = (): React.ReactNode => {
+    const { background, isMobile } = this.props;
+
+    if (background === null) {
+      return null;
+    }
+
+    const shortDescription = BackgroundUtils.getShortDescription(background);
+
+    return (
+      <div className={styles.accordionGroup}>
+        {isMobile ? (
+          <CollapsibleContent className="description-manage-background-description">
+            {shortDescription || ""}
+          </CollapsibleContent>
+        ) : (
+          <HtmlContent
+            className="description-manage-background-description"
+            html={shortDescription ? shortDescription : ""}
+            withoutTooltips
+          />
+        )}
+
+        {this.renderBackgroundChoices(background)}
+        {background.definition &&
+          this.renderBackgroundFeature(background.definition)}
+
+        {background.featLists.map((fl) => (
+          <GrantedFeat featList={fl} key={fl.definition.id} />
+        ))}
+
+        {this.hasCharacteristics(background.definition) && (
+          <Accordion summary="Suggested Characteristics" variant="paper">
+            {background.definition &&
+              this.renderBackgroundSuggestionsUi(background.definition)}
+          </Accordion>
+        )}
+      </div>
+    );
+  };
+
+  renderCustomBackgroundUI = (): React.ReactNode => {
+    const { customizeCollapsed } = this.state;
+    const { background } = this.props;
+
+    if (background === null) {
+      return null;
+    }
+
+    if (background.customBackground === null) {
+      return null;
+    }
+
+    const {
+      name,
+      description,
+      featuresBackground,
+      characteristicsBackground,
+      backgroundType,
+    } = background.customBackground;
+
+    let metaItems: string[] = [];
+    if (characteristicsBackground?.name) {
+      metaItems.push(characteristicsBackground.name);
+    }
+
+    return (
+      <div>
+        {!customizeCollapsed && (
+          <CustomBackgroundManager
+            backgroundData={this.getBackgroundData()}
+            name={name}
+            description={description}
+            featureId={featuresBackground ? featuresBackground.id : null}
+            characteristicsId={
+              characteristicsBackground ? characteristicsBackground.id : null
+            }
+            modifierType={backgroundType}
+            onSave={this.handleCustomBackgroundSave}
+          />
+        )}
+
+        <PageSubHeader>{name}</PageSubHeader>
+
+        {description && (
+          <div className="description-manage-background-description custom-background-description">
+            {description}
+          </div>
+        )}
+
+        {this.renderBackgroundChoices(background)}
+        {featuresBackground &&
+          this.renderBackgroundFeature(featuresBackground, [
+            featuresBackground.name ? featuresBackground.name : "",
+          ])}
+
+        {characteristicsBackground &&
+          this.hasCharacteristics(characteristicsBackground) && (
+            <Accordion
+              summary="Suggested Characteristics"
+              summaryMetaItems={metaItems}
+              variant="paper"
+            >
+              {this.renderBackgroundSuggestionsUi(characteristicsBackground)}
+            </Accordion>
+          )}
+      </div>
+    );
+  };
+
+  renderBackgroundUiContent = (): React.ReactNode => {
+    const { customizeCollapsed } = this.state;
+    const { background, getGroupedOptionsBySourceCategory } = this.props;
+
+    const backgroundOptions: Array<HtmlSelectOption | HtmlSelectOptionGroup> = [
+      {
+        label: "Custom Background",
+        value: -1,
+      },
+      {
+        label: "---------",
+        disabled: true,
+        value: "-----",
+      },
+      ...getGroupedOptionsBySourceCategory(this.getBackgroundData()),
+    ];
+
+    let backgroundId: number | null = null;
+    if (background) {
+      if (background.hasCustomBackground) {
+        backgroundId = -1;
+      } else if (background.definition) {
+        backgroundId = BackgroundUtils.getId(background);
+      }
+    }
+
+    let clsNames: string[] = ["custom-background-customize-header"];
+    if (customizeCollapsed) {
+      clsNames.push("custom-background-customize-header-closed");
+    } else {
+      clsNames.push("custom-background-customize-header-opened");
+    }
+
+    return (
+      <React.Fragment>
+        <div className="ct-character-tools__marketplace-callout">
+          Looking for something not in the list below? Unlock all official
+          options in the <Link href="/marketplace">Marketplace</Link>.
+        </div>
+        <div className="description-manage-background-chooser-con">
+          <div className="description-manage-background-chooser-field">
+            <Select
+              onChangePromise={this.handleBackgroundChangePromise}
+              options={backgroundOptions}
+              value={backgroundId}
+              clsNames={["description-manage-background-chooser"]}
+            />
+          </div>
+          {background && background.hasCustomBackground && (
+            <div className="description-manage-background-chooser-extra">
+              <div
+                className={clsNames.join(" ")}
+                onClick={this.handleConfigureClick}
+              >
+                <div className="custom-background-customize-heading">
+                  Configure
+                </div>
+                <div className="custom-background-customize-trigger" />
+              </div>
+            </div>
+          )}
+        </div>
+        {background &&
+          !background.hasCustomBackground &&
+          this.renderBackgroundDetailsUi()}
+        {background &&
+          background.hasCustomBackground &&
+          this.renderCustomBackgroundUI()}
+      </React.Fragment>
+    );
+  };
+
+  renderBackgroundUi = (): React.ReactNode => {
+    const { loadingStatus } = this.state;
+
+    let contentNode: React.ReactNode;
+    if (loadingStatus === DataLoadingStatusEnum.LOADED) {
+      contentNode = this.renderBackgroundUiContent();
+    } else {
+      contentNode = <LoadingPlaceholder />;
+    }
+
+    return (
+      <div className="description-manage-background">
+        <PageSubHeader>Choose Origin: Background</PageSubHeader>
+        {contentNode}
+      </div>
+    );
+  };
+
+  renderInformationCollapsible = (): React.ReactNode => {
+    const { ruleData, languages, currentBackground } = this.props;
+    if (languages.length === 0 || currentBackground === null) {
+      return null;
+    }
+
+    let definitionKeys: string[] = [];
+    if (currentBackground) {
+      definitionKeys.push(
+        DefinitionUtils.hack__generateDefinitionKey(
+          BackgroundUtils.getEntityTypeId(currentBackground),
+          BackgroundUtils.getId(currentBackground)
+        )
+      );
+    }
+
+    if (languages.length > 0) {
+      definitionKeys = definitionKeys.concat(
+        languages.map((language) => {
+          const entityType = ModifierUtils.getEntityTypeId(language) ?? 0;
+          const entityId = ModifierUtils.getEntityId(language) ?? 0;
+
+          return DefinitionUtils.hack__generateDefinitionKey(
+            entityType,
+            entityId
+          );
+        })
+      );
+    }
+
+    const builderText = RuleDataUtils.getBuilderHelperTextByDefinitionKeys(
+      definitionKeys,
+      ruleData,
+      Constants.DisplayConfigurationTypeEnum.LANGUAGE
+    );
+
+    return <HelperTextAccordion builderHelperText={builderText} />;
+  };
+
+  render() {
+    const {
+      ruleData,
+      hair,
+      skin,
+      eyes,
+      height,
+      weight,
+      age,
+      gender,
+      faith,
+      alignment,
+      lifestyleData,
+      lifestyle,
+    } = this.props;
+
+    const alignmentOptions = RuleDataUtils.getAlignmentOptions(ruleData);
+
+    let alignmentDescriptionNode: React.ReactNode;
+    if (alignment !== null && alignment.description !== null) {
+      alignmentDescriptionNode = (
+        <HtmlContent
+          className="description-manage-alignment-desc"
+          html={alignment.description}
+          withoutTooltips
+        />
+      );
+    }
+
+    const lifestyleOptions = lifestyleData.map((lifestyle) => ({
+      label: `${lifestyle.name} ${
+        lifestyle.cost === "-" ? "" : `(${lifestyle.cost})`
+      }`,
+      value: lifestyle.id,
+    }));
+
+    const numberInputAttributes = {
+      min: CHARACTER_DESCRIPTION_NUMBER_VALUE.MIN,
+      max: CHARACTER_DESCRIPTION_NUMBER_VALUE.MAX,
+    } as HTMLAttributes<HTMLInputElement>;
+
+    return (
+      <Page clsNames={["description-manage"]}>
+        <PageBody>
+          <div className="description-manage-information">
+            {this.renderInformationCollapsible()}
+          </div>
+          {this.renderBackgroundUi()}
+          <Accordion
+            summary="Character Details"
+            summaryMetaItems={["Alignment", "Faith", "Lifestyle"]}
+            variant="paper"
+          >
+            <div className="description-manage-alignment">
+              <label className="description-manage-alignment-label">
+                Alignment
+              </label>
+              <Select
+                options={alignmentOptions}
+                value={alignment === null ? null : alignment.id}
+                onChange={this.handleAlignmentChange}
+              />
+              {alignmentDescriptionNode}
+            </div>
+            <div className="description-manage-faith">
+              <FormInputField
+                label="Faith"
+                initialValue={faith}
+                onBlur={this.handleFaithChange}
+                inputAttributes={
+                  {
+                    spellCheck: false,
+                    autoComplete: "off",
+                  } as HTMLAttributes<HTMLInputElement>
+                }
+                maxLength={512}
+              />
+            </div>
+            <div className="description-manage-lifestyle">
+              <label className="description-manage-lifestyle-label">
+                Lifestyle
+              </label>
+              <Select
+                options={lifestyleOptions}
+                value={lifestyle === null ? null : lifestyle.id}
+                onChange={this.handleLifestyleChange}
+              />
+              {lifestyle !== null && (
+                <CollapsibleContent className="description-manage-lifestyle-desc">
+                  {lifestyle.description ? lifestyle.description : ""}
+                </CollapsibleContent>
+              )}
+            </div>
+          </Accordion>
+          <Accordion
+            summary="Physical Characteristics"
+            summaryMetaItems={[
+              "Hair",
+              "Skin",
+              "Eyes",
+              "Height",
+              "Weight",
+              "Age",
+              "Gender",
+            ]}
+            variant="paper"
+          >
+            <FormInputField
+              label="Hair"
+              initialValue={hair}
+              onBlur={this.handleHairChange}
+              maxLength={50}
+            />
+            <FormInputField
+              label="Skin"
+              initialValue={skin}
+              onBlur={this.handleSkinChange}
+              maxLength={50}
+            />
+            <FormInputField
+              label="Eyes"
+              initialValue={eyes}
+              onBlur={this.handleEyesChange}
+              maxLength={50}
+            />
+            <FormInputField
+              label="Height"
+              initialValue={height}
+              onBlur={this.handleHeightChange}
+              maxLength={50}
+            />
+            <FormInputField
+              label="Weight (lbs)"
+              type={"number"}
+              initialValue={weight}
+              onBlur={this.handleWeightChange}
+              transformValueOnBlur={this.handleTransformValueToNumberOnBlur}
+              inputAttributes={numberInputAttributes}
+            />
+            <FormInputField
+              label="Age (Years)"
+              type={"number"}
+              initialValue={age}
+              onBlur={this.handleAgeChange}
+              transformValueOnBlur={this.handleTransformValueToNumberOnBlur}
+              inputAttributes={numberInputAttributes}
+            />
+            <FormInputField
+              label="Gender"
+              initialValue={gender}
+              onBlur={this.handleGenderChange}
+              maxLength={128}
+            />
+          </Accordion>
+          <Accordion
+            summary="Personal Characteristics"
+            summaryMetaItems={["Personality", "Ideals", "Bonds", "Flaws"]}
+            variant="paper"
+          >
+            <EditorWithDialog
+              heading={<h3>Personality Traits</h3>}
+              editButtonLabel="Edit Traits"
+              addButtonLabel="Add Traits"
+              placeholder="Add traits here..."
+              content={this.getTraitContent(
+                Constants.TraitTypeEnum.PERSONALITY_TRAITS
+              )}
+              onSave={this.handleSaveTrait.bind(
+                this,
+                Constants.TraitTypeEnum.PERSONALITY_TRAITS
+              )}
+              extraNode={this.renderTextareaSuggestionList(
+                "Personality Traits",
+                "personalityTraits",
+                "Choose Two"
+              )}
+            />
+            <EditorWithDialog
+              heading={<h3>Ideals</h3>}
+              editButtonLabel="Edit Ideals"
+              addButtonLabel="Add Ideals"
+              placeholder="Add ideals here..."
+              content={this.getTraitContent(Constants.TraitTypeEnum.IDEALS)}
+              onSave={this.handleSaveTrait.bind(
+                this,
+                Constants.TraitTypeEnum.IDEALS
+              )}
+              extraNode={this.renderTextareaSuggestionList("Ideals", "ideals")}
+            />
+            <EditorWithDialog
+              heading={<h3>Bonds</h3>}
+              editButtonLabel="Edit Bonds"
+              addButtonLabel="Add Bonds"
+              placeholder="Add bonds here..."
+              content={this.getTraitContent(Constants.TraitTypeEnum.BONDS)}
+              onSave={this.handleSaveTrait.bind(
+                this,
+                Constants.TraitTypeEnum.BONDS
+              )}
+              extraNode={this.renderTextareaSuggestionList("Bonds", "bonds")}
+            />
+            <EditorWithDialog
+              heading={<h3>Flaws</h3>}
+              editButtonLabel="Edit Flaws"
+              addButtonLabel="Add Flaws"
+              placeholder="Add flaws here..."
+              content={this.getTraitContent(Constants.TraitTypeEnum.FLAWS)}
+              onSave={this.handleSaveTrait.bind(
+                this,
+                Constants.TraitTypeEnum.FLAWS
+              )}
+              extraNode={this.renderTextareaSuggestionList("Flaws", "flaws")}
+            />
+          </Accordion>
+          <Accordion
+            summary="Notes"
+            summaryMetaItems={[
+              "Organizations",
+              "Allies",
+              "Enemies",
+              "Backstory",
+              "Other",
+            ]}
+            variant="paper"
+          >
+            <EditorWithDialog
+              heading={<h3>Organizations</h3>}
+              editButtonLabel="Edit Notes"
+              addButtonLabel="Add Notes"
+              placeholder="Add organization notes here..."
+              content={this.getNoteContent(Constants.NoteKeyEnum.ORGANIZATIONS)}
+              onSave={this.handleSaveNote.bind(
+                this,
+                Constants.NoteKeyEnum.ORGANIZATIONS
+              )}
+              extraNode={
+                <p className="description-suggestion-info">
+                  Are there any important organizations your character belongs
+                  to? Any societies, orders, cults, or agencies?
+                </p>
+              }
+            />
+            <EditorWithDialog
+              heading={<h3>Allies</h3>}
+              editButtonLabel="Edit Notes"
+              addButtonLabel="Add Notes"
+              placeholder="Add allies here..."
+              content={this.getNoteContent(Constants.NoteKeyEnum.ALLIES)}
+              onSave={this.handleSaveNote.bind(
+                this,
+                Constants.NoteKeyEnum.ALLIES
+              )}
+              extraNode={
+                <p className="description-suggestion-info">
+                  With whom does your character associate? When in need of aid,
+                  do they seek out their kinfolk, followers of their deity, or
+                  other members of their order? What groups or individuals are
+                  they aligned with?
+                </p>
+              }
+            />
+            <EditorWithDialog
+              heading={<h3>Enemies</h3>}
+              editButtonLabel="Edit Notes"
+              addButtonLabel="Add Notes"
+              placeholder="Add enemies here..."
+              content={this.getNoteContent(Constants.NoteKeyEnum.ENEMIES)}
+              onSave={this.handleSaveNote.bind(
+                this,
+                Constants.NoteKeyEnum.ENEMIES
+              )}
+              extraNode={
+                <p className="description-suggestion-info">
+                  Who does your character fear or fight? Have they sworn a vow
+                  to rid the world of undead? Is there an order or organization
+                  they are opposed to? Are there any specific foes from their
+                  past?
+                </p>
+              }
+            />
+            <EditorWithDialog
+              heading={<h3>Backstory</h3>}
+              editButtonLabel="Edit Notes"
+              addButtonLabel="Add Notes"
+              placeholder="Add a backstory..."
+              content={this.getNoteContent(Constants.NoteKeyEnum.BACKSTORY)}
+              onSave={this.handleSaveNote.bind(
+                this,
+                Constants.NoteKeyEnum.BACKSTORY
+              )}
+              extraNode={
+                <p className="description-suggestion-info">
+                  Talk about your character's origins. Where are they from? How
+                  did they end up adventuring? How did they choose their class?
+                </p>
+              }
+            />
+            <EditorWithDialog
+              heading={<h3>Other</h3>}
+              editButtonLabel="Edit Notes"
+              addButtonLabel="Add Notes"
+              placeholder="Add additional notes here..."
+              content={this.getNoteContent(Constants.NoteKeyEnum.OTHER)}
+              onSave={this.handleSaveNote.bind(
+                this,
+                Constants.NoteKeyEnum.OTHER
+              )}
+              extraNode={
+                <p className="description-suggestion-info">
+                  Anything at all you'd like to mention about your character.
+                </p>
+              }
+            />
+          </Accordion>
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+const mapStateToProps = (state: BuilderAppState) => {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    background: rulesEngineSelectors.getBackgroundInfo(state),
+    currentBackground: rulesEngineSelectors.getBackground(state),
+    alignmentData: ruleDataSelectors.getAlignments(state),
+    lifestyleData: ruleDataSelectors.getLifestyles(state),
+    alignment: rulesEngineSelectors.getAlignment(state),
+    lifestyle: rulesEngineSelectors.getLifestyle(state),
+    faith: rulesEngineSelectors.getFaith(state),
+    traits: rulesEngineSelectors.getCharacterTraits(state),
+    notes: rulesEngineSelectors.getCharacterNotes(state),
+    hair: rulesEngineSelectors.getHair(state),
+    skin: rulesEngineSelectors.getSkin(state),
+    eyes: rulesEngineSelectors.getEyes(state),
+    height: rulesEngineSelectors.getHeight(state),
+    weight: rulesEngineSelectors.getWeight(state),
+    age: rulesEngineSelectors.getAge(state),
+    gender: rulesEngineSelectors.getGender(state),
+    isMobile: appEnvSelectors.getIsMobile(state),
+    choiceInfo: rulesEngineSelectors.getChoiceInfo(state),
+    loadAvailableBackgrounds:
+      apiCreatorSelectors.makeLoadAvailableBackgrounds(state),
+    species: rulesEngineSelectors.getRace(state),
+    featLookup: rulesEngineSelectors.getFeatLookup(state),
+    loadAvailableFeats: apiCreatorSelectors.makeLoadAvailableFeats(state),
+    prerequisiteData: rulesEngineSelectors.getPrerequisiteData(state),
+    preferences: rulesEngineSelectors.getCharacterPreferences(state),
+    optionalOriginLookup: rulesEngineSelectors.getOptionalOriginLookup(state),
+    definitionPool: serviceDataSelectors.getDefinitionPool(state),
+    languages: rulesEngineSelectors.getLanguageModifiers(state),
+  };
+};
+
+const DescriptionManageContainer = (props) => {
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+
+  const { getGroupedOptionsBySourceCategory } = useSource();
+  const { createModal } = useModalManager();
+
+  return (
+    <DescriptionManage
+      characterFeaturesManager={characterFeaturesManager}
+      getGroupedOptionsBySourceCategory={getGroupedOptionsBySourceCategory}
+      createModal={createModal}
+      {...props}
+    />
+  );
+};
+
+export default ConnectedBuilderPage(
+  DescriptionManageContainer,
+  RouteKey.DESCRIPTION_MANAGE,
+  mapStateToProps
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionManage/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionManage/index.ts
new file mode 100644
index 0000000..21f577b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/DescriptionManage/index.ts
@@ -0,0 +1,4 @@
+import DescriptionManage from "./DescriptionManage";
+
+export default DescriptionManage;
+export { DescriptionManage };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentHelp/EquipmentHelp.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentHelp/EquipmentHelp.tsx
new file mode 100644
index 0000000..b6421d2
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentHelp/EquipmentHelp.tsx
@@ -0,0 +1,43 @@
+import React from "react";
+
+import { RouteKey } from "~/subApps/builder/constants";
+
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import PageHeader from "../../../components/PageHeader";
+import PageSubHeader from "../../../components/PageSubHeader";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+
+class EquipmentHelp extends React.PureComponent {
+  render() {
+    return (
+      <Page>
+        <PageBody>
+          <PageHeader>Choose Equipment</PageHeader>
+          <p>
+            In this step, you will select weapons, armor, and other adventuring
+            gear for your character.
+          </p>
+
+          <PageSubHeader>Starting Equipment</PageSubHeader>
+          <p>
+            Your starting equipment options will be displayed on the next
+            screen. Your class and background determine your character’s
+            starting equipment. Review the options and add the appropriate items
+            using Manage Equipment.
+          </p>
+
+          <PageSubHeader>Starting Gold</PageSubHeader>
+          <p>
+            Instead of taking the gear given to you by your class and
+            background, you can purchase starting equipment. You have a number
+            of gold pieces (GP) to spend based on your class, as shown on the
+            next screen if you choose this option.
+          </p>
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+export default ConnectedBuilderPage(EquipmentHelp, RouteKey.EQUIPMENT_HELP);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentHelp/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentHelp/index.ts
new file mode 100644
index 0000000..5b5bee5
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentHelp/index.ts
@@ -0,0 +1,4 @@
+import EquipmentHelp from "./EquipmentHelp";
+
+export default EquipmentHelp;
+export { EquipmentHelp };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentManage/EquipmentManage.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentManage/EquipmentManage.tsx
new file mode 100644
index 0000000..776accc
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentManage/EquipmentManage.tsx
@@ -0,0 +1,482 @@
+import React from "react";
+import { useContext } from "react";
+import { DispatchProp } from "react-redux";
+import { v4 as uuidv4 } from "uuid";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+  CollapsibleHeading,
+} from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  CharacterConfiguration,
+  CharacterCurrencyContract,
+  CharacterNotes,
+  CharacterTheme,
+  Constants,
+  ContainerLookup,
+  ContainerUtils,
+  InventoryManager,
+  FormatUtils,
+  Item,
+  ItemUtils,
+  Modifier,
+  RuleData,
+  rulesEngineSelectors,
+  TypeValueLookup,
+  CoinManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { EditorWithDialog } from "~/subApps/builder/components/EditorWithDialog";
+import { RouteKey } from "~/subApps/builder/constants";
+import {
+  ModalData,
+  useModalManager,
+} from "~/subApps/builder/contexts/ModalManager";
+
+import * as toastActions from "../../../../Shared/actions/toastMessage/actions";
+import { ArmorListItem } from "../../../../Shared/components/legacy/ArmorList";
+import { CurrencyList } from "../../../../Shared/components/legacy/CurrencyList";
+import { EquipmentManagerShop } from "../../../../Shared/components/legacy/EquipmentManagerShop";
+import { GearListItem } from "../../../../Shared/components/legacy/GearList";
+import { WeaponListItem } from "../../../../Shared/components/legacy/WeaponList";
+import { CURRENCY_VALUE } from "../../../../Shared/constants/App";
+import StartingEquipment from "../../../../Shared/containers/StartingEquipment";
+import { CurrencyErrorTypeEnum } from "../../../../Shared/containers/panes/CurrencyPane/CurrencyPaneConstants";
+import { CoinManagerContext } from "../../../../Shared/managers/CoinManagerContext";
+import { InventoryManagerContext } from "../../../../Shared/managers/InventoryManagerContext";
+import { AppNotificationUtils } from "../../../../Shared/utils";
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import { PageHeader } from "../../../components/PageHeader";
+import { BuilderAppState } from "../../../typings";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+
+interface Props extends DispatchProp {
+  configuration: CharacterConfiguration;
+  inventory: Array<Item>;
+  containerLookup: ContainerLookup;
+  totalWeight: number;
+  notes: CharacterNotes;
+  ruleData: RuleData;
+  hasMaxAttunedItems: boolean;
+  characterId: number;
+  theme: CharacterTheme;
+  globalModifiers: Array<Modifier>;
+  valueLookupByType: TypeValueLookup;
+  proficiencyBonus: number;
+  inventoryManager: InventoryManager;
+  coinManager: CoinManager;
+  activeSourceCategories: Array<number>;
+  createModal: (modalData: ModalData) => void;
+}
+interface State {
+  showStartingEquipment: boolean;
+}
+class EquipmentManage extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      showStartingEquipment: props.configuration.startingEquipmentType === null,
+    };
+  }
+
+  textareaInput = React.createRef<HTMLDivElement>();
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { configuration } = this.props;
+
+    if (configuration !== prevProps.configuration) {
+      this.setState({
+        showStartingEquipment: configuration.startingEquipmentType === null,
+      });
+    }
+  }
+
+  handleItemAdd = (
+    item: Item,
+    amount: number,
+    containerDefinitionKey: string
+  ): void => {
+    const { inventoryManager } = this.props;
+
+    inventoryManager.handleAdd(
+      { item, amount, containerDefinitionKey },
+      AppNotificationUtils.handleItemAddAccepted.bind(this, item, amount)
+    );
+  };
+
+  handleCurrencyChange = (coin: CharacterCurrencyContract): void => {
+    const { coinManager } = this.props;
+
+    coinManager.handleCoinSet({
+      coin,
+      containerDefinitionKey: coinManager.getCharacterContainerDefinitionKey(),
+    });
+  };
+
+  handleCurrencyError = (
+    currencyName: string,
+    errorType: CurrencyErrorTypeEnum
+  ): void => {
+    const { dispatch } = this.props;
+
+    let message: string = "";
+    if (errorType === CurrencyErrorTypeEnum.MIN) {
+      message =
+        "Cannot set currency to a negative value, the previous amount has been set instead.";
+    }
+
+    if (errorType === CurrencyErrorTypeEnum.MAX) {
+      message = `The max amount allowed for each currency type is ${FormatUtils.renderLocaleNumber(
+        CURRENCY_VALUE.MAX
+      )}, the previous value has been set instead.`;
+    }
+
+    if (errorType !== null) {
+      dispatch(
+        toastActions.toastError(
+          `Unable to Set Currency: ${currencyName}`,
+          message
+        )
+      );
+    }
+  };
+
+  renderStartingEquipment = (): React.ReactNode => {
+    const { showStartingEquipment } = this.state;
+
+    let headingNode: React.ReactNode = (
+      <CollapsibleHeading>Starting Equipment</CollapsibleHeading>
+    );
+
+    let headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent heading={headingNode} />
+    );
+
+    return (
+      <Collapsible
+        header={headerNode}
+        className="equipment-manage__starting"
+        useBuilderStyles={true}
+        initiallyCollapsed={!showStartingEquipment}
+        collapsed={!showStartingEquipment}
+        onChangeHandler={(isCollapsed) => {
+          this.setState({
+            showStartingEquipment: !isCollapsed,
+          });
+        }}
+      >
+        <StartingEquipment
+          onStartingEquipmentChoose={() => {
+            this.setState({
+              showStartingEquipment: false,
+            });
+          }}
+          isInitialView={true}
+        />
+      </Collapsible>
+    );
+  };
+
+  renderItem = (
+    item: Item,
+    itemParams,
+    weaponLabels,
+    armorLabels,
+    gearLabels
+  ): React.ReactNode => {
+    if (ItemUtils.isWeaponContract(item)) {
+      let finalWeaponLabels = weaponLabels;
+      if (ItemUtils.isAmmunition(item)) {
+        //TODO fix this to be cleaner
+        finalWeaponLabels = {
+          ...weaponLabels,
+          equipLabel: "Use",
+          unequipLabel:
+            weaponLabels.unequipLabel === "Stow"
+              ? weaponLabels.unequipLabel
+              : "In Use",
+        };
+      }
+
+      return (
+        <WeaponListItem
+          key={uuidv4()}
+          item={item}
+          {...finalWeaponLabels}
+          {...itemParams}
+        />
+      );
+    } else if (ItemUtils.isArmorContract(item)) {
+      return (
+        <ArmorListItem
+          key={uuidv4()}
+          item={item}
+          {...armorLabels}
+          {...itemParams}
+        />
+      );
+    } else if (ItemUtils.isGearContract(item)) {
+      return (
+        <GearListItem
+          key={uuidv4()}
+          item={item}
+          {...gearLabels}
+          {...itemParams}
+        />
+      );
+    }
+
+    return null;
+  };
+
+  renderItemList = (): React.ReactNode => {
+    const { inventory } = this.props;
+
+    const weaponLabels = {
+      equipLabel: "Wield",
+      unequipLabel: "Wielding",
+    };
+    const armorLabels = {
+      equipLabel: "Wear",
+      unequipLabel: "Wearing",
+    };
+    const gearLabels = {
+      equipLabel: "Use",
+      unequipLabel: "In Use",
+    };
+    const itemParams = {
+      showRemove: true,
+      showEquip: true,
+      showUnequip: true,
+      showHeaderAction: true,
+    };
+
+    return (
+      <React.Fragment>
+        {ItemUtils.sortInventoryItems(inventory).map((item) =>
+          this.renderItem(
+            item,
+            itemParams,
+            weaponLabels,
+            armorLabels,
+            gearLabels
+          )
+        )}
+      </React.Fragment>
+    );
+  };
+
+  renderInventory = (): React.ReactNode => {
+    const { inventory, totalWeight } = this.props;
+
+    const itemTotal: number = inventory.length;
+
+    let headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent
+        heading={
+          <CollapsibleHeading>
+            Current Inventory ({itemTotal})
+          </CollapsibleHeading>
+        }
+        callout={
+          <div className="equipment-manage__callout">
+            Total Weight: {FormatUtils.renderWeight(totalWeight)}
+          </div>
+        }
+      />
+    );
+
+    return (
+      <Collapsible
+        header={headerNode}
+        className="equipment-manage__inventory"
+        useBuilderStyles={true}
+        initiallyCollapsed={itemTotal === 0}
+        collapsed={itemTotal === 0}
+      >
+        {itemTotal === 0 ? (
+          <div className="equipment-manager__inventory-empty">
+            You currently have no items in your inventory. Add Starting
+            Equipment above or Add Items from the list of available items below.
+          </div>
+        ) : (
+          this.renderItemList()
+        )}
+      </Collapsible>
+    );
+  };
+
+  renderOtherPossessions = (): React.ReactNode => {
+    const { notes, dispatch } = this.props;
+
+    return (
+      <Collapsible
+        header={"Other Possessions"}
+        className="equipment-manage__possessions"
+        useBuilderStyles={true}
+      >
+        <EditorWithDialog
+          heading={<h3>Personal Possessions</h3>}
+          editButtonLabel="Edit Possessions"
+          addButtonLabel="Add Possessions"
+          placeholder="Add personal possessions here..."
+          content={notes[Constants.NoteKeyEnum.PERSONAL_POSSESSIONS] ?? ""}
+          onSave={(content) => {
+            dispatch(
+              characterActions.noteSet(
+                Constants.NoteKeyEnum.PERSONAL_POSSESSIONS,
+                content
+              )
+            );
+          }}
+        />
+      </Collapsible>
+    );
+  };
+
+  renderAddItems = (): React.ReactNode => {
+    const {
+      ruleData,
+      characterId,
+      theme,
+      globalModifiers,
+      valueLookupByType,
+      proficiencyBonus,
+      activeSourceCategories,
+      inventoryManager,
+    } = this.props;
+
+    const characterContainerKey =
+      ContainerUtils.getCharacterContainerDefinitionKey(characterId);
+
+    return (
+      <Collapsible
+        header={"Add Items"}
+        className="equipment-manage__add-items"
+        useBuilderStyles={true}
+      >
+        <EquipmentManagerShop
+          theme={theme}
+          globalModifiers={globalModifiers}
+          valueLookupByType={valueLookupByType}
+          onItemAdd={this.handleItemAdd}
+          ruleData={ruleData}
+          proficiencyBonus={proficiencyBonus}
+          containerDefinitionKey={characterContainerKey}
+          activeSourceCategories={activeSourceCategories}
+          inventoryManager={inventoryManager}
+        />
+      </Collapsible>
+    );
+  };
+
+  renderCurrency = (): React.ReactNode => {
+    const { coinManager } = this.props;
+
+    const coin = coinManager.getContainerCoin(
+      coinManager.getCharacterContainerDefinitionKey()
+    );
+
+    if (!coin) {
+      return null;
+    }
+
+    let headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent
+        heading={<CollapsibleHeading>Currency</CollapsibleHeading>}
+        callout={
+          <div className="equipment-manage__callout">
+            Total in GP:{" "}
+            {FormatUtils.renderLocaleNumber(
+              coinManager.getTotalContainerCoinInGold(
+                coinManager.getCharacterContainerDefinitionKey()
+              )
+            )}
+          </div>
+        }
+      />
+    );
+
+    return (
+      <Collapsible
+        header={headerNode}
+        className="equipment-manage__currency"
+        useBuilderStyles={true}
+      >
+        <CurrencyList
+          {...coin}
+          onChange={this.handleCurrencyChange}
+          onError={this.handleCurrencyError}
+          totalGp={coinManager.getTotalContainerCoinInGold(
+            coinManager.getCharacterContainerDefinitionKey()
+          )}
+        />
+      </Collapsible>
+    );
+  };
+
+  render() {
+    return (
+      <Page>
+        <PageBody>
+          <PageHeader>Choose Equipment</PageHeader>
+          <div className="equipment-manage">
+            {this.renderStartingEquipment()}
+            {this.renderInventory()}
+            {this.renderOtherPossessions()}
+            {this.renderAddItems()}
+            {this.renderCurrency()}
+          </div>
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+function EquipmentManageContainer(props) {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const { coinManager } = useContext(CoinManagerContext);
+  const { createModal } = useModalManager();
+
+  return (
+    <EquipmentManage
+      coinManager={coinManager}
+      inventoryManager={inventoryManager}
+      createModal={createModal}
+      {...props}
+    />
+  );
+}
+
+export default ConnectedBuilderPage(
+  EquipmentManageContainer,
+  RouteKey.EQUIPMENT_MANAGE,
+  (state: BuilderAppState) => {
+    return {
+      configuration: rulesEngineSelectors.getCharacterConfiguration(state),
+      inventory: rulesEngineSelectors.getInventory(state),
+      containerLookup: rulesEngineSelectors.getContainerLookup(state),
+      totalWeight: rulesEngineSelectors.getTotalCarriedWeight(state),
+      notes: rulesEngineSelectors.getCharacterNotes(state),
+      currencies: rulesEngineSelectors.getCurrencies(state),
+      ruleData: rulesEngineSelectors.getRuleData(state),
+      hasMaxAttunedItems: rulesEngineSelectors.hasMaxAttunedItems(state),
+      proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+      characterId: rulesEngineSelectors.getId(state),
+      globalModifiers: rulesEngineSelectors.getValidGlobalModifiers(state),
+      valueLookupByType:
+        rulesEngineSelectors.getCharacterValueLookupByType(state),
+      theme: rulesEngineSelectors.getCharacterTheme(state),
+      activeSourceCategories:
+        rulesEngineSelectors.getActiveSourceCategories(state),
+    };
+  }
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentManage/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentManage/index.ts
new file mode 100644
index 0000000..70be982
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/EquipmentManage/index.ts
@@ -0,0 +1,4 @@
+import EquipmentManage from "./EquipmentManage";
+
+export default EquipmentManage;
+export { EquipmentManage };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeBasicInfo/HomeBasicInfo.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeBasicInfo/HomeBasicInfo.tsx
new file mode 100644
index 0000000..f029439
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeBasicInfo/HomeBasicInfo.tsx
@@ -0,0 +1,846 @@
+import { Typography } from "@mui/material";
+import React, { ChangeEvent, HTMLAttributes, ReactNode } from "react";
+import { DispatchProp } from "react-redux";
+
+import {
+  characterActions,
+  CharacterPreferences,
+  Constants,
+  HelperUtils,
+  HtmlSelectOption,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  CharacterUtils,
+  ClassSpellListSpellsLookup,
+  ClassUtils,
+  CharClass,
+  Race,
+  RaceUtils,
+  characterSelectors,
+  PremadeInfo,
+  PremadeInfoStatus,
+} from "@dndbeyond/character-rules-engine/es";
+import { Dice } from "@dndbeyond/dice";
+
+import { SourceCategoryDescription } from "~/constants";
+import { RouteKey } from "~/subApps/builder/constants";
+import {
+  ModalData,
+  useModalManager,
+} from "~/subApps/builder/contexts/ModalManager";
+import { FormInputField } from "~/tools/js/Shared/components/common/FormInputField";
+import UserRoles from "~/tools/js/Shared/constants/UserRoles";
+import PrivacyTypeRadio from "~/tools/js/smartComponents/PrivacyTypeRadio";
+
+import { appEnvActions } from "../../../../Shared/actions";
+import { SimpleClassSpellList } from "../../../../Shared/components/SimpleClassSpellList";
+import {
+  FormCheckBoxesField,
+  CheckboxInfo,
+} from "../../../../Shared/components/common/FormCheckBoxesField";
+import FormSelectField from "../../../../Shared/components/common/FormSelectField";
+import FormToggleField from "../../../../Shared/components/common/FormToggleField";
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import config from "../../../../config";
+import RadioGroup from "../../../components/CharacterSheetOptions/RadioGroup";
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import PageHeader from "../../../components/PageHeader";
+import { BuilderAppState } from "../../../typings";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+
+interface Props extends DispatchProp {
+  preferences: CharacterPreferences;
+  ruleData: RuleData;
+  activeSourceCategories: Array<number>;
+  diceEnabled: boolean;
+  userRoles: string[] | null | undefined;
+  classes: Array<CharClass>;
+  species: Race | null;
+  classSpellListSpellsLookup: ClassSpellListSpellsLookup;
+  premadeInfo: PremadeInfo | null;
+  characterId: number;
+  createModal: (modalData: ModalData) => void;
+}
+
+class HomeBasicInfo extends React.PureComponent<Props> {
+  static defaultProps = {
+    diceEnabled: false,
+  };
+
+  handlePreferenceChange = (prefKey: string, value: boolean): void => {
+    const { dispatch } = this.props;
+    const typedPrefKey = CharacterUtils.getPreferenceKey(prefKey);
+    if (typedPrefKey !== null) {
+      dispatch(characterActions.preferenceChoose(typedPrefKey, value));
+    }
+  };
+
+  handleIntPreferenceChange = (prefKey: string, value: string): void => {
+    const { dispatch } = this.props;
+    const typedPrefKey = CharacterUtils.getPreferenceKey(prefKey);
+    if (typedPrefKey !== null) {
+      dispatch(
+        characterActions.preferenceChoose(
+          typedPrefKey,
+          HelperUtils.parseInputInt(value)
+        )
+      );
+    }
+  };
+
+  handleSourceCategoryChange = (sourceId: number, isActive: boolean): void => {
+    const { dispatch, activeSourceCategories } = this.props;
+
+    let newSourceCats: Array<any> = [];
+    if (isActive) {
+      newSourceCats = [...activeSourceCategories, sourceId];
+    } else {
+      newSourceCats = activeSourceCategories.filter((id) => id !== sourceId);
+    }
+
+    dispatch(characterActions.activeSourceCategoriesSet(newSourceCats));
+  };
+
+  handlePartneredSourceChangeAll = (
+    sourceIds: number[],
+    isActive: boolean
+  ): void => {
+    const { dispatch, activeSourceCategories } = this.props;
+
+    let newSourceCats: Array<any> = [];
+    if (isActive) {
+      newSourceCats = [...activeSourceCategories, ...sourceIds];
+    } else {
+      newSourceCats = activeSourceCategories.filter(
+        (id) => !sourceIds.includes(id)
+      );
+    }
+
+    dispatch(characterActions.activeSourceCategoriesSet(newSourceCats));
+  };
+
+  handleOptionalClassFeaturesPreferenceChangePromise = (
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { classes, classSpellListSpellsLookup, createModal } = this.props;
+    const spellListIds: Array<number> =
+      ClassUtils.getUpdateEnableOptionalClassFeaturesSpellListIdsToRemove(
+        classes,
+        newIsEnabled
+      );
+
+    const hasSpellsToRemove = spellListIds.some((id) =>
+      classSpellListSpellsLookup.hasOwnProperty(id)
+    );
+
+    if (!hasSpellsToRemove) {
+      this.handlePreferenceChange("enableOptionalClassFeatures", newIsEnabled);
+      accept();
+    } else {
+      createModal({
+        content: (
+          <div>
+            <p>
+              Are you sure you want to disable{" "}
+              <strong>Optional Class Features</strong> for this character?
+            </p>
+            <p>
+              After doing so, the following spells provided by these features
+              will be removed from your character:
+            </p>
+            <SimpleClassSpellList
+              spellListIds={spellListIds}
+              classSpellListSpellsLookup={classSpellListSpellsLookup}
+            />
+          </div>
+        ),
+        props: {
+          heading: "Optional Class Features",
+          size: "fit-content",
+          variant: "remove",
+          onConfirm: () => {
+            this.handlePreferenceChange(
+              "enableOptionalClassFeatures",
+              newIsEnabled
+            );
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    }
+  };
+
+  handleOptionalOriginsPreferenceChangePromise = (
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { createModal, species, classSpellListSpellsLookup } = this.props;
+
+    if (!species) {
+      this.handlePreferenceChange("enableOptionalOrigins", newIsEnabled);
+      accept();
+
+      return;
+    }
+
+    const spellListIds: Array<number> =
+      RaceUtils.getUpdateEnableOptionalOriginsSpellListIdsToRemove(
+        species,
+        newIsEnabled
+      );
+
+    const hasSpellsToRemove = spellListIds.some((id) =>
+      classSpellListSpellsLookup.hasOwnProperty(id)
+    );
+
+    if (!hasSpellsToRemove) {
+      this.handlePreferenceChange("enableOptionalOrigins", newIsEnabled);
+      accept();
+    } else {
+      createModal({
+        content: (
+          <div>
+            <p>
+              Are you sure you want to disable{" "}
+              <strong>Customized Origins</strong> for this character?
+            </p>
+            <p>
+              After doing so, the following spells provided by these features
+              will be removed from your character:
+            </p>
+            <SimpleClassSpellList
+              spellListIds={spellListIds}
+              classSpellListSpellsLookup={classSpellListSpellsLookup}
+            />
+          </div>
+        ),
+        props: {
+          heading: "Customized Origin Features",
+          size: "fit-content",
+          variant: "remove",
+          onConfirm: () => {
+            this.handlePreferenceChange("enableOptionalOrigins", newIsEnabled);
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    }
+  };
+
+  handleProgressionPreferenceChangePromise = (
+    newValue: string,
+    oldValue: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { dispatch, createModal } = this.props;
+
+    const prefKey = CharacterUtils.getPreferenceKey("progressionType");
+    const newIdValue = HelperUtils.parseInputInt(newValue);
+
+    let content: ReactNode;
+    let heading: string | null = null;
+    if (newIdValue === Constants.PreferenceProgressionTypeEnum.XP) {
+      heading = "XP Advancement";
+      content = (
+        <div>
+          <p>
+            Are you sure you want to change your advancement method to XP
+            progression?
+          </p>
+          <p>You will begin with the base XP value for your current level.</p>
+        </div>
+      );
+    } else if (
+      newIdValue === Constants.PreferenceProgressionTypeEnum.MILESTONE
+    ) {
+      heading = "Milestone Advancement";
+      content = (
+        <div>
+          <p>
+            Are you sure you want to change your advancement method to Milestone
+            progression?
+          </p>
+          <p>Your current XP values will be lost.</p>
+        </div>
+      );
+    }
+
+    if (prefKey !== null && heading) {
+      createModal({
+        content,
+        props: {
+          heading,
+          size: "fit-content",
+          onConfirm: () => {
+            dispatch(characterActions.preferenceChoose(prefKey, newIdValue));
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    }
+  };
+
+  handleHitPointPreferenceChangePromise = (
+    newValue: string,
+    oldValue: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { dispatch, createModal } = this.props;
+
+    const prefKey = CharacterUtils.getPreferenceKey("hitPointType");
+    const newIdValue = HelperUtils.parseInputInt(newValue);
+
+    let content: ReactNode;
+    let heading: string | null = null;
+    if (newIdValue === Constants.PreferenceHitPointTypeEnum.FIXED) {
+      heading = "Fixed Hit Points";
+      content = (
+        <div>
+          <p>
+            Are you sure you want to change your hit points to the fixed value?
+          </p>
+          <p>Any rolled hit point totals will be lost.</p>
+        </div>
+      );
+    } else if (newIdValue === Constants.PreferenceHitPointTypeEnum.MANUAL) {
+      heading = "Manual Hit Points";
+      content = (
+        <div>
+          <p>Are you sure you want to change your hit points manual entry?</p>
+          <p>
+            After doing so, use Manage HP in the Class section to enter your
+            rolled values.
+          </p>
+        </div>
+      );
+    }
+
+    if (prefKey !== null && heading) {
+      createModal({
+        content,
+        props: {
+          heading,
+          size: "fit-content",
+          onConfirm: () => {
+            dispatch(characterActions.preferenceChoose(prefKey, newIdValue));
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    }
+  };
+
+  handleDiceToggle = (): void => {
+    const { dispatch, diceEnabled } = this.props;
+
+    const newDiceEnabledSetting: boolean = !diceEnabled;
+
+    try {
+      localStorage.setItem("dice-enabled", newDiceEnabledSetting.toString());
+      Dice.setEnabled(newDiceEnabledSetting);
+    } catch (e) {}
+
+    dispatch(
+      appEnvActions.dataSet({
+        diceEnabled: newDiceEnabledSetting,
+      })
+    );
+  };
+
+  handleChangePrivacy = (value: number | null): void => {
+    const typedPrefKey = CharacterUtils.getPreferenceKey("privacyType");
+    if (typedPrefKey !== null) {
+      this.props.dispatch(
+        characterActions.preferenceChoose(typedPrefKey, value)
+      );
+    }
+  };
+
+  renderPreferences = (): React.ReactNode => {
+    const { preferences, ruleData, activeSourceCategories, diceEnabled } =
+      this.props;
+
+    const {
+      useHomebrewContent,
+      encumbranceType,
+      hitPointType,
+      progressionType,
+      abilityScoreDisplayType,
+      privacyType,
+      ignoreCoinWeight,
+      enforceFeatRules,
+      enforceMulticlassRules,
+      showScaledSpells,
+      enableOptionalOrigins,
+      enableOptionalClassFeatures,
+    } = preferences;
+
+    const encumbranceOptions: Array<HtmlSelectOption> = [
+      {
+        label: "Use Encumbrance",
+        value: Constants.PreferenceEncumbranceTypeEnum.ENCUMBRANCE,
+      },
+      {
+        label: "No Encumbrance",
+        value: Constants.PreferenceEncumbranceTypeEnum.NONE,
+      },
+      {
+        label: "Variant Encumbrance",
+        value: Constants.PreferenceEncumbranceTypeEnum.VARIANT,
+      },
+    ];
+
+    const hpOptions: Array<HtmlSelectOption> = [
+      { label: "Fixed", value: Constants.PreferenceHitPointTypeEnum.FIXED },
+      { label: "Manual", value: Constants.PreferenceHitPointTypeEnum.MANUAL },
+    ];
+
+    const advancementOptions: Array<HtmlSelectOption> = [
+      {
+        label: "Milestone",
+        value: Constants.PreferenceProgressionTypeEnum.MILESTONE,
+      },
+      { label: "XP", value: Constants.PreferenceProgressionTypeEnum.XP },
+    ];
+
+    const abilityDisplayOptions: Array<HtmlSelectOption> = [
+      {
+        label: "Modifiers Top",
+        value: Constants.PreferenceAbilityScoreDisplayTypeEnum.MODIFIERS_TOP,
+      },
+      {
+        label: "Scores Top",
+        value: Constants.PreferenceAbilityScoreDisplayTypeEnum.SCORES_TOP,
+      },
+    ];
+
+    let sourceToggles: Array<CheckboxInfo> = [];
+    let partneredSourceCheckboxes: Array<CheckboxInfo> = [];
+    let allPartneredSources: Array<number> = [];
+
+    RuleDataUtils.getSourceCategories(ruleData).forEach((sourceCategory) => {
+      if (!sourceCategory.isToggleable) {
+        return null;
+      }
+
+      const checkbox: CheckboxInfo = {
+        label: `${sourceCategory.name}`,
+        initiallyEnabled: activeSourceCategories.includes(sourceCategory.id),
+        onChange: this.handleSourceCategoryChange.bind(this, sourceCategory.id),
+        sortOrder: sourceCategory.sortOrder,
+        description: sourceCategory.description ?? "",
+      };
+
+      if (sourceCategory.isPartneredContent) {
+        delete checkbox.description; // remove description from partnered content
+        partneredSourceCheckboxes.push(checkbox);
+        allPartneredSources.push(sourceCategory.id);
+      } else {
+        sourceToggles.push(checkbox);
+      }
+    });
+
+    const checkboxAllPartneredContent: CheckboxInfo = {
+      label: "All Partnered Content",
+      initiallyEnabled: allPartneredSources.every((id) =>
+        activeSourceCategories.includes(id)
+      ),
+      onChange: this.handlePartneredSourceChangeAll.bind(
+        this,
+        allPartneredSources
+      ),
+    };
+    return (
+      <div className="home-manage-preferences">
+        <FormCheckBoxesField
+          heading="Sources"
+          description={SourceCategoryDescription.official}
+          checkboxes={[
+            ...sourceToggles,
+            {
+              label: "Homebrew",
+              description: SourceCategoryDescription.homebrew,
+              initiallyEnabled: useHomebrewContent,
+              onChange: this.handlePreferenceChange.bind(
+                this,
+                "useHomebrewContent"
+              ),
+              sortOrder: 0,
+            },
+          ]}
+          showAccordion={false}
+          variant="builder"
+        />
+
+        <FormCheckBoxesField
+          heading="Partnered Content"
+          description={SourceCategoryDescription.partnered}
+          checkboxes={partneredSourceCheckboxes}
+          checkUncheckAllEnabled={true}
+          onCheckUncheckAll={checkboxAllPartneredContent}
+          showAccordion={true}
+          accordionHeading="Choose Partners"
+          variant="builder"
+          allText="All"
+        />
+
+        <FormCheckBoxesField
+          heading="Dice Rolling"
+          description="Enables digital dice rolling for this character"
+          checkboxes={[
+            {
+              initiallyEnabled: diceEnabled,
+              label: "Enable Dice Rolling",
+              onChange: this.handleDiceToggle,
+            },
+          ]}
+          variant="builder"
+        />
+
+        <FormCheckBoxesField
+          heading="Optional Features"
+          description="Allow or restrict optional features for this character."
+          checkboxes={[
+            {
+              label: "Optional Class Features",
+              initiallyEnabled: enableOptionalClassFeatures,
+              onChangePromise:
+                this.handleOptionalClassFeaturesPreferenceChangePromise,
+            },
+            {
+              label: "Customize Your Origin",
+              initiallyEnabled: enableOptionalOrigins,
+              onChangePromise:
+                this.handleOptionalOriginsPreferenceChangePromise,
+            },
+          ]}
+          variant="builder"
+        />
+
+        <FormSelectField
+          heading="Advancement Type"
+          description="Story-based character progression / XP-based character progression"
+          onChangePromise={this.handleProgressionPreferenceChangePromise}
+          initialOptionRemoved={true}
+          options={advancementOptions}
+          initialValue={"" + progressionType}
+          block={true}
+        />
+        <FormSelectField
+          heading="Hit Point Type"
+          description="When leveling up, increase hit points by the fixed value for your chosen class or manually enter a rolled value"
+          onChangePromise={this.handleHitPointPreferenceChangePromise}
+          initialOptionRemoved={true}
+          options={hpOptions}
+          initialValue={"" + hitPointType}
+          block={true}
+        />
+
+        <FormCheckBoxesField
+          heading="Use Prerequisites"
+          description="Allow or restrict choices based on rule prerequisites for the following for this character"
+          checkboxes={[
+            {
+              label: "Feats",
+              initiallyEnabled: enforceFeatRules,
+              onChange: this.handlePreferenceChange.bind(
+                this,
+                "enforceFeatRules"
+              ),
+            },
+            {
+              label: "Multiclass Requirements",
+              initiallyEnabled: enforceMulticlassRules,
+              onChange: this.handlePreferenceChange.bind(
+                this,
+                "enforceMulticlassRules"
+              ),
+            },
+          ]}
+          variant="builder"
+        />
+
+        <FormCheckBoxesField
+          heading="Show Level-Scaled Spells"
+          description="Display and highlight available spells to cast with higher level spell slots"
+          checkboxes={[
+            {
+              label: "Show Level-Scaled Spells",
+              initiallyEnabled: showScaledSpells,
+              onChange: this.handlePreferenceChange.bind(
+                this,
+                "showScaledSpells"
+              ),
+            },
+          ]}
+          variant="builder"
+        />
+
+        <FormSelectField
+          heading="Encumbrance Type"
+          description="Use the standard encumbrance rules / Disable the encumbrance display / Use the more detailed rules for encumbrance"
+          onChange={this.handleIntPreferenceChange.bind(
+            this,
+            "encumbranceType"
+          )}
+          initialOptionRemoved={true}
+          options={encumbranceOptions}
+          initialValue={"" + encumbranceType}
+          block={true}
+        />
+
+        <FormCheckBoxesField
+          heading="Ignore Coin Weight"
+          description="Coins do not count against your total weight carried (50 coins weigh 1 lb.)"
+          checkboxes={[
+            {
+              label: "Ignore Coin Weight",
+              initiallyEnabled: ignoreCoinWeight,
+              onChange: this.handlePreferenceChange.bind(
+                this,
+                "ignoreCoinWeight"
+              ),
+            },
+          ]}
+          variant="builder"
+        />
+
+        <FormSelectField
+          heading="Ability Score/Modifier Display"
+          description="Reverse the arrangement of ability modifiers and scores"
+          onChange={this.handleIntPreferenceChange.bind(
+            this,
+            "abilityScoreDisplayType"
+          )}
+          initialOptionRemoved={true}
+          options={abilityDisplayOptions}
+          initialValue={"" + abilityScoreDisplayType}
+          block={true}
+        />
+
+        <PrivacyTypeRadio
+          initialValue={privacyType}
+          handleChange={(e) =>
+            this.handleChangePrivacy(parseInt(e.target.value))
+          }
+          variant="builder"
+        />
+      </div>
+    );
+  };
+
+  handleAddPremadeInfo = (): void => {
+    const { dispatch, characterId } = this.props;
+
+    const data = {
+      characterId: characterId,
+      publishStatus: PremadeInfoStatus.DRAFT,
+      definition: {
+        longDescription: null,
+        shortDescription: null,
+        imageUrl: null,
+        imageAltText: null,
+        mobileImageUrl: null,
+        mobileImageAccessibility: null,
+        themeColor: null,
+      },
+    };
+
+    dispatch(characterActions.premadeInfoAdd(data));
+  };
+
+  handleDeletePremadeInfo = (): void => {
+    const { dispatch, characterId } = this.props;
+    dispatch(characterActions.premadeInfoDelete(characterId));
+  };
+
+  handlePremadeInfoChanged = (premadeInfo: PremadeInfo): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.premadeInfoUpdate(premadeInfo));
+  };
+
+  renderPremadePreferences = (): React.ReactNode => {
+    const { premadeInfo } = this.props;
+
+    const statusOptions: Array<HtmlSelectOption> = [
+      { label: "Draft", value: PremadeInfoStatus.DRAFT },
+      { label: "Published", value: PremadeInfoStatus.PUBLISHED },
+      { label: "Archived", value: PremadeInfoStatus.ARCHIVED },
+    ];
+
+    const inputAttributes = {
+      disabled: !premadeInfo,
+    } as HTMLAttributes<HTMLInputElement>;
+
+    return (
+      <div className="home-manage-preferences">
+        <FormToggleField
+          heading="Premade Character"
+          toggleLabel="Enabled official character"
+          description="Toggle on to make this a premade character. You cannot disable this if the premade status is Published."
+          initiallyEnabled={!!premadeInfo}
+          onChange={(toggledOn) => {
+            toggledOn
+              ? this.handleAddPremadeInfo()
+              : this.handleDeletePremadeInfo();
+          }}
+          isReadOnly={
+            premadeInfo?.publishStatus === PremadeInfoStatus.PUBLISHED
+          }
+        />
+        {premadeInfo && (
+          <>
+            <RadioGroup
+              name="premadeStatus"
+              label="Publish Status"
+              subtitle="Mark this character as published when you are ready for it to be publically visible."
+              value={premadeInfo.publishStatus}
+              options={statusOptions}
+              disabled={!premadeInfo}
+              onChange={(event: ChangeEvent<HTMLInputElement>) => {
+                premadeInfo.publishStatus = event.currentTarget
+                  .value as PremadeInfoStatus;
+                this.handlePremadeInfoChanged(premadeInfo);
+                this.forceUpdate();
+              }}
+            />
+            <FormInputField
+              label="Long Description"
+              initialValue={premadeInfo.definition.longDescription}
+              inputAttributes={inputAttributes}
+              onBlur={(value: string) => {
+                premadeInfo.definition.longDescription = value;
+                this.handlePremadeInfoChanged(premadeInfo);
+              }}
+            />
+            <FormInputField
+              label="Short Description"
+              initialValue={premadeInfo.definition.shortDescription}
+              inputAttributes={inputAttributes}
+              onBlur={(value: string) => {
+                premadeInfo.definition.shortDescription = value;
+                this.handlePremadeInfoChanged(premadeInfo);
+              }}
+            />
+            <FormInputField
+              label="Image Url"
+              initialValue={premadeInfo.definition.imageUrl}
+              inputAttributes={inputAttributes}
+              onBlur={(value: string) => {
+                premadeInfo.definition.imageUrl = value;
+                this.handlePremadeInfoChanged(premadeInfo);
+              }}
+            />
+            <FormInputField
+              label="Image Alt Text"
+              initialValue={premadeInfo.definition.imageAltText}
+              inputAttributes={inputAttributes}
+              onBlur={(value: string) => {
+                premadeInfo.definition.imageAltText = value;
+                this.handlePremadeInfoChanged(premadeInfo);
+              }}
+            />
+            <FormInputField
+              label="Mobile Image Url"
+              initialValue={premadeInfo.definition.mobileImageUrl}
+              inputAttributes={inputAttributes}
+              onBlur={(value: string) => {
+                premadeInfo.definition.mobileImageUrl = value;
+                this.handlePremadeInfoChanged(premadeInfo);
+              }}
+            />
+            <FormInputField
+              label="Mobile Image Accessibility"
+              initialValue={premadeInfo.definition.mobileImageAccessibility}
+              inputAttributes={inputAttributes}
+              onBlur={(value: string) => {
+                premadeInfo.definition.mobileImageAccessibility = value;
+                this.handlePremadeInfoChanged(premadeInfo);
+              }}
+            />
+            <FormInputField
+              label="Theme Color Hex Code"
+              initialValue={premadeInfo.definition.themeColor}
+              inputAttributes={inputAttributes}
+              onBlur={(value: string) => {
+                premadeInfo.definition.themeColor = value;
+                this.handlePremadeInfoChanged(premadeInfo);
+              }}
+            />
+          </>
+        )}
+      </div>
+    );
+  };
+
+  render() {
+    const { userRoles } = this.props;
+    const isLorekeeper =
+      userRoles?.includes(UserRoles.LOREKEEPER) ||
+      userRoles?.includes(UserRoles.ADMIN);
+
+    return (
+      <Page clsNames={["home-manage"]}>
+        <PageBody>
+          {isLorekeeper && (
+            <div style={{ border: "5px solid hotpink" }}>
+              <PageHeader>
+                Premade Character Preferences - Lorekeepers Only
+              </PageHeader>
+              {this.renderPremadePreferences()}
+            </div>
+          )}
+          <Typography fontSize={24}>Character Preferences</Typography>
+          {this.renderPreferences()}
+          <div className="home-manage__version">
+            <div className="home-manage__version-label">Version:</div>
+            <div className="home-manage__version-value">{config.version}</div>
+          </div>
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+const HomeBasicInfoContainer = (props: Props) => {
+  const { createModal } = useModalManager();
+  return <HomeBasicInfo {...props} createModal={createModal} />;
+};
+
+export default ConnectedBuilderPage(
+  HomeBasicInfoContainer,
+  RouteKey.HOME_BASIC_INFO,
+  (state: BuilderAppState) => ({
+    preferences: rulesEngineSelectors.getCharacterPreferences(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    activeSourceCategories:
+      rulesEngineSelectors.getActiveSourceCategories(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+    classes: rulesEngineSelectors.getClasses(state),
+    species: rulesEngineSelectors.getRace(state),
+    classSpellListSpellsLookup:
+      rulesEngineSelectors.getClassSpellListSpellsLookup(state),
+    userRoles: appEnvSelectors.getUserRoles(state),
+    premadeInfo: characterSelectors.getPremadeInfo(state),
+    characterId: rulesEngineSelectors.getId(state),
+  })
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeBasicInfo/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeBasicInfo/index.ts
new file mode 100644
index 0000000..ec0edb9
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeBasicInfo/index.ts
@@ -0,0 +1,4 @@
+import HomeBasicInfo from "./HomeBasicInfo";
+
+export default HomeBasicInfo;
+export { HomeBasicInfo };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeHelp/HomeHelp.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeHelp/HomeHelp.tsx
new file mode 100644
index 0000000..d9e9dd3
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeHelp/HomeHelp.tsx
@@ -0,0 +1,103 @@
+import React from "react";
+
+import { RouteKey } from "~/subApps/builder/constants";
+
+import { CollapsibleContent } from "../../../../../../components/CollapsibleContent";
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import PageHeader from "../../../components/PageHeader";
+import { BuilderAppState } from "../../../typings";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+
+interface Props {
+  isMobile: boolean;
+  lowerCase: { singular: string; plural: string; desc: string };
+}
+class HomeHelp extends React.PureComponent<Props> {
+  render() {
+    const { isMobile } = this.props;
+
+    return (
+      <Page>
+        <PageBody>
+          <CollapsibleContent
+            forceShow={!isMobile}
+            heading={
+              <>
+                <PageHeader>Creating a Character</PageHeader>
+                <p>
+                  Your first step in playing an adventure in the Dungeons &
+                  Dragons game is to imagine and create a character of your own.
+                  Your character is a combination of game statistics,
+                  roleplaying hooks, and your imagination.
+                </p>
+              </>
+            }
+          >
+            <p>
+              You choose a class (such as Fighter or Wizard), a background (such
+              as Artisan or Soldier), and a species (such as Human or Halfling).
+              You also invent the personality, appearance, and backstory of your
+              character. Once completed, your character serves as your
+              representative in the game, your avatar in the Dungeons &amp;
+              Dragons multiverse.
+            </p>
+
+            <p>
+              Before you dive into the character builder, think about the kind
+              of adventurer you want to play. You might be a courageous Fighter,
+              a skulking Rogue, a fervent Cleric, or a flamboyant Wizard. Or you
+              might be more interested in an unconventional character, such as a
+              brawny Rogue who likes hand-to-hand combat, or a sharpshooter who
+              picks off enemies from afar. Do you like fantasy fiction featuring
+              Dwarves or Elves? Try building a character of one of those
+              species. Do you want your character to be the toughest adventurer
+              at the table? Consider a class like Barbarian or Paladin. Once you
+              have a character in mind, follow the steps in this builder in
+              order, making decisions that reflect the character you want. Your
+              conception of your character might evolve with each choice you
+              make. What's important is that you come to the table with a
+              character you're excited to play.
+            </p>
+          </CollapsibleContent>
+          <CollapsibleContent
+            forceShow={!isMobile}
+            heading={
+              <>
+                <PageHeader>Character Level</PageHeader>
+                <p>
+                  Typically, your character begins play at 1st level. In the
+                  next step, adjust your level if you’re playing in a
+                  higher-powered campaign.
+                </p>
+              </>
+            }
+          >
+            <p>
+              As your character goes on adventures and overcomes challenges,
+              they gain experience, represented by Experience Points (XP). Once
+              you reach a specified XP total, you gain a new level. Adjusting
+              your character level will change your XP total and vice versa.
+            </p>
+          </CollapsibleContent>
+          <PageHeader>Preferences</PageHeader>
+          <p>
+            The next step also includes various preferences for your character.
+            You can proceed with the default options or make changes if desired.
+          </p>
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+export default ConnectedBuilderPage(
+  HomeHelp,
+  RouteKey.HOME_HELP,
+  (state: BuilderAppState) => {
+    return {
+      isMobile: appEnvSelectors.getIsMobile(state),
+    };
+  }
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeHelp/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeHelp/index.ts
new file mode 100644
index 0000000..272a6e6
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/HomeHelp/index.ts
@@ -0,0 +1,4 @@
+import HomeHelp from "./HomeHelp";
+
+export default HomeHelp;
+export { HomeHelp };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesHelp/SpeciesHelp.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesHelp/SpeciesHelp.tsx
new file mode 100644
index 0000000..ed94f02
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesHelp/SpeciesHelp.tsx
@@ -0,0 +1,122 @@
+import React from "react";
+
+import { RouteKey } from "~/subApps/builder/constants";
+
+import { CollapsibleContent } from "../../../../../../components/CollapsibleContent";
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import PageHeader from "../../../components/PageHeader";
+import { BuilderAppState } from "../../../typings";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+
+interface Props {
+  isMobile: boolean;
+}
+
+const SpeciesHelp: React.FC<Props> = ({ isMobile }) => {
+  return (
+    <Page>
+      <PageBody>
+        <PageHeader>Choose your Species</PageHeader>
+
+        <CollapsibleContent
+          forceShow={!isMobile}
+          heading={
+            <p>
+              Choose a species in the next step. Your choice of species affects
+              many different aspects of your character. It establishes
+              fundamental qualities that exist throughout your character's
+              adventuring career. When making this decision, keep in mind the
+              kind of character you want to play.
+            </p>
+          }
+        >
+          <p>
+            For example, a halfling could be a good choice for a sneaky rogue, a
+            dwarf makes a tough warrior, and an elf can be a master of arcane
+            magic.
+          </p>
+
+          <p>
+            Your character species not only affects your ability scores and
+            traits but also provides the cues for building your character's
+            story. Each species' description includes information to help you
+            roleplay a character of that species, including personality,
+            physical appearance, features of society, and alignment tendencies.
+          </p>
+
+          <p>
+            These details are suggestions to help you think about your
+            character; adventurers can deviate widely from the norm for their
+            species. It's worthwhile to consider why your character is
+            different, as a helpful way to think about your character's
+            background and personality.
+          </p>
+        </CollapsibleContent>
+
+        <PageHeader>Traits</PageHeader>
+
+        <CollapsibleContent
+          forceShow={!isMobile}
+          heading={
+            <p>
+              The description of each species includes traits that are common to
+              members of that species. The following entries appear among the
+              traits of most species.
+            </p>
+          }
+        >
+          <p>
+            <strong>AGE</strong>
+            <br />
+            The age entry notes the age when a member of the species is
+            considered an adult, as well as the species' expected lifespan. This
+            information can help you decide how old your character is at the
+            start of the game. You can choose any age for your character, which
+            could provide an explanation for some of your ability scores.
+          </p>
+
+          <p>
+            For example, if you play a young or very old character, your age
+            could explain a particularly low Strength or Constitution score,
+            while advanced age could account for a high Intelligence or Wisdom.
+          </p>
+
+          <p>
+            <strong>SIZE</strong>
+            <br />
+            Characters of most species are Medium, a size category including
+            creatures that are roughly 4 to 8 feet tall. Members of a few
+            species are Small (between 2 and 4 feet tall), which means that
+            certain rules of the game affect them differently.
+          </p>
+
+          <p>
+            <strong>SPEED</strong>
+            <br />
+            Your speed determines how far you can move when traveling and
+            fighting.
+          </p>
+
+          <p>
+            <strong>LANGUAGES</strong>
+            <br />
+            By virtue of your species, your character can speak, read, and write
+            certain languages.
+          </p>
+        </CollapsibleContent>
+      </PageBody>
+    </Page>
+  );
+};
+
+export default ConnectedBuilderPage(
+  SpeciesHelp,
+  RouteKey.RACE_HELP,
+  (state: BuilderAppState) => {
+    return {
+      isMobile: appEnvSelectors.getIsMobile(state),
+    };
+  }
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesHelp/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesHelp/index.ts
new file mode 100644
index 0000000..bef0e88
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesHelp/index.ts
@@ -0,0 +1,4 @@
+import SpeciesHelp from "./SpeciesHelp";
+
+export default SpeciesHelp;
+export { SpeciesHelp };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/OptionalOriginManager/OptionalOriginManager.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/OptionalOriginManager/OptionalOriginManager.tsx
new file mode 100644
index 0000000..c473b50
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/OptionalOriginManager/OptionalOriginManager.tsx
@@ -0,0 +1,358 @@
+import axios, { Canceler } from "axios";
+import React from "react";
+
+import { LoadingPlaceholder } from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiAdapterUtils,
+  ApiResponse,
+  EntitledEntity,
+  RacialTraitDefinitionContract,
+  DefinitionPool,
+  DefinitionPoolUtils,
+  Constants,
+  DefinitionUtils,
+  RacialTrait,
+  RacialTraitUtils,
+  OptionalOrigin,
+  Race,
+  RaceUtils,
+  OptionalOriginUtils,
+  OptionalOriginLookup,
+  HelperUtils,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Link } from "~/components/Link";
+
+import DataLoadingStatusEnum from "../../../../../Shared/constants/DataLoadingStatusEnum";
+import { AppLoggerUtils, TypeScriptUtils } from "../../../../../Shared/utils";
+import { OptionalFeature } from "../../../../components/OptionalFeature";
+import { AffectedFeatureInfo } from "../../../../components/OptionalFeature/OptionalFeature";
+import { PageSubHeader } from "../../../../components/PageSubHeader";
+
+interface OptionalOriginManagerProps {
+  species: Race;
+  definitionPool: DefinitionPool;
+  optionalOriginLookup: OptionalOriginLookup;
+  loadAvailableOptionalSpeciesTraits?: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<
+    ApiResponse<EntitledEntity<RacialTraitDefinitionContract>>
+  >;
+  onDefinitionsLoaded?: (
+    definitionData: EntitledEntity<RacialTraitDefinitionContract>
+  ) => void;
+  onSelection: (
+    definitionKey: string,
+    affectedSpeciesTraitDefinitionKey: string | null
+  ) => void;
+  onChangeReplacementPromise?: (
+    definitionKey: string,
+    newAffectedDefinitionKey: string | null,
+    oldAffectedDefinitionKey: string | null,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onRemoveSelectionPromise?: (
+    definitionKey: string,
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  ruleData: RuleData;
+}
+interface OptionalOriginManagerState {
+  loadingStatus: DataLoadingStatusEnum;
+}
+export class OptionalOriginManager extends React.PureComponent<
+  OptionalOriginManagerProps,
+  OptionalOriginManagerState
+> {
+  loadOptionalOriginsCanceler: null | Canceler = null;
+
+  constructor(props: OptionalOriginManagerProps) {
+    super(props);
+
+    this.state = {
+      loadingStatus: DataLoadingStatusEnum.NOT_LOADED,
+    };
+  }
+
+  componentDidMount() {
+    const { loadAvailableOptionalSpeciesTraits, onDefinitionsLoaded } =
+      this.props;
+
+    const { loadingStatus } = this.state;
+
+    if (
+      loadAvailableOptionalSpeciesTraits &&
+      loadingStatus === DataLoadingStatusEnum.NOT_LOADED
+    ) {
+      this.setState({
+        loadingStatus: DataLoadingStatusEnum.LOADING,
+      });
+
+      loadAvailableOptionalSpeciesTraits({
+        cancelToken: new axios.CancelToken((c) => {
+          this.loadOptionalOriginsCanceler = c;
+        }),
+      })
+        .then((response) => {
+          let data = ApiAdapterUtils.getResponseData(response);
+          if (data?.definitionData.length && onDefinitionsLoaded) {
+            onDefinitionsLoaded(data);
+          }
+
+          this.setState({
+            loadingStatus: DataLoadingStatusEnum.LOADED,
+          });
+          this.loadOptionalOriginsCanceler = null;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    } else {
+      this.setState({
+        loadingStatus: DataLoadingStatusEnum.LOADED,
+      });
+    }
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadOptionalOriginsCanceler !== null) {
+      this.loadOptionalOriginsCanceler();
+    }
+  }
+
+  getAffectedFeatureInfos = (origin: RacialTrait): AffectedFeatureInfo[] => {
+    const { definitionPool, species } = this.props;
+
+    return RacialTraitUtils.getAffectedFeatureDefinitionKeys(origin)
+      .map((definitionKey: string) =>
+        RacialTraitUtils.simulateRacialTrait(definitionKey, definitionPool)
+      )
+      .filter(TypeScriptUtils.isNotNullOrUndefined)
+      .map((affectedSpeciesTrait: RacialTrait) => {
+        const definitionKey =
+          RacialTraitUtils.getDefinitionKey(affectedSpeciesTrait);
+        let disabled = RaceUtils.getOptionalOrigins(species).some(
+          (originMapping: OptionalOrigin) =>
+            OptionalOriginUtils.getDefinitionKey(originMapping) !==
+              RacialTraitUtils.getDefinitionKey(origin) &&
+            OptionalOriginUtils.getAffectedRacialTraitDefinitionKey(
+              originMapping
+            ) === definitionKey
+        );
+
+        return {
+          name: RacialTraitUtils.getName(affectedSpeciesTrait),
+          definitionKey,
+          disabled,
+        };
+      });
+  };
+
+  renderOptionalOriginCta = (): React.ReactNode => {
+    return (
+      <div className="ct-optional-origin-manager__content">
+        <div className="ct-optional-origin-manager__content--empty">
+          <span>
+            You currently have no available custom origins for this character
+          </span>
+          <div className="ct-character-tools__marketplace-callout">
+            Unlock all official options in the{" "}
+            <Link href="/marketplace">Marketplace</Link> or create them for{" "}
+            <Link href="/my-creations">Homebrew</Link> Species.
+          </div>
+        </div>
+      </div>
+    );
+  };
+
+  render() {
+    const { loadingStatus } = this.state;
+    const {
+      definitionPool,
+      species,
+      optionalOriginLookup,
+      onChangeReplacementPromise,
+      onRemoveSelectionPromise,
+      onSelection,
+    } = this.props;
+
+    let contentNode: React.ReactNode;
+    if (loadingStatus !== DataLoadingStatusEnum.LOADED) {
+      contentNode = <LoadingPlaceholder />;
+    } else {
+      let availableOptionalOrigins: RacialTrait[] =
+        DefinitionPoolUtils.getTypedDefinitionList(
+          Constants.DefinitionTypeEnum.RACIAL_TRAIT,
+          definitionPool
+        )
+          .map((speciesTraitDef) =>
+            RacialTraitUtils.simulateRacialTrait(
+              DefinitionUtils.getDefinitionKey(speciesTraitDef),
+              definitionPool
+            )
+          )
+          .filter(TypeScriptUtils.isNotNullOrUndefined)
+          .filter((speciesTrait) =>
+            RacialTraitUtils.isValidRaceRacialTrait(species, speciesTrait)
+          )
+          .filter(
+            (speciesTrait) =>
+              RacialTraitUtils.getFeatureType(speciesTrait) !==
+              Constants.FeatureTypeEnum.GRANTED
+          );
+
+      let availableOptionalOriginLookup = HelperUtils.generateNonNullLookup(
+        availableOptionalOrigins,
+        RacialTraitUtils.getDefinitionKey
+      );
+
+      const unEntitledOptionalSpeciesTraits: RacialTrait[] = [];
+      Object.keys(optionalOriginLookup).forEach((definitionKey) => {
+        if (!availableOptionalOriginLookup.hasOwnProperty(definitionKey)) {
+          const speciesTrait = RacialTraitUtils.simulateRacialTrait(
+            definitionKey,
+            definitionPool
+          );
+          if (
+            speciesTrait &&
+            RacialTraitUtils.isValidRaceRacialTrait(species, speciesTrait)
+          ) {
+            unEntitledOptionalSpeciesTraits.push(speciesTrait);
+          }
+        }
+      });
+
+      const consolidatedOptionalOrigins: RacialTrait[] = [
+        ...availableOptionalOrigins,
+        ...unEntitledOptionalSpeciesTraits,
+      ].filter(
+        (speciesTrait) =>
+          !RacialTraitUtils.deriveHideInContext(
+            speciesTrait,
+            Constants.AppContextTypeEnum.BUILDER
+          )
+      );
+
+      if (!consolidatedOptionalOrigins.length) {
+        contentNode = this.renderOptionalOriginCta();
+      } else {
+        const replacementOrigins: RacialTrait[] = [];
+        const additionalOrigins: RacialTrait[] = [];
+        consolidatedOptionalOrigins.forEach((speciesTrait) => {
+          switch (RacialTraitUtils.getFeatureType(speciesTrait)) {
+            case Constants.FeatureTypeEnum.ADDITIONAL:
+              additionalOrigins.push(speciesTrait);
+              break;
+            case Constants.FeatureTypeEnum.REPLACEMENT:
+              replacementOrigins.push(speciesTrait);
+              break;
+            default:
+            //not implemented
+          }
+        });
+
+        contentNode = (
+          <div className="ct-optional-origin-manager__content">
+            {replacementOrigins.length > 0 && (
+              <React.Fragment>
+                <PageSubHeader>Replacement Traits</PageSubHeader>
+                {RaceUtils.deriveOrderedRacialTraits(replacementOrigins).map(
+                  (origin: RacialTrait) => {
+                    const optionalOriginMapping =
+                      HelperUtils.lookupDataOrFallback(
+                        optionalOriginLookup,
+                        RacialTraitUtils.getDefinitionKey(origin)
+                      );
+                    const affectedFeatureDefinitionKey = optionalOriginMapping
+                      ? OptionalOriginUtils.getAffectedRacialTraitDefinitionKey(
+                          optionalOriginMapping
+                        )
+                      : null;
+
+                    return (
+                      <OptionalFeature
+                        key={RacialTraitUtils.getDefinitionKey(origin)}
+                        name={`Origin ${RacialTraitUtils.getName(origin)}`}
+                        description={RacialTraitUtils.getDescription(origin)}
+                        featureType={RacialTraitUtils.getFeatureType(origin)}
+                        definitionKey={RacialTraitUtils.getDefinitionKey(
+                          origin
+                        )}
+                        affectedFeatureDefinitionKey={
+                          affectedFeatureDefinitionKey
+                        }
+                        isSelected={!!optionalOriginMapping ?? false}
+                        onSelection={onSelection}
+                        onChangeReplacementPromise={onChangeReplacementPromise}
+                        onRemoveSelectionPromise={onRemoveSelectionPromise}
+                        affectedFeatures={this.getAffectedFeatureInfos(origin)}
+                        accessType={RacialTraitUtils.getAccessType(origin)}
+                      />
+                    );
+                  }
+                )}
+              </React.Fragment>
+            )}
+            {additionalOrigins.length > 0 && (
+              <React.Fragment>
+                <PageSubHeader>Additional Traits</PageSubHeader>
+                {RaceUtils.deriveOrderedRacialTraits(additionalOrigins).map(
+                  (origin: RacialTrait) => {
+                    const optionalOriginMapping =
+                      HelperUtils.lookupDataOrFallback(
+                        optionalOriginLookup,
+                        RacialTraitUtils.getDefinitionKey(origin)
+                      );
+                    const affectedFeatureDefinitionKey = optionalOriginMapping
+                      ? OptionalOriginUtils.getAffectedRacialTraitDefinitionKey(
+                          optionalOriginMapping
+                        )
+                      : null;
+
+                    return (
+                      <OptionalFeature
+                        key={RacialTraitUtils.getDefinitionKey(origin)}
+                        name={RacialTraitUtils.getName(origin)}
+                        description={RacialTraitUtils.getDescription(origin)}
+                        featureType={RacialTraitUtils.getFeatureType(origin)}
+                        definitionKey={RacialTraitUtils.getDefinitionKey(
+                          origin
+                        )}
+                        affectedFeatureDefinitionKey={
+                          affectedFeatureDefinitionKey
+                        }
+                        isSelected={!!optionalOriginMapping ?? false}
+                        onSelection={onSelection}
+                        onChangeReplacementPromise={onChangeReplacementPromise}
+                        onRemoveSelectionPromise={onRemoveSelectionPromise}
+                        affectedFeatures={this.getAffectedFeatureInfos(origin)}
+                        accessType={RacialTraitUtils.getAccessType(origin)}
+                      />
+                    );
+                  }
+                )}
+              </React.Fragment>
+            )}
+          </div>
+        );
+      }
+    }
+
+    return (
+      <div className="ct-optional-origin-manager">
+        <div className="ct-optional-origin-manager__intro">
+          The following options allow you to customize aspects of your character
+          such as ability scores, languages, and certain proficiencies to fit
+          the origin you have in mind.
+        </div>
+        {contentNode}
+      </div>
+    );
+  }
+}
+
+export default OptionalOriginManager;
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/SpeciesManage.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/SpeciesManage.tsx
new file mode 100644
index 0000000..2eabc87
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/SpeciesManage.tsx
@@ -0,0 +1,541 @@
+import React from "react";
+import { DispatchProp } from "react-redux";
+import { NavigateFunction, useNavigate } from "react-router-dom";
+
+import {
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiResponse,
+  characterActions,
+  CharacterPreferences,
+  ChoiceData,
+  ClassSpellListSpellsLookup,
+  Constants,
+  DefinitionPool,
+  DefinitionUtils,
+  EntitledEntity,
+  FeatDefinitionContract,
+  FeatLookup,
+  HelperUtils,
+  OptionalOriginLookup,
+  OptionalOriginUtils,
+  PrerequisiteData,
+  Race,
+  RaceUtils,
+  RacialTraitDefinitionContract,
+  RacialTraitUtils,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  serviceDataActions,
+  serviceDataSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HelperTextAccordion } from "~/components/HelperTextAccordion";
+import { HtmlContent } from "~/components/HtmlContent";
+import { SummaryList } from "~/components/SummaryList";
+import { TabList } from "~/components/TabList";
+import { RouteKey } from "~/subApps/builder/constants";
+import {
+  ModalData,
+  useModalManager,
+} from "~/subApps/builder/contexts/ModalManager";
+
+import { SimpleClassSpellList } from "../../../../Shared/components/SimpleClassSpellList";
+import { apiCreatorSelectors } from "../../../../Shared/selectors";
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import PageHeader from "../../../components/PageHeader";
+import SpeciesTraitList from "../../../components/SpeciesTraitList";
+import { navigationConfig } from "../../../config";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+import { OptionalOriginManager } from "./OptionalOriginManager";
+import styles from "./styles.module.css";
+
+interface Props extends DispatchProp {
+  ruleData: RuleData;
+  preferences: CharacterPreferences;
+  prerequisiteData: PrerequisiteData;
+  choiceInfo: ChoiceData;
+  species: Race | null;
+  featLookup: FeatLookup;
+  definitionPool: DefinitionPool;
+  optionalOriginLookup: OptionalOriginLookup;
+  classSpellListSpellsLookup: ClassSpellListSpellsLookup;
+  navigate: NavigateFunction;
+  characterId: number;
+  loadAvailableOptionalSpeciesTraits: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<
+    ApiResponse<EntitledEntity<RacialTraitDefinitionContract>>
+  >;
+  loadAvailableFeats: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<FeatDefinitionContract[]>>;
+  createModal: (modal: ModalData) => void;
+}
+
+class SpeciesManage extends React.PureComponent<Props> {
+  handleChangeSpecies = (): void => {
+    const { navigate, characterId } = this.props;
+    navigate(
+      navigationConfig
+        .getRouteDefPath(RouteKey.RACE_CHOOSE)
+        .replace(":characterId", characterId)
+    );
+  };
+
+  handleSpeciesTraitChoiceChange = (
+    speciesTraitId,
+    choiceId,
+    choiceType,
+    optionValue
+  ): void => {
+    const { dispatch } = this.props;
+
+    dispatch(
+      characterActions.racialTraitChoiceSetRequest(
+        speciesTraitId,
+        choiceType,
+        choiceId,
+        optionValue
+      )
+    );
+  };
+
+  handleDefinitionsLoaded = (
+    entitledData: EntitledEntity<RacialTraitDefinitionContract>
+  ): void => {
+    const { dispatch } = this.props;
+
+    dispatch(
+      serviceDataActions.definitionPoolAdd(
+        entitledData.definitionData,
+        entitledData.accessTypes
+      )
+    );
+  };
+
+  handleOptionalOriginSelection = (
+    definitionKey: string,
+    affectedSpeciesTraitDefinitionKey: string | null
+  ): void => {
+    const { dispatch } = this.props;
+
+    const speciesTraitId =
+      DefinitionUtils.hack__getDefinitionKeyId(definitionKey);
+    if (speciesTraitId === null) {
+      return;
+    }
+
+    const affectedSpeciesTraitId = affectedSpeciesTraitDefinitionKey
+      ? DefinitionUtils.hack__getDefinitionKeyId(
+          affectedSpeciesTraitDefinitionKey
+        )
+      : null;
+
+    dispatch(
+      characterActions.optionalOriginCreate(
+        speciesTraitId,
+        affectedSpeciesTraitId
+      )
+    );
+  };
+
+  handleRemoveOptionalOriginSelectionPromise = (
+    definitionKey: string,
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const {
+      dispatch,
+      createModal,
+      optionalOriginLookup,
+      classSpellListSpellsLookup,
+    } = this.props;
+
+    const optionalOrigin = HelperUtils.lookupDataOrFallback(
+      optionalOriginLookup,
+      definitionKey
+    );
+    if (optionalOrigin === null) {
+      return;
+    }
+
+    const optionalSpeciesTrait =
+      OptionalOriginUtils.getRacialTrait(optionalOrigin);
+    if (optionalSpeciesTrait === null) {
+      return;
+    }
+
+    const speciesTraitId = OptionalOriginUtils.getRacialTraitId(optionalOrigin);
+    const spellListIds =
+      OptionalOriginUtils.getRemoveMappingSpellListIds(optionalOrigin);
+    const hasSpellsToRemove = spellListIds.some((id) =>
+      classSpellListSpellsLookup.hasOwnProperty(id)
+    );
+
+    if (!hasSpellsToRemove) {
+      dispatch(characterActions.optionalOriginDestroy(speciesTraitId));
+      accept();
+    } else {
+      createModal({
+        content: (
+          <div>
+            <p>
+              You are about to remove{" "}
+              <strong>{RacialTraitUtils.getName(optionalSpeciesTrait)}</strong>{" "}
+              from your character.
+            </p>
+            <p>
+              After doing so, the following spells provided by this feature will
+              be removed from your character:
+            </p>
+            <SimpleClassSpellList
+              spellListIds={spellListIds}
+              classSpellListSpellsLookup={classSpellListSpellsLookup}
+            />
+          </div>
+        ),
+        props: {
+          heading: "Customized Origin Warning",
+          variant: "remove",
+          size: "fit-content",
+          confirmButtonText: "Remove",
+          onConfirm: () => {
+            dispatch(characterActions.optionalOriginDestroy(speciesTraitId));
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    }
+  };
+
+  handleOnChangeOptionalOriginReplacementPromise = (
+    definitionKey: string,
+    newAffectedDefinitionKey: string | null,
+    oldAffectedDefinitionKey: string | null,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const {
+      dispatch,
+      createModal,
+      optionalOriginLookup,
+      classSpellListSpellsLookup,
+    } = this.props;
+
+    if (newAffectedDefinitionKey === oldAffectedDefinitionKey) {
+      return;
+    }
+
+    const optionalOrigin = HelperUtils.lookupDataOrFallback(
+      optionalOriginLookup,
+      definitionKey
+    );
+    if (optionalOrigin === null) {
+      return;
+    }
+
+    const optionalSpeciesTrait =
+      OptionalOriginUtils.getRacialTrait(optionalOrigin);
+    if (optionalSpeciesTrait === null) {
+      return;
+    }
+
+    const speciesTraitId = OptionalOriginUtils.getRacialTraitId(optionalOrigin);
+    const newAffectedSpeciesTraitId: number | null = newAffectedDefinitionKey
+      ? DefinitionUtils.hack__getDefinitionKeyId(newAffectedDefinitionKey)
+      : null;
+
+    const spellListIds =
+      OptionalOriginUtils.getUpdateMappingSpellListIdsToRemove(optionalOrigin, {
+        affectedRacialTraitId: newAffectedSpeciesTraitId,
+      });
+    const hasSpellsToRemove = spellListIds.some((id) =>
+      classSpellListSpellsLookup.hasOwnProperty(id)
+    );
+
+    if (!hasSpellsToRemove) {
+      dispatch(
+        characterActions.optionalOriginSetRequest(
+          speciesTraitId,
+          newAffectedSpeciesTraitId
+        )
+      );
+      accept();
+    } else {
+      createModal({
+        content: (
+          <div>
+            <p>
+              You are about to change the Species Trait to be replaced by{" "}
+              <strong>{RacialTraitUtils.getName(optionalSpeciesTrait)}</strong>
+            </p>
+            <p>
+              After doing so, the following spells provided by this feature will
+              be removed from your character:
+            </p>
+            <SimpleClassSpellList
+              spellListIds={spellListIds}
+              classSpellListSpellsLookup={classSpellListSpellsLookup}
+            />
+          </div>
+        ),
+        props: {
+          heading: "Customized Origin Warning",
+          variant: "remove",
+          size: "fit-content",
+          onConfirm: () => {
+            dispatch(
+              characterActions.optionalOriginSetRequest(
+                speciesTraitId,
+                newAffectedSpeciesTraitId
+              )
+            );
+            accept();
+          },
+          onClose: () => {
+            reject();
+          },
+        },
+      });
+    }
+  };
+
+  renderSpeciesTraitsGroup = (): React.ReactNode => {
+    const {
+      species,
+      loadAvailableFeats,
+      choiceInfo,
+      prerequisiteData,
+      preferences,
+      featLookup,
+      optionalOriginLookup,
+      definitionPool,
+    } = this.props;
+
+    if (!species) {
+      return null;
+    }
+
+    const speciesTraits = RaceUtils.getVisibleRacialTraits(species);
+    const filteredSpeciesTraits =
+      RacialTraitUtils.filterRacialTraitsByDisplayConfigurationType(
+        speciesTraits,
+        [
+          Constants.DisplayConfigurationTypeEnum.RACIAL_TRAIT,
+          Constants.DisplayConfigurationTypeEnum.LANGUAGE,
+        ]
+      );
+
+    return (
+      <div className="race-detail-secondary">
+        {filteredSpeciesTraits.length > 0 && (
+          <div className="race-detail-racial-traits">
+            <SpeciesTraitList
+              speciesTraits={filteredSpeciesTraits}
+              featLookup={featLookup}
+              loadAvailableFeats={loadAvailableFeats}
+              handleSpeciesTraitChoiceChange={
+                this.handleSpeciesTraitChoiceChange
+              }
+              choiceInfo={choiceInfo}
+              prerequisiteData={prerequisiteData}
+              preferences={preferences}
+              optionalOriginLookup={optionalOriginLookup}
+              definitionPool={definitionPool}
+            />
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  renderSpeciesTraitsContent = () => {
+    const { preferences } = this.props;
+
+    if (preferences.enableOptionalOrigins) {
+      return this.renderTabList();
+    }
+
+    return this.renderSpeciesTraitsGroup();
+  };
+
+  renderTabList = () => {
+    const {
+      species,
+      optionalOriginLookup,
+      loadAvailableOptionalSpeciesTraits,
+      definitionPool,
+      ruleData,
+    } = this.props;
+
+    if (!species) {
+      return null;
+    }
+
+    return (
+      <TabList
+        className="manage-race-tabs"
+        variant="collapse"
+        tabs={[
+          {
+            label: "Species Traits",
+            content: this.renderSpeciesTraitsGroup(),
+            id: "traits",
+          },
+          {
+            label: "Origin Manager",
+            content: (
+              <OptionalOriginManager
+                species={species}
+                definitionPool={definitionPool}
+                optionalOriginLookup={optionalOriginLookup}
+                onDefinitionsLoaded={this.handleDefinitionsLoaded}
+                loadAvailableOptionalSpeciesTraits={
+                  loadAvailableOptionalSpeciesTraits
+                }
+                onSelection={this.handleOptionalOriginSelection}
+                onChangeReplacementPromise={
+                  this.handleOnChangeOptionalOriginReplacementPromise
+                }
+                onRemoveSelectionPromise={
+                  this.handleRemoveOptionalOriginSelectionPromise
+                }
+                ruleData={ruleData}
+              />
+            ),
+            id: "Origin Manager",
+          },
+        ]}
+      />
+    );
+  };
+
+  renderInformationCollapsible = (): React.ReactNode => {
+    const { ruleData, species } = this.props;
+    if (species === null) {
+      return null;
+    }
+
+    const definitionKey = DefinitionUtils.hack__generateDefinitionKey(
+      RaceUtils.getEntityRaceTypeId(species),
+      RaceUtils.getEntityRaceId(species)
+    );
+    const builderText = RuleDataUtils.getBuilderHelperTextByDefinitionKeys(
+      [definitionKey],
+      ruleData,
+      Constants.DisplayConfigurationTypeEnum.RACIAL_TRAIT
+    );
+
+    return <HelperTextAccordion builderHelperText={builderText} />;
+  };
+
+  render() {
+    const { species, ruleData } = this.props;
+
+    //TODO render something else if species doesnt exist
+    if (!species) {
+      return null;
+    }
+
+    const fullName = RaceUtils.getFullName(species);
+    const portraitAvatarUrl = RaceUtils.getPortraitAvatarUrl(species);
+    const description = RaceUtils.getDescription(species);
+    const moreDetailsUrl = RaceUtils.getMoreDetailsUrl(species);
+    const previewUrl: string | null =
+      portraitAvatarUrl ?? RuleDataUtils.getDefaultRaceImageUrl(ruleData);
+
+    const descriptionClassNames: string[] = ["race-detail-description"];
+
+    const calledOutSpeciesTraits = RaceUtils.getCalledOutRacialTraits(species);
+    if (calledOutSpeciesTraits.length > 0) {
+      descriptionClassNames.push("race-detail-description--hide-traits");
+    }
+
+    return (
+      <Page>
+        <PageBody>
+          <div className="manage-race race-detail">
+            <div className="race-detail-primary">
+              <div className="race-detail-aside">
+                <div className="race-detail-preview">
+                  <img
+                    className="race-detail-preview-img"
+                    src={previewUrl ? previewUrl : ""}
+                    alt=""
+                  />
+                </div>
+                <div
+                  className="manage-race-chosen-action"
+                  onClick={this.handleChangeSpecies}
+                >
+                  Change Species
+                </div>
+              </div>
+              <PageHeader>{fullName}</PageHeader>
+              <HtmlContent
+                className={descriptionClassNames.join(" ")}
+                html={description ? description : ""}
+                withoutTooltips
+              />
+              {calledOutSpeciesTraits.length > 0 && (
+                <SummaryList
+                  list={calledOutSpeciesTraits}
+                  title="Species Traits"
+                  className={styles.summaryList}
+                />
+              )}
+              <div className="race-detail-more">
+                <a
+                  className="race-detail-more-link"
+                  href={moreDetailsUrl ? moreDetailsUrl : ""}
+                >
+                  {fullName} Details Page
+                </a>
+              </div>
+              {this.renderInformationCollapsible()}
+            </div>
+            {this.renderSpeciesTraitsContent()}
+          </div>
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+const SpeciesManageWithHooks = (props) => {
+  const navigate = useNavigate();
+  const { createModal } = useModalManager();
+  return (
+    <SpeciesManage {...props} navigate={navigate} createModal={createModal} />
+  );
+};
+
+export default ConnectedBuilderPage(
+  SpeciesManageWithHooks,
+  RouteKey.RACE_MANAGE,
+  (state) => {
+    return {
+      characterId: rulesEngineSelectors.getId(state),
+      species: rulesEngineSelectors.getRace(state),
+      choiceInfo: rulesEngineSelectors.getChoiceInfo(state),
+      ruleData: rulesEngineSelectors.getRuleData(state),
+      prerequisiteData: rulesEngineSelectors.getPrerequisiteData(state),
+      preferences: rulesEngineSelectors.getCharacterPreferences(state),
+      featLookup: rulesEngineSelectors.getFeatLookup(state),
+      definitionPool: serviceDataSelectors.getDefinitionPool(state),
+      loadAvailableOptionalSpeciesTraits:
+        apiCreatorSelectors.makeLoadAvailableOptionalRacialTraits(state),
+      loadAvailableFeats: apiCreatorSelectors.makeLoadAvailableFeats(state),
+      optionalOriginLookup: rulesEngineSelectors.getOptionalOriginLookup(state),
+      classSpellListSpellsLookup:
+        rulesEngineSelectors.getClassSpellListSpellsLookup(state),
+    };
+  }
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/SpeciesManageSpeciesTrait/SpeciesManageSpeciesTrait.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/SpeciesManageSpeciesTrait/SpeciesManageSpeciesTrait.tsx
new file mode 100644
index 0000000..e9d0478
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/SpeciesManageSpeciesTrait/SpeciesManageSpeciesTrait.tsx
@@ -0,0 +1,346 @@
+import axios, { Canceler } from "axios";
+import React from "react";
+
+import { LoadingPlaceholder } from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiAdapterUtils,
+  ApiResponse,
+  CharacterPreferences,
+  ChoiceData,
+  ChoiceUtils,
+  Constants,
+  CoreUtils,
+  DefinitionPool,
+  Feat,
+  FeatDefinitionContract,
+  FeatLookup,
+  FeatUtils,
+  HelperUtils,
+  OptionalOriginLookup,
+  OptionalOriginUtils,
+  PrerequisiteData,
+  RacialTrait,
+  RacialTraitUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Accordion } from "~/components/Accordion";
+import { FeatureChoice } from "~/components/FeatureChoice";
+import { HtmlContent } from "~/components/HtmlContent";
+
+import DataLoadingStatusEnum from "../../../../../Shared/constants/DataLoadingStatusEnum";
+import { AppLoggerUtils } from "../../../../../Shared/utils";
+
+interface Props {
+  speciesTrait: RacialTrait;
+  choiceInfo: ChoiceData;
+  preferences: CharacterPreferences;
+  prerequisiteData: PrerequisiteData;
+  featLookup: FeatLookup;
+  onChoiceChange: (
+    speciesTraitId: number,
+    choiceId: string,
+    type: number,
+    value: any
+  ) => void;
+  loadAvailableFeats: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<Array<FeatDefinitionContract>>>;
+  optionalOriginLookup: OptionalOriginLookup;
+  definitionPool: DefinitionPool;
+  speciesName?: string | null;
+}
+interface State {
+  featData: Array<Feat>;
+  hasFeatChoice: boolean;
+  collapsibleOpened: boolean;
+  loadingStatus: DataLoadingStatusEnum;
+}
+export default class SpeciesManageSpeciesTrait extends React.PureComponent<
+  Props,
+  State
+> {
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      featData: [],
+      hasFeatChoice: false,
+      collapsibleOpened: false,
+      loadingStatus: DataLoadingStatusEnum.NOT_INITIALIZED,
+    };
+  }
+
+  loadFeatsCanceler: null | Canceler = null;
+
+  componentDidMount(): void {
+    this.setState(
+      {
+        hasFeatChoice: this.hasFeatChoice(this.props),
+      },
+      () => {
+        this.conditionallyLoadFeatData();
+      }
+    );
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { speciesTrait } = this.props;
+    const { collapsibleOpened } = this.state;
+
+    if (speciesTrait !== prevProps.speciesTrait) {
+      this.setState(
+        {
+          hasFeatChoice: this.hasFeatChoice(this.props),
+        },
+        () => {
+          this.conditionallyLoadFeatData();
+        }
+      );
+    }
+    if (collapsibleOpened && !prevState.collapsibleOpened) {
+      this.conditionallyLoadFeatData();
+    }
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadFeatsCanceler !== null) {
+      this.loadFeatsCanceler();
+    }
+  }
+
+  conditionallyLoadFeatData = (): void => {
+    const { loadAvailableFeats } = this.props;
+    const { hasFeatChoice, loadingStatus, collapsibleOpened } = this.state;
+
+    if (
+      hasFeatChoice &&
+      collapsibleOpened &&
+      loadingStatus === DataLoadingStatusEnum.NOT_INITIALIZED
+    ) {
+      this.setState({
+        loadingStatus: DataLoadingStatusEnum.LOADING,
+      });
+
+      loadAvailableFeats({
+        cancelToken: new axios.CancelToken((c) => {
+          this.loadFeatsCanceler = c;
+        }),
+      })
+        .then((response) => {
+          let featData: Array<Feat> = [];
+
+          const data = ApiAdapterUtils.getResponseData(response);
+          if (data !== null) {
+            featData = data.map((definition) =>
+              FeatUtils.simulateFeat(definition)
+            );
+          }
+
+          this.setState({
+            featData,
+            loadingStatus: DataLoadingStatusEnum.LOADED,
+          });
+          this.loadFeatsCanceler = null;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    }
+  };
+
+  getFeatData = (existingFeatId: number | null): Array<Feat> => {
+    const { featData } = this.state;
+    const { featLookup } = this.props;
+
+    let data: Array<Feat> = [...featData];
+
+    if (existingFeatId !== null) {
+      let existingFeat = HelperUtils.lookupDataOrFallback(
+        featLookup,
+        existingFeatId
+      );
+      if (
+        existingFeat !== null &&
+        !data.some((feat) => FeatUtils.getId(feat) === existingFeatId)
+      ) {
+        data.push(existingFeat);
+      }
+    }
+
+    return data;
+  };
+
+  getSummary = () => {
+    const { speciesTrait, speciesName } = this.props;
+    // Get base name for the species trait
+    let name = RacialTraitUtils.getName(speciesTrait);
+    // Get the feature type for the species trait
+    const featureType = RacialTraitUtils.getFeatureType(speciesTrait);
+    // Get the display configuration for the species trait
+    const displayConfiguration =
+      RacialTraitUtils.getDisplayConfiguration(speciesTrait);
+    // Determine if we should add the species name to the name
+    const addName = displayConfiguration
+      ? CoreUtils.getDisplayConfigurationValue(
+          Constants.DisplayConfigurationTypeEnum.RACIAL_TRAIT,
+          displayConfiguration
+        ) === Constants.DisplayConfigurationValueEnum.ON
+      : false;
+    // Add the species name to the name if necessary
+    if (speciesName && addName) name = `${name} (${speciesName})`;
+    // Add "origin" to the name if it's an optional origin replacement feature
+    if (featureType === Constants.FeatureTypeEnum.REPLACEMENT)
+      name = `Origin ${name}`;
+    // Return constructed name
+    return name;
+  };
+
+  getMetaItems = () => {
+    const { speciesTrait, optionalOriginLookup, definitionPool } = this.props;
+    const displayConfiguration =
+      RacialTraitUtils.getDisplayConfiguration(speciesTrait);
+    const choices = RacialTraitUtils.getChoices(speciesTrait);
+    let metaItems: Array<string> = [];
+    if (choices.length) {
+      metaItems.push(
+        `${choices.length} Choice${choices.length !== 1 ? "s" : ""}`
+      );
+    }
+    const featureType = RacialTraitUtils.getFeatureType(speciesTrait);
+    const addOrigin = displayConfiguration
+      ? CoreUtils.getDisplayConfigurationValue(
+          Constants.DisplayConfigurationTypeEnum.RACIAL_TRAIT,
+          displayConfiguration
+        ) === Constants.DisplayConfigurationValueEnum.OFF
+      : false;
+    if (featureType !== Constants.FeatureTypeEnum.GRANTED || addOrigin) {
+      metaItems.push("Origin");
+    }
+    if (featureType === Constants.FeatureTypeEnum.REPLACEMENT) {
+      const optionalOrigin = HelperUtils.lookupDataOrFallback(
+        optionalOriginLookup,
+        RacialTraitUtils.getDefinitionKey(speciesTrait)
+      );
+      if (optionalOrigin) {
+        const affectedDefinitionKey =
+          OptionalOriginUtils.getAffectedRacialTraitDefinitionKey(
+            optionalOrigin
+          );
+        if (affectedDefinitionKey) {
+          const replacedSpeciesTrait = RacialTraitUtils.simulateRacialTrait(
+            affectedDefinitionKey,
+            definitionPool
+          );
+          if (replacedSpeciesTrait) {
+            metaItems.push(
+              `Replaces ${RacialTraitUtils.getName(replacedSpeciesTrait)}`
+            );
+          }
+        }
+      }
+    }
+
+    return metaItems;
+  };
+
+  hasFeatChoice = (props: Props): boolean => {
+    const { speciesTrait } = props;
+
+    const choices = RacialTraitUtils.getChoices(speciesTrait);
+    return choices.some(
+      (choice) =>
+        ChoiceUtils.getType(choice) ===
+        Constants.BuilderChoiceTypeEnum.FEAT_CHOICE_OPTION
+    );
+  };
+
+  handleCollapsibleOpened = (id: string, state: boolean): void => {
+    this.setState({
+      collapsibleOpened: state,
+    });
+  };
+
+  handleChoiceChange = (choiceId: string, type: number, value: any): void => {
+    const { onChoiceChange, speciesTrait } = this.props;
+
+    if (onChoiceChange) {
+      onChoiceChange(
+        RacialTraitUtils.getId(speciesTrait),
+        choiceId,
+        type,
+        HelperUtils.parseInputInt(value)
+      );
+    }
+  };
+
+  renderChoices = (): React.ReactNode => {
+    const { speciesTrait } = this.props;
+    const { featData } = this.state;
+
+    const choices = RacialTraitUtils.getChoices(speciesTrait);
+
+    if (choices === null) {
+      return null;
+    }
+
+    return choices.map((choice) => (
+      <FeatureChoice
+        choice={choice}
+        featsData={featData}
+        onChoiceChange={this.handleChoiceChange}
+        key={ChoiceUtils.getId(choice)}
+      />
+    ));
+  };
+
+  render() {
+    const { speciesTrait } = this.props;
+    const { hasFeatChoice, loadingStatus } = this.state;
+
+    const description = RacialTraitUtils.getDescription(speciesTrait);
+    const choices = RacialTraitUtils.getChoices(speciesTrait);
+    const accordionId = RacialTraitUtils.getId(speciesTrait).toString();
+
+    const hasTodoChoices: boolean = choices.some(
+      (choice) => ChoiceUtils.getOptionValue(choice) === null
+    );
+
+    const conClsNames: Array<string> = ["race-detail-racial-trait-name"];
+    if (hasTodoChoices) {
+      conClsNames.push("collapsible-todo");
+    }
+
+    let contentNode: React.ReactNode;
+    if (hasFeatChoice) {
+      if (loadingStatus === DataLoadingStatusEnum.LOADED) {
+        contentNode = this.renderChoices();
+      } else {
+        contentNode = <LoadingPlaceholder />;
+      }
+    } else {
+      contentNode = this.renderChoices();
+    }
+
+    return (
+      <Accordion
+        id={accordionId}
+        summary={this.getSummary()}
+        summaryMetaItems={this.getMetaItems()}
+        variant="paper"
+        showAlert={hasTodoChoices}
+        handleIsOpen={this.handleCollapsibleOpened}
+      >
+        <HtmlContent
+          className="race-detail-racial-trait-description"
+          html={description ? description : ""}
+          withoutTooltips
+        />
+        {contentNode}
+      </Accordion>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/SpeciesManageSpeciesTrait/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/SpeciesManageSpeciesTrait/index.ts
new file mode 100644
index 0000000..d6d78d4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/SpeciesManageSpeciesTrait/index.ts
@@ -0,0 +1,4 @@
+import SpeciesManageSpeciesTrait from "./SpeciesManageSpeciesTrait";
+
+export default SpeciesManageSpeciesTrait;
+export { SpeciesManageSpeciesTrait };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/index.ts
new file mode 100644
index 0000000..4539ef4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/SpeciesManage/index.ts
@@ -0,0 +1,5 @@
+import SpeciesManage from "./SpeciesManage";
+import SpeciesManageSpeciesTrait from "./SpeciesManageSpeciesTrait";
+
+export default SpeciesManage;
+export { SpeciesManage, SpeciesManageSpeciesTrait };
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/WhatsNext/WhatsNext.tsx b/ddb_main/tools/js/CharacterBuilder/containers/pages/WhatsNext/WhatsNext.tsx
new file mode 100644
index 0000000..90eeb13
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/WhatsNext/WhatsNext.tsx
@@ -0,0 +1,293 @@
+import React from "react";
+import { DispatchProp } from "react-redux";
+
+import {
+  LightExportSvg,
+  DisabledExportSvg,
+  DarkExportSvg,
+} from "@dndbeyond/character-components/es";
+
+import { Link } from "~/components/Link";
+import { ExportPdfData, usePdfExport } from "~/hooks/usePdfExport";
+import { RouteKey } from "~/subApps/builder/constants";
+
+import { BuilderLinkButton } from "../../../../Shared/components/common/LinkButton";
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import { ClipboardUtils, MobileMessengerUtils } from "../../../../Shared/utils";
+import Page from "../../../components/Page";
+import { PageBody } from "../../../components/PageBody";
+import PageHeader from "../../../components/PageHeader";
+import { builderEnvSelectors, builderSelectors } from "../../../selectors";
+import { BuilderAppState } from "../../../typings";
+import ConnectedBuilderPage from "../ConnectedBuilderPage";
+
+interface Props extends DispatchProp {
+  characterId: number | null;
+  characterListingUrl: string;
+  characterSheetUrl: string;
+  isCharacterSheetReady: boolean;
+  exportPdfData: ExportPdfData;
+}
+interface State {
+  hasCopied: boolean;
+}
+class WhatsNext extends React.PureComponent<Props, State> {
+  urlInput = React.createRef<HTMLInputElement>();
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      hasCopied: false,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const {
+      exportPdfData: { pdfUrl },
+    } = this.props;
+
+    if (pdfUrl !== null) {
+      this.selectUrlInput();
+    }
+  }
+
+  handleExportPdf = (evt: React.MouseEvent): void => {
+    const {
+      isCharacterSheetReady,
+      exportPdfData: { exportPdf, isLoading, isFinished },
+    } = this.props;
+
+    if (isCharacterSheetReady && !isLoading && !isFinished) {
+      exportPdf();
+    }
+  };
+
+  selectUrlInput = (): void => {
+    if (this.urlInput.current) {
+      this.urlInput.current.focus();
+      this.urlInput.current.setSelectionRange(
+        0,
+        this.urlInput.current.value.length
+      );
+    }
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const {
+      exportPdfData: { pdfUrl },
+    } = this.props;
+
+    ClipboardUtils.copyTextToClipboard(pdfUrl === null ? "" : pdfUrl);
+    this.setState({
+      hasCopied: true,
+    });
+  };
+
+  handleSheetShowClick = (isDisabled: boolean) => {
+    const { characterId } = this.props;
+
+    if (characterId !== null && !isDisabled) {
+      MobileMessengerUtils.sendMessage(
+        MobileMessengerUtils.createShowCharacterSheetMessage(characterId)
+      );
+    }
+  };
+
+  renderPdfButton = (): React.ReactNode => {
+    const {
+      isCharacterSheetReady,
+      exportPdfData: { isLoading, isFinished },
+    } = this.props;
+    // const { pdfLoadingStatus } = this.state;
+
+    let pdfButtonClasses: Array<string> = [
+      "ct-button",
+      "builder-button",
+      "whats-next-action-pdf",
+      "character-button-oversized",
+      "character-tools-export-pdf-button",
+    ];
+    let iconNode: React.ReactNode;
+    if (isCharacterSheetReady) {
+      iconNode = <LightExportSvg />;
+    } else {
+      pdfButtonClasses.push("character-button-disabled");
+      pdfButtonClasses.push("character-button-oversized-disabled");
+
+      iconNode = <DisabledExportSvg />;
+    }
+
+    if (isLoading) {
+      return (
+        <div
+          className={pdfButtonClasses.join(" ")}
+          onClick={this.handleExportPdf}
+        >
+          <span className="whats-next-action-icon">{iconNode}</span>
+          <span className="whats-next-action-text">Exporting PDF...</span>
+        </div>
+      );
+    } else if (isFinished) {
+      pdfButtonClasses.push("whats-next-action-confirmed");
+      return (
+        <div
+          className={pdfButtonClasses.join(" ")}
+          onClick={this.handleExportPdf}
+        >
+          <span className="whats-next-action-icon">✓</span>
+        </div>
+      );
+    }
+
+    pdfButtonClasses.push("whats-next-action-clickable");
+
+    return (
+      <div
+        className={pdfButtonClasses.join(" ")}
+        onClick={this.handleExportPdf}
+      >
+        <span className="whats-next-action-icon">{iconNode}</span>
+        <span className="whats-next-action-text">Export to PDF</span>
+      </div>
+    );
+  };
+
+  renderPdfData = (): React.ReactNode => {
+    const {
+      exportPdfData: { pdfUrl, isFinished },
+    } = this.props;
+    const { hasCopied } = this.state;
+
+    if (!isFinished || pdfUrl === null) {
+      return null;
+    }
+
+    return (
+      <div className="whats-next-pdf-data">
+        <div className="whats-next-pdf-data-splash-icon">
+          <DarkExportSvg />
+        </div>
+        <div className="whats-next-pdf-data-header">PDF Generated</div>
+        <div className="whats-next-pdf-data-url">
+          <input
+            type="text"
+            value={pdfUrl ? pdfUrl.replace(/https*:\/\//, "") : ""}
+            className="whats-next-pdf-data-input"
+            ref={this.urlInput}
+          />
+        </div>
+        <div
+          className="whats-next-pdf-data-clipboard"
+          onClick={this.handleClick}
+        >
+          {hasCopied ? (
+            <React.Fragment>Copied! &#x2714;</React.Fragment>
+          ) : (
+            "Click to Copy"
+          )}
+        </div>
+        {pdfUrl !== null && (
+          <div className="whats-next-pdf-data-download">
+            <BuilderLinkButton
+              url={pdfUrl}
+              size={"large"}
+              download={true}
+              className="whats-next-pdf-data-download-link"
+            >
+              Click to Download
+            </BuilderLinkButton>
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  render() {
+    const { characterListingUrl, characterSheetUrl, isCharacterSheetReady } =
+      this.props;
+
+    return (
+      <Page clsNames={["whats-next"]}>
+        <PageBody>
+          <p>
+            Once you have completed creating your character, you can view your
+            statistics on the digital character sheet or export it for printing.
+          </p>
+
+          <div className="whats-next-actions">
+            <div className="whats-next-action">
+              <BuilderLinkButton
+                url={characterSheetUrl}
+                className="whats-next-action-sheet-link"
+                size="oversized"
+                disabled={!isCharacterSheetReady}
+                onClick={this.handleSheetShowClick}
+              >
+                <div className="whats-next-action-text">
+                  <div className="whats-next-action-text">
+                    View Character Sheet
+                    {!isCharacterSheetReady && (
+                      <span className="whats-next-action-subtext">
+                        Unavailable - Character Incomplete
+                      </span>
+                    )}
+                  </div>
+                </div>
+              </BuilderLinkButton>
+            </div>
+            <div className="whats-next-action">{this.renderPdfButton()}</div>
+          </div>
+          {this.renderPdfData()}
+          <div className="whats-next-characters">
+            <Link href={characterListingUrl}>View all my characters</Link>
+          </div>
+
+          <PageHeader>Come Together</PageHeader>
+
+          <p>
+            Most D&amp;D characters don't work alone. Each character plays a
+            role within a party, a group of adventurers working together for a
+            common purpose. Talk to your fellow players and your DM to decide
+            whether your characters know one another, how they met, and what
+            sorts of quests the group might undertake.
+          </p>
+
+          <p>
+            A campaign is a series of adventures undertaken by your group's
+            characters. If your DM has a campaign, you can join it by visiting
+            the invite link for the campaign. You can also start your own.
+          </p>
+
+          <div className="whats-next-campaign">
+            <Link href="/campaigns/create" className="whats-next-campaign-link">
+              Start a new campaign
+            </Link>
+          </div>
+        </PageBody>
+      </Page>
+    );
+  }
+}
+
+function WhatsNextContainer(props) {
+  const exportPdfData = usePdfExport();
+  return <WhatsNext {...props} exportPdfData={exportPdfData} />;
+}
+
+export default ConnectedBuilderPage(
+  WhatsNextContainer,
+  RouteKey.WHATS_NEXT,
+  (state: BuilderAppState) => {
+    return {
+      characterId: appEnvSelectors.getCharacterId(state),
+      characterListingUrl: builderEnvSelectors.getProfileCharacterListingUrl(),
+      characterSheetUrl: builderEnvSelectors.getCharacterSheetUrl(state),
+      isCharacterSheetReady: builderSelectors.checkIsCharacterSheetReady(state),
+    };
+  }
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/containers/pages/WhatsNext/index.ts b/ddb_main/tools/js/CharacterBuilder/containers/pages/WhatsNext/index.ts
new file mode 100644
index 0000000..f2426d5
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/containers/pages/WhatsNext/index.ts
@@ -0,0 +1,4 @@
+import WhatsNext from "./WhatsNext";
+
+export default WhatsNext;
+export { WhatsNext };
diff --git a/ddb_main/tools/js/CharacterBuilder/reducers/builder.ts b/ddb_main/tools/js/CharacterBuilder/reducers/builder.ts
new file mode 100644
index 0000000..ee85ce4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/reducers/builder.ts
@@ -0,0 +1,60 @@
+import { BuilderAction, builderActionTypes } from "../actions/builder";
+import { BuilderState } from "../typings";
+
+const initialState: BuilderState = {
+  method: null,
+  confirmSpecies: null,
+  confirmClass: null,
+  isCharacterLoading: false,
+  isCharacterLoaded: false,
+  suggestedNames: [],
+};
+function builder(
+  state: BuilderState = initialState,
+  action: BuilderAction
+): BuilderState {
+  switch (action.type) {
+    case builderActionTypes.BUILDER_METHOD_SET_COMMIT:
+      return {
+        ...state,
+        method: action.payload.method,
+      };
+
+    case builderActionTypes.CONFIRM_SPECIES_SET:
+      return {
+        ...state,
+        confirmSpecies: action.payload.race,
+      };
+
+    case builderActionTypes.CONFIRM_CLASS_SET:
+      return {
+        ...state,
+        confirmClass: action.payload.charClass,
+      };
+
+    case builderActionTypes.CHARACTER_LOADING_SET_COMMIT:
+      return {
+        ...state,
+        isCharacterLoading: action.payload.isLoading,
+      };
+
+    case builderActionTypes.CHARACTER_LOADED_SET_COMMIT:
+      return {
+        ...state,
+        isCharacterLoaded: action.payload.isLoaded,
+      };
+
+    case builderActionTypes.SUGGESTED_NAMES_SET:
+      return {
+        ...state,
+        suggestedNames: action.payload.suggestedNames,
+      };
+
+    default:
+    // not implemented
+  }
+
+  return state;
+}
+
+export default builder;
diff --git a/ddb_main/tools/js/CharacterBuilder/sagas/builder.ts b/ddb_main/tools/js/CharacterBuilder/sagas/builder.ts
new file mode 100644
index 0000000..b87e9b9
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/sagas/builder.ts
@@ -0,0 +1,381 @@
+import { uniqueId } from "lodash";
+import { call, put, select, takeEvery } from "redux-saga/effects";
+
+import {
+  rulesEngineSelectors,
+  characterActionTypes,
+  characterActions,
+  syncTransactionActions,
+  syncTransactionSelectors,
+  ApiAdapterUtils,
+  ApiRequests,
+  UnpackMakeApiResponseData,
+  ruleDataActions,
+  SagaHelpers,
+  characterEnvSelectors,
+  Constants,
+  RaceUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { BuilderMethod, RouteKey } from "~/subApps/builder/constants";
+
+import { appEnvActions } from "../../Shared/actions";
+import { appEnvSelectors } from "../../Shared/selectors";
+import appConfig from "../../config";
+import {
+  builderActions,
+  builderActionTypes,
+  BuilderAction,
+  BuilderMethodSetAction,
+  QuickBuildRequestAction,
+  RandomBuildRequestAction,
+  StepBuildRequestAction,
+  SuggestedNamesRequestAction,
+} from "../actions";
+import * as navConfig from "../config/navigation";
+import { getRouteDefPath } from "../config/navigation";
+import { builderSelectors } from "../selectors";
+import { NavigationUtils } from "../utils";
+
+const syncActions = [
+  builderActionTypes.CHARACTER_LOAD_REQUEST,
+  builderActionTypes.QUICK_BUILD_REQUEST,
+  builderActionTypes.RANDOM_BUILD_REQUEST,
+  builderActionTypes.STEP_BUILD_REQUEST,
+  builderActionTypes.BUILDER_METHOD_SET,
+  builderActionTypes.SUGGESTED_NAMES_REQUEST,
+];
+
+export default function* saga() {
+  yield takeEvery(syncActions, syncFilter);
+  yield takeEvery(
+    Object.keys(characterActionTypes).map((key) => characterActionTypes[key]),
+    characterTypesFilter
+  );
+  yield takeEvery(
+    Object.keys(builderActionTypes).map((key) => builderActionTypes[key]),
+    filter
+  );
+}
+
+function* characterTypesFilter(action: any) {
+  switch (action.type) {
+    case characterActionTypes.RACE_CHOOSE_POST_ACTION: {
+      // yield put(push(getRouteDefPath(RouteKey.RACE_MANAGE)));
+      const characterId = yield select((state: any) =>
+        rulesEngineSelectors.getId(state)
+      );
+      const navigate = yield select(
+        (state: any) => state.routeControls.navigate
+      );
+      navigate(
+        getRouteDefPath(RouteKey.RACE_MANAGE).replace(
+          ":characterId",
+          characterId
+        )
+      );
+      break;
+    }
+
+    case characterActionTypes.CLASS_ADD_POST_ACTION: {
+      // yield put(push(getRouteDefPath(RouteKey.CLASS_MANAGE)));
+      const characterId = yield select((state: any) =>
+        rulesEngineSelectors.getId(state)
+      );
+      const navigate = yield select(
+        (state: any) => state.routeControls.navigate
+      );
+      navigate(
+        getRouteDefPath(RouteKey.CLASS_MANAGE).replace(
+          ":characterId",
+          characterId
+        )
+      );
+      break;
+    }
+
+    case characterActionTypes.CLASS_REMOVE_POST_ACTION: {
+      let classes = yield select(rulesEngineSelectors.getClasses);
+      if (classes.length === 0) {
+        // yield put(push(getRouteDefPath(RouteKey.CLASS_CHOOSE)));
+        const characterId = yield select((state: any) =>
+          rulesEngineSelectors.getId(state)
+        );
+        const navigate = yield select(
+          (state: any) => state.routeControls.navigate
+        );
+        navigate(
+          getRouteDefPath(RouteKey.CLASS_CHOOSE).replace(
+            ":characterId",
+            characterId
+          )
+        );
+      }
+      break;
+    }
+
+    case characterActionTypes.CHARACTER_LOAD_POST_ACTION: {
+      yield put(builderActions.characterLoadingSetCommit(false));
+      yield put(builderActions.characterLoadedSetCommit(true));
+
+      const builderMethod: ReturnType<
+        typeof builderSelectors.getBuilderMethod
+      > = yield select(builderSelectors.getBuilderMethod);
+      const context: ReturnType<typeof characterEnvSelectors.getContext> =
+        yield select(characterEnvSelectors.getContext);
+
+      if (
+        builderMethod === BuilderMethod.STEP_BY_STEP &&
+        context === Constants.AppContextTypeEnum.BUILDER
+      ) {
+        const configuration: ReturnType<
+          typeof rulesEngineSelectors.getCharacterConfiguration
+        > = yield select(rulesEngineSelectors.getCharacterConfiguration);
+        const stepByStepInitialPage = configuration.showHelpText
+          ? RouteKey.HOME_HELP
+          : RouteKey.HOME_BASIC_INFO;
+
+        const isCurrentRouteInRoutePathing = yield select(
+          NavigationUtils.checkIsCurrentRouteInRoutePathing
+        );
+
+        // TODO routes this needs fixed
+        // yield put(push(navConfig.getRouteDefPath(stepByStepInitialPage)));
+        if (!isCurrentRouteInRoutePathing) {
+          const navigate = yield select(
+            (state: any) => state.routeControls.navigate
+          );
+          navigate(
+            navConfig
+              .getRouteDefPath(stepByStepInitialPage)
+              .replace(":characterId", action.payload.characterId)
+          );
+        }
+        // window.location = navConfig.getRouteDefPath(stepByStepInitialPage).replace(':characterId', action.payload.characterId);
+        // }
+      }
+      break;
+    }
+  }
+}
+
+function* filter(action: BuilderAction) {
+  switch (action.type) {
+    case builderActionTypes.SHOW_HELP_TEXT_SET:
+      yield call(ApiRequests.putCharacterHelpText, action.payload);
+      yield put(characterActions.showHelpTextSet(action.payload.showHelpText));
+
+      if (action.payload.showHelpText) {
+        const currentSectionHelpRoutePath = yield select(
+          NavigationUtils.getCurrentSectionHelpRoutePath
+        );
+        if (currentSectionHelpRoutePath !== null) {
+          const characterId = yield select((state: any) =>
+            rulesEngineSelectors.getId(state)
+          );
+          const navigate = yield select(
+            (state: any) => state.routeControls.navigate
+          );
+          navigate(
+            currentSectionHelpRoutePath.replace(":characterId", characterId)
+          );
+          // yield put(push(currentSectionHelpRoutePath));
+        }
+      } else {
+        const availablePathRedirect = yield select(
+          NavigationUtils.getAvailablePathRedirect
+        );
+        if (availablePathRedirect !== null) {
+          const characterId = yield select((state: any) =>
+            rulesEngineSelectors.getId(state)
+          );
+          const navigate = yield select(
+            (state: any) => state.routeControls.navigate
+          );
+          navigate(availablePathRedirect.replace(":characterId", characterId));
+          // yield put(push(availablePathRedirect));
+        }
+      }
+      break;
+  }
+}
+
+function* syncFilter(action: BuilderAction) {
+  const isSyncTransactionActive = yield select(
+    syncTransactionSelectors.getActive
+  );
+  let transactionInitiatorId;
+
+  if (!isSyncTransactionActive) {
+    transactionInitiatorId = uniqueId();
+    yield put(syncTransactionActions.activate(transactionInitiatorId));
+  }
+
+  switch (action.type) {
+    case builderActionTypes.QUICK_BUILD_REQUEST:
+      yield call(handleQuickBuildRequest, action);
+      break;
+
+    case builderActionTypes.RANDOM_BUILD_REQUEST:
+      yield call(handleRandomBuildRequest, action);
+      break;
+
+    case builderActionTypes.STEP_BUILD_REQUEST:
+      yield call(handleStepBuildRequest, action);
+      break;
+
+    case builderActionTypes.CHARACTER_LOAD_REQUEST:
+      yield call(handleLoadCharacterRequest, action);
+      break;
+
+    case builderActionTypes.BUILDER_METHOD_SET:
+      yield call(handleBuilderMethodSet, action);
+      break;
+
+    case builderActionTypes.SUGGESTED_NAMES_REQUEST:
+      yield call(handleSuggestedNamesRequest, action);
+      break;
+  }
+
+  switch (action.type) {
+    case builderActionTypes.QUICK_BUILD_REQUEST:
+    case builderActionTypes.RANDOM_BUILD_REQUEST:
+      break;
+    default:
+      let syncTransactionInitiator = yield select(
+        syncTransactionSelectors.getInitiator
+      );
+      if (syncTransactionInitiator === transactionInitiatorId) {
+        yield put(syncTransactionActions.deactivate());
+      }
+      break;
+  }
+}
+
+function* handleBuilderMethodSet(action: BuilderMethodSetAction) {
+  const response = yield call(ApiRequests.getCharacterRuleData, {
+    params: { v: appConfig.version },
+  });
+  const data: UnpackMakeApiResponseData<
+    typeof ApiRequests.getCharacterRuleData
+  > | null = ApiAdapterUtils.getResponseData(response);
+
+  if (data !== null) {
+    yield put(ruleDataActions.dataSet(data));
+  }
+  yield put(builderActions.builderMethodSetCommit(action.payload));
+}
+
+function* handleQuickBuildRequest(action: QuickBuildRequestAction) {
+  const characterId: UnpackMakeApiResponseData<
+    typeof ApiRequests.postCharacterBuilderQuickBuild
+  > = yield call(
+    SagaHelpers.getApiRequestData,
+    ApiRequests.postCharacterBuilderQuickBuild,
+    action.payload
+  );
+
+  // if (data.success) {
+  const characterUrl = NavigationUtils.getCharacterBuilderUrl(characterId);
+  const initialPath = navConfig.getRouteDefPath(RouteKey.WHATS_NEXT);
+  // todo just a soft navigation
+  window.location = `${characterUrl}${initialPath}` as any;
+  // } else {
+  //TODO do something with error
+  // }
+}
+
+function* handleRandomBuildRequest(action: RandomBuildRequestAction) {
+  const characterId: UnpackMakeApiResponseData<
+    typeof ApiRequests.postCharacterBuilderRandomBuild
+  > = yield call(
+    SagaHelpers.getApiRequestData,
+    ApiRequests.postCharacterBuilderRandomBuild,
+    action.payload
+  );
+
+  // if (data.success) {
+  const characterUrl = NavigationUtils.getCharacterBuilderUrl(characterId);
+  const initialPath = navConfig.getRouteDefPath(RouteKey.WHATS_NEXT);
+  window.location = `${characterUrl}#${initialPath}` as any;
+  // } else {
+  //TODO do something with error
+  // }
+}
+
+function* handleStepBuildRequest(action: StepBuildRequestAction) {
+  yield put(builderActions.characterLoadingSetCommit(true));
+
+  //TODO fix with common refactor for populating character
+  const characterId: UnpackMakeApiResponseData<
+    typeof ApiRequests.postCharacterBuilderStandardBuild
+  > = yield call(
+    SagaHelpers.getApiRequestData,
+    ApiRequests.postCharacterBuilderStandardBuild,
+    action.payload
+  );
+
+  yield put(appEnvActions.dataSet({ characterId }));
+  yield put(
+    builderActions.builderMethodSetCommit({
+      method: BuilderMethod.STEP_BY_STEP,
+    })
+  );
+  yield select(appEnvSelectors.getUsername);
+  /* eslint-disable-next-line */
+  yield put(
+    characterActions.characterLoad(characterId, { v: appConfig.version })
+  );
+}
+
+function* handleLoadCharacterRequest(action: BuilderAction) {
+  yield put(builderActions.characterLoadingSetCommit(true));
+  const characterId: ReturnType<typeof appEnvSelectors.getCharacterId> =
+    yield select(appEnvSelectors.getCharacterId);
+
+  if (characterId === null) {
+    // TODO do something
+    return;
+  }
+
+  try {
+    yield put(
+      builderActions.builderMethodSetCommit({
+        method: BuilderMethod.STEP_BY_STEP,
+      })
+    );
+    yield put(
+      characterActions.characterLoad(characterId, { v: appConfig.version })
+    );
+  } catch (e) {
+    // TODO handle failure in builder init process
+  }
+}
+
+/**
+ *
+ * @param action
+ */
+export function* handleSuggestedNamesRequest(
+  action: SuggestedNamesRequestAction
+) {
+  const species: ReturnType<typeof rulesEngineSelectors.getRace> = yield select(
+    rulesEngineSelectors.getRace
+  );
+  let reqParams: ApiRequests.GetSuggestedNames_RequestData = {
+    count: 5,
+  };
+
+  if (species !== null) {
+    reqParams = {
+      ...reqParams,
+      raceDefinitionKey: RaceUtils.getDefinitionKey(species),
+    };
+  }
+
+  const names: UnpackMakeApiResponseData<typeof ApiRequests.getSuggestedNames> =
+    yield call(SagaHelpers.getApiRequestData, ApiRequests.getSuggestedNames, {
+      params: reqParams,
+    });
+  yield put(builderActions.suggestedNamesSet(names));
+}
diff --git a/ddb_main/tools/js/CharacterBuilder/selectors/builderSelectors.ts b/ddb_main/tools/js/CharacterBuilder/selectors/builderSelectors.ts
new file mode 100644
index 0000000..c0228c4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/selectors/builderSelectors.ts
@@ -0,0 +1,181 @@
+import { createSelector } from "reselect";
+
+import {
+  featureFlagInfoSelectors,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { NavigationType } from "~/subApps/builder/constants";
+
+import { getNavBuilderConfig } from "../config/navigation";
+import { BuilderAppState } from "../typings";
+
+export const getCurrentPath = (state) => window.location.pathname;
+
+export const getBuilderMethod = (state: BuilderAppState) =>
+  state.builder.method;
+export const getConfirmSpecies = (state: BuilderAppState) =>
+  state.builder.confirmSpecies;
+export const getConfirmClass = (state: BuilderAppState) =>
+  state.builder.confirmClass;
+export const getIsCharacterLoading = (state: BuilderAppState) =>
+  state.builder.isCharacterLoading;
+export const getIsCharacterLoaded = (state: BuilderAppState) =>
+  state.builder.isCharacterLoaded;
+export const getSuggestedNames = (state: BuilderAppState) =>
+  state.builder.suggestedNames;
+
+export const getRoutePathing = createSelector(
+  [
+    (state) => state,
+    getBuilderMethod,
+    rulesEngineSelectors.getCharacterConfiguration,
+  ],
+  (state, builderMethod, configuration) => {
+    const navConfig = getNavBuilderConfig(
+      builderMethod,
+      featureFlagInfoSelectors.getFeatureFlagInfo(state)
+    );
+
+    let exclusionNavTypes: Array<any> = [];
+    if (!configuration.showHelpText) {
+      exclusionNavTypes.push(NavigationType.HelpPage);
+    }
+
+    let routePath: Array<any> = [];
+    navConfig.forEach((section) => {
+      const { routes } = section;
+      routes.forEach((routeDef) => {
+        let available = true;
+        if (exclusionNavTypes.indexOf(routeDef.type) > -1) {
+          available = false;
+        }
+        if (!routeDef.checkCanAccess(routeDef, state)) {
+          available = false;
+        }
+        routePath.push({
+          ...routeDef,
+          available,
+        });
+      });
+    });
+
+    return routePath;
+  }
+);
+
+export const getAvailableRoutePathing = createSelector(
+  [
+    (state) => state,
+    getBuilderMethod,
+    rulesEngineSelectors.getCharacterConfiguration,
+  ],
+  (state, builderMethod, configuration) => {
+    const navConfig = getNavBuilderConfig(
+      builderMethod,
+      featureFlagInfoSelectors.getFeatureFlagInfo(state)
+    );
+
+    let exclusionNavTypes: Array<any> = [];
+    if (!configuration.showHelpText) {
+      exclusionNavTypes.push(NavigationType.HelpPage);
+    }
+
+    let routePath: Array<any> = [];
+    navConfig.forEach((section) => {
+      const { routes } = section;
+      routes.forEach((routeDef) => {
+        if (exclusionNavTypes.indexOf(routeDef.type) > -1) {
+          return;
+        }
+        if (!routeDef.checkCanAccess(routeDef, state)) {
+          return;
+        }
+        routePath.push({
+          ...routeDef,
+        });
+      });
+    });
+
+    return routePath;
+  }
+);
+
+export const getFirstAvailableSectionRoutes = createSelector(
+  [
+    (state) => state,
+    getBuilderMethod,
+    rulesEngineSelectors.getCharacterConfiguration,
+  ],
+  (state, builderMethod, configuration) => {
+    const navConfig = getNavBuilderConfig(
+      builderMethod,
+      featureFlagInfoSelectors.getFeatureFlagInfo(state)
+    );
+
+    let exclusionNavTypes: Array<any> = [];
+    if (!configuration.showHelpText) {
+      exclusionNavTypes.push(NavigationType.HelpPage);
+    }
+
+    let sections = {};
+    navConfig.forEach((section) => {
+      const { routes } = section;
+      let found = false;
+      routes.forEach((routeDef) => {
+        if (found) {
+          return;
+        }
+        if (exclusionNavTypes.indexOf(routeDef.type) > -1) {
+          return;
+        }
+        if (!routeDef.checkCanAccess(routeDef, state)) {
+          return;
+        }
+        sections[section.key] = routeDef;
+        found = true;
+      });
+    });
+
+    return sections;
+  }
+);
+
+export const checkIsCharacterSheetReady = createSelector(
+  [
+    rulesEngineSelectors.getRace,
+    rulesEngineSelectors.getClasses,
+    rulesEngineSelectors.getAbilities,
+    rulesEngineSelectors.getCharacterConfiguration,
+  ],
+  (species, classes, stats, configuration) => {
+    if (!species) {
+      return false;
+    }
+
+    if (!classes.length) {
+      return false;
+    }
+
+    let hasAllStats = true;
+    if (configuration.abilityScoreType === null) {
+      hasAllStats = false;
+    }
+    stats.forEach((stat) => {
+      if (stat.baseScore === null) {
+        hasAllStats = false;
+      }
+    });
+
+    if (!hasAllStats) {
+      return false;
+    }
+
+    return true;
+  }
+);
+
+export const checkHasCharRequiredData = createSelector(
+  [rulesEngineSelectors.getRace, rulesEngineSelectors.getClasses],
+  (species, classes) => species !== null && !!classes.length
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/selectors/envSelectors.ts b/ddb_main/tools/js/CharacterBuilder/selectors/envSelectors.ts
new file mode 100644
index 0000000..28d5290
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/selectors/envSelectors.ts
@@ -0,0 +1,14 @@
+import { createSelector } from "reselect";
+
+import * as appEnvSelectors from "../../Shared/selectors/appEnv";
+import * as NavigationUtils from "../utils/navigationUtils";
+
+export const getProfileCharacterListingUrl = () =>
+  NavigationUtils.getCharacterListingUrl();
+
+export const getCharacterSheetUrl = createSelector(
+  [appEnvSelectors.getCharacterId],
+  (characterId) => {
+    return NavigationUtils.getCharacterSheetUrl(characterId);
+  }
+);
diff --git a/ddb_main/tools/js/CharacterBuilder/utils/navigationUtils.ts b/ddb_main/tools/js/CharacterBuilder/utils/navigationUtils.ts
new file mode 100644
index 0000000..1e9699b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterBuilder/utils/navigationUtils.ts
@@ -0,0 +1,163 @@
+import { flatten } from "lodash";
+
+import {
+  featureFlagInfoSelectors,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine";
+
+import config from "~/config";
+import { NavigationType } from "~/subApps/builder/constants";
+
+import * as navConfig from "../config/navigation";
+import { builderSelectors } from "../selectors";
+
+const BASE_PATHNAME = config.basePathname;
+
+function checkIsRouteInNavConfig(targetRouteDef, navConfig) {
+  const routeDefs: Array<any> = flatten(
+    navConfig.map((section) => section.routes)
+  );
+  return routeDefs.filter((routeDef) => routeDef.key === targetRouteDef.key)
+    .length;
+}
+
+export function checkStdBuilderPageRequirements(routeDef, state) {
+  return (
+    builderSelectors.getBuilderMethod(state) !== null &&
+    checkIsRouteInNavConfig(
+      routeDef,
+      navConfig.getNavBuilderConfig(
+        builderSelectors.getBuilderMethod(state),
+        featureFlagInfoSelectors.getFeatureFlagInfo(state)
+      )
+    )
+  );
+}
+
+export function checkIsCurrentRouteInRoutePathing(state) {
+  const currentPath = state.routeControls.currentPath;
+  const characterId = rulesEngineSelectors.getId(state);
+  const routePathing = builderSelectors.getRoutePathing(state);
+  const currentRoutePathIdx = getRoutePathIdxByPath(
+    currentPath,
+    routePathing,
+    characterId
+  );
+  return currentRoutePathIdx > 0;
+}
+
+// TODO: This function seems to jsut return '/' so investigate it and remove it if it's not needed
+export const getAvailableRouteRedirect = (routeKey, state) => {
+  const routePath = navConfig.getRouteDefPath(routeKey);
+  const routePathing = builderSelectors.getRoutePathing(state);
+  const currentRoutePathIdx = getRoutePathIdxByPath(routePath, routePathing);
+
+  const currentRoutePathingNode = routePathing[currentRoutePathIdx];
+
+  if (currentRoutePathIdx === -1 || !currentRoutePathingNode.available) {
+    return "/";
+  }
+
+  return "/";
+};
+
+export const getRoutePathIdx = (routeKey, routePathDef) => {
+  const path = navConfig.getRouteDefPath(routeKey);
+  return routePathDef.findIndex((routeDef) => path === routeDef.path);
+};
+
+export function getRoutePathIdxByPath(path, routePathDef, characterId = 0) {
+  return routePathDef.findIndex(
+    (routeDef) => path === routeDef.path.replace(":characterId", characterId)
+  );
+}
+
+export function getCurrentSectionHelpRoutePath(state) {
+  const currentPath = builderSelectors.getCurrentPath(state);
+  const sections = navConfig.getNavigationSections(
+    builderSelectors.getBuilderMethod(state),
+    navConfig.getCurrentRouteDef(currentPath),
+    featureFlagInfoSelectors.getFeatureFlagInfo(state)
+  );
+  const currentSection = sections.find((section) => section.active);
+  const currentSectionHelpRoute = currentSection.routes.find(
+    (route) => route.type === NavigationType.HelpPage
+  );
+  //TODO change this to getRouteDefPath once it takes a routeDef instead of routeKey
+  if (currentSectionHelpRoute) {
+    return currentSectionHelpRoute.path;
+  } else {
+    return null;
+  }
+}
+
+export function getAvailablePathRedirect(state) {
+  const currentPath = builderSelectors.getCurrentPath(state);
+  const routePathing = builderSelectors.getRoutePathing(state);
+  const characterId = rulesEngineSelectors.getId(state);
+  const currentRoutePathIdx = getRoutePathIdxByPath(
+    currentPath,
+    routePathing,
+    characterId
+  );
+
+  const currentRoutePathingNode = routePathing[currentRoutePathIdx];
+  if (!currentRoutePathingNode.available) {
+    for (let i = currentRoutePathIdx; i < routePathing.length; i++) {
+      if (routePathing[i].available) {
+        return routePathing[i].path;
+      }
+    }
+  }
+
+  return null;
+}
+
+export const getAvailablePrevRoute = (routeDef, state) => {
+  const availableRoutePath = builderSelectors.getAvailableRoutePathing(state);
+  const currentRoutePathIdx = getRoutePathIdx(routeDef.key, availableRoutePath);
+
+  // -1 === can't find in route path
+  // 0 === first page in path and there isn't a previous
+  if (currentRoutePathIdx <= 0) {
+    return null;
+  }
+
+  return availableRoutePath[currentRoutePathIdx - 1];
+};
+
+export const getAvailableNextRoute = (routeDef, state) => {
+  const availableRoutePath = builderSelectors.getAvailableRoutePathing(state);
+  const currentRoutePathIdx = getRoutePathIdx(routeDef.key, availableRoutePath);
+  const lastAvailableRoutePathIdx = availableRoutePath.length - 1;
+
+  // -1 === can't find in route path
+  // current = last === can't go any next because at last
+  if (
+    currentRoutePathIdx < 0 ||
+    currentRoutePathIdx >= lastAvailableRoutePathIdx
+  ) {
+    return null;
+  }
+
+  return availableRoutePath[currentRoutePathIdx + 1];
+};
+
+export function getCharacterBuilderUrl(characterId): string {
+  return `${BASE_PATHNAME}/${characterId}/builder`;
+}
+
+export function getCharacterSheetUrl(characterId): string {
+  return `${BASE_PATHNAME}/${characterId}`;
+}
+
+export function getCharacterListingUrl(): string {
+  return `${BASE_PATHNAME}`;
+}
+
+export function getUrlWithParams(url?: string): string {
+  const baseUrl = url ?? BASE_PATHNAME;
+  return window.location.search
+    ? `${baseUrl}${window.location.search}`
+    : baseUrl;
+}
diff --git a/ddb_main/tools/js/CharacterSheet/actions/sheet/actionTypes.ts b/ddb_main/tools/js/CharacterSheet/actions/sheet/actionTypes.ts
new file mode 100644
index 0000000..af0801a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/actions/sheet/actionTypes.ts
@@ -0,0 +1,2 @@
+export const CHARACTER_INIT = "sheet.CHARACTER_INIT";
+export const CHARACTER_RECEIVE_FAIL = "sheet.CHARACTER_RECEIVE_FAIL";
diff --git a/ddb_main/tools/js/CharacterSheet/actions/sheet/actions.ts b/ddb_main/tools/js/CharacterSheet/actions/sheet/actions.ts
new file mode 100644
index 0000000..cffdb9b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/actions/sheet/actions.ts
@@ -0,0 +1,28 @@
+import {
+  CharacterInitAction,
+  CharacterReceiveFailAction,
+  sheetActionTypes,
+} from "../sheet";
+
+/**
+ *
+ */
+export function characterInit(): CharacterInitAction {
+  return {
+    type: sheetActionTypes.CHARACTER_INIT,
+    payload: {},
+  };
+}
+
+/**
+ *
+ * @param error
+ */
+export function characterReceiveFail(error: Error): CharacterReceiveFailAction {
+  return {
+    type: sheetActionTypes.CHARACTER_RECEIVE_FAIL,
+    payload: {
+      error,
+    },
+  };
+}
diff --git a/ddb_main/tools/js/CharacterSheet/actions/sheet/index.ts b/ddb_main/tools/js/CharacterSheet/actions/sheet/index.ts
new file mode 100644
index 0000000..81d05cc
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/actions/sheet/index.ts
@@ -0,0 +1,9 @@
+import * as actionTypes from "./actionTypes";
+import * as actions from "./actions";
+import * as typings from "./typings";
+
+export const sheetActionTypes = actionTypes;
+export const sheetActions = actions;
+export const sheetTypings = typings;
+
+export * from "./typings";
diff --git a/ddb_main/tools/js/CharacterSheet/components/ActionSnippet/ActionSnippet.tsx b/ddb_main/tools/js/CharacterSheet/components/ActionSnippet/ActionSnippet.tsx
new file mode 100644
index 0000000..cfd1175
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ActionSnippet/ActionSnippet.tsx
@@ -0,0 +1,179 @@
+import React from "react";
+
+import { Snippet } from "@dndbeyond/character-components/es";
+import {
+  AbilityLookup,
+  Action,
+  ActionUtils,
+  ActivationContract,
+  ActivationUtils,
+  BaseInventoryContract,
+  ClassUtils,
+  Constants,
+  ClassFeatureContract,
+  InfusionUtils,
+  ItemUtils,
+  LevelScaleContract,
+  RuleData,
+  SnippetData,
+  ClassFeatureUtils,
+  InventoryLookup,
+  HelperUtils,
+  Hack__BaseCharClass,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemName } from "~/components/ItemName";
+
+import { FeatureSnippetLimitedUse } from "../FeatureSnippet";
+
+interface Props {
+  action: Action;
+  activation: ActivationContract;
+  showActivationInfo: boolean;
+
+  onActionClick?: (action: Action) => void;
+  onActionUseSet?: (action: Action, used: number) => void;
+
+  abilityLookup: AbilityLookup;
+  inventoryLookup: InventoryLookup;
+  ruleData: RuleData;
+  snippetData: SnippetData;
+  isInteractive: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+export default class ActionSnippet extends React.PureComponent<Props> {
+  static defaultProps = {
+    showActivationInfo: false,
+  };
+
+  handleActionUseSet = (action: Action, uses: number): void => {
+    const { onActionUseSet } = this.props;
+
+    if (onActionUseSet) {
+      onActionUseSet(action, uses);
+    }
+  };
+
+  handleActionClick = (evt: React.MouseEvent): void => {
+    const { action, onActionClick } = this.props;
+
+    if (onActionClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onActionClick(action);
+    }
+  };
+
+  render() {
+    const {
+      action,
+      ruleData,
+      abilityLookup,
+      snippetData,
+      isInteractive,
+      showActivationInfo,
+      inventoryLookup,
+      activation,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    let limitedUse = ActionUtils.getLimitedUse(action);
+    let name: React.ReactNode = ActionUtils.getName(action);
+    let dataOrigin = ActionUtils.getDataOrigin(action);
+    let dataOriginType = ActionUtils.getDataOriginType(action);
+
+    let classLevel: number | null = null;
+    let scaleValue: LevelScaleContract | null = null;
+
+    switch (dataOriginType) {
+      case Constants.DataOriginTypeEnum.CLASS_FEATURE:
+        classLevel = ClassUtils.getLevel(
+          dataOrigin.parent as Hack__BaseCharClass
+        );
+        scaleValue = ClassFeatureUtils.getLevelScale(
+          dataOrigin.primary as ClassFeatureContract
+        );
+        break;
+      case Constants.DataOriginTypeEnum.RACE:
+        //scaleValue = RacialTraitUtils.getLevelScale(dataOrigin.primary); //TODO this doesn't exist.. is it still needed?
+        break;
+      case Constants.DataOriginTypeEnum.ITEM: {
+        if (!name) {
+          const itemContract = dataOrigin.primary as BaseInventoryContract;
+          const itemMappingId = ItemUtils.getMappingId(itemContract);
+          const item = HelperUtils.lookupDataOrFallback(
+            inventoryLookup,
+            itemMappingId
+          );
+
+          if (item !== null) {
+            const infusion = ItemUtils.getInfusion(item);
+            name = (
+              <React.Fragment>
+                <ItemName item={item} />
+                {infusion !== null && (
+                  <span className="ct-feature-snippet__heading-extra">
+                    (Infusion: {InfusionUtils.getName(infusion)})
+                  </span>
+                )}
+              </React.Fragment>
+            );
+          }
+        }
+        break;
+      }
+    }
+
+    let activationDisplay: React.ReactNode;
+    if (showActivationInfo && activation) {
+      activationDisplay = (
+        <span
+          className={`ct-feature-snippet__heading-activation ${
+            theme.isDarkMode
+              ? "ct-feature-snippet__heading-activation--dark-mode"
+              : ""
+          }`}
+        >
+          ({ActivationUtils.renderActivation(activation, ruleData)})
+        </span>
+      );
+    }
+
+    return (
+      <div className="ct-feature-snippet" onClick={this.handleActionClick}>
+        <div
+          className={`ct-feature-snippet__heading ${
+            theme.isDarkMode ? "ct-feature-snippet__heading--dark-mode" : ""
+          }`}
+        >
+          {name} {activationDisplay}
+        </div>
+        <div className="ct-feature-snippet__content">
+          <Snippet
+            snippetData={snippetData}
+            theme={theme}
+            classLevel={classLevel}
+            levelScale={scaleValue}
+            limitedUse={limitedUse}
+            proficiencyBonus={proficiencyBonus}
+          >
+            {ActionUtils.getSnippet(action)}
+          </Snippet>
+        </div>
+        <FeatureSnippetLimitedUse
+          component={action}
+          theme={theme}
+          limitedUse={limitedUse}
+          onUseSet={this.handleActionUseSet}
+          abilityLookup={abilityLookup}
+          ruleData={ruleData}
+          isInteractive={isInteractive}
+          proficiencyBonus={proficiencyBonus}
+        />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ActionSnippet/index.ts b/ddb_main/tools/js/CharacterSheet/components/ActionSnippet/index.ts
new file mode 100644
index 0000000..693a102
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ActionSnippet/index.ts
@@ -0,0 +1,4 @@
+import ActionSnippet from "./ActionSnippet";
+
+export default ActionSnippet;
+export { ActionSnippet };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ActionsList/ActionListSection.tsx b/ddb_main/tools/js/CharacterSheet/components/ActionsList/ActionListSection.tsx
new file mode 100644
index 0000000..415488a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ActionsList/ActionListSection.tsx
@@ -0,0 +1,49 @@
+import { CharacterTheme } from "@dndbeyond/character-rules-engine";
+import { HTMLAttributes } from "react";
+import styles from "./styles.module.css";
+import clsx from "clsx";
+
+
+interface ActionListSectionProps extends HTMLAttributes<HTMLDivElement> {
+    headingText: string;
+    theme: CharacterTheme;
+    testId?: string;
+  };
+
+export const ActionListSection = ({
+    // Component Props
+    theme,
+    headingText,
+    testId = "",
+    // From HTMLAttributes
+    className,
+    children,
+    ...props
+}: ActionListSectionProps) => {
+    const headingTestId = `actions-list-${testId}-heading`;
+    const listTestId = `actions-list-${testId}-list`;
+
+    return (
+      <div className={clsx([styles.section, className])} {...props}>
+        <div 
+            className={clsx([
+                styles.sectionHeading,
+                theme?.isDarkMode && styles.darkMode,
+            ])}
+            data-testid={headingTestId}
+        >
+            {headingText}
+        </div>
+        <div
+            className={clsx([
+                styles.list,
+                theme?.isDarkMode && styles.darkMode,
+            ])}
+            data-testid={listTestId}
+        >
+            {children}
+        </div>
+      </div>
+    );
+  };
+  
\ No newline at end of file
diff --git a/ddb_main/tools/js/CharacterSheet/components/ActionsList/ActionsList.tsx b/ddb_main/tools/js/CharacterSheet/components/ActionsList/ActionsList.tsx
new file mode 100644
index 0000000..695917e
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ActionsList/ActionsList.tsx
@@ -0,0 +1,238 @@
+import { orderBy } from "lodash";
+import React, { HTMLAttributes, useMemo } from "react";
+import { AttackTable } from "@dndbeyond/character-components/es";
+import {
+  AbilityLookup,
+  Activatable,
+  Attack,
+  BasicActionContract,
+  Constants,
+  RuleData,
+  SnippetData,
+  Spell,
+  SpellCasterInfo,
+  SpellUtils,
+  WeaponSpellDamageGroup,
+  InventoryLookup,
+  DataOriginRefData,
+  HelperUtils,
+  ActionUtils,
+  BaseSpell,
+  CharacterTheme,
+  Action,
+} from "@dndbeyond/character-rules-engine/es";
+import { IRollContext } from "@dndbeyond/dice";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import ActionSnippet from "../ActionSnippet";
+import BasicActions from "../BasicActions";
+import { FeatureSnippetSpells } from "../FeatureSnippet";
+import clsx from "clsx";
+import styles from "./styles.module.css";
+import { ActionListSection } from "./ActionListSection";
+
+
+interface ActionsListProps extends HTMLAttributes<HTMLDivElement> {
+  heading: React.ReactNode;
+  theme: CharacterTheme;
+  showNotes: boolean;
+  diceEnabled?: boolean;
+  isInteractive: boolean;
+  showActivationInfo?: boolean;
+
+  actions?: Array<Activatable>;
+  basicActions?: Array<BasicActionContract>;
+  ritualSpells?: Array<Spell>;
+  attacks?: Array<Attack>;
+  weaponSpellDamageGroups: Array<WeaponSpellDamageGroup>;
+  ruleData: RuleData;
+  spellCasterInfo: SpellCasterInfo;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+  rollContext: IRollContext;
+  inventoryLookup: InventoryLookup;
+  snippetData: SnippetData;
+  
+  // ActionHandlers
+  onAttackClick: (attack: Attack) => void;
+  onActionClick: (action: Action) => void;
+  onBasicActionClick: (basicAction: BasicActionContract) => void;
+  onActionUseSet: (action: Action, used: number) => void;
+  onSpellClick: (spell: Spell) => void;
+  onSpellUseSet: (spell: Spell, used: number) => void;
+};
+
+export const ActionsList = ({
+  heading,
+  theme,
+  showNotes,
+  isInteractive,
+  diceEnabled = false,
+  showActivationInfo = false,
+
+  actions = [],
+  basicActions = [],
+  ritualSpells = [],
+  attacks = [],
+  weaponSpellDamageGroups,
+  ruleData,
+  spellCasterInfo,
+  abilityLookup,
+  dataOriginRefData,
+  proficiencyBonus,
+  rollContext,
+  inventoryLookup,
+  snippetData,
+  // From ActionHandlers
+  onAttackClick,
+  onBasicActionClick,
+  onActionClick,
+  onActionUseSet,
+  onSpellClick,
+  onSpellUseSet,
+  // From HTMLAttributes
+  className,
+  ...props
+}: ActionsListProps) => {
+  const { actionLookup } = useCharacterEngine();
+
+  const isVisible = useMemo(
+    () => !!basicActions.length
+      || !!actions.length
+      || !!ritualSpells.length
+      || !!attacks.length,
+    [basicActions, actions, ritualSpells, attacks]
+  );
+  
+  const attackTableProps = {
+    attacks,
+    weaponSpellDamageGroups,
+    ruleData,
+    abilityLookup,
+    spellCasterInfo,
+    onAttackClick,
+    showNotes,
+    diceEnabled,
+    theme,
+    dataOriginRefData,
+    proficiencyBonus,
+    rollContext,
+  };
+
+  const spellSnippetProps = {
+    onSpellClick,
+    onSpellUseSet,
+    ruleData,
+    theme,
+    abilityLookup,
+    isInteractive,
+    dataOriginRefData,
+    proficiencyBonus,
+  };
+
+  const spells = useMemo(() => {
+    let spells: Array<BaseSpell> = [];
+
+    actions.forEach((action) => {
+      switch (action.type) {
+        case Constants.ActivatableTypeEnum.CLASS_SPELL:
+        case Constants.ActivatableTypeEnum.CHARACTER_SPELL:
+          spells.push(action.entity);
+          break;
+      }
+    });
+
+    return spells;
+  }, [actions]);
+
+  const orderedRitualSpells = useMemo(
+    () => orderBy(
+      ritualSpells,
+      (spell) => SpellUtils.getName(spell)
+    ),
+    [ritualSpells]
+  );
+
+  const features = useMemo(() => actions.filter(
+    a => a.type === Constants.ActivatableTypeEnum.ACTION)
+      .map(feature => {
+        const action = HelperUtils.lookupDataOrFallback(
+          actionLookup,
+          ActionUtils.getUniqueKey(feature.entity)
+        );
+        return (          
+          <div
+            className={styles.activatable}
+            key={feature.key}
+            data-testid="actions-list-activatable-feature"
+          >
+            <ActionSnippet
+              theme={theme}
+              action={action ?? feature.entity}
+              onActionClick={onActionClick}
+              onActionUseSet={onActionUseSet}
+              abilityLookup={abilityLookup}
+              inventoryLookup={inventoryLookup}
+              ruleData={ruleData}
+              snippetData={snippetData}
+              isInteractive={isInteractive}
+              showActivationInfo={showActivationInfo}
+              activation={feature.activation}
+              proficiencyBonus={proficiencyBonus}
+            />
+          </div>
+        );
+      }),
+    [
+      actions,
+      actionLookup,
+      theme,
+      onActionClick,
+      onActionUseSet,
+      abilityLookup,
+      inventoryLookup,
+      ruleData,
+      snippetData,
+      isInteractive,
+      showActivationInfo,
+      proficiencyBonus,
+    ]);
+
+  return isVisible ? (
+    <div className={clsx([styles.actionsList, className])} {...props}>
+      <div
+        className={clsx([styles.heading, theme.isDarkMode && styles.darkMode])}
+        data-testid="actions-list-header"
+      >
+        {heading}
+      </div>
+      <div>
+        {!!attacks.length && <AttackTable className={styles.attackTable} {...attackTableProps} />}
+
+        {!!basicActions.length && (
+          <ActionListSection headingText="Actions in Combat" testId="basic" theme={theme}>
+            <BasicActions
+              onActionClick={onBasicActionClick}
+              basicActions={basicActions}
+              theme={theme}
+            />
+          </ActionListSection>
+        )}
+
+        {!!spells.length && (
+          <ActionListSection headingText="Spells" theme={theme}>
+            <FeatureSnippetSpells layoutType={"compact"}  spells={spells} {...spellSnippetProps} />
+          </ActionListSection>
+        )}
+
+        {!!ritualSpells.length && (
+          <ActionListSection headingText="Ritual Spells" theme={theme}>
+            <FeatureSnippetSpells layoutType={"compact"}  spells={orderedRitualSpells} {...spellSnippetProps} />
+          </ActionListSection>
+        )}
+
+        {features}
+      </div>
+    </div>
+  ) : null;
+};
diff --git a/ddb_main/tools/js/CharacterSheet/components/BackgroundDetail/BackgroundDetail.tsx b/ddb_main/tools/js/CharacterSheet/components/BackgroundDetail/BackgroundDetail.tsx
new file mode 100644
index 0000000..25539b0
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/BackgroundDetail/BackgroundDetail.tsx
@@ -0,0 +1,100 @@
+import React from "react";
+
+import {
+  AbilityLookup,
+  Action,
+  Background,
+  BackgroundUtils,
+  CharacterFeaturesManager,
+  CharacterTheme,
+  DataOriginRefData,
+  FeatManager,
+  RuleData,
+  SnippetData,
+  Spell,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { DataOriginTypeEnum } from "~/constants";
+
+import { FeatFeatureSnippet } from "../FeatureSnippet";
+
+interface Props {
+  background: Background | null;
+  onClick: () => void;
+  onFeatClick?: (feat: FeatManager) => void;
+  featuresManager: CharacterFeaturesManager;
+  onActionUseSet: (action: Action, uses: number) => void;
+  onActionClick?: (action: Action) => void;
+  onSpellClick?: (spell: Spell) => void;
+  onSpellUseSet: (spell: Spell, uses: number) => void;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+export default class BackgroundDetail extends React.PureComponent<Props> {
+  handleBackgroundClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  renderDefault = (): React.ReactNode => {
+    return (
+      <div className="ct-background__default">
+        Your character's background feature will display in this section once
+        chosen.
+      </div>
+    );
+  };
+
+  render() {
+    const { background, featuresManager, onFeatClick, ...restProps } =
+      this.props;
+
+    if (!background) {
+      return this.renderDefault();
+    }
+
+    const name = BackgroundUtils.getName(background);
+    const featureName = BackgroundUtils.getFeatureName(background);
+    const featureDescription =
+      BackgroundUtils.getFeatureDescription(background);
+
+    const feats = featuresManager.getDataOriginOnlyFeatsByParent(
+      DataOriginTypeEnum.BACKGROUND,
+      `${BackgroundUtils.getId(background)}`
+    );
+
+    return (
+      <div className="ct-background" onClick={this.handleBackgroundClick}>
+        <div className="ct-background__name">{name}</div>
+        <>
+          {featureDescription && (
+            <div className="ct-background__feature">
+              <div className="ct-background__feature-name">
+                {featureName ? `Feature: ${featureName}` : "Feature"}
+              </div>
+              <HtmlContent
+                className="ct-background__feature-description"
+                html={featureDescription}
+                withoutTooltips
+              />
+            </div>
+          )}
+          {feats.map((feat) => (
+            <FeatFeatureSnippet key={feat.getId()} feat={feat} {...restProps} />
+          ))}
+        </>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/BackgroundDetail/index.ts b/ddb_main/tools/js/CharacterSheet/components/BackgroundDetail/index.ts
new file mode 100644
index 0000000..5b40ec9
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/BackgroundDetail/index.ts
@@ -0,0 +1,4 @@
+import BackgroundDetail from "./BackgroundDetail";
+
+export default BackgroundDetail;
+export { BackgroundDetail };
diff --git a/ddb_main/tools/js/CharacterSheet/components/BasicActions/BasicActions.tsx b/ddb_main/tools/js/CharacterSheet/components/BasicActions/BasicActions.tsx
new file mode 100644
index 0000000..5a8169a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/BasicActions/BasicActions.tsx
@@ -0,0 +1,62 @@
+import { orderBy } from "lodash";
+import React from "react";
+
+import {
+  BasicActionContract,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  basicActions: Array<BasicActionContract>;
+  onActionClick?: (basicAction: BasicActionContract) => void;
+  theme: CharacterTheme;
+}
+export default class BasicActions extends React.PureComponent<Props> {
+  handleActionClick = (
+    basicAction: BasicActionContract,
+    evt: React.MouseEvent
+  ): void => {
+    const { onActionClick } = this.props;
+
+    if (onActionClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onActionClick(basicAction);
+    }
+  };
+
+  render() {
+    const { basicActions, theme } = this.props;
+
+    if (!basicActions.length) {
+      return null;
+    }
+
+    let orderedActions = orderBy(
+      basicActions,
+      [(basicAction) => basicAction.name],
+      ["asc"]
+    );
+
+    return (
+      <div
+        className={`ct-basic-actions ${
+          theme.isDarkMode ? "ct-basic-actions--dark-mode" : ""
+        }`}
+      >
+        {orderedActions.map((basicAction, idx) => (
+          <span
+            className="ct-basic-actions__action"
+            key={basicAction.id}
+            onClick={this.handleActionClick.bind(this, basicAction)}
+          >
+            {basicAction.name}
+            {idx + 1 < orderedActions.length && (
+              <span className="ct-basic-actions__action-sep">,</span>
+            )}
+          </span>
+        ))}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/BasicActions/index.ts b/ddb_main/tools/js/CharacterSheet/components/BasicActions/index.ts
new file mode 100644
index 0000000..af039e4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/BasicActions/index.ts
@@ -0,0 +1,4 @@
+import BasicActions from "./BasicActions";
+
+export default BasicActions;
+export { BasicActions };
diff --git a/ddb_main/tools/js/CharacterSheet/components/BlessingsDetail/BlessingsDetail.tsx b/ddb_main/tools/js/CharacterSheet/components/BlessingsDetail/BlessingsDetail.tsx
new file mode 100644
index 0000000..ea0e6c3
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/BlessingsDetail/BlessingsDetail.tsx
@@ -0,0 +1,110 @@
+import React, { useContext, useEffect, useState } from "react";
+import { useSelector } from "react-redux";
+
+import {
+  FeatureManager,
+  FeaturesManager,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+import { PaneIdentifierUtils } from "~/tools/js/Shared/utils";
+import { Snippet } from "~/tools/js/smartComponents";
+
+import { CharacterFeaturesManagerContext } from "../../../Shared/managers/CharacterFeaturesManagerContext";
+
+interface Props {
+  // onActionUseSet: (action: Action, uses: number) => void;
+  // onActionClick: (action: Action) => void;
+  // onSpellClick: (spell: Spell) => void;
+  // onSpellUseSet: (spell: Spell, uses: number) => void;
+  // onFeatureClick: (feat: FeatManager) => void;
+  // snippetData: SnippetData;
+  // ruleData: RuleData;
+  // abilityLookup: AbilityLookup;
+  // dataOriginRefData: DataOriginRefData;
+  // isReadonly: boolean;
+  // proficiencyBonus: number;
+  // theme: CharacterTheme;
+}
+export const BlessingsDetail: React.FC<Props> = () => {
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const [blessings, setBlessings] = useState<Array<FeatureManager>>([]);
+
+  useEffect(() => {
+    async function onUpdate() {
+      const blessings = await characterFeaturesManager.getBlessings();
+      setBlessings(blessings);
+    }
+    return FeaturesManager.subscribeToUpdates({ onUpdate });
+  }, [setBlessings]);
+
+  const snippetData = useSelector(rulesEngineSelectors.getSnippetData);
+  // const ruleData = useSelector(rulesEngineSelectors.getRuleData);
+  // const abilityLookup = useSelector(rulesEngineSelectors.getAbilityLookup);
+  // const dataOriginRefData = useSelector(rulesEngineSelectors.getDataOriginRefData);
+  // const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const proficiencyBonus = useSelector(
+    rulesEngineSelectors.getProficiencyBonus
+  );
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+
+  return (
+    <div className="ct-blessings-detail">
+      {blessings.length ? (
+        <React.Fragment>
+          {blessings.map((blessing) => (
+            <div
+              onClick={(evt: React.MouseEvent) => {
+                evt.stopPropagation();
+                evt.nativeEvent.stopImmediatePropagation();
+
+                paneHistoryStart(
+                  PaneComponentEnum.BLESSING_DETAIL,
+                  PaneIdentifierUtils.generateBlessing(blessing.getId())
+                );
+              }}
+              className={"ct-feature-snippet"}
+              key={blessing.getId()}
+            >
+              <div
+                className={`ct-feature-snippet__heading ${
+                  theme?.isDarkMode
+                    ? "ct-feature-snippet__heading--dark-mode"
+                    : ""
+                }`}
+              >
+                {blessing.getName()}
+              </div>
+              <div className="ct-feature-snippet__content">
+                <Snippet
+                  snippetData={snippetData}
+                  proficiencyBonus={proficiencyBonus}
+                  theme={theme}
+                >
+                  {blessing.getDescription()}
+                </Snippet>
+              </div>
+            </div>
+          ))}
+        </React.Fragment>
+      ) : (
+        <div
+          className={`ct-blessings-detail__default ${
+            theme.isDarkMode ? "ct-blessings-detail__default--dark-mode" : ""
+          }`}
+        >
+          <p>There is nothing here.</p>
+        </div>
+      )}
+    </div>
+  );
+};
+export default BlessingsDetail;
diff --git a/ddb_main/tools/js/CharacterSheet/components/BlessingsDetail/index.ts b/ddb_main/tools/js/CharacterSheet/components/BlessingsDetail/index.ts
new file mode 100644
index 0000000..cffc8a8
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/BlessingsDetail/index.ts
@@ -0,0 +1,4 @@
+import BlessingsDetail from "./BlessingsDetail";
+
+export default BlessingsDetail;
+export { BlessingsDetail };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ClaimPremadeButton/ClaimPremadeButton.tsx b/ddb_main/tools/js/CharacterSheet/components/ClaimPremadeButton/ClaimPremadeButton.tsx
new file mode 100644
index 0000000..55d5fdd
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ClaimPremadeButton/ClaimPremadeButton.tsx
@@ -0,0 +1,203 @@
+import ChevronRightIcon from "@mui/icons-material/ChevronRight";
+import Box from "@mui/material/Box";
+import Button from "@mui/material/Button";
+import Card from "@mui/material/Card";
+import CardActionArea from "@mui/material/CardActionArea";
+import CardActions from "@mui/material/CardActions";
+import Typography from "@mui/material/Typography";
+import { useState } from "react";
+import { useSelector } from "react-redux";
+
+import { MaxCharactersDialog } from "~/components/MaxCharactersDialog";
+import { useAuth } from "~/contexts/Authentication";
+import { useClaimCharacter } from "~/hooks/useClaimCharacter";
+import backgroundImage from "~/images/claim.png";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+
+import {
+  DESKTOP_COMPONENT_START_WIDTH,
+  TABLET_COMPONENT_START_WIDTH,
+} from "../../config";
+import ClaimConfirmationDialog from "../WatchTourDialog/ClaimConfirmationDialog";
+
+const renderButtonContent = (signedIn: boolean) => (
+  <Box sx={{ display: "flex", justifyContent: "center", marginLeft: "10px" }}>
+    {!signedIn && (
+      <Typography
+        component="span"
+        sx={{
+          display: "flex",
+          alignItems: "center",
+          marginRight: "5px",
+          textTransform: "none",
+          fontWeight: 400,
+          fontSize: "14px",
+          lineHeight: "16px",
+        }}
+      >
+        Create Account to
+      </Typography>
+    )}
+    <Typography
+      component="span"
+      sx={{
+        display: "flex",
+        alignItems: "center",
+        textTransform: "none",
+        fontWeight: 700,
+        fontSize: "14px",
+        lineHeight: "16px",
+      }}
+    >
+      Claim Character
+    </Typography>
+    <ChevronRightIcon />
+  </Box>
+);
+
+// z-index of the sidebar controls
+const zIndex = 60002;
+
+const createAccountLink = `/create-account?returnUrl=${window.location.pathname}`;
+
+const ClaimPremadeButton: React.FC = () => {
+  const params = new URLSearchParams(globalThis.location.search);
+  const campaignJoinCode = params.get("campaignJoinCode");
+  const isAssigned = params.get("isAssigned") === "false" ? false : true;
+
+  const [isMaxCharacterMessageOpen, setIsMaxCharacterMessageOpen] =
+    useState(false);
+
+  const envDimensions = useSelector(appEnvSelectors.getDimensions);
+
+  const { characterSlotLimit, activeCharacterCount } = useSelector(
+    appEnvSelectors.getCharacterSlots
+  );
+  // Character slot limit is null for admin accounts
+  const hasOpenSlot =
+    characterSlotLimit === null || activeCharacterCount < characterSlotLimit;
+
+  const [
+    claimCharacter,
+    isClaimingCharacter,
+    isFinishedClaimingCharacter,
+    newCharacterId,
+    campaignId,
+  ] = useClaimCharacter({
+    campaignJoinCode,
+    isAssigned,
+  });
+
+  const user = useAuth();
+  const signedIn = !!user;
+
+  const handleClaimButtonClick = () => {
+    hasOpenSlot ? claimCharacter() : setIsMaxCharacterMessageOpen(true);
+  };
+
+  return (
+    <>
+      {envDimensions.window.width >= TABLET_COMPONENT_START_WIDTH ? (
+        <Card
+          className="claimPremade-button"
+          hidden={isFinishedClaimingCharacter && !!newCharacterId}
+          sx={{
+            zIndex,
+            position: "fixed",
+            right: 30,
+            bottom:
+              envDimensions.window.width >= DESKTOP_COMPONENT_START_WIDTH
+                ? 30
+                : 70,
+            width: 300,
+            background: "#551710",
+            borderRadius: "8px",
+            overflow: "visible",
+            boxShadow:
+              "0px 57px 23px rgba(0, 0, 0, 0.01), 0px 32px 19px rgba(0, 0, 0, 0.05), 0px 14px 14px rgba(0, 0, 0, 0.08), 0px 4px 8px rgba(0, 0, 0, 0.09), 0px 0px 0px rgba(0, 0, 0, 0.09)",
+            "&:hover": {
+              "& .claimPremade-buttonContent": {
+                background: "#F5F3EE",
+                boxShadow: "0px -4px 12px rgba(0, 0, 0, 0.25)",
+              },
+            },
+          }}
+        >
+          <CardActionArea
+            sx={{ textAlign: "center" }}
+            {...(!signedIn && { href: createAccountLink })}
+            onClick={signedIn ? handleClaimButtonClick : undefined}
+            disabled={isClaimingCharacter}
+          >
+            <Box
+              component="img"
+              src={backgroundImage}
+              sx={{ position: "relative", top: -20, width: 244, height: 144 }}
+            />
+            <CardActions
+              className="claimPremade-buttonContent"
+              sx={{
+                justifyContent: "center",
+                height: 48,
+                color: "#000000",
+                background: "#FFFFFF",
+
+                borderRadius: "0 0 8px 8px",
+              }}
+            >
+              {renderButtonContent(signedIn)}
+            </CardActions>
+          </CardActionArea>
+        </Card>
+      ) : (
+        <Button
+          variant="contained"
+          className="claimPremade-button"
+          {...(!signedIn && { href: createAccountLink })}
+          sx={{
+            display:
+              isFinishedClaimingCharacter && !!newCharacterId
+                ? "none"
+                : "inline-flex",
+            zIndex,
+            position: "fixed",
+            left: "50%",
+            bottom: 70,
+            width: 300,
+            height: "50px",
+            marginLeft: "-150px",
+            color: "#000000",
+            backgroundColor: "#FFFFFF",
+            boxShadow:
+              "0px 57px 23px rgba(0, 0, 0, 0.01), 0px 32px 19px rgba(0, 0, 0, 0.05), 0px 14px 14px rgba(0, 0, 0, 0.08), 0px 4px 8px rgba(0, 0, 0, 0.09), 0px 0px 0px rgba(0, 0, 0, 0.09)",
+            "&:hover": {
+              backgroundColor: "#F5F3EE",
+              boxShadow:
+                "0px 57px 23px rgba(0, 0, 0, 0.01), 0px 32px 19px rgba(0, 0, 0, 0.05), 0px 14px 14px rgba(0, 0, 0, 0.08), 0px 4px 8px rgba(0, 0, 0, 0.09), 0px 0px 0px rgba(0, 0, 0, 0.09)",
+            },
+            "&.Mui-disabled": {
+              backgroundColor: "#FFFFFF",
+            },
+          }}
+          onClick={signedIn ? handleClaimButtonClick : undefined}
+          disabled={isClaimingCharacter}
+        >
+          {renderButtonContent(signedIn)}
+        </Button>
+      )}
+      <MaxCharactersDialog
+        open={isMaxCharacterMessageOpen}
+        onClose={() => setIsMaxCharacterMessageOpen(false)}
+        useMyCharactersLink
+      />
+      {isFinishedClaimingCharacter && !!newCharacterId && (
+        <ClaimConfirmationDialog
+          characterId={newCharacterId}
+          campaignId={campaignId}
+        />
+      )}
+    </>
+  );
+};
+
+export default ClaimPremadeButton;
diff --git a/ddb_main/tools/js/CharacterSheet/components/ClaimPremadeButton/index.ts b/ddb_main/tools/js/CharacterSheet/components/ClaimPremadeButton/index.ts
new file mode 100644
index 0000000..1723704
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ClaimPremadeButton/index.ts
@@ -0,0 +1,4 @@
+import ClaimPremadeButton from "./ClaimPremadeButton";
+
+export default ClaimPremadeButton;
+export { ClaimPremadeButton as ClaimPremadeDialog };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ClassDetail/ClassDetail.tsx b/ddb_main/tools/js/CharacterSheet/components/ClassDetail/ClassDetail.tsx
new file mode 100644
index 0000000..ec88648
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ClassDetail/ClassDetail.tsx
@@ -0,0 +1,64 @@
+import React from "react";
+
+import {
+  AbilityLookup,
+  Action,
+  CharClass,
+  CharacterFeaturesManager,
+  CharacterTheme,
+  ClassFeature,
+  ClassFeatureUtils,
+  ClassUtils,
+  DataOriginRefData,
+  Feat,
+  FeatManager,
+  InfusionChoice,
+  RuleData,
+  SnippetData,
+  Spell,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ClassFeatureSnippet } from "../FeatureSnippet";
+
+interface Props {
+  charClass: CharClass;
+  onActionUseSet: (action: Action, uses: number) => void;
+  onActionClick: (action: Action) => void;
+  onSpellClick: (spell: Spell) => void;
+  onSpellUseSet: (spell: Spell, uses: number) => void;
+  onFeatureClick: (feature: ClassFeature, charClass: CharClass) => void;
+  onInfusionChoiceClick: (infusionChoice: InfusionChoice) => void;
+  feats: Array<Feat>;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  onFeatClick: (feat: FeatManager) => void;
+  featuresManager: CharacterFeaturesManager
+}
+export default class ClassDetail extends React.PureComponent<Props> {
+  render() {
+    const { charClass, ...restProps } = this.props;
+
+    return (
+      <div className="ct-class-detail">
+        <div className="ct-class-detail__name">
+          {ClassUtils.getName(charClass)} Features
+        </div>
+        <div className="ct-class-detail__features">
+          {ClassUtils.getUniqueClassFeatures(charClass).map((feature) => (
+            <ClassFeatureSnippet
+              {...restProps}
+              key={ClassFeatureUtils.getId(feature)}
+              feature={feature}
+              charClass={charClass}
+            />
+          ))}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ClassDetail/index.ts b/ddb_main/tools/js/CharacterSheet/components/ClassDetail/index.ts
new file mode 100644
index 0000000..cc432c2
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ClassDetail/index.ts
@@ -0,0 +1,4 @@
+import ClassDetail from "./ClassDetail";
+
+export default ClassDetail;
+export { ClassDetail };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ClassesDetail/ClassesDetail.tsx b/ddb_main/tools/js/CharacterSheet/components/ClassesDetail/ClassesDetail.tsx
new file mode 100644
index 0000000..7856edd
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ClassesDetail/ClassesDetail.tsx
@@ -0,0 +1,93 @@
+import { orderBy } from "lodash";
+import React from "react";
+
+import {
+  AbilityLookup,
+  Action,
+  CharacterFeaturesManager,
+  CharacterTheme,
+  CharClass,
+  ClassFeature,
+  ClassUtils,
+  DataOriginRefData,
+  Feat,
+  FeatManager,
+  InfusionChoice,
+  RuleData,
+  SnippetData,
+  Spell,
+} from "@dndbeyond/character-rules-engine/es";
+
+import ClassDetail from "../ClassDetail";
+
+interface Props {
+  classes: Array<CharClass>;
+  onActionUseSet: (action: Action, uses: number) => void;
+  onActionClick: (action: Action) => void;
+  onSpellClick: (spell: Spell) => void;
+  onSpellUseSet: (spell: Spell, uses: number) => void;
+  onFeatureClick: (feature: ClassFeature, charClass: CharClass) => void;
+  onInfusionChoiceClick: (infusionChoice: InfusionChoice) => void;
+  feats: Array<Feat>;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  onFeatClick: (feat: FeatManager) => void;
+  featuresManager: CharacterFeaturesManager
+}
+const ClassesDetail: React.FC<Props> = ({
+  classes,
+  isReadonly,
+  snippetData,
+  ruleData,
+  abilityLookup,
+  dataOriginRefData,
+  proficiencyBonus,
+  theme,
+  onFeatureClick,
+  feats,
+  onActionClick,
+  onSpellClick,
+  onSpellUseSet,
+  onActionUseSet,
+  onInfusionChoiceClick,
+  onFeatClick,
+  featuresManager
+}) => {
+  let orderedClasses = orderBy(classes, (charClass) =>
+    ClassUtils.getName(charClass)
+  );
+
+  return (
+    <div className="ct-classes-detail">
+      {orderedClasses.map((charClass) => (
+        <ClassDetail
+          key={ClassUtils.getId(charClass)}
+          charClass={charClass}
+          onFeatureClick={onFeatureClick}
+          onSpellUseSet={onSpellUseSet}
+          ruleData={ruleData}
+          abilityLookup={abilityLookup}
+          dataOriginRefData={dataOriginRefData}
+          proficiencyBonus={proficiencyBonus}
+          theme={theme}
+          onSpellClick={onSpellClick}
+          onActionClick={onActionClick}
+          feats={feats}
+          snippetData={snippetData}
+          onInfusionChoiceClick={onInfusionChoiceClick}
+          isReadonly={isReadonly}
+          onActionUseSet={onActionUseSet}
+          onFeatClick={onFeatClick}
+          featuresManager={featuresManager}
+        />
+      ))}
+    </div>
+  );
+};
+
+export default ClassesDetail;
diff --git a/ddb_main/tools/js/CharacterSheet/components/ClassesDetail/index.ts b/ddb_main/tools/js/CharacterSheet/components/ClassesDetail/index.ts
new file mode 100644
index 0000000..1c72841
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ClassesDetail/index.ts
@@ -0,0 +1,4 @@
+import ClassesDetail from "./ClassesDetail";
+
+export default ClassesDetail;
+export { ClassesDetail };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ComponentCarousel/ComponentCarousel.tsx b/ddb_main/tools/js/CharacterSheet/components/ComponentCarousel/ComponentCarousel.tsx
new file mode 100644
index 0000000..d8f0439
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ComponentCarousel/ComponentCarousel.tsx
@@ -0,0 +1,570 @@
+import {
+  spring,
+  TransitionMotion,
+  TransitionStyle,
+} from "@serprex/react-motion";
+import { uniqueId, throttle } from "lodash";
+import React from "react";
+import { DOWN, SwipeEventData, UP } from "react-swipeable";
+
+import { Swipeable } from "~/components/Swipeable";
+
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import { ComponentCarouselItem } from "./ComponentCarouselItem";
+
+interface CarouselWindowItem {
+  offset: number;
+  idx: number;
+  key: string;
+}
+
+interface Props {
+  activeItemKey: string;
+  onItemChange?: (newKey: string | null, oldKey: string | null) => void;
+  overscanAmount: number;
+  changingWaitTime: number;
+  changeStartDelta: number;
+  resizeThrottleTime: number;
+  resizeBlockWaitTime: number;
+  envDimensions: AppEnvDimensionsState;
+  children:
+    | Array<React.ReactElement<ComponentCarouselItem>>
+    | React.ReactElement<ComponentCarouselItem>;
+}
+
+interface WindowsItemState {
+  windowItems: Array<CarouselWindowItem>;
+  currentIdx: number;
+  swipedAmount: number;
+}
+interface State extends WindowsItemState {
+  activeIdx: number;
+  placeholderWidth: number;
+  filteredChildren: Array<ComponentCarouselItem>;
+  childByIdxLookup: Record<number, ComponentCarouselItem>;
+  childrenCount: number;
+  isChanging: boolean;
+  isResizeBlocked: boolean;
+}
+export default class ComponentCarousel extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    overscanAmount: 2,
+    changingWaitTime: 550,
+    changeStartDelta: 75,
+    resizeThrottleTime: 300,
+    resizeBlockWaitTime: 2000,
+  };
+
+  placeholderRef = React.createRef<HTMLDivElement>();
+  changingRafId: number | null = null;
+  changingStartTime: number | null = null;
+  resizeBlockRafId: number | null = null;
+  resizeBlockStartTime: number | null = null;
+  orientationHandler: () => void;
+  resizeHandler: () => void;
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      activeIdx: 0,
+      currentIdx: 0,
+      swipedAmount: 0,
+      placeholderWidth: 0,
+      childByIdxLookup: {},
+      childrenCount: 0,
+      windowItems: [],
+      filteredChildren: [],
+      isChanging: false,
+      isResizeBlocked: false,
+    };
+  }
+
+  static getDerivedStateFromProps(props: Props, state: State): State {
+    const { children, activeItemKey } = props;
+
+    let activeIdx: number = 0;
+
+    //TODO need to refactor to better handle this and not require any
+    let filteredChildren: Array<any> = [];
+    if (children) {
+      filteredChildren = React.Children.toArray(children).filter(
+        (child: any) => !!child && child.props.isEnabled
+      );
+    }
+    React.Children.forEach(filteredChildren, (child, idx) => {
+      if (!child) {
+        return;
+      }
+
+      const { itemKey, isEnabled } = child.props;
+
+      if (isEnabled && itemKey === activeItemKey) {
+        activeIdx = idx;
+      }
+    });
+
+    let childByIdxLookup: Record<number, ComponentCarouselItem> =
+      filteredChildren.reduce(
+        (acc, child, idx) => ({
+          ...acc,
+          [idx]: child,
+        }),
+        {}
+      );
+
+    let newState: State = {
+      ...state,
+      activeIdx,
+      currentIdx: activeIdx,
+      filteredChildren,
+      childrenCount: filteredChildren.length,
+      childByIdxLookup,
+    };
+
+    let windowItemsState: WindowsItemState = state.isChanging
+      ? state
+      : ComponentCarousel.deriveWindowItemsState(props, newState);
+
+    return {
+      ...newState,
+      ...windowItemsState,
+    };
+  }
+
+  componentDidMount() {
+    this.initResizeHandlers();
+    this.updatePlaceholderDimensions();
+  }
+
+  componentWillUnmount() {
+    this.destroyResizeHandlers();
+    this.stopChangeCheckLoop();
+    this.stopResizeBlockCheckLoop();
+  }
+
+  destroyResizeHandlers = (): void => {
+    window.removeEventListener("resize", this.resizeHandler);
+    window.removeEventListener("orientationchange", this.orientationHandler);
+  };
+
+  initResizeHandlers = (): void => {
+    const { resizeThrottleTime, envDimensions } = this.props;
+
+    this.resizeHandler = throttle(() => {
+      if (!this.state.isResizeBlocked) {
+        this.updatePlaceholderDimensions();
+      }
+    }, resizeThrottleTime);
+
+    this.orientationHandler = throttle(() => {
+      let oldSize: number = envDimensions ? envDimensions.window.width : 0;
+      let count: number = 0;
+      let orientationIntervalId: number | undefined;
+      orientationIntervalId = window.setInterval(() => {
+        let newEnvWidth = envDimensions ? envDimensions.window.width : oldSize;
+        if (oldSize !== newEnvWidth || count > 15) {
+          window.clearInterval(orientationIntervalId);
+          return;
+        }
+        if (oldSize !== window.innerWidth) {
+          this.updatePlaceholderDimensions();
+        }
+        count++;
+      }, 100);
+    }, resizeThrottleTime);
+
+    window.addEventListener("resize", this.resizeHandler);
+    window.addEventListener("orientationchange", this.orientationHandler);
+  };
+
+  updatePlaceholderDimensions = (): void => {
+    if (this.placeholderRef.current) {
+      let placeholderWidth = this.placeholderRef.current.offsetWidth;
+      this.setState(
+        {
+          placeholderWidth,
+        },
+        this.updateWindowItems
+      );
+    }
+  };
+
+  getItemKeyByIdx = (itemIdx: number): string | null => {
+    const { filteredChildren } = this.state;
+
+    let itemKey: string | null = null;
+
+    React.Children.forEach(filteredChildren, (child, idx) => {
+      if (itemIdx === idx) {
+        itemKey = child.props.itemKey;
+      }
+    });
+
+    return itemKey;
+  };
+
+  static getSwipedItemPosIdx = (
+    activeIdx: number,
+    placeholderWidth: number,
+    swipedAmount: number
+  ): number => {
+    if (placeholderWidth === 0) {
+      return 0;
+    }
+    let swipedSlideCount = Math.round(swipedAmount / placeholderWidth);
+    return activeIdx - swipedSlideCount; // subtract because of swipe direction makes it negative going right
+  };
+
+  // Need to be able to get what array index to use based on a position index that is both positive, zero, and negative
+  //   example: [a, b, c, d, e, f, g, h] (length = 8)
+  //     position index: -11 -10 -9 -8 -7 -6 -5 -4 -3 -2 -1 0 1 2 3 4 5 6 7 8 9 10
+  //     array index:      5   6  7  0  1  2  3  4  5  6  7 0 1 2 3 4 5 6 7 0 1  2
+  //
+  //     position index "-9" gives letter "h"
+  static getArrayIdxByPositionIdx = (
+    posIndex: number,
+    total: number
+  ): number => {
+    if (posIndex >= 0) {
+      return posIndex % total;
+    } else {
+      const indexMod = Math.abs(posIndex) % total;
+      return (indexMod === 0 ? 0 : 1) * (total - indexMod);
+    }
+  };
+
+  runChangeCheck = (callback: () => void): void => {
+    const { changingWaitTime } = this.props;
+
+    if (
+      this.changingStartTime !== null &&
+      Number(new Date()) - this.changingStartTime > changingWaitTime
+    ) {
+      callback();
+    } else {
+      this.changingRafId = window.requestAnimationFrame(
+        this.runChangeCheck.bind(this, callback)
+      );
+    }
+  };
+
+  startChangeCheckLoop = (callback: () => void): void => {
+    this.changingStartTime = Number(new Date());
+    this.stopChangeCheckLoop();
+    this.changingRafId = window.requestAnimationFrame(
+      this.runChangeCheck.bind(this, callback)
+    );
+  };
+
+  stopChangeCheckLoop = (): void => {
+    if (this.changingRafId !== null) {
+      window.cancelAnimationFrame(this.changingRafId);
+    }
+  };
+
+  startResizeBlockCheckLoop = (callback: () => void): void => {
+    this.resizeBlockStartTime = Number(new Date());
+    this.stopResizeBlockCheckLoop();
+    this.resizeBlockRafId = window.requestAnimationFrame(
+      this.runResizeBlockCheck.bind(this, callback)
+    );
+  };
+
+  stopResizeBlockCheckLoop = (): void => {
+    if (this.resizeBlockRafId !== null) {
+      window.cancelAnimationFrame(this.resizeBlockRafId);
+    }
+  };
+
+  runResizeBlockCheck = (callback: () => void): void => {
+    const { resizeBlockWaitTime } = this.props;
+
+    if (
+      this.resizeBlockStartTime !== null &&
+      Number(new Date()) - this.resizeBlockStartTime > resizeBlockWaitTime
+    ) {
+      callback();
+    } else {
+      this.resizeBlockRafId = window.requestAnimationFrame(
+        this.runResizeBlockCheck.bind(this, callback)
+      );
+    }
+  };
+
+  static deriveWindowItemsState = (
+    props: Props,
+    state: State
+  ): WindowsItemState => {
+    const { overscanAmount } = props;
+    const {
+      windowItems,
+      placeholderWidth,
+      swipedAmount,
+      childrenCount,
+      currentIdx,
+    } = state;
+
+    let currentPosIdx: number = ComponentCarousel.getSwipedItemPosIdx(
+      currentIdx,
+      placeholderWidth,
+      swipedAmount
+    );
+    let startIdx: number = currentPosIdx - overscanAmount;
+    let endIdx: number = currentPosIdx + overscanAmount;
+
+    let newWindowItems: Array<CarouselWindowItem> = [];
+    if (childrenCount > 0) {
+      let offset: number = -1 * overscanAmount;
+      for (let i = startIdx; i <= endIdx; i++) {
+        let itemIdx = ComponentCarousel.getArrayIdxByPositionIdx(
+          i,
+          childrenCount
+        );
+        let existingItem = windowItems.find(
+          (windowItem) => windowItem.idx === itemIdx
+        );
+
+        newWindowItems.push({
+          offset,
+          idx: itemIdx,
+          key: existingItem ? existingItem.key : uniqueId(),
+        });
+
+        offset++;
+      }
+    }
+
+    return {
+      windowItems: newWindowItems,
+      currentIdx: currentPosIdx,
+      swipedAmount: 0,
+    };
+  };
+
+  updateWindowItems = (startDelayedChange: boolean = false): void => {
+    const { childrenCount, activeIdx } = this.state;
+
+    let windowItemsState = ComponentCarousel.deriveWindowItemsState(
+      this.props,
+      this.state
+    );
+
+    this.setState(windowItemsState);
+
+    if (startDelayedChange) {
+      this.startChangeCheckLoop(() => {
+        let newActiveIdx = ComponentCarousel.getArrayIdxByPositionIdx(
+          windowItemsState.currentIdx,
+          childrenCount
+        );
+        this.handleItemChange(newActiveIdx, activeIdx);
+      });
+    }
+  };
+
+  handleSwiping = ({ deltaX, dir }: SwipeEventData): void => {
+    const isVerticalChange = [UP, DOWN].includes(dir);
+
+    if (!isVerticalChange) {
+      this.stopChangeCheckLoop();
+      this.setState((prevState) => {
+        return {
+          swipedAmount: deltaX,
+          isChanging: true,
+          isResizeBlocked: true,
+        };
+      });
+    }
+  };
+
+  handleSwipedHorizontal = ({
+    event,
+    deltaX,
+    velocity,
+  }: SwipeEventData): void => {
+    const isFlick = velocity > 0.1;
+    const { placeholderWidth } = this.state;
+    const { changeStartDelta } = this.props;
+
+    let newSwipedAmount: number = 0;
+    if (isFlick) {
+      if (deltaX > 0) {
+        newSwipedAmount = placeholderWidth;
+      } else if (deltaX < 0) {
+        newSwipedAmount = -1 * placeholderWidth;
+      }
+    }
+
+    this.setState(
+      (prevState) => {
+        let isChanging: boolean =
+          isFlick || Math.abs(deltaX) <= changeStartDelta;
+        return {
+          swipedAmount: isFlick ? newSwipedAmount : prevState.swipedAmount,
+          isChanging,
+          isResizeBlocked: isChanging,
+        };
+      },
+      () => {
+        this.updateWindowItems(true);
+      }
+    );
+  };
+
+  handleItemChange = (newItemIdx: number, oldItemIdx: number): void => {
+    const { onItemChange } = this.props;
+
+    if (onItemChange) {
+      onItemChange(
+        this.getItemKeyByIdx(newItemIdx),
+        this.getItemKeyByIdx(oldItemIdx)
+      );
+      this.stopChangeCheckLoop();
+      this.setState({
+        activeIdx: newItemIdx,
+        isChanging: false,
+      });
+
+      this.startResizeBlockCheckLoop(() => {
+        this.setState({
+          isResizeBlocked: false,
+        });
+      });
+    }
+  };
+
+  handlePlaceholderClick = (newIdx: number, evt: React.MouseEvent): void => {
+    const { activeIdx } = this.state;
+    const { onItemChange } = this.props;
+
+    if (onItemChange) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      this.handleItemChange(newIdx, activeIdx);
+    }
+  };
+
+  static getItemPositionX = (
+    swipedAmount: number,
+    offset: number,
+    placeholderWidth: number
+  ): number => {
+    let itemPositionX = swipedAmount + offset * placeholderWidth;
+
+    if (itemPositionX >= 0) {
+      return Math.min(placeholderWidth * 2, itemPositionX);
+    } else {
+      return Math.max(-1 * placeholderWidth * 2, itemPositionX);
+    }
+  };
+
+  renderPlaceholders = (): React.ReactNode => {
+    const {
+      childByIdxLookup,
+      windowItems,
+      swipedAmount,
+      placeholderWidth,
+      isChanging,
+    } = this.state;
+
+    let placeholderStyles: Array<TransitionStyle> = windowItems.map(
+      (windowItem) => {
+        const child = childByIdxLookup[windowItem.idx];
+
+        return {
+          key: windowItem.key,
+          style: {
+            transform: spring(
+              ComponentCarousel.getItemPositionX(
+                swipedAmount,
+                windowItem.offset,
+                placeholderWidth
+              ),
+              { stiffness: 400, damping: 30 }
+            ),
+          },
+          data: {
+            offset: windowItem.offset,
+            itemIdx: windowItem.idx,
+            child,
+          },
+        };
+      }
+    );
+
+    let classNames: Array<string> = ["ct-component-carousel__placeholders"];
+    if (isChanging) {
+      classNames.push("ct-component-carousel__placeholders--changing");
+    }
+
+    return (
+      <div className={classNames.join(" ")} ref={this.placeholderRef}>
+        <TransitionMotion styles={placeholderStyles}>
+          {(interpolatedStyles) => (
+            <React.Fragment>
+              {interpolatedStyles.map((config) => {
+                const { PlaceholderComponent, placeholderProps, itemKey } =
+                  config.data.child.props;
+
+                return (
+                  <div
+                    className="ct-component-carousel__placeholder"
+                    key={config.key}
+                    onClick={this.handlePlaceholderClick.bind(
+                      this,
+                      config.data.itemIdx
+                    )}
+                    style={{
+                      transform: `translateX(${config.style.transform}px)`,
+                    }}
+                  >
+                    <PlaceholderComponent {...placeholderProps} />
+                  </div>
+                );
+              })}
+            </React.Fragment>
+          )}
+        </TransitionMotion>
+      </div>
+    );
+    //`
+  };
+
+  renderActiveComponent = (): React.ReactNode => {
+    const { activeIdx, childByIdxLookup, filteredChildren } = this.state;
+
+    if (activeIdx === null || !filteredChildren.length) {
+      return null;
+    }
+
+    let child = childByIdxLookup[activeIdx];
+    const { ContentComponent } = child.props;
+
+    return (
+      <div className="ct-component-carousel__active">
+        <ContentComponent key={child.props.itemKey} />
+      </div>
+    );
+  };
+
+  render() {
+    return (
+      <Swipeable
+        handlerFunctions={{
+          onSwiping: this.handleSwiping,
+          onSwipedLeft: this.handleSwipedHorizontal,
+          onSwipedRight: this.handleSwipedHorizontal,
+        }}
+      >
+        <div className="ct-component-carousel">
+          {this.renderPlaceholders()}
+          {this.renderActiveComponent()}
+        </div>
+      </Swipeable>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ComponentCarousel/ComponentCarouselItem/ComponentCarouselItem.tsx b/ddb_main/tools/js/CharacterSheet/components/ComponentCarousel/ComponentCarouselItem/ComponentCarouselItem.tsx
new file mode 100644
index 0000000..7d860ae
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ComponentCarousel/ComponentCarouselItem/ComponentCarouselItem.tsx
@@ -0,0 +1,18 @@
+import React from "react";
+
+interface Props {
+  itemKey: string;
+  PlaceholderComponent: React.ElementType;
+  placeholderProps?: any;
+  ContentComponent: React.ElementType;
+  isEnabled: boolean;
+}
+export default class ComponentCarouselItem extends React.PureComponent<Props> {
+  static defaultProps = {
+    isEnabled: true,
+  };
+
+  render() {
+    return null;
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ComponentCarousel/ComponentCarouselItem/index.ts b/ddb_main/tools/js/CharacterSheet/components/ComponentCarousel/ComponentCarouselItem/index.ts
new file mode 100644
index 0000000..0848d26
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ComponentCarousel/ComponentCarouselItem/index.ts
@@ -0,0 +1,4 @@
+import ComponentCarouselItem from "./ComponentCarouselItem";
+
+export default ComponentCarouselItem;
+export { ComponentCarouselItem };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ConditionsSummary/ConditionsSummary.tsx b/ddb_main/tools/js/CharacterSheet/components/ConditionsSummary/ConditionsSummary.tsx
new file mode 100644
index 0000000..9d196f0
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ConditionsSummary/ConditionsSummary.tsx
@@ -0,0 +1,71 @@
+import React from "react";
+
+import { ConditionName } from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  Condition,
+  ConditionUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  conditions: Array<Condition>;
+  onClick: () => void;
+  theme: CharacterTheme;
+}
+export default class ConditionsSummary extends React.PureComponent<Props> {
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  renderConditions = (): React.ReactNode => {
+    const { conditions, theme } = this.props;
+
+    return (
+      <React.Fragment>
+        {conditions.map((condition) => (
+          <ConditionName
+            theme={theme}
+            key={ConditionUtils.getUniqueKey(condition)}
+            condition={condition}
+          />
+        ))}
+      </React.Fragment>
+    );
+  };
+
+  renderDefault = (): React.ReactNode => {
+    const { theme } = this.props;
+    return (
+      <div
+        className={`ct-conditions-summary__default ${
+          theme.isDarkMode ? "ct-conditions-summary__default--dark-mode" : ""
+        }`}
+      >
+        Add Active Conditions
+      </div>
+    );
+  };
+
+  render() {
+    const { conditions } = this.props;
+
+    let contentNode: React.ReactNode;
+    if (conditions.length) {
+      contentNode = this.renderConditions();
+    } else {
+      contentNode = this.renderDefault();
+    }
+
+    return (
+      <div className="ct-conditions-summary" onClick={this.handleClick}>
+        {contentNode}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ConditionsSummary/index.ts b/ddb_main/tools/js/CharacterSheet/components/ConditionsSummary/index.ts
new file mode 100644
index 0000000..0cd4b29
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ConditionsSummary/index.ts
@@ -0,0 +1,4 @@
+import ConditionsSummary from "./ConditionsSummary";
+
+export default ConditionsSummary;
+export { ConditionsSummary };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ContentGroup/ContentGroup.tsx b/ddb_main/tools/js/CharacterSheet/components/ContentGroup/ContentGroup.tsx
new file mode 100644
index 0000000..b005a62
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ContentGroup/ContentGroup.tsx
@@ -0,0 +1,23 @@
+import React from "react";
+
+interface Props {
+  header: React.ReactNode;
+  extra?: React.ReactNode;
+}
+const ContentGroup: React.FC<Props> = ({ header, extra, children }) => {
+  return (
+    <div className="ct-content-group">
+      {header && (
+        <div className="ct-content-group__header">
+          <div className="ct-content-group__header-content">{header}</div>
+          {extra && (
+            <div className="ct-content-group__header-extra">{extra}</div>
+          )}
+        </div>
+      )}
+      <div className="ct-content-group__content">{children}</div>
+    </div>
+  );
+};
+
+export default ContentGroup;
diff --git a/ddb_main/tools/js/CharacterSheet/components/ContentGroup/index.ts b/ddb_main/tools/js/CharacterSheet/components/ContentGroup/index.ts
new file mode 100644
index 0000000..c21456b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ContentGroup/index.ts
@@ -0,0 +1,4 @@
+import ContentGroup from "./ContentGroup";
+
+export default ContentGroup;
+export { ContentGroup };
diff --git a/ddb_main/tools/js/CharacterSheet/components/CurrencyButton/CurrencyButton.tsx b/ddb_main/tools/js/CharacterSheet/components/CurrencyButton/CurrencyButton.tsx
new file mode 100644
index 0000000..2e5ce84
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/CurrencyButton/CurrencyButton.tsx
@@ -0,0 +1,163 @@
+import React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CoinIcon } from "@dndbeyond/character-components/es";
+import {
+  CharacterCurrencyContract,
+  Constants,
+  FormatUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+const generateCoinString = (coin: CharacterCurrencyContract | null): string => {
+  if (!coin) {
+    return "";
+  }
+  const pp = coin.pp ? `${coin.pp} ${Constants.CoinNamesEnum.PLATINUM}` : "";
+  const gp = coin.gp ? `${coin.gp} ${Constants.CoinNamesEnum.GOLD}` : "";
+  const ep = coin.ep ? `${coin.ep} ${Constants.CoinNamesEnum.ELECTRUM}` : "";
+  const sp = coin.sp ? `${coin.sp} ${Constants.CoinNamesEnum.SILVER}` : "";
+  const cp = coin.cp ? `${coin.cp} ${Constants.CoinNamesEnum.COPPER}` : "";
+
+  return `${pp} ${gp} ${ep} ${sp} ${cp}`;
+};
+
+interface CurrencyRowProps {
+  amount: number;
+  coinType: Constants.CoinTypeEnum;
+  label: string;
+  isDarkMode: boolean;
+}
+
+const CurrencyRow: React.FC<CurrencyRowProps> = ({
+  amount,
+  coinType,
+  label,
+  isDarkMode,
+}) => {
+  return (
+    <div
+      className="ct-currency-button__currency-item-count"
+      role="listitem"
+      aria-label={`${amount} ${label}`}
+    >
+      <Tooltip
+        isDarkMode={isDarkMode}
+        className={`ct-currency-button__currency-item`}
+        title={label}
+        isInteractive={true}
+      >
+        <span className="ct-currency-button__currency-item-count">
+          {FormatUtils.renderLocaleNumber(amount)}
+        </span>
+        <span
+          aria-label={label}
+          className="ct-currency-button__currency-item-preview"
+        >
+          <CoinIcon coinType={coinType} />
+        </span>
+      </Tooltip>
+    </div>
+  );
+};
+
+interface CoinProps {
+  coin: CharacterCurrencyContract;
+  isDarkMode: boolean;
+}
+
+const Coins: React.FC<CoinProps> = ({ coin, isDarkMode }) => {
+  let renderEmptyGold: boolean = false;
+  if (!coin.pp && !coin.gp && !coin.ep && !coin.sp && !coin.cp) {
+    renderEmptyGold = true;
+  }
+  return (
+    <div className="ct-currency-button__currency-items">
+      {!!coin.pp && (
+        <CurrencyRow
+          amount={coin.pp}
+          coinType={Constants.CoinTypeEnum.pp}
+          label={Constants.CoinNamesEnum.PLATINUM}
+          isDarkMode={isDarkMode}
+        />
+      )}
+
+      {(!!coin.gp || renderEmptyGold) && (
+        <CurrencyRow
+          amount={coin.gp}
+          coinType={Constants.CoinTypeEnum.gp}
+          label={Constants.CoinNamesEnum.GOLD}
+          isDarkMode={isDarkMode}
+        />
+      )}
+      {!!coin.ep && (
+        <CurrencyRow
+          amount={coin.ep}
+          coinType={Constants.CoinTypeEnum.ep}
+          label={Constants.CoinNamesEnum.ELECTRUM}
+          isDarkMode={isDarkMode}
+        />
+      )}
+      {!!coin.sp && (
+        <CurrencyRow
+          amount={coin.sp}
+          coinType={Constants.CoinTypeEnum.sp}
+          label={Constants.CoinNamesEnum.SILVER}
+          isDarkMode={isDarkMode}
+        />
+      )}
+      {!!coin.cp && (
+        <CurrencyRow
+          amount={coin.cp}
+          coinType={Constants.CoinTypeEnum.cp}
+          label={Constants.CoinNamesEnum.COPPER}
+          isDarkMode={isDarkMode}
+        />
+      )}
+    </div>
+  );
+};
+
+interface Props {
+  coin: CharacterCurrencyContract | null;
+  isDarkMode: boolean;
+  shouldShowPartyInventory: boolean;
+  handleCurrencyClick: (evt: React.KeyboardEvent | React.MouseEvent) => void;
+}
+
+export const CurrencyButton: React.FC<Props> = ({
+  coin,
+  isDarkMode,
+  shouldShowPartyInventory,
+  handleCurrencyClick,
+}) => {
+  return (
+    <div
+      role="button"
+      aria-label={`Manage ${
+        shouldShowPartyInventory ? "Party " : ""
+      }Coin ${generateCoinString(coin)}`}
+      className="ct-currency-button__currency"
+      onClick={handleCurrencyClick}
+      onKeyDown={(evt) => {
+        if (evt.key === "Enter") {
+          handleCurrencyClick(evt);
+        }
+      }}
+    >
+      {coin ? (
+        <Coins coin={coin} isDarkMode={isDarkMode} />
+      ) : (
+        <div className="ct-currency-button__currency-items">
+          <CurrencyRow
+            amount={0}
+            coinType={Constants.CoinTypeEnum.gp}
+            label={Constants.CoinNamesEnum.GOLD}
+            isDarkMode={isDarkMode}
+          />
+        </div>
+      )}
+    </div>
+  );
+};
+
+export default CurrencyButton;
diff --git a/ddb_main/tools/js/CharacterSheet/components/CurrencyButton/index.ts b/ddb_main/tools/js/CharacterSheet/components/CurrencyButton/index.ts
new file mode 100644
index 0000000..d953a5d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/CurrencyButton/index.ts
@@ -0,0 +1,4 @@
+import CurrencyButton from "./CurrencyButton";
+
+export default CurrencyButton;
+export { CurrencyButton };
diff --git a/ddb_main/tools/js/CharacterSheet/components/CurrencyCollapsible/CurrencyCollapsible.tsx b/ddb_main/tools/js/CharacterSheet/components/CurrencyCollapsible/CurrencyCollapsible.tsx
new file mode 100644
index 0000000..2b84ca2
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/CurrencyCollapsible/CurrencyCollapsible.tsx
@@ -0,0 +1,190 @@
+import React from "react";
+import { useContext } from "react";
+
+import {
+  CoinIcon,
+  Collapsible,
+  CollapsibleHeaderContent,
+} from "@dndbeyond/character-components/es";
+import {
+  FormatUtils,
+  ContainerUtils,
+  Container,
+  Constants,
+  CharacterCurrencyContract,
+} from "@dndbeyond/character-rules-engine/es";
+
+import CurrencyPaneAdjuster from "../../../Shared/containers/panes/CurrencyPane/CurrencyPaneAdjuster";
+import { CurrencyErrorTypeEnum } from "../../../Shared/containers/panes/CurrencyPane/CurrencyPaneConstants";
+import CurrencyPaneCurrencyRow from "../../../Shared/containers/panes/CurrencyPane/CurrencyPaneCurrencyRow";
+import { CoinManagerContext } from "../../../Shared/managers/CoinManagerContext";
+
+interface Props {
+  initiallyCollapsed: boolean;
+  isReadonly: boolean;
+  container: Container;
+  heading: string;
+  handleCurrencyChangeError: (
+    currencyName: string,
+    errorType: CurrencyErrorTypeEnum
+  ) => void;
+  handleCurrencyAdjust: (
+    coin: Partial<CharacterCurrencyContract>,
+    multiplier: 1 | -1,
+    containerDefinitionKey: string
+  ) => void;
+  handleAmountSet: (
+    containerDefinitionKey: string,
+    key: keyof CharacterCurrencyContract,
+    amount: number
+  ) => void;
+}
+
+const CoinContent = ({
+  containerDefinitionKey,
+  isReadonly,
+  handleCurrencyChangeError,
+  handleCurrencyAdjust,
+  handleAmountSet,
+}) => {
+  const { coinManager } = useContext(CoinManagerContext);
+  if (!coinManager) {
+    return null;
+  }
+  const coin = coinManager.getContainerCoin(containerDefinitionKey);
+  if (!coin) {
+    return null;
+  }
+  const { pp, gp, ep, sp, cp } = coin;
+
+  const shouldReadonly =
+    isReadonly ||
+    (containerDefinitionKey ===
+      coinManager.getPartyEquipmentContainerDefinitionKey() &&
+      coinManager.isSharingTurnedDeleteOnly());
+
+  return (
+    <React.Fragment>
+      <div className="ct-currency-pane__currencies">
+        <CurrencyPaneCurrencyRow
+          name="Platinum (pp)"
+          onChange={(value) =>
+            handleAmountSet(containerDefinitionKey, "pp", value)
+          }
+          onError={(errorType) =>
+            handleCurrencyChangeError("Platinum", errorType)
+          }
+          value={pp}
+          coinType={Constants.CoinTypeEnum.pp}
+          conversion="1 pp = 10 gp"
+          isReadonly={shouldReadonly}
+        />
+        <CurrencyPaneCurrencyRow
+          name="Gold (gp)"
+          onChange={(value) =>
+            handleAmountSet(containerDefinitionKey, "gp", value)
+          }
+          onError={(errorType) => handleCurrencyChangeError("Gold", errorType)}
+          value={gp}
+          coinType={Constants.CoinTypeEnum.gp}
+          isReadonly={shouldReadonly}
+        />
+        <CurrencyPaneCurrencyRow
+          name="Electrum (ep)"
+          onChange={(value) =>
+            handleAmountSet(containerDefinitionKey, "ep", value)
+          }
+          onError={(errorType) =>
+            handleCurrencyChangeError("Electrum", errorType)
+          }
+          value={ep}
+          conversion="1 gp = 2 ep"
+          coinType={Constants.CoinTypeEnum.ep}
+          isReadonly={shouldReadonly}
+        />
+        <CurrencyPaneCurrencyRow
+          name="Silver (sp)"
+          onChange={(value) =>
+            handleAmountSet(containerDefinitionKey, "sp", value)
+          }
+          onError={(errorType) =>
+            handleCurrencyChangeError("Silver", errorType)
+          }
+          value={sp}
+          conversion="1 gp = 10 sp"
+          coinType={Constants.CoinTypeEnum.sp}
+          isReadonly={shouldReadonly}
+        />
+        <CurrencyPaneCurrencyRow
+          name="Copper (cp)"
+          onChange={(value) =>
+            handleAmountSet(containerDefinitionKey, "cp", value)
+          }
+          onError={(errorType) =>
+            handleCurrencyChangeError("Copper", errorType)
+          }
+          value={cp}
+          conversion="1 gp = 100 cp"
+          isReadonly={shouldReadonly}
+          coinType={Constants.CoinTypeEnum.cp}
+        />
+      </div>
+      {(coinManager.isSharingTurnedOn() ||
+        !coinManager.isSharedContainerDefinitionKey(
+          containerDefinitionKey
+        )) && (
+        <CurrencyPaneAdjuster
+          onAdjust={handleCurrencyAdjust}
+          isReadonly={isReadonly}
+          containerDefinitionKey={containerDefinitionKey}
+        />
+      )}
+    </React.Fragment>
+  );
+};
+
+export const CurrencyCollapsible: React.FC<Props> = ({
+  initiallyCollapsed,
+  container,
+  handleCurrencyChangeError,
+  isReadonly,
+  handleCurrencyAdjust,
+  handleAmountSet,
+  heading,
+}: Props) => {
+  const { coinManager } = useContext(CoinManagerContext);
+  const containerDefinitionKey = ContainerUtils.getDefinitionKey(container);
+  return (
+    <Collapsible
+      initiallyCollapsed={initiallyCollapsed}
+      overrideCollapsed={initiallyCollapsed}
+      header={
+        <CollapsibleHeaderContent
+          heading={heading}
+          callout={
+            <span className="ct-currency-pane__collapsible-callout">
+              {FormatUtils.renderLocaleNumber(
+                coinManager?.getTotalContainerCoinInGold(
+                  ContainerUtils.getDefinitionKey(container)
+                ) ?? 0
+              )}{" "}
+              <span className="ct-currency-pane__collapsible-callout-icon">
+                <CoinIcon coinType={Constants.CoinTypeEnum.gp} />
+              </span>
+            </span>
+          }
+        />
+      }
+    >
+      <CoinContent
+        containerDefinitionKey={containerDefinitionKey}
+        isReadonly={isReadonly}
+        handleCurrencyChangeError={handleCurrencyChangeError}
+        handleCurrencyAdjust={handleCurrencyAdjust}
+        handleAmountSet={handleAmountSet}
+      />
+    </Collapsible>
+  );
+};
+
+export default CurrencyCollapsible;
diff --git a/ddb_main/tools/js/CharacterSheet/components/CurrencyCollapsible/index.ts b/ddb_main/tools/js/CharacterSheet/components/CurrencyCollapsible/index.ts
new file mode 100644
index 0000000..e2ae218
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/CurrencyCollapsible/index.ts
@@ -0,0 +1,4 @@
+import CurrencyCollapsible from "./CurrencyCollapsible";
+
+export default CurrencyCollapsible;
+export { CurrencyCollapsible };
diff --git a/ddb_main/tools/js/CharacterSheet/components/DefensesSummary/DefensesSummary.tsx b/ddb_main/tools/js/CharacterSheet/components/DefensesSummary/DefensesSummary.tsx
new file mode 100644
index 0000000..d58cf54
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/DefensesSummary/DefensesSummary.tsx
@@ -0,0 +1,178 @@
+import { orderBy } from "lodash";
+import React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  ResistanceIcon,
+  ImmunityIcon,
+  VulnerabilityIcon,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  DefenseAdjustmentGroup,
+  FormatUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+const DEFENSE_GROUP = {
+  RESISTANCE: "Resistance",
+  IMMUNITY: "Immunity",
+  VULNERABILITY: "Vulnerability",
+};
+
+interface Props {
+  resistances: Array<DefenseAdjustmentGroup>;
+  immunities: Array<DefenseAdjustmentGroup>;
+  vulnerabilities: Array<DefenseAdjustmentGroup>;
+  onClick?: () => void;
+  theme?: CharacterTheme;
+}
+export default class DefensesSummary extends React.PureComponent<Props> {
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  renderDamageAdjustmentList = (
+    defenses: Array<DefenseAdjustmentGroup>
+  ): React.ReactNode => {
+    const { theme } = this.props;
+    let orderedDefenses = orderBy(defenses, (group) => group.name);
+    return (
+      <React.Fragment>
+        {orderedDefenses.map((defense: DefenseAdjustmentGroup, idx) => (
+          <span
+            className={`ct-defenses-summary__defense ${
+              theme?.isDarkMode ? "ct-defenses-summary__defense--dark-mode" : ""
+            }`}
+            key={`${defense.name}-${idx}`}
+          >
+            <Tooltip
+              isDarkMode={theme?.isDarkMode}
+              title={defense.sources.join(", ")}
+              tippyOpts={{ dynamicTitle: true }}
+            >
+              {defense.name}
+              {defense.hasCustom ? "*" : ""}
+            </Tooltip>
+          </span>
+        ))}
+      </React.Fragment>
+    );
+    //`
+  };
+
+  renderDamageAdjustmentGroup = (
+    groupType: string,
+    label: string,
+    damageAdjustments: Array<DefenseAdjustmentGroup>,
+    isSingleLine: boolean,
+    theme: CharacterTheme | undefined
+  ): React.ReactNode => {
+    if (!damageAdjustments.length) {
+      return null;
+    }
+
+    let classNames: Array<string> = ["ct-defenses-summary__group"];
+    if (isSingleLine) {
+      classNames.push("ct-defenses-summary__group--single");
+    }
+    let iconComponent: React.ReactNode;
+
+    switch (FormatUtils.slugify(groupType)) {
+      case "resistance":
+        iconComponent = <ResistanceIcon theme={theme} />;
+        break;
+      case "immunity":
+        iconComponent = <ImmunityIcon theme={theme} />;
+        break;
+      case "vulnerability":
+        iconComponent = <VulnerabilityIcon theme={theme} />;
+        break;
+      default:
+        iconComponent = null;
+        break;
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <span className="ct-defenses-summary__group-preview">
+          {iconComponent}
+        </span>
+        <span className="ct-defenses-summary__group-items">
+          {this.renderDamageAdjustmentList(damageAdjustments)}
+        </span>
+      </div>
+    );
+    //`
+  };
+
+  renderDefault = (): React.ReactNode => {
+    const { theme } = this.props;
+
+    return (
+      <div
+        className={`ct-defenses-summary__default ${
+          theme?.isDarkMode ? "ct-defenses-summary__default--dark-mode" : ""
+        }`}
+      >
+        Resistances, Immunities, or Vulnerabilities
+      </div>
+    );
+  };
+
+  renderDefenseGroups = (): React.ReactNode => {
+    const { resistances, vulnerabilities, immunities, theme } = this.props;
+
+    let isSingleLine: boolean =
+      resistances.length > 0 &&
+      vulnerabilities.length > 0 &&
+      immunities.length > 0;
+    return (
+      <React.Fragment>
+        {this.renderDamageAdjustmentGroup(
+          DEFENSE_GROUP.RESISTANCE,
+          "Resistances",
+          resistances,
+          isSingleLine,
+          theme
+        )}
+        {this.renderDamageAdjustmentGroup(
+          DEFENSE_GROUP.IMMUNITY,
+          "Immunity",
+          immunities,
+          isSingleLine,
+          theme
+        )}
+        {this.renderDamageAdjustmentGroup(
+          DEFENSE_GROUP.VULNERABILITY,
+          "Vulnerabilities",
+          vulnerabilities,
+          isSingleLine,
+          theme
+        )}
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    const { resistances, vulnerabilities, immunities } = this.props;
+
+    let contentNode: React.ReactNode;
+    if (!resistances.length && !vulnerabilities.length && !immunities.length) {
+      contentNode = this.renderDefault();
+    } else {
+      contentNode = this.renderDefenseGroups();
+    }
+
+    return (
+      <div className="ct-defenses-summary" onClick={this.handleClick}>
+        {contentNode}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/DefensesSummary/index.ts b/ddb_main/tools/js/CharacterSheet/components/DefensesSummary/index.ts
new file mode 100644
index 0000000..43ba503
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/DefensesSummary/index.ts
@@ -0,0 +1,4 @@
+import DefensesSummary from "./DefensesSummary";
+
+export default DefensesSummary;
+export { DefensesSummary };
diff --git a/ddb_main/tools/js/CharacterSheet/components/EquipmentOverview/EquipmentOverview.tsx b/ddb_main/tools/js/CharacterSheet/components/EquipmentOverview/EquipmentOverview.tsx
new file mode 100644
index 0000000..077151f
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/EquipmentOverview/EquipmentOverview.tsx
@@ -0,0 +1,195 @@
+import React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  CharacterCurrencyContract,
+  Constants,
+  FormatUtils,
+  RuleDataUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+import CurrencyButton from "../CurrencyButton";
+
+interface Props {
+  currencies: CharacterCurrencyContract | null;
+  weight: number;
+  weightSpeedType: Constants.WeightSpeedTypeEnum;
+  onCurrencyClick?: (evt: React.MouseEvent | React.KeyboardEvent) => void;
+  onWeightClick?: () => void;
+  onCampaignClick?: () => void;
+  onManageClick?: () => void;
+  enableManage: boolean;
+  isReadonly: boolean;
+  isDarkMode: boolean;
+  shouldShowPartyInventory: boolean;
+  campaignName: string | null;
+}
+export default class EquipmentOverview extends React.PureComponent<Props> {
+  static defaultProps = {
+    enableManage: true,
+    isReadonly: false,
+  };
+
+  handleCurrencyClick = (evt: React.MouseEvent | React.KeyboardEvent): void => {
+    const { onCurrencyClick } = this.props;
+
+    if (onCurrencyClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onCurrencyClick(evt);
+    }
+  };
+
+  handleCampaignClick = (evt: React.MouseEvent | React.KeyboardEvent): void => {
+    const { onCampaignClick } = this.props;
+
+    if (onCampaignClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onCampaignClick();
+    }
+  };
+
+  handleWeightClick = (evt: React.MouseEvent | React.KeyboardEvent): void => {
+    const { onWeightClick } = this.props;
+
+    if (onWeightClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onWeightClick();
+    }
+  };
+
+  handleManageClick = (evt: React.MouseEvent | React.KeyboardEvent): void => {
+    const { onManageClick } = this.props;
+
+    if (onManageClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onManageClick();
+    }
+  };
+
+  render() {
+    const {
+      weight,
+      weightSpeedType,
+      enableManage,
+      isReadonly,
+      isDarkMode,
+      shouldShowPartyInventory,
+      campaignName,
+      currencies,
+    } = this.props;
+
+    let weightSpeedLabel =
+      RuleDataUtils.getWeightSpeedTypeLabel(weightSpeedType);
+
+    return (
+      // TODO: add a min height?
+      <div className="ct-equipment-overview">
+        {!shouldShowPartyInventory ? (
+          <div
+            role="button"
+            className="ct-equipment-overview__weight"
+            onClick={this.handleWeightClick}
+            onKeyDown={(evt) => {
+              if (evt.key === "Enter") {
+                this.handleWeightClick(evt);
+              }
+            }}
+          >
+            <div className="ct-equipment-overview__weight-carried">
+              <span
+                className={`ct-equipment-overview__weight-carried-label ${
+                  isDarkMode
+                    ? "ct-equipment-overview__weight-carried--dark-mode"
+                    : ""
+                }`}
+              >
+                Weight Carried:
+              </span>
+              <span
+                className={`ct-equipment-overview__weight-carried-amount ${
+                  isDarkMode
+                    ? "ct-equipment-overview__weight-carried--dark-mode"
+                    : ""
+                }`}
+              >
+                <NumberDisplay
+                  data-testid="weight-carried-number"
+                  type="weightInLb"
+                  number={weight}
+                />
+              </span>
+            </div>
+            <div
+              className={`ct-equipment-overview__weight-speed ct-equipment-overview__weight-speed--${FormatUtils.slugify(
+                weightSpeedLabel
+              )}`}
+            >
+              {weightSpeedLabel}
+            </div>
+          </div>
+        ) : (
+          <div
+            role="button"
+            className="ct-equipment-overview__weight"
+            onClick={this.handleCampaignClick}
+            onKeyDown={(evt) => {
+              if (evt.key === "Enter") {
+                this.handleCampaignClick(evt);
+              }
+            }}
+          >
+            <div className="ct-equipment-overview__weight-carried">
+              <span
+                className={`ct-equipment-overview__weight-carried-label ${
+                  isDarkMode
+                    ? "ct-equipment-overview__weight-carried--dark-mode"
+                    : ""
+                }`}
+              >
+                CAMPAIGN:
+                <span
+                  className={`ct-equipment-overview__weight-carried-amount ${
+                    isDarkMode
+                      ? "ct-equipment-overview__weight-carried--dark-mode"
+                      : ""
+                  }`}
+                >
+                  {campaignName || "N/A"}
+                </span>
+              </span>
+            </div>
+          </div>
+        )}
+        <div className="ct-equipment-overview__sep" />
+        <CurrencyButton
+          handleCurrencyClick={this.handleCurrencyClick}
+          coin={currencies}
+          isDarkMode={isDarkMode}
+          shouldShowPartyInventory={shouldShowPartyInventory}
+        />
+        {enableManage && !isReadonly && (
+          <div
+            role="button"
+            className="ct-equipment-overview__manage"
+            onClick={this.handleManageClick}
+            onKeyDown={(evt) => {
+              if (evt.key === "Enter") {
+                this.handleManageClick(evt);
+              }
+            }}
+          >
+            <Tooltip title="Manage Equipment" isDarkMode={isDarkMode}>
+              <span className="ct-equipment-overview__manage-icon" />
+            </Tooltip>
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/EquipmentOverview/index.ts b/ddb_main/tools/js/CharacterSheet/components/EquipmentOverview/index.ts
new file mode 100644
index 0000000..0d571f2
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/EquipmentOverview/index.ts
@@ -0,0 +1,4 @@
+import EquipmentOverview from "./EquipmentOverview";
+
+export default EquipmentOverview;
+export { EquipmentOverview };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilter.tsx
new file mode 100644
index 0000000..6442735
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilter.tsx
@@ -0,0 +1,602 @@
+import { orderBy, intersection } from "lodash";
+import React from "react";
+
+import {
+  DarkFilterSvg,
+  ThemedFilterSvg,
+  LightFilterSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  ExtraManager,
+  ExtrasFilterData,
+  HtmlSelectOption,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { FilterUtils } from "../../../Shared/utils";
+import ExtrasFilterArrayFilter from "./ExtrasFilterArrayFilter";
+
+interface Props {
+  extras: Array<ExtraManager>;
+  callout?: React.ReactNode;
+  onDataUpdate: (filterData: ExtrasFilterData) => void;
+  theme: CharacterTheme;
+}
+interface DefaultExtrasFilterState {
+  filterQuery: string;
+  filterTypes: Array<string>;
+  filterSubTypes: Array<string>;
+  filterEnvironments: Array<string>;
+  filterTags: Array<string>;
+  filterMovements: Array<string>;
+}
+interface State extends DefaultExtrasFilterState {
+  filteredExtras: Array<ExtraManager>;
+  showAdvancedFilters: boolean;
+}
+
+type ExtraFilterPropertyKey = keyof State;
+
+export default class ExtrasFilter extends React.PureComponent<Props, State> {
+  defaultFilterState: DefaultExtrasFilterState = {
+    filterQuery: "",
+    filterTypes: [],
+    filterSubTypes: [],
+    filterEnvironments: [],
+    filterTags: [],
+    filterMovements: [],
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      ...this.defaultFilterState,
+      filteredExtras: props.extras,
+      showAdvancedFilters: false,
+    };
+  }
+
+  componentDidMount() {
+    this.handleDataUpdate();
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { extras } = this.props;
+
+    if (extras !== prevProps.extras) {
+      this.setState(
+        {
+          filteredExtras: this.filterExtras(
+            this.props,
+            this.getFilters(prevState)
+          ),
+        },
+        this.handleDataUpdate
+      );
+    }
+  }
+
+  getFilters = (state: State): DefaultExtrasFilterState => {
+    const {
+      filterQuery,
+      filterTypes,
+      filterSubTypes,
+      filterEnvironments,
+      filterTags,
+      filterMovements,
+    } = state;
+    return {
+      filterQuery,
+      filterTypes,
+      filterSubTypes,
+      filterEnvironments,
+      filterTags,
+      filterMovements,
+    };
+  };
+
+  filterExtras = (
+    props: Props,
+    filters: DefaultExtrasFilterState
+  ): Array<ExtraManager> => {
+    const {
+      filterQuery,
+      filterTypes,
+      filterSubTypes,
+      filterEnvironments,
+      filterTags,
+      filterMovements,
+    } = filters;
+
+    return props.extras.filter((extra) => {
+      if (
+        filterQuery &&
+        !FilterUtils.doesQueryMatchData(
+          filterQuery,
+          extra.getName(),
+          extra.getSearchTags()
+        )
+      ) {
+        return false;
+      }
+
+      if (
+        filterTypes.length &&
+        !intersection(filterTypes, extra.getFilterTypes()).length
+      ) {
+        return false;
+      }
+
+      if (
+        filterEnvironments.length &&
+        !intersection(filterEnvironments, extra.getEnvironmentNames()).length
+      ) {
+        return false;
+      }
+
+      if (
+        filterTags.length &&
+        !intersection(filterTags, extra.getTags()).length
+      ) {
+        return false;
+      }
+
+      if (
+        filterMovements.length &&
+        !intersection(filterMovements, extra.getMovementNames()).length
+      ) {
+        return false;
+      }
+
+      return true;
+    });
+  };
+
+  getFilterCount = (): number => {
+    const {
+      filterTypes,
+      filterSubTypes,
+      filterEnvironments,
+      filterTags,
+      filterMovements,
+    } = this.state;
+
+    let count: number = 0;
+    count += filterTags.length;
+    count += filterTypes.length;
+    count += filterSubTypes.length;
+    count += filterEnvironments.length;
+    count += filterMovements.length;
+    return count;
+  };
+
+  getTagOptions = (tags: Array<string>): Array<HtmlSelectOption> => {
+    return tags.sort().map((tag) => ({ label: tag, value: tag }));
+  };
+
+  getTypeOptions = (types: Array<string>): Array<HtmlSelectOption> => {
+    return orderBy(
+      types.map((type) => ({
+        label: type,
+        value: type,
+      })),
+      "label"
+    );
+  };
+
+  getEnvironmentOptions = (
+    environmentNames: Array<string>
+  ): Array<HtmlSelectOption> => {
+    return orderBy(
+      environmentNames.map((name) => ({
+        label: name,
+        value: name,
+      })),
+      "label"
+    );
+  };
+
+  getMovementOptions = (names: Array<string>): Array<HtmlSelectOption> => {
+    return orderBy(
+      names.map((name) => ({
+        label: name,
+        value: name,
+      })),
+      "label"
+    );
+  };
+
+  isFiltering = (): boolean => {
+    const { filterQuery } = this.state;
+
+    const filterCount = this.getFilterCount();
+    return filterCount > 0 || !!filterQuery;
+  };
+
+  handleDataUpdate = (): void => {
+    const { onDataUpdate } = this.props;
+
+    if (onDataUpdate) {
+      onDataUpdate({
+        ...this.state,
+        filterCount: this.getFilterCount(),
+        isFiltering: this.isFiltering(),
+      });
+    }
+  };
+
+  handleFilterClear = (
+    propertyKey: ExtraFilterPropertyKey,
+    resetState: Array<string> | Array<number> | null
+  ): void => {
+    this.setState((prevState: State) => {
+      let extras = this.filterExtras(this.props, {
+        ...this.getFilters(prevState),
+        [propertyKey]: resetState,
+      });
+      return {
+        ...prevState,
+        [propertyKey]: resetState,
+        filteredExtras: extras,
+      };
+    }, this.handleDataUpdate);
+  };
+
+  handleArrayFilterClear = (
+    propertyKey: ExtraFilterPropertyKey,
+    evt: React.MouseEvent
+  ): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    this.handleFilterClear(propertyKey, []);
+  };
+
+  handleBoolFilterClear = (
+    propertyKey: ExtraFilterPropertyKey,
+    evt: React.MouseEvent
+  ): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    this.handleFilterClear(propertyKey, null);
+  };
+
+  handleFiltersClear = (): void => {
+    const { extras } = this.props;
+    this.setState(
+      {
+        ...this.defaultFilterState,
+        filteredExtras: extras,
+      },
+      this.handleDataUpdate
+    );
+  };
+
+  handleQueryUpdate = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    let value = evt.target.value;
+    this.setState((prevState: State) => {
+      let extras = this.filterExtras(this.props, {
+        ...this.getFilters(prevState),
+        filterQuery: value,
+      });
+      return {
+        filterQuery: value,
+        filteredExtras: extras,
+      };
+    }, this.handleDataUpdate);
+  };
+
+  handleFilterAdvancedToggle = (): void => {
+    this.setState(
+      (prevState: State) => ({
+        showAdvancedFilters: !prevState.showAdvancedFilters,
+      }),
+      this.handleDataUpdate
+    );
+  };
+
+  //TODO get array key by filtering for array type
+  handleFilterArrayToggle = (
+    arrayKey: string,
+    value: string | number
+  ): void => {
+    this.setState((prevState: State) => {
+      let includesItem: boolean = prevState[arrayKey].includes(value);
+      let newFilterArray: Array<string> | Array<number> = [];
+      if (includesItem) {
+        newFilterArray = prevState[arrayKey].filter(
+          (filterTag) => filterTag !== value
+        );
+      } else {
+        newFilterArray = [...prevState[arrayKey], value];
+      }
+      let extras = this.filterExtras(this.props, {
+        ...this.getFilters(prevState),
+        [arrayKey]: newFilterArray,
+      });
+      return {
+        ...prevState,
+        [arrayKey]: newFilterArray,
+        filteredExtras: extras,
+      };
+    }, this.handleDataUpdate);
+  };
+
+  handleExclusiveCheckboxFilterChange = (
+    propertyKey: ExtraFilterPropertyKey,
+    value: boolean | null
+  ): void => {
+    this.setState((prevState: State) => {
+      let extras = this.filterExtras(this.props, {
+        ...this.getFilters(prevState),
+        [propertyKey]: value,
+      });
+      return {
+        ...prevState,
+        [propertyKey]: value,
+        filteredExtras: extras,
+      };
+    }, this.handleDataUpdate);
+  };
+
+  renderAdvancedFilters = (): React.ReactNode => {
+    const {
+      filterTypes,
+      filterSubTypes,
+      filterEnvironments,
+      filterTags,
+      filterMovements,
+    } = this.state;
+    const { extras } = this.props;
+
+    let uniqueTags: Set<string> = new Set();
+    let uniqueTypes: Set<string> = new Set();
+    let uniqueEnvironments: Set<string> = new Set();
+    let uniqueMovements: Set<string> = new Set();
+    for (let i = 0; i < extras.length; i++) {
+      let extra = extras[i];
+
+      extra.getFilterTypes().forEach((type) => uniqueTypes.add(type));
+
+      let tags = extra.getTags();
+      tags.forEach((tag) => uniqueTags.add(tag));
+
+      // let environmentIds = extra.getEnvironments();
+      let environmentNames = extra.getEnvironmentNames();
+      environmentNames.forEach((name) => uniqueEnvironments.add(name));
+
+      let movementNames = extra.getMovementNames();
+      movementNames.forEach((name) => uniqueMovements.add(name));
+    }
+
+    return (
+      <div className="ct-extras-filter__adv-filters">
+        <ExtrasFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Type"
+          propertyKey="filterTypes"
+          currentValues={filterTypes}
+          availableOptions={this.getTypeOptions(Array.from(uniqueTypes))}
+        />
+        <ExtrasFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Tags"
+          propertyKey="filterTags"
+          currentValues={filterTags}
+          availableOptions={this.getTagOptions(Array.from(uniqueTags))}
+        />
+        <ExtrasFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Environments"
+          propertyKey="filterEnvironments"
+          currentValues={filterEnvironments}
+          availableOptions={this.getEnvironmentOptions(
+            Array.from(uniqueEnvironments)
+          )}
+        />
+        <ExtrasFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Movements"
+          propertyKey="filterMovements"
+          currentValues={filterMovements}
+          availableOptions={this.getMovementOptions(
+            Array.from(uniqueMovements)
+          )}
+        />
+      </div>
+    );
+  };
+
+  renderFilterBarActiveArray = (
+    label: string,
+    options: Array<HtmlSelectOption>,
+    propertyKey: ExtraFilterPropertyKey
+  ): React.ReactNode => {
+    return (
+      <div
+        className="ct-extras-filter__active"
+        onClick={this.handleFilterAdvancedToggle}
+      >
+        <div className="ct-extras-filter__active-label">{label}:</div>
+        <div className="ct-extras-filter__active-value">
+          {options.map((option) => option.label).join(" or ")}
+        </div>
+        <div className="ct-extras-filter__active-remove">
+          <div
+            className="ct-extras-filter__active-remove-icon"
+            onClick={this.handleArrayFilterClear.bind(this, propertyKey)}
+          />
+        </div>
+      </div>
+    );
+  };
+
+  renderFilterBarActiveExclusiveCheckbox = (
+    label: string,
+    value: boolean,
+    propertyKey: ExtraFilterPropertyKey,
+    trueLabel: string = "Yes",
+    falseLabel: string = "No"
+  ): React.ReactNode => {
+    return (
+      <div
+        className="ct-extras-filter__active"
+        onClick={this.handleFilterAdvancedToggle}
+      >
+        <div className="ct-extras-filter__active-label">{label}:</div>
+        <div className="ct-extras-filter__active-value">
+          {value ? trueLabel : falseLabel}
+        </div>
+        <div className="ct-extras-filter__active-remove">
+          <div
+            className="ct-extras-filter__active-remove-icon"
+            onClick={this.handleBoolFilterClear.bind(this, propertyKey)}
+          />
+        </div>
+      </div>
+    );
+  };
+
+  renderFilterBarActives = (): React.ReactNode => {
+    const {
+      filterTypes,
+      filterSubTypes,
+      filterEnvironments,
+      filterTags,
+      filterMovements,
+    } = this.state;
+
+    let activeNodes: Array<{ key: string; node: React.ReactNode }> = [];
+
+    if (filterTypes.length) {
+      activeNodes.push({
+        key: "filterTypes",
+        node: this.renderFilterBarActiveArray(
+          filterTypes.length === 1 ? "Type" : "Types",
+          this.getTypeOptions(filterTypes),
+          "filterTypes"
+        ),
+      });
+    }
+    if (filterTags.length) {
+      activeNodes.push({
+        key: "filterTags",
+        node: this.renderFilterBarActiveArray(
+          filterTags.length === 1 ? "Tag" : "Tags",
+          this.getTagOptions(filterTags),
+          "filterTags"
+        ),
+      });
+    }
+    if (filterEnvironments.length) {
+      activeNodes.push({
+        key: "filterEnvironments",
+        node: this.renderFilterBarActiveArray(
+          filterEnvironments.length === 1 ? "Habitat" : "Habitats",
+          this.getEnvironmentOptions(filterEnvironments),
+          "filterEnvironments"
+        ),
+      });
+    }
+    if (filterMovements.length) {
+      activeNodes.push({
+        key: "filterMovements",
+        node: this.renderFilterBarActiveArray(
+          filterMovements.length === 1 ? "Movement" : "Movements",
+          this.getMovementOptions(filterMovements),
+          "filterMovements"
+        ),
+      });
+    }
+
+    if (!activeNodes.length) {
+      return null;
+    }
+
+    return (
+      <div className="ct-extras-filter__actives">
+        {activeNodes.map((activeNode) => (
+          <React.Fragment key={activeNode.key}>
+            {activeNode.node}
+          </React.Fragment>
+        ))}
+      </div>
+    );
+  };
+
+  render() {
+    const { filterQuery, showAdvancedFilters } = this.state;
+    const { callout, theme } = this.props;
+
+    const filterCount = this.getFilterCount();
+    const hasFilter = this.isFiltering();
+
+    let advancedClassNames: Array<string> = ["ct-extras-filter__advanced"];
+    let FilterIcon: React.ComponentType<any> = theme.isDarkMode
+      ? LightFilterSvg
+      : DarkFilterSvg;
+    if (filterCount > 0) {
+      advancedClassNames.push("ct-extras-filter__advanced--active");
+      FilterIcon = ThemedFilterSvg;
+    }
+
+    let classNames: Array<string> = ["ct-extras-filter"];
+    if (showAdvancedFilters) {
+      classNames.push("ct-extras-filter--show-advanced");
+    }
+    if (hasFilter) {
+      classNames.push("ct-extras-filter--has-filter");
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ct-extras-filter__interactions">
+          <div className="ct-extras-filter__box">
+            {this.renderFilterBarActives()}
+            <div className="ct-extras-filter__primary">
+              <div className="ct-extras-filter__primary-group ct-extras-filter__primary-group--first">
+                <div className="ct-extras-filter__icon" />
+              </div>
+              <div className="ct-extras-filter__field">
+                <input
+                  className="ct-extras-filter__input"
+                  type="search"
+                  placeholder="Search Names, Types, or Tags"
+                  value={filterQuery}
+                  onChange={this.handleQueryUpdate}
+                />
+              </div>
+              {hasFilter && (
+                <div
+                  className="ct-extras-filter__clear"
+                  onClick={this.handleFiltersClear}
+                >
+                  Clear X
+                </div>
+              )}
+            </div>
+          </div>
+          <div
+            className={advancedClassNames.join(" ")}
+            onClick={this.handleFilterAdvancedToggle}
+          >
+            <FilterIcon theme={theme} />
+            {filterCount > 0 && (
+              <span className="ct-extras-filter__advanced-callout">
+                {filterCount}
+              </span>
+            )}
+          </div>
+          {callout && (
+            <div className="ct-extras-filter__callout">{callout}</div>
+          )}
+        </div>
+        {showAdvancedFilters && this.renderAdvancedFilters()}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilter/ExtrasFilterAdvancedFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilter/ExtrasFilterAdvancedFilter.tsx
new file mode 100644
index 0000000..caf8ec4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilter/ExtrasFilterAdvancedFilter.tsx
@@ -0,0 +1,9 @@
+import React from "react";
+
+export default class ExtrasFilterAdvancedFilter extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-extras-filter__adv-filter">{this.props.children}</div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilter/index.ts
new file mode 100644
index 0000000..4fd375d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilter/index.ts
@@ -0,0 +1,4 @@
+import ExtrasFilterAdvancedFilter from "./ExtrasFilterAdvancedFilter";
+
+export default ExtrasFilterAdvancedFilter;
+export { ExtrasFilterAdvancedFilter };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterLabel/ExtrasFilterAdvancedFilterLabel.tsx b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterLabel/ExtrasFilterAdvancedFilterLabel.tsx
new file mode 100644
index 0000000..75b43f2
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterLabel/ExtrasFilterAdvancedFilterLabel.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class ExtrasFilterAdvancedFilterLabel extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-extras-filter__adv-filter-label">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterLabel/index.ts b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterLabel/index.ts
new file mode 100644
index 0000000..a364e83
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterLabel/index.ts
@@ -0,0 +1,4 @@
+import ExtrasFilterAdvancedFilterLabel from "./ExtrasFilterAdvancedFilterLabel";
+
+export default ExtrasFilterAdvancedFilterLabel;
+export { ExtrasFilterAdvancedFilterLabel };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOption/ExtrasFilterAdvancedFilterOption.tsx b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOption/ExtrasFilterAdvancedFilterOption.tsx
new file mode 100644
index 0000000..953bbf4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOption/ExtrasFilterAdvancedFilterOption.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class ExtrasFilterAdvancedFilterOption extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-extras-filter__adv-filter-option">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOption/index.ts b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOption/index.ts
new file mode 100644
index 0000000..57de95d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOption/index.ts
@@ -0,0 +1,4 @@
+import ExtrasFilterAdvancedFilterOption from "./ExtrasFilterAdvancedFilterOption";
+
+export default ExtrasFilterAdvancedFilterOption;
+export { ExtrasFilterAdvancedFilterOption };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOptions/ExtrasFilterAdvancedFilterOptions.tsx b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOptions/ExtrasFilterAdvancedFilterOptions.tsx
new file mode 100644
index 0000000..ad7f3b1
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOptions/ExtrasFilterAdvancedFilterOptions.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class ExtrasFilterAdvancedFilterOptions extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-extras-filter__adv-filter-options">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOptions/index.ts b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOptions/index.ts
new file mode 100644
index 0000000..e4289ed
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterAdvancedFilterOptions/index.ts
@@ -0,0 +1,4 @@
+import ExtrasFilterAdvancedFilterOptions from "./ExtrasFilterAdvancedFilterOptions";
+
+export default ExtrasFilterAdvancedFilterOptions;
+export { ExtrasFilterAdvancedFilterOptions };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterArrayFilter/ExtrasFilterArrayFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterArrayFilter/ExtrasFilterArrayFilter.tsx
new file mode 100644
index 0000000..3c4a8b4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterArrayFilter/ExtrasFilterArrayFilter.tsx
@@ -0,0 +1,67 @@
+import React from "react";
+
+import { HtmlSelectOption } from "@dndbeyond/character-rules-engine/es";
+
+import ExtrasFilterAdvancedFilter from "../ExtrasFilterAdvancedFilter";
+import ExtrasFilterAdvancedFilterLabel from "../ExtrasFilterAdvancedFilterLabel";
+import ExtrasFilterAdvancedFilterOption from "../ExtrasFilterAdvancedFilterOption";
+import ExtrasFilterAdvancedFilterOptions from "../ExtrasFilterAdvancedFilterOptions";
+
+interface Props {
+  propertyKey: string;
+  label: string;
+  currentValues: Array<string | number>;
+  availableOptions: Array<HtmlSelectOption>;
+  onUpdate: (propertyKey: string, value: string | number) => void;
+}
+export default class ExtrasFilterArrayFilter extends React.PureComponent<Props> {
+  handleFilterArrayToggle = (
+    value: string | number,
+    evt: React.MouseEvent
+  ): void => {
+    const { onUpdate, propertyKey } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, value);
+    }
+  };
+
+  render() {
+    const { availableOptions, currentValues, label } = this.props;
+
+    if (availableOptions.length === 0) {
+      return null;
+    }
+
+    return (
+      <ExtrasFilterAdvancedFilter>
+        <ExtrasFilterAdvancedFilterLabel>
+          {label}
+        </ExtrasFilterAdvancedFilterLabel>
+        <ExtrasFilterAdvancedFilterOptions>
+          {availableOptions.map((option) => {
+            let classNames: Array<string> = [
+              "ct-extras-filter__adv-filter-button",
+            ];
+            if (currentValues.includes(option.value)) {
+              classNames.push("ct-extras-filter__adv-filter-button--active");
+            }
+            return (
+              <ExtrasFilterAdvancedFilterOption key={option.value}>
+                <span
+                  className={classNames.join(" ")}
+                  onClick={this.handleFilterArrayToggle.bind(
+                    this,
+                    option.value
+                  )}
+                >
+                  {option.label}
+                </span>
+              </ExtrasFilterAdvancedFilterOption>
+            );
+          })}
+        </ExtrasFilterAdvancedFilterOptions>
+      </ExtrasFilterAdvancedFilter>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterArrayFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterArrayFilter/index.ts
new file mode 100644
index 0000000..dcf3967
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterArrayFilter/index.ts
@@ -0,0 +1,4 @@
+import ExtrasFilterArrayFilter from "./ExtrasFilterArrayFilter";
+
+export default ExtrasFilterArrayFilter;
+export { ExtrasFilterArrayFilter };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterExclusiveCheckboxFilter/ExtrasFilterExclusiveCheckboxFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterExclusiveCheckboxFilter/ExtrasFilterExclusiveCheckboxFilter.tsx
new file mode 100644
index 0000000..eac5cb9
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterExclusiveCheckboxFilter/ExtrasFilterExclusiveCheckboxFilter.tsx
@@ -0,0 +1,126 @@
+import React from "react";
+
+import { Checkbox } from "@dndbeyond/character-components/es";
+
+import ExtrasFilterAdvancedFilter from "../ExtrasFilterAdvancedFilter";
+import ExtrasFilterAdvancedFilterLabel from "../ExtrasFilterAdvancedFilterLabel";
+import ExtrasFilterAdvancedFilterOption from "../ExtrasFilterAdvancedFilterOption";
+import ExtrasFilterAdvancedFilterOptions from "../ExtrasFilterAdvancedFilterOptions";
+
+interface Props {
+  propertyKey: string;
+  label: string;
+  value: boolean | null;
+  onUpdate: (propertyKey: string, value: boolean | null) => void;
+  trueLabel: string;
+  falseLabel: string;
+  nullLabel: string;
+}
+interface State {
+  value: boolean | null;
+}
+export default class ExclusiveCheckboxFilter extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    trueLabel: "Yes",
+    falseLabel: "No",
+    nullLabel: "Both",
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.value,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { value } = this.props;
+
+    if (value !== prevState.value) {
+      this.setState({
+        value,
+      });
+    }
+  }
+
+  handleUpdate = (value: boolean | null): void => {
+    const { onUpdate, propertyKey } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, value);
+    }
+    this.setState({
+      value,
+    });
+  };
+
+  render() {
+    const { value } = this.state;
+    const { label, trueLabel, falseLabel, nullLabel } = this.props;
+
+    return (
+      <ExtrasFilterAdvancedFilter>
+        <ExtrasFilterAdvancedFilterLabel>
+          {label}
+        </ExtrasFilterAdvancedFilterLabel>
+        <ExtrasFilterAdvancedFilterOptions>
+          <ExtrasFilterAdvancedFilterOption>
+            <div className="ct-extras-filter__adv-filter-checkbox">
+              <div className="ct-extras-filter__adv-filter-checkbox-input">
+                <Checkbox
+                  onChange={this.handleUpdate.bind(this, true)}
+                  enabled={value === true}
+                />
+              </div>
+              <div
+                className="ct-extras-filter__adv-filter-checkbox-label"
+                onClick={this.handleUpdate.bind(this, true)}
+              >
+                {trueLabel}
+              </div>
+            </div>
+          </ExtrasFilterAdvancedFilterOption>
+          <ExtrasFilterAdvancedFilterOption>
+            <div className="ct-extras-filter__adv-filter-checkbox">
+              <div className="ct-extras-filter__adv-filter-checkbox-input">
+                <Checkbox
+                  onChange={this.handleUpdate.bind(this, false)}
+                  enabled={value === false}
+                />
+              </div>
+              <div
+                className="ct-extras-filter__adv-filter-checkbox-label"
+                onClick={this.handleUpdate.bind(this, false)}
+              >
+                {falseLabel}
+              </div>
+            </div>
+          </ExtrasFilterAdvancedFilterOption>
+          <ExtrasFilterAdvancedFilterOption>
+            <div className="ct-extras-filter__adv-filter-checkbox">
+              <div className="ct-extras-filter__adv-filter-checkbox-input">
+                <Checkbox
+                  onChange={this.handleUpdate.bind(this, null)}
+                  enabled={value === null}
+                />
+              </div>
+              <div
+                className="ct-extras-filter__adv-filter-checkbox-label"
+                onClick={this.handleUpdate.bind(this, null)}
+              >
+                {nullLabel}
+              </div>
+            </div>
+          </ExtrasFilterAdvancedFilterOption>
+        </ExtrasFilterAdvancedFilterOptions>
+      </ExtrasFilterAdvancedFilter>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterExclusiveCheckboxFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterExclusiveCheckboxFilter/index.ts
new file mode 100644
index 0000000..f12f24e
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/ExtrasFilterExclusiveCheckboxFilter/index.ts
@@ -0,0 +1,4 @@
+import ExtrasFilterExclusiveCheckboxFilter from "./ExtrasFilterExclusiveCheckboxFilter";
+
+export default ExtrasFilterExclusiveCheckboxFilter;
+export { ExtrasFilterExclusiveCheckboxFilter };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/index.ts
new file mode 100644
index 0000000..288b77e
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ExtrasFilter/index.ts
@@ -0,0 +1,18 @@
+import ExtrasFilter from "./ExtrasFilter";
+import ExtrasFilterAdvancedFilter from "./ExtrasFilterAdvancedFilter";
+import ExtrasFilterAdvancedFilterLabel from "./ExtrasFilterAdvancedFilterLabel";
+import ExtrasFilterAdvancedFilterOption from "./ExtrasFilterAdvancedFilterOption";
+import ExtrasFilterAdvancedFilterOptions from "./ExtrasFilterAdvancedFilterOptions";
+import ExtrasFilterArrayFilter from "./ExtrasFilterArrayFilter";
+import ExtrasFilterExclusiveCheckboxFilter from "./ExtrasFilterExclusiveCheckboxFilter";
+
+export default ExtrasFilter;
+export {
+  ExtrasFilter,
+  ExtrasFilterAdvancedFilter,
+  ExtrasFilterAdvancedFilterLabel,
+  ExtrasFilterAdvancedFilterOption,
+  ExtrasFilterAdvancedFilterOptions,
+  ExtrasFilterArrayFilter,
+  ExtrasFilterExclusiveCheckboxFilter,
+};
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatsDetail/FeatsDetail.tsx b/ddb_main/tools/js/CharacterSheet/components/FeatsDetail/FeatsDetail.tsx
new file mode 100644
index 0000000..21c9955
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatsDetail/FeatsDetail.tsx
@@ -0,0 +1,88 @@
+import React, { useContext } from "react";
+
+import {
+  AbilityLookup,
+  Action,
+  CharacterTheme,
+  DataOriginRefData,
+  FeatManager,
+  RuleData,
+  SnippetData,
+  Spell,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { CharacterFeaturesManagerContext } from "../../../Shared/managers/CharacterFeaturesManagerContext";
+import { FeatFeatureSnippet } from "../FeatureSnippet";
+
+interface Props {
+  onActionUseSet: (action: Action, uses: number) => void;
+  onActionClick: (action: Action) => void;
+  onSpellClick: (spell: Spell) => void;
+  onSpellUseSet: (spell: Spell, uses: number) => void;
+  onFeatureClick: (feat: FeatManager) => void;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+export const FeatsDetail: React.FC<Props> = ({
+  dataOriginRefData,
+  onActionUseSet,
+  onActionClick,
+  onSpellClick,
+  onSpellUseSet,
+  ruleData,
+  snippetData,
+  isReadonly,
+  theme,
+  onFeatureClick,
+  proficiencyBonus,
+  abilityLookup,
+}) => {
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+  const currentFeats = characterFeaturesManager.getStandardFeats();
+
+  return (
+    <div className="ct-feats-detail">
+      {currentFeats.length ? (
+        <React.Fragment>
+          {currentFeats.map((feat) => (
+            <FeatFeatureSnippet
+              key={feat.getId()}
+              feat={feat}
+              dataOriginRefData={dataOriginRefData}
+              onActionUseSet={onActionUseSet}
+              onActionClick={onActionClick}
+              onSpellClick={onSpellClick}
+              onSpellUseSet={onSpellUseSet}
+              ruleData={ruleData}
+              snippetData={snippetData}
+              isReadonly={isReadonly}
+              onFeatureClick={() => onFeatureClick(feat)}
+              proficiencyBonus={proficiencyBonus}
+              abilityLookup={abilityLookup}
+              theme={theme}
+            />
+          ))}
+        </React.Fragment>
+      ) : (
+        <div
+          className={`ct-feats-detail__default ${
+            theme.isDarkMode ? "ct-feats-detail__default--dark-mode" : ""
+          }`}
+        >
+          <p>
+            You have no feats chosen, you can add feats outside of normal
+            progression in the manage screen.
+          </p>
+        </div>
+      )}
+    </div>
+  );
+};
+export default FeatsDetail;
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatsDetail/index.ts b/ddb_main/tools/js/CharacterSheet/components/FeatsDetail/index.ts
new file mode 100644
index 0000000..e17d43a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatsDetail/index.ts
@@ -0,0 +1,4 @@
+import FeatsDetail from "./FeatsDetail";
+
+export default FeatsDetail;
+export { FeatsDetail };
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/ClassFeatureSnippet/ClassFeatureSnippet.tsx b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/ClassFeatureSnippet/ClassFeatureSnippet.tsx
new file mode 100644
index 0000000..2170245
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/ClassFeatureSnippet/ClassFeatureSnippet.tsx
@@ -0,0 +1,135 @@
+import React from "react";
+
+import {
+  AbilityLookup,
+  BaseFeat,
+  CharClass,
+  ClassFeature,
+  ClassFeatureUtils,
+  ClassUtils,
+  DataOriginBaseAction,
+  DataOriginRefData,
+  DataOriginSpell,
+  InfusionChoice,
+  RuleData,
+  SnippetData,
+  AccessUtils,
+  CharacterTheme,
+  CharacterFeaturesManager,
+  FeatManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { DataOriginTypeEnum } from "~/constants";
+import { FeatureSnippet } from "~/subApps/sheet/components/FeatureSnippet";
+
+import FeatFeatureSnippet from "../FeatFeatureSnippet";
+
+interface Props {
+  feature: ClassFeature;
+  charClass: CharClass;
+  extraMeta: Array<string>;
+  onActionClick: (action: DataOriginBaseAction) => void;
+  onActionUseSet: (action: DataOriginBaseAction, uses: number) => void;
+  onSpellClick: (spell: DataOriginSpell) => void;
+  onSpellUseSet: (spell: DataOriginSpell, uses: number) => void;
+  onFeatureClick: (feat: ClassFeature, charClass: CharClass) => void;
+  onInfusionChoiceClick: (infusionChoice: InfusionChoice) => void;
+
+  showHeader?: boolean;
+  showDescription?: boolean;
+
+  feats: Array<BaseFeat>;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  onFeatClick: (feat: FeatManager) => void;
+  featuresManager: CharacterFeaturesManager;
+}
+export default class ClassFeatureSnippet extends React.PureComponent<Props> {
+  static defaultProps = {
+    extraMeta: [],
+    showDescription: false,
+  };
+
+  handleFeatureClick = (): void => {
+    const { feature, charClass, onFeatureClick } = this.props;
+
+    if (onFeatureClick) {
+      onFeatureClick(feature, charClass);
+    }
+  };
+
+  renderDescription = (): React.ReactNode => {
+    const { feature, showDescription } = this.props;
+
+    const description: string | null = AccessUtils.isAccessible(
+      ClassFeatureUtils.getAccessType(feature)
+    )
+      ? ClassFeatureUtils.getDescription(feature)
+      : "Check out the Marketplace to unlock this Class Feature.";
+
+    return showDescription
+      ? description
+      : ClassFeatureUtils.getSnippet(feature);
+  };
+
+  render() {
+    const {
+      feature,
+      charClass,
+      onFeatureClick,
+      showDescription,
+      featuresManager,
+      onFeatClick,
+      ...restProps
+    } = this.props;
+
+    const feats = [
+      // Both primary and parent. Feats from the Granted Feat system have the class feature as a parent.
+      ...featuresManager.getDataOriginOnlyFeatsByPrimary(
+        DataOriginTypeEnum.CLASS_FEATURE,
+        `${ClassFeatureUtils.getId(feature)}`
+      ),
+      ...featuresManager.getDataOriginOnlyFeatsByParent(
+        DataOriginTypeEnum.CLASS_FEATURE,
+        `${ClassFeatureUtils.getId(feature)}`
+      ),
+    ];
+
+    // When the class feature grants feats, show those rather than the class feature.
+    return feats.length ? (
+      feats.map((feat) => (
+        <FeatFeatureSnippet
+          {...restProps}
+          key={feat.getId()}
+          feat={feat}
+          onFeatureClick={onFeatClick}
+        />
+      ))
+    ) : (
+      <FeatureSnippet
+        {...restProps}
+        heading={ClassFeatureUtils.getName(feature)}
+        className="ct-feature-snippet--class"
+        levelScale={ClassFeatureUtils.getLevelScale(feature)}
+        actions={ClassFeatureUtils.getActions(feature)}
+        options={ClassFeatureUtils.getOptions(feature)}
+        choices={ClassFeatureUtils.getChoices(feature)}
+        infusionChoices={ClassFeatureUtils.getInfusionChoices(feature)}
+        classLevel={ClassUtils.getLevel(charClass)}
+        subclass={ClassUtils.getSubclass(charClass)}
+        spells={ClassFeatureUtils.getSpells(feature)}
+        sourceId={ClassFeatureUtils.getSourceId(feature)}
+        sourcePage={ClassFeatureUtils.getSourcePage(feature)}
+        onFeatureClick={this.handleFeatureClick}
+        showDescription={showDescription}
+      >
+        {this.renderDescription()}
+      </FeatureSnippet>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/ClassFeatureSnippet/index.ts b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/ClassFeatureSnippet/index.ts
new file mode 100644
index 0000000..643d47b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/ClassFeatureSnippet/index.ts
@@ -0,0 +1,4 @@
+import ClassFeatureSnippet from "./ClassFeatureSnippet";
+
+export default ClassFeatureSnippet;
+export { ClassFeatureSnippet };
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatFeatureSnippet/FeatFeatureSnippet.tsx b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatFeatureSnippet/FeatFeatureSnippet.tsx
new file mode 100644
index 0000000..795837c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatFeatureSnippet/FeatFeatureSnippet.tsx
@@ -0,0 +1,120 @@
+import React, { useContext } from "react";
+
+import {
+  AbilityLookup,
+  Action,
+  CharacterTheme,
+  CharacterUtils,
+  DataOriginRefData,
+  FeatManager,
+  RuleData,
+  SnippetData,
+  SourceMappingContract,
+  Spell,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { FeatureSnippet } from "~/subApps/sheet/components/FeatureSnippet";
+
+import { CharacterFeaturesManagerContext } from "../../../../Shared/managers/CharacterFeaturesManagerContext";
+
+interface Props {
+  feat: FeatManager;
+  extraMeta?: Array<string>;
+  onActionClick?: (action: Action) => void;
+  onActionUseSet?: (action: Action, uses: number) => void;
+  onSpellClick?: (spell: Spell) => void;
+  onSpellUseSet?: (spell: Spell, uses: number) => void;
+  onFeatureClick?: (feat: FeatManager) => void;
+
+  showHeader?: boolean;
+  showDescription?: boolean;
+
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+export const FeatFeatureSnippet: React.FC<Props> = ({
+  feat,
+  onFeatureClick,
+  snippetData,
+  ruleData,
+  abilityLookup,
+  dataOriginRefData,
+  proficiencyBonus,
+  theme,
+  isReadonly,
+  onActionClick,
+  onSpellClick,
+  onSpellUseSet,
+  onActionUseSet,
+  showHeader,
+  extraMeta = [],
+  showDescription = false,
+}) => {
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+  const currentFeats = characterFeaturesManager.getFeats();
+  const { entityUtils } = useCharacterEngine();
+
+  let sourceId: number | null = null;
+  let sourcePage: number | null = null;
+  let filteredSources = feat
+    .getSources()
+    .filter(CharacterUtils.isPrimarySource);
+  let dataOrigin = feat.getDataOrigin();
+  const dataOriginExtra = entityUtils.getDataOriginName(
+    dataOrigin,
+    "Unknown",
+    true
+  );
+
+  if (filteredSources.length) {
+    let primarySource: SourceMappingContract = filteredSources[0];
+    sourceId = primarySource.sourceId;
+    sourcePage = primarySource.pageNumber;
+  }
+
+  return (
+    <FeatureSnippet
+      snippetData={snippetData}
+      ruleData={ruleData}
+      abilityLookup={abilityLookup}
+      dataOriginRefData={dataOriginRefData}
+      proficiencyBonus={proficiencyBonus}
+      theme={theme}
+      isReadonly={isReadonly}
+      extraMeta={extraMeta}
+      onActionClick={onActionClick}
+      onActionUseSet={onActionUseSet}
+      onSpellClick={onSpellClick}
+      onSpellUseSet={onSpellUseSet}
+      showHeader={showHeader}
+      feats={currentFeats.map((feat) => feat.feat)}
+      dataOriginExtra={dataOriginExtra}
+      heading={feat.getName()}
+      className="ct-feature-snippet--feat"
+      actions={feat.getActions()}
+      options={feat.getOptions()}
+      choices={feat.getChoices()}
+      spells={feat.getSpells()}
+      sourceId={sourceId}
+      sourcePage={sourcePage}
+      onFeatureClick={() => {
+        if (onFeatureClick) {
+          onFeatureClick(feat);
+        }
+      }}
+      showDescription={showDescription}
+    >
+      {showDescription ? feat.getDescription() : feat.getSnippet()}
+    </FeatureSnippet>
+  );
+};
+
+export default FeatFeatureSnippet;
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatFeatureSnippet/index.ts b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatFeatureSnippet/index.ts
new file mode 100644
index 0000000..e5e9bfc
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatFeatureSnippet/index.ts
@@ -0,0 +1,4 @@
+import FeatFeatureSnippet from "./FeatFeatureSnippet";
+
+export default FeatFeatureSnippet;
+export { FeatFeatureSnippet };
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetAction/FeatureSnippetAction.tsx b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetAction/FeatureSnippetAction.tsx
new file mode 100644
index 0000000..fe031a8
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetAction/FeatureSnippetAction.tsx
@@ -0,0 +1,128 @@
+import React from "react";
+
+import {
+  AbilityLookup,
+  ActionUtils,
+  ActivationUtils,
+  Constants,
+  DataOriginBaseAction,
+  LimitedUseUtils,
+  RuleData,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { FeatureSnippetLimitedUse } from "../FeatureSnippetLimitedUse";
+
+interface Props {
+  action: DataOriginBaseAction;
+
+  onActionUseSet?: (action: DataOriginBaseAction, uses: number) => void;
+  onActionClick?: (action: DataOriginBaseAction) => void;
+
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  isInteractive: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+export default class FeatureSnippetAction extends React.PureComponent<Props> {
+  handleActionUseSet = (action: DataOriginBaseAction, uses: number): void => {
+    const { onActionUseSet } = this.props;
+
+    if (onActionUseSet) {
+      onActionUseSet(action, uses);
+    }
+  };
+
+  handleActionClick = (evt: React.MouseEvent): void => {
+    const { action, onActionClick } = this.props;
+
+    if (onActionClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onActionClick(action);
+    }
+  };
+
+  render() {
+    const {
+      action,
+      ruleData,
+      abilityLookup,
+      isInteractive,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    let limitedUse = ActionUtils.getLimitedUse(action);
+    let name = ActionUtils.getName(action);
+    let activation = ActionUtils.getActivation(action);
+    let limitedUseLabel: string | null = null;
+    if (limitedUse) {
+      let maxUses = LimitedUseUtils.deriveMaxUses(
+        limitedUse,
+        abilityLookup,
+        ruleData,
+        proficiencyBonus
+      );
+      limitedUseLabel = maxUses > 1 ? "Uses:" : "";
+    }
+    let activationDisplay: string = "(No Action)";
+    if (activation) {
+      switch (activation.activationType) {
+        case Constants.ActivationTypeEnum.ACTION:
+        case Constants.ActivationTypeEnum.REACTION:
+        case Constants.ActivationTypeEnum.BONUS_ACTION:
+          activationDisplay = ActivationUtils.renderActivation(
+            activation,
+            ruleData
+          );
+          break;
+        default:
+        // not implemented
+      }
+    }
+
+    return (
+      <div
+        className="ct-feature-snippet__action"
+        onClick={this.handleActionClick}
+      >
+        <div
+          className={`ct-feature-snippet__action-summary ${
+            theme?.isDarkMode
+              ? "ct-feature-snippet__action-summary--dark-mode"
+              : ""
+          }`}
+        >
+          {name}: {activationDisplay}
+        </div>
+        {limitedUse && (
+          <div className="ct-feature-snippet__action-limited">
+            {limitedUseLabel && (
+              <div
+                className={`ct-feature-snippet__action-limited-label ${
+                  theme?.isDarkMode
+                    ? "ct-feature-snippet__action-limited-label--dark-mode"
+                    : ""
+                }`}
+              >
+                {limitedUseLabel}
+              </div>
+            )}
+            <FeatureSnippetLimitedUse
+              component={action}
+              limitedUse={limitedUse}
+              onUseSet={this.handleActionUseSet}
+              abilityLookup={abilityLookup}
+              ruleData={ruleData}
+              isInteractive={isInteractive}
+              proficiencyBonus={proficiencyBonus}
+              theme={theme}
+            />
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetAction/index.ts b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetAction/index.ts
new file mode 100644
index 0000000..9a9bb12
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetAction/index.ts
@@ -0,0 +1,4 @@
+import FeatureSnippetAction from "./FeatureSnippetAction";
+
+export default FeatureSnippetAction;
+export { FeatureSnippetAction };
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetActions/FeatureSnippetActions.tsx b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetActions/FeatureSnippetActions.tsx
new file mode 100644
index 0000000..bb7c69d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetActions/FeatureSnippetActions.tsx
@@ -0,0 +1,61 @@
+import React from "react";
+
+import {
+  AbilityLookup,
+  ActionUtils,
+  DataOriginBaseAction,
+  RuleData,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import FeatureSnippetAction from "../FeatureSnippetAction";
+
+interface Props {
+  actions: Array<DataOriginBaseAction>;
+
+  onActionUseSet?: (action: DataOriginBaseAction, uses: number) => void;
+  onActionClick?: (action: DataOriginBaseAction) => void;
+
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  isInteractive: boolean;
+  proficiencyBonus: number;
+
+  theme: CharacterTheme;
+}
+export default class FeatureSnippetActions extends React.PureComponent<Props> {
+  render() {
+    const {
+      actions,
+      onActionUseSet,
+      onActionClick,
+      ruleData,
+      abilityLookup,
+      isInteractive,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    if (!actions.length) {
+      return null;
+    }
+
+    return (
+      <div className="ct-feature-snippet__actions">
+        {actions.map((action) => (
+          <FeatureSnippetAction
+            key={ActionUtils.getUniqueKey(action)}
+            action={action}
+            onActionUseSet={onActionUseSet}
+            onActionClick={onActionClick}
+            ruleData={ruleData}
+            abilityLookup={abilityLookup}
+            isInteractive={isInteractive}
+            proficiencyBonus={proficiencyBonus}
+            theme={theme}
+          />
+        ))}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetActions/index.ts b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetActions/index.ts
new file mode 100644
index 0000000..7f1f68b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetActions/index.ts
@@ -0,0 +1,4 @@
+import FeatureSnippetActions from "./FeatureSnippetActions";
+
+export default FeatureSnippetActions;
+export { FeatureSnippetActions };
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetChoices/FeatureSnippetChoices.tsx b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetChoices/FeatureSnippetChoices.tsx
new file mode 100644
index 0000000..02ed82c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetChoices/FeatureSnippetChoices.tsx
@@ -0,0 +1,217 @@
+import React from "react";
+
+import {
+  AbilityLookup,
+  BaseFeat,
+  CharacterTheme,
+  Choice,
+  ClassDefinitionContract,
+  Constants,
+  DataOriginBaseAction,
+  DataOriginRefData,
+  FeatUtils,
+  Option,
+  OptionUtils,
+  RuleData,
+  SnippetData,
+  SourceData,
+  Spell,
+} from "@dndbeyond/character-rules-engine/es";
+
+import FeatureSnippetOption from "../FeatureSnippetOption";
+
+interface Props {
+  choices?: Array<Choice>;
+  options?: Array<Option>;
+
+  onActionClick?: (action: DataOriginBaseAction) => void;
+  onActionUseSet?: (action: DataOriginBaseAction, uses: number) => void;
+  onSpellUseSet?: (spell: Spell, uses: number) => void;
+  onSpellClick?: (spell: Spell) => void;
+
+  feats?: Array<BaseFeat>;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  sourceDataLookup: Record<number, SourceData>;
+  dataOriginRefData: DataOriginRefData;
+
+  classLevel?: number;
+  subclass?: ClassDefinitionContract | null;
+
+  showDescription: boolean;
+  isInteractive: boolean;
+  proficiencyBonus: number;
+
+  theme: CharacterTheme;
+}
+export default class FeatureSnippetChoices extends React.PureComponent<Props> {
+  static defaultProps = {
+    showDescription: false,
+    isInteractive: true,
+  };
+
+  render() {
+    const {
+      options,
+      choices,
+      subclass,
+      feats,
+      snippetData,
+      classLevel,
+      ruleData,
+      abilityLookup,
+      sourceDataLookup,
+      dataOriginRefData,
+      onActionUseSet,
+      onActionClick,
+      onSpellClick,
+      onSpellUseSet,
+      showDescription,
+      isInteractive,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    if (!choices || !choices.length) {
+      return null;
+    }
+
+    return (
+      <div className="ct-feature-snippet__choices">
+        {choices.map((choice, idx) => {
+          const {
+            id,
+            type,
+            optionValue,
+            subType,
+            options: choiceOptions,
+          } = choice;
+
+          let displayType: React.ReactNode;
+          let selectedValue: React.ReactNode;
+          switch (type) {
+            case Constants.BuilderChoiceTypeEnum.RACIAL_TRAIT_OPTION:
+            case Constants.BuilderChoiceTypeEnum.FEAT_OPTION:
+            case Constants.BuilderChoiceTypeEnum.FEATURE_OPTION:
+              displayType = "Feature Option";
+              let selectedFeatureOption = options
+                ? options.find((opt) => OptionUtils.getId(opt) === optionValue)
+                : undefined;
+              if (selectedFeatureOption) {
+                selectedValue = (
+                  <FeatureSnippetOption
+                    option={selectedFeatureOption}
+                    onSpellClick={onSpellClick}
+                    onSpellUseSet={onSpellUseSet}
+                    onActionClick={onActionClick}
+                    onActionUseSet={onActionUseSet}
+                    snippetData={snippetData}
+                    classLevel={classLevel}
+                    ruleData={ruleData}
+                    abilityLookup={abilityLookup}
+                    dataOriginRefData={dataOriginRefData}
+                    sourceDataLookup={sourceDataLookup}
+                    showDescription={showDescription}
+                    isInteractive={isInteractive}
+                    proficiencyBonus={proficiencyBonus}
+                    theme={theme}
+                  />
+                );
+              } else {
+                selectedValue = "Could not find selected feature option";
+              }
+              break;
+
+            case Constants.BuilderChoiceTypeEnum.FEAT_CHOICE_OPTION:
+              displayType = "Feat";
+              let selectedFeat = feats
+                ? feats.find((feat) => FeatUtils.getId(feat) === optionValue)
+                : undefined;
+              selectedValue = selectedFeat
+                ? FeatUtils.getName(selectedFeat)
+                : "Could not find selected feat";
+              break;
+
+            case Constants.BuilderChoiceTypeEnum.ENTITY_SPELL_OPTION:
+              //The actual rendering spells scenario is being handled in FeatureSnippetSpells only IF the choice is not null
+              //This is a fix to show "No Choice Made" when FeatureSnippetSpells is not rendering anything
+              displayType = "Spell";
+              if (optionValue === null) selectedValue = "No Choice Made";
+              else return null;
+
+              break;
+
+            case Constants.BuilderChoiceTypeEnum.SUB_CLASS_OPTION:
+              displayType = "Subclass";
+              selectedValue =
+                subclass && subclass.name
+                  ? subclass.name
+                  : "Could not find selected subclass";
+              break;
+
+            case Constants.BuilderChoiceTypeEnum.ONE_MODIFIER_TYPE_CHOICE:
+              displayType = "One Modifier Type Choice";
+              let selectedOneModifier = choiceOptions
+                ? choiceOptions.find((opt) => opt.id === optionValue)
+                : undefined;
+              selectedValue = selectedOneModifier
+                ? selectedOneModifier.label
+                : "Could not find selected one modifier type choice";
+              break;
+
+            case Constants.BuilderChoiceTypeEnum.MODIFIER_SUB_CHOICE:
+              let selectedOption = choiceOptions
+                ? choiceOptions.find((opt) => opt.id === optionValue)
+                : undefined;
+              selectedValue = selectedOption
+                ? selectedOption.label
+                : "could not find selected choice";
+              switch (subType) {
+                case Constants.BuilderChoiceSubtypeEnum.PROFICIENCY:
+                  displayType = "Proficiency";
+                  break;
+                case Constants.BuilderChoiceSubtypeEnum.LANGUAGE:
+                  displayType = "Language";
+                  break;
+                case Constants.BuilderChoiceSubtypeEnum.KENSEI:
+                  displayType = "Kensei Option";
+                  break;
+                case Constants.BuilderChoiceSubtypeEnum.EXPERTISE:
+                  displayType = "Expertise";
+                  break;
+                case Constants.BuilderChoiceSubtypeEnum
+                  .EXPERTISE_NO_REQUIREMENT:
+                  displayType = "Expertise";
+                  break;
+                case Constants.BuilderChoiceSubtypeEnum.ABILITY_SCORE: {
+                  displayType = "Ability Score";
+                  break;
+                }
+              }
+              break;
+
+            default:
+              throw new Error(`Unknown BUILDER_CHOICE_TYPE: ${type}`);
+          }
+
+          return (
+            <div
+              className={`ct-feature-snippet__choice ${
+                theme?.isDarkMode ? "ct-feature-snippet__choice--dark-mode" : ""
+              }`}
+              key={`${id}-${idx}`}
+            >
+              {optionValue === null
+                ? "No Choice Made"
+                : selectedValue
+                ? selectedValue
+                : "could not find selected value"}
+            </div>
+          );
+          //`
+        })}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetChoices/index.ts b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetChoices/index.ts
new file mode 100644
index 0000000..a608447
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetChoices/index.ts
@@ -0,0 +1,4 @@
+import FeatureSnippetChoices from "./FeatureSnippetChoices";
+
+export default FeatureSnippetChoices;
+export { FeatureSnippetChoices };
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetInfusionChoices/FeatureSnippetInfusionChoices.tsx b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetInfusionChoices/FeatureSnippetInfusionChoices.tsx
new file mode 100644
index 0000000..9eed053
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetInfusionChoices/FeatureSnippetInfusionChoices.tsx
@@ -0,0 +1,89 @@
+import React from "react";
+
+import {
+  InfusionChoice,
+  InfusionChoiceUtils,
+  InfusionUtils,
+  KnownInfusionUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+type OnInfusionChoiceClick = (infusionChoice: InfusionChoice) => void;
+interface Props {
+  infusionChoices: Array<InfusionChoice>;
+
+  onInfusionChoiceClick?: OnInfusionChoiceClick;
+}
+
+export default class FeatureSnippetInfusionChoices extends React.PureComponent<Props> {
+  handleInfusionChoiceClick = (
+    infusionChoice: InfusionChoice,
+    evt: React.MouseEvent
+  ) => {
+    const { onInfusionChoiceClick } = this.props;
+
+    if (onInfusionChoiceClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onInfusionChoiceClick(infusionChoice);
+    }
+  };
+
+  render() {
+    const { infusionChoices } = this.props;
+
+    let availableInfusionChoices = infusionChoices.filter(
+      InfusionChoiceUtils.validateIsAvailable
+    );
+
+    if (!availableInfusionChoices.length) {
+      return null;
+    }
+
+    let classNames: Array<string> = ["ct-feature-snippet__infusion-choices"];
+
+    return (
+      <div className={classNames.join(" ")}>
+        {availableInfusionChoices.map((infusionChoice, idx) => {
+          const knownInfusion =
+            InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+
+          let nameNode: React.ReactNode = "No Infusion Choice Made";
+          let onClick: OnInfusionChoiceClick | undefined;
+          if (knownInfusion) {
+            const simulatedInfusion =
+              KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+            if (simulatedInfusion !== null) {
+              nameNode = (
+                <React.Fragment>
+                  {InfusionUtils.getName(simulatedInfusion)}
+                </React.Fragment>
+              );
+              onClick = this.handleInfusionChoiceClick.bind(
+                this,
+                infusionChoice
+              );
+            }
+          }
+
+          const choiceKey = InfusionChoiceUtils.getKey(infusionChoice);
+
+          //TODO this onclick handler needs to be converted to a new sub component to
+          // get away from the need for binding as it messes with typing it
+          return (
+            <div
+              className="ct-feature-snippet__infusion-choice"
+              key={choiceKey === null ? "" : choiceKey}
+            >
+              <div
+                className="ct-feature-snippet__infusion-choice-summary"
+                onClick={onClick as any}
+              >
+                {nameNode}
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetInfusionChoices/index.ts b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetInfusionChoices/index.ts
new file mode 100644
index 0000000..f9b9c1c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetInfusionChoices/index.ts
@@ -0,0 +1,4 @@
+import FeatureSnippetInfusionChoices from "./FeatureSnippetInfusionChoices";
+
+export default FeatureSnippetInfusionChoices;
+export { FeatureSnippetInfusionChoices };
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetLimitedUse/FeatureSnippetLimitedUse.tsx b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetLimitedUse/FeatureSnippetLimitedUse.tsx
new file mode 100644
index 0000000..13f19d7
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetLimitedUse/FeatureSnippetLimitedUse.tsx
@@ -0,0 +1,186 @@
+import React from "react";
+
+import {
+  AbilityLookup,
+  DataOriginBaseAction,
+  DataOriginSpell,
+  Constants,
+  EntityLimitedUseContract,
+  LimitedUseUtils,
+  RuleData,
+  RuleDataUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import SlotManager from "../../../../Shared/components/SlotManager";
+import SlotManagerLarge from "../../../../Shared/components/SlotManagerLarge";
+
+interface Props {
+  component: DataOriginBaseAction | DataOriginSpell;
+  limitedUse: EntityLimitedUseContract | null;
+  onUseSet?: (
+    component: DataOriginBaseAction | DataOriginSpell,
+    uses: number
+  ) => void;
+
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  isInteractive: boolean;
+  largeLimitedUseAmount: number;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+export default class FeatureSnippetLimitedUse extends React.PureComponent<Props> {
+  static defaultProps = {
+    largeLimitedUseAmount: 8,
+  };
+
+  handleUseSet = (uses: number): void => {
+    const { onUseSet, component } = this.props;
+
+    if (onUseSet) {
+      onUseSet(component, uses);
+    }
+  };
+
+  renderSmallAmountSlotPool = (): React.ReactNode => {
+    const {
+      limitedUse,
+      ruleData,
+      abilityLookup,
+      isInteractive,
+      proficiencyBonus,
+    } = this.props;
+
+    if (!limitedUse) {
+      return null;
+    }
+
+    const numberUsed = LimitedUseUtils.getNumberUsed(limitedUse);
+    const maxUses = LimitedUseUtils.deriveMaxUses(
+      limitedUse,
+      abilityLookup,
+      ruleData,
+      proficiencyBonus
+    );
+
+    if (!maxUses) {
+      return null;
+    }
+
+    return (
+      <SlotManager
+        used={numberUsed}
+        available={maxUses}
+        size={"small"}
+        onSet={this.handleUseSet}
+        isInteractive={isInteractive}
+      />
+    );
+  };
+
+  renderLargeAmountSlotPool = (): React.ReactNode => {
+    const {
+      limitedUse,
+      ruleData,
+      abilityLookup,
+      isInteractive,
+      proficiencyBonus,
+    } = this.props;
+
+    if (!limitedUse) {
+      return null;
+    }
+
+    const numberUsed = LimitedUseUtils.getNumberUsed(limitedUse);
+    const maxUses = LimitedUseUtils.deriveMaxUses(
+      limitedUse,
+      abilityLookup,
+      ruleData,
+      proficiencyBonus
+    );
+
+    if (!maxUses) {
+      return null;
+    }
+
+    return (
+      <SlotManagerLarge
+        label="Current:"
+        available={maxUses}
+        used={numberUsed}
+        onSet={this.handleUseSet}
+        isInteractive={isInteractive}
+      />
+    );
+  };
+
+  render() {
+    const {
+      limitedUse,
+      ruleData,
+      abilityLookup,
+      largeLimitedUseAmount,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    if (!limitedUse) {
+      return null;
+    }
+
+    let resetType = LimitedUseUtils.getResetType(limitedUse);
+    let maxUses = LimitedUseUtils.deriveMaxUses(
+      limitedUse,
+      abilityLookup,
+      ruleData,
+      proficiencyBonus
+    );
+    let numberUsed = LimitedUseUtils.getNumberUsed(limitedUse);
+    let totalSlots = Math.max(maxUses, numberUsed);
+
+    let usagesNode: React.ReactNode;
+    let extraNode: React.ReactNode;
+    if (totalSlots >= largeLimitedUseAmount) {
+      usagesNode = maxUses;
+      extraNode = this.renderLargeAmountSlotPool();
+    } else if (maxUses === -1) {
+      usagesNode = "Unlimited";
+    } else {
+      usagesNode = this.renderSmallAmountSlotPool();
+    }
+
+    let resetNode: React.ReactNode;
+    if (
+      resetType !== Constants.LimitedUseResetTypeEnum.SHORT_REST &&
+      resetType !== Constants.LimitedUseResetTypeEnum.LONG_REST
+    ) {
+      resetNode = "Special";
+    } else {
+      resetNode = RuleDataUtils.getLimitedUseResetTypeName(resetType, ruleData);
+    }
+
+    return (
+      <React.Fragment>
+        <div
+          className={`ct-feature-snippet__limited-use ${
+            theme.isDarkMode ? "ct-feature-snippet__limited-use--dark-mode" : ""
+          }`}
+        >
+          <div className="ct-feature-snippet__limited-use-usages">
+            {usagesNode}
+          </div>
+          <div className="ct-feature-snippet__limited-use-sep">/</div>
+          <div className="ct-feature-snippet__limited-use-reset">
+            {resetNode}
+          </div>
+        </div>
+        {extraNode && (
+          <div className="ct-feature-snippet__limited-use-extra">
+            {extraNode}
+          </div>
+        )}
+      </React.Fragment>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetLimitedUse/index.ts b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetLimitedUse/index.ts
new file mode 100644
index 0000000..7c884a1
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetLimitedUse/index.ts
@@ -0,0 +1,4 @@
+import FeatureSnippetLimitedUse from "./FeatureSnippetLimitedUse";
+
+export default FeatureSnippetLimitedUse;
+export { FeatureSnippetLimitedUse };
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetOption/FeatureSnippetOption.tsx b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetOption/FeatureSnippetOption.tsx
new file mode 100644
index 0000000..5213440
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetOption/FeatureSnippetOption.tsx
@@ -0,0 +1,170 @@
+import React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { Snippet } from "@dndbeyond/character-components/es";
+import {
+  AbilityLookup,
+  CharacterTheme,
+  DataOriginBaseAction,
+  DataOriginRefData,
+  Option,
+  OptionUtils,
+  RuleData,
+  SnippetData,
+  SourceData,
+  Spell,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { FeatureSnippetActions } from "../FeatureSnippetActions";
+import { FeatureSnippetSpells } from "../FeatureSnippetSpells";
+
+interface Props {
+  option: Option;
+
+  onActionClick?: (action: DataOriginBaseAction) => void;
+  onActionUseSet?: (action: DataOriginBaseAction, uses: number) => void;
+  onSpellClick?: (spell: Spell) => void;
+  onSpellUseSet?: (spell: Spell, uses: number) => void;
+  onOptionClick?: () => void;
+
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  sourceDataLookup: Record<number, SourceData>;
+  dataOriginRefData: DataOriginRefData;
+
+  snippetData: SnippetData;
+  classLevel?: number;
+
+  showDescription: boolean;
+  isInteractive: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+export default class FeatureSnippetOption extends React.PureComponent<Props> {
+  static defaultProps = {
+    showDescription: false,
+  };
+
+  handleOptionClick = (evt: React.MouseEvent): void => {
+    const { onOptionClick } = this.props;
+
+    if (onOptionClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onOptionClick();
+    }
+  };
+
+  render() {
+    const {
+      option,
+      snippetData,
+      classLevel,
+      abilityLookup,
+      ruleData,
+      sourceDataLookup,
+      dataOriginRefData,
+      onActionUseSet,
+      onActionClick,
+      onSpellClick,
+      onSpellUseSet,
+      showDescription,
+      isInteractive,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    let sourceId = OptionUtils.getSourceId(option);
+    let sourcePage = OptionUtils.getSourcePage(option);
+    let name = OptionUtils.getName(option);
+    let content: string | null = showDescription
+      ? OptionUtils.getDescription(option)
+      : OptionUtils.getSnippet(option);
+
+    const levelScale = OptionUtils.getLevelScale(option);
+    const actions = OptionUtils.getActions(option);
+    const spells = OptionUtils.getSpells(option);
+
+    let metaItems: Array<React.ReactNode> = [];
+    let sourceNode: React.ReactNode;
+    if (sourceId && sourcePage) {
+      let source = sourceDataLookup[sourceId];
+      // TODO should use GameRulesSourceAbbr
+      sourceNode = (
+        <span className="ct-feature-snippet__source">
+          <Tooltip
+            isDarkMode={theme.isDarkMode}
+            title={source.description ? source.description : ""}
+          >
+            <span className="ct-feature-snippet__heading-source-abbr">
+              {source.name}
+            </span>
+            {sourcePage && (
+              <span className="ct-feature-snippet__heading-source-page">
+                {sourcePage}
+              </span>
+            )}
+          </Tooltip>
+        </span>
+      );
+      metaItems.push(sourceNode);
+    }
+
+    return (
+      <div
+        className="ct-feature-snippet__option"
+        onClick={this.handleOptionClick}
+      >
+        <div className="ct-feature-snippet__heading">
+          {name}
+          <span className="ct-feature-snippet__meta">
+            {metaItems.map((metaItem, idx) => (
+              <span className="ct-feature-snippet__meta-item" key={idx}>
+                {metaItem}
+              </span>
+            ))}
+          </span>
+        </div>
+        {content && (
+          <div className="ct-feature-snippet__option-content">
+            <Snippet
+              snippetData={snippetData}
+              classLevel={classLevel}
+              parseSnippet={!showDescription}
+              proficiencyBonus={proficiencyBonus}
+              theme={theme}
+              levelScale={levelScale}
+            >
+              {content}
+            </Snippet>
+          </div>
+        )}
+        {(actions.length > 0 || spells.length > 0) && (
+          <div className="ct-feature-snippet__extra">
+            <FeatureSnippetActions
+              actions={actions}
+              abilityLookup={abilityLookup}
+              ruleData={ruleData}
+              onActionUseSet={onActionUseSet}
+              onActionClick={onActionClick}
+              isInteractive={isInteractive}
+              proficiencyBonus={proficiencyBonus}
+              theme={theme}
+            />
+            <FeatureSnippetSpells
+              spells={spells}
+              abilityLookup={abilityLookup}
+              ruleData={ruleData}
+              onSpellUseSet={onSpellUseSet}
+              onSpellClick={onSpellClick}
+              isInteractive={isInteractive}
+              dataOriginRefData={dataOriginRefData}
+              proficiencyBonus={proficiencyBonus}
+              theme={theme}
+            />
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetOption/index.ts b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetOption/index.ts
new file mode 100644
index 0000000..6cbc625
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetOption/index.ts
@@ -0,0 +1,4 @@
+import FeatureSnippetOption from "./FeatureSnippetOption";
+
+export default FeatureSnippetOption;
+export { FeatureSnippetOption };
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetSpells/FeatureSnippetSpells.tsx b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetSpells/FeatureSnippetSpells.tsx
new file mode 100644
index 0000000..2d6dba5
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetSpells/FeatureSnippetSpells.tsx
@@ -0,0 +1,124 @@
+import { orderBy } from "lodash";
+import React from "react";
+
+import {
+  AbilityLookup,
+  BaseSpell,
+  CharacterTheme,
+  DataOriginRefData,
+  RuleData,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { SpellName } from "~/components/SpellName";
+
+import { FeatureSnippetLimitedUse } from "../FeatureSnippetLimitedUse";
+
+interface Props {
+  spells?: Array<BaseSpell>;
+  layoutType: "list" | "compact";
+
+  onSpellUseSet?: (spell: BaseSpell, uses: number) => void;
+  onSpellClick?: (spell: BaseSpell) => void;
+
+  dataOriginRefData: DataOriginRefData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  isInteractive: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+export default class FeatureSnippetSpells extends React.PureComponent<Props> {
+  static defaultProps = {
+    layoutType: "list",
+  };
+
+  handleSpellUseSet = (spell: BaseSpell, uses: number): void => {
+    const { onSpellUseSet } = this.props;
+
+    if (onSpellUseSet) {
+      onSpellUseSet(spell, uses);
+    }
+  };
+
+  handleSpellClick = (spell: BaseSpell, evt: React.MouseEvent): void => {
+    const { onSpellClick } = this.props;
+
+    if (onSpellClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onSpellClick(spell);
+    }
+  };
+
+  render() {
+    const {
+      spells,
+      ruleData,
+      abilityLookup,
+      layoutType,
+      isInteractive,
+      dataOriginRefData,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    if (!spells || !spells.length) {
+      return null;
+    }
+
+    let orderedSpells = orderBy(
+      spells,
+      [
+        (spell) => SpellUtils.getLevel(spell),
+        (spell) => SpellUtils.getName(spell),
+      ],
+      ["asc", "asc"]
+    );
+
+    let classNames: Array<string> = [
+      "ct-feature-snippet__spells",
+      `ct-feature-snippet__spells--layout-${layoutType}`,
+    ];
+    if (theme?.isDarkMode) {
+      classNames.push(`ct-feature-snippet__spells--dark-mode`);
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        {orderedSpells.map((spell, idx) => (
+          <div
+            className="ct-feature-snippet__spell"
+            key={SpellUtils.getUniqueKey(spell)}
+          >
+            <div
+              className="ct-feature-snippet__spell-summary"
+              onClick={this.handleSpellClick.bind(this, spell)}
+            >
+              <SpellName
+                spell={spell}
+                showLegacy={true}
+                dataOriginRefData={dataOriginRefData}
+              />
+            </div>
+            {layoutType !== "compact" && !SpellUtils.isCantrip(spell) && (
+              <FeatureSnippetLimitedUse
+                component={spell}
+                theme={theme}
+                limitedUse={SpellUtils.getLimitedUse(spell)}
+                onUseSet={this.handleSpellUseSet}
+                abilityLookup={abilityLookup}
+                ruleData={ruleData}
+                isInteractive={isInteractive}
+                proficiencyBonus={proficiencyBonus}
+              />
+            )}
+            {layoutType === "compact" && idx + 1 < orderedSpells.length && (
+              <span className="ct-feature-snippet__spell-sep">,</span>
+            )}
+          </div>
+        ))}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetSpells/index.ts b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetSpells/index.ts
new file mode 100644
index 0000000..3760835
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/FeatureSnippetSpells/index.ts
@@ -0,0 +1,4 @@
+import FeatureSnippetSpells from "./FeatureSnippetSpells";
+
+export default FeatureSnippetSpells;
+export { FeatureSnippetSpells };
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/SpeciesTraitFeatureSnippet/SpeciesTraitFeatureSnippet.tsx b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/SpeciesTraitFeatureSnippet/SpeciesTraitFeatureSnippet.tsx
new file mode 100644
index 0000000..a7e518a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/SpeciesTraitFeatureSnippet/SpeciesTraitFeatureSnippet.tsx
@@ -0,0 +1,117 @@
+import React from "react";
+import { RacialTraitAccessors } from "@dndbeyond/character-rules-engine/es/engine/RacialTrait";
+import {
+  AbilityLookup,
+  BaseFeat,
+  DataOriginBaseAction,
+  DataOriginRefData,
+  DataOriginSpell,
+  RacialTrait,
+  RacialTraitUtils,
+  RuleData,
+  SnippetData,
+  AccessUtils,
+  CharacterTheme,
+  FeatManager,
+  CharacterFeaturesManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+
+import { DataOriginTypeEnum } from "~/constants";
+import { FeatureSnippet } from "~/subApps/sheet/components/FeatureSnippet";
+
+import FeatFeatureSnippet from "../FeatFeatureSnippet";
+
+interface Props {
+  speciesTrait: RacialTrait;
+  extraMeta: Array<string>;
+  onActionClick?: (action: DataOriginBaseAction) => void;
+  onActionUseSet?: (action: DataOriginBaseAction, uses: number) => void;
+  onSpellClick?: (spell: DataOriginSpell) => void;
+  onSpellUseSet?: (spell: DataOriginSpell, uses: number) => void;
+  onFeatureClick?: (feature: RacialTrait) => void;
+  showHeader?: boolean;
+  showDescription?: boolean;
+  feats: Array<BaseFeat>;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  onFeatClick: (feat: FeatManager) => void;
+  featuresManager: CharacterFeaturesManager;
+}
+export default class SpeciesTraitFeatureSnippet extends React.PureComponent<Props> {
+  static defaultProps = {
+    extraMeta: [],
+    showDescription: false,
+  };
+
+  handleFeatureClick = (): void => {
+    const { speciesTrait, onFeatureClick } = this.props;
+
+    if (onFeatureClick) {
+      onFeatureClick(speciesTrait);
+    }
+  };
+
+  renderDescription = (): React.ReactNode => {
+    const { speciesTrait, showDescription } = this.props;
+
+    const description: string | null = AccessUtils.isAccessible(
+      RacialTraitUtils.getAccessType(speciesTrait)
+    )
+      ? RacialTraitUtils.getDescription(speciesTrait)
+      : "Check out the Marketplace to unlock this Species Trait.";
+
+    return showDescription
+      ? description
+      : RacialTraitUtils.getSnippet(speciesTrait);
+  };
+
+  render() {
+    const {
+      speciesTrait,
+      onFeatureClick,
+      showDescription,
+      featuresManager,
+      onFeatClick,
+      ...restProps
+    } = this.props;
+
+    const feats = featuresManager.getDataOriginOnlyFeatsByPrimary(
+      DataOriginTypeEnum.RACE,
+      `${RacialTraitAccessors.getId(speciesTrait)}`
+    );
+
+    return (
+      <>
+        <FeatureSnippet
+          {...restProps}
+          heading={RacialTraitUtils.getName(speciesTrait)}
+          className="ct-feature-snippet--racial-trait"
+          actions={RacialTraitUtils.getActions(speciesTrait)}
+          options={RacialTraitUtils.getOptions(speciesTrait)}
+          choices={RacialTraitUtils.getChoices(speciesTrait)}
+          spells={RacialTraitUtils.getSpells(speciesTrait)}
+          sourceId={RacialTraitUtils.getSourceId(speciesTrait)}
+          sourcePage={RacialTraitUtils.getSourcePage(speciesTrait)}
+          onFeatureClick={this.handleFeatureClick}
+          showDescription={showDescription}
+        >
+          {this.renderDescription()}
+        </FeatureSnippet>
+        {feats.map((feat) => (
+          <FeatFeatureSnippet
+            {...restProps}
+            key={feat.getId()}
+            feat={feat}
+            onFeatureClick={onFeatClick}
+          />
+        ))}
+      </>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/SpeciesTraitFeatureSnippet/index.ts b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/SpeciesTraitFeatureSnippet/index.ts
new file mode 100644
index 0000000..4291822
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/FeatureSnippet/SpeciesTraitFeatureSnippet/index.ts
@@ -0,0 +1,4 @@
+import SpeciesTraitFeatureSnippet from "./SpeciesTraitFeatureSnippet";
+
+export default SpeciesTraitFeatureSnippet;
+export { SpeciesTraitFeatureSnippet };
diff --git a/ddb_main/tools/js/CharacterSheet/components/Infusions/Infusions.tsx b/ddb_main/tools/js/CharacterSheet/components/Infusions/Infusions.tsx
new file mode 100644
index 0000000..810b38d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/Infusions/Infusions.tsx
@@ -0,0 +1,302 @@
+import { keyBy } from "lodash";
+import * as React from "react";
+
+import {
+  ItemPreview,
+  Snippet,
+  CreaturePreview,
+} from "@dndbeyond/character-components/es";
+import {
+  AccessUtils,
+  ClassUtils,
+  Constants,
+  Creature,
+  CreatureLookup,
+  CreatureUtils,
+  HelperUtils,
+  Infusion,
+  InfusionChoice,
+  InfusionChoiceUtils,
+  InfusionModifierDataContract,
+  InfusionUtils,
+  InventoryLookup,
+  Item,
+  ItemUtils,
+  KnownInfusionUtils,
+  RuleData,
+  SnippetData,
+  Hack__BaseCharClass,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  inventory: Array<Item>;
+  creatures: Array<Creature>;
+  infusionChoices: Array<InfusionChoice>;
+  proficiencyBonus: number;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  isReadonly: boolean;
+  isMobile: boolean;
+  theme: CharacterTheme;
+
+  onInfusionChoiceShow?: (infusionChoice: InfusionChoice) => void;
+  onItemShow?: (item: Item) => void;
+  onCreatureShow?: (creature: Creature) => void;
+}
+interface State {
+  inventoryLookup: InventoryLookup;
+  creatureLookup: CreatureLookup;
+}
+export class Infusions extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    isReadonly: false,
+    isMobile: false,
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      inventoryLookup: keyBy(props.inventory, (item) =>
+        ItemUtils.getMappingId(item)
+      ),
+      creatureLookup: keyBy(props.creatures, (creature) =>
+        CreatureUtils.getMappingId(creature)
+      ),
+    };
+  }
+
+  componentDidUpdate(prevProps, prevState, snapshot) {
+    if (
+      prevProps.inventory !== this.props.inventory ||
+      prevProps.creatures !== this.props.creatures
+    ) {
+      this.setState({
+        inventoryLookup: keyBy(this.props.inventory, (item) =>
+          ItemUtils.getMappingId(item)
+        ),
+        creatureLookup: keyBy(this.props.creatures, (creature) =>
+          CreatureUtils.getMappingId(creature)
+        ),
+      });
+    }
+  }
+
+  handleItemClick = (item: Item): void => {
+    const { onItemShow } = this.props;
+
+    if (onItemShow) {
+      onItemShow(item);
+    }
+  };
+
+  handleCreatureClick = (creature: Creature): void => {
+    const { onCreatureShow } = this.props;
+
+    if (onCreatureShow) {
+      onCreatureShow(creature);
+    }
+  };
+
+  handleInfusionClick = (
+    infusionChoice: InfusionChoice,
+    evt: React.MouseEvent
+  ): void => {
+    const { onInfusionChoiceShow } = this.props;
+
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    if (onInfusionChoiceShow) {
+      onInfusionChoiceShow(infusionChoice);
+    }
+  };
+
+  renderDescription = (
+    simulatedInfusion: Infusion,
+    infusionChoice: InfusionChoice,
+    selectedModifierData: InfusionModifierDataContract | null
+  ): React.ReactNode => {
+    const { snippetData, proficiencyBonus } = this.props;
+
+    if (
+      AccessUtils.isAccessible(InfusionUtils.getAccessType(simulatedInfusion))
+    ) {
+      let classLevel: number | null = selectedModifierData?.value ?? null;
+      const dataOriginType =
+        InfusionChoiceUtils.getDataOriginType(infusionChoice);
+
+      if (
+        dataOriginType === Constants.DataOriginTypeEnum.CLASS_FEATURE &&
+        !classLevel
+      ) {
+        const dataOrigin = InfusionChoiceUtils.getDataOrigin(infusionChoice);
+        classLevel = ClassUtils.getLevel(
+          dataOrigin.parent as Hack__BaseCharClass
+        );
+      }
+
+      return (
+        <Snippet
+          snippetData={snippetData}
+          classLevel={classLevel}
+          proficiencyBonus={proficiencyBonus}
+        >
+          {InfusionUtils.getSnippet(simulatedInfusion)}
+        </Snippet>
+      );
+    }
+
+    return (
+      <div className="ct-infusions__infusion-empty">
+        Check out the Marketplace to unlock this infusion.
+      </div>
+    );
+  };
+
+  renderInfusions = (): React.ReactNode => {
+    const { inventoryLookup, creatureLookup } = this.state;
+    const { infusionChoices, ruleData, theme } = this.props;
+
+    return (
+      <React.Fragment>
+        {infusionChoices.map((infusionChoice) => {
+          const knownInfusion =
+            InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+
+          if (knownInfusion === null) {
+            return null;
+          }
+
+          const simulatedInfusion =
+            KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+
+          if (simulatedInfusion === null) {
+            return null;
+          }
+
+          const infusion = InfusionChoiceUtils.getInfusion(infusionChoice);
+          const infusionType = InfusionUtils.getType(simulatedInfusion);
+
+          let item: Item | null = null;
+          let creature: Creature | null = null;
+          let selectedModifierData: InfusionModifierDataContract | null = null;
+          if (infusion) {
+            let inventoryMappingId =
+              InfusionUtils.getInventoryMappingId(infusion);
+            item = HelperUtils.lookupDataOrFallback(
+              inventoryLookup,
+              inventoryMappingId
+            );
+            let creatureMappingId =
+              InfusionUtils.getCreatureMappingId(infusion);
+            if (creatureMappingId !== null) {
+              creature = HelperUtils.lookupDataOrFallback(
+                creatureLookup,
+                creatureMappingId
+              );
+            }
+            selectedModifierData =
+              InfusionUtils.getSelectedModifierData(infusion);
+          }
+
+          let itemNode: React.ReactNode;
+          if (item) {
+            itemNode = (
+              <div className="ct-infusions__infusion-item">
+                <ItemPreview
+                  theme={theme}
+                  item={item}
+                  onClick={this.handleItemClick}
+                />
+              </div>
+            );
+          } else {
+            itemNode = (
+              <div className="ct-infusions__infusion-empty">
+                No item infused
+              </div>
+            );
+          }
+
+          let creatureNode: React.ReactNode;
+          if (creature) {
+            creatureNode = (
+              <div className="ct-infusions__infusion-item">
+                <CreaturePreview
+                  creature={creature}
+                  ruleData={ruleData}
+                  onClick={this.handleCreatureClick}
+                />
+              </div>
+            );
+          }
+
+          let selectedModifierDataNode: React.ReactNode;
+          if (selectedModifierData && selectedModifierData.name) {
+            selectedModifierDataNode = (
+              <div className="ct-infusions__infusion-item">
+                {selectedModifierData.name}
+              </div>
+            );
+          }
+
+          let infusionName = InfusionUtils.getName(simulatedInfusion);
+          let infusionNameExtraNode: React.ReactNode;
+          if (infusionType === Constants.InfusionTypeEnum.REPLICATE) {
+            let itemName = KnownInfusionUtils.getItemName(knownInfusion);
+            if (itemName) {
+              infusionNameExtraNode = `: ${itemName}`;
+            }
+          }
+
+          const choiceKey = InfusionChoiceUtils.getKey(infusionChoice);
+          return (
+            <div
+              className="ct-infusions__infusion"
+              key={choiceKey === null ? "" : choiceKey}
+              onClick={this.handleInfusionClick.bind(this, infusionChoice)}
+            >
+              <div className="ct-infusions__infusion-header">
+                {infusionName}
+                {infusionNameExtraNode}
+              </div>
+              <div className="ct-infusions__infusion-content">
+                <div className="ct-infusions__infusion-description">
+                  {this.renderDescription(
+                    simulatedInfusion,
+                    infusionChoice,
+                    selectedModifierData
+                  )}
+                </div>
+                <div className="ct-infusions__infusion-items">
+                  {itemNode}
+                  {creatureNode}
+                  {selectedModifierDataNode}
+                </div>
+              </div>
+            </div>
+          );
+        })}
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    const { infusionChoices } = this.props;
+
+    let contentNode: React.ReactNode = (
+      <div className="ct-infusions__empty">
+        No infusions choices have been made for this character
+      </div>
+    );
+    if (infusionChoices.length > 0) {
+      contentNode = this.renderInfusions();
+    }
+
+    return <div className="ct-infusions">{contentNode}</div>;
+  }
+}
+
+export default Infusions;
diff --git a/ddb_main/tools/js/CharacterSheet/components/Infusions/index.ts b/ddb_main/tools/js/CharacterSheet/components/Infusions/index.ts
new file mode 100644
index 0000000..e1cde51
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/Infusions/index.ts
@@ -0,0 +1,4 @@
+import Infusions from "./Infusions";
+
+export default Infusions;
+export { Infusions };
diff --git a/ddb_main/tools/js/CharacterSheet/components/InvalidCharacter/InvalidCharacter.tsx b/ddb_main/tools/js/CharacterSheet/components/InvalidCharacter/InvalidCharacter.tsx
new file mode 100644
index 0000000..55c91f9
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InvalidCharacter/InvalidCharacter.tsx
@@ -0,0 +1,44 @@
+import { FC } from "react";
+
+import { BuilderLinkButton } from "../../../Shared/components/common/LinkButton";
+
+interface InvalidCharacterProps {
+  builderUrl: string;
+  isReadonly: boolean;
+}
+
+export const InvalidCharacter: FC<InvalidCharacterProps> = ({
+  builderUrl,
+  isReadonly,
+}) => {
+  return (
+    <div className="ct-invalid-character">
+      <h2>Character Not Ready!</h2>
+
+      <p>
+        The current character is not accessible because it is missing either a{" "}
+        <strong>Species</strong>, <strong>Class</strong> or{" "}
+        <strong>Ability Scores</strong>.
+      </p>
+
+      {!isReadonly && (
+        <>
+          <p>
+            Return to the character builder to complete the character creation
+            process.
+          </p>
+
+          <p>
+            <BuilderLinkButton
+              url={builderUrl}
+              className="ct-invalid-character__button"
+              size="oversized"
+            >
+              Character Builder
+            </BuilderLinkButton>
+          </p>
+        </>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilter.tsx
new file mode 100644
index 0000000..7742e0d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilter.tsx
@@ -0,0 +1,654 @@
+import { orderBy } from "lodash";
+import React from "react";
+
+import {
+  DarkFilterSvg,
+  ThemedFilterSvg,
+  LightFilterSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  Constants,
+  HtmlSelectOption,
+  Item,
+  ItemUtils,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { FilterUtils } from "../../../Shared/utils";
+import InventoryFilterArrayFilter from "./InventoryFilterArrayFilter";
+import InventoryFilterExclusiveCheckboxFilter from "./InventoryFilterExclusiveCheckboxFilter";
+
+interface Props {
+  inventory: Array<Item>;
+  partyInventory: Array<Item>;
+  callout?: React.ReactNode;
+  ruleData: RuleData;
+  onDataUpdate: (filterData: any) => void; //TODO type filterData
+  theme: CharacterTheme;
+}
+interface DefaultInventoryFilterState {
+  filterQuery: string;
+  filterTypes: Array<number>;
+  filterRarities: Array<string>;
+  filterTags: Array<string>;
+  filterRanged: boolean | null;
+}
+interface State extends DefaultInventoryFilterState {
+  filteredInventory: Array<Item>;
+  filteredPartyInventory: Array<Item>;
+  showAdvancedFilters: boolean;
+}
+export default class InventoryFilter extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      filteredInventory: this.getInventory(props),
+      filteredPartyInventory: this.getPartyInventory(props),
+      filterQuery: "",
+      filterTypes: [],
+      filterRarities: [],
+      filterTags: [],
+      filterRanged: null,
+      showAdvancedFilters: false,
+    };
+  }
+
+  componentDidMount() {
+    this.handleDataUpdate();
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { inventory, partyInventory } = this.props;
+
+    if (
+      inventory !== prevProps.inventory ||
+      partyInventory !== prevProps.partyInventory
+    ) {
+      let inventory = this.filterItems(
+        this.props,
+        this.getFilters(prevState),
+        this.getInventory(this.props)
+      );
+      let partyInventory = this.filterItems(
+        this.props,
+        this.getFilters(prevState),
+        this.getPartyInventory(this.props)
+      );
+      this.setState(
+        {
+          filteredInventory: inventory,
+          filteredPartyInventory: partyInventory,
+        },
+        this.handleDataUpdate
+      );
+    }
+  }
+
+  getFilters = (state: State): DefaultInventoryFilterState => {
+    const {
+      filterQuery,
+      filterTypes,
+      filterRarities,
+      filterTags,
+      filterRanged,
+    } = state;
+    return {
+      filterQuery,
+      filterTypes,
+      filterRarities,
+      filterTags,
+      filterRanged,
+    };
+  };
+
+  filterItems = (
+    props: Props,
+    filters: DefaultInventoryFilterState,
+    inventory: Array<Item>
+  ): Array<Item> => {
+    const {
+      filterQuery,
+      filterTypes,
+      filterRarities,
+      filterTags,
+      filterRanged,
+    } = filters;
+
+    return inventory.filter((item) => {
+      if (
+        filterQuery &&
+        !FilterUtils.doesQueryMatchData(filterQuery, ItemUtils.getName(item))
+      ) {
+        return false;
+      }
+
+      if (filterTags.length) {
+        let matches: boolean = false;
+        let tags = ItemUtils.getTags(item);
+        tags.forEach((tag) => {
+          if (!matches && filterTags.includes(tag)) {
+            matches = true;
+          }
+        });
+        if (!matches) {
+          return false;
+        }
+      }
+
+      if (filterTypes.length) {
+        if (!filterTypes.includes(ItemUtils.getBaseTypeId(item))) {
+          return false;
+        }
+      }
+
+      if (filterRarities.length) {
+        let rarity = ItemUtils.getRarity(item);
+        if (rarity === null || !filterRarities.includes(rarity)) {
+          return false;
+        }
+      }
+
+      if (filterRanged === true) {
+        if (
+          ItemUtils.getAttackType(item) !== Constants.AttackTypeRangeEnum.RANGED
+        ) {
+          return false;
+        }
+      } else if (filterRanged === false) {
+        if (
+          ItemUtils.getAttackType(item) !== Constants.AttackTypeRangeEnum.MELEE
+        ) {
+          return false;
+        }
+      }
+
+      return true;
+    });
+  };
+
+  getFilterCount = (): number => {
+    const { filterTypes, filterRarities, filterTags, filterRanged } =
+      this.state;
+
+    let count: number = 0;
+    count += filterTags.length;
+    count += filterTypes.length;
+    count += filterRarities.length;
+    count += filterRanged === null ? 0 : 1;
+    return count;
+  };
+
+  getTagOptions = (tags: Array<string>): Array<HtmlSelectOption> => {
+    return tags.sort().map((tag) => ({ label: tag, value: tag }));
+  };
+
+  getRarityOptions = (rarities: Array<string>): Array<HtmlSelectOption> => {
+    return rarities.sort().map((rarity) => {
+      return {
+        label: rarity,
+        value: rarity,
+      };
+    });
+  };
+
+  getTypeOptions = (types: Array<number>): Array<HtmlSelectOption> => {
+    return orderBy(
+      types.map((type) => {
+        return {
+          label:
+            type === 0 ? "Custom" : ItemUtils.deriveBaseTypeNameFromId(type),
+          value: type,
+        };
+      }),
+      "label"
+    );
+  };
+
+  getInventory = (props: Props): Array<Item> => {
+    return [...props.inventory];
+  };
+
+  getPartyInventory = (props: Props): Array<Item> => {
+    return [...props.partyInventory];
+  };
+
+  isFiltering = (): boolean => {
+    const { filterQuery } = this.state;
+
+    const filterCount = this.getFilterCount();
+    return filterCount > 0 || !!filterQuery;
+  };
+
+  handleDataUpdate = (): void => {
+    const { onDataUpdate } = this.props;
+
+    if (onDataUpdate) {
+      onDataUpdate({
+        ...this.state,
+        filterCount: this.getFilterCount(),
+        isFiltering: this.isFiltering(),
+      });
+    }
+  };
+
+  handleFilterClear = (
+    propertyKey: keyof State,
+    resetState: Array<string> | Array<number> | null
+  ): void => {
+    this.setState((prevState: State) => {
+      let inventory = this.filterItems(
+        this.props,
+        {
+          ...this.getFilters(prevState),
+          [propertyKey]: resetState,
+        },
+        this.getInventory(this.props)
+      );
+      let partyInventory = this.filterItems(
+        this.props,
+        {
+          ...this.getFilters(prevState),
+          [propertyKey]: resetState,
+        },
+        this.getPartyInventory(this.props)
+      );
+      return {
+        ...prevState,
+        [propertyKey]: resetState,
+        filteredInventory: inventory,
+        filteredPartyInventory: partyInventory,
+      };
+    }, this.handleDataUpdate);
+  };
+
+  handleArrayFilterClear = (
+    propertyKey: keyof State,
+    evt: React.MouseEvent
+  ): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    this.handleFilterClear(propertyKey, []);
+  };
+
+  handleBoolFilterClear = (
+    propertyKey: keyof State,
+    evt: React.MouseEvent
+  ): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    this.handleFilterClear(propertyKey, null);
+  };
+
+  handleFiltersClear = (): void => {
+    const inventory = this.getInventory(this.props);
+    this.setState(
+      {
+        filteredInventory: inventory,
+        filterQuery: "",
+        filterTypes: [],
+        filterRarities: [],
+        filterTags: [],
+        filterRanged: null,
+      },
+      this.handleDataUpdate
+    );
+  };
+
+  handleQueryUpdate = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    let value = evt.target.value;
+    this.setState((prevState: State) => {
+      let inventory = this.filterItems(
+        this.props,
+        {
+          ...this.getFilters(prevState),
+          filterQuery: value,
+        },
+        this.getInventory(this.props)
+      );
+      let partyInventory = this.filterItems(
+        this.props,
+        {
+          ...this.getFilters(prevState),
+          filterQuery: value,
+        },
+        this.getPartyInventory(this.props)
+      );
+      return {
+        filterQuery: value,
+        filteredInventory: inventory,
+        filteredPartyInventory: partyInventory,
+      };
+    }, this.handleDataUpdate);
+  };
+
+  handleFilterAdvancedToggle = (): void => {
+    this.setState(
+      (prevState: State) => ({
+        showAdvancedFilters: !prevState.showAdvancedFilters,
+      }),
+      this.handleDataUpdate
+    );
+  };
+
+  //TODO get array key by filtering for array type
+  handleFilterArrayToggle = (
+    arrayKey: string,
+    value: string | number
+  ): void => {
+    this.setState((prevState: State) => {
+      let includesItem: boolean = prevState[arrayKey].includes(value);
+      let newFilterArray: Array<string> | Array<number> = [];
+      if (includesItem) {
+        newFilterArray = prevState[arrayKey].filter(
+          (filterTag) => filterTag !== value
+        );
+      } else {
+        newFilterArray = [...prevState[arrayKey], value];
+      }
+      let inventory = this.filterItems(
+        this.props,
+        {
+          ...this.getFilters(prevState),
+          [arrayKey]: newFilterArray,
+        },
+        this.getInventory(this.props)
+      );
+      let partyInventory = this.filterItems(
+        this.props,
+        {
+          ...this.getFilters(prevState),
+          [arrayKey]: newFilterArray,
+        },
+        this.getPartyInventory(this.props)
+      );
+      return {
+        ...prevState,
+        [arrayKey]: newFilterArray,
+        filteredInventory: inventory,
+        filteredPartyInventory: partyInventory,
+      };
+    }, this.handleDataUpdate);
+  };
+
+  handleExclusiveCheckboxFilterChange = (
+    propertyKey: keyof State,
+    value: boolean | null
+  ): void => {
+    this.setState((prevState: State) => {
+      let inventory = this.filterItems(
+        this.props,
+        {
+          ...this.getFilters(prevState),
+          [propertyKey]: value,
+        },
+        this.getInventory(this.props)
+      );
+      let partyInventory = this.filterItems(
+        this.props,
+        {
+          ...this.getFilters(prevState),
+          [propertyKey]: value,
+        },
+        this.getPartyInventory(this.props)
+      );
+      return {
+        ...prevState,
+        [propertyKey]: value,
+        filteredInventory: inventory,
+        filteredPartyInventory: partyInventory,
+      };
+    }, this.handleDataUpdate);
+  };
+
+  renderAdvancedFilters = (): React.ReactNode => {
+    const { filterTags, filterRarities, filterTypes, filterRanged } =
+      this.state;
+
+    const inventory = this.getInventory(this.props);
+
+    let uniqueTags = new Set<string>();
+    let uniqueRarities = new Set<string>();
+    let uniqueTypes = new Set<number>();
+    for (let i = 0; i < inventory.length; i++) {
+      let item = inventory[i];
+
+      let tags = ItemUtils.getTags(item);
+      for (let j = 0; j < tags.length; j++) {
+        uniqueTags.add(tags[j]);
+      }
+
+      let rarity = ItemUtils.getRarity(item);
+      if (rarity !== null) {
+        uniqueRarities.add(rarity);
+      }
+
+      uniqueTypes.add(ItemUtils.getBaseTypeId(item));
+    }
+
+    return (
+      <div className="ct-inventory-filter__adv-filters">
+        <InventoryFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Item Type"
+          propertyKey="filterTypes"
+          currentValues={filterTypes}
+          availableOptions={this.getTypeOptions(Array.from(uniqueTypes))}
+        />
+        <InventoryFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Tags"
+          propertyKey="filterTags"
+          currentValues={filterTags}
+          availableOptions={this.getTagOptions(Array.from(uniqueTags))}
+        />
+        <InventoryFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Rarity"
+          propertyKey="filterRarities"
+          currentValues={filterRarities}
+          availableOptions={this.getRarityOptions(Array.from(uniqueRarities))}
+        />
+        <InventoryFilterExclusiveCheckboxFilter
+          label="Attack Type"
+          onUpdate={this.handleExclusiveCheckboxFilterChange}
+          propertyKey="filterRanged"
+          value={filterRanged}
+          trueLabel="Ranged"
+          falseLabel="Melee"
+        />
+      </div>
+    );
+  };
+
+  renderFilterBarActiveArray = (
+    label: string,
+    options: Array<HtmlSelectOption>,
+    propertyKey: keyof State
+  ): React.ReactNode => {
+    return (
+      <div
+        className="ct-inventory-filter__active"
+        onClick={this.handleFilterAdvancedToggle}
+      >
+        <div className="ct-inventory-filter__active-label">{label}:</div>
+        <div className="ct-inventory-filter__active-value">
+          {options.map((option) => option.label).join(" or ")}
+        </div>
+        <div className="ct-inventory-filter__active-remove">
+          <div
+            className="ct-inventory-filter__active-remove-icon"
+            onClick={this.handleArrayFilterClear.bind(this, propertyKey)}
+          />
+        </div>
+      </div>
+    );
+  };
+
+  renderFilterBarActiveExclusiveCheckbox = (
+    label: string,
+    value: boolean,
+    propertyKey: keyof State,
+    trueLabel: string = "Yes",
+    falseLabel: string = "No"
+  ) => {
+    return (
+      <div
+        className="ct-inventory-filter__active"
+        onClick={this.handleFilterAdvancedToggle}
+      >
+        <div className="ct-inventory-filter__active-label">{label}:</div>
+        <div className="ct-inventory-filter__active-value">
+          {value ? trueLabel : falseLabel}
+        </div>
+        <div className="ct-inventory-filter__active-remove">
+          <div
+            className="ct-inventory-filter__active-remove-icon"
+            onClick={this.handleBoolFilterClear.bind(this, propertyKey)}
+          />
+        </div>
+      </div>
+    );
+  };
+
+  renderFilterBarActives = (): React.ReactNode => {
+    const { filterTags, filterRarities, filterTypes, filterRanged } =
+      this.state;
+
+    let activeNodes: Array<{ key: string; node: React.ReactNode }> = [];
+
+    if (filterTypes.length) {
+      activeNodes.push({
+        key: "filterTypes",
+        node: this.renderFilterBarActiveArray(
+          filterTypes.length === 1 ? "Type" : "Types",
+          this.getTypeOptions(filterTypes),
+          "filterTypes"
+        ),
+      });
+    }
+    if (filterTags.length) {
+      activeNodes.push({
+        key: "filterTags",
+        node: this.renderFilterBarActiveArray(
+          filterTags.length === 1 ? "Tag" : "Tags",
+          this.getTagOptions(filterTags),
+          "filterTags"
+        ),
+      });
+    }
+    if (filterRarities.length) {
+      activeNodes.push({
+        key: "filterRarities",
+        node: this.renderFilterBarActiveArray(
+          "Rarity",
+          this.getRarityOptions(filterRarities),
+          "filterRarities"
+        ),
+      });
+    }
+    if (filterRanged !== null) {
+      activeNodes.push({
+        key: "filterRanged",
+        node: this.renderFilterBarActiveExclusiveCheckbox(
+          "Attack Type",
+          filterRanged,
+          "filterRanged",
+          "Ranged",
+          "Melee"
+        ),
+      });
+    }
+
+    if (!activeNodes.length) {
+      return null;
+    }
+
+    return (
+      <div className="ct-inventory-filter__actives">
+        {activeNodes.map((activeNode) => (
+          <React.Fragment key={activeNode.key}>
+            {activeNode.node}
+          </React.Fragment>
+        ))}
+      </div>
+    );
+  };
+
+  render() {
+    const { filterQuery, showAdvancedFilters } = this.state;
+    const { callout, theme } = this.props;
+
+    const filterCount = this.getFilterCount();
+    const hasFilter = this.isFiltering();
+
+    let advancedClassNames: Array<string> = ["ct-inventory-filter__advanced"];
+    let FilterIcon: React.ComponentType<any> = theme.isDarkMode
+      ? LightFilterSvg
+      : DarkFilterSvg;
+    if (filterCount > 0) {
+      advancedClassNames.push("ct-inventory-filter__advanced--active");
+      FilterIcon = ThemedFilterSvg;
+    }
+
+    let classNames: Array<string> = ["ct-inventory-filter"];
+    if (showAdvancedFilters) {
+      classNames.push("ct-inventory-filter--show-advanced");
+    }
+    if (hasFilter) {
+      classNames.push("ct-inventory-filter--has-filter");
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ct-inventory-filter__interactions">
+          <div className="ct-inventory-filter__box">
+            {this.renderFilterBarActives()}
+            <div className="ct-inventory-filter__primary">
+              <div className="ct-inventory-filter__primary-group ct-inventory-filter__primary-group--first">
+                <div className="ct-inventory-filter__icon" />
+              </div>
+              <div className="ct-inventory-filter__field">
+                <input
+                  className="ct-inventory-filter__input"
+                  type="search"
+                  placeholder="Search Item Names, Types, Rarities, or Tags"
+                  value={filterQuery}
+                  onChange={this.handleQueryUpdate}
+                />
+              </div>
+              {hasFilter && (
+                <div
+                  className="ct-inventory-filter__clear"
+                  onClick={this.handleFiltersClear}
+                >
+                  Clear X
+                </div>
+              )}
+            </div>
+          </div>
+          <div
+            className={advancedClassNames.join(" ")}
+            onClick={this.handleFilterAdvancedToggle}
+          >
+            <FilterIcon theme={theme} />
+            {filterCount > 0 && (
+              <span className="ct-inventory-filter__advanced-callout">
+                {filterCount}
+              </span>
+            )}
+          </div>
+          {callout && (
+            <div className="ct-inventory-filter__callout">{callout}</div>
+          )}
+        </div>
+        {showAdvancedFilters && this.renderAdvancedFilters()}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilter/InventoryFilterAdvancedFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilter/InventoryFilterAdvancedFilter.tsx
new file mode 100644
index 0000000..5ac552b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilter/InventoryFilterAdvancedFilter.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class InventoryFilterAdvancedFilter extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-inventory-filter__adv-filter">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilter/index.ts
new file mode 100644
index 0000000..0f68ebe
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilter/index.ts
@@ -0,0 +1,4 @@
+import InventoryFilterAdvancedFilter from "./InventoryFilterAdvancedFilter";
+
+export default InventoryFilterAdvancedFilter;
+export { InventoryFilterAdvancedFilter };
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterLabel/InventoryFilterAdvancedFilterLabel.tsx b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterLabel/InventoryFilterAdvancedFilterLabel.tsx
new file mode 100644
index 0000000..504732b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterLabel/InventoryFilterAdvancedFilterLabel.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class InventoryFilterAdvancedFilterLabel extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-inventory-filter__adv-filter-label">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterLabel/index.ts b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterLabel/index.ts
new file mode 100644
index 0000000..0aa7d48
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterLabel/index.ts
@@ -0,0 +1,4 @@
+import InventoryFilterAdvancedFilterLabel from "./InventoryFilterAdvancedFilterLabel";
+
+export default InventoryFilterAdvancedFilterLabel;
+export { InventoryFilterAdvancedFilterLabel };
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOption/InventoryFilterAdvancedFilterOption.tsx b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOption/InventoryFilterAdvancedFilterOption.tsx
new file mode 100644
index 0000000..5ee3fa1
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOption/InventoryFilterAdvancedFilterOption.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class InventoryFilterAdvancedFilterOption extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-inventory-filter__adv-filter-option">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOption/index.ts b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOption/index.ts
new file mode 100644
index 0000000..992bb53
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOption/index.ts
@@ -0,0 +1,4 @@
+import InventoryFilterAdvancedFilterOption from "./InventoryFilterAdvancedFilterOption";
+
+export default InventoryFilterAdvancedFilterOption;
+export { InventoryFilterAdvancedFilterOption };
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOptions/InventoryFilterAdvancedFilterOptions.tsx b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOptions/InventoryFilterAdvancedFilterOptions.tsx
new file mode 100644
index 0000000..b5e6150
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOptions/InventoryFilterAdvancedFilterOptions.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class InventoryFilterAdvancedFilterOptions extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-inventory-filter__adv-filter-options">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOptions/index.ts b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOptions/index.ts
new file mode 100644
index 0000000..94de252
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterAdvancedFilterOptions/index.ts
@@ -0,0 +1,4 @@
+import InventoryFilterAdvancedFilterOptions from "./InventoryFilterAdvancedFilterOptions";
+
+export default InventoryFilterAdvancedFilterOptions;
+export { InventoryFilterAdvancedFilterOptions };
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterArrayFilter/InventoryFilterArrayFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterArrayFilter/InventoryFilterArrayFilter.tsx
new file mode 100644
index 0000000..2859fc8
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterArrayFilter/InventoryFilterArrayFilter.tsx
@@ -0,0 +1,63 @@
+import React from "react";
+
+import { HtmlSelectOption } from "@dndbeyond/character-rules-engine/es";
+
+import InventoryFilterAdvancedFilter from "../InventoryFilterAdvancedFilter";
+import InventoryFilterAdvancedFilterLabel from "../InventoryFilterAdvancedFilterLabel";
+import InventoryFilterAdvancedFilterOption from "../InventoryFilterAdvancedFilterOption";
+import InventoryFilterAdvancedFilterOptions from "../InventoryFilterAdvancedFilterOptions";
+
+interface Props {
+  propertyKey: string;
+  label: string;
+  currentValues: Array<string | number>;
+  availableOptions: Array<HtmlSelectOption>;
+  onUpdate: (propertyKey: string, value: string | number) => void;
+}
+export default class InventoryFilterArrayFilter extends React.PureComponent<Props> {
+  handleFilterArrayToggle = (
+    value: string | number,
+    evt: React.MouseEvent
+  ): void => {
+    const { onUpdate, propertyKey } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, value);
+    }
+  };
+
+  render() {
+    const { availableOptions, currentValues, label } = this.props;
+
+    return (
+      <InventoryFilterAdvancedFilter>
+        <InventoryFilterAdvancedFilterLabel>
+          {label}
+        </InventoryFilterAdvancedFilterLabel>
+        <InventoryFilterAdvancedFilterOptions>
+          {availableOptions.map((option) => {
+            let classNames: Array<String> = [
+              "ct-inventory-filter__adv-filter-button",
+            ];
+            if (currentValues.includes(option.value)) {
+              classNames.push("ct-inventory-filter__adv-filter-button--active");
+            }
+            return (
+              <InventoryFilterAdvancedFilterOption key={option.value}>
+                <span
+                  className={classNames.join(" ")}
+                  onClick={this.handleFilterArrayToggle.bind(
+                    this,
+                    option.value
+                  )}
+                >
+                  {option.label}
+                </span>
+              </InventoryFilterAdvancedFilterOption>
+            );
+          })}
+        </InventoryFilterAdvancedFilterOptions>
+      </InventoryFilterAdvancedFilter>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterArrayFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterArrayFilter/index.ts
new file mode 100644
index 0000000..c02d35d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterArrayFilter/index.ts
@@ -0,0 +1,4 @@
+import InventoryFilterArrayFilter from "./InventoryFilterArrayFilter";
+
+export default InventoryFilterArrayFilter;
+export { InventoryFilterArrayFilter };
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterExclusiveCheckboxFilter/InventoryFilterExclusiveCheckboxFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterExclusiveCheckboxFilter/InventoryFilterExclusiveCheckboxFilter.tsx
new file mode 100644
index 0000000..b8cceb1
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterExclusiveCheckboxFilter/InventoryFilterExclusiveCheckboxFilter.tsx
@@ -0,0 +1,126 @@
+import React from "react";
+
+import { Checkbox } from "@dndbeyond/character-components/es";
+
+import InventoryFilterAdvancedFilter from "../InventoryFilterAdvancedFilter";
+import InventoryFilterAdvancedFilterLabel from "../InventoryFilterAdvancedFilterLabel";
+import InventoryFilterAdvancedFilterOption from "../InventoryFilterAdvancedFilterOption";
+import InventoryFilterAdvancedFilterOptions from "../InventoryFilterAdvancedFilterOptions";
+
+interface Props {
+  propertyKey: string;
+  label: string;
+  value: boolean | null;
+  onUpdate: (propertyKey: string, value: boolean | null) => void;
+  trueLabel: string;
+  falseLabel: string;
+  nullLabel: string;
+}
+interface State {
+  value: boolean | null;
+}
+export default class InventoryFilterExclusiveCheckboxFilter extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    trueLabel: "Yes",
+    falseLabel: "No",
+    nullLabel: "Both",
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.value,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { value } = this.props;
+
+    if (value !== prevState.value) {
+      this.setState({
+        value,
+      });
+    }
+  }
+
+  handleUpdate = (value: boolean | null): void => {
+    const { onUpdate, propertyKey } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, value);
+    }
+    this.setState({
+      value,
+    });
+  };
+
+  render() {
+    const { value } = this.state;
+    const { label, trueLabel, falseLabel, nullLabel } = this.props;
+
+    return (
+      <InventoryFilterAdvancedFilter>
+        <InventoryFilterAdvancedFilterLabel>
+          {label}
+        </InventoryFilterAdvancedFilterLabel>
+        <InventoryFilterAdvancedFilterOptions>
+          <InventoryFilterAdvancedFilterOption>
+            <div className="ct-inventory-filter__adv-filter-checkbox">
+              <div className="ct-inventory-filter__adv-filter-checkbox-input">
+                <Checkbox
+                  onChange={this.handleUpdate.bind(this, true)}
+                  enabled={value === true}
+                />
+              </div>
+              <div
+                className="ct-inventory-filter__adv-filter-checkbox-label"
+                onClick={this.handleUpdate.bind(this, true)}
+              >
+                {trueLabel}
+              </div>
+            </div>
+          </InventoryFilterAdvancedFilterOption>
+          <InventoryFilterAdvancedFilterOption>
+            <div className="ct-inventory-filter__adv-filter-checkbox">
+              <div className="ct-inventory-filter__adv-filter-checkbox-input">
+                <Checkbox
+                  onChange={this.handleUpdate.bind(this, false)}
+                  enabled={value === false}
+                />
+              </div>
+              <div
+                className="ct-inventory-filter__adv-filter-checkbox-label"
+                onClick={this.handleUpdate.bind(this, false)}
+              >
+                {falseLabel}
+              </div>
+            </div>
+          </InventoryFilterAdvancedFilterOption>
+          <InventoryFilterAdvancedFilterOption>
+            <div className="ct-inventory-filter__adv-filter-checkbox">
+              <div className="ct-inventory-filter__adv-filter-checkbox-input">
+                <Checkbox
+                  onChange={this.handleUpdate.bind(this, null)}
+                  enabled={value === null}
+                />
+              </div>
+              <div
+                className="ct-inventory-filter__adv-filter-checkbox-label"
+                onClick={this.handleUpdate.bind(this, null)}
+              >
+                {nullLabel}
+              </div>
+            </div>
+          </InventoryFilterAdvancedFilterOption>
+        </InventoryFilterAdvancedFilterOptions>
+      </InventoryFilterAdvancedFilter>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterExclusiveCheckboxFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterExclusiveCheckboxFilter/index.ts
new file mode 100644
index 0000000..56682f3
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/InventoryFilterExclusiveCheckboxFilter/index.ts
@@ -0,0 +1,4 @@
+import InventoryFilterExclusiveCheckboxFilter from "./InventoryFilterExclusiveCheckboxFilter";
+
+export default InventoryFilterExclusiveCheckboxFilter;
+export { InventoryFilterExclusiveCheckboxFilter };
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/index.ts
new file mode 100644
index 0000000..4307fa3
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryFilter/index.ts
@@ -0,0 +1,18 @@
+import InventoryFilter from "./InventoryFilter";
+import InventoryFilterAdvancedFilter from "./InventoryFilterAdvancedFilter";
+import InventoryFilterAdvancedFilterLabel from "./InventoryFilterAdvancedFilterLabel";
+import InventoryFilterAdvancedFilterOption from "./InventoryFilterAdvancedFilterOption";
+import InventoryFilterAdvancedFilterOptions from "./InventoryFilterAdvancedFilterOptions";
+import InventoryFilterArrayFilter from "./InventoryFilterArrayFilter";
+import InventoryFilterExclusiveCheckboxFilter from "./InventoryFilterExclusiveCheckboxFilter";
+
+export default InventoryFilter;
+export {
+  InventoryFilter,
+  InventoryFilterAdvancedFilter,
+  InventoryFilterAdvancedFilterLabel,
+  InventoryFilterAdvancedFilterOption,
+  InventoryFilterAdvancedFilterOptions,
+  InventoryFilterArrayFilter,
+  InventoryFilterExclusiveCheckboxFilter,
+};
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryItem/InventoryItem.tsx b/ddb_main/tools/js/CharacterSheet/components/InventoryItem/InventoryItem.tsx
new file mode 100644
index 0000000..45cb7ea
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryItem/InventoryItem.tsx
@@ -0,0 +1,142 @@
+import React, { useContext } from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { NoteComponents } from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  ItemManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemName } from "~/components/ItemName";
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+import { ItemSlotManager } from "../../../Shared/components/ItemSlotManager";
+import { InventoryManagerContext } from "../../../Shared/managers/InventoryManagerContext";
+
+interface Props {
+  item: ItemManager;
+  onEquip?: () => void;
+  onUnequip?: () => void;
+  onItemShow?: (mappingId: number) => void;
+  className?: string;
+  showNotes?: boolean;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+export const InventoryItem: React.FC<Props> = ({
+  item,
+  onEquip,
+  onUnequip,
+  onItemShow,
+  className = "",
+  showNotes = true,
+  isReadonly,
+  theme,
+}) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+
+  const quantity = item.getQuantity();
+  const isStackable = item.isStackable();
+  const canEquip = inventoryManager.canEquipUnequipItem(item.item);
+  const isEquippedToCurrentCharacter = item.isEquippedToCurrentCharacter();
+  const isEquipped = item.isEquipped();
+  const weight = item.getWeight();
+  const cost = item.getCost();
+
+  return (
+    <div
+      className={`ct-inventory-item ${className}`}
+      onClick={(evt) => {
+        evt.nativeEvent.stopImmediatePropagation();
+        evt.stopPropagation();
+
+        if (onItemShow) {
+          onItemShow(item.getMappingId());
+        }
+      }}
+      role="button"
+      data-testid={`inventory-item-${item.getName()}`
+        .toLowerCase()
+        .replace(/\s/g, "-")}
+    >
+      <div className="ct-inventory-item__action">
+        <ItemSlotManager
+          isUsed={!!item.isEquipped()}
+          isReadonly={isReadonly}
+          canUse={canEquip}
+          onSet={(used) => {
+            //TODO use different component than SlotManager for equip/unequip
+            if (used === 0 && onUnequip) {
+              onUnequip();
+            }
+
+            if (used === 1 && onEquip) {
+              onEquip();
+            }
+          }}
+          theme={theme}
+          useTooltip={!!isEquipped && !isEquippedToCurrentCharacter}
+          tooltipTitle={`Equipped by ${item.getEquippedCharacterName()}`}
+        />
+      </div>
+      <div className="ct-inventory-item__name">
+        <div className="ct-inventory-item__heading">
+          <ItemName item={item.item} />
+        </div>
+        <div
+          className={`ct-inventory-item__meta ${
+            theme?.isDarkMode ? "ct-inventory-item__meta--dark-mode" : ""
+          }`}
+        >
+          {item.getMetaText().map((metaItem, idx) => (
+            <span className="ct-inventory-item__meta-item" key={idx}>
+              {metaItem}
+            </span>
+          ))}
+        </div>
+      </div>
+      <div className="ct-inventory-item__weight">
+        {weight ? (
+          <Tooltip title={`${weight} lb.`} isDarkMode={theme?.isDarkMode}>
+            <NumberDisplay type="weightInLb" number={weight} />
+          </Tooltip>
+        ) : (
+          "--"
+        )}
+      </div>
+      <div
+        className={`ct-inventory-item__quantity ${
+          theme?.isDarkMode ? "ct-inventory-item__quantity--dark-mode" : ""
+        }`}
+      >
+        {isStackable ? (
+          <Tooltip title={quantity.toString()} isDarkMode={theme?.isDarkMode}>
+            {quantity}
+          </Tooltip>
+        ) : (
+          "--"
+        )}
+      </div>
+      <div
+        className={`ct-inventory-item__cost ${
+          theme?.isDarkMode ? "ct-inventory-item__cost--dark-mode" : ""
+        }`}
+      >
+        {cost ? (
+          <Tooltip title={cost.toString()} isDarkMode={theme?.isDarkMode}>
+            {cost}
+          </Tooltip>
+        ) : (
+          "--"
+        )}
+      </div>
+      {showNotes && (
+        <div className="ct-inventory-item__notes">
+          <NoteComponents notes={item.getNotes()} theme={theme} />
+        </div>
+      )}
+    </div>
+  );
+};
+
+export default InventoryItem;
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryItem/index.ts b/ddb_main/tools/js/CharacterSheet/components/InventoryItem/index.ts
new file mode 100644
index 0000000..6bc6c20
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryItem/index.ts
@@ -0,0 +1,4 @@
+import InventoryItem from "./InventoryItem";
+
+export default InventoryItem;
+export { InventoryItem };
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryTableHeader/InventoryTableHeader.tsx b/ddb_main/tools/js/CharacterSheet/components/InventoryTableHeader/InventoryTableHeader.tsx
new file mode 100644
index 0000000..646e410
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryTableHeader/InventoryTableHeader.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+
+interface Props {
+  showNotes?: boolean;
+}
+export const InventoryTableHeader: React.FC<Props> = ({ showNotes = true }) => {
+  return (
+    <div className="ct-inventory__row-header">
+      <div className="ct-inventory__col ct-inventory__col--active">Active</div>
+      <div className="ct-inventory__col ct-inventory__col--name">Name</div>
+      <div className="ct-inventory__col ct-inventory__col--weight">Weight</div>
+      <div className="ct-inventory__col ct-inventory__col--qty">Qty</div>
+      <div className="ct-inventory__col ct-inventory__col--cost">Cost (gp)</div>
+      {showNotes && (
+        <div className="ct-inventory__col ct-inventory__col--notes">Notes</div>
+      )}
+    </div>
+  );
+};
+
+export default InventoryTableHeader;
diff --git a/ddb_main/tools/js/CharacterSheet/components/InventoryTableHeader/index.ts b/ddb_main/tools/js/CharacterSheet/components/InventoryTableHeader/index.ts
new file mode 100644
index 0000000..d913e14
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/InventoryTableHeader/index.ts
@@ -0,0 +1,4 @@
+import InventoryTableHeader from "./InventoryTableHeader";
+
+export default InventoryTableHeader;
+export { InventoryTableHeader };
diff --git a/ddb_main/tools/js/CharacterSheet/components/Lifestyle/Lifestyle.tsx b/ddb_main/tools/js/CharacterSheet/components/Lifestyle/Lifestyle.tsx
new file mode 100644
index 0000000..75f6b45
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/Lifestyle/Lifestyle.tsx
@@ -0,0 +1,67 @@
+import {
+  Collapsible,
+  TypeScriptUtils,
+} from "@dndbeyond/character-components/es";
+import {
+  HtmlSelectOption,
+  RuleDataUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import CurrencyPaneSelectEditor from "../../../Shared/containers/panes/CurrencyPane/CurrencyPaneSelectEditor";
+
+const Lifestyle = ({
+  lifestyle,
+  ruleData,
+  isReadonly,
+  handleLifestyleUpdate,
+}) => {
+  const lifestyleData = RuleDataUtils.getLifestyles(ruleData);
+  const lifestyleOptions: Array<HtmlSelectOption> = lifestyleData
+    .map((lifestyle) => {
+      if (lifestyle.id === null) {
+        return null;
+      }
+      return {
+        label: `${lifestyle.name} ${
+          lifestyle.cost === "-" ? "" : `(${lifestyle.cost})`
+        }`,
+        value: lifestyle.id,
+      };
+    })
+    .filter(TypeScriptUtils.isNotNullOrUndefined);
+
+  let lifestyleDescriptionNode: React.ReactNode;
+  if (lifestyle !== null) {
+    lifestyleDescriptionNode = lifestyle.description;
+  }
+
+  return (
+    <div className="ct-currency-pane__lifestyle">
+      <CurrencyPaneSelectEditor
+        label="Lifestyle Expenses"
+        options={lifestyleOptions}
+        defaultValue={lifestyle === null ? null : lifestyle.id}
+        propertyKey="lifestyleId"
+        onUpdate={handleLifestyleUpdate}
+        isReadonly={isReadonly}
+      />
+      {lifestyleDescriptionNode && (
+        <Collapsible
+          className={"ct-currency-pane__lifestyle-detail"}
+          header={
+            <span className="ct-currency-pane__lifestyle-detail-header">
+              {lifestyle?.name ?? "Lifestyle"} Details
+            </span>
+          }
+          layoutType="minimal"
+        >
+          <div className="ct-currency-pane__lifestyle-description">
+            {lifestyleDescriptionNode}
+          </div>
+        </Collapsible>
+      )}
+    </div>
+  );
+};
+
+export default Lifestyle;
diff --git a/ddb_main/tools/js/CharacterSheet/components/Lifestyle/index.ts b/ddb_main/tools/js/CharacterSheet/components/Lifestyle/index.ts
new file mode 100644
index 0000000..5316c65
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/Lifestyle/index.ts
@@ -0,0 +1,4 @@
+import Lifestyle from "./Lifestyle";
+
+export default Lifestyle;
+export { Lifestyle };
diff --git a/ddb_main/tools/js/CharacterSheet/components/MobileDivider/MobileDivider.tsx b/ddb_main/tools/js/CharacterSheet/components/MobileDivider/MobileDivider.tsx
new file mode 100644
index 0000000..0a1ecfd
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/MobileDivider/MobileDivider.tsx
@@ -0,0 +1,82 @@
+import React from "react";
+
+import {
+  BeveledEdgeCornerSvg,
+  BeveledEdgeRepeatSvg,
+  ManageIcon,
+} from "@dndbeyond/character-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  label?: string;
+  isEnd: boolean;
+  onClick?: () => void;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  isTablet: boolean;
+}
+export default class MobileDivider extends React.PureComponent<Props> {
+  static defaultProps = {
+    isEnd: false,
+    isReadonly: false,
+    isTablet: false,
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  render() {
+    const { label, isEnd, onClick, isReadonly, theme, isTablet } = this.props;
+
+    let classNames: Array<string> = ["ct-mobile-divider"];
+    if (label) {
+      classNames.push("ct-mobile-divider--has-label");
+    }
+    if (isEnd) {
+      classNames.push("ct-mobile-divider--end");
+    }
+
+    let hasOnClick: boolean = !!onClick;
+
+    return (
+      <div className={classNames.join(" ")} onClick={this.handleClick}>
+        <div className="ct-mobile-divider__divider">
+          <div className="ct-mobile-divider__edge ct-mobile-divider__edge--first">
+            <BeveledEdgeCornerSvg theme={theme} isTablet={isTablet} />
+          </div>
+          <div className="ct-mobile-divider__repeat">
+            <BeveledEdgeRepeatSvg theme={theme} isTablet={isTablet} />
+          </div>
+          <div className="ct-mobile-divider__edge ct-mobile-divider__edge--last">
+            <BeveledEdgeCornerSvg theme={theme} isTablet={isTablet} />
+          </div>
+        </div>
+        {label && (
+          <div
+            className={`ct-mobile-divider__label ${
+              theme.isDarkMode ? "ct-mobile-divider__label--dark-mode" : ""
+            }`}
+          >
+            <span className="ct-mobile-divider__label-text">
+              {label}
+              {hasOnClick && !isReadonly && (
+                <ManageIcon
+                  theme={theme}
+                  enableTooltip={false}
+                  showIconOnEdge={false}
+                />
+              )}
+            </span>
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/MobileDivider/index.ts b/ddb_main/tools/js/CharacterSheet/components/MobileDivider/index.ts
new file mode 100644
index 0000000..97aa99d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/MobileDivider/index.ts
@@ -0,0 +1,4 @@
+import MobileDivider from "./MobileDivider";
+
+export default MobileDivider;
+export { MobileDivider };
diff --git a/ddb_main/tools/js/CharacterSheet/components/OtherPossessions/OtherPossessions.tsx b/ddb_main/tools/js/CharacterSheet/components/OtherPossessions/OtherPossessions.tsx
new file mode 100644
index 0000000..28a6326
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/OtherPossessions/OtherPossessions.tsx
@@ -0,0 +1,46 @@
+import React from "react";
+
+import {
+  CharacterNotes,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  notes: CharacterNotes;
+  onClick?: () => void;
+}
+export default class OtherPossessions extends React.PureComponent<Props> {
+  handlePossessionsManage = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  render() {
+    const { notes } = this.props;
+
+    let notesData = notes[Constants.NoteKeyEnum.PERSONAL_POSSESSIONS];
+    let hasContent: boolean = !!notesData;
+    let content: React.ReactNode = hasContent
+      ? notesData
+      : "+ Add other possessions, treasure, or holdings for your character in this section.";
+
+    let classNames: Array<string> = ["ct-other-possessions"];
+    if (!hasContent) {
+      classNames.push("ct-other-possessions--no-content");
+    }
+
+    return (
+      <div
+        className={classNames.join(" ")}
+        onClick={this.handlePossessionsManage}
+      >
+        {content}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/OtherPossessions/index.ts b/ddb_main/tools/js/CharacterSheet/components/OtherPossessions/index.ts
new file mode 100644
index 0000000..0f11ee4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/OtherPossessions/index.ts
@@ -0,0 +1,4 @@
+import OtherPossessions from "./OtherPossessions";
+
+export default OtherPossessions;
+export { OtherPossessions };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ProficiencyBonusBox/ProficiencyBonusBox.tsx b/ddb_main/tools/js/CharacterSheet/components/ProficiencyBonusBox/ProficiencyBonusBox.tsx
new file mode 100644
index 0000000..421eb0b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ProficiencyBonusBox/ProficiencyBonusBox.tsx
@@ -0,0 +1,65 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+
+import {
+  BeveledBoxSvg94x89,
+  BoxBackground,
+} from "@dndbeyond/character-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+interface Props {
+  proficiencyBonus: number;
+  onClick?: () => void;
+  theme: CharacterTheme;
+}
+export default class ProficiencyBonusBox extends React.PureComponent<Props> {
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  render() {
+    const { proficiencyBonus, theme } = this.props;
+
+    return (
+      <section className="ct-proficiency-bonus-box" onClick={this.handleClick}>
+        <BoxBackground StyleComponent={BeveledBoxSvg94x89} theme={theme} />
+        <h2 style={visuallyHidden}>Proficiency Bonus</h2>
+        <div
+          className={`ct-proficiency-bonus-box__heading ${
+            theme.isDarkMode
+              ? "ct-proficiency-bonus-box__heading--dark-mode"
+              : ""
+          }`}
+        >
+          Proficiency
+        </div>
+        <div
+          className={`ct-proficiency-bonus-box__value ${
+            theme.isDarkMode ? "ct-proficiency-bonus-box__value--dark-mode" : ""
+          }`}
+        >
+          <NumberDisplay
+            type="signed"
+            number={proficiencyBonus}
+            size={"large"}
+          />
+        </div>
+        <div
+          className={`ct-proficiency-bonus-box__label ${
+            theme.isDarkMode ? "ct-proficiency-bonus-box__label--dark-mode" : ""
+          }`}
+        >
+          Bonus
+        </div>
+      </section>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ProficiencyBonusBox/index.ts b/ddb_main/tools/js/CharacterSheet/components/ProficiencyBonusBox/index.ts
new file mode 100644
index 0000000..aad2712
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ProficiencyBonusBox/index.ts
@@ -0,0 +1,4 @@
+import ProficiencyBonusBox from "./ProficiencyBonusBox";
+
+export default ProficiencyBonusBox;
+export { ProficiencyBonusBox };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroups/ProficiencyGroups.tsx b/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroups/ProficiencyGroups.tsx
new file mode 100644
index 0000000..dcd481d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroups/ProficiencyGroups.tsx
@@ -0,0 +1,100 @@
+import React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  CharacterTheme,
+  ProficiencyGroup,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  proficiencyGroups: Array<ProficiencyGroup>;
+  onClick?: () => void;
+  theme?: CharacterTheme;
+}
+export default class ProficiencyGroups extends React.PureComponent<Props> {
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  render() {
+    const { proficiencyGroups, theme } = this.props;
+
+    return (
+      <div className="ct-proficiency-groups" onClick={this.handleClick}>
+        {proficiencyGroups.map((group) => {
+          let itemsNode: React.ReactNode = "None";
+          if (group.modifierGroups.length) {
+            itemsNode = (
+              <React.Fragment>
+                {group.modifierGroups.map((modifierGroup, idx) => {
+                  let title: string = modifierGroup.sources.join(", ");
+                  return (
+                    <Tooltip
+                      isDarkMode={theme?.isDarkMode}
+                      tippyOpts={{
+                        dynamicTitle: true,
+                      }}
+                      title={title}
+                      key={modifierGroup.label}
+                    >
+                      <span
+                        className={`ct-proficiency-groups__group-item ${
+                          theme?.isDarkMode
+                            ? "ct-proficiency-groups__group-item--dark-mode"
+                            : ""
+                        }`}
+                      >
+                        {modifierGroup.label}
+                        {modifierGroup.restriction
+                          ? ` (${modifierGroup.restriction})`
+                          : ""}
+                        {idx + 1 !== group.modifierGroups.length ? ", " : ""}
+                      </span>
+                    </Tooltip>
+                  );
+                })}
+              </React.Fragment>
+            );
+          }
+
+          return (
+            <div
+              className="ct-proficiency-groups__group"
+              key={group.label ? group.label : ""}
+              style={
+                theme?.isDarkMode
+                  ? { borderColor: `${theme.themeColor}66` }
+                  : undefined
+              }
+            >
+              <div
+                className={`ct-proficiency-groups__group-label ${
+                  theme?.isDarkMode
+                    ? "ct-proficiency-groups__group-label--dark-mode"
+                    : ""
+                }`}
+              >
+                {group.label}
+              </div>
+              <div
+                className={`ct-proficiency-groups__group-items ${
+                  theme?.isDarkMode
+                    ? "ct-proficiency-groups__group-items--dark-mode"
+                    : ""
+                }`}
+              >
+                {itemsNode}
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroups/index.ts b/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroups/index.ts
new file mode 100644
index 0000000..b396ce7
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroups/index.ts
@@ -0,0 +1,4 @@
+import ProficiencyGroups from "./ProficiencyGroups";
+
+export default ProficiencyGroups;
+export { ProficiencyGroups };
diff --git a/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroupsBox/ProficiencyGroupsBox.tsx b/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroupsBox/ProficiencyGroupsBox.tsx
new file mode 100644
index 0000000..2047724
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroupsBox/ProficiencyGroupsBox.tsx
@@ -0,0 +1,48 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+
+import {
+  BoxBackground,
+  SquaredBoxSvg228x338,
+  SquaredBoxSvg278x338,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  ProficiencyGroup,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { StyleSizeTypeEnum } from "../../../Shared/reducers/appEnv";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import ProficiencyGroups from "../ProficiencyGroups";
+
+interface Props {
+  dimensions: AppEnvDimensionsState;
+  theme: CharacterTheme;
+  proficiencyGroups: Array<ProficiencyGroup>;
+  onClick?: () => void;
+}
+export default class ProficiencyGroupsBox extends React.PureComponent<Props> {
+  render() {
+    const { dimensions, theme, proficiencyGroups, onClick } = this.props;
+
+    let BoxBackgroundComponent: React.ComponentType = SquaredBoxSvg228x338;
+    if (
+      dimensions.styleSizeType > StyleSizeTypeEnum.DESKTOP ||
+      dimensions.styleSizeType <= StyleSizeTypeEnum.TABLET
+    ) {
+      BoxBackgroundComponent = SquaredBoxSvg278x338;
+    }
+
+    return (
+      <section className="ct-proficiency-groups-box">
+        <BoxBackground StyleComponent={BoxBackgroundComponent} theme={theme} />
+        <h2 style={visuallyHidden}>Proficiencies and Languages</h2>
+        <ProficiencyGroups
+          proficiencyGroups={proficiencyGroups}
+          onClick={onClick}
+          theme={theme}
+        />
+      </section>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroupsBox/index.ts b/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroupsBox/index.ts
new file mode 100644
index 0000000..f084236
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/ProficiencyGroupsBox/index.ts
@@ -0,0 +1,4 @@
+import ProficiencyGroupsBox from "./ProficiencyGroupsBox";
+
+export default ProficiencyGroupsBox;
+export { ProficiencyGroupsBox };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SavingThrowsBox/SavingThrowsBox.tsx b/ddb_main/tools/js/CharacterSheet/components/SavingThrowsBox/SavingThrowsBox.tsx
new file mode 100644
index 0000000..b7e19e2
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SavingThrowsBox/SavingThrowsBox.tsx
@@ -0,0 +1,298 @@
+import { visuallyHidden } from "@mui/utils";
+import { orderBy } from "lodash";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  BoxBackground,
+  FancyBoxSvg230x200,
+  FancyBoxSvg281x200,
+  SavingThrowsSummary,
+} from "@dndbeyond/character-components/es";
+import {
+  AbilityManager,
+  CharacterTheme,
+  CharacterUtils,
+  Constants,
+  DeathSaveInfo,
+  DiceAdjustment,
+  RuleData,
+  SituationalSavingThrowInfoLookup,
+} from "@dndbeyond/character-rules-engine/es";
+import { IRollContext } from "@dndbeyond/dice";
+
+import DiceAdjustmentSummary from "../../../Shared/components/DiceAdjustmentSummary";
+import { StyleSizeTypeEnum } from "../../../Shared/reducers/appEnv";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+
+interface Props {
+  abilities: Array<AbilityManager>;
+  ruleData: RuleData;
+  savingThrowDiceAdjustments: Array<DiceAdjustment>;
+  situationalBonusSavingThrowsLookup: SituationalSavingThrowInfoLookup;
+  deathSaveInfo: DeathSaveInfo;
+  maxSummariesShown?: number;
+  onAbilityClick?: (ability: AbilityManager) => void;
+  onInfoClick?: () => void;
+  onClick?: () => void;
+  dimensions: AppEnvDimensionsState;
+  theme: CharacterTheme;
+  diceEnabled?: boolean;
+  rollContext: IRollContext;
+}
+
+const sortDiceAdjustments = (
+  diceAdjustments: Array<DiceAdjustment>
+): Array<DiceAdjustment> => {
+  let sortOrderLookup: Record<string, number> = {
+    [Constants.DiceAdjustmentTypeEnum.ADVANTAGE]: 1,
+    [Constants.DiceAdjustmentTypeEnum.DISADVANTAGE]: 2,
+    [Constants.DiceAdjustmentTypeEnum.BONUS]: 3,
+  };
+  return orderBy(diceAdjustments, [
+    (diceAdjustment) => sortOrderLookup[diceAdjustment.type],
+  ]);
+};
+
+export default function SavingThrowsBox({
+  abilities,
+  ruleData,
+  savingThrowDiceAdjustments,
+  situationalBonusSavingThrowsLookup,
+  deathSaveInfo,
+  maxSummariesShown = 3,
+  onAbilityClick,
+  onInfoClick,
+  onClick,
+  dimensions,
+  theme,
+  diceEnabled = false,
+  rollContext,
+}: Props) {
+  const filterDiceAdjustments = (): Array<DiceAdjustment> => {
+    const advantageSavingThrowAdjustments: Array<DiceAdjustment> = [];
+    const disadvantageSavingThrowAdjustments: Array<DiceAdjustment> = [];
+    const bonusSavingThrowAdjustments: Array<DiceAdjustment> = [];
+
+    savingThrowDiceAdjustments.forEach((adjustment) => {
+      if (adjustment.type === Constants.DiceAdjustmentTypeEnum.ADVANTAGE) {
+        advantageSavingThrowAdjustments.push(adjustment);
+      }
+      if (adjustment.type === Constants.DiceAdjustmentTypeEnum.DISADVANTAGE) {
+        disadvantageSavingThrowAdjustments.push(adjustment);
+      }
+      if (adjustment.type === Constants.DiceAdjustmentTypeEnum.BONUS) {
+        bonusSavingThrowAdjustments.push(adjustment);
+      }
+    });
+
+    // TODO: this logic "seems" more related to game logic and less like view logic it should be moved.
+
+    //get highest dice adjustment count from all saving throws
+    let highestSavingThrowAdjustmentCount: number = Math.max(
+      advantageSavingThrowAdjustments.length,
+      disadvantageSavingThrowAdjustments.length,
+      bonusSavingThrowAdjustments.length
+    );
+
+    //get highest dice adjustment count from all dice adjustments
+    let highestDiceAdjustmentCount: number = Math.max(
+      highestSavingThrowAdjustmentCount,
+      deathSaveInfo.advantageAdjustments.length,
+      deathSaveInfo.disadvantageAdjustments.length
+    );
+
+    let diceAdjustments: Array<DiceAdjustment> = [];
+    if (highestDiceAdjustmentCount) {
+      let saveAdjustmentMaxLoopCount: number = Math.min(
+        maxSummariesShown,
+        highestSavingThrowAdjustmentCount
+      );
+
+      //Does a round robin of all saving throw adjustments
+      for (let i = 0; i < saveAdjustmentMaxLoopCount; i++) {
+        if (diceAdjustments.length >= maxSummariesShown) {
+          continue;
+        }
+        if (advantageSavingThrowAdjustments.length > i) {
+          diceAdjustments.push(advantageSavingThrowAdjustments[i]);
+        }
+        if (
+          diceAdjustments.length < maxSummariesShown &&
+          disadvantageSavingThrowAdjustments.length > i
+        ) {
+          diceAdjustments.push(disadvantageSavingThrowAdjustments[i]);
+        }
+        if (
+          diceAdjustments.length < maxSummariesShown &&
+          bonusSavingThrowAdjustments.length > i
+        ) {
+          diceAdjustments.push(bonusSavingThrowAdjustments[i]);
+        }
+      }
+
+      //Does a round robin of any death save adjustments if there is room in the diceAdjustments array
+      let deathSaveMaxLoopCount: number = Math.max(
+        0,
+        maxSummariesShown - diceAdjustments.length
+      );
+      for (let i = 0; i < deathSaveMaxLoopCount; i++) {
+        if (diceAdjustments.length >= maxSummariesShown) {
+          continue;
+        }
+        if (deathSaveInfo.advantageAdjustments.length > i) {
+          diceAdjustments.push(deathSaveInfo.advantageAdjustments[i]);
+        }
+
+        if (
+          diceAdjustments.length < maxSummariesShown &&
+          deathSaveInfo.disadvantageAdjustments.length > i
+        ) {
+          diceAdjustments.push(deathSaveInfo.disadvantageAdjustments[i]);
+        }
+      }
+
+      if (diceAdjustments.length > 1) {
+        return sortDiceAdjustments(diceAdjustments);
+      }
+    }
+
+    return diceAdjustments;
+  };
+
+  const handleAbilityClick = (ability: AbilityManager): void => {
+    if (onAbilityClick) {
+      onAbilityClick(ability);
+    }
+  };
+
+  const handleClick = (evt: React.MouseEvent): void => {
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  const handleInfoClick = (evt: React.MouseEvent): void => {
+    if (onInfoClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onInfoClick();
+    }
+  };
+
+  const renderSummary = (
+    diceAdjustment: DiceAdjustment,
+    includeTooltip: boolean = true
+  ): React.ReactNode => {
+    const tooltip = CharacterUtils.generateSavingThrowAdjustmentSummary(
+      diceAdjustment,
+      ruleData
+    );
+
+    // White space is very intentional
+    return (
+      <Tooltip
+        title={tooltip}
+        enabled={includeTooltip}
+        className="ct-saving-throws-box__modifier"
+        key={diceAdjustment.uniqueKey}
+        isDarkMode={theme.isDarkMode}
+      >
+        <DiceAdjustmentSummary
+          diceAdjustment={diceAdjustment}
+          ruleData={ruleData}
+          showDataOrigin={false}
+          theme={theme}
+        />
+      </Tooltip>
+    );
+    //`
+  };
+
+  const renderSingleSummary = (
+    diceAdjustment: DiceAdjustment
+  ): React.ReactNode => {
+    return (
+      <div
+        className={`ct-saving-throws-box__modifiers ct-saving-throws-box__modifiers--single ${
+          theme.isDarkMode ? "ct-saving-throws-box__modifiers--dark-mode" : ""
+        }`}
+      >
+        {renderSummary(diceAdjustment, false)}
+      </div>
+    );
+  };
+
+  const renderMultiSummary = (
+    diceAdjustments: Array<DiceAdjustment>
+  ): React.ReactNode => {
+    return (
+      <div
+        className={`ct-saving-throws-box__modifiers ct-saving-throws-box__modifiers--multi ${
+          theme.isDarkMode ? "ct-saving-throws-box__modifiers--dark-mode" : ""
+        }`}
+      >
+        {diceAdjustments.map((diceAdjustment) => renderSummary(diceAdjustment))}
+      </div>
+    );
+  };
+
+  const renderEmpty = (): React.ReactNode => {
+    return (
+      <div
+        className={`ct-saving-throws-box__modifiers ct-saving-throws-box__modifiers--empty ${
+          theme.isDarkMode ? "ct-saving-throws-box__modifiers--dark-mode" : ""
+        }`}
+      >
+        Saving Throw Modifiers
+      </div>
+    );
+  };
+
+  const renderSaveInfo = (): React.ReactNode => {
+    const diceAdjustments = filterDiceAdjustments();
+
+    if (diceAdjustments.length === 0) {
+      return renderEmpty();
+    }
+    if (diceAdjustments.length === 1) {
+      return renderSingleSummary(diceAdjustments[0]);
+    }
+
+    return renderMultiSummary(diceAdjustments);
+  };
+
+  let BoxBackgroundComponent: React.ComponentType = FancyBoxSvg230x200;
+  let useSmallRowStyle: boolean = true;
+  if (
+    dimensions.styleSizeType > StyleSizeTypeEnum.DESKTOP ||
+    dimensions.styleSizeType <= StyleSizeTypeEnum.TABLET
+  ) {
+    BoxBackgroundComponent = FancyBoxSvg281x200;
+    useSmallRowStyle = false;
+  }
+
+  return (
+    <section className="ct-saving-throws-box" onClick={handleClick}>
+      <BoxBackground StyleComponent={BoxBackgroundComponent} theme={theme} />
+      <h2 style={visuallyHidden}>Saving Throws</h2>
+      <div className="ct-saving-throws-box__abilities">
+        <SavingThrowsSummary
+          abilities={abilities}
+          situationalBonusSavingThrowsLookup={
+            situationalBonusSavingThrowsLookup
+          }
+          onClick={handleAbilityClick}
+          diceEnabled={diceEnabled}
+          theme={theme}
+          rowStyle={useSmallRowStyle ? "small" : "normal"}
+          rollContext={rollContext}
+        />
+      </div>
+      <div className="ct-saving-throws-box__info" onClick={handleInfoClick}>
+        {renderSaveInfo()}
+      </div>
+    </section>
+  );
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SavingThrowsBox/index.ts b/ddb_main/tools/js/CharacterSheet/components/SavingThrowsBox/index.ts
new file mode 100644
index 0000000..bb4a37c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SavingThrowsBox/index.ts
@@ -0,0 +1,4 @@
+import SavingThrowsBox from "./SavingThrowsBox";
+
+export default SavingThrowsBox;
+export { SavingThrowsBox };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SavingThrowsDetails/SavingThrowsDetails.tsx b/ddb_main/tools/js/CharacterSheet/components/SavingThrowsDetails/SavingThrowsDetails.tsx
new file mode 100644
index 0000000..e7be786
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SavingThrowsDetails/SavingThrowsDetails.tsx
@@ -0,0 +1,89 @@
+import {
+  CharacterTheme,
+  Constants,
+  DataOrigin,
+  DeathSaveInfo,
+  DiceAdjustment,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import DiceAdjustmentSummary from "../../../Shared/components/DiceAdjustmentSummary";
+
+interface Props {
+  savingThrowDiceAdjustments: Array<DiceAdjustment>;
+  onDataOriginClick?: (dataOrigin: DataOrigin) => void;
+  deathSaveInfo: DeathSaveInfo;
+  ruleData: RuleData;
+  theme: CharacterTheme;
+}
+export default function SavingThrowsDetails({
+  savingThrowDiceAdjustments,
+  onDataOriginClick,
+  deathSaveInfo,
+  ruleData,
+  theme,
+}: Props) {
+  const renderDiceAdjustmentList = (
+    diceAdjustments: Array<DiceAdjustment>,
+    showDataOrigin: boolean = false
+  ): React.ReactNode => {
+    if (!diceAdjustments.length) {
+      return null;
+    }
+
+    return (
+      <>
+        {diceAdjustments.map((diceAdjustment, idx) => {
+          return (
+            <DiceAdjustmentSummary
+              theme={theme}
+              diceAdjustment={diceAdjustment}
+              key={diceAdjustment.uniqueKey}
+              ruleData={ruleData}
+              showDataOrigin={showDataOrigin}
+              onDataOriginClick={onDataOriginClick}
+            />
+          );
+        })}
+      </>
+    );
+  };
+
+  if (
+    !savingThrowDiceAdjustments.length &&
+    !deathSaveInfo.disadvantageAdjustments.length &&
+    !deathSaveInfo.advantageAdjustments.length
+  ) {
+    return (
+      <div className="ct-saving-throws-details__empty">
+        You have no saving throw modifiers
+      </div>
+    );
+  }
+
+  const advantageSavingThrowAdjustments: Array<DiceAdjustment> = [];
+  const disadvantageSavingThrowAdjustments: Array<DiceAdjustment> = [];
+  const bonusSavingThrowAdjustments: Array<DiceAdjustment> = [];
+
+  savingThrowDiceAdjustments.forEach((adjustment) => {
+    if (adjustment.type === Constants.DiceAdjustmentTypeEnum.ADVANTAGE) {
+      advantageSavingThrowAdjustments.push(adjustment);
+    }
+    if (adjustment.type === Constants.DiceAdjustmentTypeEnum.DISADVANTAGE) {
+      disadvantageSavingThrowAdjustments.push(adjustment);
+    }
+    if (adjustment.type === Constants.DiceAdjustmentTypeEnum.BONUS) {
+      bonusSavingThrowAdjustments.push(adjustment);
+    }
+  });
+
+  return (
+    <div className="ct-saving-throws-details">
+      {renderDiceAdjustmentList(advantageSavingThrowAdjustments)}
+      {renderDiceAdjustmentList(deathSaveInfo.advantageAdjustments)}
+      {renderDiceAdjustmentList(disadvantageSavingThrowAdjustments)}
+      {renderDiceAdjustmentList(deathSaveInfo.disadvantageAdjustments)}
+      {renderDiceAdjustmentList(bonusSavingThrowAdjustments, true)}
+    </div>
+  );
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SavingThrowsDetails/index.ts b/ddb_main/tools/js/CharacterSheet/components/SavingThrowsDetails/index.ts
new file mode 100644
index 0000000..11ba3a5
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SavingThrowsDetails/index.ts
@@ -0,0 +1,4 @@
+import SavingThrowsDetails from "./SavingThrowsDetails";
+
+export default SavingThrowsDetails;
+export { SavingThrowsDetails };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SectionPlaceholder/SectionPlaceholder.tsx b/ddb_main/tools/js/CharacterSheet/components/SectionPlaceholder/SectionPlaceholder.tsx
new file mode 100644
index 0000000..a8d346c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SectionPlaceholder/SectionPlaceholder.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+interface Props {
+  name: string;
+  IconComponent: React.ComponentType;
+}
+export default class SectionPlaceholder extends React.PureComponent<Props> {
+  render() {
+    const { name, IconComponent } = this.props;
+
+    return (
+      <div className="ct-section-placeholder">
+        <div className="ct-section-placeholder__name">{name}</div>
+        <div className="ct-section-placeholder__icon">
+          <IconComponent />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SectionPlaceholder/index.ts b/ddb_main/tools/js/CharacterSheet/components/SectionPlaceholder/index.ts
new file mode 100644
index 0000000..3d1dab7
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SectionPlaceholder/index.ts
@@ -0,0 +1,4 @@
+import SectionPlaceholder from "./SectionPlaceholder";
+
+export default SectionPlaceholder;
+export { SectionPlaceholder };
diff --git a/ddb_main/tools/js/CharacterSheet/components/Senses/Senses.tsx b/ddb_main/tools/js/CharacterSheet/components/Senses/Senses.tsx
new file mode 100644
index 0000000..b4c48f5
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/Senses/Senses.tsx
@@ -0,0 +1,181 @@
+import React from "react";
+
+import {
+  BoxBackground,
+  ThemedSenseRowBoxSvg,
+  ThemedSenseRowSmallBoxSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  Constants,
+  FormatUtils,
+  RuleDataUtils,
+  SenseInfo,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { TypeScriptUtils } from "../../../Shared/utils";
+
+interface Props {
+  passivePerception: number;
+  passiveInvestigation: number;
+  passiveInsight: number;
+  senses: SenseInfo;
+  rowStyle: "small" | "normal";
+  onClick?: () => void;
+  theme: CharacterTheme;
+}
+export default class Senses extends React.PureComponent<Props> {
+  static defaultProps = {
+    rowStyle: "normal",
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  getSenseSummary = (senseKey: Constants.SenseTypeEnum): string | null => {
+    const { senses } = this.props;
+
+    let senseValue = senses[senseKey];
+    if (!senseValue) {
+      return null;
+    }
+
+    return `${RuleDataUtils.getSenseTypeLabel(
+      senseKey
+    )} ${FormatUtils.renderDistance(senseValue)}`;
+  };
+
+  renderSummaryInfo = (): React.ReactNode => {
+    const { theme } = this.props;
+
+    let senseKeys: Array<Constants.SenseTypeEnum> = [
+      Constants.SenseTypeEnum.BLINDSIGHT,
+      Constants.SenseTypeEnum.DARKVISION,
+      Constants.SenseTypeEnum.TREMORSENSE,
+      Constants.SenseTypeEnum.TRUESIGHT,
+    ];
+
+    let senseSummaries: Array<string> = senseKeys
+      .map((senseKey) => this.getSenseSummary(senseKey))
+      .filter(TypeScriptUtils.isNotNullOrUndefined);
+
+    let summaryClasses: Array<string> = ["ct-senses__summary"];
+    if (!senseSummaries.length) {
+      summaryClasses.push("ct-senses__summary--empty");
+    }
+    if (theme?.isDarkMode) {
+      summaryClasses.push("ct-senses__summary--dark-mode");
+    }
+
+    if (senseSummaries.length) {
+      return (
+        <div className={summaryClasses.join(" ")}>
+          {senseSummaries.join(", ")}
+        </div>
+      );
+    }
+
+    return (
+      <div className={summaryClasses.join(" ")}>Additional Sense Types</div>
+    );
+  };
+
+  render() {
+    const {
+      passiveInsight,
+      passiveInvestigation,
+      passivePerception,
+      rowStyle,
+      theme,
+    } = this.props;
+
+    let StyleComponent: React.ComponentType<any> = ThemedSenseRowBoxSvg;
+    if (rowStyle === "small") {
+      StyleComponent = ThemedSenseRowSmallBoxSvg;
+    }
+
+    return (
+      <div className="ct-senses" onClick={this.handleClick}>
+        <div className="ct-senses__callouts">
+          <div className="ct-senses__callout">
+            <BoxBackground
+              StyleComponent={StyleComponent}
+              theme={{
+                ...theme,
+                themeColor: `${theme?.themeColor}80`,
+              }}
+            />
+            <div
+              className={`ct-senses__callout-value ${
+                theme?.isDarkMode ? "ct-senses__callout-value--dark-mode" : ""
+              }`}
+            >
+              {passivePerception}
+            </div>
+            <div
+              className={`ct-senses__callout-label ${
+                theme?.isDarkMode ? "ct-senses__callout-label--dark-mode" : ""
+              }`}
+            >
+              Passive Perception
+            </div>
+          </div>
+          <div className="ct-senses__callout">
+            <BoxBackground
+              StyleComponent={StyleComponent}
+              theme={{
+                ...theme,
+                themeColor: `${theme?.themeColor}80`,
+              }}
+            />
+            <div
+              className={`ct-senses__callout-value ${
+                theme?.isDarkMode ? "ct-senses__callout-value--dark-mode" : ""
+              }`}
+            >
+              {passiveInvestigation}
+            </div>
+            <div
+              className={`ct-senses__callout-label ${
+                theme?.isDarkMode ? "ct-senses__callout-label--dark-mode" : ""
+              }`}
+            >
+              Passive Investigation
+            </div>
+          </div>
+          <div className="ct-senses__callout">
+            <BoxBackground
+              StyleComponent={StyleComponent}
+              theme={{
+                ...theme,
+                themeColor: `${theme?.themeColor}80`,
+              }}
+            />
+            <div
+              className={`ct-senses__callout-value ${
+                theme?.isDarkMode ? "ct-senses__callout-value--dark-mode" : ""
+              }`}
+            >
+              {passiveInsight}
+            </div>
+            <div
+              className={`ct-senses__callout-label ${
+                theme?.isDarkMode ? "ct-senses__callout-label--dark-mode" : ""
+              }`}
+            >
+              Passive Insight
+            </div>
+          </div>
+        </div>
+        {this.renderSummaryInfo()}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/Senses/index.ts b/ddb_main/tools/js/CharacterSheet/components/Senses/index.ts
new file mode 100644
index 0000000..df422b5
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/Senses/index.ts
@@ -0,0 +1,4 @@
+import Senses from "./Senses";
+
+export default Senses;
+export { Senses };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SensesBox/SensesBox.tsx b/ddb_main/tools/js/CharacterSheet/components/SensesBox/SensesBox.tsx
new file mode 100644
index 0000000..b0dcf06
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SensesBox/SensesBox.tsx
@@ -0,0 +1,65 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+
+import {
+  BoxBackground,
+  FancyBoxSvg230x200,
+  FancyBoxSvg281x200,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  SenseInfo,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { StyleSizeTypeEnum } from "../../../Shared/reducers/appEnv";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import Senses from "../Senses";
+
+interface Props {
+  passivePerception: number;
+  passiveInvestigation: number;
+  passiveInsight: number;
+  senses: SenseInfo;
+  onClick?: () => void;
+  dimensions: AppEnvDimensionsState;
+  theme: CharacterTheme;
+}
+export default class SensesBox extends React.PureComponent<Props> {
+  render() {
+    const {
+      passiveInsight,
+      passiveInvestigation,
+      passivePerception,
+      senses,
+      onClick,
+      dimensions,
+      theme,
+    } = this.props;
+
+    let BoxBackgroundComponent: React.ComponentType = FancyBoxSvg230x200;
+    let useSmallRowStyle: boolean = true;
+    if (
+      dimensions.styleSizeType > StyleSizeTypeEnum.DESKTOP ||
+      dimensions.styleSizeType <= StyleSizeTypeEnum.TABLET
+    ) {
+      BoxBackgroundComponent = FancyBoxSvg281x200;
+      useSmallRowStyle = false;
+    }
+
+    return (
+      <section className="ct-senses-box">
+        <BoxBackground StyleComponent={BoxBackgroundComponent} theme={theme} />
+        <h2 style={visuallyHidden}>Senses</h2>
+        <Senses
+          senses={senses}
+          passiveInsight={passiveInsight}
+          passiveInvestigation={passiveInvestigation}
+          passivePerception={passivePerception}
+          onClick={onClick}
+          theme={theme}
+          rowStyle={useSmallRowStyle ? "small" : "normal"}
+        />
+      </section>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SensesBox/index.ts b/ddb_main/tools/js/CharacterSheet/components/SensesBox/index.ts
new file mode 100644
index 0000000..d9539cc
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SensesBox/index.ts
@@ -0,0 +1,4 @@
+import SensesBox from "./SensesBox";
+
+export default SensesBox;
+export { SensesBox };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SettingsButton/SettingsButton.tsx b/ddb_main/tools/js/CharacterSheet/components/SettingsButton/SettingsButton.tsx
new file mode 100644
index 0000000..29b8947
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SettingsButton/SettingsButton.tsx
@@ -0,0 +1,31 @@
+import SettingsIcon from "@mui/icons-material/Settings";
+import Button from "@mui/material/Button";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+interface Props {
+  context: string;
+  isReadonly: boolean;
+}
+
+const SettingsButton: React.FC<Props> = ({ context, isReadonly }) => {
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  return !isReadonly ? (
+    <Button
+      onClick={(evt) => {
+        paneHistoryPush(PaneComponentEnum.SETTINGS, {
+          context,
+        });
+      }}
+      variant="text"
+      startIcon={<SettingsIcon />}
+    >
+      Settings
+    </Button>
+  ) : null;
+};
+
+export default SettingsButton;
diff --git a/ddb_main/tools/js/CharacterSheet/components/SettingsButton/index.ts b/ddb_main/tools/js/CharacterSheet/components/SettingsButton/index.ts
new file mode 100644
index 0000000..1516c74
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SettingsButton/index.ts
@@ -0,0 +1,4 @@
+import SettingsButton from "./SettingsButton";
+
+export default SettingsButton;
+export { SettingsButton };
diff --git a/ddb_main/tools/js/CharacterSheet/components/Skills/Skills.tsx b/ddb_main/tools/js/CharacterSheet/components/Skills/Skills.tsx
new file mode 100644
index 0000000..4224beb
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/Skills/Skills.tsx
@@ -0,0 +1,443 @@
+import { visuallyHidden } from "@mui/utils";
+import { orderBy } from "lodash";
+import React from "react";
+
+import {
+  AdvantageIcon,
+  AdvantageDisadvantageIcon,
+  DisadvantageIcon,
+  ProficiencyLevelIcon,
+  DigitalDiceWrapper,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  Constants,
+  RuleData,
+  RuleDataUtils,
+  Skill,
+  SkillUtils,
+  ValueLookup,
+  ValueUtils,
+} from "@dndbeyond/character-rules-engine/es";
+import { RollType, DiceTools, IRollContext } from "@dndbeyond/dice";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+interface Props {
+  skills: Array<Skill>;
+  customSkills: Array<Skill>;
+  onCustomSkillClick?: (skill: Skill) => void;
+  onSkillClick?: (skill: Skill) => void;
+  onEmptyClick?: () => void;
+  valueLookup: ValueLookup;
+  diceEnabled: boolean;
+  theme: CharacterTheme;
+  ruleData: RuleData;
+  rollContext: IRollContext;
+}
+class Skills extends React.PureComponent<Props> {
+  static defaultProps = {
+    diceEnabled: false,
+  };
+
+  handleCustomSkillClick = (skill: Skill, evt: React.MouseEvent): void => {
+    const { onCustomSkillClick } = this.props;
+
+    if (onCustomSkillClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onCustomSkillClick(skill);
+    }
+  };
+
+  handleEmptyClick = (evt: React.MouseEvent): void => {
+    const { onEmptyClick } = this.props;
+
+    if (onEmptyClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onEmptyClick();
+    }
+  };
+
+  handleSkillClick = (skill: Skill, evt: React.MouseEvent): void => {
+    const { onSkillClick } = this.props;
+
+    if (onSkillClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onSkillClick(skill);
+    }
+  };
+
+  renderEmptyCustomSkills = (): React.ReactNode => {
+    return (
+      <div
+        className={`ct-skills__additional ct-skills__additional--empty ${
+          this.props.theme.isDarkMode ? "ct-skills__additional--dark-mode" : ""
+        }`}
+        onClick={this.handleEmptyClick}
+      >
+        Additional Skills
+      </div>
+    );
+  };
+
+  renderCustomSkills = (): React.ReactNode => {
+    const { customSkills, ruleData, diceEnabled, theme, rollContext } =
+      this.props;
+
+    const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+      this.context;
+
+    return customSkills.map((skill) => {
+      const modifier = SkillUtils.getModifier(skill);
+      const statName = RuleDataUtils.getAbilityShortName(
+        SkillUtils.getStat(skill),
+        ruleData
+      );
+      const proficiencyLevel = SkillUtils.getProficiencyLevel(skill);
+      const name = SkillUtils.getName(skill);
+
+      return (
+        <div
+          key={skill.id}
+          className="ct-skills__item"
+          onClick={this.handleCustomSkillClick.bind(this, skill)}
+          role="row"
+        >
+          <div className="ct-skills__col--proficiency" role="cell">
+            <ProficiencyLevelIcon
+              theme={theme}
+              proficiencyLevel={proficiencyLevel}
+            />
+          </div>
+          <div
+            className={`ct-skills__col--stat ${
+              theme.isDarkMode ? "ct-skills__col--stat--dark-mode" : ""
+            }`}
+            role="cell"
+          >
+            {statName === null ? "--" : statName}
+          </div>
+          <div
+            className={`ct-skills__col--skill ${
+              theme.isDarkMode ? "ct-skills__col--skill--dark-mode" : ""
+            }`}
+            style={
+              theme
+                ? {
+                    borderBottomColor: `${theme.themeColor}66`,
+                  }
+                : undefined
+            }
+            role="cell"
+          >
+            {name}
+          </div>
+          <div
+            className={"ct-skills__col--modifier"}
+            style={
+              theme
+                ? {
+                    borderBottomColor: `${theme.themeColor}66`,
+                  }
+                : undefined
+            }
+            role="cell"
+          >
+            {modifier === null ? (
+              "--"
+            ) : (
+              <DigitalDiceWrapper
+                diceNotation={DiceTools.CustomD20(
+                  SkillUtils.getModifier(skill)!
+                )}
+                rollType={RollType.Check}
+                rollAction={name ?? "UNKNOWN"}
+                diceEnabled={diceEnabled}
+                themeColor={theme.themeColor}
+                rollContext={rollContext}
+                rollTargetOptions={
+                  messageTargetOptions
+                    ? Object.values(messageTargetOptions?.entities)
+                    : undefined
+                }
+                rollTargetDefault={defaultMessageTargetOption}
+                userId={userId}
+              >
+                <NumberDisplay 
+                  number={modifier}
+                  type="signed"
+                />
+              </DigitalDiceWrapper>
+            )}
+          </div>
+        </div>
+      );
+    });
+  };
+
+  render() {
+    const {
+      skills,
+      valueLookup,
+      customSkills,
+      diceEnabled,
+      ruleData,
+      theme,
+      rollContext,
+    } = this.props;
+
+    const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+      this.context;
+
+    let orderedSkills = orderBy(skills, (skill) => SkillUtils.getName(skill));
+
+    return (
+      <div
+        className={`ct-skills ${
+          theme.isDarkMode ? "ct-skills--dark-mode" : ""
+        }`}
+        role="table"
+      >
+        <div className="ct-skills__header" role="row">
+          <div className="ct-skills__col--proficiency" role="columnheader">
+            <span style={visuallyHidden}>Proficiency</span>
+            <abbr
+              aria-hidden="true"
+              title="Proficiency"
+              className={`ct-skills__heading ${
+                theme.isDarkMode ? "ct-skills__heading--dark-mode" : ""
+              }`}
+            >
+              Prof
+            </abbr>
+          </div>
+          <div className="ct-skills__col--stat" role="columnheader">
+            <span style={visuallyHidden}>Modifier</span>
+            <abbr
+              aria-hidden="true"
+              title="Modifier"
+              className={`ct-skills__heading ${
+                theme.isDarkMode ? "ct-skills__heading--dark-mode" : ""
+              }`}
+            >
+              Mod
+            </abbr>
+          </div>
+          <div className="ct-skills__col--skill" role="columnheader">
+            <span
+              className={`ct-skills__heading ${
+                theme.isDarkMode ? "ct-skills__heading--dark-mode" : ""
+              }`}
+            >
+              Skill
+            </span>
+          </div>
+          <div className="ct-skills__col--modifier" role="columnheader">
+            <span
+              className={`ct-skills__heading ${
+                theme.isDarkMode ? "ct-skills__heading--dark-mode" : ""
+              }`}
+            >
+              Bonus
+            </span>
+          </div>
+        </div>
+        <div className="ct-skills__list" role="rowgroup">
+          {orderedSkills.map((skill) => {
+            let valueTypes: Array<Constants.AdjustmentTypeEnum> = [
+              Constants.AdjustmentTypeEnum.SKILL_STAT_OVERRIDE,
+              Constants.AdjustmentTypeEnum.SKILL_PROFICIENCY_LEVEL,
+              Constants.AdjustmentTypeEnum.SKILL_MISC_BONUS,
+              Constants.AdjustmentTypeEnum.SKILL_MAGIC_BONUS,
+              Constants.AdjustmentTypeEnum.SKILL_OVERRIDE,
+            ];
+            let valueDataLookup = ValueUtils.getDataLookup(
+              valueLookup,
+              valueTypes,
+              ValueUtils.hack__toString(SkillUtils.getId(skill)),
+              ValueUtils.hack__toString(SkillUtils.getEntityTypeId(skill))
+            );
+            let hasModifiedLevel = valueDataLookup.hasOwnProperty(
+              Constants.AdjustmentTypeEnum.SKILL_PROFICIENCY_LEVEL
+            );
+            let hasModifiedValue =
+              valueDataLookup.hasOwnProperty(
+                Constants.AdjustmentTypeEnum.SKILL_OVERRIDE
+              ) ||
+              valueDataLookup.hasOwnProperty(
+                Constants.AdjustmentTypeEnum.SKILL_MAGIC_BONUS
+              ) ||
+              valueDataLookup.hasOwnProperty(
+                Constants.AdjustmentTypeEnum.SKILL_MISC_BONUS
+              );
+
+            let statClassNames: Array<string> = ["ct-skills__col--stat"];
+            if (
+              valueDataLookup.hasOwnProperty(
+                Constants.AdjustmentTypeEnum.SKILL_STAT_OVERRIDE
+              )
+            ) {
+              statClassNames.push("ct-skills__col--stat-modified");
+            }
+            let modifierClassNames: Array<string> = [
+              "ct-skills__col--modifier",
+            ];
+            if (hasModifiedValue) {
+              modifierClassNames.push("ct-skills__col--modifier-modified");
+            }
+            if (theme.isDarkMode) {
+              statClassNames.push("ct-skills__col--stat--dark-mode");
+              modifierClassNames.push("ct-skills__col--modifier--dark-mode");
+            }
+
+            let statName = RuleDataUtils.getAbilityShortName(
+              SkillUtils.getStat(skill),
+              ruleData
+            );
+            let modifier = SkillUtils.getModifier(skill);
+            let name = SkillUtils.getName(skill);
+
+            let usableDiceAdjustmentType =
+              SkillUtils.getUsableDiceAdjustmentType(skill);
+            let adjustmentsNode: React.ReactNode;
+
+            if (
+              usableDiceAdjustmentType !==
+              Constants.UsableDiceAdjustmentTypeEnum.NONE
+            ) {
+              let iconNode: React.ReactNode;
+              let iconClassName: string = "ct-skills__adjustment";
+
+              switch (usableDiceAdjustmentType) {
+                case Constants.UsableDiceAdjustmentTypeEnum.ADVANTAGE:
+                  iconNode = (
+                    <AdvantageIcon theme={theme} className={iconClassName} />
+                  );
+                  break;
+                case Constants.UsableDiceAdjustmentTypeEnum.DISADVANTAGE:
+                  iconNode = (
+                    <DisadvantageIcon theme={theme} className={iconClassName} />
+                  );
+                  break;
+                case Constants.UsableDiceAdjustmentTypeEnum
+                  .ADVANTAGE_DISADVANTAGE:
+                  iconNode = (
+                    <AdvantageDisadvantageIcon
+                      title={"Both (See Sidebar)"}
+                      theme={theme}
+                      className={iconClassName}
+                    />
+                  );
+                  break;
+                default:
+                // not implemented
+              }
+
+              if (iconNode) {
+                adjustmentsNode = (
+                  <div
+                    className="ct-skills__col--adjustments"
+                    style={
+                      theme
+                        ? {
+                            borderBottomColor: `${theme.themeColor}66`,
+                          }
+                        : undefined
+                    }
+                  >
+                    {iconNode}
+                  </div>
+                );
+              }
+            }
+
+            return (
+              <div
+                key={SkillUtils.getId(skill)}
+                className="ct-skills__item"
+                onClick={this.handleSkillClick.bind(this, skill)}
+                role="row"
+              >
+                <div className="ct-skills__col--proficiency" role="cell">
+                  <ProficiencyLevelIcon
+                    theme={theme}
+                    isModified={hasModifiedLevel}
+                    proficiencyLevel={SkillUtils.getProficiencyLevel(skill)}
+                  />
+                </div>
+                <div className={statClassNames.join(" ")} role="cell">
+                  {statName === null ? "--" : statName}
+                </div>
+                <div
+                  className={`ct-skills__col--skill ${
+                    theme.isDarkMode ? "ct-skills__col--skill--dark-mode" : ""
+                  }`}
+                  style={
+                    theme?.isDarkMode
+                      ? {
+                          borderColor: `${theme.themeColor}66`,
+                        }
+                      : undefined
+                  }
+                  role="cell"
+                >
+                  {name}
+                </div>
+                {adjustmentsNode}
+                <div
+                  className={modifierClassNames.join(" ")}
+                  style={
+                    theme?.isDarkMode
+                      ? {
+                          borderColor: `${theme.themeColor}66`,
+                        }
+                      : undefined
+                  }
+                  role="cell"
+                >
+                  {modifier === null ? (
+                    "--"
+                  ) : (
+                    <DigitalDiceWrapper
+                      diceNotation={DiceTools.CustomD20(
+                        SkillUtils.getModifier(skill)!
+                      )}
+                      rollType={RollType.Check}
+                      rollAction={name ? name : "UNKNOWN"}
+                      diceEnabled={diceEnabled}
+                      themeColor={theme.themeColor}
+                      rollContext={rollContext}
+                      rollTargetOptions={
+                        messageTargetOptions
+                          ? Object.values(messageTargetOptions?.entities)
+                          : undefined
+                      }
+                      rollTargetDefault={defaultMessageTargetOption}
+                      userId={userId}
+                    >
+                      <NumberDisplay
+                        number={modifier}
+                        type="signed"
+                        isModified={hasModifiedValue}
+                      /> 
+                    </DigitalDiceWrapper>
+                  )}
+                </div>
+              </div>
+            );
+          })}
+          {customSkills.length
+            ? this.renderCustomSkills()
+            : this.renderEmptyCustomSkills()}
+        </div>
+      </div>
+    );
+  }
+}
+
+Skills.contextType = GameLogContext;
+
+export default Skills;
diff --git a/ddb_main/tools/js/CharacterSheet/components/Skills/index.ts b/ddb_main/tools/js/CharacterSheet/components/Skills/index.ts
new file mode 100644
index 0000000..635b141
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/Skills/index.ts
@@ -0,0 +1,4 @@
+import Skills from "./Skills";
+
+export default Skills;
+export { Skills };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SkillsBox/SkillsBox.tsx b/ddb_main/tools/js/CharacterSheet/components/SkillsBox/SkillsBox.tsx
new file mode 100644
index 0000000..5d95f66
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SkillsBox/SkillsBox.tsx
@@ -0,0 +1,82 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+
+import {
+  BoxBackground,
+  FancyBoxSvg230x765,
+  FancyBoxSvg281x765,
+  FancyBoxSvg361x765,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  RuleData,
+  Skill,
+  ValueLookup,
+} from "@dndbeyond/character-rules-engine/es";
+import { IRollContext } from "@dndbeyond/dice";
+
+import { StyleSizeTypeEnum } from "../../../Shared/reducers/appEnv";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import Skills from "../Skills";
+
+interface Props {
+  skills: Array<Skill>;
+  customSkills: Array<Skill>;
+  onCustomSkillClick?: (skill: Skill) => void;
+  onSkillClick?: (skill: Skill) => void;
+  onEmptyClick?: () => void;
+  valueLookup: ValueLookup;
+  dimensions: AppEnvDimensionsState;
+  theme: CharacterTheme;
+  diceEnabled: boolean;
+  ruleData: RuleData;
+  rollContext: IRollContext;
+}
+export default class SkillsBox extends React.PureComponent<Props> {
+  static defaultProps = {
+    diceEnabled: false,
+  };
+
+  render() {
+    const {
+      skills,
+      valueLookup,
+      customSkills,
+      onCustomSkillClick,
+      onSkillClick,
+      onEmptyClick,
+      dimensions,
+      theme,
+      diceEnabled,
+      ruleData,
+      rollContext,
+    } = this.props;
+
+    let BoxBackgroundComponent: React.ComponentType = FancyBoxSvg230x765;
+    if (dimensions.styleSizeType > StyleSizeTypeEnum.DESKTOP) {
+      BoxBackgroundComponent = FancyBoxSvg281x765;
+    }
+    if (dimensions.styleSizeType <= StyleSizeTypeEnum.TABLET) {
+      BoxBackgroundComponent = FancyBoxSvg361x765;
+    }
+
+    return (
+      <section className="ct-skills-box">
+        <BoxBackground StyleComponent={BoxBackgroundComponent} theme={theme} />
+        <h2 style={visuallyHidden}>Skills</h2>
+        <Skills
+          skills={skills}
+          customSkills={customSkills}
+          valueLookup={valueLookup}
+          onCustomSkillClick={onCustomSkillClick}
+          onSkillClick={onSkillClick}
+          onEmptyClick={onEmptyClick}
+          diceEnabled={diceEnabled}
+          ruleData={ruleData}
+          theme={theme}
+          rollContext={rollContext}
+        />
+      </section>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SkillsBox/index.ts b/ddb_main/tools/js/CharacterSheet/components/SkillsBox/index.ts
new file mode 100644
index 0000000..0aaae2c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SkillsBox/index.ts
@@ -0,0 +1,4 @@
+import SkillsBox from "./SkillsBox";
+
+export default SkillsBox;
+export { SkillsBox };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpeedBox/SpeedBox.tsx b/ddb_main/tools/js/CharacterSheet/components/SpeedBox/SpeedBox.tsx
new file mode 100644
index 0000000..b7f45a8
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpeedBox/SpeedBox.tsx
@@ -0,0 +1,80 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+
+import {
+  BeveledBoxSvg94x89,
+  BoxBackground,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterPreferences,
+  CharacterTheme,
+  RuleData,
+  RuleDataUtils,
+  SpeedInfo,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+interface Props {
+  speeds: SpeedInfo;
+  preferences: CharacterPreferences;
+  theme: CharacterTheme;
+  ruleData: RuleData;
+  onClick?: () => void;
+}
+export default class SpeedBox extends React.PureComponent<Props> {
+  handleSpeedsClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  render() {
+    const { preferences, speeds, theme, ruleData } = this.props;
+
+    const displaySpeedValue: number =
+      speeds[
+        RuleDataUtils.getSpeedMovementKeyById(preferences.primaryMovement)
+      ];
+    const displaySpeedLabel = RuleDataUtils.getMovementDescription(
+      preferences.primaryMovement,
+      ruleData
+    );
+
+    return (
+      <section className="ct-speed-box" onClick={this.handleSpeedsClick}>
+        <h2 style={visuallyHidden}>Speed</h2>
+        <BoxBackground StyleComponent={BeveledBoxSvg94x89} theme={theme} />
+        <div
+          className={`ct-speed-box__heading ${
+            theme.isDarkMode ? "ct-speed-box__heading--dark-mode" : ""
+          }`}
+        >
+          {displaySpeedLabel}
+        </div>
+        <div
+          className={`ct-speed-box__box-value ${
+            theme.isDarkMode ? "ct-speed-box__box-value--dark-mode" : ""
+          }`}
+        >
+          <NumberDisplay
+            type="distanceInFt"
+            number={displaySpeedValue}
+            size={"large"}
+          />
+        </div>
+        <div
+          className={`ct-speed-box__label ${
+            theme.isDarkMode ? "ct-speed-box__label--dark-mode" : ""
+          }`}
+        >
+          Speed
+        </div>
+      </section>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpeedBox/index.ts b/ddb_main/tools/js/CharacterSheet/components/SpeedBox/index.ts
new file mode 100644
index 0000000..5b8032e
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpeedBox/index.ts
@@ -0,0 +1,4 @@
+import SpeedBox from "./SpeedBox";
+
+export default SpeedBox;
+export { SpeedBox };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilter.tsx
new file mode 100644
index 0000000..92f4002
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilter.tsx
@@ -0,0 +1,837 @@
+import { orderBy } from "lodash";
+import React from "react";
+
+import {
+  DarkFilterSvg,
+  ThemedFilterSvg,
+  LightFilterSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  AbilityLookup,
+  ActivationUtils,
+  CharacterTheme,
+  ConditionUtils,
+  Constants,
+  HtmlSelectOption,
+  ModifierUtils,
+  RuleData,
+  RuleDataUtils,
+  Spell,
+  SpellCasterInfo,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { FilterUtils } from "../../../Shared/utils";
+import SpellsFilterArrayFilter from "./SpellsFilterArrayFilter";
+import SpellsFilterExclusiveCheckboxFilter from "./SpellsFilterExclusiveCheckboxFilter";
+
+interface Props {
+  levelSpells: Array<Array<Spell>>;
+  callout?: React.ReactNode;
+  spellCasterInfo: SpellCasterInfo;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  onDataUpdate: (filterData: any) => void; //TODO type filterData
+  theme: CharacterTheme;
+}
+interface DefaultSpellsFilterState {
+  filterQuery: string;
+  filterTags: Array<string>;
+  filterActivations: Array<number>;
+  filterSavingThrows: Array<number>;
+  filterConditions: Array<number>;
+  filterDamageTypes: Array<string>;
+  filterRanged: boolean | null;
+  filterRitual: boolean | null;
+  filterConcentration: boolean | null;
+}
+interface State extends DefaultSpellsFilterState {
+  filteredLevelSpells: Array<Array<Spell>>;
+  showAdvancedFilters: boolean;
+}
+export default class SpellsFilter extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      filterQuery: "",
+      filteredLevelSpells: props.levelSpells,
+      filterTags: [],
+      filterActivations: [],
+      filterSavingThrows: [],
+      filterConditions: [],
+      filterDamageTypes: [],
+      filterRanged: null,
+      filterRitual: null,
+      filterConcentration: null,
+      showAdvancedFilters: false,
+    };
+  }
+
+  componentDidMount() {
+    this.handleDataUpdate();
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { levelSpells } = this.props;
+
+    if (levelSpells !== prevProps.levelSpells) {
+      this.setState(
+        {
+          filteredLevelSpells: this.filterSpells(
+            this.props,
+            this.getFilters(prevState)
+          ),
+        },
+        this.handleDataUpdate
+      );
+    }
+  }
+
+  getFilters = (state: State): DefaultSpellsFilterState => {
+    const {
+      filterQuery,
+      filterTags,
+      filterActivations,
+      filterConcentration,
+      filterConditions,
+      filterDamageTypes,
+      filterRanged,
+      filterRitual,
+      filterSavingThrows,
+    } = state;
+    return {
+      filterQuery,
+      filterTags,
+      filterActivations,
+      filterConcentration,
+      filterConditions,
+      filterDamageTypes,
+      filterRanged,
+      filterRitual,
+      filterSavingThrows,
+    };
+  };
+
+  filterSpells = (
+    props: Props,
+    filters: DefaultSpellsFilterState
+  ): Array<Array<Spell>> => {
+    const {
+      filterQuery,
+      filterTags,
+      filterActivations,
+      filterConcentration,
+      filterConditions,
+      filterDamageTypes,
+      filterRanged,
+      filterRitual,
+      filterSavingThrows,
+    } = filters;
+    const { levelSpells } = props;
+
+    return levelSpells.map((spells, level) => {
+      return spells.filter((spell) => {
+        if (
+          filterQuery &&
+          !FilterUtils.doesQueryMatchData(
+            filterQuery,
+            SpellUtils.getName(spell)
+          )
+        ) {
+          return false;
+        }
+
+        if (filterTags.length) {
+          let matches: boolean = false;
+          let tags = SpellUtils.getTags(spell);
+          tags.forEach((tag) => {
+            if (!matches && filterTags.includes(tag)) {
+              matches = true;
+            }
+          });
+          if (!matches) {
+            return false;
+          }
+        }
+
+        if (filterActivations.length) {
+          let activation = SpellUtils.getActivation(spell);
+          let activationType = ActivationUtils.getType(activation);
+          if (
+            activationType === null ||
+            !filterActivations.includes(activationType)
+          ) {
+            return false;
+          }
+        }
+
+        if (filterConditions.length) {
+          let conditions = SpellUtils.getConditions(spell);
+          let matches: boolean = false;
+          conditions.forEach((condition) => {
+            if (!matches && filterConditions.includes(condition.conditionId)) {
+              matches = true;
+            }
+          });
+          if (!matches) {
+            return false;
+          }
+        }
+
+        if (filterSavingThrows.length) {
+          let saveDcAbility = SpellUtils.getSaveDcAbility(spell);
+          if (
+            saveDcAbility === null ||
+            !filterSavingThrows.includes(saveDcAbility)
+          ) {
+            return false;
+          }
+        }
+
+        if (filterDamageTypes.length) {
+          let modifiers = SpellUtils.getModifiers(spell);
+          let matches: boolean = false;
+          modifiers.forEach((modifier) => {
+            const friendlySubtypeName =
+              ModifierUtils.getFriendlySubtypeName(modifier);
+            if (
+              friendlySubtypeName === null ||
+              (!matches && filterDamageTypes.includes(friendlySubtypeName))
+            ) {
+              matches = true;
+            }
+          });
+          if (!matches) {
+            return false;
+          }
+        }
+
+        if (filterConcentration === true) {
+          if (!SpellUtils.getConcentration(spell)) {
+            return false;
+          }
+        } else if (filterConcentration === false) {
+          if (SpellUtils.getConcentration(spell)) {
+            return false;
+          }
+        }
+
+        if (filterRitual === true) {
+          if (!SpellUtils.getRitual(spell)) {
+            return false;
+          }
+        } else if (filterRitual === false) {
+          if (SpellUtils.getRitual(spell)) {
+            return false;
+          }
+        }
+
+        if (filterRanged === true) {
+          if (
+            SpellUtils.getAttackType(spell) !==
+            Constants.AttackTypeRangeEnum.RANGED
+          ) {
+            return false;
+          }
+        } else if (filterRanged === false) {
+          if (
+            SpellUtils.getAttackType(spell) !==
+            Constants.AttackTypeRangeEnum.MELEE
+          ) {
+            return false;
+          }
+        }
+
+        return true;
+      });
+    });
+  };
+
+  getFilterCount = (): number => {
+    const {
+      filterTags,
+      filterActivations,
+      filterConcentration,
+      filterConditions,
+      filterDamageTypes,
+      filterRanged,
+      filterRitual,
+      filterSavingThrows,
+    } = this.state;
+
+    let count: number = 0;
+    count += filterTags.length;
+    count += filterActivations.length;
+    count += filterSavingThrows.length;
+    count += filterConditions.length;
+    count += filterDamageTypes.length;
+    count += filterConcentration === null ? 0 : 1;
+    count += filterRanged === null ? 0 : 1;
+    count += filterRitual === null ? 0 : 1;
+    return count;
+  };
+
+  isFiltering = (): boolean => {
+    const { filterQuery } = this.state;
+    const filterCount = this.getFilterCount();
+    return filterCount > 0 || !!filterQuery;
+  };
+
+  getTagOptions = (tags: Array<string>): Array<HtmlSelectOption> => {
+    return tags.sort().map((tag) => ({ label: tag, value: tag }));
+  };
+
+  getSavingThrowOptions = (
+    savingThrows: Array<number>
+  ): Array<HtmlSelectOption> => {
+    const { ruleData } = this.props;
+
+    return savingThrows.sort().map((abilityId) => {
+      let abilityName = RuleDataUtils.getAbilityShortName(abilityId, ruleData);
+      return {
+        label: abilityName ? abilityName.toUpperCase() : "None",
+        value: abilityId,
+      };
+    });
+  };
+
+  getActivationTypeOptions = (
+    activationTypes: Array<number>
+  ): Array<HtmlSelectOption> => {
+    const { ruleData } = this.props;
+
+    return orderBy(
+      activationTypes.map((type) => {
+        let activationInfo = RuleDataUtils.getActivationTypeInfo(
+          type,
+          ruleData
+        );
+        return {
+          label: activationInfo === null ? "" : activationInfo.name,
+          value: type,
+        };
+      }),
+      (option) => option.label
+    );
+  };
+
+  getConditionOptions = (
+    conditions: Array<number>
+  ): Array<HtmlSelectOption> => {
+    const { ruleData } = this.props;
+
+    return orderBy(
+      conditions.map((conditionId) => {
+        let conditionInfo = RuleDataUtils.getCondition(conditionId, ruleData);
+        return {
+          label:
+            conditionInfo === null ? "" : ConditionUtils.getName(conditionInfo),
+          value: conditionId,
+        };
+      }),
+      (option) => option.label
+    );
+  };
+
+  getDamageTypeOptions = (
+    damageTypes: Array<string>
+  ): Array<HtmlSelectOption> => {
+    return damageTypes.sort().map((damageType) => ({
+      label: damageType,
+      value: damageType,
+    }));
+  };
+
+  handleDataUpdate = (): void => {
+    const { onDataUpdate } = this.props;
+
+    if (onDataUpdate) {
+      onDataUpdate({
+        ...this.state,
+        filterCount: this.getFilterCount(),
+        isFiltering: this.isFiltering(),
+      });
+    }
+  };
+
+  handleFilterClear = (
+    propertyKey: keyof State,
+    resetState: Array<string> | Array<number> | null
+  ): void => {
+    this.setState(
+      (prevState) => ({
+        ...prevState,
+        [propertyKey]: resetState,
+        filteredLevelSpells: this.filterSpells(this.props, {
+          ...this.getFilters(prevState),
+          [propertyKey]: resetState,
+        }),
+      }),
+      this.handleDataUpdate
+    );
+  };
+
+  handleArrayFilterClear = (
+    propertyKey: keyof State,
+    evt: React.MouseEvent
+  ): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    this.handleFilterClear(propertyKey, []);
+  };
+
+  handleBoolFilterClear = (
+    propertyKey: keyof State,
+    evt: React.MouseEvent
+  ): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    this.handleFilterClear(propertyKey, null);
+  };
+
+  handleFiltersClear = (): void => {
+    const { levelSpells } = this.props;
+
+    this.setState(
+      {
+        filterQuery: "",
+        filterTags: [],
+        filterActivations: [],
+        filterSavingThrows: [],
+        filterConditions: [],
+        filterDamageTypes: [],
+        filterRanged: null,
+        filterRitual: null,
+        filterConcentration: null,
+        filteredLevelSpells: levelSpells,
+      },
+      this.handleDataUpdate
+    );
+  };
+
+  handleQueryUpdate = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    let value = evt.target.value;
+    this.setState(
+      (prevState) => ({
+        filterQuery: value,
+        filteredLevelSpells: this.filterSpells(this.props, {
+          ...this.getFilters(prevState),
+          filterQuery: value,
+        }),
+      }),
+      this.handleDataUpdate
+    );
+  };
+
+  handleFilterAdvancedToggle = (): void => {
+    this.setState(
+      (prevState: State) => ({
+        showAdvancedFilters: !prevState.showAdvancedFilters,
+      }),
+      this.handleDataUpdate
+    );
+  };
+
+  //TODO get array key by filtering for array type
+  handleFilterArrayToggle = (
+    arrayKey: string,
+    value: string | number
+  ): void => {
+    this.setState((prevState: State) => {
+      let includesItem: boolean = prevState[arrayKey].includes(value);
+      let newFilterArray: Array<string> | Array<number> = [];
+      if (includesItem) {
+        newFilterArray = prevState[arrayKey].filter(
+          (filterTag) => filterTag !== value
+        );
+      } else {
+        newFilterArray = [...prevState[arrayKey], value];
+      }
+      return {
+        ...prevState,
+        [arrayKey]: newFilterArray,
+        filteredLevelSpells: this.filterSpells(this.props, {
+          ...this.getFilters(prevState),
+          [arrayKey]: newFilterArray,
+        }),
+      };
+    }, this.handleDataUpdate);
+  };
+
+  handleExclusiveCheckboxFilterChange = (
+    propertyKey: keyof State,
+    value: boolean | null
+  ): void => {
+    this.setState((prevState: State) => {
+      return {
+        ...prevState,
+        [propertyKey]: value,
+        filteredLevelSpells: this.filterSpells(this.props, {
+          ...this.getFilters(prevState),
+          [propertyKey]: value,
+        }),
+      };
+    }, this.handleDataUpdate);
+  };
+
+  renderAdvancedFilters = (): React.ReactNode => {
+    const {
+      filterTags,
+      filterActivations,
+      filterConditions,
+      filterDamageTypes,
+      filterRanged,
+      filterSavingThrows,
+    } = this.state;
+    const { levelSpells } = this.props;
+
+    let uniqueTags = new Set<string>();
+    let uniqueSavingThrows = new Set<number>();
+    let uniqueActivationTypes = new Set<number>();
+    let uniqueConditions = new Set<number>();
+    let uniqueDamageTypes = new Set<string>();
+    for (let level = 0; level < levelSpells.length; level++) {
+      let spells = levelSpells[level];
+      for (let i = 0; i < spells.length; i++) {
+        let spell = spells[i];
+
+        let tags = SpellUtils.getTags(spell);
+        for (let j = 0; j < tags.length; j++) {
+          uniqueTags.add(tags[j]);
+        }
+
+        let conditions = SpellUtils.getConditions(spell);
+        for (let j = 0; j < conditions.length; j++) {
+          uniqueConditions.add(conditions[j].conditionId);
+        }
+
+        let modifiers = SpellUtils.getModifiers(spell);
+        for (let j = 0; j < modifiers.length; j++) {
+          let modifier = modifiers[j];
+          if (ModifierUtils.isDamageModifier(modifier)) {
+            let damageType = ModifierUtils.getFriendlySubtypeName(modifiers[j]);
+            if (damageType !== null) {
+              uniqueDamageTypes.add(damageType);
+            }
+          }
+        }
+
+        const saveDcAbility = SpellUtils.getSaveDcAbility(spell);
+        if (saveDcAbility !== null) {
+          uniqueSavingThrows.add(saveDcAbility);
+        }
+
+        const activationType = SpellUtils.getActivationType(spell);
+        if (activationType !== null) {
+          uniqueActivationTypes.add(activationType);
+        }
+      }
+    }
+
+    return (
+      <div className="ct-spells-filter__adv-filters">
+        <SpellsFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Tags"
+          propertyKey="filterTags"
+          currentValues={filterTags}
+          availableOptions={this.getTagOptions(Array.from(uniqueTags))}
+        />
+        <SpellsFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Conditions"
+          propertyKey="filterConditions"
+          currentValues={filterConditions}
+          availableOptions={this.getConditionOptions(
+            Array.from(uniqueConditions)
+          )}
+        />
+        <SpellsFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Casting Time"
+          propertyKey="filterActivations"
+          currentValues={filterActivations}
+          availableOptions={this.getActivationTypeOptions(
+            Array.from(uniqueActivationTypes)
+          )}
+        />
+        <SpellsFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Saving Throw"
+          propertyKey="filterSavingThrows"
+          currentValues={filterSavingThrows}
+          availableOptions={this.getSavingThrowOptions(
+            Array.from(uniqueSavingThrows)
+          )}
+        />
+        <SpellsFilterArrayFilter
+          onUpdate={this.handleFilterArrayToggle}
+          label="Damage Types"
+          propertyKey="filterDamageTypes"
+          currentValues={filterDamageTypes}
+          availableOptions={this.getDamageTypeOptions(
+            Array.from(uniqueDamageTypes)
+          )}
+        />
+        <SpellsFilterExclusiveCheckboxFilter
+          label="Attack Type"
+          onUpdate={this.handleExclusiveCheckboxFilterChange}
+          propertyKey="filterRanged"
+          value={filterRanged}
+          trueLabel="Ranged"
+          falseLabel="Melee"
+        />
+        {/*<SpellsFilterExclusiveCheckboxFilter*/}
+        {/*label="Ritual"*/}
+        {/*onUpdate={this.handleExclusiveCheckboxFilterChange}*/}
+        {/*propertyKey="filterRitual"*/}
+        {/*value={filterRitual}*/}
+        {/*/>*/}
+        {/*<SpellsFilterExclusiveCheckboxFilter*/}
+        {/*label="Concentration"*/}
+        {/*onUpdate={this.handleExclusiveCheckboxFilterChange}*/}
+        {/*propertyKey="filterConcentration"*/}
+        {/*value={filterConcentration}*/}
+        {/*/>*/}
+      </div>
+    );
+  };
+
+  renderFilterBarActiveArray = (
+    label: string,
+    options: Array<HtmlSelectOption>,
+    propertyKey: keyof State
+  ): React.ReactNode => {
+    return (
+      <div
+        className="ct-spells-filter__active"
+        onClick={this.handleFilterAdvancedToggle}
+      >
+        <div className="ct-spells-filter__active-label">{label}:</div>
+        <div className="ct-spells-filter__active-value">
+          {options.map((option) => option.label).join(" or ")}
+        </div>
+        <div className="ct-spells-filter__active-remove">
+          <div
+            className="ct-spells-filter__active-remove-icon"
+            onClick={this.handleArrayFilterClear.bind(this, propertyKey)}
+          />
+        </div>
+      </div>
+    );
+  };
+
+  renderFilterBarActiveExclusiveCheckbox = (
+    label: string,
+    value: boolean,
+    propertyKey: keyof State,
+    trueLabel: string = "Yes",
+    falseLabel: string = "No"
+  ) => {
+    return (
+      <div
+        className="ct-spells-filter__active"
+        onClick={this.handleFilterAdvancedToggle}
+      >
+        <div className="ct-spells-filter__active-label">{label}:</div>
+        <div className="ct-spells-filter__active-value">
+          {value ? trueLabel : falseLabel}
+        </div>
+        <div className="ct-spells-filter__active-remove">
+          <div
+            className="ct-spells-filter__active-remove-icon"
+            onClick={this.handleBoolFilterClear.bind(this, propertyKey)}
+          />
+        </div>
+      </div>
+    );
+  };
+
+  renderFilterBarActives = (): React.ReactNode => {
+    const {
+      filterTags,
+      filterActivations,
+      filterConcentration,
+      filterConditions,
+      filterDamageTypes,
+      filterRanged,
+      filterRitual,
+      filterSavingThrows,
+    } = this.state;
+
+    let activeNodes: Array<{ key: string; node: React.ReactNode }> = [];
+
+    if (filterTags.length) {
+      activeNodes.push({
+        key: "filterTags",
+        node: this.renderFilterBarActiveArray(
+          filterTags.length === 1 ? "Tag" : "Tags",
+          this.getTagOptions(filterTags),
+          "filterTags"
+        ),
+      });
+    }
+    if (filterActivations.length) {
+      activeNodes.push({
+        key: "filterActivations",
+        node: this.renderFilterBarActiveArray(
+          "Casting",
+          this.getActivationTypeOptions(filterActivations),
+          "filterActivations"
+        ),
+      });
+    }
+    if (filterConditions.length) {
+      activeNodes.push({
+        key: "filterConditions",
+        node: this.renderFilterBarActiveArray(
+          filterConditions.length === 1 ? "Condition" : "Conditions",
+          this.getConditionOptions(filterConditions),
+          "filterConditions"
+        ),
+      });
+    }
+    if (filterSavingThrows.length) {
+      activeNodes.push({
+        key: "filterSavingThrows",
+        node: this.renderFilterBarActiveArray(
+          filterSavingThrows.length === 1 ? "Save" : "Saves",
+          this.getSavingThrowOptions(filterSavingThrows),
+          "filterSavingThrows"
+        ),
+      });
+    }
+    if (filterDamageTypes.length) {
+      activeNodes.push({
+        key: "filterDamageTypes",
+        node: this.renderFilterBarActiveArray(
+          filterDamageTypes.length === 1 ? "Damage Type" : "Damage Types",
+          this.getDamageTypeOptions(filterDamageTypes),
+          "filterDamageTypes"
+        ),
+      });
+    }
+    if (filterRanged !== null) {
+      activeNodes.push({
+        key: "filterRanged",
+        node: this.renderFilterBarActiveExclusiveCheckbox(
+          "Attack Type",
+          filterRanged,
+          "filterRanged",
+          "Ranged",
+          "Melee"
+        ),
+      });
+    }
+    if (filterRitual !== null) {
+      activeNodes.push({
+        key: "filterRitual",
+        node: this.renderFilterBarActiveExclusiveCheckbox(
+          "Ritual",
+          filterRitual,
+          "filterRitual"
+        ),
+      });
+    }
+    if (filterConcentration !== null) {
+      activeNodes.push({
+        key: "filterConcentration",
+        node: this.renderFilterBarActiveExclusiveCheckbox(
+          "Concentration",
+          filterConcentration,
+          "filterConcentration"
+        ),
+      });
+    }
+
+    if (!activeNodes.length) {
+      return null;
+    }
+
+    return (
+      <div className="ct-spells-filter__actives">
+        {activeNodes.map((activeNode) => (
+          <React.Fragment key={activeNode.key}>
+            {activeNode.node}
+          </React.Fragment>
+        ))}
+      </div>
+    );
+  };
+
+  render() {
+    const { filterQuery, showAdvancedFilters } = this.state;
+    const { callout, theme } = this.props;
+
+    const filterCount = this.getFilterCount();
+    const hasFilter = this.isFiltering();
+    let advancedClassNames: Array<string> = ["ct-spells-filter__advanced"];
+    let FilterIcon: React.ComponentType<any> = theme.isDarkMode
+      ? LightFilterSvg
+      : DarkFilterSvg;
+    if (filterCount > 0) {
+      advancedClassNames.push("ct-spells-filter__advanced--active");
+      FilterIcon = ThemedFilterSvg;
+    }
+
+    let classNames: Array<string> = ["ct-spells-filter"];
+    if (showAdvancedFilters) {
+      classNames.push("ct-spells-filter--show-advanced");
+    }
+    if (hasFilter) {
+      classNames.push("ct-spells-filter--has-filter");
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ct-spells-filter__interactions">
+          <div className="ct-spells-filter__box">
+            {this.renderFilterBarActives()}
+            <div className="ct-spells-filter__primary">
+              <div className="ct-spells-filter__primary-group ct-spells-filter__primary-group--first">
+                <div className="ct-spells-filter__icon" />
+              </div>
+              <div className="ct-spells-filter__field">
+                <input
+                  className="ct-spells-filter__input"
+                  type="search"
+                  placeholder="Search Spell Names, Casting Times, Damage Types, Conditions or Tags"
+                  value={filterQuery}
+                  onChange={this.handleQueryUpdate}
+                />
+              </div>
+              {hasFilter && (
+                <div
+                  className="ct-spells-filter__clear"
+                  onClick={this.handleFiltersClear}
+                >
+                  Clear X
+                </div>
+              )}
+            </div>
+          </div>
+          <div
+            className={advancedClassNames.join(" ")}
+            onClick={this.handleFilterAdvancedToggle}
+          >
+            <FilterIcon theme={theme} />
+            {filterCount > 0 && (
+              <span className="ct-spells-filter__advanced-callout">
+                {filterCount}
+              </span>
+            )}
+          </div>
+          {callout && (
+            <div className="ct-spells-filter__callout">{callout}</div>
+          )}
+        </div>
+        {showAdvancedFilters && this.renderAdvancedFilters()}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilter/SpellsFilterAdvancedFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilter/SpellsFilterAdvancedFilter.tsx
new file mode 100644
index 0000000..c406b03
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilter/SpellsFilterAdvancedFilter.tsx
@@ -0,0 +1,9 @@
+import React from "react";
+
+export default class SpellsFilterAdvancedFilter extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-spells-filter__adv-filter">{this.props.children}</div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilter/index.ts
new file mode 100644
index 0000000..174b6ba
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilter/index.ts
@@ -0,0 +1,4 @@
+import SpellsFilterAdvancedFilter from "./SpellsFilterAdvancedFilter";
+
+export default SpellsFilterAdvancedFilter;
+export { SpellsFilterAdvancedFilter };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterLabel/SpellsFilterAdvancedFilterLabel.tsx b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterLabel/SpellsFilterAdvancedFilterLabel.tsx
new file mode 100644
index 0000000..c234c8c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterLabel/SpellsFilterAdvancedFilterLabel.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class SpellsFilterAdvancedFilterLabel extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-spells-filter__adv-filter-label">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterLabel/index.ts b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterLabel/index.ts
new file mode 100644
index 0000000..5fb66c4
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterLabel/index.ts
@@ -0,0 +1,4 @@
+import SpellsFilterAdvancedFilterLabel from "./SpellsFilterAdvancedFilterLabel";
+
+export default SpellsFilterAdvancedFilterLabel;
+export { SpellsFilterAdvancedFilterLabel };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOption/SpellsFilterAdvancedFilterOption.tsx b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOption/SpellsFilterAdvancedFilterOption.tsx
new file mode 100644
index 0000000..ae4acde
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOption/SpellsFilterAdvancedFilterOption.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class SpellsFilterAdvancedFilterOption extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-spells-filter__adv-filter-option">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOption/index.ts b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOption/index.ts
new file mode 100644
index 0000000..3d803c3
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOption/index.ts
@@ -0,0 +1,4 @@
+import SpellsFilterAdvancedFilterOption from "./SpellsFilterAdvancedFilterOption";
+
+export default SpellsFilterAdvancedFilterOption;
+export { SpellsFilterAdvancedFilterOption };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOptions/SpellsFilterAdvancedFilterOptions.tsx b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOptions/SpellsFilterAdvancedFilterOptions.tsx
new file mode 100644
index 0000000..cb4fb19
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOptions/SpellsFilterAdvancedFilterOptions.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class SpellsFilterAdvancedFilterOptions extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-spells-filter__adv-filter-options">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOptions/index.ts b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOptions/index.ts
new file mode 100644
index 0000000..0a3b729
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterAdvancedFilterOptions/index.ts
@@ -0,0 +1,4 @@
+import SpellsFilterAdvancedFilterOptions from "./SpellsFilterAdvancedFilterOptions";
+
+export default SpellsFilterAdvancedFilterOptions;
+export { SpellsFilterAdvancedFilterOptions };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterArrayFilter/SpellsFilterArrayFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterArrayFilter/SpellsFilterArrayFilter.tsx
new file mode 100644
index 0000000..db1b11a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterArrayFilter/SpellsFilterArrayFilter.tsx
@@ -0,0 +1,63 @@
+import React from "react";
+
+import { HtmlSelectOption } from "@dndbeyond/character-rules-engine/es";
+
+import SpellsFilterAdvancedFilter from "../SpellsFilterAdvancedFilter";
+import SpellsFilterAdvancedFilterLabel from "../SpellsFilterAdvancedFilterLabel";
+import SpellsFilterAdvancedFilterOption from "../SpellsFilterAdvancedFilterOption";
+import SpellsFilterAdvancedFilterOptions from "../SpellsFilterAdvancedFilterOptions";
+
+interface Props {
+  propertyKey: string;
+  label: string;
+  currentValues: Array<string | number>;
+  availableOptions: Array<HtmlSelectOption>;
+  onUpdate: (propertyKey: string, value: string | number) => void;
+}
+export default class SpellsFilterArrayFilter extends React.PureComponent<Props> {
+  handleFilterArrayToggle = (
+    value: string | number,
+    evt: React.MouseEvent
+  ): void => {
+    const { onUpdate, propertyKey } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, value);
+    }
+  };
+
+  render() {
+    const { availableOptions, currentValues, label } = this.props;
+
+    return (
+      <SpellsFilterAdvancedFilter>
+        <SpellsFilterAdvancedFilterLabel>
+          {label}
+        </SpellsFilterAdvancedFilterLabel>
+        <SpellsFilterAdvancedFilterOptions>
+          {availableOptions.map((option) => {
+            let classNames: Array<string> = [
+              "ct-spells-filter__adv-filter-button",
+            ];
+            if (currentValues.includes(option.value)) {
+              classNames.push("ct-spells-filter__adv-filter-button--active");
+            }
+            return (
+              <SpellsFilterAdvancedFilterOption key={option.value}>
+                <span
+                  className={classNames.join(" ")}
+                  onClick={this.handleFilterArrayToggle.bind(
+                    this,
+                    option.value
+                  )}
+                >
+                  {option.label}
+                </span>
+              </SpellsFilterAdvancedFilterOption>
+            );
+          })}
+        </SpellsFilterAdvancedFilterOptions>
+      </SpellsFilterAdvancedFilter>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterArrayFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterArrayFilter/index.ts
new file mode 100644
index 0000000..5123d57
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterArrayFilter/index.ts
@@ -0,0 +1,4 @@
+import SpellsFilterArrayFilter from "./SpellsFilterArrayFilter";
+
+export default SpellsFilterArrayFilter;
+export { SpellsFilterArrayFilter };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterExclusiveCheckboxFilter/SpellsFilterExclusiveCheckboxFilter.tsx b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterExclusiveCheckboxFilter/SpellsFilterExclusiveCheckboxFilter.tsx
new file mode 100644
index 0000000..fe2c991
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterExclusiveCheckboxFilter/SpellsFilterExclusiveCheckboxFilter.tsx
@@ -0,0 +1,126 @@
+import React from "react";
+
+import { Checkbox } from "@dndbeyond/character-components/es";
+
+import SpellsFilterAdvancedFilter from "../SpellsFilterAdvancedFilter";
+import SpellsFilterAdvancedFilterLabel from "../SpellsFilterAdvancedFilterLabel";
+import SpellsFilterAdvancedFilterOption from "../SpellsFilterAdvancedFilterOption";
+import SpellsFilterAdvancedFilterOptions from "../SpellsFilterAdvancedFilterOptions";
+
+interface Props {
+  propertyKey: string;
+  label: string;
+  value: boolean | null;
+  onUpdate: (propertyKey: string, value: boolean | null) => void;
+  trueLabel: string;
+  falseLabel: string;
+  nullLabel: string;
+}
+interface State {
+  value: boolean | null;
+}
+export default class SpellsFilterExclusiveCheckboxFilter extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    trueLabel: "Yes",
+    falseLabel: "No",
+    nullLabel: "Both",
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.value,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { value } = this.props;
+
+    if (value !== prevState.value) {
+      this.setState({
+        value,
+      });
+    }
+  }
+
+  handleUpdate = (value: boolean | null): void => {
+    const { onUpdate, propertyKey } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, value);
+    }
+    this.setState({
+      value,
+    });
+  };
+
+  render() {
+    const { value } = this.state;
+    const { label, trueLabel, falseLabel, nullLabel } = this.props;
+
+    return (
+      <SpellsFilterAdvancedFilter>
+        <SpellsFilterAdvancedFilterLabel>
+          {label}
+        </SpellsFilterAdvancedFilterLabel>
+        <SpellsFilterAdvancedFilterOptions>
+          <SpellsFilterAdvancedFilterOption>
+            <div className="ct-spells-filter__adv-filter-checkbox">
+              <div className="ct-spells-filter__adv-filter-checkbox-input">
+                <Checkbox
+                  onChange={this.handleUpdate.bind(this, true)}
+                  enabled={value === true}
+                />
+              </div>
+              <div
+                className="ct-spells-filter__adv-filter-checkbox-label"
+                onClick={this.handleUpdate.bind(this, true)}
+              >
+                {trueLabel}
+              </div>
+            </div>
+          </SpellsFilterAdvancedFilterOption>
+          <SpellsFilterAdvancedFilterOption>
+            <div className="ct-spells-filter__adv-filter-checkbox">
+              <div className="ct-spells-filter__adv-filter-checkbox-input">
+                <Checkbox
+                  onChange={this.handleUpdate.bind(this, false)}
+                  enabled={value === false}
+                />
+              </div>
+              <div
+                className="ct-spells-filter__adv-filter-checkbox-label"
+                onClick={this.handleUpdate.bind(this, false)}
+              >
+                {falseLabel}
+              </div>
+            </div>
+          </SpellsFilterAdvancedFilterOption>
+          <SpellsFilterAdvancedFilterOption>
+            <div className="ct-spells-filter__adv-filter-checkbox">
+              <div className="ct-spells-filter__adv-filter-checkbox-input">
+                <Checkbox
+                  onChange={this.handleUpdate.bind(this, null)}
+                  enabled={value === null}
+                />
+              </div>
+              <div
+                className="ct-spells-filter__adv-filter-checkbox-label"
+                onClick={this.handleUpdate.bind(this, null)}
+              >
+                {nullLabel}
+              </div>
+            </div>
+          </SpellsFilterAdvancedFilterOption>
+        </SpellsFilterAdvancedFilterOptions>
+      </SpellsFilterAdvancedFilter>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterExclusiveCheckboxFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterExclusiveCheckboxFilter/index.ts
new file mode 100644
index 0000000..94814e8
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/SpellsFilterExclusiveCheckboxFilter/index.ts
@@ -0,0 +1,4 @@
+import SpellsFilterExclusiveCheckboxFilter from "./SpellsFilterExclusiveCheckboxFilter";
+
+export default SpellsFilterExclusiveCheckboxFilter;
+export { SpellsFilterExclusiveCheckboxFilter };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/index.ts b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/index.ts
new file mode 100644
index 0000000..ac20fca
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SpellsFilter/index.ts
@@ -0,0 +1,18 @@
+import SpellsFilter from "./SpellsFilter";
+import SpellsFilterAdvancedFilter from "./SpellsFilterAdvancedFilter";
+import SpellsFilterAdvancedFilterLabel from "./SpellsFilterAdvancedFilterLabel";
+import SpellsFilterAdvancedFilterOption from "./SpellsFilterAdvancedFilterOption";
+import SpellsFilterAdvancedFilterOptions from "./SpellsFilterAdvancedFilterOptions";
+import SpellsFilterArrayFilter from "./SpellsFilterArrayFilter";
+import SpellsFilterExclusiveCheckboxFilter from "./SpellsFilterExclusiveCheckboxFilter";
+
+export default SpellsFilter;
+export {
+  SpellsFilter,
+  SpellsFilterAdvancedFilter,
+  SpellsFilterAdvancedFilterLabel,
+  SpellsFilterAdvancedFilterOption,
+  SpellsFilterAdvancedFilterOptions,
+  SpellsFilterArrayFilter,
+  SpellsFilterExclusiveCheckboxFilter,
+};
diff --git a/ddb_main/tools/js/CharacterSheet/components/StatusSummaryMobile/StatusSummaryMobile.tsx b/ddb_main/tools/js/CharacterSheet/components/StatusSummaryMobile/StatusSummaryMobile.tsx
new file mode 100644
index 0000000..606c3b9
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/StatusSummaryMobile/StatusSummaryMobile.tsx
@@ -0,0 +1,176 @@
+import React from "react";
+
+import {
+  Constants,
+  HitPointInfo,
+  RuleData,
+  RuleDataUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Inspiration } from "~/subApps/sheet/components/Inspiration";
+
+interface Props {
+  hitPointInfo: HitPointInfo;
+  fails: number;
+  successes: number;
+  deathCause: string;
+  inspiration: boolean;
+  ruleData: RuleData;
+  onHealthClick?: () => void;
+  onInspirationClick?: () => void;
+  isInteractive: boolean;
+}
+export default class StatusSummaryMobile extends React.PureComponent<Props> {
+  static defaultProps = {
+    isInteractive: true,
+  };
+
+  handleHealthClick = (evt: React.MouseEvent): void => {
+    const { onHealthClick } = this.props;
+
+    if (onHealthClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onHealthClick();
+    }
+  };
+
+  handleInspirationToggle = (): void => {
+    const { onInspirationClick } = this.props;
+
+    if (onInspirationClick) {
+      onInspirationClick();
+    }
+  };
+
+  renderHitPointSummary = (): React.ReactNode => {
+    const { hitPointInfo } = this.props;
+
+    let tempHp: number = hitPointInfo.tempHp === null ? 0 : hitPointInfo.tempHp;
+
+    let classNames: Array<string> = [
+      "ct-status-summary-mobile__data",
+      "ct-status-summary-mobile__hp",
+    ];
+    if (tempHp > 0) {
+      classNames.push("ct-status-summary-mobile__hp--has-temp");
+    }
+    return (
+      <div className={classNames.join(" ")}>
+        <span className="ct-status-summary-mobile__hp-current">
+          {hitPointInfo.remainingHp + tempHp}
+        </span>
+        <span className="ct-status-summary-mobile__hp-sep">/</span>
+        <span className="ct-status-summary-mobile__hp-max">
+          {hitPointInfo.totalHp + tempHp}
+        </span>
+      </div>
+    );
+  };
+
+  renderDeathSavesSummaryMarkGroup = (
+    key: string,
+    label: string,
+    activeCount: number,
+    totalCount: number
+  ): React.ReactNode => {
+    let marks: Array<React.ReactNode> = [];
+    for (let i = 0; i < totalCount; i++) {
+      let classNames: Array<string> = [
+        "ct-status-summary-mobile__deathsaves-mark",
+        `ct-status-summary-mobile__deathsaves-mark--${
+          i < activeCount ? "active" : "inactive"
+        }`,
+      ];
+      marks.push(<span key={`${key}-${i}`} className={classNames.join(" ")} />);
+    }
+
+    return (
+      <div
+        className={`ct-status-summary-mobile__deathsaves-group ct-status-summary-mobile__deathsaves--${key}`}
+      >
+        <span className="ct-status-summary-mobile__deathsaves-label">
+          {label}
+        </span>
+        <span className="ct-status-summary-mobile__deathsaves-marks">
+          {marks}
+        </span>
+      </div>
+    );
+  };
+
+  renderDeathSavesSummary = (): React.ReactNode => {
+    const { fails, successes, ruleData } = this.props;
+
+    return (
+      <div className="ct-status-summary-mobile__data ct-status-summary-mobile__deathsaves">
+        <div className="ct-status-summary-mobile__deathsaves-icon" />
+        <div className="ct-status-summary-mobile__deathsaves-content">
+          {this.renderDeathSavesSummaryMarkGroup(
+            "fail",
+            "f",
+            fails,
+            RuleDataUtils.getMaxDeathsavesFail(ruleData)
+          )}
+          {this.renderDeathSavesSummaryMarkGroup(
+            "success",
+            "s",
+            successes,
+            RuleDataUtils.getMaxDeathsavesSuccess(ruleData)
+          )}
+        </div>
+      </div>
+    );
+  };
+
+  renderDeathExhaustionSummary = (): React.ReactNode => {
+    return (
+      <div className="ct-status-summary-mobile__data ct-status-summary-mobile__exhaustion">
+        <div className="ct-status-summary-mobile__exhaustion-icon" />
+        <div className="ct-status-summary-mobile__exhaustion-content">
+          <div className="ct-status-summary-mobile__exhaustion-label">
+            Exhaustion Level 6
+          </div>
+        </div>
+      </div>
+    );
+  };
+
+  render() {
+    const { hitPointInfo, deathCause, isInteractive, inspiration } = this.props;
+
+    let statusSummaryNode: React.ReactNode;
+    let statusSummaryLabel: React.ReactNode;
+
+    if (deathCause === Constants.DeathCauseEnum.CONDITION) {
+      statusSummaryNode = this.renderDeathExhaustionSummary();
+      statusSummaryLabel = null;
+    } else if (hitPointInfo.remainingHp <= 0) {
+      statusSummaryNode = this.renderDeathSavesSummary();
+      statusSummaryLabel = "Death Saves";
+    } else {
+      statusSummaryNode = this.renderHitPointSummary();
+      statusSummaryLabel = "Hit Points";
+    }
+
+    return (
+      <div
+        className="ct-status-summary-mobile"
+        onClick={this.handleHealthClick}
+      >
+        <div className="ct-status-summary-mobile__health">
+          <div className="ct-status-summary-mobile__health-label">
+            {statusSummaryLabel}
+          </div>
+          {statusSummaryNode}
+        </div>
+        <Inspiration
+          onToggle={this.handleInspirationToggle}
+          isMobile
+          isInteractive={isInteractive}
+          inspiration={inspiration}
+        />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/StatusSummaryMobile/index.ts b/ddb_main/tools/js/CharacterSheet/components/StatusSummaryMobile/index.ts
new file mode 100644
index 0000000..32f274a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/StatusSummaryMobile/index.ts
@@ -0,0 +1,4 @@
+import StatusSummaryMobile from "./StatusSummaryMobile";
+
+export default StatusSummaryMobile;
+export { StatusSummaryMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SubsectionMobile/SubsectionMobile.tsx b/ddb_main/tools/js/CharacterSheet/components/SubsectionMobile/SubsectionMobile.tsx
new file mode 100644
index 0000000..e6406e5
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SubsectionMobile/SubsectionMobile.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+
+import { FormatUtils } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  name?: string;
+  className: string;
+}
+export default class SubsectionMobile extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { name, children, className } = this.props;
+
+    let classNames: Array<string> = [className, "ct-subsection-mobile"];
+    if (name) {
+      classNames.push(`ct-subsection-mobile--${FormatUtils.slugify(name)}`);
+    }
+
+    return <div className={classNames.join(" ")}>{children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SubsectionMobile/index.ts b/ddb_main/tools/js/CharacterSheet/components/SubsectionMobile/index.ts
new file mode 100644
index 0000000..9c8ac83
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SubsectionMobile/index.ts
@@ -0,0 +1,4 @@
+import SubsectionMobile from "./SubsectionMobile";
+
+export default SubsectionMobile;
+export { SubsectionMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/components/SubsectionTablet/SubsectionTablet.tsx b/ddb_main/tools/js/CharacterSheet/components/SubsectionTablet/SubsectionTablet.tsx
new file mode 100644
index 0000000..b258999
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SubsectionTablet/SubsectionTablet.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+
+import { FormatUtils } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  name?: string;
+  className: string;
+}
+export default class SubsectionTablet extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { name, children, className } = this.props;
+
+    let classNames: Array<string> = [className, "ct-subsection-tablet"];
+    if (name) {
+      classNames.push(`ct-subsection-tablet--${FormatUtils.slugify(name)}`);
+    }
+
+    return <div className={classNames.join(" ")}>{children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/SubsectionTablet/index.ts b/ddb_main/tools/js/CharacterSheet/components/SubsectionTablet/index.ts
new file mode 100644
index 0000000..8333d10
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/SubsectionTablet/index.ts
@@ -0,0 +1,4 @@
+import SubsectionTablet from "./SubsectionTablet";
+
+export default SubsectionTablet;
+export { SubsectionTablet };
diff --git a/ddb_main/tools/js/CharacterSheet/components/Subsections/Subsections.tsx b/ddb_main/tools/js/CharacterSheet/components/Subsections/Subsections.tsx
new file mode 100644
index 0000000..8e2df1f
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/Subsections/Subsections.tsx
@@ -0,0 +1,18 @@
+import React from "react";
+
+interface Props {
+  className: string;
+}
+export default class Subsections extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className } = this.props;
+
+    return (
+      <div className={`ct-subsections ${className}`}>{this.props.children}</div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/Subsections/index.ts b/ddb_main/tools/js/CharacterSheet/components/Subsections/index.ts
new file mode 100644
index 0000000..9ffd5bb
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/Subsections/index.ts
@@ -0,0 +1,4 @@
+import Subsections from "./Subsections";
+
+export default Subsections;
+export { Subsections };
diff --git a/ddb_main/tools/js/CharacterSheet/components/TabletBox/TabletBox.tsx b/ddb_main/tools/js/CharacterSheet/components/TabletBox/TabletBox.tsx
new file mode 100644
index 0000000..00e6e44
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/TabletBox/TabletBox.tsx
@@ -0,0 +1,74 @@
+import React from "react";
+
+import { ManageIcon } from "@dndbeyond/character-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import MobileDivider from "../MobileDivider";
+
+interface Props {
+  header: React.ReactNode;
+  onHeaderClick?: () => void;
+  className: string;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+export default class TabletBox extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+    isReadonly: false,
+  };
+
+  handleHeaderClick = (evt: React.MouseEvent): void => {
+    const { onHeaderClick } = this.props;
+
+    if (onHeaderClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onHeaderClick();
+    }
+  };
+
+  render() {
+    const { header, children, className, onHeaderClick, isReadonly, theme } =
+      this.props;
+
+    let classNames: Array<string> = ["ct-tablet-box", className];
+
+    let hasOnClick: boolean = !!onHeaderClick;
+
+    return (
+      <div className={classNames.join(" ")}>
+        <MobileDivider theme={theme} isTablet={true} />
+        <div className="ct-tablet-box__border">
+          <div
+            className={`ct-tablet-box__inner ${
+              theme.isDarkMode ? "ct-tablet-box__inner--dark-mode" : ""
+            }`}
+          >
+            <div
+              className={`ct-tablet-box__header ${
+                theme.isDarkMode ? "ct-tablet-box__header--dark-mode" : ""
+              }`}
+            >
+              <div
+                className="ct-tablet-box__header-content"
+                onClick={this.handleHeaderClick}
+              >
+                {header}
+                {!isReadonly && hasOnClick && (
+                  <ManageIcon
+                    theme={theme}
+                    enableTooltip={false}
+                    showIconOnEdge={false}
+                  />
+                )}
+              </div>
+            </div>
+            <div className="ct-tablet-box__content">{children}</div>
+          </div>
+        </div>
+        <MobileDivider theme={theme} isEnd={true} isTablet={true} />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/TabletBox/index.ts b/ddb_main/tools/js/CharacterSheet/components/TabletBox/index.ts
new file mode 100644
index 0000000..4428f32
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/TabletBox/index.ts
@@ -0,0 +1,4 @@
+import TabletBox from "./TabletBox";
+
+export default TabletBox;
+export { TabletBox };
diff --git a/ddb_main/tools/js/CharacterSheet/components/TraitContent/TraitContent.tsx b/ddb_main/tools/js/CharacterSheet/components/TraitContent/TraitContent.tsx
new file mode 100644
index 0000000..84350e8
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/TraitContent/TraitContent.tsx
@@ -0,0 +1,49 @@
+import React from "react";
+
+import {
+  Constants,
+  CharacterTraits,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  traits: CharacterTraits;
+  traitKey: string;
+  label?: string;
+  fallback: string;
+  onClick?: (traitKey: string) => void;
+}
+export default class TraitContent extends React.PureComponent<Props> {
+  static defaultProps = {
+    fallback: "+ Add",
+  };
+
+  handleTraitShow = (evt: React.MouseEvent): void => {
+    const { traitKey, onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick(traitKey);
+    }
+  };
+
+  render() {
+    const { traits, traitKey, label, fallback } = this.props;
+
+    let traitData = traits[traitKey as Constants.TraitTypeEnum];
+    let hasContent: boolean = !!traitData;
+    let content: string = !!traitData ? traitData : fallback;
+
+    let classNames: Array<string> = ["ct-trait-content"];
+    if (!hasContent) {
+      classNames.push("ct-trait-content--no-content");
+    }
+
+    return (
+      <div className={classNames.join(" ")} onClick={this.handleTraitShow}>
+        {label && <div className="ct-trait-content__heading">{label}</div>}
+        <div className="ct-trait-content__content">{content}</div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/components/TraitContent/index.ts b/ddb_main/tools/js/CharacterSheet/components/TraitContent/index.ts
new file mode 100644
index 0000000..3f17397
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/TraitContent/index.ts
@@ -0,0 +1,4 @@
+import TraitContent from "./TraitContent";
+
+export default TraitContent;
+export { TraitContent };
diff --git a/ddb_main/tools/js/CharacterSheet/components/WatchTourDialog/ClaimConfirmationDialog.tsx b/ddb_main/tools/js/CharacterSheet/components/WatchTourDialog/ClaimConfirmationDialog.tsx
new file mode 100644
index 0000000..ac5737d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/WatchTourDialog/ClaimConfirmationDialog.tsx
@@ -0,0 +1,202 @@
+import ArrowForwardIosIcon from "@mui/icons-material/ArrowForwardIos";
+import CloseIcon from "@mui/icons-material/Close";
+import Box from "@mui/material/Box";
+import Button from "@mui/material/Button";
+import Dialog from "@mui/material/Dialog";
+import DialogContent from "@mui/material/DialogContent";
+import DialogContentText from "@mui/material/DialogContentText";
+import DialogTitle from "@mui/material/DialogTitle";
+import Grid from "@mui/material/Grid";
+import IconButton from "@mui/material/IconButton";
+import Link from "@mui/material/Link";
+import React, { useEffect, useState } from "react";
+import { useSelector } from "react-redux";
+
+import { rulesEngineSelectors } from "@dndbeyond/character-rules-engine/es";
+
+import characterGalleryImg from "~/images/character-gallery.png";
+import characterSheetImg from "~/images/character-sheet.png";
+import tadaEmoji from "~/images/tada-emoji.svg?url";
+
+type Props = {
+  characterId: number;
+  campaignId?: number | null;
+};
+
+export const ClaimConfirmationDialog: React.FC<Props> = ({
+  characterId,
+  campaignId,
+}) => {
+  const [isOpen, setIsOpen] = useState<boolean>(true);
+
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+  const { isDarkMode } = theme;
+
+  const close = () => {
+    window.location.href = `/characters/${characterId}`;
+  };
+
+  useEffect(() => {
+    characterId && setIsOpen(true);
+  }, [characterId]);
+
+  return (
+    <Dialog
+      onClose={close}
+      open={isOpen}
+      fullWidth={true}
+      sx={{
+        "& .MuiPaper-root": {
+          maxWidth: "644px",
+          backgroundColor: isDarkMode ? "#374045" : "white",
+        },
+      }}
+    >
+      <DialogTitle
+        sx={{
+          m: 0,
+          p: "24px 32px 16px",
+          fontSize: "18px",
+          fontWeight: 700,
+          color: isDarkMode ? "white" : "#12181C",
+        }}
+      >
+        <Box component="img" src={tadaEmoji} alt="Ta-da emoji" />{" "}
+        Congratulations!
+        <IconButton
+          aria-label="close"
+          onClick={close}
+          sx={{
+            position: "absolute",
+            right: 8,
+            top: 8,
+            color: isDarkMode
+              ? "rgba(255, 255, 255, 0.54)"
+              : "rgba(0, 0, 0, 0.54)",
+            "&:hover": {
+              backgroundColor: isDarkMode
+                ? "rgba(220, 223, 225, 0.08)"
+                : "#ECEDEE",
+            },
+          }}
+        >
+          <CloseIcon />
+        </IconButton>
+      </DialogTitle>
+      <DialogContent sx={{ m: 0, p: "0 24px 24px" }}>
+        <Grid container justifyContent="center">
+          <DialogContentText
+            textAlign={"center"}
+            sx={{ color: isDarkMode ? "white" : "#12181C" }}
+          >
+            Your character has been claimed and is now available:
+          </DialogContentText>
+          <Grid item container spacing={2}>
+            <Grid
+              item
+              container
+              xs={12}
+              sm={6}
+              direction="column"
+              alignItems="center"
+            >
+              <Box
+                component="img"
+                sx={{ width: "100%" }}
+                src={characterGalleryImg}
+                alt="Premade character gallery"
+              ></Box>
+              <Button
+                variant="outlined"
+                href="/characters"
+                sx={{
+                  height: "40px",
+                  width: "230px",
+                  marginTop: "-20px",
+
+                  color: "#374045",
+                  fontSize: "12px",
+                  lineHeight: "15px",
+
+                  backgroundColor: "#fff",
+                  border: "2px solid #3298ED",
+                  borderRadius: "8px",
+                  boxShadow: "none",
+                  "&:hover": {
+                    color: "#fff",
+
+                    backgroundColor: "#232B2F",
+                    border: "2px solid #3298ED",
+                    boxShadow: "none",
+                  },
+                }}
+              >
+                Go to my characters{" "}
+                <ArrowForwardIosIcon
+                  sx={{ position: "absolute", right: "8px", height: "14px" }}
+                />
+              </Button>
+            </Grid>
+            <Grid
+              item
+              container
+              xs={12}
+              sm={6}
+              direction="column"
+              alignItems="center"
+            >
+              <Box
+                component="img"
+                sx={{
+                  width: "100%",
+                }}
+                src={characterSheetImg}
+                alt="Sample character sheet"
+              ></Box>
+              <Button
+                variant="contained"
+                href={`/characters/${characterId}`}
+                sx={{
+                  height: "40px",
+                  width: "230px",
+                  marginTop: "-20px",
+
+                  color: "#fff",
+                  fontSize: "12px",
+                  lineHeight: "15px",
+
+                  backgroundColor: "#3298ED",
+                  borderRadius: "8px",
+                  boxShadow: "none",
+                  "&:hover": {
+                    color: "#fff",
+
+                    backgroundColor: "#53ADF0",
+                    boxShadow: "none",
+                  },
+                }}
+              >
+                View your character{" "}
+                <ArrowForwardIosIcon
+                  sx={{ position: "absolute", right: "8px", height: "14px" }}
+                />
+              </Button>
+            </Grid>
+          </Grid>
+          {campaignId && (
+            <Link
+              href={`/campaigns/${campaignId}`}
+              variant="button"
+              underline="none"
+              sx={{ marginTop: "20px", color: "#3298ED" }}
+            >
+              or return to your campaign
+            </Link>
+          )}
+        </Grid>
+      </DialogContent>
+    </Dialog>
+  );
+};
+
+export default ClaimConfirmationDialog;
diff --git a/ddb_main/tools/js/CharacterSheet/components/WatchTourDialog/WatchTourDialog.tsx b/ddb_main/tools/js/CharacterSheet/components/WatchTourDialog/WatchTourDialog.tsx
new file mode 100644
index 0000000..e5c4e21
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/WatchTourDialog/WatchTourDialog.tsx
@@ -0,0 +1,222 @@
+import CloseIcon from "@mui/icons-material/Close";
+import VideocamIcon from "@mui/icons-material/Videocam";
+import Box from "@mui/material/Box";
+import Button from "@mui/material/Button";
+import Dialog from "@mui/material/Dialog";
+import DialogContent from "@mui/material/DialogContent";
+import DialogContentText from "@mui/material/DialogContentText";
+import DialogTitle from "@mui/material/DialogTitle";
+import IconButton from "@mui/material/IconButton";
+import React, { useEffect, useState } from "react";
+import { useSelector } from "react-redux";
+
+import { rulesEngineSelectors } from "@dndbeyond/character-rules-engine/es";
+
+import { MaxCharactersDialog } from "~/components/MaxCharactersDialog";
+import { useAuth } from "~/contexts/Authentication";
+import { useClaimCharacter } from "~/hooks/useClaimCharacter";
+import { appEnvSelectors } from "~/tools/js/Shared/selectors";
+
+import ClaimConfirmationDialog from "./ClaimConfirmationDialog";
+
+export const WatchTourDialog: React.FC = () => {
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+  const { isDarkMode } = theme;
+
+  const params = new URLSearchParams(globalThis.location.search);
+  const campaignJoinCode = params.get("campaignJoinCode");
+  const isAssigned = params.get("isAssigned") === "false" ? false : true;
+
+  const [isOpen, setIsOpen] = useState<boolean>(false);
+
+  const { characterSlotLimit, activeCharacterCount } = useSelector(
+    appEnvSelectors.getCharacterSlots
+  );
+  // Character slot limit is null for admin accounts
+  const hasOpenSlot =
+    characterSlotLimit === null || activeCharacterCount < characterSlotLimit;
+
+  const [isMaxCharacterMessageOpen, setIsMaxCharacterMessageOpen] =
+    useState(false);
+
+  const user = useAuth();
+  const signedIn = !!user;
+
+  const signupLink = `/create-account?returnUrl=${window.location.pathname}`;
+
+  const [
+    claimCharacter,
+    isClaimingCharacter,
+    isFinishedClaimingCharacter,
+    newCharacterId,
+    campaignId,
+  ] = useClaimCharacter({
+    campaignJoinCode,
+    isAssigned,
+  });
+
+  const open = () => {
+    setIsOpen(true);
+  };
+  const close = () => {
+    setIsOpen(false);
+  };
+
+  const handleClaim = () => {
+    if (hasOpenSlot) {
+      claimCharacter();
+    } else {
+      setIsMaxCharacterMessageOpen(true);
+      setIsOpen(false);
+    }
+  };
+
+  useEffect(() => {
+    if (isFinishedClaimingCharacter) {
+      setIsOpen(false);
+    }
+  }, [isFinishedClaimingCharacter]);
+
+  return (
+    <>
+      <Button
+        variant="contained"
+        onClick={open}
+        sx={{
+          color: "white",
+          fontSize: "12px",
+          lineHeight: "15px",
+          width: "fit-content",
+          padding: "12px 32px",
+          backgroundColor: "#C50009",
+          borderRadius: "8px",
+          boxShadow: "none",
+          "&:hover": { backgroundColor: "#A7080B", boxShadow: "none" },
+        }}
+      >
+        <VideocamIcon sx={{ m: "-5px 0" }} />
+        &nbsp;Watch Tour
+      </Button>
+      <Dialog
+        onClose={close}
+        open={isOpen}
+        fullWidth={true}
+        maxWidth={"sm"}
+        sx={{
+          " .MuiPaper-root": {
+            backgroundColor: isDarkMode ? "#374045" : "white",
+          },
+        }}
+      >
+        <DialogTitle
+          sx={{
+            m: 0,
+            p: "24px 32px 8px",
+            fontSize: "18px",
+            fontWeight: 700,
+            color: isDarkMode ? "white" : "#12181C",
+          }}
+        >
+          D&D Beyond Character Sheet Tour
+          <IconButton
+            aria-label="close"
+            onClick={close}
+            sx={{
+              position: "absolute",
+              right: 8,
+              top: 8,
+              color: isDarkMode
+                ? "rbga(255, 255, 255, 0.54)"
+                : "rgba(0, 0, 0, 0.54)",
+              "&:hover": "#ECEDEE",
+            }}
+          >
+            <CloseIcon />
+          </IconButton>
+        </DialogTitle>
+        <DialogContent sx={{ m: 0, p: "0 32px 24px" }}>
+          <Box
+            noValidate
+            component="form"
+            sx={{
+              display: "flex",
+              flexDirection: "column",
+              gap: 2,
+            }}
+          >
+            <div
+              style={{
+                position: "relative",
+                width: "100%",
+                height: 0,
+                paddingBottom: "56.25%",
+              }}
+            >
+              <iframe
+                src="https://www.youtube-nocookie.com/embed/ChYPIdCrBdE"
+                title="D&D Beyond Sheet Tour"
+                style={{
+                  border: 0,
+                  position: "absolute",
+                  width: "100%",
+                  height: "100%",
+                  backgroundColor: "gray",
+                }}
+                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+              ></iframe>
+            </div>
+            <DialogContentText
+              sx={{
+                color: isDarkMode ? "white" : "#12181C",
+                " a": {
+                  color: "#3298ED",
+                  textDecoration: "none",
+                },
+                " a:hover": { color: "#53ADF0" },
+              }}
+            >
+              For a complete guide to getting your game started, see{" "}
+              <a href="https://www.dndbeyond.com/posts/754-how-to-play-dungeons-dragons-using-d-d-beyond">
+                How to Play Dungeons & Dragons Using D&D Beyond
+              </a>
+              .
+            </DialogContentText>
+            <Button
+              variant="contained"
+              disabled={isClaimingCharacter}
+              {...(!signedIn && { href: signupLink })}
+              {...(signedIn && { onClick: handleClaim })}
+              sx={{
+                color: "white",
+                fontSize: "12px",
+                lineHeight: "15px",
+                width: "fit-content",
+                padding: "12px 32px",
+                m: "auto",
+                backgroundColor: "#3298ED",
+                borderRadius: "8px",
+                boxShadow: "none",
+                "&:hover": { backgroundColor: "#53ADF0", boxShadow: "none" },
+              }}
+            >
+              Claim Character
+            </Button>
+          </Box>
+        </DialogContent>
+      </Dialog>
+      <MaxCharactersDialog
+        open={isMaxCharacterMessageOpen}
+        onClose={() => setIsMaxCharacterMessageOpen(false)}
+        useMyCharactersLink
+      />
+      {isFinishedClaimingCharacter && !!newCharacterId && (
+        <ClaimConfirmationDialog
+          characterId={newCharacterId}
+          campaignId={campaignId}
+        />
+      )}
+    </>
+  );
+};
+
+export default WatchTourDialog;
diff --git a/ddb_main/tools/js/CharacterSheet/components/WatchTourDialog/index.ts b/ddb_main/tools/js/CharacterSheet/components/WatchTourDialog/index.ts
new file mode 100644
index 0000000..d21bddc
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/components/WatchTourDialog/index.ts
@@ -0,0 +1,4 @@
+import WatchTourDialog from "./WatchTourDialog";
+
+export default WatchTourDialog;
+export { WatchTourDialog };
diff --git a/ddb_main/tools/js/CharacterSheet/config/index.ts b/ddb_main/tools/js/CharacterSheet/config/index.ts
new file mode 100644
index 0000000..fefe924
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/config/index.ts
@@ -0,0 +1,13 @@
+const DESKTOP_COMPONENT_START_WIDTH = 1024;
+const DESKTOP_LARGE_COMPONENT_START_WIDTH = 1200;
+const TABLET_COMPONENT_START_WIDTH = 768;
+const MQ_IS_MOBILE_SIZE = `(max-width: ${TABLET_COMPONENT_START_WIDTH - 1}px)`;
+const SIDEBAR_FIXED_POSITION_START_WIDTH = 1600;
+
+export {
+  DESKTOP_COMPONENT_START_WIDTH,
+  DESKTOP_LARGE_COMPONENT_START_WIDTH,
+  TABLET_COMPONENT_START_WIDTH,
+  MQ_IS_MOBILE_SIZE,
+  SIDEBAR_FIXED_POSITION_START_WIDTH,
+};
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Actions/Actions.tsx b/ddb_main/tools/js/CharacterSheet/containers/Actions/Actions.tsx
new file mode 100644
index 0000000..2bf5566
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Actions/Actions.tsx
@@ -0,0 +1,733 @@
+import { visuallyHidden } from "@mui/utils";
+import React, { useContext } from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  AbilityLookup,
+  Action,
+  ActionUtils,
+  Activatable,
+  Attack,
+  AttacksPerActionInfo,
+  BaseInventoryContract,
+  BasicActionContract,
+  characterActions,
+  CharacterTheme,
+  CharClass,
+  ClassFeature,
+  ClassUtils,
+  Constants,
+  DataOriginRefData,
+  Feat,
+  FeatureUtils,
+  FeatUtils,
+  Hack__BaseCharClass,
+  InventoryLookup,
+  InventoryManager,
+  Item,
+  ItemManager,
+  ItemUtils,
+  RacialTrait,
+  RacialTraitUtils,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  SnippetData,
+  Spell,
+  SpellCasterInfo,
+  SpellUtils,
+  WeaponSpellDamageGroup,
+} from "@dndbeyond/character-rules-engine/es";
+import { IRollContext } from "@dndbeyond/dice";
+
+import { Link } from "~/components/Link";
+import { TabFilter } from "~/components/TabFilter";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import {
+  PaneComponentEnum,
+  PaneIdentifiers,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { InventoryManagerContext } from "../../../Shared/managers/InventoryManagerContext";
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "../../../Shared/selectors";
+import { SharedAppState } from "../../../Shared/stores/typings";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import { ActionsList } from "../../components/ActionsList";
+
+type AttackGroups = Record<string, Array<Attack>>;
+
+interface ActionListConfig {
+  onBasicActionClick: (basicAction: BasicActionContract) => void;
+  onActionClick: (action: Action) => void;
+  onActionUseSet: (action: Action, used: number) => void;
+  onSpellClick: (spell: Spell) => void;
+  onSpellUseSet: (spell: Spell, used: number) => void;
+  onAttackClick: (attack: Attack) => void;
+  weaponSpellDamageGroups: Array<WeaponSpellDamageGroup>;
+  snippetData: SnippetData;
+  spellCasterInfo: SpellCasterInfo;
+  showNotes: boolean;
+  abilityLookup: AbilityLookup;
+  ruleData: RuleData;
+  inventoryLookup: InventoryLookup;
+  isInteractive: boolean;
+  diceEnabled: boolean;
+  theme: CharacterTheme;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+  rollContext: IRollContext;
+}
+
+interface Props extends DispatchProp {
+  showNotes: boolean;
+
+  activatables: Array<Activatable>;
+  attacks: Array<Attack>;
+  weaponSpellDamageGroups: Array<WeaponSpellDamageGroup>;
+  attacksPerActionInfo: AttacksPerActionInfo;
+  ritualSpells: Array<Spell>;
+  abilityLookup: AbilityLookup;
+  inventoryLookup: InventoryLookup;
+  ruleData: RuleData;
+  snippetData: SnippetData;
+  spellCasterInfo: SpellCasterInfo;
+  isReadonly: boolean;
+  diceEnabled: boolean;
+  theme: CharacterTheme;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+  characterRollContext: IRollContext;
+  inventoryManager: InventoryManager;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+
+interface State {
+  attackGroups: AttackGroups;
+}
+
+class Actions extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    showNotes: true,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = this.generateStateData(props);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { attacks } = this.props;
+
+    if (attacks !== prevProps.attacks) {
+      this.setState(this.generateStateData(this.props));
+    }
+  }
+
+  generateStateData = (props: Props): State => {
+    const { attacks } = props;
+
+    let attackGroups: AttackGroups = {};
+    attackGroups["ACTIONS"] = attacks.filter(
+      (attack) => attack.activation === Constants.ActivationTypeEnum.ACTION
+    );
+    attackGroups["BONUS_ACTIONS"] = attacks.filter(
+      (attack) =>
+        attack.activation === Constants.ActivationTypeEnum.BONUS_ACTION
+    );
+    attackGroups["REACTIONS"] = attacks.filter(
+      (attack) => attack.activation === Constants.ActivationTypeEnum.REACTION
+    );
+    attackGroups["OTHER"] = attacks.filter(
+      (attack) =>
+        attack.activation !== Constants.ActivationTypeEnum.ACTION &&
+        attack.activation !== Constants.ActivationTypeEnum.BONUS_ACTION &&
+        attack.activation !== Constants.ActivationTypeEnum.REACTION
+    );
+
+    return {
+      attackGroups,
+    };
+  };
+
+  getActionListConfig = (): ActionListConfig => {
+    const {
+      weaponSpellDamageGroups,
+      ruleData,
+      abilityLookup,
+      inventoryLookup,
+      spellCasterInfo,
+      snippetData,
+      showNotes,
+      isReadonly,
+      diceEnabled,
+      theme,
+      dataOriginRefData,
+      proficiencyBonus,
+      characterRollContext,
+    } = this.props;
+
+    return {
+      onBasicActionClick: this.handleBasicActionShow,
+      onActionClick: this.handleActionShow,
+      onActionUseSet: this.handleActionUseSet,
+      onSpellClick: this.handleSpellDetailShow,
+      onSpellUseSet: this.handleSpellUseSet,
+      onAttackClick: this.handleAttackClick,
+      weaponSpellDamageGroups,
+      abilityLookup,
+      inventoryLookup,
+      ruleData,
+      snippetData,
+      spellCasterInfo,
+      showNotes,
+      isInteractive: !isReadonly,
+      diceEnabled,
+      theme,
+      dataOriginRefData,
+      proficiencyBonus,
+      rollContext: characterRollContext,
+    };
+  };
+
+  handleActionUseSet = (action: Action, uses: number): void => {
+    const { dispatch } = this.props;
+
+    const dataOrigin = ActionUtils.getDataOrigin(action);
+    const dataOriginType = ActionUtils.getDataOriginType(action);
+
+    if (dataOriginType === Constants.DataOriginTypeEnum.ITEM) {
+      const itemData = dataOrigin.primary as BaseInventoryContract;
+      const item = ItemManager.getItem(ItemUtils.getMappingId(itemData));
+      item.handleItemLimitedUseSet(uses);
+    } else {
+      const id = ActionUtils.getId(action);
+      const entityTypeId = ActionUtils.getEntityTypeId(action);
+      if (id !== null && entityTypeId !== null) {
+        dispatch(
+          characterActions.actionUseSet(id, entityTypeId, uses, dataOriginType)
+        );
+      }
+    }
+  };
+
+  handleSpellUseSet = (spell: Spell, uses: number): void => {
+    const { dispatch } = this.props;
+
+    const mappingId = SpellUtils.getMappingId(spell);
+    const mappingEntityTypeId = SpellUtils.getMappingEntityTypeId(spell);
+    const dataOriginType = SpellUtils.getDataOriginType(spell);
+
+    if (mappingId && mappingEntityTypeId) {
+      dispatch(
+        characterActions.spellUseSet(
+          mappingId,
+          mappingEntityTypeId,
+          uses,
+          dataOriginType
+        )
+      );
+    }
+  };
+
+  handleSpellDetailShow = (spell: Spell): void => {
+    const { paneHistoryStart } = this.props;
+
+    let spellMappingId = SpellUtils.getMappingId(spell);
+    const dataOriginType = SpellUtils.getDataOriginType(spell);
+    const dataOrigin = SpellUtils.getDataOrigin(spell);
+
+    if (spellMappingId !== null) {
+      let paneComponent: PaneComponentEnum;
+      let identifiers: PaneIdentifiers;
+      if (dataOriginType === Constants.DataOriginTypeEnum.CLASS) {
+        paneComponent = PaneComponentEnum.CLASS_SPELL_DETAIL;
+        identifiers = PaneIdentifierUtils.generateClassSpell(
+          ClassUtils.getMappingId(dataOrigin.primary as Hack__BaseCharClass),
+          spellMappingId
+        );
+      } else {
+        paneComponent = PaneComponentEnum.CHARACTER_SPELL_DETAIL;
+        identifiers =
+          PaneIdentifierUtils.generateCharacterSpell(spellMappingId);
+      }
+      paneHistoryStart(paneComponent, identifiers);
+    }
+  };
+
+  // this is not being used downstream is marked for deletion, was used in ActionsList
+  handleClassFeatureShow = (
+    feature: ClassFeature,
+    charClass: CharClass
+  ): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(
+      PaneComponentEnum.CLASS_FEATURE_DETAIL,
+      PaneIdentifierUtils.generateClassFeature(
+        FeatureUtils.getId(feature),
+        ClassUtils.getMappingId(charClass)
+      )
+    );
+  };
+
+  // this is not being used downstream is marked for deletion, was used in ActionsList
+  handleRacialTraitShow = (racialTrait: RacialTrait): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(
+      PaneComponentEnum.SPECIES_TRAIT_DETAIL,
+      PaneIdentifierUtils.generateRacialTrait(
+        RacialTraitUtils.getId(racialTrait)
+      )
+    );
+  };
+
+  // this is not being used downstream is marked for deletion, was used in ActionsList
+  handleFeatShow = (feat: Feat): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(
+      PaneComponentEnum.FEAT_DETAIL,
+      PaneIdentifierUtils.generateFeat(FeatUtils.getId(feat))
+    );
+  };
+
+  handleActionShow = (action: Action): void => {
+    const { paneHistoryStart } = this.props;
+
+    const id = ActionUtils.getMappingId(action);
+    const entityTypeId = ActionUtils.getMappingEntityTypeId(action);
+    if (id === null) {
+      return;
+    }
+
+    let dataOriginType = ActionUtils.getDataOriginType(action);
+
+    let paneComponentType: PaneComponentEnum = PaneComponentEnum.ACTION;
+    let paneComponentIdentifiers: PaneIdentifiers =
+      PaneIdentifierUtils.generateAction(id, entityTypeId);
+
+    if (dataOriginType === Constants.DataOriginTypeEnum.CUSTOM) {
+      paneComponentType = PaneComponentEnum.CUSTOM_ACTION;
+      paneComponentIdentifiers = PaneIdentifierUtils.generateCustomAction(id);
+    }
+
+    paneHistoryStart(paneComponentType, paneComponentIdentifiers);
+  };
+
+  handleManageCustomActionsShow = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.CUSTOM_ACTIONS);
+  };
+
+  handleBasicActionShow = (basicAction: BasicActionContract): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(
+      PaneComponentEnum.BASIC_ACTION,
+      PaneIdentifierUtils.generateBasicAction(basicAction.id)
+    );
+  };
+
+  handleAttackClick = (attack: Attack): void => {
+    const { paneHistoryStart } = this.props;
+
+    let paneComponentType: PaneComponentEnum | null = null;
+    let paneComponentIdentifiers: PaneIdentifiers | null = null;
+
+    switch (attack.type) {
+      case Constants.AttackSourceTypeEnum.ACTION: {
+        const action = attack.data as Action;
+        const mappingId = ActionUtils.getMappingId(action);
+        const mappingEntityTypeId = ActionUtils.getMappingEntityTypeId(action);
+
+        if (mappingId !== null && mappingEntityTypeId !== null) {
+          paneComponentType = PaneComponentEnum.ACTION;
+          paneComponentIdentifiers = PaneIdentifierUtils.generateAction(
+            mappingId,
+            mappingEntityTypeId
+          );
+        }
+        break;
+      }
+      case Constants.AttackSourceTypeEnum.CUSTOM: {
+        const action = attack.data as Action;
+        const mappingId = ActionUtils.getMappingId(action);
+        const mappingEntityTypeId = ActionUtils.getMappingEntityTypeId(action);
+
+        if (mappingId !== null && mappingEntityTypeId !== null) {
+          paneComponentType = PaneComponentEnum.CUSTOM_ACTION;
+          paneComponentIdentifiers = PaneIdentifierUtils.generateAction(
+            mappingId,
+            mappingEntityTypeId
+          );
+        }
+        break;
+      }
+      case Constants.AttackSourceTypeEnum.ITEM: {
+        paneComponentType = PaneComponentEnum.ITEM_DETAIL;
+        paneComponentIdentifiers = PaneIdentifierUtils.generateItem(
+          ItemUtils.getMappingId(attack.data as Item)
+        );
+        break;
+      }
+      case Constants.AttackSourceTypeEnum.SPELL: {
+        const spell: Spell = attack.data as Spell;
+        const mappingId = SpellUtils.getMappingId(spell);
+        const dataOriginType = SpellUtils.getDataOriginType(spell);
+        const dataOrigin = SpellUtils.getDataOrigin(spell);
+
+        if (mappingId !== null) {
+          if (dataOriginType === Constants.DataOriginTypeEnum.CLASS) {
+            paneComponentType = PaneComponentEnum.CLASS_SPELL_DETAIL;
+            paneComponentIdentifiers = PaneIdentifierUtils.generateClassSpell(
+              ClassUtils.getMappingId(
+                dataOrigin.primary as Hack__BaseCharClass
+              ),
+              mappingId
+            );
+          } else {
+            paneComponentType = PaneComponentEnum.CHARACTER_SPELL_DETAIL;
+            paneComponentIdentifiers =
+              PaneIdentifierUtils.generateCharacterSpell(mappingId);
+          }
+        }
+        break;
+      }
+      default:
+      // not implemented
+    }
+
+    if (paneComponentType !== null) {
+      paneHistoryStart(paneComponentType, paneComponentIdentifiers);
+    }
+  };
+
+  renderManageCustomLink = (): React.ReactNode => {
+    const { isReadonly } = this.props;
+
+    if (isReadonly) {
+      return null;
+    }
+
+    return (
+      <Link
+        useTheme={true}
+        className="ct-actions__manage-custom-link"
+        onClick={this.handleManageCustomActionsShow}
+      >
+        Manage Custom
+      </Link>
+    );
+  };
+
+  renderActionsHeader = (): React.ReactNode => {
+    const { attacksPerActionInfo, theme } = this.props;
+
+    return (
+      <React.Fragment>
+        <div className="ct-actions__attacks-heading">
+          Actions &bull;{" "}
+          <span
+            className={`ct-actions__attacks-per-action ${
+              theme?.isDarkMode
+                ? "ct-actions__attacks-per-action--dark-mode"
+                : ""
+            }`}
+          >
+            Attacks per Action: {attacksPerActionInfo.value}
+          </span>
+        </div>
+        {attacksPerActionInfo.restriction && (
+          <div className="ct-actions__attacks-restriction">
+            {attacksPerActionInfo.restriction}
+          </div>
+        )}
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    const { attackGroups } = this.state;
+    const { activatables, ritualSpells, ruleData } = this.props;
+
+    let actionGroups: Record<string, Array<Activatable>> = {};
+    actionGroups["ACTIONS"] = activatables.filter(
+      (a) =>
+        a.activation.activationType === Constants.ActivationTypeEnum.ACTION &&
+        a.type !== Constants.ActivatableTypeEnum.CLASS_SPELL &&
+        a.type !== Constants.ActivatableTypeEnum.CHARACTER_SPELL
+    );
+    actionGroups["BONUS_ACTIONS"] = activatables.filter(
+      (a) =>
+        a.activation.activationType ===
+        Constants.ActivationTypeEnum.BONUS_ACTION
+    );
+    actionGroups["REACTIONS"] = activatables.filter(
+      (a) =>
+        a.activation.activationType === Constants.ActivationTypeEnum.REACTION
+    );
+    actionGroups["OTHER"] = activatables.filter(
+      (a) =>
+        a.activation.activationType !== Constants.ActivationTypeEnum.ACTION &&
+        a.activation.activationType !==
+          Constants.ActivationTypeEnum.BONUS_ACTION &&
+        a.activation.activationType !== Constants.ActivationTypeEnum.REACTION
+    );
+
+    let otherBasicActions: Array<BasicActionContract> = [
+      ...RuleDataUtils.getActivationTypeBasicActions(
+        Constants.ActivationTypeEnum.NO_ACTION,
+        ruleData
+      ),
+      ...RuleDataUtils.getActivationTypeBasicActions(
+        Constants.ActivationTypeEnum.MINUTE,
+        ruleData
+      ),
+      ...RuleDataUtils.getActivationTypeBasicActions(
+        Constants.ActivationTypeEnum.HOUR,
+        ruleData
+      ),
+      ...RuleDataUtils.getActivationTypeBasicActions(
+        Constants.ActivationTypeEnum.SPECIAL,
+        ruleData
+      ),
+    ];
+
+    let limitedUseActionGroups: Record<string, Array<Activatable>> = {};
+    limitedUseActionGroups["ACTIONS"] = activatables.filter(
+      (a) =>
+        a.activation.activationType === Constants.ActivationTypeEnum.ACTION &&
+        a.limitedUse
+    );
+    limitedUseActionGroups["BONUS_ACTIONS"] = activatables.filter(
+      (a) =>
+        a.activation.activationType ===
+          Constants.ActivationTypeEnum.BONUS_ACTION && a.limitedUse
+    );
+    limitedUseActionGroups["REACTIONS"] = activatables.filter(
+      (a) =>
+        a.activation.activationType === Constants.ActivationTypeEnum.REACTION &&
+        a.limitedUse
+    );
+    limitedUseActionGroups["OTHER"] = activatables.filter(
+      (a) =>
+        a.activation.activationType !== Constants.ActivationTypeEnum.ACTION &&
+        a.activation.activationType !==
+          Constants.ActivationTypeEnum.BONUS_ACTION &&
+        a.activation.activationType !== Constants.ActivationTypeEnum.REACTION &&
+        a.limitedUse
+    );
+
+    let limitedUseRitualSpells = ritualSpells.filter((spell) =>
+      SpellUtils.getLimitedUse(spell)
+    );
+
+    const actionListData: ActionListConfig = {
+      ...this.getActionListConfig(),
+    };
+
+    const hasLimitedUse =
+      !!limitedUseActionGroups["ACTIONS"].length ||
+      !!limitedUseActionGroups["BONUS_ACTIONS"].length ||
+      !!limitedUseActionGroups["REACTIONS"].length ||
+      !!limitedUseActionGroups["OTHER"].length ||
+      !!limitedUseRitualSpells.length;
+
+    const hasAttackGroups =
+      !!attackGroups["ACTIONS"].length ||
+      !!attackGroups["BONUS_ACTIONS"].length ||
+      !!attackGroups["REACTIONS"].length ||
+      !!attackGroups["OTHER"].length;
+
+    return (
+      <section className="ct-actions">
+        <h2 style={visuallyHidden}>Actions</h2>
+        <TabFilter
+          filters={[
+            ...(!hasAttackGroups
+              ? []
+              : [
+                  {
+                    label: "Attack",
+                    content: (
+                      <>
+                        {this.renderManageCustomLink()}
+                        <ActionsList
+                          heading={this.renderActionsHeader()}
+                          attacks={attackGroups["ACTIONS"]}
+                          {...actionListData}
+                        />
+                        <ActionsList
+                          heading="Bonus Actions"
+                          attacks={attackGroups["BONUS_ACTIONS"]}
+                          {...actionListData}
+                        />
+                        <ActionsList
+                          heading="Reactions"
+                          attacks={attackGroups["REACTIONS"]}
+                          {...actionListData}
+                        />
+                        <ActionsList
+                          heading="Other"
+                          attacks={attackGroups["OTHER"]}
+                          {...actionListData}
+                        />
+                      </>
+                    ),
+                  },
+                ]),
+            {
+              label: "Action",
+              content: (
+                <>
+                  {this.renderManageCustomLink()}
+                  <ActionsList
+                    heading={this.renderActionsHeader()}
+                    actions={actionGroups["ACTIONS"]}
+                    attacks={attackGroups["ACTIONS"]}
+                    basicActions={RuleDataUtils.getActivationTypeBasicActions(
+                      Constants.ActivationTypeEnum.ACTION,
+                      ruleData
+                    )}
+                    {...actionListData}
+                  />
+                </>
+              ),
+            },
+            {
+              label: "Bonus Action",
+              content: (
+                <>
+                  {this.renderManageCustomLink()}
+                  <ActionsList
+                    heading="Bonus Actions"
+                    actions={actionGroups["BONUS_ACTIONS"]}
+                    attacks={attackGroups["BONUS_ACTIONS"]}
+                    basicActions={RuleDataUtils.getActivationTypeBasicActions(
+                      Constants.ActivationTypeEnum.BONUS_ACTION,
+                      ruleData
+                    )}
+                    {...actionListData}
+                  />
+                </>
+              ),
+            },
+            {
+              label: "Reaction",
+              content: (
+                <>
+                  {this.renderManageCustomLink()}
+                  <ActionsList
+                    heading="Reactions"
+                    actions={actionGroups["REACTIONS"]}
+                    attacks={attackGroups["REACTIONS"]}
+                    basicActions={RuleDataUtils.getActivationTypeBasicActions(
+                      Constants.ActivationTypeEnum.REACTION,
+                      ruleData
+                    )}
+                    {...actionListData}
+                  />
+                </>
+              ),
+            },
+            {
+              label: "Other",
+              content: (
+                <>
+                  {this.renderManageCustomLink()}
+                  <ActionsList
+                    heading="Other"
+                    actions={actionGroups["OTHER"]}
+                    attacks={attackGroups["OTHER"]}
+                    basicActions={otherBasicActions}
+                    ritualSpells={ritualSpells}
+                    showActivationInfo
+                    {...actionListData}
+                  />
+                </>
+              ),
+            },
+            ...(!hasLimitedUse
+              ? []
+              : [
+                  {
+                    label: "Limited Use",
+                    content: (
+                      <>
+                        {this.renderManageCustomLink()}
+                        <ActionsList
+                          heading="Actions"
+                          actions={limitedUseActionGroups["ACTIONS"]}
+                          {...actionListData}
+                        />
+                        <ActionsList
+                          heading="Bonus Actions"
+                          actions={limitedUseActionGroups["BONUS_ACTIONS"]}
+                          {...actionListData}
+                        />
+                        <ActionsList
+                          heading="Reactions"
+                          actions={limitedUseActionGroups["REACTIONS"]}
+                          {...actionListData}
+                        />
+                        <ActionsList
+                          heading="Other"
+                          actions={limitedUseActionGroups["OTHER"]}
+                          ritualSpells={limitedUseRitualSpells}
+                          showActivationInfo
+                          {...actionListData}
+                        />
+                      </>
+                    ),
+                  },
+                ]),
+          ]}
+        />
+      </section>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    activatables: rulesEngineSelectors.getActivatables(state),
+    attacks: rulesEngineSelectors.getAttacks(state),
+    weaponSpellDamageGroups:
+      rulesEngineSelectors.getWeaponSpellDamageGroups(state),
+    attacksPerActionInfo: rulesEngineSelectors.getAttacksPerActionInfo(state),
+    ritualSpells: rulesEngineSelectors.getRitualSpells(state),
+    abilityLookup: rulesEngineSelectors.getAbilityLookup(state),
+    inventoryLookup: rulesEngineSelectors.getInventoryLookup(state),
+    spellCasterInfo: rulesEngineSelectors.getSpellCasterInfo(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    snippetData: rulesEngineSelectors.getSnippetData(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    dataOriginRefData: rulesEngineSelectors.getDataOriginRefData(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    characterRollContext:
+      characterRollContextSelectors.getCharacterRollContext(state),
+  };
+}
+
+const ActionsContainer = (props) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return (
+    <Actions
+      inventoryManager={inventoryManager}
+      paneHistoryStart={paneHistoryStart}
+      {...props}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(ActionsContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Actions/index.ts b/ddb_main/tools/js/CharacterSheet/containers/Actions/index.ts
new file mode 100644
index 0000000..11b296e
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Actions/index.ts
@@ -0,0 +1,4 @@
+import Actions from "./Actions";
+
+export default Actions;
+export { Actions };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Attunement/Attunement.tsx b/ddb_main/tools/js/CharacterSheet/containers/Attunement/Attunement.tsx
new file mode 100644
index 0000000..411075b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Attunement/Attunement.tsx
@@ -0,0 +1,181 @@
+import { groupBy, orderBy } from "lodash";
+import React, { useContext } from "react";
+import { connect } from "react-redux";
+
+import { AttunementSlot } from "@dndbeyond/character-components/es";
+import {
+  rulesEngineSelectors,
+  Item,
+  ItemUtils,
+  CampaignUtils,
+  CharacterTheme,
+  InventoryManager,
+  serviceDataSelectors,
+  PartyInfo,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { InventoryManagerContext } from "../../../Shared/managers/InventoryManagerContext";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import { SheetAppState } from "../../typings";
+import AttunementItem from "./AttunementItem";
+
+interface Props {
+  items: Array<Item>;
+  attunedSlots: Array<Item | null>;
+  isFiltered: boolean;
+  isMobile: boolean;
+  theme: CharacterTheme;
+  inventoryManager: InventoryManager;
+  partyInfo: PartyInfo | null;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class Attunement extends React.PureComponent<Props> {
+  static defaultProps = {
+    isFiltered: false,
+    isMobile: false,
+  };
+
+  handleItemShow = (item: Item): void => {
+    const { paneHistoryStart } = this.props;
+
+    paneHistoryStart(
+      PaneComponentEnum.ITEM_DETAIL,
+      PaneIdentifierUtils.generateItem(ItemUtils.getMappingId(item))
+    );
+  };
+
+  renderItems = (): React.ReactNode => {
+    const { items, theme, inventoryManager, partyInfo } = this.props;
+
+    const attunableItems = items.filter((item) => ItemUtils.canAttune(item));
+    const sortedItems = groupBy(
+      orderBy(
+        attunableItems,
+        [
+          (item) => ItemUtils.getRarityLevel(item),
+          (item) => ItemUtils.getName(item),
+          (item) => ItemUtils.getMappingId(item),
+        ],
+        ["desc", "asc"]
+      ),
+      (item) => {
+        if (inventoryManager.isShared(item)) {
+          return "party";
+        } else {
+          return "character";
+        }
+      }
+    );
+
+    return (
+      <div className="ct-attunement__group ct-attunement__group--items">
+        <div className="ct-attunement__group-header">
+          Items Requiring Attunement
+        </div>
+        <div className="ct-attunement__group-items">
+          {sortedItems.character?.length > 0 ? (
+            sortedItems.character?.map((item) => (
+              <AttunementItem
+                key={ItemUtils.getUniqueKey(item)}
+                item={item}
+                onItemShow={this.handleItemShow}
+                theme={theme}
+              />
+            ))
+          ) : (
+            <div className="ct-attunement__group-empty">
+              Items that you can attune to will display here as you make them
+              active.
+            </div>
+          )}
+        </div>
+        {partyInfo &&
+          CampaignUtils.isSharingStateActive(
+            CampaignUtils.getSharingState(partyInfo)
+          ) && (
+            <>
+              <div className="ct-attunement__group-header">
+                Party Items Requiring Attunement
+              </div>
+              <div className="ct-attunement__group-items">
+                {sortedItems.party?.length > 0 ? (
+                  sortedItems.party?.map((item) => (
+                    <AttunementItem
+                      key={ItemUtils.getUniqueKey(item)}
+                      item={item}
+                      onItemShow={this.handleItemShow}
+                      theme={theme}
+                    />
+                  ))
+                ) : (
+                  <div className="ct-attunement__group-empty">
+                    Party items that you can attune to will display here as you
+                    make them active.
+                  </div>
+                )}
+              </div>
+            </>
+          )}
+      </div>
+    );
+  };
+
+  renderAttuned = (): React.ReactNode => {
+    const { attunedSlots, isMobile, theme } = this.props;
+
+    return (
+      <div className="ct-attunement__group ct-attunement__group--attuned">
+        <div className="ct-attunement__group-header">Attuned Items</div>
+        <div className="ct-attunement__group-items">
+          {attunedSlots.map((slot, idx) => (
+            <AttunementSlot
+              theme={theme}
+              key={`slot-${idx}-${slot ? ItemUtils.getUniqueKey(slot) : ""}`}
+              slot={slot}
+              onClick={this.handleItemShow}
+              isMobile={isMobile}
+            />
+          ))}
+        </div>
+      </div>
+    );
+  };
+
+  render() {
+    return (
+      <div className="ct-attunement">
+        {this.renderAttuned()}
+        {this.renderItems()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    attunedSlots: rulesEngineSelectors.getAttunedSlots(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    items: rulesEngineSelectors.getEquippedItems(state),
+    partyInfo: serviceDataSelectors.getPartyInfo(state),
+  };
+}
+
+const AttunementContainer = (props) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return (
+    <Attunement
+      inventoryManager={inventoryManager}
+      paneHistoryStart={paneHistoryStart}
+      {...props}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(AttunementContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Attunement/AttunementItem/AttunementItem.tsx b/ddb_main/tools/js/CharacterSheet/containers/Attunement/AttunementItem/AttunementItem.tsx
new file mode 100644
index 0000000..3ece810
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Attunement/AttunementItem/AttunementItem.tsx
@@ -0,0 +1,149 @@
+import React, { useContext } from "react";
+
+import {
+  CharacterTheme,
+  InventoryManager,
+  Item,
+  ItemUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemName } from "~/components/ItemName";
+
+import { ItemSlotManager } from "../../../../Shared/components/ItemSlotManager";
+import { InventoryManagerContext } from "../../../../Shared/managers/InventoryManagerContext";
+
+interface Props {
+  item: Item;
+  onItemShow?: (item: Item) => void;
+  className: string;
+  theme: CharacterTheme;
+  inventoryManager: InventoryManager;
+}
+export class AttunementItem extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  handleSetAttune = (uses: number): void => {
+    const { inventoryManager, item } = this.props;
+
+    //TODO use different component than SlotManager for attune/unattune
+    if (uses === 1) {
+      inventoryManager.handleAttune({ item });
+    }
+
+    if (uses === 0) {
+      inventoryManager.handleUnattune({ item });
+    }
+  };
+
+  handleItemClick = (evt: React.MouseEvent): void => {
+    const { onItemShow, item } = this.props;
+
+    evt.nativeEvent.stopImmediatePropagation();
+    evt.stopPropagation();
+
+    if (onItemShow) {
+      onItemShow(item);
+    }
+  };
+
+  renderMetaItems = (): React.ReactNode => {
+    const { item, inventoryManager } = this.props;
+
+    let metaItems: Array<string> = [];
+
+    if (ItemUtils.isLegacy(item)) {
+      metaItems.push("Legacy");
+    }
+
+    let type = ItemUtils.getType(item);
+    if (type !== null) {
+      metaItems.push(type);
+    }
+
+    if (ItemUtils.isWeaponContract(item)) {
+      if (ItemUtils.isOffhand(item)) {
+        metaItems.push("Dual Wield");
+      }
+    } else if (ItemUtils.isArmorContract(item)) {
+      let baseArmorName = ItemUtils.getBaseArmorName(item);
+      if (baseArmorName) {
+        metaItems.push(baseArmorName);
+      }
+    } else if (ItemUtils.isGearContract(item)) {
+      let subType = ItemUtils.getSubType(item);
+      if (subType) {
+        metaItems.push(subType);
+      }
+      if (ItemUtils.isOffhand(item)) {
+        metaItems.push("Dual Wield");
+      }
+    }
+
+    if (
+      ItemUtils.isEquipped(item) &&
+      !inventoryManager.isEquippedToCurrentCharacter(item)
+    ) {
+      metaItems.push(
+        `${
+          ItemUtils.isAttuned(item) ? "Attuned" : "Equipped"
+        } by ${inventoryManager.getEquippedCharacterName(item)}`
+      );
+    }
+
+    return (
+      <div className="ct-attunement__meta">
+        {metaItems.map((metaItem, idx) => (
+          <span className="ct-attunement__meta-item" key={idx}>
+            {metaItem}
+          </span>
+        ))}
+      </div>
+    );
+    //`
+  };
+
+  render() {
+    const { item, className, theme, inventoryManager } = this.props;
+
+    const canAttune = inventoryManager.canAttuneUnattuneItem(item);
+
+    return (
+      <div
+        className={`ct-attunement__item ${className}`}
+        onClick={this.handleItemClick}
+      >
+        <div className="ct-attunement__item-action">
+          <ItemSlotManager
+            isUsed={!!ItemUtils.isAttuned(item)}
+            canUse={canAttune}
+            theme={theme}
+            onSet={this.handleSetAttune}
+            useTooltip={
+              !!ItemUtils.isEquipped(item) &&
+              !inventoryManager.isEquippedToCurrentCharacter(item)
+            }
+            tooltipTitle={`${
+              ItemUtils.isAttuned(item) ? "Attuned" : "Equipped"
+            } by ${inventoryManager.getEquippedCharacterName(item)}`}
+          />
+        </div>
+        <div className="ct-attunement__item-name">
+          <div className="ct-attunement__item-heading">
+            <ItemName item={item} />
+          </div>
+          {this.renderMetaItems()}
+        </div>
+      </div>
+    );
+    //`
+  }
+}
+
+const AttunementItemContainer = (props) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  return <AttunementItem inventoryManager={inventoryManager} {...props} />;
+};
+
+export default AttunementItemContainer;
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Attunement/AttunementItem/index.ts b/ddb_main/tools/js/CharacterSheet/containers/Attunement/AttunementItem/index.ts
new file mode 100644
index 0000000..6a7af59
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Attunement/AttunementItem/index.ts
@@ -0,0 +1,4 @@
+import AttunementItem from "./AttunementItem";
+
+export default AttunementItem;
+export { AttunementItem };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Attunement/index.ts b/ddb_main/tools/js/CharacterSheet/containers/Attunement/index.ts
new file mode 100644
index 0000000..0dfd6bf
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Attunement/index.ts
@@ -0,0 +1,5 @@
+import Attunement from "./Attunement";
+import AttunementItem from "./AttunementItem";
+
+export default Attunement;
+export { Attunement, AttunementItem };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/BackdropStyles/BackdropStyles.tsx b/ddb_main/tools/js/CharacterSheet/containers/BackdropStyles/BackdropStyles.tsx
new file mode 100644
index 0000000..e4d122e
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/BackdropStyles/BackdropStyles.tsx
@@ -0,0 +1,88 @@
+import jss, { StyleSheet } from "jss";
+import preset from "jss-preset-default";
+import React from "react";
+
+import { BackdropInfo } from "@dndbeyond/character-rules-engine/es";
+
+import { DDB_MEDIA_URL } from "../../../../../constants";
+
+interface Props {
+  backdrop: BackdropInfo;
+}
+export default class BackdropStyles extends React.PureComponent<Props> {
+  sheet: StyleSheet | null = null;
+
+  componentDidMount() {
+    jss.setup(preset());
+    this.renderStyleSheet(this.props);
+  }
+
+  componentWillUnmount() {
+    this.removeStyleSheet();
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<{}>,
+    snapshot?: any
+  ): void {
+    this.removeStyleSheet();
+    this.renderStyleSheet(this.props);
+  }
+
+  renderStyleSheet = (props: Props): void => {
+    const { backdrop } = props;
+
+    if (backdrop.backdropAvatarUrl !== null) {
+      this.sheet = jss.createStyleSheet({});
+
+      if (this.sheet !== null) {
+        let breakpointRules: Record<string, string> = [
+          { width: 768, height: 152, image: backdrop.backdropAvatarUrl },
+          { width: 1024, height: 218, image: backdrop.backdropAvatarUrl },
+          { width: 1200, height: 230, image: backdrop.backdropAvatarUrl },
+          {
+            width: 1921,
+            height: 230,
+            image:
+              backdrop.smallBackdropAvatarUrl === null
+                ? ""
+                : backdrop.smallBackdropAvatarUrl,
+          },
+          {
+            width: 2561,
+            height: 230,
+            image:
+              backdrop.largeBackdropAvatarUrl === null
+                ? ""
+                : backdrop.largeBackdropAvatarUrl,
+          },
+        ].reduce((acc, breakpoint) => {
+          acc[`@media (min-width: ${breakpoint.width}px)`] = {
+            background: `url(${breakpoint.image}) no-repeat center ${breakpoint.height}px, url(${DDB_MEDIA_URL}/attachments/0/84/background_texture.png) #f9f9f9 !important`,
+          };
+          return acc;
+        }, {});
+
+        this.sheet.addRules({
+          "@global": {
+            "html body.body-rpgcharacter-sheet": breakpointRules,
+          },
+        });
+
+        this.sheet.attach();
+      }
+    }
+  };
+
+  removeStyleSheet = (): void => {
+    if (this.sheet) {
+      jss.removeStyleSheet(this.sheet);
+      this.sheet = null;
+    }
+  };
+
+  render() {
+    return null;
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/containers/BackdropStyles/index.ts b/ddb_main/tools/js/CharacterSheet/containers/BackdropStyles/index.ts
new file mode 100644
index 0000000..ad7945c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/BackdropStyles/index.ts
@@ -0,0 +1,4 @@
+import BackdropStyles from "./BackdropStyles";
+
+export default BackdropStyles;
+export { BackdropStyles };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderDesktop/CharacterHeaderDesktop.tsx b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderDesktop/CharacterHeaderDesktop.tsx
new file mode 100644
index 0000000..85dac90
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderDesktop/CharacterHeaderDesktop.tsx
@@ -0,0 +1,242 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+import { Link as RouterLink } from "react-router-dom";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  CampaignSummary,
+  LightBuilderSvg,
+  ThemedLongRestSvg,
+  ThemedShareSvg,
+  ThemedShortRestSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  CampaignDataContract,
+  CharacterPreferences,
+  characterSelectors,
+  CharacterStatusSlug,
+  CharacterTheme,
+  Constants,
+  Item,
+  ItemUtils,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { GameLogState } from "../../../Shared/stores/typings";
+import WatchTourDialog from "../../components/WatchTourDialog";
+import { sheetAppSelectors } from "../../selectors";
+import { SheetAppState } from "../../typings";
+import CharacterHeaderInfo from "../CharacterHeaderInfo";
+
+interface Props extends DispatchProp {
+  campaign: CampaignDataContract | null;
+  builderUrl: string;
+  items: Array<Item>;
+  preferences: CharacterPreferences;
+  theme: CharacterTheme;
+  isReadonly: boolean;
+  gameLog: GameLogState;
+  status: CharacterStatusSlug | null;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+
+class CharacterHeaderDesktop extends React.PureComponent<Props> {
+  constructor(props: Props) {
+    super(props);
+  }
+
+  handleCampaignShow = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.CAMPAIGN);
+  };
+
+  handleShortResetClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    paneHistoryStart(PaneComponentEnum.SHORT_REST);
+  };
+
+  handleLongResetClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    paneHistoryStart(PaneComponentEnum.LONG_REST);
+  };
+
+  handleShareClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    paneHistoryStart(PaneComponentEnum.SHARE_URL);
+  };
+
+  hasMagicItem = (): boolean => {
+    const { items } = this.props;
+
+    return !!items.find((item) => ItemUtils.isMagic(item));
+  };
+
+  renderSideContent = (): React.ReactNode => {
+    const {
+      builderUrl,
+      campaign,
+      preferences,
+      isReadonly,
+      theme,
+      gameLog,
+      status,
+    } = this.props;
+
+    if (isReadonly) {
+      if (status === CharacterStatusSlug.PREMADE) {
+        return <WatchTourDialog />;
+      }
+
+      if (!campaign) {
+        return null;
+      }
+
+      return (
+        <CampaignSummary
+          campaign={campaign}
+          onCampaignShow={this.handleCampaignShow}
+          gameLog={gameLog}
+          theme={theme}
+        />
+      );
+    }
+
+    return (
+      <React.Fragment>
+        {preferences !== null &&
+          preferences.privacyType ===
+            Constants.PreferencePrivacyTypeEnum.PUBLIC && (
+            <div className="ct-character-header-desktop__group ct-character-header-desktop__group--share">
+              <div
+                className="ct-character-header-desktop__button"
+                onClick={this.handleShareClick}
+                role="button"
+                tabIndex={0}
+              >
+                <div className="ct-character-header-desktop__button-icon">
+                  <ThemedShareSvg theme={theme} />
+                </div>
+                <span className="ct-character-header-desktop__button-label">
+                  Share
+                </span>
+              </div>
+            </div>
+          )}
+        <div className="ct-character-header-desktop__group ct-character-header-desktop__group--short-rest">
+          <div
+            className="ct-character-header-desktop__button"
+            onClick={this.handleShortResetClick}
+            role="button"
+            tabIndex={0}
+          >
+            <div className="ct-character-header-desktop__button-icon">
+              <ThemedShortRestSvg theme={theme} />
+            </div>
+            <span className="ct-character-header-desktop__button-label">
+              Short Rest
+            </span>
+          </div>
+        </div>
+        <div className="ct-character-header-desktop__group ct-character-header-desktop__group--long-rest">
+          <div
+            className="ct-character-header-desktop__button"
+            onClick={this.handleLongResetClick}
+            role="button"
+            tabIndex={0}
+          >
+            <div className="ct-character-header-desktop__button-icon">
+              <ThemedLongRestSvg theme={theme} />
+            </div>
+            <span className="ct-character-header-desktop__button-label">
+              Long Rest
+            </span>
+          </div>
+        </div>
+        {/*{this.hasMagicItem() &&*/}
+        {/*<div className="ct-character-header-desktop__group">*/}
+        {/*<div className="ct-character-header-desktop__button" onClick={this.handleDawnClick}>*/}
+        {/*<i className="i-menu-dawn" />*/}
+        {/*<span className="ct-character-header-desktop__button-label">Dawn</span>*/}
+        {/*</div>*/}
+        {/*</div>*/}
+        {/*}*/}
+        {campaign !== null && (
+          <CampaignSummary
+            campaign={campaign}
+            onCampaignShow={this.handleCampaignShow}
+            gameLog={gameLog}
+            theme={theme}
+          />
+        )}
+        <div className="ct-character-header-desktop__group ct-character-header-desktop__group--builder">
+          <Tooltip
+            isDarkMode={theme.isDarkMode}
+            title="Go to builder"
+            className="ct-character-header-desktop__builder"
+          >
+            <RouterLink
+              to={builderUrl}
+              className="ct-character-header-desktop__builder-link"
+              aria-label="Go to builder"
+            >
+              <LightBuilderSvg />
+            </RouterLink>
+          </Tooltip>
+        </div>
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    return (
+      <div className="ct-character-header-desktop">
+        <div className="ct-character-header-desktop__group ct-character-header-desktop__group-tidbits">
+          <CharacterHeaderInfo />
+        </div>
+        <div className="ct-character-header-desktop__group ct-character-header-desktop__group--gap" />
+        {this.renderSideContent()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    builderUrl: sheetAppSelectors.getBuilderUrl(state),
+    campaign: rulesEngineSelectors.getCampaign(state),
+    items: rulesEngineSelectors.getInventory(state),
+    preferences: rulesEngineSelectors.getCharacterPreferences(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    gameLog: appEnvSelectors.getGameLog(state),
+    status: characterSelectors.getStatusSlug(state),
+  };
+}
+
+const CharacterHeaderDesktopContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return (
+    <CharacterHeaderDesktop paneHistoryStart={paneHistoryStart} {...props} />
+  );
+};
+
+export default connect(mapStateToProps)(CharacterHeaderDesktopContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderInfo/CharacterHeaderInfo.tsx b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderInfo/CharacterHeaderInfo.tsx
new file mode 100644
index 0000000..cd3f743
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderInfo/CharacterHeaderInfo.tsx
@@ -0,0 +1,110 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import { CharacterTidbits } from "@dndbeyond/character-components/es";
+import {
+  rulesEngineSelectors,
+  CharacterPreferences,
+  CharClass,
+  Constants,
+  ExperienceInfo,
+  Race,
+  RuleData,
+  DecorationInfo,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { ThemeButton } from "../../../Shared/components/common/Button";
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { SheetAppState } from "../../typings";
+
+interface Props {
+  classes: Array<CharClass>;
+  name: string;
+  gender: string | null;
+  species: Race | null;
+  deathCause: Constants.DeathCauseEnum;
+  ruleData: RuleData;
+  xpInfo: ExperienceInfo;
+  preferences: CharacterPreferences;
+  decorationInfo: DecorationInfo;
+  isReadonly: boolean;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class CharacterHeaderInfo extends React.PureComponent<Props, {}> {
+  handleInfoClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+
+    evt.nativeEvent.stopImmediatePropagation();
+
+    paneHistoryStart(PaneComponentEnum.CHARACTER_MANAGE);
+  };
+
+  render() {
+    const {
+      deathCause,
+      name,
+      classes,
+      gender,
+      xpInfo,
+      species,
+      preferences,
+      ruleData,
+      decorationInfo,
+      isReadonly,
+    } = this.props;
+
+    return (
+      <div className="ct-character-header-info">
+        <div
+          className="ct-character-header-info__content"
+          onClick={this.handleInfoClick}
+        >
+          <CharacterTidbits
+            classes={classes}
+            decorationInfo={decorationInfo}
+            name={name}
+            gender={gender}
+            species={species}
+            deathCause={deathCause}
+            preferences={preferences}
+            ruleData={ruleData}
+            xpInfo={xpInfo}
+            isInteractive={!isReadonly}
+            calloutNode={
+              <ThemeButton size="small" style="outline">
+                Manage
+              </ThemeButton>
+            }
+          />
+        </div>
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    name: rulesEngineSelectors.getName(state),
+    gender: rulesEngineSelectors.getGender(state),
+    species: rulesEngineSelectors.getRace(state),
+    classes: rulesEngineSelectors.getClasses(state),
+    xpInfo: rulesEngineSelectors.getExperienceInfo(state),
+    deathCause: rulesEngineSelectors.getDeathCause(state),
+    preferences: rulesEngineSelectors.getCharacterPreferences(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    decorationInfo: rulesEngineSelectors.getDecorationInfo(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+  };
+}
+
+const CharacterHeaderInfoContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <CharacterHeaderInfo paneHistoryStart={paneHistoryStart} {...props} />;
+};
+
+export default connect(mapStateToProps)(CharacterHeaderInfoContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderInfo/index.ts b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderInfo/index.ts
new file mode 100644
index 0000000..2fdf1cc
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderInfo/index.ts
@@ -0,0 +1,4 @@
+import CharacterHeaderInfo from "./CharacterHeaderInfo";
+
+export default CharacterHeaderInfo;
+export { CharacterHeaderInfo };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderMobile/CharacterHeaderMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderMobile/CharacterHeaderMobile.tsx
new file mode 100644
index 0000000..99d6995
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderMobile/CharacterHeaderMobile.tsx
@@ -0,0 +1,114 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  rulesEngineSelectors,
+  characterActions,
+  characterSelectors,
+  CharacterStatusSlug,
+  Constants,
+  HitPointInfo,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../Shared/selectors";
+import StatusSummaryMobile from "../../components/StatusSummaryMobile";
+import WatchTourDialog from "../../components/WatchTourDialog";
+import { SheetAppState } from "../../typings";
+import CharacterHeaderInfo from "../CharacterHeaderInfo";
+
+interface Props extends DispatchProp {
+  hitPointInfo: HitPointInfo;
+  fails: number;
+  successes: number;
+  deathCause: Constants.DeathCauseEnum;
+  inspiration: boolean;
+  ruleData: RuleData;
+  isReadonly: boolean;
+  status: CharacterStatusSlug | null;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class CharacterHeaderMobile extends React.PureComponent<Props> {
+  handleHealthSummaryClick = (): void => {
+    const { paneHistoryStart, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.HEALTH_MANAGE);
+    }
+  };
+
+  handleInspirationClick = (): void => {
+    const { inspiration, dispatch } = this.props;
+
+    dispatch(characterActions.inspirationSet(!inspiration));
+  };
+
+  render() {
+    const {
+      hitPointInfo,
+      fails,
+      successes,
+      deathCause,
+      inspiration,
+      ruleData,
+      isReadonly,
+      status,
+    } = this.props;
+
+    return (
+      <div className="ct-character-header-mobile">
+        <div className="ct-character-header-mobile__group ct-character-header-mobile__group-tidbits">
+          <CharacterHeaderInfo />
+        </div>
+        <div className="ct-character-header-mobile__group ct-character-header-mobile__group--gap" />
+        {isReadonly && status === CharacterStatusSlug.PREMADE ? (
+          <div>
+            <WatchTourDialog />
+          </div>
+        ) : (
+          <div className="ct-character-header-mobile__group ct-character-header-mobile__group--summary">
+            <StatusSummaryMobile
+              hitPointInfo={hitPointInfo}
+              fails={fails}
+              successes={successes}
+              deathCause={deathCause}
+              inspiration={inspiration}
+              ruleData={ruleData}
+              onHealthClick={this.handleHealthSummaryClick}
+              onInspirationClick={this.handleInspirationClick}
+              isInteractive={!isReadonly}
+            />
+          </div>
+        )}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    hitPointInfo: rulesEngineSelectors.getHitPointInfo(state),
+    fails: rulesEngineSelectors.getDeathSavesFailCount(state),
+    successes: rulesEngineSelectors.getDeathSavesSuccessCount(state),
+    inspiration: rulesEngineSelectors.getInspiration(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    deathCause: rulesEngineSelectors.getDeathCause(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    status: characterSelectors.getStatusSlug(state),
+  };
+}
+
+const CharacterHeaderMobileContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return (
+    <CharacterHeaderMobile paneHistoryStart={paneHistoryStart} {...props} />
+  );
+};
+
+export default connect(mapStateToProps)(CharacterHeaderMobileContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderMobile/index.ts b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderMobile/index.ts
new file mode 100644
index 0000000..b92de34
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderMobile/index.ts
@@ -0,0 +1,4 @@
+import CharacterHeaderMobile from "./CharacterHeaderMobile";
+
+export default CharacterHeaderMobile;
+export { CharacterHeaderMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderTablet/CharacterHeaderTablet.tsx b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderTablet/CharacterHeaderTablet.tsx
new file mode 100644
index 0000000..897d5a9
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderTablet/CharacterHeaderTablet.tsx
@@ -0,0 +1,281 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  LightBuilderSvg,
+  ThemedShareSvg,
+  ThemedLongRestSvg,
+  ThemedShortRestSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  CampaignDataContract,
+  CharacterPreferences,
+  characterSelectors,
+  CharacterStatusSlug,
+  CharacterTheme,
+  Constants,
+  HitPointInfo,
+  Item,
+  ItemUtils,
+  RuleData,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Link } from "~/components/Link";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../Shared/selectors";
+import StatusSummaryMobile from "../../components/StatusSummaryMobile";
+import WatchTourDialog from "../../components/WatchTourDialog";
+import { sheetAppSelectors } from "../../selectors";
+import { SheetAppState } from "../../typings";
+import { CharacterHeaderInfo } from "../CharacterHeaderInfo";
+
+interface Props extends DispatchProp {
+  hitPointInfo: HitPointInfo;
+  fails: number;
+  successes: number;
+  deathCause: Constants.DeathCauseEnum;
+  inspiration: boolean;
+  campaign: CampaignDataContract | null;
+  builderUrl: string;
+  items: Array<Item>;
+  preferences: CharacterPreferences;
+  ruleData: RuleData;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  status: CharacterStatusSlug | null;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class CharacterHeaderTablet extends React.PureComponent<Props> {
+  handleCampaignShow = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.CAMPAIGN);
+  };
+
+  handleShortResetClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    paneHistoryStart(PaneComponentEnum.SHORT_REST);
+  };
+
+  handleGameLogClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    paneHistoryStart(PaneComponentEnum.GAME_LOG);
+  };
+
+  handleLongResetClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    paneHistoryStart(PaneComponentEnum.LONG_REST);
+  };
+
+  handleShareClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    paneHistoryStart(PaneComponentEnum.SHARE_URL);
+  };
+
+  handleHealthSummaryClick = (): void => {
+    const { paneHistoryStart, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.HEALTH_MANAGE);
+    }
+  };
+
+  handleInspirationClick = (): void => {
+    const { inspiration, dispatch } = this.props;
+
+    dispatch(characterActions.inspirationSet(!inspiration));
+  };
+
+  hasMagicItem = (): boolean => {
+    const { items } = this.props;
+
+    return !!items.find((item) => ItemUtils.isMagic(item));
+  };
+
+  renderSideContent = (): React.ReactNode => {
+    const {
+      hitPointInfo,
+      fails,
+      successes,
+      deathCause,
+      inspiration,
+      builderUrl,
+      preferences,
+      isReadonly,
+      ruleData,
+      theme,
+      status,
+    } = this.props;
+
+    if (isReadonly) {
+      if (status === CharacterStatusSlug.PREMADE) {
+        return (
+          <div>
+            <WatchTourDialog />
+          </div>
+        );
+      }
+      return (
+        <React.Fragment>
+          <div className="ct-character-header-tablet__group ct-character-header-tablet__group--summary">
+            <StatusSummaryMobile
+              hitPointInfo={hitPointInfo}
+              fails={fails}
+              successes={successes}
+              inspiration={inspiration}
+              ruleData={ruleData}
+              deathCause={deathCause}
+              onHealthClick={this.handleHealthSummaryClick}
+              onInspirationClick={this.handleInspirationClick}
+              isInteractive={!isReadonly}
+            />
+          </div>
+        </React.Fragment>
+      );
+    }
+
+    return (
+      <React.Fragment>
+        {preferences !== null &&
+          preferences.privacyType ===
+            Constants.PreferencePrivacyTypeEnum.PUBLIC && (
+            <div className="ct-character-header-tablet__group ct-character-header-tablet__group--share">
+              <div
+                className="ct-character-header-tablet__button"
+                onClick={this.handleShareClick}
+                role="button"
+                tabIndex={0}
+              >
+                <div className="ct-character-header-tablet__button-icon">
+                  <ThemedShareSvg theme={theme} />
+                </div>
+                <span className="ct-character-header-tablet__button-label">
+                  Share
+                </span>
+              </div>
+            </div>
+          )}
+        <div className="ct-character-header-tablet__group ct-character-header-tablet__group--short-rest">
+          <div
+            className="ct-character-header-tablet__button"
+            onClick={this.handleShortResetClick}
+            role="button"
+            tabIndex={0}
+          >
+            <div className="ct-character-header-tablet__button-icon">
+              <ThemedShortRestSvg theme={theme} />
+            </div>
+            <span className="ct-character-header-tablet__button-label">
+              Short Rest
+            </span>
+          </div>
+        </div>
+        <div className="ct-character-header-tablet__group ct-character-header-tablet__group--long-rest">
+          <div
+            className="ct-character-header-tablet__button"
+            onClick={this.handleLongResetClick}
+            role="button"
+            tabIndex={0}
+          >
+            <div className="ct-character-header-tablet__button-icon">
+              <ThemedLongRestSvg theme={theme} />
+            </div>
+            <span className="ct-character-header-tablet__button-label">
+              Long Rest
+            </span>
+          </div>
+        </div>
+        <div className="ct-character-header-tablet__group ct-character-header-tablet__group--builder">
+          <Tooltip
+            isDarkMode={theme.isDarkMode}
+            title="Go to builder"
+            className="ct-character-header-tablet__builder"
+          >
+            <Link
+              href={builderUrl}
+              className="ct-character-header-tablet__builder-link"
+              useRouter
+            >
+              <LightBuilderSvg />
+            </Link>
+          </Tooltip>
+        </div>
+        <div className="ct-character-header-tablet__group ct-character-header-tablet__group--summary">
+          <StatusSummaryMobile
+            hitPointInfo={hitPointInfo}
+            fails={fails}
+            successes={successes}
+            deathCause={deathCause}
+            inspiration={inspiration}
+            ruleData={ruleData}
+            onHealthClick={this.handleHealthSummaryClick}
+            onInspirationClick={this.handleInspirationClick}
+            isInteractive={!isReadonly}
+          />
+        </div>
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    return (
+      <div className="ct-character-header-tablet">
+        <div className="ct-character-header-tablet__group ct-character-header-tablet__group-tidbits">
+          <CharacterHeaderInfo />
+        </div>
+        <div className="ct-character-header-tablet__group ct-character-header-tablet__group--gap" />
+        {this.renderSideContent()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    hitPointInfo: rulesEngineSelectors.getHitPointInfo(state),
+    fails: rulesEngineSelectors.getDeathSavesFailCount(state),
+    successes: rulesEngineSelectors.getDeathSavesSuccessCount(state),
+    inspiration: rulesEngineSelectors.getInspiration(state),
+    builderUrl: sheetAppSelectors.getBuilderUrl(state),
+    campaign: rulesEngineSelectors.getCampaign(state),
+    items: rulesEngineSelectors.getInventory(state),
+    preferences: rulesEngineSelectors.getCharacterPreferences(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    deathCause: rulesEngineSelectors.getDeathCause(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    status: characterSelectors.getStatusSlug(state),
+  };
+}
+
+const CharacterHeaderTabletContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return (
+    <CharacterHeaderTablet paneHistoryStart={paneHistoryStart} {...props} />
+  );
+};
+
+export default connect(mapStateToProps)(CharacterHeaderTabletContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderTablet/index.ts b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderTablet/index.ts
new file mode 100644
index 0000000..c07d291
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterHeaderTablet/index.ts
@@ -0,0 +1,4 @@
+import CharacterHeaderTablet from "./CharacterHeaderTablet";
+
+export default CharacterHeaderTablet;
+export { CharacterHeaderTablet };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheet/CharacterSheet.tsx b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheet/CharacterSheet.tsx
new file mode 100644
index 0000000..52ad8ab
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheet/CharacterSheet.tsx
@@ -0,0 +1,676 @@
+import { throttle } from "lodash";
+import { createRef, PureComponent } from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  characterEnvSelectors,
+  Constants,
+  FormatUtils,
+  rulesEngineSelectors,
+  CharacterTheme,
+  CharacterPreferences,
+  characterSelectors,
+  CharacterStatusSlug,
+} from "@dndbeyond/character-rules-engine/es";
+import { GameLogContextProvider } from "@dndbeyond/game-log-components";
+
+import { Link } from "~/components/Link";
+import { NotificationSystem } from "~/components/NotificationSystem";
+import { PremadeCharacterEditStatus } from "~/components/PremadeCharacterEditStatus";
+import { usePositioning } from "~/hooks/usePositioning";
+import { MobileNav } from "~/subApps/sheet/components/MobileNav";
+
+import { useHeadContext } from "../../../../../contexts/Head";
+import { ThemeManagerProvider } from "../../../../../contexts/ThemeManager";
+import { getCharacterSlots } from "../../../../../helpers/characterServiceApi";
+import SynchronousBlocker from "../../../CharacterBuilder/containers/SynchronousBlocker";
+import { appEnvActions, toastMessageActions } from "../../../Shared/actions";
+import LoadingBlocker from "../../../Shared/components/LoadingBlocker";
+import AppErrorTypeEnum from "../../../Shared/constants/AppErrorTypeEnum";
+import UserRoles from "../../../Shared/constants/UserRoles";
+import { DiceContainer } from "../../../Shared/containers/DiceContainer";
+import {
+  appEnvSelectors,
+  appInfoSelectors,
+  toastMessageSelectors,
+} from "../../../Shared/selectors";
+import {
+  AppEnvDimensionsState,
+  AppInfoErrorState,
+  DiceFeatureConfigurationState,
+  GameLogState,
+  ToastMessageState,
+} from "../../../Shared/stores/typings";
+import config from "../../../config";
+import { sheetActions } from "../../actions";
+import ClaimPremadeButton from "../../components/ClaimPremadeButton";
+import { InvalidCharacter } from "../../components/InvalidCharacter";
+import {
+  DESKTOP_COMPONENT_START_WIDTH,
+  MQ_IS_MOBILE_SIZE,
+  TABLET_COMPONENT_START_WIDTH,
+} from "../../config";
+import { sheetAppSelectors, sheetSelectors } from "../../selectors";
+import { SheetAppState, SheetPositioningInfo } from "../../typings";
+import CharacterSheetDesktop from "../CharacterSheetDesktop";
+import CharacterSheetGuidedTour from "../CharacterSheetGuidedTour";
+import CharacterSheetMobile from "../CharacterSheetMobile";
+import CharacterSheetTablet from "../CharacterSheetTablet";
+
+interface Props extends DispatchProp {
+  sheetPosition: SheetPositioningInfo;
+  initFailed: boolean;
+  loadingStatus: Constants.CharacterLoadingStatusEnum;
+  toastMessages: ToastMessageState;
+  builderUrl: string;
+  isMobile: boolean;
+  envDimensions: AppEnvDimensionsState;
+  isReadonly: boolean;
+  canEdit: boolean;
+  nearTopLimit: number;
+  appError: AppInfoErrorState | null;
+  isCharacterSheetReady: boolean;
+  diceEnabled: boolean;
+  characterId: number | null;
+  authEndpoint: string;
+  diceFeatureConfiguration: DiceFeatureConfigurationState;
+  gameLog: GameLogState;
+  theme: CharacterTheme;
+  username: string;
+  characterName: string | null;
+  preferences: CharacterPreferences;
+  setManager: (manager: any) => void;
+  setTitle: (title: string) => void;
+  characterStatus: CharacterStatusSlug | null;
+  userRoles: UserRoles;
+}
+interface State {
+  curseHeaderHeight: number;
+  scrollTop: number;
+  isNotificationOpen: boolean;
+  isLoaded: boolean;
+  isSlotLimitsLoaded: boolean;
+}
+
+class CharacterSheet extends PureComponent<Props, State> {
+  static defaultProps = {
+    nearTopLimit: 40,
+    characterJson: null,
+    ruleDataJson: null,
+    diceEnabled: false,
+  };
+
+  // useImperativeHandle is hard to type when we us our own context this will just disapear
+  notificationSystem = createRef<any>();
+  sheetRef = createRef<HTMLDivElement>();
+  mobileMql: MediaQueryList | null = null;
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      curseHeaderHeight: 0,
+      scrollTop: 0,
+      isNotificationOpen: false,
+      isLoaded: false,
+      isSlotLimitsLoaded: false,
+    };
+  }
+
+  componentDidMount() {
+    const { dispatch } = this.props;
+    const { isLoaded } = this.state;
+    if (!isLoaded) {
+      dispatch(sheetActions.characterInit());
+      this.setState({ isLoaded: true });
+    }
+    this.initScrollWatchers();
+
+    this.mobileMql = window.matchMedia(MQ_IS_MOBILE_SIZE);
+    dispatch(appEnvActions.mobileSet(this.mobileMql.matches));
+    this.mobileMql.onchange = (e) => {
+      dispatch(appEnvActions.mobileSet(e.matches));
+    };
+
+    this.initResizeWatchers();
+  }
+
+  componentDidUpdate(prevProps, prevState) {
+    const {
+      dispatch,
+      loadingStatus,
+      canEdit,
+      diceEnabled,
+      characterName,
+      setTitle,
+      characterStatus,
+      username,
+      userRoles,
+    } = this.props;
+
+    if (loadingStatus === Constants.CharacterLoadingStatusEnum.LOADED) {
+      if (characterStatus === CharacterStatusSlug.PREMADE) {
+        dispatch(
+          appEnvActions.dataSet({
+            canOverrideReadOnly:
+              userRoles.includes(UserRoles.ADMIN) ||
+              userRoles.includes(UserRoles.DEV) ||
+              userRoles.includes(UserRoles.LOREKEEPER),
+          })
+        );
+      } else {
+        dispatch(
+          appEnvActions.dataSet({
+            isReadonly: !canEdit,
+            diceEnabled: canEdit ? diceEnabled : false,
+          })
+        );
+      }
+
+      if (characterName) {
+        setTitle(`${characterName}'s Character Sheet`);
+      }
+
+      if (
+        username &&
+        characterStatus === CharacterStatusSlug.PREMADE &&
+        !this.state.isSlotLimitsLoaded
+      ) {
+        this.setState({ isSlotLimitsLoaded: true });
+        getCharacterSlots().then((characterSlots) => {
+          dispatch(
+            appEnvActions.dataSet({
+              characterSlots,
+            })
+          );
+        });
+      }
+    }
+
+    this.checkForMessages();
+  }
+
+  updateSheetScrollState = (): void => {
+    const curScrollTop = window.scrollY;
+    const { scrollTop } = this.state;
+    const { nearTopLimit } = this.props;
+
+    if (curScrollTop === 0) {
+      document.body.classList.add("ct-character-sheet--top");
+      document.body.classList.remove("ct-character-sheet--not-top");
+    } else {
+      document.body.classList.add("ct-character-sheet--not-top");
+      document.body.classList.remove("ct-character-sheet--top");
+    }
+
+    if (curScrollTop < nearTopLimit) {
+      document.body.classList.add("ct-character-sheet--near-top");
+      document.body.classList.remove("ct-character-sheet--far-top");
+    } else {
+      document.body.classList.add("ct-character-sheet--far-top");
+      document.body.classList.remove("ct-character-sheet--near-top");
+    }
+
+    if (curScrollTop < scrollTop) {
+      // Going up
+      document.body.classList.add("ct-character-sheet--going-up");
+      document.body.classList.remove("ct-character-sheet--going-down");
+    } else {
+      // Going down
+      document.body.classList.add("ct-character-sheet--going-down");
+      document.body.classList.remove("ct-character-sheet--going-up");
+    }
+
+    this.setState({
+      scrollTop: curScrollTop,
+    });
+  };
+
+  // TODO: we should setup a remove listener for this
+  initScrollWatchers = (): void => {
+    // Assuming there should be only 1
+    const curseHeader = document.querySelector<HTMLElement>("header.main");
+    const curseHeaderHeight: number = curseHeader
+      ? curseHeader.offsetHeight
+      : 0;
+
+    this.setState({ curseHeaderHeight: curseHeaderHeight });
+    this.updateSheetScrollState();
+
+    const SCROLL_THROTTLE_AMOUNT = 70;
+    document.addEventListener(
+      "scroll",
+      throttle(() => {
+        this.updateSheetScrollState();
+      }, SCROLL_THROTTLE_AMOUNT)
+    );
+  };
+
+  updateEnvDimensions = (): void => {
+    const { dispatch } = this.props;
+
+    if (this.sheetRef.current === null) {
+      return;
+    }
+
+    dispatch(
+      appEnvActions.dimensionsSet({
+        window: {
+          width: window.innerWidth,
+          height: window.innerHeight,
+        },
+        sheet: {
+          width: this.sheetRef.current.clientWidth,
+          height: this.sheetRef.current.clientHeight,
+        },
+      })
+    );
+  };
+
+  initResizeWatchers = (): void => {
+    const { envDimensions } = this.props;
+
+    if (this.sheetRef.current === null) {
+      return;
+    }
+
+    this.updateEnvDimensions();
+
+    const RESIZE_THROTTLE_AMOUNT: number = 300;
+    window.addEventListener(
+      "resize",
+      throttle(() => {
+        this.updateEnvDimensions();
+      }, RESIZE_THROTTLE_AMOUNT)
+    );
+
+    window.addEventListener(
+      "orientationchange",
+      throttle(() => {
+        let oldSize: number = envDimensions.window.width;
+        let count: number = 0;
+        let orientationIntervalId = window.setInterval(() => {
+          if (oldSize !== envDimensions.window.width || count > 15) {
+            window.clearInterval(orientationIntervalId);
+            return;
+          }
+          if (oldSize !== window.innerWidth) {
+            this.updateEnvDimensions();
+          }
+          count++;
+        }, 100);
+      }, RESIZE_THROTTLE_AMOUNT)
+    );
+  };
+
+  checkForMessages = (): void => {
+    if (this.notificationSystem.current === null) {
+      return;
+    }
+
+    const { toastMessages, dispatch } = this.props;
+
+    Object.keys(toastMessages).forEach((messageId) => {
+      const message = toastMessages[messageId];
+      const { componentProps, Component, ...metaProps } = message.meta;
+
+      let children: React.ReactNode;
+      if (Component) {
+        let childrenProps = componentProps ? componentProps : {};
+        children = <Component {...childrenProps} />;
+      }
+
+      if (this.notificationSystem.current !== null) {
+        this.notificationSystem.current.addNotification({
+          title: message.payload.title,
+          message: message.payload.message,
+          uid: messageId,
+          children,
+          onRemove: () => dispatch(toastMessageActions.removeToast(messageId)),
+          ...metaProps,
+        });
+      }
+    });
+  };
+
+  isSheetErrored = (): boolean => {
+    const { initFailed, appError } = this.props;
+
+    return initFailed || appError !== null;
+  };
+
+  renderCharacterSheet = (): React.ReactNode => {
+    const { envDimensions, isCharacterSheetReady, builderUrl, isReadonly } =
+      this.props;
+
+    if (!isCharacterSheetReady) {
+      return (
+        <InvalidCharacter builderUrl={builderUrl} isReadonly={isReadonly} />
+      );
+    }
+
+    if (envDimensions.window.width >= DESKTOP_COMPONENT_START_WIDTH) {
+      return <CharacterSheetDesktop />;
+    } else if (envDimensions.window.width >= TABLET_COMPONENT_START_WIDTH) {
+      return <CharacterSheetTablet />;
+    }
+
+    return <CharacterSheetMobile />;
+  };
+
+  renderSyncBlocker = (): React.ReactNode => {
+    const { initFailed, appError } = this.props;
+
+    if (appError !== null) {
+      return null;
+    }
+
+    if (initFailed) {
+      return null;
+    }
+
+    return <SynchronousBlocker />;
+  };
+
+  renderInitFailed = (): React.ReactNode => {
+    return (
+      <div className="ct-character-sheet__failed">
+        <div className="ct-character-sheet__failed-content">
+          <p>
+            Whoops! We rolled a 1 on our Retrieve Character check. We're heading
+            into town to visit the blacksmith for repairs.
+          </p>
+          <p>Try again after a Short Rest.</p>
+        </div>
+      </div>
+    );
+  };
+
+  renderAppError = (): React.ReactNode => {
+    const { appError } = this.props;
+
+    if (appError === null) {
+      return null;
+    }
+
+    let contentNode: React.ReactNode;
+    switch (appError.type) {
+      case AppErrorTypeEnum.AUTH_MISSING:
+        let signInUrl = `/sign-in?returnUrl=${encodeURIComponent(
+          window.location.pathname
+        )}`;
+        contentNode = (
+          <>
+            <p>
+              You are no longer signed into D&D Beyond. Go to the{" "}
+              <Link href={signInUrl}>Sign In page</Link> to continue the
+              adventure!
+            </p>
+          </>
+        );
+        break;
+
+      case AppErrorTypeEnum.API_FAIL:
+        contentNode = (
+          <>
+            <p>
+              Whoops! We rolled a 1 on our API check. We're heading into town to
+              visit the blacksmith for repairs.
+            </p>
+            <p>Try again after a Short Rest.</p>
+          </>
+        );
+        break;
+
+      case AppErrorTypeEnum.API_DATA_FAIL:
+        contentNode = (
+          <>
+            <p>
+              Whoops! We rolled a 1 on our API Data check. We're heading into
+              town to visit the blacksmith for repairs.
+            </p>
+            <p>Try again after a Short Rest.</p>
+          </>
+        );
+        break;
+
+      case AppErrorTypeEnum.AUTH_FAIL:
+        contentNode = (
+          <>
+            <p>
+              Whoops! We rolled a 1 on our Authentication check. We're heading
+              into town to visit the blacksmith for repairs.
+            </p>
+            <p>Try again after a Short Rest.</p>
+          </>
+        );
+        break;
+
+      case AppErrorTypeEnum.ACCESS_DENIED:
+        contentNode = (
+          <>
+            <p>You don't have access to this page.</p>
+            <p>
+              If you are trying to access a character sheet, make sure its
+              privacy setting is configured correctly for you to access it.
+            </p>
+            <p>
+              It is also possible that you are trying to enter the 403rd level
+              of the endless dungeon and the ancient dragon Rylzrayrth is rising
+              up to block your path...
+            </p>
+          </>
+        );
+        break;
+      case AppErrorTypeEnum.NOT_FOUND:
+        appError.errorId = null;
+        contentNode = (
+          <>
+            <p>
+              We live in a world of uncertainty. But certainly, the page you
+              were looking for isn’t here. Perhaps this halfling has stolen it
+              and hidden it in another place. Try searching for what you were
+              looking for in another realm.
+            </p>
+          </>
+        );
+        break;
+
+      case AppErrorTypeEnum.GENERIC:
+      default:
+        contentNode = (
+          <>
+            <p>
+              Whoops! We rolled a 1 on our check. We're heading into town to
+              visit the blacksmith for repairs.
+            </p>
+            <p>Try again after a Short Rest.</p>
+          </>
+        );
+        break;
+    }
+
+    return (
+      <div
+        className={[
+          "ct-character-sheet__failed",
+          `ct-character-sheet__failed--${FormatUtils.slugify(appError.type)}`,
+        ].join(" ")}
+      >
+        <div className="ct-character-sheet__failed-content">
+          {contentNode}
+          {appError.errorId && (
+            <>
+              <div className="ct-character-sheet__failed-code">
+                <div className="ct-character-sheet__failed-code-label">
+                  Error Code
+                </div>
+                <div className="ct-character-sheet__failed-code-value">
+                  {appError.errorId}
+                </div>
+              </div>
+              <div className="ct-character-sheet__failed-code">
+                <div className="ct-character-sheet__failed-code-label">
+                  Version
+                </div>
+                <div className="ct-character-sheet__failed-code-value">
+                  {config.version}
+                </div>
+              </div>
+            </>
+          )}
+        </div>
+      </div>
+    );
+  };
+
+  renderContent = (): React.ReactNode => {
+    const { loadingStatus, initFailed, appError } = this.props;
+
+    if (appError !== null) {
+      return this.renderAppError();
+    }
+
+    if (initFailed) {
+      return this.renderInitFailed();
+    }
+
+    const isLoaded =
+      loadingStatus === Constants.CharacterLoadingStatusEnum.LOADED;
+
+    return (
+      <>
+        {isLoaded && this.renderCharacterSheet()}
+        <LoadingBlocker isFinished={isLoaded || initFailed} />
+      </>
+    );
+  };
+
+  render() {
+    const {
+      loadingStatus,
+      sheetPosition,
+      envDimensions,
+      isCharacterSheetReady,
+      diceEnabled,
+      characterId,
+      authEndpoint,
+      diceFeatureConfiguration,
+      gameLog,
+      theme,
+      isReadonly,
+      characterStatus,
+    } = this.props;
+
+    let sheetStyles: React.CSSProperties = {};
+    if (envDimensions.window.width >= DESKTOP_COMPONENT_START_WIDTH) {
+      sheetStyles = {
+        transform: `translateX(${sheetPosition.left}px)`,
+        WebkitTransform: `translateX(${sheetPosition.left}px)`,
+      };
+    }
+
+    let classNames: Array<string> = ["ct-character-sheet"];
+    if (this.isSheetErrored()) {
+      classNames.push("ct-character-sheet--failed");
+    }
+    if (!isCharacterSheetReady) {
+      classNames.push("ct-character-sheet--invalid");
+    }
+    if (diceEnabled) {
+      classNames.push("ct-character-sheet--dice-enabled");
+    }
+    if (theme.isDarkMode) {
+      classNames.push("ct-character-sheet--dark-mode");
+    }
+
+    const everythingIsLoadedWithoutErrors: boolean =
+      loadingStatus === Constants.CharacterLoadingStatusEnum.LOADED &&
+      isCharacterSheetReady &&
+      !this.isSheetErrored();
+
+    return (
+      <CharacterSheetGuidedTour>
+        <GameLogContextProvider
+          baseUrl={gameLog.apiEndpoint}
+          ddbApiUrl={gameLog.ddbApiEndpoint}
+          diceServiceUrl={diceFeatureConfiguration.apiEndpoint}
+          authUrl={authEndpoint}
+          diceThumbnailsUrl={`${diceFeatureConfiguration.assetBaseLocation}/images/thumbnails`}
+          entityId={characterId ? characterId.toString() : ""}
+        >
+          <div className={classNames.join(" ")}>
+            {this.renderSyncBlocker()}
+            <div
+              className="ct-character-sheet__inner"
+              ref={this.sheetRef}
+              style={sheetStyles}
+            >
+              <ThemeManagerProvider
+                manager={{
+                  lightOrDark: theme.isDarkMode ? "dark" : "light",
+                  primary: theme.themeColor,
+                }}
+              >
+                {everythingIsLoadedWithoutErrors && (
+                  <PremadeCharacterEditStatus
+                    characterStatus={characterStatus}
+                    isReadonly={isReadonly}
+                  />
+                )}
+                {this.renderContent()}
+                {everythingIsLoadedWithoutErrors && <MobileNav />}
+              </ThemeManagerProvider>
+            </div>
+            <NotificationSystem ref={this.notificationSystem} />
+            {diceEnabled && !isReadonly && (
+              <DiceContainer canShow={everythingIsLoadedWithoutErrors} />
+            )}
+            {everythingIsLoadedWithoutErrors &&
+              characterStatus === CharacterStatusSlug.PREMADE &&
+              isReadonly && <ClaimPremadeButton />}
+          </div>
+        </GameLogContextProvider>
+      </CharacterSheetGuidedTour>
+    );
+  }
+}
+
+const CharacterSheetWrapper = (props) => {
+  const { setTitle } = useHeadContext();
+  const { getSheetPositioning } = usePositioning();
+  return (
+    <CharacterSheet
+      {...props}
+      setTitle={setTitle}
+      sheetPosition={getSheetPositioning()}
+    />
+  );
+};
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    initFailed: sheetSelectors.getInitFailed(state),
+    loadingStatus: characterEnvSelectors.getLoadingStatus(state),
+    toastMessages: toastMessageSelectors.getToastMessages(state),
+    builderUrl: sheetAppSelectors.getBuilderUrl(state),
+    isMobile: appEnvSelectors.getIsMobile(state),
+    envDimensions: appEnvSelectors.getDimensions(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    userRoles: appEnvSelectors.getUserRoles(state),
+    appError: appInfoSelectors.getError(state),
+    isCharacterSheetReady: rulesEngineSelectors.isCharacterSheetReady(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+    characterId: appEnvSelectors.getCharacterId(state),
+    diceFeatureConfiguration:
+      appEnvSelectors.getDiceFeatureConfiguration(state),
+    gameLog: appEnvSelectors.getGameLog(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    canEdit: rulesEngineSelectors.getCanEdit(state),
+    username: appEnvSelectors.getUsername(state),
+    characterName: rulesEngineSelectors.getName(state),
+    preferences: rulesEngineSelectors.getPreferences(state),
+    characterStatus: characterSelectors.getStatusSlug(state),
+  };
+}
+export default connect(mapStateToProps)(CharacterSheetWrapper);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheet/index.ts b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheet/index.ts
new file mode 100644
index 0000000..c0f6e6a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheet/index.ts
@@ -0,0 +1,4 @@
+import CharacterSheet from "./CharacterSheet";
+
+export default CharacterSheet;
+export { CharacterSheet };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetContainer/CharacterSheetContainer.tsx b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetContainer/CharacterSheetContainer.tsx
new file mode 100644
index 0000000..d9d50a5
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetContainer/CharacterSheetContainer.tsx
@@ -0,0 +1,45 @@
+import { useLayoutEffect } from "react";
+
+import { SheetProvider } from "~/subApps/sheet/contexts/Sheet";
+
+import ErrorBoundary from "../../../Shared/components/ErrorBoundary";
+import CharacterSheet from "../CharacterSheet";
+
+export function CharacterSheetContainer({
+  authEndpoint,
+}: {
+  authEndpoint: string;
+}) {
+  useLayoutEffect(() => {
+    document
+      .getElementsByTagName("body")[0]
+      .classList.add(
+        "site",
+        "body-rpgcharacter-sheet",
+        "site-dndbeyond",
+        "body-rpgcharacter",
+        "body-rpgcharacter-details"
+      );
+    return () => {
+      document
+        .getElementsByTagName("body")[0]
+        .classList.remove(
+          "site",
+          "body-rpgcharacter-sheet",
+          "site-dndbeyond",
+          "body-rpgcharacter",
+          "body-rpgcharacter-details"
+        );
+    };
+  }, []);
+
+  return (
+    <ErrorBoundary>
+      <SheetProvider>
+        <CharacterSheet authEndpoint={authEndpoint} />
+      </SheetProvider>
+    </ErrorBoundary>
+  );
+}
+
+export default CharacterSheetContainer;
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetContainer/index.ts b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetContainer/index.ts
new file mode 100644
index 0000000..90ab7bb
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetContainer/index.ts
@@ -0,0 +1,4 @@
+import CharacterSheetContainer from "./CharacterSheetContainer";
+
+export default CharacterSheetContainer;
+export { CharacterSheetContainer };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetDesktop/CharacterSheetDesktop.tsx b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetDesktop/CharacterSheetDesktop.tsx
new file mode 100644
index 0000000..6a00958
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetDesktop/CharacterSheetDesktop.tsx
@@ -0,0 +1,181 @@
+import { spring, TransitionMotion } from "@serprex/react-motion";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { ThemeStyles } from "@dndbeyond/character-components/es";
+import {
+  rulesEngineSelectors,
+  DecorationInfo,
+  DecorationUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { SidebarInfo } from "~/contexts/Sidebar/Sidebar";
+import { usePositioning } from "~/hooks/usePositioning";
+import { Sidebar } from "~/subApps/sheet/components/Sidebar";
+import { SidebarPositionInfo } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import Subsections from "../../components/Subsections";
+import { DESKTOP_LARGE_COMPONENT_START_WIDTH } from "../../config";
+import { SheetAppState } from "../../typings";
+import BackdropStyles from "../BackdropStyles";
+import { CharacterHeaderDesktop } from "../CharacterHeaderDesktop";
+import Combat from "../Combat";
+import PrimaryBox from "../PrimaryBox";
+import ProficiencyGroupsDesktop from "../ProficiencyGroupsDesktop";
+import QuickInfo from "../QuickInfo";
+import SavingThrowsDesktop from "../SavingThrowsDesktop";
+import SensesDesktop from "../SensesDesktop";
+import SkillsDesktop from "../SkillsDesktop";
+
+interface Props extends DispatchProp {
+  sidebarInfo: SidebarInfo;
+  sidebarPosition: SidebarPositionInfo;
+  decorationInfo: DecorationInfo;
+  envDimensions: AppEnvDimensionsState;
+}
+interface State {
+  swipedAmount: number;
+}
+
+class CharacterSheetDesktop extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      swipedAmount: 0,
+    };
+  }
+
+  getPositionX = (swipedAmount: number): number => {
+    const { sidebarInfo } = this.props;
+
+    let position: number =
+      (sidebarInfo.isVisible ? 0 : sidebarInfo.width) + swipedAmount;
+
+    if (swipedAmount > 0) {
+      return Math.min(sidebarInfo.width, position);
+    } else {
+      return Math.max(0, position);
+    }
+  };
+
+  renderContent = (): React.ReactNode => {
+    return (
+      <React.Fragment>
+        <CharacterHeaderDesktop />
+        <QuickInfo />
+        <Subsections>
+          <SavingThrowsDesktop />
+          <SensesDesktop />
+          <ProficiencyGroupsDesktop />
+          <SkillsDesktop />
+          <Combat />
+          <PrimaryBox />
+        </Subsections>
+      </React.Fragment>
+    );
+  };
+
+  renderSmall = (): React.ReactNode => {
+    const { swipedAmount } = this.state;
+    const { sidebarPosition } = this.props;
+
+    return (
+      <div className="ct-character-sheet-desktop">
+        {this.renderContent()}
+        <TransitionMotion
+          styles={[
+            {
+              key: "1",
+              style: {
+                transform: spring(this.getPositionX(swipedAmount), {
+                  stiffness: 400,
+                  damping: 30,
+                }),
+              },
+            },
+          ]}
+        >
+          {(interpolatedStyles) => (
+            <React.Fragment>
+              {interpolatedStyles.map((config) => (
+                <>
+                  <Sidebar
+                    key={config.key}
+                    style={{
+                      ...sidebarPosition,
+                      transform: `translateX(${config.style.transform}px)`,
+                    }}
+                    setSwipedAmount={(swipedAmount) =>
+                      this.setState({ swipedAmount })
+                    }
+                  />
+                </>
+              ))}
+            </React.Fragment>
+          )}
+        </TransitionMotion>
+      </div>
+    );
+  };
+
+  renderLarge = (): React.ReactNode => {
+    const { sidebarPosition } = this.props;
+
+    return (
+      <div className="ct-character-sheet-desktop">
+        {this.renderContent()}
+        <Sidebar style={sidebarPosition} />
+      </div>
+    );
+  };
+
+  renderSheet = (): React.ReactNode => {
+    const { envDimensions } = this.props;
+
+    if (envDimensions.window.width < DESKTOP_LARGE_COMPONENT_START_WIDTH) {
+      return this.renderSmall();
+    }
+
+    return this.renderLarge();
+  };
+
+  render() {
+    const { decorationInfo } = this.props;
+
+    return (
+      <React.Fragment>
+        {this.renderSheet()}
+        <BackdropStyles
+          backdrop={DecorationUtils.getBackdropInfo(decorationInfo)}
+        />
+        <ThemeStyles decorationInfo={decorationInfo} />
+      </React.Fragment>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    decorationInfo: rulesEngineSelectors.getDecorationInfo(state),
+    envDimensions: appEnvSelectors.getDimensions(state),
+  };
+}
+
+const CharacterSheetContainer = (props) => {
+  const { sidebar } = useSidebar();
+  const { getSidebarPositioning } = usePositioning();
+
+  return (
+    <CharacterSheetDesktop
+      sidebarInfo={sidebar}
+      sidebarPosition={getSidebarPositioning()}
+      {...props}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(CharacterSheetContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetDesktop/index.ts b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetDesktop/index.ts
new file mode 100644
index 0000000..6128920
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetDesktop/index.ts
@@ -0,0 +1,4 @@
+import CharacterSheetDesktop from "./CharacterSheetDesktop";
+
+export default CharacterSheetDesktop;
+export { CharacterSheetDesktop };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetGuidedTour/CharacterSheetGuidedTour.tsx b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetGuidedTour/CharacterSheetGuidedTour.tsx
new file mode 100644
index 0000000..101ec4c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetGuidedTour/CharacterSheetGuidedTour.tsx
@@ -0,0 +1,74 @@
+import { useMediaQuery } from "@mui/material";
+import { useContext, useEffect, useState } from "react";
+import { connect, useSelector } from "react-redux";
+
+import {
+  Constants,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine";
+
+import { useFeatureFlags } from "~/contexts/FeatureFlag";
+
+import { GuidedTour } from "../../../Shared/containers/GuidedTour";
+import { getCharacterSheetSteps } from "./getCharacterSheetSteps";
+
+const CharacterSheetGuidedTour = ({ children }) => {
+  const [step, setStep] = useState(0);
+  const { characterSheetTourFlag } = useFeatureFlags();
+  const isTablet = useMediaQuery("(min-width: 768px)");
+  const isDesktop = useMediaQuery("(min-width: 1024px)");
+  const ready = useSelector(rulesEngineSelectors.isCharacterSheetReady);
+  // const hasSpells = useSelector(rulesEngineSelectors.hasSpells);
+  const [loading, setLoading] = useState(true);
+
+  const setCurrentStep = (currentStep) => {
+    switch (currentStep) {
+      case 11: {
+        if (!isTablet && !isDesktop) {
+          const toggle = document.querySelector(
+            "[class^='styles_navToggle']"
+          ) as HTMLButtonElement;
+          toggle?.click();
+        }
+        break;
+      }
+      case 13: {
+        if (isTablet && !isDesktop) {
+          const toggle = document.querySelector(
+            "[class^='styles_navToggle']"
+          ) as HTMLButtonElement;
+          toggle?.click();
+        }
+        break;
+      }
+      default:
+        break;
+    }
+    setStep(currentStep);
+  };
+
+  useEffect(() => {
+    // If character sheet has loaded, enable tour
+    if (ready) setLoading(false);
+  }, [ready]);
+
+  return (
+    <>
+      {characterSheetTourFlag && !loading ? (
+        <GuidedTour
+          steps={getCharacterSheetSteps(false, isTablet, isDesktop)}
+          step={step}
+          setStep={setCurrentStep}
+          showOnFirstLoad={true}
+          cookieName="characterSheetGuidedTour"
+        >
+          {children}
+        </GuidedTour>
+      ) : (
+        <>{children}</>
+      )}
+    </>
+  );
+};
+
+export default CharacterSheetGuidedTour;
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetGuidedTour/getCharacterSheetSteps.tsx b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetGuidedTour/getCharacterSheetSteps.tsx
new file mode 100644
index 0000000..532fd62
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetGuidedTour/getCharacterSheetSteps.tsx
@@ -0,0 +1,457 @@
+import { StepType } from "@reactour/tour";
+
+import { GuidedTourStep } from "~/tools/js/Shared/containers/GuidedTour";
+
+/**
+ *  CHARACTER SHEET TOUR STEPS
+ **/
+export const getCharacterSheetSteps = (
+  hasSpells: boolean,
+  isTablet: boolean,
+  isDesktop: boolean
+): StepType[] => {
+  const getSelector = (
+    mobileSelector: string,
+    tabletSelector?: string,
+    desktopSelector?: string
+  ) =>
+    isDesktop && desktopSelector
+      ? desktopSelector
+      : isTablet && tabletSelector
+      ? tabletSelector
+      : mobileSelector;
+
+  const stepList = [
+    {
+      selector: getSelector("html"),
+      content: (
+        <GuidedTourStep
+          title="Welcome!"
+          content={
+            <>
+              Welcome to your character sheet! Here, you can find information
+              about your character, roll dice, and find more information about
+              other characters in your game. If you ever have any questions
+              about rules or what something is for, you can click on almost
+              anything to learn more!
+            </>
+          }
+          showClose
+        />
+      ),
+    },
+    {
+      selector: getSelector(".dice-toolbar"),
+      content: (
+        <GuidedTourStep
+          title="Digital Dice"
+          content={
+            <>
+              Click here if you need to make a custom dice roll. Your dice
+              collection can be found{" "}
+              <a
+                href="https://www.dndbeyond.com/my-dice"
+                target="_blank"
+                rel="noopener"
+              >
+                here
+              </a>
+              .
+            </>
+          }
+        />
+      ),
+    },
+    {
+      selector: getSelector(
+        ".ct-character-header-mobile__group-tidbits",
+        ".ct-character-header-tablet__group-tidbits",
+        ".ct-character-header-desktop__group-tidbits"
+      ),
+      content: (
+        <GuidedTourStep
+          title="Character Overview"
+          content={
+            <>
+              Basic information about your character such as Name, Species,
+              Class, and Level can be found here. Click this area to change your
+              character's name, sheet styles, and modify other settings for your
+              character.
+            </>
+          }
+        />
+      ),
+    },
+    {
+      selector: ".ct-character-header-desktop__group--builder",
+      content: (
+        <GuidedTourStep
+          title="Character Builder"
+          content={
+            <>
+              Click here to visit the Character Builder. Each time you level up,
+              check here to see how to develop your character.
+            </>
+          }
+        />
+      ),
+    },
+    {
+      selector: getSelector(
+        ".ct-main-mobile__abilities",
+        ".ct-main-tablet__abilities",
+        ".ct-quick-info__abilities"
+      ),
+      content: (
+        <GuidedTourStep
+          title="Ability Scores"
+          content={
+            <>
+              Much of what your character does in the game depends on his or her
+              six abilities: Strength, Dexterity, Constitution, Intelligence,
+              Wisdom, and Charisma. Learn more about an ability by clicking on
+              it.
+            </>
+          }
+        />
+      ),
+    },
+    {
+      selector: getSelector(
+        ".ct-combat-mobile__extra--proficiency",
+        ".ct-combat-tablet__extra--proficiency",
+        ".ct-quick-info__box--proficiency"
+      ),
+      content: (
+        <GuidedTourStep
+          title="Proficiency Bonus"
+          content={
+            <>
+              Proficiency is added to rolls made to accomplish tasks with which
+              your character is proficient. The bonus is automatically added to
+              rolls when it is needed. Click here to learn more about how
+              Proficiency Bonuses are used.
+            </>
+          }
+        />
+      ),
+    },
+    {
+      selector: getSelector(
+        ".ct-combat-mobile__extra--speed",
+        ".ct-combat-tablet__extra--speed",
+        ".ct-quick-info__box--speed"
+      ),
+      content: (
+        <GuidedTourStep
+          title="Speed"
+          content={
+            <>
+              In each round of combat, your character can move up to the total
+              distance indicated by your speed. Click here to learn more or
+              customize your speed.
+            </>
+          }
+        />
+      ),
+    },
+    {
+      selector: getSelector(
+        ".ct-status-summary-mobile__health",
+        ".ct-status-summary-mobile__health",
+        ".ct-health-summary"
+      ),
+      content: (
+        <GuidedTourStep
+          title="Hit Points"
+          content={
+            <>
+              In this area, you can manage your character's hit points. When
+              your character reaches zero hit points, they are on the brink of
+              death and begin making death saving throws.
+            </>
+          }
+        />
+      ),
+    },
+    {
+      selector: getSelector(
+        ".ct-combat-mobile__extra--initiative",
+        ".ct-combat-tablet__extra--initiative",
+        ".ct-combat__summary-group--initiative"
+      ),
+      content: (
+        <GuidedTourStep
+          title="Initiative"
+          content={
+            <>
+              Initiative rolls determine the order in which you go in combat.
+              The higher the number, the sooner you get to fight. Click here to
+              roll initiative!
+            </>
+          }
+        />
+      ),
+    },
+    {
+      selector: getSelector(
+        ".ct-combat-mobile__extra--ac",
+        ".ct-combat-tablet__extra--ac",
+        ".ct-combat__summary-group--ac"
+      ),
+      content: (
+        <GuidedTourStep
+          title="Armor Class"
+          content={
+            <>
+              Your Armor Class (AC) represents how well your character avoids
+              being wounded in battle.
+            </>
+          }
+        />
+      ),
+    },
+    {
+      selector: getSelector(
+        ".ct-main-mobile__saving-throws",
+        ".ct-saving-throws-box",
+        ".ct-saving-throws-box"
+      ),
+      content: (
+        <GuidedTourStep
+          title="Saving Throws"
+          content={
+            <>
+              Your DM may ask you to roll a saving throw (or make a save) to
+              resist an incoming effect. Click on a save to automatically roll.
+            </>
+          }
+        />
+      ),
+    },
+    ...(isDesktop || isTablet
+      ? [
+          {
+            selector: ".ct-proficiency-groups-box",
+            content: (
+              <GuidedTourStep
+                title="Proficiencies"
+                content={
+                  <>
+                    Proficiencies tell you what tools, equipment, and languages
+                    your character is skilled at using.
+                  </>
+                }
+              />
+            ),
+          },
+          {
+            selector: ".ct-skills-box",
+            content: (
+              <GuidedTourStep
+                title="Skills"
+                content={
+                  <>
+                    If you wish to perform an action, your DM will determine
+                    which of these skills you will use. Click on a skill to roll
+                    or learn more.
+                  </>
+                }
+              />
+            ),
+          },
+        ]
+      : [
+          {
+            selector: ".ct-quick-nav__menu-item--skills",
+            content: (
+              <GuidedTourStep
+                title="Skills"
+                content={
+                  <>
+                    If you wish to perform an action, your DM will determine
+                    which of these skills you will use. Click on a skill to roll
+                    or learn more.
+                  </>
+                }
+              />
+            ),
+          },
+        ]),
+    ...(!isDesktop
+      ? [
+          {
+            selector: ".ct-quick-nav__menu-item--actions",
+            content: (
+              <GuidedTourStep
+                title="Actions"
+                content={
+                  <>
+                    When you take your action on your turn, you can take one of
+                    the actions presented here. You can track actions or make
+                    rolls to perform them by clicking in this panel.
+                  </>
+                }
+              />
+            ),
+          },
+          {
+            selector: ".ct-quick-nav__menu-item--equipment",
+            content: (
+              <GuidedTourStep
+                title="Inventory"
+                content={
+                  <>
+                    View and manage your character's items and coin from this
+                    panel.
+                  </>
+                }
+              />
+            ),
+          },
+          {
+            selector: ".ct-quick-nav__menu-item--spells",
+            content: (
+              <GuidedTourStep
+                title="Spells"
+                content={
+                  <>
+                    If your character has the ability to cast spells, look here
+                    for a list of spells and to track your spellcasting.
+                  </>
+                }
+              />
+            ),
+          },
+          {
+            selector: ".ct-quick-nav__menu-item--features",
+            content: (
+              <GuidedTourStep
+                title="Features & Traits"
+                content={
+                  <>
+                    This section describes the source of your character's
+                    abilities. How this manifests in your character's
+                    personality is up to you.
+                  </>
+                }
+              />
+            ),
+          },
+          ...(!isTablet
+            ? [
+                {
+                  selector: ".ct-quick-nav__menu-item--proficiencies",
+                  content: (
+                    <GuidedTourStep
+                      title="Proficiencies"
+                      content={
+                        <>
+                          Proficiencies tell you what tools, equipment, and
+                          languages your character is skilled at using.
+                        </>
+                      }
+                    />
+                  ),
+                },
+              ]
+            : []),
+          {
+            selector: ".ct-quick-nav__menu-item--description",
+            content: (
+              <GuidedTourStep
+                title="Description"
+                content={
+                  <>
+                    Use the description panel to tell your character's story.
+                    Your character's background features are also found here.
+                  </>
+                }
+                showClose
+              />
+            ),
+          },
+        ]
+      : [
+          {
+            selector: ".ct-primary-box__tab--actions",
+            content: (
+              <GuidedTourStep
+                title="Actions"
+                content={
+                  <>
+                    When you take your action on your turn, you can take one of
+                    the actions presented here. You can track actions or make
+                    rolls to perform them by clicking in this panel.
+                  </>
+                }
+              />
+            ),
+          },
+          ...(hasSpells
+            ? [
+                {
+                  selector: ".ct-primary-box__tab--spells",
+                  content: (
+                    <GuidedTourStep
+                      title="Spells"
+                      content={
+                        <>
+                          If your character has the ability to cast spells, look
+                          here for a list of spells and to track your
+                          spellcasting.
+                        </>
+                      }
+                    />
+                  ),
+                },
+              ]
+            : []),
+          {
+            selector: ".ct-primary-box__tab--equipment",
+            content: (
+              <GuidedTourStep
+                title="Inventory"
+                content={
+                  <>
+                    View and manage your character's items and coin from this
+                    panel.
+                  </>
+                }
+              />
+            ),
+          },
+          {
+            selector: ".ct-primary-box__tab--features",
+            content: (
+              <GuidedTourStep
+                title="Features & Traits"
+                content={
+                  <>
+                    This section describes the source of your character's
+                    abilities. How this manifests in your character's
+                    personality is up to you.
+                  </>
+                }
+              />
+            ),
+          },
+          {
+            selector: ".ct-primary-box__tab--description",
+            content: (
+              <GuidedTourStep
+                title="Description"
+                content={
+                  <>
+                    Use the description panel to tell your character's story.
+                    Your character's background features are also found here.
+                  </>
+                }
+                showClose
+              />
+            ),
+          },
+        ]),
+  ];
+  return stepList.filter((s) => s);
+};
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetGuidedTour/index.ts b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetGuidedTour/index.ts
new file mode 100644
index 0000000..44bc347
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetGuidedTour/index.ts
@@ -0,0 +1,4 @@
+import CharacterSheetGuidedTour from "./CharacterSheetGuidedTour";
+
+export default CharacterSheetGuidedTour;
+export { CharacterSheetGuidedTour };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetMobile/CharacterSheetMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetMobile/CharacterSheetMobile.tsx
new file mode 100644
index 0000000..8536fd8
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetMobile/CharacterSheetMobile.tsx
@@ -0,0 +1,317 @@
+import { spring, TransitionMotion } from "@serprex/react-motion";
+import React, { useContext } from "react";
+import { connect } from "react-redux";
+
+import {
+  ThemeStyles,
+  DarkAbilitiesSvg,
+  DarkActionsSvg,
+  DarkSkillsSvg,
+  DarkEquipmentSvg,
+  DarkSpellsSvg,
+  DarkProficienciesSvg,
+  DarkDescriptionSvg,
+  DarkNotesSvg,
+  DarkFeaturesSvg,
+  DarkExtrasSvg,
+  LightAbilitiesSvg,
+  LightActionsSvg,
+  LightSkillsSvg,
+  LightEquipmentSvg,
+  LightSpellsSvg,
+  LightProficienciesSvg,
+  LightDescriptionSvg,
+  LightNotesSvg,
+  LightFeaturesSvg,
+  LightExtrasSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  rulesEngineSelectors,
+  DecorationInfo,
+  DecorationUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { SidebarInfo } from "~/contexts/Sidebar/Sidebar";
+import { usePositioning } from "~/hooks/usePositioning";
+import { Sidebar } from "~/subApps/sheet/components/Sidebar";
+import { SidebarPositionInfo } from "~/subApps/sheet/components/Sidebar/types";
+import { SheetContext } from "~/subApps/sheet/contexts/Sheet";
+import { MobileSections } from "~/subApps/sheet/types";
+
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import {
+  ComponentCarousel,
+  ComponentCarouselItem,
+} from "../../components/ComponentCarousel";
+import SectionPlaceholder from "../../components/SectionPlaceholder";
+import { SheetAppState } from "../../typings";
+import CharacterHeaderMobile from "../CharacterHeaderMobile";
+import ActionsMobile from "../mobile/ActionsMobile";
+import CombatMobile from "../mobile/CombatMobile";
+import { DescriptionMobile } from "../mobile/DescriptionMobile";
+import EquipmentMobile from "../mobile/EquipmentMobile";
+import ExtrasMobile from "../mobile/ExtrasMobile";
+import FeaturesMobile from "../mobile/FeaturesMobile";
+import MainMobile from "../mobile/MainMobile";
+import NotesMobile from "../mobile/NotesMobile";
+import { ProficiencyGroupsMobile } from "../mobile/ProficiencyGroupsMobile";
+import SkillsMobile from "../mobile/SkillsMobile";
+import SpellsMobile from "../mobile/SpellsMobile";
+
+interface Props {
+  sidebarInfo: SidebarInfo;
+  sidebarPosition: SidebarPositionInfo;
+  envDimensions: AppEnvDimensionsState;
+  decorationInfo: DecorationInfo;
+  hasSpells: boolean;
+  isReadonly: boolean;
+  mobileActiveSectionId: MobileSections;
+  setMobileActiveSectionId: (id: MobileSections) => void;
+}
+interface State {
+  swipedAmount: number;
+}
+class CharacterSheetMobile extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      swipedAmount: 0,
+    };
+  }
+
+  handleComponentChange = (id: MobileSections): void => {
+    const { setMobileActiveSectionId } = this.props;
+    setMobileActiveSectionId(id);
+
+    window.scrollTo(0, 0);
+  };
+
+  handleItemChange = (newKey: MobileSections, oldKey: MobileSections): void => {
+    if (newKey !== oldKey) {
+      window.scrollTo(0, 0);
+    }
+
+    const { setMobileActiveSectionId } = this.props;
+    setMobileActiveSectionId(newKey);
+  };
+
+  getPositionX = (swipedAmount: number): number => {
+    const { sidebarInfo } = this.props;
+
+    let position: number =
+      (sidebarInfo.isVisible ? 0 : sidebarInfo.width) + swipedAmount;
+
+    if (swipedAmount > 0) {
+      return Math.min(sidebarInfo.width, position);
+    } else {
+      return Math.max(0, position);
+    }
+  };
+
+  renderSections = (activeSectionId: MobileSections): React.ReactNode => {
+    const { envDimensions, hasSpells, isReadonly, decorationInfo } = this.props;
+
+    const isDarkMode = DecorationUtils.isDarkMode(decorationInfo);
+
+    return (
+      <ComponentCarousel
+        activeItemKey={activeSectionId}
+        onItemChange={this.handleItemChange}
+        envDimensions={envDimensions}
+      >
+        <ComponentCarouselItem
+          itemKey="main"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Abilities, Saves, Senses",
+            IconComponent: isDarkMode ? LightAbilitiesSvg : DarkAbilitiesSvg,
+          }}
+          ContentComponent={MainMobile}
+        />
+        <ComponentCarouselItem
+          itemKey="skills"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Skills",
+            IconComponent: isDarkMode ? LightSkillsSvg : DarkSkillsSvg,
+          }}
+          ContentComponent={SkillsMobile}
+        />
+        <ComponentCarouselItem
+          itemKey="actions"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Actions",
+            IconComponent: isDarkMode ? LightActionsSvg : DarkActionsSvg,
+          }}
+          ContentComponent={ActionsMobile}
+        />
+        <ComponentCarouselItem
+          itemKey="equipment"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Inventory",
+            IconComponent: isDarkMode ? LightEquipmentSvg : DarkEquipmentSvg,
+          }}
+          ContentComponent={EquipmentMobile}
+        />
+        <ComponentCarouselItem
+          itemKey="spells"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Spells",
+            IconComponent: isDarkMode ? LightSpellsSvg : DarkSpellsSvg,
+          }}
+          ContentComponent={SpellsMobile}
+          isEnabled={hasSpells}
+        />
+        <ComponentCarouselItem
+          itemKey="features_traits"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Features & Traits",
+            IconComponent: isDarkMode ? LightFeaturesSvg : DarkFeaturesSvg,
+          }}
+          ContentComponent={FeaturesMobile}
+        />
+        <ComponentCarouselItem
+          itemKey="proficiencies"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Proficiencies & Training",
+            IconComponent: isDarkMode
+              ? LightProficienciesSvg
+              : DarkProficienciesSvg,
+          }}
+          ContentComponent={ProficiencyGroupsMobile}
+        />
+        <ComponentCarouselItem
+          itemKey="description"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Background",
+            IconComponent: isDarkMode
+              ? LightDescriptionSvg
+              : DarkDescriptionSvg,
+          }}
+          ContentComponent={DescriptionMobile}
+          isEnabled={!isReadonly}
+        />
+        <ComponentCarouselItem
+          itemKey="notes"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Notes",
+            IconComponent: isDarkMode ? LightNotesSvg : DarkNotesSvg,
+          }}
+          ContentComponent={NotesMobile}
+          isEnabled={!isReadonly}
+        />
+        <ComponentCarouselItem
+          itemKey="extras"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Extras",
+            IconComponent: isDarkMode ? LightExtrasSvg : DarkExtrasSvg,
+          }}
+          ContentComponent={ExtrasMobile}
+          isEnabled={!isReadonly}
+        />
+      </ComponentCarousel>
+    );
+  };
+
+  renderSidebar = (): React.ReactNode => {
+    const { swipedAmount } = this.state;
+    const { sidebarPosition } = this.props;
+    return (
+      <TransitionMotion
+        styles={[
+          {
+            key: "1",
+            style: {
+              transform: spring(this.getPositionX(swipedAmount), {
+                stiffness: 400,
+                damping: 30,
+              }),
+            },
+          },
+        ]}
+      >
+        {(interpolatedStyles) => (
+          <React.Fragment>
+            {interpolatedStyles.map((config) => (
+              <Sidebar
+                key={config.key}
+                style={{
+                  ...sidebarPosition,
+                  transform: `translateX(${config.style.transform}px)`,
+                }}
+                setSwipedAmount={(swipedAmount) =>
+                  this.setState({ swipedAmount })
+                }
+              />
+            ))}
+          </React.Fragment>
+        )}
+      </TransitionMotion>
+    );
+  };
+
+  render() {
+    const { decorationInfo } = this.props;
+
+    return (
+      <SheetContext.Consumer>
+        {({ mobileActiveSectionId }) => (
+          <div
+            className={`ct-character-sheet-mobile ${
+              DecorationUtils.isDarkMode(decorationInfo)
+                ? "ct-character-sheet-mobile--dark-mode"
+                : ""
+            }`}
+          >
+            <div className="ct-character-sheet-mobile__header">
+              <CharacterHeaderMobile />
+              <CombatMobile />
+            </div>
+            {this.renderSections(mobileActiveSectionId)}
+            {this.renderSidebar()}
+            <ThemeStyles decorationInfo={decorationInfo} />
+          </div>
+        )}
+      </SheetContext.Consumer>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    decorationInfo: rulesEngineSelectors.getDecorationInfo(state),
+    hasSpells: rulesEngineSelectors.hasSpells(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    envDimensions: appEnvSelectors.getDimensions(state),
+  };
+}
+
+const CharacterSheetMobileContainer = (props) => {
+  const { mobileActiveSectionId, setMobileActiveSectionId } =
+    useContext(SheetContext);
+  const { sidebar } = useSidebar();
+  const { getSidebarPositioning } = usePositioning();
+
+  return (
+    <CharacterSheetMobile
+      mobileActiveSectionId={mobileActiveSectionId}
+      setMobileActiveSectionId={setMobileActiveSectionId}
+      sidebarInfo={sidebar}
+      sidebarPosition={getSidebarPositioning()}
+      {...props}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(CharacterSheetMobileContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetMobile/index.ts b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetMobile/index.ts
new file mode 100644
index 0000000..bcd87f6
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetMobile/index.ts
@@ -0,0 +1,4 @@
+import CharacterSheetMobile from "./CharacterSheetMobile";
+
+export default CharacterSheetMobile;
+export { CharacterSheetMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetTablet/CharacterSheetTablet.tsx b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetTablet/CharacterSheetTablet.tsx
new file mode 100644
index 0000000..3393182
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetTablet/CharacterSheetTablet.tsx
@@ -0,0 +1,288 @@
+import { spring, TransitionMotion } from "@serprex/react-motion";
+import React, { useContext } from "react";
+import { connect } from "react-redux";
+
+import {
+  ThemeStyles,
+  DarkAbilitiesSvg,
+  DarkActionsSvg,
+  DarkEquipmentSvg,
+  DarkSpellsSvg,
+  DarkDescriptionSvg,
+  DarkNotesSvg,
+  DarkFeaturesSvg,
+  DarkExtrasSvg,
+  LightAbilitiesSvg,
+  LightActionsSvg,
+  LightEquipmentSvg,
+  LightSpellsSvg,
+  LightDescriptionSvg,
+  LightNotesSvg,
+  LightFeaturesSvg,
+  LightExtrasSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  DecorationUtils,
+  DecorationInfo,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { SidebarInfo } from "~/contexts/Sidebar/Sidebar";
+import { usePositioning } from "~/hooks/usePositioning";
+import { Sidebar } from "~/subApps/sheet/components/Sidebar";
+import { SidebarPositionInfo } from "~/subApps/sheet/components/Sidebar/types";
+import { SheetContext } from "~/subApps/sheet/contexts/Sheet";
+import { MobileSections } from "~/subApps/sheet/types";
+
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import {
+  ComponentCarousel,
+  ComponentCarouselItem,
+} from "../../components/ComponentCarousel";
+import SectionPlaceholder from "../../components/SectionPlaceholder";
+import { SheetAppState } from "../../typings";
+import BackdropStyles from "../BackdropStyles";
+import CharacterHeaderTablet from "../CharacterHeaderTablet";
+import ActionsTablet from "../tablet/ActionsTablet";
+import CombatTablet from "../tablet/CombatTablet";
+import { DescriptionTablet } from "../tablet/DescriptionTablet";
+import EquipmentTablet from "../tablet/EquipmentTablet";
+import ExtrasTablet from "../tablet/ExtrasTablet";
+import FeaturesTablet from "../tablet/FeaturesTablet";
+import MainTablet from "../tablet/MainTablet";
+import NotesTablet from "../tablet/NotesTablet";
+import SpellsTablet from "../tablet/SpellsTablet";
+
+interface Props {
+  sidebarPosition: SidebarPositionInfo;
+  sidebarInfo: SidebarInfo;
+  envDimensions: AppEnvDimensionsState;
+  decorationInfo: DecorationInfo;
+  hasSpells: boolean;
+  isReadonly: boolean;
+  mobileActiveSectionId: MobileSections;
+  setMobileActiveSectionId: (id: MobileSections) => void;
+}
+interface State {
+  swipedAmount: number;
+}
+class CharacterSheetTablet extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      swipedAmount: 0,
+    };
+  }
+
+  handleComponentChange = (id: MobileSections): void => {
+    const { setMobileActiveSectionId } = this.props;
+    setMobileActiveSectionId(id);
+    window.scrollTo(0, 0);
+  };
+
+  handleItemChange = (newKey: MobileSections, oldKey: MobileSections): void => {
+    if (newKey !== oldKey) {
+      window.scrollTo(0, 0);
+    }
+
+    const { setMobileActiveSectionId } = this.props;
+    setMobileActiveSectionId(newKey);
+  };
+
+  getPositionX = (swipedAmount: number): number => {
+    const { sidebarInfo } = this.props;
+
+    let position: number =
+      (sidebarInfo.isVisible ? 0 : sidebarInfo.width) + swipedAmount;
+
+    if (swipedAmount > 0) {
+      return Math.min(sidebarInfo.width, position);
+    } else {
+      return Math.max(0, position);
+    }
+  };
+
+  renderSections = (activeSectionId: MobileSections): React.ReactNode => {
+    const { envDimensions, hasSpells, isReadonly, decorationInfo } = this.props;
+
+    const isDarkMode = DecorationUtils.isDarkMode(decorationInfo);
+
+    return (
+      <ComponentCarousel
+        activeItemKey={activeSectionId}
+        onItemChange={this.handleItemChange}
+        envDimensions={envDimensions}
+        changingWaitTime={750}
+      >
+        <ComponentCarouselItem
+          itemKey="main"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Abilities, Saves, Senses",
+            IconComponent: isDarkMode ? LightAbilitiesSvg : DarkAbilitiesSvg,
+          }}
+          ContentComponent={MainTablet}
+        />
+        <ComponentCarouselItem
+          itemKey="actions"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Actions",
+            IconComponent: isDarkMode ? LightActionsSvg : DarkActionsSvg,
+          }}
+          ContentComponent={ActionsTablet}
+        />
+        <ComponentCarouselItem
+          itemKey="equipment"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Equipment",
+            IconComponent: isDarkMode ? LightEquipmentSvg : DarkEquipmentSvg,
+          }}
+          ContentComponent={EquipmentTablet}
+        />
+        <ComponentCarouselItem
+          itemKey="spells"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Spells",
+            IconComponent: isDarkMode ? LightSpellsSvg : DarkSpellsSvg,
+          }}
+          ContentComponent={SpellsTablet}
+          isEnabled={hasSpells}
+        />
+        <ComponentCarouselItem
+          itemKey="features_traits"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Features & Traits",
+            IconComponent: isDarkMode ? LightFeaturesSvg : DarkFeaturesSvg,
+          }}
+          ContentComponent={FeaturesTablet}
+        />
+        <ComponentCarouselItem
+          itemKey="description"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Description",
+            IconComponent: isDarkMode
+              ? LightDescriptionSvg
+              : DarkDescriptionSvg,
+          }}
+          ContentComponent={DescriptionTablet}
+          isEnabled={!isReadonly}
+        />
+        <ComponentCarouselItem
+          itemKey="notes"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Notes",
+            IconComponent: isDarkMode ? LightNotesSvg : DarkNotesSvg,
+          }}
+          ContentComponent={NotesTablet}
+          isEnabled={!isReadonly}
+        />
+        <ComponentCarouselItem
+          itemKey="extras"
+          PlaceholderComponent={SectionPlaceholder}
+          placeholderProps={{
+            name: "Extras",
+            IconComponent: isDarkMode ? LightExtrasSvg : DarkExtrasSvg,
+          }}
+          ContentComponent={ExtrasTablet}
+          isEnabled={!isReadonly}
+        />
+      </ComponentCarousel>
+    );
+  };
+
+  renderSidebar = (): React.ReactNode => {
+    const { swipedAmount } = this.state;
+    const { sidebarPosition } = this.props;
+
+    return (
+      <TransitionMotion
+        styles={[
+          {
+            key: "1",
+            style: {
+              transform: spring(this.getPositionX(swipedAmount), {
+                stiffness: 400,
+                damping: 30,
+              }),
+            },
+          },
+        ]}
+      >
+        {(interpolatedStyles) => (
+          <React.Fragment>
+            {interpolatedStyles.map((config) => (
+              <Sidebar
+                key={config.key}
+                style={{
+                  ...sidebarPosition,
+                  transform: `translateX(${config.style.transform}px)`,
+                }}
+                setSwipedAmount={(swipedAmount) =>
+                  this.setState({ swipedAmount })
+                }
+              />
+            ))}
+          </React.Fragment>
+        )}
+      </TransitionMotion>
+    );
+  };
+
+  render() {
+    const { decorationInfo } = this.props;
+
+    return (
+      <SheetContext.Consumer>
+        {({ mobileActiveSectionId }) => (
+          <div className="ct-character-sheet-tablet">
+            <CharacterHeaderTablet />
+            <CombatTablet />
+            {this.renderSections(mobileActiveSectionId)}
+            {this.renderSidebar()}
+            <ThemeStyles decorationInfo={decorationInfo} />
+            <BackdropStyles
+              backdrop={DecorationUtils.getBackdropInfo(decorationInfo)}
+            />
+          </div>
+        )}
+      </SheetContext.Consumer>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    decorationInfo: rulesEngineSelectors.getDecorationInfo(state),
+    hasSpells: rulesEngineSelectors.hasSpells(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    envDimensions: appEnvSelectors.getDimensions(state),
+  };
+}
+
+const CharacterSheetTabletContainer = (props) => {
+  const { mobileActiveSectionId, setMobileActiveSectionId } =
+    useContext(SheetContext);
+  const { sidebar } = useSidebar();
+  const { getSidebarPositioning } = usePositioning();
+
+  return (
+    <CharacterSheetTablet
+      mobileActiveSectionId={mobileActiveSectionId}
+      setMobileActiveSectionId={setMobileActiveSectionId}
+      sidebarInfo={sidebar}
+      sidebarPosition={getSidebarPositioning()}
+      {...props}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(CharacterSheetTabletContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetTablet/index.ts b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetTablet/index.ts
new file mode 100644
index 0000000..4cbda9b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/CharacterSheetTablet/index.ts
@@ -0,0 +1,4 @@
+import CharacterSheetTablet from "./CharacterSheetTablet";
+
+export default CharacterSheetTablet;
+export { CharacterSheetTablet };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Combat/Combat.tsx b/ddb_main/tools/js/CharacterSheet/containers/Combat/Combat.tsx
new file mode 100644
index 0000000..6643c71
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Combat/Combat.tsx
@@ -0,0 +1,204 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  ArmorClassBox,
+  BoxBackground,
+  SquaredBoxSvg344x95,
+  SquaredBoxSvg408x95,
+} from "@dndbeyond/character-components/es";
+import {
+  rulesEngineSelectors,
+  AbilityLookup,
+  Condition,
+  DefenseAdjustmentGroup,
+  SpellCasterInfo,
+  RuleData,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { InitiativeBox } from "~/subApps/sheet/components/InitiativeBox";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import Subsection from "../../../Shared/components/Subsection";
+import { StyleSizeTypeEnum } from "../../../Shared/reducers/appEnv";
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import ConditionsSummary from "../../components/ConditionsSummary";
+import DefensesSummary from "../../components/DefensesSummary";
+import { SheetAppState } from "../../typings";
+
+interface Props {
+  armorClass: number;
+  resistances: Array<DefenseAdjustmentGroup>;
+  immunities: Array<DefenseAdjustmentGroup>;
+  vulnerabilities: Array<DefenseAdjustmentGroup>;
+  conditions: Array<Condition>;
+  abilityLookup: AbilityLookup;
+  ruleData: RuleData;
+  spellCasterInfo: SpellCasterInfo;
+  dimensions: AppEnvDimensionsState;
+  theme: CharacterTheme;
+  diceEnabled: boolean;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class Combat extends React.PureComponent<Props> {
+  static defaultProps = {
+    diceEnabled: false,
+  };
+
+  handleArmorClassClick = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.ARMOR_MANAGE);
+  };
+
+  handleDefensesSummaryClick = (evt: React.MouseEvent): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    this.handleDefensesSummaryShow();
+  };
+
+  handleDefensesSummaryShow = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.DEFENSE_MANAGE);
+  };
+
+  handleConditionSummaryClick = (evt: React.MouseEvent): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    this.handleConditionSummaryShow();
+  };
+
+  handleConditionSummaryShow = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.CONDITION_MANAGE);
+  };
+
+  renderDefault = (): React.ReactNode => {
+    return (
+      <div className="ct-combat__attacks-default">
+        Equip weapons or add spells to see your attacks here.
+      </div>
+    );
+  };
+
+  render() {
+    const {
+      armorClass,
+      resistances,
+      vulnerabilities,
+      immunities,
+      conditions,
+      theme,
+      dimensions,
+    } = this.props;
+
+    let BoxBackgroundComponent: React.ComponentType = SquaredBoxSvg344x95;
+    if (dimensions.styleSizeType > StyleSizeTypeEnum.DESKTOP) {
+      BoxBackgroundComponent = SquaredBoxSvg408x95;
+    }
+
+    return (
+      <Subsection name="Combat">
+        <div className="ct-combat">
+          <div className="ct-combat__summary">
+            <div className="ct-combat__summary-group ct-combat__summary-group--initiative">
+              <InitiativeBox />
+            </div>
+            <div className="ct-combat__summary-group ct-combat__summary-group--ac">
+              <ArmorClassBox
+                theme={theme}
+                armorClass={armorClass}
+                onClick={this.handleArmorClassClick}
+              />
+            </div>
+            <section className="ct-combat__summary-group ct-combat__summary-group--statuses">
+              <div className="ct-combat__statuses">
+                <BoxBackground
+                  StyleComponent={BoxBackgroundComponent}
+                  theme={theme}
+                />
+                <h2 style={visuallyHidden}>Defenses and Conditions</h2>
+                <div
+                  className="ct-combat__statuses-group ct-combat__statuses-group--defenses"
+                  onClick={this.handleDefensesSummaryClick}
+                >
+                  <div
+                    className={`ct-combat__summary-label ${
+                      theme.isDarkMode
+                        ? "ct-combat__summary-label--dark-mode"
+                        : ""
+                    }`}
+                  >
+                    Defenses
+                  </div>
+                  <DefensesSummary
+                    theme={theme}
+                    resistances={resistances}
+                    vulnerabilities={vulnerabilities}
+                    immunities={immunities}
+                    onClick={this.handleDefensesSummaryShow}
+                  />
+                </div>
+                <div
+                  className="ct-combat__statuses-group ct-combat__statuses-group--conditions"
+                  style={
+                    theme?.isDarkMode
+                      ? {
+                          borderColor: `${theme.themeColor}66`,
+                        }
+                      : undefined
+                  }
+                  onClick={this.handleConditionSummaryClick}
+                >
+                  <div
+                    className={`ct-combat__summary-label ${
+                      theme.isDarkMode
+                        ? "ct-combat__summary-label--dark-mode"
+                        : ""
+                    }`}
+                  >
+                    Conditions
+                  </div>
+                  <ConditionsSummary
+                    theme={theme}
+                    conditions={conditions}
+                    onClick={this.handleConditionSummaryShow}
+                  />
+                </div>
+              </div>
+            </section>
+          </div>
+        </div>
+      </Subsection>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    spellCasterInfo: rulesEngineSelectors.getSpellCasterInfo(state),
+    armorClass: rulesEngineSelectors.getAcTotal(state),
+    resistances: rulesEngineSelectors.getActiveGroupedResistances(state),
+    immunities: rulesEngineSelectors.getActiveGroupedImmunities(state),
+    vulnerabilities:
+      rulesEngineSelectors.getActiveGroupedVulnerabilities(state),
+    conditions: rulesEngineSelectors.getActiveConditions(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    abilityLookup: rulesEngineSelectors.getAbilityLookup(state),
+    dimensions: appEnvSelectors.getDimensions(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+  };
+}
+
+const CombatContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <Combat paneHistoryStart={paneHistoryStart} {...props} />;
+};
+
+export default connect(mapStateToProps)(CombatContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Combat/index.ts b/ddb_main/tools/js/CharacterSheet/containers/Combat/index.ts
new file mode 100644
index 0000000..65caca0
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Combat/index.ts
@@ -0,0 +1,4 @@
+import Combat from "./Combat";
+
+export default Combat;
+export { Combat };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Description/Description.tsx b/ddb_main/tools/js/CharacterSheet/containers/Description/Description.tsx
new file mode 100644
index 0000000..5fd482b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Description/Description.tsx
@@ -0,0 +1,381 @@
+import { visuallyHidden } from "@mui/utils";
+import clsx from "clsx";
+import React, { useContext } from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  AlignmentContract,
+  Background,
+  CharacterTraits,
+  Constants,
+  SizeContract,
+  rulesEngineSelectors,
+  CharacterTheme,
+  CharacterFeaturesManager,
+  SnippetData,
+  RuleData,
+  AbilityLookup,
+  DataOriginRefData,
+  FeatManager,
+  Action,
+  ActionUtils,
+  Spell,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { InfoItem } from "~/components/InfoItem";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { TabFilter } from "~/components/TabFilter";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+import { CharacterFeaturesManagerContext } from "~/tools/js/Shared/managers/CharacterFeaturesManagerContext";
+
+import {
+  handleActionUseSet,
+  handleSpellUseSet,
+} from "../../../../../handlers/commonHandlers";
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import BackgroundDetail from "../../components/BackgroundDetail";
+import ContentGroup from "../../components/ContentGroup";
+import TraitContent from "../../components/TraitContent";
+import { SheetAppState } from "../../typings";
+import styles from "./styles.module.css";
+
+const DEFAULT_VALUE = "--";
+
+interface Props extends DispatchProp {
+  isVertical: boolean;
+  background: Background | null;
+  alignment: AlignmentContract | null;
+  height: string | null;
+  weight: number | null;
+  size: SizeContract | null;
+  faith: string | null;
+  skin: string | null;
+  eyes: string | null;
+  hair: string | null;
+  age: number | null;
+  gender: string | null;
+  traits: CharacterTraits;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  characterFeaturesManager: CharacterFeaturesManager;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+  paneContext: PaneInfo;
+}
+class Description extends React.PureComponent<Props> {
+  static defaultProps = {
+    isVertical: false,
+  };
+
+  handlePhysicalCharacteristicsClick = (): void => {
+    const {
+      paneContext: { paneHistoryStart },
+      isReadonly,
+    } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.DESCRIPTION);
+    }
+  };
+
+  handleBackgroundClick = (): void => {
+    const {
+      paneContext: { paneHistoryStart },
+    } = this.props;
+
+    paneHistoryStart(PaneComponentEnum.BACKGROUND);
+  };
+
+  handleFeatClick = (feat: FeatManager): void => {
+    const {
+      paneContext: { paneHistoryStart },
+    } = this.props;
+
+    paneHistoryStart(
+      PaneComponentEnum.FEAT_DETAIL,
+      PaneIdentifierUtils.generateFeat(feat.getId())
+    );
+  };
+
+  handleTraitShow = (key: Constants.TraitTypeEnum): void => {
+    const {
+      paneContext: { paneHistoryStart },
+      isReadonly,
+    } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(
+        PaneComponentEnum.TRAIT,
+        PaneIdentifierUtils.generateTrait(key)
+      );
+    }
+  };
+
+  handleActionClick = (action: Action): void => {
+    const {
+      paneContext: { paneHistoryStart },
+    } = this.props;
+
+    const mappingId = ActionUtils.getMappingId(action);
+    const mappingEntityTypeId = ActionUtils.getMappingEntityTypeId(action);
+
+    if (mappingId !== null && mappingEntityTypeId !== null) {
+      paneHistoryStart(
+        PaneComponentEnum.ACTION,
+        PaneIdentifierUtils.generateAction(mappingId, mappingEntityTypeId)
+      );
+    }
+  };
+
+  handleSpellDetailClick = (spell: Spell): void => {
+    const {
+      paneContext: { paneHistoryStart },
+    } = this.props;
+
+    const mappingId = SpellUtils.getMappingId(spell);
+    if (mappingId !== null) {
+      paneHistoryStart(
+        PaneComponentEnum.CHARACTER_SPELL_DETAIL,
+        PaneIdentifierUtils.generateCharacterSpell(mappingId)
+      );
+    }
+  };
+
+  handleClick = (e: React.MouseEvent, onClick: Function): void => {
+    e.stopPropagation();
+    e.nativeEvent.stopImmediatePropagation();
+    onClick();
+  };
+
+  renderDescriptionItem = (
+    value: number | string | null,
+    fallback: string = DEFAULT_VALUE
+  ): React.ReactNode => {
+    return value === null ? fallback : value;
+  };
+
+  render() {
+    const {
+      dispatch,
+      background,
+      characterFeaturesManager,
+      snippetData,
+      ruleData,
+      abilityLookup,
+      dataOriginRefData,
+      isReadonly,
+      proficiencyBonus,
+      theme,
+      isVertical,
+      size,
+      height,
+      weight,
+      alignment,
+      gender,
+      eyes,
+      hair,
+      skin,
+      age,
+      faith,
+      traits,
+    } = this.props;
+
+    const infoItemProps = {
+      role: "listitem",
+      inline: isVertical,
+    };
+
+    return (
+      <section className="ct-description">
+        <h2 style={visuallyHidden}>Description</h2>
+        <TabFilter
+          filters={[
+            {
+              label: "Background",
+              content: (
+                <ContentGroup header="Background">
+                  <BackgroundDetail
+                    background={background}
+                    onClick={this.handleBackgroundClick}
+                    featuresManager={characterFeaturesManager}
+                    onActionUseSet={(action, uses) =>
+                      handleActionUseSet(action, uses, dispatch)
+                    }
+                    onSpellUseSet={(spell, uses) =>
+                      handleSpellUseSet(spell, uses, dispatch)
+                    }
+                    snippetData={snippetData}
+                    ruleData={ruleData}
+                    abilityLookup={abilityLookup}
+                    dataOriginRefData={dataOriginRefData}
+                    isReadonly={isReadonly}
+                    proficiencyBonus={proficiencyBonus}
+                    theme={theme}
+                  />
+                </ContentGroup>
+              ),
+            },
+            {
+              label: "Characteristics",
+              content: (
+                <>
+                  <ContentGroup header="Characteristics">
+                    <div
+                      className={clsx([
+                        "ct-description__physical",
+                        styles.physical,
+                      ])}
+                      role="list"
+                      onClick={(e) =>
+                        this.handleClick(
+                          e,
+                          this.handlePhysicalCharacteristicsClick
+                        )
+                      }
+                    >
+                      <InfoItem label="Alignment" {...infoItemProps}>
+                        {alignment === null ? DEFAULT_VALUE : alignment.name}
+                      </InfoItem>
+                      <InfoItem label="Gender" {...infoItemProps}>
+                        {this.renderDescriptionItem(gender)}
+                      </InfoItem>
+                      <InfoItem label="Eyes" {...infoItemProps}>
+                        {this.renderDescriptionItem(eyes)}
+                      </InfoItem>
+                      <InfoItem label="Size" {...infoItemProps}>
+                        {this.renderDescriptionItem(size ? size.name : null)}
+                      </InfoItem>
+                      <InfoItem label="Height" {...infoItemProps}>
+                        {this.renderDescriptionItem(height)}
+                      </InfoItem>
+                      <InfoItem label="Faith" {...infoItemProps}>
+                        {this.renderDescriptionItem(faith)}
+                      </InfoItem>
+                      <InfoItem label="Hair" {...infoItemProps}>
+                        {this.renderDescriptionItem(hair)}
+                      </InfoItem>
+                      <InfoItem label="Skin" {...infoItemProps}>
+                        {this.renderDescriptionItem(skin)}
+                      </InfoItem>
+                      <InfoItem label="Age" {...infoItemProps}>
+                        {this.renderDescriptionItem(age)}
+                      </InfoItem>
+                      <InfoItem label="Weight" {...infoItemProps}>
+                        {weight === null ? (
+                          DEFAULT_VALUE
+                        ) : (
+                          <NumberDisplay type="weightInLb" number={weight} />
+                        )}
+                      </InfoItem>
+                    </div>
+                  </ContentGroup>
+                  <div
+                    className="ct-description__traits"
+                    style={
+                      theme.isDarkMode
+                        ? { borderColor: `${theme.themeColor}66` }
+                        : undefined
+                    }
+                  >
+                    <TraitContent
+                      traits={traits}
+                      traitKey={Constants.TraitTypeEnum.PERSONALITY_TRAITS}
+                      label="Personality Traits"
+                      fallback="+ Add Personality Traits"
+                      onClick={this.handleTraitShow}
+                    />
+                    <TraitContent
+                      traits={traits}
+                      traitKey={Constants.TraitTypeEnum.IDEALS}
+                      label="Ideals"
+                      fallback="+ Add Ideals"
+                      onClick={this.handleTraitShow}
+                    />
+                    <TraitContent
+                      traits={traits}
+                      traitKey={Constants.TraitTypeEnum.BONDS}
+                      label="Bonds"
+                      fallback="+ Add Bonds"
+                      onClick={this.handleTraitShow}
+                    />
+                    <TraitContent
+                      traits={traits}
+                      traitKey={Constants.TraitTypeEnum.FLAWS}
+                      label="Flaws"
+                      fallback="+ Add Flaws"
+                      onClick={this.handleTraitShow}
+                    />
+                  </div>
+                </>
+              ),
+            },
+            ...(traits !== null
+              ? [
+                  {
+                    label: "Appearance",
+                    content: (
+                      <ContentGroup header="Appearance">
+                        <TraitContent
+                          traits={traits}
+                          traitKey={Constants.TraitTypeEnum.APPEARANCE}
+                          fallback="+ Add Appearance information"
+                          onClick={this.handleTraitShow}
+                        />
+                      </ContentGroup>
+                    ),
+                  },
+                ]
+              : []),
+          ]}
+        />
+      </section>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    background: rulesEngineSelectors.getBackgroundInfo(state),
+    alignment: rulesEngineSelectors.getAlignment(state),
+    height: rulesEngineSelectors.getHeight(state),
+    weight: rulesEngineSelectors.getWeight(state),
+    size: rulesEngineSelectors.getSize(state),
+    faith: rulesEngineSelectors.getFaith(state),
+    skin: rulesEngineSelectors.getSkin(state),
+    eyes: rulesEngineSelectors.getEyes(state),
+    hair: rulesEngineSelectors.getHair(state),
+    age: rulesEngineSelectors.getAge(state),
+    gender: rulesEngineSelectors.getGender(state),
+    traits: rulesEngineSelectors.getCharacterTraits(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    snippetData: rulesEngineSelectors.getSnippetData(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    abilityLookup: rulesEngineSelectors.getAbilityLookup(state),
+    dataOriginRefData: rulesEngineSelectors.getDataOriginRefData(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+  };
+}
+
+const DescriptionWrapper = (props) => {
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+  const { pane } = useSidebar();
+
+  return (
+    <Description
+      paneContext={pane}
+      characterFeaturesManager={characterFeaturesManager}
+      {...props}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(DescriptionWrapper);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Description/index.ts b/ddb_main/tools/js/CharacterSheet/containers/Description/index.ts
new file mode 100644
index 0000000..562c6b2
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Description/index.ts
@@ -0,0 +1,4 @@
+import Description from "./Description";
+
+export default Description;
+export { Description };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Equipment/Equipment.tsx b/ddb_main/tools/js/CharacterSheet/containers/Equipment/Equipment.tsx
new file mode 100644
index 0000000..e18ff14
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Equipment/Equipment.tsx
@@ -0,0 +1,883 @@
+import Alert from "@mui/material/Alert";
+import Button from "@mui/material/Button";
+import Dialog from "@mui/material/Dialog";
+import DialogActions from "@mui/material/DialogActions";
+import DialogContent from "@mui/material/DialogContent";
+import DialogContentText from "@mui/material/DialogContentText";
+import DialogTitle from "@mui/material/DialogTitle";
+import Stack from "@mui/material/Stack";
+import Tab from "@mui/material/Tab";
+import Tabs from "@mui/material/Tabs";
+import Typography from "@mui/material/Typography";
+import { visuallyHidden } from "@mui/utils";
+import { useContext, ReactNode, MouseEvent, PureComponent } from "react";
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  DarkBuilderSvg,
+  FeatureFlagContext,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterCurrencyContract,
+  CharacterNotes,
+  CharacterTheme,
+  Constants,
+  ContainerManager,
+  Creature,
+  CreatureUtils,
+  InfusionChoice,
+  InfusionChoiceUtils,
+  Item,
+  ItemUtils,
+  SnippetData,
+  RuleData,
+  rulesEngineSelectors,
+  characterSelectors,
+  BaseCharClass,
+  ContainerUtils,
+  InventoryManager,
+  FormatUtils,
+  CampaignUtils,
+  serviceDataSelectors,
+  PartyInfo,
+  CoinManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemName } from "~/components/ItemName";
+import { Link } from "~/components/Link";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { TabFilter } from "~/components/TabFilter";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import CurrencyButton from "../../../CharacterSheet/components/CurrencyButton";
+import { ItemSlotManager } from "../../../Shared/components/ItemSlotManager";
+import { ThemeButton } from "../../../Shared/components/common/Button";
+import { CoinManagerContext } from "../../../Shared/managers/CoinManagerContext";
+import { InventoryManagerContext } from "../../../Shared/managers/InventoryManagerContext";
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import ContentGroup from "../../components/ContentGroup";
+import EquipmentOverview from "../../components/EquipmentOverview";
+import Infusions from "../../components/Infusions";
+import InventoryFilter from "../../components/InventoryFilter";
+import InventoryTableHeader from "../../components/InventoryTableHeader";
+import OtherPossessions from "../../components/OtherPossessions";
+import { sheetAppSelectors } from "../../selectors";
+import { SheetAppState } from "../../typings";
+import Attunement from "../Attunement";
+import Inventory from "../Inventory";
+
+interface Props {
+  showNotes: boolean;
+
+  builderUrl: string;
+  inventory: Array<Item>;
+  partyInventory: Array<Item>;
+  creatures: Array<Creature>;
+  currencies: CharacterCurrencyContract | null;
+  notes: CharacterNotes;
+  infusionChoices: Array<InfusionChoice>;
+  weight: number;
+  weightSpeedType: Constants.WeightSpeedTypeEnum;
+  ruleData: RuleData;
+  snippetData: SnippetData;
+  isReadonly: boolean;
+  isMobile: boolean;
+  theme: CharacterTheme;
+  proficiencyBonus: number;
+  classes: Array<BaseCharClass>;
+  inventoryManager: InventoryManager;
+  campaignInfo: PartyInfo | null;
+  coinManager: CoinManager;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+interface StateFilterData {
+  filteredInventory: Array<Item>;
+  filteredPartyInventory: Array<Item>;
+  showAdvancedFilters: boolean;
+  isFiltering: boolean;
+}
+interface State {
+  infusableChoices: Array<InfusionChoice>;
+  filterData: StateFilterData;
+  filteredEquippedInventory: Array<Item>;
+  shouldShowPartyInventory: number;
+  shouldShowDeleteOnlyInfo: boolean;
+}
+
+class Equipment extends PureComponent<Props, State> {
+  static defaultProps = {
+    showNotes: true,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      infusableChoices: props.infusionChoices.filter((infusionChoice) =>
+        InfusionChoiceUtils.canInfuse(infusionChoice)
+      ),
+      filterData: {
+        filteredInventory: [],
+        filteredPartyInventory: [],
+        showAdvancedFilters: false,
+        isFiltering: false,
+      },
+      filteredEquippedInventory: [],
+      shouldShowPartyInventory: 0, // mui used 0,1,2 for tabs so 0 is off 1 is on...
+      shouldShowDeleteOnlyInfo: false,
+    };
+  }
+
+  componentDidUpdate(prevProps: Props, prevState: State) {
+    if (prevProps.infusionChoices !== this.props.infusionChoices) {
+      this.setState({
+        infusableChoices: this.props.infusionChoices.filter((infusionChoice) =>
+          InfusionChoiceUtils.canInfuse(infusionChoice)
+        ),
+      });
+    }
+  }
+
+  handleCurrencyClick = (
+    evt: React.MouseEvent | React.KeyboardEvent,
+    containerDefinitionKey: string
+  ): void => {
+    const { paneHistoryStart } = this.props;
+
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    paneHistoryStart(
+      PaneComponentEnum.CURRENCY,
+      PaneIdentifierUtils.generateCurrencyContext(containerDefinitionKey)
+    );
+  };
+
+  handleWeightClick = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.ENCUMBRANCE);
+  };
+
+  handleCampaignClick = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.CAMPAIGN);
+  };
+
+  handlePossessionsManage = (): void => {
+    const { paneHistoryStart, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(
+        PaneComponentEnum.NOTE_MANAGE,
+        PaneIdentifierUtils.generateNote(
+          Constants.NoteKeyEnum.PERSONAL_POSSESSIONS
+        )
+      );
+    }
+  };
+
+  handleManageClick = (): void => {
+    const { paneHistoryStart } = this.props;
+
+    paneHistoryStart(PaneComponentEnum.EQUIPMENT_MANAGE);
+  };
+
+  handleFilterUpdate = (filterData: StateFilterData): void => {
+    this.setState({
+      filterData,
+      filteredEquippedInventory: [
+        ...filterData.filteredInventory.filter(ItemUtils.isEquipped),
+        ...filterData.filteredPartyInventory.filter(ItemUtils.isEquipped),
+      ],
+    });
+  };
+
+  handleInfusionChoiceShow = (infusionChoice: InfusionChoice): void => {
+    const { paneHistoryStart } = this.props;
+
+    const choiceKey = InfusionChoiceUtils.getKey(infusionChoice);
+    if (choiceKey !== null) {
+      paneHistoryStart(
+        PaneComponentEnum.INFUSION_CHOICE,
+        PaneIdentifierUtils.generateInfusionChoice(choiceKey)
+      );
+    }
+  };
+
+  handleItemShow = (item: Item): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(
+      PaneComponentEnum.ITEM_DETAIL,
+      PaneIdentifierUtils.generateItem(ItemUtils.getMappingId(item))
+    );
+  };
+
+  handleContainerShow = (container: ContainerManager): void => {
+    const { paneHistoryStart } = this.props;
+
+    paneHistoryStart(
+      PaneComponentEnum.CONTAINER,
+      PaneIdentifierUtils.generateContainer(container.getDefinitionKey())
+    );
+  };
+
+  handleCreatureShow = (creature: Creature): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(
+      PaneComponentEnum.CREATURE,
+      PaneIdentifierUtils.generateCreature(CreatureUtils.getMappingId(creature))
+    );
+  };
+
+  shouldRenderInfusions = (): boolean => {
+    const { infusionChoices } = this.props;
+
+    return infusionChoices.length > 0;
+  };
+
+  renderContainer = (
+    container: ContainerManager,
+    inventory: Array<Item>
+  ): ReactNode => {
+    const { shouldShowPartyInventory } = this.state;
+    const { isReadonly, showNotes, theme, coinManager } = this.props;
+    const containerMappingId = container.getMappingId();
+
+    const containerName = container.getName();
+    const weightInfo = container.getWeightInfo();
+
+    const containerInventory = container.getInventoryItems({
+      filteredInventory: inventory,
+    }).items;
+    const containerItem = container.getContainerItem();
+
+    const quantityNode = (
+      <span className="ct-equipment__container-quantity">{`(${containerInventory.length})`}</span>
+    );
+    const nameNode: ReactNode = containerItem ? (
+      <>
+        <ItemName item={containerItem.item} /> {quantityNode}
+      </>
+    ) : (
+      <>
+        {containerName} {quantityNode}
+      </>
+    );
+
+    const headerNode: ReactNode = (
+      <div
+        className="ct-equipment__container ct-inventory-item"
+        onClick={(evt) => {
+          evt.nativeEvent.stopImmediatePropagation();
+          this.handleContainerShow(container);
+        }}
+        role="button"
+        data-testid={`${containerItem?.getName() || containerName}-section`
+          .toLowerCase()
+          .replace(/\s/g, "-")}
+      >
+        <div className="ct-equipment__container-action ct-inventory-item__action">
+          {containerItem && (
+            <ItemSlotManager
+              isUsed={!!containerItem.isEquipped()}
+              isReadonly={isReadonly}
+              canUse={
+                !(
+                  containerItem.isEquipped() &&
+                  !containerItem.isEquippedToCurrentCharacter()
+                )
+              }
+              onSet={(uses) => {
+                if (uses === 0) {
+                  containerItem.handleUnequip();
+                }
+
+                if (uses === 1) {
+                  containerItem.handleEquip();
+                }
+              }}
+              theme={theme}
+              useTooltip={false}
+            />
+          )}
+        </div>
+        <div className="ct-equipment__container-name ct-inventory-item__name">
+          {nameNode}
+        </div>
+        <div className="ct-equipment__container-weight ct-inventory-item__weight">
+          <NumberDisplay type="weightInLb" number={weightInfo.applied} />
+          {weightInfo.capacity > 0 && (
+            <span className="ct-equipment__container-weight-capacity">
+              ({Math.ceil(weightInfo.total)}/
+              {FormatUtils.renderWeight(weightInfo.capacity)})
+            </span>
+          )}
+        </div>
+        {coinManager.canUseCointainers() ? (
+          <div className="ct-equipment__container-coin">
+            <CurrencyButton
+              coin={ContainerUtils.getCoin(container.container)}
+              isDarkMode={theme.isDarkMode}
+              shouldShowPartyInventory={shouldShowPartyInventory === 1}
+              handleCurrencyClick={(evt) =>
+                this.handleCurrencyClick(
+                  evt,
+                  ContainerUtils.getDefinitionKey(container.container)
+                )
+              }
+            />
+          </div>
+        ) : (
+          containerItem &&
+          container.isEquipped() &&
+          !containerItem.isEquippedToCurrentCharacter() && (
+            <div className="ct-equipment__container-equipped">
+              Equipped by {containerItem.getEquippedCharacterName()}
+            </div>
+          )
+        )}
+      </div>
+    );
+
+    return (
+      <ContentGroup key={containerMappingId} header={headerNode}>
+        <Inventory
+          container={container}
+          inventory={containerInventory}
+          showNotes={showNotes}
+          showTableHeader={false}
+          isReadonly={isReadonly}
+          theme={theme}
+        />
+      </ContentGroup>
+    );
+  };
+
+  renderCharacterContainers = (): ReactNode => {
+    const { filterData } = this.state;
+    const { inventoryManager } = this.props;
+
+    return inventoryManager
+      .getCharacterContainers()
+      .map((container) =>
+        this.renderContainer(container, filterData.filteredInventory)
+      );
+  };
+
+  renderPartyContainers = (): ReactNode => {
+    const { filterData } = this.state;
+    const { inventoryManager } = this.props;
+
+    return inventoryManager
+      .getPartyContainers()
+      .map((container) =>
+        this.renderContainer(container, filterData.filteredPartyInventory)
+      );
+  };
+
+  renderAttunement = (): ReactNode => {
+    const { isMobile, theme } = this.props;
+
+    return (
+      <ContentGroup header="Attunement">
+        <Attunement isMobile={isMobile} />
+      </ContentGroup>
+    );
+  };
+
+  renderInfusions = (): ReactNode => {
+    const { infusableChoices } = this.state;
+    const {
+      builderUrl,
+      infusionChoices,
+      isReadonly,
+      snippetData,
+      inventory,
+      partyInventory,
+      creatures,
+      ruleData,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    const headerNode: ReactNode = (
+      <>
+        Infusions{" "}
+        {infusableChoices.length !== infusionChoices.length && (
+          <>
+            ({infusableChoices.length}/{infusionChoices.length} Known Infusions)
+          </>
+        )}
+      </>
+    );
+
+    let extraNode: ReactNode = null;
+    if (!isReadonly) {
+      extraNode = (
+        <Link
+          href={builderUrl}
+          className="ct-equipment__builder-link"
+          useRouter
+        >
+          <DarkBuilderSvg />
+          <span className="ct-equipment__builder-link-text">
+            Manage Infusions
+          </span>
+        </Link>
+      );
+    }
+
+    return (
+      <ContentGroup header={headerNode} extra={extraNode}>
+        <Infusions
+          theme={theme}
+          infusionChoices={infusableChoices}
+          inventory={[...inventory, ...partyInventory]}
+          creatures={creatures}
+          snippetData={snippetData}
+          onCreatureShow={this.handleCreatureShow}
+          onItemShow={this.handleItemShow}
+          onInfusionChoiceShow={this.handleInfusionChoiceShow}
+          ruleData={ruleData}
+          isReadonly={isReadonly}
+          proficiencyBonus={proficiencyBonus}
+        />
+      </ContentGroup>
+    );
+  };
+
+  renderOtherPossessions = (): ReactNode => {
+    const { notes, isReadonly } = this.props;
+
+    if (isReadonly) {
+      return null;
+    }
+
+    return (
+      <ContentGroup header="Other Possessions">
+        <OtherPossessions
+          notes={notes}
+          onClick={this.handlePossessionsManage}
+        />
+      </ContentGroup>
+    );
+  };
+
+  renderContent = (): ReactNode => {
+    const {
+      isReadonly,
+      inventoryManager,
+      inventory,
+      partyInventory,
+      showNotes,
+    } = this.props;
+    const { shouldShowPartyInventory } = this.state;
+
+    const headerNode: ReactNode = (
+      <div
+        className="ct-equipment__container"
+        onClick={(evt) => {
+          evt.nativeEvent.stopImmediatePropagation();
+          this.handleManageClick();
+        }}
+      >
+        Party Inventory
+      </div>
+    );
+
+    return (
+      <div className="ct-equipment__content">
+        <TabFilter
+          sharedChildren={<InventoryTableHeader showNotes={showNotes} />}
+          filters={[
+            {
+              label: "All",
+              content: (
+                <>
+                  {shouldShowPartyInventory === 0 ? (
+                    <>
+                      {this.renderCharacterContainers()}
+                      {this.renderAttunement()}
+                      {this.shouldRenderInfusions() && this.renderInfusions()}
+                      {this.renderOtherPossessions()}
+                    </>
+                  ) : null}
+                  <FeatureFlagContext.Consumer>
+                    {({ imsFlag }) => {
+                      return imsFlag &&
+                        shouldShowPartyInventory === 1 &&
+                        inventoryManager.getPartyContainers().length > 0 ? (
+                        <ContentGroup header={headerNode}>
+                          {this.renderPartyContainers()}
+                        </ContentGroup>
+                      ) : null;
+                    }}
+                  </FeatureFlagContext.Consumer>
+                </>
+              ),
+            },
+            ...(shouldShowPartyInventory === 0
+              ? inventoryManager
+                  .getCharacterContainers()
+                  .map((characterContainer) => ({
+                    label: characterContainer.getName(),
+                    content: this.renderContainer(
+                      characterContainer,
+                      inventory
+                    ),
+                  }))
+              : []),
+            ...(shouldShowPartyInventory === 1
+              ? inventoryManager.getPartyContainers().map((partyContainer) => ({
+                  label: partyContainer.getName(),
+                  content: this.renderContainer(partyContainer, partyInventory),
+                }))
+              : []),
+            ...(shouldShowPartyInventory === 0
+              ? [
+                  {
+                    label: "Attunement",
+                    content: this.renderAttunement(),
+                  },
+                  ...(this.shouldRenderInfusions()
+                    ? [
+                        {
+                          label: "Infusions",
+                          content: this.renderInfusions(),
+                        },
+                      ]
+                    : []),
+                  ...(!isReadonly
+                    ? [
+                        {
+                          label: "Other Possessions",
+                          content: this.renderOtherPossessions(),
+                        },
+                      ]
+                    : []),
+                ]
+              : []),
+          ]}
+          showAllTab={false}
+        />
+      </div>
+    );
+  };
+
+  renderManageButton = (): ReactNode => {
+    const { isReadonly } = this.props;
+
+    if (isReadonly) {
+      return null;
+    }
+
+    return (
+      <ThemeButton
+        style="outline"
+        size="medium"
+        onClick={this.handleManageClick}
+        data-testid="open-manage-equipment"
+      >
+        Manage Inventory
+      </ThemeButton>
+    );
+  };
+
+  toggleShouldShowPartyInventory = (event, newValue): void => {
+    this.setState({
+      shouldShowPartyInventory: newValue,
+    });
+  };
+  handleCloseDeleteOnlyInfo = (event: MouseEvent): void => {
+    event.stopPropagation();
+    event.nativeEvent.stopImmediatePropagation();
+    this.setState({
+      shouldShowDeleteOnlyInfo: false,
+    });
+  };
+  handleOpenDeleteOnlyInfo = (event: MouseEvent): void => {
+    event.stopPropagation();
+    event.nativeEvent.stopImmediatePropagation();
+    this.setState({
+      shouldShowDeleteOnlyInfo: true,
+    });
+  };
+
+  renderDeleteOnlyAlertAction = (): ReactNode => {
+    const { shouldShowDeleteOnlyInfo } = this.state;
+    const { campaignInfo } = this.props;
+    return (
+      <div>
+        <ThemeButton
+          style="outline"
+          size="medium"
+          onClick={this.handleOpenDeleteOnlyInfo}
+        >
+          More Info
+        </ThemeButton>
+        <Dialog
+          open={shouldShowDeleteOnlyInfo}
+          onClose={this.handleCloseDeleteOnlyInfo}
+          aria-labelledby="alert-dialog-title"
+          aria-describedby="alert-dialog-description"
+        >
+          <DialogTitle id="alert-dialog-title">Delete Only</DialogTitle>
+          <DialogContent>
+            <DialogContentText id="alert-dialog-description">
+              Party Inventory sharing isn’t currently enabled for this campaign.
+              Your old items are still here, but you won’t be able to add new
+              items until it’s turned on again.
+            </DialogContentText>
+          </DialogContent>
+          <DialogActions>
+            {campaignInfo ? (
+              <Button
+                variant="outlined"
+                color="primary"
+                component="a"
+                href={CampaignUtils.getLink(campaignInfo) || "/my-campaigns"}
+                size="small"
+              >
+                go to campaign
+              </Button>
+            ) : null}
+            <Button
+              variant="outlined"
+              color="primary"
+              onClick={this.handleCloseDeleteOnlyInfo}
+              autoFocus
+              size="small"
+            >
+              Close
+            </Button>
+          </DialogActions>
+        </Dialog>
+      </div>
+    );
+  };
+
+  renderOverviewFiltersAndContent = (): ReactNode => {
+    const { filterData, shouldShowPartyInventory } = this.state;
+    const {
+      currencies,
+      weight,
+      weightSpeedType,
+      inventory,
+      ruleData,
+      theme,
+      partyInventory,
+      campaignInfo,
+      inventoryManager,
+      coinManager,
+    } = this.props;
+
+    const cointainerFlagEnabled: boolean = coinManager.canUseCointainers();
+    let coin: CharacterCurrencyContract | null = currencies;
+    if (shouldShowPartyInventory === 1 && campaignInfo) {
+      // We need all the party coin if flag is on, or just Party Equipment coin if not
+      if (cointainerFlagEnabled) {
+        coin = coinManager.getAllPartyCoin();
+      } else {
+        coin = CampaignUtils.getCoin(campaignInfo);
+      }
+    } else if (cointainerFlagEnabled) {
+      // We need to change it to all container currencies
+      coin = coinManager.getAllCharacterCoin();
+    }
+
+    return (
+      <>
+        <div className="ct-equipment__overview">
+          <EquipmentOverview
+            shouldShowPartyInventory={shouldShowPartyInventory === 1}
+            currencies={coin}
+            weight={weight}
+            weightSpeedType={weightSpeedType}
+            onCurrencyClick={(evt) =>
+              this.handleCurrencyClick(
+                evt,
+                shouldShowPartyInventory === 1
+                  ? inventoryManager.getPartyEquipmentContainerDefinitionKey() ??
+                      inventoryManager.getCharacterContainerDefinitionKey()
+                  : inventoryManager.getCharacterContainerDefinitionKey()
+              )
+            }
+            onWeightClick={this.handleWeightClick}
+            onCampaignClick={this.handleCampaignClick}
+            enableManage={false}
+            isDarkMode={theme.isDarkMode}
+            campaignName={
+              campaignInfo !== null ? CampaignUtils.getName(campaignInfo) : null
+            }
+          />
+        </div>
+        <div className="ct-equipment__filter">
+          <InventoryFilter
+            partyInventory={partyInventory}
+            inventory={inventory}
+            ruleData={ruleData}
+            onDataUpdate={this.handleFilterUpdate}
+            callout={this.renderManageButton()}
+            theme={theme}
+          />
+        </div>
+        {!filterData.showAdvancedFilters && this.renderContent()}
+      </>
+    );
+  };
+
+  renderOptinToInventorySharing = (): ReactNode => {
+    const { campaignInfo } = this.props;
+
+    return (
+      <>
+        <Stack justifyContent="center">
+          <Stack marginBottom="10px" marginTop="40px">
+            <Typography color="primary" align="center" variant="body2">
+              Want a hand with that loot?
+            </Typography>
+          </Stack>
+          <Stack marginBottom="30px" alignItems={"center"}>
+            <Typography
+              align="center"
+              variant="body1"
+              sx={{ maxWidth: "320px" }}
+            >
+              Party Inventory makes it easy for your group to keep track of all
+              their shared loot and coin. Add it to your campaign today with a
+              subscription to D&D Beyond!
+            </Typography>
+          </Stack>
+          <Stack
+            spacing={2}
+            direction={{ xs: "column", sm: "row" }}
+            justifyContent="center"
+          >
+            {campaignInfo ? (
+              <Button
+                variant="contained"
+                color="primary"
+                component="a"
+                href={CampaignUtils.getLink(campaignInfo) || "/my-campaigns"}
+                size="large"
+                sx={{
+                  marginLeft: { xs: 0 },
+                  marginRight: { xs: 0 },
+                }}
+              >
+                go to campaign
+              </Button>
+            ) : null}
+
+            <Button variant="contained" color="primary" size="large">
+              view subscription plans
+            </Button>
+          </Stack>
+          <Stack
+            style={{ display: "flex", justifyContent: "center", marginTop: 51 }}
+          >
+            <div className="ct-item-detail__full-image">
+              <img
+                className="ct-item-detail__full-image-img"
+                src="https://www.dndbeyond.com/avatars/thumbnails/7/120/315/315/636284708068284913.jpeg"
+                alt=""
+              />
+            </div>
+          </Stack>
+        </Stack>
+      </>
+    );
+  };
+
+  render() {
+    const { shouldShowPartyInventory } = this.state;
+    const { campaignInfo, inventoryManager } = this.props;
+
+    return (
+      <section className="ct-equipment">
+        <h2 style={visuallyHidden}>Inventory</h2>
+        <FeatureFlagContext.Consumer>
+          {({ imsFlag }) => {
+            return imsFlag && campaignInfo !== null ? (
+              <>
+                <Tabs
+                  value={shouldShowPartyInventory}
+                  indicatorColor="primary"
+                  textColor="primary"
+                  onChange={this.toggleShouldShowPartyInventory}
+                  aria-label="disabled tabs example"
+                  variant="fullWidth"
+                >
+                  <Tab label="My Inventory" data-testid="my-inventory" />
+                  <Tab label="Party Inventory" data-testid="party-inventory" />
+                </Tabs>
+                {/* TODO: make this go away when last itme is removed... */}
+                {shouldShowPartyInventory &&
+                inventoryManager.isSharingTurnedDeleteOnly() ? (
+                  <div role="button" onMouseUp={this.handleOpenDeleteOnlyInfo}>
+                    <Alert
+                      severity="info"
+                      action={this.renderDeleteOnlyAlertAction()}
+                    >
+                      Party Inventory is currently turned off for this campaign.
+                    </Alert>
+                  </div>
+                ) : null}
+                {shouldShowPartyInventory &&
+                inventoryManager.isSharingTurnedOff()
+                  ? this.renderOptinToInventorySharing()
+                  : this.renderOverviewFiltersAndContent()}
+              </>
+            ) : (
+              this.renderOverviewFiltersAndContent()
+            );
+          }}
+        </FeatureFlagContext.Consumer>
+      </section>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    builderUrl: sheetAppSelectors.getBuilderUrl(state),
+    inventory: rulesEngineSelectors.getInventory(state),
+    partyInventory: rulesEngineSelectors.getPartyInventory(state),
+    creatures: rulesEngineSelectors.getCreatures(state),
+    weight: rulesEngineSelectors.getTotalCarriedWeight(state),
+    weightSpeedType: rulesEngineSelectors.getCurrentCarriedWeightType(state),
+    notes: rulesEngineSelectors.getCharacterNotes(state),
+    infusionChoices: rulesEngineSelectors.getAvailableInfusionChoices(state),
+    currencies: rulesEngineSelectors.getCurrencies(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    snippetData: rulesEngineSelectors.getSnippetData(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    isMobile: appEnvSelectors.getIsMobile(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    classes: characterSelectors.getClasses(state),
+    campaignInfo: serviceDataSelectors.getPartyInfo(state),
+  };
+}
+
+const EquipmentContainer = (props) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const { coinManager } = useContext(CoinManagerContext);
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return (
+    <Equipment
+      inventoryManager={inventoryManager}
+      coinManager={coinManager}
+      paneHistoryStart={paneHistoryStart}
+      {...props}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(EquipmentContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Equipment/index.ts b/ddb_main/tools/js/CharacterSheet/containers/Equipment/index.ts
new file mode 100644
index 0000000..6845d37
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Equipment/index.ts
@@ -0,0 +1,4 @@
+import Equipment from "./Equipment";
+
+export default Equipment;
+export { Equipment };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Extras/Extras.tsx b/ddb_main/tools/js/CharacterSheet/containers/Extras/Extras.tsx
new file mode 100644
index 0000000..3ffbfab
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Extras/Extras.tsx
@@ -0,0 +1,270 @@
+import { visuallyHidden } from "@mui/utils";
+import React, { useContext } from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  rulesEngineSelectors,
+  CharacterTheme,
+  ExtrasFilterData,
+  ExtraGroupInfo,
+  Constants,
+  ExtrasManager,
+  ExtraManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { TabFilter } from "~/components/TabFilter";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { useExtras } from "~/hooks/useExtras";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import ExtraList from "../../../Shared/components/ExtraList";
+import { ThemeButton } from "../../../Shared/components/common/Button";
+import { ExtrasManagerContext } from "../../../Shared/managers/ExtrasManagerContext";
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import ContentGroup from "../../components/ContentGroup";
+import ExtrasFilter from "../../components/ExtrasFilter";
+import { SheetAppState } from "../../typings";
+
+interface Props extends DispatchProp {
+  extras: Array<ExtraManager>;
+  extrasManager: ExtrasManager;
+  isReadonly: boolean;
+  showNotes: boolean;
+  theme: CharacterTheme;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+interface State {
+  filterData: ExtrasFilterData;
+}
+class Extras extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    isReadonly: false,
+    showNotes: true,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      filterData: {
+        filteredExtras: [],
+        showAdvancedFilters: false,
+        isFiltering: false,
+        filterCount: 0,
+      },
+    };
+  }
+
+  handleFilterUpdate = (filterData: ExtrasFilterData): void => {
+    this.setState({
+      filterData,
+    });
+  };
+
+  handleManageClick = (): void => {
+    const { paneHistoryStart } = this.props;
+
+    paneHistoryStart(PaneComponentEnum.EXTRA_MANAGE);
+  };
+
+  handleExtraShow = (extra: ExtraManager): void => {
+    const { paneHistoryStart } = this.props;
+
+    if (extra.isCreature()) {
+      paneHistoryStart(
+        PaneComponentEnum.CREATURE,
+        PaneIdentifierUtils.generateCreature(extra.getMappingId())
+      );
+    } else if (extra.isVehicle()) {
+      paneHistoryStart(
+        PaneComponentEnum.VEHICLE,
+        PaneIdentifierUtils.generateVehicle(extra.getMappingId())
+      );
+    }
+  };
+
+  handleExtraStatusChange = (extra: ExtraManager, isActive: boolean): void => {
+    extra.handleSetActive({ isActive });
+  };
+
+  renderManageButton = (): React.ReactNode => {
+    const { isReadonly } = this.props;
+
+    if (isReadonly) {
+      return null;
+    }
+
+    return (
+      <ThemeButton
+        style="outline"
+        size="medium"
+        onClick={this.handleManageClick}
+      >
+        Manage Extras
+      </ThemeButton>
+    );
+  };
+
+  renderDefault = (): React.ReactNode => {
+    return (
+      <div className="ct-extras__empty">
+        Extras that you add will display here.
+      </div>
+    );
+  };
+
+  renderNoResults = (): React.ReactNode => {
+    return (
+      <div className="ct-extras__empty">No Extras Match the Current Filter</div>
+    );
+  };
+
+  renderContent = (): React.ReactNode => {
+    const { filterData } = this.state;
+    const { extras, extrasManager, showNotes, isReadonly, theme } = this.props;
+
+    if (!extras.length) {
+      return this.renderDefault();
+    }
+
+    if (filterData.showAdvancedFilters) {
+      return null;
+    }
+
+    if (!filterData.filteredExtras.length) {
+      return this.renderNoResults();
+    }
+
+    let groups = extrasManager.getExtrasGroups(filterData.filteredExtras);
+    const orderedGroupInfos = extrasManager.getGroupInfosForExtras(
+      filterData.filteredExtras
+    );
+
+    let primaryGroups: Array<ExtraGroupInfo> = [];
+    let otherGroups: Array<ExtraGroupInfo> = [];
+    let vehicleGroups: Array<ExtraGroupInfo> = [];
+    orderedGroupInfos.forEach((groupInfo) => {
+      if (groupInfo) {
+        if (groupInfo.isPrimary) {
+          primaryGroups.push(groupInfo);
+        } else if (groupInfo.id === Constants.ExtraGroupTypeEnum.VEHICLE) {
+          vehicleGroups.push(groupInfo);
+        } else {
+          otherGroups.push(groupInfo);
+        }
+      }
+    });
+
+    return (
+      <div className="ct-extras__content">
+        <TabFilter
+          filters={[
+            ...primaryGroups.map((groupInfo) => ({
+              label: groupInfo.name || "",
+              content: (
+                <ContentGroup header={groupInfo.name}>
+                  <ExtraList
+                    theme={theme}
+                    extras={groups[groupInfo.id]}
+                    showNotes={showNotes}
+                    onShow={this.handleExtraShow}
+                    onStatusChange={this.handleExtraStatusChange}
+                    isReadonly={isReadonly}
+                  />
+                </ContentGroup>
+              ),
+            })),
+            ...(otherGroups.length > 0
+              ? [
+                  {
+                    label: "Other",
+                    content: otherGroups.map((groupInfo) => (
+                      <ContentGroup key={groupInfo.id} header={groupInfo.name}>
+                        <ExtraList
+                          theme={theme}
+                          extras={groups[groupInfo.id]}
+                          showNotes={showNotes}
+                          onShow={this.handleExtraShow}
+                          onStatusChange={this.handleExtraStatusChange}
+                          isReadonly={isReadonly}
+                        />
+                      </ContentGroup>
+                    )),
+                  },
+                ]
+              : []),
+            ...(vehicleGroups.length > 0
+              ? [
+                  {
+                    label: "Vehicle",
+                    content: vehicleGroups.map((groupInfo) => (
+                      <ContentGroup key={groupInfo.id} header={groupInfo.name}>
+                        <ExtraList
+                          theme={theme}
+                          extras={groups[groupInfo.id]}
+                          showNotes={showNotes}
+                          onShow={this.handleExtraShow}
+                          onStatusChange={this.handleExtraStatusChange}
+                          isReadonly={isReadonly}
+                        />
+                      </ContentGroup>
+                    )),
+                  },
+                ]
+              : []),
+          ]}
+        />
+      </div>
+    );
+  };
+
+  render() {
+    const { extras, theme } = this.props;
+
+    return (
+      <section
+        className={`ct-extras ${
+          theme.isDarkMode ? "ct-extras--dark-mode" : ""
+        }`}
+      >
+        <h2 style={visuallyHidden}>Extras</h2>
+        <div className="ct-extras__filter">
+          <ExtrasFilter
+            extras={extras}
+            onDataUpdate={this.handleFilterUpdate}
+            callout={this.renderManageButton()}
+            theme={theme}
+          />
+        </div>
+        {this.renderContent()}
+      </section>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+function ExtrasContainer(props) {
+  const { extrasManager } = useContext(ExtrasManagerContext);
+  const extras = useExtras();
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return (
+    <Extras
+      extrasManager={extrasManager}
+      paneHistoryStart={paneHistoryStart}
+      extras={extras}
+      {...props}
+    />
+  );
+}
+
+export default connect(mapStateToProps)(ExtrasContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Extras/index.ts b/ddb_main/tools/js/CharacterSheet/containers/Extras/index.ts
new file mode 100644
index 0000000..c23aa7f
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Extras/index.ts
@@ -0,0 +1,4 @@
+import Extras from "./Extras";
+
+export default Extras;
+export { Extras };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Features/Features.tsx b/ddb_main/tools/js/CharacterSheet/containers/Features/Features.tsx
new file mode 100644
index 0000000..25dacdd
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Features/Features.tsx
@@ -0,0 +1,366 @@
+import { visuallyHidden } from "@mui/utils";
+import React, { useContext, useEffect, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import {
+  rulesEngineSelectors,
+  ClassUtils,
+  FeatureUtils,
+  InfusionChoiceUtils,
+  RacialTrait,
+  RacialTraitUtils,
+  FeaturesManager,
+  FeatManager,
+  Action,
+  ActionUtils,
+  Spell,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { TabFilter } from "~/components/TabFilter";
+import { useFeatureFlags } from "~/contexts/FeatureFlag";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+import { SpeciesDetail } from "~/subApps/sheet/components/SpeciesDetail";
+import { ThemeButton } from "~/tools/js/Shared/components/common/Button";
+
+import {
+  handleActionUseSet,
+  handleSpellUseSet,
+} from "../../../../../handlers/commonHandlers";
+import { CharacterFeaturesManagerContext } from "../../../Shared/managers/CharacterFeaturesManagerContext";
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import BlessingsDetail from "../../components/BlessingsDetail";
+import ClassesDetail from "../../components/ClassesDetail";
+import ContentGroup from "../../components/ContentGroup";
+import FeatsDetail from "../../components/FeatsDetail";
+
+//TODO we should break this file out into seperate components rather than have them all in one file
+
+const SpeciesTraitsGroup: React.FC<{}> = () => {
+  const dispatch = useDispatch();
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const snippetData = useSelector(rulesEngineSelectors.getSnippetData);
+  const ruleData = useSelector(rulesEngineSelectors.getRuleData);
+  const abilityLookup = useSelector(rulesEngineSelectors.getAbilityLookup);
+  const dataOriginRefData = useSelector(
+    rulesEngineSelectors.getDataOriginRefData
+  );
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const proficiencyBonus = useSelector(
+    rulesEngineSelectors.getProficiencyBonus
+  ) as number;
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+  const speciesTraits = useSelector(
+    rulesEngineSelectors.getCurrentLevelRacialTraits
+  ) as RacialTrait[];
+
+  const handleFeatClick = (feat: FeatManager): void => {
+    paneHistoryStart(
+      PaneComponentEnum.FEAT_DETAIL,
+      PaneIdentifierUtils.generateFeat(feat.getId())
+    );
+  };
+
+  const handleActionClick = (action: Action): void => {
+    const mappingId = ActionUtils.getMappingId(action);
+    const mappingEntityTypeId = ActionUtils.getMappingEntityTypeId(action);
+
+    if (mappingId !== null && mappingEntityTypeId !== null) {
+      paneHistoryStart(
+        PaneComponentEnum.ACTION,
+        PaneIdentifierUtils.generateAction(mappingId, mappingEntityTypeId)
+      );
+    }
+  };
+
+  const handleSpellDetailClick = (spell: Spell): void => {
+    const mappingId = SpellUtils.getMappingId(spell);
+    if (mappingId !== null) {
+      paneHistoryStart(
+        PaneComponentEnum.CHARACTER_SPELL_DETAIL,
+        PaneIdentifierUtils.generateCharacterSpell(mappingId)
+      );
+    }
+  };
+
+  return (
+    <ContentGroup header="Species Traits">
+      <SpeciesDetail
+        onActionUseSet={(action, uses) =>
+          handleActionUseSet(action, uses, dispatch)
+        }
+        onActionClick={(action) => handleActionClick(action)}
+        onSpellClick={(spell) => handleSpellDetailClick(spell)}
+        onSpellUseSet={(spell, uses) =>
+          handleSpellUseSet(spell, uses, dispatch)
+        }
+        onFeatureClick={(feature) => {
+          paneHistoryStart(
+            PaneComponentEnum.SPECIES_TRAIT_DETAIL,
+            PaneIdentifierUtils.generateRacialTrait(
+              RacialTraitUtils.getId(feature)
+            )
+          );
+        }}
+        feats={characterFeaturesManager
+          .getFeats()
+          .map((manager) => manager.feat)}
+        isReadonly={isReadonly}
+        snippetData={snippetData}
+        ruleData={ruleData}
+        abilityLookup={abilityLookup}
+        dataOriginRefData={dataOriginRefData}
+        proficiencyBonus={proficiencyBonus}
+        theme={theme}
+        speciesTraits={speciesTraits}
+        onFeatClick={(feat) => handleFeatClick(feat)}
+        featuresManager={characterFeaturesManager}
+      />
+    </ContentGroup>
+  );
+};
+
+const ClassFeaturesGroup: React.FC<{}> = () => {
+  const dispatch = useDispatch();
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const classes = useSelector(rulesEngineSelectors.getClasses);
+  const snippetData = useSelector(rulesEngineSelectors.getSnippetData);
+  const ruleData = useSelector(rulesEngineSelectors.getRuleData);
+  const abilityLookup = useSelector(rulesEngineSelectors.getAbilityLookup);
+  const dataOriginRefData = useSelector(
+    rulesEngineSelectors.getDataOriginRefData
+  );
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const proficiencyBonus = useSelector(
+    rulesEngineSelectors.getProficiencyBonus
+  );
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+
+  const handleFeatClick = (feat: FeatManager): void => {
+    paneHistoryStart(
+      PaneComponentEnum.FEAT_DETAIL,
+      PaneIdentifierUtils.generateFeat(feat.getId())
+    );
+  };
+
+  const handleActionClick = (action: Action): void => {
+    const mappingId = ActionUtils.getMappingId(action);
+    const mappingEntityTypeId = ActionUtils.getMappingEntityTypeId(action);
+
+    if (mappingId !== null && mappingEntityTypeId !== null) {
+      paneHistoryStart(
+        PaneComponentEnum.ACTION,
+        PaneIdentifierUtils.generateAction(mappingId, mappingEntityTypeId)
+      );
+    }
+  };
+
+  const handleSpellDetailClick = (spell: Spell): void => {
+    const mappingId = SpellUtils.getMappingId(spell);
+    if (mappingId !== null) {
+      paneHistoryStart(
+        PaneComponentEnum.CHARACTER_SPELL_DETAIL,
+        PaneIdentifierUtils.generateCharacterSpell(mappingId)
+      );
+    }
+  };
+
+  return (
+    <ContentGroup header="Class Features">
+      <ClassesDetail
+        classes={classes}
+        onActionUseSet={(action, uses) =>
+          handleActionUseSet(action, uses, dispatch)
+        }
+        onActionClick={(action) => handleActionClick(action)}
+        onSpellClick={(spell) => handleSpellDetailClick(spell)}
+        onSpellUseSet={(spell, uses) =>
+          handleSpellUseSet(spell, uses, dispatch)
+        }
+        onFeatureClick={(feature, charClass) => {
+          paneHistoryStart(
+            PaneComponentEnum.CLASS_FEATURE_DETAIL,
+            PaneIdentifierUtils.generateClassFeature(
+              FeatureUtils.getId(feature),
+              ClassUtils.getMappingId(charClass)
+            )
+          );
+        }}
+        onInfusionChoiceClick={(infusionChoice) => {
+          const choiceKey = InfusionChoiceUtils.getKey(infusionChoice);
+          if (choiceKey !== null) {
+            paneHistoryStart(
+              PaneComponentEnum.INFUSION_CHOICE,
+              PaneIdentifierUtils.generateInfusionChoice(choiceKey)
+            );
+          }
+        }}
+        feats={characterFeaturesManager
+          .getFeats()
+          .map((manager) => manager.feat)}
+        isReadonly={isReadonly}
+        snippetData={snippetData}
+        ruleData={ruleData}
+        abilityLookup={abilityLookup}
+        dataOriginRefData={dataOriginRefData}
+        proficiencyBonus={proficiencyBonus}
+        theme={theme}
+        onFeatClick={(feat) => handleFeatClick(feat)}
+        featuresManager={characterFeaturesManager}
+      />
+    </ContentGroup>
+  );
+};
+
+const FeatsGroup: React.FC<{}> = () => {
+  const dispatch = useDispatch();
+  const { gfsBlessingsUiFlag } = useFeatureFlags();
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const snippetData = useSelector(rulesEngineSelectors.getSnippetData);
+  const ruleData = useSelector(rulesEngineSelectors.getRuleData);
+  const abilityLookup = useSelector(rulesEngineSelectors.getAbilityLookup);
+  const dataOriginRefData = useSelector(
+    rulesEngineSelectors.getDataOriginRefData
+  );
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const proficiencyBonus = useSelector(
+    rulesEngineSelectors.getProficiencyBonus
+  );
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+
+  const handleFeatClick = (feat: FeatManager): void => {
+    paneHistoryStart(
+      PaneComponentEnum.FEAT_DETAIL,
+      PaneIdentifierUtils.generateFeat(feat.getId())
+    );
+  };
+
+  const handleActionClick = (action: Action): void => {
+    const mappingId = ActionUtils.getMappingId(action);
+    const mappingEntityTypeId = ActionUtils.getMappingEntityTypeId(action);
+
+    if (mappingId !== null && mappingEntityTypeId !== null) {
+      paneHistoryStart(
+        PaneComponentEnum.ACTION,
+        PaneIdentifierUtils.generateAction(mappingId, mappingEntityTypeId)
+      );
+    }
+  };
+
+  const handleSpellDetailClick = (spell: Spell): void => {
+    const mappingId = SpellUtils.getMappingId(spell);
+    if (mappingId !== null) {
+      paneHistoryStart(
+        PaneComponentEnum.CHARACTER_SPELL_DETAIL,
+        PaneIdentifierUtils.generateCharacterSpell(mappingId)
+      );
+    }
+  };
+
+  return (
+    <ContentGroup header="Feats">
+      {!isReadonly && (
+        <div className="ct-features__management-link">
+          <ThemeButton
+            onClick={() => paneHistoryStart(PaneComponentEnum.FEATS_MANAGE)}
+            style="outline"
+            size="medium"
+          >
+            Manage {gfsBlessingsUiFlag ? "Features" : "Feats"}
+          </ThemeButton>
+        </div>
+      )}
+      <FeatsDetail
+        onActionUseSet={(action, uses) =>
+          handleActionUseSet(action, uses, dispatch)
+        }
+        onActionClick={(action) => handleActionClick(action)}
+        onSpellClick={(spell) => handleSpellDetailClick(spell)}
+        onSpellUseSet={(spell, uses) =>
+          handleSpellUseSet(spell, uses, dispatch)
+        }
+        onFeatureClick={(feat) => handleFeatClick(feat)}
+        isReadonly={isReadonly}
+        snippetData={snippetData}
+        ruleData={ruleData}
+        abilityLookup={abilityLookup}
+        dataOriginRefData={dataOriginRefData}
+        proficiencyBonus={proficiencyBonus}
+        theme={theme}
+      />
+    </ContentGroup>
+  );
+};
+
+const BlessingsGroup: React.FC<{}> = () => {
+  return (
+    <ContentGroup header="Blessings">
+      <BlessingsDetail />
+    </ContentGroup>
+  );
+};
+
+const Features: React.FC<{}> = () => {
+  const { gfsBlessingsUiFlag } = useFeatureFlags();
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+
+  const [hasBlessings, setHasBlessings] = useState(false);
+
+  useEffect(() => {
+    async function onUpdate() {
+      const hasBlessings = gfsBlessingsUiFlag
+        ? await characterFeaturesManager.hasBlessings()
+        : false;
+      setHasBlessings(hasBlessings);
+    }
+    return FeaturesManager.subscribeToUpdates({ onUpdate });
+  }, [setHasBlessings]);
+
+  return (
+    <section className="ct-features">
+      <h2 style={visuallyHidden}>Features and Traits</h2>
+      <TabFilter
+        filters={[
+          {
+            label: "Class Features",
+            content: <ClassFeaturesGroup />,
+          },
+          {
+            label: "Species Traits",
+            content: <SpeciesTraitsGroup />,
+          },
+          {
+            label: "Feats",
+            content: <FeatsGroup />,
+          },
+          ...(gfsBlessingsUiFlag && hasBlessings
+            ? [{ label: "Blessings", content: <BlessingsGroup /> }]
+            : []),
+        ]}
+      />
+    </section>
+  );
+};
+
+export default Features;
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Features/index.ts b/ddb_main/tools/js/CharacterSheet/containers/Features/index.ts
new file mode 100644
index 0000000..8b8fa5c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Features/index.ts
@@ -0,0 +1,4 @@
+import Features from "./Features";
+
+export default Features;
+export { Features };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Inventory/Inventory.tsx b/ddb_main/tools/js/CharacterSheet/containers/Inventory/Inventory.tsx
new file mode 100644
index 0000000..674e6b8
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Inventory/Inventory.tsx
@@ -0,0 +1,242 @@
+import React, { useCallback, useContext, useState } from "react";
+
+import {
+  CharacterTheme,
+  ContainerManager,
+  ItemManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { ThemeButton } from "../../../Shared/components/common/Button";
+import { InventoryManagerContext } from "../../../Shared/managers/InventoryManagerContext";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import InventoryItem from "../../components/InventoryItem";
+import { InventoryTableHeader } from "../../components/InventoryTableHeader";
+
+interface Props {
+  container: ContainerManager;
+  inventory: Array<ItemManager>;
+  showNotes?: boolean;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  showTableHeader?: boolean;
+}
+
+interface InventoryActionsProps
+  extends Pick<Props, "isReadonly" | "container" | "inventory"> {
+  onContainerClick: (
+    evt: React.MouseEvent | React.KeyboardEvent,
+    container: ContainerManager,
+    showAddItems: boolean
+  ) => void;
+  showContents: boolean;
+  onShowContentsClick: (showContents: boolean) => void;
+}
+const InventoryActions: React.FC<InventoryActionsProps> = ({
+  isReadonly,
+  container,
+  inventory,
+  onContainerClick,
+  onShowContentsClick,
+  showContents,
+}) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+
+  if (isReadonly) {
+    return null;
+  }
+
+  const containerName = container.getName();
+
+  const classNames: Array<string> = ["ct-inventory__actions"];
+  if (inventory.length > 0 && showContents) {
+    classNames.push("ct-inventory__actions--collapsed");
+  }
+
+  return (
+    <div className={classNames.join(" ")}>
+      {inventoryManager.canAddToContainer(container.container) ? (
+        <span
+          role="button"
+          className="ct-inventory__action"
+          onClick={(evt) => onContainerClick(evt, container, true)}
+          onKeyDown={(evt) => {
+            if (evt.key === "Enter") {
+              onContainerClick(evt, container, true);
+            }
+          }}
+        >
+          {container.isCharacterContainer()
+            ? `+ Add ${containerName}`
+            : `+ Add items to your ${containerName}`}
+        </span>
+      ) : (
+        <span />
+      )}
+      {inventory.length > 0 && (
+        <span
+          role="button"
+          className="ct-inventory__action"
+          onClick={() => onShowContentsClick(!showContents)}
+          onKeyDown={(evt) => {
+            if (evt.key === "Enter") {
+              onShowContentsClick(!showContents);
+            }
+          }}
+        >
+          {showContents ? "Hide Contents" : "Show Contents"}
+        </span>
+      )}
+    </div>
+  );
+};
+
+const EmptyInventory: React.FC<InventoryActionsProps> = ({
+  isReadonly,
+  container,
+  inventory,
+  ...restProps
+}) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  if (isReadonly) {
+    return (
+      <div className="ct-inventory__empty">
+        No equipment has been added for this character.
+      </div>
+    );
+  }
+
+  if (container.isCharacterContainer()) {
+    return (
+      <div className="ct-inventory__choose">
+        <div className="ct-inventory__choose-actions">
+          <div className="ct-inventory__choose-action">
+            <ThemeButton
+              block={true}
+              onClick={() =>
+                paneHistoryStart(PaneComponentEnum.STARTING_EQUIPMENT)
+              }
+              stopPropagation={true}
+            >
+              Starting Equipment or Gold
+            </ThemeButton>
+          </div>
+          <div className="ct-inventory__choose-action-sep">or</div>
+          <div className="ct-inventory__choose-action">
+            <ThemeButton
+              block={true}
+              onClick={() =>
+                paneHistoryStart(PaneComponentEnum.EQUIPMENT_MANAGE)
+              }
+              stopPropagation={true}
+            >
+              Add Items
+            </ThemeButton>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <InventoryActions
+      inventory={inventory}
+      container={container}
+      isReadonly={isReadonly}
+      onContainerClick={restProps.onContainerClick}
+      showContents={restProps.showContents}
+      onShowContentsClick={restProps.onShowContentsClick}
+    />
+  );
+};
+
+const Inventory: React.FC<Props> = ({
+  container,
+  inventory,
+  showNotes = true,
+  isReadonly,
+  theme,
+  showTableHeader = true,
+}) => {
+  const [showContents, setShowContents] = useState(true);
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const handleContainerShow = useCallback(
+    (
+      evt: React.MouseEvent | React.KeyboardEvent,
+      container: ContainerManager,
+      showAddItems: boolean
+    ): void => {
+      evt.nativeEvent.stopImmediatePropagation();
+      evt.stopPropagation();
+
+      paneHistoryStart(
+        PaneComponentEnum.CONTAINER,
+        PaneIdentifierUtils.generateContainer(
+          container.getDefinitionKey(),
+          showAddItems
+        )
+      );
+    },
+    [container]
+  );
+
+  const isEmpty: boolean = inventory.length === 0;
+
+  return (
+    <div className="ct-inventory">
+      {/*<h2 style={visuallyHidden}>Inventory</h2>*/}
+      {showTableHeader && <InventoryTableHeader showNotes={showNotes} />}
+      <div className="ct-inventory__items">
+        {isEmpty ? (
+          <EmptyInventory
+            inventory={inventory}
+            container={container}
+            isReadonly={isReadonly}
+            onShowContentsClick={setShowContents}
+            showContents={showContents}
+            onContainerClick={handleContainerShow}
+          />
+        ) : (
+          <React.Fragment>
+            {showContents &&
+              inventory.map((item) => (
+                <InventoryItem
+                  key={item.getUniqueKey()}
+                  item={item}
+                  onEquip={item.handleEquip}
+                  onUnequip={item.handleUnequip}
+                  onItemShow={(mappingId) =>
+                    paneHistoryStart(
+                      PaneComponentEnum.ITEM_DETAIL,
+                      PaneIdentifierUtils.generateItem(mappingId)
+                    )
+                  }
+                  showNotes={showNotes}
+                  theme={theme}
+                  isReadonly={isReadonly}
+                />
+              ))}
+            <InventoryActions
+              inventory={inventory}
+              container={container}
+              isReadonly={isReadonly}
+              onContainerClick={handleContainerShow}
+              onShowContentsClick={setShowContents}
+              showContents={showContents}
+            />
+          </React.Fragment>
+        )}
+      </div>
+    </div>
+  );
+};
+
+export default Inventory;
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Inventory/index.ts b/ddb_main/tools/js/CharacterSheet/containers/Inventory/index.ts
new file mode 100644
index 0000000..f66565b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Inventory/index.ts
@@ -0,0 +1,4 @@
+import Inventory from "./Inventory";
+
+export default Inventory;
+export { Inventory };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Notes/Notes.tsx b/ddb_main/tools/js/CharacterSheet/containers/Notes/Notes.tsx
new file mode 100644
index 0000000..47e27d3
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Notes/Notes.tsx
@@ -0,0 +1,138 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  CharacterNotes,
+  Constants,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { TabFilter } from "~/components/TabFilter";
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import ContentGroup from "../../components/ContentGroup";
+import { SheetAppState } from "../../typings";
+
+interface NotesProps {
+  notes: CharacterNotes;
+  isReadonly: boolean;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class Notes extends React.PureComponent<NotesProps> {
+  handleNotesManage = (
+    noteType: Constants.NoteKeyEnum,
+    evt: React.MouseEvent
+  ): void => {
+    const { paneHistoryStart, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+
+      paneHistoryStart(
+        PaneComponentEnum.NOTE_MANAGE,
+        PaneIdentifierUtils.generateNote(noteType)
+      );
+    }
+  };
+
+  renderNoteGroup(
+    label: string,
+    key: Constants.NoteKeyEnum,
+    fallback: string = ""
+  ) {
+    const { notes } = this.props;
+
+    let noteData = notes[key];
+    let hasContent: boolean = !!noteData;
+    let content: string = !!noteData ? noteData : fallback;
+
+    let classNames: Array<string> = ["ct-notes__note"];
+    if (!hasContent) {
+      classNames.push("ct-notes__note--no-content");
+    }
+
+    return (
+      <ContentGroup header={label}>
+        <div
+          className={classNames.join(" ")}
+          onClick={this.handleNotesManage.bind(this, key)}
+        >
+          {content}
+        </div>
+      </ContentGroup>
+    );
+  }
+
+  render() {
+    return (
+      <section className="ct-notes">
+        <h2 style={visuallyHidden}>Notes</h2>
+        <TabFilter
+          filters={[
+            {
+              label: "Orgs",
+              content: this.renderNoteGroup(
+                "Organizations",
+                Constants.NoteKeyEnum.ORGANIZATIONS,
+                "+ Add Organizations"
+              ),
+            },
+            {
+              label: "Allies",
+              content: this.renderNoteGroup(
+                "Allies",
+                Constants.NoteKeyEnum.ALLIES,
+                "+ Add Allies"
+              ),
+            },
+            {
+              label: "Enemies",
+              content: this.renderNoteGroup(
+                "Enemies",
+                Constants.NoteKeyEnum.ENEMIES,
+                "+ Add Enemies"
+              ),
+            },
+            {
+              label: "Backstory",
+              content: this.renderNoteGroup(
+                "Backstory",
+                Constants.NoteKeyEnum.BACKSTORY,
+                "+ Add Backstory"
+              ),
+            },
+            {
+              label: "Other",
+              content: this.renderNoteGroup(
+                "Other",
+                Constants.NoteKeyEnum.OTHER,
+                "+ Add Other"
+              ),
+            },
+          ]}
+        />
+      </section>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    notes: rulesEngineSelectors.getCharacterNotes(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+  };
+}
+
+const NotesContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <Notes {...props} paneHistoryStart={paneHistoryStart} />;
+};
+
+export default connect(mapStateToProps)(NotesContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Notes/index.ts b/ddb_main/tools/js/CharacterSheet/containers/Notes/index.ts
new file mode 100644
index 0000000..9861d6f
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Notes/index.ts
@@ -0,0 +1,4 @@
+import Notes from "./Notes";
+
+export default Notes;
+export { Notes };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/PrimaryBox/PrimaryBox.tsx b/ddb_main/tools/js/CharacterSheet/containers/PrimaryBox/PrimaryBox.tsx
new file mode 100644
index 0000000..65779a1
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/PrimaryBox/PrimaryBox.tsx
@@ -0,0 +1,142 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  BeveledBoxSvg517x660,
+  BeveledBoxSvg623x660,
+  BoxBackground,
+} from "@dndbeyond/character-components/es";
+import {
+  characterSelectors,
+  CharacterStatusSlug,
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { TabList } from "~/components/TabList";
+
+import Subsection from "../../../Shared/components/Subsection";
+import { StyleSizeTypeEnum } from "../../../Shared/reducers/appEnv";
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import { SheetAppState } from "../../typings";
+import Actions from "../Actions";
+import Description from "../Description";
+import Equipment from "../Equipment";
+import Extras from "../Extras";
+import Features from "../Features";
+import Notes from "../Notes";
+import Spells from "../Spells";
+import styles from "./styles.module.css";
+
+const TAB_KEY = {
+  ACTIONS: "ACTIONS",
+  SPELLS: "SPELLS",
+  EQUIPMENT: "EQUIPMENT",
+  DESCRIPTION: "DESCRIPTION",
+  NOTES: "NOTES",
+  FEATURES_TRAITS: "FEATURES_TRAITS",
+  EXTRAS: "EXTRAS",
+};
+
+interface Props extends DispatchProp {
+  hasSpells: boolean;
+  dimensions: AppEnvDimensionsState;
+  theme: CharacterTheme;
+  isReadonly: boolean;
+  characterStatus: string | null;
+}
+
+class PrimaryBox extends React.PureComponent<Props, {}> {
+  render() {
+    const { hasSpells, dimensions, theme, isReadonly, characterStatus } =
+      this.props;
+
+    let isPremade = CharacterStatusSlug.PREMADE === characterStatus;
+
+    let BoxBackgroundComponent: React.ComponentType = BeveledBoxSvg517x660;
+    if (dimensions.styleSizeType > StyleSizeTypeEnum.DESKTOP) {
+      BoxBackgroundComponent = BeveledBoxSvg623x660;
+    }
+
+    return (
+      <Subsection name="Primary Box">
+        <div
+          className={`ct-primary-box ${
+            theme.isDarkMode ? "ct-primary-box--dark-mode" : ""
+          }`}
+        >
+          <BoxBackground
+            StyleComponent={BoxBackgroundComponent}
+            theme={theme}
+          />
+          <TabList
+            className={styles.tabList}
+            tabs={[
+              {
+                label: "Actions",
+                content: <Actions />,
+                className: "ct-primary-box__tab--actions",
+                id: TAB_KEY.ACTIONS,
+              },
+              hasSpells
+                ? {
+                    label: "Spells",
+                    content: <Spells />,
+                    className: "ct-primary-box__tab--spells",
+                    id: TAB_KEY.SPELLS,
+                  }
+                : null,
+              {
+                label: "Inventory",
+                content: <Equipment />,
+                className: "ct-primary-box__tab--equipment",
+                id: TAB_KEY.EQUIPMENT,
+              },
+              {
+                label: "Features & Traits",
+                content: <Features />,
+                className: "ct-primary-box__tab--features",
+                id: TAB_KEY.FEATURES_TRAITS,
+              },
+              !isReadonly || isPremade
+                ? {
+                    label: "Background",
+                    content: <Description theme={theme} />,
+                    className: "ct-primary-box__tab--description",
+                    id: TAB_KEY.DESCRIPTION,
+                  }
+                : null,
+              !isReadonly || isPremade
+                ? {
+                    label: "Notes",
+                    content: <Notes />,
+                    className: "ct-primary-box__tab--notes",
+                    id: TAB_KEY.NOTES,
+                  }
+                : null,
+              {
+                label: "Extras",
+                content: <Extras />,
+                className: "ct-primary-box__tab--extras",
+                id: TAB_KEY.EXTRAS,
+              },
+            ]}
+          />
+        </div>
+      </Subsection>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    hasSpells: rulesEngineSelectors.hasSpells(state),
+    dimensions: appEnvSelectors.getDimensions(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    characterStatus: characterSelectors.getStatusSlug(state),
+  };
+}
+
+export default connect(mapStateToProps)(PrimaryBox);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/PrimaryBox/index.ts b/ddb_main/tools/js/CharacterSheet/containers/PrimaryBox/index.ts
new file mode 100644
index 0000000..2c9ed91
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/PrimaryBox/index.ts
@@ -0,0 +1,4 @@
+import PrimaryBox from "./PrimaryBox";
+
+export default PrimaryBox;
+export { PrimaryBox };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/ProficiencyGroupsDesktop/ProficiencyGroupsDesktop.tsx b/ddb_main/tools/js/CharacterSheet/containers/ProficiencyGroupsDesktop/ProficiencyGroupsDesktop.tsx
new file mode 100644
index 0000000..616f42f
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/ProficiencyGroupsDesktop/ProficiencyGroupsDesktop.tsx
@@ -0,0 +1,83 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import { ManageIcon } from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  ProficiencyGroup,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import {
+  Subsection,
+  SubsectionFooter,
+} from "../../../Shared/components/Subsection";
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import ProficiencyGroupsBox from "../../components/ProficiencyGroupsBox";
+import { SheetAppState } from "../../typings";
+
+interface Props {
+  dimensions: AppEnvDimensionsState;
+  theme: CharacterTheme;
+  proficiencyGroups: Array<ProficiencyGroup>;
+  isReadonly: boolean;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class ProficiencyGroupsDesktop extends React.PureComponent<Props> {
+  handleManageShow = (): void => {
+    const { paneHistoryStart, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.PROFICIENCIES);
+    }
+  };
+
+  render() {
+    const { dimensions, theme, proficiencyGroups, isReadonly } = this.props;
+
+    return (
+      <Subsection name="Proficiency Groups">
+        <ProficiencyGroupsBox
+          dimensions={dimensions}
+          theme={theme}
+          proficiencyGroups={proficiencyGroups}
+          onClick={this.handleManageShow}
+        />
+        <SubsectionFooter>
+          <ManageIcon
+            onClick={this.handleManageShow}
+            showIcon={!isReadonly}
+            enableTooltip={!isReadonly}
+            theme={theme}
+          >
+            Proficiencies & Training
+          </ManageIcon>
+        </SubsectionFooter>
+      </Subsection>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    dimensions: appEnvSelectors.getDimensions(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    proficiencyGroups: rulesEngineSelectors.getProficiencyGroups(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+  };
+}
+
+const ProficiencyGroupsDesktopContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return (
+    <ProficiencyGroupsDesktop {...props} paneHistoryStart={paneHistoryStart} />
+  );
+};
+
+export default connect(mapStateToProps)(ProficiencyGroupsDesktopContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/ProficiencyGroupsDesktop/index.ts b/ddb_main/tools/js/CharacterSheet/containers/ProficiencyGroupsDesktop/index.ts
new file mode 100644
index 0000000..3e1eb35
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/ProficiencyGroupsDesktop/index.ts
@@ -0,0 +1,4 @@
+import ProficiencyGroupsDesktop from "./ProficiencyGroupsDesktop";
+
+export default ProficiencyGroupsDesktop;
+export { ProficiencyGroupsDesktop };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/QuickInfo/QuickInfo.tsx b/ddb_main/tools/js/CharacterSheet/containers/QuickInfo/QuickInfo.tsx
new file mode 100644
index 0000000..7aeb14d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/QuickInfo/QuickInfo.tsx
@@ -0,0 +1,123 @@
+import { visuallyHidden } from "@mui/utils";
+import { useDispatch, useSelector } from "react-redux";
+
+import { AbilitySummary } from "@dndbeyond/character-components/es";
+import {
+  AbilityManager,
+  characterActions,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { useAbilities } from "~/hooks/useAbilities";
+import { HitPointsBox } from "~/subApps/sheet/components/HitPointsBox/HitPointsBox";
+import { Inspiration } from "~/subApps/sheet/components/Inspiration";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "../../../Shared/selectors";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import ProficiencyBonusBox from "../../components/ProficiencyBonusBox";
+import SpeedBox from "../../components/SpeedBox";
+
+export default function QuickInfo() {
+  const abilities = useAbilities();
+  const dispatch = useDispatch();
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const proficiencyBonus = useSelector(
+    rulesEngineSelectors.getProficiencyBonus
+  );
+  const speeds = useSelector(rulesEngineSelectors.getCurrentCarriedWeightSpeed);
+  const preferences = useSelector(rulesEngineSelectors.getCharacterPreferences);
+  const inspiration = useSelector(rulesEngineSelectors.getInspiration);
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const ruleData = useSelector(rulesEngineSelectors.getRuleData);
+  const diceEnabled = useSelector(appEnvSelectors.getDiceEnabled);
+  const characterRollContext = useSelector(
+    characterRollContextSelectors.getCharacterRollContext
+  );
+
+  const handleProficiencyBonusClick = (): void => {
+    paneHistoryStart(PaneComponentEnum.PROFICIENCY_BONUS);
+  };
+
+  const handleInspirationLabelClick = (): void => {
+    paneHistoryStart(PaneComponentEnum.INSPIRATION);
+  };
+
+  const handleSpeedsClick = (): void => {
+    paneHistoryStart(PaneComponentEnum.SPEED_MANAGE);
+  };
+
+  const handleToggleInspiration = (): void => {
+    dispatch(characterActions.inspirationSet(!inspiration));
+  };
+
+  const handleAbilitySummaryClick = (ability: AbilityManager): void => {
+    paneHistoryStart(
+      PaneComponentEnum.ABILITY,
+      PaneIdentifierUtils.generateAbility(ability)
+    );
+  };
+
+  let inspirationClasses = ["ct-quick-info__inspiration-status"];
+  if (inspiration) {
+    inspirationClasses.push("ct-quick-info__inspiration-status--active");
+  } else {
+    inspirationClasses.push("ct-quick-info__inspiration-status--inactive");
+  }
+
+  return (
+    <div className="ct-quick-info">
+      <section className="ct-quick-info__abilities">
+        <h2 style={visuallyHidden}>Ability Scores</h2>
+        {abilities.map((ability) => (
+          <div className="ct-quick-info__ability" key={ability.getStatKey()}>
+            <AbilitySummary
+              theme={theme}
+              ability={ability}
+              preferences={preferences}
+              onClick={handleAbilitySummaryClick}
+              diceEnabled={diceEnabled}
+              rollContext={characterRollContext}
+            />
+          </div>
+        ))}
+      </section>
+      <div className="ct-quick-info__box ct-quick-info__box--proficiency">
+        <ProficiencyBonusBox
+          theme={theme}
+          proficiencyBonus={proficiencyBonus}
+          onClick={handleProficiencyBonusClick}
+        />
+      </div>
+      <div className="ct-quick-info__box ct-quick-info__box--speed">
+        <SpeedBox
+          speeds={speeds}
+          preferences={preferences}
+          theme={theme}
+          ruleData={ruleData}
+          onClick={handleSpeedsClick}
+        />
+      </div>
+      <section className="ct-quick-info__inspiration">
+        <h2 style={visuallyHidden}>Inspiration</h2>
+        <Inspiration
+          inspiration={!!inspiration}
+          onToggle={handleToggleInspiration}
+          onClick={handleInspirationLabelClick}
+          isInteractive={!isReadonly}
+        />
+      </section>
+      <section className="ct-quick-info__health">
+        <HitPointsBox />
+      </section>
+    </div>
+  );
+}
diff --git a/ddb_main/tools/js/CharacterSheet/containers/QuickInfo/index.ts b/ddb_main/tools/js/CharacterSheet/containers/QuickInfo/index.ts
new file mode 100644
index 0000000..da67740
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/QuickInfo/index.ts
@@ -0,0 +1,4 @@
+import QuickInfo from "./QuickInfo";
+
+export default QuickInfo;
+export { QuickInfo };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SavingThrowsDesktop/SavingThrowsDesktop.tsx b/ddb_main/tools/js/CharacterSheet/containers/SavingThrowsDesktop/SavingThrowsDesktop.tsx
new file mode 100644
index 0000000..9841ddc
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SavingThrowsDesktop/SavingThrowsDesktop.tsx
@@ -0,0 +1,82 @@
+import { useSelector } from "react-redux";
+
+import { ManageIcon } from "@dndbeyond/character-components/es";
+import {
+  AbilityManager,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { useAbilities } from "~/hooks/useAbilities";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import {
+  Subsection,
+  SubsectionFooter,
+} from "../../../Shared/components/Subsection";
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "../../../Shared/selectors";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import SavingThrowsBox from "../../components/SavingThrowsBox";
+
+export default function SavingThrowsDesktop() {
+  const abilities = useAbilities();
+
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  const ruleData = useSelector(rulesEngineSelectors.getRuleData);
+  const savingThrowDiceAdjustments = useSelector(
+    rulesEngineSelectors.getSavingThrowDiceAdjustments
+  ); // TODO: GFS move to mangers
+  const situationalBonusSavingThrowsLookup = useSelector(
+    rulesEngineSelectors.getSituationalBonusSavingThrowsLookup
+  ); // TODO: GFS move to mangers
+  const deathSaveInfo = useSelector(rulesEngineSelectors.getDeathSaveInfo);
+  const dimensions = useSelector(appEnvSelectors.getDimensions);
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const diceEnabled = useSelector(appEnvSelectors.getDiceEnabled);
+  const characterRollContext = useSelector(
+    characterRollContextSelectors.getCharacterRollContext
+  );
+  const handleManageShow = (): void => {
+    paneHistoryStart(PaneComponentEnum.SAVING_THROWS);
+  };
+
+  const handleAbilityClick = (ability: AbilityManager): void => {
+    paneHistoryStart(
+      PaneComponentEnum.ABILITY_SAVING_THROW,
+      PaneIdentifierUtils.generateAbilitySavingThrows(ability.getId())
+    );
+  };
+
+  return (
+    <Subsection name="Abilities">
+      <SavingThrowsBox
+        ruleData={ruleData}
+        abilities={abilities}
+        savingThrowDiceAdjustments={savingThrowDiceAdjustments}
+        situationalBonusSavingThrowsLookup={situationalBonusSavingThrowsLookup}
+        deathSaveInfo={deathSaveInfo}
+        onAbilityClick={handleAbilityClick}
+        onInfoClick={handleManageShow}
+        dimensions={dimensions}
+        theme={theme}
+        diceEnabled={diceEnabled}
+        rollContext={characterRollContext}
+      />
+      <SubsectionFooter>
+        <ManageIcon
+          onClick={handleManageShow}
+          tooltip={isReadonly ? "View" : "Manage"}
+          theme={theme}
+        >
+          Saving Throws
+        </ManageIcon>
+      </SubsectionFooter>
+    </Subsection>
+  );
+}
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SavingThrowsDesktop/index.ts b/ddb_main/tools/js/CharacterSheet/containers/SavingThrowsDesktop/index.ts
new file mode 100644
index 0000000..65a0b39
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SavingThrowsDesktop/index.ts
@@ -0,0 +1,4 @@
+import SavingThrowsDesktop from "./SavingThrowsDesktop";
+
+export default SavingThrowsDesktop;
+export { SavingThrowsDesktop };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SensesDesktop/SensesDesktop.tsx b/ddb_main/tools/js/CharacterSheet/containers/SensesDesktop/SensesDesktop.tsx
new file mode 100644
index 0000000..c4d485b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SensesDesktop/SensesDesktop.tsx
@@ -0,0 +1,95 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import { ManageIcon } from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+  SenseInfo,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import {
+  Subsection,
+  SubsectionFooter,
+} from "../../../Shared/components/Subsection";
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import SensesBox from "../../components/SensesBox";
+import { SheetAppState } from "../../typings";
+
+interface Props {
+  passivePerception: number;
+  passiveInvestigation: number;
+  passiveInsight: number;
+  senses: SenseInfo;
+  dimensions: AppEnvDimensionsState;
+  theme: CharacterTheme;
+  isReadonly: boolean;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class SensesDesktop extends React.PureComponent<Props> {
+  handleManageShow = (): void => {
+    const { paneHistoryStart } = this.props;
+
+    paneHistoryStart(PaneComponentEnum.SENSE_MANAGE);
+  };
+
+  render() {
+    const {
+      passiveInsight,
+      passiveInvestigation,
+      passivePerception,
+      senses,
+      isReadonly,
+      dimensions,
+      theme,
+    } = this.props;
+
+    return (
+      <Subsection name="Senses" className="ct-senses-desktop">
+        <SensesBox
+          senses={senses}
+          passiveInsight={passiveInsight}
+          passiveInvestigation={passiveInvestigation}
+          passivePerception={passivePerception}
+          onClick={this.handleManageShow}
+          dimensions={dimensions}
+          theme={theme}
+        />
+        <SubsectionFooter>
+          <ManageIcon
+            onClick={this.handleManageShow}
+            tooltip={isReadonly ? "View" : "Manage"}
+            theme={theme}
+          >
+            Senses
+          </ManageIcon>
+        </SubsectionFooter>
+      </Subsection>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    passivePerception: rulesEngineSelectors.getPassivePerception(state),
+    passiveInvestigation: rulesEngineSelectors.getPassiveInvestigation(state),
+    passiveInsight: rulesEngineSelectors.getPassiveInsight(state),
+    senses: rulesEngineSelectors.getSenseInfo(state),
+    dimensions: appEnvSelectors.getDimensions(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+  };
+}
+
+const SensesDesktopContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <SensesDesktop {...props} paneHistoryStart={paneHistoryStart} />;
+};
+
+export default connect(mapStateToProps)(SensesDesktopContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SensesDesktop/index.ts b/ddb_main/tools/js/CharacterSheet/containers/SensesDesktop/index.ts
new file mode 100644
index 0000000..db564fb
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SensesDesktop/index.ts
@@ -0,0 +1,4 @@
+import SensesDesktop from "./SensesDesktop";
+
+export default SensesDesktop;
+export { SensesDesktop };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SkillsDesktop/SkillsDesktop.tsx b/ddb_main/tools/js/CharacterSheet/containers/SkillsDesktop/SkillsDesktop.tsx
new file mode 100644
index 0000000..79c2954
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SkillsDesktop/SkillsDesktop.tsx
@@ -0,0 +1,139 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import { ManageIcon } from "@dndbeyond/character-components/es";
+import {
+  rulesEngineSelectors,
+  Skill,
+  SkillUtils,
+  ValueLookup,
+  CharacterTheme,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+import { IRollContext } from "@dndbeyond/dice";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import Subsection, {
+  SubsectionFooter,
+} from "../../../Shared/components/Subsection";
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "../../../Shared/selectors";
+import { AppEnvDimensionsState } from "../../../Shared/stores/typings";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import SkillsBox from "../../components/SkillsBox";
+import { SheetAppState } from "../../typings";
+
+interface Props {
+  dimensions: AppEnvDimensionsState;
+  theme: CharacterTheme;
+  skills: Array<Skill>;
+  customSkills: Array<Skill>;
+  valueLookup: ValueLookup;
+  isReadonly: boolean;
+  diceEnabled: boolean;
+  ruleData: RuleData;
+  characterRollContext: IRollContext;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class SkillsDesktop extends React.PureComponent<Props> {
+  static defaultProps = {
+    diceEnabled: false,
+  };
+
+  handleManageShow = (): void => {
+    const { paneHistoryStart } = this.props;
+
+    paneHistoryStart(PaneComponentEnum.SKILLS);
+  };
+
+  handleCustomSkillClick = (skill: Skill): void => {
+    const { paneHistoryStart } = this.props;
+
+    paneHistoryStart(
+      PaneComponentEnum.CUSTOM_SKILL,
+      PaneIdentifierUtils.generateCustomSkill(SkillUtils.getId(skill))
+    );
+  };
+
+  handleEmptyClick = (): void => {
+    this.handleManageShow();
+  };
+
+  handleSkillClick = (skill: Skill): void => {
+    const { paneHistoryStart } = this.props;
+
+    paneHistoryStart(
+      PaneComponentEnum.SKILL,
+      PaneIdentifierUtils.generateSkill(SkillUtils.getId(skill))
+    );
+  };
+
+  render() {
+    const {
+      dimensions,
+      theme,
+      skills,
+      valueLookup,
+      customSkills,
+      isReadonly,
+      diceEnabled,
+      ruleData,
+      characterRollContext,
+    } = this.props;
+
+    return (
+      <Subsection name="Skills">
+        <SkillsBox
+          skills={skills}
+          customSkills={customSkills}
+          valueLookup={valueLookup}
+          onCustomSkillClick={this.handleCustomSkillClick}
+          onSkillClick={this.handleSkillClick}
+          onEmptyClick={this.handleEmptyClick}
+          dimensions={dimensions}
+          theme={theme}
+          diceEnabled={diceEnabled}
+          ruleData={ruleData}
+          rollContext={characterRollContext}
+        />
+        <SubsectionFooter>
+          <ManageIcon
+            onClick={this.handleManageShow}
+            tooltip={isReadonly ? "View" : "Manage"}
+            theme={theme}
+          >
+            Skills
+          </ManageIcon>
+        </SubsectionFooter>
+      </Subsection>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    skills: rulesEngineSelectors.getSkills(state),
+    valueLookup: rulesEngineSelectors.getCharacterValueLookup(state),
+    customSkills: rulesEngineSelectors.getCustomSkills(state),
+    dimensions: appEnvSelectors.getDimensions(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    characterRollContext:
+      characterRollContextSelectors.getCharacterRollContext(state),
+  };
+}
+
+const SkillsDesktopContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <SkillsDesktop {...props} paneHistoryStart={paneHistoryStart} />;
+};
+
+export default connect(mapStateToProps)(SkillsDesktopContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SkillsDesktop/index.ts b/ddb_main/tools/js/CharacterSheet/containers/SkillsDesktop/index.ts
new file mode 100644
index 0000000..6c6c239
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SkillsDesktop/index.ts
@@ -0,0 +1,4 @@
+import SkillsDesktop from "./SkillsDesktop";
+
+export default SkillsDesktop;
+export { SkillsDesktop };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManager.tsx b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManager.tsx
new file mode 100644
index 0000000..c803617
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManager.tsx
@@ -0,0 +1,80 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  ApiRequestHelpers,
+  rulesEngineSelectors,
+  characterActions,
+  SpellSlotContract,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { appEnvSelectors } from "../../../Shared/selectors";
+import { SheetAppState } from "../../typings";
+import SpellSlotManagerGroup from "./SpellSlotManagerGroup";
+
+interface Props extends DispatchProp {
+  spellSlots: Array<SpellSlotContract>;
+  pactSlots: Array<SpellSlotContract>;
+  isReadonly: boolean;
+}
+class SpellSlotManager extends React.PureComponent<Props> {
+  handleSlotSet = (level: number, used: number): void => {
+    const { dispatch } = this.props;
+    const spellLevelSpellSlotRequestsDataKey =
+      ApiRequestHelpers.getSpellLevelSpellSlotRequestsDataKey(level);
+
+    if (spellLevelSpellSlotRequestsDataKey !== null) {
+      dispatch(
+        characterActions.spellLevelSpellSlotsSet({
+          [spellLevelSpellSlotRequestsDataKey]: used,
+        })
+      );
+    }
+  };
+
+  handlePactSet = (level: number, used: number): void => {
+    const { dispatch } = this.props;
+
+    const spellLevelPactMagicRequestsDataKey =
+      ApiRequestHelpers.getSpellLevelPactMagicRequestsDataKey(level);
+
+    if (spellLevelPactMagicRequestsDataKey !== null) {
+      dispatch(
+        characterActions.spellLevelPactMagicSlotsSet({
+          [spellLevelPactMagicRequestsDataKey]: used,
+        })
+      );
+    }
+  };
+
+  render() {
+    const { spellSlots, pactSlots, isReadonly } = this.props;
+
+    return (
+      <div className="ct-spell-slot-manager">
+        <SpellSlotManagerGroup
+          heading="Spell Slots"
+          slots={spellSlots}
+          onSlotSet={this.handleSlotSet}
+          isReadonly={isReadonly}
+        />
+        <SpellSlotManagerGroup
+          heading="Pact Magic"
+          slots={pactSlots}
+          onSlotSet={this.handlePactSet}
+          isReadonly={isReadonly}
+        />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    spellSlots: rulesEngineSelectors.getSpellSlots(state),
+    pactSlots: rulesEngineSelectors.getPactMagicSlots(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+  };
+}
+
+export default connect(mapStateToProps)(SpellSlotManager);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerGroup/SpellSlotManagerGroup.tsx b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerGroup/SpellSlotManagerGroup.tsx
new file mode 100644
index 0000000..ebecf2c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerGroup/SpellSlotManagerGroup.tsx
@@ -0,0 +1,77 @@
+import React from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+} from "@dndbeyond/character-components/es";
+import {
+  FormatUtils,
+  SpellSlotContract,
+} from "@dndbeyond/character-rules-engine/es";
+
+import SpellSlotManagerLevel from "../SpellSlotManagerLevel";
+
+interface Props {
+  heading: string;
+  slots: Array<SpellSlotContract>;
+  onSlotSet?: (level: number, used: number) => void;
+  isReadonly: boolean;
+}
+export default class SpellSlotManagerGroup extends React.PureComponent<Props> {
+  renderCallout = (): React.ReactNode => {
+    const { slots } = this.props;
+
+    return (
+      <div className="ct-spell-slot-manager__group-summary">
+        {slots.map((levelSlots) => (
+          <div
+            className="ct-spell-slot-manager__group-level"
+            key={levelSlots.level}
+          >
+            <div className="ct-spell-slot-manager__group-level-name">
+              {FormatUtils.ordinalize(levelSlots.level)}
+            </div>
+            <div className="ct-spell-slot-manager__group-level-available">
+              {levelSlots.available === 0 ? "-" : levelSlots.available}
+            </div>
+          </div>
+        ))}
+      </div>
+    );
+  };
+
+  render() {
+    const { slots, onSlotSet, heading, isReadonly } = this.props;
+
+    let headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent
+        heading={heading}
+        callout={this.renderCallout()}
+      />
+    );
+
+    if (!slots.length) {
+      return null;
+    }
+
+    return (
+      <Collapsible header={headerNode} className="ct-spell-slot-manager__group">
+        <div className="ct-spell-slot-manager__levels">
+          {slots.map((levelSlots) => {
+            if (levelSlots.available === 0) {
+              return null;
+            }
+            return (
+              <SpellSlotManagerLevel
+                key={levelSlots.level}
+                {...levelSlots}
+                onSlotSet={onSlotSet}
+                isInteractive={!isReadonly}
+              />
+            );
+          })}
+        </div>
+      </Collapsible>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerGroup/index.ts b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerGroup/index.ts
new file mode 100644
index 0000000..493754f
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerGroup/index.ts
@@ -0,0 +1,4 @@
+import SpellSlotManagerGroup from "./SpellSlotManagerGroup";
+
+export default SpellSlotManagerGroup;
+export { SpellSlotManagerGroup };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerLevel/SpellSlotManagerLevel.tsx b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerLevel/SpellSlotManagerLevel.tsx
new file mode 100644
index 0000000..be18f6b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerLevel/SpellSlotManagerLevel.tsx
@@ -0,0 +1,41 @@
+import React from "react";
+
+import { FormatUtils } from "@dndbeyond/character-rules-engine/es";
+
+import SlotManager from "../../../../Shared/components/SlotManager";
+
+interface Props {
+  level: number;
+  available: number;
+  used: number;
+  onSlotSet?: (level: number, used: number) => void;
+  isInteractive: boolean;
+}
+export default class SpellSlotManagerLevel extends React.PureComponent<Props> {
+  handleSlotSet = (used: number): void => {
+    const { onSlotSet, level } = this.props;
+
+    if (onSlotSet) {
+      onSlotSet(level, used);
+    }
+  };
+
+  render() {
+    let { level, available, used, isInteractive } = this.props;
+
+    return (
+      <div className="ct-spell-slot-manager__level">
+        <div className="ct-spell-slot-manager__level-name">
+          {FormatUtils.ordinalize(level)} Level
+        </div>
+        <SlotManager
+          available={available}
+          used={used}
+          onSet={this.handleSlotSet}
+          size="small"
+          isInteractive={isInteractive}
+        />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerLevel/index.ts b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerLevel/index.ts
new file mode 100644
index 0000000..fc37835
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/SpellSlotManagerLevel/index.ts
@@ -0,0 +1,4 @@
+import SpellSlotManagerLevel from "./SpellSlotManagerLevel";
+
+export default SpellSlotManagerLevel;
+export { SpellSlotManagerLevel };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/index.ts b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/index.ts
new file mode 100644
index 0000000..9183a61
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/SpellSlotManager/index.ts
@@ -0,0 +1,6 @@
+import SpellSlotManager from "./SpellSlotManager";
+import SpellSlotManagerGroup from "./SpellSlotManagerGroup";
+import SpellSlotManagerLevel from "./SpellSlotManagerLevel";
+
+export default SpellSlotManager;
+export { SpellSlotManager, SpellSlotManagerGroup, SpellSlotManagerLevel };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Spells/Spells.tsx b/ddb_main/tools/js/CharacterSheet/containers/Spells/Spells.tsx
new file mode 100644
index 0000000..a5ee369
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Spells/Spells.tsx
@@ -0,0 +1,562 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  ConcentrationIcon,
+  RitualIcon,
+} from "@dndbeyond/character-components/es";
+import {
+  AbilityLookup,
+  ApiRequestHelpers,
+  characterActions,
+  CharacterTheme,
+  ClassUtils,
+  Constants,
+  DataOriginRefData,
+  ExperienceInfo,
+  FormatUtils,
+  Hack__BaseCharClass,
+  HelperUtils,
+  InventoryLookup,
+  InventoryManager,
+  ItemManager,
+  RuleData,
+  rulesEngineSelectors,
+  ScaledSpell,
+  SpellCasterInfo,
+  SpellSlotContract,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/es";
+import { IRollContext } from "@dndbeyond/dice";
+
+import { TabFilter } from "~/components/TabFilter";
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import SpellsLevel from "../../../Shared/components/SpellsLevel";
+import SpellsLevelCasting from "../../../Shared/components/SpellsLevelCasting";
+import { ThemeButton } from "../../../Shared/components/common/Button";
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "../../../Shared/selectors";
+import { PaneIdentifierUtils } from "../../../Shared/utils";
+import ContentGroup from "../../components/ContentGroup";
+import SpellsFilter from "../../components/SpellsFilter";
+import { SheetAppState } from "../../typings";
+import styles from "./styles.module.css";
+
+const ALL_LEVELS: number = -1;
+
+function filterLevelSpells(
+  levelSpells: Array<Array<ScaledSpell>>,
+  testFunc: (spell: ScaledSpell) => boolean
+): Array<Array<ScaledSpell>> {
+  return levelSpells.map((spells) => spells.filter((spell) => testFunc(spell)));
+}
+
+function hasFilteredLevelSpells(
+  levelSpells: Array<Array<ScaledSpell>>,
+  testFunc: (spell: ScaledSpell) => boolean
+): boolean {
+  return levelSpells.reduce((acc, spells) => {
+    return (
+      acc ||
+      spells.reduce((spellAcc, spell) => {
+        return spellAcc || testFunc(spell);
+      }, false)
+    );
+  }, false);
+}
+
+interface Props extends DispatchProp {
+  levelSpells: Array<Array<ScaledSpell>>;
+  spellCasterInfo: SpellCasterInfo;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  xpInfo: ExperienceInfo;
+  isReadonly: boolean;
+  spellSlots: Array<SpellSlotContract>;
+  pactMagicSlots: Array<SpellSlotContract>;
+  showNotes: boolean;
+  theme: CharacterTheme;
+  diceEnabled: boolean;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+  characterRollContext: IRollContext;
+  inventoryManager: InventoryManager;
+  inventoryLookup: InventoryLookup;
+  partyInventoryLookup: InventoryLookup;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+interface StateFilterData {
+  filteredLevelSpells: Array<Array<ScaledSpell>>;
+  showAdvancedFilters: boolean;
+  isFiltering: boolean;
+}
+interface State {
+  filterData: StateFilterData;
+  ritualLevelSpells: Array<Array<ScaledSpell>>;
+  concentrationLevelSpells: Array<Array<ScaledSpell>>;
+  hasRitualSpells: boolean;
+  hasConcentrationSpells: boolean;
+}
+class Spells extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    showNotes: true,
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      filterData: {
+        filteredLevelSpells: [],
+        showAdvancedFilters: false,
+        isFiltering: false,
+      },
+      ritualLevelSpells: filterLevelSpells(
+        props.levelSpells,
+        SpellUtils.isRitual
+      ),
+      concentrationLevelSpells: filterLevelSpells(
+        props.levelSpells,
+        SpellUtils.getConcentration
+      ),
+      hasRitualSpells: hasFilteredLevelSpells(
+        props.levelSpells,
+        SpellUtils.isRitual
+      ),
+      hasConcentrationSpells: hasFilteredLevelSpells(
+        props.levelSpells,
+        SpellUtils.getConcentration
+      ),
+    };
+  }
+
+  componentDidUpdate(prevProps: Props, prevState: State): void {
+    if (this.props.levelSpells !== prevProps.levelSpells) {
+      this.setState({
+        ritualLevelSpells: filterLevelSpells(
+          this.props.levelSpells,
+          SpellUtils.isRitual
+        ),
+        concentrationLevelSpells: filterLevelSpells(
+          this.props.levelSpells,
+          SpellUtils.getConcentration
+        ),
+        hasRitualSpells: hasFilteredLevelSpells(
+          this.props.levelSpells,
+          SpellUtils.isRitual
+        ),
+        hasConcentrationSpells: hasFilteredLevelSpells(
+          this.props.levelSpells,
+          SpellUtils.getConcentration
+        ),
+      });
+    }
+  }
+
+  handleSpellSlotSet = (level: number, used: number): void => {
+    const { dispatch } = this.props;
+
+    const spellLevelSpellSlotRequestsDataKey =
+      ApiRequestHelpers.getSpellLevelSpellSlotRequestsDataKey(level);
+    if (spellLevelSpellSlotRequestsDataKey !== null) {
+      dispatch(
+        characterActions.spellLevelSpellSlotsSet({
+          [spellLevelSpellSlotRequestsDataKey]: used,
+        })
+      );
+    }
+  };
+
+  handleSpellSlotChange = (level: number, changeAmount: number): void => {
+    const { spellSlots } = this.props;
+
+    const usedAmount = this.getUsedSpellSlotLevelAmount(
+      level,
+      changeAmount,
+      spellSlots
+    );
+
+    if (usedAmount !== null) {
+      this.handleSpellSlotSet(level, usedAmount);
+    }
+  };
+
+  handlePactSlotSet = (level: number, used: number): void => {
+    const { dispatch } = this.props;
+
+    const spellLevelPactMagicRequestsDataKey =
+      ApiRequestHelpers.getSpellLevelPactMagicRequestsDataKey(level);
+
+    if (spellLevelPactMagicRequestsDataKey !== null) {
+      dispatch(
+        characterActions.spellLevelPactMagicSlotsSet({
+          [spellLevelPactMagicRequestsDataKey]: used,
+        })
+      );
+    }
+  };
+
+  handlePactSlotChange = (level: number, changeAmount: number): void => {
+    const { pactMagicSlots } = this.props;
+
+    const usedAmount = this.getUsedSpellSlotLevelAmount(
+      level,
+      changeAmount,
+      pactMagicSlots
+    );
+
+    if (usedAmount !== null) {
+      this.handlePactSlotSet(level, usedAmount);
+    }
+  };
+
+  getUsedSpellSlotLevelAmount = (
+    level: number,
+    changeAmount: number,
+    spellSlots: Array<SpellSlotContract>
+  ): number | null => {
+    const foundSlotLevel = spellSlots.find(
+      (spellSlot) => spellSlot.level === level
+    );
+
+    if (!foundSlotLevel) {
+      return null;
+    }
+
+    const usedAmount: number = foundSlotLevel.used + changeAmount;
+    const maxAmount: number = foundSlotLevel.available;
+
+    return HelperUtils.clampInt(usedAmount, 0, maxAmount);
+  };
+
+  handleSpellLimitedUseSet = (
+    mappingId: number,
+    mappingTypeId: number,
+    uses: number,
+    dataOrigin: Constants.DataOriginTypeEnum
+  ): void => {
+    const { dispatch } = this.props;
+    dispatch(
+      characterActions.spellUseSet(mappingId, mappingTypeId, uses, dataOrigin)
+    );
+  };
+
+  handleItemLimitedUseSet = (
+    mappingId: number,
+    mappingTypeId: number,
+    uses: number
+  ): void => {
+    let item: ItemManager | null = null;
+    item = ItemManager.getItem(mappingId);
+    if (item) {
+      item.handleItemLimitedUseSet(uses);
+    }
+  };
+
+  handleSpellDetailShow = (spell: ScaledSpell, castLevel: number): void => {
+    const { paneHistoryStart } = this.props;
+
+    const mappingId = SpellUtils.getMappingId(spell);
+    if (mappingId !== null) {
+      const dataOrigin = SpellUtils.getDataOrigin(spell);
+      const dataOriginType = SpellUtils.getDataOriginType(spell);
+
+      switch (dataOriginType) {
+        case Constants.DataOriginTypeEnum.CLASS:
+          paneHistoryStart(
+            PaneComponentEnum.CLASS_SPELL_DETAIL,
+            PaneIdentifierUtils.generateClassSpell(
+              ClassUtils.getMappingId(
+                dataOrigin.primary as Hack__BaseCharClass
+              ),
+              mappingId,
+              castLevel
+            )
+          );
+          break;
+
+        default:
+          paneHistoryStart(
+            PaneComponentEnum.CHARACTER_SPELL_DETAIL,
+            PaneIdentifierUtils.generateCharacterSpell(mappingId, castLevel)
+          );
+      }
+    }
+  };
+
+  handleManageSpellsOpen = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.SPELL_MANAGE);
+  };
+
+  handleFilterUpdate = (filterData: StateFilterData): void => {
+    this.setState({
+      filterData,
+    });
+  };
+
+  renderEmptySpellLevel = (level: number): React.ReactNode => {
+    let spellAbbr = FormatUtils.renderSpellLevelAbbreviation(level);
+    return (
+      <div className="ct-spells__empty-spell-level">
+        You do not have any {spellAbbr}-level spells or spells that scale to{" "}
+        {spellAbbr} level available, but you can cast lower level spells using
+        your {spellAbbr}-level spell slots.
+      </div>
+    );
+  };
+
+  renderManageButton = (): React.ReactNode => {
+    const { isReadonly } = this.props;
+
+    if (isReadonly) {
+      return null;
+    }
+
+    return (
+      <ThemeButton
+        style="outline"
+        size="medium"
+        onClick={this.handleManageSpellsOpen}
+      >
+        Manage Spells
+      </ThemeButton>
+    );
+  };
+
+  renderSpellLevels = (
+    levelSpells: Array<Array<ScaledSpell>>,
+    showLevels: Array<number>,
+    filterRitual: boolean = false,
+    filterConcentration: boolean = false
+  ): React.ReactNode => {
+    const { filterData, ritualLevelSpells, concentrationLevelSpells } =
+      this.state;
+    const {
+      spellCasterInfo,
+      ruleData,
+      xpInfo,
+      abilityLookup,
+      isReadonly,
+      showNotes,
+      diceEnabled,
+      theme,
+      dataOriginRefData,
+      proficiencyBonus,
+      characterRollContext,
+    } = this.props;
+
+    return (
+      <React.Fragment>
+        {levelSpells.map((spells, level) => {
+          if (!showLevels.includes(ALL_LEVELS) && !showLevels.includes(level)) {
+            return null;
+          }
+
+          let levelHasSlots =
+            spellCasterInfo.availablePactMagicLevels.includes(level) ||
+            spellCasterInfo.availableSpellLevels.includes(level);
+
+          if (filterRitual) {
+            spells = ritualLevelSpells[level];
+          }
+          if (filterConcentration) {
+            spells = concentrationLevelSpells[level];
+          }
+
+          if ((filterRitual || filterConcentration) && !spells.length) {
+            return null;
+          }
+
+          if (!spells.length && !levelHasSlots) {
+            return null;
+          }
+
+          let filteredSpells = filterData.filteredLevelSpells[level];
+
+          if (filteredSpells && filterRitual) {
+            filteredSpells = filteredSpells.filter((spell) =>
+              SpellUtils.isRitual(spell)
+            );
+          }
+          if (filteredSpells && filterConcentration) {
+            filteredSpells = filteredSpells.filter((spell) =>
+              SpellUtils.getConcentration(spell)
+            );
+          }
+
+          if (!filteredSpells) {
+            return null;
+          }
+          let extraNode: React.ReactNode = (
+            <SpellsLevelCasting
+              level={level}
+              spellCasterInfo={spellCasterInfo}
+              onSpellSlotSet={this.handleSpellSlotSet}
+              onPactSlotSet={this.handlePactSlotSet}
+              showCastingInfo={false}
+              isInteractive={!isReadonly}
+              isDarkMode={theme?.isDarkMode}
+            />
+          );
+
+          return (
+            <ContentGroup
+              header={FormatUtils.renderSpellLevelName(level)}
+              extra={extraNode}
+              key={level}
+            >
+              {spells.length ? (
+                <SpellsLevel
+                  level={level}
+                  spells={filteredSpells}
+                  spellCasterInfo={spellCasterInfo}
+                  ruleData={ruleData}
+                  xpInfo={xpInfo}
+                  abilityLookup={abilityLookup}
+                  onSpellClick={this.handleSpellDetailShow}
+                  onSpellSlotChange={this.handleSpellSlotChange}
+                  onPactSlotChange={this.handlePactSlotChange}
+                  onSpellLimitedUseSet={this.handleSpellLimitedUseSet}
+                  onItemLimitedUseSet={this.handleItemLimitedUseSet}
+                  isInteractive={!isReadonly}
+                  showNotes={showNotes}
+                  diceEnabled={diceEnabled}
+                  theme={theme}
+                  dataOriginRefData={dataOriginRefData}
+                  proficiencyBonus={proficiencyBonus}
+                  rollContext={characterRollContext}
+                />
+              ) : (
+                this.renderEmptySpellLevel(level)
+              )}
+            </ContentGroup>
+          );
+        })}
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    const { filterData, hasConcentrationSpells, hasRitualSpells } = this.state;
+    const { ruleData, abilityLookup, levelSpells, spellCasterInfo, theme } =
+      this.props;
+
+    return (
+      <section className="ct-spells">
+        <h2 style={visuallyHidden}>Spells</h2>
+        <div className="ct-spells__casting">
+          <SpellsLevelCasting
+            spellCasterInfo={spellCasterInfo}
+            showSlots={false}
+            isDarkMode={theme?.isDarkMode}
+          />
+        </div>
+        <SpellsFilter
+          abilityLookup={abilityLookup}
+          levelSpells={levelSpells}
+          spellCasterInfo={spellCasterInfo}
+          ruleData={ruleData}
+          onDataUpdate={this.handleFilterUpdate}
+          callout={this.renderManageButton()}
+          theme={theme}
+        />
+        {!filterData.showAdvancedFilters && (
+          <div className="ct-spells__content">
+            <TabFilter
+              className={styles.tabFilter}
+              filters={[
+                ...levelSpells?.map((spells, level) => {
+                  let levelHasSlots =
+                    spellCasterInfo.availablePactMagicLevels.includes(level) ||
+                    spellCasterInfo.availableSpellLevels.includes(level);
+
+                  if (!spells.length && !levelHasSlots)
+                    return { label: "", content: null };
+
+                  let filterBadgeText: number | null = null;
+                  const filteredSpells = filterData.filteredLevelSpells[level];
+                  if (filterData.isFiltering && filteredSpells.length) {
+                    filterBadgeText = filteredSpells.length;
+                  }
+
+                  return {
+                    label: `${FormatUtils.renderSpellLevelAbbreviation(level)}`,
+                    badge: filterBadgeText ?? undefined,
+                    content: this.renderSpellLevels(levelSpells, [level]),
+                  };
+                }),
+                ...(hasConcentrationSpells
+                  ? [
+                      {
+                        label: (
+                          <ConcentrationIcon
+                            themeMode={theme?.isDarkMode ? "gray" : "dark"}
+                          />
+                        ),
+                        content: this.renderSpellLevels(
+                          levelSpells,
+                          [ALL_LEVELS],
+                          false,
+                          true
+                        ),
+                      },
+                    ]
+                  : []),
+                ...(hasRitualSpells
+                  ? [
+                      {
+                        label: (
+                          <RitualIcon
+                            themeMode={theme?.isDarkMode ? "gray" : "dark"}
+                          />
+                        ),
+                        content: this.renderSpellLevels(
+                          levelSpells,
+                          [ALL_LEVELS],
+                          true
+                        ),
+                      },
+                    ]
+                  : []),
+              ]}
+            />
+          </div>
+        )}
+      </section>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    levelSpells: rulesEngineSelectors.getLevelSpells(state),
+    spellCasterInfo: rulesEngineSelectors.getSpellCasterInfo(state),
+    abilityLookup: rulesEngineSelectors.getAbilityLookup(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    xpInfo: rulesEngineSelectors.getExperienceInfo(state),
+    spellSlots: rulesEngineSelectors.getSpellSlots(state),
+    pactMagicSlots: rulesEngineSelectors.getPactMagicSlots(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+    dataOriginRefData: rulesEngineSelectors.getDataOriginRefData(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    characterRollContext:
+      characterRollContextSelectors.getCharacterRollContext(state),
+  };
+}
+
+const SpellsContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <Spells {...props} paneHistoryStart={paneHistoryStart} />;
+};
+
+export default connect(mapStateToProps)(SpellsContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/Spells/index.ts b/ddb_main/tools/js/CharacterSheet/containers/Spells/index.ts
new file mode 100644
index 0000000..80eac45
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/Spells/index.ts
@@ -0,0 +1,4 @@
+import Spells from "./Spells";
+
+export default Spells;
+export { Spells };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/ActionsMobile/ActionsMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/mobile/ActionsMobile/ActionsMobile.tsx
new file mode 100644
index 0000000..9672f29
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/ActionsMobile/ActionsMobile.tsx
@@ -0,0 +1,41 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import MobileDivider from "../../../components/MobileDivider";
+import SubsectionMobile from "../../../components/SubsectionMobile";
+import { SheetAppState } from "../../../typings";
+import Actions from "../../Actions";
+
+interface Props extends DispatchProp {
+  theme: CharacterTheme;
+}
+class ActionsMobile extends React.PureComponent<Props> {
+  render() {
+    const { theme } = this.props;
+
+    return (
+      <SubsectionMobile>
+        <section className="ct-actions-mobile">
+          <h2 style={visuallyHidden}>Actions</h2>
+          <MobileDivider label="Actions" theme={theme} />
+          <Actions showNotes={false} />
+          <MobileDivider isEnd={true} theme={theme} />
+        </section>
+      </SubsectionMobile>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+export default connect(mapStateToProps)(ActionsMobile);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/ActionsMobile/index.ts b/ddb_main/tools/js/CharacterSheet/containers/mobile/ActionsMobile/index.ts
new file mode 100644
index 0000000..29b28f9
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/ActionsMobile/index.ts
@@ -0,0 +1,4 @@
+import ActionsMobile from "./ActionsMobile";
+
+export default ActionsMobile;
+export { ActionsMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/CombatMobile/CombatMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/mobile/CombatMobile/CombatMobile.tsx
new file mode 100644
index 0000000..c087c71
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/CombatMobile/CombatMobile.tsx
@@ -0,0 +1,244 @@
+import clsx from "clsx";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  CharacterPreferences,
+  SpeedInfo,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  CharacterTheme,
+  characterSelectors,
+  CharacterStatusSlug,
+} from "@dndbeyond/character-rules-engine/es";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { PremadeCharacterEditStatus } from "~/components/PremadeCharacterEditStatus";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { InitiativeBox } from "~/subApps/sheet/components/InitiativeBox";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import { SheetAppState } from "../../../typings";
+import styles from "./styles.module.css";
+
+interface Props extends DispatchProp {
+  armorClass: number;
+  speeds: SpeedInfo;
+  proficiencyBonus: number;
+  preferences: CharacterPreferences;
+  ruleData: RuleData;
+  diceEnabled: boolean;
+  theme: CharacterTheme;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+  isReadonly: boolean;
+  characterStatus: CharacterStatusSlug | null;
+}
+class CombatMobile extends React.PureComponent<Props> {
+  static defaultProps = {
+    diceEnabled: false,
+  };
+
+  handleProficiencyBonusClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    paneHistoryStart(PaneComponentEnum.PROFICIENCY_BONUS);
+  };
+
+  handleSpeedsClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    paneHistoryStart(PaneComponentEnum.SPEED_MANAGE);
+  };
+
+  handleDefensesSummaryClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    paneHistoryStart(PaneComponentEnum.DEFENSE_MANAGE);
+  };
+
+  handleConditionSummaryClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    paneHistoryStart(PaneComponentEnum.CONDITION_MANAGE);
+  };
+
+  handleArmorClassClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    paneHistoryStart(PaneComponentEnum.ARMOR_MANAGE);
+  };
+
+  handleInitiativeClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    paneHistoryStart(PaneComponentEnum.INITIATIVE);
+  };
+
+  renderProficiency = (): React.ReactNode => {
+    const { proficiencyBonus } = this.props;
+
+    return (
+      <div
+        className="ct-combat-mobile__extra ct-combat-mobile__extra--proficiency"
+        onClick={this.handleProficiencyBonusClick}
+      >
+        <div className="ct-combat-mobile__extra-heading">
+          <div className="ct-combat-mobile__extra-label">Proficiency</div>
+        </div>
+        <div className="ct-combat-mobile__extra-value">
+          <NumberDisplay
+            type="signed"
+            number={proficiencyBonus}
+            size={"large"}
+            className={clsx([
+              !this.props.theme.isDarkMode && styles.numberColorOverride,
+            ])}
+          />
+        </div>
+        <div className="ct-combat-mobile__extra-footer">
+          <div className="ct-combat-mobile__extra-label">Bonus</div>
+        </div>
+      </div>
+    );
+  };
+
+  renderSpeed = (): React.ReactNode => {
+    const { preferences, speeds, ruleData, theme } = this.props;
+
+    const displaySpeedValue: number =
+      speeds[
+        RuleDataUtils.getSpeedMovementKeyById(preferences.primaryMovement)
+      ];
+    const displaySpeedLabel = RuleDataUtils.getMovementDescription(
+      preferences.primaryMovement,
+      ruleData
+    );
+
+    return (
+      <div
+        className="ct-combat-mobile__extra  ct-combat-mobile__extra--speed"
+        onClick={this.handleSpeedsClick}
+      >
+        <div className="ct-combat-mobile__extra-heading">
+          <div className="ct-combat-mobile__extra-subheading">
+            {displaySpeedLabel}
+          </div>
+        </div>
+        <div className="ct-combat-mobile__extra-value">
+          <NumberDisplay
+            type="distanceInFt"
+            number={displaySpeedValue}
+            size={"large"}
+            className={clsx([
+              !this.props.theme.isDarkMode && styles.numberColorOverride,
+            ])}
+          />
+        </div>
+        <div className="ct-combat-mobile__extra-footer">
+          <div className="ct-combat-mobile__extra-label">Speed</div>
+        </div>
+      </div>
+    );
+  };
+
+  renderArmorClass = (): React.ReactNode => {
+    const { armorClass } = this.props;
+
+    return (
+      <div
+        className="ct-combat-mobile__extra  ct-combat-mobile__extra--ac"
+        onClick={this.handleArmorClassClick}
+      >
+        <div className="ct-combat-mobile__extra-heading">
+          <div className="ct-combat-mobile__extra-label">Armor</div>
+        </div>
+        <div
+          className="ct-combat-mobile__extra-value"
+          data-testid="armor-class-value"
+        >
+          {armorClass}
+        </div>
+        <div className="ct-combat-mobile__extra-footer">
+          <div className="ct-combat-mobile__extra-label">Class</div>
+        </div>
+      </div>
+    );
+  };
+
+  render() {
+    const { theme, isReadonly, characterStatus } = this.props;
+    return (
+      <div
+        className={`ct-combat-mobile ${
+          theme.isDarkMode ? "ct-combat-mobile--dark-mode" : ""
+        }`}
+      >
+        <div className="ct-combat-mobile__extras">
+          {this.renderProficiency()}
+          {this.renderSpeed()}
+          <InitiativeBox isMobile={true} />
+          {this.renderArmorClass()}
+          <div className="ct-combat-mobile__extra ct-combat-mobile__extra--statuses">
+            <div className="ct-combat-mobile__ctas">
+              <div className="ct-combat-mobile__cta">
+                <div
+                  className="ct-combat-mobile__cta-button"
+                  onClick={this.handleDefensesSummaryClick}
+                >
+                  Defenses
+                </div>
+              </div>
+              <div className="ct-combat-mobile__cta">
+                <div
+                  className="ct-combat-mobile__cta-button"
+                  onClick={this.handleConditionSummaryClick}
+                >
+                  Conditions
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <PremadeCharacterEditStatus
+          characterStatus={characterStatus}
+          isReadonly={isReadonly}
+        />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    armorClass: rulesEngineSelectors.getAcTotal(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    speeds: rulesEngineSelectors.getCurrentCarriedWeightSpeed(state),
+    preferences: rulesEngineSelectors.getCharacterPreferences(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    characterStatus: characterSelectors.getStatusSlug(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+  };
+}
+
+const CombatMobileContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <CombatMobile {...props} paneHistoryStart={paneHistoryStart} />;
+};
+
+CombatMobileContainer.contextType = GameLogContext;
+
+export default connect(mapStateToProps)(CombatMobileContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/CombatMobile/index.ts b/ddb_main/tools/js/CharacterSheet/containers/mobile/CombatMobile/index.ts
new file mode 100644
index 0000000..462fccc
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/CombatMobile/index.ts
@@ -0,0 +1,4 @@
+import CombatMobile from "./CombatMobile";
+
+export default CombatMobile;
+export { CombatMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/DescriptionMobile/DescriptionMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/mobile/DescriptionMobile/DescriptionMobile.tsx
new file mode 100644
index 0000000..6308961
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/DescriptionMobile/DescriptionMobile.tsx
@@ -0,0 +1,22 @@
+import { visuallyHidden } from "@mui/utils";
+import { FC } from "react";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+
+import MobileDivider from "../../../components/MobileDivider";
+import SubsectionMobile from "../../../components/SubsectionMobile";
+import Description from "../../Description";
+
+export const DescriptionMobile: FC = () => {
+  const { characterTheme } = useCharacterEngine();
+  return (
+    <SubsectionMobile className="ct-description-mobile">
+      <MobileDivider label={"Background"} theme={characterTheme} />
+      <section>
+        <h2 style={visuallyHidden}>Background</h2>
+        <Description theme={characterTheme} isVertical={true} />
+      </section>
+      <MobileDivider isEnd={true} theme={characterTheme} />
+    </SubsectionMobile>
+  );
+};
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/EquipmentMobile/EquipmentMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/mobile/EquipmentMobile/EquipmentMobile.tsx
new file mode 100644
index 0000000..6dd2ad9
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/EquipmentMobile/EquipmentMobile.tsx
@@ -0,0 +1,68 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import MobileDivider from "../../../components/MobileDivider";
+import SubsectionMobile from "../../../components/SubsectionMobile";
+import { SheetAppState } from "../../../typings";
+import { Equipment } from "../../Equipment";
+
+interface Props {
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class EquipmentMobile extends React.PureComponent<Props> {
+  handleManageClick = (): void => {
+    const { paneHistoryStart, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.EQUIPMENT_MANAGE);
+    }
+  };
+
+  render() {
+    const { isReadonly, theme } = this.props;
+
+    return (
+      <SubsectionMobile>
+        <MobileDivider
+          label="Inventory"
+          onClick={this.handleManageClick}
+          isReadonly={isReadonly}
+          theme={theme}
+        />
+        <section className="ct-equipment-mobile">
+          <h2 style={visuallyHidden}>Inventory</h2>
+          <Equipment showNotes={false} />
+        </section>
+        <MobileDivider isEnd={true} theme={theme} />
+      </SubsectionMobile>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const EquipmentMobileContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <EquipmentMobile paneHistoryStart={paneHistoryStart} {...props} />;
+};
+
+export default connect(mapStateToProps)(EquipmentMobileContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/EquipmentMobile/index.ts b/ddb_main/tools/js/CharacterSheet/containers/mobile/EquipmentMobile/index.ts
new file mode 100644
index 0000000..7cca325
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/EquipmentMobile/index.ts
@@ -0,0 +1,4 @@
+import EquipmentMobile from "./EquipmentMobile";
+
+export default EquipmentMobile;
+export { EquipmentMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/ExtrasMobile/ExtrasMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/mobile/ExtrasMobile/ExtrasMobile.tsx
new file mode 100644
index 0000000..d4eef4b
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/ExtrasMobile/ExtrasMobile.tsx
@@ -0,0 +1,68 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import MobileDivider from "../../../components/MobileDivider";
+import SubsectionMobile from "../../../components/SubsectionMobile";
+import { SheetAppState } from "../../../typings";
+import Extras from "../../Extras";
+
+interface Props {
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class ExtrasMobile extends React.PureComponent<Props> {
+  handleManageOpen = (): void => {
+    const { paneHistoryStart, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.EXTRA_MANAGE);
+    }
+  };
+
+  render() {
+    const { isReadonly, theme } = this.props;
+
+    return (
+      <SubsectionMobile>
+        <MobileDivider
+          label="Extras"
+          onClick={this.handleManageOpen}
+          isReadonly={isReadonly}
+          theme={theme}
+        />
+        <section className="ct-extras-mobile">
+          <h2 style={visuallyHidden}>Extras</h2>
+          <Extras showNotes={false} />
+        </section>
+        <MobileDivider isEnd={true} theme={theme} />
+      </SubsectionMobile>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const ExtrasMobileContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <ExtrasMobile paneHistoryStart={paneHistoryStart} {...props} />;
+};
+
+export default connect(mapStateToProps)(ExtrasMobileContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/ExtrasMobile/index.ts b/ddb_main/tools/js/CharacterSheet/containers/mobile/ExtrasMobile/index.ts
new file mode 100644
index 0000000..6a8349d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/ExtrasMobile/index.ts
@@ -0,0 +1,4 @@
+import ExtrasMobile from "./ExtrasMobile";
+
+export default ExtrasMobile;
+export { ExtrasMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/FeaturesMobile/FeaturesMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/mobile/FeaturesMobile/FeaturesMobile.tsx
new file mode 100644
index 0000000..1b6b97c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/FeaturesMobile/FeaturesMobile.tsx
@@ -0,0 +1,41 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import MobileDivider from "../../../components/MobileDivider";
+import SubsectionMobile from "../../../components/SubsectionMobile";
+import { SheetAppState } from "../../../typings";
+import Features from "../../Features";
+
+interface Props extends DispatchProp {
+  theme: CharacterTheme;
+}
+class FeaturesMobile extends React.PureComponent<Props> {
+  render() {
+    const { theme } = this.props;
+
+    return (
+      <SubsectionMobile>
+        <MobileDivider label="Features & Traits" theme={theme} />
+        <section className="ct-features-mobile">
+          <h2 style={visuallyHidden}>Features and Traits</h2>
+          <Features />
+        </section>
+        <MobileDivider isEnd={true} theme={theme} />
+      </SubsectionMobile>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+export default connect(mapStateToProps)(FeaturesMobile);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/FeaturesMobile/index.ts b/ddb_main/tools/js/CharacterSheet/containers/mobile/FeaturesMobile/index.ts
new file mode 100644
index 0000000..4006d07
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/FeaturesMobile/index.ts
@@ -0,0 +1,4 @@
+import FeaturesMobile from "./FeaturesMobile";
+
+export default FeaturesMobile;
+export { FeaturesMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/MainMobile/MainMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/mobile/MainMobile/MainMobile.tsx
new file mode 100644
index 0000000..c2329f9
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/MainMobile/MainMobile.tsx
@@ -0,0 +1,176 @@
+import { visuallyHidden } from "@mui/utils";
+import { useSelector } from "react-redux";
+
+import {
+  AbilitySummary,
+  CampaignSummary,
+  SavingThrowsSummary,
+} from "@dndbeyond/character-components/es";
+import {
+  AbilityManager,
+  DataOrigin,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { useAbilities } from "~/hooks/useAbilities";
+
+import { getDataOriginComponentInfo } from "../../../../../../subApps/sheet/components/Sidebar/helpers/paneUtils";
+import { PaneComponentEnum } from "../../../../../../subApps/sheet/components/Sidebar/types";
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "../../../../Shared/selectors";
+import { PaneIdentifierUtils } from "../../../../Shared/utils";
+import MobileDivider from "../../../components/MobileDivider";
+import SavingThrowsDetails from "../../../components/SavingThrowsDetails";
+import Senses from "../../../components/Senses";
+import SubsectionMobile from "../../../components/SubsectionMobile";
+
+export default function MainMobile() {
+  const abilities = useAbilities();
+  const {
+    pane: { paneHistoryStart, paneHistoryPush },
+  } = useSidebar();
+  const preferences = useSelector(rulesEngineSelectors.getCharacterPreferences);
+  const savingThrowDiceAdjustments = useSelector(
+    rulesEngineSelectors.getSavingThrowDiceAdjustments
+  ); // TODO: GFS move to mangers
+  const situationalBonusSavingThrowsLookup = useSelector(
+    rulesEngineSelectors.getSituationalBonusSavingThrowsLookup
+  ); // TODO: GFS move to mangers
+  const passivePerception = useSelector(
+    rulesEngineSelectors.getPassivePerception
+  ); // TODO: GFS move to mangers
+  const passiveInvestigation = useSelector(
+    rulesEngineSelectors.getPassiveInvestigation
+  ); // TODO: GFS move to mangers
+  const passiveInsight = useSelector(rulesEngineSelectors.getPassiveInsight); // TODO: GFS move to mangers
+  const senses = useSelector(rulesEngineSelectors.getSenseInfo); // TODO: GFS move to mangers
+  const ruleData = useSelector(rulesEngineSelectors.getRuleData);
+  const campaign = useSelector(rulesEngineSelectors.getCampaign);
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+  const deathSaveInfo = useSelector(rulesEngineSelectors.getDeathSaveInfo);
+  const diceEnabled = useSelector(appEnvSelectors.getDiceEnabled);
+  const characterRollContext = useSelector(
+    characterRollContextSelectors.getCharacterRollContext
+  );
+  const gameLog = useSelector(appEnvSelectors.getGameLog);
+
+  const handleSensesManageShow = (): void => {
+    paneHistoryStart(PaneComponentEnum.SENSE_MANAGE);
+  };
+
+  const handleSavingThrowsClick = (): void => {
+    paneHistoryStart(PaneComponentEnum.SAVING_THROWS);
+  };
+
+  const handleAbilitySummaryClick = (ability: AbilityManager): void => {
+    paneHistoryStart(
+      PaneComponentEnum.ABILITY,
+      PaneIdentifierUtils.generateAbility(ability)
+    );
+  };
+
+  const handleAbilityClick = (ability: AbilityManager): void => {
+    paneHistoryStart(
+      PaneComponentEnum.ABILITY_SAVING_THROW,
+      PaneIdentifierUtils.generateAbilitySavingThrows(ability.getId())
+    );
+  };
+
+  const handleDataOriginClick = (dataOrigin: DataOrigin): void => {
+    let component = getDataOriginComponentInfo(dataOrigin);
+    if (component.type !== PaneComponentEnum.ERROR_404) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  const handleCampaignShow = (): void => {
+    paneHistoryStart(PaneComponentEnum.CAMPAIGN);
+  };
+
+  return (
+    <SubsectionMobile name="Main">
+      <div
+        className={`ct-main-mobile ${
+          theme.isDarkMode ? "ct-main-mobile--dark-mode" : ""
+        }`}
+      >
+        {campaign && (
+          <CampaignSummary
+            campaign={campaign}
+            onCampaignShow={handleCampaignShow}
+            className={
+              theme.isDarkMode
+                ? "ct-main-mobile__campaign-button--dark-mode"
+                : ""
+            }
+            theme={theme}
+            gameLog={gameLog}
+          />
+        )}
+        <section className="ct-main-mobile__abilities">
+          <h2 style={visuallyHidden}>Ability Scores</h2>
+          {abilities.map((ability) => (
+            <div className="ct-main-mobile__ability" key={ability.getStatKey()}>
+              <AbilitySummary
+                ability={ability}
+                preferences={preferences}
+                theme={theme}
+                onClick={handleAbilitySummaryClick}
+                diceEnabled={diceEnabled}
+                rollContext={characterRollContext}
+              />
+            </div>
+          ))}
+        </section>
+        <MobileDivider
+          label="Saving Throws"
+          onClick={handleSavingThrowsClick}
+          theme={theme}
+        />
+        <section
+          className={`ct-main-mobile__saving-throws ${
+            theme.isDarkMode ? "ct-main-mobile__saving-throws--dark-mode" : ""
+          }`}
+        >
+          <h2 style={visuallyHidden}>Saving Throws</h2>
+          <SavingThrowsSummary
+            abilities={abilities}
+            situationalBonusSavingThrowsLookup={
+              situationalBonusSavingThrowsLookup
+            }
+            onClick={handleAbilityClick}
+            diceEnabled={diceEnabled}
+            theme={theme}
+            rollContext={characterRollContext}
+          />
+          <SavingThrowsDetails
+            theme={theme}
+            ruleData={ruleData}
+            savingThrowDiceAdjustments={savingThrowDiceAdjustments}
+            onDataOriginClick={handleDataOriginClick}
+            deathSaveInfo={deathSaveInfo}
+          />
+        </section>
+        <MobileDivider isEnd={true} theme={theme} />
+        <MobileDivider
+          label="Senses"
+          onClick={handleSensesManageShow}
+          theme={theme}
+        />
+        <h2 style={visuallyHidden}>Senses</h2>
+        <Senses
+          senses={senses}
+          theme={theme}
+          passiveInsight={Number(passiveInsight)}
+          passiveInvestigation={Number(passiveInvestigation)}
+          passivePerception={Number(passivePerception)}
+          onClick={handleSensesManageShow}
+        />
+        <MobileDivider isEnd={true} theme={theme} />
+      </div>
+    </SubsectionMobile>
+  );
+}
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/MainMobile/index.ts b/ddb_main/tools/js/CharacterSheet/containers/mobile/MainMobile/index.ts
new file mode 100644
index 0000000..ca4315d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/MainMobile/index.ts
@@ -0,0 +1,4 @@
+import MainMobile from "./MainMobile";
+
+export default MainMobile;
+export { MainMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/NotesMobile/NotesMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/mobile/NotesMobile/NotesMobile.tsx
new file mode 100644
index 0000000..fc2cd3e
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/NotesMobile/NotesMobile.tsx
@@ -0,0 +1,41 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import MobileDivider from "../../../components/MobileDivider";
+import SubsectionMobile from "../../../components/SubsectionMobile";
+import { SheetAppState } from "../../../typings";
+import Notes from "../../Notes";
+
+interface Props extends DispatchProp {
+  theme: CharacterTheme;
+}
+class NotesMobile extends React.PureComponent<Props> {
+  render() {
+    const { theme } = this.props;
+
+    return (
+      <SubsectionMobile className="ct-notes-mobile">
+        <MobileDivider label="Notes" theme={theme} />
+        <section>
+          <h2 style={visuallyHidden}>Notes</h2>
+          <Notes />
+        </section>
+        <MobileDivider isEnd={true} theme={theme} />
+      </SubsectionMobile>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+export default connect(mapStateToProps)(NotesMobile);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/NotesMobile/index.ts b/ddb_main/tools/js/CharacterSheet/containers/mobile/NotesMobile/index.ts
new file mode 100644
index 0000000..a3af0df
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/NotesMobile/index.ts
@@ -0,0 +1,4 @@
+import NotesMobile from "./NotesMobile";
+
+export default NotesMobile;
+export { NotesMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/ProficiencyGroupsMobile/ProficiencyGroupsMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/mobile/ProficiencyGroupsMobile/ProficiencyGroupsMobile.tsx
new file mode 100644
index 0000000..b96b9e3
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/ProficiencyGroupsMobile/ProficiencyGroupsMobile.tsx
@@ -0,0 +1,47 @@
+import { visuallyHidden } from "@mui/utils";
+import { FC } from "react";
+import { useSelector } from "react-redux";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import MobileDivider from "../../../components/MobileDivider";
+import ProficiencyGroups from "../../../components/ProficiencyGroups";
+import SubsectionMobile from "../../../components/SubsectionMobile";
+
+interface Props {}
+export const ProficiencyGroupsMobile: FC<Props> = () => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const { proficiencyGroups, characterTheme } = useCharacterEngine();
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+
+  const handleManageShow = (): void => {
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.PROFICIENCIES);
+    }
+  };
+
+  return (
+    <SubsectionMobile name="Proficiency Groups">
+      <MobileDivider
+        label={"Proficiencies & Training"}
+        onClick={handleManageShow}
+        isReadonly={isReadonly}
+        theme={characterTheme}
+      />
+      <section className="ct-proficiency-groups-mobile">
+        <h2 style={visuallyHidden}>Proficiencies and Training</h2>
+        <ProficiencyGroups
+          proficiencyGroups={proficiencyGroups}
+          onClick={handleManageShow}
+        />
+      </section>
+      <MobileDivider isEnd={true} theme={characterTheme} />
+    </SubsectionMobile>
+  );
+};
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/SkillsMobile/SkillsMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/mobile/SkillsMobile/SkillsMobile.tsx
new file mode 100644
index 0000000..057706c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/SkillsMobile/SkillsMobile.tsx
@@ -0,0 +1,131 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  rulesEngineSelectors,
+  Skill,
+  SkillUtils,
+  ValueLookup,
+  CharacterTheme,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+import { IRollContext } from "@dndbeyond/dice";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "../../../../Shared/selectors";
+import { PaneIdentifierUtils } from "../../../../Shared/utils";
+import MobileDivider from "../../../components/MobileDivider";
+import Skills from "../../../components/Skills";
+import SubsectionMobile from "../../../components/SubsectionMobile";
+import { SheetAppState } from "../../../typings";
+
+interface Props {
+  skills: Array<Skill>;
+  customSkills: Array<Skill>;
+  valueLookup: ValueLookup;
+  theme: CharacterTheme;
+  diceEnabled: boolean;
+  ruleData: RuleData;
+  characterRollContext: IRollContext;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class SkillsBox extends React.PureComponent<Props> {
+  handleManageShow = (): void => {
+    const { paneHistoryStart } = this.props;
+
+    paneHistoryStart(PaneComponentEnum.SKILLS);
+  };
+
+  handleCustomSkillClick = (skill: Skill): void => {
+    const { paneHistoryStart } = this.props;
+
+    paneHistoryStart(
+      PaneComponentEnum.CUSTOM_SKILL,
+      PaneIdentifierUtils.generateCustomSkill(SkillUtils.getId(skill))
+    );
+  };
+
+  handleEmptyClick = (): void => {
+    this.handleManageShow();
+  };
+
+  handleSkillClick = (skill: Skill): void => {
+    const { paneHistoryStart } = this.props;
+
+    paneHistoryStart(
+      PaneComponentEnum.SKILL,
+      PaneIdentifierUtils.generateSkill(SkillUtils.getId(skill))
+    );
+  };
+
+  render() {
+    const {
+      skills,
+      valueLookup,
+      customSkills,
+      theme,
+      diceEnabled,
+      ruleData,
+      characterRollContext,
+    } = this.props;
+
+    return (
+      <SubsectionMobile name="Skills">
+        <section
+          className={`ct-skills-mobile ${
+            theme.isDarkMode ? "ct-skills-mobile--dark-mode" : ""
+          }`}
+        >
+          <MobileDivider
+            label="Skills"
+            onClick={this.handleManageShow}
+            theme={theme}
+          />
+          <h2 style={visuallyHidden}>Skills</h2>
+          <Skills
+            skills={skills}
+            customSkills={customSkills}
+            valueLookup={valueLookup}
+            onCustomSkillClick={this.handleCustomSkillClick}
+            onSkillClick={this.handleSkillClick}
+            onEmptyClick={this.handleEmptyClick}
+            diceEnabled={diceEnabled}
+            ruleData={ruleData}
+            theme={theme}
+            rollContext={characterRollContext}
+          />
+          <MobileDivider isEnd={true} theme={theme} />
+        </section>
+      </SubsectionMobile>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    skills: rulesEngineSelectors.getSkills(state),
+    valueLookup: rulesEngineSelectors.getCharacterValueLookup(state),
+    customSkills: rulesEngineSelectors.getCustomSkills(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    characterRollContext:
+      characterRollContextSelectors.getCharacterRollContext(state),
+  };
+}
+
+const SkillsBoxContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <SkillsBox {...props} paneHistoryStart={paneHistoryStart} />;
+};
+
+export default connect(mapStateToProps)(SkillsBoxContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/SkillsMobile/index.ts b/ddb_main/tools/js/CharacterSheet/containers/mobile/SkillsMobile/index.ts
new file mode 100644
index 0000000..f7d0877
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/SkillsMobile/index.ts
@@ -0,0 +1,4 @@
+import SkillsMobile from "./SkillsMobile";
+
+export default SkillsMobile;
+export { SkillsMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/SpellsMobile/SpellsMobile.tsx b/ddb_main/tools/js/CharacterSheet/containers/mobile/SpellsMobile/SpellsMobile.tsx
new file mode 100644
index 0000000..d4b3f13
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/SpellsMobile/SpellsMobile.tsx
@@ -0,0 +1,68 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import MobileDivider from "../../../components/MobileDivider";
+import SubsectionMobile from "../../../components/SubsectionMobile";
+import { SheetAppState } from "../../../typings";
+import Spells from "../../Spells";
+
+interface Props {
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class SpellsMobile extends React.PureComponent<Props> {
+  handleManageSpellsOpen = (): void => {
+    const { paneHistoryStart, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.SPELL_MANAGE);
+    }
+  };
+
+  render() {
+    const { isReadonly, theme } = this.props;
+
+    return (
+      <SubsectionMobile>
+        <MobileDivider
+          label="Spells"
+          onClick={this.handleManageSpellsOpen}
+          isReadonly={isReadonly}
+          theme={theme}
+        />
+        <section className="ct-spells-mobile">
+          <h2 style={visuallyHidden}>Spells</h2>
+          <Spells showNotes={false} />
+        </section>
+        <MobileDivider isEnd={true} theme={theme} />
+      </SubsectionMobile>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const SpellsMobileContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <SpellsMobile {...props} paneHistoryStart={paneHistoryStart} />;
+};
+
+export default connect(mapStateToProps)(SpellsMobileContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/mobile/SpellsMobile/index.ts b/ddb_main/tools/js/CharacterSheet/containers/mobile/SpellsMobile/index.ts
new file mode 100644
index 0000000..e824b74
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/mobile/SpellsMobile/index.ts
@@ -0,0 +1,4 @@
+import SpellsMobile from "./SpellsMobile";
+
+export default SpellsMobile;
+export { SpellsMobile };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/ActionsTablet/ActionsTablet.tsx b/ddb_main/tools/js/CharacterSheet/containers/tablet/ActionsTablet/ActionsTablet.tsx
new file mode 100644
index 0000000..21ac7fb
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/ActionsTablet/ActionsTablet.tsx
@@ -0,0 +1,44 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import SubsectionTablet from "../../../components/SubsectionTablet";
+import TabletBox from "../../../components/TabletBox";
+import { SheetAppState } from "../../../typings";
+import Actions from "../../Actions";
+
+interface Props extends DispatchProp {
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+class ActionsTablet extends React.PureComponent<Props> {
+  render() {
+    const { theme } = this.props;
+
+    return (
+      <SubsectionTablet>
+        <TabletBox theme={theme} header="Actions" className="ct-actions-tablet">
+          <section>
+            <h2 style={visuallyHidden}>Actions</h2>
+            <Actions />
+          </section>
+        </TabletBox>
+      </SubsectionTablet>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+export default connect(mapStateToProps)(ActionsTablet);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/ActionsTablet/index.ts b/ddb_main/tools/js/CharacterSheet/containers/tablet/ActionsTablet/index.ts
new file mode 100644
index 0000000..832494e
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/ActionsTablet/index.ts
@@ -0,0 +1,4 @@
+import ActionsTablet from "./ActionsTablet";
+
+export default ActionsTablet;
+export { ActionsTablet };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/CombatTablet/CombatTablet.tsx b/ddb_main/tools/js/CharacterSheet/containers/tablet/CombatTablet/CombatTablet.tsx
new file mode 100644
index 0000000..36b0639
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/CombatTablet/CombatTablet.tsx
@@ -0,0 +1,160 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import { ArmorClassBox } from "@dndbeyond/character-components/es";
+import {
+  CharacterPreferences,
+  SpeedInfo,
+  RuleData,
+  rulesEngineSelectors,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { InitiativeBox } from "~/subApps/sheet/components/InitiativeBox";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import ProficiencyBonusBox from "../../../components/ProficiencyBonusBox";
+import SpeedBox from "../../../components/SpeedBox";
+import { SheetAppState } from "../../../typings";
+
+interface Props {
+  armorClass: number;
+  speeds: SpeedInfo;
+  proficiencyBonus: number;
+  preferences: CharacterPreferences;
+  theme: CharacterTheme;
+  ruleData: RuleData;
+  isReadonly: boolean;
+  diceEnabled: boolean;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class CombatTablet extends React.PureComponent<Props> {
+  static defaultProps = {
+    diceEnabled: false,
+  };
+
+  handleProficiencyBonusClick = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.PROFICIENCY_BONUS);
+  };
+
+  handleSpeedsClick = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.SPEED_MANAGE);
+  };
+
+  handleDefensesSummaryClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    paneHistoryStart(PaneComponentEnum.DEFENSE_MANAGE);
+  };
+
+  handleConditionSummaryClick = (evt: React.MouseEvent): void => {
+    const { paneHistoryStart } = this.props;
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    paneHistoryStart(PaneComponentEnum.CONDITION_MANAGE);
+  };
+
+  handleArmorClassClick = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.ARMOR_MANAGE);
+  };
+
+  render() {
+    const {
+      preferences,
+      proficiencyBonus,
+      speeds,
+      armorClass,
+      theme,
+      ruleData,
+    } = this.props;
+
+    return (
+      <div className="ct-combat-tablet">
+        <div className="ct-combat-tablet__extras">
+          <div className="ct-combat-tablet__extra ct-combat-tablet__extra--proficiency">
+            <ProficiencyBonusBox
+              theme={theme}
+              proficiencyBonus={proficiencyBonus}
+              onClick={this.handleProficiencyBonusClick}
+            />
+          </div>
+          <div className="ct-combat-tablet__extra ct-combat-tablet__extra--speed">
+            <SpeedBox
+              speeds={speeds}
+              preferences={preferences}
+              theme={theme}
+              ruleData={ruleData}
+              onClick={this.handleSpeedsClick}
+            />
+          </div>
+          <div className="ct-combat-tablet__extra ct-combat-tablet__extra--initiative">
+            <InitiativeBox isTablet />
+          </div>
+          <div className="ct-combat-tablet__extra ct-combat-tablet__extra--ac">
+            <ArmorClassBox
+              theme={theme}
+              armorClass={armorClass}
+              onClick={this.handleArmorClassClick}
+            />
+          </div>
+          <div className="ct-combat-tablet__extra ct-combat-tablet__extra--statuses">
+            <div className="ct-combat-tablet__ctas">
+              <div className="ct-combat-tablet__cta">
+                <div
+                  role="button"
+                  className={`ct-combat-tablet__cta-button ${
+                    theme.isDarkMode
+                      ? "ct-combat-tablet__cta-button--dark-mode"
+                      : ""
+                  }`}
+                  onClick={this.handleDefensesSummaryClick}
+                >
+                  Defenses
+                </div>
+              </div>
+              <div className="ct-combat-tablet__cta">
+                <div
+                  role="button"
+                  className={`ct-combat-tablet__cta-button ${
+                    theme.isDarkMode
+                      ? "ct-combat-tablet__cta-button--dark-mode"
+                      : ""
+                  }`}
+                  onClick={this.handleConditionSummaryClick}
+                >
+                  Conditions
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    armorClass: rulesEngineSelectors.getAcTotal(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    speeds: rulesEngineSelectors.getCurrentCarriedWeightSpeed(state),
+    preferences: rulesEngineSelectors.getCharacterPreferences(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+  };
+}
+const CombatTabletContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <CombatTablet {...props} paneHistoryStart={paneHistoryStart} />;
+};
+export default connect(mapStateToProps)(CombatTabletContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/CombatTablet/index.ts b/ddb_main/tools/js/CharacterSheet/containers/tablet/CombatTablet/index.ts
new file mode 100644
index 0000000..8dc9e7d
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/CombatTablet/index.ts
@@ -0,0 +1,4 @@
+import CombatTablet from "./CombatTablet";
+
+export default CombatTablet;
+export { CombatTablet };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/DescriptionTablet/DescriptionTablet.tsx b/ddb_main/tools/js/CharacterSheet/containers/tablet/DescriptionTablet/DescriptionTablet.tsx
new file mode 100644
index 0000000..9ad6772
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/DescriptionTablet/DescriptionTablet.tsx
@@ -0,0 +1,27 @@
+import { visuallyHidden } from "@mui/utils";
+import { FC } from "react";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+
+import SubsectionTablet from "../../../components/SubsectionTablet";
+import TabletBox from "../../../components/TabletBox";
+import Description from "../../Description";
+
+export const DescriptionTablet: FC = () => {
+  const { characterTheme } = useCharacterEngine();
+
+  return (
+    <SubsectionTablet>
+      <TabletBox
+        header={"Background"}
+        className="ct-description-tablet"
+        theme={characterTheme}
+      >
+        <section>
+          <h2 style={visuallyHidden}>Background</h2>
+          <Description theme={characterTheme} />
+        </section>
+      </TabletBox>
+    </SubsectionTablet>
+  );
+};
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/EquipmentTablet/EquipmentTablet.tsx b/ddb_main/tools/js/CharacterSheet/containers/tablet/EquipmentTablet/EquipmentTablet.tsx
new file mode 100644
index 0000000..13a86f7
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/EquipmentTablet/EquipmentTablet.tsx
@@ -0,0 +1,70 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import SubsectionTablet from "../../../components/SubsectionTablet";
+import TabletBox from "../../../components/TabletBox";
+import { SheetAppState } from "../../../typings";
+import Equipment from "../../Equipment";
+
+interface Props {
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class EquipmentTablet extends React.PureComponent<Props> {
+  handleManageClick = (): void => {
+    const { paneHistoryStart, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.EQUIPMENT_MANAGE);
+    }
+  };
+
+  render() {
+    const { isReadonly, theme } = this.props;
+
+    return (
+      <SubsectionTablet>
+        <TabletBox
+          header="Inventory"
+          className="ct-equipment-tablet"
+          onHeaderClick={this.handleManageClick}
+          isReadonly={isReadonly}
+          theme={theme}
+        >
+          <section>
+            <h2 style={visuallyHidden}>Inventory</h2>
+            <Equipment />
+          </section>
+        </TabletBox>
+      </SubsectionTablet>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const EquipmentTabletContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  return <EquipmentTablet {...props} paneHistoryStart={paneHistoryStart} />;
+};
+
+export default connect(mapStateToProps)(EquipmentTabletContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/EquipmentTablet/index.ts b/ddb_main/tools/js/CharacterSheet/containers/tablet/EquipmentTablet/index.ts
new file mode 100644
index 0000000..a6887fc
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/EquipmentTablet/index.ts
@@ -0,0 +1,4 @@
+import EquipmentTablet from "./EquipmentTablet";
+
+export default EquipmentTablet;
+export { EquipmentTablet };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/ExtrasTablet/ExtrasTablet.tsx b/ddb_main/tools/js/CharacterSheet/containers/tablet/ExtrasTablet/ExtrasTablet.tsx
new file mode 100644
index 0000000..817f930
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/ExtrasTablet/ExtrasTablet.tsx
@@ -0,0 +1,69 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import SubsectionTablet from "../../../components/SubsectionTablet";
+import TabletBox from "../../../components/TabletBox";
+import { SheetAppState } from "../../../typings";
+import Extras from "../../Extras";
+
+interface Props {
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class ExtrasTablet extends React.PureComponent<Props> {
+  handleManageOpen = (): void => {
+    const { paneHistoryStart, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.EXTRA_MANAGE);
+    }
+  };
+
+  render() {
+    const { isReadonly, theme } = this.props;
+
+    return (
+      <SubsectionTablet>
+        <TabletBox
+          header="Extras"
+          onHeaderClick={this.handleManageOpen}
+          className="ct-extras-tablet"
+          isReadonly={isReadonly}
+          theme={theme}
+        >
+          <section>
+            <h2 style={visuallyHidden}>Extras</h2>
+            <Extras />
+          </section>
+        </TabletBox>
+      </SubsectionTablet>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const ExtrasTabletContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <ExtrasTablet {...props} paneHistoryStart={paneHistoryStart} />;
+};
+
+export default connect(mapStateToProps)(ExtrasTabletContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/ExtrasTablet/index.ts b/ddb_main/tools/js/CharacterSheet/containers/tablet/ExtrasTablet/index.ts
new file mode 100644
index 0000000..0e3824a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/ExtrasTablet/index.ts
@@ -0,0 +1,4 @@
+import ExtrasTablet from "./ExtrasTablet";
+
+export default ExtrasTablet;
+export { ExtrasTablet };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/FeaturesTablet/FeaturesTablet.tsx b/ddb_main/tools/js/CharacterSheet/containers/tablet/FeaturesTablet/FeaturesTablet.tsx
new file mode 100644
index 0000000..8205d05
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/FeaturesTablet/FeaturesTablet.tsx
@@ -0,0 +1,45 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import SubsectionTablet from "../../../components/SubsectionTablet";
+import TabletBox from "../../../components/TabletBox";
+import { SheetAppState } from "../../../typings";
+import Features from "../../Features";
+
+interface Props extends DispatchProp {
+  theme: CharacterTheme;
+}
+class FeaturesTablet extends React.PureComponent<Props> {
+  render() {
+    const { theme } = this.props;
+
+    return (
+      <SubsectionTablet className="ct-features-tablet">
+        <TabletBox
+          header="Features & Traits"
+          className="ct-actions-tablet"
+          theme={theme}
+        >
+          <section>
+            <h2 style={visuallyHidden}>Features and Traits</h2>
+            <Features />
+          </section>
+        </TabletBox>
+      </SubsectionTablet>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+export default connect(mapStateToProps)(FeaturesTablet);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/FeaturesTablet/index.ts b/ddb_main/tools/js/CharacterSheet/containers/tablet/FeaturesTablet/index.ts
new file mode 100644
index 0000000..ecf2276
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/FeaturesTablet/index.ts
@@ -0,0 +1,4 @@
+import FeaturesTablet from "./FeaturesTablet";
+
+export default FeaturesTablet;
+export { FeaturesTablet };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/MainTablet/MainTablet.tsx b/ddb_main/tools/js/CharacterSheet/containers/tablet/MainTablet/MainTablet.tsx
new file mode 100644
index 0000000..d4ee477
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/MainTablet/MainTablet.tsx
@@ -0,0 +1,248 @@
+import { visuallyHidden } from "@mui/utils";
+import { useSelector } from "react-redux";
+
+import {
+  AbilitySummary,
+  CampaignSummary,
+  ManageIcon,
+} from "@dndbeyond/character-components/es";
+import {
+  AbilityManager,
+  rulesEngineSelectors,
+  Skill,
+  SkillUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { useAbilities } from "~/hooks/useAbilities";
+
+import { PaneComponentEnum } from "../../../../../../subApps/sheet/components/Sidebar/types";
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "../../../../Shared/selectors";
+import { PaneIdentifierUtils } from "../../../../Shared/utils";
+import ProficiencyGroupsBox from "../../../components/ProficiencyGroupsBox";
+import SavingThrowsBox from "../../../components/SavingThrowsBox";
+import SensesBox from "../../../components/SensesBox";
+import SkillsBox from "../../../components/SkillsBox";
+import SubsectionTablet from "../../../components/SubsectionTablet";
+
+export default function MainTablet() {
+  const abilities = useAbilities();
+
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const preferences = useSelector(rulesEngineSelectors.getCharacterPreferences);
+  const savingThrowDiceAdjustments = useSelector(
+    rulesEngineSelectors.getSavingThrowDiceAdjustments
+  );
+  const situationalBonusSavingThrowsLookup = useSelector(
+    rulesEngineSelectors.getSituationalBonusSavingThrowsLookup
+  );
+  const deathSaveInfo = useSelector(rulesEngineSelectors.getDeathSaveInfo);
+  const passivePerception = useSelector(
+    rulesEngineSelectors.getPassivePerception
+  );
+  const passiveInvestigation = useSelector(
+    rulesEngineSelectors.getPassiveInvestigation
+  );
+  const passiveInsight = useSelector(rulesEngineSelectors.getPassiveInsight);
+  const senses = useSelector(rulesEngineSelectors.getSenseInfo);
+  const campaign = useSelector(rulesEngineSelectors.getCampaign);
+  const skills = useSelector(rulesEngineSelectors.getSkills);
+  const valueLookup = useSelector(rulesEngineSelectors.getCharacterValueLookup);
+  const customSkills = useSelector(rulesEngineSelectors.getCustomSkills);
+  const proficiencyGroups = useSelector(
+    rulesEngineSelectors.getProficiencyGroups
+  );
+  const dimensions = useSelector(appEnvSelectors.getDimensions);
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const diceEnabled = useSelector(appEnvSelectors.getDiceEnabled);
+  const ruleData = useSelector(rulesEngineSelectors.getRuleData);
+  const characterRollContext = useSelector(
+    characterRollContextSelectors.getCharacterRollContext
+  );
+  const gameLog = useSelector(appEnvSelectors.getGameLog);
+  const handleSensesManageShow = (): void => {
+    paneHistoryStart(PaneComponentEnum.SENSE_MANAGE);
+  };
+
+  const handleSavingThrowsClick = (): void => {
+    paneHistoryStart(PaneComponentEnum.SAVING_THROWS);
+  };
+
+  const handleAbilitySummaryClick = (ability: AbilityManager): void => {
+    paneHistoryStart(
+      PaneComponentEnum.ABILITY,
+      PaneIdentifierUtils.generateAbility(ability)
+    );
+  };
+
+  const handleAbilityClick = (ability: AbilityManager): void => {
+    paneHistoryStart(
+      PaneComponentEnum.ABILITY_SAVING_THROW,
+      PaneIdentifierUtils.generateAbilitySavingThrows(ability.getId())
+    );
+  };
+
+  const handleProficienciesManageShow = (): void => {
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.PROFICIENCIES);
+    }
+  };
+
+  const handleCampaignShow = (): void => {
+    paneHistoryStart(PaneComponentEnum.CAMPAIGN);
+  };
+
+  const handleCustomSkillClick = (skill: Skill): void => {
+    paneHistoryStart(
+      PaneComponentEnum.CUSTOM_SKILL,
+      PaneIdentifierUtils.generateCustomSkill(SkillUtils.getId(skill))
+    );
+  };
+
+  const handleSkillsShow = (): void => {
+    paneHistoryStart(PaneComponentEnum.SKILLS);
+  };
+
+  const handleSkillClick = (skill: Skill): void => {
+    paneHistoryStart(
+      PaneComponentEnum.SKILL,
+      PaneIdentifierUtils.generateSkill(SkillUtils.getId(skill))
+    );
+  };
+
+  return (
+    <SubsectionTablet name="Main">
+      <div className="ct-main-tablet">
+        {campaign && (
+          <CampaignSummary
+            campaign={campaign}
+            onCampaignShow={handleCampaignShow}
+            className={
+              theme.isDarkMode
+                ? "ct-main-tablet__campaign-button--dark-mode"
+                : ""
+            }
+            theme={theme}
+            gameLog={gameLog}
+          />
+        )}
+        <section className="ct-main-tablet__abilities">
+          <h2 style={visuallyHidden}>Abilities</h2>
+          {abilities.map((ability) => (
+            <div className="ct-main-tablet__ability" key={ability.getStatKey()}>
+              <AbilitySummary
+                theme={theme}
+                ability={ability}
+                preferences={preferences}
+                onClick={handleAbilitySummaryClick}
+                diceEnabled={diceEnabled}
+                rollContext={characterRollContext}
+              />
+            </div>
+          ))}
+        </section>
+        <div className="ct-main-tablet__large-boxes">
+          <div className="ct-main-tablet__large-boxes-bucket">
+            <div className="ct-main-tablet__large-box">
+              <SavingThrowsBox
+                abilities={abilities}
+                ruleData={ruleData}
+                savingThrowDiceAdjustments={savingThrowDiceAdjustments}
+                situationalBonusSavingThrowsLookup={
+                  situationalBonusSavingThrowsLookup
+                }
+                deathSaveInfo={deathSaveInfo}
+                onAbilityClick={handleAbilityClick}
+                onClick={handleSavingThrowsClick}
+                dimensions={dimensions}
+                theme={theme}
+                diceEnabled={diceEnabled}
+                rollContext={characterRollContext}
+              />
+              <div className="ct-main-tablet__large-box-footer">
+                <ManageIcon
+                  onClick={handleSavingThrowsClick}
+                  enableTooltip={false}
+                  theme={theme}
+                >
+                  Saving Throws
+                </ManageIcon>
+              </div>
+            </div>
+            <div className="ct-main-tablet__large-box">
+              <SensesBox
+                senses={senses}
+                passiveInsight={Number(passiveInsight)}
+                passiveInvestigation={Number(passiveInvestigation)}
+                passivePerception={Number(passivePerception)}
+                onClick={handleSensesManageShow}
+                dimensions={dimensions}
+                theme={theme}
+              />
+              <div className="ct-main-tablet__large-box-footer">
+                <ManageIcon
+                  onClick={handleSensesManageShow}
+                  enableTooltip={false}
+                  theme={theme}
+                >
+                  Senses
+                </ManageIcon>
+              </div>
+            </div>
+            <div className="ct-main-tablet__large-box">
+              <ProficiencyGroupsBox
+                dimensions={dimensions}
+                theme={theme}
+                proficiencyGroups={proficiencyGroups}
+                onClick={handleProficienciesManageShow}
+              />
+              <div className="ct-main-tablet__large-box-footer">
+                <ManageIcon
+                  onClick={handleProficienciesManageShow}
+                  enableTooltip={false}
+                  showIcon={!isReadonly}
+                  theme={theme}
+                >
+                  Proficiencies & Training
+                </ManageIcon>
+              </div>
+            </div>
+          </div>
+          <div className="ct-main-tablet__large-boxes-bucket">
+            <div className="ct-main-tablet__large-box">
+              <SkillsBox
+                skills={skills}
+                customSkills={customSkills}
+                valueLookup={valueLookup}
+                onCustomSkillClick={handleCustomSkillClick}
+                onSkillClick={handleSkillClick}
+                onEmptyClick={handleSkillsShow}
+                dimensions={dimensions}
+                theme={theme}
+                diceEnabled={diceEnabled}
+                ruleData={ruleData}
+                rollContext={characterRollContext}
+              />
+              <div className="ct-main-tablet__large-box-footer">
+                <ManageIcon
+                  onClick={handleSkillsShow}
+                  enableTooltip={false}
+                  theme={theme}
+                >
+                  Skills
+                </ManageIcon>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </SubsectionTablet>
+  );
+}
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/MainTablet/index.ts b/ddb_main/tools/js/CharacterSheet/containers/tablet/MainTablet/index.ts
new file mode 100644
index 0000000..0619679
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/MainTablet/index.ts
@@ -0,0 +1,4 @@
+import MainTablet from "./MainTablet";
+
+export default MainTablet;
+export { MainTablet };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/NotesTablet/NotesTablet.tsx b/ddb_main/tools/js/CharacterSheet/containers/tablet/NotesTablet/NotesTablet.tsx
new file mode 100644
index 0000000..1c64a2a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/NotesTablet/NotesTablet.tsx
@@ -0,0 +1,41 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import SubsectionTablet from "../../../components/SubsectionTablet";
+import TabletBox from "../../../components/TabletBox";
+import { SheetAppState } from "../../../typings";
+import Notes from "../../Notes";
+
+interface Props extends DispatchProp {
+  theme: CharacterTheme;
+}
+class NotesTablet extends React.PureComponent<Props> {
+  render() {
+    const { theme } = this.props;
+
+    return (
+      <SubsectionTablet>
+        <TabletBox header="Notes" className="ct-notes-tablet" theme={theme}>
+          <section>
+            <h2 style={visuallyHidden}>Notes</h2>
+            <Notes />
+          </section>
+        </TabletBox>
+      </SubsectionTablet>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+export default connect(mapStateToProps)(NotesTablet);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/NotesTablet/index.ts b/ddb_main/tools/js/CharacterSheet/containers/tablet/NotesTablet/index.ts
new file mode 100644
index 0000000..262c782
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/NotesTablet/index.ts
@@ -0,0 +1,4 @@
+import NotesTablet from "./NotesTablet";
+
+export default NotesTablet;
+export { NotesTablet };
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/SpellsTablet/SpellsTablet.tsx b/ddb_main/tools/js/CharacterSheet/containers/tablet/SpellsTablet/SpellsTablet.tsx
new file mode 100644
index 0000000..f6e2ee2
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/SpellsTablet/SpellsTablet.tsx
@@ -0,0 +1,69 @@
+import { visuallyHidden } from "@mui/utils";
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  CharacterTheme,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../../Shared/selectors";
+import SubsectionTablet from "../../../components/SubsectionTablet";
+import TabletBox from "../../../components/TabletBox";
+import { SheetAppState } from "../../../typings";
+import Spells from "../../Spells";
+
+interface Props {
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class SpellsTablet extends React.PureComponent<Props> {
+  handleManageSpellsOpen = (): void => {
+    const { paneHistoryStart, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      paneHistoryStart(PaneComponentEnum.SPELL_MANAGE);
+    }
+  };
+
+  render() {
+    const { isReadonly, theme } = this.props;
+
+    return (
+      <SubsectionTablet>
+        <TabletBox
+          header="Spells"
+          onHeaderClick={this.handleManageSpellsOpen}
+          className="ct-spells-tablet"
+          isReadonly={isReadonly}
+          theme={theme}
+        >
+          <section>
+            <h2 style={visuallyHidden}>Spells</h2>
+            <Spells />
+          </section>
+        </TabletBox>
+      </SubsectionTablet>
+    );
+  }
+}
+
+function mapStateToProps(state: SheetAppState) {
+  return {
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const SpellsTabletContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <SpellsTablet {...props} paneHistoryStart={paneHistoryStart} />;
+};
+
+export default connect(mapStateToProps)(SpellsTabletContainer);
diff --git a/ddb_main/tools/js/CharacterSheet/containers/tablet/SpellsTablet/index.ts b/ddb_main/tools/js/CharacterSheet/containers/tablet/SpellsTablet/index.ts
new file mode 100644
index 0000000..f3abf52
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/containers/tablet/SpellsTablet/index.ts
@@ -0,0 +1,4 @@
+import SpellsTablet from "./SpellsTablet";
+
+export default SpellsTablet;
+export { SpellsTablet };
diff --git a/ddb_main/tools/js/CharacterSheet/reducers/index.ts b/ddb_main/tools/js/CharacterSheet/reducers/index.ts
new file mode 100644
index 0000000..b027510
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/reducers/index.ts
@@ -0,0 +1,40 @@
+import { routerReducer } from "react-router-redux";
+import { combineReducers } from "redux";
+
+import { defaultReducers } from "@dndbeyond/character-rules-engine/es";
+
+import builder from "../../CharacterBuilder/reducers/builder";
+import appEnv from "../../Shared/reducers/appEnv";
+import appInfo from "../../Shared/reducers/appInfo";
+import rollResult from "../../Shared/reducers/rollResult";
+import toastMessage from "../../Shared/reducers/toastMessage";
+import sheet from "./sheet";
+
+const initialRouteControls = {
+  currentPath: "",
+  navigate: (route) => {
+    console.log("navigate not setup failed to go to", route);
+  },
+};
+const rootReducer = combineReducers({
+  ...defaultReducers,
+  appEnv,
+  appInfo,
+  sheet,
+  builder,
+  toastMessage,
+  rollResult,
+  router: routerReducer,
+  routeControls: (state = initialRouteControls, action) => {
+    switch (action.type) {
+      case "SET_ROUTE_CONTROLS":
+        return action.payload;
+      default:
+        break;
+    }
+
+    return state;
+  },
+});
+
+export default rootReducer;
diff --git a/ddb_main/tools/js/CharacterSheet/reducers/sheet.ts b/ddb_main/tools/js/CharacterSheet/reducers/sheet.ts
new file mode 100644
index 0000000..179d64a
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/reducers/sheet.ts
@@ -0,0 +1,24 @@
+import { SheetAction, sheetActionTypes } from "../actions/sheet";
+import { SheetState } from "../typings";
+
+const initialState: SheetState = {
+  initFailed: false,
+  initError: null,
+};
+function sheet(
+  state: SheetState = initialState,
+  action: SheetAction
+): SheetState {
+  switch (action.type) {
+    case sheetActionTypes.CHARACTER_RECEIVE_FAIL:
+      return {
+        ...state,
+        initFailed: true,
+        initError: action.payload.error,
+      };
+  }
+
+  return state;
+}
+
+export default sheet;
diff --git a/ddb_main/tools/js/CharacterSheet/sagas/sheet.ts b/ddb_main/tools/js/CharacterSheet/sagas/sheet.ts
new file mode 100644
index 0000000..9fbaf66
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/sagas/sheet.ts
@@ -0,0 +1,49 @@
+import { call, put, select, takeEvery } from "redux-saga/effects";
+
+import { characterActions } from "@dndbeyond/character-rules-engine/es";
+
+import { appEnvSelectors } from "../../Shared/selectors";
+import appConfig from "../../config";
+import {
+  CharacterInitAction,
+  SheetAction,
+  sheetActions,
+  sheetActionTypes,
+} from "../actions/sheet";
+
+export default function* saga() {
+  yield takeEvery(
+    Object.keys(sheetActionTypes).map((key) => sheetActionTypes[key]),
+    filter
+  );
+}
+
+function* filter(action: SheetAction) {
+  switch (action.type) {
+    case sheetActionTypes.CHARACTER_INIT:
+      yield call(initCurrentCharacter, action);
+      break;
+
+    default:
+    // not implemented
+  }
+}
+
+function* initCurrentCharacter(action: CharacterInitAction) {
+  const characterId: ReturnType<typeof appEnvSelectors.getCharacterId> =
+    yield select(appEnvSelectors.getCharacterId);
+  if (characterId === null) {
+    yield put(
+      sheetActions.characterReceiveFail(new Error("Missing Character Id"))
+    );
+    return;
+  }
+
+  try {
+    yield put(
+      characterActions.characterLoad(characterId, { v: appConfig.version })
+    );
+  } catch (error) {
+    yield put(sheetActions.characterReceiveFail(error));
+  }
+}
diff --git a/ddb_main/tools/js/CharacterSheet/selectors/composite/sheetApp.ts b/ddb_main/tools/js/CharacterSheet/selectors/composite/sheetApp.ts
new file mode 100644
index 0000000..b4113d9
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/selectors/composite/sheetApp.ts
@@ -0,0 +1,12 @@
+import { createSelector } from "reselect";
+
+import config from "~/config";
+
+import { appEnvSelectors } from "../../../Shared/selectors";
+
+const BASE_PATHNAME = config.basePathname;
+
+export const getBuilderUrl = createSelector(
+  [appEnvSelectors.getCharacterId],
+  (characterId) => `${BASE_PATHNAME}/${characterId}/builder/class/manage`
+);
diff --git a/ddb_main/tools/js/CharacterSheet/selectors/sheet.ts b/ddb_main/tools/js/CharacterSheet/selectors/sheet.ts
new file mode 100644
index 0000000..e228e8c
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/selectors/sheet.ts
@@ -0,0 +1,4 @@
+import { SheetAppState } from "../typings";
+
+export const getInitFailed = (state: SheetAppState) => state.sheet.initFailed;
+export const getInitError = (state: SheetAppState) => state.sheet.initError;
diff --git a/ddb_main/tools/js/CharacterSheet/store/configureStore.ts b/ddb_main/tools/js/CharacterSheet/store/configureStore.ts
new file mode 100644
index 0000000..c7c494f
--- /dev/null
+++ b/ddb_main/tools/js/CharacterSheet/store/configureStore.ts
@@ -0,0 +1,19 @@
+import { Store } from "redux";
+
+import builderSaga from "../../CharacterBuilder/sagas/builder";
+import { StateStoreUtils } from "../../Shared/stores";
+import rootReducer from "../reducers/index";
+import sheetSaga from "../sagas/sheet";
+
+let store;
+export default function configureStore(initialState?: any): Store {
+  let sagaMiddleware: Array<any> = [sheetSaga, builderSaga];
+  if (!store) {
+    store = StateStoreUtils.configureStore(
+      initialState,
+      rootReducer,
+      sagaMiddleware
+    );
+  }
+  return store;
+}
diff --git a/ddb_main/tools/js/Shared/actions/appEnv/actionTypes.ts b/ddb_main/tools/js/Shared/actions/appEnv/actionTypes.ts
new file mode 100644
index 0000000..753ec27
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/appEnv/actionTypes.ts
@@ -0,0 +1,3 @@
+export const DATA_SET = "appEnv.DATA_SET";
+export const MOBILE_SET = "appEnv.MOBILE_SET";
+export const DIMENSIONS_SET = "appEnv.DIMENSIONS_SET";
diff --git a/ddb_main/tools/js/Shared/actions/appEnv/actions.ts b/ddb_main/tools/js/Shared/actions/appEnv/actions.ts
new file mode 100644
index 0000000..d31853b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/appEnv/actions.ts
@@ -0,0 +1,47 @@
+import { AppEnvDimensionsState } from "../../stores/typings";
+import * as actionTypes from "./actionTypes";
+import {
+  DataSetAction,
+  DataSetPayload,
+  DimensionsSetAction,
+  MobileSetAction,
+} from "./typings";
+
+/**
+ *
+ * @param payload
+ */
+export function dataSet(payload: DataSetPayload): DataSetAction {
+  return {
+    type: actionTypes.DATA_SET,
+    payload,
+  };
+}
+
+/**
+ *
+ * @param isMobile
+ */
+export function mobileSet(isMobile: boolean): MobileSetAction {
+  return {
+    type: actionTypes.MOBILE_SET,
+    payload: {
+      isMobile,
+    },
+  };
+}
+
+/**
+ *
+ * @param dimensions
+ */
+export function dimensionsSet(
+  dimensions: Omit<AppEnvDimensionsState, "styleSizeType">
+): DimensionsSetAction {
+  return {
+    type: actionTypes.DIMENSIONS_SET,
+    payload: {
+      dimensions,
+    },
+  };
+}
diff --git a/ddb_main/tools/js/Shared/actions/appEnv/index.ts b/ddb_main/tools/js/Shared/actions/appEnv/index.ts
new file mode 100644
index 0000000..6d89d67
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/appEnv/index.ts
@@ -0,0 +1,7 @@
+import * as actionTypes from "./actionTypes";
+import * as actions from "./actions";
+import * as typings from "./typings";
+
+export const appEnvActionTypes = actionTypes;
+export const appEnvActions = actions;
+export const appEnvTypings = typings;
diff --git a/ddb_main/tools/js/Shared/actions/appInfo/actionTypes.ts b/ddb_main/tools/js/Shared/actions/appInfo/actionTypes.ts
new file mode 100644
index 0000000..ea8a4e3
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/appInfo/actionTypes.ts
@@ -0,0 +1 @@
+export const ERROR_SET = "appInfo.ERROR_SET";
diff --git a/ddb_main/tools/js/Shared/actions/appInfo/actions.ts b/ddb_main/tools/js/Shared/actions/appInfo/actions.ts
new file mode 100644
index 0000000..8b1f274
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/appInfo/actions.ts
@@ -0,0 +1,21 @@
+import AppErrorTypeEnum from "../../constants/AppErrorTypeEnum";
+import * as types from "./actionTypes";
+import { ErrorSetAction } from "./typings";
+
+/**
+ *
+ * @param appErrorType
+ * @param errorId
+ */
+export function errorSet(
+  appErrorType: AppErrorTypeEnum,
+  errorId: string | null = null
+): ErrorSetAction {
+  return {
+    type: types.ERROR_SET,
+    payload: {
+      appErrorType: appErrorType,
+      errorId,
+    },
+  };
+}
diff --git a/ddb_main/tools/js/Shared/actions/appInfo/index.ts b/ddb_main/tools/js/Shared/actions/appInfo/index.ts
new file mode 100644
index 0000000..c52c17c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/appInfo/index.ts
@@ -0,0 +1,7 @@
+import * as actionTypes from "./actionTypes";
+import * as actions from "./actions";
+import * as typings from "./typings";
+
+export const appInfoActionTypes = actionTypes;
+export const appInfoActions = actions;
+export const appInfoTypings = typings;
diff --git a/ddb_main/tools/js/Shared/actions/rollResult/actionTypes.ts b/ddb_main/tools/js/Shared/actions/rollResult/actionTypes.ts
new file mode 100644
index 0000000..55dbec0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/rollResult/actionTypes.ts
@@ -0,0 +1,51 @@
+export const ROLL_RESULT_GROUPS_LOAD = "rollResult.ROLL_RESULT_GROUPS_LOAD";
+export const ROLL_RESULT_GROUP_CREATE = "rollResult.ROLL_RESULT_GROUP_CREATE";
+export const ROLL_RESULT_GROUP_DESTROY = "rollResult.ROLL_RESULT_GROUP_DESTROY";
+
+export const ROLL_RESULT_COMPONENT_GROUPS_SET =
+  "rollResult.ROLL_RESULT_COMPONENT_GROUPS_SET";
+export const ROLL_RESULT_COMPONENT_GROUPS_SET_COMMIT =
+  "rollResult.ROLL_RESULT_COMPONENT_GROUPS_SET_COMMIT";
+
+export const ROLL_RESULT_GROUP_ADD = "rollResult.ROLL_RESULT_GROUP_ADD";
+export const ROLL_RESULT_GROUP_ADD_COMMIT =
+  "rollResult.ROLL_RESULT_GROUP_ADD_COMMIT";
+
+export const ROLL_RESULT_GROUP_REMOVE = "rollResult.ROLL_RESULT_GROUP_REMOVE";
+export const ROLL_RESULT_GROUP_REMOVE_COMMIT =
+  "rollResult.ROLL_RESULT_GROUP_REMOVE_COMMIT";
+
+export const ROLL_RESULT_GROUP_DICE_ROLLS_SET =
+  "rollResult.ROLL_RESULT_GROUP_DICE_ROLLS_SET";
+export const ROLL_RESULT_GROUP_DICE_ROLLS_SET_COMMIT =
+  "rollResult.ROLL_RESULT_GROUP_DICE_ROLLS_SET_COMMIT";
+
+export const ROLL_RESULT_GROUP_ORDER_SET =
+  "rollResult.ROLL_RESULT_GROUP_ORDER_SET";
+export const ROLL_RESULT_GROUP_ORDER_SET_COMMIT =
+  "rollResult.ROLL_RESULT_GROUP_ORDER_SET_COMMIT";
+
+export const ROLL_RESULT_GROUP_RESET = "rollResult.ROLL_RESULT_GROUP_RESET";
+export const ROLL_RESULT_GROUP_RESET_COMMIT =
+  "rollResult.ROLL_RESULT_GROUP_RESET_COMMIT";
+
+export const ROLL_RESULT_DICE_ROLL_SET = "rollResult.ROLL_RESULT_DICE_ROLL_SET";
+export const ROLL_RESULT_DICE_ROLL_SET_COMMIT =
+  "rollResult.ROLL_RESULT_DICE_ROLL_SET_COMMIT";
+
+export const ROLL_RESULT_DICE_ROLL_STATUS_SET =
+  "rollResult.ROLL_RESULT_DICE_ROLL_STATUS_SET";
+
+export const ROLL_RESULT_COMPONENT_GROUP_PERSIST =
+  "rollResult.ROLL_RESULT_COMPONENT_GROUP_PERSIST";
+export const ROLL_RESULT_COMPONENT_PERSIST =
+  "rollResult.ROLL_RESULT_COMPONENT_PERSIST";
+
+export const ROLL_RESULT_COMPONENT_SIMULATED_GROUPS_SET =
+  "rollResult.ROLL_RESULT_COMPONENT_SIMULATED_GROUPS_SET";
+export const ROLL_RESULT_COMPONENT_SIMULATED_GROUPS_REMOVE =
+  "rollResult.ROLL_RESULT_COMPONENT_SIMULATED_GROUPS_REMOVE";
+export const ROLL_RESULT_COMPONENT_SIMULATED_GROUPS_PERSIST =
+  "rollResult.ROLL_RESULT_COMPONENT_SIMULATED_GROUPS_PERSIST";
+export const ROLL_RESULT_COMPONENT_SIMULATED_DICE_ROLL_SET =
+  "rollResult.ROLL_RESULT_COMPONENT_SIMULATED_DICE_ROLL_SET";
diff --git a/ddb_main/tools/js/Shared/actions/rollResult/actions.ts b/ddb_main/tools/js/Shared/actions/rollResult/actions.ts
new file mode 100644
index 0000000..8c1d272
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/rollResult/actions.ts
@@ -0,0 +1,488 @@
+import {
+  RollGroupContract,
+  RollResultContract,
+} from "@dndbeyond/character-rules-engine/es";
+
+import * as types from "./actionTypes";
+import {
+  RollResultGroupAddAction,
+  RollResultGroupsLoadAction,
+  RollResultGroupRemoveAction,
+  RollResultGroupDiceRollsSetAction,
+  RollResultComponentGroupsSetAction,
+  RollResultGroupOrderSetAction,
+  RollResultGroupCreateAction,
+  RollResultGroupDestroyAction,
+  RollResultComponentGroupsSetCommitAction,
+  RollResultGroupAddCommitAction,
+  RollResultGroupRemoveCommitAction,
+  RollResultGroupDiceRollsSetCommitAction,
+  RollResultGroupOrderSetCommitAction,
+  RollResultGroupResetAction,
+  RollResultGroupResetCommitAction,
+  RollResultDiceRollSetAction,
+  RollResultDiceRollSetCommitAction,
+  RollResultDiceRollStatusSetAction,
+  RollResultComponentSimulatedGroupsSetAction,
+  RollResultComponentSimulatedGroupsPersistAction,
+  RollResultComponentSimulatedDiceRollSetAction,
+  RollResultComponentGroupPersistAction,
+  RollResultComponentPersistAction,
+} from "./typings";
+
+/**
+ *
+ * @param componentKey
+ * @param simulatedGroupCount
+ * @param simulatedRollResultCount
+ */
+export function rollResultGroupsLoad(
+  componentKey: string,
+  simulatedGroupCount: number | null,
+  simulatedRollResultCount?: number
+): RollResultGroupsLoadAction {
+  return {
+    type: types.ROLL_RESULT_GROUPS_LOAD,
+    payload: {
+      componentKey,
+      simulatedGroupCount,
+      simulatedRollResultCount,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ * @param simulatedRollResultCount
+ */
+export function rollResultGroupCreate(
+  componentKey: string,
+  simulatedRollResultCount?: number
+): RollResultGroupCreateAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_CREATE,
+    payload: {
+      componentKey,
+      simulatedRollResultCount,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ * @param nextGroupKey
+ */
+export function rollResultGroupDestroy(
+  componentKey: string,
+  groupKey: string,
+  nextGroupKey: string | null
+): RollResultGroupDestroyAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_DESTROY,
+    payload: {
+      componentKey,
+      groupKey,
+      nextGroupKey,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ * @param groups
+ */
+export function rollResultComponentGroupsSet(
+  componentKey: string,
+  groups: Array<RollGroupContract>
+): RollResultComponentGroupsSetAction {
+  return {
+    type: types.ROLL_RESULT_COMPONENT_GROUPS_SET,
+    payload: {
+      componentKey,
+      groups,
+    },
+  };
+}
+/**
+ *
+ * @param componentKey
+ * @param groups
+ */
+export function rollResultComponentGroupsSetCommit(
+  componentKey: string,
+  groups: Array<RollGroupContract>
+): RollResultComponentGroupsSetCommitAction {
+  return {
+    type: types.ROLL_RESULT_COMPONENT_GROUPS_SET_COMMIT,
+    payload: {
+      componentKey,
+      groups,
+    },
+  };
+}
+
+/**
+ *
+ * @param group
+ */
+export function rollResultGroupAdd(
+  group: RollGroupContract
+): RollResultGroupAddAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_ADD,
+    payload: {
+      group,
+      componentKey: group.componentKey,
+    },
+  };
+}
+/**
+ *
+ * @param group
+ */
+export function rollResultGroupAddCommit(
+  group: RollGroupContract
+): RollResultGroupAddCommitAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_ADD_COMMIT,
+    payload: {
+      group,
+      componentKey: group.componentKey,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ */
+export function rollResultGroupRemove(
+  componentKey: string,
+  groupKey: string
+): RollResultGroupRemoveAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_REMOVE,
+    payload: {
+      componentKey,
+      groupKey,
+    },
+  };
+}
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ */
+export function rollResultGroupRemoveCommit(
+  componentKey: string,
+  groupKey: string
+): RollResultGroupRemoveCommitAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_REMOVE_COMMIT,
+    payload: {
+      componentKey,
+      groupKey,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ * @param rollResults
+ */
+export function rollResultGroupDiceRollsSet(
+  componentKey: string,
+  groupKey: string,
+  rollResults: Array<RollResultContract>
+): RollResultGroupDiceRollsSetAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_DICE_ROLLS_SET,
+    payload: {
+      componentKey,
+      groupKey,
+      rollResults,
+    },
+  };
+}
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ * @param rollResults
+ */
+export function rollResultGroupDiceRollsSetCommit(
+  componentKey: string,
+  groupKey: string,
+  rollResults: Array<RollResultContract>
+): RollResultGroupDiceRollsSetCommitAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_DICE_ROLLS_SET_COMMIT,
+    payload: {
+      componentKey,
+      groupKey,
+      rollResults,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ * @param nextGroupKey
+ */
+export function rollResultGroupOrderSet(
+  componentKey: string,
+  groupKey: string,
+  nextGroupKey: string | null
+): RollResultGroupOrderSetAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_ORDER_SET,
+    payload: {
+      componentKey,
+      groupKey,
+      nextGroupKey,
+    },
+  };
+}
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ * @param nextGroupKey
+ */
+export function rollResultGroupOrderSetCommit(
+  componentKey: string,
+  groupKey: string,
+  nextGroupKey: string | null
+): RollResultGroupOrderSetCommitAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_ORDER_SET_COMMIT,
+    payload: {
+      componentKey,
+      groupKey,
+      nextGroupKey,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ */
+export function rollResultGroupReset(
+  componentKey: string,
+  groupKey: string,
+  rollResults: Array<RollResultContract>
+): RollResultGroupResetAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_RESET,
+    payload: {
+      componentKey,
+      groupKey,
+      rollResults,
+    },
+  };
+}
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ */
+export function rollResultGroupResetCommit(
+  componentKey: string,
+  groupKey: string,
+  rollResults: Array<RollResultContract>
+): RollResultGroupResetCommitAction {
+  return {
+    type: types.ROLL_RESULT_GROUP_RESET_COMMIT,
+    payload: {
+      componentKey,
+      groupKey,
+      rollResults,
+    },
+  };
+}
+
+/**
+ *
+ * @param rollKey
+ * @param properties
+ * @param nextRollKey
+ */
+export function rollResultDiceRollSet(
+  rollKey: string,
+  properties: Omit<Partial<RollResultContract>, "rollKey">,
+  nextRollKey: string | null
+): RollResultDiceRollSetAction {
+  return {
+    type: types.ROLL_RESULT_DICE_ROLL_SET,
+    payload: {
+      rollKey,
+      properties,
+      nextRollKey,
+    },
+  };
+}
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ * @param rollKey
+ * @param properties
+ */
+export function rollResultDiceRollSetCommit(
+  componentKey: string,
+  groupKey: string,
+  rollKey: string,
+  properties: Omit<Partial<RollResultContract>, "rollKey">,
+  nextRollKey: string | null
+): RollResultDiceRollSetCommitAction {
+  return {
+    type: types.ROLL_RESULT_DICE_ROLL_SET_COMMIT,
+    payload: {
+      componentKey,
+      groupKey,
+      rollKey,
+      properties,
+      nextRollKey,
+    },
+  };
+}
+
+/**
+ *
+ * @param rollKey
+ * @param loadingStatus
+ */
+export function rollResultDiceRollStatusSet(
+  rollKey,
+  loadingStatus
+): RollResultDiceRollStatusSetAction {
+  return {
+    type: types.ROLL_RESULT_DICE_ROLL_STATUS_SET,
+    payload: {
+      rollKey,
+      loadingStatus,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ * @param rollResults
+ */
+export function rollResultComponentGroupPersist(
+  componentKey: string,
+  groupKey: string,
+  rollResults: Array<RollResultContract>
+): RollResultComponentGroupPersistAction {
+  return {
+    type: types.ROLL_RESULT_COMPONENT_GROUP_PERSIST,
+    payload: {
+      componentKey,
+      groupKey,
+      rollResults,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ * @param rollKey
+ * @param properties
+ * @param nextRollKey
+ */
+export function rollResultComponentPersist(
+  componentKey: string,
+  groupKey: string,
+  rollKey: string,
+  properties: Partial<RollResultContract>,
+  nextRollKey: string | null
+): RollResultComponentPersistAction {
+  return {
+    type: types.ROLL_RESULT_COMPONENT_PERSIST,
+    payload: {
+      componentKey,
+      groupKey,
+      rollKey,
+      properties,
+      nextRollKey,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ * @param groups
+ */
+export function rollResultComponentSimulatedGroupsSet(
+  componentKey: string,
+  groups: Array<RollGroupContract>
+): RollResultComponentSimulatedGroupsSetAction {
+  return {
+    type: types.ROLL_RESULT_COMPONENT_SIMULATED_GROUPS_SET,
+    payload: {
+      componentKey,
+      groups,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ */
+export function rollResultComponentSimulatedGroupsPersist(
+  componentKey: string,
+  groupKey?: string,
+  rollKey?: string,
+  properties?: Partial<RollResultContract>
+): RollResultComponentSimulatedGroupsPersistAction {
+  return {
+    type: types.ROLL_RESULT_COMPONENT_SIMULATED_GROUPS_PERSIST,
+    payload: {
+      componentKey,
+      groupKey,
+      rollKey,
+      properties,
+    },
+  };
+}
+
+/**
+ *
+ * @param componentKey
+ * @param groupKey
+ * @param rollKey
+ * @param properties
+ */
+export function rollResultComponentSimulatedDiceRollSet(
+  componentKey: string,
+  groupKey: string,
+  rollKey: string,
+  properties: Omit<Partial<RollResultContract>, "rollKey">
+): RollResultComponentSimulatedDiceRollSetAction {
+  return {
+    type: types.ROLL_RESULT_COMPONENT_SIMULATED_DICE_ROLL_SET,
+    payload: {
+      componentKey,
+      groupKey,
+      rollKey,
+      properties,
+    },
+  };
+}
diff --git a/ddb_main/tools/js/Shared/actions/rollResult/index.ts b/ddb_main/tools/js/Shared/actions/rollResult/index.ts
new file mode 100644
index 0000000..66dca1d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/rollResult/index.ts
@@ -0,0 +1,7 @@
+import * as actionTypes from "./actionTypes";
+import * as actions from "./actions";
+import * as typings from "./typings";
+
+export const rollResultActionTypes = actionTypes;
+export const rollResultActions = actions;
+export const rollResultTypings = typings;
diff --git a/ddb_main/tools/js/Shared/actions/toastMessage/actionTypes.ts b/ddb_main/tools/js/Shared/actions/toastMessage/actionTypes.ts
new file mode 100644
index 0000000..5a70455
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/toastMessage/actionTypes.ts
@@ -0,0 +1,3 @@
+export const ADD_MESSAGE = "toastMessages.ADD_MESSAGE";
+export const REMOVE_MESSAGE = "toastMessages.REMOVE_MESSAGE";
+export const CLEAR_MESSAGES = "toastMessages.CLEAR_MESSAGES";
diff --git a/ddb_main/tools/js/Shared/actions/toastMessage/actions.ts b/ddb_main/tools/js/Shared/actions/toastMessage/actions.ts
new file mode 100644
index 0000000..8e67585
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/toastMessage/actions.ts
@@ -0,0 +1,72 @@
+import { ToastMessageMeta } from "../../stores/typings";
+import * as actionTypes from "./actionTypes";
+import {
+  ToastErrorAction,
+  ToastRemoveAction,
+  ToastSuccessAction,
+} from "./typings";
+
+/**
+ *
+ * @param title
+ * @param message
+ * @param meta
+ */
+export function toastSuccess(
+  title: string,
+  message: string,
+  meta?: ToastMessageMeta
+): ToastSuccessAction {
+  return {
+    type: actionTypes.ADD_MESSAGE,
+    payload: {
+      toast: {
+        title,
+        message,
+      },
+      meta: {
+        level: "success",
+        ...meta,
+      },
+    },
+  };
+}
+
+/**
+ *
+ * @param title
+ * @param message
+ * @param meta
+ */
+export function toastError(
+  title: string,
+  message: string,
+  meta?: ToastMessageMeta
+): ToastErrorAction {
+  return {
+    type: actionTypes.ADD_MESSAGE,
+    payload: {
+      toast: {
+        title,
+        message,
+      },
+      meta: {
+        level: "error",
+        ...meta,
+      },
+    },
+  };
+}
+
+/**
+ *
+ * @param id
+ */
+export function removeToast(id: number | string): ToastRemoveAction {
+  return {
+    type: actionTypes.REMOVE_MESSAGE,
+    payload: {
+      id,
+    },
+  };
+}
diff --git a/ddb_main/tools/js/Shared/actions/toastMessage/index.ts b/ddb_main/tools/js/Shared/actions/toastMessage/index.ts
new file mode 100644
index 0000000..6287183
--- /dev/null
+++ b/ddb_main/tools/js/Shared/actions/toastMessage/index.ts
@@ -0,0 +1,7 @@
+import * as actionTypes from "./actionTypes";
+import * as actions from "./actions";
+import * as typings from "./typings";
+
+export const toastMessageTypes = actionTypes;
+export const toastMessageActions = actions;
+export const toastMessageTypings = typings;
diff --git a/ddb_main/tools/js/Shared/components/ActionDetail/ActionDetail.tsx b/ddb_main/tools/js/Shared/components/ActionDetail/ActionDetail.tsx
new file mode 100644
index 0000000..0331b19
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ActionDetail/ActionDetail.tsx
@@ -0,0 +1,648 @@
+import React from "react";
+
+import {
+  Collapsible,
+  DamageTypeIcon,
+  MarketplaceCta,
+  AoeTypeIcon,
+  ComponentConstants,
+} from "@dndbeyond/character-components/es";
+import {
+  AbilityLookup,
+  AccessUtils,
+  Action,
+  ActionUtils,
+  ActivationUtils,
+  BaseInventoryContract,
+  CharacterTheme,
+  Constants,
+  DiceUtils,
+  EntityUtils,
+  EntityValueLookup,
+  FormatUtils,
+  HelperUtils,
+  InfusionUtils,
+  InventoryLookup,
+  ItemUtils,
+  LimitedUseUtils,
+  ModelInfoContract,
+  RuleData,
+  RuleDataUtils,
+  ValueUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { InfoItem } from "~/components/InfoItem";
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+import EditorBox from "../EditorBox";
+import SlotManager from "../SlotManager";
+import SlotManagerLarge from "../SlotManagerLarge";
+import ValueEditor from "../ValueEditor";
+import { RemoveButton } from "../common/Button";
+import styles from "./styles.module.css";
+
+interface Props {
+  action: Action;
+  ruleData: RuleData;
+  onCustomDataUpdate?: (
+    propertyKey: Constants.AdjustmentTypeEnum,
+    value: any,
+    source: any
+  ) => void;
+  showCustomize?: boolean;
+  entityValueLookup: EntityValueLookup;
+  abilityLookup: AbilityLookup;
+  inventoryLookup: InventoryLookup;
+  isReadonly: boolean;
+  largePoolMinAmount?: number;
+  onLimitedUseSet?: (usedAmount: number) => void;
+  onCustomizationsRemove?: () => void;
+  proficiencyBonus: number;
+  theme?: CharacterTheme;
+}
+
+const infoItemProps = { role: "listItem", inline: true };
+
+export const ActionDetail = ({
+  showCustomize = true,
+  largePoolMinAmount = 11,
+  onCustomizationsRemove,
+  ruleData,
+  abilityLookup,
+  action,
+  onLimitedUseSet,
+  proficiencyBonus,
+  isReadonly,
+  entityValueLookup,
+  onCustomDataUpdate,
+  theme,
+  inventoryLookup,
+}: Props) => {
+  const handleRemoveCustomizations = () => {
+    if (onCustomizationsRemove) {
+      onCustomizationsRemove();
+    }
+  };
+
+  const renderSmallAmountSlotPool = (): React.ReactNode => {
+    let limitedUse = ActionUtils.getLimitedUse(action);
+    if (!limitedUse) {
+      return null;
+    }
+
+    const numberUsed = LimitedUseUtils.getNumberUsed(limitedUse);
+    const maxUses = LimitedUseUtils.deriveMaxUses(
+      limitedUse,
+      abilityLookup,
+      ruleData,
+      proficiencyBonus
+    );
+
+    return (
+      <SlotManager
+        used={numberUsed}
+        available={maxUses}
+        size={"small"}
+        onSet={onLimitedUseSet}
+      />
+    );
+  };
+
+  const renderLargeAmountSlotPool = (): React.ReactNode => {
+    let limitedUse = ActionUtils.getLimitedUse(action);
+    if (!limitedUse) {
+      return null;
+    }
+
+    const numberUsed = LimitedUseUtils.getNumberUsed(limitedUse);
+    const maxUses = LimitedUseUtils.deriveMaxUses(
+      limitedUse,
+      abilityLookup,
+      ruleData,
+      proficiencyBonus
+    );
+
+    return (
+      <SlotManagerLarge
+        available={maxUses}
+        used={numberUsed}
+        onSet={onLimitedUseSet}
+        isReadonly={isReadonly}
+      />
+    );
+  };
+
+  const renderLimitedUses = (): React.ReactNode => {
+    let limitedUse = ActionUtils.getLimitedUse(action);
+    if (!limitedUse) {
+      return null;
+    }
+
+    let maxUses = LimitedUseUtils.deriveMaxUses(
+      limitedUse,
+      abilityLookup,
+      ruleData,
+      proficiencyBonus
+    );
+    if (!maxUses) {
+      return null;
+    }
+    let numberUsed = LimitedUseUtils.getNumberUsed(limitedUse);
+    let totalSlots: number = Math.max(maxUses, numberUsed);
+
+    return (
+      <div className={styles.limitedUses}>
+        <div className={styles.limitedUsesLabel}>Limited Use</div>
+        {totalSlots >= largePoolMinAmount
+          ? renderLargeAmountSlotPool()
+          : renderSmallAmountSlotPool()}
+      </div>
+    );
+  };
+
+  const renderCustomize = (): React.ReactNode => {
+    const mappingId = ActionUtils.getMappingId(action);
+    const mappingEntityTypeId = ActionUtils.getMappingEntityTypeId(action);
+
+    if (
+      !showCustomize ||
+      isReadonly ||
+      mappingId === null ||
+      mappingEntityTypeId === null
+    ) {
+      return null;
+    }
+
+    let valueEditorComponents: Array<Constants.AdjustmentTypeEnum> = [
+      Constants.AdjustmentTypeEnum.TO_HIT_OVERRIDE,
+      Constants.AdjustmentTypeEnum.TO_HIT_BONUS,
+      Constants.AdjustmentTypeEnum.FIXED_VALUE_BONUS,
+      Constants.AdjustmentTypeEnum.DISPLAY_AS_ATTACK,
+      Constants.AdjustmentTypeEnum.NAME_OVERRIDE,
+      Constants.AdjustmentTypeEnum.NOTES,
+    ];
+
+    const isCustomized = ActionUtils.isCustomized(action);
+
+    return (
+      <Collapsible
+        layoutType={"minimal"}
+        header={`Customize${isCustomized ? "*" : ""}`}
+        className={styles.customize}
+      >
+        <EditorBox>
+          <ValueEditor
+            dataLookup={ValueUtils.getEntityData(
+              entityValueLookup,
+              mappingId,
+              mappingEntityTypeId
+            )}
+            onDataUpdate={onCustomDataUpdate}
+            valueEditors={valueEditorComponents}
+            ruleData={ruleData}
+            labelOverrides={{
+              [Constants.AdjustmentTypeEnum.NAME_OVERRIDE]: "Name",
+              [Constants.AdjustmentTypeEnum.FIXED_VALUE_BONUS]: "Damage Bonus",
+            }}
+            defaultValues={{
+              [Constants.AdjustmentTypeEnum.DISPLAY_AS_ATTACK]:
+                ActionUtils.isDefaultDisplayAsAttack(action),
+            }}
+            layoutType={"compact"}
+          />
+          <RemoveButton
+            enableConfirm={true}
+            size="medium"
+            style="filled"
+            disabled={!isCustomized}
+            isInteractive={isCustomized}
+            onClick={handleRemoveCustomizations}
+          >
+            {isCustomized ? "Remove" : "No"} Customizations
+          </RemoveButton>
+        </EditorBox>
+      </Collapsible>
+    );
+  };
+
+  const getRangedInfoData = (): Array<React.ReactNode> => {
+    let rangeInfo = ActionUtils.getRange(action);
+    let attackRangeId = ActionUtils.getAttackRangeId(action);
+
+    let rangeAreas: Array<React.ReactNode> = [];
+    if (
+      rangeInfo !== null &&
+      attackRangeId === Constants.AttackTypeRangeEnum.RANGED
+    ) {
+      if (
+        rangeInfo.origin &&
+        rangeInfo.origin !== Constants.SpellRangeTypeEnum.RANGED
+      ) {
+        let spellRangeType = RuleDataUtils.getSpellRangeType(
+          rangeInfo.origin,
+          ruleData
+        );
+        if (spellRangeType !== null) {
+          rangeAreas.push(spellRangeType.name);
+        }
+      }
+
+      if (rangeInfo.range) {
+        rangeAreas.push(
+          <React.Fragment>
+            <NumberDisplay type="distanceInFt" number={rangeInfo.range} />
+            {rangeInfo.longRange && <span>({rangeInfo.longRange})</span>}
+          </React.Fragment>
+        );
+      }
+
+      if (rangeInfo.aoeSize) {
+        let aoeType: ModelInfoContract | null = null;
+        if (rangeInfo.aoeType !== null) {
+          aoeType = RuleDataUtils.getAoeType(rangeInfo.aoeType, ruleData);
+        }
+        rangeAreas.push(
+          <React.Fragment>
+            <NumberDisplay type="distanceInFt" number={rangeInfo.aoeSize} />
+            {aoeType !== null && (
+              <span className={styles.rangeShape}>
+                <AoeTypeIcon
+                  className={styles.rangeIcon}
+                  type={
+                    FormatUtils.slugify(
+                      aoeType.name
+                    ) as ComponentConstants.AoeTypePropType
+                  }
+                  themeMode={theme?.isDarkMode ? "gray" : "dark"}
+                />
+              </span>
+            )}
+          </React.Fragment>
+        );
+      }
+    }
+
+    return rangeAreas;
+    //`
+  };
+
+  const renderDamageProperties = (): React.ReactNode => {
+    let damage = ActionUtils.getDamage(action);
+
+    let damageDisplay: React.ReactNode = null;
+    if (damage.value !== null) {
+      if (typeof damage.value === "number") {
+        damageDisplay = damage.value;
+      } else {
+        damageDisplay = DiceUtils.renderDice(damage.value);
+      }
+    }
+
+    return (
+      <React.Fragment>
+        {damageDisplay !== null && (
+          <InfoItem label="Damage:" {...infoItemProps}>
+            {damageDisplay}
+          </InfoItem>
+        )}
+        {damage.type !== null && damage.type.name !== null && (
+          <InfoItem label="Damage Type:" {...infoItemProps}>
+            <DamageTypeIcon
+              theme={theme}
+              type={
+                FormatUtils.slugify(
+                  damage.type.name
+                ) as ComponentConstants.DamageTypePropType
+              }
+            />
+            {damage.type.name}
+          </InfoItem>
+        )}
+      </React.Fragment>
+    );
+  };
+
+  const renderWeaponProperties = (): React.ReactNode => {
+    let isProficient = ActionUtils.isProficient(action);
+    let toHit = ActionUtils.getToHit(action);
+    let attackRangeId = ActionUtils.getAttackRangeId(action);
+    let statId = ActionUtils.getStatId(action);
+    let requiresAttackRoll = ActionUtils.requiresAttackRoll(action);
+    let requiresSavingThrow = ActionUtils.requiresSavingThrow(action);
+    let activation = ActionUtils.getActivation(action);
+    let notes = ActionUtils.getNotes(action);
+    let attackSubtypeId = ActionUtils.getAttackSubtypeId(action);
+    let saveStateId = ActionUtils.getSaveStatId(action);
+
+    let rangeAreas: Array<React.ReactNode> = [];
+    if (attackRangeId === Constants.AttackTypeRangeEnum.RANGED) {
+      rangeAreas = getRangedInfoData();
+    } else {
+      rangeAreas.push(
+        <React.Fragment>
+          <NumberDisplay
+            type="distanceInFt"
+            number={ActionUtils.getReach(action)}
+          />{" "}
+          Reach
+        </React.Fragment>
+      );
+    }
+
+    return (
+      <div className={styles.properties} role="list">
+        {activation !== null && activation.activationType && (
+          <InfoItem label="Action Type:" {...infoItemProps}>
+            {ActivationUtils.renderActivation(activation, ruleData)}
+          </InfoItem>
+        )}
+        {attackSubtypeId && (
+          <InfoItem label="Attack Type:" {...infoItemProps}>
+            {ActionUtils.getAttackSubtypeName(action)}
+          </InfoItem>
+        )}
+        {requiresAttackRoll && (
+          <InfoItem label="To Hit:" {...infoItemProps}>
+            <NumberDisplay type="signed" number={toHit} />
+          </InfoItem>
+        )}
+        {requiresSavingThrow && (
+          <InfoItem label="Attack/Save:" {...infoItemProps}>
+            {saveStateId !== null
+              ? RuleDataUtils.getStatNameById(saveStateId, ruleData)
+              : ""}{" "}
+            {ActionUtils.getAttackSaveValue(action)}
+          </InfoItem>
+        )}
+        {renderDamageProperties()}
+        {requiresAttackRoll && (
+          <InfoItem label="Stat:" {...infoItemProps}>
+            {statId === null
+              ? "--"
+              : RuleDataUtils.getStatNameById(statId, ruleData)}
+          </InfoItem>
+        )}
+        {rangeAreas.length > 0 && (
+          <InfoItem label="Range/Area:" {...infoItemProps}>
+            {rangeAreas.map((node, idx) => (
+              <React.Fragment key={idx}>
+                {node}
+                {idx + 1 < rangeAreas.length ? "/" : ""}
+              </React.Fragment>
+            ))}
+          </InfoItem>
+        )}
+        {isProficient && (
+          <InfoItem label="Proficient:" {...infoItemProps}>
+            Yes
+          </InfoItem>
+        )}
+        {notes && (
+          <InfoItem label="Notes:" {...infoItemProps}>
+            {notes}
+          </InfoItem>
+        )}
+      </div>
+    );
+  };
+
+  const renderSpellProperties = (): React.ReactNode => {
+    let isProficient = ActionUtils.isProficient(action);
+    let toHit = ActionUtils.getToHit(action);
+    let statId = ActionUtils.getStatId(action);
+    let requiresAttackRoll = ActionUtils.requiresAttackRoll(action);
+    let requiresSavingThrow = ActionUtils.requiresSavingThrow(action);
+    let activation = ActionUtils.getActivation(action);
+    let notes = ActionUtils.getNotes(action);
+    let attackSubtypeId = ActionUtils.getAttackSubtypeId(action);
+    let saveStateId = ActionUtils.getSaveStatId(action);
+
+    let rangeAreas = getRangedInfoData();
+    return (
+      <div className={styles.properties} role="list">
+        {activation !== null && activation.activationType && (
+          <InfoItem label="Casting Time:" {...infoItemProps}>
+            {ActivationUtils.renderActivation(activation, ruleData)}
+          </InfoItem>
+        )}
+        {attackSubtypeId && (
+          <InfoItem label="Attack Type:">
+            {ActionUtils.getAttackSubtypeName(action)}
+          </InfoItem>
+        )}
+        {requiresAttackRoll && (
+          <InfoItem label="To Hit:">
+            <NumberDisplay type="signed" number={toHit} />
+          </InfoItem>
+        )}
+        {requiresSavingThrow && (
+          <InfoItem label="Attack/Save:">
+            {saveStateId !== null
+              ? RuleDataUtils.getStatNameById(saveStateId, ruleData)
+              : ""}{" "}
+            {ActionUtils.getAttackSaveValue(action)}
+          </InfoItem>
+        )}
+        {renderDamageProperties()}
+        {requiresAttackRoll && (
+          <InfoItem label="Stat:">
+            {statId === null
+              ? "--"
+              : RuleDataUtils.getStatNameById(statId, ruleData)}
+          </InfoItem>
+        )}
+        {rangeAreas.length > 0 && (
+          <InfoItem label="Range/Area:">
+            {rangeAreas.map((node, idx) => (
+              <React.Fragment key={idx}>
+                {node}
+                {idx + 1 < rangeAreas.length ? "/" : ""}
+              </React.Fragment>
+            ))}
+          </InfoItem>
+        )}
+        {isProficient && <InfoItem label="Proficient:">Yes</InfoItem>}
+        {notes && <InfoItem label="Notes:">{notes}</InfoItem>}
+      </div>
+    );
+  };
+
+  const renderGeneralProperties = (): React.ReactNode => {
+    let isProficient = ActionUtils.isProficient(action);
+    let toHit = ActionUtils.getToHit(action);
+    let statId = ActionUtils.getStatId(action);
+    let requiresAttackRoll = ActionUtils.requiresAttackRoll(action);
+    let requiresSavingThrow = ActionUtils.requiresSavingThrow(action);
+    let activation = ActionUtils.getActivation(action);
+    let notes = ActionUtils.getNotes(action);
+    let attackRangeId = ActionUtils.getAttackRangeId(action);
+    let saveStateId = ActionUtils.getSaveStatId(action);
+
+    let rangeAreas: Array<React.ReactNode> = [];
+    if (attackRangeId === Constants.AttackTypeRangeEnum.RANGED) {
+      rangeAreas = getRangedInfoData();
+    } else {
+      rangeAreas.push(
+        <React.Fragment>
+          <NumberDisplay
+            type="distanceInFt"
+            number={ActionUtils.getReach(action)}
+          />{" "}
+          Reach
+        </React.Fragment>
+      );
+    }
+
+    return (
+      <div className={styles.properties} role="list">
+        {activation !== null && activation.activationType && (
+          <InfoItem label={"Action Type:"} {...infoItemProps}>
+            {ActivationUtils.renderActivation(activation, ruleData)}
+          </InfoItem>
+        )}
+        {requiresAttackRoll && (
+          <InfoItem label="To Hit:" {...infoItemProps}>
+            <NumberDisplay type="signed" number={toHit} />
+          </InfoItem>
+        )}
+        {requiresSavingThrow && (
+          <InfoItem label="Attack/Save:" {...infoItemProps}>
+            {saveStateId !== null
+              ? RuleDataUtils.getStatNameById(saveStateId, ruleData)
+              : ""}{" "}
+            {ActionUtils.getAttackSaveValue(action)}
+          </InfoItem>
+        )}
+        {renderDamageProperties()}
+        {requiresAttackRoll && (
+          <InfoItem label="Stat:" {...infoItemProps}>
+            {statId === null
+              ? "--"
+              : RuleDataUtils.getStatNameById(statId, ruleData)}
+          </InfoItem>
+        )}
+        {rangeAreas.length > 0 && (
+          <InfoItem label="Range/Area:" {...infoItemProps}>
+            {rangeAreas.map((node, idx) => (
+              <React.Fragment key={idx}>
+                {node}
+                {idx + 1 < rangeAreas.length ? "/" : ""}
+              </React.Fragment>
+            ))}
+          </InfoItem>
+        )}
+        {isProficient && (
+          <InfoItem label="Proficient:" {...infoItemProps}>
+            Yes
+          </InfoItem>
+        )}
+        {notes && (
+          <InfoItem label="Notes:" {...infoItemProps}>
+            {notes}
+          </InfoItem>
+        )}
+      </div>
+    );
+  };
+
+  const renderProperties = (): React.ReactNode => {
+    const actionTypeId = ActionUtils.getActionTypeId(action);
+    switch (actionTypeId) {
+      case Constants.ActionTypeEnum.SPELL:
+        return renderSpellProperties();
+      case Constants.ActionTypeEnum.WEAPON:
+        return renderWeaponProperties();
+      case Constants.ActionTypeEnum.GENERAL:
+        return renderGeneralProperties();
+      default:
+      // not implemented
+    }
+
+    return null;
+  };
+
+  const renderDescription = (): React.ReactNode => {
+    let description = ActionUtils.getDescription(action);
+    let dataOrigin = ActionUtils.getDataOrigin(action);
+    let dataOriginType = ActionUtils.getDataOriginType(action);
+
+    if (!description) {
+      description = EntityUtils.getPrimaryDescription(dataOrigin);
+    }
+
+    if (dataOriginType === Constants.DataOriginTypeEnum.ITEM) {
+      const itemContract = dataOrigin.primary as BaseInventoryContract;
+      const itemMappingId = ItemUtils.getMappingId(itemContract);
+      const item = HelperUtils.lookupDataOrFallback(
+        inventoryLookup,
+        itemMappingId
+      );
+
+      if (item === null) {
+        return null;
+      }
+
+      let infusion = ItemUtils.getInfusion(item);
+
+      if (
+        infusion &&
+        !AccessUtils.isAccessible(InfusionUtils.getAccessType(infusion))
+      ) {
+        const sources = InfusionUtils.getSources(infusion);
+
+        let sourceNames: Array<string> = [];
+        if (sources.length > 0) {
+          sources.forEach((sourceMapping) => {
+            let source = RuleDataUtils.getSourceDataInfo(
+              sourceMapping.sourceId,
+              ruleData
+            );
+
+            if (source !== null && source.description !== null) {
+              sourceNames.push(source.description);
+            }
+          });
+        }
+
+        const sourceName: string | null =
+          sourceNames.length > 0
+            ? FormatUtils.renderNonOxfordCommaList(sourceNames)
+            : null;
+
+        return (
+          <div className={styles.marketplaceCta}>
+            <MarketplaceCta
+              showImage={false}
+              sourceName={sourceName}
+              description={
+                "To unlock this infusion, check out the Marketplace to view purchase options."
+              }
+            />
+          </div>
+        );
+      }
+    }
+
+    if (!description) {
+      return null;
+    }
+
+    return (
+      <HtmlContent
+        className={styles.description}
+        html={description}
+        withoutTooltips
+      />
+    );
+  };
+
+  return (
+    <div className={styles.details}>
+      {renderLimitedUses()}
+      {renderCustomize()}
+      {renderProperties()}
+      {renderDescription()}
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/components/ClassSpellManager/ClassSpellManager.tsx b/ddb_main/tools/js/Shared/components/ClassSpellManager/ClassSpellManager.tsx
new file mode 100644
index 0000000..ff23de7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ClassSpellManager/ClassSpellManager.tsx
@@ -0,0 +1,403 @@
+import React, { useState } from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+  CollapsibleHeading,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  CharClass,
+  ClassUtils,
+  Constants,
+  DataOriginRefData,
+  EntityValueLookup,
+  Spell,
+} from "@dndbeyond/character-rules-engine/es";
+
+import SpellManager from "../SpellManager";
+
+interface Props {
+  charClass: CharClass;
+  activeSpells: Array<Spell>;
+  isPrepareMaxed: boolean;
+  isCantripsKnownMaxed: boolean;
+  isSpellsKnownMaxed: boolean;
+  hasMultipleSpellClasses: boolean;
+  activeFeatureCantripCount: number;
+  knownFeatureSpellCount: number;
+  knownSpellCount: number;
+  activeCantripsCount: number;
+  preparedSpellCount: number;
+  knownCantripsMax: number | null;
+  knownSpellsMax: number | null;
+  prepareMax: number | null;
+  entityValueLookup: EntityValueLookup;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+interface State {
+  collapsedGroups: {
+    activeSpells: boolean;
+    spellbook: boolean;
+    addSpells: boolean;
+  };
+}
+export default function ClassSpellManager({
+  charClass,
+  activeSpells,
+  isPrepareMaxed,
+  isCantripsKnownMaxed,
+  isSpellsKnownMaxed,
+  activeFeatureCantripCount,
+  knownFeatureSpellCount,
+  knownSpellCount,
+  activeCantripsCount,
+  preparedSpellCount,
+  knownCantripsMax,
+  knownSpellsMax,
+  prepareMax,
+  entityValueLookup,
+  dataOriginRefData,
+  proficiencyBonus,
+  theme,
+  hasMultipleSpellClasses = false,
+}: Props) {
+  const isSpellbookSpellcaster = ClassUtils.isSpellbookSpellcaster(charClass);
+  const isSpellbookEmpty = knownSpellCount === 0 && activeCantripsCount === 0;
+
+  const spellCastingLearningStyle = ClassUtils.getSpellCastingLearningStyle(charClass);
+  const buttonAddText = Constants.SpellCastingLearningStyleAddText[spellCastingLearningStyle];
+  const removeButtonText = Constants.SpellCastingLearningStyleRemoveText[spellCastingLearningStyle];
+  const [state, setState] = useState({
+    collapsedGroups: {
+      activeSpells:
+        hasMultipleSpellClasses || (isSpellbookSpellcaster && isSpellbookEmpty),
+      spellbook:
+        hasMultipleSpellClasses ||
+        !isSpellbookSpellcaster ||
+        (isSpellbookSpellcaster && !isSpellbookEmpty),
+      addSpells: true,
+    },
+  });
+
+  function handleShowSpellGroup(key: keyof State["collapsedGroups"]): void {
+    let resetState = {
+      activeSpells: true,
+      addSpells: true,
+      spellbook: true,
+    };
+    setState({
+      ...state,
+      collapsedGroups: {
+        ...resetState,
+        [key]: !state.collapsedGroups[key],
+      },
+    });
+  }
+
+  function doesAvailableSpellsHaveNotifications(): boolean {
+    if (knownCantripsMax !== null && activeCantripsCount > knownCantripsMax) {
+      return true;
+    }
+
+    if (prepareMax && preparedSpellCount > prepareMax) {
+      return true;
+    }
+
+    if (knownSpellsMax && knownSpellCount > knownSpellsMax) {
+      return true;
+    }
+
+    return false;
+  }
+
+  function renderSpellListSpellStatus(): React.ReactNode {
+    let featureSpellCount: number =
+      activeFeatureCantripCount + knownFeatureSpellCount;
+    let calloutNode: React.ReactNode;
+    if (featureSpellCount > 0) {
+      calloutNode = "*";
+    }
+
+    let cantripsNode: React.ReactNode = "";
+    let cantripsClsNames: Array<string> = [
+      "ct-class-spell-manager__info-entry",
+      "ct-class-spell-manager__info-entry--cantrips",
+    ];
+    if (knownCantripsMax !== null) {
+      if (activeCantripsCount === knownCantripsMax) {
+        cantripsNode = `Cantrips: ${knownCantripsMax}`;
+      } else {
+        cantripsNode = `Cantrips: ${activeCantripsCount}/${knownCantripsMax}`;
+
+        if (activeCantripsCount > knownCantripsMax) {
+          cantripsClsNames.push("ct-class-spell-manager__info-entry--exceeded");
+        }
+      }
+    }
+
+    const spellDisplayListType = spellCastingLearningStyle === Constants.SpellCastingLearningStyle.Prepared
+      ? "Prepared"
+      : "Known";
+    let spellsNode: React.ReactNode;
+    let spellsExtraNode: React.ReactNode;
+    let spellsClsNames: Array<string> = [
+      "ct-class-spell-manager__info-entry",
+      "ct-class-spell-manager__info-entry--spells",
+    ];
+    if (prepareMax) {
+      if (preparedSpellCount === prepareMax) {
+        spellsNode = `Prepared Spells: ${preparedSpellCount}`;
+      } else {
+        spellsNode = `Prepared Spells: ${preparedSpellCount}/${prepareMax}`;
+
+        if (preparedSpellCount > prepareMax) {
+          spellsClsNames.push("ct-class-spell-manager__info-entry--exceeded");
+        }
+      }
+
+      spellsExtraNode = (
+        <span className="ct-class-spell-manager__info-entry-extra">
+          ({knownSpellCount} Known)
+        </span>
+      );
+    } else if (knownSpellsMax) {
+      if (knownSpellCount === knownSpellsMax) {
+        spellsNode = `${spellDisplayListType} Spells: ${knownSpellCount}`;
+      } else {
+        spellsNode = `${spellDisplayListType} Spells: ${knownSpellCount}/${knownSpellsMax}`;
+
+        if (knownSpellCount > knownSpellsMax) {
+          spellsClsNames.push("ct-class-spell-manager__info-entry--exceeded");
+        }
+      }
+    }
+
+    return (
+      <div className="ct-class-spell-manager__info">
+        <div className={cantripsClsNames.join(" ")}>
+          {cantripsNode}
+          {calloutNode}
+        </div>
+        <div className={spellsClsNames.join(" ")}>
+          {spellsNode}
+          {spellsExtraNode}
+          {calloutNode}
+        </div>
+        {featureSpellCount > 0 && (
+          <div className="ct-class-spell-manager__info-features">
+            *{featureSpellCount} spell
+            {featureSpellCount !== 1 ? "s" : ""} included from class features.
+          </div>
+        )}
+      </div>
+    );
+  }
+
+  function renderEmptyActiveSpells(): React.ReactNode {
+    return (
+      <div className="ct-class-spell-manager__empty">
+        {ClassUtils.isSpellbookSpellcaster(charClass) && (
+          <React.Fragment>
+            You currently have no prepared spells.
+          </React.Fragment>
+        )}
+        {ClassUtils.isPreparedSpellcaster(charClass) && (
+          <React.Fragment>
+            You currently have no prepared spells. Learn and prepare spells from
+            your list of available spells below.
+          </React.Fragment>
+        )}
+        {ClassUtils.isKnownSpellcaster(charClass) && (
+          <React.Fragment>
+            You currently have no known spells. Learn spells from your list of
+            available spells below.
+          </React.Fragment>
+        )}
+      </div>
+    );
+  }
+
+  function renderActiveSpells(): React.ReactNode {
+    return (
+      <div className="ct-class-spell-manager__active">
+        <SpellManager
+          charClassId={ClassUtils.getActiveId(charClass)}
+          characterClassId={ClassUtils.getMappingId(charClass)}
+          theme={theme}
+          isPrepareMaxed={isPrepareMaxed}
+          isCantripsKnownMaxed={isCantripsKnownMaxed}
+          isSpellsKnownMaxed={isSpellsKnownMaxed}
+          hasActiveSpells
+          enableSpellRemove={!ClassUtils.isSpellbookSpellcaster(charClass)}
+          enablePrepare={false}
+          enableUnprepare={true}
+          showFilters={false}
+          addButtonText={buttonAddText}
+          buttonActiveStyle="outline"
+          buttonUnprepareText={removeButtonText}
+          entityValueLookup={entityValueLookup}
+          dataOriginRefData={dataOriginRefData}
+          showCustomize={false}
+          proficiencyBonus={proficiencyBonus}
+        />
+      </div>
+    );
+  }
+
+  function renderActiveSpellsGroup(): React.ReactNode {
+    const { collapsedGroups } = state;
+
+    let heading: React.ReactNode = "Prepared Spells";
+    if (ClassUtils.isKnownSpellcaster(charClass) && spellCastingLearningStyle !== Constants.SpellCastingLearningStyle.Prepared) {
+      heading = "Known Spells";
+    }
+
+    let headingNode: React.ReactNode = (
+      <CollapsibleHeading>
+        {heading}
+        <span className="ct-class-spell-manager__heading-extra">
+          ({activeSpells.length})
+        </span>
+      </CollapsibleHeading>
+    );
+
+    let headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent heading={headingNode} />
+    );
+
+    return (
+      <Collapsible
+        collapsed={collapsedGroups.activeSpells}
+        header={headerNode}
+        onChangeHandler={handleShowSpellGroup.bind(this, "activeSpells")}
+        className="ct-class-spell-manager__group"
+      >
+        {activeSpells.length > 0
+          ? renderActiveSpells()
+          : renderEmptyActiveSpells()}
+      </Collapsible>
+    );
+  }
+
+  function renderSpellbook(): React.ReactNode {
+    const { collapsedGroups } = state;
+
+    if (!ClassUtils.isSpellbookSpellcaster(charClass)) {
+      return null;
+    }
+
+    let headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent heading="Spellbook" />
+    );
+
+    return (
+      <Collapsible
+        collapsed={collapsedGroups.spellbook}
+        header={headerNode}
+        onChangeHandler={handleShowSpellGroup.bind(this, "spellbook")}
+        className="ct-class-spell-manager__group"
+      >
+        {isSpellbookEmpty && (
+          <div className="ct-class-spell-manager__empty">
+            You currently have no known spells. Learn spells from your list of
+            available spells below.
+          </div>
+        )}
+        {!isSpellbookEmpty && (
+          <React.Fragment>
+            {renderSpellListSpellStatus()}
+            <SpellManager
+              charClassId={ClassUtils.getActiveId(charClass)}
+              characterClassId={ClassUtils.getMappingId(charClass)}
+              theme={theme}
+              isPrepareMaxed={isPrepareMaxed}
+              isCantripsKnownMaxed={isCantripsKnownMaxed}
+              isSpellsKnownMaxed={isSpellsKnownMaxed}
+              enableAdd={false}
+              enableSpellRemove={false}
+              addButtonText={buttonAddText}
+              buttonUnprepareText={removeButtonText}
+              entityValueLookup={entityValueLookup}
+              dataOriginRefData={dataOriginRefData}
+              showCustomize={false}
+              proficiencyBonus={proficiencyBonus}
+            />
+          </React.Fragment>
+        )}
+      </Collapsible>
+    );
+  }
+
+  function renderAddSpells(): React.ReactNode {
+    const { collapsedGroups } = state;
+
+    let heading: React.ReactNode = "Add Spells";
+    if (ClassUtils.isPreparedSpellcaster(charClass)) {
+      heading = "Known Spells";
+    }
+
+    let headingNode: React.ReactNode = (
+      <CollapsibleHeading>
+        {heading}
+        {doesAvailableSpellsHaveNotifications() && (
+          <div className="ct-class-spell-manager__notification">!</div>
+        )}
+      </CollapsibleHeading>
+    );
+
+    let headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent heading={headingNode} />
+    );
+
+    return (
+      <Collapsible
+        collapsed={collapsedGroups.addSpells}
+        header={headerNode}
+        onChangeHandler={handleShowSpellGroup.bind(this, "addSpells")}
+        className="ct-class-spell-manager__group"
+      >
+        {renderSpellListSpellStatus()}
+        <SpellManager
+          charClassId={ClassUtils.getActiveId(charClass)}
+          characterClassId={ClassUtils.getMappingId(charClass)}
+          theme={theme}
+          isPrepareMaxed={isPrepareMaxed}
+          isCantripsKnownMaxed={isCantripsKnownMaxed}
+          isSpellsKnownMaxed={isSpellsKnownMaxed}
+          shouldFetch
+          enablePrepare={!ClassUtils.isSpellbookSpellcaster(charClass)}
+          enableUnprepare={!ClassUtils.isSpellbookSpellcaster(charClass)}
+          buttonUnprepareText={removeButtonText}
+          addButtonText={buttonAddText}
+          entityValueLookup={entityValueLookup}
+          dataOriginRefData={dataOriginRefData}
+          showExpandedType={true}
+          showCustomize={false}
+          proficiencyBonus={proficiencyBonus}
+        />
+      </Collapsible>
+    );
+  }
+  return (
+    <div className="ct-class-spell-manager">
+      <div className="ct-class-spell-manager__header">
+        <div className="ct-class-spell-manager__portrait">
+          <img
+            className="ct-class-spell-manager__portrait-img"
+            src={ClassUtils.getPortraitUrl(charClass)}
+            alt=""
+          />
+        </div>
+        <div className="ct-class-spell-manager__heading">
+          {ClassUtils.getName(charClass)}
+        </div>
+      </div>
+      {renderAddSpells()}
+      {renderActiveSpellsGroup()}
+      {renderSpellbook()}
+    </div>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/components/ClassSpellManager/index.ts b/ddb_main/tools/js/Shared/components/ClassSpellManager/index.ts
new file mode 100644
index 0000000..0f7cbdd
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ClassSpellManager/index.ts
@@ -0,0 +1,4 @@
+import ClassSpellManager from "./ClassSpellManager";
+
+export default ClassSpellManager;
+export { ClassSpellManager };
diff --git a/ddb_main/tools/js/Shared/components/ConditionLevelsTable/ConditionLevelsTable.tsx b/ddb_main/tools/js/Shared/components/ConditionLevelsTable/ConditionLevelsTable.tsx
new file mode 100644
index 0000000..f1aad79
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ConditionLevelsTable/ConditionLevelsTable.tsx
@@ -0,0 +1,126 @@
+import * as React from "react";
+
+import { ConditionLevelEffectLookup } from "@dndbeyond/character-rules-engine/es";
+
+import SlotManager from "../SlotManager";
+import { ThemeButton } from "../common/Button";
+
+interface Props {
+  conditionName: string;
+  levels: Array<number>;
+  levelEffectLookup: ConditionLevelEffectLookup | null;
+  levelOverrides: Record<number, string>;
+  activeLevel: number | null;
+  isInteractive: boolean;
+  onLevelChange: (value: number | null) => void;
+}
+export default class ConditionLevelsTable extends React.PureComponent<Props> {
+  static defaultProps = {
+    activeLevel: null,
+    isInteractive: false,
+    onLevelChange: null,
+    levelOverrides: {},
+    levelEffectLookup: null,
+  };
+
+  handleLevelChange = (level: number | null, used: number): void => {
+    const { onLevelChange, activeLevel } = this.props;
+
+    let value: number | null = level;
+    if (level !== null && activeLevel === level) {
+      value = level > 1 ? level - 1 : null;
+    }
+
+    if (onLevelChange) {
+      onLevelChange(value);
+    }
+  };
+
+  renderEffect = (level: number): string => {
+    const { levelEffectLookup, levelOverrides } = this.props;
+
+    if (levelOverrides.hasOwnProperty(level)) {
+      return levelOverrides[level];
+    }
+
+    let effect: string = "";
+    if (levelEffectLookup !== null && levelEffectLookup.hasOwnProperty(level)) {
+      effect = levelEffectLookup[level];
+    }
+
+    return effect;
+  };
+
+  render() {
+    const { conditionName, levels, activeLevel, isInteractive } = this.props;
+
+    return (
+      <div className="ct-condition-levels-table">
+        <table className="ct-condition-levels-table__table">
+          <thead>
+            <tr>
+              <th>Applied</th>
+              <th>Level</th>
+              <th>Effect</th>
+            </tr>
+          </thead>
+          <tbody>
+            {levels.map((level, idx) => {
+              let isActive: boolean = level === activeLevel;
+              let isImplied: boolean =
+                activeLevel !== null && level < activeLevel;
+
+              let classNames: Array<string> = [
+                "ct-condition-levels-table__table-slot",
+              ];
+              if (isActive) {
+                classNames.push(
+                  "ct-condition-levels-table__table-slot--active"
+                );
+              }
+              if (isImplied) {
+                classNames.push(
+                  "ct-condition-levels-table__table-slot--implied"
+                );
+              }
+              if (isInteractive) {
+                classNames.push(
+                  "ct-condition-levels-table__table-slot--interactive"
+                );
+              }
+
+              return (
+                <tr key={`${level}-${idx}`}>
+                  <td className={classNames.join(" ")}>
+                    <SlotManager
+                      size="small"
+                      available={1}
+                      onSet={this.handleLevelChange.bind(this, level)}
+                      isInteractive={isInteractive}
+                      used={isActive || isImplied ? 1 : 0}
+                    />
+                  </td>
+                  <td>{level}</td>
+                  <td className="left-align">{this.renderEffect(level)}</td>
+                </tr>
+              );
+            })}
+          </tbody>
+        </table>
+        {isInteractive && activeLevel !== null && (
+          <div className="ct-condition-levels-table__actions">
+            <div className="ct-condition-levels-table__actions-action">
+              <ThemeButton
+                size="small"
+                style="outline"
+                onClick={this.handleLevelChange.bind(this, null)}
+              >
+                Remove All {conditionName}
+              </ThemeButton>
+            </div>
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ConditionLevelsTable/index.ts b/ddb_main/tools/js/Shared/components/ConditionLevelsTable/index.ts
new file mode 100644
index 0000000..e354a14
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ConditionLevelsTable/index.ts
@@ -0,0 +1,4 @@
+import ConditionLevelsTable from "./ConditionLevelsTable";
+
+export default ConditionLevelsTable;
+export { ConditionLevelsTable };
diff --git a/ddb_main/tools/js/Shared/components/ContainerActions/ContainerActions.tsx b/ddb_main/tools/js/Shared/components/ContainerActions/ContainerActions.tsx
new file mode 100644
index 0000000..3e62baa
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ContainerActions/ContainerActions.tsx
@@ -0,0 +1,244 @@
+import React, { useContext } from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+  CollapsibleHeading,
+} from "@dndbeyond/character-components/es";
+import {
+  CampaignUtils,
+  CharacterTheme,
+  Container,
+  ContainerUtils,
+  InventoryManager,
+  CharacterCurrencyContract,
+  Item,
+  ItemUtils,
+  PartyInfo,
+  RuleData,
+  CoinManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemName } from "~/components/ItemName";
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+import CurrencyCollapsible from "../../../CharacterSheet/components/CurrencyCollapsible";
+import { CurrencyErrorTypeEnum } from "../../containers/panes/CurrencyPane/CurrencyPaneConstants";
+import { CoinManagerContext } from "../../managers/CoinManagerContext";
+import { InventoryManagerContext } from "../../managers/InventoryManagerContext";
+import { CustomItemCreator } from "../CustomItemCreator";
+import EquipmentShop from "../EquipmentShop";
+import ItemDetail from "../ItemDetail";
+import { ItemSlotManager } from "../ItemSlotManager";
+import { ThemeButtonWithMenu } from "../common/Button";
+
+interface Props {
+  currentContainer: Container;
+  theme: CharacterTheme;
+  onItemMove?: (item: Item, containerDefinitionKey: string) => void;
+  onItemEquip?: (item: Item, uses: number) => void;
+  ruleData: RuleData;
+  proficiencyBonus: number;
+  inventory: Array<Item>;
+  containers: Array<Container>;
+  shopOpenInitially?: boolean;
+  isReadonly: boolean;
+  partyInfo: PartyInfo | null;
+  inventoryManager: InventoryManager;
+  coinManager: CoinManager;
+  handleCurrencyChangeError: (
+    currencyName: string,
+    errorType: CurrencyErrorTypeEnum
+  ) => void;
+  handleCurrencyAdjust: (
+    coin: Partial<CharacterCurrencyContract>,
+    multiplier: 1 | -1,
+    containerDefinitionKey: string
+  ) => void;
+  handleAmountSet: (
+    containerDefinitionKey: string,
+    key: keyof CharacterCurrencyContract,
+    amount: number
+  ) => void;
+}
+
+export const ContainerActionsComponent: React.FC<Props> = ({
+  currentContainer,
+  theme,
+  ruleData,
+  onItemMove,
+  onItemEquip,
+  proficiencyBonus,
+  inventory,
+  containers,
+  shopOpenInitially = false,
+  isReadonly,
+  partyInfo,
+  inventoryManager,
+  coinManager,
+  handleCurrencyAdjust,
+  handleAmountSet,
+  handleCurrencyChangeError,
+}) => {
+  let showEquipmentShop = true;
+  if (
+    ContainerUtils.isShared(currentContainer) &&
+    partyInfo &&
+    CampaignUtils.isSharingStateInactive(
+      CampaignUtils.getSharingState(partyInfo)
+    )
+  ) {
+    showEquipmentShop = false;
+  }
+
+  let headerNode: React.ReactNode = (
+    <CollapsibleHeaderContent
+      heading={
+        <CollapsibleHeading>{`Contents (${inventory.length})`}</CollapsibleHeading>
+      }
+      callout={
+        <div className="ct-equipment-manage-pane__callout">
+          <NumberDisplay
+            type="weightInLb"
+            number={ContainerUtils.getWeightInfo(currentContainer).total}
+          />
+        </div>
+      }
+    />
+  );
+
+  return (
+    <div className="ct-container-manager">
+      {showEquipmentShop && (
+        <Collapsible
+          header="Add Items"
+          initiallyCollapsed={!shopOpenInitially}
+          overrideCollapsed={!shopOpenInitially}
+        >
+          <EquipmentShop
+            limitAddToCurrentContainer={currentContainer}
+            partyInfo={partyInfo}
+            containers={containers}
+            theme={theme}
+            ruleData={ruleData}
+            proficiencyBonus={proficiencyBonus}
+          />
+          <CustomItemCreator containers={[currentContainer]} />
+        </Collapsible>
+      )}
+      {coinManager.canUseCointainers() && (
+        <CurrencyCollapsible
+          heading={`${ContainerUtils.getName(currentContainer)} Coin`}
+          initiallyCollapsed={true}
+          isReadonly={isReadonly}
+          container={currentContainer}
+          handleCurrencyChangeError={handleCurrencyChangeError}
+          handleCurrencyAdjust={handleCurrencyAdjust}
+          handleAmountSet={handleAmountSet}
+        />
+      )}
+      <Collapsible
+        header={headerNode}
+        initiallyCollapsed={shopOpenInitially}
+        overrideCollapsed={shopOpenInitially}
+      >
+        <div className="ct-container-manager__inventory">
+          {inventory.map((item, idx) => {
+            const canEquip = inventoryManager.canEquipUnequipItem(item);
+            const key = ItemUtils.getUniqueKey(item);
+
+            return (
+              <Collapsible
+                key={`${key}-${idx}`}
+                className="ct-container-manager__item"
+                layoutType={"minimal"}
+                header={
+                  <CollapsibleHeaderContent
+                    heading={
+                      <div className="ct-container-manager__item-header">
+                        <div className="ct-container-manager__item-header-action">
+                          <ItemSlotManager
+                            isUsed={!!ItemUtils.isEquipped(item)}
+                            isReadonly={isReadonly}
+                            canUse={canEquip}
+                            onSet={(uses) => {
+                              if (onItemEquip) {
+                                onItemEquip(item, uses);
+                              }
+                            }}
+                            theme={theme}
+                            useTooltip={false}
+                          />
+                        </div>
+                        <div className="ct-container-manager__item-header-name">
+                          <ItemName item={item} showLegacy={true} />
+                        </div>
+                      </div>
+                    }
+                    callout={
+                      !isReadonly &&
+                      partyInfo &&
+                      inventoryManager.canMoveItem(item) ? (
+                        <ThemeButtonWithMenu
+                          showSingleOption={true}
+                          containerEl={
+                            document.querySelector(
+                              ".ct-sidebar__portal"
+                            ) as HTMLElement
+                          }
+                          groupedOptions={ContainerUtils.getGroupedOptions(
+                            ItemUtils.getContainerDefinitionKey(item),
+                            containers,
+                            "Move To:",
+                            CampaignUtils.getSharingState(partyInfo)
+                          )}
+                          buttonStyle="outline"
+                          onSelect={(definitionKey) => {
+                            if (onItemMove) {
+                              onItemMove(item, definitionKey);
+                            }
+                          }}
+                        >
+                          Move
+                        </ThemeButtonWithMenu>
+                      ) : null
+                    }
+                  />
+                }
+              >
+                <ItemDetail
+                  theme={theme}
+                  item={item}
+                  ruleData={ruleData}
+                  showCustomize={false}
+                  showImage={false}
+                  proficiencyBonus={proficiencyBonus}
+                />
+              </Collapsible>
+            );
+          })}
+          {ContainerUtils.getItemMappingIds(currentContainer).length === 0 && (
+            <div className="ct-container-manager__empty">
+              There are no items in your{" "}
+              {ContainerUtils.getName(currentContainer)}
+            </div>
+          )}
+        </div>
+      </Collapsible>
+    </div>
+  );
+};
+
+export const ContainerActions = (props) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const { coinManager } = useContext(CoinManagerContext);
+  return (
+    <ContainerActionsComponent
+      inventoryManager={inventoryManager}
+      coinManager={coinManager}
+      {...props}
+    />
+  );
+};
+
+export default ContainerActions;
diff --git a/ddb_main/tools/js/Shared/components/ContainerActions/index.ts b/ddb_main/tools/js/Shared/components/ContainerActions/index.ts
new file mode 100644
index 0000000..6f03e77
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ContainerActions/index.ts
@@ -0,0 +1,3 @@
+import { ContainerActions } from "./ContainerActions";
+
+export default ContainerActions;
diff --git a/ddb_main/tools/js/Shared/components/CtaPreferenceManager/CtaPreferenceManager.tsx b/ddb_main/tools/js/Shared/components/CtaPreferenceManager/CtaPreferenceManager.tsx
new file mode 100644
index 0000000..275963f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/CtaPreferenceManager/CtaPreferenceManager.tsx
@@ -0,0 +1,131 @@
+import React from "react";
+
+import { LightLinkOutSvg } from "@dndbeyond/character-components/es";
+
+export enum CtaBannerOptions {
+  NEW = "New",
+  BETA = "Beta",
+  ALPHA = "Alpha",
+}
+
+interface Props {
+  preferenceEnabled: boolean;
+  className: string;
+  onPreferenceClick: () => void;
+  preferenceTitle: string;
+  linkHref?: string;
+  linkTitle?: string;
+  icon?: React.ReactNode;
+  borderColor?: string;
+  switchColor?: string;
+  backgroundImageUrl?: string;
+  bannerTitle?: CtaBannerOptions;
+}
+export default class CtaPreferenceManager extends React.PureComponent<
+  Props,
+  {}
+> {
+  static defaultProps = {
+    className: "",
+  };
+
+  handlePreferenceToggle = (evt: React.MouseEvent): void => {
+    const { onPreferenceClick } = this.props;
+
+    evt.nativeEvent.stopImmediatePropagation();
+    evt.stopPropagation();
+
+    onPreferenceClick();
+  };
+
+  handlePreferenceSwitch = (evt: React.MouseEvent): void => {
+    evt.nativeEvent.stopImmediatePropagation();
+    evt.stopPropagation();
+    //Needed to prevent the label from triggering the input onClick handler
+    //https://stackoverflow.com/questions/24501497/why-the-onclick-element-will-trigger-twice-for-label-element
+  };
+
+  render() {
+    const {
+      preferenceEnabled,
+      className,
+      linkHref,
+      linkTitle,
+      icon,
+      borderColor,
+      switchColor,
+      backgroundImageUrl,
+      bannerTitle,
+      preferenceTitle,
+    } = this.props;
+
+    const classNames: Array<string> = [className, "ct-cta-preference-manager"];
+
+    return (
+      <div
+        className={classNames.join(" ")}
+        style={borderColor ? { borderColor } : undefined}
+      >
+        <div
+          className="ct-cta-preference-manager__primary"
+          onClick={this.handlePreferenceToggle}
+          style={
+            backgroundImageUrl
+              ? { backgroundImage: `url(${backgroundImageUrl})` }
+              : undefined
+          }
+        >
+          <div className="ct-cta-preference-manager__primary-info">
+            {bannerTitle && (
+              <div className="ct-cta-preference-manager__primary-info-banner">
+                {bannerTitle}
+              </div>
+            )}
+            <div className="ct-cta-preference-manager__primary-info-title">
+              {icon && (
+                <div className="ct-cta-preference-manager__primary-info-icon">
+                  {icon}
+                </div>
+              )}
+              <div className="ct-cta-preference-manager__primary-info-label">
+                {preferenceTitle}
+              </div>
+            </div>
+          </div>
+          <label className="ct-cta-preference-manager__switch">
+            <input
+              className="ct-cta-preference-manager__switch-input"
+              type="checkbox"
+              checked={preferenceEnabled}
+              onClick={this.handlePreferenceSwitch}
+              onChange={() => {}}
+            />
+            <span
+              style={
+                preferenceEnabled && switchColor
+                  ? { backgroundColor: switchColor }
+                  : undefined
+              }
+              className="ct-cta-preference-manager__switch-slider"
+            >
+              {" "}
+            </span>
+          </label>
+        </div>
+        {linkHref && (
+          <a
+            className="ct-cta-preference-manager__link-out"
+            href={linkHref}
+            rel="noopener noreferrer"
+            target="_blank"
+          >
+            <span className="ct-cta-preference-manager__link-out-label">
+              {linkTitle ? linkTitle : "Feedback Forum"}
+            </span>
+            <LightLinkOutSvg />
+          </a>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/CtaPreferenceManager/index.ts b/ddb_main/tools/js/Shared/components/CtaPreferenceManager/index.ts
new file mode 100644
index 0000000..cb43120
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/CtaPreferenceManager/index.ts
@@ -0,0 +1,5 @@
+import CtaPreferenceManager, { CtaBannerOptions } from "./CtaPreferenceManager";
+
+export default CtaPreferenceManager;
+
+export { CtaPreferenceManager, CtaBannerOptions };
diff --git a/ddb_main/tools/js/Shared/components/CustomItemCreator/CustomItemCreator.tsx b/ddb_main/tools/js/Shared/components/CustomItemCreator/CustomItemCreator.tsx
new file mode 100644
index 0000000..694857b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/CustomItemCreator/CustomItemCreator.tsx
@@ -0,0 +1,105 @@
+import React, { useCallback, useContext, useState } from "react";
+
+import { Collapsible } from "@dndbeyond/character-components/es";
+import {
+  Container,
+  ContainerUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { InventoryManagerContext } from "../../managers/InventoryManagerContext";
+import { AppNotificationUtils } from "../../utils";
+import CustomizeDataEditor from "../CustomizeDataEditor";
+import EditorBox from "../EditorBox";
+import SimpleQuantity from "../SimpleQuantity";
+import { ThemeButtonWithMenu } from "../common/Button";
+
+interface Props {
+  containers: Array<Container>;
+}
+
+export const CustomItemCreator: React.FC<Props> = ({ containers }) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+
+  const getInitialCustomItemState = () => ({
+    cost: null,
+    description: null,
+    name: inventoryManager.getDefaultCustomItemName(),
+    notes: null,
+    weight: null,
+    quantity: 1,
+  });
+
+  const [customItem, setCustomItemProps] = useState(
+    getInitialCustomItemState()
+  );
+
+  const handleOnSelectSuccess = useCallback(() => {
+    AppNotificationUtils.dispatchSuccess(
+      "Custom Item Added",
+      `Added ${customItem.name}`
+    );
+    setCustomItemProps(getInitialCustomItemState());
+  }, [getInitialCustomItemState, customItem]);
+
+  return (
+    <Collapsible
+      className="ct-equipment-manage-pane__custom"
+      layoutType="minimal"
+      header={"Add Custom Item"}
+    >
+      <EditorBox>
+        <CustomizeDataEditor
+          data={customItem}
+          enableName={true}
+          enableNotes={true}
+          enableDescription={true}
+          enableCost={true}
+          enableWeight={true}
+          maxNameLength={128}
+          onDataUpdate={(data) => {
+            setCustomItemProps({
+              ...customItem,
+              ...data,
+            });
+          }}
+        />
+        <div className="ct-custom-item-creator__actions">
+          <div className="ct-custom-item-creator__action ct-custom-item-creator__action--amount">
+            <SimpleQuantity
+              quantity={customItem.quantity ?? 1}
+              onUpdate={(quantity) => {
+                setCustomItemProps({
+                  ...customItem,
+                  quantity,
+                });
+              }}
+            />
+          </div>
+          <div className="ct-custom-item-creator__action">
+            <ThemeButtonWithMenu
+              onSelect={(containerDefinitionKey) =>
+                inventoryManager.handleCustomAdd(
+                  { customItem, containerDefinitionKey },
+                  handleOnSelectSuccess
+                )
+              }
+              groupedOptions={ContainerUtils.getGroupedOptions(
+                null,
+                containers,
+                "Add To:",
+                inventoryManager.getSharingState()
+              )}
+            >
+              Add{" "}
+              {customItem.quantity === 1
+                ? " Item"
+                : ` ${customItem.quantity} Items`}
+            </ThemeButtonWithMenu>
+          </div>
+        </div>
+      </EditorBox>
+    </Collapsible>
+  );
+};
+
+export default CustomItemCreator;
diff --git a/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditor.tsx b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditor.tsx
new file mode 100644
index 0000000..15f2abe
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditor.tsx
@@ -0,0 +1,977 @@
+/**
+ * NOTE: This file is meant to be removed over time.  This is an older editor that is still used,
+ * but will be phased out eventually.
+ */
+import React from "react";
+
+import { Checkbox, Select } from "@dndbeyond/character-components/es";
+import {
+  HelperUtils,
+  HtmlSelectOption,
+} from "@dndbeyond/character-rules-engine/es";
+
+import CustomizeDataEditorProperty from "./CustomizeDataEditorProperty";
+import CustomizeDataEditorPropertyLabel from "./CustomizeDataEditorPropertyLabel";
+import CustomizeDataEditorPropertyValue from "./CustomizeDataEditorPropertyValue";
+
+const CUSTOMIZE_KEY = {
+  ABILITY_MODIFIER_STAT: "abilityModifierStatId",
+  ATTACK_SUBTYPE: "attackSubtype",
+  ACTIVATION_TYPE: "activationType",
+  ACTIVATION_TIME: "activationTime",
+  AOE_SIZE: "aoeSize",
+  AOE_TYPE: "aoeType",
+  COST: "cost",
+  DAMAGE_BONUS: "damageBonus",
+  DAMAGE_TYPE: "damageTypeId",
+  DESCRIPTION: "description",
+  DICE_COUNT: "diceCount",
+  DICE_TYPE: "diceType",
+  DISPLAY_AS_ATTACK: "displayAsAttack",
+  FIXED_VALUE: "fixedValue",
+  IS_ADAMANTINE: "isAdamantine",
+  IS_OFFHAND: "isOffhand",
+  IS_PROFICIENT: "isProficient",
+  IS_SILVER: "isSilvered",
+  IS_MARTIAL_ARTS: "isMartialArts",
+  LONG_RANGE: "longRange",
+  MAGIC_BONUS: "magicBonus",
+  MISC_BONUS: "miscBonus",
+  NAME: "name",
+  NOTES: "notes",
+  OVERRIDE: "override",
+  PROFICIENCY_LEVEL: "proficiencyLevel",
+  RANGE: "range",
+  RANGE_TYPE: "rangeId",
+  SAVE_DC_BONUS: "saveDcBonus",
+  SAVE_DC: "fixedSaveDc",
+  SAVE_TYPE: "saveStatId",
+  SNIPPET: "snippet",
+  SPELL_RANGE_TYPE: "spellRangeType",
+  STAT: "statId",
+  TO_HIT_BONUS: "toHitBonus",
+  TO_HIT: "toHit",
+  WEIGHT: "weight",
+};
+
+interface SelectEditorProps {
+  label: string;
+  propertyKey: string;
+  defaultValue: number | null;
+  options: Array<any>;
+  onUpdate: (propertyKey: string, value: number | null) => void;
+  isEnabled: boolean;
+}
+interface SelectEditorState {
+  value: number | null;
+}
+class SelectEditor extends React.PureComponent<
+  SelectEditorProps,
+  SelectEditorState
+> {
+  static defaultProps = {
+    options: [],
+  };
+
+  constructor(props: SelectEditorProps) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue,
+    };
+  }
+
+  handleChange = (value: string): void => {
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      let parsedValue = HelperUtils.parseInputInt(value);
+      onUpdate(propertyKey, parsedValue);
+      this.setState({
+        value: parsedValue,
+      });
+    }
+  };
+
+  render() {
+    const { value } = this.state;
+    const { propertyKey, label, options, isEnabled } = this.props;
+
+    if (!isEnabled) {
+      return null;
+    }
+
+    return (
+      <CustomizeDataEditorProperty propertyKey={propertyKey}>
+        <CustomizeDataEditorPropertyValue>
+          <Select
+            placeholder="--"
+            options={options}
+            value={value}
+            onChange={this.handleChange}
+          />
+        </CustomizeDataEditorPropertyValue>
+        <CustomizeDataEditorPropertyLabel>
+          {label}
+        </CustomizeDataEditorPropertyLabel>
+      </CustomizeDataEditorProperty>
+    );
+  }
+}
+
+interface CheckboxEditorProps {
+  label: string;
+  propertyKey: string;
+  initiallyEnabled: boolean;
+  onUpdate: (propertyKey: string, value: boolean) => void;
+  isEnabled: boolean;
+}
+class CheckboxEditor extends React.PureComponent<CheckboxEditorProps> {
+  handleChange = (isEnabled: boolean): void => {
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, isEnabled);
+    }
+  };
+
+  render() {
+    const { propertyKey, label, initiallyEnabled, isEnabled } = this.props;
+
+    if (!isEnabled) {
+      return null;
+    }
+
+    return (
+      <CustomizeDataEditorProperty propertyKey={propertyKey}>
+        <CustomizeDataEditorPropertyValue>
+          <Checkbox
+            label={label}
+            initiallyEnabled={initiallyEnabled}
+            enabled={initiallyEnabled}
+            onChange={this.handleChange}
+          />
+        </CustomizeDataEditorPropertyValue>
+      </CustomizeDataEditorProperty>
+    );
+  }
+}
+
+interface NumberEditorProps {
+  label: string;
+  propertyKey: string;
+  defaultValue: number | null;
+  minimumValue: number | null;
+  maximumValue: number | null;
+  onUpdate: (propertyKey: string, value: number | null) => void;
+  isEnabled: boolean;
+}
+interface NumberEditorState {
+  value: number | null;
+}
+class NumberEditor extends React.PureComponent<
+  NumberEditorProps,
+  NumberEditorState
+> {
+  static defaultProps = {
+    minimumValue: null,
+    maximumValue: null,
+  };
+
+  constructor(props: NumberEditorProps) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<NumberEditorProps>,
+    prevState: Readonly<NumberEditorState>
+  ): void {
+    const { defaultValue } = this.props;
+
+    if (defaultValue !== prevProps.defaultValue) {
+      this.setState({
+        value: defaultValue,
+      });
+    }
+  }
+
+  handleBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { propertyKey, onUpdate, minimumValue, maximumValue } = this.props;
+
+    let parsedValue = HelperUtils.parseInputInt(evt.target.value);
+    let newValue: number | null =
+      parsedValue === null
+        ? null
+        : HelperUtils.clampInt(parsedValue, minimumValue, maximumValue);
+    if (onUpdate) {
+      onUpdate(propertyKey, newValue);
+    }
+    this.setState({
+      value: newValue,
+    });
+  };
+
+  handleChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    this.setState({
+      value: HelperUtils.parseInputInt(evt.target.value),
+    });
+  };
+
+  render() {
+    const { value } = this.state;
+    const { propertyKey, label, minimumValue, maximumValue, isEnabled } =
+      this.props;
+
+    if (!isEnabled) {
+      return null;
+    }
+
+    return (
+      <CustomizeDataEditorProperty propertyKey={propertyKey}>
+        <CustomizeDataEditorPropertyValue>
+          <input
+            type="number"
+            min={minimumValue ?? ""}
+            max={maximumValue ?? ""}
+            value={value ?? ""}
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+          />
+        </CustomizeDataEditorPropertyValue>
+        <CustomizeDataEditorPropertyLabel>
+          {label}
+        </CustomizeDataEditorPropertyLabel>
+      </CustomizeDataEditorProperty>
+    );
+  }
+}
+
+interface TextAreaEditorProps {
+  label: string;
+  propertyKey: string;
+  defaultValue: string | null;
+  onUpdate: (propertyKey: string, value: string | null) => void;
+  isEnabled: boolean;
+}
+interface TextAreaEditorState {
+  value: string;
+}
+class TextAreaEditor extends React.PureComponent<
+  TextAreaEditorProps,
+  TextAreaEditorState
+> {
+  constructor(props: TextEditorProps) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue ?? "",
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<TextAreaEditorProps>,
+    prevState: Readonly<TextAreaEditorState>
+  ): void {
+    const { defaultValue } = this.props;
+
+    if (defaultValue !== prevProps.defaultValue) {
+      this.setState({
+        value: defaultValue ?? "",
+      });
+    }
+  }
+
+  handleBlur = (evt: React.FocusEvent<HTMLTextAreaElement>): void => {
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, evt.target.value);
+    }
+  };
+
+  handleChange = (evt: React.FocusEvent<HTMLTextAreaElement>): void => {
+    const { value } = this.state;
+
+    if (value !== evt.target.value) {
+      this.setState({
+        value: evt.target.value,
+      });
+    }
+  };
+
+  render() {
+    const { propertyKey, label, isEnabled } = this.props;
+    const { value } = this.state;
+
+    if (!isEnabled) {
+      return null;
+    }
+
+    return (
+      <CustomizeDataEditorProperty propertyKey={propertyKey} isBlock={true}>
+        <CustomizeDataEditorPropertyValue>
+          <textarea
+            value={value}
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+          />
+        </CustomizeDataEditorPropertyValue>
+        <CustomizeDataEditorPropertyLabel>
+          {label}
+        </CustomizeDataEditorPropertyLabel>
+      </CustomizeDataEditorProperty>
+    );
+  }
+}
+
+interface TextEditorProps {
+  label: string;
+  propertyKey: string;
+  defaultValue: string | null;
+  onUpdate: (propertyKey: string, value: string | null) => void;
+  isEnabled: boolean;
+  maxLength: number | null;
+  initialFocus?: boolean;
+}
+interface TextAreaState {
+  value: string | null;
+}
+class TextEditor extends React.PureComponent<TextEditorProps, TextAreaState> {
+  static defaultProps = {
+    maxLength: null,
+  };
+
+  constructor(props: TextEditorProps) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue,
+    };
+  }
+  inputRef = React.createRef<HTMLInputElement>();
+
+  componentDidMount() {
+    if (this.inputRef.current && this.props.initialFocus) {
+      this.inputRef.current.focus();
+    }
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<TextEditorProps>,
+    prevState: Readonly<TextAreaState>
+  ): void {
+    const { defaultValue } = this.props;
+
+    if (defaultValue !== prevProps.defaultValue) {
+      this.setState({
+        value: defaultValue,
+      });
+    }
+  }
+
+  handleBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, evt.target.value);
+    }
+  };
+
+  handleChange = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { value } = this.state;
+
+    if (value !== evt.target.value) {
+      this.setState({
+        value: evt.target.value,
+      });
+    }
+  };
+
+  render() {
+    const { propertyKey, label, isEnabled, maxLength } = this.props;
+
+    const { value } = this.state;
+
+    if (!isEnabled) {
+      return null;
+    }
+
+    return (
+      <CustomizeDataEditorProperty propertyKey={propertyKey} isBlock={true}>
+        <CustomizeDataEditorPropertyValue>
+          <input
+            type="text"
+            maxLength={maxLength ?? undefined}
+            value={value ?? ""}
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+            ref={this.inputRef}
+          />
+        </CustomizeDataEditorPropertyValue>
+        <CustomizeDataEditorPropertyLabel>
+          {label}
+        </CustomizeDataEditorPropertyLabel>
+      </CustomizeDataEditorProperty>
+    );
+  }
+}
+
+type DataLookup = Record<string, any>;
+interface Props {
+  data: DataLookup;
+  onDataUpdate: (data: DataLookup) => void;
+
+  enableActivationType: boolean;
+  enableActivationTime: boolean;
+  enableAoeType: boolean;
+  enableAoeSize: boolean;
+  enableAttackSubtype: boolean;
+  enableCost: boolean;
+  enableDamageBonus: boolean;
+  enableDamageType: boolean;
+  enableDescription: boolean;
+  enableDiceCount: boolean;
+  enableDiceType: boolean;
+  enableFixedValue: boolean;
+  enableIsAdamantine: boolean;
+  enableIsMartialArts: boolean;
+  enableIsOffhand: boolean;
+  enableIsProficient: boolean;
+  enableIsSilver: boolean;
+  enableLongRange: boolean;
+  enableMagicBonus: boolean;
+  enableMiscBonus: boolean;
+  enableName: boolean;
+  enableNotes: boolean;
+  enableOverride: boolean;
+  enableProficiencyLevel: boolean;
+  enableRange: boolean;
+  enableRangeType: boolean;
+  enableSaveDcBonus: boolean;
+  enableSaveDc: boolean;
+  enableSaveType: boolean;
+  enableSnippet: boolean;
+  enableSpellRangeType: boolean;
+  enableStat: boolean;
+  enableToHitBonus: boolean;
+  enableToHit: boolean;
+  enableWeight: boolean;
+  enableDisplayAsAttack: boolean;
+
+  maxNameLength: number;
+
+  fallbackValues: Record<string, any>;
+  labelOverrides: Record<string, string>;
+
+  damageTypeOptions?: Array<HtmlSelectOption>;
+  diceTypeOptions?: Array<HtmlSelectOption>;
+  rangeOptions?: Array<HtmlSelectOption>;
+  statOptions?: Array<HtmlSelectOption>;
+  attackSubtypeOptions?: Array<HtmlSelectOption>;
+  activationTypeOptions?: Array<HtmlSelectOption>;
+  spellRangeTypeOptions?: Array<HtmlSelectOption>;
+  aoeTypeOptions?: Array<HtmlSelectOption>;
+  proficiencyLevelOptions?: Array<HtmlSelectOption>;
+
+  className: Array<string>;
+}
+interface State {
+  data: DataLookup;
+}
+export default class CustomizeDataEditor extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    enableActivationTime: false,
+    enableActivationType: false,
+    enableAoeType: false,
+    enableAoeSize: false,
+    enableAttackSubtype: false,
+
+    enableDamageBonus: false,
+    enableName: false,
+    enableNotes: false,
+    enableSnippet: false,
+    enableToHitBonus: false,
+    enableToHit: false,
+    enableDisplayAsAttack: false,
+
+    enableCost: false,
+    enableIsAdamantine: false,
+    enableDescription: false,
+    enableIsMartialArts: false,
+    enableIsOffhand: false,
+    enableIsProficient: false,
+    enableIsSilver: false,
+    enableSaveDcBonus: false,
+    enableSaveDc: false,
+    enableSaveType: false,
+    enableSpellRangeType: false,
+
+    enableWeight: false,
+
+    enableProficiencyLevel: false,
+    enableMagicBonus: false,
+    enableMiscBonus: false,
+    enableOverride: false,
+
+    enableRange: false,
+    enableLongRange: false,
+    enableRangeType: false,
+    enableStat: false,
+    enableDiceCount: false,
+    enableDiceType: false,
+    enableFixedValue: false,
+    enableDamageType: false,
+
+    maxNameLength: 256,
+
+    fallbackValues: {},
+    labelOverrides: {},
+
+    className: "",
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      data: props.data,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { data } = this.props;
+
+    if (data !== prevProps.data) {
+      this.setState({
+        data,
+      });
+    }
+  }
+
+  handleDataUpdate = (key: string, value: any): void => {
+    const { onDataUpdate } = this.props;
+
+    this.setState((prevState: State) => {
+      let newData: DataLookup = {
+        ...prevState.data,
+        [key]: value,
+      };
+
+      if (onDataUpdate) {
+        onDataUpdate(newData);
+      }
+
+      return {
+        data: newData,
+      };
+    });
+  };
+
+  getPropertyDefaultValue = (key: string, fallback: any = null): any => {
+    if (this.state.data.hasOwnProperty(key) && this.state.data[key] !== null) {
+      return this.state.data[key];
+    }
+    if (this.props.fallbackValues.hasOwnProperty(key)) {
+      return this.props.fallbackValues[key];
+    }
+    return fallback;
+  };
+
+  getPropertyLabelOverride = (key: string, fallback: any): any => {
+    if (this.props.labelOverrides.hasOwnProperty(key)) {
+      return this.props.labelOverrides[key];
+    }
+    return fallback;
+  };
+
+  render() {
+    const {
+      enableActivationTime,
+      enableActivationType,
+      enableAoeSize,
+      enableAoeType,
+      enableAttackSubtype,
+      enableCost,
+      enableDisplayAsAttack,
+      enableDamageBonus,
+      enableDamageType,
+      enableDescription,
+      enableDiceCount,
+      enableDiceType,
+      enableFixedValue,
+      enableIsAdamantine,
+      enableIsMartialArts,
+      enableIsOffhand,
+      enableIsProficient,
+      enableIsSilver,
+      enableLongRange,
+      enableMagicBonus,
+      enableMiscBonus,
+      enableName,
+      enableNotes,
+      enableOverride,
+      enableProficiencyLevel,
+      enableRange,
+      enableRangeType,
+      enableStat,
+      enableSaveDcBonus,
+      enableSaveDc,
+      enableSaveType,
+      enableSnippet,
+      enableSpellRangeType,
+      enableToHitBonus,
+      enableToHit,
+      enableWeight,
+      damageTypeOptions,
+      diceTypeOptions,
+      rangeOptions,
+      statOptions,
+      attackSubtypeOptions,
+      activationTypeOptions,
+      spellRangeTypeOptions,
+      aoeTypeOptions,
+      proficiencyLevelOptions,
+      className,
+      maxNameLength,
+    } = this.props;
+
+    return (
+      <div className={`ct-customize-data-editor ${className}`}>
+        <div className="ct-customize-data-editor__properties">
+          <SelectEditor
+            propertyKey={CUSTOMIZE_KEY.ATTACK_SUBTYPE}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.ATTACK_SUBTYPE
+            )}
+            label="Attack Type"
+            options={attackSubtypeOptions}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableAttackSubtype}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.TO_HIT}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.TO_HIT)}
+            label="To Hit Override"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableToHitBonus}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.TO_HIT_BONUS}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.TO_HIT_BONUS
+            )}
+            label="To Hit Bonus"
+            minimumValue={1}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableToHit}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.OVERRIDE}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.OVERRIDE)}
+            label="Override"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableOverride}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.MAGIC_BONUS}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.MAGIC_BONUS
+            )}
+            label="Magic Bonus"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableMagicBonus}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.MISC_BONUS}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.MISC_BONUS
+            )}
+            label="Misc Bonus"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableMiscBonus}
+          />
+          <SelectEditor
+            propertyKey={CUSTOMIZE_KEY.RANGE_TYPE}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.RANGE_TYPE
+            )}
+            label="Range"
+            options={rangeOptions}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableRangeType}
+          />
+          <SelectEditor
+            propertyKey={CUSTOMIZE_KEY.STAT}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.STAT)}
+            label="Stat"
+            options={statOptions}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableStat}
+          />
+          <SelectEditor
+            propertyKey={CUSTOMIZE_KEY.PROFICIENCY_LEVEL}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.PROFICIENCY_LEVEL
+            )}
+            label="Proficiency Level"
+            options={proficiencyLevelOptions}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableProficiencyLevel}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.DICE_COUNT}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.DICE_COUNT
+            )}
+            minimumValue={1}
+            label="Dice Count"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableDiceCount}
+          />
+          <SelectEditor
+            propertyKey={CUSTOMIZE_KEY.DICE_TYPE}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.DICE_TYPE)}
+            label="Die Type"
+            options={diceTypeOptions}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableDiceType}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.FIXED_VALUE}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.FIXED_VALUE
+            )}
+            minimumValue={1}
+            label={this.getPropertyLabelOverride(
+              CUSTOMIZE_KEY.FIXED_VALUE,
+              "Additional Bonus"
+            )}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableFixedValue}
+          />
+          <SelectEditor
+            propertyKey={CUSTOMIZE_KEY.DAMAGE_TYPE}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.DAMAGE_TYPE
+            )}
+            label="Damage Type"
+            options={damageTypeOptions}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableDamageType}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.DAMAGE_BONUS}
+            minimumValue={1}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.DAMAGE_BONUS
+            )}
+            label="Damage Bonus"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableDamageBonus}
+          />
+          <SelectEditor
+            propertyKey={CUSTOMIZE_KEY.SAVE_TYPE}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.SAVE_TYPE)}
+            label="Save Type"
+            options={statOptions}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableSaveType}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.SAVE_DC}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.SAVE_DC)}
+            minimumValue={0}
+            label="Fixed Save DC"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableSaveDc}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.SAVE_DC_BONUS}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.SAVE_DC_BONUS
+            )}
+            label="DC Bonus"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableSaveDcBonus}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.COST}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.COST)}
+            minimumValue={0}
+            label="Cost Override"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableCost}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.WEIGHT}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.WEIGHT)}
+            minimumValue={0}
+            label="Weight Override"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableWeight}
+          />
+          <SelectEditor
+            propertyKey={CUSTOMIZE_KEY.SPELL_RANGE_TYPE}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.SPELL_RANGE_TYPE
+            )}
+            label="Spell Range Type"
+            options={spellRangeTypeOptions}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableSpellRangeType}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.RANGE}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.RANGE)}
+            minimumValue={0}
+            label="Range"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableRange}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.LONG_RANGE}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.LONG_RANGE
+            )}
+            minimumValue={0}
+            label="Long Range"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableLongRange}
+          />
+          <SelectEditor
+            propertyKey={CUSTOMIZE_KEY.AOE_TYPE}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.AOE_TYPE)}
+            label="AoE Type"
+            options={aoeTypeOptions}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableAoeType}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.AOE_SIZE}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.AOE_SIZE)}
+            minimumValue={0}
+            label="AoE Size"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableAoeSize}
+          />
+          <SelectEditor
+            propertyKey={CUSTOMIZE_KEY.ACTIVATION_TYPE}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.ACTIVATION_TYPE
+            )}
+            label="Activation Type"
+            options={activationTypeOptions}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableActivationType}
+          />
+          <NumberEditor
+            propertyKey={CUSTOMIZE_KEY.ACTIVATION_TIME}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.ACTIVATION_TIME
+            )}
+            minimumValue={0}
+            label="Activation Time"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableActivationTime}
+          />
+          <CheckboxEditor
+            propertyKey={CUSTOMIZE_KEY.IS_MARTIAL_ARTS}
+            initiallyEnabled={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.IS_MARTIAL_ARTS
+            )}
+            label="Affected by Martial Arts"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableIsMartialArts}
+          />
+          <CheckboxEditor
+            propertyKey={CUSTOMIZE_KEY.IS_PROFICIENT}
+            initiallyEnabled={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.IS_PROFICIENT
+            )}
+            label="Proficient"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableIsProficient}
+          />
+          <CheckboxEditor
+            propertyKey={CUSTOMIZE_KEY.IS_OFFHAND}
+            initiallyEnabled={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.IS_OFFHAND
+            )}
+            label="Dual Wield"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableIsOffhand}
+          />
+          <CheckboxEditor
+            propertyKey={CUSTOMIZE_KEY.IS_SILVER}
+            initiallyEnabled={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.IS_SILVER
+            )}
+            label="Silvered"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableIsSilver}
+          />
+          <CheckboxEditor
+            propertyKey={CUSTOMIZE_KEY.IS_ADAMANTINE}
+            initiallyEnabled={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.IS_ADAMANTINE
+            )}
+            label="Adamantine"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableIsAdamantine}
+          />
+          <CheckboxEditor
+            propertyKey={CUSTOMIZE_KEY.DISPLAY_AS_ATTACK}
+            initiallyEnabled={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.DISPLAY_AS_ATTACK
+            )}
+            label="Display as Attack"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableDisplayAsAttack}
+          />
+          <TextEditor
+            propertyKey={CUSTOMIZE_KEY.NAME}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.NAME)}
+            label="Name"
+            maxLength={maxNameLength}
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableName}
+            initialFocus={true}
+          />
+          <TextEditor
+            propertyKey={CUSTOMIZE_KEY.NOTES}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.NOTES)}
+            label="Notes"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableNotes}
+          />
+          <TextAreaEditor
+            propertyKey={CUSTOMIZE_KEY.SNIPPET}
+            defaultValue={this.getPropertyDefaultValue(CUSTOMIZE_KEY.SNIPPET)}
+            label="Snippet"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableSnippet}
+          />
+          <TextAreaEditor
+            propertyKey={CUSTOMIZE_KEY.DESCRIPTION}
+            defaultValue={this.getPropertyDefaultValue(
+              CUSTOMIZE_KEY.DESCRIPTION
+            )}
+            label="Description"
+            onUpdate={this.handleDataUpdate}
+            isEnabled={enableDescription}
+          />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorProperty/CustomizeDataEditorProperty.tsx b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorProperty/CustomizeDataEditorProperty.tsx
new file mode 100644
index 0000000..3c46823
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorProperty/CustomizeDataEditorProperty.tsx
@@ -0,0 +1,27 @@
+import React from "react";
+
+import { FormatUtils } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  isBlock: boolean;
+  propertyKey: string;
+}
+export default class CustomizeDataEditorProperty extends React.PureComponent<Props> {
+  static defaultProps = {
+    isBlock: false,
+  };
+
+  render() {
+    const { isBlock, propertyKey } = this.props;
+
+    let classNames: Array<string> = [
+      "ct-customize-data-editor__property",
+      `ct-customize-data-editor__property--${FormatUtils.slugify(propertyKey)}`,
+    ];
+    if (isBlock) {
+      classNames.push("ct-customize-data-editor__property--block");
+    }
+
+    return <div className={classNames.join(" ")}>{this.props.children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorProperty/index.ts b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorProperty/index.ts
new file mode 100644
index 0000000..e21e4dd
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorProperty/index.ts
@@ -0,0 +1,4 @@
+import CustomizeDataEditorProperty from "./CustomizeDataEditorProperty";
+
+export default CustomizeDataEditorProperty;
+export { CustomizeDataEditorProperty };
diff --git a/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyLabel/CustomizeDataEditorPropertyLabel.tsx b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyLabel/CustomizeDataEditorPropertyLabel.tsx
new file mode 100644
index 0000000..554f008
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyLabel/CustomizeDataEditorPropertyLabel.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class CustomizeDataEditorPropertyLabel extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-customize-data-editor__property-label">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyLabel/index.ts b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyLabel/index.ts
new file mode 100644
index 0000000..587c347
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyLabel/index.ts
@@ -0,0 +1,4 @@
+import CustomizeDataEditorPropertyLabel from "./CustomizeDataEditorPropertyLabel";
+
+export default CustomizeDataEditorPropertyLabel;
+export { CustomizeDataEditorPropertyLabel };
diff --git a/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyValue/CustomizeDataEditorPropertyValue.tsx b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyValue/CustomizeDataEditorPropertyValue.tsx
new file mode 100644
index 0000000..ab38fee
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyValue/CustomizeDataEditorPropertyValue.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class CustomizeDataEditorPropertyValue extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-customize-data-editor__property-value">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyValue/index.ts b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyValue/index.ts
new file mode 100644
index 0000000..89615e7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/CustomizeDataEditorPropertyValue/index.ts
@@ -0,0 +1,4 @@
+import CustomizeDataEditorPropertyValue from "./CustomizeDataEditorPropertyValue";
+
+export default CustomizeDataEditorPropertyValue;
+export { CustomizeDataEditorPropertyValue };
diff --git a/ddb_main/tools/js/Shared/components/CustomizeDataEditor/index.ts b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/index.ts
new file mode 100644
index 0000000..35ed284
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/CustomizeDataEditor/index.ts
@@ -0,0 +1,12 @@
+import CustomizeDataEditor from "./CustomizeDataEditor";
+import CustomizeDataEditorProperty from "./CustomizeDataEditorProperty";
+import CustomizeDataEditorPropertyLabel from "./CustomizeDataEditorPropertyLabel";
+import CustomizeDataEditorPropertyValue from "./CustomizeDataEditorPropertyValue";
+
+export default CustomizeDataEditor;
+export {
+  CustomizeDataEditor,
+  CustomizeDataEditorProperty,
+  CustomizeDataEditorPropertyLabel,
+  CustomizeDataEditorPropertyValue,
+};
diff --git a/ddb_main/tools/js/Shared/components/DiceAdjustmentSummary/DiceAdjustmentSummary.tsx b/ddb_main/tools/js/Shared/components/DiceAdjustmentSummary/DiceAdjustmentSummary.tsx
new file mode 100644
index 0000000..9acf830
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/DiceAdjustmentSummary/DiceAdjustmentSummary.tsx
@@ -0,0 +1,144 @@
+import React from "react";
+
+import {
+  AdvantageIcon,
+  DarkModeNegativeBonusNegativeSvg,
+  DarkModePositiveBonusPositiveSvg,
+  DataOriginName,
+  DisadvantageIcon,
+  NegativeBonusNegativeSvg,
+  PositiveBonusPositiveSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  DiceAdjustment,
+  DataOrigin,
+  Constants,
+  FormatUtils,
+  RuleData,
+  RuleDataUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  diceAdjustment: DiceAdjustment;
+  ruleData: RuleData;
+  showDataOrigin: boolean;
+  onDataOriginClick?: (dataOrigin: DataOrigin) => void;
+  theme: CharacterTheme;
+}
+export default class DiceAdjustmentSummary extends React.PureComponent<
+  Props,
+  {}
+> {
+  static defaultProps = {
+    showDataOrigin: true,
+  };
+
+  render() {
+    const {
+      diceAdjustment,
+      ruleData,
+      showDataOrigin,
+      onDataOriginClick,
+      theme,
+    } = this.props;
+    const { statId, restriction, type, rollType, amount, dataOrigin } =
+      diceAdjustment;
+
+    let abilityNode: React.ReactNode;
+    if (statId) {
+      abilityNode = (
+        <React.Fragment>
+          on{" "}
+          <span
+            className={`ct-dice-adjustment-summary__description--ability ${
+              theme?.isDarkMode
+                ? "ct-dice-adjustment-summary__description--ability--dark-mode"
+                : ""
+            }`}
+          >
+            {RuleDataUtils.getStatNameById(statId, ruleData)}
+          </span>
+        </React.Fragment>
+      );
+    } else if (rollType === Constants.DiceAdjustmentRollTypeEnum.DEATH_SAVE) {
+      abilityNode = <React.Fragment>on Death Saves</React.Fragment>;
+    } else {
+      if (
+        !restriction &&
+        rollType === Constants.DiceAdjustmentRollTypeEnum.SAVE
+      ) {
+        abilityNode = <React.Fragment>on saves</React.Fragment>;
+      }
+    }
+
+    let saveAmount: number | null = null;
+    let IconComponent: React.ComponentType<any> | null = null;
+    switch (type) {
+      case Constants.DiceAdjustmentTypeEnum.BONUS:
+        if (amount) {
+          saveAmount = amount;
+          if (amount >= 0) {
+            IconComponent = theme?.isDarkMode
+              ? DarkModePositiveBonusPositiveSvg
+              : PositiveBonusPositiveSvg;
+          } else {
+            IconComponent = theme?.isDarkMode
+              ? DarkModeNegativeBonusNegativeSvg
+              : NegativeBonusNegativeSvg;
+          }
+        }
+        break;
+      case Constants.DiceAdjustmentTypeEnum.ADVANTAGE:
+        IconComponent = AdvantageIcon;
+        break;
+      case Constants.DiceAdjustmentTypeEnum.DISADVANTAGE:
+        IconComponent = DisadvantageIcon;
+        break;
+      default:
+      // not implemented
+    }
+
+    let dataOriginNode: React.ReactNode;
+    if (showDataOrigin) {
+      dataOriginNode = (
+        <DataOriginName
+          dataOrigin={dataOrigin}
+          onClick={onDataOriginClick}
+          theme={theme}
+        />
+      );
+    }
+
+    return (
+      <div className="ct-dice-adjustment-summary">
+        {IconComponent && (
+          <IconComponent
+            theme={theme}
+            className="ct-dice-adjustment-summary__icon"
+          />
+        )}
+        {typeof saveAmount === "number" && (
+          <span className="ct-dice-adjustment-summary__value">
+            {saveAmount}
+          </span>
+        )}
+        {abilityNode && (
+          <span className="ct-dice-adjustment-summary__description">
+            {abilityNode}
+          </span>
+        )}
+        {restriction !== null && restriction.length > 0 && (
+          <span className="ct-dice-adjustment-summary__restriction">
+            {FormatUtils.lowerCaseLetters(restriction.trim(), 0)}
+          </span>
+        )}
+        {showDataOrigin && dataOriginNode && (
+          <span className="ct-dice-adjustment-summary__data-origin">
+            ({dataOriginNode})
+          </span>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/DiceAdjustmentSummary/index.ts b/ddb_main/tools/js/Shared/components/DiceAdjustmentSummary/index.ts
new file mode 100644
index 0000000..df01ba1
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/DiceAdjustmentSummary/index.ts
@@ -0,0 +1,4 @@
+import DiceAdjustmentSummary from "./DiceAdjustmentSummary";
+
+export default DiceAdjustmentSummary;
+export { DiceAdjustmentSummary };
diff --git a/ddb_main/tools/js/Shared/components/EditorBox/EditorBox.tsx b/ddb_main/tools/js/Shared/components/EditorBox/EditorBox.tsx
new file mode 100644
index 0000000..479dda4
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/EditorBox/EditorBox.tsx
@@ -0,0 +1,13 @@
+import clsx from "clsx";
+import React from "react";
+
+interface Props {
+  className?: string,
+}
+export default class EditorBox extends React.PureComponent<Props> {
+  render() {
+    const { children, className } = this.props;
+
+    return <div className={clsx(["ct-editor-box", className])}>{children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/EditorBox/index.ts b/ddb_main/tools/js/Shared/components/EditorBox/index.ts
new file mode 100644
index 0000000..03b9646
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/EditorBox/index.ts
@@ -0,0 +1,4 @@
+import EditorBox from "./EditorBox";
+
+export default EditorBox;
+export { EditorBox };
diff --git a/ddb_main/tools/js/Shared/components/EquipmentShop/EquipmentShop.tsx b/ddb_main/tools/js/Shared/components/EquipmentShop/EquipmentShop.tsx
new file mode 100644
index 0000000..3868275
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/EquipmentShop/EquipmentShop.tsx
@@ -0,0 +1,386 @@
+import axios, { Canceler } from "axios";
+import React from "react";
+import { useContext } from "react";
+
+import { LoadingPlaceholder } from "@dndbeyond/character-components/es";
+import {
+  Container,
+  ContainerUtils,
+  CharacterTheme,
+  Item,
+  RuleData,
+  PartyInfo,
+  InventoryManager,
+  ItemManager,
+  ContainerManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemFilter } from "~/components/ItemFilter";
+
+import { InventoryManagerContext } from "../../managers/InventoryManagerContext";
+import { AppLoggerUtils } from "../../utils";
+import { ThemeButton } from "../common/Button";
+import { EquipmentShopItem } from "./EquipmentShopItem";
+
+interface Props {
+  items?: Array<Item>;
+  pageSize: number;
+  // CAN THIS GO AS WELL!?
+  ruleData: RuleData;
+  proficiencyBonus: number;
+  containers: Array<Container>;
+  theme: CharacterTheme;
+  limitAddToCurrentContainer: Container | null;
+  partyInfo: PartyInfo | null;
+  inventoryManager: InventoryManager;
+}
+interface State {
+  query: "";
+  shoppeContainer: ContainerManager | null;
+  filteredItems: Array<Item>;
+  currentPage: number;
+  loading: boolean;
+  loaded: boolean;
+  filterTypes: Array<string>;
+  filterQuery: string;
+  filterProficient: boolean;
+  filterBasic: boolean;
+  filterMagic: boolean;
+  filterContainer: boolean;
+  filterSourceCategories: Array<number>;
+}
+export class EquipmentShop extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    pageSize: 12,
+    limitAddToCurrentContainer: null,
+  };
+
+  // TODO: I am going to hold off on this
+
+  loadItemsCanceler: null | Canceler = null;
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      query: "",
+      shoppeContainer: null,
+      filteredItems: props.items ? props.items : [],
+      currentPage: 0,
+      loading: false,
+      loaded: false,
+      filterTypes: [],
+      filterQuery: "",
+      filterProficient: false,
+      filterBasic: false,
+      filterMagic: false,
+      filterContainer: false,
+      filterSourceCategories: [],
+    };
+  }
+
+  componentDidMount() {
+    const { inventoryManager } = this.props;
+
+    if (inventoryManager) {
+      this.setState({
+        loading: true,
+      });
+
+      // promise or callback vs async/await? geeze
+      inventoryManager
+        .getInventoryShoppe({
+          onSuccess: (shoppeContainer: ContainerManager) => {
+            this.setState({
+              shoppeContainer,
+              loading: false,
+              loaded: true,
+            });
+          },
+          additionalApiConfig: {
+            cancelToken: new axios.CancelToken((c) => {
+              this.loadItemsCanceler = c;
+            }),
+          },
+        })
+        .then((res) => {
+          this.loadItemsCanceler = null;
+          return res;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    } else {
+      this.setState({
+        loaded: true,
+      });
+    }
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadItemsCanceler !== null) {
+      this.loadItemsCanceler();
+    }
+  }
+
+  isFiltered = (): boolean => {
+    const {
+      filterQuery,
+      filterTypes,
+      filterProficient,
+      filterMagic,
+      filterBasic,
+      filterContainer,
+      filterSourceCategories,
+    } = this.state;
+
+    if (filterProficient || filterMagic || filterBasic || filterContainer) {
+      return true;
+    }
+
+    if (filterQuery) {
+      return true;
+    }
+
+    if (filterTypes.length || filterSourceCategories.length) {
+      return true;
+    }
+
+    return false;
+  };
+
+  handlePageMore = (): void => {
+    this.setState((prevState) => ({
+      currentPage: prevState.currentPage + 1,
+    }));
+  };
+
+  handleQueryChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    this.setState({
+      filterQuery: evt.target.value,
+      currentPage: 0,
+    });
+  };
+
+  handleFilterItemType = (type: string): void => {
+    this.setState((prevState: State) => ({
+      filterTypes: prevState.filterTypes.includes(type)
+        ? prevState.filterTypes.filter((t) => t !== type)
+        : [...prevState.filterTypes, type],
+      currentPage: 0,
+    }));
+  };
+
+  handleSourceCategoryClick = (categoryId: number): void => {
+    this.setState((prevState: State) => ({
+      filterSourceCategories: prevState.filterSourceCategories.includes(
+        categoryId
+      )
+        ? prevState.filterSourceCategories.filter((cat) => cat !== categoryId)
+        : [...prevState.filterSourceCategories, categoryId],
+      currentPage: 0,
+    }));
+  };
+
+  handleToggleFilter = (type: string): void => {
+    switch (type) {
+      case "Proficient":
+        this.handleProficientToggle();
+        break;
+      case "Common":
+        this.handleBasicToggle();
+        break;
+      case "Magical":
+        this.handleMagicToggle();
+        break;
+      case "Container":
+        this.handleContainerToggle();
+        break;
+      default:
+    }
+  };
+
+  handleProficientToggle = (): void => {
+    this.setState((prevState: State) => ({
+      filterProficient: !prevState.filterProficient,
+      currentPage: 0,
+    }));
+  };
+
+  handleBasicToggle = (): void => {
+    this.setState((prevState: State) => ({
+      filterBasic: !prevState.filterBasic,
+      currentPage: 0,
+    }));
+  };
+
+  handleMagicToggle = (): void => {
+    this.setState((prevState: State) => ({
+      filterMagic: !prevState.filterMagic,
+      currentPage: 0,
+    }));
+  };
+
+  handleContainerToggle = (): void => {
+    this.setState((prevState: State) => ({
+      filterContainer: !prevState.filterContainer,
+      currentPage: 0,
+    }));
+  };
+
+  renderPager = (
+    filteredItems: Array<ItemManager>,
+    totalItems: number
+  ): React.ReactNode => {
+    if (!this.isFiltered()) {
+      return null;
+    }
+
+    if (filteredItems.length >= totalItems) {
+      return null;
+    }
+
+    return (
+      <div className="ct-equipment-shop__pager">
+        <ThemeButton block={true} onClick={this.handlePageMore}>
+          Load More
+        </ThemeButton>
+      </div>
+    );
+  };
+
+  renderPagedListing = (filteredItems: Array<ItemManager>): React.ReactNode => {
+    const { currentPage } = this.state;
+    const {
+      pageSize,
+      ruleData,
+      proficiencyBonus,
+      containers,
+      theme,
+      limitAddToCurrentContainer,
+      partyInfo,
+    } = this.props;
+
+    if (!this.isFiltered()) {
+      return null;
+    }
+
+    const pagedFilteredItems: Array<ItemManager> = filteredItems.slice(
+      0,
+      (currentPage + 1) * pageSize
+    );
+
+    return (
+      <div className="ct-equipment-shop__items">
+        {pagedFilteredItems.length ? (
+          pagedFilteredItems.map((item, idx) => {
+            let filteredContainers = containers;
+            const isContainer = item.isContainer();
+            const isPack = item.isPack();
+            if (isContainer || isPack) {
+              filteredContainers = containers.filter(
+                (container) =>
+                  ContainerUtils.isCharacterContainer(container) ||
+                  ContainerUtils.isPartyContainer(container)
+              );
+            } else if (limitAddToCurrentContainer) {
+              filteredContainers = [limitAddToCurrentContainer];
+            }
+            return (
+              <EquipmentShopItem
+                key={`${item.getDefinitionId()}-${idx}`}
+                containers={filteredContainers}
+                theme={theme}
+                item={item}
+                ruleData={ruleData}
+                proficiencyBonus={proficiencyBonus}
+                partyInfo={partyInfo}
+              />
+            );
+          })
+        ) : (
+          <div className="ct-equipment-shop__empty">No Results Found</div>
+        )}
+      </div>
+    );
+  };
+
+  renderUi = (): React.ReactNode => {
+    const {
+      filterTypes,
+      filterQuery,
+      filterProficient,
+      filterBasic,
+      filterMagic,
+      filterContainer,
+      filterSourceCategories,
+      currentPage,
+    } = this.state;
+    const { pageSize } = this.props;
+
+    const itemData = this.state.shoppeContainer?.getInventoryItems({
+      filterOptions: {
+        filterTypes,
+        filterQuery,
+        filterProficient,
+        filterBasic,
+        filterMagic,
+        filterContainer,
+        filterSourceCategories,
+      },
+      paginationOptions: {
+        currentPage,
+        pageSize,
+      },
+      isShoppe: true,
+    });
+
+    const items = itemData?.items ?? [];
+    const totalItems = itemData?.totalItems ?? 0;
+    const sourceCategories = itemData?.sourceCategories || [];
+
+    return (
+      <React.Fragment>
+        <ItemFilter
+          filterQuery={filterQuery}
+          onQueryChange={(value) =>
+            this.setState({
+              filterQuery: value,
+            })
+          }
+          filterTypes={filterTypes}
+          sourceCategories={sourceCategories}
+          onFilterButtonClick={this.handleFilterItemType}
+          onCheckboxChange={this.handleToggleFilter}
+          onSourceCategoryClick={this.handleSourceCategoryClick}
+          filterSourceCategories={filterSourceCategories}
+          filterProficient={filterProficient}
+          filterBasic={filterBasic}
+          filterMagic={filterMagic}
+          filterContainer={filterContainer}
+          themed
+        />
+        {this.renderPagedListing(items)}
+        {this.renderPager(items, totalItems)}
+      </React.Fragment>
+    );
+  };
+
+  renderLoading = (): React.ReactNode => {
+    return <LoadingPlaceholder />;
+  };
+
+  render() {
+    const { loaded, loading } = this.state;
+
+    return (
+      <div className="ct-equipment-shop">
+        {loading && this.renderLoading()}
+        {!loading && loaded && this.renderUi()}
+      </div>
+    );
+  }
+}
+
+export default function EquipmentShopContainer(props) {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  return <EquipmentShop inventoryManager={inventoryManager} {...props} />;
+}
diff --git a/ddb_main/tools/js/Shared/components/EquipmentShop/EquipmentShopItem/EquipmentShopItem.tsx b/ddb_main/tools/js/Shared/components/EquipmentShop/EquipmentShopItem/EquipmentShopItem.tsx
new file mode 100644
index 0000000..6d060cf
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/EquipmentShop/EquipmentShopItem/EquipmentShopItem.tsx
@@ -0,0 +1,247 @@
+import React from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+} from "@dndbeyond/character-components/es";
+import {
+  CampaignUtils,
+  Container,
+  ContainerUtils,
+  CharacterTheme,
+  HelperUtils,
+  Item,
+  ItemUtils,
+  RuleData,
+  MenuOption,
+  PartyInfo,
+  Constants,
+  ItemManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemName } from "~/components/ItemName";
+
+import { AppNotificationUtils } from "../../../utils";
+import ItemDetail from "../../ItemDetail";
+import { ThemeButton, ThemeButtonWithMenu } from "../../common/Button";
+
+interface Props {
+  item: ItemManager;
+  enableAdd: boolean;
+  minAddAmount: number;
+  maxAddAmount: number;
+  ruleData: RuleData;
+  proficiencyBonus: number;
+  containers: Array<Container>;
+  theme: CharacterTheme;
+  partyInfo: PartyInfo | null;
+}
+interface State {
+  amount: number | null;
+}
+export default class EquipmentShopItem extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    enableAdd: true,
+    minAddAmount: 1,
+    maxAddAmount: 10,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      amount: 1,
+    };
+  }
+
+  handleAmountChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    this.setState({
+      amount: HelperUtils.parseInputInt(evt.target.value),
+    });
+  };
+
+  handleAmountBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { minAddAmount, maxAddAmount } = this.props;
+
+    const parsedValue = HelperUtils.parseInputInt(evt.target.value);
+    const clampedValue = HelperUtils.clampInt(
+      parsedValue === null ? 0 : parsedValue,
+      minAddAmount,
+      maxAddAmount
+    );
+
+    this.setState({
+      amount: clampedValue,
+    });
+  };
+
+  handleDecrementCountClick = (): void => {
+    const { minAddAmount } = this.props;
+
+    this.setState((prevState, props) => ({
+      amount: Math.max(
+        (prevState.amount === null ? 0 : prevState.amount) - 1,
+        minAddAmount
+      ),
+    }));
+  };
+
+  handleIncrementCountClick = (): void => {
+    this.setState((prevState, props) => ({
+      amount: (prevState.amount === null ? 0 : prevState.amount) + 1,
+    }));
+  };
+
+  handleAmountKeyUp = (evt: React.KeyboardEvent<HTMLInputElement>): void => {
+    const { minAddAmount, maxAddAmount } = this.props;
+
+    const parsedValue = HelperUtils.parseInputInt(
+      (evt.target as HTMLInputElement).value
+    );
+    const clampedValue = HelperUtils.clampInt(
+      parsedValue === null ? 0 : parsedValue,
+      minAddAmount,
+      maxAddAmount
+    );
+
+    this.setState({
+      amount: clampedValue,
+    });
+  };
+
+  handleAdd = (containerDefinitionKey?: string): void => {
+    const { amount: stateAmount } = this.state;
+    const { item, minAddAmount } = this.props;
+
+    const amount = stateAmount === null ? minAddAmount : stateAmount;
+    item.handleAdd(
+      { amount, containerDefinitionKey },
+      AppNotificationUtils.handleItemAddAccepted.bind(this, item.item, amount),
+      AppNotificationUtils.handleItemAddRejected.bind(this, item.item, amount)
+    );
+  };
+
+  renderHeader = (
+    item: ItemManager,
+    metaItems: Array<string>
+  ): React.ReactNode => {
+    const { containers, partyInfo } = this.props;
+
+    return (
+      <CollapsibleHeaderContent
+        heading={<ItemName item={item.item} />}
+        metaItems={metaItems}
+        callout={
+          <ThemeButtonWithMenu
+            groupedOptions={ContainerUtils.getGroupedOptions(
+              null,
+              containers,
+              "Add To:",
+              partyInfo
+                ? CampaignUtils.getSharingState(partyInfo)
+                : Constants.PartyInventorySharingStateEnum.OFF
+            )}
+            onSelect={this.handleAdd}
+          >
+            Add
+          </ThemeButtonWithMenu>
+        }
+      />
+    );
+  };
+
+  render() {
+    const { amount } = this.state;
+    const {
+      item,
+      minAddAmount,
+      maxAddAmount,
+      ruleData,
+      proficiencyBonus,
+      theme,
+      containers,
+      partyInfo,
+    } = this.props;
+
+    const totalAmount: number =
+      (amount === null ? 1 : amount) * item.getBundleSize();
+
+    return (
+      <Collapsible
+        layoutType={"minimal"}
+        header={this.renderHeader(item, item.getMetaText())}
+        className="ct-equipment-shop__item"
+      >
+        <ItemDetail
+          theme={theme}
+          item={item.item}
+          ruleData={ruleData}
+          showCustomize={false}
+          showActions={false}
+          showImage={false}
+          proficiencyBonus={proficiencyBonus}
+        />
+        <div className="ct-equipment-shop__item-actions">
+          <div className="ct-equipment-shop__item-action">
+            <div className="ct-equipment-shop__item-amount">
+              <div className="ct-equipment-shop__item-amount-label">
+                Amount to add
+              </div>
+              <div className="ct-equipment-shop__item-amount-controls">
+                <div className="ct-equipment-shop__item-amount-decrease">
+                  <ThemeButton
+                    className="button-action-decrease button-action-decrease--small"
+                    onClick={this.handleDecrementCountClick}
+                    disabled={amount !== null && amount <= minAddAmount}
+                    size="small"
+                  />
+                </div>
+                <div className="ct-equipment-shop__item-amount-value">
+                  <input
+                    type="number"
+                    value={amount === null ? "" : amount}
+                    className="character-input ct-equipment-shop__item-amount-input"
+                    onChange={this.handleAmountChange}
+                    onBlur={this.handleAmountBlur}
+                    onKeyUp={this.handleAmountKeyUp}
+                    min={minAddAmount}
+                    max={maxAddAmount}
+                  />
+                </div>
+                <div className="ct-equipment-shop__item-amount-increase">
+                  <ThemeButton
+                    className="button-action-increase button-action-increase--small"
+                    onClick={this.handleIncrementCountClick}
+                    disabled={amount !== null && amount >= maxAddAmount}
+                    size="small"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div className="ct-equipment-shop__item-action">
+            <ThemeButtonWithMenu
+              onSelect={(definitionKey) => this.handleAdd(definitionKey)}
+              containerEl={
+                document.querySelector(".ct-sidebar__portal") as HTMLElement
+              }
+              groupedOptions={ContainerUtils.getGroupedOptions(
+                null,
+                containers,
+                "Add To:",
+                partyInfo
+                  ? CampaignUtils.getSharingState(partyInfo)
+                  : Constants.PartyInventorySharingStateEnum.OFF
+              )}
+            >
+              Add {totalAmount === 1 ? " Item" : ` ${totalAmount} Items`}
+            </ThemeButtonWithMenu>
+          </div>
+        </div>
+      </Collapsible>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/EquipmentShop/index.ts b/ddb_main/tools/js/Shared/components/EquipmentShop/index.ts
new file mode 100644
index 0000000..e06802e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/EquipmentShop/index.ts
@@ -0,0 +1,5 @@
+import EquipmentShop from "./EquipmentShop";
+import EquipmentShopItem from "./EquipmentShopItem";
+
+export default EquipmentShop;
+export { EquipmentShop, EquipmentShopItem };
diff --git a/ddb_main/tools/js/Shared/components/ErrorBoundary/ErrorBoundary.tsx b/ddb_main/tools/js/Shared/components/ErrorBoundary/ErrorBoundary.tsx
new file mode 100644
index 0000000..789d5d6
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ErrorBoundary/ErrorBoundary.tsx
@@ -0,0 +1,81 @@
+import React from "react";
+
+import { Link } from "~/components/Link";
+
+import config from "../../../config";
+import { ErrorUtils } from "../../utils";
+
+interface Props {}
+interface State {
+  hasError: boolean;
+  errorId: string | null;
+}
+export default class ErrorBoundary extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+    this.state = {
+      hasError: false,
+      errorId: null,
+    };
+  }
+
+  static getDerivedStateFromError(error) {
+    return {
+      hasError: true,
+    };
+  }
+
+  componentDidCatch(error: Error, componentInfo: React.ErrorInfo) {
+    console.error("ERROR >>>", error);
+    ErrorUtils.dispatchException(error, {
+      componentInfo,
+    });
+  }
+
+  handleBack = (): void => {
+    window.history.back();
+  };
+
+  renderErrorUi = (): React.ReactNode => {
+    const { errorId } = this.state;
+
+    return (
+      <div className="ct-error-boundary">
+        <div className="ct-error-boundary__header">
+          <div className="ct-error-boundary__heading">
+            A beholder has appeared and ruined everything
+          </div>
+        </div>
+        <div className="ct-error-boundary__content">
+          <p>
+            The error that summoned it has been logged and the D&amp;D Beyond
+            team will hit the forge to make repairs.{" "}
+            <Link href="#" onClick={this.handleBack}>
+              Back to Previous Page
+            </Link>
+          </p>
+        </div>
+        <div className="ct-error-boundary__reporting">
+          {errorId !== null && (
+            <p>
+              Error Code:{" "}
+              <span className="ct-error-boundary__code">{errorId}</span>
+            </p>
+          )}
+          <p>
+            Version:{" "}
+            <span className="ct-error-boundary__code">{config.version}</span>
+          </p>
+        </div>
+      </div>
+    );
+  };
+
+  render() {
+    if (this.state.hasError) {
+      // You can render any custom fallback UI
+      return this.renderErrorUi();
+    }
+    return this.props.children;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ErrorBoundary/index.ts b/ddb_main/tools/js/Shared/components/ErrorBoundary/index.ts
new file mode 100644
index 0000000..35b5dd9
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ErrorBoundary/index.ts
@@ -0,0 +1,4 @@
+import ErrorBoundary from "./ErrorBoundary";
+
+export default ErrorBoundary;
+export { ErrorBoundary };
diff --git a/ddb_main/tools/js/Shared/components/ExtraList/ExtraList.tsx b/ddb_main/tools/js/Shared/components/ExtraList/ExtraList.tsx
new file mode 100644
index 0000000..a7f79f0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ExtraList/ExtraList.tsx
@@ -0,0 +1,69 @@
+import { orderBy } from "lodash";
+import React from "react";
+
+import {
+  CharacterTheme,
+  ExtraManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ExtraRow } from "../ExtraRow";
+
+interface Props {
+  extras: Array<ExtraManager>;
+  showNotes: boolean;
+  onShow?: (extra: ExtraManager) => void;
+  onStatusChange?: (extra: ExtraManager, newStatus: boolean) => void;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+export default class ExtraList extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    showNotes: true,
+    isReadonly: false,
+  };
+
+  render() {
+    const { extras, showNotes, onShow, onStatusChange, isReadonly, theme } =
+      this.props;
+
+    let orderedExtras: Array<ExtraManager> = orderBy(extras, (extra) =>
+      extra.getName()
+    );
+
+    return (
+      <div className="ct-extra-list">
+        <div className="ct-extra-list__row-header">
+          <div className="ct-extra-list__col ct-extra-list__col--preview" />
+          <div className="ct-extra-list__col ct-extra-list__col--primary">
+            Name
+          </div>
+          <div className="ct-extra-list__col ct-extra-list__col--ac">AC</div>
+          <div className="ct-extra-list__col ct-extra-list__col--hp">
+            Hit Points
+          </div>
+          <div className="ct-extra-list__col ct-extra-list__col--speed">
+            Speed
+          </div>
+          {showNotes && (
+            <div className="ct-extra-list__col ct-extra-list__col--notes">
+              Notes
+            </div>
+          )}
+        </div>
+        <div className="ct-extra-list__items">
+          {orderedExtras.map((extra, idx) => (
+            <ExtraRow
+              theme={theme}
+              key={`${idx}-${extra.getUniqueKey()}`}
+              extra={extra}
+              onShow={onShow}
+              onStatusChange={onStatusChange}
+              showNotes={showNotes}
+              isReadonly={isReadonly}
+            />
+          ))}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ExtraList/index.ts b/ddb_main/tools/js/Shared/components/ExtraList/index.ts
new file mode 100644
index 0000000..8dd8151
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ExtraList/index.ts
@@ -0,0 +1,4 @@
+import ExtraList from "./ExtraList";
+
+export default ExtraList;
+export { ExtraList };
diff --git a/ddb_main/tools/js/Shared/components/ExtraName/ExtraName.tsx b/ddb_main/tools/js/Shared/components/ExtraName/ExtraName.tsx
new file mode 100644
index 0000000..e18127c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ExtraName/ExtraName.tsx
@@ -0,0 +1,66 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  CharacterTheme,
+  Constants,
+  ExtraManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  extra: ExtraManager;
+  onClick?: (extra: ExtraManager) => void;
+  className: string;
+  theme?: CharacterTheme;
+}
+export default class ExtraName extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick, extra } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+
+      onClick(extra);
+    }
+  };
+
+  render() {
+    const { extra, className, theme } = this.props;
+
+    let title: string = "Customized";
+
+    switch (extra.getExtraType()) {
+      case Constants.ExtraTypeEnum.CREATURE:
+        title = `Creature is ${title}`;
+        break;
+      case Constants.ExtraTypeEnum.VEHICLE:
+        title = `Vehicle is ${title}`;
+        break;
+      default:
+      //not implemented
+    }
+
+    let isCustomized = extra.isCustomized();
+    let classNames: Array<string> = [className, "ddbc-extra-name"];
+
+    return (
+      <span className={classNames.join(" ")} onClick={this.handleClick}>
+        {extra.getName()}
+        {isCustomized && (
+          <Tooltip
+            isDarkMode={theme?.isDarkMode}
+            title={title}
+            className="ddbc-extra-name__customized"
+          >
+            *
+          </Tooltip>
+        )}
+      </span>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ExtraName/index.ts b/ddb_main/tools/js/Shared/components/ExtraName/index.ts
new file mode 100644
index 0000000..cd75dd9
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ExtraName/index.ts
@@ -0,0 +1,4 @@
+import ExtraName from "./ExtraName";
+
+export default ExtraName;
+export { ExtraName };
diff --git a/ddb_main/tools/js/Shared/components/ExtraRow/ExtraRow.tsx b/ddb_main/tools/js/Shared/components/ExtraRow/ExtraRow.tsx
new file mode 100644
index 0000000..d0dfac5
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ExtraRow/ExtraRow.tsx
@@ -0,0 +1,277 @@
+import React, { FC, HTMLAttributes } from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { NoteComponents } from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  Constants,
+  Creature,
+  ExtraManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+
+import ExtraName from "../ExtraName";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  extra: ExtraManager;
+  onShow?: (extra: ExtraManager) => void;
+  onStatusChange?: (extra: ExtraManager, newStatus: boolean) => void;
+  showNotes: boolean;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+
+export const ExtraRow: FC<Props> = ({
+  extra,
+  onShow,
+  onStatusChange,
+  showNotes,
+  isReadonly = false,
+  theme,
+  ...props
+}) => {
+  const { hpInfo } = useCharacterEngine();
+
+  let avatarUrl = extra.getAvatarUrl();
+  if (!avatarUrl) {
+    avatarUrl = "";
+  }
+  const name = extra.getName();
+
+  const handleClick = (evt: React.MouseEvent): void => {
+    if (onShow) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onShow(extra);
+    }
+  };
+
+  const handleActivate = (): void => {
+    if (onStatusChange) {
+      onStatusChange(extra, true);
+    }
+  };
+
+  const handleDeactivate = (): void => {
+    if (onStatusChange) {
+      onStatusChange(extra, false);
+    }
+  };
+
+  const renderMetaItems = (): React.ReactNode => {
+    let metaItems: Array<string> = [];
+
+    const sizeInfo = extra.getSizeInfo();
+    let size: string = "";
+    if (sizeInfo !== null && sizeInfo.name !== null) {
+      size = sizeInfo.name;
+    }
+
+    let type = extra.getType();
+    let typeName: string = "";
+    if (type) {
+      typeName = type;
+    }
+
+    let description: string = `${size} ${typeName.toLowerCase()}`.trim();
+    if (description) {
+      metaItems.push(description);
+    }
+
+    return (
+      <div
+        className={`ct-extra-row__meta ${
+          theme.isDarkMode ? "ct-extra-row__meta--dark-mode" : ""
+        }`}
+      >
+        {metaItems.map((metaItem, idx) => (
+          <span key={idx} className="ct-extra-row__meta-item">
+            {metaItem}
+          </span>
+        ))}
+      </div>
+    );
+  };
+
+  const renderHitPoints = (): React.ReactNode => {
+    let useOwnerHp = false;
+    if (extra.isCreature()) {
+      const extraData = extra.getExtraData() as Creature;
+      if (extraData) {
+        useOwnerHp = extraData.useOwnerHp;
+      }
+    }
+
+    const hitPointInfo = useOwnerHp ? hpInfo : extra.getHitPointInfo().data;
+    const showTooltip = useOwnerHp
+      ? false
+      : extra.getHitPointInfo().showTooltip;
+
+    let contentNode: React.ReactNode = null;
+    if (hitPointInfo !== null) {
+      let totalHp: number = hitPointInfo.totalHp ? hitPointInfo.totalHp : 0;
+      let remainingHp: number = hitPointInfo.remainingHp
+        ? hitPointInfo.remainingHp
+        : 0;
+      let tempHp: number = hitPointInfo.tempHp ? hitPointInfo.tempHp : 0;
+
+      const current: number = remainingHp + tempHp;
+      const total: number = totalHp + tempHp;
+
+      contentNode = (
+        <React.Fragment>
+          <span className="ct-extra-row__hp-value ct-extra-row__hp-value--current">
+            {current}
+          </span>
+          <span className="ct-extra-row__hp-sep">/</span>
+          <span className="ct-extra-row__hp-value ct-extra-row__hp-value--total">
+            {total}
+          </span>
+        </React.Fragment>
+      );
+    } else {
+      contentNode = (
+        <span className="ct-extra-row__hp-value ct-extra-row__hp-value--current">
+          --
+        </span>
+      );
+    }
+
+    let classNames: Array<string> = ["ct-extra-row__hp"];
+    if (
+      hitPointInfo !== null &&
+      hitPointInfo.tempHp !== null &&
+      hitPointInfo.tempHp > 0
+    ) {
+      classNames.push("ct-extra-row__hp--has-temp");
+    }
+
+    if (theme.isDarkMode) {
+      classNames.push("ct-extra-row__hp--dark-mode");
+    }
+    return (
+      <div className={classNames.join(" ")}>
+        {contentNode}
+        {showTooltip && renderAdditionalInfoTooltip()}
+      </div>
+    );
+  };
+
+  const renderSpeed = (): React.ReactNode => {
+    const movementInfo = extra.getMovementInfo();
+
+    const { data, label, showTooltip } = movementInfo;
+
+    let contentNode: React.ReactNode = null;
+    if (data !== null) {
+      contentNode = (
+        <React.Fragment>
+          <div className="ct-extra-row__speed-value">
+            <NumberDisplay type="distanceInFt" number={data.speed} />
+            {showTooltip && renderAdditionalInfoTooltip()}
+          </div>
+          {data.movementId !== Constants.MovementTypeEnum.WALK && (
+            <div className="ct-extra-row__speed-callout">{label}</div>
+          )}
+        </React.Fragment>
+      );
+    } else {
+      contentNode = (
+        <div className="ct-extra-row__speed-value">
+          --
+          {showTooltip && renderAdditionalInfoTooltip()}
+        </div>
+      );
+    }
+
+    return (
+      <div
+        className={`ct-extra-row__speed ${
+          theme.isDarkMode ? "ct-extra-row__speed--dark-mode" : ""
+        }`}
+      >
+        {contentNode}
+      </div>
+    );
+  };
+
+  const renderArmorClass = (): React.ReactNode => {
+    let armorClassInfo = extra.getArmorClassInfo();
+
+    let armorClassText: string | number = "--";
+    if (armorClassInfo.value !== null) {
+      armorClassText = armorClassInfo.value;
+    }
+
+    return (
+      <React.Fragment>
+        {armorClassText}
+        {armorClassInfo.showTooltip && renderAdditionalInfoTooltip()}
+      </React.Fragment>
+    );
+  };
+
+  const renderAdditionalInfoTooltip = (): React.ReactNode => {
+    return (
+      <Tooltip
+        isDarkMode={theme.isDarkMode}
+        title={"View the full description for additional info"}
+        className={`ct-extra-row__tooltip ${
+          theme.isDarkMode ? "ct-extra-row__tooltip--dark-mode" : ""
+        }`}
+      >
+        *
+      </Tooltip>
+    );
+  };
+
+  return (
+    <div className="ct-extra-row" onClick={handleClick}>
+      <div className="ct-extra-row__preview">
+        {avatarUrl && (
+          <img
+            className="ct-extra-row__img"
+            src={avatarUrl}
+            alt={`${name} preview`}
+          />
+        )}
+      </div>
+      <div className="ct-extra-row__primary">
+        <div
+          className={`ct-extra-row__name ${
+            theme.isDarkMode ? "ct-extra-row__name--dark-mode" : ""
+          }`}
+        >
+          <ExtraName theme={theme} extra={extra} />
+        </div>
+        {renderMetaItems()}
+      </div>
+      <div
+        className={`ct-extra-row__ac ${
+          theme.isDarkMode ? "ct-extra-row__ac--dark-mode" : ""
+        }`}
+      >
+        {renderArmorClass()}
+      </div>
+      {renderHitPoints()}
+      {renderSpeed()}
+      {showNotes && (
+        <div className="ct-extra-row__notes">
+          <NoteComponents theme={theme} notes={extra.getNoteComponents()} />
+        </div>
+      )}
+      {/*<div className="ct-extra-row__action">
+                  <SlotManager
+                      used={isActive ? 1 : 0}
+                      available={1}
+                      size="small"
+                      onUse={this.handleActivate}
+                      onClear={this.handleDeactivate}
+                      isInteractive={!isReadonly}
+                  />
+              </div>*/}
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/components/HealthAdjuster/HealthAdjuster.tsx b/ddb_main/tools/js/Shared/components/HealthAdjuster/HealthAdjuster.tsx
new file mode 100644
index 0000000..d7aee92
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/HealthAdjuster/HealthAdjuster.tsx
@@ -0,0 +1,286 @@
+import React from "react";
+
+import {
+  CharacterHitPointChange,
+  CharacterUtils,
+  HelperUtils,
+  HitPointInfo,
+} from "@dndbeyond/character-rules-engine/es";
+
+import ThemeButton from "../common/Button/ThemeButton";
+
+interface Props {
+  hitPointInfo: HitPointInfo;
+  enableVibration: boolean;
+  onSave?: (amount: number) => void;
+  onCancel?: () => void;
+  vibrationAmount: number;
+}
+interface State {
+  tickCount: number;
+  healingAmount: number | null;
+  damageAmount: number | null;
+  isDirtyHitPoints: boolean;
+}
+export default class HealthAdjuster extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    enableVibration: true,
+    vibrationAmount: 15,
+  };
+
+  defaultState = {
+    tickCount: 0,
+    healingAmount: 0,
+    damageAmount: 0,
+    isDirtyHitPoints: false,
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      ...this.defaultState,
+    };
+  }
+
+  reset = (): void => {
+    this.setState(this.defaultState);
+  };
+
+  getDirtyHitPointsChange = (): number => {
+    const { tickCount, healingAmount, damageAmount } = this.state;
+
+    let healingAmountValue: number = healingAmount === null ? 0 : healingAmount;
+    let damageAmountValue: number = damageAmount === null ? 0 : damageAmount;
+
+    return tickCount + healingAmountValue + damageAmountValue;
+  };
+
+  calculateHitPoints = (): CharacterHitPointChange => {
+    const { hitPointInfo } = this.props;
+
+    return CharacterUtils.calculateHitPoints(
+      hitPointInfo,
+      this.getDirtyHitPointsChange()
+    );
+  };
+
+  handleIncrease = (): void => {
+    const { enableVibration, vibrationAmount } = this.props;
+
+    this.setState((prevState: State) => {
+      let newHealing: number | null = prevState.healingAmount;
+      let newDamage: number | null = prevState.damageAmount;
+
+      if (prevState.damageAmount === null || prevState.damageAmount === 0) {
+        newHealing =
+          prevState.healingAmount === null ? 1 : prevState.healingAmount + 1;
+        newDamage = 0;
+      } else if (prevState.damageAmount < 0) {
+        newDamage = prevState.damageAmount + 1;
+      }
+
+      return {
+        healingAmount: newHealing,
+        damageAmount: newDamage,
+        isDirtyHitPoints: true,
+      };
+    });
+
+    if (enableVibration && navigator.vibrate) {
+      navigator.vibrate(vibrationAmount);
+    }
+  };
+
+  handleDecrease = (): void => {
+    const { enableVibration, vibrationAmount } = this.props;
+
+    this.setState((prevState: State) => {
+      let newHealing: number | null = prevState.healingAmount;
+      let newDamage: number | null = prevState.damageAmount;
+
+      if (prevState.healingAmount === null || prevState.healingAmount === 0) {
+        newDamage =
+          prevState.damageAmount === null ? -1 : prevState.damageAmount - 1;
+        newHealing = 0;
+      } else if (prevState.healingAmount > 0) {
+        newHealing = prevState.healingAmount - 1;
+      }
+
+      return {
+        healingAmount: newHealing,
+        damageAmount: newDamage,
+        isDirtyHitPoints: true,
+      };
+    });
+
+    if (enableVibration && navigator.vibrate) {
+      navigator.vibrate(vibrationAmount);
+    }
+  };
+
+  handleTickChange = (tickCount: number): void => {
+    const { enableVibration, vibrationAmount } = this.props;
+
+    this.setState({
+      tickCount,
+      isDirtyHitPoints: true,
+    });
+
+    if (enableVibration && navigator.vibrate) {
+      navigator.vibrate(vibrationAmount);
+    }
+  };
+
+  handleHealingSet = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    let value = HelperUtils.parseInputInt(evt.target.value);
+
+    this.setState({
+      tickCount: 0,
+      healingAmount: value === null ? value : HelperUtils.clampInt(value, 0),
+      damageAmount: 0,
+      isDirtyHitPoints: true,
+    });
+  };
+
+  handleDamageSet = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    let value = HelperUtils.parseInputInt(evt.target.value);
+
+    this.setState({
+      tickCount: 0,
+      healingAmount: 0,
+      damageAmount:
+        value === null ? value : HelperUtils.clampInt(value, 0) * -1,
+      isDirtyHitPoints: true,
+    });
+  };
+
+  handleSave = (): void => {
+    const { onSave } = this.props;
+
+    if (onSave) {
+      onSave(this.getDirtyHitPointsChange());
+    }
+
+    this.reset();
+  };
+
+  handleCancel = (): void => {
+    const { onCancel } = this.props;
+
+    if (onCancel) {
+      onCancel();
+    }
+
+    this.reset();
+  };
+
+  renderActions = (): React.ReactNode => {
+    const { isDirtyHitPoints } = this.state;
+
+    if (!isDirtyHitPoints) {
+      return null;
+    }
+
+    return (
+      <div className="ct-health-adjuster__actions">
+        <div className="ct-health-adjuster__action">
+          <ThemeButton onClick={this.handleSave}>Apply Changes</ThemeButton>
+        </div>
+        <div className="ct-health-adjuster__action">
+          <ThemeButton onClick={this.handleCancel} style="outline">
+            Cancel
+          </ThemeButton>
+        </div>
+      </div>
+    );
+  };
+
+  render() {
+    const { healingAmount, damageAmount } = this.state;
+    const { hitPointInfo } = this.props;
+
+    let healingDisplay: React.ReactText =
+      healingAmount === null ? "" : Math.max(this.getDirtyHitPointsChange(), 0);
+    let damageDisplay: React.ReactText =
+      damageAmount === null
+        ? ""
+        : Math.abs(Math.min(this.getDirtyHitPointsChange(), 0));
+
+    const { newTemp, newHp } = this.calculateHitPoints();
+
+    let hpDiffClassNames: Array<string> = ["ct-health-adjuster__new"];
+    if (newHp > hitPointInfo.remainingHp) {
+      hpDiffClassNames.push("ct-health-adjuster__status--positive");
+    } else if (newHp < hitPointInfo.remainingHp) {
+      hpDiffClassNames.push("ct-health-adjuster__status--negative");
+    }
+
+    let tempDiffClassNames: Array<string> = ["ct-health-adjuster__new"];
+    if (hitPointInfo.tempHp !== null) {
+      if (newTemp > hitPointInfo.tempHp) {
+        tempDiffClassNames.push("ct-health-adjuster__status--positive");
+      } else if (newTemp < hitPointInfo.tempHp) {
+        tempDiffClassNames.push("ct-health-adjuster__status--negative");
+      }
+    }
+
+    return (
+      <div className="ct-health-adjuster">
+        <div className="ct-health-adjuster__controls">
+          <div className="ct-health-adjuster__details">
+            <div className="ct-health-adjuster__healing">
+              <div className="ct-health-adjuster__healing-label">Healing</div>
+              <div className="ct-health-adjuster__healing-value">
+                <input
+                  className="ct-health-adjuster__healing-input"
+                  type="number"
+                  value={healingDisplay}
+                  onChange={this.handleHealingSet}
+                />
+              </div>
+            </div>
+            <div className="ct-health-adjuster__updates">
+              <div className={hpDiffClassNames.join(" ")}>
+                <div className="ct-health-adjuster__new-label">New HP</div>
+                <div className="ct-health-adjuster__new-value">{newHp}</div>
+              </div>
+              {hitPointInfo.tempHp !== null && hitPointInfo.tempHp > 0 && (
+                <div className={tempDiffClassNames.join(" ")}>
+                  <div className="ct-health-adjuster__new-label">New Temp</div>
+                  <div className="ct-health-adjuster__new-value">{newTemp}</div>
+                </div>
+              )}
+            </div>
+            <div className="ct-health-adjuster__damage">
+              <div className="ct-health-adjuster__damage-label">Damage</div>
+              <div className="ct-health-adjuster__damage-value">
+                <input
+                  className="ct-health-adjuster__damage-input"
+                  type="number"
+                  value={damageDisplay}
+                  onChange={this.handleDamageSet}
+                />
+              </div>
+            </div>
+          </div>
+          <div className="ct-health-adjuster__buttons">
+            <div className="ct-health-adjuster__button ct-health-adjuster__button--increase">
+              <ThemeButton
+                className="action-increase"
+                onClick={this.handleIncrease}
+              />
+            </div>
+            <div className="ct-health-adjuster__button ct-health-adjuster__button--decrease">
+              <ThemeButton
+                className="action-decrease"
+                onClick={this.handleDecrease}
+              />
+            </div>
+          </div>
+        </div>
+        {this.renderActions()}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/HealthAdjuster/index.ts b/ddb_main/tools/js/Shared/components/HealthAdjuster/index.ts
new file mode 100644
index 0000000..4b1e9a8
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/HealthAdjuster/index.ts
@@ -0,0 +1,4 @@
+import HealthAdjuster from "./HealthAdjuster";
+
+export default HealthAdjuster;
+export { HealthAdjuster };
diff --git a/ddb_main/tools/js/Shared/components/InfusionChoiceManager/InfusionChoiceManager.tsx b/ddb_main/tools/js/Shared/components/InfusionChoiceManager/InfusionChoiceManager.tsx
new file mode 100644
index 0000000..3ae254f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/InfusionChoiceManager/InfusionChoiceManager.tsx
@@ -0,0 +1,625 @@
+import axios, { Canceler } from "axios";
+import { orderBy } from "lodash";
+import * as React from "react";
+
+import { LoadingPlaceholder, Select } from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiAdapterUtils,
+  ApiResponse,
+  Constants,
+  ContainerManager,
+  DefinitionPool,
+  DefinitionPoolUtils,
+  DefinitionUtils,
+  EntitledEntity,
+  HelperUtils,
+  HtmlSelectOption,
+  HtmlSelectOptionGroup,
+  InfusionChoice,
+  InfusionChoiceUtils,
+  InfusionDefinitionContract,
+  InfusionUtils,
+  InventoryManager,
+  Item,
+  ItemUtils,
+  KnownInfusionUtils,
+  Modifier,
+  RuleData,
+  RuleDataUtils,
+  TypeValueLookup,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+
+import DataLoadingStatusEnum from "../../constants/DataLoadingStatusEnum";
+import { AppLoggerUtils, TypeScriptUtils } from "../../utils";
+
+type OnInfusionChangeFunc = (
+  choiceKey: string,
+  infusionId: string | null,
+  oldInfusionId: string | null,
+  accept: () => void,
+  reject: () => void
+) => void;
+
+interface Props {
+  infusionChoices: Array<InfusionChoice>;
+  contextLevel: number | null;
+  globalModifiers: Array<Modifier>;
+  typeValueLookup: TypeValueLookup;
+  ruleData: RuleData;
+  definitionPool: DefinitionPool;
+  knownInfusionLookup: Record<string, InfusionChoice>;
+  knownReplicatedItems: Array<string>;
+  onInfusionChoiceItemChangePromise?: (
+    infusionChoiceKey: string,
+    infusionId: string,
+    itemDefinitionKey: string,
+    itemName: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceItemDestroyPromise?: (
+    infusionChoiceKey: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceChangePromise?: (
+    infusionChoiceKey: string,
+    infusionId: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceDestroyPromise?: (
+    infusionChoiceKey: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  onInfusionChoiceCreatePromise?: (
+    infusionChoiceKey: string,
+    infusionId: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  loadAvailableInfusions: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<
+    ApiResponse<EntitledEntity<InfusionDefinitionContract>>
+  >;
+  onDefinitionsLoaded?: (
+    definitions: Array<InfusionDefinitionContract>,
+    accessTypes: Record<string, number>
+  ) => void;
+  inventoryManager: InventoryManager;
+}
+interface State {
+  equipment: Array<Item>;
+  loadingStatus: DataLoadingStatusEnum;
+}
+class InfusionChoiceManager extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    loadAvailableInfusions: null,
+  };
+
+  loadItemsCanceler: null | Canceler = null;
+  loadInfusionsCanceler: null | Canceler = null;
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      equipment: [],
+      loadingStatus: DataLoadingStatusEnum.NOT_LOADED,
+    };
+  }
+
+  componentDidMount() {
+    const { loadingStatus } = this.state;
+    const {
+      infusionChoices,
+      inventoryManager,
+      loadAvailableInfusions,
+      globalModifiers,
+      typeValueLookup,
+      ruleData,
+      onDefinitionsLoaded,
+    } = this.props;
+
+    if (
+      infusionChoices.length &&
+      loadingStatus === DataLoadingStatusEnum.NOT_LOADED
+    ) {
+      this.setState({
+        loadingStatus: DataLoadingStatusEnum.LOADING,
+      });
+
+      // TODO fix typings "any" once axios fixes how all can have multiple return types
+      axios
+        .all<any>([
+          inventoryManager.getInventoryShoppe({
+            onSuccess: (shoppeContainer: ContainerManager) => {
+              this.setState({
+                equipment: shoppeContainer
+                  .getInventoryItems()
+                  .items.map((item) => item.getItem()),
+                loadingStatus: DataLoadingStatusEnum.LOADED,
+              });
+            },
+            additionalApiConfig: {
+              cancelToken: new axios.CancelToken((c) => {
+                this.loadItemsCanceler = c;
+              }),
+            },
+          }),
+          loadAvailableInfusions({
+            cancelToken: new axios.CancelToken((c) => {
+              this.loadInfusionsCanceler = c;
+            }),
+          }),
+        ])
+        .then(([equipmentResponse, infusionResponse]) => {
+          //do nothing with equipmentResponse since we moved converted to the inventoryManager which sets state on onsuccess
+
+          let infusionData =
+            ApiAdapterUtils.getResponseData<
+              EntitledEntity<InfusionDefinitionContract>
+            >(infusionResponse);
+          if (
+            infusionData &&
+            infusionData.definitionData.length > 0 &&
+            onDefinitionsLoaded
+          ) {
+            onDefinitionsLoaded(
+              infusionData.definitionData,
+              infusionData.accessTypes
+            );
+          }
+
+          this.loadItemsCanceler = null;
+          this.loadInfusionsCanceler = null;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    }
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadItemsCanceler !== null) {
+      this.loadItemsCanceler();
+    }
+    if (this.loadInfusionsCanceler !== null) {
+      this.loadInfusionsCanceler();
+    }
+  }
+
+  getItemKeyParts = (itemKey: string): Array<string> => {
+    return itemKey.split("|");
+  };
+
+  getItemKey = (id: number, name: string): string => {
+    return [
+      DefinitionUtils.hack__generateDefinitionKey(
+        Constants.FUTURE_ITEM_DEFINITION_TYPE,
+        id
+      ),
+      name,
+    ].join("|");
+  };
+
+  handleChoiceItemChangePromise = (
+    infusionChoice: InfusionChoice,
+    itemKey: string | null,
+    oldItemKey: string | null,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const {
+      onInfusionChoiceItemChangePromise,
+      onInfusionChoiceItemDestroyPromise,
+    } = this.props;
+
+    const choiceKey = InfusionChoiceUtils.getKey(infusionChoice);
+
+    if (choiceKey === null) {
+      reject();
+      return;
+    }
+
+    if (itemKey) {
+      if (onInfusionChoiceItemChangePromise) {
+        const knownInfusion =
+          InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+        if (knownInfusion === null) {
+          reject();
+          return;
+        }
+
+        const simulatedInfusion =
+          KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+        if (simulatedInfusion === null) {
+          reject();
+          return;
+        }
+
+        const infusionId = InfusionUtils.getId(simulatedInfusion);
+        if (infusionId === null) {
+          reject();
+          return;
+        }
+
+        const itemKeyParts = this.getItemKeyParts(itemKey);
+
+        onInfusionChoiceItemChangePromise(
+          choiceKey,
+          infusionId,
+          itemKeyParts[0],
+          itemKeyParts[1],
+          accept,
+          reject
+        );
+      }
+    } else {
+      if (onInfusionChoiceItemDestroyPromise) {
+        onInfusionChoiceItemDestroyPromise(choiceKey, accept, reject);
+      }
+    }
+  };
+
+  handleChoiceChangePromise = (
+    choiceKey: string,
+    infusionId: string | null,
+    oldInfusionId: string | null,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { onInfusionChoiceChangePromise, onInfusionChoiceDestroyPromise } =
+      this.props;
+
+    if (infusionId) {
+      if (onInfusionChoiceChangePromise) {
+        onInfusionChoiceChangePromise(choiceKey, infusionId, accept, reject);
+      }
+    } else {
+      if (onInfusionChoiceDestroyPromise) {
+        onInfusionChoiceDestroyPromise(choiceKey, accept, reject);
+      }
+    }
+  };
+
+  handleChoiceCreatePromise = (
+    choiceKey: string,
+    infusionId: string,
+    oldInfusionId: string | null,
+    accept: () => void,
+    reject: () => void
+  ) => {
+    const { onInfusionChoiceCreatePromise } = this.props;
+
+    if (onInfusionChoiceCreatePromise) {
+      onInfusionChoiceCreatePromise(choiceKey, infusionId, accept, reject);
+    }
+  };
+
+  renderInfusionReplicateItemChoice = (
+    infusionChoice: InfusionChoice
+  ): React.ReactNode => {
+    const { equipment, loadingStatus } = this.state;
+    const { contextLevel, knownReplicatedItems } = this.props;
+
+    let knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return null;
+    }
+
+    let simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (
+      simulatedInfusion === null ||
+      InfusionUtils.getType(simulatedInfusion) !==
+        Constants.InfusionTypeEnum.REPLICATE
+    ) {
+      return null;
+    }
+
+    let contentNode: React.ReactNode;
+    const classNames: Array<string> = [
+      "ct-infusion-choice-manager__choice",
+      "ct-infusion-choice-manager__choice--child",
+    ];
+
+    if (loadingStatus !== DataLoadingStatusEnum.LOADED) {
+      contentNode = <LoadingPlaceholder />;
+    } else {
+      let groups: Array<HtmlSelectOptionGroup> = [];
+      let infusableItems: Array<Item> = equipment.filter((item) => {
+        const levelInfusionGranted = ItemUtils.getLevelInfusionGranted(item);
+        const itemDefinitionKey = ItemUtils.getDefinitionKey(item);
+        let chosenItemDefinitionKey: string | null = null;
+        if (knownInfusion !== null) {
+          chosenItemDefinitionKey =
+            KnownInfusionUtils.getItemDefinitionKey(knownInfusion);
+        }
+        const hasKnownReplicatedItem: boolean =
+          knownReplicatedItems.includes(itemDefinitionKey);
+        if (
+          hasKnownReplicatedItem &&
+          chosenItemDefinitionKey === itemDefinitionKey
+        ) {
+          return true;
+        }
+
+        return (
+          !hasKnownReplicatedItem &&
+          levelInfusionGranted !== null &&
+          contextLevel !== null &&
+          contextLevel >= levelInfusionGranted
+        );
+      });
+
+      let orderedInfusableItems = orderBy(infusableItems, (item) =>
+        ItemUtils.getName(item)
+      );
+
+      orderedInfusableItems.forEach((item) => {
+        const levelInfusionGranted = ItemUtils.getLevelInfusionGranted(item);
+
+        if (levelInfusionGranted === null) {
+          return;
+        }
+
+        if (!groups.hasOwnProperty(levelInfusionGranted)) {
+          groups[levelInfusionGranted] = {
+            optGroupLabel: `Level ${levelInfusionGranted}`,
+            options: [],
+          };
+        }
+
+        const definitionName = ItemUtils.getDefinitionName(item);
+        groups[levelInfusionGranted].options.push({
+          label: definitionName,
+          value: this.getItemKey(
+            ItemUtils.getId(item),
+            definitionName === null ? "" : definitionName
+          ),
+        });
+      });
+
+      groups.forEach((group) => {
+        group.options = orderBy(
+          group.options,
+          (option: HtmlSelectOption) => option.label
+        );
+      });
+
+      let selectedValue: string | null = null;
+      let knownItemId = KnownInfusionUtils.getItemId(knownInfusion);
+      let knownItemName = KnownInfusionUtils.getItemName(knownInfusion);
+      if (knownItemId && knownItemName) {
+        selectedValue = this.getItemKey(knownItemId, knownItemName);
+      }
+
+      if (selectedValue === null) {
+        classNames.push("ct-infusion-choice-manager__choice--todo");
+      }
+
+      contentNode = (
+        <Select
+          options={groups}
+          onChangePromise={this.handleChoiceItemChangePromise.bind(
+            this,
+            infusionChoice
+          )}
+          value={selectedValue}
+        />
+      );
+    }
+
+    return <div className={classNames.join(" ")}>{contentNode}</div>;
+  };
+
+  renderInfusionChoice = (infusionChoice: InfusionChoice): React.ReactNode => {
+    const { ruleData, knownInfusionLookup, definitionPool, contextLevel } =
+      this.props;
+
+    // TODO check typing once definition pool is updated
+    let infusionDefinitions = DefinitionPoolUtils.getTypedDefinitionList(
+      Constants.DefinitionTypeEnum.INFUSION,
+      definitionPool,
+      true
+    );
+    let infusionOptions: Array<HtmlSelectOption> = infusionDefinitions
+      .map((infusionDefinition) =>
+        InfusionUtils.simulateInfusion(
+          DefinitionUtils.getDefinitionKey(infusionDefinition),
+          definitionPool
+        )
+      )
+      .filter(TypeScriptUtils.isNotNullOrUndefined)
+      .filter((infusion) => {
+        // if the infusion allows duplicates just let it through
+        if (InfusionUtils.getAllowDuplicates(infusion)) {
+          return true;
+        }
+
+        const infusionDefinitionKey = InfusionUtils.getDefinitionKey(infusion);
+        let knownInfusion =
+          InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+        // if choice has the infusion, show it in the list
+        if (
+          knownInfusion !== null &&
+          KnownInfusionUtils.getDefinitionKey(knownInfusion) ===
+            infusionDefinitionKey
+        ) {
+          return true;
+        }
+
+        // if its already selected somewhere else and is here, it shouldnt be shown
+        if (
+          infusionDefinitionKey !== null &&
+          HelperUtils.lookupDataOrFallback(
+            knownInfusionLookup,
+            infusionDefinitionKey
+          )
+        ) {
+          return false;
+        }
+
+        if (
+          !InfusionUtils.validateIsAvailableByContextLevel(
+            infusion,
+            contextLevel
+          )
+        ) {
+          return false;
+        }
+
+        return true;
+      })
+      .map((infusion) => {
+        let label: string | null = InfusionUtils.getName(infusion);
+
+        const sources = InfusionUtils.getSources(infusion);
+
+        const hasAllToggleableSources: boolean = sources.every(
+          (sourceMapping) => {
+            const sourceDataInfo = RuleDataUtils.getSourceDataInfo(
+              sourceMapping.sourceId,
+              ruleData
+            );
+            return sourceDataInfo?.sourceCategory?.isToggleable;
+          }
+        );
+
+        if (sources.length && hasAllToggleableSources) {
+          const calloutSources: Array<string> = sources
+            .map((sourceMapping) => {
+              const sourceDataInfo = RuleDataUtils.getSourceDataInfo(
+                sourceMapping.sourceId,
+                ruleData
+              );
+              return sourceDataInfo?.name ?? null;
+            })
+            .filter(TypeScriptUtils.isNotNullOrUndefined);
+
+          label = `${calloutSources.join(", ")} • ${label}`;
+        }
+
+        const infusionId = InfusionUtils.getId(infusion);
+        return {
+          label,
+          value: infusionId ?? "",
+        };
+      });
+
+    let knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+
+    //TODO this typing is weird because of the binding that will happen further down... may need to split this into more components to remove the bind and make more sense
+    let onChangePromise: OnInfusionChangeFunc = this.handleChoiceCreatePromise;
+    if (knownInfusion !== null) {
+      onChangePromise = this.handleChoiceChangePromise;
+    }
+
+    let warningNode: React.ReactNode;
+    let descriptionNode: React.ReactNode;
+    const classNames: Array<string> = ["ct-infusion-choice-manager__choice"];
+    if (knownInfusion === null) {
+      classNames.push("ct-infusion-choice-manager__choice--todo");
+    } else {
+      const simulatedInfusion =
+        KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+      if (simulatedInfusion !== null) {
+        const description = InfusionUtils.getDescription(simulatedInfusion);
+        if (description !== null) {
+          descriptionNode = (
+            <HtmlContent
+              className="ct-infusion-choice-manager__choice-description"
+              html={description}
+              withoutTooltips
+            />
+          );
+        }
+
+        if (
+          !InfusionUtils.validateIsAvailableByContextLevel(
+            simulatedInfusion,
+            contextLevel
+          )
+        ) {
+          classNames.push("ct-infusion-choice-manager__choice--warning");
+          warningNode = (
+            <div className="ct-infusion-choice-manager__choice-warning">
+              <strong>{InfusionUtils.getName(simulatedInfusion)}</strong> is not
+              a valid choice because it requires level{" "}
+              <strong>{InfusionUtils.getLevel(simulatedInfusion)}</strong>.
+            </div>
+          );
+        }
+      }
+    }
+
+    let knownInfusionDefinitionKey: string | null = null;
+    if (knownInfusion !== null) {
+      knownInfusionDefinitionKey =
+        KnownInfusionUtils.getDefinitionKey(knownInfusion);
+    }
+
+    const choiceKey = InfusionChoiceUtils.getKey(infusionChoice);
+    return (
+      <div
+        className={classNames.join(" ")}
+        key={choiceKey === null ? "" : choiceKey}
+      >
+        <Select
+          options={infusionOptions}
+          placeholder={`- Choose a Level ${InfusionChoiceUtils.getLevel(
+            infusionChoice
+          )} Option -`}
+          onChangePromise={onChangePromise.bind(this, choiceKey)}
+          value={
+            knownInfusionDefinitionKey === null
+              ? null
+              : DefinitionUtils.getDefinitionKeyId(knownInfusionDefinitionKey)
+          }
+        />
+        {this.renderInfusionReplicateItemChoice(infusionChoice)}
+        {warningNode}
+        {descriptionNode}
+      </div>
+    );
+    //`
+  };
+
+  render() {
+    const { loadingStatus } = this.state;
+    const { infusionChoices } = this.props;
+
+    if (!infusionChoices.length) {
+      return null;
+    }
+
+    let contentNode: React.ReactNode;
+    if (loadingStatus !== DataLoadingStatusEnum.LOADED) {
+      contentNode = <LoadingPlaceholder />;
+    } else {
+      contentNode = (
+        <React.Fragment>
+          {infusionChoices.map((infusionChoice) =>
+            this.renderInfusionChoice(infusionChoice)
+          )}
+        </React.Fragment>
+      );
+    }
+
+    return (
+      <div className="ct-infusion-choice-manager">
+        <div className="ct-infusion-choice-manager__header">
+          Infusion Choices
+        </div>
+        {contentNode}
+      </div>
+    );
+  }
+}
+
+export default InfusionChoiceManager;
diff --git a/ddb_main/tools/js/Shared/components/InfusionChoiceManager/index.ts b/ddb_main/tools/js/Shared/components/InfusionChoiceManager/index.ts
new file mode 100644
index 0000000..eac6305
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/InfusionChoiceManager/index.ts
@@ -0,0 +1,4 @@
+import InfusionChoiceManager from "./InfusionChoiceManager";
+
+export default InfusionChoiceManager;
+export { InfusionChoiceManager };
diff --git a/ddb_main/tools/js/Shared/components/ItemDetail/ItemDetail.tsx b/ddb_main/tools/js/Shared/components/ItemDetail/ItemDetail.tsx
new file mode 100644
index 0000000..89acca5
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ItemDetail/ItemDetail.tsx
@@ -0,0 +1,1015 @@
+import React, { ReactNode, useContext } from "react";
+
+import {
+  Checkbox,
+  Collapsible,
+  ComponentConstants,
+  Damage,
+  DamageTypeIcon,
+  DataOriginName,
+  InfusionPreview,
+} from "@dndbeyond/character-components/es";
+import {
+  Action,
+  ActionUtils,
+  CharacterTheme,
+  CharacterUtils,
+  Constants,
+  Container,
+  ContainerUtils,
+  DataOrigin,
+  DiceUtils,
+  EntityValueLookup,
+  FormatUtils,
+  Infusion,
+  InfusionChoiceLookup,
+  InventoryManager,
+  Item,
+  ItemUtils,
+  PartyInfo,
+  RuleData,
+  RuleDataUtils,
+  SnippetData,
+  SourceMappingContract,
+  Spell,
+  SpellUtils,
+  ValueUtils,
+  WeaponSpellDamageGroup,
+} from "@dndbeyond/character-rules-engine/es";
+import StarIcon from "@dndbeyond/fontawesome-cache/svgs/solid/star.svg";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { InfoItem } from "~/components/InfoItem";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { Reference } from "~/components/Reference";
+import { TagGroup } from "~/components/TagGroup";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import ItemDetailAbilities from "../../containers/ItemDetailAbilities";
+import ItemDetailActions from "../../containers/ItemDetailActions";
+import { InventoryManagerContext } from "../../managers/InventoryManagerContext";
+import CustomizeDataEditor from "../CustomizeDataEditor";
+import EditorBox from "../EditorBox";
+import ValueEditor from "../ValueEditor";
+import { RemoveButton } from "../common/Button";
+import styles from "./styles.module.css";
+
+const infoItemProps = { role: "listitem", inline: true };
+
+interface Props {
+  item: Item;
+  weaponSpellDamageGroups: Array<WeaponSpellDamageGroup>;
+  ruleData: RuleData;
+  snippetData: SnippetData;
+  className: string;
+  showAbilities: boolean;
+  showCustomize: boolean;
+  showActions: boolean;
+  showIntro: boolean;
+  showImage: boolean;
+  onCustomDataUpdate?: (
+    adjustmentType: Constants.AdjustmentTypeEnum,
+    value: any
+  ) => void;
+  onCustomizationsRemove?: () => void;
+  onCustomItemEdit?: (data: Record<string, any>) => void;
+  onDataOriginClick?: (dataOrigin: DataOrigin) => void;
+  onSpellClick?: (spell: Spell) => void;
+  onInfusionClick?: (infusion: Infusion) => void;
+  onMasteryActionClick?: (action: Action) => void;
+  entityValueLookup: EntityValueLookup;
+  infusionChoiceLookup: InfusionChoiceLookup;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  container: Container | null;
+  onPostRemoveNavigation?: PaneComponentEnum;
+  partyInfo: PartyInfo;
+  inventoryManager: InventoryManager;
+  isCustomizeClosed?: boolean;
+  onCustomizeClick?: (isCollapsed: boolean) => void;
+  actions: Array<Action>;
+}
+export class ItemDetail extends React.PureComponent<Props> {
+  static defaultProps = {
+    weaponSpellDamageGroups: [],
+    className: "",
+    showCustomize: true,
+    showAbilities: true,
+    showActions: true,
+    showIntro: true,
+    showImage: true,
+    snippetData: null,
+    entityValueLookup: {},
+    infusionChoiceLookup: {},
+    isReadonly: false,
+    container: null,
+  };
+
+  handleSpellClick = (spell: Spell, evt: React.MouseEvent): void => {
+    const { onSpellClick } = this.props;
+
+    if (onSpellClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onSpellClick(spell);
+    }
+  };
+
+  handleInfusionClick = () => {
+    const { item, onInfusionClick } = this.props;
+
+    const infusion = ItemUtils.getInfusion(item);
+    if (onInfusionClick && infusion) {
+      onInfusionClick(infusion);
+    }
+  };
+
+  handleMasteryActionClick = (evt: React.MouseEvent) => {
+    const { item, onMasteryActionClick, actions } = this.props;
+
+    const masteryAction = ItemUtils.getMasteryAction(item, actions);
+    if (masteryAction && onMasteryActionClick) {
+      onMasteryActionClick(masteryAction);
+    }
+  };
+
+  handleHexWeaponChange = (enabled) => {
+    const { onCustomDataUpdate } = this.props;
+
+    if (onCustomDataUpdate) {
+      onCustomDataUpdate(Constants.AdjustmentTypeEnum.IS_HEXBLADE, enabled);
+    }
+  };
+
+  handleDedicatedWeaponChange = (enabled) => {
+    const { onCustomDataUpdate } = this.props;
+
+    if (onCustomDataUpdate) {
+      onCustomDataUpdate(
+        Constants.AdjustmentTypeEnum.IS_DEDICATED_WEAPON,
+        enabled
+      );
+    }
+  };
+
+  handlePactWeaponChange = (enabled) => {
+    const { onCustomDataUpdate, item } = this.props;
+
+    if (onCustomDataUpdate) {
+      const isHexWeapon = ItemUtils.isHexWeapon(item);
+      if (
+        !enabled &&
+        isHexWeapon &&
+        !this.shouldShowDependentHexWeapons(enabled)
+      ) {
+        onCustomDataUpdate(Constants.AdjustmentTypeEnum.IS_HEXBLADE, null);
+      }
+      onCustomDataUpdate(Constants.AdjustmentTypeEnum.IS_PACT_WEAPON, enabled);
+    }
+  };
+
+  handleRemoveCustomizations = () => {
+    const { onCustomizationsRemove } = this.props;
+
+    if (onCustomizationsRemove) {
+      onCustomizationsRemove();
+    }
+  };
+
+  shouldShowDependentHexWeapons = (isPactWeapon) => {
+    const { item } = this.props;
+
+    return (
+      isPactWeapon ||
+      (!isPactWeapon &&
+        !ItemUtils.hasWeaponProperty(
+          item,
+          Constants.WeaponPropertyEnum.TWO_HANDED
+        ))
+    );
+  };
+
+  shouldShowHexWeapon = () => {
+    const { item } = this.props;
+
+    const canHexWeapon = ItemUtils.canHexWeapon(item);
+    const isPactWeapon = ItemUtils.isPactWeapon(item);
+    const canPactWeapon = ItemUtils.canPactWeapon(item);
+    const hexWeaponEnabled = ItemUtils.hexWeaponEnabled(item);
+
+    if (!hexWeaponEnabled) {
+      return false;
+    }
+
+    let showHexWeapon = false;
+    if (canPactWeapon) {
+      showHexWeapon = this.shouldShowDependentHexWeapons(isPactWeapon);
+    } else {
+      showHexWeapon = canHexWeapon;
+    }
+    return showHexWeapon;
+  };
+
+  getSourceReference = (item: Item): ReactNode => {
+    const { theme, ruleData } = this.props;
+
+    let sourceId: number | null = null;
+    let sourcePage: number | null = null;
+    let filteredSources = ItemUtils.getSources(item).filter(
+      CharacterUtils.isPrimarySource
+    );
+    if (filteredSources.length) {
+      let primarySource: SourceMappingContract = filteredSources[0];
+      sourceId = primarySource.sourceId;
+      sourcePage = primarySource.pageNumber;
+    }
+
+    if (sourceId === null) {
+      return null;
+    }
+
+    return (
+      <InfoItem label="Source:" {...infoItemProps}>
+        <Reference
+          name={
+            RuleDataUtils.getSourceDataInfo(sourceId, ruleData)?.description ||
+            ""
+          }
+          page={sourcePage}
+          isDarkMode={theme?.isDarkMode}
+        />
+      </InfoItem>
+    );
+  };
+
+  renderIntro = () => {
+    const { item, container, partyInfo, inventoryManager } = this.props;
+
+    let type = ItemUtils.getType(item);
+    const subType = ItemUtils.getSubType(item);
+    const baseArmorName = ItemUtils.getBaseArmorName(item);
+    const rarity = ItemUtils.getRarity(item);
+    const canAttune = ItemUtils.canAttune(item);
+    const equippedEntityId = ItemUtils.getEquippedEntityId(item);
+
+    const attunementDescription = ItemUtils.getAttunementDescription(item);
+    const isCustom = ItemUtils.isCustom(item);
+
+    if (ItemUtils.isWeaponContract(item)) {
+      if (ItemUtils.isMagic(item)) {
+        type = `Weapon (${type})`;
+      } else {
+        type = "Weapon";
+      }
+    } else if (ItemUtils.isArmorContract(item)) {
+      if (ItemUtils.isMagic(item)) {
+        type = `Armor (${baseArmorName})`;
+      } else {
+        type = "Armor";
+      }
+    } else if (ItemUtils.isGearContract(item)) {
+      type = subType ? subType : type;
+    } else if (isCustom) {
+      type = "Custom";
+    }
+
+    return (
+      <>
+        <div className="ct-item-detail__intro">
+          {ItemUtils.isLegacy(item) && "Legacy • "}
+          {type}
+          {!isCustom && rarity ? `, ${rarity}` : ""}
+          {canAttune &&
+            ` (requires attunement${
+              attunementDescription ? ` by a ${attunementDescription}` : ""
+            })`}
+          {ItemUtils.isContainer(item) && ", container"}
+        </div>
+        {container && (
+          <div className="ct-item-detail__intro-subtitle">
+            {" "}
+            {!ItemUtils.isContainer(item)
+              ? ` In ${ContainerUtils.getName(container)}`
+              : ` In ${
+                  ContainerUtils.isShared(container) ? "Party " : ""
+                }Inventory`}
+            <div>
+              {partyInfo &&
+                equippedEntityId &&
+                `${
+                  inventoryManager.isEquippedToCurrentCharacter(item)
+                    ? "Equipped"
+                    : `Equipped by ${inventoryManager.getEquippedCharacterName(
+                        item
+                      )}`
+                }`}
+            </div>
+          </div>
+        )}
+      </>
+    );
+  };
+
+  renderAbilities = () => {
+    const { item } = this.props;
+
+    return <ItemDetailAbilities item={item} />;
+  };
+
+  renderClassCustomize = () => {
+    const { item } = this.props;
+
+    const isHexWeapon = ItemUtils.isHexWeapon(item);
+    const canHexWeapon = ItemUtils.canHexWeapon(item);
+    const isPactWeapon = ItemUtils.isPactWeapon(item);
+    const canPactWeapon = ItemUtils.canPactWeapon(item);
+    const canBeDedicatedWeapon = ItemUtils.canBeDedicatedWeapon(item);
+    const isDedicatedWeapon = ItemUtils.isDedicatedWeapon(item);
+
+    if (!canHexWeapon && !canPactWeapon && !canBeDedicatedWeapon) {
+      return null;
+    }
+
+    return (
+      <div className="ct-item-detail__class-customize">
+        {canPactWeapon && (
+          <div className="ct-item-detail__class-customize-item">
+            <Checkbox
+              initiallyEnabled={isPactWeapon}
+              onChange={this.handlePactWeaponChange}
+              label="Pact Weapon"
+            />
+          </div>
+        )}
+        {this.shouldShowHexWeapon() && (
+          <div className="ct-item-detail__class-customize-item">
+            <Checkbox
+              initiallyEnabled={isHexWeapon}
+              onChange={this.handleHexWeaponChange}
+              label="Hex Weapon"
+            />
+          </div>
+        )}
+        {canBeDedicatedWeapon && (
+          <div className="ct-item-detail__class-customize-item">
+            <Checkbox
+              initiallyEnabled={isDedicatedWeapon}
+              onChange={this.handleDedicatedWeaponChange}
+              label="Dedicated Weapon"
+            />
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  renderCustomItemEdit = (): React.ReactNode => {
+    const { item, onCustomItemEdit } = this.props;
+
+    let originalContract = ItemUtils.getOriginalContract(item);
+    if (!originalContract || !onCustomItemEdit) {
+      return null;
+    }
+
+    const { id, quantity, ...itemData } = originalContract;
+
+    return (
+      <EditorBox>
+        <CustomizeDataEditor
+          data={itemData}
+          enableName={true}
+          enableNotes={true}
+          enableDescription={true}
+          enableCost={true}
+          enableWeight={true}
+          maxNameLength={128}
+          onDataUpdate={onCustomItemEdit}
+        />
+      </EditorBox>
+    );
+  };
+
+  renderCustomize = (): React.ReactNode => {
+    const {
+      item,
+      ruleData,
+      onCustomDataUpdate,
+      entityValueLookup,
+      isReadonly,
+    } = this.props;
+
+    if (isReadonly) {
+      return;
+    }
+
+    const isWeaponLike = ItemUtils.validateIsWeaponLike(item);
+
+    let customizationValues: Array<Constants.AdjustmentTypeEnum> = [];
+    if (isWeaponLike) {
+      customizationValues = [
+        ...customizationValues,
+        Constants.AdjustmentTypeEnum.TO_HIT_OVERRIDE,
+        Constants.AdjustmentTypeEnum.TO_HIT_BONUS,
+        Constants.AdjustmentTypeEnum.FIXED_VALUE_BONUS,
+      ];
+    }
+    customizationValues.push(Constants.AdjustmentTypeEnum.COST_OVERRIDE);
+    customizationValues.push(Constants.AdjustmentTypeEnum.WEIGHT_OVERRIDE);
+    if (ItemUtils.isContainer(item)) {
+      customizationValues.push(
+        Constants.AdjustmentTypeEnum.CAPACITY_WEIGHT_OVERRIDE
+      );
+    }
+    if (ItemUtils.canOffhand(item)) {
+      customizationValues.push(Constants.AdjustmentTypeEnum.IS_OFFHAND);
+    }
+    if (ItemUtils.isWeaponContract(item)) {
+      customizationValues = [
+        ...customizationValues,
+        Constants.AdjustmentTypeEnum.IS_SILVER,
+        Constants.AdjustmentTypeEnum.IS_ADAMANTINE,
+      ];
+    }
+    if (isWeaponLike) {
+      customizationValues.push(Constants.AdjustmentTypeEnum.DISPLAY_AS_ATTACK);
+    }
+    customizationValues.push(Constants.AdjustmentTypeEnum.NAME_OVERRIDE);
+    customizationValues.push(Constants.AdjustmentTypeEnum.NOTES);
+
+    let customizationLabelOverrides: Partial<
+      Record<Constants.AdjustmentTypeEnum, string>
+    > = {
+      [Constants.AdjustmentTypeEnum.NAME_OVERRIDE]: "Name",
+      [Constants.AdjustmentTypeEnum.IS_SILVER]: "Silvered",
+      [Constants.AdjustmentTypeEnum.FIXED_VALUE_BONUS]: "Damage Bonus",
+      [Constants.AdjustmentTypeEnum.IS_ADAMANTINE]: "Adamantine",
+    };
+
+    let customizationDefaults: Partial<
+      Record<Constants.AdjustmentTypeEnum, any>
+    > = {
+      [Constants.AdjustmentTypeEnum.DISPLAY_AS_ATTACK]:
+        ItemUtils.isDisplayAsAttack(item),
+    };
+
+    const isCustomized = ItemUtils.isCustomized(item);
+
+    return (
+      <EditorBox>
+        <ValueEditor
+          dataLookup={ValueUtils.getEntityData(
+            entityValueLookup,
+            ValueUtils.hack__toString(ItemUtils.getMappingId(item)),
+            ValueUtils.hack__toString(ItemUtils.getMappingEntityTypeId(item))
+          )}
+          onDataUpdate={onCustomDataUpdate}
+          valueEditors={customizationValues}
+          ruleData={ruleData}
+          labelOverrides={customizationLabelOverrides}
+          defaultValues={customizationDefaults}
+          layoutType={"compact"}
+        />
+        <RemoveButton
+          enableConfirm={true}
+          size="medium"
+          style="filled"
+          disabled={!isCustomized}
+          isInteractive={isCustomized}
+          onClick={this.handleRemoveCustomizations}
+        >
+          {isCustomized ? "Remove" : "No"} Customizations
+        </RemoveButton>
+      </EditorBox>
+    );
+    //`
+  };
+
+  renderCustomProperties = (): React.ReactNode => {
+    const { item } = this.props;
+
+    const weight = ItemUtils.getWeight(item);
+    const cost = ItemUtils.getCost(item);
+    const notes = ItemUtils.getNotes(item);
+
+    return (
+      <div className="ct-item-detail__customize" role="list">
+        <InfoItem label="Weight:" {...infoItemProps}>
+          {weight ? <NumberDisplay type="weightInLb" number={weight} /> : "--"}
+        </InfoItem>
+        <InfoItem label="Cost:" {...infoItemProps}>
+          {cost ? `${FormatUtils.renderLocaleNumber(cost)} gp` : "--"}
+        </InfoItem>
+        {notes && (
+          <InfoItem label="Notes:" {...infoItemProps}>
+            {notes}
+          </InfoItem>
+        )}
+      </div>
+    );
+    //`
+  };
+
+  renderGearProperties = (): React.ReactNode => {
+    const { item, theme } = this.props;
+
+    const bundleSize = ItemUtils.getBundleSize(item);
+    const isStackable = ItemUtils.isStackable(item);
+    const version = ItemUtils.getVersion(item);
+    const weight = ItemUtils.getWeight(item);
+    const capacityWeight = ItemUtils.getCapacityWeight(item);
+    const notes = ItemUtils.getNotes(item);
+    const cost = ItemUtils.getCost(item);
+
+    return (
+      <div className="ct-item-detail__customize" role="list">
+        <InfoItem label="Weight:" {...infoItemProps}>
+          {weight ? <NumberDisplay type="weightInLb" number={weight} /> : "--"}
+        </InfoItem>
+        {ItemUtils.isContainer(item) && (
+          <InfoItem label="Capacity:" {...infoItemProps}>
+            {capacityWeight ? (
+              <NumberDisplay type="weightInLb" number={capacityWeight} />
+            ) : (
+              "--"
+            )}
+          </InfoItem>
+        )}
+        <InfoItem label="Cost:" {...infoItemProps}>
+          {cost ? `${FormatUtils.renderLocaleNumber(cost)} gp` : "--"}
+        </InfoItem>
+        {isStackable && bundleSize > 1 && (
+          <InfoItem label="Bundle Size:" {...infoItemProps}>
+            {bundleSize}
+          </InfoItem>
+        )}
+        {version !== null && (
+          <InfoItem label="Version:" {...infoItemProps}>
+            {version}
+          </InfoItem>
+        )}
+        {notes && (
+          <InfoItem label="Notes:" {...infoItemProps}>
+            {notes}
+          </InfoItem>
+        )}
+        {this.getSourceReference(item)}
+      </div>
+    );
+    //`
+  };
+
+  renderWeaponProperties = (): React.ReactNode => {
+    const { item, theme } = this.props;
+
+    const bundleSize = ItemUtils.getBundleSize(item);
+    const isStackable = ItemUtils.isStackable(item);
+    const version = ItemUtils.getVersion(item);
+    const weight = ItemUtils.getWeight(item);
+    const reach = ItemUtils.getReach(item);
+    const range = ItemUtils.getRange(item);
+    const longRange = ItemUtils.getLongRange(item);
+    const versatileDamage = ItemUtils.getVersatileDamage(item);
+    const additionalDamages = ItemUtils.getAdditionalDamages(item);
+    const attackType = ItemUtils.getAttackType(item);
+    const attackTypeName: string =
+      attackType === null
+        ? ""
+        : RuleDataUtils.getAttackTypeRangeName(attackType);
+    const damageType = ItemUtils.getDamageType(item);
+    const damage = ItemUtils.getDamage(item);
+    const properties = ItemUtils.getProperties(item);
+    const proficiency = ItemUtils.hasProficiency(item);
+    const notes = ItemUtils.getNotes(item);
+    const cost = ItemUtils.getCost(item);
+
+    let versatileDamageNode: React.ReactNode;
+    if (versatileDamage) {
+      versatileDamageNode = (
+        <span className="ct-item-detail__versatile-damage">
+          ({DiceUtils.renderDie(versatileDamage)})
+        </span>
+      );
+    }
+
+    let damageDisplay: React.ReactNode = "--";
+    if (damage !== null) {
+      damageDisplay = <Damage theme={theme} damage={damage} />;
+    }
+
+    const showRange: boolean =
+      attackType === Constants.AttackTypeRangeEnum.RANGED ||
+      ItemUtils.hasWeaponProperty(item, Constants.WeaponPropertyEnum.THROWN) ||
+      ItemUtils.hasWeaponProperty(item, Constants.WeaponPropertyEnum.RANGE);
+
+    return (
+      <div className="ct-item-detail__customize" role="list">
+        {proficiency && (
+          <InfoItem label="Proficient: " {...infoItemProps}>
+            Yes
+          </InfoItem>
+        )}
+        <InfoItem label="Attack Type:" {...infoItemProps}>
+          {attackType === null ? "--" : attackTypeName}
+        </InfoItem>
+        {reach && (
+          <InfoItem label="Reach:" {...infoItemProps}>
+            <NumberDisplay type="distanceInFt" number={reach} />
+          </InfoItem>
+        )}
+        {showRange && (
+          <InfoItem label="Range:" {...infoItemProps}>
+            <NumberDisplay type="distanceInFt" number={range} />
+            /
+            <NumberDisplay type="distanceInFt" number={longRange} />
+          </InfoItem>
+        )}
+        <InfoItem label="Damage:" {...infoItemProps}>
+          <div>
+            {damageDisplay}
+            {versatileDamageNode}
+          </div>
+          {additionalDamages.map((additionalDamage, idx) => (
+            <div className="ct-item-detail__additional-damage" key={idx}>
+              {typeof additionalDamage.damage === "number"
+                ? additionalDamage.damage
+                : DiceUtils.renderDie(additionalDamage.damage)}
+              {additionalDamage.damageType !== null && (
+                <DamageTypeIcon
+                  theme={theme}
+                  type={
+                    FormatUtils.slugify(
+                      additionalDamage.damageType
+                    ) as ComponentConstants.DamageTypePropType
+                  }
+                />
+              )}
+              {additionalDamage.info && (
+                <span className="ct-item-detail__additional-damage-info">
+                  {additionalDamage.info}
+                </span>
+              )}
+            </div>
+          ))}
+        </InfoItem>
+        <InfoItem label="Damage Type:" {...infoItemProps}>
+          {damageType === null ? (
+            "--"
+          ) : (
+            <React.Fragment>
+              <DamageTypeIcon
+                theme={theme}
+                type={
+                  FormatUtils.slugify(
+                    damageType
+                  ) as ComponentConstants.DamageTypePropType
+                }
+              />{" "}
+              {damageType}
+            </React.Fragment>
+          )}
+        </InfoItem>
+        <InfoItem label="Weight:" {...infoItemProps}>
+          {weight ? <NumberDisplay type="weightInLb" number={weight} /> : "--"}
+        </InfoItem>
+        <InfoItem label="Cost:" {...infoItemProps}>
+          {cost ? `${FormatUtils.renderLocaleNumber(cost)} gp` : "--"}
+        </InfoItem>
+        {isStackable && bundleSize > 1 && (
+          <InfoItem label="Bundle Size:" {...infoItemProps}>
+            {bundleSize}
+          </InfoItem>
+        )}
+        {properties && properties.length > 0 && (
+          <InfoItem label="Properties:" {...infoItemProps}>
+            {properties
+              .map((prop) => prop.name + (prop.notes ? ` (${prop.notes})` : ""))
+              .join(", ")}
+          </InfoItem>
+        )}
+        {version !== null && (
+          <InfoItem label="Version:" {...infoItemProps}>
+            {version}
+          </InfoItem>
+        )}
+        {notes && (
+          <InfoItem label="Notes:" {...infoItemProps}>
+            {notes}
+          </InfoItem>
+        )}
+        {this.getSourceReference(item)}
+      </div>
+    );
+    //`
+  };
+
+  renderArmorProperties = (): React.ReactNode => {
+    const { item, theme } = this.props;
+
+    const bundleSize = ItemUtils.getBundleSize(item);
+    const isStackable = ItemUtils.isStackable(item);
+    const version = ItemUtils.getVersion(item);
+    const armorClass = ItemUtils.getArmorClass(item);
+    const weight = ItemUtils.getWeight(item);
+    const cost = ItemUtils.getCost(item);
+    const notes = ItemUtils.getNotes(item);
+
+    let armorClassDisplay: React.ReactNode = armorClass;
+    if (ItemUtils.isShield(item)) {
+      armorClassDisplay = (
+        <NumberDisplay
+          type="signed"
+          number={armorClass === null ? 0 : armorClass}
+        />
+      );
+    }
+
+    return (
+      <div className="ct-item-detail__customize" role="list">
+        <InfoItem label="Armor Class:" {...infoItemProps}>
+          {armorClassDisplay}
+        </InfoItem>
+        <InfoItem label="Weight:" {...infoItemProps}>
+          {weight ? <NumberDisplay type="weightInLb" number={weight} /> : "--"}
+        </InfoItem>
+        <InfoItem label="Cost:" {...infoItemProps}>
+          {cost ? `${FormatUtils.renderLocaleNumber(cost)} gp` : "--"}
+        </InfoItem>
+        {isStackable && bundleSize > 1 && (
+          <InfoItem label="Bundle Size:" {...infoItemProps}>
+            {bundleSize}
+          </InfoItem>
+        )}
+        {version !== null && (
+          <InfoItem label="Version:" {...infoItemProps}>
+            {version}
+          </InfoItem>
+        )}
+        {notes && (
+          <InfoItem label="Notes:" {...infoItemProps}>
+            {notes}
+          </InfoItem>
+        )}
+        {this.getSourceReference(item)}
+      </div>
+    );
+    //`
+  };
+
+  renderWeaponSpellDamage = (): React.ReactNode => {
+    const { item, weaponSpellDamageGroups, onDataOriginClick, theme } =
+      this.props;
+
+    if (!ItemUtils.validateIsWeaponLike(item)) {
+      return null;
+    }
+
+    let filteredSpellDamage = ItemUtils.getApplicableWeaponSpellDamageGroups(
+      item,
+      weaponSpellDamageGroups
+    );
+    if (!filteredSpellDamage.length) {
+      return null;
+    }
+
+    return (
+      <div className="ct-item-detail__spell-damage">
+        {filteredSpellDamage.map((spellDamageGroup, groupIdx) => (
+          <div
+            className="ct-item-detail__spell-damage-group"
+            key={`${SpellUtils.getUniqueKey(
+              spellDamageGroup.spell
+            )}-${groupIdx}`}
+          >
+            <div className="ct-item-detail__spell-damage-group-header">
+              <span
+                className="ct-item-detail__spell-damage-group-name"
+                onClick={this.handleSpellClick.bind(
+                  this,
+                  spellDamageGroup.spell
+                )}
+              >
+                {SpellUtils.getName(spellDamageGroup.spell)}
+              </span>
+              <span className="ct-item-detail__spell-damage-group-data-origin">
+                (
+                <DataOriginName
+                  dataOrigin={SpellUtils.getDataOrigin(spellDamageGroup.spell)}
+                  onClick={onDataOriginClick}
+                  theme={theme}
+                />
+                )
+              </span>
+            </div>
+            <div className="ct-item-detail__spell-damage-group-items">
+              {spellDamageGroup.damageDice.map((damage, itemIdx) => (
+                <div
+                  className="ct-item-detail__spell-damage-group-item"
+                  key={`${damage.type}-${itemIdx}`}
+                >
+                  <Damage
+                    theme={theme}
+                    damage={damage.dice}
+                    type={damage.type}
+                  />
+                  {damage.restriction && (
+                    <span className="ct-item-detail__spell-damage-group-restriction">
+                      ({damage.restriction})
+                    </span>
+                  )}
+                </div>
+              ))}
+            </div>
+          </div>
+        ))}
+      </div>
+    );
+    //`
+  };
+
+  renderProperties = (): React.ReactNode => {
+    const { item } = this.props;
+
+    if (ItemUtils.isWeaponContract(item)) {
+      return this.renderWeaponProperties();
+    } else if (ItemUtils.isArmorContract(item)) {
+      return this.renderArmorProperties();
+    } else if (ItemUtils.isGearContract(item)) {
+      return this.renderGearProperties();
+    } else if (ItemUtils.isCustom(item)) {
+      return this.renderCustomProperties();
+    }
+
+    return null;
+  };
+
+  renderTags = (): React.ReactNode => {
+    const { item } = this.props;
+
+    const tags = ItemUtils.getTags(item);
+    if (!tags.length) {
+      return null;
+    }
+
+    return <TagGroup label="Tags" tags={tags} />;
+  };
+
+  renderImage = (): React.ReactNode => {
+    const { item } = this.props;
+
+    const largeImageUrl = ItemUtils.getLargeImageUrl(item);
+    if (!largeImageUrl) {
+      return null;
+    }
+
+    return (
+      <div className="ct-item-detail__full-image">
+        <img
+          className="ct-item-detail__full-image-img"
+          src={largeImageUrl}
+          alt=""
+        />
+      </div>
+    );
+  };
+
+  renderDescription = (): React.ReactNode => {
+    const { item } = this.props;
+
+    const description = ItemUtils.getDescription(item);
+
+    if (!description) {
+      return null;
+    }
+
+    if (ItemUtils.isCustom(item)) {
+      return (
+        <div className="ct-item-detail__description ct-item-detail__description--plain">
+          {description}
+        </div>
+      );
+    } else {
+      return (
+        <HtmlContent
+          className="ct-item-detail__description ct-item-detail__description--rich"
+          html={description}
+          withoutTooltips
+        />
+      );
+    }
+  };
+
+  renderInfusionPreview = (): React.ReactNode => {
+    const {
+      item,
+      snippetData,
+      ruleData,
+      infusionChoiceLookup,
+      proficiencyBonus,
+    } = this.props;
+
+    const infusion = ItemUtils.getInfusion(item);
+    if (infusion && snippetData && infusionChoiceLookup) {
+      return (
+        <div className="ct-item-detail__infusion">
+          <InfusionPreview
+            infusion={infusion}
+            snippetData={snippetData}
+            ruleData={ruleData}
+            infusionChoiceLookup={infusionChoiceLookup}
+            onClick={this.handleInfusionClick}
+            proficiencyBonus={proficiencyBonus}
+          />
+        </div>
+      );
+    }
+
+    return null;
+  };
+
+  render() {
+    const {
+      item,
+      className,
+      showActions,
+      showAbilities,
+      showCustomize,
+      showIntro,
+      showImage,
+      onPostRemoveNavigation,
+      isCustomizeClosed,
+      onCustomizeClick,
+      actions,
+      theme,
+    } = this.props;
+
+    const isCustomized =
+      ItemUtils.isCustomized(item) && !ItemUtils.isCustom(item);
+
+    const masteryAction = ItemUtils.getMasteryAction(item, actions);
+
+    return (
+      <div className={`${className} ct-item-detail`}>
+        {showIntro && this.renderIntro()}
+        {showAbilities && this.renderAbilities()}
+        {showCustomize && (
+          <div className="ct-item-detail__customize">
+            <Collapsible
+              layoutType={"minimal"}
+              header={`Customize${isCustomized ? "*" : ""}`}
+              collapsed={isCustomizeClosed}
+              onChangeHandler={onCustomizeClick}
+            >
+              {ItemUtils.isCustom(item)
+                ? this.renderCustomItemEdit()
+                : this.renderCustomize()}
+            </Collapsible>
+          </div>
+        )}
+        {showCustomize && this.renderClassCustomize()}
+        {this.renderProperties()}
+        {this.renderWeaponSpellDamage()}
+        {this.renderDescription()}
+        {this.renderTags()}
+        {masteryAction && (
+          <div
+            className={styles.action}
+            onClick={this.handleMasteryActionClick}
+          >
+            <div className={styles.label}>
+              <StarIcon style={{ fill: theme.themeColor }} /> Mastery:{" "}
+              {ActionUtils.getName(masteryAction)}
+            </div>
+            <HtmlContent
+              html={ActionUtils.getDescription(masteryAction) ?? ""}
+              withoutTooltips
+            />
+          </div>
+        )}
+        {this.renderInfusionPreview()}
+        {showImage && this.renderImage()}
+        {showActions && (
+          <ItemDetailActions
+            onPostRemoveNavigation={onPostRemoveNavigation}
+            item={item}
+          />
+        )}
+      </div>
+    );
+  }
+}
+
+const ItemDetailContainer = (props) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const { actions } = useCharacterEngine();
+  return (
+    <ItemDetail
+      inventoryManager={inventoryManager}
+      actions={actions}
+      {...props}
+    />
+  );
+};
+
+export default ItemDetailContainer;
diff --git a/ddb_main/tools/js/Shared/components/ItemDetail/index.ts b/ddb_main/tools/js/Shared/components/ItemDetail/index.ts
new file mode 100644
index 0000000..a96fbaf
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ItemDetail/index.ts
@@ -0,0 +1,4 @@
+import ItemDetail from "./ItemDetail";
+
+export default ItemDetail;
+export { ItemDetail };
diff --git a/ddb_main/tools/js/Shared/components/ItemListInformationCollapsible/ItemListInformationCollapsible.tsx b/ddb_main/tools/js/Shared/components/ItemListInformationCollapsible/ItemListInformationCollapsible.tsx
new file mode 100644
index 0000000..b681c9a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ItemListInformationCollapsible/ItemListInformationCollapsible.tsx
@@ -0,0 +1,33 @@
+import {
+  Constants,
+  DefinitionUtils,
+  Item,
+  ItemUtils,
+  RuleData,
+  RuleDataUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HelperTextAccordion } from "~/components/HelperTextAccordion";
+
+interface Props {
+  ruleData: RuleData;
+  item: Item;
+}
+
+export const ItemListInformationCollapsible = ({ ruleData, item }: Props) => {
+  const definitionKey = DefinitionUtils.hack__generateDefinitionKey(
+    ItemUtils.getEntityTypeId(item),
+    ItemUtils.getId(item)
+  );
+  const builderText = RuleDataUtils.getBuilderHelperTextByDefinitionKeys(
+    [definitionKey],
+    ruleData,
+    Constants.DisplayConfigurationTypeEnum.ITEM
+  );
+
+  return (
+    <div className="ct-item-list-information-collapsible">
+      <HelperTextAccordion builderHelperText={builderText} />
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/components/ItemListInformationCollapsible/index.ts b/ddb_main/tools/js/Shared/components/ItemListInformationCollapsible/index.ts
new file mode 100644
index 0000000..cf41733
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ItemListInformationCollapsible/index.ts
@@ -0,0 +1,4 @@
+import { ItemListInformationCollapsible } from "./ItemListInformationCollapsible";
+
+export default ItemListInformationCollapsible;
+export { ItemListInformationCollapsible };
diff --git a/ddb_main/tools/js/Shared/components/ItemSlotManager/ItemSlotManager.tsx b/ddb_main/tools/js/Shared/components/ItemSlotManager/ItemSlotManager.tsx
new file mode 100644
index 0000000..a310732
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ItemSlotManager/ItemSlotManager.tsx
@@ -0,0 +1,51 @@
+import React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import SlotManager from "../SlotManager";
+
+interface Props {
+  isUsed: boolean;
+  isReadonly?: boolean;
+  canUse: boolean;
+  onSet?: (uses: number) => void;
+  theme: CharacterTheme;
+  useTooltip?: boolean;
+  showEmptySlot?: boolean;
+  tooltipTitle?: string;
+}
+export const ItemSlotManager: React.FC<Props> = ({
+  isUsed,
+  isReadonly = false,
+  canUse,
+  onSet,
+  theme,
+  useTooltip = true,
+  showEmptySlot = true,
+  tooltipTitle,
+}) => {
+  return (
+    <div className="ct-item-slot-manager">
+      {canUse ? (
+        <SlotManager
+          size="small"
+          used={isUsed ? 1 : 0}
+          available={1}
+          onSet={onSet}
+          isInteractive={!isReadonly}
+        />
+      ) : showEmptySlot ? (
+        <Tooltip
+          enabled={useTooltip}
+          title={tooltipTitle ?? ""}
+          isDarkMode={theme.isDarkMode}
+        >
+          <div className="ct-item-slot-manager--empty">--</div>
+        </Tooltip>
+      ) : null}
+    </div>
+  );
+};
+
+export default ItemSlotManager;
diff --git a/ddb_main/tools/js/Shared/components/LoadingBlocker/LoadingBlocker.tsx b/ddb_main/tools/js/Shared/components/LoadingBlocker/LoadingBlocker.tsx
new file mode 100644
index 0000000..3110c50
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/LoadingBlocker/LoadingBlocker.tsx
@@ -0,0 +1,59 @@
+import React from "react";
+
+import { AnimatedLoadingRingSvg } from "@dndbeyond/character-components/es";
+
+interface Props {
+  isFinished: boolean;
+  hideDelay: number;
+}
+interface State {
+  isVisible: boolean;
+}
+export default class LoadingBlocker extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    hideDelay: 2000,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      isVisible: !props.isFinished,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { isFinished, hideDelay } = this.props;
+
+    if (!prevProps.isFinished && isFinished) {
+      setTimeout(() => {
+        this.setState({
+          isVisible: false,
+        });
+      }, hideDelay);
+    }
+  }
+
+  render() {
+    const { isVisible } = this.state;
+    const { isFinished } = this.props;
+
+    if (!isVisible) {
+      return null;
+    }
+
+    return (
+      <div
+        className={`ct-loading-blocker ${
+          isFinished ? " ct-loading-blocker--finished" : ""
+        }`}
+      >
+        <div className="ct-loading-blocker__logo" />
+        <AnimatedLoadingRingSvg className="ct-loading-blocker__anim" />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/LoadingBlocker/index.ts b/ddb_main/tools/js/Shared/components/LoadingBlocker/index.ts
new file mode 100644
index 0000000..851cf5b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/LoadingBlocker/index.ts
@@ -0,0 +1,4 @@
+import LoadingBlocker from "./LoadingBlocker";
+
+export default LoadingBlocker;
+export { LoadingBlocker };
diff --git a/ddb_main/tools/js/Shared/components/SimpleClassSpellList/SimpleClassSpellList.tsx b/ddb_main/tools/js/Shared/components/SimpleClassSpellList/SimpleClassSpellList.tsx
new file mode 100644
index 0000000..eeeaa35
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SimpleClassSpellList/SimpleClassSpellList.tsx
@@ -0,0 +1,83 @@
+import { sortBy } from "lodash";
+import React from "react";
+
+import {
+  ClassSpellListSpellsLookup,
+  BaseSpell,
+  HelperUtils,
+  ClassSpellListSpellInfo,
+  ClassUtils,
+  SpellUtils,
+  FormatUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { SpellName } from "~/components/SpellName";
+
+//This uses the common SpellName component due to builder modals not playing nice with the dataOriginRefData
+//would revert back to the character-components SpellName if we ever changed the builder modals
+
+interface Props {
+  spellListIds: Array<number>;
+  classSpellListSpellsLookup: ClassSpellListSpellsLookup;
+}
+export default class SimpleClassSpellList extends React.PureComponent<
+  Props,
+  {}
+> {
+  getClassSpellsLookupByClassName = (): Record<string, Array<BaseSpell>> => {
+    const { spellListIds, classSpellListSpellsLookup } = this.props;
+
+    return spellListIds.reduce((acc, id) => {
+      const classSpellListSpellInfos = HelperUtils.lookupDataOrFallback(
+        classSpellListSpellsLookup,
+        id
+      );
+      classSpellListSpellInfos?.forEach((info: ClassSpellListSpellInfo) => {
+        const charClassName = ClassUtils.getName(info.charClass);
+        if (charClassName) {
+          if (!acc[charClassName]) {
+            acc[charClassName] = [];
+          }
+
+          acc[charClassName].push(info.spell);
+        }
+      });
+
+      return acc;
+    }, {});
+  };
+
+  render() {
+    const classSpellsLookup = this.getClassSpellsLookupByClassName();
+
+    return (
+      <div className="ct-simple-class-spell-list">
+        {Object.keys(classSpellsLookup).map((charClassName) => {
+          const sortedSpells = sortBy(classSpellsLookup[charClassName], [
+            (spell) => SpellUtils.getLevel(spell),
+            (spell) => SpellUtils.getName(spell),
+          ]);
+
+          return (
+            <div
+              className="ct-simple-class-spell-list__class"
+              key={charClassName}
+            >
+              <strong>{charClassName}</strong>
+              {sortedSpells.map((spell) => {
+                return (
+                  <div
+                    className="ct-simple-class-spell-list__class-spell"
+                    key={`${charClassName}-${SpellUtils.getUniqueKey(spell)}`}
+                  >
+                    <SpellName spell={spell} showLegacy={true} />
+                  </div>
+                );
+              })}
+            </div>
+          );
+        })}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/SimpleQuantity/SimpleQuantity.tsx b/ddb_main/tools/js/Shared/components/SimpleQuantity/SimpleQuantity.tsx
new file mode 100644
index 0000000..18b3651
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SimpleQuantity/SimpleQuantity.tsx
@@ -0,0 +1,183 @@
+import React from "react";
+
+import { HelperUtils } from "@dndbeyond/character-rules-engine/es";
+
+import { ThemeButton } from "../common/Button";
+
+interface Props {
+  quantity: number;
+  minimum: number;
+  maximum: number | null;
+  label: string;
+  onUpdate?: (quantity: number) => void;
+  isReadonly: boolean;
+}
+interface State {
+  quantity: number;
+  newQuantity: number | null;
+}
+export default class SimpleQuantity extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    label: "Quantity",
+    minimum: 0,
+    maximum: null,
+    isReadonly: false,
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      quantity: props.quantity,
+      newQuantity: props.quantity,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { quantity } = this.props;
+
+    if (quantity !== prevState.quantity) {
+      this.setState({
+        quantity,
+        newQuantity: quantity,
+      });
+    }
+  }
+
+  handleUpdate = (): void => {
+    const { newQuantity } = this.state;
+    const { onUpdate, quantity } = this.props;
+
+    if (newQuantity !== quantity && onUpdate) {
+      onUpdate(newQuantity === null ? 0 : newQuantity);
+    }
+  };
+
+  handleAmountChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    this.setState({
+      newQuantity: HelperUtils.parseInputInt(evt.target.value, null),
+    });
+  };
+
+  handleAmountKeyUp = (evt: React.KeyboardEvent<HTMLInputElement>): void => {
+    const { minimum, maximum } = this.props;
+
+    if (evt.key === "Enter") {
+      const parsedValue = HelperUtils.parseInputInt(
+        (evt.target as HTMLInputElement).value
+      );
+      const clampedValue = HelperUtils.clampInt(
+        parsedValue ?? minimum,
+        minimum,
+        maximum
+      );
+      this.setState(
+        {
+          quantity: clampedValue,
+          newQuantity: clampedValue,
+        },
+        this.handleUpdate
+      );
+    }
+  };
+
+  handleAmountBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { minimum, maximum } = this.props;
+
+    const parsedValue = HelperUtils.parseInputInt(evt.target.value);
+    const clampedValue = HelperUtils.clampInt(
+      parsedValue ?? minimum,
+      minimum,
+      maximum
+    );
+    this.setState(
+      {
+        quantity: clampedValue,
+        newQuantity: clampedValue,
+      },
+      this.handleUpdate
+    );
+  };
+
+  handleIncrementClick = () => {
+    const { quantity, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      let newValue: number = quantity + 1;
+      this.setState(
+        {
+          quantity: newValue,
+          newQuantity: newValue,
+        },
+        this.handleUpdate
+      );
+    }
+  };
+
+  handleDecrementClick = () => {
+    const { quantity, isReadonly } = this.props;
+
+    if (!isReadonly) {
+      let newValue: number = quantity - 1;
+      this.setState(
+        {
+          quantity: newValue,
+          newQuantity: newValue,
+        },
+        this.handleUpdate
+      );
+    }
+  };
+
+  render() {
+    const { newQuantity } = this.state;
+    const { label, quantity, minimum, maximum, isReadonly } = this.props;
+
+    return (
+      <div className="ct-simple-quantity">
+        <div className="ct-simple-quantity__label">{label}</div>
+        <div className="ct-simple-quantity__controls">
+          <div className="ct-simple-quantity__decrease">
+            <ThemeButton
+              className="button-action-decrease button-action-decrease--small"
+              onClick={this.handleDecrementClick}
+              disabled={minimum !== null && quantity <= minimum}
+              size="small"
+              isInteractive={!isReadonly}
+              aria-label={"decrease quantity"}
+              data-testid={"decrease-quantity"}
+            />
+          </div>
+          <div className="ct-simple-quantity__value">
+            <input
+              type="number"
+              value={newQuantity === null ? "" : newQuantity}
+              className="character-input ct-simple-quantity__input"
+              onChange={this.handleAmountChange}
+              onBlur={this.handleAmountBlur}
+              onKeyUp={this.handleAmountKeyUp}
+              min={0}
+              readOnly={isReadonly}
+              data-testid={"change-quantity"}
+            />
+          </div>
+          <div className="ct-simple-quantity__increase">
+            <ThemeButton
+              className="button-action-increase button-action-increase--small"
+              onClick={this.handleIncrementClick}
+              size="small"
+              disabled={maximum !== null && quantity >= maximum}
+              isInteractive={!isReadonly}
+              aria-label={"increase quantity"}
+              data-testid={"increase-quantity"}
+            />
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/SimpleQuantity/index.ts b/ddb_main/tools/js/Shared/components/SimpleQuantity/index.ts
new file mode 100644
index 0000000..7ca65c9
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SimpleQuantity/index.ts
@@ -0,0 +1,4 @@
+import SimpleQuantity from "./SimpleQuantity";
+
+export default SimpleQuantity;
+export { SimpleQuantity };
diff --git a/ddb_main/tools/js/Shared/components/SlotManager/SlotManager.tsx b/ddb_main/tools/js/Shared/components/SlotManager/SlotManager.tsx
new file mode 100644
index 0000000..531be10
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SlotManager/SlotManager.tsx
@@ -0,0 +1,71 @@
+import React from "react";
+
+interface Props {
+  used: number;
+  available: number;
+  onSet?: (used: number) => void;
+  size: "normal" | "small";
+  isInteractive: boolean;
+}
+export default class SlotManager extends React.PureComponent<Props> {
+  static defaultProps = {
+    size: "normal",
+    isInteractive: true,
+  };
+
+  handleClick = (isUsed: boolean, evt: React.MouseEvent): void => {
+    let { onSet, used, available, isInteractive } = this.props;
+
+    evt.nativeEvent.stopImmediatePropagation();
+    evt.stopPropagation();
+
+    if (!onSet || !isInteractive) {
+      return;
+    }
+
+    if (isUsed) {
+      onSet(Math.max(used - 1, 0));
+    } else {
+      onSet(Math.min(used + 1, available));
+    }
+  };
+
+  render() {
+    let { available, used, size, isInteractive } = this.props;
+
+    let slotElements: Array<React.ReactNode> = [];
+
+    let totalSlots: number = Math.max(available, used);
+    for (let i = 0; i < totalSlots; i++) {
+      let isUsed = i < used;
+
+      let slotClassNames: Array<string> = ["ct-slot-manager__slot"];
+      if (isUsed) {
+        slotClassNames.push("ct-slot-manager__slot--used");
+      }
+      if (isInteractive) {
+        slotClassNames.push("ct-slot-manager__slot--interactive");
+      }
+      if (i >= available) {
+        slotClassNames.push("ct-slot-manager__slot--over-used");
+      }
+
+      slotElements.push(
+        <div
+          role="checkbox"
+          aria-checked={isUsed}
+          aria-label={"use"}
+          className={slotClassNames.join(" ")}
+          key={i}
+          onClick={this.handleClick.bind(this, isUsed)}
+        />
+      );
+    }
+
+    return (
+      <div className={`ct-slot-manager ct-slot-manager--size-${size}`}>
+        {slotElements}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/SlotManager/index.ts b/ddb_main/tools/js/Shared/components/SlotManager/index.ts
new file mode 100644
index 0000000..4fdca35
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SlotManager/index.ts
@@ -0,0 +1,4 @@
+import SlotManager from "./SlotManager";
+
+export default SlotManager;
+export { SlotManager };
diff --git a/ddb_main/tools/js/Shared/components/SlotManagerLarge/SlotManagerLarge.tsx b/ddb_main/tools/js/Shared/components/SlotManagerLarge/SlotManagerLarge.tsx
new file mode 100644
index 0000000..e88420e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SlotManagerLarge/SlotManagerLarge.tsx
@@ -0,0 +1,160 @@
+import React from "react";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+import { ThemeButton } from "../common/Button";
+
+interface Props {
+  used: number;
+  available: number;
+  label: string;
+  onSet?: (usedAmount: number) => void;
+  isReadonly: boolean;
+  isInteractive: boolean;
+}
+interface State {
+  startUsed: number;
+  newUsed: number;
+}
+export default class SlotManagerLarge extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    label: "",
+    isInteractive: true,
+    isReadonly: false,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      startUsed: props.used,
+      newUsed: props.used,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { used } = this.props;
+
+    if (used !== prevState.startUsed) {
+      this.setState({
+        startUsed: used,
+        newUsed: used,
+      });
+    }
+  }
+
+  handleSetClick = (): void => {
+    const { newUsed } = this.state;
+    const { onSet } = this.props;
+
+    if (onSet) {
+      onSet(newUsed);
+    }
+
+    this.setState({
+      startUsed: newUsed,
+    });
+  };
+
+  handleResetClick = (): void => {
+    const { startUsed } = this.state;
+
+    this.setState({
+      newUsed: startUsed,
+    });
+  };
+
+  handleUseClick = (): void => {
+    const { isReadonly } = this.props;
+
+    if (!isReadonly) {
+      this.setState((prevState, props) => ({
+        newUsed: Math.min(prevState.newUsed + 1, props.available),
+      }));
+    }
+  };
+
+  handleGainClick = (): void => {
+    const { isReadonly } = this.props;
+
+    if (!isReadonly) {
+      this.setState((prevState, props) => ({
+        newUsed: Math.max(prevState.newUsed - 1, 0),
+      }));
+    }
+  };
+
+  render() {
+    const { newUsed, startUsed } = this.state;
+    const { label, available, isInteractive } = this.props;
+
+    const usedDiff: number = startUsed - newUsed;
+
+    let classNames: Array<string> = ["ct-slot-manager-large__values"];
+    if (usedDiff > 0) {
+      classNames.push("ct-slot-manager-large__values--gain");
+    } else if (usedDiff < 0) {
+      classNames.push("ct-slot-manager-large__values--use");
+    }
+
+    return (
+      <div className="ct-slot-manager-large">
+        <div className={classNames.join(" ")}>
+          {label && <div className="ct-slot-manager-large__label">{label}</div>}
+          <div className="ct-slot-manager-large__value-control ct-slot-manager-large__value-control--use">
+            <ThemeButton
+              size="small"
+              className={"button-action-decrease button-action-decrease--small"}
+              onClick={this.handleUseClick}
+              disabled={newUsed === available}
+              isInteractive={isInteractive}
+            />
+          </div>
+          <div className="ct-slot-manager-large__value ct-slot-manager-large__value--cur">
+            {available - newUsed}
+          </div>
+          <div className="ct-slot-manager-large__value-control ct-slot-manager-large__value-control--gain">
+            <ThemeButton
+              size="small"
+              className={"button-action-increase button-action-increase--small"}
+              onClick={this.handleGainClick}
+              disabled={newUsed === 0}
+              isInteractive={isInteractive}
+            />
+          </div>
+        </div>
+        {usedDiff !== 0 && (
+          <div className="ct-slot-manager-large__diff">
+            <div className="ct-slot-manager-large__diff-explain">
+              <NumberDisplay type="signed" number={usedDiff} />
+            </div>
+            <div className="ct-slot-manager-large__diff-actions">
+              <ThemeButton
+                className="ct-slot-manager-large__diff-action"
+                size={"small"}
+                onClick={this.handleSetClick}
+              >
+                Confirm
+              </ThemeButton>
+              <ThemeButton
+                className="ct-slot-manager-large__diff-action"
+                size={"small"}
+                style={"outline"}
+                onClick={this.handleResetClick}
+              >
+                Clear
+              </ThemeButton>
+            </div>
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/SlotManagerLarge/index.ts b/ddb_main/tools/js/Shared/components/SlotManagerLarge/index.ts
new file mode 100644
index 0000000..c13cd00
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SlotManagerLarge/index.ts
@@ -0,0 +1,4 @@
+import SlotManagerLarge from "./SlotManagerLarge";
+
+export default SlotManagerLarge;
+export { SlotManagerLarge };
diff --git a/ddb_main/tools/js/Shared/components/SpellCaster/SpellCaster.tsx b/ddb_main/tools/js/Shared/components/SpellCaster/SpellCaster.tsx
new file mode 100644
index 0000000..446f9e8
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellCaster/SpellCaster.tsx
@@ -0,0 +1,965 @@
+import React, { useContext } from "react";
+import { DispatchProp } from "react-redux";
+
+import {
+  ComponentConstants,
+  DamageTypeIcon,
+} from "@dndbeyond/character-components/es";
+import {
+  AbilityLookup,
+  BaseInventoryContract,
+  Constants,
+  DiceUtils,
+  EntityUtils,
+  FormatUtils,
+  ItemUtils,
+  LimitedUseUtils,
+  ModifierUtils,
+  Spell,
+  SpellCasterInfo,
+  SpellSlotContract,
+  SpellUtils,
+  characterActions,
+  ApiRequestHelpers,
+  RuleData,
+  RuleDataUtils,
+  CharacterTheme,
+  InventoryManager,
+  ItemManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { toastMessageActions } from "../../actions/toastMessage";
+import { InventoryManagerContext } from "../../managers/InventoryManagerContext";
+import { ThemeButton } from "../common/Button";
+
+function canCastAtLevel(level, available) {
+  return available.indexOf(level) > -1;
+}
+
+function isCastAvailableAtLevel(level, available) {
+  return available.indexOf(level) > -1;
+}
+
+// TODO dispatch needs to be factored out
+interface Props extends DispatchProp {
+  characterLevel: number;
+  spell: Spell;
+  spellSlots: Array<SpellSlotContract>;
+  pactMagicSlots: Array<SpellSlotContract>;
+  castableSpellLevels: Array<number>;
+  castablePactMagicLevels: Array<number>;
+  availableSpellLevels: Array<number>;
+  availablePactMagicLevels: Array<number>;
+  initialCastLevel: number | null;
+  spellCasterInfo: SpellCasterInfo;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme?: CharacterTheme;
+  inventoryManager: InventoryManager;
+}
+interface State {
+  castLevel: number;
+  castableLevelsIdx: number;
+  castableLevels: Array<number>;
+  minLevel: number;
+  maxLevel: number;
+}
+export class SpellCaster extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    initialCastLevel: null,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = this.getStartingCastState(props);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { spell } = this.props;
+
+    if (
+      SpellUtils.getUniqueKey(spell) !==
+      SpellUtils.getUniqueKey(prevProps.spell)
+    ) {
+      this.setState({
+        ...this.getStartingCastState(this.props),
+      });
+    }
+  }
+
+  getStartingCastState = (props: Props): State => {
+    const { spell, initialCastLevel, spellCasterInfo, ruleData } = props;
+
+    let { startLevel, endLevel } = SpellUtils.getCastLevelRange(
+      spell,
+      spellCasterInfo,
+      ruleData
+    );
+
+    const castableLevels = SpellUtils.getCastableLevels(
+      spell,
+      spellCasterInfo,
+      ruleData,
+      initialCastLevel
+    );
+    const castLevel = SpellUtils.getMinCastLevel(
+      spell,
+      spellCasterInfo,
+      ruleData,
+      initialCastLevel
+    );
+    const castableLevelsIdx = castableLevels.findIndex(
+      (level) => level === castLevel
+    );
+
+    return {
+      castLevel,
+      castableLevelsIdx,
+      castableLevels,
+      minLevel: startLevel,
+      maxLevel: endLevel,
+    };
+  };
+
+  getSpellLevelUses = (
+    spellSlots: Array<SpellSlotContract>,
+    level: number
+  ): number => {
+    const spellSlot = spellSlots.find((slot) => slot.level === level);
+
+    if (spellSlot) {
+      return spellSlot.used;
+    }
+
+    return 0;
+  };
+
+  handleIncreaseCastLevel = (): void => {
+    this.setState((prevState, props) => ({
+      castableLevelsIdx: prevState.castableLevelsIdx + 1,
+      castLevel: prevState.castableLevels[prevState.castableLevelsIdx + 1],
+    }));
+  };
+
+  handleDecreaseCastLevel = (): void => {
+    this.setState((prevState, props) => ({
+      castableLevelsIdx: prevState.castableLevelsIdx - 1,
+      castLevel: prevState.castableLevels[prevState.castableLevelsIdx - 1],
+    }));
+  };
+
+  handleCastSpellSlot = (): void => {
+    this.handleSpellUse(true, false);
+  };
+
+  handleCastPactMagicSlot = (): void => {
+    this.handleSpellUse(false, true);
+  };
+
+  // TODO dispatch needs to be factored out
+  handleSpellUse = (useSpellSlot: boolean, usePactMagicSlot: boolean): void => {
+    const { castLevel, minLevel } = this.state;
+    const {
+      dispatch,
+      spell,
+      spellSlots,
+      pactMagicSlots,
+      isReadonly,
+      inventoryManager,
+    } = this.props;
+
+    if (isReadonly) {
+      return;
+    }
+
+    const dataOrigin = SpellUtils.getDataOrigin(spell);
+    const dataOriginType = SpellUtils.getDataOriginType(spell);
+
+    let limitedUse = SpellUtils.getLimitedUse(spell);
+    let mappingId: number | null = null;
+    let mappingTypeId: number | null = null;
+    if (limitedUse) {
+      let numberUsed = LimitedUseUtils.getNumberUsed(limitedUse);
+      let uses = SpellUtils.getConsumedLimitedUse(spell, castLevel - minLevel);
+
+      switch (dataOriginType) {
+        case Constants.DataOriginTypeEnum.ITEM:
+          //TODO itemManager: make a way to get the item with just he mapping id and lookups?
+
+          mappingId = ItemUtils.getMappingId(
+            dataOrigin.primary as BaseInventoryContract
+          );
+          mappingTypeId = ItemUtils.getMappingEntityTypeId(
+            dataOrigin.primary as BaseInventoryContract
+          );
+          const itemData = dataOrigin.primary as BaseInventoryContract;
+          const item = ItemManager.getItem(ItemUtils.getMappingId(itemData));
+          item.handleItemLimitedUseSet(numberUsed + uses);
+          dispatch(
+            toastMessageActions.toastSuccess(
+              "Item Spell Cast",
+              `Cast ${SpellUtils.getName(
+                spell
+              )} from ${EntityUtils.getDataOriginName(dataOrigin)}`
+            )
+          );
+          break;
+        default:
+          mappingId = SpellUtils.getMappingId(spell);
+          mappingTypeId = SpellUtils.getMappingEntityTypeId(spell);
+          if (mappingId !== null && mappingTypeId !== null) {
+            dispatch(
+              characterActions.spellUseSet(
+                mappingId,
+                mappingTypeId,
+                numberUsed + uses,
+                dataOriginType
+              )
+            );
+            dispatch(
+              toastMessageActions.toastSuccess(
+                "Limited Use Spell Cast",
+                `Cast ${SpellUtils.getName(spell)} with limited use`
+              )
+            );
+          }
+      }
+    }
+
+    if (useSpellSlot) {
+      let castLevelKey =
+        ApiRequestHelpers.getSpellLevelSpellSlotRequestsDataKey(castLevel);
+      if (castLevelKey !== null) {
+        dispatch(
+          characterActions.spellLevelSpellSlotsSet({
+            [castLevelKey]: this.getSpellLevelUses(spellSlots, castLevel) + 1,
+          })
+        );
+        dispatch(
+          toastMessageActions.toastSuccess(
+            "Spell Cast",
+            `Cast ${SpellUtils.getName(spell)} in spell slot level ${castLevel}`
+          )
+        );
+      }
+    }
+
+    if (usePactMagicSlot) {
+      let castLevelKey =
+        ApiRequestHelpers.getSpellLevelPactMagicRequestsDataKey(castLevel);
+      if (castLevelKey !== null) {
+        dispatch(
+          characterActions.spellLevelPactMagicSlotsSet({
+            [castLevelKey]:
+              this.getSpellLevelUses(pactMagicSlots, castLevel) + 1,
+          })
+        );
+        dispatch(
+          toastMessageActions.toastSuccess(
+            "Spell Cast",
+            `Cast ${SpellUtils.getName(spell)} in a pact magic slot`
+          )
+        );
+      }
+    }
+  };
+
+  handleCast = (): void => {
+    const { castLevel } = this.state;
+    const { spell, spellCasterInfo } = this.props;
+
+    let usesSpellSlot = SpellUtils.getUsesSpellSlot(spell);
+    let limitedUse = SpellUtils.getLimitedUse(spell);
+
+    const isSpellSlotAvailable = canCastAtLevel(
+      castLevel,
+      spellCasterInfo.castableSpellLevels
+    );
+    const isPactSlotAvailable = canCastAtLevel(
+      castLevel,
+      spellCasterInfo.castablePactMagicLevels
+    );
+
+    if (usesSpellSlot) {
+      if (limitedUse) {
+        if (SpellUtils.isValidToUsePactSlots(spell)) {
+          if (isPactSlotAvailable) {
+            this.handleSpellUse(false, true);
+          }
+        } else {
+          if (isSpellSlotAvailable) {
+            this.handleSpellUse(true, false);
+          }
+        }
+      } else {
+        if (isSpellSlotAvailable) {
+          this.handleSpellUse(true, false);
+        } else if (isPactSlotAvailable) {
+          this.handleSpellUse(false, true);
+        }
+      }
+    } else {
+      this.handleSpellUse(false, false);
+    }
+  };
+
+  renderLimitedUseDetails = (): React.ReactNode => {
+    const { spell, ruleData, abilityLookup, proficiencyBonus } = this.props;
+    const limitedUse = SpellUtils.getLimitedUse(spell);
+
+    if (!limitedUse) {
+      return null;
+    }
+
+    const maxUses = LimitedUseUtils.deriveMaxUses(
+      limitedUse,
+      abilityLookup,
+      ruleData,
+      proficiencyBonus
+    );
+    const resetType = LimitedUseUtils.getResetType(limitedUse);
+
+    if (resetType === null) {
+      return null;
+    }
+
+    let limitedUseType: string = "Use";
+    if (
+      SpellUtils.getDataOriginType(spell) === Constants.DataOriginTypeEnum.ITEM
+    ) {
+      limitedUseType = "Charge";
+    }
+
+    let resetDisplay: string = "";
+    switch (resetType) {
+      case Constants.LimitedUseResetTypeEnum.SHORT_REST:
+      case Constants.LimitedUseResetTypeEnum.LONG_REST:
+        resetDisplay = `${
+          maxUses === 1 ? "Once" : maxUses
+        } per ${RuleDataUtils.getLimitedUseResetTypeName(resetType, ruleData)}`;
+        break;
+      default:
+        resetDisplay = `${maxUses} ${limitedUseType}${
+          maxUses !== 1 ? "s" : ""
+        }, Reset: ${RuleDataUtils.getLimitedUseResetTypeName(
+          resetType,
+          ruleData
+        )}`;
+        break;
+    }
+
+    return <div className="ct-spell-caster__limited">{resetDisplay}</div>;
+  };
+
+  renderCasting = (): React.ReactNode => {
+    const { castLevel, minLevel, maxLevel, castableLevelsIdx, castableLevels } =
+      this.state;
+    const {
+      spell,
+      castableSpellLevels,
+      castablePactMagicLevels,
+      spellSlots,
+      pactMagicSlots,
+      availableSpellLevels,
+      availablePactMagicLevels,
+      ruleData,
+      abilityLookup,
+      spellCasterInfo,
+      isReadonly,
+      proficiencyBonus,
+    } = this.props;
+
+    const limitedUse = SpellUtils.getLimitedUse(spell);
+    const isAtWill = SpellUtils.validateIsAtWill(spell, castLevel);
+    const castAsRitual = SpellUtils.isCastAsRitual(spell);
+
+    let castLevelNode: React.ReactNode;
+    let castActionsNode: React.ReactNode;
+
+    if (castAsRitual) {
+      castActionsNode = "As Ritual";
+    } else if (isAtWill) {
+      castActionsNode = "At Will";
+    } else {
+      if (limitedUse) {
+        const maxUses = LimitedUseUtils.deriveMaxUses(
+          limitedUse,
+          abilityLookup,
+          ruleData,
+          proficiencyBonus
+        );
+        const numberUsed = LimitedUseUtils.getNumberUsed(limitedUse);
+        const consumedAmount = SpellUtils.getConsumedLimitedUse(
+          spell,
+          castLevel - minLevel
+        );
+        const numberRemaining: number = maxUses - numberUsed;
+        let limitedUseButtonText: React.ReactNode;
+        let showRemainingCount: boolean = true;
+
+        const dataOriginType = SpellUtils.getDataOriginType(spell);
+
+        if (maxUses === 1) {
+          if (dataOriginType === Constants.DataOriginTypeEnum.ITEM) {
+            limitedUseButtonText = "1 Charge";
+          } else {
+            limitedUseButtonText = "Use";
+            showRemainingCount = false;
+          }
+        } else {
+          limitedUseButtonText = `${consumedAmount} ${
+            dataOriginType === Constants.DataOriginTypeEnum.ITEM
+              ? "Charge"
+              : "Use"
+          }${consumedAmount !== 1 ? "s" : ""}`;
+        }
+
+        const isLimitedUseAvailable =
+          SpellUtils.validateIsLimitedUseAvailableAtScaledAmount(
+            spell,
+            castLevel,
+            castLevel - minLevel,
+            abilityLookup,
+            ruleData,
+            spellCasterInfo,
+            proficiencyBonus
+          );
+        const usesSpellSlots = SpellUtils.getUsesSpellSlot(spell);
+
+        let spellSlotsAvailable: number | null = null;
+        let spellSlotName: string = "";
+        if (usesSpellSlots) {
+          if (SpellUtils.isValidToUsePactSlots(spell)) {
+            spellSlotsAvailable = SpellUtils.getCastLevelAvailableCount(
+              castLevel,
+              pactMagicSlots
+            );
+            spellSlotName = "Pact Slot";
+          } else {
+            spellSlotsAvailable = SpellUtils.getCastLevelAvailableCount(
+              castLevel,
+              spellSlots
+            );
+            spellSlotName = "Spell Slot";
+          }
+        }
+
+        castActionsNode = (
+          <React.Fragment>
+            <div className="ct-spell-caster__casting-action">
+              <ThemeButton
+                disabled={!isLimitedUseAvailable}
+                isInteractive={!isReadonly}
+                onClick={this.handleCast}
+                className="ct-spell-caster__casting-action-button--limited"
+              >
+                {usesSpellSlots ? `${spellSlotName}, ` : ""}
+                {limitedUseButtonText}
+                {usesSpellSlots && (
+                  <span className="ct-spell-caster__casting-action-count ct-spell-caster__casting-action-count--spellcasting">
+                    {spellSlotsAvailable}
+                  </span>
+                )}
+                {showRemainingCount && (
+                  <span className="ct-spell-caster__casting-action-count ct-spell-caster__casting-action-count--limited-use">
+                    {numberRemaining}
+                  </span>
+                )}
+              </ThemeButton>
+            </div>
+          </React.Fragment>
+        );
+      } else {
+        const canSpellCastAtLevel = canCastAtLevel(
+          castLevel,
+          castableSpellLevels
+        );
+        const canPactMagicCastAtLevel = canCastAtLevel(
+          castLevel,
+          castablePactMagicLevels
+        );
+        const isSpellCastAvailableAtLevel = isCastAvailableAtLevel(
+          castLevel,
+          availableSpellLevels
+        );
+        const isPactMagicCastAvailableAtLevel = isCastAvailableAtLevel(
+          castLevel,
+          availablePactMagicLevels
+        );
+        const spellCastLevelAvailableCount =
+          SpellUtils.getCastLevelAvailableCount(castLevel, spellSlots);
+        const pactMagicCastLevelAvailableCount =
+          SpellUtils.getCastLevelAvailableCount(castLevel, pactMagicSlots);
+
+        castActionsNode = (
+          <React.Fragment>
+            {isSpellCastAvailableAtLevel && (
+              <div className="ct-spell-caster__casting-action">
+                <ThemeButton
+                  disabled={!canSpellCastAtLevel}
+                  isInteractive={!isReadonly}
+                  onClick={this.handleCastSpellSlot}
+                >
+                  Spell Slot
+                  <span className="ct-spell-caster__casting-action-count ct-spell-caster__casting-action-count--spellcasting">
+                    {spellCastLevelAvailableCount}
+                  </span>
+                </ThemeButton>
+              </div>
+            )}
+            {isPactMagicCastAvailableAtLevel && (
+              <div className="ct-spell-caster__casting-action">
+                <ThemeButton
+                  disabled={!canPactMagicCastAtLevel}
+                  onClick={this.handleCastPactMagicSlot}
+                >
+                  Pact Slot
+                  <span className="ct-spell-caster__casting-action-count ct-spell-caster__casting-action-count--spellcasting">
+                    {pactMagicCastLevelAvailableCount}
+                  </span>
+                </ThemeButton>
+              </div>
+            )}
+          </React.Fragment>
+        );
+      }
+    }
+
+    if (!SpellUtils.isCantrip(spell)) {
+      castLevelNode = (
+        <div className="ct-spell-caster__casting-level">
+          <span className="ct-spell-caster__casting-level-label">Level</span>
+          {minLevel !== maxLevel && (
+            <span className="ct-spell-caster__casting-level-action">
+              <ThemeButton
+                disabled={castableLevelsIdx === 0}
+                onClick={this.handleDecreaseCastLevel}
+                className="ct-button--decrease"
+              />
+            </span>
+          )}
+          <span
+            className={`ct-spell-caster__casting-level-current ct-spell-caster__casting-level-current--${
+              minLevel === maxLevel ? "nocontrols" : "controls"
+            }`}
+          >
+            {FormatUtils.renderSpellLevelAbbreviation(castLevel)}
+          </span>
+          {minLevel !== maxLevel && (
+            <span className="ct-spell-caster__casting-level-action">
+              <ThemeButton
+                disabled={castableLevelsIdx + 1 === castableLevels.length}
+                onClick={this.handleIncreaseCastLevel}
+                className="ct-button--increase"
+              />
+            </span>
+          )}
+        </div>
+      );
+    }
+    //`
+
+    return (
+      <div className="ct-spell-caster__casting">
+        <div className="ct-spell-caster__casting-label">Cast</div>
+        <div className="ct-spell-caster__casting-actions">
+          {castActionsNode}
+        </div>
+        {castLevelNode}
+      </div>
+    );
+  };
+
+  renderAtHigherLevels = (): React.ReactNode => {
+    const { castLevel } = this.state;
+    const { spell, characterLevel } = this.props;
+
+    const atHigherLevels = SpellUtils.getAtHigherLevels(spell);
+    if (!atHigherLevels) {
+      return null;
+    }
+
+    const scaleType = SpellUtils.getScaleType(spell);
+
+    const {
+      additionalAttacks,
+      additionalTargets,
+      areaOfEffect,
+      duration,
+      creatures,
+      special,
+      range,
+    } = atHigherLevels;
+
+    const level = SpellUtils.getLevel(spell);
+
+    let additionalAttacksDisplay: React.ReactNode;
+    if (additionalAttacks !== null) {
+      const additionalAttackInfo = SpellUtils.getSpellScaledAtHigher(
+        spell,
+        scaleType,
+        additionalAttacks,
+        characterLevel,
+        castLevel
+      );
+      if (additionalAttackInfo) {
+        const additionalAttackCount =
+          level === 0
+            ? additionalAttackInfo.totalCount + 1
+            : additionalAttackInfo.totalCount;
+        const additionalAttackLabel = level === 0 ? "Total" : "Additional";
+        additionalAttacksDisplay = (
+          <div className="ct-spell-caster__higher ct-spell-caster__higher--attacks">
+            {additionalAttackLabel} {additionalAttackInfo.description}:{" "}
+            {additionalAttackCount}
+          </div>
+        );
+      }
+    }
+
+    let additionalTargetsDisplay: React.ReactNode;
+    if (additionalTargets !== null) {
+      const additionalTargetInfo = SpellUtils.getSpellScaledAtHigher(
+        spell,
+        scaleType,
+        additionalTargets,
+        characterLevel,
+        castLevel
+      );
+      if (additionalTargetInfo) {
+        additionalTargetsDisplay = (
+          <div className="ct-spell-caster__higher ct-spell-caster__higher--targets">
+            <div className="ct-spell-caster__higher-targets-info">
+              {additionalTargetInfo.targets} Additional Target
+              {additionalTargetInfo.targets === 1 ? "" : "s"}
+            </div>
+            <div className="ct-spell-caster__higher-targets-description">
+              {additionalTargetInfo.description}
+            </div>
+          </div>
+        );
+      }
+    }
+
+    let aoeDisplay: React.ReactNode;
+    if (areaOfEffect !== null) {
+      const aoeInfo = SpellUtils.getSpellScaledAtHigher(
+        spell,
+        scaleType,
+        areaOfEffect,
+        characterLevel,
+        castLevel
+      );
+      if (aoeInfo && aoeInfo.extendedAoe !== null) {
+        aoeDisplay = (
+          <div className="ct-spell-caster__higher ct-spell-caster__higher--aoe">
+            Extended Area: {FormatUtils.renderDistance(aoeInfo.extendedAoe)}{" "}
+            {aoeInfo.description}
+          </div>
+        );
+      }
+    }
+
+    let rangeDisplay: React.ReactNode;
+    if (range !== null) {
+      const rangeInfo = SpellUtils.getSpellScaledAtHigher(
+        spell,
+        scaleType,
+        range,
+        characterLevel,
+        castLevel
+      );
+      if (rangeInfo && rangeInfo.range) {
+        rangeDisplay = (
+          <div className="ct-spell-caster__higher ct-spell-caster__higher--range">
+            Extended Range: {FormatUtils.renderDistance(rangeInfo.range)}{" "}
+            {rangeInfo.description}
+          </div>
+        );
+      }
+    }
+
+    let durationDisplay: React.ReactNode;
+    if (duration !== null) {
+      const durationInfo = SpellUtils.getSpellScaledAtHigher(
+        spell,
+        scaleType,
+        duration,
+        characterLevel,
+        castLevel
+      );
+      if (durationInfo) {
+        durationDisplay = (
+          <div className="ct-spell-caster__higher ct-spell-caster__higher--duration">
+            Extended Duration: {durationInfo.description}
+          </div>
+        );
+      }
+    }
+
+    let creaturesDisplay: React.ReactNode;
+    if (creatures !== null) {
+      const creatureInfo = SpellUtils.getSpellScaledAtHigher(
+        spell,
+        scaleType,
+        creatures,
+        characterLevel,
+        castLevel
+      );
+      if (creatureInfo) {
+        creaturesDisplay = (
+          <div className="ct-spell-caster__higher ct-spell-caster__higher--creatures">
+            Creatures: {creatureInfo.description}
+          </div>
+        );
+      }
+    }
+
+    let specialDisplay: React.ReactNode;
+    if (special !== null) {
+      const specialInfo = SpellUtils.getSpellScaledAtHigher(
+        spell,
+        scaleType,
+        special,
+        characterLevel,
+        castLevel
+      );
+      if (specialInfo) {
+        specialDisplay = (
+          <div className="ct-spell-caster__higher ct-spell-caster__higher--special">
+            Special: {specialInfo.description}
+          </div>
+        );
+      }
+    }
+
+    if (
+      !additionalAttacksDisplay &&
+      !additionalTargetsDisplay &&
+      !aoeDisplay &&
+      !durationDisplay &&
+      !creaturesDisplay &&
+      !specialDisplay &&
+      !rangeDisplay
+    ) {
+      return null;
+    }
+
+    return (
+      <div className="ct-spell-caster__higher-items">
+        {additionalAttacksDisplay}
+        {additionalTargetsDisplay}
+        {rangeDisplay}
+        {aoeDisplay}
+        {durationDisplay}
+        {creaturesDisplay}
+        {specialDisplay}
+      </div>
+    );
+  };
+
+  render() {
+    const { castLevel } = this.state;
+    const { characterLevel, spell, theme } = this.props;
+
+    const modifiers = SpellUtils.getModifiers(spell);
+
+    const damageModifiers = modifiers.filter((modifier) =>
+      ModifierUtils.isSpellDamageModifier(modifier)
+    );
+    let damageNode: React.ReactNode;
+    if (damageModifiers.length) {
+      damageNode = (
+        <div className="ct-spell-caster__modifiers ct-spell-caster__modifiers--damages">
+          {damageModifiers.map((modifier) => {
+            const atHigherLevels = ModifierUtils.getAtHigherLevels(modifier);
+            const id = ModifierUtils.getId(modifier);
+            const restriction = ModifierUtils.getRestriction(modifier);
+            const friendlySubtypeName =
+              ModifierUtils.getFriendlySubtypeName(modifier);
+            const atHigherDamage = SpellUtils.getSpellScaledAtHigher(
+              spell,
+              atHigherLevels ? SpellUtils.getScaleType(spell) : null,
+              atHigherLevels && atHigherLevels.points
+                ? atHigherLevels.points
+                : [],
+              characterLevel,
+              castLevel
+            );
+            const scaledDamageDie = SpellUtils.getSpellFinalScaledDie(
+              spell,
+              modifier,
+              atHigherDamage
+            );
+
+            return (
+              <div
+                className="ct-spell-caster__modifier ct-spell-caster__modifier--damage"
+                key={id ? id : ""}
+              >
+                {scaledDamageDie && (
+                  <span className="ct-spell-caster__modifier-amount">
+                    {DiceUtils.renderDice(scaledDamageDie)}
+                  </span>
+                )}
+                {friendlySubtypeName !== null && (
+                  <span className="ct-spell-caster__modifier-effect">
+                    <DamageTypeIcon
+                      theme={theme}
+                      type={
+                        FormatUtils.slugify(
+                          friendlySubtypeName
+                        ) as ComponentConstants.DamageTypePropType
+                      }
+                    />{" "}
+                    Damage
+                  </span>
+                )}
+                {!!restriction && (
+                  <span className="ct-spell-caster__modifier-restriction">
+                    ({restriction})
+                  </span>
+                )}
+              </div>
+            );
+          })}
+        </div>
+      );
+    }
+
+    const hitPointHealingModifiers = modifiers.filter((modifier) =>
+      ModifierUtils.isSpellHealingHitPointsModifier(modifier)
+    );
+    const tempHitPointHealingModifiers = modifiers.filter((modifier) =>
+      ModifierUtils.isSpellHealingTempHitPointsModifier(modifier)
+    );
+    let healingNode: React.ReactNode;
+    if (
+      hitPointHealingModifiers.length ||
+      tempHitPointHealingModifiers.length
+    ) {
+      healingNode = (
+        <div className="ct-spell-caster__modifiers ct-spell-caster__modifiers--healing">
+          {hitPointHealingModifiers.map((modifier) => {
+            const atHigherLevels = ModifierUtils.getAtHigherLevels(modifier);
+            const id = ModifierUtils.getId(modifier);
+            const restriction = ModifierUtils.getRestriction(modifier);
+            const atHigherHealing = SpellUtils.getSpellScaledAtHigher(
+              spell,
+              atHigherLevels ? SpellUtils.getScaleType(spell) : null,
+              atHigherLevels && atHigherLevels.points
+                ? atHigherLevels.points
+                : [],
+              characterLevel,
+              castLevel
+            );
+            const scaledHealingDie = SpellUtils.getSpellFinalScaledDie(
+              spell,
+              modifier,
+              atHigherHealing,
+              castLevel
+            );
+            const isHealingDieAdditional =
+              SpellUtils.hack__isHealingDieAdditionalBonusFixedValue(
+                damageModifiers,
+                spell,
+                scaledHealingDie
+              );
+            return (
+              <div
+                className="ct-spell-caster__modifier ct-spell-caster__modifier--hp"
+                key={id ? id : ""}
+              >
+                <span className="ct-spell-caster__modifier-amount">
+                  Regain {isHealingDieAdditional && "Additional"}{" "}
+                  {scaledHealingDie && DiceUtils.renderDice(scaledHealingDie)}{" "}
+                  Hit Points
+                </span>
+                {!!restriction && (
+                  <span className="ct-spell-caster__modifier-restriction">
+                    ({restriction})
+                  </span>
+                )}
+              </div>
+            );
+          })}
+          {tempHitPointHealingModifiers.map((modifier) => {
+            const atHigherLevels = ModifierUtils.getAtHigherLevels(modifier);
+            const id = ModifierUtils.getId(modifier);
+            const restriction = ModifierUtils.getRestriction(modifier);
+            const atHigherHealing = SpellUtils.getSpellScaledAtHigher(
+              spell,
+              atHigherLevels ? SpellUtils.getScaleType(spell) : null,
+              atHigherLevels && atHigherLevels.points
+                ? atHigherLevels.points
+                : [],
+              characterLevel,
+              castLevel
+            );
+            const scaledHealingDie = SpellUtils.getSpellFinalScaledDie(
+              spell,
+              modifier,
+              atHigherHealing,
+              castLevel
+            );
+            return (
+              <div
+                className="ct-spell-caster__modifier ct-spell-caster__modifier--temp"
+                key={id ? id : ""}
+              >
+                <span className="ct-spell-caster__modifier-amount">
+                  Regain{" "}
+                  {scaledHealingDie && DiceUtils.renderDice(scaledHealingDie)}{" "}
+                  Temp Hit Points
+                </span>
+                {!!restriction && (
+                  <span className="ct-spell-caster__modifier-restriction">
+                    ({restriction})
+                  </span>
+                )}
+              </div>
+            );
+          })}
+        </div>
+      );
+    }
+
+    const castingNode = this.renderCasting();
+    const limitedUseNode = this.renderLimitedUseDetails();
+    const atHigherLevelsNode = this.renderAtHigherLevels();
+
+    if (
+      !castingNode &&
+      !limitedUseNode &&
+      !damageNode &&
+      !healingNode &&
+      !atHigherLevelsNode
+    ) {
+      return null;
+    }
+
+    return (
+      <div className="ct-spell-caster">
+        {castingNode}
+        {limitedUseNode}
+        {damageNode}
+        {healingNode}
+        {atHigherLevelsNode}
+      </div>
+    );
+  }
+}
+
+const SpellCasterContainer = (props) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  return <SpellCaster inventoryManager={inventoryManager} {...props} />;
+};
+
+export default SpellCasterContainer;
diff --git a/ddb_main/tools/js/Shared/components/SpellCaster/index.ts b/ddb_main/tools/js/Shared/components/SpellCaster/index.ts
new file mode 100644
index 0000000..df81520
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellCaster/index.ts
@@ -0,0 +1,4 @@
+import SpellCaster from "./SpellCaster";
+
+export default SpellCaster;
+export { SpellCaster };
diff --git a/ddb_main/tools/js/Shared/components/SpellDetail/SpellDetail.tsx b/ddb_main/tools/js/Shared/components/SpellDetail/SpellDetail.tsx
new file mode 100644
index 0000000..e47d95f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellDetail/SpellDetail.tsx
@@ -0,0 +1,475 @@
+import React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  Collapsible,
+  AoeTypeIcon,
+  ComponentConstants,
+} from "@dndbeyond/character-components/es";
+import {
+  ActivationUtils,
+  AnySimpleDataType,
+  CharacterTheme,
+  CharacterUtils,
+  CharacterValuesContract,
+  Constants,
+  DurationUtils,
+  EntityValueLookup,
+  FormatUtils,
+  RuleData,
+  RuleDataUtils,
+  SourceMappingContract,
+  Spell,
+  SpellCasterInfo,
+  SpellUtils,
+  ValueUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { InfoItem } from "~/components/InfoItem";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { Reference } from "~/components/Reference";
+import { TagGroup } from "~/components/TagGroup";
+
+import SpellDetailCaster from "../../containers/SpellDetailCaster";
+import EditorBox from "../EditorBox";
+import ValueEditor from "../ValueEditor";
+import { RemoveButton, ThemeButton } from "../common/Button";
+
+interface Props {
+  spell: Spell;
+  enableCaster: boolean;
+  castAsRitual: boolean;
+  initialCastLevel: number | null;
+  isPreparedMaxed: boolean;
+  onRemove?: () => void;
+  onPrepareToggle?: () => void;
+  onCustomDataUpdate?: (
+    key: number,
+    value: AnySimpleDataType,
+    source: string | null
+  ) => void;
+  onCustomizationsRemove?: () => void;
+  showCustomize: boolean;
+  showActions: boolean;
+  entityValueLookup?: EntityValueLookup;
+  spellCasterInfo: SpellCasterInfo;
+  ruleData: RuleData;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  isCustomizeClosed?: boolean;
+  onCustomizeClick?: (isCollapsed: boolean) => void;
+}
+export default class SpellDetail extends React.PureComponent<Props> {
+  static defaultProps = {
+    initialCastLevel: null,
+    isPreparedMaxed: true,
+    enableCaster: true,
+    showActions: true,
+    showCustomize: true,
+    castAsRitual: false,
+    spellCasterInfo: {},
+    isReadonly: false,
+  };
+
+  handleRemoveCustomizations = () => {
+    const { onCustomizationsRemove } = this.props;
+
+    if (onCustomizationsRemove) {
+      onCustomizationsRemove();
+    }
+  };
+
+  renderCustomize = (): React.ReactNode => {
+    const {
+      spell,
+      showCustomize,
+      onCustomDataUpdate,
+      entityValueLookup,
+      ruleData,
+      isReadonly,
+      isCustomizeClosed,
+      onCustomizeClick,
+    } = this.props;
+
+    const dataOrigin = SpellUtils.getDataOrigin(spell);
+    const dataOriginType = SpellUtils.getDataOriginType(spell);
+
+    if (
+      !entityValueLookup ||
+      !showCustomize ||
+      !dataOrigin ||
+      (dataOrigin && dataOriginType === Constants.DataOriginTypeEnum.ITEM) ||
+      isReadonly
+    ) {
+      return null;
+    }
+
+    const displayAsAttack = SpellUtils.isDisplayAsAttack(spell);
+    const initialDisplayAsAttack: boolean =
+      displayAsAttack ||
+      (SpellUtils.isAttack(spell) &&
+        (displayAsAttack || displayAsAttack === null));
+
+    let customizationValues: Array<Constants.AdjustmentTypeEnum> = [
+      Constants.AdjustmentTypeEnum.TO_HIT_OVERRIDE,
+      Constants.AdjustmentTypeEnum.TO_HIT_BONUS,
+      Constants.AdjustmentTypeEnum.FIXED_VALUE_BONUS,
+      Constants.AdjustmentTypeEnum.SAVE_DC_OVERRIDE,
+      Constants.AdjustmentTypeEnum.SAVE_DC_BONUS,
+    ];
+
+    if (!SpellUtils.asPartOfWeaponAttack(spell)) {
+      customizationValues.push(Constants.AdjustmentTypeEnum.DISPLAY_AS_ATTACK);
+    }
+
+    customizationValues.push(Constants.AdjustmentTypeEnum.NAME_OVERRIDE);
+    customizationValues.push(Constants.AdjustmentTypeEnum.NOTES);
+
+    let customizationLabelOverrides: Partial<
+      Record<Constants.AdjustmentTypeEnum, string>
+    > = {
+      [Constants.AdjustmentTypeEnum.NAME_OVERRIDE]: "Name",
+      [Constants.AdjustmentTypeEnum.FIXED_VALUE_BONUS]: "Damage Bonus",
+      [Constants.AdjustmentTypeEnum.SAVE_DC_OVERRIDE]: "DC Override",
+      [Constants.AdjustmentTypeEnum.SAVE_DC_BONUS]: "DC Bonus",
+    };
+
+    let customizationDefaults: Partial<
+      Record<Constants.AdjustmentTypeEnum, any>
+    > = {
+      [Constants.AdjustmentTypeEnum.DISPLAY_AS_ATTACK]: initialDisplayAsAttack,
+    };
+
+    let [contextId, contextTypeId] = SpellUtils.deriveExpandedContextIds(spell);
+    const mappingId = SpellUtils.getMappingId(spell);
+    const mappingEntityTypeId = SpellUtils.getMappingEntityTypeId(spell);
+    let dataLookup: Record<number, CharacterValuesContract> = {};
+    if (mappingId !== null && mappingEntityTypeId !== null) {
+      dataLookup = ValueUtils.getEntityData(
+        entityValueLookup,
+        ValueUtils.hack__toString(mappingId),
+        ValueUtils.hack__toString(mappingEntityTypeId),
+        ValueUtils.hack__toString(contextId),
+        ValueUtils.hack__toString(contextTypeId)
+      );
+    }
+
+    const isCustomized = SpellUtils.isCustomized(spell);
+
+    return (
+      <div className="ct-spell-detail__customize">
+        <Collapsible
+          layoutType={"minimal"}
+          header={`Customize${isCustomized ? "*" : ""}`}
+          collapsed={isCustomizeClosed}
+          onChangeHandler={onCustomizeClick}
+        >
+          <EditorBox>
+            <ValueEditor
+              dataLookup={dataLookup}
+              onDataUpdate={onCustomDataUpdate}
+              valueEditors={customizationValues}
+              ruleData={ruleData}
+              labelOverrides={customizationLabelOverrides}
+              defaultValues={customizationDefaults}
+              layoutType={"compact"}
+            />
+            <RemoveButton
+              enableConfirm={true}
+              size="medium"
+              style="filled"
+              disabled={!isCustomized}
+              isInteractive={isCustomized}
+              onClick={this.handleRemoveCustomizations}
+            >
+              {isCustomized ? "Remove" : "No"} Customizations
+            </RemoveButton>
+          </EditorBox>
+        </Collapsible>
+      </div>
+    );
+    //`
+  };
+
+  renderActions = (): React.ReactNode => {
+    const { spell, isPreparedMaxed, onRemove, onPrepareToggle, showActions } =
+      this.props;
+
+    const dataOrigin = SpellUtils.getDataOrigin(spell);
+    const dataOriginType = SpellUtils.getDataOriginType(spell);
+
+    if (
+      !showActions ||
+      !dataOrigin ||
+      (dataOrigin && dataOriginType !== Constants.DataOriginTypeEnum.CLASS)
+    ) {
+      return null;
+    }
+
+    const isPrepared = SpellUtils.isPrepared(spell);
+    const showRemove = SpellUtils.canRemove(spell);
+    const showPrepare =
+      SpellUtils.canPrepare(spell) && !SpellUtils.isAlwaysPrepared(spell);
+
+    if (!showRemove && !showPrepare) {
+      return null;
+    }
+
+    return (
+      <div className="ct-spell-detail__actions">
+        {showPrepare && (
+          <div className="ct-spell-detail__action">
+            <ThemeButton
+              size="small"
+              style={isPrepared ? "" : "outline"}
+              onClick={onPrepareToggle}
+              stopPropagation={true}
+              disabled={isPreparedMaxed && !isPrepared}
+            >
+              {isPrepared ? "Prepared" : "Prepare"}
+            </ThemeButton>
+          </div>
+        )}
+        {showRemove && (
+          <div className="ct-spell-detail__action">
+            <RemoveButton onClick={onRemove} />
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  renderCaster = (): React.ReactNode => {
+    const {
+      spell,
+      initialCastLevel,
+      enableCaster,
+      castAsRitual,
+      spellCasterInfo,
+      proficiencyBonus,
+    } = this.props;
+
+    if (!enableCaster || castAsRitual || !SpellUtils.isActive(spell)) {
+      return null;
+    }
+
+    return (
+      <SpellDetailCaster
+        spell={spell}
+        initialCastLevel={initialCastLevel}
+        proficiencyBonus={proficiencyBonus}
+        {...spellCasterInfo}
+      />
+    );
+  };
+
+  render() {
+    const { spell, ruleData, theme } = this.props;
+    let { castAsRitual } = this.props;
+
+    castAsRitual = castAsRitual || SpellUtils.isCastAsRitual(spell);
+
+    const attackSaveValue = SpellUtils.getAttackSaveValue(spell);
+    const notes = SpellUtils.getNotes(spell);
+    const range = SpellUtils.getRange(spell);
+    const additionalDescription = SpellUtils.getAdditionalDescription(spell);
+    const level = SpellUtils.getLevel(spell);
+    const components = SpellUtils.getComponents(spell);
+    const componentsDescription = SpellUtils.getComponentsDescription(spell);
+    const duration = SpellUtils.getDuration(spell);
+    const school = SpellUtils.getSchool(spell);
+    const description = SpellUtils.getDescription(spell);
+    const version = SpellUtils.getVersion(spell);
+    const requiresSavingThrow = SpellUtils.getRequiresSavingThrow(spell);
+    const tags = SpellUtils.getTags(spell);
+    const activation = SpellUtils.getActivation(spell);
+    const castingTimeDescription = SpellUtils.getCastingTimeDescription(spell);
+    let sourceId: number | null = null;
+    let sourcePage: number | null = null;
+    let filteredSources = SpellUtils.getSources(spell).filter(
+      CharacterUtils.isPrimarySource
+    );
+    if (filteredSources.length) {
+      let primarySource: SourceMappingContract = filteredSources[0];
+      sourceId = primarySource.sourceId;
+      sourcePage = primarySource.pageNumber;
+    }
+
+    let rangeAreas: Array<React.ReactNode> = [];
+    if (range) {
+      if (
+        range.origin &&
+        range.origin !== Constants.SpellRangeTypeNameEnum.RANGED
+      ) {
+        rangeAreas.push(range.origin);
+      }
+      if (range.rangeValue) {
+        rangeAreas.push(
+          <NumberDisplay type="distanceInFt" number={range.rangeValue} />
+        );
+      }
+      if (range.aoeValue) {
+        rangeAreas.push(
+          <React.Fragment>
+            <NumberDisplay type="distanceInFt" number={range.aoeValue} />
+            <span className="ct-spell-detail__range-shape">
+              <AoeTypeIcon
+                className="ct-spell-detail__range-icon"
+                type={
+                  FormatUtils.slugify(
+                    range.aoeType
+                  ) as ComponentConstants.AoeTypePropType
+                }
+                themeMode={theme.isDarkMode ? "gray" : "dark"}
+              />
+            </span>
+          </React.Fragment>
+        );
+      }
+    }
+
+    let componentsNode: React.ReactNode;
+    if (components) {
+      componentsNode = (
+        <span className="ct-spell-detail__components">
+          {components.map((componentId, idx) => {
+            let componentInfo = RuleDataUtils.getSpellComponentInfo(
+              componentId,
+              ruleData
+            );
+            if (componentInfo === null) {
+              return null;
+            }
+            return (
+              <React.Fragment key={componentId}>
+                <Tooltip
+                  isDarkMode={theme.isDarkMode}
+                  title={componentInfo.name ? componentInfo.name : ""}
+                >
+                  {componentInfo.shortName}
+                </Tooltip>
+                {idx + 1 < components.length ? ", " : ""}
+              </React.Fragment>
+            );
+          })}
+        </span>
+      );
+    }
+
+    let castingTimeDisplay: React.ReactNode;
+    if (activation) {
+      castingTimeDisplay = ActivationUtils.renderCastingTime(
+        activation,
+        castAsRitual ? 10 : 0,
+        ruleData
+      );
+    }
+
+    const infoItemProps = { role: "listitem", inline: true };
+    const getSourceInfo = (sourceId) =>
+      sourceId ? RuleDataUtils.getSourceDataInfo(sourceId, ruleData) : null;
+
+    return (
+      <div className="ct-spell-detail">
+        <div className="ct-spell-detail__level-school">
+          {SpellUtils.isLegacy(spell) && (
+            <span className="ct-spell-detail__level-school-item">
+              Legacy •{" "}
+            </span>
+          )}
+          <span className="ct-spell-detail__level-school-item">
+            {SpellUtils.isCantrip(spell)
+              ? school
+              : FormatUtils.renderSpellLevelName(level)}
+          </span>
+          <span className="ct-spell-detail__level-school-item">
+            {SpellUtils.isCantrip(spell)
+              ? FormatUtils.renderSpellLevelName(level)
+              : school}
+          </span>
+        </div>
+        {this.renderCaster()}
+        {this.renderCustomize()}
+        <div className="ct-spell-detail__properties" role="list">
+          <InfoItem label="Casting Time:" {...infoItemProps}>
+            {castingTimeDisplay}
+            {castingTimeDescription ? `, ${castingTimeDescription}` : ""}
+          </InfoItem>
+          <InfoItem label="Range/Area:" {...infoItemProps}>
+            {rangeAreas.map((node, idx) => (
+              <React.Fragment key={idx}>
+                {node}
+                {idx + 1 < rangeAreas.length ? "/" : ""}
+              </React.Fragment>
+            ))}
+          </InfoItem>
+          <InfoItem label="Components:" {...infoItemProps}>
+            {componentsNode}
+            {componentsDescription && (
+              <span className="ct-spell-detail__components-description">
+                ({componentsDescription})
+              </span>
+            )}
+          </InfoItem>
+          {duration !== null && (
+            <InfoItem label="Duration:" {...infoItemProps}>
+              {DurationUtils.renderDuration(
+                duration,
+                SpellUtils.getConcentration(spell)
+              )}
+            </InfoItem>
+          )}
+          {requiresSavingThrow && (
+            <InfoItem label="Attack/Save:" {...infoItemProps}>
+              {SpellUtils.getSaveDcAbilityShortName(spell, ruleData)}{" "}
+              {attackSaveValue}
+            </InfoItem>
+          )}
+          {version !== null && (
+            <InfoItem label="Version:" {...infoItemProps}>
+              {version}
+            </InfoItem>
+          )}
+          {notes && (
+            <InfoItem label="Notes:" {...infoItemProps}>
+              {notes}
+            </InfoItem>
+          )}
+          {sourceId !== null && (
+            <InfoItem label="Source:" {...infoItemProps}>
+              <Reference
+                name={getSourceInfo(sourceId)?.description || ""}
+                page={sourcePage}
+                isDarkMode={theme?.isDarkMode}
+              />
+            </InfoItem>
+          )}
+        </div>
+        {description !== null && (
+          <HtmlContent
+            className="ct-spell-detail__description"
+            html={description}
+            withoutTooltips
+          />
+        )}
+        {additionalDescription && (
+          <HtmlContent
+            className="ct-spell-detail__additional-description"
+            html={additionalDescription}
+            withoutTooltips
+          />
+        )}
+        {this.renderActions()}
+        {tags.length > 0 && (
+          <TagGroup
+            className="ct-spell-detail__tags"
+            label="Tags"
+            tags={tags}
+          />
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/SpellDetail/index.ts b/ddb_main/tools/js/Shared/components/SpellDetail/index.ts
new file mode 100644
index 0000000..44a71fb
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellDetail/index.ts
@@ -0,0 +1,4 @@
+import SpellDetail from "./SpellDetail";
+
+export default SpellDetail;
+export { SpellDetail };
diff --git a/ddb_main/tools/js/Shared/components/SpellManager/SpellManager.tsx b/ddb_main/tools/js/Shared/components/SpellManager/SpellManager.tsx
new file mode 100644
index 0000000..993dc06
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellManager/SpellManager.tsx
@@ -0,0 +1,264 @@
+import { sortBy } from "lodash";
+import React, { useCallback, useContext, useEffect, useState } from "react";
+import { useSelector } from "react-redux";
+
+import { LoadingPlaceholder } from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  DataOriginRefData,
+  EntityValueLookup,
+  rulesEngineSelectors,
+  SimpleSourceCategoryContract,
+  SpellManager as SpellManagerType,
+} from "@dndbeyond/character-rules-engine";
+
+import { Link } from "~/components/Link";
+import { SpellFilter } from "~/components/SpellFilter";
+
+import DataLoadingStatusEnum from "../../constants/DataLoadingStatusEnum";
+import { SpellsManagerContext } from "../../managers/SpellsManagerContext";
+import { FilterUtils } from "../../utils";
+import SpellManagerItem from "./SpellManagerItem";
+
+interface Props {
+  charClassId: number;
+  characterClassId: number;
+  shouldFetch?: boolean;
+  hasActiveSpells?: boolean;
+
+  isPrepareMaxed: boolean;
+  isCantripsKnownMaxed: boolean;
+  isSpellsKnownMaxed: boolean;
+  addButtonText: string;
+  enableAdd?: boolean;
+  enablePrepare?: boolean;
+  enableUnprepare?: boolean;
+  enableSpellRemove?: boolean;
+  showFilters?: boolean;
+  showExpandedType?: boolean;
+  showCustomize: boolean;
+  buttonActiveStyle?: string;
+  buttonUnprepareText?: string;
+  entityValueLookup: EntityValueLookup;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+
+// TODO: migrate this all into here
+export default function SpellManagerContainer({
+  showFilters = true,
+  enableAdd = true,
+  enableSpellRemove = true,
+  showExpandedType = true,
+  enablePrepare = true,
+  enableUnprepare = true,
+  shouldFetch = false,
+  hasActiveSpells = false,
+  charClassId,
+  // TODO: get from manager?
+  characterClassId,
+  isPrepareMaxed,
+  isCantripsKnownMaxed,
+  isSpellsKnownMaxed,
+  addButtonText,
+  buttonActiveStyle,
+  buttonUnprepareText,
+  entityValueLookup,
+  dataOriginRefData,
+  showCustomize,
+  proficiencyBonus,
+  theme,
+}: Props) {
+  const ruleData = useSelector(rulesEngineSelectors.getRuleData);
+  const spellCasterInfo = useSelector(rulesEngineSelectors.getSpellCasterInfo);
+  const { spellsManager } = useContext(SpellsManagerContext);
+
+  const [availableSpells, setAvailableSpells] = useState<
+    Array<SpellManagerType>
+  >([]);
+  const [spells, setSpells] = useState<Array<SpellManagerType>>([]);
+  const [sourceCategories, setSourceCategories] = useState<
+    Array<SimpleSourceCategoryContract>
+  >([]);
+  const [loadingStatus, setLoadingStatus] = useState(
+    DataLoadingStatusEnum.LOADING
+  );
+  const [filterLevels, setFilterLevels] = useState<Array<number>>([]);
+  const [filterQuery, setFilterQuery] = useState("");
+  const [filterSourceCategories, setFilterSourceCategories] = useState<
+    Array<number>
+  >([]);
+
+  const getData = useCallback(
+    async function getData() {
+      let classSpellMap = await spellsManager.getSpellShoppe();
+      if (!classSpellMap[charClassId] || shouldFetch) {
+        classSpellMap = await spellsManager.getSpellShoppe(true);
+      }
+      setSpells(
+        hasActiveSpells
+          ? classSpellMap[charClassId].activeSpells
+          : classSpellMap[charClassId].knownSpells
+      );
+      setAvailableSpells(
+        shouldFetch ? classSpellMap[charClassId].availableSpells : []
+      );
+      setSourceCategories(classSpellMap[charClassId].sourceCategories);
+      setLoadingStatus(DataLoadingStatusEnum.LOADED);
+    },
+    [spellsManager, hasActiveSpells, shouldFetch, charClassId]
+  );
+  useEffect(() => {
+    getData();
+  }, [getData]);
+
+  function getCombinedSpells(): Array<SpellManagerType> {
+    // const remainingLazySpells = availableSpells.filter((spell) => !knownSpellIds.includes(spell.deriveKnownKey()));
+
+    return sortBy(
+      [...availableSpells, ...spells],
+      [
+        (spell) => spell.getLevel(),
+        (spell) => spell.getName(),
+        (spell) => spell.getExpandedDataOriginRef() !== null,
+        (spell) => spell.getUniqueKey(),
+      ]
+    );
+  }
+  function getFilteredSpells(
+    combinedSpells: Array<SpellManagerType>
+  ): Array<SpellManagerType> {
+    return combinedSpells.filter((spell) => {
+      if (filterSourceCategories.length !== 0) {
+        const sourceCategoryId = spell.getPrimarySourceCategoryId();
+        if (!filterSourceCategories.includes(sourceCategoryId)) {
+          return false;
+        }
+      }
+
+      if (
+        filterLevels.length !== 0 &&
+        !filterLevels.includes(spell.getLevel())
+      ) {
+        return false;
+      }
+
+      if (
+        filterQuery !== "" &&
+        !FilterUtils.doesQueryMatchData(filterQuery, spell.getName())
+      ) {
+        return false;
+      }
+
+      return true;
+    });
+  }
+
+  function handleFilterSpellLevel(level: number): void {
+    setFilterLevels(
+      filterLevels.includes(level)
+        ? filterLevels.filter((l) => l !== level)
+        : [...filterLevels, level]
+    );
+  }
+
+  function handleSourceCategoryClick(categoryId: number): void {
+    setFilterSourceCategories(
+      filterSourceCategories.includes(categoryId)
+        ? filterSourceCategories.filter((cat) => cat !== categoryId)
+        : [...filterSourceCategories, categoryId]
+    );
+  }
+
+  function onSuccess() {
+    getData();
+  }
+  function onFailure() {
+    getData();
+  }
+
+  function renderUi(): React.ReactNode {
+    const combinedSpells = getCombinedSpells();
+    const filteredSpells = getFilteredSpells(combinedSpells);
+
+    return (
+      <React.Fragment>
+        {showFilters && (
+          <React.Fragment>
+            <SpellFilter
+              spells={combinedSpells.map((manager) => manager.getSpell())}
+              sourceCategories={sourceCategories}
+              filterQuery={filterQuery}
+              filterLevels={filterLevels}
+              onLevelFilterClick={handleFilterSpellLevel}
+              onQueryChange={setFilterQuery}
+              onSourceCategoryClick={handleSourceCategoryClick}
+              filterSourceCategories={filterSourceCategories}
+              themed
+            />
+            <div className="ct-character-tools__marketplace-callout">
+              Looking for something not in the list below? Unlock all official
+              options in the <Link href="/marketplace">Marketplace</Link>.
+            </div>
+          </React.Fragment>
+        )}
+        {filteredSpells.length === 0 && <div>No Results Found</div>}
+        {filteredSpells.map((spell, idx) => (
+          <SpellManagerItem
+            theme={theme}
+            spell={spell}
+            key={`${spell.getId()}-${idx}`}
+            onPrepare={() => {
+              spell.handlePrepare({ characterClassId }, onSuccess, onFailure);
+            }}
+            onUnprepare={() => {
+              spell.handleUnprepare({ characterClassId }, onSuccess, onFailure);
+            }}
+            onRemove={() => {
+              spell.handleRemove({ characterClassId }, onSuccess, onFailure);
+            }}
+            onAdd={() => {
+              spell.handleAdd({ characterClassId }, onSuccess, onFailure);
+            }}
+            isPrepareMaxed={isPrepareMaxed}
+            isCantripsKnownMaxed={isCantripsKnownMaxed}
+            isSpellsKnownMaxed={isSpellsKnownMaxed}
+            addButtonText={addButtonText}
+            enableAdd={enableAdd}
+            enablePrepare={enablePrepare}
+            enableUnprepare={enableUnprepare}
+            enableSpellRemove={enableSpellRemove}
+            buttonUnprepareText={buttonUnprepareText}
+            buttonActiveStyle={buttonActiveStyle}
+            spellCasterInfo={spellCasterInfo}
+            ruleData={ruleData}
+            entityValueLookup={entityValueLookup}
+            showExpandedType={showExpandedType ?? true}
+            showCustomize={showCustomize}
+            dataOriginRefData={dataOriginRefData}
+            proficiencyBonus={proficiencyBonus}
+          />
+        ))}
+      </React.Fragment>
+    );
+  }
+
+  function renderLoading(): React.ReactNode {
+    return <LoadingPlaceholder />;
+  }
+
+  let content: React.ReactNode;
+  switch (loadingStatus) {
+    case DataLoadingStatusEnum.LOADED:
+      content = renderUi();
+      break;
+
+    case DataLoadingStatusEnum.LOADING:
+    default:
+      content = renderLoading();
+      break;
+  }
+
+  return <div className="ct-spell-manager">{content}</div>;
+}
diff --git a/ddb_main/tools/js/Shared/components/SpellManager/SpellManagerItem/SpellManagerItem.tsx b/ddb_main/tools/js/Shared/components/SpellManager/SpellManagerItem/SpellManagerItem.tsx
new file mode 100644
index 0000000..7f6795c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellManager/SpellManagerItem/SpellManagerItem.tsx
@@ -0,0 +1,190 @@
+import React from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  Constants,
+  DataOriginRefData,
+  EntityValueLookup,
+  RuleData,
+  SpellCasterInfo,
+  SpellManager,
+} from "@dndbeyond/character-rules-engine";
+
+import { SpellName } from "~/components/SpellName";
+
+import SpellDetail from "../../SpellDetail";
+import { RemoveButton, ThemeButton } from "../../common/Button";
+
+interface Props {
+  spell: SpellManager;
+  buttonUnprepareText?: string;
+  buttonActiveStyle?: string;
+  enableSpellRemove: boolean;
+  isPrepareMaxed: boolean;
+  isCantripsKnownMaxed: boolean;
+  isSpellsKnownMaxed: boolean;
+  addButtonText: string;
+  enableAdd: boolean;
+  enablePrepare: boolean;
+  enableUnprepare: boolean;
+  showExpandedType: boolean;
+  showCustomize: boolean;
+  onPrepare: () => void;
+  onUnprepare: () => void;
+  onRemove: () => void;
+  onAdd: () => void;
+  spellCasterInfo: SpellCasterInfo;
+  ruleData: RuleData;
+  entityValueLookup: EntityValueLookup;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+
+export default function SpellManagerItem({
+  spell,
+  isPrepareMaxed,
+  isCantripsKnownMaxed,
+  isSpellsKnownMaxed,
+  showExpandedType,
+  showCustomize,
+  onPrepare,
+  onUnprepare,
+  onRemove,
+  onAdd,
+  spellCasterInfo,
+  ruleData,
+  entityValueLookup,
+  dataOriginRefData,
+  proficiencyBonus,
+  theme,
+  enableSpellRemove = true,
+  enableAdd = true,
+  enablePrepare = true,
+  enableUnprepare = true,
+  buttonUnprepareText = "Prepared",
+  addButtonText = "Prepare",
+  buttonActiveStyle = "",
+}: Props) {
+  function handlePrepareToggle(): void {
+    if (spell.isPrepared()) {
+      onUnprepare();
+    } else {
+      onPrepare();
+    }
+  }
+
+  function handleRemove(): void {
+    onRemove();
+  }
+
+  function handleAdd(): void {
+    onAdd();
+  }
+
+  function renderButtons(classNames: Array<string>): React.ReactNode {
+    const alwaysPrepared = spell.isAlwaysPrepared();
+    const isPrepared = spell.isPrepared();
+    const canRemove = spell.canRemove();
+    const canPrepare = spell.canPrepare();
+    const canAdd = spell.canAdd();
+    const isCantrip = spell.isCantrip();
+
+    let isAddDisabled: boolean = false;
+    if (isCantrip && isCantripsKnownMaxed) {
+      isAddDisabled = true;
+    }
+    if (!isCantrip && isSpellsKnownMaxed) {
+      isAddDisabled = true;
+    }
+
+    let showPrepare: boolean =
+      !alwaysPrepared && canPrepare && (enablePrepare || enableUnprepare);
+
+    let showRemove: boolean =
+      canRemove &&
+      (enableSpellRemove || (spell.isSpellbookCaster() && isCantrip));
+
+    if (isCantrip) {
+      addButtonText = Constants.SpellCastingLearningStyleAddText[Constants.SpellCastingLearningStyle.Learned];
+      buttonUnprepareText = Constants.SpellCastingLearningStyleRemoveText[Constants.SpellCastingLearningStyle.Learned];
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        {alwaysPrepared && (
+          <div className="ct-spell-manager__spell-always">Always Prepared</div>
+        )}
+        {showPrepare && (
+          <ThemeButton
+            size="small"
+            disabled={isPrepareMaxed && !isPrepared}
+            style={isPrepared ? buttonActiveStyle : "outline"}
+            onClick={handlePrepareToggle}
+            stopPropagation={true}
+          >
+            {isPrepared ? buttonUnprepareText : addButtonText}
+          </ThemeButton>
+        )}
+        {showRemove && (
+          <RemoveButton onClick={handleRemove} style={buttonActiveStyle}>
+            {buttonUnprepareText}
+          </RemoveButton>
+        )}
+        {enableAdd && canAdd && (
+          <ThemeButton
+            size="small"
+            onClick={handleAdd}
+            disabled={isAddDisabled}
+            style={"outline"}
+            stopPropagation={true}
+          >
+            {addButtonText}
+          </ThemeButton>
+        )}
+      </div>
+    );
+  }
+
+  function renderHeader(): React.ReactNode {
+    return (
+      <CollapsibleHeaderContent
+        heading={
+          <SpellName
+            spell={spell.spell}
+            showExpandedType={showExpandedType}
+            dataOriginRefData={dataOriginRefData}
+            showLegacy={true}
+          />
+        }
+        callout={renderButtons(["ct-spell-manager__spell-header-actions"])}
+      />
+    );
+  }
+
+  return (
+    <Collapsible
+      layoutType={"minimal"}
+      header={renderHeader()}
+      className="ct-spell-manager__spell"
+    >
+      <SpellDetail
+        theme={theme}
+        spell={spell.spell}
+        isPreparedMaxed={isPrepareMaxed}
+        enableCaster={false}
+        spellCasterInfo={spellCasterInfo}
+        ruleData={ruleData}
+        onPrepareToggle={handlePrepareToggle}
+        onRemove={handleRemove}
+        entityValueLookup={entityValueLookup}
+        showCustomize={showCustomize}
+        proficiencyBonus={proficiencyBonus}
+      />
+    </Collapsible>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/components/SpellManager/SpellManagerItem/index.ts b/ddb_main/tools/js/Shared/components/SpellManager/SpellManagerItem/index.ts
new file mode 100644
index 0000000..2afa6c6
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellManager/SpellManagerItem/index.ts
@@ -0,0 +1,4 @@
+import SpellManagerItem from "./SpellManagerItem";
+
+export default SpellManagerItem;
+export { SpellManagerItem };
diff --git a/ddb_main/tools/js/Shared/components/SpellManager/index.ts b/ddb_main/tools/js/Shared/components/SpellManager/index.ts
new file mode 100644
index 0000000..9ab17e2
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellManager/index.ts
@@ -0,0 +1,5 @@
+import SpellManager from "./SpellManager";
+import SpellManagerItem from "./SpellManagerItem";
+
+export default SpellManager;
+export { SpellManager, SpellManagerItem };
diff --git a/ddb_main/tools/js/Shared/components/SpellSlotChooser/SpellSlotChooser.tsx b/ddb_main/tools/js/Shared/components/SpellSlotChooser/SpellSlotChooser.tsx
new file mode 100644
index 0000000..3dd30ab
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellSlotChooser/SpellSlotChooser.tsx
@@ -0,0 +1,47 @@
+import React from "react";
+
+import { ThemeButton } from "../common/Button";
+
+interface Props {
+  onPactChoose: () => void;
+  onSpellChoose: () => void;
+  isSpellSlotAvailable: boolean;
+  isPactSlotAvailable: boolean;
+  doesSpellSlotExist: boolean;
+  doesPactSlotExist: boolean;
+}
+export default class SpellSlotChooser extends React.PureComponent<Props> {
+  render() {
+    const {
+      onPactChoose,
+      onSpellChoose,
+      doesSpellSlotExist,
+      doesPactSlotExist,
+      isSpellSlotAvailable,
+      isPactSlotAvailable,
+    } = this.props;
+
+    return (
+      <div className="ct-spells-slot-chooser">
+        {doesSpellSlotExist && (
+          <ThemeButton
+            onClick={onSpellChoose}
+            size={"small"}
+            disabled={!isSpellSlotAvailable}
+          >
+            Spell Slot
+          </ThemeButton>
+        )}
+        {doesPactSlotExist && (
+          <ThemeButton
+            onClick={onPactChoose}
+            size={"small"}
+            disabled={!isPactSlotAvailable}
+          >
+            Pact Slot
+          </ThemeButton>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/SpellSlotChooser/index.ts b/ddb_main/tools/js/Shared/components/SpellSlotChooser/index.ts
new file mode 100644
index 0000000..d947706
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellSlotChooser/index.ts
@@ -0,0 +1,4 @@
+import SpellSlotChooser from "./SpellSlotChooser";
+
+export default SpellSlotChooser;
+export { SpellSlotChooser };
diff --git a/ddb_main/tools/js/Shared/components/SpellsLevel/SpellsLevel.tsx b/ddb_main/tools/js/Shared/components/SpellsLevel/SpellsLevel.tsx
new file mode 100644
index 0000000..801e2c9
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellsLevel/SpellsLevel.tsx
@@ -0,0 +1,238 @@
+import React from "react";
+
+import {
+  AbilityLookup,
+  CharacterTheme,
+  Constants,
+  DataOriginRefData,
+  ExperienceInfo,
+  RuleData,
+  ScaledSpell,
+  Spell,
+  SpellCasterInfo,
+  SpellSlotContract,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/es";
+import { IRollContext } from "@dndbeyond/dice";
+
+import SpellsSpell from "../SpellsSpell";
+
+interface Props {
+  spells: Array<ScaledSpell>;
+  level: number;
+  spellCasterInfo: SpellCasterInfo;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  xpInfo: ExperienceInfo;
+  onSpellClick?: (spell: Spell, castLevel: number) => void;
+  onSpellSlotChange?: (castLevel: number, changeAmount: number) => void;
+  onPactSlotChange?: (castLevel: number, changeAmount: number) => void;
+  onSpellLimitedUseSet?: (
+    mappingId: number,
+    mappingTypeId: number,
+    uses: number,
+    dataOriginType: Constants.DataOriginTypeEnum
+  ) => void;
+  onItemLimitedUseSet?: (
+    mappingId: number,
+    mappingTypeId: number,
+    uses: number
+  ) => void;
+  showNotes: boolean;
+  isInteractive: boolean;
+  diceEnabled: boolean;
+  theme: CharacterTheme;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+  rollContext: IRollContext;
+}
+export default class SpellsLevel extends React.PureComponent<Props> {
+  static defaultProps = {
+    showNotes: true,
+    diceEnabled: false,
+  };
+
+  handleSpellSlotChange = (changeAmount: number): void => {
+    const { onSpellSlotChange, level } = this.props;
+
+    if (onSpellSlotChange) {
+      onSpellSlotChange(level, changeAmount);
+    }
+  };
+
+  handlePactSlotChange = (changeAmount: number): void => {
+    const { onPactSlotChange, level } = this.props;
+
+    if (onPactSlotChange) {
+      onPactSlotChange(level, changeAmount);
+    }
+  };
+
+  handleSpellClick = (spell: Spell, castLevel: number): void => {
+    const { onSpellClick } = this.props;
+
+    if (onSpellClick) {
+      onSpellClick(spell, castLevel);
+    }
+  };
+
+  handleSpellUse = (
+    useSpellSlot: boolean,
+    usePactMagicSlot: boolean,
+    dataOriginType: Constants.DataOriginTypeEnum,
+    uses: number | null,
+    mappingId: number | null,
+    mappingTypeId: number | null
+  ): void => {
+    const { onSpellLimitedUseSet, onItemLimitedUseSet } = this.props;
+
+    if (useSpellSlot) {
+      this.handleSpellSlotChange(1);
+    }
+    if (usePactMagicSlot) {
+      this.handlePactSlotChange(1);
+    }
+    if (uses !== null && mappingId !== null && mappingTypeId !== null) {
+      switch (dataOriginType) {
+        case Constants.DataOriginTypeEnum.ITEM:
+          if (onItemLimitedUseSet) {
+            onItemLimitedUseSet(mappingId, mappingTypeId, uses);
+          }
+          break;
+        default:
+          if (onSpellLimitedUseSet) {
+            onSpellLimitedUseSet(
+              mappingId,
+              mappingTypeId,
+              uses,
+              dataOriginType
+            );
+          }
+      }
+    }
+  };
+
+  getSpellSlotInfo = (): SpellSlotContract | null => {
+    const { spellCasterInfo, level } = this.props;
+    const { spellSlots } = spellCasterInfo;
+
+    let spellSlotInfo = spellSlots.find(
+      (spellSlotGroup) => spellSlotGroup.level === level
+    );
+    return spellSlotInfo ? spellSlotInfo : null;
+  };
+
+  getPactSlotInfo = (): SpellSlotContract | null => {
+    const { spellCasterInfo, level } = this.props;
+    const { pactMagicSlots } = spellCasterInfo;
+
+    let spellSlotInfo = pactMagicSlots.find(
+      (pactSlotGroup) => pactSlotGroup.level === level
+    );
+    return spellSlotInfo ? spellSlotInfo : null;
+  };
+
+  renderSpell = (spell: ScaledSpell): React.ReactNode => {
+    const {
+      ruleData,
+      abilityLookup,
+      xpInfo,
+      level,
+      showNotes,
+      isInteractive,
+      diceEnabled,
+      theme,
+      dataOriginRefData,
+      proficiencyBonus,
+      rollContext,
+    } = this.props;
+
+    let spellSlotLevel = this.getSpellSlotInfo();
+    let pactMagicLevel = this.getPactSlotInfo();
+    let doesSpellSlotExist: boolean =
+      !!spellSlotLevel && spellSlotLevel.available > 0;
+    let doesPactSlotExist: boolean =
+      !!pactMagicLevel && pactMagicLevel.available > 0;
+
+    let isSpellSlotAvailable: boolean = false;
+    if (doesSpellSlotExist && spellSlotLevel) {
+      isSpellSlotAvailable = spellSlotLevel.used < spellSlotLevel.available;
+    }
+
+    let isPactSlotAvailable: boolean = false;
+    if (doesPactSlotExist && pactMagicLevel) {
+      isPactSlotAvailable = pactMagicLevel.used < pactMagicLevel.available;
+    }
+
+    return (
+      <SpellsSpell
+        key={SpellUtils.getUniqueKey(spell)}
+        spell={spell}
+        abilityLookup={abilityLookup}
+        ruleData={ruleData}
+        castLevel={level}
+        characterLevel={xpInfo.currentLevel}
+        onClick={this.handleSpellClick}
+        onUse={this.handleSpellUse}
+        doesSpellSlotExist={doesSpellSlotExist}
+        doesPactSlotExist={doesPactSlotExist}
+        isSpellSlotAvailable={isSpellSlotAvailable}
+        isPactSlotAvailable={isPactSlotAvailable}
+        showNotes={showNotes}
+        isInteractive={isInteractive}
+        diceEnabled={diceEnabled}
+        theme={theme}
+        dataOriginRefData={dataOriginRefData}
+        proficiencyBonus={proficiencyBonus}
+        rollContext={rollContext}
+      />
+    );
+  };
+
+  render() {
+    const { spells, showNotes, theme } = this.props;
+
+    return (
+      <div className="ct-spells-level">
+        <div
+          className={`ct-spells-level__spells-row-header ${
+            theme.isDarkMode
+              ? "ct-spells-level__spells-row-header--dark-mode"
+              : ""
+          }`}
+        >
+          <div className="ct-spells-level__spells-col ct-spells-level__spells-col--action" />
+          <div className="ct-spells-level__spells-col ct-spells-level__spells-col--name">
+            Name
+          </div>
+          <div className="ct-spells-level__spells-col ct-spells-level__spells-col--activation">
+            Time
+          </div>
+          <div className="ct-spells-level__spells-col ct-spells-level__spells-col--range">
+            Range
+          </div>
+          <div className="ct-spells-level__spells-col ct-spells-level__spells-col--tohit">
+            Hit / DC
+          </div>
+          <div className="ct-spells-level__spells-col ct-spells-level__spells-col--damage">
+            Effect
+          </div>
+          {showNotes && (
+            <div className="ct-spells-level__spells-col ct-spells-level__spells-col--notes">
+              Notes
+            </div>
+          )}
+        </div>
+        <div className="ct-spells-level__spells-content">
+          {spells.length ? (
+            spells.map((spell) => this.renderSpell(spell))
+          ) : (
+            <div className="ct-spells-level__empty">
+              No Spells Match the Current Filter
+            </div>
+          )}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/SpellsLevel/index.ts b/ddb_main/tools/js/Shared/components/SpellsLevel/index.ts
new file mode 100644
index 0000000..4cdeb3d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellsLevel/index.ts
@@ -0,0 +1,4 @@
+import SpellsLevel from "./SpellsLevel";
+
+export default SpellsLevel;
+export { SpellsLevel };
diff --git a/ddb_main/tools/js/Shared/components/SpellsLevelCasting/SpellsLevelCasting.tsx b/ddb_main/tools/js/Shared/components/SpellsLevelCasting/SpellsLevelCasting.tsx
new file mode 100644
index 0000000..95001c4
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellsLevelCasting/SpellsLevelCasting.tsx
@@ -0,0 +1,211 @@
+import React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  ClassUtils,
+  SpellCasterCastingEntry,
+  SpellCasterInfo,
+  SpellSlotContract,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+import SlotManager from "../SlotManager";
+
+interface Props {
+  level: number;
+  spellCasterInfo: SpellCasterInfo;
+  onSpellSlotSet?: (level: number, uses: number) => void;
+  onPactSlotSet?: (level: number, uses: number) => void;
+  showSlots: boolean;
+  showCastingInfo: boolean;
+  isInteractive: boolean;
+  isDarkMode?: boolean;
+}
+export default class SpellsLevelCasting extends React.PureComponent<Props> {
+  static defaultProps = {
+    level: 1,
+    showSlots: true,
+    showCastingInfo: true,
+    isInteractive: true,
+  };
+
+  handleSpellSlotSet = (uses: number): void => {
+    const { onSpellSlotSet, level } = this.props;
+
+    if (onSpellSlotSet) {
+      onSpellSlotSet(level, uses);
+    }
+  };
+
+  handlePactSlotSet = (uses: number): void => {
+    const { onPactSlotSet, level } = this.props;
+
+    if (onPactSlotSet) {
+      onPactSlotSet(level, uses);
+    }
+  };
+
+  getSpellSlotInfo = (): SpellSlotContract | null => {
+    const { spellCasterInfo, level } = this.props;
+    const { spellSlots } = spellCasterInfo;
+
+    let spellSlotInfo = spellSlots.find(
+      (spellSlotGroup) => spellSlotGroup.level === level
+    );
+    return spellSlotInfo ? spellSlotInfo : null;
+  };
+
+  getPactSlotInfo = (): SpellSlotContract | null => {
+    const { spellCasterInfo, level } = this.props;
+    const { pactMagicSlots } = spellCasterInfo;
+
+    let spellSlotInfo = pactMagicSlots.find(
+      (pactSlotGroup) => pactSlotGroup.level === level
+    );
+    return spellSlotInfo ? spellSlotInfo : null;
+  };
+
+  hasLevelSlots = (): boolean => {
+    let spellSlotLevel = this.getSpellSlotInfo();
+    let pactMagicLevel = this.getPactSlotInfo();
+
+    return !!(spellSlotLevel || pactMagicLevel);
+  };
+
+  hasCastingInfo = (): boolean => {
+    const { spellCasterInfo } = this.props;
+    const { castingInfo } = spellCasterInfo;
+
+    return !!(
+      castingInfo.modifiers.length ||
+      castingInfo.spellAttacks.length ||
+      castingInfo.saveDcs.length
+    );
+  };
+
+  renderLevelSlots = (): React.ReactNode => {
+    const { isInteractive, isDarkMode } = this.props;
+
+    let spellSlotLevel = this.getSpellSlotInfo();
+    let pactMagicLevel = this.getPactSlotInfo();
+
+    if (!this.hasLevelSlots()) {
+      return null;
+    }
+
+    return (
+      <div className="ct-spells-level-casting__slot-groups">
+        {pactMagicLevel && (
+          <div className="ct-spells-level-casting__slot-group ct-spells-level-casting__slot-group--pact">
+            <div className="ct-spells-level-casting__slot-group-manager">
+              <SlotManager
+                onSet={this.handlePactSlotSet}
+                available={pactMagicLevel.available}
+                used={pactMagicLevel.used}
+                size={"small"}
+                isInteractive={isInteractive}
+              />
+            </div>
+            <div className="ct-spells-level-casting__slot-group-label">
+              Pact
+            </div>
+          </div>
+        )}
+        {spellSlotLevel && (
+          <div className="ct-spells-level-casting__slot-group ct-spells-level-casting__slot-group--spells">
+            <div className="ct-spells-level-casting__slot-group-manager">
+              <SlotManager
+                onSet={this.handleSpellSlotSet}
+                available={spellSlotLevel.available}
+                used={spellSlotLevel.used}
+                size={"small"}
+                isInteractive={isInteractive}
+              />
+            </div>
+            <div
+              className={`ct-spells-level-casting__slot-group-label ${
+                isDarkMode ? "ct-spells-level-casting--dark-mode" : ""
+              }`}
+            >
+              Slots
+            </div>
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  renderCastingInfoGroup = (
+    label: React.ReactNode,
+    entries: Array<SpellCasterCastingEntry>,
+    isSignedNumber: boolean = true
+  ): React.ReactNode => {
+    const { isDarkMode } = this.props;
+
+    return (
+      <div className="ct-spells-level-casting__info-group">
+        <div className="ct-spells-level-casting__info-items">
+          {entries.map((entry) => {
+            if (entry.value === null) {
+              return null;
+            }
+
+            let tooltip = entry.sources
+              .map((charClass) => ClassUtils.getName(charClass))
+              .join(", ");
+
+            return (
+              <Tooltip
+                title={tooltip}
+                className="ct-spells-level-casting__info-item"
+                key={entry.value}
+                tippyOpts={{ dynamicTitle: true }}
+                isDarkMode={isDarkMode}
+              >
+                {isSignedNumber ? (
+                  <NumberDisplay type="signed" number={entry.value} />
+                ) : (
+                  entry.value
+                )}
+              </Tooltip>
+            );
+          })}
+        </div>
+        <div className="ct-spells-level-casting__info-label">{label}</div>
+      </div>
+    );
+  };
+
+  renderCastingInfo = (): React.ReactNode => {
+    const { spellCasterInfo } = this.props;
+    const { castingInfo } = spellCasterInfo;
+
+    if (!this.hasCastingInfo()) {
+      return null;
+    }
+
+    return (
+      <div className="ct-spells-level-casting__info">
+        {this.renderCastingInfoGroup("Modifier", castingInfo.modifiers)}
+        {this.renderCastingInfoGroup("Spell Attack", castingInfo.spellAttacks)}
+        {this.renderCastingInfoGroup("Save DC", castingInfo.saveDcs, false)}
+      </div>
+    );
+  };
+
+  render() {
+    const { showSlots, showCastingInfo } = this.props;
+
+    if (!this.hasCastingInfo() && !this.hasLevelSlots()) {
+      return null;
+    }
+
+    return (
+      <div className="ct-spells-level-casting">
+        {showSlots && this.renderLevelSlots()}
+        {showCastingInfo && this.renderCastingInfo()}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/SpellsLevelCasting/index.ts b/ddb_main/tools/js/Shared/components/SpellsLevelCasting/index.ts
new file mode 100644
index 0000000..ad0e273
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellsLevelCasting/index.ts
@@ -0,0 +1,4 @@
+import SpellsLevelCasting from "./SpellsLevelCasting";
+
+export default SpellsLevelCasting;
+export { SpellsLevelCasting };
diff --git a/ddb_main/tools/js/Shared/components/SpellsSpell/SpellsSpell.tsx b/ddb_main/tools/js/Shared/components/SpellsSpell/SpellsSpell.tsx
new file mode 100644
index 0000000..1ea415f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellsSpell/SpellsSpell.tsx
@@ -0,0 +1,445 @@
+import React, { useCallback, useContext, useEffect, useMemo } from "react";
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  DiceComponentUtils,
+  DigitalDiceWrapper,
+  NoteComponents,
+  SpellDamageEffect,
+} from "@dndbeyond/character-components/es";
+import {
+  AbilityLookup,
+  ActivationUtils,
+  CharacterTheme,
+  Constants,
+  DataOriginRefData,
+  EntityUtils,
+  FormatUtils,
+  RuleData,
+  ScaledSpell,
+  Spell,
+  LeveledSpellManager,
+} from "@dndbeyond/character-rules-engine/es";
+import {
+  Dice,
+  DiceEvent,
+  DiceTools,
+  IRollContext,
+  RollRequest,
+  RollType,
+} from "@dndbeyond/dice";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+import { ItemName } from "~/components/ItemName";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { SpellName } from "~/components/SpellName";
+import { TypeScriptUtils } from "../../utils";
+import SpellSlotChooser from "../SpellSlotChooser";
+import { ThemeButton } from "../common/Button";
+
+interface Props {
+  className?: string;
+  spell: ScaledSpell;
+  castLevel: number;
+  characterLevel: number;
+  isSpellSlotAvailable: boolean;
+  isPactSlotAvailable: boolean;
+  doesSpellSlotExist: boolean;
+  doesPactSlotExist: boolean;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  onClick?: (spell: Spell, castLevel: number) => void;
+  onUse?: (
+    useSpellSlot: boolean,
+    usePactMagicSlot: boolean,
+    dataOriginType: Constants.DataOriginTypeEnum,
+    uses: number | null,
+    mappingId: number | null,
+    mappingTypeId: number | null
+  ) => void;
+  showNotes: boolean;
+  isInteractive: boolean;
+  diceEnabled: boolean;
+  theme: CharacterTheme;
+  proficiencyBonus: number;
+  rollContext: IRollContext;
+}
+
+function SpellsSpell({
+  className = "",
+  spell: spellData,
+  castLevel,
+  characterLevel,
+  isSpellSlotAvailable,
+  isPactSlotAvailable,
+  doesSpellSlotExist,
+  doesPactSlotExist,
+  ruleData,
+  abilityLookup,
+  dataOriginRefData,
+  onClick,
+  onUse,
+  showNotes = true,
+  isInteractive,
+  diceEnabled,
+  theme,
+  proficiencyBonus,
+  rollContext,
+}: Props) {
+  const spell = useMemo(
+    () => new LeveledSpellManager({ spell: spellData }),
+    [spellData]
+  );
+  const [isSlotChooserOpen, setIsSlotChooserOpen] = React.useState(false);
+  const [isCriticalHit, setIsCriticalHit] = React.useState(false);
+  const spellsSpellNode = React.useRef<HTMLDivElement>(null);
+
+  const handleSpellClick = (evt: React.MouseEvent): void => {
+    evt.nativeEvent.stopImmediatePropagation();
+    evt.stopPropagation();
+
+    if (onClick) {
+      onClick(spell.spell, castLevel);
+    }
+  };
+
+  const handleDisabledCastClick = (): void => {
+    if (onClick) {
+      onClick(spell.spell, castLevel);
+    }
+  };
+
+  const handleSpellSlotChooserOpen = (): void => {
+    setIsSlotChooserOpen(true);
+    document.addEventListener("click", handleDocumentClick);
+  };
+
+  const handleSpellSlotChooserClose = (): void => {
+    setIsSlotChooserOpen(false);
+  };
+
+  const handleSpellSlotChosen = (): void => {
+    spell.handleSpellUse(true, false);
+    setIsSlotChooserOpen(false);
+  };
+
+  const handlePactSlotChosen = (): void => {
+    spell.handleSpellUse(false, true);
+    setIsSlotChooserOpen(false);
+  };
+
+  const handleRollResults = (result: RollRequest): void => {
+    let wasCrit = DiceComponentUtils.isCriticalRoll(result);
+    setIsCriticalHit(wasCrit);
+  };
+
+  const diceEventHandler = useMemo(() => {
+    if (!spellsSpellNode.current) {
+      return () => {
+        /* NOOP */
+      };
+    }
+    return DiceComponentUtils.setupResetCritStateOnRoll(
+      spell.getName(),
+      spellsSpellNode.current
+    );
+  }, [spell]);
+  // TODO: use mui click away listener
+  const handleDocumentClick = useCallback((): void => {
+    handleSpellSlotChooserClose();
+    document.removeEventListener("click", handleDocumentClick);
+  }, []);
+
+  useEffect(
+    () => () => {
+      if (isSlotChooserOpen) {
+        document.removeEventListener("click", handleDocumentClick);
+      }
+
+      Dice.removeEventListener(DiceEvent.ROLL, diceEventHandler);
+    },
+    [isSlotChooserOpen, handleDocumentClick, diceEventHandler]
+  );
+
+  // Todo: consider making a separate component for this
+  const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+    useContext(GameLogContext);
+  const renderAttackInfo = (): React.ReactNode => {
+    let toHit: number | null = null;
+    let saveDcValue: number | null = null;
+    let saveDcLabel: string | null = null;
+    let asPartOfWeaponAttack = spell.asPartOfWeaponAttack();
+    let requiresAttackRoll = spell.getRequiresAttackRoll();
+    let requiresSavingThrow = spell.getRequiresSavingThrow();
+    if (requiresAttackRoll) {
+      toHit = spell.getToHit();
+    } else if (requiresSavingThrow) {
+      saveDcValue = spell.getAttackSaveValue();
+      saveDcLabel = spell.getSaveDcAbilityKey();
+    }
+
+    if (!asPartOfWeaponAttack) {
+      if (requiresAttackRoll && toHit !== null) {
+        return (
+          <div className="ct-spells-spell__tohit">
+            <DigitalDiceWrapper
+              diceNotation={DiceTools.CustomD20(toHit)}
+              rollType={RollType.ToHit}
+              rollAction={spell.getName()}
+              diceEnabled={diceEnabled}
+              themeColor={theme.themeColor}
+              onRollResults={handleRollResults}
+              rollContext={rollContext}
+              rollTargetOptions={
+                messageTargetOptions
+                  ? Object.values(messageTargetOptions.entities).filter(
+                      TypeScriptUtils.isNotNullOrUndefined
+                    )
+                  : undefined
+              }
+              rollTargetDefault={defaultMessageTargetOption}
+              userId={Number(userId) || 0}
+            >
+              <NumberDisplay
+                number={toHit}
+                type="signed"
+              />
+            </DigitalDiceWrapper>
+          </div>
+        );
+      } else if (requiresSavingThrow) {
+        return (
+          <div className="ct-spells-spell__save">
+            <span
+              className={`ct-spells-spell__save-label ${
+                theme?.isDarkMode ? "ct-spells-spell--dark-mode" : ""
+              }`}
+            >
+              {saveDcLabel}
+            </span>
+            <span
+              className={`ct-spells-spell__save-value ${
+                theme?.isDarkMode ? "ct-spells-spell--dark-mode" : ""
+              }`}
+            >
+              {saveDcValue}
+            </span>
+          </div>
+        );
+      }
+    }
+
+    return <div className="ct-spells-spell__empty-value">--</div>;
+  };
+
+  let range = spell.getRange();
+  let limitedUse = spell.getLimitedUse();
+  let activation = spell.getActivation();
+  let isScaled = spell.getCastLevel() !== spell.getLevel();
+  let isAtWill = spell.isAtWill();
+  const spellDataOriginType = spell.getDataOriginType();
+  const spellDataOrigin = spell.getDataOrigin();
+
+  let limitedUseButtonText: React.ReactNode;
+  if (limitedUse) {
+    let maxUses = spell.getMaxUses();
+    let consumedAmount = spell.getConsumedUses();
+    if (
+      maxUses === 1 &&
+      spellDataOriginType !== Constants.DataOriginTypeEnum.ITEM
+    ) {
+      limitedUseButtonText = "Use";
+    } else {
+      limitedUseButtonText = `${consumedAmount} ${
+        spellDataOriginType === Constants.DataOriginTypeEnum.ITEM ? "C" : "U"
+      }`;
+    }
+  }
+
+  let usesSpellSlot = spell.getUsesSpellSlot();
+
+  let canCastSpell: boolean = true;
+  if (limitedUse) {
+    canCastSpell = spell.isLimitedUseAvailableAtScaledAmount();
+  } else if (usesSpellSlot) {
+    canCastSpell = isSpellSlotAvailable || isPactSlotAvailable;
+  }
+
+  let scaledInfoNode: React.ReactNode;
+  if (isScaled) {
+    scaledInfoNode = (
+      <span className="ct-spells-spell__scaled">
+        <span className="ct-spells-spell__scaled-level">
+          <span className="ct-spells-spell__scaled-level-number">
+            {spell.getLevel()}
+          </span>
+          <span className="ct-spells-spell__scaled-level-ordinal">
+            {FormatUtils.getOrdinalSuffix(spell.getLevel())}
+          </span>
+        </span>
+      </span>
+    );
+  }
+
+  let combinedMetaItems: Array<React.ReactNode> = [];
+
+  if (spell.isLegacy()) {
+    combinedMetaItems.push("Legacy");
+  }
+
+  switch (spellDataOriginType) {
+    case Constants.DataOriginTypeEnum.ITEM:
+      combinedMetaItems.push(
+        <ItemName item={spellDataOrigin.primary} showAttunement={false} />
+      );
+      break;
+    default:
+      combinedMetaItems.push(EntityUtils.getDataOriginName(spellDataOrigin));
+  }
+
+  let expandedDataOriginRef = spell.getExpandedDataOriginRef();
+  if (expandedDataOriginRef !== null) {
+    combinedMetaItems.push(
+      EntityUtils.getDataOriginRefName(expandedDataOriginRef, dataOriginRefData)
+    );
+  }
+
+  let castAsRitual = spell.isCastAsRitual();
+
+  let actionNode: React.ReactNode;
+  if (castAsRitual) {
+    actionNode = <span className="ct-spells-spell__as-ritual">As Ritual</span>;
+  } else if (isAtWill) {
+    actionNode = <span className="ct-spells-spell__at-will">At Will</span>;
+  } else {
+    actionNode = (
+      <React.Fragment>
+        <ThemeButton
+          size={"small"}
+          onClick={
+            canCastSpell
+              ? () => spell.handleCastClick(handleSpellSlotChooserOpen)
+              : handleDisabledCastClick
+          }
+          disabled={!canCastSpell}
+          block={true}
+          isInteractive={isInteractive}
+        >
+          {scaledInfoNode}
+          {limitedUse ? limitedUseButtonText : "Cast"}
+        </ThemeButton>
+        {isSlotChooserOpen && canCastSpell && (
+          <SpellSlotChooser
+            onPactChoose={handlePactSlotChosen}
+            onSpellChoose={handleSpellSlotChosen}
+            isSpellSlotAvailable={isSpellSlotAvailable}
+            isPactSlotAvailable={isPactSlotAvailable}
+            doesSpellSlotExist={doesSpellSlotExist}
+            doesPactSlotExist={doesPactSlotExist}
+          />
+        )}
+      </React.Fragment>
+    );
+  }
+  let classNames: Array<string> = ["ct-spells-spell", className];
+  if (isCriticalHit) {
+    classNames.push("ct-spells-spell--crit");
+  }
+
+  return (
+    <div
+      className={classNames.join(" ")}
+      onClick={handleSpellClick}
+      ref={spellsSpellNode}
+    >
+      <div className="ct-spells-spell__action">{actionNode}</div>
+      <div className="ct-spells-spell__name">
+        <div
+          className={`ct-spells-spell__label ${
+            isScaled ? "ct-spells-spell__label--scaled" : ""
+          }`}
+        >
+          <SpellName
+            spell={spell.spell}
+            showSpellLevel={false}
+            dataOriginRefData={dataOriginRefData}
+          />
+        </div>
+        {combinedMetaItems.length > 0 && (
+          <div
+            className={`ct-spells-spell__meta ${
+              theme.isDarkMode ? "ct-spells-spell__meta--dark-mode" : ""
+            }`}
+          >
+            {combinedMetaItems.map((metaItem, idx) => (
+              <span className="ct-spells-spell__meta-item" key={idx}>
+                {metaItem}
+              </span>
+            ))}
+          </div>
+        )}
+      </div>
+
+      {activation !== null && (
+        <div
+          className={`ct-spells-spell__activation ${
+            theme.isDarkMode ? "ct-spells-spell__activation--dark-mode" : ""
+          }`}
+        >
+          <Tooltip
+            isDarkMode={theme.isDarkMode}
+            title={ActivationUtils.renderCastingTime(
+              activation,
+              castAsRitual ? 10 : 0,
+              ruleData
+            )}
+            tippyOpts={{ dynamicTitle: true }}
+          >
+            {ActivationUtils.renderCastingTimeAbbreviation(activation)}
+            {castAsRitual && (
+              <span className="ct-spells-spell__activation-extra">+10m</span>
+            )}
+          </Tooltip>
+        </div>
+      )}
+      {range !== null && (
+        <div
+          className={`ct-spells-spell__range ${
+            theme?.isDarkMode ? "ct-spells-spell--dark-mode" : ""
+          }`}
+        >
+          {!!range.origin &&
+            range.origin !== Constants.SpellRangeTypeNameEnum.RANGED && (
+              <span className="ct-spells-spell__range-origin">
+                {range.origin}
+              </span>
+            )}
+          {!!range.rangeValue && (
+            <span className="ct-spells-spell__range-value">
+              <NumberDisplay type="distanceInFt" number={range.rangeValue} />
+            </span>
+          )}
+        </div>
+      )}
+      <div className="ct-spells-spell__attacking">{renderAttackInfo()}</div>
+      <div className="ct-spells-spell__damage">
+        <SpellDamageEffect
+          spell={spell.spell}
+          characterLevel={characterLevel}
+          castLevel={castLevel}
+          ruleData={ruleData}
+          diceEnabled={diceEnabled}
+          theme={theme}
+          isCriticalHit={isCriticalHit}
+          rollContext={rollContext}
+        />
+      </div>
+      {showNotes && (
+        <div className="ct-spells-spell__notes">
+          <NoteComponents theme={theme} notes={spell.getNoteComponents()} />
+        </div>
+      )}
+    </div>
+  );
+}
+
+export default SpellsSpell;
diff --git a/ddb_main/tools/js/Shared/components/SpellsSpell/index.ts b/ddb_main/tools/js/Shared/components/SpellsSpell/index.ts
new file mode 100644
index 0000000..36b0933
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SpellsSpell/index.ts
@@ -0,0 +1,4 @@
+import SpellsSpell from "./SpellsSpell";
+
+export default SpellsSpell;
+export { SpellsSpell };
diff --git a/ddb_main/tools/js/Shared/components/Subsection/Subsection.tsx b/ddb_main/tools/js/Shared/components/Subsection/Subsection.tsx
new file mode 100644
index 0000000..4654122
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/Subsection/Subsection.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+
+import { FormatUtils } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  name: string;
+  className: string;
+}
+export default class Subsection extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { name, children, className } = this.props;
+
+    let classNames: Array<string> = [className, "ct-subsection"];
+    if (name) {
+      classNames.push(`ct-subsection--${FormatUtils.slugify(name)}`);
+    }
+
+    return <div className={classNames.join(" ")}>{children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/Subsection/SubsectionFooter/SubsectionFooter.tsx b/ddb_main/tools/js/Shared/components/Subsection/SubsectionFooter/SubsectionFooter.tsx
new file mode 100644
index 0000000..b41f7ba
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/Subsection/SubsectionFooter/SubsectionFooter.tsx
@@ -0,0 +1,9 @@
+import React from "react";
+
+export default class SubsectionFooter extends React.PureComponent {
+  render() {
+    const { children } = this.props;
+
+    return <div className="ct-subsection__footer">{children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/Subsection/SubsectionFooter/index.ts b/ddb_main/tools/js/Shared/components/Subsection/SubsectionFooter/index.ts
new file mode 100644
index 0000000..9f9a3ca
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/Subsection/SubsectionFooter/index.ts
@@ -0,0 +1,4 @@
+import SubsectionFooter from "./SubsectionFooter";
+
+export default SubsectionFooter;
+export { SubsectionFooter };
diff --git a/ddb_main/tools/js/Shared/components/Subsection/SubsectionHeader/SubsectionHeader.tsx b/ddb_main/tools/js/Shared/components/Subsection/SubsectionHeader/SubsectionHeader.tsx
new file mode 100644
index 0000000..dc49e23
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/Subsection/SubsectionHeader/SubsectionHeader.tsx
@@ -0,0 +1,9 @@
+import React from "react";
+
+export default class SubsectionHeader extends React.PureComponent {
+  render() {
+    const { children } = this.props;
+
+    return <div className="ct-subsection__header">{children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/Subsection/SubsectionHeaderContent/SubsectionHeaderContent.tsx b/ddb_main/tools/js/Shared/components/Subsection/SubsectionHeaderContent/SubsectionHeaderContent.tsx
new file mode 100644
index 0000000..ccd7d3a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/Subsection/SubsectionHeaderContent/SubsectionHeaderContent.tsx
@@ -0,0 +1,9 @@
+import React from "react";
+
+export default class SubsectionHeaderContent extends React.PureComponent {
+  render() {
+    const { children } = this.props;
+
+    return <div className="ct-subsection__header-content">{children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/Subsection/SubsectionHeaderContent/index.ts b/ddb_main/tools/js/Shared/components/Subsection/SubsectionHeaderContent/index.ts
new file mode 100644
index 0000000..9ab1c26
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/Subsection/SubsectionHeaderContent/index.ts
@@ -0,0 +1,4 @@
+import SubsectionHeaderContent from "./SubsectionHeaderContent";
+
+export default SubsectionHeaderContent;
+export { SubsectionHeaderContent };
diff --git a/ddb_main/tools/js/Shared/components/Subsection/index.ts b/ddb_main/tools/js/Shared/components/Subsection/index.ts
new file mode 100644
index 0000000..9b6cf13
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/Subsection/index.ts
@@ -0,0 +1,12 @@
+import Subsection from "./Subsection";
+import SubsectionFooter from "./SubsectionFooter";
+import SubsectionHeader from "./SubsectionHeader";
+import SubsectionHeaderContent from "./SubsectionHeaderContent";
+
+export default Subsection;
+export {
+  Subsection,
+  SubsectionFooter,
+  SubsectionHeader,
+  SubsectionHeaderContent,
+};
diff --git a/ddb_main/tools/js/Shared/components/SuggestionTable/SuggestionTable.tsx b/ddb_main/tools/js/Shared/components/SuggestionTable/SuggestionTable.tsx
new file mode 100644
index 0000000..7325e95
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SuggestionTable/SuggestionTable.tsx
@@ -0,0 +1,109 @@
+import React from "react";
+
+import { BackgroundCharacteristicContract } from "@dndbeyond/character-rules-engine/es";
+
+import { ThemeButton } from "../common/Button";
+
+interface Props {
+  suggestions: Array<BackgroundCharacteristicContract>;
+  tableLabel: React.ReactNode;
+  dieLabel: React.ReactNode;
+  useButtonLabel: React.ReactNode;
+  randomizeButtonLabel: React.ReactNode;
+  onSuggestionUse?: (
+    idx: number,
+    diceRoll: number,
+    description: string | null
+  ) => void;
+}
+export default class SuggestionTable extends React.PureComponent<Props> {
+  static defaultProps = {
+    useButtonLabel: "+ Add",
+    randomizeButtonLabel: "Random",
+    suggestions: [],
+  };
+
+  handleSuggestionUse = (
+    idx: number,
+    diceRoll: number,
+    description: string | null
+  ): void => {
+    const { onSuggestionUse } = this.props;
+
+    if (onSuggestionUse) {
+      onSuggestionUse(idx, diceRoll, description);
+    }
+  };
+
+  handleRandomClick = (): void => {
+    const { onSuggestionUse, suggestions } = this.props;
+
+    if (onSuggestionUse) {
+      let randomIdx: number = Math.floor(Math.random() * suggestions.length);
+      let randomSuggestion: BackgroundCharacteristicContract =
+        suggestions[randomIdx];
+      onSuggestionUse(
+        randomIdx,
+        randomSuggestion.diceRoll,
+        randomSuggestion.description
+      );
+    }
+  };
+
+  render() {
+    const {
+      suggestions,
+      dieLabel,
+      tableLabel,
+      useButtonLabel,
+      randomizeButtonLabel,
+    } = this.props;
+
+    return (
+      <div className="ct-suggestions-table">
+        <table className="ct-suggestions-table__table">
+          <thead>
+            <tr className="ct-suggestions-table__header">
+              <th className="ct-suggestions-table__header-col ct-suggestions-table__col--die">
+                {dieLabel}
+              </th>
+              <th className="ct-suggestions-table__header-col ct-suggestions-table__col--desc">
+                {tableLabel}
+              </th>
+              <th className="ct-suggestions-table__header-col ct-suggestions-table__col--action">
+                <ThemeButton size="small" onClick={this.handleRandomClick}>
+                  {randomizeButtonLabel}
+                </ThemeButton>
+              </th>
+            </tr>
+          </thead>
+          <tbody>
+            {suggestions.map((suggestion, idx) => (
+              <tr className="ct-suggestions-table__item" key={idx}>
+                <td className="ct-suggestions-table__item-col ct-suggestions-table__col--die">
+                  {suggestion.diceRoll}
+                </td>
+                <td className="ct-suggestions-table__item-col ct-suggestions-table__col--desc">
+                  {suggestion.description}
+                </td>
+                <td className="ct-suggestions-table__item-col ct-suggestions-table__col--action">
+                  <ThemeButton
+                    size="small"
+                    onClick={this.handleSuggestionUse.bind(
+                      this,
+                      idx,
+                      suggestion.diceRoll,
+                      suggestion.description
+                    )}
+                  >
+                    {useButtonLabel}
+                  </ThemeButton>
+                </td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/SuggestionTable/index.ts b/ddb_main/tools/js/Shared/components/SuggestionTable/index.ts
new file mode 100644
index 0000000..92e9cbb
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/SuggestionTable/index.ts
@@ -0,0 +1,4 @@
+import SuggestionTable from "./SuggestionTable";
+
+export default SuggestionTable;
+export { SuggestionTable };
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditor.tsx b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditor.tsx
new file mode 100644
index 0000000..327e434
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditor.tsx
@@ -0,0 +1,357 @@
+import React from "react";
+
+import {
+  Constants,
+  EntityAdjustmentConstraintContract,
+  RuleData,
+  RuleDataUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import {
+  SIGNED_32BIT_INT_MAX_VALUE,
+  SIGNED_32BIT_INT_MIN_VALUE,
+} from "~/subApps/sheet/constants";
+
+import ValueEditorCheckboxProperty from "./ValueEditorCheckboxProperty";
+import ValueEditorNumberProperty from "./ValueEditorNumberProperty";
+import ValueEditorSelectProperty from "./ValueEditorSelectProperty";
+import ValueEditorTextProperty from "./ValueEditorTextProperty";
+
+interface ConstraintProps {
+  minimumValue?: number;
+  maximumValue?: number;
+}
+
+interface Props {
+  dataLookup: Partial<Record<Constants.AdjustmentTypeEnum, any>>;
+  valueEditors: Array<number>; // TODO deal with enums not working with switch statement
+  labelOverrides: Partial<Record<Constants.AdjustmentTypeEnum, string>>;
+  optionRestrictions: Partial<Record<Constants.AdjustmentTypeEnum, Array<any>>>;
+  defaultValues: Partial<Record<Constants.AdjustmentTypeEnum, any>>;
+  layoutType: "standard" | "compact";
+  onDataUpdate?: (
+    propertyKey: Constants.AdjustmentTypeEnum,
+    value: any,
+    source: any
+  ) => void;
+  ruleData: RuleData;
+  className: string;
+}
+interface State {
+  dataLookup: Partial<Record<Constants.AdjustmentTypeEnum, any>>;
+}
+export default class ValueEditor extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    className: "",
+    labelOverrides: {},
+    optionRestrictions: {},
+    defaultValues: {},
+    layoutType: "standard",
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = this.generateStateData(props);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { dataLookup } = this.props;
+
+    if (dataLookup !== prevProps.dataLookup) {
+      this.setState(this.generateStateData(this.props));
+    }
+  }
+
+  generateStateData = (props: Props): State => {
+    const { dataLookup } = props;
+
+    return {
+      dataLookup,
+    };
+  };
+
+  getNumberConstraintProps = (
+    constraintLookup: Record<number, EntityAdjustmentConstraintContract>
+  ): ConstraintProps => {
+    let constraintProps: ConstraintProps = {};
+    if (constraintLookup[Constants.AdjustmentConstraintTypeEnum.MINIMUM]) {
+      constraintProps.minimumValue = this.getConstraintValue(
+        Constants.AdjustmentConstraintTypeEnum.MINIMUM,
+        constraintLookup
+      );
+    } else {
+      constraintProps.minimumValue = SIGNED_32BIT_INT_MIN_VALUE;
+    }
+    if (constraintLookup[Constants.AdjustmentConstraintTypeEnum.MAXIMUM]) {
+      constraintProps.maximumValue = this.getConstraintValue(
+        Constants.AdjustmentConstraintTypeEnum.MAXIMUM,
+        constraintLookup
+      );
+    } else {
+      constraintProps.maximumValue = SIGNED_32BIT_INT_MAX_VALUE;
+    }
+    return constraintProps;
+  };
+
+  getConstraintValue = (
+    constraintTypeId: Constants.AdjustmentConstraintTypeEnum,
+    constraintLookup: Record<number, EntityAdjustmentConstraintContract>,
+    fallback: any = null
+  ): any => {
+    let constraint = constraintLookup[constraintTypeId];
+    if (constraint) {
+      return constraint.value;
+    }
+    return fallback;
+  };
+
+  getPropertyValue = (key: Constants.AdjustmentTypeEnum): any => {
+    const { dataLookup, defaultValues } = this.props;
+
+    let property = dataLookup[key];
+    if (property) {
+      return property.value;
+    }
+
+    let defaultValue = defaultValues[key];
+    if (defaultValue) {
+      return defaultValue;
+    }
+
+    return null;
+  };
+
+  getPropertySource = (key: Constants.AdjustmentTypeEnum): string | null => {
+    const { dataLookup } = this.state;
+    let property = dataLookup[key];
+    if (property) {
+      return property.notes;
+    }
+    return null;
+  };
+
+  restrictOptions = <T extends any>(
+    key: Constants.AdjustmentTypeEnum,
+    options: Array<T>
+  ): Array<T> => {
+    const { optionRestrictions } = this.props;
+
+    let typeOptionRestrictions = optionRestrictions[key];
+
+    if (!typeOptionRestrictions || typeOptionRestrictions.length === 0) {
+      return options;
+    }
+
+    return options.filter((option) => {
+      if (!typeOptionRestrictions) {
+        return true;
+      }
+      // @ts-ignore
+      return typeOptionRestrictions.includes(option.value);
+    });
+  };
+
+  handleDataUpdate = (
+    key: Constants.AdjustmentTypeEnum,
+    value: any,
+    source: any
+  ): void => {
+    const { onDataUpdate } = this.props;
+
+    this.setState((prevState: State): State => {
+      let processedSource: string | null = source === "" ? null : source;
+      if (
+        onDataUpdate &&
+        (this.getPropertyValue(key) !== value ||
+          this.getPropertySource(key) !== processedSource)
+      ) {
+        onDataUpdate(key, value, processedSource);
+      }
+
+      return {
+        ...prevState,
+        dataLookup: {
+          ...prevState.dataLookup,
+          [key]: {
+            value,
+            notes: processedSource,
+          },
+        },
+      };
+    });
+  };
+
+  render() {
+    const { valueEditors, className, ruleData, labelOverrides, layoutType } =
+      this.props;
+
+    let enableSource: boolean = layoutType === "standard";
+    let layoutClass: string = layoutType === "compact" ? "compact" : "standard";
+
+    let classNames: Array<string> = [
+      "ct-value-editor",
+      `ct-value-editor--${layoutClass}`,
+      className,
+    ];
+
+    return (
+      <div className={classNames.join(" ")}>
+        {valueEditors.map((valueTypeId) => {
+          let valueDataTypeId = RuleDataUtils.getAdjustmentDataType(
+            valueTypeId,
+            ruleData
+          );
+          let constraintLookup = RuleDataUtils.getAdjustmentConstraintLookup(
+            valueTypeId,
+            ruleData
+          );
+          let valueName: string = "";
+          if (labelOverrides.hasOwnProperty(valueTypeId)) {
+            valueName = labelOverrides[valueTypeId];
+          } else {
+            let adjustmentName = RuleDataUtils.getAdjustmentName(
+              valueTypeId,
+              ruleData
+            );
+            if (adjustmentName) {
+              valueName = adjustmentName;
+            }
+          }
+          switch (valueDataTypeId) {
+            case Constants.AdjustmentDataTypeEnum.STRING:
+              return (
+                <ValueEditorTextProperty
+                  key={valueTypeId}
+                  propertyKey={valueTypeId}
+                  defaultValue={this.getPropertyValue(valueTypeId)}
+                  label={valueName}
+                  onUpdate={this.handleDataUpdate}
+                  enableSource={enableSource}
+                  initialFocus={
+                    valueTypeId === Constants.AdjustmentTypeEnum.NAME_OVERRIDE
+                  }
+                />
+              );
+
+            case Constants.AdjustmentDataTypeEnum.BOOLEAN:
+              return (
+                <ValueEditorCheckboxProperty
+                  key={valueTypeId}
+                  propertyKey={valueTypeId}
+                  initiallyEnabled={this.getPropertyValue(valueTypeId)}
+                  defaultSource={this.getPropertySource(valueTypeId)}
+                  label={valueName}
+                  onUpdate={this.handleDataUpdate}
+                  enableSource={enableSource}
+                />
+              );
+
+            case Constants.AdjustmentDataTypeEnum.INTEGER:
+              let baseProps = {
+                key: valueTypeId,
+                propertyKey: valueTypeId,
+                defaultValue: this.getPropertyValue(valueTypeId),
+                defaultSource: this.getPropertySource(valueTypeId),
+                label: valueName,
+                onUpdate: this.handleDataUpdate,
+                enableSource: enableSource,
+              };
+
+              switch (valueTypeId) {
+                case Constants.AdjustmentTypeEnum.SKILL_STAT_OVERRIDE:
+                  return (
+                    <ValueEditorSelectProperty
+                      {...baseProps}
+                      options={RuleDataUtils.getStatOptions(ruleData)}
+                    />
+                  );
+
+                case Constants.AdjustmentTypeEnum.DICE_TYPE_OVERRIDE:
+                  return (
+                    <ValueEditorSelectProperty
+                      {...baseProps}
+                      options={RuleDataUtils.getDieTypeOptions(ruleData)}
+                    />
+                  );
+
+                case Constants.AdjustmentTypeEnum.SKILL_PROFICIENCY_LEVEL:
+                case Constants.AdjustmentTypeEnum
+                  .SAVING_THROW_PROFICIENCY_LEVEL:
+                  return (
+                    <ValueEditorSelectProperty
+                      {...baseProps}
+                      options={RuleDataUtils.getProficiencyLevelOptions(
+                        ruleData
+                      )}
+                    />
+                  );
+
+                case Constants.AdjustmentTypeEnum.CREATURE_ALIGNMENT:
+                  return (
+                    <ValueEditorSelectProperty
+                      {...baseProps}
+                      options={RuleDataUtils.getAlignmentOptions(ruleData)}
+                    />
+                  );
+
+                case Constants.AdjustmentTypeEnum.CREATURE_SIZE:
+                  return (
+                    <ValueEditorSelectProperty
+                      {...baseProps}
+                      options={RuleDataUtils.getCreatureSizeOptions(ruleData)}
+                    />
+                  );
+
+                case Constants.AdjustmentTypeEnum.CREATURE_TYPE_OVERRIDE:
+                  return (
+                    <ValueEditorSelectProperty
+                      {...baseProps}
+                      options={this.restrictOptions(
+                        valueTypeId,
+                        RuleDataUtils.getMonsterTypeOptions(ruleData)
+                      )}
+                    />
+                  );
+
+                default:
+                  let constraintProps =
+                    this.getNumberConstraintProps(constraintLookup);
+                  return (
+                    <ValueEditorNumberProperty
+                      {...baseProps}
+                      {...constraintProps}
+                    />
+                  );
+              }
+
+            case Constants.AdjustmentDataTypeEnum.DECIMAL:
+              let constraintProps =
+                this.getNumberConstraintProps(constraintLookup);
+              return (
+                <ValueEditorNumberProperty
+                  key={valueTypeId}
+                  step={0.01}
+                  propertyKey={valueTypeId}
+                  defaultValue={this.getPropertyValue(valueTypeId)}
+                  defaultSource={this.getPropertySource(valueTypeId)}
+                  label={valueName}
+                  onUpdate={this.handleDataUpdate}
+                  enableSource={enableSource}
+                  {...constraintProps}
+                />
+              );
+
+            default:
+            // not implemented
+          }
+
+          return null;
+        })}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorCheckboxProperty/ValueEditorCheckboxProperty.tsx b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorCheckboxProperty/ValueEditorCheckboxProperty.tsx
new file mode 100644
index 0000000..6f3179c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorCheckboxProperty/ValueEditorCheckboxProperty.tsx
@@ -0,0 +1,112 @@
+import React from "react";
+
+import { Checkbox } from "@dndbeyond/character-components/es";
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import ValueEditorProperty from "../ValueEditorProperty";
+import ValueEditorPropertySource from "../ValueEditorPropertySource";
+import ValueEditorPropertyValue from "../ValueEditorPropertyValue";
+
+interface Props {
+  label: string;
+  propertyKey: Constants.AdjustmentTypeEnum;
+  initiallyEnabled: boolean;
+  defaultSource: string | null;
+  onUpdate?: (
+    propertyKey: Constants.AdjustmentTypeEnum,
+    isEnabled: boolean,
+    source: string | null
+  ) => void;
+  enableSource: boolean;
+}
+interface State {
+  value: boolean;
+  source: string | null;
+}
+export default class ValueEditorCheckboxProperty extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    enableSource: true,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.initiallyEnabled,
+      source: props.defaultSource,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { initiallyEnabled } = this.props;
+    const { value } = this.state;
+
+    if (
+      initiallyEnabled !== prevProps.initiallyEnabled &&
+      initiallyEnabled !== value
+    ) {
+      this.setState({
+        value: initiallyEnabled,
+      });
+    }
+  }
+
+  handleChange = (isEnabled: boolean): void => {
+    const { source } = this.state;
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, isEnabled, source);
+    }
+  };
+
+  handleSourceUpdate = (source: string | null): void => {
+    const { value } = this.state;
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, value, source);
+    }
+    this.setState({
+      source,
+    });
+  };
+
+  render() {
+    const {
+      propertyKey,
+      label,
+      initiallyEnabled,
+      defaultSource,
+      enableSource,
+    } = this.props;
+
+    return (
+      <ValueEditorProperty
+        className="ct-value-editor__property--checkbox"
+        propertyKey={propertyKey}
+      >
+        <ValueEditorPropertyValue>
+          <Checkbox
+            stopPropagation={true}
+            label={label}
+            initiallyEnabled={initiallyEnabled}
+            onChange={this.handleChange}
+          />
+        </ValueEditorPropertyValue>
+        {enableSource && (
+          <ValueEditorPropertySource
+            onUpdate={this.handleSourceUpdate}
+            defaultValue={defaultSource}
+          />
+        )}
+      </ValueEditorProperty>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorCheckboxProperty/index.ts b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorCheckboxProperty/index.ts
new file mode 100644
index 0000000..a83aee9
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorCheckboxProperty/index.ts
@@ -0,0 +1,4 @@
+import ValueEditorCheckboxProperty from "./ValueEditorCheckboxProperty";
+
+export default ValueEditorCheckboxProperty;
+export { ValueEditorCheckboxProperty };
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorNumberProperty/ValueEditorNumberProperty.tsx b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorNumberProperty/ValueEditorNumberProperty.tsx
new file mode 100644
index 0000000..61d99ea
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorNumberProperty/ValueEditorNumberProperty.tsx
@@ -0,0 +1,152 @@
+import React from "react";
+
+import { Constants, HelperUtils } from "@dndbeyond/character-rules-engine/es";
+
+import ValueEditorProperty from "../ValueEditorProperty";
+import ValueEditorPropertyLabel from "../ValueEditorPropertyLabel";
+import ValueEditorPropertySource from "../ValueEditorPropertySource";
+import ValueEditorPropertyValue from "../ValueEditorPropertyValue";
+
+interface Props {
+  label: string;
+  propertyKey: Constants.AdjustmentTypeEnum;
+  defaultValue: number | null;
+  defaultSource: string | null;
+  minimumValue?: number;
+  maximumValue?: number;
+  onUpdate?: (
+    propertyKey: Constants.AdjustmentTypeEnum,
+    value: number | null,
+    source: string | null
+  ) => void;
+  enableSource: boolean;
+  step: number;
+}
+interface State {
+  value: number | null;
+  source: string | null;
+}
+export default class ValueEditorNumberProperty extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    enableSource: true,
+    step: 1,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue,
+      source: props.defaultSource,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { defaultValue } = this.props;
+    const { value } = this.state;
+
+    if (defaultValue !== prevProps.defaultValue && defaultValue !== value) {
+      this.setState({
+        value: defaultValue,
+      });
+    }
+  }
+
+  getDataValue = (value: number | null): number | null => {
+    const { minimumValue, maximumValue } = this.props;
+
+    if (value === null) {
+      return null;
+    }
+    return HelperUtils.clampInt(
+      value,
+      minimumValue ? minimumValue : null,
+      maximumValue
+    );
+  };
+
+  handleBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { source } = this.state;
+    const { propertyKey, onUpdate, step } = this.props;
+
+    let newValue = this.getDataValue(
+      step < 1
+        ? HelperUtils.parseInputFloat(evt.target.value)
+        : HelperUtils.parseInputInt(evt.target.value)
+    );
+    if (onUpdate) {
+      onUpdate(propertyKey, newValue, source);
+    }
+    this.setState({
+      value: newValue,
+    });
+  };
+
+  handleChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    const { step } = this.props;
+    this.setState({
+      value:
+        step < 1
+          ? HelperUtils.parseInputFloat(evt.target.value)
+          : HelperUtils.parseInputInt(evt.target.value),
+    });
+  };
+
+  handleSourceUpdate = (source: string | null): void => {
+    const { value } = this.state;
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, this.getDataValue(value), source);
+    }
+    this.setState({
+      source,
+    });
+  };
+
+  render() {
+    const { value } = this.state;
+    const {
+      propertyKey,
+      label,
+      minimumValue,
+      maximumValue,
+      defaultSource,
+      enableSource,
+      step,
+    } = this.props;
+
+    return (
+      <ValueEditorProperty
+        className="ct-value-editor__property--number"
+        propertyKey={propertyKey}
+      >
+        <ValueEditorPropertyLabel>{label}</ValueEditorPropertyLabel>
+        <ValueEditorPropertyValue>
+          <input
+            className="ct-value-editor__property-input"
+            type="number"
+            min={minimumValue}
+            max={maximumValue}
+            step={step}
+            value={value === null ? "" : value}
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+          />
+        </ValueEditorPropertyValue>
+        {enableSource && (
+          <ValueEditorPropertySource
+            onUpdate={this.handleSourceUpdate}
+            defaultValue={defaultSource}
+          />
+        )}
+      </ValueEditorProperty>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorNumberProperty/index.ts b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorNumberProperty/index.ts
new file mode 100644
index 0000000..0729e28
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorNumberProperty/index.ts
@@ -0,0 +1,4 @@
+import ValueEditorNumberProperty from "./ValueEditorNumberProperty";
+
+export default ValueEditorNumberProperty;
+export { ValueEditorNumberProperty };
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorProperty/ValueEditorProperty.tsx b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorProperty/ValueEditorProperty.tsx
new file mode 100644
index 0000000..48cf974
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorProperty/ValueEditorProperty.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+interface Props {
+  isBlock: boolean;
+  propertyKey: number;
+  className: string;
+}
+export default class ValueEditorProperty extends React.PureComponent<Props> {
+  static defaultProps = {
+    isBlock: false,
+    className: "",
+  };
+
+  render() {
+    const { className, isBlock, propertyKey } = this.props;
+
+    let classNames: Array<string> = [
+      className,
+      "ct-value-editor__property",
+      `ct-value-editor__property--${propertyKey}`,
+    ];
+    if (isBlock) {
+      classNames.push("ct-value-editor__property--block");
+    }
+
+    return <div className={classNames.join(" ")}>{this.props.children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorProperty/index.ts b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorProperty/index.ts
new file mode 100644
index 0000000..542625a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorProperty/index.ts
@@ -0,0 +1,4 @@
+import ValueEditorProperty from "./ValueEditorProperty";
+
+export default ValueEditorProperty;
+export { ValueEditorProperty };
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyLabel/ValueEditorPropertyLabel.tsx b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyLabel/ValueEditorPropertyLabel.tsx
new file mode 100644
index 0000000..ce9081b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyLabel/ValueEditorPropertyLabel.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class ValueEditorPropertyLabel extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-value-editor__property-label">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyLabel/index.ts b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyLabel/index.ts
new file mode 100644
index 0000000..f01f67f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyLabel/index.ts
@@ -0,0 +1,4 @@
+import ValueEditorPropertyLabel from "./ValueEditorPropertyLabel";
+
+export default ValueEditorPropertyLabel;
+export { ValueEditorPropertyLabel };
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertySource/ValueEditorPropertySource.tsx b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertySource/ValueEditorPropertySource.tsx
new file mode 100644
index 0000000..120fdfe
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertySource/ValueEditorPropertySource.tsx
@@ -0,0 +1,76 @@
+import React from "react";
+
+interface Props {
+  defaultValue: string | null;
+  placeholder: string;
+  onUpdate?: (value: string) => void;
+}
+interface State {
+  value: string | null;
+}
+export default class ValueEditorPropertySource extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    placeholder: "Enter Source Notes...",
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { defaultValue } = this.props;
+    const { value } = this.state;
+
+    if (defaultValue !== prevProps.defaultValue && defaultValue !== value) {
+      this.setState({
+        value: defaultValue,
+      });
+    }
+  }
+
+  handleChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    this.setState({
+      value: evt.target.value,
+    });
+  };
+
+  handleBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { onUpdate } = this.props;
+
+    let value = evt.target.value;
+    if (onUpdate) {
+      onUpdate(value);
+    }
+    this.setState({
+      value,
+    });
+  };
+
+  render() {
+    const { value } = this.state;
+    const { placeholder } = this.props;
+
+    return (
+      <div className="ct-value-editor__property-source">
+        <input
+          className="ct-value-editor__property-input"
+          type="text"
+          placeholder={placeholder}
+          onChange={this.handleChange}
+          onBlur={this.handleBlur}
+          value={value === null ? "" : value}
+        />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertySource/index.ts b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertySource/index.ts
new file mode 100644
index 0000000..9bec270
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertySource/index.ts
@@ -0,0 +1,4 @@
+import ValueEditorPropertySource from "./ValueEditorPropertySource";
+
+export default ValueEditorPropertySource;
+export { ValueEditorPropertySource };
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyValue/ValueEditorPropertyValue.tsx b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyValue/ValueEditorPropertyValue.tsx
new file mode 100644
index 0000000..bd02d2d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyValue/ValueEditorPropertyValue.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class ValueEditorPropertyValue extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-value-editor__property-value">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyValue/index.ts b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyValue/index.ts
new file mode 100644
index 0000000..3c76eac
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorPropertyValue/index.ts
@@ -0,0 +1,4 @@
+import ValueEditorPropertyValue from "./ValueEditorPropertyValue";
+
+export default ValueEditorPropertyValue;
+export { ValueEditorPropertyValue };
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorSelectProperty/ValueEditorSelectProperty.tsx b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorSelectProperty/ValueEditorSelectProperty.tsx
new file mode 100644
index 0000000..aafb9e3
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorSelectProperty/ValueEditorSelectProperty.tsx
@@ -0,0 +1,122 @@
+import React from "react";
+
+import { Select } from "@dndbeyond/character-components/es";
+import { HelperUtils, Constants } from "@dndbeyond/character-rules-engine/es";
+
+import ValueEditorProperty from "../ValueEditorProperty";
+import ValueEditorPropertyLabel from "../ValueEditorPropertyLabel";
+import ValueEditorPropertySource from "../ValueEditorPropertySource";
+import ValueEditorPropertyValue from "../ValueEditorPropertyValue";
+
+interface Props {
+  label: string;
+  propertyKey: Constants.AdjustmentTypeEnum;
+  defaultValue: number | null;
+  defaultSource: string | null;
+  options: Array<any>; // TODO figure out type
+  selectProps: any; // TODO use Partial<Select.props> somehow
+  onUpdate?: (
+    propertyKey: Constants.AdjustmentTypeEnum,
+    value: number | null,
+    source: string | null
+  ) => void;
+  enableSource: boolean;
+}
+interface State {
+  value: number | null;
+  source: string | null;
+}
+export default class ValueEditorSelectProperty extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    selectProps: {},
+    enableSource: true,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue,
+      source: props.defaultSource,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { defaultValue } = this.props;
+    const { value } = this.state;
+
+    if (defaultValue !== prevProps.defaultValue && defaultValue !== value) {
+      this.setState({
+        value: defaultValue,
+      });
+    }
+  }
+
+  handleSelectChange = (value: string): void => {
+    const { source } = this.state;
+    const { propertyKey, onUpdate } = this.props;
+
+    let parsedValue = HelperUtils.parseInputInt(value);
+
+    if (onUpdate) {
+      onUpdate(propertyKey, parsedValue, source);
+    }
+    this.setState({
+      value: parsedValue,
+    });
+  };
+
+  handleSourceUpdate = (source: string | null): void => {
+    const { value } = this.state;
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, value, source);
+    }
+    this.setState({
+      source,
+    });
+  };
+
+  render() {
+    const { value } = this.state;
+    const {
+      propertyKey,
+      label,
+      options,
+      selectProps,
+      defaultSource,
+      enableSource,
+    } = this.props;
+
+    return (
+      <ValueEditorProperty
+        className="ct-value-editor__property--select"
+        propertyKey={propertyKey}
+      >
+        <ValueEditorPropertyLabel>{label}</ValueEditorPropertyLabel>
+        <ValueEditorPropertyValue>
+          <Select
+            placeholder="--"
+            {...selectProps}
+            options={options}
+            value={value}
+            onChange={this.handleSelectChange}
+          />
+        </ValueEditorPropertyValue>
+        {enableSource && (
+          <ValueEditorPropertySource
+            onUpdate={this.handleSourceUpdate}
+            defaultValue={defaultSource}
+          />
+        )}
+      </ValueEditorProperty>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorSelectProperty/index.ts b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorSelectProperty/index.ts
new file mode 100644
index 0000000..418b83a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorSelectProperty/index.ts
@@ -0,0 +1,4 @@
+import ValueEditorSelectProperty from "./ValueEditorSelectProperty";
+
+export default ValueEditorSelectProperty;
+export { ValueEditorSelectProperty };
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextProperty/ValueEditorTextProperty.tsx b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextProperty/ValueEditorTextProperty.tsx
new file mode 100644
index 0000000..5a967a8
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextProperty/ValueEditorTextProperty.tsx
@@ -0,0 +1,105 @@
+import React from "react";
+
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import ValueEditorProperty from "../ValueEditorProperty";
+import ValueEditorPropertyLabel from "../ValueEditorPropertyLabel";
+import ValueEditorPropertyValue from "../ValueEditorPropertyValue";
+
+interface Props {
+  label: string;
+  propertyKey: Constants.AdjustmentTypeEnum;
+  defaultValue: string | null;
+  onUpdate?: (
+    propertyKey: Constants.AdjustmentTypeEnum,
+    value: string | null,
+    source: string | null
+  ) => void;
+  enableSource: boolean;
+  initialFocus?: boolean;
+}
+interface State {
+  value: string | null;
+}
+export default class ValueEditorTextProperty extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    enableSource: true,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue,
+    };
+  }
+  inputRef = React.createRef<HTMLInputElement>();
+
+  componentDidMount() {
+    if (this.inputRef.current && this.props.initialFocus) {
+      this.inputRef.current.focus();
+    }
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { defaultValue } = this.props;
+    const { value } = this.state;
+
+    if (defaultValue !== prevProps.defaultValue && defaultValue !== value) {
+      this.setState({
+        value: defaultValue,
+      });
+    }
+  }
+
+  handleBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      let value: string | null = evt.target.value ? evt.target.value : null;
+      onUpdate(propertyKey, value, null);
+    }
+  };
+
+  handleChange = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { value } = this.state;
+
+    if (value !== evt.target.value) {
+      this.setState({
+        value: evt.target.value,
+      });
+    }
+  };
+
+  render() {
+    const { propertyKey, label } = this.props;
+
+    const { value } = this.state;
+
+    return (
+      <ValueEditorProperty
+        className="ct-value-editor__property--text"
+        propertyKey={propertyKey}
+        isBlock={true}
+      >
+        <ValueEditorPropertyValue>
+          <input
+            type="text"
+            value={value === null ? "" : value}
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+            className="ct-value-editor__property-input"
+            ref={this.inputRef}
+          />
+        </ValueEditorPropertyValue>
+        <ValueEditorPropertyLabel>{label}</ValueEditorPropertyLabel>
+      </ValueEditorProperty>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextProperty/index.ts b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextProperty/index.ts
new file mode 100644
index 0000000..0021d48
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextProperty/index.ts
@@ -0,0 +1,4 @@
+import ValueEditorTextProperty from "./ValueEditorTextProperty";
+
+export default ValueEditorTextProperty;
+export { ValueEditorTextProperty };
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextareaProperty/ValueEditorTextareaProperty.tsx b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextareaProperty/ValueEditorTextareaProperty.tsx
new file mode 100644
index 0000000..bbc3566
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextareaProperty/ValueEditorTextareaProperty.tsx
@@ -0,0 +1,95 @@
+import React from "react";
+
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import ValueEditorProperty from "../ValueEditorProperty";
+import ValueEditorPropertyLabel from "../ValueEditorPropertyLabel";
+import ValueEditorPropertyValue from "../ValueEditorPropertyValue";
+
+interface Props {
+  label: string;
+  propertyKey: Constants.AdjustmentTypeEnum;
+  defaultValue: string | null;
+  onUpdate?: (
+    propertyKey: Constants.AdjustmentTypeEnum,
+    value: string | null,
+    source: string | null
+  ) => void;
+  enableSource: boolean;
+}
+interface State {
+  value: string | null;
+}
+export default class ValueEditorTextareaProperty extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    enableSource: true,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { defaultValue } = this.props;
+    const { value } = this.state;
+
+    if (defaultValue !== prevProps.defaultValue && defaultValue !== value) {
+      this.setState({
+        value: defaultValue,
+      });
+    }
+  }
+
+  handleChange = (evt: React.FocusEvent<HTMLTextAreaElement>): void => {
+    const { value } = this.state;
+
+    if (value !== evt.target.value) {
+      this.setState({
+        value: evt.target.value,
+      });
+    }
+  };
+
+  handleBlur = (evt: React.FocusEvent<HTMLTextAreaElement>): void => {
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      let value: string | null = evt.target.value ? evt.target.value : null;
+      onUpdate(propertyKey, value, null);
+    }
+  };
+
+  render() {
+    const { propertyKey, label } = this.props;
+
+    const { value } = this.state;
+
+    return (
+      <ValueEditorProperty
+        className="ct-value-editor__property--textarea"
+        propertyKey={propertyKey}
+        isBlock={true}
+      >
+        <ValueEditorPropertyLabel>{label}</ValueEditorPropertyLabel>
+        <ValueEditorPropertyValue>
+          <textarea
+            className="ct-value-editor__property-input"
+            value={value === null ? "" : value}
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+          />
+        </ValueEditorPropertyValue>
+      </ValueEditorProperty>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextareaProperty/index.ts b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextareaProperty/index.ts
new file mode 100644
index 0000000..4061a4a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/ValueEditorTextareaProperty/index.ts
@@ -0,0 +1,4 @@
+import ValueEditorTextareaProperty from "./ValueEditorTextareaProperty";
+
+export default ValueEditorTextareaProperty;
+export { ValueEditorTextareaProperty };
diff --git a/ddb_main/tools/js/Shared/components/ValueEditor/index.ts b/ddb_main/tools/js/Shared/components/ValueEditor/index.ts
new file mode 100644
index 0000000..59d4fd0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/ValueEditor/index.ts
@@ -0,0 +1,24 @@
+import ValueEditor from "./ValueEditor";
+import ValueEditorCheckboxProperty from "./ValueEditorCheckboxProperty";
+import ValueEditorNumberProperty from "./ValueEditorNumberProperty";
+import ValueEditorProperty from "./ValueEditorProperty";
+import ValueEditorPropertyLabel from "./ValueEditorPropertyLabel";
+import ValueEditorPropertySource from "./ValueEditorPropertySource";
+import ValueEditorPropertyValue from "./ValueEditorPropertyValue";
+import ValueEditorSelectProperty from "./ValueEditorSelectProperty";
+import ValueEditorTextProperty from "./ValueEditorTextProperty";
+import ValueEditorTextareaProperty from "./ValueEditorTextareaProperty";
+
+export default ValueEditor;
+export {
+  ValueEditor,
+  ValueEditorCheckboxProperty,
+  ValueEditorNumberProperty,
+  ValueEditorProperty,
+  ValueEditorPropertyLabel,
+  ValueEditorPropertySource,
+  ValueEditorPropertyValue,
+  ValueEditorSelectProperty,
+  ValueEditorTextareaProperty,
+  ValueEditorTextProperty,
+};
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlock.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlock.tsx
new file mode 100644
index 0000000..bb4137f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlock.tsx
@@ -0,0 +1,86 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import { GD_VehicleBlockProps } from "../../utils/Component";
+import VehicleBlockActionStations from "./VehicleBlockActionStations";
+import VehicleBlockActionSummaries from "./VehicleBlockActionSummaries";
+import VehicleBlockActions from "./VehicleBlockActions";
+import VehicleBlockComponents from "./VehicleBlockComponents";
+import VehicleBlockFeatures from "./VehicleBlockFeatures";
+import VehicleBlockHeader from "./VehicleBlockHeader";
+import VehicleBlockPrimary from "./VehicleBlockPrimary";
+import VehicleBlockShell from "./VehicleBlockShell";
+
+interface Props extends GD_VehicleBlockProps {
+  isInteractive: boolean;
+  onComponentClick?: (componentId: number, vehicleId: number) => void;
+  onActionStationClick?: (stationId: number, vehicleId: number) => void;
+  shouldCoalesce: boolean;
+  theme: CharacterTheme;
+}
+export default class VehicleBlock extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    isInteractive: false,
+    shouldCoalesce: true,
+    featuresProps: null,
+    actionsProps: null,
+    actionSummariesProps: null,
+    actionStationsProps: null,
+    componentsProps: null,
+  };
+
+  render() {
+    const {
+      headerProps,
+      primaryProps,
+      actionSummariesProps,
+      featuresProps,
+      actionsProps,
+      actionStationsProps,
+      componentsProps,
+      shellProps,
+      isInteractive,
+      onComponentClick,
+      onActionStationClick,
+      shouldCoalesce,
+      theme,
+    } = this.props;
+
+    return (
+      <VehicleBlockShell {...shellProps}>
+        <VehicleBlockHeader {...headerProps} />
+        <VehicleBlockPrimary
+          {...primaryProps}
+          shouldCoalesce={shouldCoalesce}
+        />
+        {featuresProps !== null && <VehicleBlockFeatures {...featuresProps} />}
+        {actionSummariesProps !== null && (
+          <VehicleBlockActionSummaries
+            {...actionSummariesProps}
+            theme={theme}
+          />
+        )}
+        {actionStationsProps !== null && (
+          <VehicleBlockActionStations
+            {...actionStationsProps}
+            theme={theme}
+            isInteractive={isInteractive}
+            onActionStationClick={onActionStationClick}
+            shouldCoalesce={shouldCoalesce}
+          />
+        )}
+        {componentsProps !== null && (
+          <VehicleBlockComponents
+            {...componentsProps}
+            theme={theme}
+            isInteractive={isInteractive}
+            onComponentClick={onComponentClick}
+            shouldCoalesce={shouldCoalesce}
+          />
+        )}
+        {actionsProps !== null && <VehicleBlockActions {...actionsProps} />}
+      </VehicleBlockShell>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockAction/VehicleBlockAction.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockAction/VehicleBlockAction.tsx
new file mode 100644
index 0000000..8534392
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockAction/VehicleBlockAction.tsx
@@ -0,0 +1,67 @@
+import React from "react";
+
+import { HtmlContent } from "~/components/HtmlContent";
+
+import { VehicleBlockActionProp } from "../../../utils/Component";
+import InlineSeparatedNodes from "../../common/InlineSeparatedNodes";
+
+interface Props {
+  action: VehicleBlockActionProp;
+}
+export default class VehicleBlockAction extends React.PureComponent<Props> {
+  render() {
+    const { action } = this.props;
+
+    const { key, name, description, ammo } = action;
+
+    const actionText: Array<React.ReactNode> = [];
+
+    if (name) {
+      actionText.push(
+        <span className="ct-vehicle-block__action-name">{name}.</span>
+      );
+    }
+
+    if (ammo !== null && ammo.length > 0) {
+      let ammunitionText: Array<string> = [];
+      ammo.forEach((ammoContract) => {
+        let text: string = `${ammoContract.quantity}`;
+        if (ammoContract.custom !== null) {
+          text = `${text} ${ammoContract.custom}`;
+        }
+
+        ammunitionText.push(text);
+      });
+      actionText.push(
+        <React.Fragment>
+          <span className="ct-vehicle-block__action-ammo-label">
+            Ammunition:{" "}
+          </span>
+          <span className="ct-vehicle-block__action-ammo-description">
+            {ammunitionText.join(", ")}.
+          </span>
+        </React.Fragment>
+      );
+    }
+
+    if (description) {
+      //All vehicle && component actions descriptions are currently formatted html,
+      //should use action props derivers to generate the content displayed in this description in the future
+      actionText.push(
+        <React.Fragment>
+          <HtmlContent
+            className="ct-vehicle-block__action-description"
+            html={description}
+            withoutTooltips
+          />
+        </React.Fragment>
+      );
+    }
+
+    return (
+      <div className="ct-vehicle-block__action" key={key}>
+        <InlineSeparatedNodes nodes={actionText} sep={" "} />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockAction/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockAction/index.ts
new file mode 100644
index 0000000..280b674
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockAction/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockAction from "./VehicleBlockAction";
+
+export default VehicleBlockAction;
+export { VehicleBlockAction };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStation/VehicleBlockActionStation.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStation/VehicleBlockActionStation.tsx
new file mode 100644
index 0000000..39c70e4
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStation/VehicleBlockActionStation.tsx
@@ -0,0 +1,191 @@
+import React from "react";
+
+import { ManageIcon } from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  FormatUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { GD_VehicleBlockActionStationProps } from "../../../utils/Component";
+import InlineSeparatedNodes from "../../common/InlineSeparatedNodes";
+import VehicleBlockAction from "../VehicleBlockAction";
+import VehicleBlockPrimaryAttributes from "../VehicleBlockPrimaryAttributes";
+
+interface Props extends GD_VehicleBlockActionStationProps {
+  className: string;
+  shouldCoalesce: boolean;
+  onActionStationClick?: (id: number, vehicleId: number) => void;
+  isInteractive: boolean;
+  theme: CharacterTheme;
+}
+export default class VehicleBlockActionStation extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+    isInteractive: false,
+    shouldCoalesce: true,
+  };
+
+  renderHeading = (): React.ReactNode => {
+    const { name, requiredCrew, coverType, count } = this.props;
+
+    let displayText: Array<string> = [];
+
+    if (count > 1) {
+      displayText.push(`${count}`);
+    }
+
+    if (name !== null) {
+      displayText.push(name);
+    }
+
+    let extraText: Array<string> = [];
+    if (requiredCrew !== null) {
+      let requiredCrewText: string = `Requires ${requiredCrew} Crew`;
+      if (count > 1) {
+        requiredCrewText = `Each Station ${requiredCrewText}`;
+      }
+      extraText.push(requiredCrewText);
+    }
+
+    if (coverType !== null) {
+      extraText.push(`Grants ${coverType} Cover`);
+    }
+
+    if (extraText.length > 0) {
+      displayText.push(`(${FormatUtils.renderNonOxfordCommaList(extraText)})`);
+    }
+
+    if (displayText.length === 0) {
+      return null;
+    }
+
+    return (
+      <span className="ct-vehicle-block-action-station__heading">
+        {displayText.join(" ")}.
+      </span>
+    );
+  };
+
+  renderActions = (): React.ReactNode => {
+    const { actions } = this.props;
+
+    if (actions.length === 0) {
+      return null;
+    }
+
+    return (
+      <span className="ct-vehicle-block-action-station__actions">
+        {actions.map((action) => (
+          <VehicleBlockAction action={action} key={action.key} />
+        ))}
+      </span>
+    );
+  };
+
+  renderDescription = (): React.ReactNode => {
+    const { description } = this.props;
+
+    if (description === null) {
+      return null;
+    }
+
+    return (
+      <span className="ct-vehicle-block-action-station__description">
+        {description}
+      </span>
+    );
+  };
+
+  handleClick = (): void => {
+    const { id, vehicleId, isInteractive, onActionStationClick } = this.props;
+
+    if (isInteractive && onActionStationClick) {
+      onActionStationClick(id, vehicleId);
+    }
+  };
+
+  renderAttributes = (): React.ReactNode => {
+    const {
+      count,
+      shouldCoalesce,
+      armorClassInfo,
+      hitPointInfo,
+      speedInfos,
+      isInteractive,
+      theme,
+      costInfos,
+      displayType,
+      width,
+      length,
+      isPrimaryComponent,
+    } = this.props;
+
+    if (
+      armorClassInfo === null &&
+      hitPointInfo === null &&
+      speedInfos.length === 0
+    ) {
+      return null;
+    }
+
+    return (
+      <div className="ct-vehicle-block-action-station__attributes">
+        {isInteractive && (
+          <div className="ct-vehicle-block-action-station__attributes-callout">
+            <ManageIcon
+              tooltip="Manage HP"
+              showIconOnEdge={false}
+              theme={theme}
+            />
+          </div>
+        )}
+        <VehicleBlockPrimaryAttributes
+          armorClassInfo={armorClassInfo}
+          hitPointInfo={hitPointInfo}
+          speedInfos={speedInfos}
+          count={count}
+          shouldCoalesce={shouldCoalesce}
+          costInfos={costInfos}
+          displayType={displayType}
+          width={width}
+          length={length}
+          isPrimaryComponent={isPrimaryComponent}
+        />
+      </div>
+    );
+  };
+
+  render() {
+    const { isInteractive } = this.props;
+
+    let classNames: Array<string> = ["ct-vehicle-block-action-station"];
+    if (isInteractive) {
+      classNames.push("ct-vehicle-block-action-station--interactive");
+    }
+
+    let nodes: Array<React.ReactNode> = [];
+    const headingNode = this.renderHeading();
+    if (headingNode !== null) {
+      nodes.push(headingNode);
+    }
+
+    const descriptionNode = this.renderDescription();
+    if (descriptionNode !== null) {
+      nodes.push(descriptionNode);
+    }
+
+    const actionsNode = this.renderActions();
+    if (actionsNode !== null) {
+      nodes.push(actionsNode);
+    }
+
+    return (
+      <div className={classNames.join(" ")} onClick={this.handleClick}>
+        <div className="ct-vehicle-block-action-station__content">
+          <InlineSeparatedNodes nodes={nodes} sep={" "} />
+          {this.renderAttributes()}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStation/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStation/index.ts
new file mode 100644
index 0000000..1f4bcb3
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStation/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockActionStation from "./VehicleBlockActionStation";
+
+export default VehicleBlockActionStation;
+export { VehicleBlockActionStation };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStations/VehicleBlockActionStations.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStations/VehicleBlockActionStations.tsx
new file mode 100644
index 0000000..9697c1b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStations/VehicleBlockActionStations.tsx
@@ -0,0 +1,90 @@
+import { values, sortBy } from "lodash";
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import {
+  GD_VehicleBlockActionStationListProps,
+  GD_VehicleBlockActionStationProps,
+} from "../../../utils/Component";
+import VehicleBlockActionStation from "../VehicleBlockActionStation";
+import VehicleBlockActionStationsShell from "../VehicleBlockActionStationsShell";
+
+interface Props extends GD_VehicleBlockActionStationListProps {
+  isInteractive: boolean;
+  shouldCoalesce: boolean;
+  theme: CharacterTheme;
+  onActionStationClick?: (stationId: number, vehicleId: number) => void;
+}
+export default class VehicleBlockActionStations extends React.PureComponent<Props> {
+  static defaultProps = {
+    shouldCoalesce: true,
+    isInteractive: false,
+  };
+
+  getActionStationProps = (): Array<GD_VehicleBlockActionStationProps> => {
+    const { actionStations, shouldCoalesce } = this.props;
+
+    let displayActionStations: Array<GD_VehicleBlockActionStationProps> =
+      actionStations;
+
+    if (shouldCoalesce) {
+      let uniquenessFactorLookup: Record<
+        string,
+        GD_VehicleBlockActionStationProps
+      > = displayActionStations.reduce(
+        (acc: Record<string, GD_VehicleBlockActionStationProps>, station) => {
+          let uniqueness: string = station.uniquenessFactor;
+
+          if (!acc[uniqueness]) {
+            acc[uniqueness] = station;
+          } else {
+            acc[uniqueness].count += 1;
+          }
+
+          return acc;
+        },
+        {}
+      );
+
+      displayActionStations = values(uniquenessFactorLookup);
+    }
+
+    return sortBy(
+      displayActionStations,
+      (actionStation) => actionStation.displayOrder
+    );
+  };
+
+  render() {
+    const {
+      actionStations,
+      shouldCoalesce,
+      isInteractive,
+      onActionStationClick,
+      theme,
+    } = this.props;
+
+    if (actionStations.length === 0) {
+      return null;
+    }
+
+    const actionStationsProps = this.getActionStationProps();
+
+    return (
+      <VehicleBlockActionStationsShell>
+        {actionStationsProps.map((stationProps) => (
+          <VehicleBlockActionStation
+            {...stationProps}
+            theme={theme}
+            isInteractive={
+              stationProps.enableComponentManagement && isInteractive
+            }
+            onActionStationClick={onActionStationClick}
+            shouldCoalesce={shouldCoalesce}
+          />
+        ))}
+      </VehicleBlockActionStationsShell>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStations/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStations/index.ts
new file mode 100644
index 0000000..50e9762
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStations/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockActionStations from "./VehicleBlockActionStations";
+
+export default VehicleBlockActionStations;
+export { VehicleBlockActionStations };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStationsShell/VehicleBlockActionStationsShell.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStationsShell/VehicleBlockActionStationsShell.tsx
new file mode 100644
index 0000000..d9d6f0f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStationsShell/VehicleBlockActionStationsShell.tsx
@@ -0,0 +1,14 @@
+import React from "react";
+
+import VehicleBlockSectionHeader from "../VehicleBlockSectionHeader";
+
+export default class VehicleBlockActionStationsShell extends React.PureComponent<{}> {
+  render() {
+    return (
+      <div className="ct-vehicle-block__action-stations">
+        <VehicleBlockSectionHeader label="Action Stations" />
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStationsShell/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStationsShell/index.ts
new file mode 100644
index 0000000..83fd9c1
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionStationsShell/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockActionStationsShell from "./VehicleBlockActionStationsShell";
+
+export default VehicleBlockActionStationsShell;
+export { VehicleBlockActionStationsShell };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummaries/VehicleBlockActionSummaries.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummaries/VehicleBlockActionSummaries.tsx
new file mode 100644
index 0000000..35fffce
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummaries/VehicleBlockActionSummaries.tsx
@@ -0,0 +1,45 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import { GD_VehicleBlockActionSummariesProps } from "../../../utils/Component";
+import VehicleBlockActionSummary from "../VehicleBlockActionSummary";
+import VehicleBlockSectionHeader from "../VehicleBlockSectionHeader";
+
+interface Props extends GD_VehicleBlockActionSummariesProps {
+  theme: CharacterTheme;
+}
+export default class VehicleBlockActionSummaries extends React.PureComponent<Props> {
+  render() {
+    const { actionsText, actionsSummaries, theme } = this.props;
+
+    if (actionsText === null && actionsSummaries.length === 0) {
+      return null;
+    }
+
+    return (
+      <div className="ct-vehicle-block__action-summaries">
+        <VehicleBlockSectionHeader label="Actions" />
+        {actionsText !== null && (
+          <div className="ct-vehicle-block__action-summaries-content">
+            {actionsText}
+          </div>
+        )}
+        {actionsSummaries.length > 0 && (
+          <div className="ct-vehicle-block__action-summaries-content">
+            {actionsSummaries.map((summary, idx) => {
+              const key = `${summary.name !== null ? summary.name : ""}-${idx}`;
+              return (
+                <VehicleBlockActionSummary
+                  theme={theme}
+                  actionSummary={summary}
+                  key={key}
+                />
+              );
+            })}
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummaries/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummaries/index.ts
new file mode 100644
index 0000000..1732671
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummaries/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockActionSummaries from "./VehicleBlockActionSummaries";
+
+export default VehicleBlockActionSummaries;
+export { VehicleBlockActionSummaries };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummary/VehicleBlockActionSummary.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummary/VehicleBlockActionSummary.tsx
new file mode 100644
index 0000000..b51d230
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummary/VehicleBlockActionSummary.tsx
@@ -0,0 +1,63 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import { Reference } from "~/components/Reference";
+
+import { VehicleActionSummaryProps } from "../../../utils/Component";
+import InlineSeparatedNodes from "../../common/InlineSeparatedNodes";
+
+interface Props {
+  actionSummary: VehicleActionSummaryProps;
+  theme: CharacterTheme;
+}
+export default class VehicleBlockActionSummary extends React.PureComponent<Props> {
+  render() {
+    const {
+      name,
+      description,
+      sourceId,
+      sourceName,
+      sourceFullName,
+      sourceChapterNumber,
+    } = this.props.actionSummary;
+    const { theme } = this.props;
+
+    let nodes: Array<React.ReactNode> = [];
+
+    if (name !== null) {
+      nodes.push(
+        <span className="ct-vehicle-block__action-summary-label">{name}.</span>
+      );
+    }
+
+    if (description !== null) {
+      nodes.push(
+        <span className="ct-vehicle-block__action-summary-text">
+          {description}
+        </span>
+      );
+    }
+
+    if (sourceId !== null) {
+      nodes.push(
+        <React.Fragment>
+          {"("}
+          <Reference
+            isDarkMode={theme?.isDarkMode}
+            name={sourceName}
+            tooltip={sourceFullName}
+            chapter={sourceChapterNumber}
+          />
+          {")."}
+        </React.Fragment>
+      );
+    }
+
+    return (
+      <div className="ct-vehicle-block__action-summary">
+        <InlineSeparatedNodes nodes={nodes} sep={" "} />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummary/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummary/index.ts
new file mode 100644
index 0000000..2b6bcf5
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActionSummary/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockActionSummary from "./VehicleBlockActionSummary";
+
+export default VehicleBlockActionSummary;
+export { VehicleBlockActionSummary };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActions/VehicleBlockActions.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActions/VehicleBlockActions.tsx
new file mode 100644
index 0000000..1cc1916
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActions/VehicleBlockActions.tsx
@@ -0,0 +1,55 @@
+import React from "react";
+
+import { GD_VehicleBlockActionsProps } from "../../../utils/Component";
+import VehicleBlockAction from "../VehicleBlockAction";
+import VehicleBlockSectionHeader from "../VehicleBlockSectionHeader";
+
+interface Props extends GD_VehicleBlockActionsProps {}
+export default class VehicleBlockActions extends React.PureComponent<Props> {
+  static defaultProps = {
+    reactions: [],
+    bonusActions: [],
+    special: [],
+  };
+
+  render() {
+    const { reactions, bonusActions, special } = this.props;
+
+    if (
+      reactions.length === 0 &&
+      bonusActions.length === 0 &&
+      special.length === 0
+    ) {
+      return null;
+    }
+
+    return (
+      <React.Fragment>
+        {reactions.length > 0 && (
+          <React.Fragment>
+            <VehicleBlockSectionHeader label="Reactions" />
+            {reactions.map((action) => (
+              <VehicleBlockAction action={action} key={action.key} />
+            ))}
+          </React.Fragment>
+        )}
+        {bonusActions.length > 0 && (
+          <React.Fragment>
+            <VehicleBlockSectionHeader label="Bonus Actions" />
+            {bonusActions.map((action) => (
+              <VehicleBlockAction action={action} key={action.key} />
+            ))}
+          </React.Fragment>
+        )}
+        {special.length > 0 && (
+          <React.Fragment>
+            <VehicleBlockSectionHeader label="Special Actions" />
+            {special.map((action) => (
+              <VehicleBlockAction action={action} key={action.key} />
+            ))}
+          </React.Fragment>
+        )}
+      </React.Fragment>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActions/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActions/index.ts
new file mode 100644
index 0000000..55a1f03
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockActions/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockActions from "./VehicleBlockActions";
+
+export default VehicleBlockActions;
+export { VehicleBlockActions };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockAttribute/VehicleBlockAttribute.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockAttribute/VehicleBlockAttribute.tsx
new file mode 100644
index 0000000..d2216b3
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockAttribute/VehicleBlockAttribute.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+interface Props {
+  label: string;
+  value: React.ReactNode;
+  extraValue: React.ReactNode;
+}
+export default class VehicleBlockAttribute extends React.PureComponent<Props> {
+  static defaultProps = {
+    extraValue: null,
+  };
+
+  render() {
+    const { label, value, extraValue } = this.props;
+
+    return (
+      <div className="ct-vehicle-block__attribute">
+        <span className="ct-vehicle-block__attribute-label">{label}</span>
+        <span className="ct-vehicle-block__attribute-data">
+          <span className="ct-vehicle-block__attribute-data-value">
+            {value}
+          </span>
+          {extraValue !== null && (
+            <span className="ct-vehicle-block__attribute-data-extra">
+              {extraValue}
+            </span>
+          )}
+        </span>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponent/VehicleBlockComponent.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponent/VehicleBlockComponent.tsx
new file mode 100644
index 0000000..9d3a18a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponent/VehicleBlockComponent.tsx
@@ -0,0 +1,188 @@
+import React from "react";
+
+import { ManageIcon } from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  Constants,
+  FormatUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+
+import { GD_VehicleBlockComponentProps } from "../../../utils/Component";
+import VehicleBlockAction from "../VehicleBlockAction";
+import VehicleBlockPrimaryAttributes from "../VehicleBlockPrimaryAttributes";
+import VehicleBlockSectionHeader from "../VehicleBlockSectionHeader";
+
+interface Props extends GD_VehicleBlockComponentProps {
+  className: string;
+  shouldCoalesce: boolean;
+  onComponentClick?: (id: number, vehicleId: number) => void;
+  isInteractive: boolean;
+  theme: CharacterTheme;
+}
+export default class VehicleBlockComponent extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+    isInteractive: false,
+    shouldCoalesce: true,
+  };
+
+  renderHeading = (): React.ReactNode => {
+    const {
+      typeNames,
+      name,
+      count,
+      isInteractive,
+      theme,
+      displayType,
+      requiredCrew,
+    } = this.props;
+
+    const nameLabel: string = name !== null ? name : "";
+    const isSpelljammer =
+      displayType === Constants.VehicleConfigurationDisplayTypeEnum.SPELLJAMMER;
+
+    let componentCount: string = "";
+    if (count > 1) {
+      componentCount = `(${count})`;
+    }
+
+    let primaryText: string = "";
+    if (name !== null && typeNames.includes(name)) {
+      primaryText = nameLabel;
+    } else if (isSpelljammer) {
+      primaryText = `${count > 1 ? `${count} ` : ""}${nameLabel}${
+        requiredCrew ? ` (${requiredCrew} Crew${count > 1 ? " Each" : ""})` : ""
+      }`;
+    } else {
+      let typesText = FormatUtils.renderNonOxfordCommaList(typeNames);
+      primaryText = `${typesText}: ${nameLabel} ${componentCount}`;
+    }
+
+    let callout: React.ReactNode = null;
+    if (isInteractive) {
+      callout = (
+        <ManageIcon tooltip="Manage HP" showIconOnEdge={false} theme={theme} />
+      );
+    }
+
+    return <VehicleBlockSectionHeader label={primaryText} callout={callout} />;
+  };
+
+  renderActions = (): React.ReactNode => {
+    const { actions } = this.props;
+
+    if (actions.length === 0) {
+      return null;
+    }
+
+    return (
+      <div className="ct-vehicle-block-component__actions">
+        {actions.map((action) => (
+          <VehicleBlockAction action={action} key={action.key} />
+        ))}
+      </div>
+    );
+  };
+
+  renderDescription = (): React.ReactNode => {
+    const { description } = this.props;
+
+    if (description === null) {
+      return null;
+    }
+
+    return (
+      <HtmlContent
+        className="ct-vehicle-block-component__description"
+        html={description}
+        withoutTooltips
+      />
+    );
+  };
+
+  handleClick = (): void => {
+    const { id, vehicleId, isInteractive, onComponentClick } = this.props;
+
+    if (isInteractive && onComponentClick) {
+      onComponentClick(id, vehicleId);
+    }
+  };
+
+  renderAttributes = (): React.ReactNode => {
+    const {
+      count,
+      costInfos,
+      shouldCoalesce,
+      armorClassInfo,
+      hitPointInfo,
+      speedInfos,
+      coverType,
+      requiredCrew,
+      displayType,
+      width,
+      length,
+      isPrimaryComponent,
+    } = this.props;
+
+    return (
+      <div className="ct-vehicle-block-component__attributes">
+        <VehicleBlockPrimaryAttributes
+          armorClassInfo={armorClassInfo}
+          hitPointInfo={hitPointInfo}
+          speedInfos={speedInfos}
+          coverType={coverType}
+          requiredCrew={requiredCrew}
+          count={count}
+          shouldCoalesce={shouldCoalesce}
+          costInfos={costInfos}
+          displayType={displayType}
+          width={width}
+          length={length}
+          isPrimaryComponent={isPrimaryComponent}
+        />
+      </div>
+    );
+  };
+
+  renderActionsAndDescription() {
+    const { displayType } = this.props;
+    const isSpelljammer =
+      displayType === Constants.VehicleConfigurationDisplayTypeEnum.SPELLJAMMER;
+    return isSpelljammer ? (
+      <>
+        {this.renderDescription()}
+        {this.renderActions()}
+      </>
+    ) : (
+      <>
+        {this.renderActions()}
+        {this.renderDescription()}
+      </>
+    );
+  }
+
+  render() {
+    const { isInteractive, uniqueKey } = this.props;
+
+    let classNames: Array<string> = ["ct-vehicle-block-component"];
+    if (isInteractive) {
+      classNames.push("ct-vehicle-block-component--interactive");
+    }
+
+    return (
+      <div
+        key={uniqueKey}
+        className={classNames.join(" ")}
+        onClick={this.handleClick}
+      >
+        {this.renderHeading()}
+        <div className="ct-vehicle-block-component__content">
+          {this.renderAttributes()}
+          {this.renderActionsAndDescription()}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponent/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponent/index.ts
new file mode 100644
index 0000000..280821e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponent/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockComponent from "./VehicleBlockComponent";
+
+export default VehicleBlockComponent;
+export { VehicleBlockComponent };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponents/VehicleBlockComponents.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponents/VehicleBlockComponents.tsx
new file mode 100644
index 0000000..b317faa
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponents/VehicleBlockComponents.tsx
@@ -0,0 +1,94 @@
+import { values, sortBy, has } from "lodash";
+import React from "react";
+
+import {
+  CharacterTheme,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+import {
+  GD_VehicleBlockComponentListProps,
+  GD_VehicleBlockComponentProps,
+} from "../../../utils/Component";
+import VehicleBlockComponent from "../VehicleBlockComponent";
+import VehicleBlockComponentsShell from "../VehicleBlockComponentsShell";
+
+interface Props extends GD_VehicleBlockComponentListProps {
+  shouldCoalesce: boolean;
+  isInteractive: boolean;
+  theme: CharacterTheme;
+  onComponentClick?: (componentId: number, vehicleId: number) => void;
+}
+export default class VehicleBlockComponents extends React.PureComponent<Props> {
+  static defaultProps = {
+    shouldCoalesce: true,
+  };
+
+  getComponentInfos = (): Array<GD_VehicleBlockComponentProps> => {
+    const { components, shouldCoalesce } = this.props;
+
+    let displayComponents: Array<GD_VehicleBlockComponentProps> = components;
+
+    if (shouldCoalesce) {
+      const uniquenessFactorLookup: Record<
+        string,
+        GD_VehicleBlockComponentProps
+      > = components.reduce(
+        (acc: Record<string, GD_VehicleBlockComponentProps>, component) => {
+          let uniqueness = component.uniquenessFactor;
+
+          if (!acc[uniqueness]) {
+            acc[uniqueness] = component;
+          } else {
+            acc[uniqueness].count += 1;
+          }
+
+          return acc;
+        },
+        {}
+      );
+
+      displayComponents = values(uniquenessFactorLookup);
+    }
+
+    return sortBy(displayComponents, (component) => component.displayOrder);
+  };
+
+  render() {
+    const { shouldCoalesce, isInteractive, onComponentClick, theme } =
+      this.props;
+
+    let components = this.getComponentInfos();
+
+    if (components.length === 0) {
+      return null;
+    }
+
+    // Components only not action stations (Currently due to Spelljammer)
+    // Filters out helm (primary component) from Spelljammer
+    components = components.filter(
+      (component) =>
+        !(
+          component.displayType ===
+            Constants.VehicleConfigurationDisplayTypeEnum.SPELLJAMMER &&
+          component.isPrimaryComponent
+        )
+    );
+
+    return (
+      <VehicleBlockComponentsShell>
+        {components.map((componentProps) => (
+          <VehicleBlockComponent
+            {...componentProps}
+            theme={theme}
+            isInteractive={
+              componentProps.enableComponentManagement && isInteractive
+            }
+            onComponentClick={onComponentClick}
+            shouldCoalesce={shouldCoalesce}
+          />
+        ))}
+      </VehicleBlockComponentsShell>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponents/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponents/index.ts
new file mode 100644
index 0000000..d38db49
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponents/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockComponents from "./VehicleBlockComponents";
+
+export default VehicleBlockComponents;
+export { VehicleBlockComponents };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponentsShell/VehicleBlockComponentsShell.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponentsShell/VehicleBlockComponentsShell.tsx
new file mode 100644
index 0000000..8dd36cc
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponentsShell/VehicleBlockComponentsShell.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class VehicleBlockComponentsShell extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-vehicle-block__components-block">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponentsShell/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponentsShell/index.ts
new file mode 100644
index 0000000..0e1eee8
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockComponentsShell/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockComponentsShell from "./VehicleBlockComponentsShell";
+
+export default VehicleBlockComponentsShell;
+export { VehicleBlockComponentsShell };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockFeatures/VehicleBlockFeatures.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockFeatures/VehicleBlockFeatures.tsx
new file mode 100644
index 0000000..0e7ce88
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockFeatures/VehicleBlockFeatures.tsx
@@ -0,0 +1,38 @@
+import React from "react";
+
+import { GD_VehicleBlockFeaturesProps } from "../../../utils/Component";
+
+interface Props extends GD_VehicleBlockFeaturesProps {}
+export default class VehicleBlockFeatures extends React.PureComponent<Props> {
+  static defaultProps = {
+    features: [],
+  };
+
+  render() {
+    const { features } = this.props;
+
+    if (features.length === 0) {
+      return null;
+    }
+
+    return (
+      <div className="ct-vehicle-block__features">
+        {features.map((feature, idx) => {
+          return (
+            <div
+              className="ct-vehicle-block__features-feature"
+              key={`${feature.name}-${idx}`}
+            >
+              <span className="ct-vehicle-block__features-feature-name">
+                {feature.name}.
+              </span>{" "}
+              <span className="ct-vehicle-block__features-feature-description">
+                {feature.description}
+              </span>
+            </div>
+          );
+        })}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockFeatures/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockFeatures/index.ts
new file mode 100644
index 0000000..a50b9f7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockFeatures/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockFeatures from "./VehicleBlockFeatures";
+
+export default VehicleBlockFeatures;
+export { VehicleBlockFeatures };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockHeader/VehicleBlockHeader.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockHeader/VehicleBlockHeader.tsx
new file mode 100644
index 0000000..3ed410e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockHeader/VehicleBlockHeader.tsx
@@ -0,0 +1,83 @@
+import React from "react";
+
+import { Constants, FormatUtils } from "@dndbeyond/character-rules-engine/es";
+
+import { GD_VehicleBlockHeaderProps } from "../../../utils/Component";
+import InlineSeparatedNodes from "../../common/InlineSeparatedNodes";
+
+interface Props extends GD_VehicleBlockHeaderProps {}
+export default class VehicleBlockHeader extends React.PureComponent<Props> {
+  renderTypeInfo = (): React.ReactNode => {
+    const { sizeName, typeName } = this.props;
+
+    if (sizeName === null && typeName === null) {
+      return null;
+    }
+
+    let size: string = sizeName !== null ? sizeName : "";
+    let type: string = typeName !== null ? typeName.toLowerCase() : "";
+
+    return [size, type].join(" ").trim();
+  };
+
+  renderDimensions = (): React.ReactNode => {
+    const { weight, width, length } = this.props;
+
+    let dimensions: Array<string> = [];
+
+    let lengthDisplay: string | null =
+      length !== null ? FormatUtils.renderDistance(length) : null;
+    if (lengthDisplay !== null) {
+      dimensions.push(lengthDisplay);
+    }
+
+    let widthDisplay: string | null =
+      width !== null ? FormatUtils.renderDistance(width) : null;
+    if (widthDisplay !== null) {
+      dimensions.push(widthDisplay);
+    }
+
+    let metaTextSizeNodes: Array<React.ReactNode> = [];
+
+    if (dimensions.length > 0) {
+      metaTextSizeNodes.push(dimensions.join(" by "));
+    }
+
+    let weightDisplay: string | null =
+      weight !== null ? `${FormatUtils.renderWeight(weight)}.` : null;
+    if (weightDisplay !== null) {
+      metaTextSizeNodes.push(weightDisplay);
+    }
+
+    if (metaTextSizeNodes.length === 0) {
+      return null;
+    }
+
+    return (
+      <React.Fragment>
+        (<InlineSeparatedNodes nodes={metaTextSizeNodes} />)
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    const { name, displayType } = this.props;
+
+    const typeInfo = this.renderTypeInfo();
+    const dimensions = this.renderDimensions();
+
+    return (
+      <div className="ct-vehicle-block__header">
+        <div className="ct-vehicle-block__name">
+          {name !== null ? name : ""}
+        </div>
+        {displayType !==
+          Constants.VehicleConfigurationDisplayTypeEnum.SPELLJAMMER && (
+          <div className="ct-vehicle-block__meta">
+            {typeInfo} {dimensions}
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockHeader/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockHeader/index.ts
new file mode 100644
index 0000000..9ddbf2c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockHeader/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockHeader from "./VehicleBlockHeader";
+
+export default VehicleBlockHeader;
+export { VehicleBlockHeader };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimary/VehicleBlockPrimary.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimary/VehicleBlockPrimary.tsx
new file mode 100644
index 0000000..924c055
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimary/VehicleBlockPrimary.tsx
@@ -0,0 +1,210 @@
+import React from "react";
+
+import {
+  Constants,
+  CoreUtils,
+  FormatUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { GD_VehicleBlockPrimaryProps } from "../../../utils/Component";
+import { VehicleBlockAttribute } from "../VehicleBlockAttribute";
+import VehicleBlockPrimaryAttributes from "../VehicleBlockPrimaryAttributes";
+import VehicleBlockSeparator from "../VehicleBlockSeparator";
+
+interface Props extends GD_VehicleBlockPrimaryProps {
+  shouldCoalesce: boolean;
+}
+
+export default class VehicleBlockPrimary extends React.PureComponent<Props> {
+  renderDamageImmunities = (): React.ReactNode => {
+    const { damageImmunities } = this.props;
+
+    if (damageImmunities.length === 0) {
+      return null;
+    }
+
+    return (
+      <div className="ct-vehicle-block__tidbit">
+        <span className="ct-vehicle-block__tidbit-label">
+          Damage Immunities
+        </span>
+        <span className="ct-vehicle-block__tidbit-data">
+          {damageImmunities.join(", ")}
+        </span>
+      </div>
+    );
+  };
+
+  renderConditionImmunities = (): React.ReactNode => {
+    const { conditionImmunities } = this.props;
+
+    if (conditionImmunities.length === 0) {
+      return null;
+    }
+
+    return (
+      <div className="ct-vehicle-block__tidbit">
+        <span className="ct-vehicle-block__tidbit-label">
+          Condition Immunities
+        </span>
+        <span className="ct-vehicle-block__tidbit-data">
+          {conditionImmunities.join(", ")}
+        </span>
+      </div>
+    );
+  };
+
+  renderStats = (): React.ReactNode => {
+    const { stats, displayType } = this.props;
+
+    if (stats.length === 0) {
+      return null;
+    }
+
+    return (
+      <>
+        <div className="ct-vehicle-block__abilities">
+          {stats.map((stat) => {
+            let modifier = stat.modifier !== null ? stat.modifier : 0;
+            let statKey = stat.statKey !== null ? stat.statKey : "";
+            let score = stat.score !== null ? stat.score : 0;
+
+            return (
+              <div
+                className={`ct-vehicle-block__ability-stat ct-vehicle-block__ability-stat--${statKey.toLowerCase()}`}
+                key={statKey}
+              >
+                <div className="ct-vehicle-block__ability-heading">
+                  {statKey}
+                </div>
+                <div className="ct-vehicle-block__ability-data">
+                  <span className="ct-vehicle-block__ability-score">
+                    {score}
+                  </span>
+                  {score !== 0 && (
+                    <span className="ct-vehicle-block__ability-modifier">
+                      ({FormatUtils.renderSignedNumber(modifier)})
+                    </span>
+                  )}
+                </div>
+              </div>
+            );
+          })}
+        </div>
+        <VehicleBlockSeparator displayType={displayType} />
+      </>
+    );
+  };
+
+  renderEffectiveTravelDistance = (): React.ReactNode => {
+    const { travelPaceInfo } = this.props;
+
+    if (travelPaceInfo === null || travelPaceInfo.effectiveHours === null) {
+      return null;
+    }
+
+    const effectiveDistance: number =
+      CoreUtils.convertFeetToMiles(travelPaceInfo.pace) *
+      travelPaceInfo.effectiveHours;
+
+    return `(${effectiveDistance} ${
+      effectiveDistance === 1 ? "mile" : "miles"
+    } per day)`;
+  };
+
+  renderAttributes = (): React.ReactNode => {
+    const {
+      creatureCapacityDescriptions,
+      cargoCapacityInfo,
+      travelPaceInfo,
+      primaryProperties,
+      shouldCoalesce,
+      displayType,
+    } = this.props;
+
+    let cargoCapacity: Array<string> = [];
+    if (cargoCapacityInfo.weight !== null) {
+      let weight: string =
+        cargoCapacityInfo.weight >= Constants.POUNDS_IN_TON
+          ? FormatUtils.renderWeightTons(cargoCapacityInfo.weight)
+          : `${FormatUtils.renderWeight(cargoCapacityInfo.weight)}.`;
+
+      cargoCapacity.push(weight);
+    }
+
+    if (cargoCapacityInfo.description) {
+      cargoCapacity.push(cargoCapacityInfo.description);
+    }
+
+    const isSpelljammer =
+      displayType === Constants.VehicleConfigurationDisplayTypeEnum.SPELLJAMMER;
+
+    return (
+      <>
+        <div className="ct-vehicle-block__attributes">
+          {primaryProperties !== null && (
+            <VehicleBlockPrimaryAttributes
+              armorClassInfo={primaryProperties.armorClassInfo}
+              hitPointInfo={primaryProperties.hitPointInfo}
+              speedInfos={primaryProperties.speedInfos}
+              costInfos={primaryProperties.costInfos}
+              shouldCoalesce={shouldCoalesce}
+              displayType={primaryProperties.displayType}
+              width={primaryProperties.width}
+              length={primaryProperties.length}
+              isPrimaryComponent={primaryProperties.isPrimaryComponent}
+            />
+          )}
+          {travelPaceInfo !== null && (
+            <VehicleBlockAttribute
+              label="Travel Pace"
+              value={`${FormatUtils.renderDistance(
+                travelPaceInfo.pace
+              )} per hour`}
+              extraValue={this.renderEffectiveTravelDistance()}
+            />
+          )}
+          <VehicleBlockAttribute
+            label={isSpelljammer ? "Crew" : "Creature Capacity"}
+            value={creatureCapacityDescriptions.join(", ")}
+          />
+          {cargoCapacity.length > 0 && (
+            <VehicleBlockAttribute
+              label={isSpelljammer ? "Cargo" : "Cargo Capacity"}
+              value={cargoCapacity.join(", ")}
+            />
+          )}
+        </div>
+        {!isSpelljammer && <VehicleBlockSeparator displayType={displayType} />}
+      </>
+    );
+  };
+
+  renderConditionsAndImmunities() {
+    const { displayType, conditionImmunities, damageImmunities } = this.props;
+
+    return conditionImmunities.length === 0 &&
+      damageImmunities.length === 0 ? null : (
+      <>
+        <div className="ct-vehicle-block__tidbits">
+          {this.renderDamageImmunities()}
+          {this.renderConditionImmunities()}
+        </div>
+        <VehicleBlockSeparator displayType={displayType} />
+      </>
+    );
+  }
+
+  render() {
+    const { displayType } = this.props;
+
+    return (
+      <div className="ct-vehicle-block__primary">
+        <VehicleBlockSeparator displayType={displayType} />
+        {this.renderAttributes()}
+        {this.renderStats()}
+        {this.renderConditionsAndImmunities()}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimary/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimary/index.ts
new file mode 100644
index 0000000..58bb126
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimary/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockPrimary from "./VehicleBlockPrimary";
+
+export default VehicleBlockPrimary;
+export { VehicleBlockPrimary };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimaryAttributes/VehicleBlockPrimaryAttributes.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimaryAttributes/VehicleBlockPrimaryAttributes.tsx
new file mode 100644
index 0000000..a8ef448
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimaryAttributes/VehicleBlockPrimaryAttributes.tsx
@@ -0,0 +1,281 @@
+import { orderBy } from "lodash";
+import React from "react";
+
+import {
+  Constants,
+  FormatUtils,
+  VehicleComponentSpeedModeInfo,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { GD_VehicleBlockPrimaryComponentProps } from "../../../utils/Component";
+import InlineSeparatedNodes from "../../common/InlineSeparatedNodes";
+import { VehicleBlockAttribute } from "../VehicleBlockAttribute";
+
+interface Props extends GD_VehicleBlockPrimaryComponentProps {
+  shouldCoalesce: boolean;
+  coverType: string | null;
+  requiredCrew?: number | null;
+  count: number;
+}
+export default class VehicleBlockPrimaryAttributes extends React.PureComponent<Props> {
+  //this class renders on VehicleBlock and VehicleComponent and VehicleActionStation
+  static defaultProps = {
+    shouldCoalesce: true,
+    coverType: null,
+    requiredCrew: null,
+    count: 1,
+  };
+
+  renderHitPointInfo = (): React.ReactNode => {
+    const { hitPointInfo, count, shouldCoalesce } = this.props;
+
+    if (hitPointInfo === null) {
+      return null;
+    }
+
+    if (hitPointInfo.totalHp === null) {
+      return "--";
+    }
+
+    let currentHpNode: React.ReactNode = null;
+    if (shouldCoalesce) {
+      currentHpNode = hitPointInfo.totalHp;
+      if (count > 1) {
+        currentHpNode = `${hitPointInfo.totalHp} each`;
+      }
+    } else {
+      let classNames: Array<string> = ["ct-vehicle-block-component__hp-value"];
+
+      const remainingHp: number =
+        hitPointInfo.remainingHp !== null
+          ? hitPointInfo.remainingHp
+          : hitPointInfo.totalHp;
+      if (remainingHp < hitPointInfo.totalHp) {
+        classNames.push("ct-vehicle-block-component__hp-value--is-damaged");
+      }
+
+      let showFullHitPointInfo: boolean = !shouldCoalesce;
+
+      currentHpNode = (
+        <React.Fragment>
+          {showFullHitPointInfo && (
+            <React.Fragment>
+              <span className={classNames.join(" ")}>{remainingHp}</span>
+              <span className="ct-vehicle-block-component__hp-sep">/</span>
+            </React.Fragment>
+          )}
+          <span className={classNames.join(" ")}>{hitPointInfo.totalHp}</span>
+        </React.Fragment>
+      );
+    }
+
+    let displayNodes: Array<React.ReactNode> = [currentHpNode];
+
+    if (hitPointInfo.hitPointSpeedAdjustments.length > 0) {
+      hitPointInfo.hitPointSpeedAdjustments.forEach((adjustment) => {
+        let speed: string = FormatUtils.renderDistance(
+          adjustment.perDamageValue
+        );
+        displayNodes.push(
+          `${speed} speed per ${adjustment.perDamageTaken} damage taken`
+        );
+      });
+    }
+
+    return <InlineSeparatedNodes nodes={displayNodes} sep={"; "} />;
+  };
+
+  renderHitPointThresholdInfo = (): React.ReactNode => {
+    const { hitPointInfo } = this.props;
+
+    if (hitPointInfo === null) {
+      return null;
+    }
+
+    let displayStrings: Array<string> = [];
+
+    if (hitPointInfo.damageThreshold) {
+      displayStrings.push(`damage threshold ${hitPointInfo.damageThreshold}`);
+    }
+
+    if (hitPointInfo.mishapThreshold) {
+      displayStrings.push(`mishap threshold ${hitPointInfo.mishapThreshold}`);
+    }
+
+    if (displayStrings.length === 0) {
+      return null;
+    }
+
+    return `(${displayStrings.join(", ")})`;
+  };
+
+  renderSpeedInfo = (
+    modes: Array<VehicleComponentSpeedModeInfo>
+  ): React.ReactNode => {
+    let speedDisplayStrings: Array<string> = modes.map((mode) => {
+      const { value, description, restrictionsText, movementInfo } = mode;
+
+      let stringParts: Array<string> = [];
+      if (movementInfo) {
+        stringParts.push(`${movementInfo.description} speed`);
+      }
+      stringParts.push(FormatUtils.renderDistance(value));
+      if (description) {
+        stringParts.push(description);
+      }
+      if (restrictionsText) {
+        stringParts.push(`(${restrictionsText})`);
+      }
+
+      return stringParts.join(" ");
+    });
+
+    return <InlineSeparatedNodes nodes={speedDisplayStrings} sep={"; "} />;
+  };
+
+  renderArmorClassAttribute = (): React.ReactNode => {
+    const { armorClassInfo } = this.props;
+
+    if (armorClassInfo === null) {
+      return null;
+    }
+
+    const { moving, base, description } = armorClassInfo;
+
+    let armorClassValue: number | null = base;
+    let motionlessArmorClassValue: string | null = null;
+
+    if (moving !== null) {
+      armorClassValue = moving;
+
+      if (moving !== base) {
+        motionlessArmorClassValue = `(${base} while motionless)`;
+      }
+    }
+
+    return (
+      <VehicleBlockAttribute
+        label="Armor Class"
+        value={
+          description
+            ? `${armorClassValue} (${description})`
+            : armorClassValue === 0
+            ? "--"
+            : armorClassValue
+        }
+        extraValue={motionlessArmorClassValue}
+      />
+    );
+  };
+
+  render() {
+    const {
+      armorClassInfo,
+      hitPointInfo,
+      speedInfos,
+      coverType,
+      requiredCrew,
+      costInfos,
+      displayType,
+      isPrimaryComponent,
+      width,
+      length,
+    } = this.props;
+
+    //sort cost infos by type component then ammunition
+    // const costInfos: Array<VehicleComponentCostContract> = [
+    //     {
+    //         description: 'cannon',
+    //         type: 'component',
+    //         value: null,
+    //     },
+    //     {
+    //         description: 'giant iron ball',
+    //         type: 'ammunition',
+    //         value: 1000,
+    //     },
+    // ];
+
+    const sortedCosts = orderBy(
+      costInfos,
+      [
+        (cost) => cost.type === Constants.ComponentCostTypeEnum.COMPONENT,
+        (cost) => cost.type === Constants.ComponentCostTypeEnum.AMMUNITION,
+      ],
+      "desc"
+    );
+
+    const costValues: Array<string> = sortedCosts.map((cost) => {
+      const value: string = cost.value ? `${cost.value} gp` : "--";
+      const description: string = cost.description
+        ? `(${cost.description})`
+        : "";
+
+      return [value, description].join(" ");
+    });
+
+    const isSpelljammer =
+      displayType === Constants.VehicleConfigurationDisplayTypeEnum.SPELLJAMMER;
+
+    return (
+      <React.Fragment>
+        {armorClassInfo !== null && this.renderArmorClassAttribute()}
+        {hitPointInfo !== null && (
+          <VehicleBlockAttribute
+            label="Hit Points"
+            value={this.renderHitPointInfo()}
+            extraValue={
+              !isSpelljammer ? this.renderHitPointThresholdInfo() : undefined
+            }
+          />
+        )}
+        {isSpelljammer && !!hitPointInfo?.damageThreshold && (
+          <VehicleBlockAttribute
+            label="Damage Threshold"
+            value={hitPointInfo?.damageThreshold}
+          />
+        )}
+        {speedInfos.map((speedInfo, idx) => {
+          let speedAttributeLabel: string = "Speed";
+          if (speedInfo.type !== null && !isSpelljammer) {
+            speedAttributeLabel = `Speed (${speedInfo.type})`;
+          }
+
+          let modes: Array<VehicleComponentSpeedModeInfo> =
+            speedInfo.modes !== null ? speedInfo.modes : [];
+
+          return (
+            <VehicleBlockAttribute
+              key={`${speedInfo.type}-${idx}`}
+              label={speedAttributeLabel}
+              value={this.renderSpeedInfo(modes)}
+            />
+          );
+        })}
+        {coverType !== null && (
+          <VehicleBlockAttribute
+            label="Cover"
+            value={`Grants ${coverType} Cover`}
+          />
+        )}
+        {requiredCrew !== null && !isSpelljammer && (
+          <VehicleBlockAttribute label="Required Crew" value={requiredCrew} />
+        )}
+        {isPrimaryComponent &&
+          isSpelljammer &&
+          length !== null &&
+          width !== null && (
+            <VehicleBlockAttribute
+              label="Keel/Beam"
+              value={`${FormatUtils.renderDistance(
+                length
+              )} / ${FormatUtils.renderDistance(width)}`}
+            />
+          )}
+        {costValues.length > 0 && (
+          <VehicleBlockAttribute label="Cost" value={costValues.join(", ")} />
+        )}
+      </React.Fragment>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimaryAttributes/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimaryAttributes/index.ts
new file mode 100644
index 0000000..747f3dc
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockPrimaryAttributes/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockPrimaryAttributes from "./VehicleBlockPrimaryAttributes";
+
+export default VehicleBlockPrimaryAttributes;
+export { VehicleBlockPrimaryAttributes };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSectionHeader/VehicleBlockSectionHeader.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSectionHeader/VehicleBlockSectionHeader.tsx
new file mode 100644
index 0000000..6e7c820
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSectionHeader/VehicleBlockSectionHeader.tsx
@@ -0,0 +1,30 @@
+import React from "react";
+
+interface Props {
+  label: React.ReactNode;
+  callout: React.ReactNode;
+}
+export default class VehicleBlockSectionHeader extends React.PureComponent<Props> {
+  static defaultProps = {
+    callout: null,
+  };
+
+  render() {
+    const { label, callout } = this.props;
+
+    return (
+      <div className="ct-vehicle-block__section-header">
+        <div className="ct-vehicle-block__section-header-content">
+          <div className="ct-vehicle-block__section-header-content-primary">
+            {label}
+          </div>
+          {callout !== null && (
+            <div className="ct-vehicle-block__section-header-content-callout">
+              {callout}
+            </div>
+          )}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSectionHeader/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSectionHeader/index.ts
new file mode 100644
index 0000000..f15f710
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSectionHeader/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockSectionHeader from "./VehicleBlockSectionHeader";
+
+export default VehicleBlockSectionHeader;
+export { VehicleBlockSectionHeader };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparator/VehicleBlockSeparator.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparator/VehicleBlockSeparator.tsx
new file mode 100644
index 0000000..c42d7a7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparator/VehicleBlockSeparator.tsx
@@ -0,0 +1,35 @@
+import React from "react";
+
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import { VehicleDisplayTypeComponentLookup } from "../../../utils/Component";
+import VehicleBlockSeparatorInfernal from "../VehicleBlockSeparatorInfernal";
+import VehicleBlockSeparatorShip from "../VehicleBlockSeparatorShip";
+
+interface Props {
+  displayType: Constants.VehicleConfigurationDisplayTypeEnum;
+}
+export default class VehicleBlockSeparator extends React.PureComponent<Props> {
+  render() {
+    const { displayType } = this.props;
+
+    let lookup: VehicleDisplayTypeComponentLookup = {
+      [Constants.VehicleConfigurationDisplayTypeEnum.SHIP]:
+        VehicleBlockSeparatorShip,
+      [Constants.VehicleConfigurationDisplayTypeEnum.INFERNAL_WAR_MACHINE]:
+        VehicleBlockSeparatorInfernal,
+      [Constants.VehicleConfigurationDisplayTypeEnum.SPELLJAMMER]:
+        VehicleBlockSeparatorShip,
+    };
+
+    //sets Ship style as default
+    let SeparatorComponent: React.ComponentType<any> =
+      VehicleBlockSeparatorShip;
+
+    if (lookup.hasOwnProperty(displayType)) {
+      SeparatorComponent = lookup[displayType];
+    }
+
+    return <SeparatorComponent className="ct-vehicle-block__separator" />;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparator/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparator/index.ts
new file mode 100644
index 0000000..be8f482
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparator/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockSeparator from "./VehicleBlockSeparator";
+
+export default VehicleBlockSeparator;
+export { VehicleBlockSeparator };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorInfernal/VehicleBlockSeparatorInfernal.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorInfernal/VehicleBlockSeparatorInfernal.tsx
new file mode 100644
index 0000000..49870fd
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorInfernal/VehicleBlockSeparatorInfernal.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { BaseSvg } from "@dndbeyond/character-components/es";
+
+interface Props {
+  className: string;
+  fillColor: string;
+}
+export default class VehicleBlockSeparatorInfernal extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+    fillColor: "#9D3856",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    let classNames: Array<string> = [
+      "ct-vehicle-block__separator-infernal",
+      className,
+    ];
+
+    return (
+      <BaseSvg viewBox="0 0 1619.42 32.05" className={classNames.join(" ")}>
+        <polygon
+          fill={fillColor}
+          points="998.33,16.03 1619.42,25.35 809.71,32.05 0,25.35 621.09,16.03 0,12.45 809.71,0 1619.42,12.45 "
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorInfernal/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorInfernal/index.ts
new file mode 100644
index 0000000..793381f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorInfernal/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockSeparatorInfernal from "./VehicleBlockSeparatorInfernal";
+
+export default VehicleBlockSeparatorInfernal;
+export { VehicleBlockSeparatorInfernal };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorShip/VehicleBlockSeparatorShip.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorShip/VehicleBlockSeparatorShip.tsx
new file mode 100644
index 0000000..ccb7c82
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorShip/VehicleBlockSeparatorShip.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+
+interface Props {
+  className: string;
+}
+export default class VehicleBlockSeparatorShip extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className } = this.props;
+
+    let classNames: Array<string> = [
+      "ct-vehicle-block__separator-ship",
+      className,
+    ];
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ct-vehicle-block__separator-ship-border" />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorShip/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorShip/index.ts
new file mode 100644
index 0000000..c4d7f1d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockSeparatorShip/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockSeparatorShip from "./VehicleBlockSeparatorShip";
+
+export default VehicleBlockSeparatorShip;
+export { VehicleBlockSeparatorShip };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShell/VehicleBlockShell.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShell/VehicleBlockShell.tsx
new file mode 100644
index 0000000..541107a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShell/VehicleBlockShell.tsx
@@ -0,0 +1,38 @@
+import React from "react";
+
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import { GD_VehicleBlockShellProps } from "../../../utils/Component";
+import VehicleBlockShellCap from "../VehicleBlockShellCap";
+
+interface Props extends GD_VehicleBlockShellProps {}
+
+export default class VehicleBlockShell extends React.PureComponent<Props> {
+  render() {
+    const { children, displayType } = this.props;
+
+    let type: string | null = null;
+
+    switch (displayType) {
+      case Constants.VehicleConfigurationDisplayTypeEnum.INFERNAL_WAR_MACHINE:
+        type = "infernal";
+        break;
+      case Constants.VehicleConfigurationDisplayTypeEnum.SHIP:
+      default:
+        type = "ship";
+        break;
+    }
+
+    return (
+      <div className="ct-vehicle-block">
+        <VehicleBlockShellCap displayType={displayType} />
+        <div
+          className={`ct-vehicle-block__block ct-vehicle-block__block--${type}`}
+        >
+          {children}
+        </div>
+        <VehicleBlockShellCap displayType={displayType} invertY={true} />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShell/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShell/index.ts
new file mode 100644
index 0000000..9f1fc92
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShell/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockShell from "./VehicleBlockShell";
+
+export default VehicleBlockShell;
+export { VehicleBlockShell };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCap/VehicleBlockShellCap.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCap/VehicleBlockShellCap.tsx
new file mode 100644
index 0000000..f76f464
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCap/VehicleBlockShellCap.tsx
@@ -0,0 +1,43 @@
+import React from "react";
+
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import { VehicleDisplayTypeComponentLookup } from "../../../utils/Component";
+import VehicleBlockShellCapInfernal from "../VehicleBlockShellCapInfernal";
+import VehicleBlockShellCapShip from "../VehicleBlockShellCapShip";
+
+interface Props {
+  displayType: Constants.VehicleConfigurationDisplayTypeEnum;
+  invertY: boolean;
+  invertX: boolean;
+}
+export default class VehicleBlockShellCap extends React.PureComponent<Props> {
+  static defaultProps = {
+    invertX: false,
+    invertY: false,
+  };
+
+  render() {
+    const { displayType, ...restProps } = this.props;
+
+    let lookup: VehicleDisplayTypeComponentLookup = {
+      [Constants.VehicleConfigurationDisplayTypeEnum.SHIP]:
+        VehicleBlockShellCapShip,
+      [Constants.VehicleConfigurationDisplayTypeEnum.INFERNAL_WAR_MACHINE]:
+        VehicleBlockShellCapInfernal,
+      [Constants.VehicleConfigurationDisplayTypeEnum.SPELLJAMMER]:
+        VehicleBlockShellCapShip,
+    };
+
+    //sets Ship style as default
+    let CapComponent: React.ComponentType<any> = VehicleBlockShellCapShip;
+
+    if (lookup.hasOwnProperty(displayType)) {
+      CapComponent = lookup[displayType];
+    }
+
+    return (
+      <CapComponent className="ct-vehicle-block__shell-cap" {...restProps} />
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCap/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCap/index.ts
new file mode 100644
index 0000000..1d72a7c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCap/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockShellCap from "./VehicleBlockShellCap";
+
+export default VehicleBlockShellCap;
+export { VehicleBlockShellCap };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapInfernal/VehicleBlockShellCapInfernal.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapInfernal/VehicleBlockShellCapInfernal.tsx
new file mode 100644
index 0000000..47b5de0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapInfernal/VehicleBlockShellCapInfernal.tsx
@@ -0,0 +1,58 @@
+import React from "react";
+
+import { BaseSvg } from "@dndbeyond/character-components/es";
+
+interface Props {
+  className: string;
+  invertY: boolean;
+  invertX: boolean;
+}
+export default class VehicleBlockShellCapInfernal extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+    invertY: false,
+    invertX: false,
+  };
+
+  render() {
+    const { className, invertY, invertX } = this.props;
+
+    let classNames: Array<string> = [
+      "ct-vehicle-block__shell-cap-infernal",
+      className,
+    ];
+
+    if (invertY) {
+      classNames.push("ct-vehicle-block__shell-cap--invert-y");
+    }
+    if (invertX) {
+      classNames.push("ct-vehicle-block__shell-cap--invert-x");
+    }
+
+    return (
+      <BaseSvg viewBox="0 0 2711.9 133.1" className={classNames.join(" ")}>
+        <defs>
+          <linearGradient
+            id="linear-gradient"
+            x1="1355.95"
+            y1="37.16"
+            x2="1355.95"
+            y2="138.66"
+            gradientUnits="userSpaceOnUse"
+          >
+            <stop offset="0" stopColor="#562c32" />
+            <stop offset="1" stopColor="#88817b" />
+          </linearGradient>
+        </defs>
+        <polygon
+          fill="#3c203c"
+          points="2711.9 46.18 2711.9 133.1 0 133.1 0 46.18 37.9 76.19 308.9 76.19 1074.9 25.19 782.9 76.19 883.9 76.19 1260.38 0 1032.9 76.19 1169.9 76.19 1336.9 4.19 1253.9 76.19 1322.9 76.19 1355.9 8.19 1355.9 8.6 1356 8.19 1389 76.19 1458 76.19 1375 4.19 1542 76.19 1679 76.19 1451.52 0 1828 76.19 1929 76.19 1637 25.19 2403 76.19 2674 76.19 2711.9 46.18"
+        />
+        <polygon
+          fill="url(#linear-gradient)"
+          points="1355.9 27.19 1382.24 86.99 1486.93 86.99 1434.72 41.7 1539.77 86.99 1745.25 86.99 1620.57 45.23 1826.92 86.99 2053.61 86.99 1838.59 49.44 2402.64 86.99 2677.76 86.99 2701.1 68.51 2701.1 122.3 10.8 122.3 10.8 68.51 34.14 86.99 309.26 86.99 873.31 49.44 658.29 86.99 884.98 86.99 1091.33 45.23 966.65 86.99 1172.13 86.99 1277.18 41.7 1224.97 86.99 1329.66 86.99 1355.9 27.19"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapInfernal/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapInfernal/index.ts
new file mode 100644
index 0000000..4579ed7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapInfernal/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockShellCapInfernal from "./VehicleBlockShellCapInfernal";
+
+export default VehicleBlockShellCapInfernal;
+export { VehicleBlockShellCapInfernal };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapShip/VehicleBlockShellCapShip.tsx b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapShip/VehicleBlockShellCapShip.tsx
new file mode 100644
index 0000000..ad919d2
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapShip/VehicleBlockShellCapShip.tsx
@@ -0,0 +1,23 @@
+import React from "react";
+
+interface Props {
+  className: string;
+  invertY?: boolean;
+  invertX?: boolean;
+}
+export default class VehicleBlockShellCapShip extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className } = this.props;
+
+    let classNames: Array<string> = [
+      "ct-vehicle-block__shell-cap-ship",
+      className,
+    ];
+
+    return <div className={classNames.join(" ")} />;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapShip/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapShip/index.ts
new file mode 100644
index 0000000..b774bc5
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/VehicleBlockShellCapShip/index.ts
@@ -0,0 +1,4 @@
+import VehicleBlockShellCapShip from "./VehicleBlockShellCapShip";
+
+export default VehicleBlockShellCapShip;
+export { VehicleBlockShellCapShip };
diff --git a/ddb_main/tools/js/Shared/components/VehicleBlock/index.ts b/ddb_main/tools/js/Shared/components/VehicleBlock/index.ts
new file mode 100644
index 0000000..ea95aee
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleBlock/index.ts
@@ -0,0 +1,52 @@
+import VehicleBlock from "./VehicleBlock";
+import VehicleBlockAction from "./VehicleBlockAction";
+import VehicleBlockActionStation from "./VehicleBlockActionStation";
+import VehicleBlockActionStations from "./VehicleBlockActionStations";
+import VehicleBlockActionStationsShell from "./VehicleBlockActionStationsShell";
+import VehicleBlockActionSummaries from "./VehicleBlockActionSummaries";
+import VehicleBlockActionSummary from "./VehicleBlockActionSummary";
+import VehicleBlockActions from "./VehicleBlockActions";
+import VehicleBlockAttribute from "./VehicleBlockAttribute";
+import VehicleBlockComponent from "./VehicleBlockComponent";
+import VehicleBlockComponents from "./VehicleBlockComponents";
+import VehicleBlockComponentsShell from "./VehicleBlockComponentsShell";
+import VehicleBlockFeatures from "./VehicleBlockFeatures";
+import VehicleBlockHeader from "./VehicleBlockHeader";
+import VehicleBlockPrimary from "./VehicleBlockPrimary";
+import VehicleBlockPrimaryAttributes from "./VehicleBlockPrimaryAttributes";
+import VehicleBlockSectionHeader from "./VehicleBlockSectionHeader";
+import VehicleBlockSeparator from "./VehicleBlockSeparator";
+import VehicleBlockSeparatorInfernal from "./VehicleBlockSeparatorInfernal";
+import VehicleBlockSeparatorShip from "./VehicleBlockSeparatorShip";
+import VehicleBlockShell from "./VehicleBlockShell";
+import VehicleBlockShellCap from "./VehicleBlockShellCap";
+import VehicleBlockShellCapInfernal from "./VehicleBlockShellCapInfernal";
+import VehicleBlockShellCapShip from "./VehicleBlockShellCapShip";
+
+export default VehicleBlock;
+export {
+  VehicleBlock,
+  VehicleBlockAction,
+  VehicleBlockActions,
+  VehicleBlockActionStation,
+  VehicleBlockActionStations,
+  VehicleBlockActionStationsShell,
+  VehicleBlockActionSummaries,
+  VehicleBlockActionSummary,
+  VehicleBlockAttribute,
+  VehicleBlockComponent,
+  VehicleBlockComponents,
+  VehicleBlockComponentsShell,
+  VehicleBlockFeatures,
+  VehicleBlockHeader,
+  VehicleBlockPrimary,
+  VehicleBlockPrimaryAttributes,
+  VehicleBlockSectionHeader,
+  VehicleBlockSeparator,
+  VehicleBlockSeparatorInfernal,
+  VehicleBlockSeparatorShip,
+  VehicleBlockShell,
+  VehicleBlockShellCap,
+  VehicleBlockShellCapInfernal,
+  VehicleBlockShellCapShip,
+};
diff --git a/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/VehicleConditionsTracker.tsx b/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/VehicleConditionsTracker.tsx
new file mode 100644
index 0000000..5cb54fd
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/VehicleConditionsTracker.tsx
@@ -0,0 +1,95 @@
+import * as React from "react";
+
+import {
+  ConditionContract,
+  ConditionLevelUtils,
+  ConditionUtils,
+  Constants,
+  VehicleActiveConditionLookup,
+} from "@dndbeyond/character-rules-engine/es";
+
+import VehicleConditionsTrackerSpecial from "./VehicleConditionsTrackerSpecial";
+
+interface Props {
+  activeConditionLookup: VehicleActiveConditionLookup;
+  enabledConditions: Array<ConditionContract>;
+  isInteractive: boolean;
+  initiallyCollapsed: boolean;
+  onLevelChange?: (
+    conditionId: number,
+    newLevel: number | null,
+    activeLevel: number | null
+  ) => void;
+}
+export default class VehicleConditionTrackers extends React.PureComponent<Props> {
+  static defaultProps = {
+    isInteractive: false,
+    initiallyCollapsed: true,
+  };
+
+  render() {
+    const {
+      activeConditionLookup,
+      enabledConditions,
+      onLevelChange,
+      isInteractive,
+    } = this.props;
+
+    const specialConditions: Array<ConditionContract> = [];
+    const standardConditions: Array<ConditionContract> = [];
+
+    enabledConditions.forEach((condition) => {
+      switch (ConditionUtils.getType(condition)) {
+        case Constants.ConditionTypeEnum.SPECIAL:
+          specialConditions.push(condition);
+          break;
+        case Constants.ConditionTypeEnum.STANDARD:
+          standardConditions.push(condition);
+          break;
+        default:
+        //not implemented
+      }
+    });
+
+    //TODO handle standard conditions in future
+    return (
+      <React.Fragment>
+        {specialConditions.map((condition, idx) => {
+          const levels = ConditionUtils.getDefinitionLevels(condition).map(
+            (level) => ConditionLevelUtils.getLevel(level)
+          );
+          const id = ConditionUtils.getId(condition);
+          // get this override from data eventually
+          let levelOverrides: Record<number, string> = {};
+          if (id === Constants.ConditionIdEnum.EXHAUSTION) {
+            levelOverrides = {
+              6: 'The vehicle "breaks down" and hit points drop to 0',
+            };
+          }
+
+          let activeLevel: number | null = null;
+
+          if (activeConditionLookup.hasOwnProperty(id)) {
+            activeLevel = ConditionUtils.getActiveLevel(
+              activeConditionLookup[id]
+            );
+          }
+
+          return (
+            <VehicleConditionsTrackerSpecial
+              key={`${idx}-${id}`}
+              conditionId={id}
+              name={ConditionUtils.getName(condition)}
+              activeLevel={activeLevel}
+              isInteractive={isInteractive}
+              levels={levels}
+              levelEffectLookup={ConditionUtils.getLevelEffectLookup(condition)}
+              levelOverrides={levelOverrides}
+              onLevelChange={onLevelChange}
+            />
+          );
+        })}
+      </React.Fragment>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/VehicleConditionsTrackerSpecial/VehicleConditionsTrackerSpecial.tsx b/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/VehicleConditionsTrackerSpecial/VehicleConditionsTrackerSpecial.tsx
new file mode 100644
index 0000000..e9b5d40
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/VehicleConditionsTrackerSpecial/VehicleConditionsTrackerSpecial.tsx
@@ -0,0 +1,89 @@
+import * as React from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderCallout,
+  CollapsibleHeaderContent,
+} from "@dndbeyond/character-components/es";
+import { ConditionLevelEffectLookup } from "@dndbeyond/character-rules-engine/es";
+
+import ConditionLevelsTable from "../../ConditionLevelsTable";
+
+interface Props {
+  name: string;
+  conditionId: number;
+  activeLevel: number | null;
+  isInteractive: boolean;
+  initiallyCollapsed: boolean;
+  levels: Array<number>;
+  levelOverrides: Record<number, string>;
+  levelEffectLookup: ConditionLevelEffectLookup | null;
+  onLevelChange?: (
+    conditionId: number,
+    newLevel: number | null,
+    activeLevel: number | null
+  ) => void;
+}
+export default class VehicleConditionsTrackerSpecial extends React.PureComponent<Props> {
+  static defaultProps = {
+    isInteractive: false,
+    initiallyCollapsed: true,
+    activeLevel: null,
+  };
+
+  handleConditionLevelChange = (newLevel: number | null): void => {
+    const { onLevelChange, conditionId, isInteractive, activeLevel } =
+      this.props;
+
+    if (onLevelChange && isInteractive) {
+      onLevelChange(conditionId, newLevel, activeLevel);
+    }
+  };
+
+  render() {
+    const {
+      name,
+      activeLevel,
+      levels,
+      levelEffectLookup,
+      levelOverrides,
+      initiallyCollapsed,
+      isInteractive,
+    } = this.props;
+
+    let extraNode: React.ReactNode = (
+      <div className="ct-vehicle-condition-tracker__summary">
+        <span className="ct-vehicle-condition-tracker__summary-value">
+          Level {activeLevel ? activeLevel : "--"}
+        </span>
+      </div>
+    );
+    let headerCalloutNode: React.ReactNode = (
+      <CollapsibleHeaderCallout extra={extraNode} value={null} />
+    );
+    let headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent heading={name} callout={headerCalloutNode} />
+    );
+
+    return (
+      <div className="ct-vehicle-condition-tracker">
+        <Collapsible
+          header={headerNode}
+          initiallyCollapsed={initiallyCollapsed}
+        >
+          <div className="ct-vehicle-condition-tracker__content">
+            <ConditionLevelsTable
+              conditionName={name}
+              levelEffectLookup={levelEffectLookup}
+              isInteractive={isInteractive}
+              activeLevel={activeLevel}
+              levels={levels}
+              onLevelChange={this.handleConditionLevelChange}
+              levelOverrides={levelOverrides}
+            />
+          </div>
+        </Collapsible>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/VehicleConditionsTrackerSpecial/index.ts b/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/VehicleConditionsTrackerSpecial/index.ts
new file mode 100644
index 0000000..1530950
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/VehicleConditionsTrackerSpecial/index.ts
@@ -0,0 +1,4 @@
+import VehicleConditionsTrackerSpecial from "./VehicleConditionsTrackerSpecial";
+
+export default VehicleConditionsTrackerSpecial;
+export { VehicleConditionsTrackerSpecial };
diff --git a/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/index.ts b/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/index.ts
new file mode 100644
index 0000000..857a804
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleConditionsTracker/index.ts
@@ -0,0 +1,5 @@
+import VehicleConditionsTracker from "./VehicleConditionsTracker";
+import VehicleConditionsTrackerSpecial from "./VehicleConditionsTrackerSpecial";
+
+export default VehicleConditionsTracker;
+export { VehicleConditionsTracker, VehicleConditionsTrackerSpecial };
diff --git a/ddb_main/tools/js/Shared/components/VehicleFuelTracker/VehicleFuelTracker.tsx b/ddb_main/tools/js/Shared/components/VehicleFuelTracker/VehicleFuelTracker.tsx
new file mode 100644
index 0000000..08f260a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleFuelTracker/VehicleFuelTracker.tsx
@@ -0,0 +1,271 @@
+import * as React from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderCallout,
+  CollapsibleHeaderContent,
+} from "@dndbeyond/character-components/es";
+import {
+  HelperUtils,
+  VehicleFuelData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { QuickActions } from "~/subApps/sheet/components/Sidebar/components/QuickActions/QuickActions";
+
+import SimpleQuantity from "../SimpleQuantity";
+import { ThemeButton } from "../common/Button";
+
+interface Props {
+  fuelData: VehicleFuelData;
+  onChange: (value: number) => void;
+  initiallyCollapsed: boolean;
+  isInteractive: boolean;
+  defaultAdjusterValue: number;
+}
+interface State {
+  remainingFuel: number | null;
+  adjusterValue: number;
+}
+export default class VehicleFuelTracker extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    initiallyCollapsed: true,
+    isInteractive: false,
+    defaultAdjusterValue: 1,
+  };
+
+  remainingFuelInput = React.createRef<HTMLInputElement>();
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      remainingFuel: props.fuelData.remainingFuel,
+      adjusterValue: props.defaultAdjusterValue,
+    };
+  }
+
+  componentDidUpdate(prevProps: Props, prevState: State): void {
+    const { fuelData } = this.props;
+
+    if (fuelData.remainingFuel !== prevProps.fuelData.remainingFuel) {
+      this.setState({
+        remainingFuel: fuelData.remainingFuel,
+      });
+    }
+  }
+
+  handleRemainingFuelSet = (newValue: number): void => {
+    const { onChange, fuelData } = this.props;
+
+    if (fuelData.remainingFuel !== newValue && onChange) {
+      onChange(newValue);
+    }
+
+    this.setState({
+      remainingFuel: newValue,
+    });
+  };
+
+  handleRemainingFuelInputBlur = (
+    evt: React.FocusEvent<HTMLInputElement>
+  ): void => {
+    this.handleRemainingFuelSet(HelperUtils.parseInputInt(evt.target.value, 0));
+  };
+
+  handleRemainingFuelInputChange = (
+    evt: React.ChangeEvent<HTMLInputElement>
+  ): void => {
+    this.setState({
+      remainingFuel: HelperUtils.parseInputInt(evt.target.value),
+    });
+  };
+
+  updateAdjusterValue = (newValue: number): void => {
+    const { adjusterValue } = this.state;
+
+    if (newValue !== adjusterValue) {
+      this.setState({
+        adjusterValue: newValue,
+      });
+    }
+  };
+
+  resetAdjusterValue = (): void => {
+    const { defaultAdjusterValue } = this.props;
+    const { adjusterValue } = this.state;
+
+    if (adjusterValue !== defaultAdjusterValue) {
+      this.setState({
+        adjusterValue: defaultAdjusterValue,
+      });
+    }
+  };
+
+  handleAdjusterUse = (): void => {
+    const { adjusterValue, remainingFuel } = this.state;
+
+    let remainingFuelValue: number = remainingFuel === null ? 0 : remainingFuel;
+    this.handleRemainingFuelSet(
+      Math.max(remainingFuelValue - adjusterValue, 0)
+    );
+    this.resetAdjusterValue();
+  };
+
+  handleAdjusterAdd = (): void => {
+    const { adjusterValue, remainingFuel } = this.state;
+    const { fuelData } = this.props;
+
+    let remainingFuelValue: number = remainingFuel === null ? 0 : remainingFuel;
+    let value: number = adjusterValue + remainingFuelValue;
+
+    if (fuelData.maxAmount !== null) {
+      value = Math.max(value, fuelData.maxAmount);
+    }
+
+    this.handleRemainingFuelSet(value);
+    this.resetAdjusterValue();
+  };
+
+  handleQuickAction = (value: number): void => {
+    const { fuelData } = this.props;
+    const { remainingFuel } = this.state;
+
+    let remainingFuelValue: number = remainingFuel === null ? 0 : remainingFuel;
+    let newValue: number = remainingFuelValue + value;
+
+    if (fuelData.maxAmount !== null) {
+      newValue = Math.max(newValue, fuelData.maxAmount);
+    }
+
+    this.handleRemainingFuelSet(newValue);
+  };
+
+  renderRemainingFuelInput = (): React.ReactNode => {
+    const { remainingFuel } = this.state;
+    const { fuelData, isInteractive } = this.props;
+
+    return (
+      <div className="ct-vehicle-fuel-tracker__primary">
+        <div className="ct-vehicle-fuel-tracker__primary-label">
+          Fuel remaining (HRS)
+        </div>
+        <div className="ct-vehicle-fuel-tracker__primary-value">
+          <input
+            ref={this.remainingFuelInput}
+            className="ct-vehicle-fuel-tracker__primary-input"
+            type="number"
+            value={remainingFuel !== null ? remainingFuel : ""}
+            onBlur={this.handleRemainingFuelInputBlur}
+            onChange={this.handleRemainingFuelInputChange}
+            min={0}
+            max={fuelData.maxAmount !== null ? fuelData.maxAmount : undefined}
+            readOnly={!isInteractive}
+          />
+        </div>
+      </div>
+    );
+  };
+
+  renderSimpleQuantityAdjuster = (): React.ReactNode => {
+    const { adjusterValue } = this.state;
+    const { isInteractive } = this.props;
+
+    return (
+      <div className="ct-vehicle-fuel-tracker__adjuster">
+        <div className="ct-vehicle-fuel-tracker__adjuster-simple-quantity">
+          <SimpleQuantity
+            label={""}
+            quantity={adjusterValue}
+            minimum={1}
+            maximum={null}
+            onUpdate={this.updateAdjusterValue}
+            isReadonly={!isInteractive}
+          />
+        </div>
+        <div className="ct-vehicle-fuel-tracker__adjuster-actions">
+          <ThemeButton
+            size="small"
+            style="outline"
+            className="ct-vehicle-fuel-tracker__adjuster-button ct-vehicle-fuel-tracker__adjuster-button--use"
+            onClick={this.handleAdjusterUse}
+            isInteractive={isInteractive}
+          >
+            Use
+          </ThemeButton>
+          <ThemeButton
+            size="small"
+            className="ct-vehicle-fuel-tracker__adjuster-button ct-vehicle-fuel-tracker__adjuster-button--add"
+            onClick={this.handleAdjusterAdd}
+            isInteractive={isInteractive}
+          >
+            Add
+          </ThemeButton>
+        </div>
+      </div>
+    );
+  };
+
+  renderQuickActions = (): React.ReactNode => {
+    const { fuelData, isInteractive } = this.props;
+
+    if (fuelData.fuelItems === null) {
+      return null;
+    }
+
+    const actions = [] as {
+      label: string;
+      onClick: () => void;
+      disabled: boolean;
+    }[];
+    fuelData.fuelItems.forEach((item) => {
+      actions.push({
+        label: `Add ${item.amountPerCharge} HRS`,
+        onClick: this.handleQuickAction.bind(this, item.amountPerCharge),
+        disabled: !isInteractive,
+      });
+    });
+
+    return <QuickActions actions={actions}></QuickActions>;
+  };
+
+  render() {
+    const { fuelData, initiallyCollapsed } = this.props;
+
+    let extraNode: React.ReactNode = (
+      <div className="ct-vehicle-fuel-tracker__summary">
+        <span className="ct-vehicle-fuel-tracker__summary-value">
+          {fuelData.remainingFuel} hrs
+        </span>
+      </div>
+    );
+
+    let headerCalloutNode: React.ReactNode = (
+      <CollapsibleHeaderCallout extra={extraNode} value={null} />
+    );
+
+    let headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent
+        heading="Fuel Management"
+        callout={headerCalloutNode}
+      />
+    );
+
+    return (
+      <div className="ct-vehicle-fuel-tracker">
+        <Collapsible
+          header={headerNode}
+          initiallyCollapsed={initiallyCollapsed}
+        >
+          <div className="ct-vehicle-fuel-tracker__content">
+            {this.renderRemainingFuelInput()}
+            {this.renderSimpleQuantityAdjuster()}
+            {this.renderQuickActions()}
+          </div>
+        </Collapsible>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleFuelTracker/index.ts b/ddb_main/tools/js/Shared/components/VehicleFuelTracker/index.ts
new file mode 100644
index 0000000..457aa50
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleFuelTracker/index.ts
@@ -0,0 +1,4 @@
+import VehicleFuelTracker from "./VehicleFuelTracker";
+
+export default VehicleFuelTracker;
+export { VehicleFuelTracker };
diff --git a/ddb_main/tools/js/Shared/components/VehicleHealthAdjuster/VehicleHealthAdjuster.tsx b/ddb_main/tools/js/Shared/components/VehicleHealthAdjuster/VehicleHealthAdjuster.tsx
new file mode 100644
index 0000000..a06d959
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleHealthAdjuster/VehicleHealthAdjuster.tsx
@@ -0,0 +1,95 @@
+import * as React from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderCallout,
+  CollapsibleHeaderContent,
+} from "@dndbeyond/character-components/es";
+import { HitPointInfo } from "@dndbeyond/character-rules-engine/es";
+
+import HealthAdjuster from "../HealthAdjuster";
+
+interface Props {
+  hitPointInfo: HitPointInfo;
+  isInteractive: boolean;
+  initiallyCollapsed: boolean;
+  onSave: (hitPointDiff: number) => void;
+  heading?: string;
+}
+export default class VehicleHealthAdjuster extends React.PureComponent<Props> {
+  static defaultProps = {
+    isInteractive: false,
+    initiallyCollapsed: true,
+  };
+
+  handleAdjustHealth = (hitPointDiff: number): void => {
+    const { onSave } = this.props;
+
+    if (onSave) {
+      onSave(hitPointDiff);
+    }
+  };
+
+  render() {
+    const { hitPointInfo, isInteractive, initiallyCollapsed, heading } =
+      this.props;
+
+    let tempHp: number = hitPointInfo.tempHp === null ? 0 : hitPointInfo.tempHp;
+    let extraNode: React.ReactNode = (
+      <div className="ct-vehicle-health-adjuster__summary">
+        <span className="ct-vehicle-health-adjuster__summary-value">
+          {hitPointInfo.remainingHp + tempHp}
+        </span>
+        <span className="ct-vehicle-health-adjuster__summary-sep">/</span>
+        <span className="ct-vehicle-health-adjuster__summary-value">
+          {hitPointInfo.totalHp + tempHp}
+        </span>
+      </div>
+    );
+
+    let headerCalloutNode: React.ReactNode = (
+      <CollapsibleHeaderCallout extra={extraNode} value={null} />
+    );
+
+    let headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent
+        heading={heading ? heading : "Hit Points"}
+        callout={headerCalloutNode}
+      />
+    );
+
+    return (
+      <div className="ct-vehicle-health-adjuster">
+        <Collapsible
+          header={headerNode}
+          initiallyCollapsed={initiallyCollapsed}
+        >
+          <div className="ct-vehicle-health-adjuster__groups">
+            <div className="ct-vehicle-health-adjuster__group">
+              <div className="ct-vehicle-health-adjuster__group-label">
+                Current HP
+              </div>
+              <div className="ct-vehicle-health-adjuster__group-value">
+                {hitPointInfo.remainingHp}
+              </div>
+            </div>
+            <div className="ct-vehicle-health-adjuster__group">
+              <div className="ct-vehicle-health-adjuster__group-label">
+                Max HP
+              </div>
+              <div className="ct-vehicle-health-adjuster__group-value">
+                {hitPointInfo.totalHp}
+              </div>
+            </div>
+          </div>
+          {isInteractive && (
+            <HealthAdjuster
+              hitPointInfo={hitPointInfo}
+              onSave={this.handleAdjustHealth}
+            />
+          )}
+        </Collapsible>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/VehicleHealthAdjuster/index.ts b/ddb_main/tools/js/Shared/components/VehicleHealthAdjuster/index.ts
new file mode 100644
index 0000000..07a3dc4
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/VehicleHealthAdjuster/index.ts
@@ -0,0 +1,4 @@
+import VehicleHealthAdjuster from "./VehicleHealthAdjuster";
+
+export default VehicleHealthAdjuster;
+export { VehicleHealthAdjuster };
diff --git a/ddb_main/tools/js/Shared/components/common/Button/RemoveButton/RemoveButton.tsx b/ddb_main/tools/js/Shared/components/common/Button/RemoveButton/RemoveButton.tsx
new file mode 100644
index 0000000..3782e17
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/Button/RemoveButton/RemoveButton.tsx
@@ -0,0 +1,41 @@
+import React from "react";
+
+import { ThemeButton } from "../ThemeButton";
+
+//Eventually remove and use character-components/Button/RemoveButton with theme override when needed
+
+interface Props {
+  onClick?: () => void;
+  className?: string;
+  disabled?: boolean;
+  styledDisabled?: boolean;
+  block?: boolean;
+  size?: string;
+  style?: string;
+  active?: boolean;
+  stopPropagation?: boolean;
+  enableConfirm?: boolean;
+  isInteractive?: boolean;
+}
+export default class RemoveButton extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    size: "small",
+    style: "outline",
+    stopPropagation: true,
+  };
+
+  render() {
+    const { className, children, ...restProps } = this.props;
+
+    let classNames: Array<string> = ["ct-remove-button"];
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <ThemeButton {...restProps} className={classNames.join(" ")}>
+        {children ? children : "Delete"}
+      </ThemeButton>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/common/Button/RemoveButton/index.ts b/ddb_main/tools/js/Shared/components/common/Button/RemoveButton/index.ts
new file mode 100644
index 0000000..baeabe8
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/Button/RemoveButton/index.ts
@@ -0,0 +1,4 @@
+import RemoveButton from "./RemoveButton";
+
+export default RemoveButton;
+export { RemoveButton };
diff --git a/ddb_main/tools/js/Shared/components/common/Button/ThemeButton/ThemeButton.tsx b/ddb_main/tools/js/Shared/components/common/Button/ThemeButton/ThemeButton.tsx
new file mode 100644
index 0000000..48ff6f6
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/Button/ThemeButton/ThemeButton.tsx
@@ -0,0 +1,52 @@
+import React from "react";
+
+import { Button } from "@dndbeyond/character-components/es";
+
+interface Props {
+  onClick?: ((evt: React.MouseEvent<HTMLButtonElement>) => void) | (() => void);
+  className: string;
+  disabled?: boolean;
+  styledDisabled?: boolean;
+  block?: boolean;
+  size?: string;
+  style?: string;
+  active?: boolean;
+  stopPropagation?: boolean;
+  enableConfirm?: boolean;
+  confirmText?: string;
+  confirmDuration?: number;
+  isInteractive?: boolean;
+}
+export default class ThemeButton extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    className: "",
+    style: "filled",
+    stopPropagation: true,
+    isInteractive: true,
+  };
+
+  render() {
+    const { style, className, isInteractive, ...restProps } = this.props;
+
+    let classNames: Array<string> = ["ct-theme-button"];
+    if (className) {
+      classNames.push(className);
+    }
+    if (style) {
+      classNames.push(`ct-theme-button--${style}`);
+    } else {
+      classNames.push("ct-theme-button--filled");
+    }
+    if (isInteractive) {
+      classNames.push("ct-theme-button--interactive");
+    }
+
+    return (
+      <Button
+        {...restProps}
+        className={classNames.join(" ")}
+        isInteractive={isInteractive}
+      />
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/common/Button/ThemeButton/index.ts b/ddb_main/tools/js/Shared/components/common/Button/ThemeButton/index.ts
new file mode 100644
index 0000000..a689e52
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/Button/ThemeButton/index.ts
@@ -0,0 +1,4 @@
+import ThemeButton from "./ThemeButton";
+
+export default ThemeButton;
+export { ThemeButton };
diff --git a/ddb_main/tools/js/Shared/components/common/Button/ThemeButtonWithMenu/ThemeButtonWithMenu.tsx b/ddb_main/tools/js/Shared/components/common/Button/ThemeButtonWithMenu/ThemeButtonWithMenu.tsx
new file mode 100644
index 0000000..9970656
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/Button/ThemeButtonWithMenu/ThemeButtonWithMenu.tsx
@@ -0,0 +1,137 @@
+import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
+import List from "@mui/material/List";
+import ListSubheader from "@mui/material/ListSubheader";
+import MenuItem from "@mui/material/MenuItem";
+import Popover from "@mui/material/Popover";
+import React from "react";
+
+import { GroupedMenuOption } from "@dndbeyond/character-rules-engine/es";
+
+import { ThemeButton } from "..";
+
+interface Props {
+  children: React.ReactNode;
+  groupedOptions: Array<GroupedMenuOption>;
+  className?: string;
+  size?: string;
+  buttonStyle?: string;
+  showSingleOption?: boolean;
+  onSelect: (containerDefinitionKey: string) => void;
+  containerEl?: HTMLElement;
+}
+
+export const ThemeButtonWithMenu: React.FC<Props> = ({
+  className,
+  children,
+  groupedOptions,
+  size = "small",
+  buttonStyle = "filled",
+  onSelect,
+  showSingleOption = false,
+  containerEl,
+}) => {
+  const singleOption =
+    groupedOptions.length === 1 &&
+    groupedOptions[0].options?.length === 1 &&
+    !showSingleOption;
+
+  const classNames = [className, "ct-theme-button-with-menu"];
+
+  const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
+
+  const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
+    if (!singleOption) {
+      setAnchorEl(event.currentTarget);
+    } else if (singleOption) {
+      onSelect(groupedOptions[0].options[0]?.value);
+    }
+  };
+
+  const handleClose = (value?: string) => {
+    if (value) {
+      onSelect(value);
+    }
+    setAnchorEl(null);
+  };
+
+  return (
+    <span className={classNames.join(" ")}>
+      <ThemeButton
+        size={size}
+        style={buttonStyle}
+        onClick={(evt: React.MouseEvent<HTMLButtonElement>) => {
+          handleClick(evt);
+        }}
+        data-testid={`theme-button-with-menu-${children?.toString()}`
+          .toLowerCase()
+          .replace(/\s/g, "-")}
+      >
+        {children}{" "}
+        {!singleOption && (
+          <KeyboardArrowDownIcon sx={{ width: 8, height: 8 }} />
+        )}
+      </ThemeButton>
+      {!singleOption && (
+        <Popover
+          anchorEl={anchorEl}
+          container={containerEl}
+          keepMounted
+          open={Boolean(anchorEl)}
+          onClose={(evt: any) => {
+            evt.stopPropagation();
+            evt.nativeEvent?.stopImmediatePropagation();
+
+            handleClose();
+          }}
+        >
+          <List
+            sx={{ bgcolor: "background.default" }}
+            onClick={(evt) => {
+              evt.nativeEvent?.stopImmediatePropagation();
+              evt.stopPropagation();
+            }}
+          >
+            {groupedOptions.map((groupedOption) => (
+              <React.Fragment key={groupedOption.label}>
+                <ListSubheader
+                  sx={{
+                    lineHeight: "32px",
+                    textTransform: "uppercase",
+                    fontWeight: 700,
+                    fontSize: "12px",
+                    bgcolor: "background.default",
+                  }}
+                  data-testid={`theme-button-with-menu-subheader-${groupedOption.label}`
+                    .toLowerCase()
+                    .replace(/\s/g, "-")}
+                >
+                  {groupedOption.label}
+                </ListSubheader>
+                {groupedOption.options.map((option) => {
+                  return (
+                    <MenuItem
+                      sx={{ bgcolor: "background.default" }}
+                      key={option.value}
+                      onClick={(evt) => {
+                        evt.stopPropagation();
+                        evt.nativeEvent?.stopImmediatePropagation();
+                        handleClose(option.value);
+                      }}
+                      data-testid={`theme-button-with-menu-item-${option.label}`
+                        .toLowerCase()
+                        .replace(/\s/g, "-")}
+                    >
+                      {option.label}
+                    </MenuItem>
+                  );
+                })}
+              </React.Fragment>
+            ))}
+          </List>
+        </Popover>
+      )}
+    </span>
+  );
+};
+
+export default ThemeButtonWithMenu;
diff --git a/ddb_main/tools/js/Shared/components/common/Button/ThemeButtonWithMenu/index.ts b/ddb_main/tools/js/Shared/components/common/Button/ThemeButtonWithMenu/index.ts
new file mode 100644
index 0000000..b3802db
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/Button/ThemeButtonWithMenu/index.ts
@@ -0,0 +1,4 @@
+import { ThemeButtonWithMenu } from "./ThemeButtonWithMenu";
+
+export default ThemeButtonWithMenu;
+export { ThemeButtonWithMenu };
diff --git a/ddb_main/tools/js/Shared/components/common/FormCheckBoxesField/FormCheckBoxesField.tsx b/ddb_main/tools/js/Shared/components/common/FormCheckBoxesField/FormCheckBoxesField.tsx
new file mode 100644
index 0000000..3aecae7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/FormCheckBoxesField/FormCheckBoxesField.tsx
@@ -0,0 +1,261 @@
+import clsx from "clsx";
+import { orderBy } from "lodash";
+import React from "react";
+
+import { Checkbox } from "~/components/Checkbox";
+import { HtmlContent } from "~/components/HtmlContent";
+
+import { Accordion } from "../../../../../../components/Accordion";
+import styles from "./styles.module.css";
+import { CheckboxInfo } from "./typings";
+
+export enum CheckboxVariant {
+  BUILDER = "builder",
+  SIDEBAR = "sidebar",
+  DEFAULT = "default",
+}
+
+interface Props {
+  checkboxes: Array<CheckboxInfo>;
+  heading: React.ReactNode;
+  description: React.ReactNode;
+  checkUncheckAllEnabled?: boolean;
+  onCheckUncheckAll?: CheckboxInfo;
+  showAccordion?: boolean;
+  accordionHeading?: string;
+  themed?: boolean;
+  darkMode?: boolean;
+  variant?: "builder" | "sidebar" | "default";
+  allText?: string;
+}
+
+export const FormCheckBoxesField: React.FC<Props> = ({
+  heading,
+  description,
+  checkboxes,
+  showAccordion,
+  checkUncheckAllEnabled,
+  onCheckUncheckAll,
+  themed,
+  darkMode,
+  accordionHeading = "Options",
+  variant = CheckboxVariant.DEFAULT,
+  allText = "All",
+}) => {
+  const sortedChecks = orderBy(checkboxes, "sortOrder");
+  const allChecksEnabled = sortedChecks.every(
+    (checkbox) => checkbox.initiallyEnabled
+  );
+
+  if (!checkboxes.length) {
+    return null;
+  }
+
+  const renderSingleCheckbox = () => {
+    const [checkbox] = sortedChecks;
+
+    return (
+      <div
+        className={clsx([
+          styles.checkboxesContainer,
+          variant === CheckboxVariant.SIDEBAR &&
+            styles.checkboxesContainerSidebar,
+        ])}
+      >
+        <div className={styles.summary}>
+          <div
+            className={clsx([
+              styles.summaryHeadingGroup,
+              styles.summaryHeadingGroupSingle,
+            ])}
+          >
+            <div
+              className={clsx([
+                styles.summaryHeading,
+                variant === CheckboxVariant.SIDEBAR &&
+                  styles.summaryHeadingSidebar,
+                darkMode && styles.summaryHeadingSidebarDark,
+              ])}
+            >
+              {heading}
+            </div>
+            <div className={styles.checkbox}>
+              <Checkbox
+                checked={checkbox.initiallyEnabled}
+                aria-label={checkbox.label}
+                onClick={checkbox.onChange}
+                onChangePromise={checkbox.onChangePromise}
+                themed={themed}
+                darkMode={darkMode}
+                disabled={checkbox.enabled === false}
+                variant={variant}
+              />
+            </div>
+          </div>
+          {description && (
+            <div
+              className={clsx([
+                styles.summaryDescription,
+                variant === CheckboxVariant.SIDEBAR &&
+                  styles.summaryDescriptionSidebar,
+                darkMode && styles.darkMode,
+              ])}
+            >
+              {description}
+            </div>
+          )}
+        </div>
+      </div>
+    );
+  };
+
+  const renderCheckboxes = () => {
+    return (
+      <div className={styles.container}>
+        {sortedChecks.map((checkbox, idx) => (
+          <div
+            className={styles.checkboxWrapper}
+            key={idx}
+            data-testid="content-preference-checkbox"
+          >
+            <div className={styles.group} key={idx}>
+              <div className={styles.checkbox}>
+                <Checkbox
+                  checked={checkbox.initiallyEnabled}
+                  aria-label={checkbox.label}
+                  onClick={checkbox.onChange}
+                  onChangePromise={checkbox.onChangePromise}
+                  themed={themed}
+                  darkMode={darkMode}
+                  disabled={checkbox.enabled === false}
+                  variant={variant}
+                />
+              </div>
+              <div
+                className={clsx([
+                  styles.groupLabel,
+                  variant === CheckboxVariant.DEFAULT &&
+                    styles.groupLabelDefault,
+                ])}
+              >
+                {checkbox.label}
+              </div>
+            </div>
+            {checkbox.description && (
+              <HtmlContent
+                html={checkbox.description}
+                className={clsx([
+                  styles.description,
+                  variant === CheckboxVariant.DEFAULT &&
+                    styles.descriptionDefault,
+                ])}
+              />
+            )}
+          </div>
+        ))}
+      </div>
+    );
+  };
+  return checkboxes.length > 1 ||
+    variant === CheckboxVariant.BUILDER ||
+    variant === CheckboxVariant.DEFAULT ? (
+    <div
+      className={clsx(
+        [styles.checkboxesContainer],
+        variant === CheckboxVariant.SIDEBAR && styles.checkboxesContainerSidebar
+      )}
+    >
+      {((variant === CheckboxVariant.SIDEBAR && !showAccordion) ||
+        variant === CheckboxVariant.BUILDER ||
+        variant === CheckboxVariant.DEFAULT) && (
+        <div className={styles.summary}>
+          <div className={styles.summaryHeadingGroup}>
+            {checkUncheckAllEnabled &&
+              onCheckUncheckAll &&
+              variant === CheckboxVariant.DEFAULT && (
+                <Checkbox
+                  checked={allChecksEnabled}
+                  aria-label="Check/Uncheck all"
+                  onClick={onCheckUncheckAll.onChange}
+                  themed={themed}
+                  darkMode={darkMode}
+                  variant={variant}
+                />
+              )}
+            <div
+              className={clsx([
+                styles.summaryHeading,
+                variant === CheckboxVariant.SIDEBAR &&
+                  styles.summaryHeadingSidebar,
+                darkMode && styles.summaryHeadingSidebarDark,
+                variant === CheckboxVariant.DEFAULT &&
+                  styles.summaryHeadingDefault,
+              ])}
+            >
+              {heading}
+            </div>
+          </div>
+          {description && (
+            <div
+              className={clsx([
+                styles.summaryDescription,
+                variant === CheckboxVariant.SIDEBAR &&
+                  styles.summaryDescriptionSidebar,
+                darkMode && styles.darkMode,
+              ])}
+            >
+              {description}
+            </div>
+          )}
+        </div>
+      )}
+
+      {variant === CheckboxVariant.BUILDER && checkUncheckAllEnabled ? (
+        <div className={styles.summaryBuilder}>
+          <div className={styles.summaryHeadingGroup}>
+            {checkUncheckAllEnabled && onCheckUncheckAll && (
+              <Checkbox
+                checked={allChecksEnabled}
+                aria-label="Check/Uncheck all"
+                onClick={onCheckUncheckAll.onChange}
+                themed={themed}
+                darkMode={darkMode}
+                variant={variant}
+              />
+            )}
+            <div className={styles.summaryHeadingAll}>{allText}</div>
+          </div>
+        </div>
+      ) : null}
+
+      {showAccordion ? (
+        <Accordion
+          summary={
+            variant !== CheckboxVariant.SIDEBAR ? accordionHeading : heading
+          }
+          variant="text"
+          resetOpen={!allChecksEnabled}
+          className={clsx([
+            styles.accordion,
+            variant === CheckboxVariant.BUILDER && styles.accordionBuilder,
+            variant === CheckboxVariant.SIDEBAR && styles.accordionSidebar,
+            variant === CheckboxVariant.SIDEBAR &&
+              darkMode &&
+              styles.accordionHeadingDark,
+          ])}
+        >
+          {variant === CheckboxVariant.SIDEBAR && (
+            <p className={clsx([styles.accordionSidebarDescription])}>
+              {description}
+            </p>
+          )}
+          {renderCheckboxes()}
+        </Accordion>
+      ) : (
+        renderCheckboxes()
+      )}
+    </div>
+  ) : (
+    renderSingleCheckbox()
+  );
+};
diff --git a/ddb_main/tools/js/Shared/components/common/FormInputField/FormInputField.tsx b/ddb_main/tools/js/Shared/components/common/FormInputField/FormInputField.tsx
new file mode 100644
index 0000000..1c7b293
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/FormInputField/FormInputField.tsx
@@ -0,0 +1,139 @@
+import clsx from "clsx";
+import {
+  ChangeEvent,
+  FC,
+  FocusEvent,
+  HTMLAttributes,
+  useEffect,
+  useRef,
+  useState,
+} from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import { useMaxLengthErrorHandling } from "~/hooks/useErrorHandling/useMaxLengthErrorHandling";
+
+export interface FormInputFieldProps
+  extends Omit<
+    HTMLAttributes<HTMLDivElement>,
+    "onChange" | "onBlur" | "onFocus"
+  > {
+  label: string;
+  type?: string;
+  placeholder?: string;
+  initialValue?: string | number | null;
+  inputAttributes?: HTMLAttributes<HTMLInputElement>;
+  maxLength?: number;
+  maxLengthErrorMsg?: string;
+  variant?: "default" | "small";
+  // Handlers
+  onChange?: (value: string | number | null) => void;
+  onBlur?: (value: string | number | null) => void;
+  onFocus?: (value: string | number | null) => void;
+  transformValueOnChange?: (value: string) => string | number | null;
+  transformValueOnBlur?: (value: string) => string | number | null;
+  transformValueOnFocus?: (value: string) => string | number | null;
+}
+
+export const FormInputField: FC<FormInputFieldProps> = ({
+  label, // req
+  type = "text",
+  placeholder = "",
+  initialValue = "",
+  inputAttributes = {},
+  maxLength,
+  maxLengthErrorMsg = "",
+  ...handlers
+}) => {
+  const prevInitialValue = useRef(initialValue);
+  const initialLengthErrorState = maxLength
+    ? (initialValue?.toString().length ?? 0) >= maxLength
+    : false;
+  const { MaxLengthErrorMessage, hideError, handleMaxLengthErrorMsg } =
+    useMaxLengthErrorHandling(
+      initialLengthErrorState,
+      maxLength ?? null,
+      maxLengthErrorMsg
+    );
+  const guid = `FIF_${uuidv4()}`;
+  const [value, setValue] = useState(initialValue);
+
+  const handleOnChange = (evt: ChangeEvent<HTMLInputElement>): void => {
+    const { onChange = null, transformValueOnChange = null } = handlers;
+    const { value: targetElementValue } = evt.target;
+    const value = transformValueOnChange
+      ? transformValueOnChange?.(targetElementValue)
+      : targetElementValue;
+
+    onChange?.(value);
+    setValue(value);
+    if (value !== null) {
+      handleMaxLengthErrorMsg(value.toString());
+    }
+  };
+
+  const handleOnBlur = (evt: FocusEvent<HTMLInputElement>) => {
+    const { onBlur = null, transformValueOnBlur = null } = handlers;
+    const { value: targetElementValue } = evt.target;
+    const value = transformValueOnBlur
+      ? transformValueOnBlur?.(targetElementValue)
+      : targetElementValue;
+
+    onBlur?.(value);
+    if (value !== targetElementValue) {
+      setValue(value);
+    }
+    // Always hide any length warnings when leaving the field since you can't go over the limit anyways
+    hideError();
+  };
+
+  const handleOnFocus = (evt: FocusEvent<HTMLInputElement>) => {
+    const { onFocus = null, transformValueOnFocus = null } = handlers;
+    const { value: targetElementValue } = evt.target;
+    const value = transformValueOnFocus
+      ? transformValueOnFocus?.(targetElementValue)
+      : targetElementValue;
+
+    onFocus?.(value);
+    if (value !== targetElementValue) {
+      setValue(value);
+    }
+    if (value !== null) {
+      handleMaxLengthErrorMsg(value.toString());
+    }
+  };
+
+  useEffect(() => {
+    if (initialValue !== prevInitialValue.current) {
+      setValue(initialValue ?? "");
+      prevInitialValue.current = initialValue;
+    }
+  }, [initialValue]);
+
+  return (
+    <div className={clsx(["builder-field", "form-input-field"])}>
+      <span className="builder-field-label">
+        <label
+          className="builder-field-heading form-input-field-label"
+          htmlFor={guid}
+        >
+          {label}
+        </label>
+      </span>
+      <span className="builder-field-input">
+        <input
+          className="builder-field-value"
+          id={guid}
+          type={type}
+          placeholder={placeholder}
+          onChange={handleOnChange}
+          onBlur={handleOnBlur}
+          onFocus={handleOnFocus}
+          value={value ?? ""}
+          maxLength={maxLength || undefined}
+          {...inputAttributes}
+        />
+      </span>
+      <MaxLengthErrorMessage />
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/components/common/FormSelectField/FormSelectField.tsx b/ddb_main/tools/js/Shared/components/common/FormSelectField/FormSelectField.tsx
new file mode 100644
index 0000000..14719cd
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/FormSelectField/FormSelectField.tsx
@@ -0,0 +1,134 @@
+import uniqueId from "lodash/uniqueId";
+import React from "react";
+
+import { Select } from "@dndbeyond/character-components/es";
+
+import styles from "./styles.module.css";
+
+interface Props {
+  initialValue: string | null;
+  onChange?: (value: string) => void;
+  onChangePromise?: (
+    newValue: string,
+    oldValue: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  heading: React.ReactNode;
+  clsNames: Array<string>;
+  initialOptionRemoved: boolean;
+  options: Array<any>;
+  description?: React.ReactNode;
+  block: boolean;
+  placeholder?: string;
+}
+interface State {
+  value: string | null;
+}
+export default class FormSelectField extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    initialValue: null,
+    clsNames: [],
+    initialOptionRemoved: false,
+    block: false,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.initialValue,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { initialValue } = this.props;
+
+    if (initialValue !== prevProps.initialValue) {
+      this.setState({
+        value: initialValue,
+      });
+    }
+  }
+
+  handleChange = (value: string): void => {
+    const { onChange } = this.props;
+
+    if (onChange) {
+      onChange(value);
+    }
+
+    this.setState({
+      value,
+    });
+  };
+
+  //TODO test that removing newValue from state still works in builder choices
+  handleChangePromise = (
+    newValue: string,
+    oldValue: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { onChangePromise } = this.props;
+
+    if (onChangePromise) {
+      onChangePromise(newValue, oldValue, accept, reject);
+    }
+  };
+
+  render() {
+    const { value } = this.state;
+    const {
+      onChangePromise,
+      onChange,
+      block,
+      heading,
+      options,
+      clsNames,
+      initialOptionRemoved,
+      description,
+      placeholder,
+    } = this.props;
+
+    const uId: string = uniqueId("qry-");
+
+    let conClsNames: Array<string> = ["builder-field", "builder-field-select"];
+    if (clsNames.length) {
+      conClsNames = [...conClsNames, ...clsNames];
+    }
+    if (block) {
+      conClsNames.push("builder-field-select-block");
+    }
+
+    return (
+      <div className={conClsNames.join(" ")}>
+        <div className="builder-field-select-summary">
+          <label
+            className="builder-field-heading form-input-field-label"
+            htmlFor={uId}
+          >
+            {heading}
+          </label>
+          <div className={styles.summaryDescription}>{description}</div>
+        </div>
+        <div className="builder-field-select-input">
+          <Select
+            options={options}
+            onChange={onChange ? this.handleChange : undefined}
+            onChangePromise={
+              onChangePromise ? this.handleChangePromise : undefined
+            }
+            value={value}
+            initialOptionRemoved={initialOptionRemoved}
+            placeholder={placeholder}
+          />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/common/FormSelectField/index.ts b/ddb_main/tools/js/Shared/components/common/FormSelectField/index.ts
new file mode 100644
index 0000000..4633dbd
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/FormSelectField/index.ts
@@ -0,0 +1,4 @@
+import FormSelectField from "./FormSelectField";
+
+export default FormSelectField;
+export { FormSelectField };
diff --git a/ddb_main/tools/js/Shared/components/common/FormToggleField/FormToggleField.tsx b/ddb_main/tools/js/Shared/components/common/FormToggleField/FormToggleField.tsx
new file mode 100644
index 0000000..ae65ecd
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/FormToggleField/FormToggleField.tsx
@@ -0,0 +1,57 @@
+import React from "react";
+
+import { Toggle } from "~/components/Toggle";
+
+interface Props {
+  initiallyEnabled: boolean;
+  onChange?: (isEnabled?: boolean) => void;
+  onChangePromise?: (
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  heading: React.ReactNode;
+  description?: React.ReactNode;
+  toggleLabel: string;
+  isReadOnly?: boolean;
+}
+export default class FormToggleField extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    initiallyEnabled: false,
+  };
+
+  render() {
+    const {
+      heading,
+      description,
+      initiallyEnabled,
+      onChange,
+      onChangePromise,
+      toggleLabel,
+      isReadOnly,
+    } = this.props;
+
+    return (
+      <div className="builder-field builder-field-toggle">
+        <div className="builder-field-toggle-summary">
+          <div className="builder-field-toggle-heading">{heading}</div>
+          {description && (
+            <div className="builder-field-toggle-description">
+              {description}
+            </div>
+          )}
+        </div>
+        <div className="builder-field-toggle-input">
+          {onChange && (
+            <Toggle
+              checked={initiallyEnabled}
+              onClick={onChange}
+              color="secondary"
+              aria-label={toggleLabel}
+            />
+          )}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/common/FormToggleField/index.ts b/ddb_main/tools/js/Shared/components/common/FormToggleField/index.ts
new file mode 100644
index 0000000..6efba43
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/FormToggleField/index.ts
@@ -0,0 +1,4 @@
+import FormToggleField from "./FormToggleField";
+
+export default FormToggleField;
+export { FormToggleField };
diff --git a/ddb_main/tools/js/Shared/components/common/InlineSeparatedNodes/InlineSeparatedNodes.tsx b/ddb_main/tools/js/Shared/components/common/InlineSeparatedNodes/InlineSeparatedNodes.tsx
new file mode 100644
index 0000000..fe3c363
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/InlineSeparatedNodes/InlineSeparatedNodes.tsx
@@ -0,0 +1,19 @@
+import React from "react";
+
+interface Props {
+  nodes: Array<React.ReactNode>;
+  sep?: string;
+}
+
+export default function InlineSeparatedNodes({ nodes, sep = ", " }: Props) {
+  return (
+    <React.Fragment>
+      {nodes.map((node, idx) => (
+        <React.Fragment key={idx}>
+          {node}
+          {idx < nodes.length - 1 && sep}
+        </React.Fragment>
+      ))}
+    </React.Fragment>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/components/common/InlineSeparatedNodes/index.ts b/ddb_main/tools/js/Shared/components/common/InlineSeparatedNodes/index.ts
new file mode 100644
index 0000000..8a088e5
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/InlineSeparatedNodes/index.ts
@@ -0,0 +1,4 @@
+import InlineSeparatedNodes from "./InlineSeparatedNodes";
+
+export default InlineSeparatedNodes;
+export { InlineSeparatedNodes };
diff --git a/ddb_main/tools/js/Shared/components/common/LinkButton/BuilderLinkButton/BuilderLinkButton.tsx b/ddb_main/tools/js/Shared/components/common/LinkButton/BuilderLinkButton/BuilderLinkButton.tsx
new file mode 100644
index 0000000..bf02136
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/LinkButton/BuilderLinkButton/BuilderLinkButton.tsx
@@ -0,0 +1,29 @@
+import * as React from "react";
+
+import LinkButton from "../LinkButton";
+
+interface Props {
+  url: string;
+  className?: string;
+  block?: boolean;
+  size: "oversized" | "large" | "medium" | "small";
+  disabled?: boolean;
+  download?: string | boolean;
+  onClick?: (isDisabled: boolean) => void;
+}
+export default class BuilderLinkButton extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, ...restProps } = this.props;
+
+    let classNames: Array<string> = ["builder-button"];
+    if (className) {
+      classNames.push(className);
+    }
+
+    return <LinkButton {...restProps} className={classNames.join(" ")} />;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/common/LinkButton/BuilderLinkButton/index.ts b/ddb_main/tools/js/Shared/components/common/LinkButton/BuilderLinkButton/index.ts
new file mode 100644
index 0000000..4701be1
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/LinkButton/BuilderLinkButton/index.ts
@@ -0,0 +1,4 @@
+import BuilderLinkButton from "./BuilderLinkButton";
+
+export default BuilderLinkButton;
+export { BuilderLinkButton };
diff --git a/ddb_main/tools/js/Shared/components/common/LinkButton/LinkButton.tsx b/ddb_main/tools/js/Shared/components/common/LinkButton/LinkButton.tsx
new file mode 100644
index 0000000..24db118
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/LinkButton/LinkButton.tsx
@@ -0,0 +1,86 @@
+import React from "react";
+
+interface Props {
+  url: string;
+  className: string;
+  block: boolean;
+  size: "oversized" | "large" | "medium" | "small";
+  disabled: boolean;
+  download?: string | boolean;
+  onClick?: (isDisabled: boolean) => void;
+  target?: string;
+}
+export default class LinkButton extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    className: "",
+    clsNames: [],
+    block: false,
+    disabled: false,
+  };
+
+  handleClick = (evt: React.MouseEvent) => {
+    const { onClick, disabled } = this.props;
+
+    if (onClick) {
+      onClick(disabled);
+    }
+  };
+
+  render() {
+    const {
+      disabled,
+      block,
+      size,
+      className,
+      url,
+      children,
+      download,
+      target,
+    } = this.props;
+
+    let classNames: Array<string> = ["ct-button", className];
+
+    let buttonSizeBase: string = "character-button";
+    if (block) {
+      buttonSizeBase += "-block";
+    }
+
+    let buttonSizeFinal: string;
+    switch (size) {
+      case "oversized":
+      case "large":
+      case "medium":
+      case "small":
+        buttonSizeFinal = `${buttonSizeBase}-${size}`;
+        break;
+      default:
+        buttonSizeFinal = buttonSizeBase;
+    }
+    classNames.push(buttonSizeFinal);
+
+    if (disabled) {
+      classNames.push("character-button-disabled");
+      classNames.push(`${buttonSizeFinal}-disabled`);
+    }
+
+    if (disabled) {
+      return (
+        <span className={classNames.join(" ")} onClick={this.handleClick}>
+          {children}
+        </span>
+      );
+    } else {
+      return (
+        <a
+          href={url}
+          target={target}
+          download={download}
+          className={classNames.join(" ")}
+          onClick={this.handleClick}
+        >
+          {children}
+        </a>
+      );
+    }
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/common/LinkButton/ThemeLinkButton/ThemeLinkButton.tsx b/ddb_main/tools/js/Shared/components/common/LinkButton/ThemeLinkButton/ThemeLinkButton.tsx
new file mode 100644
index 0000000..1d6fcd4
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/LinkButton/ThemeLinkButton/ThemeLinkButton.tsx
@@ -0,0 +1,34 @@
+import * as React from "react";
+
+import LinkButton from "../LinkButton";
+
+interface Props {
+  url: string;
+  className?: string;
+  block?: boolean;
+  size: "oversized" | "large" | "medium" | "small";
+  style: "filled" | "outline";
+  disabled?: boolean;
+  download?: string | boolean;
+  target?: string;
+}
+export default class ThemeLinkButton extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    className: "",
+    style: "filled",
+  };
+
+  render() {
+    const { className, style, ...restProps } = this.props;
+
+    let classNames: Array<string> = [
+      "ct-theme-button",
+      `ct-theme-button--${style}`,
+    ];
+    if (className) {
+      classNames.push(className);
+    }
+
+    return <LinkButton {...restProps} className={classNames.join(" ")} />;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/common/LinkButton/ThemeLinkButton/index.ts b/ddb_main/tools/js/Shared/components/common/LinkButton/ThemeLinkButton/index.ts
new file mode 100644
index 0000000..4b41649
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/common/LinkButton/ThemeLinkButton/index.ts
@@ -0,0 +1,4 @@
+import ThemeLinkButton from "./ThemeLinkButton";
+
+export default ThemeLinkButton;
+export { ThemeLinkButton };
diff --git a/ddb_main/tools/js/Shared/components/legacy/ArmorList/ArmorList.tsx b/ddb_main/tools/js/Shared/components/legacy/ArmorList/ArmorList.tsx
new file mode 100644
index 0000000..dd96991
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/ArmorList/ArmorList.tsx
@@ -0,0 +1,82 @@
+import { FC } from "react";
+
+import { Accordion } from "~/components/Accordion";
+import { ItemName } from "~/components/ItemName";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { EquipmentActions } from "~/subApps/builder/components/EquipmentActions";
+import { useEquipmentMethods } from "~/subApps/builder/hooks/useEquipmentMethods";
+import { Item } from "~/types";
+
+import ItemDetail from "../../ItemDetail";
+import { ItemListInformationCollapsible } from "../../ItemListInformationCollapsible";
+import { EquipmentListItemActions } from "../EquipmentListItem";
+
+interface ArmorListItemProps {
+  item: Item;
+  unequipLabel: string;
+  equipLabel: string;
+  showRemove?: boolean;
+  showEquip?: boolean;
+  showUnequip?: boolean;
+  showAttuning?: boolean;
+  showHeaderAction: boolean;
+}
+
+export const ArmorListItem: FC<ArmorListItemProps> = ({
+  item,
+  equipLabel,
+  unequipLabel,
+  ...props
+}) => {
+  const actions = useEquipmentMethods();
+  const {
+    ruleData,
+    proficiencyBonus,
+    characterTheme,
+    itemUtils,
+    helperUtils,
+    containerLookup,
+  } = useCharacterEngine();
+  const image = itemUtils.getAvatarUrl(item);
+  const altText = itemUtils.getName(item);
+  const container = helperUtils.lookupDataOrFallback(
+    containerLookup,
+    itemUtils.getContainerDefinitionKey(item)
+  );
+
+  const getMetaItems = () => {
+    const type = itemUtils.getType(item);
+    const baseArmorName = itemUtils.getBaseArmorName(item);
+
+    return [...(type ? [type] : []), ...(baseArmorName ? [baseArmorName] : [])];
+  };
+
+  return (
+    <Accordion
+      summary={<ItemName item={item} showLegacyBadge={true} />}
+      summaryAction={
+        <EquipmentActions
+          item={item}
+          equipLabel={equipLabel}
+          unequipLabel={unequipLabel}
+        />
+      }
+      summaryImage={image}
+      summaryImageAlt={altText}
+      summaryMetaItems={getMetaItems()}
+      variant="paper"
+    >
+      <ItemListInformationCollapsible ruleData={ruleData} item={item} />
+      <ItemDetail
+        container={container}
+        theme={characterTheme}
+        item={item}
+        ruleData={ruleData}
+        showCustomize={false}
+        showActions={false}
+        proficiencyBonus={proficiencyBonus}
+      />
+      <EquipmentListItemActions item={item} {...actions} {...props} />
+    </Accordion>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/components/legacy/ClassSpellListManager/ClassSpellListManager.tsx b/ddb_main/tools/js/Shared/components/legacy/ClassSpellListManager/ClassSpellListManager.tsx
new file mode 100644
index 0000000..6a878ae
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/ClassSpellListManager/ClassSpellListManager.tsx
@@ -0,0 +1,560 @@
+import { orderBy } from "lodash";
+import React from "react";
+
+import { Button } from "@dndbeyond/character-components/es";
+import {
+  BaseSpellContract,
+  CharacterTheme,
+  CharClass,
+  ClassUtils,
+  Constants,
+  DataOriginRefData,
+  FormatUtils,
+  RuleData,
+  Spell,
+  SpellCasterInfo,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine";
+
+import { HtmlContent } from "~/components/HtmlContent";
+
+import { ApiSpellsRequest } from "../../../selectors/composite/apiCreator";
+import { SpellList, SpellListItem } from "../SpellList";
+import SpellManagerGroup from "../SpellManagerGroup";
+
+export default class ClassSpellListManager extends React.PureComponent<
+  {
+    charClass: CharClass;
+    isSpellsKnownMaxed: boolean;
+    isCantripsKnownMaxed: boolean;
+    isPrepareMaxed: boolean;
+    spells: Array<Spell>;
+    activeSpells: Array<Spell>;
+    ritualSpells: Array<Spell>;
+    spellList: Array<any>;
+    prepareMax: number;
+    spellcastingModifier: number;
+    classHeader: string;
+    classSpellListIdx: number;
+    onSpellPrepare: (spell: Spell, classMappingId: number) => void;
+    onSpellUnprepare: (spell: Spell, classMappingId: number) => void;
+    onSpellRemove: (spell: Spell, classMappingId: number) => void;
+    onSpellAdd: (spell: Spell, classMappingId: number) => void;
+    onAlwaysKnownLoad: (
+      spells: Array<BaseSpellContract>,
+      classId: number
+    ) => void;
+    showHeader: boolean;
+    spellCasterInfo: SpellCasterInfo;
+    ruleData: RuleData;
+    dataOriginRefData: DataOriginRefData;
+    loadRemainingSpellList: ApiSpellsRequest | null;
+    loadAlwaysKnownSpells?: ApiSpellsRequest | null;
+    overallSpellInfo: any;
+    preparedSpellcaster: boolean;
+    knownSpellcaster: boolean;
+    spellbookSpellcaster: boolean;
+    knownSpellIds: Array<any>;
+    knownSpellCount: number;
+    activeCantripsCount: number;
+    preparedSpellCount: number;
+    knownCantripsMax: number;
+    knownSpellsMax: number;
+    proficiencyBonus: number;
+    theme: CharacterTheme;
+    activeSourceCategories: Array<number>;
+  },
+  {
+    showRitualSpells: boolean;
+    visibleSpellGroups: {
+      activeSpells: boolean;
+      spellbook: boolean;
+      addSpells: boolean;
+    };
+  }
+> {
+  static defaultProps = {
+    classHeader: "",
+    showHeader: true,
+  };
+
+  constructor(props) {
+    super(props);
+
+    const { spellbookSpellcaster, knownSpellCount, activeCantripsCount } =
+      props;
+
+    const isSpellbookEmpty = knownSpellCount === 0 && activeCantripsCount === 0;
+
+    this.state = {
+      showRitualSpells: false,
+      visibleSpellGroups: {
+        activeSpells:
+          !spellbookSpellcaster || (spellbookSpellcaster && !isSpellbookEmpty),
+        spellbook: spellbookSpellcaster && isSpellbookEmpty,
+        addSpells: false,
+      },
+    };
+  }
+
+  handlePrepare = (spell) => {
+    const { onSpellPrepare, charClass } = this.props;
+    if (onSpellPrepare) {
+      onSpellPrepare(spell, ClassUtils.getMappingId(charClass));
+    }
+  };
+
+  handleUnprepare = (spell) => {
+    const { onSpellUnprepare, charClass } = this.props;
+    if (onSpellUnprepare) {
+      onSpellUnprepare(spell, ClassUtils.getMappingId(charClass));
+    }
+  };
+
+  handleRemove = (spell) => {
+    const { onSpellRemove, charClass } = this.props;
+    if (onSpellRemove) {
+      onSpellRemove(spell, ClassUtils.getMappingId(charClass));
+    }
+  };
+
+  handleAdd = (spell) => {
+    const { onSpellAdd, charClass } = this.props;
+
+    if (onSpellAdd) {
+      onSpellAdd(spell, ClassUtils.getMappingId(charClass));
+    }
+  };
+
+  handleAlwaysKnownLoad = (spells: Array<BaseSpellContract>): void => {
+    const { onAlwaysKnownLoad, charClass } = this.props;
+
+    if (onAlwaysKnownLoad) {
+      onAlwaysKnownLoad(spells, ClassUtils.getActiveId(charClass));
+    }
+  };
+
+  handleShowSpellGroup = (key) => {
+    this.setState((prevState) => {
+      let resetState = {
+        activeSpells: false,
+        addSpells: false,
+        spellbook: false,
+      };
+
+      return {
+        visibleSpellGroups: {
+          ...resetState,
+          [key]: !prevState.visibleSpellGroups[key],
+        },
+      };
+    });
+  };
+
+  handleToggleRitualSpells = () => {
+    this.setState((prevState) => ({
+      showRitualSpells: !prevState.showRitualSpells,
+    }));
+  };
+
+  doesAvailableSpellsHaveNotifications = () => {
+    const {
+      prepareMax,
+      knownCantripsMax,
+      knownSpellsMax,
+      knownSpellCount,
+      activeCantripsCount,
+      preparedSpellCount,
+    } = this.props;
+
+    if (knownCantripsMax !== null && activeCantripsCount > knownCantripsMax) {
+      return true;
+    }
+
+    if (prepareMax && preparedSpellCount > prepareMax) {
+      return true;
+    }
+
+    if (knownSpellsMax && knownSpellCount > knownSpellsMax) {
+      return true;
+    }
+
+    return false;
+  };
+
+  renderSpellListSpellStatus = () => {
+    const {
+      charClass,
+      prepareMax,
+      knownCantripsMax,
+      knownSpellsMax,
+      knownSpellCount,
+      activeCantripsCount,
+      preparedSpellCount,
+    } = this.props;
+    const spellCastingLearningStyle = ClassUtils.getSpellCastingLearningStyle(charClass);
+
+    let cantripsDisplay = "";
+    let cantripsClsNames = ["spell-manager-info-cantrips"];
+    if (knownCantripsMax !== null) {
+      if (activeCantripsCount === knownCantripsMax) {
+        cantripsDisplay = `Cantrips: ${knownCantripsMax}`;
+      } else {
+        cantripsDisplay = `Cantrips: ${activeCantripsCount}/${knownCantripsMax}`;
+
+        if (activeCantripsCount > knownCantripsMax) {
+          cantripsClsNames.push("spell-manager-info-exceeded");
+        }
+      }
+    }
+
+    const spellDisplayListType = spellCastingLearningStyle === Constants.SpellCastingLearningStyle.Prepared
+      ? "Prepared"
+      : "Known";
+    let spellsDisplay = "";
+    let spellsClsNames = ["spell-manager-info-spells"];
+    if (prepareMax) {
+      if (preparedSpellCount === prepareMax) {
+        spellsDisplay = `Prepared Spells: ${preparedSpellCount}`;
+      } else {
+        spellsDisplay = `Prepared Spells: ${preparedSpellCount}/${prepareMax}`;
+
+        if (preparedSpellCount > prepareMax) {
+          spellsClsNames.push("spell-manager-info-exceeded");
+        }
+      }
+
+      spellsDisplay += `<span class="spell-manager-info-extra">(${knownSpellCount} Known)</span>`;
+    } else if (knownSpellsMax) {
+      if (knownSpellCount === knownSpellsMax) {
+        spellsDisplay = `${spellDisplayListType} Spells: ${knownSpellCount}`;
+      } else {
+        spellsDisplay = `${spellDisplayListType} Spells: ${knownSpellCount}/${knownSpellsMax}`;
+
+        if (knownSpellCount > knownSpellsMax) {
+          spellsClsNames.push("spell-manager-info-exceeded");
+        }
+      }
+    }
+
+    return (
+      <div className="spell-manager-info">
+        <div className={cantripsClsNames.join(" ")}>{cantripsDisplay}</div>
+        <HtmlContent
+          className={spellsClsNames.join(" ")}
+          html={spellsDisplay}
+          withoutTooltips
+        />
+      </div>
+    );
+  };
+
+  render() {
+    const { visibleSpellGroups, showRitualSpells } = this.state;
+    const {
+      charClass,
+      spells,
+      prepareMax,
+      isSpellsKnownMaxed,
+      isCantripsKnownMaxed,
+      isPrepareMaxed,
+      activeSpells,
+      ritualSpells,
+      spellcastingModifier,
+      loadRemainingSpellList,
+      loadAlwaysKnownSpells,
+      preparedSpellcaster,
+      knownSpellcaster,
+      spellbookSpellcaster,
+      knownSpellIds,
+      knownSpellCount,
+      activeCantripsCount,
+      showHeader,
+      spellCasterInfo,
+      ruleData,
+      overallSpellInfo,
+      dataOriginRefData,
+      proficiencyBonus,
+      theme,
+      activeSourceCategories,
+    } = this.props;
+    const spellCastingLearningStyle = ClassUtils.getSpellCastingLearningStyle(charClass);
+
+    const activeGroupHeading = knownSpellcaster && spellCastingLearningStyle !== Constants.SpellCastingLearningStyle.Prepared
+      ? "Known Spells"
+      : "Prepared Spells";
+
+    const addGroupHeading = knownSpellcaster || spellbookSpellcaster
+      ? "Add Spells"
+      : "Known Spells";
+
+    const addButtonText = Constants.SpellCastingLearningStyleAddText[spellCastingLearningStyle];
+    const removeButtonText = Constants.SpellCastingLearningStyleRemoveText[spellCastingLearningStyle];
+
+    let addGroupHeadingNotificationNode;
+    if (this.doesAvailableSpellsHaveNotifications()) {
+      addGroupHeadingNotificationNode = (
+        <div className="class-spell-list-heading-notification">!</div>
+      );
+    }
+
+    let activeSpellsConClsNames = ["class-spell-list"];
+    if (visibleSpellGroups.activeSpells) {
+      activeSpellsConClsNames.push("class-spell-list-opened");
+    } else {
+      activeSpellsConClsNames.push("class-spell-list-collapsed");
+    }
+
+    let ritualSpellsConClsNames = ["class-spell-list-rituals"];
+    if (showRitualSpells) {
+      ritualSpellsConClsNames.push("class-spell-list-opened");
+    } else {
+      ritualSpellsConClsNames.push("class-spell-list-collapsed");
+    }
+
+    let spellbookConClsNames = ["class-spell-list"];
+    if (visibleSpellGroups.spellbook) {
+      spellbookConClsNames.push("class-spell-list-opened");
+    } else {
+      spellbookConClsNames.push("class-spell-list-collapsed");
+    }
+
+    let addSpellsConClsNames = ["class-spell-list"];
+    if (visibleSpellGroups.addSpells) {
+      addSpellsConClsNames.push("class-spell-list-opened");
+    } else {
+      addSpellsConClsNames.push("class-spell-list-collapsed");
+    }
+
+    let classPortraitUrl = ClassUtils.getPortraitUrl(charClass);
+    let className = ClassUtils.getName(charClass);
+
+    const isSpellbookEmpty = knownSpellCount === 0 && activeCantripsCount === 0;
+
+    const orderedActiveSpells = orderBy(activeSpells, [
+      (spell) => SpellUtils.getLevel(spell),
+      (spell) => SpellUtils.getName(spell),
+      (spell) => SpellUtils.getExpandedDataOriginRef(spell) !== null,
+      (spell) => SpellUtils.getUniqueKey(spell),
+    ]);
+
+    return (
+      <div className="class-spell-list-manager">
+        {showHeader && (
+          <div className="class-spell-list-manager-header">
+            <div className="class-spell-list-manager-preview">
+              <img
+                className="class-spell-list-manager-preview-img"
+                src={classPortraitUrl}
+                alt=""
+              />
+            </div>
+            <div className="class-spell-list-manager-heading">{className}</div>
+            <div className="class-spell-list-manager-modifier">
+              Spellcasting Modifier:{" "}
+              {FormatUtils.renderSignedNumber(spellcastingModifier)}
+            </div>
+          </div>
+        )}
+        <div className={activeSpellsConClsNames.join(" ")}>
+          <div
+            className="class-spell-list-header"
+            onClick={this.handleShowSpellGroup.bind(this, "activeSpells")}
+          >
+            <div className="class-spell-list-heading">
+              {activeGroupHeading}
+              <span className="class-spell-list-heading-extra">
+                ({activeSpells.length})
+              </span>
+            </div>
+            <div className="class-spell-list-trigger" />
+          </div>
+          {visibleSpellGroups.activeSpells && (
+            <div className="class-spell-list-content">
+              <div className="class-spell-list-actives">
+                {orderedActiveSpells.map((spell) => {
+                  const { canRemove, canPrepare, alwaysPrepared } = spell;
+
+                  const showUnprepare = !alwaysPrepared && canPrepare;
+
+                  let footerNode;
+                  if (canRemove || showUnprepare) {
+                    footerNode = (
+                      <div className="spell-list-item-content-actions">
+                        {showUnprepare && (
+                          <Button
+                            size="small"
+                            style={"outline"}
+                            onClick={this.handleUnprepare.bind(this, spell)}
+                          >
+                            Unprepare Spell
+                          </Button>
+                        )}
+                        {canRemove && (
+                          <div
+                            className="spell-manager-spell-remove"
+                            onClick={this.handleRemove.bind(this, spell)}
+                          >
+                            <span className="spell-manager-spell-remove-icon" />{" "}
+                            Remove Spell
+                          </div>
+                        )}
+                      </div>
+                    );
+                  }
+
+                  return (
+                    <SpellListItem
+                      theme={theme}
+                      spell={spell}
+                      key={SpellUtils.getUniqueKey(spell)}
+                      footerNode={footerNode}
+                      spellCasterInfo={spellCasterInfo}
+                      ruleData={ruleData}
+                      dataOriginRefData={dataOriginRefData}
+                      proficiencyBonus={proficiencyBonus}
+                    />
+                  );
+                })}
+                {orderedActiveSpells.length === 0 && (
+                  <div className="class-spell-list-empty">
+                    {spellbookSpellcaster && (
+                      <div>You currently have no prepared spells.</div>
+                    )}
+                    {preparedSpellcaster && (
+                      <div>
+                        You currently have no prepared spells. Learn and prepare
+                        spells from your list of available spells below.
+                      </div>
+                    )}
+                    {knownSpellcaster && (
+                      <div>
+                        You currently have no known spells. Learn spells from
+                        your list of available spells below.
+                      </div>
+                    )}
+                  </div>
+                )}
+              </div>
+              {ritualSpells.length > 0 && (
+                <div className={ritualSpellsConClsNames.join(" ")}>
+                  <div
+                    className="class-spell-list-header"
+                    onClick={this.handleToggleRitualSpells}
+                  >
+                    <div className="class-spell-list-heading">
+                      Ritual Spells
+                      <span className="class-spell-list-heading-extra">
+                        ({ritualSpells.length})
+                      </span>
+                    </div>
+                    <div className="class-spell-list-trigger" />
+                  </div>
+                  {showRitualSpells && (
+                    <SpellList
+                      theme={theme}
+                      spells={ritualSpells}
+                      castAsRitual={true}
+                      spellCasterInfo={spellCasterInfo}
+                      ruleData={ruleData}
+                      dataOriginRefData={dataOriginRefData}
+                      proficiencyBonus={proficiencyBonus}
+                    />
+                  )}
+                </div>
+              )}
+            </div>
+          )}
+        </div>
+        {spellbookSpellcaster && (
+          <div className={spellbookConClsNames.join(" ")}>
+            <div
+              className="class-spell-list-header"
+              onClick={this.handleShowSpellGroup.bind(this, "spellbook")}
+            >
+              <div className="class-spell-list-heading">Spellbook</div>
+              <div className="class-spell-list-trigger" />
+            </div>
+            {visibleSpellGroups.spellbook && (
+              <div className="class-spell-list-content">
+                {isSpellbookEmpty && (
+                  <div className="class-spell-list-empty">
+                    You currently have no known spells. Learn spells from your
+                    list of available spells below.
+                  </div>
+                )}
+                {!isSpellbookEmpty && this.renderSpellListSpellStatus()}
+                {!isSpellbookEmpty && (
+                  <SpellManagerGroup
+                    theme={theme}
+                    isPrepareMaxed={isPrepareMaxed}
+                    isCantripsKnownMaxed={isCantripsKnownMaxed}
+                    isSpellsKnownMaxed={isSpellsKnownMaxed}
+                    enableAdd={false}
+                    enableSpellRemove={false}
+                    spells={spells}
+                    knownSpellIds={knownSpellIds}
+                    onPrepare={this.handlePrepare}
+                    onUnprepare={this.handleUnprepare}
+                    onRemove={this.handleRemove}
+                    onAdd={this.handleAdd}
+                    addButtonText={addButtonText}
+                    removeButtonText={"Remove"}
+                    spellCasterInfo={spellCasterInfo}
+                    ruleData={ruleData}
+                    overallSpellInfo={overallSpellInfo}
+                    dataOriginRefData={dataOriginRefData}
+                    proficiencyBonus={proficiencyBonus}
+                    activeSourceCategories={activeSourceCategories}
+                  />
+                )}
+              </div>
+            )}
+          </div>
+        )}
+        <div className={addSpellsConClsNames.join(" ")}>
+          <div
+            className="class-spell-list-header"
+            onClick={this.handleShowSpellGroup.bind(this, "addSpells")}
+          >
+            <div className="class-spell-list-heading">
+              {addGroupHeading}
+              {addGroupHeadingNotificationNode}
+            </div>
+            <div className="class-spell-list-trigger" />
+          </div>
+          {visibleSpellGroups.addSpells && (
+            <div className="class-spell-list-content">
+              {this.renderSpellListSpellStatus()}
+              <SpellManagerGroup
+                theme={theme}
+                isPrepareMaxed={isPrepareMaxed}
+                isCantripsKnownMaxed={isCantripsKnownMaxed}
+                isSpellsKnownMaxed={isSpellsKnownMaxed}
+                loadAlwaysKnownSpells={loadAlwaysKnownSpells}
+                loadSpells={loadRemainingSpellList}
+                spells={spells}
+                enablePrepare={!spellbookSpellcaster}
+                enableUnprepare={!spellbookSpellcaster}
+                knownSpellIds={knownSpellIds}
+                onAlwaysKnownLoad={this.handleAlwaysKnownLoad}
+                onPrepare={this.handlePrepare}
+                onUnprepare={this.handleUnprepare}
+                onRemove={this.handleRemove}
+                onAdd={this.handleAdd}
+                addButtonText={addButtonText}
+                removeButtonText={removeButtonText}
+                spellCasterInfo={spellCasterInfo}
+                ruleData={ruleData}
+                overallSpellInfo={overallSpellInfo}
+                dataOriginRefData={dataOriginRefData}
+                proficiencyBonus={proficiencyBonus}
+                activeSourceCategories={activeSourceCategories}
+              />
+            </div>
+          )}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/legacy/ClassSpellListManager/index.ts b/ddb_main/tools/js/Shared/components/legacy/ClassSpellListManager/index.ts
new file mode 100644
index 0000000..924d48f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/ClassSpellListManager/index.ts
@@ -0,0 +1,4 @@
+import ClassSpellListManager from "./ClassSpellListManager";
+
+export default ClassSpellListManager;
+export { ClassSpellListManager };
diff --git a/ddb_main/tools/js/Shared/components/legacy/CurrencyList/CurrencyList.tsx b/ddb_main/tools/js/Shared/components/legacy/CurrencyList/CurrencyList.tsx
new file mode 100644
index 0000000..3d3cc02
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/CurrencyList/CurrencyList.tsx
@@ -0,0 +1,314 @@
+import React from "react";
+
+import { CoinIcon } from "@dndbeyond/character-components/es";
+import {
+  Constants,
+  FormatUtils,
+  HelperUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { CURRENCY_VALUE } from "../../../constants/App";
+import { CurrencyErrorTypeEnum } from "../../../containers/panes/CurrencyPane/CurrencyPaneConstants";
+
+interface CurrencyListItemProps {
+  name: string;
+  value: number;
+  conversionAmount?: number;
+  conversionType?: string;
+  onChange: (value: number) => void;
+  onError?: (errorType: CurrencyErrorTypeEnum) => void;
+  minValue: number;
+  maxValue: number;
+  coinType: Constants.CoinTypeEnum;
+}
+interface CurrencyListItemState {
+  latestValue: number | null;
+  preValue: number | null;
+  errorType: CurrencyErrorTypeEnum | null;
+}
+export class CurrencyListItem extends React.PureComponent<
+  CurrencyListItemProps,
+  CurrencyListItemState
+> {
+  static defaultProps = {
+    minValue: CURRENCY_VALUE.MIN,
+    maxValue: CURRENCY_VALUE.MAX,
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      latestValue: props.value,
+      preValue: props.value,
+      errorType: null,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<CurrencyListItemProps>,
+    prevState: Readonly<CurrencyListItemState>
+  ): void {
+    const { value } = this.props;
+
+    if (value !== prevProps.value) {
+      this.setState({
+        latestValue: value,
+        preValue: value,
+      });
+    }
+  }
+
+  handleBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { latestValue, preValue, errorType } = this.state;
+    const { onChange, onError } = this.props;
+
+    let parsedValue = HelperUtils.parseInputInt(evt.target.value);
+    let targetValue: number | null =
+      errorType === null && parsedValue !== null ? parsedValue : preValue;
+    if (targetValue !== null && onChange) {
+      onChange(targetValue);
+    }
+
+    if (errorType !== null && onError) {
+      onError(errorType);
+    }
+
+    this.setState({
+      latestValue: targetValue,
+      preValue: targetValue,
+      errorType: null,
+    });
+  };
+
+  handleChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    const { minValue, maxValue } = this.props;
+
+    let newValue = HelperUtils.parseInputInt(evt.target.value);
+    let errorType: CurrencyErrorTypeEnum | null = null;
+
+    if (newValue !== null) {
+      if (newValue < minValue) {
+        errorType = CurrencyErrorTypeEnum.MIN;
+      } else if (newValue > maxValue) {
+        errorType = CurrencyErrorTypeEnum.MAX;
+      }
+    }
+
+    this.setState({
+      latestValue: newValue,
+      errorType,
+    });
+  };
+
+  renderError = (): React.ReactNode => {
+    const { errorType } = this.state;
+
+    const { name } = this.props;
+
+    if (errorType === null) {
+      return null;
+    }
+
+    let errorMessage: React.ReactNode;
+    if (errorType === CurrencyErrorTypeEnum.MIN) {
+      errorMessage = `Cannot set ${name} to a negative value.`;
+    }
+    if (errorType === CurrencyErrorTypeEnum.MAX) {
+      errorMessage = `The max amount of ${name} allowed is ${FormatUtils.renderLocaleNumber(
+        CURRENCY_VALUE.MAX
+      )}.`;
+    }
+
+    return (
+      <div className="currency-list-item__error">
+        <div className="currency-list-item__error-text">{errorMessage}</div>
+      </div>
+    );
+  };
+
+  render() {
+    const { latestValue } = this.state;
+    const {
+      name,
+      conversionAmount,
+      conversionType,
+      minValue,
+      maxValue,
+      coinType,
+    } = this.props;
+
+    let clsNames = ["currency-list-item"];
+    if (name) {
+      clsNames.push(`currency-list-item-${FormatUtils.slugify(name)}`);
+    }
+
+    let conversionNode;
+    if (conversionAmount && conversionType) {
+      conversionNode = (
+        <div className="currency-list-item-conversion">
+          = {conversionAmount} {conversionType}
+        </div>
+      );
+    }
+
+    return (
+      <div className={clsNames.join(" ")}>
+        <div className="currency-list-item-row">
+          <div className="currency-list-item-icon">
+            <CoinIcon coinType={coinType} />
+          </div>
+          <div className="currency-list-item-info">
+            <div className="currency-list-item-name">{name}</div>
+            {conversionNode}
+          </div>
+          <div className="currency-list-item-value">
+            <input
+              className="currency-list-item-value-input"
+              type="number"
+              onBlur={this.handleBlur}
+              value={latestValue === null ? "" : latestValue}
+              onChange={this.handleChange}
+              min={minValue}
+              max={maxValue}
+            />
+          </div>
+        </div>
+        {this.renderError()}
+      </div>
+    );
+  }
+}
+
+export default class CurrencyList extends React.PureComponent<
+  {
+    pp: number;
+    gp: number;
+    ep: number;
+    sp: number;
+    cp: number;
+    onChange: (currencies: any) => void;
+    onError?: (currencyName: string, errorType: CurrencyErrorTypeEnum) => void;
+    totalGp: number;
+  },
+  {
+    currencies: {
+      pp: number;
+      gp: number;
+      ep: number;
+      sp: number;
+      cp: number;
+    };
+  }
+> {
+  constructor(props) {
+    super(props);
+
+    const { pp, gp, ep, sp, cp } = props;
+
+    this.state = {
+      currencies: {
+        pp,
+        gp,
+        ep,
+        sp,
+        cp,
+      },
+    };
+  }
+
+  handleCurrencyChange = (currencyKey: string, value: number): void => {
+    const { onChange } = this.props;
+    const { currencies } = this.state;
+
+    const newCurrencies = {
+      ...currencies,
+      [currencyKey]: value,
+    };
+
+    this.setState({
+      currencies: newCurrencies,
+    });
+
+    onChange(newCurrencies);
+  };
+
+  handleCurrencyChangeError = (
+    currencyName: string,
+    errorType: CurrencyErrorTypeEnum
+  ): void => {
+    const { onError } = this.props;
+
+    if (onError) {
+      onError(currencyName, errorType);
+    }
+  };
+
+  render() {
+    const { props } = this;
+    const { pp, gp, ep, sp, cp, totalGp } = props;
+
+    return (
+      <div className="currency-list">
+        <div className="currency-list-gp-total">
+          <div className="currency-list-gp-total-heading">
+            Total Currency in GP
+          </div>
+          <div className="currency-list-gp-total-info">
+            <div className="currency-list-gp-total-icon">
+              <CoinIcon coinType={Constants.CoinTypeEnum.gp} />
+            </div>
+            <div className="currency-list-gp-total-count">
+              {totalGp.toLocaleString ? totalGp.toLocaleString() : totalGp}
+            </div>
+          </div>
+        </div>
+        <div className="currency-list-items">
+          <CurrencyListItem
+            name="Platinum"
+            onChange={this.handleCurrencyChange.bind(this, "pp")}
+            onError={this.handleCurrencyChangeError.bind(this, "Platinum")}
+            value={pp}
+            coinType={Constants.CoinTypeEnum.pp}
+            conversionAmount={10}
+            conversionType="gp"
+          />
+          <CurrencyListItem
+            name="Gold"
+            onChange={this.handleCurrencyChange.bind(this, "gp")}
+            onError={this.handleCurrencyChangeError.bind(this, "Gold")}
+            value={gp}
+            coinType={Constants.CoinTypeEnum.gp}
+            conversionAmount={10}
+            conversionType="sp"
+          />
+          <CurrencyListItem
+            name="Electrum"
+            onChange={this.handleCurrencyChange.bind(this, "ep")}
+            onError={this.handleCurrencyChangeError.bind(this, "Electrum")}
+            value={ep}
+            coinType={Constants.CoinTypeEnum.ep}
+            conversionAmount={5}
+            conversionType="sp"
+          />
+          <CurrencyListItem
+            name="Silver"
+            onChange={this.handleCurrencyChange.bind(this, "sp")}
+            onError={this.handleCurrencyChangeError.bind(this, "Silver")}
+            value={sp}
+            coinType={Constants.CoinTypeEnum.sp}
+            conversionAmount={10}
+            conversionType="cp"
+          />
+          <CurrencyListItem
+            name="Copper"
+            onChange={this.handleCurrencyChange.bind(this, "cp")}
+            onError={this.handleCurrencyChangeError.bind(this, "Copper")}
+            value={cp}
+            coinType={Constants.CoinTypeEnum.cp}
+          />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/legacy/CurrencyList/index.ts b/ddb_main/tools/js/Shared/components/legacy/CurrencyList/index.ts
new file mode 100644
index 0000000..e279675
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/CurrencyList/index.ts
@@ -0,0 +1,4 @@
+import CurrencyList, { CurrencyListItem } from "./CurrencyList";
+
+export default CurrencyList;
+export { CurrencyList, CurrencyListItem };
diff --git a/ddb_main/tools/js/Shared/components/legacy/EquipmentListItem/EquipmentListItem.tsx b/ddb_main/tools/js/Shared/components/legacy/EquipmentListItem/EquipmentListItem.tsx
new file mode 100644
index 0000000..14a1143
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/EquipmentListItem/EquipmentListItem.tsx
@@ -0,0 +1,418 @@
+import React from "react";
+
+import { Button } from "@dndbeyond/character-components/es";
+import {
+  HelperUtils,
+  Item,
+  ItemUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import Collapsible, { CollapsibleHeader } from "../common/Collapsible";
+
+export class EquipmentListItemHeaderAction extends React.PureComponent<{
+  item: Item;
+  heading: any;
+  metaItems: Array<string>;
+  imageUrl: string;
+
+  onUnequip?: (item: Item) => void;
+  onEquip?: (item: Item) => void;
+
+  unequipLabel: string;
+  equipLabel: string;
+}> {
+  static defaultProps = {
+    showHeaderAction: false,
+    consumeLabel: "Consume",
+  };
+
+  handleUnequip = () => {
+    const { onUnequip, item } = this.props;
+
+    if (onUnequip) {
+      onUnequip(item);
+    }
+  };
+
+  handleEquip = () => {
+    const { onEquip, item } = this.props;
+
+    if (onEquip) {
+      onEquip(item);
+    }
+  };
+
+  render() {
+    const { item, heading, imageUrl, metaItems, unequipLabel, equipLabel } =
+      this.props;
+
+    const isEquipped = ItemUtils.isEquipped(item);
+    const isStackable = ItemUtils.isStackable(item);
+    const canEquip = ItemUtils.canEquip(item);
+    const quantity = ItemUtils.getQuantity(item);
+
+    const callout = (
+      <div className="equipment-list-item-callout">
+        {isStackable && (
+          <div className="equipment-list-item-callout-quantity">
+            <span className="equipment-list-item-callout-quantity-extra">
+              Qty
+            </span>
+            <span className="equipment-list-item-callout-quantity-value">
+              {quantity}
+            </span>
+          </div>
+        )}
+        {canEquip && (
+          <div className="equipment-list-item-callout-action">
+            <Button
+              onClick={isEquipped ? this.handleUnequip : this.handleEquip}
+              style={isEquipped ? "" : "outline"}
+              size="small"
+            >
+              {isEquipped ? unequipLabel : equipLabel}
+            </Button>
+          </div>
+        )}
+      </div>
+    );
+
+    return (
+      <CollapsibleHeader
+        imgSrc={imageUrl}
+        heading={heading}
+        metaItems={metaItems}
+        callout={callout}
+      />
+    );
+  }
+}
+
+interface EquipmentListItemProps {
+  item: Item;
+
+  atAttuneMax: boolean;
+
+  showRemove: boolean;
+  showEquip: boolean;
+  showUnequip: boolean;
+  showAttuning: boolean;
+
+  removeLabel: string;
+  removeInfusionLabel: string;
+  unequipLabel: string;
+  equipLabel: string;
+  attuneLabel: string;
+  unattuneLabel: string;
+  consumeLabel: string;
+
+  onRemove?: (item: Item) => void;
+  onRemoveInfusion: (item: Item) => void;
+  onUnequip?: (item: Item) => void;
+  onEquip?: (item: Item) => void;
+  onAttune?: (item: Item) => void;
+  onUnattune?: (item: Item) => void;
+  onQuantitySet: (item: Item, quantity: number) => void;
+}
+interface EquipmentListItemState {
+  quantity: number;
+  newQuantity: number;
+}
+export class EquipmentListItemActions extends React.PureComponent<
+  EquipmentListItemProps,
+  EquipmentListItemState
+> {
+  static defaultProps = {
+    consumeLabel: "Consume",
+    removeLabel: "Remove Item",
+    removeInfusionLabel: "Remove Infusion",
+    unequipLabel: "Unequip",
+    equipLabel: "Equip",
+    attuneLabel: "Attune",
+    unattuneLabel: "Attuned",
+    showRemove: false,
+    showEquip: false,
+    showUnequip: false,
+    showAttuning: false,
+    atAttuneMax: false,
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      quantity: ItemUtils.getQuantity(props.item),
+      newQuantity: ItemUtils.getQuantity(props.item),
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<EquipmentListItemProps>,
+    prevState: Readonly<EquipmentListItemState>,
+    snapshot?: any
+  ): void {
+    const { item } = this.props;
+
+    const nextQuantity = ItemUtils.getQuantity(item);
+    if (nextQuantity !== prevState.quantity) {
+      this.setState({
+        quantity: nextQuantity,
+        newQuantity: nextQuantity,
+      });
+    }
+  }
+
+  handleQuantitySave = (newValue) => {
+    const { onQuantitySet, item } = this.props;
+
+    const quantity = ItemUtils.getQuantity(item);
+    const quantityDiff = newValue - quantity;
+
+    if (quantityDiff === 0) {
+      return;
+    }
+
+    if (onQuantitySet) {
+      onQuantitySet(item, newValue);
+    }
+
+    this.setState((prevState) => ({
+      quantity: newValue,
+      newQuantity: newValue,
+    }));
+  };
+
+  handleAttune = () => {
+    const { onAttune, item } = this.props;
+    if (onAttune) {
+      onAttune(item);
+    }
+  };
+
+  handleUnattune = () => {
+    const { onUnattune, item } = this.props;
+    if (onUnattune) {
+      onUnattune(item);
+    }
+  };
+
+  handleUnequip = () => {
+    const { onUnequip, item } = this.props;
+    if (onUnequip) {
+      onUnequip(item);
+    }
+  };
+
+  handleEquip = () => {
+    const { onEquip, item } = this.props;
+    if (onEquip) {
+      onEquip(item);
+    }
+  };
+
+  handleRemove = () => {
+    const { onRemove, item } = this.props;
+    if (onRemove) {
+      onRemove(item);
+    }
+  };
+
+  handleRemoveInfusion = () => {
+    const { onRemoveInfusion, item } = this.props;
+    if (onRemoveInfusion) {
+      onRemoveInfusion(item);
+    }
+  };
+
+  handleAmountChange = (evt) => {
+    this.setState({
+      newQuantity: evt.target.value,
+    });
+  };
+
+  handleAmountKeyUp = (evt) => {
+    const parsedValue = HelperUtils.parseInputInt(evt.target.value);
+    const clampedValue = HelperUtils.clampInt(parsedValue ? parsedValue : 0, 0);
+
+    if (evt.key === "Enter") {
+      this.handleQuantitySave(clampedValue);
+    }
+  };
+
+  handleAmountBlur = (evt) => {
+    const parsedValue = HelperUtils.parseInputInt(evt.target.value);
+    const clampedValue = HelperUtils.clampInt(parsedValue ? parsedValue : 0, 0);
+
+    this.handleQuantitySave(clampedValue);
+  };
+
+  handleIncrementClick = () => {
+    const { onQuantitySet, item } = this.props;
+
+    this.setState((prevState, props) => {
+      const quantity = prevState.quantity + 1;
+      if (onQuantitySet) {
+        onQuantitySet(item, quantity);
+      }
+
+      return {
+        quantity,
+        newQuantity: quantity,
+      };
+    });
+  };
+
+  handleDecrementClick = () => {
+    const { onQuantitySet, item } = this.props;
+
+    this.setState((prevState, props) => {
+      const quantity = prevState.quantity - 1;
+      if (onQuantitySet) {
+        onQuantitySet(item, quantity);
+      }
+
+      return {
+        quantity: Math.max(prevState.quantity - 1, 0),
+        newQuantity: Math.max(prevState.quantity - 1, 0),
+      };
+    });
+  };
+
+  render() {
+    const { quantity, newQuantity } = this.state;
+    const {
+      item,
+      removeLabel,
+      removeInfusionLabel,
+      unequipLabel,
+      equipLabel,
+      attuneLabel,
+      unattuneLabel,
+      showRemove,
+      showEquip,
+      showUnequip,
+      showAttuning,
+      atAttuneMax,
+    } = this.props;
+
+    const hasActions = showRemove || showEquip || showUnequip || showAttuning;
+
+    if (!hasActions) {
+      return null;
+    }
+
+    const isEquipped = ItemUtils.isEquipped(item);
+    const isAttuned = ItemUtils.isAttuned(item);
+    const isStackable = ItemUtils.isStackable(item);
+    const canAttune = ItemUtils.canAttune(item);
+    const canEquip = ItemUtils.canEquip(item);
+    const infusion = ItemUtils.getInfusion(item);
+
+    return (
+      <div className="equipment-list-item-actions">
+        {isStackable && (
+          <div className="equipment-list-item-amount">
+            <div className="equipment-list-item-amount-label">
+              Total Quantity
+            </div>
+            <div className="equipment-list-item-amount-controls">
+              <div className="equipment-list-item-amount-decrease">
+                <Button
+                  clsNames={["button-action-decrease"]}
+                  onClick={this.handleDecrementClick}
+                  disabled={quantity === 0}
+                />
+              </div>
+              <div className="equipment-list-item-amount-value">
+                <input
+                  type="number"
+                  value={newQuantity}
+                  className="character-input equipment-list-item-amount-input"
+                  onChange={this.handleAmountChange}
+                  onBlur={this.handleAmountBlur}
+                  onKeyUp={this.handleAmountKeyUp}
+                  min={0}
+                />
+              </div>
+              <div className="equipment-list-item-amount-increase">
+                <Button
+                  clsNames={["button-action-increase"]}
+                  onClick={this.handleIncrementClick}
+                />
+              </div>
+            </div>
+          </div>
+        )}
+        {canEquip && showEquip && showUnequip && (
+          <Button
+            onClick={isEquipped ? this.handleUnequip : this.handleEquip}
+            style={isEquipped ? "" : "outline"}
+            size="small"
+          >
+            {isEquipped ? unequipLabel : equipLabel}
+          </Button>
+        )}
+        {canEquip && showEquip && !showUnequip && (
+          <Button onClick={this.handleEquip} style={"outline"} size="small">
+            {equipLabel}
+          </Button>
+        )}
+        {canEquip && !showEquip && showUnequip && (
+          <Button onClick={this.handleUnequip} style={"outline"} size="small">
+            {unequipLabel}
+          </Button>
+        )}
+        {canAttune && showAttuning && (
+          <Button
+            onClick={isAttuned ? this.handleUnattune : this.handleAttune}
+            style={isAttuned ? "" : "outline"}
+            size="small"
+            disabled={atAttuneMax && !isAttuned}
+          >
+            {isAttuned ? unattuneLabel : attuneLabel}
+          </Button>
+        )}
+        {infusion && (
+          <div
+            className="equipment-list-item-remove"
+            onClick={this.handleRemoveInfusion}
+            data-testid="remove-infusion-button"
+          >
+            <span className="equipment-list-item-remove-icon" />{" "}
+            {removeInfusionLabel}
+          </div>
+        )}
+        {showRemove && !infusion && (
+          <div
+            className="equipment-list-item-remove"
+            onClick={this.handleRemove}
+          >
+            <span className="equipment-list-item-remove-icon" /> {removeLabel}
+          </div>
+        )}
+      </div>
+    );
+  }
+}
+
+export default class EquipmentListItem extends React.PureComponent<{
+  header: any;
+  clsNames: Array<string>;
+}> {
+  static defaultProps = {
+    clsNames: [],
+  };
+
+  render() {
+    let { header, children, clsNames } = this.props;
+
+    return (
+      <Collapsible
+        trigger={header}
+        clsNames={["equipment-list-item", ...clsNames]}
+      >
+        {children}
+      </Collapsible>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/legacy/EquipmentListItem/index.ts b/ddb_main/tools/js/Shared/components/legacy/EquipmentListItem/index.ts
new file mode 100644
index 0000000..9eafe7f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/EquipmentListItem/index.ts
@@ -0,0 +1,11 @@
+import EquipmentListItem, {
+  EquipmentListItemActions,
+  EquipmentListItemHeaderAction,
+} from "./EquipmentListItem";
+
+export default EquipmentListItem;
+export {
+  EquipmentListItem,
+  EquipmentListItemActions,
+  EquipmentListItemHeaderAction,
+};
diff --git a/ddb_main/tools/js/Shared/components/legacy/EquipmentManagerShop/EquipmentManagerShop.tsx b/ddb_main/tools/js/Shared/components/legacy/EquipmentManagerShop/EquipmentManagerShop.tsx
new file mode 100644
index 0000000..7c5c740
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/EquipmentManagerShop/EquipmentManagerShop.tsx
@@ -0,0 +1,581 @@
+import axios, { Canceler } from "axios";
+import React from "react";
+
+import { LoadingPlaceholder, Button } from "@dndbeyond/character-components/es";
+import {
+  BaseItemDefinitionContract,
+  HelperUtils,
+  Item,
+  ItemUtils,
+  Modifier,
+  RuleData,
+  RuleDataUtils,
+  TypeValueLookup,
+  CharacterTheme,
+  InventoryManager,
+  ContainerManager,
+  ItemManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemFilter } from "~/components/ItemFilter";
+import { ItemName } from "~/components/ItemName";
+import { LegacyBadge } from "~/components/LegacyBadge";
+
+import { AppLoggerUtils } from "../../../utils";
+import ItemDetail from "../../ItemDetail";
+import EquipmentListItem from "../EquipmentListItem";
+import { CollapsibleHeader, CollapsibleHeading } from "../common/Collapsible";
+
+//TODO: This component should be removed and replaced with the EquipmentShop component
+export class EquipmentManagerShopItem extends React.PureComponent<
+  {
+    item: Item;
+    onItemAdd: (
+      item: Item,
+      amount: number,
+      containerDefinitionKey: string
+    ) => void;
+    minAddAmount: number;
+    maxAddAmount: number;
+    ruleData: RuleData;
+    proficiencyBonus: number;
+    containerDefinitionKey: string;
+    theme: CharacterTheme;
+  },
+  {
+    amount: number | null;
+  }
+> {
+  static defaultProps = {
+    enableAdd: true,
+    minAddAmount: 1,
+    maxAddAmount: 10,
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      amount: 1,
+    };
+  }
+
+  handleAmountChange = (evt) => {
+    this.setState({
+      amount: evt.target.value,
+    });
+  };
+
+  handleAmountBlur = (evt) => {
+    const { minAddAmount, maxAddAmount } = this.props;
+
+    const parsedValue = HelperUtils.parseInputInt(evt.target.value);
+    let clampedValue: number | null = null;
+    if (parsedValue) {
+      clampedValue = HelperUtils.clampInt(
+        parsedValue,
+        minAddAmount,
+        maxAddAmount
+      );
+    }
+
+    this.setState({
+      amount: clampedValue,
+    });
+  };
+
+  handleDecrementCountClick = () => {
+    const { minAddAmount } = this.props;
+
+    this.setState((prevState, props) => ({
+      amount: Math.max(
+        (prevState.amount === null ? 0 : prevState.amount) - 1,
+        minAddAmount
+      ),
+    }));
+  };
+
+  handleIncrementCountClick = () => {
+    this.setState((prevState, props) => ({
+      amount: (prevState.amount === null ? 0 : prevState.amount) + 1,
+    }));
+  };
+
+  handleAdd = () => {
+    const { amount } = this.state;
+    const { item, onItemAdd, minAddAmount, containerDefinitionKey } =
+      this.props;
+
+    onItemAdd(
+      item,
+      amount === null ? minAddAmount : amount,
+      containerDefinitionKey
+    );
+  };
+
+  renderButtons = () => {
+    const { item } = this.props;
+
+    return (
+      <div className="equipment-list-header-actions">
+        <Button size="small" onClick={this.handleAdd}>
+          Add
+        </Button>
+      </div>
+    );
+  };
+
+  renderHeader(item, metaItems, defaultImageUrl) {
+    const { theme } = this.props;
+    const { canAttune, avatarUrl } = item.definition;
+    const isLegacy = ItemUtils.isLegacy(item);
+
+    const heading = (
+      <CollapsibleHeading>
+        <div className="equipment-list-heading">
+          <span className="equipment-list-heading-text">
+            <ItemName item={item} />
+          </span>
+          <span className="equipment-list-heading-icons">
+            {canAttune ? (
+              <i className="equipment-list-heading-icon i-req-attunement" />
+            ) : (
+              ""
+            )}
+          </span>
+          {isLegacy && <LegacyBadge variant="margin-left" />}
+        </div>
+      </CollapsibleHeading>
+    );
+
+    let imageUrl = avatarUrl;
+    if (!imageUrl) {
+      imageUrl = defaultImageUrl;
+    }
+
+    return (
+      <CollapsibleHeader
+        imgSrc={imageUrl ? imageUrl : ""}
+        heading={heading}
+        metaItems={metaItems}
+        callout={this.renderButtons()}
+      />
+    );
+  }
+
+  render() {
+    const { amount } = this.state;
+    const {
+      item,
+      minAddAmount,
+      maxAddAmount,
+      ruleData,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    let metaItems = [ItemUtils.getType(item)];
+    let defaultImageUrl: string | null = null;
+
+    if (ItemUtils.isWeaponContract(item)) {
+      defaultImageUrl = RuleDataUtils.getDefaultWeaponImageUrl(ruleData);
+    } else if (ItemUtils.isGearContract(item)) {
+      const subType = ItemUtils.getSubType(item);
+      if (subType) {
+        metaItems.push(subType);
+      }
+
+      defaultImageUrl = RuleDataUtils.getDefaultGearImageUrl(ruleData);
+    } else if (ItemUtils.isArmorContract(item)) {
+      const baseArmorName = ItemUtils.getBaseArmorName(item);
+      if (baseArmorName) {
+        metaItems.push(baseArmorName);
+      }
+
+      defaultImageUrl = RuleDataUtils.getDefaultArmorImageUrl(ruleData);
+    }
+
+    const totalAmount: number =
+      (amount === null ? 1 : amount) * ItemUtils.getBundleSize(item);
+
+    return (
+      <EquipmentListItem
+        header={this.renderHeader(item, metaItems, defaultImageUrl)}
+      >
+        <ItemDetail
+          theme={theme}
+          item={item}
+          ruleData={ruleData}
+          showCustomize={false}
+          showActions={false}
+          proficiencyBonus={proficiencyBonus}
+        />
+        <div className="equipment-list-item-actions">
+          <div className="equipment-list-item-action">
+            <div className="equipment-list-item-amount">
+              <div className="equipment-list-item-amount-label">
+                Amount to add
+              </div>
+              <div className="equipment-list-item-amount-controls">
+                <div className="equipment-list-item-amount-decrease">
+                  <Button
+                    clsNames={["button-action-decrease"]}
+                    onClick={this.handleDecrementCountClick}
+                    disabled={amount !== null && amount <= minAddAmount}
+                  />
+                </div>
+                <div className="equipment-list-item-amount-value">
+                  <input
+                    type="number"
+                    value={amount === null ? "" : amount}
+                    className="character-input equipment-list-item-amount-input"
+                    onChange={this.handleAmountChange}
+                    onBlur={this.handleAmountBlur}
+                    min={minAddAmount}
+                    max={maxAddAmount}
+                  />
+                </div>
+                <div className="equipment-list-item-amount-increase">
+                  <Button
+                    clsNames={["button-action-increase"]}
+                    onClick={this.handleIncrementCountClick}
+                    disabled={amount !== null && amount >= maxAddAmount}
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div className="equipment-list-item-action">
+            <Button onClick={this.handleAdd}>
+              Add {totalAmount === 1 ? " Item" : ` ${totalAmount} Items`}
+            </Button>
+          </div>
+        </div>
+      </EquipmentListItem>
+    );
+  }
+}
+
+interface EquipmentManagerShopProps {
+  globalModifiers: Array<Modifier>;
+  valueLookupByType: TypeValueLookup;
+  pageSize: number;
+  onItemAdd: (
+    item: Item,
+    amount: number,
+    containerDefinitionKey: string
+  ) => void;
+  ruleData: RuleData;
+  proficiencyBonus: number;
+  containerDefinitionKey: string;
+  theme: CharacterTheme;
+  activeSourceCategories: Array<number>;
+  inventoryManager: InventoryManager;
+}
+interface EquipmentManagerShopState {
+  query: string;
+  filteredItems: Array<Item>;
+  currentPage: number;
+  loading: boolean;
+  loaded: boolean;
+  filterTypes: Array<string>;
+  filterQuery: string;
+  filterProficient: boolean;
+  filterBasic: boolean;
+  filterMagic: boolean;
+  filterContainer: boolean;
+  filterSourceCategories: Array<number>;
+  shoppeContainer: ContainerManager | null;
+}
+export default class EquipmentManagerShop extends React.PureComponent<
+  EquipmentManagerShopProps,
+  EquipmentManagerShopState
+> {
+  static defaultProps = {
+    pageSize: 30,
+  };
+
+  loadItemsCanceler: null | Canceler = null;
+
+  constructor(props) {
+    super(props);
+
+    const { items } = props;
+
+    this.state = {
+      query: "",
+      filteredItems: items,
+      currentPage: 0,
+      loading: false,
+      loaded: false,
+      filterTypes: [],
+      filterQuery: "",
+      filterProficient: false,
+      filterBasic: false,
+      filterMagic: false,
+      filterContainer: false,
+      filterSourceCategories: [],
+      shoppeContainer: null,
+    };
+  }
+
+  componentDidMount() {
+    const { inventoryManager } = this.props;
+
+    if (inventoryManager) {
+      this.setState({
+        loading: true,
+      });
+
+      inventoryManager
+        .getInventoryShoppe({
+          onSuccess: (shoppeContainer: ContainerManager) => {
+            this.setState({
+              shoppeContainer,
+              loading: false,
+              loaded: true,
+            });
+          },
+          additionalApiConfig: {
+            cancelToken: new axios.CancelToken((c) => {
+              this.loadItemsCanceler = c;
+            }),
+          },
+        })
+        .then((res) => {
+          this.loadItemsCanceler = null;
+          return res;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    } else {
+      this.setState({
+        loaded: true,
+      });
+    }
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadItemsCanceler !== null) {
+      this.loadItemsCanceler();
+    }
+  }
+
+  getLastPageIdx = (filteredItems) => {
+    const { pageSize } = this.props;
+
+    return Math.ceil(filteredItems.length / pageSize) - 1;
+  };
+
+  handlePageMore = () => {
+    this.setState((prevState) => ({
+      currentPage: prevState.currentPage + 1,
+    }));
+  };
+
+  handleQueryChange = (evt) => {
+    const query = evt.target.value;
+
+    this.setState({
+      filterQuery: query,
+      currentPage: 0,
+    });
+  };
+
+  handleFilterItemType = (type) => {
+    this.setState((prevState) => ({
+      filterTypes: prevState.filterTypes.includes(type)
+        ? prevState.filterTypes.filter((t) => t !== type)
+        : [...prevState.filterTypes, type],
+      currentPage: 0,
+    }));
+  };
+
+  handleSourceCategoryClick = (categoryId: number) => {
+    this.setState((prevState) => ({
+      filterSourceCategories: prevState.filterSourceCategories.includes(
+        categoryId
+      )
+        ? prevState.filterSourceCategories.filter((cat) => cat !== categoryId)
+        : [...prevState.filterSourceCategories, categoryId],
+    }));
+  };
+
+  handleToggleFilter = (type: string): void => {
+    switch (type) {
+      case "Proficient":
+        this.handleProficientToggle();
+        break;
+      case "Common":
+        this.handleBasicToggle();
+        break;
+      case "Magical":
+        this.handleMagicToggle();
+        break;
+      case "Container":
+        this.handleContainerToggle();
+        break;
+      default:
+    }
+  };
+
+  handleProficientToggle = () => {
+    this.setState((prevState) => ({
+      filterProficient: !prevState.filterProficient,
+      currentPage: 0,
+    }));
+  };
+
+  handleBasicToggle = () => {
+    this.setState((prevState) => ({
+      filterBasic: !prevState.filterBasic,
+      currentPage: 0,
+    }));
+  };
+
+  handleMagicToggle = () => {
+    this.setState((prevState) => ({
+      filterMagic: !prevState.filterMagic,
+      currentPage: 0,
+    }));
+  };
+
+  handleContainerToggle = (): void => {
+    this.setState((prevState) => ({
+      filterContainer: !prevState.filterContainer,
+      currentPage: 0,
+    }));
+  };
+
+  renderPager = (
+    filteredItems: Array<ItemManager>,
+    totalItems: number
+  ): React.ReactNode => {
+    if (filteredItems.length >= totalItems) {
+      return null;
+    }
+
+    return (
+      <div className="equipment-manager-shop-pager">
+        <Button block={true} onClick={this.handlePageMore}>
+          Load More
+        </Button>
+      </div>
+    );
+  };
+
+  renderPagedListing = (filteredItems: Array<ItemManager>): React.ReactNode => {
+    const { currentPage } = this.state;
+    const {
+      pageSize,
+      onItemAdd,
+      ruleData,
+      proficiencyBonus,
+      containerDefinitionKey,
+      theme,
+    } = this.props;
+
+    const pagedFilteredItems: Array<ItemManager> = filteredItems.slice(
+      0,
+      (currentPage + 1) * pageSize
+    );
+
+    return (
+      <div className="equipment-manager-shop-items">
+        {pagedFilteredItems.length ? (
+          pagedFilteredItems.map((item, idx) => (
+            <EquipmentManagerShopItem
+              theme={theme}
+              item={item.getItem()}
+              key={`${item.getMappingId()}-${idx}`}
+              onItemAdd={onItemAdd}
+              ruleData={ruleData}
+              proficiencyBonus={proficiencyBonus}
+              containerDefinitionKey={containerDefinitionKey}
+            />
+          ))
+        ) : (
+          <div className="equipment-manager-shop-no-results">
+            No Results Found
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  renderUi = () => {
+    const {
+      filterTypes,
+      filterQuery,
+      filterProficient,
+      filterBasic,
+      filterMagic,
+      filterContainer,
+      filterSourceCategories,
+      currentPage,
+    } = this.state;
+    const { pageSize } = this.props;
+
+    const itemData = this.state.shoppeContainer?.getInventoryItems({
+      filterOptions: {
+        filterTypes,
+        filterQuery,
+        filterProficient,
+        filterBasic,
+        filterMagic,
+        filterContainer,
+        filterSourceCategories,
+      },
+      paginationOptions: {
+        currentPage,
+        pageSize,
+      },
+      isShoppe: true,
+    });
+
+    const items = itemData?.items ?? [];
+    const totalItems = itemData?.totalItems ?? 0;
+    const sourceCategories = itemData?.sourceCategories || [];
+
+    return (
+      <div>
+        <ItemFilter
+          sourceCategories={sourceCategories}
+          filterQuery={filterQuery}
+          onQueryChange={(value) =>
+            this.setState({
+              filterQuery: value,
+            })
+          }
+          filterTypes={filterTypes}
+          onFilterButtonClick={this.handleFilterItemType}
+          onCheckboxChange={this.handleToggleFilter}
+          onSourceCategoryClick={this.handleSourceCategoryClick}
+          filterSourceCategories={filterSourceCategories}
+          filterProficient={filterProficient}
+          filterBasic={filterBasic}
+          filterMagic={filterMagic}
+          filterContainer={filterContainer}
+          buttonSize="x-small"
+          filterStyle="builder"
+        />
+        {this.renderPagedListing(items)}
+        {this.renderPager(items, totalItems)}
+      </div>
+    );
+  };
+
+  renderLoading = () => {
+    return <LoadingPlaceholder />;
+  };
+
+  render() {
+    const { loaded, loading } = this.state;
+
+    return (
+      <div className="equipment-manager-shop">
+        {loading && this.renderLoading()}
+        {!loading && loaded && this.renderUi()}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/legacy/EquipmentManagerShop/index.ts b/ddb_main/tools/js/Shared/components/legacy/EquipmentManagerShop/index.ts
new file mode 100644
index 0000000..8c5c618
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/EquipmentManagerShop/index.ts
@@ -0,0 +1,6 @@
+import EquipmentManagerShop, {
+  EquipmentManagerShopItem,
+} from "./EquipmentManagerShop";
+
+export default EquipmentManagerShop;
+export { EquipmentManagerShop, EquipmentManagerShopItem };
diff --git a/ddb_main/tools/js/Shared/components/legacy/GearList/GearList.tsx b/ddb_main/tools/js/Shared/components/legacy/GearList/GearList.tsx
new file mode 100644
index 0000000..7499007
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/GearList/GearList.tsx
@@ -0,0 +1,89 @@
+import { FC } from "react";
+
+import { Accordion } from "~/components/Accordion";
+import { ItemName } from "~/components/ItemName";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { EquipmentActions } from "~/subApps/builder/components/EquipmentActions";
+import { useEquipmentMethods } from "~/subApps/builder/hooks/useEquipmentMethods";
+import { Item } from "~/types";
+
+import ItemDetail from "../../ItemDetail";
+import { ItemListInformationCollapsible } from "../../ItemListInformationCollapsible";
+import { EquipmentListItemActions } from "../EquipmentListItem";
+
+interface GearListProps {
+  item: Item;
+  unequipLabel: string;
+  equipLabel: string;
+  showRemove?: boolean;
+  showEquip?: boolean;
+  showUnequip?: boolean;
+  showAttuning?: boolean;
+  showHeaderAction: boolean;
+}
+
+export const GearListItem: FC<GearListProps> = ({
+  item,
+  equipLabel,
+  unequipLabel,
+  ...props
+}) => {
+  const {
+    ruleData,
+    proficiencyBonus,
+    characterTheme,
+    itemUtils,
+    helperUtils,
+    containerLookup,
+  } = useCharacterEngine();
+  const actions = useEquipmentMethods();
+  const image = itemUtils.getAvatarUrl(item);
+  const altText = itemUtils.getName(item);
+  const container = helperUtils.lookupDataOrFallback(
+    containerLookup,
+    itemUtils.getContainerDefinitionKey(item)
+  );
+
+  const getMetaItems = () => {
+    const { isCustomized } = item;
+    const type = itemUtils.getType(item);
+    const subType = itemUtils.getSubType(item);
+    const isOffhand = itemUtils.isOffhand(item);
+
+    return [
+      ...(type ? [type] : []),
+      ...(subType ? [subType] : []),
+      ...(isOffhand ? ["Dual Wield"] : []),
+      ...(isCustomized ? ["Customized"] : []),
+    ];
+  };
+
+  return (
+    <Accordion
+      summary={<ItemName item={item} showLegacyBadge={true} />}
+      summaryAction={
+        <EquipmentActions
+          item={item}
+          equipLabel={equipLabel}
+          unequipLabel={unequipLabel}
+        />
+      }
+      summaryImage={image}
+      summaryImageAlt={altText}
+      summaryMetaItems={getMetaItems()}
+      variant="paper"
+    >
+      <ItemListInformationCollapsible ruleData={ruleData} item={item} />
+      <ItemDetail
+        container={container}
+        theme={characterTheme}
+        item={item}
+        ruleData={ruleData}
+        showCustomize={false}
+        showActions={false}
+        proficiencyBonus={proficiencyBonus}
+      />
+      <EquipmentListItemActions item={item} {...actions} {...props} />
+    </Accordion>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/components/legacy/SpellList/SpellList.tsx b/ddb_main/tools/js/Shared/components/legacy/SpellList/SpellList.tsx
new file mode 100644
index 0000000..5f575aa
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/SpellList/SpellList.tsx
@@ -0,0 +1,203 @@
+import React from "react";
+
+import {
+  CharacterTheme,
+  Constants,
+  DataOriginRefData,
+  EntityUtils,
+  FormatUtils,
+  RuleData,
+  Spell,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Accordion } from "~/components/Accordion";
+import { SpellName } from "~/components/SpellName";
+
+import SpellDetail from "../../SpellDetail";
+import styles from "./styles.module.css";
+
+export class SpellListItem extends React.PureComponent<
+  {
+    spell: Spell;
+    castAsRitual: boolean;
+    footerNode?: any;
+    spellCasterInfo: any;
+    ruleData: RuleData;
+    dataOriginRefData: DataOriginRefData;
+    proficiencyBonus: number;
+    theme: CharacterTheme;
+  },
+  {
+    customizeCollapsed: boolean;
+  }
+> {
+  static defaultProps = {
+    castAsRitual: false,
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      customizeCollapsed: true,
+    };
+  }
+
+  getActions = () => {
+    const { spell, ruleData } = this.props;
+    const { toHit, attackSaveValue } = spell;
+    const requiresAttackRoll = SpellUtils.getRequiresAttackRoll(spell);
+    const requiresSavingThrow = SpellUtils.getRequiresSavingThrow(spell);
+
+    if (requiresAttackRoll && toHit !== null) {
+      return (
+        <p className={styles.callout}>
+          <span>To Hit</span>
+          <span>{FormatUtils.renderSignedNumber(toHit)}</span>
+        </p>
+      );
+    }
+
+    if (requiresSavingThrow) {
+      return (
+        <p className={styles.callout}>
+          <span>{SpellUtils.getSaveDcAbilityKey(spell, ruleData)}</span>
+          <span>{attackSaveValue}</span>
+        </p>
+      );
+    }
+  };
+
+  getMetaItems = () => {
+    const { spell, dataOriginRefData } = this.props;
+    const level = SpellUtils.getLevel(spell);
+    const concentration = SpellUtils.getConcentration(spell);
+    const rangeArea = SpellUtils.getDefinitionRangeArea(spell);
+    const attackType = SpellUtils.getAttackType(spell);
+
+    let metaItems: Array<string> = [];
+    metaItems.push(FormatUtils.renderSpellLevelName(level));
+    let expandedDataOriginRef = SpellUtils.getExpandedDataOriginRef(spell);
+    if (expandedDataOriginRef !== null)
+      metaItems.push(
+        EntityUtils.getDataOriginRefName(
+          expandedDataOriginRef,
+          dataOriginRefData
+        )
+      );
+    if (concentration) metaItems.push("Concentration");
+    if (rangeArea)
+      metaItems.push(
+        attackType && attackType === Constants.AttackTypeRangeEnum.RANGED
+          ? `Range ${rangeArea}`
+          : rangeArea
+      );
+
+    return metaItems;
+  };
+
+  render() {
+    const { customizeCollapsed } = this.state;
+    const {
+      spell,
+      castAsRitual,
+      footerNode,
+      spellCasterInfo,
+      ruleData,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    let clsNames = ["attack-list-customize-header"];
+    if (customizeCollapsed) {
+      clsNames.push("attack-list-customize-header-closed");
+    } else {
+      clsNames.push("attack-list-customize-header-opened");
+    }
+    const school = SpellUtils.getSchool(spell);
+    const spellImage = `https://www.dndbeyond.com/Content/Skins/Waterdeep/images/spell-schools/35/${school?.toLowerCase()}.png`;
+
+    return (
+      <Accordion
+        className={styles.spell}
+        summary={
+          <SpellName
+            spell={spell}
+            showSpellLevel={false}
+            showLegacyBadge={true}
+          />
+        }
+        summaryAction={this.getActions()}
+        summaryImage={spellImage}
+        summaryImageAlt={`Icon for the ${school} school of magic`}
+        summaryMetaItems={this.getMetaItems()}
+        variant="paper"
+      >
+        <SpellDetail
+          theme={theme}
+          spell={spell}
+          castAsRitual={castAsRitual}
+          spellCasterInfo={spellCasterInfo}
+          enableCaster={false}
+          ruleData={ruleData}
+          showCustomize={false}
+          showActions={false}
+          proficiencyBonus={proficiencyBonus}
+        />
+        {footerNode}
+      </Accordion>
+    );
+  }
+}
+
+export default class SpellList extends React.PureComponent<{
+  spells: Array<Spell>;
+  hideRemaining: boolean;
+  castAsRitual: boolean;
+  spellCasterInfo: any;
+  ruleData: RuleData;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}> {
+  static defaultProps = {
+    hideRemaining: false,
+    castAsRitual: false,
+  };
+
+  render() {
+    const {
+      spells,
+      castAsRitual,
+      spellCasterInfo,
+      ruleData,
+      dataOriginRefData,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    if (!spells.length) {
+      return null;
+    }
+
+    return (
+      <div className="spell-list">
+        <div className="spell-list-items">
+          {spells.map((spell) => (
+            <SpellListItem
+              theme={theme}
+              spell={spell}
+              key={`${spell.id}-${SpellUtils.getId(spell)}`}
+              castAsRitual={castAsRitual}
+              spellCasterInfo={spellCasterInfo}
+              ruleData={ruleData}
+              dataOriginRefData={dataOriginRefData}
+              proficiencyBonus={proficiencyBonus}
+            />
+          ))}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/legacy/SpellManagerGroup/SpellManagerGroup.tsx b/ddb_main/tools/js/Shared/components/legacy/SpellManagerGroup/SpellManagerGroup.tsx
new file mode 100644
index 0000000..7fc7a54
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/SpellManagerGroup/SpellManagerGroup.tsx
@@ -0,0 +1,614 @@
+import axios, { Canceler } from "axios";
+import sortBy from "lodash/sortBy";
+import React from "react";
+
+import {
+  Button,
+  LoadingPlaceholder,
+  TypeScriptUtils,
+} from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterUtils,
+  BaseSpellContract,
+  CharacterTheme,
+  Constants,
+  DataOriginRefData,
+  EntityUtils,
+  FormatUtils,
+  HelperUtils,
+  RuleData,
+  RuleDataUtils,
+  SourceUtils,
+  Spell,
+  SpellCasterInfo,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/";
+
+import { Accordion } from "~/components/Accordion";
+import { Link } from "~/components/Link";
+import { SpellFilter } from "~/components/SpellFilter";
+import { SpellName } from "~/components/SpellName";
+
+import DataLoadingStatusEnum from "../../../constants/DataLoadingStatusEnum";
+import {
+  ApiSpellsPromise,
+  ApiSpellsRequest,
+} from "../../../selectors/composite/apiCreator";
+import { AppLoggerUtils, FilterUtils } from "../../../utils";
+import SpellDetail from "../../SpellDetail";
+import styles from "./styles.module.css";
+
+export class SpellManagerGroupItem extends React.PureComponent<{
+  spell: Spell;
+  spellCasterInfo: any;
+  ruleData: RuleData;
+  dataOriginRefData: DataOriginRefData;
+  enableRemove: boolean;
+  enableSpellRemove: boolean;
+  enableAdd: boolean;
+  enablePrepare: boolean;
+  enableUnprepare: boolean;
+  isPrepareMaxed: boolean;
+  isCantripsKnownMaxed: boolean;
+  isSpellsKnownMaxed: boolean;
+  addButtonText: string;
+  removeButtonText: string;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  onPrepare: (spell: Spell) => void;
+  onUnprepare: (spell: Spell) => void;
+  onAdd: (spell: Spell) => void;
+  onRemove: (spell: Spell) => void;
+}> {
+  static defaultProps = {
+    enableRemove: true,
+    enableSpellRemove: true,
+    enableAdd: true,
+    enablePrepare: true,
+    enableUnprepare: true,
+  };
+
+  handlePrepareToggle = () => {
+    const { spell, onPrepare, onUnprepare } = this.props;
+
+    if (spell.prepared) {
+      onUnprepare(spell);
+    } else {
+      onPrepare(spell);
+    }
+  };
+
+  handleRemove = (evt) => {
+    const { spell, onRemove } = this.props;
+
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    onRemove(spell);
+  };
+
+  handleAdd = () => {
+    const { spell, onAdd } = this.props;
+    onAdd(spell);
+  };
+
+  renderButtons = (clsNames, includeRemove) => {
+    const {
+      spell,
+      isPrepareMaxed,
+      isCantripsKnownMaxed,
+      isSpellsKnownMaxed,
+      enableRemove,
+      enableAdd,
+      enablePrepare,
+    } = this.props;
+    let { addButtonText, removeButtonText } = this.props;
+    const { alwaysPrepared, canRemove, canPrepare, canAdd } = spell;
+
+    let isAddDisabled = false;
+    if (SpellUtils.getLevel(spell) === 0 && isCantripsKnownMaxed) {
+      isAddDisabled = true;
+    }
+    if (SpellUtils.getLevel(spell) > 0 && isSpellsKnownMaxed) {
+      isAddDisabled = true;
+    }
+
+    let showAlwaysPrepared =
+      (!includeRemove && alwaysPrepared) ||
+      (includeRemove && !canRemove && alwaysPrepared);
+
+    if (SpellUtils.isCantrip(spell)) {
+      addButtonText =
+        Constants.SpellCastingLearningStyleAddText[
+          Constants.SpellCastingLearningStyle.Learned
+        ];
+      removeButtonText =
+        Constants.SpellCastingLearningStyleRemoveText[
+          Constants.SpellCastingLearningStyle.Learned
+        ];
+    }
+
+    return (
+      <div className={clsNames.join(" ")}>
+        {showAlwaysPrepared && (
+          <div className="spell-manager-item-always-prepared">
+            Always Prepared
+          </div>
+        )}
+        {!alwaysPrepared && enablePrepare && canPrepare && (
+          <Button
+            size="small"
+            disabled={isPrepareMaxed && !spell.prepared}
+            style={spell.prepared ? "" : "outline"}
+            onClick={this.handlePrepareToggle}
+          >
+            {spell.prepared ? removeButtonText : addButtonText}
+          </Button>
+        )}
+        {includeRemove && enableRemove && canRemove && (
+          <div
+            className="spell-manager-spell-remove"
+            onClick={this.handleRemove}
+          >
+            <span className="spell-manager-spell-remove-icon" />{" "}
+            {removeButtonText}
+          </div>
+        )}
+        {enableAdd && canAdd && (
+          <Button
+            size="small"
+            onClick={this.handleAdd}
+            disabled={isAddDisabled}
+            style={"outline"}
+          >
+            {addButtonText}
+          </Button>
+        )}
+      </div>
+    );
+  };
+
+  getMetaItems = () => {
+    const { spell, dataOriginRefData } = this.props;
+    const level = SpellUtils.getLevel(spell);
+    const concentration = SpellUtils.getConcentration(spell);
+    const rangeArea = SpellUtils.getDefinitionRangeArea(spell);
+    const attackType = SpellUtils.getAttackType(spell);
+
+    let metaItems: Array<string> = [];
+    metaItems.push(FormatUtils.renderSpellLevelName(level));
+    let expandedDataOriginRef = SpellUtils.getExpandedDataOriginRef(spell);
+    if (expandedDataOriginRef !== null) {
+      metaItems.push(
+        EntityUtils.getDataOriginRefName(
+          expandedDataOriginRef,
+          dataOriginRefData
+        )
+      );
+    }
+    if (concentration) {
+      metaItems.push("Concentration");
+    }
+    if (rangeArea) {
+      metaItems.push(
+        attackType && attackType === Constants.AttackTypeRangeEnum.RANGED
+          ? `Range ${rangeArea}`
+          : rangeArea
+      );
+    }
+    return metaItems;
+  };
+
+  render() {
+    const {
+      spell,
+      spellCasterInfo,
+      ruleData,
+      isPrepareMaxed,
+      proficiencyBonus,
+      theme,
+      enableSpellRemove,
+    } = this.props;
+    const school = SpellUtils.getSchool(spell);
+    const spellImage = `https://www.dndbeyond.com/Content/Skins/Waterdeep/images/spell-schools/35/${school?.toLowerCase()}.png`;
+
+    return (
+      <Accordion
+        className={styles.spell}
+        summary={
+          <SpellName
+            spell={spell}
+            showSpellLevel={false}
+            showLegacyBadge={true}
+          />
+        }
+        summaryAction={this.renderButtons(
+          ["spell-list-item-header-actions"],
+          enableSpellRemove
+        )}
+        summaryImage={spellImage}
+        summaryImageAlt={`Icon for the ${school} school of magic`}
+        summaryMetaItems={this.getMetaItems()}
+        variant="paper"
+      >
+        <SpellDetail
+          theme={theme}
+          spell={spell}
+          isPreparedMaxed={isPrepareMaxed}
+          enableCaster={false}
+          spellCasterInfo={spellCasterInfo}
+          ruleData={ruleData}
+          showActions={false}
+          showCustomize={false}
+          proficiencyBonus={proficiencyBonus}
+        />
+        <div className="spell-list-item-actions">
+          {this.renderButtons(["spell-list-item-content-actions"], true)}
+        </div>
+      </Accordion>
+    );
+  }
+}
+
+enum LoadSpellType {
+  ADDITIONAL = "ADDITIONAL",
+  ALWAYS_KNOWN = "ALWAYS_KNOWN",
+}
+interface SpellManagerGroupProps {
+  spells: Array<Spell>;
+  spellCasterInfo: SpellCasterInfo;
+  overallSpellInfo: any;
+  knownSpellIds: Array<any>;
+  ruleData: RuleData;
+  dataOriginRefData: DataOriginRefData;
+  loadSpells?: ApiSpellsRequest | null;
+  loadAlwaysKnownSpells?: ApiSpellsRequest | null;
+  enableRemove: boolean;
+  enableSpellRemove: boolean;
+  enableAdd: boolean;
+  enablePrepare: boolean;
+  enableUnprepare: boolean;
+  isPrepareMaxed: boolean;
+  isCantripsKnownMaxed: boolean;
+  isSpellsKnownMaxed: boolean;
+  addButtonText: string;
+  removeButtonText: string;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  onAlwaysKnownLoad?: (spells: Array<BaseSpellContract>) => void;
+  onPrepare: (spell: Spell) => void;
+  onUnprepare: (spell: Spell) => void;
+  onAdd: (spell: Spell) => void;
+  onRemove: (spell: Spell) => void;
+  activeSourceCategories: Array<number>;
+}
+interface SpellManagerGroupState {
+  query: string;
+  lazySpells: Array<Spell>;
+  staticSpells: Array<Spell>;
+  filteredSpells: Array<Spell>;
+  currentPage: number;
+  loadingStatus: DataLoadingStatusEnum;
+  filterLevels: Array<number>;
+  filterSourceCategories: Array<number>;
+  filterQuery: string;
+}
+export default class SpellManagerGroup extends React.PureComponent<
+  SpellManagerGroupProps,
+  SpellManagerGroupState
+> {
+  static defaultProps = {
+    enablePrepare: true,
+    enableUnprepare: true,
+    enableRemove: true,
+    enableSpellRemove: true,
+    enableAdd: true,
+  };
+
+  loadRuleCancelers: Array<Canceler> = [];
+
+  constructor(props) {
+    super(props);
+
+    const { spells } = props;
+
+    this.state = {
+      query: "",
+      lazySpells: [],
+      staticSpells: spells,
+      filteredSpells: spells,
+      currentPage: 0,
+      loadingStatus: DataLoadingStatusEnum.NOT_INITIALIZED,
+      filterLevels: [],
+      filterSourceCategories: [],
+      filterQuery: "",
+    };
+  }
+
+  fetchSpells = () => {
+    const { loadSpells, loadAlwaysKnownSpells, onAlwaysKnownLoad } = this.props;
+
+    if (!loadSpells && !loadAlwaysKnownSpells) {
+      this.setState({
+        loadingStatus: DataLoadingStatusEnum.LOADED,
+      });
+      return;
+    }
+
+    let requests: Array<ApiSpellsPromise> = [];
+    let loadingRequestTypes: Array<LoadSpellType> = [];
+    if (loadSpells) {
+      requests.push(
+        loadSpells({
+          cancelToken: new axios.CancelToken((c) => {
+            this.loadRuleCancelers.push(c);
+          }),
+        })
+      );
+      loadingRequestTypes.push(LoadSpellType.ADDITIONAL);
+    }
+    if (loadAlwaysKnownSpells) {
+      requests.push(
+        loadAlwaysKnownSpells({
+          cancelToken: new axios.CancelToken((c) => {
+            this.loadRuleCancelers.push(c);
+          }),
+        })
+      );
+      loadingRequestTypes.push(LoadSpellType.ALWAYS_KNOWN);
+    }
+
+    this.setState({
+      loadingStatus: DataLoadingStatusEnum.LOADING,
+    });
+
+    axios
+      .all(requests)
+      .then((responses) => {
+        let lazySpells: Array<Spell> = [];
+
+        for (let i = 0; i < responses.length; i++) {
+          let response = responses[i];
+          let requestType = loadingRequestTypes[i];
+          let spells = ApiAdapterUtils.getResponseData(response);
+          switch (requestType) {
+            case LoadSpellType.ADDITIONAL:
+              lazySpells =
+                spells !== null ? this.transformLoadedSpells(spells) : [];
+              break;
+
+            case LoadSpellType.ALWAYS_KNOWN:
+              if (spells !== null && onAlwaysKnownLoad) {
+                onAlwaysKnownLoad(spells);
+              }
+              break;
+
+            default:
+            // not implemented
+          }
+        }
+
+        this.setState({
+          lazySpells,
+          loadingStatus: DataLoadingStatusEnum.LOADED,
+        });
+        this.loadRuleCancelers = [];
+      })
+      .catch(AppLoggerUtils.handleAdhocApiError);
+  };
+
+  componentDidMount() {
+    this.fetchSpells();
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadRuleCancelers.length > 0) {
+      this.loadRuleCancelers.forEach((cancel) => {
+        cancel();
+      });
+    }
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<SpellManagerGroupProps>,
+    prevState: Readonly<SpellManagerGroupState>,
+    snapshot?: any
+  ): void {
+    const { spells, spellCasterInfo } = this.props;
+
+    if (spells !== prevProps.spells) {
+      this.setState((prevState) => ({
+        staticSpells: spells,
+      }));
+    }
+
+    if (
+      spellCasterInfo.characterLevel !==
+      prevProps.spellCasterInfo.characterLevel
+    ) {
+      this.fetchSpells();
+    }
+  }
+
+  getCombinedSpells = () => {
+    const { lazySpells, staticSpells } = this.state;
+    const { knownSpellIds } = this.props;
+
+    const remainingLazySpells = lazySpells.filter(
+      (spell) => !knownSpellIds.includes(SpellUtils.deriveKnownKey(spell))
+    );
+
+    return sortBy(
+      [...remainingLazySpells, ...staticSpells],
+      [
+        (spell) => SpellUtils.getLevel(spell),
+        (spell) => SpellUtils.getName(spell),
+        (spell) => SpellUtils.getExpandedDataOriginRef(spell) !== null,
+        (spell) => SpellUtils.getUniqueKey(spell),
+      ]
+    );
+  };
+
+  getFilteredSpells = (combinedSpells) => {
+    const { filterLevels, filterQuery, filterSourceCategories } = this.state;
+    const { ruleData } = this.props;
+
+    const filteredSpells = combinedSpells.filter((spell) => {
+      if (filterSourceCategories.length !== 0) {
+        const spellSources = SpellUtils.getSources(spell);
+        const sources = spellSources
+          .map((source) =>
+            HelperUtils.lookupDataOrFallback(
+              RuleDataUtils.getSourceDataLookup(ruleData),
+              source.sourceId
+            )
+          )
+          .filter(TypeScriptUtils.isNotNullOrUndefined);
+
+        const sourceCategoryId = sources[0]?.sourceCategory?.id || 0;
+        if (!filterSourceCategories.includes(sourceCategoryId)) {
+          return false;
+        }
+      }
+
+      if (
+        filterLevels.length !== 0 &&
+        !filterLevels.includes(SpellUtils.getLevel(spell))
+      ) {
+        return false;
+      }
+
+      if (
+        filterQuery !== "" &&
+        !FilterUtils.doesQueryMatchData(filterQuery, SpellUtils.getName(spell))
+      ) {
+        return false;
+      }
+
+      return true;
+    });
+
+    return filteredSpells;
+  };
+
+  transformLoadedSpells = (data) => {
+    const { ruleData, overallSpellInfo } = this.props;
+    return data.map((spell) =>
+      SpellUtils.simulateSpell(spell, overallSpellInfo, ruleData, null, null)
+    );
+  };
+
+  handleFilterSpellLevel = (level: number) => {
+    this.setState((prevState) => ({
+      filterLevels: prevState.filterLevels.includes(level)
+        ? prevState.filterLevels.filter((l) => l !== level)
+        : [...prevState.filterLevels, level],
+    }));
+  };
+
+  handleSourceCategoryClick = (categoryId: number) => {
+    this.setState((prevState) => ({
+      filterSourceCategories: prevState.filterSourceCategories.includes(
+        categoryId
+      )
+        ? prevState.filterSourceCategories.filter((cat) => cat !== categoryId)
+        : [...prevState.filterSourceCategories, categoryId],
+    }));
+  };
+
+  render() {
+    const {
+      onPrepare,
+      onUnprepare,
+      onRemove,
+      onAdd,
+      isPrepareMaxed,
+      isCantripsKnownMaxed,
+      isSpellsKnownMaxed,
+      addButtonText,
+      removeButtonText,
+      enableRemove,
+      enableAdd,
+      enablePrepare,
+      enableUnprepare,
+      enableSpellRemove,
+      spellCasterInfo,
+      ruleData,
+      dataOriginRefData,
+      proficiencyBonus,
+      theme,
+      activeSourceCategories,
+    } = this.props;
+    const { filterQuery, filterLevels, loadingStatus, filterSourceCategories } =
+      this.state;
+
+    const combinedSpells = this.getCombinedSpells();
+    const filteredSpells = this.getFilteredSpells(combinedSpells);
+
+    const spellDefinitions = combinedSpells
+      .map((spell) => SpellUtils.getDefinition(spell))
+      .filter(TypeScriptUtils.isNotNullOrUndefined);
+    const sourceCategories = SourceUtils.getSimpleSourceCategoriesData(
+      spellDefinitions,
+      ruleData,
+      activeSourceCategories
+    );
+    return (
+      <div className="spell-manager-group">
+        <SpellFilter
+          spells={combinedSpells}
+          sourceCategories={sourceCategories}
+          filterQuery={filterQuery}
+          filterLevels={filterLevels}
+          onLevelFilterClick={this.handleFilterSpellLevel}
+          onQueryChange={(value) =>
+            this.setState({
+              filterQuery: value,
+            })
+          }
+          onSourceCategoryClick={this.handleSourceCategoryClick}
+          filterSourceCategories={filterSourceCategories}
+          buttonSize="x-small"
+          filterStyle="builder"
+        />
+        <div className="ct-character-tools__marketplace-callout">
+          Looking for something not in the list below? Unlock all official
+          options in the <Link href="/marketplace">Marketplace</Link>.
+        </div>
+        {loadingStatus === DataLoadingStatusEnum.LOADING && (
+          <LoadingPlaceholder />
+        )}
+        {loadingStatus === DataLoadingStatusEnum.LOADED &&
+          (filteredSpells.length > 0 ? (
+            filteredSpells.map((spell, idx) => (
+              <SpellManagerGroupItem
+                theme={theme}
+                spell={spell}
+                key={`${spell.id}-${idx}`}
+                onPrepare={onPrepare}
+                onUnprepare={onUnprepare}
+                onRemove={onRemove}
+                onAdd={onAdd}
+                isPrepareMaxed={isPrepareMaxed}
+                isCantripsKnownMaxed={isCantripsKnownMaxed}
+                isSpellsKnownMaxed={isSpellsKnownMaxed}
+                addButtonText={addButtonText}
+                removeButtonText={removeButtonText}
+                enableRemove={enableRemove}
+                enableAdd={enableAdd}
+                enablePrepare={enablePrepare}
+                enableUnprepare={enableUnprepare}
+                enableSpellRemove={enableSpellRemove}
+                spellCasterInfo={spellCasterInfo}
+                ruleData={ruleData}
+                dataOriginRefData={dataOriginRefData}
+                proficiencyBonus={proficiencyBonus}
+              />
+            ))
+          ) : (
+            <div>No Results Found</div>
+          ))}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/components/legacy/SpellManagerGroup/index.ts b/ddb_main/tools/js/Shared/components/legacy/SpellManagerGroup/index.ts
new file mode 100644
index 0000000..34f9f90
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/SpellManagerGroup/index.ts
@@ -0,0 +1,4 @@
+import SpellManagerGroup, { SpellManagerGroupItem } from "./SpellManagerGroup";
+
+export default SpellManagerGroup;
+export { SpellManagerGroup, SpellManagerGroupItem };
diff --git a/ddb_main/tools/js/Shared/components/legacy/WeaponList/WeaponList.tsx b/ddb_main/tools/js/Shared/components/legacy/WeaponList/WeaponList.tsx
new file mode 100644
index 0000000..919ac8c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/WeaponList/WeaponList.tsx
@@ -0,0 +1,88 @@
+import { FC } from "react";
+
+import { Accordion } from "~/components/Accordion";
+import { ItemName } from "~/components/ItemName";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { EquipmentActions } from "~/subApps/builder/components/EquipmentActions";
+import { useEquipmentMethods } from "~/subApps/builder/hooks/useEquipmentMethods";
+import { Item } from "~/types";
+
+import ItemDetail from "../../ItemDetail";
+import { ItemListInformationCollapsible } from "../../ItemListInformationCollapsible";
+import { EquipmentListItemActions } from "../EquipmentListItem";
+
+interface WeaponListItemProps {
+  item: Item;
+  unequipLabel: string;
+  equipLabel: string;
+  showRemove?: boolean;
+  showEquip?: boolean;
+  showUnequip?: boolean;
+  showAttuning?: boolean;
+  showHeaderAction: boolean;
+}
+
+export const WeaponListItem: FC<WeaponListItemProps> = ({
+  item,
+  equipLabel,
+  unequipLabel,
+  ...props
+}) => {
+  const actions = useEquipmentMethods();
+  const {
+    ruleData,
+    proficiencyBonus,
+    characterTheme,
+    itemUtils,
+    helperUtils,
+    containerLookup,
+  } = useCharacterEngine();
+  const image = itemUtils.getAvatarUrl(item);
+  const altText = itemUtils.getName(item);
+  const type = itemUtils.getType(item);
+  const isOffhand = itemUtils.isOffhand(item);
+  const container = helperUtils.lookupDataOrFallback(
+    containerLookup,
+    itemUtils.getContainerDefinitionKey(item)
+  );
+
+  const getMetaItems = () => {
+    const { metaItems, isCustomized } = item;
+
+    return [
+      ...(type ? [type] : []),
+      ...(isOffhand ? ["Dual Wield"] : []),
+      ...(isCustomized ? ["Customized"] : []),
+      ...metaItems,
+    ];
+  };
+
+  return (
+    <Accordion
+      summary={<ItemName item={item} showLegacyBadge />}
+      summaryAction={
+        <EquipmentActions
+          item={item}
+          equipLabel={equipLabel}
+          unequipLabel={unequipLabel}
+        />
+      }
+      summaryImage={image}
+      summaryImageAlt={altText}
+      summaryMetaItems={getMetaItems()}
+      variant="paper"
+    >
+      <ItemListInformationCollapsible ruleData={ruleData} item={item} />
+      <ItemDetail
+        container={container}
+        theme={characterTheme}
+        item={item}
+        ruleData={ruleData}
+        showCustomize={false}
+        showActions={false}
+        proficiencyBonus={proficiencyBonus}
+      />
+      <EquipmentListItemActions item={item} {...actions} {...props} />
+    </Accordion>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/components/legacy/common/Collapsible/Collapsible.tsx b/ddb_main/tools/js/Shared/components/legacy/common/Collapsible/Collapsible.tsx
new file mode 100644
index 0000000..e1a91aa
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/common/Collapsible/Collapsible.tsx
@@ -0,0 +1,228 @@
+import React from "react";
+
+import {
+  DisabledChevronDownSvg,
+  DisabledChevronUpSvg,
+} from "@dndbeyond/character-components/es";
+
+export class CollapsibleHeading extends React.PureComponent<{
+  className: string;
+}> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, children } = this.props;
+    return (
+      <div className={["collapsible-heading", className].join(" ")}>
+        {children}
+      </div>
+    );
+  }
+}
+
+export class CollapsibleHeaderCallout extends React.PureComponent<{
+  extra: any;
+  value: any;
+}> {
+  render() {
+    let { extra, value } = this.props;
+
+    return (
+      <span className="collapsible-header-callout">
+        <span className="collapsible-header-callout-extra">{extra}</span>
+        <span className="collapsible-header-callout-value">{value}</span>
+      </span>
+    );
+  }
+}
+
+export class CollapsibleHeader extends React.PureComponent<{
+  clsIdent?: string;
+  imgSrc?: string;
+  imgKey?: string;
+  iconClsNames: Array<string>;
+  heading: any;
+  metaItems: Array<string>;
+  callout?: any;
+}> {
+  static defaultProps = {
+    iconClsNames: [],
+    metaItems: [],
+  };
+
+  constructMetaItems() {
+    let { metaItems } = this.props;
+
+    if (!metaItems) {
+      return null;
+    }
+
+    return (
+      <div className="collapsible-header-meta">
+        {metaItems.map((item, idx) => {
+          return (
+            <span className="collapsible-header-meta-item" key={item + idx}>
+              {item}
+            </span>
+          );
+        })}
+      </div>
+    );
+  }
+
+  render() {
+    const { clsIdent, heading, callout, imgSrc, imgKey, iconClsNames } =
+      this.props;
+    let calloutNode, headingNode;
+
+    if (typeof heading === "string") {
+      headingNode = (
+        <CollapsibleHeading className="collapsible-heading">
+          {heading}
+        </CollapsibleHeading>
+      );
+    } else {
+      headingNode = heading;
+    }
+
+    if (typeof callout === "string") {
+      calloutNode = (
+        <div className="collapsible-heading-callout">{callout}</div>
+      );
+    } else {
+      calloutNode = (
+        <div className="collapsible-heading-callout">{callout}</div>
+      );
+    }
+
+    //TODO clean this up and use all of the same thing
+    let iconStyles = {};
+    let allIconClsNames = ["collapsible-header-icon"];
+    let hasIcon = false;
+    if (imgSrc) {
+      iconStyles["backgroundImage"] = `url(${imgSrc})`;
+      hasIcon = true;
+    } else if (imgKey) {
+      allIconClsNames.push(`collapsible-header-icon-${imgKey}`);
+      hasIcon = true;
+    } else if (iconClsNames.length) {
+      allIconClsNames = [...allIconClsNames, ...iconClsNames];
+      hasIcon = true;
+    }
+
+    //TODO fix name to conClsNames for consistency
+    let conClassNames = [`collapsible-header-el`];
+    if (clsIdent) {
+      conClassNames.push(`collapsible-header-el-${clsIdent}`);
+    }
+
+    return (
+      <div className={conClassNames.join(" ")}>
+        {hasIcon && (
+          <div className={allIconClsNames.join(" ")} style={iconStyles} />
+        )}
+        <div className="collapsible-header-info">
+          {headingNode}
+          {this.constructMetaItems()}
+        </div>
+        {calloutNode}
+      </div>
+    );
+  }
+}
+
+export class Collapsible extends React.PureComponent<
+  {
+    trigger: any;
+    clsNames: Array<string>;
+    initiallyCollapsed: boolean;
+    onChange?: (isCollapsed: boolean) => void;
+    onOpened?: () => void;
+    onClosed?: () => void;
+  },
+  {
+    collapsed: boolean;
+    mouseOverHeading: boolean;
+  }
+> {
+  static defaultProps = {
+    clsNames: [],
+    initiallyCollapsed: true,
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      collapsed: props.initiallyCollapsed,
+      mouseOverHeading: false,
+    };
+  }
+
+  handleUpdate = () => {
+    const { onChange, onOpened, onClosed } = this.props;
+    const { collapsed } = this.state;
+
+    if (collapsed) {
+      if (onClosed) {
+        onClosed();
+      }
+    } else {
+      if (onOpened) {
+        onOpened();
+      }
+    }
+
+    if (onChange) {
+      onChange(collapsed);
+    }
+  };
+
+  handleClick = (evt) => {
+    this.setState(
+      (prevState, preProps) => ({
+        collapsed: !prevState.collapsed,
+      }),
+      this.handleUpdate
+    );
+  };
+
+  render() {
+    const { collapsed } = this.state;
+    const { trigger, clsNames, children } = this.props;
+
+    let headerContent = trigger;
+    if (typeof headerContent == "string") {
+      headerContent = (
+        <div className="collapsible-heading">{headerContent}</div>
+      );
+    }
+
+    let conClassNames = ["collapsible"];
+    if (clsNames) {
+      conClassNames = [...clsNames, ...conClassNames];
+    }
+    conClassNames.push(
+      this.state.collapsed ? "collapsible-collapsed" : "collapsible-opened"
+    );
+
+    let headerClassNames = ["collapsible-header"];
+    if (this.state.mouseOverHeading) {
+      headerClassNames.push("collapsible-header-over");
+    }
+
+    return (
+      <div className={conClassNames.join(" ")}>
+        <div className={headerClassNames.join(" ")} onClick={this.handleClick}>
+          <div className="collapsible-header-content">{headerContent}</div>
+          {collapsed ? <DisabledChevronDownSvg /> : <DisabledChevronUpSvg />}
+        </div>
+        {collapsed ? null : <div className="collapsible-body">{children}</div>}
+      </div>
+    );
+  }
+}
+
+export default Collapsible;
diff --git a/ddb_main/tools/js/Shared/components/legacy/common/Collapsible/index.ts b/ddb_main/tools/js/Shared/components/legacy/common/Collapsible/index.ts
new file mode 100644
index 0000000..25b3ebf
--- /dev/null
+++ b/ddb_main/tools/js/Shared/components/legacy/common/Collapsible/index.ts
@@ -0,0 +1,13 @@
+import Collapsible, {
+  CollapsibleHeader,
+  CollapsibleHeaderCallout,
+  CollapsibleHeading,
+} from "./Collapsible";
+
+export default Collapsible;
+export {
+  Collapsible,
+  CollapsibleHeader,
+  CollapsibleHeading,
+  CollapsibleHeaderCallout,
+};
diff --git a/ddb_main/tools/js/Shared/constants/App.ts b/ddb_main/tools/js/Shared/constants/App.ts
new file mode 100644
index 0000000..8bb1427
--- /dev/null
+++ b/ddb_main/tools/js/Shared/constants/App.ts
@@ -0,0 +1,32 @@
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import { SIGNED_32BIT_INT_MAX_VALUE } from "~/subApps/sheet/constants";
+
+export enum PaneHistoryInitTypeEnum {
+  START = "START",
+  PUSH = "PUSH",
+}
+
+export const SENSE_TYPE_LIST: Array<Constants.SenseTypeEnum> = [
+  Constants.SenseTypeEnum.BLINDSIGHT,
+  Constants.SenseTypeEnum.DARKVISION,
+  Constants.SenseTypeEnum.TREMORSENSE,
+  Constants.SenseTypeEnum.TRUESIGHT,
+];
+
+export const MOVEMENT_TYPE_LIST: Array<Constants.MovementTypeEnum> = [
+  Constants.MovementTypeEnum.BURROW,
+  Constants.MovementTypeEnum.CLIMB,
+  Constants.MovementTypeEnum.FLY,
+  Constants.MovementTypeEnum.SWIM,
+  Constants.MovementTypeEnum.WALK,
+];
+
+export const CURRENCY_VALUE = {
+  MAX: SIGNED_32BIT_INT_MAX_VALUE,
+  MIN: 0,
+};
+export const CHARACTER_DESCRIPTION_NUMBER_VALUE = {
+  MAX: SIGNED_32BIT_INT_MAX_VALUE,
+  MIN: 0,
+};
diff --git a/ddb_main/tools/js/Shared/constants/AppErrorTypeEnum.ts b/ddb_main/tools/js/Shared/constants/AppErrorTypeEnum.ts
new file mode 100644
index 0000000..169d154
--- /dev/null
+++ b/ddb_main/tools/js/Shared/constants/AppErrorTypeEnum.ts
@@ -0,0 +1,11 @@
+enum AppErrorTypeEnum {
+  GENERIC = "GENERIC",
+  AUTH_FAIL = "AUTH_FAIL",
+  AUTH_MISSING = "AUTH_MISSING",
+  ACCESS_DENIED = "ACCESS_DENIED",
+  API_FAIL = "API_FAIL",
+  API_DATA_FAIL = "API_DATA_FAIL",
+  NOT_FOUND = "NOT_FOUND",
+}
+
+export default AppErrorTypeEnum;
diff --git a/ddb_main/tools/js/Shared/constants/DataLoadingStatusEnum.ts b/ddb_main/tools/js/Shared/constants/DataLoadingStatusEnum.ts
new file mode 100644
index 0000000..75bf94a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/constants/DataLoadingStatusEnum.ts
@@ -0,0 +1,8 @@
+enum DataLoadingStatusEnum {
+  NOT_INITIALIZED = "NOT_INITIALIZED",
+  NOT_LOADED = "NOT_LOADED",
+  LOADING = "LOADING",
+  LOADED = "LOADED",
+}
+
+export default DataLoadingStatusEnum;
diff --git a/ddb_main/tools/js/Shared/constants/HttpStatusCodes.ts b/ddb_main/tools/js/Shared/constants/HttpStatusCodes.ts
new file mode 100644
index 0000000..f342f5f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/constants/HttpStatusCodes.ts
@@ -0,0 +1,6 @@
+export const OK = 200;
+export const BAD_REQUEST = 400;
+export const UNAUTHORIZED = 401;
+export const FORBIDDEN = 403;
+export const NOT_FOUND = 404;
+export const PRECONDITION_FAILED = 412;
diff --git a/ddb_main/tools/js/Shared/constants/PreferenceUpdateLocation.ts b/ddb_main/tools/js/Shared/constants/PreferenceUpdateLocation.ts
new file mode 100644
index 0000000..4189d42
--- /dev/null
+++ b/ddb_main/tools/js/Shared/constants/PreferenceUpdateLocation.ts
@@ -0,0 +1,7 @@
+enum PreferenceUpdateLocation {
+    CharacterListing,
+    CharacterBuilder,
+    CharacterSheet,
+}
+
+export default PreferenceUpdateLocation;
diff --git a/ddb_main/tools/js/Shared/constants/UserRoles.ts b/ddb_main/tools/js/Shared/constants/UserRoles.ts
new file mode 100644
index 0000000..754ed59
--- /dev/null
+++ b/ddb_main/tools/js/Shared/constants/UserRoles.ts
@@ -0,0 +1,7 @@
+enum UserRoles {
+  LOREKEEPER = "DDB - Lorekeepers",
+  ADMIN = "Admin",
+  DEV = "DDB - Devs",
+}
+
+export default UserRoles;
diff --git a/ddb_main/tools/js/Shared/containers/DetailChoice/DetailChoice.tsx b/ddb_main/tools/js/Shared/containers/DetailChoice/DetailChoice.tsx
new file mode 100644
index 0000000..19a25e8
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/DetailChoice/DetailChoice.tsx
@@ -0,0 +1,167 @@
+import { FC, ReactNode } from "react";
+
+import {
+  BuilderChoiceContract,
+  Choice,
+  ChoiceData,
+  ChoiceUtils,
+  Constants,
+  FeatureChoiceOption,
+  HtmlSelectOptionGroup,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { CollapsibleContent } from "~/components/CollapsibleContent";
+import { HtmlContent } from "~/components/HtmlContent";
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { useRuleData } from "~/hooks/useRuleData";
+import Collapsible from "~/tools/js/smartComponents/Collapsible";
+import { Select } from "~/tools/js/smartComponents/legacy";
+
+// TODO this needs to not extend builder contract and options typing needs to be fixed
+interface Props extends Omit<BuilderChoiceContract, "options"> {
+  choice: Choice;
+  description?: string;
+  choiceInfo: ChoiceData;
+  classId?: number | null;
+  maxDescriptionLength?: number;
+  showBackgroundProficiencyOptions?: boolean;
+  hideWhenOnlyDefaultSelected?: boolean;
+  className?: string;
+  options: Array<FeatureChoiceOption | HtmlSelectOptionGroup>;
+  onChange?: (
+    id: string,
+    type: number,
+    subType: number | null,
+    value: any,
+    parentChoiceId: string | null
+  ) => void;
+  collapseDescription?: boolean;
+}
+
+export const DetailChoice: FC<Props> = ({
+  choice,
+  description,
+  optionValue,
+  parentChoiceId,
+  maxDescriptionLength = 750,
+  hideWhenOnlyDefaultSelected = true,
+  type,
+  className = "",
+  options,
+  collapseDescription,
+  classId = null,
+  label,
+  subType,
+  choiceInfo,
+  defaultSubtypes = [],
+  showBackgroundProficiencyOptions = false,
+  onChange,
+  id,
+}) => {
+  const { entityRestrictionData, ruleData } = useCharacterEngine();
+  const { languages } = useRuleData();
+
+  const handleChoiceChange = (value: string): void => {
+    if (onChange && id !== null) {
+      onChange(id, type, subType, value, parentChoiceId);
+    }
+  };
+
+  if (
+    hideWhenOnlyDefaultSelected &&
+    ChoiceUtils.isOnlyDefaultSelected(choice)
+  ) {
+    return null;
+  }
+
+  let classNames: Array<string> = ["detail-choice", className];
+  if (
+    (ChoiceUtils.isInfinite(choice) && !ChoiceUtils.isOptionSelected(choice)) ||
+    ChoiceUtils.isTodo(choice)
+  ) {
+    classNames.push("detail-choice--todo");
+  }
+
+  // Use the description prop or, if a chosenOption is found and a description wasn't passed in, use the chosenOption description instead.
+  let choiceDescription = description;
+
+  //Look for a chosenOption from options that are not already grouped
+  const chosenOption = options.find(
+    (option) => option["value"] === optionValue
+  );
+
+  if (chosenOption) {
+    choiceDescription = description || chosenOption["description"];
+  }
+
+  if (parentChoiceId !== null) {
+    classNames.push("detail-choice--child");
+  }
+
+  let choiceNode: ReactNode;
+  if (choiceDescription) {
+    switch (type) {
+      case Constants.BuilderChoiceTypeEnum.ENTITY_SPELL_OPTION:
+        choiceNode = (
+          <Collapsible layoutType={"minimal"} header="Spell Details">
+            <HtmlContent
+              className="detail-choice-description"
+              html={choiceDescription}
+              withoutTooltips
+            />
+          </Collapsible>
+        );
+        break;
+      default:
+        if (collapseDescription) {
+          choiceNode = (
+            <Collapsible layoutType={"minimal"} header="Show Details">
+              <HtmlContent
+                className="detail-choice-description"
+                html={choiceDescription}
+                withoutTooltips
+              />
+            </Collapsible>
+          );
+        } else if (choiceDescription.length > maxDescriptionLength) {
+          choiceNode = (
+            <CollapsibleContent className="detail-choice-description">
+              {choiceDescription}
+            </CollapsibleContent>
+          );
+        } else {
+          choiceNode = (
+            <HtmlContent
+              className="detail-choice-description"
+              html={choiceDescription}
+              withoutTooltips
+            />
+          );
+        }
+    }
+  }
+
+  return (
+    <div className={classNames.join(" ")}>
+      <Select
+        className="detail-choice-input"
+        options={ChoiceUtils.getSortedRenderOptions(
+          options,
+          classId,
+          subType,
+          entityRestrictionData,
+          languages ?? [],
+          ruleData,
+          defaultSubtypes,
+          showBackgroundProficiencyOptions,
+          choiceInfo,
+          optionValue
+        )}
+        value={optionValue}
+        placeholder={label ? `- ${label} -` : "- Choose an Option -"}
+        onChange={handleChoiceChange}
+      />
+      {choiceNode}
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/containers/DetailChoice/DetailChoiceFeat/DetailChoiceFeat.tsx b/ddb_main/tools/js/Shared/containers/DetailChoice/DetailChoiceFeat/DetailChoiceFeat.tsx
new file mode 100644
index 0000000..9d267e9
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/DetailChoice/DetailChoiceFeat/DetailChoiceFeat.tsx
@@ -0,0 +1,77 @@
+import { FC } from "react";
+import { useDispatch } from "react-redux";
+
+import {
+  characterActions,
+  ChoiceUtils,
+  FeatUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+
+import { DetailChoice } from "../DetailChoice";
+
+//This component is a wrapper for DetailChoice that is specifically for Feats
+//given a featId, it will render the choices for that feat
+//used in FeatDetail, FeatPane and FeatureChoice (for feats that are given by Class Features, Species Traits and Backgrounds)
+
+export interface Props {
+  featId: number;
+}
+
+export const DetailChoiceFeat: FC<Props> = ({ featId }) => {
+  const dispatch = useDispatch();
+  const { entityRestrictionData, choiceInfo, feats, ruleData } =
+    useCharacterEngine();
+
+  const handleChoiceChange = (
+    id: string | null,
+    type: number,
+    subType: number | null,
+    value: any
+  ): void => {
+    if (id !== null) {
+      dispatch(characterActions.featChoiceSetRequest(featId, type, id, value));
+    }
+  };
+
+  const feat = feats.find((feat) => FeatUtils.getId(feat) === featId);
+
+  if (!feat) {
+    return null;
+  }
+
+  const choices = FeatUtils.getChoices(feat);
+  if (choices.length === 0) {
+    return null;
+  }
+
+  return (
+    <div className="ct-detail-choice-feat">
+      {choices.map((choice) => {
+        const id = ChoiceUtils.getId(choice);
+
+        const { description, options: featChoiceOptions } =
+          ChoiceUtils.getSortedChoiceOptionsInfo(
+            choice,
+            ruleData,
+            entityRestrictionData
+          );
+
+        return (
+          <DetailChoice
+            {...choice}
+            label={choice.label}
+            choice={choice}
+            key={id !== null ? id : ""}
+            options={featChoiceOptions}
+            onChange={handleChoiceChange}
+            choiceInfo={choiceInfo}
+            showBackgroundProficiencyOptions={true}
+            description={description}
+          />
+        );
+      })}
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/containers/DiceContainer/DiceContainer.tsx b/ddb_main/tools/js/Shared/containers/DiceContainer/DiceContainer.tsx
new file mode 100644
index 0000000..87e90f7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/DiceContainer/DiceContainer.tsx
@@ -0,0 +1,163 @@
+import { useContext, useEffect, useRef } from "react";
+import ReactDOM from "react-dom";
+import { DispatchProp, useDispatch, useSelector } from "react-redux";
+
+import { TypeScriptUtils } from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterUtils,
+  CharacterTheme,
+  ConfigUtils,
+  rulesEngineSelectors,
+  Constants,
+  ApiException,
+  CampaignDataContract,
+  CampaignUtils,
+  characterEnvSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+import { Dice, DiceNotifier, IRollContext } from "@dndbeyond/dice";
+import { DiceToolbar } from "@dndbeyond/dice-components";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+import { getMessageBroker } from "@dndbeyond/message-broker-lib";
+
+import { useAuth } from "~/contexts/Authentication";
+
+import { appEnvActions } from "../../actions/appEnv";
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "../../selectors";
+import {
+  DiceFeatureConfigurationState,
+  SharedAppState,
+} from "../../stores/typings";
+import { AppLoggerUtils } from "../../utils";
+
+interface Props extends DispatchProp {
+  campaign: CampaignDataContract | null;
+  canShow: boolean;
+  theme: CharacterTheme;
+  diceEnabled: boolean;
+  diceFeatureConfiguration: DiceFeatureConfigurationState;
+  characterRollContext: IRollContext;
+}
+
+// <canvas id="dice-rolling-canvas" className={'dice-rolling-panel__container'} />
+// this is the canvas element that we will use to draw the dice
+// TODO: this is a temporary solution, we need to find a better way to do this
+// waiting for adventure team to provide a better solution
+const canvasElement = document.createElement("canvas");
+canvasElement.id = "dice-rolling-canvas";
+canvasElement.classList.add("dice-rolling-panel__container");
+
+export default function DiceContainer({ canShow = true }) {
+  const dispatch = useDispatch();
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+  const diceEnabled = useSelector(appEnvSelectors.getDiceEnabled);
+  const diceFeatureConfiguration = useSelector(
+    appEnvSelectors.getDiceFeatureConfiguration
+  );
+  const characterRollContext = useSelector(
+    characterRollContextSelectors.getCharacterRollContext
+  );
+  const campaign = useSelector(rulesEngineSelectors.getCampaign);
+  const userConfigApi = "/diceuserconfig/v1/get";
+  const authUser = useAuth();
+  let userId: string | null = null;
+  if (authUser?.id) {
+    userId = authUser.id;
+  }
+  const [{ messageTargetOptions, defaultMessageTargetOption }] =
+    useContext(GameLogContext);
+  const canvasContainer = useRef<HTMLDivElement | null>(null);
+
+  const isSheet =
+    useSelector(characterEnvSelectors.getContext) ===
+    Constants.AppContextTypeEnum.SHEET;
+
+  useEffect(() => {
+    if (!canvasContainer.current?.contains(canvasElement)) {
+      canvasContainer.current?.appendChild(canvasElement);
+    }
+  });
+
+  useEffect(() => {
+    getMessageBroker().then((mb) => {
+      if (mb && campaign && userId) {
+        mb.gameId = isSheet ? CampaignUtils.getId(campaign).toString() : "0";
+        mb.userId = userId;
+      }
+      ConfigUtils.configureRulesEngine({ messageBroker: mb });
+      if (diceFeatureConfiguration.enabled) {
+        const rulesEngineConfig = ConfigUtils.getCurrentRulesEngineConfig();
+        if (rulesEngineConfig.apiAdapter) {
+          rulesEngineConfig.apiAdapter
+            .get(`${diceFeatureConfiguration.apiEndpoint}${userConfigApi}`)
+            .then((x) => {
+              const diceCanvas = canvasElement;
+              Dice.init({
+                isDebug: false,
+                assetBaseLocation: diceFeatureConfiguration.assetBaseLocation,
+                trackingId: diceFeatureConfiguration.trackingId,
+                sessionName: "Dice",
+                notifier: new DiceNotifier(),
+                canvas: diceCanvas || undefined,
+                previewMode: false,
+                diceUserConfig: ApiAdapterUtils.getResponseData(x) as any,
+              })
+                .then(() =>
+                  document.addEventListener("click", () => Dice.clear())
+                )
+                .catch((error: Error) => {
+                  AppLoggerUtils.logMessage(
+                    error.message,
+                    Constants.LogMessageType.WARNING
+                  );
+                  dispatch(
+                    appEnvActions.dataSet({
+                      diceEnabled: false,
+                    })
+                  );
+                });
+            })
+            .catch((error: ApiException) => {
+              AppLoggerUtils.logMessage(
+                error.message,
+                Constants.LogMessageType.WARNING
+              );
+              dispatch(
+                appEnvActions.dataSet({
+                  diceEnabled: false,
+                })
+              );
+            });
+        }
+      } else {
+        Dice.analyticsInit(diceFeatureConfiguration.trackingId, "Dice");
+      }
+    });
+  }, [diceFeatureConfiguration, dispatch]);
+
+  return ReactDOM.createPortal(
+    <div className={"dice-rolling-panel"} ref={canvasContainer}>
+      {canShow && diceEnabled && (
+        <DiceToolbar
+          rollContext={characterRollContext}
+          rollTargetOptions={
+            messageTargetOptions && isSheet
+              ? Object.values(messageTargetOptions?.entities).filter(
+                  TypeScriptUtils.isNotNullOrUndefined
+                )
+              : undefined
+          }
+          rollTargetDefault={defaultMessageTargetOption}
+          themeColor={theme.themeColor}
+          userId={parseInt(userId || "0", 10)}
+        />
+      )}
+      {/* We want this one so it is sticking around, 
+            also this is where the canvas goes when we append */}
+      {/* <canvas className={'dice-rolling-panel__container'} ref={canvas} /> */}
+    </div>,
+    document.body
+  );
+}
diff --git a/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTour.tsx b/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTour.tsx
new file mode 100644
index 0000000..fca0ce5
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTour.tsx
@@ -0,0 +1,117 @@
+import { Box } from "@mui/material";
+import { StepType, TourContext, TourProvider } from "@reactour/tour";
+import { Dispatch, ReactNode, SetStateAction, useState } from "react";
+import { useSelector } from "react-redux";
+
+import { rulesEngineSelectors } from "@dndbeyond/character-rules-engine";
+
+import { checkContrast } from "../../utils/Color";
+import GuidedTourButton from "./GuidedTourButton";
+
+interface GuidedTourProps {
+  children?: ReactNode;
+  steps?: StepType[];
+  step?: number;
+  setStep?: SetStateAction<any>;
+  beforeClose?: (target: Element | null) => void;
+  afterOpen?: (target: Element | null) => void;
+  showOnFirstLoad?: boolean;
+  cookieName?: string;
+}
+
+export default ({
+  children,
+  step,
+  setStep,
+  steps = [],
+  beforeClose,
+  afterOpen,
+  showOnFirstLoad,
+  cookieName = "ddbGuidedTour",
+}: GuidedTourProps) => {
+  const [defaultStep, setDefaultStep] = useState(0);
+  const { isDarkMode, backgroundColor, themeColor } = useSelector(
+    rulesEngineSelectors.getCharacterTheme
+  );
+  const bgColor = backgroundColor.slice(0, 7);
+  const accentColor = checkContrast(backgroundColor, themeColor)
+    ? themeColor
+    : "#C53131";
+
+  const handleBeforeClose = () => {
+    const html = document.querySelector("html");
+    if (html) html.style.overflowY = "visible";
+    if (beforeClose) beforeClose(null);
+  };
+
+  const handleAfterOpen = () => {
+    const html = document.querySelector("html");
+    if (html) html.style.overflowY = "hidden";
+    if (afterOpen) afterOpen(null);
+  };
+
+  const handleLoad = (setIsOpen: Dispatch<SetStateAction<boolean>>) => {
+    if (showOnFirstLoad) {
+      const viewedTour = localStorage.getItem(cookieName);
+
+      if (!viewedTour) {
+        setIsOpen(true);
+        localStorage.setItem(cookieName, "true");
+      }
+    }
+  };
+
+  return (
+    <Box
+      sx={{
+        ".reactour__popover": {
+          backgroundColor: `${bgColor} !important`,
+          color: isDarkMode
+            ? "rgba(255,255,255,0.9) !important"
+            : "rgba(0,0,0,0.9) !important",
+          borderRadius: 1,
+          borderWidth: 1,
+          borderStyle: "solid",
+          borderColor: isDarkMode
+            ? "rgba(255,255,255,0.3) !important"
+            : "rgba(0,0,0,0.3) !important",
+        },
+      }}
+    >
+      <TourProvider
+        steps={steps}
+        currentStep={step || defaultStep}
+        setCurrentStep={setStep || setDefaultStep}
+        afterOpen={handleAfterOpen}
+        beforeClose={handleBeforeClose}
+        showDots={false}
+        styles={{
+          badge: (base) => ({
+            ...base,
+            backgroundColor: accentColor,
+            color: bgColor,
+            fontWeight: 700,
+          }),
+          close: (base) => ({
+            ...base,
+            color: isDarkMode ? "rgba(255,255,255,0.9)" : "rgba(0,0,0,0.9)",
+          }),
+          dot: (base, status) => ({
+            ...base,
+            background: status?.current ? accentColor : "transparent",
+            color: status?.current ? accentColor : "transparent",
+          }),
+        }}
+      >
+        <TourContext.Consumer>
+          {({ setIsOpen }) => (
+            <div onLoad={() => handleLoad(setIsOpen)}>
+              {children}
+              <GuidedTourButton />
+            </div>
+          )}
+        </TourContext.Consumer>
+      </TourProvider>
+    </Box>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTourButton/GuidedTourButton.tsx b/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTourButton/GuidedTourButton.tsx
new file mode 100644
index 0000000..7a5c3ca
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTourButton/GuidedTourButton.tsx
@@ -0,0 +1,27 @@
+import QuestionMarkIcon from "@mui/icons-material/QuestionMark";
+import { Button } from "@mui/material";
+import { useTour } from "@reactour/tour";
+
+export default () => {
+  const { setIsOpen } = useTour();
+
+  return (
+    <Button
+      className="ct-character-guided-tour"
+      variant="contained"
+      color="info"
+      onClick={() => setIsOpen(true)}
+      sx={{
+        position: "fixed",
+        zIndex: 9,
+        p: 1,
+        borderRadius: "100%",
+        minWidth: 0,
+        bottom: { xs: 100, md: 20 },
+        right: 20,
+      }}
+    >
+      <QuestionMarkIcon />
+    </Button>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTourButton/index.ts b/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTourButton/index.ts
new file mode 100644
index 0000000..cd0f1d4
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTourButton/index.ts
@@ -0,0 +1,4 @@
+import GuidedTourButton from "./GuidedTourButton";
+
+export default GuidedTourButton;
+export { GuidedTourButton };
diff --git a/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTourStep/GuidedTourStep.tsx b/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTourStep/GuidedTourStep.tsx
new file mode 100644
index 0000000..d9e4b11
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/GuidedTour/GuidedTourStep/GuidedTourStep.tsx
@@ -0,0 +1,50 @@
+import { Button, Typography } from "@mui/material";
+import { useTour } from "@reactour/tour";
+import { useSelector } from "react-redux";
+
+import { rulesEngineSelectors } from "@dndbeyond/character-rules-engine";
+
+import { checkContrast } from "../../../utils/Color";
+
+export default ({ title, content, showClose = false }) => {
+  const { themeColor, backgroundColor, isDarkMode } = useSelector(
+    rulesEngineSelectors.getCharacterTheme
+  );
+  const { setIsOpen } = useTour();
+  const accentColor = checkContrast(backgroundColor, themeColor)
+    ? themeColor
+    : "#C53131";
+
+  return (
+    <>
+      <Typography variant="h4" component="p" mb={1}>
+        {title}
+      </Typography>
+      <Typography
+        component="div"
+        variant="body2"
+        sx={{ a: { color: accentColor, textDecoration: "none" } }}
+      >
+        {content}
+      </Typography>
+      {showClose && (
+        <Button
+          variant="outlined"
+          onClick={() => setIsOpen(false)}
+          sx={{
+            display: "inherit",
+            my: 1,
+            mx: "auto",
+            fontSize: 12,
+            color: isDarkMode
+              ? "rgba(255,255,255,0.9) !important"
+              : "rgba(0,0,0,0.9) !important",
+            borderColor: accentColor,
+          }}
+        >
+          Start Playing!
+        </Button>
+      )}
+    </>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/containers/ItemDetailAbilities/ItemDetailAbilities.tsx b/ddb_main/tools/js/Shared/containers/ItemDetailAbilities/ItemDetailAbilities.tsx
new file mode 100644
index 0000000..b6212b0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/ItemDetailAbilities/ItemDetailAbilities.tsx
@@ -0,0 +1,260 @@
+import React, { useContext } from "react";
+import { connect } from "react-redux";
+
+import {
+  rulesEngineSelectors,
+  AbilityLookup,
+  DataOriginRefData,
+  InventoryManager,
+  Item,
+  ItemUtils,
+  LimitedUseUtils,
+  Spell,
+  SpellUtils,
+  RuleData,
+  ItemManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { SpellName } from "~/components/SpellName";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import SlotManager from "../../components/SlotManager";
+import SlotManagerLarge from "../../components/SlotManagerLarge";
+import { InventoryManagerContext } from "../../managers/InventoryManagerContext";
+import { appEnvSelectors } from "../../selectors";
+import { SharedAppState } from "../../stores/typings";
+import { PaneIdentifierUtils } from "../../utils";
+
+interface Props {
+  item: Item;
+  largePoolMinAmount: number;
+  abilityLookup: AbilityLookup;
+  ruleData: RuleData;
+  dataOriginRefData: DataOriginRefData;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  inventoryManager: InventoryManager;
+  paneHistoryPush: PaneInfo["paneHistoryPush"];
+}
+class ItemDetailAbilities extends React.PureComponent<Props> {
+  static defaultProps = {
+    largePoolMinAmount: 11,
+  };
+
+  handleSlotUseSet = (uses: number): void => {
+    const { item: itemData } = this.props;
+
+    const item = ItemManager.getItem(ItemUtils.getMappingId(itemData));
+
+    item.handleItemLimitedUseSet(uses);
+  };
+
+  handleSpellDetailClick = (id: number): void => {
+    const { paneHistoryPush } = this.props;
+
+    paneHistoryPush(
+      PaneComponentEnum.CHARACTER_SPELL_DETAIL,
+      PaneIdentifierUtils.generateCharacterSpell(id)
+    );
+  };
+
+  renderSmallAmountSlotPool = (): React.ReactNode => {
+    const { ruleData, abilityLookup, item, proficiencyBonus } = this.props;
+
+    let limitedUse = ItemUtils.getLimitedUse(item);
+    if (limitedUse === null) {
+      return null;
+    }
+
+    const numberUsed = LimitedUseUtils.getNumberUsed(limitedUse);
+    const maxUses = LimitedUseUtils.deriveMaxUses(
+      limitedUse,
+      abilityLookup,
+      ruleData,
+      proficiencyBonus
+    );
+
+    return (
+      <SlotManager
+        used={numberUsed}
+        available={maxUses}
+        size={"small"}
+        onSet={this.handleSlotUseSet}
+      />
+    );
+  };
+
+  renderLargeAmountSlotPool = (): React.ReactNode => {
+    const { ruleData, abilityLookup, item, isReadonly, proficiencyBonus } =
+      this.props;
+
+    let limitedUse = ItemUtils.getLimitedUse(item);
+    if (limitedUse === null) {
+      return null;
+    }
+
+    const numberUsed = LimitedUseUtils.getNumberUsed(limitedUse);
+    const maxUses = LimitedUseUtils.deriveMaxUses(
+      limitedUse,
+      abilityLookup,
+      ruleData,
+      proficiencyBonus
+    );
+
+    return (
+      <SlotManagerLarge
+        available={maxUses}
+        used={numberUsed}
+        onSet={this.handleSlotUseSet}
+        isReadonly={isReadonly}
+      />
+    );
+  };
+
+  renderLimitedUses = (): React.ReactNode => {
+    const {
+      item,
+      largePoolMinAmount,
+      abilityLookup,
+      ruleData,
+      proficiencyBonus,
+      inventoryManager,
+    } = this.props;
+
+    let limitedUse = ItemUtils.getLimitedUse(item);
+    if (!limitedUse) {
+      return null;
+    }
+
+    let initialMaxUses = LimitedUseUtils.getInitialMaxUses(limitedUse);
+    if (initialMaxUses === 0) {
+      return null;
+    }
+
+    let maxUses = LimitedUseUtils.deriveMaxUses(
+      limitedUse,
+      abilityLookup,
+      ruleData,
+      proficiencyBonus
+    );
+    if (!maxUses) {
+      return null;
+    }
+
+    const canUseCharges = inventoryManager.canUseItemCharges(item);
+
+    return canUseCharges ? (
+      <div className="ct-item-detail-abilities__limited-uses">
+        <div className="ct-item-detail-abilities__limited-uses-label">
+          Charges
+        </div>
+        <div className="ct-item-detail-abilities__limited-uses-manager">
+          {maxUses >= largePoolMinAmount
+            ? this.renderLargeAmountSlotPool()
+            : this.renderSmallAmountSlotPool()}
+        </div>
+      </div>
+    ) : null;
+  };
+
+  renderSpell = (spell: Spell): React.ReactNode => {
+    const { dataOriginRefData } = this.props;
+
+    let limitedUse = SpellUtils.getLimitedUse(spell);
+
+    let limitedUseNode: React.ReactNode = "At Will";
+    if (limitedUse) {
+      let minConsumed = LimitedUseUtils.getMinNumberConsumed(limitedUse);
+      let maxConsumed = LimitedUseUtils.getMaxNumberConsumed(limitedUse);
+
+      if (minConsumed === maxConsumed || minConsumed === null) {
+        limitedUseNode = `${maxConsumed} Charge${maxConsumed === 1 ? "" : "s"}`;
+      } else {
+        limitedUseNode = `${minConsumed}-${maxConsumed} Charges`;
+      }
+    }
+
+    return (
+      <div
+        className="ct-item-detail-abilities__spell"
+        key={SpellUtils.getUniqueKey(spell)}
+      >
+        <div
+          className="ct-item-detail-abilities__spell-name"
+          onClick={this.handleSpellDetailClick.bind(
+            this,
+            SpellUtils.getMappingId(spell)
+          )}
+        >
+          <SpellName
+            spell={spell}
+            showLegacy={true}
+            dataOriginRefData={dataOriginRefData}
+          />
+        </div>
+        <div className="ct-item-detail-abilities__spell-usage">
+          {limitedUseNode}
+        </div>
+      </div>
+    );
+  };
+
+  renderSpells = (): React.ReactNode => {
+    const { item } = this.props;
+
+    const spells = ItemUtils.getSpells(item);
+    if (!spells || !spells.length) {
+      return null;
+    }
+
+    return (
+      <div className="ct-item-detail-abilities__spells">
+        {spells.map((spell) => this.renderSpell(spell))}
+      </div>
+    );
+  };
+
+  render() {
+    let limitedUseNode = this.renderLimitedUses();
+    let spellsNode = this.renderSpells();
+
+    if (!limitedUseNode && !spellsNode) {
+      return null;
+    }
+
+    return (
+      <div className="ct-item-detail-abilities">
+        {limitedUseNode}
+        {spellsNode}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    abilityLookup: rulesEngineSelectors.getAbilityLookup(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    dataOriginRefData: rulesEngineSelectors.getDataOriginRefData(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+  };
+}
+
+const ItemDetailAbilitiesWrapper = (props) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  return (
+    <ItemDetailAbilities
+      inventoryManager={inventoryManager}
+      paneHistoryPush={paneHistoryPush}
+      {...props}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(ItemDetailAbilitiesWrapper);
diff --git a/ddb_main/tools/js/Shared/containers/ItemDetailAbilities/index.ts b/ddb_main/tools/js/Shared/containers/ItemDetailAbilities/index.ts
new file mode 100644
index 0000000..828005e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/ItemDetailAbilities/index.ts
@@ -0,0 +1,4 @@
+import ItemDetailAbilities from "./ItemDetailAbilities";
+
+export default ItemDetailAbilities;
+export { ItemDetailAbilities };
diff --git a/ddb_main/tools/js/Shared/containers/ItemDetailActions/ItemDetailActions.tsx b/ddb_main/tools/js/Shared/containers/ItemDetailActions/ItemDetailActions.tsx
new file mode 100644
index 0000000..d0b0539
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/ItemDetailActions/ItemDetailActions.tsx
@@ -0,0 +1,450 @@
+import React from "react";
+import { useContext } from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  rulesEngineSelectors,
+  CampaignUtils,
+  serviceDataActions,
+  Constants,
+  Container,
+  ContainerUtils,
+  InventoryManager,
+  InfusionUtils,
+  Item,
+  ItemUtils,
+  RuleData,
+  GroupedMenuOption,
+  serviceDataSelectors,
+  PartyInfo,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Button } from "~/components/Button";
+import { Popover } from "~/components/Popover";
+import { PopoverContent } from "~/components/PopoverContent";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import SimpleQuantity from "../../components/SimpleQuantity";
+import {
+  RemoveButton,
+  ThemeButton,
+  ThemeButtonWithMenu,
+} from "../../components/common/Button";
+import { InventoryManagerContext } from "../../managers/InventoryManagerContext";
+import * as appEnvSelectors from "../../selectors/appEnv";
+import { SharedAppState } from "../../stores/typings";
+import { PaneIdentifierUtils } from "../../utils";
+
+interface LabelLookup {
+  consume: string;
+  remove: string;
+  unequip: string;
+  equip: string;
+  attune: string;
+  unattune: string;
+}
+
+interface Props extends DispatchProp {
+  item: Item;
+  hasMaxAttunedItems: boolean;
+  ruleData: RuleData;
+  isReadonly: boolean;
+  containers: Array<Container>;
+  onPostRemoveNavigation?: PaneComponentEnum;
+  partyInfo: PartyInfo | null;
+  inventoryManager: InventoryManager;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+interface State {
+  quantity: number;
+  newQuantity: number;
+}
+class ItemDetailActions extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    hasMaxAttunedItems: false,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      quantity: ItemUtils.getQuantity(props.item),
+      newQuantity: ItemUtils.getQuantity(props.item),
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { item } = this.props;
+
+    const nextQuantity = ItemUtils.getQuantity(item);
+    if (nextQuantity !== prevState.quantity) {
+      this.setState({
+        quantity: nextQuantity,
+        newQuantity: nextQuantity,
+      });
+    }
+  }
+
+  handleQuantityUpdate = (newValue: number): void => {
+    const { item, inventoryManager } = this.props;
+
+    inventoryManager.handleQuantitySet({ item, quantity: newValue });
+  };
+
+  handleRemove = (): void => {
+    const { paneHistoryStart, item, onPostRemoveNavigation, inventoryManager } =
+      this.props;
+
+    if (onPostRemoveNavigation) {
+      paneHistoryStart(onPostRemoveNavigation);
+    }
+
+    inventoryManager.handleRemove({ item });
+
+    if (ItemUtils.isContainer(item)) {
+      paneHistoryStart(PaneComponentEnum.EQUIPMENT_MANAGE);
+    }
+  };
+
+  handleRemoveInfusion = (): void => {
+    const { dispatch, paneHistoryStart, item } = this.props;
+
+    const infusion = ItemUtils.getInfusion(item);
+    if (infusion) {
+      const infusionId = InfusionUtils.getId(infusion);
+      if (infusionId === null) {
+        return;
+      }
+
+      if (
+        InfusionUtils.getType(infusion) === Constants.InfusionTypeEnum.REPLICATE
+      ) {
+        const choiceKey = InfusionUtils.getChoiceKey(infusion);
+        if (choiceKey !== null) {
+          paneHistoryStart(
+            PaneComponentEnum.INFUSION_CHOICE,
+            PaneIdentifierUtils.generateInfusionChoice(choiceKey)
+          );
+        }
+      }
+
+      dispatch(
+        serviceDataActions.infusionMappingDestroy(
+          infusionId,
+          InfusionUtils.getInventoryMappingId(infusion)
+        )
+      );
+    }
+  };
+
+  handleRemoveInfusions = (itemIds: Array<number>): void => {
+    const { dispatch } = this.props;
+
+    itemIds.forEach((id) => {
+      dispatch(serviceDataActions.infusionMappingsDestroy(itemIds));
+    });
+  };
+
+  handleUnequip = (): void => {
+    const { inventoryManager, item } = this.props;
+    inventoryManager.handleUnequip({ item });
+  };
+
+  handleEquip = (): void => {
+    const { inventoryManager, item } = this.props;
+    inventoryManager.handleEquip({ item });
+  };
+
+  handleAttune = (): void => {
+    const { inventoryManager, item } = this.props;
+
+    inventoryManager.handleEquip({ item });
+    inventoryManager.handleAttune({ item });
+  };
+
+  handleUnattune = (): void => {
+    const { inventoryManager, item } = this.props;
+
+    inventoryManager.handleUnattune({ item });
+  };
+
+  handleMove = (containerDefinitionKey: string): void => {
+    const { inventoryManager, item } = this.props;
+
+    inventoryManager.handleMove({ item, containerDefinitionKey });
+  };
+
+  getLabels = (): LabelLookup => {
+    return {
+      consume: "Consume",
+      remove: "Delete Item",
+      unequip: "Unequip",
+      equip: "Equip",
+      attune: "Attune",
+      unattune: "Unattune",
+    };
+  };
+
+  getContainerOptions = (): Array<GroupedMenuOption> => {
+    const { containers, item, partyInfo } = this.props;
+
+    return ContainerUtils.getGroupedOptions(
+      ItemUtils.getContainerDefinitionKey(item),
+      containers,
+      "Move To:",
+      partyInfo
+        ? CampaignUtils.getSharingState(partyInfo)
+        : Constants.PartyInventorySharingStateEnum.OFF
+    );
+  };
+
+  renderRemove = (): React.ReactNode => {
+    const { item, containers, isReadonly, inventoryManager } = this.props;
+
+    const canRemoveItem = inventoryManager.canRemoveItem(item);
+    if (isReadonly || !canRemoveItem) {
+      return null;
+    }
+
+    const infusion = ItemUtils.getInfusion(item);
+
+    const name = ItemUtils.getName(item);
+    const isContainer = ItemUtils.isContainer(item);
+
+    if (isContainer) {
+      const container = containers.find((container) => {
+        return (
+          ContainerUtils.getContainerType(container) ===
+            Constants.ContainerTypeEnum.ITEM &&
+          ContainerUtils.getMappingId(container) ===
+            ItemUtils.getMappingId(item)
+        );
+      });
+
+      if (container) {
+        if (infusion) {
+          return (
+            <RemoveButton
+              onClick={this.handleRemove}
+              className="ct-item-detail__action"
+              data-testid="remove-infusion-button"
+            >
+              Remove Infusion
+            </RemoveButton>
+          );
+        }
+        const hasInfusions = ContainerUtils.hasInfusions(container);
+
+        return (
+          <Popover
+            trigger={
+              <Button size="xx-small" variant="outline" themed>
+                Delete
+              </Button>
+            }
+            position="bottom"
+            data-testid="delete-item-button"
+            maxWidth={250}
+          >
+            <PopoverContent
+              title={`Remove ${name}?`}
+              content={`Removing the ${name} will also remove all of its ${
+                hasInfusions ? "infusions and " : " "
+              } contents.`}
+              confirmText="Delete"
+              onConfirm={() => this.handleRemove()}
+              withCancel
+            />
+          </Popover>
+          // <RemoveButtonWithModal
+          //   className="ct-item-detail__action"
+          //   style={"outline"}
+          //   size="small"
+          //   modalTitle={`Delete ${name}?`}
+          //   modalContent={`Deleting the ${name} will also delete all of its${
+          //     hasInfusions ? " infusions and" : ""
+          //   } contents.`}
+          //   confirmCallback={() => {
+          //     this.handleRemove();
+          //   }}
+          //   data-testid="delete-item-button"
+          // />
+        );
+      }
+    }
+
+    if (infusion) {
+      return (
+        <RemoveButton
+          onClick={this.handleRemoveInfusion}
+          className="ct-item-detail__action"
+          data-testid="remove-infusion-button"
+        >
+          Remove Infusion
+        </RemoveButton>
+      );
+    }
+
+    return (
+      <RemoveButton
+        onClick={this.handleRemove}
+        className="ct-item-detail__action"
+        data-testid="delete-item-button"
+      >
+        Delete
+      </RemoveButton>
+    );
+  };
+
+  render() {
+    const {
+      item,
+      hasMaxAttunedItems,
+      isReadonly,
+      containers,
+      inventoryManager,
+    } = this.props;
+
+    const labels = this.getLabels();
+    const containerMoveOptions = this.getContainerOptions();
+    const isEquipped = ItemUtils.isEquipped(item);
+    const isAttuned = ItemUtils.isAttuned(item);
+    const isStackable = ItemUtils.isStackable(item);
+    const quantity = ItemUtils.getQuantity(item);
+    const isContainer = ItemUtils.getDefinitionIsContainer(item);
+    const parentContainer = ContainerUtils.getItemParentContainer(
+      containers,
+      ItemUtils.getContainerDefinitionKey(item)
+    );
+    if (!parentContainer) {
+      return null;
+    }
+    const canEquip = inventoryManager.canEquipUnequipItem(item);
+    const canAttune = inventoryManager.canAttuneUnattuneItem(item);
+    const canModifyQuantity = inventoryManager.canModifyQuantity(item);
+    const canMoveItem =
+      inventoryManager.canMoveItem(item) &&
+      !isContainer &&
+      !isReadonly &&
+      !!containers.length;
+    const canShareItem = inventoryManager.canShareItem(item) && !isReadonly;
+    const canClaimItem = inventoryManager.canClaimItem(item) && !isReadonly;
+
+    return (
+      <div className="ct-item-detail__actions">
+        {isStackable && (
+          <SimpleQuantity
+            quantity={quantity}
+            onUpdate={this.handleQuantityUpdate}
+            isReadonly={isReadonly || !canModifyQuantity}
+          />
+        )}
+
+        {canEquip && !isReadonly && (
+          <ThemeButton
+            onClick={isEquipped ? this.handleUnequip : this.handleEquip}
+            style={isEquipped ? "" : "outline"}
+            size="small"
+            className="ct-item-detail__action"
+            data-testid="equip-item-button"
+          >
+            {isEquipped ? labels.unequip : labels.equip}
+          </ThemeButton>
+        )}
+        {canAttune && !isReadonly && (
+          <ThemeButton
+            onClick={isAttuned ? this.handleUnattune : this.handleAttune}
+            style={isAttuned ? "" : "outline"}
+            size="small"
+            disabled={hasMaxAttunedItems && !isAttuned}
+            className="ct-item-detail__action"
+            data-testid="attune-item-button"
+          >
+            {isAttuned ? labels.unattune : labels.attune}
+          </ThemeButton>
+        )}
+        {canShareItem && (
+          <ThemeButton
+            style="outline"
+            onClick={() => {
+              const definitionKey =
+                inventoryManager.getPartyEquipmentContainerDefinitionKey();
+              if (definitionKey) {
+                this.handleMove(definitionKey);
+              }
+            }}
+            size="small"
+            className="ct-item-detail__action"
+            data-testid="move-item-button"
+          >
+            Move
+          </ThemeButton>
+        )}
+        {canClaimItem && (
+          <ThemeButton
+            style="outline"
+            onClick={() => {
+              const definitionKey =
+                inventoryManager.getCharacterContainerDefinitionKey();
+              if (definitionKey) {
+                this.handleMove(definitionKey);
+              }
+            }}
+            size="small"
+            className="ct-item-detail__action"
+            data-testid="move-item-button"
+          >
+            Move
+          </ThemeButton>
+        )}
+        {canMoveItem && (
+          <ThemeButtonWithMenu
+            buttonStyle="outline"
+            containerEl={
+              document.querySelector(".ct-sidebar__portal") as HTMLElement
+            }
+            className="ct-item-detail__action"
+            groupedOptions={containerMoveOptions}
+            showSingleOption={true}
+            onSelect={this.handleMove}
+          >
+            Move
+          </ThemeButtonWithMenu>
+        )}
+        {this.renderRemove()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    hasMaxAttunedItems: rulesEngineSelectors.hasMaxAttunedItems(state),
+    containers: rulesEngineSelectors.getInventoryContainers(state),
+    partyInfo: serviceDataSelectors.getPartyInfo(state),
+  };
+}
+
+function ItemDetailActionsContainer(props) {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return (
+    <ItemDetailActions
+      inventoryManager={inventoryManager}
+      paneHistoryStart={paneHistoryStart}
+      {...props}
+    />
+  );
+}
+
+export default connect(mapStateToProps)(ItemDetailActionsContainer);
diff --git a/ddb_main/tools/js/Shared/containers/ItemDetailActions/index.ts b/ddb_main/tools/js/Shared/containers/ItemDetailActions/index.ts
new file mode 100644
index 0000000..a7bf97c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/ItemDetailActions/index.ts
@@ -0,0 +1,4 @@
+import ItemDetailActions from "./ItemDetailActions";
+
+export default ItemDetailActions;
+export { ItemDetailActions };
diff --git a/ddb_main/tools/js/Shared/containers/SpellDetailCaster/SpellDetailCaster.tsx b/ddb_main/tools/js/Shared/containers/SpellDetailCaster/SpellDetailCaster.tsx
new file mode 100644
index 0000000..aeefc53
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/SpellDetailCaster/SpellDetailCaster.tsx
@@ -0,0 +1,19 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import { rulesEngineSelectors } from "@dndbeyond/character-rules-engine/es";
+
+import SpellCaster from "../../components/SpellCaster";
+import * as appEnvSelectors from "../../selectors/appEnv";
+import { SharedAppState } from "../../stores/typings";
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    abilityLookup: rulesEngineSelectors.getAbilityLookup(state),
+    spellCasterInfo: rulesEngineSelectors.getSpellCasterInfo(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+export default connect(mapStateToProps)(SpellCaster);
diff --git a/ddb_main/tools/js/Shared/containers/SpellDetailCaster/index.ts b/ddb_main/tools/js/Shared/containers/SpellDetailCaster/index.ts
new file mode 100644
index 0000000..31aaa1e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/SpellDetailCaster/index.ts
@@ -0,0 +1,4 @@
+import SpellDetailCaster from "./SpellDetailCaster";
+
+export default SpellDetailCaster;
+export { SpellDetailCaster };
diff --git a/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipment.tsx b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipment.tsx
new file mode 100644
index 0000000..a05a700
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipment.tsx
@@ -0,0 +1,908 @@
+import axios, { Canceler } from "axios";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  Button,
+  LoadingPlaceholder,
+  Select,
+} from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiAdapterUtils,
+  ApiResponse,
+  Background,
+  BackgroundUtils,
+  BaseItemDefinitionContract,
+  characterActions,
+  CharClass,
+  ClassUtils,
+  Constants,
+  ContainerUtils,
+  DiceContract,
+  DiceUtils,
+  HelperUtils,
+  Modifier,
+  RuleData,
+  rulesEngineSelectors,
+  StartingEquipmentContract,
+  StartingEquipmentSlotContract,
+  TypeValueLookup,
+  DefinitionUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Link } from "~/components/Link";
+
+// TODO need to remove this builder reference and replace with better heading
+import PageSubHeader from "../../../CharacterBuilder/components/PageSubHeader";
+import { ThemeButton } from "../../components/common/Button";
+import DataLoadingStatusEnum from "../../constants/DataLoadingStatusEnum";
+import * as apiCreatorSelectors from "../../selectors/composite/apiCreator";
+import { SharedAppState } from "../../stores/typings";
+import { AppLoggerUtils, AppNotificationUtils } from "../../utils";
+import StartingEquipmentSlots from "./StartingEquipmentSlots";
+import { StartingEquipmentRuleSlotSelection } from "./typings";
+
+//duplicated from characterActions typingParts to avoid import issues
+interface StartingEquipmentAddRequestPayloadItem {
+  containerEntityId: number | null;
+  containerEntityTypeId: number | null;
+  entityId: number;
+  entityTypeId: number;
+  quantity: number;
+}
+//duplicated from characterActions typingParts to avoid import issues
+interface StartingEquipmentAddRequestPayload {
+  items: Array<StartingEquipmentAddRequestPayloadItem>;
+  gold: number;
+  custom: Array<string>;
+}
+
+type StartingEquipmentChoice = "equipment" | "gold";
+type RuleSlotChoiceKey = "startingClass" | "background";
+
+interface RuleChoiceGroupSelectionPayload {
+  groupKey: RuleSlotChoiceKey;
+  slotIdx: number;
+  ruleSlotIdx: number;
+  ruleIdx: number;
+  dataId: number | null;
+  activeRuleSlotIdx: number | null;
+}
+
+interface RuleChoiceGroupClearPayload {
+  groupKey: RuleSlotChoiceKey;
+}
+
+interface Props extends DispatchProp {
+  isInitialView: boolean;
+  onStartingEquipmentChoose?: () => void;
+  startingClass: CharClass | null;
+  background: Background | null;
+  loadClassStartingEquipment: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<StartingEquipmentContract>>;
+  loadBackgroundStartingEquipment: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<StartingEquipmentContract>>;
+  globalModifiers: Array<Modifier>;
+  valueLookupByType: TypeValueLookup;
+  ruleData: RuleData;
+  characterId: number;
+}
+
+interface SlotChoiceInfoState {
+  activeRuleSlots: Array<number | null>;
+  dataValues: Record<string, number | null>;
+}
+type RuleSlotChoicesState = Record<RuleSlotChoiceKey, SlotChoiceInfoState>;
+interface State {
+  activeChoice: StartingEquipmentChoice | null;
+  startingRules: Record<RuleSlotChoiceKey, StartingEquipmentContract>;
+  loadingStatus: DataLoadingStatusEnum;
+  loadingRuleTypes: Array<RuleSlotChoiceKey>;
+  ruleSlotChoices: RuleSlotChoicesState;
+  rolledGoldTotal: number | null;
+}
+class StartingEquipment extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    isInitialView: false,
+  };
+
+  loadRuleCancelers: Array<Canceler> = [];
+  defaultStartingRules: Record<RuleSlotChoiceKey, StartingEquipmentContract> = {
+    startingClass: {
+      slots: [],
+    },
+    background: {
+      slots: [],
+    },
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      activeChoice: null,
+      startingRules: this.defaultStartingRules,
+      loadingStatus: DataLoadingStatusEnum.NOT_INITIALIZED,
+      loadingRuleTypes: [],
+      ruleSlotChoices: {
+        startingClass: {
+          activeRuleSlots: [],
+          dataValues: {},
+        },
+        background: {
+          activeRuleSlots: [],
+          dataValues: {},
+        },
+      },
+      rolledGoldTotal: null,
+    };
+  }
+
+  componentDidMount() {
+    const {
+      background,
+      startingClass,
+      loadClassStartingEquipment,
+      loadBackgroundStartingEquipment,
+    } = this.props;
+
+    let requests: Array<
+      ApiAdapterPromise<ApiResponse<StartingEquipmentContract>>
+    > = [];
+    let loadingRuleTypes: Array<RuleSlotChoiceKey> = [];
+    if (
+      background !== null &&
+      !BackgroundUtils.getHasCustomBackground(background)
+    ) {
+      requests.push(
+        loadBackgroundStartingEquipment({
+          cancelToken: new axios.CancelToken((c) => {
+            this.loadRuleCancelers.push(c);
+          }),
+        })
+      );
+      loadingRuleTypes.push("background");
+    }
+    if (startingClass !== null) {
+      requests.push(
+        loadClassStartingEquipment({
+          cancelToken: new axios.CancelToken((c) => {
+            this.loadRuleCancelers.push(c);
+          }),
+        })
+      );
+      loadingRuleTypes.push("startingClass");
+    }
+
+    this.setState({
+      loadingStatus: DataLoadingStatusEnum.LOADING,
+      loadingRuleTypes,
+    });
+
+    axios
+      .all(requests)
+      .then((responses) => {
+        this.setState((prevState: State) => {
+          let startingRules: Record<
+            RuleSlotChoiceKey,
+            StartingEquipmentContract
+          > = prevState.startingRules;
+
+          for (var i = 0; i < responses.length; i++) {
+            let response = responses[i];
+            let loadingRuleType = prevState.loadingRuleTypes[i];
+            let rules = ApiAdapterUtils.getResponseData(response);
+
+            startingRules = {
+              ...startingRules,
+              [loadingRuleType]: rules,
+            };
+          }
+
+          return {
+            startingRules,
+            loadingStatus: DataLoadingStatusEnum.LOADED,
+          };
+        });
+        this.loadRuleCancelers = [];
+      })
+      .catch(AppLoggerUtils.handleAdhocApiError);
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadRuleCancelers.length > 0) {
+      this.loadRuleCancelers.forEach((cancel) => {
+        cancel();
+      });
+    }
+  }
+
+  handleChoiceClick = (choiceKey: StartingEquipmentChoice): void => {
+    this.setState((prevState: State) => ({
+      activeChoice: choiceKey,
+      ruleSlotChoices:
+        prevState.activeChoice !== choiceKey
+          ? this.getRuleSlotChoicesDefaultState(prevState.startingRules)
+          : prevState.ruleSlotChoices,
+    }));
+  };
+
+  handleRuleSelection = (
+    groupKey: RuleSlotChoiceKey,
+    slotIdx: number,
+    ruleSlotIdx: number,
+    ruleIdx: number,
+    dataId: number | null
+  ): void => {
+    this.setState((prevState: State) => {
+      return this.reduceSelectionForRuleChoiceGroup(prevState, {
+        groupKey,
+        slotIdx,
+        ruleSlotIdx,
+        ruleIdx,
+        dataId,
+        activeRuleSlotIdx:
+          prevState.ruleSlotChoices[groupKey].activeRuleSlots[slotIdx],
+      });
+    });
+  };
+
+  handleRuleSlotSelection = (
+    groupKey: RuleSlotChoiceKey,
+    slotIdx: number,
+    selectedRuleData: Array<StartingEquipmentRuleSlotSelection>
+  ): void => {
+    if (!selectedRuleData.length) {
+      return;
+    }
+
+    this.setState((prevState: State) => {
+      let modifiedState = prevState;
+
+      selectedRuleData.forEach((ruleData) => {
+        const { ruleSlotIdx, ruleIdx, dataId } = ruleData;
+        let activeRuleSlotIdx =
+          prevState.ruleSlotChoices[groupKey].activeRuleSlots[slotIdx] ===
+          ruleSlotIdx
+            ? null
+            : ruleSlotIdx;
+        modifiedState = this.reduceSelectionForRuleChoiceGroup(modifiedState, {
+          groupKey,
+          slotIdx,
+          ruleSlotIdx,
+          ruleIdx,
+          dataId,
+          activeRuleSlotIdx,
+        });
+      });
+
+      return modifiedState;
+    });
+  };
+
+  handleStartingEquipmentAdd = (): void => {
+    const { dispatch, onStartingEquipmentChoose } = this.props;
+
+    const startingEquipment = this.getCurrentStartingEquipmentSelected();
+    dispatch(
+      characterActions.startingEquipmentAddRequest(
+        startingEquipment,
+        AppNotificationUtils.handleStartingEquipmentAccepted,
+        AppNotificationUtils.handleStartingEquipmentRejected
+      )
+    );
+
+    if (onStartingEquipmentChoose) {
+      onStartingEquipmentChoose();
+    }
+  };
+
+  handleStartingGoldAdd = (): void => {
+    const { dispatch, onStartingEquipmentChoose } = this.props;
+
+    dispatch(
+      characterActions.startingGoldAddRequest(
+        this.getStartingGoldTotal(),
+        AppNotificationUtils.handleStartingGoldAccepted
+      )
+    );
+
+    if (onStartingEquipmentChoose) {
+      onStartingEquipmentChoose();
+    }
+  };
+
+  handleClearStartingEquipment = (): void => {
+    this.setState((prevState: State) => {
+      let modifiedState = prevState;
+
+      Object.keys(prevState.ruleSlotChoices).forEach(
+        (groupKey: RuleSlotChoiceKey) => {
+          modifiedState = this.reduceClearForRuleChoiceGroup(modifiedState, {
+            groupKey,
+          });
+        }
+      );
+
+      return modifiedState;
+    });
+  };
+
+  handleRandomizeGold = (): void => {
+    const { startingClass } = this.props;
+
+    if (startingClass) {
+      const wealthDice = this.getStartingClassWealthDice();
+      if (wealthDice) {
+        this.setState({
+          rolledGoldTotal: DiceUtils.getDiceRandomValue(wealthDice),
+        });
+      }
+    }
+  };
+
+  handleGoldRolledNumberChange = (value: string): void => {
+    this.setState({
+      rolledGoldTotal: HelperUtils.parseInputInt(value),
+    });
+  };
+
+  getRuleSlotChoicesDefaultState = (
+    startingRules: Record<RuleSlotChoiceKey, StartingEquipmentContract>
+  ): RuleSlotChoicesState => {
+    let background = this.getSlotDefaultState(
+      startingRules.background && startingRules.background.slots
+        ? startingRules.background.slots
+        : []
+    );
+    let startingClass = this.getSlotDefaultState(
+      startingRules.startingClass && startingRules.startingClass.slots
+        ? startingRules.startingClass.slots
+        : []
+    );
+
+    return {
+      background,
+      startingClass,
+    };
+  };
+
+  getDataKey(slotIdx: number, ruleSlotIdx: number, ruleIdx: number): string {
+    return `${slotIdx}-${ruleSlotIdx}-${ruleIdx}`;
+  }
+
+  getSlotDefaultState(
+    slots: Array<StartingEquipmentSlotContract>
+  ): SlotChoiceInfoState {
+    return slots.reduce(
+      (slotAcc, slot, slotIdx): SlotChoiceInfoState => {
+        let slotDataValues: Record<string, null> = {};
+        if (slot.ruleSlots !== null) {
+          slot.ruleSlots.reduce(
+            (acc, ruleSlot, ruleSlotIdx): Record<string, null> => {
+              if (ruleSlot.rules !== null) {
+                ruleSlot.rules.forEach((rule, ruleIdx) => {
+                  if (rule.definitions !== null) {
+                    rule.definitions.forEach((dataItem, dataId) => {
+                      acc = {
+                        ...acc,
+                        [this.getDataKey(slotIdx, ruleSlotIdx, ruleIdx)]: null,
+                      };
+                    });
+                  }
+                });
+              }
+              return acc;
+            },
+            {}
+          );
+        }
+
+        return {
+          activeRuleSlots: [...slotAcc.activeRuleSlots, null],
+          dataValues: {
+            ...slotAcc.dataValues,
+            ...slotDataValues,
+          },
+        };
+      },
+      { activeRuleSlots: [], dataValues: {} }
+    );
+  }
+
+  reduceSelectionForRuleChoiceGroup = (
+    state: State,
+    payload: RuleChoiceGroupSelectionPayload
+  ): State => {
+    const {
+      groupKey,
+      slotIdx,
+      ruleSlotIdx,
+      ruleIdx,
+      dataId,
+      activeRuleSlotIdx,
+    } = payload;
+
+    return {
+      ...state,
+      ruleSlotChoices: {
+        ...state.ruleSlotChoices,
+        [groupKey]: {
+          activeRuleSlots: [
+            ...state.ruleSlotChoices[groupKey].activeRuleSlots.slice(
+              0,
+              slotIdx
+            ),
+            activeRuleSlotIdx,
+            ...state.ruleSlotChoices[groupKey].activeRuleSlots.slice(
+              slotIdx + 1
+            ),
+          ],
+          dataValues: {
+            ...state.ruleSlotChoices[groupKey].dataValues,
+            [this.getDataKey(slotIdx, ruleSlotIdx, ruleIdx)]: dataId,
+          },
+        },
+      },
+    };
+  };
+
+  processSlotGroups = (
+    groupData: StartingEquipmentContract | null,
+    groupChoices: SlotChoiceInfoState
+  ): StartingEquipmentAddRequestPayload => {
+    const { characterId } = this.props;
+    let items: Array<StartingEquipmentAddRequestPayloadItem> = [];
+    let gold: number = 0;
+    let custom: Array<string> = [];
+    let slotGroups: StartingEquipmentAddRequestPayload = {
+      items,
+      gold,
+      custom,
+    };
+
+    if (!groupData || groupData.slots === null) {
+      return slotGroups;
+    }
+
+    groupData.slots.forEach((slot, slotIdx) => {
+      let activeRuleSlotIdx = groupChoices.activeRuleSlots[slotIdx];
+      if (activeRuleSlotIdx === null) {
+        return;
+      }
+
+      if (slot.ruleSlots === null) {
+        return;
+      }
+
+      slot.ruleSlots.forEach((ruleSlot, ruleSlotIdx) => {
+        if (activeRuleSlotIdx !== ruleSlotIdx) {
+          return;
+        }
+
+        if (ruleSlot.rules === null) {
+          return;
+        }
+
+        ruleSlot.rules.forEach((rule, ruleIdx) => {
+          let dataKey = this.getDataKey(slotIdx, ruleSlotIdx, ruleIdx);
+
+          if (groupChoices.activeRuleSlots[slotIdx] === null) {
+            return;
+          }
+
+          const characterContainerDefinitionKey =
+            ContainerUtils.getCharacterContainerDefinitionKey(characterId);
+
+          switch (rule.ruleType) {
+            case Constants.StartingEquipmentRuleTypeEnum.ARMOR:
+            case Constants.StartingEquipmentRuleTypeEnum.ARMOR_TYPE:
+            case Constants.StartingEquipmentRuleTypeEnum.GEAR:
+            case Constants.StartingEquipmentRuleTypeEnum.GEAR_TYPE:
+            case Constants.StartingEquipmentRuleTypeEnum.WEAPON:
+            case Constants.StartingEquipmentRuleTypeEnum.WEAPON_TYPE:
+              let activeDataId = groupChoices.dataValues[dataKey];
+              if (activeDataId === null) {
+                return;
+              }
+
+              let item: BaseItemDefinitionContract | null | undefined =
+                rule.definitions &&
+                rule.definitions.find(
+                  (dataItem) => dataItem.id === activeDataId
+                );
+              if (item) {
+                items.push({
+                  containerEntityId: DefinitionUtils.hack__getDefinitionKeyId(
+                    characterContainerDefinitionKey
+                  ),
+                  containerEntityTypeId:
+                    DefinitionUtils.hack__getDefinitionKeyType(
+                      characterContainerDefinitionKey
+                    ),
+                  entityId: item.id,
+                  entityTypeId: item.entityTypeId,
+                  quantity: rule.quantity ? rule.quantity : 1,
+                });
+              }
+              break;
+            case Constants.StartingEquipmentRuleTypeEnum.GOLD_VALUE:
+              let ruleGold = rule.gold;
+              if (ruleGold !== null) {
+                gold += ruleGold;
+              }
+              break;
+            case Constants.StartingEquipmentRuleTypeEnum.CUSTOM:
+              if (rule.custom !== null) {
+                custom.push(rule.custom);
+              }
+              break;
+
+            default:
+            // not implemented
+          }
+        });
+      });
+    });
+
+    return {
+      ...slotGroups,
+      gold,
+    };
+  };
+
+  getCurrentStartingEquipmentSelected =
+    (): StartingEquipmentAddRequestPayload => {
+      const { startingRules, ruleSlotChoices } = this.state;
+      const {
+        startingClass: classStartingEquipment,
+        background: backgroundStartingEquipment,
+      } = startingRules;
+
+      let startingClassAdds = this.processSlotGroups(
+        classStartingEquipment,
+        ruleSlotChoices.startingClass
+      );
+      let backgroundAdds = this.processSlotGroups(
+        backgroundStartingEquipment,
+        ruleSlotChoices.background
+      );
+
+      let items: Array<StartingEquipmentAddRequestPayloadItem> = [
+        ...startingClassAdds.items,
+        ...backgroundAdds.items,
+      ];
+
+      let gold: number = startingClassAdds.gold + backgroundAdds.gold;
+
+      let custom: Array<string> = [
+        ...startingClassAdds.custom,
+        ...backgroundAdds.custom,
+      ];
+
+      return {
+        items,
+        gold,
+        custom,
+      };
+    };
+
+  isStartingEquipmentEmpty = (): boolean => {
+    const startingEquipment = this.getCurrentStartingEquipmentSelected();
+    return (
+      !startingEquipment.items.length &&
+      !startingEquipment.gold &&
+      !startingEquipment.custom.length
+    );
+  };
+
+  reduceClearForRuleChoiceGroup = (
+    state: State,
+    payload: RuleChoiceGroupClearPayload
+  ): State => {
+    const { groupKey } = payload;
+    return {
+      ...state,
+      ruleSlotChoices: {
+        ...state.ruleSlotChoices,
+        [groupKey]: {
+          ...state.ruleSlotChoices[groupKey],
+          activeRuleSlots: state.ruleSlotChoices[groupKey].activeRuleSlots.map(
+            (ruleSlot) => null
+          ),
+        },
+      },
+    };
+  };
+
+  getStartingGoldTotal = (): number => {
+    const { rolledGoldTotal } = this.state;
+
+    if (!rolledGoldTotal) {
+      return 0;
+    }
+
+    const wealthDice = this.getStartingClassWealthDice();
+    let diceMultiplier: number = 1;
+    if (wealthDice && wealthDice.diceMultiplier) {
+      diceMultiplier = wealthDice.diceMultiplier;
+    }
+
+    return rolledGoldTotal * diceMultiplier;
+  };
+
+  getStartingClassName = (): string | null => {
+    const { startingClass } = this.props;
+
+    if (!startingClass) {
+      return null;
+    }
+
+    return ClassUtils.getName(startingClass);
+  };
+
+  getStartingClassWealthDice = (): DiceContract | null => {
+    const { startingClass } = this.props;
+
+    if (!startingClass) {
+      return null;
+    }
+
+    return ClassUtils.getWealthDice(startingClass);
+  };
+
+  renderGoldChoiceUi = (): React.ReactNode => {
+    const { rolledGoldTotal } = this.state;
+    const { startingClass } = this.props;
+
+    if (startingClass) {
+      const wealthDice = this.getStartingClassWealthDice();
+
+      let diceCount: number | null = null;
+      let diceMultiplier: number | null = null;
+      let diceValue: number | null = null;
+      let diceValues: Array<number> = [];
+      if (wealthDice !== null) {
+        diceCount = DiceUtils.getCount(wealthDice);
+        diceMultiplier = DiceUtils.getMultiplier(wealthDice);
+        diceValue = DiceUtils.getValue(wealthDice);
+        diceValues = DiceUtils.getDiceValuesRange(wealthDice);
+      }
+
+      const diceOptions = diceValues.map((value) => ({
+        value,
+        label: value,
+      }));
+
+      let totalGold = this.getStartingGoldTotal();
+
+      return (
+        <div className="starting-equipment-gold">
+          <div className="starting-equipment-gold-explanation">
+            {this.getStartingClassName()} Starting Gold:
+          </div>
+          <div className="starting-equipment-gold-entry">
+            <div className="starting-equipment-gold-entry-actions">
+              <Link onClick={this.handleRandomizeGold}>Randomize</Link>
+            </div>
+            <div className="starting-equipment-gold-entry-input">
+              <Select
+                placeholder={`${diceCount}d${diceValue}`}
+                options={diceOptions}
+                onChange={this.handleGoldRolledNumberChange}
+                value={rolledGoldTotal}
+              />
+            </div>
+            <div className="starting-equipment-gold-entry-multiplier">
+              {diceMultiplier ? ` x ${diceMultiplier} ` : ""} gp
+            </div>
+            {totalGold !== null && (
+              <div className="starting-equipment-gold-entry-total">
+                = {totalGold} gp
+              </div>
+            )}
+          </div>
+          <div className="starting-equipment-gold-actions">
+            <Button
+              onClick={this.handleStartingGoldAdd}
+              disabled={rolledGoldTotal === null}
+            >
+              Add Starting Gold
+            </Button>
+          </div>
+        </div>
+      );
+    }
+
+    return (
+      <div className="starting-equipment-requirements-missing">
+        Choose a class to view starting gold.
+      </div>
+    );
+  };
+
+  renderEquipmentChoiceUi = (): React.ReactNode => {
+    const {
+      background,
+      startingClass,
+      globalModifiers,
+      ruleData,
+      valueLookupByType,
+    } = this.props;
+    const { startingRules, ruleSlotChoices } = this.state;
+
+    const classStartingEquipment = HelperUtils.lookupDataOrFallback(
+      startingRules,
+      "startingClass"
+    );
+    const backgroundStartingEquipment = HelperUtils.lookupDataOrFallback(
+      startingRules,
+      "background"
+    );
+
+    let hasCustomBackground: boolean =
+      background !== null && BackgroundUtils.getHasCustomBackground(background);
+    let hasValidStartingClass: boolean =
+      startingClass !== null && classStartingEquipment !== null;
+    let hasValidBackground: boolean =
+      background !== null &&
+      backgroundStartingEquipment !== null &&
+      !hasCustomBackground;
+
+    if (!hasValidStartingClass && !hasValidBackground) {
+      return (
+        <div className="starting-equipment-requirements-missing">
+          Choose a class
+          {hasCustomBackground ? " " : " or background "}
+          to view starting equipment options.
+        </div>
+      );
+    }
+
+    return (
+      <div className="starting-equipment-gear">
+        {hasValidStartingClass &&
+          classStartingEquipment !== null &&
+          classStartingEquipment.slots !== null && (
+            <div>
+              <PageSubHeader>
+                {this.getStartingClassName()} Starting Equipment
+              </PageSubHeader>
+              <StartingEquipmentSlots
+                slots={classStartingEquipment.slots}
+                onRuleSelection={this.handleRuleSelection.bind(
+                  this,
+                  "startingClass"
+                )}
+                onRuleSlotSelection={this.handleRuleSlotSelection.bind(
+                  this,
+                  "startingClass"
+                )}
+                activeRuleSlots={ruleSlotChoices.startingClass.activeRuleSlots}
+                globalModifiers={globalModifiers}
+                valueLookupByType={valueLookupByType}
+                ruleData={ruleData}
+              />
+            </div>
+          )}
+        {hasValidBackground &&
+          backgroundStartingEquipment !== null &&
+          backgroundStartingEquipment.slots !== null && (
+            <div>
+              <PageSubHeader>
+                {background ? BackgroundUtils.getName(background) : ""} Starting
+                Equipment
+              </PageSubHeader>
+              <StartingEquipmentSlots
+                slots={backgroundStartingEquipment.slots}
+                onRuleSelection={this.handleRuleSelection.bind(
+                  this,
+                  "background"
+                )}
+                onRuleSlotSelection={this.handleRuleSlotSelection.bind(
+                  this,
+                  "background"
+                )}
+                activeRuleSlots={ruleSlotChoices.background.activeRuleSlots}
+                globalModifiers={globalModifiers}
+                valueLookupByType={valueLookupByType}
+                ruleData={ruleData}
+              />
+            </div>
+          )}
+        <div className="starting-equipment-gear-actions">
+          <ThemeButton onClick={this.handleStartingEquipmentAdd}>
+            {this.isStartingEquipmentEmpty() ? "Skip " : "Add "} Starting
+            Equipment
+          </ThemeButton>
+          <Link onClick={this.handleClearStartingEquipment}>Clear All</Link>
+        </div>
+      </div>
+    );
+  };
+
+  renderUi = (): React.ReactNode => {
+    const { isInitialView, startingClass } = this.props;
+    const { loadingStatus, activeChoice } = this.state;
+
+    if (loadingStatus !== DataLoadingStatusEnum.LOADED) {
+      return null;
+    }
+
+    const wealthDice = this.getStartingClassWealthDice();
+    if (startingClass && !wealthDice) {
+      return this.renderEquipmentChoiceUi();
+    }
+
+    return (
+      <div className="starting-equipment-ui">
+        {isInitialView && (
+          <div className="starting-equipment-choices-label">Choose</div>
+        )}
+        <div className="starting-equipment-choices">
+          <div
+            className={`starting-equipment-choice ${
+              activeChoice === "equipment"
+                ? "starting-equipment-info-choice-active"
+                : ""
+            }`}
+            onClick={this.handleChoiceClick.bind(this, "equipment")}
+          >
+            Equipment
+          </div>
+          <div className="starting-equipment-choice-sep">or</div>
+          <div
+            className={`starting-equipment-choice ${
+              activeChoice === "gold"
+                ? "starting-equipment-info-choice-active"
+                : ""
+            }`}
+            onClick={this.handleChoiceClick.bind(this, "gold")}
+          >
+            Gold
+          </div>
+        </div>
+        {activeChoice === "equipment" && this.renderEquipmentChoiceUi()}
+        {activeChoice === "gold" && this.renderGoldChoiceUi()}
+      </div>
+    );
+  };
+
+  renderLoading = (): React.ReactNode => {
+    return <LoadingPlaceholder />;
+  };
+
+  render() {
+    const { loadingStatus } = this.state;
+
+    let contentNode: React.ReactNode;
+    if (loadingStatus === DataLoadingStatusEnum.LOADED) {
+      contentNode = this.renderUi();
+    } else {
+      contentNode = this.renderLoading();
+    }
+
+    return <div className="starting-equipment">{contentNode}</div>;
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    startingClass: rulesEngineSelectors.getStartingClass(state),
+    background: rulesEngineSelectors.getBackgroundInfo(state),
+    loadBackgroundStartingEquipment:
+      apiCreatorSelectors.makeLoadBackgroundStartingEquipment(state),
+    loadClassStartingEquipment:
+      apiCreatorSelectors.makeLoadClassStartingEquipment(state),
+    globalModifiers: rulesEngineSelectors.getValidGlobalModifiers(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    valueLookupByType:
+      rulesEngineSelectors.getCharacterValueLookupByType(state),
+    characterId: rulesEngineSelectors.getId(state),
+  };
+}
+export default connect(mapStateToProps)(StartingEquipment);
diff --git a/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlot/StartingEquipmentRuleSlot.tsx b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlot/StartingEquipmentRuleSlot.tsx
new file mode 100644
index 0000000..a52dd65
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlot/StartingEquipmentRuleSlot.tsx
@@ -0,0 +1,300 @@
+import React from "react";
+
+import { Checkbox, Select } from "@dndbeyond/character-components/es";
+import {
+  BaseItemDefinitionContract,
+  Constants,
+  HelperUtils,
+  ItemUtils,
+  RuleData,
+  SourceUtils,
+  StartingEquipmentRuleContract,
+  StartingEquipmentUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+
+import { TypeScriptUtils } from "../../../utils";
+import { StartingEquipmentRuleSlotSelection } from "../typings";
+
+interface Props {
+  isMultiSlot: boolean;
+  rules: Array<StartingEquipmentRuleContract>;
+  name: string | null;
+  slotIdx: number;
+  onRuleSlotSelection: (
+    selections: Array<StartingEquipmentRuleSlotSelection>
+  ) => void;
+  onRuleSelection: (
+    slotIdx: number,
+    ruleIdx: number,
+    dataId: number | null
+  ) => void;
+  isActive: boolean;
+  isSelected: boolean;
+  isDisabled: boolean;
+  ruleData: RuleData;
+}
+export default class StartingEquipmentRuleSlot extends React.PureComponent<Props> {
+  static defaultProps = {
+    isMultiSlot: false,
+    rules: [],
+    name: "",
+    slotIdx: 0,
+    isActive: true,
+    isSelected: false,
+    isDisabled: false,
+  };
+
+  componentDidMount() {
+    const { isMultiSlot, rules } = this.props;
+
+    if (
+      !isMultiSlot &&
+      rules.length &&
+      rules[0].ruleType !== Constants.StartingEquipmentRuleTypeEnum.INSTRUCTION
+    ) {
+      this.handleSelection();
+    }
+  }
+
+  handleSelection = (): void => {
+    const { rules, onRuleSlotSelection, slotIdx, isDisabled } = this.props;
+
+    if (isDisabled) {
+      return;
+    }
+
+    if (onRuleSlotSelection) {
+      onRuleSlotSelection(
+        rules
+          .filter(
+            (rule) =>
+              rule.ruleType !==
+              Constants.StartingEquipmentRuleTypeEnum.INSTRUCTION
+          )
+          .map((rule, ruleIdx): StartingEquipmentRuleSlotSelection => {
+            let defaultDataId: number = 0;
+
+            if (
+              StartingEquipmentUtils.deriveIsEquipmentStartingEquipmentRuleType(
+                rule.ruleType
+              ) &&
+              rule.definitions &&
+              rule.definitions.length
+            ) {
+              let firstItem = rule.definitions[0];
+              defaultDataId = firstItem.id;
+            }
+
+            let dataId: number | null;
+            if (rule.definitions && rule.definitions.length === 1) {
+              dataId = defaultDataId;
+            } else {
+              dataId = null;
+            }
+
+            return {
+              ruleSlotIdx: slotIdx,
+              ruleIdx,
+              dataId,
+            };
+          })
+      );
+    }
+  };
+
+  handleRuleSelection = (ruleIdx: number, id: string): void => {
+    const { onRuleSelection, slotIdx, isDisabled } = this.props;
+
+    if (isDisabled) {
+      return;
+    }
+
+    if (onRuleSelection) {
+      onRuleSelection(slotIdx, ruleIdx, HelperUtils.parseInputInt(id));
+    }
+  };
+
+  render() {
+    const {
+      rules,
+      name,
+      isMultiSlot,
+      isActive,
+      isSelected,
+      isDisabled,
+      ruleData,
+    } = this.props;
+
+    let classNames: Array<string> = ["starting-equipment-rule-slot"];
+    if ((!isMultiSlot || (isMultiSlot && isActive)) && !isDisabled) {
+      classNames.push("starting-equipment-rule-slot-active");
+    } else {
+      classNames.push("starting-equipment-rule-slot-inactive");
+    }
+    if (isSelected) {
+      classNames.push("starting-equipment-rule-slot-selected");
+    }
+    if (isDisabled) {
+      classNames.push("starting-equipment-rule-slot-disabled");
+    }
+
+    let isInstruction: boolean = !!rules.find(
+      (rule) =>
+        rule.ruleType === Constants.StartingEquipmentRuleTypeEnum.INSTRUCTION
+    );
+    let isOnlyInstruction: boolean = false;
+    if (
+      isInstruction &&
+      !rules.find(
+        (rule) =>
+          rule.ruleType !== Constants.StartingEquipmentRuleTypeEnum.INSTRUCTION
+      )
+    ) {
+      isOnlyInstruction = true;
+      classNames.push("starting-equipment-rule-slot-instruction");
+    }
+
+    let hasCustom: boolean = !!rules.find(
+      (rule) => rule.ruleType === Constants.StartingEquipmentRuleTypeEnum.CUSTOM
+    );
+    let hasMixedCustom: boolean = false;
+    if (
+      hasCustom &&
+      rules.find(
+        (rule) =>
+          rule.ruleType !== Constants.StartingEquipmentRuleTypeEnum.CUSTOM
+      )
+    ) {
+      hasMixedCustom = true;
+    }
+
+    let itemPacks: Array<BaseItemDefinitionContract> = rules
+      .filter((rule) => {
+        let isPack: boolean = false;
+        if (rule.definitions && rule.definitions.length) {
+          let firstItem = rule.definitions[0];
+          isPack = ItemUtils.isDefinitionPack(firstItem);
+        }
+
+        return (
+          isPack &&
+          rule.ruleType === Constants.StartingEquipmentRuleTypeEnum.GEAR
+        );
+      })
+      .map((rule) => rule.definitions && rule.definitions[0])
+      .filter(TypeScriptUtils.isNotNullOrUndefined);
+
+    return (
+      <div
+        className={classNames.join(" ")}
+        onClick={isOnlyInstruction ? undefined : this.handleSelection}
+      >
+        <div className="starting-equipment-rule-slot-selection">
+          {!isOnlyInstruction && (
+            <div className="starting-equipment-rule-slot-checkmark">
+              <Checkbox
+                initiallyEnabled={isSelected}
+                onChange={this.handleSelection}
+                stopPropagation={true}
+              />
+            </div>
+          )}
+        </div>
+        <div className="starting-equipment-rule-content">
+          <div className="starting-equipment-rule-slot-name">{name}</div>
+          {isDisabled && (
+            <div className="starting-equipment-disabled-message">
+              Missing required proficiency
+            </div>
+          )}
+          {isSelected && (
+            <div className="starting-equipment-rules">
+              {rules.map((rule, ruleIdx) => {
+                const { definitions, ruleType } = rule;
+
+                let contentNode: React.ReactNode;
+                if (
+                  ruleType === Constants.StartingEquipmentRuleTypeEnum.ARMOR ||
+                  ruleType === Constants.StartingEquipmentRuleTypeEnum.GEAR ||
+                  ruleType === Constants.StartingEquipmentRuleTypeEnum.WEAPON ||
+                  ruleType ===
+                    Constants.StartingEquipmentRuleTypeEnum.ARMOR_TYPE ||
+                  ruleType ===
+                    Constants.StartingEquipmentRuleTypeEnum.GEAR_TYPE ||
+                  ruleType ===
+                    Constants.StartingEquipmentRuleTypeEnum.WEAPON_TYPE
+                ) {
+                  if (definitions && definitions.length > 1) {
+                    const groupedOptions =
+                      SourceUtils.getGroupedOptionsBySourceCategory(
+                        definitions,
+                        ruleData
+                      );
+                    contentNode = (
+                      <div className="starting-equipment-rule">
+                        <Select
+                          options={groupedOptions}
+                          value={null}
+                          preventClickPropagating={true}
+                          onChange={this.handleRuleSelection.bind(
+                            this,
+                            ruleIdx
+                          )}
+                        />
+                      </div>
+                    );
+                  }
+                }
+
+                if (!contentNode) {
+                  return null;
+                }
+
+                return (
+                  <div className="starting-equipment-rule" key={ruleIdx}>
+                    {contentNode}
+                  </div>
+                );
+              })}
+              {itemPacks.length > 0 && (
+                <div className="starting-equipment-packs">
+                  {(itemPacks as any).map(
+                    (itemDefinition: BaseItemDefinitionContract) => (
+                      <div
+                        className="starting-equipment-pack"
+                        key={itemDefinition.id}
+                      >
+                        {itemPacks.length > 1 && (
+                          <div className="starting-equipment-pack-name">
+                            {itemDefinition.name}
+                          </div>
+                        )}
+                        {itemDefinition.description && (
+                          <HtmlContent
+                            className="starting-equipment-pack-desc"
+                            html={itemDefinition.description}
+                            withoutTooltips
+                          />
+                        )}
+                      </div>
+                    )
+                  )}
+                </div>
+              )}
+              {hasCustom && (
+                <div className="starting-equipment-custom-add">
+                  <div className="starting-equipment-custom-add-label">
+                    {hasMixedCustom ? "Some item(s) " : "Item(s) "}
+                    will be added to <strong>Other Possessions</strong>
+                  </div>
+                </div>
+              )}
+            </div>
+          )}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlot/index.ts b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlot/index.ts
new file mode 100644
index 0000000..9d569ec
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlot/index.ts
@@ -0,0 +1,4 @@
+import StartingEquipmentRuleSlot from "./StartingEquipmentRuleSlot";
+
+export default StartingEquipmentRuleSlot;
+export { StartingEquipmentRuleSlot };
diff --git a/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlots/StartingEquipmentRuleSlots.tsx b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlots/StartingEquipmentRuleSlots.tsx
new file mode 100644
index 0000000..273ced3
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlots/StartingEquipmentRuleSlots.tsx
@@ -0,0 +1,102 @@
+import React from "react";
+
+import {
+  BaseItemDefinitionContract,
+  Modifier,
+  RuleData,
+  StartingEquipmentRuleSlotContract,
+  TypeValueLookup,
+} from "@dndbeyond/character-rules-engine/es";
+import { Constants, ItemUtils } from "@dndbeyond/character-rules-engine/es";
+
+import StartingEquipmentRuleSlot from "../StartingEquipmentRuleSlot";
+import { StartingEquipmentRuleSlotSelection } from "../typings";
+
+interface Props {
+  ruleSlots: Array<StartingEquipmentRuleSlotContract>;
+  onRuleSlotSelection: (
+    selections: Array<StartingEquipmentRuleSlotSelection>
+  ) => void;
+  onRuleSelection: (
+    slotIdx: number,
+    ruleIdx: number,
+    dataId: number | null
+  ) => void;
+  activeIdx: number | null;
+  globalModifiers: Array<Modifier>;
+  valueLookupByType: TypeValueLookup;
+  ruleData: RuleData;
+}
+export default class StartingEquipmentRuleSlots extends React.PureComponent<Props> {
+  static defaultProps = {
+    activeIdx: null,
+  };
+
+  isRuleSlotDisabled = (
+    ruleSlot: StartingEquipmentRuleSlotContract
+  ): boolean => {
+    const { globalModifiers, valueLookupByType, ruleData } = this.props;
+
+    let isDisabled: boolean = false;
+    let proficiencyRuleTypes: Array<Constants.StartingEquipmentRuleTypeEnum> = [
+      Constants.StartingEquipmentRuleTypeEnum.WEAPON,
+      Constants.StartingEquipmentRuleTypeEnum.ARMOR,
+    ];
+
+    if (ruleSlot.rules) {
+      ruleSlot.rules
+        .filter(
+          (rule) =>
+            rule.proficiencyRequired &&
+            proficiencyRuleTypes.includes(rule.ruleType)
+        )
+        .forEach((rule) => {
+          if (rule.definitions) {
+            rule.definitions.forEach((item: BaseItemDefinitionContract) => {
+              let simulatedItem = ItemUtils.simulateItem(
+                item,
+                globalModifiers,
+                valueLookupByType,
+                ruleData
+              );
+              if (!ItemUtils.hasProficiency(simulatedItem)) {
+                isDisabled = true;
+              }
+            });
+          }
+        });
+    }
+
+    return isDisabled;
+  };
+
+  render() {
+    const {
+      ruleSlots,
+      activeIdx,
+      onRuleSelection,
+      onRuleSlotSelection,
+      ruleData,
+    } = this.props;
+
+    return (
+      <div className="starting-equipment-rule-slots">
+        {ruleSlots.map((ruleSlot, ruleSlotIdx) => (
+          <StartingEquipmentRuleSlot
+            key={ruleSlotIdx}
+            isMultiSlot={ruleSlots.length > 1}
+            slotIdx={ruleSlotIdx}
+            onRuleSelection={onRuleSelection}
+            onRuleSlotSelection={onRuleSlotSelection}
+            isActive={activeIdx === null || activeIdx === ruleSlotIdx}
+            isSelected={activeIdx === ruleSlotIdx}
+            isDisabled={this.isRuleSlotDisabled(ruleSlot)}
+            {...ruleSlot}
+            rules={ruleSlot.rules ? ruleSlot.rules : []}
+            ruleData={ruleData}
+          />
+        ))}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlots/index.ts b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlots/index.ts
new file mode 100644
index 0000000..d9f5b1f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentRuleSlots/index.ts
@@ -0,0 +1,4 @@
+import StartingEquipmentRuleSlots from "./StartingEquipmentRuleSlots";
+
+export default StartingEquipmentRuleSlots;
+export { StartingEquipmentRuleSlots };
diff --git a/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentSlots/StartingEquipmentSlots.tsx b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentSlots/StartingEquipmentSlots.tsx
new file mode 100644
index 0000000..e0b48c7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentSlots/StartingEquipmentSlots.tsx
@@ -0,0 +1,58 @@
+import React from "react";
+
+import {
+  Modifier,
+  RuleData,
+  StartingEquipmentSlotContract,
+  TypeValueLookup,
+} from "@dndbeyond/character-rules-engine/es";
+
+import StartingEquipmentRuleSlots from "../StartingEquipmentRuleSlots";
+import { StartingEquipmentRuleSlotSelection } from "../typings";
+
+interface Props {
+  slots: Array<StartingEquipmentSlotContract>;
+  onRuleSlotSelection: (
+    selections: Array<StartingEquipmentRuleSlotSelection>
+  ) => void;
+  onRuleSelection: (
+    slotIdx: number,
+    ruleIdx: number,
+    dataId: number | null
+  ) => void;
+  activeRuleSlots: Array<number | null>;
+  globalModifiers: Array<Modifier>;
+  valueLookupByType: TypeValueLookup;
+  ruleData: RuleData;
+}
+export default class StartingEquipmentSlots extends React.PureComponent<Props> {
+  render() {
+    const {
+      slots,
+      activeRuleSlots,
+      globalModifiers,
+      valueLookupByType,
+      ruleData,
+      onRuleSelection,
+      onRuleSlotSelection,
+    } = this.props;
+
+    return (
+      <div className="starting-equipment-slots">
+        {slots.map((slot, slotIdx) => (
+          <div className="starting-equipment-slot" key={slotIdx}>
+            <StartingEquipmentRuleSlots
+              ruleSlots={slot.ruleSlots ? slot.ruleSlots : []}
+              onRuleSelection={onRuleSelection.bind(this, slotIdx)}
+              onRuleSlotSelection={onRuleSlotSelection.bind(this, slotIdx)}
+              activeIdx={activeRuleSlots[slotIdx]}
+              globalModifiers={globalModifiers}
+              valueLookupByType={valueLookupByType}
+              ruleData={ruleData}
+            />
+          </div>
+        ))}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentSlots/index.ts b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentSlots/index.ts
new file mode 100644
index 0000000..c563949
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/StartingEquipment/StartingEquipmentSlots/index.ts
@@ -0,0 +1,4 @@
+import StartingEquipmentSlots from "./StartingEquipmentSlots";
+
+export default StartingEquipmentSlots;
+export { StartingEquipmentSlots };
diff --git a/ddb_main/tools/js/Shared/containers/StartingEquipment/index.ts b/ddb_main/tools/js/Shared/containers/StartingEquipment/index.ts
new file mode 100644
index 0000000..69a7bd5
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/StartingEquipment/index.ts
@@ -0,0 +1,12 @@
+import StartingEquipment from "./StartingEquipment";
+import StartingEquipmentRuleSlot from "./StartingEquipmentRuleSlot";
+import StartingEquipmentRuleSlots from "./StartingEquipmentRuleSlots";
+import StartingEquipmentSlots from "./StartingEquipmentSlots";
+
+export default StartingEquipment;
+export {
+  StartingEquipment,
+  StartingEquipmentRuleSlot,
+  StartingEquipmentRuleSlots,
+  StartingEquipmentSlots,
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/BlessingPane/BlessingPane.tsx b/ddb_main/tools/js/Shared/containers/panes/BlessingPane/BlessingPane.tsx
new file mode 100644
index 0000000..b7b50e8
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/BlessingPane/BlessingPane.tsx
@@ -0,0 +1,63 @@
+import React, { useContext, useEffect, useState } from "react";
+import { useSelector } from "react-redux";
+
+import {
+  rulesEngineSelectors,
+  FeatureManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { PaneInitFailureContent } from "~/subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import { PaneIdentifiersBlessing } from "~/subApps/sheet/components/Sidebar/types";
+import { Snippet } from "~/tools/js/smartComponents";
+
+import { CharacterFeaturesManagerContext } from "../../../managers/CharacterFeaturesManagerContext";
+
+interface Props {
+  identifiers: PaneIdentifiersBlessing | null;
+}
+const BlessingPane: React.FC<Props> = ({ identifiers }) => {
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+
+  const snippetData = useSelector(rulesEngineSelectors.getSnippetData);
+  // const ruleData = useSelector(rulesEngineSelectors.getRuleData);
+  // const abilityLookup = useSelector(rulesEngineSelectors.getAbilityLookup);
+  // const dataOriginRefData = useSelector(rulesEngineSelectors.getDataOriginRefData);
+  // const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const proficiencyBonus = useSelector(
+    rulesEngineSelectors.getProficiencyBonus
+  );
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+
+  const [blessing, setBlessing] = useState<FeatureManager | null>(undefined!);
+
+  useEffect(() => {
+    const id = identifiers?.id ?? null;
+
+    if (id) {
+      const blessing = characterFeaturesManager.getBlessing(id);
+      setBlessing(blessing);
+    }
+  }, [identifiers, characterFeaturesManager]);
+
+  if (blessing === null) {
+    return <PaneInitFailureContent />;
+  }
+
+  return blessing ? (
+    <div className="ct-blessing-pane" key={blessing.getId()}>
+      <Header>{blessing.getName()}</Header>
+      <Snippet
+        snippetData={snippetData}
+        proficiencyBonus={proficiencyBonus}
+        theme={theme}
+      >
+        {blessing.getDescription()}
+      </Snippet>
+    </div>
+  ) : null;
+};
+
+export default BlessingPane;
diff --git a/ddb_main/tools/js/Shared/containers/panes/BlessingPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/BlessingPane/index.ts
new file mode 100644
index 0000000..0543e1c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/BlessingPane/index.ts
@@ -0,0 +1,4 @@
+import BlessingPane from "./BlessingPane";
+
+export default BlessingPane;
+export { BlessingPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/CharacterSpellPane/CharacterSpellPane.tsx b/ddb_main/tools/js/Shared/containers/panes/CharacterSpellPane/CharacterSpellPane.tsx
new file mode 100644
index 0000000..e3a7dbe
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CharacterSpellPane/CharacterSpellPane.tsx
@@ -0,0 +1,341 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  BaseInventoryContract,
+  rulesEngineSelectors,
+  characterActions,
+  ClassFeatureContract,
+  ClassFeatureUtils,
+  ClassUtils,
+  Constants,
+  DataOriginRefData,
+  EntityUtils,
+  EntityValueLookup,
+  FeatDetailsContract,
+  FeatUtils,
+  FormatUtils,
+  Hack__BaseCharClass,
+  HelperUtils,
+  ItemUtils,
+  InventoryLookup,
+  RacialTraitContract,
+  RacialTraitUtils,
+  Spell,
+  SpellCasterInfo,
+  SpellUtils,
+  ValueUtils,
+  AnySimpleDataType,
+  RuleData,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { EditableName } from "~/components/EditableName";
+import { ItemName } from "~/components/ItemName";
+import { SpellName } from "~/components/SpellName";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Preview } from "~/subApps/sheet/components/Sidebar/components/Preview";
+import {
+  PaneComponentEnum,
+  PaneIdentifiers,
+  PaneIdentifiersCharacterSpell,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { PaneInitFailureContent } from "../../../../../../subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import SpellDetail from "../../../components/SpellDetail";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+import { PaneIdentifierUtils } from "../../../utils";
+
+interface Props extends DispatchProp {
+  spells: Array<Spell>;
+  spellCasterInfo: SpellCasterInfo;
+  ruleData: RuleData;
+  entityValueLookup: EntityValueLookup;
+  inventoryLookup: InventoryLookup;
+  dataOriginRefData: DataOriginRefData;
+  identifiers: PaneIdentifiersCharacterSpell | null;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  paneHistoryPush: PaneInfo["paneHistoryPush"];
+}
+interface State {
+  spell: Spell | null;
+  isCustomizeClosed: boolean;
+}
+class CharacterSpellPane extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = this.generateStateData(props, true);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { spells, identifiers } = this.props;
+
+    if (spells !== prevProps.spells || identifiers !== prevProps.identifiers) {
+      this.setState(
+        this.generateStateData(this.props, prevState.isCustomizeClosed)
+      );
+    }
+  }
+
+  generateStateData = (props: Props, isCustomizeClosed: boolean): State => {
+    const { spells, identifiers } = props;
+
+    let foundSpell: Spell | null | undefined = null;
+    if (identifiers !== null) {
+      foundSpell = spells.find(
+        (spell) => identifiers.id === SpellUtils.getMappingId(spell)
+      );
+    }
+    return {
+      spell: foundSpell ? foundSpell : null,
+      isCustomizeClosed,
+    };
+  };
+
+  handleOpenCustomize = () => {
+    this.setState({ isCustomizeClosed: !this.state.isCustomizeClosed });
+  };
+
+  handleItemShow = (): void => {
+    const { spell } = this.state;
+    const { paneHistoryPush } = this.props;
+
+    if (spell) {
+      const dataOrigin = SpellUtils.getDataOrigin(spell);
+
+      paneHistoryPush(
+        PaneComponentEnum.ITEM_DETAIL,
+        PaneIdentifierUtils.generateItem(
+          ItemUtils.getMappingId(dataOrigin.primary as BaseInventoryContract)
+        )
+      );
+    }
+  };
+
+  handleCustomDataUpdate = (
+    key: number,
+    value: AnySimpleDataType,
+    source: string | null
+  ): void => {
+    const { spell } = this.state;
+    const { dispatch } = this.props;
+
+    if (spell) {
+      dispatch(
+        characterActions.valueSet(
+          key,
+          value,
+          source,
+          ValueUtils.hack__toString(SpellUtils.getMappingId(spell)),
+          ValueUtils.hack__toString(SpellUtils.getMappingEntityTypeId(spell))
+        )
+      );
+    }
+  };
+
+  handleRemoveCustomizations = (): void => {
+    const { spell } = this.state;
+    const { dispatch } = this.props;
+
+    if (spell) {
+      let mappingId = SpellUtils.getMappingId(spell);
+      let mappingEntityTypeId = SpellUtils.getMappingEntityTypeId(spell);
+      if (mappingId !== null && mappingEntityTypeId !== null) {
+        let [contextId, contextTypeId] =
+          SpellUtils.deriveExpandedContextIds(spell);
+
+        dispatch(
+          characterActions.spellCustomizationsDelete(
+            mappingId,
+            mappingEntityTypeId,
+            contextId,
+            contextTypeId
+          )
+        );
+      }
+    }
+  };
+
+  handleParentClick = (): void => {
+    const { spell } = this.state;
+    const { paneHistoryPush } = this.props;
+
+    if (spell === null) {
+      return;
+    }
+
+    let componentType: PaneComponentEnum | null = null;
+    let componentIds: PaneIdentifiers | null = null;
+
+    const spellDataOrigin = SpellUtils.getDataOrigin(spell);
+    const spellDataOriginType = SpellUtils.getDataOriginType(spell);
+    switch (spellDataOriginType) {
+      case Constants.DataOriginTypeEnum.CLASS_FEATURE:
+        componentType = PaneComponentEnum.CLASS_FEATURE_DETAIL;
+        componentIds = PaneIdentifierUtils.generateClassFeature(
+          ClassFeatureUtils.getId(
+            spellDataOrigin.primary as ClassFeatureContract
+          ),
+          ClassUtils.getMappingId(spellDataOrigin.parent as Hack__BaseCharClass)
+        );
+        break;
+
+      case Constants.DataOriginTypeEnum.RACE:
+        componentType = PaneComponentEnum.SPECIES_TRAIT_DETAIL;
+        componentIds = PaneIdentifierUtils.generateRacialTrait(
+          RacialTraitUtils.getId(spellDataOrigin.primary as RacialTraitContract)
+        );
+        break;
+
+      case Constants.DataOriginTypeEnum.FEAT:
+        componentType = PaneComponentEnum.FEAT_DETAIL;
+        componentIds = PaneIdentifierUtils.generateFeat(
+          FeatUtils.getId(spellDataOrigin.primary as FeatDetailsContract)
+        );
+        break;
+
+      default:
+      // not implemented
+    }
+
+    if (componentType !== null && componentIds !== null) {
+      paneHistoryPush(componentType, componentIds);
+    }
+  };
+
+  render() {
+    const { spell, isCustomizeClosed } = this.state;
+    const {
+      spellCasterInfo,
+      identifiers,
+      ruleData,
+      entityValueLookup,
+      inventoryLookup,
+      dataOriginRefData,
+      isReadonly,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    if (spell === null) {
+      return <PaneInitFailureContent />;
+    }
+
+    let parentNode: React.ReactNode;
+    const spellDataOrigin = SpellUtils.getDataOrigin(spell);
+    const spellDataOriginType = SpellUtils.getDataOriginType(spell);
+
+    switch (spellDataOriginType) {
+      case Constants.DataOriginTypeEnum.ITEM:
+        const mappingId = ItemUtils.getMappingId(
+          spellDataOrigin.primary as BaseInventoryContract
+        );
+        const item = HelperUtils.lookupDataOrFallback(
+          inventoryLookup,
+          mappingId
+        );
+        if (item !== null) {
+          parentNode = <ItemName item={item} onClick={this.handleItemShow} />;
+        }
+        break;
+
+      default:
+        if (spellDataOrigin.primary !== null) {
+          parentNode = (
+            <div onClick={this.handleParentClick}>
+              {EntityUtils.getDataOriginName(spellDataOrigin)}
+            </div>
+          );
+        }
+        break;
+    }
+
+    let school = SpellUtils.getSchool(spell);
+    let schoolSlug = FormatUtils.slugify(school);
+    const dataOrigin = SpellUtils.getDataOrigin(spell);
+    const dataOriginType = SpellUtils.getDataOriginType(spell);
+    return (
+      <div className="ct-spell-pane">
+        <Header
+          parent={parentNode}
+          preview={
+            <Preview>
+              <div
+                className={`ct-spell-pane__heading-preview ct-spell-pane__heading-preview--school-${schoolSlug}`}
+              />
+            </Preview>
+          }
+        >
+          {
+            //If the spell is coming from a magic item we should not show the Edit button
+            !dataOrigin ||
+            (dataOrigin &&
+              dataOriginType === Constants.DataOriginTypeEnum.ITEM) ? (
+              <SpellName
+                spell={spell}
+                showSpellLevel={false}
+                dataOriginRefData={dataOriginRefData}
+              />
+            ) : (
+              <EditableName onClick={this.handleOpenCustomize}>
+                <SpellName
+                  spell={spell}
+                  showSpellLevel={false}
+                  dataOriginRefData={dataOriginRefData}
+                />
+              </EditableName>
+            )
+          }
+        </Header>
+        <SpellDetail
+          theme={theme}
+          key={SpellUtils.getUniqueKey(spell)}
+          spell={spell}
+          spellCasterInfo={spellCasterInfo}
+          initialCastLevel={identifiers?.castLevel}
+          ruleData={ruleData}
+          onCustomDataUpdate={this.handleCustomDataUpdate}
+          onCustomizationsRemove={this.handleRemoveCustomizations}
+          entityValueLookup={entityValueLookup}
+          isReadonly={isReadonly}
+          proficiencyBonus={proficiencyBonus}
+          isCustomizeClosed={isCustomizeClosed}
+          onCustomizeClick={this.handleOpenCustomize}
+        />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    spells: rulesEngineSelectors.getCharacterSpells(state),
+    spellCasterInfo: rulesEngineSelectors.getSpellCasterInfo(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    entityValueLookup:
+      rulesEngineSelectors.getCharacterValueLookupByEntity(state),
+    inventoryLookup: rulesEngineSelectors.getInventoryLookup(state),
+    dataOriginRefData: rulesEngineSelectors.getDataOriginRefData(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const CharacterSpellPaneContainer = (props) => {
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  return <CharacterSpellPane paneHistoryPush={paneHistoryPush} {...props} />;
+};
+
+export default connect(mapStateToProps)(CharacterSpellPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/CharacterSpellPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/CharacterSpellPane/index.ts
new file mode 100644
index 0000000..5925e19
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CharacterSpellPane/index.ts
@@ -0,0 +1,4 @@
+import CharacterSpellPane from "./CharacterSpellPane";
+
+export default CharacterSpellPane;
+export { CharacterSpellPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ClassSpellPane/ClassSpellPane.tsx b/ddb_main/tools/js/Shared/containers/panes/ClassSpellPane/ClassSpellPane.tsx
new file mode 100644
index 0000000..1f98a16
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ClassSpellPane/ClassSpellPane.tsx
@@ -0,0 +1,281 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  AnySimpleDataType,
+  Hack__BaseCharClass,
+  rulesEngineSelectors,
+  characterActions,
+  ClassUtils,
+  DataOriginRefData,
+  EntityUtils,
+  EntityValueLookup,
+  FormatUtils,
+  RuleData,
+  Spell,
+  SpellCasterInfo,
+  SpellUtils,
+  ValueUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { EditableName } from "~/components/EditableName";
+import { SpellName } from "~/components/SpellName";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Preview } from "~/subApps/sheet/components/Sidebar/components/Preview";
+import {
+  getDataOriginComponentInfo,
+  getDataOriginRefComponentInfo,
+} from "~/subApps/sheet/components/Sidebar/helpers/paneUtils";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersClassSpell,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { PaneInitFailureContent } from "../../../../../../subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import SpellDetail from "../../../components/SpellDetail";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+
+interface Props extends DispatchProp {
+  spells: Array<Spell>;
+  spellCasterInfo: SpellCasterInfo;
+  ruleData: RuleData;
+  entityValueLookup: EntityValueLookup;
+  dataOriginRefData: DataOriginRefData;
+  identifiers: PaneIdentifiersClassSpell | null;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  paneHistoryPush: PaneInfo["paneHistoryPush"];
+}
+interface State {
+  spell: Spell | null;
+  isCustomizeClosed: boolean;
+}
+class ClassSpellPane extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = this.generateStateData(props, true);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { spells, identifiers } = this.props;
+
+    if (spells !== prevProps.spells || identifiers !== prevProps.identifiers) {
+      this.setState(
+        this.generateStateData(this.props, prevState.isCustomizeClosed)
+      );
+    }
+  }
+
+  generateStateData = (props: Props, isCustomizeClosed: boolean): State => {
+    const { spells, identifiers } = props;
+
+    let foundSpell: Spell | null | undefined = null;
+    if (identifiers !== null) {
+      foundSpell = spells.find(
+        (spell) =>
+          identifiers.spellId === SpellUtils.getMappingId(spell) &&
+          identifiers.classId ===
+            ClassUtils.getMappingId(
+              SpellUtils.getDataOrigin(spell).primary as Hack__BaseCharClass
+            )
+      );
+    }
+
+    return {
+      spell: foundSpell ? foundSpell : null,
+      isCustomizeClosed,
+    };
+  };
+
+  handleOpenCustomize = () => {
+    this.setState({ isCustomizeClosed: !this.state.isCustomizeClosed });
+  };
+
+  handleCustomDataUpdate = (
+    key: number,
+    value: AnySimpleDataType,
+    source: string | null
+  ): void => {
+    const { spell } = this.state;
+    const { dispatch } = this.props;
+
+    if (spell === null) {
+      return;
+    }
+
+    let mappingId = SpellUtils.getMappingId(spell);
+    let mappingEntityTypeId = SpellUtils.getMappingEntityTypeId(spell);
+    let [contextId, contextTypeId] = SpellUtils.deriveExpandedContextIds(spell);
+
+    dispatch(
+      characterActions.valueSet(
+        key,
+        value,
+        source,
+        ValueUtils.hack__toString(mappingId),
+        ValueUtils.hack__toString(mappingEntityTypeId),
+        ValueUtils.hack__toString(contextId),
+        ValueUtils.hack__toString(contextTypeId)
+      )
+    );
+  };
+
+  handleRemoveCustomizations = (): void => {
+    const { spell } = this.state;
+    const { dispatch } = this.props;
+
+    if (spell) {
+      let mappingId = SpellUtils.getMappingId(spell);
+      let mappingEntityTypeId = SpellUtils.getMappingEntityTypeId(spell);
+      if (mappingId !== null && mappingEntityTypeId !== null) {
+        let [contextId, contextTypeId] =
+          SpellUtils.deriveExpandedContextIds(spell);
+
+        dispatch(
+          characterActions.spellCustomizationsDelete(
+            mappingId,
+            mappingEntityTypeId,
+            contextId,
+            contextTypeId
+          )
+        );
+      }
+    }
+  };
+
+  handleParentClick = (): void => {
+    const { spell } = this.state;
+    const { paneHistoryPush, dataOriginRefData } = this.props;
+
+    if (spell === null) {
+      return;
+    }
+
+    let dataOrigin = SpellUtils.getDataOrigin(spell);
+    let component = getDataOriginComponentInfo(dataOrigin);
+
+    let expandedDataOriginRef = SpellUtils.getExpandedDataOriginRef(spell);
+    if (expandedDataOriginRef !== null) {
+      component = getDataOriginRefComponentInfo(
+        expandedDataOriginRef,
+        dataOriginRefData
+      );
+    }
+
+    if (component.type !== PaneComponentEnum.ERROR_404) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  render() {
+    const { spell, isCustomizeClosed } = this.state;
+    const {
+      spellCasterInfo,
+      identifiers,
+      ruleData,
+      entityValueLookup,
+      dataOriginRefData,
+      isReadonly,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    if (spell === null) {
+      return <PaneInitFailureContent />;
+    }
+
+    let school = SpellUtils.getSchool(spell);
+    let schoolSlug = FormatUtils.slugify(school);
+
+    const spellDataOrigin = SpellUtils.getDataOrigin(spell);
+
+    let parentNode: React.ReactNode =
+      EntityUtils.getDataOriginName(spellDataOrigin);
+    let expandedDataOriginRef = SpellUtils.getExpandedDataOriginRef(spell);
+    if (expandedDataOriginRef !== null) {
+      parentNode = (
+        <React.Fragment>
+          {parentNode} &bull;{" "}
+          {EntityUtils.getDataOriginRefName(
+            expandedDataOriginRef,
+            dataOriginRefData
+          )}
+        </React.Fragment>
+      );
+    }
+
+    return (
+      <div className="ct-spell-pane">
+        <Header
+          parent={parentNode}
+          onClick={
+            expandedDataOriginRef !== null ? this.handleParentClick : undefined
+          }
+          preview={
+            <Preview>
+              <div
+                className={`ct-spell-pane__heading-preview ct-spell-pane__heading-preview--school-${schoolSlug}`}
+              />
+            </Preview>
+          }
+        >
+          <EditableName onClick={this.handleOpenCustomize}>
+            <SpellName
+              spell={spell}
+              showSpellLevel={false}
+              dataOriginRefData={dataOriginRefData}
+            />
+          </EditableName>
+        </Header>
+        <SpellDetail
+          theme={theme}
+          key={SpellUtils.getUniqueKey(spell)}
+          spell={spell}
+          spellCasterInfo={spellCasterInfo}
+          ruleData={ruleData}
+          initialCastLevel={identifiers?.castLevel}
+          showActions={false}
+          onCustomDataUpdate={this.handleCustomDataUpdate}
+          onCustomizationsRemove={this.handleRemoveCustomizations}
+          entityValueLookup={entityValueLookup}
+          isReadonly={isReadonly}
+          proficiencyBonus={proficiencyBonus}
+          isCustomizeClosed={isCustomizeClosed}
+          onCustomizeClick={this.handleOpenCustomize}
+        />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    spells: rulesEngineSelectors.getClassSpells(state),
+    spellCasterInfo: rulesEngineSelectors.getSpellCasterInfo(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    entityValueLookup:
+      rulesEngineSelectors.getCharacterValueLookupByEntity(state),
+    dataOriginRefData: rulesEngineSelectors.getDataOriginRefData(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const ClassSpellPaneContainer = (props) => {
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  return <ClassSpellPane paneHistoryPush={paneHistoryPush} {...props} />;
+};
+
+export default connect(mapStateToProps)(ClassSpellPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/ClassSpellPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/ClassSpellPane/index.ts
new file mode 100644
index 0000000..75c7c3e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ClassSpellPane/index.ts
@@ -0,0 +1,4 @@
+import ClassSpellPane from "./ClassSpellPane";
+
+export default ClassSpellPane;
+export { ClassSpellPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePane.tsx b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePane.tsx
new file mode 100644
index 0000000..1c6d6a9
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePane.tsx
@@ -0,0 +1,127 @@
+import { orderBy } from "lodash";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  rulesEngineSelectors,
+  characterActions,
+  ConditionUtils,
+  Condition,
+  Constants,
+  ConditionContract,
+  RuleData,
+  RuleDataUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+
+import * as appEnvSelectors from "../../../selectors/appEnv";
+import { SharedAppState } from "../../../stores/typings";
+import ConditionManagePaneSpecialConditions from "./ConditionManagePaneSpecialConditions";
+import ConditionManagePaneStandardConditions from "./ConditionManagePaneStandardConditions";
+
+interface Props extends DispatchProp {
+  activeConditions: Array<Condition>;
+  ruleData: RuleData;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+class ConditionManagePane extends React.PureComponent<Props> {
+  handleStandardConditionToggle = (
+    condition: ConditionContract,
+    isEnabled: boolean
+  ): void => {
+    const { dispatch } = this.props;
+
+    if (isEnabled) {
+      dispatch(characterActions.conditionAdd(ConditionUtils.getId(condition)));
+    } else {
+      dispatch(
+        characterActions.conditionRemove(ConditionUtils.getId(condition))
+      );
+    }
+  };
+
+  handleSpecialConditionLevelChange = (
+    condition: ConditionContract,
+    conditionLevel: number | null
+  ): void => {
+    const { dispatch, activeConditions } = this.props;
+
+    const conditionId = ConditionUtils.getId(condition);
+    if (conditionLevel === null) {
+      dispatch(characterActions.conditionRemove(conditionId));
+    } else {
+      const foundActiveCondition = activeConditions.find(
+        (activeCondition) =>
+          ConditionUtils.getId(activeCondition) === conditionId
+      );
+
+      if (foundActiveCondition) {
+        dispatch(characterActions.conditionSet(conditionId, conditionLevel));
+      } else {
+        dispatch(characterActions.conditionAdd(conditionId, conditionLevel));
+      }
+    }
+  };
+
+  render() {
+    const { activeConditions, ruleData, isReadonly, theme } = this.props;
+
+    const conditionData = RuleDataUtils.getConditions(ruleData);
+
+    const displayedConditions = orderBy(conditionData, (condition) =>
+      ConditionUtils.getName(condition)
+    );
+    const activeConditionIds = activeConditions.map((condition) =>
+      ConditionUtils.getId(condition)
+    );
+
+    const standardConditions = displayedConditions.filter(
+      (condition) =>
+        ConditionUtils.getType(condition) ===
+        Constants.ConditionTypeEnum.STANDARD
+    );
+    const specialConditions = displayedConditions.filter(
+      (condition) =>
+        ConditionUtils.getType(condition) ===
+        Constants.ConditionTypeEnum.SPECIAL
+    );
+
+    return (
+      <div className="ct-condition-manage-pane">
+        <Header>Conditions</Header>
+        <div className="ct-condition-manage-pane__conditions">
+          <ConditionManagePaneStandardConditions
+            standardConditions={standardConditions}
+            activeConditionIds={activeConditionIds}
+            onConditionToggle={this.handleStandardConditionToggle}
+            isReadonly={isReadonly}
+            theme={theme}
+          />
+        </div>
+        <div className="ct-condition-manage-pane__conditions ct-condition-manage-pane__condition--special">
+          <ConditionManagePaneSpecialConditions
+            specialConditions={specialConditions}
+            activeConditions={activeConditions}
+            isReadonly={isReadonly}
+            onConditionLevelChange={this.handleSpecialConditionLevelChange}
+            theme={theme}
+          />
+        </div>
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    activeConditions: rulesEngineSelectors.getActiveConditions(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+export default connect(mapStateToProps)(ConditionManagePane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialCondition/ConditionManagePaneSpecialCondition.tsx b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialCondition/ConditionManagePaneSpecialCondition.tsx
new file mode 100644
index 0000000..57848bb
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialCondition/ConditionManagePaneSpecialCondition.tsx
@@ -0,0 +1,116 @@
+import React from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+  ConditionIcon,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  ConditionContract,
+  ConditionLevelUtils,
+  ConditionUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { ProgressBar } from "~/subApps/sheet/components/Sidebar/components/ProgressBar";
+
+import ConditionLevelsTable from "../../../../components/ConditionLevelsTable";
+
+interface Props {
+  condition: ConditionContract;
+  conditionLevel: number | null;
+  isActive: boolean;
+  onConditionLevelChange: (
+    condition: ConditionContract,
+    level: number | null
+  ) => void;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+export default class ConditionManagePaneSpecialCondition extends React.PureComponent<Props> {
+  handleLevelChange = (newLevel: number | null): void => {
+    const { onConditionLevelChange, condition } = this.props;
+
+    onConditionLevelChange(condition, newLevel);
+  };
+
+  render() {
+    const { isActive, condition, conditionLevel, isReadonly, theme } =
+      this.props;
+
+    let classNames: Array<string> = ["ct-condition-manage-pane__condition"];
+    if (isActive) {
+      classNames.push("ct-condition-manage-pane__condition--active");
+    }
+
+    const level: React.ReactNode =
+      conditionLevel !== null ? conditionLevel : "--";
+    const name = ConditionUtils.getName(condition);
+
+    const headingNode: React.ReactNode = (
+      <div className="ct-condition-manage-pane__condition-heading">
+        <div className={classNames.join(" ")}>
+          <div className="ct-condition-manage-pane__condition-preview">
+            <ConditionIcon
+              conditionType={ConditionUtils.getId(condition)}
+              isDarkMode={theme.isDarkMode}
+            />
+          </div>
+          <div className="ct-condition-manage-pane__condition-name">{name}</div>
+          <div className="ct-condition-manage-pane__condition-level">
+            Level {level}
+          </div>
+        </div>
+      </div>
+    );
+    //`
+
+    const headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent heading={headingNode} />
+    );
+
+    const levels = ConditionUtils.getDefinitionLevels(condition);
+    let levelNumbers = levels.map((level) =>
+      ConditionLevelUtils.getLevel(level)
+    );
+    const levelEffectLookup = ConditionUtils.getLevelEffectLookup(condition);
+
+    const headerFooterNode: React.ReactNode = (
+      <ProgressBar
+        options={levelNumbers}
+        value={conditionLevel}
+        onClick={this.handleLevelChange}
+        isInteractive={!isReadonly}
+      />
+    );
+
+    const description = ConditionUtils.getDescription(condition);
+
+    return (
+      <div key={ConditionUtils.getUniqueKey(condition)}>
+        <Collapsible
+          layoutType={"minimal"}
+          header={headerNode}
+          headerFooter={headerFooterNode}
+        >
+          <div className="ct-condition-manage-pane__condition-content">
+            <HtmlContent
+              className="ct-condition-manage-pane__condition-description"
+              html={description ? description : ""}
+              withoutTooltips
+            />
+            <ConditionLevelsTable
+              conditionName={name}
+              levels={levelNumbers}
+              activeLevel={conditionLevel}
+              isInteractive={!isReadonly}
+              onLevelChange={this.handleLevelChange}
+              levelEffectLookup={levelEffectLookup}
+            />
+          </div>
+        </Collapsible>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialCondition/index.ts b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialCondition/index.ts
new file mode 100644
index 0000000..95239de
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialCondition/index.ts
@@ -0,0 +1,4 @@
+import ConditionManagePaneSpecialCondition from "./ConditionManagePaneSpecialCondition";
+
+export default ConditionManagePaneSpecialCondition;
+export { ConditionManagePaneSpecialCondition };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialConditions/ConditionManagePaneSpecialConditions.tsx b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialConditions/ConditionManagePaneSpecialConditions.tsx
new file mode 100644
index 0000000..f9ff813
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialConditions/ConditionManagePaneSpecialConditions.tsx
@@ -0,0 +1,59 @@
+import React from "react";
+
+import {
+  CharacterTheme,
+  Condition,
+  ConditionContract,
+  ConditionUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import ConditionManagePaneSpecialCondition from "../ConditionManagePaneSpecialCondition";
+
+interface Props {
+  specialConditions: Array<ConditionContract>;
+  activeConditions: Array<Condition>;
+  isReadonly: boolean;
+  onConditionLevelChange: (
+    condition: ConditionContract,
+    level: number | null
+  ) => void;
+  theme: CharacterTheme;
+}
+export default class ConditionManagePaneSpecialConditions extends React.PureComponent<Props> {
+  render() {
+    const {
+      specialConditions,
+      activeConditions,
+      isReadonly,
+      onConditionLevelChange,
+      theme,
+    } = this.props;
+
+    return (
+      <React.Fragment>
+        {specialConditions.map((condition) => {
+          let activeCondition = activeConditions.find(
+            (activeCondition) =>
+              ConditionUtils.getId(activeCondition) ===
+              ConditionUtils.getId(condition)
+          );
+          let conditionLevel: number | null = activeCondition
+            ? ConditionUtils.getActiveLevel(activeCondition)
+            : null;
+
+          return (
+            <ConditionManagePaneSpecialCondition
+              key={ConditionUtils.getUniqueKey(condition)}
+              isActive={!!activeCondition}
+              condition={condition}
+              onConditionLevelChange={onConditionLevelChange}
+              conditionLevel={conditionLevel}
+              isReadonly={isReadonly}
+              theme={theme}
+            />
+          );
+        })}
+      </React.Fragment>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialConditions/index.ts b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialConditions/index.ts
new file mode 100644
index 0000000..c10d77f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneSpecialConditions/index.ts
@@ -0,0 +1,4 @@
+import ConditionManagePaneSpecialConditions from "./ConditionManagePaneSpecialConditions";
+
+export default ConditionManagePaneSpecialConditions;
+export { ConditionManagePaneSpecialConditions };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardCondition/ConditionManagePaneStandardCondition.tsx b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardCondition/ConditionManagePaneStandardCondition.tsx
new file mode 100644
index 0000000..feb8c48
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardCondition/ConditionManagePaneStandardCondition.tsx
@@ -0,0 +1,79 @@
+import React from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  ConditionContract,
+  ConditionUtils,
+  FormatUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { Toggle } from "~/components/Toggle";
+import ConditionIcon from "~/tools/js/smartComponents/Icons/ConditionIcon";
+
+interface Props {
+  condition: ConditionContract;
+  isActive: boolean;
+  onConditionToggle: (condition: ConditionContract, isEnabled: boolean) => void;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+export default class ConditionManagePaneStandardCondition extends React.PureComponent<Props> {
+  render() {
+    const { isActive, condition, onConditionToggle, isReadonly, theme } =
+      this.props;
+
+    let classNames: Array<string> = ["ct-condition-manage-pane__condition"];
+    if (isActive) {
+      classNames.push("ct-condition-manage-pane__condition--active");
+    }
+
+    const name = ConditionUtils.getName(condition);
+    const id = ConditionUtils.getId(condition);
+
+    const headingNode: React.ReactNode = (
+      <div className="ct-condition-manage-pane__condition-heading">
+        <div className={classNames.join(" ")}>
+          <div className="ct-condition-manage-pane__condition-preview">
+            <ConditionIcon conditionType={id} isDarkMode={theme.isDarkMode} />
+          </div>
+          <div className="ct-condition-manage-pane__condition-name">{name}</div>
+          <div className="ct-condition-manage-pane__condition-toggle">
+            <Toggle
+              checked={isActive}
+              onClick={onConditionToggle.bind(this, condition)}
+              color="themed"
+              aria-label={`Enable ${name}`}
+            />
+          </div>
+        </div>
+      </div>
+    );
+    //`
+    const headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent heading={headingNode} />
+    );
+
+    const description = ConditionUtils.getDescription(condition);
+
+    return (
+      <Collapsible
+        layoutType={"minimal"}
+        header={headerNode}
+        key={ConditionUtils.getUniqueKey(condition)}
+      >
+        <div className="ct-condition-manage-pane__condition-content">
+          <HtmlContent
+            className="ct-condition-manage-pane__condition-description"
+            html={description ? description : ""}
+            withoutTooltips
+          />
+        </div>
+      </Collapsible>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardCondition/index.ts b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardCondition/index.ts
new file mode 100644
index 0000000..c3506e8
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardCondition/index.ts
@@ -0,0 +1,4 @@
+import ConditionManagePaneStandardCondition from "./ConditionManagePaneStandardCondition";
+
+export default ConditionManagePaneStandardCondition;
+export { ConditionManagePaneStandardCondition };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardConditions/ConditionManagePaneStandardConditions.tsx b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardConditions/ConditionManagePaneStandardConditions.tsx
new file mode 100644
index 0000000..3944584
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardConditions/ConditionManagePaneStandardConditions.tsx
@@ -0,0 +1,49 @@
+import React from "react";
+
+import {
+  CharacterTheme,
+  ConditionContract,
+  ConditionUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import ConditionManagePaneStandardCondition from "../ConditionManagePaneStandardCondition";
+
+interface Props {
+  standardConditions: Array<ConditionContract>;
+  activeConditionIds: Array<number>;
+  onConditionToggle: (condition: ConditionContract, isEnabled: boolean) => void;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+export default class ConditionManagePaneStandardConditions extends React.PureComponent<Props> {
+  render() {
+    const {
+      standardConditions,
+      activeConditionIds,
+      onConditionToggle,
+      isReadonly,
+      theme,
+    } = this.props;
+
+    return (
+      <React.Fragment>
+        {standardConditions.map((condition) => {
+          let isActive = activeConditionIds.includes(
+            ConditionUtils.getId(condition)
+          );
+
+          return (
+            <ConditionManagePaneStandardCondition
+              key={ConditionUtils.getUniqueKey(condition)}
+              isActive={isActive}
+              condition={condition}
+              onConditionToggle={onConditionToggle}
+              isReadonly={isReadonly}
+              theme={theme}
+            />
+          );
+        })}
+      </React.Fragment>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardConditions/index.ts b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardConditions/index.ts
new file mode 100644
index 0000000..a786cab
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/ConditionManagePaneStandardConditions/index.ts
@@ -0,0 +1,4 @@
+import ConditionManagePaneStandardConditions from "./ConditionManagePaneStandardConditions";
+
+export default ConditionManagePaneStandardConditions;
+export { ConditionManagePaneStandardConditions };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/index.ts
new file mode 100644
index 0000000..a43f72a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ConditionManagePane/index.ts
@@ -0,0 +1,14 @@
+import ConditionManagePane from "./ConditionManagePane";
+import ConditionManagePaneSpecialCondition from "./ConditionManagePaneSpecialCondition";
+import ConditionManagePaneSpecialConditions from "./ConditionManagePaneSpecialConditions";
+import ConditionManagePaneStandardCondition from "./ConditionManagePaneStandardCondition";
+import ConditionManagePaneStandardConditions from "./ConditionManagePaneStandardConditions";
+
+export default ConditionManagePane;
+export {
+  ConditionManagePane,
+  ConditionManagePaneSpecialCondition,
+  ConditionManagePaneSpecialConditions,
+  ConditionManagePaneStandardCondition,
+  ConditionManagePaneStandardConditions,
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/ContainerPane/ContainerPane.tsx b/ddb_main/tools/js/Shared/containers/panes/ContainerPane/ContainerPane.tsx
new file mode 100644
index 0000000..40ef90d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ContainerPane/ContainerPane.tsx
@@ -0,0 +1,513 @@
+import { orderBy } from "lodash";
+import React from "react";
+import { useContext } from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { Collapsible } from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiResponse,
+  BaseItemDefinitionContract,
+  CharacterTheme,
+  Constants,
+  Container,
+  ContainerLookup,
+  ContainerUtils,
+  DataOrigin,
+  EntityValueLookup,
+  InventoryManager,
+  Infusion,
+  InfusionChoiceLookup,
+  InfusionUtils,
+  Item,
+  ItemUtils,
+  Modifier,
+  PartyInfo,
+  RuleData,
+  rulesEngineSelectors,
+  serviceDataSelectors,
+  SnippetData,
+  Spell,
+  TypeValueLookup,
+  WeaponSpellDamageGroup,
+  ItemManager,
+  ContainerManager,
+  CharacterCurrencyContract,
+  FormatUtils,
+  CoinManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { EditableName } from "~/components/EditableName";
+import { ItemName } from "~/components/ItemName";
+import { Link } from "~/components/Link";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Preview } from "~/subApps/sheet/components/Sidebar/components/Preview";
+import {
+  getDataOriginComponentInfo,
+  getSpellComponentInfo,
+} from "~/subApps/sheet/components/Sidebar/helpers/paneUtils";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersContainer,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { PaneInitFailureContent } from "../../../../../../subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import { CURRENCY_VALUE } from "../../../../Shared/constants/App";
+import { CoinManagerContext } from "../../../../Shared/managers/CoinManagerContext";
+import * as toastActions from "../../../actions/toastMessage/actions";
+import ContainerActions from "../../../components/ContainerActions";
+import ItemDetail from "../../../components/ItemDetail";
+import { InventoryManagerContext } from "../../../managers/InventoryManagerContext";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+import { AppNotificationUtils, PaneIdentifierUtils } from "../../../utils";
+import ItemDetailActions from "../../ItemDetailActions";
+import { CurrencyErrorTypeEnum } from "../CurrencyPane/CurrencyPaneConstants";
+
+interface Props extends DispatchProp {
+  weaponSpellDamageGroups: Array<WeaponSpellDamageGroup>;
+  ruleData: RuleData;
+  snippetData: SnippetData;
+  entityValueLookup: EntityValueLookup;
+  infusionChoiceLookup: InfusionChoiceLookup;
+  identifiers: PaneIdentifiersContainer | null;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  containers: Array<Container>;
+  globalModifiers: Array<Modifier>;
+  valueLookupByType: TypeValueLookup;
+  inventory: Array<Item>;
+  containerLookup: ContainerLookup;
+  partyInfo: PartyInfo | null;
+  inventoryManager: InventoryManager;
+  coinManager: CoinManager;
+  paneHistoryPush: PaneInfo["paneHistoryPush"];
+}
+interface State {
+  item: ItemManager | null;
+  currentContainer: ContainerManager | null;
+  isCustomizeClosed: boolean;
+}
+class ContainerPane extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = this.generateStateData(props, true);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { inventory, identifiers, containerLookup } = this.props;
+
+    if (
+      inventory !== prevProps.inventory ||
+      containerLookup !== prevProps.containerLookup ||
+      identifiers !== prevProps.identifiers
+    ) {
+      this.setState(
+        this.generateStateData(this.props, prevState.isCustomizeClosed)
+      );
+    }
+  }
+
+  generateStateData = (props: Props, isCustomizeClosed: boolean): State => {
+    const { identifiers, inventoryManager } = props;
+
+    let foundItem: ItemManager | null = null;
+    let foundContainer: ContainerManager | null = null;
+    if (identifiers?.containerDefinitionKey) {
+      foundContainer = inventoryManager.getContainer(
+        identifiers.containerDefinitionKey
+      );
+      foundItem = foundContainer ? foundContainer.getContainerItem() : null;
+    }
+
+    return {
+      item: foundItem ?? null,
+      currentContainer: foundContainer ?? null,
+      isCustomizeClosed,
+    };
+  };
+
+  handleCustomDataUpdate = (
+    adjustmentType: Constants.AdjustmentTypeEnum,
+    value: any
+  ): void => {
+    const { item } = this.state;
+    const { inventoryManager } = this.props;
+
+    if (item) {
+      inventoryManager.handleCustomizationSet({
+        item: item.item,
+        adjustmentType,
+        value,
+      });
+    }
+  };
+
+  handleRemoveCustomizations = (): void => {
+    const { item } = this.state;
+    const { inventoryManager } = this.props;
+
+    if (item) {
+      inventoryManager.handleCustomizationsRemove({ item: item.item });
+    }
+  };
+
+  handleAdd = (
+    item: Item,
+    amount: number,
+    containerDefinitionKey: string
+  ): void => {
+    const { inventoryManager } = this.props;
+    inventoryManager.handleAdd(
+      { item, amount, containerDefinitionKey },
+      AppNotificationUtils.handleItemAddAccepted.bind(this, item, amount),
+      AppNotificationUtils.handleItemAddRejected.bind(this, item, amount)
+    );
+  };
+
+  handleItemMove = (item: Item, containerDefinitionKey: string): void => {
+    const { inventoryManager } = this.props;
+    inventoryManager.handleMove({ item, containerDefinitionKey });
+  };
+
+  handleItemSetEquip = (item: Item, uses: number): void => {
+    const { inventoryManager } = this.props;
+    //TODO need different component than SlotManager for item equipped/unequipped
+    if (uses === 0) {
+      inventoryManager.handleUnequip({ item });
+    }
+
+    if (uses === 1) {
+      inventoryManager.handleEquip({ item });
+    }
+  };
+
+  handleDataOriginClick = (dataOrigin: DataOrigin) => {
+    const { paneHistoryPush } = this.props;
+
+    let component = getDataOriginComponentInfo(dataOrigin);
+    if (component.type !== PaneComponentEnum.ERROR_404) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  handleSpellClick = (spell: Spell): void => {
+    const { paneHistoryPush } = this.props;
+
+    let component = getSpellComponentInfo(spell);
+    if (component.type) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  handleInfusionClick = (infusion: Infusion): void => {
+    const { paneHistoryPush } = this.props;
+
+    const choiceKey = InfusionUtils.getChoiceKey(infusion);
+    if (choiceKey !== null) {
+      paneHistoryPush(
+        PaneComponentEnum.INFUSION_CHOICE,
+        PaneIdentifierUtils.generateInfusionChoice(choiceKey)
+      );
+    }
+  };
+
+  handleManageShow = (): void => {
+    const { paneHistoryPush } = this.props;
+
+    paneHistoryPush(PaneComponentEnum.EQUIPMENT_MANAGE);
+  };
+
+  handleStartingEquipmentShow = (): void => {
+    const { paneHistoryPush } = this.props;
+    paneHistoryPush(PaneComponentEnum.STARTING_EQUIPMENT);
+  };
+
+  handleCurrencyShow = (): void => {
+    const { paneHistoryPush } = this.props;
+    paneHistoryPush(PaneComponentEnum.CURRENCY);
+  };
+
+  handleEncumbranceShow = (): void => {
+    const { paneHistoryPush } = this.props;
+    paneHistoryPush(PaneComponentEnum.ENCUMBRANCE);
+  };
+
+  sortInventoryItems = (inventory: Array<Item>): Array<Item> => {
+    return orderBy(
+      inventory,
+      [
+        (item) => ItemUtils.getRarityLevel(item),
+        (item) => ItemUtils.getName(item),
+        (item) => ItemUtils.getMappingId(item),
+      ],
+      ["desc", "asc", "asc"]
+    );
+  };
+
+  handleOpenCustomize = () => {
+    this.setState({ isCustomizeClosed: !this.state.isCustomizeClosed });
+  };
+
+  hasCurrencyValueChanged = (
+    value: number,
+    currencyKey: keyof CharacterCurrencyContract,
+    coin: CharacterCurrencyContract
+  ): boolean => {
+    return value !== coin[currencyKey];
+  };
+
+  handleCurrencyChangeError = (
+    currencyName: string,
+    errorType: CurrencyErrorTypeEnum
+  ): void => {
+    const { dispatch } = this.props;
+
+    let message: string = "";
+    if (errorType === CurrencyErrorTypeEnum.MIN) {
+      message =
+        "Cannot set currency to a negative value, the previous amount has been set instead.";
+    }
+
+    if (errorType === CurrencyErrorTypeEnum.MAX) {
+      message = `The max amount allowed for each currency type is ${FormatUtils.renderLocaleNumber(
+        CURRENCY_VALUE.MAX
+      )}, the previous value has been set instead.`;
+    }
+
+    if (errorType !== null) {
+      dispatch(
+        toastActions.toastError(
+          `Unable to Set Currency: ${currencyName}`,
+          message
+        )
+      );
+    }
+  };
+
+  handleCurrencyAdjust = (
+    coin: Partial<CharacterCurrencyContract>,
+    multiplier: 1 | -1,
+    containerDefinitionKey: string
+  ): void => {
+    const { coinManager, dispatch } = this.props;
+
+    let actionLabel: string = "";
+    if (multiplier === 1) {
+      actionLabel = "Add";
+    } else if (multiplier === -1) {
+      actionLabel = "Delete";
+    }
+
+    coinManager.handleTransaction(
+      { coin, containerDefinitionKey, multiplier },
+      () => {
+        // dispatch(toastActions.toastSuccess(
+        //     `A ${containerDefinitionKey === coinManager.getPartyEquipmentContainerDefinitionKey() ? 'Party' : ''}Coin transaction was completed!`,
+        //     'could list the updates?'
+        // ));
+      },
+      () => {
+        dispatch(
+          toastActions.toastError(
+            `Unable to make transaction: ${actionLabel} Coin`,
+            "Cannot set currency to a negative value, the previous amount has been set instead."
+          )
+        );
+      }
+    );
+  };
+
+  handleAmountSet = (
+    containerDefinitionKey: string,
+    key: keyof CharacterCurrencyContract,
+    amount: number
+  ): void => {
+    const { coinManager } = this.props;
+    const coin = coinManager.getContainerCoin(containerDefinitionKey);
+
+    if (coin && this.hasCurrencyValueChanged(amount, key, coin)) {
+      coinManager.handleAmountSet({
+        key,
+        amount,
+        containerDefinitionKey,
+      });
+    }
+  };
+
+  render() {
+    const { item, currentContainer, isCustomizeClosed } = this.state;
+    const {
+      weaponSpellDamageGroups,
+      ruleData,
+      snippetData,
+      entityValueLookup,
+      infusionChoiceLookup,
+      isReadonly,
+      proficiencyBonus,
+      theme,
+      containers,
+      globalModifiers,
+      valueLookupByType,
+      inventory,
+      identifiers,
+      partyInfo,
+      inventoryManager,
+    } = this.props;
+
+    if (currentContainer === null) {
+      return <PaneInitFailureContent />;
+    }
+
+    const shopOpenInitially = identifiers?.showAddItems ?? false;
+
+    const canCustomize = item
+      ? inventoryManager.canCustomizeItem(item.item)
+      : false;
+
+    return (
+      <div className="ct-container-pane">
+        <Header
+          preview={
+            <Preview imageUrl={item ? item.getAvatarUrl() : undefined} />
+          }
+        >
+          {item ? (
+            <EditableName onClick={this.handleOpenCustomize}>
+              <ItemName item={item.item} />
+            </EditableName>
+          ) : (
+            currentContainer.getName()
+          )}
+        </Header>
+        {item && (
+          <Collapsible
+            header="Item Description"
+            initiallyCollapsed={shopOpenInitially}
+            overrideCollapsed={shopOpenInitially}
+            className="ct-container-pane__content"
+          >
+            <ItemDetail
+              className="ct-container-pane__item-detail"
+              theme={theme}
+              key={item.getUniqueKey()}
+              item={item.item}
+              weaponSpellDamageGroups={weaponSpellDamageGroups}
+              ruleData={ruleData}
+              snippetData={snippetData}
+              onCustomDataUpdate={this.handleCustomDataUpdate}
+              onCustomizationsRemove={this.handleRemoveCustomizations}
+              onDataOriginClick={this.handleDataOriginClick}
+              onSpellClick={this.handleSpellClick}
+              onInfusionClick={this.handleInfusionClick}
+              entityValueLookup={entityValueLookup}
+              infusionChoiceLookup={infusionChoiceLookup}
+              isReadonly={isReadonly}
+              proficiencyBonus={proficiencyBonus}
+              showActions={false}
+              showCustomize={canCustomize}
+              container={currentContainer.container}
+              isCustomizeClosed={isCustomizeClosed}
+              onCustomizeClick={this.handleOpenCustomize}
+            />
+          </Collapsible>
+        )}
+        <ContainerActions
+          currentContainer={currentContainer.container}
+          containers={containers}
+          ruleData={ruleData}
+          proficiencyBonus={proficiencyBonus}
+          theme={theme}
+          globalModifiers={globalModifiers}
+          valueLookupByType={valueLookupByType}
+          onItemAdd={this.handleAdd}
+          onItemMove={this.handleItemMove}
+          onItemEquip={this.handleItemSetEquip}
+          inventory={this.sortInventoryItems(
+            ContainerUtils.getInventoryItems(
+              currentContainer.container,
+              inventory
+            )
+          )}
+          shopOpenInitially={shopOpenInitially}
+          isReadonly={isReadonly}
+          partyInfo={partyInfo}
+          handleCurrencyChangeError={this.handleCurrencyChangeError.bind(this)}
+          handleCurrencyAdjust={this.handleCurrencyAdjust.bind(this)}
+          handleAmountSet={this.handleAmountSet.bind(this)}
+        />
+        {!isReadonly && item && <ItemDetailActions item={item.item} />}
+        {!isReadonly && currentContainer.isCharacterContainer() && (
+          <div className="ct-container-pane__links">
+            <div className="ct-container-pane__link">
+              <Link useTheme={true} onClick={this.handleManageShow}>
+                Manage Inventory
+              </Link>
+            </div>
+            <div className="ct-container-pane__link">
+              <Link useTheme={true} onClick={this.handleStartingEquipmentShow}>
+                Starting Equipment
+              </Link>
+            </div>
+            <div className="ct-container-pane__link">
+              <Link useTheme={true} onClick={this.handleCurrencyShow}>
+                Currency
+              </Link>
+            </div>
+            <div className="ct-container-pane__link">
+              <Link useTheme={true} onClick={this.handleEncumbranceShow}>
+                Encumbrance
+              </Link>
+            </div>
+          </div>
+        )}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    weaponSpellDamageGroups:
+      rulesEngineSelectors.getWeaponSpellDamageGroups(state),
+    entityValueLookup:
+      rulesEngineSelectors.getCharacterValueLookupByEntity(state),
+    snippetData: rulesEngineSelectors.getSnippetData(state),
+    infusionChoiceLookup: rulesEngineSelectors.getInfusionChoiceLookup(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    containers: rulesEngineSelectors.getInventoryContainers(state),
+    globalModifiers: rulesEngineSelectors.getValidGlobalModifiers(state),
+    valueLookupByType:
+      rulesEngineSelectors.getCharacterValueLookupByType(state),
+    inventory: rulesEngineSelectors.getAllInventoryItems(state),
+    containerLookup: rulesEngineSelectors.getContainerLookup(state),
+    partyInfo: serviceDataSelectors.getPartyInfo(state),
+  };
+}
+function ContainerPaneContainer(props) {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const { coinManager } = useContext(CoinManagerContext);
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  return (
+    <ContainerPane
+      inventoryManager={inventoryManager}
+      coinManager={coinManager}
+      paneHistoryPush={paneHistoryPush}
+      {...props}
+    />
+  );
+}
+export default connect(mapStateToProps)(ContainerPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/ContainerPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/ContainerPane/index.ts
new file mode 100644
index 0000000..9593bb9
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ContainerPane/index.ts
@@ -0,0 +1,4 @@
+import ContainerPane from "./ContainerPane";
+
+export default ContainerPane;
+export { ContainerPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPane.tsx b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPane.tsx
new file mode 100644
index 0000000..2d5b454
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPane.tsx
@@ -0,0 +1,415 @@
+import React, { useContext } from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { FeatureFlagContext } from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  CharacterCurrencyContract,
+  CharacterLifestyleContract,
+  CoinManager,
+  Container,
+  ContainerUtils,
+  FormatUtils,
+  RuleData,
+  rulesEngineSelectors,
+  serviceDataSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { PaneIdentifiersCurrencyContext } from "~/subApps/sheet/components/Sidebar/types";
+
+import CurrencyCollapsible from "../../../../CharacterSheet/components/CurrencyCollapsible";
+import Lifestyle from "../../../../CharacterSheet/components/Lifestyle";
+import SettingsButton from "../../../../CharacterSheet/components/SettingsButton";
+import * as toastActions from "../../../actions/toastMessage/actions";
+import { CURRENCY_VALUE } from "../../../constants/App";
+import { CoinManagerContext } from "../../../managers/CoinManagerContext";
+import * as appEnvSelectors from "../../../selectors/appEnv";
+import { SharedAppState } from "../../../stores/typings";
+import { SettingsContextsEnum } from "../SettingsPane/typings";
+import { CurrencyErrorTypeEnum } from "./CurrencyPaneConstants";
+
+interface Props extends DispatchProp {
+  lifestyle: CharacterLifestyleContract | null;
+  coin: CharacterCurrencyContract;
+  ruleData: RuleData;
+  isReadonly: boolean;
+  identifiers: PaneIdentifiersCurrencyContext | null;
+  coinManager: CoinManager;
+  characterContainers: Array<Container>;
+  partyContainers: Array<Container>;
+}
+class CurrencyPane extends React.PureComponent<Props> {
+  hasCurrencyValueChanged = (
+    value: number,
+    currencyKey: keyof CharacterCurrencyContract,
+    coin: CharacterCurrencyContract
+  ): boolean => {
+    return value !== coin[currencyKey];
+  };
+
+  handleCurrencyChangeError = (
+    currencyName: string,
+    errorType: CurrencyErrorTypeEnum
+  ): void => {
+    const { dispatch } = this.props;
+
+    let message: string = "";
+    if (errorType === CurrencyErrorTypeEnum.MIN) {
+      message =
+        "Cannot set currency to a negative value, the previous amount has been set instead.";
+    }
+
+    if (errorType === CurrencyErrorTypeEnum.MAX) {
+      message = `The max amount allowed for each currency type is ${FormatUtils.renderLocaleNumber(
+        CURRENCY_VALUE.MAX
+      )}, the previous value has been set instead.`;
+    }
+
+    if (errorType !== null) {
+      dispatch(
+        toastActions.toastError(
+          `Unable to Set Currency: ${currencyName}`,
+          message
+        )
+      );
+    }
+  };
+
+  handleCurrencyAdjust = (
+    coin: Partial<CharacterCurrencyContract>,
+    multiplier: 1 | -1,
+    containerDefinitionKey: string
+  ): void => {
+    const { coinManager, dispatch } = this.props;
+
+    let actionLabel: string = "";
+    if (multiplier === 1) {
+      actionLabel = "Add";
+    } else if (multiplier === -1) {
+      actionLabel = "Delete";
+    }
+
+    coinManager.handleTransaction(
+      { coin, containerDefinitionKey, multiplier },
+      () => {
+        // dispatch(toastActions.toastSuccess(
+        //     `A ${containerDefinitionKey === coinManager.getPartyEquipmentContainerDefinitionKey() ? 'Party' : ''}Coin transaction was completed!`,
+        //     'could list the updates?'
+        // ));
+      },
+      () => {
+        dispatch(
+          toastActions.toastError(
+            `Unable to make transaction: ${actionLabel} Coin`,
+            "Cannot set currency to a negative value, the previous amount has been set instead."
+          )
+        );
+      }
+    );
+  };
+
+  handleAmountSet = (
+    containerDefinitionKey: string,
+    key: keyof CharacterCurrencyContract,
+    amount: number
+  ): void => {
+    const { coinManager } = this.props;
+    const coin = coinManager.getContainerCoin(containerDefinitionKey);
+
+    if (coin && this.hasCurrencyValueChanged(amount, key, coin)) {
+      coinManager.handleAmountSet({
+        key,
+        amount,
+        containerDefinitionKey,
+      });
+    }
+  };
+
+  handleLifestyleUpdate = (propertyKey: string, value: number | null): void => {
+    const { dispatch } = this.props;
+
+    dispatch(characterActions.lifestyleSet(value));
+  };
+
+  renderCharacterCoin = (characterContainer: Container) => {
+    const { isReadonly, ruleData, lifestyle } = this.props;
+
+    return (
+      <React.Fragment>
+        <div
+          role="heading"
+          aria-level={2}
+          className="ct-currency-pane__subheader"
+        >
+          My Coin
+        </div>
+        <CurrencyCollapsible
+          heading="Total (in gp)"
+          initiallyCollapsed={false}
+          isReadonly={isReadonly}
+          container={characterContainer}
+          handleCurrencyChangeError={this.handleCurrencyChangeError.bind(this)}
+          handleCurrencyAdjust={this.handleCurrencyAdjust.bind(this)}
+          handleAmountSet={this.handleAmountSet.bind(this)}
+        />
+        <Lifestyle
+          isReadonly={isReadonly}
+          handleLifestyleUpdate={this.handleLifestyleUpdate.bind(this)}
+          lifestyle={lifestyle}
+          ruleData={ruleData}
+        />
+      </React.Fragment>
+    );
+  };
+
+  renderWithoutCointainers() {
+    const {
+      identifiers,
+      coinManager,
+      characterContainers,
+      partyContainers,
+      isReadonly,
+      lifestyle,
+      ruleData,
+    } = this.props;
+
+    const containerDefinitionKeyContext =
+      identifiers?.containerDefinitionKeyContext;
+    const partyDefinitionKey =
+      coinManager.getPartyEquipmentContainerDefinitionKey();
+
+    const characterContainer = characterContainers.find(
+      (container) =>
+        ContainerUtils.getDefinitionKey(container) ===
+        coinManager.getCharacterContainerDefinitionKey()
+    );
+    const partyContainer = partyContainers.find(
+      (container) =>
+        ContainerUtils.getDefinitionKey(container) === partyDefinitionKey
+    );
+
+    return (
+      <FeatureFlagContext.Consumer>
+        {({ imsFlag }) => (
+          <div className="ct-currency-pane">
+            <Header
+              callout={
+                <SettingsButton
+                  context={SettingsContextsEnum.COIN}
+                  isReadonly={isReadonly}
+                />
+              }
+            >
+              Manage Coin
+            </Header>
+            {imsFlag &&
+            coinManager.isSharingTurnedOnOrDeleteOnly() &&
+            partyDefinitionKey ? (
+              <React.Fragment>
+                <div
+                  role="heading"
+                  aria-level={2}
+                  className="ct-currency-pane__subheader"
+                >
+                  My Coin
+                </div>
+                {characterContainer && (
+                  <CurrencyCollapsible
+                    heading={this.deriveCoinLabel(
+                      ContainerUtils.getName(characterContainer)
+                    )}
+                    initiallyCollapsed={
+                      containerDefinitionKeyContext !==
+                      ContainerUtils.getDefinitionKey(characterContainer)
+                    }
+                    isReadonly={isReadonly}
+                    container={characterContainer}
+                    handleCurrencyChangeError={this.handleCurrencyChangeError.bind(
+                      this
+                    )}
+                    handleCurrencyAdjust={this.handleCurrencyAdjust.bind(this)}
+                    handleAmountSet={this.handleAmountSet.bind(this)}
+                  />
+                )}
+                <Lifestyle
+                  isReadonly={isReadonly}
+                  handleLifestyleUpdate={this.handleLifestyleUpdate.bind(this)}
+                  lifestyle={lifestyle}
+                  ruleData={ruleData}
+                />
+                <div
+                  role="heading"
+                  aria-level={2}
+                  className="ct-currency-pane__subheader"
+                >
+                  Party Coin
+                </div>
+                {partyContainer && (
+                  <CurrencyCollapsible
+                    heading={this.deriveCoinLabel(
+                      ContainerUtils.getName(partyContainer)
+                    )}
+                    initiallyCollapsed={
+                      containerDefinitionKeyContext !==
+                      ContainerUtils.getDefinitionKey(partyContainer)
+                    }
+                    isReadonly={isReadonly}
+                    container={partyContainer}
+                    handleCurrencyChangeError={this.handleCurrencyChangeError.bind(
+                      this
+                    )}
+                    handleCurrencyAdjust={this.handleCurrencyAdjust.bind(this)}
+                    handleAmountSet={this.handleAmountSet.bind(this)}
+                  />
+                )}
+              </React.Fragment>
+            ) : (
+              characterContainer && this.renderCharacterCoin(characterContainer)
+            )}
+          </div>
+        )}
+      </FeatureFlagContext.Consumer>
+    );
+  }
+
+  deriveCoinLabel = (containerName): string => {
+    switch (containerName) {
+      case "Equipment":
+        return "My Equipment";
+      default:
+        return containerName;
+    }
+  };
+
+  renderWithCointainers() {
+    const {
+      coinManager,
+      partyContainers,
+      identifiers,
+      characterContainers,
+      isReadonly,
+      lifestyle,
+      ruleData,
+    } = this.props;
+    const partyDefinitionKey =
+      coinManager.getPartyEquipmentContainerDefinitionKey();
+    const containerDefinitionKeyContext =
+      identifiers?.containerDefinitionKeyContext;
+    return (
+      <FeatureFlagContext.Consumer>
+        {({ imsFlag }) => (
+          <div className="ct-currency-pane">
+            <Header
+              callout={
+                <SettingsButton
+                  context={SettingsContextsEnum.COIN}
+                  isReadonly={isReadonly}
+                />
+              }
+            >
+              Manage Coin
+            </Header>
+            <div
+              role="heading"
+              aria-level={2}
+              className="ct-currency-pane__subheader"
+            >
+              My Coin
+            </div>
+            {characterContainers.map((characterContainer) =>
+              ContainerUtils.getCoin(characterContainer) ? (
+                <CurrencyCollapsible
+                  heading={this.deriveCoinLabel(
+                    ContainerUtils.getName(characterContainer)
+                  )}
+                  key={ContainerUtils.getDefinitionKey(characterContainer)}
+                  initiallyCollapsed={
+                    containerDefinitionKeyContext !==
+                    ContainerUtils.getDefinitionKey(characterContainer)
+                  }
+                  isReadonly={isReadonly}
+                  container={characterContainer}
+                  handleCurrencyChangeError={this.handleCurrencyChangeError.bind(
+                    this
+                  )}
+                  handleCurrencyAdjust={this.handleCurrencyAdjust.bind(this)}
+                  handleAmountSet={this.handleAmountSet.bind(this)}
+                />
+              ) : null
+            )}
+            <Lifestyle
+              isReadonly={isReadonly}
+              handleLifestyleUpdate={this.handleLifestyleUpdate.bind(this)}
+              lifestyle={lifestyle}
+              ruleData={ruleData}
+            />
+            {imsFlag &&
+              coinManager.isSharingTurnedOnOrDeleteOnly() &&
+              partyDefinitionKey && (
+                <>
+                  <div
+                    role="heading"
+                    aria-level={2}
+                    className="ct-currency-pane__subheader"
+                  >
+                    Party Coin
+                  </div>
+                  {partyContainers.map((partyContainer) =>
+                    ContainerUtils.getCoin(partyContainer) ? (
+                      <CurrencyCollapsible
+                        heading={this.deriveCoinLabel(
+                          ContainerUtils.getName(partyContainer)
+                        )}
+                        key={ContainerUtils.getDefinitionKey(partyContainer)}
+                        initiallyCollapsed={
+                          containerDefinitionKeyContext !==
+                          ContainerUtils.getDefinitionKey(partyContainer)
+                        }
+                        isReadonly={isReadonly}
+                        container={partyContainer}
+                        handleCurrencyChangeError={this.handleCurrencyChangeError.bind(
+                          this
+                        )}
+                        handleCurrencyAdjust={this.handleCurrencyAdjust.bind(
+                          this
+                        )}
+                        handleAmountSet={this.handleAmountSet.bind(this)}
+                      />
+                    ) : null
+                  )}
+                </>
+              )}
+          </div>
+        )}
+      </FeatureFlagContext.Consumer>
+    );
+  }
+
+  render() {
+    const { coinManager } = this.props;
+    return coinManager.canUseCointainers()
+      ? this.renderWithCointainers()
+      : this.renderWithoutCointainers();
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    coin: rulesEngineSelectors.getCurrencies(state),
+    partyInfo: serviceDataSelectors.getPartyInfo(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    lifestyle: rulesEngineSelectors.getLifestyle(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    characterContainers:
+      rulesEngineSelectors.getCharacterInventoryContainers(state),
+    partyContainers: rulesEngineSelectors.getPartyInventoryContainers(state),
+  };
+}
+
+const CurrencyPaneContainer = (props) => {
+  const { coinManager } = useContext(CoinManagerContext);
+  return <CurrencyPane coinManager={coinManager} {...props} />;
+};
+
+export default connect(mapStateToProps)(CurrencyPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjuster/CurrencyPaneAdjuster.tsx b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjuster/CurrencyPaneAdjuster.tsx
new file mode 100644
index 0000000..951df5d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjuster/CurrencyPaneAdjuster.tsx
@@ -0,0 +1,223 @@
+import AddIcon from "@mui/icons-material/Add";
+import CloseIcon from "@mui/icons-material/Close";
+import RemoveIcon from "@mui/icons-material/Remove";
+import React, { useContext } from "react";
+
+import { Button } from "@dndbeyond/character-components/es";
+import {
+  CharacterCurrencyContract,
+  CoinManager,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+
+import { ThemeButton } from "../../../../components/common/Button";
+import { CURRENCY_VALUE } from "../../../../constants/App";
+import { CoinManagerContext } from "../../../../managers/CoinManagerContext";
+import CurrencyPaneAdjusterType from "../CurrencyPaneAdjusterType";
+
+interface Props {
+  onAdjust?: (
+    currencyTransaction: Partial<CharacterCurrencyContract>,
+    multiplier: number,
+    containerDefinitionKey: string
+  ) => void;
+  containerDefinitionKey: string;
+  isReadonly: boolean;
+  coinManager: CoinManager;
+}
+interface CurrencyPaneAdjusterState {
+  pp: number | null;
+  gp: number | null;
+  sp: number | null;
+  ep: number | null;
+  cp: number | null;
+}
+class CurrencyPaneAdjuster extends React.PureComponent<
+  Props,
+  CurrencyPaneAdjusterState
+> {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      pp: null,
+      gp: null,
+      sp: null,
+      ep: null,
+      cp: null,
+    };
+  }
+
+  convertStateToCoin = (): Partial<CharacterCurrencyContract> => {
+    const currencyAdjustments = {
+      ...this.state,
+    };
+
+    return Object.keys(currencyAdjustments).reduce((acc, key) => {
+      if (
+        currencyAdjustments.hasOwnProperty(key) &&
+        currencyAdjustments[key] !== null
+      ) {
+        acc[key] = currencyAdjustments[key];
+      }
+      return acc;
+    }, {});
+  };
+
+  handleAdjust = (multiplier: number): void => {
+    const { onAdjust, containerDefinitionKey } = this.props;
+
+    this.handleReset();
+
+    if (onAdjust) {
+      onAdjust(this.convertStateToCoin(), multiplier, containerDefinitionKey);
+    }
+  };
+
+  handleAdd = (): void => {
+    this.handleAdjust(1);
+  };
+
+  handleRemove = (): void => {
+    this.handleAdjust(-1);
+  };
+
+  handleChange = (currencyKey: string, value: number | null): void => {
+    this.setState(
+      (prevState: CurrencyPaneAdjusterState): CurrencyPaneAdjusterState => ({
+        ...prevState,
+        [currencyKey]:
+          value === null ? null : Math.min(value, CURRENCY_VALUE.MAX),
+      })
+    );
+  };
+
+  handleBlur = (currencyKey: string, value: number | null): void => {
+    this.setState(
+      (prevState: CurrencyPaneAdjusterState): CurrencyPaneAdjusterState => ({
+        ...prevState,
+        [currencyKey]:
+          value === null ? null : Math.min(value, CURRENCY_VALUE.MAX),
+      })
+    );
+  };
+
+  handleReset = (): void => {
+    this.setState({
+      pp: null,
+      gp: null,
+      sp: null,
+      ep: null,
+      cp: null,
+    });
+  };
+
+  render() {
+    const { pp, gp, sp, ep, cp } = this.state;
+    const { isReadonly, containerDefinitionKey, coinManager } = this.props;
+
+    return (
+      <div className="ct-currency-pane__adjuster">
+        <div className="ct-currency-pane__adjuster-heading">
+          <Heading>{`Adjust${
+            containerDefinitionKey ===
+            coinManager.getPartyEquipmentContainerDefinitionKey()
+              ? " Party"
+              : ""
+          } Coin`}</Heading>
+        </div>
+        <div className="ct-currency-pane__adjuster-types">
+          <CurrencyPaneAdjusterType
+            containerDefinitionKey={containerDefinitionKey}
+            name="PP"
+            currencyKey="pp"
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+            coinType={Constants.CoinTypeEnum.pp}
+            value={pp}
+            isReadonly={isReadonly}
+          />
+          <CurrencyPaneAdjusterType
+            containerDefinitionKey={containerDefinitionKey}
+            name="GP"
+            currencyKey="gp"
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+            coinType={Constants.CoinTypeEnum.gp}
+            value={gp}
+            isReadonly={isReadonly}
+          />
+          <CurrencyPaneAdjusterType
+            containerDefinitionKey={containerDefinitionKey}
+            name="EP"
+            currencyKey="ep"
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+            coinType={Constants.CoinTypeEnum.ep}
+            value={ep}
+            isReadonly={isReadonly}
+          />
+          <CurrencyPaneAdjusterType
+            containerDefinitionKey={containerDefinitionKey}
+            name="SP"
+            currencyKey="sp"
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+            coinType={Constants.CoinTypeEnum.sp}
+            value={sp}
+            isReadonly={isReadonly}
+          />
+          <CurrencyPaneAdjusterType
+            containerDefinitionKey={containerDefinitionKey}
+            name="CP"
+            currencyKey="cp"
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+            coinType={Constants.CoinTypeEnum.cp}
+            value={cp}
+            isReadonly={isReadonly}
+          />
+        </div>
+        <div className="ct-currency-pane__adjuster-actions">
+          <div className="ct-currency-pane__adjuster-action ct-currency-pane__adjuster-action--positive">
+            <Button size="medium" onClick={this.handleAdd}>
+              <span className="ct-currency-pane__adjuster-actions-button-content">
+                <AddIcon sx={{ width: "13px", height: "13px" }} />
+                Add
+              </span>
+            </Button>
+          </div>
+          <div className="ct-currency-pane__adjuster-action ct-currency-pane__adjuster-action--negative">
+            <Button size="medium" onClick={this.handleRemove}>
+              <span className="ct-currency-pane__adjuster-actions-button-content">
+                <RemoveIcon sx={{ width: "13px", height: "13px" }} />
+                Remove
+              </span>
+            </Button>
+          </div>
+          <div className="ct-currency-pane__adjuster-action">
+            <ThemeButton
+              size="medium"
+              style="outline"
+              onClick={this.handleReset}
+            >
+              <span className="ct-currency-pane__adjuster-actions-button-content">
+                <CloseIcon sx={{ width: "13px", height: "13px" }} />
+                Clear
+              </span>
+            </ThemeButton>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+const CurrencyPaneAdjusterContainer = (props) => {
+  const { coinManager } = useContext(CoinManagerContext);
+  return <CurrencyPaneAdjuster coinManager={coinManager} {...props} />;
+};
+
+export default CurrencyPaneAdjusterContainer;
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjuster/index.ts b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjuster/index.ts
new file mode 100644
index 0000000..8990e33
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjuster/index.ts
@@ -0,0 +1,4 @@
+import CurrencyPaneAdjuster from "./CurrencyPaneAdjuster";
+
+export default CurrencyPaneAdjuster;
+export { CurrencyPaneAdjuster };
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjusterType/CurrencyPaneAdjusterType.tsx b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjusterType/CurrencyPaneAdjusterType.tsx
new file mode 100644
index 0000000..60f1d58
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjusterType/CurrencyPaneAdjusterType.tsx
@@ -0,0 +1,107 @@
+import React from "react";
+
+import { CoinIcon } from "@dndbeyond/character-components/es";
+import {
+  Constants,
+  FormatUtils,
+  HelperUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { CURRENCY_VALUE } from "../../../../constants/App";
+
+interface Props {
+  currencyKey: string;
+  name: string;
+  value: number | null;
+  onBlur?: (currencyKey: string, value: number | null) => void;
+  onChange?: (currencyKey: string, value: number | null) => void;
+  minValue: number;
+  maxValue: number;
+  isReadonly: boolean;
+  coinType: Constants.CoinTypeEnum;
+  containerDefinitionKey: string;
+}
+interface State {
+  value: number | null;
+}
+export default class CurrencyPaneAdjusterType extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    minValue: CURRENCY_VALUE.MIN,
+    maxValue: CURRENCY_VALUE.MAX,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.value,
+    };
+  }
+
+  handleChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    const { onChange, currencyKey } = this.props;
+
+    if (onChange) {
+      onChange(currencyKey, HelperUtils.parseInputInt(evt.target.value));
+    }
+  };
+
+  handleBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { onBlur, currencyKey } = this.props;
+
+    if (onBlur) {
+      onBlur(currencyKey, HelperUtils.parseInputInt(evt.target.value));
+    }
+  };
+
+  render() {
+    const {
+      value,
+      name,
+      isReadonly,
+      minValue,
+      maxValue,
+      coinType,
+      containerDefinitionKey,
+    } = this.props;
+
+    let classNames: Array<string> = ["ct-currency-pane__adjuster-type"];
+    if (name) {
+      classNames.push(
+        `ct-currency-pane__adjuster-type--${FormatUtils.slugify(name)}`
+      );
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ct-currency-pane__adjuster-type-labels">
+          <div className="ct-currency-pane__icon">
+            <CoinIcon coinType={coinType} />
+          </div>
+          <div
+            id={`${containerDefinitionKey}-${coinType}-label`}
+            className="ct-currency-pane__adjuster-type-name"
+          >
+            {name}
+          </div>
+        </div>
+        <div className="ct-currency-pane__adjuster-type-value">
+          <input
+            aria-labelledby={`${containerDefinitionKey}-${coinType}-label`}
+            type="number"
+            className="ct-currency-pane__adjuster-type-value-input"
+            value={value === null ? "" : value}
+            onChange={this.handleChange}
+            onBlur={this.handleBlur}
+            readOnly={isReadonly}
+            min={minValue}
+            max={maxValue}
+          />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjusterType/index.ts b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjusterType/index.ts
new file mode 100644
index 0000000..6b4921f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneAdjusterType/index.ts
@@ -0,0 +1,4 @@
+import CurrencyPaneAdjusterType from "./CurrencyPaneAdjusterType";
+
+export default CurrencyPaneAdjusterType;
+export { CurrencyPaneAdjusterType };
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneConstants.ts b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneConstants.ts
new file mode 100644
index 0000000..b5add61
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneConstants.ts
@@ -0,0 +1,4 @@
+export enum CurrencyErrorTypeEnum {
+  MIN = "min",
+  MAX = "max",
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneCurrencyRow/CurrencyPaneCurrencyRow.tsx b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneCurrencyRow/CurrencyPaneCurrencyRow.tsx
new file mode 100644
index 0000000..d043cbc
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneCurrencyRow/CurrencyPaneCurrencyRow.tsx
@@ -0,0 +1,212 @@
+import React from "react";
+
+import { CoinIcon } from "@dndbeyond/character-components/es";
+import {
+  HelperUtils,
+  FormatUtils,
+  CharacterCurrencyContract,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { CURRENCY_VALUE } from "../../../../constants/App";
+import { CurrencyErrorTypeEnum } from "../CurrencyPaneConstants";
+
+interface Props {
+  name: string;
+  value: number | null;
+  conversion?: string;
+  onChange: (value: number) => void;
+  onError?: (errorType: CurrencyErrorTypeEnum) => void;
+  isReadonly: boolean;
+  minValue: number;
+  maxValue: number;
+  coinType: Constants.CoinTypeEnum;
+}
+interface State {
+  value: number | null;
+  preValue: number | null;
+  errorType: CurrencyErrorTypeEnum | null;
+  isEditorVisible: boolean;
+}
+export default class Currency extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    minValue: CURRENCY_VALUE.MIN,
+    maxValue: CURRENCY_VALUE.MAX,
+  };
+
+  editorRef = React.createRef<HTMLInputElement>();
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.value,
+      preValue: props.value,
+      errorType: null,
+      isEditorVisible: false,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { value } = this.props;
+
+    if (value !== prevProps.value) {
+      this.setState({
+        value,
+        preValue: value,
+      });
+    }
+  }
+
+  handleBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { value, preValue, errorType } = this.state;
+    const { onChange, onError } = this.props;
+
+    let parsedValue = HelperUtils.parseInputInt(evt.target.value);
+    let targetValue: number | null =
+      errorType === null && parsedValue !== null ? parsedValue : preValue;
+    if (targetValue !== null && onChange) {
+      onChange(targetValue);
+    }
+
+    if (errorType !== null && onError) {
+      onError(errorType);
+    }
+
+    this.setState({
+      value: targetValue,
+      preValue: targetValue,
+      errorType: null,
+      isEditorVisible: false,
+    });
+  };
+
+  handleChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    const { minValue, maxValue } = this.props;
+
+    let newValue = HelperUtils.parseInputInt(evt.target.value);
+    let errorType: CurrencyErrorTypeEnum | null = null;
+
+    if (newValue !== null) {
+      if (newValue < minValue) {
+        errorType = CurrencyErrorTypeEnum.MIN;
+      } else if (newValue > maxValue) {
+        errorType = CurrencyErrorTypeEnum.MAX;
+      }
+    }
+
+    this.setState({
+      value: newValue,
+      errorType,
+    });
+  };
+
+  handleCurrencyClick = (): void => {
+    this.setState(
+      {
+        isEditorVisible: true,
+      },
+      () => {
+        this.editorRef.current && this.editorRef.current.focus();
+      }
+    );
+  };
+
+  renderError = (): React.ReactNode => {
+    const { errorType } = this.state;
+
+    if (errorType === null) {
+      return null;
+    }
+
+    let errorMessage: React.ReactNode;
+    if (errorType === CurrencyErrorTypeEnum.MIN) {
+      errorMessage =
+        "Cannot accept a negative value. To remove currency, please use the Currency Adjuster options below.";
+    }
+    if (errorType === CurrencyErrorTypeEnum.MAX) {
+      errorMessage = `The max amount allowed is ${FormatUtils.renderLocaleNumber(
+        CURRENCY_VALUE.MAX
+      )}.`;
+    }
+
+    return (
+      <div className="ct-currency-pane__currency-error">
+        <div className="ct-currency-pane__currency-error-text">
+          {errorMessage}
+        </div>
+      </div>
+    );
+  };
+
+  renderCurrencyValue = (): React.ReactNode => {
+    const { value, isEditorVisible } = this.state;
+    const { isReadonly, minValue, maxValue } = this.props;
+
+    if (isEditorVisible) {
+      return (
+        <input
+          ref={this.editorRef}
+          type="number"
+          className="ct-currency-pane__currency-value-input"
+          value={value === null ? "" : value}
+          onBlur={this.handleBlur}
+          onChange={this.handleChange}
+          readOnly={isReadonly}
+          min={minValue}
+          max={maxValue}
+        />
+      );
+    }
+
+    return (
+      <div
+        className="ct-currency-pane__currency-value-text"
+        onClick={this.handleCurrencyClick}
+      >
+        {value === null ? "" : FormatUtils.renderLocaleNumber(value)}
+      </div>
+    );
+  };
+
+  render() {
+    const { name, conversion, coinType } = this.props;
+
+    let classNames: Array<string> = ["ct-currency-pane__currency"];
+    if (name) {
+      classNames.push(
+        `ct-currency-pane__currency--${FormatUtils.slugify(name)}`
+      );
+    }
+
+    let conversionNode: React.ReactNode;
+    if (conversion) {
+      conversionNode = (
+        <div className="ct-currency-pane__currency-conversion">
+          {conversion}
+        </div>
+      );
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ct-currency-pane__currency-row">
+          <div className="ct-currency-pane__currency-icon">
+            <CoinIcon coinType={coinType} />
+          </div>
+          <div className="ct-currency-pane__currency-info">
+            <div className="ct-currency-pane__currency-name">{name}</div>
+            {conversionNode}
+          </div>
+          <div className="ct-currency-pane__currency-value">
+            {this.renderCurrencyValue()}
+          </div>
+        </div>
+        {this.renderError()}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneCurrencyRow/index.ts b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneCurrencyRow/index.ts
new file mode 100644
index 0000000..cf06ee7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneCurrencyRow/index.ts
@@ -0,0 +1,4 @@
+import CurrencyPaneCurrencyRow from "./CurrencyPaneCurrencyRow";
+
+export default CurrencyPaneCurrencyRow;
+export { CurrencyPaneCurrencyRow };
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditor/CurrencyPaneEditor.tsx b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditor/CurrencyPaneEditor.tsx
new file mode 100644
index 0000000..e776657
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditor/CurrencyPaneEditor.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+
+import { FormatUtils } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  propertyKey: string;
+  className: string;
+}
+export default class CurrencyPaneEditor extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { propertyKey, className } = this.props;
+
+    let classNames: Array<string> = [
+      "ct-currency-pane__editor",
+      `ct-currency-pane__editor--${FormatUtils.slugify(propertyKey)}`,
+      className,
+    ];
+
+    return <div className={classNames.join(" ")}>{this.props.children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditor/index.ts b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditor/index.ts
new file mode 100644
index 0000000..16c8888
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditor/index.ts
@@ -0,0 +1,4 @@
+import CurrencyPaneEditor from "./CurrencyPaneEditor";
+
+export default CurrencyPaneEditor;
+export { CurrencyPaneEditor };
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditorValue/CurrencyPaneEditorValue.tsx b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditorValue/CurrencyPaneEditorValue.tsx
new file mode 100644
index 0000000..58d4cf6
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditorValue/CurrencyPaneEditorValue.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class CurrencyPaneEditorValue extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-currency-pane__editor-value">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditorValue/index.ts b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditorValue/index.ts
new file mode 100644
index 0000000..0f81d1a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneEditorValue/index.ts
@@ -0,0 +1,4 @@
+import CurrencyPaneEditorValue from "./CurrencyPaneEditorValue";
+
+export default CurrencyPaneEditorValue;
+export { CurrencyPaneEditorValue };
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneSelectEditor/CurrencyPaneSelectEditor.tsx b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneSelectEditor/CurrencyPaneSelectEditor.tsx
new file mode 100644
index 0000000..727a04f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneSelectEditor/CurrencyPaneSelectEditor.tsx
@@ -0,0 +1,71 @@
+import React from "react";
+
+import { Select } from "@dndbeyond/character-components/es";
+import {
+  HelperUtils,
+  HtmlSelectOption,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+
+import CurrencyPaneEditor from "../CurrencyPaneEditor";
+import CurrencyPaneEditorValue from "../CurrencyPaneEditorValue";
+
+interface Props {
+  label: string;
+  propertyKey: string;
+  defaultValue: number | null;
+  options: Array<HtmlSelectOption>;
+  onUpdate?: (propertyKey: string, value: number | null) => void;
+  isReadonly: boolean;
+}
+interface State {
+  value: number | null;
+}
+export default class CurrencyPaneSelectEditor extends React.PureComponent<
+  Props,
+  State
+> {
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue,
+    };
+  }
+
+  handleChange = (value) => {
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, HelperUtils.parseInputInt(value));
+      this.setState({
+        value,
+      });
+    }
+  };
+
+  render() {
+    const { value } = this.state;
+    const { propertyKey, label, options, isReadonly } = this.props;
+
+    return (
+      <CurrencyPaneEditor
+        propertyKey={propertyKey}
+        className="ct-currency-pane__editor--select"
+      >
+        <Heading>{label}</Heading>
+        <CurrencyPaneEditorValue>
+          <Select
+            className="ct-currency-pane__editor-input"
+            placeholder="--"
+            options={options}
+            value={value}
+            onChange={this.handleChange}
+            isReadonly={isReadonly}
+          />
+        </CurrencyPaneEditorValue>
+      </CurrencyPaneEditor>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneSelectEditor/index.ts b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneSelectEditor/index.ts
new file mode 100644
index 0000000..3a8a918
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/CurrencyPaneSelectEditor/index.ts
@@ -0,0 +1,4 @@
+import CurrencyPaneSelectEditor from "./CurrencyPaneSelectEditor";
+
+export default CurrencyPaneSelectEditor;
+export { CurrencyPaneSelectEditor };
diff --git a/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/index.ts
new file mode 100644
index 0000000..76c5921
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CurrencyPane/index.ts
@@ -0,0 +1,18 @@
+import CurrencyPane from "./CurrencyPane";
+import CurrencyPaneAdjuster from "./CurrencyPaneAdjuster";
+import CurrencyPaneAdjusterType from "./CurrencyPaneAdjusterType";
+import CurrencyPaneCurrencyRow from "./CurrencyPaneCurrencyRow";
+import CurrencyPaneEditor from "./CurrencyPaneEditor";
+import CurrencyPaneEditorValue from "./CurrencyPaneEditorValue";
+import CurrencyPaneSelectEditor from "./CurrencyPaneSelectEditor";
+
+export default CurrencyPane;
+export {
+  CurrencyPane,
+  CurrencyPaneAdjuster,
+  CurrencyPaneAdjusterType,
+  CurrencyPaneCurrencyRow,
+  CurrencyPaneEditor,
+  CurrencyPaneEditorValue,
+  CurrencyPaneSelectEditor,
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/CustomActionPane/CustomActionPane.tsx b/ddb_main/tools/js/Shared/containers/panes/CustomActionPane/CustomActionPane.tsx
new file mode 100644
index 0000000..6fdd857
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CustomActionPane/CustomActionPane.tsx
@@ -0,0 +1,344 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { Collapsible } from "@dndbeyond/character-components/es";
+import {
+  AbilityLookup,
+  Action,
+  ActionUtils,
+  ActivationUtils,
+  characterActions,
+  CharacterTheme,
+  Constants,
+  CustomActionContract,
+  DiceUtils,
+  EntityValueLookup,
+  InventoryLookup,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersCustomAction,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { PaneInitFailureContent } from "../../../../../../subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import { ActionDetail } from "../../../components/ActionDetail";
+import CustomizeDataEditor from "../../../components/CustomizeDataEditor";
+import EditorBox from "../../../components/EditorBox";
+import { RemoveButton } from "../../../components/common/Button";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+
+type EditCustomContractProperties = Omit<
+  CustomActionContract,
+  "id" | "entityTypeId"
+>;
+
+interface Props extends DispatchProp {
+  actions: Array<Action>;
+  entityValueLookup: EntityValueLookup;
+  abilityLookup: AbilityLookup;
+  inventoryLookup: InventoryLookup;
+  ruleData: RuleData;
+  identifiers: PaneIdentifiersCustomAction | null;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  paneContext: PaneInfo;
+}
+interface State {
+  action: Action | null;
+}
+class CustomActionPane extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = this.generateStateData(props);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { actions, identifiers } = this.props;
+
+    if (
+      actions !== prevProps.actions ||
+      identifiers !== prevProps.identifiers
+    ) {
+      this.setState(this.generateStateData(this.props));
+    }
+  }
+
+  generateStateData = (props: Props): State => {
+    const { actions, identifiers } = props;
+
+    let foundAction: Action | null | undefined = null;
+    if (identifiers !== null) {
+      foundAction = actions.find((action) => identifiers.id === action.id);
+    }
+
+    return {
+      action: foundAction ? foundAction : null,
+    };
+  };
+
+  handleCustomDataUpdate = (data: EditCustomContractProperties): void => {
+    const { action } = this.state;
+    const { dispatch } = this.props;
+
+    if (action === null) {
+      return;
+    }
+
+    const mappingId = ActionUtils.getMappingId(action);
+    if (mappingId !== null) {
+      dispatch(characterActions.customActionSet(mappingId, data));
+    }
+  };
+
+  handleCustomActionsShow = (): void => {
+    const {
+      paneContext: { paneHistoryPush },
+    } = this.props;
+
+    paneHistoryPush(PaneComponentEnum.CUSTOM_ACTIONS);
+  };
+
+  handleRemove = (): void => {
+    const { action } = this.state;
+    const {
+      dispatch,
+      paneContext: { paneHistoryStart },
+    } = this.props;
+
+    paneHistoryStart(PaneComponentEnum.CUSTOM_ACTIONS);
+    if (action) {
+      const mappingId = ActionUtils.getMappingId(action);
+
+      if (mappingId !== null) {
+        dispatch(characterActions.customActionRemove(mappingId));
+      }
+    }
+  };
+
+  getData = (): Record<string, any> => {
+    const { action } = this.state;
+
+    if (action === null) {
+      return {};
+    }
+
+    let activation = ActionUtils.getDefinitionActivation(action);
+    let range = ActionUtils.getDefinitionRange(action);
+    let dice = ActionUtils.getDefinitionDice(action);
+    let value = ActionUtils.getDefinitionFixedValue(action);
+
+    let diceCount: number | null = null;
+    let diceType: number | null = null;
+    let fixedValue: number | null = null;
+    if (dice !== null) {
+      diceCount = DiceUtils.getCount(dice);
+      diceType = DiceUtils.getValue(dice);
+      fixedValue = DiceUtils.getFixedValue(dice);
+    } else if (value !== null) {
+      fixedValue = value;
+    }
+
+    let data: EditCustomContractProperties = {
+      actionType: ActionUtils.getDefinitionActionTypeId(action),
+      activationTime: ActivationUtils.getTime(activation),
+      activationType: ActivationUtils.getType(activation),
+      aoeSize: range?.aoeSize ?? null,
+      aoeType: range?.aoeType ?? null,
+      attackSubtype: ActionUtils.getDefinitionAttackSubtypeId(action),
+      damageBonus: null, // not used
+      damageTypeId: ActionUtils.getDefinitionDamageTypeId(action),
+      description: ActionUtils.getDefinitionDescription(action),
+      diceCount,
+      diceType,
+      fixedValue,
+      displayAsAttack: ActionUtils.displayAsAttack(action),
+      fixedSaveDc: ActionUtils.getDefinitionFixedSaveDc(action),
+      isMartialArts: ActionUtils.getDefinitionIsMartialArts(action),
+      isOffhand: ActionUtils.isOffhand(action),
+      isProficient: ActionUtils.isProficient(action),
+      isSilvered: ActionUtils.isSilvered(action),
+      longRange: range?.longRange ?? null,
+      name: ActionUtils.getDefinitionName(action),
+      onMissDescription: ActionUtils.getDefinitionOnMissDescription(action),
+      range: range?.range ?? null,
+      rangeId: ActionUtils.getDefinitionAttackRangeId(action),
+      saveFailDescription: ActionUtils.getDefinitionSaveFailDescription(action),
+      saveStatId: ActionUtils.getDefinitionSaveStatId(action),
+      saveSuccessDescription:
+        ActionUtils.getDefinitionSaveSuccessDescription(action),
+      snippet: ActionUtils.getDefinitionSnippet(action),
+      spellRangeType: ActionUtils.getDefinitionSpellRangeType(action),
+      statId: ActionUtils.getDefinitionAbilityModifierStatId(action),
+      toHitBonus: null, // not used
+    };
+
+    return data;
+  };
+
+  renderCustomize = (): React.ReactNode => {
+    const { isReadonly, ruleData } = this.props;
+    const { action } = this.state;
+
+    if (isReadonly) {
+      return null;
+    }
+
+    if (action === null) {
+      return null;
+    }
+
+    const damageTypeOptions = RuleDataUtils.getDamageTypeOptions(ruleData);
+    const rangeTypeOptions = RuleDataUtils.getAttackRangeTypeOptions(ruleData);
+    const statOptions = RuleDataUtils.getStatOptions(ruleData);
+    const dieTypeOptions = RuleDataUtils.getDieTypeOptions(ruleData);
+    const attackSubtypeOptions =
+      RuleDataUtils.getAttackSubtypeOptions(ruleData);
+    const activationTypeOptions =
+      RuleDataUtils.getActivationTypeOptions(ruleData);
+    const aoeTypeOptions = RuleDataUtils.getAoeTypeOptions(ruleData);
+    const spellRangeTypeOptions =
+      RuleDataUtils.getSpellRangeTypeOptions(ruleData);
+
+    const actionType = ActionUtils.getActionTypeId(action);
+
+    return (
+      <Collapsible
+        layoutType={"minimal"}
+        header="Edit"
+        className="ct-custom-action-pane__customize"
+      >
+        <EditorBox>
+          <CustomizeDataEditor
+            data={this.getData()}
+            fallbackValues={{
+              displayAsAttack: ActionUtils.isDefaultDisplayAsAttack(action),
+            }}
+            labelOverrides={{
+              fixedValue: "Fixed Value",
+            }}
+            enableName={true}
+            enableIsProficient={true}
+            enableRangeType={true}
+            enableDiceCount={true}
+            enableDiceType={true}
+            enableFixedValue={true}
+            enableDamageType={true}
+            enableIsOffhand={actionType === Constants.ActionTypeEnum.WEAPON}
+            enableAttackSubtype={actionType === Constants.ActionTypeEnum.WEAPON}
+            enableIsSilver={actionType === Constants.ActionTypeEnum.WEAPON}
+            enableIsMartialArts={true}
+            enableDescription={true}
+            enableStat={true}
+            enableSaveDc={true}
+            enableActivationTime={true}
+            enableActivationType={true}
+            enableSaveType={true}
+            enableDisplayAsAttack={true}
+            enableAoeType={true}
+            enableAoeSize={true}
+            enableSpellRangeType={actionType === Constants.ActionTypeEnum.SPELL}
+            enableRange={true}
+            enableLongRange={actionType === Constants.ActionTypeEnum.WEAPON}
+            enableSnippet={true}
+            maxNameLength={1024}
+            rangeOptions={rangeTypeOptions}
+            damageTypeOptions={damageTypeOptions}
+            diceTypeOptions={dieTypeOptions}
+            statOptions={statOptions}
+            attackSubtypeOptions={attackSubtypeOptions}
+            activationTypeOptions={activationTypeOptions}
+            aoeTypeOptions={aoeTypeOptions}
+            spellRangeTypeOptions={spellRangeTypeOptions}
+            onDataUpdate={this.handleCustomDataUpdate}
+          />
+        </EditorBox>
+      </Collapsible>
+    );
+  };
+
+  render() {
+    const { action } = this.state;
+    const {
+      ruleData,
+      entityValueLookup,
+      abilityLookup,
+      inventoryLookup,
+      isReadonly,
+      theme,
+      proficiencyBonus,
+    } = this.props;
+
+    if (action === null) {
+      return <PaneInitFailureContent />;
+    }
+
+    return (
+      <div
+        className="ct-custom-action-pane"
+        key={ActionUtils.getUniqueKey(action)}
+      >
+        <Header parent="Custom Actions" onClick={this.handleCustomActionsShow}>
+          {ActionUtils.getName(action)}
+        </Header>
+        {this.renderCustomize()}
+        <ActionDetail
+          theme={theme}
+          action={action}
+          ruleData={ruleData}
+          entityValueLookup={entityValueLookup}
+          inventoryLookup={inventoryLookup}
+          showCustomize={false}
+          abilityLookup={abilityLookup}
+          isReadonly={isReadonly}
+          proficiencyBonus={proficiencyBonus}
+        />
+        {!isReadonly && (
+          <div className="ct-custom-action-pane__actions">
+            <div
+              className="ct-custom-action-pane__action ct-custom-action-pane__action--remove"
+              onClick={this.handleRemove}
+            >
+              <RemoveButton onClick={this.handleRemove}>
+                Remove Action
+              </RemoveButton>
+            </div>
+          </div>
+        )}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    actions: rulesEngineSelectors.getCustomActions(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    entityValueLookup:
+      rulesEngineSelectors.getCharacterValueLookupByEntity(state),
+    inventoryLookup: rulesEngineSelectors.getInventoryLookup(state),
+    abilityLookup: rulesEngineSelectors.getAbilityLookup(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const CustomActionPaneContainer = (props) => {
+  const { pane } = useSidebar();
+  return <CustomActionPane paneContext={pane} {...props} />;
+};
+
+export default connect(mapStateToProps)(CustomActionPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/CustomActionPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/CustomActionPane/index.ts
new file mode 100644
index 0000000..73004d2
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CustomActionPane/index.ts
@@ -0,0 +1,4 @@
+import CustomActionPane from "./CustomActionPane";
+
+export default CustomActionPane;
+export { CustomActionPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/CustomActionsPane.tsx b/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/CustomActionsPane.tsx
new file mode 100644
index 0000000..9d1cc37
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/CustomActionsPane.tsx
@@ -0,0 +1,162 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { Select } from "@dndbeyond/character-components/es";
+import {
+  rulesEngineSelectors,
+  Action,
+  ActionUtils,
+  characterActions,
+  Constants,
+  HtmlSelectOption,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { SharedAppState } from "../../../stores/typings";
+import { PaneIdentifierUtils } from "../../../utils";
+import CustomActionsPaneSummary from "./CustomActionsPaneSummary";
+
+interface Props extends DispatchProp {
+  actions: Array<Action>;
+  ruleData: RuleData;
+  paneContext: PaneInfo;
+}
+class CustomActionsPane extends React.PureComponent<Props> {
+  handleCustomActionShow = (action: Action): void => {
+    const {
+      paneContext: { paneHistoryPush },
+    } = this.props;
+
+    const mappingId = ActionUtils.getMappingId(action);
+    if (mappingId !== null) {
+      paneHistoryPush(
+        PaneComponentEnum.CUSTOM_ACTION,
+        PaneIdentifierUtils.generateCustomAction(mappingId)
+      );
+    }
+  };
+
+  handleCustomAttackRemove = (action: Action): void => {
+    const {
+      dispatch,
+      paneContext: { paneHistoryStart },
+    } = this.props;
+
+    const mappingId = ActionUtils.getMappingId(action);
+    if (mappingId !== null) {
+      paneHistoryStart(PaneComponentEnum.CUSTOM_ACTIONS);
+      dispatch(characterActions.customActionRemove(mappingId));
+    }
+  };
+
+  handleActionAdd = (actionType: string): void => {
+    const { dispatch, actions } = this.props;
+
+    dispatch(
+      characterActions.customActionCreate(
+        `Custom Action ${actions.length + 1}`,
+        actionType as any
+      )
+    );
+  };
+
+  renderActions = (actions: Array<Action>): React.ReactNode => {
+    const { ruleData } = this.props;
+
+    if (!actions.length) {
+      return null;
+    }
+
+    return (
+      <div className="ct-custom-actions-pane__actions">
+        {actions.map((action, idx) => (
+          <CustomActionsPaneSummary
+            key={`${action.id} + ${idx}`}
+            action={action}
+            ruleData={ruleData}
+            onDetailShow={this.handleCustomActionShow}
+            onRemove={this.handleCustomAttackRemove}
+          />
+        ))}
+      </div>
+    );
+  };
+
+  renderActionGroup = (
+    heading: string,
+    actionType: Constants.ActionTypeEnum
+  ): React.ReactNode => {
+    const { actions } = this.props;
+
+    let filteredActions = actions.filter(
+      (action) => ActionUtils.getActionTypeId(action) === actionType
+    );
+    if (!filteredActions.length) {
+      return null;
+    }
+
+    return (
+      <div className="ct-custom-actions-pane__group">
+        <div className="ct-custom-actions-pane__group-heading">
+          <Heading>{heading}</Heading>
+        </div>
+        <div className="ct-custom-actions-pane__group-actions">
+          {this.renderActions(filteredActions)}
+        </div>
+      </div>
+    );
+  };
+
+  renderAdd = (): React.ReactNode => {
+    let customActionOptions: Array<HtmlSelectOption> = [
+      { label: "General", value: Constants.ActionTypeEnum.GENERAL },
+      { label: "Spell", value: Constants.ActionTypeEnum.SPELL },
+      { label: "Weapon", value: Constants.ActionTypeEnum.WEAPON },
+    ];
+    return (
+      <div className="ct-custom-actions-pane__add">
+        <Heading>Add new Actions</Heading>
+        <Select
+          options={customActionOptions}
+          resetAfterChoice={true}
+          onChange={this.handleActionAdd}
+          value={null}
+        />
+      </div>
+    );
+  };
+
+  render() {
+    const {} = this.props;
+
+    return (
+      <div className="ct-custom-actions-pane">
+        <Header>Manage Custom Actions</Header>
+        {this.renderActionGroup("General", Constants.ActionTypeEnum.GENERAL)}
+        {this.renderActionGroup("Spells", Constants.ActionTypeEnum.SPELL)}
+        {this.renderActionGroup("Weapons", Constants.ActionTypeEnum.WEAPON)}
+        {this.renderAdd()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    actions: rulesEngineSelectors.getCustomActions(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+  };
+}
+
+const CustomActionsPaneContainer = (props) => {
+  const { pane } = useSidebar();
+  return <CustomActionsPane paneContext={pane} {...props} />;
+};
+
+export default connect(mapStateToProps)(CustomActionsPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/CustomActionsPaneSummary/CustomActionsPaneSummary.tsx b/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/CustomActionsPaneSummary/CustomActionsPaneSummary.tsx
new file mode 100644
index 0000000..22c2557
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/CustomActionsPaneSummary/CustomActionsPaneSummary.tsx
@@ -0,0 +1,85 @@
+import React from "react";
+
+import {
+  Action,
+  ActionUtils,
+  ActivationUtils,
+  Constants,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { RemoveButton } from "../../../../components/common/Button";
+
+interface Props {
+  action: Action;
+  ruleData: RuleData;
+  onDetailShow?: (action: Action) => void;
+  onRemove?: (action: Action) => void;
+}
+export default class CustomActionsPaneSummary extends React.PureComponent<Props> {
+  handleDetailShow = (evt: React.MouseEvent): void => {
+    const { onDetailShow, action } = this.props;
+
+    if (onDetailShow) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onDetailShow(action);
+    }
+  };
+
+  handleRemove = (): void => {
+    const { onRemove, action } = this.props;
+
+    if (onRemove) {
+      onRemove(action);
+    }
+  };
+
+  render() {
+    const { ruleData, action } = this.props;
+
+    let name = ActionUtils.getName(action);
+    let typeId = ActionUtils.getActionTypeId(action);
+    let activationInfo = ActionUtils.getActivation(action);
+
+    let typeLabel: string = "";
+    switch (typeId) {
+      case Constants.ActionTypeEnum.GENERAL:
+        typeLabel = "General";
+        break;
+      case Constants.ActionTypeEnum.SPELL:
+        typeLabel = "Spell";
+        break;
+      case Constants.ActionTypeEnum.WEAPON:
+        typeLabel = "Weapon";
+        break;
+      default:
+      // not implemented
+    }
+
+    return (
+      <div
+        className="ct-custom-actions-pane__summary"
+        onClick={this.handleDetailShow}
+      >
+        <div className="ct-custom-actions-pane__summary-content">
+          <div className="ct-custom-actions-pane__summary-name">
+            {name ? name : "--"}
+          </div>
+          {activationInfo !== null && (
+            <div className="ct-custom-actions-pane__summary-meta">
+              {ActivationUtils.renderActivation(activationInfo, ruleData)}
+            </div>
+          )}
+        </div>
+        <div className="ct-custom-actions-pane__summary-actions">
+          <div className="ct-custom-actions-pane__summary-action ct-custom-actions-pane__summary-action--remove">
+            <RemoveButton onClick={this.handleRemove}>
+              Remove Action
+            </RemoveButton>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/CustomActionsPaneSummary/index.ts b/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/CustomActionsPaneSummary/index.ts
new file mode 100644
index 0000000..97d3742
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/CustomActionsPaneSummary/index.ts
@@ -0,0 +1,4 @@
+import CustomActionsPaneSummary from "./CustomActionsPaneSummary";
+
+export default CustomActionsPaneSummary;
+export { CustomActionsPaneSummary };
diff --git a/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/index.ts
new file mode 100644
index 0000000..37421f0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CustomActionsPane/index.ts
@@ -0,0 +1,5 @@
+import CustomActionsPane from "./CustomActionsPane";
+import CustomActionsPaneSummary from "./CustomActionsPaneSummary";
+
+export default CustomActionsPane;
+export { CustomActionsPane, CustomActionsPaneSummary };
diff --git a/ddb_main/tools/js/Shared/containers/panes/CustomSkillPane/CustomSkillPane.tsx b/ddb_main/tools/js/Shared/containers/panes/CustomSkillPane/CustomSkillPane.tsx
new file mode 100644
index 0000000..74f82ac
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CustomSkillPane/CustomSkillPane.tsx
@@ -0,0 +1,258 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  Collapsible,
+  ProficiencyLevelIcon,
+} from "@dndbeyond/character-components/es";
+import {
+  rulesEngineSelectors,
+  characterActions,
+  RuleData,
+  RuleDataUtils,
+  Skill,
+  SkillUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { InfoItem } from "~/components/InfoItem";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersCustomSkill,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { PaneInitFailureContent } from "../../../../../../subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import CustomizeDataEditor from "../../../components/CustomizeDataEditor";
+import EditorBox from "../../../components/EditorBox";
+import { RemoveButton } from "../../../components/common/Button";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+
+interface Props extends DispatchProp {
+  customSkills: Array<Skill>;
+  ruleData: RuleData;
+  identifiers: PaneIdentifiersCustomSkill | null;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  paneContext: PaneInfo;
+}
+interface State {
+  skill: Skill | null;
+}
+class CustomSkillPane extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = this.generateStateData(props);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { customSkills, identifiers } = this.props;
+
+    if (
+      customSkills !== prevProps.customSkills ||
+      identifiers !== prevProps.identifiers
+    ) {
+      this.setState(this.generateStateData(this.props));
+    }
+  }
+
+  generateStateData = (props: Props): State => {
+    const { customSkills, identifiers } = props;
+
+    let foundSkill: Skill | null | undefined = null;
+    if (identifiers !== null) {
+      foundSkill = customSkills.find((skill) => identifiers.id === skill.id);
+    }
+
+    return {
+      skill: foundSkill ? foundSkill : null,
+    };
+  };
+
+  handleSkillsManageShow = (): void => {
+    const {
+      paneContext: { paneHistoryPush },
+    } = this.props;
+
+    paneHistoryPush(PaneComponentEnum.SKILLS);
+  };
+
+  handleSkillRemove = (): void => {
+    const { skill } = this.state;
+    const {
+      dispatch,
+      paneContext: { paneHistoryStart },
+    } = this.props;
+
+    paneHistoryStart(PaneComponentEnum.SKILLS);
+    if (skill) {
+      dispatch(characterActions.customProficiencyRemove(skill.id));
+    }
+  };
+
+  getData = (): Record<string, any> => {
+    const { skill } = this.state;
+
+    if (skill === null) {
+      return {};
+    }
+
+    const originalContract = SkillUtils.getOriginalContract(skill);
+
+    if (originalContract === null) {
+      return {};
+    }
+
+    const {
+      name,
+      notes,
+      proficiencyLevel,
+      statId,
+      type,
+      override,
+      miscBonus,
+      magicBonus,
+      description,
+    } = originalContract;
+
+    return {
+      name,
+      notes,
+      proficiencyLevel,
+      statId,
+      type,
+      override,
+      miscBonus,
+      magicBonus,
+      description,
+    };
+  };
+
+  handleDataUpdate = (data: Record<string, any>): void => {
+    const { skill } = this.state;
+    const { dispatch } = this.props;
+
+    if (skill) {
+      dispatch(characterActions.customProficiencySet(skill.id, data));
+    }
+  };
+
+  renderCustomize = (): React.ReactNode => {
+    const { ruleData, isReadonly } = this.props;
+
+    if (isReadonly) {
+      return null;
+    }
+
+    return (
+      <Collapsible
+        layoutType={"minimal"}
+        header="Edit"
+        className="ct-custom-skill-pane__edit"
+      >
+        <EditorBox>
+          <CustomizeDataEditor
+            data={this.getData()}
+            enableName={true}
+            enableNotes={true}
+            enableDescription={true}
+            enableStat={true}
+            enableProficiencyLevel={true}
+            enableMagicBonus={true}
+            enableMiscBonus={true}
+            enableOverride={true}
+            maxNameLength={1024}
+            onDataUpdate={this.handleDataUpdate}
+            statOptions={RuleDataUtils.getStatOptions(ruleData)}
+            proficiencyLevelOptions={RuleDataUtils.getProficiencyLevelOptions(
+              ruleData
+            )}
+          />
+        </EditorBox>
+      </Collapsible>
+    );
+  };
+
+  render() {
+    const { skill } = this.state;
+    const { isReadonly, ruleData, theme } = this.props;
+
+    if (skill === null) {
+      return <PaneInitFailureContent />;
+    }
+    const notes = SkillUtils.getNotes(skill);
+    const description = SkillUtils.getDescription(skill);
+    const modifier = SkillUtils.getModifier(skill);
+    const statName = RuleDataUtils.getAbilityShortName(
+      SkillUtils.getStat(skill),
+      ruleData
+    );
+    const proficiencyLevel = SkillUtils.getProficiencyLevel(skill);
+    const name = SkillUtils.getName(skill);
+
+    const infoItemProps = { role: "listitem", inline: true };
+
+    return (
+      <div className="ct-custom-skill-pane" key={skill.id}>
+        <Header parent="Skills" onClick={this.handleSkillsManageShow}>
+          <div className="ct-custom-skill-pane__header">
+            <div className="ct-custom-skill-pane__header-icon">
+              <ProficiencyLevelIcon
+                theme={theme}
+                proficiencyLevel={proficiencyLevel}
+              />
+            </div>
+            <div className="ct-custom-skill-pane__header-ability">
+              {statName === null ? "--" : statName}
+            </div>
+            <div className="ct-custom-skill-pane__header-name">{name}</div>
+            <div className="ct-custom-skill-pane__header-modifier">
+              <NumberDisplay type="signed" number={modifier} />
+            </div>
+          </div>
+        </Header>
+        {this.renderCustomize()}
+        {notes && (
+          <div className="ct-custom-skill-pane__properties" role="list">
+            <InfoItem label="Notes" {...infoItemProps}>
+              {notes}
+            </InfoItem>
+          </div>
+        )}
+        {description && (
+          <div className="ct-custom-skill-pane__description">{description}</div>
+        )}
+        {!isReadonly && (
+          <div className="ct-custom-skill-pane__actions">
+            <RemoveButton onClick={this.handleSkillRemove}>Remove</RemoveButton>
+          </div>
+        )}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    customSkills: rulesEngineSelectors.getCustomSkills(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const CustomSkillPaneContainer = (props) => {
+  const { pane } = useSidebar();
+
+  return <CustomSkillPane {...props} paneContext={pane} />;
+};
+
+export default connect(mapStateToProps)(CustomSkillPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/CustomSkillPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/CustomSkillPane/index.ts
new file mode 100644
index 0000000..c56fb8d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/CustomSkillPane/index.ts
@@ -0,0 +1,4 @@
+import CustomSkillPane from "./CustomSkillPane";
+
+export default CustomSkillPane;
+export { CustomSkillPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DecoratePane/BackdropManager/BackdropManager.tsx b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/BackdropManager/BackdropManager.tsx
new file mode 100644
index 0000000..99b43cb
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/BackdropManager/BackdropManager.tsx
@@ -0,0 +1,223 @@
+import axios, { Canceler } from "axios";
+import { uniq } from "lodash";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { LoadingPlaceholder } from "@dndbeyond/character-components/es";
+import {
+  ApiRequests,
+  ApiAdapterUtils,
+  characterActions,
+  CharacterBackdropContract,
+  CharClass,
+  ClassUtils,
+  rulesEngineSelectors,
+  DecorationInfo,
+  DecorationUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+
+import DataLoadingStatusEnum from "../../../../constants/DataLoadingStatusEnum";
+import { SharedAppState } from "../../../../stores/typings";
+import { AppLoggerUtils } from "../../../../utils";
+import { DecorationPreviewItem } from "../DecorationPreviewItem";
+
+interface BackdropGroups {
+  label: string;
+  backdrops: Array<CharacterBackdropContract>;
+}
+interface Props extends DispatchProp {
+  decorationInfo: DecorationInfo;
+  startingClass: CharClass | null;
+}
+interface State {
+  backdropData: Array<CharacterBackdropContract>;
+  loadingStatus: DataLoadingStatusEnum;
+}
+class BackdropManager extends React.PureComponent<Props, State> {
+  loadBackdropsCanceler: null | Canceler = null;
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      backdropData: [],
+      loadingStatus: DataLoadingStatusEnum.NOT_INITIALIZED,
+    };
+  }
+
+  componentDidMount(): void {
+    this.setState({
+      loadingStatus: DataLoadingStatusEnum.LOADING,
+    });
+
+    ApiRequests.getCharacterGameDataBackdrops({
+      cancelToken: new axios.CancelToken((c) => {
+        this.loadBackdropsCanceler = c;
+      }),
+    })
+      .then((response) => {
+        let apiData: Array<CharacterBackdropContract> = [];
+
+        const data = ApiAdapterUtils.getResponseData(response);
+        if (data !== null) {
+          apiData = data;
+        }
+
+        this.setState({
+          backdropData: apiData,
+          loadingStatus: DataLoadingStatusEnum.LOADED,
+        });
+        this.loadBackdropsCanceler = null;
+      })
+      .catch(AppLoggerUtils.handleAdhocApiError);
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadBackdropsCanceler !== null) {
+      this.loadBackdropsCanceler();
+    }
+  }
+
+  handleBackdropClick = (backdrop: CharacterBackdropContract): void => {
+    const { dispatch } = this.props;
+
+    dispatch(characterActions.backdropSet(backdrop));
+  };
+
+  handleDefaultBackdropClick = (): void => {
+    const { dispatch } = this.props;
+    dispatch(
+      characterActions.backdropSet({
+        backdropAvatarId: null,
+        backdropAvatarUrl: "",
+        largeBackdropAvatarId: null,
+        largeBackdropAvatarUrl: "",
+        smallBackdropAvatarId: null,
+        smallBackdropAvatarUrl: "",
+        thumbnailBackdropAvatarId: null,
+        thumbnailBackdropAvatarUrl: "",
+      })
+    );
+  };
+
+  renderItems = (
+    heading: string,
+    backdrops: Array<CharacterBackdropContract>
+  ): React.ReactNode => {
+    const { decorationInfo } = this.props;
+    const currentBackdrop = DecorationUtils.getBackdropInfo(decorationInfo);
+    return (
+      <div className="ct-decoration-manager__group" key={heading}>
+        <Heading>{heading}</Heading>
+        <div className="ct-decoration-manager__list">
+          {backdrops.map((backdrop) => (
+            <DecorationPreviewItem
+              key={backdrop.id}
+              avatarId={backdrop.thumbnailBackdropAvatarId}
+              avatarName={backdrop.name}
+              isCurrent={
+                backdrop.backdropAvatarId === currentBackdrop.backdropAvatarId
+              }
+              onSelected={() => this.handleBackdropClick(backdrop)}
+              innerClassName="ct-decoration-manager__item-img"
+            >
+              <img
+                className="ct-decoration-manager__item-img"
+                src={backdrop.thumbnailBackdropAvatarUrl ?? ""}
+                alt={`${backdrop.name} backdrop preview`}
+                loading="lazy"
+              />
+            </DecorationPreviewItem>
+          ))}
+        </div>
+      </div>
+    );
+  };
+
+  renderContent = (): React.ReactNode => {
+    const { decorationInfo, startingClass } = this.props;
+    const { backdropData } = this.state;
+
+    const currentBackdrop = DecorationUtils.getBackdropInfo(decorationInfo);
+    let startingClassBackdrop: CharacterBackdropContract | null = null;
+
+    if (startingClass) {
+      const startingClassBackdropData = backdropData.find(
+        (data) => data.classId === ClassUtils.getId(startingClass)
+      );
+      startingClassBackdrop = startingClassBackdropData
+        ? startingClassBackdropData
+        : null;
+    }
+
+    let backdropTags: Array<string> = uniq(
+      backdropData.reduce((acc, data) => {
+        let tags = data.tags ? data.tags : [];
+        return [...acc, ...tags];
+      }, [])
+    );
+
+    let backdropGroups: Array<BackdropGroups> = [];
+    backdropTags.forEach((backdropTag) => {
+      let backdrops = backdropData.filter(
+        (data) => data.tags && data.tags.includes(backdropTag)
+      );
+      backdropGroups.push({
+        label: backdropTag,
+        backdrops,
+      });
+    });
+
+    return (
+      <React.Fragment>
+        {startingClassBackdrop && (
+          <div className="ct-decoration-manager__group">
+            <Heading>Default</Heading>
+            <div className="ct-decoration-manager__list">
+              <DecorationPreviewItem
+                avatarId={startingClassBackdrop.backdropAvatarId}
+                avatarName={startingClassBackdrop.name}
+                isCurrent={currentBackdrop.backdropAvatarId === null}
+                onSelected={this.handleDefaultBackdropClick}
+              >
+                <img
+                  className="ct-decoration-manager__item-img"
+                  src={startingClassBackdrop.thumbnailBackdropAvatarUrl ?? ""}
+                  alt={`${startingClassBackdrop.name} backdrop preview`}
+                  loading="lazy"
+                />
+              </DecorationPreviewItem>
+            </div>
+          </div>
+        )}
+        {backdropGroups.map((backdropGroup) =>
+          this.renderItems(backdropGroup.label, backdropGroup.backdrops)
+        )}
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    const { loadingStatus } = this.state;
+
+    let contentNode: React.ReactNode;
+    if (loadingStatus === DataLoadingStatusEnum.LOADED) {
+      contentNode = this.renderContent();
+    } else {
+      contentNode = <LoadingPlaceholder />;
+    }
+
+    return <div className="ct-decoration-manager">{contentNode}</div>;
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    decorationInfo: rulesEngineSelectors.getDecorationInfo(state),
+    startingClass: rulesEngineSelectors.getStartingClass(state),
+  };
+}
+
+export default connect(mapStateToProps)(BackdropManager);
diff --git a/ddb_main/tools/js/Shared/containers/panes/DecoratePane/CurrentDecorationItem/CurrentDecorationItem.tsx b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/CurrentDecorationItem/CurrentDecorationItem.tsx
new file mode 100644
index 0000000..51a12be
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/CurrentDecorationItem/CurrentDecorationItem.tsx
@@ -0,0 +1,40 @@
+import React from "react";
+
+interface Props {
+  onClick?: (decorationKey: string) => void;
+  label: string;
+  isActive: boolean;
+  isReadonly: boolean;
+  decorationKey: string;
+}
+const CurrentDecorationItem: React.FC<Props> = ({
+  label,
+  onClick,
+  isActive,
+  isReadonly,
+  decorationKey,
+  children,
+}) => {
+  return (
+    <div
+      className="ct-decorate-pane__grid-item"
+      onClick={(evt: React.MouseEvent) => {
+        evt.stopPropagation();
+        if (onClick) {
+          onClick(decorationKey);
+        }
+      }}
+    >
+      <div className="ct-decorate-pane__grid-item-label">{label}</div>
+      <div
+        className={`ct-decorate-pane__grid-item-inner ${
+          isActive ? "ct-decorate-pane__grid-item-inner--is-active" : ""
+        }`}
+      >
+        {children}
+      </div>
+    </div>
+  );
+};
+
+export default CurrentDecorationItem;
diff --git a/ddb_main/tools/js/Shared/containers/panes/DecoratePane/DecoratePane.tsx b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/DecoratePane.tsx
new file mode 100644
index 0000000..5fd63bb
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/DecoratePane.tsx
@@ -0,0 +1,269 @@
+import React, { useContext, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import {
+  AbilitySummary,
+  CharacterAvatar,
+  CharacterAvatarPortrait,
+  Collapsible,
+  CollapsibleHeaderContent,
+  LightLongRestSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  DecorationUtils,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+import { Dice } from "@dndbeyond/dice";
+
+import { useAbilities } from "~/hooks/useAbilities";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+
+import { appEnvActions } from "../../../actions/appEnv";
+import CtaPreferenceManager from "../../../components/CtaPreferenceManager";
+import { AttributesManagerContext } from "../../../managers/AttributesManagerContext";
+import { characterRollContextSelectors } from "../../../selectors";
+import * as appEnvSelectors from "../../../selectors/appEnv";
+import { BackdropManager } from "./BackdropManager";
+import { CurrentDecorationItem } from "./CurrentDecorationItem";
+import { FrameManager } from "./FrameManager";
+import { PortraitManager } from "./PortraitManager";
+import { ThemeManager } from "./ThemeManager";
+
+enum SHOP_KEY {
+  NONE = "NONE",
+  FRAMES = "FRAMES",
+  BACKDROPS = "BACKDROPS",
+  PORTRAITS = "PORTRAITS",
+  THEMES = "THEMES",
+  PREFERENCES = "PREFERENCES",
+  DICE = "DICE",
+}
+
+export default function DecoratePane() {
+  const { attributesManager } = useContext(AttributesManagerContext);
+  const abilities = useAbilities();
+  const highestAbility = attributesManager.getHighestAbilityScore(abilities);
+  const dispatch = useDispatch();
+  const decorationInfo = useSelector(rulesEngineSelectors.getDecorationInfo);
+  const isReadonly = useSelector(appEnvSelectors.getIsReadonly);
+  const diceEnabled = useSelector(appEnvSelectors.getDiceEnabled);
+  const preferences = useSelector(rulesEngineSelectors.getCharacterPreferences);
+  const characterRollContext = useSelector(
+    characterRollContextSelectors.getCharacterRollContext
+  );
+  const [currentShop, setCurrentShop] = useState<SHOP_KEY>(SHOP_KEY.NONE);
+
+  const handleDarkModeToggle = (): void => {
+    const { enableDarkMode } = preferences;
+
+    dispatch(
+      characterActions.preferenceChoose("enableDarkMode", !enableDarkMode)
+    );
+  };
+
+  //TODO this is repeated a few times now.. reusable thing? hook?
+  const handleDiceToggle = (): void => {
+    const newDiceEnabledSetting: boolean = !diceEnabled;
+
+    try {
+      localStorage.setItem("dice-enabled", newDiceEnabledSetting.toString());
+      Dice.setEnabled(newDiceEnabledSetting);
+    } catch (e) {}
+
+    dispatch(
+      appEnvActions.dataSet({
+        diceEnabled: newDiceEnabledSetting,
+      })
+    );
+  };
+
+  const handleClick = (type: SHOP_KEY): void => {
+    setCurrentShop(type);
+  };
+
+  const handleCollapseChange = (isCollapsed: boolean, type: SHOP_KEY): void => {
+    setCurrentShop(!isCollapsed ? type : SHOP_KEY.NONE);
+  };
+
+  const renderPreferences = (): React.ReactNode => {
+    const { enableDarkMode } = preferences;
+
+    const headerNode: React.ReactNode = (
+      <CollapsibleHeaderContent heading={"Preferences"} />
+    );
+
+    return (
+      <Collapsible
+        header={headerNode}
+        layoutType="minimal"
+        className="ct-decorate-pane__preferences"
+        initiallyCollapsed={false}
+      >
+        <div className="ct-decorate-pane__preferences-content">
+          <CtaPreferenceManager
+            preferenceEnabled={enableDarkMode}
+            onPreferenceClick={handleDarkModeToggle}
+            icon={<LightLongRestSvg />}
+            backgroundImageUrl="https://www.dndbeyond.com/avatars/13574/100/637396156849705602.jpeg"
+            borderColor="#715280"
+            switchColor="#715280"
+            preferenceTitle="Underdark Mode"
+          />
+        </div>
+      </Collapsible>
+    );
+  };
+
+  const renderDecorateShop = (): React.ReactNode => {
+    return (
+      <div className="ct-decorate-pane__shop">
+        <Heading>Browse Decorations</Heading>
+
+        {/*BACKDROPS*/}
+        <Collapsible
+          header="Backdrops"
+          collapsed={currentShop !== SHOP_KEY.BACKDROPS}
+          onChangeHandler={(isCollapsed) =>
+            handleCollapseChange(isCollapsed, SHOP_KEY.BACKDROPS)
+          }
+        >
+          <BackdropManager />
+        </Collapsible>
+
+        {/*FRAMES*/}
+        <Collapsible
+          header="Frames"
+          collapsed={currentShop !== SHOP_KEY.FRAMES}
+          onChangeHandler={(isCollapsed) =>
+            handleCollapseChange(isCollapsed, SHOP_KEY.FRAMES)
+          }
+        >
+          <FrameManager />
+        </Collapsible>
+
+        {/*THEMES*/}
+        <Collapsible
+          header="Themes"
+          collapsed={currentShop !== SHOP_KEY.THEMES}
+          onChangeHandler={(isCollapsed) =>
+            handleCollapseChange(isCollapsed, SHOP_KEY.THEMES)
+          }
+        >
+          <ThemeManager />
+        </Collapsible>
+
+        {/*PORTRAITS*/}
+        <Collapsible
+          header="Portraits"
+          collapsed={currentShop !== SHOP_KEY.PORTRAITS}
+          onChangeHandler={(isCollapsed) =>
+            handleCollapseChange(isCollapsed, SHOP_KEY.PORTRAITS)
+          }
+        >
+          <PortraitManager />
+        </Collapsible>
+
+        {/*DICE*/}
+        {/*<Collapsible*/}
+        {/*    header="Dice"*/}
+        {/*    collapsed={currentShop !== SHOP_KEY.DICE}*/}
+        {/*    onChangeHandler={(isCollapsed) => handleCollapseChange(isCollapsed, SHOP_KEY.DICE)}*/}
+        {/*>*/}
+        {/*    <div>*/}
+        {/*        DICE CHOICE FOR THIS CHARACTER??? HOW NICE!!*/}
+
+        {/*        or could we show a picture at least?*/}
+        {/*    </div>*/}
+        {/*</Collapsible>*/}
+      </div>
+    );
+  };
+
+  const avatarInfo = DecorationUtils.getAvatarInfo(decorationInfo);
+  const backdropInfo = DecorationUtils.getBackdropInfo(decorationInfo);
+  const characterTheme = DecorationUtils.getCharacterTheme(decorationInfo);
+
+  let avatarClasses: Array<string> = ["ct-decorate-pane__portrait"];
+  if (!avatarInfo.avatarUrl) {
+    avatarClasses.push("ct-decorate-pane__portrait--none");
+  }
+
+  let backdropClasses: Array<string> = ["ct-decorate-pane__backdrop"];
+  let backdropStyles: React.CSSProperties = {};
+  if (backdropInfo.thumbnailBackdropAvatarUrl) {
+    backdropStyles = {
+      backgroundImage: `url(${backdropInfo.thumbnailBackdropAvatarUrl})`,
+    };
+  } else {
+    backdropClasses.push("ct-decorate-pane__backdrop--none");
+  }
+
+  return (
+    <div className="ct-decorate-pane">
+      <div className="ct-decorate-pane__current-selections">
+        <Header>Current Decorations</Header>
+        <div className="ct-decorate-pane__grid">
+          <CurrentDecorationItem
+            label="Portrait"
+            onClick={handleClick}
+            decorationKey={SHOP_KEY.PORTRAITS}
+            isActive={currentShop === SHOP_KEY.PORTRAITS}
+            isReadonly={isReadonly}
+          >
+            <CharacterAvatarPortrait
+              className={avatarClasses.join(" ")}
+              avatarUrl={avatarInfo.avatarUrl}
+            />
+          </CurrentDecorationItem>
+
+          <CurrentDecorationItem
+            label="Frame"
+            onClick={handleClick}
+            decorationKey={SHOP_KEY.FRAMES}
+            isActive={currentShop === SHOP_KEY.FRAMES}
+            isReadonly={isReadonly}
+          >
+            <CharacterAvatar avatarInfo={avatarInfo} />
+          </CurrentDecorationItem>
+
+          <CurrentDecorationItem
+            label="Theme"
+            onClick={handleClick}
+            decorationKey={SHOP_KEY.THEMES}
+            isActive={currentShop === SHOP_KEY.THEMES}
+            isReadonly={isReadonly}
+          >
+            <div className="ct-decorate-pane__theme">
+              {highestAbility && (
+                <AbilitySummary
+                  theme={characterTheme}
+                  ability={highestAbility}
+                  preferences={preferences}
+                  diceEnabled={false}
+                  rollContext={characterRollContext}
+                />
+              )}
+              <div className="ct-decorate-pane__theme-color">
+                {characterTheme.name}
+              </div>
+            </div>
+          </CurrentDecorationItem>
+
+          <CurrentDecorationItem
+            label="Backdrop"
+            onClick={handleClick}
+            decorationKey={SHOP_KEY.BACKDROPS}
+            isActive={currentShop === SHOP_KEY.BACKDROPS}
+            isReadonly={isReadonly}
+          >
+            <div className={backdropClasses.join(" ")} style={backdropStyles} />
+          </CurrentDecorationItem>
+        </div>
+      </div>
+      {renderPreferences()}
+      {renderDecorateShop()}
+    </div>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DecoratePane/DecorationPreviewItem/DecorationPreviewItem.tsx b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/DecorationPreviewItem/DecorationPreviewItem.tsx
new file mode 100644
index 0000000..6c5ad79
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/DecorationPreviewItem/DecorationPreviewItem.tsx
@@ -0,0 +1,59 @@
+import React from "react";
+
+interface Props {
+  avatarId: number | null;
+  avatarName?: string | null;
+  isSelected?: boolean;
+  isCurrent: boolean;
+  onSelected?: (avatarId: number | null) => void;
+  className?: string;
+  innerClassName?: string;
+}
+export default class DecorationPreviewItem extends React.PureComponent<Props> {
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onSelected, avatarId } = this.props;
+
+    if (onSelected) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onSelected(avatarId);
+    }
+  };
+
+  render() {
+    const {
+      isSelected,
+      isCurrent,
+      children,
+      avatarName,
+      className,
+      innerClassName,
+    } = this.props;
+
+    let classNames: Array<string> = ["ct-decoration-manager__item"];
+    if (className) {
+      classNames.push(className);
+    }
+    if (isSelected) {
+      classNames.push("ct-decoration-manager__item--selected");
+    }
+    if (isCurrent) {
+      classNames.push("ct-decoration-manager__item--current");
+    }
+
+    return (
+      <div className={classNames.join(" ")} onClick={this.handleClick}>
+        <div
+          className={`ct-decoration-manager__item-inner${
+            innerClassName ? ` ${innerClassName}` : ""
+          }`}
+        >
+          {children}
+        </div>
+        {avatarName && (
+          <div className="ct-decoration-manager__item-label">{avatarName}</div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DecoratePane/DecorationPreviewItem/index.ts b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/DecorationPreviewItem/index.ts
new file mode 100644
index 0000000..fc1e47b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/DecorationPreviewItem/index.ts
@@ -0,0 +1,4 @@
+import DecorationPreviewItem from "./DecorationPreviewItem";
+
+export default DecorationPreviewItem;
+export { DecorationPreviewItem };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DecoratePane/FrameManager/FrameManager.tsx b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/FrameManager/FrameManager.tsx
new file mode 100644
index 0000000..8b47612
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/FrameManager/FrameManager.tsx
@@ -0,0 +1,221 @@
+import axios, { Canceler } from "axios";
+import { uniq } from "lodash";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { LoadingPlaceholder } from "@dndbeyond/character-components/es";
+import {
+  ApiRequests,
+  ApiAdapterUtils,
+  characterActions,
+  CharacterPortraitFrameContract,
+  rulesEngineSelectors,
+  DecorationInfo,
+  DecorationUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+
+import DataLoadingStatusEnum from "../../../../constants/DataLoadingStatusEnum";
+import { SharedAppState } from "../../../../stores/typings";
+import { AppLoggerUtils } from "../../../../utils";
+import { DecorationPreviewItem } from "../DecorationPreviewItem";
+
+interface FrameGroupInfo {
+  label: string;
+  frames: Array<CharacterPortraitFrameContract>;
+}
+
+interface Props extends DispatchProp {
+  decorationInfo: DecorationInfo;
+}
+interface State {
+  frameData: Array<CharacterPortraitFrameContract>;
+  loadingStatus: DataLoadingStatusEnum;
+}
+class FrameManager extends React.PureComponent<Props, State> {
+  loadFramesCanceler: null | Canceler = null;
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      frameData: [],
+      loadingStatus: DataLoadingStatusEnum.NOT_INITIALIZED,
+    };
+  }
+
+  componentDidMount(): void {
+    this.setState({
+      loadingStatus: DataLoadingStatusEnum.LOADING,
+    });
+
+    ApiRequests.getCharacterGameDataFrames({
+      cancelToken: new axios.CancelToken((c) => {
+        this.loadFramesCanceler = c;
+      }),
+    })
+      .then((response) => {
+        let apiData: Array<CharacterPortraitFrameContract> = [];
+
+        const data = ApiAdapterUtils.getResponseData(response);
+        if (data !== null) {
+          apiData = data;
+        }
+
+        this.setState({
+          frameData: apiData,
+          loadingStatus: DataLoadingStatusEnum.LOADED,
+        });
+        this.loadFramesCanceler = null;
+      })
+      .catch(AppLoggerUtils.handleAdhocApiError);
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadFramesCanceler !== null) {
+      this.loadFramesCanceler();
+    }
+  }
+
+  handleFrameClick = (frame: CharacterPortraitFrameContract): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.frameSet(frame));
+  };
+
+  handleDefaultFrameClick = (): void => {
+    const { dispatch } = this.props;
+    dispatch(
+      characterActions.frameSet({
+        frameAvatarId: null,
+        frameAvatarUrl: "",
+        decorationKey: null,
+        classId: null,
+        id: -1,
+        name: null,
+        raceId: null,
+        subRaceId: null,
+        tags: null,
+      })
+    );
+  };
+
+  renderFrames = (
+    heading: string,
+    frames: Array<CharacterPortraitFrameContract>
+  ): React.ReactNode => {
+    const { decorationInfo } = this.props;
+    const currentFrameId =
+      DecorationUtils.getAvatarInfo(decorationInfo).frameId;
+
+    return (
+      <div className="ct-decoration-manager__group" key={heading}>
+        <Heading>{heading}</Heading>
+        <div className="ct-decoration-manager__list">
+          {frames.map((frame) => (
+            <DecorationPreviewItem
+              key={frame.id}
+              avatarId={frame.frameAvatarId}
+              isCurrent={frame.frameAvatarId === currentFrameId}
+              onSelected={() => this.handleFrameClick(frame)}
+              avatarName={frame.name}
+              innerClassName="ct-decoration-manager__item-img"
+            >
+              <img
+                className="ct-decoration-manager__item-frame"
+                src={frame.frameAvatarUrl ?? ""}
+                alt={`${frame.name} frame preview`}
+                loading="lazy"
+              />
+            </DecorationPreviewItem>
+          ))}
+        </div>
+      </div>
+    );
+  };
+
+  renderNoFrames = (): React.ReactNode => {
+    //TODO DECO CTA
+    return (
+      <div className="ct-decoration-manager__no-frames">
+        You have no extra frames available to choose from.
+      </div>
+    );
+  };
+
+  renderFrameChoices = (): React.ReactNode => {
+    const { decorationInfo } = this.props;
+    const { frameData } = this.state;
+    const currentFrameId =
+      DecorationUtils.getAvatarInfo(decorationInfo).frameId;
+
+    let frameTags: Array<string> = uniq(
+      frameData.reduce((acc: Array<string>, data) => {
+        let tags = data.tags ? data.tags : [];
+        return [...acc, ...tags];
+      }, [])
+    );
+    let frameGroups: Array<FrameGroupInfo> = [];
+    frameTags.forEach((frameTag) => {
+      let frames = frameData.filter(
+        (data) => data.tags && data.tags.includes(frameTag)
+      );
+      frameGroups.push({
+        label: frameTag,
+        frames,
+      });
+    });
+
+    return (
+      <React.Fragment>
+        <div className="ct-decoration-manager__group">
+          <Heading>Default</Heading>
+          <div className="ct-decoration-manager__list">
+            <DecorationPreviewItem
+              avatarId={null}
+              isCurrent={currentFrameId === null}
+              onSelected={this.handleDefaultFrameClick}
+              avatarName={"Default"}
+            >
+              <div className="ct-decoration-manager__item--default" />
+            </DecorationPreviewItem>
+          </div>
+        </div>
+        {frameGroups.map((frameGroup) =>
+          this.renderFrames(frameGroup.label, frameGroup.frames)
+        )}
+      </React.Fragment>
+    );
+  };
+
+  renderContent = (): React.ReactNode => {
+    const { frameData } = this.state;
+
+    if (frameData.length > 0) {
+      return this.renderFrameChoices();
+    } else {
+      return this.renderNoFrames();
+    }
+  };
+
+  render() {
+    const { loadingStatus } = this.state;
+
+    let contentNode: React.ReactNode;
+    if (loadingStatus === DataLoadingStatusEnum.LOADED) {
+      contentNode = this.renderContent();
+    } else {
+      contentNode = <LoadingPlaceholder />;
+    }
+
+    return <div className="ct-decoration-manager">{contentNode}</div>;
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    decorationInfo: rulesEngineSelectors.getDecorationInfo(state),
+  };
+}
+
+export default connect(mapStateToProps)(FrameManager);
diff --git a/ddb_main/tools/js/Shared/containers/panes/DecoratePane/PortraitManager/PortraitManager.tsx b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/PortraitManager/PortraitManager.tsx
new file mode 100644
index 0000000..02b70b4
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/PortraitManager/PortraitManager.tsx
@@ -0,0 +1,421 @@
+import axios, { Canceler } from "axios";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  ApiRequests,
+  ApiAdapterUtils,
+  characterActions,
+  CharacterPortraitContract,
+  Race,
+  RaceUtils,
+  rulesEngineSelectors,
+  DecorationInfo,
+  DecorationUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Button } from "~/components/Button";
+import { ACCEPTED_IMAGE_TYPES, FILE_SIZE_3MB } from "~/constants";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+import DataLoadingStatusEnum from "~/tools/js/Shared/constants/DataLoadingStatusEnum";
+import { SharedAppState } from "~/tools/js/Shared/stores/typings";
+import { AppLoggerUtils } from "~/tools/js/Shared/utils";
+import { CharacterAvatarPortrait } from "~/tools/js/smartComponents/CharacterAvatar";
+import LoadingPlaceholder from "~/tools/js/smartComponents/LoadingPlaceholder";
+
+import DecorationPreviewItem from "../DecorationPreviewItem";
+
+interface Props extends DispatchProp {
+  decorationInfo: DecorationInfo;
+  species: Race | null;
+  handleSelectPortrait?: (portrait: CharacterPortraitContract) => void;
+}
+interface State {
+  isCustomPortrait: boolean;
+  portraitUploadData: string | null;
+  portraitUploadWidth: number | null;
+  portraitUploadHeight: number | null;
+  portraitUploadValid: boolean | null;
+  portraitUploadValidSize: boolean | null;
+  portraitData: Array<CharacterPortraitContract>;
+  loadingStatus: DataLoadingStatusEnum;
+  currentSelection: CharacterPortraitContract | null;
+}
+class PortraitManager extends React.PureComponent<Props, State> {
+  loadPortraitsCanceler: null | Canceler = null;
+  portraitUpload = React.createRef<HTMLInputElement>();
+  portraitUploadForm = React.createRef<HTMLFormElement>();
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      portraitUploadData: null,
+      portraitUploadWidth: null,
+      portraitUploadHeight: null,
+      portraitUploadValid: null,
+      portraitUploadValidSize: null,
+      isCustomPortrait: false,
+      portraitData: [],
+      loadingStatus: DataLoadingStatusEnum.NOT_INITIALIZED,
+      currentSelection: null,
+    };
+  }
+
+  componentDidMount(): void {
+    const { decorationInfo } = this.props;
+    const currentAvatarId =
+      DecorationUtils.getAvatarInfo(decorationInfo).avatarId;
+
+    this.setState({
+      loadingStatus: DataLoadingStatusEnum.LOADING,
+    });
+
+    ApiRequests.getCharacterGameDataPortraits({
+      cancelToken: new axios.CancelToken((c) => {
+        this.loadPortraitsCanceler = c;
+      }),
+    })
+      .then((response) => {
+        let apiData: Array<CharacterPortraitContract> = [];
+
+        const data = ApiAdapterUtils.getResponseData(response);
+        if (data !== null) {
+          apiData = data;
+        }
+
+        const isCustomPortrait =
+          currentAvatarId !== null &&
+          !apiData.find((portrait) => portrait.avatarId === currentAvatarId);
+        this.setState({
+          portraitData: apiData,
+          loadingStatus: DataLoadingStatusEnum.LOADED,
+          isCustomPortrait,
+        });
+        this.loadPortraitsCanceler = null;
+      })
+      .catch(AppLoggerUtils.handleAdhocApiError);
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadPortraitsCanceler !== null) {
+      this.loadPortraitsCanceler();
+    }
+  }
+
+  handlePortraitClick = (portrait: CharacterPortraitContract): void => {
+    const { dispatch, handleSelectPortrait } = this.props;
+
+    if (portrait.avatarId && portrait.avatarUrl) {
+      if (handleSelectPortrait) {
+        handleSelectPortrait(portrait);
+        this.setState({
+          currentSelection: portrait,
+        });
+      } else {
+        dispatch(
+          characterActions.portraitSet(portrait.avatarId, portrait.avatarUrl)
+        );
+      }
+    }
+
+    this.setState({
+      isCustomPortrait: false,
+    });
+  };
+
+  isPortraitAvailableForSpecies = (
+    portrait: CharacterPortraitContract,
+    species: Race | null
+  ): boolean => {
+    let currentSpeciesId: number | null = null;
+    let currentSpeciesOptionId: number | null = null;
+    if (species) {
+      const baseSpeciesId = RaceUtils.getBaseRaceId(species);
+      const entitySpeciesId = RaceUtils.getEntityRaceId(species);
+      currentSpeciesId =
+        baseSpeciesId !== null ? baseSpeciesId : entitySpeciesId;
+      currentSpeciesOptionId = baseSpeciesId !== null ? entitySpeciesId : null;
+    }
+
+    if (portrait.raceId !== null && currentSpeciesId === portrait.raceId) {
+      return true;
+    }
+    if (
+      portrait.subRaceId !== null &&
+      currentSpeciesOptionId === portrait.subRaceId
+    ) {
+      return true;
+    }
+
+    return false;
+  };
+
+  handlePortraitUpload = (): void => {
+    const { dispatch } = this.props;
+    const { portraitUploadData } = this.state;
+
+    if (portraitUploadData !== null) {
+      dispatch(characterActions.portraitUpload(portraitUploadData));
+    }
+
+    this.setState({
+      portraitUploadData: null,
+      portraitUploadWidth: null,
+      portraitUploadHeight: null,
+      portraitUploadValid: null,
+      portraitUploadValidSize: null,
+      isCustomPortrait: true,
+    });
+
+    if (this.portraitUploadForm.current) {
+      this.portraitUploadForm.current.reset();
+    }
+  };
+
+  handleCustomPortraitChange = (
+    evt: React.ChangeEvent<HTMLInputElement>
+  ): void => {
+    const fileInput = this.portraitUpload.current;
+
+    if (fileInput && fileInput.files && fileInput.files[0]) {
+      let reader = new FileReader();
+      let file = fileInput.files[0];
+
+      let validFile: boolean = true;
+      if (!ACCEPTED_IMAGE_TYPES.includes(file.type)) {
+        this.setState({
+          portraitUploadValid: false,
+          portraitUploadValidSize: null,
+        });
+        validFile = false;
+      }
+      if (file.size > FILE_SIZE_3MB) {
+        this.setState({
+          portraitUploadValid: null,
+          portraitUploadValidSize: false,
+        });
+        validFile = false;
+      }
+
+      if (validFile) {
+        reader.onload = (e: ProgressEvent) => {
+          let imageData = reader.result;
+          if (typeof imageData === "string") {
+            this.setState({
+              portraitUploadData: imageData,
+              portraitUploadValid: true,
+              portraitUploadValidSize: true,
+            });
+
+            let img = new Image();
+            img.onload = () => {
+              this.setState({
+                portraitUploadWidth: img.width,
+                portraitUploadHeight: img.height,
+              });
+            };
+
+            img.src = imageData;
+          }
+        };
+
+        reader.readAsDataURL(file);
+      }
+    } else {
+      this.setState({
+        portraitUploadData: null,
+        portraitUploadWidth: null,
+        portraitUploadHeight: null,
+        portraitUploadValid: null,
+        portraitUploadValidSize: null,
+      });
+    }
+  };
+
+  renderPortraits = (
+    heading: string,
+    portraits: Array<CharacterPortraitContract>
+  ): React.ReactNode => {
+    const { decorationInfo } = this.props;
+
+    return (
+      <div className="ct-decoration-manager__group">
+        <Heading>{heading}</Heading>
+        <div className="ct-decoration-manager__list">
+          {portraits.map((portrait) => (
+            <DecorationPreviewItem
+              key={portrait.id}
+              avatarId={portrait.avatarId}
+              isSelected={this.state.currentSelection === portrait}
+              isCurrent={
+                DecorationUtils.getAvatarInfo(decorationInfo).avatarId ===
+                portrait.avatarId
+              }
+              onSelected={() => this.handlePortraitClick(portrait)}
+              innerClassName="ct-decoration-manager__item-img"
+            >
+              <CharacterAvatarPortrait avatarUrl={portrait.avatarUrl} />
+            </DecorationPreviewItem>
+          ))}
+        </div>
+      </div>
+    );
+  };
+
+  renderPortraitUploader = (): React.ReactNode => {
+    const {
+      isCustomPortrait,
+      portraitUploadData,
+      portraitUploadValid,
+      portraitUploadValidSize,
+    } = this.state;
+
+    let setButtonLabel: string = "Set Portrait";
+    if (isCustomPortrait) {
+      setButtonLabel = "Change Portrait";
+    }
+
+    let confirmNode: React.ReactNode;
+    if (portraitUploadValid !== null && !portraitUploadValid) {
+      confirmNode = (
+        <div className="ct-decoration-manager__upload-warning">
+          Cannot upload the selected file type. <br />
+          Acceptable file types are jpg, gif, and png.
+        </div>
+      );
+    } else if (portraitUploadValidSize !== null && !portraitUploadValidSize) {
+      confirmNode = (
+        <div className="ct-decoration-manager__upload-warning">
+          Cannot upload the selected file as it exceeds the maximum file size of
+          3MB.
+        </div>
+      );
+    } else if (portraitUploadData) {
+      confirmNode = (
+        <div className="ct-decoration-manager__upload-confirm">
+          <div className="ct-decoration-manager__upload-image">
+            <div className="ct-decoration-manager__upload-image-heading">
+              Preview
+            </div>
+            <CharacterAvatarPortrait
+              className="ct-decoration-manager__upload-image-preview"
+              avatarUrl={portraitUploadData}
+            />
+          </div>
+          <div className="ct-decoration-manager__upload-action">
+            <Button
+              themed
+              onClick={this.handlePortraitUpload}
+              disabled={portraitUploadData === null}
+              size="x-small"
+            >
+              {setButtonLabel}
+            </Button>
+          </div>
+        </div>
+      );
+    }
+
+    return (
+      <div className="ct-decoration-manager__upload">
+        <div className="ct-decoration-manager__upload-heading">
+          <Heading>Upload Portrait</Heading>
+          <div className="ct-decoration-manager__upload-heading-rules">
+            Recommended Size: 150 x 150 Pixels, Maximum File Size: 3MB
+          </div>
+        </div>
+        <form
+          className="ct-decoration-manager__upload-form"
+          ref={this.portraitUploadForm}
+        >
+          <div className="ct-decoration-manager__upload-file">
+            <input
+              className="ct-decoration-manager__upload-file-input"
+              type="file"
+              ref={this.portraitUpload}
+              onChange={this.handleCustomPortraitChange}
+            />
+          </div>
+        </form>
+        {confirmNode}
+      </div>
+    );
+  };
+
+  renderUploadedPortrait = (): React.ReactNode => {
+    const { decorationInfo } = this.props;
+    const { isCustomPortrait } = this.state;
+
+    if (!isCustomPortrait) {
+      return null;
+    }
+
+    const avatarUrl = DecorationUtils.getAvatarInfo(decorationInfo).avatarUrl;
+
+    return (
+      <div className="ct-decoration-manager__custom">
+        <Heading>Current Custom Portrait</Heading>
+        <div className="ct-decoration-manager__custom-content">
+          <div className="ct-decoration-manager__custom-preview">
+            <CharacterAvatarPortrait avatarUrl={avatarUrl} />
+          </div>
+        </div>
+      </div>
+    );
+  };
+
+  renderContent = (): React.ReactNode => {
+    const { species } = this.props;
+    const { portraitData } = this.state;
+
+    let speciesPortraits: CharacterPortraitContract[] = [];
+    let otherPortraits = portraitData;
+    if (species) {
+      speciesPortraits = portraitData.filter((portrait) =>
+        this.isPortraitAvailableForSpecies(portrait, species)
+      );
+      otherPortraits = portraitData.filter(
+        (portrait) => !this.isPortraitAvailableForSpecies(portrait, species)
+      );
+    }
+
+    const otherPortraitLabel: string =
+      speciesPortraits.length > 0 ? "Other Portraits" : "Portraits";
+    return (
+      <React.Fragment>
+        {this.renderUploadedPortrait()}
+        {this.renderPortraitUploader()}
+        {species &&
+          speciesPortraits.length > 0 &&
+          this.renderPortraits(
+            `${species.fullName} Portraits`,
+            speciesPortraits
+          )}
+        {this.renderPortraits(otherPortraitLabel, otherPortraits)}
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    const { loadingStatus } = this.state;
+
+    let contentNode: React.ReactNode;
+    if (loadingStatus === DataLoadingStatusEnum.LOADED) {
+      contentNode = this.renderContent();
+    } else {
+      contentNode = <LoadingPlaceholder />;
+    }
+
+    return <div className="ct-decoration-manager">{contentNode}</div>;
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    decorationInfo: rulesEngineSelectors.getDecorationInfo(state),
+    species: rulesEngineSelectors.getRace(state),
+  };
+}
+
+export default connect(mapStateToProps)(PortraitManager);
diff --git a/ddb_main/tools/js/Shared/containers/panes/DecoratePane/PortraitManager/index.ts b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/PortraitManager/index.ts
new file mode 100644
index 0000000..94cef75
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/PortraitManager/index.ts
@@ -0,0 +1,4 @@
+import PortraitManager from "./PortraitManager";
+
+export default PortraitManager;
+export { PortraitManager };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DecoratePane/ThemeManager/ThemeManager.tsx b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/ThemeManager/ThemeManager.tsx
new file mode 100644
index 0000000..80cea4c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/ThemeManager/ThemeManager.tsx
@@ -0,0 +1,197 @@
+import axios, { Canceler } from "axios";
+import { uniq } from "lodash";
+import { useContext, useEffect, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
+import {
+  AbilitySummary,
+  LoadingPlaceholder,
+} from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterUtils,
+  ApiRequests,
+  characterActions,
+  CharacterThemeColorContract,
+  DecorationUtils,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useAbilities } from "~/hooks/useAbilities";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+import { AttributesManagerContext } from "~/tools/js/Shared/managers/AttributesManagerContext";
+
+import DataLoadingStatusEnum from "../../../../constants/DataLoadingStatusEnum";
+import { characterRollContextSelectors } from "../../../../selectors";
+import { AppLoggerUtils } from "../../../../utils";
+import DecorationPreviewItem from "../DecorationPreviewItem";
+
+interface ThemeGroupInfo {
+  label: string;
+  themes: Array<CharacterThemeColorContract>;
+}
+
+export default function ThemeManager() {
+  let loadThemesCanceler: null | Canceler = null;
+  const [themeData, setThemeData] = useState<
+    Array<CharacterThemeColorContract>
+  >([]);
+  const [loadingStatus, setLoadingStatus] = useState<DataLoadingStatusEnum>(
+    DataLoadingStatusEnum.NOT_INITIALIZED
+  );
+
+  const { attributesManager } = useContext(AttributesManagerContext);
+  const abilities = useAbilities();
+  const highestAbility = attributesManager.getHighestAbilityScore(abilities);
+
+  const dispatch = useDispatch();
+  const decorationInfo = useSelector(rulesEngineSelectors.getDecorationInfo);
+  const startingClass = useSelector(rulesEngineSelectors.getStartingClass);
+  const preferences = useSelector(rulesEngineSelectors.getCharacterPreferences);
+  const characterRollContext = useSelector(
+    characterRollContextSelectors.getCharacterRollContext
+  );
+
+  useEffect(() => {
+    setLoadingStatus(DataLoadingStatusEnum.LOADING);
+
+    ApiRequests.getCharacterGameDataThemeColors({
+      cancelToken: new axios.CancelToken((c) => {
+        loadThemesCanceler = c;
+      }),
+    })
+      .then((response) => {
+        let apiData: Array<CharacterThemeColorContract> = [];
+
+        const data = ApiAdapterUtils.getResponseData(response);
+        if (data !== null) {
+          apiData = data;
+        }
+
+        setThemeData(apiData);
+        setLoadingStatus(DataLoadingStatusEnum.LOADED);
+        loadThemesCanceler = null;
+      })
+      .catch(AppLoggerUtils.handleAdhocApiError);
+    return () => {
+      if (loadThemesCanceler !== null) {
+        loadThemesCanceler();
+      }
+    };
+  }, []);
+
+  const handleThemeClick = (theme: CharacterThemeColorContract): void => {
+    dispatch(characterActions.themeSet(theme));
+  };
+
+  const handleDefaultThemeClick = (): void => {
+    dispatch(characterActions.themeSet(null));
+  };
+
+  const renderThemes = (
+    heading: string,
+    themes: Array<CharacterThemeColorContract>
+  ): React.ReactNode => {
+    const characterTheme = DecorationUtils.getCharacterTheme(decorationInfo);
+
+    return (
+      <div className="ct-decoration-manager__group" key={heading}>
+        <Heading>{heading}</Heading>
+        <div className="ct-decoration-manager__list">
+          {themes.map((theme) => {
+            const isSelected =
+              !characterTheme.isDefault &&
+              theme.themeColorId === characterTheme.themeColorId;
+            let classNames: Array<string> = [
+              "ct-decoration-manager__item--theme",
+            ];
+            if (isSelected) {
+              classNames.push("ct-decoration-manager__item--current-theme");
+            }
+            return (
+              <DecorationPreviewItem
+                key={theme.themeColorId}
+                avatarId={theme?.themeColorId ?? null}
+                isCurrent={isSelected}
+                onSelected={() => handleThemeClick(theme)}
+                className={classNames.join(" ")}
+                avatarName={theme.name}
+              >
+                <AbilitySummary
+                  theme={DecorationUtils.generateCharacterTheme(
+                    theme,
+                    preferences
+                  )}
+                  ability={highestAbility}
+                  preferences={preferences}
+                  diceEnabled={false}
+                  rollContext={characterRollContext}
+                />
+              </DecorationPreviewItem>
+            );
+          })}
+        </div>
+      </div>
+    );
+  };
+
+  const renderContent = (): React.ReactNode => {
+    let tags: Array<string> = uniq(
+      themeData.reduce((acc: Array<string>, data) => {
+        let newTags = data.tags ? data.tags : [];
+        return [...acc, ...newTags];
+      }, [])
+    );
+    let groups: Array<ThemeGroupInfo> = [];
+    tags.forEach((tag) => {
+      groups.push({
+        label: tag,
+        themes: themeData.filter(
+          (data) => data.tags && data.tags.includes(tag)
+        ),
+      });
+    });
+
+    let classNames: Array<string> = ["ct-decoration-manager__item--theme"];
+    if (DecorationUtils.isDefaultTheme(decorationInfo)) {
+      classNames.push("ct-decoration-manager__item--current-theme");
+    }
+
+    return (
+      <>
+        <div className="ct-decoration-manager__group">
+          <Heading>Default</Heading>
+          <div className="ct-decoration-manager__list">
+            <DecorationPreviewItem
+              avatarId={null}
+              isCurrent={DecorationUtils.isDefaultTheme(decorationInfo)}
+              onSelected={handleDefaultThemeClick}
+              className={classNames.join(" ")}
+              avatarName={"DDB Red"}
+            >
+              <AbilitySummary
+                theme={DecorationUtils.generateCharacterTheme(
+                  null,
+                  preferences
+                )}
+                ability={highestAbility}
+                preferences={preferences}
+                diceEnabled={false}
+                rollContext={characterRollContext}
+              />
+            </DecorationPreviewItem>
+          </div>
+        </div>
+        {groups.map((group) => renderThemes(group.label, group.themes))}
+      </>
+    );
+  };
+
+  let contentNode: React.ReactNode;
+  if (loadingStatus === DataLoadingStatusEnum.LOADED) {
+    contentNode = renderContent();
+  } else {
+    contentNode = <LoadingPlaceholder />;
+  }
+
+  return <div className="ct-decoration-manager">{contentNode}</div>;
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DecoratePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/index.ts
new file mode 100644
index 0000000..4235c32
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DecoratePane/index.ts
@@ -0,0 +1,18 @@
+import BackdropManager from "./BackdropManager";
+import CurrentDecorationItem from "./CurrentDecorationItem";
+import DecoratePane from "./DecoratePane";
+import DecorationPreviewItem from "./DecorationPreviewItem";
+import FrameManager from "./FrameManager";
+import PortraitManager from "./PortraitManager";
+import ThemeManager from "./ThemeManager";
+
+export default DecoratePane;
+export {
+  DecoratePane,
+  CurrentDecorationItem,
+  DecorationPreviewItem,
+  BackdropManager,
+  FrameManager,
+  ThemeManager,
+  PortraitManager,
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/DefenseManagePane.tsx b/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/DefenseManagePane.tsx
new file mode 100644
index 0000000..90f3d0f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/DefenseManagePane.tsx
@@ -0,0 +1,581 @@
+import { sortBy } from "lodash";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  Collapsible,
+  DamageTypeIcon,
+  DataOriginName,
+  Select,
+  ComponentConstants,
+} from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  CharacterDefenseAdjustmentContract,
+  ConditionContract,
+  ConditionDefinitionContract,
+  ConditionUtils,
+  Constants,
+  DamageAdjustmentContract,
+  DataOrigin,
+  DefenseAdjustment,
+  DefenseAdjustmentContract,
+  HelperUtils,
+  HtmlSelectOption,
+  HtmlSelectOptionGroup,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { getDataOriginComponentInfo } from "~/subApps/sheet/components/Sidebar/helpers/paneUtils";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import * as appEnvSelectors from "../../../selectors/appEnv";
+import { SharedAppState } from "../../../stores/typings";
+import DefenseManagePaneCustomItem from "./DefenseManagePaneCustomItem";
+
+const DEFENSE_ADJUSTMENT_TYPE_OPTION = {
+  RESISTANCE: 1,
+  IMMUNITY: 2,
+  VULNERABILITY: 3,
+};
+
+interface AdjustmentGroupEntry extends DefenseAdjustmentContract {
+  idx: number;
+  definition: DamageAdjustmentContract | ConditionDefinitionContract;
+}
+interface AdjustmentGroupInfo {
+  label: string;
+  adjustments: Array<AdjustmentGroupEntry>;
+}
+
+interface Props extends DispatchProp {
+  resistances: Array<DefenseAdjustment>;
+  immunities: Array<DefenseAdjustment>;
+  vulnerabilities: Array<DefenseAdjustment>;
+  resistanceData: Array<DamageAdjustmentContract>;
+  vulnerabilityData: Array<DamageAdjustmentContract>;
+  conditionImmunityData: Array<ConditionContract>;
+  damageImmunityData: Array<DamageAdjustmentContract>;
+  customDefenseAdjustments: Array<CharacterDefenseAdjustmentContract>;
+  ruleData: RuleData;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  paneHistoryPush: PaneInfo["paneHistoryPush"];
+}
+interface State {
+  adjustmentType: number | null;
+  adjustmentSubType: string | null;
+}
+class DefenseManagePane extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      adjustmentType: null,
+      adjustmentSubType: null,
+    };
+  }
+
+  getNewDamageAdjustments = (): Array<CharacterDefenseAdjustmentContract> => {
+    return this.props.customDefenseAdjustments.filter(
+      (newData) =>
+        newData.type === Constants.DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT
+    );
+  };
+
+  getNewConditionAdjustments =
+    (): Array<CharacterDefenseAdjustmentContract> => {
+      return this.props.customDefenseAdjustments.filter(
+        (newData) =>
+          newData.type ===
+          Constants.DefenseAdjustmentTypeEnum.CONDITION_ADJUSTMENT
+      );
+    };
+
+  getAvailableResistances = (): Array<DamageAdjustmentContract> => {
+    const { resistanceData } = this.props;
+
+    const newDefenseAdjustments = this.getNewDamageAdjustments();
+    return resistanceData
+      .filter((data) => !data.isMulti)
+      .filter((data) =>
+        newDefenseAdjustments.every(
+          (newData) => newData.adjustmentId !== data.id
+        )
+      );
+  };
+
+  getAvailableVulnerabilities = (): Array<DamageAdjustmentContract> => {
+    const { vulnerabilityData } = this.props;
+
+    const newDefenseAdjustments = this.getNewDamageAdjustments();
+    return vulnerabilityData
+      .filter((data) => !data.isMulti)
+      .filter((data) =>
+        newDefenseAdjustments.every(
+          (newData) => newData.adjustmentId !== data.id
+        )
+      );
+  };
+
+  getAvailableDamageImmunities = (): Array<DamageAdjustmentContract> => {
+    const { damageImmunityData } = this.props;
+
+    const newDefenseAdjustments = this.getNewDamageAdjustments();
+    return damageImmunityData
+      .filter((data) => !data.isMulti)
+      .filter((data) =>
+        newDefenseAdjustments.every(
+          (newData) => newData.adjustmentId !== data.id
+        )
+      );
+  };
+
+  getAvailableConditionImmunities = (): Array<ConditionContract> => {
+    const { conditionImmunityData } = this.props;
+
+    const newDefenseAdjustments = this.getNewConditionAdjustments();
+    return conditionImmunityData.filter((data) =>
+      newDefenseAdjustments.every(
+        (newData) => newData.adjustmentId !== ConditionUtils.getId(data)
+      )
+    );
+  };
+
+  handleAdjustmentRemove = (type: number, id: number): void => {
+    const { dispatch } = this.props;
+
+    dispatch(characterActions.customDefenseAdjustmentRemove(type, id));
+  };
+
+  handleAdjustmentSourceUpdate = (
+    type: number,
+    id: number,
+    source: string | null
+  ) => {
+    const { dispatch, customDefenseAdjustments } = this.props;
+
+    let foundAdjustment = customDefenseAdjustments.find(
+      (adjustment) => adjustment.type === type && adjustment.adjustmentId === id
+    );
+    if (foundAdjustment) {
+      dispatch(
+        characterActions.customDefenseAdjustmentSet({
+          ...foundAdjustment,
+          source,
+        })
+      );
+    }
+  };
+
+  handleChangeAdjustmentType = (value: string): void => {
+    this.setState({
+      adjustmentType: HelperUtils.parseInputInt(value),
+      adjustmentSubType: null,
+    });
+  };
+
+  handleChangeAdjustmentSubType = (subTypeValue: string): void => {
+    const { adjustmentType } = this.state;
+    const { dispatch } = this.props;
+
+    let type: number | null = null;
+    let adjustmentId: number | null = null;
+    switch (adjustmentType) {
+      case DEFENSE_ADJUSTMENT_TYPE_OPTION.RESISTANCE:
+      case DEFENSE_ADJUSTMENT_TYPE_OPTION.VULNERABILITY:
+        type = Constants.DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT;
+        adjustmentId = parseInt(subTypeValue);
+        break;
+      case DEFENSE_ADJUSTMENT_TYPE_OPTION.IMMUNITY:
+        let [defenseTypeKey, defenseAdjustmentId] = subTypeValue.split("-");
+        type = parseInt(defenseTypeKey);
+        adjustmentId = parseInt(defenseAdjustmentId);
+        break;
+      default:
+      // not implemented
+    }
+
+    if (type !== null && adjustmentId !== null) {
+      let newAdjustment: CharacterDefenseAdjustmentContract = {
+        type,
+        adjustmentId,
+        source: null,
+      };
+      dispatch(characterActions.customDefenseAdjustmentAdd(newAdjustment));
+    }
+  };
+
+  handleDataOriginDetailShow = (dataOrigin: DataOrigin): void => {
+    const { paneHistoryPush } = this.props;
+
+    let component = getDataOriginComponentInfo(dataOrigin);
+    if (component.type !== PaneComponentEnum.ERROR_404) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  renderExtraDataOrigin = (dataOrigin: DataOrigin): React.ReactNode => {
+    const { theme } = this.props;
+
+    return (
+      <span className="ct-defense-manage-pane__item-extra">
+        (
+        <DataOriginName
+          dataOrigin={dataOrigin}
+          onClick={this.handleDataOriginDetailShow}
+          theme={theme}
+        />
+        )
+      </span>
+    );
+  };
+
+  getDefenseAdjustmentIcon = (
+    type: Constants.DefenseAdjustmentTypeEnum,
+    slug: string
+  ): React.ReactNode => {
+    const { theme } = this.props;
+
+    let iconClassNames: Array<string> = [
+      "ct-defense-manage-pane__item-icon",
+      `ct-defense-manage-pane__item-icon--${slug}`,
+    ];
+
+    switch (type) {
+      case Constants.DefenseAdjustmentTypeEnum.CONDITION_ADJUSTMENT:
+        if (theme.isDarkMode) {
+          iconClassNames.push(`i-condition-white-${slug}`);
+        } else {
+          iconClassNames.push(`i-condition-${slug}`);
+        }
+
+        return <i className={iconClassNames.join(" ")} />;
+      case Constants.DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT:
+        return (
+          <DamageTypeIcon
+            type={slug as ComponentConstants.DamageTypePropType}
+            theme={theme}
+          />
+        );
+
+      default:
+        return null;
+    }
+  };
+
+  renderDamageAdjustmentList = (
+    defenseAdjustments: Array<DefenseAdjustment>
+  ): React.ReactNode => {
+    return defenseAdjustments.map((defenseAdjustment, idx) => {
+      const { dataOrigin, name, isCustom, slug, type } = defenseAdjustment;
+
+      return (
+        <div className="ct-defense-manage-pane__item" key={idx}>
+          <div className="ct-defense-manage-pane__item-value">
+            {this.getDefenseAdjustmentIcon(type, slug)}
+          </div>
+          <div className="ct-defense-manage-pane__item-label">
+            <span className="ct-defense-manage-pane__item-label-text">
+              {name}
+              {isCustom ? "*" : ""}
+            </span>
+            {this.renderExtraDataOrigin(dataOrigin)}
+          </div>
+        </div>
+      );
+    });
+    //`
+  };
+
+  renderDamageAdjustmentGroup = (
+    label: string,
+    defenseAdjustments: Array<DefenseAdjustment>
+  ): React.ReactNode => {
+    if (!defenseAdjustments.length) {
+      return null;
+    }
+    return (
+      <div className="ct-defense-manage-pane__group">
+        <div className="ct-defense-manage-pane__heading">{label}</div>
+        <div className="ct-defense-manage-pane__group-items">
+          {this.renderDamageAdjustmentList(defenseAdjustments)}
+        </div>
+      </div>
+    );
+  };
+
+  renderCustomDefenseAdjustmentList = (): React.ReactNode => {
+    const { customDefenseAdjustments, ruleData } = this.props;
+
+    const damageAdjustmentDataLookup =
+      RuleDataUtils.getDamageAdjustmentsLookup(ruleData);
+    const conditionDataLookup = RuleDataUtils.getConditionLookup(ruleData);
+
+    let adjustmentGroups: Array<AdjustmentGroupInfo> = [
+      { label: "Resistances", adjustments: [] },
+      { label: "Immunities", adjustments: [] },
+      { label: "Vulnerabilities", adjustments: [] },
+    ];
+    customDefenseAdjustments.forEach((defenseAdjustment, newDefIdx) => {
+      const { type, adjustmentId, source } = defenseAdjustment;
+
+      let groupIdx: number | null = null;
+      let definition:
+        | ConditionDefinitionContract
+        | DamageAdjustmentContract
+        | null = null;
+      switch (type) {
+        case Constants.DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT:
+          definition = HelperUtils.lookupDataOrFallback(
+            damageAdjustmentDataLookup,
+            adjustmentId
+          );
+          if (definition !== null) {
+            switch (definition.type) {
+              case Constants.DamageAdjustmentTypeEnum.RESISTANCE:
+                groupIdx = 0;
+                break;
+              case Constants.DamageAdjustmentTypeEnum.IMMUNITY:
+                groupIdx = 1;
+                break;
+              case Constants.DamageAdjustmentTypeEnum.VULNERABILITY:
+                groupIdx = 2;
+                break;
+            }
+          }
+          break;
+        case Constants.DefenseAdjustmentTypeEnum.CONDITION_ADJUSTMENT:
+          let conditionData = HelperUtils.lookupDataOrFallback(
+            conditionDataLookup,
+            adjustmentId
+          );
+          if (conditionData !== null) {
+            definition = conditionData.definition;
+            groupIdx = 1;
+          }
+          break;
+        default:
+        // not implemented
+      }
+
+      if (groupIdx !== null && definition !== null) {
+        adjustmentGroups[groupIdx].adjustments.push({
+          id: defenseAdjustment.adjustmentId,
+          type: defenseAdjustment.type,
+          source: defenseAdjustment.source,
+          idx: newDefIdx,
+          definition,
+        });
+      }
+    });
+
+    return adjustmentGroups.map((adjustmentGroup, groupIdx) => {
+      if (!adjustmentGroup.adjustments.length) {
+        return null;
+      }
+
+      let sortedAdjustments: Array<AdjustmentGroupEntry> = sortBy(
+        adjustmentGroup.adjustments,
+        [(adjustment: any) => adjustment.definition.name]
+      );
+
+      return (
+        <div className="ct-defense-manage-pane__custom-group" key={groupIdx}>
+          <div className="ct-defense-manage-pane__heading">
+            {adjustmentGroup.label}
+          </div>
+          {sortedAdjustments.map((defenseAdjustment) => {
+            const { type, id, source, definition } = defenseAdjustment;
+
+            return (
+              <DefenseManagePaneCustomItem
+                key={`${type}-${id}`}
+                id={id}
+                type={type}
+                initialValue={source}
+                label={definition.name ? definition.name : ""}
+                onRemove={this.handleAdjustmentRemove}
+                onSourceUpdate={this.handleAdjustmentSourceUpdate}
+              />
+            );
+          })}
+        </div>
+      );
+    });
+    //`
+  };
+
+  renderCustomUi = (): React.ReactNode => {
+    const { adjustmentType } = this.state;
+    const { isReadonly } = this.props;
+
+    if (isReadonly) {
+      return;
+    }
+
+    const adjustmentTypeOptions: Array<HtmlSelectOption> = [
+      { label: "Resistance", value: DEFENSE_ADJUSTMENT_TYPE_OPTION.RESISTANCE },
+      { label: "Immunity", value: DEFENSE_ADJUSTMENT_TYPE_OPTION.IMMUNITY },
+      {
+        label: "Vulnerability",
+        value: DEFENSE_ADJUSTMENT_TYPE_OPTION.VULNERABILITY,
+      },
+    ];
+
+    let adjustmentSubTypeOptions: Array<
+      HtmlSelectOptionGroup | HtmlSelectOption
+    > = [];
+    let subTypePlaceholder: string = "";
+    switch (adjustmentType) {
+      case DEFENSE_ADJUSTMENT_TYPE_OPTION.RESISTANCE:
+        adjustmentSubTypeOptions = this.getAvailableResistances().map(
+          (data) => ({
+            label: data.name,
+            value: data.id,
+          })
+        );
+        subTypePlaceholder = "-- Choose a Resistance --";
+        break;
+      case DEFENSE_ADJUSTMENT_TYPE_OPTION.VULNERABILITY:
+        adjustmentSubTypeOptions = this.getAvailableVulnerabilities().map(
+          (data) => ({
+            label: data.name,
+            value: data.id,
+          })
+        );
+        subTypePlaceholder = "-- Choose a Vulnerability --";
+        break;
+      case DEFENSE_ADJUSTMENT_TYPE_OPTION.IMMUNITY:
+        adjustmentSubTypeOptions = [
+          {
+            optGroupLabel: "Damage",
+            options: this.getAvailableDamageImmunities().map((data) => ({
+              label: data.name,
+              value: `${Constants.DefenseAdjustmentTypeEnum.DAMAGE_ADJUSTMENT}-${data.id}`,
+            })),
+          },
+          {
+            optGroupLabel: "Conditions",
+            options: this.getAvailableConditionImmunities().map((data) => ({
+              label: ConditionUtils.getName(data),
+              value: `${
+                Constants.DefenseAdjustmentTypeEnum.CONDITION_ADJUSTMENT
+              }-${ConditionUtils.getUniqueKey(data)}`,
+            })),
+          },
+        ];
+        subTypePlaceholder = "-- Choose an Immunity --";
+        //`
+        break;
+      default:
+      // not implemented
+    }
+
+    return (
+      <Collapsible
+        layoutType={"minimal"}
+        header="Customize"
+        className="ct-defense-manage-pane__custom"
+      >
+        <div className="ct-defense-manage-pane__custom-fields">
+          <div className="dct-defense-manage-pane__custom-field">
+            <Select
+              options={adjustmentTypeOptions}
+              onChange={this.handleChangeAdjustmentType}
+              value={adjustmentType}
+            />
+          </div>
+          <div className="ct-defense-manage-pane__custom-field">
+            {adjustmentType !== null && (
+              <Select
+                options={sortBy(adjustmentSubTypeOptions, "label")}
+                onChange={this.handleChangeAdjustmentSubType}
+                resetAfterChoice={true}
+                placeholder={subTypePlaceholder}
+                value={null}
+              />
+            )}
+          </div>
+        </div>
+        <div className="ct-defense-manage-pane__custom-items">
+          {this.renderCustomDefenseAdjustmentList()}
+        </div>
+      </Collapsible>
+    );
+  };
+
+  renderDefault = (): React.ReactNode => {
+    return (
+      <div className="ct-defense-manage-pane__default">
+        No Resistances, Immunities, or Vulnerabilities
+      </div>
+    );
+  };
+
+  renderDefenseGroups = (): React.ReactNode => {
+    const { resistances, vulnerabilities, immunities } = this.props;
+
+    return (
+      <React.Fragment>
+        {this.renderDamageAdjustmentGroup("Resistances", resistances)}
+        {this.renderDamageAdjustmentGroup("Immunities", immunities)}
+        {this.renderDamageAdjustmentGroup("Vulnerabilities", vulnerabilities)}
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    const { resistances, vulnerabilities, immunities } = this.props;
+
+    let contentNode: React.ReactNode;
+    if (!resistances.length && !vulnerabilities.length && !immunities.length) {
+      contentNode = this.renderDefault();
+    } else {
+      contentNode = this.renderDefenseGroups();
+    }
+
+    return (
+      <div className="ct-defense-manage-pane">
+        <Header>Defenses</Header>
+        {contentNode}
+        {this.renderCustomUi()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    resistances: rulesEngineSelectors.getActiveResistances(state),
+    immunities: rulesEngineSelectors.getActiveImmunities(state),
+    vulnerabilities: rulesEngineSelectors.getActiveVulnerabilities(state),
+
+    resistanceData: rulesEngineSelectors.getResistanceData(state),
+    vulnerabilityData: rulesEngineSelectors.getVulnerabilityData(state),
+    conditionImmunityData: rulesEngineSelectors.getConditionImmunityData(state),
+    damageImmunityData: rulesEngineSelectors.getDamageImmunityData(state),
+
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+
+    customDefenseAdjustments:
+      rulesEngineSelectors.getCustomDefenseAdjustments(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+  };
+}
+
+const DefenseManagePaneContainer = (props) => {
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  return <DefenseManagePane {...props} paneHistoryPush={paneHistoryPush} />;
+};
+
+export default connect(mapStateToProps)(DefenseManagePaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/DefenseManagePaneCustomItem/DefenseManagePaneCustomItem.tsx b/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/DefenseManagePaneCustomItem/DefenseManagePaneCustomItem.tsx
new file mode 100644
index 0000000..b42c71a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/DefenseManagePaneCustomItem/DefenseManagePaneCustomItem.tsx
@@ -0,0 +1,84 @@
+import React from "react";
+
+import { RemoveButton } from "../../../../components/common/Button";
+
+interface Props {
+  label: string;
+  type: number;
+  id: number;
+  initialValue: string | null;
+  sourcePlaceholder: string;
+  onRemove?: (type: number, id: number) => void;
+  onSourceUpdate?: (type: number, id: number, value: string | null) => void;
+}
+interface State {
+  value: string | null;
+  isDirty: boolean;
+}
+export default class DefenseManagePaneCustomItem extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    sourcePlaceholder: "Enter Source Note...",
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.initialValue,
+      isDirty: false,
+    };
+  }
+
+  handleRemove = (): void => {
+    const { type, id, onRemove } = this.props;
+
+    if (onRemove) {
+      onRemove(type, id);
+    }
+  };
+
+  handleSourceBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { value, isDirty } = this.state;
+    const { type, id, onSourceUpdate } = this.props;
+
+    if (isDirty && onSourceUpdate) {
+      onSourceUpdate(type, id, value);
+      this.setState({
+        isDirty: false,
+      });
+    }
+  };
+
+  handleSourceChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    this.setState({
+      value: evt.target.value,
+      isDirty: true,
+    });
+  };
+
+  render() {
+    const { value } = this.state;
+    const { label, sourcePlaceholder } = this.props;
+
+    return (
+      <div className="ct-defense-manage-pane__custom-item">
+        <div className="ct-defense-manage-pane__custom-item-action">
+          <RemoveButton onClick={this.handleRemove} />
+        </div>
+        <div className="ct-defense-manage-pane__custom-item-label">{label}</div>
+        <div className="ct-defense-manage-pane__custom-item-source">
+          <input
+            type="text"
+            onChange={this.handleSourceChange}
+            onBlur={this.handleSourceBlur}
+            value={value === null ? "" : value}
+            placeholder={sourcePlaceholder}
+          />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/DefenseManagePaneCustomItem/index.ts b/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/DefenseManagePaneCustomItem/index.ts
new file mode 100644
index 0000000..35c978f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/DefenseManagePaneCustomItem/index.ts
@@ -0,0 +1,4 @@
+import DefenseManagePaneCustomItem from "./DefenseManagePaneCustomItem";
+
+export default DefenseManagePaneCustomItem;
+export { DefenseManagePaneCustomItem };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/index.ts
new file mode 100644
index 0000000..e6d25f9
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DefenseManagePane/index.ts
@@ -0,0 +1,5 @@
+import DefenseManagePane from "./DefenseManagePane";
+import DefenseManagePaneCustomItem from "./DefenseManagePaneCustomItem";
+
+export default DefenseManagePane;
+export { DefenseManagePane, DefenseManagePaneCustomItem };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPane.tsx b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPane.tsx
new file mode 100644
index 0000000..fbb03ec
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPane.tsx
@@ -0,0 +1,264 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  AlignmentContract,
+  characterActions,
+  CharacterLifestyleContract,
+  HtmlSelectOption,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  SizeContract,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+
+import { SharedAppState } from "../../../stores/typings";
+import { TypeScriptUtils } from "../../../utils";
+import DescriptionPaneEntry from "./DescriptionPaneEntry";
+import DescriptionPaneEntryContent from "./DescriptionPaneEntryContent";
+import DescriptionPaneNumberEditor from "./DescriptionPaneNumberEditor";
+import DescriptionPaneSelectEditor from "./DescriptionPaneSelectEditor";
+import DescriptionPaneTextEditor from "./DescriptionPaneTextEditor";
+
+interface Props extends DispatchProp {
+  height: string | null;
+  weight: number | null;
+  size: SizeContract | null;
+  faith: string | null;
+  skin: string | null;
+  eyes: string | null;
+  hair: string | null;
+  age: number | null;
+  gender: string | null;
+  alignment: AlignmentContract | null;
+  lifestyle: CharacterLifestyleContract | null;
+
+  ruleData: RuleData;
+}
+class DescriptionPane extends React.PureComponent<Props> {
+  handleAlignmentUpdate = (propertyKey: string, value: number | null): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.alignmentSet(value));
+  };
+
+  handleLifestyleUpdate = (propertyKey: string, value: number | null): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.lifestyleSet(value));
+  };
+
+  handleFaithChange = (propertyKey: string, value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.faithSet(value));
+  };
+
+  handleHairChange = (propertyKey: string, value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.hairSet(value));
+  };
+
+  handleSkinChange = (propertyKey: string, value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.skinSet(value));
+  };
+
+  handleEyesChange = (propertyKey: string, value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.eyesSet(value));
+  };
+
+  handleHeightChange = (propertyKey: string, value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.heightSet(value));
+  };
+
+  handleWeightChange = (propertyKey: string, value: number | null): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.weightSet(value));
+  };
+
+  handleAgeChange = (propertyKey: string, value: number | null): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.ageSet(value));
+  };
+
+  handleGenderChange = (propertyKey: string, value: string): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.genderSet(value));
+  };
+
+  renderCharacterDetails = (): React.ReactNode => {
+    const { alignment, lifestyle, ruleData, faith } = this.props;
+
+    const alignmentData = RuleDataUtils.getAlignments(ruleData);
+    const lifestyleData = RuleDataUtils.getLifestyles(ruleData);
+    const alignmentOptions = RuleDataUtils.getAlignmentOptions(ruleData);
+
+    let alignmentDescriptionNode: React.ReactNode;
+    if (alignment !== null && alignment.description) {
+      alignmentDescriptionNode = (
+        <HtmlContent html={alignment.description} withoutTooltips />
+      );
+    }
+
+    const lifestyleOptions: Array<HtmlSelectOption> = lifestyleData
+      .map((lifestyle) => {
+        if (lifestyle.id === null) {
+          return null;
+        }
+        return {
+          label: `${lifestyle.name} ${
+            lifestyle.cost === "-" ? "" : `(${lifestyle.cost})`
+          }`,
+          value: lifestyle.id,
+        };
+      })
+      .filter(TypeScriptUtils.isNotNullOrUndefined);
+
+    let lifestyleDescriptionNode: React.ReactNode;
+    if (lifestyle !== null) {
+      lifestyleDescriptionNode = lifestyle.description;
+    }
+
+    return (
+      <React.Fragment>
+        <DescriptionPaneEntry>
+          <DescriptionPaneSelectEditor
+            label="Alignment"
+            options={alignmentOptions}
+            defaultValue={alignment === null ? null : alignment.id}
+            propertyKey="alignmentId"
+            onUpdate={this.handleAlignmentUpdate}
+          />
+          <DescriptionPaneEntryContent>
+            {alignmentDescriptionNode}
+          </DescriptionPaneEntryContent>
+        </DescriptionPaneEntry>
+        <DescriptionPaneEntry>
+          <DescriptionPaneTextEditor
+            label="Faith"
+            defaultValue={faith}
+            propertyKey="faith"
+            onUpdate={this.handleFaithChange}
+            maxLength={512}
+          />
+        </DescriptionPaneEntry>
+        <DescriptionPaneEntry>
+          <DescriptionPaneSelectEditor
+            label="Lifestyle"
+            options={lifestyleOptions}
+            defaultValue={lifestyle === null ? null : lifestyle.id}
+            propertyKey="lifestyleId"
+            onUpdate={this.handleLifestyleUpdate}
+          />
+          <DescriptionPaneEntryContent>
+            {lifestyleDescriptionNode}
+          </DescriptionPaneEntryContent>
+        </DescriptionPaneEntry>
+      </React.Fragment>
+    );
+  };
+
+  renderPhysicalCharacteristics = (): React.ReactNode => {
+    const { height, weight, skin, eyes, hair, age, gender } = this.props;
+
+    return (
+      <React.Fragment>
+        <DescriptionPaneEntry>
+          <DescriptionPaneTextEditor
+            label="Hair"
+            defaultValue={hair}
+            propertyKey="hair"
+            onUpdate={this.handleHairChange}
+            maxLength={50}
+          />
+        </DescriptionPaneEntry>
+        <DescriptionPaneEntry>
+          <DescriptionPaneTextEditor
+            label="Skin"
+            defaultValue={skin}
+            propertyKey="skin"
+            onUpdate={this.handleSkinChange}
+            maxLength={50}
+          />
+        </DescriptionPaneEntry>
+        <DescriptionPaneEntry>
+          <DescriptionPaneTextEditor
+            label="Eyes"
+            defaultValue={eyes}
+            propertyKey="eyes"
+            onUpdate={this.handleEyesChange}
+            maxLength={50}
+          />
+        </DescriptionPaneEntry>
+        <DescriptionPaneEntry>
+          <DescriptionPaneTextEditor
+            label="Height"
+            defaultValue={height}
+            propertyKey="height"
+            onUpdate={this.handleHeightChange}
+            maxLength={50}
+          />
+        </DescriptionPaneEntry>
+        <DescriptionPaneEntry>
+          <DescriptionPaneNumberEditor
+            label="Weight (lbs)"
+            defaultValue={weight}
+            propertyKey="weight"
+            onUpdate={this.handleWeightChange}
+          />
+        </DescriptionPaneEntry>
+        <DescriptionPaneEntry>
+          <DescriptionPaneNumberEditor
+            label="Age (Years)"
+            defaultValue={age}
+            propertyKey="age"
+            onUpdate={this.handleAgeChange}
+          />
+        </DescriptionPaneEntry>
+        <DescriptionPaneEntry>
+          <DescriptionPaneTextEditor
+            label="Gender"
+            defaultValue={gender}
+            propertyKey="gender"
+            onUpdate={this.handleGenderChange}
+            maxLength={128}
+          />
+        </DescriptionPaneEntry>
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    return (
+      <div className="ct-description-pane">
+        <Header>Characteristics and Details</Header>
+        <div className="ct-description-pane__entries">
+          {this.renderCharacterDetails()}
+          {this.renderPhysicalCharacteristics()}
+        </div>
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    alignment: rulesEngineSelectors.getAlignment(state),
+    height: rulesEngineSelectors.getHeight(state),
+    weight: rulesEngineSelectors.getWeight(state),
+    size: rulesEngineSelectors.getSize(state),
+    faith: rulesEngineSelectors.getFaith(state),
+    skin: rulesEngineSelectors.getSkin(state),
+    eyes: rulesEngineSelectors.getEyes(state),
+    hair: rulesEngineSelectors.getHair(state),
+    age: rulesEngineSelectors.getAge(state),
+    gender: rulesEngineSelectors.getGender(state),
+    lifestyle: rulesEngineSelectors.getLifestyle(state),
+  };
+}
+
+export default connect(mapStateToProps)(DescriptionPane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditor/DescriptionPaneEditor.tsx b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditor/DescriptionPaneEditor.tsx
new file mode 100644
index 0000000..a1fc1f0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditor/DescriptionPaneEditor.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+
+import { FormatUtils } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  propertyKey: string;
+  className: string;
+}
+export default class DescriptionPaneEditor extends React.PureComponent<Props> {
+  render() {
+    const { propertyKey, className } = this.props;
+
+    let classNames: Array<string> = [
+      "ct-description-pane__editor",
+      `ct-description-pane__editor--${FormatUtils.slugify(propertyKey)}`,
+      className,
+    ];
+
+    return <div className={classNames.join(" ")}>{this.props.children}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditor/index.ts b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditor/index.ts
new file mode 100644
index 0000000..d90ed24
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditor/index.ts
@@ -0,0 +1,4 @@
+import DescriptionPaneEditor from "./DescriptionPaneEditor";
+
+export default DescriptionPaneEditor;
+export { DescriptionPaneEditor };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorLabel/DescriptionPaneEditorLabel.tsx b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorLabel/DescriptionPaneEditorLabel.tsx
new file mode 100644
index 0000000..a56f4de
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorLabel/DescriptionPaneEditorLabel.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class DescriptionPaneEditorLabel extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-description-pane__editor-label">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorLabel/index.ts b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorLabel/index.ts
new file mode 100644
index 0000000..553bab6
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorLabel/index.ts
@@ -0,0 +1,4 @@
+import DescriptionPaneEditorLabel from "./DescriptionPaneEditorLabel";
+
+export default DescriptionPaneEditorLabel;
+export { DescriptionPaneEditorLabel };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorValue/DescriptionPaneEditorValue.tsx b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorValue/DescriptionPaneEditorValue.tsx
new file mode 100644
index 0000000..b0bbcf5
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorValue/DescriptionPaneEditorValue.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class DescriptionPaneEditorValue extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-description-pane__editor-value">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorValue/index.ts b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorValue/index.ts
new file mode 100644
index 0000000..cc1ef25
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEditorValue/index.ts
@@ -0,0 +1,4 @@
+import DescriptionPaneEditorValue from "./DescriptionPaneEditorValue";
+
+export default DescriptionPaneEditorValue;
+export { DescriptionPaneEditorValue };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntry/DescriptionPaneEntry.tsx b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntry/DescriptionPaneEntry.tsx
new file mode 100644
index 0000000..c221ae1
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntry/DescriptionPaneEntry.tsx
@@ -0,0 +1,9 @@
+import React from "react";
+
+export default class DescriptionPaneEntry extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-description-pane__entry">{this.props.children}</div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntry/index.ts b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntry/index.ts
new file mode 100644
index 0000000..11cc2a4
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntry/index.ts
@@ -0,0 +1,4 @@
+import DescriptionPaneEntry from "./DescriptionPaneEntry";
+
+export default DescriptionPaneEntry;
+export { DescriptionPaneEntry };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntryContent/DescriptionPaneEntryContent.tsx b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntryContent/DescriptionPaneEntryContent.tsx
new file mode 100644
index 0000000..05e9d51
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntryContent/DescriptionPaneEntryContent.tsx
@@ -0,0 +1,11 @@
+import React from "react";
+
+export default class DescriptionPaneEntryContent extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-description-pane__entry-content">
+        {this.props.children}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntryContent/index.ts b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntryContent/index.ts
new file mode 100644
index 0000000..717e913
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneEntryContent/index.ts
@@ -0,0 +1,4 @@
+import DescriptionPaneEntryContent from "./DescriptionPaneEntryContent";
+
+export default DescriptionPaneEntryContent;
+export { DescriptionPaneEntryContent };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneNumberEditor/DescriptionPaneNumberEditor.tsx b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneNumberEditor/DescriptionPaneNumberEditor.tsx
new file mode 100644
index 0000000..7f84440
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneNumberEditor/DescriptionPaneNumberEditor.tsx
@@ -0,0 +1,84 @@
+import React from "react";
+
+import { HelperUtils } from "@dndbeyond/character-rules-engine/es";
+
+import { CHARACTER_DESCRIPTION_NUMBER_VALUE } from "../../../../constants/App";
+import DescriptionPaneEditor from "../DescriptionPaneEditor";
+import DescriptionPaneEditorLabel from "../DescriptionPaneEditorLabel";
+import DescriptionPaneEditorValue from "../DescriptionPaneEditorValue";
+
+interface Props {
+  label: string;
+  propertyKey: string;
+  defaultValue: number | null;
+  minValue: number;
+  maxValue: number;
+  onUpdate?: (propertyKey: string, value: number | null) => void;
+}
+interface State {
+  value: number | null;
+}
+export default class DescriptionPaneNumberEditor extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    minValue: CHARACTER_DESCRIPTION_NUMBER_VALUE.MIN,
+    maxValue: CHARACTER_DESCRIPTION_NUMBER_VALUE.MAX,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue,
+    };
+  }
+
+  handleBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { propertyKey, onUpdate, maxValue, minValue } = this.props;
+
+    let parsedValue = HelperUtils.parseInputInt(evt.target.value);
+    let clampedValue: number | null =
+      parsedValue === null
+        ? null
+        : HelperUtils.clampInt(parsedValue, minValue, maxValue);
+    if (onUpdate) {
+      onUpdate(propertyKey, clampedValue);
+    }
+    this.setState({
+      value: clampedValue,
+    });
+  };
+
+  handleChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    this.setState({
+      value: HelperUtils.parseInputInt(evt.target.value),
+    });
+  };
+
+  render() {
+    const { value } = this.state;
+    const { propertyKey, label, maxValue, minValue } = this.props;
+
+    return (
+      <DescriptionPaneEditor
+        propertyKey={propertyKey}
+        className="ct-description-pane__editor--number"
+      >
+        <DescriptionPaneEditorLabel>{label}</DescriptionPaneEditorLabel>
+        <DescriptionPaneEditorValue>
+          <input
+            className="ct-description-pane__editor-input"
+            type="number"
+            min={minValue}
+            max={maxValue}
+            value={value === null ? "" : value}
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+          />
+        </DescriptionPaneEditorValue>
+      </DescriptionPaneEditor>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneNumberEditor/index.ts b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneNumberEditor/index.ts
new file mode 100644
index 0000000..ea366f6
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneNumberEditor/index.ts
@@ -0,0 +1,4 @@
+import DescriptionPaneNumberEditor from "./DescriptionPaneNumberEditor";
+
+export default DescriptionPaneNumberEditor;
+export { DescriptionPaneNumberEditor };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneSelectEditor/DescriptionPaneSelectEditor.tsx b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneSelectEditor/DescriptionPaneSelectEditor.tsx
new file mode 100644
index 0000000..261efb1
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneSelectEditor/DescriptionPaneSelectEditor.tsx
@@ -0,0 +1,69 @@
+import React from "react";
+
+import { Select } from "@dndbeyond/character-components/es";
+import {
+  HelperUtils,
+  HtmlSelectOption,
+} from "@dndbeyond/character-rules-engine/es";
+
+import DescriptionPaneEditor from "../DescriptionPaneEditor";
+import DescriptionPaneEditorLabel from "../DescriptionPaneEditorLabel";
+import DescriptionPaneEditorValue from "../DescriptionPaneEditorValue";
+
+interface Props {
+  label: string;
+  propertyKey: string;
+  defaultValue: number | null;
+  options: Array<HtmlSelectOption>;
+  onUpdate?: (propertyKey: string, value: number | null) => void;
+}
+interface State {
+  value: number | null;
+}
+export default class DescriptionPaneSelectEditor extends React.PureComponent<
+  Props,
+  State
+> {
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.defaultValue,
+    };
+  }
+
+  handleChange = (value: string): void => {
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      const parsedValue = HelperUtils.parseInputInt(value);
+      onUpdate(propertyKey, parsedValue);
+      this.setState({
+        value: parsedValue,
+      });
+    }
+  };
+
+  render() {
+    const { value } = this.state;
+    const { propertyKey, label, options } = this.props;
+
+    return (
+      <DescriptionPaneEditor
+        propertyKey={propertyKey}
+        className="ct-description-pane__editor--select"
+      >
+        <DescriptionPaneEditorLabel>{label}</DescriptionPaneEditorLabel>
+        <DescriptionPaneEditorValue>
+          <Select
+            className="ct-description-pane__editor-input"
+            placeholder="--"
+            options={options}
+            value={value}
+            onChange={this.handleChange}
+          />
+        </DescriptionPaneEditorValue>
+      </DescriptionPaneEditor>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneSelectEditor/index.ts b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneSelectEditor/index.ts
new file mode 100644
index 0000000..063cd29
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneSelectEditor/index.ts
@@ -0,0 +1,4 @@
+import DescriptionPaneSelectEditor from "./DescriptionPaneSelectEditor";
+
+export default DescriptionPaneSelectEditor;
+export { DescriptionPaneSelectEditor };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneTextEditor/DescriptionPaneTextEditor.tsx b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneTextEditor/DescriptionPaneTextEditor.tsx
new file mode 100644
index 0000000..a0d5f91
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneTextEditor/DescriptionPaneTextEditor.tsx
@@ -0,0 +1,48 @@
+import React from "react";
+
+import DescriptionPaneEditor from "../DescriptionPaneEditor";
+import DescriptionPaneEditorLabel from "../DescriptionPaneEditorLabel";
+import DescriptionPaneEditorValue from "../DescriptionPaneEditorValue";
+
+interface Props {
+  label: string;
+  propertyKey: string;
+  defaultValue: string | null;
+  onUpdate?: (propertyKey: string, value: string) => void;
+  maxLength: number | null;
+}
+export default class DescriptionPaneTextEditor extends React.PureComponent<Props> {
+  static defaultProps = {
+    maxLength: null,
+  };
+
+  handleBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, evt.target.value);
+    }
+  };
+
+  render() {
+    const { propertyKey, label, defaultValue, maxLength } = this.props;
+
+    return (
+      <DescriptionPaneEditor
+        propertyKey={propertyKey}
+        className="ct-description-pane__editor--text"
+      >
+        <DescriptionPaneEditorLabel>{label}</DescriptionPaneEditorLabel>
+        <DescriptionPaneEditorValue>
+          <input
+            className="ct-description-pane__editor-input"
+            type="text"
+            defaultValue={defaultValue === null ? "" : defaultValue}
+            onBlur={this.handleBlur}
+            maxLength={maxLength === null ? undefined : maxLength}
+          />
+        </DescriptionPaneEditorValue>
+      </DescriptionPaneEditor>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneTextEditor/index.ts b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneTextEditor/index.ts
new file mode 100644
index 0000000..c2288b7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/DescriptionPaneTextEditor/index.ts
@@ -0,0 +1,4 @@
+import DescriptionPaneTextEditor from "./DescriptionPaneTextEditor";
+
+export default DescriptionPaneTextEditor;
+export { DescriptionPaneTextEditor };
diff --git a/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/index.ts
new file mode 100644
index 0000000..908e216
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/DescriptionPane/index.ts
@@ -0,0 +1,22 @@
+import DescriptionPane from "./DescriptionPane";
+import DescriptionPaneEditor from "./DescriptionPaneEditor";
+import DescriptionPaneEditorLabel from "./DescriptionPaneEditorLabel";
+import DescriptionPaneEditorValue from "./DescriptionPaneEditorValue";
+import DescriptionPaneEntry from "./DescriptionPaneEntry";
+import DescriptionPaneEntryContent from "./DescriptionPaneEntryContent";
+import DescriptionPaneNumberEditor from "./DescriptionPaneNumberEditor";
+import DescriptionPaneSelectEditor from "./DescriptionPaneSelectEditor";
+import DescriptionPaneTextEditor from "./DescriptionPaneTextEditor";
+
+export default DescriptionPane;
+export {
+  DescriptionPane,
+  DescriptionPaneEditor,
+  DescriptionPaneEditorLabel,
+  DescriptionPaneEditorValue,
+  DescriptionPaneEntry,
+  DescriptionPaneEntryContent,
+  DescriptionPaneNumberEditor,
+  DescriptionPaneSelectEditor,
+  DescriptionPaneTextEditor,
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/EncumbrancePane/EncumbrancePane.tsx b/ddb_main/tools/js/Shared/containers/panes/EncumbrancePane/EncumbrancePane.tsx
new file mode 100644
index 0000000..9f8fd0b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/EncumbrancePane/EncumbrancePane.tsx
@@ -0,0 +1,192 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  CharacterPreferences,
+  CharacterTheme,
+  Constants,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+
+import SettingsButton from "../../../../CharacterSheet/components/SettingsButton";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+import { SettingsContextsEnum } from "../SettingsPane/typings";
+
+interface Props {
+  preferences: CharacterPreferences;
+  carryCapacity: number;
+  pushDragLiftWeight: number;
+  encumberedWeight: number;
+  heavilyEncumberedWeight: number;
+  coinWeight: number;
+  itemWeight: number;
+  isReadonly: boolean;
+  theme?: CharacterTheme;
+}
+class EncumbrancePane extends React.PureComponent<Props> {
+  renderWeight = (label, weight): React.ReactNode => {
+    const { theme } = this.props;
+    return (
+      <div className="ct-encumbrance-pane__weight">
+        <span className="ct-encumbrance-pane__weight-label">{label}:</span>
+        <span className="ct-encumbrance-pane__weight-value">
+          <NumberDisplay type="weightInLb" number={weight} />
+        </span>
+      </div>
+    );
+  };
+
+  renderWeightDistributions = (): React.ReactNode => {
+    const { preferences, coinWeight, itemWeight } = this.props;
+    // When ignoreCoinWeight is off
+    // item weight should be the weight of items without coins
+    // and coin weight should be the weight of all coins in all equipped containers
+    return (
+      <React.Fragment>
+        <Heading>Current Weight Distribution</Heading>
+        <div className="ct-encumbrance-pane__weights">
+          {this.renderWeight("Items", itemWeight)}
+          {!preferences.ignoreCoinWeight &&
+            this.renderWeight("Coins", coinWeight)}
+        </div>
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    const {
+      preferences,
+      carryCapacity,
+      pushDragLiftWeight,
+      encumberedWeight,
+      heavilyEncumberedWeight,
+      isReadonly,
+    } = this.props;
+
+    return (
+      <div className="ct-encumbrance-pane">
+        <Header
+          callout={
+            <SettingsButton
+              context={SettingsContextsEnum.ENCUMBRANCE}
+              isReadonly={isReadonly}
+            />
+          }
+        >
+          Encumbrance
+        </Header>
+
+        <div className="ct-encumbrance-pane__info">
+          {preferences.encumbranceType ===
+            Constants.PreferenceEncumbranceTypeEnum.NONE && (
+            <React.Fragment>
+              <div className="ct-encumbrance-pane__weights">
+                {this.renderWeight("Carrying Capacity", carryCapacity)}
+                {this.renderWeight("Push, Drag, or Lift", pushDragLiftWeight)}
+              </div>
+              {this.renderWeightDistributions()}
+              <Heading>No Encumbrance</Heading>
+              <p>
+                Encumbrance rules are not currently applied to this character.
+              </p>
+            </React.Fragment>
+          )}
+          {preferences.encumbranceType ===
+            Constants.PreferenceEncumbranceTypeEnum.ENCUMBRANCE && (
+            <React.Fragment>
+              <div className="ct-encumbrance-pane__weights">
+                {this.renderWeight("Carrying Capacity", carryCapacity)}
+                {this.renderWeight("Push, Drag, or Lift", pushDragLiftWeight)}
+              </div>
+              {this.renderWeightDistributions()}
+              <Heading>Lifting and Carrying</Heading>
+              <p>
+                Your Strength score determines the amount of weight you can
+                bear. The following terms define what you can lift or carry.
+              </p>
+
+              <p>
+                Carrying Capacity. Your carrying capacity is your Strength score
+                multiplied by 15. This is the weight (in pounds) that you can
+                carry, which is high enough that most characters don't usually
+                have to worry about it.
+              </p>
+
+              <p>
+                Push, Drag, or Lift. You can push, drag, or lift a weight in
+                pounds up to twice your carrying capacity (or 30 times your
+                Strength score). While pushing or dragging weight in excess of
+                your carrying capacity, your speed drops to 5 feet.
+              </p>
+
+              <p>
+                Size and Strength. Larger creatures can bear more weight,
+                whereas Tiny creatures can carry less. For each size category
+                above Medium, double the creature's carrying capacity and the
+                amount it can push, drag, or lift. For a Tiny creature, halve
+                these weights.
+              </p>
+            </React.Fragment>
+          )}
+          {preferences.encumbranceType ===
+            Constants.PreferenceEncumbranceTypeEnum.VARIANT && (
+            <React.Fragment>
+              <div className="ct-encumbrance-pane__weights">
+                {this.renderWeight("Carrying Capacity", carryCapacity)}
+                {this.renderWeight("Push, Drag, or Lift", pushDragLiftWeight)}
+                {this.renderWeight("Encumbered Weight", encumberedWeight)}
+                {this.renderWeight(
+                  "Heavily Encumbered Weight",
+                  heavilyEncumberedWeight
+                )}
+              </div>
+              {this.renderWeightDistributions()}
+              <Heading>Variant: Encumbrance</Heading>
+              <p>
+                The rules for lifting and carrying are intentionally simple.
+                Here is a variant if you are looking for more detailed rules for
+                determining how a character is hindered by the weight of
+                equipment. When you use this variant, ignore the Strength column
+                of the Armor table.
+              </p>
+
+              <p>
+                If you carry weight in excess of 5 times your Strength score,
+                you are encumbered, which means your speed drops by 10 feet.
+              </p>
+
+              <p>
+                If you carry weight in excess of 10 times your Strength score,
+                up to your maximum carrying capacity, you are instead heavily
+                encumbered, which means your speed drops by 20 feet and you have
+                disadvantage on ability checks, attack rolls, and saving throws
+                that use Strength, Dexterity, or Constitution.
+              </p>
+            </React.Fragment>
+          )}
+        </div>
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    carryCapacity: rulesEngineSelectors.getCarryCapacity(state),
+    pushDragLiftWeight: rulesEngineSelectors.getPushDragLiftWeight(state),
+    encumberedWeight: rulesEngineSelectors.getEncumberedWeight(state),
+    heavilyEncumberedWeight:
+      rulesEngineSelectors.getHeavilyEncumberedWeight(state),
+    preferences: rulesEngineSelectors.getCharacterPreferences(state),
+    coinWeight: rulesEngineSelectors.getCointainerCoinWeight(state),
+    itemWeight: rulesEngineSelectors.getContainerItemWeight(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+  };
+}
+
+export default connect(mapStateToProps)(EncumbrancePane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/EncumbrancePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/EncumbrancePane/index.ts
new file mode 100644
index 0000000..0ee3b9c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/EncumbrancePane/index.ts
@@ -0,0 +1,4 @@
+import EncumbrancePane from "./EncumbrancePane";
+
+export default EncumbrancePane;
+export { EncumbrancePane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/EquipmentManagePane/EquipmentManagePane.tsx b/ddb_main/tools/js/Shared/containers/panes/EquipmentManagePane/EquipmentManagePane.tsx
new file mode 100644
index 0000000..c7ab15d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/EquipmentManagePane/EquipmentManagePane.tsx
@@ -0,0 +1,323 @@
+import React from "react";
+import { useContext } from "react";
+import { connect } from "react-redux";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+  CollapsibleHeading,
+} from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiResponse,
+  rulesEngineSelectors,
+  BaseItemDefinitionContract,
+  RuleData,
+  CampaignUtils,
+  CharacterTheme,
+  Container,
+  ContainerUtils,
+  InventoryManager,
+  Constants,
+  serviceDataSelectors,
+  PartyInfo,
+  ItemManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Button } from "~/components/Button";
+import { ItemName } from "~/components/ItemName";
+import { Link } from "~/components/Link";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { Popover } from "~/components/Popover";
+import { PopoverContent } from "~/components/PopoverContent";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { CustomItemCreator } from "../../../components/CustomItemCreator";
+import EquipmentShop from "../../../components/EquipmentShop";
+import ItemDetail from "../../../components/ItemDetail";
+import { ItemSlotManager } from "../../../components/ItemSlotManager";
+import { ThemeButtonWithMenu } from "../../../components/common/Button";
+import { InventoryManagerContext } from "../../../managers/InventoryManagerContext";
+import { SharedAppState } from "../../../stores/typings";
+
+interface Props {
+  loadAvailableItems: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<Array<BaseItemDefinitionContract>>>;
+  ruleData: RuleData;
+  proficiencyBonus: number;
+  containers: Array<Container>;
+  theme: CharacterTheme;
+  partyInfo: PartyInfo | null;
+  inventoryManager: InventoryManager;
+  paneHistoryPush: PaneInfo["paneHistoryPush"];
+}
+
+class EquipmentManagePane extends React.PureComponent<Props> {
+  renderInventory = (inventory: Array<ItemManager>): React.ReactNode => {
+    const {
+      theme,
+      ruleData,
+      proficiencyBonus,
+      inventoryManager,
+      partyInfo,
+      containers,
+    } = this.props;
+
+    return inventory.map((item) => {
+      const isContainer = item.isContainer();
+      const container = inventoryManager.getContainer(
+        item.generateContainerDefinitionKey()
+      );
+
+      const canMove = inventoryManager.canMoveItem(item.item);
+
+      const calloutButton: React.ReactNode = isContainer ? (
+        <Popover
+          trigger={
+            <Button size="xx-small" variant="outline" themed>
+              Delete
+            </Button>
+          }
+          position="bottomRight"
+          data-testid="remove-container-button"
+          maxWidth={250}
+        >
+          <PopoverContent
+            title={`Remove ${item.getName()}?`}
+            content={`Removing the ${item.getName()} will also remove all of its ${
+              container && container.hasInfusions() ? "infusions and " : " "
+            } contents.`}
+            confirmText="Delete"
+            onConfirm={() => item.handleRemove()}
+            withCancel
+          />
+        </Popover>
+      ) : canMove ? (
+        <ThemeButtonWithMenu
+          showSingleOption={true}
+          containerEl={
+            document.querySelector(".ct-sidebar__portal") as HTMLElement
+          }
+          groupedOptions={ContainerUtils.getGroupedOptions(
+            item.getContainerDefinitionKey(),
+            containers,
+            "Move To:",
+            partyInfo
+              ? CampaignUtils.getSharingState(partyInfo)
+              : Constants.PartyInventorySharingStateEnum.OFF
+          )}
+          buttonStyle="outline"
+          onSelect={(containerDefinitionKey) =>
+            item.handleMove({ containerDefinitionKey })
+          }
+        >
+          Move
+        </ThemeButtonWithMenu>
+      ) : (
+        <Button
+          onClick={() => item.handleRemove()}
+          size="xx-small"
+          variant="outline"
+          themed
+        >
+          Delete
+        </Button>
+      );
+
+      return (
+        <Collapsible
+          key={item.getUniqueKey()}
+          className={`ct-equipment-manage-pane__item${
+            item.isContainer()
+              ? " ct-equipment-manage-pane__item--is-container"
+              : ""
+          }`}
+          layoutType={"minimal"}
+          header={
+            <CollapsibleHeaderContent
+              heading={
+                <div className="ct-equipment-manage-pane__item-header">
+                  <div className="ct-equipment-manage-pane__item-header-action">
+                    <ItemSlotManager
+                      isUsed={!!item.isEquipped()}
+                      theme={theme}
+                      canUse={inventoryManager.canEquipUnequipItem(item.item)}
+                      onSet={(uses) => {
+                        //TODO need different component than SlotManager for item equipped/unequipped
+                        if (uses === 0) {
+                          item.handleUnequip();
+                        }
+
+                        if (uses === 1) {
+                          item.handleEquip();
+                        }
+                      }}
+                      useTooltip={false}
+                      showEmptySlot={!isContainer}
+                    />
+                  </div>
+                  <div
+                    className={`ct-equipment-manage-pane__item-header-name${
+                      isContainer
+                        ? " ct-equipment-manage-pane__item-header-name--is-container"
+                        : ""
+                    }`}
+                  >
+                    {isContainer ? (
+                      "Container details"
+                    ) : (
+                      <ItemName item={item.item} showLegacy={true} />
+                    )}
+                  </div>
+                </div>
+              }
+              callout={calloutButton}
+            />
+          }
+        >
+          <ItemDetail
+            theme={theme}
+            item={item.item}
+            ruleData={ruleData}
+            showCustomize={false}
+            showImage={false}
+            proficiencyBonus={proficiencyBonus}
+          />
+        </Collapsible>
+      );
+    });
+  };
+
+  renderContainers = (): React.ReactNode => {
+    const { theme, inventoryManager } = this.props;
+
+    return inventoryManager.getAllContainers().map((container) => {
+      const containerInventory = container.getInventoryItems({
+        includeContainer: true,
+      }).items;
+
+      const inventoryLength = containerInventory.length;
+      let isEmpty: boolean = inventoryLength === 0;
+
+      let headerNode: React.ReactNode = (
+        <CollapsibleHeaderContent
+          heading={
+            <CollapsibleHeading>{`${container.getName()} (${inventoryLength})`}</CollapsibleHeading>
+          }
+          callout={
+            <div className="ct-equipment-manage-pane__callout">
+              <NumberDisplay
+                type="weightInLb"
+                number={container.getWeightInfo().total}
+              />
+            </div>
+          }
+        />
+      );
+
+      return (
+        <Collapsible header={headerNode} key={container.getDefinitionKey()}>
+          <div className="ct-equipment-manage-pane__inventory">
+            {this.renderInventory(containerInventory)}
+
+            {isEmpty && (
+              <div className="ct-equipment-manage-pane__empty-container">
+                There are no items in your {container.getName()}
+              </div>
+            )}
+          </div>
+        </Collapsible>
+      );
+    });
+  };
+
+  render() {
+    const {
+      ruleData,
+      proficiencyBonus,
+      containers,
+      theme,
+      partyInfo,
+      paneHistoryPush,
+    } = this.props;
+
+    return (
+      <div className="ct-equipment-manage-pane">
+        <Header>Manage Inventory</Header>
+        <Collapsible header="Add Items" initiallyCollapsed={false}>
+          <EquipmentShop
+            partyInfo={partyInfo}
+            containers={containers}
+            theme={theme}
+            ruleData={ruleData}
+            proficiencyBonus={proficiencyBonus}
+          />
+          <CustomItemCreator containers={containers} />
+        </Collapsible>
+
+        {/*container collapsibles*/}
+        {this.renderContainers()}
+
+        <div className="ct-equipment-manage-pane__links">
+          <div className="ct-equipment-manage-pane__link">
+            <Link
+              useTheme={true}
+              onClick={() =>
+                paneHistoryPush(PaneComponentEnum.STARTING_EQUIPMENT)
+              }
+            >
+              Starting Equipment
+            </Link>
+          </div>
+          <div className="ct-equipment-manage-pane__link">
+            <Link
+              useTheme={true}
+              onClick={() => paneHistoryPush(PaneComponentEnum.CURRENCY)}
+            >
+              Currency
+            </Link>
+          </div>
+          <div className="ct-equipment-manage-pane__link">
+            <Link
+              useTheme={true}
+              onClick={() => paneHistoryPush(PaneComponentEnum.ENCUMBRANCE)}
+            >
+              Encumbrance
+            </Link>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    containers: rulesEngineSelectors.getInventoryContainers(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    partyInfo: serviceDataSelectors.getPartyInfo(state),
+  };
+}
+
+function EquipmentManagePaneContainer(props) {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  return (
+    <EquipmentManagePane
+      inventoryManager={inventoryManager}
+      paneHistoryPush={paneHistoryPush}
+      {...props}
+    />
+  );
+}
+
+export default connect(mapStateToProps)(EquipmentManagePaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/EquipmentManagePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/EquipmentManagePane/index.ts
new file mode 100644
index 0000000..0913036
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/EquipmentManagePane/index.ts
@@ -0,0 +1,4 @@
+import EquipmentManagePane from "./EquipmentManagePane";
+
+export default EquipmentManagePane;
+export { EquipmentManagePane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ExportPdfPane/ExportPdfPane.tsx b/ddb_main/tools/js/Shared/containers/panes/ExportPdfPane/ExportPdfPane.tsx
new file mode 100644
index 0000000..af5af00
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ExportPdfPane/ExportPdfPane.tsx
@@ -0,0 +1,78 @@
+import { FC, HTMLAttributes, useEffect, useRef, useState } from "react";
+
+import {
+  LoadingPlaceholder,
+  ThemedExportSvg,
+} from "@dndbeyond/character-components/es";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { usePdfExport } from "~/hooks/usePdfExport";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+
+import { ThemeLinkButton } from "../../../components/common/LinkButton";
+import { ClipboardUtils } from "../../../utils";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {}
+export const ExportPdfPane: FC<Props> = ({ ...props }) => {
+  const urlInput = useRef<HTMLInputElement>(null);
+  const { characterTheme } = useCharacterEngine();
+
+  const [hasCopied, setHasCopied] = useState(false);
+  const { exportPdf, pdfUrl, isLoading } = usePdfExport();
+
+  useEffect(() => {
+    exportPdf();
+  }, []);
+
+  useEffect(() => {
+    if (pdfUrl) {
+      selectUrlInput();
+    }
+  }, [pdfUrl]);
+
+  const selectUrlInput = (): void => {
+    if (urlInput.current) {
+      urlInput.current.focus();
+      urlInput.current.setSelectionRange(0, urlInput.current.value.length);
+    }
+  };
+
+  const handleClick = (evt: React.MouseEvent): void => {
+    ClipboardUtils.copyTextToClipboard(pdfUrl === null ? "" : pdfUrl);
+    setHasCopied(true);
+  };
+
+  return (
+    <div className="ct-export-pdf-pane" {...props}>
+      <div className="ct-export-pdf-pane__splash-icon">
+        <ThemedExportSvg theme={characterTheme} />
+      </div>
+      <Header>PDF Generated</Header>
+      <div className="ct-export-pdf-pane__url">
+        <input
+          type="text"
+          defaultValue={pdfUrl ? pdfUrl.replace(/https*:\/\//, "") : ""}
+          readOnly
+          className="ct-export-pdf-pane__input"
+          ref={urlInput}
+        />
+      </div>
+      {isLoading && <LoadingPlaceholder label={"Loading PDF..."} />}
+      <div className="ct-export-pdf-pane__clipboard" onClick={handleClick}>
+        {hasCopied ? <>Copied! &#x2714;</> : "Click to Copy"}
+      </div>
+      {pdfUrl !== null && (
+        <div className="ct-export-pdf-pane__download">
+          <ThemeLinkButton
+            url={pdfUrl}
+            size={"large"}
+            download={true}
+            className="ct-export-pdf-pane__download-link"
+          >
+            Click to Download
+          </ThemeLinkButton>
+        </div>
+      )}
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePane.tsx b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePane.tsx
new file mode 100644
index 0000000..cda5835
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePane.tsx
@@ -0,0 +1,752 @@
+//TODO: REI need to convert DB constants to enum
+import axios, { Canceler } from "axios";
+import { orderBy } from "lodash";
+import React, { useContext } from "react";
+import { connect, DispatchProp } from "react-redux";
+import { v4 as uuidv4 } from "uuid";
+
+import {
+  Checkbox,
+  Collapsible,
+  LoadingPlaceholder,
+  Select,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  Constants,
+  Creature,
+  CreatureGroupRulesLookup,
+  CreatureRule,
+  CreatureUtils,
+  ExtraManager,
+  ExtrasManager,
+  HelperUtils,
+  MonsterDefinitionContract,
+  RuleData,
+  rulesEngineSelectors,
+  SnippetData,
+  VehicleManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { Reference } from "~/components/Reference";
+import { useExtras } from "~/hooks/useExtras";
+import { CreatureBlock } from "~/subApps/sheet/components/CreatureBlock";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+
+import VehicleBlock from "../../../components/VehicleBlock";
+import { ThemeButton } from "../../../components/common/Button";
+import { ExtrasManagerContext } from "../../../managers/ExtrasManagerContext";
+import * as appEnvSelectors from "../../../selectors/appEnv";
+import { SharedAppState } from "../../../stores/typings";
+import {
+  AppLoggerUtils,
+  AppNotificationUtils,
+  ComponentUtils,
+  FilterUtils,
+  GD_VehicleBlockProps,
+} from "../../../utils";
+import ExtraManagePaneAddListing from "./ExtraManagePaneAddListing";
+import ExtraManagePaneCurrentListing from "./ExtraManagePaneCurrentListing";
+
+//TODO: this comes from ExtrasManager types
+interface ShoppeState {
+  creatureDefinitions: Array<MonsterDefinitionContract>;
+  creatureDefinitionLookup: Record<number, MonsterDefinitionContract>;
+  creatures: Array<ExtraManager>;
+  vehicles: Array<ExtraManager>;
+}
+
+interface CollapsibleComponentProps {
+  metaItems: Array<React.ReactNode>;
+  heading: string | null;
+}
+interface CreatureBlockProps {
+  variant: "default" | "basic";
+  creature: Creature;
+  ruleData: RuleData;
+  className: string;
+}
+export interface PagedListingProps {
+  key: number | string;
+  extra: ExtraManager;
+  onAdd: (extra: ExtraManager, quantity: number) => void;
+  collapsibleComponentProps: CollapsibleComponentProps;
+  ContentComponent: React.ComponentType<any>;
+  contentComponentProps: GD_VehicleBlockProps | CreatureBlockProps;
+  showQuantity?: boolean;
+}
+
+enum DataRetrievalStatusEnum {
+  NONE = "NONE",
+  LOADING = "LOADING",
+  LOADED = "LOADED",
+}
+
+interface Props extends DispatchProp {
+  ruleData: RuleData;
+  pageSize: number;
+  creatureGroupRulesLookup: CreatureGroupRulesLookup;
+  isReadonly: boolean;
+  snippetData: SnippetData;
+  theme: CharacterTheme;
+  extras: Array<ExtraManager>;
+  extrasManager: ExtrasManager;
+}
+interface State {
+  selectedGroup: number | null;
+  dataStatus: DataRetrievalStatusEnum;
+  currentPage: number;
+  filterQuery: string;
+  filterRules: boolean;
+  filterChallengeMin: number | null;
+  filterChallengeMax: number | null;
+  isCurrentExtrasCollapsed: boolean;
+
+  extrasShoppe: ShoppeState;
+}
+class ExtraManagePane extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    pageSize: 20,
+  };
+
+  loadMonstersCanceler: null | Canceler = null;
+  loadVehiclesCanceler: null | Canceler = null;
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      selectedGroup: null,
+      dataStatus: DataRetrievalStatusEnum.NONE,
+      currentPage: 0,
+      filterQuery: "",
+      filterRules: true,
+      filterChallengeMin: null,
+      filterChallengeMax: null,
+      isCurrentExtrasCollapsed: false,
+
+      extrasShoppe: {
+        creatureDefinitions: [],
+        creatureDefinitionLookup: {},
+        creatures: [],
+        vehicles: [],
+      },
+    };
+  }
+
+  // componentDidUpdate(prevProps: Readonly<Props>, prevState: Readonly<State>): void {
+  //     const { definitionPool } = this.props;
+
+  //     if (definitionPool !== prevProps.definitionPool) {
+  //         //TODO: maybe need to handle this with the Shoppe
+  //         // this.setState(this.generateVehicleStateData(this.props));
+  //     }
+  // }
+
+  componentDidMount() {
+    const { extrasManager } = this.props;
+
+    if (extrasManager) {
+      this.setState({
+        dataStatus: DataRetrievalStatusEnum.LOADING,
+      });
+      extrasManager
+        .getExtrasShoppe({
+          groupId: null,
+          onSuccess: (shoppeState: ShoppeState) => {
+            this.setState({
+              dataStatus: DataRetrievalStatusEnum.LOADED,
+              extrasShoppe: shoppeState,
+            });
+          },
+          additionalConfig: {
+            cancelToken: new axios.CancelToken((c) => {
+              this.loadMonstersCanceler = c;
+            }),
+          },
+        })
+        .then((response) => {
+          this.loadMonstersCanceler = null;
+          return response;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    } else {
+      this.setState({
+        dataStatus: DataRetrievalStatusEnum.LOADED,
+      });
+    }
+  }
+
+  componentWillUnmount(): void {
+    //TODO do these cancelers even work?
+    if (this.loadMonstersCanceler !== null) {
+      this.loadMonstersCanceler();
+    }
+    if (this.loadVehiclesCanceler !== null) {
+      this.loadVehiclesCanceler();
+    }
+  }
+
+  getLastPageIdx = <T extends any>(filteredItems: Array<T>): number => {
+    const { pageSize } = this.props;
+
+    return Math.ceil(filteredItems.length / pageSize) - 1;
+  };
+
+  getFilteredCreatures = (): Array<ExtraManager> => {
+    const { extrasManager } = this.props;
+    const {
+      filterRules,
+      filterQuery,
+      filterChallengeMin,
+      filterChallengeMax,
+      selectedGroup,
+      extrasShoppe,
+    } = this.state;
+
+    const { creatures, creatureDefinitionLookup } = extrasShoppe;
+
+    let creatureToFilter: Array<ExtraManager> = filterRules
+      ? extrasManager.getCreaturesFilteredByRules(
+          creatures,
+          creatureDefinitionLookup,
+          selectedGroup
+        )
+      : creatures;
+    let filteredCreatures = creatureToFilter.filter((extra) => {
+      if (
+        filterQuery !== "" &&
+        !FilterUtils.doesQueryMatchData(
+          filterQuery,
+          extra.getName(),
+          extra.getSearchTags()
+        )
+      ) {
+        return false;
+      }
+      const creature = extra.simulateExtraData(
+        selectedGroup,
+        creatureDefinitionLookup
+      ) as Creature;
+      let challengeInfo = CreatureUtils.getChallengeInfo(creature);
+      const hideCr = CreatureUtils.getHideCr(creature);
+      // Treat hide Challenge Rating like a 0 for challenge rating values
+      if (hideCr) {
+        if (filterChallengeMin !== null && 0 < filterChallengeMin) {
+          return false;
+        }
+        if (filterChallengeMax !== null && 0 > filterChallengeMax) {
+          return false;
+        }
+      } else {
+        if (
+          filterChallengeMin !== null &&
+          challengeInfo &&
+          challengeInfo.value < filterChallengeMin
+        ) {
+          return false;
+        }
+        if (
+          filterChallengeMax !== null &&
+          challengeInfo &&
+          challengeInfo.value > filterChallengeMax
+        ) {
+          return false;
+        }
+      }
+
+      return true;
+    });
+
+    return orderBy(filteredCreatures, (extra) => extra.getName());
+  };
+
+  getCreateNames = (name: string, quantity: number): Array<string | null> => {
+    let names: Array<string | null> = [];
+    if (quantity > 1) {
+      for (let i = 1; i <= quantity; i++) {
+        names.push(`${name} ${i}`);
+      }
+    } else {
+      names.push(null);
+    }
+    return names;
+  };
+
+  isFiltered = (): boolean => {
+    const { filterQuery, filterRules } = this.state;
+
+    if (filterRules) {
+      return true;
+    }
+
+    if (filterQuery) {
+      return true;
+    }
+
+    return false;
+  };
+
+  handlePageMore = (): void => {
+    this.setState((prevState) => ({
+      currentPage: prevState.currentPage + 1,
+    }));
+  };
+
+  handleQueryChange = (evt: React.ChangeEvent<HTMLInputElement>) => {
+    const query = evt.target.value;
+
+    this.setState({
+      filterQuery: query,
+      currentPage: 0,
+    });
+  };
+
+  handleChallengeMinChange = (value: string): void => {
+    this.setState({
+      filterChallengeMin: HelperUtils.parseInputFloat(value),
+    });
+  };
+
+  handleChallengeMaxChange = (value: string): void => {
+    this.setState({
+      filterChallengeMax: HelperUtils.parseInputFloat(value),
+    });
+  };
+
+  handleRawToggle = (): void => {
+    this.setState((prevState) => ({
+      filterRules: !prevState.filterRules,
+      currentPage: 0,
+    }));
+  };
+
+  handleSelectedGroupChange = (value: string): void => {
+    const { extrasManager } = this.props;
+    const { extrasShoppe } = this.state;
+
+    let selectedGroup = HelperUtils.parseInputInt(value, null);
+
+    extrasManager.updateExtrasShoppe({
+      currentShoppe: extrasShoppe,
+      groupId: selectedGroup,
+      onSuccess: (shoppeState: ShoppeState) => {
+        this.setState((prevState) => {
+          let filterChallengeMin = prevState.filterChallengeMin;
+          let filterChallengeMax = prevState.filterChallengeMax;
+          if (
+            selectedGroup !== null &&
+            extrasManager.hack__isSidekickGroup(selectedGroup)
+          ) {
+            filterChallengeMin = null;
+            filterChallengeMax = null;
+          }
+
+          return {
+            selectedGroup,
+            isCurrentExtrasCollapsed: true,
+            filterChallengeMax,
+            filterChallengeMin,
+            extrasShoppe: shoppeState,
+          };
+        });
+      },
+    });
+  };
+
+  handleCreateExtra = (extra: ExtraManager, quantity: number): void => {
+    const { selectedGroup } = this.state;
+
+    extra.handleAdd(
+      { quantity, selectedGroup },
+      AppNotificationUtils.handleExtraCreateAccepted.bind(this, extra.extra)
+    );
+  };
+
+  handleRemoveExtra = (extra: ExtraManager): void => {
+    extra.handleRemove();
+  };
+
+  handleCurrentExtrasVisibilityChange = (isCollapsed: boolean): void => {
+    this.setState({
+      isCurrentExtrasCollapsed: isCollapsed,
+    });
+  };
+
+  renderFilterUi = (): React.ReactNode => {
+    const {
+      filterQuery,
+      filterChallengeMin,
+      filterChallengeMax,
+      selectedGroup,
+    } = this.state;
+    const { extrasManager } = this.props;
+
+    let challengeOptions = extrasManager.getChallengeOptions();
+    let isSidekickGroup =
+      selectedGroup !== null &&
+      extrasManager.hack__isSidekickGroup(selectedGroup);
+
+    return (
+      <div className="ct-extra-manage-pane__filters">
+        <div className="ct-extra-manage-pane__filter">
+          <div className="ct-extra-manage-pane__filter-heading">Filter</div>
+          <input
+            type="search"
+            className="ct-filter__query"
+            value={filterQuery}
+            onChange={this.handleQueryChange}
+            placeholder="Name, Type, Subtype, Habitat, Tag, etc."
+            spellCheck={false}
+            autoComplete="off"
+          />
+        </div>
+        {!isSidekickGroup && (
+          <div className="ct-extra-manage-pane__filters-challenge">
+            <div className="ct-extra-manage-pane__filters-challenge-heading">
+              Challenge Range
+            </div>
+            <div className="ct-extra-manage-pane__filters-challenge-fields">
+              <div className="ct-extra-manage-pane__filters-challenge-field">
+                <Select
+                  value={filterChallengeMin}
+                  options={challengeOptions}
+                  onChange={this.handleChallengeMinChange}
+                  placeholder="--"
+                />
+              </div>
+              <div className="ct-extra-manage-pane__filters-challenge-sep">
+                --
+              </div>
+              <div className="ct-extra-manage-pane__filters-challenge-field">
+                <Select
+                  value={filterChallengeMax}
+                  options={challengeOptions}
+                  onChange={this.handleChallengeMaxChange}
+                  placeholder="--"
+                />
+              </div>
+            </div>
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  renderPagedListing = <T extends ExtraManager>(
+    extras: Array<T>,
+    listingComponentPropMappingFunc: (extra: T) => PagedListingProps
+  ): React.ReactNode => {
+    const { currentPage } = this.state;
+    const { pageSize, isReadonly } = this.props;
+
+    const pagedExtras = extras.slice(0, (currentPage + 1) * pageSize);
+
+    return (
+      <div className="ct-extra-manage-pane__listing">
+        {pagedExtras.map((extra) => (
+          <ExtraManagePaneAddListing
+            {...listingComponentPropMappingFunc(extra)}
+            isReadonly={isReadonly}
+          />
+        ))}
+      </div>
+    );
+  };
+
+  renderCreatures = (): React.ReactNode => {
+    const { ruleData, theme, extrasManager } = this.props;
+    const { extrasShoppe, selectedGroup } = this.state;
+    const { creatureDefinitionLookup } = extrasShoppe;
+
+    let filteredCreatures = this.getFilteredCreatures();
+
+    return (
+      <div className="ct-extra-manage-pane__extras">
+        {this.renderFilterUi()}
+        {this.renderPagedListing(filteredCreatures, (extraManager) => {
+          const creature = extraManager.simulateExtraData(
+            selectedGroup,
+            creatureDefinitionLookup
+          ) as Creature;
+          const sourceNames = extraManager.getSourceNames();
+          const References = extraManager.isHomebrew()
+            ? [<Reference isDarkMode={theme.isDarkMode} name="Homebrew" />]
+            : sourceNames.map((source) => (
+                <Reference
+                  name={source}
+                  isDarkMode={theme.isDarkMode}
+                  key={uuidv4()}
+                />
+              ));
+          return {
+            key: extraManager.getId(),
+            extra: extraManager,
+            onAdd: this.handleCreateExtra,
+            collapsibleComponentProps: {
+              metaItems: [
+                ...extrasManager.generateCreatureMeta(creature),
+                ...References,
+              ],
+              heading: extraManager.getName(),
+            },
+            ContentComponent: CreatureBlock,
+            contentComponentProps: {
+              variant: "basic",
+              creature,
+              ruleData: ruleData,
+              className: "ddbc-creature-block",
+            },
+          };
+        })}
+        {this.renderPager(filteredCreatures)}
+      </div>
+    );
+  };
+
+  renderVehicles = (): React.ReactNode => {
+    const { theme } = this.props;
+    const { selectedGroup, extrasShoppe } = this.state;
+    const { vehicles } = extrasShoppe;
+
+    let orderedVehicles = orderBy(vehicles, (vehicle) => vehicle.getName());
+
+    return (
+      <div className="ct-extra-manage-pane__extras">
+        {this.renderPagedListing(orderedVehicles, (vehicleExtra) => {
+          const vehicle = vehicleExtra.simulateExtraData(
+            selectedGroup
+          ) as VehicleManager;
+          const sourceNames = vehicleExtra.getSourceNames();
+          const References = vehicleExtra.isHomebrew()
+            ? [<Reference isDarkMode={theme.isDarkMode} name="Homebrew" />]
+            : sourceNames.map((source) => (
+                <Reference name={source} isDarkMode={theme.isDarkMode} />
+              ));
+          return {
+            key: vehicleExtra.getId(),
+            extra: vehicleExtra,
+            onAdd: this.handleCreateExtra,
+            collapsibleComponentProps: {
+              metaItems: [...vehicle.generateVehicleMeta(), ...References],
+              heading: vehicleExtra.getName(),
+            },
+            ContentComponent: VehicleBlock,
+            contentComponentProps:
+              ComponentUtils.generateVehicleBlockProps(vehicle),
+            showQuantity: false,
+          };
+        })}
+        {this.renderPager(vehicles)}
+      </div>
+    );
+  };
+
+  renderGroupSelector = (): React.ReactNode => {
+    const { selectedGroup, filterRules, dataStatus } = this.state;
+    const { creatureGroupRulesLookup, extrasManager } = this.props;
+
+    const selectedGroupInfo = extrasManager.getCreatureGroupInfo(selectedGroup);
+
+    let groupRules: Array<CreatureRule> | null =
+      selectedGroup === null
+        ? null
+        : HelperUtils.lookupDataOrFallback(
+            creatureGroupRulesLookup,
+            selectedGroup
+          );
+    let isSidekickGroup: boolean =
+      selectedGroup !== null &&
+      extrasManager.hack__isSidekickGroup(selectedGroup);
+
+    let hasGroupRules: boolean = !!groupRules || isSidekickGroup;
+    let showNotDefaultNoRules: boolean =
+      selectedGroupInfo !== null &&
+      !selectedGroupInfo.enabledByDefault &&
+      !hasGroupRules;
+
+    return (
+      <div className="ct-extra-manage-pane__selected-group">
+        <div className="ct-extra-manage-pane__selected-group-chooser">
+          <Select
+            options={extrasManager.getGroupOptions()}
+            value={selectedGroup}
+            onChange={this.handleSelectedGroupChange}
+            placeholder="-- Choose a Category --"
+            disabled={dataStatus === DataRetrievalStatusEnum.LOADING}
+          />
+        </div>
+        {selectedGroup && (
+          <div className="ct-extra-manage-pane__selected-group-content">
+            {selectedGroupInfo && selectedGroupInfo.description && (
+              <HtmlContent
+                className="ct-extra-manage-pane__selected-group-description"
+                html={selectedGroupInfo.description}
+                withoutTooltips
+              />
+            )}
+            {showNotDefaultNoRules && (
+              <div className="ct-extra-manage-pane__selected-group-warning">
+                Adding a creature of this category will be outside of normal
+                game rules.
+              </div>
+            )}
+            {selectedGroupInfo && hasGroupRules && (
+              <div className="ct-extra-manage-pane__selected-group-rules">
+                <Checkbox
+                  initiallyEnabled={filterRules}
+                  onChange={this.handleRawToggle}
+                  label={`Filter Using ${selectedGroupInfo.name} Rules`}
+                />
+              </div>
+            )}
+          </div>
+        )}
+      </div>
+    );
+    //`
+  };
+
+  renderManager = (): React.ReactNode => {
+    const { dataStatus, selectedGroup } = this.state;
+
+    if (dataStatus !== DataRetrievalStatusEnum.LOADED) {
+      return <LoadingPlaceholder />;
+    }
+
+    let extrasNode: React.ReactNode;
+    if (selectedGroup !== null) {
+      if (selectedGroup === Constants.HACK_VEHICLE_GROUP_ID) {
+        extrasNode = this.renderVehicles();
+      } else {
+        extrasNode = this.renderCreatures();
+      }
+    }
+
+    return (
+      <div className="ct-extra-manage-pane__manager">
+        {this.renderGroupSelector()}
+        {extrasNode}
+      </div>
+    );
+  };
+
+  renderPager = <T extends any>(filteredItems: Array<T>): React.ReactNode => {
+    const { currentPage } = this.state;
+    const lastPageIdx = this.getLastPageIdx(filteredItems);
+
+    if (lastPageIdx < 1 || currentPage >= lastPageIdx) {
+      return null;
+    }
+
+    return (
+      <div className="ct-extra-manage-pane__pager">
+        <ThemeButton block={true} onClick={this.handlePageMore}>
+          Load More
+        </ThemeButton>
+      </div>
+    );
+  };
+
+  renderCurrentExtras = (
+    extras: Array<ExtraManager>,
+    heading: string | null,
+    groupId: number | Constants.ExtraGroupTypeEnum
+  ): React.ReactNode => {
+    const { ruleData, theme } = this.props;
+
+    if (!extras.length) {
+      return null;
+    }
+
+    let orderedExtras = orderBy(extras, (extra) => extra.getName());
+
+    return (
+      <div className="ct-extra-manage-pane__group" key={groupId}>
+        <div className="ct-extra-manage-pane__group-heading">{heading}</div>
+        <div className="ct-extra-manage-pane__group-items">
+          {orderedExtras.map((extra) => (
+            <ExtraManagePaneCurrentListing
+              theme={theme}
+              key={extra.getUniqueKey()}
+              extra={extra}
+              ruleData={ruleData}
+              onRemove={this.handleRemoveExtra}
+            />
+          ))}
+        </div>
+      </div>
+    );
+  };
+
+  renderCharacterExtras = (): React.ReactNode => {
+    const { extrasManager, extras } = this.props;
+
+    if (!extras.length) {
+      return (
+        <div className="ct-extra-manage-pane__default">
+          Extras that you add will display here.
+        </div>
+      );
+    }
+
+    const groups = extrasManager.getExtrasGroups();
+    const orderedCreatureGroupInfos = extrasManager.getGroupInfosForExtras();
+
+    return (
+      <div className="ct-extra-manage-pane__inventory">
+        {orderedCreatureGroupInfos.map((groupInfo) =>
+          this.renderCurrentExtras(
+            groups[groupInfo.id],
+            groupInfo.name,
+            groupInfo.id
+          )
+        )}
+      </div>
+    );
+  };
+
+  render() {
+    const { isCurrentExtrasCollapsed } = this.state;
+
+    return (
+      <div className="ct-extra-manage-pane">
+        <Header>Manage Extras</Header>
+        <Collapsible header="Add an Extra" initiallyCollapsed={false}>
+          {this.renderManager()}
+        </Collapsible>
+        <Collapsible
+          header="Current Extras"
+          collapsed={isCurrentExtrasCollapsed}
+          onChangeHandler={this.handleCurrentExtrasVisibilityChange}
+        >
+          {this.renderCharacterExtras()}
+        </Collapsible>
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    creatureGroupRulesLookup:
+      rulesEngineSelectors.getCreatureGroupRulesLookup(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    snippetData: rulesEngineSelectors.getSnippetData(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+function ExtraManagePaneContainer(props) {
+  const { extrasManager } = useContext(ExtrasManagerContext);
+
+  const extras = useExtras();
+
+  return (
+    <ExtraManagePane extrasManager={extrasManager} extras={extras} {...props} />
+  );
+}
+
+export default connect(mapStateToProps)(ExtraManagePaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneAddListing/ExtraManagePaneAddListing.tsx b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneAddListing/ExtraManagePaneAddListing.tsx
new file mode 100644
index 0000000..05acd4d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneAddListing/ExtraManagePaneAddListing.tsx
@@ -0,0 +1,65 @@
+import React, { useState } from "react";
+
+import { HelperUtils } from "@dndbeyond/character-rules-engine/es";
+
+import SimpleQuantity from "../../../../components/SimpleQuantity";
+import { ThemeButton } from "../../../../components/common/Button";
+import { PagedListingProps } from "../ExtraManagePane";
+import ExtraManagePaneListingExtra from "../ExtraManagePaneListingExtra";
+
+interface Props extends PagedListingProps {
+  isReadonly: boolean;
+  minimum?: number;
+  maximum?: number;
+}
+export const ExtraManagePaneAddListing: React.FC<Props> = ({
+  isReadonly,
+  minimum = 1,
+  maximum = 10,
+  extra,
+  collapsibleComponentProps,
+  ContentComponent,
+  contentComponentProps,
+  onAdd,
+  showQuantity = true,
+}) => {
+  const [quantity, setQuantity] = useState<number>(1);
+
+  return (
+    <ExtraManagePaneListingExtra
+      headerCallout={
+        <ThemeButton onClick={() => onAdd(extra, 1)} size="small">
+          Add
+        </ThemeButton>
+      }
+      {...collapsibleComponentProps}
+    >
+      <ContentComponent {...contentComponentProps} />
+      {!isReadonly && showQuantity && (
+        <div className="ct-extra-manage-pane__quantity">
+          <div className="ct-extra-manage-pane__quantity-manager">
+            <SimpleQuantity
+              quantity={quantity}
+              minimum={minimum}
+              maximum={maximum}
+              onUpdate={(quantity) => setQuantity(quantity)}
+              isReadonly={isReadonly}
+            />
+          </div>
+          <div className="ct-extra-manage-pane__quantity-action">
+            <ThemeButton
+              onClick={() =>
+                onAdd(extra, HelperUtils.clampInt(quantity, minimum, maximum))
+              }
+              size="small"
+            >
+              Add {quantity}
+            </ThemeButton>
+          </div>
+        </div>
+      )}
+    </ExtraManagePaneListingExtra>
+  );
+};
+
+export default ExtraManagePaneAddListing;
diff --git a/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneAddListing/index.ts b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneAddListing/index.ts
new file mode 100644
index 0000000..416995e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneAddListing/index.ts
@@ -0,0 +1,4 @@
+import ExtraManagePaneAddListing from "./ExtraManagePaneAddListing";
+
+export default ExtraManagePaneAddListing;
+export { ExtraManagePaneAddListing };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneCurrentListing/ExtraManagePaneCurrentListing.tsx b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneCurrentListing/ExtraManagePaneCurrentListing.tsx
new file mode 100644
index 0000000..1b615c2
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneCurrentListing/ExtraManagePaneCurrentListing.tsx
@@ -0,0 +1,83 @@
+import React from "react";
+
+import { MarketplaceCta } from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  Creature,
+  ExtraManager,
+  RuleData,
+  VehicleManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Reference } from "~/components/Reference";
+import { CreatureBlock } from "~/subApps/sheet/components/CreatureBlock";
+
+import VehicleBlock from "../../../../components/VehicleBlock";
+import { RemoveButton } from "../../../../components/common/Button";
+import { ComponentUtils } from "../../../../utils";
+import ExtraManagePaneListingExtra from "../ExtraManagePaneListingExtra";
+
+interface Props {
+  extra: ExtraManager;
+  ruleData: RuleData;
+  onRemove: (extra: ExtraManager) => void;
+  theme: CharacterTheme;
+}
+
+export const ExtraManagePaneCurrentListing: React.FC<Props> = ({
+  extra,
+  ruleData,
+  onRemove,
+  theme,
+}) => {
+  const extraData = extra.getExtraData();
+
+  let label: string = "Extra";
+  let ContentComponent: React.ReactNode;
+
+  if (extra.isCreature()) {
+    label = "Creature";
+    ContentComponent = (
+      <CreatureBlock
+        variant="default"
+        creature={extraData as Creature}
+        ruleData={ruleData}
+        className="ddbc-creature-block"
+      />
+    );
+  } else if (extra.isVehicle()) {
+    label = "Vehicle";
+    const vehicle = extraData as VehicleManager;
+    ContentComponent = vehicle.isAccessible() ? (
+      <VehicleBlock
+        theme={theme}
+        {...ComponentUtils.generateVehicleBlockProps(vehicle)}
+      />
+    ) : (
+      <MarketplaceCta
+        sourceNames={extra.getSourceNames()}
+        description={`To unlock this ${label}, check out the Marketplace to view purchase options.`}
+      />
+    );
+  }
+
+  const References = extra.isHomebrew()
+    ? [<Reference isDarkMode={theme.isDarkMode} name="Homebrew" />]
+    : extra
+        .getSourceNames()
+        .map((sourceName) => (
+          <Reference name={sourceName} isDarkMode={theme.isDarkMode} />
+        ));
+
+  return (
+    <ExtraManagePaneListingExtra
+      headerCallout={<RemoveButton onClick={() => onRemove(extra)} />}
+      metaItems={[...extra.getMetaText(), ...References]}
+      heading={extra.getName()}
+    >
+      {ContentComponent}
+    </ExtraManagePaneListingExtra>
+  );
+};
+
+export default ExtraManagePaneCurrentListing;
diff --git a/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneCurrentListing/index.ts b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneCurrentListing/index.ts
new file mode 100644
index 0000000..ff54b8c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneCurrentListing/index.ts
@@ -0,0 +1,4 @@
+import ExtraManagePaneCurrentListing from "./ExtraManagePaneCurrentListing";
+
+export default ExtraManagePaneCurrentListing;
+export { ExtraManagePaneCurrentListing };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneListingExtra/ExtraManagePaneListingExtra.tsx b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneListingExtra/ExtraManagePaneListingExtra.tsx
new file mode 100644
index 0000000..77e2ae8
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneListingExtra/ExtraManagePaneListingExtra.tsx
@@ -0,0 +1,38 @@
+import React from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+} from "@dndbeyond/character-components/es";
+
+interface Props {
+  headerCallout: React.ReactNode;
+  heading: React.ReactNode;
+  metaItems: Array<React.ReactNode>;
+}
+export const ExtraManagePaneListingExtra: React.FC<Props> = ({
+  headerCallout,
+  heading,
+  metaItems,
+  children,
+}) => {
+  let header: React.ReactNode = (
+    <CollapsibleHeaderContent
+      heading={heading}
+      metaItems={metaItems}
+      callout={headerCallout}
+    />
+  );
+
+  return (
+    <Collapsible
+      layoutType={"minimal"}
+      header={header}
+      className="ct-extra-manage-pane__extra"
+    >
+      {children}
+    </Collapsible>
+  );
+};
+
+export default ExtraManagePaneListingExtra;
diff --git a/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneListingExtra/index.ts b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneListingExtra/index.ts
new file mode 100644
index 0000000..00a4cf9
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/ExtraManagePaneListingExtra/index.ts
@@ -0,0 +1,4 @@
+import ExtraManagePaneListingExtra from "./ExtraManagePaneListingExtra";
+
+export default ExtraManagePaneListingExtra;
+export { ExtraManagePaneListingExtra };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/index.ts
new file mode 100644
index 0000000..298bbd3
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ExtraManagePane/index.ts
@@ -0,0 +1,12 @@
+import ExtraManagePane from "./ExtraManagePane";
+import ExtraManagePaneAddListing from "./ExtraManagePaneAddListing";
+import ExtraManagePaneCurrentListing from "./ExtraManagePaneCurrentListing";
+import ExtraManagePaneListingExtra from "./ExtraManagePaneListingExtra";
+
+export default ExtraManagePane;
+export {
+  ExtraManagePane,
+  ExtraManagePaneAddListing,
+  ExtraManagePaneCurrentListing,
+  ExtraManagePaneListingExtra,
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePane.tsx b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePane.tsx
new file mode 100644
index 0000000..447e5b7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePane.tsx
@@ -0,0 +1,1282 @@
+import axios, { Canceler } from "axios";
+import { orderBy } from "lodash";
+import * as React from "react";
+import { useContext } from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  CreaturePreview,
+  ItemPreview,
+  MarketplaceCta,
+  LoadingPlaceholder,
+} from "@dndbeyond/character-components/es";
+import {
+  AccessUtils,
+  ApiAdapterPromise,
+  ApiAdapterRequestConfig,
+  ApiResponse,
+  rulesEngineSelectors,
+  BaseItemDefinitionContract,
+  Constants,
+  ContainerUtils,
+  Creature,
+  CreatureLookup,
+  FormatUtils,
+  HelperUtils,
+  InfusionChoice,
+  InfusionChoiceUtils,
+  InfusionModifierDataContract,
+  InfusionUtils,
+  InventoryLookup,
+  Item,
+  ItemUtils,
+  KnownInfusionUtils,
+  Modifier,
+  TypeValueLookup,
+  serviceDataActions,
+  RuleData,
+  RuleDataUtils,
+  DefinitionUtils,
+  CharacterTheme,
+  Container,
+  ClassUtils,
+  BaseCharClass,
+  ContainerManager,
+} from "@dndbeyond/character-rules-engine/es";
+import { InventoryManager } from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersInfusionChoice,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { RemoveButton, ThemeButton } from "../../../components/common/Button";
+import DataLoadingStatusEnum from "../../../constants/DataLoadingStatusEnum";
+import { InventoryManagerContext } from "../../../managers/InventoryManagerContext";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+import { AppLoggerUtils, PaneIdentifierUtils } from "../../../utils";
+import InfusionChoicePaneNewStore from "./InfusionChoicePaneNewStore";
+import InfusionChoicePaneStep from "./InfusionChoicePaneStep";
+import InfusionChoicePaneStore from "./InfusionChoicePaneStore";
+
+enum UiViewEnum {
+  REVIEW = "REVIEW",
+  CHOOSE_ITEM = "CHOOSE_ITEM",
+  CHOOSE_MODIFIER_GROUP = "CHOOSE_MODIFIER_GROUP",
+}
+
+type SimpleOnClickHandler = () => void;
+
+interface Props extends DispatchProp {
+  infusionChoices: Array<InfusionChoice>;
+  inventory: Array<Item>;
+  inventoryLookup: InventoryLookup;
+  containers: Array<Container>;
+  creatureLookup: CreatureLookup;
+  ruleData: RuleData;
+  globalModifiers: Array<Modifier>;
+  typeValueLookup: TypeValueLookup;
+  loadAvailableItems: (
+    additionalConfig?: Partial<ApiAdapterRequestConfig>
+  ) => ApiAdapterPromise<ApiResponse<Array<BaseItemDefinitionContract>>>;
+
+  identifiers: PaneIdentifiersInfusionChoice;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  maximumInfusions?: number;
+  currentInfusions?: number;
+  characterId: number;
+  theme: CharacterTheme;
+  inventoryManager: InventoryManager;
+  classes: Array<BaseCharClass>;
+  paneHistoryPush: PaneInfo["paneHistoryPush"];
+}
+interface StateData {
+  infusionChoice: InfusionChoice | null;
+  modifierGroupId: string | null;
+  needsItemStore: boolean;
+  itemCanBeAddedLookup: Record<number, boolean>;
+}
+interface State extends StateData {
+  chosenItemId: number | null;
+  inventoryItem: Item | null;
+  newItem: Item | null;
+  creatureId: number | null;
+  loadingStatus: DataLoadingStatusEnum;
+  storeItems: Array<Item>;
+  uiView: UiViewEnum;
+  overrideMaximumInfusions: boolean;
+  maximumInfusions: number;
+  currentInfusions: number;
+  isRemoveModalOpen: boolean;
+}
+class InfusionChoicePane extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      ...this.getStateData(props, []),
+      chosenItemId: null,
+      inventoryItem: null,
+      newItem: null,
+      creatureId: null,
+      loadingStatus: DataLoadingStatusEnum.NOT_LOADED,
+      storeItems: [],
+      uiView: UiViewEnum.REVIEW,
+      overrideMaximumInfusions: false,
+      maximumInfusions: 0,
+      currentInfusions: 0,
+      isRemoveModalOpen: false,
+    };
+  }
+
+  loadItemsCanceler: null | Canceler = null;
+
+  componentDidMount() {
+    this.loadNeededItems();
+    let maximumInfusions = 0;
+    let currentInfusions = 0;
+    this.props.classes.forEach((charClass) => {
+      const classMaxInfusions = ClassUtils.deriveMaxInfusions(charClass);
+      const classCurrentInfusions = this.props.infusionChoices.filter(
+        (infusionChoice) =>
+          InfusionChoiceUtils.getInfusion(infusionChoice) !== null
+      ).length;
+      if (classMaxInfusions && classMaxInfusions > maximumInfusions) {
+        maximumInfusions = classMaxInfusions;
+      }
+      if (classCurrentInfusions && classCurrentInfusions > currentInfusions) {
+        currentInfusions = classCurrentInfusions;
+      }
+    });
+    this.setState({
+      currentInfusions,
+      maximumInfusions,
+    });
+  }
+
+  componentDidUpdate(prevProps: Props, prevState: State, snapshot) {
+    if (
+      prevProps.infusionChoices !== this.props.infusionChoices ||
+      prevProps.identifiers.id !== this.props.identifiers.id
+    ) {
+      this.setState(
+        {
+          ...this.getStateData(this.props, this.state.storeItems),
+          chosenItemId: null,
+          inventoryItem: null,
+          newItem: null,
+          creatureId: null,
+          uiView: UiViewEnum.REVIEW,
+          currentInfusions: this.props.infusionChoices.filter(
+            (infusionChoice) =>
+              InfusionChoiceUtils.getInfusion(infusionChoice) !== null
+          ).length,
+        },
+        () => {
+          this.loadNeededItems();
+        }
+      );
+    }
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadItemsCanceler !== null) {
+      this.loadItemsCanceler();
+    }
+  }
+
+  loadNeededItems = (): void => {
+    const { loadingStatus, needsItemStore } = this.state;
+    const { inventoryManager } = this.props;
+
+    if (needsItemStore && loadingStatus === DataLoadingStatusEnum.NOT_LOADED) {
+      this.setState({
+        loadingStatus: DataLoadingStatusEnum.LOADING,
+      });
+
+      inventoryManager
+        .getInventoryShoppe({
+          onSuccess: (shoppeContainer: ContainerManager) => {
+            const storeItems = shoppeContainer
+              .getInventoryItems()
+              .items.map((item) => item.getItem());
+
+            this.setState({
+              ...this.getStateData(this.props, storeItems),
+              storeItems,
+              loadingStatus: DataLoadingStatusEnum.LOADED,
+            });
+          },
+          additionalApiConfig: {
+            cancelToken: new axios.CancelToken((c) => {
+              this.loadItemsCanceler = c;
+            }),
+          },
+        })
+        .then((res) => {
+          this.loadItemsCanceler = null;
+          return res;
+        })
+        .catch(AppLoggerUtils.handleAdhocApiError);
+    }
+  };
+
+  getStateData = (props: Props, storeItems: Array<Item>): StateData => {
+    const infusionChoice = props.infusionChoices.find(
+      (infusionChoice) =>
+        props.identifiers.id === InfusionChoiceUtils.getKey(infusionChoice)
+    );
+    const forcedModifierData =
+      infusionChoice !== null && infusionChoice
+        ? InfusionChoiceUtils.getForcedModifierData(infusionChoice)
+        : null;
+
+    let needsItemStore: boolean = false;
+    if (infusionChoice && !props.isReadonly) {
+      const knownInfusion =
+        InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+      if (knownInfusion) {
+        const simulatedInfusion =
+          KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+        if (
+          simulatedInfusion !== null &&
+          InfusionUtils.getType(simulatedInfusion) ===
+            Constants.InfusionTypeEnum.REPLICATE
+        ) {
+          needsItemStore = true;
+        }
+      }
+    }
+
+    let itemCanBeAddedLookup: Record<number, boolean> = storeItems.reduce(
+      (acc, item) => {
+        acc[ItemUtils.getId(item)] = ItemUtils.canBeAddedToInventory(item);
+        return acc;
+      },
+      {}
+    );
+
+    return {
+      infusionChoice: infusionChoice ? infusionChoice : null,
+      modifierGroupId:
+        forcedModifierData === null ? null : forcedModifierData.id,
+      needsItemStore,
+      itemCanBeAddedLookup,
+    };
+  };
+
+  getActiveItemId = (): number | null => {
+    const { infusionChoice, chosenItemId, itemCanBeAddedLookup } = this.state;
+
+    if (infusionChoice === null) {
+      return null;
+    }
+
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return null;
+    }
+
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (
+      simulatedInfusion !== null &&
+      InfusionUtils.getType(simulatedInfusion) ===
+        Constants.InfusionTypeEnum.REPLICATE
+    ) {
+      let knownInfusionItemId = KnownInfusionUtils.getItemId(knownInfusion);
+      if (
+        InfusionUtils.hack__requiresItemChoice(
+          simulatedInfusion,
+          knownInfusionItemId,
+          itemCanBeAddedLookup
+        )
+      ) {
+        return chosenItemId;
+      } else {
+        return knownInfusionItemId;
+      }
+    }
+
+    return chosenItemId;
+  };
+
+  handleChooseExistingItem = (item: Item): void => {
+    this.setState({
+      inventoryItem: item,
+      newItem: null,
+      chosenItemId: ItemUtils.getId(item),
+      uiView: UiViewEnum.REVIEW,
+    });
+  };
+
+  handleChooseNewItem = (item: Item): void => {
+    this.setState({
+      inventoryItem: null,
+      newItem: item,
+      chosenItemId: ItemUtils.getId(item),
+      uiView: UiViewEnum.REVIEW,
+    });
+  };
+
+  handleChooseModifierGroup = (modifierGroupId: string | null): void => {
+    this.setState({
+      modifierGroupId: modifierGroupId ? modifierGroupId : null,
+      uiView: UiViewEnum.REVIEW,
+    });
+  };
+
+  handleInfuse = (): void => {
+    const { dispatch, characterId } = this.props;
+    const {
+      infusionChoice,
+      inventoryItem,
+      creatureId,
+      modifierGroupId,
+      newItem,
+    } = this.state;
+
+    if (infusionChoice === null) {
+      return;
+    }
+
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return;
+    }
+
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+      return;
+    }
+
+    const infusionId = InfusionUtils.getId(simulatedInfusion);
+    if (infusionId === null) {
+      return;
+    }
+
+    let inventoryMappingId: number | null = null;
+    if (inventoryItem !== null) {
+      inventoryMappingId = ItemUtils.getMappingId(inventoryItem);
+    }
+    let itemId: number | null = null;
+    let itemTypeId: number | null = null;
+    if (
+      InfusionUtils.getType(simulatedInfusion) ===
+      Constants.InfusionTypeEnum.REPLICATE
+    ) {
+      itemId = this.getActiveItemId();
+      itemTypeId = Constants.MAGIC_ITEM_ENTITY_TYPE_ID;
+    } else if (newItem !== null) {
+      itemId = ItemUtils.getId(newItem);
+      itemTypeId = ItemUtils.getDefinitionEntityTypeId(newItem);
+    }
+
+    const characterContainerDefinitionKey =
+      ContainerUtils.getCharacterContainerDefinitionKey(characterId);
+
+    dispatch(
+      serviceDataActions.infusionMappingCreate({
+        choiceKey: InfusionChoiceUtils.getKey(infusionChoice),
+        infusionId,
+        inventoryMappingId,
+        modifierGroupId,
+        itemId,
+        itemTypeId,
+        creatureId,
+        containerEntityId:
+          inventoryItem !== null
+            ? ItemUtils.getContainerEntityId(inventoryItem)
+            : DefinitionUtils.hack__getDefinitionKeyId(
+                characterContainerDefinitionKey
+              ),
+        containerEntityTypeId:
+          inventoryItem !== null
+            ? ItemUtils.getContainerEntityTypeId(inventoryItem)
+            : DefinitionUtils.hack__getDefinitionKeyType(
+                characterContainerDefinitionKey
+              ),
+      })
+    );
+  };
+
+  handleInfusionRemove = (): void => {
+    const { dispatch, inventoryLookup } = this.props;
+    const { infusionChoice } = this.state;
+
+    if (infusionChoice === null) {
+      return;
+    }
+
+    const infusion = InfusionChoiceUtils.getInfusion(infusionChoice);
+    if (infusion) {
+      const infusionId = InfusionUtils.getId(infusion);
+      if (infusionId === null) {
+        return;
+      }
+
+      const inventoryMappingId = InfusionUtils.getInventoryMappingId(infusion);
+      const item = HelperUtils.lookupDataOrFallback(
+        inventoryLookup,
+        inventoryMappingId
+      );
+
+      if (item && ItemUtils.isContainer(item)) {
+        this.handleRemoveContainer(item);
+      } else {
+        dispatch(
+          serviceDataActions.infusionMappingDestroy(
+            infusionId,
+            InfusionUtils.getInventoryMappingId(infusion)
+          )
+        );
+      }
+
+      this.setState((state) => ({
+        currentInfusions: state.currentInfusions - 1,
+      }));
+    }
+  };
+
+  handleRemoveInfusions = (itemIds: Array<number>): void => {
+    const { dispatch } = this.props;
+
+    itemIds.forEach((id) => {
+      dispatch(serviceDataActions.infusionMappingsDestroy(itemIds));
+    });
+  };
+
+  handleInfusionItemClick = (): void => {
+    const { paneHistoryPush } = this.props;
+    const { infusionChoice } = this.state;
+
+    if (infusionChoice === null) {
+      return;
+    }
+
+    const infusion = InfusionChoiceUtils.getInfusion(infusionChoice);
+    if (infusion === null) {
+      return;
+    }
+
+    const inventoryMappingId = InfusionUtils.getInventoryMappingId(infusion);
+
+    if (inventoryMappingId) {
+      paneHistoryPush(
+        PaneComponentEnum.ITEM_DETAIL,
+        PaneIdentifierUtils.generateItem(inventoryMappingId)
+      );
+    }
+  };
+
+  handleInfusionCreatureClick = (): void => {
+    const { paneHistoryPush } = this.props;
+    const { infusionChoice } = this.state;
+
+    if (infusionChoice === null) {
+      return;
+    }
+
+    const infusion = InfusionChoiceUtils.getInfusion(infusionChoice);
+    if (infusion === null) {
+      return;
+    }
+
+    const creatureMappingId = InfusionUtils.getCreatureMappingId(infusion);
+
+    if (creatureMappingId) {
+      paneHistoryPush(
+        PaneComponentEnum.CREATURE,
+        PaneIdentifierUtils.generateCreature(creatureMappingId)
+      );
+    }
+  };
+
+  handleChangeUiView = (uiView: UiViewEnum): void => {
+    const { isReadonly } = this.props;
+
+    if (isReadonly) {
+      return;
+    }
+
+    this.setState({
+      uiView,
+    });
+  };
+
+  hasChosenInfusionItem = (): boolean => {
+    if (this.getActiveItemId() === null) {
+      return false;
+    }
+
+    return true;
+  };
+
+  hasChosenInfusionModifierData = (): boolean => {
+    const { modifierGroupId } = this.state;
+
+    return modifierGroupId !== null;
+  };
+
+  canCreateInfusion = (): boolean => {
+    const {
+      infusionChoice,
+      itemCanBeAddedLookup,
+      maximumInfusions,
+      currentInfusions,
+      overrideMaximumInfusions,
+    } = this.state;
+
+    if (!overrideMaximumInfusions && currentInfusions >= maximumInfusions) {
+      return false;
+    }
+
+    if (infusionChoice === null) {
+      return false;
+    }
+
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return false;
+    }
+
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+      return false;
+    }
+
+    if (
+      InfusionUtils.hack__requiresItemChoice(
+        simulatedInfusion,
+        KnownInfusionUtils.getItemId(knownInfusion),
+        itemCanBeAddedLookup
+      ) &&
+      !this.hasChosenInfusionItem()
+    ) {
+      return false;
+    }
+
+    if (
+      InfusionUtils.requiresModifierDataChoice(simulatedInfusion) &&
+      !this.hasChosenInfusionModifierData()
+    ) {
+      return false;
+    }
+
+    return true;
+  };
+
+  renderChosenItem = (): React.ReactNode => {
+    const { theme } = this.props;
+    const { inventoryItem, newItem } = this.state;
+
+    let chosenItem: Item | null = null;
+    if (inventoryItem !== null) {
+      chosenItem = inventoryItem;
+    } else if (newItem !== null) {
+      chosenItem = newItem;
+    }
+
+    if (chosenItem === null) {
+      return null;
+    }
+
+    return <ItemPreview item={chosenItem} theme={theme} />;
+  };
+
+  renderChosenModifierGroup = (): React.ReactNode => {
+    const { infusionChoice, modifierGroupId } = this.state;
+
+    if (infusionChoice === null) {
+      return null;
+    }
+
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return null;
+    }
+
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+      return null;
+    }
+
+    const modifierData = InfusionUtils.getModifierData(simulatedInfusion);
+    const foundModifierGroup = modifierData.find(
+      (dataItem) => dataItem.id === modifierGroupId
+    );
+
+    if (!foundModifierGroup) {
+      return null;
+    }
+
+    return foundModifierGroup.name;
+  };
+
+  renderUiChooseItem = (): React.ReactNode => {
+    const { infusionChoice } = this.state;
+    const { inventory, ruleData, proficiencyBonus, theme, inventoryManager } =
+      this.props;
+
+    if (infusionChoice === null) {
+      return null;
+    }
+
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return null;
+    }
+
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+      return null;
+    }
+
+    const itemRuleData = InfusionUtils.getItemRuleData(simulatedInfusion);
+
+    let canChooseExisting: boolean = true;
+    if (
+      InfusionUtils.getType(simulatedInfusion) ===
+      Constants.InfusionTypeEnum.REPLICATE
+    ) {
+      canChooseExisting = false;
+    }
+
+    return (
+      <React.Fragment>
+        <Header
+          parent={this.renderInfusionChoiceName()}
+          onClick={this.handleChangeUiView.bind(this, UiViewEnum.REVIEW)}
+        >
+          Choose an item to infuse
+        </Header>
+        <div className="ct-infusion-choice-pane__ui ct-infusion-choice-pane__ui--choose-item">
+          {itemRuleData && (
+            <div className="ct-infusion-choice-pane__ui-group">
+              <div className="ct-infusion-choice-pane__ui-header">
+                Requirements
+              </div>
+              <div className="ct-infusion-choice-pane__ui-content">
+                {itemRuleData.text}
+              </div>
+            </div>
+          )}
+          {canChooseExisting && (
+            <div className="ct-infusion-choice-pane__ui-group">
+              <div className="ct-infusion-choice-pane__ui-header">
+                Choose an existing item
+              </div>
+              <div className="ct-infusion-choice-pane__ui-content">
+                <InfusionChoicePaneStore
+                  theme={theme}
+                  items={inventory}
+                  infusionChoice={infusionChoice}
+                  ruleData={ruleData}
+                  onItemSelected={this.handleChooseExistingItem}
+                  proficiencyBonus={proficiencyBonus}
+                />
+              </div>
+            </div>
+          )}
+          <div className="ct-infusion-choice-pane__ui-group">
+            <div className="ct-infusion-choice-pane__ui-header">
+              Choose a new item
+            </div>
+            <div className="ct-infusion-choice-pane__ui-content">
+              <InfusionChoicePaneNewStore
+                theme={theme}
+                inventoryManager={inventoryManager}
+                infusionChoice={infusionChoice}
+                onItemSelected={this.handleChooseNewItem}
+                ruleData={ruleData}
+              />
+            </div>
+          </div>
+        </div>
+      </React.Fragment>
+    );
+  };
+
+  renderUiChooseModifierGroup = (): React.ReactNode => {
+    const { infusionChoice } = this.state;
+
+    if (infusionChoice === null) {
+      return null;
+    }
+
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return null;
+    }
+
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+      return null;
+    }
+
+    const modifierDataType =
+      InfusionUtils.getModifierDataType(simulatedInfusion);
+    const modifierData = InfusionUtils.getModifierData(simulatedInfusion);
+
+    let headerContentNode: React.ReactNode;
+    let entries: Array<InfusionModifierDataContract> = [];
+    switch (modifierDataType) {
+      case Constants.InfusionModifierDataTypeEnum.DAMAGE_TYPE_CHOICE:
+        headerContentNode = "Choose a Damage Type";
+        entries = orderBy(modifierData, (data) => data.name);
+
+        break;
+      default:
+      // not implemented
+    }
+
+    return (
+      <React.Fragment>
+        <Header
+          parent={this.renderInfusionChoiceName()}
+          onClick={this.handleChangeUiView.bind(this, UiViewEnum.REVIEW)}
+        >
+          Choose a variant for the infusion
+        </Header>
+        <div className="ct-infusion-choice-pane__ui ct-infusion-choice-pane__ui--choose-modifier-group">
+          <div className="ct-infusion-choice-pane__ui-group">
+            <div className="ct-infusion-choice-pane__ui-header">
+              {headerContentNode}
+            </div>
+            <div className="ct-infusion-choice-pane__ui-content">
+              {entries.map((entry) => (
+                <div
+                  className="ct-infusion-choice-pane__entry"
+                  key={entry.id === null ? "" : entry.id}
+                >
+                  <div className="ct-infusion-choice-pane__entry-primary">
+                    <div className="ct-infusion-choice-pane__entry-header">
+                      {entry.name}
+                    </div>
+                  </div>
+                  <div className="ct-infusion-choice-pane__entry-extra">
+                    <ThemeButton
+                      onClick={this.handleChooseModifierGroup.bind(
+                        this,
+                        entry.id
+                      )}
+                      size="small"
+                      data-testid={`infusion-choose-item-button-${entry.name}`
+                        .toLowerCase()
+                        .replace(/\s/g, "-")}
+                    >
+                      Choose
+                    </ThemeButton>
+                  </div>
+                </div>
+              ))}
+            </div>
+          </div>
+        </div>
+      </React.Fragment>
+    );
+  };
+
+  renderActions = (): React.ReactNode => {
+    return (
+      <div className="ct-infusion-choice-pane__actions">
+        <ThemeButton
+          onClick={this.handleInfuse}
+          disabled={!this.canCreateInfusion()}
+          data-testid="create-infusion-button"
+        >
+          Create Infusion
+        </ThemeButton>
+      </div>
+    );
+  };
+
+  renderDescription = (): React.ReactNode => {
+    const { infusionChoice } = this.state;
+
+    if (infusionChoice === null) {
+      return null;
+    }
+
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return null;
+    }
+
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+      return null;
+    }
+
+    let contentNode: React.ReactNode;
+
+    if (
+      AccessUtils.isAccessible(InfusionUtils.getAccessType(simulatedInfusion))
+    ) {
+      const description = InfusionUtils.getDescription(simulatedInfusion);
+      if (description) {
+        contentNode = (
+          <HtmlContent
+            className="ct-infusion-choice-pane__description"
+            html={description}
+            withoutTooltips
+          />
+        );
+      }
+    } else {
+      contentNode = this.renderMarketplaceCta();
+    }
+
+    return contentNode;
+  };
+
+  renderInfusionChoiceName = (): React.ReactNode => {
+    const { infusionChoice } = this.state;
+
+    if (infusionChoice === null) {
+      return null;
+    }
+
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return null;
+    }
+
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+      return null;
+    }
+
+    let extraNameNode: React.ReactNode;
+    if (
+      knownInfusion &&
+      InfusionUtils.getType(simulatedInfusion) ===
+        Constants.InfusionTypeEnum.REPLICATE
+    ) {
+      extraNameNode = `: ${KnownInfusionUtils.getItemName(knownInfusion)}`;
+    }
+
+    return (
+      <React.Fragment>
+        Infusion: {InfusionUtils.getName(simulatedInfusion)}
+        {extraNameNode}
+      </React.Fragment>
+    );
+  };
+
+  renderUiReview = (): React.ReactNode => {
+    const {
+      newItem,
+      inventoryItem,
+      infusionChoice,
+      itemCanBeAddedLookup,
+      maximumInfusions,
+      currentInfusions,
+      overrideMaximumInfusions,
+    } = this.state;
+
+    const { isReadonly } = this.props;
+
+    if (infusionChoice === null) {
+      return null;
+    }
+
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return null;
+    }
+
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+      return null;
+    }
+
+    const knownInfusionItemId = KnownInfusionUtils.getItemId(knownInfusion);
+    const infusionType = InfusionUtils.getType(simulatedInfusion);
+    const requiresItemChoice = InfusionUtils.hack__requiresItemChoice(
+      simulatedInfusion,
+      knownInfusionItemId,
+      itemCanBeAddedLookup
+    );
+
+    const hasChosenInfusionItem = this.hasChosenInfusionItem();
+    let itemHeaderNode: React.ReactNode;
+    let itemContentNode: React.ReactNode;
+    let itemExtraNode: React.ReactNode;
+    let itemOnClick: SimpleOnClickHandler | undefined;
+    if (requiresItemChoice) {
+      itemOnClick = this.handleChangeUiView.bind(this, UiViewEnum.CHOOSE_ITEM);
+      if (hasChosenInfusionItem) {
+        if (newItem !== null) {
+          itemHeaderNode = "New item to be infused";
+        } else if (inventoryItem !== null) {
+          itemHeaderNode = "Existing item to be infused";
+        }
+        itemContentNode = this.renderChosenItem();
+        if (!isReadonly) {
+          itemExtraNode = (
+            <ThemeButton size="small" onClick={itemOnClick}>
+              Change
+            </ThemeButton>
+          );
+        }
+      } else {
+        itemHeaderNode = "Item to be infused";
+        itemContentNode =
+          currentInfusions >= maximumInfusions
+            ? "Currently at Infusion Limit"
+            : "No Item Chosen";
+        if (!isReadonly) {
+          itemExtraNode = (
+            <ThemeButton
+              size="small"
+              disabled={
+                !overrideMaximumInfusions &&
+                currentInfusions >= maximumInfusions
+              }
+              onClick={itemOnClick}
+              data-testid={`infusion-choose-items-button`}
+            >
+              Choose
+            </ThemeButton>
+          );
+        }
+      }
+    } else if (infusionType === Constants.InfusionTypeEnum.REPLICATE) {
+      itemHeaderNode = "Item to be replicated";
+      itemContentNode = (
+        <React.Fragment>
+          {KnownInfusionUtils.getItemName(knownInfusion)}
+        </React.Fragment>
+      );
+    }
+
+    const modifierData = InfusionUtils.getModifierData(simulatedInfusion);
+    const modifierDataType =
+      InfusionUtils.getModifierDataType(simulatedInfusion);
+
+    let modifierGroupHeaderNode: React.ReactNode = null;
+    let modifierGroupContentNode: React.ReactNode = null;
+    let modifierGroupExtraNode: React.ReactNode = null;
+    let modifierGroupOnClick: SimpleOnClickHandler | undefined;
+    if (
+      modifierData !== null &&
+      InfusionUtils.requiresModifierDataChoice(simulatedInfusion)
+    ) {
+      switch (modifierDataType) {
+        case Constants.InfusionModifierDataTypeEnum.CLASS_LEVEL:
+          modifierGroupHeaderNode = "Current Class Level Bonus";
+          let forcedModifierData =
+            InfusionChoiceUtils.getForcedModifierData(infusionChoice);
+          if (forcedModifierData) {
+            modifierGroupContentNode = forcedModifierData.name;
+          }
+          break;
+
+        default:
+          modifierGroupOnClick = this.handleChangeUiView.bind(
+            this,
+            UiViewEnum.CHOOSE_MODIFIER_GROUP
+          );
+          const hasChosenModifier = this.hasChosenInfusionModifierData();
+          if (hasChosenModifier) {
+            modifierGroupHeaderNode = "Chosen Variant";
+            modifierGroupContentNode = this.renderChosenModifierGroup();
+            modifierGroupExtraNode = (
+              <ThemeButton size="small" onClick={modifierGroupOnClick}>
+                Change
+              </ThemeButton>
+            );
+          } else {
+            modifierGroupHeaderNode = "Choose a Variant";
+            modifierGroupContentNode = "No Variant Chosen";
+            modifierGroupExtraNode = (
+              <ThemeButton size="small" onClick={modifierGroupOnClick}>
+                Choose
+              </ThemeButton>
+            );
+          }
+      }
+    }
+
+    return (
+      <React.Fragment>
+        <Header>{this.renderInfusionChoiceName()}</Header>
+        {currentInfusions >= maximumInfusions && (
+          <ThemeButton
+            size="small"
+            onClick={() => this.setState({ overrideMaximumInfusions: true })}
+            data-testid="override-infusion-limit"
+          >
+            Override Infusion Limit
+          </ThemeButton>
+        )}
+        <InfusionChoicePaneStep
+          header={itemHeaderNode}
+          onClick={
+            overrideMaximumInfusions || currentInfusions < maximumInfusions
+              ? itemOnClick
+              : undefined
+          }
+          extra={itemExtraNode}
+        >
+          {itemContentNode}
+        </InfusionChoicePaneStep>
+        {modifierGroupContentNode !== null && (
+          <InfusionChoicePaneStep
+            header={modifierGroupHeaderNode}
+            onClick={modifierGroupOnClick}
+            extra={modifierGroupExtraNode}
+          >
+            {modifierGroupContentNode}
+          </InfusionChoicePaneStep>
+        )}
+        {!isReadonly && this.renderActions()}
+        {this.renderDescription()}
+      </React.Fragment>
+    );
+  };
+
+  handleRemoveContainer = (item: Item): void => {
+    const { inventoryManager } = this.props;
+
+    inventoryManager.handleRemove({ item });
+  };
+
+  renderRemoveActions = (): React.ReactNode => {
+    const { infusionChoice } = this.state;
+
+    if (infusionChoice === null) {
+      return;
+    }
+
+    const infusion = InfusionChoiceUtils.getInfusion(infusionChoice);
+    if (!infusion) {
+      return null;
+    }
+    const infusionId = InfusionUtils.getId(infusion);
+    if (infusionId === null) {
+      return;
+    }
+
+    return (
+      <RemoveButton
+        size="medium"
+        style="filled"
+        onClick={this.handleInfusionRemove}
+        data-testid="remove-infusion-button"
+      >
+        Remove Infusion
+      </RemoveButton>
+    );
+  };
+
+  renderInfusedUi = (): React.ReactNode => {
+    const { infusionChoice } = this.state;
+    const { ruleData, creatureLookup, inventoryLookup, isReadonly, theme } =
+      this.props;
+
+    if (infusionChoice === null) {
+      return null;
+    }
+
+    const infusion = InfusionChoiceUtils.getInfusion(infusionChoice);
+    if (infusion === null) {
+      return null;
+    }
+
+    const inventoryMappingId = InfusionUtils.getInventoryMappingId(infusion);
+    const item = HelperUtils.lookupDataOrFallback(
+      inventoryLookup,
+      inventoryMappingId
+    );
+    const creatureMappingId = InfusionUtils.getCreatureMappingId(infusion);
+    let creature: Creature | null = null;
+    if (creatureMappingId !== null) {
+      creature = HelperUtils.lookupDataOrFallback(
+        creatureLookup,
+        creatureMappingId
+      );
+    }
+
+    return (
+      <React.Fragment>
+        <Header>{this.renderInfusionChoiceName()}</Header>
+        {item !== null && (
+          <InfusionChoicePaneStep
+            header="Infused Item"
+            onClick={this.handleInfusionItemClick}
+          >
+            <ItemPreview item={item} theme={theme} />
+          </InfusionChoicePaneStep>
+        )}
+        {creature !== null && (
+          <InfusionChoicePaneStep
+            header="Infused Creature"
+            onClick={this.handleInfusionCreatureClick}
+          >
+            <CreaturePreview creature={creature} ruleData={ruleData} />
+          </InfusionChoicePaneStep>
+        )}
+        {!isReadonly && (
+          <div className="ct-infusion-choice-pane__actions">
+            {this.renderRemoveActions()}
+          </div>
+        )}
+        {this.renderDescription()}
+      </React.Fragment>
+    );
+  };
+
+  renderLoadingUi = (): React.ReactNode => {
+    return (
+      <React.Fragment>
+        <Header>{this.renderInfusionChoiceName()}</Header>
+        <LoadingPlaceholder />
+        {this.renderDescription()}
+      </React.Fragment>
+    );
+  };
+
+  renderMarketplaceCta = (): React.ReactNode => {
+    const { infusionChoice } = this.state;
+    const { ruleData } = this.props;
+
+    if (infusionChoice === null) {
+      return null;
+    }
+
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return null;
+    }
+
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+      return null;
+    }
+
+    const sources = InfusionUtils.getSources(simulatedInfusion);
+
+    let sourceNames: Array<string> = [];
+    if (sources.length > 0) {
+      sources.forEach((sourceMapping) => {
+        let source = RuleDataUtils.getSourceDataInfo(
+          sourceMapping.sourceId,
+          ruleData
+        );
+
+        if (source !== null && source.description !== null) {
+          sourceNames.push(source.description);
+        }
+      });
+    }
+
+    const sourceName =
+      sourceNames.length > 0
+        ? FormatUtils.renderNonOxfordCommaList(sourceNames)
+        : null;
+
+    return (
+      <div className="ct-infusion-choice-pane__marketplace-cta">
+        <MarketplaceCta
+          showImage={false}
+          sourceName={sourceName}
+          description="To unlock this infusion, check out the Marketplace to view purchase options."
+        />
+      </div>
+    );
+  };
+
+  render() {
+    const { infusionChoice, needsItemStore, loadingStatus, uiView } =
+      this.state;
+
+    if (infusionChoice === null) {
+      return null;
+    }
+
+    let infusion = InfusionChoiceUtils.getInfusion(infusionChoice);
+
+    let contentNode: React.ReactNode;
+    if (needsItemStore && loadingStatus !== DataLoadingStatusEnum.LOADED) {
+      contentNode = this.renderLoadingUi();
+    } else if (infusion === null) {
+      switch (uiView) {
+        case UiViewEnum.CHOOSE_ITEM:
+          contentNode = this.renderUiChooseItem();
+          break;
+
+        case UiViewEnum.CHOOSE_MODIFIER_GROUP:
+          contentNode = this.renderUiChooseModifierGroup();
+          break;
+
+        case UiViewEnum.REVIEW:
+        default:
+          contentNode = this.renderUiReview();
+          break;
+      }
+    } else {
+      contentNode = this.renderInfusedUi();
+    }
+
+    const choiceKey = InfusionChoiceUtils.getKey(infusionChoice);
+    return (
+      <div
+        className="ct-infusion-choice-pane"
+        key={choiceKey === null ? "" : choiceKey}
+      >
+        {contentNode}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    infusionChoices: rulesEngineSelectors.getAvailableInfusionChoices(state),
+    inventory: rulesEngineSelectors.getInventory(state),
+    inventoryLookup: rulesEngineSelectors.getInventoryLookup(state),
+    containers: rulesEngineSelectors.getInventoryContainers(state),
+    creatureLookup: rulesEngineSelectors.getCreatureLookup(state),
+    globalModifiers: rulesEngineSelectors.getValidGlobalModifiers(state),
+    typeValueLookup: rulesEngineSelectors.getCharacterValueLookupByType(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    characterId: rulesEngineSelectors.getId(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    classes: rulesEngineSelectors.getClasses(state),
+  };
+}
+
+function InfusionChoicePaneContainer(props) {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  return (
+    <InfusionChoicePane
+      inventoryManager={inventoryManager}
+      paneHistoryPush={paneHistoryPush}
+      {...props}
+    />
+  );
+}
+
+export default connect(mapStateToProps)(InfusionChoicePaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneNewStore/InfusionChoicePaneNewStore.tsx b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneNewStore/InfusionChoicePaneNewStore.tsx
new file mode 100644
index 0000000..ed26b66
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneNewStore/InfusionChoicePaneNewStore.tsx
@@ -0,0 +1,6 @@
+import * as React from "react";
+
+import InfusionChoicePaneStore from "../InfusionChoicePaneStore";
+import withAvailableItems from "../withAvailableItems";
+
+export default withAvailableItems(InfusionChoicePaneStore);
diff --git a/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneNewStore/index.ts b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneNewStore/index.ts
new file mode 100644
index 0000000..dc5a969
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneNewStore/index.ts
@@ -0,0 +1,4 @@
+import InfusionChoicePaneNewStore from "./InfusionChoicePaneNewStore";
+
+export default InfusionChoicePaneNewStore;
+export { InfusionChoicePaneNewStore };
diff --git a/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStep/InfusionChoicePaneStep.tsx b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStep/InfusionChoicePaneStep.tsx
new file mode 100644
index 0000000..930d987
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStep/InfusionChoicePaneStep.tsx
@@ -0,0 +1,39 @@
+import * as React from "react";
+
+interface Props {
+  header: React.ReactNode;
+  extra?: React.ReactNode;
+  onClick?: () => void;
+}
+export class InfusionChoicePaneStep extends React.PureComponent<Props> {
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+
+      onClick();
+    }
+  };
+
+  render() {
+    const { header, extra, children } = this.props;
+
+    return (
+      <div className="ct-infusion-choice-pane__step" onClick={this.handleClick}>
+        <div className="ct-infusion-choice-pane__step-primary">
+          <div className="ct-infusion-choice-pane__step-header">{header}</div>
+          <div className="ct-infusion-choice-pane__step-content">
+            {children}
+          </div>
+        </div>
+        {extra && (
+          <div className="ct-infusion-choice-pane__step-extra">{extra}</div>
+        )}
+      </div>
+    );
+  }
+}
+
+export default InfusionChoicePaneStep;
diff --git a/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStep/index.ts b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStep/index.ts
new file mode 100644
index 0000000..d5e51a6
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStep/index.ts
@@ -0,0 +1,4 @@
+import InfusionChoicePaneStep from "./InfusionChoicePaneStep";
+
+export default InfusionChoicePaneStep;
+export { InfusionChoicePaneStep };
diff --git a/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStore/InfusionChoicePaneStore.tsx b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStore/InfusionChoicePaneStore.tsx
new file mode 100644
index 0000000..37ceaea
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStore/InfusionChoicePaneStore.tsx
@@ -0,0 +1,146 @@
+import { orderBy } from "lodash";
+import * as React from "react";
+
+import {
+  Collapsible,
+  CollapsibleHeaderContent,
+  LoadingPlaceholder,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  InfusionChoice,
+  InfusionChoiceUtils,
+  InfusionUtils,
+  Item,
+  ItemUtils,
+  KnownInfusionUtils,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemName } from "~/components/ItemName";
+
+import ItemDetail from "../../../../components/ItemDetail";
+import { ThemeButton } from "../../../../components/common/Button";
+import DataLoadingStatusEnum from "../../../../constants/DataLoadingStatusEnum";
+
+interface Props {
+  itemLoadingStatus: DataLoadingStatusEnum;
+  items: Array<Item>;
+  itemCanBeAddedLookup: Record<number, boolean>;
+  infusionChoice: InfusionChoice;
+  onItemSelected: (item: Item) => void;
+  ruleData: RuleData;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+}
+export class InfusionChoicePaneStore extends React.PureComponent<Props> {
+  static defaultProps = {
+    items: [],
+    itemLoadingStatus: DataLoadingStatusEnum.NOT_INITIALIZED,
+    itemCanBeAddedLookup: {},
+  };
+
+  renderLoading = (): React.ReactNode => {
+    return <LoadingPlaceholder />;
+  };
+
+  renderEmpty = (): React.ReactNode => {
+    return (
+      <div className="ct-infusion-choice-pane__inventory-empty">
+        There are no items that match the requirements for infusion.
+      </div>
+    );
+  };
+
+  render() {
+    const {
+      infusionChoice,
+      itemCanBeAddedLookup,
+      itemLoadingStatus,
+      items,
+      onItemSelected,
+      ruleData,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    if (
+      itemLoadingStatus !== DataLoadingStatusEnum.NOT_INITIALIZED &&
+      itemLoadingStatus !== DataLoadingStatusEnum.LOADED
+    ) {
+      return this.renderLoading();
+    }
+
+    const knownInfusion = InfusionChoiceUtils.getKnownInfusion(infusionChoice);
+    if (knownInfusion === null) {
+      return null;
+    }
+
+    const simulatedInfusion =
+      KnownInfusionUtils.getSimulatedInfusion(knownInfusion);
+    if (simulatedInfusion === null) {
+      return null;
+    }
+
+    const availableItems = InfusionUtils.filterAvailableItems(
+      items,
+      simulatedInfusion,
+      KnownInfusionUtils.getItemId(knownInfusion),
+      itemCanBeAddedLookup
+    );
+    const orderedItems = orderBy(availableItems, (item) =>
+      ItemUtils.getName(item)
+    );
+
+    if (!orderedItems.length) {
+      return this.renderEmpty();
+    }
+
+    return (
+      <div className="ct-infusion-choice-pane__inventory">
+        {orderedItems.map((item) => {
+          let headerNode = (
+            <CollapsibleHeaderContent
+              heading={<ItemName item={item} showLegacy={true} />}
+              callout={
+                <ThemeButton
+                  onClick={onItemSelected.bind(this, item)}
+                  size="small"
+                  data-testid={`infusion-choose-item-button-${ItemUtils.getName(
+                    item
+                  )}`
+                    .toLowerCase()
+                    .replace(/\s/g, "-")}
+                >
+                  Choose
+                </ThemeButton>
+              }
+            />
+          );
+
+          return (
+            <Collapsible
+              key={ItemUtils.getId(item)}
+              layoutType="minimal"
+              header={headerNode}
+              className="ct-infusion-choice-pane__item"
+            >
+              <ItemDetail
+                theme={theme}
+                item={item}
+                ruleData={ruleData}
+                showCustomize={false}
+                showActions={false}
+                showImage={false}
+                showAbilities={false}
+                proficiencyBonus={proficiencyBonus}
+              />
+            </Collapsible>
+          );
+        })}
+      </div>
+    );
+  }
+}
+
+export default InfusionChoicePaneStore;
diff --git a/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStore/index.ts b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStore/index.ts
new file mode 100644
index 0000000..11382d9
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/InfusionChoicePaneStore/index.ts
@@ -0,0 +1,4 @@
+import InfusionChoicePaneStore from "./InfusionChoicePaneStore";
+
+export default InfusionChoicePaneStore;
+export { InfusionChoicePaneStore };
diff --git a/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/index.ts
new file mode 100644
index 0000000..9c9019b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/index.ts
@@ -0,0 +1,14 @@
+import InfusionChoicePane from "./InfusionChoicePane";
+import InfusionChoicePaneNewStore from "./InfusionChoicePaneNewStore";
+import InfusionChoicePaneStep from "./InfusionChoicePaneStep";
+import InfusionChoicePaneStore from "./InfusionChoicePaneStore";
+import withAvailableItems from "./withAvailableItems";
+
+export default InfusionChoicePane;
+export {
+  InfusionChoicePane,
+  InfusionChoicePaneNewStore,
+  InfusionChoicePaneStep,
+  InfusionChoicePaneStore,
+  withAvailableItems,
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/withAvailableItems/withAvailableItems.tsx b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/withAvailableItems/withAvailableItems.tsx
new file mode 100644
index 0000000..89bde8e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/InfusionChoicePane/withAvailableItems/withAvailableItems.tsx
@@ -0,0 +1,126 @@
+import axios, { Canceler } from "axios";
+import * as React from "react";
+
+import {
+  CharacterTheme,
+  ContainerManager,
+  InfusionChoice,
+  InventoryManager,
+  Item,
+  ItemUtils,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import DataLoadingStatusEnum from "../../../../constants/DataLoadingStatusEnum";
+import { AppLoggerUtils } from "../../../../utils";
+
+function getDisplayName(WrappedComponent: React.ComponentType) {
+  return WrappedComponent.displayName || WrappedComponent.name || "Component";
+}
+
+export interface RequiredWithAvailableItemsProps {
+  inventoryManager: InventoryManager;
+  theme?: CharacterTheme;
+  infusionChoice: InfusionChoice;
+  onItemSelected: (item: Item) => void;
+  ruleData: RuleData;
+}
+interface State {
+  loadingStatus: DataLoadingStatusEnum;
+  availableItems: Array<Item>;
+}
+export function withAvailableItems<
+  C extends React.ComponentType<React.ComponentProps<C>>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent) {
+  return class withAvailableItems extends React.PureComponent<
+    ResolvedProps & RequiredWithAvailableItemsProps,
+    State
+  > {
+    static displayName = `withAvailableItems(${getDisplayName(
+      WrappedComponent
+    )})`;
+
+    loadAvailableItemsCanceler: null | Canceler = null;
+
+    constructor(props) {
+      super(props);
+
+      this.state = {
+        loadingStatus: DataLoadingStatusEnum.NOT_LOADED,
+        availableItems: [],
+      };
+    }
+
+    componentDidMount() {
+      const { loadingStatus } = this.state;
+      const { inventoryManager } = this.props;
+
+      if (loadingStatus === DataLoadingStatusEnum.NOT_LOADED) {
+        this.setState({
+          loadingStatus: DataLoadingStatusEnum.LOADING,
+        });
+
+        inventoryManager
+          .getInventoryShoppe({
+            onSuccess: (shoppeContainer: ContainerManager) => {
+              const storeItems = shoppeContainer
+                .getInventoryItems()
+                .items.map((item) => item.getItem());
+
+              this.setState({
+                availableItems: storeItems,
+                loadingStatus: DataLoadingStatusEnum.LOADED,
+              });
+            },
+            additionalApiConfig: {
+              cancelToken: new axios.CancelToken((c) => {
+                this.loadAvailableItemsCanceler = c;
+              }),
+            },
+          })
+          .then((res) => {
+            this.loadAvailableItemsCanceler = null;
+            return res;
+          })
+          .catch(AppLoggerUtils.handleAdhocApiError);
+      } else {
+        this.setState({
+          loadingStatus: DataLoadingStatusEnum.LOADED,
+        });
+      }
+    }
+
+    componentWillUnmount(): void {
+      if (this.loadAvailableItemsCanceler !== null) {
+        this.loadAvailableItemsCanceler();
+      }
+    }
+
+    render() {
+      const { loadingStatus, availableItems } = this.state;
+
+      let itemCanBeAddedLookup: Record<number, boolean> = availableItems.reduce(
+        (acc, item) => {
+          acc[ItemUtils.getId(item)] = ItemUtils.canBeAddedToInventory(item);
+          return acc;
+        },
+        {}
+      );
+
+      return (
+        <WrappedComponent
+          items={availableItems}
+          itemCanBeAddedLookup={itemCanBeAddedLookup}
+          itemLoadingStatus={loadingStatus}
+          {...(this.props as JSX.LibraryManagedAttributes<
+            C,
+            React.ComponentProps<C>
+          >)}
+        />
+      );
+    }
+  };
+}
+
+export default withAvailableItems;
diff --git a/ddb_main/tools/js/Shared/containers/panes/ItemPane/ItemPane.tsx b/ddb_main/tools/js/Shared/containers/panes/ItemPane/ItemPane.tsx
new file mode 100644
index 0000000..19456e1
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ItemPane/ItemPane.tsx
@@ -0,0 +1,291 @@
+import React, { useContext } from "react";
+import { connect } from "react-redux";
+
+import {
+  Action,
+  ActionUtils,
+  CharacterTheme,
+  Constants,
+  ContainerLookup,
+  DataOrigin,
+  EntityValueLookup,
+  HelperUtils,
+  Infusion,
+  InfusionChoiceLookup,
+  InfusionUtils,
+  InventoryManager,
+  Item,
+  ItemUtils,
+  PartyInfo,
+  RuleData,
+  rulesEngineSelectors,
+  serviceDataSelectors,
+  SnippetData,
+  Spell,
+  WeaponSpellDamageGroup,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { EditableName } from "~/components/EditableName";
+import { ItemName } from "~/components/ItemName";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Preview } from "~/subApps/sheet/components/Sidebar/components/Preview";
+import {
+  getDataOriginComponentInfo,
+  getSpellComponentInfo,
+} from "~/subApps/sheet/components/Sidebar/helpers/paneUtils";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersItem,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { PaneInitFailureContent } from "../../../../../../subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import ItemDetail from "../../../components/ItemDetail";
+import ItemListInformationCollapsible from "../../../components/ItemListInformationCollapsible";
+import { InventoryManagerContext } from "../../../managers/InventoryManagerContext";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+import { PaneIdentifierUtils } from "../../../utils";
+
+interface Props {
+  items: Array<Item>;
+  weaponSpellDamageGroups: Array<WeaponSpellDamageGroup>;
+  ruleData: RuleData;
+  snippetData: SnippetData;
+  entityValueLookup: EntityValueLookup;
+  infusionChoiceLookup: InfusionChoiceLookup;
+  identifiers: PaneIdentifiersItem | null;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  containerLookup: ContainerLookup;
+  inventoryManager: InventoryManager;
+  partyInfo: PartyInfo;
+  paneHistoryPush: PaneInfo["paneHistoryPush"];
+}
+interface State {
+  item: Item | null;
+  isCustomizeClosed: boolean;
+}
+class ItemPane extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = this.generateStateData(props, true);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { items, identifiers } = this.props;
+
+    if (items !== prevProps.items || identifiers !== prevProps.identifiers) {
+      this.setState(
+        this.generateStateData(this.props, prevState.isCustomizeClosed)
+      );
+    }
+  }
+
+  generateStateData = (props: Props, isCustomizeClosed: boolean): State => {
+    const { items, identifiers } = props;
+
+    let foundItem: Item | null | undefined = null;
+    if (identifiers !== null) {
+      foundItem = items.find(
+        (item) => identifiers.id === ItemUtils.getMappingId(item)
+      );
+    }
+
+    return {
+      item: foundItem ? foundItem : null,
+      isCustomizeClosed,
+    };
+  };
+
+  handleCustomItemEdit = (adjustments: Record<string, any>): void => {
+    const { item } = this.state;
+    const { inventoryManager } = this.props;
+
+    if (item === null) {
+      return;
+    }
+
+    if (adjustments.notes === "") {
+      adjustments.notes = null;
+    }
+
+    inventoryManager.handleCustomEdit({
+      item,
+      adjustments,
+    });
+  };
+
+  handleCustomDataUpdate = (
+    adjustmentType: Constants.AdjustmentTypeEnum,
+    value: any
+  ): void => {
+    const { item } = this.state;
+    const { inventoryManager } = this.props;
+
+    if (item) {
+      inventoryManager.handleCustomizationSet({
+        item,
+        adjustmentType,
+        value,
+      });
+    }
+  };
+
+  handleRemoveCustomizations = (): void => {
+    const { item } = this.state;
+    const { inventoryManager } = this.props;
+
+    if (item) {
+      inventoryManager.handleCustomizationsRemove({ item });
+    }
+  };
+
+  handleDataOriginClick = (dataOrigin: DataOrigin) => {
+    const { paneHistoryPush } = this.props;
+
+    let component = getDataOriginComponentInfo(dataOrigin);
+    if (component.type !== PaneComponentEnum.ERROR_404) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  handleSpellClick = (spell: Spell): void => {
+    const { paneHistoryPush } = this.props;
+
+    let component = getSpellComponentInfo(spell);
+    if (component.type) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  handleInfusionClick = (infusion: Infusion): void => {
+    const { paneHistoryPush } = this.props;
+
+    const choiceKey = InfusionUtils.getChoiceKey(infusion);
+    if (choiceKey !== null) {
+      paneHistoryPush(
+        PaneComponentEnum.INFUSION_CHOICE,
+        PaneIdentifierUtils.generateInfusionChoice(choiceKey)
+      );
+    }
+  };
+
+  handleActionClick = (action: Action): void => {
+    const { paneHistoryPush } = this.props;
+
+    const dataOrigin = ActionUtils.getDataOrigin(action);
+    let component = getDataOriginComponentInfo(dataOrigin);
+    if (component.type !== PaneComponentEnum.ERROR_404) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  handleOpenCustomize = () => {
+    this.setState({ isCustomizeClosed: !this.state.isCustomizeClosed });
+  };
+
+  render() {
+    const { item, isCustomizeClosed } = this.state;
+    const {
+      weaponSpellDamageGroups,
+      ruleData,
+      snippetData,
+      entityValueLookup,
+      infusionChoiceLookup,
+      isReadonly,
+      proficiencyBonus,
+      theme,
+      containerLookup,
+      inventoryManager,
+      partyInfo,
+    } = this.props;
+
+    if (item === null) {
+      return (
+        <PaneInitFailureContent errorMessage="That item is no longer in your inventory! Please try again." />
+      );
+    }
+
+    const canCustomize = inventoryManager.canCustomizeItem(item) && !isReadonly;
+
+    return (
+      <div className="ct-item-pane">
+        <Header preview={<Preview imageUrl={ItemUtils.getAvatarUrl(item)} />}>
+          <EditableName onClick={this.handleOpenCustomize}>
+            <ItemName item={item} />
+          </EditableName>
+        </Header>
+        <ItemListInformationCollapsible item={item} ruleData={ruleData} />
+        <ItemDetail
+          theme={theme}
+          key={ItemUtils.getUniqueKey(item)}
+          item={item}
+          weaponSpellDamageGroups={weaponSpellDamageGroups}
+          ruleData={ruleData}
+          snippetData={snippetData}
+          onCustomDataUpdate={this.handleCustomDataUpdate}
+          onCustomizationsRemove={this.handleRemoveCustomizations}
+          onDataOriginClick={this.handleDataOriginClick}
+          onSpellClick={this.handleSpellClick}
+          onInfusionClick={this.handleInfusionClick}
+          onMasteryActionClick={this.handleActionClick}
+          entityValueLookup={entityValueLookup}
+          infusionChoiceLookup={infusionChoiceLookup}
+          isReadonly={isReadonly}
+          proficiencyBonus={proficiencyBonus}
+          container={HelperUtils.lookupDataOrFallback(
+            containerLookup,
+            ItemUtils.getContainerDefinitionKey(item)
+          )}
+          showCustomize={canCustomize}
+          onPostRemoveNavigation={PaneComponentEnum.EQUIPMENT_MANAGE}
+          partyInfo={partyInfo}
+          onCustomItemEdit={this.handleCustomItemEdit}
+          isCustomizeClosed={isCustomizeClosed}
+          onCustomizeClick={this.handleOpenCustomize}
+        />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    items: rulesEngineSelectors.getAllInventoryItems(state),
+    weaponSpellDamageGroups:
+      rulesEngineSelectors.getWeaponSpellDamageGroups(state),
+    entityValueLookup:
+      rulesEngineSelectors.getCharacterValueLookupByEntity(state),
+    snippetData: rulesEngineSelectors.getSnippetData(state),
+    infusionChoiceLookup: rulesEngineSelectors.getInfusionChoiceLookup(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    containerLookup: rulesEngineSelectors.getContainerLookup(state),
+    partyInfo: serviceDataSelectors.getPartyInfo(state),
+  };
+}
+
+const ItemPaneContainer = (props) => {
+  const { inventoryManager } = useContext(InventoryManagerContext);
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  return (
+    <ItemPane
+      paneHistoryPush={paneHistoryPush}
+      inventoryManager={inventoryManager}
+      {...props}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(ItemPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/ItemPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/ItemPane/index.ts
new file mode 100644
index 0000000..86ef4e0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ItemPane/index.ts
@@ -0,0 +1,4 @@
+import ItemPane from "./ItemPane";
+
+export default ItemPane;
+export { ItemPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/LongRestPane/LongRestPane.tsx b/ddb_main/tools/js/Shared/containers/panes/LongRestPane/LongRestPane.tsx
new file mode 100644
index 0000000..04a10ea
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/LongRestPane/LongRestPane.tsx
@@ -0,0 +1,243 @@
+import axios, { Canceler } from "axios";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { Checkbox } from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterUtils,
+  ApiRequests,
+  rulesEngineSelectors,
+  characterActions,
+  Condition,
+  RuleData,
+  ShortModelInfoContract,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { RestoreLifeManager } from "~/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/RestoreLifeManager/RestoreLifeManager";
+
+import { toastMessageActions } from "../../../actions/toastMessage";
+import { ThemeButton } from "../../../components/common/Button";
+import { SharedAppState } from "../../../stores/typings";
+import { AppLoggerUtils } from "../../../utils";
+
+interface Props extends DispatchProp {
+  activeConditions: Array<Condition>;
+  ruleData: RuleData;
+  isDead: boolean;
+  theme: CharacterTheme;
+}
+interface State {
+  resetMaxHpModifier: boolean;
+  adjustConditionLevel: boolean;
+  restMessage: string | null;
+}
+class LongRestPane extends React.PureComponent<Props, State> {
+  loadMessageCanceler: null | Canceler = null;
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      resetMaxHpModifier: true,
+      adjustConditionLevel: false,
+      restMessage: null,
+    };
+  }
+
+  componentDidMount() {
+    this.loadMessage();
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadMessageCanceler !== null) {
+      this.loadMessageCanceler();
+    }
+  }
+
+  loadMessage = (): void => {
+    if (this.loadMessageCanceler !== null) {
+      this.loadMessageCanceler();
+    }
+
+    ApiRequests.getCharacterRestLong({
+      cancelToken: new axios.CancelToken((c) => {
+        this.loadMessageCanceler = c;
+      }),
+    })
+      .then((response) => {
+        let message = ApiAdapterUtils.getResponseData(response);
+        if (message !== null) {
+          this.setState({
+            restMessage: message,
+          });
+        }
+        this.loadMessageCanceler = null;
+      })
+      .catch(AppLoggerUtils.handleAdhocApiError);
+  };
+
+  reset = (): void => {
+    this.setState({
+      resetMaxHpModifier: true,
+    });
+  };
+
+  handleReset = (): void => {
+    this.setState({
+      resetMaxHpModifier: true,
+      adjustConditionLevel: false,
+    });
+  };
+
+  handleSave = (): void => {
+    const { resetMaxHpModifier, adjustConditionLevel } = this.state;
+    const { dispatch } = this.props;
+
+    dispatch(
+      characterActions.longRest(resetMaxHpModifier, adjustConditionLevel)
+    );
+    dispatch(
+      toastMessageActions.toastSuccess(
+        "Long Rest Taken",
+        "You have completed a long rest. Relevant abilities have been reset."
+      )
+    );
+  };
+
+  handleResetMaxHpChange = (enabled: boolean): void => {
+    this.setState({
+      resetMaxHpModifier: enabled,
+    });
+  };
+
+  handleAdjustExhaustionLevel = (enabled: boolean): void => {
+    this.setState({
+      adjustConditionLevel: enabled,
+    });
+  };
+
+  handleRestoreToLife = (restoreType: ShortModelInfoContract): void => {
+    const { dispatch } = this.props;
+    const restoreChoice = restoreType.name === "Full" ? "full" : "1";
+
+    dispatch(characterActions.restoreLife(restoreType.id));
+    dispatch(
+      toastMessageActions.toastSuccess(
+        "Character Restored to Life",
+        `You have been restored to life with ${restoreChoice} HP.`
+      )
+    );
+  };
+
+  renderRecover = (): React.ReactNode => {
+    const { resetMaxHpModifier, adjustConditionLevel, restMessage } =
+      this.state;
+
+    const { isDead, activeConditions } = this.props;
+
+    if (isDead) {
+      return (
+        <div className="ct-reset-pane__recover-sources">
+          Your character is dead
+        </div>
+      );
+    }
+    const exhaustionIsActive = activeConditions.find(
+      (condition) => condition.level !== null
+    );
+
+    return (
+      <React.Fragment>
+        <div className="ct-reset-pane__recover-sources">
+          {restMessage === null
+            ? "Asking the server what will be reset..."
+            : restMessage}
+        </div>
+        <div className="ct-reset-pane__recover-max-hp">
+          <Checkbox
+            label="Reset Maximum HP changes during this rest"
+            initiallyEnabled={resetMaxHpModifier}
+            onChange={this.handleResetMaxHpChange}
+          />
+        </div>
+        {exhaustionIsActive && (
+          <div className="ct-reset-pane__reset-exhaustion-level">
+            <Checkbox
+              label="Recover 1 Level of Exhaustion during this rest (requires food and drink)"
+              initiallyEnabled={adjustConditionLevel}
+              onChange={this.handleAdjustExhaustionLevel}
+            />
+          </div>
+        )}
+      </React.Fragment>
+    );
+  };
+
+  renderActions = (): React.ReactNode => {
+    const { isDead, ruleData, theme } = this.props;
+
+    if (isDead) {
+      return (
+        <React.Fragment>
+          <RestoreLifeManager onSave={this.handleRestoreToLife} />
+        </React.Fragment>
+      );
+    }
+
+    return (
+      <div className="ct-reset-pane__actions">
+        <div className="ct-reset-pane__action">
+          <ThemeButton onClick={this.handleSave} enableConfirm={true}>
+            Take Long Rest
+          </ThemeButton>
+        </div>
+        <div className="ct-reset-pane__action">
+          <ThemeButton onClick={this.handleReset} style="outline">
+            Reset
+          </ThemeButton>
+        </div>
+      </div>
+    );
+  };
+
+  render() {
+    return (
+      <div className="ct-reset-pane">
+        <Header>Long Rest</Header>
+
+        <div className="ct-reset-pane__intro">
+          <p>
+            A long rest is a period of extended downtime, at least 8 hours long,
+            during which a character sleeps for at least 6 hours and performs no
+            more than 2 hours of light activity, such as reading, talking,
+            eating, or standing watch.
+          </p>
+          <p>
+            If the rest is interrupted by a period of strenuous activity — at
+            least 1 hour of walking, fighting, casting spells, or similar
+            adventuring activity — the characters must begin the rest again to
+            gain any benefit from it.
+          </p>
+        </div>
+        <div className="ct-reset-pane__recover">
+          <div className="ct-reset-pane__recover-heading">Recover</div>
+          {this.renderRecover()}
+        </div>
+        {this.renderActions()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    activeConditions: rulesEngineSelectors.getActiveConditions(state),
+    isDead: rulesEngineSelectors.isDead(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+export default connect(mapStateToProps)(LongRestPane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/LongRestPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/LongRestPane/index.ts
new file mode 100644
index 0000000..d02e322
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/LongRestPane/index.ts
@@ -0,0 +1,4 @@
+import LongRestPane from "./LongRestPane";
+
+export default LongRestPane;
+export { LongRestPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/NoteManagePane/NoteManagePane.tsx b/ddb_main/tools/js/Shared/containers/panes/NoteManagePane/NoteManagePane.tsx
new file mode 100644
index 0000000..79419c1
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/NoteManagePane/NoteManagePane.tsx
@@ -0,0 +1,240 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  characterActions,
+  Constants,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  CharacterNotes,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Textarea } from "~/components/Textarea";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { PaneIdentifiersNote } from "~/subApps/sheet/components/Sidebar/types";
+
+import { PaneInitFailureContent } from "../../../../../../subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import { ThemeButton } from "../../../components/common/Button";
+import { SharedAppState } from "../../../stores/typings";
+
+interface Props extends DispatchProp {
+  notes: CharacterNotes;
+  placeholder: string;
+  autoSaveDelay: number;
+  identifiers: PaneIdentifiersNote | null;
+}
+interface StateData {
+  noteType: string | null;
+}
+interface State extends StateData {
+  hasBeenEdited: boolean;
+  isSaveDirty: boolean;
+}
+class NoteManagePane extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    placeholder: "Enter any notes here!",
+    autoSaveDelay: 5000,
+  };
+
+  autoSaveTimeoutId: number | null = null;
+  textareaInput = React.createRef<HTMLDivElement>();
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      ...this.generateStateData(props),
+      hasBeenEdited: false,
+      isSaveDirty: false,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { identifiers } = this.props;
+
+    if (identifiers !== prevProps.identifiers) {
+      this.setState({
+        ...this.generateStateData(this.props),
+        hasBeenEdited: false,
+        isSaveDirty: false,
+      });
+    }
+  }
+
+  generateStateData = (props: Props): StateData => {
+    const { identifiers } = props;
+
+    return {
+      noteType: identifiers !== null ? identifiers.noteType : null,
+    };
+  };
+
+  componentDidMount() {
+    if (this.textareaInput.current) {
+      this.textareaInput.current.focus();
+    }
+  }
+
+  componentWillUnmount() {
+    const { dispatch } = this.props;
+    const { isSaveDirty, noteType } = this.state;
+
+    this.handleStopAutoSaveTimer();
+
+    if (noteType !== null && isSaveDirty && this.textareaInput.current) {
+      dispatch(
+        characterActions.noteSet(
+          noteType,
+          this.textareaInput.current?.dataset.value || ""
+        )
+      );
+    }
+  }
+
+  startAutoSaveTimer = (): void => {
+    const { autoSaveDelay } = this.props;
+
+    if (this.autoSaveTimeoutId === null) {
+      this.autoSaveTimeoutId = window.setTimeout(() => {
+        this.handleSave();
+      }, autoSaveDelay);
+    }
+  };
+
+  handleStopAutoSaveTimer = (): void => {
+    if (this.autoSaveTimeoutId !== null) {
+      clearTimeout(this.autoSaveTimeoutId);
+      this.autoSaveTimeoutId = null;
+    }
+  };
+
+  handleSave = (): void => {
+    const { dispatch } = this.props;
+    const { noteType } = this.state;
+
+    if (noteType !== null && this.textareaInput.current) {
+      dispatch(
+        characterActions.noteSet(
+          noteType,
+          this.textareaInput.current?.dataset.value || ""
+        )
+      );
+    }
+
+    this.handleStopAutoSaveTimer();
+    this.setState({
+      isSaveDirty: false,
+    });
+  };
+
+  handleInputKeyUp = (): void => {
+    const { isSaveDirty } = this.state;
+
+    if (!isSaveDirty) {
+      this.setState(
+        {
+          isSaveDirty: true,
+          hasBeenEdited: true,
+        },
+        this.startAutoSaveTimer
+      );
+    }
+  };
+
+  handleInputBlur = (text: string): void => {
+    this.handleSave();
+  };
+
+  getNoteHelpText = (): string => {
+    const { noteType } = this.state;
+
+    let text = "";
+    switch (noteType) {
+      case Constants.NoteKeyEnum.ORGANIZATIONS:
+        text =
+          "Are there any important organizations your character belongs to? Any societies, orders, cults, or agencies?";
+        break;
+      case Constants.NoteKeyEnum.ALLIES:
+        text =
+          "With whom does your character associate? When in need of aid, do they seek out their kinfolk, followers of their deity, or other members of their order? What groups or individuals are they aligned with?";
+        break;
+      case Constants.NoteKeyEnum.ENEMIES:
+        text =
+          "Who does your character fear or fight? Have they sworn a vow to rid the world of undead? Is there an order or organization they are opposed to? Are there any specific foes from their past?";
+        break;
+      case Constants.NoteKeyEnum.BACKSTORY:
+        text =
+          "Talk about your character's origins. Where are they from? How did they end up adventuring? How did they choose their class?";
+        break;
+      case Constants.NoteKeyEnum.OTHER:
+        text = "Anything at all you'd like to mention about your character.";
+        break;
+      default:
+    }
+
+    return text;
+  };
+
+  render() {
+    const { isSaveDirty, hasBeenEdited, noteType } = this.state;
+    const { notes, placeholder } = this.props;
+
+    if (noteType === null) {
+      return <PaneInitFailureContent />;
+    }
+
+    let content: string | null = notes[noteType] ? notes[noteType] : "";
+
+    let calloutNode: React.ReactNode;
+    if (hasBeenEdited) {
+      if (isSaveDirty) {
+        calloutNode = (
+          <React.Fragment>
+            <div className="ct-note-manage-pane__status ct-note-manage-pane__status--dirty">
+              <div className="ct-note-manage-pane__status-text">
+                Unsaved changes
+              </div>
+            </div>
+            <ThemeButton size="small" onClick={this.handleSave}>
+              Save
+            </ThemeButton>
+          </React.Fragment>
+        );
+      } else {
+        calloutNode = (
+          <div className="ct-note-manage-pane__status ct-note-manage-pane__status--clean">
+            <div className="ct-note-manage-pane__status-icon" />
+            <div className="ct-note-manage-pane__status-text">Saved</div>
+          </div>
+        );
+      }
+    }
+
+    return (
+      <div className="ct-note-manage-pane">
+        <Header callout={calloutNode}>
+          {RuleDataUtils.getNoteKeyName(noteType as Constants.NoteKeyEnum)}
+        </Header>
+        <Textarea
+          ref={this.textareaInput}
+          placeholder={placeholder}
+          value={content === null ? "" : content}
+          onInputKeyUp={this.handleInputKeyUp}
+          onInputBlur={this.handleInputBlur}
+        />
+        <p className="ct-note-manage-pane__text">{this.getNoteHelpText()}</p>
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    notes: rulesEngineSelectors.getCharacterNotes(state),
+  };
+}
+
+export default connect(mapStateToProps)(NoteManagePane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/NoteManagePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/NoteManagePane/index.ts
new file mode 100644
index 0000000..6617c17
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/NoteManagePane/index.ts
@@ -0,0 +1,4 @@
+import NoteManagePane from "./NoteManagePane";
+
+export default NoteManagePane;
+export { NoteManagePane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesHitPointConfirmPane/PreferencesHitPointConfirmPane.tsx b/ddb_main/tools/js/Shared/containers/panes/PreferencesHitPointConfirmPane/PreferencesHitPointConfirmPane.tsx
new file mode 100644
index 0000000..413ebc7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesHitPointConfirmPane/PreferencesHitPointConfirmPane.tsx
@@ -0,0 +1,101 @@
+import React, { FC } from "react";
+import { useDispatch } from "react-redux";
+
+import {
+  Constants,
+  characterActions,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Button } from "~/components/Button";
+import { useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { PaneInitFailureContent } from "~/subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersPreferenceHitPointConfirm,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+interface Props {
+  identifiers: PaneIdentifiersPreferenceHitPointConfirm | null;
+}
+
+export const PreferencesHitPointConfirmPane: FC<Props> = ({ identifiers }) => {
+  const dispatch = useDispatch();
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const hitPointType = identifiers?.id ?? null;
+
+  const handleConfirm = (): void => {
+    dispatch(characterActions.preferenceChoose("hitPointType", hitPointType));
+    paneHistoryStart(PaneComponentEnum.PREFERENCES);
+  };
+
+  const handleCancel = (): void => {
+    paneHistoryStart(PaneComponentEnum.PREFERENCES);
+  };
+
+  const renderContent = (): React.ReactNode => {
+    switch (hitPointType) {
+      case Constants.PreferenceHitPointTypeEnum.FIXED:
+        return (
+          <React.Fragment>
+            <Header>Fixed Hit Points</Header>
+            <div className="change-preference-content">
+              <p>
+                Are you sure you want to change your hit points to the fixed
+                value?
+              </p>
+              <p>Any rolled hit point totals will be lost.</p>
+            </div>
+          </React.Fragment>
+        );
+
+      case Constants.PreferenceHitPointTypeEnum.MANUAL:
+        return (
+          <React.Fragment>
+            <Header>Manual Hit Points</Header>
+            <div className="change-preference-content">
+              <p>
+                Are you sure you want to change your hit points to manual entry?
+              </p>
+              <p>
+                After doing so, use Manage HP in the Class section to enter your
+                rolled values.
+              </p>
+            </div>
+          </React.Fragment>
+        );
+    }
+
+    return null;
+  };
+
+  if (hitPointType === null) {
+    return <PaneInitFailureContent />;
+  }
+
+  return (
+    <div className="ct-preferences-pane">
+      {renderContent()}
+      <div className="ct-preferences-pane__actions">
+        <div className="ct-preferences-pane__action">
+          <Button sizes="solid" size="x-small" themed onClick={handleConfirm}>
+            Accept
+          </Button>
+        </div>
+        <div className="ct-preferences-pane__action">
+          <Button
+            variant="outline"
+            size="x-small"
+            themed
+            onClick={handleCancel}
+          >
+            Cancel
+          </Button>
+        </div>
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesOptionalClassFeaturesConfirmPane/PreferencesOptionalClassFeaturesConfirmPane.tsx b/ddb_main/tools/js/Shared/containers/panes/PreferencesOptionalClassFeaturesConfirmPane/PreferencesOptionalClassFeaturesConfirmPane.tsx
new file mode 100644
index 0000000..13215a1
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesOptionalClassFeaturesConfirmPane/PreferencesOptionalClassFeaturesConfirmPane.tsx
@@ -0,0 +1,159 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  characterActions,
+  rulesEngineSelectors,
+  ClassSpellListSpellsLookup,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Button } from "~/components/Button";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersPreferenceOptionalClassFeaturesConfirm,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { SimpleClassSpellList } from "../../../components/SimpleClassSpellList";
+import { SharedAppState } from "../../../stores/typings";
+
+interface Props extends DispatchProp {
+  identifiers: PaneIdentifiersPreferenceOptionalClassFeaturesConfirm | null;
+  classSpellListSpellsLookup: ClassSpellListSpellsLookup;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+interface State {
+  spellListIds: Array<number>;
+  newIsEnabled: boolean;
+}
+class PreferencesOptionalClassFeaturesConfirmPane extends React.PureComponent<
+  Props,
+  State
+> {
+  constructor(props) {
+    super(props);
+
+    this.state = this.generateStateData(props);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { identifiers } = this.props;
+
+    if (identifiers !== prevProps.identifiers) {
+      this.setState(this.generateStateData(this.props));
+    }
+  }
+
+  generateStateData = (props: Props): State => {
+    const { identifiers } = props;
+
+    return {
+      spellListIds: identifiers?.spellListIds ?? [],
+      newIsEnabled: identifiers?.newIsEnabled ?? false,
+    };
+  };
+
+  handleConfirm = (): void => {
+    const { newIsEnabled } = this.state;
+    const { dispatch, paneHistoryStart } = this.props;
+
+    dispatch(
+      characterActions.preferenceChoose(
+        "enableOptionalClassFeatures",
+        newIsEnabled
+      )
+    );
+    paneHistoryStart(PaneComponentEnum.PREFERENCES);
+  };
+
+  handleCancel = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.PREFERENCES);
+  };
+
+  renderContent = (): React.ReactNode => {
+    const { spellListIds, newIsEnabled } = this.state;
+    const { classSpellListSpellsLookup } = this.props;
+
+    return (
+      <React.Fragment>
+        <Header>
+          {newIsEnabled ? "Enable" : "Disable"} Optional Class Features
+        </Header>
+        <div className="change-preference-content">
+          <p>
+            Are you sure you want to {newIsEnabled ? "enable" : "disable"}{" "}
+            <strong>Optional Class Features</strong> for this character?
+          </p>
+          <p>
+            After doing so, the following spells provided by these features will
+            be removed from your character:
+          </p>
+          <SimpleClassSpellList
+            spellListIds={spellListIds}
+            classSpellListSpellsLookup={classSpellListSpellsLookup}
+          />
+        </div>
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    return (
+      <div className="ct-preferences-pane">
+        {this.renderContent()}
+        <div className="ct-preferences-pane__actions">
+          <div className="ct-preferences-pane__action">
+            <Button
+              sizes="solid"
+              size="x-small"
+              themed
+              onClick={this.handleConfirm}
+            >
+              Accept
+            </Button>
+          </div>
+          <div className="ct-preferences-pane__action">
+            <Button
+              variant="outline"
+              size="x-small"
+              themed
+              onClick={this.handleCancel}
+            >
+              Cancel
+            </Button>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    classSpellListSpellsLookup:
+      rulesEngineSelectors.getClassSpellListSpellsLookup(state),
+  };
+}
+
+const PreferencesOptionalClassFeaturesConfirmPaneContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  return (
+    <PreferencesOptionalClassFeaturesConfirmPane
+      {...props}
+      paneHistoryStart={paneHistoryStart}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(
+  PreferencesOptionalClassFeaturesConfirmPaneContainer
+);
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesOptionalOriginsConfirmPane/PreferencesOptionalOriginsConfirmPane.tsx b/ddb_main/tools/js/Shared/containers/panes/PreferencesOptionalOriginsConfirmPane/PreferencesOptionalOriginsConfirmPane.tsx
new file mode 100644
index 0000000..d38a24e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesOptionalOriginsConfirmPane/PreferencesOptionalOriginsConfirmPane.tsx
@@ -0,0 +1,155 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  characterActions,
+  rulesEngineSelectors,
+  ClassSpellListSpellsLookup,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Button } from "~/components/Button";
+import { PaneInfo, useSidebar } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersPreferenceOptionalOriginsConfirm,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { SimpleClassSpellList } from "../../../components/SimpleClassSpellList";
+import { SharedAppState } from "../../../stores/typings";
+
+interface Props extends DispatchProp {
+  identifiers: PaneIdentifiersPreferenceOptionalOriginsConfirm | null;
+  classSpellListSpellsLookup: ClassSpellListSpellsLookup;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+interface State {
+  spellListIds: Array<number>;
+  newIsEnabled: boolean;
+}
+class PreferencesOptionalOriginsConfirmPane extends React.PureComponent<
+  Props,
+  State
+> {
+  constructor(props) {
+    super(props);
+
+    this.state = this.generateStateData(props);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { identifiers } = this.props;
+
+    if (identifiers !== prevProps.identifiers) {
+      this.setState(this.generateStateData(this.props));
+    }
+  }
+
+  generateStateData = (props: Props): State => {
+    const { identifiers } = props;
+
+    return {
+      spellListIds: identifiers?.spellListIds ?? [],
+      newIsEnabled: identifiers?.newIsEnabled ?? false,
+    };
+  };
+
+  handleConfirm = (): void => {
+    const { newIsEnabled } = this.state;
+    const { dispatch, paneHistoryStart } = this.props;
+
+    dispatch(
+      characterActions.preferenceChoose("enableOptionalOrigins", newIsEnabled)
+    );
+    paneHistoryStart(PaneComponentEnum.PREFERENCES);
+  };
+
+  handleCancel = (): void => {
+    const { paneHistoryStart } = this.props;
+    paneHistoryStart(PaneComponentEnum.PREFERENCES);
+  };
+
+  renderContent = (): React.ReactNode => {
+    const { spellListIds, newIsEnabled } = this.state;
+    const { classSpellListSpellsLookup } = this.props;
+
+    return (
+      <React.Fragment>
+        <Header>
+          {newIsEnabled ? "Enable" : "Disable"} Customized Origins
+        </Header>
+        <div className="change-preference-content">
+          <p>
+            Are you sure you want to {newIsEnabled ? "enable" : "disable"}{" "}
+            <strong>Customized Origins</strong> for this character?
+          </p>
+          <p>
+            After doing so, the following spells provided by these features will
+            be removed from your character:
+          </p>
+          <SimpleClassSpellList
+            spellListIds={spellListIds}
+            classSpellListSpellsLookup={classSpellListSpellsLookup}
+          />
+        </div>
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    return (
+      <div className="ct-preferences-pane">
+        {this.renderContent()}
+        <div className="ct-preferences-pane__actions">
+          <div className="ct-preferences-pane__action">
+            <Button
+              sizes="solid"
+              size="x-small"
+              themed
+              onClick={this.handleConfirm}
+            >
+              Accept
+            </Button>
+          </div>
+          <div className="ct-preferences-pane__action">
+            <Button
+              variant="outline"
+              size="x-small"
+              themed
+              onClick={this.handleCancel}
+            >
+              Cancel
+            </Button>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    classSpellListSpellsLookup:
+      rulesEngineSelectors.getClassSpellListSpellsLookup(state),
+  };
+}
+
+const PreferencesOptionalOriginsConfirmPaneContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  return (
+    <PreferencesOptionalOriginsConfirmPane
+      {...props}
+      paneHistoryStart={paneHistoryStart}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(
+  PreferencesOptionalOriginsConfirmPaneContainer
+);
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPane.tsx b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPane.tsx
new file mode 100644
index 0000000..1c9b765
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPane.tsx
@@ -0,0 +1,562 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { PrivacyTypeRadio } from "@dndbeyond/character-components/es";
+import {
+  AnySimpleDataType,
+  characterActions,
+  CharacterPreferences,
+  CharacterTheme,
+  CharacterUtils,
+  CharClass,
+  ClassSpellListSpellsLookup,
+  ClassUtils,
+  Constants,
+  DataOriginRefData,
+  HelperUtils,
+  HtmlSelectOption,
+  Race,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  RaceUtils,
+} from "@dndbeyond/character-rules-engine/es";
+import { Dice } from "@dndbeyond/dice";
+
+import { SourceCategoryDescription } from "~/constants";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import config from "../../../../config";
+import { appEnvActions } from "../../../actions";
+import {
+  CheckboxInfo,
+  FormCheckBoxesField,
+} from "../../../components/common/FormCheckBoxesField";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+import { PaneIdentifierUtils } from "../../../utils";
+import PreferencesPaneSelectField from "./PreferencesPaneSelectField";
+import { ToggleInfo } from "./PreferencesPaneTogglesField";
+
+interface Props extends DispatchProp {
+  activeSourceCategories: Array<number>;
+  preferences: CharacterPreferences;
+  ruleData: RuleData;
+  diceEnabled: boolean;
+  classes: Array<CharClass>;
+  species: Race | null;
+  dataOriginRefData: DataOriginRefData;
+  classSpellListSpellsLookup: ClassSpellListSpellsLookup;
+  characterTheme: CharacterTheme;
+  paneHistoryStart: PaneInfo["paneHistoryStart"];
+}
+class PreferencesPane extends React.PureComponent<Props> {
+  static defaultProps = {
+    diceEnabled: false,
+  };
+
+  handlePreferenceChange = (
+    prefKey: string,
+    value: AnySimpleDataType
+  ): void => {
+    const { dispatch } = this.props;
+    const typedPrefKey = CharacterUtils.getPreferenceKey(prefKey);
+    if (typedPrefKey !== null) {
+      dispatch(characterActions.preferenceChoose(typedPrefKey, value));
+    }
+  };
+
+  handleIntPreferenceChange = (prefKey: string, value: number | null): void => {
+    const { dispatch } = this.props;
+    const typedPrefKey = CharacterUtils.getPreferenceKey(prefKey);
+    if (typedPrefKey !== null) {
+      dispatch(characterActions.preferenceChoose(typedPrefKey, value));
+    }
+  };
+
+  handleSourceCategoryChange = (sourceId: number, isActive: boolean): void => {
+    const { dispatch, activeSourceCategories } = this.props;
+    let newSourceCats: Array<number> = [];
+    if (isActive) {
+      newSourceCats = [...activeSourceCategories, sourceId];
+    } else {
+      newSourceCats = activeSourceCategories.filter((id) => id !== sourceId);
+    }
+
+    dispatch(characterActions.activeSourceCategoriesSet(newSourceCats));
+  };
+
+  handleOptionalClassFeaturesPreferenceChangePromise = (
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { paneHistoryStart, classes, classSpellListSpellsLookup } =
+      this.props;
+    const spellListIds: Array<number> =
+      ClassUtils.getUpdateEnableOptionalClassFeaturesSpellListIdsToRemove(
+        classes,
+        newIsEnabled
+      );
+
+    const hasSpellsToRemove = spellListIds.some((id) =>
+      classSpellListSpellsLookup.hasOwnProperty(id)
+    );
+
+    if (!hasSpellsToRemove) {
+      this.handlePreferenceChange("enableOptionalClassFeatures", newIsEnabled);
+      accept();
+    } else {
+      paneHistoryStart(
+        PaneComponentEnum.PREFERENCES_OPTIONAL_CLASS_FEATURES_CONFIRM,
+        PaneIdentifierUtils.generatePreferenceOptionalClassFeaturesConfirm(
+          spellListIds,
+          newIsEnabled
+        )
+      );
+      reject();
+    }
+  };
+
+  handleOptionalOriginsPreferenceChangePromise = (
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { paneHistoryStart, species, classSpellListSpellsLookup } =
+      this.props;
+
+    if (!species) {
+      this.handlePreferenceChange("enableOptionalOrigins", newIsEnabled);
+      accept();
+
+      return;
+    }
+
+    const spellListIds: Array<number> =
+      RaceUtils.getUpdateEnableOptionalOriginsSpellListIdsToRemove(
+        species,
+        newIsEnabled
+      );
+
+    const hasSpellsToRemove = spellListIds.some((id) =>
+      classSpellListSpellsLookup.hasOwnProperty(id)
+    );
+
+    if (!hasSpellsToRemove) {
+      this.handlePreferenceChange("enableOptionalOrigins", newIsEnabled);
+      accept();
+    } else {
+      paneHistoryStart(
+        PaneComponentEnum.PREFERENCES_OPTIONAL_ORIGINS_CONFIRM,
+        PaneIdentifierUtils.generatePreferenceOptionalOriginsConfirm(
+          spellListIds,
+          newIsEnabled
+        )
+      );
+      reject();
+    }
+  };
+
+  handleProgressionPreferenceChangePromise = (
+    newId: string,
+    oldId: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { paneHistoryStart } = this.props;
+
+    const newIdValue = HelperUtils.parseInputInt(newId);
+
+    if (newIdValue !== null) {
+      paneHistoryStart(
+        PaneComponentEnum.PREFERENCES_PROGRESSION_CONFIRM,
+        PaneIdentifierUtils.generatePreferenceProgressionConfirm(newIdValue)
+      );
+    }
+
+    reject();
+  };
+
+  handleHitPointPreferenceChangePromise = (
+    newId: string,
+    oldId: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { paneHistoryStart } = this.props;
+
+    const newIdValue = HelperUtils.parseInputInt(newId);
+
+    if (newIdValue !== null) {
+      paneHistoryStart(
+        PaneComponentEnum.PREFERENCES_HIT_POINT_CONFIRM,
+        PaneIdentifierUtils.generatePreferenceHitPointConfirm(newIdValue)
+      );
+    }
+
+    reject();
+  };
+
+  handleDiceToggle = (): void => {
+    const { dispatch, diceEnabled } = this.props;
+
+    const newDiceEnabledSetting: boolean = !diceEnabled;
+
+    try {
+      localStorage.setItem("dice-enabled", newDiceEnabledSetting.toString());
+      Dice.setEnabled(newDiceEnabledSetting);
+    } catch (e) {}
+
+    dispatch(
+      appEnvActions.dataSet({
+        diceEnabled: newDiceEnabledSetting,
+      })
+    );
+  };
+
+  handleChangePrivacy = (value: number | null): void => {
+    const typedPrefKey = CharacterUtils.getPreferenceKey("privacyType");
+    if (typedPrefKey !== null) {
+      this.props.dispatch(
+        characterActions.preferenceChoose(typedPrefKey, value)
+      );
+    }
+  };
+
+  render() {
+    const { preferences, activeSourceCategories, ruleData, diceEnabled } =
+      this.props;
+
+    const {
+      useHomebrewContent,
+      encumbranceType,
+      hitPointType,
+      progressionType,
+      abilityScoreDisplayType,
+      sharingType,
+      privacyType,
+      ignoreCoinWeight,
+      enforceFeatRules,
+      enforceMulticlassRules,
+      showScaledSpells,
+      enableOptionalClassFeatures,
+      enableOptionalOrigins,
+      enableDarkMode,
+    } = preferences;
+    const sourceCategories = RuleDataUtils.getSourceCategories(ruleData);
+
+    const encumbranceOptions: Array<HtmlSelectOption> = [
+      {
+        label: "Use Encumbrance",
+        value: Constants.PreferenceEncumbranceTypeEnum.ENCUMBRANCE,
+      },
+      {
+        label: "No Encumbrance",
+        value: Constants.PreferenceEncumbranceTypeEnum.NONE,
+      },
+      {
+        label: "Variant Encumbrance",
+        value: Constants.PreferenceEncumbranceTypeEnum.VARIANT,
+      },
+    ];
+
+    const hpOptions: Array<HtmlSelectOption> = [
+      { label: "Fixed", value: Constants.PreferenceHitPointTypeEnum.FIXED },
+      { label: "Manual", value: Constants.PreferenceHitPointTypeEnum.MANUAL },
+    ];
+
+    const advancementOptions: Array<HtmlSelectOption> = [
+      {
+        label: "Milestone",
+        value: Constants.PreferenceProgressionTypeEnum.MILESTONE,
+      },
+      { label: "XP", value: Constants.PreferenceProgressionTypeEnum.XP },
+    ];
+
+    const abilityDisplayOptions: Array<HtmlSelectOption> = [
+      {
+        label: "Modifiers Top",
+        value: Constants.PreferenceAbilityScoreDisplayTypeEnum.MODIFIERS_TOP,
+      },
+      {
+        label: "Scores Top",
+        value: Constants.PreferenceAbilityScoreDisplayTypeEnum.SCORES_TOP,
+      },
+    ];
+
+    const sharingOptions: Array<HtmlSelectOption> = [
+      { label: "Full", value: Constants.PreferenceSharingTypeEnum.FULL },
+      { label: "Limited", value: Constants.PreferenceSharingTypeEnum.LIMITED },
+      // {label: 'Stat Block', value: Constants.PreferenceSharingTypeEnum.STAT_BLOCK},
+    ];
+
+    let sourceToggles: Array<CheckboxInfo> = [];
+    let partneredSourceToggles: Array<CheckboxInfo> = [];
+
+    sourceCategories.forEach((sourceCategory) => {
+      if (!sourceCategory.isToggleable) {
+        return null;
+      }
+
+      const toggle: ToggleInfo = {
+        label: `${sourceCategory.name}`,
+        initiallyEnabled: activeSourceCategories.includes(sourceCategory.id),
+        onChange: this.handleSourceCategoryChange.bind(this, sourceCategory.id),
+        sortOrder: sourceCategory.sortOrder,
+      };
+
+      if (sourceCategory.isPartneredContent) {
+        partneredSourceToggles.push(toggle);
+      } else {
+        sourceToggles.push(toggle);
+      }
+    });
+
+    return (
+      <div className="ct-preferences-pane">
+        <Header>Preferences</Header>
+
+        <FormCheckBoxesField
+          heading="Sources"
+          description={SourceCategoryDescription.official}
+          checkboxes={[
+            {
+              label: "Homebrew",
+              initiallyEnabled: useHomebrewContent,
+              onChange: this.handlePreferenceChange.bind(
+                this,
+                "useHomebrewContent"
+              ),
+              sortOrder: 0,
+            },
+            ...sourceToggles,
+          ]}
+          themed={true}
+          showAccordion={true}
+          variant="sidebar"
+          darkMode={enableDarkMode}
+        />
+
+        <FormCheckBoxesField
+          heading="Partnered Content"
+          description={SourceCategoryDescription.partnered}
+          checkboxes={partneredSourceToggles}
+          checkUncheckAllEnabled={true}
+          themed={true}
+          accordionHeading="Categories"
+          variant="sidebar"
+          darkMode={enableDarkMode}
+          showAccordion={true}
+        />
+
+        <FormCheckBoxesField
+          heading="Underdark Mode"
+          description="Enables dark mode for this character"
+          checkboxes={[
+            {
+              initiallyEnabled: enableDarkMode,
+              label: "Enable dark mode",
+              onChange: this.handlePreferenceChange.bind(
+                this,
+                "enableDarkMode"
+              ),
+            },
+          ]}
+          themed={true}
+          variant="sidebar"
+          darkMode={enableDarkMode}
+        />
+
+        <FormCheckBoxesField
+          heading="Dice Rolling"
+          description="Enables digital dice rolling for this character"
+          checkboxes={[
+            {
+              initiallyEnabled: diceEnabled,
+              label: "Enable Dice Rolling",
+              onChange: this.handleDiceToggle,
+            },
+          ]}
+          themed={true}
+          variant="sidebar"
+          darkMode={enableDarkMode}
+        />
+
+        <FormCheckBoxesField
+          heading="Optional Features"
+          description="Allow or restrict optional features for this character."
+          checkboxes={[
+            {
+              label: "Optional Class Features",
+              initiallyEnabled: enableOptionalClassFeatures,
+              onChangePromise:
+                this.handleOptionalClassFeaturesPreferenceChangePromise,
+            },
+            {
+              label: "Customize Your Origin",
+              initiallyEnabled: enableOptionalOrigins,
+              onChangePromise:
+                this.handleOptionalOriginsPreferenceChangePromise,
+            },
+          ]}
+          themed={true}
+          variant="sidebar"
+          darkMode={enableDarkMode}
+        />
+
+        <PreferencesPaneSelectField
+          heading="Advancement Type"
+          description="Story-based character progression / XP-based character progression"
+          onChangePromise={this.handleProgressionPreferenceChangePromise}
+          initialOptionRemoved={true}
+          options={advancementOptions}
+          initialValue={progressionType}
+          block={true}
+        />
+        <PreferencesPaneSelectField
+          heading="Hit Point Type"
+          description="When leveling up, increase hit points by the fixed value for your chosen class or manually enter a rolled value"
+          onChangePromise={this.handleHitPointPreferenceChangePromise}
+          initialOptionRemoved={true}
+          options={hpOptions}
+          initialValue={hitPointType}
+          block={true}
+        />
+
+        <FormCheckBoxesField
+          heading="Use Prerequisites"
+          description="Allow or restrict choices based on rule prerequisites for the following for this character"
+          checkboxes={[
+            {
+              label: "Feats",
+              initiallyEnabled: enforceFeatRules,
+              onChange: this.handlePreferenceChange.bind(
+                this,
+                "enforceFeatRules"
+              ),
+            },
+            {
+              label: "Multiclass Requirements",
+              initiallyEnabled: enforceMulticlassRules,
+              onChange: this.handlePreferenceChange.bind(
+                this,
+                "enforceMulticlassRules"
+              ),
+            },
+          ]}
+          themed={true}
+          variant="sidebar"
+          darkMode={enableDarkMode}
+        />
+
+        <FormCheckBoxesField
+          heading="Show level-scaled spells"
+          description="Display and highlight available spells to cast with higher level spell slots"
+          checkboxes={[
+            {
+              initiallyEnabled: showScaledSpells,
+              label: "Show Level-Scaled Spells",
+              onChange: this.handlePreferenceChange.bind(
+                this,
+                "showScaledSpells"
+              ),
+            },
+          ]}
+          themed={true}
+          variant="sidebar"
+          darkMode={enableDarkMode}
+        />
+
+        <PreferencesPaneSelectField
+          heading="Encumbrance Type"
+          description="Use the standard encumbrance rules / Disable the encumbrance display / Use the more detailed rules for encumbrance"
+          onChange={this.handleIntPreferenceChange.bind(
+            this,
+            "encumbranceType"
+          )}
+          initialOptionRemoved={true}
+          options={encumbranceOptions}
+          initialValue={encumbranceType}
+          block={true}
+        />
+
+        <FormCheckBoxesField
+          heading="Ignore Coin Weight"
+          description="Coins do not count against your total weight carried (50 coins weigh 1 lb.)"
+          checkboxes={[
+            {
+              initiallyEnabled: ignoreCoinWeight,
+              label: "Ignore Coin Weight",
+              onChange: this.handlePreferenceChange.bind(
+                this,
+                "ignoreCoinWeight"
+              ),
+            },
+          ]}
+          themed={true}
+          variant="sidebar"
+          darkMode={enableDarkMode}
+        />
+
+        <PreferencesPaneSelectField
+          heading="Ability Score/Modifier Display"
+          description="Reverse the arrangement of ability modifiers and scores"
+          onChange={this.handleIntPreferenceChange.bind(
+            this,
+            "abilityScoreDisplayType"
+          )}
+          initialOptionRemoved={true}
+          options={abilityDisplayOptions}
+          initialValue={abilityScoreDisplayType}
+          block={true}
+        />
+
+        <PrivacyTypeRadio
+          handleChange={(e) =>
+            this.handleChangePrivacy(parseInt(e?.target?.value))
+          }
+          darkMode={enableDarkMode}
+          initialValue={privacyType}
+          themed={true}
+          variant="sidebar"
+        />
+
+        <div className="ct-preferences-pane__version">
+          <div className="ct-preferences-pane__version-label">Version:</div>
+          <div className="ct-preferences-pane__version-value">
+            {config.version}
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    preferences: rulesEngineSelectors.getCharacterPreferences(state),
+    activeSourceCategories:
+      rulesEngineSelectors.getActiveSourceCategories(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+    classes: rulesEngineSelectors.getClasses(state),
+    species: rulesEngineSelectors.getRace(state),
+    classSpellListSpellsLookup:
+      rulesEngineSelectors.getClassSpellListSpellsLookup(state),
+    dataOriginRefData: rulesEngineSelectors.getDataOriginRefData(state),
+    characterTheme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const PreferencesPaneContainer = (props) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+  return <PreferencesPane paneHistoryStart={paneHistoryStart} {...props} />;
+};
+
+export default connect(mapStateToProps)(PreferencesPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneSelectField/PreferencesPaneSelectField.tsx b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneSelectField/PreferencesPaneSelectField.tsx
new file mode 100644
index 0000000..b165817
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneSelectField/PreferencesPaneSelectField.tsx
@@ -0,0 +1,155 @@
+import { uniqueId } from "lodash";
+import React from "react";
+
+import { Select } from "@dndbeyond/character-components/es";
+import {
+  HelperUtils,
+  HtmlSelectOption,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+
+interface Props {
+  initialValue: number | null;
+  onChange?: (value: number | null) => void;
+  onChangePromise?: (
+    newValue: string,
+    oldValue: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  heading: React.ReactNode;
+  className: string;
+  initialOptionRemoved: boolean;
+  options: Array<HtmlSelectOption>;
+  description: string;
+  block: boolean;
+  placeholder?: string;
+}
+interface State {
+  value: number | null;
+}
+export default class PreferencesPaneSelectField extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    initialValue: null,
+    className: "",
+    initialOptionRemoved: false,
+    block: false,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.initialValue,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { initialValue } = this.props;
+
+    if (initialValue !== prevProps.initialValue) {
+      this.setState({
+        value: initialValue,
+      });
+    }
+  }
+
+  handleChange = (value: string): void => {
+    const { onChange } = this.props;
+
+    let parseValue = HelperUtils.parseInputInt(value);
+
+    if (onChange) {
+      onChange(parseValue);
+    }
+
+    this.setState({
+      value: parseValue,
+    });
+  };
+
+  handleChangePromise = (
+    newValue: string,
+    oldValue: string,
+    accept: () => void,
+    reject: () => void
+  ): void => {
+    const { onChangePromise } = this.props;
+
+    if (onChangePromise) {
+      onChangePromise(
+        newValue,
+        oldValue,
+        () => {
+          let parseValue = HelperUtils.parseInputInt(newValue);
+          this.setState({
+            value: parseValue,
+          });
+          accept();
+        },
+        reject
+      );
+    }
+  };
+
+  render() {
+    const { value } = this.state;
+    const {
+      onChangePromise,
+      onChange,
+      block,
+      heading,
+      options,
+      className,
+      initialOptionRemoved,
+      description,
+      placeholder,
+    } = this.props;
+
+    const uId = uniqueId("qry-");
+
+    let classNames: Array<string> = [
+      "ct-preferences-pane__field",
+      "ct-preferences-pane__field--select",
+      className,
+    ];
+    if (block) {
+      classNames.push("ct-preferences-pane__field--block");
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ct-preferences-pane__field-summary">
+          <Heading className="ct-preferences-pane__field-heading">
+            <label className="ct-preferences-pane__field-label" htmlFor={uId}>
+              {heading}
+            </label>
+          </Heading>
+          <div className="ct-preferences-pane__field-description">
+            {description}
+          </div>
+        </div>
+        <div className="ct-preferences-pane__field-input">
+          <Select
+            options={options}
+            onChange={onChange ? this.handleChange : undefined}
+            onChangePromise={
+              onChangePromise ? this.handleChangePromise : undefined
+            }
+            value={value}
+            initialOptionRemoved={initialOptionRemoved}
+            placeholder={placeholder}
+          />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneSelectField/index.ts b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneSelectField/index.ts
new file mode 100644
index 0000000..07193bf
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneSelectField/index.ts
@@ -0,0 +1,4 @@
+import PreferencesPaneSelectField from "./PreferencesPaneSelectField";
+
+export default PreferencesPaneSelectField;
+export { PreferencesPaneSelectField };
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneToggleField/PreferencesPaneToggleField.tsx b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneToggleField/PreferencesPaneToggleField.tsx
new file mode 100644
index 0000000..b4c6dd8
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneToggleField/PreferencesPaneToggleField.tsx
@@ -0,0 +1,43 @@
+import React from "react";
+
+import { Toggle } from "~/components/Toggle";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+
+interface Props {
+  initiallyEnabled: boolean;
+  onChange: (isEnabled: boolean) => void;
+  heading: React.ReactNode;
+  description: string;
+}
+export default class PreferencesPaneToggleField extends React.PureComponent<Props> {
+  static defaultProps = {
+    initiallyEnabled: false,
+  };
+
+  render() {
+    const { heading, description, initiallyEnabled, onChange } = this.props;
+
+    return (
+      <div className="ct-preferences-pane__field ct-preferences-pane__field--toggle">
+        <div className="ct-preferences-pane__field-heading-input">
+          <Heading className="ct-preferences-pane__field-heading">
+            {heading}
+            <Toggle
+              checked={initiallyEnabled}
+              onClick={onChange}
+              color="themed"
+              aria-label={description}
+            />
+          </Heading>
+        </div>
+        <div className="ct-preferences-pane__field-summary">
+          {description && (
+            <div className="ct-preferences-pane__field-description">
+              {description}
+            </div>
+          )}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneToggleField/index.ts b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneToggleField/index.ts
new file mode 100644
index 0000000..6739a40
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneToggleField/index.ts
@@ -0,0 +1,4 @@
+import PreferencesPaneToggleField from "./PreferencesPaneToggleField";
+
+export default PreferencesPaneToggleField;
+export { PreferencesPaneToggleField };
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneTogglesField/PreferencesPaneTogglesField.tsx b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneTogglesField/PreferencesPaneTogglesField.tsx
new file mode 100644
index 0000000..55b7524
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneTogglesField/PreferencesPaneTogglesField.tsx
@@ -0,0 +1,62 @@
+import { orderBy } from "lodash";
+import React from "react";
+
+import { Toggle } from "~/components/Toggle";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+
+import { ToggleInfo } from "./typings";
+
+interface Props {
+  toggles: Array<ToggleInfo>;
+  heading: React.ReactNode;
+  description: string;
+}
+
+export default class PreferencesPaneTogglesField extends React.PureComponent<Props> {
+  static defaultProps = {
+    initiallyEnabled: false,
+  };
+
+  render() {
+    const { heading, description, toggles } = this.props;
+
+    if (!toggles.length) {
+      return null;
+    }
+
+    const sortedToggles = orderBy(toggles, "sortOrder");
+
+    return (
+      <div className="ct-preferences-pane__field ct-preferences-pane__field--toggle">
+        <div className="ct-preferences-pane__field-summary">
+          <Heading className="ct-preferences-pane__field-heading">
+            {heading}
+          </Heading>
+          {description && (
+            <div className="ct-preferences-pane__field-description">
+              {description}
+            </div>
+          )}
+        </div>
+        <div className="ct-preferences-pane__field-toggles">
+          {sortedToggles.map((toggle, idx) => (
+            <div className="ct-preferences-pane__field-toggle" key={idx}>
+              <div className="ct-preferences-pane__field-input">
+                <Toggle
+                  checked={toggle.initiallyEnabled}
+                  onClick={toggle.onChange}
+                  onChangePromise={toggle.onChangePromise}
+                  color="themed"
+                  aria-label={toggle.label}
+                />
+              </div>
+              <div className="ct-preferences-pane__field-label">
+                {toggle.label}
+              </div>
+            </div>
+          ))}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneTogglesField/index.ts b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneTogglesField/index.ts
new file mode 100644
index 0000000..ba2f658
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/PreferencesPaneTogglesField/index.ts
@@ -0,0 +1,5 @@
+import PreferencesPaneTogglesField from "./PreferencesPaneTogglesField";
+
+export * from "./typings";
+export default PreferencesPaneTogglesField;
+export { PreferencesPaneTogglesField };
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/index.ts
new file mode 100644
index 0000000..6edb74b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesPane/index.ts
@@ -0,0 +1,12 @@
+import PreferencesPane from "./PreferencesPane";
+import PreferencesPaneSelectField from "./PreferencesPaneSelectField";
+import PreferencesPaneToggleField from "./PreferencesPaneToggleField";
+import PreferencesPaneTogglesField from "./PreferencesPaneTogglesField";
+
+export default PreferencesPane;
+export {
+  PreferencesPane,
+  PreferencesPaneSelectField,
+  PreferencesPaneToggleField,
+  PreferencesPaneTogglesField,
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/PreferencesProgressionConfirmPane/PreferencesProgressionConfirmPane.tsx b/ddb_main/tools/js/Shared/containers/panes/PreferencesProgressionConfirmPane/PreferencesProgressionConfirmPane.tsx
new file mode 100644
index 0000000..efe6453
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/PreferencesProgressionConfirmPane/PreferencesProgressionConfirmPane.tsx
@@ -0,0 +1,105 @@
+import { FC } from "react";
+import { useDispatch } from "react-redux";
+
+import {
+  Constants,
+  characterActions,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Button } from "~/components/Button";
+import { useSidebar } from "~/contexts/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { PaneInitFailureContent } from "~/subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersPreferenceProgressionConfirm,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+interface Props {
+  identifiers: PaneIdentifiersPreferenceProgressionConfirm | null;
+}
+
+export const PreferencesProgressionConfirmPane: FC<Props> = ({
+  identifiers,
+}) => {
+  const dispatch = useDispatch();
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const progressionType = identifiers?.id ?? null;
+
+  const handleConfirm = (): void => {
+    dispatch(
+      characterActions.preferenceChoose("progressionType", progressionType)
+    );
+    paneHistoryStart(PaneComponentEnum.PREFERENCES);
+  };
+
+  const handleCancel = (): void => {
+    paneHistoryStart(PaneComponentEnum.PREFERENCES);
+  };
+
+  const renderContent = (): React.ReactNode => {
+    switch (progressionType) {
+      case Constants.PreferenceProgressionTypeEnum.XP:
+        return (
+          <>
+            <Header>XP Advancement</Header>
+            <div className="change-preference-content">
+              <p>
+                Are you sure you want to change your advancement method to XP
+                progression?
+              </p>
+              <p>
+                You will begin with the base XP value for your current level.
+              </p>
+            </div>
+          </>
+        );
+
+      case Constants.PreferenceProgressionTypeEnum.MILESTONE:
+        return (
+          <>
+            <Header>Milestone Advancement</Header>
+            <div className="change-preference-content">
+              <p>
+                Are you sure you want to change your advancement method to
+                Milestone progression?
+              </p>
+              <p>Your current XP values will be lost.</p>
+            </div>
+          </>
+        );
+    }
+
+    return null;
+  };
+
+  if (progressionType === null) {
+    return <PaneInitFailureContent />;
+  }
+
+  return (
+    <div className="ct-preferences-pane">
+      {renderContent()}
+      <div className="ct-preferences-pane__actions">
+        <div className="ct-preferences-pane__action">
+          <Button sizes="solid" size="x-small" themed onClick={handleConfirm}>
+            Accept
+          </Button>
+        </div>
+        <div className="ct-preferences-pane__action">
+          <Button
+            variant="outline"
+            size="x-small"
+            themed
+            onClick={handleCancel}
+          >
+            Cancel
+          </Button>
+        </div>
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPane.tsx b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPane.tsx
new file mode 100644
index 0000000..8f4b59a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPane.tsx
@@ -0,0 +1,433 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { Select } from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  CharacterValuesContract,
+  Constants,
+  CustomProficiencyContract,
+  EntityRestrictionData,
+  HelperUtils,
+  HtmlSelectOption,
+  HtmlSelectOptionGroup,
+  ProficiencyGroup,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  TypeValueLookup,
+  ValueUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+
+import ProficiencyGroups from "../../../../CharacterSheet/components/ProficiencyGroups";
+import { SharedAppState } from "../../../stores/typings";
+import ProficienciesPaneCustomProficiency from "./ProficienciesPaneCustomProficiency";
+import ProficienciesPaneExistingProficiency from "./ProficienciesPaneExistingProficiency";
+
+export const PROFICIENCY_TYPE = {
+  ARMOR: 1,
+  WEAPON: 2,
+  TOOL: 3,
+  LANGUAGE: 4,
+  TOOL_OTHER: 5,
+  LANGUAGE_OTHER: 6,
+};
+
+interface Props extends DispatchProp {
+  customProficiencies: Array<CustomProficiencyContract>;
+  proficiencyGroups: Array<ProficiencyGroup>;
+  typeValueLookup: TypeValueLookup;
+  ruleData: RuleData;
+  entityRestrictionData: EntityRestrictionData;
+}
+interface State {
+  type: number | null;
+  subtype: number | null;
+}
+class ProficienciesPane extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      type: null,
+      subtype: null,
+    };
+  }
+
+  getSubtypeOptions = (): Array<HtmlSelectOption | HtmlSelectOptionGroup> => {
+    const { type } = this.state;
+    const { ruleData, typeValueLookup, entityRestrictionData } = this.props;
+
+    let valueType: number | null = null;
+    switch (type) {
+      case PROFICIENCY_TYPE.ARMOR:
+        valueType = Constants.AdjustmentTypeEnum.ARMOR_PROFICIENCY_LEVEL;
+        break;
+      case PROFICIENCY_TYPE.WEAPON:
+        valueType = Constants.AdjustmentTypeEnum.WEAPON_PROFICIENCY_LEVEL;
+        break;
+      case PROFICIENCY_TYPE.LANGUAGE:
+        valueType = Constants.AdjustmentTypeEnum.LANGUAGE_PROFICIENCY_LEVEL;
+        break;
+      case PROFICIENCY_TYPE.TOOL:
+        valueType = Constants.AdjustmentTypeEnum.TOOL_PROFICIENCY_LEVEL;
+        break;
+      default:
+      // not implemented
+    }
+
+    let options: Array<HtmlSelectOption | HtmlSelectOptionGroup> = [];
+    if (valueType !== null) {
+      let excludeIds = ValueUtils.getTypeValueIntIds(
+        typeValueLookup,
+        valueType
+      );
+      switch (type) {
+        case PROFICIENCY_TYPE.ARMOR:
+          options = RuleDataUtils.getArmorOptions(ruleData, excludeIds);
+          break;
+        case PROFICIENCY_TYPE.WEAPON:
+          options = RuleDataUtils.getWeaponOptions(ruleData, excludeIds);
+          break;
+        case PROFICIENCY_TYPE.LANGUAGE:
+          options = RuleDataUtils.getLanguageOptionsGroupedBySourceCategory(
+            ruleData,
+            excludeIds,
+            entityRestrictionData
+          );
+          break;
+        case PROFICIENCY_TYPE.TOOL:
+          options = RuleDataUtils.getToolOptions(ruleData, excludeIds);
+          break;
+        default:
+        // not implemented
+      }
+    }
+
+    return options;
+  };
+
+  getSubtypeNameLookup = (type: number): Record<number, string> => {
+    const { ruleData } = this.props;
+
+    let names: Record<number, string> = {};
+    switch (type) {
+      case Constants.AdjustmentTypeEnum.ARMOR_PROFICIENCY_LEVEL:
+        names = RuleDataUtils.getArmorNameLookup(ruleData);
+        break;
+      case Constants.AdjustmentTypeEnum.WEAPON_PROFICIENCY_LEVEL:
+        names = RuleDataUtils.getWeaponNameLookup(ruleData);
+        break;
+      case Constants.AdjustmentTypeEnum.LANGUAGE_PROFICIENCY_LEVEL:
+        names = RuleDataUtils.getLanguageNameLookup(ruleData);
+        break;
+      case Constants.AdjustmentTypeEnum.TOOL_PROFICIENCY_LEVEL:
+        names = RuleDataUtils.getToolNameLookup(ruleData);
+        break;
+      default:
+      // not implemented
+    }
+    return names;
+  };
+
+  handleDataUpdate = (proficiency: CharacterValuesContract): void => {
+    const { dispatch } = this.props;
+    dispatch(
+      characterActions.valueSet(
+        ValueUtils.getTypeId(proficiency),
+        ValueUtils.getValue(proficiency),
+        ValueUtils.getNotes(proficiency),
+        ValueUtils.getValueId(proficiency),
+        ValueUtils.getValueTypeId(proficiency)
+      )
+    );
+  };
+
+  handleProficiencyRemove = (proficiency: CharacterValuesContract): void => {
+    const { dispatch } = this.props;
+    dispatch(
+      characterActions.valueSet(
+        ValueUtils.getTypeId(proficiency),
+        null,
+        null,
+        ValueUtils.getValueId(proficiency),
+        ValueUtils.getValueTypeId(proficiency)
+      )
+    );
+  };
+
+  handleCustomDataUpdate = (
+    id: number,
+    properties: Partial<CustomProficiencyContract>
+  ): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.customProficiencySet(id, properties));
+  };
+
+  handleCustomRemove = (proficiency: CustomProficiencyContract): void => {
+    const { dispatch } = this.props;
+    dispatch(characterActions.customProficiencyRemove(proficiency.id));
+  };
+
+  handleCustomProficiencyAdd = (type: number): void => {
+    const { dispatch, customProficiencies } = this.props;
+
+    let label: string = "Proficiency";
+    let customType: number | null = null;
+    switch (type) {
+      case PROFICIENCY_TYPE.LANGUAGE_OTHER:
+        label = "Language";
+        customType = Constants.CustomProficiencyTypeEnum.LANGUAGE;
+        break;
+      case PROFICIENCY_TYPE.TOOL_OTHER:
+        label = "Tool";
+        customType = Constants.CustomProficiencyTypeEnum.TOOL;
+        break;
+      default:
+      // not implemented
+    }
+
+    if (customType !== null) {
+      dispatch(
+        characterActions.customProficiencyCreate(
+          `Custom ${label} ${customProficiencies.length + 1}`,
+          customType
+        )
+      );
+    }
+  };
+
+  handleTypeChange = (type: string): void => {
+    let typeValue = HelperUtils.parseInputInt(type);
+    switch (typeValue) {
+      case PROFICIENCY_TYPE.LANGUAGE_OTHER:
+      case PROFICIENCY_TYPE.TOOL_OTHER:
+        this.handleCustomProficiencyAdd(typeValue);
+        this.setState({
+          type: null,
+        });
+        break;
+      case PROFICIENCY_TYPE.ARMOR:
+      case PROFICIENCY_TYPE.WEAPON:
+      case PROFICIENCY_TYPE.LANGUAGE:
+      case PROFICIENCY_TYPE.TOOL:
+      default:
+        this.setState({
+          type: typeValue,
+        });
+    }
+  };
+
+  handleSubtypeChange = (subtype: string): void => {
+    const { type } = this.state;
+    const { dispatch, ruleData } = this.props;
+
+    let subtypeValue = HelperUtils.parseInputInt(subtype);
+
+    let valueType: number | null = null;
+    let valueId: number | null = null;
+    let valueTypeId: number | null = null;
+    switch (type) {
+      case PROFICIENCY_TYPE.ARMOR:
+        valueType = Constants.AdjustmentTypeEnum.ARMOR_PROFICIENCY_LEVEL;
+        valueId = subtypeValue;
+        valueTypeId = Constants.ItemBaseTypeIdEnum.ARMOR;
+        break;
+      case PROFICIENCY_TYPE.WEAPON:
+        valueType = Constants.AdjustmentTypeEnum.WEAPON_PROFICIENCY_LEVEL;
+        valueId = subtypeValue;
+        valueTypeId = Constants.ItemBaseTypeIdEnum.WEAPON;
+        break;
+      case PROFICIENCY_TYPE.LANGUAGE:
+        valueType = Constants.AdjustmentTypeEnum.LANGUAGE_PROFICIENCY_LEVEL;
+        valueId = subtypeValue;
+        valueTypeId = RuleDataUtils.getLanguageTypeId(ruleData);
+        break;
+      case PROFICIENCY_TYPE.TOOL:
+        valueType = Constants.AdjustmentTypeEnum.TOOL_PROFICIENCY_LEVEL;
+        valueId = subtypeValue;
+        valueTypeId = RuleDataUtils.getToolTypeId(ruleData);
+        break;
+    }
+
+    if (type !== null && valueType !== null) {
+      dispatch(
+        characterActions.valueSet(
+          valueType,
+          Constants.ProficiencyLevelEnum.FULL,
+          null,
+          ValueUtils.hack__toString(valueId),
+          ValueUtils.hack__toString(valueTypeId)
+        )
+      );
+    }
+  };
+
+  renderCustomProficiencies = (): React.ReactNode => {
+    const { typeValueLookup, customProficiencies, ruleData } = this.props;
+
+    const proficiencyGroupData = RuleDataUtils.getProficiencyGroups(ruleData);
+
+    return (
+      <div className="ct-proficiencies-pane__customs">
+        {proficiencyGroupData.map((group) => {
+          let proficiencies: Array<CharacterValuesContract> = [];
+          let custom: Array<CustomProficiencyContract> = [];
+
+          if (group.customAdjustments !== null) {
+            group.customAdjustments.forEach((typeId) => {
+              let charValues = ValueUtils.getTypeData(typeValueLookup, typeId);
+              proficiencies.push(...charValues);
+            });
+          }
+
+          // TODO get real data
+          switch (group.label) {
+            case "Tools":
+              custom = customProficiencies.filter(
+                (customProficiency) =>
+                  customProficiency.type ===
+                  Constants.CustomProficiencyTypeEnum.TOOL
+              );
+              break;
+            case "Languages":
+              custom = customProficiencies.filter(
+                (customProficiency) =>
+                  customProficiency.type ===
+                  Constants.CustomProficiencyTypeEnum.LANGUAGE
+              );
+              break;
+            default:
+            // not implemented
+          }
+
+          if (!proficiencies.length && !custom.length) {
+            return null;
+          }
+
+          return (
+            <div
+              className="ct-proficiencies-pane__custom"
+              key={group.label ? group.label : ""}
+            >
+              <div className="ct-proficiencies-pane__custom-label">
+                <Heading>{group.label}</Heading>
+              </div>
+              <div className="ct-proficiencies-pane__proficiencies">
+                {proficiencies.map((proficiency) => {
+                  return (
+                    <ProficienciesPaneExistingProficiency
+                      key={ValueUtils.getUniqueKey(proficiency)}
+                      proficiency={proficiency}
+                      nameLookup={this.getSubtypeNameLookup(
+                        ValueUtils.getTypeId(proficiency)
+                      )}
+                      onRemove={this.handleProficiencyRemove}
+                      onDataUpdate={this.handleDataUpdate}
+                    />
+                  );
+                })}
+                {custom.map((proficiency) => (
+                  <ProficienciesPaneCustomProficiency
+                    key={proficiency.id}
+                    proficiency={proficiency}
+                    onRemove={this.handleCustomRemove}
+                    onDataUpdate={this.handleCustomDataUpdate}
+                  />
+                ))}
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    );
+  };
+
+  renderAdd = (): React.ReactNode => {
+    const { type, subtype } = this.state;
+
+    let typeOptions: Array<HtmlSelectOptionGroup> = [
+      {
+        optGroupLabel: "Existing",
+        options: [
+          { label: "Armor", value: PROFICIENCY_TYPE.ARMOR },
+          { label: "Weapon", value: PROFICIENCY_TYPE.WEAPON },
+          { label: "Tool", value: PROFICIENCY_TYPE.TOOL },
+          { label: "Language", value: PROFICIENCY_TYPE.LANGUAGE },
+        ],
+      },
+      {
+        optGroupLabel: "Custom",
+        resetAfterChoice: true,
+        options: [
+          { label: "Tool", value: PROFICIENCY_TYPE.TOOL_OTHER },
+          { label: "Language", value: PROFICIENCY_TYPE.LANGUAGE_OTHER },
+        ],
+      },
+    ];
+
+    let subtypeOptions = this.getSubtypeOptions();
+
+    return (
+      <React.Fragment>
+        <Heading>Add New Proficiencies</Heading>
+        <div className="ct-proficiencies-pane__add">
+          <div className="ct-proficiencies-pane__add-field ct-proficiencies-pane__add-field--type">
+            <Select
+              options={typeOptions}
+              onChange={this.handleTypeChange}
+              value={type}
+            />
+          </div>
+          {subtypeOptions.length > 0 && (
+            <div className="ct-proficiencies-pane__add-field ct-proficiencies-pane__add-field--subtype">
+              <Select
+                options={subtypeOptions}
+                onChange={this.handleSubtypeChange}
+                value={subtype}
+                initialOptionRemoved={true}
+                resetAfterChoice={true}
+              />
+            </div>
+          )}
+        </div>
+      </React.Fragment>
+    );
+  };
+
+  renderProficiencyGroups = (): React.ReactNode => {
+    const { proficiencyGroups } = this.props;
+
+    return (
+      <div className="ct-proficiencies-pane__groups">
+        <ProficiencyGroups proficiencyGroups={proficiencyGroups} />
+      </div>
+    );
+  };
+
+  render() {
+    return (
+      <div className="ct-proficiencies-pane">
+        <Header>Proficiencies & Training</Header>
+        {this.renderCustomProficiencies()}
+        {this.renderAdd()}
+        {this.renderProficiencyGroups()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    customProficiencies: rulesEngineSelectors.getCustomProficiencies(state),
+    typeValueLookup: rulesEngineSelectors.getCharacterValueLookupByType(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    proficiencyGroups: rulesEngineSelectors.getProficiencyGroups(state),
+    entityRestrictionData: rulesEngineSelectors.getEntityRestrictionData(state),
+  };
+}
+
+export default connect(mapStateToProps)(ProficienciesPane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneCustomProficiency/ProficienciesPaneCustomProficiency.tsx b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneCustomProficiency/ProficienciesPaneCustomProficiency.tsx
new file mode 100644
index 0000000..5dd6eb5
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneCustomProficiency/ProficienciesPaneCustomProficiency.tsx
@@ -0,0 +1,77 @@
+import React from "react";
+
+import { CustomProficiencyContract } from "@dndbeyond/character-rules-engine/es";
+
+import { RemoveButton } from "../../../../components/common/Button";
+import ProficienciesPaneProficiencyEditor from "../ProficienciesPaneProficiencyEditor";
+
+interface Props {
+  proficiency: CustomProficiencyContract;
+  onDataUpdate?: (id: number, data: Record<string, any>) => void;
+  onRemove?: (proficiency: CustomProficiencyContract) => void;
+}
+export default class ProficienciesPaneCustomProficiency extends React.PureComponent<Props> {
+  getData = (): Record<string, any> => {
+    const { proficiency } = this.props;
+
+    if (proficiency === null) {
+      return {};
+    }
+
+    return proficiency;
+  };
+
+  handleDataUpdate = (propertyKey: string, value: string): void => {
+    const { onDataUpdate, proficiency } = this.props;
+
+    if (onDataUpdate) {
+      let newProperties = this.getData();
+      onDataUpdate(proficiency.id, {
+        ...newProperties,
+        [propertyKey]: value,
+      });
+    }
+  };
+
+  handleRemove = (): void => {
+    const { onRemove, proficiency } = this.props;
+
+    if (onRemove) {
+      onRemove(proficiency);
+    }
+  };
+
+  render() {
+    const { proficiency } = this.props;
+
+    return (
+      <div className="ct-proficiencies-pane__proficiency">
+        <div className="ct-proficiencies-pane__proficiency-primary">
+          <div className="ct-proficiencies-pane__proficiency-name">
+            <ProficienciesPaneProficiencyEditor
+              onUpdate={this.handleDataUpdate}
+              defaultValue={proficiency.name}
+              propertyKey="name"
+              placeholder="Enter Name"
+            />
+          </div>
+          <div className="ct-proficiencies-pane__proficiency-actions">
+            <div className="ct-proficiencies-pane__proficiency-action ct-proficiencies-pane__proficiency-action--remove">
+              <RemoveButton onClick={this.handleRemove}>
+                Remove Proficiency
+              </RemoveButton>
+            </div>
+          </div>
+        </div>
+        <div className="ct-proficiencies-pane__proficiency-notes">
+          <ProficienciesPaneProficiencyEditor
+            onUpdate={this.handleDataUpdate}
+            defaultValue={proficiency.notes}
+            propertyKey="notes"
+            placeholder="Enter Source Note..."
+          />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneCustomProficiency/index.ts b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneCustomProficiency/index.ts
new file mode 100644
index 0000000..485d774
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneCustomProficiency/index.ts
@@ -0,0 +1,4 @@
+import ProficienciesPaneCustomProficiency from "./ProficienciesPaneCustomProficiency";
+
+export default ProficienciesPaneCustomProficiency;
+export { ProficienciesPaneCustomProficiency };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneExistingProficiency/ProficienciesPaneExistingProficiency.tsx b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneExistingProficiency/ProficienciesPaneExistingProficiency.tsx
new file mode 100644
index 0000000..4579673
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneExistingProficiency/ProficienciesPaneExistingProficiency.tsx
@@ -0,0 +1,107 @@
+import React from "react";
+
+import {
+  CharacterValuesContract,
+  ValueUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { RemoveButton } from "../../../../components/common/Button";
+import ProficienciesPaneProficiencyEditor from "../ProficienciesPaneProficiencyEditor";
+
+interface Props {
+  proficiency: CharacterValuesContract;
+  nameLookup: Record<number, string>;
+  onDataUpdate: (proficiency: CharacterValuesContract) => void;
+  onRemove: (proficiency: CharacterValuesContract) => void;
+}
+interface State {
+  proficiency: CharacterValuesContract;
+}
+export default class ProficienciesPaneExistingProficiency extends React.PureComponent<
+  Props,
+  State
+> {
+  constructor(props) {
+    super(props);
+
+    this.state = this.generateStateData(props);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { proficiency } = this.props;
+
+    if (proficiency !== prevProps.proficiency) {
+      this.setState(this.generateStateData(this.props));
+    }
+  }
+
+  generateStateData = (props: Props): State => {
+    const { proficiency } = props;
+
+    return {
+      proficiency,
+    };
+  };
+
+  handleDataUpdate = (propertyKey: string, value) => {
+    const { onDataUpdate } = this.props;
+
+    this.setState((prevState) => {
+      let newProficiency = {
+        ...prevState.proficiency,
+        [propertyKey]: value,
+      };
+
+      if (onDataUpdate) {
+        onDataUpdate(newProficiency);
+      }
+
+      return {
+        proficiency: newProficiency,
+      };
+    });
+  };
+
+  handleRemove = () => {
+    const { proficiency } = this.state;
+    const { onRemove } = this.props;
+
+    if (onRemove) {
+      onRemove(proficiency);
+    }
+  };
+
+  render() {
+    const { proficiency } = this.state;
+    const { nameLookup } = this.props;
+
+    const valueId = ValueUtils.getValueId(proficiency);
+    return (
+      <div className="ct-proficiencies-pane__proficiency">
+        <div className="ct-proficiencies-pane__proficiency-primary">
+          <div className="ct-proficiencies-pane__proficiency-name">
+            {valueId === null ? "" : nameLookup[valueId]}
+          </div>
+          <div className="ct-proficiencies-pane__proficiency-actions">
+            <div className="ct-proficiencies-pane__proficiency-action ct-proficiencies-pane__proficiency-action--remove">
+              <RemoveButton onClick={this.handleRemove}>
+                Remove Proficiency
+              </RemoveButton>
+            </div>
+          </div>
+        </div>
+        <div className="ct-proficiencies-pane__proficiency-notes">
+          <ProficienciesPaneProficiencyEditor
+            onUpdate={this.handleDataUpdate}
+            defaultValue={ValueUtils.getNotes(proficiency)}
+            propertyKey="notes"
+            placeholder="Enter Source Note..."
+          />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneExistingProficiency/index.ts b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneExistingProficiency/index.ts
new file mode 100644
index 0000000..3adb100
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneExistingProficiency/index.ts
@@ -0,0 +1,4 @@
+import ProficienciesPaneExistingProficiency from "./ProficienciesPaneExistingProficiency";
+
+export default ProficienciesPaneExistingProficiency;
+export { ProficienciesPaneExistingProficiency };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneProficiencyEditor/ProficienciesPaneProficiencyEditor.tsx b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneProficiencyEditor/ProficienciesPaneProficiencyEditor.tsx
new file mode 100644
index 0000000..4b64a35
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneProficiencyEditor/ProficienciesPaneProficiencyEditor.tsx
@@ -0,0 +1,45 @@
+import React from "react";
+
+interface Props {
+  label?: string;
+  propertyKey: string;
+  defaultValue: string | null;
+  onUpdate?: (propertyKey: string, value: string) => void;
+  placeholder: string;
+}
+export default class ProficienciesPaneProficiencyEditor extends React.PureComponent<Props> {
+  static defaultProps = {
+    placeholder: "",
+  };
+
+  handleBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { propertyKey, onUpdate } = this.props;
+
+    if (onUpdate) {
+      onUpdate(propertyKey, evt.target.value);
+    }
+  };
+
+  render() {
+    const { label, defaultValue, placeholder } = this.props;
+
+    return (
+      <div className="ct-proficiencies-pane__proficiency-editor">
+        <div className="ct-proficiencies-pane__proficiency-editor-field">
+          <input
+            type="text"
+            defaultValue={defaultValue === null ? "" : defaultValue}
+            onBlur={this.handleBlur}
+            className="ct-proficiencies-pane__proficiency-editor-input"
+            placeholder={placeholder}
+          />
+        </div>
+        {label && (
+          <div className="ct-proficiencies-pane__proficiency-editor-label">
+            {label}
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneProficiencyEditor/index.ts b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneProficiencyEditor/index.ts
new file mode 100644
index 0000000..b59a59b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/ProficienciesPaneProficiencyEditor/index.ts
@@ -0,0 +1,4 @@
+import ProficienciesPaneProficiencyEditor from "./ProficienciesPaneProficiencyEditor";
+
+export default ProficienciesPaneProficiencyEditor;
+export { ProficienciesPaneProficiencyEditor };
diff --git a/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/index.ts
new file mode 100644
index 0000000..6d75832
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ProficienciesPane/index.ts
@@ -0,0 +1,12 @@
+import ProficienciesPane from "./ProficienciesPane";
+import ProficienciesPaneCustomProficiency from "./ProficienciesPaneCustomProficiency";
+import ProficienciesPaneExistingProficiency from "./ProficienciesPaneExistingProficiency";
+import ProficienciesPaneProficiencyEditor from "./ProficienciesPaneProficiencyEditor";
+
+export default ProficienciesPane;
+export {
+  ProficienciesPane,
+  ProficienciesPaneCustomProficiency,
+  ProficienciesPaneExistingProficiency,
+  ProficienciesPaneProficiencyEditor,
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/ProficiencyBonusPane/ProficiencyBonusPane.tsx b/ddb_main/tools/js/Shared/containers/panes/ProficiencyBonusPane/ProficiencyBonusPane.tsx
new file mode 100644
index 0000000..88ff6c3
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ProficiencyBonusPane/ProficiencyBonusPane.tsx
@@ -0,0 +1,51 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  rulesEngineSelectors,
+  Constants,
+  RuleData,
+  RuleDataUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+
+import { SharedAppState } from "../../../stores/typings";
+
+interface Props {
+  ruleData: RuleData;
+}
+class ProficiencyBonusPane extends React.PureComponent<Props> {
+  render() {
+    const { ruleData } = this.props;
+
+    let rule = RuleDataUtils.getRule(
+      Constants.RuleKeyEnum.PROFICIENCY_BONUS,
+      ruleData
+    );
+    let description: string = "";
+    if (rule && rule.description) {
+      description = rule.description;
+    }
+
+    return (
+      <div className="ct-proficiency-bonus-pane">
+        <Header>Proficiency Bonus</Header>
+        <HtmlContent
+          className="ct-proficiency-bonus-pane__description"
+          html={description}
+          withoutTooltips
+        />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+  };
+}
+
+export default connect(mapStateToProps)(ProficiencyBonusPane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/ProficiencyBonusPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/ProficiencyBonusPane/index.ts
new file mode 100644
index 0000000..c7f4778
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ProficiencyBonusPane/index.ts
@@ -0,0 +1,4 @@
+import ProficiencyBonusPane from "./ProficiencyBonusPane";
+
+export default ProficiencyBonusPane;
+export { ProficiencyBonusPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/SavingThrowsPane/SavingThrowsPane.tsx b/ddb_main/tools/js/Shared/containers/panes/SavingThrowsPane/SavingThrowsPane.tsx
new file mode 100644
index 0000000..8569455
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SavingThrowsPane/SavingThrowsPane.tsx
@@ -0,0 +1,101 @@
+import React from "react";
+import { useSelector } from "react-redux";
+
+import { SavingThrowsSummary } from "@dndbeyond/character-components/es";
+import {
+  AbilityManager,
+  Constants,
+  DataOrigin,
+  RuleDataUtils,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { useSidebar } from "~/contexts/Sidebar";
+import { useAbilities } from "~/hooks/useAbilities";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+import { getDataOriginComponentInfo } from "~/subApps/sheet/components/Sidebar/helpers/paneUtils";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import SavingThrowsDetails from "../../../../CharacterSheet/components/SavingThrowsDetails";
+import { characterRollContextSelectors } from "../../../selectors";
+import { PaneIdentifierUtils } from "../../../utils";
+
+export default function SavingThrowsPane() {
+  const abilities = useAbilities();
+
+  const ruleData = useSelector(rulesEngineSelectors.getRuleData);
+  const situationalBonusSavingThrowsLookup = useSelector(
+    rulesEngineSelectors.getSituationalBonusSavingThrowsLookup
+  );
+  const savingThrowDiceAdjustments = useSelector(
+    rulesEngineSelectors.getSavingThrowDiceAdjustments
+  );
+  const deathSaveInfo = useSelector(rulesEngineSelectors.getDeathSaveInfo);
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+  const characterRollContext = useSelector(
+    characterRollContextSelectors.getCharacterRollContext
+  );
+
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+
+  const handleAbilityClick = (ability: AbilityManager): void => {
+    paneHistoryPush(
+      PaneComponentEnum.ABILITY_SAVING_THROW,
+      PaneIdentifierUtils.generateAbilitySavingThrows(ability.getId())
+    );
+  };
+
+  const handleDataOriginClick = (dataOrigin: DataOrigin): void => {
+    let component = getDataOriginComponentInfo(dataOrigin);
+    if (component.type !== PaneComponentEnum.ERROR_404) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  const renderDescription = (): React.ReactNode => {
+    let rulesText = RuleDataUtils.getRule(
+      Constants.RuleKeyEnum.SAVING_THROWS,
+      ruleData
+    );
+    if (rulesText === null || rulesText.description === null) {
+      return null;
+    }
+
+    return (
+      <HtmlContent
+        className="ct-saving-throws-pane__description"
+        html={rulesText.description}
+        withoutTooltips
+      />
+    );
+  };
+
+  return (
+    <div className="ct-saving-throws-pane">
+      <Header>Saving Throws</Header>
+      <SavingThrowsSummary
+        abilities={abilities}
+        situationalBonusSavingThrowsLookup={situationalBonusSavingThrowsLookup}
+        onClick={handleAbilityClick}
+        // diceEnabled={diceEnabled} // This would be cool but will take a bit of work
+        theme={theme}
+        rollContext={characterRollContext}
+      />
+      <div className="ct-saving-throws-pane__details">
+        <Heading>Saving Throw Modifiers</Heading>
+        <SavingThrowsDetails
+          theme={theme}
+          ruleData={ruleData}
+          savingThrowDiceAdjustments={savingThrowDiceAdjustments}
+          deathSaveInfo={deathSaveInfo}
+          onDataOriginClick={handleDataOriginClick}
+        />
+      </div>
+      {renderDescription()}
+    </div>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/SavingThrowsPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/SavingThrowsPane/index.ts
new file mode 100644
index 0000000..0520794
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SavingThrowsPane/index.ts
@@ -0,0 +1,4 @@
+import SavingThrowsPane from "./SavingThrowsPane";
+
+export default SavingThrowsPane;
+export { SavingThrowsPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/SenseManagePane/SenseManagePane.tsx b/ddb_main/tools/js/Shared/containers/panes/SenseManagePane/SenseManagePane.tsx
new file mode 100644
index 0000000..e775b3d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SenseManagePane/SenseManagePane.tsx
@@ -0,0 +1,266 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { Collapsible } from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  CharacterTheme,
+  Constants,
+  CustomSenseContract,
+  CustomSenseLookup,
+  HtmlSelectOption,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  SenseInfo,
+  ValueLookup,
+  ValueUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+
+import EditorBox from "../../../components/EditorBox";
+import ValueEditor from "../../../components/ValueEditor";
+import { SENSE_TYPE_LIST } from "../../../constants/App";
+import * as appEnvSelectors from "../../../selectors/appEnv";
+import { SharedAppState } from "../../../stores/typings";
+import { SenseManagePaneCustomizeItem } from "./SenseManagePaneCustomizeItem";
+
+interface Props extends DispatchProp {
+  passivePerception: number | null;
+  passiveInvestigation: number | null;
+  passiveInsight: number | null;
+  overridePassivePerception: number | null;
+  senses: SenseInfo;
+  customSensesLookup: CustomSenseLookup;
+  customSenses: Array<CustomSenseContract>;
+  ruleData: RuleData;
+  valueLookup: ValueLookup;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+class SenseManagePane extends React.PureComponent<Props> {
+  handleCustomDataUpdate = (key, value, source) => {
+    const { dispatch } = this.props;
+
+    dispatch(characterActions.valueSet(key, value, source));
+  };
+
+  handleOverrideUpdate = (
+    id: number,
+    distance: number | null,
+    source: string | null
+  ): void => {
+    const { dispatch, customSenses } = this.props;
+
+    if (distance !== null || source !== null) {
+      let foundSense: CustomSenseContract | undefined = customSenses.find(
+        (sense) => sense.senseId === id
+      );
+
+      if (foundSense) {
+        dispatch(
+          characterActions.senseSet({
+            ...foundSense,
+            distance,
+            source,
+          })
+        );
+      } else {
+        let newSense: CustomSenseContract = {
+          senseId: id,
+          distance,
+          source,
+        };
+        dispatch(characterActions.senseAdd(newSense));
+      }
+    } else {
+      dispatch(characterActions.senseRemove(id));
+    }
+  };
+
+  renderSense = (
+    typeId: number,
+    label: string,
+    value: React.ReactNode,
+    source: string | null
+  ): React.ReactNode => {
+    return (
+      <div className="ct-sense-manage-pane__sense" key={typeId}>
+        <span className="ct-sense-manage-pane__sense-label">{label}:</span>
+        <span className="ct-sense-manage-pane__sense-value">{value}</span>
+        {source && (
+          <span className="ct-sense-manage-pane__sense-source">({source})</span>
+        )}
+      </div>
+    );
+  };
+
+  renderPassiveSense = (
+    typeId: Constants.AdjustmentTypeEnum,
+    label: string,
+    value: number | null
+  ): React.ReactNode => {
+    const { valueLookup } = this.props;
+
+    let source = ValueUtils.getNotes(ValueUtils.getData(valueLookup, typeId));
+
+    return this.renderSense(typeId, label, value, source);
+  };
+
+  renderCharacterSense = (senseKey: number): React.ReactNode => {
+    const { senses, customSensesLookup, theme } = this.props;
+
+    let senseValue = senses[senseKey];
+    if (!senseValue || (senseValue && senseValue === 0)) {
+      return null;
+    }
+
+    let source: string | null = null;
+    if (customSensesLookup[senseKey]) {
+      let customSense: CustomSenseContract = customSensesLookup[senseKey];
+      source = customSense.source;
+    }
+
+    return this.renderSense(
+      senseKey,
+      RuleDataUtils.getSenseTypeLabel(senseKey),
+      <NumberDisplay type="distanceInFt" number={senseValue} />,
+      source
+    );
+  };
+
+  renderCustomize = (): React.ReactNode => {
+    const { customSensesLookup, ruleData, valueLookup, isReadonly } =
+      this.props;
+
+    if (!isReadonly) {
+      let senseOptions: Array<HtmlSelectOption> = SENSE_TYPE_LIST.map(
+        (key: number) => ({
+          label: RuleDataUtils.getSenseTypeLabel(key),
+          value: key,
+        })
+      );
+
+      let customizationValues: Array<Constants.AdjustmentTypeEnum> = [
+        Constants.AdjustmentTypeEnum.OVERRIDE_PASSIVE_PERCEPTION,
+        Constants.AdjustmentTypeEnum.OVERRIDE_PASSIVE_INVESTIGATION,
+        Constants.AdjustmentTypeEnum.OVERRIDE_PASSIVE_INSIGHT,
+      ];
+
+      return (
+        <Collapsible
+          layoutType={"minimal"}
+          header="Customize"
+          className="ct-sense-manage-pane__customize"
+        >
+          <EditorBox>
+            <ValueEditor
+              dataLookup={ValueUtils.getDataLookup(
+                valueLookup,
+                customizationValues
+              )}
+              onDataUpdate={this.handleCustomDataUpdate}
+              valueEditors={customizationValues}
+              ruleData={ruleData}
+            />
+          </EditorBox>
+          <div className="ct-sense-manage-pane__customize-header">
+            <div className="ct-sense-manage-pane__customize-header-label" />
+            <div className="ct-sense-manage-pane__customize-header-input">
+              Distance (ft.)
+            </div>
+            <div className="ct-sense-manage-pane__customize-header-source">
+              Source/Notes
+            </div>
+          </div>
+          {senseOptions.map((option) => {
+            const override: CustomSenseContract =
+              customSensesLookup[option.value];
+            return (
+              <SenseManagePaneCustomizeItem
+                key={option.value as number}
+                id={option.value as number}
+                label={option.label}
+                initialValue={override ? override.distance : null}
+                initialSource={override ? override.source : null}
+                onUpdate={this.handleOverrideUpdate}
+              />
+            );
+          })}
+        </Collapsible>
+      );
+    }
+  };
+
+  renderDescription = (): React.ReactNode => {
+    const { ruleData } = this.props;
+
+    let rule = RuleDataUtils.getRule(Constants.RuleKeyEnum.SENSES, ruleData);
+    if (rule === null || rule.description === null) {
+      return null;
+    }
+
+    return (
+      <HtmlContent
+        className="ct-sense-manage-pane__description"
+        html={rule.description}
+        withoutTooltips
+      />
+    );
+  };
+
+  render() {
+    const { passivePerception, passiveInvestigation, passiveInsight } =
+      this.props;
+
+    return (
+      <div className="ct-sense-manage-pane">
+        <Header>Senses</Header>
+        <div className="ct-sense-manage-pane__senses">
+          {this.renderPassiveSense(
+            Constants.AdjustmentTypeEnum.OVERRIDE_PASSIVE_PERCEPTION,
+            "Passive Perception",
+            passivePerception
+          )}
+          {this.renderPassiveSense(
+            Constants.AdjustmentTypeEnum.OVERRIDE_PASSIVE_INVESTIGATION,
+            "Passive Investigation",
+            passiveInvestigation
+          )}
+          {this.renderPassiveSense(
+            Constants.AdjustmentTypeEnum.OVERRIDE_PASSIVE_INSIGHT,
+            "Passive Insight",
+            passiveInsight
+          )}
+          {SENSE_TYPE_LIST.map((senseKey) =>
+            this.renderCharacterSense(senseKey)
+          )}
+        </div>
+        {this.renderCustomize()}
+        {this.renderDescription()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    senses: rulesEngineSelectors.getSenseInfo(state),
+    passivePerception: rulesEngineSelectors.getPassivePerception(state),
+    passiveInvestigation: rulesEngineSelectors.getPassiveInvestigation(state),
+    passiveInsight: rulesEngineSelectors.getPassiveInsight(state),
+    overridePassivePerception:
+      rulesEngineSelectors.getOverridePassivePerception(state),
+    customSensesLookup: rulesEngineSelectors.getCustomSenseLookup(state),
+    customSenses: rulesEngineSelectors.getCustomSenses(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    valueLookup: rulesEngineSelectors.getCharacterValueLookup(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+export default connect(mapStateToProps)(SenseManagePane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/SenseManagePane/SenseManagePaneCustomizeItem/SenseManagePaneCustomizeItem.tsx b/ddb_main/tools/js/Shared/containers/panes/SenseManagePane/SenseManagePaneCustomizeItem/SenseManagePaneCustomizeItem.tsx
new file mode 100644
index 0000000..89b987e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SenseManagePane/SenseManagePaneCustomizeItem/SenseManagePaneCustomizeItem.tsx
@@ -0,0 +1,113 @@
+import React from "react";
+
+import { HelperUtils } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  id: number;
+  className: string;
+  label: string | null;
+  initialValue: number | null;
+  initialSource: string | null;
+  onUpdate?: (id: number, value: number | null, source: string | null) => void;
+  enableSource: boolean;
+  minimumValue: number;
+}
+interface State {
+  value: number | null;
+  source: string | null;
+  isDirty: boolean;
+}
+export default class CustomEntry extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    className: "",
+    enableSource: true,
+    minimumValue: null,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.initialValue,
+      source: props.initialSource,
+      isDirty: false,
+    };
+  }
+
+  handleUpdate = (): void => {
+    const { onUpdate, id } = this.props;
+    const { value, source, isDirty } = this.state;
+
+    if (isDirty && onUpdate) {
+      onUpdate(id, value, source);
+      this.setState({
+        isDirty: false,
+      });
+    }
+  };
+
+  handleValueBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { minimumValue } = this.props;
+
+    let value = evt.target.value;
+
+    this.setState((prevState) => {
+      let parsedValue = HelperUtils.parseInputInt(value);
+      let clampedValue = parsedValue;
+      if (minimumValue !== null && parsedValue !== null) {
+        clampedValue = HelperUtils.clampInt(parsedValue, minimumValue);
+      }
+
+      return {
+        value: clampedValue,
+      };
+    }, this.handleUpdate);
+  };
+
+  handleValueChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    this.setState({
+      value: HelperUtils.parseInputInt(evt.target.value),
+      isDirty: true,
+    });
+  };
+
+  handleSourceChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    this.setState({
+      source: evt.target.value,
+      isDirty: true,
+    });
+  };
+
+  render() {
+    const { value, source } = this.state;
+    const { label, enableSource, minimumValue, className } = this.props;
+
+    return (
+      <div className={`ct-sense-manage-pane__customize-item ${className}`}>
+        <div className="ct-sense-manage-pane__customize-item-label">
+          {label}
+        </div>
+        <div className="ct-sense-manage-pane__customize-item-input">
+          <input
+            type="number"
+            min={minimumValue}
+            onChange={this.handleValueChange}
+            onBlur={this.handleValueBlur}
+            value={value === null ? "" : value}
+          />
+        </div>
+        {enableSource && (
+          <div className="ct-sense-manage-pane__customize-item-source">
+            <input
+              type="text"
+              onChange={this.handleSourceChange}
+              onBlur={this.handleUpdate}
+              value={source === null ? "" : source}
+            />
+          </div>
+        )}
+      </div>
+    );
+    //`
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/SenseManagePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/SenseManagePane/index.ts
new file mode 100644
index 0000000..40544b2
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SenseManagePane/index.ts
@@ -0,0 +1,5 @@
+import SenseManagePane from "./SenseManagePane";
+import SenseManagePaneCustomizeItem from "./SenseManagePaneCustomizeItem";
+
+export default SenseManagePane;
+export { SenseManagePane, SenseManagePaneCustomizeItem };
diff --git a/ddb_main/tools/js/Shared/containers/panes/SettingsPane/SettingsPane.tsx b/ddb_main/tools/js/Shared/containers/panes/SettingsPane/SettingsPane.tsx
new file mode 100644
index 0000000..378b66f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SettingsPane/SettingsPane.tsx
@@ -0,0 +1,179 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  characterActions,
+  CharacterPreferences,
+  CharacterUtils,
+  ConfigUtils,
+  Constants,
+  FeatureFlagInfo,
+  featureFlagInfoSelectors,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { PaneIdentifiersSettingsContext } from "~/subApps/sheet/components/Sidebar/types";
+
+import { SharedAppState } from "../../../stores/typings";
+import PreferencesPaneSelectField from "../PreferencesPane/PreferencesPaneSelectField";
+import PreferencesPaneToggleField from "../PreferencesPane/PreferencesPaneToggleField";
+import {
+  SettingsContexts,
+  SettingsContextsEnum,
+  SettingsToggle,
+  SettingsTypeEnum,
+} from "./typings";
+
+const ENABLE_CONTAINER_CURRENCY: SettingsToggle = {
+  heading: "Put Coins in Containers",
+  description:
+    "Track individual coin totals for different containers in your inventory.",
+  key: "enableContainerCurrency",
+  type: SettingsTypeEnum.TOGGLE,
+};
+
+const SETTINGS_CONTEXTS: SettingsContexts = {
+  [SettingsContextsEnum.COIN]: [
+    {
+      heading: "Ignore Coin Weight",
+      description:
+        "Coins do not count against your total weight carried (50 coins weigh 1 lb.).",
+      key: "ignoreCoinWeight",
+      type: SettingsTypeEnum.TOGGLE,
+    },
+  ],
+  [SettingsContextsEnum.ENCUMBRANCE]: [
+    {
+      heading: "Ignore Coin Weight",
+      description:
+        "Coins do not count against your total weight carried (50 coins weigh 1 lb.).",
+      key: "ignoreCoinWeight",
+      type: SettingsTypeEnum.TOGGLE,
+    },
+    {
+      heading: "Encumbrance Type",
+      description:
+        "Use the standard encumbrance rules / Disable the encumbrance display / Use the more detailed rules for encumbrance",
+      key: "encumbranceType",
+      type: SettingsTypeEnum.SELECT,
+      options: [
+        {
+          label: "Use Encumbrance",
+          value: Constants.PreferenceEncumbranceTypeEnum.ENCUMBRANCE,
+        },
+        {
+          label: "No Encumbrance",
+          value: Constants.PreferenceEncumbranceTypeEnum.NONE,
+        },
+        {
+          label: "Variant Encumbrance",
+          value: Constants.PreferenceEncumbranceTypeEnum.VARIANT,
+        },
+      ],
+      initialOptionRemoved: true,
+      block: true,
+    },
+  ],
+  [SettingsContextsEnum.FEATURES]: [
+    {
+      heading: "Use Feat Prerequisites",
+      description:
+        "Allow or restrict available feats based on rule prerequisites for this character",
+      key: "enforceFeatRules",
+      type: SettingsTypeEnum.TOGGLE,
+    },
+  ],
+};
+
+function generateSettingsContexts(
+  featureFlagInfo: FeatureFlagInfo
+): SettingsContexts {
+  const rulesEngineConfig = ConfigUtils.getCurrentRulesEngineConfig();
+  if (rulesEngineConfig.canUseCurrencyContainers) {
+    return {
+      ...SETTINGS_CONTEXTS,
+      COIN: [...SETTINGS_CONTEXTS.COIN, ENABLE_CONTAINER_CURRENCY],
+    };
+  }
+  return SETTINGS_CONTEXTS;
+}
+
+interface Props extends DispatchProp {
+  // Figure out if this is right
+  preferences: CharacterPreferences;
+  identifiers: PaneIdentifiersSettingsContext;
+  featureFlagInfo: FeatureFlagInfo;
+}
+
+const SettingsPane: React.FC<Props> = ({
+  identifiers: { context },
+  preferences,
+  dispatch,
+  featureFlagInfo,
+}) => {
+  const contexts = generateSettingsContexts(featureFlagInfo);
+  return (
+    <div className="ct-settings-pane">
+      <Header>Settings</Header>
+      {contexts[context]
+        ? contexts[context].map((setting) => {
+            switch (setting.type) {
+              case SettingsTypeEnum.TOGGLE:
+                return (
+                  <PreferencesPaneToggleField
+                    key={setting.key}
+                    heading={setting.heading}
+                    description={setting.description}
+                    initiallyEnabled={preferences[setting.key]}
+                    onChange={(value) => {
+                      const typedPrefKey = CharacterUtils.getPreferenceKey(
+                        setting.key
+                      );
+                      if (typedPrefKey !== null) {
+                        dispatch(
+                          characterActions.preferenceChoose(typedPrefKey, value)
+                        );
+                      }
+                    }}
+                  />
+                );
+              case SettingsTypeEnum.SELECT:
+                return (
+                  <PreferencesPaneSelectField
+                    key={setting.key}
+                    heading={setting.heading}
+                    description={setting.description}
+                    onChange={(value) => {
+                      const typedPrefKey = CharacterUtils.getPreferenceKey(
+                        setting.key
+                      );
+                      if (typedPrefKey !== null) {
+                        dispatch(
+                          characterActions.preferenceChoose(typedPrefKey, value)
+                        );
+                      }
+                    }}
+                    initialOptionRemoved={setting.initialOptionRemoved}
+                    options={setting.options}
+                    initialValue={preferences[setting.key]}
+                    block={setting.block}
+                  />
+                );
+              default:
+                return null;
+            }
+          })
+        : null}
+    </div>
+  );
+};
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    preferences: rulesEngineSelectors.getCharacterPreferences(state),
+    featureFlagInfo: featureFlagInfoSelectors.getFeatureFlagInfo(state),
+  };
+}
+
+export default connect(mapStateToProps)(SettingsPane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/SettingsPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/SettingsPane/index.ts
new file mode 100644
index 0000000..7320459
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SettingsPane/index.ts
@@ -0,0 +1,4 @@
+import SettingsPane from "./SettingsPane";
+
+export default SettingsPane;
+export { SettingsPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/SettingsPane/typings.ts b/ddb_main/tools/js/Shared/containers/panes/SettingsPane/typings.ts
new file mode 100644
index 0000000..71b2ea3
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SettingsPane/typings.ts
@@ -0,0 +1,29 @@
+import { HtmlSelectOption } from "@dndbeyond/character-rules-engine/es";
+
+export enum SettingsContextsEnum {
+  COIN = "COIN",
+  ENCUMBRANCE = "ENCUMBRANCE",
+  FEATURES = "FEATURES",
+}
+
+export enum SettingsTypeEnum {
+  TOGGLE = "TOGGLE",
+  SELECT = "SELECT",
+}
+
+export interface SettingsToggle {
+  heading: string;
+  description: string;
+  key: string;
+  type: SettingsTypeEnum;
+}
+
+export interface SettingsSelect extends SettingsToggle {
+  options: Array<HtmlSelectOption>;
+  initialOptionRemoved: boolean;
+  block: boolean;
+}
+
+export type SettingsContexts = {
+  [key in SettingsContextsEnum]: Array<SettingsToggle | SettingsSelect>;
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/ShareUrlPane/ShareUrlPane.tsx b/ddb_main/tools/js/Shared/containers/panes/ShareUrlPane/ShareUrlPane.tsx
new file mode 100644
index 0000000..897681a
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ShareUrlPane/ShareUrlPane.tsx
@@ -0,0 +1,83 @@
+import { FC, HTMLAttributes, useEffect, useRef, useState } from "react";
+import { useDispatch } from "react-redux";
+
+import {
+  LoadingPlaceholder,
+  ThemedShareSvg,
+} from "@dndbeyond/character-components/es";
+import {
+  ApiAdapterUtils,
+  ApiRequests,
+  characterActions,
+} from "@dndbeyond/character-rules-engine";
+
+import { useCharacterEngine } from "~/hooks/useCharacterEngine";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+
+import { ClipboardUtils } from "../../../utils";
+
+interface Props extends HTMLAttributes<HTMLDivElement> {}
+export const ShareUrlPane: FC<Props> = ({ ...props }) => {
+  const dispatch = useDispatch();
+  const urlInput = useRef<HTMLInputElement>(null);
+  const { characterTheme } = useCharacterEngine();
+
+  const [shareUrl, setShareUrl] = useState<string | null>(null);
+  const [hasCopied, setHasCopied] = useState(false);
+  const [isLoading, setIsLoading] = useState(true);
+
+  useEffect(() => {
+    const getShareUrl = async () => {
+      const response = await ApiRequests.getCharacterShareUrl();
+      const shareUrl = ApiAdapterUtils.getResponseData(response);
+
+      if (shareUrl) {
+        setIsLoading(false);
+        dispatch(characterActions.SendSocialImageData());
+      }
+      setShareUrl(shareUrl);
+    };
+
+    getShareUrl();
+  }, []);
+
+  useEffect(() => {
+    if (shareUrl) {
+      selectUrlInput();
+    }
+  }, [shareUrl]);
+
+  const selectUrlInput = (): void => {
+    if (urlInput.current) {
+      urlInput.current.focus();
+      urlInput.current.setSelectionRange(0, urlInput.current.value.length);
+    }
+  };
+
+  const handleClick = (evt: React.MouseEvent): void => {
+    ClipboardUtils.copyTextToClipboard(shareUrl === null ? "" : shareUrl);
+    setHasCopied(true);
+  };
+
+  return (
+    <div className="ct-share-url-pane" {...props}>
+      <div className="ct-share-url-pane__splash-icon">
+        <ThemedShareSvg theme={characterTheme} />
+      </div>
+      <Header>Shareable Link Generated</Header>
+      <div className="ct-share-url-pane__url">
+        <input
+          type="text"
+          defaultValue={shareUrl ? shareUrl.replace(/https*:\/\//, "") : ""}
+          readOnly
+          className="ct-share-url-pane__input"
+          ref={urlInput}
+        />
+      </div>
+      {isLoading && <LoadingPlaceholder label={"Loading shareable link..."} />}
+      <div className="ct-share-url-pane__clipboard" onClick={handleClick}>
+        {hasCopied ? <>Copied! &#x2714;</> : "Click to Copy"}
+      </div>
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/Shared/containers/panes/ShortRestPane/ShortRestPane.tsx b/ddb_main/tools/js/Shared/containers/panes/ShortRestPane/ShortRestPane.tsx
new file mode 100644
index 0000000..9088210
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ShortRestPane/ShortRestPane.tsx
@@ -0,0 +1,478 @@
+import axios, { Canceler } from "axios";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  Checkbox,
+  HealingIcon,
+  DigitalDiceWrapper,
+} from "@dndbeyond/character-components/es";
+import {
+  ApiRequests,
+  ApiAdapterUtils,
+  rulesEngineSelectors,
+  characterActions,
+  CharClass,
+  CharacterUtils,
+  ClassUtils,
+  DiceContract,
+  DiceUtils,
+  HitPointInfo,
+  RuleData,
+  ShortModelInfoContract,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+import { RollRequest } from "@dndbeyond/dice";
+import { IRollContext, RollType } from "@dndbeyond/dice";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { RestoreLifeManager } from "~/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/RestoreLifeManager/RestoreLifeManager";
+
+import { toastMessageActions } from "../../../actions/toastMessage";
+import SlotManager from "../../../components/SlotManager";
+import { ThemeButton } from "../../../components/common/Button";
+import {
+  appEnvSelectors,
+  characterRollContextSelectors,
+} from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+import { AppLoggerUtils } from "../../../utils";
+
+interface Props extends DispatchProp {
+  classes: Array<CharClass>;
+  conModifier: number | null;
+  ruleData: RuleData;
+  isDead: boolean;
+  theme: CharacterTheme;
+  diceEnabled: boolean;
+  characterRollContext: IRollContext;
+  hitPointInfo: HitPointInfo;
+}
+interface State {
+  restMessage: string | null;
+  hitDiceUsed: Record<number, number>;
+  originalHitDiceUsed: Record<number, number>;
+  resetMaxHpModifier: boolean;
+  currentHitDiceCount: Record<number, number>;
+  healCharacterOnHitDieRoll: boolean;
+  hitDiceSlotsEnabled: boolean;
+}
+
+class ShortRestPane extends React.PureComponent<Props, State> {
+  loadMessageCanceler: null | Canceler = null;
+  clickReferences: Record<number, HTMLDivElement> = {};
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      restMessage: null,
+      hitDiceUsed: this.getHitDiceUsedLookup(props),
+      originalHitDiceUsed: this.getHitDiceUsedLookup(props),
+      resetMaxHpModifier: false,
+      healCharacterOnHitDieRoll: true,
+      currentHitDiceCount: this.getNewHitDiceLookup(props),
+      hitDiceSlotsEnabled: true,
+    };
+  }
+
+  componentDidMount() {
+    this.loadShortRestMessage();
+  }
+
+  componentWillUnmount(): void {
+    if (this.loadMessageCanceler !== null) {
+      this.loadMessageCanceler();
+    }
+    Object.keys(this.clickReferences).forEach((reference) => {
+      this.clickReferences[reference]?.children[0]?.removeEventListener(
+        "click",
+        this.setHitDiceSlotsEnabledFalse.bind(this)
+      );
+    });
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { classes } = this.props;
+
+    if (classes !== prevProps.classes) {
+      this.setState({
+        hitDiceUsed: this.getHitDiceUsedLookup(this.props),
+      });
+
+      this.loadShortRestMessage();
+    }
+  }
+
+  loadShortRestMessage = (): void => {
+    if (this.loadMessageCanceler !== null) {
+      this.loadMessageCanceler();
+    }
+
+    ApiRequests.getCharacterRestShort({
+      cancelToken: new axios.CancelToken((c) => {
+        this.loadMessageCanceler = c;
+      }),
+    })
+      .then((response) => {
+        let message = ApiAdapterUtils.getResponseData(response);
+        if (message !== null) {
+          this.setState({
+            restMessage: message,
+          });
+        }
+        this.loadMessageCanceler = null;
+      })
+      .catch(AppLoggerUtils.handleAdhocApiError);
+  };
+
+  getHitDiceUsedLookup = (props: Props): Record<number, number> => {
+    return props.classes.reduce((acc: Record<number, number>, charClass) => {
+      acc[ClassUtils.getMappingId(charClass)] = charClass.hitDiceUsed;
+      return acc;
+    }, {});
+  };
+
+  getNewHitDiceLookup = (props: Props): Record<number, number> => {
+    return props.classes.reduce((acc: Record<number, number>, charClass) => {
+      acc[ClassUtils.getMappingId(charClass)] = 0;
+      return acc;
+    }, {});
+  };
+
+  handleReset = (): void => {
+    this.setState({
+      hitDiceUsed: this.getHitDiceUsedLookup(this.props),
+      resetMaxHpModifier: false,
+      originalHitDiceUsed: this.getHitDiceUsedLookup(this.props),
+      currentHitDiceCount: this.getNewHitDiceLookup(this.props),
+    });
+  };
+
+  handleSave = (): void => {
+    const { hitDiceUsed, resetMaxHpModifier } = this.state;
+    const { dispatch } = this.props;
+
+    this.setState({
+      originalHitDiceUsed: hitDiceUsed,
+      currentHitDiceCount: this.getNewHitDiceLookup(this.props),
+    });
+
+    dispatch(characterActions.shortRest(hitDiceUsed, resetMaxHpModifier));
+    dispatch(
+      toastMessageActions.toastSuccess(
+        "Short Rest Taken",
+        "You have completed a short rest. Relevant abilities have been reset."
+      )
+    );
+  };
+
+  handleSlotSet = (classMappingId: number, uses: number): void => {
+    this.setState((prevState: State) => ({
+      hitDiceUsed: {
+        ...prevState.hitDiceUsed,
+        [classMappingId]: uses,
+      },
+      currentHitDiceCount: {
+        ...prevState.currentHitDiceCount,
+        [classMappingId]: uses - prevState.originalHitDiceUsed[classMappingId],
+      },
+    }));
+  };
+
+  handleResetMaxHpChange = (isEnabled: boolean): void => {
+    this.setState({
+      resetMaxHpModifier: isEnabled,
+    });
+  };
+
+  handleHealCharacterOnHitDieRoll = (isEnabled: boolean): void => {
+    this.setState({
+      healCharacterOnHitDieRoll: isEnabled,
+    });
+  };
+
+  handleRestoreToLife = (restoreType: ShortModelInfoContract): void => {
+    const { dispatch } = this.props;
+
+    const restoreChoice: string = restoreType.name === "Full" ? "full" : "1";
+
+    dispatch(characterActions.restoreLife(restoreType.id));
+    dispatch(
+      toastMessageActions.toastSuccess(
+        "Character Restored to Life",
+        `You have been restored to life with ${restoreChoice} HP.`
+      )
+    );
+  };
+
+  renderRecover = (): React.ReactNode => {
+    const { resetMaxHpModifier, restMessage, healCharacterOnHitDieRoll } =
+      this.state;
+    const { isDead, diceEnabled } = this.props;
+
+    if (isDead) {
+      return (
+        <div className="ct-reset-pane__recover-sources">
+          Your character is dead
+        </div>
+      );
+    }
+
+    return (
+      <React.Fragment>
+        <div className="ct-reset-pane__recover-sources">
+          {restMessage === null
+            ? "Asking the server what will be reset..."
+            : restMessage}
+        </div>
+        <div className="ct-reset-pane__recover-max-hp">
+          <Checkbox
+            label="Reset Maximum HP changes during this rest"
+            initiallyEnabled={resetMaxHpModifier}
+            onChange={this.handleResetMaxHpChange}
+          />
+          {diceEnabled && (
+            <Checkbox
+              label="Automatically apply healing with dice result"
+              initiallyEnabled={healCharacterOnHitDieRoll}
+              onChange={this.handleHealCharacterOnHitDieRoll}
+            />
+          )}
+        </div>
+      </React.Fragment>
+    );
+  };
+
+  setHitDiceSlotsEnabledFalse = (): void => {
+    this.setState({ hitDiceSlotsEnabled: false });
+  };
+
+  renderHitDice = (): React.ReactNode => {
+    const {
+      hitDiceUsed,
+      currentHitDiceCount,
+      healCharacterOnHitDieRoll,
+      hitDiceSlotsEnabled,
+    } = this.state;
+    const {
+      classes,
+      conModifier,
+      isDead,
+      diceEnabled,
+      characterRollContext,
+      theme,
+      dispatch,
+      hitPointInfo,
+    } = this.props;
+
+    const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+      this.context;
+
+    if (isDead) {
+      return null;
+    }
+
+    return (
+      <div className="ct-reset-pane__hitdice">
+        {classes.map((charClass) => {
+          let hitDice: DiceContract = {
+            diceCount: 1,
+            diceValue: ClassUtils.getHitDiceType(charClass),
+            fixedValue: conModifier,
+            diceMultiplier: null,
+            diceString: null,
+          };
+
+          return (
+            <div key={charClass.id} className="ct-reset-pane__hitdie">
+              <div className="ct-reset-pane__hitdie-heading">
+                <span className="ct-reset-pane__hitdie-heading-class">
+                  {ClassUtils.getName(charClass)}
+                </span>
+                (Hit Die: {DiceUtils.renderDice(hitDice)} &bull; Total:{" "}
+                {ClassUtils.getLevel(charClass)})
+              </div>
+              <div className="ct-reset-pane__hitdie-manager">
+                <SlotManager
+                  available={ClassUtils.getLevel(charClass)}
+                  used={hitDiceUsed[ClassUtils.getMappingId(charClass)]}
+                  onSet={
+                    hitDiceSlotsEnabled
+                      ? this.handleSlotSet.bind(
+                          this,
+                          ClassUtils.getMappingId(charClass)
+                        )
+                      : () => {}
+                  }
+                  size="small"
+                  isInteractive={hitDiceSlotsEnabled}
+                />
+                {diceEnabled &&
+                  currentHitDiceCount[ClassUtils.getMappingId(charClass)] > 0 &&
+                  conModifier !== null && (
+                    <div
+                      ref={(ref) => {
+                        if (ref) {
+                          ref.children[0]?.addEventListener(
+                            "click",
+                            this.setHitDiceSlotsEnabledFalse.bind(this)
+                          );
+
+                          this.clickReferences[
+                            ClassUtils.getMappingId(charClass)
+                          ] = ref;
+                        }
+
+                        return ref;
+                      }}
+                      className="ct-reset-pane__hitdie-manager-dice"
+                    >
+                      <DigitalDiceWrapper
+                        useAdvancedMenu={false}
+                        diceNotation={DiceUtils.renderDice({
+                          ...hitDice,
+                          diceCount:
+                            currentHitDiceCount[
+                              ClassUtils.getMappingId(charClass)
+                            ],
+                          fixedValue:
+                            currentHitDiceCount[
+                              ClassUtils.getMappingId(charClass)
+                            ] * conModifier,
+                        })}
+                        onRollResults={(rollRequest: RollRequest) => {
+                          if (
+                            healCharacterOnHitDieRoll &&
+                            rollRequest.rolls[0]?.result?.total
+                          ) {
+                            const { newTemp, newRemovedHp, startHp, newHp } =
+                              CharacterUtils.calculateHitPoints(
+                                hitPointInfo,
+                                rollRequest.rolls[0].result.total
+                              );
+                            if (newHp >= startHp) {
+                              dispatch(
+                                characterActions.hitPointsSet(
+                                  newRemovedHp,
+                                  newTemp
+                                )
+                              );
+                            }
+                          }
+                          this.setState((state) => {
+                            return {
+                              originalHitDiceUsed: state.hitDiceUsed,
+                              currentHitDiceCount: {
+                                ...state.currentHitDiceCount,
+                                [ClassUtils.getMappingId(charClass)]: 0,
+                              },
+                              hitDiceSlotsEnabled: true,
+                            };
+                          });
+                        }}
+                        rollType={RollType.Heal}
+                        rollAction={"Hit Dice"}
+                        diceEnabled={diceEnabled}
+                        rollContext={characterRollContext}
+                        rollTargetOptions={
+                          messageTargetOptions
+                            ? Object.values(messageTargetOptions?.entities)
+                            : undefined
+                        }
+                        rollTargetDefault={defaultMessageTargetOption}
+                        userId={userId}
+                      >
+                        {DiceUtils.renderDice({
+                          ...hitDice,
+                          diceCount:
+                            currentHitDiceCount[
+                              ClassUtils.getMappingId(charClass)
+                            ],
+                          fixedValue:
+                            currentHitDiceCount[
+                              ClassUtils.getMappingId(charClass)
+                            ] * conModifier,
+                        })}{" "}
+                        <HealingIcon theme={theme} isHp={true} />
+                      </DigitalDiceWrapper>
+                    </div>
+                  )}
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    );
+  };
+
+  renderActions = (): React.ReactNode => {
+    const { isDead, ruleData, theme } = this.props;
+
+    if (isDead) {
+      return (
+        <React.Fragment>
+          <RestoreLifeManager onSave={this.handleRestoreToLife} />
+        </React.Fragment>
+      );
+    }
+
+    return (
+      <div className="ct-reset-pane__actions">
+        <div className="ct-reset-pane__action">
+          <ThemeButton onClick={this.handleSave} enableConfirm={true}>
+            Take Short Rest
+          </ThemeButton>
+        </div>
+        <div className="ct-reset-pane__action">
+          <ThemeButton onClick={this.handleReset} style="outline">
+            Reset
+          </ThemeButton>
+        </div>
+      </div>
+    );
+  };
+
+  render() {
+    return (
+      <div className="ct-reset-pane">
+        <Header>Short Rest</Header>
+
+        <div className="ct-reset-pane__intro">
+          A short rest is a period of downtime, at least 1 hour long, during
+          which a character does nothing more strenuous than eating, drinking,
+          reading, and tending to wounds.
+        </div>
+
+        <div className="ct-reset-pane__recover">
+          <div className="ct-reset-pane__recover-heading">Recover</div>
+          {this.renderRecover()}
+        </div>
+        {this.renderHitDice()}
+        {this.renderActions()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    classes: rulesEngineSelectors.getClasses(state),
+    conModifier: rulesEngineSelectors.getConModifier(state),
+    isDead: rulesEngineSelectors.isDead(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+    diceEnabled: appEnvSelectors.getDiceEnabled(state),
+    characterRollContext:
+      characterRollContextSelectors.getCharacterRollContext(state),
+    hitPointInfo: rulesEngineSelectors.getHitPointInfo(state),
+  };
+}
+
+ShortRestPane.contextType = GameLogContext;
+
+export default connect(mapStateToProps)(ShortRestPane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/ShortRestPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/ShortRestPane/index.ts
new file mode 100644
index 0000000..1448bf4
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/ShortRestPane/index.ts
@@ -0,0 +1,4 @@
+import ShortRestPane from "./ShortRestPane";
+
+export default ShortRestPane;
+export { ShortRestPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/SkillPane/SkillPane.tsx b/ddb_main/tools/js/Shared/containers/panes/SkillPane/SkillPane.tsx
new file mode 100644
index 0000000..4af02f1
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SkillPane/SkillPane.tsx
@@ -0,0 +1,273 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  Collapsible,
+  ProficiencyLevelIcon,
+} from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  CharacterTheme,
+  Constants,
+  DataOrigin,
+  DiceAdjustment,
+  EntityValueLookup,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  Skill,
+  SkillUtils,
+  ValueUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { getDataOriginComponentInfo } from "~/subApps/sheet/components/Sidebar/helpers/paneUtils";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersSkill,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { PaneInitFailureContent } from "../../../../../../subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import DiceAdjustmentSummary from "../../../components/DiceAdjustmentSummary";
+import EditorBox from "../../../components/EditorBox";
+import ValueEditor from "../../../components/ValueEditor";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+
+interface Props extends DispatchProp {
+  skills: Array<Skill>;
+  ruleData: RuleData;
+  entityValueLookup: EntityValueLookup;
+  identifiers: PaneIdentifiersSkill | null;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  paneHistoryPush: PaneInfo["paneHistoryPush"];
+}
+interface State {
+  skill: Skill | null;
+}
+class SkillPane extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = this.generateStateData(props);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { skills, identifiers } = this.props;
+
+    if (skills !== prevProps.skills || identifiers !== prevProps.identifiers) {
+      this.setState(this.generateStateData(this.props));
+    }
+  }
+
+  generateStateData = (props: Props): State => {
+    const { skills, identifiers } = props;
+
+    let foundSkill: Skill | null | undefined = null;
+    if (identifiers !== null) {
+      foundSkill = skills.find(
+        (skill) => identifiers.id === SkillUtils.getId(skill)
+      );
+    }
+    return {
+      skill: foundSkill ? foundSkill : null,
+    };
+  };
+
+  handleSkillsManageShow = (): void => {
+    const { paneHistoryPush } = this.props;
+
+    paneHistoryPush(PaneComponentEnum.SKILLS);
+  };
+
+  handleCustomDataUpdate = (
+    key: number,
+    value: any,
+    source: string | null
+  ): void => {
+    const { skill } = this.state;
+    const { dispatch } = this.props;
+
+    if (skill) {
+      dispatch(
+        characterActions.valueSet(
+          key,
+          value,
+          source,
+          ValueUtils.hack__toString(SkillUtils.getId(skill)),
+          ValueUtils.hack__toString(SkillUtils.getEntityTypeId(skill))
+        )
+      );
+    }
+  };
+
+  handleDataOriginClick = (dataOrigin: DataOrigin): void => {
+    const { paneHistoryPush } = this.props;
+
+    let component = getDataOriginComponentInfo(dataOrigin);
+    if (component.type !== PaneComponentEnum.ERROR_404) {
+      paneHistoryPush(component.type, component.identifiers);
+    }
+  };
+
+  renderCustomize = (): React.ReactNode => {
+    const { skill } = this.state;
+    const { entityValueLookup, ruleData, isReadonly } = this.props;
+
+    if (isReadonly) {
+      return null;
+    }
+
+    if (skill === null) {
+      return null;
+    }
+
+    return (
+      <Collapsible
+        layoutType={"minimal"}
+        className="ct-skill-pane__customize"
+        header="Customize"
+      >
+        <EditorBox>
+          <ValueEditor
+            dataLookup={ValueUtils.getEntityData(
+              entityValueLookup,
+              ValueUtils.hack__toString(SkillUtils.getId(skill)),
+              ValueUtils.hack__toString(SkillUtils.getEntityTypeId(skill))
+            )}
+            onDataUpdate={this.handleCustomDataUpdate}
+            valueEditors={[
+              Constants.AdjustmentTypeEnum.SKILL_OVERRIDE,
+              Constants.AdjustmentTypeEnum.SKILL_MAGIC_BONUS,
+              Constants.AdjustmentTypeEnum.SKILL_MISC_BONUS,
+              Constants.AdjustmentTypeEnum.SKILL_PROFICIENCY_LEVEL,
+              Constants.AdjustmentTypeEnum.SKILL_STAT_OVERRIDE,
+            ]}
+            ruleData={ruleData}
+          />
+        </EditorBox>
+      </Collapsible>
+    );
+  };
+
+  renderDiceAdjustmentList = (
+    diceAdjustments: Array<DiceAdjustment>
+  ): React.ReactNode => {
+    const { ruleData, theme } = this.props;
+
+    if (!diceAdjustments.length) {
+      return null;
+    }
+
+    return (
+      <React.Fragment>
+        {diceAdjustments.map((diceAdjustment, idx) => {
+          return (
+            <DiceAdjustmentSummary
+              key={diceAdjustment.uniqueKey}
+              diceAdjustment={diceAdjustment}
+              ruleData={ruleData}
+              theme={theme}
+              onDataOriginClick={this.handleDataOriginClick}
+            />
+          );
+        })}
+      </React.Fragment>
+    );
+  };
+
+  renderDiceAdjustments = (): React.ReactNode => {
+    const { skill } = this.state;
+
+    if (skill === null) {
+      return null;
+    }
+
+    const advantageAdjustments = SkillUtils.getAdvantageAdjustments(skill);
+    const disadvantageAdjustments =
+      SkillUtils.getDisadvantageAdjustments(skill);
+    if (!advantageAdjustments.length && !disadvantageAdjustments.length) {
+      return null;
+    }
+
+    return (
+      <div className="ct-skill-pane__dice-adjustments">
+        {this.renderDiceAdjustmentList(advantageAdjustments)}
+        {this.renderDiceAdjustmentList(disadvantageAdjustments)}
+      </div>
+    );
+  };
+
+  render() {
+    const { skill } = this.state;
+    const { ruleData, theme } = this.props;
+
+    if (skill === null) {
+      return <PaneInitFailureContent />;
+    }
+
+    const modifier = SkillUtils.getModifier(skill);
+
+    return (
+      <div className="ct-skill-pane" key={SkillUtils.getId(skill)}>
+        <Header parent="Skills" onClick={this.handleSkillsManageShow}>
+          <div className="ct-skill-pane__header">
+            <div className="ct-skill-pane__header-icon">
+              <ProficiencyLevelIcon
+                theme={theme}
+                proficiencyLevel={SkillUtils.getProficiencyLevel(skill)}
+              />
+            </div>
+            <div className="ct-skill-pane__header-ability">
+              {RuleDataUtils.getAbilityShortName(
+                SkillUtils.getStat(skill),
+                ruleData
+              )}
+            </div>
+            <div className="ct-skill-pane__header-name">
+              {SkillUtils.getName(skill)}
+            </div>
+            <div className="ct-skill-pane__header-modifier">
+              <NumberDisplay type="signed" number={modifier} />
+            </div>
+          </div>
+        </Header>
+        {this.renderCustomize()}
+        {this.renderDiceAdjustments()}
+        <HtmlContent
+          className="ct-skill-pane__description"
+          html={SkillUtils.getDescription(skill) ?? ""}
+          withoutTooltips
+        />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    skills: rulesEngineSelectors.getSkills(state),
+    entityValueLookup:
+      rulesEngineSelectors.getCharacterValueLookupByEntity(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+  };
+}
+
+const SkillPaneContainer = (props) => {
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+
+  return <SkillPane {...props} paneHistoryPush={paneHistoryPush} />;
+};
+
+export default connect(mapStateToProps)(SkillPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/SkillPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/SkillPane/index.ts
new file mode 100644
index 0000000..c54b030
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SkillPane/index.ts
@@ -0,0 +1,4 @@
+import SkillPane from "./SkillPane";
+
+export default SkillPane;
+export { SkillPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/SkillsPane/SkillsPane.tsx b/ddb_main/tools/js/Shared/containers/panes/SkillsPane/SkillsPane.tsx
new file mode 100644
index 0000000..8cf3d4e
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SkillsPane/SkillsPane.tsx
@@ -0,0 +1,249 @@
+import { orderBy } from "lodash";
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  Collapsible,
+  ProficiencyLevelIcon,
+} from "@dndbeyond/character-components/es";
+import {
+  rulesEngineSelectors,
+  characterActions,
+  Constants,
+  RuleData,
+  RuleDataUtils,
+  Skill,
+  SkillUtils,
+  ValueLookup,
+  ValueUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Link } from "~/components/Link";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { PaneComponentEnum } from "~/subApps/sheet/components/Sidebar/types";
+
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+import { PaneIdentifierUtils } from "../../../utils";
+
+interface Props extends DispatchProp {
+  skills: Array<Skill>;
+  customSkills: Array<Skill>;
+  ruleData: RuleData;
+  valueLookup: ValueLookup;
+  proficiencyBonus: number;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+  paneHistoryPush: PaneInfo["paneHistoryPush"];
+}
+class SkillsPane extends React.PureComponent<Props> {
+  handleCustomSkillClick = (skill: Skill): void => {
+    const { paneHistoryPush } = this.props;
+
+    paneHistoryPush(
+      PaneComponentEnum.CUSTOM_SKILL,
+      PaneIdentifierUtils.generateCustomSkill(SkillUtils.getId(skill))
+    );
+  };
+
+  handleSkillAdd = (): void => {
+    const { dispatch, customSkills } = this.props;
+
+    dispatch(
+      characterActions.customProficiencyCreate(
+        `Custom Skill ${customSkills.length + 1}`,
+        Constants.CustomProficiencyTypeEnum.SKILL
+      )
+    );
+  };
+
+  handleDataUpdate = (id: number, properties: Record<string, any>): void => {
+    const { dispatch } = this.props;
+
+    dispatch(characterActions.customProficiencySet(id, properties));
+  };
+
+  handleSkillClick = (skill: Skill, evt: React.MouseEvent): void => {
+    const { paneHistoryPush } = this.props;
+
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+
+    paneHistoryPush(
+      PaneComponentEnum.SKILL,
+      PaneIdentifierUtils.generateSkill(SkillUtils.getId(skill))
+    );
+  };
+
+  renderCustomSkills = (): React.ReactNode => {
+    const { customSkills, ruleData, isReadonly, theme } = this.props;
+
+    return (
+      <Collapsible header="Custom Skills">
+        <div className="ct-skills-pane__custom">
+          <div className="ct-skills-pane__custom-skills">
+            {customSkills.map((skill) => {
+              const id = SkillUtils.getId(skill);
+              const modifier = SkillUtils.getModifier(skill);
+              const statName = RuleDataUtils.getAbilityShortName(
+                SkillUtils.getStat(skill),
+                ruleData
+              );
+              const proficiencyLevel = SkillUtils.getProficiencyLevel(skill);
+              const name = SkillUtils.getName(skill);
+
+              return (
+                <div
+                  key={id}
+                  className="ct-skills__item"
+                  onClick={this.handleCustomSkillClick.bind(this, skill)}
+                >
+                  <div className="ct-skills__col--proficiency">
+                    <ProficiencyLevelIcon
+                      theme={theme}
+                      proficiencyLevel={proficiencyLevel}
+                    />
+                  </div>
+                  <div className="ct-skills__col--stat">
+                    {statName === null ? "--" : statName}
+                  </div>
+                  <div className="ct-skills__col--skill">{name}</div>
+                  <div className={"ct-skills__col--modifier"}>
+                    <NumberDisplay type="signed" number={modifier} />
+                  </div>
+                </div>
+              );
+            })}
+          </div>
+          {!isReadonly && (
+            <div className="ct-skills-pane__custom-add">
+              <Link useTheme={true} onClick={this.handleSkillAdd}>
+                + Add Custom Skill
+              </Link>
+            </div>
+          )}
+        </div>
+      </Collapsible>
+    );
+  };
+
+  renderSkills = (): React.ReactNode => {
+    const { skills, ruleData, valueLookup, theme } = this.props;
+
+    let statsLookup = RuleDataUtils.getStatsLookup(ruleData);
+    let orderedSkills = orderBy(skills, (skill) => skill.name);
+
+    return (
+      <Collapsible header="Skills" initiallyCollapsed={false}>
+        <div className="ct-skills-pane__skills">
+          {orderedSkills.map((skill) => {
+            let valueTypes: Array<Constants.AdjustmentTypeEnum> = [
+              Constants.AdjustmentTypeEnum.SKILL_STAT_OVERRIDE,
+              Constants.AdjustmentTypeEnum.SKILL_PROFICIENCY_LEVEL,
+              Constants.AdjustmentTypeEnum.SKILL_MISC_BONUS,
+              Constants.AdjustmentTypeEnum.SKILL_MAGIC_BONUS,
+              Constants.AdjustmentTypeEnum.SKILL_OVERRIDE,
+            ];
+            let valueDataLookup = ValueUtils.getDataLookup(
+              valueLookup,
+              valueTypes,
+              ValueUtils.hack__toString(skill.id),
+              ValueUtils.hack__toString(skill.entityTypeId)
+            );
+            let hasModifiedLevel = valueDataLookup.hasOwnProperty(
+              Constants.AdjustmentTypeEnum.SKILL_PROFICIENCY_LEVEL
+            );
+            let hasModifiedValue =
+              valueDataLookup.hasOwnProperty(
+                Constants.AdjustmentTypeEnum.SKILL_OVERRIDE
+              ) ||
+              valueDataLookup.hasOwnProperty(
+                Constants.AdjustmentTypeEnum.SKILL_MAGIC_BONUS
+              ) ||
+              valueDataLookup.hasOwnProperty(
+                Constants.AdjustmentTypeEnum.SKILL_MISC_BONUS
+              );
+
+            let statClassNames: Array<string> = ["ct-skills__col--stat"];
+            if (
+              valueDataLookup.hasOwnProperty(
+                Constants.AdjustmentTypeEnum.SKILL_STAT_OVERRIDE
+              )
+            ) {
+              statClassNames.push("ct-skills__col--stat-modified");
+            }
+            let modifierClassNames: Array<string> = [
+              "ct-skills__col--modifier",
+            ];
+            if (hasModifiedValue) {
+              modifierClassNames.push("ct-skills__col--modifier-modified");
+            }
+            const id = SkillUtils.getId(skill);
+            const modifier = SkillUtils.getModifier(skill);
+            const statName = RuleDataUtils.getAbilityShortName(
+              SkillUtils.getStat(skill),
+              ruleData
+            );
+            const proficiencyLevel = SkillUtils.getProficiencyLevel(skill);
+            const name = SkillUtils.getName(skill);
+
+            return (
+              <div
+                key={id}
+                className="ct-skills__item"
+                onClick={this.handleSkillClick.bind(this, skill)}
+              >
+                <div className="ct-skills__col--proficiency">
+                  <ProficiencyLevelIcon
+                    theme={theme}
+                    isModified={hasModifiedLevel}
+                    proficiencyLevel={proficiencyLevel}
+                  />
+                </div>
+                <div className={statClassNames.join(" ")}>{statName}</div>
+                <div className="ct-skills__col--skill">{name}</div>
+                <div className={modifierClassNames.join(" ")}>
+                  <NumberDisplay type="signed" number={modifier} />
+                </div>
+              </div>
+            );
+          })}
+        </div>
+      </Collapsible>
+    );
+  };
+
+  render() {
+    return (
+      <div className="ct-skills-pane">
+        <Header>All Skills</Header>
+        {this.renderSkills()}
+        {this.renderCustomSkills()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+    skills: rulesEngineSelectors.getSkills(state),
+    customSkills: rulesEngineSelectors.getCustomSkills(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    valueLookup: rulesEngineSelectors.getCharacterValueLookup(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+  };
+}
+
+const SkillsPaneContainer = (props) => {
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  return <SkillsPane paneHistoryPush={paneHistoryPush} {...props} />;
+};
+
+export default connect(mapStateToProps)(SkillsPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/SkillsPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/SkillsPane/index.ts
new file mode 100644
index 0000000..6d989cf
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SkillsPane/index.ts
@@ -0,0 +1,4 @@
+import SkillsPane from "./SkillsPane";
+
+export default SkillsPane;
+export { SkillsPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/SpeciesTraitPane/SpeciesTraitPane.tsx b/ddb_main/tools/js/Shared/containers/panes/SpeciesTraitPane/SpeciesTraitPane.tsx
new file mode 100644
index 0000000..8eb62e0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SpeciesTraitPane/SpeciesTraitPane.tsx
@@ -0,0 +1,267 @@
+import React, { useContext } from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  AbilityLookup,
+  Action,
+  ActionUtils,
+  BaseFeat,
+  characterActions,
+  CharacterFeaturesManager,
+  CharacterTheme,
+  DataOriginRefData,
+  FeatManager,
+  Race,
+  RaceUtils,
+  RacialTrait,
+  RacialTraitUtils,
+  RuleData,
+  rulesEngineSelectors,
+  SnippetData,
+  Spell,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Preview } from "~/subApps/sheet/components/Sidebar/components/Preview";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersRacialTrait,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { PaneInitFailureContent } from "../../../../../../subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import { SpeciesTraitFeatureSnippet } from "../../../../CharacterSheet/components/FeatureSnippet";
+import { CharacterFeaturesManagerContext } from "../../../managers/CharacterFeaturesManagerContext";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+import { PaneIdentifierUtils } from "../../../utils";
+
+interface Props extends DispatchProp {
+  species: Race | null;
+  identifiers: PaneIdentifiersRacialTrait | null;
+  feats: Array<BaseFeat>;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  dataOriginRefData: DataOriginRefData;
+  isReadonly: boolean;
+  proficiencyBonus: number;
+  theme: CharacterTheme;
+  characterFeaturesManager: CharacterFeaturesManager;
+  paneContext: PaneInfo;
+}
+interface State {
+  speciesTrait: RacialTrait | null;
+}
+class SpeciesTraitPane extends React.PureComponent<Props, State> {
+  constructor(props) {
+    super(props);
+
+    this.state = this.generateStateData(props);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { species, identifiers } = this.props;
+
+    if (
+      species !== prevProps.species ||
+      identifiers !== prevProps.identifiers
+    ) {
+      this.setState(this.generateStateData(this.props));
+    }
+  }
+
+  generateStateData = (props: Props): State => {
+    const { species, identifiers } = props;
+
+    let foundSpeciesTrait: RacialTrait | null | undefined = null;
+    if (species !== null && identifiers !== null) {
+      foundSpeciesTrait = RaceUtils.getVisibleRacialTraits(species).find(
+        (speciesTrait) =>
+          identifiers.id === RacialTraitUtils.getId(speciesTrait)
+      );
+    }
+
+    return {
+      speciesTrait: foundSpeciesTrait ? foundSpeciesTrait : null,
+    };
+  };
+
+  handleActionUseSet = (action: Action, uses: number): void => {
+    const { dispatch } = this.props;
+
+    const id = ActionUtils.getId(action);
+    const entityTypeId = ActionUtils.getEntityTypeId(action);
+    if (id !== null && entityTypeId !== null) {
+      dispatch(
+        characterActions.actionUseSet(
+          id,
+          entityTypeId,
+          uses,
+          ActionUtils.getDataOriginType(action)
+        )
+      );
+    }
+  };
+
+  handleSpellUseSet = (spell: Spell, uses: number): void => {
+    const { dispatch } = this.props;
+
+    const mappingId = SpellUtils.getMappingId(spell);
+    const mappingEntityTypeId = SpellUtils.getMappingEntityTypeId(spell);
+    if (mappingId !== null && mappingEntityTypeId !== null) {
+      dispatch(
+        characterActions.spellUseSet(
+          mappingId,
+          mappingEntityTypeId,
+          uses,
+          SpellUtils.getDataOriginType(spell)
+        )
+      );
+    }
+  };
+
+  handleSpellDetailShow = (spell: Spell): void => {
+    const {
+      paneContext: { paneHistoryPush },
+    } = this.props;
+
+    const mappingId = SpellUtils.getMappingId(spell);
+    if (mappingId !== null) {
+      paneHistoryPush(
+        PaneComponentEnum.CHARACTER_SPELL_DETAIL,
+        PaneIdentifierUtils.generateCharacterSpell(mappingId)
+      );
+    }
+  };
+
+  handleSpeciesTraitShow = (speciesTrait: RacialTrait): void => {
+    const {
+      paneContext: { paneHistoryStart },
+    } = this.props;
+    paneHistoryStart(
+      PaneComponentEnum.SPECIES_TRAIT_DETAIL,
+      PaneIdentifierUtils.generateRacialTrait(
+        RacialTraitUtils.getId(speciesTrait)
+      )
+    );
+  };
+
+  handleActionShow = (action: Action): void => {
+    const {
+      paneContext: { paneHistoryPush },
+    } = this.props;
+
+    const mappingId = ActionUtils.getMappingId(action);
+    const mappingEntityTypeId = ActionUtils.getMappingEntityTypeId(action);
+    if (mappingId !== null && mappingEntityTypeId !== null) {
+      paneHistoryPush(
+        PaneComponentEnum.ACTION,
+        PaneIdentifierUtils.generateAction(mappingId, mappingEntityTypeId)
+      );
+    }
+  };
+
+  handleFeatShow = (feat: FeatManager): void => {
+    const {
+      paneContext: { paneHistoryPush },
+    } = this.props;
+    paneHistoryPush(
+      PaneComponentEnum.FEAT_DETAIL,
+      PaneIdentifierUtils.generateFeat(feat.getId())
+    );
+  };
+
+  render() {
+    const { speciesTrait } = this.state;
+    const {
+      species,
+      feats,
+      abilityLookup,
+      snippetData,
+      ruleData,
+      dataOriginRefData,
+      isReadonly,
+      proficiencyBonus,
+      theme,
+      characterFeaturesManager,
+    } = this.props;
+
+    if (species === null || speciesTrait === null) {
+      return <PaneInitFailureContent />;
+    }
+
+    let fullName = RaceUtils.getFullName(species);
+    let portrait = RaceUtils.getPortraitAvatarUrl(species);
+
+    return (
+      <div
+        className="ct-racial-trait-pane"
+        key={RacialTraitUtils.getId(speciesTrait)}
+      >
+        <Header
+          parent={fullName}
+          preview={portrait && <Preview imageUrl={portrait} />}
+        >
+          {RacialTraitUtils.getName(speciesTrait)}
+        </Header>
+        <SpeciesTraitFeatureSnippet
+          speciesTrait={speciesTrait}
+          onActionUseSet={this.handleActionUseSet}
+          onActionClick={this.handleActionShow}
+          onSpellUseSet={this.handleSpellUseSet}
+          onSpellClick={this.handleSpellDetailShow}
+          onFeatureClick={this.handleSpeciesTraitShow}
+          showHeader={false}
+          showDescription={true}
+          feats={feats}
+          snippetData={snippetData}
+          ruleData={ruleData}
+          abilityLookup={abilityLookup}
+          dataOriginRefData={dataOriginRefData}
+          isReadonly={isReadonly}
+          proficiencyBonus={proficiencyBonus}
+          theme={theme}
+          onFeatClick={this.handleFeatShow}
+          featuresManager={characterFeaturesManager}
+        />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    species: rulesEngineSelectors.getRace(state),
+    feats: rulesEngineSelectors.getBaseFeats(state),
+    snippetData: rulesEngineSelectors.getSnippetData(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    abilityLookup: rulesEngineSelectors.getAbilityLookup(state),
+    dataOriginRefData: rulesEngineSelectors.getDataOriginRefData(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    proficiencyBonus: rulesEngineSelectors.getProficiencyBonus(state),
+  };
+}
+
+const SpeciesTraitPaneWrapper = (props) => {
+  const { characterFeaturesManager } = useContext(
+    CharacterFeaturesManagerContext
+  );
+
+  const { pane } = useSidebar();
+
+  return (
+    <SpeciesTraitPane
+      characterFeaturesManager={characterFeaturesManager}
+      paneContext={pane}
+      {...props}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(SpeciesTraitPaneWrapper);
diff --git a/ddb_main/tools/js/Shared/containers/panes/SpeciesTraitPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/SpeciesTraitPane/index.ts
new file mode 100644
index 0000000..a31ba62
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SpeciesTraitPane/index.ts
@@ -0,0 +1,4 @@
+import SpeciesTraitPane from "./SpeciesTraitPane";
+
+export default SpeciesTraitPane;
+export { SpeciesTraitPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/SpeedManagePane.tsx b/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/SpeedManagePane.tsx
new file mode 100644
index 0000000..2a573a1
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/SpeedManagePane.tsx
@@ -0,0 +1,220 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import { Collapsible, Select } from "@dndbeyond/character-components/es";
+import {
+  characterActions,
+  CharacterPreferences,
+  Constants,
+  CustomSpeedContract,
+  CustomSpeedLookup,
+  HelperUtils,
+  HtmlSelectOption,
+  SpeedInfo,
+  RuleData,
+  RuleDataUtils,
+  rulesEngineSelectors,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+
+import { MOVEMENT_TYPE_LIST } from "../../../constants/App";
+import * as appEnvSelectors from "../../../selectors/appEnv";
+import { SharedAppState } from "../../../stores/typings";
+import SpeedManagePaneCustomizeItem from "./SpeedManagePaneCustomizeItem";
+
+interface Props extends DispatchProp {
+  movements: SpeedInfo;
+  customSpeedLookup: CustomSpeedLookup;
+  customSpeeds: Array<CustomSpeedContract>;
+  preferences: CharacterPreferences;
+  ruleData: RuleData;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+class SpeedManagePane extends React.PureComponent<Props> {
+  handleMovementDisplayChange = (value: string): void => {
+    const { dispatch } = this.props;
+
+    dispatch(
+      characterActions.preferenceChoose(
+        "primaryMovement",
+        HelperUtils.parseInputInt(value)
+      )
+    );
+  };
+
+  handleOverrideUpdate = (
+    id: number,
+    distance: number | null,
+    source: string | null
+  ): void => {
+    const { dispatch, customSpeeds } = this.props;
+
+    if (distance !== null || source !== null) {
+      let foundSpeed: CustomSpeedContract | undefined = customSpeeds.find(
+        (speed) => speed.movementId === id
+      );
+
+      if (foundSpeed) {
+        dispatch(
+          characterActions.movementSet({
+            ...foundSpeed,
+            distance,
+            source,
+          })
+        );
+      } else {
+        let newSpeed: CustomSpeedContract = {
+          movementId: id,
+          distance,
+          source,
+        };
+        dispatch(characterActions.movementAdd(newSpeed));
+      }
+    } else {
+      dispatch(characterActions.movementRemove(id));
+    }
+  };
+
+  renderCustomize = (): React.ReactNode => {
+    const { customSpeedLookup, preferences, isReadonly, ruleData } = this.props;
+
+    if (isReadonly) {
+      return;
+    }
+
+    let movementOptions: Array<HtmlSelectOption> = MOVEMENT_TYPE_LIST.map(
+      (key) => ({
+        label: RuleDataUtils.getMovementDescription(key, ruleData),
+        value: key,
+      })
+    );
+
+    return (
+      <Collapsible
+        layoutType={"minimal"}
+        header="Customize"
+        className="ct-speed-manage-pane__customize"
+      >
+        <Heading>Override Speeds</Heading>
+        <div className="ct-speed-manage-pane__customize-header">
+          <div className="ct-speed-manage-pane__customize-header-label" />
+          <div className="ct-speed-manage-pane__customize-header-input">
+            Speed (ft.)
+          </div>
+          <div className="ct-speed-manage-pane__customize-header-source">
+            Source/Notes
+          </div>
+        </div>
+        {movementOptions.map((option: HtmlSelectOption) => {
+          const override = customSpeedLookup[option.value];
+          return (
+            <SpeedManagePaneCustomizeItem
+              key={option.value as number}
+              id={option.value as number}
+              label={option.label}
+              initialValue={override ? override.distance : null}
+              initialSource={override ? override.source : null}
+              minimumValue={0}
+              onUpdate={this.handleOverrideUpdate}
+            />
+          );
+        })}
+        <Heading>Set Movement Display</Heading>
+        <Select
+          options={movementOptions}
+          onChange={this.handleMovementDisplayChange}
+          initialOptionRemoved={true}
+          value={preferences.primaryMovement}
+        />
+      </Collapsible>
+    );
+  };
+
+  renderDescription = (): React.ReactNode => {
+    const { ruleData } = this.props;
+
+    let rule = RuleDataUtils.getRule(Constants.RuleKeyEnum.SPEED, ruleData);
+    if (rule === null || rule.description === null) {
+      return null;
+    }
+
+    return (
+      <HtmlContent
+        className="ct-speed-manage-pane__description"
+        html={rule.description}
+        withoutTooltips
+      />
+    );
+  };
+
+  render() {
+    const { movements, customSpeedLookup, ruleData, theme } = this.props;
+
+    return (
+      <div className="ct-speed-manage-pane">
+        <Header>Speed</Header>
+        <div className="ct-speed-manage-pane__speeds">
+          {Object.keys(movements).map(
+            (movementKey: Constants.SpeedMovementKeyEnum) => {
+              const movementAmount = movements[movementKey];
+              if (movementAmount === null || movementAmount === 0) {
+                return null;
+              }
+
+              let movementType =
+                RuleDataUtils.getMovementTypeBySpeedMovementKey(movementKey);
+              let customSpeed: CustomSpeedContract | null | undefined =
+                movementType === null ? null : customSpeedLookup[movementType];
+              let source: string =
+                customSpeed && customSpeed.source ? customSpeed.source : "";
+
+              return (
+                <div className="ct-speed-manage-pane__speed" key={movementKey}>
+                  <span className="ct-speed-manage-pane__speed-label">
+                    {RuleDataUtils.getSpeedMovementKeyLabel(
+                      movementKey,
+                      ruleData
+                    )}
+                  </span>
+                  <span className="ct-speed-manage-pane__speed-amount">
+                    <NumberDisplay
+                      type="distanceInFt"
+                      number={movementAmount}
+                    />
+                  </span>
+                  {source && (
+                    <span className="ct-speed-manage-pane__speed-source">
+                      ({source})
+                    </span>
+                  )}
+                </div>
+              );
+            }
+          )}
+        </div>
+        {this.renderCustomize()}
+        {this.renderDescription()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    movements: rulesEngineSelectors.getCurrentCarriedWeightSpeed(state),
+    preferences: rulesEngineSelectors.getCharacterPreferences(state),
+    customSpeedLookup: rulesEngineSelectors.getCustomSpeedLookup(state),
+    customSpeeds: rulesEngineSelectors.getCustomSpeeds(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+export default connect(mapStateToProps)(SpeedManagePane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/SpeedManagePaneCustomizeItem/SpeedManagePaneCustomizeItem.tsx b/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/SpeedManagePaneCustomizeItem/SpeedManagePaneCustomizeItem.tsx
new file mode 100644
index 0000000..f99c3d4
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/SpeedManagePaneCustomizeItem/SpeedManagePaneCustomizeItem.tsx
@@ -0,0 +1,115 @@
+import React from "react";
+
+import { HelperUtils } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  id: number;
+  label: string | null;
+  initialValue: number | null;
+  initialSource: string | null;
+  onUpdate: (id: number, value: number | null, source: string | null) => void;
+  enableSource: boolean;
+  minimumValue: number | null;
+  className: string;
+}
+interface State {
+  value: number | null;
+  source: string | null;
+  isDirty: boolean;
+}
+export default class SpeedManagePaneCustomizeItem extends React.PureComponent<
+  Props,
+  State
+> {
+  static defaultProps = {
+    className: "",
+    enableSource: true,
+    minimumValue: null,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      value: props.initialValue,
+      source: props.initialSource,
+      isDirty: false,
+    };
+  }
+
+  handleUpdate = (): void => {
+    const { onUpdate, id } = this.props;
+    const { value, source, isDirty } = this.state;
+
+    if (isDirty && onUpdate) {
+      onUpdate(id, value, source);
+      this.setState({
+        isDirty: false,
+      });
+    }
+  };
+
+  handleValueBlur = (evt: React.FocusEvent<HTMLInputElement>): void => {
+    const { minimumValue } = this.props;
+
+    let value = evt.target.value;
+    this.setState((prevState) => {
+      let parsedValue = HelperUtils.parseInputInt(value);
+      let clampedInt: number | null = parsedValue;
+      if (minimumValue !== null && parsedValue !== null) {
+        clampedInt = HelperUtils.clampInt(parsedValue, minimumValue);
+      }
+
+      return {
+        value: clampedInt,
+      };
+    }, this.handleUpdate);
+  };
+
+  handleValueChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    this.setState({
+      value: HelperUtils.parseInputInt(evt.target.value),
+      isDirty: true,
+    });
+  };
+
+  handleSourceChange = (evt: React.ChangeEvent<HTMLInputElement>): void => {
+    this.setState({
+      source: evt.target.value,
+      isDirty: true,
+    });
+  };
+
+  render() {
+    const { value, source } = this.state;
+    const { label, enableSource, minimumValue, className } = this.props;
+
+    return (
+      <div className={`ct-speed-manage-pane__customize-item ${className}`}>
+        <div className="ct-speed-manage-pane__customize-item-label">
+          {label}
+        </div>
+        <div className="ct-speed-manage-pane__customize-item-input">
+          <input
+            type="number"
+            min={minimumValue === null ? undefined : minimumValue}
+            onChange={this.handleValueChange}
+            onBlur={this.handleValueBlur}
+            value={value === null ? "" : value}
+          />
+        </div>
+        {enableSource && (
+          <div className="ct-speed-manage-pane__customize-item-source">
+            <input
+              type="text"
+              onChange={this.handleSourceChange}
+              onBlur={this.handleUpdate}
+              value={source === null ? "" : source}
+            />
+          </div>
+        )}
+      </div>
+    );
+    //`
+  }
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/SpeedManagePaneCustomizeItem/index.ts b/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/SpeedManagePaneCustomizeItem/index.ts
new file mode 100644
index 0000000..a8883e5
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/SpeedManagePaneCustomizeItem/index.ts
@@ -0,0 +1,4 @@
+import SpeedManagePaneCustomizeItem from "./SpeedManagePaneCustomizeItem";
+
+export default SpeedManagePaneCustomizeItem;
+export { SpeedManagePaneCustomizeItem };
diff --git a/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/index.ts
new file mode 100644
index 0000000..894cc9c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SpeedManagePane/index.ts
@@ -0,0 +1,5 @@
+import SpeedManagePane from "./SpeedManagePane";
+import SpeedManagePaneCustomizeItem from "./SpeedManagePaneCustomizeItem";
+
+export default SpeedManagePane;
+export { SpeedManagePane, SpeedManagePaneCustomizeItem };
diff --git a/ddb_main/tools/js/Shared/containers/panes/SpellManagePane/SpellManagePane.tsx b/ddb_main/tools/js/Shared/containers/panes/SpellManagePane/SpellManagePane.tsx
new file mode 100644
index 0000000..a45ff68
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SpellManagePane/SpellManagePane.tsx
@@ -0,0 +1,51 @@
+import { useSelector } from "react-redux";
+
+import {
+  ClassUtils,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import SpellSlotManager from "../../../../CharacterSheet/containers/SpellSlotManager";
+import ClassSpellManager from "../../../components/ClassSpellManager";
+
+export default function SpellManagePane() {
+  const classSpellLists = useSelector(rulesEngineSelectors.getClassSpellLists);
+  const entityValueLookup = useSelector(
+    rulesEngineSelectors.getCharacterValueLookupByEntity
+  );
+  const dataOriginRefData = useSelector(
+    rulesEngineSelectors.getDataOriginRefData
+  );
+  const proficiencyBonus = useSelector(
+    rulesEngineSelectors.getProficiencyBonus
+  );
+  const theme = useSelector(rulesEngineSelectors.getCharacterTheme);
+
+  if (!classSpellLists.length) {
+    return (
+      <div className="ct-spell-manage-pane__default">
+        You do not have spellcasting or pact magic spells to manage. The spells
+        that appear for your character were gained through other class features,
+        species traits, feats, or items.
+      </div>
+    );
+  }
+
+  return (
+    <div className="ct-spell-manage-pane">
+      <SpellSlotManager />
+      {classSpellLists.map((classSpellList) => (
+        <ClassSpellManager
+          {...classSpellList}
+          key={ClassUtils.getMappingId(classSpellList.charClass)}
+          hasMultipleSpellClasses={classSpellLists.length > 1}
+          entityValueLookup={entityValueLookup}
+          dataOriginRefData={dataOriginRefData}
+          isPrepareMaxed={!!classSpellList.isPrepareMaxed}
+          proficiencyBonus={proficiencyBonus}
+          theme={theme}
+        />
+      ))}
+    </div>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/containers/panes/SpellManagePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/SpellManagePane/index.ts
new file mode 100644
index 0000000..42dca5b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/SpellManagePane/index.ts
@@ -0,0 +1,4 @@
+import SpellManagePane from "./SpellManagePane";
+
+export default SpellManagePane;
+export { SpellManagePane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/StartingEquipmentPane/StartingEquipmentPane.tsx b/ddb_main/tools/js/Shared/containers/panes/StartingEquipmentPane/StartingEquipmentPane.tsx
new file mode 100644
index 0000000..c1cb7cf
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/StartingEquipmentPane/StartingEquipmentPane.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import { SharedAppState } from "../../../stores/typings";
+import StartingEquipment from "../../StartingEquipment";
+
+class StartingEquipmentPane extends React.PureComponent {
+  render() {
+    return (
+      <div className="ct-starting-equipment-pane">
+        <StartingEquipment />
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {};
+}
+
+export default connect(mapStateToProps)(StartingEquipmentPane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/StartingEquipmentPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/StartingEquipmentPane/index.ts
new file mode 100644
index 0000000..7a7da2d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/StartingEquipmentPane/index.ts
@@ -0,0 +1,4 @@
+import StartingEquipmentPane from "./StartingEquipmentPane";
+
+export default StartingEquipmentPane;
+export { StartingEquipmentPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/TraitPane/TraitPane.tsx b/ddb_main/tools/js/Shared/containers/panes/TraitPane/TraitPane.tsx
new file mode 100644
index 0000000..36d24cb
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/TraitPane/TraitPane.tsx
@@ -0,0 +1,302 @@
+import React from "react";
+import { connect, DispatchProp } from "react-redux";
+
+import {
+  Background,
+  BackgroundCharacteristicContract,
+  characterActions,
+  CharacterTraits,
+  Constants,
+  RuleDataUtils,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { Textarea } from "~/components/Textarea";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+import { PaneIdentifiersTrait } from "~/subApps/sheet/components/Sidebar/types";
+
+import { toastMessageActions } from "../../../actions/toastMessage";
+import SuggestionTable from "../../../components/SuggestionTable";
+import { ThemeButton } from "../../../components/common/Button";
+import { SharedAppState } from "../../../stores/typings";
+
+interface Props extends DispatchProp {
+  identifiers: PaneIdentifiersTrait;
+  background: Background | null;
+  traits: CharacterTraits;
+  placeholder: string;
+  autoSaveDelay: number;
+}
+interface State {
+  type: string | null;
+  hasBeenEdited: boolean;
+  isSaveDirty: boolean;
+}
+class TraitPane extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    placeholder: "Enter any traits here!",
+    autoSaveDelay: 5000,
+  };
+
+  autoSaveTimeoutId: number | null = null;
+  textareaInput = React.createRef<HTMLDivElement>();
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      type: props.identifiers.type,
+      hasBeenEdited: false,
+      isSaveDirty: false,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { identifiers } = this.props;
+
+    if (identifiers.type !== prevProps.identifiers.type) {
+      this.setState({
+        type: identifiers.type,
+        hasBeenEdited: false,
+        isSaveDirty: false,
+      });
+    }
+  }
+
+  componentDidMount() {
+    if (this.textareaInput.current) {
+      this.textareaInput.current.focus();
+    }
+  }
+
+  componentWillUnmount() {
+    const { dispatch, identifiers } = this.props;
+    const { isSaveDirty } = this.state;
+
+    this.handleStopAutoSaveTimer();
+
+    if (isSaveDirty && this.textareaInput.current) {
+      dispatch(
+        characterActions.traitSet(
+          identifiers.type,
+          this.textareaInput.current?.dataset.value || ""
+        )
+      );
+    }
+  }
+
+  startAutoSaveTimer = (): void => {
+    const { autoSaveDelay } = this.props;
+
+    if (this.autoSaveTimeoutId === null) {
+      this.autoSaveTimeoutId = window.setTimeout(() => {
+        this.handleSave();
+      }, autoSaveDelay);
+    }
+  };
+
+  getContent = (): string => {
+    const { identifiers, traits } = this.props;
+
+    let content = traits[identifiers.type];
+
+    return content || "";
+  };
+
+  handleStopAutoSaveTimer = (): void => {
+    if (this.autoSaveTimeoutId !== null) {
+      window.clearTimeout(this.autoSaveTimeoutId);
+      this.autoSaveTimeoutId = null;
+    }
+  };
+
+  handleSave = (): void => {
+    const { dispatch, identifiers } = this.props;
+
+    if (this.textareaInput.current) {
+      dispatch(
+        characterActions.traitSet(
+          identifiers.type,
+          this.textareaInput.current?.dataset.value || ""
+        )
+      );
+    }
+
+    this.handleStopAutoSaveTimer();
+    this.setState({
+      isSaveDirty: false,
+    });
+  };
+
+  handleInputKeyUp = (): void => {
+    const { isSaveDirty } = this.state;
+
+    if (!isSaveDirty) {
+      this.setState(
+        {
+          isSaveDirty: true,
+          hasBeenEdited: true,
+        },
+        this.startAutoSaveTimer
+      );
+    }
+  };
+
+  handleInputBlur = (text: string): void => {
+    this.handleSave();
+  };
+
+  handleSuggestionUse = (
+    idx: number,
+    diceRoll: number,
+    description: string
+  ): void => {
+    const { identifiers, dispatch } = this.props;
+
+    let newTraitContent = this.getContent();
+    if (newTraitContent.length) {
+      newTraitContent += "\n";
+    }
+    newTraitContent += description;
+
+    dispatch(characterActions.traitSet(identifiers.type, newTraitContent));
+    dispatch(
+      toastMessageActions.toastSuccess(
+        `${RuleDataUtils.getTraitTypeName(
+          identifiers.type
+        )} added to Personal Characteristics section`,
+        `${diceRoll} - ${
+          description.length > 70
+            ? description.substr(0, 70) + "..."
+            : description
+        }`
+      )
+    );
+  };
+
+  getSuggestionsHelpText = (traitKey: Constants.TraitTypeEnum): string => {
+    let text = `Describe your character's ${RuleDataUtils.getTraitTypeName(
+      traitKey
+    )}`;
+    switch (traitKey) {
+      case "personalityTraits":
+        text =
+          "What is your character like? How do their Ability Scores, like Wisdom or Charisma, contribute to their personality?";
+        break;
+      case "ideals":
+        text =
+          "What drives and motivates your character? What values do they hold most important? What are they fighting for?";
+        break;
+      case "bonds":
+        text =
+          "Whom does your character care most about? To what place do they feel a special connection? What is their most treasured possession?";
+        break;
+      case "flaws":
+        text =
+          "What are your character's vices or weaknesses? What do other people not like about them? What traits do they not like about themself? You can also consider their Ability Scores here.";
+        break;
+      default:
+    }
+    return text;
+  };
+
+  renderSuggestionList = (): React.ReactNode => {
+    const { identifiers, background } = this.props;
+
+    if (identifiers.type === Constants.TraitTypeEnum.APPEARANCE) {
+      return null;
+    }
+
+    let suggestionNode: React.ReactNode;
+    if (
+      background &&
+      background.definition &&
+      background.definition[identifiers.type]
+    ) {
+      let suggestionData: Array<BackgroundCharacteristicContract> | null =
+        background.definition[identifiers.type];
+      if (suggestionData && suggestionData.length) {
+        suggestionNode = (
+          <SuggestionTable
+            tableLabel={RuleDataUtils.getTraitTypeName(identifiers.type)}
+            dieLabel={`d${suggestionData.length}`}
+            suggestions={suggestionData}
+            onSuggestionUse={this.handleSuggestionUse}
+          />
+        );
+      }
+    } else {
+      suggestionNode = (
+        <div className="ct-trait-pane__suggestions-missing">
+          <p>Choose a background to get suggestions.</p>
+        </div>
+      );
+    }
+
+    return (
+      <div className="ct-trait-pane__suggestions">
+        <Heading>Suggestions</Heading>
+        <p>{this.getSuggestionsHelpText(identifiers.type)}</p>
+        {suggestionNode}
+      </div>
+    );
+    //`
+  };
+
+  render() {
+    const { isSaveDirty, hasBeenEdited } = this.state;
+    const { identifiers, placeholder } = this.props;
+
+    let calloutNode: React.ReactNode;
+    if (hasBeenEdited) {
+      if (isSaveDirty) {
+        calloutNode = (
+          <React.Fragment>
+            <div className="ct-trait-pane__status ct-trait-pane__status--dirty">
+              <div className="ct-trait-pane__status-text">Unsaved changes</div>
+            </div>
+            <ThemeButton size="small" onClick={this.handleSave}>
+              Save
+            </ThemeButton>
+          </React.Fragment>
+        );
+      } else {
+        calloutNode = (
+          <div className="ct-trait-pane__status ct-trait-pane__status--clean">
+            <div className="ct-trait-pane__status-icon" />
+            <div className="ct-trait-pane__status-text">Saved</div>
+          </div>
+        );
+      }
+    }
+
+    return (
+      <div className="ct-trait-pane">
+        <Header callout={calloutNode}>
+          {RuleDataUtils.getTraitTypeName(identifiers.type)}
+        </Header>
+        <Textarea
+          ref={this.textareaInput}
+          placeholder={placeholder}
+          value={this.getContent()}
+          onInputKeyUp={this.handleInputKeyUp}
+          onInputBlur={this.handleInputBlur}
+        />
+        {this.renderSuggestionList()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    background: rulesEngineSelectors.getBackgroundInfo(state),
+    traits: rulesEngineSelectors.getCharacterTraits(state),
+  };
+}
+
+export default connect(mapStateToProps)(TraitPane);
diff --git a/ddb_main/tools/js/Shared/containers/panes/TraitPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/TraitPane/index.ts
new file mode 100644
index 0000000..1a86be1
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/TraitPane/index.ts
@@ -0,0 +1,4 @@
+import TraitPane from "./TraitPane";
+
+export default TraitPane;
+export { TraitPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/VehicleComponentPane/VehicleComponentPane.tsx b/ddb_main/tools/js/Shared/containers/panes/VehicleComponentPane/VehicleComponentPane.tsx
new file mode 100644
index 0000000..5bd8247
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/VehicleComponentPane/VehicleComponentPane.tsx
@@ -0,0 +1,211 @@
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  CharacterTheme,
+  ExtraManager,
+  FormatUtils,
+  RuleData,
+  rulesEngineSelectors,
+  VehicleComponentManager,
+  VehicleManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { useExtras } from "~/hooks/useExtras";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersVehicleComponent,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { PaneInitFailureContent } from "../../../../../../subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import {
+  VehicleBlockComponent,
+  VehicleBlockShell,
+} from "../../../components/VehicleBlock";
+import VehicleHealthAdjuster from "../../../components/VehicleHealthAdjuster";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+import { ComponentUtils, PaneIdentifierUtils } from "../../../utils";
+
+interface Props {
+  identifiers: PaneIdentifiersVehicleComponent | null;
+  isReadonly: boolean;
+  ruleData: RuleData;
+  theme: CharacterTheme;
+  extraManagers: Array<ExtraManager>;
+  paneHistoryPush: PaneInfo["paneHistoryPush"];
+}
+interface State {
+  vehicle: VehicleManager | null;
+  component: VehicleComponentManager | null;
+}
+class VehicleComponentPane extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.state = this.generateStateData(props);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { extraManagers, identifiers } = this.props;
+
+    if (
+      extraManagers !== prevProps.extraManagers ||
+      identifiers !== prevProps.identifiers
+    ) {
+      this.setState(this.generateStateData(this.props));
+    }
+  }
+
+  generateStateData = (props: Props): State => {
+    const { extraManagers, identifiers } = props;
+
+    let foundExtra: ExtraManager | null | undefined = null;
+    let foundVehicle: VehicleManager | null | undefined = null;
+    let foundComponent: VehicleComponentManager | null | undefined = null;
+    if (identifiers !== null) {
+      foundExtra = extraManagers.find(
+        (extra) => identifiers.vehicleId === extra.getMappingId()
+      );
+      if (foundExtra) {
+        foundVehicle = foundExtra.getExtraData() as VehicleManager;
+        foundComponent = foundVehicle
+          .getComponents()
+          .find((component) => identifiers.id === component.getMappingId());
+      }
+    }
+
+    return {
+      vehicle: foundVehicle ? foundVehicle : null,
+      component: foundComponent ? foundComponent : null,
+    };
+  };
+
+  handleParentClick = (): void => {
+    const { paneHistoryPush } = this.props;
+    const { vehicle } = this.state;
+
+    if (vehicle) {
+      paneHistoryPush(
+        PaneComponentEnum.VEHICLE,
+        PaneIdentifierUtils.generateVehicle(vehicle.getMappingId())
+      );
+    }
+  };
+
+  handleHealthAdjusterSave = (hitPointDiff: number): void => {
+    const { component } = this.state;
+
+    if (component === null) {
+      return;
+    }
+
+    component.handleHitPointAdjustment({ hitPointDiff });
+  };
+
+  renderBlock = (): React.ReactNode => {
+    const { vehicle, component } = this.state;
+    const { ruleData, theme } = this.props;
+
+    if (vehicle === null || component === null) {
+      return;
+    }
+
+    return (
+      <div className="ct-vehicle-component-pane__block">
+        <VehicleBlockShell displayType={vehicle.getDisplayType()}>
+          <VehicleBlockComponent
+            {...ComponentUtils.generateVehicleBlockComponentProps(
+              component.vehicleComponent,
+              vehicle.vehicle,
+              ruleData
+            )}
+            theme={theme}
+            shouldCoalesce={false}
+          />
+        </VehicleBlockShell>
+      </div>
+    );
+  };
+
+  renderName = (): React.ReactNode => {
+    const { component } = this.state;
+
+    if (component === null) {
+      return null;
+    }
+
+    let name = component.getName();
+
+    if (name === null) {
+      return null;
+    }
+
+    let nameText: Array<string> = [];
+    const typeNames = component.getTypeNames();
+    if (typeNames.length > 0 && !typeNames.includes(name)) {
+      nameText.push(FormatUtils.renderNonOxfordCommaList(typeNames));
+    }
+
+    nameText.push(name);
+
+    return nameText.join(": ");
+  };
+
+  render() {
+    const { vehicle, component } = this.state;
+    const { isReadonly } = this.props;
+
+    if (vehicle === null || component === null) {
+      return <PaneInitFailureContent />;
+    }
+
+    const hitPointInfo = component.getHitPointInfo();
+
+    return (
+      <div className="ct-vehicle-component-pane" key={component.getUniqueKey()}>
+        <Header parent={vehicle.getName()} onClick={this.handleParentClick}>
+          {this.renderName()}
+        </Header>
+        {hitPointInfo !== null && (
+          <VehicleHealthAdjuster
+            hitPointInfo={hitPointInfo}
+            isInteractive={!isReadonly}
+            initiallyCollapsed={false}
+            onSave={this.handleHealthAdjusterSave}
+          />
+        )}
+        {this.renderBlock()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+  };
+}
+
+const VehicleComponentPaneContainer = (props) => {
+  const extras = useExtras();
+  const {
+    pane: { paneHistoryPush },
+  } = useSidebar();
+  return (
+    <VehicleComponentPane
+      extraManagers={extras}
+      paneHistoryPush={paneHistoryPush}
+      {...props}
+    />
+  );
+};
+
+export default connect(mapStateToProps)(VehicleComponentPaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/VehicleComponentPane/index.ts b/ddb_main/tools/js/Shared/containers/panes/VehicleComponentPane/index.ts
new file mode 100644
index 0000000..2232da4
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/VehicleComponentPane/index.ts
@@ -0,0 +1,4 @@
+import VehicleComponentPane from "./VehicleComponentPane";
+
+export default VehicleComponentPane;
+export { VehicleComponentPane };
diff --git a/ddb_main/tools/js/Shared/containers/panes/VehiclePane/VehiclePane.tsx b/ddb_main/tools/js/Shared/containers/panes/VehiclePane/VehiclePane.tsx
new file mode 100644
index 0000000..7b4bcee
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/VehiclePane/VehiclePane.tsx
@@ -0,0 +1,628 @@
+import ArrowRightAltIcon from "@mui/icons-material/ArrowRightAlt";
+import { has } from "lodash";
+import React from "react";
+import { connect } from "react-redux";
+
+import {
+  Collapsible,
+  DisabledLockSvg,
+  MarketplaceCta,
+} from "@dndbeyond/character-components/es";
+import {
+  CharacterTheme,
+  ConditionContract,
+  Constants,
+  ExtraManager,
+  FormatUtils,
+  RuleData,
+  rulesEngineSelectors,
+  VehicleComponentManager,
+  VehicleManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { EditableName } from "~/components/EditableName";
+import { HtmlContent } from "~/components/HtmlContent";
+import { Link } from "~/components/Link";
+import { Reference } from "~/components/Reference";
+import { TagGroup } from "~/components/TagGroup";
+import { useSidebar } from "~/contexts/Sidebar";
+import { PaneInfo } from "~/contexts/Sidebar/Sidebar";
+import { useExtras } from "~/hooks/useExtras";
+import { Header } from "~/subApps/sheet/components/Sidebar/components/Header";
+import { Heading } from "~/subApps/sheet/components/Sidebar/components/Heading";
+import { Preview } from "~/subApps/sheet/components/Sidebar/components/Preview";
+import {
+  PaneComponentEnum,
+  PaneIdentifiersVehicle,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+import { PaneInitFailureContent } from "../../../../../../subApps/sheet/components/Sidebar/components/PaneInitFailureContent";
+import CustomizeDataEditor from "../../../components/CustomizeDataEditor";
+import EditorBox from "../../../components/EditorBox";
+import VehicleBlock from "../../../components/VehicleBlock";
+import VehicleConditionTrackers from "../../../components/VehicleConditionsTracker";
+import VehicleFuelTracker from "../../../components/VehicleFuelTracker";
+import VehicleHealthAdjuster from "../../../components/VehicleHealthAdjuster";
+import { RemoveButton } from "../../../components/common/Button";
+import { appEnvSelectors } from "../../../selectors";
+import { SharedAppState } from "../../../stores/typings";
+import {
+  ComponentUtils,
+  PaneIdentifierUtils,
+  TypeScriptUtils,
+} from "../../../utils";
+
+interface Hack_DataForEditor {
+  name: string | null;
+  notes: string | null;
+}
+interface Hack_DataForAction {
+  name: string | null;
+  description: string | null;
+}
+
+interface Props {
+  identifiers: PaneIdentifiersVehicle | null;
+  isReadonly: boolean;
+  ruleData: RuleData;
+  theme: CharacterTheme;
+  extraManagers: Array<ExtraManager>;
+  paneContext: PaneInfo;
+}
+
+interface State {
+  vehicle: VehicleManager | null;
+  isCustomizeClosed: boolean;
+}
+class VehiclePane extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
+    super(props);
+
+    this.state = this.generateStateData(props, true);
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>
+  ): void {
+    const { extraManagers, identifiers } = this.props;
+
+    if (
+      extraManagers !== prevProps.extraManagers ||
+      identifiers !== prevProps.identifiers
+    ) {
+      this.setState(
+        this.generateStateData(this.props, prevState.isCustomizeClosed)
+      );
+    }
+  }
+
+  generateStateData = (props: Props, isCustomizeClosed: boolean): State => {
+    const { extraManagers, identifiers } = props;
+
+    let extraManager: ExtraManager | null | undefined = null;
+
+    if (identifiers !== null) {
+      extraManager = extraManagers.find(
+        (extraManager) => identifiers.id === extraManager.getMappingId()
+      );
+    }
+
+    return {
+      vehicle: extraManager
+        ? (extraManager.getExtraData() as VehicleManager)
+        : null,
+      isCustomizeClosed,
+    };
+  };
+
+  handleOpenCustomize = () => {
+    this.setState({ isCustomizeClosed: !this.state.isCustomizeClosed });
+  };
+
+  handleComponentClick = (componentId: number, vehicleId: number): void => {
+    const {
+      paneContext: { paneHistoryPush },
+    } = this.props;
+
+    paneHistoryPush(
+      PaneComponentEnum.VEHICLE_COMPONENT,
+      PaneIdentifierUtils.generateVehicleComponent(componentId, vehicleId)
+    );
+  };
+
+  handleActionStationClick = (stationId: number, vehicleId: number): void => {
+    const {
+      paneContext: { paneHistoryPush },
+    } = this.props;
+
+    paneHistoryPush(
+      PaneComponentEnum.VEHICLE_ACTION_STATION,
+      PaneIdentifierUtils.generateVehicleActionStation(stationId, vehicleId)
+    );
+  };
+
+  handleRemove = (): void => {
+    const { vehicle } = this.state;
+    const {
+      paneContext: { paneHistoryStart },
+    } = this.props;
+
+    if (vehicle === null) {
+      return;
+    }
+
+    paneHistoryStart(PaneComponentEnum.EXTRA_MANAGE);
+    vehicle.handleRemove();
+  };
+
+  hack__transformDataForEditor = (
+    data: Hack_DataForAction
+  ): Hack_DataForEditor => {
+    return {
+      name: data.name,
+      notes: data.description,
+    };
+  };
+
+  hack__transformDataForAction = (
+    data: Hack_DataForEditor
+  ): Hack_DataForAction => {
+    return {
+      name: data.name,
+      description: data.notes,
+    };
+  };
+
+  handleDataUpdate = (properties: Hack_DataForEditor): void => {
+    const { vehicle } = this.state;
+
+    if (!vehicle) {
+      return;
+    }
+
+    const data = this.getData();
+    const prevData: Partial<Hack_DataForEditor> = data ? data : {};
+
+    const newProperties: Hack_DataForEditor = {
+      ...prevData,
+      ...properties,
+    };
+
+    vehicle.handleDataUpdate({
+      properties: this.hack__transformDataForAction(newProperties),
+    });
+  };
+
+  handleHealthAdjusterSave = (
+    hitPointDiff: number,
+    vehicleComponentManager: VehicleComponentManager
+  ): void => {
+    vehicleComponentManager.handleHitPointAdjustment({ hitPointDiff });
+  };
+
+  handleFuelChange = (remainingFuel: number): void => {
+    const { vehicle } = this.state;
+
+    if (!vehicle) {
+      return;
+    }
+
+    vehicle.handleFuelChange({ remainingFuel });
+  };
+
+  handleConditionLevelChange = (
+    conditionId: number,
+    newLevel: number | null,
+    prevLevel: number | null
+  ): void => {
+    const { vehicle } = this.state;
+
+    if (vehicle === null) {
+      return;
+    }
+
+    vehicle.handleConditionLevelChange(conditionId, newLevel, prevLevel);
+  };
+
+  getData = (): Hack_DataForEditor => {
+    const { vehicle } = this.state;
+
+    if (!vehicle) {
+      return {
+        name: null,
+        notes: null,
+      };
+    }
+
+    const name = vehicle.getName();
+    const description = vehicle.getDescription();
+
+    return this.hack__transformDataForEditor({ name, description });
+  };
+
+  renderCustomize = (): React.ReactNode => {
+    const { isReadonly } = this.props;
+    const { isCustomizeClosed } = this.state;
+
+    if (isReadonly) {
+      return null;
+    }
+
+    return (
+      <div className="ct-vehicle-pane__customize">
+        <Collapsible
+          layoutType={"minimal"}
+          header="Customize"
+          collapsed={isCustomizeClosed}
+          onChangeHandler={this.handleOpenCustomize}
+        >
+          <EditorBox>
+            <CustomizeDataEditor
+              data={this.getData()}
+              enableNotes={true}
+              enableName={true}
+              onDataUpdate={this.handleDataUpdate}
+            />
+          </EditorBox>
+        </Collapsible>
+      </div>
+    );
+  };
+
+  renderImage = (): React.ReactNode => {
+    const { vehicle } = this.state;
+
+    if (!vehicle) {
+      return null;
+    }
+
+    let largeAvatarUrl = vehicle.getLargeAvatarUrl();
+    if (!largeAvatarUrl) {
+      return null;
+    }
+
+    const name = vehicle.getDefinitionName();
+    let altText: string = name ? name : "vehicle image";
+
+    return (
+      <div className="ct-vehicle-pane__full-image">
+        <img
+          className="ct-vehicle-pane__full-image-img"
+          src={largeAvatarUrl}
+          alt={altText}
+        />
+      </div>
+    );
+  };
+
+  renderTags = (): React.ReactNode => {
+    const { vehicle } = this.state;
+
+    if (!vehicle) {
+      return null;
+    }
+
+    const tags = vehicle.getMovementNames();
+
+    if (!tags.length) {
+      return null;
+    }
+
+    return <TagGroup label="Tags" tags={tags} />;
+  };
+
+  renderDescription = (): React.ReactNode => {
+    const { vehicle } = this.state;
+
+    if (!vehicle) {
+      return null;
+    }
+
+    const description = vehicle.getDefinitionDescription();
+    if (!description) {
+      return null;
+    }
+
+    const label = vehicle.getDefinitionName();
+
+    return (
+      <div className="ct-vehicle-pane__description">
+        {label && (
+          <div className="ct-vehicle-pane__description-heading">
+            <Heading>{label}</Heading>
+          </div>
+        )}
+        <HtmlContent
+          className="ct-vehicle-pane__description-content"
+          html={description}
+          withoutTooltips
+        />
+      </div>
+    );
+  };
+
+  renderActions = (): React.ReactNode => {
+    const { isReadonly } = this.props;
+
+    if (isReadonly) {
+      return null;
+    }
+
+    return (
+      <div className="ct-vehicle-pane__actions">
+        <div className="ct-vehicle-pane__action">
+          <RemoveButton onClick={this.handleRemove} />
+        </div>
+      </div>
+    );
+  };
+
+  renderMarketplaceCta = (): React.ReactNode => {
+    const { vehicle } = this.state;
+
+    if (vehicle === null) {
+      return null; //TODO could render a default empty state
+    }
+
+    let sourceNames = vehicle.getSourceNames();
+
+    const sourceName: string | null =
+      sourceNames.length > 0
+        ? FormatUtils.renderNonOxfordCommaList(sourceNames)
+        : null;
+    const description: string =
+      "To unlock this vehicle, check out the Marketplace to view purchase options.";
+
+    return <MarketplaceCta sourceName={sourceName} description={description} />;
+  };
+
+  renderHealthAdjuster = (): React.ReactNode => {
+    const { vehicle } = this.state;
+    const { isReadonly } = this.props;
+
+    if (vehicle === null) {
+      return null;
+    }
+
+    if (!vehicle.isSpelljammer()) {
+      const primaryComponent = vehicle.getPrimaryComponent();
+      if (primaryComponent === null) {
+        return null;
+      }
+
+      const hitPointInfo = primaryComponent.getHitPointInfo();
+      if (hitPointInfo === null) {
+        return null;
+      }
+
+      return (
+        <VehicleHealthAdjuster
+          hitPointInfo={hitPointInfo}
+          onSave={(diff) =>
+            this.handleHealthAdjusterSave(diff, primaryComponent)
+          }
+          isInteractive={!isReadonly}
+        />
+      );
+    }
+
+    const components = vehicle
+      .getComponents()
+      .filter((component) => component.getHitPointInfo() !== null);
+    const componentCount = {};
+    components.forEach((component) => {
+      const componentName = component.getName();
+      if (!componentName) {
+        return;
+      }
+      if (has(componentCount, componentName)) {
+        (componentCount[componentName] as number) += 1;
+      } else {
+        (componentCount[componentName] as number) = 1;
+      }
+    });
+    const currentComponents = {};
+    return components.map((component) => {
+      const componentHitPointInfo = component.getHitPointInfo();
+      if (componentHitPointInfo === null) {
+        return null;
+      }
+      const componentName = component.getName() ?? "Hull";
+      let componentNumber = "";
+      if (componentCount[componentName] > 1) {
+        if (has(currentComponents, componentName)) {
+          componentNumber = ` ${((currentComponents[
+            componentName
+          ] as number) += 1)}`;
+        } else {
+          componentNumber = " 1";
+          (currentComponents[componentName] as number) = 1;
+        }
+      }
+      return (
+        <VehicleHealthAdjuster
+          hitPointInfo={componentHitPointInfo}
+          onSave={(diff) => this.handleHealthAdjusterSave(diff, component)}
+          heading={`Hit Points (${componentName}${componentNumber})`}
+          isInteractive={!isReadonly}
+        />
+      );
+    });
+  };
+
+  renderFuelTracker = (): React.ReactNode => {
+    const { vehicle } = this.state;
+    const { isReadonly } = this.props;
+
+    if (vehicle === null) {
+      return null;
+    }
+
+    const fuelData = vehicle.getFuelData();
+
+    if (fuelData === null) {
+      return null;
+    }
+
+    return (
+      <VehicleFuelTracker
+        fuelData={fuelData}
+        onChange={this.handleFuelChange}
+        isInteractive={!isReadonly}
+      />
+    );
+  };
+
+  renderConditionTrackers = (): React.ReactNode => {
+    const { vehicle } = this.state;
+    const { isReadonly } = this.props;
+
+    if (vehicle === null) {
+      return null;
+    }
+
+    const enabledConditions: Array<ConditionContract> = vehicle
+      .getResolvedEnabledConditions()
+      .filter(TypeScriptUtils.isNotNullOrUndefined);
+
+    return (
+      <VehicleConditionTrackers
+        activeConditionLookup={vehicle.getActiveConditionLookup()}
+        enabledConditions={enabledConditions}
+        onLevelChange={this.handleConditionLevelChange}
+        isInteractive={!isReadonly}
+      />
+    );
+  };
+
+  renderVehicleContent = (): React.ReactNode => {
+    const { vehicle } = this.state;
+    const { isReadonly, theme } = this.props;
+
+    if (!vehicle) {
+      return null; //TODO could render a default empty state
+    }
+
+    const primaryComponentManageType = vehicle.getPrimaryComponentManageType();
+    const enableConditionTracking = vehicle.getEnableConditionTracking();
+    const enableFuelTracking = vehicle.getEnableFuelTracking();
+    const shouldCoalesce = vehicle.isSpelljammer();
+
+    return (
+      <React.Fragment>
+        {this.renderCustomize()}
+        {primaryComponentManageType ===
+          Constants.VehicleConfigurationPrimaryComponentManageTypeEnum
+            .VEHICLE && this.renderHealthAdjuster()}
+        {enableFuelTracking && this.renderFuelTracker()}
+        {enableConditionTracking && this.renderConditionTrackers()}
+        <div className="ct-vehicle-pane__block">
+          <VehicleBlock
+            {...ComponentUtils.generateVehicleBlockProps(vehicle)}
+            shouldCoalesce={shouldCoalesce}
+            onComponentClick={this.handleComponentClick}
+            onActionStationClick={this.handleActionStationClick}
+            isInteractive={shouldCoalesce ? false : !isReadonly}
+            theme={theme}
+          />
+        </div>
+        {this.renderImage()}
+        {this.renderTags()}
+        {this.renderDescription()}
+        <Link
+          href={vehicle.getUrl() ?? ""}
+          target="_blank"
+          rel="noopener noreferrer"
+          style={{
+            display: "flex",
+            alignItems: "center",
+            marginTop: "8px",
+            color: "primary.main",
+          }}
+        >
+          {vehicle.getDefinitionName()} Details Page <ArrowRightAltIcon />
+        </Link>
+        {this.renderActions()}
+      </React.Fragment>
+    );
+  };
+
+  renderVehicleName = (): React.ReactNode => {
+    const { vehicle } = this.state;
+    const { theme } = this.props;
+
+    if (!vehicle) {
+      return null; //TODO could render a default empty state
+    }
+
+    const isAccessible = vehicle.isAccessible();
+    let name = vehicle.getName();
+
+    if (isAccessible) {
+      return (
+        <EditableName onClick={this.handleOpenCustomize}>{name}</EditableName>
+      );
+    } else {
+      return (
+        <React.Fragment>
+          <DisabledLockSvg className="ct-vehicle-pane__header-lock" />
+          {name}
+        </React.Fragment>
+      );
+    }
+  };
+
+  render() {
+    const { vehicle } = this.state;
+    const { theme } = this.props;
+    if (!vehicle) {
+      return <PaneInitFailureContent />;
+    }
+
+    const isAccessible = vehicle.isAccessible();
+
+    let avatarUrl = vehicle.getAvatarUrl();
+    if (!avatarUrl) {
+      avatarUrl = "";
+    }
+
+    return (
+      <div className="ct-vehicle-pane" key={vehicle.getUniqueKey()}>
+        <Header parent="Vehicle" preview={<Preview imageUrl={avatarUrl} />}>
+          {this.renderVehicleName()}
+        </Header>
+        {vehicle.isHomebrew() ? (
+          <Reference isDarkMode={theme.isDarkMode} name="Homebrew" />
+        ) : (
+          vehicle.getSourceNames().map((source, idx) => {
+            return (
+              <React.Fragment key={source}>
+                {idx > 0 ? " /" : ""}{" "}
+                <Reference isDarkMode={theme.isDarkMode} name={source} />
+              </React.Fragment>
+            );
+          })
+        )}
+        {isAccessible
+          ? this.renderVehicleContent()
+          : this.renderMarketplaceCta()}
+      </div>
+    );
+  }
+}
+
+function mapStateToProps(state: SharedAppState) {
+  return {
+    isReadonly: appEnvSelectors.getIsReadonly(state),
+    ruleData: rulesEngineSelectors.getRuleData(state),
+    theme: rulesEngineSelectors.getCharacterTheme(state),
+  };
+}
+
+const VehiclePaneContainer = (props) => {
+  const extras = useExtras();
+  const { pane } = useSidebar();
+  return <VehiclePane extraManagers={extras} paneContext={pane} {...props} />;
+};
+export default connect(mapStateToProps)(VehiclePaneContainer);
diff --git a/ddb_main/tools/js/Shared/containers/panes/VehiclePane/index.ts b/ddb_main/tools/js/Shared/containers/panes/VehiclePane/index.ts
new file mode 100644
index 0000000..c77d786
--- /dev/null
+++ b/ddb_main/tools/js/Shared/containers/panes/VehiclePane/index.ts
@@ -0,0 +1,4 @@
+import VehiclePane from "./VehiclePane";
+
+export default VehiclePane;
+export { VehiclePane };
diff --git a/ddb_main/tools/js/Shared/managers/ActionsManagerContext.tsx b/ddb_main/tools/js/Shared/managers/ActionsManagerContext.tsx
new file mode 100644
index 0000000..7fa3308
--- /dev/null
+++ b/ddb_main/tools/js/Shared/managers/ActionsManagerContext.tsx
@@ -0,0 +1,25 @@
+import React, { useMemo } from "react";
+
+import { ActionsManager } from "@dndbeyond/character-rules-engine/es";
+
+interface ActionsManagerContextValue {
+  actionsManager: ActionsManager;
+}
+
+const initContext: ActionsManagerContextValue = {
+  actionsManager: new ActionsManager(),
+};
+export const ActionsManagerContext =
+  React.createContext<ActionsManagerContextValue>(initContext);
+
+export function ActionsManagerProvider({ children }) {
+  const actionsManager: ActionsManager = useMemo(
+    () => new ActionsManager(),
+    []
+  );
+  return (
+    <ActionsManagerContext.Provider value={{ actionsManager }}>
+      {children}
+    </ActionsManagerContext.Provider>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/managers/AttributesManagerContext.tsx b/ddb_main/tools/js/Shared/managers/AttributesManagerContext.tsx
new file mode 100644
index 0000000..7e95fdd
--- /dev/null
+++ b/ddb_main/tools/js/Shared/managers/AttributesManagerContext.tsx
@@ -0,0 +1,24 @@
+import React, { useMemo } from "react";
+
+import { AttributesManager } from "@dndbeyond/character-rules-engine/es";
+
+interface AttributesManagerContextValue {
+  attributesManager: AttributesManager;
+}
+const initContext: AttributesManagerContextValue = {
+  attributesManager: new AttributesManager(),
+};
+export const AttributesManagerContext =
+  React.createContext<AttributesManagerContextValue>(initContext);
+
+export function AttributesManagerProvider({ children }) {
+  const attributesManager: AttributesManager = useMemo(
+    () => new AttributesManager(),
+    []
+  );
+  return (
+    <AttributesManagerContext.Provider value={{ attributesManager }}>
+      {children}
+    </AttributesManagerContext.Provider>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/managers/CharacterFeaturesManagerContext.tsx b/ddb_main/tools/js/Shared/managers/CharacterFeaturesManagerContext.tsx
new file mode 100644
index 0000000..653070c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/managers/CharacterFeaturesManagerContext.tsx
@@ -0,0 +1,26 @@
+import React, { useMemo } from "react";
+
+import { CharacterFeaturesManager } from "@dndbeyond/character-rules-engine/es";
+
+interface CharacterFeaturesManagerContextValue {
+  characterFeaturesManager: CharacterFeaturesManager;
+}
+const initContext: CharacterFeaturesManagerContextValue = {
+  characterFeaturesManager: new CharacterFeaturesManager(),
+};
+export const CharacterFeaturesManagerContext =
+  React.createContext<CharacterFeaturesManagerContextValue>(initContext);
+
+export function CharacterFeaturesManagerProvider({ children }) {
+  const characterFeaturesManager: CharacterFeaturesManager = useMemo(
+    () => new CharacterFeaturesManager(),
+    []
+  );
+  return (
+    <CharacterFeaturesManagerContext.Provider
+      value={{ characterFeaturesManager }}
+    >
+      {children}
+    </CharacterFeaturesManagerContext.Provider>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/managers/CoinManagerContext.tsx b/ddb_main/tools/js/Shared/managers/CoinManagerContext.tsx
new file mode 100644
index 0000000..a66ae5b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/managers/CoinManagerContext.tsx
@@ -0,0 +1,21 @@
+import React, { useMemo } from "react";
+
+import { CoinManager } from "@dndbeyond/character-rules-engine/es";
+
+interface CoinManagerContextValue {
+  coinManager: CoinManager | null;
+}
+const initContext: CoinManagerContextValue = {
+  coinManager: null,
+};
+export const CoinManagerContext =
+  React.createContext<CoinManagerContextValue>(initContext);
+
+export function CoinManagerProvider({ children }) {
+  const coinManager: CoinManager = useMemo(() => new CoinManager(), []);
+  return (
+    <CoinManagerContext.Provider value={{ coinManager }}>
+      {children}
+    </CoinManagerContext.Provider>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/managers/ExtrasManagerContext.tsx b/ddb_main/tools/js/Shared/managers/ExtrasManagerContext.tsx
new file mode 100644
index 0000000..edafa83
--- /dev/null
+++ b/ddb_main/tools/js/Shared/managers/ExtrasManagerContext.tsx
@@ -0,0 +1,21 @@
+import React, { useMemo } from "react";
+
+import { ExtrasManager } from "@dndbeyond/character-rules-engine/es";
+
+interface ExtrasManagerContextValue {
+  extrasManager: ExtrasManager;
+}
+const initContext: ExtrasManagerContextValue = {
+  extrasManager: new ExtrasManager(),
+};
+export const ExtrasManagerContext =
+  React.createContext<ExtrasManagerContextValue>(initContext);
+
+export function ExtrasManagerProvider({ children }) {
+  const extrasManager: ExtrasManager = useMemo(() => new ExtrasManager(), []);
+  return (
+    <ExtrasManagerContext.Provider value={{ extrasManager }}>
+      {children}
+    </ExtrasManagerContext.Provider>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/managers/InventoryManagerContext.tsx b/ddb_main/tools/js/Shared/managers/InventoryManagerContext.tsx
new file mode 100644
index 0000000..e9e05a6
--- /dev/null
+++ b/ddb_main/tools/js/Shared/managers/InventoryManagerContext.tsx
@@ -0,0 +1,28 @@
+import React, { useContext, useMemo } from "react";
+
+import { InventoryManager } from "@dndbeyond/character-rules-engine/es";
+
+interface InventoryManagerContextValue {
+  inventoryManager: InventoryManager;
+}
+const initContext: InventoryManagerContextValue = {
+  inventoryManager: new InventoryManager(),
+};
+export const InventoryManagerContext =
+  React.createContext<InventoryManagerContextValue>(initContext);
+
+export function InventoryManagerProvider({ children }) {
+  const inventoryManager: InventoryManager = useMemo(
+    () => new InventoryManager(),
+    []
+  );
+  return (
+    <InventoryManagerContext.Provider value={{ inventoryManager }}>
+      {children}
+    </InventoryManagerContext.Provider>
+  );
+}
+
+export const useInventoryManager = () => {
+  return useContext(InventoryManagerContext);
+};
diff --git a/ddb_main/tools/js/Shared/managers/SpellsManagerContext.tsx b/ddb_main/tools/js/Shared/managers/SpellsManagerContext.tsx
new file mode 100644
index 0000000..6c09538
--- /dev/null
+++ b/ddb_main/tools/js/Shared/managers/SpellsManagerContext.tsx
@@ -0,0 +1,26 @@
+import React, { useMemo } from "react";
+
+import {
+  getSpellsManager,
+  SpellsManager,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface SpellsManagerContextValue {
+  spellsManager: SpellsManager;
+}
+
+const initContext: SpellsManagerContextValue = {
+  spellsManager: null!,
+};
+export const SpellsManagerContext =
+  React.createContext<SpellsManagerContextValue>(initContext);
+
+export function SpellsManagerProvider({ children }) {
+  // TODO: try getting the initialized sub and cleaning it up in here?
+  const spellsManager: SpellsManager = useMemo(() => getSpellsManager(), []);
+  return (
+    <SpellsManagerContext.Provider value={{ spellsManager }}>
+      {children}
+    </SpellsManagerContext.Provider>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/managers/index.tsx b/ddb_main/tools/js/Shared/managers/index.tsx
new file mode 100644
index 0000000..d620c0c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/managers/index.tsx
@@ -0,0 +1,25 @@
+import { ActionsManagerProvider } from "./ActionsManagerContext";
+import { AttributesManagerProvider } from "./AttributesManagerContext";
+import { CharacterFeaturesManagerProvider } from "./CharacterFeaturesManagerContext";
+import { CoinManagerProvider } from "./CoinManagerContext";
+import { ExtrasManagerProvider } from "./ExtrasManagerContext";
+import { InventoryManagerProvider } from "./InventoryManagerContext";
+import { SpellsManagerProvider } from "./SpellsManagerContext";
+
+export function Managers(props) {
+  return (
+    <ActionsManagerProvider>
+      <AttributesManagerProvider>
+        <ExtrasManagerProvider>
+          <SpellsManagerProvider>
+            <CharacterFeaturesManagerProvider>
+              <InventoryManagerProvider>
+                <CoinManagerProvider>{props.children}</CoinManagerProvider>
+              </InventoryManagerProvider>
+            </CharacterFeaturesManagerProvider>
+          </SpellsManagerProvider>
+        </ExtrasManagerProvider>
+      </AttributesManagerProvider>
+    </ActionsManagerProvider>
+  );
+}
diff --git a/ddb_main/tools/js/Shared/reducers/appEnv.ts b/ddb_main/tools/js/Shared/reducers/appEnv.ts
new file mode 100644
index 0000000..afdc243
--- /dev/null
+++ b/ddb_main/tools/js/Shared/reducers/appEnv.ts
@@ -0,0 +1,109 @@
+import {
+  DESKTOP_COMPONENT_START_WIDTH,
+  DESKTOP_LARGE_COMPONENT_START_WIDTH,
+  TABLET_COMPONENT_START_WIDTH,
+} from "../../CharacterSheet/config";
+import * as actionTypes from "../actions/appEnv/actionTypes";
+import { AppEnvAction } from "../actions/appEnv/typings";
+import { AppEnvState } from "../stores/typings";
+
+export enum StyleSizeTypeEnum {
+  NONE = 0,
+  MOBILE = 1,
+  TABLET = 2,
+  DESKTOP = 3,
+  DESKTOP_LARGE = 4,
+}
+
+export const initialEnvState: AppEnvState = {
+  authEndpoint: null,
+  username: null,
+  userId: -1,
+  userRoles: [],
+  characterId: null,
+  characterEndpoint: "",
+  characterServiceBaseUrl: null,
+  isMobile: true,
+  isReadonly: true,
+  canOverrideReadOnly: false,
+  redirect: "",
+  diceEnabled: false,
+  diceFeatureConfiguration: {
+    enabled: true,
+    menu: true,
+    assetBaseLocation: "",
+    trackingId: "",
+    apiEndpoint: "",
+  },
+  gameLog: {
+    isOpen: false,
+    lastMessageTime: 0,
+    apiEndpoint: "",
+    ddbApiEndpoint: "",
+  },
+  dimensions: {
+    styleSizeType: StyleSizeTypeEnum.NONE,
+    window: {
+      width: 0,
+      height: 0,
+    },
+    sheet: {
+      width: 0,
+      height: 0,
+    },
+  },
+  characterSlots: {
+    characterSlotLimit: null,
+    activeCharacterCount: 0,
+    lockedCharacterCount: 0,
+    allCharactersLocked: false,
+  },
+};
+function appEnv(
+  state: AppEnvState = initialEnvState,
+  action: AppEnvAction
+): AppEnvState {
+  switch (action.type) {
+    case actionTypes.DATA_SET:
+      return {
+        ...state,
+        ...action.payload,
+      };
+
+    case actionTypes.MOBILE_SET:
+      return {
+        ...state,
+        isMobile: action.payload.isMobile,
+      };
+
+    case actionTypes.DIMENSIONS_SET: {
+      let styleSizeType: StyleSizeTypeEnum = StyleSizeTypeEnum.NONE;
+      const windowWidth = action.payload.dimensions.window.width;
+
+      if (windowWidth >= DESKTOP_LARGE_COMPONENT_START_WIDTH) {
+        styleSizeType = StyleSizeTypeEnum.DESKTOP_LARGE;
+      } else if (windowWidth >= DESKTOP_COMPONENT_START_WIDTH) {
+        styleSizeType = StyleSizeTypeEnum.DESKTOP;
+      } else if (windowWidth >= TABLET_COMPONENT_START_WIDTH) {
+        styleSizeType = StyleSizeTypeEnum.TABLET;
+      } else {
+        styleSizeType = StyleSizeTypeEnum.MOBILE;
+      }
+
+      return {
+        ...state,
+        dimensions: {
+          ...action.payload.dimensions,
+          styleSizeType,
+        },
+      };
+    }
+
+    default:
+    // not implemented
+  }
+
+  return state;
+}
+
+export default appEnv;
diff --git a/ddb_main/tools/js/Shared/reducers/appInfo.ts b/ddb_main/tools/js/Shared/reducers/appInfo.ts
new file mode 100644
index 0000000..9587155
--- /dev/null
+++ b/ddb_main/tools/js/Shared/reducers/appInfo.ts
@@ -0,0 +1,29 @@
+import { appInfoActionTypes } from "../actions/appInfo";
+import { AppInfoAction } from "../actions/appInfo/typings";
+import { AppInfoState } from "../stores/typings";
+
+const initialState: AppInfoState = {
+  error: null,
+};
+function appInfo(
+  state: AppInfoState = initialState,
+  action: AppInfoAction
+): AppInfoState {
+  switch (action.type) {
+    case appInfoActionTypes.ERROR_SET:
+      return {
+        ...state,
+        error: {
+          type: action.payload.appErrorType,
+          errorId: action.payload.errorId,
+        },
+      };
+
+    default:
+    // not implemented
+  }
+
+  return state;
+}
+
+export default appInfo;
diff --git a/ddb_main/tools/js/Shared/reducers/rollResult.ts b/ddb_main/tools/js/Shared/reducers/rollResult.ts
new file mode 100644
index 0000000..32cd3ba
--- /dev/null
+++ b/ddb_main/tools/js/Shared/reducers/rollResult.ts
@@ -0,0 +1,215 @@
+import {
+  RollGroupContract,
+  RollResultContract,
+  DiceRolls,
+} from "@dndbeyond/character-rules-engine/es";
+
+import * as actionTypes from "../actions/rollResult/actionTypes";
+import { RollResultAction } from "../actions/rollResult/typings";
+import {
+  RollResultComponentGroupsState,
+  RollResultState,
+} from "../stores/typings";
+
+const initialRollState: RollResultContract = {
+  rollKey: "",
+  nextRollKey: null,
+  assignedValue: null,
+  rollTotal: null,
+  rollValues: [],
+};
+function rollReducer(
+  state: RollResultContract = initialRollState,
+  action: RollResultAction
+): RollResultContract {
+  switch (action.type) {
+    case actionTypes.ROLL_RESULT_DICE_ROLL_SET_COMMIT:
+    case actionTypes.ROLL_RESULT_COMPONENT_SIMULATED_DICE_ROLL_SET: {
+      return {
+        ...state,
+        ...action.payload.properties,
+      };
+    }
+
+    case actionTypes.ROLL_RESULT_GROUP_RESET_COMMIT: {
+      return DiceRolls.simulateRollResultContract({
+        rollKey: state.rollKey,
+        nextRollKey: state.nextRollKey,
+      });
+    }
+    default:
+    //not implemented
+  }
+
+  return state;
+}
+
+const initialGroupRollsState: Array<RollResultContract> = [];
+function groupRollsReducer(
+  state: Array<RollResultContract> = initialGroupRollsState,
+  action: RollResultAction
+): Array<RollResultContract> {
+  switch (action.type) {
+    case actionTypes.ROLL_RESULT_GROUP_RESET_COMMIT: {
+      return state.map((roll) => rollReducer(roll, action));
+    }
+
+    case actionTypes.ROLL_RESULT_DICE_ROLL_SET_COMMIT:
+    case actionTypes.ROLL_RESULT_COMPONENT_SIMULATED_DICE_ROLL_SET: {
+      const rollIdx = state.findIndex(
+        (roll) => roll.rollKey === action.payload.rollKey
+      );
+      return [
+        ...state.slice(0, rollIdx),
+        rollReducer(state[rollIdx], action),
+        ...state.slice(rollIdx + 1),
+      ];
+    }
+
+    default:
+    //not implemented
+  }
+
+  return state;
+}
+
+const initialGroupState: RollGroupContract = {
+  componentKey: "",
+  groupKey: "",
+  nextGroupKey: null,
+  rollResults: [],
+};
+function groupReducer(
+  state: RollGroupContract = initialGroupState,
+  action: RollResultAction
+): RollGroupContract {
+  switch (action.type) {
+    case actionTypes.ROLL_RESULT_GROUP_DICE_ROLLS_SET_COMMIT:
+      return {
+        ...state,
+        rollResults: action.payload.rollResults,
+      };
+
+    case actionTypes.ROLL_RESULT_GROUP_ORDER_SET_COMMIT:
+      return {
+        ...state,
+        nextGroupKey: action.payload.nextGroupKey,
+      };
+
+    case actionTypes.ROLL_RESULT_GROUP_RESET_COMMIT:
+    case actionTypes.ROLL_RESULT_DICE_ROLL_SET_COMMIT:
+    case actionTypes.ROLL_RESULT_COMPONENT_SIMULATED_DICE_ROLL_SET:
+      return {
+        ...state,
+        rollResults: groupRollsReducer(state.rollResults, action),
+      };
+
+    default:
+    // not implemented
+  }
+
+  return state;
+}
+
+const initialComponentGroupsState: RollResultComponentGroupsState = [];
+function componentGroupsReducer(
+  state: RollResultComponentGroupsState = initialComponentGroupsState,
+  action: RollResultAction
+): RollResultComponentGroupsState {
+  switch (action.type) {
+    case actionTypes.ROLL_RESULT_COMPONENT_GROUPS_SET_COMMIT:
+    case actionTypes.ROLL_RESULT_COMPONENT_SIMULATED_GROUPS_SET: {
+      return [...action.payload.groups];
+    }
+
+    case actionTypes.ROLL_RESULT_GROUP_ADD_COMMIT:
+      return [...state, action.payload.group];
+
+    case actionTypes.ROLL_RESULT_GROUP_REMOVE_COMMIT:
+      return state.filter(
+        (group) => group.groupKey !== action.payload.groupKey
+      );
+
+    case actionTypes.ROLL_RESULT_GROUP_DICE_ROLLS_SET_COMMIT:
+    case actionTypes.ROLL_RESULT_GROUP_ORDER_SET_COMMIT:
+    case actionTypes.ROLL_RESULT_GROUP_RESET_COMMIT:
+    case actionTypes.ROLL_RESULT_DICE_ROLL_SET_COMMIT:
+    case actionTypes.ROLL_RESULT_COMPONENT_SIMULATED_DICE_ROLL_SET: {
+      const groupIndex = state.findIndex(
+        (group) => group.groupKey === action.payload.groupKey
+      );
+      return [
+        ...state.slice(0, groupIndex),
+        groupReducer(state[groupIndex], action),
+        ...state.slice(groupIndex + 1),
+      ];
+    }
+
+    default:
+    // not implemented
+  }
+
+  return state;
+}
+
+const initialRollResultState: RollResultState = {
+  data: {},
+  simulatedData: {},
+  dataStatus: {},
+};
+function rollResult(
+  state: RollResultState = initialRollResultState,
+  action: RollResultAction
+): RollResultState {
+  switch (action.type) {
+    case actionTypes.ROLL_RESULT_COMPONENT_GROUPS_SET_COMMIT:
+    case actionTypes.ROLL_RESULT_GROUP_ADD_COMMIT:
+    case actionTypes.ROLL_RESULT_GROUP_DICE_ROLLS_SET_COMMIT:
+    case actionTypes.ROLL_RESULT_GROUP_ORDER_SET_COMMIT:
+    case actionTypes.ROLL_RESULT_GROUP_REMOVE_COMMIT:
+    case actionTypes.ROLL_RESULT_GROUP_RESET_COMMIT:
+    case actionTypes.ROLL_RESULT_DICE_ROLL_SET_COMMIT: {
+      return {
+        ...state,
+        data: {
+          ...state.data,
+          [action.payload.componentKey]: componentGroupsReducer(
+            state.data[action.payload.componentKey],
+            action
+          ),
+        },
+      };
+    }
+
+    case actionTypes.ROLL_RESULT_COMPONENT_SIMULATED_GROUPS_SET:
+    case actionTypes.ROLL_RESULT_COMPONENT_SIMULATED_DICE_ROLL_SET: {
+      return {
+        ...state,
+        simulatedData: {
+          ...state.simulatedData,
+          [action.payload.componentKey]: componentGroupsReducer(
+            state.simulatedData[action.payload.componentKey],
+            action
+          ),
+        },
+      };
+    }
+
+    case actionTypes.ROLL_RESULT_DICE_ROLL_STATUS_SET: {
+      return {
+        ...state,
+        dataStatus: {
+          ...state.dataStatus,
+          [action.payload.rollKey]: action.payload.loadingStatus,
+        },
+      };
+    }
+
+    default:
+    // not implemented
+  }
+
+  return state;
+}
+
+export default rollResult;
diff --git a/ddb_main/tools/js/Shared/reducers/toastMessage.ts b/ddb_main/tools/js/Shared/reducers/toastMessage.ts
new file mode 100644
index 0000000..f304b18
--- /dev/null
+++ b/ddb_main/tools/js/Shared/reducers/toastMessage.ts
@@ -0,0 +1,109 @@
+import * as actionTypes from "../actions/toastMessage/actionTypes";
+import { ToastMessageAction } from "../actions/toastMessage/typings";
+import {
+  MessageState,
+  ToastMessageMetaState,
+  ToastMessageState,
+  ToastState,
+} from "../stores/typings";
+
+const initialMessagePayloadState: ToastState = {
+  title: "",
+  message: "",
+};
+
+/**
+ *
+ * @param state
+ * @param action
+ */
+function messagePayload(
+  state: ToastState = initialMessagePayloadState,
+  action: ToastMessageAction
+): ToastState {
+  switch (action.type) {
+    case actionTypes.ADD_MESSAGE:
+      return {
+        ...state,
+        ...action.payload.toast,
+      };
+  }
+  return state;
+}
+
+const initialMessageMetaState: ToastMessageMetaState = {
+  level: "info",
+  autoDismiss: 5,
+  dismissible: true,
+  position: "bc",
+};
+
+/**
+ *
+ * @param state
+ * @param action
+ */
+function messageMeta(
+  state: ToastMessageMetaState = initialMessageMetaState,
+  action: ToastMessageAction
+): ToastMessageMetaState {
+  switch (action.type) {
+    case actionTypes.ADD_MESSAGE:
+      return {
+        ...state,
+        ...action.payload.meta,
+      };
+  }
+  return state;
+}
+
+const initialMessageState: MessageState = {
+  payload: initialMessagePayloadState,
+  meta: {},
+};
+function message(
+  state: MessageState = initialMessageState,
+  action: ToastMessageAction
+): MessageState {
+  switch (action.type) {
+    case actionTypes.ADD_MESSAGE:
+      return {
+        ...state,
+        payload: messagePayload(undefined, action),
+        meta: messageMeta(undefined, action),
+      };
+  }
+  return state;
+}
+
+let messageId: number = 0;
+
+/**
+ *
+ * @param state
+ * @param action
+ */
+function toastMessage(
+  state: ToastMessageState = {},
+  action: ToastMessageAction
+): ToastMessageState {
+  switch (action.type) {
+    case actionTypes.ADD_MESSAGE:
+      messageId++;
+      return {
+        [messageId]: message(undefined, action),
+      };
+
+    case actionTypes.REMOVE_MESSAGE:
+      let newState: ToastMessageState = {};
+      Object.keys(state).forEach((messageId) => {
+        if (messageId !== action.payload.id) {
+          newState[messageId] = state[messageId];
+        }
+      });
+      return newState;
+  }
+  return state;
+}
+
+export default toastMessage;
diff --git a/ddb_main/tools/js/Shared/sagas/rollResult.ts b/ddb_main/tools/js/Shared/sagas/rollResult.ts
new file mode 100644
index 0000000..8ca02d0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/sagas/rollResult.ts
@@ -0,0 +1,451 @@
+import { takeEvery, call, put, select } from "redux-saga/effects";
+
+import {
+  ApiRequests,
+  SagaHelpers,
+  UnpackMakeApiResponseData,
+  DiceRolls,
+  RollGroupContract,
+  HelperUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { rollResultActions, rollResultActionTypes } from "../actions";
+import {
+  RollResultAction,
+  RollResultComponentGroupPersistAction,
+  RollResultComponentSimulatedGroupsPersistAction,
+  RollResultDiceRollSetAction,
+  RollResultGroupAddAction,
+  RollResultGroupCreateAction,
+  RollResultGroupDestroyAction,
+  RollResultGroupOrderSetAction,
+  RollResultGroupRemoveAction,
+  RollResultGroupResetAction,
+  RollResultGroupsLoadAction,
+  RollResultComponentPersistAction,
+} from "../actions/rollResult/typings";
+import { appSelectors, rollResultSelectors } from "../selectors";
+import { RollResultUtils } from "../utils";
+
+export default function* saga() {
+  yield takeEvery(
+    Object.keys(rollResultActionTypes).map((key) => rollResultActionTypes[key]),
+    filter
+  );
+}
+
+function* filter(action: RollResultAction) {
+  switch (action.type) {
+    case rollResultActionTypes.ROLL_RESULT_GROUPS_LOAD:
+      yield call(handleRollResultGroupsLoad, action);
+      break;
+
+    case rollResultActionTypes.ROLL_RESULT_GROUP_CREATE:
+      yield call(handleRollResultGroupCreate, action);
+      break;
+
+    case rollResultActionTypes.ROLL_RESULT_GROUP_ADD:
+      yield call(handleRollResultGroupAdd, action);
+      break;
+
+    case rollResultActionTypes.ROLL_RESULT_GROUP_DESTROY:
+      yield call(handleRollResultGroupDestroy, action);
+      break;
+
+    case rollResultActionTypes.ROLL_RESULT_GROUP_REMOVE:
+      yield call(handleRollResultGroupRemove, action);
+      break;
+
+    case rollResultActionTypes.ROLL_RESULT_DICE_ROLL_SET:
+      yield call(handleRollResultDiceRollSet, action);
+      break;
+
+    case rollResultActionTypes.ROLL_RESULT_GROUP_ORDER_SET:
+      yield call(handleRollResultGroupOrderSet, action);
+      break;
+
+    case rollResultActionTypes.ROLL_RESULT_GROUP_RESET:
+      yield call(handleRollResultGroupReset, action);
+      break;
+
+    case rollResultActionTypes.ROLL_RESULT_COMPONENT_GROUP_PERSIST:
+      yield call(handleRollResultPersistGroup, action);
+      break;
+
+    case rollResultActionTypes.ROLL_RESULT_COMPONENT_PERSIST:
+      yield call(handleRollResultPersist, action);
+      break;
+
+    case rollResultActionTypes.ROLL_RESULT_COMPONENT_SIMULATED_GROUPS_PERSIST:
+      yield call(handleRollResultPersistSimulatedGroups, action);
+      break;
+
+    default:
+    //not implemented
+  }
+}
+
+function* handleRollResultGroupsLoad(action: RollResultGroupsLoadAction) {
+  const { componentKey, simulatedGroupCount, simulatedRollResultCount } =
+    action.payload;
+
+  const responseData: UnpackMakeApiResponseData<
+    typeof ApiRequests.getCharacterRollResultGroups
+  > = yield call(
+    SagaHelpers.getApiRequestData,
+    ApiRequests.getCharacterRollResultGroups,
+    { params: { componentKey } }
+  );
+
+  if (responseData === null || responseData.length === 0) {
+    if (simulatedGroupCount) {
+      let groups: Array<RollGroupContract> = [];
+
+      let lastGroup: RollGroupContract | null = null;
+      for (let i = 0; i < simulatedGroupCount; i++) {
+        const rollGroupContract = DiceRolls.simulateRollGroupContract(
+          {
+            componentKey,
+            nextGroupKey: lastGroup?.nextGroupKey ?? null,
+          },
+          simulatedRollResultCount
+        );
+        groups.push(rollGroupContract);
+
+        lastGroup = rollGroupContract;
+      }
+
+      yield put(
+        rollResultActions.rollResultComponentSimulatedGroupsSet(
+          componentKey,
+          groups
+        )
+      );
+    }
+  } else {
+    yield put(
+      rollResultActions.rollResultComponentGroupsSetCommit(
+        componentKey,
+        responseData
+      )
+    );
+  }
+}
+
+function* handleRollResultGroupCreate(action: RollResultGroupCreateAction) {
+  const { componentKey, simulatedRollResultCount } = action.payload;
+
+  const simulatedGroupsLookup: ReturnType<
+    typeof rollResultSelectors.getRollResultComponentSimulatedGroupsLookup
+  > = yield select(
+    rollResultSelectors.getRollResultComponentSimulatedGroupsLookup
+  );
+  const currentSimulatedGroups = RollResultUtils.getComponentOrderedGroups(
+    componentKey,
+    simulatedGroupsLookup
+  );
+
+  if (currentSimulatedGroups.length) {
+    const newGroup = DiceRolls.simulateRollGroupContract(
+      {
+        componentKey,
+        nextGroupKey: currentSimulatedGroups[0].groupKey ?? null,
+      },
+      simulatedRollResultCount
+    );
+
+    yield put(
+      rollResultActions.rollResultComponentSimulatedGroupsSet(componentKey, [
+        newGroup,
+        ...currentSimulatedGroups,
+      ])
+    );
+
+    yield put(
+      rollResultActions.rollResultComponentSimulatedGroupsPersist(componentKey)
+    );
+  } else {
+    const currentGroupLookup: ReturnType<
+      typeof rollResultSelectors.getRollResultComponentGroupsLookup
+    > = yield select(rollResultSelectors.getRollResultComponentGroupsLookup);
+    const currentGroups = RollResultUtils.getComponentOrderedGroups(
+      componentKey,
+      currentGroupLookup
+    );
+
+    const newGroup = DiceRolls.simulateRollGroupContract(
+      {
+        componentKey,
+        nextGroupKey: currentGroups[0]?.groupKey ?? null,
+      },
+      simulatedRollResultCount
+    );
+
+    yield put(rollResultActions.rollResultGroupAdd(newGroup));
+  }
+}
+
+function* handleRollResultGroupAdd(action: RollResultGroupAddAction) {
+  const { componentKey, group } = action.payload;
+
+  const responseData: UnpackMakeApiResponseData<
+    typeof ApiRequests.postCharacterRollResultGroup
+  > = yield call(
+    SagaHelpers.getApiRequestData,
+    ApiRequests.postCharacterRollResultGroup,
+    group
+  );
+
+  if (responseData !== null) {
+    yield put(rollResultActions.rollResultGroupAddCommit(group));
+  }
+}
+
+function* handleRollResultGroupDestroy(action: RollResultGroupDestroyAction) {
+  const { groupKey, nextGroupKey, componentKey } = action.payload;
+
+  const currentGroupLookup = yield select(
+    rollResultSelectors.getRollResultComponentGroupsLookup
+  );
+  const currentGroups = RollResultUtils.getGroupsByComponentKey(
+    componentKey,
+    currentGroupLookup
+  );
+  const groupToUpdate = currentGroups.find(
+    (group) => group.nextGroupKey === groupKey
+  );
+
+  yield put(rollResultActions.rollResultGroupRemove(componentKey, groupKey));
+
+  if (groupToUpdate) {
+    yield put(
+      rollResultActions.rollResultGroupOrderSet(
+        componentKey,
+        groupToUpdate.groupKey,
+        nextGroupKey
+      )
+    );
+  }
+}
+
+function* handleRollResultGroupOrderSet(action: RollResultGroupOrderSetAction) {
+  const { componentKey, groupKey, nextGroupKey } = action.payload;
+
+  const responseData: UnpackMakeApiResponseData<
+    typeof ApiRequests.putCharacterRollResultGroupOrder
+  > = yield call(
+    SagaHelpers.getApiRequestData,
+    ApiRequests.putCharacterRollResultGroupOrder,
+    {
+      groupKey,
+      componentKey,
+      nextGroupKey,
+    }
+  );
+
+  yield put(
+    rollResultActions.rollResultGroupOrderSetCommit(
+      componentKey,
+      groupKey,
+      nextGroupKey
+    )
+  );
+}
+
+function* handleRollResultGroupRemove(action: RollResultGroupRemoveAction) {
+  const { componentKey, groupKey } = action.payload;
+
+  const responseData: UnpackMakeApiResponseData<
+    typeof ApiRequests.deleteCharacterRollResultGroup
+  > = yield call(
+    SagaHelpers.getApiRequestData,
+    ApiRequests.deleteCharacterRollResultGroup,
+    {
+      groupKey,
+      componentKey,
+    }
+  );
+  yield put(
+    rollResultActions.rollResultGroupRemoveCommit(componentKey, groupKey)
+  );
+}
+
+function* handleRollResultPersistSimulatedGroups(
+  action: RollResultComponentSimulatedGroupsPersistAction
+) {
+  const { componentKey, groupKey, rollKey, properties } = action.payload;
+
+  const simulatedGroupsLookup: ReturnType<
+    typeof rollResultSelectors.getRollResultComponentSimulatedGroupsLookup
+  > = yield select(
+    rollResultSelectors.getRollResultComponentSimulatedGroupsLookup
+  );
+  const currentSimulatedGroups = RollResultUtils.getGroupsByComponentKey(
+    componentKey,
+    simulatedGroupsLookup
+  );
+
+  if (currentSimulatedGroups.length) {
+    for (let i = 0; i < currentSimulatedGroups.length; i++) {
+      const group = currentSimulatedGroups[i];
+      if (rollKey && groupKey === group.groupKey) {
+        // If an initial roll is with the simulated group
+        const rollIndex = group.rollResults.findIndex(
+          (rollResult) => rollResult.rollKey === rollKey
+        );
+        group.rollResults.splice(rollIndex, 1, {
+          ...group.rollResults[rollIndex],
+          ...properties,
+        });
+      }
+
+      yield put(rollResultActions.rollResultGroupAdd(group));
+    }
+
+    yield put(
+      rollResultActions.rollResultComponentSimulatedGroupsSet(componentKey, [])
+    );
+  }
+}
+
+function* handleRollResultPersistGroup(
+  action: RollResultComponentGroupPersistAction
+) {
+  const { componentKey, groupKey, rollResults } = action.payload;
+
+  const currentGroupLookup = yield select(
+    rollResultSelectors.getRollResultComponentGroupsLookup
+  );
+  const currentGroups = RollResultUtils.getGroupsByComponentKey(
+    componentKey,
+    currentGroupLookup
+  );
+  const groupToUpdate = currentGroups.find(
+    (group) => group.groupKey === groupKey
+  );
+
+  if (groupToUpdate) {
+    const responseData: UnpackMakeApiResponseData<
+      typeof ApiRequests.putCharacterRollResultGroup
+    > = yield call(
+      SagaHelpers.getApiRequestData,
+      ApiRequests.putCharacterRollResultGroup,
+      {
+        groupKey,
+        componentKey,
+        rollResults,
+      }
+    );
+  }
+}
+
+function* handleRollResultPersist(action: RollResultComponentPersistAction) {
+  const {
+    componentKey,
+    groupKey,
+    rollKey,
+    properties: { rollTotal, rollValues, assignedValue },
+    nextRollKey,
+  } = action.payload;
+
+  if (groupKey && rollKey) {
+    const responseData: UnpackMakeApiResponseData<
+      typeof ApiRequests.putCharacterRollResult
+    > = yield call(
+      SagaHelpers.getApiRequestData,
+      ApiRequests.putCharacterRollResult,
+      {
+        rollKey,
+        nextRollKey,
+        rollTotal,
+        assignedValue,
+        rollValues,
+        groupKey,
+        componentKey,
+      }
+    );
+  }
+}
+
+function* handleRollResultDiceRollSet(action: RollResultDiceRollSetAction) {
+  const { rollKey, properties, nextRollKey } = action.payload;
+
+  const parentKeyInfoLookup: ReturnType<
+    typeof appSelectors.getRollParentKeyInfoLookup
+  > = yield select(appSelectors.getRollParentKeyInfoLookup);
+  const simulatedParentKeyInfoLookup: ReturnType<
+    typeof appSelectors.getSimulatedRollParentKeyInfoLookup
+  > = yield select(appSelectors.getSimulatedRollParentKeyInfoLookup);
+  const parentKeyInfo = HelperUtils.lookupDataOrFallback(
+    parentKeyInfoLookup,
+    rollKey
+  );
+  const simulatedParentKeyInfo = HelperUtils.lookupDataOrFallback(
+    simulatedParentKeyInfoLookup,
+    rollKey
+  );
+
+  if (parentKeyInfo) {
+    const { groupKey, componentKey } = parentKeyInfo;
+
+    yield put(
+      rollResultActions.rollResultComponentPersist(
+        componentKey,
+        groupKey,
+        rollKey,
+        properties,
+        nextRollKey
+      )
+    );
+
+    yield put(
+      rollResultActions.rollResultDiceRollSetCommit(
+        componentKey,
+        groupKey,
+        rollKey,
+        properties,
+        nextRollKey
+      )
+    );
+  } else if (simulatedParentKeyInfo) {
+    const { groupKey, componentKey } = simulatedParentKeyInfo;
+
+    yield put(
+      rollResultActions.rollResultComponentSimulatedGroupsPersist(
+        componentKey,
+        groupKey,
+        rollKey,
+        properties
+      )
+    );
+
+    yield put(
+      rollResultActions.rollResultComponentSimulatedDiceRollSet(
+        componentKey,
+        groupKey,
+        rollKey,
+        properties
+      )
+    );
+  }
+}
+
+function* handleRollResultGroupReset(action: RollResultGroupResetAction) {
+  const { componentKey, groupKey, rollResults } = action.payload;
+
+  yield put(
+    rollResultActions.rollResultComponentGroupPersist(
+      componentKey,
+      groupKey,
+      rollResults
+    )
+  );
+
+  yield put(
+    rollResultActions.rollResultGroupResetCommit(
+      componentKey,
+      groupKey,
+      rollResults
+    )
+  );
+}
diff --git a/ddb_main/tools/js/Shared/selectors/appEnv.ts b/ddb_main/tools/js/Shared/selectors/appEnv.ts
new file mode 100644
index 0000000..50217d6
--- /dev/null
+++ b/ddb_main/tools/js/Shared/selectors/appEnv.ts
@@ -0,0 +1,26 @@
+import { SharedAppState } from "../stores/typings";
+
+export const getIsMobile = (state: SharedAppState) => state.appEnv.isMobile;
+export const getIsReadonly = (state: SharedAppState) => state.appEnv.isReadonly;
+export const getCanOverrideReadOnly = (state: SharedAppState) =>
+  state.appEnv.canOverrideReadOnly;
+export const getAuthEndpoint = (state: SharedAppState) =>
+  state.appEnv.authEndpoint;
+export const getCharacterServiceBaseUrl = (state: SharedAppState) =>
+  state.appEnv.characterServiceBaseUrl;
+export const getCharacterEndpoint = (state: SharedAppState) =>
+  state.appEnv.characterEndpoint;
+export const getCharacterId = (state: SharedAppState) =>
+  state.appEnv.characterId;
+export const getDimensions = (state: SharedAppState) => state.appEnv.dimensions;
+export const getRedirect = (state: SharedAppState) => state.appEnv.redirect;
+export const getUsername = (state: SharedAppState) => state.appEnv.username;
+export const getUserId = (state: SharedAppState) => state.appEnv.userId;
+export const getUserRoles = (state: SharedAppState) => state.appEnv.userRoles;
+export const getDiceEnabled = (state: SharedAppState) =>
+  state.appEnv.diceEnabled;
+export const getDiceFeatureConfiguration = (state: SharedAppState) =>
+  state.appEnv.diceFeatureConfiguration;
+export const getGameLog = (state: SharedAppState) => state.appEnv.gameLog;
+export const getCharacterSlots = (state: SharedAppState) =>
+  state.appEnv.characterSlots;
diff --git a/ddb_main/tools/js/Shared/selectors/appInfo.ts b/ddb_main/tools/js/Shared/selectors/appInfo.ts
new file mode 100644
index 0000000..435fe97
--- /dev/null
+++ b/ddb_main/tools/js/Shared/selectors/appInfo.ts
@@ -0,0 +1,3 @@
+import { SharedAppState } from "../stores/typings";
+
+export const getError = (state: SharedAppState) => state.appInfo.error;
diff --git a/ddb_main/tools/js/Shared/selectors/composite/apiCreator/creators.ts b/ddb_main/tools/js/Shared/selectors/composite/apiCreator/creators.ts
new file mode 100644
index 0000000..f099a95
--- /dev/null
+++ b/ddb_main/tools/js/Shared/selectors/composite/apiCreator/creators.ts
@@ -0,0 +1,492 @@
+import { merge } from "lodash";
+import { createSelector } from "reselect";
+
+import {
+  ApiAdapterResponse,
+  ApiAdapterRequestConfig,
+  ApiAdapterUtils,
+  ApiResponse,
+  ApiRequests,
+  ApiUtils,
+  BackgroundUtils,
+  CharClass,
+  ClassUtils,
+  Constants,
+  DefinitionBasedEntity,
+  DefinitionBasedEntityDefinition,
+  EntityRestrictionData,
+  EntitledEntity,
+  EntityUtils,
+  rulesEngineSelectors,
+  RaceUtils,
+  StartingEquipmentContract,
+  StartingEquipmentSlotContract,
+  StartingEquipmentRuleSlotContract,
+  StartingEquipmentRuleContract,
+} from "@dndbeyond/character-rules-engine/es";
+
+import * as appEnvSelectors from "../../appEnv";
+import {
+  MakeClassBasedApiClassFeaturesRequest,
+  MakeClassBasedApiSpellsRequest,
+} from "./typings";
+
+// TODO: almost this entire file could/should come from RE managers
+function restrictGameDataDefinitionResponseData<
+  T extends ApiAdapterResponse<
+    ApiResponse<EntitledEntity<DefinitionBasedEntityDefinition>>
+  >
+>(
+  response: T,
+  entityRestrictionData: EntityRestrictionData,
+  characterId: number | null
+): T {
+  let originalData = ApiAdapterUtils.getResponseData(response);
+  if (
+    originalData !== null &&
+    characterId !== null &&
+    response.data.data !== undefined
+  ) {
+    response.data.data.definitionData =
+      EntityUtils.filterNonRestrictedEntityDefinitions(
+        originalData.definitionData,
+        entityRestrictionData
+      );
+  }
+  return response;
+}
+
+function restrictEntityDefinitionResponseData<
+  T extends ApiAdapterResponse<
+    ApiResponse<Array<DefinitionBasedEntityDefinition>>
+  >
+>(
+  response: T,
+  entityRestrictionData: EntityRestrictionData,
+  characterId: number | null
+): T {
+  let originalData = ApiAdapterUtils.getResponseData(response);
+  if (originalData !== null && characterId !== null) {
+    response.data.data = EntityUtils.filterNonRestrictedEntityDefinitions(
+      originalData,
+      entityRestrictionData
+    );
+  }
+  return response;
+}
+
+function restrictEntityResponseData<
+  T extends ApiAdapterResponse<ApiResponse<Array<DefinitionBasedEntity>>>
+>(
+  response: T,
+  entityRestrictionData: EntityRestrictionData,
+  characterId: number | null
+): T {
+  let originalData = ApiAdapterUtils.getResponseData(response);
+  if (originalData !== null && characterId !== null) {
+    response.data.data = EntityUtils.filterNonRestrictedEntities(
+      originalData,
+      entityRestrictionData
+    );
+  }
+  return response;
+}
+
+function restrictStartingEquipmentResponseData<
+  T extends ApiAdapterResponse<ApiResponse<StartingEquipmentContract>>
+>(
+  response: T,
+  entityRestrictionData: EntityRestrictionData,
+  characterId: number | null
+): T {
+  let originalData = ApiAdapterUtils.getResponseData(response);
+  if (originalData !== null && characterId !== null) {
+    // StartingEquipmentContract has arrays of arrays to loop through to get to the entity definitions
+    // that can be filtered on with `filterNonRestrictedEntities`. The nested loops are a code smell, but
+    // there shouldn't be a big performance impact as no class has an insane amount of starting equipment.
+    response.data.data = {
+      slots:
+        originalData.slots?.map((slot: StartingEquipmentSlotContract) => {
+          return {
+            ...slot,
+            ruleSlots:
+              slot.ruleSlots?.map(
+                (ruleSlot: StartingEquipmentRuleSlotContract) => {
+                  return {
+                    ...ruleSlot,
+                    rules:
+                      ruleSlot.rules?.map(
+                        (rule: StartingEquipmentRuleContract) => {
+                          const definitions = rule.definitions?.map(
+                            (definition) => {
+                              return { definition: definition };
+                            }
+                          );
+                          return {
+                            ...rule,
+                            definitions: definitions
+                              ? EntityUtils.filterNonRestrictedEntities(
+                                  definitions,
+                                  entityRestrictionData
+                                ).map((definition) => {
+                                  return { ...definition.definition };
+                                })
+                              : null,
+                          };
+                        }
+                      ) ?? null,
+                  };
+                }
+              ) ?? null,
+          };
+        }) ?? null,
+    };
+  }
+  return response;
+}
+
+export const makeLoadAvailableClasses = createSelector(
+  [
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (entityRestrictionData, characterId) =>
+    (additionalConfig?: ApiAdapterRequestConfig) => {
+      return ApiRequests.getCharacterGameDataClasses(additionalConfig).then(
+        (response) =>
+          restrictEntityDefinitionResponseData(
+            response,
+            entityRestrictionData,
+            characterId
+          )
+      );
+    }
+);
+
+export const makeLoadAvailableSubclasses = createSelector(
+  [
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (entityRestrictionData, characterId) =>
+    (baseClassId: number, additionalConfig?: ApiAdapterRequestConfig) => {
+      const requiredConfig: ApiAdapterRequestConfig = {
+        params: {
+          baseClassId,
+        },
+      };
+      return ApiRequests.getCharacterGameDataSubclasses(
+        merge({}, additionalConfig, requiredConfig)
+      ).then((response) =>
+        restrictEntityDefinitionResponseData(
+          response,
+          entityRestrictionData,
+          characterId
+        )
+      );
+    }
+);
+
+export const makeLoadAvailableRaces = createSelector(
+  [
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (entityRestrictionData, characterId) =>
+    (additionalConfig?: ApiAdapterRequestConfig) => {
+      return ApiRequests.getCharacterGameDataRaces(additionalConfig).then(
+        (response) =>
+          restrictEntityDefinitionResponseData(
+            response,
+            entityRestrictionData,
+            characterId
+          )
+      );
+    }
+);
+
+export const makeLoadAvailableFeats = createSelector(
+  [
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (entityRestrictionData, characterId) =>
+    (additionalConfig?: ApiAdapterRequestConfig) => {
+      return ApiRequests.getCharacterGameDataFeats(additionalConfig).then(
+        (response) =>
+          restrictEntityDefinitionResponseData(
+            response,
+            entityRestrictionData,
+            characterId
+          )
+      );
+    }
+);
+
+export const makeLoadAvailableItems = createSelector(
+  [
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (entityRestrictionData, characterId) =>
+    (additionalConfig?: ApiAdapterRequestConfig) => {
+      return ApiRequests.getCharacterGameDataItems(additionalConfig).then(
+        (response) =>
+          restrictEntityDefinitionResponseData(
+            response,
+            entityRestrictionData,
+            characterId
+          )
+      );
+    }
+);
+
+export const makeLoadAvailableMonsters = createSelector(
+  [
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (entityRestrictionData, characterId) =>
+    (additionalConfig?: ApiAdapterRequestConfig) => {
+      return ApiRequests.getCharacterGameDataMonsters(additionalConfig).then(
+        (response) =>
+          restrictEntityDefinitionResponseData(
+            response,
+            entityRestrictionData,
+            characterId
+          )
+      );
+    }
+);
+
+export const makeLoadAvailableInfusions = createSelector(
+  [
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (entityRestrictionData, characterId) =>
+    (additionalConfig?: ApiAdapterRequestConfig) => {
+      return ApiUtils.makeGetAllDefinitionTypeRequest(
+        Constants.DefinitionTypeEnum.INFUSION
+      )(additionalConfig).then((response) =>
+        restrictGameDataDefinitionResponseData(
+          response,
+          entityRestrictionData,
+          characterId
+        )
+      );
+    }
+);
+
+export const makeLoadAvailableVehicles = createSelector(
+  [
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (entityRestrictionData, characterId) =>
+    (additionalConfig?: ApiAdapterRequestConfig) => {
+      return ApiUtils.makeGetAllDefinitionTypeRequest(
+        Constants.DefinitionTypeEnum.VEHICLE
+      )(additionalConfig).then((response) =>
+        restrictGameDataDefinitionResponseData(
+          response,
+          entityRestrictionData,
+          characterId
+        )
+      );
+    }
+);
+
+export const makeLoadClassStartingEquipment = createSelector(
+  [
+    rulesEngineSelectors.getStartingClass,
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (startingClass, entityRestrictionData, characterId) => {
+    let id: number = -1;
+    if (startingClass) {
+      id = ClassUtils.getId(startingClass);
+    }
+
+    return (additionalConfig?: ApiAdapterRequestConfig) => {
+      const requiredConfig: ApiAdapterRequestConfig = {
+        params: {
+          id,
+        },
+      };
+      return ApiRequests.getCharacterGameDataClassStartingEquipment(
+        merge({}, additionalConfig, requiredConfig)
+      ).then((response) =>
+        restrictStartingEquipmentResponseData(
+          response,
+          entityRestrictionData,
+          characterId
+        )
+      );
+    };
+  }
+);
+
+export const makeLoadBackgroundStartingEquipment = createSelector(
+  [rulesEngineSelectors.getBackgroundInfo],
+  (backgroundInfo) => {
+    let id: number = -1;
+    if (backgroundInfo) {
+      id = BackgroundUtils.getId(backgroundInfo);
+    }
+
+    return (additionalConfig?: ApiAdapterRequestConfig) => {
+      const requiredConfig: ApiAdapterRequestConfig = {
+        params: {
+          id,
+        },
+      };
+      return ApiRequests.getCharacterGameDataBackgroundStartingEquipment(
+        merge({}, additionalConfig, requiredConfig)
+      );
+    };
+  }
+);
+
+// TODO: still used in builder but could be used from RE
+export const makeLoadClassRemainingSpells = createSelector(
+  [
+    rulesEngineSelectors.getClasses,
+    rulesEngineSelectors.getGlobalSpellListIds,
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (
+    classes,
+    globalSpellListIds,
+    entityRestrictionData,
+    characterId
+  ): MakeClassBasedApiSpellsRequest => {
+    return (charClass: CharClass) => {
+      if (
+        !ClassUtils.isSpellcastingActive(charClass) &&
+        !ClassUtils.isPactMagicActive(charClass)
+      ) {
+        return null;
+      }
+
+      return (additionalConfig?: ApiAdapterRequestConfig) => {
+        const requiredConfig: ApiAdapterRequestConfig = {
+          params: {
+            classId: ClassUtils.getActiveId(charClass),
+            classLevel: ClassUtils.getLevel(charClass),
+            spellListIds: [
+              ...globalSpellListIds,
+              ...ClassUtils.getSpellListIds(charClass),
+            ],
+          },
+        };
+        return ApiRequests.getCharacterGameDataSpells(
+          merge({}, additionalConfig, requiredConfig)
+        ).then((response) =>
+          restrictEntityResponseData(
+            response,
+            entityRestrictionData,
+            characterId
+          )
+        );
+      };
+    };
+  }
+);
+
+// TODO: still used in builder but could be used from RE
+export const makeLoadClassAlwaysKnownSpells = createSelector(
+  [
+    rulesEngineSelectors.getClasses,
+    rulesEngineSelectors.getGlobalSpellListIds,
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (
+    classes,
+    globalSpellListIds,
+    entityRestrictionData,
+    characterId
+  ): MakeClassBasedApiSpellsRequest => {
+    return (charClass: CharClass) => {
+      if (!ClassUtils.getKnowsAllSpells(charClass)) {
+        return null;
+      }
+
+      return (additionalConfig?: ApiAdapterRequestConfig) => {
+        const requiredConfig: ApiAdapterRequestConfig = {
+          params: {
+            classId: ClassUtils.getActiveId(charClass),
+            classLevel: ClassUtils.getLevel(charClass),
+            spellListIds: [
+              ...globalSpellListIds,
+              ...ClassUtils.getSpellListIds(charClass),
+            ],
+          },
+        };
+        return ApiRequests.getCharacterGameDataAlwaysKnownSpells(
+          merge({}, additionalConfig, requiredConfig)
+        ).then((response) =>
+          restrictEntityResponseData(
+            response,
+            entityRestrictionData,
+            characterId
+          )
+        );
+      };
+    };
+  }
+);
+
+export const makeLoadAvailableBackgrounds = createSelector(
+  [
+    rulesEngineSelectors.getEntityRestrictionData,
+    appEnvSelectors.getCharacterId,
+  ],
+  (entityRestrictionData, characterId) =>
+    (additionalConfig?: ApiAdapterRequestConfig) => {
+      return ApiRequests.getCharacterGameDataBackgrounds(additionalConfig).then(
+        (response) =>
+          restrictEntityDefinitionResponseData(
+            response,
+            entityRestrictionData,
+            characterId
+          )
+      );
+    }
+);
+
+export const makeLoadAvailableOptionalRacialTraits = createSelector(
+  [rulesEngineSelectors.getRace],
+  (race) => (additionalConfig?: ApiAdapterRequestConfig) => {
+    const requiredConfig: ApiAdapterRequestConfig = {
+      params: {
+        entityRaceId: race ? RaceUtils.getEntityRaceId(race) : -1,
+        entityRaceTypeId: race ? RaceUtils.getEntityRaceTypeId(race) : -1,
+      },
+    };
+    return ApiRequests.getCharacterGameDataRacialTraits(
+      merge({}, additionalConfig, requiredConfig)
+    );
+  }
+);
+
+export const makeLoadAvailableOptionalClassFeatures = createSelector(
+  [rulesEngineSelectors.getClasses],
+  (classes): MakeClassBasedApiClassFeaturesRequest => {
+    return (charClass: CharClass) => {
+      return (additionalConfig?: ApiAdapterRequestConfig) => {
+        const requiredConfig: ApiAdapterRequestConfig = {
+          params: {
+            classId: ClassUtils.getActiveId(charClass),
+          },
+        };
+        return ApiRequests.getCharacterGameDataClassFeatures(
+          merge({}, additionalConfig, requiredConfig)
+        );
+      };
+    };
+  }
+);
diff --git a/ddb_main/tools/js/Shared/selectors/composite/app.ts b/ddb_main/tools/js/Shared/selectors/composite/app.ts
new file mode 100644
index 0000000..e17b55f
--- /dev/null
+++ b/ddb_main/tools/js/Shared/selectors/composite/app.ts
@@ -0,0 +1,20 @@
+import { createSelector } from "reselect";
+
+import * as RollResultUtils from "../../utils/RollResult/generators";
+import * as rollResultSelectors from "../rollResult";
+
+/**
+ * @Returns {RollParentKeyInfoLookup}
+ */
+export const getRollParentKeyInfoLookup = createSelector(
+  [rollResultSelectors.getRollResultComponentGroupsLookup],
+  RollResultUtils.generateRollParentKeyInfoLookup
+);
+
+/**
+ * @Returns {RollParentKeyInfoLookup}
+ */
+export const getSimulatedRollParentKeyInfoLookup = createSelector(
+  [rollResultSelectors.getRollResultComponentSimulatedGroupsLookup],
+  RollResultUtils.generateRollParentKeyInfoLookup
+);
diff --git a/ddb_main/tools/js/Shared/selectors/rollContext.ts b/ddb_main/tools/js/Shared/selectors/rollContext.ts
new file mode 100644
index 0000000..3342df7
--- /dev/null
+++ b/ddb_main/tools/js/Shared/selectors/rollContext.ts
@@ -0,0 +1,26 @@
+import { createSelector } from "reselect";
+
+import {
+  DecorationUtils,
+  rulesEngineSelectors,
+} from "@dndbeyond/character-rules-engine/es";
+import { IRollContext } from "@dndbeyond/dice";
+
+import { appEnvSelectors } from "./index";
+
+export const getCharacterRollContext = createSelector(
+  [
+    appEnvSelectors.getCharacterId,
+    rulesEngineSelectors.getName,
+    rulesEngineSelectors.getDecorationInfo,
+  ],
+  (characterId, name, decorationInfo): IRollContext => {
+    return {
+      entityId: characterId ? characterId.toString() : "",
+      entityType: "character",
+      name: name?.toString(),
+      avatarUrl:
+        DecorationUtils.getAvatarInfo(decorationInfo).avatarUrl?.toString(),
+    };
+  }
+);
diff --git a/ddb_main/tools/js/Shared/selectors/rollResult.ts b/ddb_main/tools/js/Shared/selectors/rollResult.ts
new file mode 100644
index 0000000..7ac3dc8
--- /dev/null
+++ b/ddb_main/tools/js/Shared/selectors/rollResult.ts
@@ -0,0 +1,9 @@
+import { SharedAppState } from "../stores/typings";
+
+export const getRollResultComponentGroupsLookup = (state: SharedAppState) =>
+  state.rollResult.data;
+export const getRollResultComponentSimulatedGroupsLookup = (
+  state: SharedAppState
+) => state.rollResult.simulatedData;
+export const getRollStatusLookup = (state: SharedAppState) =>
+  state.rollResult.dataStatus;
diff --git a/ddb_main/tools/js/Shared/selectors/toastMessage.ts b/ddb_main/tools/js/Shared/selectors/toastMessage.ts
new file mode 100644
index 0000000..68320c3
--- /dev/null
+++ b/ddb_main/tools/js/Shared/selectors/toastMessage.ts
@@ -0,0 +1,3 @@
+import { SharedAppState } from "../stores/typings";
+
+export const getToastMessages = (state: SharedAppState) => state.toastMessage;
diff --git a/ddb_main/tools/js/Shared/stores/StateStoreUtils.ts b/ddb_main/tools/js/Shared/stores/StateStoreUtils.ts
new file mode 100644
index 0000000..ab98cbd
--- /dev/null
+++ b/ddb_main/tools/js/Shared/stores/StateStoreUtils.ts
@@ -0,0 +1,52 @@
+import { applyMiddleware, createStore, Reducer, Store } from "redux";
+import { composeWithDevTools } from "redux-devtools-extension";
+import createSagaMiddleware from "redux-saga";
+
+import {
+  defaultSaga,
+  ApiAdapterException,
+  OverrideApiException,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { rollResultSaga } from "../sagas";
+import { AppLoggerUtils } from "../utils";
+
+let store: Store | null = null;
+
+export function getAppStore(): Store | null {
+  return store;
+}
+
+export function configureStore(
+  initialState: any,
+  rootReducer: Reducer,
+  sagaMiddleware: Array<any> = [],
+  middleware: Array<any> = []
+): Store {
+  const storeSagaMiddleware = createSagaMiddleware({
+    onError: (error, errorInfo) => {
+      // ApiAdapterException errors are handled by the AppApiAdapter
+      if (!(error instanceof ApiAdapterException)) {
+        AppLoggerUtils.logError(error);
+      }
+    },
+  });
+
+  let storeMiddleware: Array<any> = [];
+  storeMiddleware.push(...middleware);
+  storeMiddleware.push(storeSagaMiddleware);
+
+  store = createStore(
+    rootReducer,
+    initialState,
+    composeWithDevTools(applyMiddleware(...storeMiddleware))
+  );
+
+  storeSagaMiddleware.run(defaultSaga);
+  storeSagaMiddleware.run(rollResultSaga);
+  for (let i = 0; i < sagaMiddleware.length; i++) {
+    storeSagaMiddleware.run(sagaMiddleware[i]);
+  }
+
+  return store;
+}
diff --git a/ddb_main/tools/js/Shared/utils/AppLogger/constants.ts b/ddb_main/tools/js/Shared/utils/AppLogger/constants.ts
new file mode 100644
index 0000000..19cd619
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/AppLogger/constants.ts
@@ -0,0 +1,7 @@
+import * as HttpStatusCodes from "../../constants/HttpStatusCodes";
+
+export const COALESCED_ERROR_CODES = [
+  HttpStatusCodes.UNAUTHORIZED,
+  HttpStatusCodes.FORBIDDEN,
+  HttpStatusCodes.NOT_FOUND,
+];
diff --git a/ddb_main/tools/js/Shared/utils/AppLogger/utils.ts b/ddb_main/tools/js/Shared/utils/AppLogger/utils.ts
new file mode 100644
index 0000000..2d6ffa5
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/AppLogger/utils.ts
@@ -0,0 +1,227 @@
+import axios from "axios";
+import { merge } from "lodash";
+
+import {
+  ApiAdapterDataException,
+  ApiAdapterException,
+  ApiAdapterUrlException,
+  ApiException,
+  AuthException,
+  AuthMissingException,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { appEnvActions } from "../../actions";
+import { appInfoActions } from "../../actions/appInfo";
+import AppErrorTypeEnum from "../../constants/AppErrorTypeEnum";
+import * as HttpStatusCodes from "../../constants/HttpStatusCodes";
+import { appEnvSelectors } from "../../selectors";
+import { StateStoreUtils } from "../../stores";
+import { AppNotificationUtils, ErrorCustomTags, ErrorUtils } from "../../utils";
+import { COALESCED_ERROR_CODES } from "./constants";
+
+let hasDispatchedAuthException: boolean = false;
+
+/**
+ *
+ * @param url
+ */
+export function processApiUrl(url: string): string {
+  let match = url.match(/^(.*\/character\/v\d+\/character)\/\d+$/);
+  if (match) {
+    return [match[1], "{id}"].join("/");
+  }
+  return url;
+}
+
+/**
+ *
+ * @param error
+ * @param extraContextData
+ */
+export function getApiAdapterUrlExceptionContextData(
+  error: ApiAdapterUrlException,
+  extraContextData: Record<string, any>
+): Record<string, any> {
+  let errorContextData: Record<string, any> = error.contextData ?? {};
+  let errorMessageContextData: Record<string, any> = {
+    errorMessage: error.message,
+    errorUrl: error.url,
+    errorMethod: error.method,
+  };
+
+  return merge({}, errorContextData, errorMessageContextData, extraContextData);
+}
+
+/**
+ *
+ * @param error
+ */
+export function getApiAdapterUrlExceptionCustomTags(
+  error: ApiAdapterUrlException
+): ErrorCustomTags {
+  return {
+    serverErrorId: error.contextData?.serverErrorData?.errorCode ?? null,
+  };
+}
+
+/**
+ *
+ * @param error
+ * @param messagePrefix
+ */
+export function getApiAdapterUrlExceptionMessage(
+  error: ApiAdapterUrlException,
+  messagePrefix: string
+): string {
+  if (error.errorCode === null) {
+    return "Unknown Client Request Failure";
+  }
+
+  if (COALESCED_ERROR_CODES.includes(error.errorCode)) {
+    return [messagePrefix, error.errorCode].join(" - ");
+  }
+
+  return [
+    messagePrefix,
+    error.errorCode,
+    error.method ?? "UNKNOWN Method",
+    error.url ? processApiUrl(error.url) : "UNKNOWN URL",
+  ].join(" - ");
+}
+
+/**
+ *
+ * @param error
+ */
+export function getApiAdapterUrlExceptionAppErrorType(
+  error: ApiAdapterUrlException
+): AppErrorTypeEnum {
+  if (error.errorCode === HttpStatusCodes.FORBIDDEN) {
+    return AppErrorTypeEnum.ACCESS_DENIED;
+  }
+  if (error.errorCode === HttpStatusCodes.NOT_FOUND) {
+    return AppErrorTypeEnum.NOT_FOUND;
+  }
+
+  return AppErrorTypeEnum.API_FAIL;
+}
+
+/**
+ *
+ * @param error
+ * @param contextData
+ */
+export function logError(
+  error: Error,
+  contextData: Record<string, any> = {}
+): null {
+  // This function returns null because the Rules Engine config expects a log method
+  // that returns string | null. See packages/rules-engine/src/config/typings.ts
+
+  if (process.env.NODE_ENV !== "production") {
+    console.log("***************");
+    console.log("The following error happened:");
+    console.log(error);
+    console.log("***************");
+  }
+
+  if (axios.isCancel(error)) {
+    // only do something if not canceled, cancellation should be fine
+    return null;
+  }
+
+  let appErrorType: AppErrorTypeEnum = AppErrorTypeEnum.GENERIC;
+
+  let message: string | null = null;
+  let shouldLogError: boolean = true;
+  let customTags: ErrorCustomTags = {};
+
+  if (error instanceof ApiException) {
+    appErrorType = getApiAdapterUrlExceptionAppErrorType(error);
+    contextData = getApiAdapterUrlExceptionContextData(error, contextData);
+    customTags = getApiAdapterUrlExceptionCustomTags(error);
+    message = getApiAdapterUrlExceptionMessage(error, "API");
+  } else if (error instanceof ApiAdapterDataException) {
+    appErrorType = getApiAdapterUrlExceptionAppErrorType(error);
+    contextData = getApiAdapterUrlExceptionContextData(error, contextData);
+    customTags = getApiAdapterUrlExceptionCustomTags(error);
+    message = getApiAdapterUrlExceptionMessage(error, "API Data");
+  } else if (error instanceof AuthException) {
+    appErrorType = AppErrorTypeEnum.AUTH_FAIL;
+    message = "Auth Failure";
+
+    // We could emit multiple auth exceptions when we make parallel requests
+    // AuthException isn't recoverable, so it should be fine to only log the first one
+    if (hasDispatchedAuthException) {
+      shouldLogError = false;
+    } else {
+      hasDispatchedAuthException = true;
+    }
+  } else if (error instanceof AuthMissingException) {
+    appErrorType = AppErrorTypeEnum.AUTH_MISSING;
+    shouldLogError = false;
+  }
+
+  if (shouldLogError) {
+    if (message === null) {
+      ErrorUtils.dispatchException(error, null, customTags);
+    } else {
+      ErrorUtils.dispatchError(
+        message,
+        contextData,
+        customTags,
+        Constants.LogMessageType.ERROR
+      );
+    }
+  }
+
+  const store = StateStoreUtils.getAppStore();
+  if (store !== null) {
+    const diceUrl = appEnvSelectors.getDiceFeatureConfiguration(
+      store.getState()
+    ).apiEndpoint;
+    if (error instanceof ApiException && error?.url?.includes(diceUrl)) {
+      store.dispatch(
+        appEnvActions.dataSet({
+          diceEnabled: false,
+        })
+      );
+
+      AppNotificationUtils.dispatchError(
+        "Dice Service Error",
+        "The dice service is currently experiencing issues. We have disabled it temporarily as a result."
+      );
+    } else {
+      store.dispatch(appInfoActions.errorSet(appErrorType));
+    }
+  }
+
+  return null;
+}
+
+/**
+ *
+ * @param message
+ * @param type
+ * @param contextData
+ */
+export function logMessage(
+  message: string,
+  type: Constants.LogMessageType,
+  contextData: Record<string, any> = {}
+): null {
+  ErrorUtils.dispatchError(message, contextData, null, type);
+  return null;
+}
+
+/**
+ *
+ * @param error
+ */
+export function handleAdhocApiError(error: Error): void {
+  // ApiAdapterException errors are handled by the AppApiAdapter
+  if (!(error instanceof ApiAdapterException)) {
+    logError(error);
+  }
+}
diff --git a/ddb_main/tools/js/Shared/utils/AppNotification/notifications.ts b/ddb_main/tools/js/Shared/utils/AppNotification/notifications.ts
new file mode 100644
index 0000000..10dc46d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/AppNotification/notifications.ts
@@ -0,0 +1,78 @@
+import {
+  CharClass,
+  ClassUtils,
+  Extra,
+  ExtraUtils,
+  Item,
+  ItemUtils,
+  Spell,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { AppNotificationUtils } from "../../utils";
+
+export function handleItemAddAccepted(item: Item, amount: number): void {
+  if (ItemUtils.isPack(item)) {
+    AppNotificationUtils.dispatchSuccess(
+      "Equipment Pack Added",
+      `${ItemUtils.getName(item)} items added to your inventory`
+    );
+  } else {
+    if (amount >= 1) {
+      let itemName = ItemUtils.getDefinitionName(item);
+      let displayName = itemName ? `"${itemName}"` : "unknown";
+      let toastMessage = `Added ${displayName} item`;
+      if (amount > 1) {
+        toastMessage = `Added ${amount} ${displayName} items`;
+      }
+      AppNotificationUtils.dispatchSuccess("Equipment Added", toastMessage);
+    }
+  }
+}
+export function handleItemAddRejected(item: Item, amount: number): void {
+  AppNotificationUtils.dispatchError(
+    "Equipment Not Added",
+    `${ItemUtils.getName(item)} could not be added to your inventory`
+  );
+}
+
+export function handleStartingEquipmentAccepted(): void {
+  AppNotificationUtils.dispatchSuccess(
+    "Equipment Chosen",
+    "Starting Equipment Added to Inventory"
+  );
+}
+
+export function handleStartingEquipmentRejected(): void {
+  AppNotificationUtils.dispatchSuccess(
+    "Starting Equipment Skipped",
+    "No items added to inventory"
+  );
+}
+
+export function handleStartingGoldAccepted(): void {
+  AppNotificationUtils.dispatchSuccess(
+    "Gold Added",
+    "Starting Gold Added to Currencies Section"
+  );
+}
+
+export function handleSpellCreateAccepted(
+  spell: Spell,
+  charClass: CharClass
+): void {
+  AppNotificationUtils.dispatchSuccess(
+    "Spell Added",
+    `Added ${SpellUtils.getName(spell)} spell to your ${ClassUtils.getName(
+      charClass
+    )}`
+  );
+}
+
+//TODO Extras - move into manager somehow?
+export function handleExtraCreateAccepted(extra: Extra): void {
+  AppNotificationUtils.dispatchSuccess(
+    `${ExtraUtils.getExtraType(extra)} Added`,
+    `Added "${ExtraUtils.getName(extra)}"`
+  );
+}
diff --git a/ddb_main/tools/js/Shared/utils/AppNotification/utils.ts b/ddb_main/tools/js/Shared/utils/AppNotification/utils.ts
new file mode 100644
index 0000000..a52f95c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/AppNotification/utils.ts
@@ -0,0 +1,52 @@
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import { toastMessageActions } from "../../actions/toastMessage";
+import { StateStoreUtils } from "../../stores";
+
+/**
+ *
+ * @param title
+ * @param message
+ * @param notificationType
+ */
+export function dispatchNotification(
+  title: string,
+  message: string,
+  notificationType: Constants.NotificationTypeEnum
+): void {
+  const store = StateStoreUtils.getAppStore();
+  if (store) {
+    switch (notificationType) {
+      case Constants.NotificationTypeEnum.ERROR:
+      case Constants.NotificationTypeEnum.CRITICAL:
+        store.dispatch(toastMessageActions.toastError(title, message));
+        break;
+      default:
+        store.dispatch(toastMessageActions.toastSuccess(title, message));
+    }
+  }
+}
+
+/**
+ *
+ * @param title
+ * @param message
+ */
+export function dispatchSuccess(title: string, message: string): void {
+  const store = StateStoreUtils.getAppStore();
+  if (store) {
+    store.dispatch(toastMessageActions.toastSuccess(title, message));
+  }
+}
+
+/**
+ *
+ * @param title
+ * @param message
+ */
+export function dispatchError(title: string, message: string): void {
+  const store = StateStoreUtils.getAppStore();
+  if (store) {
+    store.dispatch(toastMessageActions.toastError(title, message));
+  }
+}
diff --git a/ddb_main/tools/js/Shared/utils/Clipboard/utils.ts b/ddb_main/tools/js/Shared/utils/Clipboard/utils.ts
new file mode 100644
index 0000000..b18a8eb
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/Clipboard/utils.ts
@@ -0,0 +1,44 @@
+/**
+ * sourced: https://stackoverflow.com/questions/400212/how-do-i-copy-to-the-clipboard-in-javascript
+ * @param text
+ */
+export function copyTextToClipboard(text: string): boolean {
+  let textArea = document.createElement("textarea");
+
+  // Place in top-left corner of screen regardless of scroll position.
+  textArea.style.position = "fixed";
+  textArea.style.top = "0";
+  textArea.style.left = "0";
+
+  // Ensure it has a small width and height. Setting to 1px / 1em
+  // doesn't work as this gives a negative w/h on some browsers.
+  textArea.style.width = "2em";
+  textArea.style.height = "2em";
+
+  // We don't need padding, reducing the size if it does flash render.
+  textArea.style.padding = "0";
+
+  // Clean up any borders.
+  textArea.style.border = "none";
+  textArea.style.outline = "none";
+  textArea.style.boxShadow = "none";
+
+  // Avoid flash of white box if rendered for any reason.
+  textArea.style.background = "transparent";
+
+  textArea.value = text;
+
+  document.body.appendChild(textArea);
+  textArea.focus();
+  textArea.select();
+
+  let successful: boolean;
+  try {
+    successful = document.execCommand("copy");
+  } catch (err) {
+    return false;
+  }
+
+  document.body.removeChild(textArea);
+  return successful;
+}
diff --git a/ddb_main/tools/js/Shared/utils/Color/ColorUtils.ts b/ddb_main/tools/js/Shared/utils/Color/ColorUtils.ts
new file mode 100644
index 0000000..65a246b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/Color/ColorUtils.ts
@@ -0,0 +1,73 @@
+/**
+ * Convert Hex code to RGB before getting ratio
+ * Return whether or not the colors meet the
+ * minimum requirements for Accessibility
+ */
+export const checkContrast = (color1, color2) => {
+  let [luminance1, luminance2] = [color1, color2].map((color) => {
+    /* Remove the last 2 characters if 8 digits */
+    color = color.length > 7 ? color.slice(0, 6) : color;
+    /* Remove the leading hash sign if it exists */
+    color = color.startsWith("#") ? color.slice(1) : color;
+
+    let r = parseInt(color.slice(0, 2), 16);
+    let g = parseInt(color.slice(2, 4), 16);
+    let b = parseInt(color.slice(4, 6), 16);
+
+    return luminance(r, g, b);
+  });
+
+  const ratio = contrastRatio(luminance1, luminance2);
+
+  const { didPass } = meetsMinimumRequirements(ratio);
+  return didPass;
+};
+
+export const contrastRatio = (luminance1, luminance2) => {
+  let lighterLum = Math.max(luminance1, luminance2);
+  let darkerLum = Math.min(luminance1, luminance2);
+
+  return (lighterLum + 0.05) / (darkerLum + 0.05);
+};
+
+/**
+ * Function to determine relative luminance from RGB values
+ */
+export const luminance = (r: number, g: number, b: number) => {
+  let [lumR, lumG, lumB] = [r, g, b].map((component) => {
+    let proportion = component / 255;
+
+    return proportion <= 0.03928
+      ? proportion / 12.92
+      : Math.pow((proportion + 0.055) / 1.055, 2.4);
+  });
+
+  return 0.2126 * lumR + 0.7152 * lumG + 0.0722 * lumB;
+};
+
+/**
+ * Determine whether the given contrast ratio meets WCAG
+ * requirements at any level (AA Large, AA, or AAA). In the return
+ * value, `isPass` is true if the ratio meets or exceeds the minimum
+ * of at least one level, and `maxLevel` is the strictest level that
+ * the ratio passes.
+ */
+const WCAG_MINIMUM_RATIOS = [
+  ["AA Large", 3],
+  ["AA", 4.5],
+  ["AAA", 7],
+];
+
+export const meetsMinimumRequirements = (ratio) => {
+  let didPass = false;
+  let maxLevel: string | number = "";
+
+  for (const [level, minRatio] of WCAG_MINIMUM_RATIOS) {
+    if (ratio < minRatio) break;
+
+    didPass = true;
+    maxLevel = level;
+  }
+
+  return { didPass, maxLevel };
+};
diff --git a/ddb_main/tools/js/Shared/utils/Component/derivers.ts b/ddb_main/tools/js/Shared/utils/Component/derivers.ts
new file mode 100644
index 0000000..d7ab669
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/Component/derivers.ts
@@ -0,0 +1,614 @@
+import {
+  Action,
+  ActionUtils,
+  ConditionUtils,
+  Constants,
+  DiceUtils,
+  FormatUtils,
+  HelperUtils,
+  RuleData,
+  RuleDataUtils,
+  SourceData,
+  Vehicle,
+  VehicleComponent,
+  VehicleComponentArmorClassInfo,
+  VehicleComponentSpeedInfo,
+  VehicleComponentUtils,
+  VehicleFeatureData,
+  VehicleManager,
+  VehicleUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { TypeScriptUtils } from "../index";
+import {
+  generateVehicleActionStationProps,
+  generateVehicleBlockComponentProps,
+  generateVehiclePrimaryComponentProps,
+} from "./generators";
+import {
+  GD_VehicleBlockActionStationProps,
+  GD_VehicleBlockComponentProps,
+  GD_VehicleBlockPrimaryComponentProps,
+  VehicleActionSummaryProps,
+  VehicleBlockActionProp,
+  VehicleComponentActionInfoProp,
+  VehicleComponentCargoCapacityProp,
+  VehicleComponentHitPointInfoProps,
+  VehicleComponentTravelPaceInfoProp,
+} from "./typings";
+
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveVehicleTypeNameProp(
+  vehicle: Vehicle,
+  ruleData: RuleData
+): string | null {
+  const type = VehicleUtils.getType(vehicle);
+  if (type === null) {
+    return null;
+  }
+
+  return RuleDataUtils.getObjectTypeName(type, ruleData);
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function deriveVehicleSizeNameProp(vehicle: Vehicle): string | null {
+  const sizeInfo = VehicleUtils.getSizeInfo(vehicle);
+
+  if (sizeInfo === null) {
+    return null;
+  }
+
+  return sizeInfo.name;
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function deriveVehicleComponentCargoCapacityProp(
+  vehicle: Vehicle
+): VehicleComponentCargoCapacityProp {
+  return {
+    weight: VehicleUtils.getCargoCapacity(vehicle),
+    description: VehicleUtils.getCargoCapacityDescription(vehicle),
+  };
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function deriveVehicleDamageImmunitiesProps(
+  vehicle: Vehicle
+): Array<string> {
+  return VehicleUtils.getDamageImmunityInfos(vehicle)
+    .map((immunityInfo) => immunityInfo.name)
+    .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function deriveVehicleConditionImmunitiesProps(
+  vehicle: Vehicle
+): Array<string> {
+  return VehicleUtils.getConditionImmunityInfos(vehicle).map((conditionInfo) =>
+    ConditionUtils.getName(conditionInfo)
+  );
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function deriveVehicleComponentTravelPaceInfoProp(
+  vehicle: Vehicle
+): VehicleComponentTravelPaceInfoProp | null {
+  const enableTravelPace = VehicleUtils.getConfigurationValue(
+    Constants.VehicleConfigurationKeyEnum.ENABLE_TRAVEL_PACE,
+    vehicle
+  );
+
+  if (!enableTravelPace) {
+    return null;
+  }
+
+  const pace = VehicleUtils.getTravelPace(vehicle);
+  const effectiveHours = VehicleUtils.getTravelPaceEffectiveHours(vehicle);
+
+  let travelPaceInfo: VehicleComponentTravelPaceInfoProp | null = null;
+  if (pace !== null) {
+    travelPaceInfo = {
+      pace,
+      effectiveHours,
+    };
+  }
+
+  return travelPaceInfo;
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function deriveVehicleComponentPrimaryPropertiesProps(
+  vehicle: VehicleManager
+): GD_VehicleBlockPrimaryComponentProps | null {
+  const primaryComponentManageType = vehicle.getPrimaryComponentManageType();
+
+  if (
+    primaryComponentManageType ===
+    Constants.VehicleConfigurationPrimaryComponentManageTypeEnum.VEHICLE
+  ) {
+    return generateVehiclePrimaryComponentProps(vehicle);
+  }
+
+  return null;
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function deriveVehicleBlockPrimaryHitPointInfoProps(
+  vehicle: Vehicle
+): VehicleComponentHitPointInfoProps | null {
+  const primaryManageType = VehicleUtils.getConfigurationValue(
+    Constants.VehicleConfigurationKeyEnum.PRIMARY_COMPONENT_MANAGE_TYPE,
+    vehicle
+  );
+  if (
+    primaryManageType ===
+    Constants.VehicleConfigurationPrimaryComponentManageTypeEnum.COMPONENT
+  ) {
+    return null;
+  }
+
+  return deriveVehicleComponentHitPointInfoProps(
+    VehicleUtils.getPrimaryComponent(vehicle),
+    vehicle
+  );
+}
+
+/**
+ *
+ * @param component
+ * @param vehicle
+ */
+export function deriveVehicleBlockComponentHitPointInfoProps(
+  component: VehicleComponent,
+  vehicle: Vehicle
+): VehicleComponentHitPointInfoProps | null {
+  const isPrimaryComponent = VehicleComponentUtils.getIsPrimary(component);
+  const primaryManageType = VehicleUtils.getConfigurationValue(
+    Constants.VehicleConfigurationKeyEnum.PRIMARY_COMPONENT_MANAGE_TYPE,
+    vehicle
+  );
+  if (
+    isPrimaryComponent &&
+    primaryManageType ===
+      Constants.VehicleConfigurationPrimaryComponentManageTypeEnum.VEHICLE
+  ) {
+    return null;
+  }
+
+  const enableComponentHitPoints = VehicleUtils.getConfigurationValue(
+    Constants.VehicleConfigurationKeyEnum.ENABLE_COMPONENT_HIT_POINTS,
+    vehicle
+  );
+  if (!enableComponentHitPoints) {
+    return null;
+  }
+
+  return deriveVehicleComponentHitPointInfoProps(component, vehicle);
+}
+
+/**
+ *
+ * @param component
+ * @param vehicle
+ */
+export function deriveVehicleComponentHitPointInfoProps(
+  component: VehicleComponent,
+  vehicle: Vehicle
+): VehicleComponentHitPointInfoProps {
+  let damageThreshold: number | null = null;
+  if (
+    VehicleUtils.getConfigurationValue(
+      Constants.VehicleConfigurationKeyEnum.ENABLE_COMPONENT_DAMAGE_THRESHOLD,
+      vehicle
+    )
+  ) {
+    damageThreshold = VehicleComponentUtils.getDamageThreshold(component);
+  }
+  let mishapThreshold: number | null = null;
+  if (
+    VehicleUtils.getConfigurationValue(
+      Constants.VehicleConfigurationKeyEnum.ENABLE_COMPONENT_MISHAP_THRESHOLD,
+      vehicle
+    )
+  ) {
+    mishapThreshold = VehicleComponentUtils.getMishapThreshold(component);
+  }
+
+  let componentHitPointInfo = VehicleComponentUtils.getHitPointInfo(component);
+
+  const definitionHitPoints = VehicleComponentUtils.getHitPoints(component);
+
+  return {
+    remainingHp:
+      componentHitPointInfo !== null
+        ? componentHitPointInfo.remainingHp
+        : definitionHitPoints,
+    tempHp:
+      componentHitPointInfo !== null ? componentHitPointInfo.tempHp : null,
+    totalHp:
+      componentHitPointInfo !== null
+        ? componentHitPointInfo.totalHp
+        : definitionHitPoints,
+    removedHp:
+      componentHitPointInfo !== null ? componentHitPointInfo.removedHp : 0,
+    hitPointSpeedAdjustments:
+      VehicleComponentUtils.getHitPointSpeedAdjustments(component),
+    damageThreshold,
+    mishapThreshold,
+  };
+}
+
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveVehicleBlockActionsSummariesProps(
+  vehicle: Vehicle,
+  ruleData: RuleData
+): Array<VehicleActionSummaryProps> {
+  return VehicleUtils.getActionSummaries(vehicle).map((action) => {
+    let sourceInfo: SourceData | null = null;
+    if (action.sourceId !== null) {
+      sourceInfo = RuleDataUtils.getSourceDataInfo(action.sourceId, ruleData);
+    }
+
+    return {
+      ...action,
+      sourceName: sourceInfo ? sourceInfo.name : null,
+      sourceFullName: sourceInfo ? sourceInfo.description : null,
+    };
+  });
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function deriveFeaturesProps(
+  vehicle: Vehicle
+): Array<VehicleFeatureData> {
+  const enableFeatures = VehicleUtils.getConfigurationValue(
+    Constants.VehicleConfigurationKeyEnum.ENABLE_FEATURES,
+    vehicle
+  );
+  return enableFeatures ? VehicleUtils.getFeatures(vehicle) : [];
+}
+
+/**
+ *
+ * @param activationType
+ * @param actions
+ */
+export function deriveVehicleBlockActionsActions(
+  activationType: Constants.ActivationTypeEnum,
+  actions: Array<Action>
+): Array<VehicleBlockActionProp> {
+  return actions
+    .filter((action) =>
+      ActionUtils.validateIsActivationType(action, activationType)
+    )
+    .map(deriveVehicleActionProps);
+}
+
+/**
+ *
+ * @param action
+ */
+function deriveVehicleActionProps(action: Action): VehicleBlockActionProp {
+  return {
+    name: ActionUtils.getName(action),
+    description: ActionUtils.getDescription(action),
+    key: deriveVehicleActionUniqueKey(action),
+    ammo: ActionUtils.getAmmunition(action),
+  };
+}
+
+function deriveVehicleActionUniqueKey(action: Action): string {
+  //TODO use ActionUtils.getUniqueKey once vehicle action have real id and entityTypeIds, need this for react keys
+  return `${ActionUtils.getName(action)}-${ActionUtils.getUniqueKey(action)}`;
+}
+
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveVehicleActionStationsProps(
+  vehicle: Vehicle,
+  ruleData: RuleData
+): Array<GD_VehicleBlockActionStationProps> {
+  return VehicleUtils.getActionStations(vehicle).map((station) =>
+    generateVehicleActionStationProps(station, vehicle, ruleData)
+  );
+}
+
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveVehicleComponentsProps(
+  vehicle: Vehicle,
+  ruleData: RuleData
+): Array<GD_VehicleBlockComponentProps> {
+  return VehicleUtils.getComponents(vehicle).map((component) =>
+    generateVehicleBlockComponentProps(component, vehicle, ruleData)
+  );
+}
+
+/**
+ *
+ * @param component
+ */
+export function deriveVehicleComponentActionsProps(
+  component: VehicleComponent
+): Array<VehicleBlockActionProp> {
+  return VehicleComponentUtils.getActions(component).map((action) =>
+    deriveVehicleActionProps(action)
+  );
+}
+
+/**
+ *
+ * @param component
+ * @param vehicle
+ * @param ruleData
+ */
+export function deriveVehicleComponentCoverTypeProp(
+  component: VehicleComponent,
+  vehicle: Vehicle,
+  ruleData: RuleData
+): string | null {
+  const enableComponentCover = VehicleUtils.getConfigurationValue(
+    Constants.VehicleConfigurationKeyEnum.ENABLE_COMPONENT_COVER,
+    vehicle
+  );
+
+  if (!enableComponentCover) {
+    return null;
+  }
+
+  const coverType = VehicleComponentUtils.getCoverType(component);
+  if (coverType === null) {
+    return null;
+  }
+
+  const coverTypeLookup = RuleDataUtils.getCoverTypeLookup(ruleData);
+  const cover = HelperUtils.lookupDataOrFallback(coverTypeLookup, coverType);
+
+  return cover ? cover.name : null;
+}
+
+/**
+ *
+ * @param component
+ * @param vehicle
+ */
+export function deriveVehicleComponentRequiredCrew(
+  component: VehicleComponent,
+  vehicle: Vehicle
+): number | null {
+  const enableRequiredCrew = VehicleUtils.getConfigurationValue(
+    Constants.VehicleConfigurationKeyEnum.ENABLE_COMPONENT_CREW_REQUIREMENTS,
+    vehicle
+  );
+  return enableRequiredCrew
+    ? VehicleComponentUtils.getRequiredCrew(component)
+    : null;
+}
+
+/**
+ * TODO move this one?
+ * @param component
+ * @param vehicle
+ */
+function allowComponentProperty(
+  component: VehicleComponent,
+  vehicle: Vehicle
+): boolean {
+  const primaryManageType = VehicleUtils.getConfigurationValue(
+    Constants.VehicleConfigurationKeyEnum.PRIMARY_COMPONENT_MANAGE_TYPE,
+    vehicle
+  );
+  const isPrimaryComponent = VehicleComponentUtils.getIsPrimary(component);
+
+  return !(
+    primaryManageType ===
+      Constants.VehicleConfigurationPrimaryComponentManageTypeEnum.VEHICLE &&
+    isPrimaryComponent
+  );
+}
+
+/**
+ *
+ * @param component
+ * @param vehicle
+ */
+export function deriveVehicleComponentArmorClassInfo(
+  component: VehicleComponent,
+  vehicle: Vehicle
+): VehicleComponentArmorClassInfo | null {
+  const enableArmorClass = VehicleUtils.getConfigurationValue(
+    Constants.VehicleConfigurationKeyEnum.ENABLE_COMPONENT_ARMOR_CLASS,
+    vehicle
+  );
+
+  if (enableArmorClass && allowComponentProperty(component, vehicle)) {
+    return VehicleComponentUtils.getArmorClassInfo(component);
+  }
+
+  return null;
+}
+
+/**
+ *
+ * @param component
+ * @param vehicle
+ */
+export function deriveVehicleComponentSpeedInfos(
+  component: VehicleComponent,
+  vehicle: Vehicle
+): Array<VehicleComponentSpeedInfo> {
+  const enableSpeeds = VehicleUtils.getConfigurationValue(
+    Constants.VehicleConfigurationKeyEnum.ENABLE_COMPONENT_SPEEDS,
+    vehicle
+  );
+
+  if (enableSpeeds && allowComponentProperty(component, vehicle)) {
+    return VehicleComponentUtils.getSpeedInfos(component);
+  }
+
+  return [];
+}
+
+/**
+ * Set up this function to derive more possibilities of component management
+ * @param component
+ * @param vehicle
+ */
+export function deriveEnableComponentManagement(
+  component: VehicleComponent,
+  vehicle: Vehicle
+): boolean {
+  if (
+    deriveVehicleBlockComponentHitPointInfoProps(component, vehicle) !== null
+  ) {
+    return true;
+  }
+
+  return false;
+}
+
+/**
+ * preserving how to derive ActionInfoProps for when we can get rid of dangerouslySetHtml in Vehicle Action.descriptions
+ * @param action
+ */
+export function deriveVehicleComponentActionInfo(
+  action: Action
+): VehicleComponentActionInfoProp {
+  const actionTypeId = ActionUtils.getActionTypeId(action);
+  const toHit = ActionUtils.getToHit(action);
+  const rangeInfo = ActionUtils.getRange(action);
+  const numOfTargets = ActionUtils.getNumberOfTargets(action);
+  const attackRangeTypeId = ActionUtils.getAttackRangeId(action);
+
+  let actionTypeDisplayText: Array<string> = [];
+  if (attackRangeTypeId === Constants.AttackTypeRangeEnum.RANGED) {
+    actionTypeDisplayText.push("Ranged");
+  } else if (attackRangeTypeId === Constants.AttackTypeRangeEnum.MELEE) {
+    actionTypeDisplayText.push("Melee");
+  }
+
+  if (actionTypeId === Constants.ActionTypeEnum.WEAPON) {
+    actionTypeDisplayText.push("Weapon");
+  } else if (actionTypeId === Constants.ActionTypeEnum.SPELL) {
+    actionTypeDisplayText.push("Spell");
+  }
+
+  if (actionTypeId !== null) {
+    actionTypeDisplayText.push("Attack");
+  } else {
+    actionTypeDisplayText.push("Action");
+  }
+
+  let actionDescriptionDisplay: Array<string> = [];
+  if (toHit !== null) {
+    actionDescriptionDisplay.push(
+      `${FormatUtils.renderSignedNumber(toHit)} to hit`
+    );
+  }
+
+  if (rangeInfo) {
+    const { minimumRange, range, longRange } = rangeInfo;
+
+    let rangeText: Array<string> = [];
+
+    let rangeString = `range ${range}`;
+    if (longRange !== null) {
+      rangeString = `range ${range}/${FormatUtils.renderDistance(longRange)}`;
+    }
+    rangeText.push(rangeString);
+
+    if (minimumRange !== null) {
+      rangeText.push(
+        `(can't hit targets within ${FormatUtils.renderDistance(
+          minimumRange
+        )} of it)`
+      );
+    }
+    actionDescriptionDisplay.push(rangeText.join(" "));
+  }
+
+  if (numOfTargets) {
+    let numOfTargetText: string =
+      numOfTargets === 1 ? "one target" : `${numOfTargets} targets`;
+    actionDescriptionDisplay.push(numOfTargetText);
+  }
+
+  return {
+    label: `${actionTypeDisplayText.join(" ")}`,
+    snippet: actionDescriptionDisplay.length
+      ? `${actionDescriptionDisplay.join(", ")}`
+      : null,
+  };
+}
+
+/**
+ * preserving how to derive DamageInfoProps for when we can get rid of dangerouslySetHtml in Vehicle Action.descriptions
+ * @param action
+ */
+export function deriveVehicleComponentActionDamageInfo(
+  action: Action
+): VehicleComponentActionInfoProp {
+  const diceInfo = ActionUtils.getDice(action);
+  let avgDiceValue: number | null = null;
+  if (diceInfo !== null) {
+    avgDiceValue = DiceUtils.getAverageDiceValue(diceInfo);
+  }
+
+  const damageType = ActionUtils.getDamage(action).type;
+
+  let snippet: Array<string | number> = [];
+  if (avgDiceValue !== null) {
+    snippet.push(avgDiceValue);
+  }
+
+  if (diceInfo !== null) {
+    snippet.push(`(${DiceUtils.renderDie(diceInfo)})`);
+  }
+
+  if (damageType !== null && damageType.name !== null) {
+    snippet.push(`${damageType.name.toLowerCase()} damage`);
+  }
+
+  return {
+    label: "Hit",
+    snippet: snippet.length ? `${snippet.join(" ")}` : null,
+  };
+}
diff --git a/ddb_main/tools/js/Shared/utils/Component/generators.ts b/ddb_main/tools/js/Shared/utils/Component/generators.ts
new file mode 100644
index 0000000..293c99d
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/Component/generators.ts
@@ -0,0 +1,284 @@
+import {
+  Constants,
+  RuleData,
+  Vehicle,
+  VehicleComponent,
+  VehicleComponentUtils,
+  VehicleManager,
+  VehicleUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import {
+  deriveEnableComponentManagement,
+  deriveVehicleBlockActionsActions,
+  deriveVehicleBlockComponentHitPointInfoProps,
+  deriveVehicleComponentActionsProps,
+  deriveVehicleComponentArmorClassInfo,
+  deriveVehicleComponentCoverTypeProp,
+  deriveVehicleComponentPrimaryPropertiesProps,
+  deriveVehicleComponentRequiredCrew,
+  deriveVehicleComponentSpeedInfos,
+} from "./derivers";
+import {
+  GD_VehicleBlockActionsProps,
+  GD_VehicleBlockActionStationListProps,
+  GD_VehicleBlockActionStationProps,
+  GD_VehicleBlockActionSummariesProps,
+  GD_VehicleBlockComponentListProps,
+  GD_VehicleBlockComponentProps,
+  GD_VehicleBlockFeaturesProps,
+  GD_VehicleBlockHeaderProps,
+  GD_VehicleBlockPrimaryComponentProps,
+  GD_VehicleBlockPrimaryProps,
+  GD_VehicleBlockProps,
+  GD_VehicleBlockShellProps,
+} from "./typings";
+
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function generateVehicleBlockProps(
+  vehicle: VehicleManager
+): GD_VehicleBlockProps {
+  return {
+    shellProps: generateVehicleShellProps(vehicle),
+    headerProps: generateVehicleBlockHeaderProps(vehicle),
+    primaryProps: generateVehicleBlockPrimaryProps(vehicle),
+    actionSummariesProps: vehicle.generateVehicleActionsSummaries(),
+    featuresProps: generateVehicleFeaturesProps(vehicle),
+    actionStationsProps: generateVehicleBlockActionStationListProps(vehicle),
+    componentsProps: generateVehicleBlockComponentListProps(vehicle),
+    actionsProps: vehicle.generateVehicleBlockActionsInfo(),
+  };
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function generateVehicleShellProps(
+  vehicle: VehicleManager
+): GD_VehicleBlockShellProps {
+  return {
+    displayType: vehicle.getDisplayType(),
+  };
+}
+
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function generateVehicleBlockHeaderProps(
+  vehicle: VehicleManager
+): GD_VehicleBlockHeaderProps {
+  return {
+    name: vehicle.getName(),
+    typeName: vehicle.getVehicleTypeName(),
+    displayType: vehicle.getDisplayType(),
+    weight: vehicle.getWeight(),
+    length: vehicle.getLength(),
+    width: vehicle.getWidth(),
+    sizeName: vehicle.getVehicleSizeName(),
+  };
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function generateVehicleBlockPrimaryProps(
+  vehicle: VehicleManager
+): GD_VehicleBlockPrimaryProps {
+  return {
+    cargoCapacityInfo: vehicle.getVehicleCargoCapacityInfo(),
+    conditionImmunities: vehicle.generateVehicleConditionImmunityNames(),
+    creatureCapacityDescriptions: vehicle.getCreatureCapacityDescriptions(),
+    damageImmunities: vehicle.generateVehicleDamageImmunityNames(),
+    displayType: vehicle.getDisplayType(),
+    primaryProperties: deriveVehicleComponentPrimaryPropertiesProps(vehicle),
+    stats: vehicle.getStats(),
+    travelPaceInfo: vehicle.generateVehicleComponentTravelPaceInfo(),
+  };
+}
+
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function generateVehicleBlockActionSummariesProps(
+  vehicle: VehicleManager,
+  ruleData: RuleData
+): GD_VehicleBlockActionSummariesProps {
+  return {
+    actionsText: vehicle.getActionsText(),
+    actionsSummaries: vehicle.generateVehicleBlockActionsSummaries(),
+  };
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function generateVehicleFeaturesProps(
+  vehicle: VehicleManager
+): GD_VehicleBlockFeaturesProps {
+  return {
+    features: vehicle.generateFeatures(),
+  };
+}
+
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function generateVehicleBlockActionStationListProps(
+  vehicle: VehicleManager
+): GD_VehicleBlockActionStationListProps {
+  const enableActionStations = vehicle.getEnableActionStations();
+
+  return {
+    actionStations: enableActionStations
+      ? vehicle.generateVehicleActionStationsInfo()
+      : [],
+  };
+}
+
+/**
+ *
+ * @param station
+ * @param vehicle
+ * @param ruleData
+ */
+export function generateVehicleActionStationProps(
+  station: VehicleComponent,
+  vehicle: Vehicle,
+  ruleData: RuleData
+): GD_VehicleBlockActionStationProps {
+  //share componentProps for now.
+  return generateVehicleBlockComponentProps(station, vehicle, ruleData);
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function generateVehiclePrimaryComponentProps(
+  vehicle: VehicleManager
+): GD_VehicleBlockPrimaryComponentProps | null {
+  const primaryComponent = vehicle.getPrimaryComponent();
+
+  if (primaryComponent === null) {
+    return null;
+  }
+
+  return {
+    armorClassInfo: primaryComponent.getArmorClassInfo(),
+    hitPointInfo: vehicle.generateVehicleBlockPrimaryHitPointInfo(),
+    speedInfos: primaryComponent.getSpeedInfos(),
+    costInfos: primaryComponent.getCosts(),
+    displayType: vehicle.getDisplayType(),
+    width: vehicle.getWidth(),
+    length: vehicle.getLength(),
+    isPrimaryComponent: primaryComponent.getIsPrimary(),
+  };
+}
+
+/**
+ *
+ * @param vehicle
+ */
+export function generateVehicleBlockActionsProps(
+  vehicle: VehicleManager
+): GD_VehicleBlockActionsProps {
+  const allActions = vehicle.getAllActions();
+
+  return {
+    reactions: deriveVehicleBlockActionsActions(
+      Constants.ActivationTypeEnum.REACTION,
+      allActions
+    ),
+    bonusActions: deriveVehicleBlockActionsActions(
+      Constants.ActivationTypeEnum.BONUS_ACTION,
+      allActions
+    ),
+    special: deriveVehicleBlockActionsActions(
+      Constants.ActivationTypeEnum.SPECIAL,
+      allActions
+    ),
+  };
+}
+
+/**
+ *
+ * @param vehicle
+ * @param ruleData
+ */
+export function generateVehicleBlockComponentListProps(
+  vehicle: VehicleManager
+): GD_VehicleBlockComponentListProps {
+  const enableComponents = vehicle.getEnableComponents();
+
+  return {
+    components: enableComponents
+      ? vehicle.generateVehicleComponentsBlockInfo()
+      : [],
+  };
+}
+
+/**
+ *
+ * @param component
+ * @param vehicle
+ * @param ruleData
+ */
+export function generateVehicleBlockComponentProps(
+  component: VehicleComponent,
+  vehicle: Vehicle,
+  ruleData: RuleData
+): GD_VehicleBlockComponentProps {
+  const uniqueKey = VehicleComponentUtils.getUniqueKey(component);
+
+  return {
+    actions: deriveVehicleComponentActionsProps(component),
+    count: 1,
+    description: VehicleComponentUtils.getDescription(component),
+    displayOrder: VehicleComponentUtils.getDisplayOrder(component),
+    isPrimaryComponent: VehicleComponentUtils.getIsPrimary(component),
+    isRemovable: VehicleComponentUtils.getIsRemovable(component),
+    name: VehicleComponentUtils.getName(component),
+    typeNames: VehicleComponentUtils.getTypeNames(component),
+    coverType: deriveVehicleComponentCoverTypeProp(
+      component,
+      vehicle,
+      ruleData
+    ),
+    requiredCrew: deriveVehicleComponentRequiredCrew(component, vehicle),
+    key: uniqueKey,
+    uniqueKey,
+    uniquenessFactor: VehicleComponentUtils.getUniquenessFactor(component),
+    id: VehicleComponentUtils.getMappingId(component),
+    vehicleId: VehicleUtils.getMappingId(vehicle),
+    displayType: VehicleUtils.getConfigurationValue(
+      Constants.VehicleConfigurationKeyEnum.DISPLAY_TYPE,
+      vehicle
+    ),
+    armorClassInfo: deriveVehicleComponentArmorClassInfo(component, vehicle),
+    speedInfos: deriveVehicleComponentSpeedInfos(component, vehicle),
+    hitPointInfo: deriveVehicleBlockComponentHitPointInfoProps(
+      component,
+      vehicle
+    ),
+    enableComponentManagement: deriveEnableComponentManagement(
+      component,
+      vehicle
+    ),
+    costInfos: VehicleComponentUtils.getCosts(component),
+    width: VehicleUtils.getWidth(vehicle),
+    length: VehicleUtils.getLength(vehicle),
+  };
+}
diff --git a/ddb_main/tools/js/Shared/utils/Error/constants.ts b/ddb_main/tools/js/Shared/utils/Error/constants.ts
new file mode 100644
index 0000000..1eff5b3
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/Error/constants.ts
@@ -0,0 +1 @@
+export let NO_ERROR_CODE = "NO_ERROR_CODE";
diff --git a/ddb_main/tools/js/Shared/utils/Error/utils.ts b/ddb_main/tools/js/Shared/utils/Error/utils.ts
new file mode 100644
index 0000000..7d3d8fe
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/Error/utils.ts
@@ -0,0 +1,64 @@
+import { LogMessageType } from "@dndbeyond/character-rules-engine/es/logger/constants";
+
+import { ErrorClientConfig, ErrorCustomTags } from "./typings";
+
+// Historical note: This logging util used to be more fully featured,
+// when we integrated with Sentry.io. Now it just logs to the
+// console if debug is enabled.
+
+let clientConfig: ErrorClientConfig | null = null;
+
+/**
+ * Logs an exception when debug is enabled in the client config
+ * @param error The error object
+ * @param contextData Any context data related to the exception
+ * @param customTags
+ */
+export function dispatchException(
+  error: Error,
+  contextData: Record<string, any> | null = null,
+  customTags: ErrorCustomTags | null = null
+): void {
+  if (clientConfig?.debug) {
+    // eslint-disable-next-line no-console
+    console.error("EXCEPTION", error, contextData, customTags);
+  }
+}
+
+/**
+ * Logs a message when debug is enabled in the client config
+ * @param message The message to send
+ * @param contextData Any context data related to the message
+ * @param customTags
+ * @param severity
+ */
+export function dispatchError(
+  message: string,
+  contextData: Record<string, any> | null,
+  customTags: ErrorCustomTags | null,
+  severity: LogMessageType
+): void {
+  if (clientConfig?.debug) {
+    // eslint-disable-next-line no-console
+    console.error(severity, message, contextData, customTags);
+  }
+}
+
+/**
+ * Initializes client error config
+ * @param config config object
+ */
+export function initReporting(config: ErrorClientConfig): void {
+  clientConfig = config;
+}
+
+/**
+ * Reports a React error to logger
+ * @param error The error to report
+ * @param componentInfo Information about the component in which the error occurred
+ */
+export function reportReactError(error: Error, componentInfo: any): void {
+  dispatchException(error, {
+    componentInfo,
+  });
+}
diff --git a/ddb_main/tools/js/Shared/utils/Filter/utils.ts b/ddb_main/tools/js/Shared/utils/Filter/utils.ts
new file mode 100644
index 0000000..31aeb3c
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/Filter/utils.ts
@@ -0,0 +1,105 @@
+/**
+ *
+ * @param input
+ * @param startIdx
+ * @param pieceIdx
+ * @param pieceCharIdx
+ * @param pieces
+ */
+export function checkQueryPiece(
+  input: string,
+  startIdx: number,
+  pieceIdx: number,
+  pieceCharIdx: number,
+  pieces: Array<string>
+): boolean {
+  let i: number;
+  let ch: string;
+  let length: number = input.length;
+  for (i = startIdx; i < length; i++) {
+    ch = input.charAt(i);
+    switch (ch) {
+      case " ":
+      case "-":
+      case ".":
+      case '"':
+        continue; //ignore spaces, dashes, periods, and double quotes
+      default:
+        if (pieceIdx < pieces.length) {
+          let piece = pieces[pieceIdx];
+          if (
+            pieceCharIdx < piece.length &&
+            ch === piece.charAt(pieceCharIdx)
+          ) {
+            //if current character matches, check next character in piece
+            if (
+              checkQueryPiece(input, i + 1, pieceIdx, pieceCharIdx + 1, pieces)
+            ) {
+              return true;
+            }
+            //if path for next character doesn't match, try path from start of next piece
+            if (checkQueryPiece(input, i + 1, pieceIdx + 1, 0, pieces)) {
+              return true;
+            }
+          }
+          if (pieceCharIdx === 0) {
+            //if first character of piece doesn't match, allow skipping that piece
+            if (checkQueryPiece(input, i, pieceIdx + 1, 0, pieces)) {
+              return true;
+            }
+          }
+        }
+        return false; //no match if no path above reaches end of input string
+    }
+  }
+  return true; //match if reached end of input string
+}
+
+/**
+ *
+ * @param query
+ * @param primaryText
+ * @param tags
+ */
+export function doesQueryMatchData(
+  query: string,
+  primaryText: string | null,
+  tags: Array<string> = []
+): boolean {
+  let input: string = query.toLowerCase().trim();
+
+  if (!input) {
+    // if there is no query don't filter anything
+    return true;
+  }
+
+  let processedPrimaryText: string = primaryText
+    ? primaryText.replace(/["+]/g, "").toLowerCase().trim()
+    : "";
+  let processedTags: Array<string> =
+    tags && tags.length
+      ? tags.map((tag) => (tag ? tag.toLowerCase().trim() : tag))
+      : [];
+  let pieces: Array<string> = processedPrimaryText.split(/[ -]/);
+  if (checkQueryPiece(input, 0, 0, 0, pieces)) {
+    //don't filter out item if heading matches
+    return true;
+  }
+
+  // if heading isn't a match, see if input is an exact match for associated tags
+  if (!processedTags.length) {
+    // filter out item if no tags specified
+    return false;
+  }
+
+  let tagMatch: boolean = false;
+  processedTags.forEach((tag) => {
+    if (tagMatch || !tag) {
+      return;
+    }
+    let pieces: Array<string> = tag.split(/[ -]/);
+    tagMatch = checkQueryPiece(input, 0, 0, 0, pieces);
+  });
+
+  return tagMatch;
+}
diff --git a/ddb_main/tools/js/Shared/utils/MobileMessenger/messageCreators.ts b/ddb_main/tools/js/Shared/utils/MobileMessenger/messageCreators.ts
new file mode 100644
index 0000000..0f8b21b
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/MobileMessenger/messageCreators.ts
@@ -0,0 +1,13 @@
+import * as messageTypes from "./messageTypes";
+import { ShowCharacterSheetMessage } from "./typings";
+
+export function createShowCharacterSheetMessage(
+  characterId: number
+): ShowCharacterSheetMessage {
+  return {
+    type: messageTypes.SHOW_CHARACTER_SHEET,
+    payload: {
+      characterId,
+    },
+  };
+}
diff --git a/ddb_main/tools/js/Shared/utils/MobileMessenger/messageTypes.ts b/ddb_main/tools/js/Shared/utils/MobileMessenger/messageTypes.ts
new file mode 100644
index 0000000..ec7eb28
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/MobileMessenger/messageTypes.ts
@@ -0,0 +1 @@
+export const SHOW_CHARACTER_SHEET = "show-character-sheet";
diff --git a/ddb_main/tools/js/Shared/utils/MobileMessenger/utils.ts b/ddb_main/tools/js/Shared/utils/MobileMessenger/utils.ts
new file mode 100644
index 0000000..1ad0ef0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/MobileMessenger/utils.ts
@@ -0,0 +1,19 @@
+import { MobileMessage } from "./typings";
+
+/**
+ *
+ * @param message
+ */
+export function sendMessage(message: MobileMessage): void {
+  if ((window as any)?.webkit?.messageHandlers?.mobileApp?.postMessage) {
+    // This should not be stringify'd because iOS is fine with objects
+    // https://github.com/DnDBeyond/ddb-character-tools-client/pull/306
+    (window as any).webkit.messageHandlers.mobileApp.postMessage(message);
+    return;
+  }
+
+  if ((window as any)?.mobileApp?.postMessage) {
+    (window as any).mobileApp.postMessage(JSON.stringify(message));
+    return;
+  }
+}
diff --git a/ddb_main/tools/js/Shared/utils/PaneIdentifier/generators.ts b/ddb_main/tools/js/Shared/utils/PaneIdentifier/generators.ts
new file mode 100644
index 0000000..4f330d0
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/PaneIdentifier/generators.ts
@@ -0,0 +1,384 @@
+import {
+  AbilityManager,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+import {
+  PaneIdentifiersAction,
+  PaneIdentifiersClassSpell,
+  PaneIdentifiersNote,
+  PaneIdentifiersClassFeature,
+  PaneIdentifiersRacialTrait,
+  PaneIdentifiersItem,
+  PaneIdentifiersBasicAction,
+  PaneIdentifiersCharacterSpell,
+  PaneIdentifiersFeat,
+  PaneIdentifiersCustomAction,
+  PaneIdentifiersCustomItem,
+  PaneIdentifiersCustomSkill,
+  PaneIdentifiersAbility,
+  PaneIdentifiersSkill,
+  PaneIdentifiersAbilitySavingThrow,
+  PaneIdentifiersPreferenceHitPointConfirm,
+  PaneIdentifiersPreferenceProgressionConfirm,
+  PaneIdentifiersCreature,
+  PaneIdentifiersVehicle,
+  PaneIdentifiersVehicleComponent,
+  PaneIdentifiersVehicleActionStation,
+  PaneIdentifiersInfusionChoice,
+  PaneIdentifiersPreferenceOptionalClassFeaturesConfirm,
+  PaneIdentifiersPreferenceOptionalOriginsConfirm,
+  PaneIdentifiersContainer,
+  PaneIdentifiersCurrencyContext,
+  PaneIdentifiersBlessing,
+  PaneIdentifiersTrait,
+} from "~/subApps/sheet/components/Sidebar/types";
+
+//TODO move this to subapps Sidebar
+
+/**
+ *
+ * @param mappingId
+ * @param mappingEntityTypeId
+ */
+export function generateAction(
+  mappingId: string,
+  mappingEntityTypeId: string | null
+): PaneIdentifiersAction {
+  return {
+    id: mappingId,
+    entityTypeId: mappingEntityTypeId,
+  };
+}
+
+/**
+ *
+ * @param id
+ */
+export function generateBasicAction(id: number): PaneIdentifiersBasicAction {
+  return {
+    id,
+  };
+}
+
+/**
+ *
+ * @param mappingId
+ */
+export function generateItem(mappingId: number): PaneIdentifiersItem {
+  return {
+    id: mappingId,
+  };
+}
+
+/**
+ *
+ * @param mappingId
+ */
+export function generateCharacterSpell(
+  mappingId: number,
+  castLevel?: number
+): PaneIdentifiersCharacterSpell {
+  return {
+    id: mappingId,
+    castLevel,
+  };
+}
+
+/**
+ *
+ * @param classMappingId
+ * @param spellMappingId
+ */
+export function generateClassSpell(
+  classMappingId: number,
+  spellMappingId: number,
+  castLevel?: number
+): PaneIdentifiersClassSpell {
+  return {
+    classId: classMappingId,
+    spellId: spellMappingId,
+    castLevel,
+  };
+}
+
+/**
+ *
+ * @param noteType
+ */
+export function generateNote(noteType: string): PaneIdentifiersNote {
+  return {
+    noteType,
+  };
+}
+
+/**
+ *
+ * @param classFeatureId
+ * @param classMappingId
+ */
+export function generateClassFeature(
+  classFeatureId: number,
+  classMappingId: number
+): PaneIdentifiersClassFeature {
+  return {
+    classMappingId,
+    id: classFeatureId,
+  };
+}
+
+/**
+ *
+ * @param racialTraitId
+ */
+export function generateRacialTrait(
+  racialTraitId: number
+): PaneIdentifiersRacialTrait {
+  return {
+    id: racialTraitId,
+  };
+}
+
+/**
+ *
+ * @param id
+ */
+export function generateFeat(id: number): PaneIdentifiersFeat {
+  return {
+    id,
+  };
+}
+
+/**
+ *
+ * @param id
+ */
+export function generateBlessing(id: string): PaneIdentifiersBlessing {
+  return {
+    id,
+  };
+}
+
+/**
+ *
+ * @param id
+ */
+export function generateCustomAction(id: string): PaneIdentifiersCustomAction {
+  return {
+    id,
+  };
+}
+
+/**
+ *
+ * @param type
+ */
+export function generateTrait(
+  type: Constants.TraitTypeEnum
+): PaneIdentifiersTrait {
+  return {
+    type,
+  };
+}
+
+/**
+ *
+ * @param mappingId
+ */
+export function generateCustomItem(
+  mappingId: number
+): PaneIdentifiersCustomItem {
+  return {
+    id: mappingId,
+  };
+}
+
+/**
+ *
+ * @param mappingId
+ */
+export function generateCustomSkill(
+  mappingId: number
+): PaneIdentifiersCustomSkill {
+  return {
+    id: mappingId,
+  };
+}
+
+/**
+ *
+ * @param id
+ */
+export function generateAbility(
+  ability: AbilityManager
+): PaneIdentifiersAbility {
+  return {
+    ability,
+  };
+}
+
+/**
+ *
+ * @param id
+ */
+export function generateSkill(id: number): PaneIdentifiersSkill {
+  return {
+    id,
+  };
+}
+
+/**
+ *
+ * @param abilityId
+ */
+export function generateAbilitySavingThrows(
+  abilityId: number
+): PaneIdentifiersAbilitySavingThrow {
+  return {
+    id: abilityId,
+  };
+}
+
+/**
+ *
+ * @param hitPointType
+ */
+export function generatePreferenceHitPointConfirm(
+  hitPointType: number
+): PaneIdentifiersPreferenceHitPointConfirm {
+  return {
+    id: hitPointType,
+  };
+}
+
+/**
+ *
+ * @param progressionType
+ */
+export function generatePreferenceProgressionConfirm(
+  progressionType: number
+): PaneIdentifiersPreferenceProgressionConfirm {
+  return {
+    id: progressionType,
+  };
+}
+
+/**
+ *
+ * @param spellListIds
+ * @param newIsEnabled
+ */
+export function generatePreferenceOptionalClassFeaturesConfirm(
+  spellListIds: Array<number>,
+  newIsEnabled: boolean
+): PaneIdentifiersPreferenceOptionalClassFeaturesConfirm {
+  return {
+    spellListIds,
+    newIsEnabled,
+  };
+}
+
+/**
+ *
+ * @param spellListIds
+ * @param newIsEnabled
+ */
+export function generatePreferenceOptionalOriginsConfirm(
+  spellListIds: Array<number>,
+  newIsEnabled: boolean
+): PaneIdentifiersPreferenceOptionalOriginsConfirm {
+  return {
+    spellListIds,
+    newIsEnabled,
+  };
+}
+
+/**
+ *
+ * @param creatureMappingId
+ */
+export function generateCreature(
+  creatureMappingId: number
+): PaneIdentifiersCreature {
+  return {
+    id: creatureMappingId,
+  };
+}
+
+/**
+ *
+ * @param vehicleMappingId
+ */
+export function generateVehicle(vehicleMappingId): PaneIdentifiersVehicle {
+  return {
+    id: vehicleMappingId,
+  };
+}
+
+/**
+ *
+ * @param componentId
+ * @param vehicleId
+ */
+export function generateVehicleComponent(
+  componentId: number,
+  vehicleId: number
+): PaneIdentifiersVehicleComponent {
+  return {
+    vehicleId,
+    id: componentId,
+  };
+}
+
+/**
+ *
+ * @param stationId
+ * @param vehicleId
+ */
+export function generateVehicleActionStation(
+  stationId: number,
+  vehicleId: number
+): PaneIdentifiersVehicleActionStation {
+  return {
+    vehicleId,
+    id: stationId,
+  };
+}
+
+/**
+ *
+ * @param id
+ */
+export function generateInfusionChoice(
+  id: string
+): PaneIdentifiersInfusionChoice {
+  return {
+    id,
+  };
+}
+
+/**
+ *
+ * @param containerDefinitionKey
+ */
+export function generateContainer(
+  containerDefinitionKey: string,
+  showAddItems?: boolean
+): PaneIdentifiersContainer {
+  return {
+    containerDefinitionKey,
+    showAddItems,
+  };
+}
+
+/**
+ *
+ * @param containerDefinitionKeyContext
+ */
+export function generateCurrencyContext(
+  containerDefinitionKeyContext: string | null
+): PaneIdentifiersCurrencyContext {
+  return {
+    containerDefinitionKeyContext,
+  };
+}
diff --git a/ddb_main/tools/js/Shared/utils/RollResult/generators.ts b/ddb_main/tools/js/Shared/utils/RollResult/generators.ts
new file mode 100644
index 0000000..a0bfebd
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/RollResult/generators.ts
@@ -0,0 +1,24 @@
+import { RollParentKeyInfoLookup, RollResultGroupsLookup } from "./typings";
+
+/**
+ *
+ * @param rollResultGroupsLookup
+ */
+export function generateRollParentKeyInfoLookup(
+  rollResultGroupsLookup: RollResultGroupsLookup
+): RollParentKeyInfoLookup {
+  let lookup: RollParentKeyInfoLookup = {};
+
+  Object.keys(rollResultGroupsLookup).forEach((componentKey) => {
+    rollResultGroupsLookup[componentKey].forEach((rollGroupContract) => {
+      rollGroupContract.rollResults.forEach((rollResult) => {
+        lookup[rollResult.rollKey] = {
+          componentKey,
+          groupKey: rollGroupContract.groupKey,
+        };
+      });
+    });
+  });
+
+  return lookup;
+}
diff --git a/ddb_main/tools/js/Shared/utils/RollResult/utils.ts b/ddb_main/tools/js/Shared/utils/RollResult/utils.ts
new file mode 100644
index 0000000..94c55fe
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/RollResult/utils.ts
@@ -0,0 +1,278 @@
+import { groupBy, keyBy } from "lodash";
+
+import {
+  HelperUtils,
+  RollGroupContract,
+  RollResultContract,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { RollResultGroupsLookup } from "./typings";
+
+/**
+ *
+ * @param componentKey
+ * @param rollResultGroupsLookup
+ */
+export function getGroupsByComponentKey(
+  componentKey: string,
+  rollResultGroupsLookup: RollResultGroupsLookup
+): Array<RollGroupContract> {
+  return HelperUtils.lookupDataOrFallback(
+    rollResultGroupsLookup,
+    componentKey,
+    []
+  );
+}
+
+/**
+ *
+ * @param componentKey
+ * @param rollResultGroupsLookup
+ */
+export function getComponentOrderedGroups(
+  componentKey: string,
+  rollResultGroupsLookup: RollResultGroupsLookup
+): Array<RollGroupContract> {
+  return getOrderedLinkedEntries(
+    getGroupsByComponentKey(componentKey, rollResultGroupsLookup)
+  );
+}
+
+/**
+ *
+ * @param rollResults
+ */
+export function getGroupOrderedRollResults(
+  rollResults: Array<RollResultContract>
+): Array<RollResultContract> {
+  return getOrderedLinkedEntries(rollResults);
+}
+
+/**
+ *
+ * @param linkedEntries
+ */
+export function getOrderedLinkedEntries<T extends RollGroupContract>(
+  linkedEntries: Array<T>
+): Array<T>;
+export function getOrderedLinkedEntries<T extends RollResultContract>(
+  linkedEntries: Array<T>
+): Array<T>;
+export function getOrderedLinkedEntries<T extends any>(
+  linkedEntries: Array<T>
+) {
+  // @ts-ignore
+  return helper__getOrderedLinkedEntries(
+    linkedEntries,
+    getLinkedEntryKey as (entry: T) => string | null,
+    getLinkedEntryNextKey as (entry: T) => string | null
+  );
+}
+
+//probs in HelperUtils
+export function helper__getOrderedLinkedEntries<T extends any>(
+  linkedEntries: Array<T>,
+  getLinkedEntryKey: (entry: T) => string | null,
+  getLinkedEntryNextKey: (entry: T) => string | null
+): Array<T> {
+  const entryByNextKeyLookup = keyBy(
+    linkedEntries,
+    (entry) => getLinkedEntryNextKey(entry) ?? "null"
+  );
+
+  let orderedEntries: Array<T> = [];
+
+  let currentEntry: T | null = HelperUtils.lookupDataOrFallback(
+    entryByNextKeyLookup,
+    "null"
+  );
+
+  // Ordering fallback if no current entry is found
+  if (!currentEntry) {
+    // Find entry by nextKey not being included in list of current keys
+    const includedKeys = linkedEntries.map(
+      (entry) => getLinkedEntryKey(entry) ?? "null"
+    );
+    currentEntry =
+      linkedEntries.find(
+        (entry) =>
+          !includedKeys.includes(getLinkedEntryNextKey(entry) ?? "null")
+      ) ?? null;
+  }
+
+  let counter: number = 0;
+  while (counter <= linkedEntries.length && currentEntry) {
+    orderedEntries.push(currentEntry);
+
+    const nextEntryKey = getLinkedEntryKey(currentEntry);
+
+    currentEntry = null;
+
+    if (nextEntryKey) {
+      const nextEntry = HelperUtils.lookupDataOrFallback(
+        entryByNextKeyLookup,
+        nextEntryKey
+      );
+      if (nextEntry) {
+        currentEntry = nextEntry;
+      }
+    }
+    counter++;
+  }
+
+  return orderedEntries.reverse();
+}
+
+/**
+ *
+ * @param linkedEntry
+ */
+export function getLinkedEntryNextKey(
+  linkedEntry: RollResultContract | RollGroupContract
+): string | null {
+  if (isLinkedEntryRollGroupContract(linkedEntry)) {
+    return linkedEntry.nextGroupKey;
+  } else if (isLinkedEntryRollResultContract(linkedEntry)) {
+    return linkedEntry.nextRollKey;
+  } else {
+    return null;
+  }
+}
+
+/**
+ *
+ * @param linkedEntry
+ */
+export function getLinkedEntryKey(
+  linkedEntry: RollResultContract | RollGroupContract
+): string | null {
+  if (isLinkedEntryRollGroupContract(linkedEntry)) {
+    return linkedEntry.groupKey;
+  } else if (isLinkedEntryRollResultContract(linkedEntry)) {
+    return linkedEntry.rollKey;
+  } else {
+    return null;
+  }
+}
+
+/**
+ *
+ * @param linkedEntry
+ */
+export function isLinkedEntryRollGroupContract(
+  linkedEntry: RollResultContract | RollGroupContract
+): linkedEntry is RollGroupContract {
+  return (linkedEntry as RollGroupContract).groupKey !== undefined;
+}
+
+/**
+ *
+ * @param linkedEntry
+ */
+export function isLinkedEntryRollResultContract(
+  linkedEntry: RollResultContract | RollGroupContract
+): linkedEntry is RollResultContract {
+  return (linkedEntry as RollResultContract).rollKey !== undefined;
+}
+
+/**
+ *
+ * @param componentKey
+ * @param rollResultGroupsLookup
+ */
+export function generateComponentOrderedGroups(
+  componentKey: string,
+  rollResultGroupsLookup: RollResultGroupsLookup
+): Array<RollGroupContract> {
+  const groups = getGroupsByComponentKey(componentKey, rollResultGroupsLookup);
+  const groupByGroupKeyLookup = keyBy(groups, (group) => group.groupKey);
+  const nextGroupKeyGroupsLookup = groupBy(
+    groups,
+    (group) => group.nextGroupKey
+  );
+
+  let orderedGroups: Array<RollGroupContract> = [];
+
+  //process any groups with nextGroupKey pointing to non-existent group
+  groups.forEach((group) => {
+    if (group.nextGroupKey) {
+      const nextGroup = HelperUtils.lookupDataOrFallback(
+        groupByGroupKeyLookup,
+        group.nextGroupKey
+      );
+      if (!nextGroup) {
+        orderedGroups.push(
+          ...getOrderedGroupsByEndKey(
+            group.nextGroupKey,
+            groups,
+            groupByGroupKeyLookup,
+            nextGroupKeyGroupsLookup
+          )
+        );
+      }
+    }
+  });
+
+  //process any groups with  null nextGroupKey
+  const nullTierGroups = getOrderedGroupsByEndKey(
+    "null",
+    groups,
+    groupByGroupKeyLookup,
+    nextGroupKeyGroupsLookup
+  );
+
+  return [...orderedGroups, ...nullTierGroups];
+}
+
+/**
+ *
+ * @param endKey
+ * @param groups
+ * @param groupByGroupKeyLookup
+ * @param nextGroupKeyGroupsLookup
+ */
+function getOrderedGroupsByEndKey(
+  endKey: string,
+  groups: Array<RollGroupContract>,
+  groupByGroupKeyLookup: Record<
+    RollGroupContract["groupKey"],
+    RollGroupContract
+  >,
+  nextGroupKeyGroupsLookup: Record<string, Array<RollGroupContract>>
+): Array<RollGroupContract> {
+  const orderedGroups: Array<RollGroupContract> = [];
+
+  let currentTierGroups: Array<RollGroupContract> = [];
+  const endTierGroups = HelperUtils.lookupDataOrFallback(
+    nextGroupKeyGroupsLookup,
+    endKey
+  );
+  if (endTierGroups) {
+    currentTierGroups.push(...endTierGroups);
+  }
+
+  //find each tier of groups by nextGroupKey
+  let counter: number = 0;
+  while (
+    counter <= groups.length &&
+    currentTierGroups &&
+    currentTierGroups.length > 0
+  ) {
+    const nextTierGroups: Array<RollGroupContract> = [];
+    currentTierGroups.forEach((group) => {
+      const foundGroups = HelperUtils.lookupDataOrFallback(
+        nextGroupKeyGroupsLookup,
+        group.groupKey
+      );
+      if (foundGroups) {
+        nextTierGroups.push(...foundGroups);
+      }
+    });
+
+    orderedGroups.push(...currentTierGroups);
+
+    currentTierGroups = nextTierGroups;
+    counter++;
+  }
+  return orderedGroups.reverse();
+}
diff --git a/ddb_main/tools/js/Shared/utils/TypeScript/utils.ts b/ddb_main/tools/js/Shared/utils/TypeScript/utils.ts
new file mode 100644
index 0000000..e72cc36
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/TypeScript/utils.ts
@@ -0,0 +1,17 @@
+import { AxiosError } from "axios";
+
+/**
+ * https://github.com/Microsoft/TypeScript/issues/16069#issuecomment-369374214
+ * Used to get around array filter function that errors because it doesn't recognize the filter
+ * is removing nulls
+ * @param input
+ */
+export function isNotNullOrUndefined<T extends Object>(
+  input: null | undefined | T
+): input is T {
+  return input !== null;
+}
+
+export function isAxiosError(error: Error): error is AxiosError {
+  return (error as AxiosError).response !== undefined;
+}
diff --git a/ddb_main/tools/js/Shared/utils/navigationUtils.ts b/ddb_main/tools/js/Shared/utils/navigationUtils.ts
new file mode 100644
index 0000000..24ea322
--- /dev/null
+++ b/ddb_main/tools/js/Shared/utils/navigationUtils.ts
@@ -0,0 +1,8 @@
+import {
+  CampaignDataContract,
+  CampaignUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+export function getLaunchGameUrl(campaign: CampaignDataContract): string {
+  return `/games/${CampaignUtils.getId(campaign)}`;
+}
diff --git a/ddb_main/tools/js/commonComponents/Tooltip/Tooltip.tsx b/ddb_main/tools/js/commonComponents/Tooltip/Tooltip.tsx
new file mode 100644
index 0000000..d5878b2
--- /dev/null
+++ b/ddb_main/tools/js/commonComponents/Tooltip/Tooltip.tsx
@@ -0,0 +1,165 @@
+import * as React from "react";
+import Tippy from "tippy.js";
+
+export interface TippyOpts {
+  arrow?: boolean;
+  delay?: number;
+  animation?: string;
+  duration?: Array<number>;
+  dynamicTitle?: boolean;
+  placement?: string;
+}
+
+interface Props {
+  tippyOpts?: TippyOpts;
+  className: string;
+  title: string;
+  style: object;
+  isInteractive: boolean;
+  enabled: boolean;
+  onClick?: () => void;
+  isDarkMode?: boolean;
+}
+
+const defaultTippsOpts: TippyOpts = {
+  arrow: true,
+  delay: 300,
+  animation: "fade",
+  duration: [250, 250],
+};
+
+export default class Tooltip extends React.Component<Props> {
+  static defaultProps = {
+    style: {},
+    isInteractive: false,
+    enabled: true,
+    className: "",
+    isDarkMode: false,
+  };
+
+  tooltipDOM: HTMLElement | null = null;
+  //TODO type tippy once tippy.js has been updated to a newer version https://github.com/atomiks/tippyjs/pull/329
+  tippy: any | null = null;
+
+  constructor(props: Props) {
+    super(props);
+
+    if (props.enabled) {
+      this.initTippy = this.initTippy.bind(this);
+      this.destroyTippy = this.destroyTippy.bind(this);
+    }
+  }
+
+  componentDidMount() {
+    const { enabled } = this.props;
+
+    if (enabled) {
+      this.initTippy();
+    }
+  }
+
+  componentDidUpdate(prevProps) {
+    if (
+      this.props.title !== prevProps.title ||
+      this.props.isDarkMode !== prevProps.isDarkMode
+    ) {
+      this.initTippy();
+    }
+  }
+
+  componentWillUnmount() {
+    const { enabled } = this.props;
+
+    if (enabled) {
+      this.destroyTippy();
+    }
+  }
+
+  initTippy(): void {
+    const { isDarkMode } = this.props;
+    if (typeof window === "undefined" || typeof document === "undefined") {
+      return;
+    }
+
+    if (this.tooltipDOM) {
+      this.tooltipDOM.setAttribute("title", this.props.title);
+      this.tippy = Tippy(this.tooltipDOM, {
+        ...defaultTippsOpts,
+        ...this.props.tippyOpts,
+        theme: isDarkMode ? "custom-dark" : "",
+      });
+    }
+  }
+
+  destroyTippy(): void {
+    if (typeof window === "undefined" || typeof document === "undefined") {
+      return;
+    }
+    if (
+      this.tippy &&
+      this.tooltipDOM &&
+      // @ts-ignore
+      this.tooltipDOM._tippy
+    ) {
+      // @ts-ignore
+      this.tooltipDOM._tippy.destroy();
+      this.tooltipDOM = null;
+      this.tippy = null;
+    }
+  }
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  render() {
+    const {
+      className,
+      style,
+      title,
+      children,
+      enabled,
+      isInteractive,
+      tippyOpts,
+      isDarkMode,
+      onClick,
+      ...elProps
+    } = this.props;
+
+    let classNames: Array<string> = ["ddbc-tooltip", className];
+    if (isInteractive) {
+      classNames.push("ddbc-tooltip--is-interactive");
+    }
+
+    if (isDarkMode) {
+      classNames.push("ddbc-tooltip--dark-mode");
+    }
+
+    if (!enabled) {
+      return <React.Fragment>{children}</React.Fragment>;
+    }
+
+    return (
+      <span
+        title={title}
+        style={{
+          ...style,
+        }}
+        className={classNames.join(" ")}
+        ref={(tooltip) => {
+          this.tooltipDOM = tooltip;
+        }}
+        onClick={this.handleClick}
+        {...elProps}
+      >
+        {children}
+      </span>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/commonComponents/Tooltip/index.ts b/ddb_main/tools/js/commonComponents/Tooltip/index.ts
new file mode 100644
index 0000000..968f44d
--- /dev/null
+++ b/ddb_main/tools/js/commonComponents/Tooltip/index.ts
@@ -0,0 +1,4 @@
+import Tooltip from "./Tooltip";
+
+export default Tooltip;
+export { Tooltip };
diff --git a/ddb_main/tools/js/config/index.ts b/ddb_main/tools/js/config/index.ts
new file mode 100644
index 0000000..168a415
--- /dev/null
+++ b/ddb_main/tools/js/config/index.ts
@@ -0,0 +1,16 @@
+/* eslint-disable no-process-env */
+/* global process */
+const environment = process.env.NODE_ENV;
+const debug = environment === "development";
+
+const config = {
+  buildKey:
+    typeof process.env.REACT_APP_BUILD_KEY === "undefined"
+      ? "UNKNOWN"
+      : process.env.REACT_APP_BUILD_KEY,
+  debug,
+  environment,
+  version: process.env.REACT_APP_VERSION,
+};
+
+export default config;
diff --git a/ddb_main/tools/js/index.tsx b/ddb_main/tools/js/index.tsx
new file mode 100644
index 0000000..d7e4e51
--- /dev/null
+++ b/ddb_main/tools/js/index.tsx
@@ -0,0 +1,234 @@
+// import axe from '@axe-core/react';
+import { css } from "@mui/material";
+import GlobalStyles from "@mui/material/GlobalStyles";
+import React from "react";
+import Modal from "react-modal";
+import { Provider } from "react-redux";
+import { useLocation, useMatch, useNavigate } from "react-router-dom";
+import { Store } from "redux";
+
+import {
+  characterEnvActions,
+  ConfigUtils,
+  Constants,
+  generateApiAdapter,
+} from "@dndbeyond/character-rules-engine/es";
+
+import config from "~/config";
+import { CharacterThemeProvider } from "~/contexts/CharacterTheme";
+import { SidebarProvider } from "~/contexts/Sidebar";
+import useUserId from "~/hooks/useUserId";
+import useUserName from "~/hooks/useUserName";
+import useUserRoles from "~/hooks/useUserRoles";
+
+import "../styles/styles.scss";
+import CharacterBuilderContainer from "./CharacterBuilder/containers/CharacterBuilderContainer";
+import CharacterSheetContainer from "./CharacterSheet/containers/CharacterSheetContainer";
+import configureSheetStore from "./CharacterSheet/store/configureStore";
+import { appEnvActions } from "./Shared/actions";
+import { Managers } from "./Shared/managers";
+import {
+  DiceFeatureConfigurationState,
+  GameLogState,
+} from "./Shared/stores/typings";
+import {
+  AppLoggerUtils,
+  AppNotificationUtils,
+  ErrorUtils,
+} from "./Shared/utils";
+import appConfig from "./config";
+
+const BASE_PATHNAME = config.basePathname;
+
+interface Props {
+  readOnly: boolean;
+  redirect?: string;
+  characterId: number | null;
+}
+
+export const SheetBuilderApp: React.FC<Props> = ({
+  readOnly,
+  characterId,
+  redirect,
+}) => {
+  const username = useUserName();
+  const userId = useUserId();
+  const userRoles = useUserRoles();
+  const navigate = useNavigate();
+  const matchBuilderWithOutCharacter = useMatch(`${BASE_PATHNAME}/builder/*`);
+  const matchBuilderWithCharacter = useMatch(
+    `${BASE_PATHNAME}/:characterId/builder/*`
+  );
+  const matchSheet = useMatch(`${BASE_PATHNAME}/:characterId/`);
+  const matchSheetWithShareId = useMatch(
+    `${BASE_PATHNAME}/:characterId/:shareId`
+  );
+  const currentPath = useLocation().pathname;
+
+  if (config === undefined) {
+    throw Error("Missing Config");
+  }
+
+  let appContext: Constants.AppContextTypeEnum | null = null;
+  switch (true) {
+    case !!(matchBuilderWithOutCharacter || matchBuilderWithCharacter):
+      appContext = Constants.AppContextTypeEnum.BUILDER;
+      break;
+    case !!(matchSheet || matchSheetWithShareId):
+      appContext = Constants.AppContextTypeEnum.SHEET;
+      break;
+    default:
+      throw new Error("Invalid app context");
+  }
+
+  const diceFeatureConfiguration: DiceFeatureConfigurationState = {
+    enabled: true,
+    menu: true,
+    assetBaseLocation: config.diceAssetEndpoint,
+    apiEndpoint: config.diceApiEndpoint,
+    trackingId: config.analyticTrackingId,
+  };
+
+  ErrorUtils.initReporting({
+    debug: appConfig.debug,
+  });
+
+  let store: Store = configureSheetStore();
+  store.dispatch({
+    type: "SET_ROUTE_CONTROLS",
+    payload: { navigate, currentPath },
+  });
+
+  let parsedDiceEnabled: boolean = true;
+  if (!diceFeatureConfiguration.enabled) {
+    parsedDiceEnabled = false;
+  } else {
+    // if local storage is disabled it will just crash when trying to access, this prevents crashing.
+    try {
+      const diceEnabled = localStorage.getItem("dice-enabled");
+      // once dice are enabled set the default to on;
+      parsedDiceEnabled = diceEnabled === "true" || diceEnabled === null;
+    } catch (e) {}
+  }
+
+  let lastMessageTime = 0;
+  try {
+    const lsLastMessageTime = localStorage.getItem(
+      `gameLog-lastMessageTime-${characterId}`
+    );
+    if (lsLastMessageTime) {
+      lastMessageTime = parseInt(lsLastMessageTime);
+    }
+  } catch (e) {}
+
+  const gameLogSettings: GameLogState = {
+    isOpen: false,
+    lastMessageTime: lastMessageTime,
+    apiEndpoint: config.gameLogApiEndpoint,
+    ddbApiEndpoint: config.ddbApiEndpoint,
+  };
+
+  ConfigUtils.configureRulesEngine({
+    apiAdapter: generateApiAdapter(config.authEndpoint, readOnly),
+    apiInfo: config.apiInfo,
+    store,
+    onLogMessage: AppLoggerUtils.logMessage,
+    onLogError: AppLoggerUtils.logError,
+    onNotification: AppNotificationUtils.dispatchNotification,
+    includeCustomItems: true,
+    canUseCurrencyContainers: true,
+  });
+
+  store.dispatch(
+    characterEnvActions.dataSet({
+      context: appContext,
+    })
+  );
+
+  store.dispatch(
+    appEnvActions.dataSet({
+      username,
+      userId: userId ? Number(userId) : -1,
+      userRoles,
+      characterId,
+      authEndpoint: config.authEndpoint,
+      redirect,
+      diceEnabled: parsedDiceEnabled,
+      diceFeatureConfiguration: diceFeatureConfiguration,
+      gameLog: gameLogSettings,
+    })
+  );
+
+  // Setup axe-core in development, not in production
+  if (process.env.NODE_ENV !== "production") {
+    // axe(React, ReactDOM, 10000);
+  }
+
+  Modal.setAppElement("#character-tools-target");
+  return (
+    <Provider store={store}>
+      <Managers>
+        <CharacterThemeProvider>
+          <SidebarProvider>
+            <GlobalStyles
+              styles={() => {
+                return css`
+                  input,
+                  button,
+                  select,
+                  textarea {
+                    font-family: Roboto, Helvetica, sans-serif;
+                    font-size: 100%;
+                    margin: 0;
+                    vertical-align: baseline;
+                  }
+
+                  input[type="text"],
+                  input[type="number"],
+                  input[type="search"],
+                  input[type="password"],
+                  input[type="email"],
+                  textarea,
+                  select {
+                    background-color: #fff;
+                    background: #fff none;
+                    border: 1px solid #ddd;
+                    border-radius: 4px;
+                    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+                    color: #000;
+                    padding: 4px;
+                    transition: 0.2s linear border, 0.2s linear box-shadow;
+                  }
+
+                  input[type="text"]:focus,
+                  input[type="number"]:focus,
+                  input[type="search"]:focus,
+                  input[type="password"]:focus,
+                  input[type="email"]:focus,
+                  textarea:focus {
+                    border-color: #242527;
+                    box-shadow: 0 0 4px rgba(36, 37, 39, 0.6);
+                    background-color: #f9f9f9;
+                    outline: 0;
+                  }
+
+                  button,
+                  input[type="button"],
+                  input[type="reset"],
+                  input[type="submit"] {
+                    cursor: pointer;
+                  }
+                `;
+              }}
+            />
+            {matchBuilderWithOutCharacter || matchBuilderWithCharacter ? (
+              <CharacterBuilderContainer />
+            ) : (
+              <CharacterSheetContainer authEndpoint={config.authEndpoint} />
+            )}
+          </SidebarProvider>
+        </CharacterThemeProvider>
+      </Managers>
+    </Provider>
+  );
+};
diff --git a/ddb_main/tools/js/smartComponents/AbilitySummary/AbilitySummary.tsx b/ddb_main/tools/js/smartComponents/AbilitySummary/AbilitySummary.tsx
new file mode 100644
index 0000000..10cec3e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/AbilitySummary/AbilitySummary.tsx
@@ -0,0 +1,142 @@
+import { useContext } from "react";
+
+import {
+  AbilityManager,
+  CharacterPreferences,
+  CharacterTheme,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+import { DiceTools, IRollContext, RollType } from "@dndbeyond/dice";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+import BoxBackground from "../BoxBackground";
+import { DigitalDiceWrapper } from "../Dice";
+import AbilityScoreBoxSvg from "../Svg/boxes/AbilityScoreBoxSvg";
+import { isNotNullOrUndefined } from "../utils/TypeScriptUtils";
+
+interface Props {
+  className?: string;
+  ability: AbilityManager | { name: string; score: number; modifier: number };
+  preferences: CharacterPreferences;
+  theme: CharacterTheme;
+  onClick?: (ability: AbilityManager) => void;
+  diceEnabled?: boolean;
+  rollContext: IRollContext;
+}
+export default function AbilitySummary({
+  className = "",
+  ability,
+  preferences,
+  theme,
+  onClick,
+  diceEnabled = false,
+  rollContext,
+}: Props) {
+  const isManager = "getStatKey" in ability;
+
+  const handleClick = (evt: React.MouseEvent): void => {
+    if (onClick && isManager) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick(ability);
+    }
+  };
+
+  const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+    useContext(GameLogContext);
+
+  let classNames: Array<string> = [className, "ddbc-ability-summary"];
+
+  let primaryNode: React.ReactNode;
+  let secondaryNode: React.ReactNode;
+  if (!ability) return null;
+  const abilityStatKey = isManager ? ability.getStatKey() : 0;
+  const abilityLabel = isManager ? ability.getLabel() : ability.name;
+  const abilityName = isManager ? ability.getName() : ability.name;
+  const abilityModifier = isManager ? ability.getModifier() : ability.modifier;
+  const abilityTotalScore = isManager ? ability.getTotalScore() : ability.score;
+
+  const diceWrapperProps = {
+    rollType: RollType.Check,
+    rollAction: abilityName,
+    diceEnabled: diceEnabled,
+    diceNotation: DiceTools.CustomD20(abilityModifier ?? 0),
+    themeColor: theme.themeColor,
+    rollContext: rollContext,
+    rollTargetOptions: !!messageTargetOptions?.entities
+      ? Object.values(messageTargetOptions.entities).filter(
+          isNotNullOrUndefined
+        )
+      : undefined,
+    rollTargetDefault :defaultMessageTargetOption,
+    userId: Number(userId),
+  };
+
+  if (
+    preferences.abilityScoreDisplayType ===
+    Constants.PreferenceAbilityScoreDisplayTypeEnum.SCORES_TOP
+  ) {
+    primaryNode = (
+      <DigitalDiceWrapper
+        {...diceWrapperProps}
+      >
+        {abilityTotalScore}
+      </DigitalDiceWrapper>
+    );
+
+    if (abilityModifier === null) {
+      secondaryNode = "--";
+    } else {
+      secondaryNode = <NumberDisplay type="signed" number={abilityModifier} />;
+    }
+  } else {
+    if (abilityModifier === null) {
+      primaryNode = "--";
+    } else {
+      primaryNode = (
+        <DigitalDiceWrapper
+          {...diceWrapperProps}
+        >
+          <NumberDisplay
+            number={abilityModifier}
+            type="signed"
+            size="large"
+          />
+        </DigitalDiceWrapper>
+      );
+    }
+    secondaryNode = abilityTotalScore;
+  }
+
+  return (
+    <div className={classNames.join(" ")} onClick={handleClick}>
+      <BoxBackground StyleComponent={AbilityScoreBoxSvg} theme={theme} />
+      <div className="ddbc-ability-summary__heading">
+        <span
+          className={`ddbc-ability-summary__label ${
+            theme.isDarkMode ? "ddbc-ability-summary__label--dark-mode" : ""
+          }`}
+        >
+          {abilityLabel}
+        </span>
+        <span className="ddbc-ability-summary__abbr">{abilityStatKey}</span>
+      </div>
+      <div
+        className={`ddbc-ability-summary__primary ${
+          theme.isDarkMode ? "ddbc-ability-summary__primary--dark-mode" : ""
+        }`}
+      >
+        {primaryNode}
+      </div>
+      <div
+        className={`ddbc-ability-summary__secondary ${
+          theme.isDarkMode ? "ddbc-ability-summary__secondary--dark-mode" : ""
+        }`}
+      >
+        {secondaryNode}
+      </div>
+    </div>
+  );
+}
diff --git a/ddb_main/tools/js/smartComponents/AbilitySummary/index.ts b/ddb_main/tools/js/smartComponents/AbilitySummary/index.ts
new file mode 100644
index 0000000..8d71f7b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/AbilitySummary/index.ts
@@ -0,0 +1,4 @@
+import AbilitySummary from "./AbilitySummary";
+
+export default AbilitySummary;
+export { AbilitySummary };
diff --git a/ddb_main/tools/js/smartComponents/ActionName/ActionName.tsx b/ddb_main/tools/js/smartComponents/ActionName/ActionName.tsx
new file mode 100644
index 0000000..b415488
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/ActionName/ActionName.tsx
@@ -0,0 +1,53 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  Action,
+  ActionUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  action: Action;
+  onClick?: (action: Action) => void;
+  className: string;
+  theme?: CharacterTheme;
+}
+export default class ActionName extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick, action } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+
+      onClick(action);
+    }
+  };
+
+  render() {
+    const { action, className, theme } = this.props;
+
+    let isCustomized = ActionUtils.isCustomized(action);
+    let classNames: Array<string> = [className, "ddbc-action-name"];
+
+    return (
+      <span className={classNames.join(" ")} onClick={this.handleClick}>
+        {ActionUtils.getName(action)}
+        {isCustomized && (
+          <Tooltip
+            title="Action is Customized"
+            className="ddbc-action-name__customized"
+            isDarkMode={theme?.isDarkMode}
+          >
+            *
+          </Tooltip>
+        )}
+      </span>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/ActionName/index.ts b/ddb_main/tools/js/smartComponents/ActionName/index.ts
new file mode 100644
index 0000000..1ba2768
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/ActionName/index.ts
@@ -0,0 +1,4 @@
+import ActionName from "./ActionName";
+
+export default ActionName;
+export { ActionName };
diff --git a/ddb_main/tools/js/smartComponents/ArmorClassBox/ArmorClassBox.tsx b/ddb_main/tools/js/smartComponents/ArmorClassBox/ArmorClassBox.tsx
new file mode 100644
index 0000000..6b50ded
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/ArmorClassBox/ArmorClassBox.tsx
@@ -0,0 +1,65 @@
+import { visuallyHidden } from "@mui/utils";
+import * as React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BoxBackground from "../BoxBackground";
+import ArmorClassBoxSvg from "../Svg/boxes/ArmorClassBoxSvg";
+
+interface Props {
+  armorClass: number;
+  theme: CharacterTheme;
+  onClick?: () => void;
+  className: string;
+}
+
+export default class ArmorClassBox extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  render() {
+    const { armorClass, className, theme } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-armor-class-box"];
+
+    return (
+      <section className={classNames.join(" ")} onClick={this.handleClick}>
+        <BoxBackground StyleComponent={ArmorClassBoxSvg} theme={theme} />
+        <h2 style={visuallyHidden}>Armor Class</h2>
+        <div
+          className={`ddbc-armor-class-box__label ${
+            theme.isDarkMode ? "ddbc-armor-class-box__label--dark-mode" : ""
+          }`}
+        >
+          Armor
+        </div>
+        <div
+          className={`ddbc-armor-class-box__value ${
+            theme.isDarkMode ? "ddbc-armor-class-box__value--dark-mode" : ""
+          }`}
+          data-testid="armor-class-value"
+        >
+          {armorClass}
+        </div>
+        <div
+          className={`ddbc-armor-class-box__label ${
+            theme.isDarkMode ? "ddbc-armor-class-box__label--dark-mode" : ""
+          }`}
+        >
+          Class
+        </div>
+      </section>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/AttackTable/AttackTable.tsx b/ddb_main/tools/js/smartComponents/AttackTable/AttackTable.tsx
new file mode 100644
index 0000000..3cdd8bd
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/AttackTable/AttackTable.tsx
@@ -0,0 +1,165 @@
+import {
+  AbilityLookup,
+  Action,
+  Attack,
+  CharacterTheme,
+  Constants,
+  DataOriginRefData,
+  Item,
+  RuleData,
+  Spell,
+  SpellCasterInfo,
+  WeaponSpellDamageGroup,
+} from "@dndbeyond/character-rules-engine/es";
+import { IRollContext } from "@dndbeyond/dice";
+import CombatActionAttack from "../CombatAttack/CombatActionAttack";
+import CombatItemAttack from "../CombatAttack/CombatItemAttack";
+import CombatSpellAttack from "../CombatAttack/CombatSpellAttack";
+import { useMemo } from "react";
+import clsx from "clsx";
+import styles from "./styles.module.css";
+
+interface AttackTableProps extends React.HTMLAttributes<HTMLElement> {
+  theme: CharacterTheme;
+  showNotes?: boolean;
+  diceEnabled?: boolean;  
+  attacks: Array<Attack>;
+  weaponSpellDamageGroups: Array<WeaponSpellDamageGroup>;
+  abilityLookup: AbilityLookup;
+  ruleData: RuleData;
+  spellCasterInfo: SpellCasterInfo;
+  onAttackClick?: (attack: Attack) => void;
+  rollContext: IRollContext;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+};
+
+export const AttackTable = ({
+  theme,
+  attacks,
+  weaponSpellDamageGroups,
+  ruleData,
+  abilityLookup,
+  spellCasterInfo,
+  onAttackClick,
+  dataOriginRefData,
+  proficiencyBonus,
+  rollContext,
+
+  showNotes = true,
+  diceEnabled = false,
+
+  ...props
+}: AttackTableProps) => {
+  const columnClassNameBase = useMemo(() => [
+    styles.col,
+    theme?.isDarkMode && styles.darkMode,
+  ], [theme]);
+
+  const getColumnClass = (addtionalClass: string) => clsx([
+    ...columnClassNameBase,
+    addtionalClass,
+  ]);
+
+  const renderedAttacks = useMemo(
+    (): React.ReactNode => !!attacks.length
+      ? attacks.map((attack): React.ReactNode => {
+        const commonCombatAttackProps = {
+          key: attack.key,
+          attack,
+          ruleData,
+          abilityLookup,
+          onClick: onAttackClick,
+          showNotes,
+          diceEnabled,
+          theme,
+          rollContext,
+          proficiencyBonus,
+          className: styles.attack,
+        };
+
+        switch (attack.type) {
+          case Constants.AttackSourceTypeEnum.ACTION:
+          case Constants.AttackSourceTypeEnum.CUSTOM:
+            return (
+              <CombatActionAttack
+                action={attack.data as Action}
+                {...commonCombatAttackProps}
+              />
+            );
+
+          case Constants.AttackSourceTypeEnum.ITEM:
+            return (
+              <CombatItemAttack
+                item={attack.data as Item}
+                weaponSpellDamageGroups={weaponSpellDamageGroups}
+                {...commonCombatAttackProps}
+              />
+            );
+
+          case Constants.AttackSourceTypeEnum.SPELL:
+            return (
+              <CombatSpellAttack
+                spell={attack.data as Spell}
+                spellCasterInfo={spellCasterInfo}
+                dataOriginRefData={dataOriginRefData}
+                {...commonCombatAttackProps}
+              />
+            );
+
+          default:
+            return null;
+        }
+      })
+      : (
+        <div className={clsx([
+          styles.default,
+          theme?.isDarkMode && styles.darkMode,
+        ])}>
+          Equip weapons or add spells to see your attacks here.
+        </div>
+      ),
+    [
+      attacks,
+      ruleData,
+      abilityLookup,
+      onAttackClick,
+      showNotes,
+      diceEnabled,
+      theme,
+      rollContext,
+      proficiencyBonus,
+      weaponSpellDamageGroups,
+      spellCasterInfo,
+      dataOriginRefData
+    ]
+  );
+
+  return  (
+    <div {...props}>
+        <div className={styles.tableHeader}>
+          <div className={getColumnClass(styles.icon)} />
+          <div className={getColumnClass(styles.name)}>
+            Attack
+          </div>
+          <div className={getColumnClass(styles.range)}>
+            Range
+          </div>
+          <div className={getColumnClass(styles.tohit)}>
+            Hit / DC
+          </div>
+          <div className={getColumnClass(styles.damage)}>
+            Damage
+          </div>
+          {showNotes && (
+            <div className={getColumnClass(styles.notes)}>
+              Notes
+            </div>
+          )}
+        </div>
+        <div data-testid="attack-table-content">
+          {renderedAttacks}
+        </div>
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/smartComponents/AttunementSlot/AttunementSlot.tsx b/ddb_main/tools/js/smartComponents/AttunementSlot/AttunementSlot.tsx
new file mode 100644
index 0000000..13da731
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/AttunementSlot/AttunementSlot.tsx
@@ -0,0 +1,152 @@
+import * as React from "react";
+
+import {
+  Item,
+  ItemUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemName } from "~/components/ItemName";
+
+import BoxBackground from "../BoxBackground";
+import {
+  EmptyAttunementSlotBoxSvg,
+  ThemedAttunementSlotBoxSvg,
+  ThemedWithOpacityAttunementSlotBoxSvg,
+} from "../Svg/boxes/AttunementSlotBoxSvg";
+
+interface Props {
+  slot: Item | null;
+  onClick?: (slot: Item) => void;
+  isMobile: boolean;
+  className: string;
+  theme: CharacterTheme;
+}
+
+export default class AttunementSlot extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    className: "",
+    isMobile: false,
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick, slot } = this.props;
+
+    if (onClick && slot !== null) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+
+      onClick(slot);
+    }
+  };
+
+  renderMetaItems = (): React.ReactNode => {
+    const { slot } = this.props;
+
+    if (slot === null) {
+      return null;
+    }
+
+    let metaItems: Array<string> = [];
+
+    if (ItemUtils.isLegacy(slot)) {
+      metaItems.push("Legacy");
+    }
+
+    let type = ItemUtils.getType(slot);
+    if (type !== null) {
+      metaItems.push(type);
+    }
+
+    if (ItemUtils.isWeaponContract(slot)) {
+      if (ItemUtils.isOffhand(slot)) {
+        metaItems.push("Dual Wield");
+      }
+    } else if (ItemUtils.isArmorContract(slot)) {
+      let baseArmorName = ItemUtils.getBaseArmorName(slot);
+      if (baseArmorName) {
+        metaItems.push(baseArmorName);
+      }
+    } else if (ItemUtils.isGearContract(slot)) {
+      let subType = ItemUtils.getSubType(slot);
+      if (subType) {
+        metaItems.push(subType);
+      }
+      if (ItemUtils.isOffhand(slot)) {
+        metaItems.push("Dual Wield");
+      }
+    }
+
+    return (
+      <div className="ddbc-attunement-slot__meta">
+        {metaItems.map(
+          (metaItem, idx): React.ReactNode => (
+            <span className="ddbc-attunement-slot__meta-item" key={idx}>
+              {metaItem}
+            </span>
+          )
+        )}
+      </div>
+    );
+  };
+
+  renderItem = (): React.ReactNode => {
+    const { slot } = this.props;
+
+    if (slot === null) {
+      return null;
+    }
+
+    let itemImage = ItemUtils.getAvatarUrl(slot);
+    let previewStyles: React.CSSProperties = {
+      backgroundImage: `url(${itemImage})`,
+    };
+
+    return (
+      <React.Fragment>
+        <div className="ddbc-attunement-slot__preview" style={previewStyles} />
+        <div className="ddbc-attunement-slot__content">
+          <div className="ddbc-attunement-slot__name">
+            <ItemName item={slot} showAttunement={false} />
+          </div>
+          {this.renderMetaItems()}
+        </div>
+      </React.Fragment>
+    );
+  };
+
+  renderEmpty = (): React.ReactNode => {
+    const { isMobile } = this.props;
+
+    return (
+      <React.Fragment>
+        <div className="ddbc-attunement-slot__preview" />
+        <div className="ddbc-attunement-slot__content">
+          Choose an Item from {isMobile ? "Below" : " the Right"}
+        </div>
+      </React.Fragment>
+    );
+  };
+
+  render() {
+    const { slot, className, theme } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-attunement-slot"];
+    let StyleComponent: React.ComponentType<any> = theme?.isDarkMode
+      ? ThemedWithOpacityAttunementSlotBoxSvg
+      : EmptyAttunementSlotBoxSvg;
+    if (slot) {
+      classNames.push("ddbc-attunement-slot--filled");
+      StyleComponent = ThemedAttunementSlotBoxSvg;
+    } else {
+      classNames.push("ddbc-attunement-slot--empty");
+    }
+
+    return (
+      <div className={classNames.join(" ")} onClick={this.handleClick}>
+        <BoxBackground StyleComponent={StyleComponent} theme={theme} />
+        {slot ? this.renderItem() : this.renderEmpty()}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/BoxBackground/BoxBackground.tsx b/ddb_main/tools/js/smartComponents/BoxBackground/BoxBackground.tsx
new file mode 100644
index 0000000..dde8f86
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/BoxBackground/BoxBackground.tsx
@@ -0,0 +1,26 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  StyleComponent: React.ComponentType<any>;
+  theme: CharacterTheme;
+  className: string;
+}
+export default class BoxBackground extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { StyleComponent, theme, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-box-background", className];
+
+    return (
+      <div className={classNames.join(" ")}>
+        <StyleComponent theme={theme} />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/BoxBackground/index.ts b/ddb_main/tools/js/smartComponents/BoxBackground/index.ts
new file mode 100644
index 0000000..08b0840
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/BoxBackground/index.ts
@@ -0,0 +1,4 @@
+import BoxBackground from "./BoxBackground";
+
+export default BoxBackground;
+export { BoxBackground };
diff --git a/ddb_main/tools/js/smartComponents/CampaignSummary/CampaignSummary.tsx b/ddb_main/tools/js/smartComponents/CampaignSummary/CampaignSummary.tsx
new file mode 100644
index 0000000..42b7eae
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CampaignSummary/CampaignSummary.tsx
@@ -0,0 +1,110 @@
+import clsx from "clsx";
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { ThemedPlayButtonSvg } from "@dndbeyond/character-components/es";
+import {
+  CampaignDataContract,
+  CampaignUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+import D6 from "@dndbeyond/fontawesome-cache/svgs/regular/dice-d6.svg";
+import { GameLogNotificationWrapper } from "@dndbeyond/game-log-components";
+
+import { Link } from "~/components/Link";
+
+import { useSidebar } from "../../../../contexts/Sidebar";
+import { PaneComponentEnum } from "../../../../subApps/sheet/components/Sidebar/types";
+import { GameLogState } from "../../Shared/stores/typings";
+import { NavigationUtils } from "../../Shared/utils";
+import styles from "./styles.module.css";
+
+interface Props {
+  campaign: CampaignDataContract;
+  onCampaignShow?: () => void;
+  className?: string;
+  gameLog?: GameLogState;
+  theme: CharacterTheme;
+}
+
+const CampaignSummary: React.FC<Props> = ({
+  campaign,
+  onCampaignShow,
+  className = "",
+  gameLog,
+  theme,
+}) => {
+  const {
+    pane: { paneHistoryStart },
+  } = useSidebar();
+
+  const handleClick = (evt: React.MouseEvent): void => {
+    evt.nativeEvent.stopImmediatePropagation();
+    evt.stopPropagation();
+
+    if (onCampaignShow) {
+      onCampaignShow();
+    }
+  };
+
+  const handleGameLogClick = (evt: React.MouseEvent): void => {
+    evt.stopPropagation();
+    evt.nativeEvent.stopImmediatePropagation();
+    // Assuming dispatch is available in props or context
+    paneHistoryStart(PaneComponentEnum.GAME_LOG);
+  };
+
+  return (
+    <div className={clsx(styles.container)}>
+      <div
+        className={clsx(styles.campaignSummary)}
+        onClick={handleClick}
+        data-testid="campaign-summary"
+      >
+        <span className={clsx(styles.summaryLabel)}>Campaign:</span>
+        <span className={clsx(styles.summaryName)}>
+          {CampaignUtils.getName(campaign)}
+        </span>
+      </div>
+      <Tooltip title="Launch Game" isDarkMode={theme.isDarkMode}>
+        <Link
+          href={NavigationUtils.getLaunchGameUrl(campaign)}
+          target="maps"
+          aria-label="Launch Game"
+        >
+          <div className={clsx(styles.campaignButtonGroup)}>
+            <div className={clsx(styles.campaignButton)}>
+              <ThemedPlayButtonSvg
+                className={clsx([
+                  styles.campaignButtonIcon,
+                  styles.campaignPlayButtonIcon,
+                ])}
+                theme={theme}
+              />
+            </div>
+          </div>
+        </Link>
+      </Tooltip>
+      <GameLogNotificationWrapper
+        themeColor={theme.themeColor}
+        gameLogIsOpen={gameLog?.isOpen ?? false}
+        notificationOnClick={handleGameLogClick}
+      >
+        <Tooltip title="Game Log" isDarkMode={theme.isDarkMode}>
+          <div
+            role="button"
+            aria-roledescription="Game Log"
+            className={clsx(styles.campaignButtonGroup)}
+            onClick={handleGameLogClick}
+          >
+            <div className={clsx(styles.campaignButton)}>
+              <D6 className={clsx(styles.campaignButtonIcon)} />
+            </div>
+          </div>
+        </Tooltip>
+      </GameLogNotificationWrapper>
+    </div>
+  );
+};
+
+export default CampaignSummary;
diff --git a/ddb_main/tools/js/smartComponents/CharacterAvatar/CharacterAvatar.tsx b/ddb_main/tools/js/smartComponents/CharacterAvatar/CharacterAvatar.tsx
new file mode 100644
index 0000000..5d6fd41
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterAvatar/CharacterAvatar.tsx
@@ -0,0 +1,76 @@
+import * as React from "react";
+
+import { AvatarInfo } from "@dndbeyond/character-rules-engine/es";
+
+import CharacterAvatarPortrait from "./CharacterAvatarPortrait";
+
+interface Props {
+  avatarInfo: AvatarInfo;
+  className: string;
+}
+export default class CharacterAvatar extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { avatarInfo, className } = this.props;
+
+    const classNames: Array<string> = ["ddbc-character-avatar", className];
+    if (avatarInfo.frameId) {
+      classNames.push(`ddbc-character-avatar--${avatarInfo.frameId}`);
+    }
+    let animatedStyles: React.CSSProperties = {};
+    if (avatarInfo.frameAvatarDecorationKey) {
+      const [name, style, animationUrl] =
+        avatarInfo.frameAvatarDecorationKey.split("|");
+      name && classNames.push(`ddbc-character-avatar--${name}`);
+      style && classNames.push(`ddbc-character-avatar--${style}`);
+      if (animationUrl) {
+        classNames.push(`ddbc-character-avatar--animated`);
+        // NOTE: using the backround key for all of these did not work well so they are separated
+        animatedStyles = {
+          backgroundImage: `url(https://www.dndbeyond.com/attachments/${animationUrl}.png)`,
+          backgroundPositionX: "0px",
+          backgroundPositionY: "0px",
+          backgroundRepeat: "no-repeat",
+          backgroundSize: `1240px 1240px`,
+        };
+      }
+    }
+
+    let frameStyles: React.CSSProperties = {};
+    if (avatarInfo.frameUrl) {
+      frameStyles = {
+        backgroundImage: `url(${avatarInfo.frameUrl})`,
+      };
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <CharacterAvatarPortrait avatarUrl={avatarInfo.avatarUrl} />
+        {avatarInfo.frameId && (
+          <div className={"ddbc-character-avatar__frame"} style={frameStyles} />
+        )}
+        {avatarInfo.frameId && (
+          <div className={"ddbc-character-avatar__frame-extra1"}>
+            <div
+              className="ddbc-character-avatar__frame-extra-content ddbc-character-avatar__frame-extra1-content"
+              style={animatedStyles}
+            />
+          </div>
+        )}
+        {avatarInfo.frameId && (
+          <div className={"ddbc-character-avatar__frame-extra2"}>
+            <div className="ddbc-character-avatar__frame-extra-content ddbc-character-avatar__frame-extra2-content" />
+          </div>
+        )}
+        {avatarInfo.frameId && (
+          <div className={"ddbc-character-avatar__frame-extra3"}>
+            <div className="ddbc-character-avatar__frame-extra-content ddbc-character-avatar__frame-extra3-content" />
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/CharacterAvatar/CharacterAvatarPortrait/CharacterAvatarPortrait.tsx b/ddb_main/tools/js/smartComponents/CharacterAvatar/CharacterAvatarPortrait/CharacterAvatarPortrait.tsx
new file mode 100644
index 0000000..eacc9e8
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterAvatar/CharacterAvatarPortrait/CharacterAvatarPortrait.tsx
@@ -0,0 +1,42 @@
+import React, { HTMLAttributes } from "react";
+
+interface Props extends HTMLAttributes<HTMLDivElement | HTMLImageElement> {
+  className?: string;
+  avatarUrl: string | null;
+}
+
+const CharacterAvatarPortrait: React.FC<Props> = ({
+  className = "",
+  avatarUrl,
+  ...props
+}) => {
+  let portraitClasses: Array<string> = [
+    "ddbc-character-avatar__portrait",
+    className,
+  ];
+  let portraitStyles: React.CSSProperties = {};
+  if (avatarUrl) {
+    portraitStyles = {
+      backgroundImage: `url(${avatarUrl})`,
+    };
+  } else {
+    portraitClasses.push("ddbc-character-avatar__portrait--none");
+  }
+
+  return avatarUrl ? (
+    <img
+      className={portraitClasses.join(" ")}
+      src={avatarUrl}
+      alt="Character portrait"
+      {...props}
+    />
+  ) : (
+    <div
+      className={portraitClasses.join(" ")}
+      style={portraitStyles}
+      {...props}
+    />
+  );
+};
+
+export default CharacterAvatarPortrait;
diff --git a/ddb_main/tools/js/smartComponents/CharacterAvatar/CharacterAvatarPortrait/index.ts b/ddb_main/tools/js/smartComponents/CharacterAvatar/CharacterAvatarPortrait/index.ts
new file mode 100644
index 0000000..00281b0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterAvatar/CharacterAvatarPortrait/index.ts
@@ -0,0 +1,4 @@
+import CharacterAvatarPortrait from "./CharacterAvatarPortrait";
+
+export default CharacterAvatarPortrait;
+export { CharacterAvatarPortrait };
diff --git a/ddb_main/tools/js/smartComponents/CharacterAvatar/index.ts b/ddb_main/tools/js/smartComponents/CharacterAvatar/index.ts
new file mode 100644
index 0000000..ef6174e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterAvatar/index.ts
@@ -0,0 +1,5 @@
+import CharacterAvatar from "./CharacterAvatar";
+import CharacterAvatarPortrait from "./CharacterAvatarPortrait";
+
+export default CharacterAvatar;
+export { CharacterAvatar, CharacterAvatarPortrait };
diff --git a/ddb_main/tools/js/smartComponents/CharacterName/CharacterName.tsx b/ddb_main/tools/js/smartComponents/CharacterName/CharacterName.tsx
new file mode 100644
index 0000000..0cb9586
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterName/CharacterName.tsx
@@ -0,0 +1,40 @@
+import Typography from "@mui/material/Typography";
+
+import { DefaultCharacterName as DefaultName } from "~/constants";
+
+interface Props {
+  defaultCharacterName?: string;
+  isDead?: boolean;
+  isFaceMenu?: boolean;
+  name: string;
+}
+
+export default function CharacterName({
+  defaultCharacterName = DefaultName,
+  isDead = false,
+  isFaceMenu = false,
+  name,
+}: Props) {
+  let displayName: string = name ? name : defaultCharacterName;
+  if (isDead) {
+    displayName = `(Dead) ${displayName}`;
+  }
+
+  return (
+    <Typography
+      variant="h4"
+      component="h1"
+      style={{ fontFamily: "Roboto Condensed" }}
+      sx={{
+        textOverflow: "ellipsis",
+        whiteSpace: "nowrap",
+        overflow: "hidden",
+        fontSize: isFaceMenu ? "24px" : { xs: "18px", sm: "24px" },
+        lineHeight: 1.4,
+        letterSpacing: "normal",
+      }}
+    >
+      {displayName}
+    </Typography>
+  );
+}
diff --git a/ddb_main/tools/js/smartComponents/CharacterName/index.ts b/ddb_main/tools/js/smartComponents/CharacterName/index.ts
new file mode 100644
index 0000000..37b80d6
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterName/index.ts
@@ -0,0 +1,4 @@
+import CharacterName from "./CharacterName";
+
+export default CharacterName;
+export { CharacterName };
diff --git a/ddb_main/tools/js/smartComponents/CharacterProgressionSummary/CharacterProgressionSummary.tsx b/ddb_main/tools/js/smartComponents/CharacterProgressionSummary/CharacterProgressionSummary.tsx
new file mode 100644
index 0000000..9d4d558
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterProgressionSummary/CharacterProgressionSummary.tsx
@@ -0,0 +1,54 @@
+import * as React from "react";
+
+import {
+  Constants,
+  ExperienceInfo,
+  FormatUtils,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import XpBar from "../XpBar";
+
+interface Props {
+  className: string;
+  ruleData: RuleData;
+  xpInfo: ExperienceInfo;
+  progressionType: Constants.PreferenceProgressionTypeEnum;
+}
+export default class CharacterProgressionSummary extends React.PureComponent<
+  Props,
+  {}
+> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, ruleData, xpInfo, progressionType } = this.props;
+
+    const classNames: Array<string> = [
+      "ddbc-character-progression-summary",
+      className,
+    ];
+
+    return (
+      <div className={classNames.join(" ")}>
+        {progressionType ===
+          Constants.PreferenceProgressionTypeEnum.MILESTONE && (
+          <div className="ddbc-character-progression-summary__level">
+            Level {xpInfo.currentLevel}
+          </div>
+        )}
+        {progressionType === Constants.PreferenceProgressionTypeEnum.XP && (
+          <div className="ddbc-character-progression-summary__xp-bar">
+            <XpBar xp={xpInfo.currentLevelXp} ruleData={ruleData} />
+            <div className="ddbc-character-progression-summary__xp-data">
+              {FormatUtils.renderLocaleNumber(xpInfo.currentLevelXp)} /{" "}
+              {FormatUtils.renderLocaleNumber(xpInfo.nextLevelXp)} XP
+            </div>
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/CharacterProgressionSummary/index.ts b/ddb_main/tools/js/smartComponents/CharacterProgressionSummary/index.ts
new file mode 100644
index 0000000..07a866b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterProgressionSummary/index.ts
@@ -0,0 +1,4 @@
+import CharacterProgressionSummary from "./CharacterProgressionSummary";
+
+export default CharacterProgressionSummary;
+export { CharacterProgressionSummary };
diff --git a/ddb_main/tools/js/smartComponents/CharacterSettingsModal/CharacterSettingsModal.tsx b/ddb_main/tools/js/smartComponents/CharacterSettingsModal/CharacterSettingsModal.tsx
new file mode 100644
index 0000000..942f066
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterSettingsModal/CharacterSettingsModal.tsx
@@ -0,0 +1,356 @@
+import CloseIcon from "@mui/icons-material/Close";
+import SettingsOutlinedIcon from "@mui/icons-material/SettingsOutlined";
+import {
+  Box,
+  Checkbox,
+  FormControl,
+  FormControlLabel,
+  FormLabel,
+  Grid,
+  IconButton,
+  Modal,
+  Paper,
+  Stack,
+  ToggleButton,
+  ToggleButtonGroup,
+  Typography,
+} from "@mui/material";
+import clsx from "clsx";
+import { useContext } from "react";
+
+import { RuleDataUtils } from "@dndbeyond/character-rules-engine/es";
+
+import { SourceCategoryDescription } from "~/constants";
+import { useFeatureFlags } from "~/contexts/FeatureFlag";
+import { generateCharacterPreferences } from "~/helpers/generateCharacterPreferences";
+import PreferenceUpdateLocation from "~/tools/js/Shared/constants/PreferenceUpdateLocation";
+
+import {
+  CheckboxInfo,
+  FormCheckBoxesField,
+} from "../../Shared/components/common/FormCheckBoxesField";
+import AbilitySummary from "../AbilitySummary";
+import PrivacyTypeRadio from "../PrivacyTypeRadio";
+import { UserPreferenceContext } from "../UserPreference";
+import styles from "./styles.module.css";
+
+interface CharacterSettingsModalProps {
+  open: boolean;
+  updateLocation: PreferenceUpdateLocation;
+  handleClose: () => void;
+}
+
+const CharacterSettingsModal = ({
+  open,
+  updateLocation,
+  handleClose,
+}: CharacterSettingsModalProps) => {
+  const {
+    privacyType,
+    isDarkModeEnabled,
+    abilityScoreDisplayType,
+    updatePreferences,
+    ruleData,
+    defaultEnabledSourceCategories,
+    isHomebrewEnabled,
+  } = useContext(UserPreferenceContext);
+
+  const { featureFlags } = useFeatureFlags();
+
+  const preferences = generateCharacterPreferences(featureFlags);
+
+  const getTheme = (darkMode: boolean) => ({
+    name: "DDB Red",
+    backgroundColor: darkMode ? "#10161ADB" : "#FEFEFE",
+    isDefault: true,
+    themeColor: "#C53131",
+    themeColorId: null,
+    isDarkMode: darkMode || false,
+  });
+
+  const rollContext = {
+    entityId: "52962664",
+    entityType: "character",
+    name: "Stor Hornraven",
+    avatarUrl:
+      "https://stg.dndbeyond.com/avatars/18589/680/1581111423-52962664.jpeg?width=150&height=150&fit=crop&quality=95&auto=webp",
+  };
+
+  const handleSourceCategoryChange = (
+    sourceId: number,
+    isActive: boolean
+  ): void => {
+    const newSourceCategories = {
+      ...defaultEnabledSourceCategories,
+      [sourceId]: isActive,
+    };
+
+    updatePreferences({
+      privacyType,
+      isDarkModeEnabled,
+      abilityScoreDisplayType,
+      updateLocation,
+      defaultEnabledSourceCategories: newSourceCategories,
+      isHomebrewEnabled,
+    });
+  };
+
+  let sourceToggles: Array<CheckboxInfo> = [];
+  let partneredSourceCheckboxes: Array<CheckboxInfo> = [];
+  let allPartneredSources: Array<number> = [];
+
+  if (ruleData) {
+    const activeSourceCategories = Object.keys(defaultEnabledSourceCategories)
+      .filter((key) => defaultEnabledSourceCategories[key])
+      .map(Number);
+    RuleDataUtils.getSourceCategories(ruleData).forEach((sourceCategory) => {
+      if (!sourceCategory.isToggleable) {
+        return null;
+      }
+
+      const checkbox: CheckboxInfo = {
+        label: `${sourceCategory.name}`,
+        initiallyEnabled: activeSourceCategories.includes(sourceCategory.id),
+        onChange: handleSourceCategoryChange.bind(this, sourceCategory.id),
+        sortOrder: sourceCategory.sortOrder,
+        description: sourceCategory.description ?? "",
+      };
+
+      if (sourceCategory.isPartneredContent) {
+        delete checkbox.description;
+        partneredSourceCheckboxes.push(checkbox);
+        allPartneredSources.push(sourceCategory.id);
+      } else {
+        sourceToggles.push(checkbox);
+      }
+    });
+
+    //Add Homebrew to sources for display
+    sourceToggles.push({
+      label: "Homebrew",
+      initiallyEnabled: isHomebrewEnabled,
+      description: SourceCategoryDescription.homebrew,
+      onChange: (isActive: boolean) => {
+        updatePreferences({
+          privacyType,
+          isDarkModeEnabled,
+          abilityScoreDisplayType,
+          updateLocation,
+          defaultEnabledSourceCategories,
+          isHomebrewEnabled: isActive,
+        });
+      },
+
+      sortOrder: 0,
+    });
+  }
+
+  return (
+    <Modal
+      open={open}
+      onClose={handleClose}
+      className={clsx(styles.modal)}
+      aria-labelledby="modal-modal-title"
+      aria-describedby="modal-modal-description"
+    >
+      <Paper className={clsx(styles.content)}>
+        <Stack
+          direction="row"
+          alignItems="center"
+          style={{ padding: 16, borderBottom: "1px solid #A2ACB2" }}
+        >
+          <SettingsOutlinedIcon
+            style={{
+              color: "rgba(0,0,0,0.54)",
+              marginRight: 5,
+              height: 22,
+              width: 22,
+            }}
+          />
+          <label className={clsx(styles.modalTitle)}>
+            Default Character Settings
+          </label>
+          <IconButton
+            aria-label="close"
+            onClick={handleClose}
+            size="small"
+            style={{
+              marginLeft: "auto",
+              color: "rgba(0,0,0,0.54)",
+            }}
+          >
+            <CloseIcon style={{ width: 20 }} />
+          </IconButton>
+        </Stack>
+        <Box style={{ padding: 16 }}>
+          <label className={clsx(styles.modalDescription)}>
+            These settings apply defaults to all new Characters you create. Any
+            settings you apply to a specific Character will override the choices
+            you make here.
+          </label>
+
+          <>
+            <FormCheckBoxesField
+              heading="Sources"
+              description={SourceCategoryDescription.official}
+              checkboxes={sourceToggles}
+              showAccordion={false}
+            />
+
+            <FormCheckBoxesField
+              heading="Partnered Content"
+              description={SourceCategoryDescription.partnered}
+              checkboxes={partneredSourceCheckboxes}
+              checkUncheckAllEnabled={true}
+              showAccordion={false}
+              accordionHeading="Choose Partners"
+              allText="All"
+            />
+          </>
+
+          <PrivacyTypeRadio
+            color="info"
+            initialValue={privacyType}
+            handleChange={(e) =>
+              updatePreferences({
+                isDarkModeEnabled,
+                abilityScoreDisplayType,
+                updateLocation,
+                privacyType: parseInt(e.target.value),
+                defaultEnabledSourceCategories,
+                isHomebrewEnabled,
+              })
+            }
+          />
+          <p
+            style={{
+              color: "#000",
+              fontSize: 16,
+              fontWeight: 700,
+              letterSpacing: -0.5,
+              textTransform: "uppercase",
+              margin: "19px 0 0",
+              padding: "10px 0",
+            }}
+          >
+            Display
+          </p>
+          <Grid container>
+            <Grid item xs={12} md={8}>
+              <FormControl>
+                <FormControlLabel
+                  control={
+                    <Checkbox
+                      color="info"
+                      checked={isDarkModeEnabled}
+                      onChange={(e) =>
+                        updatePreferences({
+                          privacyType,
+                          abilityScoreDisplayType,
+                          updateLocation,
+                          isDarkModeEnabled: e.target.checked,
+                          defaultEnabledSourceCategories,
+                          isHomebrewEnabled,
+                        })
+                      }
+                      style={{ paddingTop: 0 }}
+                    />
+                  }
+                  label={
+                    <>
+                      <p style={{ margin: 0, fontSize: 14 }}>Underdark Mode</p>
+                      <Typography
+                        sx={{
+                          color: "grey.500",
+                          margin: 0,
+                          fontSize: 12,
+                          lineHeight: 1,
+                        }}
+                      >
+                        Activate dark mode for Character Sheets.
+                      </Typography>
+                    </>
+                  }
+                  sx={{ display: "flex", alignItems: "flex-start" }}
+                />
+              </FormControl>
+              <FormControl style={{ marginTop: 24 }}>
+                <FormLabel>
+                  <p style={{ margin: 0, fontSize: 14, color: "#000" }}>
+                    Ability Scores / Modifiers
+                  </p>
+                  <Typography
+                    sx={{
+                      color: "grey.500",
+                      margin: "0 0 16px",
+                      fontSize: 12,
+                      lineHeight: 1,
+                    }}
+                  >
+                    Reverse the display of Ability Scores and Modifiers.{" "}
+                  </Typography>
+                </FormLabel>
+                <FormControl>
+                  <ToggleButtonGroup
+                    color="info"
+                    value={abilityScoreDisplayType}
+                    exclusive
+                    onChange={(e, value) => {
+                      if (value !== null)
+                        updatePreferences({
+                          privacyType,
+                          isDarkModeEnabled,
+                          updateLocation,
+                          abilityScoreDisplayType: value,
+                          defaultEnabledSourceCategories,
+                          isHomebrewEnabled,
+                        });
+                    }}
+                    aria-label="Platform"
+                  >
+                    <ToggleButton value={2}>Modifiers Top</ToggleButton>
+                    <ToggleButton value={1}>Scores Top</ToggleButton>
+                  </ToggleButtonGroup>
+                </FormControl>
+              </FormControl>
+            </Grid>
+            <Grid
+              item
+              xs={12}
+              md={4}
+              display="flex"
+              alignItems="flex-start"
+              justifyContent="flex-end"
+            >
+              <Box
+                sx={{
+                  backgroundColor: "grey.50",
+                  border: "1px solid transparent",
+                  borderColor: "grey.200",
+                  borderRadius: 1,
+                  display: "inline-block",
+                  py: 1,
+                  px: 2,
+                }}
+              >
+                <p style={{ textAlign: "center", marginBottom: 4 }}>Preview</p>
+                <AbilitySummary
+                  ability={{ name: "Strength", score: 14, modifier: 2 }}
+                  preferences={{
+                    ...preferences,
+                    abilityScoreDisplayType: abilityScoreDisplayType,
+                  }}
+                  theme={getTheme(isDarkModeEnabled || false)}
+                  onClick={(e) => e.getBaseScore()}
+                  rollContext={rollContext}
+                />
+              </Box>
+            </Grid>
+          </Grid>
+        </Box>
+      </Paper>
+    </Modal>
+  );
+};
+
+export default CharacterSettingsModal;
diff --git a/ddb_main/tools/js/smartComponents/CharacterSettingsModal/index.ts b/ddb_main/tools/js/smartComponents/CharacterSettingsModal/index.ts
new file mode 100644
index 0000000..0883dfa
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterSettingsModal/index.ts
@@ -0,0 +1,4 @@
+import CharacterSettingsModal from "./CharacterSettingsModal";
+
+export default CharacterSettingsModal;
+export { CharacterSettingsModal };
diff --git a/ddb_main/tools/js/smartComponents/CharacterSummary/CharacterSummary.tsx b/ddb_main/tools/js/smartComponents/CharacterSummary/CharacterSummary.tsx
new file mode 100644
index 0000000..00a3587
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterSummary/CharacterSummary.tsx
@@ -0,0 +1,61 @@
+import * as React from "react";
+
+import {
+  CharClass,
+  ClassUtils,
+  Race,
+  RaceUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  classes: Array<CharClass> | null;
+  gender: string | null;
+  species: Race | null;
+  className: string;
+}
+export default class CharacterSummary extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    className: "",
+  };
+
+  renderClassList(): React.ReactNode {
+    const { classes } = this.props;
+
+    if (classes === null) {
+      return null;
+    }
+
+    const list: Array<string> = classes.map(
+      (charClass) =>
+        `${ClassUtils.getName(charClass)} ${ClassUtils.getLevel(charClass)}`
+    );
+    return (
+      <span className="ddbc-character-summary__classes">
+        {list.join(" / ")}
+      </span>
+    );
+  }
+
+  render() {
+    const { species, gender, className } = this.props;
+
+    const classNames: Array<string> = ["ddbc-character-summary", className];
+
+    let speciesNode: React.ReactNode;
+    if (species !== null) {
+      speciesNode = RaceUtils.getFullName(species);
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        {gender && (
+          <span className="ddbc-character-summary__gender">{gender}</span>
+        )}
+        {speciesNode && (
+          <span className="ddbc-character-summary__race">{speciesNode}</span>
+        )}
+        {this.renderClassList()}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/CharacterSummary/index.ts b/ddb_main/tools/js/smartComponents/CharacterSummary/index.ts
new file mode 100644
index 0000000..acea106
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterSummary/index.ts
@@ -0,0 +1,4 @@
+import CharacterSummary from "./CharacterSummary";
+
+export default CharacterSummary;
+export { CharacterSummary };
diff --git a/ddb_main/tools/js/smartComponents/CharacterTidbits/CharacterTidbits.tsx b/ddb_main/tools/js/smartComponents/CharacterTidbits/CharacterTidbits.tsx
new file mode 100644
index 0000000..d58cb5f
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CharacterTidbits/CharacterTidbits.tsx
@@ -0,0 +1,107 @@
+import * as React from "react";
+
+import {
+  CharacterPreferences,
+  CharClass,
+  Constants,
+  DecorationInfo,
+  DecorationUtils,
+  ExperienceInfo,
+  Race,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { DefaultCharacterName as DefaultName } from "~/constants";
+
+import CharacterAvatar from "../CharacterAvatar";
+import CharacterName from "../CharacterName";
+import CharacterProgressionSummary from "../CharacterProgressionSummary";
+import CharacterSummary from "../CharacterSummary";
+
+interface Props {
+  classes: Array<CharClass>;
+  name: string;
+  gender: string | null;
+  species: Race | null;
+  decorationInfo: DecorationInfo;
+  deathCause: Constants.DeathCauseEnum;
+  preferences: CharacterPreferences;
+  ruleData: RuleData;
+  xpInfo: ExperienceInfo;
+  isInteractive: boolean;
+  defaultCharacterName: string;
+  className: string;
+  calloutNode?: React.ReactNode;
+}
+export default class CharacterTidbits extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    deathCause: Constants.DeathCauseEnum.NONE,
+    isInteractive: true,
+    className: "",
+    defaultCharacterName: DefaultName,
+  };
+
+  render() {
+    const {
+      name,
+      classes,
+      gender,
+      species,
+      decorationInfo,
+      deathCause,
+      preferences,
+      ruleData,
+      xpInfo,
+      defaultCharacterName,
+      isInteractive,
+      className,
+      calloutNode,
+    } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-character-tidbits"];
+
+    if (isInteractive) {
+      classNames.push("ddbc-character-tidbits--is-interactive");
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ddbc-character-tidbits__avatar">
+          <CharacterAvatar
+            avatarInfo={DecorationUtils.getAvatarInfo(decorationInfo)}
+          />
+        </div>
+        <div className="ddbc-character-tidbits__body">
+          <div className="ddbc-character-tidbits__heading">
+            <CharacterName
+              name={name}
+              isDead={deathCause !== Constants.DeathCauseEnum.NONE}
+              defaultCharacterName={defaultCharacterName}
+            />
+            {isInteractive && calloutNode && (
+              <div className="ddbc-character-tidbits__menu-callout">
+                {calloutNode}
+              </div>
+            )}
+          </div>
+          <div className="ddbc-character-tidbits__meta">
+            <CharacterSummary
+              classes={classes}
+              species={species}
+              gender={gender}
+            />
+          </div>
+          {xpInfo && ruleData && (
+            <div className="ddbc-character-tidbits__progression">
+              <CharacterProgressionSummary
+                ruleData={ruleData}
+                progressionType={preferences.progressionType}
+                xpInfo={xpInfo}
+              />
+            </div>
+          )}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Checkbox/Checkbox.tsx b/ddb_main/tools/js/smartComponents/Checkbox/Checkbox.tsx
new file mode 100644
index 0000000..b3938a0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Checkbox/Checkbox.tsx
@@ -0,0 +1,160 @@
+import * as React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine";
+
+import { CharacterColorEnum } from "../../../../constants";
+import { PositiveCheckSvg, ThemedCheckSvg, CheckSvg } from "../Svg";
+
+interface Props {
+  className: string;
+  initiallyEnabled: boolean;
+  enabled?: boolean;
+  onChange?: (isEnabled: boolean) => void;
+  onChangePromise?: (
+    newIsEnabled: boolean,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  label?: string;
+  preventDefault: boolean;
+  stopPropagation: boolean;
+  isInteractive?: boolean;
+  theme?: CharacterTheme;
+  variant?: "primary" | "theme";
+}
+
+interface State {
+  enabled: boolean;
+}
+
+export default class Checkbox extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    isInteractive: true,
+    initiallyEnabled: false,
+    preventDefault: false,
+    stopPropagation: false,
+    className: "",
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      enabled:
+        typeof props.enabled !== "undefined"
+          ? props.enabled
+          : props.initiallyEnabled,
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { enabled, initiallyEnabled } = this.props;
+
+    if (
+      typeof enabled !== "undefined" ||
+      initiallyEnabled !== prevState.enabled
+    ) {
+      this.setState({
+        enabled: typeof enabled === "undefined" ? initiallyEnabled : enabled,
+      });
+    }
+  }
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onChangePromise, preventDefault, stopPropagation } = this.props;
+    const { enabled } = this.state;
+
+    const newValue: boolean = !enabled;
+
+    if (stopPropagation) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+    }
+
+    if (preventDefault) {
+      evt.preventDefault();
+    }
+
+    if (onChangePromise) {
+      onChangePromise(
+        newValue,
+        () => {
+          this.setEnabled();
+        },
+        () => {}
+      );
+    } else {
+      this.setEnabled();
+    }
+  };
+
+  setEnabled = (): void => {
+    const { onChange } = this.props;
+
+    this.setState((prevState) => {
+      let newValue = !prevState.enabled;
+
+      if (onChange) {
+        onChange(newValue);
+      }
+
+      return {
+        enabled: newValue,
+      };
+    });
+  };
+
+  render() {
+    const { enabled } = this.state;
+    const { label, className, isInteractive, theme, variant } = this.props;
+
+    const toggleConClasses: Array<string> = [
+      "ddbc-checkbox",
+      "character-checkbox",
+      className,
+    ];
+    if (enabled) {
+      toggleConClasses.push("ddbc-checkbox--is-enabled");
+      toggleConClasses.push("character-checkbox-enabled");
+    } else {
+      toggleConClasses.push("ddbc-checkbox--is-disabled");
+      toggleConClasses.push("character-checkbox-disabled");
+    }
+    if (isInteractive) {
+      toggleConClasses.push("ddbc-checkbox--is-interactive");
+      toggleConClasses.push("character-checkbox-interactive");
+    }
+
+    return (
+      <div
+        className={toggleConClasses.join(" ")}
+        onClick={isInteractive ? this.handleClick : undefined}
+        role="checkbox"
+        aria-checked={enabled}
+      >
+        <div className="ddbc-checkbox__input character-checkbox-input">
+          {enabled &&
+            (variant === "primary" ? (
+              <CheckSvg
+                fillColor={CharacterColorEnum.RED}
+                secondaryFillColor=""
+              />
+            ) : theme ? (
+              <ThemedCheckSvg theme={theme} />
+            ) : (
+              <PositiveCheckSvg />
+            ))}
+        </div>
+        {label && (
+          <div className="ddbc-checkbox__label character-checkbox-label">
+            {label}
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Checkbox/index.ts b/ddb_main/tools/js/smartComponents/Checkbox/index.ts
new file mode 100644
index 0000000..36de245
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Checkbox/index.ts
@@ -0,0 +1,4 @@
+import Checkbox from "./Checkbox";
+
+export default Checkbox;
+export { Checkbox };
diff --git a/ddb_main/tools/js/smartComponents/Collapsible/Collapsible.tsx b/ddb_main/tools/js/smartComponents/Collapsible/Collapsible.tsx
new file mode 100644
index 0000000..a6acbb0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Collapsible/Collapsible.tsx
@@ -0,0 +1,165 @@
+import * as React from "react";
+
+import {
+  DarkChevronUpSvg,
+  DisabledChevronDownSvg,
+  LightChevronUpSvg,
+} from "../Svg";
+import CollapsibleHeaderContent from "./CollapsibleHeaderContent";
+
+interface Props {
+  header: React.ReactNode;
+  headerFooter?: React.ReactNode;
+  className: string;
+  initiallyCollapsed: boolean;
+  collapsed?: boolean;
+  overrideCollapsed?: boolean;
+  onChangeHandler?: (isCollapsed: boolean) => void;
+  layoutType: "standard" | "minimal";
+  useBuilderStyles?: boolean;
+}
+
+interface State {
+  isCollapsed: boolean;
+  isDarkMode: boolean;
+}
+
+export class Collapsible extends React.PureComponent<Props, State> {
+  static defaultProps = {
+    initiallyCollapsed: true,
+    className: "",
+    layoutType: "standard",
+    useBuilderStyles: false,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    let initialCollapsed = props.initiallyCollapsed;
+    if (typeof props.collapsed !== "undefined") {
+      initialCollapsed = props.collapsed;
+    }
+
+    this.state = {
+      isCollapsed: initialCollapsed,
+      isDarkMode: false,
+    };
+  }
+
+  componentDidMount() {
+    this.setState({
+      isDarkMode: !!global.document.getElementsByClassName(
+        "ct-character-sheet--dark-mode"
+      ).length,
+    });
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { collapsed, overrideCollapsed } = this.props;
+
+    // Allow for the collapsed prop to set the state if the prop previously set the state
+    if (
+      typeof prevProps.collapsed !== "undefined" &&
+      typeof collapsed !== "undefined" &&
+      collapsed !== prevProps.collapsed
+    ) {
+      this.setState({
+        isCollapsed: collapsed,
+      });
+    }
+
+    // Allow the overrideCollapsed prop to set the state if the component previously set its own state
+    if (
+      typeof overrideCollapsed !== "undefined" &&
+      this.state.isCollapsed === prevState.isCollapsed
+    ) {
+      this.setState({
+        isCollapsed: overrideCollapsed,
+      });
+    }
+  }
+
+  handleClick = (evt: React.MouseEvent): void => {
+    evt.stopPropagation();
+    const { onChangeHandler } = this.props;
+
+    this.setState((prevState, preProps) => {
+      let newIsCollapsed = !prevState.isCollapsed;
+
+      if (onChangeHandler) {
+        onChangeHandler(newIsCollapsed);
+        return {
+          isCollapsed: prevState.isCollapsed,
+        };
+      } else {
+        return {
+          isCollapsed: newIsCollapsed,
+        };
+      }
+    });
+  };
+
+  render() {
+    const { isCollapsed, isDarkMode } = this.state;
+    const {
+      header,
+      className,
+      children,
+      headerFooter,
+      layoutType,
+      useBuilderStyles,
+    } = this.props;
+
+    let headerContentNode: React.ReactNode;
+    if (typeof header === "string") {
+      headerContentNode = <CollapsibleHeaderContent heading={header} />;
+    } else {
+      headerContentNode = header;
+    }
+
+    let classNames: Array<string> = ["ddbc-collapsible", className];
+    classNames.push(
+      isCollapsed ? "ddbc-collapsible--collapsed" : "ddbc-collapsible--opened"
+    );
+
+    switch (layoutType) {
+      case "minimal":
+        classNames.push("ddbc-collapsible--minimal");
+        break;
+
+      default:
+      // not implements
+    }
+
+    let chevronNode: React.ReactNode = <DisabledChevronDownSvg />;
+    if (!isCollapsed) {
+      chevronNode =
+        isDarkMode && !useBuilderStyles ? (
+          <LightChevronUpSvg />
+        ) : (
+          <DarkChevronUpSvg />
+        );
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ddbc-collapsible__header" onClick={this.handleClick}>
+          {headerContentNode}
+          <div className="ddbc-collapsible__header-status">{chevronNode}</div>
+        </div>
+        {headerFooter && (
+          <div className="ddbc-collapsible__header-footer">{headerFooter}</div>
+        )}
+        {!isCollapsed && (
+          <div className="ddbc-collapsible__content">{children}</div>
+        )}
+      </div>
+    );
+  }
+}
+
+export default Collapsible;
diff --git a/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderCallout/CollapsibleHeaderCallout.tsx b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderCallout/CollapsibleHeaderCallout.tsx
new file mode 100644
index 0000000..880ee65
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderCallout/CollapsibleHeaderCallout.tsx
@@ -0,0 +1,26 @@
+import * as React from "react";
+
+interface Props {
+  extra: React.ReactNode;
+  value: React.ReactNode;
+}
+
+export default class CollapsibleHeaderCallout extends React.PureComponent<
+  Props,
+  {}
+> {
+  static defaultProps = {
+    extra: null,
+  };
+
+  render() {
+    const { extra, value } = this.props;
+
+    return (
+      <span className="ddbc-collapsible__header-callout">
+        <span className="ddbc-collapsible__header-callout-extra">{extra}</span>
+        <span className="ddbc-collapsible__header-callout-value">{value}</span>
+      </span>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderCallout/index.ts b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderCallout/index.ts
new file mode 100644
index 0000000..56345ed
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderCallout/index.ts
@@ -0,0 +1,3 @@
+import CollapsibleHeaderCallout from "./CollapsibleHeaderCallout";
+
+export default CollapsibleHeaderCallout;
diff --git a/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderContent/CollapsibleHeaderContent.tsx b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderContent/CollapsibleHeaderContent.tsx
new file mode 100644
index 0000000..d4d94bf
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderContent/CollapsibleHeaderContent.tsx
@@ -0,0 +1,75 @@
+import * as React from "react";
+
+import CollapsibleHeaderCallout from "../CollapsibleHeaderCallout";
+import CollapsibleHeading from "../CollapsibleHeading";
+
+interface Props {
+  heading: React.ReactNode;
+  metaItems?: Array<React.ReactNode>;
+  callout?: React.ReactNode;
+  className: string;
+}
+
+export default class CollapsibleHeaderContent extends React.PureComponent<
+  Props,
+  {}
+> {
+  static defaultProps = {
+    className: "",
+  };
+
+  renderMetaItems(): React.ReactNode {
+    const { metaItems } = this.props;
+
+    if (!metaItems) {
+      return null;
+    }
+
+    return (
+      <div className="ddbc-collapsible__header-meta">
+        {metaItems.map((item, idx) => (
+          <span className="ddbc-collapsible__header-meta-item" key={idx}>
+            {item}
+          </span>
+        ))}
+      </div>
+    );
+  }
+
+  render() {
+    const { className, heading, callout } = this.props;
+
+    let headingNode: React.ReactNode;
+    if (typeof heading === "string") {
+      headingNode = <CollapsibleHeading>{heading}</CollapsibleHeading>;
+    } else {
+      headingNode = heading;
+    }
+
+    let calloutNode: React.ReactNode;
+    if (typeof callout === "string") {
+      calloutNode = <CollapsibleHeaderCallout value={callout} />;
+    } else {
+      calloutNode = callout;
+    }
+
+    let classNames: Array<string> = [
+      "ddbc-collapsible__header-content",
+      className,
+    ];
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ddbc-collapsible__header-content-primary">
+          {headingNode}
+          {this.renderMetaItems()}
+        </div>
+        {calloutNode && (
+          <div className="ddbc-collapsible__header-content-callout">
+            {calloutNode}
+          </div>
+        )}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderContent/index.ts b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderContent/index.ts
new file mode 100644
index 0000000..ac5069f
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeaderContent/index.ts
@@ -0,0 +1,3 @@
+import CollapsibleHeaderContent from "./CollapsibleHeaderContent";
+
+export default CollapsibleHeaderContent;
diff --git a/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeading/CollapsibleHeading.tsx b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeading/CollapsibleHeading.tsx
new file mode 100644
index 0000000..f4f9a8e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeading/CollapsibleHeading.tsx
@@ -0,0 +1,9 @@
+import * as React from "react";
+
+export default class CollapsibleHeading extends React.PureComponent<{}, {}> {
+  render() {
+    return (
+      <div className="ddbc-collapsible__heading">{this.props.children}</div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeading/index.ts b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeading/index.ts
new file mode 100644
index 0000000..e71267c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Collapsible/CollapsibleHeading/index.ts
@@ -0,0 +1,3 @@
+import CollapsibleHeading from "./CollapsibleHeading";
+
+export default CollapsibleHeading;
diff --git a/ddb_main/tools/js/smartComponents/Collapsible/index.ts b/ddb_main/tools/js/smartComponents/Collapsible/index.ts
new file mode 100644
index 0000000..4eb66ea
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Collapsible/index.ts
@@ -0,0 +1,12 @@
+import Collapsible from "./Collapsible";
+import CollapsibleHeaderCallout from "./CollapsibleHeaderCallout";
+import CollapsibleHeaderContent from "./CollapsibleHeaderContent";
+import CollapsibleHeading from "./CollapsibleHeading";
+
+export default Collapsible;
+export {
+  Collapsible,
+  CollapsibleHeading,
+  CollapsibleHeaderContent,
+  CollapsibleHeaderCallout,
+};
diff --git a/ddb_main/tools/js/smartComponents/CombatAttack/CombatActionAttack/CombatActionAttack.tsx b/ddb_main/tools/js/smartComponents/CombatAttack/CombatActionAttack/CombatActionAttack.tsx
new file mode 100644
index 0000000..dc70160
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CombatAttack/CombatActionAttack/CombatActionAttack.tsx
@@ -0,0 +1,473 @@
+import * as React from "react";
+import {
+  AbilityLookup,
+  Action,
+  ActionUtils,
+  Attack,
+  CharacterTheme,
+  Constants,
+  DiceUtils,
+  EntityUtils,
+  FormatUtils,
+  RuleData,
+  RuleDataUtils,
+} from "@dndbeyond/character-rules-engine/es";
+import {
+  Dice,
+  RollType,
+  DiceEvent,
+  RollKind,
+  IRollContext,
+} from "@dndbeyond/dice";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import ActionName from "../../ActionName";
+import { AttackTypeIcon } from "../../Icons";
+import NoteComponents from "../../NoteComponents";
+import { DiceComponentUtils } from "../../utils";
+import CombatAttack from "../CombatAttack";
+import { CombatActionAttackComponentRangeInfo } from "./CombatActionAttackTypings";
+import { DigitalDiceWrapper } from "../../Dice";
+import Damage from "../../Damage";
+
+interface Props {
+  attack: Attack;
+  action: Action;
+  onClick?: (attack: Attack) => void;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  showNotes: boolean;
+  className: string;
+  diceEnabled: boolean;
+  theme: CharacterTheme;
+  rollContext: IRollContext;
+  proficiencyBonus: number;
+}
+
+interface State {
+  isCriticalHit: boolean;
+}
+class CombatActionAttack extends React.PureComponent<Props, State> {
+  diceEventHandler: (eventData: any) => void;
+
+  static defaultProps = {
+    showNotes: true,
+    className: "",
+    diceEnabled: false,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      isCriticalHit: false,
+    };
+  }
+
+  componentDidMount = () => {
+    this.diceEventHandler = DiceComponentUtils.setupResetCritStateOnRoll(
+      ActionUtils.getName(this.props.attack.data as Action),
+      this
+    );
+  };
+
+  componentWillUnmount = () => {
+    Dice.removeEventListener(DiceEvent.ROLL, this.diceEventHandler);
+  };
+
+  handleClick = (): void => {
+    const { onClick, attack } = this.props;
+
+    if (onClick) {
+      onClick(attack);
+    }
+  };
+
+  handleRoll = (wasCrit: boolean) => {
+    this.setState({ isCriticalHit: wasCrit });
+  };
+
+  getRangeInfo = (): CombatActionAttackComponentRangeInfo => {
+    const { action, ruleData, theme } = this.props;
+
+    const attackRange = ActionUtils.getRange(action);
+    const attackReach = ActionUtils.getReach(action);
+    const attackTypeId = ActionUtils.getAttackRangeId(action);
+
+    let rangeValueNode: React.ReactNode;
+    let rangeLabel: string = "Range";
+
+    switch (ActionUtils.getActionTypeId(action)) {
+      case Constants.ActionTypeEnum.WEAPON:
+        if (
+          attackRange !== null &&
+          attackTypeId === Constants.AttackTypeRangeEnum.RANGED
+        ) {
+          let { longRange, range } = attackRange;
+
+          if (longRange) {
+            rangeValueNode = (
+              <React.Fragment>
+                <span
+                  className={`ddbc-combat-attack__range-value-close ${
+                    theme.isDarkMode
+                      ? "ddbc-combat-attack__range-value-close--dark-mode"
+                      : ""
+                  }`}
+                >
+                  {range}
+                </span>
+                <span
+                  className={`ddbc-combat-attack__range-value-long ${
+                    theme.isDarkMode
+                      ? "ddbc-combat-attack__range-value-long--dark-mode"
+                      : ""
+                  }`}
+                >
+                  ({longRange})
+                </span>
+              </React.Fragment>
+            );
+            rangeLabel = "";
+          } else {
+            rangeValueNode = (
+              <NumberDisplay type="distanceInFt" number={range} />
+            );
+            rangeLabel = "Range";
+          }
+        } else if (attackReach !== null) {
+          rangeValueNode = (
+            <NumberDisplay type="distanceInFt" number={attackReach} />
+          );
+          rangeLabel = "Reach";
+        }
+        break;
+
+      case Constants.ActionTypeEnum.SPELL:
+        if (attackRange !== null) {
+          if (
+            attackRange.origin &&
+            attackRange.origin !== Constants.SpellRangeTypeEnum.RANGED
+          ) {
+            let spellRangeType = RuleDataUtils.getSpellRangeType(
+              attackRange.origin,
+              ruleData
+            );
+            if (spellRangeType) {
+              rangeValueNode = spellRangeType.name;
+            }
+          }
+          if (attackRange.range) {
+            rangeValueNode = (
+              <NumberDisplay type="distanceInFt" number={attackRange.range} />
+            );
+          }
+        }
+
+        rangeLabel = "";
+        if (attackTypeId === Constants.AttackTypeRangeEnum.MELEE) {
+          rangeLabel = "Reach";
+        }
+        break;
+
+      case Constants.ActionTypeEnum.GENERAL:
+        if (attackRange !== null && attackRange.range) {
+          rangeValueNode = (
+            <NumberDisplay type="distanceInFt" number={attackRange.range} />
+          );
+        }
+        if (
+          attackReach !== null &&
+          attackTypeId === Constants.AttackTypeRangeEnum.MELEE
+        ) {
+          rangeValueNode = (
+            <NumberDisplay type="distanceInFt" number={attackReach} />
+          );
+          rangeLabel = "Reach";
+        }
+        break;
+
+      default:
+      // not implemented
+    }
+
+    return {
+      rangeValueNode,
+      rangeLabel,
+    };
+  };
+
+  getClassName = (): string => {
+    const { action } = this.props;
+
+    let type: string = "";
+    switch (ActionUtils.getActionTypeId(action)) {
+      case Constants.ActionTypeEnum.WEAPON:
+        type = "weapon";
+        break;
+
+      case Constants.ActionTypeEnum.SPELL:
+        type = "spell";
+        break;
+
+      case Constants.ActionTypeEnum.GENERAL:
+        type = "general";
+        break;
+    }
+
+    return FormatUtils.slugify(`ddbc-combat-action-attack--${type}`);
+  };
+
+  getIconKey = (): string => {
+    const { action } = this.props;
+
+    const attackTypeId = ActionUtils.getAttackRangeId(action);
+    let attackType: string = "";
+    if (attackTypeId) {
+      attackType = RuleDataUtils.getAttackTypeRangeName(attackTypeId);
+    }
+
+    let type: string = "";
+    let iconType: string = RuleDataUtils.getAttackTypeRangeName(
+      Constants.AttackTypeRangeEnum.MELEE
+    );
+
+    switch (ActionUtils.getActionTypeId(action)) {
+      case Constants.ActionTypeEnum.WEAPON:
+        type = "weapon";
+        iconType = attackType;
+        break;
+
+      case Constants.ActionTypeEnum.SPELL:
+        type = "spell";
+        if (attackType) {
+          iconType = attackType;
+        }
+        break;
+
+      case Constants.ActionTypeEnum.GENERAL:
+        type = "general";
+        if (attackType) {
+          iconType = attackType;
+        }
+        break;
+
+      default:
+      //not implemented
+    }
+
+    return FormatUtils.slugify(`action-attack-${type}-${iconType}`);
+  };
+
+  getIconNode = (): React.ReactNode => {
+    const { action, theme } = this.props;
+
+    let rangeType: Constants.AttackTypeRangeEnum =
+      ActionUtils.getAttackRangeId(action) ??
+      Constants.AttackTypeRangeEnum.MELEE;
+
+    //this sucks, but have to switch these around because of how unarmed strike is currently a weapon type
+    //and most others that come thru here are custom actions
+    let actionTypeId = ActionUtils.getActionTypeId(action);
+    let actionType: Constants.ActionTypeEnum | null = actionTypeId;
+    switch (actionTypeId) {
+      case Constants.ActionTypeEnum.WEAPON:
+        if (rangeType === Constants.AttackTypeRangeEnum.MELEE) {
+          actionType = Constants.ActionTypeEnum.GENERAL;
+        }
+        break;
+
+      case Constants.ActionTypeEnum.GENERAL:
+        if (rangeType === Constants.AttackTypeRangeEnum.MELEE) {
+          actionType = Constants.ActionTypeEnum.WEAPON;
+        }
+        break;
+      case Constants.ActionTypeEnum.SPELL:
+        break;
+
+      default:
+      //not implemented
+    }
+
+    return (
+      <AttackTypeIcon
+        actionType={actionType}
+        rangeType={rangeType}
+        themeMode={theme.isDarkMode ? "gray" : "dark"}
+        className={`ddbc-combat-attack__icon-img--${this.getIconKey()}`}
+      />
+    );
+  };
+
+  getMetaItems = (): Array<string> => {
+    const { action } = this.props;
+
+    const damage = ActionUtils.getDamage(action);
+    const attackTypeId = ActionUtils.getAttackRangeId(action);
+    let attackType: string | null = null;
+    if (attackTypeId) {
+      attackType = RuleDataUtils.getAttackTypeRangeName(attackTypeId);
+    }
+    const isOffhand = ActionUtils.isOffhand(action);
+
+    let combinedMetaItems: Array<string> = [];
+    if (attackType) {
+      combinedMetaItems.push(`${attackType} Attack`);
+    }
+    if (damage.isMartialArts) {
+      combinedMetaItems.push("Martial Arts");
+    }
+    if (damage.value && damage.dataOrigin) {
+      combinedMetaItems.push(EntityUtils.getDataOriginName(damage.dataOrigin));
+    }
+
+    switch (ActionUtils.getActionTypeId(action)) {
+      case Constants.ActionTypeEnum.WEAPON:
+        if (isOffhand) {
+          combinedMetaItems.push("Dual Wield");
+        }
+        break;
+
+      default:
+      // not implemented
+    }
+
+    if (ActionUtils.isCustomized(action)) {
+      combinedMetaItems.push("Customized");
+    }
+
+    return combinedMetaItems;
+  };
+
+  renderNotes = (): React.ReactNode => {
+    const {
+      action,
+      showNotes,
+      ruleData,
+      abilityLookup,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    if (!showNotes) {
+      return null;
+    }
+
+    return (
+      <div className="ddbc-combat-action-attack__notes">
+        <NoteComponents
+          notes={ActionUtils.getNoteComponents(
+            action,
+            ruleData,
+            abilityLookup,
+            proficiencyBonus
+          )}
+          theme={theme}
+        />
+      </div>
+    );
+  };
+
+  render() {
+    const {
+      action,
+      attack,
+      ruleData,
+      showNotes,
+      className,
+      diceEnabled,
+      theme,
+      rollContext,
+    } = this.props;
+
+    const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+      this.context;
+
+    const { isCriticalHit } = this.state;
+
+    const proficiency = ActionUtils.isProficient(action);
+    const damage = ActionUtils.getDamage(action);
+    let rangeInfo = this.getRangeInfo();
+
+    let toHit: number | null = null;
+    let attackSaveValue: number | null = null;
+    let attackSaveLabel: React.ReactNode = "";
+    if (ActionUtils.requiresAttackRoll(action)) {
+      toHit = ActionUtils.getToHit(action);
+    } else if (ActionUtils.requiresSavingThrow(action)) {
+      let saveStatId = ActionUtils.getSaveStatId(action);
+      if (saveStatId) {
+        attackSaveLabel = RuleDataUtils.getStatNameById(saveStatId, ruleData);
+      }
+      attackSaveValue = ActionUtils.getAttackSaveValue(action);
+    }
+
+    let damageNode: React.ReactNode;
+    if (damage.value !== null) {
+      damageNode = (
+        <DigitalDiceWrapper
+          diceNotation={
+            typeof damage.value === "number"
+              ? damage.value.toString()
+              : DiceUtils.renderDice(damage.value)
+          }
+          rollType={RollType.Damage}
+          rollAction={ActionUtils.getName(attack.data as Action)}
+          rollKind={isCriticalHit ? RollKind.CriticalHit : RollKind.None}
+          diceEnabled={diceEnabled}
+          themeColor={theme.themeColor}
+          rollContext={rollContext}
+          rollTargetOptions={
+            messageTargetOptions
+              ? Object.values(messageTargetOptions?.entities)
+              : undefined
+          }
+          rollTargetDefault={defaultMessageTargetOption}
+          userId={userId}
+        >
+          <Damage
+            type={damage.type ? damage.type.name : null}
+            damage={DiceComponentUtils.getDamageDiceNotation(
+              damage.value,
+              isCriticalHit
+            )}
+            theme={theme}
+          />
+        </DigitalDiceWrapper>
+      );
+    }
+
+    let classNames: Array<string> = [className, this.getClassName()];
+
+    if (isCriticalHit) {
+      classNames.push("ddbc-combat-attack--crit");
+    }
+    return (
+      <CombatAttack
+        attack={attack}
+        className={classNames.join(" ")}
+        icon={this.getIconNode()}
+        name={<ActionName theme={theme} action={action} />}
+        metaItems={this.getMetaItems()}
+        rangeValue={rangeInfo.rangeValueNode}
+        rangeLabel={rangeInfo.rangeLabel}
+        isProficient={proficiency}
+        toHit={toHit}
+        attackSaveLabel={attackSaveLabel}
+        attackSaveValue={attackSaveValue}
+        damage={damageNode}
+        onClick={this.handleClick}
+        notes={this.renderNotes()}
+        showNotes={showNotes}
+        diceEnabled={diceEnabled}
+        onRoll={this.handleRoll}
+        theme={theme}
+        rollContext={rollContext}
+      />
+    );
+  }
+}
+
+CombatActionAttack.contextType = GameLogContext;
+
+export default CombatActionAttack;
diff --git a/ddb_main/tools/js/smartComponents/CombatAttack/CombatActionAttack/index.ts b/ddb_main/tools/js/smartComponents/CombatAttack/CombatActionAttack/index.ts
new file mode 100644
index 0000000..7f9be52
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CombatAttack/CombatActionAttack/index.ts
@@ -0,0 +1,4 @@
+import CombatActionAttack from "./CombatActionAttack";
+
+export default CombatActionAttack;
+export { CombatActionAttack };
diff --git a/ddb_main/tools/js/smartComponents/CombatAttack/CombatAttack.tsx b/ddb_main/tools/js/smartComponents/CombatAttack/CombatAttack.tsx
new file mode 100644
index 0000000..f30f49b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CombatAttack/CombatAttack.tsx
@@ -0,0 +1,250 @@
+import * as React from "react";
+import {
+  Action,
+  ActionUtils,
+  Attack,
+  CharacterTheme,
+  Item,
+  ItemUtils,
+  Spell,
+  SpellUtils,
+} from "@dndbeyond/character-rules-engine/es";
+import { AttackSourceTypeEnum } from "@dndbeyond/character-rules-engine/es/engine/Character";
+import {
+  DiceTools,
+  RollType,
+  RollRequest,
+  IRollContext,
+} from "@dndbeyond/dice";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+import { DiceComponentUtils } from "../utils";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { DigitalDiceWrapper } from "../Dice";
+
+interface Props {
+  attack: Attack;
+  className: string;
+  icon: React.ReactNode;
+  name: React.ReactNode;
+  metaItems: Array<string>;
+  rangeValue: React.ReactNode;
+  rangeLabel: React.ReactNode;
+  isProficient: boolean;
+  toHit: number | null;
+  attackSaveValue?: number | null;
+  attackSaveLabel?: React.ReactNode;
+  damage: React.ReactNode;
+  notes?: React.ReactNode;
+  theme: CharacterTheme;
+  rollContext: IRollContext;
+  onClick?: (attack: Attack) => void;
+
+  showNotes: boolean;
+  diceEnabled: boolean;
+  onRoll?: (wasCrit: boolean) => void;
+}
+
+class CombatAttack extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    rangeLabel: "Reach",
+    damage: "--",
+    className: "",
+    showNotes: true,
+    isProficient: false,
+    diceEnabled: false,
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick, attack } = this.props;
+
+    if (onClick) {
+      evt.nativeEvent.stopImmediatePropagation();
+      evt.stopPropagation();
+
+      onClick(attack);
+    }
+  };
+
+  handleRollResults = (result: RollRequest) => {
+    const { onRoll } = this.props;
+
+    let wasCrit = DiceComponentUtils.isCriticalRoll(result);
+    if (onRoll) {
+      onRoll(wasCrit);
+    }
+  };
+
+  render() {
+    const {
+      icon,
+      name,
+      metaItems,
+      rangeLabel,
+      rangeValue,
+      toHit,
+      attackSaveValue,
+      attackSaveLabel,
+      damage,
+      notes,
+      className,
+      showNotes,
+      diceEnabled,
+      attack,
+      theme,
+      rollContext,
+    } = this.props;
+
+    const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+      this.context;
+
+    let actionNode: React.ReactNode = null;
+    if (toHit !== null) {
+      let rollAction: string;
+      switch (attack.type) {
+        case AttackSourceTypeEnum.ACTION:
+        case AttackSourceTypeEnum.CUSTOM:
+          rollAction = ActionUtils.getName(attack.data as Action);
+          break;
+        case AttackSourceTypeEnum.ITEM:
+          rollAction = ItemUtils.getName(attack.data as Item);
+          break;
+        case AttackSourceTypeEnum.SPELL:
+          rollAction = SpellUtils.getName(attack.data as Spell);
+          break;
+      }
+
+      actionNode = (
+        <div className="ddbc-combat-attack__tohit">
+          <DigitalDiceWrapper
+            diceNotation={DiceTools.CustomD20(toHit)}
+            rollType={RollType.ToHit}
+            rollAction={rollAction}
+            diceEnabled={diceEnabled}
+            onRollResults={this.handleRollResults}
+            themeColor={theme.themeColor}
+            rollContext={rollContext}
+            rollTargetOptions={
+              messageTargetOptions
+                ? Object.values(messageTargetOptions?.entities)
+                : undefined
+            }
+            rollTargetDefault={defaultMessageTargetOption}
+            userId={userId}
+          >
+            <NumberDisplay
+              number={toHit}
+              type="signed"
+              isModified={false}
+            />
+          </DigitalDiceWrapper>
+        </div>
+      );
+    } else if (attackSaveValue !== null) {
+      actionNode = (
+        <div className="ddbc-combat-attack__save">
+          <span
+            className={`ddbc-combat-attack__save-value ${
+              theme.isDarkMode
+                ? "ddbc-combat-attack__save-value--dark-mode"
+                : ""
+            }`}
+          >
+            {attackSaveValue}
+          </span>
+          <span
+            className={`ddbc-combat-attack__save-label ${
+              theme.isDarkMode
+                ? "ddbc-combat-attack__save-label--dark-mode"
+                : ""
+            }`}
+          >
+            {attackSaveLabel}
+          </span>
+        </div>
+      );
+    }
+
+    let classNames: Array<string> = [className, "ddbc-combat-attack"];
+
+    return (
+      <div
+        className={classNames.join(" ")}
+        style={
+          theme?.isDarkMode
+            ? { borderColor: `${theme.themeColor}66` }
+            : undefined
+        }
+        onClick={this.handleClick}
+      >
+        <div className="ddbc-combat-attack__icon">{icon}</div>
+        <div className="ddbc-combat-attack__name">
+          <div
+            className={`ddbc-combat-attack__label ${
+              theme.isDarkMode ? "ddbc-combat-attack__label--dark-mode" : ""
+            }`}
+          >
+            {name}
+          </div>
+          {metaItems.length > 0 && (
+            <div
+              className={`ddbc-combat-attack__meta ${
+                theme.isDarkMode ? "ddbc-combat-attack__meta--dark-mode" : ""
+              }`}
+            >
+              {metaItems.map((metaItem, idx) => (
+                <span className="ddbc-combat-attack__meta-item" key={idx}>
+                  {metaItem}
+                </span>
+              ))}
+            </div>
+          )}
+        </div>
+        <div className="ddbc-combat-attack__range">
+          <div
+            className={`ddbc-combat-attack__range-value ${
+              theme.isDarkMode
+                ? "ddbc-combat-attack__range-value--dark-mode"
+                : ""
+            }`}
+          >
+            {rangeValue ? (
+              rangeValue
+            ) : (
+              <span className="ddbc-combat-attack__empty">--</span>
+            )}
+          </div>
+          <div
+            className={`ddbc-combat-attack__range-label ${
+              theme.isDarkMode
+                ? "ddbc-combat-attack__range-label--dark-mode"
+                : ""
+            }`}
+          >
+            {rangeLabel}
+          </div>
+        </div>
+        <div className="ddbc-combat-attack__action">
+          {actionNode ? (
+            actionNode
+          ) : (
+            <span className="ddbc-combat-attack__empty">--</span>
+          )}
+        </div>
+        <div className="ddbc-combat-attack__damage">{damage}</div>
+        {showNotes && (
+          <div
+            className={`ddbc-combat-attack__notes ${
+              theme.isDarkMode ? "ddbc-combat-attack__notes--dark-mode" : ""
+            }`}
+          >
+            {notes}
+          </div>
+        )}
+      </div>
+    );
+  }
+}
+
+CombatAttack.contextType = GameLogContext;
+
+export default CombatAttack;
diff --git a/ddb_main/tools/js/smartComponents/CombatAttack/CombatItemAttack/CombatItemAttack.tsx b/ddb_main/tools/js/smartComponents/CombatAttack/CombatItemAttack/CombatItemAttack.tsx
new file mode 100644
index 0000000..03a3b52
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CombatAttack/CombatItemAttack/CombatItemAttack.tsx
@@ -0,0 +1,379 @@
+import * as React from "react";
+import {
+  AbilityLookup,
+  Attack,
+  CharacterTheme,
+  Constants,
+  DiceUtils,
+  FormatUtils,
+  Item,
+  ItemUtils,
+  RuleData,
+  RuleDataUtils,
+  WeaponSpellDamageGroup,
+} from "@dndbeyond/character-rules-engine/es";
+import {
+  Dice,
+  RollType,
+  DiceEvent,
+  RollKind,
+  IRollContext,
+} from "@dndbeyond/dice";
+import StarIcon from "@dndbeyond/fontawesome-cache/svgs/solid/star.svg";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+import { ItemName } from "~/components/ItemName";
+import { NumberDisplay } from "~/components/NumberDisplay";
+import Tooltip from "~/tools/js/commonComponents/Tooltip";
+import { AttackTypeIcon } from "../../Icons";
+import NoteComponents from "../../NoteComponents";
+import { DiceComponentUtils } from "../../utils";
+import CombatAttack from "../CombatAttack";
+import { DigitalDiceWrapper } from "../../Dice";
+import Damage from "../../Damage";
+
+interface Props {
+  attack: Attack;
+  item: Item;
+  weaponSpellDamageGroups: Array<WeaponSpellDamageGroup>;
+  onClick?: (attack: Attack) => void;
+  abilityLookup: AbilityLookup;
+  ruleData: RuleData;
+  showNotes: boolean;
+  className: string;
+  diceEnabled: boolean;
+  theme: CharacterTheme;
+  rollContext: IRollContext;
+  proficiencyBonus: number;
+}
+
+interface State {
+  isCriticalHit: boolean;
+}
+class CombatItemAttack extends React.PureComponent<Props, State> {
+  diceEventHandler: (eventData: any) => void;
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      isCriticalHit: false,
+    };
+  }
+
+  static defaultProps = {
+    showNotes: true,
+    className: "",
+    diceEnabled: false,
+  };
+
+  componentDidMount = () => {
+    this.diceEventHandler = DiceComponentUtils.setupResetCritStateOnRoll(
+      ItemUtils.getName(this.props.attack.data as Item),
+      this
+    );
+  };
+
+  componentWillUnmount = () => {
+    Dice.removeEventListener(DiceEvent.ROLL, this.diceEventHandler);
+  };
+
+  handleClick = (): void => {
+    const { onClick, attack } = this.props;
+
+    if (onClick) {
+      onClick(attack);
+    }
+  };
+
+  renderNotes = (): React.ReactNode => {
+    const {
+      item,
+      weaponSpellDamageGroups,
+      ruleData,
+      abilityLookup,
+      showNotes,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    if (!showNotes) {
+      return null;
+    }
+
+    return (
+      <div className="ddbc-combat-item-attack__notes">
+        <NoteComponents
+          notes={ItemUtils.getNoteComponents(
+            item,
+            weaponSpellDamageGroups,
+            ruleData,
+            abilityLookup,
+            proficiencyBonus
+          )}
+          theme={theme}
+        />
+      </div>
+    );
+  };
+
+  handleRoll = (wasCrit: boolean) => {
+    this.setState({ isCriticalHit: wasCrit });
+  };
+
+  render() {
+    const {
+      attack,
+      item,
+      weaponSpellDamageGroups,
+      showNotes,
+      diceEnabled,
+      theme,
+      rollContext,
+      className,
+    } = this.props;
+
+    const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+      this.context;
+
+    const { isCriticalHit } = this.state;
+
+    const toHit = ItemUtils.getToHit(item);
+    const proficiency = ItemUtils.hasProficiency(item);
+    const metaItems = ItemUtils.getMetaItems(item);
+    const type = ItemUtils.getType(item);
+    const damage = ItemUtils.getDamage(item);
+    const damageType = ItemUtils.getDamageType(item);
+    const attackType = ItemUtils.getAttackType(item);
+    let attackTypeName: string = "";
+    if (attackType) {
+      attackTypeName = RuleDataUtils.getAttackTypeRangeName(attackType);
+    }
+    const versatileDamage = ItemUtils.getVersatileDamage(item);
+    const reach = ItemUtils.getReach(item);
+    const range = ItemUtils.getRange(item);
+    const longRange = ItemUtils.getLongRange(item);
+    const isHexWeapon = ItemUtils.isHexWeapon(item);
+    const isPactWeapon = ItemUtils.isPactWeapon(item);
+    const isDedicatedWeapon = ItemUtils.isDedicatedWeapon(item);
+    const isLegacy = ItemUtils.isLegacy(item);
+
+    let combinedMetaItems: Array<string> = [];
+
+    if (isLegacy) {
+      combinedMetaItems.push("Legacy");
+    }
+    if (type === Constants.WeaponTypeEnum.AMMUNITION) {
+      combinedMetaItems.push("Ammunition");
+    } else {
+      if (isHexWeapon || isPactWeapon || isDedicatedWeapon) {
+        if (isHexWeapon) {
+          combinedMetaItems.push("Hex Weapon");
+        }
+        if (isPactWeapon) {
+          combinedMetaItems.push("Pact Weapon");
+        }
+        if (isDedicatedWeapon) {
+          combinedMetaItems.push("Dedicated Weapon");
+        }
+      } else {
+        combinedMetaItems.push(`${attackTypeName} Weapon`);
+      }
+    }
+    if (ItemUtils.isOffhand(item)) {
+      combinedMetaItems.push("Dual Wield");
+    }
+    if (ItemUtils.isAdamantine(item)) {
+      combinedMetaItems.push("Adamantine");
+    }
+    if (ItemUtils.isSilvered(item)) {
+      combinedMetaItems.push("Silvered");
+    }
+    if (ItemUtils.isCustomized(item)) {
+      combinedMetaItems.push("Customized");
+    }
+    if (ItemUtils.getMasteryName(item)) {
+      combinedMetaItems.push("Mastery");
+    }
+    combinedMetaItems = [...combinedMetaItems, ...metaItems];
+
+    let versatileDamageNode: React.ReactNode;
+    if (versatileDamage) {
+      versatileDamageNode = (
+        <DigitalDiceWrapper
+          diceNotation={DiceUtils.renderDice(versatileDamage)}
+          rollType={RollType.Damage}
+          rollAction={ItemUtils.getName(attack.data as Item)}
+          rollKind={isCriticalHit ? RollKind.CriticalHit : RollKind.None}
+          diceEnabled={diceEnabled}
+          themeColor={theme.themeColor}
+          rollContext={rollContext}
+          rollTargetOptions={
+            messageTargetOptions
+              ? Object.values(messageTargetOptions?.entities)
+              : undefined
+          }
+          rollTargetDefault={defaultMessageTargetOption}
+          userId={userId}
+        >
+          <Damage
+            damage={DiceComponentUtils.getDamageDiceNotation(
+              versatileDamage,
+              isCriticalHit
+            )}
+            type={damageType}
+            theme={theme}
+            isVersatile={true}
+          />
+        </DigitalDiceWrapper>
+      );
+    }
+    let classNames: Array<string> = ["ddbc-combat-item-attack__damage"];
+    if (versatileDamage) {
+      classNames.push("ddb-combat-item-attack__damage--is-versatile");
+    }
+
+    let damageNode: React.ReactNode;
+    if (damage === null) {
+      damageNode = null;
+    } else {
+      damageNode = (
+        <DigitalDiceWrapper
+          diceNotation={
+            typeof damage === "number"
+              ? damage.toString()
+              : DiceUtils.renderDice(damage)
+          }
+          rollType={RollType.Damage}
+          rollAction={ItemUtils.getName(attack.data as Item)}
+          rollKind={isCriticalHit ? RollKind.CriticalHit : RollKind.None}
+          diceEnabled={diceEnabled}
+          themeColor={theme.themeColor}
+          rollContext={rollContext}
+          rollTargetOptions={
+            messageTargetOptions
+              ? Object.values(messageTargetOptions?.entities)
+              : undefined
+          }
+          rollTargetDefault={defaultMessageTargetOption}
+          userId={userId}
+        >
+          <Damage
+            damage={DiceComponentUtils.getDamageDiceNotation(
+              damage,
+              isCriticalHit
+            )}
+            type={damageType}
+            theme={theme}
+          />
+        </DigitalDiceWrapper>
+      );
+    }
+
+    let damageDisplayNode: React.ReactNode = (
+      <div className={classNames.join(" ")}>
+        {damageNode}
+        {versatileDamageNode}
+      </div>
+    );
+
+    const showRange: boolean =
+      attackType === Constants.AttackTypeRangeEnum.RANGED ||
+      ItemUtils.hasWeaponProperty(item, Constants.WeaponPropertyEnum.THROWN) ||
+      ItemUtils.hasWeaponProperty(item, Constants.WeaponPropertyEnum.RANGE);
+
+    let rangeValue: React.ReactNode;
+    let rangeLabel: React.ReactNode;
+    if (showRange) {
+      rangeValue = (
+        <React.Fragment>
+          <span
+            className={`ddbc-combat-attack__range-value-close ${
+              theme.isDarkMode
+                ? "ddbc-combat-attack__range-value-close--dark-mode"
+                : ""
+            }`}
+          >
+            {range}
+          </span>
+          {longRange !== null && (
+            <span
+              className={`ddbc-combat-attack__range-value-long ${
+                theme.isDarkMode
+                  ? "ddbc-combat-attack__range-value-long--dark-mode"
+                  : ""
+              }`}
+            >
+              ({longRange})
+            </span>
+          )}
+        </React.Fragment>
+      );
+      rangeLabel = "";
+    } else {
+      rangeValue = <NumberDisplay type="distanceInFt" number={reach} />;
+    }
+
+    let filteredWeaponSpellDamageGroups =
+      ItemUtils.getApplicableWeaponSpellDamageGroups(
+        item,
+        weaponSpellDamageGroups
+      );
+
+    let iconKey: string = `weapon-${FormatUtils.slugify(attackTypeName)}`;
+    if (filteredWeaponSpellDamageGroups.length) {
+      iconKey = "weapon-spell-damage";
+    }
+    let attackClassNames: Array<string> = [
+      "ddbc-combat-attack--item",
+      `ddbc-combat-item-attack--${FormatUtils.slugify(attackTypeName)}`,
+      className,
+    ];
+    if (isCriticalHit) {
+      attackClassNames.push("ddbc-combat-attack--crit");
+    }
+    return (
+      <CombatAttack
+        attack={attack}
+        className={attackClassNames.join(" ")}
+        icon={
+          <>
+            {ItemUtils.getMasteryName(item) && (
+              <Tooltip title="Weapon Mastery" isDarkMode={theme.isDarkMode}>
+                <StarIcon
+                  style={{ fill: theme.themeColor, marginLeft: "1px" }}
+                />
+              </Tooltip>
+            )}
+            <AttackTypeIcon
+              actionType={Constants.ActionTypeEnum.WEAPON}
+              rangeType={attackType ?? Constants.AttackTypeRangeEnum.MELEE}
+              themeMode={theme.isDarkMode ? "gray" : "dark"}
+              className={`ddbc-combat-attack__icon-img--${iconKey}`}
+              overrideType={
+                filteredWeaponSpellDamageGroups.length ? "weapon-spell" : null
+              }
+            />
+          </>
+        }
+        name={<ItemName item={item} />}
+        metaItems={combinedMetaItems}
+        rangeValue={rangeValue}
+        rangeLabel={rangeLabel}
+        isProficient={proficiency}
+        toHit={toHit}
+        damage={damageDisplayNode}
+        notes={this.renderNotes()}
+        showNotes={showNotes}
+        onClick={this.handleClick}
+        diceEnabled={diceEnabled}
+        onRoll={this.handleRoll}
+        rollContext={rollContext}
+        theme={theme}
+      />
+    );
+  }
+}
+
+CombatItemAttack.contextType = GameLogContext;
+
+export default CombatItemAttack;
diff --git a/ddb_main/tools/js/smartComponents/CombatAttack/CombatItemAttack/index.ts b/ddb_main/tools/js/smartComponents/CombatAttack/CombatItemAttack/index.ts
new file mode 100644
index 0000000..2f0ab2e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CombatAttack/CombatItemAttack/index.ts
@@ -0,0 +1,4 @@
+import CombatItemAttack from "./CombatItemAttack";
+
+export default CombatItemAttack;
+export { CombatItemAttack };
diff --git a/ddb_main/tools/js/smartComponents/CombatAttack/CombatSpellAttack/CombatSpellAttack.tsx b/ddb_main/tools/js/smartComponents/CombatAttack/CombatSpellAttack/CombatSpellAttack.tsx
new file mode 100644
index 0000000..fd397bd
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CombatAttack/CombatSpellAttack/CombatSpellAttack.tsx
@@ -0,0 +1,277 @@
+import * as React from "react";
+
+import {
+  AbilityLookup,
+  Attack,
+  Constants,
+  DataOriginRefData,
+  EntityUtils,
+  FormatUtils,
+  Spell,
+  SpellCasterInfo,
+  SpellUtils,
+  RuleData,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+import { Dice, DiceEvent, IRollContext } from "@dndbeyond/dice";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+import { SpellName } from "~/components/SpellName";
+
+import { SpellSchoolIcon } from "../../Icons";
+import NoteComponents from "../../NoteComponents";
+import SpellDamageEffect from "../../SpellDamageEffect";
+import { SpellSchoolPropType } from "../../componentConstants";
+import { DiceComponentUtils } from "../../utils";
+import CombatAttack from "../CombatAttack";
+
+interface Props {
+  attack: Attack;
+  spell: Spell;
+  onClick?: (attack: Attack) => void;
+  ruleData: RuleData;
+  abilityLookup: AbilityLookup;
+  spellCasterInfo: SpellCasterInfo;
+  showNotes: boolean;
+  className: string;
+  diceEnabled: boolean;
+  theme: CharacterTheme;
+  rollContext: IRollContext;
+  dataOriginRefData: DataOriginRefData;
+  proficiencyBonus: number;
+}
+
+interface State {
+  isCriticalHit: boolean;
+}
+
+export default class CombatSpellAttack extends React.PureComponent<
+  Props,
+  State
+> {
+  diceEventHandler: (eventData: any) => void;
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      isCriticalHit: false,
+    };
+  }
+
+  static defaultProps = {
+    showNotes: true,
+    className: "",
+    diceEnabled: false,
+  };
+
+  componentDidMount = () => {
+    this.diceEventHandler = DiceComponentUtils.setupResetCritStateOnRoll(
+      SpellUtils.getName(this.props.spell),
+      this
+    );
+  };
+
+  componentWillUnmount = () => {
+    Dice.removeEventListener(DiceEvent.ROLL, this.diceEventHandler);
+  };
+
+  handleClick = (): void => {
+    const { onClick, attack } = this.props;
+
+    if (onClick) {
+      onClick(attack);
+    }
+  };
+
+  renderNotes = (): React.ReactNode => {
+    const {
+      spell,
+      abilityLookup,
+      ruleData,
+      showNotes,
+      spellCasterInfo,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    if (!showNotes) {
+      return null;
+    }
+
+    const castLevel = SpellUtils.getMinCastLevel(
+      spell,
+      spellCasterInfo,
+      ruleData
+    );
+    const characterLevel = SpellUtils.getCharacterLevel(spell);
+    let scaledAmount: number = 0;
+
+    return (
+      <div className="ddbc-combat-spell-attack__notes">
+        <NoteComponents
+          notes={SpellUtils.getNoteComponents(
+            spell,
+            castLevel,
+            characterLevel,
+            abilityLookup,
+            ruleData,
+            scaledAmount,
+            proficiencyBonus
+          )}
+          theme={theme}
+        />
+      </div>
+    );
+  };
+
+  handleRoll = (wasCrit: boolean) => {
+    this.setState({ isCriticalHit: wasCrit });
+  };
+
+  render() {
+    const {
+      attack,
+      spell,
+      ruleData,
+      spellCasterInfo,
+      showNotes,
+      diceEnabled,
+      theme,
+      dataOriginRefData,
+      rollContext,
+      className,
+    } = this.props;
+
+    const { isCriticalHit } = this.state;
+
+    const characterLevel = SpellUtils.getCharacterLevel(spell);
+    const attackSaveValue = SpellUtils.getAttackSaveValue(spell);
+    const toHit = SpellUtils.getToHit(spell);
+    const isCustomized = SpellUtils.isCustomized(spell);
+    const range = SpellUtils.getRange(spell);
+    const level = SpellUtils.getLevel(spell);
+    const school = SpellUtils.getSchool(spell);
+    const concentration = SpellUtils.getConcentration(spell);
+    const requiresAttackRoll = SpellUtils.getRequiresAttackRoll(spell);
+    const requiresSavingThrow = SpellUtils.getRequiresSavingThrow(spell);
+    const castLevel = SpellUtils.getMinCastLevel(
+      spell,
+      spellCasterInfo,
+      ruleData
+    );
+
+    let metaItems: Array<string> = [];
+    if (SpellUtils.isLegacy(spell)) {
+      metaItems.push("Legacy");
+    }
+
+    metaItems.push(FormatUtils.renderSpellLevelName(level));
+
+    const spellDataOrigin = SpellUtils.getDataOrigin(spell);
+    if (spellDataOrigin) {
+      const dataOriginName = EntityUtils.getDataOriginName(spellDataOrigin);
+      metaItems.push(dataOriginName);
+    }
+    let expandedDataOrigin = SpellUtils.getExpandedDataOriginRef(spell);
+    if (expandedDataOrigin) {
+      metaItems.push(
+        EntityUtils.getDataOriginRefName(expandedDataOrigin, dataOriginRefData)
+      );
+    }
+    if (concentration) {
+      metaItems.push("Concentration");
+    }
+    if (isCustomized) {
+      metaItems.push("Customized");
+    }
+
+    let rangeAreaNode: React.ReactNode;
+    if (range !== null) {
+      rangeAreaNode = (
+        <span className="ddbc-combat-attack__spell-range">
+          {!!range.origin &&
+            range.origin !== Constants.SpellRangeTypeNameEnum.RANGED && (
+              <span
+                className={`ddbc-combat-attack__spell-range-origin ${
+                  theme.isDarkMode
+                    ? "ddbc-combat-attack__spell-range-origin--dark-mode"
+                    : ""
+                }`}
+              >
+                {range.origin}
+              </span>
+            )}
+          {!!range.rangeValue && (
+            <span className="ddbc-combat-attack__spell-range-value">
+              <NumberDisplay type="distanceInFt" number={range.rangeValue} />
+            </span>
+          )}
+        </span>
+      );
+    }
+
+    let toHitDisplay: number | null = null;
+    let saveDcValue: number | null = null;
+    let saveDcLabel: React.ReactNode;
+    if (requiresAttackRoll) {
+      toHitDisplay = toHit;
+    } else if (requiresSavingThrow) {
+      saveDcValue = attackSaveValue;
+      saveDcLabel = SpellUtils.getSaveDcAbilityShortName(spell, ruleData);
+    }
+    let attackClassNames: Array<string> = ["ddbc-combat-attack--spell", className];
+
+    if (isCriticalHit) {
+      attackClassNames.push("ddbc-combat-attack--crit");
+    }
+
+    return (
+      <CombatAttack
+        attack={attack}
+        className={attackClassNames.join(" ")}
+        icon={
+          <SpellSchoolIcon
+            school={FormatUtils.slugify(school) as SpellSchoolPropType}
+            themeMode={theme.isDarkMode ? "gray" : "dark"}
+            className={`ddbc-combat-attack__icon-img--spell-school-${FormatUtils.slugify(
+              school
+            )}`}
+          />
+        }
+        name={
+          <SpellName
+            spell={spell}
+            showSpellLevel={false}
+            dataOriginRefData={dataOriginRefData}
+          />
+        }
+        metaItems={metaItems}
+        rangeValue={rangeAreaNode}
+        rangeLabel={""}
+        toHit={toHitDisplay}
+        attackSaveValue={saveDcValue}
+        attackSaveLabel={saveDcLabel}
+        rollContext={rollContext}
+        damage={
+          <SpellDamageEffect
+            spell={spell}
+            characterLevel={characterLevel}
+            castLevel={castLevel}
+            ruleData={ruleData}
+            diceEnabled={diceEnabled}
+            theme={theme}
+            isCriticalHit={isCriticalHit}
+            rollContext={rollContext}
+          />
+        }
+        onClick={this.handleClick}
+        notes={this.renderNotes()}
+        showNotes={showNotes}
+        diceEnabled={diceEnabled}
+        onRoll={this.handleRoll}
+        theme={theme}
+      />
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/CombatAttack/CombatSpellAttack/index.ts b/ddb_main/tools/js/smartComponents/CombatAttack/CombatSpellAttack/index.ts
new file mode 100644
index 0000000..94f1121
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CombatAttack/CombatSpellAttack/index.ts
@@ -0,0 +1,4 @@
+import CombatSpellAttack from "./CombatSpellAttack";
+
+export default CombatSpellAttack;
+export { CombatSpellAttack };
diff --git a/ddb_main/tools/js/smartComponents/ConditionName/ConditionName.tsx b/ddb_main/tools/js/smartComponents/ConditionName/ConditionName.tsx
new file mode 100644
index 0000000..f0d5f12
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/ConditionName/ConditionName.tsx
@@ -0,0 +1,62 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  ConditionUtils,
+  Condition,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  className: string;
+  condition: Condition;
+  tooltipText: string;
+  theme?: CharacterTheme;
+}
+
+export default class ConditionName extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    className: "",
+    tooltipText: "",
+  };
+
+  renderConditionLevel = (condition: Condition): React.ReactNode => {
+    const levels = ConditionUtils.getLevels(condition);
+
+    if (!levels.length) {
+      return null;
+    }
+
+    return (
+      <span className="ddbc-condition__level">
+        {" "}
+        (Level {ConditionUtils.getActiveLevel(condition)})
+      </span>
+    );
+  };
+
+  render() {
+    const { className, condition, tooltipText, theme } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-condition"];
+
+    return (
+      <span className={classNames.join(" ")}>
+        <Tooltip
+          title={tooltipText}
+          enabled={!!tooltipText}
+          isDarkMode={theme?.isDarkMode}
+        >
+          <span
+            className={`ddbc-condition__name ${
+              theme?.isDarkMode ? "ddbc-condition__name--dark-mode" : ""
+            }`}
+          >
+            {ConditionUtils.getName(condition)}
+            {this.renderConditionLevel(condition)}
+          </span>
+        </Tooltip>
+      </span>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/CreatureList/CreatureList.tsx b/ddb_main/tools/js/smartComponents/CreatureList/CreatureList.tsx
new file mode 100644
index 0000000..0cd7730
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CreatureList/CreatureList.tsx
@@ -0,0 +1,87 @@
+import { orderBy } from "lodash";
+import * as React from "react";
+
+import {
+  CharacterTheme,
+  Creature,
+  CreatureUtils,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import CreatureListRow from "./CreatureListRow";
+
+//TODO this component is currently replaced by ExtraList for Creatures and Vehicles as Extras
+interface Props {
+  className: string;
+  creatures: Array<Creature>;
+  showNotes: boolean;
+  ruleData: RuleData;
+  onShow: (id: number) => void;
+  onStatusChange: (id: number, isActive: boolean) => void;
+  isReadonly: boolean;
+  theme: CharacterTheme;
+}
+export default class CreatureList extends React.PureComponent<Props, {}> {
+  static defaultProps = {
+    showNotes: true,
+    className: "",
+  };
+
+  render() {
+    const {
+      creatures,
+      ruleData,
+      showNotes,
+      onShow,
+      onStatusChange,
+      isReadonly,
+      className,
+      theme,
+    } = this.props;
+
+    let orderedCreatures: Array<Creature> = orderBy(creatures, (creature) =>
+      CreatureUtils.getName(creature)
+    );
+    let classNames: Array<string> = [className, "ddbc-creature-list"];
+
+    return (
+      <div className={classNames.join(" ")}>
+        <div className="ddbc-creature-list__row-header">
+          <div className="ddbc-creature-list__col ddbc-creature-list__col--preview" />
+          <div className="ddbc-creature-list__col ddbc-creature-list__col--primary">
+            Name
+          </div>
+          <div className="ddbc-creature-list__col ddbc-creature-list__col--ac">
+            AC
+          </div>
+          <div className="ddbc-creature-list__col ddbc-creature-list__col--hp">
+            Hit Points
+          </div>
+          <div className="ddbc-creature-list__col ddbc-creature-list__col--speed">
+            Speed
+          </div>
+          {showNotes && (
+            <div className="ddbc-creature-list__col ddbc-creature-list__col--notes">
+              Notes
+            </div>
+          )}
+          {/*<div className="ddbc-creature-list__col ddbc-creature-list__col--action">Active</div>*/}
+        </div>
+        <div className="ddbc-creature-list__items">
+          {orderedCreatures.map((creature) => (
+            <CreatureListRow
+              key={CreatureUtils.getUniqueKey(creature)}
+              creature={creature}
+              ruleData={ruleData}
+              onShow={onShow}
+              onStatusChange={onStatusChange}
+              showNotes={showNotes}
+              isReadonly={isReadonly}
+              theme={theme}
+            />
+          ))}
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/CreatureList/CreatureListRow/CreatureListRow.tsx b/ddb_main/tools/js/smartComponents/CreatureList/CreatureListRow/CreatureListRow.tsx
new file mode 100644
index 0000000..66577a3
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CreatureList/CreatureListRow/CreatureListRow.tsx
@@ -0,0 +1,198 @@
+import * as React from "react";
+
+import {
+  Creature,
+  CreatureUtils,
+  Constants,
+  RuleData,
+  RuleDataUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+import { NoteComponents } from "../../NoteComponents";
+
+//TODO this component is currently replaced by ExtraListRow for Creatures and Vehicles as Extras
+
+interface Props {
+  creature: Creature;
+  ruleData: RuleData;
+  onShow?: (id: number) => void;
+  onStatusChange?: (id: number, isActive: boolean) => void;
+  showNotes: boolean;
+  isReadonly: boolean;
+  className: string;
+  theme: CharacterTheme;
+}
+
+export default class CreatureListRow extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onShow, creature } = this.props;
+
+    if (onShow) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onShow(CreatureUtils.getMappingId(creature));
+    }
+  };
+
+  handleActivate = (): void => {
+    const { onStatusChange, creature } = this.props;
+
+    if (onStatusChange) {
+      onStatusChange(CreatureUtils.getMappingId(creature), true);
+    }
+  };
+
+  handleDeactivate = (): void => {
+    const { onStatusChange, creature } = this.props;
+
+    if (onStatusChange) {
+      onStatusChange(CreatureUtils.getMappingId(creature), false);
+    }
+  };
+
+  renderMetaItems = (): React.ReactNode => {
+    const { creature, ruleData } = this.props;
+
+    let metaItems: Array<string> = [];
+
+    const sizeInfo = RuleDataUtils.getCreatureSizeInfo(
+      CreatureUtils.getSizeId(creature),
+      ruleData
+    );
+    let size: string = "";
+    if (sizeInfo && sizeInfo.name !== null) {
+      size = sizeInfo.name;
+    }
+
+    let type = CreatureUtils.getTypeName(creature, ruleData);
+
+    let description: string = `${size} ${type}`.trim();
+    if (description) {
+      metaItems.push(description);
+    }
+
+    return (
+      <div className="ddbc-creature-list__row-meta">
+        {metaItems.map((metaItem, idx) => (
+          <span key={idx} className="ddbc-creature-list__row-meta-item">
+            {metaItem}
+          </span>
+        ))}
+      </div>
+    );
+  };
+
+  renderHitPoints = (): React.ReactNode => {
+    const { creature } = this.props;
+
+    const hitPointInfo = CreatureUtils.getHitPointInfo(creature);
+    const tempHp = hitPointInfo.tempHp === null ? 0 : hitPointInfo.tempHp;
+
+    let classNames: Array<string> = ["ddbc-creature-list__row-hp"];
+    if (tempHp > 0) {
+      classNames.push("ddbc-creature-list__row-hp--has-temp");
+    }
+
+    return (
+      <div className={classNames.join(" ")}>
+        <span className="ddbc-creature-list__row-hp-value ddbc-creature-list__row-hp-value--current">
+          {hitPointInfo.remainingHp + tempHp}
+        </span>
+        <span className="ddbc-creature-list__row-hp-sep">/</span>
+        <span className="ddbc-creature-list__row-hp-value ddbc-creature-list__row-hp-value--total">
+          {hitPointInfo.totalHp + tempHp}
+        </span>
+      </div>
+    );
+  };
+
+  renderSpeed = (): React.ReactNode => {
+    const { creature, ruleData, theme } = this.props;
+
+    const movementInfo = CreatureUtils.getHighestMovementInfo(creature);
+
+    let contentNode: React.ReactNode;
+    if (movementInfo) {
+      contentNode = (
+        <React.Fragment>
+          <div className="ddbc-creature-list__row-speed-value">
+            <NumberDisplay type="distanceInFt" number={movementInfo.speed} />
+          </div>
+          {movementInfo.movementId !== Constants.MovementTypeEnum.WALK && (
+            <div className="ddbc-creature-list__row-speed-callout">
+              {RuleDataUtils.getMovementDescription(
+                movementInfo.movementId,
+                ruleData
+              )}
+            </div>
+          )}
+        </React.Fragment>
+      );
+    } else {
+      contentNode = (
+        <div className="ddbc-creature-list__row-speed-value">--</div>
+      );
+    }
+
+    return <div className="ddbc-creature-list__row-speed">{contentNode}</div>;
+  };
+
+  render() {
+    const { creature, ruleData, isReadonly, showNotes, className, theme } =
+      this.props;
+
+    const avatarUrl = CreatureUtils.getAvatarUrl(creature);
+    const name = CreatureUtils.getName(creature);
+    const armorClass = CreatureUtils.getArmorClass(creature);
+    const movementInfo = CreatureUtils.getHighestMovementInfo(creature);
+    const isActive = CreatureUtils.isActive(creature);
+
+    let classNames: Array<string> = [className, "ddbc-creature-row"];
+
+    return (
+      <div className={classNames.join(" ")} onClick={this.handleClick}>
+        <div className="ddbc-creature-list__row-preview">
+          {avatarUrl && (
+            <img
+              className="ddbc-creature-list__row-img"
+              src={avatarUrl}
+              alt={`${name} preview`}
+            />
+          )}
+        </div>
+        <div className="ddbc-creature-list__row-primary">
+          <div className="ddbc-creature-list__row-name">{name}</div>
+          {this.renderMetaItems()}
+        </div>
+        <div className="ddbc-creature-list__row-ac">{armorClass}</div>
+        {this.renderHitPoints()}
+        {this.renderSpeed()}
+        {showNotes && (
+          <div className="ddbc-creature-list__row-notes">
+            <NoteComponents
+              notes={CreatureUtils.getNoteComponents(creature, ruleData)}
+              theme={theme}
+            />
+          </div>
+        )}
+        {/*<div className="ddbc-creature-list__row-action">
+                    <SlotManager
+                        used={isActive ? 1 : 0}
+                        available={1}
+                        size="small"
+                        onUse={this.handleActivate}
+                        onClear={this.handleDeactivate}
+                        isInteractive={!isReadonly}
+                    />
+                </div>*/}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/CreatureList/CreatureListRow/index.ts b/ddb_main/tools/js/smartComponents/CreatureList/CreatureListRow/index.ts
new file mode 100644
index 0000000..67aaf1d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CreatureList/CreatureListRow/index.ts
@@ -0,0 +1,4 @@
+import CreatureListRow from "./CreatureListRow";
+
+export default CreatureListRow;
+export { CreatureListRow };
diff --git a/ddb_main/tools/js/smartComponents/CreatureName/CreatureName.tsx b/ddb_main/tools/js/smartComponents/CreatureName/CreatureName.tsx
new file mode 100644
index 0000000..5212f7a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CreatureName/CreatureName.tsx
@@ -0,0 +1,53 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  CharacterTheme,
+  Creature,
+  CreatureUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  creature: Creature;
+  onClick?: (creature: Creature) => void;
+  className: string;
+  theme?: CharacterTheme;
+}
+export default class CreatureName extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick, creature } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+
+      onClick(creature);
+    }
+  };
+
+  render() {
+    const { creature, className, theme } = this.props;
+
+    let isCustomized = CreatureUtils.isCustomized(creature);
+    let classNames: Array<string> = [className, "ddbc-creature-name"];
+
+    return (
+      <span className={classNames.join(" ")} onClick={this.handleClick}>
+        {CreatureUtils.getName(creature)}
+        {isCustomized && (
+          <Tooltip
+            title="Creature is Customized"
+            className="ddbc-creature-name__customized"
+            isDarkMode={theme?.isDarkMode}
+          >
+            *
+          </Tooltip>
+        )}
+      </span>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/CreaturePreview/CreaturePreview.tsx b/ddb_main/tools/js/smartComponents/CreaturePreview/CreaturePreview.tsx
new file mode 100644
index 0000000..72bcf5b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/CreaturePreview/CreaturePreview.tsx
@@ -0,0 +1,74 @@
+import * as React from "react";
+
+import {
+  Creature,
+  CreatureUtils,
+  RuleData,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  creature: Creature;
+  ruleData: RuleData;
+  onClick?: (creature: Creature) => void;
+}
+export class CreaturePreview extends React.PureComponent<Props> {
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick, creature } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick(creature);
+    }
+  };
+
+  renderMetaText = (): React.ReactNode => {
+    const { ruleData, creature } = this.props;
+
+    let metaItems: Array<string> = [];
+
+    const sizeInfo = CreatureUtils.getSizeInfo(creature);
+    let size: string | null = "";
+    if (sizeInfo !== null) {
+      size = sizeInfo.name;
+    }
+
+    let description: string = `${size} ${CreatureUtils.getTypeName(
+      creature,
+      ruleData
+    )}`.trim();
+    if (description.length) {
+      metaItems.push(description);
+    }
+
+    return (
+      <div className="ddbc-creature-preview__meta">
+        {metaItems.map((metaItem, idx) => (
+          <span className="ddbc-creature-preview__meta-item" key={idx}>
+            {metaItem}
+          </span>
+        ))}
+      </div>
+    );
+  };
+
+  render() {
+    const { creature } = this.props;
+
+    const imageStyles: React.CSSProperties = {
+      backgroundImage: `url(${CreatureUtils.getAvatarUrl(creature)})`,
+    };
+
+    return (
+      <div className="ddbc-creature-preview" onClick={this.handleClick}>
+        <div className="ddbc-creature-preview__avatar" style={imageStyles} />
+        <div className="ddbc-creature-preview__name">
+          {CreatureUtils.getName(creature)}
+          {this.renderMetaText()}
+        </div>
+      </div>
+    );
+  }
+}
+
+export default CreaturePreview;
diff --git a/ddb_main/tools/js/smartComponents/Damage/Damage.tsx b/ddb_main/tools/js/smartComponents/Damage/Damage.tsx
new file mode 100644
index 0000000..2addc97
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Damage/Damage.tsx
@@ -0,0 +1,94 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  CharacterTheme,
+  DiceContract,
+  DiceUtils,
+  FormatUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { DamageTypeIcon } from "../Icons";
+import { DamageTypePropType } from "../Icons/IconConstants";
+
+export interface Props {
+  className: string;
+  damage: DiceContract | string | number | null;
+  type: string | null;
+  info?: string;
+  isVersatile: boolean;
+  showInfoTooltip: boolean;
+  showInfoInline: boolean;
+  theme?: CharacterTheme;
+}
+export default class Damage extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+    type: null,
+    isVersatile: false,
+    showInfoTooltip: true,
+    showInfoInline: false,
+  };
+
+  render() {
+    const {
+      className,
+      damage,
+      type,
+      isVersatile,
+      info,
+      showInfoInline,
+      showInfoTooltip,
+      theme,
+    } = this.props;
+
+    let displayDamage: React.ReactNode;
+    if (damage !== null) {
+      if (typeof damage === "string" || typeof damage === "number") {
+        displayDamage = damage;
+      } else {
+        displayDamage = DiceUtils.renderDice(damage);
+      }
+    }
+
+    let classNames: Array<string> = [className, "ddbc-damage"];
+    if (isVersatile) {
+      classNames.push("ddbc-damage--versatile");
+    }
+    if (theme?.isDarkMode) {
+      classNames.push("ddbc-damage--dark-mode");
+    }
+
+    let tooltipContent: string | null = null;
+    if (showInfoTooltip && (info || type)) {
+      tooltipContent = info ? info : type;
+    }
+
+    return (
+      <Tooltip
+        isDarkMode={theme?.isDarkMode}
+        className={classNames.join(" ")}
+        title={tooltipContent === null ? "" : tooltipContent}
+        enabled={showInfoTooltip && tooltipContent !== null}
+      >
+        <span
+          className={`ddbc-damage__value ${
+            theme?.isDarkMode ? "ddbc-damage__value--dark-mode" : ""
+          }`}
+        >
+          {displayDamage}
+        </span>
+        {!isVersatile && !!type && (
+          <span className="ddbc-damage__icon">
+            <DamageTypeIcon
+              theme={theme}
+              type={FormatUtils.slugify(type) as DamageTypePropType}
+              showTooltip={!showInfoTooltip}
+            />
+          </span>
+        )}
+        {showInfoInline && <span className="ddbc-damage__info">{info}</span>}
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Damage/index.ts b/ddb_main/tools/js/smartComponents/Damage/index.ts
new file mode 100644
index 0000000..4ef433c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Damage/index.ts
@@ -0,0 +1,4 @@
+import Damage from "./Damage";
+
+export default Damage;
+export { Damage };
diff --git a/ddb_main/tools/js/smartComponents/DamageAdjustment/DamageAdjustment.tsx b/ddb_main/tools/js/smartComponents/DamageAdjustment/DamageAdjustment.tsx
new file mode 100644
index 0000000..98c56f1
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/DamageAdjustment/DamageAdjustment.tsx
@@ -0,0 +1,44 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  CharacterTheme,
+  DamageAdjustmentContract,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  className: string;
+  damageAdjustment: DamageAdjustmentContract;
+  tooltipText: string;
+  theme?: CharacterTheme;
+}
+export default class DamageAdjustment extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, damageAdjustment, tooltipText, theme } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-damage-adjustment"];
+
+    return (
+      <span className={classNames.join(" ")}>
+        <Tooltip
+          title={tooltipText}
+          enabled={!!tooltipText}
+          isDarkMode={theme?.isDarkMode}
+        >
+          <span className="ddbc-damage-adjustment__preview">
+            <i
+              className={`ddbc-damage-adjustment__icon i-damage-adjustment-${damageAdjustment.slug}`}
+            />
+          </span>
+          <span className="ddbc-damage-adjustment__name">
+            {damageAdjustment.name}
+          </span>
+        </Tooltip>
+      </span>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/DamageAdjustment/index.ts b/ddb_main/tools/js/smartComponents/DamageAdjustment/index.ts
new file mode 100644
index 0000000..575838e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/DamageAdjustment/index.ts
@@ -0,0 +1,4 @@
+import DamageAdjustment from "./DamageAdjustment";
+
+export default DamageAdjustment;
+export { DamageAdjustment };
diff --git a/ddb_main/tools/js/smartComponents/DataOriginName/DataOriginName.tsx b/ddb_main/tools/js/smartComponents/DataOriginName/DataOriginName.tsx
new file mode 100644
index 0000000..d72df64
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/DataOriginName/DataOriginName.tsx
@@ -0,0 +1,61 @@
+import * as React from "react";
+
+import {
+  CharacterTheme,
+  Constants,
+  DataOrigin,
+  EntityUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemName } from "~/components/ItemName";
+
+interface Props {
+  dataOrigin: DataOrigin;
+  tryParent?: boolean;
+  onClick?: (dataOrigin: DataOrigin) => void;
+  className: string;
+  theme: CharacterTheme;
+}
+
+export default class DataOriginName extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick, dataOrigin } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick(dataOrigin);
+    }
+  };
+
+  render() {
+    const { dataOrigin, className, tryParent } = this.props;
+
+    let displayNode: React.ReactNode;
+
+    switch (dataOrigin.type) {
+      case Constants.DataOriginTypeEnum.ITEM:
+        displayNode = <ItemName item={dataOrigin.primary} />;
+        break;
+
+      default:
+        displayNode = EntityUtils.getDataOriginName(
+          dataOrigin,
+          undefined,
+          tryParent
+        );
+    }
+
+    let classNames: Array<string> = [className, "ddbc-data-origin-name"];
+
+    return (
+      <span className={classNames.join(" ")} onClick={this.handleClick}>
+        {displayNode}
+      </span>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/DataOriginName/index.ts b/ddb_main/tools/js/smartComponents/DataOriginName/index.ts
new file mode 100644
index 0000000..1d80fb0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/DataOriginName/index.ts
@@ -0,0 +1,4 @@
+import DataOriginName from "./DataOriginName";
+
+export default DataOriginName;
+export { DataOriginName };
diff --git a/ddb_main/tools/js/smartComponents/Dice/DigitalDiceWrapper/DigitalDiceWrapper.tsx b/ddb_main/tools/js/smartComponents/Dice/DigitalDiceWrapper/DigitalDiceWrapper.tsx
new file mode 100644
index 0000000..d67003a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Dice/DigitalDiceWrapper/DigitalDiceWrapper.tsx
@@ -0,0 +1,36 @@
+import { RollType } from "@dndbeyond/dice";
+import { WithDiceRollv2 } from "@dndbeyond/dice-components";
+import { RollableComponentProps } from "@dndbeyond/dice-components/dist/types/src/components/WithDiceRollv2";
+import { useMemo } from "react";
+
+export interface DigitalDiceWrapperProps extends
+  Omit<RollableComponentProps, "BaseComponent"  | "useCustomizableDiceNotation">
+{
+}
+
+export const DigitalDiceWrapper: React.FC<DigitalDiceWrapperProps> = ({ 
+  useAdvancedMenu = true,
+  rollType,
+  children,
+  ...props
+}) => {
+  const useCustomizableDiceNotation = useMemo(
+    () => rollType === RollType.Damage
+      || rollType === RollType.Heal,
+    [rollType]
+  );
+
+  return (
+    <WithDiceRollv2
+        BaseComponent={(
+          <>
+            {children}
+          </>
+        )}
+        useAdvancedMenu={useAdvancedMenu}
+        useCustomizableDiceNotation={useCustomizableDiceNotation}
+        rollType={rollType}
+        {...props}
+    />
+  );
+};
diff --git a/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRoll/DiceRoll.tsx b/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRoll/DiceRoll.tsx
new file mode 100644
index 0000000..a1bcfaf
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRoll/DiceRoll.tsx
@@ -0,0 +1,119 @@
+import React, { useCallback } from "react";
+
+import { RollRequest } from "@dndbeyond/dice";
+
+import LoadingPlaceholder from "../../LoadingPlaceholder";
+import { DataLoadingStatusEnum } from "../../componentConstants";
+import {
+  DiceRollActionNode,
+  DiceRollActionNodeProps,
+} from "./DiceRollActionNode";
+import { DiceRollValues, DiceRollValuesProps } from "./DiceRollValues";
+
+export interface DiceRollProps {
+  rollKey: string;
+  nextRollKey: string | null;
+  rollTotal: number | null;
+  diceRollRequest: RollRequest;
+  onChange?: (
+    key: string,
+    newValue: string | null,
+    prevValue: string | null,
+    nextRollKey: string | null,
+    rollTotal: number | null,
+    rollValues: DiceRollValuesProps["rollValues"]
+  ) => void;
+  onRoll: (
+    key: string,
+    diceRollRequest: RollRequest,
+    nextRollKey: string | null
+  ) => void;
+  rollValues: DiceRollValuesProps["rollValues"];
+  rollStatus: DiceRollActionNodeProps["rollStatus"];
+  options?: DiceRollActionNodeProps["options"];
+  assignedValue: DiceRollActionNodeProps["assignedValue"];
+  rollButtonText?: DiceRollActionNodeProps["rollButtonText"];
+  selectPlaceholderText?: DiceRollActionNodeProps["selectPlaceholderText"];
+}
+const DiceRoll: React.FunctionComponent<DiceRollProps> = ({
+  rollKey,
+  nextRollKey,
+  options,
+  rollTotal,
+  rollValues,
+  assignedValue,
+  diceRollRequest,
+  onChange,
+  onRoll,
+  rollStatus,
+  rollButtonText,
+  selectPlaceholderText,
+}) => {
+  const handleChange = useCallback(
+    (changedValue: string): void => {
+      const prevValue = assignedValue;
+      const newValue: string | null = changedValue ?? null;
+
+      if (newValue !== prevValue) {
+        if (onChange) {
+          onChange(
+            rollKey,
+            newValue,
+            prevValue,
+            nextRollKey,
+            rollTotal,
+            rollValues
+          );
+        }
+      }
+    },
+    [onChange, rollKey, assignedValue, nextRollKey, rollTotal, rollValues]
+  );
+
+  const handleRollClick = useCallback((): void => {
+    onRoll(rollKey, diceRollRequest, nextRollKey);
+  }, [onRoll, rollKey, diceRollRequest, nextRollKey]);
+
+  let contentNode: React.ReactNode = null;
+  switch (rollStatus) {
+    case DataLoadingStatusEnum.LOADING:
+      contentNode = <LoadingPlaceholder label="Rolling" />;
+      break;
+
+    default: {
+      const diceTotalClassNames: Array<string> = ["ddbc-dice-roll__total"];
+      if (rollTotal === null) {
+        diceTotalClassNames.push("ddbc-dice-roll__total--empty");
+      }
+
+      contentNode = (
+        <React.Fragment>
+          <div className={diceTotalClassNames.join(" ")}>
+            <label className="ddbc-dice-roll__total-label" htmlFor={rollKey}>
+              {rollTotal ?? "--"}
+            </label>
+          </div>
+          <div className="ddbc-dice-roll__dice">
+            <DiceRollValues rollValues={rollValues} />
+          </div>
+          <DiceRollActionNode
+            rollKey={rollKey}
+            rollStatus={rollStatus}
+            rollTotal={rollTotal}
+            assignedValue={assignedValue}
+            options={options}
+            onRoll={handleRollClick}
+            onChange={handleChange}
+            rollButtonText={rollButtonText}
+            selectPlaceholderText={selectPlaceholderText}
+          />
+        </React.Fragment>
+      );
+      break;
+    }
+  }
+
+  return <div className="ddbc-dice-roll">{contentNode}</div>;
+};
+
+export default React.memo(DiceRoll);
diff --git a/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRoll/DiceRollActionNode/DiceRollActionNode.tsx b/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRoll/DiceRollActionNode/DiceRollActionNode.tsx
new file mode 100644
index 0000000..1ad55ea
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRoll/DiceRollActionNode/DiceRollActionNode.tsx
@@ -0,0 +1,53 @@
+import React from "react";
+
+import { HtmlSelectOption } from "@dndbeyond/character-rules-engine/es";
+
+import { DataLoadingStatusEnum } from "../../../componentConstants";
+import { Button } from "../../../legacy/Button";
+import { Select } from "../../../legacy/Select";
+
+export interface DiceRollActionNodeProps {
+  rollKey: string;
+  rollStatus: DataLoadingStatusEnum;
+  rollTotal: number | null;
+  assignedValue: string | null;
+  options?: Array<HtmlSelectOption>;
+  rollButtonText?: string;
+  selectPlaceholderText?: string;
+  onRoll: () => void;
+  onChange?: (newValue: string | null) => void;
+}
+const DiceRollActionNode: React.FunctionComponent<DiceRollActionNodeProps> = ({
+  rollKey,
+  rollStatus,
+  rollTotal,
+  assignedValue,
+  options,
+  onRoll,
+  onChange,
+  rollButtonText = "Roll",
+  selectPlaceholderText = "--",
+}) => {
+  if (options?.length && rollTotal !== null) {
+    return (
+      <Select
+        id={rollKey}
+        value={assignedValue}
+        options={options}
+        placeholder={selectPlaceholderText}
+        onChange={onChange}
+      />
+    );
+  }
+
+  return (
+    <Button
+      size="large"
+      // style='outline'
+      onClick={onRoll}
+    >
+      {rollButtonText}
+    </Button>
+  );
+};
+export default React.memo(DiceRollActionNode);
diff --git a/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRoll/DiceRollValues/DiceRollValues.tsx b/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRoll/DiceRollValues/DiceRollValues.tsx
new file mode 100644
index 0000000..2159caa
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRoll/DiceRollValues/DiceRollValues.tsx
@@ -0,0 +1,64 @@
+import { orderBy } from "lodash";
+import React from "react";
+
+import {
+  RollValueContract,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+//eventually use RollValueContract.dieType to display dice svgs
+export interface DiceRollValuesProps {
+  rollValues: Array<RollValueContract>;
+}
+const DiceRollValues: React.FunctionComponent<DiceRollValuesProps> = ({
+  rollValues,
+}) => {
+  if (rollValues.length === 0) {
+    return null;
+  }
+
+  const keptDiceValues = rollValues.filter(
+    (valueContract) =>
+      valueContract.excludeType === Constants.DiceRollExcludeTypeEnum.ALL
+  );
+  const discardedValues = rollValues.filter(
+    (valueContract) =>
+      valueContract.excludeType === Constants.DiceRollExcludeTypeEnum.NONE
+  );
+
+  const orderedKeptDiceValues = orderBy(
+    keptDiceValues,
+    (valueContract) => valueContract.value,
+    "desc"
+  );
+  const orderedDiscardedValues = orderBy(
+    discardedValues,
+    (valueContract) => valueContract.value,
+    "desc"
+  );
+
+  const classNames: Array<string> = ["ddbc-dice-roll__dice-value"];
+
+  return (
+    <React.Fragment>
+      {orderedKeptDiceValues.map((rollValue: RollValueContract, idx) => {
+        return (
+          <div key={idx} className={classNames.join(" ")}>
+            {rollValue.value}
+          </div>
+        );
+      })}
+      {orderedDiscardedValues.map((rollValue: RollValueContract, idx) => {
+        classNames.push("ddbc-dice-roll__dice-value--discarded");
+
+        return (
+          <div key={idx} className={classNames.join(" ")}>
+            {rollValue.value}
+          </div>
+        );
+      })}
+    </React.Fragment>
+  );
+};
+
+export default React.memo(DiceRollValues);
diff --git a/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRollGroup.tsx b/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRollGroup.tsx
new file mode 100644
index 0000000..36ae312
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/DiceRollGroup/DiceRollGroup.tsx
@@ -0,0 +1,289 @@
+import React, { useCallback, useMemo } from "react";
+
+import {
+  HelperUtils,
+  HtmlSelectOption,
+  RollResultContract,
+  RollValueContract,
+} from "@dndbeyond/character-rules-engine/es";
+import { Dice, RollRequest } from "@dndbeyond/dice";
+
+import { DataLoadingStatusEnum } from "../componentConstants";
+import { Button, RemoveButton } from "../legacy";
+import { TypeScriptUtils, DiceComponentUtils } from "../utils";
+import { DiceRoll, DiceRollProps } from "./DiceRoll";
+
+export interface DiceRollGroupProps {
+  className: string;
+  componentKey: string;
+  diceRolls: Array<RollResultContract>;
+  exclusiveOptions?: boolean;
+  confirmButtonText?: string;
+  onConfirm?: (
+    groupKey: string,
+    rollResults: Array<RollResultContract>
+  ) => void;
+  onUpdateGroup?: (
+    groupKey: string,
+    rollResults: Array<RollResultContract>
+  ) => void;
+  onRollError?: (errorMessage: string) => void;
+  groupKey: string;
+  nextGroupKey: string | null;
+  showRemoveButton?: boolean;
+  onRemoveGroup?: (groupKey: string, nextGroupKey: string | null) => void;
+  onResetGroup?: (
+    groupKey: string,
+    rollResults: Array<RollResultContract>
+  ) => void;
+  onUpdateDiceRoll: (
+    rollKey: string,
+    properties: Omit<Partial<RollResultContract>, "rollKey">,
+    nextRollKey: string | null
+  ) => void;
+  onSetRollStatus: (rollKey: string, status: DataLoadingStatusEnum) => void;
+  rollStatusLookup: Record<string, DataLoadingStatusEnum>;
+  options?: DiceRollProps["options"];
+  diceRollRequest:
+    | DiceRollProps["diceRollRequest"]
+    | Array<DiceRollProps["diceRollRequest"]>;
+}
+const DiceRollGroup: React.FunctionComponent<DiceRollGroupProps> = ({
+  className = "",
+  componentKey,
+  diceRolls,
+  options,
+  confirmButtonText = "Confirm",
+  showRemoveButton = false,
+  exclusiveOptions = false,
+  diceRollRequest,
+  groupKey,
+  nextGroupKey,
+  onUpdateGroup,
+  onRemoveGroup,
+  onRollError,
+  onConfirm,
+  onResetGroup,
+  onSetRollStatus,
+  onUpdateDiceRoll,
+  rollStatusLookup,
+}) => {
+  const classNames = useMemo<Array<string>>(
+    () => ["ddbc-dice-roll-group", className],
+    [className]
+  );
+
+  const areRollsEmpty = useMemo<boolean>(
+    () => !diceRolls.some((roll) => roll.rollTotal !== null),
+    [diceRolls]
+  );
+
+  const areScoresUnassigned = useMemo<boolean>(
+    () =>
+      !diceRolls.some(
+        (roll) => roll.assignedValue !== null && roll.assignedValue !== ""
+      ),
+    [diceRolls]
+  );
+
+  const assignedValues = useMemo<Array<string>>(() => {
+    return diceRolls
+      .map((roll) => roll.assignedValue)
+      .filter(TypeScriptUtils.isNotNullOrUndefined);
+  }, [diceRolls]);
+
+  const generatedOptions = useMemo<Array<Array<HtmlSelectOption>>>(() => {
+    if (!options) {
+      return [];
+    }
+
+    return diceRolls.map((roll): Array<HtmlSelectOption> => {
+      if (!exclusiveOptions) {
+        return options;
+      }
+
+      return options.filter(
+        (option) =>
+          roll.assignedValue === option.value ||
+          !assignedValues.includes(option.value.toString())
+      );
+    });
+  }, [options, diceRolls, exclusiveOptions, assignedValues]);
+
+  const generatedRollRequests = useMemo<Array<RollRequest>>(() => {
+    let requests: Array<RollRequest> = [];
+    for (let i = 0; i < diceRolls.length; i++) {
+      if (!Array.isArray(diceRollRequest)) {
+        requests.push(diceRollRequest);
+      } else {
+        if (diceRollRequest[i]) {
+          requests.push(diceRollRequest[i]);
+        } else {
+          requests.push(diceRollRequest[0]);
+        }
+      }
+    }
+
+    return requests;
+  }, [diceRollRequest, diceRolls]);
+
+  const handleRoll = useCallback(
+    (
+      rollKey: string,
+      diceRollRequest: RollRequest,
+      nextRollKey: string | null
+    ): void => {
+      onSetRollStatus(rollKey, DataLoadingStatusEnum.LOADING);
+
+      Dice.roll(diceRollRequest)
+        .then((result) => {
+          //RollResult | undefined - RollResult is not exported from Dice;
+          //  only expect to have one single rollRequest.
+          const rollResult = result.rolls[0].result ?? null;
+
+          if (!rollResult) {
+            throw new Error("error in rollResult");
+          }
+
+          const rollValues =
+            DiceComponentUtils.generateRollValueContracts(result);
+
+          if (!rollValues) {
+            throw new Error("error in rollResult values");
+          }
+
+          //update status
+          onSetRollStatus(rollKey, DataLoadingStatusEnum.LOADED);
+
+          //update diceRoll
+          onUpdateDiceRoll(
+            rollKey,
+            { rollValues, rollTotal: rollResult.total },
+            nextRollKey
+          );
+        })
+        .catch((error: Error) => {
+          //this could handle different errors types from dice package or thrown errors from result
+
+          onSetRollStatus(rollKey, DataLoadingStatusEnum.NOT_LOADED);
+
+          if (onRollError) {
+            onRollError(error.message);
+          }
+          console.log("roll error", error);
+        });
+    },
+    []
+  );
+
+  const handleChange = useCallback(
+    (
+      rollKey: string,
+      newValue: string | null,
+      prevValue: string | null,
+      nextRollKey: string | null,
+      rollTotal: number | null,
+      rollValues: Array<RollValueContract>
+    ): void => {
+      if (newValue === prevValue) {
+        return;
+      }
+
+      onUpdateDiceRoll(
+        rollKey,
+        { assignedValue: newValue, rollTotal, rollValues },
+        nextRollKey
+      );
+    },
+    []
+  );
+
+  const handleConfirm = useCallback((): void => {
+    if (onConfirm) {
+      return onConfirm(groupKey, diceRolls);
+    }
+  }, [onConfirm, groupKey, diceRolls]);
+
+  const handleResetGroup = useCallback((): void => {
+    if (onResetGroup) {
+      onResetGroup(groupKey, diceRolls);
+    }
+
+    diceRolls.forEach((roll) => {
+      onSetRollStatus(roll.rollKey, DataLoadingStatusEnum.NOT_INITIALIZED);
+    });
+  }, [onResetGroup, groupKey]);
+
+  const handleRemoveGroup = useCallback((): void => {
+    if (onRemoveGroup) {
+      onRemoveGroup(groupKey, nextGroupKey);
+    }
+  }, [onRemoveGroup, groupKey, nextGroupKey]);
+
+  return (
+    <div className={classNames.join(" ")}>
+      <div className="ddbc-dice-roll-group__actions">
+        {showRemoveButton && (
+          <RemoveButton
+            size="small"
+            onClick={handleRemoveGroup}
+            enableConfirm={true}
+          >
+            Delete group
+          </RemoveButton>
+        )}
+      </div>
+      <div className="ddbc-dice-roll-group__rolls">
+        {diceRolls.map((diceRoll, idx) => {
+          const diceRollRequest = generatedRollRequests[idx];
+          if (!diceRollRequest) {
+            return null;
+          }
+          const rollStatus = HelperUtils.lookupDataOrFallback(
+            rollStatusLookup,
+            diceRoll.rollKey,
+            DataLoadingStatusEnum.NOT_INITIALIZED
+          );
+
+          return (
+            <DiceRoll
+              key={diceRoll.rollKey}
+              rollKey={diceRoll.rollKey}
+              nextRollKey={diceRoll.nextRollKey}
+              rollTotal={diceRoll.rollTotal}
+              rollValues={diceRoll.rollValues}
+              assignedValue={diceRoll.assignedValue}
+              options={generatedOptions[idx]}
+              onChange={handleChange}
+              onRoll={handleRoll}
+              diceRollRequest={diceRollRequest}
+              rollStatus={rollStatus}
+            />
+          );
+        })}
+      </div>
+      <div className="ddbc-dice-roll-group__actions">
+        <RemoveButton
+          size="medium"
+          style="filled"
+          onClick={handleResetGroup}
+          disabled={areRollsEmpty}
+          enableConfirm={true}
+        >
+          Reset Group
+        </RemoveButton>
+        {onConfirm && (
+          <Button
+            size="medium"
+            onClick={handleConfirm}
+            disabled={areScoresUnassigned}
+          >
+            {confirmButtonText}
+          </Button>
+        )}
+      </div>
+    </div>
+  );
+};
+
+export default React.memo(DiceRollGroup);
diff --git a/ddb_main/tools/js/smartComponents/DiceRollGroupManager/DiceRollGroupManager.tsx b/ddb_main/tools/js/smartComponents/DiceRollGroupManager/DiceRollGroupManager.tsx
new file mode 100644
index 0000000..cc2c3f3
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/DiceRollGroupManager/DiceRollGroupManager.tsx
@@ -0,0 +1,91 @@
+import React from "react";
+
+import { RollGroupContract } from "@dndbeyond/character-rules-engine/es";
+
+import { DiceRollGroup, DiceRollGroupProps } from "../DiceRollGroup";
+import { Button } from "../legacy/Button";
+
+export interface DiceRollGroupManagerProps {
+  groups: Array<RollGroupContract>;
+  showAddGroupButton?: boolean;
+  onAddGroup?: () => void;
+  componentKey: DiceRollGroupProps["componentKey"];
+  options?: DiceRollGroupProps["options"];
+  exclusiveOptions?: DiceRollGroupProps["exclusiveOptions"];
+  diceRollRequest: DiceRollGroupProps["diceRollRequest"];
+  onConfirm?: DiceRollGroupProps["onConfirm"];
+  confirmButtonText?: DiceRollGroupProps["confirmButtonText"];
+  onRollError?: DiceRollGroupProps["onRollError"];
+  onRemoveGroup?: DiceRollGroupProps["onRemoveGroup"];
+  onUpdateGroup?: DiceRollGroupProps["onUpdateGroup"];
+  onResetGroup: DiceRollGroupProps["onResetGroup"];
+  onSetRollStatus: DiceRollGroupProps["onSetRollStatus"];
+  rollStatusLookup: DiceRollGroupProps["rollStatusLookup"];
+  onUpdateDiceRoll: DiceRollGroupProps["onUpdateDiceRoll"];
+}
+const DiceRollGroupManager: React.FunctionComponent<
+  DiceRollGroupManagerProps
+> = ({
+  componentKey,
+  groups,
+  options,
+  diceRollRequest,
+  onConfirm,
+  confirmButtonText,
+  onRollError,
+  showAddGroupButton = false,
+  onUpdateGroup,
+  onResetGroup,
+  onAddGroup,
+  onRemoveGroup,
+  exclusiveOptions,
+  onSetRollStatus,
+  rollStatusLookup,
+  onUpdateDiceRoll,
+}) => {
+  return (
+    <div className="ddbc-dice-roll-group-manager">
+      <div className="ddbc-dice-roll-group-manager__actions">
+        {showAddGroupButton && (
+          <Button
+            size="small"
+            onClick={onAddGroup}
+            disabled={groups.length >= 10}
+          >
+            +Add Group
+          </Button>
+        )}
+        <span className="ddbc-dice-roll-group-manager__actions-label">{`Groups: ${groups.length}`}</span>
+      </div>
+      <div className="ddbc-dice-roll-group-manager__groups">
+        {groups.map((group, idx) => {
+          return (
+            <DiceRollGroup
+              className="ddbc-dice-roll-group-manager__group"
+              key={group.groupKey}
+              componentKey={componentKey}
+              groupKey={group.groupKey}
+              nextGroupKey={group.nextGroupKey}
+              options={options}
+              exclusiveOptions={exclusiveOptions}
+              confirmButtonText={confirmButtonText}
+              onConfirm={onConfirm}
+              onUpdateGroup={onUpdateGroup}
+              onRollError={onRollError}
+              showRemoveButton={groups.length > 1}
+              onRemoveGroup={onRemoveGroup}
+              onResetGroup={onResetGroup}
+              diceRollRequest={diceRollRequest}
+              diceRolls={group.rollResults}
+              onSetRollStatus={onSetRollStatus}
+              rollStatusLookup={rollStatusLookup}
+              onUpdateDiceRoll={onUpdateDiceRoll}
+            />
+          );
+        })}
+      </div>
+    </div>
+  );
+};
+
+export default React.memo(DiceRollGroupManager);
diff --git a/ddb_main/tools/js/smartComponents/ExclusiveCheckbox/ExclusiveCheckbox.tsx b/ddb_main/tools/js/smartComponents/ExclusiveCheckbox/ExclusiveCheckbox.tsx
new file mode 100644
index 0000000..4df0d3c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/ExclusiveCheckbox/ExclusiveCheckbox.tsx
@@ -0,0 +1,59 @@
+import * as React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import Checkbox from "../Checkbox";
+
+interface Props {
+  choices: Array<string>;
+  onSelection?: (slotIdx: number) => void;
+  activeChoice: number | null;
+  theme?: CharacterTheme;
+}
+
+export default class ExclusiveCheckbox extends React.PureComponent<Props, {}> {
+  handleSelection = (slotIdx: number): void => {
+    const { onSelection } = this.props;
+
+    if (onSelection) {
+      onSelection(slotIdx);
+    }
+  };
+
+  render() {
+    const { activeChoice, choices, theme } = this.props;
+
+    const parentClassNames: Array<string> = ["ddbc-exclusive-checkbox"];
+    if (theme?.isDarkMode) {
+      parentClassNames.push("ddbc-exclusive-checkbox--dark-mode");
+    }
+
+    return (
+      <div className={parentClassNames.join(" ")}>
+        {choices.map((choice, slotIdx) => {
+          const classNames: Array<string> = ["ddbc-exclusive-checkbox__slot"];
+
+          if (activeChoice === null) {
+            classNames.push("ddbc-exclusive-checkbox__slot--active");
+          } else {
+            if (activeChoice === slotIdx) {
+              classNames.push("ddbc-exclusive-checkbox__slot--selected");
+            } else {
+              classNames.push("ddbc-exclusive-checkbox__slot--inactive");
+            }
+          }
+
+          return (
+            <div key={slotIdx} className={classNames.join(" ")}>
+              <Checkbox
+                label={choice}
+                enabled={activeChoice === slotIdx}
+                onChange={this.handleSelection.bind(this, slotIdx)}
+              />
+            </div>
+          );
+        })}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/AbilityIcon/AbilityIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/AbilityIcon/AbilityIcon.tsx
new file mode 100644
index 0000000..73e4f29
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/AbilityIcon/AbilityIcon.tsx
@@ -0,0 +1,98 @@
+import * as React from "react";
+
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import {
+  DarkCharismaSvg,
+  DarkConstitutionSvg,
+  DarkDexteritySvg,
+  DarkIntelligenceSvg,
+  DarkStrengthSvg,
+  DarkWisdomSvg,
+  LightCharismaSvg,
+  LightConstitutionSvg,
+  LightDexteritySvg,
+  LightIntelligenceSvg,
+  LightStrengthSvg,
+  LightWisdomSvg,
+} from "../../Svg";
+
+//TODO should dynamically create props based on which component and expected props, for now this is duplicated from InjectedSvgProps hocTypings.ts
+interface SvgInjectedProps {
+  className?: string;
+}
+interface Props {
+  statId: Constants.AbilityStatEnum;
+  themeMode?: "dark" | "light";
+  className: string;
+}
+export default class AbilityIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  getDarkSvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    const { statId } = this.props;
+
+    switch (statId) {
+      case Constants.AbilityStatEnum.CHARISMA:
+        return DarkCharismaSvg;
+      case Constants.AbilityStatEnum.CONSTITUTION:
+        return DarkConstitutionSvg;
+      case Constants.AbilityStatEnum.DEXTERITY:
+        return DarkDexteritySvg;
+      case Constants.AbilityStatEnum.INTELLIGENCE:
+        return DarkIntelligenceSvg;
+      case Constants.AbilityStatEnum.STRENGTH:
+        return DarkStrengthSvg;
+      case Constants.AbilityStatEnum.WISDOM:
+        return DarkWisdomSvg;
+      default:
+        return null;
+    }
+  };
+
+  getLightSvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    const { statId } = this.props;
+
+    switch (statId) {
+      case Constants.AbilityStatEnum.CHARISMA:
+        return LightCharismaSvg;
+      case Constants.AbilityStatEnum.CONSTITUTION:
+        return LightConstitutionSvg;
+      case Constants.AbilityStatEnum.DEXTERITY:
+        return LightDexteritySvg;
+      case Constants.AbilityStatEnum.INTELLIGENCE:
+        return LightIntelligenceSvg;
+      case Constants.AbilityStatEnum.STRENGTH:
+        return LightStrengthSvg;
+      case Constants.AbilityStatEnum.WISDOM:
+        return LightWisdomSvg;
+      default:
+        return null;
+    }
+  };
+
+  render() {
+    const { themeMode, className } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-ability-icon"];
+
+    let SvgIcon: React.ComponentType<SvgInjectedProps> | null = null;
+
+    switch (themeMode) {
+      case "light":
+        SvgIcon = this.getLightSvg();
+        break;
+      case "dark":
+      default:
+        SvgIcon = this.getDarkSvg();
+    }
+
+    if (SvgIcon === null) {
+      return null;
+    }
+
+    return <SvgIcon className={classNames.join(" ")} />;
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/AdvantageDisadvantageIcon/AdvantageDisadvantageIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/AdvantageDisadvantageIcon/AdvantageDisadvantageIcon.tsx
new file mode 100644
index 0000000..2b82a80
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/AdvantageDisadvantageIcon/AdvantageDisadvantageIcon.tsx
@@ -0,0 +1,55 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import { AdvantageDisadvantageSvg } from "../../Svg";
+import {
+  SvgConstantDarkModePositiveTheme,
+  SvgConstantDarkModeNegativeTheme,
+  SvgConstantPositiveTheme,
+  SvgConstantNegativeTheme,
+} from "../../componentConstants";
+
+interface Props {
+  title: string;
+  className: string;
+  theme: CharacterTheme;
+}
+export default class AdvantageDisadvantageIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    title: "",
+    className: "",
+    theme: {},
+  };
+
+  render() {
+    const { title, className, theme } = this.props;
+
+    let classNames: Array<string> = [
+      className,
+      "ddbc-advantage-disadvantage-icon",
+    ];
+
+    return (
+      <Tooltip
+        title={title}
+        className={classNames.join(" ")}
+        isDarkMode={theme?.isDarkMode}
+      >
+        <AdvantageDisadvantageSvg
+          fillColor={
+            theme.isDarkMode
+              ? SvgConstantDarkModePositiveTheme.fill
+              : SvgConstantPositiveTheme.fill
+          }
+          secondaryFillColor={
+            theme.isDarkMode
+              ? SvgConstantDarkModeNegativeTheme.fill
+              : SvgConstantNegativeTheme.fill
+          }
+        />
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/AdvantageDisadvantageIcon/index.ts b/ddb_main/tools/js/smartComponents/Icons/AdvantageDisadvantageIcon/index.ts
new file mode 100644
index 0000000..66c04a9
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/AdvantageDisadvantageIcon/index.ts
@@ -0,0 +1,4 @@
+import AdvantageDisadvantageIcon from "./AdvantageDisadvantageIcon";
+
+export default AdvantageDisadvantageIcon;
+export { AdvantageDisadvantageIcon };
diff --git a/ddb_main/tools/js/smartComponents/Icons/AdvantageIcon/AdvantageIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/AdvantageIcon/AdvantageIcon.tsx
new file mode 100644
index 0000000..7517191
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/AdvantageIcon/AdvantageIcon.tsx
@@ -0,0 +1,42 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import { DarkModePositiveAdvantageSvg, PositiveAdvantageSvg } from "../../Svg";
+
+interface Props {
+  title: string;
+  className: string;
+  theme?: CharacterTheme;
+  secondaryFill?: string;
+}
+export default class AdvantageIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    title: "Advantage",
+    className: "",
+    theme: {},
+  };
+
+  render() {
+    const { title, className, theme } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-advantage-icon"];
+
+    return (
+      <Tooltip
+        title={title}
+        className={classNames.join(" ")}
+        isDarkMode={theme?.isDarkMode}
+      >
+        <span aria-label="Advantage">
+          {theme?.isDarkMode ? (
+            <DarkModePositiveAdvantageSvg />
+          ) : (
+            <PositiveAdvantageSvg />
+          )}
+        </span>
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/AoeTypeIcon/AoeTypeIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/AoeTypeIcon/AoeTypeIcon.tsx
new file mode 100644
index 0000000..5873cac
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/AoeTypeIcon/AoeTypeIcon.tsx
@@ -0,0 +1,125 @@
+import * as React from "react";
+
+import {
+  DarkConeSvg,
+  DarkCubeSvg,
+  DarkCylinderSvg,
+  DarkLineSvg,
+  DarkSphereSvg,
+  DarkSquareSvg,
+  GrayConeSvg,
+  GrayCubeSvg,
+  GrayCylinderSvg,
+  GrayLineSvg,
+  GraySphereSvg,
+  GraySquareSvg,
+  LightConeSvg,
+  LightCubeSvg,
+  LightCylinderSvg,
+  LightLineSvg,
+  LightSphereSvg,
+  LightSquareSvg,
+} from "../../Svg";
+import { AoeTypePropType } from "../IconConstants";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+interface Props {
+  type?: AoeTypePropType;
+  themeMode?: "dark" | "gray" | "light";
+  className?: string;
+}
+const AoeTypeIcon: React.FunctionComponent<Props> = ({
+  className = "",
+  themeMode = "dark",
+  type,
+}) => {
+  const DarkSvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (type) {
+      case "cone":
+        return DarkConeSvg;
+      case "cube":
+        return DarkCubeSvg;
+      case "cylinder":
+        return DarkCylinderSvg;
+      case "line":
+        return DarkLineSvg;
+      case "sphere":
+      case "emanation":
+        return DarkSphereSvg;
+      case "square":
+        return DarkSquareSvg;
+      default:
+        return null;
+    }
+  };
+
+  const GraySvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (type) {
+      case "cone":
+        return GrayConeSvg;
+      case "cube":
+        return GrayCubeSvg;
+      case "cylinder":
+        return GrayCylinderSvg;
+      case "line":
+        return GrayLineSvg;
+      case "sphere":
+      case "emanation":
+        return GraySphereSvg;
+      case "square":
+        return GraySquareSvg;
+      default:
+        return null;
+    }
+  };
+
+  const LightSvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (type) {
+      case "cone":
+        return LightConeSvg;
+      case "cube":
+        return LightCubeSvg;
+      case "cylinder":
+        return LightCylinderSvg;
+      case "line":
+        return LightLineSvg;
+      case "sphere":
+      case "emanation":
+        return LightSphereSvg;
+      case "square":
+        return LightSquareSvg;
+      default:
+        return null;
+    }
+  };
+
+  let classNames: Array<string> = [
+    className,
+    "ddbc-aoe-type-icon",
+    `ddbc-aoe-type-icon--${type}`,
+  ];
+
+  let SvgIcon: React.ComponentType<SvgInjectedProps> | null = null;
+
+  switch (themeMode) {
+    case "light":
+      SvgIcon = LightSvg();
+      break;
+    case "gray":
+      SvgIcon = GraySvg();
+      break;
+    case "dark":
+    default:
+      SvgIcon = DarkSvg();
+  }
+
+  if (SvgIcon === null) {
+    return null;
+  }
+
+  return <SvgIcon className={classNames.join(" ")} />;
+};
+
+export default AoeTypeIcon;
diff --git a/ddb_main/tools/js/smartComponents/Icons/AttackTypeIcon/AttackTypeIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/AttackTypeIcon/AttackTypeIcon.tsx
new file mode 100644
index 0000000..11d6bf2
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/AttackTypeIcon/AttackTypeIcon.tsx
@@ -0,0 +1,161 @@
+import * as React from "react";
+
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import {
+  DarkMeleeSpellSvg,
+  DarkMeleeWeaponSvg,
+  DarkRangedSpellSvg,
+  DarkRangedWeaponSvg,
+  DarkThrownSvg,
+  DarkUnarmedStrikeSvg,
+  DarkWeaponSpellDamageSvg,
+  GrayMeleeSpellSvg,
+  GrayMeleeWeaponSvg,
+  GrayRangedSpellSvg,
+  GrayRangedWeaponSvg,
+  GrayThrownSvg,
+  GrayUnarmedStrikeSvg,
+  GrayWeaponSpellDamageSvg,
+  LightMeleeSpellSvg,
+  LightMeleeWeaponSvg,
+  LightRangedSpellSvg,
+  LightRangedWeaponSvg,
+  LightThrownSvg,
+  LightUnarmedStrikeSvg,
+  LightWeaponSpellDamageSvg,
+} from "../../Svg";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+interface Props {
+  actionType: Constants.ActionTypeEnum | null;
+  rangeType: Constants.AttackTypeRangeEnum;
+  themeMode?: "dark" | "gray" | "light";
+  className?: string;
+  overrideType?: "weapon-spell" | null;
+}
+const AttackTypeIcon: React.FunctionComponent<Props> = ({
+  className = "",
+  themeMode = "dark",
+  actionType,
+  rangeType,
+  overrideType,
+}) => {
+  const DarkSvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (true) {
+      case actionType === Constants.ActionTypeEnum.GENERAL &&
+        rangeType === Constants.AttackTypeRangeEnum.MELEE:
+        return DarkUnarmedStrikeSvg;
+      case actionType === Constants.ActionTypeEnum.GENERAL &&
+        rangeType === Constants.AttackTypeRangeEnum.RANGED:
+        return DarkThrownSvg;
+      case actionType === Constants.ActionTypeEnum.SPELL &&
+        rangeType === Constants.AttackTypeRangeEnum.MELEE:
+        return DarkMeleeSpellSvg;
+      case actionType === Constants.ActionTypeEnum.SPELL &&
+        rangeType === Constants.AttackTypeRangeEnum.RANGED:
+        return DarkRangedSpellSvg;
+      case actionType === Constants.ActionTypeEnum.WEAPON &&
+        overrideType === "weapon-spell":
+        return DarkWeaponSpellDamageSvg;
+      case actionType === Constants.ActionTypeEnum.WEAPON &&
+        rangeType === Constants.AttackTypeRangeEnum.MELEE:
+        return DarkMeleeWeaponSvg;
+      case actionType === Constants.ActionTypeEnum.WEAPON &&
+        rangeType === Constants.AttackTypeRangeEnum.RANGED:
+        return DarkRangedWeaponSvg;
+      default:
+        return null;
+    }
+  };
+
+  const GraySvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (true) {
+      case actionType === Constants.ActionTypeEnum.GENERAL &&
+        rangeType === Constants.AttackTypeRangeEnum.MELEE:
+        return GrayUnarmedStrikeSvg;
+      case actionType === Constants.ActionTypeEnum.GENERAL &&
+        rangeType === Constants.AttackTypeRangeEnum.RANGED:
+        return GrayThrownSvg;
+      case actionType === Constants.ActionTypeEnum.SPELL &&
+        rangeType === Constants.AttackTypeRangeEnum.MELEE:
+        return GrayMeleeSpellSvg;
+      case actionType === Constants.ActionTypeEnum.SPELL &&
+        rangeType === Constants.AttackTypeRangeEnum.RANGED:
+        return GrayRangedSpellSvg;
+      case actionType === Constants.ActionTypeEnum.WEAPON &&
+        overrideType === "weapon-spell":
+        return GrayWeaponSpellDamageSvg;
+      case actionType === Constants.ActionTypeEnum.WEAPON &&
+        rangeType === Constants.AttackTypeRangeEnum.MELEE:
+        return GrayMeleeWeaponSvg;
+      case actionType === Constants.ActionTypeEnum.WEAPON &&
+        rangeType === Constants.AttackTypeRangeEnum.RANGED:
+        return GrayRangedWeaponSvg;
+      default:
+        return null;
+    }
+  };
+
+  const LightSvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (true) {
+      case actionType === Constants.ActionTypeEnum.GENERAL &&
+        rangeType === Constants.AttackTypeRangeEnum.MELEE:
+        return LightUnarmedStrikeSvg;
+      case actionType === Constants.ActionTypeEnum.GENERAL &&
+        rangeType === Constants.AttackTypeRangeEnum.RANGED:
+        return LightThrownSvg;
+      case actionType === Constants.ActionTypeEnum.SPELL &&
+        rangeType === Constants.AttackTypeRangeEnum.MELEE:
+        return LightMeleeSpellSvg;
+      case actionType === Constants.ActionTypeEnum.SPELL &&
+        rangeType === Constants.AttackTypeRangeEnum.RANGED:
+        return LightRangedSpellSvg;
+      case actionType === Constants.ActionTypeEnum.WEAPON &&
+        overrideType === "weapon-spell":
+        return LightWeaponSpellDamageSvg;
+      case actionType === Constants.ActionTypeEnum.WEAPON &&
+        rangeType === Constants.AttackTypeRangeEnum.MELEE:
+        return LightMeleeWeaponSvg;
+      case actionType === Constants.ActionTypeEnum.WEAPON &&
+        rangeType === Constants.AttackTypeRangeEnum.RANGED:
+        return LightRangedWeaponSvg;
+      default:
+        return null;
+    }
+  };
+
+  let classNames: Array<string> = [
+    className,
+    "ddbc-attack-type-icon",
+    `ddbc-attack-type-icon--${actionType}-${rangeType}`,
+  ];
+
+  if (overrideType) {
+    classNames.push(`ddbc-attack-type-icon--${overrideType}`);
+  }
+
+  let SvgIcon: React.ComponentType<SvgInjectedProps> | null = null;
+
+  switch (themeMode) {
+    case "light":
+      SvgIcon = LightSvg();
+      break;
+    case "gray":
+      SvgIcon = GraySvg();
+      break;
+    case "dark":
+    default:
+      SvgIcon = DarkSvg();
+  }
+
+  if (SvgIcon === null) {
+    return null;
+  }
+
+  return <SvgIcon className={classNames.join(" ")} />;
+};
+
+export default AttackTypeIcon;
diff --git a/ddb_main/tools/js/smartComponents/Icons/AttunementIcon/AttunementIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/AttunementIcon/AttunementIcon.tsx
new file mode 100644
index 0000000..12a79aa
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/AttunementIcon/AttunementIcon.tsx
@@ -0,0 +1,43 @@
+import * as React from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import { Tooltip } from "~/components/Tooltip";
+import { useCharacterTheme } from "~/contexts/CharacterTheme";
+
+import { DarkAttunementSvg, GrayAttunementSvg } from "../../Svg";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+interface Props {
+  className?: string;
+  showTooltip?: boolean;
+}
+const AttunementIcon: React.FunctionComponent<Props> = ({
+  className = "",
+  showTooltip = true,
+}) => {
+  const { isDarkMode } = useCharacterTheme();
+  let classNames: Array<string> = [className, "ddbc-attunement-icon"];
+
+  let SvgIcon: React.ComponentType<SvgInjectedProps> = isDarkMode
+    ? GrayAttunementSvg
+    : DarkAttunementSvg;
+
+  const tooltipId = `attunmentIcon-${uuidv4()}`;
+
+  return (
+    <>
+      <span
+        className={classNames.join(" ")}
+        data-tooltip-id={tooltipId}
+        data-tooltip-content="Item is Attuned"
+      >
+        <SvgIcon className="ddbc-attunement-icon__icon" />
+      </span>
+      {showTooltip && <Tooltip id={tooltipId} />}
+    </>
+  );
+};
+
+export default AttunementIcon;
diff --git a/ddb_main/tools/js/smartComponents/Icons/CoinIcon/CoinIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/CoinIcon/CoinIcon.tsx
new file mode 100644
index 0000000..3678a69
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/CoinIcon/CoinIcon.tsx
@@ -0,0 +1,59 @@
+import * as React from "react";
+
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import {
+  GoldCoinSvg,
+  SilverCoinSvg,
+  CopperCoinSvg,
+  ElectrumCoinSvg,
+  PlatinumCoinSvg,
+} from "../../Svg";
+
+//TODO should dynamically create props based on which component and expected props, for now this is duplicated from InjectedSvgProps hocTypings.ts
+interface SvgInjectedProps {
+  className?: string;
+}
+interface Props {
+  coinType: Constants.CoinTypeEnum;
+  className: string;
+}
+export default class AbilityIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, coinType } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-ability-icon"];
+
+    let SvgIcon: React.ComponentType<SvgInjectedProps> | null = null;
+
+    switch (coinType) {
+      case Constants.CoinTypeEnum.cp:
+        SvgIcon = CopperCoinSvg;
+        break;
+      case Constants.CoinTypeEnum.ep:
+        SvgIcon = ElectrumCoinSvg;
+        break;
+      case Constants.CoinTypeEnum.gp:
+        SvgIcon = GoldCoinSvg;
+        break;
+      case Constants.CoinTypeEnum.pp:
+        SvgIcon = PlatinumCoinSvg;
+        break;
+      case Constants.CoinTypeEnum.sp:
+        SvgIcon = SilverCoinSvg;
+        break;
+      default:
+        SvgIcon = null;
+    }
+
+    if (SvgIcon === null) {
+      return null;
+    }
+
+    return <SvgIcon className={classNames.join(" ")} />;
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/CoinIcon/index.ts b/ddb_main/tools/js/smartComponents/Icons/CoinIcon/index.ts
new file mode 100644
index 0000000..5fc3d2f
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/CoinIcon/index.ts
@@ -0,0 +1,4 @@
+import CoinIcon from "./CoinIcon";
+
+export default CoinIcon;
+export { CoinIcon };
diff --git a/ddb_main/tools/js/smartComponents/Icons/ConcentrationIcon/ConcentrationIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/ConcentrationIcon/ConcentrationIcon.tsx
new file mode 100644
index 0000000..d4fc81c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ConcentrationIcon/ConcentrationIcon.tsx
@@ -0,0 +1,60 @@
+import clsx from "clsx";
+import * as React from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import { Tooltip } from "~/components/Tooltip";
+
+import {
+  DarkConcentrationSvg,
+  GrayConcentrationSvg,
+  LightConcentrationSvg,
+} from "../../Svg";
+import styles from "./styles.module.css";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+interface Props {
+  themeMode?: "dark" | "gray" | "light";
+  className: string;
+}
+export default class ConcentrationIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+    themeMode: "dark",
+  };
+
+  render() {
+    const { themeMode, className, ...props } = this.props;
+    const id = uuidv4();
+
+    let SvgIcon: React.ComponentType<SvgInjectedProps> | null = null;
+
+    switch (themeMode) {
+      case "light":
+        SvgIcon = LightConcentrationSvg;
+        break;
+      case "gray":
+        SvgIcon = GrayConcentrationSvg;
+        break;
+      case "dark":
+      default:
+        SvgIcon = DarkConcentrationSvg;
+    }
+
+    if (SvgIcon === null) {
+      return null;
+    }
+
+    return (
+      <div
+        className={clsx([styles.concentrationIcon, className])}
+        data-tooltip-id={id}
+        data-tooltip-content="Concentration"
+      >
+        <SvgIcon className={styles.svg} {...props} />
+        <Tooltip id={id} />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/ConcentrationIcon/index.ts b/ddb_main/tools/js/smartComponents/Icons/ConcentrationIcon/index.ts
new file mode 100644
index 0000000..9e39d29
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ConcentrationIcon/index.ts
@@ -0,0 +1,4 @@
+import ConcentrationIcon from "./ConcentrationIcon";
+
+export default ConcentrationIcon;
+export { ConcentrationIcon };
diff --git a/ddb_main/tools/js/smartComponents/Icons/ConditionIcon/ConditionIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/ConditionIcon/ConditionIcon.tsx
new file mode 100644
index 0000000..d9681f0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ConditionIcon/ConditionIcon.tsx
@@ -0,0 +1,129 @@
+import * as React from "react";
+
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+
+import {
+  DarkBlindedSvg,
+  LightBlindedSvg,
+  DarkCharmedSvg,
+  LightCharmedSvg,
+  DarkDeafenedSvg,
+  LightDeafenedSvg,
+  LightExhaustedSvg,
+  DarkExhaustedSvg,
+  LightFrightenedSvg,
+  DarkFrightenedSvg,
+  LightGrappledSvg,
+  DarkGrappledSvg,
+  DarkIncapacitatedSvg,
+  LightIncapacitatedSvg,
+  LightInvisibleSvg,
+  DarkInvisibleSvg,
+  DarkParalyzedSvg,
+  LightParalyzedSvg,
+  DarkPetrifiedSvg,
+  LightPetrifiedSvg,
+  LightPoisonedSvg,
+  DarkPoisonedSvg,
+  LightProneSvg,
+  DarkProneSvg,
+  LightRestrainedSvg,
+  DarkRestrainedSvg,
+  LightStunnedSvg,
+  DarkStunnedSvg,
+  LightUnconsciousSvg,
+  DarkUnconsciousSvg,
+} from "../../Svg";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+interface Props {
+  conditionType: Constants.ConditionIdEnum;
+  className: string;
+  isDarkMode: boolean;
+}
+
+const iconMap = {
+  [Constants.ConditionIdEnum.BLINDED]: {
+    light: LightBlindedSvg,
+    dark: DarkBlindedSvg,
+  },
+  [Constants.ConditionIdEnum.CHARMED]: {
+    light: LightCharmedSvg,
+    dark: DarkCharmedSvg,
+  },
+  [Constants.ConditionIdEnum.DEAFENED]: {
+    light: LightDeafenedSvg,
+    dark: DarkDeafenedSvg,
+  },
+  [Constants.ConditionIdEnum.EXHAUSTION]: {
+    light: LightExhaustedSvg,
+    dark: DarkExhaustedSvg,
+  },
+  [Constants.ConditionIdEnum.FRIGHTENED]: {
+    light: LightFrightenedSvg,
+    dark: DarkFrightenedSvg,
+  },
+  [Constants.ConditionIdEnum.GRAPPLED]: {
+    light: LightGrappledSvg,
+    dark: DarkGrappledSvg,
+  },
+  [Constants.ConditionIdEnum.INCAPACITATED]: {
+    light: LightIncapacitatedSvg,
+    dark: DarkIncapacitatedSvg,
+  },
+  [Constants.ConditionIdEnum.INVISIBLE]: {
+    light: LightInvisibleSvg,
+    dark: DarkInvisibleSvg,
+  },
+  [Constants.ConditionIdEnum.PARALYZED]: {
+    light: LightParalyzedSvg,
+    dark: DarkParalyzedSvg,
+  },
+  [Constants.ConditionIdEnum.PETRIFIED]: {
+    light: LightPetrifiedSvg,
+    dark: DarkPetrifiedSvg,
+  },
+  [Constants.ConditionIdEnum.POISONED]: {
+    light: LightPoisonedSvg,
+    dark: DarkPoisonedSvg,
+  },
+  [Constants.ConditionIdEnum.PRONE]: {
+    light: LightProneSvg,
+    dark: DarkProneSvg,
+  },
+  [Constants.ConditionIdEnum.RESTRAINED]: {
+    light: LightRestrainedSvg,
+    dark: DarkRestrainedSvg,
+  },
+  [Constants.ConditionIdEnum.STUNNED]: {
+    light: LightStunnedSvg,
+    dark: DarkStunnedSvg,
+  },
+  [Constants.ConditionIdEnum.UNCONSCIOUS]: {
+    light: LightUnconsciousSvg,
+    dark: DarkUnconsciousSvg,
+  },
+};
+
+export default class ConditionIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, conditionType, isDarkMode } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-condition-icon"];
+
+    let SvgIcon: React.ComponentType<SvgInjectedProps> | null =
+      iconMap[conditionType]?.[isDarkMode ? "light" : "dark"] ?? null;
+
+    if (SvgIcon === null) {
+      return null;
+    }
+
+    return <SvgIcon className={classNames.join(" ")} />;
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/ConditionIcon/index.ts b/ddb_main/tools/js/smartComponents/Icons/ConditionIcon/index.ts
new file mode 100644
index 0000000..b49c393
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ConditionIcon/index.ts
@@ -0,0 +1,4 @@
+import ConditionIcon from "./ConditionIcon";
+
+export default ConditionIcon;
+export { ConditionIcon };
diff --git a/ddb_main/tools/js/smartComponents/Icons/DamageTypeIcon/DamageTypeIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/DamageTypeIcon/DamageTypeIcon.tsx
new file mode 100644
index 0000000..b5a7543
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/DamageTypeIcon/DamageTypeIcon.tsx
@@ -0,0 +1,204 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import {
+  DarkAcidSvg,
+  GrayAcidSvg,
+  LightAcidSvg,
+  DarkBludgeoningSvg,
+  GrayBludgeoningSvg,
+  LightBludgeoningSvg,
+  DarkColdSvg,
+  GrayColdSvg,
+  LightColdSvg,
+  DarkFireSvg,
+  GrayFireSvg,
+  LightFireSvg,
+  DarkForceSvg,
+  GrayForceSvg,
+  LightForceSvg,
+  DarkLightningSvg,
+  GrayLightningSvg,
+  LightLightningSvg,
+  DarkNecroticSvg,
+  GrayNecroticSvg,
+  LightNecroticSvg,
+  DarkPiercingSvg,
+  GrayPiercingSvg,
+  LightPiercingSvg,
+  DarkPoisonSvg,
+  GrayPoisonSvg,
+  LightPoisonSvg,
+  DarkPsychicSvg,
+  GrayPsychicSvg,
+  LightPsychicSvg,
+  DarkRadiantSvg,
+  GrayRadiantSvg,
+  LightRadiantSvg,
+  DarkSlashingSvg,
+  GraySlashingSvg,
+  LightSlashingSvg,
+  DarkThunderSvg,
+  GrayThunderSvg,
+  LightThunderSvg,
+} from "../../Svg";
+import { DamageTypePropType } from "../IconConstants";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+interface Props {
+  type: DamageTypePropType;
+  showTooltip?: boolean;
+  className?: string;
+  theme?: CharacterTheme;
+  themeMode?: "dark" | "gray" | "light";
+}
+const DamageTypeIcon: React.FunctionComponent<Props> = ({
+  showTooltip = true,
+  className = "",
+  type,
+  theme,
+  themeMode = theme?.isDarkMode ? "gray" : "dark",
+}) => {
+  const DarkSvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (type) {
+      case "acid":
+        return DarkAcidSvg;
+      case "bludgeoning":
+        return DarkBludgeoningSvg;
+      case "cold":
+        return DarkColdSvg;
+      case "fire":
+        return DarkFireSvg;
+      case "force":
+        return DarkForceSvg;
+      case "lightning":
+        return DarkLightningSvg;
+      case "necrotic":
+        return DarkNecroticSvg;
+      case "piercing":
+        return DarkPiercingSvg;
+      case "poison":
+        return DarkPoisonSvg;
+      case "psychic":
+        return DarkPsychicSvg;
+      case "radiant":
+        return DarkRadiantSvg;
+      case "slashing":
+        return DarkSlashingSvg;
+      case "thunder":
+        return DarkThunderSvg;
+      default:
+        return null;
+    }
+  };
+
+  const GraySvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (type) {
+      case "acid":
+        return GrayAcidSvg;
+      case "bludgeoning":
+        return GrayBludgeoningSvg;
+      case "cold":
+        return GrayColdSvg;
+      case "fire":
+        return GrayFireSvg;
+      case "force":
+        return GrayForceSvg;
+      case "lightning":
+        return GrayLightningSvg;
+      case "necrotic":
+        return GrayNecroticSvg;
+      case "piercing":
+        return GrayPiercingSvg;
+      case "poison":
+        return GrayPoisonSvg;
+      case "psychic":
+        return GrayPsychicSvg;
+      case "radiant":
+        return GrayRadiantSvg;
+      case "slashing":
+        return GraySlashingSvg;
+      case "thunder":
+        return GrayThunderSvg;
+      default:
+        return null;
+    }
+  };
+
+  const LightSvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (type) {
+      case "acid":
+        return LightAcidSvg;
+      case "bludgeoning":
+        return LightBludgeoningSvg;
+      case "cold":
+        return LightColdSvg;
+      case "fire":
+        return LightFireSvg;
+      case "force":
+        return LightForceSvg;
+      case "lightning":
+        return LightLightningSvg;
+      case "necrotic":
+        return LightNecroticSvg;
+      case "piercing":
+        return LightPiercingSvg;
+      case "poison":
+        return LightPoisonSvg;
+      case "psychic":
+        return LightPsychicSvg;
+      case "radiant":
+        return LightRadiantSvg;
+      case "slashing":
+        return LightSlashingSvg;
+      case "thunder":
+        return LightThunderSvg;
+      default:
+        return null;
+    }
+  };
+
+  let classNames: Array<string> = [
+    className,
+    "ddbc-damage-type-icon",
+    `ddbc-damage-type-icon--${type}`,
+  ];
+
+  let SvgIcon: React.ComponentType<SvgInjectedProps> | null = null;
+
+  switch (themeMode) {
+    case "light":
+      SvgIcon = LightSvg();
+      break;
+    case "gray":
+      SvgIcon = GraySvg();
+      break;
+    case "dark":
+    default:
+      SvgIcon = DarkSvg();
+  }
+
+  if (SvgIcon === null) {
+    return null;
+  }
+
+  return (
+    <span className={classNames.join(" ")} aria-label={`${type} damage`}>
+      <Tooltip
+        title={type}
+        enabled={showTooltip}
+        isDarkMode={theme?.isDarkMode}
+      >
+        <SvgIcon
+          className={`ddbc-damage-type-icon__img ddbc-damage-type-icon__img--${type}`}
+        />
+      </Tooltip>
+    </span>
+  );
+};
+
+export default DamageTypeIcon;
diff --git a/ddb_main/tools/js/smartComponents/Icons/DisadvantageIcon/DisadvantageIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/DisadvantageIcon/DisadvantageIcon.tsx
new file mode 100644
index 0000000..aa08971
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/DisadvantageIcon/DisadvantageIcon.tsx
@@ -0,0 +1,44 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import {
+  DarkModeNegativeDisadvantageSvg,
+  NegativeDisadvantageSvg,
+} from "../../Svg";
+
+interface Props {
+  title: string;
+  className: string;
+  theme?: CharacterTheme;
+}
+export default class DisadvantageIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    title: "Disadvantage",
+    className: "",
+    theme: {},
+  };
+
+  render() {
+    const { title, className, theme } = this.props;
+
+    const classNames: Array<string> = [className, "ddbc-disadvantage-icon"];
+
+    return (
+      <Tooltip
+        title={title}
+        className={classNames.join(" ")}
+        isDarkMode={theme?.isDarkMode}
+      >
+        <span aria-label="Disadvantage">
+          {theme?.isDarkMode ? (
+            <DarkModeNegativeDisadvantageSvg />
+          ) : (
+            <NegativeDisadvantageSvg />
+          )}
+        </span>
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/HealingIcon/HealingIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/HealingIcon/HealingIcon.tsx
new file mode 100644
index 0000000..fbd0f57
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/HealingIcon/HealingIcon.tsx
@@ -0,0 +1,56 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import { DarkHealingSvg, GrayHealingSvg } from "../../Svg";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+interface Props {
+  className: string;
+  isHp: boolean;
+  isTemp: boolean;
+  showTooltip: boolean;
+  theme?: CharacterTheme;
+}
+export default class HealingIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+    isHp: false,
+    isTemp: false,
+    showTooltip: true,
+  };
+
+  render() {
+    const { isHp, isTemp, showTooltip, className, theme } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-healing-icon"];
+    let tooltips: Array<string> = [];
+    if (isHp) {
+      classNames.push("ddbc-healing-icon--hp");
+      tooltips.push("Healing");
+    }
+    if (isTemp) {
+      classNames.push("ddbc-healing-icon--temp");
+      tooltips.push("Temp HP Healing");
+    }
+
+    let SvgIcon: React.ComponentType<SvgInjectedProps> = theme?.isDarkMode
+      ? GrayHealingSvg
+      : DarkHealingSvg;
+
+    return (
+      <span className={classNames.join(" ")} aria-label="healing">
+        <Tooltip
+          title={tooltips.join(", ")}
+          enabled={showTooltip}
+          isDarkMode={theme?.isDarkMode}
+        >
+          <SvgIcon className="ddbc-healing-icon__icon" />
+        </Tooltip>
+      </span>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/ImmunityIcon/ImmunityIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/ImmunityIcon/ImmunityIcon.tsx
new file mode 100644
index 0000000..468a43e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ImmunityIcon/ImmunityIcon.tsx
@@ -0,0 +1,40 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import { DarkModePositiveImmunitySvg, PositiveImmunitySvg } from "../../Svg";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+
+interface Props {
+  title: string;
+  className: string;
+  theme?: CharacterTheme;
+  secondaryFill?: string;
+}
+export default class ImmunityIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    title: "Immunity",
+    className: "",
+    theme: {},
+  };
+
+  render() {
+    const { title, className, theme } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-immunity-icon"];
+
+    let SvgIcon: React.ComponentType<SvgInjectedProps> = theme?.isDarkMode
+      ? DarkModePositiveImmunitySvg
+      : PositiveImmunitySvg;
+
+    return (
+      <Tooltip title={title} isDarkMode={theme?.isDarkMode}>
+        <SvgIcon className={classNames.join(" ")} />
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/ManageIcon/ManageIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/ManageIcon/ManageIcon.tsx
new file mode 100644
index 0000000..47d9b34
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ManageIcon/ManageIcon.tsx
@@ -0,0 +1,97 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  className: string;
+  tooltip: string;
+  onClick?: () => void;
+  enableTooltip: boolean;
+  showIconOnEdge: boolean;
+  showIcon: boolean;
+  theme: CharacterTheme;
+}
+export default class ManageIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    tooltip: "Manage",
+    enableTooltip: true,
+    showIconOnEdge: true,
+    showIcon: true,
+    className: "",
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick();
+    }
+  };
+
+  render() {
+    const {
+      tooltip,
+      children,
+      onClick,
+      enableTooltip,
+      showIconOnEdge,
+      showIcon,
+      className,
+      theme,
+    } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-manage-icon"];
+    if (showIconOnEdge) {
+      classNames.push("ddbc-manage-icon--edge-icon");
+    }
+    if (showIcon) {
+      classNames.push("ddbc-manage-icon--interactive");
+    }
+    if (theme?.isDarkMode) {
+      classNames.push("ddbc-manage-icon--dark-mode");
+    }
+
+    let contentNode: React.ReactNode = (
+      <React.Fragment>
+        {children && (
+          <span className="ddbc-manage-icon__content">{children}</span>
+        )}
+        {showIcon && (
+          <span
+            className={`ddbc-manage-icon__icon ${
+              theme?.isDarkMode ? `ddbc-manage-icon__icon--dark-mode` : ""
+            }`}
+          />
+        )}
+      </React.Fragment>
+    );
+
+    if (enableTooltip) {
+      return (
+        <Tooltip
+          title={tooltip}
+          className={classNames.join(" ")}
+          onClick={onClick}
+          isInteractive={true}
+          isDarkMode={theme?.isDarkMode}
+        >
+          {contentNode}
+        </Tooltip>
+      );
+    }
+
+    return (
+      <span
+        className={classNames.join(" ")}
+        onClick={this.handleClick}
+        role="button"
+        aria-label="Manage"
+      >
+        {contentNode}
+      </span>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/HalfProficiencyIcon/HalfProficiencyIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/HalfProficiencyIcon/HalfProficiencyIcon.tsx
new file mode 100644
index 0000000..e7ab052
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/HalfProficiencyIcon/HalfProficiencyIcon.tsx
@@ -0,0 +1,46 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  CharacterTheme,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ModifiedProficiencyHalfSvg, ProficiencyHalfSvg } from "../../../Svg";
+
+interface Props {
+  isModified: boolean;
+  className: string;
+  theme?: CharacterTheme;
+}
+
+export default class HalfProficiencyIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    isModified: false,
+    className: "",
+  };
+
+  render() {
+    const { isModified, className, theme } = this.props;
+
+    let IconComponent: React.ComponentType<any> = isModified
+      ? ModifiedProficiencyHalfSvg
+      : ProficiencyHalfSvg;
+    let classNames: Array<string> = ["ddbc-half-proficiency-icon", className];
+    if (isModified) {
+      classNames.push("ddbc-half-proficiency-icon--modified");
+    }
+    let fillColor;
+    if (theme?.isDarkMode) {
+      fillColor = isModified
+        ? Constants.CharacterColorEnum.DARKMODE_TEXT
+        : theme?.themeColor;
+    }
+
+    return (
+      <Tooltip title="Half Proficiency" isDarkMode={theme?.isDarkMode}>
+        <IconComponent className={classNames.join(" ")} fillColor={fillColor} />
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/HalfProficiencyIcon/index.ts b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/HalfProficiencyIcon/index.ts
new file mode 100644
index 0000000..d00c74b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/HalfProficiencyIcon/index.ts
@@ -0,0 +1,4 @@
+import HalfProficiencyIcon from "./HalfProficiencyIcon";
+
+export default HalfProficiencyIcon;
+export { HalfProficiencyIcon };
diff --git a/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/NoProficiencyIcon/NoProficiencyIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/NoProficiencyIcon/NoProficiencyIcon.tsx
new file mode 100644
index 0000000..b2792f3
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/NoProficiencyIcon/NoProficiencyIcon.tsx
@@ -0,0 +1,35 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  isModified: boolean;
+  className: string;
+  theme?: CharacterTheme;
+}
+
+export default class NoProficiencyIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    isModified: false,
+    className: "",
+  };
+
+  render() {
+    const { isModified, className, theme } = this.props;
+
+    let classNames: Array<string> = ["ddbc-no-proficiency-icon", className];
+    if (isModified) {
+      classNames.push("ddbc-no-proficiency-icon--modified");
+    }
+    if (theme?.isDarkMode) {
+      classNames.push("ddbc-no-proficiency-icon--dark-mode");
+    }
+
+    return (
+      <Tooltip title="Not Proficient" isDarkMode={theme?.isDarkMode}>
+        <span className={classNames.join(" ")} />
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/NoProficiencyIcon/index.ts b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/NoProficiencyIcon/index.ts
new file mode 100644
index 0000000..5cabb4e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/NoProficiencyIcon/index.ts
@@ -0,0 +1,4 @@
+import NoProficiencyIcon from "./NoProficiencyIcon";
+
+export default NoProficiencyIcon;
+export { NoProficiencyIcon };
diff --git a/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/ProficiencyIcon/ProficiencyIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/ProficiencyIcon/ProficiencyIcon.tsx
new file mode 100644
index 0000000..3b7feaa
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/ProficiencyIcon/ProficiencyIcon.tsx
@@ -0,0 +1,50 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  CharacterTheme,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ProficiencySvg, ModifiedProficiencySvg } from "../../../Svg";
+
+interface Props {
+  isModified: boolean;
+  className: string;
+  theme?: CharacterTheme;
+}
+
+export default class ProficiencyIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    isModified: false,
+    className: "",
+  };
+
+  render() {
+    const { isModified, className, theme } = this.props;
+
+    let IconComponent: React.ComponentType<any> = isModified
+      ? ModifiedProficiencySvg
+      : ProficiencySvg;
+    let classNames: Array<string> = ["ddbc-proficiency-icon", className];
+
+    if (isModified) {
+      classNames.push("ddbc-proficiency-icon--modified");
+    }
+
+    return (
+      <Tooltip title="Proficiency" isDarkMode={theme?.isDarkMode}>
+        <IconComponent
+          className={classNames.join(" ")}
+          fillColor={
+            theme?.isDarkMode && !isModified
+              ? theme.themeColor
+              : theme?.isDarkMode
+              ? Constants.CharacterColorEnum.DARKMODE_TEXT
+              : undefined
+          }
+        />
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/ProficiencyIcon/index.ts b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/ProficiencyIcon/index.ts
new file mode 100644
index 0000000..ed677e2
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/ProficiencyIcon/index.ts
@@ -0,0 +1,4 @@
+import ProficiencyIcon from "./ProficiencyIcon";
+
+export default ProficiencyIcon;
+export { ProficiencyIcon };
diff --git a/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/ProficiencyLevelIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/ProficiencyLevelIcon.tsx
new file mode 100644
index 0000000..ef119c5
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/ProficiencyLevelIcon.tsx
@@ -0,0 +1,63 @@
+import * as React from "react";
+
+import {
+  CharacterTheme,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+import HalfProficiencyIcon from "./HalfProficiencyIcon";
+import NoProficiencyIcon from "./NoProficiencyIcon";
+import ProficiencyIcon from "./ProficiencyIcon";
+import TwiceProficiencyIcon from "./TwiceProficiencyIcon";
+
+interface Props {
+  proficiencyLevel: number;
+  isModified: boolean;
+  theme?: CharacterTheme;
+}
+export default class ProficiencyLevelIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    isModified: false,
+  };
+
+  render() {
+    const { proficiencyLevel, isModified, theme } = this.props;
+
+    let IconComponent: React.ComponentType<any> | null = null;
+    let proficiencyVerbiage: string = "Not Proficient";
+
+    switch (proficiencyLevel) {
+      case Constants.ProficiencyLevelEnum.NONE:
+        IconComponent = NoProficiencyIcon;
+        break;
+      case Constants.ProficiencyLevelEnum.HALF:
+        IconComponent = HalfProficiencyIcon;
+        proficiencyVerbiage = "Half Proficient";
+        break;
+      case Constants.ProficiencyLevelEnum.FULL:
+        IconComponent = ProficiencyIcon;
+        proficiencyVerbiage = "Proficient";
+        break;
+      case Constants.ProficiencyLevelEnum.EXPERT:
+        IconComponent = TwiceProficiencyIcon;
+        proficiencyVerbiage = "Expert";
+        break;
+      default:
+      //not implemented
+    }
+
+    if (IconComponent === null) {
+      return null;
+    }
+
+    return (
+      <span aria-label={proficiencyVerbiage}>
+        <IconComponent
+          className="ddbc-proficiency-level-icon"
+          isModified={isModified}
+          theme={theme}
+        />
+      </span>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/TwiceProficiencyIcon/TwiceProficiencyIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/TwiceProficiencyIcon/TwiceProficiencyIcon.tsx
new file mode 100644
index 0000000..33574c0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/TwiceProficiencyIcon/TwiceProficiencyIcon.tsx
@@ -0,0 +1,56 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  CharacterTheme,
+  Constants,
+} from "@dndbeyond/character-rules-engine/es";
+
+import {
+  ModifiedProficiencyDoubleSvg,
+  ProficiencyDoubleSvg,
+} from "../../../Svg";
+
+interface Props {
+  isModified: boolean;
+  className: string;
+  theme?: CharacterTheme;
+}
+
+export default class TwiceProficiencyIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    isModified: false,
+    className: "",
+  };
+
+  render() {
+    const { isModified, className, theme } = this.props;
+
+    let IconComponent: React.ComponentType<any> = isModified
+      ? ModifiedProficiencyDoubleSvg
+      : ProficiencyDoubleSvg;
+
+    let classNames: Array<string> = ["ddbc-twice-proficiency-icon", className];
+    if (isModified) {
+      classNames.push("ddbc-twice-proficiency-icon--modified");
+    }
+    let secondaryFill;
+    if (theme?.isDarkMode) {
+      secondaryFill = isModified
+        ? Constants.CharacterColorEnum.DARKMODE_TEXT
+        : theme?.themeColor;
+    }
+
+    return (
+      <Tooltip title="Expertise" isDarkMode={theme?.isDarkMode}>
+        <span className={classNames.join(" ")}>
+          <IconComponent
+            className="ddbc-twice-proficiency-icon__inner"
+            fillColor={theme?.isDarkMode ? theme.themeColor : undefined}
+            secondaryFillColor={secondaryFill}
+          />
+        </span>
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/TwiceProficiencyIcon/index.ts b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/TwiceProficiencyIcon/index.ts
new file mode 100644
index 0000000..13cbd31
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ProficiencyLevelIcon/TwiceProficiencyIcon/index.ts
@@ -0,0 +1,4 @@
+import TwiceProficiencyIcon from "./TwiceProficiencyIcon";
+
+export default TwiceProficiencyIcon;
+export { TwiceProficiencyIcon };
diff --git a/ddb_main/tools/js/smartComponents/Icons/ResistanceIcon/ResistanceIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/ResistanceIcon/ResistanceIcon.tsx
new file mode 100644
index 0000000..8bf2da0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ResistanceIcon/ResistanceIcon.tsx
@@ -0,0 +1,43 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import {
+  PositiveResistanceSvg,
+  DarkModePositiveResistanceSvg,
+} from "../../Svg";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+
+interface Props {
+  title: string;
+  className: string;
+  theme?: CharacterTheme;
+  secondaryFill?: string;
+}
+export default class ResistanceIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    title: "Resistance",
+    className: "",
+    theme: {},
+  };
+
+  render() {
+    const { title, className, theme } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-resistance-icon"];
+
+    let SvgIcon: React.ComponentType<SvgInjectedProps> = theme?.isDarkMode
+      ? DarkModePositiveResistanceSvg
+      : PositiveResistanceSvg;
+
+    return (
+      <Tooltip title={title} isDarkMode={theme?.isDarkMode}>
+        <SvgIcon className={classNames.join(" ")} />
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/ResistanceIcon/index.ts b/ddb_main/tools/js/smartComponents/Icons/ResistanceIcon/index.ts
new file mode 100644
index 0000000..7c78cd8
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/ResistanceIcon/index.ts
@@ -0,0 +1,4 @@
+import ResistanceIcon from "./ResistanceIcon";
+
+export default ResistanceIcon;
+export { ResistanceIcon };
diff --git a/ddb_main/tools/js/smartComponents/Icons/RitualIcon/RitualIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/RitualIcon/RitualIcon.tsx
new file mode 100644
index 0000000..82ce155
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/RitualIcon/RitualIcon.tsx
@@ -0,0 +1,57 @@
+import clsx from "clsx";
+import * as React from "react";
+import { v4 as uuidv4 } from "uuid";
+
+import { Tooltip } from "~/components/Tooltip";
+
+import { DarkRitualSvg, GrayRitualSvg, LightRitualSvg } from "../../Svg";
+import styles from "./styles.module.css";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+interface Props {
+  themeMode?: "dark" | "gray" | "light";
+  className: string;
+}
+export default class RitualIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+    themeMode: "dark",
+  };
+
+  render() {
+    const { themeMode, className, ...props } = this.props;
+
+    const id = uuidv4();
+
+    let SvgIcon: React.ComponentType<SvgInjectedProps> | null = null;
+
+    switch (themeMode) {
+      case "light":
+        SvgIcon = LightRitualSvg;
+        break;
+      case "gray":
+        SvgIcon = GrayRitualSvg;
+        break;
+      case "dark":
+      default:
+        SvgIcon = DarkRitualSvg;
+    }
+
+    if (SvgIcon === null) {
+      return null;
+    }
+
+    return (
+      <div
+        className={clsx([styles.ritualIcon, className])}
+        data-tooltip-id={id}
+        data-tooltip-content="Ritual"
+      >
+        <SvgIcon className={styles.svg} {...props} />
+        <Tooltip id={id} />
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/SpellSchoolIcon/SpellSchoolIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/SpellSchoolIcon/SpellSchoolIcon.tsx
new file mode 100644
index 0000000..6964fe0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/SpellSchoolIcon/SpellSchoolIcon.tsx
@@ -0,0 +1,140 @@
+import * as React from "react";
+
+import {
+  DarkAbjurationSvg,
+  DarkConjurationSvg,
+  DarkDivinationSvg,
+  DarkEnchantmentSvg,
+  DarkEvocationSvg,
+  DarkIllusionSvg,
+  DarkNecromancySvg,
+  DarkTransmutationSvg,
+  GrayAbjurationSvg,
+  GrayConjurationSvg,
+  GrayDivinationSvg,
+  GrayEnchantmentSvg,
+  GrayEvocationSvg,
+  GrayIllusionSvg,
+  GrayNecromancySvg,
+  GrayTransmutationSvg,
+  LightAbjurationSvg,
+  LightConjurationSvg,
+  LightDivinationSvg,
+  LightEnchantmentSvg,
+  LightEvocationSvg,
+  LightIllusionSvg,
+  LightNecromancySvg,
+  LightTransmutationSvg,
+} from "../../Svg";
+import { SpellSchoolPropType } from "../IconConstants";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+interface Props {
+  school: SpellSchoolPropType;
+  themeMode?: "dark" | "gray" | "light";
+  className?: string;
+}
+const SpellSchoolIcon: React.FunctionComponent<Props> = ({
+  className = "",
+  themeMode = "dark",
+  school,
+}) => {
+  const DarkSvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (school) {
+      case "abjuration":
+        return DarkAbjurationSvg;
+      case "conjuration":
+        return DarkConjurationSvg;
+      case "divination":
+        return DarkDivinationSvg;
+      case "enchantment":
+        return DarkEnchantmentSvg;
+      case "evocation":
+        return DarkEvocationSvg;
+      case "illusion":
+        return DarkIllusionSvg;
+      case "necromancy":
+        return DarkNecromancySvg;
+      case "transmutation":
+        return DarkTransmutationSvg;
+      default:
+        return null;
+    }
+  };
+
+  const GraySvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (school) {
+      case "abjuration":
+        return GrayAbjurationSvg;
+      case "conjuration":
+        return GrayConjurationSvg;
+      case "divination":
+        return GrayDivinationSvg;
+      case "enchantment":
+        return GrayEnchantmentSvg;
+      case "evocation":
+        return GrayEvocationSvg;
+      case "illusion":
+        return GrayIllusionSvg;
+      case "necromancy":
+        return GrayNecromancySvg;
+      case "transmutation":
+        return GrayTransmutationSvg;
+      default:
+        return null;
+    }
+  };
+
+  const LightSvg = (): React.ComponentType<SvgInjectedProps> | null => {
+    switch (school) {
+      case "abjuration":
+        return LightAbjurationSvg;
+      case "conjuration":
+        return LightConjurationSvg;
+      case "divination":
+        return LightDivinationSvg;
+      case "enchantment":
+        return LightEnchantmentSvg;
+      case "evocation":
+        return LightEvocationSvg;
+      case "illusion":
+        return LightIllusionSvg;
+      case "necromancy":
+        return LightNecromancySvg;
+      case "transmutation":
+        return LightTransmutationSvg;
+      default:
+        return null;
+    }
+  };
+
+  let classNames: Array<string> = [
+    className,
+    "ddbc-spell-school-icon",
+    `ddbc-spell-school-icon--${school}`,
+  ];
+
+  let SvgIcon: React.ComponentType<SvgInjectedProps> | null = null;
+
+  switch (themeMode) {
+    case "light":
+      SvgIcon = LightSvg();
+      break;
+    case "gray":
+      SvgIcon = GraySvg();
+      break;
+    case "dark":
+    default:
+      SvgIcon = DarkSvg();
+  }
+
+  if (SvgIcon === null) {
+    return null;
+  }
+
+  return <SvgIcon className={classNames.join(" ")} />;
+};
+
+export default SpellSchoolIcon;
diff --git a/ddb_main/tools/js/smartComponents/Icons/TodoIcon/TodoIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/TodoIcon/TodoIcon.tsx
new file mode 100644
index 0000000..84fc099
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/TodoIcon/TodoIcon.tsx
@@ -0,0 +1,33 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  title: string;
+  className: string;
+  theme?: CharacterTheme;
+}
+
+export default class TodoIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    title: "Missing",
+    className: "",
+  };
+
+  render() {
+    const { title, className, theme } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-todo-icon"];
+
+    return (
+      <Tooltip
+        title={title}
+        className={classNames.join(" ")}
+        isDarkMode={theme?.isDarkMode}
+      >
+        !
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Icons/TodoIcon/index.ts b/ddb_main/tools/js/smartComponents/Icons/TodoIcon/index.ts
new file mode 100644
index 0000000..09ee28d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/TodoIcon/index.ts
@@ -0,0 +1,4 @@
+import TodoIcon from "./TodoIcon";
+
+export default TodoIcon;
+export { TodoIcon };
diff --git a/ddb_main/tools/js/smartComponents/Icons/VulnerabilityIcon/VulnerabilityIcon.tsx b/ddb_main/tools/js/smartComponents/Icons/VulnerabilityIcon/VulnerabilityIcon.tsx
new file mode 100644
index 0000000..fa486d8
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Icons/VulnerabilityIcon/VulnerabilityIcon.tsx
@@ -0,0 +1,43 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import {
+  DarkModeNegativeVulnerabilitySvg,
+  NegativeVulnerabilitySvg,
+} from "../../Svg";
+
+interface SvgInjectedProps {
+  className?: string;
+}
+
+interface Props {
+  title: string;
+  className: string;
+  theme?: CharacterTheme;
+  secondaryFill?: string;
+}
+export default class VulnerabilityIcon extends React.PureComponent<Props> {
+  static defaultProps = {
+    title: "Vulnerability",
+    className: "",
+    theme: {},
+  };
+
+  render() {
+    const { title, className, theme } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-vulnerability-icon"];
+
+    let SvgIcon: React.ComponentType<SvgInjectedProps> = theme?.isDarkMode
+      ? DarkModeNegativeVulnerabilitySvg
+      : NegativeVulnerabilitySvg;
+
+    return (
+      <Tooltip title={title} isDarkMode={theme?.isDarkMode}>
+        <SvgIcon className={classNames.join(" ")} />
+      </Tooltip>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/InfusionPreview/InfusionPreview.tsx b/ddb_main/tools/js/smartComponents/InfusionPreview/InfusionPreview.tsx
new file mode 100644
index 0000000..6fa0381
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/InfusionPreview/InfusionPreview.tsx
@@ -0,0 +1,103 @@
+import * as React from "react";
+
+import {
+  AccessUtils,
+  FormatUtils,
+  Infusion,
+  InfusionChoiceLookup,
+  InfusionUtils,
+  RuleData,
+  RuleDataUtils,
+  SnippetData,
+} from "@dndbeyond/character-rules-engine/es";
+
+import MarketplaceCta from "../MarketplaceCta";
+import Snippet from "../Snippet";
+
+interface Props {
+  infusion: Infusion;
+  infusionChoiceLookup: InfusionChoiceLookup;
+  snippetData: SnippetData;
+  ruleData: RuleData;
+  onClick?: (infusion: Infusion) => void;
+  proficiencyBonus: number;
+}
+class InfusionPreview extends React.PureComponent<Props> {
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick, infusion } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick(infusion);
+    }
+  };
+
+  renderDescription = (): React.ReactNode => {
+    const { infusion, ruleData, snippetData, proficiencyBonus } = this.props;
+
+    let contentNode: React.ReactNode;
+
+    if (AccessUtils.isAccessible(InfusionUtils.getAccessType(infusion))) {
+      let classLevel: number | null =
+        InfusionUtils.getSelectedModifierData(infusion)?.value ?? null;
+
+      contentNode = (
+        <Snippet
+          snippetData={snippetData}
+          classLevel={classLevel}
+          proficiencyBonus={proficiencyBonus}
+        >
+          {InfusionUtils.getSnippet(infusion)}
+        </Snippet>
+      );
+    } else {
+      const sources = InfusionUtils.getSources(infusion);
+
+      let sourceNames: Array<string> = [];
+      if (sources.length > 0) {
+        sources.forEach((source) => {
+          let sourceInfo = RuleDataUtils.getSourceDataInfo(
+            source.sourceId,
+            ruleData
+          );
+
+          if (sourceInfo !== null && sourceInfo.description !== null) {
+            sourceNames.push(sourceInfo.description);
+          }
+        });
+      }
+
+      contentNode = (
+        <MarketplaceCta
+          showImage={false}
+          sourceName={
+            sourceNames.length > 0
+              ? FormatUtils.renderNonOxfordCommaList(sourceNames)
+              : null
+          }
+          description="To unlock this infusion, check out the Marketplace to view purchase options."
+        />
+      );
+    }
+
+    return contentNode;
+  };
+
+  render() {
+    const { infusion } = this.props;
+
+    return (
+      <div className="ddbc-infusion-preview" onClick={this.handleClick}>
+        <div className="ddbc-infusion-preview__name">
+          Infusion: {InfusionUtils.getName(infusion)}
+        </div>
+        <div className="ddbc-infusion-preview__snippet">
+          {this.renderDescription()}
+        </div>
+      </div>
+    );
+  }
+}
+
+export default InfusionPreview;
diff --git a/ddb_main/tools/js/smartComponents/ItemPreview/ItemPreview.tsx b/ddb_main/tools/js/smartComponents/ItemPreview/ItemPreview.tsx
new file mode 100644
index 0000000..cf40932
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/ItemPreview/ItemPreview.tsx
@@ -0,0 +1,83 @@
+import * as React from "react";
+
+import {
+  CharacterTheme,
+  Item,
+  ItemUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { ItemName } from "~/components/ItemName";
+
+interface Props {
+  item: Item;
+  onClick?: (item: Item) => void;
+  theme: CharacterTheme;
+}
+class ItemPreview extends React.PureComponent<Props> {
+  handleClick = (evt: React.MouseEvent): void => {
+    const { onClick, item } = this.props;
+
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick(item);
+    }
+  };
+
+  renderMetaText = (): React.ReactNode => {
+    const { item } = this.props;
+
+    let metaItems: Array<string> = [];
+
+    if (ItemUtils.isLegacy(item)) {
+      metaItems.push("Legacy");
+    }
+
+    const type = ItemUtils.getType(item);
+    if (type) {
+      metaItems.push(type);
+    }
+
+    if (ItemUtils.isArmorContract(item)) {
+      let baseArmorName = ItemUtils.getBaseArmorName(item);
+      if (baseArmorName) {
+        metaItems.push(baseArmorName);
+      }
+    } else if (ItemUtils.isGearContract(item)) {
+      let subType = ItemUtils.getSubType(item);
+      if (subType) {
+        metaItems.push(subType);
+      }
+    }
+
+    return (
+      <div className="ddbc-item-preview__meta">
+        {metaItems.map((metaItem, idx) => (
+          <span className="ddbc-item-preview__meta-item" key={idx}>
+            {metaItem}
+          </span>
+        ))}
+      </div>
+    );
+  };
+
+  render() {
+    const { item } = this.props;
+
+    const imageStyles: React.CSSProperties = {
+      backgroundImage: `url(${ItemUtils.getAvatarUrl(item)})`,
+    };
+
+    return (
+      <div className="ddbc-item-preview" onClick={this.handleClick}>
+        <div className="ddbc-item-preview__avatar" style={imageStyles} />
+        <div className="ddbc-item-preview__name">
+          <ItemName item={item} />
+          {this.renderMetaText()}
+        </div>
+      </div>
+    );
+  }
+}
+
+export default ItemPreview;
diff --git a/ddb_main/tools/js/smartComponents/LoadingPlaceholder/LoadingPlaceholder.tsx b/ddb_main/tools/js/smartComponents/LoadingPlaceholder/LoadingPlaceholder.tsx
new file mode 100644
index 0000000..cd03c37
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/LoadingPlaceholder/LoadingPlaceholder.tsx
@@ -0,0 +1,18 @@
+import * as React from "react";
+
+import { AnimatedLoadingRingSvg } from "../Svg";
+
+interface LoadingPlaceholderProps {
+  label?: React.ReactNode;
+}
+
+const LoadingPlaceholder: React.FunctionComponent<LoadingPlaceholderProps> = ({
+  label = "Loading",
+}) => (
+  <div className="ddbc-loading-placeholder">
+    <AnimatedLoadingRingSvg className="ddbc-loading-placeholder__icon" />
+    <div className="ddbc-loading-placeholder__label">{label}</div>
+  </div>
+);
+
+export default React.memo(LoadingPlaceholder);
diff --git a/ddb_main/tools/js/smartComponents/LoadingPlaceholder/index.ts b/ddb_main/tools/js/smartComponents/LoadingPlaceholder/index.ts
new file mode 100644
index 0000000..a02e806
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/LoadingPlaceholder/index.ts
@@ -0,0 +1,4 @@
+import LoadingPlaceholder from "./LoadingPlaceholder";
+
+export default LoadingPlaceholder;
+export { LoadingPlaceholder };
diff --git a/ddb_main/tools/js/smartComponents/MarketplaceCta/MarketplaceCta.tsx b/ddb_main/tools/js/smartComponents/MarketplaceCta/MarketplaceCta.tsx
new file mode 100644
index 0000000..dc4a61d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/MarketplaceCta/MarketplaceCta.tsx
@@ -0,0 +1,62 @@
+import React from "react";
+
+import { FormatUtils } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  sourceName: string | null;
+  sourceNames?: Array<string>;
+  url: string;
+  description: string | null;
+  showImage: boolean;
+}
+export default class MarketplaceCta extends React.PureComponent<Props> {
+  static defaultProps = {
+    sourceName: null,
+    url: "/marketplace",
+    description: null,
+    showImage: true,
+  };
+
+  render() {
+    const { sourceName, sourceNames, url, description, showImage } = this.props;
+    const allSourceNames: Array<string> = [];
+
+    if (sourceName) {
+      allSourceNames.push(sourceName);
+    }
+
+    if (sourceNames) {
+      allSourceNames.push(...sourceNames);
+    }
+
+    return (
+      <div className="ddbc-marketplace-cta">
+        <a href={url} target="_blank">
+          <div className="ddbc-marketplace-cta__content">
+            {showImage && <div className="ddbc-marketplace-cta__image" />}
+            {allSourceNames.length > 0 && (
+              <div className="ddbc-marketplace-cta__header">
+                <div className="ddbc-marketplace-cta__header-intro">
+                  Available in
+                </div>
+                <div className="ddbc-marketplace-cta__header-title">
+                  {FormatUtils.renderNonOxfordCommaList(allSourceNames)}
+                </div>
+              </div>
+            )}
+            {description && (
+              <div className="ddbc-marketplace-cta__description">
+                {description}
+              </div>
+            )}
+            <div className="ddbc-marketplace-cta__cta">
+              <div className="ddbc-marketplace-cta__cta-button">
+                Go To Marketplace
+              </div>
+            </div>
+          </div>
+        </a>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/MarketplaceCta/index.ts b/ddb_main/tools/js/smartComponents/MarketplaceCta/index.ts
new file mode 100644
index 0000000..bccb6a3
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/MarketplaceCta/index.ts
@@ -0,0 +1,4 @@
+import MarketplaceCta from "./MarketplaceCta";
+
+export default MarketplaceCta;
+export { MarketplaceCta };
diff --git a/ddb_main/tools/js/smartComponents/NoteComponents/NoteComponents.tsx b/ddb_main/tools/js/smartComponents/NoteComponents/NoteComponents.tsx
new file mode 100644
index 0000000..3e3c291
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/NoteComponents/NoteComponents.tsx
@@ -0,0 +1,212 @@
+import * as React from "react";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  Note,
+  FormatUtils,
+  Constants,
+  NoteUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+import Damage from "../Damage";
+import { AoeTypeIcon, DisadvantageIcon } from "../Icons";
+import { AoeTypePropType } from "../Icons/IconConstants";
+
+interface Props {
+  notes: Array<Note>;
+  className: string;
+  theme: CharacterTheme;
+}
+export default class NoteComponents extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  renderPlainText = (note: Note): React.ReactNode => {
+    const { theme } = this.props;
+    let classNames: Array<string> = [
+      "ddbc-note-components__component",
+      "ddbc-note-components__component--plain",
+    ];
+
+    if (note.data.displayIntention) {
+      classNames.push(
+        `ddbc-note-components__component--${note.data.displayIntention}`
+      );
+    }
+
+    if (theme.isDarkMode) {
+      classNames.push("ddbc-note-components__component--dark-mode");
+    }
+
+    return <span className={classNames.join(" ")}>{note.data.text}</span>;
+  };
+
+  renderTooltip = (note: Note): React.ReactNode => {
+    const { theme } = this.props;
+    let classNames: Array<string> = [
+      "ddbc-note-components__component",
+      "ddbc-note-components__component--tooltip",
+    ];
+
+    if (note.data.displayIntention) {
+      classNames.push(
+        `ddbc-note-components__component--${note.data.displayIntention}`
+      );
+    }
+
+    if (theme.isDarkMode) {
+      classNames.push("ddbc-note-components__component--dark-mode");
+    }
+
+    return (
+      <Tooltip
+        className={classNames.join(" ")}
+        title={note.data.tooltip}
+        tippyOpts={note.data.tooltipOpts}
+        isDarkMode={theme.isDarkMode}
+      >
+        {note.data.text}
+      </Tooltip>
+    );
+  };
+
+  renderDistance = (note: Note): React.ReactNode => {
+    const { theme } = this.props;
+    let classNames: Array<string> = [
+      "ddbc-note-components__component",
+      "ddbc-note-components__component--distance",
+    ];
+
+    return (
+      <span className={classNames.join(" ")}>
+        <NumberDisplay type="distanceInFt" number={note.data.distance} />
+      </span>
+    );
+  };
+
+  renderAoeIcon = (note: Note): React.ReactNode => {
+    const { theme } = this.props;
+    let classNames: Array<string> = [
+      "ddbc-note-components__component",
+      "ddbc-note-components__component--aoe-icon",
+    ];
+
+    return (
+      <span className={classNames.join(" ")}>
+        <AoeTypeIcon
+          type={FormatUtils.slugify(note.data.type) as AoeTypePropType}
+          themeMode={theme?.isDarkMode ? "gray" : "dark"}
+        />
+      </span>
+    );
+    //`
+  };
+
+  renderDamage = (note: Note): React.ReactNode => {
+    const { theme } = this.props;
+    let classNames: Array<string> = [
+      "ddbc-note-components__component",
+      "ddbc-note-components__component--damage",
+    ];
+
+    return (
+      <span className={classNames.join(" ")}>
+        <Damage
+          theme={theme}
+          type={note.data.type}
+          damage={note.data.damage}
+          info={note.data.info}
+        />
+      </span>
+    );
+  };
+
+  renderDisadvantageIcon = (note: Note): React.ReactNode => {
+    const { theme } = this.props;
+
+    let classNames: Array<string> = [
+      "ddbc-note-components__component",
+      "ddbc-note-components__component--disadvantage-icon",
+    ];
+
+    return (
+      <span className={classNames.join(" ")}>
+        <DisadvantageIcon theme={theme} />
+      </span>
+    );
+  };
+
+  renderGroup = (
+    notes: Array<Note> | null,
+    separator: string = " ",
+    key: string | number | null = null
+  ): React.ReactNode => {
+    if (notes === null) {
+      return null;
+    }
+
+    return (
+      <React.Fragment key={key ? key : "start-note-group-key"}>
+        {notes.map((note, idx): React.ReactNode => {
+          if (note === null) {
+            return null;
+          }
+
+          return (
+            <React.Fragment key={`${NoteUtils.getType(note)}-${idx}`}>
+              {this.renderNote(note)}
+              {idx + 1 < notes.length ? separator : ""}
+            </React.Fragment>
+          );
+        })}
+      </React.Fragment>
+    );
+  };
+
+  renderNote = (note: Note | null): React.ReactNode => {
+    if (note === null) {
+      return null;
+    }
+
+    switch (NoteUtils.getType(note)) {
+      case Constants.NoteTypeEnum.PLAIN_TEXT:
+        return this.renderPlainText(note);
+      case Constants.NoteTypeEnum.TOOLTIP:
+        return this.renderTooltip(note);
+      case Constants.NoteTypeEnum.DISTANCE:
+        return this.renderDistance(note);
+      case Constants.NoteTypeEnum.AOE_ICON:
+        return this.renderAoeIcon(note);
+      case Constants.NoteTypeEnum.DAMAGE:
+        return this.renderDamage(note);
+      case Constants.NoteTypeEnum.DISADVANTAGE_ICON:
+        return this.renderDisadvantageIcon(note);
+      case Constants.NoteTypeEnum.GROUP:
+        return this.renderGroup(
+          note.data.notes,
+          note.data.separator,
+          note.data.key
+        );
+      default:
+      // not implement
+    }
+
+    return null;
+  };
+
+  render() {
+    const { notes, className } = this.props;
+
+    let classNames: Array<string> = [className, "ddbc-note-components"];
+
+    return (
+      <div className={classNames.join(" ")}>
+        {this.renderGroup(notes, ", ")}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/NoteComponents/index.ts b/ddb_main/tools/js/smartComponents/NoteComponents/index.ts
new file mode 100644
index 0000000..45093f1
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/NoteComponents/index.ts
@@ -0,0 +1,4 @@
+import NoteComponents from "./NoteComponents";
+
+export default NoteComponents;
+export { NoteComponents };
diff --git a/ddb_main/tools/js/smartComponents/PrerequisiteFailureSummary/PrerequisiteFailureSummary.tsx b/ddb_main/tools/js/smartComponents/PrerequisiteFailureSummary/PrerequisiteFailureSummary.tsx
new file mode 100644
index 0000000..fcf3f95
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/PrerequisiteFailureSummary/PrerequisiteFailureSummary.tsx
@@ -0,0 +1,44 @@
+import clsx from "clsx";
+import * as React from "react";
+
+import { PrerequisiteFailure } from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  className: string;
+  failures: Array<Array<PrerequisiteFailure>>;
+}
+
+export default class PrerequisiteFailureSummary extends React.PureComponent<
+  Props,
+  {}
+> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { failures, className } = this.props;
+
+    let strings: string = failures
+      .map((failure) =>
+        failure
+          .map((failureAnd) => failureAnd.data.requiredDescription)
+          .reduce((acc, desc, idx) => {
+            let connector: string = "";
+            if (idx < failure.length - 2) {
+              connector = ", ";
+            } else if (idx < failure.length - 1) {
+              connector = " and ";
+            }
+            acc += `${desc}${connector}`;
+            return acc;
+          }, "")
+      )
+      .join(" or ");
+    return (
+      <div className={clsx(["ddbc-prerequisite-failure-summary", className])}>
+        Missing: {strings.length > 0 ? strings : "Unknown"}
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/PrerequisiteFailureSummary/index.ts b/ddb_main/tools/js/smartComponents/PrerequisiteFailureSummary/index.ts
new file mode 100644
index 0000000..58fa506
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/PrerequisiteFailureSummary/index.ts
@@ -0,0 +1,4 @@
+import PrerequisiteFailureSummary from "./PrerequisiteFailureSummary";
+
+export default PrerequisiteFailureSummary;
+export { PrerequisiteFailureSummary };
diff --git a/ddb_main/tools/js/smartComponents/PrivacyTypeRadio/PrivacyTypeRadio.tsx b/ddb_main/tools/js/smartComponents/PrivacyTypeRadio/PrivacyTypeRadio.tsx
new file mode 100644
index 0000000..205e4e9
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/PrivacyTypeRadio/PrivacyTypeRadio.tsx
@@ -0,0 +1,128 @@
+import {
+  FormControl,
+  FormControlLabel,
+  Radio,
+  RadioGroup,
+  SxProps,
+  Theme,
+} from "@mui/material";
+import clsx from "clsx";
+
+import { Constants } from "@dndbeyond/character-rules-engine";
+
+import styles from "./styles.module.css";
+
+interface PrivacyTypeRadioProps {
+  color?: "primary" | "secondary" | "success" | "error" | "warning" | "info";
+  themeColor?: string;
+  compact?: boolean;
+  darkMode?: boolean;
+  handleChange?: (e, value) => void;
+  initialValue?: number | null;
+  sx?: SxProps<Theme>;
+  variant?: "builder" | "sidebar" | "default";
+  themed?: boolean;
+}
+
+const privacyOptions = [
+  {
+    value: Constants.PreferencePrivacyTypeEnum.CAMPAIGN_ONLY,
+    label: "Campaign Only",
+    description:
+      "Only others within a Campaign you have joined can view your Characters.",
+  },
+  {
+    value: Constants.PreferencePrivacyTypeEnum.PUBLIC,
+    label: "Public",
+    description: "Anyone with a shared link can view your Characters.",
+  },
+  {
+    value: Constants.PreferencePrivacyTypeEnum.PRIVATE,
+    label: "Private",
+    description: "Only you can view your Characters.",
+  },
+];
+
+const PrivacyTypeRadio = ({
+  color,
+  compact,
+  darkMode,
+  initialValue,
+  handleChange,
+  sx,
+  themeColor,
+  variant = "default",
+  themed = false,
+}: PrivacyTypeRadioProps) => {
+  return (
+    <FormControl
+      sx={sx}
+      className={clsx([
+        styles.container,
+        variant === "sidebar" && styles.containerSidebar,
+        variant === "builder" && styles.containerBuilder,
+      ])}
+    >
+      <label
+        id="character-privacy-radio"
+        className={clsx([
+          styles.heading,
+          variant === "sidebar" && styles.headingSidebar,
+          variant === "builder" && styles.headingBuilder,
+          darkMode && styles.headingSidebarDark,
+        ])}
+      >
+        Character Privacy
+      </label>
+      <RadioGroup
+        aria-labelledby="character-privacy-radio"
+        name="controlled-radio-buttons-group"
+        value={initialValue}
+        onChange={handleChange}
+        className={clsx([styles.radioGroup])}
+      >
+        {privacyOptions.map((option, i) => (
+          <FormControlLabel
+            key={option.value + i}
+            value={option.value}
+            control={
+              <Radio
+                className={clsx([
+                  initialValue === option.value && styles.buttonChecked,
+                  initialValue === option.value && themed && styles.themed,
+                  variant === "builder" &&
+                    initialValue === option.value &&
+                    styles.buttonCheckedBuilder,
+                ])}
+              />
+            }
+            label={
+              <div className={clsx(styles.radioInfoGroup)}>
+                <label
+                  className={clsx([
+                    styles.radioHeading,
+                    variant === "sidebar" && styles.radioHeadingSidebar,
+                    variant === "builder" && styles.radioHeadingBuilder,
+                  ])}
+                >
+                  {option.label}
+                </label>
+                <label
+                  className={clsx([
+                    styles.radioDescription,
+                    variant === "sidebar" && styles.radioDescriptionSidebar,
+                    darkMode && styles.radioDescriptionDark,
+                  ])}
+                >
+                  {option.description}
+                </label>
+              </div>
+            }
+          />
+        ))}
+      </RadioGroup>
+    </FormControl>
+  );
+};
+
+export default PrivacyTypeRadio;
diff --git a/ddb_main/tools/js/smartComponents/PrivacyTypeRadio/index.ts b/ddb_main/tools/js/smartComponents/PrivacyTypeRadio/index.ts
new file mode 100644
index 0000000..9c8e202
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/PrivacyTypeRadio/index.ts
@@ -0,0 +1,4 @@
+import PrivacyTypeRadio from "./PrivacyTypeRadio";
+
+export default PrivacyTypeRadio;
+export { PrivacyTypeRadio };
diff --git a/ddb_main/tools/js/smartComponents/SavingThrowsSummary/SavingThrowsSummary.tsx b/ddb_main/tools/js/smartComponents/SavingThrowsSummary/SavingThrowsSummary.tsx
new file mode 100644
index 0000000..69c7d0a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/SavingThrowsSummary/SavingThrowsSummary.tsx
@@ -0,0 +1,195 @@
+import { visuallyHidden } from "@mui/utils";
+import { useContext } from "react";
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  AbilityManager,
+  CharacterTheme,
+  FormatUtils,
+  SituationalSavingThrowInfo,
+  SituationalSavingThrowInfoLookup,
+} from "@dndbeyond/character-rules-engine/es";
+import { DiceTools, IRollContext, RollType } from "@dndbeyond/dice";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+import BoxBackground from "../BoxBackground";
+import { ProficiencyLevelIcon } from "../Icons";
+import {
+  ThemedSavingThrowSelectionBoxSvg,
+  ThemedSavingThrowSelectionSmallBoxSvg,
+  ThemedSavingThrowRowBoxSvg,
+  ThemedSavingThrowRowSmallBoxSvg,
+  NegativeBonusNegativeSvg,
+  PositiveBonusPositiveSvg,
+  DarkModePositiveBonusPositiveSvg,
+  DarkModeNegativeBonusNegativeSvg,
+} from "../Svg";
+import { isNotNullOrUndefined } from "../utils/TypeScriptUtils";
+import { DigitalDiceWrapper } from "../Dice";
+import { NumberDisplay } from "~/components/NumberDisplay";
+
+interface Props {
+  abilities: Array<AbilityManager>;
+  situationalBonusSavingThrowsLookup: SituationalSavingThrowInfoLookup;
+  onClick?: (ability: AbilityManager) => void;
+  rowStyle?: "small" | "normal";
+  className?: string;
+  diceEnabled?: boolean;
+  theme: CharacterTheme;
+  rollContext: IRollContext;
+};
+
+export default function SavingThrowsSummary({
+  abilities,
+  situationalBonusSavingThrowsLookup,
+  onClick = (ability: AbilityManager) => {},
+  theme,
+  rollContext,
+  className = "",
+  diceEnabled = false,
+  rowStyle = "normal",
+}: Props) {
+  const handleClick = (
+    ability: AbilityManager,
+    evt: React.MouseEvent
+  ): void => {
+    if (onClick) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+      onClick(ability);
+    }
+  };
+
+  const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+    useContext(GameLogContext);
+
+  return (
+    <div className="ddbc-saving-throws-summary">
+      {abilities.map((ability) => {
+        let situationalBonusSavingThrows: Array<SituationalSavingThrowInfo> =
+          [];
+        let maxOptBonus: number = 0;
+
+        if (situationalBonusSavingThrowsLookup) {
+          situationalBonusSavingThrows =
+            situationalBonusSavingThrowsLookup[ability.getId()];
+          if (
+            situationalBonusSavingThrows &&
+            situationalBonusSavingThrows.length
+          ) {
+            let situationalBonusSavingThrowsValues: Array<number> =
+              situationalBonusSavingThrows.map((optBonus) => optBonus.value);
+            maxOptBonus = Math.max(...situationalBonusSavingThrowsValues);
+          }
+        }
+
+        let situationalBonusClasses: Array<string> = [
+          "ddbc-saving-throws-summary__ability-situational",
+        ];
+        let IconComponent: React.ComponentType<any> | null = null;
+        if (maxOptBonus < 0) {
+          situationalBonusClasses.push(
+            "ddbc-saving-throws-summary__ability-situational--bonus-neg"
+          );
+          IconComponent = theme?.isDarkMode
+            ? DarkModeNegativeBonusNegativeSvg
+            : NegativeBonusNegativeSvg;
+        } else {
+          situationalBonusClasses.push(
+            "ddbc-saving-throws-summary__ability-situational--bonus-pos"
+          );
+          IconComponent = theme?.isDarkMode
+            ? DarkModePositiveBonusPositiveSvg
+            : PositiveBonusPositiveSvg;
+        }
+
+        let StyleComponent: React.ComponentType<any> =
+          ThemedSavingThrowRowBoxSvg;
+        let SelectionBox = ThemedSavingThrowSelectionBoxSvg;
+        if (rowStyle === "small") {
+          StyleComponent = ThemedSavingThrowRowSmallBoxSvg;
+          SelectionBox = ThemedSavingThrowSelectionSmallBoxSvg;
+        }
+
+        return (
+          <div
+            key={ability.getStatKey()}
+            className={`ddbc-saving-throws-summary__ability ddbc-saving-throws-summary__ability--${FormatUtils.slugify(
+              ability.getStatKey()
+            )}`}
+            onClick={(event) => handleClick(ability, event)}
+          >
+            <BoxBackground
+              StyleComponent={StyleComponent}
+              theme={{
+                ...theme,
+                themeColor: `${theme.themeColor}80`,
+              }}
+            />
+            <h3 style={visuallyHidden}>{ability.getLabel()} Saving Throw</h3>
+            <div className="ddbc-saving-throws-summary__ability-proficiency">
+              <ProficiencyLevelIcon
+                proficiencyLevel={ability.getProficiencyLevel()}
+                isModified={ability.getIsSaveProficiencyModified()}
+                theme={theme}
+              />
+            </div>
+            <div
+              className={`ddbc-saving-throws-summary__ability-name ${
+                theme.isDarkMode
+                  ? "ddbc-saving-throws-summary__ability-name--dark-mode"
+                  : ""
+              }`}
+            >
+              <abbr
+                title={ability.getLabel() ?? "Unknown Saving Throw"}
+                aria-hidden={true}
+              >
+                {ability.getName()}
+              </abbr>
+            </div>
+            <div className="ddbc-saving-throws-summary__ability-modifier">
+              <DigitalDiceWrapper
+                diceNotation={DiceTools.CustomD20(ability.getSave())}
+                rollType={RollType.Save}
+                rollAction={ability.getName()}
+                diceEnabled={diceEnabled}
+                themeColor={theme.themeColor}
+                rollContext={rollContext}
+                rollTargetOptions={
+                  messageTargetOptions?.entities
+                    ? Object.values(messageTargetOptions.entities).filter(
+                        isNotNullOrUndefined
+                      )
+                    : undefined
+                }
+                rollTargetDefault={defaultMessageTargetOption}
+                userId={Number(userId)}
+              >
+                <NumberDisplay
+                  number={ability.getSave()}
+                  type="signed"
+                  isModified={ability.getIsSaveModifierModified()}
+                />
+              </DigitalDiceWrapper>
+              <SelectionBox
+                theme={theme}
+                className={`ddbc-saving-throws-summary__ability-modifier-background`}
+              />
+            </div>
+            {situationalBonusSavingThrows &&
+              situationalBonusSavingThrows.length > 0 && (
+                <Tooltip
+                  className={situationalBonusClasses.join(" ")}
+                  isDarkMode={theme.isDarkMode}
+                  title={`Situational Bonus${
+                    situationalBonusSavingThrows.length !== 1 ? "es" : ""
+                  }`}
+                >
+                  <IconComponent className="ddbc-saving-throws-summary__ability-situational-icon" />
+                </Tooltip>
+              )}
+          </div>
+        );
+      })}
+    </div>
+  );
+};
diff --git a/ddb_main/tools/js/smartComponents/Snippet/Snippet.tsx b/ddb_main/tools/js/smartComponents/Snippet/Snippet.tsx
new file mode 100644
index 0000000..de0c26a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Snippet/Snippet.tsx
@@ -0,0 +1,135 @@
+import * as React from "react";
+import JsxParser from "react-jsx-parser";
+
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  CharacterTheme,
+  Constants,
+  EntityLimitedUseContract,
+  LevelScaleContract,
+  SnippetContextData,
+  SnippetData,
+  SnippetUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { HtmlContent } from "~/components/HtmlContent";
+
+interface Props {
+  snippetData: SnippetData;
+  levelScale?: LevelScaleContract | null;
+  classLevel?: number | null;
+  limitedUse?: EntityLimitedUseContract | null;
+  className: string;
+  parseSnippet: boolean;
+  theme?: CharacterTheme;
+  proficiencyBonus: number;
+}
+export default class Snippet extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+    parseSnippet: true,
+  };
+
+  convertSnippetToHtml = (snippetString: string): string => {
+    const {
+      levelScale,
+      classLevel,
+      limitedUse,
+      snippetData,
+      proficiencyBonus,
+      theme,
+    } = this.props;
+
+    let contextData: SnippetContextData = {};
+    if (levelScale) {
+      contextData.levelScale = levelScale;
+    }
+    if (classLevel) {
+      contextData.classLevel = classLevel;
+    }
+    if (limitedUse) {
+      contextData.limitedUse = limitedUse;
+    }
+
+    const snippetChunks = SnippetUtils.generateSnippetChunks(
+      snippetString,
+      contextData,
+      snippetData,
+      proficiencyBonus
+    );
+    const htmlChunkString: string = snippetChunks
+      .map((contentChunk) => {
+        switch (contentChunk.type) {
+          case Constants.SnippetContentChunkTypeEnum.TAG:
+            switch (contentChunk.data.type) {
+              case Constants.SnippetTagDataTypeEnum.ERROR:
+                let messageParts: Array<string> = [];
+                if (contentChunk.data.raw.trim()) {
+                  messageParts.push(contentChunk.data.raw);
+                }
+                messageParts.push(contentChunk.data.value);
+                return `<span class="ddbc-snippet__tag--error" title="${
+                  contentChunk.data.raw
+                }">${messageParts.join(" - ")}</span>`;
+
+              case Constants.SnippetTagDataTypeEnum.NUMBER:
+                return `<Tooltip isDarkMode="${theme?.isDarkMode}" title="${
+                  contentChunk.data.raw
+                }"><span class="ddbc-snippet__tag">${contentChunk.data.value.toLocaleString()}</span></Tooltip>`;
+
+              case Constants.SnippetTagDataTypeEnum.STRING:
+              default:
+                return `<Tooltip isDarkMode="${theme?.isDarkMode}" title="${contentChunk.data.raw}"><span class="ddbc-snippet__tag">${contentChunk.data.value}</span></Tooltip>`;
+            }
+
+          case Constants.SnippetContentChunkTypeEnum.TEXT:
+          default:
+            return contentChunk.data;
+        }
+      })
+      .join("");
+
+    const finalHtmlString: string = htmlChunkString
+      .replace(/[{}]/g, "")
+      .replace(/\s*\n+?\s*\n*/g, "</p><p>");
+
+    return `<p>${finalHtmlString}</p>`;
+  };
+
+  render() {
+    const { children, className, parseSnippet, theme } = this.props;
+
+    if (!children) {
+      return null;
+    }
+
+    let classNames: Array<string> = ["ddbc-snippet", className];
+    if (parseSnippet) {
+      classNames.push("ddbc-snippet--parsed");
+    } else {
+      classNames.push("ddbc-snippet--unparsed");
+    }
+    if (theme?.isDarkMode) {
+      classNames.push("ddbc-snippet--dark-mode");
+    }
+
+    let contentNode: React.ReactNode;
+    if (typeof children === "string") {
+      if (parseSnippet) {
+        contentNode = (
+          <JsxParser
+            className="ddbc-snippet__content"
+            components={{ Tooltip }}
+            jsx={this.convertSnippetToHtml(children)}
+          />
+        );
+      } else {
+        contentNode = (
+          <HtmlContent className="ddbc-snippet__content" html={children} />
+        );
+      }
+    }
+
+    return <div className={classNames.join(" ")}>{contentNode}</div>;
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Snippet/index.ts b/ddb_main/tools/js/smartComponents/Snippet/index.ts
new file mode 100644
index 0000000..f918775
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Snippet/index.ts
@@ -0,0 +1,4 @@
+import Snippet from "./Snippet";
+
+export default Snippet;
+export { Snippet };
diff --git a/ddb_main/tools/js/smartComponents/SpellDamageEffect/SpellDamageEffect.tsx b/ddb_main/tools/js/smartComponents/SpellDamageEffect/SpellDamageEffect.tsx
new file mode 100644
index 0000000..552af2c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/SpellDamageEffect/SpellDamageEffect.tsx
@@ -0,0 +1,302 @@
+import * as React from "react";
+import { Tooltip } from "@dndbeyond/character-common-components/es";
+import {
+  ConditionUtils,
+  DiceUtils,
+  HigherLevelContract,
+  HigherLevelEntryContract,
+  ModifierUtils,
+  RuleData,
+  RuleDataUtils,
+  Spell,
+  SpellConditionContract,
+  SpellModifierContract,
+  SpellUtils,
+  CharacterTheme,
+} from "@dndbeyond/character-rules-engine/es";
+import { RollType, RollKind, IRollContext } from "@dndbeyond/dice";
+import { GameLogContext } from "@dndbeyond/game-log-components";
+import { HealingIcon } from "../Icons";
+import { DiceComponentUtils } from "../utils";
+import { DigitalDiceWrapper } from "../Dice";
+import Damage from "../Damage";
+
+interface Props {
+  spell: Spell;
+  castLevel: number;
+  characterLevel: number;
+  ruleData: RuleData;
+  diceEnabled: boolean;
+  theme: CharacterTheme;
+  isCriticalHit?: boolean;
+  rollContext: IRollContext;
+}
+class SpellDamageEffect extends React.PureComponent<Props> {
+  static defaultProps = {
+    diceEnabled: false,
+  };
+
+  getPoints = (
+    atHigherLevels: HigherLevelContract | null
+  ): Array<HigherLevelEntryContract> => {
+    let points: Array<HigherLevelEntryContract> = [];
+    if (atHigherLevels && atHigherLevels.points !== null) {
+      points = atHigherLevels.points;
+    }
+    return points;
+  };
+
+  render() {
+    const {
+      spell,
+      castLevel,
+      characterLevel,
+      ruleData,
+      diceEnabled,
+      theme,
+      isCriticalHit,
+      rollContext,
+    } = this.props;
+
+    const [{ messageTargetOptions, defaultMessageTargetOption, userId }] =
+      this.context;
+
+    let isScaled: boolean = false;
+    const modifiers = SpellUtils.getModifiers(spell);
+    const tags = SpellUtils.getTags(spell);
+    const conditions = SpellUtils.getConditions(spell);
+
+    let displayNode: React.ReactNode;
+    let damageModifiers = modifiers.filter((modifier) =>
+      ModifierUtils.isSpellDamageModifier(modifier)
+    );
+    if (damageModifiers.length) {
+      let modifier: SpellModifierContract = damageModifiers[0];
+      const friendlySubtypeName =
+        ModifierUtils.getFriendlySubtypeName(modifier);
+      const atHigherLevels = ModifierUtils.getAtHigherLevels(modifier);
+      let scaleType = SpellUtils.getScaleType(spell);
+      let points = this.getPoints(atHigherLevels);
+      let atHigherDamage = SpellUtils.getSpellScaledAtHigher(
+        spell,
+        scaleType,
+        points,
+        characterLevel,
+        castLevel
+      );
+      let scaledDamageDie = SpellUtils.getSpellFinalScaledDie(
+        spell,
+        modifier,
+        atHigherDamage
+      );
+      isScaled =
+        isScaled ||
+        SpellUtils.isSpellScaledByCastLevel(
+          spell,
+          scaleType,
+          points,
+          castLevel
+        );
+
+      displayNode = (
+        <span className="ddbc-spell-damage-effect__damages">
+          <DigitalDiceWrapper
+            diceNotation={DiceUtils.renderDice(scaledDamageDie)}
+            rollType={RollType.Damage}
+            rollAction={SpellUtils.getName(spell)}
+            rollKind={isCriticalHit ? RollKind.CriticalHit : RollKind.None}
+            diceEnabled={diceEnabled}
+            themeColor={theme.themeColor}
+            rollContext={rollContext}
+            rollTargetOptions={
+              messageTargetOptions
+                ? Object.values(messageTargetOptions?.entities)
+                : undefined
+            }
+            rollTargetDefault={defaultMessageTargetOption}
+            userId={userId}
+          >
+            <Damage
+              damage={DiceComponentUtils.getDamageDiceNotation(
+                scaledDamageDie,
+                isCriticalHit
+              )}
+              type={friendlySubtypeName || ""}
+              showInfoTooltip={false}
+              theme={theme}
+            />
+          </DigitalDiceWrapper>
+        </span>
+      );
+    }
+
+    let hitPointHealingModifiers = modifiers.filter((modifier) =>
+      ModifierUtils.isSpellHealingHitPointsModifier(modifier)
+    );
+    if (!displayNode && hitPointHealingModifiers.length) {
+      let modifier: SpellModifierContract = hitPointHealingModifiers[0];
+      const atHigherLevels = ModifierUtils.getAtHigherLevels(modifier);
+      let scaleType = SpellUtils.getScaleType(spell);
+      let points = this.getPoints(atHigherLevels);
+      let atHigherHealing = SpellUtils.getSpellScaledAtHigher(
+        spell,
+        scaleType,
+        points,
+        characterLevel,
+        castLevel
+      );
+      let scaledHealingDie = SpellUtils.getSpellFinalScaledDie(
+        spell,
+        modifier,
+        atHigherHealing,
+        castLevel
+      );
+      isScaled =
+        isScaled ||
+        SpellUtils.isSpellScaledByCastLevel(
+          spell,
+          scaleType,
+          points,
+          castLevel
+        );
+
+      displayNode = (
+        <span className="ddbc-spell-damage-effect__healing ddbc-spell-damage-effect__healing--hp">
+          <DigitalDiceWrapper
+            useAdvancedMenu={false}
+            diceNotation={DiceUtils.renderDice(scaledHealingDie)}
+            rollType={RollType.Heal}
+            rollAction={SpellUtils.getName(spell)}
+            diceEnabled={diceEnabled}
+            rollContext={rollContext}
+            rollTargetOptions={
+              messageTargetOptions
+                ? Object.values(messageTargetOptions?.entities)
+                : undefined
+            }
+            rollTargetDefault={defaultMessageTargetOption}
+            userId={userId}
+          >
+            {DiceUtils.renderDice(scaledHealingDie)}{" "}
+            <HealingIcon theme={theme} isHp={true} />
+          </DigitalDiceWrapper>
+        </span>
+      );
+    }
+
+    const tempHitPointHealingModifiers = modifiers.filter((modifier) =>
+      ModifierUtils.isSpellHealingTempHitPointsModifier(modifier)
+    );
+    if (!displayNode && tempHitPointHealingModifiers.length) {
+      let modifier = tempHitPointHealingModifiers[0];
+      const atHigherLevels = ModifierUtils.getAtHigherLevels(modifier);
+      let scaleType = SpellUtils.getScaleType(spell);
+      let points = this.getPoints(atHigherLevels);
+      let atHigherHealing = SpellUtils.getSpellScaledAtHigher(
+        spell,
+        scaleType,
+        points,
+        characterLevel,
+        castLevel
+      );
+      let scaledHealingDie = SpellUtils.getSpellFinalScaledDie(
+        spell,
+        modifier,
+        atHigherHealing,
+        castLevel
+      );
+      isScaled =
+        isScaled ||
+        SpellUtils.isSpellScaledByCastLevel(
+          spell,
+          scaleType,
+          points,
+          castLevel
+        );
+
+      displayNode = (
+        <span className="ddbc-spell-damage-effect__healing ddbc-spell-damage-effect__healing--temp">
+          <DigitalDiceWrapper
+            useAdvancedMenu={false}
+            diceNotation={DiceUtils.renderDice(scaledHealingDie)}
+            rollType={RollType.Heal}
+            rollAction={SpellUtils.getName(spell)}
+            diceEnabled={diceEnabled}
+            rollContext={rollContext}
+            rollTargetOptions={
+              messageTargetOptions
+                ? Object.values(messageTargetOptions?.entities)
+                : undefined
+            }
+            rollTargetDefault={defaultMessageTargetOption}
+            userId={userId}
+          >
+            {DiceUtils.renderDice(scaledHealingDie)}{" "}
+            <HealingIcon theme={theme} isTemp={true} />
+          </DigitalDiceWrapper>
+        </span>
+      );
+    }
+
+    if (!displayNode && conditions.length) {
+      let spellCondition: SpellConditionContract = conditions[0];
+      let condition = RuleDataUtils.getCondition(
+        spellCondition.conditionId,
+        ruleData
+      );
+      let name: string =
+        condition === null ? "" : ConditionUtils.getName(condition);
+      displayNode = (
+        <span
+          className={`ddbc-spell-damage-effect__conditions ${
+            theme.isDarkMode
+              ? "ddbc-spell-damage-effect__conditions--dark-mode"
+              : ""
+          }`}
+        >
+          <Tooltip
+            isDarkMode={theme.isDarkMode}
+            title={`${name}${
+              spellCondition.exception ? `, ${spellCondition.exception}` : ""
+            }`}
+          >
+            {name}
+          </Tooltip>
+        </span>
+      );
+    }
+
+    if (!displayNode && tags.length) {
+      displayNode = (
+        <span
+          className={`ddbc-spell-damage-effect__tags ${
+            theme.isDarkMode ? "ddbc-spell-damage-effect__tags--dark-mode" : ""
+          }`}
+        >
+          {tags[0]}
+        </span>
+      );
+    }
+
+    let hasMore: boolean = damageModifiers.length > 1;
+    hasMore = hasMore || hitPointHealingModifiers.length > 1;
+    hasMore = hasMore || tempHitPointHealingModifiers.length > 1;
+    hasMore = hasMore || conditions.length > 1;
+    hasMore = hasMore || tags.length > 1;
+
+    return (
+      <div
+        className={`ddbc-spell-damage-effect  ${
+          isScaled ? "ddbc-spell-damage-effect--scaled" : ""
+        } ${theme.isDarkMode ? "ddbc-spell-damage-effect--dark-mode" : ""}`}
+      >
+        {displayNode}
+        {hasMore ? "*" : ""}
+      </div>
+    );
+  }
+}
+
+SpellDamageEffect.contextType = GameLogContext;
+
+export default SpellDamageEffect;
diff --git a/ddb_main/tools/js/smartComponents/SpellDamageEffect/index.ts b/ddb_main/tools/js/smartComponents/SpellDamageEffect/index.ts
new file mode 100644
index 0000000..42b1c04
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/SpellDamageEffect/index.ts
@@ -0,0 +1,4 @@
+import SpellDamageEffect from "./SpellDamageEffect";
+
+export default SpellDamageEffect;
+export { SpellDamageEffect };
diff --git a/ddb_main/tools/js/smartComponents/Svg/BaseSvg/BaseSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/BaseSvg/BaseSvg.tsx
new file mode 100644
index 0000000..5d2d9de
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/BaseSvg/BaseSvg.tsx
@@ -0,0 +1,31 @@
+import * as React from "react";
+
+interface Props {
+  className: string;
+  viewBox: string;
+  preserveAspectRatio?: string;
+}
+
+export default class BaseSvg extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+    viewBox: "0 0 100 100",
+  };
+
+  render() {
+    const { className, viewBox, children, preserveAspectRatio } = this.props;
+
+    let classNames: Array<string> = ["ddbc-svg", className];
+
+    return (
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox={viewBox}
+        className={classNames.join(" ")}
+        preserveAspectRatio={preserveAspectRatio}
+      >
+        {children}
+      </svg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/BaseSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/BaseSvg/index.ts
new file mode 100644
index 0000000..ad15766
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/BaseSvg/index.ts
@@ -0,0 +1,5 @@
+import BaseSvg from "./BaseSvg";
+
+export default BaseSvg;
+export * from "./BaseSvgTypings";
+export { BaseSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/SvgConstants.ts b/ddb_main/tools/js/smartComponents/Svg/SvgConstants.ts
new file mode 100644
index 0000000..97e1194
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/SvgConstants.ts
@@ -0,0 +1,46 @@
+export const SvgConstantDarkModeBackgroundColor = "#10161A";
+
+export const SvgConstantLightTheme = {
+  fill: "#fff",
+  secondaryFill: "#242528",
+};
+export const SvgConstantDarkTheme = {
+  fill: "#242528",
+  secondaryFill: "#fff",
+};
+export const SvgConstantGrayTheme = {
+  fill: "#b0b7bd",
+  secondaryFill: "#242528",
+};
+export const SvgConstantDisabledTheme = {
+  fill: "#999999",
+  secondaryFill: "#fff",
+};
+export const SvgConstantEmptyTheme = {
+  fill: "#d8d8d8",
+  secondaryFill: "#fff",
+};
+export const SvgConstantPositiveTheme = {
+  fill: "#00c680",
+  secondaryFill: "#fff",
+};
+export const SvgConstantNegativeTheme = {
+  fill: "#e40712",
+  secondaryFill: "#fff",
+};
+export const SvgConstantBuilderTheme = {
+  fill: "#1C9AEF",
+  secondaryFill: "#fff",
+};
+export const SvgConstantModifiedTheme = {
+  fill: "#1C9AEF",
+  secondaryFill: "#1C9AEF",
+};
+export const SvgConstantDarkModePositiveTheme = {
+  fill: "#00c680",
+  secondaryFill: SvgConstantDarkModeBackgroundColor,
+};
+export const SvgConstantDarkModeNegativeTheme = {
+  fill: "#e40712",
+  secondaryFill: SvgConstantDarkModeBackgroundColor,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/CharaismaSvg/CharismaSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/abilities/CharaismaSvg/CharismaSvg.tsx
new file mode 100644
index 0000000..6fb1002
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/CharaismaSvg/CharismaSvg.tsx
@@ -0,0 +1,42 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class CharismaSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor, secondaryFillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 36.89 29.81" className={className}>
+        <path
+          fill={secondaryFillColor}
+          d="M11.26,9.5a12.63,12.63,0,0,0-3.6,2.44,2.06,2.06,0,0,0,2,1.75,2.8,2.8,0,0,0,2.49-2.45A2.13,2.13,0,0,0,11.26,9.5Z"
+        />
+        <path
+          fill={fillColor}
+          d="M35.18,29.31a10.94,10.94,0,0,0,.08-4.38,4.24,4.24,0,0,0,1.63,2,17.82,17.82,0,0,1-2.07-8.2s.61,1.65,1.38,3.59c0,0,.32-1.84-1.16-6.76a37.09,37.09,0,0,1,1.52,4.55s-.1-11.94-5.1-14.83c0,0,1.22-.14,4.63,4.39,0,0-2.57-6.19-7.76-7.91l4.51,1.34S29.87.47,22.11.59c0,0,3.38-.37,4.08-.05,0,0-9.76-2.63-16.74,3.72,0,0-2.32.08-3,.73,0,0-2.36-.48-5,2.14-3.13,3.07-.29,6.57,1.25,8a3.78,3.78,0,0,1,.42-2.87s2,1.31,6.06,1c11.25-.74,8,4,4.39,7.46,0,0-1.87,1.75-5.54,5.58,0,0,5.56-1.68,6.42-2.75a10.86,10.86,0,0,1,1.78,3.57,8.09,8.09,0,0,0,1.72-3,9.1,9.1,0,0,0,.42,2.11,2.47,2.47,0,0,0,.94-1,4.83,4.83,0,0,0,.68,1.54,3.46,3.46,0,0,0,.55-1.54,6.4,6.4,0,0,0,1.82,3.36,3.52,3.52,0,0,0,.55-1.8,2.35,2.35,0,0,0,.73,1,11.67,11.67,0,0,0,.83-4.24s.47,4.32,2.08,5.81a5.41,5.41,0,0,0,.63-2.68,39.45,39.45,0,0,0,4.36,3.15,5.51,5.51,0,0,1-.7-2.45S30.75,27.56,35.18,29.31Z"
+        />
+        <path
+          fill={secondaryFillColor}
+          d="M16.29,4.95c0,1,1.6,1.75,2.56,1.75a1.74,1.74,0,0,0,1.4-2.79,21.32,21.32,0,0,0-3.77.49A1,1,0,0,0,16.29,4.95Z"
+        />
+        <path
+          fill="none"
+          stroke={secondaryFillColor}
+          strokeMiterlimit={10}
+          d="M9.37,15.38a6.18,6.18,0,0,1,5.37-2.71c3.83,0,1.17-1.87-2.33-2.54s-.33-5.67-8-7"
+        />
+        <path
+          fill="none"
+          stroke={secondaryFillColor}
+          strokeMiterlimit={10}
+          d="M3.66,13.55S.73,11,3.5,10.66c1.19-.12,10.25,0,10.25,0"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/CharaismaSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/abilities/CharaismaSvg/index.ts
new file mode 100644
index 0000000..325d0cc
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/CharaismaSvg/index.ts
@@ -0,0 +1,9 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import CharismaSvg from "./CharismaSvg";
+
+const LightCharismaSvg = asLightSvg(CharismaSvg);
+const DarkCharismaSvg = asDarkSvg(CharismaSvg);
+
+export default CharismaSvg;
+export { CharismaSvg, LightCharismaSvg, DarkCharismaSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/ConstitutionSvg/ConstitutionSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/abilities/ConstitutionSvg/ConstitutionSvg.tsx
new file mode 100644
index 0000000..9089bc5
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/ConstitutionSvg/ConstitutionSvg.tsx
@@ -0,0 +1,43 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class ConstitutionSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 34.76 32.85" className={className}>
+        <path
+          fill={fillColor}
+          d="M2.41,13.25l2.89.47.78,3.08h.49l.42-3,3,2.14c-2.7,2.42-3.43,5.23-2.15,8.8L6.19,24v1.82c-.39.06-2.22-.09-2.51,0a2.42,2.42,0,0,1-.14-.25C3,23.88,5.79,22.94,6,21.51a5.19,5.19,0,0,0-2.06-5.13c-.62-.47-1.18-.86-.91-1.91.08-.33-.36-.83-.56-1.26Z"
+        />
+        <path
+          fill={fillColor}
+          d="M20.71,1.89c-2,.29-6.66,1.53-9.16,1.89C12.87,2.57,16,.08,17.63,0,18.55,0,20,1.08,21,1.45Z"
+        />
+        <path fill="none" d="M26.3,7.44l.56-2-.23-.12-2.25,4,3.13-1.39Z" />
+        <path
+          fill="none"
+          d="M12.66,8.84c-.7.06-1.52,2.65-2.25,3.78,1.88-.11,4.25.1,6,0C15.41,11.26,15.11,8.61,12.66,8.84Z"
+        />
+        <path
+          fill={fillColor}
+          d="M5.49,6.6c-.12-.53-.73-.88-1.25-1.16a4.15,4.15,0,0,0-.73-.32l-.22,0A2.35,2.35,0,0,0,2.85,5a1.8,1.8,0,0,0-.5,0l-.07,0a1.8,1.8,0,0,0-.41.19l-.13.09a2.54,2.54,0,0,0-.36.31l-.09.09a4.31,4.31,0,0,0-.41.56l-.1.17q-.15.26-.3.58l-.11.23c-.13.28-.25.58-.37.92l.33.09h0l.35.11L1,8.5h.05l.3,0h.17l.07,0,.09,0,.07,0,.08-.06.06-.06L2,8.25l0-.08L2.08,8l0-.1c0-.05,0-.11,0-.18s0-.08,0-.12,0-.16,0-.25,0-.08,0-.13,0-.29,0-.46c.51.4.72.7.95.72l.73.07c.23,0,.46,0,.66,0H4.7a1.61,1.61,0,0,0,.32,0l.05,0a.43.43,0,0,0,.25-.16A1,1,0,0,0,5.49,6.6Z"
+        />
+        <path
+          fill={fillColor}
+          d="M6.08,16.09l-.26-2.26C6.74,14.1,6.77,14.34,6.08,16.09Z"
+        />
+        <path
+          fill={fillColor}
+          d="M34.76,16.27c-1.1-3-1.6-6.19-4.52-7.61-2,2.38-2.26,2.51-4.05,2.05.32-.11.65-.19,1-.32A3.53,3.53,0,0,0,29.6,7.64a4.31,4.31,0,0,0-1.14-3.92,1.91,1.91,0,0,0-2.72-.29c-.69.47-1.39.9-2.1,1.34A.57.57,0,0,1,23.3,5c-.16.1-.76-.88-1.71-.94a18.17,18.17,0,0,0-5.81.46A45.59,45.59,0,0,1,8.81,6a4.8,4.8,0,0,0-.86.17s0,.07.05.11a2.29,2.29,0,0,1-.35,1.83L8.18,8l.06.32L.35,10.83l1.06,3.1,1-.68c-.25-.66.15-.53.49-.48,1.29.21,2.57.46,3.86.64,2.56.35,3.86,2.18,4.58,4.69.64,2.2-.29,3.83-1.64,5.3l-.24.28c-.54,3-2.29,4-4.93,3.58a3.79,3.79,0,0,0,3.93.89A29.55,29.55,0,0,1,11.88,27c2.17-.51,4.42-1.28,6.56-.31,1.55.71,2.83,2.08,4.29,3.06s3.16,2.13,4.8,3c.31-.85.59-1.71.83-2.59.35-1.27,1-2.47,1.28-3.75a.5.5,0,0,1,.57-.44l1-2,.59,2.31a11.8,11.8,0,0,0,.7-1.72,49.17,49.17,0,0,0,1.24-6.29,14.3,14.3,0,0,0-.66-3.8ZM11.12,12.18c.55-.87,1.18-2.84,1.72-2.89,1.87-.17,2.1,1.85,2.86,2.89C14.37,12.25,12.56,12.1,11.12,12.18Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/ConstitutionSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/abilities/ConstitutionSvg/index.ts
new file mode 100644
index 0000000..1560db7
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/ConstitutionSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../hocs";
+import ConstitutionSvg from "./ConstitutionSvg";
+
+const LightConstitutionSvg = asLightSvg(ConstitutionSvg);
+const DarkConstitutionSvg = asDarkSvg(ConstitutionSvg);
+
+export default ConstitutionSvg;
+export { ConstitutionSvg, LightConstitutionSvg, DarkConstitutionSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/DexteritySvg/DexteritySvg.tsx b/ddb_main/tools/js/smartComponents/Svg/abilities/DexteritySvg/DexteritySvg.tsx
new file mode 100644
index 0000000..90b3581
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/DexteritySvg/DexteritySvg.tsx
@@ -0,0 +1,75 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class DexteritySvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor, secondaryFillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 36.17 35.63" className={className}>
+        <path
+          fill={secondaryFillColor}
+          d="M13,20s1-5.61,7.7-7c0,0-2.52,1.32-2.6,1.9s1.43,2-.36,3.8C15.62,20.79,14,17.16,13,20Z"
+        />
+        <path
+          fill={secondaryFillColor}
+          d="M15.68,30.39c.06,0,.55.05,1.28.07L15.71,30Z"
+        />
+        <path
+          fill={fillColor}
+          d="M10.45,6.26A7.07,7.07,0,0,0,6,2.16L7.06,7.39Z"
+        />
+        <path
+          fill="none"
+          stroke={fillColor}
+          strokeMiterlimit={10}
+          strokeWidth="0.65px"
+          d="M9.49,26.36a15.46,15.46,0,0,1-1.48,9"
+        />
+        <path
+          fill="none"
+          stroke={fillColor}
+          strokeMiterlimit={10}
+          strokeWidth="0.55px"
+          d="M11.67,27.58S14,30.79,13,34.15"
+        />
+        <path
+          fill="none"
+          stroke={fillColor}
+          strokeMiterlimit={10}
+          strokeWidth="0.55px"
+          d="M5.32,28.82a6.15,6.15,0,0,1-1.45,5.33"
+        />
+        <path
+          fill="none"
+          d="M10.06,18.91a6,6,0,0,1-3.69,1.7A1.73,1.73,0,0,1,5,20.09c-.9-1-.12-3.19,1.76-4.86a6,6,0,0,1,3.69-1.7,1.73,1.73,0,0,1,1.34.52C12.72,15.06,11.94,17.24,10.06,18.91Z"
+        />
+        <path
+          fill="none"
+          d="M10.48,14.48a5.24,5.24,0,0,0-3.06,1.46C5.8,17.38,5.34,19,5.74,19.46a.87.87,0,0,0,.63.2A5.24,5.24,0,0,0,9.43,18.2a6,6,0,0,0,1.66-2.29,1.35,1.35,0,0,0,0-1.23A.87.87,0,0,0,10.48,14.48Z"
+        />
+        <path
+          fill={fillColor}
+          d="M21.39,23.19h.12l.54,0h.2l.43,0,.17,0,.52-.06h.07l.37-.06.12,0,.2,0h.07l.08,0a4.69,4.69,0,0,0-1.47-1.67A9.68,9.68,0,0,1,24,21l.42,0c.3,0,.6-.06.93-.06s.57,0,.86,0l.45,0a14.14,14.14,0,0,1,1.48.22c-.06-.27-.13-.6-.21-1l-.14-.58-.13-.55c-.07-.3-.15-.6-.24-.93l-.07-.27a44.12,44.12,0,0,0-1.88-5.52l0-.09c-.21-.48-.42-1-.65-1.43h0a21.2,21.2,0,0,0-1.76-3H21.74A16.87,16.87,0,0,0,12.81,0V7.39s-9.14,3.49-9.34,6.16-.41,6.26-1,6.88-3,3.75-2.34,4.36,4.6,5.08,6.76,5.08,7.19-.51,8.42,0l.44.16L15.83,29s.51,0,1.25.05h.14c.33,0,.72,0,1.13,0l.32,0,1-.11.48-.07c.35-.06.71-.13,1.07-.21l.49-.11A13,13,0,0,0,23.33,28a12.19,12.19,0,0,1-3.67-2.79l.6.07.18,0,.39,0h1.6a5.59,5.59,0,0,1-2.34-2.23,6.62,6.62,0,0,0,1.28.11Z"
+        />
+        <path
+          fill={secondaryFillColor}
+          d="M10.15,16.32A3.88,3.88,0,0,1,9.07,17.8a3.38,3.38,0,0,1-2,.94.56.56,0,0,1-.41-.13c-.26-.29,0-1.35,1.08-2.27a3.38,3.38,0,0,1,2-.94.56.56,0,0,1,.41.13A.87.87,0,0,1,10.15,16.32Z"
+        />
+        <path
+          fill={fillColor}
+          d="M35.1,21.8c0-.13,0-.25,0-.39a8.32,8.32,0,0,0-1.85-4.57,7.41,7.41,0,0,1,2.07,1.36c-1.38-3.91-4.48-4-4.8-4a25.72,25.72,0,0,0-3.73-2.4,49.22,49.22,0,0,1,2.93,9.45l.29,1.4-1.4-.28a12.45,12.45,0,0,0-2.45-.26l-.72,0a4.55,4.55,0,0,1,.37.63l.53,1.1-1.2.24a18.83,18.83,0,0,1-2.24.28,2.09,2.09,0,0,0,.53.31l4.25,1.58-4.53.25H23a8.52,8.52,0,0,0,1.41.83l2,.91-2,.83a17.27,17.27,0,0,1-6.11,1.14c2,2.75,8.06,5.4,8.06,5.4-.46-2.55,2.55-4.51,2.55-4.51.89.27,1,4.51,1,4.51a19.44,19.44,0,0,0,4.61-7.81A7.25,7.25,0,0,1,36,30.17C36.53,28.15,35.8,24.49,35.1,21.8Z"
+        />
+        <path
+          fill={secondaryFillColor}
+          d="M6.12,19.45a6.75,6.75,0,0,1,5.53-5s-1.81.95-1.87,1.36,1,1.45-.26,2.73C8,20,6.77,17.44,6.12,19.45Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/DexteritySvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/abilities/DexteritySvg/index.ts
new file mode 100644
index 0000000..5fe3c37
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/DexteritySvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../hocs";
+import DexteritySvg from "./DexteritySvg";
+
+const LightDexteritySvg = asLightSvg(DexteritySvg);
+const DarkDexteritySvg = asDarkSvg(DexteritySvg);
+
+export default DexteritySvg;
+export { DexteritySvg, LightDexteritySvg, DarkDexteritySvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/IntelligenceSvg/IntelligenceSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/abilities/IntelligenceSvg/IntelligenceSvg.tsx
new file mode 100644
index 0000000..ed36d8f
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/IntelligenceSvg/IntelligenceSvg.tsx
@@ -0,0 +1,43 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class IntelligenceSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor, secondaryFillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 30.86 31.19" className={className}>
+        <path
+          fill={fillColor}
+          d="M5.25,6.93a8.88,8.88,0,0,1,.49-.79,4.36,4.36,0,0,1,.63-.66,7.76,7.76,0,0,1,1.74-.89C4.42,2.69,1.84.88,2.35,2.56c.29.95.21,1.09,2,3.38Z"
+        />
+        <path fill={fillColor} d="M23,8v.06C23,8.08,23,8,23,8Z" />
+        <path
+          fill={fillColor}
+          d="M5.82,8.83A31.34,31.34,0,0,1,21.34,7.16c-.86-.48-2.2-1.25-4.28-2.49C10.47.74,5.81-1.23,7.18.82A11.26,11.26,0,0,1,9.35,6S6.56,7,5.82,8.83Z"
+        />
+        <path
+          fill={fillColor}
+          d="M22.92,9.39c-.3-.35-.56-.75-.87-1.16.2,0,.34,0,.48,0a.54.54,0,0,0,.18-.08.65.65,0,0,0-.08-.2c-.29-.31-.57-.62-.87-.91a18.35,18.35,0,0,0-4.95-3.29,9.6,9.6,0,0,0-3.79-1c-.31.16-.61.34-.93.48s-.88.56-1.35.81-1.14.66-1.7,1c-.14.11-.3.2-.44.3.1.22-.05.43-.23.63Q7.3,7.18,6.27,8.4a4.12,4.12,0,0,0-1,3.39,4.22,4.22,0,0,1-.73,3,10.25,10.25,0,0,1-1.91,2.12c-.8.69-1.62,1.35-2.42,2-.26.22-.26.29,0,.53a4.52,4.52,0,0,0,2,1.1,1,1,0,0,0,.37,0c.18,0,.38-.2.49.12,0,0,.12.06.18.05a9.94,9.94,0,0,0,1.69-.17c1.23-.32,2.44-.71,3.65-1.09A11.76,11.76,0,0,1,12,18.66c.62,0,.62,0,.84.67.32,1,1.7,1.82,1.48,2.8,0,.08,0,.15-.06.23a4.42,4.42,0,0,1,.53,3.24,5.41,5.41,0,0,1-1.51,3.61c-.09.21-.17.42-.27.61a3.89,3.89,0,0,1-.53.76.28.28,0,0,0,.15.08c1.74-.77,4.27-3.57,5.64-5.13.46-.52.77-.14.41.49-.68,1.18-2.08,4.1-3,4.91q1.85.13,3.71.2l1.79.06.37-.06c.55-.11,1.09-.26,1.63-.42.89-.79,2.16-4,2.65-4.94.39-.72.55-.09.62.72.13,1.4-1.72,3.5-2.06,4a20.7,20.7,0,0,0,4.31-2c3.19-2.79,1.84-6.61,1-8.11-.34-.63-1.47-3.09-1.54-3.42a18.82,18.82,0,0,1,2.63,4.73C30.84,14.15,23.88,10.5,22.92,9.39Z"
+        />
+        <polygon
+          fill={secondaryFillColor}
+          points="8.11 11.41 8.04 11.11 8.84 9.73 10.49 9.73 10.04 10.94 8.4 11.73 8.11 11.41"
+        />
+        <path
+          fill={secondaryFillColor}
+          d="M13.17,28.75a8.88,8.88,0,0,0,1.14-3.16v-.07l0-.07a4,4,0,0,0-.51-2.88l-.07-.16.1-.39c.08-.34-.28-.78-.65-1.24a4.27,4.27,0,0,1-.82-1.29c0-.12-.08-.24-.11-.32H12a11.27,11.27,0,0,0-3.28.7c-1.21.39-2.44.78-3.68,1.1a6.2,6.2,0,0,1-1.29.15l-.48,0h0A.77.77,0,0,1,2.71,21H2.66a1.72,1.72,0,0,1-.38.06H2.22l-.13,0-.19-.07-.49-.14.13-.5.14-.44.1-.09c.1-.09,2.42-2.23,3.75-3.19s5-3,7.73-3a4.52,4.52,0,0,1,1.12.13,6.86,6.86,0,0,1,3.86,3.62,9.52,9.52,0,0,1,.31,7.95l-.1.25-.27.05c-1.75,2-3.41,3.77-4.5,3.93l-1,.15Z"
+        />
+        <path
+          fill={fillColor}
+          d="M13.26,14.06a4,4,0,0,1,1,.12c2.52.64,6,5.42,3.82,10.89a.5.5,0,0,0-.29.16c-1.37,1.55-3.22,3.62-4.18,3.76a9.62,9.62,0,0,0,1.21-3.4,4.42,4.42,0,0,0-.53-3.24c0-.08,0-.15.06-.23.22-1-1.16-1.83-1.48-2.8-.2-.61-.22-.67-.7-.67H12a11.76,11.76,0,0,0-3.43.73c-1.21.39-2.42.77-3.65,1.09a9.94,9.94,0,0,1-1.69.17h0c-.06,0-.15,0-.16-.05s-.13-.2-.21-.2a1.93,1.93,0,0,0-.29.07,1.79,1.79,0,0,1-.29,0H2.2L2,20.45l.1-.31s2.39-2.2,3.7-3.16c1.16-.84,4.77-2.92,7.44-2.92m0-1c-3.06,0-6.91,2.3-8,3.11-1.34,1-3.69,3.14-3.79,3.23l-.2.18-.08.26-.1.31-.3,1,.94.28.26.09a1.32,1.32,0,0,0,.32,0,1.63,1.63,0,0,0,.31,0,1.27,1.27,0,0,0,.63.16h.11l.46,0a6.69,6.69,0,0,0,1.39-.17c1.25-.33,2.49-.72,3.7-1.1a11.39,11.39,0,0,1,3-.68,4.79,4.79,0,0,0,.9,1.43,2.94,2.94,0,0,1,.55.82l0,.07,0,.13-.08.34.14.31a3.59,3.59,0,0,1,.49,2.51l0,.14v.15a8.31,8.31,0,0,1-1.07,2.93l-1,1.78,2-.3c1.13-.17,2.47-1.47,4.68-4l.38-.08.2-.5a10,10,0,0,0-.33-8.36,7.27,7.27,0,0,0-4.18-3.88,5,5,0,0,0-1.25-.15Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/IntelligenceSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/abilities/IntelligenceSvg/index.ts
new file mode 100644
index 0000000..91e8f72
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/IntelligenceSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../hocs";
+import IntelligenceSvg from "./IntelligenceSvg";
+
+const LightIntelligenceSvg = asLightSvg(IntelligenceSvg);
+const DarkIntelligenceSvg = asDarkSvg(IntelligenceSvg);
+
+export default IntelligenceSvg;
+export { IntelligenceSvg, LightIntelligenceSvg, DarkIntelligenceSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/StrengthSvg/StrengthSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/abilities/StrengthSvg/StrengthSvg.tsx
new file mode 100644
index 0000000..92263a6
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/StrengthSvg/StrengthSvg.tsx
@@ -0,0 +1,34 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class StrengthSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor, secondaryFillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 35.11 37.7" className={className}>
+        <path
+          fill={fillColor}
+          d="M22.23,9.42a7.43,7.43,0,0,1,.24,4.07c4.91.71,6.94,4.19,7.33,6.13l.31,1.54-1.54.31a13.16,13.16,0,0,1-2.62.27h0a11.71,11.71,0,0,1-1.86-.15l.76,1.1a8.79,8.79,0,0,1,.2,9,8.83,8.83,0,0,1-1,1.46C28.5,34.87,27,37.7,31,37.7s6.91-24.39,0-27.49C29.34,9.27,24.62,9.18,22.23,9.42Z"
+        />
+        <path
+          fill={fillColor}
+          d="M8.34,12.46l3.4-2.82C8.38,9.27.45,1.55.7,1.91,1.78,7.79,8.34,12.46,8.34,12.46Z"
+        />
+        <path
+          fill={fillColor}
+          d="M28.47,19.93s-1.05-5.21-8.05-5c0,0,2.73-4.68-2.25-9.32C13,.82,3.57,0,3.57,0S16.34,6.63,14.9,11.22c0,0-6.06,2.36-6.73,5.78s-1.41,5.12-6.36,8.32c0,0-2,1.88-1.79,2.89s5.12,6.7,7.48,6.52,7.7-1.79,11.73-.88,7.35-6.26,4.55-10.24a34.73,34.73,0,0,1-3.37-5.38S23.3,21,28.47,19.93Z"
+        />
+        <path
+          fill={secondaryFillColor}
+          d="M10.52,21.8a6.75,6.75,0,0,1,5.53-5s-1.81.95-1.87,1.36,1,1.45-.26,2.73C12.38,22.39,11.17,19.78,10.52,21.8Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/StrengthSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/abilities/StrengthSvg/index.ts
new file mode 100644
index 0000000..5912745
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/StrengthSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../hocs";
+import StrengthSvg from "./StrengthSvg";
+
+const LightStrengthSvg = asLightSvg(StrengthSvg);
+const DarkStrengthSvg = asDarkSvg(StrengthSvg);
+
+export default StrengthSvg;
+export { StrengthSvg, LightStrengthSvg, DarkStrengthSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/WisdomSvg/WisdomSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/abilities/WisdomSvg/WisdomSvg.tsx
new file mode 100644
index 0000000..a2c5bb9
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/WisdomSvg/WisdomSvg.tsx
@@ -0,0 +1,51 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class WisdomSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 30.04 31.68" className={className}>
+        <path
+          fill={fillColor}
+          d="M14.46,4.32S21.57-1.33,30,3A9.07,9.07,0,0,0,27,3.41a4.45,4.45,0,0,1,1.19,0,3.17,3.17,0,0,1-2,.4s0,.23.89.28a3.66,3.66,0,0,1-2.46.58,2.62,2.62,0,0,0,1.16.25s-.54.62-2.23.56a.68.68,0,0,0,.41.18,2.45,2.45,0,0,1-1.47.16A.92.92,0,0,0,23,6.1s-1.85.3-2.39,1S14.46,4.32,14.46,4.32Z"
+        />
+        <path
+          fill={fillColor}
+          d="M5.91,5.48s4-6,10.7-5.45a6.45,6.45,0,0,0-1.9,1.1,3.16,3.16,0,0,1,.78-.32,2.25,2.25,0,0,1-1.18.79s0,.16.66-.06c0,0-.25.56-1.46,1a1.86,1.86,0,0,0,.83-.15s-.18.55-1.31,1a.48.48,0,0,0,.32,0,1.74,1.74,0,0,1-.92.5.66.66,0,0,0,.43,0s-1.13.7-1.3,1.3S5.91,5.48,5.91,5.48Z"
+        />
+        <path
+          fill={fillColor}
+          d="M3.34,12.44l-.45-.2C2.37,7.72,5,3.3,11.74,3.3a16.36,16.36,0,0,1,2.72.22A7.54,7.54,0,0,0,10.73,8.4c-1.26,4.8-3.78,4.81-5.86,5.14A4.65,4.65,0,0,0,3.34,12.44Z"
+        />
+        <path fill={fillColor} d="M3.77,14.8" />
+        <path
+          fill={fillColor}
+          d="M19.44,15.72l.57-.34a3.35,3.35,0,0,0-.33-.85l.53-.38a4.61,4.61,0,0,0-.74-1l-2-1.84,1.26.66.27-.55.13.06a3.42,3.42,0,0,0,.52.15c-.59-.53-1-.86-1-.86L17.23,9.7l1.48.42a56.1,56.1,0,0,0-5.25-2.37l.11-.31a6.85,6.85,0,0,0-1.1,2.38,10,10,0,0,1-.57,1.63,1.61,1.61,0,0,1,.18,0c1,0,2.79.83,2.79,1.84S13.52,16,12.54,16a2.9,2.9,0,0,1-2.3-1.8c-1,1-3.12.75-4.06.89a3.2,3.2,0,0,1,.17,2.62l.55.5L6,18.44l.16.29,0,0s5.51,2.65,8.77,2.28,4.18-3.59,4.22-3.73l.24-.78.39.72a5.17,5.17,0,0,0,.68.92A19.09,19.09,0,0,0,19.44,15.72Z"
+        />
+        <path
+          fill="none"
+          d="M3.51,15.49a3.83,3.83,0,0,0-1.83-1.95A3.83,3.83,0,0,1,3.51,15.49Z"
+        />
+        <path
+          fill={fillColor}
+          d="M4.45,18.36a9,9,0,0,0-.76-3.09A4.36,4.36,0,0,0,1.6,13S-1.56,17.25,1,21.32a5.34,5.34,0,0,1,.91-.45A3.41,3.41,0,0,1,4.45,18.36Z"
+        />
+        <path
+          fill={fillColor}
+          d="M1.67,21.54A6.29,6.29,0,0,1,2,20.43a4.7,4.7,0,0,0-.8.39A6.63,6.63,0,0,0,1.67,21.54Z"
+        />
+        <path
+          fill={fillColor}
+          d="M29,22.84a2.13,2.13,0,0,1,.88.88S29.44,19.65,27,18a2.46,2.46,0,0,1,1.86.85s-.28-2.26-1.75-3a3.71,3.71,0,0,1,1.47.31,5.25,5.25,0,0,0-2.77-3.42,3.11,3.11,0,0,1,1.19.28s-.37-2.2-3.5-3.53A3.65,3.65,0,0,1,25,9.69l-1-.71A15.15,15.15,0,0,0,15,4a7.63,7.63,0,0,0-2.11,1.71c1.16.45,7.4,2.89,8.62,4.33l.86,1-1.74-.48.84.78.88.84-1.2-.12a2.07,2.07,0,0,1,.25.3l.45.66L21,13H21a9.43,9.43,0,0,1,1.09,2l.4,1-1-.46-.27-.14a6.46,6.46,0,0,1,.15.94l.06.75L21.15,17a13,13,0,0,1,.94,2.93L22.25,21l-.84-.7a12.24,12.24,0,0,1-1.6-1.64,7,7,0,0,1-5.52,4.22,8.15,8.15,0,0,1-.89,0c-3.28,0-7-1.76-8.4-2.52a4.32,4.32,0,0,0-1.62-.25,4.75,4.75,0,0,0-.53,1.53l-.33,2.76v0a16,16,0,0,0,2,4.79,5.4,5.4,0,0,0,2,2,4.58,4.58,0,0,1-.69-2.16A7.65,7.65,0,0,0,11,31.68a3.22,3.22,0,0,1-.23-2.7,4.71,4.71,0,0,0,3,2.56,3,3,0,0,0,.63-2.73c1.77,2.76,6.62,2.86,6.62,2.86a4.12,4.12,0,0,1-.43-3.26c.8,2.16,4.13,2.83,4.13,2.83a3.47,3.47,0,0,1-.43-2.3A3.38,3.38,0,0,0,27,30.24c-.92-1-1.33-3.5-1.33-3.5a6.56,6.56,0,0,1,2.26,4.93,3.3,3.3,0,0,0,2-2.15h0a2.3,2.3,0,0,0,.07-.46h0A11.7,11.7,0,0,0,29,22.84Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/abilities/WisdomSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/abilities/WisdomSvg/index.ts
new file mode 100644
index 0000000..4c3bd27
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/abilities/WisdomSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../hocs";
+import WisdomSvg from "./WisdomSvg";
+
+const LightWisdomSvg = asLightSvg(WisdomSvg);
+const DarkWisdomSvg = asDarkSvg(WisdomSvg);
+
+export default WisdomSvg;
+export { WisdomSvg, LightWisdomSvg, DarkWisdomSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/ConeSvg/ConeSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/ConeSvg/ConeSvg.tsx
new file mode 100644
index 0000000..9166f06
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/ConeSvg/ConeSvg.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ConeSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 16.73 17.49">
+      <path
+        fill={fillColor}
+        d="M14,17.49c-1.85,0-2.69-4.53-2.69-8.74S12.18,0,14,0s2.69,4.53,2.69,8.74S15.88,17.49,14,17.49ZM14,1c-.51,0-1.69,2.63-1.69,7.74s1.19,7.74,1.69,7.74,1.69-2.63,1.69-7.74S14.54,1,14,1Z"
+      />
+      <path
+        fill={fillColor}
+        d="M14,17.49a.5.5,0,0,1-.26-.07L.24,9.17a.5.5,0,0,1,0-.85L13.77.07a.5.5,0,1,1,.52.85L1.46,8.74l12.83,7.82a.5.5,0,0,1-.26.93Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default ConeSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/ConeSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/ConeSvg/index.ts
new file mode 100644
index 0000000..7c5ab9e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/ConeSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import ConeSvg from "./ConeSvg";
+
+const LightConeSvg = asLightSvg(ConeSvg);
+const DarkConeSvg = asDarkSvg(ConeSvg);
+const GrayConeSvg = asGraySvg(ConeSvg);
+
+export default ConeSvg;
+export { ConeSvg, LightConeSvg, DarkConeSvg, GrayConeSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CubeSvg/CubeSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CubeSvg/CubeSvg.tsx
new file mode 100644
index 0000000..5af512d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CubeSvg/CubeSvg.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const CubeSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 16.89 17.57">
+      <path
+        fill={fillColor}
+        d="M13.43,17.57H.5a.5.5,0,0,1-.5-.5V4.14a.5.5,0,0,1,.5-.5H13.43a.5.5,0,0,1,.5.5V17.07A.5.5,0,0,1,13.43,17.57ZM1,16.57H12.93V4.64H1Z"
+      />
+      <path
+        fill={fillColor}
+        d="M13.43,17.57a.5.5,0,0,1-.4-.81l2.86-3.71V1.91L13.82,4.46A.5.5,0,1,1,13,3.83L16,.18a.5.5,0,0,1,.89.32V13.23a.5.5,0,0,1-.1.31l-3,3.85A.5.5,0,0,1,13.43,17.57Z"
+      />
+      <path
+        fill={fillColor}
+        d="M.5,4.64A.5.5,0,0,1,.13,3.8L3.55.16A.5.5,0,0,1,3.91,0H16.39a.5.5,0,0,1,0,1H4.13L.87,4.48A.5.5,0,0,1,.5,4.64Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default CubeSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CubeSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CubeSvg/index.ts
new file mode 100644
index 0000000..99898f2
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CubeSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import CubeSvg from "./CubeSvg";
+
+const LightCubeSvg = asLightSvg(CubeSvg);
+const DarkCubeSvg = asDarkSvg(CubeSvg);
+const GrayCubeSvg = asGraySvg(CubeSvg);
+
+export default CubeSvg;
+export { CubeSvg, LightCubeSvg, DarkCubeSvg, GrayCubeSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CylinderSvg/Cylinder.tsx b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CylinderSvg/Cylinder.tsx
new file mode 100644
index 0000000..12b4645
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CylinderSvg/Cylinder.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const Cylinder: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 17.49 18.31">
+      <path
+        fill={fillColor}
+        d="M8.74,5.38C4.53,5.38,0,4.54,0,2.69S4.53,0,8.74,0s8.74.84,8.74,2.69S13,5.38,8.74,5.38ZM8.74,1C3.63,1,1,2.19,1,2.69S3.63,4.38,8.74,4.38s7.74-1.19,7.74-1.69S13.85,1,8.74,1Z"
+      />
+      <path
+        fill={fillColor}
+        d="M8.74,18.31C4.53,18.31,0,17.47,0,15.62V2.69a.5.5,0,0,1,1,0V15.62c0,.51,2.63,1.69,7.74,1.69s7.74-1.19,7.74-1.69V2.69a.5.5,0,0,1,1,0V15.62C17.49,17.47,13,18.31,8.74,18.31Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default Cylinder;
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CylinderSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CylinderSvg/index.ts
new file mode 100644
index 0000000..d98df4c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/CylinderSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import Cylinder from "./Cylinder";
+
+const LightCylinderSvg = asLightSvg(Cylinder);
+const DarkCylinderSvg = asDarkSvg(Cylinder);
+const GrayCylinderSvg = asGraySvg(Cylinder);
+
+export default Cylinder;
+export { Cylinder, LightCylinderSvg, DarkCylinderSvg, GrayCylinderSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/LineSvg/LineSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/LineSvg/LineSvg.tsx
new file mode 100644
index 0000000..57d9d17
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/LineSvg/LineSvg.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const LineSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 17.49 7.1">
+      <path
+        fill={fillColor}
+        d="M14,5.44H.5a.5.5,0,0,1-.5-.5V2a.5.5,0,0,1,.5-.5H14a.5.5,0,0,1,0,1H1v2H14a.5.5,0,0,1,0,1Z"
+      />
+      <path
+        fill={fillColor}
+        d="M14,7.1a.49.49,0,0,1-.18,0,.5.5,0,0,1-.32-.46V4.94a.5.5,0,0,1,1,0v.4l1.76-1.87L14.53,1.71v.17a.5.5,0,0,1-1,0V.5a.5.5,0,0,1,.85-.35l3,3a.5.5,0,0,1,0,.7l-3,3.15A.5.5,0,0,1,14,7.1Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default LineSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/LineSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/LineSvg/index.ts
new file mode 100644
index 0000000..bd6502f
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/LineSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import LineSvg from "./LineSvg";
+
+const LightLineSvg = asLightSvg(LineSvg);
+const DarkLineSvg = asDarkSvg(LineSvg);
+const GrayLineSvg = asGraySvg(LineSvg);
+
+export default LineSvg;
+export { LineSvg, LightLineSvg, DarkLineSvg, GrayLineSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SphereSvg/SphereSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SphereSvg/SphereSvg.tsx
new file mode 100644
index 0000000..769200f
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SphereSvg/SphereSvg.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const SphereSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 18 18.06">
+      <path
+        fill={fillColor}
+        d="M9,1A8,8,0,1,1,1,9,8,8,0,0,1,9,1M9,0a9,9,0,1,0,9,9A9,9,0,0,0,9,0Z"
+      />
+      <path
+        fill={fillColor}
+        d="M9,18.06a.5.5,0,0,1,0-1c2,0,3.65-3.68,3.65-8S11,1,9,1A.5.5,0,0,1,9,0c2.61,0,4.65,4,4.65,9S11.61,18.06,9,18.06Z"
+      />
+      <path
+        fill={fillColor}
+        d="M9.48,11.44A18.11,18.11,0,0,1,.28,8.84.5.5,0,0,1,.78,8c9,5.25,16.37.49,16.44.44a.5.5,0,0,1,.56.83A16.25,16.25,0,0,1,9.48,11.44Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default SphereSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SphereSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SphereSvg/index.ts
new file mode 100644
index 0000000..c38605d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SphereSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import SphereSvg from "./SphereSvg";
+
+const LightSphereSvg = asLightSvg(SphereSvg);
+const DarkSphereSvg = asDarkSvg(SphereSvg);
+const GraySphereSvg = asGraySvg(SphereSvg);
+
+export default SphereSvg;
+export { SphereSvg, LightSphereSvg, DarkSphereSvg, GraySphereSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SquareSvg/SquareSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SquareSvg/SquareSvg.tsx
new file mode 100644
index 0000000..8773b1d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SquareSvg/SquareSvg.tsx
@@ -0,0 +1,27 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const SquareSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 13.75 13.33">
+      <rect
+        fill={secondaryFillColor}
+        stroke={fillColor}
+        strokeMiterlimit={10}
+        className="cls-1"
+        x="0.71"
+        y="0.29"
+        width="12.33"
+        height="12.75"
+        transform="translate(0.21 13.54) rotate(-90)"
+      />
+    </BaseSvg>
+  );
+};
+
+export default SquareSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SquareSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SquareSvg/index.ts
new file mode 100644
index 0000000..7a5ea70
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/aoeTypes/SquareSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import SquareSvg from "./SquareSvg";
+
+const LightSquareSvg = asLightSvg(SquareSvg);
+const DarkSquareSvg = asDarkSvg(SquareSvg);
+const GraySquareSvg = asGraySvg(SquareSvg);
+
+export default SquareSvg;
+export { SquareSvg, LightSquareSvg, DarkSquareSvg, GraySquareSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeSpellSvg/MeleeSpellSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeSpellSvg/MeleeSpellSvg.tsx
new file mode 100644
index 0000000..f943faf
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeSpellSvg/MeleeSpellSvg.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const MeleeSpellSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 18.52 17.03">
+      <path
+        fill={fillColor}
+        d="M8.17 16.03L.63 17l5.12-3.33-5.54-3.64h5.71L0 0l7.67 4.92L6.4 1.13 9.38 3l2-2.54 2.41 3.37 2.42-3.1-1.38 13.81-6.66 1.49z"
+      />
+      <path
+        fill={fillColor}
+        d="M13.15 16.53c-1.62 0-3.15-.61-3.57-1.42A6 6 0 007 14.44h-.27a.87.87 0 01-.85-.71 1.14 1.14 0 01.73-1.26A3.49 3.49 0 018 12.29a8.08 8.08 0 012 .23.8.8 0 00.23 0h.06v-.14c-.09-.25-.54-1.08-1-1.88C7.34 7.11 7 6.37 7.39 5.91A.76.76 0 018 5.59c.87 0 2.05 1.3 2.58 2.18a7.07 7.07 0 00.66.93c-.23-.8-.61-1.93-.81-2.52-.14-.42-.25-.75-.3-.91a1.36 1.36 0 01.18-1.23 1.37 1.37 0 011.14-.52c.69 0 1 .93 1.58 3.38v-.46c0-1.3.45-2 1.21-2a.74.74 0 01.57.27c.62.74.26 3.42.26 3.45a1.31 1.31 0 000 .23c.56-.9 1.5-1.77 2.19-1.77a.71.71 0 01.68.47c.16.44 0 1.14-1.63 3.73l-.17.29v1.27a13.7 13.7 0 01-.1 2.35c-.27 1.4-2.58 1.72-2.85 1.76h-.06z"
+      />
+      <path
+        d="M11.46 4c.64 0 1.39 5 1.69 5 .29 0 .4-1.94.42-2.54s.11-1.46.7-1.46c.6 0 .38 2.73.31 3.15s0 1.34.33 1.34c.1 0 .23-.12.39-.45.51-1 1.5-1.87 2-1.87a.21.21 0 01.21.14c.19.52-1.58 3.27-1.77 3.6s0 2.69-.17 3.77S13.15 16 13.15 16c-1.54 0-2.83-.58-3.12-1.15s-2.24-1-3-1h-.26c-.43 0-.58-.72.09-1A3.12 3.12 0 018 12.79a7.67 7.67 0 011.81.2 1.3 1.3 0 00.39.06c.37 0 .71-.19.49-.81-.29-.83-3.23-5.58-2.9-6A.26.26 0 018 6.09c.51 0 1.55.94 2.15 1.94s1.3 1.71 1.62 1.71a.15.15 0 00.13-.06c.21-.29-1.1-3.9-1.29-4.54A.8.8 0 0111.46 4m0-1a1.88 1.88 0 00-1.53.72 1.85 1.85 0 00-.26 1.67c0 .13.12.37.22.68A3 3 0 008 5.09a1.26 1.26 0 00-1 .52c-.54.74-.17 1.58 1.81 5.16l.61 1.12a10.32 10.32 0 00-1.4-.1 3.9 3.9 0 00-1.57.21 1.65 1.65 0 00-1 1.82A1.36 1.36 0 006.77 15a1.44 1.44 0 00.29 0 6.46 6.46 0 012.15.54c.58.91 2.2 1.56 3.94 1.56h.12c.49-.06 2.95-.45 3.28-2.16a13.94 13.94 0 00.11-2.45v-1.13l.1-.17C18.48 8.31 18.67 7.6 18.44 7a1.21 1.21 0 00-1.15-.8 2.58 2.58 0 00-1.58.77 4.22 4.22 0 00-.48-2.49 1.21 1.21 0 00-.9-.45h-.06a1.45 1.45 0 00-1.27.69C12.62 3.62 12.21 3 11.46 3z"
+        fill={secondaryFillColor}
+      />
+    </BaseSvg>
+  );
+};
+
+export default MeleeSpellSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeSpellSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeSpellSvg/index.ts
new file mode 100644
index 0000000..786de6c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeSpellSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import MeleeSpellSvg from "./MeleeSpellSvg";
+
+const LightMeleeSpellSvg = asLightSvg(MeleeSpellSvg);
+const DarkMeleeSpellSvg = asDarkSvg(MeleeSpellSvg);
+const GrayMeleeSpellSvg = asGraySvg(MeleeSpellSvg);
+
+export default MeleeSpellSvg;
+export {
+  MeleeSpellSvg,
+  LightMeleeSpellSvg,
+  DarkMeleeSpellSvg,
+  GrayMeleeSpellSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeWeaponSvg/MeleeWeaponSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeWeaponSvg/MeleeWeaponSvg.tsx
new file mode 100644
index 0000000..54d9dd7
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeWeaponSvg/MeleeWeaponSvg.tsx
@@ -0,0 +1,844 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const MeleeWeaponSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 16.3 18.6">
+      <style>
+        {`.prefix__st0,.prefix__st1{fill:${fillColor}}.prefix__st1{stroke:${fillColor};stroke-miterlimit:10}.prefix__st2{fill:#fff}.prefix__st3{fill:${fillColor}}.prefix__st5{fill:${fillColor}}.prefix__st6{fill:${fillColor}}.prefix__st8,.prefix__st9{fill:none}.prefix__st9{stroke:${fillColor};stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10}.prefix__st11{fill:none;stroke-width:.5538}.prefix__st11,.prefix__st12,.prefix__st13{stroke:#000;stroke-miterlimit:10}.prefix__st13{fill:none;stroke:${fillColor};stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.prefix__st15,.prefix__st16{stroke-width:.75}.prefix__st15{fill:none;stroke:#fff;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10}.prefix__st16{fill:#fff}.prefix__st16,.prefix__st18,.prefix__st19{stroke:${fillColor};stroke-miterlimit:10}.prefix__st18{fill:#fff;stroke-width:.5;stroke-linecap:round;stroke-linejoin:round}.prefix__st19{fill:none;stroke-width:.75}`}
+      </style>
+      <path
+        className="prefix__st0"
+        d="M226.9 506.7s6.1 5.8 12.2 11.5l1.4-2.2 1.8 1.3-2.9 2.5 3.7 4.6-1 1-3.7-4.3-2.8 2.5-1.3-1 2-1.6c0-.1-7.2-8.7-9.4-14.3z"
+      />
+      <path
+        className="prefix__st0"
+        d="M237.9 515.1s-.1-.1 0 0c2-2.7 4.3-5.8 5.3-8.4 0 0-3.8 2.4-7.8 6.1.5.6 1.8 1.7 2.5 2.3zM231.4 517.8c-.2-.2-1.5-1.6-1.5-1.6l-1.6 1 2.4 2.6-3.7 4.6 1 1 3.7-4.3 1.1.9c.4-.5.8-.9 1.2-1.4l.2-.2c-1-.8-1.9-1.7-2.8-2.6zM0 0s6.1 5.8 12.2 11.5l1.4-2.2 1.8 1.3-2.9 2.5 3.7 4.6-1 1-3.7-4.3-2.8 2.5-1.3-1 2-1.6C9.4 14.2 2.2 5.6 0 0z"
+      />
+      <path
+        className="prefix__st0"
+        d="M11 8.4s-.1-.1 0 0c2-2.7 4.3-5.8 5.3-8.4 0 0-3.8 2.4-7.8 6.1.5.6 1.9 1.7 2.5 2.3zM4.5 11.1C4.3 10.9 3 9.5 3 9.5l-1.6 1 2.4 2.6L0 17.6l1 1 3.7-4.3 1.1 1c.4-.5.8-.9 1.2-1.4l.2-.2c-.9-.8-1.8-1.7-2.7-2.6zM0 39.6l2.7 4.9.2-3 2-1.4z"
+      />
+      <path
+        className="prefix__st1"
+        d="M3 41.6l13.9 8.9M13.1 49.3s.1 3 2.3 4.4M14.9 47.2s1.8-.3 3.8.8"
+      />
+      <path
+        className="prefix__st2"
+        d="M8.8 78.9s-2 .3-2.7 1.4c0 0 1.2 1 2.1.5.8-.4 1.2-1.1.6-1.9z"
+      />
+      <path
+        className="prefix__st0"
+        d="M10.4 81.8l-8.8-8.6s.8 7.3 5.8 10.5l3-1.9zM11.3 82.7l4.4 5.2-1.7.9-4-5.1zM16.3 81.9s-1.1-3.9-4.3-8c0 0-1.2 3.3 2.1 8.4l2.2-.4zM16.8 82.9c.2.2 1.4 4.1 1.4 4.1l-1.2.8-1.5-4.6 1.3-.3zM15.4 91l-4.7-2.9-1.1 1.2 4.7 2.9zM9.6 87.6L0 84.2s3.1 5.1 7.7 5.7l1.9-2.3z"
+      />
+      <path
+        className="prefix__st3"
+        d="M8.2 126.9l-7.6 1 5.2-3.3-5.6-3.7h5.7l-5.9-10 7.7 4.9-1.3-3.8 3 1.9 2-2.6 2.4 3.4 2.4-3.1-1.4 13.8z"
+      />
+      <path
+        className="prefix__st3"
+        d="M13.1 127.4c-1.6 0-3.2-.6-3.6-1.4-.2-.2-1.8-.7-2.5-.7h-.3c-.4 0-.8-.3-.8-.7-.1-.4.1-1 .7-1.3.3-.1.8-.2 1.4-.2.8 0 1.6.1 2 .2H10.3v-.1c-.1-.3-.5-1.1-1-1.9-1.9-3.4-2.2-4.2-1.8-4.6.1-.2.4-.3.6-.3.9 0 2.1 1.3 2.6 2.2.2.4.5.7.7.9-.2-.8-.6-1.9-.8-2.5-.1-.4-.3-.7-.3-.9-.1-.5-.1-.9.2-1.2.3-.3.7-.5 1.1-.5.7 0 1 .9 1.6 3.4v-.5c0-1.3.5-2 1.2-2 .2 0 .4.1.6.3.6.7.3 3.4.3 3.5v.2c.6-.9 1.5-1.8 2.2-1.8.3 0 .6.2.7.5.2.4 0 1.1-1.6 3.7-.1.1-.1.2-.2.3v1.3c0 .8 0 1.7-.1 2.3-.5 1.5-2.8 1.8-3.2 1.8z"
+      />
+      <path
+        className="prefix__st2"
+        d="M11.5 114.9c.6 0 1.4 5 1.7 5 .3 0 .4-1.9.4-2.5 0-.6.1-1.5.7-1.5s.4 2.7.3 3.1c0 .3 0 1.3.3 1.3.1 0 .2-.1.4-.4.5-1 1.5-1.9 2-1.9.1 0 .2 0 .2.1.2.5-1.6 3.3-1.8 3.6s0 2.7-.2 3.8c-.2 1.1-2.4 1.4-2.4 1.4-1.5 0-2.8-.6-3.1-1.1-.3-.5-2.2-1-3-1h-.2-.1c-.4 0-.6-.7.1-1 .3-.1.7-.2 1.1-.2.7 0 1.5.1 1.8.2.1 0 .3.1.4.1.4 0 .7-.2.5-.8-.3-.8-3.2-5.6-2.9-6 .1-.1.2-.1.3-.1.5 0 1.6.9 2.1 1.9.6 1 1.3 1.7 1.6 1.7.1 0 .1 0 .1-.1.2-.3-1.1-3.9-1.3-4.5-.1-.6.3-1.1 1-1.1m0-1c-.6 0-1.2.3-1.5.7-.3.5-.4 1.1-.3 1.7 0 .1.1.4.2.7-.6-.6-1.2-1-1.9-1-.4 0-.8.2-1 .5-.5.7-.2 1.6 1.8 5.2.2.4.4.8.6 1.1-.4-.1-1-.1-1.4-.1-.7 0-1.2.1-1.6.2-.8.3-1.2 1.1-1 1.8.1.6.7 1.1 1.3 1.1H7c.5 0 1.8.3 2.1.5.6.9 2.2 1.6 3.9 1.6h.2c.5-.1 2.9-.4 3.3-2.2.1-.7.1-1.6.1-2.4v-1.1s.1-.1.1-.2c1.7-2.8 1.9-3.5 1.7-4.2-.2-.5-.6-.8-1.2-.8-.5 0-1.1.3-1.6.8 0-.9 0-2-.5-2.5-.2-.3-.6-.4-.9-.4-.4 0-.9.1-1.3.7-.3-1.1-.7-1.7-1.4-1.7z"
+      />
+      <path
+        className="prefix__st0"
+        d="M10.1-98.2s1.5 1.4 4.2.9c0 0-.5-2.7-4.2-2.6 0 0 1.4-2.4-1.2-4.9-2.7-2.5-7.6-2.9-7.6-2.9s6.7 3.5 5.9 5.9c0 0-3.2 1.2-3.5 3C3.4-97 3-96.1.4-94.5c0 0-1.1 1-.9 1.5.1.5 2.7 3.5 3.9 3.4s4-.9 6.1-.5c2.1.5 3.8-3.3 2.4-5.4l-1.8-2.7zm-5.2 2.1c1.3-2.4 3.6-2.7 3.6-2.7-.5 3.6-3.6 2.7-3.6 2.7z"
+      />
+      <path
+        className="prefix__st0"
+        d="M11.4-102.8c.3.8.3 1.5.1 2.1 2.6.4 3.6 2.2 3.8 3.2l.2.8-.8.2c-.5.1-.9.1-1.4.1-.3 0-.7 0-1-.1.1.2.3.4.4.6.9 1.3.9 3.1.1 4.7-.1.3-.3.5-.5.8 2.3.9 1.5 2.4 3.6 2.4s3.6-12.7 0-14.4c-.8-.5-3.3-.5-4.5-.4zM3.8-101.2l1.8-1.5c-1.8-.2-5.9-4.2-5.8-4 .6 3 4 5.5 4 5.5z"
+      />
+      <path
+        className="prefix__st3"
+        d="M6 456.5l-5.4.9 3.7-3.1-4-3.3h4.1l-4.2-9.4 5.5 4.6-.9-3.6 2.1 1.8 1.4-2.4 1.8 3.2 1.7-2.9-1 12.9z"
+      />
+      <path
+        className="prefix__st0"
+        d="M5.3 460.9l3.5-6-.6-.3.7-1.1-1.5-.9-.5.9-2.6-1.5 3.8-6.5 2.5 1.5-.5.8 1.5.9 2.1-2.4 2.7 2.7-1.3 1.7 1.6 1 .5-.9 2.6 1.5-3.8 6.5-2.5-1.5.5-.8-1.7-1-.6 1.1-.6-.3-2.6 4.6z"
+      />
+      <path
+        d="M8.3 446.2l1.7 1-3.2 5.6-1.7-1 3.2-5.6m5.4.9l2 2-1.1 1.3-2.6-1.5 1.7-1.8m-3.8 1.2l6.5 3.8-2.3 3.9-6.5-3.8 2.3-3.9m7.5 3.2l1.7 1-3.2 5.6-1.7-1 3.2-5.6m-8.1 2.3l2.6 1.5-.3.6-2.6-1.5.3-.6m-.1 1.4l1.5.9-2.5 4.3h-2l3-5.2m-1.3-10.3l-.5.9-3.2 5.6-.5.9.9.5 1.7 1 .9.5.5-.9.6.4-.1.2-.5.9.5.3-2.8 4.8-.9 1.5h4.3l.3-.5 2.3-3.9.5.3.5-.9.1-.2.8.5-.5.9.9.5 1.7 1 .9.5.5-.9 3.2-5.6.5-.9-.9-.5-1.7-1-.9-.5-.5.8-.7-.4.7-.8.6-.7-.6-.6-2-2-.8-.8-.7.8-1.4 1.6-.7-.4.5-.8-.9-.5-1.7-1-.9-.6z"
+        fill="#fcfdff"
+      />
+      <path
+        className="prefix__st5"
+        d="M7.7 314.7c-.3-.1-.5-.4-.4-.7v-.6l-.6.6-.3.3c-.2.2-.5.2-.7 0-.2-.2-.2-.5 0-.7.1-.1.2-.3.4-.4l1.2-1.2s.1-.1.1-.2v-2.7c0-.1-.1-.2-.1-.2-.5-.2-1-.4-1.4-.9-.7.4-1.5.8-2.2 1.2 0 0-.1.1-.1.2-.2.6-.3 1.3-.5 1.9-.1.2-.2.4-.4.5-.4.1-.7-.2-.6-.6.1-.4.2-.7.3-1.1v-.2l-.6.3c-.2.1-.3.2-.5.3-.3.1-.6 0-.7-.2-.1-.3-.1-.5.2-.7.3-.2.6-.3 1-.5-.4-.1-.7-.2-1.1-.3-.4-.1-.5-.3-.5-.7.1-.3.4-.4.7-.4.6.1 1.2.3 1.8.4.3.1.5 0 .7-.1.6-.4 1.3-.7 1.9-1-.1-.5-.2-1 0-1.5-.6-.3-1.1-.6-1.7-.9-.3-.2-.5-.3-.9-.1-.6.2-1.3.3-1.9.5-.3.1-.6-.1-.7-.4-.1-.3.1-.6.4-.6.3-.1.7-.2 1-.2.1 0 .1 0 .2-.1-.4-.2-.7-.4-1.1-.6-.2-.1-.3-.4-.3-.6.1-.2.2-.4.5-.4.1 0 .2 0 .3.1.3.2.6.3 1 .5-.1-.4-.2-.7-.2-1v-.2c0-.3.1-.6.4-.6.3-.1.5.1.6.4.2.6.3 1.3.5 1.9 0 .1.1.2.2.2.7.4 1.4.8 2.2 1.2l.1-.1c.3-.4.7-.6 1.2-.8.1 0 .2-.1.2-.2v-2.7c0-.1 0-.1-.1-.2l-1.5-1.5c-.2-.2-.3-.6 0-.8.2-.2.5-.2.8 0l.8.8v-.7c0-.4.2-.6.5-.6s.5.3.5.6v.7l.8-.8c.2-.2.3-.2.6-.2.2.1.3.2.3.4s0 .3-.1.5l-1.5 1.5s-.1.1-.1.2v2.9c.6.1 1.1.4 1.5.9.7-.4 1.5-.8 2.2-1.2.1 0 .1-.1.1-.2.2-.6.3-1.2.4-1.9.1-.4.3-.5.7-.5.3.1.4.4.4.7-.1.4-.2.7-.3 1.1.3-.2.6-.3.9-.5.1 0 .2-.1.3-.1.3-.1.5 0 .7.2.1.2.1.5-.2.7-.3.2-.6.3-.9.5-.1 0-.1.1-.3.1.4.1.7.2 1 .2.3.1.5.2.6.4v.2c-.2.4-.4.5-.8.4h-.2c-.6-.2-1.3-.3-1.9-.5h-.1c-.7.4-1.3.7-2 1.1-.1 0-.1.1-.1.2.1.4.1.8 0 1.2 0 .1 0 .2.1.2.7.4 1.3.7 2 1.1.1 0 .1.1.2 0 .7-.2 1.3-.3 2-.5.5-.1.6 0 .8.4v.2c-.1.3-.3.4-.6.4-.3.1-.6.1-.9.2.3.2.7.3.9.5.3.2.4.4.3.7-.1.3-.4.4-.7.2-.1 0-.1-.1-.2-.1-.3-.2-.6-.3-.9-.5l.3 1.2c.1.3-.1.6-.4.7-.3.1-.6-.1-.6-.4-.2-.7-.3-1.4-.5-2 0-.1 0-.1-.1-.1-.7-.4-1.5-.8-2.2-1.2-.4.5-.9.8-1.5.9v2.9c0 .1.1.1.1.2l1.5 1.5c.1.1.1.3.1.5s-.2.3-.3.4c-.2.1-.4 0-.6-.2l-.8-.8h-.1v.6c0 .4-.1.6-.5.7.2.4.1.4 0 .4zm1.7-8.3c0-.9-.7-1.6-1.5-1.6s-1.6.7-1.6 1.5.7 1.6 1.5 1.6c.9 0 1.6-.7 1.6-1.5z"
+        id="prefix__YHMZe9_tif"
+      />
+      <path
+        className="prefix__st6"
+        d="M7.2 352c-3.1 0-7-2.5-7-6.3 0 0 1 1.8 3 1.8 0 0-2.8-3.8 2-7.2s2-7.2 2-7.2 3.1 1.8 2 4.5-.9 6.7 0 7.5c0 0-.4-5.6 3-6.6 0 0-1.9 2.9 0 4.5s1.6 9-5 9z"
+      />
+      <path
+        className="prefix__st1"
+        d="M19.2 373.2l-3 4M15.2 369.2l-8 6M.3 384.2c-.3 1.2.1 2.4 1 3.2 1 .8 2.4.8 3.5.2l.3.7 6-1h-3c-.3 0 4-3 4-3-1.3.3-3.5.7-4.5.9l11.5-15.9L4.2 380v-3.8l-1.7 5-.5.3-.9-4.4-1 7h.2zm2.9-2c1.9-.4 4.2-1.2 5.7-2.7l.3-.3-.3.3c-.7.7-2.1 2.6-1.7 4.7.5 2.7-3.5 1.8-5 3 .5-1.8-1-4.6 1-5z"
+      />
+      <path className="prefix__st1" d="M9.2 379.2l-.3.3c.1-.2.3-.3.3-.3z" />
+      <g id="prefix__Icons_new_Arranged_Names">
+        <g id="prefix___x38_7_Lightning">
+          <path
+            id="prefix__Rectangle_297_copy"
+            className="prefix__st0"
+            d="M3.8 406.8h5.7l-3.3 6.7h4.6l-9.3 9.3 1.9-6.7H.2l3.6-9.3z"
+          />
+        </g>
+      </g>
+      <path
+        className="prefix__st0"
+        d="M6.7 274.2c.6-.3 1.5-.8 2.9-1.3.1 0 .2-.1.5-.2.5-.5.9-.9 1.2-1.1.3-.3.6-.4.7-.4.2 0 .3.1.4.2.1.1.1.3.1.5s0 .5-.1.8c.4.5.6.8.6 1 0 .2-.1.3-.2.4-.1.1-.3.1-.5.1-.1 0-.3-.1-.5-.2s-.5-.3-.8-.5c-.8.1-1.9.6-3.4 1.3.2.1.3.2.4.2.5.3 1.1.7 1.9 1.2.1.1.3.2.6.4 1.6.2 2.3.6 2.3 1.2 0 .4-.4.7-1.3.8-.4.5-.7.7-1 .7-.3 0-.6-.4-.9-1.2 0-.1-.1-.2-.1-.4-1.2-1-2.3-1.7-3.2-2.2-1.2.7-2.3 1.4-3.3 2.4-.1 1-.4 1.5-.9 1.5-.3 0-.6-.3-1-.8-.9 0-1.3-.2-1.3-.7 0-.4.2-.6.5-.8.3-.2 1-.3 2.1-.5.8-.6 1.7-1.1 2.8-1.7-1.4-.7-2.6-1.2-3.5-1.3-.2.2-.4.3-.6.4-.2.1-.3.1-.5.1s-.4 0-.5-.1c-.1-.1-.2-.2-.2-.4s.2-.5.6-1c-.1-.4-.1-.6-.1-.8 0-.3.1-.4.2-.6.1-.1.3-.2.4-.2.2 0 .5.1.8.4.3.3.7.6 1.1 1.2 1.2.4 2.4.9 3.8 1.6z"
+      />
+      <path
+        className="prefix__st0"
+        d="M9.1 270.3l-.3 1.3-.8.7c-.1.3-.3.5-.5.6-.2.1-.5.2-.8.2-.6 0-1.1-.3-1.3-.8l-.8-.7-.3-1.3.5-.1c.1.1.1.2.1.3.2.5.4.8.6.9.2.1.6.2 1.2.2s1-.1 1.3-.2c.2-.1.5-.4.6-.9 0-.1.1-.2.1-.3l.4.1z"
+      />
+      <path
+        className="prefix__st0"
+        d="M9.8 262.1c-.8-.7-1.9-1.1-3.2-1.1s-2.4.4-3.2 1.1c-.8.7-1.2 1.6-1.2 2.8 0 1 .1 1.7.4 2.1l.6 1.2.2 1.1 1.8.9.3.7c.2.1.4.1.6.1h.7c.6 0 1-.1 1.3-.2l.3-.7 1.8-.9.2-1.1c0-.2.1-.4.1-.5.5-.9.8-1.9.8-2.9-.2-1-.6-1.9-1.5-2.6zm-5.1 6.1c-.7 0-1.1-.4-1.1-1.2 0-.4.1-.7.3-.9.2-.2.5-.3.8-.3.7 0 1 .4 1 1.1.1.8-.3 1.3-1 1.3zm2.2 1.7c-.1 0-.2 0-.3-.1-.1.1-.2.1-.3.1-.2 0-.3 0-.4-.1s-.1-.2-.1-.3c0-.1.1-.3.3-.5.2-.2.3-.4.5-.7.1.2.3.5.5.7.2.2.3.4.3.5 0 .3-.1.4-.5.4zm1.6-1.7c-.7 0-1.1-.4-1.1-1.2 0-.8.4-1.2 1.1-1.2.4 0 .6.1.8.3.2.2.3.5.3.8 0 .8-.4 1.3-1.1 1.3z"
+      />
+      <path
+        className="prefix__st3"
+        d="M9.1 487.1l2.4-5.7-5.3 2.8 2.2-5.1-3.7 3.7v-5.1l-4.5 9.4 4.5 9.5v-5.2l3.7 3.7-2.2-5 5.3 2.7z"
+      />
+      <path
+        className="prefix__st3"
+        d="M11.7 490.3c-2.6 0-8.5-.7-11.1-2.5l-.9-.6.9-.6c2.6-1.8 8.5-2.5 11.1-2.5h7.1v6.3h-7.1z"
+      />
+      <path
+        className="prefix__st2"
+        d="M18.1 484.7v4.8h-6.4c-2.6 0-8.3-.8-10.7-2.4 2.4-1.7 8.1-2.4 10.7-2.4h6.4m1.5-1.5h-7.9c-2.7 0-8.8.8-11.5 2.7l-1.8 1.2 1.8 1.2c2.7 1.9 8.9 2.7 11.5 2.7h7.9v-7.8z"
+      />
+      <path
+        className="prefix__st3"
+        d="M9.3 567.4l-8.4 1 5.7-3.7-6.2-4.1h6.4L.2 549.4l8.5 5.5-1.4-4.2 3.3 2.1 2.3-2.9 2.7 3.8 2.7-3.5-1.6 15.5z"
+      />
+      <path
+        className="prefix__st5"
+        d="M7 569.9l-.1-.2c-.3-.3-.6-.7-.8-1l-.4-.5.8-.3c.2-.1.3-.1.5-.2 1.3-.3 2.5-.8 3.9-1.4l.1-.1c0-.1.1-.3.1-.4-.4-.6-.7-1.4-.9-2.3-.1-.1-.1-.1-.2-.1-.1-.1-.2-.2-.3-.4-.3-.6-.4-1.2-.5-1.8v-.3c0-.5.1-.8.5-1 0-.2-.1-.5-.1-.7-.1-1.2.3-2.3 1.2-3.3.6-.7 1.5-1.6 2.9-1.9.4-.1.7-.1 1-.1 1.1 0 2.1.4 3 1.2.3.3.4.4.7.6.7.4 1 1.1 1.1 1.7.2.9.1 1.8 0 2.5 0 .1 0 .2-.1.3.2.2.2.5.3.6 0 .8-.2 1.7-.7 2.5-.2.3-.4.4-.5.5l-.3.9-.3.6c-.1.1-.1.2-.2.3v.2c.1.4.2.5.6.7.7.3 1.4.5 2.1.7l.3.1v2.5H7z"
+      />
+      <path
+        className="prefix__st2"
+        d="M14.6 554.4c1 0 1.9.3 2.6 1.1.3.3.5.5.8.7.5.3.7.8.8 1.3.2.8.1 1.6 0 2.4v.3c0 .2-.1.3.1.5.1.1.1.2.1.3 0 .8-.2 1.6-.6 2.3-.1.1-.2.3-.3.3H18c-.1.4-.3.8-.4 1.3-.1.3-.3.5-.4.8 0 .1-.1.2-.1.3v.2c.1.5.4.8.9 1 .7.3 1.4.5 2.2.7v1.6h-13c-.3-.3-.5-.6-.8-1 .2-.1.4-.2.6-.2 1.4-.3 2.7-.8 4-1.4.1-.1.3-.2.3-.3.1-.2.1-.5.2-.7 0-.1 0-.2-.1-.2-.4-.6-.7-1.4-.8-2.1 0-.1-.1-.2-.2-.2-.1-.1-.3-.3-.3-.4-.3-.5-.4-1.1-.5-1.7v-.2c0-.4.1-.6.5-.7-.1-.4-.1-.7-.2-1.1 0-1.1.3-2.1 1-2.9.7-.8 1.5-1.5 2.6-1.7.5-.2.8-.3 1.1-.3m0-1v1-1c-.4 0-.8 0-1.1.1-1.5.3-2.6 1.3-3.2 2-.9 1-1.3 2.3-1.3 3.6 0 .2 0 .3.1.5-.3.3-.4.7-.4 1.2v.3c.1.7.3 1.4.6 2 .1.2.3.4.4.5l.1.1c.2.8.4 1.5.8 2.1v.1c-1.3.6-2.5 1-3.6 1.3-.2 0-.4.1-.5.2-.1 0-.1 0-.2.1l-1.5.5.8 1.1c.3.4.6.7.9 1.1l.3.3h14.3v-3.3l-.7-.2c-.7-.2-1.4-.5-2.1-.7-.2-.1-.2-.1-.2-.3l.1-.1.3-.6c.1-.3.2-.5.3-.8.2-.1.4-.3.6-.6.5-.9.8-1.9.7-2.8 0-.2 0-.5-.2-.8v-.1c.1-.8.2-1.8 0-2.8-.1-.6-.4-1.5-1.4-2-.2-.1-.3-.2-.5-.4-1-1.1-2.1-1.6-3.4-1.6zM148.3 494.1c-.9-.3-4.1-1.4-5-1.7-.7-.2-1-.7-1.1-1.3 0-.1-.1-.2-.1-.3 0-.1 0-.3.1-.4.2-.3.4-.7.5-1 .2-.5.3-1.1.5-1.6.3.1.5-.1.6-.3.5-.9.8-1.8.8-2.9 0-.1-.1-.3-.2-.4-.2-.2-.2-.4-.1-.6 0-.1 0-.2.1-.4.2-1 .2-2 0-3-.1-.7-.4-1.4-1.1-1.7-.4-.2-.7-.5-1-.8-1.3-1.3-2.8-1.6-4.5-1.3-1.4.3-2.4 1.1-3.3 2.2-.9 1.1-1.4 2.3-1.3 3.7 0 .4.1.9.2 1.3-.5.1-.6.3-.7.8v.2c.1.7.3 1.5.6 2.1.1.2.3.4.4.6.1.1.2.2.2.3.2 1 .5 1.9 1.1 2.7.1.1.1.2.1.3l-.3.9c-.1.2-.2.3-.4.4-1.6.7-3.3 1.3-5 1.8-.3.1-.5.2-.8.3.3.4.7 1.4 1 1.7H147l1.3-1.6z"
+      />
+      <path
+        className="prefix__st5"
+        d="M139 476.4c-.4 0-.8 0-1.1.1h-.1c-.1 0-.3.1-.4.1 0 0-.1 0-.1.1-.3.1-.4.4-.3.6.1.2.3.3.5.3h.2c.2-.1.4-.1.6-.2.3-.1.7-.1 1-.1.3 0 .5-.2.5-.5-.3-.2-.5-.4-.8-.4zm-4 1.9c-.1 0-.3.1-.4.2l-.1.1c-.2.3-.3.5-.4.8-.1.3 0 .5.3.7h.2c.2 0 .4-.1.5-.3.2-.4.4-.8.8-1.2l.2-.2c.2-.2.2-.5 0-.7-.8.7-1 .6-1.1.6zm-1.3 4.2c-.4.1-.5.3-.5.6 0 .1 0 .2.1.3v.1c-.1 0-.2 0-.2.1-.1.1-.2.1-.3.2v.5c0 .3.2.5.5.5s.5-.3.5-.5c.4-.2.7-.6.6-1.1 0-.2-.1-.3-.1-.5v-.2c-.1.2-.3 0-.6 0zm.4 4.2c-.1 0-.2 0-.3.1-.2.2-.3.5-.1.7l.1.1c0 .1.1.1.1.2.1.3.1.5.2.7.1.2.3.3.5.3h.2c.3-.1.4-.4.3-.7-.2-.4-.3-.8-.4-1.3-.1-.3-.2-.6-.4-.7.1.7 0 .6-.2.6zm.7 5.3c-.1 0-.2 0-.3.1-.5.2-.9.4-1.4.6-.3.1-.4.4-.3.6.1.2.3.3.5.3h.2c.6-.2 1.2-.5 1.8-.7.1 0 .1-.1.2-.1.2-.1.3-.4.2-.7-.5 0-.7-.1-.9-.1zm-4.8 1.7h-.1c-.1 0-.2 0-.3.1h-.2c-.3.1-.5.2-.8.3.2.2.3.6.5.9H129.4c.1 0 .2 0 .2-.1.1 0 .2-.1.2-.2.1 0 .2 0 .3-.1.3-.1.4-.3.4-.6-.1-.1-.3-.3-.5-.3zm3.4 1.2h-2c-.3 0-.5.2-.5.5s.2.5.5.5h2c.3 0 .5-.2.5-.5s-.3-.5-.5-.5zm5 0h-2c-.3 0-.5.2-.5.5s.2.5.5.5h2c.3 0 .5-.2.5-.5s-.3-.5-.5-.5zm5 0h-2c-.3 0-.5.2-.5.5s.2.5.5.5h2c.3 0 .5-.2.5-.5s-.3-.5-.5-.5zm4-.9c-.2 0-.3.1-.4.2l-.5.7h-.2c-.3 0-.5.2-.5.5s.2.5.5.5h.7l.7-1c.2-.2.1-.5-.1-.7 0-.1-.1-.2-.2-.2zm-3.2-1.2c-.2 0-.4.1-.5.3-.1.3 0 .5.3.6.6.2 1.2.4 1.9.7h.2c.2 0 .4-.1.5-.3.1-.3 0-.5-.3-.6-.6-.2-1.3-.5-1.9-.7h-.2zm-2-1.8l-1 .2 1-.2zm0 0s-.1.1 0 0zm-.1.1zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0s-.1 0 0 0zm-.1 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0c-.1 0 0 0 0 0zm-.1 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0c-.1 0-.1 0 0 0zm-.1 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 .1zm0 0c-.1 0-.1 0 0 0zm-.1 0c-.2 0-.4.1-.5.1l.5-.1zm-.5.1c-.1 0-.2.1-.2.1s.1-.1.2-.1zm1.2-2.8c-.2 0-.4.1-.5.3 0 .1 0 .1-.1.2s-.2.3-.3.5c-.1.1-.2.3-.2.4-.1.2-.2.5-.2.8 0 .2 0 .4.1.5l1-.3v-.1c0-.1 0-.3.1-.4v-.1c0-.1.1-.2.1-.2 0-.1.1-.2.1-.2v-.1-.1c.1-.3 0-.5-.3-.6.3-.6.2-.6.2-.6zm1.7-4.1c-.3 0-.5.2-.5.5 0 .5-.1 1-.3 1.6-.1.3 0 .5.3.7h.2c.2 0 .4-.1.5-.3.1-.3.3-.7.3-1.1 0-1.2-.2-1.4-.5-1.4zm-.2-4.8h-.1c-.3.1-.4.3-.4.6 0 .1 0 .2.1.2.1.4.1.9.1 1.4 0 .3.2.5.5.5s.5-.2.5-.5v-.5c0-.2 0-.5-.1-.7 0-.1 0-.1-.1-.2-.1-.6-.3-.8-.5-.8zm-3.3-2.9c-.2 0-.4.1-.5.3-.1.3 0 .5.3.7.4.2.9.5 1.2.8.1.1.2.1.4.1.1 0 .3 0 .3-.1.2-.2.2-.5 0-.7-.5-.5-1-.8-1.5-1-.1-.1-.2-.1-.2-.1z"
+      />
+      <path
+        className="prefix__st0"
+        d="M9.5 604.8l.3-1.7c1.7-.1 3.3-.7 4.6-1.8l4.8 3.8-3.9-4.7c1.1-1.4 1.7-3 1.7-4.7l1.9-.3-1.9-.3c-.1-1.6-.7-3.1-1.8-4.4l4-4.7-4.8 3.8c-1.3-1.1-2.9-1.7-4.5-1.8l-.3-2-.3 2h-.1.1l-.7 4.4c-.3.1-.5.2-.8.4l-3.6-2.9 2.8 3.6c-.2.2-.3.5-.4.8l-6.5 1 1.8.3c0 1.7.6 3.4 1.8 4.8L.1 605l1-1 3.4-2.8c1.3 1.2 3 1.7 4.7 1.8l.3 1.8zm-.7-3c-1.7 0-3.5-.7-4.8-2-1.1-1.1-1.8-2.6-2-4.1l4.6.7c.1.3.2.5.4.8L6 599l1.7-1c.3.2.5.3.8.4l.5 3.4h-.2zm1.2-.1l.5-3.3c.3-.1.5-.2.8-.4l1.7 1-1-1.7c.2-.2.3-.5.4-.8l3.2-.5c-.2 1.4-.8 2.8-1.9 3.8-1.1 1-2.4 1.6-3.7 1.9zm5.6-6.8l-3.2-.5c-.1-.3-.2-.5-.4-.8l1-1.8-1.8 1c-.2-.2-.5-.3-.7-.4l-.7-4.4c1.4.2 2.7.9 3.8 1.9 1.4 1.5 2 3.3 2 5zM.2 629.2s7.6 3.3 14.2 5.9l1-2.3 1.1.4-1.6 2.9 4.3 2.4-.5 1.1-4.2-2.2-1.4 2.8-1.3-.4 1-1.9s-9.2-5.1-12.6-8.7zM3.2 628.2s4-5 11-5c0 0-6.4.9-9 6l-2-1zM7.2 629.7s2.2-2.7 6-2.7c0 0-3.5.5-4.9 3.3l-1.1-.6zM10.2 631.1s1.5-1.9 4.2-1.9c0 0-2.4.4-3.4 2.3l-.8-.4z"
+      />
+      <path
+        className="prefix__st5"
+        d="M17.2 666.1v.6c0 .1 0 .2-.1.3-.3 1.5-1.8 2.5-3.3 2.2-.3 0-.6-.1-.9-.2-.9 1.6-3.1 1.8-4.4.6l-.1.1c-.5.4-1 .8-1.6.9-.3.1-.5.1-.8.1h-.3-.1c-1.1-.1-2-.6-2.7-1.4 0 0-.1-.1-.2-.1-1.1.2-2.1-.5-2.5-1.6 0-.1-.1-.2-.1-.4v-.6-.1c.1-.9.8-1.6 1.7-1.8.2 0 .3-.1.5-.1.1-.9.6-1.6 1.4-2 .8-.5 1.6-.5 2.4-.2.7-2.1 2.7-3.4 4.9-3 2 .3 3.6 1.9 3.7 4.1h.1c1.1.3 1.7 1 2 2.1.4.2.4.3.4.5zM1.7 670.7l-1.5 4.7 2.6-3.8zM5.6 672.1l-.4 4.2 2.1-4.2zM10.9 671.9l.9 4.2.5-4.5zM14.7 670.9l3.5 5.4-2.2-5.9z"
+      />
+      <path
+        className="prefix__st0"
+        d="M32.1 5.4l1 4.2 1-4.2h1.4v5.7h-1.1V9.4l.1-2.2-1.1 3.9h-.7l-1.1-3.8.1 2.2v1.7h-1.1V5.4h1.5zM38.1 11.2c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.7c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3s-.4.1-.7.1zM38 7.7c-.2 0-.3.1-.4.2-.1.2-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.3-.2-.4-.2zM41.2 11.1h-1.1V5h1.1v6.1zM43.7 11.2c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.7c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3s-.5.1-.8.1zm-.1-3.5c-.2 0-.3.1-.4.2-.1.2-.2.4-.2.7h1v-.2c0-.2 0-.4-.1-.5s-.2-.2-.3-.2zM47.3 11.2c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.7c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3s-.4.1-.7.1zm-.1-3.5c-.2 0-.3.1-.4.2-.1.2-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.2-.2-.4-.2zM256.1 9.2c0 .6-.1 1.1-.4 1.4-.3.3-.7.5-1.3.5s-1.1-.2-1.4-.5-.5-.9-.5-1.5V7.4c0-.7.2-1.2.5-1.5s.8-.5 1.4-.5c.6 0 1.1.2 1.4.5s.5.8.5 1.4h-1.1c0-.4 0-.6-.2-.8s-.3-.2-.6-.2c-.2 0-.4.1-.6.3-.1.2-.2.5-.2.9v1.7c0 .4.1.7.2.9.1.2.3.3.6.3s.5-.1.6-.2.2-.4.1-.8h1zM258.8 11.1c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4s-.3.2-.5.2c-.3 0-.6-.1-.8-.3s-.3-.5-.3-.9.1-.7.4-1 .7-.3 1.2-.3h.4v-.5c0-.2 0-.4-.1-.5s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4s.4.6.4 1.1v2.4c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1s.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3s.2.2.3.2zM262.3 10c0-.1 0-.2-.1-.3s-.3-.2-.5-.3c-.4-.2-.7-.3-1-.5s-.3-.5-.3-.8c0-.3.1-.6.4-.9s.6-.4 1.1-.4c.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.3c0 .1 0 .2.1.3s.3.2.5.3c.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9s-.7.3-1.1.3c-.5 0-.9-.1-1.2-.4s-.4-.6-.4-1h1c0 .2.1.4.2.5s.2.1.4.1c.1 0 .3 0 .3-.1s.1-.1.1-.2zM265.2 5.8v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3s-.3-.6-.3-1V7.7h-.5v-.9h.5v-1h1zM267.6 5.8h-1.1V5h1.1v.8zm0 5.3h-1.1V6.8h1.1v4.3zM269.4 6.8v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3V11h-1.1V8.5c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1V6.8h1.1zM272.1 8.8c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1s.3.2.4.4l.1-.5h1V11c0 .6-.2 1-.5 1.3s-.8.5-1.3.5c-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2s.3.1.5.1.4-.1.5-.2.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3s-.3.1-.4.1c-.4 0-.8-.2-1-.5s-.4-.8-.4-1.4v-.6zm1.1.5c0 .3 0 .5.1.7s.2.3.4.3c.1 0 .2 0 .3-.1s.2-.1.2-.2V8c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3-.1.2-.1.5-.1.8v.5zM281.3 6.3H280v4.8h-1.1V6.3h-1.3v-.9h3.7v.9zM282.9 5.8h-1.1V5h1.1v.8zm0 5.3h-1.1V6.8h1.1v4.3zM284.8 6.8v.5c.1-.2.3-.4.4-.5s.4-.2.6-.2c.2 0 .4.1.6.2s.3.3.4.5c.1-.2.2-.4.4-.5s.4-.2.6-.2c.3 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1V8.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1s-.2.1-.2.3V11.1h-1.1V8.5c0-.3 0-.5-.1-.7-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1l-.2.2V11h-1.1V6.8h1zM291.2 11.2c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.7c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3s-.4.1-.7.1zm0-3.5c-.2 0-.3.1-.4.2-.1.2-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.3-.2-.4-.2zM253.7 34v2.3h-1.1v-5.7h1.9c.6 0 1 .1 1.3.4.3.3.5.7.5 1.2 0 .3-.1.6-.2.8-.1.2-.3.4-.6.5.3.1.5.3.6.5.1.2.2.5.2.9v.4c0 .2 0 .3.1.5s.1.3.2.4v.1h-1.1c-.1-.1-.1-.2-.2-.4s0-.4 0-.6v-.4c0-.3-.1-.5-.2-.7s-.3-.2-.5-.2h-.9zm0-.9h.7c.2 0 .4-.1.5-.2s.2-.3.2-.6-.1-.5-.2-.6-.3-.2-.5-.2h-.7v1.6zM258.2 31h-1.1v-.8h1.1v.8zm0 5.3h-1.1v-4.2h1.1v4.2zM260.3 31v1.1h.6v.8h-.6V35c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3s-.3-.6-.3-1V33h-.5v-.8h.5V31h1zM263.7 35.8c-.1.2-.3.3-.4.4s-.3.1-.6.1c-.4 0-.7-.1-.9-.4s-.3-.7-.3-1.3V32h1.1v2.6c0 .3 0 .5.1.7.1.1.2.2.3.2.1 0 .2 0 .3-.1.1 0 .2-.1.2-.2V32h1.1v4.2h-1l.1-.4zM267.5 36.3c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4s-.3.2-.5.2c-.3 0-.6-.1-.8-.3s-.3-.5-.3-.9.1-.7.4-1 .7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4s.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.8c.1 0 .2 0 .3-.1s.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3s.2.2.3.2zM270.2 36.3h-1.1v-6.1h1.1v6.1zM256.1 63.8c0 .6-.1 1.1-.4 1.4-.3.3-.7.5-1.3.5s-1.1-.2-1.4-.5-.5-.9-.5-1.5V62c0-.7.2-1.2.5-1.5s.8-.5 1.4-.5c.6 0 1.1.2 1.4.5s.5.8.5 1.4h-1.1c0-.4 0-.6-.2-.8s-.3-.2-.6-.2c-.2 0-.4.1-.6.3-.1.2-.2.5-.2.9v1.7c0 .4.1.7.2.9.1.2.3.3.6.3s.5-.1.6-.2.2-.4.1-.8h1zM256.6 63.3c0-.6.2-1 .5-1.4s.7-.5 1.3-.5 1 .2 1.3.5.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4s-.7.5-1.3.5c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8s.2.3.5.3c.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8s-.2-.3-.5-.3-.4.1-.5.3-.1.4-.1.8v.5zM261.7 61.4v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1V63c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM266.1 64.8c.2 0 .3-.1.3-.2s.1-.3.1-.5h1c0 .4-.1.8-.4 1.1s-.6.4-1.1.4c-.5 0-1-.2-1.3-.5s-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4s.7-.5 1.3-.5c.5 0 .8.1 1.1.4s.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3s-.1.4-.1.8v.5c0 .3 0 .6.1.8s.2.3.5.3zM269.7 65.7c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1V63c0-.2 0-.4-.1-.5s-.2-.3-.4-.3zM272.8 61.4v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1V63c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM277 60.4v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3s-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM280.2 62.4h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5s.3-.2.4-.2H280.2v1.1zM282.8 65.6c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4s-.3.2-.5.2c-.3 0-.6-.1-.8-.3s-.3-.5-.3-.9.1-.7.4-1 .7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4s.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1s.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3s.1.2.3.2zM285.7 60.4v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3s-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM288.1 60.4H287v-.8h1.1v.8zm0 5.2H287v-4.2h1.1v4.2zM288.7 63.3c0-.6.2-1 .5-1.4s.7-.5 1.3-.5 1 .2 1.3.5.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4s-.7.5-1.3.5c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8s.2.3.5.3c.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8s-.2-.3-.5-.3-.4.1-.5.3-.1.4-.1.8v.5zM293.8 61.4v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1V63c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM31.8 44.4v2.3h-1.1V41h1.9c.6 0 1 .1 1.3.4s.5.7.5 1.2c0 .3-.1.6-.2.8s-.3.4-.6.5c.3.1.5.3.6.5s.2.5.2.9v.4c0 .2 0 .3.1.5s.1.3.2.4v.1h-1.1c-.1-.1-.1-.2-.2-.4s0-.4 0-.6v-.4c0-.3-.1-.5-.2-.7s-.3-.2-.5-.2h-.9zm0-.9h.7c.2 0 .4-.1.5-.2s.2-.3.2-.6-.1-.5-.2-.6-.3-.2-.5-.2h-.7v1.6zM37.2 46.6c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4s-.3.2-.5.2c-.3 0-.6-.1-.8-.3s-.3-.6-.3-1 .1-.7.4-1 .7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4s.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1s.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3s.2.2.3.2zM39.9 42.4v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1V44c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM42.6 44.3c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1s.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3s-.8.5-1.3.5c-.2 0-.4 0-.6-.1s-.5 0-.6-.1l.2-.9c.1.1.3.1.5.2s.3.1.5.1.4-.1.5-.2.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3s-.3.1-.4.1c-.4 0-.8-.2-1-.5s-.4-.8-.4-1.4v-.6zm1.1.5c0 .3 0 .5.1.7s.2.3.4.3c.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5zM48.3 46.7c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1V44c0-.2 0-.4-.1-.5s-.3-.3-.4-.3zM50.1 44.5c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4s-.3.1-.5.1c-.4 0-.8-.2-1-.6s-.3-.7-.3-1.5zm1.2.1c0 .4 0 .7.1.9s.2.3.4.3c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1zM32.1 116.8l1 4.2 1-4.2h1.4v5.7h-1.1v-1.7l.1-2.2-1.1 3.9h-.7l-1.1-3.8.1 2.2v1.7h-1.1v-5.7h1.5zM38.1 122.6c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.3-.2-.4-.2zM41.2 122.5h-1.1v-6.1h1.1v6.1zM43.7 122.6c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.8zm-.1-3.5c-.2 0-.3.1-.4.2s-.2.4-.2.7h1v-.2c0-.2 0-.4-.1-.5s-.2-.2-.3-.2zM47.3 122.6c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.2-.2-.4-.2zM31.8 155.8v2.3h-1.1v-5.7h1.9c.6 0 1 .1 1.3.4s.5.7.5 1.2c0 .3-.1.6-.2.8s-.3.4-.6.5c.3.1.5.3.6.5s.2.5.2.9v.4c0 .2 0 .3.1.5s.1.3.2.4v.1h-1.1c-.1-.1-.1-.2-.2-.4s0-.4 0-.6v-.4c0-.3-.1-.5-.2-.7s-.3-.2-.5-.2h-.9zm0-.9h.7c.2 0 .4-.1.5-.2s.2-.3.2-.6-.1-.5-.2-.6-.3-.2-.5-.2h-.7v1.6zM37.2 158.1c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4s-.3.2-.5.2c-.3 0-.6-.1-.8-.3s-.3-.5-.3-.9.1-.7.4-1 .7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4s.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1s.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3s.2.2.3.2zM39.9 153.8v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM42.6 155.8c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1s.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3s-.8.5-1.3.5c-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2s.3.1.5.1.4-.1.5-.2.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3s-.3.1-.4.1c-.4 0-.8-.2-1-.5s-.4-.8-.4-1.4v-.5zm1.1.5c0 .3 0 .5.1.7s.2.3.4.3c.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5zM48.3 158.2c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.3-.2-.4-.2zM50.1 156c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3V152h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4s-.3.1-.5.1c-.4 0-.8-.2-1-.6s-.3-.8-.3-1.5zm1.2.1c0 .4 0 .7.1.9s.2.3.4.3c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.3-.1.6-.1 1.1zM34.1 74.8h-1.3v4.8h-1.1v-4.8h-1.3v-.9h3.7v.9zM35.6 75.9c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4s.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2h-1.1v-6.1h1.1v2.3zM40.4 76.4H40c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5s.3-.2.4-.2H40.4v1.1zM40.8 77.2c0-.6.2-1 .5-1.4s.7-.5 1.3-.5 1 .2 1.3.5.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4s-.7.5-1.3.5c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.4v-.5zm1.1.6c0 .3 0 .6.1.8s.2.3.5.3c.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8s-.2-.3-.5-.3-.4.1-.5.3-.1.4-.1.8v.5zM47.9 77.8l.4-2.4h1l-.9 4.2h-.9l-.6-2.3-.6 2.3h-.9l-.9-4.2h1l.4 2.4.6-2.4h.7l.7 2.4zM50.8 75.4v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.4.7.4 1.3v2.6h-1.1V77c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1zM163.7 233.4v-5.7h1.7c.6 0 1 .1 1.4.4s.5.6.5 1.2c0 .3-.1.5-.2.7s-.3.4-.5.5c.3.1.5.2.7.5s.2.5.2.8c0 .5-.2 1-.5 1.2s-.8.4-1.3.4h-2zm1.2-3.3h.6c.2 0 .4-.1.5-.2s.2-.3.2-.5c0-.3-.1-.5-.2-.6s-.3-.2-.6-.2h-.6v1.5zm0 .8v1.6h.8c.2 0 .4-.1.5-.2s.2-.3.2-.6 0-.5-.1-.6-.3-.2-.5-.2h-.9zM169.3 233.4h-1.1v-6.1h1.1v6.1zM171.2 228.2h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM173 229.2v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6H174v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1v-4.2h1zM175.7 231.3c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4s-.3.1-.5.1c-.4 0-.8-.2-1-.6s-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9s.2.3.4.3c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4 0 .2-.1.5-.1 1zM181.4 233.5c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.7c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3s-.4.1-.7.1zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.2-.2-.4-.2zM183.3 231.3c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4s-.3.1-.5.1c-.4 0-.8-.2-1-.6s-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9s.2.3.4.3c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1zM167.5 268.3c-.2.2-.4.5-.7.6-.3.2-.7.3-1.2.3-.6 0-1.1-.2-1.5-.5-.4-.4-.6-.9-.6-1.5v-1.7c0-.7.2-1.2.5-1.5s.8-.5 1.4-.5c.6 0 1.1.2 1.4.5.3.3.5.8.5 1.3h-1c0-.3-.1-.6-.2-.7s-.3-.2-.6-.2-.5.1-.6.3c-.2.2-.2.5-.2.9v1.7c0 .4.1.7.2.9s.4.3.7.3c.2 0 .4 0 .5-.1.1-.1.2-.1.3-.3v-1h-.8v-.8h1.9v2zM170.3 265.9h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H170.3v1.1zM172.9 269.1c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM177.8 267.3c0 .6-.1 1-.4 1.4-.2.3-.6.5-1 .5-.2 0-.3 0-.5-.1-.1-.1-.3-.2-.3-.3v2h-1.1v-5.9h1v.4c.1-.2.2-.3.4-.4s.3-.1.5-.1c.4 0 .8.2 1 .5.2.4.4.8.4 1.4v.6zm-1.1-.5c0-.3 0-.6-.1-.8s-.2-.3-.4-.3c-.1 0-.2 0-.3.1s-.2.1-.2.2v2c.1.1.1.2.2.2s.2.1.3.1c.2 0 .4-.1.4-.3s.1-.4.1-.7v-.5zM181.7 267.3c0 .6-.1 1-.4 1.4-.2.3-.6.5-1 .5-.2 0-.3 0-.5-.1-.1-.1-.3-.2-.3-.3v2h-1.1v-5.9h1v.4c.1-.2.2-.3.4-.4s.3-.1.5-.1c.4 0 .8.2 1 .5.2.4.4.8.4 1.4v.6zm-1.1-.5c0-.3 0-.6-.1-.8s-.2-.3-.4-.3c-.1 0-.2 0-.3.1s-.2.1-.2.2v2c.1.1.1.2.2.2s.2.1.3.1c.2 0 .4-.1.4-.3s.1-.4.1-.7v-.5zM183.5 269.1h-1.1V263h1.1v6.1zM185.9 269.2c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.2-.1-.4 0-.7 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.2-.3-.2-.4-.2zM187.7 267c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3V263h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.1-.3-.3-.8-.3-1.5zm1.2.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1zM164.9 307.6v2h-1.1V304h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3c-.3.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM168 307.3c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM173.2 304.4h-1.1v-.8h1.1v.8zm0 5.3h-1.1v-4.2h1.1v4.2zM175.8 308.6c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1 0 .1-.1.1-.2zM177.3 307.3c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM182.3 305.4v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1V307c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM186.8 309.8c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H186c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.1-.1-.4 0-.7 0zm0-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.2-.2-.3-.2-.4-.2zM188.7 307.6c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1zM163.7 341.6v-5.7h1.7c.6 0 1.1.2 1.4.7s.6 1 .6 1.7v1c0 .7-.2 1.3-.6 1.7-.4.4-.9.7-1.4.7h-1.7zm1.2-4.8v3.9h.5c.3 0 .5-.1.7-.4s.3-.6.3-1.1v-1c0-.4-.1-.8-.3-1.1s-.4-.4-.7-.4h-.5zM169.8 341.7c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H169c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM173.9 341.6c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM175.8 341.6v-3.4h-.5v-.8h.5v-.5c0-.5.1-.8.4-1.1.2-.3.6-.4 1-.4h.3c.1 0 .2 0 .3.1l-.1.8h-.4c-.1 0-.2.1-.3.2-.1.1-.1.2-.1.4v.5h.7v.8h-.7v3.4h-1.1zM179.6 341.7c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H179c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.9zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM182.6 337.4v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1V339c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM187.1 341.7c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm0-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.2-.1-.3-.2-.4-.2zM189 339.5c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.2-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4 0 .2-.1.5-.1 1zM164.9 379.5h-1.1v-5.7h1.1v5.7zM166.8 375.3v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM171.2 378.7c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6s-.2-.2-.3-.2c-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM175.3 379.5c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM180.2 377.7c0 .6-.1 1-.4 1.4-.2.3-.6.5-1 .5-.2 0-.3 0-.5-.1-.1-.1-.3-.2-.3-.3v2h-1.1v-5.9h1v.4c.1-.2.2-.3.4-.4s.3-.1.5-.1c.4 0 .8.2 1 .5.2.4.4.8.4 1.4v.6zm-1.1-.5c0-.3 0-.6-.1-.8s-.2-.3-.4-.3c-.1 0-.2 0-.3.1s-.2.1-.2.2v2c.1.1.1.2.2.2s.2.1.3.1c.2 0 .4-.1.4-.3s.1-.4.1-.7v-.5zM182.8 379.5c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM186 378.7c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6s-.2-.2-.3-.2c-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM189.2 374.3h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM191.3 374.2v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM194.5 379.5c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM197.5 374.2v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM200.3 379.6c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.1-.1-.4 0-.7 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.2-.2-.2-.4-.2zM202.2 377.4c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1z"
+      />
+      <g>
+        <path
+          className="prefix__st0"
+          d="M164.9 418.7v2h-1.1V415h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM170.2 417.5h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H170.2v1.1zM170.5 418.4c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM175.6 416.5v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM180.1 420.8c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M167.3 450.2c0 .6-.1 1.1-.4 1.4-.3.3-.7.5-1.3.5s-1.1-.2-1.4-.5c-.4-.4-.5-.9-.5-1.5v-1.7c0-.7.2-1.2.5-1.5s.8-.5 1.4-.5c.6 0 1.1.2 1.4.5.3.3.5.8.5 1.4h-1.1c0-.4 0-.6-.2-.8-.1-.2-.3-.2-.6-.2-.2 0-.4.1-.6.3-.1.2-.2.5-.2.9v1.7c0 .4.1.7.2.9s.3.3.6.3.5-.1.6-.2c.1-.2.2-.4.1-.8h1zM169 448.3c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5H170v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2h-1.1V446h1.1v2.3zM173.9 452c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM177.5 448.8h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H177.5v1.1zM179.1 447.8v.5c.1-.2.3-.3.4-.5.2-.1.4-.2.6-.2.2 0 .4.1.6.2s.3.3.4.5c.1-.2.2-.4.4-.5.2-.1.4-.2.6-.2.3 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1s-.2.1-.2.3V451.9h-1.1v-2.6c0-.3 0-.5-.1-.7-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1l-.2.2v3.1h-1.1v-4.2h1zM185.6 452.1c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H185c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.4-.1-.6 0-.9 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM187.5 449.9c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2V449c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M164.9 490h-1.1v-5.7h1.1v5.7zM166.8 485.8v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM171 488.4l.1.3.1-.3.5-2.6h1.2l-1.2 4.2h-1.1l-1.2-4.2h1.2l.4 2.6zM174.4 484.8h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM177 488.9c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1H177c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1 0 0 .1-.1.1-.2zM179.8 484.8h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM183.8 488.2c0 .6-.1 1-.4 1.4-.2.3-.6.5-1 .5-.2 0-.4 0-.5-.1-.1-.1-.3-.2-.4-.4l-.1.5h-1V484h1.1v2.2l.3-.3c.1-.1.3-.1.5-.1.5 0 .8.2 1 .5.2.4.4.8.4 1.4v.5zm-1.1-.6c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3-.1 0-.2 0-.3.1s-.2.1-.2.3v2c.1.1.1.2.2.2s.2.1.3.1c.2 0 .4-.1.5-.2.1-.2.1-.4.1-.7v-.7zM185.6 490h-1.1v-6.1h1.1v6.1zM188 490.1c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M164.9 536.5v2h-1.1v-5.7h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3c-.3.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM169.8 538.6c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H169c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.2-.1-.4 0-.7 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM173.1 533.2v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM176.3 535.3h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H176.3v1.1zM178.1 533.3H177v-.8h1.1v.8zm0 5.2H177v-4.2h1.1v4.2zM179.1 538.5v-3.4h-.5v-.8h.5v-.3c0-.5.1-1 .4-1.2s.7-.4 1.2-.4c.2 0 .4 0 .5.1s.4.1.6.2l-.2.9c-.2-.1-.3-.1-.5-.1h-.5c-.2 0-.4.1-.5.2-.1.1-.2.3-.2.5v.3h.7v.8h-.7v3.4h-.8zm3.3 0h-1.1v-4.2h1.1v4.2zM184.8 538.6c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H184c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.1-.1-.4 0-.7 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM186.7 536.4c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M261.6 402.5h-1.9v1.6h2.2v.9h-3.4v-5.7h3.4v.9h-2.2v1.4h1.9v.9zM263.9 402.1l.5-1.3h1.2l-1 2.1 1.1 2.1h-1.2l-.5-1.4-.5 1.4h-1.2l1.1-2.1-1-2.1h1.2l.3 1.3zM267.1 401.3c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2H266V399h1.1v2.3zM272 405c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.1.2.3.2zM275.8 404.5c-.1.2-.3.3-.4.4s-.3.1-.6.1c-.4 0-.7-.1-.9-.4s-.3-.7-.3-1.3v-2.6h1.1v2.6c0 .3 0 .5.1.7s.2.2.3.2c.1 0 .2 0 .3-.1s.2-.1.2-.2v-3.2h1.1v4.2h-1l.1-.4zM279.3 403.9c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1 0 .1-.1.1-.2zM282.3 399.7v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM285.1 405.1c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.1-.1-.4 0-.7 0zm0-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.2-.2-.3-.2-.4-.2zM287 402.9c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2V402c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4 0 .2-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M259.7 318.5v2h-1.1v-5.7h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3c-.3.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM265.1 320.5c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4H263c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM268.7 317.3h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H268.7v1.1zM271.3 320.5c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM274.1 320.5H273v-6.1h1.1v6.1zM276.3 318.8l.6-2.5h1.2l-1.4 4.9c-.1.3-.2.6-.4.8-.2.2-.5.3-.8.3h-.2s-.2 0-.3-.1l.1-.8h.2c.2 0 .3 0 .4-.1.1-.1.1-.2.2-.3l.1-.3-1.2-4.3h1.2l.3 2.4zM279.6 319.6h1.7v.9h-2.9v-.7l1.6-2.7h-1.6v-.9h2.9v.6l-1.7 2.8zM283.5 320.6c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.2-.1-.4 0-.7 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.2-.2-.2-.4-.2zM285.4 318.4c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M261.7 282h-1.9v2.4h-1.1v-5.7h3.4v.9h-2.3v1.6h1.9v.8zM264.4 281.1h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H264.4v1.1zM266.1 279.1H265v-.8h1.1v.8zm0 5.2H265v-4.2h1.1v4.2zM266.8 282c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.1.5c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2s-.2-.1-.3-.1c-.2 0-.4.1-.4.3s-.1.5-.1.8v.5zM271.9 280.6c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7s-.2-.2-.4-.2c-.1 0-.2 0-.3.1l-.2.2v3.2h-1.1v-6.1h1.1v2.3zM276 279v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1V281h-.5v-.8h.5V279h1zM278.9 284.4c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.2-.1-.3-.2-.4-.2zM281.9 280.1v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1zM286.4 284.4c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM288.3 282.2c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M261.1 361.9c0-.2-.1-.4-.2-.5s-.3-.3-.6-.4c-.6-.2-1-.4-1.3-.7s-.4-.6-.4-1.1c0-.5.2-.8.5-1.1s.8-.4 1.3-.4 1 .2 1.3.5c.3.3.5.7.5 1.2h-1.1c0-.3-.1-.5-.2-.6-.1-.2-.3-.2-.6-.2-.2 0-.4.1-.5.2-.1.1-.2.3-.2.5s.1.3.2.5.4.3.7.4c.5.2.9.4 1.2.7.3.3.4.7.4 1.1 0 .5-.2.9-.5 1.2-.3.3-.8.4-1.3.4s-1-.2-1.4-.5-.6-.8-.6-1.4h1.1c0 .4.1.6.2.8.1.2.4.2.7.2.2 0 .4-.1.5-.2s.3-.4.3-.6zM264.2 358.1v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM267.6 362.8c-.1.2-.3.3-.4.4s-.3.1-.6.1c-.4 0-.7-.1-.9-.4s-.3-.7-.3-1.3V359h1.1v2.6c0 .3 0 .5.1.7.1.1.2.2.3.2.1 0 .2 0 .3-.1.1 0 .2-.1.2-.2V359h1.1v4.2h-1l.1-.4zM270.3 359.1v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM274.2 359.1v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM278.7 363.4c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM280.6 361.2c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.2-.3-.7-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M167.5 563.7v3.9c0 .6-.2 1.1-.5 1.4-.4.3-.8.5-1.4.5s-1-.2-1.4-.5c-.4-.3-.5-.8-.5-1.4v-3.9h1.1v3.9c0 .3.1.6.2.8s.3.2.6.2.5-.1.6-.2.2-.4.2-.8v-3.9h1.1zM169.3 565.2v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM173.7 568.6c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM175.6 567.1c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM180.6 565.2v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM185 568.6c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM188.9 568.3c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1 0 .1.1 0 .1-.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M38.1 664.9h-1.3v4.8h-1.1v-4.8h-1.3v-.9h3.7v.9zM39.6 665.9c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2h-1.1v-6.1h1.1v2.3zM44.6 669.2c-.1.2-.3.3-.4.4s-.3.1-.6.1c-.4 0-.7-.1-.9-.4s-.3-.7-.3-1.3v-2.6h1.1v2.6c0 .3 0 .5.1.7s.2.2.3.2c.1 0 .2 0 .3-.1s.2-.1.2-.2v-3.2h1.1v4.2h-1l.1-.4zM47.3 665.4v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1V667c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM50.1 667.6c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1zM55.7 669.8c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.1-.1-.4 0-.7 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.2-.2-.2-.4-.2zM59.8 666.5h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H59.8v1.1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M37.3 633.2c0-.2-.1-.4-.2-.5s-.3-.3-.6-.4c-.6-.2-1-.4-1.3-.7s-.4-.6-.4-1.1c0-.5.2-.8.5-1.1s.8-.4 1.3-.4 1 .2 1.3.5c.3.3.5.7.5 1.2h-1.1c0-.3-.1-.5-.2-.6-.1-.2-.3-.2-.6-.2-.2 0-.4.1-.5.2-.1.1-.2.3-.2.5s.1.3.2.5.4.3.7.4c.5.2.9.4 1.2.7.3.3.4.7.4 1.1 0 .5-.2.9-.5 1.2-.3.3-.8.4-1.3.4s-1-.2-1.4-.5-.6-.8-.6-1.4h1.1c0 .4.1.6.2.8.1.2.4.2.7.2.2 0 .4-.1.5-.2s.3-.3.3-.6zM40.2 634.7H39v-6.1h1.1v6.1zM43 634.7c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM46.5 633.6c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1 0 .1.1 0 .1-.2zM49.2 631c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2h-1.1v-6.1h1.1v2.3zM53.1 629.5H52v-.8h1.1v.8zm0 5.2H52v-4.2h1.1v4.2zM54.9 630.5v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1zM57.6 632.4c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.2.5c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M35.8 596.5v2.3h-1.1v-5.7h1.9c.6 0 1 .1 1.3.4.3.3.5.7.5 1.2 0 .3-.1.6-.2.8s-.3.4-.6.5c.3.1.5.3.6.5.1.2.2.5.2.9v.4c0 .2 0 .3.1.5 0 .2.1.3.2.4v.1h-1.1c-.1-.1-.1-.2-.2-.4s0-.4 0-.6v-.4c0-.3-.1-.5-.2-.7s-.3-.2-.5-.2h-.9zm0-.9h.7c.2 0 .4-.1.5-.2.1-.1.2-.3.2-.6s-.1-.5-.2-.6c-.1-.2-.3-.2-.5-.2h-.7v1.6zM41.3 598.8c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.4c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM42.7 596.7c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2H46v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.1-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4 0 .2-.1.5-.1 1zM47.9 593.5h-1.1v-.8h1.1v.8zm0 5.3h-1.1v-4.2h1.1v4.2zM50.8 598.8c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.4c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM53.4 594.6v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM57.6 593.5v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1H56v-.8h.5v-1.1h1.1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M35.8 559.3v2h-1.1v-5.7h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3c-.3.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM41 560.3c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1H41c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1 0 .1-.1.1-.2zM44 559.6l.6-2.5h1.2l-1.4 4.9c-.1.3-.2.6-.4.8-.2.2-.5.3-.8.3H43s-.2 0-.3-.1l.1-.8h.2c.2 0 .3 0 .4-.1.1-.1.1-.2.2-.3l.1-.3-1.2-4.3h1.2l.3 2.4zM47.7 560.6c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6s-.2-.2-.3-.2c-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM50.8 557.6c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7s-.2-.2-.4-.2c-.1 0-.2 0-.3.1l-.2.2v3.2h-1.1v-6.1h1.1v2.3zM54.8 556.1h-1.1v-.8h1.1v.8zm0 5.3h-1.1v-4.2h1.1v4.2zM57.1 560.6c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6s-.2-.2-.3-.2c-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.2.3.5.3z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M38.7 527.3h-1.1l-1.7-3.6v3.6h-1.1v-5.7h1.1l1.7 3.6v-3.6h1.1v5.7zM41.2 527.4c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.2-.1-.3-.2-.4-.2zM44.7 526.5c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.4c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.2.5.2zM48 522.1v1.1h.6v.8H48v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM49 525c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.2.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM55.1 524.1h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H55.1v1.1zM56.8 522.1h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM59.4 526.2c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1.1.1 0 .1-.2zM62.3 525.6h-.2v1.8H61v-6.1h1.1v3.5h.2l.7-1.6h1.3l-1.1 1.9 1.3 2.3h-1.3l-.9-1.8zM64.6 525.2c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.2-.3-.7-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.6-.1 1zM69.6 523.1v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM74.5 527.3c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM78 526.2c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1H78c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1.1.1 0 .1-.2zM81.2 526.5c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.4c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.2.5.2zM85.3 527.3c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM88.7 526.2c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1.1.1 0 .1-.2zM91.9 526.5c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.4c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.2.5.2zM96 527.3c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M35.8 487.5v2h-1.1v-5.7h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM40.3 484.3h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM42.8 489.6c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H42c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.3-.2-.4-.2zM46.8 486.3h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H46.8v1.1zM48.8 488.7c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM52 484.3h-1.1v-.8H52v.8zm0 5.2h-1.1v-4.2H52v4.2zM53.8 485.3v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM56.5 487.2c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.1.6c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M34.7 455.9v-5.7h1.7c.6 0 1 .1 1.4.4.3.3.5.6.5 1.2 0 .3-.1.5-.2.7-.1.2-.3.4-.5.5.3.1.5.2.7.5s.2.5.2.8c0 .5-.2 1-.5 1.2s-.8.4-1.3.4h-2zm1.1-3.3h.6c.2 0 .4-.1.5-.2.1-.1.2-.3.2-.5 0-.3-.1-.5-.2-.6s-.3-.2-.6-.2h-.6v1.5zm0 .8v1.6h.8c.2 0 .4-.1.5-.2.1-.1.2-.3.2-.6s0-.5-.1-.6c-.1-.1-.3-.2-.5-.2h-.9zM40.3 455.9h-1.1v-6.1h1.1v6.1zM43.2 455.4c-.1.2-.3.3-.4.4s-.3.1-.6.1c-.4 0-.7-.1-.9-.4s-.3-.7-.3-1.3v-2.6h1.1v2.6c0 .3 0 .5.1.7s.2.2.3.2c.1 0 .2 0 .3-.1s.2-.1.2-.2v-3.2h1.1v4.2h-1l.1-.4zM46.1 450.6H45v-.8h1.1v.8zm0 5.3H45v-4.2h1.1v4.2zM47.9 451.7v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM50.6 453.6c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.1.5c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M35.8 414h2.1v.9h-3.2v-5.7h1.1v4.8zM39.6 409.6h-1.1v-.8h1.1v.8zm0 5.3h-1.1v-4.2h1.1v4.2zM40.2 412.6c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.1.5c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5zM45.3 411.2c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2h-1.1v-6.1h1.1v2.3zM49.4 409.6v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM51.7 410.7v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM55.7 409.6h-1.1v-.8h1.1v.8zm0 5.3h-1.1v-4.2h1.1v4.2zM57.5 410.7v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM60.2 412.6c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.1.5c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M37.8 377.1h-1.9v2.4h-1.1v-5.7h3.4v.9h-2.3v1.6h1.9v.8zM38.4 377.1c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.6c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM44.4 376.3H44c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H44.4v1.1zM46.5 378.7c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6s-.2-.2-.3-.2c-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.2.3.5.3zM50.1 379.6c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.1-.1-.4 0-.7 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.2-.2-.2-.4-.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M37.8 344h-1.9v2.4h-1.1v-5.7h3.4v.9h-2.3v1.6h1.9v.8zM39.8 341.1h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM42.6 343.1h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H42.6v1.1zM44.7 346.4c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M40.9 307.8c0 .6-.1 1.1-.4 1.4-.3.3-.7.5-1.3.5s-1.1-.2-1.4-.5c-.4-.4-.5-.9-.5-1.5V306c0-.7.2-1.2.5-1.5s.8-.5 1.4-.5c.6 0 1.1.2 1.4.5.3.3.5.8.5 1.4H40c0-.4 0-.6-.2-.8-.1-.2-.3-.2-.6-.2-.2 0-.4.1-.6.3s-.2.5-.2.9v1.7c0 .4.1.7.2.9.1.2.3.3.6.3s.5-.1.6-.2c.1-.2.2-.4.1-.8h1zM41.4 307.3c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM46.6 309.7h-1.1v-6.1h1.1v6.1zM47.2 307.6c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M38.5 272.4v2h-1.1v-5.7h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM41.6 272.1c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM46.8 269.2h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM49.4 273.3c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1.1.1 0 .1-.2zM50.9 272.1c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM55.9 270.2v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M39.9 238.1h-1.5l-.3 1.2H37l1.6-5.7h1.2l1.6 5.7h-1.1l-.4-1.2zm-1.3-.9h1l-.5-2-.5 2zM43.2 238.5c.2 0 .3-.1.3-.2s.1-.3.1-.5h1c0 .4-.1.8-.4 1.1s-.6.4-1.1.4c-.5 0-1-.2-1.3-.5s-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4s.7-.5 1.3-.5c.5 0 .8.1 1.1.4s.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3s-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM46.4 234.1h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM47 237.2c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4s-.3.1-.5.1c-.4 0-.8-.2-1-.6s-.3-.8-.3-1.5zm1.2.1c0 .4 0 .7.1.9s.2.3.4.3c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M138.2 224c-4.4 0-7.9 2.6-9.6 6.4 1.7 3.9 5.2 6.4 9.6 6.4 4.4 0 7.9-2.6 9.6-6.4-1.7-3.8-5.2-6.4-9.6-6.4zm0 11.3c-3.5 0-6.5-2-7.8-4.9 1.4-2.9 4.4-4.9 7.8-4.9 3.5 0 6.5 2 7.9 4.9-1.4 2.9-4.4 4.9-7.9 4.9z"
+        />
+        <path
+          fill="none"
+          stroke="#000"
+          strokeWidth={2}
+          strokeMiterlimit={10}
+          d="M146.8 221.7l-17 17"
+        />
+        <path
+          className="prefix__st0"
+          d="M136.6 231.5c0 .1-.1.1-.1.2-.1.2-.3.3-.5.4-.1.1-.2.1-.2.1.6.7 1.5 1.1 2.5 1.1 1.9 0 3.4-1.5 3.4-3.4 0-.8-.3-1.5-.7-2.1-1.3 1.4-3 2.4-4.4 3.7z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st8"
+          d="M139.9 338.4c-.6-1.1-2.2-1.3-3-.4-.6.6-.7 1.4-.2 2 .2.3.5.6.8.9l2.4-2.5c.1 0 .1 0 0 0zM136.3 350.7c1.2.3 2.2-.1 2.8-1.1.3-.5.5-1.1.7-1.6.5-1.6 1.3-3.1 2.3-4.4.7-.9 1.3-1.9 1.5-3.1l-9 9c.4.6.9 1 1.7 1.2z"
+        />
+        <path
+          className="prefix__st5"
+          d="M143.2 334.9c-.8-.8-1.7-1.3-2.9-1.6-.5-.1-.9-.2-1.4-.3h-.7l-1.8.3c-2 .5-3.7 2.4-3.8 4.1 0 .4 0 .7.4.7s.5-.2.6-.6c.4-1.7 1.3-2.9 3-3.2.8-.2 1.7-.2 2.5-.2 1.2.1 2.2.6 3 1.3.5-.1.8-.3 1.1-.5zM143.9 340.4l-.3.3c-.3 1-.8 2-1.4 2.8-1 1.4-1.8 2.8-2.3 4.4-.2.6-.4 1.1-.7 1.6-.6 1-1.6 1.4-2.8 1.1-.6-.1-1-.4-1.3-.8-.3.2-.6.5-.9.7.4.5 1 .9 1.7 1.1 1.5.4 2.9.2 3.8-1.1.5-.6.9-1.4 1.1-2.2.6-1.6 1.3-3 2.3-4.3.4-.6.8-1.2 1.1-1.8.4-.8.6-1.7.7-2.5-.3.3-.7.5-1 .7z"
+        />
+        <path
+          className="prefix__st5"
+          d="M136.9 338c.7-.7 1.9-.7 2.6-.1l.9-.6c-.2-.2-.5-.4-.8-.6-1.2-.6-2.7-.3-3.7.7-.8.9-1.1 2.8-.1 3.7l.1.1c.3-.3.7-.6 1-.9-.1-.1-.1-.2-.2-.2-.4-.7-.3-1.5.2-2.1zM141.2 338.7c.1.3.1.7 0 1.1-.1.6-.3 1.3-.6 1.8-.1.3-.5.5-.8.7-.1 0-.1-.1-.2-.1.1-.4.2-.8.4-1.2.3-.5.4-1 .3-1.5l-2.1 2.1c.4.5.5 1.1.3 1.8-.1.4-.2.7-.4 1.1l5.7-5.6c-.1-.8-.3-1.5-.6-2.2l-2 2zM149 333.7l-1.4-1.4-3.6 3.6c.4.6.7 1.3.8 2l4.2-4.2zM135.4 346c-.4-.4-.5-.9-.3-1.4l-6.5 6.5 1.4 1.4 3.4-3.4c0-.1-.1-.3-.1-.4 0-.2-.1-.4 0-.5.1-.2.4-.4.6-.4.1 0 .3.2.5.4l1.9-1.9c-.3.1-.6 0-.9-.3z"
+        />
+        <path
+          className="prefix__st5"
+          d="M134 347.8c-.2 0-.4.2-.6.4-.1.1 0 .3 0 .5 0 .1 0 .3.1.4l.9-.9c-.1-.1-.3-.4-.4-.4zM143.8 338.9l1-1c-.2-.7-.4-1.4-.8-2l-.8.8c.4.6.6 1.4.6 2.2zM135.4 346c.3.2.6.3.9.3l1.9-1.9c.1-.3.3-.7.4-1.1.2-.7 0-1.3-.3-1.8l-3.1 3.1c-.2.6-.2 1.1.2 1.4zM140 341.1c-.2.4-.3.8-.4 1.2.1 0 .1.1.2.1.3-.2.6-.4.8-.7.3-.6.5-1.2.6-1.8.1-.4 0-.7 0-1.1l-.9.9c.1.4 0 .9-.3 1.4z"
+        />
+        <path
+          className="prefix__st2"
+          d="M143.2 336.7l.8-.8c-.2-.3-.4-.6-.6-.8l-.8.8c.2.2.4.5.6.8z"
+        />
+      </g>
+      <text
+        transform="translate(226.1 454.452)"
+        className="prefix__st0"
+        fontFamily="RobotoCondensed-Bold"
+        fontSize={12}
+      >
+        {"Upvote/Downvote"}
+      </text>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M15.2 529.5l-.4 1.8-1.1.9c-.2.4-.4.6-.8.8-.3.2-.7.3-1.1.3-.9 0-1.5-.4-1.9-1.1l-1.1-.9-.4-1.8.6-.2c.1.2.1.3.2.4.3.6.6 1 .9 1.3.3.2.9.3 1.6.3.9 0 1.4-.1 1.8-.3.3-.2.6-.6.9-1.3 0-.1.1-.2.2-.4l.6.2zM16.3 516.4c-1.2-1-2.7-1.5-4.5-1.5-1.9 0-3.4.5-4.5 1.5-1.2 1-1.7 2.3-1.7 3.9 0 1.4.2 2.4.6 3 .5.8.7 1.4.8 1.7l.2 1.5 2.5 1.2.4.9c.2.1.5.1.8.2.3 0 .7.1 1 .1.8 0 1.4-.1 1.8-.2l.4-.9 2.5-1.2.2-1.5c0-.3.1-.5.2-.6.8-1.3 1.1-2.7 1.1-4-.1-1.8-.7-3.1-1.8-4.1zm-7.1 8.5c-1 0-1.5-.6-1.5-1.7 0-.5.1-1 .4-1.2.3-.3.6-.4 1.2-.4 1 0 1.5.5 1.5 1.5-.1 1.2-.6 1.8-1.6 1.8zm3.1 2.4c-.1 0-.3 0-.4-.1-.2.1-.3.1-.4.1-.2 0-.4 0-.5-.1s-.2-.2-.2-.4.1-.4.4-.8c.2-.3.4-.6.7-.9.2.3.4.7.7.9.3.3.4.6.4.7-.1.4-.3.6-.7.6zm2.2-2.4c-1 0-1.5-.6-1.5-1.7s.5-1.6 1.5-1.6c.5 0 .9.1 1.1.4.2.3.4.6.4 1.1 0 1.2-.5 1.8-1.5 1.8zM5.5 526.5h-3l4 1.6zM6 529.7l-3.5 1.6 4-.5zM7 531.9l-1.8 1.8 2.5-.9zM18.1 526.5h3.1l-4 1.6zM17.6 529.7l3.6 1.6-4-.5zM16.6 531.9l1.8 1.8-2.4-.9z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M228.3 395.8c-.5 0-.9.1-1.2.5-.8.8-.5 2.4.7 3.6 1.2 1.2 2.8 1.5 3.6.7.1-.1.2-.2.3-.4-.2 3.1-1.7 5.8-3.6 7.8h2.7c1.5-1.5 2.5-4.5 3.1-6.5 1.3.1 3.2.8 4.2 2l-3.9 4.5h11.2l-1.2-2.1H239c4.2-3.1 1.6-6.6-1.9-8.1-.5-.2-1-.4-1.5-.5-1.6-.4-3.3-.4-4.4.3-.2-.3-.4-.5-.6-.7-.6-.7-1.5-1.1-2.3-1.1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st6"
+          d="M130.8-1.5c4.4 0 8 3.6 8 8s-3.6 8-8 8-8-3.6-8-8 3.6-8 8-8m0-1c-5 0-9 4-9 9s4 9 9 9 9-4 9-9-4-9-9-9z"
+        />
+      </g>
+      <path
+        className="prefix__st9"
+        d="M130.8-2.1c2.3 0 4.2 3.8 4.2 8.5s-1.9 8.5-4.2 8.5"
+      />
+      <text
+        transform="translate(233.639 230.09)"
+        className="prefix__st0"
+        fontFamily="RobotoCondensed-Bold"
+        fontSize={8}
+      >
+        {"R"}
+      </text>
+      <g>
+        <circle className="prefix__st5" cx={233.7} cy={7.1} r={9.3} />
+        <path
+          className="prefix__st2"
+          d="M233.7 1.7c3 0 5.4 2.4 5.4 5.4s-2.4 5.4-5.4 5.4-5.4-2.4-5.4-5.4 2.4-5.4 5.4-5.4m0-1c-3.6 0-6.4 2.9-6.4 6.4 0 3.6 2.9 6.4 6.4 6.4 3.6 0 6.4-2.9 6.4-6.4 0-3.5-2.8-6.4-6.4-6.4z"
+        />
+        <path
+          className="prefix__st2"
+          d="M233.3 8.3h6.9v-.5c0-4-3-7.3-6.8-7.3h-.1v7.8z"
+        />
+      </g>
+      <path
+        className="prefix__st0"
+        d="M229.6 28.5h-1.8c-.7 0-1.2.6-1.2 1.2v12.4c0 .7.5 1.2 1.2 1.2H238c.4 0 .8-.3.8-.8 0-.4-.3-1-.8-1h-9.3c-.3 0-.6 0-.6-.3s.3-1 .6-1h8.8c.7 0 1.2-.6 1.2-1.2v-9.2c0-.7-.5-1.2-1.2-1.2h-4.2l-3.7-.1"
+      />
+      <g>
+        <path
+          className="prefix__st2"
+          d="M230.9 30.7c.5-.1 1.1-.1 1.9-.1 1 0 1.6.2 2.1.5.4.3.6.8.6 1.3 0 .9-.6 1.5-1.2 1.7.5.2.8.7.9 1.3.2.8.4 1.6.5 1.9h-1.3c-.1-.2-.3-.8-.5-1.6-.2-.9-.5-1.2-1.2-1.2h-.6v2.8h-1.2v-6.6zm1.3 3h.7c.8 0 1.3-.4 1.3-1.1 0-.7-.5-1.1-1.3-1.1-.4 0-.6 0-.8.1v2.1z"
+        />
+      </g>
+      <path
+        className="prefix__st0"
+        d="M240.8 480.8l3.7-2.8-4.6-.6 1.3-4.3-4.1 2.2-1.6-4.2-2 4.1-3.8-2.5.8 4.4-4.7.1 3.4 3.1-3.7 2.8 4.6.6-1.3 4.3 4.1-2.1 1.6 4.2 2-4.1 3.8 2.5-.8-4.4 4.7-.1-3.4-3.2zm-5.8 4.4c-2.2 0-4.6-2.4-4.6-4.6s2.4-4.6 4.6-4.6c2.2 0 4.6 2.4 4.6 4.6s-2.4 4.6-4.6 4.6z"
+      />
+      <g>
+        <path
+          className="prefix__st5"
+          d="M245.4 233.9c-1.5 1.4-2.8 3.1-4.6 4.1-1.1.6-2.7.3-4 .5-.8-3 .9-6.5 3.6-7.8.3-.2 1-.2 1.1 0 .2.4.4 1 .2 1.3-.3.6-.8 1.1-1.6 2.2 2.2-.9 2.5-1.7 3-3.8.5-1.8 0-4.7.7-4.9.8 0 1.7-.3 1.6 1.3-.2 2.6 0 4.3 0 7.1zM226.7 233.9c1.5 1.4 2.8 3.1 4.6 4.1 1.1.6 2.7.3 4 .5.8-3-.9-6.5-3.6-7.8-.3-.2-1-.2-1.1 0-.2.4.9 1.4 1.1 1.8.3.6 0 1.1.3 1.7-3-1.2-2.5-1.7-3-3.8-.5-1.8 0-4.7-.7-4.9-.8 0-1.7-.3-1.6 1.3.2 2.6 0 4.3 0 7.1zM229.1 244.4c-.7-1.1-.6-2 .9-2h11.2c1.5 0 1.6.8.9 2h-13zM235.9 241.4c-1.9 0-3.8.1-5.8 0-.5 0-.9-.5-1.3-.8.4-.4.9-1 1.3-1.1 3.8-.1 7.5-.1 11.3 0 .4 0 .8.6 1.2.9-.4.3-.8.9-1.2.9-1.9.1-3.7.1-5.5.1z"
+        />
+      </g>
+      <path
+        className="prefix__st5"
+        d="M142.4 425c-1.1.9-2 1.5-3.8 0s-3-3.7-4.5-3.8c-1.5-.1-5.2.8-5.4 0-.2-.8.6-1.5 1.5-1.5s3.1.7 4.6-.8c1.6-1.4 2.8-2.1 3-3.8.3-1.7-.6-4.9 0-5.5.6-.6 1.3-.3 1.5.8.2 1 1 5.3 0 7 0 0-.2 3.1.8 3.8 0 0 1.4-2.4 3-3 1.6-.6 4.7-.9 4.5 0-.2.9-.1 1.4-1.5 1.5s-3.1.4-4.5 3c0 0 1.6-.9 3-.8 1.4.1 3 2.1 3 3s-.6 1.9-1.5 1.5c-.8-.2-.6-3.9-3.7-1.4z"
+      />
+      <ellipse
+        transform="rotate(-21.1 134.426 416.101)"
+        className="prefix__st5"
+        cx={134.4}
+        cy={416.1}
+        rx={1.9}
+        ry={2.5}
+      />
+      <g id="prefix__Ea1JOO_tif">
+        <path
+          className="prefix__st5"
+          d="M144.5-98.5c.5.1 1 .2 1.6.3.1.5.3 1.1.4 1.7h.3c.1-.5.1-1 .2-1.7.5.4 1.1.8 1.6 1.2-1.5 1.4-1.9 3-1.2 5-.3-.2-.6-.3-.9-.4v1h-1.4c0-.1-.1-.1-.1-.1-.3-.9 1.2-1.5 1.3-2.3.1-1.2-.2-2.2-1.1-2.9-.3-.3-.6-.5-.5-1.1.1-.2-.1-.5-.2-.7zM154.4-104.9c-1.1.2-3.6.9-5 1.1.7-.7 2.4-2.1 3.3-2.1.5 0 1.3.6 1.8.8 0 0 0 .1-.1.2z"
+        />
+        <path
+          className="prefix__st8"
+          d="M157.5-101.8c.1-.4.2-.8.3-1.1 0 0-.1 0-.1-.1-.4.7-.8 1.5-1.2 2.3.5-.2 1.1-.5 1.7-.8-.3-.1-.5-.2-.7-.3zM150-101c-.4 0-.8 1.5-1.2 2.1 1-.1 2.3.1 3.3 0-.6-.7-.7-2.2-2.1-2.1z"
+        />
+        <path
+          className="prefix__st5"
+          d="M162.1-96.8c-.6-1.7-.9-3.5-2.5-4.3-1.1 1.3-1.2 1.4-2.2 1.2.2-.1.4-.1.5-.2.7-.3 1.2-.7 1.3-1.6.1-.8 0-1.6-.6-2.2-.5-.5-.9-.6-1.5-.2-.4.3-.8.5-1.1.8 0 .1-.1.1-.2.1-.1.1-.2.1-.3.2 0-.1-.1-.1-.1-.2l.1-.1c-.1-.1-.2-.3-.3-.4-.1 0-.3.1-.4 0-1.1-.2-2.1 0-3.2.3-1.3.3-2.5.7-3.8.8-.2 0-.3.1-.5.1v.1c.1.3 0 .7-.2 1 .1 0 .2 0 .3-.1v.2c-1.4.5-2.8.9-4.3 1.4.2.7.4 1.3.6 1.8.2-.2.4-.3.5-.4-.1-.4.1-.3.3-.3.7.1 1.4.3 2.1.4 1.4.2 2.1 1.2 2.5 2.7.3 1.2-.2 2.2-.9 3 0 .1-.1.1-.1.2-.3 1.7-1.2 2.2-2.7 2 .7.6 1.4.8 2.1.5.6-.2 1.2-.5 1.9-.6 1.2-.3 2.4-.7 3.6-.2.8.4 1.5 1.2 2.3 1.7.9.6 1.7 1.2 2.6 1.7.2-.5.3-1 .5-1.5.2-.7.6-1.4.7-2.1 0-.2.2-.3.3-.2.2-.3.3-.7.5-1.1.1.5.2.8.3 1.3.2-.4.3-.7.4-1 .3-1.2.6-2.4.7-3.6.1-.7-.2-1.5-.4-2.2.4.3.8.6 1.2 1zm-13.3-2c.4-.6.8-2.1 1.2-2.1 1.3-.1 1.5 1.4 2 2.1-.9 0-2.2-.1-3.2 0zm8.2-4.6s.8.4.8.5c-.1.4-.2.8-.3 1.1.2.1.7.5 1 .6-.6.3-2.5 1.1-3 1.3.3-.8 1.1-2.7 1.5-3.5zM146.1-102.5c-.1-.3-.4-.5-.7-.7-.1-.1-.3-.1-.4-.2H144.4c-.1 0-.2.1-.2.1l-.1.1c-.1 0-.1.1-.2.2s-.2.2-.2.3c0 0 0 .1-.1.1-.1.1-.1.2-.2.3 0 0 0 .1-.1.1-.1.2-.1.3-.2.5h.2c.1 0 .1 0 .2.1h.5v-.1-.1-.1-.1-.1-.1-.1-.3c.3.2.4.4.5.4h1c.1 0 .1 0 .1-.1.6.1.6 0 .5-.2z"
+        />
+        <g>
+          <path d="M146.2-98.3l.2.1c.2.1.4.1.5.3.1.2 0 .5-.2 1.2l-.2.5-.3-2.1z" />
+          <path
+            className="prefix__st2"
+            d="M146.3-98.1c.5.1.5.3.1 1.3 0-.5 0-.9-.1-1.3m-.3-.4v.4l.1.6.1.7.1 1 .4-1c.2-.7.4-1 .2-1.3-.1-.2-.3-.3-.5-.4h-.4z"
+          />
+        </g>
+      </g>
+      <g>
+        <path
+          className="prefix__st6"
+          d="M228.4-103.4c.1-.2.2-.3.3-.5.1-.1.2-.3.4-.4.3-.2.6-.4 1.1-.5-2.2-1.1-3.5-1.5-2.9-.6.2.4.7 1.2 1.1 2z"
+        />
+        <path
+          className="prefix__st5"
+          d="M239.7-102.2c.1.1 0 0 0 0zM229.3-101.7c2.9-1.2 6.3-1.4 9.4-1-.5-.3-1.3-.8-2.6-1.5-4-2.4-6.8-3.6-6-2.3.5.8 1.2 1.9 1.3 3.1 0 0-1.7.6-2.1 1.7z"
+        />
+        <path
+          className="prefix__st5"
+          d="M243.9-96.9c-.5-1.2-1.6-1.5-2.5-2.5-.6-.7-1.2-1.3-1.8-2-.2-.2-.3-.5-.5-.7h.4v-.1c-.2-.2-.3-.4-.5-.6-.9-.9-1.9-1.5-3-2-.7-.3-1.5-.6-2.3-.6l-.6.3c-.3.2-.5.3-.8.5-.4.2-.7.4-1 .6-.1.1-.2.1-.3.2.1.1 0 .3-.1.4-.4.5-.9 1-1.3 1.5-.5.6-.7 1.2-.6 2.1.1.7-.1 1.3-.4 1.8-.3.5-.7.9-1.2 1.3l-1.5 1.2c-.2.1-.2.2 0 .3.4.3.8.6 1.2.7h.2c.1 0 .2-.1.3.1h.1c.3 0 .7 0 1-.1.7-.2 1.5-.4 2.2-.7.7-.2 1.4-.4 2.1-.4.4 0 .4 0 .5.4.2.6 1 1.1.9 1.7v.1c.4.9.5 1.4.3 2 0 .8-.3 1.6-.9 2.2-.1.1-.1.3-.2.4-.1.2-.2.3-.3.5h.1c1.1-.5 2.3-2.4 3.1-3.3.3-.3.8.1.6.5-.4.7-1.3 2.5-1.8 3 .8.1 1.5.1 2.3.1h1.3c.3-.1.7-.2 1-.3.5-.5 1.3-2.5 1.6-3 .2-.4.8-.1.6.4-.2.4-.5 1.9-.7 2.2.6-.2 1.3-.5 1.9-.9.3-.6.7-1.1.9-1.7 0-.4 0-.4.1-1.1v-.1c-.1-.6-1.7-2.2-1.8-2.8 0-.2-.1-.4-.1-.6l1.4.9c.1.2 1 .6 1.1.7 0 .1.1.1.1.1 0-.1.1-.1.1-.2 0-.8-.9-1.7-1.2-2.5z"
+          id="prefix__QFqb7d_tif_1_"
+        />
+        <path className="prefix__st2" d="M230.5-99.7l-.4-.4 1-1h1v1l-1 .5z" />
+        <g>
+          <path
+            className="prefix__st2"
+            d="M233.6-89.7c.2-.3.7-1.3.7-1.8v-.2c.1-.4 0-.9-.3-1.6l-.1-.2v-.2h.5l-.5-.1c0-.1-.2-.4-.4-.6-.2-.2-.4-.5-.5-.8v-.1c-.6 0-1.3.2-1.9.4-.8.2-1.5.5-2.2.7-.3.1-.6.1-.8.1h-.3c-.2 0-.3 0-.4-.1h-.4c-.1 0-.1 0-.1-.1l-.5-.1.3-.8.1-.1c.1-.1 1.5-1.4 2.3-2 .7-.5 3-1.9 4.8-1.9.3 0 .5 0 .7.1.9.2 1.9 1.1 2.5 2.3.5.9 1.1 2.7.2 5l-.1.3h-.2c-1.3 1.5-2.1 2.3-2.8 2.4l-1 .1.4-.7z"
+          />
+          <path d="M233.8-98.5c.2 0 .4 0 .6.1 1.5.4 3.6 3.3 2.3 6.6-.1 0-.1 0-.2.1-.8.9-2 2.2-2.5 2.3 0 0 .7-1.2.7-2.1.2-.5.1-1.1-.3-2v-.1c.1-.6-.7-1.1-.9-1.7-.1-.4-.1-.4-.4-.4h-.1c-.7 0-1.4.2-2.1.4-.7.2-1.5.5-2.2.7-.3.1-.7.1-1 .1h-.1c0-.1-.1-.1-.1-.1h-.4-.1l.1-.2s1.5-1.3 2.3-1.9c.6-.5 2.8-1.8 4.4-1.8m0-1c-2 0-4.4 1.5-5.1 2-.8.6-2.3 1.9-2.3 2l-.2.2-.1.3-.1.2-.3 1 .9.3c.1 0 .1.1.2.1h.4c.1.1.3.1.4.1h.4c.3 0 .6 0 .9-.1.8-.2 1.5-.4 2.3-.7.5-.2 1-.3 1.5-.4.1.3.3.5.5.7.1.1.2.2.2.3l-.1.3.1.3c.4.8.3 1.1.3 1.2v.2c0 .4-.4 1.2-.6 1.6l-1 1.8 2-.3c.8-.1 1.6-.9 3-2.4l.3-.1.2-.5c.7-1.8.6-3.7-.2-5.4-.7-1.3-1.7-2.3-2.8-2.6-.2-.1-.5-.1-.8-.1z" />
+        </g>
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M317.7-105s4.4-3.5 9.7-.8c0 0-1.4 0-1.9.3 0 0 .5-.1.7 0 0 0-.5.3-1.2.2 0 0 0 .1.6.2 0 0-.4.4-1.5.4 0 0 .3.2.7.2 0 0-.3.4-1.4.4 0 0 .1.1.3.1 0 0-.5.2-.9.1 0 0 .2.2.3.2 0 0-1.2.2-1.5.6-.4.3-3.9-1.9-3.9-1.9zM312.3-104.3s2.5-3.7 6.7-3.4c0 0-.9.4-1.2.7 0 0 .3-.2.5-.2 0 0-.2.3-.7.5 0 0 0 .1.4 0 0 0-.2.3-.9.7 0 0 .2 0 .5-.1 0 0-.1.3-.8.6h.2s-.3.3-.6.3c0 0 .2.1.3 0 0 0-.7.4-.8.8s-3.6.1-3.6.1z"
+        />
+        <path
+          className="prefix__st0"
+          d="M310.7-99.9l-.3-.1c-.3-2.8 1.3-5.6 5.5-5.6.6 0 1.2.1 1.7.1-1 .6-1.9 1.5-2.3 3.1-.8 3-2.4 3-3.7 3.2-.1-.3-.5-.5-.9-.7zM320.7-97.9l.3-.2c-.1-.3-.2-.5-.2-.5l.3-.2c-.2-.4-.4-.6-.5-.6l-1.2-1.1.8.4.2-.3h.1c.1 0 .2.1.3.1-.4-.3-.6-.5-.6-.5l-.8-.7.9.3c-1-.6-2.5-1.2-3.2-1.4l.1-.2c-.3.4-.5.9-.7 1.4-.1.4-.2.7-.3 1h.1c.6 0 1.7.5 1.7 1.1 0 .6-.8 1.7-1.4 1.7-.5 0-1.3-.6-1.4-1.1-.6.6-1.3.5-1.8.5.5.7.1 1.5.1 1.6l.3.3-.6.1.1.2s2.7 1.6 4.7 1.4c1.9-.2 2.5-2.2 2.6-2.3l.1-.5.2.4c.1.2.3.4.4.6-.2-.8-.6-1.5-.6-1.5z"
+        />
+        <path
+          className="prefix__st8"
+          d="M310.8-98c-.2-.5-.6-1-1.1-1.2.5.2.9.7 1.1 1.2z"
+        />
+        <path
+          className="prefix__st0"
+          d="M311.3-96.3s0-.9-.4-1.7c-.2-.5-.6-1-1.1-1.2 0 0-1.7 2.3-.3 4.6.2-.1.3-.2.5-.2.1-.7.5-1.4 1.3-1.5z"
+        />
+        <path
+          className="prefix__st0"
+          d="M309.7-94.2s0-.3.2-.7c-.2.1-.3.1-.5.2.1.2.2.3.3.5z"
+        />
+        <g>
+          <path
+            className="prefix__st0"
+            d="M326.8-93.4s.2.1.5.5c0 0-.3-2.5-1.8-3.6 0 0 .8 0 1.2.5 0 0-.2-1.4-1.1-1.9 0 0 .7 0 .9.2 0 0-.4-1.6-1.7-2.1 0 0 .6 0 .7.2 0 0-.2-1.4-2.2-2.2 0 0 .6 0 .9.2l-.6-.4s-1.9-2.5-5.6-3.1c-.5.3-.9.6-1.3 1.1.7.3 4.6 1.8 5.4 2.7l.5.6-1.1-.3c.2.1.3.3.5.5l.5.5-.8-.1.2.2.3.4h-.5c.2.3.5.7.7 1.3l.3.6-.6-.3s-.1 0-.2-.1c0 .2.1.4.1.6v.5l-.2-.1c.2.6.5 1.3.6 1.8l.1.7-.5-.5s-.6-.5-1-1c-.4.8-1.4 2.4-3.5 2.6h-.6c-2.1 0-4.4-1.1-5.3-1.6-.3-.1-.7-.2-1-.2-.2.4-.3 1-.3 1l-.2 1.7c.2 1.2 1.3 3 1.3 3 .3.7 1.3 1.3 1.3 1.3-.4-.5-.4-1.4-.4-1.4 1.5 1.6 3.2 1.6 3.2 1.6-.5-.8-.1-1.7-.1-1.7.5 1.2 1.9 1.6 1.9 1.6.7-1 .4-1.7.4-1.7 1.1 1.7 4.1 1.8 4.1 1.8-.6-1-.3-2-.3-2 .5 1.4 2.6 1.8 2.6 1.8-.4-.6-.3-1.4-.3-1.4.5.8 1.6.8 1.6.8-.6-.6-.8-2.2-.8-2.2 1.5 1.3 1.4 3.1 1.4 3.1.9-.4 1.1-1 1.2-1.3v-.3c.3-1 .3-2.3-.4-3.9z"
+          />
+        </g>
+      </g>
+      <path
+        className="prefix__st0"
+        d="M404.3-89.7s.3-1.2 0-2.4c0 0 .2.7.9 1.1 0 0-1-1.6-1.1-4.4 0 0 .3.9.7 1.9 0 0 .2-1-.6-3.6 0 0 .7 1.7.8 2.4 0 0-.1-6.4-2.7-8 0 0 .7-.1 2.5 2.4 0 0-1.4-3.3-4.2-4.2l2.4.7s-1.6-1.4-5.8-1.4c0 0 1.8-.2 2.2 0 0 0-5.2-1.4-9 2 0 0-1.2 0-1.6.4 0 0-2.2-.2-3.1 1.4-1.2 2 .3 3.9 1.1 4.7 0 0-.2-1.6.2-2.2 0 0 1.1.7 3.3.6 6-.4 4.3 2.2 2.4 4 0 0-1 .9-3 3 0 0 3-.9 3.4-1.5 0 0 .8 1.1 1 1.9 0 0 .7-.8.9-1.6 0 0 .1.9.2 1.1 0 0 .4-.3.5-.6 0 0 .2.7.4.8 0 0 .3-.4.3-.8 0 0 .2 1.1 1 1.8 0 0 .3-.5.3-1 0 0 .1.3.4.5 0 0 .4-1 .4-2.3 0 0 .3 2.3 1.1 3.1 0 0 .4-.7.3-1.4 0 0 1.3 1.1 2.3 1.7 0 0-.4-.7-.4-1.3.1.2.1.3 2.5 1.2z"
+      />
+      <g>
+        <path
+          className="prefix__st2"
+          d="M393.1-102.8c-.1.2-.2.3-.2.5 0 .6.5.9 1.2.8.6 0 1.6-.8 1.7-1.5-1.5-.6-2.1-.2-2.7.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st2"
+          d="M84.1-90.5h.7c-.3-.1-.5-.2-.7-.2v.2z"
+        />
+        <path
+          className="prefix__st0"
+          d="M81.4-103.3s-.6-1.7-2.4-2.2l.6 2.8 1.8-.6z"
+        />
+        <path
+          d="M80.9-92.7s.4 2.6-.8 4.8"
+          fill="none"
+          stroke="#000"
+          strokeWidth={0.649}
+          strokeMiterlimit={10}
+        />
+        <path
+          className="prefix__st11"
+          d="M82-92s1.2 1.7.7 3.5M78.7-91.4s.4 1.4-.8 2.8"
+        />
+        <g>
+          <path
+            className="prefix__st8"
+            d="M81.2-96.6c-.6.6-1.4.9-1.9.9-.3 0-.5-.1-.7-.3-.5-.5-.1-1.7.9-2.6.6-.6 1.4-.9 1.9-.9.3 0 .5.1.7.3.5.6.1 1.7-.9 2.6z"
+          />
+          <path
+            className="prefix__st8"
+            d="M81.4-98.9c-.5 0-1.1.3-1.6.8-.9.8-1.1 1.6-.9 1.9.1.1.2.1.3.1.5 0 1.1-.3 1.6-.8.4-.4.7-.8.9-1.2.1-.3.1-.5 0-.6-.1-.2-.2-.2-.3-.2z"
+          />
+          <path
+            className="prefix__st0"
+            d="M87.1-94.3c.1 0 .1 0 0 0H88.5c-.2-.4-.5-.7-.8-.9.2-.1.4-.1.6-.1h1.4c.2 0 .5.1.8.1 0-.1-.1-.3-.1-.5 0-.1 0-.2-.1-.3 0-.1 0-.2-.1-.3 0-.2-.1-.3-.1-.5v-.1c-.2-.9-.6-1.9-1-2.9-.1-.3-.2-.5-.3-.8-.3-.6-.6-1.1-.9-1.6h-.7s-1.3-2.8-4.7-4.1v3.9s-4.8 1.8-4.9 3.2c-.1 1.4-.2 3.3-.5 3.6-.3.3-1.6 2-1.2 2.3s2.4 2.7 3.6 2.7c1.1 0 3.8-.3 4.4 0 0 0 .1 0 .2.1l.1-.6H85.8c.2 0 .4 0 .5-.1h.3c.2 0 .4-.1.6-.1.1 0 .2 0 .3-.1.3-.1.6-.2.8-.3-.5-.2-1.2-.7-1.9-1.5H87.9c-.5-.2-.9-.7-1.2-1.2 0 0 .2.1.4.1z"
+          />
+          <path
+            className="prefix__st2"
+            d="M81.7-98.2c-.1.4-.5.8-.9 1.2-.5.5-1.2.8-1.6.8-.1 0-.3 0-.3-.1-.2-.2 0-1.1.9-1.9.5-.5 1.2-.8 1.6-.8.1 0 .3 0 .3.1.1.2.1.4 0 .7z"
+          />
+        </g>
+        <path
+          className="prefix__st0"
+          d="M94.1-95.2v-.2c-.1-.9-.4-1.7-1-2.4.7.3 1.1.7 1.1.7-.7-2.1-2.4-2.1-2.5-2.1-.7-.5-1.4-.9-2-1.3.9 1.9 1.3 4 1.5 5l.2.7-.7-.1c-.5-.1-.9-.1-1.3-.1H89c.1.1.1.2.2.3l.3.6-.7.1s-.6.1-1.2.1c.1.1.2.1.3.2l2.2.8-2.4.1h-.1c.3.2.5.3.7.4l1.1.5-1.1.4c-1.2.5-2.4.6-3.2.6 1 1.5 4.2 2.8 4.2 2.8-.2-1.3 1.3-2.4 1.3-2.4.5.1.5 2.4.5 2.4.9-1 1.9-2.3 2.4-4.1.5.5.8 1.2.8 1.2.6-.8.2-2.7-.2-4.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st12"
+          d="M14.7 165.6l-3.9-3M8.9 155.5l-.3-.3c.1.2.3.3.3.3z"
+        />
+        <path
+          className="prefix__st1"
+          d="M15.9 162.5l-7.8-12h3.8l-4.8-1.7-.3-.5 4.2-.8-6.5-1H.1v7.1l.8 3.7s.1-2.7 0-3c0-.3 3 4 3 4-.4-1.1-.8-3.3-.9-4.3l12.9 8.5zm-9.2-8.2h.2c0 .1.1.2.1.2-.1 0-.2-.1-.3-.2z"
+        />
+        <path
+          className="prefix__st8"
+          d="M4.9 153.5c.1.1 1.9.9 2 1 0 0-.8-2.1-1-2.3-1.5-1.5.4-.8 0-2.7-.4-2-3.2-.5-5-1 .3 1.1-.8 1.9 1 4 1.1 1.3 2.3.3 3 1z"
+        />
+        <path
+          className="prefix__st3"
+          d="M14.7 165.8c-1.6 0-3.1-.6-3.5-1.3-.2-.3-1.8-.7-2.6-.7h-.2c-.4 0-.6-.2-.7-.6-.1-.4.1-.9.7-1.1.3-.1.7-.2 1.3-.2.8 0 1.6.1 1.9.2h.5v-.3c-.1-.3-.5-1.1-1-1.9-1.8-3.3-2.1-4.1-1.8-4.5.1-.2.3-.3.5-.3.7 0 1.9 1.1 2.5 2.1.4.6.7 1.1 1 1.3-.2-.8-.7-2.3-.9-3-.1-.4-.3-.7-.3-.9-.1-.4-.1-.8.2-1.1.2-.3.6-.5 1-.5.6 0 .9.8 1.5 3.5 0 .2.1.4.1.6 0-.4.1-.8.1-1.3 0-1.2.4-1.8 1.1-1.8.2 0 .4.1.5.2.6.7.2 3.3.2 3.4v.6c.5-1.1 1.6-2.1 2.3-2.1.3 0 .5.1.6.4.1.4-.1 1.1-1.6 3.6-.1.1-.1.2-.2.3v1.3c0 .8 0 1.7-.1 2.3-.6 1.5-2.8 1.8-3.1 1.8z"
+        />
+        <path
+          className="prefix__st2"
+          d="M13 153.5c.6 0 1.4 5 1.7 5 .3 0 .4-1.9.4-2.5 0-.6.1-1.5.7-1.5s.4 2.7.3 3.1c0 .3 0 1.3.3 1.3.1 0 .2-.1.4-.4.5-1 1.5-1.9 2-1.9.1 0 .2 0 .2.1.2.5-1.6 3.3-1.8 3.6s0 2.7-.2 3.8c-.2 1.1-2.4 1.4-2.4 1.4-1.5 0-2.8-.6-3.1-1.1-.3-.5-2.2-1-3-1h-.2-.1c-.4 0-.6-.7.1-1 .3-.1.7-.2 1.1-.2.7 0 1.5.1 1.8.2.1 0 .3.1.4.1.4 0 .7-.2.5-.8-.3-.8-3.2-5.6-2.9-6 .1-.1.1-.1.2-.1.5 0 1.6.9 2.1 1.9.6 1 1.3 1.7 1.6 1.7.1 0 .1 0 .1-.1.2-.3-1.1-3.9-1.3-4.5 0-.7.4-1.1 1.1-1.1m0-.8c-.6 0-1 .2-1.3.6-.3.4-.4.9-.2 1.4 0 .2.2.5.3.9.1.2.2.6.3 1-.6-.9-1.7-1.9-2.5-1.9-.3 0-.6.2-.8.4-.4.6-.2 1.3 1.8 4.9.3.6.7 1.2.9 1.6-.4-.1-1.2-.2-1.9-.2-.6 0-1.1.1-1.5.2-.8.3-1 1-.9 1.5.1.5.6.9 1.1.9h.2c.7 0 2.1.4 2.4.6.5.9 2.1 1.5 3.8 1.5.5-.1 2.8-.4 3.1-2 .1-.6.1-1.6.1-2.4v-1.2c0-.1.1-.1.1-.2 1.6-2.7 1.8-3.4 1.7-3.9-.1-.4-.5-.6-.9-.6-.6 0-1.3.5-1.9 1.2.1-.9.1-2.4-.4-3-.2-.2-.4-.3-.7-.4-.5 0-1.1.2-1.4 1.2-.4-1.4-.7-2.1-1.4-2.1zM.9 147.5l.9 6.6.7-3.7s3.4 4 3.3 3.8c-.1-.2-2-4.4-2-4.4l4 .4-4.2-1.9 4.1-.8H.9z"
+        />
+      </g>
+      <path
+        transform="rotate(-45.001 233.653 66.335)"
+        className="prefix__st5"
+        d="M226.5 59.2h14.3v14.3h-14.3z"
+      />
+      <g>
+        <path
+          className="prefix__st2"
+          d="M236.1 67.2c0 .8-.2 1.4-.5 1.8-.4.4-.9.6-1.7.6-.7 0-1.3-.2-1.8-.7-.4-.5-.7-1.1-.7-1.9v-2.1c0-.8.2-1.5.6-1.9.4-.5 1-.7 1.7-.7.8 0 1.3.2 1.7.6s.6 1 .6 1.8h-1.3c0-.5 0-.8-.2-1s-.4-.3-.8-.3c-.3 0-.6.1-.7.4-.2.2-.2.6-.2 1.1V67c0 .5.1.9.3 1.1.2.2.4.4.8.4.3 0 .6-.1.7-.3.1-.2.2-.5.2-1h1.3z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st5"
+          d="M233.7 92.8l-9.3 16.1h18.5l-9.2-16.1zm1.2 11.6h-2.5l-.5 1.5h-1.4l2.5-7.1h1.5l2.4 7.1h-1.4l-.6-1.5z"
+        />
+        <path className="prefix__st5" d="M233.7 100.5l-.9 2.8h1.8l-.9-2.8z" />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M6.6 225.1c-.6 3.2-5.5 8.3-5.5 12.1 0 4 2 5.8 5.4 5.8h.1c1.7 0 3.1-.5 4-1.4.9-1 1.4-2.4 1.4-4.4.1-3.7-4.7-8.9-5.4-12.1zm2.8 13.1c0 .1-.1.2-.1.3l-.1.8-1.4.7-.2.5c-.2.1-.6.1-1 .1H6c-.2 0-.3-.1-.4-.1l-.1-.5-1.3-.6-.2-.8c0-.2-.2-.5-.4-.9-.2-.3-.3-.9-.3-1.6 0-.9.3-1.5.9-2.1.6-.5 1.4-.8 2.4-.8s1.8.3 2.4.8c.6.5.9 1.2.9 2.1.1.7-.1 1.4-.5 2.1z"
+        />
+        <path
+          className="prefix__st0"
+          d="M8 237c-.5 0-.8.3-.8.9 0 .6.3.9.8.9s.8-.3.8-1c0-.3-.1-.5-.2-.6-.1-.1-.3-.2-.6-.2zM5.3 237c-.3 0-.5.1-.6.2-.1.1-.2.4-.2.6 0 .6.3.9.8.9s.8-.3.8-1c-.1-.4-.3-.7-.8-.7zM6.7 238.8c-.1.2-.2.4-.3.5-.1.2-.2.3-.2.4 0 .1 0 .2.1.2s.1.1.3.1c.1 0 .1 0 .2-.1.1 0 .2.1.2.1.2 0 .3-.1.3-.3 0-.1-.1-.2-.2-.4-.2-.1-.3-.3-.4-.5z"
+        />
+      </g>
+      <path
+        className="prefix__st0"
+        d="M242.8 546.5v7.5h-9.2l-2.5 2.1h6.9l3.6 3.2v-3.2h2.9v-9.6z"
+      />
+      <g>
+        <path
+          className="prefix__st0"
+          d="M227.6 556.5v-4.1h-2.9v-11.2H241v11.2h-8.8l-4.6 4.1zm-1.4-5.6h2.9v2.3l2.6-2.3h7.9v-8.2h-13.3v8.2z"
+        />
+      </g>
+      <path
+        className="prefix__st13"
+        d="M7.8 44.7s-4.4.6-5 3.1c-.6 2.5 4.5 4.2 2.3 8.9M17.9 37.6c-3.5 3.8-7-.2-9.1 1.3s-1 5.8-1 5.8"
+      />
+      <path
+        fill="none"
+        stroke={fillColor}
+        strokeWidth={0.5}
+        strokeMiterlimit={10}
+        d="M5.6 56.4L18 38"
+      />
+      <path
+        className="prefix__st9"
+        d="M122.3 5.8c9.4 5.5 17 .4 17 .4M122.9 35.7h12.9v12.9h-12.9zM135.8 35.7l3-3.7v12.7l-3 3.9M122.9 35.7l3.4-3.7h12.5"
+      />
+      <ellipse className="prefix__st9" cx={130} cy={74.7} rx={8.2} ry={2.2} />
+      <ellipse
+        className="prefix__st9"
+        cx={135.3}
+        cy={131.5}
+        rx={2.2}
+        ry={8.2}
+      />
+      <path
+        className="prefix__st9"
+        d="M121.8 74.7v12.9c0 1.2 3.7 2.2 8.2 2.2s8.2-1 8.2-2.2V74.7M135.3 109.9h-13.5v-3h13.5M135.3 109.9v1.6l3-3.1-3-3v1.4M135.3 123.3l-13.5 8.2 13.5 8.3"
+      />
+      <g>
+        <path
+          className="prefix__st0"
+          d="M258.8 234.9v2.4h-1.2v-6h2c.6 0 1.1.2 1.4.5.3.3.5.8.5 1.3 0 .3-.1.6-.2.8-.1.2-.3.4-.6.5.3.1.5.3.7.5.1.2.2.5.2.9v.4c0 .2 0 .3.1.5s.1.3.2.4v.1h-1.2c-.1-.1-.2-.2-.2-.4v-1c0-.3-.1-.5-.2-.7s-.3-.2-.5-.2h-1zm0-1h.8c.2 0 .4-.1.5-.2.1-.1.2-.4.2-.6 0-.3-.1-.5-.2-.7s-.3-.2-.5-.2h-.8v1.7zM264.1 237.4c-.6 0-1-.2-1.3-.6s-.5-.8-.5-1.4v-.6c0-.6.2-1.1.5-1.5.3-.4.7-.6 1.3-.6.5 0 .9.2 1.2.5s.4.8.4 1.4v.7h-2.2c0 .3.1.5.2.7.1.2.3.3.6.3.2 0 .4 0 .5-.1.1 0 .3-.1.5-.2l.3.8c-.2.1-.4.3-.6.4-.3.1-.6.2-.9.2zm-.1-3.8c-.2 0-.3.1-.4.3-.1.2-.1.4-.1.7h1.1v-.2c0-.3 0-.4-.1-.6-.2-.1-.3-.2-.5-.2zM268.2 236.1c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.6-.3-.5-.2-.8-.4-1-.6-.2-.2-.3-.5-.3-.8 0-.4.1-.7.4-.9.3-.3.7-.4 1.1-.4.5 0 .9.1 1.2.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.1.2-.1.3c0 .1 0 .2.1.3s.3.2.6.3c.5.2.8.4 1 .6s.3.5.3.9-.2.7-.5.9c-.3.2-.7.4-1.2.4s-.9-.2-1.2-.5c-.3-.3-.4-.6-.4-1h1.1c0 .2.1.4.2.5.1.1.3.2.4.2.2 0 .3 0 .4-.1s.1-.3.1-.4zM271.4 231.7v1.1h.6v.9h-.6v2.3c0 .2 0 .3.1.4.1.1.1.1.2.1h.4l.1.9c-.1 0-.2.1-.4.1h-.4c-.4 0-.7-.1-.9-.4-.2-.2-.3-.6-.3-1.1v-2.3h-.5v-.9h.5v-1.1h1.2zM274.8 233.8h-.4c-.1 0-.2 0-.3.1-.1.1-.1.1-.2.3v3.1h-1.2v-4.5h1.1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.5-.2h.4l-.2 1.1zM277.6 237.3c0-.1-.1-.2-.1-.2 0-.1 0-.2-.1-.3-.1.2-.2.3-.4.4-.2.1-.3.2-.6.2-.4 0-.7-.1-.9-.4-.2-.2-.3-.6-.3-1s.1-.8.4-1c.3-.2.7-.4 1.3-.4h.4v-.4c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-1 .3-.3.7-.4 1.2-.4s.8.1 1.1.4c.3.3.4.7.4 1.2v2.4c0 .2.1.4.1.6h-.9zm-.8-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2-.1.1-.1.3-.1.5 0 .1 0 .3.1.4.1-.1.2 0 .3 0zM280.5 231.7h-1.2v-.9h1.2v.9zm0 5.6h-1.2v-4.5h1.2v4.5zM282.4 232.8v.6c.1-.2.3-.4.5-.5.2-.1.4-.2.6-.2.4 0 .7.1.9.4s.3.7.3 1.4v2.8h-1.2v-2.8c0-.3 0-.5-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.3h-1.2v-4.5h1.1zM287.2 237.4c-.6 0-1-.2-1.3-.6s-.5-.8-.5-1.4v-.6c0-.6.2-1.1.5-1.5.3-.4.7-.6 1.3-.6.5 0 .9.2 1.2.5s.4.8.4 1.4v.7h-2.2c0 .3.1.5.2.7.1.2.3.3.6.3.2 0 .4 0 .5-.1.1 0 .3-.1.5-.2l.3.8c-.2.1-.4.3-.6.4-.3.1-.6.2-.9.2zm-.1-3.8c-.2 0-.3.1-.4.3-.1.2-.1.4-.1.7h1.1v-.2c0-.3 0-.4-.1-.6-.2-.1-.3-.2-.5-.2zM289.2 235c0-.7.1-1.3.4-1.7s.6-.6 1.1-.6c.2 0 .3 0 .5.1.1.1.3.2.4.4v-2.4h1.2v6.5h-1l-.1-.5c-.1.2-.3.3-.4.4-.2.1-.3.1-.5.1-.5 0-.8-.2-1.1-.6s-.5-.9-.5-1.7zm1.2.1c0 .4 0 .7.1.9.1.2.2.3.5.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.5.4-.1.3-.1.6-.1 1.1z"
+        />
+      </g>
+      <ellipse
+        className="prefix__st0"
+        cx={236.6}
+        cy={280.7}
+        rx={7.2}
+        ry={7.8}
+      />
+      <path
+        className="prefix__st0"
+        d="M242.3 284.6c0 3.1-2.5 6.9-5.7 6.9-3.1 0-5.7-3.8-5.7-6.9 0-3.1 2.5-4.5 5.7-4.5s5.7 1.4 5.7 4.5z"
+      />
+      <path
+        className="prefix__st2"
+        d="M235.1 281.9c0 .9-.7 1-1.5 1-.9 0-1.5-.1-1.5-1s.7-1.5 1.5-1.5c.8-.1 1.5.6 1.5 1.5zM239 287.4c0 1.3-1 0-2.3 0-1.3 0-2.3 1.3-2.3 0s1-2.3 2.3-2.3c1.2 0 2.3 1 2.3 2.3zM241.1 281.9c0 .9-.7 1-1.5 1-.9 0-1.5-.1-1.5-1s.7-1.5 1.5-1.5c.8-.1 1.5.6 1.5 1.5z"
+      />
+      <ellipse
+        transform="rotate(-73.118 243.409 282.776)"
+        className="prefix__st0"
+        cx={243.4}
+        cy={282.8}
+        rx={1.9}
+        ry={1.1}
+      />
+      <ellipse
+        transform="rotate(-16.883 229.832 282.783)"
+        className="prefix__st0"
+        cx={229.8}
+        cy={282.8}
+        rx={1.1}
+        ry={1.9}
+      />
+      <path
+        className="prefix__st0"
+        d="M146.1 308.3h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 .1-2-.5-2.1zM146.1 381.5h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 .1-2-.5-2.1zM146.1 566.1h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 .1-2-.5-2.1zM241 365h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 0-1.9-.5-2.1zM146.8 449.6h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 .1-1.9-.5-2.1z"
+      />
+      <ellipse className="prefix__st0" cx={139} cy={533.9} rx={7.2} ry={7.8} />
+      <path
+        className="prefix__st0"
+        d="M144.7 537.8c0 3.1-2.5 6.9-5.7 6.9-3.1 0-5.7-3.8-5.7-6.9 0-3.1 2.5-4.5 5.7-4.5 3.1 0 5.7 1.4 5.7 4.5z"
+      />
+      <path
+        className="prefix__st2"
+        d="M137.4 535c0 .9-.7 1-1.5 1-.9 0-1.5-.1-1.5-1s.7-1.5 1.5-1.5c.9 0 1.5.7 1.5 1.5zM141.3 540.6c0 1.3-1 0-2.3 0-1.3 0-2.3 1.3-2.3 0s1-2.3 2.3-2.3c1.3 0 2.3 1 2.3 2.3zM143.4 535c0 .9-.7 1-1.5 1-.9 0-1.5-.1-1.5-1s.7-1.5 1.5-1.5c.9 0 1.5.7 1.5 1.5z"
+      />
+      <ellipse
+        transform="rotate(-73.118 145.74 535.962)"
+        className="prefix__st0"
+        cx={145.7}
+        cy={536}
+        rx={1.9}
+        ry={1.1}
+      />
+      <ellipse
+        transform="rotate(-16.883 132.16 535.972)"
+        className="prefix__st0"
+        cx={132.2}
+        cy={536}
+        rx={1.1}
+        ry={1.9}
+      />
+      <path
+        className="prefix__st15"
+        d="M136.6 525.6l2.4 4.5-3.4 1.7.3 5.8-3.4 4.2"
+      />
+      <path
+        className="prefix__st15"
+        d="M137.4 530.9l1.6 2.1 4-1.7 4.3 1.4M139.8 546.4c.1-.2-.5-3.5-.5-3.5l3.9-2-1.8-3.5 7.2-2.3"
+      />
+      <path
+        className="prefix__st16"
+        d="M139.5 438.5c.3-.3.6-.6 1-.8 1.3-.5 2.8.3 3 1.5.1.5 0 1-.4 1.5-1.2 1.6-2.4 3.1-3.6 4.7l-.1.1-.1-.1c-1.2-1.5-2.4-3.1-3.5-4.6-.9-1.2-.3-2.9 1.3-3.2.9-.2 1.6.1 2.2.7l.2.2zM133.5 442.6c.1-.2.3-.3.5-.4.6-.2 1.4.1 1.5.8 0 .3 0 .5-.2.7-.6.8-1.2 1.5-1.8 2.3-.6-.8-1.2-1.5-1.8-2.3-.5-.6-.1-1.4.6-1.6.5 0 .8.1 1.2.5-.1 0 0 0 0 0zM145.5 442.6c.1-.2.3-.3.5-.4.6-.2 1.4.1 1.5.8 0 .3 0 .5-.2.7-.6.8-1.2 1.5-1.8 2.3-.6-.8-1.2-1.5-1.8-2.3-.5-.6-.1-1.4.6-1.6.5 0 .8.1 1.2.5-.1 0 0 0 0 0z"
+      />
+      <g>
+        <path
+          className="prefix__st2"
+          d="M234.6 367.9c0-.3-.1-.5-.2-.7-.1-.2-.4-.3-.8-.5-.7-.3-1.3-.6-1.7-.9-.4-.3-.6-.8-.6-1.4 0-.6.2-1.1.7-1.4.4-.4 1-.6 1.7-.6s1.2.2 1.7.6.6.9.6 1.6h-1.4c0-.3-.1-.6-.2-.8-.2-.2-.4-.3-.7-.3-.3 0-.5.1-.7.3-.2.2-.2.4-.2.6 0 .2.1.4.3.6.2.2.5.3.9.5.7.2 1.2.5 1.5.9s.5.8.5 1.4c0 .6-.2 1.1-.6 1.5s-1 .5-1.7.5-1.3-.2-1.8-.6c-.5-.4-.7-1-.7-1.7h1.4c0 .4.1.8.3 1 .2.2.5.3.9.3.3 0 .5-.1.7-.2.1-.2.1-.4.1-.7z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st16"
+          d="M232.2 355.4s-1.7.2-2.8.3c-.1 0-.2.1-.2.2s0 .2.1.3c.8.8 2.1 1.9 2.1 1.9s-.3 1.7-.6 2.8c0 .1 0 .2.1.3.1.1.2.1.3 0 1-.6 2.5-1.4 2.5-1.4s1.5.8 2.5 1.4h.3c.1-.1.1-.2.1-.3-.2-1.1-.6-2.8-.6-2.8s1.3-1.1 2.1-1.9c.1-.1.1-.2.1-.3s-.1-.2-.2-.2c-1.1-.1-2.8-.3-2.8-.3s-.7-1.5-1.2-2.6c0-.1-.1-.2-.2-.2s-.2.1-.2.2c-.7 1.1-1.4 2.6-1.4 2.6z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st16"
+          d="M239.3 359.5s-1 .1-1.6.2c-.1 0-.1 0-.1.1v.2c.5.4 1.2 1.1 1.2 1.1s-.2 1-.3 1.6c0 .1 0 .1.1.2h.2c.6-.3 1.4-.8 1.4-.8s.9.5 1.4.8h.2c.1 0 .1-.1.1-.2-.1-.6-.3-1.6-.3-1.6s.7-.7 1.2-1.1c0 0 .1-.1 0-.2 0-.1-.1-.1-.1-.1-.7-.1-1.6-.2-1.6-.2s-.4-.9-.7-1.5c0-.1-.1-.1-.1-.1s-.1 0-.1.1c-.5.6-.9 1.5-.9 1.5z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st16"
+          d="M226.5 359.5s-1 .1-1.6.2c-.1 0-.1 0-.1.1v.2c.5.4 1.2 1.1 1.2 1.1s-.2 1-.3 1.6c0 .1 0 .1.1.2h.2c.6-.3 1.4-.8 1.4-.8s.9.5 1.4.8h.2c.1 0 .1-.1.1-.2-.1-.6-.3-1.6-.3-1.6s.7-.7 1.2-1.1c0 0 .1-.1 0-.2 0-.1-.1-.1-.1-.1-.7-.1-1.6-.2-1.6-.2s-.4-.9-.7-1.5c0-.1-.1-.1-.1-.1s-.1 0-.1.1c-.5.6-.9 1.5-.9 1.5z"
+        />
+      </g>
+      <path
+        className="prefix__st0"
+        d="M243.4 318.9h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 0-1.9-.5-2.1z"
+      />
+      <g>
+        <path
+          className="prefix__st2"
+          d="M235.3 321.2v2.6h-1.4v-7.3h2.5c.7 0 1.3.2 1.7.6.4.4.6 1 .6 1.7s-.2 1.3-.6 1.7c-.4.4-1 .6-1.7.6h-1.1zm0-1.1h1.1c.3 0 .5-.1.7-.3.2-.2.2-.5.2-.9 0-.3-.1-.6-.2-.9-.2-.2-.4-.3-.7-.3h-1.1v2.4z"
+        />
+      </g>
+      <path
+        className="prefix__st2"
+        d="M141.2 571.9c0 1.3-1 0-2.3 0s-2.3 1.3-2.3 0 1-2.3 2.3-2.3 2.3 1 2.3 2.3z"
+      />
+      <path
+        transform="rotate(134.999 135.769 566.053)"
+        className="prefix__st2"
+        d="M135.4 563.8h.7v4.5h-.7z"
+      />
+      <path
+        transform="rotate(-134.999 135.767 566.054)"
+        className="prefix__st2"
+        d="M135.4 563.8h.7v4.5h-.7z"
+      />
+      <path
+        transform="rotate(134.999 141.769 566.053)"
+        className="prefix__st2"
+        d="M141.4 563.8h.7v4.5h-.7z"
+      />
+      <path
+        transform="rotate(-134.999 141.767 566.054)"
+        className="prefix__st2"
+        d="M141.4 563.8h.7v4.5h-.7z"
+      />
+      <g>
+        <path
+          className="prefix__st2"
+          d="M142.3 452.4c0 1-.2 1.7-.7 2.2s-1.1.7-2 .7-1.6-.3-2.1-.8-.8-1.3-.8-2.3v-2.5c0-1 .3-1.8.8-2.3s1.2-.8 2-.8c.9 0 1.6.2 2.1.7s.7 1.2.7 2.2h-1.6c0-.6-.1-1-.2-1.2s-.5-.4-.9-.4-.7.1-.9.4c-.2.3-.3.7-.3 1.3v2.6c0 .6.1 1 .3 1.3.2.3.5.4.9.4s.7-.1.8-.3.2-.6.2-1.2h1.7z"
+        />
+      </g>
+      <g>
+        <path className="prefix__st2" d="M139.6 387.3h-1.7v-8.5h1.7v8.5z" />
+      </g>
+      <path
+        d="M132.6 378.6c5.1.5 9.1.2 14-.8.8-.2 1.7-.5 1.9-1.1.1-.4-.1-.8-.4-1-.3-.3-.7-.5-1.2-.6-5.1-2.1-11.1-2.6-16.6-1.5-.4.1-.8.2-1.1.4-.3.2-.5.5-.5.8.1.5.7.7 1.3.8 3.5.9 7.3 1.1 10.9.6 1.2-.1 2.5-.4 3.5-1s1.6-1.7 1.2-2.6c-.5-1.1-2.1-1.6-3.5-1.8-3.1-.5-6.3-.6-9.4-.3-.4 0-.9.1-1.1.4-.2.2-.1.5.1.7.2.2.5.3.8.5 2.4 1.1 5.3 1.6 8 1.4.8-.1 1.6-.2 2.3-.5.7-.3 1.2-.9 1.1-1.5 0-.5-.4-.9-.9-1.2-.5-.3-1.1-.5-1.7-.6-2.1-.5-4.2-.8-6.4-.8"
+        fill="none"
+        stroke={fillColor}
+        strokeWidth={0.75}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        strokeMiterlimit={10}
+      />
+      <g>
+        <path
+          className="prefix__st18"
+          d="M140.7 309.2l-.3 1-.6.5c-.1.2-.3.4-.4.5-.2.1-.4.2-.6.2-.5 0-.9-.2-1.1-.6l-.6-.5-.3-1 .4-.1c0 .1.1.2.1.2.2.4.3.6.5.7.2.1.5.2.9.2.5 0 .8-.1 1-.2.2-.1.4-.4.5-.7 0-.1.1-.1.1-.2h.4z"
+        />
+        <path
+          className="prefix__st18"
+          d="M138.8 312.4c.4-.2 1.2-.6 2.3-1.1.1 0 .2-.1.4-.2.4-.4.7-.7 1-.9.3-.2.4-.3.6-.3.1 0 .3 0 .3.1.1.1.1.2.1.4s0 .4-.1.7c.3.4.4.6.4.8 0 .2 0 .3-.1.3-.1.1-.2.1-.4.1-.1 0-.2 0-.4-.1s-.4-.2-.6-.4c-.6.1-1.5.5-2.7 1.1.2.1.3.2.3.2.4.2.9.5 1.5.9.1 0 .2.2.5.3 1.2.1 1.9.5 1.9.9 0 .3-.3.5-1 .6-.3.4-.6.6-.8.6-.2 0-.5-.3-.7-1 0-.1-.1-.2-.1-.3-1-.8-1.8-1.4-2.6-1.8-.9.5-1.8 1.2-2.6 1.9-.1.8-.3 1.2-.7 1.2-.2 0-.5-.2-.8-.7-.7 0-1-.2-1-.6 0-.3.1-.5.4-.6.3-.1.8-.3 1.6-.4.6-.5 1.4-.9 2.2-1.4-1.2-.6-2.1-.9-2.8-1.1-.2.2-.3.3-.5.3-.1.1-.3.1-.4.1-.2 0-.3 0-.4-.1-.1-.1-.1-.2-.1-.3 0-.1.2-.4.5-.8-.1-.3-.1-.5-.1-.6 0-.2 0-.4.1-.5.1-.1.2-.1.4-.1s.4.1.6.3c.3.2.6.5.9.9.9.6 1.8 1 2.9 1.6z"
+        />
+        <path
+          className="prefix__st18"
+          d="M141.3 302.7c-.7-.6-1.5-.9-2.6-.9s-1.9.3-2.6.9c-.7.6-1 1.3-1 2.2 0 .8.1 1.4.3 1.7.3.5.4.8.4 1l.1.9 1.4.7.2.5c.1 0 .3.1.5.1h.6c.4 0 .8 0 1.1-.1l.2-.5 1.4-.7.1-.9c0-.2.1-.3.1-.4.4-.8.7-1.5.7-2.3.1-.9-.2-1.7-.9-2.2zm-4.1 4.8c-.6 0-.9-.3-.9-1 0-.3.1-.6.2-.7.1-.2.4-.2.7-.2.6 0 .8.3.8.9.1.7-.2 1-.8 1zm1.8 1.4c-.1 0-.2 0-.2-.1-.1.1-.2.1-.2.1-.1 0-.2 0-.3-.1-.1-.1-.1-.1-.1-.2s.1-.2.2-.4.3-.3.4-.5c.1.2.2.4.4.5.2.2.2.3.2.4 0 .2-.1.3-.4.3zm1.3-1.4c-.6 0-.9-.3-.9-1 0-.6.3-.9.9-.9.3 0 .5.1.6.2.1.1.2.4.2.7 0 .7-.2 1-.8 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st3"
+          d="M135.8 269.4s1.5-1.6.9-2.6-2.3-2.6-2.3-3c-.1-.4-.5-3.6-1-3.9s-.9 1.4-.5 2.7c.3 1.4-.9.2-1.1-.2-.2-.4-1.8-2.6-2.3-2.2s0 1.1.4 1.6 1.6 2 1.3 2.2c-.2.2-4-3.1-4.5-2.7-.5.4-.5 1 .1 1.4s3.9 2.2 3.9 2.6-1.1.3-2.4-.1c-1.3-.4-3-.4-3 .2s5.4 2.2 6.1 2.7c.8.4.3 1-.2 1.1-.4.2-1.9 1.2-2.3 1.9-.3.7.3 1.2.7.8.3-.4 2.4-1.6 3-1.4.7.4 2.1 0 3.2-1.1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st3"
+          d="M136.8 266.8l10.2 6.8-3.2 3.6-9.9-8z"
+        />
+      </g>
+      <path
+        className="prefix__st16"
+        d="M136 279c-1.2-.9-2.5-1.8-3.7-2.8.1-.1 1.5-2 1.5-2.1.5-.6 1-1.2 1.4-1.9 0-.1.1-.2.1-.3-.2-1.2-.4-2.4-.5-3.6-.1-.6.2-1 .8-1 .4-.1.8-.1 1.2-.2h.2c.2 0 .2.2.2.3-.1.2-.3.5-.4.7-.1.2-.1.3 0 .3.1.1.2 0 .3-.1.3-.4.6-.9.9-1.3.5-.6 1.3-.5 1.6.2.1.2.2.2.3.1.1 0 .1-.1.2-.1.3-.1.7-.1 1 .1.3.2.4.5.3.9 0 .3 0 .4.3.4.7.1.9.7.7 1.3-.1.2 0 .4.2.6l.2.2c.3.3.5.7.2 1.1-.6.9-1.4 1.6-2.4 2.1-.4.2-.8.2-1.2.2-.1 0-.2 0-.3.1-.6.9-1.3 1.9-2 2.8.2.2-1.1 2-1.1 2z"
+      />
+      <g>
+        <path
+          className="prefix__st2"
+          d="M231 315.1l3.2-3.2-3.2-3.2 1.8-1.9 3.2 3.2 3.3-3.2 1.8 1.9-3.2 3.2 3.2 3.2-1.8 1.9-3.3-3.2-3.2 3.2z"
+        />
+        <path
+          className="prefix__st19"
+          d="M231 315.1l3.2-3.2-3.2-3.2 1.8-1.9 3.2 3.2 3.3-3.2 1.8 1.9-3.2 3.2 3.2 3.2-1.8 1.9-3.3-3.2-3.2 3.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st2"
+          d="M226.4 317.1l1.4-1.5-1.4-1.4 1.2-1.3 1.4 1.5 1.5-1.5 1.2 1.3-1.4 1.4 1.4 1.5-1.2 1.2-1.5-1.4-1.4 1.4z"
+        />
+        <path
+          className="prefix__st19"
+          d="M226.4 317.1l1.4-1.5-1.4-1.4 1.2-1.3 1.4 1.5 1.5-1.5 1.2 1.3-1.4 1.4 1.4 1.5-1.2 1.2-1.5-1.4-1.4 1.4z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st2"
+          d="M241.4 317.1l1.4-1.5-1.4-1.4 1.2-1.3 1.4 1.5 1.5-1.5 1.2 1.3-1.4 1.4 1.4 1.5-1.2 1.2-1.5-1.4-1.4 1.4z"
+        />
+        <path
+          className="prefix__st19"
+          d="M241.4 317.1l1.4-1.5-1.4-1.4 1.2-1.3 1.4 1.5 1.5-1.5 1.2 1.3-1.4 1.4 1.4 1.5-1.2 1.2-1.5-1.4-1.4 1.4z"
+        />
+      </g>
+      <path
+        className="prefix__st5"
+        d="M238 126.7h-8.8l-4.4 7.6 4.4 7.6h8.8l4.4-7.6-4.4-7.6zm-1.8 10.6h-4.9v-6.8h1.4v5.3h3.5v1.5z"
+      />
+      <g>
+        <path
+          className="prefix__st0"
+          d="M416.4 12.3l-6.6-5.7-6.7 5.7-1.9-2.3 8.6-7.4 8.6 7.4z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M406.1 32.9l-1.7 2.7H402l2.8-4.1-2.6-3.9h2.4l1.6 2.5 1.5-2.5h2.4l-2.6 3.9 2.8 4.1h-2.4l-1.8-2.7zM410.9 27.6h4c1.8 0 2.8 1.2 2.8 2.7 0 1.4-1 2.6-2.8 2.6H413v2.7h-2.1v-8zm3.7 1.8h-1.7v1.8h1.7c.6 0 1-.3 1-.9 0-.6-.5-.9-1-.9z"
+        />
+      </g>
+    </BaseSvg>
+  );
+};
+
+export default MeleeWeaponSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeWeaponSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeWeaponSvg/index.ts
new file mode 100644
index 0000000..42da27b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/MeleeWeaponSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import MeleeWeaponSvg from "./MeleeWeaponSvg";
+
+const LightMeleeWeaponSvg = asLightSvg(MeleeWeaponSvg);
+const DarkMeleeWeaponSvg = asDarkSvg(MeleeWeaponSvg);
+const GrayMeleeWeaponSvg = asGraySvg(MeleeWeaponSvg);
+
+export default MeleeWeaponSvg;
+export {
+  MeleeWeaponSvg,
+  LightMeleeWeaponSvg,
+  DarkMeleeWeaponSvg,
+  GrayMeleeWeaponSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedSpellSvg/RangedSpellSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedSpellSvg/RangedSpellSvg.tsx
new file mode 100644
index 0000000..da2cd8b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedSpellSvg/RangedSpellSvg.tsx
@@ -0,0 +1,48 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const RangedSpellSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 20.28 20.17">
+      <defs>
+        <style>
+          {`.prefix__cls-1{stroke:${fillColor};stroke-miterlimit:10}.prefix__cls-5{fill:${secondaryFillColor}}`}
+        </style>
+      </defs>
+      <title>{"Asset 14"}</title>
+      <g id="prefix__Layer_2" data-name="Layer 2">
+        <g id="prefix__Layer_1-2" data-name="Layer 1">
+          <path
+            className="prefix__cls-1"
+            d="M15.25 19.55l-3.97-3.05M9.37 9.48c-.11-.1-.21-.21-.32-.32.2.19.32.32.32.32z"
+          />
+          <path
+            d="M16.41 16.42l-7.82-12h3.83L7.58 2.84l-.31-.55 4.19-.79L4.91.55 4.4.52.51.5v7.17l.76 3.72s.07-2.67 0-3a49.92 49.92 0 013 4c-.3-1.3-.69-3.51-.86-4.5zM7.17 8.3h.17l.07.18z"
+            fill={fillColor}
+            stroke={fillColor}
+            strokeMiterlimit={10}
+          />
+          <path
+            d="M5.41 7.42c.11.11 1.89.9 2 1a18.82 18.82 0 00-1-2.32c-1.47-1.48.37-.81 0-2.68s-3.18-.47-5-1c.34 1.07-.77 1.89 1 4 1.06 1.32 2.29.34 3 1z"
+            fill="none"
+          />
+          <path
+            d="M15.16 19.8c-1.57 0-3.06-.58-3.46-1.35a5.69 5.69 0 00-2.65-.75h-.27a.74.74 0 01-.73-.61A1 1 0 018.72 16a3.38 3.38 0 011.28-.2 7.94 7.94 0 011.92.22.93.93 0 00.27 0 .29.29 0 00.18 0v-.28c0-.19-.53-1.06-1-1.9-1.83-3.27-2.16-4.07-1.87-4.47a.64.64 0 01.5-.26c.72 0 1.86 1.1 2.47 2.12a6 6 0 001 1.31c-.18-.77-.69-2.28-.94-3l-.3-.9A1.17 1.17 0 0113.47 7c.59 0 .88.83 1.51 3.49l.14.57c0-.35.07-.78.08-1.26 0-1.22.41-1.84 1.08-1.84a.61.61 0 01.47.23c.57.68.24 3.33.23 3.35a2.59 2.59 0 000 .65c.54-1.08 1.63-2.05 2.28-2.05a.58.58 0 01.57.39c.14.39-.08 1.1-1.62 3.62l-.18.29a10.57 10.57 0 000 1.34 13.58 13.58 0 01-.1 2.32c-.25 1.31-2.49 1.62-2.74 1.66z"
+            fill={fillColor}
+          />
+          <path
+            className="prefix__cls-5"
+            d="M13.47 7.42c.64 0 1.39 5 1.69 5 .29 0 .4-1.94.42-2.54s.12-1.48.71-1.48c.6 0 .38 2.73.31 3.15s0 1.34.33 1.34c.1 0 .23-.12.39-.45.51-1 1.5-1.87 2-1.87a.21.21 0 01.21.14c.19.52-1.58 3.27-1.77 3.6s0 2.69-.17 3.77-2.42 1.35-2.42 1.35c-1.54 0-2.83-.58-3.12-1.15s-2.24-1-3-1h-.27c-.43 0-.58-.72.09-1a3.12 3.12 0 011.13-.1 7.67 7.67 0 011.81.2 1.3 1.3 0 00.39.06c.37 0 .71-.19.49-.81-.29-.83-3.23-5.58-2.9-6a.26.26 0 01.21-.15c.51 0 1.55.94 2.15 1.94s1.3 1.71 1.62 1.71a.15.15 0 00.13-.06c.21-.29-1.1-3.9-1.29-4.54a.8.8 0 01.83-1.1m0-.75a1.64 1.64 0 00-1.33.62 1.61 1.61 0 00-.22 1.45c0 .16.16.5.3.92l.32 1c-.64-.88-1.67-1.87-2.5-1.87a1 1 0 00-.83.41C8.77 9.74 9 10.42 11 14c.32.57.67 1.21.85 1.58a9.06 9.06 0 00-1.85-.15 3.67 3.67 0 00-1.45.23 1.38 1.38 0 00-.88 1.54 1.12 1.12 0 001.09.9H9a6.16 6.16 0 012.38.61c.5.87 2.07 1.49 3.76 1.49h.09c.46-.06 2.77-.42 3.06-2a13.8 13.8 0 00.1-2.4v-1.21l.13-.21c1.65-2.69 1.84-3.42 1.65-3.95a1 1 0 00-.92-.64A2.94 2.94 0 0017.43 11c.07-.88.11-2.39-.38-3a1 1 0 00-.71-.36c-.53 0-1.12.24-1.38 1.23-.41-1.51-.76-2.19-1.48-2.19zM1.37 1.47L2.29 8 3 4.34s3.42 4 3.33 3.79-2-4.37-2-4.37l4 .42-4.21-1.92 4.13-.75z"
+          />
+        </g>
+      </g>
+    </BaseSvg>
+  );
+};
+
+export default RangedSpellSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedSpellSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedSpellSvg/index.ts
new file mode 100644
index 0000000..9885447
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedSpellSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import RangedSpellSvg from "./RangedSpellSvg";
+
+const LightRangedSpellSvg = asLightSvg(RangedSpellSvg);
+const DarkRangedSpellSvg = asDarkSvg(RangedSpellSvg);
+const GrayRangedSpellSvg = asGraySvg(RangedSpellSvg);
+
+export default RangedSpellSvg;
+export {
+  RangedSpellSvg,
+  LightRangedSpellSvg,
+  DarkRangedSpellSvg,
+  GrayRangedSpellSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedWeaponSvg/RangedWeaponSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedWeaponSvg/RangedWeaponSvg.tsx
new file mode 100644
index 0000000..a90e848
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedWeaponSvg/RangedWeaponSvg.tsx
@@ -0,0 +1,833 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const RangedWeaponSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 19 20.6">
+      <style>
+        {`.prefix__st0{fill:${fillColor}}.prefix__st1{fill:${secondaryFillColor}}.prefix__st2{fill:${fillColor}}.prefix__st4{fill:${fillColor}}.prefix__st5{fill:${fillColor}}.prefix__st6{fill:${fillColor};stroke:${fillColor};stroke-miterlimit:10}.prefix__st8,.prefix__st9{fill:none}.prefix__st9{stroke:${fillColor};stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10}.prefix__st11{fill:none;stroke-width:.5538}.prefix__st11,.prefix__st12{stroke:${fillColor};stroke-miterlimit:10}.prefix__st13,.prefix__st14{stroke-width:.75}.prefix__st13{fill:none;stroke:${secondaryFillColor};stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10}.prefix__st14{fill:${secondaryFillColor}}.prefix__st14,.prefix__st16,.prefix__st17{stroke:${fillColor};stroke-miterlimit:10}.prefix__st16{fill:${secondaryFillColor};stroke-width:.5;stroke-linecap:round;stroke-linejoin:round}.prefix__st17{fill:none;stroke-width:.75}`}
+      </style>
+      <path
+        className="prefix__st0"
+        d="M226.9 469.8s6.1 5.8 12.2 11.5l1.4-2.2 1.8 1.3-2.9 2.5 3.7 4.6-1 1-3.7-4.3-2.8 2.5-1.3-1 2-1.6c0-.1-7.2-8.7-9.4-14.3z"
+      />
+      <path
+        className="prefix__st0"
+        d="M237.9 478.2c0 .1-.1-.1 0 0 2-2.7 4.3-5.8 5.3-8.4 0 0-3.8 2.4-7.8 6.1.5.6 1.8 1.7 2.5 2.3zM231.4 480.9c-.2-.2-1.5-1.6-1.5-1.6l-1.6 1 2.4 2.6-3.7 4.6 1 1 3.7-4.3 1.1.9c.4-.5.8-.9 1.2-1.4l.2-.2c-1-.8-1.9-1.7-2.8-2.6zM0-36.9s6.1 5.8 12.2 11.5l1.4-2.2 1.8 1.3-2.9 2.5 3.7 4.6-1 1-3.7-4.3L8.7-20l-1.3-1 2-1.6c0-.1-7.2-8.7-9.4-14.3z"
+      />
+      <path
+        className="prefix__st0"
+        d="M11-28.5c0 .1-.1-.1 0 0 2-2.7 4.3-5.8 5.3-8.4 0 0-3.8 2.4-7.8 6.1.5.6 1.9 1.8 2.5 2.3zM4.5-25.8C4.3-26 3-27.4 3-27.4l-1.6 1 2.4 2.6L0-19.2l1 1 3.7-4.3 1.1 1c.4-.6.8-1 1.2-1.5l.2-.2c-.9-.8-1.8-1.7-2.7-2.6z"
+      />
+      <path
+        className="prefix__st1"
+        d="M8.8 42s-2 .3-2.7 1.4c0 0 1.2 1 2.1.5s1.2-1.1.6-1.9z"
+      />
+      <path
+        className="prefix__st0"
+        d="M10.4 44.9l-8.8-8.6s.8 7.3 5.8 10.5l3-1.9zM11.3 45.8l4.4 5.2-1.7.9-4-5.1zM16.3 45s-1.1-3.9-4.3-8c0 0-1.2 3.3 2.1 8.4l2.2-.4zM16.8 46c.2.2 1.4 4.1 1.4 4.1l-1.2.8-1.5-4.6 1.3-.3zM15.4 54.2l-4.7-3-1.1 1.2 4.7 2.9zM9.6 50.7L0 47.4s3.1 5.1 7.7 5.7l1.9-2.4z"
+      />
+      <path
+        className="prefix__st2"
+        d="M8.2 90L.6 91l5.2-3.3L.2 84h5.7L0 74l7.7 4.9-1.3-3.8 3 1.9 2-2.5 2.4 3.3 2.4-3.1-1.4 13.9z"
+      />
+      <path
+        className="prefix__st2"
+        d="M13.1 90.5c-1.6 0-3.2-.6-3.6-1.4-.2-.2-1.8-.7-2.5-.7h-.3c-.4 0-.8-.3-.8-.7-.1-.4.1-1 .7-1.3.4 0 .8-.1 1.4-.1.8 0 1.6.1 2 .2H10.3v-.1c-.1-.3-.5-1.1-1-1.9-1.9-3.4-2.2-4.2-1.8-4.6.1-.2.4-.3.6-.3.9 0 2.1 1.3 2.6 2.2.2.4.5.7.7.9-.2-.8-.6-1.9-.8-2.5-.1-.4-.3-.7-.3-.9-.1-.5-.1-.9.2-1.2.3-.3.7-.5 1.1-.5.7 0 1 .9 1.6 3.4v-.5c0-1.3.5-2 1.2-2 .2 0 .4.1.6.3.6.7.3 3.4.3 3.5v.2c.6-.9 1.5-1.8 2.2-1.8.3 0 .6.2.7.5.2.4 0 1.1-1.6 3.7-.1.1-.1.2-.2.3v1.3c0 .8 0 1.7-.1 2.3-.5 1.4-2.8 1.7-3.2 1.7z"
+      />
+      <path
+        className="prefix__st1"
+        d="M11.5 78c.6 0 1.4 5 1.7 5 .3 0 .4-1.9.4-2.5 0-.6.1-1.5.7-1.5s.4 2.7.3 3.1c0 .3 0 1.3.3 1.3.1 0 .2-.1.4-.4.5-1 1.5-1.9 2-1.9.1 0 .2 0 .2.1.2.5-1.6 3.3-1.8 3.6s0 2.7-.2 3.8c-.2 1.1-2.4 1.4-2.4 1.4-1.5 0-2.8-.6-3.1-1.1-.3-.5-2.2-1-3-1h-.2-.1c-.4 0-.6-.7.1-1 .3-.1.7-.2 1.1-.2.7 0 1.5.1 1.8.2.1 0 .3.1.4.1.4 0 .7-.2.5-.8-.3-.8-3.2-5.6-2.9-6 .1-.1.1-.1.2-.1.5 0 1.6.9 2.1 1.9.6 1 1.3 1.7 1.6 1.7.1 0 .1 0 .1-.1.2-.3-1.1-3.9-1.3-4.5 0-.6.4-1.1 1.1-1.1m0-1c-.6 0-1.2.3-1.5.7-.3.5-.4 1.1-.3 1.7 0 .1.1.4.2.7-.6-.6-1.2-1-1.9-1-.4 0-.8.2-1 .5-.5.7-.2 1.6 1.8 5.2.2.4.4.8.6 1.1-.4-.1-1-.1-1.4-.1-.7 0-1.2.1-1.6.2-.8.3-1.2 1.1-1 1.8.2.7.7 1.2 1.4 1.2h.3c.5 0 1.8.3 2.1.5.6.9 2.2 1.6 3.9 1.6h.2c.5-.1 2.9-.4 3.3-2.2.1-.7.1-1.6.1-2.4v-1.1s.1-.1.1-.2c1.7-2.8 1.9-3.5 1.7-4.2-.2-.5-.6-.8-1.2-.8-.5 0-1.1.3-1.6.8 0-.9 0-2-.5-2.5-.2-.3-.5-.5-.9-.5s-.9.1-1.3.7c-.4-1.1-.8-1.7-1.5-1.7z"
+      />
+      <path
+        className="prefix__st0"
+        d="M10.1-135.1s1.5 1.4 4.2.9c0 0-.5-2.7-4.2-2.6 0 0 1.4-2.4-1.2-4.9-2.7-2.5-7.6-2.9-7.6-2.9s6.7 3.5 5.9 5.9c0 0-3.2 1.2-3.5 3-.3 1.8-.7 2.7-3.3 4.3 0 0-1.1 1-.9 1.5.1.5 2.7 3.5 3.9 3.4s4-.9 6.1-.5c2.1.5 3.8-3.3 2.4-5.4l-1.8-2.7zM4.9-133c1.3-2.4 3.6-2.7 3.6-2.7-.5 3.6-3.6 2.7-3.6 2.7z"
+      />
+      <path
+        className="prefix__st0"
+        d="M11.4-139.7c.3.8.3 1.5.1 2.1 2.6.4 3.6 2.2 3.8 3.2l.2.8-.8.2c-.5.1-.9.1-1.4.1-.3 0-.7 0-1-.1.1.2.3.4.4.6.9 1.3.9 3.1.1 4.7-.1.3-.3.5-.5.8 2.3.9 1.5 2.4 3.6 2.4s3.6-12.7 0-14.4c-.8-.5-3.3-.5-4.5-.4zM3.8-138.1l1.8-1.5c-1.8-.2-5.9-4.2-5.8-4 .6 3.1 4 5.5 4 5.5z"
+      />
+      <path
+        className="prefix__st2"
+        d="M6 419.7l-5.4.9 3.7-3.1-4-3.4h4.1l-4.2-9.4 5.5 4.6-.9-3.5 2.1 1.7 1.4-2.3 1.8 3.1 1.7-2.9-1 12.9z"
+      />
+      <path
+        className="prefix__st0"
+        d="M5.3 424l3.5-6-.6-.3.7-1.1-1.5-.8-.5.8-2.6-1.4 3.8-6.5 2.5 1.4-.5.9 1.5.8 2.1-2.3 2.7 2.7-1.3 1.6 1.6 1 .5-.8 2.6 1.4-3.8 6.5-2.5-1.5.5-.8-1.7-1-.6 1.1-.6-.3-2.6 4.6z"
+      />
+      <path
+        d="M8.3 409.4l1.7 1-3.2 5.6-1.8-1 3.3-5.6m5.4.8l2 2-1.1 1.3L12 412l1.7-1.8m-3.8 1.2l6.5 3.8-2.3 3.9-6.5-3.8 2.3-3.9m7.5 3.2l1.7 1-3.2 5.6-1.7-1 3.2-5.6m-8.1 2.3l2.6 1.5-.3.6-2.6-1.5.3-.6m-.1 1.4l1.5.9-2.5 4.3h-2l3-5.2M7.9 408l-.5.9-3.2 5.6-.5.9.9.5 1.7 1 .9.5.5-.9.6.4-.2.1-.5.9.5.3-2.8 4.8-.9 1.5h4.3l.3-.5 2.3-3.9.5.3.5-.9.1-.2.8.5-.5.9.9.5 1.7 1 .9.5.5-.9 3.2-5.6.5-.9-.9-.5-1.7-1-.9-.5-.5.8-.7-.4.7-.8.6-.7-.6-.6-2-2-.8-.8-.7.8-1.4 1.6-.7-.4.5-.8-.9-.5-1.7-1-.8-.5z"
+        fill={secondaryFillColor}
+      />
+      <path
+        className="prefix__st4"
+        d="M7.7 277.8c-.3-.1-.5-.4-.4-.7v-.6l-.6.6-.3.3c-.2.2-.5.2-.7 0-.2-.2-.2-.5 0-.7.1-.1.2-.3.4-.4l1.2-1.2s.1-.1.1-.2v-2.7c0-.1-.1-.2-.1-.2-.5-.2-1-.4-1.4-.9-.7.4-1.5.8-2.2 1.2 0 0-.1.1-.1.2-.2.6-.3 1.3-.5 1.9-.1.2-.2.4-.4.5-.4.1-.7-.2-.7-.6.1-.4.2-.7.3-1.1v-.2l-.6.3c-.2.1-.3.2-.5.3-.3.1-.6 0-.7-.2-.1-.3-.1-.5.2-.7.3-.2.6-.3 1-.5-.4-.1-.7-.2-1.1-.3-.4-.1-.5-.3-.5-.7.1-.3.4-.4.7-.4.6.1 1.2.3 1.8.4.3.1.5 0 .7-.1.6-.4 1.3-.7 1.9-1-.1-.5-.2-1 0-1.5-.6-.3-1.1-.6-1.7-.9-.3-.2-.5-.3-.9-.1-.6.2-1.3.3-1.9.5-.3.1-.6-.1-.7-.4-.1-.3.1-.6.4-.6.3-.1.7-.2 1-.2.1 0 .1 0 .2-.1-.4-.2-.7-.4-1.1-.6-.2-.1-.3-.4-.3-.6.1-.2.2-.4.5-.4.1 0 .2 0 .3.1.3.2.6.3 1 .5-.1-.4-.2-.7-.2-1v-.2c0-.3.1-.6.4-.6.3-.1.5.1.6.4.2.6.3 1.3.5 1.9 0 .1.1.2.2.2.7.4 1.4.8 2.2 1.2l.1-.1c.3-.4.7-.6 1.2-.8.1 0 .2-.1.2-.2v-2.7c0-.1 0-.1-.1-.2l-1.5-1.5c-.2-.2-.3-.6 0-.8.2-.2.5-.2.8 0l.8.8v-.7c0-.4.2-.6.5-.6s.5.3.5.6v.7l.8-.8c.2-.2.3-.2.6-.2.2.1.3.2.3.4s0 .3-.1.5l-1.5 1.5s-.1.1-.1.2v2.9c.6.1 1.1.4 1.5.9.7-.4 1.5-.8 2.2-1.2.1 0 .1-.1.1-.2.2-.6.3-1.2.4-1.9.1-.4.3-.5.7-.5.3.1.4.4.4.7-.1.4-.2.7-.3 1.1.3-.2.6-.3.9-.5.1 0 .2-.1.3-.1.3-.1.5 0 .7.2.1.2.1.5-.2.7-.3.2-.6.3-.9.5-.1 0-.1.1-.3.1.4.1.7.2 1 .2.3.1.5.2.6.4v.2c-.2.4-.4.5-.8.4h-.2c-.6-.2-1.3-.3-1.9-.5h-.1c-.7.4-1.3.7-2 1.1-.1 0-.1.1-.1.2.1.4.1.8 0 1.2 0 .1 0 .2.1.2.7.4 1.3.7 2 1.1.1 0 .1.1.2 0 .7-.2 1.3-.3 2-.5.5-.1.6 0 .8.4v.2c-.1.3-.3.4-.6.4-.3.1-.6.1-.9.2.3.2.7.3.9.5.3.2.4.4.3.7-.1.3-.4.4-.7.2-.1 0-.1-.1-.2-.1-.3-.2-.6-.3-.9-.5l.3 1.2c.1.3-.1.6-.4.7-.3.1-.6-.1-.6-.4-.2-.7-.3-1.4-.5-2 0-.1 0-.1-.1-.1-.7-.4-1.5-.8-2.2-1.2-.4.5-.9.8-1.5.9v2.9c0 .1.1.1.1.2l1.5 1.5c.1.1.1.3.1.5s-.2.3-.3.4c-.2.1-.4 0-.6-.2l-.8-.8h-.1v.6c0 .4-.1.6-.5.7.3.4.2.4.1.4zm1.7-8.3c0-.9-.7-1.6-1.5-1.6s-1.6.7-1.6 1.5.7 1.6 1.5 1.6c.9.1 1.6-.6 1.6-1.5z"
+        id="prefix__YHMZe9_tif"
+      />
+      <path
+        className="prefix__st5"
+        d="M7.2 315.2c-3.1 0-7-2.5-7-6.3 0 0 1 1.8 3 1.8 0 0-2.8-3.8 2-7.2s2-7.2 2-7.2 3.1 1.8 2 4.5-.9 6.7 0 7.5c0 0-.4-5.6 3-6.6 0 0-1.9 2.9 0 4.5s1.6 9-5 9z"
+      />
+      <path
+        className="prefix__st6"
+        d="M19.2 336.3l-3 4M15.2 332.3l-8 6M.3 347.3c-.3 1.2.1 2.4 1 3.2 1 .8 2.4.8 3.5.2l.3.7 6-1h-3c-.3 0 4-3 4-3-1.3.3-3.5.7-4.5.9l11.5-15.9-15 10.8v-3.8l-1.7 5-.4.3-.9-4.4-1 7h.2zm2.9-2c1.9-.4 4.2-1.2 5.7-2.7l.3-.3-.3.3c-.7.7-2.1 2.6-1.7 4.7.5 2.7-3.5 1.8-5 3 .5-1.8-1-4.6 1-5z"
+      />
+      <path className="prefix__st6" d="M9.2 342.3l-.3.3c.1-.2.3-.3.3-.3z" />
+      <g id="prefix__Icons_new_Arranged_Names">
+        <g id="prefix___x38_7_Lightning">
+          <path
+            id="prefix__Rectangle_297_copy"
+            className="prefix__st0"
+            d="M3.8 370h5.7l-3.3 6.7h4.6L1.5 386l1.9-6.7H.2l3.6-9.3z"
+          />
+        </g>
+      </g>
+      <path
+        className="prefix__st0"
+        d="M6.7 237.4c.6-.3 1.5-.8 2.9-1.3.1 0 .2-.1.5-.2.5-.5.9-.9 1.2-1.1.3-.3.6-.4.7-.4.2 0 .3.1.4.2.1.1.1.3.1.5s0 .5-.1.8c.4.5.6.8.6 1 0 .2-.1.3-.2.4-.1.1-.3.1-.5.1-.1 0-.3-.1-.5-.2s-.5-.3-.8-.5c-.8.1-1.9.6-3.4 1.3.2.1.3.2.4.2.5.3 1.1.7 1.9 1.2.1.1.3.2.6.4 1.6.2 2.3.6 2.3 1.2 0 .4-.4.7-1.3.8-.4.5-.7.7-1 .7-.3 0-.6-.4-.9-1.2 0-.1-.1-.2-.1-.4-1.2-1-2.3-1.7-3.2-2.2-1.2.7-2.3 1.4-3.3 2.4-.1 1-.4 1.5-.9 1.5-.3 0-.6-.3-1-.8-.9 0-1.3-.2-1.3-.7 0-.4.2-.6.5-.8.3-.2 1-.3 2.1-.5.8-.6 1.7-1.1 2.8-1.7-1.4-.7-2.6-1.2-3.5-1.3-.2.2-.4.3-.6.4-.2.1-.3.1-.5.1s-.4 0-.5-.1c-.1-.1-.2-.2-.2-.4s.2-.5.6-1c-.1-.4-.1-.6-.1-.8 0-.3.1-.4.2-.6.1-.1.3-.2.4-.2.2 0 .5.1.8.4.3.3.7.6 1.1 1.2 1.2.3 2.4.9 3.8 1.6z"
+      />
+      <path
+        className="prefix__st0"
+        d="M9.1 233.4l-.3 1.3-.8.7c-.1.3-.3.5-.5.6-.2.1-.5.2-.8.2-.6 0-1.1-.3-1.3-.8l-.8-.7-.3-1.3.5-.1c.1.1.1.2.1.3.2.5.4.8.6.9.2.1.6.2 1.2.2s1-.1 1.3-.2c.2-.1.5-.4.6-.9 0-.1.1-.2.1-.3l.4.1z"
+      />
+      <path
+        className="prefix__st0"
+        d="M9.8 225.2c-.8-.7-1.9-1.1-3.2-1.1s-2.4.4-3.2 1.1c-.8.7-1.2 1.6-1.2 2.8 0 1 .1 1.7.4 2.1l.6 1.2.2 1.1 1.8.9.3.7c.2.1.4.1.6.1h.7c.6 0 1-.1 1.3-.2l.3-.7 1.8-.9.2-1.1c0-.2.1-.4.1-.5.5-.9.8-1.9.8-2.9-.2-1-.6-1.9-1.5-2.6zm-5.1 6.1c-.7 0-1.1-.4-1.1-1.2 0-.4.1-.7.3-.9.2-.2.5-.3.8-.3.7 0 1 .4 1 1.1.1.9-.3 1.3-1 1.3zm2.2 1.7c-.1 0-.2 0-.3-.1-.1.1-.2.1-.3.1-.2 0-.3 0-.4-.1-.1-.1-.1-.2-.1-.3 0-.1.1-.3.3-.5.2-.2.3-.4.5-.7.1.2.3.5.5.7.2.2.3.4.3.5 0 .3-.1.4-.5.4zm1.6-1.7c-.7 0-1.1-.4-1.1-1.2 0-.8.4-1.2 1.1-1.2.4 0 .6.1.8.3.2.2.3.5.3.8 0 .9-.4 1.3-1.1 1.3z"
+      />
+      <path
+        className="prefix__st2"
+        d="M9.1 450.3l2.4-5.7-5.3 2.7 2.2-5.1-3.7 3.7v-5.1l-4.5 9.5 4.5 9.4v-5.1l3.7 3.7-2.2-5.1 5.3 2.8z"
+      />
+      <path
+        className="prefix__st2"
+        d="M11.7 453.4c-2.6 0-8.5-.7-11.1-2.5l-.9-.6.9-.6c2.6-1.8 8.5-2.5 11.1-2.5h7.1v6.3h-7.1z"
+      />
+      <path
+        className="prefix__st1"
+        d="M18.1 447.8v4.8h-6.4c-2.6 0-8.3-.8-10.7-2.4 2.4-1.7 8.1-2.4 10.7-2.4h6.4m1.5-1.5h-7.9c-2.7 0-8.8.8-11.5 2.7l-1.8 1.2 1.8 1.2c2.7 1.9 8.9 2.7 11.5 2.7h7.9v-7.8z"
+      />
+      <path
+        className="prefix__st2"
+        d="M9.3 530.5l-8.4 1.1 5.7-3.8-6.2-4h6.4L.2 512.6l8.5 5.5-1.4-4.3 3.3 2.1 2.3-2.8 2.7 3.7 2.7-3.4-1.6 15.4z"
+      />
+      <path
+        className="prefix__st4"
+        d="M7 533.1l-.1-.2c-.3-.3-.6-.7-.8-1l-.4-.5.8-.3c.2-.1.3-.1.5-.2 1.3-.3 2.5-.8 3.9-1.4l.1-.1c0-.1.1-.3.1-.4-.4-.6-.7-1.4-.9-2.3-.1-.1-.1-.1-.2-.1-.1-.1-.2-.2-.3-.4-.3-.6-.4-1.2-.5-1.8v-.3c0-.5.1-.8.5-1 0-.2-.1-.5-.1-.7-.1-1.2.3-2.3 1.2-3.3.6-.7 1.5-1.6 2.9-1.9.4-.1.7-.1 1-.1 1.1 0 2.1.4 3 1.2.3.3.4.4.7.6.7.4 1 1.1 1.1 1.7.2.9.1 1.8 0 2.5 0 .1 0 .2-.1.3.2.2.2.5.3.6 0 .8-.2 1.7-.7 2.5-.2.3-.4.4-.5.5l-.3.9-.3.6c-.1.1-.1.2-.2.3v.2c.1.4.2.5.6.7.7.3 1.4.5 2.1.7l.3.1v2.5H7z"
+      />
+      <path
+        className="prefix__st1"
+        d="M14.6 517.6c1 0 1.9.3 2.6 1.1.3.3.5.5.8.7.5.3.7.8.8 1.3.2.8.1 1.6 0 2.4v.3c0 .2-.1.3.1.5.1.1.1.2.1.3 0 .8-.2 1.6-.6 2.3-.1.1-.2.3-.3.3H18c-.1.4-.3.8-.4 1.3-.1.3-.3.5-.4.8 0 .1-.1.2-.1.3v.2c.1.5.4.8.9 1 .7.3 1.4.5 2.2.7v1.6h-13c-.3-.3-.5-.6-.8-1 .2-.1.4-.2.6-.2 1.4-.3 2.7-.8 4-1.4.1-.1.3-.2.3-.3.1-.2.1-.5.2-.7 0-.1 0-.2-.1-.2-.4-.6-.7-1.4-.8-2.1 0-.1-.1-.2-.2-.2-.1-.1-.3-.3-.3-.4-.3-.5-.4-1.1-.5-1.7v-.2c0-.4.1-.6.5-.7-.1-.4-.1-.7-.2-1.1 0-1.1.3-2.1 1-2.9.7-.8 1.5-1.5 2.6-1.7.5-.3.8-.3 1.1-.3m0-1v1-1c-.4 0-.8 0-1.1.1-1.5.3-2.6 1.3-3.2 2-.9 1-1.3 2.3-1.3 3.6 0 .2 0 .3.1.5-.3.3-.4.7-.4 1.2v.3c.1.7.3 1.4.6 2 .1.2.3.4.4.5l.1.1c.2.8.4 1.5.8 2.1v.1c-1.3.6-2.5 1-3.6 1.3-.2 0-.4.1-.5.2-.1 0-.1 0-.2.1l-1.3.5.8 1.1c.3.4.6.7.9 1.1l.3.3h14.3v-3.3l-.7-.2c-.7-.2-1.4-.5-2.1-.7-.2-.1-.2-.1-.2-.3l.1-.1.3-.6c.1-.3.2-.5.3-.8.2-.1.4-.3.6-.6.5-.9.8-1.9.7-2.8 0-.2 0-.5-.2-.8v-.1c.1-.8.2-1.8 0-2.8-.1-.6-.4-1.5-1.4-2-.2-.1-.3-.2-.5-.4-1.2-1.2-2.3-1.6-3.6-1.6zM148.3 457.3c-.9-.3-4.1-1.4-5-1.7-.7-.2-1-.7-1.1-1.3 0-.1-.1-.2-.1-.3 0-.1 0-.3.1-.4.2-.3.4-.7.5-1 .2-.5.3-1.1.5-1.6.3.1.5-.1.6-.3.5-.9.8-1.8.8-2.9 0-.1-.1-.3-.2-.4-.2-.2-.2-.4-.1-.6 0-.1 0-.2.1-.4.2-1 .2-2 0-3-.1-.7-.4-1.4-1.1-1.7-.4-.2-.7-.5-1-.8-1.3-1.3-2.8-1.6-4.5-1.3-1.4.3-2.4 1.1-3.3 2.2-.9 1.1-1.4 2.3-1.3 3.7 0 .4.1.9.2 1.3-.5.1-.6.3-.7.8v.2c.1.7.3 1.5.6 2.1.1.2.3.4.4.6.1.1.2.2.2.3.2 1 .5 1.9 1.1 2.7.1.1.1.2.1.3l-.3.9c-.1.2-.2.3-.4.4-1.6.7-3.3 1.3-5 1.8-.3.1-.5.2-.8.3.3.4.7 1.4 1 1.7H147l1.3-1.6z"
+      />
+      <path
+        className="prefix__st4"
+        d="M139 439.5c-.4 0-.8 0-1.1.1h-.1c-.1 0-.3.1-.4.1 0 0-.1 0-.1.1-.3.1-.4.4-.3.6.1.2.3.3.5.3h.2c.2-.1.4-.1.6-.2.3-.1.7-.1 1-.1.3 0 .5-.2.5-.5-.3-.1-.5-.4-.8-.4zm-4 2c-.1 0-.3.1-.4.2l-.1.1c-.2.3-.3.5-.4.8-.1.3 0 .5.3.7h.2c.2 0 .4-.1.5-.3.2-.4.4-.8.8-1.2l.2-.2c.2-.2.2-.5 0-.7-.8.6-1 .6-1.1.6zm-1.3 4.1c-.4.1-.5.3-.5.6 0 .1 0 .2.1.3v.1c-.1 0-.2 0-.2.1-.1.1-.2.1-.3.2v.5c0 .3.2.5.5.5s.5-.3.5-.5c.4-.2.7-.6.6-1.1 0-.2-.1-.3-.1-.5v-.2c-.1.2-.3 0-.6 0zm.4 4.2c-.1 0-.2 0-.3.1-.2.2-.3.5-.1.7l.1.1c0 .1.1.1.1.2.1.3.1.5.2.7.1.2.3.3.5.3h.2c.3-.1.4-.4.3-.7-.2-.4-.3-.8-.4-1.3-.1-.3-.2-.6-.4-.7.1.7 0 .6-.2.6zm.7 5.3c-.1 0-.2 0-.3.1-.5.2-.9.4-1.4.6-.3.1-.4.4-.3.6.1.2.3.3.5.3h.2c.6-.2 1.2-.5 1.8-.7.1 0 .1-.1.2-.1.2-.1.3-.4.2-.7-.5 0-.7-.1-.9-.1zm-4.8 1.8h-.1c-.1 0-.2 0-.3.1h-.2c-.3.1-.5.2-.8.3.2.2.3.6.5.9H129.4c.1 0 .2 0 .2-.1.1 0 .2-.1.2-.2.1 0 .2 0 .3-.1.3-.1.4-.3.4-.6-.1-.2-.3-.3-.5-.3zm3.4 1.1h-2c-.3 0-.5.2-.5.5s.2.5.5.5h2c.3 0 .5-.2.5-.5 0-.2-.3-.5-.5-.5zm5 0h-2c-.3 0-.5.2-.5.5s.2.5.5.5h2c.3 0 .5-.2.5-.5 0-.2-.3-.5-.5-.5zm5 0h-2c-.3 0-.5.2-.5.5s.2.5.5.5h2c.3 0 .5-.2.5-.5 0-.2-.3-.5-.5-.5zm4-.8c-.2 0-.3.1-.4.2l-.5.7h-.2c-.3 0-.5.2-.5.5s.2.5.5.5h.7l.7-1c.2-.2.1-.5-.1-.7 0-.2-.1-.2-.2-.2zm-3.2-1.3c-.2 0-.4.1-.5.3-.1.3 0 .5.3.6.6.2 1.2.4 1.9.7h.2c.2 0 .4-.1.5-.3.1-.3 0-.5-.3-.6-.6-.2-1.3-.5-1.9-.7h-.2zm-2-1.7l-1 .2 1-.2zm0 0s-.1 0 0 0zm-.1 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0s-.1 0 0 0zm-.1 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0c-.1 0 0 0 0 0zm-.1 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0s0 .1 0 0zm0 .1zm0 0c-.1 0-.1 0 0 0zm-.1 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0zm0 0c-.1 0-.1 0 0 0zm-.1 0c-.2 0-.4.1-.5.1l.5-.1zm-.5.1c-.1 0-.2.1-.2.1s.1 0 .2-.1zm1.2-2.7c-.2 0-.4.1-.5.3 0 .1 0 .1-.1.2s-.2.3-.3.5c-.1.1-.2.3-.2.4-.1.2-.2.5-.2.8 0 .2 0 .4.1.5l1-.3v-.1c0-.1 0-.3.1-.4v-.1c0-.1.1-.2.1-.2 0-.1.1-.2.1-.2v-.1-.1c.1-.3 0-.5-.3-.6.3-.6.2-.6.2-.6zm1.7-4.2c-.3 0-.5.2-.5.5 0 .5-.1 1-.3 1.6-.1.3 0 .5.3.7h.2c.2 0 .4-.1.5-.3.1-.3.3-.7.3-1.1 0-1.2-.2-1.4-.5-1.4zm-.2-4.7h-.1c-.3.1-.4.3-.4.6 0 .1 0 .2.1.2.1.4.1.9.1 1.4 0 .3.2.5.5.5s.5-.2.5-.5v-.5c0-.2 0-.5-.1-.7 0-.1 0-.1-.1-.2-.1-.7-.3-.8-.5-.8zm-3.3-3c-.2 0-.4.1-.5.3-.1.3 0 .5.3.7.4.2.9.5 1.2.8.1.1.2.1.4.1.1 0 .3 0 .3-.1.2-.2.2-.5 0-.7-.5-.5-1-.8-1.5-1-.1-.1-.2-.1-.2-.1z"
+      />
+      <path
+        className="prefix__st0"
+        d="M9.5 567.9l.3-1.7c1.7-.1 3.3-.7 4.6-1.8l4.8 3.8-3.9-4.7c1.1-1.4 1.7-3 1.7-4.7l1.9-.3-1.9-.3c-.1-1.6-.7-3.1-1.8-4.4l4-4.7-4.8 3.8c-1.3-1.1-2.9-1.7-4.5-1.8l-.3-2-.3 2h-.1.1l-.7 4.4c-.3.1-.5.2-.8.4L4.2 553l2.8 3.6c-.2.2-.3.5-.4.8l-6.5 1 1.8.3c0 1.7.6 3.4 1.8 4.8l-3.6 4.6 1-1 3.4-2.8c1.3 1.2 3 1.7 4.7 1.8l.3 1.8zm-.7-3c-1.7 0-3.5-.7-4.8-2-1.1-1.1-1.8-2.6-2-4.1l4.6.7c.1.3.2.5.4.8l-1 1.8 1.7-1c.3.2.5.3.8.4l.5 3.4h-.2zm1.2-.1l.5-3.3c.3-.1.5-.2.8-.4l1.7 1-1-1.7c.2-.2.3-.5.4-.8l3.2-.5c-.2 1.4-.8 2.8-1.9 3.8-1.1 1-2.4 1.7-3.7 1.9zm5.6-6.7l-3.2-.5c-.1-.3-.2-.5-.4-.8l1-1.8-1.8 1c-.2-.2-.5-.3-.7-.4l-.7-4.4c1.4.2 2.7.9 3.8 1.9 1.4 1.5 2 3.2 2 5zM.2 592.4s7.6 3.3 14.2 5.9l1-2.3 1.1.4-1.6 2.9 4.3 2.4-.5 1.1-4.2-2.2-1.4 2.8-1.3-.4 1-1.9S3.6 596 .2 592.4zM3.2 591.4s4-5 11-5c0 0-6.4.9-9 6l-2-1zM7.2 592.8s2.2-2.7 6-2.7c0 0-3.5.5-4.9 3.3l-1.1-.6zM10.2 594.3s1.5-1.9 4.2-1.9c0 0-2.4.4-3.4 2.3l-.8-.4z"
+      />
+      <path
+        className="prefix__st4"
+        d="M17.2 629.2v.6c0 .1 0 .2-.1.3-.3 1.5-1.8 2.5-3.3 2.2-.3 0-.6-.1-.9-.2-.9 1.6-3.1 1.8-4.4.6l-.1.1c-.5.4-1 .8-1.6.9-.3.1-.5.1-.8.1h-.3-.1c-1.1-.1-2-.6-2.7-1.4 0 0-.1-.1-.2-.1-1.1.2-2.1-.5-2.5-1.6 0-.1-.1-.2-.1-.4v-.6-.1c.1-.9.8-1.6 1.7-1.8.2 0 .3-.1.5-.1.1-.9.6-1.6 1.4-2 .8-.5 1.6-.5 2.4-.2.7-2.1 2.7-3.4 4.9-3.1 2 .3 3.6 1.9 3.7 4.1h.1c1.1.3 1.7 1 2 2.1.4.3.4.5.4.6zM1.7 633.8l-1.5 4.8 2.6-3.9zM5.6 635.2l-.4 4.2 2.1-4.2zM10.9 635l.9 4.2.5-4.5zM14.7 634l3.5 5.4-2.2-5.9z"
+      />
+      <path
+        className="prefix__st0"
+        d="M32.1-31.5l1 4.2 1-4.2h1.4v5.7h-1.1v-1.7l.1-2.2-1.1 3.9h-.7l-1.1-3.8.1 2.2v1.7h-1.1v-5.7h1.5zM38.1-25.7c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.3-.2-.4-.2zM41.2-25.8h-1.1v-6.1h1.1v6.1zM43.7-25.7c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.8zm-.1-3.5c-.2 0-.3.1-.4.2s-.2.4-.2.7h1v-.2c0-.2 0-.4-.1-.5s-.2-.2-.3-.2zM47.3-25.7c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.2-.2-.4-.2zM256.1-27.6c0 .6-.1 1.1-.4 1.4s-.7.5-1.3.5-1.1-.2-1.4-.5-.5-.9-.5-1.5v-1.7c0-.7.2-1.2.5-1.5s.8-.5 1.4-.5c.6 0 1.1.2 1.4.5s.5.8.5 1.4h-1.1c0-.4 0-.6-.2-.8s-.3-.2-.6-.2c-.2 0-.4.1-.6.3-.1.2-.2.5-.2.9v1.7c0 .4.1.7.2.9.1.2.3.3.6.3s.5-.1.6-.2.2-.4.1-.8h1zM258.8-25.8c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4s-.3.2-.5.2c-.3 0-.6-.1-.8-.3s-.3-.5-.3-.9.1-.7.4-1 .7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4s.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1s.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3s.2.2.3.2zM262.3-26.9c0-.1 0-.2-.1-.3s-.3-.2-.5-.3c-.4-.2-.7-.3-1-.5s-.3-.5-.3-.8c0-.3.1-.6.4-.9s.6-.4 1.1-.4c.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.3c0 .1 0 .2.1.3s.3.2.5.3c.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9s-.7.3-1.1.3c-.5 0-.9-.1-1.2-.4s-.4-.6-.4-1h1c0 .2.1.4.2.5s.2.1.4.1c.1 0 .3 0 .3-.1s.1-.1.1-.2zM265.2-31.1v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3s-.3-.6-.3-1v-2.1h-.5v-.9h.5v-1.1h1zM267.6-31h-1.1v-.8h1.1v.8zm0 5.2h-1.1V-30h1.1v4.2zM269.4-30v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1V-30h1.1zM272.1-28.1c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1s.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3s-.8.5-1.3.5c-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2s.3.1.5.1.4-.1.5-.2.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3s-.3.1-.4.1c-.4 0-.8-.2-1-.5s-.4-.8-.4-1.4v-.5zm1.1.5c0 .3 0 .5.1.7s.2.3.4.3c.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5zM281.3-30.6H280v4.8h-1.1v-4.8h-1.3v-.9h3.7v.9zM282.9-31h-1.1v-.8h1.1v.8zm0 5.2h-1.1V-30h1.1v4.2zM284.8-30v.5c.1-.2.3-.4.4-.5s.4-.2.6-.2c.2 0 .4.1.6.2s.3.3.4.5c.1-.2.2-.4.4-.5s.4-.2.6-.2c.3 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1s-.2.1-.2.3V-25.9h-1.1v-2.6c0-.3 0-.5-.1-.7-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1l-.2.2v3.1h-1.1v-4h1zM291.2-25.7c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm0-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.3-.2-.4-.2zM253.7-2.8v2.3h-1.1v-5.7h1.9c.6 0 1 .1 1.3.4s.5.7.5 1.2c0 .3-.1.6-.2.8s-.3.4-.6.5c.3.1.5.3.6.5s.2.5.2.9v.4c0 .2 0 .3.1.5s.1.3.2.4v.1h-1.1c-.1-.1-.1-.2-.2-.4s0-.4 0-.6v-.4c0-.3-.1-.5-.2-.7s-.3-.2-.5-.2h-.9zm0-.9h.7c.2 0 .4-.1.5-.2s.2-.3.2-.6-.1-.5-.2-.6-.3-.2-.5-.2h-.7v1.6zM258.2-5.8h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM260.3-5.9v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3s-.3-.6-.3-1V-4h-.5v-.8h.5v-1.1h1zM263.7-1.1c-.1.2-.3.3-.4.4s-.3.1-.6.1c-.4 0-.7-.1-.9-.4s-.3-.7-.3-1.3v-2.6h1.1v2.6c0 .3 0 .5.1.7.1.1.2.2.3.2.1 0 .2 0 .3-.1.1 0 .2-.1.2-.2v-3.2h1.1v4.2h-1l.1-.4zM267.5-.6c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4s-.3.2-.5.2c-.3 0-.6-.1-.8-.3s-.3-.5-.3-.9.1-.7.4-1 .7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4s.4.6.4 1.1V-1c0 .2.1.4.1.5h-1zm-.8-.7c.1 0 .2 0 .3-.1s.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3s.2.2.3.2zM270.2-.6h-1.1v-6.1h1.1v6.1zM256.1 26.9c0 .6-.1 1.1-.4 1.4s-.7.5-1.3.5-1.1-.2-1.4-.5-.5-.9-.5-1.5v-1.7c0-.7.2-1.2.5-1.5s.8-.5 1.4-.5c.6 0 1.1.2 1.4.5s.5.8.5 1.4h-1.1c0-.4 0-.6-.2-.8s-.3-.2-.6-.2c-.2 0-.4.1-.6.3-.1.2-.2.5-.2.9v1.7c0 .4.1.7.2.9.1.2.3.3.6.3s.5-.1.6-.2.2-.4.1-.8h1zM256.6 26.4c0-.6.2-1 .5-1.4s.7-.5 1.3-.5 1 .2 1.3.5.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4s-.7.5-1.3.5c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8s.2.3.5.3c.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8s-.2-.3-.5-.3-.4.1-.5.3-.1.4-.1.8v.5zM261.7 24.5v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM266.1 28c.2 0 .3-.1.3-.2s.1-.3.1-.5h1c0 .4-.1.8-.4 1.1s-.6.4-1.1.4c-.5 0-1-.2-1.3-.5s-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4s.7-.5 1.3-.5c.5 0 .8.1 1.1.4s.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3s-.1.4-.1.8v.5c0 .3 0 .6.1.8s.2.3.5.3zM269.7 28.9c-.5 0-1-.2-1.3-.5s-.4-.9-.4-1.4v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.6H269c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3s-.5.2-.8.2zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.2-.2-.4-.2zM272.8 24.5v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM277 23.5v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3s-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM280.2 25.6h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5s.3-.2.4-.2H280.2v1.1zM282.8 28.8c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4s-.3.2-.5.2c-.3 0-.6-.1-.8-.3s-.3-.5-.3-.9.1-.7.4-1 .7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4s.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1s.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3s.1.2.3.2zM285.7 23.5v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3s-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM288.1 23.5H287v-.8h1.1v.8zm0 5.3H287v-4.2h1.1v4.2zM288.7 26.4c0-.6.2-1 .5-1.4s.7-.5 1.3-.5 1 .2 1.3.5.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4s-.7.5-1.3.5c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8s.2.3.5.3c.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8s-.2-.3-.5-.3-.4.1-.5.3-.1.4-.1.8v.5zM293.8 24.5v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM31.8 7.5v2.3h-1.1V4.1h1.9c.6 0 1 .1 1.3.4s.5.7.5 1.2c0 .3-.1.6-.2.8s-.4.4-.6.5c.3.1.5.3.6.5s.2.5.2.9v.4c0 .2 0 .3.1.5s.1.3.2.4v.1h-1.1c-.1-.1-.1-.2-.2-.4s0-.4 0-.6v-.4c0-.3-.1-.5-.2-.7s-.3-.2-.5-.2h-.9zm0-.9h.7c.2 0 .4-.1.5-.2s.2-.3.2-.6-.1-.5-.2-.6-.2-.2-.4-.2h-.7v1.6zM37.2 9.8c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4s-.3.2-.5.2c-.3 0-.6-.1-.8-.3s-.3-.6-.3-1 .1-.7.4-1 .7-.3 1.2-.3h.4v-.4c0-.2 0-.4-.1-.5s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4s.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1s.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2-.1.1-.1.3-.1.4 0 .1 0 .3.1.3s.2.2.3.2zM39.9 5.5v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1V7.1c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1 0 .1-.1.1-.1.2v3.1h-1.1V5.5h1zM42.6 7.4c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1s.3.2.4.4l.1-.4h1v4.1c0 .6-.2 1-.5 1.3s-.8.5-1.3.5c-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2s.3.1.5.1.4-.1.5-.2.2-.4.2-.6v-.3c-.1.1-.2.2-.4.3s-.3.1-.5.1c-.4 0-.8-.2-1-.5s-.4-.8-.4-1.3v-.6zm1.1.6c0 .3 0 .5.1.7s.3.3.5.3c.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8V8zM48.3 9.8c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4V8h-2.1c0 .3.1.5.2.7s.5.3.7.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3s-.5.1-.8.1zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.5-.2.7h1v-.1c0-.2 0-.4-.1-.5s-.2-.3-.3-.3zM50.1 7.7c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3V3.7h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4s-.3.1-.5.1c-.4 0-.8-.2-1-.6s-.3-.8-.3-1.5zm1.2 0c0 .4 0 .7.1.9s.2.4.4.4c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.6-.1 1zM32.1 80l1 4.2 1-4.2h1.4v5.7h-1.1V84l.1-2.2-1.1 3.9h-.7l-1.1-3.8.1 2.2v1.7h-1.1V80h1.5zM38.1 85.7c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1V83c0-.2 0-.4-.1-.5s-.3-.3-.4-.3zM41.2 85.6h-1.1v-6.1h1.1v6.1zM43.7 85.7c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.8zm-.1-3.5c-.2 0-.3.1-.4.2s-.2.5-.2.7h1V83c0-.2 0-.4-.1-.5s-.2-.3-.3-.3zM47.3 85.7c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1V83c0-.2 0-.4-.1-.5s-.2-.3-.4-.3zM31.8 118.9v2.3h-1.1v-5.7h1.9c.6 0 1 .1 1.3.4s.5.7.5 1.2c0 .3-.1.6-.2.8s-.3.4-.6.5c.3.1.5.3.6.5s.2.5.2.9v.4c0 .2 0 .3.1.5s.1.3.2.4v.1h-1.1c-.1-.1-.1-.2-.2-.4s0-.4 0-.6v-.4c0-.3-.1-.5-.2-.7s-.3-.2-.5-.2h-.9zm0-.8h.7c.2 0 .4-.1.5-.2s.2-.3.2-.6-.1-.5-.2-.6-.3-.2-.5-.2h-.7v1.6zM37.2 121.2c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4s-.3.2-.5.2c-.3 0-.6-.1-.8-.3s-.3-.6-.3-1 .1-.7.4-1 .7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5s-.2-.2-.3-.2c-.1 0-.2 0-.3.1s-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4s.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1s.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3s.2.2.3.2zM39.9 117v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1V117h1.1zM42.6 118.9c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1s.3.2.4.4l.1-.4h1v4.1c0 .6-.2 1-.5 1.3s-.8.5-1.3.5c-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2s.3.1.5.1.4-.1.5-.2.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3s-.3.1-.4.1c-.4 0-.8-.2-1-.5s-.4-.8-.4-1.4v-.6zm1.1.5c0 .3 0 .5.1.7s.2.3.4.3c.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5zM48.3 121.3c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.3-.2-.4-.2zM50.1 119.1c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4s-.3.1-.5.1c-.4 0-.8-.2-1-.6s-.3-.8-.3-1.5zm1.2.1c0 .4 0 .7.1.9s.2.3.4.3c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1zM34.1 37.9h-1.3v4.8h-1.1v-4.8h-1.3V37h3.7v.9zM35.6 39c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4s.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2h-1.1v-6.1h1.1V39zM40.4 39.5H40c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5s.3-.2.4-.2H40.4v1.1zM40.8 40.4c0-.6.2-1 .5-1.4s.7-.5 1.3-.5 1 .2 1.3.5.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4s-.7.5-1.3.5c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8s.2.3.5.3c.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8s-.2-.3-.5-.3-.4.1-.5.3-.1.4-.1.8v.5zM47.9 40.9l.4-2.4h1l-.9 4.2h-.9l-.6-2.3-.6 2.3h-.9l-.9-4.2h1l.4 2.4.6-2.4h.7l.7 2.4zM50.8 38.5v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM163.7 196.5v-5.7h1.7c.6 0 1 .1 1.4.4s.5.6.5 1.2c0 .3-.1.5-.2.7s-.3.4-.5.5c.3.1.5.2.7.5s.2.5.2.8c0 .5-.2 1-.5 1.2s-.8.4-1.3.4h-2zm1.2-3.3h.6c.2 0 .4-.1.5-.2s.2-.3.2-.5c0-.3-.1-.5-.2-.6s-.3-.2-.6-.2h-.6v1.5zm0 .8v1.6h.8c.2 0 .4-.1.5-.2s.2-.3.2-.6 0-.5-.1-.6-.3-.2-.5-.2h-.9zM169.3 196.5h-1.1v-6.1h1.1v6.1zM171.2 191.3h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM173 192.3v.6c.1-.2.3-.4.4-.5s.4-.2.6-.2c.4 0 .6.1.8.4s.3.7.3 1.3v2.6H174v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1v-4.2h1zM175.7 194.4c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4s-.3.1-.5.1c-.4 0-.8-.2-1-.6s-.3-.7-.3-1.5zm1.1.1c0 .4 0 .7.1.9s.2.3.4.3c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4 0 .2-.1.5-.1 1zM181.4 196.6c-.5 0-1-.2-1.3-.5s-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4s.7-.5 1.2-.5.9.2 1.1.5.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5s-.2-.2-.4-.2zM183.3 194.4c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4s-.3.1-.5.1c-.4 0-.8-.2-1-.6s-.3-.7-.3-1.5zm1.1.1c0 .4 0 .7.1.9s.2.3.4.3c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1zM167.5 231.4c-.2.2-.4.5-.7.6-.3.2-.7.3-1.2.3-.6 0-1.1-.2-1.5-.5-.4-.4-.6-.9-.6-1.5v-1.7c0-.7.2-1.2.5-1.5s.8-.5 1.4-.5c.6 0 1.1.2 1.4.5.3.3.5.8.5 1.3h-1c0-.3-.1-.6-.2-.7s-.3-.2-.6-.2-.5.1-.6.3c-.2.2-.2.5-.2.9v1.7c0 .4.1.7.2.9s.4.3.7.3c.2 0 .4 0 .5-.1.1-.1.2-.1.3-.3v-1h-.8v-.8h1.9v2zM170.3 229h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1V228h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H170.3v1.1zM172.9 232.2c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM177.8 230.4c0 .6-.1 1-.4 1.4-.2.3-.6.5-1 .5-.2 0-.3 0-.5-.1-.1-.1-.3-.2-.3-.3v2h-1.1V228h1v.4c.1-.2.2-.3.4-.4s.3-.1.5-.1c.4 0 .8.2 1 .5.2.4.4.8.4 1.4v.6zm-1.1-.5c0-.3 0-.6-.1-.8s-.2-.3-.4-.3c-.1 0-.2 0-.3.1s-.2.1-.2.2v2c.1.1.1.2.2.2s.2.1.3.1c.2 0 .4-.1.4-.3s.1-.4.1-.7v-.5zM181.7 230.4c0 .6-.1 1-.4 1.4-.2.3-.6.5-1 .5-.2 0-.3 0-.5-.1-.1-.1-.3-.2-.3-.3v2h-1.1V228h1v.4c.1-.2.2-.3.4-.4s.3-.1.5-.1c.4 0 .8.2 1 .5.2.4.4.8.4 1.4v.6zm-1.1-.5c0-.3 0-.6-.1-.8s-.2-.3-.4-.3c-.1 0-.2 0-.3.1s-.2.1-.2.2v2c.1.1.1.2.2.2s.2.1.3.1c.2 0 .4-.1.4-.3s.1-.4.1-.7v-.5zM183.5 232.2h-1.1v-6.1h1.1v6.1zM185.9 232.3c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.3-.2-.4-.2zM187.7 230.1c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.1-.2-.3-.8-.3-1.5zm1.2.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1zM164.9 270.8v2h-1.1v-5.7h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3c-.3.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM168 270.4c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.6c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM173.2 267.6h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM175.8 271.7c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1 0 .1-.1.1-.2zM177.3 270.4c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.6c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM182.3 268.6v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM186.8 272.9c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H186c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.1-.1-.4 0-.7 0zm0-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.2-.1-.3-.2-.4-.2zM188.7 270.7c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1zM163.7 304.8v-5.7h1.7c.6 0 1.1.2 1.4.7s.6 1 .6 1.7v1c0 .7-.2 1.3-.6 1.7-.4.4-.9.7-1.4.7h-1.7zm1.2-4.8v3.9h.5c.3 0 .5-.1.7-.4s.3-.6.3-1.1v-1c0-.4-.1-.8-.3-1.1s-.4-.4-.7-.4h-.5zM169.8 304.8c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H169c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM173.9 304.8c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM175.8 304.8v-3.4h-.5v-.8h.5v-.5c0-.5.1-.8.4-1.1.2-.3.6-.4 1-.4h.3c.1 0 .2 0 .3.1l-.1.8h-.4c-.1 0-.2.1-.3.2-.1.1-.1.2-.1.4v.5h.7v.8h-.7v3.4h-1.1zM179.6 304.8c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H179c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.9zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM182.6 300.5v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM187.1 304.8c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm0-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.2-.1-.3-.2-.4-.2zM189 302.7c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1 0c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4 0 .2-.1.6-.1 1zM164.9 342.6h-1.1v-5.7h1.1v5.7zM166.8 338.4v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1V340c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM171.2 341.8c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6s-.2-.2-.3-.2c-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM175.3 342.6c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM180.2 340.8c0 .6-.1 1-.4 1.4-.2.3-.6.5-1 .5-.2 0-.3 0-.5-.1-.1-.1-.3-.2-.3-.3v2h-1.1v-5.9h1v.4c.1-.2.2-.3.4-.4s.3-.1.5-.1c.4 0 .8.2 1 .5.2.4.4.8.4 1.4v.6zm-1.1-.5c0-.3 0-.6-.1-.8s-.2-.3-.4-.3c-.1 0-.2 0-.3.1s-.2.1-.2.2v2c.1.1.1.2.2.2s.2.1.3.1c.2 0 .4-.1.4-.3s.1-.4.1-.7v-.5zM182.8 342.6c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM186 341.8c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6s-.2-.2-.3-.2c-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM189.2 337.4h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM191.3 337.4v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM194.5 342.6c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM197.5 337.4v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM200.3 342.7c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.1c0-.2 0-.4-.1-.5-.1-.2-.2-.3-.4-.3zM202.2 340.5c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.2-.3-.7-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1z"
+      />
+      <g>
+        <path
+          className="prefix__st0"
+          d="M164.9 381.8v2h-1.1v-5.7h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3-.8.5-1.3.5h-.9zm0-.8h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM170.2 380.7h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H170.2v1.1zM170.5 381.5c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM175.6 379.7v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM180.1 384c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.1-.1-.4 0-.7 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.2-.2-.2-.4-.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M167.3 413.3c0 .6-.1 1.1-.4 1.4-.3.3-.7.5-1.3.5s-1.1-.2-1.4-.5c-.4-.4-.5-.9-.5-1.5v-1.7c0-.7.2-1.2.5-1.5s.8-.5 1.4-.5c.6 0 1.1.2 1.4.5.3.3.5.8.5 1.4h-1.1c0-.4 0-.6-.2-.8-.1-.2-.3-.2-.6-.2-.2 0-.4.1-.6.3-.1.2-.2.5-.2.9v1.7c0 .4.1.7.2.9s.3.3.6.3.5-.1.6-.2c.1-.2.2-.4.1-.8h1zM169 411.4c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5H170v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2h-1.1V409h1.1v2.4zM173.9 415.1c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM177.5 411.9h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H177.5v1.1zM179.1 410.9v.5c.1-.2.3-.3.4-.5.2-.1.4-.2.6-.2.2 0 .4.1.6.2s.3.3.4.5c.1-.2.2-.4.4-.5.2-.1.4-.2.6-.2.3 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1s-.2.1-.2.3V415h-1.1v-2.6c0-.3 0-.5-.1-.7-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1l-.2.2v3.1h-1.1v-4.2h1zM185.6 415.2c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H185c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.9zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM187.5 413.1c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3V409h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.2-.3-.7-.3-1.4zm1.1 0c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.6-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M164.9 453.1h-1.1v-5.7h1.1v5.7zM166.8 448.9v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM171 451.5l.1.3.1-.3.5-2.6h1.2l-1.2 4.2h-1.1l-1.2-4.2h1.2l.4 2.6zM174.4 447.9h-1.1v-.9h1.1v.9zm0 5.2h-1.1v-4.2h1.1v4.2zM177 452c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1H177c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1 0 .1.1 0 .1-.2zM179.8 447.9h-1.1v-.9h1.1v.9zm0 5.2h-1.1v-4.2h1.1v4.2zM183.8 451.4c0 .6-.1 1-.4 1.4-.2.3-.6.5-1 .5-.2 0-.4 0-.5-.1-.1-.1-.3-.2-.4-.4l-.1.5h-1V447h1.1v2.2l.3-.3c.1-.1.3-.1.5-.1.5 0 .8.2 1 .5.2.4.4.8.4 1.4v.7zm-1.1-.6c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3-.1 0-.2 0-.3.1s-.2.1-.2.3v2c.1.1.1.2.2.2s.2.1.3.1c.2 0 .4-.1.5-.2.1-.2.1-.4.1-.7v-.7zM185.6 453.1h-1.1V447h1.1v6.1zM188 453.2c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M164.9 499.6v2h-1.1V496h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3c-.3.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM169.8 501.7c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H169c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.1c0-.2 0-.4-.1-.5-.1-.2-.2-.3-.4-.3zM173.1 496.4v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM176.3 498.4h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H176.3v1.1zM178.1 496.4H177v-.8h1.1v.8zm0 5.2H177v-4.2h1.1v4.2zM179.1 501.6v-3.4h-.5v-.8h.5v-.3c0-.5.1-1 .4-1.2s.7-.4 1.2-.4c.2 0 .4 0 .5.1s.4.1.6.2l-.2.9c-.2-.1-.3-.1-.5-.1h-.5c-.2 0-.4.1-.5.2-.1.1-.2.3-.2.5v.3h.7v.8h-.7v3.4h-.8zm3.3 0h-1.1v-4.2h1.1v4.2zM184.8 501.7c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H184c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.1c0-.2 0-.4-.1-.5-.1-.2-.2-.3-.4-.3zM186.7 499.5c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.2-.3-.7-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M261.6 365.6h-1.9v1.6h2.2v.9h-3.4v-5.7h3.4v.9h-2.2v1.4h1.9v.9zM263.9 365.2l.5-1.3h1.2l-1 2.1 1.1 2.1h-1.2l-.5-1.4-.5 1.4h-1.2l1.1-2.1-1-2.1h1.2l.3 1.3zM267.1 364.4c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2H266V362h1.1v2.4zM272 368.1c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.1.2.3.2zM275.8 367.6c-.1.2-.3.3-.4.4s-.3.1-.6.1c-.4 0-.7-.1-.9-.4s-.3-.7-.3-1.3v-2.6h1.1v2.6c0 .3 0 .5.1.7s.2.2.3.2c.1 0 .2 0 .3-.1s.2-.1.2-.2v-3.2h1.1v4.2h-1l.1-.4zM279.3 367c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1.1.1 0 .1-.2zM282.3 362.9v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5V363h1zM285.1 368.2c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm0-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.2-.1-.3-.2-.4-.2zM287 366c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3V362h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.2-.3-.7-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4 0 .2-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M259.7 281.6v2h-1.1v-5.7h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3c-.3.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM265.1 283.6c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4H263c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM268.7 280.4h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H268.7v1.1zM271.3 283.6c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM274.1 283.6H273v-6.1h1.1v6.1zM276.3 281.9l.6-2.5h1.2l-1.4 4.9c-.1.3-.2.6-.4.8-.2.2-.5.3-.8.3h-.2s-.2 0-.3-.1l.1-.8h.2c.2 0 .3 0 .4-.1.1-.1.1-.2.2-.3l.1-.3-1.2-4.3h1.2l.3 2.4zM279.6 282.7h1.7v.9h-2.9v-.6l1.6-2.7h-1.6v-.9h2.9v.6l-1.7 2.7zM283.5 283.7c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.1c0-.2 0-.4-.1-.5-.1-.2-.2-.3-.4-.3zM285.4 281.5c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.2-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M261.7 245.1h-1.9v2.4h-1.1v-5.7h3.4v.9h-2.3v1.6h1.9v.8zM264.4 244.2h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H264.4v1.1zM266.1 242.2H265v-.8h1.1v.8zm0 5.3H265v-4.2h1.1v4.2zM266.8 245.1c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.1.6c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2s-.2-.1-.3-.1c-.2 0-.4.1-.4.3s-.1.5-.1.8v.5zM271.9 243.7c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1V245c0-.3 0-.6-.1-.7s-.2-.2-.4-.2c-.1 0-.2 0-.3.1l-.2.2v3.2h-1.1v-6.1h1.1v2.2zM276 242.2v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1V244h-.5v-.8h.5v-1.1h1zM278.9 247.5c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.2-.1-.3-.2-.4-.2zM281.9 243.2v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1zM286.4 247.5c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM288.3 245.4c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1 0c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.6-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M261.1 325c0-.2-.1-.4-.2-.5s-.3-.3-.6-.4c-.6-.2-1-.4-1.3-.7s-.4-.6-.4-1.1c0-.5.2-.8.5-1.1s.8-.4 1.3-.4 1 .2 1.3.5c.3.3.5.7.5 1.2h-1.1c0-.3-.1-.5-.2-.6-.1-.2-.3-.2-.6-.2-.2 0-.4.1-.5.2-.1.1-.2.3-.2.5s.1.3.2.5.4.3.7.4c.5.2.9.4 1.2.7.3.3.4.7.4 1.1 0 .5-.2.9-.5 1.2-.3.3-.8.4-1.3.4s-1-.2-1.4-.5-.6-.8-.6-1.4h1.1c0 .4.1.6.2.8.1.2.4.2.7.2.2 0 .4-.1.5-.2s.3-.4.3-.6zM264.2 321.2v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1V323h-.5v-.8h.5v-1.1h1zM267.6 326c-.1.2-.3.3-.4.4s-.3.1-.6.1c-.4 0-.7-.1-.9-.4s-.3-.7-.3-1.3v-2.6h1.1v2.6c0 .3 0 .5.1.7.1.1.2.2.3.2.1 0 .2 0 .3-.1.1 0 .2-.1.2-.2v-3.2h1.1v4.2h-1l.1-.4zM270.3 322.2v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM274.2 322.2v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1s-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM278.7 326.5c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2zM280.6 324.4c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M167.5 526.9v3.9c0 .6-.2 1.1-.5 1.4-.4.3-.8.5-1.4.5s-1-.2-1.4-.5c-.4-.3-.5-.8-.5-1.4v-3.9h1.1v3.9c0 .3.1.6.2.8s.3.2.6.2.5-.1.6-.2.2-.4.2-.8v-3.9h1.1zM169.3 528.3v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM173.7 531.8c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM175.6 530.2c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM180.6 528.3v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM185 531.8c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM188.9 531.5c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1 0 0 .1-.1.1-.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M38.1 628h-1.3v4.8h-1.1V628h-1.3v-.9h3.7v.9zM39.6 629.1c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2h-1.1v-6.1h1.1v2.3zM44.6 632.3c-.1.2-.3.3-.4.4s-.3.1-.6.1c-.4 0-.7-.1-.9-.4s-.3-.7-.3-1.3v-2.6h1.1v2.6c0 .3 0 .5.1.7s.2.2.3.2c.1 0 .2 0 .3-.1s.2-.1.2-.2v-3.2h1.1v4.2h-1l.1-.4zM47.3 628.6v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM50.1 630.7c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1zM55.7 632.9c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.1-.1-.4 0-.7 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.2-.2-.2-.4-.2zM59.8 629.6h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H59.8v1.1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M37.3 596.4c0-.2-.1-.4-.2-.5s-.3-.3-.6-.4c-.6-.2-1-.4-1.3-.7s-.4-.6-.4-1.1c0-.5.2-.8.5-1.1s.8-.4 1.3-.4 1 .2 1.3.5c.3.3.5.7.5 1.2h-1.1c0-.3-.1-.5-.2-.6-.1-.2-.3-.2-.6-.2-.2 0-.4.1-.5.2-.1.1-.2.3-.2.5s.1.3.2.5.4.3.7.4c.5.2.9.4 1.2.7.3.3.4.7.4 1.1 0 .5-.2.9-.5 1.2-.3.3-.8.4-1.3.4s-1-.2-1.4-.5-.6-.8-.6-1.4h1.1c0 .4.1.6.2.8.1.2.4.2.7.2.2 0 .4-.1.5-.2s.3-.4.3-.6zM40.2 597.9H39v-6.1h1.1v6.1zM43 597.9c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.5c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM46.5 596.8c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1 0 0 .1-.1.1-.2zM49.2 594.1c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2h-1.1v-6.1h1.1v2.3zM53.1 592.6H52v-.8h1.1v.8zm0 5.3H52v-4.2h1.1v4.2zM54.9 593.6v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1zM57.6 595.6c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.2.5c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M35.8 559.7v2.3h-1.1v-5.7h1.9c.6 0 1 .1 1.3.4.3.3.5.7.5 1.2 0 .3-.1.6-.2.8s-.3.4-.6.5c.3.1.5.3.6.5.1.2.2.5.2.9v.4c0 .2 0 .3.1.5 0 .2.1.3.2.4v.1h-1.1c-.1-.1-.1-.2-.2-.4s0-.4 0-.6v-.4c0-.3-.1-.5-.2-.7s-.3-.2-.5-.2h-.9zm0-.9h.7c.2 0 .4-.1.5-.2.1-.1.2-.3.2-.6s-.1-.5-.2-.6c-.1-.2-.3-.2-.5-.2h-.7v1.6zM41.3 561.9c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM42.7 559.8c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2H46v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.1-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4 0 .2-.1.5-.1 1zM47.9 556.7h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM50.8 561.9c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.7c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.1.2.2.3.2zM53.4 557.7v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM57.6 556.6v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1H56v-.8h.5v-1.1h1.1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M35.8 522.4v2h-1.1v-5.7h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3c-.3.3-.8.5-1.3.5h-.9zm0-.8h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM41 523.4c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1H41c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1 0 .1-.1.1-.2zM44 522.8l.6-2.5h1.2l-1.4 4.9c-.1.3-.2.6-.4.8-.2.2-.5.3-.8.3H43s-.2 0-.3-.1l.1-.8h.2c.2 0 .3 0 .4-.1.1-.1.1-.2.2-.3l.1-.3-1.2-4.3h1.2l.3 2.4zM47.7 523.7c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6s-.2-.2-.3-.2c-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM50.8 520.8c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1V522c0-.3 0-.6-.1-.7s-.2-.2-.4-.2c-.1 0-.2 0-.3.1l-.2.2v3.2h-1.1v-6.1h1.1v2.3zM54.8 519.2h-1.1v-.8h1.1v.8zm0 5.3h-1.1v-4.2h1.1v4.2zM57.1 523.7c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6s-.2-.2-.3-.2c-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.2.3.5.3z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M38.7 490.5h-1.1l-1.7-3.6v3.6h-1.1v-5.7h1.1l1.7 3.6v-3.6h1.1v5.7zM41.2 490.5c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.2-.1-.3-.2-.4-.2zM44.7 489.7c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM48 485.2v1.1h.6v.8H48v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1V487h-.5v-.8h.5v-1.1h1zM49 488.1c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.2.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM55.1 487.3h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H55.1v1.1zM56.8 485.2h-1.1v-.8h1.1v.8zm0 5.3h-1.1v-4.2h1.1v4.2zM59.4 489.4c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1 0 .1-.1.1-.2zM62.3 488.7h-.2v1.8H61v-6.1h1.1v3.5h.2l.7-1.6h1.3l-1.1 1.9 1.3 2.3h-1.3l-.9-1.8zM64.6 488.4c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1zM69.6 486.2v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM74.5 490.5c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.7-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM78 489.4c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1H78c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1 0 .1-.1.1-.2zM81.2 489.7c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM85.3 490.5c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2zM88.7 489.4c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1 0 .1-.1.1-.2zM91.9 489.7c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM96 490.5c0-.1-.1-.1-.1-.2s0-.2-.1-.3c-.1.2-.2.3-.4.4-.1.1-.3.2-.5.2-.3 0-.6-.1-.8-.3-.2-.2-.3-.5-.3-.9s.1-.7.4-1c.3-.2.7-.3 1.2-.3h.4v-.3c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-.9s.7-.4 1.1-.4c.4 0 .8.1 1.1.4.3.3.4.6.4 1.1v2.3c0 .2.1.4.1.5h-1zm-.8-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2s-.1.3-.1.4c0 .1 0 .3.1.3.1.2.2.2.3.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M35.8 450.6v2h-1.1V447h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM40.3 447.4h-1.1v-.8h1.1v.8zm0 5.3h-1.1v-4.2h1.1v4.2zM42.8 452.8c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7H42c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.2-.1-.4 0-.7 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.2-.3-.2-.4-.2zM46.8 449.5h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H46.8v1.1zM48.8 451.9c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM52 447.4h-1.1v-.8H52v.8zm0 5.3h-1.1v-4.2H52v4.2zM53.8 448.4v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1V450c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM56.5 450.4c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.1.5c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M34.7 419v-5.7h1.7c.6 0 1 .1 1.4.4.3.3.5.6.5 1.2 0 .3-.1.5-.2.7-.1.2-.3.4-.5.5.3.1.5.2.7.5s.2.5.2.8c0 .5-.2 1-.5 1.2s-.8.4-1.3.4h-2zm1.1-3.3h.6c.2 0 .4-.1.5-.2.1-.1.2-.3.2-.5 0-.3-.1-.5-.2-.6s-.3-.2-.6-.2h-.6v1.5zm0 .8v1.6h.8c.2 0 .4-.1.5-.2.1-.1.2-.3.2-.6s0-.5-.1-.6c-.1-.1-.3-.2-.5-.2h-.9zM40.3 419h-1.1v-6.1h1.1v6.1zM43.2 418.5c-.1.2-.3.3-.4.4s-.3.1-.6.1c-.4 0-.7-.1-.9-.4s-.3-.7-.3-1.3v-2.6h1.1v2.6c0 .3 0 .5.1.7s.2.2.3.2c.1 0 .2 0 .3-.1s.2-.1.2-.2v-3.2h1.1v4.2h-1l.1-.4zM46.1 413.8H45v-.8h1.1v.8zm0 5.2H45v-4.2h1.1v4.2zM47.9 414.8v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM50.6 416.7c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.1.5c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M35.8 377.1h2.1v.9h-3.2v-5.7h1.1v4.8zM39.6 372.8h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM40.2 375.7c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.1.5c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5zM45.3 374.3c.1-.2.2-.3.4-.4s.3-.2.5-.2c.4 0 .7.1.9.4.2.3.3.8.3 1.4v2.5h-1.1v-2.5c0-.3 0-.6-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1 0-.1.1-.2.2v3.2h-1.1V372h1.1v2.3zM49.4 372.7v1.1h.6v.8h-.6v2.1c0 .2 0 .3.1.4s.1.1.2.1h.4l.1.8c-.1 0-.2.1-.3.1h-.4c-.4 0-.6-.1-.8-.3-.2-.2-.3-.6-.3-1v-2.1h-.5v-.8h.5v-1.1h1zM51.7 373.8v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM55.7 372.8h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM57.5 373.8v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1.1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1.1zM60.2 375.7c0-.6.1-1.1.4-1.4s.6-.6 1-.6c.2 0 .4 0 .5.1.1.1.3.2.4.4l.1-.5h1v4.1c0 .6-.2 1-.5 1.3-.3.3-.8.5-1.3.5-.2 0-.4 0-.6-.1s-.4-.1-.6-.2l.2-.9c.1.1.3.1.5.2.2 0 .3.1.5.1s.4-.1.5-.2c.1-.1.2-.4.2-.6v-.2c-.1.1-.2.2-.4.3-.1.1-.3.1-.4.1-.4 0-.8-.2-1-.5-.2-.3-.4-.8-.4-1.4v-.5zm1.1.5c0 .3 0 .5.1.7.1.2.2.3.4.3.1 0 .2 0 .3-.1s.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.2-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.3s-.1.5-.1.8v.5z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M37.8 340.3h-1.9v2.4h-1.1V337h3.4v.9h-2.3v1.6h1.9v.8zM38.4 340.3c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM44.4 339.4H44c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H44.4v1.1zM46.5 341.8c.2 0 .3-.1.3-.2.1-.1.1-.3.1-.5h1c0 .4-.1.8-.4 1.1-.3.3-.6.4-1.1.4-.5 0-1-.2-1.3-.5-.3-.4-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4.3-.4.7-.5 1.3-.5.5 0 .8.1 1.1.4.3.3.4.7.4 1.2h-1c0-.2 0-.4-.1-.6s-.2-.2-.3-.2c-.2 0-.4.1-.5.3-.1.2-.1.4-.1.8v.5c0 .3 0 .6.1.8s.2.3.5.3zM50.1 342.7c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3h-.7zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.1c0-.2 0-.4-.1-.5-.1-.2-.2-.3-.4-.3z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M37.8 307.1h-1.9v2.4h-1.1v-5.7h3.4v.9h-2.3v1.6h1.9v.8zM39.8 304.2h-1.1v-.8h1.1v.8zm0 5.3h-1.1v-4.2h1.1v4.2zM42.6 306.3h-.4c-.1 0-.2 0-.3.1l-.2.2v2.9h-1.1v-4.2h1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.4-.2H42.6v1.1zM44.7 309.6c-.5 0-1-.2-1.3-.5-.3-.3-.5-.8-.5-1.3v-.6c0-.6.1-1 .4-1.4.3-.4.7-.5 1.2-.5s.9.2 1.1.5c.3.3.4.8.4 1.4v.7h-2.1c0 .3.1.5.2.7s.3.3.6.3c.2 0 .4 0 .5-.1s.3-.1.5-.2l.3.7c-.1.1-.3.3-.6.3-.1-.1-.4 0-.7 0zm-.1-3.5c-.2 0-.3.1-.4.2s-.1.4-.1.7h1v-.2c0-.2 0-.4-.1-.5-.1-.2-.2-.2-.4-.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M40.9 271c0 .6-.1 1.1-.4 1.4-.3.3-.7.5-1.3.5s-1.1-.2-1.4-.5c-.4-.4-.5-.9-.5-1.5v-1.7c0-.7.2-1.2.5-1.5s.8-.5 1.4-.5c.6 0 1.1.2 1.4.5.3.3.5.8.5 1.4H40c0-.4 0-.6-.2-.8-.1-.2-.3-.2-.6-.2-.2 0-.4.1-.6.3s-.2.5-.2.9v1.7c0 .4.1.7.2.9.1.2.3.3.6.3s.5-.1.6-.2c.1-.2.2-.4.1-.8h1zM41.4 270.4c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.6c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM46.6 272.8h-1.1v-6.1h1.1v6.1zM47.2 270.7c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4-.1.1-.3.1-.5.1-.4 0-.8-.2-1-.6-.2-.3-.3-.8-.3-1.5zm1.1.1c0 .4 0 .7.1.9.1.2.2.3.4.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3s-.2-.1-.3-.1c-.2 0-.4.1-.4.4s-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M38.5 235.5v2h-1.1v-5.7h2c.6 0 1 .2 1.3.5.3.3.5.8.5 1.3s-.2 1-.5 1.3-.8.5-1.3.5h-.9zm0-.9h.9c.2 0 .4-.1.5-.3s.2-.4.2-.7c0-.3-.1-.5-.2-.7s-.3-.3-.5-.3h-.9v2zM41.6 235.2c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM46.8 232.3h-1.1v-.8h1.1v.8zm0 5.3h-1.1v-4.2h1.1v4.2zM49.4 236.5c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.5-.3-.4-.2-.7-.3-1-.5-.2-.2-.3-.5-.3-.8 0-.3.1-.6.4-.9.3-.2.6-.4 1.1-.4.5 0 .8.1 1.1.4s.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.3-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.5.3.4.2.8.3 1 .5s.3.5.3.8c0 .4-.1.7-.4.9-.3.2-.7.3-1.1.3-.5 0-.9-.1-1.2-.4-.3-.3-.4-.6-.4-1h1c0 .2.1.4.2.5.1.1.2.1.4.1.1 0 .3 0 .3-.1.1 0 .1-.1.1-.2zM50.9 235.2c0-.6.2-1 .5-1.4.3-.4.7-.5 1.3-.5s1 .2 1.3.5c.3.4.5.8.5 1.4v.5c0 .6-.2 1-.5 1.4-.3.4-.7.5-1.3.5-.5 0-1-.2-1.3-.5-.3-.4-.5-.8-.5-1.4v-.5zm1.1.5c0 .3 0 .6.1.8.1.2.2.3.5.3.2 0 .4-.1.5-.3s.1-.4.1-.8v-.5c0-.3 0-.6-.1-.8-.1-.2-.2-.3-.5-.3s-.4.1-.5.3-.1.4-.1.8v.5zM55.9 233.3v.6c.1-.2.3-.4.4-.5.2-.1.4-.2.6-.2.4 0 .6.1.8.4.2.3.3.7.3 1.3v2.6h-1v-2.6c0-.3 0-.5-.1-.6-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.1h-1.1v-4.2h1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M39.9 201.2h-1.5l-.3 1.2H37l1.6-5.7h1.2l1.6 5.7h-1.1l-.4-1.2zm-1.3-.9h1l-.5-2-.5 2zM43.2 201.6c.2 0 .3-.1.3-.2s.1-.3.1-.5h1c0 .4-.1.8-.4 1.1s-.6.4-1.1.4c-.5 0-1-.2-1.3-.5s-.4-.8-.4-1.4v-.5c0-.6.1-1 .4-1.4s.7-.5 1.3-.5c.5 0 .8.1 1.1.4s.4.7.4 1.2h-1c0-.2 0-.4-.1-.6-.1-.1-.2-.2-.3-.2-.2 0-.4.1-.5.3s-.1.4-.1.8v.5c0 .3 0 .6.1.8s.3.3.5.3zM46.4 197.2h-1.1v-.8h1.1v.8zm0 5.2h-1.1v-4.2h1.1v4.2zM47 200.3c0-.7.1-1.2.4-1.6s.6-.6 1-.6c.2 0 .3 0 .4.1s.3.2.4.3v-2.2h1.1v6.1h-1l-.1-.5c-.1.2-.2.3-.4.4s-.3.1-.5.1c-.4 0-.8-.2-1-.6s-.3-.7-.3-1.5zm1.2.1c0 .4 0 .7.1.9s.2.3.4.3c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-1.9c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.4.4-.1.2-.1.5-.1 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M138.2 187.1c-4.4 0-7.9 2.6-9.6 6.4 1.7 3.9 5.2 6.4 9.6 6.4 4.4 0 7.9-2.6 9.6-6.4-1.7-3.8-5.2-6.4-9.6-6.4zm0 11.3c-3.5 0-6.5-2-7.8-4.9 1.4-2.9 4.4-4.9 7.8-4.9 3.5 0 6.5 2 7.9 4.9-1.4 2.9-4.4 4.9-7.9 4.9z"
+        />
+        <path
+          fill="none"
+          stroke={fillColor}
+          strokeWidth={2}
+          strokeMiterlimit={10}
+          d="M146.8 184.8l-17 17.1"
+        />
+        <path
+          className="prefix__st0"
+          d="M136.6 194.6c0 .1-.1.1-.1.2-.1.2-.3.3-.5.4-.1.1-.2.1-.2.1.6.7 1.5 1.1 2.5 1.1 1.9 0 3.4-1.5 3.4-3.4 0-.8-.3-1.5-.7-2.1-1.3 1.5-3 2.4-4.4 3.7z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st8"
+          d="M139.9 301.5c-.6-1.1-2.2-1.3-3-.4-.6.6-.7 1.4-.2 2 .2.3.5.6.8.9l2.4-2.5c.1.1.1 0 0 0zM136.3 313.8c1.2.3 2.2-.1 2.8-1.1.3-.5.5-1.1.7-1.6.5-1.6 1.3-3.1 2.3-4.4.7-.9 1.3-1.9 1.5-3.1l-9 9c.4.6.9 1 1.7 1.2z"
+        />
+        <path
+          className="prefix__st4"
+          d="M143.2 298.1c-.8-.8-1.7-1.3-2.9-1.6-.5-.1-.9-.2-1.4-.3h-.7l-1.8.3c-2 .5-3.7 2.4-3.8 4.1 0 .4 0 .7.4.7s.5-.2.6-.6c.4-1.7 1.3-2.9 3-3.2.8-.2 1.7-.2 2.5-.2 1.2.1 2.2.6 3 1.3.5-.1.8-.3 1.1-.5zM143.9 303.5l-.3.3c-.3 1-.8 2-1.4 2.8-1 1.4-1.8 2.8-2.3 4.4-.2.6-.4 1.1-.7 1.6-.6 1-1.6 1.4-2.8 1.1-.6-.1-1-.4-1.3-.8-.3.2-.6.5-.9.7.4.5 1 .9 1.7 1.1 1.5.4 2.9.2 3.8-1.1.5-.6.9-1.4 1.1-2.2.6-1.6 1.3-3 2.3-4.3.4-.6.8-1.2 1.1-1.8.4-.8.6-1.7.7-2.5-.3.3-.7.5-1 .7z"
+        />
+        <path
+          className="prefix__st4"
+          d="M136.9 301.1c.7-.7 1.9-.7 2.6-.1l.9-.6c-.2-.2-.5-.4-.8-.6-1.2-.6-2.7-.3-3.7.7-.8.9-1.1 2.8-.1 3.7l.1.1c.3-.3.7-.6 1-.9-.1-.1-.1-.2-.2-.2-.4-.7-.3-1.5.2-2.1zM141.2 301.8c.1.3.1.7 0 1.1-.1.6-.3 1.3-.6 1.8-.1.3-.5.5-.8.7-.1 0-.1-.1-.2-.1.1-.4.2-.8.4-1.2.3-.5.4-1 .3-1.5l-2.1 2.1c.4.5.5 1.1.3 1.8-.1.4-.2.7-.4 1.1l5.7-5.6c-.1-.8-.3-1.5-.6-2.2l-2 2zM149 296.9l-1.4-1.4-3.6 3.5c.4.6.7 1.3.8 2l4.2-4.1zM135.4 309.2c-.4-.4-.5-.9-.3-1.4l-6.5 6.5 1.4 1.4 3.4-3.4c0-.1-.1-.3-.1-.4 0-.2-.1-.4 0-.5.1-.2.4-.4.6-.4.1 0 .3.2.5.4l1.9-1.9c-.3 0-.6-.1-.9-.3z"
+        />
+        <path
+          className="prefix__st4"
+          d="M134 311c-.2 0-.4.2-.6.4-.1.1 0 .3 0 .5 0 .1 0 .3.1.4l.9-.9c-.1-.2-.3-.5-.4-.4zM143.8 302l1-1c-.2-.7-.4-1.4-.8-2l-.8.8c.4.7.6 1.4.6 2.2zM135.4 309.2c.3.2.6.3.9.3l1.9-1.9c.1-.3.3-.7.4-1.1.2-.7 0-1.3-.3-1.8l-3.1 3.1c-.2.5-.2 1 .2 1.4zM140 304.2c-.2.4-.3.8-.4 1.2.1 0 .1.1.2.1.3-.2.6-.4.8-.7.3-.6.5-1.2.6-1.8.1-.4 0-.7 0-1.1l-.9.9c.1.4 0 .9-.3 1.4z"
+        />
+        <path
+          className="prefix__st1"
+          d="M143.2 299.8l.8-.8c-.2-.3-.4-.6-.6-.8l-.8.8c.2.2.4.5.6.8z"
+        />
+      </g>
+      <text
+        transform="translate(226.1 417.58)"
+        className="prefix__st0"
+        fontFamily="RobotoCondensed-Bold"
+        fontSize={12}
+      >
+        {"Upvote/Downvote"}
+      </text>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M15.2 492.6l-.4 1.8-1.1.9c-.2.4-.4.6-.8.8-.3.2-.7.3-1.1.3-.9 0-1.5-.4-1.9-1.1l-1.1-.9-.4-1.8.6-.2c.1.2.1.3.2.4.3.6.6 1 .9 1.3.3.2.9.3 1.6.3.9 0 1.4-.1 1.8-.3.3-.2.6-.6.9-1.3 0-.1.1-.2.2-.4l.6.2zM16.3 479.5c-1.2-1-2.7-1.5-4.5-1.5s-3.4.5-4.5 1.5c-1.2 1-1.7 2.3-1.7 3.9 0 1.4.2 2.4.6 3 .5.8.7 1.4.8 1.7l.2 1.5 2.5 1.2.4.9c.2.1.5.1.8.2.3 0 .7.1 1 .1.8 0 1.4-.1 1.8-.2l.4-.9 2.5-1.2.2-1.5c0-.3.1-.5.2-.6.8-1.3 1.1-2.7 1.1-4-.1-1.8-.7-3.1-1.8-4.1zM9.2 488c-1 0-1.5-.6-1.5-1.7 0-.5.1-1 .4-1.2.3-.3.6-.4 1.2-.4 1 0 1.5.5 1.5 1.5-.1 1.2-.6 1.8-1.6 1.8zm3.1 2.4c-.1 0-.3 0-.4-.1-.2.1-.3.1-.4.1-.2 0-.4 0-.5-.1-.1-.1-.2-.2-.2-.4s.1-.4.4-.8c.2-.3.4-.6.7-.9.2.3.4.7.7.9.3.3.4.6.4.7-.1.4-.3.6-.7.6zm2.2-2.4c-1 0-1.5-.6-1.5-1.7s.5-1.6 1.5-1.6c.5 0 .9.1 1.1.4.2.3.4.6.4 1.1 0 1.2-.5 1.8-1.5 1.8zM5.5 489.6h-3l4 1.6zM6 492.9l-3.5 1.5 4-.5zM7 495l-1.8 1.8 2.5-.9zM18.1 489.6h3.1l-4 1.6zM17.6 492.9l3.6 1.5-4-.5zM16.6 495l1.8 1.8-2.4-.9z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M228.3 358.9c-.5 0-.9.1-1.2.5-.8.8-.5 2.4.7 3.6 1.2 1.2 2.8 1.5 3.6.7.1-.1.2-.2.3-.4-.2 3.1-1.7 5.8-3.6 7.8h2.7c1.5-1.5 2.5-4.5 3.1-6.5 1.3.1 3.2.8 4.2 2l-3.9 4.5h11.2l-1.2-2.1H239c4.2-3.1 1.6-6.6-1.9-8.1-.5-.2-1-.4-1.5-.5-1.6-.4-3.3-.4-4.4.3-.2-.3-.4-.5-.6-.7-.6-.7-1.5-1.1-2.3-1.1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st5"
+          d="M130.8-38.4c4.4 0 8 3.6 8 8s-3.6 8-8 8-8-3.6-8-8 3.6-8 8-8m0-1c-5 0-9 4-9 9s4 9 9 9 9-4 9-9-4-9-9-9z"
+        />
+      </g>
+      <path
+        className="prefix__st9"
+        d="M130.8-39c2.3 0 4.2 3.8 4.2 8.5s-1.9 8.5-4.2 8.5"
+      />
+      <text
+        transform="translate(233.639 193.219)"
+        className="prefix__st0"
+        fontFamily="RobotoCondensed-Bold"
+        fontSize={8}
+      >
+        {"R"}
+      </text>
+      <g>
+        <circle className="prefix__st4" cx={233.7} cy={-29.7} r={9.3} />
+        <path
+          className="prefix__st1"
+          d="M233.7-35.2c3 0 5.4 2.4 5.4 5.4s-2.4 5.4-5.4 5.4-5.4-2.4-5.4-5.4 2.4-5.4 5.4-5.4m0-1c-3.6 0-6.4 2.9-6.4 6.4 0 3.6 2.9 6.4 6.4 6.4 3.6 0 6.4-2.9 6.4-6.4 0-3.5-2.8-6.4-6.4-6.4z"
+        />
+        <path
+          className="prefix__st1"
+          d="M233.3-28.6h6.9v-.5c0-4-3-7.3-6.8-7.3h-.1v7.8z"
+        />
+      </g>
+      <path
+        className="prefix__st0"
+        d="M229.6-8.4h-1.8c-.7 0-1.2.6-1.2 1.2V5.2c0 .7.5 1.2 1.2 1.2H238c.4 0 .8-.3.8-.8 0-.4-.3-1-.8-1h-9.3c-.3 0-.6 0-.6-.3s.3-1 .6-1h8.8c.7 0 1.2-.6 1.2-1.2v-9.2c0-.7-.5-1.2-1.2-1.2h-4.2l-3.7-.1"
+      />
+      <g>
+        <path
+          className="prefix__st1"
+          d="M230.9-6.1c.5-.1 1.1-.1 1.9-.1 1 0 1.6.2 2.1.5.4.3.6.8.6 1.3 0 .9-.6 1.5-1.2 1.7.5.2.8.7.9 1.3.2.8.4 1.6.5 1.9h-1.3c-.1-.2-.3-.8-.5-1.6-.2-.9-.5-1.2-1.2-1.2h-.6V.5h-1.2v-6.6zm1.3 2.9h.7c.8 0 1.3-.4 1.3-1.1 0-.7-.5-1.1-1.3-1.1-.4 0-.6 0-.8.1v2.1z"
+        />
+      </g>
+      <path
+        className="prefix__st0"
+        d="M240.8 444l3.7-2.8-4.6-.6 1.3-4.3-4.1 2.2-1.6-4.2-2 4.1-3.8-2.5.8 4.4-4.7.1 3.4 3.1-3.7 2.8 4.6.6-1.3 4.3 4.1-2.1 1.6 4.2 2-4.1 3.8 2.5-.8-4.4 4.7-.1-3.4-3.2zm-5.8 4.3c-2.2 0-4.6-2.4-4.6-4.6 0-2.2 2.4-4.6 4.6-4.6 2.2 0 4.6 2.4 4.6 4.6 0 2.2-2.4 4.6-4.6 4.6z"
+      />
+      <g>
+        <path
+          className="prefix__st4"
+          d="M245.4 197c-1.5 1.4-2.8 3.1-4.6 4.1-1.1.6-2.7.3-4 .5-.8-3 .9-6.5 3.6-7.8.3-.2 1-.2 1.1 0 .2.4.4 1 .2 1.3-.3.6-.8 1.1-1.6 2.2 2.2-.9 2.5-1.7 3-3.8.5-1.8 0-4.7.7-4.9.8 0 1.7-.3 1.6 1.3-.2 2.7 0 4.3 0 7.1zM226.7 197c1.5 1.4 2.8 3.1 4.6 4.1 1.1.6 2.7.3 4 .5.8-3-.9-6.5-3.6-7.8-.3-.2-1-.2-1.1 0-.2.4.9 1.4 1.1 1.8.3.6 0 1.1.3 1.7-3-1.2-2.5-1.7-3-3.8-.5-1.8 0-4.7-.7-4.9-.8 0-1.7-.3-1.6 1.3.2 2.7 0 4.3 0 7.1zM229.1 207.5c-.7-1.1-.6-2 .9-2h11.2c1.5 0 1.6.8.9 2h-13zM235.9 204.5c-1.9 0-3.8.1-5.8 0-.5 0-.9-.5-1.3-.8.4-.4.9-1 1.3-1.1 3.8-.1 7.5-.1 11.3 0 .4 0 .8.6 1.2.9-.4.3-.8.9-1.2.9-1.9.2-3.7.1-5.5.1z"
+        />
+      </g>
+      <path
+        className="prefix__st4"
+        d="M142.4 388.2c-1.1.9-2 1.5-3.8 0-1.8-1.5-3-3.7-4.5-3.8-1.5-.1-5.2.8-5.4 0-.2-.8.6-1.5 1.5-1.5s3.1.7 4.6-.8 2.8-2.1 3-3.8c.3-1.7-.6-4.9 0-5.5s1.3-.3 1.5.8c.2 1 1 5.3 0 7 0 0-.2 3.1.8 3.8 0 0 1.4-2.4 3-3 1.6-.6 4.7-.9 4.5 0-.2.9-.1 1.4-1.5 1.5-1.4.1-3.1.4-4.5 3 0 0 1.6-.9 3-.8s3 2.1 3 3c.1.9-.6 1.9-1.5 1.5-.8-.3-.6-3.9-3.7-1.4z"
+      />
+      <ellipse
+        transform="rotate(-21.1 134.422 379.23)"
+        className="prefix__st4"
+        cx={134.4}
+        cy={379.3}
+        rx={1.9}
+        ry={2.5}
+      />
+      <g id="prefix__Ea1JOO_tif">
+        <path
+          className="prefix__st4"
+          d="M144.5-135.3c.5.1 1 .2 1.6.3.1.5.3 1.1.4 1.7h.3c.1-.5.1-1 .2-1.7.5.4 1.1.8 1.6 1.2-1.5 1.4-1.9 3-1.2 5-.3-.2-.6-.3-.9-.4v1h-1.4c0-.1-.1-.1-.1-.1-.3-.9 1.2-1.5 1.3-2.3.1-1.2-.2-2.2-1.1-2.9-.3-.3-.6-.5-.5-1.1.1-.2-.1-.5-.2-.7zM154.4-141.8c-1.1.2-3.6.9-5 1.1.7-.7 2.4-2.1 3.3-2.1.5 0 1.3.6 1.8.8 0 0 0 .1-.1.2z"
+        />
+        <path
+          className="prefix__st8"
+          d="M157.5-138.6c.1-.4.2-.8.3-1.1 0 0-.1 0-.1-.1-.4.7-.8 1.5-1.2 2.3.5-.2 1.1-.5 1.7-.8-.3-.2-.5-.3-.7-.3zM150-137.8c-.4 0-.8 1.5-1.2 2.1 1-.1 2.3.1 3.3 0-.6-.8-.7-2.3-2.1-2.1z"
+        />
+        <path
+          className="prefix__st4"
+          d="M162.1-133.6c-.6-1.7-.9-3.5-2.5-4.3-1.1 1.3-1.2 1.4-2.2 1.2.2-.1.4-.1.5-.2.7-.3 1.2-.7 1.3-1.6.1-.8 0-1.6-.6-2.2-.5-.5-.9-.6-1.5-.2-.4.3-.8.5-1.1.8 0 .1-.1.1-.2.1-.1.1-.2.1-.3.2 0-.1-.1-.1-.1-.2l.1-.1c-.1-.1-.2-.3-.3-.4-.1 0-.3.1-.4 0-1.1-.2-2.1 0-3.2.3-1.3.3-2.5.7-3.8.8-.2 0-.3.1-.5.1v.1c.1.3 0 .7-.2 1 .1 0 .2 0 .3-.1v.2c-1.4.5-2.8.9-4.3 1.4.2.7.4 1.3.6 1.8.2-.2.4-.3.5-.4-.1-.4.1-.3.3-.3.7.1 1.4.3 2.1.4 1.4.2 2.1 1.2 2.5 2.7.3 1.2-.2 2.2-.9 3 0 .1-.1.1-.1.2-.3 1.7-1.2 2.2-2.7 2 .7.6 1.4.8 2.1.5.6-.2 1.2-.5 1.9-.6 1.2-.3 2.4-.7 3.6-.2.8.4 1.5 1.2 2.3 1.7.9.6 1.7 1.2 2.6 1.7.2-.5.3-1 .5-1.5.2-.7.6-1.4.7-2.1 0-.2.2-.3.3-.2.2-.3.3-.7.5-1.1.1.5.2.8.3 1.3.2-.4.3-.7.4-1 .3-1.2.6-2.4.7-3.6.1-.7-.2-1.5-.4-2.2.4.2.8.5 1.2 1zm-13.3-2.1c.4-.6.8-2.1 1.2-2.1 1.3-.1 1.5 1.4 2 2.1-.9.1-2.2-.1-3.2 0zm8.2-4.6s.8.4.8.5c-.1.4-.2.8-.3 1.1.2.1.7.5 1 .6-.6.3-2.5 1.1-3 1.3.3-.7 1.1-2.7 1.5-3.5zM146.1-139.3c-.1-.3-.4-.5-.7-.7-.1-.1-.3-.1-.4-.2H144.4c-.1 0-.2.1-.2.1l-.1.1c-.1 0-.1.1-.2.2s-.2.2-.2.3c0 0 0 .1-.1.1-.1.1-.1.2-.2.3 0 0 0 .1-.1.1-.1.2-.1.3-.2.5h.2c.1 0 .1 0 .2.1h.5v-.1-.1-.1-.1-.1-.1-.1-.3c.3.2.4.4.5.4h1c.1 0 .1 0 .1-.1.6 0 .6-.1.5-.2z"
+        />
+        <g>
+          <path d="M146.2-135.2l.2.1c.2.1.4.1.5.3.1.2 0 .5-.2 1.2l-.2.5-.3-2.1z" />
+          <path
+            className="prefix__st1"
+            d="M146.3-135c.5.1.5.3.1 1.3 0-.5 0-.9-.1-1.3m-.3-.4v.4l.1.6.1.7.1 1 .4-1c.2-.7.4-1 .2-1.3-.1-.2-.3-.3-.5-.4h-.4z"
+          />
+        </g>
+      </g>
+      <g>
+        <path
+          className="prefix__st5"
+          d="M228.4-140.3c.1-.2.2-.3.3-.5.1-.1.2-.3.4-.4.3-.2.6-.4 1.1-.5-2.2-1.1-3.5-1.5-2.9-.6.2.5.7 1.2 1.1 2z"
+        />
+        <path
+          className="prefix__st4"
+          d="M239.7-139c.1 0 0 0 0 0zM229.3-138.5c2.9-1.2 6.3-1.4 9.4-1-.5-.3-1.3-.8-2.6-1.5-4-2.4-6.8-3.6-6-2.3.5.8 1.2 1.9 1.3 3.1 0-.1-1.7.5-2.1 1.7z"
+        />
+        <path
+          className="prefix__st4"
+          d="M243.9-133.7c-.5-1.2-1.6-1.5-2.5-2.5-.6-.7-1.2-1.3-1.8-2-.2-.2-.3-.5-.5-.7h.4v-.1c-.2-.2-.3-.4-.5-.6-.9-.9-1.9-1.5-3-2-.7-.3-1.5-.6-2.3-.6l-.6.3c-.3.2-.5.3-.8.5-.4.2-.7.4-1 .6-.1.1-.2.1-.3.2.1.1 0 .3-.1.4-.4.5-.9 1-1.3 1.5-.5.6-.7 1.2-.6 2.1.1.7-.1 1.3-.4 1.8-.3.5-.7.9-1.2 1.3l-1.5 1.2c-.2.1-.2.2 0 .3.4.3.8.6 1.2.7h.2c.1 0 .2-.1.3.1h.1c.3 0 .7 0 1-.1.7-.2 1.5-.4 2.2-.7.7-.2 1.4-.4 2.1-.4.4 0 .4 0 .5.4.2.6 1 1.1.9 1.7v.1c.4.9.5 1.4.3 2 0 .8-.3 1.6-.9 2.2-.1.1-.1.3-.2.4-.1.2-.2.3-.3.5h.1c1.1-.5 2.3-2.4 3.1-3.3.3-.3.8.1.6.5-.4.7-1.3 2.5-1.8 3 .8.1 1.5.1 2.3.1h1.3c.3-.1.7-.2 1-.3.5-.5 1.3-2.5 1.6-3 .2-.4.8-.1.6.4-.2.4-.5 1.9-.7 2.2.6-.2 1.3-.5 1.9-.9.3-.6.7-1.1.9-1.7 0-.4 0-.4.1-1.1v-.1c-.1-.6-1.7-2.2-1.8-2.8 0-.2-.1-.4-.1-.6l1.4.9c.1.2 1 .6 1.1.7 0 .1.1.1.1.1 0-.1.1-.1.1-.2 0-.9-.9-1.8-1.2-2.5z"
+          id="prefix__QFqb7d_tif_1_"
+        />
+        <path className="prefix__st1" d="M230.5-136.5l-.4-.5 1-1h1v1l-1 .5z" />
+        <g>
+          <path
+            className="prefix__st1"
+            d="M233.6-126.5c.2-.3.7-1.3.7-1.8v-.2c.1-.4 0-.9-.3-1.6l-.1-.2v-.2h.5l-.5-.1c0-.1-.2-.4-.4-.6-.2-.2-.4-.5-.5-.8v-.1c-.6 0-1.3.2-1.9.4-.8.2-1.5.5-2.2.7-.3.1-.6.1-.8.1h-.3c-.2 0-.3 0-.4-.1h-.4c-.1 0-.1 0-.1-.1l-.5-.1.3-.8.1-.1c.1-.1 1.5-1.4 2.3-2 .7-.5 3-1.9 4.8-1.9.3 0 .5 0 .7.1.9.2 1.9 1.1 2.5 2.3.5.9 1.1 2.7.2 5l-.1.3h-.2c-1.3 1.5-2.1 2.3-2.8 2.4l-1 .1.4-.7z"
+          />
+          <path d="M233.8-135.4c.2 0 .4 0 .6.1 1.5.4 3.6 3.3 2.3 6.6-.1 0-.1 0-.2.1-.8.9-2 2.2-2.5 2.3 0 0 .7-1.2.7-2.1.2-.5.1-1.1-.3-2v-.1c.1-.6-.7-1.1-.9-1.7-.1-.4-.1-.4-.4-.4h-.1c-.7 0-1.4.2-2.1.4-.7.2-1.5.5-2.2.7-.3.1-.7.1-1 .1h-.1c0-.1-.1-.1-.1-.1h-.4-.1l.1-.2s1.5-1.3 2.3-1.9c.6-.5 2.8-1.8 4.4-1.8m0-1c-2 0-4.4 1.5-5.1 2-.8.6-2.3 1.9-2.3 2l-.2.2-.1.3-.1.2-.3 1 .9.3c.1 0 .1.1.2.1h.4c.1.1.3.1.4.1h.4c.3 0 .6 0 .9-.1.8-.2 1.5-.4 2.3-.7.5-.2 1-.3 1.5-.4.1.3.3.5.5.7.1.1.2.2.2.3l-.1.3.1.3c.4.8.3 1.1.3 1.2v.2c0 .4-.4 1.2-.6 1.6l-1 1.8 2-.3c.8-.1 1.6-.9 3-2.4l.3-.1.2-.5c.7-1.8.6-3.7-.2-5.4-.7-1.3-1.7-2.3-2.8-2.6-.2 0-.5-.1-.8-.1z" />
+        </g>
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M317.7-141.9s4.4-3.5 9.7-.8c0 0-1.4 0-1.9.3 0 0 .5-.1.7 0 0 0-.5.3-1.2.2 0 0 0 .1.6.2 0 0-.4.4-1.5.4 0 0 .3.2.7.2 0 0-.3.4-1.4.4 0 0 .1.1.3.1 0 0-.5.2-.9.1 0 0 .2.2.3.2 0 0-1.2.2-1.5.6-.4.3-3.9-1.9-3.9-1.9zM312.3-141.1s2.5-3.7 6.7-3.4c0 0-.9.4-1.2.7 0 0 .3-.2.5-.2 0 0-.2.3-.7.5 0 0 0 .1.4 0 0 0-.2.3-.9.7 0 0 .2 0 .5-.1 0 0-.1.3-.8.6h.2s-.3.3-.6.3c0 0 .2.1.3 0 0 0-.7.4-.8.8s-3.6.1-3.6.1z"
+        />
+        <path
+          className="prefix__st0"
+          d="M310.7-136.8l-.3-.1c-.3-2.8 1.3-5.6 5.5-5.6.6 0 1.2.1 1.7.1-1 .6-1.9 1.5-2.3 3.1-.8 3-2.4 3-3.7 3.2-.1-.2-.5-.5-.9-.7zM320.7-134.8l.3-.2c-.1-.3-.2-.5-.2-.5l.3-.2c-.2-.4-.4-.6-.5-.6l-1.2-1.1.8.4.2-.3h.1c.1 0 .2.1.3.1-.4-.3-.6-.5-.6-.5l-.8-.7.9.3c-1-.6-2.5-1.2-3.2-1.4l.1-.2c-.3.4-.5.9-.7 1.4-.1.4-.2.7-.3 1h.1c.6 0 1.7.5 1.7 1.1s-.8 1.7-1.4 1.7c-.5 0-1.3-.6-1.4-1.1-.6.6-1.3.5-1.8.5.5.7.1 1.5.1 1.6l.3.3-.6.1.1.2s2.7 1.6 4.7 1.4c1.9-.2 2.5-2.2 2.6-2.3l.1-.5.2.4c.1.2.3.4.4.6-.2-.7-.6-1.4-.6-1.5z"
+        />
+        <path
+          className="prefix__st8"
+          d="M310.8-134.9c-.2-.5-.6-1-1.1-1.2.5.3.9.7 1.1 1.2z"
+        />
+        <path
+          className="prefix__st0"
+          d="M311.3-133.2s0-.9-.4-1.7c-.2-.5-.6-1-1.1-1.2 0 0-1.7 2.3-.3 4.6.2-.1.3-.2.5-.2.1-.6.5-1.3 1.3-1.5z"
+        />
+        <path
+          className="prefix__st0"
+          d="M309.7-131.1s0-.3.2-.7c-.2.1-.3.1-.5.2.1.2.2.4.3.5z"
+        />
+        <g>
+          <path
+            className="prefix__st0"
+            d="M326.8-130.3s.2.1.5.5c0 0-.3-2.5-1.8-3.6 0 0 .8 0 1.2.5 0 0-.2-1.4-1.1-1.9 0 0 .7 0 .9.2 0 0-.4-1.6-1.7-2.1 0 0 .6 0 .7.2 0 0-.2-1.4-2.2-2.2 0 0 .6 0 .9.2l-.6-.4s-1.9-2.5-5.6-3.1c-.5.3-.9.6-1.3 1.1.7.3 4.6 1.8 5.4 2.7l.5.6-1.1-.3c.2.1.3.3.5.5l.5.5-.8-.1.2.2.3.4h-.5c.2.3.5.7.7 1.3l.3.6-.6-.3s-.1 0-.2-.1c0 .2.1.4.1.6v.5l-.2-.1c.2.6.5 1.3.6 1.8l.1.7-.5-.4s-.6-.5-1-1c-.4.8-1.4 2.4-3.5 2.6h-.6c-2.1 0-4.4-1.1-5.3-1.6-.3-.1-.7-.2-1-.2-.2.4-.3 1-.3 1l-.2 1.7c.2 1.2 1.3 3 1.3 3 .3.7 1.3 1.3 1.3 1.3-.4-.5-.4-1.4-.4-1.4 1.5 1.6 3.2 1.6 3.2 1.6-.5-.8-.1-1.7-.1-1.7.5 1.2 1.9 1.6 1.9 1.6.7-1 .4-1.7.4-1.7 1.1 1.7 4.1 1.8 4.1 1.8-.6-1-.3-2-.3-2 .5 1.4 2.6 1.8 2.6 1.8-.4-.6-.3-1.4-.3-1.4.5.8 1.6.8 1.6.8-.6-.6-.8-2.2-.8-2.2 1.5 1.3 1.4 3.1 1.4 3.1.9-.4 1.1-1 1.2-1.3v-.3c.3-1 .3-2.4-.4-4z"
+          />
+        </g>
+      </g>
+      <path
+        className="prefix__st0"
+        d="M404.3-126.5s.3-1.2 0-2.4c0 0 .2.7.9 1.1 0 0-1-1.6-1.1-4.4 0 0 .3.9.7 1.9 0 0 .2-1-.6-3.6 0 0 .7 1.7.8 2.4 0 0-.1-6.4-2.7-8 0 0 .7-.1 2.5 2.4 0 0-1.4-3.3-4.2-4.2l2.4.7s-1.6-1.4-5.8-1.4c0 0 1.8-.2 2.2 0 0 0-5.2-1.4-9 2 0 0-1.2 0-1.6.4 0 0-2.2-.2-3.1 1.4-1.2 2 .3 3.9 1.1 4.7 0 0-.2-1.6.2-2.2 0 0 1.1.7 3.3.6 6-.4 4.3 2.2 2.4 4 0 0-1 .9-3 3 0 0 3-.9 3.4-1.5 0 0 .8 1.1 1 1.9 0 0 .7-.8.9-1.6 0 0 .1.9.2 1.1 0 0 .4-.3.5-.6 0 0 .2.7.4.8 0 0 .3-.4.3-.8 0 0 .2 1.1 1 1.8 0 0 .3-.5.3-1 0 0 .1.3.4.5 0 0 .4-1 .4-2.3 0 0 .3 2.3 1.1 3.1 0 0 .4-.7.3-1.4 0 0 1.3 1.1 2.3 1.7 0 0-.4-.7-.4-1.3.1.1.1.2 2.5 1.2z"
+      />
+      <g>
+        <path
+          className="prefix__st1"
+          d="M393.1-139.7s0 .1 0 0c-.1.2-.2.3-.2.5 0 .6.5.9 1.2.8.6 0 1.6-.8 1.7-1.5-1.5-.5-2.1-.2-2.7.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st1"
+          d="M84.1-127.4h.7c-.3-.1-.5-.2-.7-.2v.2z"
+        />
+        <path
+          className="prefix__st0"
+          d="M81.4-140.1s-.6-1.7-2.4-2.2l.6 2.8 1.8-.6z"
+        />
+        <path
+          d="M80.9-129.5s.4 2.6-.8 4.8"
+          fill="none"
+          stroke={fillColor}
+          strokeWidth={0.649}
+          strokeMiterlimit={10}
+        />
+        <path
+          className="prefix__st11"
+          d="M82-128.9s1.2 1.7.7 3.5M78.7-128.2s.4 1.4-.8 2.8"
+        />
+        <g>
+          <path
+            className="prefix__st8"
+            d="M81.2-133.5c-.6.6-1.4.9-1.9.9-.3 0-.5-.1-.7-.3-.5-.5-.1-1.7.9-2.6.6-.6 1.4-.9 1.9-.9.3 0 .5.1.7.3.5.6.1 1.8-.9 2.6z"
+          />
+          <path
+            className="prefix__st8"
+            d="M81.4-135.8c-.5 0-1.1.3-1.6.8-.9.8-1.1 1.6-.9 1.9.1.1.2.1.3.1.5 0 1.1-.3 1.6-.8.4-.4.7-.8.9-1.2.1-.3.1-.5 0-.6-.1-.2-.2-.2-.3-.2z"
+          />
+          <path
+            className="prefix__st0"
+            d="M87.1-131.2c.1 0 .1 0 0 0H88.5c-.2-.4-.5-.7-.8-.9.2-.1.4-.1.6-.1h1.4c.2 0 .5.1.8.1 0-.1-.1-.3-.1-.5 0-.1 0-.2-.1-.3 0-.1 0-.2-.1-.3 0-.2-.1-.3-.1-.5v-.1c-.2-.9-.6-1.9-1-2.9-.1-.3-.2-.5-.3-.8-.3-.6-.6-1.1-.9-1.6h-.7s-1.3-2.8-4.7-4.1v3.9s-4.8 1.8-4.9 3.2c-.1 1.4-.2 3.3-.5 3.6-.3.3-1.6 2-1.2 2.3s2.4 2.7 3.6 2.7c1.1 0 3.8-.3 4.4 0 0 0 .1 0 .2.1l.1-.6H85.8c.2 0 .4 0 .5-.1h.3c.2 0 .4-.1.6-.1.1 0 .2 0 .3-.1.3-.1.6-.2.8-.3-.5-.2-1.2-.7-1.9-1.5H87.9c-.5-.2-.9-.7-1.2-1.2 0 .1.2.1.4.1z"
+          />
+          <path
+            className="prefix__st1"
+            d="M81.7-135c-.1.4-.5.8-.9 1.2-.5.5-1.2.8-1.6.8-.1 0-.3 0-.3-.1-.2-.2 0-1.1.9-1.9.5-.5 1.2-.8 1.6-.8.1 0 .3 0 .3.1.1.1.1.4 0 .7z"
+          />
+        </g>
+        <path
+          className="prefix__st0"
+          d="M94.1-132v-.2c-.1-.9-.4-1.7-1-2.4.7.3 1.1.7 1.1.7-.7-2.1-2.4-2.1-2.5-2.1-.7-.5-1.4-.9-2-1.3.9 1.9 1.3 4 1.5 5l.2.7-.7-.1c-.4-.1-.9-.1-1.3-.1H89c.1.1.1.2.2.3l.3.6-.6.1s-.6.1-1.2.1c.1.1.2.1.3.2l2.2.8-2.4.1h-.1c.3.2.5.3.7.4l1.1.5-1.1.4c-1.2.5-2.4.6-3.2.6 1 1.5 4.2 2.8 4.2 2.8-.2-1.3 1.3-2.4 1.3-2.4.5.1.5 2.4.5 2.4.9-1 1.9-2.3 2.4-4.1.5.5.8 1.2.8 1.2.5-.9.1-2.8-.3-4.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st12"
+          d="M14.7 128.7l-3.9-3M8.9 118.7l-.3-.3.3.3z"
+        />
+        <path
+          className="prefix__st6"
+          d="M15.9 125.6l-7.8-12h3.8L7.1 112l-.3-.5 4.2-.8-6.5-1H.1v7.1l.8 3.7s.1-2.7 0-3c0-.3 3 4 3 4-.3-1.3-.7-3.5-.9-4.5l12.9 8.6zm-9.2-8.1h.2c0 .1.1.2.1.2-.1-.1-.2-.2-.3-.2z"
+        />
+        <path
+          className="prefix__st8"
+          d="M4.9 116.6c.1.1 1.9.9 2 1 0 0-.8-2.1-1-2.3-1.5-1.5.4-.8 0-2.7-.4-2-3.2-.5-5-1 .3 1.1-.8 1.9 1 4 1.1 1.3 2.3.3 3 1z"
+        />
+        <path
+          className="prefix__st2"
+          d="M14.7 129c-1.6 0-3.1-.6-3.5-1.3-.2-.3-1.8-.7-2.6-.7h-.2c-.4 0-.6-.2-.7-.6-.1-.4.1-.9.7-1.1.3-.1.7-.2 1.3-.2.8 0 1.6.1 1.9.2h.5v-.3c-.1-.3-.5-1.1-1-1.9-2.1-3.4-2.4-4.1-2.1-4.6.1-.2.3-.3.5-.3.7 0 1.9 1.1 2.5 2.1.4.6.7 1.1 1 1.3-.2-.8-.7-2.3-.9-3-.1-.4-.3-.7-.3-.9-.1-.4-.1-.8.2-1.1.2-.3.6-.5 1-.5.6 0 .9.8 1.5 3.5 0 .2.1.4.1.6 0-.4.1-.8.1-1.3 0-1.2.4-1.8 1.1-1.8.2 0 .4.1.5.2.6.7.2 3.3.2 3.4v.6c.5-1.1 1.6-2.1 2.3-2.1.3 0 .5.1.6.4.1.4-.1 1.1-1.6 3.6-.1.1-.1.2-.2.3v1.3c0 .8 0 1.7-.1 2.3-.3 1.5-2.5 1.8-2.8 1.9z"
+        />
+        <path
+          className="prefix__st1"
+          d="M13 116.6c.6 0 1.4 5 1.7 5 .3 0 .4-1.9.4-2.5 0-.6.1-1.5.7-1.5s.4 2.7.3 3.1c0 .3 0 1.3.3 1.3.1 0 .2-.1.4-.4.5-1 1.5-1.9 2-1.9.1 0 .2 0 .2.1.2.5-1.6 3.3-1.8 3.6s0 2.7-.2 3.8c-.2 1.1-2.4 1.4-2.4 1.4-1.5 0-2.8-.6-3.1-1.1-.3-.5-2.2-1-3-1h-.2-.1c-.4 0-.6-.7.1-1 .3-.1.7-.2 1.1-.2.7 0 1.5.1 1.8.2.1 0 .3.1.4.1.4 0 .7-.2.5-.8-.3-.8-3.2-5.6-2.9-6 .1-.1.1-.1.2-.1.5 0 1.6.9 2.1 1.9.6 1 1.3 1.7 1.6 1.7.1 0 .1 0 .1-.1.2-.3-1.1-3.9-1.3-4.5 0-.6.4-1.1 1.1-1.1m0-.7c-.6 0-1 .2-1.3.6-.3.4-.4.9-.2 1.4 0 .2.2.5.3.9.1.2.2.6.3 1-.6-.9-1.7-1.9-2.5-1.9-.3 0-.6.2-.8.4-.4.6-.2 1.3 1.8 4.9.3.6.7 1.2.9 1.6-.4-.1-1.2-.2-1.9-.2-.6 0-1.1.1-1.5.2-.8.3-1 1-.9 1.5.1.5.6.9 1.1.9h.2c.7 0 2.1.4 2.4.6.5.9 2.1 1.5 3.8 1.5.5-.1 2.8-.4 3.1-2 .1-.6.1-1.6.1-2.4v-1.2c0-.1.1-.1.1-.2 1.6-2.7 1.8-3.4 1.7-3.9-.1-.4-.5-.6-.9-.6-.6 0-1.3.5-1.9 1.2.1-.9.1-2.4-.4-3-.2-.2-.4-.3-.7-.4-.5 0-1.1.2-1.4 1.2-.4-1.5-.7-2.1-1.4-2.1zM.9 110.6l.9 6.6.7-3.7s3.4 4 3.3 3.8c-.1-.2-2-4.4-2-4.4l4 .4-4.2-1.9 4.1-.8H.9z"
+        />
+      </g>
+      <path
+        transform="rotate(-45.001 233.653 29.463)"
+        className="prefix__st4"
+        d="M226.5 22.3h14.3v14.3h-14.3z"
+      />
+      <g>
+        <path
+          className="prefix__st1"
+          d="M236.1 30.3c0 .8-.2 1.4-.5 1.8-.4.4-.9.6-1.7.6-.7 0-1.3-.2-1.8-.7-.4-.5-.7-1.1-.7-1.9V28c0-.8.2-1.5.6-1.9.4-.5 1-.7 1.7-.7.8 0 1.3.2 1.7.6s.6 1 .6 1.8h-1.3c0-.5 0-.8-.2-1s-.4-.3-.8-.3c-.3 0-.6.1-.7.4-.2.2-.2.6-.2 1.1v2.1c0 .5.1.9.3 1.1.2.2.4.4.8.4.3 0 .6-.1.7-.3.1-.2.2-.5.2-1h1.3z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st4"
+          d="M233.7 56l-9.3 16h18.5l-9.2-16zm1.2 11.5h-2.5l-.5 1.5h-1.4l2.5-7.1h1.5l2.4 7.1h-1.4l-.6-1.5z"
+        />
+        <path className="prefix__st4" d="M233.7 63.6l-.9 2.8h1.8l-.9-2.8z" />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M6.6 188.2c-.6 3.2-5.5 8.3-5.5 12.1 0 4 2 5.8 5.4 5.8h.1c1.7 0 3.1-.5 4-1.4.9-1 1.4-2.4 1.4-4.4.1-3.7-4.7-8.8-5.4-12.1zm2.8 13.2c0 .1-.1.2-.1.3l-.1.8-1.3.6-.2.5c-.2.1-.6.1-1 .1h-.6c-.2 0-.3-.1-.4-.1l-.2-.5-1.3-.6-.2-.8c0-.2-.2-.5-.4-.9-.2-.3-.3-.9-.3-1.6 0-.9.3-1.5.9-2.1.6-.5 1.4-.8 2.4-.8s1.8.3 2.4.8c.6.5.9 1.2.9 2.1.1.7-.1 1.5-.5 2.2z"
+        />
+        <path
+          className="prefix__st0"
+          d="M8 200.1c-.5 0-.8.3-.8.9 0 .6.3.9.8.9s.8-.3.8-1c0-.3-.1-.5-.2-.6-.1-.1-.3-.2-.6-.2zM5.3 200.1c-.3 0-.5.1-.6.2-.1.1-.2.4-.2.6 0 .6.3.9.8.9s.8-.3.8-1c-.1-.4-.3-.7-.8-.7zM6.7 202c-.1.2-.2.4-.3.5-.1.2-.2.3-.2.4 0 .1 0 .2.1.2s.1.1.3.1c.1 0 .1 0 .2-.1.1 0 .2.1.2.1.2 0 .3-.1.3-.3 0-.1-.1-.2-.2-.4-.2-.2-.3-.4-.4-.5z"
+        />
+      </g>
+      <path
+        className="prefix__st0"
+        d="M242.8 509.6v7.5h-9.2l-2.5 2.2h6.9l3.6 3.2v-3.2h2.9v-9.7z"
+      />
+      <g>
+        <path
+          className="prefix__st0"
+          d="M227.6 519.7v-4.1h-2.9v-11.2H241v11.2h-8.8l-4.6 4.1zm-1.4-5.7h2.9v2.3l2.6-2.3h7.9v-8.2h-13.3v8.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M14.7 15.5l-.8-1.5c-.3-.9-.3-1.6-.3-1.6h-1c0 .1.1 3.2 2.5 4.8l.5-.8-.9-.9zM14.9 9.8l.1 1s1.7-.2 3.5.8l.5-.9c-2.1-1.1-4.1-.9-4.1-.9z"
+        />
+        <path
+          className="prefix__st0"
+          d="M17.7 2c.3-.2.5-.4.8-.7.3-.3.3-.8 0-1.1-.3-.3-.8-.3-1.1 0-1.8 2-3.5 1.6-5.3 1.1-1.3-.3-2.6-.6-3.7.2C6.7 2.6 6.7 5 6.9 6.6L3.3 4.3l1.6-1.1L0 2.7l2.7 4.9.2-2.4 3.4 2.2c-1.5.4-3.7 1.4-4.2 3.4-.3 1.3.5 2.4 1.3 3.5 1.1 1.5 2.2 2.9 1 5.3-.2.4 0 .8.4 1 .1 0 .2.1.3.1.3 0 .6-.2.7-.4.2-.4.3-.7.4-1.1l5.5-8.2 4.9 3.2.5-.8-4.9-3.1L17.7 2zm-8.5.7c.5-.4 1.3-.2 2.4.1 1.4.4 3.1.8 4.9-.1l-4.8 7.1-3.1-2.1v-.1c-.3-1-.7-4 .6-4.9zM6.4 17.9c.1-2-1-3.4-1.8-4.6-.7-1-1.2-1.6-1-2.2.4-1.6 3.1-2.3 4.2-2.5H8.1l3.2 2.1-4.9 7.2z"
+        />
+      </g>
+      <path
+        className="prefix__st9"
+        d="M122.3-31c9.4 5.5 17 .4 17 .4M122.9-1.2h12.9v12.9h-12.9zM135.8-1.2l3-3.6V7.9l-3 3.8M122.9-1.2l3.4-3.6h12.5"
+      />
+      <ellipse className="prefix__st9" cx={130} cy={37.9} rx={8.2} ry={2.2} />
+      <ellipse className="prefix__st9" cx={135.3} cy={94.7} rx={2.2} ry={8.2} />
+      <path
+        className="prefix__st9"
+        d="M121.8 37.9v12.9c0 1.2 3.7 2.2 8.2 2.2 4.6 0 8.2-1 8.2-2.2V37.9M135.3 73h-13.5v-3h13.5M135.3 73v1.7l3-3.2-3-2.9v1.3M135.3 86.4l-13.5 8.3 13.5 8.2"
+      />
+      <g>
+        <path
+          className="prefix__st0"
+          d="M258.8 198v2.4h-1.2v-6h2c.6 0 1.1.2 1.4.5.3.3.5.8.5 1.3 0 .3-.1.6-.2.8-.1.2-.3.4-.6.5.3.1.5.3.7.5.1.2.2.5.2.9v.4c0 .2 0 .3.1.5s.1.3.2.4v.1h-1.2c-.1-.1-.2-.2-.2-.4v-1c0-.3-.1-.5-.2-.7-.1-.2-.3-.2-.5-.2h-1zm0-1h.8c.2 0 .4-.1.5-.2.1-.1.2-.4.2-.6 0-.3-.1-.5-.2-.7-.1-.2-.3-.2-.5-.2h-.8v1.7zM264.1 200.5c-.6 0-1-.2-1.3-.6-.3-.4-.5-.8-.5-1.4v-.6c0-.6.2-1.1.5-1.5s.7-.6 1.3-.6c.5 0 .9.2 1.2.5s.4.8.4 1.4v.7h-2.2c0 .3.1.5.2.7.1.2.3.3.6.3.2 0 .4 0 .5-.1.1 0 .3-.1.5-.2l.3.8c-.2.1-.4.3-.6.4-.3.1-.6.2-.9.2zm-.1-3.7c-.2 0-.3.1-.4.3-.1.2-.1.4-.1.7h1.1v-.2c0-.3 0-.4-.1-.6-.2-.2-.3-.2-.5-.2zM268.2 199.2c0-.1 0-.2-.1-.3-.1-.1-.3-.2-.6-.3-.5-.2-.8-.4-1-.6-.2-.2-.3-.5-.3-.8 0-.4.1-.7.4-.9.3-.3.7-.4 1.1-.4.5 0 .9.1 1.2.4.3.3.4.6.4 1h-1.1c0-.2 0-.3-.1-.4-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.3 0 .1 0 .2.1.3.1.1.3.2.6.3.5.2.8.4 1 .6.2.2.3.5.3.9s-.2.7-.5.9-.7.4-1.2.4-.9-.2-1.2-.5c-.3-.3-.4-.6-.4-1h1.1c0 .2.1.4.2.5.1.1.3.2.4.2.2 0 .3 0 .4-.1s.1-.2.1-.4zM271.4 194.8v1.1h.6v.9h-.6v2.3c0 .2 0 .3.1.4.1.1.1.1.2.1h.4l.1.9c-.1 0-.2.1-.4.1h-.4c-.4 0-.7-.1-.9-.4s-.3-.6-.3-1.1v-2.3h-.5v-.9h.5v-1.1h1.2zM274.8 197h-.4c-.1 0-.2 0-.3.1-.1.1-.1.1-.2.3v3.1h-1.2V196h1.1v.6c.1-.2.2-.4.3-.5.1-.1.3-.2.5-.2h.4l-.2 1.1zM277.6 200.4c0-.1-.1-.2-.1-.2 0-.1 0-.2-.1-.3-.1.2-.2.3-.4.4-.2.1-.3.2-.6.2-.4 0-.7-.1-.9-.4-.2-.2-.3-.6-.3-1s.1-.8.4-1c.3-.2.7-.4 1.3-.4h.4v-.4c0-.2 0-.4-.1-.5-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.1.2-.1.4h-1.1c0-.4.1-.7.4-1 .3-.3.7-.4 1.2-.4s.8.1 1.1.4c.3.3.4.7.4 1.2v2.4c0 .2.1.4.1.6h-.9zm-.8-.8c.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-.8h-.4c-.2 0-.3.1-.4.2-.1.1-.1.3-.1.5 0 .1 0 .3.1.4.1-.1.2 0 .3 0zM280.5 194.8h-1.2v-.9h1.2v.9zm0 5.6h-1.2v-4.5h1.2v4.5zM282.4 195.9v.6c.1-.2.3-.4.5-.5.2-.1.4-.2.6-.2.4 0 .7.1.9.4.2.3.3.7.3 1.4v2.8h-1.2v-2.8c0-.3 0-.5-.1-.7-.1-.1-.2-.2-.4-.2-.1 0-.2 0-.3.1-.1.1-.2.1-.2.2v3.3h-1.2v-4.5h1.1zM287.2 200.5c-.6 0-1-.2-1.3-.6-.3-.4-.5-.8-.5-1.4v-.6c0-.6.2-1.1.5-1.5s.7-.6 1.3-.6c.5 0 .9.2 1.2.5s.4.8.4 1.4v.7h-2.2c0 .3.1.5.2.7.1.2.3.3.6.3.2 0 .4 0 .5-.1.1 0 .3-.1.5-.2l.3.8c-.2.1-.4.3-.6.4-.3.1-.6.2-.9.2zm-.1-3.7c-.2 0-.3.1-.4.3-.1.2-.1.4-.1.7h1.1v-.2c0-.3 0-.4-.1-.6-.2-.2-.3-.2-.5-.2zM289.2 198.2c0-.7.1-1.3.4-1.7s.6-.6 1.1-.6c.2 0 .3 0 .5.1.1.1.3.2.4.4V194h1.2v6.5h-1l-.1-.5c-.1.2-.3.3-.4.4-.2.1-.3.1-.5.1-.5 0-.8-.2-1.1-.6-.3-.4-.5-1-.5-1.7zm1.2.1c0 .4 0 .7.1.9.1.2.2.3.5.3.1 0 .2 0 .3-.1.1-.1.2-.1.2-.2v-2c-.1-.1-.1-.2-.2-.3-.1-.1-.2-.1-.3-.1-.2 0-.4.1-.5.4-.1.2-.1.5-.1 1.1z"
+        />
+      </g>
+      <ellipse
+        className="prefix__st0"
+        cx={236.6}
+        cy={243.9}
+        rx={7.2}
+        ry={7.8}
+      />
+      <path
+        className="prefix__st0"
+        d="M242.3 247.7c0 3.1-2.5 6.9-5.7 6.9-3.1 0-5.7-3.8-5.7-6.9s2.5-4.5 5.7-4.5 5.7 1.4 5.7 4.5z"
+      />
+      <path
+        className="prefix__st1"
+        d="M235.1 245c0 .9-.7 1-1.5 1-.9 0-1.5-.1-1.5-1s.7-1.5 1.5-1.5c.8-.1 1.5.6 1.5 1.5zM239 250.5c0 1.3-1 0-2.3 0s-2.3 1.3-2.3 0 1-2.3 2.3-2.3 2.3 1.1 2.3 2.3zM241.1 245c0 .9-.7 1-1.5 1-.9 0-1.5-.1-1.5-1s.7-1.5 1.5-1.5c.8-.1 1.5.6 1.5 1.5z"
+      />
+      <ellipse
+        transform="rotate(-73.118 243.409 245.905)"
+        className="prefix__st0"
+        cx={243.4}
+        cy={245.9}
+        rx={1.9}
+        ry={1.1}
+      />
+      <ellipse
+        transform="rotate(-16.883 229.832 245.91)"
+        className="prefix__st0"
+        cx={229.8}
+        cy={245.9}
+        rx={1.1}
+        ry={1.9}
+      />
+      <path
+        className="prefix__st0"
+        d="M146.1 271.4h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 .1-1.9-.5-2.1zM146.1 344.6h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 .1-1.9-.5-2.1zM146.1 529.2h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 .1-1.9-.5-2.1zM241 328.1h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 0-1.9-.5-2.1zM146.8 412.8h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 .1-2-.5-2.1z"
+      />
+      <ellipse className="prefix__st0" cx={139} cy={497.1} rx={7.2} ry={7.8} />
+      <path
+        className="prefix__st0"
+        d="M144.7 500.9c0 3.1-2.5 6.9-5.7 6.9-3.1 0-5.7-3.8-5.7-6.9s2.5-4.5 5.7-4.5c3.1 0 5.7 1.4 5.7 4.5z"
+      />
+      <path
+        className="prefix__st1"
+        d="M137.4 498.2c0 .9-.7 1-1.5 1-.9 0-1.5-.1-1.5-1s.7-1.5 1.5-1.5c.9-.1 1.5.6 1.5 1.5zM141.3 503.7c0 1.3-1 0-2.3 0s-2.3 1.3-2.3 0 1-2.3 2.3-2.3 2.3 1 2.3 2.3zM143.4 498.2c0 .9-.7 1-1.5 1-.9 0-1.5-.1-1.5-1s.7-1.5 1.5-1.5c.9-.1 1.5.6 1.5 1.5z"
+      />
+      <ellipse
+        transform="rotate(-73.118 145.74 499.09)"
+        className="prefix__st0"
+        cx={145.7}
+        cy={499.1}
+        rx={1.9}
+        ry={1.1}
+      />
+      <ellipse
+        transform="rotate(-16.883 132.16 499.1)"
+        className="prefix__st0"
+        cx={132.2}
+        cy={499.1}
+        rx={1.1}
+        ry={1.9}
+      />
+      <path
+        className="prefix__st13"
+        d="M136.6 488.7l2.4 4.5-3.4 1.8.3 5.7-3.4 4.2"
+      />
+      <path
+        className="prefix__st13"
+        d="M137.4 494l1.6 2.1 4-1.6 4.3 1.3M139.8 509.6c.1-.2-.5-3.5-.5-3.5l3.9-2-1.8-3.5 7.2-2.3"
+      />
+      <path
+        className="prefix__st14"
+        d="M139.5 401.7c.3-.3.6-.6 1-.8 1.3-.5 2.8.3 3 1.5.1.5 0 1-.4 1.5-1.2 1.6-2.4 3.1-3.6 4.7l-.1.1-.1-.1c-1.2-1.5-2.4-3.1-3.5-4.6-.9-1.2-.3-2.9 1.3-3.2.9-.2 1.6.1 2.2.7.1.1.2.1.2.2zM133.5 405.8c.1-.2.3-.3.5-.4.6-.2 1.4.1 1.5.8 0 .3 0 .5-.2.7-.6.8-1.2 1.5-1.8 2.3-.6-.8-1.2-1.5-1.8-2.3-.5-.6-.1-1.4.6-1.6.5-.1.8.1 1.2.5-.1-.1 0-.1 0 0zM145.5 405.8c.1-.2.3-.3.5-.4.6-.2 1.4.1 1.5.8 0 .3 0 .5-.2.7-.6.8-1.2 1.5-1.8 2.3-.6-.8-1.2-1.5-1.8-2.3-.5-.6-.1-1.4.6-1.6.5-.1.8.1 1.2.5-.1-.1 0-.1 0 0z"
+      />
+      <g>
+        <path
+          className="prefix__st1"
+          d="M234.6 331.1c0-.3-.1-.5-.2-.7-.1-.2-.4-.3-.8-.5-.7-.3-1.3-.6-1.7-.9s-.6-.8-.6-1.4c0-.6.2-1.1.7-1.4.4-.4 1-.6 1.7-.6s1.2.2 1.7.6c.4.4.6.9.6 1.6h-1.4c0-.3-.1-.6-.2-.8-.2-.2-.4-.3-.7-.3-.3 0-.5.1-.7.3-.2.2-.2.4-.2.6 0 .2.1.4.3.6.2.2.5.3.9.5.7.2 1.2.5 1.5.9.3.4.5.8.5 1.4 0 .6-.2 1.1-.6 1.5-.4.4-1 .5-1.7.5s-1.3-.2-1.8-.6c-.5-.4-.7-1-.7-1.7h1.4c0 .4.1.8.3 1 .2.2.5.3.9.3.3 0 .5-.1.7-.2s.1-.5.1-.7z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st14"
+          d="M232.2 318.5s-1.7.2-2.8.3c-.1 0-.2.1-.2.2s0 .2.1.3c.8.8 2.1 1.9 2.1 1.9s-.3 1.7-.6 2.8c0 .1 0 .2.1.3.1.1.2.1.3 0 1-.6 2.5-1.4 2.5-1.4s1.5.8 2.5 1.4h.3c.1-.1.1-.2.1-.3-.2-1.1-.6-2.8-.6-2.8s1.3-1.1 2.1-1.9c.1-.1.1-.2.1-.3 0-.1-.1-.2-.2-.2-1.1-.1-2.8-.3-2.8-.3s-.7-1.5-1.2-2.6c0-.1-.1-.2-.2-.2s-.2.1-.2.2c-.7 1.1-1.4 2.6-1.4 2.6z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st14"
+          d="M239.3 322.6s-1 .1-1.6.2c-.1 0-.1 0-.1.1v.2c.5.4 1.2 1.1 1.2 1.1s-.2 1-.3 1.6c0 .1 0 .1.1.2h.2c.6-.3 1.4-.8 1.4-.8s.9.5 1.4.8h.2c.1 0 .1-.1.1-.2-.1-.6-.3-1.6-.3-1.6s.7-.7 1.2-1.1c0 0 .1-.1 0-.2 0-.1-.1-.1-.1-.1-.7-.1-1.6-.2-1.6-.2s-.4-.9-.7-1.5c0-.1-.1-.1-.1-.1s-.1 0-.1.1c-.5.6-.9 1.5-.9 1.5z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st14"
+          d="M226.5 322.6s-1 .1-1.6.2c-.1 0-.1 0-.1.1v.2c.5.4 1.2 1.1 1.2 1.1s-.2 1-.3 1.6c0 .1 0 .1.1.2h.2c.6-.3 1.4-.8 1.4-.8s.9.5 1.4.8h.2c.1 0 .1-.1.1-.2-.1-.6-.3-1.6-.3-1.6s.7-.7 1.2-1.1c0 0 .1-.1 0-.2 0-.1-.1-.1-.1-.1-.7-.1-1.6-.2-1.6-.2s-.4-.9-.7-1.5c0-.1-.1-.1-.1-.1s-.1 0-.1.1c-.5.6-.9 1.5-.9 1.5z"
+        />
+      </g>
+      <path
+        className="prefix__st0"
+        d="M243.4 282.1h-.1v-.2c0-4.3-3.2-7.8-7.2-7.8s-7.2 3.5-7.2 7.8v.2h-.2c-.6.2-.8 1.1-.5 2.1.3 1 1 1.6 1.6 1.5.2.4.4.8.7 1.1.5 2.9 2.8 5.8 5.6 5.8s5.1-3 5.6-5.8c.3-.3.5-.7.7-1.1.6.1 1.2-.5 1.5-1.5.3-1 0-2-.5-2.1z"
+      />
+      <g>
+        <path
+          className="prefix__st1"
+          d="M235.3 284.4v2.6h-1.4v-7.3h2.5c.7 0 1.3.2 1.7.6.4.4.6 1 .6 1.7s-.2 1.3-.6 1.7c-.4.4-1 .6-1.7.6h-1.1zm0-1.2h1.1c.3 0 .5-.1.7-.3.2-.2.2-.5.2-.9 0-.3-.1-.6-.2-.9-.2-.2-.4-.3-.7-.3h-1.1v2.4z"
+        />
+      </g>
+      <path
+        className="prefix__st1"
+        d="M141.2 535c0 1.3-1 0-2.3 0-1.3 0-2.3 1.3-2.3 0s1-2.3 2.3-2.3c1.2 0 2.3 1 2.3 2.3z"
+      />
+      <path
+        transform="rotate(134.999 135.769 529.181)"
+        className="prefix__st1"
+        d="M135.4 526.9h.7v4.5h-.7z"
+      />
+      <path
+        transform="rotate(-134.999 135.767 529.182)"
+        className="prefix__st1"
+        d="M135.4 526.9h.7v4.5h-.7z"
+      />
+      <path
+        transform="rotate(134.999 141.769 529.181)"
+        className="prefix__st1"
+        d="M141.4 526.9h.7v4.5h-.7z"
+      />
+      <path
+        transform="rotate(-134.999 141.767 529.182)"
+        className="prefix__st1"
+        d="M141.4 526.9h.7v4.5h-.7z"
+      />
+      <g>
+        <path
+          className="prefix__st1"
+          d="M142.3 415.5c0 1-.2 1.7-.7 2.2s-1.1.7-2 .7-1.6-.3-2.1-.8-.8-1.3-.8-2.3v-2.5c0-1 .3-1.8.8-2.3s1.2-.8 2-.8c.9 0 1.6.2 2.1.7s.7 1.2.7 2.2h-1.6c0-.6-.1-1-.2-1.2s-.5-.4-.9-.4-.7.1-.9.4c-.2.3-.3.7-.3 1.3v2.6c0 .6.1 1 .3 1.3.2.3.5.4.9.4s.7-.1.8-.3.2-.6.2-1.2h1.7z"
+        />
+      </g>
+      <g>
+        <path className="prefix__st1" d="M139.6 350.4h-1.7v-8.5h1.7v8.5z" />
+      </g>
+      <path
+        d="M132.6 341.7c5.1.5 9.1.2 14-.8.8-.2 1.7-.5 1.9-1.1.1-.4-.1-.8-.4-1-.3-.3-.7-.5-1.2-.6-5.1-2.1-11.1-2.6-16.6-1.5-.4.1-.8.2-1.1.4-.3.2-.5.5-.5.8.1.5.7.7 1.3.8 3.5.9 7.3 1.1 10.9.6 1.2-.1 2.5-.4 3.5-1s1.6-1.7 1.2-2.6c-.5-1.1-2.1-1.6-3.5-1.8-3.1-.5-6.3-.6-9.4-.3-.4 0-.9.1-1.1.4-.2.2-.1.5.1.7.2.2.5.3.8.5 2.4 1.1 5.3 1.6 8 1.4.8-.1 1.6-.2 2.3-.5.7-.3 1.2-.9 1.1-1.5 0-.5-.4-.9-.9-1.2s-1.1-.5-1.7-.6c-2.1-.5-4.2-.8-6.4-.8"
+        fill="none"
+        stroke={fillColor}
+        strokeWidth={0.75}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        strokeMiterlimit={10}
+      />
+      <g>
+        <path
+          className="prefix__st16"
+          d="M140.7 272.4l-.3 1-.6.5c-.1.2-.3.4-.4.5-.2.1-.4.2-.6.2-.5 0-.9-.2-1.1-.6l-.6-.5-.3-1 .4-.1c0 .1.1.2.1.2.2.4.3.6.5.7.2.1.5.2.9.2.5 0 .8-.1 1-.2.2-.1.4-.4.5-.7 0-.1.1-.1.1-.2h.4z"
+        />
+        <path
+          className="prefix__st16"
+          d="M138.8 275.5c.4-.2 1.2-.6 2.3-1.1.1 0 .2-.1.4-.2.4-.4.7-.7 1-.9.3-.2.4-.3.6-.3.1 0 .3 0 .3.1.1.1.1.2.1.4s0 .4-.1.7c.3.4.4.6.4.8 0 .2 0 .3-.1.3-.1.1-.2.1-.4.1-.1 0-.2 0-.4-.1s-.4-.2-.6-.4c-.6.1-1.5.5-2.7 1.1.2.1.3.2.3.2.4.2.9.5 1.5.9.1 0 .2.2.5.3 1.2.1 1.9.5 1.9.9 0 .3-.3.5-1 .6-.3.4-.6.6-.8.6-.2 0-.5-.3-.7-1 0-.1-.1-.2-.1-.3-1-.8-1.8-1.4-2.6-1.8-.9.5-1.8 1.2-2.6 1.9-.1.8-.3 1.2-.7 1.2-.2 0-.5-.2-.8-.7-.7 0-1-.2-1-.6 0-.3.1-.5.4-.6.3-.1.8-.3 1.6-.4.6-.5 1.4-.9 2.2-1.4-1.2-.6-2.1-.9-2.8-1.1-.2.2-.3.3-.5.3-.1.1-.3.1-.4.1-.2 0-.3 0-.4-.1-.1-.1-.1-.2-.1-.3 0-.1.2-.4.5-.8-.1-.3-.1-.5-.1-.6 0-.2 0-.4.1-.5.1-.1.2-.1.4-.1s.4.1.6.3c.3.2.6.5.9.9.9.6 1.8 1.1 2.9 1.6z"
+        />
+        <path
+          className="prefix__st16"
+          d="M141.3 265.8c-.7-.6-1.5-.9-2.6-.9s-1.9.3-2.6.9c-.7.6-1 1.3-1 2.2 0 .8.1 1.4.3 1.7.3.5.4.8.4 1l.1.9 1.4.7.2.5c.1 0 .3.1.5.1h.6c.4 0 .8 0 1.1-.1l.2-.5 1.4-.7.1-.9c0-.2.1-.3.1-.4.4-.8.7-1.5.7-2.3.1-.9-.2-1.7-.9-2.2zm-4.1 4.9c-.6 0-.9-.3-.9-1 0-.3.1-.6.2-.7.1-.2.4-.2.7-.2.6 0 .8.3.8.9.1.6-.2 1-.8 1zm1.8 1.4c-.1 0-.2 0-.2-.1-.1.1-.2.1-.2.1-.1 0-.2 0-.3-.1-.1-.1-.1-.1-.1-.2s.1-.2.2-.4.3-.3.4-.5c.1.2.2.4.4.5.2.2.2.3.2.4 0 .1-.1.3-.4.3zm1.3-1.4c-.6 0-.9-.3-.9-1 0-.6.3-.9.9-.9.3 0 .5.1.6.2.1.1.2.4.2.7 0 .6-.2 1-.8 1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st2"
+          d="M135.8 232.6s1.5-1.6.9-2.6-2.3-2.6-2.3-3-.5-3.6-1-3.9c-.5-.3-.9 1.4-.5 2.7.3 1.4-.9.2-1.1-.2-.2-.4-1.8-2.6-2.3-2.2s0 1.1.4 1.6 1.6 2 1.3 2.2c-.2.2-4-3.1-4.5-2.7-.5.4-.5 1 .1 1.4s3.9 2.2 3.9 2.6c0 .4-1.1.3-2.4-.1-1.3-.4-3-.4-3 .2 0 .6 5.4 2.2 6.1 2.7.8.4.3 1-.2 1.1-.4.2-1.9 1.2-2.3 1.9-.3.7.3 1.2.7.8.3-.4 2.4-1.6 3-1.4s2.1-.1 3.2-1.1z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st2"
+          d="M136.8 230l10.2 6.8-3.2 3.6-9.9-8.1z"
+        />
+      </g>
+      <path
+        className="prefix__st14"
+        d="M136 242.2c-1.2-.9-2.5-1.8-3.7-2.8.1-.1 1.5-2 1.5-2.1.5-.6 1-1.2 1.4-1.9 0-.1.1-.2.1-.3-.2-1.2-.4-2.4-.5-3.6-.1-.6.2-1 .8-1 .4-.1.8-.1 1.2-.2h.2c.2 0 .2.2.2.3-.1.2-.3.5-.4.7-.1.2-.1.3 0 .3.1.1.2 0 .3-.1.3-.4.6-.9.9-1.3.5-.6 1.3-.5 1.6.2.1.2.2.2.3.1.1 0 .1-.1.2-.1.3-.1.7-.1 1 .1.3.2.4.5.3.9 0 .3 0 .4.3.4.7.1.9.7.7 1.3-.1.2 0 .4.2.6l.2.2c.3.3.5.7.2 1.1-.6.9-1.4 1.6-2.4 2.1-.4.2-.8.2-1.2.2-.1 0-.2 0-.3.1-.6.9-1.3 1.9-2 2.8.2.2-1.1 1.9-1.1 2z"
+      />
+      <g>
+        <path
+          className="prefix__st1"
+          d="M231 278.2l3.2-3.2-3.2-3.2 1.8-1.9 3.2 3.3 3.3-3.3 1.8 1.9-3.2 3.2 3.2 3.2-1.8 1.9-3.3-3.2-3.2 3.2z"
+        />
+        <path
+          className="prefix__st17"
+          d="M231 278.2l3.2-3.2-3.2-3.2 1.8-1.9 3.2 3.3 3.3-3.3 1.8 1.9-3.2 3.2 3.2 3.2-1.8 1.9-3.3-3.2-3.2 3.2z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st1"
+          d="M226.4 280.2l1.4-1.4-1.4-1.5 1.2-1.2 1.4 1.4 1.5-1.4 1.2 1.2-1.4 1.5 1.4 1.4-1.2 1.2-1.5-1.4-1.4 1.4z"
+        />
+        <path
+          className="prefix__st17"
+          d="M226.4 280.2l1.4-1.4-1.4-1.5 1.2-1.2 1.4 1.4 1.5-1.4 1.2 1.2-1.4 1.5 1.4 1.4-1.2 1.2-1.5-1.4-1.4 1.4z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st1"
+          d="M241.4 280.2l1.4-1.4-1.4-1.5 1.2-1.2 1.4 1.4 1.5-1.4 1.2 1.2-1.4 1.5 1.4 1.4-1.2 1.2-1.5-1.4-1.4 1.4z"
+        />
+        <path
+          className="prefix__st17"
+          d="M241.4 280.2l1.4-1.4-1.4-1.5 1.2-1.2 1.4 1.4 1.5-1.4 1.2 1.2-1.4 1.5 1.4 1.4-1.2 1.2-1.5-1.4-1.4 1.4z"
+        />
+      </g>
+      <path
+        className="prefix__st4"
+        d="M238 89.8h-8.8l-4.4 7.6 4.4 7.6h8.8l4.4-7.6-4.4-7.6zm-1.8 10.7h-4.9v-6.8h1.4V99h3.5v1.5z"
+      />
+      <g>
+        <path
+          className="prefix__st0"
+          d="M416.4-24.6l-6.6-5.7-6.7 5.7-1.9-2.3 8.6-7.4 8.6 7.4z"
+        />
+      </g>
+      <g>
+        <path
+          className="prefix__st0"
+          d="M406.1-3.9l-1.7 2.7H402l2.8-4.1-2.6-3.9h2.4l1.6 2.5 1.5-2.5h2.4l-2.6 3.9 2.8 4.1h-2.4l-1.8-2.7zM410.9-9.3h4c1.8 0 2.8 1.2 2.8 2.7 0 1.4-1 2.6-2.8 2.6H413v2.7h-2.1v-8zm3.7 1.8h-1.7v1.8h1.7c.6 0 1-.3 1-.9 0-.6-.5-.9-1-.9z"
+        />
+      </g>
+    </BaseSvg>
+  );
+};
+
+export default RangedWeaponSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedWeaponSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedWeaponSvg/index.ts
new file mode 100644
index 0000000..dc07dcd
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/RangedWeaponSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import RangedWeaponSvg from "./RangedWeaponSvg";
+
+const LightRangedWeaponSvg = asLightSvg(RangedWeaponSvg);
+const DarkRangedWeaponSvg = asDarkSvg(RangedWeaponSvg);
+const GrayRangedWeaponSvg = asGraySvg(RangedWeaponSvg);
+
+export default RangedWeaponSvg;
+export {
+  RangedWeaponSvg,
+  LightRangedWeaponSvg,
+  DarkRangedWeaponSvg,
+  GrayRangedWeaponSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/ThrownSvg/ThrownSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/attackTypes/ThrownSvg/ThrownSvg.tsx
new file mode 100644
index 0000000..de14628
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/ThrownSvg/ThrownSvg.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ThrownSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 18.16 18.94">
+      <path
+        d="M8.82 5.68S6.78 6 6.07 7.09c0 0 1.19 1 2.07.54s1.25-1.17.68-1.95z"
+        fill={secondaryFillColor}
+      />
+      <path
+        fill={fillColor}
+        d="M10.41 8.58L1.59 0s.76 7.26 5.77 10.47zM11.33 9.47l4.37 5.21-1.7.86-4.02-5.07 1.35-1zM16.29 8.66A24.79 24.79 0 0012 .62S10.82 4 14.15 9.06zM16.75 9.63c.19.16 1.4 4.07 1.4 4.07l-1.15.87L15.51 10zM15.38 17.8l-4.7-2.96-1.08 1.21 4.67 2.89 1.11-1.14zM9.6 14.38L0 11s3.13 5.07 7.72 5.72z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default ThrownSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/ThrownSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/attackTypes/ThrownSvg/index.ts
new file mode 100644
index 0000000..89018cb
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/ThrownSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import ThrownSvg from "./ThrownSvg";
+
+const LightThrownSvg = asLightSvg(ThrownSvg);
+const DarkThrownSvg = asDarkSvg(ThrownSvg);
+const GrayThrownSvg = asGraySvg(ThrownSvg);
+
+export default ThrownSvg;
+export { ThrownSvg, LightThrownSvg, DarkThrownSvg, GrayThrownSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/UnarmedStrikeSvg/UnarmedStrikeSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/attackTypes/UnarmedStrikeSvg/UnarmedStrikeSvg.tsx
new file mode 100644
index 0000000..c6c5cae
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/UnarmedStrikeSvg/UnarmedStrikeSvg.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const UnarmedStrikeSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 20 20">
+      <g fill={fillColor}>
+        <path d="M14.5 6.5l-2.793-2.793a1 1 0 00-1.414 0l-.864.864a.497.497 0 00.076.765L12.5 8.5zM7.707 4.707a1 1 0 00-1.414 0l-.584.584a1.003 1.003 0 000 1.418L10 11l2.102-1.898zM4.713 7.287l-1 1a1.004 1.004 0 00.003 1.423l4.578 4.55a1 1 0 001.43.017l.581-.582a.997.997 0 00.011-1.4l-4.978-5.07a.495.495 0 00-.625.062zM7.327 14.299l-2.99-3.074a.495.495 0 00-.624.062l-.999.999a1 1 0 00.008 1.421l2.575 2.543a.995.995 0 001.43.023l.586-.586a.992.992 0 00.014-1.388z" />
+        <path d="M19 13V9l-3-3-5 5c2 2 5-1 5-1v1l-1 1a3.773 3.773 0 00-.742 3.258A2.798 2.798 0 0114 12s-1 1-3 0a1.385 1.385 0 010 2l-1 1a3.097 3.097 0 01-2 1l-1 1 2 2c1 1 4 0 4 0l1 1h5a1 1 0 001-1v-5zM7 0H0v7l1-6 6-1z" />
+        <path d="M14 1L2 2 1 14 3 3l11-2z" />
+      </g>
+    </BaseSvg>
+  );
+};
+
+export default UnarmedStrikeSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/UnarmedStrikeSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/attackTypes/UnarmedStrikeSvg/index.ts
new file mode 100644
index 0000000..dc61452
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/UnarmedStrikeSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import UnarmedStrikeSvg from "./UnarmedStrikeSvg";
+
+const LightUnarmedStrikeSvg = asLightSvg(UnarmedStrikeSvg);
+const DarkUnarmedStrikeSvg = asDarkSvg(UnarmedStrikeSvg);
+const GrayUnarmedStrikeSvg = asGraySvg(UnarmedStrikeSvg);
+
+export default UnarmedStrikeSvg;
+export {
+  UnarmedStrikeSvg,
+  LightUnarmedStrikeSvg,
+  DarkUnarmedStrikeSvg,
+  GrayUnarmedStrikeSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/WeaponSpellDamageSvg/WeaponSpellDamageSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/attackTypes/WeaponSpellDamageSvg/WeaponSpellDamageSvg.tsx
new file mode 100644
index 0000000..c4dffc9
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/WeaponSpellDamageSvg/WeaponSpellDamageSvg.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const WeaponSpellDamageSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 21.97 22.38">
+      <path
+        fill={fillColor}
+        d="M14.28 2.7l-.06.06.04-.15.02.09zM13.81 7.36l.45-1.83.45 1.83 1.59.5-1.53.27-.51 1.88-.5-1.88-.88-.16-.64-.11.78-.25.79-.25zM10.79 8.33l1.82.32-.32.82-1.5-1.14zM7.98 14.83l2.04.65-1.97.34-.65 2.42-.65-2.42-1.94-.34 2.01-.65.04-.16.54-2.18.47 1.88.11.46z"
+      />
+      <path
+        fill={fillColor}
+        d="M.7 15.79l.05.01-.3.05 3.69-3.11L.15 9.35h4.11L0 0l5.52 4.58-.92-3.53L6.74 2.8 8.18.43l1.01 3.86L12.58.98l-1.31 4.85 2.95-3.07-.99 4.05-3.11 1-2.83-2.16a.927.927 0 00-.59-.21 1.002 1.002 0 00-.84 1.57l1.38 1.98-1.25 5.09z"
+      />
+      <path
+        fill={fillColor}
+        d="M7.71 9.66l2.75 3.96-1.62.47-.04-.01-1.09-4.42z"
+      />
+      <path
+        fill={fillColor}
+        d="M21.97 21.03l-.7.65-.64.7-3.32-3.39-2.22 2.26-1.12-.81 2.05-2.03-2.04-2.58-.11-.14-2.69-3.41-4.59-5.81 5.16 4.36 6.42 5.44 1.87-1.89.81 1.11-2.27 2.23 3.39 3.31zM14.55 3.76l-.27-1.06 1.16-1.2-.89 2.26z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default WeaponSpellDamageSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/attackTypes/WeaponSpellDamageSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/attackTypes/WeaponSpellDamageSvg/index.ts
new file mode 100644
index 0000000..c39c80e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/attackTypes/WeaponSpellDamageSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import WeaponSpellDamageSvg from "./WeaponSpellDamageSvg";
+
+const LightWeaponSpellDamageSvg = asLightSvg(WeaponSpellDamageSvg);
+const DarkWeaponSpellDamageSvg = asDarkSvg(WeaponSpellDamageSvg);
+const GrayWeaponSpellDamageSvg = asGraySvg(WeaponSpellDamageSvg);
+
+export default WeaponSpellDamageSvg;
+export {
+  WeaponSpellDamageSvg,
+  LightWeaponSpellDamageSvg,
+  DarkWeaponSpellDamageSvg,
+  GrayWeaponSpellDamageSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/AbilityScoreBoxSvg/AbilityScoreBoxSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/AbilityScoreBoxSvg/AbilityScoreBoxSvg.tsx
new file mode 100644
index 0000000..50df0ec
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/AbilityScoreBoxSvg/AbilityScoreBoxSvg.tsx
@@ -0,0 +1,38 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class AbilityScoreBoxSvg extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-ability-score-box-svg", className];
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 81 95">
+        <path
+          fill={theme.backgroundColor}
+          d="M77.56,53.81a4.55,4.55,0,0,1-1.64-3.69c0-6.29-1.3-14.52,1.37-20.68A5,5,0,0,1,76,26.51a5.3,5.3,0,0,1-.72-6c1.28-2.68,1.17-6.68.88-9.54a4.15,4.15,0,0,1,1.22-3.27c.12-.62.23-1.24.35-1.86C73.47,7.49,70.86,2,70.86,2H10.14S8,6.44,4.48,6.16A5.61,5.61,0,0,1,4.63,7.5c0,1.54-.17,3.1-.21,4.66.09,1.24.23,2.47.44,3.68a33,33,0,0,1,1.58,7.78,4.58,4.58,0,0,1-1.05,3.21,4.79,4.79,0,0,1-1.47,2.34,5.17,5.17,0,0,1,.5,2.12c.18,6.94.78,13.53.25,20.5a5,5,0,0,1-1.2,3c.06,2,0,4,0,6.07a4.61,4.61,0,0,1,.44,3.71C1.64,73,6.36,78,12.35,82.16a5.16,5.16,0,0,1,.49.21c.91.5,1.81,1,2.73,1.55a1,1,0,0,0,.17.1c.54.3,1.09.59,1.66.85a2.39,2.39,0,0,1,.21.13h1.85a4.21,4.21,0,0,1-1.19-1.92,9.45,9.45,0,0,1-.9-6.13,3.71,3.71,0,0,1,.18-1.22c.16-.41.32-.79.49-1.15A10.44,10.44,0,0,1,21,70.26c.11-.12.21-.25.32-.36a14.53,14.53,0,0,1,1.91-1.84,18.26,18.26,0,0,1,6-3.17,21.13,21.13,0,0,1,4.9-1.39c6.15-1.45,14.34-.72,19.85,2.51.67.3,1.33.62,1.94,1a6.52,6.52,0,0,1,.67.45l.07,0a14.44,14.44,0,0,1,4,3.33,4.51,4.51,0,0,1,.77,1,22.47,22.47,0,0,1,1.29,1.89,4.61,4.61,0,0,1,.57,3.41,5.42,5.42,0,0,1,.27,1.78,5.73,5.73,0,0,1-.27,2.33,5.11,5.11,0,0,1-1.29,3.1,3.79,3.79,0,0,1-.66.72h2.68a4.41,4.41,0,0,1,2.21-1.49c1.34-.86,2.74-1.65,4.06-2.61,1.7-1.26,5.14-3.55,5.9-5.61A5.51,5.51,0,0,1,76.8,74a7.8,7.8,0,0,0,.37-1.71,5.4,5.4,0,0,1,.34-1.56c-.09-1.51-.18-3-.41-4.53a6.21,6.21,0,0,1,.5-3.74C77.46,59.57,77.46,56.64,77.56,53.81Z"
+        />
+        <path
+          fill={theme.backgroundColor}
+          d="M40.5,66C50.7,66,59,71.61,59,78.5S50.7,91,40.5,91,22,85.39,22,78.5,30.3,66,40.5,66"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M4.52,13.62A34.66,34.66,0,0,1,3.08,6.26l0-.42.63-.2C5.22,5.18,9.41,3.35,9.41,1V0H71.59V1c0,2.37,4.19,4.2,5.66,4.66l.63.2,0,.42a35.34,35.34,0,0,1-1.44,7.36L76,7.3C74.42,6.71,70.47,5,69.74,2H11.26C10.52,5,6.58,6.71,5,7.3ZM2.32,79.46H2.6c.08-1.12.16-2.38.24-3.76A13,13,0,0,1,.63,69.83,9.4,9.4,0,0,1,3.21,62.6V61.43S1.83,35.67.56,31.56L.4,31l.47-.29a12.31,12.31,0,0,0,2.2-1.87,6.23,6.23,0,0,0,1.55-2.24A5.08,5.08,0,0,0,5,23.27c0-.11-.58-1.35-1.12-3l-.26,2.85c.27.79.5,1.63.71,2.49a5.17,5.17,0,0,1-1.56,2A33.13,33.13,0,0,0,1.74,23.6l-.07-.2L2.91,9.63c0,2,1.38,6.53,1.38,6.53a36.23,36.23,0,0,0,2.1,6.67A7.13,7.13,0,0,1,5,28.71C6.68,38,5.08,71,4.87,74.89A15.6,15.6,0,0,1,3,71.41c.08-2,.13-4.16.16-6.41a7.57,7.57,0,0,0-1.15,4.71,12,12,0,0,0,2.1,5.41l.15.22.45.64.06.07h0a29.64,29.64,0,0,0,5.74,5.66A39.48,39.48,0,0,1,14,83.83h0l.26.18c.79.54,1.55,1.09,2.29,1.65l.18.13h0c1.42,1.09,2.71,2.17,3.78,3.11,1.39,0,2.75.11,4,.22a16.4,16.4,0,0,1-3.19-3.33H17.91l-2.49-2h2.32a16.19,16.19,0,0,1-.88-4.16,4.31,4.31,0,0,1-5.21,1.79c.59.18,3,.53,5.24-4.08v0a8.24,8.24,0,0,1,2.52-5.32,13.54,13.54,0,0,0-1,10.29A1.76,1.76,0,0,0,19.8,83,11.36,11.36,0,0,1,19,78.77c0-8.55,9.66-15.51,21.54-15.51S62,70.22,62,78.77A11.36,11.36,0,0,1,61.2,83a1.76,1.76,0,0,0,1.34-.64,13.54,13.54,0,0,0-1-10.29A8.24,8.24,0,0,1,64.1,77.4v0c2.2,4.61,4.64,4.26,5.24,4.08a4.31,4.31,0,0,1-5.21-1.79,16.19,16.19,0,0,1-.88,4.16h2.32l-2.49,2H59.68a16.4,16.4,0,0,1-3.19,3.33c1.2-.11,2.57-.21,4-.22,1.07-.94,2.36-2,3.78-3.11h0l.18-.13c.74-.56,1.5-1.11,2.29-1.65l.26-.18h0a39.48,39.48,0,0,1,3.49-2.11,29.64,29.64,0,0,0,5.74-5.66h0l.06-.07.45-.64.15-.22A12,12,0,0,0,79,69.71,7.64,7.64,0,0,0,77.8,65c0,2.25.08,4.41.16,6.41a15.6,15.6,0,0,1-1.83,3.48C75.92,71,74.32,38,76,28.71a7.1,7.1,0,0,1-1.34-5.88,38.28,38.28,0,0,0,2.09-6.67s1.4-4.48,1.38-6.53L79.33,23.4l-.07.2a33.13,33.13,0,0,0-1.07,4.08,5.39,5.39,0,0,1-1.57-2c.22-.86.45-1.7.71-2.49l-.25-2.85c-.54,1.61-1.07,2.85-1.12,3a5.08,5.08,0,0,0,.42,3.36,6.23,6.23,0,0,0,1.55,2.24,12.31,12.31,0,0,0,2.2,1.87l.48.29-.17.53c-1.26,4.11-2.64,29.87-2.64,29.87,0,.39,0,.79,0,1.17a9.4,9.4,0,0,1,2.58,7.23,13.37,13.37,0,0,1-2.2,5.89c.07,1.38.15,2.64.23,3.76h.28c1.49-.12,2.79.71,2.16,1.75a2.46,2.46,0,0,1-1.72,1.15,2.58,2.58,0,0,0,.75-.85c.17-.3,0-.44-.14-.51l-.38,0h0a7.86,7.86,0,0,0-.84,0c.18,2.31.32,3.71.33,3.79L79,85.79H66.64c-1.46,1-2.84,2.15-4,3.15a11.85,11.85,0,0,1,7,2.12l-2.75,1.09h0a30,30,0,0,1-5.35,1.74h0l-.33,0L61,94c-9.66,1.67-10.67.75-10.67.75A10.09,10.09,0,0,0,57.11,92l.23-.24c.1-.1.62-.62,1.46-1.4-.62,0-1.22.07-1.81.12h0l-.44,0a8.82,8.82,0,0,0-1.18.23,7.12,7.12,0,0,0-.87.27l-.14,0a6.24,6.24,0,0,0-1,.44l-.11.07a5.63,5.63,0,0,0-.77.54l-.22.19a4.82,4.82,0,0,0-.75.86l-7.89.9.06,0a26.18,26.18,0,0,1-6.46,0l.06,0-7.89-.9a4.5,4.5,0,0,0-.76-.86l-.22-.2a7,7,0,0,0-.79-.55l-.09-.06a8.88,8.88,0,0,0-.95-.44L26.45,91c-.3-.11-.59-.2-.86-.27-.46-.11-.86-.17-1.14-.21l-.44,0h0c-.59,0-1.19-.09-1.81-.12.84.78,1.36,1.3,1.45,1.4l.24.24a10.09,10.09,0,0,0,6.78,2.71s-1,.92-10.67-.75l-.24,0-.33,0h0a29.76,29.76,0,0,1-5.35-1.74h0l-2.75-1.09a11.85,11.85,0,0,1,7-2.12c-1.2-1-2.58-2.1-4-3.15H2l.12-1.08c0-.08.15-1.48.33-3.79a7.86,7.86,0,0,0-.84,0h0l-.38,0c-.17.07-.31.21-.14.51a2.5,2.5,0,0,0,.74.85A2.47,2.47,0,0,1,.16,81.21c-.63-1,.67-1.87,2.16-1.75ZM76.78,49.11c.53-5.66,1.25-14.21,2.15-17.46a15.6,15.6,0,0,1-1.28-1,144.6,144.6,0,0,0-.87,18.5ZM74.63,80a11.89,11.89,0,0,1,1.8-.35c0-.46-.07-1-.1-1.48-.57.67-1.15,1.28-1.7,1.83Zm-5,3.82h7.17c-.06-.66-.15-1.61-.24-2.76a18.56,18.56,0,0,0-6.93,2.76ZM58.69,92.48l.07,0c1.06.59,4.54-.45,7.31-1.59a17.09,17.09,0,0,0-5.08-.6c-1.07,1-1.88,1.72-2.3,2.14ZM40.5,92.14c7,0,13-2.55,16.48-6.35.27-.3.53-.62.78-.94a.61.61,0,0,1,.07-.1,9.16,9.16,0,0,0,.61-.92,9.74,9.74,0,0,0,1.46-5.06c0-7.37-8.7-13.37-19.4-13.37s-19.4,6-19.4,13.37a9.83,9.83,0,0,0,1.45,5.06c.19.32.4.62.62.92l.08.1c.24.32.5.64.77.94,3.43,3.8,9.52,6.35,16.48,6.35ZM20,90.34a17.09,17.09,0,0,0-5.08.6c2.78,1.14,6.25,2.18,7.31,1.59l.07,0c-.42-.42-1.22-1.18-2.3-2.14ZM4.57,79.66a12.14,12.14,0,0,1,1.8.35c-.55-.55-1.13-1.16-1.7-1.83,0,.52-.07,1-.1,1.48Zm-.35,4.17h7.17a18.62,18.62,0,0,0-6.93-2.76c-.09,1.15-.18,2.1-.24,2.76Zm0-34.72a144.6,144.6,0,0,0-.87-18.5,15.6,15.6,0,0,1-1.28,1C3,34.9,3.68,43.45,4.22,49.11Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/AbilityScoreBoxSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/boxes/AbilityScoreBoxSvg/index.ts
new file mode 100644
index 0000000..5efcaa9
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/AbilityScoreBoxSvg/index.ts
@@ -0,0 +1,4 @@
+import AbilityScoreBoxSvg from "./AbilityScoreBoxSvg";
+
+export default AbilityScoreBoxSvg;
+export { AbilityScoreBoxSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/ArmorClassBoxSvg/ArmorClassBoxSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/ArmorClassBoxSvg/ArmorClassBoxSvg.tsx
new file mode 100644
index 0000000..7198dc0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/ArmorClassBoxSvg/ArmorClassBoxSvg.tsx
@@ -0,0 +1,54 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class ArmorClassBoxSvg extends React.PureComponent<Props> {
+  render() {
+    const { theme, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-armor-class-box-svg", className];
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 79 90">
+        <path
+          fill={theme.backgroundColor}
+          d="M72.8,30.7v13.7c-1,3.6-9.7,30.9-31.9,38.6c-0.3-0.4-0.8-0.7-1.4-0.7c-0.6,0-1,0.3-1.4,0.7
+                        C26,78.7,17.9,68.6,12.9,59.8c0,0,0,0,0,0c-0.3-0.5-0.6-1-0.8-1.5c-3.6-6.7-5.4-12.4-5.9-14V30.7c0.7-0.3,1.2-0.9,1.2-1.7
+                        c0-0.1,0-0.2-0.1-0.3c6.2-4,8.5-11.5,9.2-15.2L38.1,7c0.3,0.4,0.8,0.7,1.4,0.7c0.6,0,1.1-0.3,1.4-0.7l21.4,6.6
+                        c0.8,3.6,3,11.1,9.2,15.2V29c0,0.2,0,0.4,0.1,0.6C71.8,30.1,72.3,30.5,72.8,30.7z"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M73.2,27.3c-0.4,0-0.8,0.2-1.1,0.4c-5.8-3.9-7.9-11.3-8.6-14.5l-0.1-0.4l-22-6.7c-0.1-0.9-0.8-1.7-1.8-1.7
+                        s-1.7,0.8-1.8,1.7l-22,6.7l-0.1,0.4c-0.6,3.2-2.7,10.6-8.6,14.5c-0.3-0.3-0.7-0.4-1.1-0.4c-1,0-1.8,0.8-1.8,1.9
+                        c0,0.8,0.5,1.5,1.2,1.7v13.5v0.2c0.9,3.2,9.7,31.2,32.4,39.2c0.1,1,0.8,1.8,1.8,1.8s1.8-0.8,1.8-1.8c9.3-3.3,17.3-10.1,23.8-20.4
+                        c5.3-8.4,7.9-16.5,8.6-18.8V30.9c0.7-0.3,1.2-0.9,1.2-1.7C75,28.1,74.2,27.3,73.2,27.3z M72.5,44.3c-1,3.6-9.6,30.5-31.5,38.2
+                        c-0.3-0.4-0.8-0.7-1.4-0.7c-0.6,0-1,0.3-1.4,0.7C16.3,74.8,7.8,47.9,6.7,44.3V30.9c0.7-0.3,1.2-0.9,1.2-1.7c0-0.1,0-0.2-0.1-0.3
+                        c6.1-4,8.4-11.4,9.1-15l21.3-6.5c0.3,0.4,0.8,0.7,1.4,0.7c0.6,0,1.1-0.3,1.4-0.7l21.2,6.5c0.8,3.6,3,11,9.1,15c0,0.1,0,0.2,0,0.3
+                        c0,0.8,0.5,1.5,1.2,1.7V44.3z M73.2,27.3c-0.4,0-0.8,0.2-1.1,0.4c-5.8-3.9-7.9-11.3-8.6-14.5l-0.1-0.4l-22-6.7
+                        c-0.1-0.9-0.8-1.7-1.8-1.7s-1.7,0.8-1.8,1.7l-22,6.7l-0.1,0.4c-0.6,3.2-2.7,10.6-8.6,14.5c-0.3-0.3-0.7-0.4-1.1-0.4
+                        c-1,0-1.8,0.8-1.8,1.9c0,0.8,0.5,1.5,1.2,1.7v13.5v0.2c0.9,3.2,9.7,31.2,32.4,39.2c0.1,1,0.8,1.8,1.8,1.8s1.8-0.8,1.8-1.8
+                        c9.3-3.3,17.3-10.1,23.8-20.4c5.3-8.4,7.9-16.5,8.6-18.8V30.9c0.7-0.3,1.2-0.9,1.2-1.7C75,28.1,74.2,27.3,73.2,27.3z M72.5,44.3
+                        c-1,3.6-9.6,30.5-31.5,38.2c-0.3-0.4-0.8-0.7-1.4-0.7c-0.6,0-1,0.3-1.4,0.7C16.3,74.8,7.8,47.9,6.7,44.3V30.9
+                        c0.7-0.3,1.2-0.9,1.2-1.7c0-0.1,0-0.2-0.1-0.3c6.1-4,8.4-11.4,9.1-15l21.3-6.5c0.3,0.4,0.8,0.7,1.4,0.7c0.6,0,1.1-0.3,1.4-0.7
+                        l21.2,6.5c0.8,3.6,3,11,9.1,15c0,0.1,0,0.2,0,0.3c0,0.8,0.5,1.5,1.2,1.7V44.3z M78.1,24.5c-8.7-1.8-9.9-14.9-9.9-15l-0.1-0.8L39.5,0
+                        L10.9,8.7l-0.1,0.8c0,0.1-1.2,13.3-9.9,15l-1,0.2v20.4v0.3C0,45.8,9.6,82.1,39.1,89.9l0.3,0.1l0.3-0.1C69.5,82.1,79,45.8,79.1,45.4
+                        V24.7L78.1,24.5z M76.7,45C76,47.5,66.6,80.1,39.5,87.5C12.6,80.1,3.2,47.4,2.5,45V26.7c8.3-2.4,10.3-13,10.7-16.1l26.4-8l26.4,8
+                        c0.4,3.1,2.4,13.7,10.7,16.1V45z M63.5,13.2l-0.1-0.4l-22-6.7c-0.1-0.9-0.8-1.7-1.8-1.7s-1.7,0.8-1.8,1.7l-22,6.7l-0.1,0.4
+                        c-0.6,3.2-2.7,10.6-8.6,14.5c-0.3-0.3-0.7-0.4-1.1-0.4c-1,0-1.8,0.8-1.8,1.9c0,0.8,0.5,1.5,1.2,1.7v13.5v0.2
+                        c0.9,3.2,9.7,31.2,32.4,39.2c0.1,1,0.8,1.8,1.8,1.8s1.8-0.8,1.8-1.8c9.3-3.3,17.3-10.1,23.8-20.4c5.3-8.4,7.9-16.5,8.6-18.8V30.9
+                        c0.7-0.3,1.2-0.9,1.2-1.7c0-1-0.8-1.9-1.8-1.9c-0.4,0-0.8,0.2-1.1,0.4C66.2,23.9,64.1,16.4,63.5,13.2z M72.5,30.9v13.5
+                        c-1,3.6-9.6,30.5-31.5,38.2c-0.3-0.4-0.8-0.7-1.4-0.7c-0.6,0-1,0.3-1.4,0.7C16.3,74.8,7.8,47.9,6.7,44.3V30.9
+                        c0.7-0.3,1.2-0.9,1.2-1.7c0-0.1,0-0.2-0.1-0.3c6.1-4,8.4-11.4,9.1-15l21.3-6.5c0.3,0.4,0.8,0.7,1.4,0.7c0.6,0,1.1-0.3,1.4-0.7
+                        l21.2,6.5c0.8,3.6,3,11,9.1,15c0,0.1,0,0.2,0,0.3C71.3,30,71.8,30.6,72.5,30.9z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/ArmorClassBoxSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/boxes/ArmorClassBoxSvg/index.ts
new file mode 100644
index 0000000..9bd9621
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/ArmorClassBoxSvg/index.ts
@@ -0,0 +1,4 @@
+import ArmorClassBoxSvg from "./ArmorClassBoxSvg";
+
+export default ArmorClassBoxSvg;
+export { ArmorClassBoxSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/AttunementSlotBoxSvg/AttunementSlotBoxSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/AttunementSlotBoxSvg/AttunementSlotBoxSvg.tsx
new file mode 100644
index 0000000..656f4b5
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/AttunementSlotBoxSvg/AttunementSlotBoxSvg.tsx
@@ -0,0 +1,46 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class AttunementSlotBoxSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-attunement-slot-box-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 247.1 50">
+        <defs>
+          <rect id="SVGID_1_" x="-38.5" y="-152.3" width="612" height="792" />
+        </defs>
+        <clipPath id="SVGID_2_">
+          <use xlinkHref="#SVGID_1_" style={{ overflow: "visible" }} />
+        </clipPath>
+        <path
+          fill={fillColor}
+          clipPath="url(#SVGID_2_)"
+          d="M27.3,8c1.4,1.2,3.1,2.4,5.2,3.2c2,0.8,4.2,1.1,6.5,1.1c2.8,3.5,4.5,7.9,4.5,12.8c0,4.8-1.7,9.3-4.5,12.8
+                    c-2.3-0.1-4.4,0.3-6.5,1.1c-2.1,0.8-3.8,1.9-5.2,3.2c-2,0.7-6.2,1.9-11.3,2.1C8.4,41.1,2.9,33.7,2.9,25c0-8.7,5.5-16.1,13.2-19
+                    C21.1,6.1,25.3,7.3,27.3,8 M49.7,9.3L49.7,9.3l180.8,0c3.5,1.3,12.5,5.1,14.7,10.7v5v5c-2.1,5.5-11.2,9.4-14.7,10.7H49.7l0,0
+                    c-2.6-1.3-5-2.1-7.4-2.6c2.6-3.7,4.1-8.3,4.1-13.1s-1.5-9.4-4.1-13.1C44.7,11.4,47.2,10.6,49.7,9.3 M40.3,9.3h6.8
+                    c-1.9,0.8-3.7,1.3-5.5,1.6C41.2,10.3,40.7,9.8,40.3,9.3 M239.6,9.3c0.8,1.3,3.1,4.7,5.5,6.2v2.1c-2.6-3.9-8-6.7-11.7-8.4H239.6z
+                     M245.2,34.5c-2.4,1.5-4.7,4.9-5.5,6.2h-6.2c3.7-1.6,9.1-4.5,11.7-8.4V34.5z M40.3,40.7c0.5-0.5,0.9-1,1.3-1.6
+                    c1.8,0.3,3.6,0.8,5.5,1.6H40.3z M22.2,0c-0.3,0.1-0.4,0.4-0.3,0.7c0,0.1,0.2,0.4,0.5,1C19.1,1.9,16,2.7,13.2,4
+                    c2.7-0.3,6.9-0.1,10.9,0.7c0.1,0,0.1,0,0.2,0C24.5,5,24.7,5.3,25,5.6c-18.4-4.3-23.1,5-23.1,5C3.5,9,5.3,7.8,7.3,6.9
+                    c0.6-0.2,1.2-0.3,1.8-0.4C3.6,10.8,0,17.5,0,25c0,7.5,3.6,14.2,9.1,18.5c-0.6-0.1-1.2-0.3-1.8-0.4c-2-0.8-3.9-2-5.5-3.7
+                    c0,0,4.8,9.3,23.1,5c-0.2,0.3-0.5,0.6-0.7,0.9c-0.1,0-0.1,0-0.2,0c-4,0.8-8.2,1-10.9,0.7c2.8,1.4,5.9,2.1,9.2,2.3
+                    c-0.3,0.6-0.5,1-0.5,1c-0.1,0.3,0,0.6,0.3,0.7c0.3,0.1,0.6,0,0.7-0.3c0,0,4.3-8.3,10-9.8c1.7-0.5,3.3-0.9,5.1-1
+                    c-2.9,3.2-6.8,5.4-11.2,6.2c-1.2,1.2-1.7,2.3-1.9,3.2c3.3-0.2,6.3-1.2,9.1-2.6l3.1-2c0.4-0.3,0.8-0.6,1.1-0.9h202.5l0.3-0.5
+                    c0.8-1.4,3.4-5.2,5.5-6.2l0.6-0.3V25V14.3l-0.6-0.3c-2.1-1-4.7-4.8-5.5-6.2l-0.3-0.5H38.2c-0.4-0.3-0.7-0.6-1.1-0.9l-3.1-2
+                    C31.3,3,28.2,2,24.9,1.8c0.2,0.9,0.7,2,1.9,3.2c4.4,0.8,8.3,3,11.2,6.2c-1.8-0.1-3.5-0.5-5.1-1c-5.6-1.6-10-9.8-10-9.8
+                    C22.8,0.1,22.5-0.1,22.2,0"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/AttunementSlotBoxSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/boxes/AttunementSlotBoxSvg/index.ts
new file mode 100644
index 0000000..6c3f224
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/AttunementSlotBoxSvg/index.ts
@@ -0,0 +1,15 @@
+import { asEmptySvg, asThemedSvg, asThemedWithOpacitySvg } from "../../hocs";
+import AttunementSlotBoxSvg from "./AttunementSlotBoxSvg";
+
+const EmptyAttunementSlotBoxSvg = asEmptySvg(AttunementSlotBoxSvg);
+const ThemedAttunementSlotBoxSvg = asThemedSvg(AttunementSlotBoxSvg);
+const ThemedWithOpacityAttunementSlotBoxSvg =
+  asThemedWithOpacitySvg(AttunementSlotBoxSvg);
+
+export default AttunementSlotBoxSvg;
+export {
+  AttunementSlotBoxSvg,
+  EmptyAttunementSlotBoxSvg,
+  ThemedAttunementSlotBoxSvg,
+  ThemedWithOpacityAttunementSlotBoxSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/InitiativeBoxSvg/InitiativeBoxSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/InitiativeBoxSvg/InitiativeBoxSvg.tsx
new file mode 100644
index 0000000..50dd74c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/InitiativeBoxSvg/InitiativeBoxSvg.tsx
@@ -0,0 +1,36 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class InitiativeBoxSvg extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-initiative-box-svg", className];
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 70 45">
+        <polygon
+          fill={theme.backgroundColor}
+          points="68.8,22.5 55.8,43.3 14.2,43.3 1.2,22.5 14.2,1.8 14.3,1.7 55.7,1.7 55.8,1.8 "
+        />
+        <path
+          fill={theme.themeColor}
+          d="M59.1,0H10.9L0,17.2v10.5L10.9,45H59l11-17.2V17.2L59.1,0z M58.2,2.2l10,15.8v3L56.5,2.3l-0.1-0.1H58.2z M14.8,2.2h40.5
+                        l0.1,0.1L68,22.5L55.3,42.8H14.7L2,22.5L14.8,2.2L14.8,2.2z M1.8,18l10-15.8h1.8l-0.1,0.1L1.8,21V18z M11.8,42.8L1.8,27v-3
+                        l11.7,18.8H11.8z M68.2,27l-10,15.8h-1.7L68.2,24V27z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/InspirationBoxSvg/InspirationBoxSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/InspirationBoxSvg/InspirationBoxSvg.tsx
new file mode 100644
index 0000000..548644f
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/InspirationBoxSvg/InspirationBoxSvg.tsx
@@ -0,0 +1,63 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class InspirationBoxSvg extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-inspiration-box-svg", className];
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 72 54">
+        <defs>
+          <polygon
+            id="InspirationBoxSvg-path-1"
+            points="71.7300755 53.9993077 71.7300755 0.798923077 0.000275471698 0.798923077 0.000275471698 53.9993077"
+          />
+        </defs>
+        <g
+          id="InspirationBoxSvg-Page-1"
+          stroke="none"
+          strokeWidth="1"
+          fill="none"
+          fillRule="evenodd"
+        >
+          <g
+            id="InspirationBoxSvg-Sheet_Desktop_Static"
+            transform="translate(-1484.000000, -280.000000)"
+          >
+            <g
+              id="InspirationBoxSvg-Page-1"
+              transform="translate(1484.000000, 280.000000)"
+            >
+              <polygon
+                id="InspirationBoxSvg-Fill-1"
+                fill={theme.backgroundColor}
+                points="70 2 70 51 50.05556 51 42.7471616 47.5987134 29.2706337 47.5987134 21.9430711 51 2 51 2 2 21.3270795 2 27.9441984 6.34142368 44.0749658 6.34142368 50.6729205 2"
+              />
+              <g id="InspirationBoxSvg-Group-4">
+                <g id="InspirationBoxSvg-Clip-3" />
+                <path
+                  d="M71.7303509,6.16223077 L71.7303509,0.798230769 L49.3978604,0.798230769 L48.9033887,1.42269231 C48.0728415,2.47223077 47.0508415,3.29746154 45.9186528,3.88592308 C43.1198604,2.67438462 40.1668038,1.99176923 37.1848226,1.83392308 C36.9492943,1.33407692 36.4534453,0.979615385 35.8639358,0.979615385 C35.2771811,0.979615385 34.7785774,1.33407692 34.5458038,1.83392308 C31.5624453,1.99176923 28.6121434,2.67438462 25.8133509,3.88592308 C24.6797849,3.29746154 23.6577849,2.47223077 22.8286151,1.42269231 L22.3341434,0.798230769 L0.000275471698,0.798230769 L0.000275471698,53.9993077 L22.3341434,53.9993077 L22.8286151,53.3762308 C23.6577849,52.3280769 24.6770302,51.5000769 25.8092189,50.9143846 C28.6025019,52.1300769 31.530766,52.8223846 34.5526906,52.9774615 C34.7909736,53.4703846 35.2826906,53.8179231 35.8639358,53.8179231 C36.4451811,53.8179231 36.9396528,53.4703846 37.1751811,52.9774615 C40.1998604,52.8223846 43.1295019,52.1300769 45.9227849,50.9143846 C47.0522189,51.5000769 48.0742189,52.3280769 48.9033887,53.3762308 L49.3978604,53.9993077 L71.7303509,53.9993077 L71.7303509,48.6366923 L71.7303509,6.16223077 Z M71.7303509,11.4348462 L71.7303509,8.76253846 L71.7303509,11.4348462 Z M34.6546151,3.23238462 C34.9121811,3.63946154 35.3474264,3.92330769 35.8639358,3.92330769 C36.3832,3.92330769 36.8156906,3.63946154 37.0773887,3.23238462 C39.4230302,3.35146154 41.7452566,3.81253846 43.9793321,4.61976923 C43.2934075,4.79007692 42.5854453,4.88284615 41.8692189,4.88284615 L29.8627849,4.88284615 C29.1424264,4.88284615 28.4372189,4.79007692 27.7540491,4.61976923 C29.9853698,3.81253846 32.3089736,3.35146154 34.6546151,3.23238462 L34.6546151,3.23238462 Z M37.0760113,51.5651538 C36.8143132,51.1594615 36.3818226,50.8728462 35.8639358,50.8728462 C35.3474264,50.8728462 34.9149358,51.1594615 34.6573698,51.5651538 C32.3089736,51.4474615 29.9853698,50.9863846 27.7540491,50.1763846 C28.4372189,50.0074615 29.1424264,49.9146923 29.8627849,49.9146923 L41.8692189,49.9146923 C42.5854453,49.9146923 43.2934075,50.0074615 43.9793321,50.1763846 C41.7452566,50.9863846 39.4202755,51.4474615 37.0760113,51.5651538 L37.0760113,51.5651538 Z M50.9515208,50.6914615 C48.6058792,48.0856154 45.3374075,46.6054615 41.8692189,46.6054615 L29.8627849,46.6054615 C26.3932189,46.6054615 23.1261245,48.0856154 20.780483,50.6914615 L18.5918604,50.6914615 C18.5918604,50.6914615 3.29078491,50.6291538 3.29078491,42.6537692 L3.29078491,12.1437692 C3.29078491,4.167 18.5918604,4.10746154 18.5918604,4.10746154 L20.780483,4.10746154 C23.1261245,6.71192308 26.3932189,8.19069231 29.8627849,8.19069231 L41.8692189,8.19069231 C45.3374075,8.19069231 48.6058792,6.71192308 50.9515208,4.10746154 L53.138766,4.10746154 C53.138766,4.10746154 68.4384642,4.167 68.4384642,12.1437692 L68.4384642,42.6537692 C68.4384642,50.6291538 53.138766,50.6914615 53.138766,50.6914615 L50.9515208,50.6914615 Z M71.7303509,46.0363846 L71.7303509,43.3626923 L71.7303509,46.0363846 Z"
+                  id="InspirationBoxSvg-Fill-2"
+                  fill={theme.themeColor}
+                />
+              </g>
+            </g>
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/SavingThrowRowBoxSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/SavingThrowRowBoxSvg.tsx
new file mode 100644
index 0000000..20c4eea
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/SavingThrowRowBoxSvg.tsx
@@ -0,0 +1,43 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class SavingThrowRowBoxSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-saving-throw-row-box-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 116.1 34">
+        <g id="SavingThrowRowBoxSvg-Page-1_1_">
+          <g
+            id="SavingThrowRowBoxSvg-Sheet_Desktop_Static"
+            transform="translate(-683.000000, -651.000000)"
+          >
+            <path
+              fill={fillColor}
+              id="SavingThrowRowBoxSvg-Page-1"
+              d="M789.8,651h-22l-0.3,0.2c-1.2,0.8-2.3,1.7-3.2,2.7h-75.6l-0.3,0.4c-0.7,1.2-3,4.5-4.9,5.4
+                            l-0.5,0.2l0,16.1l0.5,0.2c1.8,0.9,4.1,4.2,4.9,5.4l0.3,0.4h75.6c1,1,2.1,1.9,3.2,2.7l0.3,0.2h21.9l0.3-0.2c5.6-3.8,9-10,9-16.8
+                            s-3.4-13-9-16.8L789.8,651z M797.1,668c0,5.8-2.9,11.2-7.6,14.5h-10.3c-4.7-2.1-11.1-3.2-14.3-3.8c-2.3-3-3.7-6.8-3.7-10.7v0
+                            c0-3.9,1.3-7.7,3.7-10.7c3.1-0.6,9.5-1.7,14.3-3.8h10.3C794.3,656.8,797.1,662.2,797.1,668L797.1,668z M752.8,655.6
+                            c0.8,0.7,2.5,1.8,5.7,2.1c-0.9,1.5-3,5.5-3,10.3s2,8.8,3,10.3c-3.2,0.3-4.9,1.4-5.7,2.1h-55.4c-3.1-1.1-11.1-4.5-12.9-9.3l0-6.2
+                            c1.9-4.8,9.9-8.1,12.9-9.3H752.8z M759.6,657.8c0.6,0,1.3,0,2,0c-1.8,3.1-2.8,6.6-2.8,10.3v0c0,3.7,1,7.2,2.9,10.3
+                            c-0.7,0-1.3-0.1-2,0c-0.6-1-3.1-5.2-3.1-10.2S759,658.8,759.6,657.8L759.6,657.8z M768.9,682.5c-1.1-0.8-2.1-1.7-3-2.6
+                            c2.4,0.5,5.1,1.3,8.3,2.6H768.9L768.9,682.5z M762.2,679.3c0.3,0.4,0.5,0.7,0.8,1.1h-8.5C755.9,679.7,758.3,678.9,762.2,679.3
+                            L762.2,679.3z M689.3,680.4c-0.7-1.1-2.8-4.1-4.9-5.4v-1.9c2.3,3.4,7.1,5.9,10.4,7.3H689.3L689.3,680.4z M684.4,661
+                            c2.1-1.3,4.2-4.3,4.9-5.4h5.5c-3.3,1.4-8,3.9-10.4,7.3V661L684.4,661z M763,655.6c-0.3,0.4-0.5,0.7-0.8,1.1
+                            c-3.9,0.4-6.3-0.4-7.7-1.1H763z M765.9,656.1c0.9-1,1.9-1.9,3-2.6h5.3C771,654.8,768.2,655.6,765.9,656.1L765.9,656.1z"
+            />
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/SavingThrowRowSmallBoxSvg/SavingThrowRowSmallBoxSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/SavingThrowRowSmallBoxSvg/SavingThrowRowSmallBoxSvg.tsx
new file mode 100644
index 0000000..21dad26
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/SavingThrowRowSmallBoxSvg/SavingThrowRowSmallBoxSvg.tsx
@@ -0,0 +1,30 @@
+import React from "react";
+
+import { BaseSvg } from "../../../BaseSvg";
+import { InjectedSvgProps } from "../../../hocs";
+
+export default class SavingThrowRowSmallBoxSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-saving-throw-row-small-box-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 88 28">
+        <g id="SavingThrowRowSmallBoxSvg-Page-1">
+          <g id="SavingThrowRowSmallBoxSvg-Sheet_Desktop_Static">
+            <path
+              id="SavingThrowRowSmallBoxSvg-Page-1-2"
+              fill={fillColor}
+              d="M81.02068,0H64.331l-.22758.1652a13.19155,13.19155,0,0,0-2.4276,2.23009H4.32415l-.22758.3304c-.531.99116-2.27586,3.7168-3.71726,4.46018L0,7.35107V20.64893l.37931.1652c1.36551.74338,3.11033,3.469,3.71726,4.46018l.22758.3304h57.3517a20.96667,20.96667,0,0,0,2.4276,2.23009L64.331,28H80.94484l.22757-.1652A17.166,17.166,0,0,0,88,13.95876,17.166,17.166,0,0,0,81.17241.08273ZM86.5586,14.04124a15.10111,15.10111,0,0,1-5.7655,11.97635H72.97932c-3.56553-1.73449-8.42067-2.64307-10.84827-3.13862a15.53188,15.53188,0,0,1-2.8069-8.83773h0a14.98609,14.98609,0,0,1,2.8069-8.83773C64.48276,4.708,69.338,3.79937,72.97932,2.06489H80.7931a14.8801,14.8801,0,0,1,5.7655,11.97635ZM52.95171,3.79937a7.09114,7.09114,0,0,0,4.32415,1.73449A18.4022,18.4022,0,0,0,55,14.04119a17.50539,17.50539,0,0,0,2.27586,8.50732A7.09144,7.09144,0,0,0,52.95171,24.283H10.92411c-2.35171-.90853-8.42067-3.7168-9.78623-7.68137V11.4807c1.4414-3.96458,7.51037-6.69022,9.78623-7.68138h42.0276Zm5.15862,1.81711h1.51724a18.00564,18.00564,0,0,0-2.12413,8.50733h0a17.221,17.221,0,0,0,2.2,8.50733,9.30868,9.30868,0,0,0-1.51724,0,18.18447,18.18447,0,0,1-2.35171-8.42475,19.36161,19.36161,0,0,1,2.27582-8.58991Zm7.05521,20.40111a19.90907,19.90907,0,0,1-2.27587-2.14747,34.16144,34.16144,0,0,1,6.29655,2.14747Zm-5.08277-2.64307c.22757.3304.37931.57818.60689.90853H54.24138a9.56687,9.56687,0,0,1,5.84139-.90853ZM4.7793,24.2831A15.78928,15.78928,0,0,0,1.062,19.82292V18.25359c1.74482,2.80827,5.38619,4.87315,7.88967,6.02946H4.7793ZM1.06209,8.25955A15.7888,15.7888,0,0,0,4.77935,3.79937H8.95176C6.44832,4.95573,2.8828,7.02062,1.06209,9.82884V8.25955ZM60.68966,3.79937c-.22758.33041-.37932.57818-.60689.90853a9.56642,9.56642,0,0,1-5.84139-.90853Zm2.2.413a11.52883,11.52883,0,0,1,2.27587-2.14746h4.02068a36.16356,36.16356,0,0,1-6.29655,2.14746Z"
+            />
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/SavingThrowRowSmallBoxSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/SavingThrowRowSmallBoxSvg/index.ts
new file mode 100644
index 0000000..d47ce62
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/SavingThrowRowSmallBoxSvg/index.ts
@@ -0,0 +1,3 @@
+import SavingThrowRowSmallBoxSvg from "./SavingThrowRowSmallBoxSvg";
+
+export default SavingThrowRowSmallBoxSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/index.ts
new file mode 100644
index 0000000..afd9c51
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowRowBoxSvg/index.ts
@@ -0,0 +1,18 @@
+import { asEmptySvg, asThemedSvg } from "../../hocs";
+import SavingThrowRowBoxSvg from "./SavingThrowRowBoxSvg";
+import SavingThrowRowSmallBoxSvg from "./SavingThrowRowSmallBoxSvg";
+
+const EmptySavingThrowRowBoxSvg = asEmptySvg(SavingThrowRowBoxSvg);
+const ThemedSavingThrowRowBoxSvg = asThemedSvg(SavingThrowRowBoxSvg);
+const EmptySavingThrowRowSmallBoxSvg = asEmptySvg(SavingThrowRowSmallBoxSvg);
+const ThemedSavingThrowRowSmallBoxSvg = asThemedSvg(SavingThrowRowSmallBoxSvg);
+
+export default SavingThrowRowBoxSvg;
+export {
+  SavingThrowRowBoxSvg,
+  SavingThrowRowSmallBoxSvg,
+  EmptySavingThrowRowBoxSvg,
+  ThemedSavingThrowRowBoxSvg,
+  EmptySavingThrowRowSmallBoxSvg,
+  ThemedSavingThrowRowSmallBoxSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/SavingThrowSelectionBoxSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/SavingThrowSelectionBoxSvg.tsx
new file mode 100644
index 0000000..7f3554b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/SavingThrowSelectionBoxSvg.tsx
@@ -0,0 +1,29 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+import SavingThrowRowBoxSvg from "../SavingThrowRowBoxSvg";
+
+export default class SavingThrowSelectionBoxSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-saving-throw-selection-box-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <React.Fragment>
+        <BaseSvg className={classNames.join(" ")} viewBox="0 0 41 36">
+          <path
+            d="M10.8724 1H30.3426C30.9246 1 31.4467 1.15738 31.8408 1.45807C35.0159 3.88086 40 9.69489 40 18C40 26.3051 35.0159 32.1191 31.8408 34.5419C31.4467 34.8426 30.9246 35 30.3426 35H10.8724C10.1907 35 9.57613 34.7818 9.1371 34.3765C6.08124 31.555 1.5 25.4781 1.5 18C1.5 10.5219 6.08124 4.44504 9.1371 1.62354C9.57613 1.21818 10.1907 1 10.8724 1Z"
+            stroke="#BFCCD6"
+            strokeWidth="1"
+          />
+        </BaseSvg>
+      </React.Fragment>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/SavingThrowSelectionSmallBoxSvg/SavingThrowSelectionSmallBoxSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/SavingThrowSelectionSmallBoxSvg/SavingThrowSelectionSmallBoxSvg.tsx
new file mode 100644
index 0000000..c66af98
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/SavingThrowSelectionSmallBoxSvg/SavingThrowSelectionSmallBoxSvg.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+import { BaseSvg } from "../../../BaseSvg";
+import { InjectedSvgProps } from "../../../hocs";
+
+export default class SavingThrowSelectionSmallBoxSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = [
+      "ddbc-saving-throw-selection-small-box-svg",
+    ];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 41 36">
+        <path
+          d="M10.8724 1H30.3426C30.9246 1 31.4467 1.15738 31.8408 1.45807C35.0159 3.88086 40 9.69489 40 18C40 26.3051 35.0159 32.1191 31.8408 34.5419C31.4467 34.8426 30.9246 35 30.3426 35H10.8724C10.1907 35 9.57613 34.7818 9.1371 34.3765C6.08124 31.555 1.5 25.4781 1.5 18C1.5 10.5219 6.08124 4.44504 9.1371 1.62354C9.57613 1.21818 10.1907 1 10.8724 1Z"
+          stroke="#BFCCD6"
+          strokeWidth="1"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/SavingThrowSelectionSmallBoxSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/SavingThrowSelectionSmallBoxSvg/index.ts
new file mode 100644
index 0000000..dea4c63
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/SavingThrowSelectionSmallBoxSvg/index.ts
@@ -0,0 +1,3 @@
+import SavingThrowSelectionSmallBoxSvg from "./SavingThrowSelectionSmallBoxSvg";
+
+export default SavingThrowSelectionSmallBoxSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/index.ts
new file mode 100644
index 0000000..3ed1011
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SavingThrowSelectionBoxSvg/index.ts
@@ -0,0 +1,24 @@
+import { asEmptySvg, asThemedSvg } from "../../hocs";
+import SavingThrowSelectionBoxSvg from "./SavingThrowSelectionBoxSvg";
+import SavingThrowSelectionSmallBoxSvg from "./SavingThrowSelectionSmallBoxSvg";
+
+const EmptySavingThrowSelectionBoxSvg = asEmptySvg(SavingThrowSelectionBoxSvg);
+const ThemedSavingThrowSelectionBoxSvg = asThemedSvg(
+  SavingThrowSelectionBoxSvg
+);
+const EmptySavingThrowSelectionSmallBoxSvg = asEmptySvg(
+  SavingThrowSelectionSmallBoxSvg
+);
+const ThemedSavingThrowSelectionSmallBoxSvg = asThemedSvg(
+  SavingThrowSelectionSmallBoxSvg
+);
+
+export default SavingThrowSelectionBoxSvg;
+export {
+  SavingThrowSelectionBoxSvg,
+  SavingThrowSelectionSmallBoxSvg,
+  EmptySavingThrowSelectionBoxSvg,
+  ThemedSavingThrowSelectionBoxSvg,
+  EmptySavingThrowSelectionSmallBoxSvg,
+  ThemedSavingThrowSelectionSmallBoxSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/SenseRowBoxSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/SenseRowBoxSvg.tsx
new file mode 100644
index 0000000..9dc440e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/SenseRowBoxSvg.tsx
@@ -0,0 +1,44 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class SenseRowBoxSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-sense-row-box-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 241 34">
+        <g id="SenseRowBoxSvg-Page-1_1_">
+          <g
+            id="SenseRowBoxSvg-Sheet_Desktop_Static"
+            transform="translate(-683.000000, -651.000000)"
+          >
+            <path
+              id="SenseRowBoxSvg-Page-1"
+              fill={fillColor}
+              d="M692.1,651.2c-5.7,3.8-9.1,10-9.1,16.8s3.4,13,9.1,16.8l0.3,0.2h22.1l0.3-0.2
+                            c1.2-0.8,2.3-1.7,3.3-2.7h200.2l0.3-0.4c0.7-1.2,3-4.5,4.9-5.4l0.5-0.2l0-16.1l-0.5-0.2c-1.9-0.9-4.2-4.2-4.9-5.4l-0.3-0.4H718.1
+                            c-1-1-2.1-1.9-3.3-2.7l-0.3-0.2h-22.1L692.1,651.2z M685.5,668c0-5.8,2.9-11.2,7.6-14.5h10.3c4.7,2.1,11.1,3.2,14.3,3.8
+                            c2.3,3,3.7,6.8,3.7,10.7v0c0,3.9-1.3,7.7-3.7,10.7c-3.1,0.6-9.5,1.7-14.3,3.8h-10.3C688.4,679.2,685.5,673.8,685.5,668L685.5,668z
+                             M909.3,655.6c3.1,1.1,11.1,4.5,12.9,9.3l0,6.2c-1.9,4.8-9.9,8.2-12.9,9.3H729.9c-0.8-0.7-2.5-1.8-5.7-2.1c0.9-1.5,3-5.5,3-10.3
+                            s-2-8.8-3-10.3c3.2-0.3,4.9-1.4,5.7-2.1H909.3z M723.1,657.8c0.6,1,3.1,5.2,3.1,10.2s-2.5,9.2-3.1,10.2c-0.6,0-1.3,0-2,0
+                            c1.8-3.1,2.9-6.6,2.9-10.3v0c0-3.7-1-7.2-2.8-10.3C721.8,657.8,722.5,657.8,723.1,657.8L723.1,657.8z M713.8,682.5h-5.3
+                            c3.2-1.3,6-2.1,8.3-2.6C715.9,680.8,714.9,681.7,713.8,682.5L713.8,682.5z M720.5,679.3c3.9-0.4,6.3,0.4,7.7,1.1h-8.5
+                            C719.9,680,720.2,679.7,720.5,679.3L720.5,679.3z M917.4,680.4h-5.5c3.3-1.4,8.1-3.9,10.4-7.3v1.9
+                            C920.1,676.3,918.1,679.3,917.4,680.4L917.4,680.4z M922.2,661v1.9c-2.3-3.4-7.1-5.9-10.4-7.3h5.5
+                            C918.1,656.7,920.1,659.7,922.2,661L922.2,661z M728.1,655.6c-1.4,0.7-3.7,1.4-7.7,1.1c-0.3-0.4-0.5-0.7-0.8-1.1H728.1z
+                             M716.8,656.1c-2.4-0.5-5.1-1.3-8.3-2.6h5.3C714.9,654.3,715.9,655.2,716.8,656.1L716.8,656.1z"
+            />
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/SenseRowSmallBoxSvg/SenseRowSmallBoxSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/SenseRowSmallBoxSvg/SenseRowSmallBoxSvg.tsx
new file mode 100644
index 0000000..a064489
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/SenseRowSmallBoxSvg/SenseRowSmallBoxSvg.tsx
@@ -0,0 +1,30 @@
+import React from "react";
+
+import { BaseSvg } from "../../../BaseSvg";
+import { InjectedSvgProps } from "../../../hocs";
+
+export default class SenseRowSmallBoxSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-sense-row-small-box-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 188 33.90015">
+        <g id="SenseRowSmallBoxSvg-Page-1">
+          <g id="SenseRowSmallBoxSvg-Sheet_Desktop_Static">
+            <path
+              id="SenseRowSmallBoxSvg-Page-1-2"
+              fill={fillColor}
+              d="M8.72855.10016A20.33138,20.33138,0,0,0,0,16.90015a20.33152,20.33152,0,0,0,8.72855,16.8l.28774.2h21.198l.28774-.2a20.90539,20.90539,0,0,0,3.1653-2.7H182.53264l.28774-.4c.67144-1.2,2.87756-4.5,4.7-5.4l.47959-.2v-16.1l-.47959-.2c-1.82247-.9-4.02859-4.2-4.7-5.4l-.28774-.4H33.66733A20.9054,20.9054,0,0,0,30.502.2L30.2143,0H9.01635Zm-6.33059,16.8a18.01,18.01,0,0,1,7.28977-14.5h9.87959c4.50817,2.1,10.64692,3.2,13.71632,3.8a18.26332,18.26332,0,0,1,3.549,10.7h0a17.62364,17.62364,0,0,1-3.549,10.7c-2.97345.6-9.11225,1.7-13.71632,3.8H9.68773a18.01,18.01,0,0,1-7.28977-14.5ZM173.9,4.50012c2.97345,1.1,10.64692,4.5,12.3735,9.3v6.2c-1.82247,4.8-9.49595,8.2-12.3735,9.3H44.98575a9.16413,9.16413,0,0,0-5.46736-2.1,21.57693,21.57693,0,0,0,2.87755-10.3,20.52873,20.52873,0,0,0-2.87755-10.3,9.16452,9.16452,0,0,0,5.46736-2.1H173.9Zm-135.43679,2.2a21.34515,21.34515,0,0,1,2.97345,10.2,21.34509,21.34509,0,0,1-2.97345,10.2H36.54489a21.15057,21.15057,0,0,0,2.78165-10.3h0a21.06756,21.06756,0,0,0-2.6857-10.3,5.67381,5.67381,0,0,0,1.82241.19995Zm-8.9204,24.7H24.45919a47.13553,47.13553,0,0,1,7.96122-2.6,24.74945,24.74945,0,0,1-2.87756,2.6Zm6.42655-3.2a12.55865,12.55865,0,0,1,7.38573,1.1H35.20206a7.63546,7.63546,0,0,1,.76734-1.1Zm145.70007,1.1H176.394c3.16529-1.4,7.76936-3.9,9.97553-7.3v1.9c-2.11027,1.29992-4.02864,4.29992-4.7,5.4Zm4.60407-19.4v1.9c-2.20611-3.4-6.81018-5.9-9.97554-7.3h5.27551c.76734,1.1,2.68571,4.1,4.7,5.4Zm-143.01437-5.4c-1.34288.7-3.549,1.4-7.38572,1.1-.28775-.4-.4796-.7-.76734-1.1Zm-10.83876.5a44.52529,44.52529,0,0,1-7.96122-2.6h5.08366a24.74848,24.74848,0,0,1,2.87756,2.6Z"
+            />
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/SenseRowSmallBoxSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/SenseRowSmallBoxSvg/index.ts
new file mode 100644
index 0000000..61d6270
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/SenseRowSmallBoxSvg/index.ts
@@ -0,0 +1,3 @@
+import SenseRowSmallBoxSvg from "./SenseRowSmallBoxSvg";
+
+export default SenseRowSmallBoxSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/index.ts
new file mode 100644
index 0000000..6675b76
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/SenseRowBoxSvg/index.ts
@@ -0,0 +1,18 @@
+import { asEmptySvg, asThemedSvg } from "../../hocs";
+import SenseRowBoxSvg from "./SenseRowBoxSvg";
+import SenseRowSmallBoxSvg from "./SenseRowSmallBoxSvg";
+
+const EmptySenseRowBoxSvg = asEmptySvg(SenseRowBoxSvg);
+const ThemedSenseRowBoxSvg = asThemedSvg(SenseRowBoxSvg);
+const EmptySenseRowSmallBoxSvg = asEmptySvg(SenseRowSmallBoxSvg);
+const ThemedSenseRowSmallBoxSvg = asThemedSvg(SenseRowSmallBoxSvg);
+
+export default SenseRowBoxSvg;
+export {
+  SenseRowBoxSvg,
+  SenseRowSmallBoxSvg,
+  EmptySenseRowBoxSvg,
+  ThemedSenseRowBoxSvg,
+  EmptySenseRowSmallBoxSvg,
+  ThemedSenseRowSmallBoxSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg317x89/BeveledBoxSvg317x89.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg317x89/BeveledBoxSvg317x89.tsx
new file mode 100644
index 0000000..9508556
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg317x89/BeveledBoxSvg317x89.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class BeveledBoxSvg317x89 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 317 88.98">
+        <path
+          fill={theme.backgroundColor}
+          d="M9.35,8,7,10.29a38.78,38.78,0,0,1,.35,6.19l.85,57c0,4.29.29,6.67,3.67,9.37l3.76,2.46c2.56,2,19.53,1.87,9.58,1.87l271.48-.68c3.29,0,5.19-2.23,7.75-4.28l3-2.64c3.38-2.7,1.7-2.4,1.7-6.69L310,17.06c0-4.28-.76-8-4.13-10.71h0a18.9,18.9,0,0,0-10.39-3.64L19.59,2.48A36.38,36.38,0,0,0,9.35,8Z"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M305.89,0H11.1L0,9V79.93l11.1,9H305.89l11.11-9V9ZM294.34,86.5H22.6A24.06,24.06,0,0,1,8.69,78.78V10.24a24.36,24.36,0,0,1,14-7.76H294.4a24.09,24.09,0,0,1,13.91,7.72V78.73a24.36,24.36,0,0,1-14,7.77ZM3.05,21.16a27.77,27.77,0,0,1,4-8.79V76.63c-.37-.53-.76-1-1.09-1.62a27.78,27.78,0,0,1-2.89-7.1ZM310,12.34c.37.54.76,1.05,1.09,1.62A28,28,0,0,1,314,21.07V67.81a27.91,27.91,0,0,1-4,8.8Zm4-2.27v7a26.94,26.94,0,0,0-4-6.77v-.13h-.1a24.53,24.53,0,0,0-11.24-7.68h6ZM12.37,2.48h6A24.53,24.53,0,0,0,7.13,10.16H7v.13a26.94,26.94,0,0,0-4,6.77v-7ZM3.05,78.91v-7a26.81,26.81,0,0,0,4,6.78v.13h.1A24.61,24.61,0,0,0,18.37,86.5h-6ZM304.63,86.5h-6a24.61,24.61,0,0,0,11.24-7.68h.1v-.13a26.81,26.81,0,0,0,4-6.78v7Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg517x660/BeveledBoxSvg517x660.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg517x660/BeveledBoxSvg517x660.tsx
new file mode 100644
index 0000000..c8bbb3d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg517x660/BeveledBoxSvg517x660.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class BeveledBoxSvg517x660 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 517 660">
+        <path
+          fill={theme.backgroundColor}
+          d="M509.2,646.2c-1.7,5.7-12.9,11.7-14.5,11.7H22.5c-1.7,0-12.8-6-14.5-11.7L8.2,19.3V12S16.1,2.3,23.4,1.4H493.80005c7.3.8,15.1,10.6,15.1,10.6v7.3Z"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M505.9,0H11L0,11.5v637L11,660H506l11-11.5V11.5ZM3,12.8l9.2-9.6h5.9A25.8384,25.8384,0,0,0,7,12.9H6.9v.2A36.38553,36.38553,0,0,0,3,21.7ZM3,26.9A42.92655,42.92655,0,0,1,6.9,15.7V644.3a13.90069,13.90069,0,0,1-1.1-2.1,51.50646,51.50646,0,0,1-2.9-9L3,26.9Zm9.2,629.9L3,647.2v-8.9a40.90524,40.90524,0,0,0,3.9,8.6v.2H7a24.86426,24.86426,0,0,0,11.1,9.8H12.2Zm10.1,0A22.56646,22.56646,0,0,1,8.6,647V13A23.74954,23.74954,0,0,1,22.4,3.1H494.6a22.56647,22.56647,0,0,1,13.7,9.8v634a23.74956,23.74956,0,0,1-13.8,9.9Zm491.6-9.6-9.2,9.6h-5.9a24.86437,24.86437,0,0,0,11.1-9.8h.1v-.2a36.38635,36.38635,0,0,0,3.9-8.6l.00006,9Zm0-14.1a41.717,41.717,0,0,1-3.9,11.2V15.7a13.89825,13.89825,0,0,1,1.1,2.1,51.50837,51.50837,0,0,1,2.9,9l-.1,606.3Zm0-611.4a40.9054,40.9054,0,0,0-3.9-8.6v-.2h-.1a24.86433,24.86433,0,0,0-11.1-9.8h5.9l9.2,9.6-.00007,9Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg623x660/BeveledBoxSvg623x660.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg623x660/BeveledBoxSvg623x660.tsx
new file mode 100644
index 0000000..c56cdcb
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg623x660/BeveledBoxSvg623x660.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class BeveledBoxSvg623x660 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 623 660">
+        <path
+          fill={theme.backgroundColor}
+          d="M615.2,646.2c-1.7,5.7-12.9,11.7-14.5,11.7H22.5c-1.7,0-12.8-6-14.5-11.7L8.2,19.3V12S16.1,2.3,23.4,1.4H599.80005c7.3.8,15.1,10.6,15.1,10.6v7.3Z"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M611.9,0H11L0,11.5v637L11,660H612l11-11.5V11.5ZM3,12.8l9.2-9.6h5.9A25.8384,25.8384,0,0,0,7,12.9H6.9v.2A36.38553,36.38553,0,0,0,3,21.7ZM3,26.9A42.92655,42.92655,0,0,1,6.9,15.7V644.3a13.90069,13.90069,0,0,1-1.1-2.1,51.50646,51.50646,0,0,1-2.9-9L3,26.9Zm9.2,629.9L3,647.2v-8.9a40.90524,40.90524,0,0,0,3.9,8.6v.2H7a24.86426,24.86426,0,0,0,11.1,9.8H12.2Zm10.1,0A22.56646,22.56646,0,0,1,8.6,647V13A23.74954,23.74954,0,0,1,22.4,3.1H600.6a22.56647,22.56647,0,0,1,13.7,9.8v634a23.74956,23.74956,0,0,1-13.8,9.9Zm597.6-9.6-9.2,9.6h-5.9a24.86437,24.86437,0,0,0,11.1-9.8h.1v-.2a36.38635,36.38635,0,0,0,3.9-8.6l.00006,9Zm0-14.1a41.717,41.717,0,0,1-3.9,11.2V15.7a13.89825,13.89825,0,0,1,1.1,2.1,51.50837,51.50837,0,0,1,2.9,9l-.1,606.3Zm0-611.4a40.9054,40.9054,0,0,0-3.9-8.6v-.2h-.1a24.86433,24.86433,0,0,0-11.1-9.8h5.9l9.2,9.6-.00007,9Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg94x89/BeveledBoxSvg94x89.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg94x89/BeveledBoxSvg94x89.tsx
new file mode 100644
index 0000000..850b180
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/BeveledBoxSvg/BeveledBoxSvg94x89/BeveledBoxSvg94x89.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class BeveledBoxSvg94x89 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 94 89">
+        <path
+          fill={theme.backgroundColor}
+          d="M87.54,9.45a42.28,42.28,0,0,1-3-3A42.91,42.91,0,0,0,74.21,1H18.36a11,11,0,0,0-1.53.59A4.9,4.9,0,0,1,15.36,2.7,21.09,21.09,0,0,0,6,12.28a5.14,5.14,0,0,1,.12,1.59,5.15,5.15,0,0,1,.24,1.18c1,12.72.57,25.84.4,38.59-.09,6.5,0,13-.05,19.48,0,2-.11,4.08-.22,6.12a17.93,17.93,0,0,0,2.78,2.94A73.22,73.22,0,0,0,16.51,87H78l.07-.06a32.31,32.31,0,0,0,9.31-8.5c.13-6,.65-12,.36-18s.2-11.89.36-17.9c.16-6.53,0-13.11-.17-19.64C87.84,18.57,88.07,13.86,87.54,9.45Z"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M85,0H9L0,9.05V80l9,9H85l9-9V9.05Zm6.55,10.08v7a29.26,29.26,0,0,0-3.24-6.78v-.13h-.08a20.45,20.45,0,0,0-9.13-7.69H84ZM75.6,86.52H18.36a19,19,0,0,1-11.3-7.73V10.25A19.27,19.27,0,0,1,18.4,2.48H75.64a18.94,18.94,0,0,1,11.3,7.73V78.75A19.27,19.27,0,0,1,75.6,86.52ZM2.47,21.18a31.7,31.7,0,0,1,3.24-8.8V76.64c-.3-.53-.62-1-.89-1.62a32.92,32.92,0,0,1-2.35-7.11Zm85.82-8.82c.3.53.62,1,.89,1.62a32.92,32.92,0,0,1,2.35,7.11V67.81a31.64,31.64,0,0,1-3.24,8.81ZM10.05,2.48h4.87a20.45,20.45,0,0,0-9.13,7.69H5.71v.13a29.26,29.26,0,0,0-3.24,6.78v-7ZM2.47,78.92v-7A29.45,29.45,0,0,0,5.71,78.7v.13h.08a20.45,20.45,0,0,0,9.13,7.69H10.05ZM84,86.52H79.08a20.45,20.45,0,0,0,9.13-7.69h.08V78.7a29.45,29.45,0,0,0,3.24-6.78v7Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg230x200/FancyBoxSvg230x200.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg230x200/FancyBoxSvg230x200.tsx
new file mode 100644
index 0000000..c39c933
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg230x200/FancyBoxSvg230x200.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class FancyBoxSvg230x200 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 230 200">
+        <path
+          fill={theme.backgroundColor}
+          d="M223.79241,153.59a27.608,27.608,0,0,0-.92665-3c-1.70385-4.27-1.12594-39.26-1.12594-39.26s0-12.67-.57791-30.9c-.34874-11.2,1.56437-25,3.08887-33.94a8.35593,8.35593,0,0,1-2.98922-8.09,11.90127,11.90127,0,0,1,.78717-2.54,28.715,28.715,0,0,1,.25908-3.46c-.81706-5.25-1.116-10.74-3.63688-15.42s-6.82542-7.78-10.6018-11.19c-.0797-.08-.12954-.15-.1993-.23-2.212-1.06-4.59343-1.79-6.75563-3a6.12742,6.12742,0,0,1-.837-.57H30.07152c-.77719.52-1.58428,1-2.34155,1.57a4.15331,4.15331,0,0,1-2.81982.68c-6.20761,5.4-13.023,9-15.67347,17.58a47.09122,47.09122,0,0,0-1.7736,9.43,3.20851,3.20851,0,0,1,.09964.42c.269,1.51.41849,3,.568,4.54,0,0,.12954.91.12954,1a14.64046,14.64046,0,0,0,.548,1.93,4.62021,4.62021,0,0,1-1.46472,4.95,5.5453,5.5453,0,0,1-2.48105,3c1.50457,9,3.328,22.38,2.98922,33.33-.57792,18.23-.57792,30.9-.57792,30.9s.57792,35-1.12593,39.26a27.95546,27.95546,0,0,0-1.08609,3.65A4.77275,4.77275,0,0,1,8.051,157.4c1.30529,4,.40853,8.33-.7772,12.49A4.69483,4.69483,0,0,1,7.473,171c1.13591,12.88,10.08363,21.75,21.42273,26.68A4.7335,4.7335,0,0,1,30.71919,199h165.0244c1.933-.54,3.89595-1,5.78912-1.65a3.81486,3.81486,0,0,1,1.30529-.86,4.58851,4.58851,0,0,1,2.41131-1.31l.74731-.19a3.86723,3.86723,0,0,1,1.05618-.81c1.24551-.62,2.54083-1.18,3.77639-1.85a17.07178,17.07178,0,0,1,1.70385-1.4,3.15462,3.15462,0,0,1,.64765-.36c.0797-.09.15943-.17.22919-.26s.568-.83.568-.83a5.37543,5.37543,0,0,1,2.45115-2.06c.44839-.55.87684-1.12,1.28537-1.69l.09965-.12a37.40281,37.40281,0,0,0,4.703-17.11,3.01265,3.01265,0,0,1,0-.31c-1.64406-3.32-1.2754-6.59-1.5245-10.19A4.68107,4.68107,0,0,1,223.79241,153.59Z"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M224.29061,101.4v2c.76723-12.53,2.63053-42.67,5.50015-52L230,50.72l-.59785-.37a20.84247,20.84247,0,0,1-3.66677-3.08,61.10991,61.10991,0,0,1,2.33159-9.38l.11956-.34L225.70552,10l-1.0761-.34c-2.51093-.78-9.67509-3.91-9.67509-8V0H15.03577V1.68c0,4.05-6.97485,7.12-9.67511,8L4.28455,10,1.81346,37.56l.11957.34a61.71326,61.71326,0,0,1,2.33159,9.36,20.993,20.993,0,0,1-3.66678,3.1L0,50.74l.20925.67c2.86964,9.33,4.723,39.41,5.49019,52v-2C4.982,113.87,3.07889,139.25.20925,148.59L0,149.27l.59784.37a20.84352,20.84352,0,0,1,3.66678,3.08A59.97805,59.97805,0,0,1,1.933,162.1l-.11957.34L4.28455,190l1.07611.34c2.6903.84,9.67511,3.91,9.67511,8V200H214.9543v-1.68c0-4,6.97484-7.12,9.67509-8l1.0761-.34,2.4711-27.58-.11956-.34a61.71415,61.71415,0,0,1-2.33159-9.36,20.99378,20.99378,0,0,1,3.66677-3.1l.59785-.38-.20924-.67c-2.86965-9.33-4.72295-34.65-5.49021-47.19m-3.82619,62.1s.44839,1.05.9964,2.57a28.78706,28.78706,0,0,1-1.3252,12.18c-2.93941,8.6-10.12349,14.89-20.805,18.39H30.56973c-22.91733-7.48-22.718-25.21-22.08035-30.51.58788-1.59,1.05619-2.7,1.08608-2.78A11.8232,11.8232,0,0,0,7.483,153.74c3.36785-18.48,1.654-42,1.57432-43.08V89.42C9.147,88.25,10.86083,64.68,7.493,46.19A12.03425,12.03425,0,0,0,9.52564,36.5s-.44838-1.06-.99641-2.57a28.78762,28.78762,0,0,1,1.3053-12.18C12.82374,13.15,19.958,6.85,30.64944,3.36H199.42033c22.96714,7.48,22.718,25.21,22.08036,30.51-.58788,1.59-1.05619,2.7-1.08608,2.78a11.82318,11.82318,0,0,0,2.09246,9.57c-3.36786,18.48-1.654,42-1.57431,43.08v21.28c-.08967,1.17-1.80349,24.74,1.56437,43.23a12.03425,12.03425,0,0,0-2.04262,9.69m7.38337-112c-1.70385,6-2.98922,17.24-3.98563,27.91a184.99022,184.99022,0,0,1,1.49461-29.93,24.6963,24.6963,0,0,0,2.491,2m-5.69945-14.31c.08968-.2,1.12595-2.66,2.11238-5.71l.50818,5.64a58.84459,58.84459,0,0,0-1.74377,6.47,9.19916,9.19916,0,0,1-.88682-6.35m.4185-24.74,1.23554,13.81a30.597,30.597,0,0,1-.99641,3.62,29.09268,29.09268,0,0,0-1.54442-8.55c-1.99281-5.88-6.85527-13.33-18.35379-18h8.858c1.2455,5.13,7.97124,8.1,10.76117,9.12M17.745,3.36h8.88C9.985,10.1,6.955,22.74,6.705,30c-.38-1.23-.74-2.52-1-3.75l1.24-13.77c2.79-1,9.55-4,10.8-9.12m-13,33.79.51-5.64c1,3,2,5.43,2.07,5.56a9.4,9.4,0,0,1-.83,6.44,59.8691,59.8691,0,0,0-1.73-6.36M4.135,49.5a184.3395,184.3395,0,0,1,1.51,29.94c-1-10.67-2.29-21.88-4-27.91a22.88006,22.88006,0,0,0,2.49-2m-2.49,99c1.71-6,3-17.24,4-27.91a184.33119,184.33119,0,0,1-1.5,29.93,23.41786,23.41786,0,0,0-2.5-2m5.72,14.31c-.09.2-1.13,2.66-2.12,5.71l-.51-5.63a59.48905,59.48905,0,0,0,1.76-6.51,9.17,9.17,0,0,1,.89,6.35m-.42,24.74-1.26-13.81a31.59812,31.59812,0,0,1,1-3.62,29,29,0,0,0,1.55,8.55c2,5.89,6.88,13.33,18.42,18h-8.93c-1.25-5.13-8-8.1-10.8-9.12m204.86064,9.12h-8.84809c16.58021-6.73,19.59932-19.38,19.84842-26.68.37864,1.23.73733,2.52.9964,3.75l-1.23553,13.81c-2.78,1-9.51566,4-10.76117,9.12M224.759,162.86l-.50818,5.63c-.99641-3-1.99281-5.43-2.06257-5.56a9.44012,9.44012,0,0,1,.84695-6.44,60.89563,60.89563,0,0,0,1.7238,6.37m.59785-12.36a184.99938,184.99938,0,0,1-1.50459-29.94c.99641,10.67,2.28178,21.88,3.98563,27.91a22.811,22.811,0,0,0-2.481,2"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg230x765/FancyBoxSvg230x765.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg230x765/FancyBoxSvg230x765.tsx
new file mode 100644
index 0000000..944ab50
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg230x765/FancyBoxSvg230x765.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class FancyBoxSvg230x765 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 230 765">
+        <path
+          fill={theme.backgroundColor}
+          d="M224.09593,719a32.58075,32.58075,0,0,0-1.22463-4.29c-1.70252-4.36-1.12506-582.66-1.12506-582.66s0-30.43-.57746-49c-.35841-11.85,1.71249-26.54,3.26566-35.6a3.99385,3.99385,0,0,1-1.48347-1.64c-1.69258-3.61-2.39947-7.49-.99563-11.35a6.27817,6.27817,0,0,1,.92593-1.69c-.697-3.15-.32855-6.48-1.29431-9.54a42.83292,42.83292,0,0,0-3.52453-7,18.648,18.648,0,0,0-4.97814-6.37c-1.99126-1.48-4.06215-2.5-5.77463-4.27-1.73238-.72-3.47475-1.42-5.17726-2.21l-.39825-.21H29.28142a5.06422,5.06422,0,0,1-3.56435,1.27,5.80144,5.80144,0,0,1-2.24016,1.44l-.3883.12-.18917.05c-.41816.25-.86619.47-1.28436.74a7.30725,7.30725,0,0,0-1.21466.84c.99563-.91-.25887.24-.448.41a5.81329,5.81329,0,0,1-2.81762,1.33,51.94484,51.94484,0,0,0-3.88295,4c-4.56993,5.47-4.80889,13.51-6.21272,20.2a1.8288,1.8288,0,0,1-.10952.4,11.12318,11.12318,0,0,1,.28873,1.52c-.1593-1.2.08961.35.13939.59q.13938.63.29869,1.26a21.06275,21.06275,0,0,0,.87615,2.57c1.06532,2.59-1.16488,5.4-3.47474,6.15a3.19358,3.19358,0,0,1-.69694.14C5.914,55.14,8.204,70.62,7.82564,83c-.57747,18.57-.57747,49-.57747,49s.6372,576.13-.99563,587.33a5.14529,5.14529,0,0,1,3.05658,6,29.22893,29.22893,0,0,1-2.65832,7,4.69483,4.69483,0,0,1,.84628,2.91c-.26882,14.38,12.077,22.59,23.66608,28.18a5.66959,5.66959,0,0,1,.87615.53h166.1703a5.05453,5.05453,0,0,1,2.82758-1.08,4.08858,4.08858,0,0,1,1.583-1.45c.99563-.5,2.061-.93,3.10635-1.37l.63722-.27-.54758.24a6.826,6.826,0,0,0,1.28437-.6c.219-.11.448-.18.677-.27.99562-1,1.85185-1.92,2.39946-2.37,2.89728-2.43,6.20278-4.26,7.82562-7.81a4.37454,4.37454,0,0,1,1.73239-2c.80645-4.9,2.12069-9.72,2.5687-14.7a5.33774,5.33774,0,0,1,.56752-2,1.92248,1.92248,0,0,0-.1095-.51c-.37835-1.74-.8662-3.44-1.27441-5.17A4.80654,4.80654,0,0,1,224.09593,719Z"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M224.29507,654.52v-554c.76662-12.76,2.62847-38.62,5.49586-48.14L230,51.69l-.59738-.38a21.29124,21.29124,0,0,1-3.66391-3.14,63.02656,63.02656,0,0,1,2.32977-9.56l.11947-.34-2.47907-28.1-1.07527-.34c-2.509-.8-9.66754-4-9.66754-8.12V0H15.024V1.71c0,4.13-6.9694,7.26-9.66755,8.12l-1.07528.34L1.812,38.28l.11948.34a64.23307,64.23307,0,0,1,2.32977,9.54A20.93372,20.93372,0,0,1,.59738,51.32L0,51.7l.20908.69C3.07649,61.89,4.97814,87.7,5.695,100.48v554c-.71685,12.75-2.6185,48.62-5.48591,58.13L0,713.3l.59738.38a20.76441,20.76441,0,0,1,3.66391,3.14,61.86478,61.86478,0,0,1-2.32977,9.56l-.11948.35,2.46916,28.1,1.07528.34c2.68819.86,9.66755,4,9.66755,8.12V765H214.966v-1.71c0-4.13,6.9694-7.26,9.66754-8.12l1.07527-.34,2.46916-28.1-.11947-.35a64.23172,64.23172,0,0,1-2.32976-9.54,20.93312,20.93312,0,0,1,3.6639-3.16l.59738-.38-.20907-.69c-2.86741-9.5-4.71927-45.31-5.48592-58.09m-3.82321,73.29s.448,1.07.99563,2.61a29.91379,29.91379,0,0,1-1.32417,12.42c-2.91721,8.76-10.06582,15.16-20.76882,18.74H30.54587c-22.89945-7.63-22.70032-25.7-22.06312-31.09.58742-1.63,1.05537-2.75,1.08524-2.83a12.25228,12.25228,0,0,0-2.09082-9.76c3.36522-18.83,1.65274-42.81,1.57309-43.89V91.12c.08961-1.19,1.80209-25.21-1.56314-44.05a12.45343,12.45343,0,0,0,2.041-9.88s-.448-1.07-.99563-2.61A29.92378,29.92378,0,0,1,9.82685,22.16C12.764,13.4,19.91256,7,30.62552,3.42H199.44421c22.94921,7.63,22.7003,25.7,22.06311,31.09-.58741,1.63-1.05536,2.75-1.08523,2.84a12.23211,12.23211,0,0,0,2.09083,9.75c-3.36523,18.83-1.65275,42.81-1.57308,43.89V673.88c-.0896,1.19-1.80208,25.21,1.56314,44a12.45342,12.45342,0,0,0-2.041,9.88m7.87311-675.3c-1.71,6.15-3,17.57-4,28.45a191.48013,191.48013,0,0,1,1.5-30.51,23.5903,23.5903,0,0,0,2.5,2.06m-5.72-14.58c.09-.21,1.13-2.72,2.12-5.82l.51,5.74a61.15693,61.15693,0,0,0-1.75006,6.6,9.49991,9.49991,0,0,1-.89-6.47m.42-25.21,1.24,14.07a31.5754,31.5754,0,0,1-1,3.69,30.09944,30.09944,0,0,0-1.55-8.72c-2-6-6.88-13.57-18.42-18.34h8.89c1.25,5.24,8,8.26,10.8,9.3M18.17021,3.42h8.84118C10.44414,10.29,7.42738,23.17,7.17848,30.61c-.37834-1.25-.73677-2.56-.99563-3.82L7.41743,12.72c2.7778-1,9.50825-4.06,10.75278-9.3M5.22705,37.85l.50777-5.74c.99563,3.07,1.99125,5.53,2.061,5.66a9.76825,9.76825,0,0,1-.82637,6.56A62.4619,62.4619,0,0,0,5.247,37.85M4.64958,50.44A192.25139,192.25139,0,0,1,6.12311,81c-.99563-10.87-2.28-22.29-3.98251-28.44a21.82554,21.82554,0,0,0,2.47911-2.07m-2.47911,662c1.70252-6.15,2.98688-17.57,3.98251-28.44a192.24174,192.24174,0,0,1-1.49344,30.5,23.50089,23.50089,0,0,0-2.48907-2.06m5.695,14.58c-.0896.21-1.12506,2.72-2.11073,5.82l-.50777-5.74A60.75,60.75,0,0,0,6.9694,720.6a9.53688,9.53688,0,0,1,.8861,6.47m-.41816,25.21L6.18285,738.21a32.23,32.23,0,0,1,.99563-3.69,30.11827,30.11827,0,0,0,1.54322,8.72c1.99126,6,6.84992,13.57,18.33947,18.34h-8.891c-1.24453-5.24-7.965-8.26-10.75278-9.3m204.82758,9.3h-8.88c16.64-6.86,19.67-19.75,19.92-27.19.38,1.26.74,2.56,1,3.82l-1.24,14.07c-2.79,1-9.55,4.06-10.8,9.3m13-34.43-.51,5.74c-1-3.08-2-5.53-2.07-5.66a9.7301,9.7301,0,0,1,.85-6.56,62.23563,62.23563,0,0,0,1.73,6.48m.6-12.59a191.36971,191.36971,0,0,1-1.51-30.51c1,10.88,2.29,22.29,4,28.44a21.90029,21.90029,0,0,0-2.49,2.07"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg281x200/FancyBoxSvg281x200.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg281x200/FancyBoxSvg281x200.tsx
new file mode 100644
index 0000000..d2495a5
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg281x200/FancyBoxSvg281x200.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class FancyBoxSvg281x200 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 281 200">
+        <path
+          fill={theme.backgroundColor}
+          d="M274.78,153.59a27.53,27.53,0,0,0-.93-3c-1.71-4.27-1.13-39.26-1.13-39.26s0-12.67-.58-30.9c-.35-11.2,1.57-25,3.1-33.94a8.34,8.34,0,0,1-3-8.09,11.87,11.87,0,0,1,.79-2.54c0-1.16.12-2.31.26-3.46-.82-5.25-1.12-10.74-3.65-15.42S262.79,9.2,259,5.79c-.08-.08-.13-.15-.2-.23-2.22-1.06-4.61-1.79-6.78-3a6.15,6.15,0,0,1-.84-.57h-221c-.78.52-1.59,1-2.35,1.57A4.18,4.18,0,0,1,25,4.24c-6.23,5.4-13.07,9-15.73,17.58a46.94,46.94,0,0,0-1.78,9.43,3.2,3.2,0,0,1,.1.42c.27,1.51.42,3,.57,4.54,0,0,.13.91.13,1a14.6,14.6,0,0,0,.55,1.93,4.61,4.61,0,0,1-1.47,4.95,5.55,5.55,0,0,1-2.49,3c1.51,9,3.34,22.38,3,33.33-.58,18.23-.58,30.9-.58,30.9s.58,35-1.13,39.26a27.88,27.88,0,0,0-1.09,3.65,4.78,4.78,0,0,1,3,3.17c1.31,4,.41,8.33-.78,12.49A4.68,4.68,0,0,1,7.5,171C8.64,183.88,17.62,192.75,29,197.68A4.75,4.75,0,0,1,30.83,199h215.8c1.94-.54,3.91-1,5.81-1.65a3.83,3.83,0,0,1,1.31-.86,4.61,4.61,0,0,1,2.42-1.31l.75-.19a3.88,3.88,0,0,1,1.06-.81c1.25-.62,2.55-1.18,3.79-1.85a17.12,17.12,0,0,1,1.71-1.4,3.17,3.17,0,0,1,.65-.36c.08-.09.16-.17.23-.26s.57-.83.57-.83a5.39,5.39,0,0,1,2.46-2.06c.45-.55.88-1.12,1.29-1.69l.1-.12a37.3,37.3,0,0,0,4.72-17.11,3,3,0,0,1,0-.31c-1.65-3.32-1.28-6.59-1.53-10.19A4.68,4.68,0,0,1,274.78,153.59Z"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M275.28,101.4v2c.77-12.53,2.64-42.67,5.52-52l.21-.68-.6-.37a20.9,20.9,0,0,1-3.68-3.08,60.93,60.93,0,0,1,2.34-9.38l.12-.34L276.7,10l-1.08-.34c-2.52-.78-9.71-3.91-9.71-8V0H15.09V1.68c0,4.05-7,7.12-9.71,8L4.3,10,1.82,37.56l.12.34a61.53,61.53,0,0,1,2.34,9.36A21.05,21.05,0,0,1,.6,50.36l-.6.38.21.67c2.88,9.33,4.74,39.41,5.51,52v-2C5,113.87,3.09,139.25.21,148.59l-.21.68.6.37a20.9,20.9,0,0,1,3.68,3.08,59.8,59.8,0,0,1-2.34,9.38l-.12.34L4.3,190l1.08.34c2.7.84,9.71,3.91,9.71,8V200H265.91v-1.68c0-4,7-7.12,9.71-8l1.08-.34,2.48-27.58-.12-.34a61.53,61.53,0,0,1-2.34-9.36,21.05,21.05,0,0,1,3.68-3.1l.6-.38-.21-.67c-2.88-9.33-4.74-34.65-5.51-47.19m-3.84,62.1s.45,1.05,1,2.57a28.69,28.69,0,0,1-1.33,12.18c-2.95,8.6-10.16,14.89-20.88,18.39H30.68c-23-7.48-22.8-25.21-22.16-30.51.59-1.59,1.06-2.7,1.09-2.78a11.79,11.79,0,0,0-2.1-9.57c3.38-18.48,1.66-42,1.58-43.08V89.42c.09-1.17,1.81-24.74-1.57-43.23A12,12,0,0,0,9.56,36.5s-.45-1.06-1-2.57A28.69,28.69,0,0,1,9.87,21.75c3-8.6,10.16-14.9,20.89-18.39H250.32c23.05,7.48,22.8,25.21,22.16,30.51-.59,1.59-1.06,2.7-1.09,2.78a11.79,11.79,0,0,0,2.1,9.57c-3.38,18.48-1.66,42-1.58,43.08v21.28c-.09,1.17-1.81,24.74,1.57,43.23a12,12,0,0,0-2.05,9.69m7.41-112c-1.71,6-3,17.24-4,27.91a184.33,184.33,0,0,1,1.5-29.93,24.77,24.77,0,0,0,2.5,2m-5.72-14.31c.09-.2,1.13-2.66,2.12-5.71l.51,5.64A58.68,58.68,0,0,0,274,43.57a9.17,9.17,0,0,1-.89-6.35m.42-24.74,1.24,13.81c-.25,1.19-.59,2.43-1,3.62a29,29,0,0,0-1.55-8.55c-2-5.88-6.88-13.33-18.42-18h8.89c1.25,5.13,8,8.1,10.8,9.12M18.25,3.36h8.88C10.49,10.1,7.46,22.74,7.21,30c-.38-1.23-.74-2.52-1-3.75L7.45,12.48c2.79-1,9.55-4,10.8-9.12m-13,33.79.51-5.64c1,3,2,5.43,2.07,5.56A9.4,9.4,0,0,1,7,43.51a59.87,59.87,0,0,0-1.73-6.36M4.64,49.5A184.34,184.34,0,0,1,6.15,79.44c-1-10.67-2.29-21.88-4-27.91a22.88,22.88,0,0,0,2.49-2m-2.49,99c1.71-6,3-17.24,4-27.91a184.33,184.33,0,0,1-1.5,29.93,23.42,23.42,0,0,0-2.5-2m5.72,14.31c-.09.2-1.13,2.66-2.12,5.71l-.51-5.63A59.49,59.49,0,0,0,7,156.43a9.17,9.17,0,0,1,.89,6.35m-.42,24.74L6.21,173.71c.25-1.18.59-2.42,1-3.62a29,29,0,0,0,1.55,8.55c2,5.89,6.88,13.33,18.42,18H18.25c-1.25-5.13-8-8.1-10.8-9.12m255.3,9.12h-8.88c16.64-6.73,19.67-19.38,19.92-26.68.38,1.23.74,2.52,1,3.75l-1.24,13.81c-2.79,1-9.55,4-10.8,9.12m13-33.78-.51,5.63c-1-3-2-5.43-2.07-5.56a9.41,9.41,0,0,1,.85-6.44,60.72,60.72,0,0,0,1.73,6.37m.6-12.36a184.34,184.34,0,0,1-1.51-29.94c1,10.67,2.29,21.88,4,27.91a22.88,22.88,0,0,0-2.49,2"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg281x765/FancyBoxSvg281x765.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg281x765/FancyBoxSvg281x765.tsx
new file mode 100644
index 0000000..91d7ccc
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg281x765/FancyBoxSvg281x765.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class FancyBoxSvg281x765 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 281 765">
+        <path
+          fill={theme.backgroundColor}
+          d="M275.08,719a32.47,32.47,0,0,0-1.23-4.29c-1.71-4.36-1.13-582.66-1.13-582.66s0-30.43-.58-49c-.36-11.85,1.72-26.54,3.28-35.6a4,4,0,0,1-1.49-1.64c-1.7-3.61-2.41-7.49-1-11.35a6.27,6.27,0,0,1,.93-1.69c-.7-3.15-.33-6.48-1.3-9.54a42.76,42.76,0,0,0-3.54-7,18.66,18.66,0,0,0-5-6.37c-2-1.48-4.08-2.5-5.8-4.27-1.74-.72-3.49-1.42-5.2-2.21l-.4-.21H29.41a5.1,5.1,0,0,1-3.58,1.27,5.83,5.83,0,0,1-2.25,1.44L23.19,6,23,6.05c-.42.25-.87.47-1.29.74a7.34,7.34,0,0,0-1.22.84c1-.91-.26.24-.45.41a5.85,5.85,0,0,1-2.83,1.33,52.05,52.05,0,0,0-3.9,4c-4.59,5.47-4.83,13.51-6.24,20.2,0,.14-.08.27-.11.4a11.08,11.08,0,0,1,.29,1.52c-.16-1.2.09.35.14.59q.14.63.3,1.26a21,21,0,0,0,.88,2.57c1.07,2.59-1.17,5.4-3.49,6.15a3.22,3.22,0,0,1-.7.14C5.94,55.14,8.24,70.62,7.86,83c-.58,18.57-.58,49-.58,49s.64,576.13-1,587.33a5.14,5.14,0,0,1,3.07,6,29.15,29.15,0,0,1-2.67,7,4.68,4.68,0,0,1,.85,2.91c-.27,14.38,12.13,22.59,23.77,28.18a5.7,5.7,0,0,1,.88.53h216.9a5.09,5.09,0,0,1,2.84-1.08,4.1,4.1,0,0,1,1.59-1.45c1-.5,2.07-.93,3.12-1.37l.64-.27-.55.24a6.87,6.87,0,0,0,1.29-.6c.22-.11.45-.18.68-.27,1-1,1.86-1.92,2.41-2.37,2.91-2.43,6.23-4.26,7.86-7.81a4.38,4.38,0,0,1,1.74-2c.81-4.9,2.13-9.72,2.58-14.7a5.32,5.32,0,0,1,.57-2c0-.19-.07-.36-.11-.51-.38-1.74-.87-3.44-1.28-5.17A4.8,4.8,0,0,1,275.08,719Z"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M275.28,654.52v-554c.77-12.76,2.64-38.62,5.52-48.14l.21-.69-.6-.38a21.36,21.36,0,0,1-3.68-3.14,62.8,62.8,0,0,1,2.34-9.56l.12-.34L276.7,10.17l-1.08-.34c-2.52-.8-9.71-4-9.71-8.12V0H15.09V1.71c0,4.13-7,7.26-9.71,8.12l-1.08.34L1.82,38.28l.12.34a64,64,0,0,1,2.34,9.54A21,21,0,0,1,.6,51.32L0,51.7l.21.69C3.09,61.89,5,87.7,5.72,100.48v554C5,667.23,3.09,703.1.21,712.61L0,713.3l.6.38a20.83,20.83,0,0,1,3.68,3.14,61.64,61.64,0,0,1-2.34,9.56l-.12.35,2.48,28.1,1.08.34c2.7.86,9.71,4,9.71,8.12V765H265.91v-1.71c0-4.13,7-7.26,9.71-8.12l1.08-.34,2.48-28.1-.12-.35a64,64,0,0,1-2.34-9.54,21,21,0,0,1,3.68-3.16l.6-.38-.21-.69c-2.88-9.5-4.74-45.31-5.51-58.09m-3.84,73.29s.45,1.07,1,2.61a29.79,29.79,0,0,1-1.33,12.42C268.18,751.6,261,758,250.25,761.58H30.68c-23-7.63-22.8-25.7-22.16-31.09.59-1.63,1.06-2.75,1.09-2.83a12.21,12.21,0,0,0-2.1-9.76c3.38-18.83,1.66-42.81,1.58-43.89V91.12c.09-1.19,1.81-25.21-1.57-44.05a12.41,12.41,0,0,0,2.05-9.88s-.45-1.07-1-2.61A29.8,29.8,0,0,1,9.87,22.16C12.82,13.4,20,7,30.76,3.42H250.32c23.05,7.63,22.8,25.7,22.16,31.09-.59,1.63-1.06,2.75-1.09,2.84a12.19,12.19,0,0,0,2.1,9.75c-3.38,18.83-1.66,42.81-1.58,43.89V673.88c-.09,1.19-1.81,25.21,1.57,44a12.41,12.41,0,0,0-2.05,9.88m7.41-675.3c-1.71,6.15-3,17.57-4,28.45a191.48,191.48,0,0,1,1.5-30.51,23.59,23.59,0,0,0,2.5,2.06m-5.72-14.58c.09-.21,1.13-2.72,2.12-5.82l.51,5.74A61.16,61.16,0,0,0,274,44.4a9.5,9.5,0,0,1-.89-6.47m.42-25.21,1.24,14.07c-.25,1.21-.59,2.48-1,3.69a30.1,30.1,0,0,0-1.55-8.72c-2-6-6.88-13.57-18.42-18.34h8.89c1.25,5.24,8,8.26,10.8,9.3M18.25,3.42h8.88C10.49,10.29,7.46,23.17,7.21,30.61c-.38-1.25-.74-2.56-1-3.82L7.45,12.72c2.79-1,9.55-4.06,10.8-9.3m-13,34.43.51-5.74c1,3.07,2,5.53,2.07,5.66A9.73,9.73,0,0,1,7,44.33a62.24,62.24,0,0,0-1.73-6.48m-.6,12.59A191.42,191.42,0,0,1,6.15,81c-1-10.87-2.29-22.29-4-28.44a21.9,21.9,0,0,0,2.49-2.07M2.15,712.49c1.71-6.15,3-17.57,4-28.44a191.41,191.41,0,0,1-1.5,30.5,23.59,23.59,0,0,0-2.5-2.06m5.72,14.58c-.09.21-1.13,2.72-2.12,5.82l-.51-5.74A60.54,60.54,0,0,0,7,720.6a9.5,9.5,0,0,1,.89,6.47m-.42,25.21L6.21,738.21c.25-1.21.59-2.47,1-3.69a30,30,0,0,0,1.55,8.72c2,6,6.88,13.57,18.42,18.34H18.25c-1.25-5.24-8-8.26-10.8-9.3m255.3,9.3h-8.88c16.64-6.86,19.67-19.75,19.92-27.19.38,1.26.74,2.56,1,3.82l-1.24,14.07c-2.79,1-9.55,4.06-10.8,9.3m13-34.43-.51,5.74c-1-3.08-2-5.53-2.07-5.66a9.73,9.73,0,0,1,.85-6.56,62.24,62.24,0,0,0,1.73,6.48m.6-12.59a191.37,191.37,0,0,1-1.51-30.51c1,10.88,2.29,22.29,4,28.44a21.9,21.9,0,0,0-2.49,2.07"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg361x765/FancyBoxSvg361x765.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg361x765/FancyBoxSvg361x765.tsx
new file mode 100644
index 0000000..4a3a252
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/FancyBoxSvg/FancyBoxSvg361x765/FancyBoxSvg361x765.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class FancyBoxSvg361x765 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 361.00998 765">
+        <path
+          fill={theme.backgroundColor}
+          d="M355.08,719a32.47245,32.47245,0,0,0-1.23-4.29c-1.71-4.36-1.13-582.66-1.13-582.66s0-30.43-.58-49c-.36-11.85,1.72-26.54,3.28-35.6a4.00019,4.00019,0,0,1-1.49-1.64c-1.7-3.61-2.41-7.49-1-11.35a6.27,6.27,0,0,1,.93-1.69c-.7-3.15-.33-6.48-1.3-9.54a42.76049,42.76049,0,0,0-3.54-7,18.66,18.66,0,0,0-5-6.37c-2-1.48-4.08-2.5-5.8-4.27-1.74-.72-3.49-1.42-5.2-2.21l-.4-.21H29.41a5.1,5.1,0,0,1-3.58,1.27,5.82988,5.82988,0,0,1-2.25,1.44L23.19,6,23,6.05c-.42.25-.87.47-1.29.74a7.34028,7.34028,0,0,0-1.22.84c1-.91-.26.24-.45.41a5.84993,5.84993,0,0,1-2.83,1.33,52.0505,52.0505,0,0,0-3.9,4c-4.59,5.47-4.83,13.51-6.24,20.2a1.82259,1.82259,0,0,1-.11.4,11.08122,11.08122,0,0,1,.29,1.52c-.16-1.2.09.35.14.59q.14.63.3,1.26a21.00051,21.00051,0,0,0,.88,2.57c1.07,2.59-1.17,5.4-3.49,6.15a3.21992,3.21992,0,0,1-.7.14C5.94,55.14,8.24,70.62,7.86,83c-.58,18.57-.58,49-.58,49s.64,576.13-1,587.33a5.14,5.14,0,0,1,3.07,6,29.1505,29.1505,0,0,1-2.67,7,4.68007,4.68007,0,0,1,.85,2.91c-.27,14.38,12.13,22.59,23.77,28.18a5.6994,5.6994,0,0,1,.88.53h296.9a5.08977,5.08977,0,0,1,2.84-1.08,4.1,4.1,0,0,1,1.59-1.45c1-.5,2.07-.93,3.12-1.37l.64-.27-.55.24a6.86962,6.86962,0,0,0,1.29-.6c.22-.11.45-.18.68-.27,1-1,1.86-1.92,2.41-2.37,2.91-2.43,6.23-4.26,7.86-7.81a4.38024,4.38024,0,0,1,1.74-2c.81-4.9,2.13-9.72,2.58-14.7a5.31965,5.31965,0,0,1,.57-2,1.91507,1.91507,0,0,0-.11-.51c-.38-1.74-.87-3.44-1.28-5.17A4.8,4.8,0,0,1,355.08,719Z"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M355.28,654.52v-554c.77-12.76,2.64-38.62,5.52-48.14l.21-.69-.6-.38a21.35956,21.35956,0,0,1-3.68-3.14,62.79784,62.79784,0,0,1,2.34-9.56l.12-.34-2.49-28.1-1.08-.34c-2.52-.8-9.71-4-9.71-8.12V0H15.09V1.71c0,4.13-7,7.26-9.71,8.12l-1.08.34L1.82,38.28l.12.34a64.00013,64.00013,0,0,1,2.34,9.54A20.99964,20.99964,0,0,1,.6,51.32L0,51.7l.21.69C3.09,61.89,5,87.7,5.72,100.48v554C5,667.23,3.09,703.1.21,712.61L0,713.3l.6.38a20.83062,20.83062,0,0,1,3.68,3.14,61.63931,61.63931,0,0,1-2.34,9.56l-.12.35,2.48,28.1,1.08.34c2.7.86,9.71,4,9.71,8.12V765H345.91v-1.71c0-4.13,7-7.26,9.71-8.12l1.08-.34,2.48-28.1-.12-.35a63.99882,63.99882,0,0,1-2.34-9.54,20.99977,20.99977,0,0,1,3.68-3.16l.6-.38-.21-.69c-2.88-9.5-4.74-45.31-5.51-58.09m-3.84,73.29s.45,1.07,1,2.61a29.79032,29.79032,0,0,1-1.33,12.42C348.18,751.6,341,758,330.25,761.58H30.68c-23-7.63-22.8-25.7-22.16-31.09.59-1.63,1.06-2.75,1.09-2.83a12.21,12.21,0,0,0-2.1-9.76c3.38-18.83,1.66-42.81,1.58-43.89V91.12c.09-1.19,1.81-25.21-1.57-44.05a12.41,12.41,0,0,0,2.05-9.88s-.45-1.07-1-2.61a29.8,29.8,0,0,1,1.3-12.42C12.82,13.4,20,7,30.76,3.42H330.32c23.05,7.63,22.8,25.7,22.16,31.09-.59,1.63-1.06,2.75-1.09,2.84a12.18993,12.18993,0,0,0,2.1,9.75c-3.38,18.83-1.66,42.81-1.58,43.89V673.88c-.09,1.19-1.81,25.21,1.57,44a12.41,12.41,0,0,0-2.05,9.88m7.41-675.3c-1.71,6.15-3,17.57-4,28.45a191.48013,191.48013,0,0,1,1.5-30.51,23.5903,23.5903,0,0,0,2.5,2.06m-5.72-14.58c.09-.21,1.13-2.72,2.12-5.82l.51,5.74A61.15693,61.15693,0,0,0,354,44.4a9.49991,9.49991,0,0,1-.89-6.47m.42-25.21,1.24,14.07a31.5754,31.5754,0,0,1-1,3.69,30.09944,30.09944,0,0,0-1.55-8.72c-2-6-6.88-13.57-18.42-18.34h8.89c1.25,5.24,8,8.26,10.8,9.3M18.25,3.42h8.88C10.49,10.29,7.46,23.17,7.21,30.61c-.38-1.25-.74-2.56-1-3.82L7.45,12.72c2.79-1,9.55-4.06,10.8-9.3m-13,34.43.51-5.74c1,3.07,2,5.53,2.07,5.66A9.73,9.73,0,0,1,7,44.33a62.24043,62.24043,0,0,0-1.73-6.48m-.6,12.59A191.41937,191.41937,0,0,1,6.15,81c-1-10.87-2.29-22.29-4-28.44a21.9,21.9,0,0,0,2.49-2.07m-2.49,662c1.71-6.15,3-17.57,4-28.44a191.41024,191.41024,0,0,1-1.5,30.5,23.583,23.583,0,0,0-2.5-2.06m5.72,14.58c-.09.21-1.13,2.72-2.12,5.82l-.51-5.74A60.54042,60.54042,0,0,0,7,720.6a9.5,9.5,0,0,1,.89,6.47m-.42,25.21L6.21,738.21a32.11788,32.11788,0,0,1,1-3.69,29.99971,29.99971,0,0,0,1.55,8.72c2,6,6.88,13.57,18.42,18.34H18.25c-1.25-5.24-8-8.26-10.8-9.3m335.3,9.3h-8.88c16.64-6.86,19.67-19.75,19.92-27.19.38,1.26.74,2.56,1,3.82l-1.24,14.07c-2.79,1-9.55,4.06-10.8,9.3m13-34.43-.51,5.74c-1-3.08-2-5.53-2.07-5.66a9.7301,9.7301,0,0,1,.85-6.56,62.23563,62.23563,0,0,0,1.73,6.48m.6-12.59a191.36971,191.36971,0,0,1-1.51-30.51c1,10.88,2.29,22.29,4,28.44a21.90029,21.90029,0,0,0-2.49,2.07"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg228x338/SquaredBoxSvg228x338.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg228x338/SquaredBoxSvg228x338.tsx
new file mode 100644
index 0000000..d1680c9
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg228x338/SquaredBoxSvg228x338.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class SquaredBoxSvg228x338 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 228 338">
+        <polygon
+          fill={theme.backgroundColor}
+          points="8 336 221 336 221 2 8 2 8 336"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M228,6.39V4.47h-6.14V0h-2.68s-1.06,1.54-3.91,1.54H12.73C9.88,1.54,8.82,0,8.82,0H6.14V4.47H0V6.39c2.53,0,2.67,4.14,2.67,4.14V324.91S2.53,329,0,329v2H6.14v7H8.82V3.31H219.18V334.69H8.82V338s1.06-1.54,3.91-1.54H215.27c2.84,0,3.9,1.52,3.91,1.54h2.68v-7H228v-2c-2.53,0-2.67-4.13-2.67-4.13V10.53S225.47,6.39,228,6.39ZM6.27,324.91H4.14V12.12H6.27Zm217.79.48h-2.12V12.61h2.12Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg278x338/SquaredBoxSvg278x338.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg278x338/SquaredBoxSvg278x338.tsx
new file mode 100644
index 0000000..7b12534
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg278x338/SquaredBoxSvg278x338.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class SquaredBoxSvg278x338 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 278 338">
+        <polygon
+          fill={theme.backgroundColor}
+          points="8 336 271 336 271 2 8 2 8 336"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M278,6.39V4.47h-6.14V0h-2.68s-1.06,1.54-3.91,1.54H12.73C9.88,1.54,8.82,0,8.82,0H6.14V4.47H0V6.39c2.53,0,2.67,4.14,2.67,4.14V324.91S2.53,329,0,329V331H6.14v7H8.82V3.31H269.18V334.69H8.82V338s1.06-1.54,3.91-1.54H265.27c2.84,0,3.9,1.52,3.91,1.54h2.68v-7H278V329c-2.53,0-2.67-4.13-2.67-4.13V10.53s.14-4.14,2.67-4.14ZM6.27,324.91H4.14V12.12H6.27Zm267.79.48h-2.12V12.61h2.12Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg344x95/SquaredBoxSvg344x95.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg344x95/SquaredBoxSvg344x95.tsx
new file mode 100644
index 0000000..102fba1
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg344x95/SquaredBoxSvg344x95.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class SquaredBoxSvg344x95 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 344 95">
+        <polygon
+          fill={theme.backgroundColor}
+          points="8 93 337 93 337 2 8 2 8 93"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M344,6.39V4.47h-6.14V0h-2.68s-1.06,1.54-3.91,1.54H12.73C9.88,1.54,8.82,0,8.82,0H6.14V4.47H0V6.39c2.53,0,2.67,4.14,2.67,4.14V81.91S2.53,86,0,86v2H6.14v7H8.82V3.31H335.18V91.69H8.82V95s1.06-1.54,3.91-1.54H331.27c2.84,0,3.9,1.52,3.91,1.54h2.68V88H344V86c-2.53,0-2.67-4.13-2.67-4.13V10.53S341.47,6.39,344,6.39ZM6.27,81.91H4.14V12.12H6.27Zm333.79.48h-2.12V12.61h2.12Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg408x95/SquaredBoxSvg408x95.tsx b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg408x95/SquaredBoxSvg408x95.tsx
new file mode 100644
index 0000000..895bbf0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/boxes/themeBoxes/SquaredBoxSvg/SquaredBoxSvg408x95/SquaredBoxSvg408x95.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class SquaredBoxSvg408x95 extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    return (
+      <BaseSvg className={className} viewBox="0 0 408 95">
+        <polygon
+          fill={theme.backgroundColor}
+          points="8 93 401 93 401 2 8 2 8 93"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M408,6.39V4.47h-6.14V0h-2.68s-1.06,1.54-3.91,1.54H12.73C9.88,1.54,8.82,0,8.82,0H6.14V4.47H0V6.39c2.53,0,2.67,4.14,2.67,4.14V81.91S2.53,86,0,86v2H6.14v7H8.82V3.31H399.18V91.69H8.82V95s1.06-1.54,3.91-1.54H395.27c2.84,0,3.9,1.52,3.91,1.54h2.68V88H408V86c-2.53,0-2.67-4.13-2.67-4.13V10.53S405.47,6.39,408,6.39ZM6.27,81.91H4.14V12.12H6.27Zm397.79.48h-2.12V12.61h2.12Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/coin/CopperCoinSvg/CopperCoinSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/coin/CopperCoinSvg/CopperCoinSvg.tsx
new file mode 100644
index 0000000..45fdfae
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/coin/CopperCoinSvg/CopperCoinSvg.tsx
@@ -0,0 +1,56 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class CopperCoinSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 24 24" className={className}>
+        <path
+          clipRule="evenodd"
+          d="m6.41421 3c-.26521 0-.51957.10536-.7071.29289l-2.41422 2.41422c-.18753.18753-.29289.44189-.29289.7071v11.17159c0 .2652.10536.5196.29289.7071l2.41422 2.4142c.18753.1875.44189.2929.7071.2929h11.17159c.2652 0 .5196-.1054.7071-.2929l2.4142-2.4142c.1875-.1875.2929-.4419.2929-.7071v-11.17159c0-.26521-.1054-.51957-.2929-.7071l-2.4142-2.41422c-.1875-.18753-.4419-.29289-.7071-.29289zm5.58579 10.5c.8284 0 1.5-.6716 1.5-1.5s-.6716-1.5-1.5-1.5-1.5.6716-1.5 1.5.6716 1.5 1.5 1.5z"
+          fill="#ab6e57"
+          fillRule="evenodd"
+        />
+        <path
+          d="m10 9c0-1.10457.8954-2 2-2h4c1.1046 0 2 .89543 2 2v1c0 1.1046-.8954 2-2 2h-1c0-1.6569-1.3431-3-3-3-.7684 0-1.4692.28885-2 .76389z"
+          fill="#c2866f"
+        />
+        <path
+          d="m17.7071 7.94975-.6568-.65686c-.1876-.18753-.4419-.29289-.7072-.29289h-8.68625c-.26521 0-.51957.10536-.7071.29289l-.65686.65686c-.18753.18753-.29289.44189-.29289.7071v-1c0-.26521.10536-.51957.29289-.7071l.65686-.65686c.18753-.18753.44189-.29289.7071-.29289h8.68625c.2653 0 .5196.10536.7072.29289l.6568.65686c.1875.18753.2929.44189.2929.7071v1c0-.26521-.1054-.51957-.2929-.7071z"
+          fill="#9f6854"
+        />
+        <path
+          d="m14.9585 12.5c-.238 1.4189-1.472 2.5-2.9585 2.5s-2.72048-1.0811-2.95852-2.5c-.02728.1626-.04148.3296-.04148.5 0 1.6569 1.3431 3 3 3s3-1.3431 3-3c0-.1704-.0142-.3374-.0415-.5z"
+          fill="#9f6854"
+        />
+        <g fill="#c2866f">
+          <path
+            clipRule="evenodd"
+            d="m15 12c0 1.6569-1.3431 3-3 3s-3-1.3431-3-3 1.3431-3 3-3 3 1.3431 3 3zm-3 1.5c.8284 0 1.5-.6716 1.5-1.5s-.6716-1.5-1.5-1.5-1.5.6716-1.5 1.5.6716 1.5 1.5 1.5z"
+            fillRule="evenodd"
+          />
+          <circle cx="12" cy="12" fillOpacity=".5" r="1.5" />
+          <path
+            clipRule="evenodd"
+            d="m6.29289 6.94975c-.18753.18753-.29289.44189-.29289.7071v8.68625c0 .2653.10536.5196.29289.7072l.65686.6568c.18753.1875.44189.2929.7071.2929h8.68625c.2653 0 .5196-.1054.7072-.2929l.6568-.6568c.1875-.1876.2929-.4419.2929-.7072v-8.68625c0-.26521-.1054-.51957-.2929-.7071l-.6568-.65686c-.1876-.18753-.4419-.29289-.7072-.29289h-8.68625c-.26521 0-.51957.10536-.7071.29289zm.12132-3.94975c-.26521 0-.51957.10536-.7071.29289l-2.41422 2.41422c-.18753.18753-.29289.44189-.29289.7071v11.17159c0 .2652.10536.5196.29289.7071l2.41422 2.4142c.18753.1875.44189.2929.7071.2929h11.17159c.2652 0 .5196-.1054.7071-.2929l2.4142-2.4142c.1875-.1875.2929-.4419.2929-.7071v-11.17159c0-.26521-.1054-.51957-.2929-.7071l-2.4142-2.41422c-.1875-.18753-.4419-.29289-.7071-.29289z"
+            fillRule="evenodd"
+          />
+        </g>
+        <path
+          clipRule="evenodd"
+          d="m10.125 4.5c0-.48325.3918-.875.875-.875h6.0858c.4973 0 .9742.19754 1.3258.54917l1.4142 1.41422c.3517.35163.5492.82854.5492 1.32582v3.58579c0 .4832-.3918.875-.875.875s-.875-.3918-.875-.875v-3.58579c0-.03315-.0132-.06494-.0366-.08838l-1.4142-1.41422c-.0235-.02344-.0553-.03661-.0884-.03661h-6.0858c-.4832 0-.875-.39175-.875-.875z"
+          fill="#e6a58c"
+          fillRule="evenodd"
+        />
+        <circle cx="8.375" cy="4.47501" fill="#e5a48c" r=".875" />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/coin/ElectrumCoinSvg/ElectrumCoinSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/coin/ElectrumCoinSvg/ElectrumCoinSvg.tsx
new file mode 100644
index 0000000..c025b67
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/coin/ElectrumCoinSvg/ElectrumCoinSvg.tsx
@@ -0,0 +1,60 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class ElectrumCoinSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 24 24" className={className}>
+        <path
+          clipRule="evenodd"
+          d="m7.32745 3c-.42911 0-.84556.13554-1.16546.42156-1.20722 1.07938-4.16199 4.17139-4.16199 8.57844 0 4.407 2.95477 7.4991 4.16199 8.5784.3199.2861.73635.4216 1.16547.4216h9.34504c.4292 0 .8456-.1355 1.1655-.4216 1.2072-1.0793 4.162-4.1714 4.162-8.5784 0-4.40704-2.9548-7.49906-4.162-8.57844-.3199-.28602-.7363-.42156-1.1655-.42156zm4.67255 14.25c.6904 0 1.25-.5596 1.25-1.25s-.5596-1.25-1.25-1.25-1.25.5596-1.25 1.25.5596 1.25 1.25 1.25z"
+          fill="#8a9eac"
+          fillRule="evenodd"
+        />
+        <path
+          d="m7.03711 16.9284c.34586.3796.84504.5716 1.35854.5716h7.20875c.5134 0 1.0126-.192 1.3585-.5716 1.0485-1.1506 2.3552-3.0498 2.5198-5.4284.0114.1644.0173.3311.0173.5 0 2.6125-1.4162 4.6983-2.5371 5.9284-.3459.3796-.845.5716-1.3585.5716h-7.20875c-.5135 0-1.01268-.192-1.35854-.5716-1.12095-1.2301-2.53711-3.3159-2.53711-5.9284 0-.1689.00592-.3356.01729-.5.16458 2.3786 1.47133 4.2778 2.51982 5.4284z"
+          fill="#6d7f8c"
+        />
+        <path
+          d="m14.7246 16.375c-.1829 1.3414-1.333 2.375-2.7246 2.375s-2.54175-1.0336-2.72465-2.375c-.01671.1226-.02535.2478-.02535.375 0 1.5188 1.2312 2.75 2.75 2.75s2.75-1.2312 2.75-2.75c0-.1272-.0086-.2524-.0254-.375z"
+          fill="#6d7f8c"
+        />
+        <path
+          clipRule="evenodd"
+          d="m14.75 16c0 1.5188-1.2312 2.75-2.75 2.75s-2.75-1.2312-2.75-2.75 1.2312-2.75 2.75-2.75 2.75 1.2312 2.75 2.75zm-2.75 1.25c.6904 0 1.25-.5596 1.25-1.25s-.5596-1.25-1.25-1.25-1.25.5596-1.25 1.25.5596 1.25 1.25 1.25z"
+          fill="#7c8d99"
+          fillRule="evenodd"
+        />
+        <circle cx="12" cy="16" fill="#8697a3" fillOpacity=".5" r="1.25" />
+        <path
+          clipRule="evenodd"
+          d="m8.39565 5.5c-.5135 0-1.01268.19203-1.35854.57159-1.12095 1.23016-2.53711 3.31587-2.53711 5.92841 0 2.6125 1.41616 4.6983 2.53711 5.9284.34586.3796.84504.5716 1.35854.5716h7.20875c.5135 0 1.0126-.192 1.3585-.5716 1.1209-1.2301 2.5371-3.3159 2.5371-5.9284 0-2.61254-1.4162-4.69825-2.5371-5.92841-.3459-.37956-.8451-.57159-1.3585-.57159zm-1.0682-2.5c-.42911 0-.84556.13554-1.16546.42156-1.20722 1.07938-4.16199 4.17139-4.16199 8.57844 0 4.407 2.95477 7.4991 4.16199 8.5784.3199.2861.73635.4216 1.16547.4216h9.34504c.4292 0 .8456-.1355 1.1655-.4216 1.2072-1.0793 4.162-4.1714 4.162-8.5784 0-4.40704-2.9548-7.49906-4.162-8.57844-.3199-.28602-.7363-.42156-1.1655-.42156z"
+          fill="#7c8d99"
+          fillRule="evenodd"
+        />
+        <path
+          d="m9.75003 9.13768c.23943.5003.03173 1.10552-.46392 1.35192l-1.62912.8597c-.49566.2463-1.09156.0404-1.33099-.4599s-.03173-1.10555.46392-1.35187l1.62912-.85971c.49566-.24633 1.09156-.04044 1.33099.45986z"
+          fill="#7c8d99"
+        />
+        <path
+          d="m10 8c0-1.10457.8954-2 2-2h3c1.6569 0 3 1.34315 3 3v1c0 1.1046-.8954 2-2 2h-4c-1.1046 0-2-.8954-2-2z"
+          fill="#9fb3c0"
+        />
+        <path
+          clipRule="evenodd"
+          d="m11.8507 3.53389c-.4997.02746-.8798.4106-.8489.85577.0308.44514.4608.78374.9604.75632l.0092-.00049.0303-.00157c.027-.00137.0673-.00336.1193-.00575.1039-.0048.6517.00093.6517.00093l1.3785-.02395s1.0448.01588 1.4768.05451c.2164.01934.3931.04327.5261.07005.1131.02275.1591.04034.1591.04034.8407.47238 1.3364 1.1415 1.969 2.07148.3071.45151.5537.87024.7234 1.17593.0846.15247.1495.27584.1927.35991.0216.04201.0377.07413.0481.09509l.0113.02287.0023.00484c.1974.40967.7304.60007 1.1904.42444.4601-.1757.6733-.65045.4761-1.0604l-.0008-.00162-.0014-.0028-.0044-.00908-.0156-.03164c-.0133-.02693-.0326-.06533-.0576-.1139-.0499-.0971-.1225-.23511-.216-.40351-.1865-.33604-.4578-.797-.7981-1.29727-.6596-.96959-1.3422-1.92667-2.5695-2.61007-.2296-.12785-.4955-.197-.7095-.24006-.2307-.04644-.4866-.07863-.7446-.10169-.5167-.04619-1.6535-.06257-1.6535-.06257s-1.0706.0119-1.4533.02517c-.1918.00665-.5643-.0051-.6749 0-.0553.00255-.0988.00469-.1288.00622l-.0347.00179z"
+          fill="#9fb3c0"
+          fillRule="evenodd"
+        />
+        <circle cx="9.75" cy="4.25" fill="#8a9eac" r=".75" />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/coin/GoldCoinSvg/GoldCoinSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/coin/GoldCoinSvg/GoldCoinSvg.tsx
new file mode 100644
index 0000000..e505241
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/coin/GoldCoinSvg/GoldCoinSvg.tsx
@@ -0,0 +1,49 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class GoldCoinSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 24 24" className={className}>
+        <path
+          d="m4 4.5c0-.27615.22385-.5.5-.5h15c.2761 0 .5.22385.5.5v1c0 .27615-.2239.5-.5.5 0 0-2 2.32653-2 6 0 3.6735 2 6 2 6 .2761 0 .5.2239.5.5v1c0 .2761-.2239.5-.5.5h-15c-.27615 0-.5-.2239-.5-.5v-1c0-.2761.22385-.5.5-.5 0 0 2-1.8673 2-6 0-4.13265-2-6-2-6-.27615 0-.5-.22385-.5-.5z"
+          fill="#dd970e"
+        />
+        <path
+          d="m9.99993 12c0-.6216-.03345-1.2128-.09414-1.7735l4.11311 1.0283c-.002.04-.0039.0802-.0056.1205l-4.07254 2.0363c.03844-.4517.05917-.9222.05917-1.4116z"
+          fill="#eca825"
+        />
+        <path
+          d="m9.79321 14.6034 4.21509-2.1076c.0516 1.5192.3351 2.8657.7046 4.0042h-5.36158c.17845-.5819.33016-1.214.44189-1.8966z"
+          fill="#eca825"
+        />
+        <path
+          d="m14.0189 11.2548-4.11311-1.0283c-.10897-1.00676-.30575-1.91549-.55447-2.7265h5.36158c-.3492 1.07581-.6215 2.3373-.694 3.7548z"
+          fill="#ffb72c"
+        />
+        <path
+          d="m6.26343 5.5h11.54557c-.1777.29323-.3708.64106-.5624 1.0399-.0702.14609-.1404.29953-.2097.4601h-9.99142c-.10248-.24281-.20889-.47037-.31689-.68278-.15543-.30571-.31301-.57786-.46516-.81722z"
+          fill="#eca825"
+        />
+        <path
+          clipRule="evenodd"
+          d="m17.8089 5.5h-11.54556c.15215.23936.30973.51151.46516.81722.66607 1.31004 1.2715 3.19617 1.2715 5.68278 0 2.4866-.60543 4.3727-1.2715 5.6828-.15543.3057-.31301.5778-.46516.8172h11.54556c-.1777-.2932-.3708-.6411-.5624-1.0399-.6216-1.2941-1.2465-3.1649-1.2465-5.4601 0-2.29517.6249-4.166 1.2465-5.4601.1916-.39884.3847-.74667.5624-1.0399zm2.6911 12.5s-2-2.3265-2-6c0-3.67347 2-6 2-6 .2761 0 .5-.22385.5-.5v-2c0-.27615-.2239-.5-.5-.5h-17c-.27615 0-.5.22385-.5.5v2c0 .27615.22385.5.5.5 0 0 2 1.86735 2 6 0 4.1327-2 6-2 6-.27615 0-.5.2239-.5.5v2c0 .2761.22385.5.5.5h17c.2761 0 .5-.2239.5-.5v-2c0-.2761-.2239-.5-.5-.5z"
+          fill="#c78727"
+          fillRule="evenodd"
+        />
+        <path
+          d="m8 4.25c0-.41421.33579-.75.75-.75h11c.4142 0 .75.33579.75.75s-.3358.75-.75.75h-11c-.41421 0-.75-.33579-.75-.75z"
+          fill="#ffb72c"
+        />
+        <circle cx="6.75" cy="4.25" fill="#eca825" r=".75" />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/coin/PlatinumCoinSvg/PlatinumCoinSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/coin/PlatinumCoinSvg/PlatinumCoinSvg.tsx
new file mode 100644
index 0000000..bdb8575
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/coin/PlatinumCoinSvg/PlatinumCoinSvg.tsx
@@ -0,0 +1,45 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class PlatinumCoinSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 24 24" className={className}>
+        <path
+          d="m9.95662 3.30735c.16878-.19532.41258-.30735.66898-.30735h2.7488c.2564 0 .5002.11203.669.30735l5.7367 6.63816c.1418.16409.2199.37469.2199.59269v2.9236c0 .218-.0781.4286-.2199.5927l-5.7367 6.6382c-.1688.1953-.4126.3073-.669.3073h-2.7488c-.2564 0-.5002-.112-.66899-.3073l-5.73668-6.6382c-.14178-.1641-.21993-.3747-.21993-.5927v-2.9236c0-.218.07815-.4286.21993-.59269z"
+          fill="#b5b5b5"
+        />
+        <path
+          d="m10.8356 18.1585-5.08818-5.8151c-.1595-.1823-.24742-.4162-.24742-.6585v1c0 .2423.08792.4762.24742.6585l5.08818 5.8151c.1899.217.4642.3415.7526.3415h.8236c.2884 0 .5627-.1245.7526-.3415l5.0882-5.8151c.1595-.1823.2474-.4162.2474-.6585v-1c0 .2423-.0879.4762-.2474.6585l-5.0882 5.8151c-.1899.217-.4642.3415-.7526.3415h-.8236c-.2884 0-.5627-.1245-.7526-.3415z"
+          fill="#a3a3a3"
+        />
+        <path
+          clipRule="evenodd"
+          d="m11.5882 4.5c-.2884 0-.5627.12448-.7526.34149l-5.08818 5.81511c-.1595.1823-.24742.4163-.24742.6585v1.3698c0 .2422.08792.4762.24742.6585l5.08818 5.8151c.1899.217.4642.3415.7526.3415h.8236c.2884 0 .5627-.1245.7526-.3415l5.0882-5.8151c.1595-.1823.2474-.4163.2474-.6585v-1.3698c0-.2423-.0879-.4762-.2474-.6585l-5.0882-5.8151c-.1899-.21702-.4642-.3415-.7526-.3415zm-1.1344-2.5c-.2884 0-.56272.12448-.75261.34149l-6.45377 7.37574c-.1595.18229-.24742.41627-.24742.65847v3.2486c0 .2422.08792.4762.24742.6585l6.45377 7.3757c.18989.217.46421.3415.75261.3415h3.0924c.2884 0 .5627-.1245.7526-.3415l6.4538-7.3757c.1595-.1823.2474-.4163.2474-.6585v-3.2486c0-.2422-.0879-.47618-.2474-.65847l-6.4538-7.37573c-.1899-.21702-.4642-.3415-.7526-.3415z"
+          fill="#949494"
+          fillRule="evenodd"
+        />
+        <path
+          d="m10.2929 9.12132c-.39053-.39052-.39053-1.02369 0-1.41421l1.2463-1.41422c.3905-.39052 1.0237-.39052 1.4142 0l3.6679 4.29291c.3905.3905.3905 1.0237 0 1.4142l-1.4142 1.4142c-.3905.3905-1.0237.3905-1.4142 0z"
+          fill="#dcdcdc"
+        />
+        <path
+          d="m8.34764 10.2442c.42128-.36072 1.05967-.31674 1.42589.0983l1.25207 1.3511c.3662.415.3216 1.0439-.0997 1.4046-.4213.3608-1.05969.3168-1.4259-.0982l-1.25207-1.3511c-.36621-.415-.32157-1.0439.09971-1.4047z"
+          fill="#ccc"
+        />
+        <path
+          d="m11.9999 2.47315c.3413-.26295 1.5-.37315 2 .02685l4 4.5c.3662.37344.3216.93932-.0997 1.26394s-1.0597.28505-1.4259-.08838c0 0-2.74-3.30604-3.5744-3.98415-.3682-.29925-.7065-.1553-.9997-.45432-.2932-.29901-.2416-1.00098.0997-1.26394z"
+          fill="#ccc"
+        />
+        <circle cx="18.6001" cy="9.25" fill="#b5b5b5" r="1" />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/coin/SilverCoinSvg/SilverCoinSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/coin/SilverCoinSvg/SilverCoinSvg.tsx
new file mode 100644
index 0000000..68526e3
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/coin/SilverCoinSvg/SilverCoinSvg.tsx
@@ -0,0 +1,47 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class SilverCoinSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 24 24" className={className}>
+        <path
+          clipRule="evenodd"
+          d="m2.49372 21c-.3779 0-.61528-.4138-.42875-.7473l9.50623-16.99932c.189-.33784.6686-.33784.8576 0l9.5062 16.99932c.1866.3335-.0508.7473-.4287.7473zm9.50628-5c.6904 0 1.25-.5596 1.25-1.25s-.5596-1.25-1.25-1.25-1.25.5596-1.25 1.25.5596 1.25 1.25 1.25z"
+          fill="#a59e98"
+          fillRule="evenodd"
+        />
+        <path
+          clipRule="evenodd"
+          d="m2.06497 20.2527c-.18653.3335.05085.7473.42875.7473h19.01258c.3779 0 .6153-.4138.4287-.7473l-9.5062-16.99932c-.189-.33784-.6686-.33784-.8576 0zm10.15323-12.30742c-.0954-.17063-.341-.17063-.4364 0l-5.69332 10.18092c-.09319.1666.02727.372.21819.372h11.38663c.191 0 .3114-.2054.2182-.372z"
+          fill="#99938d"
+          fillRule="evenodd"
+        />
+        <path
+          d="m12 17.25c1.3807 0 2.5-1.1193 2.5-2.5 0-.1714-.0173-.3388-.0501-.5005.1919.3752.3001.8002.3001 1.2505 0 1.5188-1.2312 2.75-2.75 2.75s-2.75-1.2312-2.75-2.75c0-.4503.10824-.8753.30011-1.2505-.03286.1617-.05011.3291-.05011.5005 0 1.3807 1.1193 2.5 2.5 2.5z"
+          fill="#857d76"
+        />
+        <circle cx="12" cy="14.75" fill="#a59e98" fillOpacity=".5" r="1.25" />
+        <path
+          d="m11.7819 7.94529c.0954-.17064.341-.17064.4364 0l5.6933 10.18091c.0932.1666-.0273.372-.2182.372h-.133l-5.3421-9.55291c-.0954-.17064-.341-.17064-.4364 0l-5.34216 9.55291h-.13298c-.19093 0-.31139-.2054-.2182-.372z"
+          fill="#b5ada7"
+        />
+        <path
+          d="m11.6724 11.3586c-.2371-.4211.1496-1.88397.5707-2.12106.1389-.07818.7171.84136.9542 1.26246l.5249 1.1414c.2371.4211.0879.9547-.3331 1.1918-.4211.2371-.9547.0879-1.1918-.3332z"
+          fill="#b5ada7"
+        />
+        <path
+          d="m11.4292 5.62102c-.2371-.42109.1496-1.88394.5707-2.12103.1389-.07818.7172.84137.9542 1.26246l3.0664 5.44615c.2371.4211.0879.9546-.3332 1.1917s-.9547.0879-1.1917-.3332z"
+          fill="#cec6bf"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/BlindedSvg/BlindedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/BlindedSvg/BlindedSvg.tsx
new file mode 100644
index 0000000..aaedab7
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/BlindedSvg/BlindedSvg.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const BlindedSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 20 20">
+      <path
+        fill={fillColor}
+        d="M9.55,3.05A10.27,10.27,0,0,0,0,9.47a10.33,10.33,0,0,0,19.12,0A10.29,10.29,0,0,0,9.55,3.05Zm0,11.3A8.67,8.67,0,0,1,1.71,9.47a8.75,8.75,0,0,1,15.69,0A8.71,8.71,0,0,1,9.55,14.35Z"
+      />
+      <line
+        stroke={fillColor}
+        fill={fillColor}
+        x1="18.17"
+        y1="0.71"
+        x2="1.17"
+        y2="17.79"
+      />
+      <path
+        fill={fillColor}
+        d="M8,10.56a1,1,0,0,1-.11.16,2.4,2.4,0,0,1-.48.44,1.16,1.16,0,0,1-.24.15A3.4,3.4,0,0,0,12.36,7C11,8.3,9.34,9.25,8,10.56Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default BlindedSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/BlindedSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/BlindedSvg/index.ts
new file mode 100644
index 0000000..35bb46a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/BlindedSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import BlindedSvg from "./BlindedSvg";
+
+const LightBlindedSvg = asLightSvg(BlindedSvg);
+const DarkBlindedSvg = asDarkSvg(BlindedSvg);
+const GrayBlindedSvg = asGraySvg(BlindedSvg);
+
+export default BlindedSvg;
+export { BlindedSvg, LightBlindedSvg, DarkBlindedSvg, GrayBlindedSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/CharmedSvg/CharmedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/CharmedSvg/CharmedSvg.tsx
new file mode 100644
index 0000000..720c9f2
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/CharmedSvg/CharmedSvg.tsx
@@ -0,0 +1,51 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const CharmedSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 24 24">
+      <path
+        fill={fillColor}
+        d="M15.7,12.4c0,0-0.1,0-0.1,0c0-0.1,0-0.1,0-0.2c0-4.3-3.2-7.8-7.2-7.8s-7.2,3.5-7.2,7.8c0,0.1,0,0.1,0,0.2    c-0.1,0-0.1,0-0.2,0c-0.6,0.2-0.8,1.1-0.5,2.1c0.3,1,1,1.6,1.6,1.5c0.2,0.4,0.4,0.8,0.7,1.1c0.5,2.9,2.8,5.8,5.6,5.8    c2.8,0,5.1-3,5.6-5.8c0.3-0.3,0.5-0.7,0.7-1.1c0.6,0.1,1.2-0.5,1.5-1.5C16.5,13.5,16.3,12.6,15.7,12.4z"
+      />
+
+      <path
+        fill={secondaryFillColor}
+        d="M8.4,1.3c0.3-0.3,0.6-0.6,1-0.8c1.3-0.5,2.8,0.3,3,1.5c0.1,0.5,0,1-0.4,1.5c-1.2,1.6-2.4,3.1-3.6,4.7    c0,0,0,0-0.1,0.1c0,0-0.1-0.1-0.1-0.1C7.2,6.7,6,5.1,4.8,3.6C3.9,2.4,4.5,0.7,6.1,0.4C7,0.3,7.7,0.5,8.3,1.2    C8.4,1.2,8.4,1.2,8.4,1.3z"
+      />
+      <path
+        fill={fillColor}
+        d="M8.4,8.8L8.2,8.5C8.1,8.5,8.1,8.4,8.1,8.4L7.3,7.5C6.4,6.3,5.4,5,4.5,3.8C4,3.2,3.9,2.3,4.2,1.6    c0.3-0.8,1-1.3,1.9-1.5C7-0.1,7.8,0.1,8.4,0.7C8.7,0.5,9,0.3,9.3,0.2c0.7-0.3,1.6-0.2,2.3,0.2c0.6,0.4,1.1,1,1.2,1.6    c0.1,0.6,0,1.2-0.5,1.8L8.4,8.8z M6.6,0.8c-0.1,0-0.3,0-0.4,0c-0.6,0.1-1.1,0.5-1.3,1C4.7,2.4,4.8,2.9,5.1,3.4C6,4.6,7,5.8,7.9,7    l0.5,0.7l3.4-4.4c0.3-0.4,0.4-0.8,0.3-1.2C12,1.7,11.7,1.3,11.3,1c-0.5-0.3-1.1-0.3-1.7-0.1C9.2,1,9,1.2,8.7,1.5L8.5,1.9L8,1.4    C7.6,1,7.2,0.8,6.6,0.8z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M2.4,5.4C2.5,5.2,2.7,5.1,2.9,5c0.6-0.2,1.4,0.1,1.5,0.8c0,0.3,0,0.5-0.2,0.7C3.6,7.3,3,8,2.4,8.8    c0,0,0,0,0,0c0,0,0,0,0,0C1.8,8,1.2,7.3,0.6,6.5C0.1,5.9,0.5,5.1,1.2,5C1.7,4.9,2,5,2.4,5.4C2.3,5.3,2.4,5.4,2.4,5.4z"
+      />
+      <path
+        fill={fillColor}
+        d="M2.4,9.4L2,9L0.3,6.8C0,6.4-0.1,5.9,0.1,5.5C0.3,5,0.7,4.7,1.2,4.6c0.5-0.1,0.9,0,1.2,0.3    c0.1-0.1,0.2-0.2,0.4-0.2c0.4-0.2,0.9-0.1,1.3,0.1C4.4,5,4.7,5.3,4.8,5.7c0.1,0.4,0,0.7-0.3,1L2.4,9.4z M1.5,5.3    c-0.1,0-0.1,0-0.2,0c-0.2,0-0.4,0.2-0.5,0.4c-0.1,0.2,0,0.4,0.1,0.6l1.5,1.9l1.5-2C4,6.1,4,6,4,5.8c0-0.2-0.1-0.3-0.3-0.4    C3.5,5.3,3.2,5.3,3,5.4C2.9,5.4,2.8,5.5,2.7,5.6L2.4,6L2.1,5.6C1.9,5.4,1.7,5.3,1.5,5.3z"
+      />
+
+      <path
+        fill={secondaryFillColor}
+        d="M14.4,5.4c0.1-0.2,0.3-0.3,0.5-0.4c0.6-0.2,1.4,0.1,1.5,0.8c0,0.3,0,0.5-0.2,0.7C15.6,7.3,15,8,14.4,8.8    c0,0,0,0,0,0c0,0,0,0,0,0c-0.6-0.8-1.2-1.5-1.8-2.3c-0.5-0.6-0.1-1.4,0.6-1.6C13.7,4.9,14,5,14.4,5.4C14.3,5.3,14.4,5.4,14.4,5.4z    "
+      />
+      <path
+        fill={fillColor}
+        d="M14.4,9.4L14,9l-1.8-2.3c-0.3-0.4-0.4-0.9-0.2-1.3c0.2-0.4,0.6-0.8,1.1-0.9c0.5-0.1,0.9,0,1.2,0.3    c0.1-0.1,0.2-0.2,0.4-0.2c0.4-0.2,0.9-0.1,1.3,0.1c0.4,0.2,0.6,0.6,0.7,0.9c0.1,0.4,0,0.7-0.3,1L14.4,9.4z M13.5,5.3    c-0.1,0-0.1,0-0.2,0c-0.2,0-0.4,0.2-0.5,0.4c-0.1,0.2,0,0.4,0.1,0.6l1.5,1.9l1.5-2C16,6.1,16,6,16,5.8c0-0.2-0.1-0.3-0.3-0.4    c-0.2-0.1-0.5-0.1-0.7-0.1c-0.1,0.1-0.3,0.1-0.3,0.3L14.4,6l-0.3-0.4C13.9,5.4,13.7,5.3,13.5,5.3z"
+      />
+
+      <path
+        fill={secondaryFillColor}
+        d="M11.2,15.1L11.2,15.1c0,1-0.2,1.7-0.7,2.2S9.4,18,8.6,18S7,17.7,6.4,17.2s-0.8-1.3-0.8-2.3v-2.5     c0-1,0.3-1.8,0.8-2.3s1.2-0.8,2-0.8c0.9,0,1.6,0.2,2.1,0.7s0.7,1.2,0.7,2.2l0,0H9.6c0-0.6-0.1-1-0.2-1.2s-0.5-0.4-0.9-0.4     c-0.4,0-0.7,0.1-0.9,0.4c-0.2,0.3-0.3,0.7-0.3,1.3v2.6c0,0.6,0.1,1,0.3,1.3c0.2,0.3,0.5,0.4,0.9,0.4c0.4,0,0.7-0.1,0.8-0.3     s0.2-0.6,0.2-1.2H11.2z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default CharmedSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/CharmedSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/CharmedSvg/index.ts
new file mode 100644
index 0000000..a2d23cc
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/CharmedSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import CharmedSvg from "./CharmedSvg";
+
+const LightCharmedSvg = asLightSvg(CharmedSvg);
+const DarkCharmedSvg = asDarkSvg(CharmedSvg);
+const GrayCharmedSvg = asGraySvg(CharmedSvg);
+
+export default CharmedSvg;
+export { CharmedSvg, LightCharmedSvg, DarkCharmedSvg, GrayCharmedSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/DeafenedSvg/DeafenedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/DeafenedSvg/DeafenedSvg.tsx
new file mode 100644
index 0000000..db55f8a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/DeafenedSvg/DeafenedSvg.tsx
@@ -0,0 +1,68 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const DeafenedSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 24 24">
+      <path
+        fill={secondaryFillColor}
+        d="M11.28,6.07a1.92,1.92,0,0,0-3-.39,1.56,1.56,0,0,0-.19,2,5.88,5.88,0,0,0,.81.86l2.44-2.43Z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M7.66,18.36a2.41,2.41,0,0,0,2.79-1.12,9.25,9.25,0,0,0,.74-1.64,16.06,16.06,0,0,1,2.34-4.43A8.22,8.22,0,0,0,15,8.09l-9,9A2.18,2.18,0,0,0,7.66,18.36Z"
+      />
+      <path
+        fill={fillColor}
+        d="M14.53,2.62A6.29,6.29,0,0,0,11.64,1c-.46-.12-.93-.18-1.4-.27H9.5C8.91.82,8.32.9,7.74,1A5.09,5.09,0,0,0,4,5.18c0,.36,0,.66.45.71S5,5.69,5,5.33a3.82,3.82,0,0,1,3-3.24,9.8,9.8,0,0,1,2.52-.2,4.73,4.73,0,0,1,3,1.31C13.9,3,14.22,2.82,14.53,2.62Z"
+      />
+      <path
+        fill={fillColor}
+        d="M15.24,8.09,15,8.35a8.44,8.44,0,0,1-1.44,2.83,16.06,16.06,0,0,0-2.34,4.43,9.25,9.25,0,0,1-.74,1.64,2.41,2.41,0,0,1-2.79,1.12,2.21,2.21,0,0,1-1.31-.8l-.86.67a3.14,3.14,0,0,0,1.68,1.12A3.42,3.42,0,0,0,11,18.27a8.1,8.1,0,0,0,1.14-2.19,17.26,17.26,0,0,1,2.29-4.34,12.38,12.38,0,0,0,1.14-1.85,6.8,6.8,0,0,0,.69-2.48A8.9,8.9,0,0,1,15.24,8.09Z"
+      />
+      <path
+        fill={fillColor}
+        d="M8.25,5.68a1.92,1.92,0,0,1,2.62-.1c.28-.21.57-.41.86-.6a2.66,2.66,0,0,0-.79-.59,3.24,3.24,0,0,0-3.65.71C6.47,6,6.16,7.88,7.17,8.77l.07.07a8.05,8.05,0,0,1,1-.89c-.07-.08-.14-.15-.2-.23A1.56,1.56,0,0,1,8.25,5.68Z"
+      />
+      <path
+        fill={fillColor}
+        d="M12.51,6.38a3.11,3.11,0,0,1,0,1.09,6.75,6.75,0,0,1-.62,1.83c-.14.3-.5.5-.76.75l-.22-.13a7.26,7.26,0,0,1,.41-1.16,2.55,2.55,0,0,0,.32-1.51L9.56,9.3a2,2,0,0,1,.33,1.8,9,9,0,0,1-.37,1.06l5.65-5.62a5,5,0,0,0-.65-2.18Z"
+      />
+      <path
+        fill={fillColor}
+        d="M20.33,1.42,18.92,0l-3.6,3.58a6,6,0,0,1,.83,2Z"
+      />
+      <path
+        fill={fillColor}
+        d="M6.78,13.72a1.2,1.2,0,0,1-.29-1.36L0,18.82l1.41,1.42,3.4-3.38a3.73,3.73,0,0,1-.07-.41c0-.17-.07-.4,0-.52a.94.94,0,0,1,.56-.42c.14,0,.31.24.45.41L7.66,14A1.13,1.13,0,0,1,6.78,13.72Z"
+      />
+      <path
+        fill={fillColor}
+        d="M5.3,15.51a.94.94,0,0,0-.56.42c-.08.12,0,.34,0,.52a3.73,3.73,0,0,0,.07.41l.94-.94C5.61,15.75,5.44,15.5,5.3,15.51Z"
+      />
+      <path
+        fill={fillColor}
+        d="M15.18,6.54l1-1a6,6,0,0,0-.83-2l-.79.79A5,5,0,0,1,15.18,6.54Z"
+      />
+      <path
+        fill={fillColor}
+        d="M6.78,13.72a1.13,1.13,0,0,0,.89.29l1.86-1.85A9,9,0,0,0,9.9,11.1a2,2,0,0,0-.33-1.8L6.49,12.37A1.2,1.2,0,0,0,6.78,13.72Z"
+      />
+      <path
+        fill={fillColor}
+        d="M11.33,8.75a7.26,7.26,0,0,0-.41,1.16l.22.13c.26-.25.62-.45.76-.75a6.75,6.75,0,0,0,.62-1.83,3.11,3.11,0,0,0,0-1.09l-.86.85A2.55,2.55,0,0,1,11.33,8.75Z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M14.53,4.36l.79-.79a5.93,5.93,0,0,0-.61-.8l-.77.76A5,5,0,0,1,14.53,4.36Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default DeafenedSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/DeafenedSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/DeafenedSvg/index.ts
new file mode 100644
index 0000000..9acdc5d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/DeafenedSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import DeafenedSvg from "./DeafenedSvg";
+
+const LightDeafenedSvg = asLightSvg(DeafenedSvg);
+const DarkDeafenedSvg = asDarkSvg(DeafenedSvg);
+const GrayDeafenedSvg = asGraySvg(DeafenedSvg);
+
+export default DeafenedSvg;
+export { DeafenedSvg, LightDeafenedSvg, DarkDeafenedSvg, GrayDeafenedSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/ExhaustedSvg/ExhaustedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/ExhaustedSvg/ExhaustedSvg.tsx
new file mode 100644
index 0000000..b2cc901
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/ExhaustedSvg/ExhaustedSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ExhaustedSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 20 10">
+      <path
+        fill={fillColor}
+        d="M1.65,0A1.66,1.66,0,0,0,.45.45c-.81.81-.51,2.44.68,3.63S4,5.58,4.77,4.77A1.47,1.47,0,0,0,5,4.38a13.15,13.15,0,0,1-3.57,7.83H4.12C5.67,10.7,6.64,7.72,7.25,5.76a6.78,6.78,0,0,1,4.22,2l-3.85,4.5h11.2l-1.15-2.08h-5.2C16.62,7,14,3.55,10.55,2.05V2a10.23,10.23,0,0,0-1.47-.49h0a5.93,5.93,0,0,0-4.41.32,4.35,4.35,0,0,0-.59-.73A3.59,3.59,0,0,0,1.65,0Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default ExhaustedSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/ExhaustedSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/ExhaustedSvg/index.ts
new file mode 100644
index 0000000..4d198d2
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/ExhaustedSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import ExhaustedSvg from "./ExhaustedSvg";
+
+const LightExhaustedSvg = asLightSvg(ExhaustedSvg);
+const DarkExhaustedSvg = asDarkSvg(ExhaustedSvg);
+const GrayExhaustedSvg = asGraySvg(ExhaustedSvg);
+
+export default ExhaustedSvg;
+export { ExhaustedSvg, LightExhaustedSvg, DarkExhaustedSvg, GrayExhaustedSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/FrightenedSvg/FrightenedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/FrightenedSvg/FrightenedSvg.tsx
new file mode 100644
index 0000000..fb84f41
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/FrightenedSvg/FrightenedSvg.tsx
@@ -0,0 +1,49 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const FrightenedSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 20 20">
+      <ellipse fill={fillColor} cx="8" cy="7.8" rx="7.2" ry="7.8" />
+      <path
+        fill={fillColor}
+        d="M13.7,11.7c0,3.1-2.5,6.9-5.7,6.9s-5.7-3.8-5.7-6.9S4.8,7.2,8,7.2S13.7,8.5,13.7,11.7z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M6.4,8.9c0,0.9-0.7,1-1.5,1s-1.5-0.1-1.5-1S4,7.4,4.9,7.4S6.4,8.1,6.4,8.9z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M10.3,14.5c0,1.3-1,0-2.3,0s-2.3,1.3-2.3,0s1-2.3,2.3-2.3S10.3,13.2,10.3,14.5z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M12.4,8.9c0,0.9-0.7,1-1.5,1c-0.9,0-1.5-0.1-1.5-1s0.7-1.5,1.5-1.5C11.8,7.4,12.4,8.1,12.4,8.9z"
+      />
+      <ellipse
+        transform="matrix(0.2904 -0.9569 0.9569 0.2904 1.0307 21.1022)"
+        fill={fillColor}
+        cx="14.7"
+        cy="9.9"
+        rx="1.9"
+        ry="1.1"
+      />
+      <ellipse
+        transform="matrix(0.9569 -0.2904 0.2904 0.9569 -2.812 0.7634)"
+        fill={fillColor}
+        cx="1.2"
+        cy="9.9"
+        rx="1.1"
+        ry="1.9"
+      />
+    </BaseSvg>
+  );
+};
+
+export default FrightenedSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/FrightenedSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/FrightenedSvg/index.ts
new file mode 100644
index 0000000..75dad0e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/FrightenedSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import FrightenedSvg from "./FrightenedSvg";
+
+const LightFrightenedSvg = asLightSvg(FrightenedSvg);
+const DarkFrightenedSvg = asDarkSvg(FrightenedSvg);
+const GrayFrightenedSvg = asGraySvg(FrightenedSvg);
+
+export default FrightenedSvg;
+export {
+  FrightenedSvg,
+  LightFrightenedSvg,
+  DarkFrightenedSvg,
+  GrayFrightenedSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/GrappledSvg/GrappledSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/GrappledSvg/GrappledSvg.tsx
new file mode 100644
index 0000000..c97190c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/GrappledSvg/GrappledSvg.tsx
@@ -0,0 +1,29 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const GrappledSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 20 20">
+      <path
+        fill={fillColor}
+        d="M10.5,9.5c0,0,1.5-1.6,0.9-2.6c-0.6-1-2.3-2.6-2.3-3S8.6,0.3,8.1,0S7.2,1.4,7.6,2.8S6.6,2.9,6.4,2.6   C6.2,2.2,4.6,0,4.1,0.4s0,1.1,0.4,1.6c0.4,0.5,1.6,2,1.3,2.2c-0.2,0.2-4-3.1-4.5-2.7s-0.5,1,0.1,1.4s3.9,2.2,3.9,2.6S4.3,5.8,3,5.4   C1.7,4.9,0,5,0,5.5s5.4,2.2,6.1,2.7c0.8,0.4,0.3,1-0.2,1.1C5.5,9.5,4,10.6,3.7,11.3C3.4,12,4,12.4,4.4,12c0.3-0.4,2.4-1.6,3-1.4   C8,10.9,9.3,10.5,10.5,9.5z"
+      />
+      <polygon
+        fill={fillColor}
+        points="11.4,6.9 21.6,13.7 18.5,17.3 8.5,9.2  "
+      />
+      <path
+        fill={fillColor}
+        stroke={secondaryFillColor}
+        d="M10.6,19.1c-1.2-0.9-2.5-1.8-3.7-2.8c0.1-0.1,1.5-2,1.5-2.1c0.5-0.6,1-1.2,1.4-1.9c0-0.1,0.1-0.2,0.1-0.3   c-0.2-1.2-0.4-2.4-0.5-3.6c-0.1-0.6,0.2-1,0.8-1c0.4-0.1,0.8-0.1,1.2-0.2c0.1,0,0.1,0,0.2,0c0.2,0,0.2,0.2,0.2,0.3   c-0.1,0.2-0.3,0.5-0.4,0.7c-0.1,0.2-0.1,0.3,0,0.3c0.1,0.1,0.2,0,0.3-0.1c0.3-0.4,0.6-0.9,0.9-1.3c0.5-0.6,1.3-0.5,1.6,0.2   c0.1,0.2,0.2,0.2,0.3,0.1c0.1,0,0.1-0.1,0.2-0.1c0.3-0.1,0.7-0.1,1,0.1c0.3,0.2,0.4,0.5,0.3,0.9c0,0.3,0,0.4,0.3,0.4   c0.7,0.1,0.9,0.7,0.7,1.3c-0.1,0.2,0,0.4,0.2,0.6c0.1,0.1,0.1,0.1,0.2,0.2c0.3,0.3,0.5,0.7,0.2,1.1c-0.6,0.9-1.4,1.6-2.4,2.1   c-0.4,0.2-0.8,0.2-1.2,0.2c-0.1,0-0.2,0-0.3,0.1c-0.6,0.9-1.3,1.9-2,2.8C11.9,17.3,10.6,19.1,10.6,19.1z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default GrappledSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/GrappledSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/GrappledSvg/index.ts
new file mode 100644
index 0000000..fefcb79
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/GrappledSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import GrappledSvg from "./GrappledSvg";
+
+const LightGrappledSvg = asLightSvg(GrappledSvg);
+const DarkGrappledSvg = asDarkSvg(GrappledSvg);
+const GrayGrappledSvg = asGraySvg(GrappledSvg);
+
+export default GrappledSvg;
+export { GrappledSvg, LightGrappledSvg, DarkGrappledSvg, GrayGrappledSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/IncapacitatedSvg/IncapacitatedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/IncapacitatedSvg/IncapacitatedSvg.tsx
new file mode 100644
index 0000000..002fb63
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/IncapacitatedSvg/IncapacitatedSvg.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const IncapacitatedSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 24 24">
+      <path
+        fill={fillColor}
+        d="M17.8,13.1c0,0-0.1,0-0.1,0c0-0.1,0-0.1,0-0.2c0-4.3-3.2-7.8-7.2-7.8s-7.2,3.5-7.2,7.8c0,0.1,0,0.1,0,0.2    c-0.1,0-0.1,0-0.2,0c-0.6,0.2-0.8,1.1-0.5,2.1c0.3,1,1,1.6,1.6,1.5c0.2,0.4,0.4,0.8,0.7,1.1c0.5,2.9,2.8,5.8,5.6,5.8    c2.8,0,5.1-3,5.6-5.8c0.3-0.3,0.5-0.7,0.7-1.1c0.6,0.1,1.2-0.5,1.5-1.5C18.5,14.2,18.3,13.2,17.8,13.1z"
+      />
+      <path fill={secondaryFillColor} d="M11.3,18.9H9.6v-8.5h1.7V18.9z" />
+      <path
+        fill={fillColor}
+        d="M8.8,10.8c-1.5,0-3-0.1-4.6-0.2c-0.2,0-0.4-0.2-0.3-0.4c0-0.2,0.2-0.4,0.4-0.3c4.9,0.5,8.9,0.2,13.9-0.8    c1-0.2,1.5-0.5,1.6-0.8c0.1-0.2-0.1-0.5-0.3-0.7c-0.3-0.2-0.7-0.4-1.1-0.6c-0.4-0.2-0.9-0.4-1.4-0.5c-0.2,0.2-0.5,0.5-0.8,0.7    c-1.1,0.7-2.4,0.9-3.6,1.1C9,8.6,5.2,8.4,1.6,7.5C1,7.4,0.2,7.1,0,6.4c-0.1-0.4,0.2-0.9,0.7-1.2C1,5,1.5,4.9,1.9,4.8    c0.9-0.2,1.8-0.3,2.7-0.4C4.4,4.3,4.2,4.2,4,4.1C3.7,3.9,3.4,3.8,3.1,3.5C2.8,3.2,2.7,2.7,3,2.3c0.3-0.4,0.8-0.5,1.3-0.6    c3.2-0.3,6.4-0.2,9.5,0.3c0.2,0,0.5,0.1,0.7,0.1c0,0,0,0-0.1,0c-0.5-0.3-1-0.5-1.6-0.6c-2-0.5-4.2-0.8-6.3-0.8c0,0,0,0,0,0    c-0.2,0-0.4-0.2-0.4-0.4C6.2,0.1,6.4,0,6.7,0c2.2,0,4.3,0.3,6.4,0.8c0.6,0.2,1.2,0.4,1.8,0.7c0.5,0.3,0.8,0.7,1,1.1    c0.9,0.4,1.5,0.9,1.8,1.5c0.2,0.5,0.2,1.2-0.1,1.7c0.4,0.1,0.8,0.3,1.2,0.5C19.2,6.5,19.6,6.7,20,7c0.5,0.4,0.7,0.9,0.5,1.4    c-0.2,0.9-1.4,1.2-2.2,1.4C14.9,10.5,11.9,10.8,8.8,10.8z M6.5,5C5,5,3.5,5.2,2,5.5c-0.3,0.1-0.7,0.2-1,0.3    C0.9,5.9,0.7,6.1,0.8,6.2c0,0.1,0.2,0.3,1,0.6C5.3,7.6,9,7.9,12.6,7.4c1.1-0.1,2.4-0.4,3.3-0.9c0.1-0.1,0.3-0.2,0.4-0.3    c-1-0.3-2.1-0.6-3.2-0.8c-0.3,0-0.6,0.1-0.9,0.1C10.3,5.6,8.3,5.4,6.5,5z M14.6,4.9c0.7,0.2,1.5,0.4,2.2,0.6    c0.2-0.4,0.3-0.8,0.1-1.2c-0.2-0.4-0.5-0.7-1-0.9C15.8,4,15.3,4.6,14.6,4.9C14.6,4.9,14.6,4.9,14.6,4.9z M7.8,4.2    c1.8,0,3.5,0.2,5.2,0.5c0.4-0.1,0.8-0.2,1.2-0.4c0.6-0.3,0.9-0.7,0.9-1.1c-0.4-0.1-0.9-0.3-1.5-0.4c-3.1-0.5-6.2-0.6-9.3-0.3    c-0.4,0-0.7,0.1-0.8,0.2c0,0.1,0,0.2,0.1,0.3c0.1,0.2,0.4,0.3,0.6,0.4C5,3.7,5.8,4,6.6,4.2C7,4.2,7.4,4.2,7.8,4.2z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default IncapacitatedSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/IncapacitatedSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/IncapacitatedSvg/index.ts
new file mode 100644
index 0000000..5a5e077
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/IncapacitatedSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import IncapacitatedSvg from "./IncapacitatedSvg";
+
+const LightIncapacitatedSvg = asLightSvg(IncapacitatedSvg);
+const DarkIncapacitatedSvg = asDarkSvg(IncapacitatedSvg);
+const GrayIncapacitatedSvg = asGraySvg(IncapacitatedSvg);
+
+export default IncapacitatedSvg;
+export {
+  IncapacitatedSvg,
+  LightIncapacitatedSvg,
+  DarkIncapacitatedSvg,
+  GrayIncapacitatedSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/InvisibleSvg/InvisibleSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/InvisibleSvg/InvisibleSvg.tsx
new file mode 100644
index 0000000..33ffb11
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/InvisibleSvg/InvisibleSvg.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const InvisibleSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 24 24">
+      <path
+        fill={secondaryFillColor}
+        d="M19.63,17.73c-.92-.29-4.07-1.39-5-1.71a1.56,1.56,0,0,1-1.13-1.32,1.4,1.4,0,0,1-.06-.29,1,1,0,0,1,.08-.38c.17-.34.39-.66.53-1,.2-.52.35-1.05.52-1.59.28.11.47-.06.6-.3A5.48,5.48,0,0,0,16,8.26a.6.6,0,0,0-.16-.42c-.24-.18-.19-.37-.14-.59s0-.23.06-.35a8.3,8.3,0,0,0,0-3A2.23,2.23,0,0,0,14.7,2.22a4,4,0,0,1-1-.83A4.73,4.73,0,0,0,9.15.13,6.11,6.11,0,0,0,5.81,2.29,5.08,5.08,0,0,0,4.5,6a12.15,12.15,0,0,0,.21,1.34c-.5.12-.65.32-.65.85a1.94,1.94,0,0,0,0,.25,6.85,6.85,0,0,0,.62,2.15,3.7,3.7,0,0,0,.43.56.84.84,0,0,1,.19.3,6.81,6.81,0,0,0,1.07,2.7.39.39,0,0,1,.07.27c-.07.31-.16.61-.25.92a.61.61,0,0,1-.38.39,31.27,31.27,0,0,1-5,1.77c-.25.06-.49.17-.79.28.32.44.66,1.36,1,1.75H18.37Z"
+      />
+      <path
+        fill={fillColor}
+        d="M6.7,1.4l-.12.1h0a10,10,0,0,0-.72.74H5.6l0,0h0l-.21.3.83.56A4.79,4.79,0,0,1,6.57,3a8.53,8.53,0,0,1,.8-.8L6.7,1.4ZM4.59,4.7q0,.13,0,.26h0a5.42,5.42,0,0,0,0,.89h0V6h0a4.83,4.83,0,0,0,.06.5h0v0h0v0h0v.06l1-.18a4.36,4.36,0,0,1-.08-.57,4.34,4.34,0,0,1,.08-1l-1-.2Zm.46,3.58-1,.05V8.4h0a7.1,7.1,0,0,0,.43,1.73h0l0,.09.92-.39a6,6,0,0,1-.41-1.59ZM6.4,11.77l-1,.25q.06.22.12.43h0v0h0v0h.07a6.51,6.51,0,0,0,.27.63h0v0H6l.18.31.85-.53a5.57,5.57,0,0,1-.65-1.56Zm-.48,3.88,0,0h0l0,0H5.63l-1.09.46H4.39l-.31.12.36.93c.58-.22,1.18-.47,1.78-.74l.21-.11-.51-.86ZM2.19,17.08q-.66.21-1.34.38H.54l-.26.1.36.93A3.65,3.65,0,0,1,1,18.44c.48-.12,1-.26,1.45-.41l-.3-1ZM2.7,18.5H1v.63H1v0l-.19.12a2,2,0,0,0,.18.25H2.7v-1Zm4,0h-2v1h2v-1Zm4,0h-2v1h2v-1Zm4,0h-2v1h2v-1Zm3.67,0v.6h0v-.6H16.7v1h1.69l.17-.24-.19-.14v-.6ZM17.59,17l-.33.95,1.76.6.31-.44.15-.46-.56-.19L17.59,17Zm-3.68-1.5-.74.67a2.76,2.76,0,0,0,1.15.75l1.05.37.33-.94-.28-.1L14.66,16h-.15l0,0h0a1.64,1.64,0,0,1-.54-.39Zm-.39-4,0,.05c-.11.36-.22.71-.34,1a4,4,0,0,1-.25.48l0,.07.87.5v0h0l0,0a5.34,5.34,0,0,0,.28-.53h.06c.13-.34.23-.68.34-1h0v0l-1-.29ZM15,8.45A4.12,4.12,0,0,1,14.64,10l.92.38A5.15,5.15,0,0,0,16,8.51H15Zm.88-3.87-1,.09a8,8,0,0,1-.07,1.77l1,.13c0-.23.06-.46.07-.69h0v0h0v0h0v0h0v0h0v0h0v0h0v0h0v0h0v0h0v0h0V5h0V5h0V5h0v0h0v0h0v0h0q0-.15,0-.3ZM13.73,1.44,13,2.15a4.69,4.69,0,0,0,1.23,1,.62.62,0,0,1,.22.19l.8-.6-.12-.15h-.72a4.84,4.84,0,0,1-.7-.61ZM10.35,0A6,6,0,0,0,9.21.12H9.14a4.71,4.71,0,0,0-.52.14H8.56L8.4.35l.36.93a3.73,3.73,0,0,1,.6-.17,5.07,5.07,0,0,1,1-.11h0a3.65,3.65,0,0,1,1.36.25l.37-.93A4.57,4.57,0,0,0,10.57,0h-.22Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default InvisibleSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/InvisibleSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/InvisibleSvg/index.ts
new file mode 100644
index 0000000..6fd04c4
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/InvisibleSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import InvisibleSvg from "./InvisibleSvg";
+
+const LightInvisibleSvg = asLightSvg(InvisibleSvg);
+const DarkInvisibleSvg = asDarkSvg(InvisibleSvg);
+const GrayInvisibleSvg = asGraySvg(InvisibleSvg);
+
+export default InvisibleSvg;
+export { InvisibleSvg, LightInvisibleSvg, DarkInvisibleSvg, GrayInvisibleSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/ParalyzedSvg/ParalyzedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/ParalyzedSvg/ParalyzedSvg.tsx
new file mode 100644
index 0000000..efff916
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/ParalyzedSvg/ParalyzedSvg.tsx
@@ -0,0 +1,55 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ParalyzedSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 24 24">
+      <path
+        fill={fillColor}
+        d="M17.5,12.6c0,0-0.1,0-0.1,0c0-0.1,0-0.1,0-0.2c0-4.3-3.2-7.8-7.2-7.8S3,8.1,3,12.4c0,0.1,0,0.1,0,0.2   c-0.1,0-0.1,0-0.2,0c-0.6,0.2-0.8,1.1-0.5,2.1c0.3,1,1,1.6,1.6,1.5c0.2,0.4,0.4,0.8,0.7,1.1c0.5,2.9,2.8,5.8,5.6,5.8   c2.8,0,5.1-3,5.6-5.8c0.3-0.3,0.5-0.7,0.7-1.1c0.6,0.1,1.2-0.5,1.5-1.5C18.3,13.8,18.1,12.8,17.5,12.6z"
+      />
+
+      <path
+        fill={secondaryFillColor}
+        d="M9.5,15v2.6H8v-7.3h2.5c0.7,0,1.3,0.2,1.7,0.6c0.4,0.4,0.6,1,0.6,1.7c0,0.7-0.2,1.3-0.6,1.7    c-0.4,0.4-1,0.6-1.7,0.6H9.5z M9.5,13.8h1.1c0.3,0,0.5-0.1,0.7-0.3c0.2-0.2,0.2-0.5,0.2-0.9c0-0.3-0.1-0.6-0.2-0.9    c-0.2-0.2-0.4-0.3-0.7-0.3H9.5V13.8z"
+      />
+
+      <polygon
+        fill={secondaryFillColor}
+        points="5.1,8.8 8.3,5.6 5.1,2.4 7,0.5 10.2,3.7 13.4,0.5 15.3,2.4 12.1,5.6 15.3,8.8 13.4,10.7 10.2,7.5     7,10.7   "
+      />
+      <polygon
+        stroke={fillColor}
+        fill={secondaryFillColor}
+        points="5.1,8.8 8.3,5.6 5.1,2.4 7,0.5 10.2,3.7 13.4,0.5 15.3,2.4 12.1,5.6 15.3,8.8 13.4,10.7 10.2,7.5     7,10.7   "
+      />
+
+      <polygon
+        fill={secondaryFillColor}
+        points="0.5,10.8 2,9.3 0.5,7.9 1.8,6.7 3.2,8.1 4.7,6.7 5.9,7.9 4.4,9.3 5.9,10.8 4.7,12 3.2,10.6 1.8,12       "
+      />
+      <polygon
+        stroke={fillColor}
+        fill={secondaryFillColor}
+        points="0.5,10.8 2,9.3 0.5,7.9 1.8,6.7 3.2,8.1 4.7,6.7 5.9,7.9 4.4,9.3 5.9,10.8 4.7,12 3.2,10.6 1.8,12       "
+      />
+
+      <polygon
+        fill={secondaryFillColor}
+        points="15.5,10.8 17,9.3 15.5,7.9 16.8,6.7 18.2,8.1 19.7,6.7 20.9,7.9 19.4,9.3 20.9,10.8 19.7,12     18.2,10.6 16.8,12   "
+      />
+      <polygon
+        stroke={fillColor}
+        fill={secondaryFillColor}
+        points="15.5,10.8 17,9.3 15.5,7.9 16.8,6.7 18.2,8.1 19.7,6.7 20.9,7.9 19.4,9.3 20.9,10.8 19.7,12     18.2,10.6 16.8,12   "
+      />
+    </BaseSvg>
+  );
+};
+
+export default ParalyzedSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/ParalyzedSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/ParalyzedSvg/index.ts
new file mode 100644
index 0000000..8bb31cb
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/ParalyzedSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import ParalyzedSvg from "./ParalyzedSvg";
+
+const LightParalyzedSvg = asLightSvg(ParalyzedSvg);
+const DarkParalyzedSvg = asDarkSvg(ParalyzedSvg);
+const GrayParalyzedSvg = asGraySvg(ParalyzedSvg);
+
+export default ParalyzedSvg;
+export { ParalyzedSvg, LightParalyzedSvg, DarkParalyzedSvg, GrayParalyzedSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/PetrifiedSvg/PetrifiedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/PetrifiedSvg/PetrifiedSvg.tsx
new file mode 100644
index 0000000..4b62ce0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/PetrifiedSvg/PetrifiedSvg.tsx
@@ -0,0 +1,48 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const PetrifiedSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 22 22">
+      <path
+        fill={fillColor}
+        d="M8.1,6.4L7,4.9l1.1-0.6c0.1-0.1,0.2-0.1,0.2-0.2c0-0.1,0-0.2,0-0.3L6.4,0.2C6.9,0.1,7.4,0,8,0   c3.3,0,6.1,2.4,6.9,5.8l-2.8-0.9c-0.1,0-0.2,0-0.3,0L8.1,6.4z"
+      />
+      <path
+        fill={fillColor}
+        d="M4.5,11.4l-1.9,2.4c-0.1-0.3-0.2-0.6-0.2-1c-0.3-0.4-0.5-0.7-0.7-1.1c-0.6,0.2-1.3-0.5-1.5-1.5   c-0.3-1-0.1-1.9,0.5-2.1c0.1,0,0.1,0,0.2,0c0-0.1,0-0.1,0-0.2c0-3.5,2.1-6.4,4.9-7.4l1.8,3.4L6.3,4.4c0,0-0.1,0-0.1,0.1L4.4,5.4   C4.2,5.5,4.2,5.6,4.2,5.7L4.5,11.4z"
+      />
+      <path
+        fill={fillColor}
+        d="M7.9,16.9c0.1,0.5,0.2,1.1,0.3,1.6c-0.1,0-0.2,0-0.3,0c-2.2,0-4.1-1.9-5-4l2.3-2.8c0-0.1,0.1-0.2,0.1-0.3   L4.9,5.9l1.4-0.7l1.3,1.9C7.7,7.2,7.9,7.3,8,7.3c0.1,0,0.1,0,0.2,0l3.9-1.6l3,1c0.1,0.4,0.1,0.8,0.1,1.2c0,0.1,0,0.1,0,0.2   c0.1,0,0.1,0,0.1,0c0.4,0.1,0.6,0.6,0.6,1.1L10.3,11c-0.1,0-0.2,0.1-0.2,0.2c0,0.1,0,0.2,0,0.3l1.6,3.1l-3.5,1.9   C8,16.6,7.9,16.8,7.9,16.9z"
+      />
+
+      <path
+        fill={secondaryFillColor}
+        d="M6.4,8.9c0,0.9-0.7,1-1.5,1s-1.5-0.1-1.5-1c0-0.9,0.7-1.5,1.5-1.5S6.4,8.1,6.4,8.9z"
+      />
+
+      <path
+        fill={secondaryFillColor}
+        d="M10.3,14.5c0,1.3-1,0-2.3,0s-2.3,1.3-2.3,0s1-2.3,2.3-2.3S10.3,13.2,10.3,14.5z"
+      />
+
+      <path
+        fill={secondaryFillColor}
+        d="M12.4,8.9c0,0.9-0.7,1-1.5,1s-1.5-0.1-1.5-1c0-0.9,0.7-1.5,1.5-1.5S12.4,8.1,12.4,8.9z"
+      />
+
+      <path
+        fill={fillColor}
+        d="M10.9,11.6l4.9-1.6c0,0.1,0,0.1,0,0.1c-0.3,1-1,1.6-1.5,1.5c-0.2,0.4-0.4,0.8-0.7,1.1   c-0.4,2.5-2.2,5.1-4.6,5.7h0c-0.1-0.4-0.1-0.8-0.2-1.4l3.6-1.9c0.2-0.1,0.2-0.3,0.2-0.5L10.9,11.6z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default PetrifiedSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/PetrifiedSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/PetrifiedSvg/index.ts
new file mode 100644
index 0000000..5472f73
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/PetrifiedSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import PetrifiedSvg from "./PetrifiedSvg";
+
+const LightPetrifiedSvg = asLightSvg(PetrifiedSvg);
+const DarkPetrifiedSvg = asDarkSvg(PetrifiedSvg);
+const GrayPetrifiedSvg = asGraySvg(PetrifiedSvg);
+
+export default PetrifiedSvg;
+export { PetrifiedSvg, LightPetrifiedSvg, DarkPetrifiedSvg, GrayPetrifiedSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/PoisonedSvg/PoisonedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/PoisonedSvg/PoisonedSvg.tsx
new file mode 100644
index 0000000..814eb25
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/PoisonedSvg/PoisonedSvg.tsx
@@ -0,0 +1,44 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const PoisonedSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 22 22">
+      <path
+        fill={fillColor}
+        d="M15.3,8.1c0,0-0.1,0-0.1,0c0-0.1,0-0.1,0-0.2C15.2,3.5,11.9,0,8,0S0.8,3.5,0.8,7.8c0,0.1,0,0.1,0,0.2    c-0.1,0-0.1,0-0.2,0c-0.6,0.2-0.8,1.1-0.5,2.1c0.3,1,1,1.6,1.6,1.5c0.2,0.4,0.4,0.8,0.7,1.1c0.5,2.9,2.8,5.8,5.6,5.8    c2.8,0,5.1-3,5.6-5.8c0.3-0.3,0.5-0.7,0.7-1.1c0.6,0.1,1.2-0.5,1.5-1.5C16.1,9.2,15.9,8.2,15.3,8.1z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M9.9,9l-0.3,1L9,10.6c-0.1,0.2-0.3,0.4-0.4,0.5c-0.2,0.1-0.4,0.2-0.6,0.2c-0.5,0-0.9-0.2-1.1-0.6l-0.6-0.5     L6,9l0.4-0.1c0,0.1,0.1,0.2,0.1,0.2C6.6,9.5,6.8,9.8,7,9.9c0.2,0.1,0.5,0.2,0.9,0.2c0.5,0,0.8-0.1,1-0.2c0.2-0.1,0.4-0.4,0.5-0.7     c0-0.1,0.1-0.1,0.1-0.2L9.9,9z"
+      />
+      <path
+        fill={fillColor}
+        d="M7.9,11.5c-0.6,0-1-0.3-1.3-0.7l-0.6-0.5c0,0-0.1-0.1-0.1-0.1l-0.3-1c0-0.1,0-0.1,0-0.2     c0-0.1,0.1-0.1,0.2-0.1l0.4-0.1c0.1,0,0.2,0,0.3,0.1l0.1,0.2C6.8,9.5,7,9.6,7.1,9.7c0.1,0.1,0.3,0.1,0.8,0.1     c0.6,0,0.8-0.1,0.9-0.1C8.9,9.6,9,9.5,9.2,9.1l0.1-0.2c0-0.1,0.2-0.2,0.3-0.1L10,8.8c0.1,0,0.1,0.1,0.2,0.1c0,0.1,0,0.1,0,0.2     l-0.3,1c0,0,0,0.1-0.1,0.1l-0.6,0.5c-0.1,0.2-0.3,0.4-0.5,0.5C8.5,11.4,8.2,11.5,7.9,11.5z M6.5,9.9L7,10.4c0,0,0,0,0.1,0.1     C7.3,10.8,7.5,11,7.9,11c0.2,0,0.4,0,0.5-0.1c0.1-0.1,0.3-0.2,0.3-0.4c0,0,0-0.1,0.1-0.1l0.6-0.5l0.1-0.3C9.4,9.9,9.2,10,9,10.1     c-0.2,0.1-0.6,0.2-1.1,0.2c-0.5,0-0.8-0.1-1.1-0.2C6.7,10,6.5,9.9,6.4,9.6L6.5,9.9z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M8,12.2c0.4-0.2,1.2-0.6,2.3-1.1c0.1,0,0.2-0.1,0.4-0.2c0.4-0.4,0.7-0.7,1-0.9c0.3-0.2,0.4-0.3,0.6-0.3      c0.1,0,0.3,0,0.3,0.1c0.1,0.1,0.1,0.2,0.1,0.4c0,0.2,0,0.4-0.1,0.7c0.3,0.4,0.4,0.6,0.4,0.8c0,0.2,0,0.3-0.1,0.3      c-0.1,0.1-0.2,0.1-0.4,0.1c-0.1,0-0.2,0-0.4-0.1c-0.2-0.1-0.4-0.2-0.6-0.4c-0.6,0.1-1.5,0.5-2.7,1.1c0.2,0.1,0.3,0.2,0.3,0.2      c0.4,0.2,0.9,0.5,1.5,0.9c0.1,0,0.2,0.2,0.5,0.3c1.2,0.1,1.9,0.5,1.9,0.9c0,0.3-0.3,0.5-1,0.6c-0.3,0.4-0.6,0.6-0.8,0.6      c-0.2,0-0.5-0.3-0.7-1c0-0.1-0.1-0.2-0.1-0.3c-1-0.8-1.8-1.4-2.6-1.8c-0.9,0.5-1.8,1.2-2.6,1.9C5.2,16,5,16.4,4.6,16.4      c-0.2,0-0.5-0.2-0.8-0.7c-0.7,0-1-0.2-1-0.6c0-0.3,0.1-0.5,0.4-0.6c0.3-0.1,0.8-0.3,1.6-0.4c0.6-0.5,1.4-0.9,2.2-1.4      c-1.2-0.6-2.1-0.9-2.8-1.1C4,11.8,3.9,12,3.7,12c-0.1,0.1-0.3,0.1-0.4,0.1c-0.2,0-0.3,0-0.4-0.1c-0.1-0.1-0.1-0.2-0.1-0.3      c0-0.1,0.2-0.4,0.5-0.8c-0.1-0.3-0.1-0.5-0.1-0.6c0-0.2,0-0.4,0.1-0.5c0.1-0.1,0.2-0.1,0.4-0.1C3.8,9.7,4,9.8,4.2,10      c0.3,0.2,0.6,0.5,0.9,0.9C6,11.2,6.9,11.6,8,12.2z"
+      />
+      <path
+        fill={fillColor}
+        d="M11.3,16.6c-0.5,0-0.8-0.6-1-1.1c0-0.1,0-0.1-0.1-0.2c-0.9-0.7-1.7-1.3-2.4-1.7c-0.8,0.5-1.6,1.1-2.4,1.7      c-0.1,0.9-0.5,1.3-0.9,1.3c-0.3,0-0.6-0.2-0.9-0.7c-1,0-1.2-0.5-1.2-0.8c0-0.4,0.2-0.7,0.5-0.8c0.3-0.1,0.8-0.3,1.7-0.4      c0.5-0.4,1.1-0.8,1.8-1.1c-0.9-0.4-1.6-0.7-2.2-0.8c-0.2,0.1-0.3,0.2-0.4,0.3c-0.4,0.2-0.8,0.2-1.1,0c-0.1-0.1-0.2-0.2-0.2-0.5      c0-0.1,0.1-0.3,0.4-0.8c-0.1-0.2-0.1-0.4-0.1-0.6C2.9,10,3,9.8,3.1,9.7c0.2-0.2,0.6-0.4,1.3,0.1C4.7,10,5,10.3,5.3,10.7      C6.1,11,7,11.4,8,11.9c0.5-0.2,1.2-0.6,2.3-1c0,0,0.2-0.1,0.4-0.2c0.4-0.4,0.7-0.7,1-0.9c0.3-0.2,0.5-0.4,0.7-0.4      c0.3,0,0.4,0.1,0.5,0.2C13,9.8,13,10,13,10.2c0,0.2,0,0.3-0.1,0.6c0.3,0.4,0.4,0.7,0.4,0.9c0,0.2-0.1,0.4-0.2,0.5      c-0.1,0.1-0.3,0.2-0.5,0.2c-0.1,0-0.3,0-0.5-0.2c-0.2-0.1-0.3-0.2-0.6-0.3c-0.5,0.1-1.2,0.4-2.1,0.8c0.4,0.2,0.9,0.5,1.5,0.9      c0.1,0,0.2,0.1,0.5,0.3c0.6,0.1,2,0.3,2,1.2c0,0.4-0.4,0.7-1.1,0.9C11.9,16.4,11.6,16.6,11.3,16.6z M7.9,13c0,0,0.1,0,0.1,0      c0.8,0.4,1.7,1,2.6,1.8c0,0,0.1,0.1,0.1,0.1c0.1,0.1,0.1,0.2,0.1,0.3c0.3,0.8,0.5,0.8,0.5,0.8c0,0,0.2,0,0.6-0.5      c0,0,0.1-0.1,0.2-0.1c0.5-0.1,0.8-0.2,0.8-0.4c0-0.3-0.6-0.6-1.6-0.7c0,0-0.1,0-0.1,0c-0.3-0.2-0.4-0.3-0.5-0.3      c-0.6-0.4-1.1-0.7-1.5-0.9L8.8,13c-0.1,0-0.1-0.1-0.1-0.2c0-0.1,0.1-0.2,0.1-0.2c1.2-0.6,2.1-1,2.8-1.1c0.1,0,0.1,0,0.2,0      c0.3,0.2,0.5,0.3,0.6,0.4c0.2,0.1,0.3,0.1,0.3,0.1c0.1,0,0.2,0,0.2,0c0,0,0-0.1,0-0.2c0,0,0-0.2-0.4-0.7c0-0.1-0.1-0.1-0.1-0.2      c0-0.3,0.1-0.5,0.1-0.6c0-0.2,0-0.2-0.1-0.3c0,0,0,0-0.1,0c0,0-0.1,0-0.4,0.3c-0.2,0.2-0.6,0.5-1,0.9c0,0-0.1,0-0.1,0.1      c-0.2,0.1-0.4,0.2-0.4,0.2c-1.1,0.5-1.9,0.8-2.3,1.1c-0.1,0-0.2,0-0.2,0c-1.1-0.6-2-1-2.8-1.3c0,0-0.1,0-0.1-0.1      c-0.3-0.4-0.6-0.7-0.9-0.9C3.8,9.9,3.7,9.9,3.6,9.9c-0.1,0-0.2,0-0.2,0.1c0,0-0.1,0.1-0.1,0.3c0,0.1,0,0.3,0.1,0.6      c0,0.1,0,0.1,0,0.2C3.1,11.6,3,11.7,3,11.7c0,0.1,0,0.1,0,0.1c0.1,0.1,0.3,0.1,0.5,0c0.1-0.1,0.3-0.2,0.4-0.3      c0.1,0,0.1-0.1,0.2-0.1C5,11.6,6,11.9,7.2,12.5c0.1,0,0.1,0.1,0.1,0.2c0,0.1,0,0.2-0.1,0.2c-0.8,0.5-1.6,0.9-2.2,1.4      c0,0-0.1,0-0.1,0c-1,0.1-1.4,0.3-1.6,0.4C3.1,14.8,3,14.9,3,15.1c0,0.2,0.3,0.3,0.8,0.3c0.1,0,0.2,0,0.2,0.1      c0.3,0.5,0.5,0.5,0.6,0.5c0.2,0,0.4-0.3,0.5-0.9c0-0.1,0-0.1,0.1-0.1c0.8-0.7,1.7-1.4,2.7-1.9C7.8,13.1,7.9,13,7.9,13z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M10.5,2.4C9.9,1.9,9,1.6,7.9,1.6S6,1.9,5.3,2.4c-0.7,0.6-1,1.3-1,2.2c0,0.8,0.1,1.4,0.3,1.7      c0.3,0.5,0.4,0.8,0.4,1l0.1,0.9l1.4,0.7l0.2,0.5c0.1,0,0.3,0.1,0.5,0.1c0.2,0,0.4,0,0.6,0c0.4,0,0.8,0,1.1-0.1l0.2-0.5l1.4-0.7      l0.1-0.9c0-0.2,0.1-0.3,0.1-0.4c0.4-0.8,0.7-1.5,0.7-2.3C11.5,3.8,11.2,3,10.5,2.4z M6.4,7.3c-0.6,0-0.9-0.3-0.9-1      c0-0.3,0.1-0.6,0.2-0.7c0.1-0.2,0.4-0.2,0.7-0.2c0.6,0,0.8,0.3,0.8,0.9C7.3,7,7,7.3,6.4,7.3z M8.2,8.7c-0.1,0-0.2,0-0.2-0.1      C7.9,8.7,7.8,8.7,7.7,8.7c-0.1,0-0.2,0-0.3-0.1C7.4,8.6,7.3,8.5,7.3,8.4c0-0.1,0.1-0.2,0.2-0.4C7.7,7.8,7.8,7.6,8,7.4      C8.1,7.6,8.2,7.8,8.4,8c0.2,0.2,0.2,0.3,0.2,0.4C8.6,8.6,8.5,8.7,8.2,8.7z M9.5,7.3c-0.6,0-0.9-0.3-0.9-1c0-0.6,0.3-0.9,0.9-0.9      c0.3,0,0.5,0.1,0.6,0.2c0.1,0.1,0.2,0.4,0.2,0.7C10.3,7,10,7.3,9.5,7.3z"
+      />
+      <path
+        fill={fillColor}
+        d="M7.9,9.8c-0.2,0-0.4,0-0.6,0c-0.2,0-0.4-0.1-0.5-0.1c-0.1,0-0.1-0.1-0.2-0.1L6.5,9.1L5.1,8.4      C5,8.4,5,8.3,5,8.3L4.8,7.4c0-0.1-0.1-0.3-0.4-0.9c-0.2-0.4-0.4-1-0.4-1.8c0-1,0.4-1.8,1.1-2.4c0.7-0.6,1.6-0.9,2.8-0.9      c1.1,0,2.1,0.3,2.8,0.9l0,0c0.7,0.6,1.1,1.4,1.1,2.4c0,0.8-0.2,1.6-0.7,2.4c0,0,0,0.1-0.1,0.3l-0.1,0.9c0,0.1-0.1,0.2-0.1,0.2      L9.4,9.1L9.2,9.5c0,0.1-0.1,0.1-0.2,0.1C8.8,9.8,8.4,9.8,7.9,9.8z M7.1,9.2c0.1,0,0.2,0,0.3,0.1c0.2,0,0.4,0,0.6,0      c0.4,0,0.6,0,0.9-0.1L9,8.8C9,8.8,9,8.7,9.1,8.7L10.4,8l0.1-0.7c0-0.2,0.1-0.3,0.1-0.4c0.4-0.7,0.6-1.5,0.6-2.2      c0-0.8-0.3-1.5-0.9-2C9.7,2.1,8.9,1.8,7.9,1.8c-1,0-1.8,0.3-2.4,0.8c-0.6,0.5-0.9,1.2-0.9,2c0,0.7,0.1,1.3,0.3,1.6      c0.4,0.7,0.5,0.9,0.5,1.1L5.4,8l1.3,0.6c0.1,0,0.1,0.1,0.1,0.1L7.1,9.2z M8.2,9C8.1,9,8.1,9,8,8.9C7.7,9,7.4,9,7.3,8.8      C7.2,8.8,7.1,8.6,7.1,8.4c0-0.2,0.1-0.4,0.3-0.6c0.1-0.1,0.2-0.3,0.4-0.5c0-0.1,0.1-0.1,0.2-0.1c0,0,0,0,0,0      c0.1,0,0.2,0,0.2,0.1c0.1,0.2,0.2,0.4,0.4,0.5C8.8,8,8.8,8.2,8.8,8.4c0,0.2-0.1,0.3-0.2,0.4C8.6,8.9,8.4,9,8.2,9z M8,8.4      c0,0,0.1,0,0.1,0c0.1,0,0.1,0,0.1,0c0.1,0,0.1,0,0.1,0c0,0,0,0,0-0.1l0,0c0,0,0-0.1-0.2-0.3C8.1,8,8,8,8,7.9      C7.9,8,7.8,8,7.8,8.1C7.6,8.3,7.6,8.4,7.6,8.4c0,0.1,0,0.1,0.1,0.1c0,0,0,0,0.1,0C7.9,8.4,7.9,8.4,8,8.4z M9.5,7.6      c-0.4,0-1.1-0.2-1.1-1.2c0-0.8,0.4-1.2,1.1-1.2c0.3,0,0.6,0.1,0.8,0.3c0.2,0.2,0.3,0.5,0.3,0.8C10.6,7.4,9.9,7.6,9.5,7.6z       M9.5,5.7C9,5.7,8.9,5.9,8.9,6.3c0,0.6,0.3,0.7,0.6,0.7c0.3,0,0.6-0.1,0.6-0.8c0-0.2,0-0.4-0.1-0.5C9.9,5.7,9.7,5.7,9.5,5.7z       M6.4,7.6C6,7.6,5.3,7.4,5.3,6.3c0-0.4,0.1-0.7,0.3-0.9c0.2-0.2,0.5-0.3,0.8-0.3c0.7,0,1.1,0.4,1.1,1.1C7.5,7.4,6.8,7.6,6.4,7.6      z M6.5,5.7C6.2,5.7,6.1,5.7,6,5.8C5.9,5.9,5.8,6.1,5.8,6.3c0,0.6,0.3,0.7,0.6,0.7C6.7,7.1,7,7,7,6.3C7,5.8,6.9,5.7,6.5,5.7z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default PoisonedSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/PoisonedSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/PoisonedSvg/index.ts
new file mode 100644
index 0000000..38e5e0a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/PoisonedSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import PoisonedSvg from "./PoisonedSvg";
+
+const LightPoisonedSvg = asLightSvg(PoisonedSvg);
+const DarkPoisonedSvg = asDarkSvg(PoisonedSvg);
+const GrayPoisonedSvg = asGraySvg(PoisonedSvg);
+
+export default PoisonedSvg;
+export { PoisonedSvg, LightPoisonedSvg, DarkPoisonedSvg, GrayPoisonedSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/ProneSvg/ProneSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/ProneSvg/ProneSvg.tsx
new file mode 100644
index 0000000..2fd1237
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/ProneSvg/ProneSvg.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ProneSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 22 22">
+      <path
+        fill={fillColor}
+        d="M13.72,15.63c-1.05.86-2,1.51-3.77,0s-3-3.71-4.52-3.77-5.21.75-5.4,0,.57-1.51,1.51-1.51S4.61,11,6.18,9.6s2.76-2.07,3-3.77S8.57.94,9.19.31s1.32-.25,1.51.75,1,5.27,0,7c0,0-.19,3.14.75,3.77,0,0,1.44-2.39,3-3S19.18,8,19,8.84s-.13,1.44-1.51,1.51-3.08.38-4.52,3a6.44,6.44,0,0,1,3-.75,4.28,4.28,0,0,1,3,3c.06.94-.63,1.88-1.51,1.51S16.79,13.11,13.72,15.63Z"
+      />
+      <ellipse
+        fill={fillColor}
+        cx="5.72"
+        cy="6.7"
+        rx="1.88"
+        ry="2.49"
+        transform="translate(-2.03 2.51) rotate(-21.1)"
+      />
+    </BaseSvg>
+  );
+};
+
+export default ProneSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/ProneSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/ProneSvg/index.ts
new file mode 100644
index 0000000..3731756
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/ProneSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import ProneSvg from "./ProneSvg";
+
+const LightProneSvg = asLightSvg(ProneSvg);
+const DarkProneSvg = asDarkSvg(ProneSvg);
+const GrayProneSvg = asGraySvg(ProneSvg);
+
+export default ProneSvg;
+export { ProneSvg, LightProneSvg, DarkProneSvg, GrayProneSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/RestrainedSvg/RestrainedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/RestrainedSvg/RestrainedSvg.tsx
new file mode 100644
index 0000000..7a2b0f1
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/RestrainedSvg/RestrainedSvg.tsx
@@ -0,0 +1,39 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const RestrainedSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 18.82 21.16">
+      <text
+        stroke={fillColor}
+        style={{ fontSize: "8px" }}
+        transform="translate(7 6.84)"
+      >
+        R
+      </text>
+      <path
+        fill={fillColor}
+        d="M18.75,10.61c-1.5,1.41-2.84,3.08-4.56,4.13-1.05.64-2.68.34-4,.46A7.14,7.14,0,0,1,13.8,7.39c.32-.15,1-.18,1.1,0a1.67,1.67,0,0,1,.21,1.33,14,14,0,0,1-1.61,2.17c2.2-.87,2.5-1.69,3-3.76.46-1.82,0-4.66.71-4.95.83,0,1.69-.33,1.57,1.26C18.59,6.18,18.75,7.85,18.75,10.61Z"
+      />
+      <path
+        fill={fillColor}
+        d="M.07,10.61c1.5,1.41,2.84,3.08,4.56,4.13,1.05.64,2.68.34,4,.46A7.14,7.14,0,0,0,5,7.39c-.32-.15-1-.18-1.1,0C3.69,7.74,4.84,8.8,5,9.16c.28.62,0,1.12.32,1.73-3-1.23-2.5-1.69-3-3.76-.46-1.82,0-4.66-.71-4.95C.75,2.2-.11,1.84,0,3.43.23,6.18.07,7.85.07,10.61Z"
+      />
+      <path
+        fill={fillColor}
+        d="M2.51,21.16c-.71-1.14-.56-2,.93-2q5.6-.07,11.19,0c1.49,0,1.64.83.93,2Z"
+      />
+      <path
+        fill={fillColor}
+        d="M9.22,18.12c-1.92,0-3.85.06-5.76,0-.46,0-.89-.54-1.34-.82.45-.37.89-1,1.34-1.06,3.76-.08,7.52-.07,11.28,0,.41,0,.81.61,1.21.94-.41.32-.8.91-1.22.93C12.9,18.18,11.06,18.12,9.22,18.12Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default RestrainedSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/RestrainedSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/RestrainedSvg/index.ts
new file mode 100644
index 0000000..515d97d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/RestrainedSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import RestrainedSvg from "./RestrainedSvg";
+
+const LightRestrainedSvg = asLightSvg(RestrainedSvg);
+const DarkRestrainedSvg = asDarkSvg(RestrainedSvg);
+const GrayRestrainedSvg = asGraySvg(RestrainedSvg);
+
+export default RestrainedSvg;
+export {
+  RestrainedSvg,
+  LightRestrainedSvg,
+  DarkRestrainedSvg,
+  GrayRestrainedSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/StunnedSvg/StunnedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/StunnedSvg/StunnedSvg.tsx
new file mode 100644
index 0000000..7f9713c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/StunnedSvg/StunnedSvg.tsx
@@ -0,0 +1,43 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const StunnedSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 18.7 23.2">
+      <path
+        fill={fillColor}
+        d="M16.6,12.7c0,0-0.1,0-0.1,0c0-0.1,0-0.1,0-0.2c0-4.3-3.2-7.8-7.2-7.8s-7.2,3.5-7.2,7.8c0,0.1,0,0.1,0,0.2   c-0.1,0-0.1,0-0.2,0c-0.6,0.2-0.8,1.1-0.5,2.1c0.3,1,1,1.6,1.6,1.5c0.2,0.4,0.4,0.8,0.7,1.1c0.5,2.9,2.8,5.8,5.6,5.8   c2.8,0,5.1-3,5.6-5.8c0.3-0.3,0.5-0.7,0.7-1.1c0.6,0.1,1.2-0.5,1.5-1.5C17.4,13.8,17.2,12.9,16.6,12.7z"
+      />
+
+      <path
+        fill={secondaryFillColor}
+        d="M10.3,15.6c0-0.3-0.1-0.5-0.2-0.7s-0.4-0.3-0.8-0.5c-0.7-0.3-1.3-0.6-1.7-0.9C7.2,13.3,7,12.8,7,12.2    c0-0.6,0.2-1.1,0.7-1.4c0.4-0.4,1-0.6,1.7-0.6c0.7,0,1.2,0.2,1.7,0.6c0.4,0.4,0.6,0.9,0.6,1.6l0,0h-1.4c0-0.3-0.1-0.6-0.2-0.8    c-0.2-0.2-0.4-0.3-0.7-0.3c-0.3,0-0.5,0.1-0.7,0.3c-0.2,0.2-0.2,0.4-0.2,0.6c0,0.2,0.1,0.4,0.3,0.6s0.5,0.3,0.9,0.5    c0.7,0.2,1.2,0.5,1.5,0.9s0.5,0.8,0.5,1.4c0,0.6-0.2,1.1-0.6,1.5s-1,0.5-1.7,0.5c-0.7,0-1.3-0.2-1.8-0.6c-0.5-0.4-0.7-1-0.7-1.7    l0,0h1.4c0,0.4,0.1,0.8,0.3,1c0.2,0.2,0.5,0.3,0.9,0.3c0.3,0,0.5-0.1,0.7-0.2S10.3,15.9,10.3,15.6z"
+      />
+
+      <path
+        stroke={fillColor}
+        fill={secondaryFillColor}
+        d="M7.9,3.1c0,0-1.7,0.2-2.8,0.3c-0.1,0-0.2,0.1-0.2,0.2c0,0.1,0,0.2,0.1,0.3C5.7,4.6,7,5.8,7,5.8     S6.6,7.5,6.4,8.6c0,0.1,0,0.2,0.1,0.3c0.1,0.1,0.2,0.1,0.3,0c1-0.6,2.5-1.4,2.5-1.4s1.5,0.8,2.5,1.4c0.1,0,0.2,0,0.3,0     c0.1-0.1,0.1-0.2,0.1-0.3c-0.2-1.1-0.6-2.8-0.6-2.8s1.3-1.1,2.1-1.9c0.1-0.1,0.1-0.2,0.1-0.3c0-0.1-0.1-0.2-0.2-0.2     c-1.1-0.1-2.8-0.3-2.8-0.3S10,1.6,9.5,0.5c0-0.1-0.1-0.2-0.2-0.2C9.2,0.4,9.1,0.4,9,0.5C8.6,1.6,7.9,3.1,7.9,3.1z"
+      />
+
+      <path
+        stroke={fillColor}
+        fill={secondaryFillColor}
+        d="M15,7.2c0,0-1,0.1-1.6,0.2c-0.1,0-0.1,0-0.1,0.1c0,0.1,0,0.1,0,0.2c0.5,0.4,1.2,1.1,1.2,1.1s-0.2,1-0.3,1.6     c0,0.1,0,0.1,0.1,0.2c0.1,0,0.1,0,0.2,0c0.6-0.3,1.4-0.8,1.4-0.8s0.9,0.5,1.4,0.8c0.1,0,0.1,0,0.2,0c0.1,0,0.1-0.1,0.1-0.2     c-0.1-0.6-0.3-1.6-0.3-1.6s0.7-0.7,1.2-1.1c0,0,0.1-0.1,0-0.2s-0.1-0.1-0.1-0.1c-0.7-0.1-1.6-0.2-1.6-0.2s-0.4-0.9-0.7-1.5     c0-0.1-0.1-0.1-0.1-0.1c-0.1,0-0.1,0-0.1,0.1C15.4,6.3,15,7.2,15,7.2z"
+      />
+
+      <path
+        stroke={fillColor}
+        fill={secondaryFillColor}
+        d="M2.1,7.2c0,0-1,0.1-1.6,0.2c-0.1,0-0.1,0-0.1,0.1c0,0.1,0,0.1,0,0.2c0.5,0.4,1.2,1.1,1.2,1.1     s-0.2,1-0.3,1.6c0,0.1,0,0.1,0.1,0.2c0.1,0,0.1,0,0.2,0C2.1,10.2,3,9.7,3,9.7s0.9,0.5,1.4,0.8c0.1,0,0.1,0,0.2,0     c0.1,0,0.1-0.1,0.1-0.2C4.5,9.7,4.3,8.7,4.3,8.7S5,8.1,5.5,7.6c0,0,0.1-0.1,0-0.2c0-0.1-0.1-0.1-0.1-0.1C4.8,7.3,3.8,7.2,3.8,7.2     S3.4,6.3,3.1,5.7C3.1,5.6,3,5.6,3,5.6c-0.1,0-0.1,0-0.1,0.1C2.6,6.3,2.1,7.2,2.1,7.2z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default StunnedSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/StunnedSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/StunnedSvg/index.ts
new file mode 100644
index 0000000..5b67f83
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/StunnedSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import StunnedSvg from "./StunnedSvg";
+
+const LightStunnedSvg = asLightSvg(StunnedSvg);
+const DarkStunnedSvg = asDarkSvg(StunnedSvg);
+const GrayStunnedSvg = asGraySvg(StunnedSvg);
+
+export default StunnedSvg;
+export { StunnedSvg, LightStunnedSvg, DarkStunnedSvg, GrayStunnedSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/UnconsciousSvg/UnconsciousSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/conditions/UnconsciousSvg/UnconsciousSvg.tsx
new file mode 100644
index 0000000..d86e44b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/UnconsciousSvg/UnconsciousSvg.tsx
@@ -0,0 +1,56 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const UnconsciousSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 15.9 18.6">
+      <path
+        fill={fillColor}
+        d="M15.3,8.1c0,0-0.1,0-0.1,0c0-0.1,0-0.1,0-0.2C15.2,3.5,11.9,0,8,0S0.8,3.5,0.8,7.8c0,0.1,0,0.1,0,0.2   c-0.1,0-0.1,0-0.2,0c-0.6,0.2-0.8,1.1-0.5,2.1c0.3,1,1,1.6,1.6,1.5c0.2,0.4,0.4,0.8,0.7,1.1c0.5,2.9,2.8,5.8,5.6,5.8   c2.8,0,5.1-3,5.6-5.8c0.3-0.3,0.5-0.7,0.7-1.1c0.6,0.1,1.2-0.5,1.5-1.5C16.1,9.2,15.9,8.2,15.3,8.1z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M10.4,13.9c0,1.3-1,0-2.3,0s-2.3,1.3-2.3,0s1-2.3,2.3-2.3S10.4,12.6,10.4,13.9z"
+      />
+      <rect
+        x="4.6"
+        y="5.8"
+        transform="matrix(-0.7071 0.7071 -0.7071 -0.7071 14.1626 10.267)"
+        fill={secondaryFillColor}
+        width="0.7"
+        height="4.5"
+      />
+      <rect
+        x="4.6"
+        y="5.8"
+        transform="matrix(-0.7071 -0.7071 0.7071 -0.7071 2.7546 17.2743)"
+        fill={secondaryFillColor}
+        width="0.7"
+        height="4.5"
+      />
+      <rect
+        x="10.6"
+        y="5.8"
+        transform="matrix(-0.7071 0.7071 -0.7071 -0.7071 24.4054 6.0243)"
+        fill={secondaryFillColor}
+        width="0.7"
+        height="4.5"
+      />
+      <rect
+        x="10.6"
+        y="5.8"
+        transform="matrix(-0.7071 -0.7071 0.7071 -0.7071 12.9974 21.517)"
+        fill={secondaryFillColor}
+        width="0.7"
+        height="4.5"
+      />
+    </BaseSvg>
+  );
+};
+
+export default UnconsciousSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/conditions/UnconsciousSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/conditions/UnconsciousSvg/index.ts
new file mode 100644
index 0000000..ef667b4
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/conditions/UnconsciousSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import UnconsciousSvg from "./UnconsciousSvg";
+
+const LightUnconsciousSvg = asLightSvg(UnconsciousSvg);
+const DarkUnconsciousSvg = asDarkSvg(UnconsciousSvg);
+const GrayUnconsciousSvg = asGraySvg(UnconsciousSvg);
+
+export default UnconsciousSvg;
+export {
+  UnconsciousSvg,
+  LightUnconsciousSvg,
+  DarkUnconsciousSvg,
+  GrayUnconsciousSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/AcidSvg/AcidSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/AcidSvg/AcidSvg.tsx
new file mode 100644
index 0000000..f43946d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/AcidSvg/AcidSvg.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const AcidSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 10.91 17.92">
+      <path
+        fill={fillColor}
+        d="M6.84,10.62q.65,0,.65-.8a.69.69,0,0,0-.16-.5.64.64,0,0,0-.48-.16q-.67,0-.67.72T6.84,10.62Z"
+      />
+      <path
+        fill={fillColor}
+        d="M4.53,10.62q.66,0,.66-.8t-.64-.66A.66.66,0,0,0,4,9.33a.76.76,0,0,0-.17.54Q3.87,10.62,4.53,10.62Z"
+      />
+      <path
+        fill={fillColor}
+        d="M5.49.65V0a3.3,3.3,0,0,1,0,.34,3.3,3.3,0,0,1,0-.34V.65C4.8,3.87,0,8.34,0,12.08c0,4,2,5.8,5.42,5.83h.07c3.47,0,5.42-1.86,5.42-5.83C10.91,8.34,6.11,3.87,5.49.65ZM3.69,6.91a2.93,2.93,0,0,1,2-.65,2.93,2.93,0,0,1,2,.65A2.12,2.12,0,0,1,8.39,8.6a3.45,3.45,0,0,1-.5,1.75,1,1,0,0,0-.08.28l-.1.65-1.09.52-.16.4a2.54,2.54,0,0,1-.8.1,3.37,3.37,0,0,1-.45,0,2.09,2.09,0,0,1-.35-.07l-.16-.4-1.1-.52-.1-.65a2.67,2.67,0,0,0-.34-.73,2.65,2.65,0,0,1-.24-1.3A2.12,2.12,0,0,1,3.69,6.91ZM8.08,16q-.3.36-.49.36t-.45-.61l-.07-.19a10,10,0,0,0-1.63-1.13,8.87,8.87,0,0,0-1.65,1.19q-.1.73-.44.73t-.49-.41q-.66,0-.66-.36a.4.4,0,0,1,.25-.39,4.29,4.29,0,0,1,1-.24,11.71,11.71,0,0,1,1.4-.87,7,7,0,0,0-1.78-.67,1.57,1.57,0,0,1-.3.21.55.55,0,0,1-.25.07.4.4,0,0,1-.26-.07.25.25,0,0,1-.09-.21,1.24,1.24,0,0,1,.29-.5,1.86,1.86,0,0,1-.06-.4.45.45,0,0,1,.08-.29.28.28,0,0,1,.23-.09.7.7,0,0,1,.39.19,4.73,4.73,0,0,1,.58.59,15.64,15.64,0,0,1,1.79.8q.42-.23,1.48-.68l.27-.12a6.63,6.63,0,0,1,.62-.57.75.75,0,0,1,.36-.19.24.24,0,0,1,.2.08.42.42,0,0,1,.06.26,2.75,2.75,0,0,1,0,.42,1,1,0,0,1,.28.52.29.29,0,0,1-.08.22.33.33,0,0,1-.23.07.6.6,0,0,1-.24-.08l-.4-.24A7.2,7.2,0,0,0,6,14.1l.21.12q.39.22,1,.59l.32.19q1.18.14,1.18.6Q8.72,15.9,8.08,16Z"
+      />
+      <path
+        fill={fillColor}
+        d="M5.51,11.67a.36.36,0,0,0,.19-.06.36.36,0,0,0,.19.06q.29,0,.29-.26A.6.6,0,0,0,6,11.09a3.06,3.06,0,0,1-.29-.41,3.38,3.38,0,0,1-.29.41.6.6,0,0,0-.19.33.23.23,0,0,0,.07.19A.32.32,0,0,0,5.51,11.67Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default AcidSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/AcidSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/AcidSvg/index.ts
new file mode 100644
index 0000000..e237d0e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/AcidSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import AcidSvg from "./AcidSvg";
+
+const LightAcidSvg = asLightSvg(AcidSvg);
+const DarkAcidSvg = asDarkSvg(AcidSvg);
+const GrayAcidSvg = asGraySvg(AcidSvg);
+
+export default AcidSvg;
+export { AcidSvg, LightAcidSvg, DarkAcidSvg, GrayAcidSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/BludgeoningSvg/BludgeoningSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/BludgeoningSvg/BludgeoningSvg.tsx
new file mode 100644
index 0000000..2e9b3b6
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/BludgeoningSvg/BludgeoningSvg.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const BludgeoningSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 20.29 19.76">
+      <polygon
+        fill={fillColor}
+        points="5.88 14.95 0.45 15.85 4.14 12.74 0.15 9.36 4.26 9.36 0 0 5.52 4.58 4.61 1.05 6.75 2.8 8.19 0.43 9.93 3.57 11.67 0.68 10.68 13.56 5.88 14.95"
+      />
+      <polygon
+        fill={fillColor}
+        points="5.17 19.26 8.62 13.3 8.09 12.99 8.71 11.92 7.2 11.05 6.71 11.9 4.16 10.44 7.91 3.95 10.45 5.41 9.97 6.25 11.46 7.11 13.53 4.75 16.22 7.44 14.9 9.09 16.58 10.06 17.06 9.23 19.6 10.7 15.86 17.19 13.31 15.72 13.81 14.86 12.13 13.89 11.51 14.96 10.99 14.66 8.35 19.26 5.17 19.26"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M8.09,4.63l1.68,1L6.52,11.22l-1.68-1L8.09,4.63m5.46.85,2,2L14.5,8.79,11.95,7.32l1.61-1.84M9.78,6.71l6.5,3.75L14,14.4,7.5,10.64,9.78,6.71m7.47,3.2,1.68,1L15.67,16.5l-1.68-1,3.25-5.63h0M9.12,12.22h0m0,0,2.55,1.47-.34.59L8.78,12.81l.34-.59M9,13.6l1.51.87-2.47,4.3H6L9,13.6H9M7.73,3.26l-.5.87L4,9.75l-.5.87.87.5,1.68,1,.87.5.5-.86L8,12.1l-.12.21-.5.87.53.3L5.17,18.26l-.87,1.5H8.63l.29-.5,2.25-3.92.52.3.5-.87.12-.21.81.47-.5.86.87.5,1.68,1,.87.5.5-.87,3.25-5.63.5-.87-.87-.5L17.74,9l-.87-.5-.48.83-.74-.43.68-.84.56-.7-.63-.63-2-2L13.5,4l-.7.81L11.36,6.47l-.7-.41.48-.83-.87-.5-1.68-1-.87-.5Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default BludgeoningSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/BludgeoningSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/BludgeoningSvg/index.ts
new file mode 100644
index 0000000..9417f10
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/BludgeoningSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import BludgeoningSvg from "./BludgeoningSvg";
+
+const LightBludgeoningSvg = asLightSvg(BludgeoningSvg);
+const DarkBludgeoningSvg = asDarkSvg(BludgeoningSvg);
+const GrayBludgeoningSvg = asGraySvg(BludgeoningSvg);
+
+export default BludgeoningSvg;
+export {
+  BludgeoningSvg,
+  LightBludgeoningSvg,
+  DarkBludgeoningSvg,
+  GrayBludgeoningSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/ColdSvg/ColdSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ColdSvg/ColdSvg.tsx
new file mode 100644
index 0000000..eddd3b4
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ColdSvg/ColdSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ColdSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 15.35 16.65">
+      <path
+        fill={fillColor}
+        d="M7.59,16.65a.63.63,0,0,1-.42-.72c0-.19,0-.38,0-.64l-.63.63c-.09.09-.18.19-.28.27a.52.52,0,0,1-.74-.73c.11-.13.24-.25.37-.38l1.2-1.19a.31.31,0,0,0,.07-.2c0-.89,0-1.78,0-2.67a.25.25,0,0,0-.12-.19A2.77,2.77,0,0,1,5.7,10l-2.23,1.2a.27.27,0,0,0-.09.16q-.23,1-.45,1.93a.57.57,0,0,1-.44.5.52.52,0,0,1-.6-.64c.07-.36.17-.72.25-1.09,0,0,0-.07,0-.16l-.62.33-.48.25a.52.52,0,0,1-.71-.22.51.51,0,0,1,.22-.7l1-.52L.48,10.76a.53.53,0,1,1,.23-1c.61.14,1.24.26,1.84.44a.83.83,0,0,0,.73-.1c.63-.35,1.27-.68,1.92-1a2.43,2.43,0,0,1,0-1.47L3.49,6.67a1,1,0,0,0-.92-.14A13.48,13.48,0,0,1,.68,7,.52.52,0,1,1,.44,6l1-.24.2-.07L.57,5.1a.51.51,0,0,1,.22-1,.83.83,0,0,1,.34.09l1,.53-.23-1c0-.06,0-.12,0-.18A.52.52,0,0,1,2.29,3a.51.51,0,0,1,.6.4c.16.63.3,1.26.46,1.88a.41.41,0,0,0,.17.24L5.69,6.66l.1-.09A2.54,2.54,0,0,1,7,5.81c.11,0,.16-.07.16-.19,0-.91,0-1.81,0-2.72a.27.27,0,0,0-.07-.17L5.59,1.24A.52.52,0,1,1,6.33.51a9.67,9.67,0,0,0,.84.78c0-.22,0-.44,0-.67,0-.38.21-.62.52-.62a.56.56,0,0,1,.53.62c0,.21,0,.41,0,.62,0,0,0,0,0,.07L9.06.49A.51.51,0,0,1,9.62.33.44.44,0,0,1,10,.74a.71.71,0,0,1-.15.45c-.49.51-1,1-1.49,1.51a.31.31,0,0,0-.1.18c0,1,0,1.92,0,2.89a2.68,2.68,0,0,1,1.46.9l2.2-1.18A.3.3,0,0,0,12,5.3c.15-.62.3-1.24.45-1.86.09-.36.35-.55.65-.47a.53.53,0,0,1,.36.7l-.26,1.12.92-.49.26-.13a.52.52,0,0,1,.66.24.49.49,0,0,1-.17.66c-.28.18-.58.32-.88.48l-.26.15c.38.09.71.18,1,.24a.73.73,0,0,1,.59.44v.23c-.22.4-.36.46-.81.36l-.18,0-1.9-.51a.22.22,0,0,0-.14,0l-2,1.08a.24.24,0,0,0-.09.2,2.38,2.38,0,0,1,0,1.17c0,.14,0,.19.12.24l2,1.07a.33.33,0,0,0,.21,0l2-.49c.46-.11.59,0,.81.36v.23a.72.72,0,0,1-.59.44c-.3.06-.59.14-.93.22l.95.51a.52.52,0,0,1,.25.71.53.53,0,0,1-.75.21l-.22-.12-.91-.48.29,1.24a.52.52,0,1,1-1,.25c-.16-.68-.31-1.36-.47-2a.23.23,0,0,0-.09-.14L9.68,10a2.67,2.67,0,0,1-1.46.9c0,1,0,1.93,0,2.89a.31.31,0,0,0,.1.18c.5.5,1,1,1.49,1.51a.71.71,0,0,1,.15.45.44.44,0,0,1-.34.41.51.51,0,0,1-.56-.16l-.79-.81-.06,0c0,.19,0,.37,0,.56a.63.63,0,0,1-.45.72ZM9.24,8.33A1.56,1.56,0,0,0,7.7,6.77a1.55,1.55,0,1,0,0,3.1A1.56,1.56,0,0,0,9.24,8.33Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default ColdSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/ColdSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ColdSvg/index.ts
new file mode 100644
index 0000000..0ceb0c0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ColdSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import ColdSvg from "./ColdSvg";
+
+const LightColdSvg = asLightSvg(ColdSvg);
+const DarkColdSvg = asDarkSvg(ColdSvg);
+const GrayColdSvg = asGraySvg(ColdSvg);
+
+export default ColdSvg;
+export { ColdSvg, LightColdSvg, DarkColdSvg, GrayColdSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/FireSvg/FireSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/FireSvg/FireSvg.tsx
new file mode 100644
index 0000000..b0c255a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/FireSvg/FireSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const FireSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 13.05 19">
+      <path
+        fill={fillColor}
+        d="M7,19c-3.06,0-7-2.49-7-6.33a3.68,3.68,0,0,0,3,1.81S.19,10.63,5,7.24,7,0,7,0s3.06,1.81,2,4.52S8.06,11.26,9,12c0,0-.37-5.55,3-6.57,0,0-1.94,2.94,0,4.52S13.69,19,7,19Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default FireSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/FireSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/FireSvg/index.ts
new file mode 100644
index 0000000..097cc1d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/FireSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import FireSvg from "./FireSvg";
+
+const LightFireSvg = asLightSvg(FireSvg);
+const DarkFireSvg = asDarkSvg(FireSvg);
+const GrayFireSvg = asGraySvg(FireSvg);
+
+export default FireSvg;
+export { FireSvg, LightFireSvg, DarkFireSvg, GrayFireSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/ForceSvg/ForceSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ForceSvg/ForceSvg.tsx
new file mode 100644
index 0000000..6e6dd41
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ForceSvg/ForceSvg.tsx
@@ -0,0 +1,46 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ForceSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 17.8 17.84">
+      <line
+        fill={fillColor}
+        stroke={fillColor}
+        strokeMiterlimit={10}
+        x1="15.58"
+        y1="5.38"
+        x2="13.21"
+        y2="8.54"
+      />
+      <line
+        fill={fillColor}
+        stroke={fillColor}
+        strokeMiterlimit={10}
+        x1="12.42"
+        y1="2.22"
+        x2="6.1"
+        y2="6.96"
+      />
+      <path
+        fill={fillColor}
+        stroke={fillColor}
+        strokeMiterlimit={10}
+        d="M.7,14.06a2.46,2.46,0,0,0,.82,2.49,2.48,2.48,0,0,0,2.76.12l.24.55,4.74-.79s-2.11,0-2.37,0a39.42,39.42,0,0,1,3.16-2.37c-1,.25-2.76.57-3.54.72L15.58,2.22,3.73,10.77v-3l-1.33,4L2.06,12,1.37,8.54.58,14.06Zm2.24-1.58a9.06,9.06,0,0,0,4.49-2.11c.15-.16.25-.26.25-.26s-.16.17-.25.26A4.61,4.61,0,0,0,6.1,14.06c.39,2.14-2.73,1.38-3.95,2.37C2.58,15,1.37,12.81,2.94,12.48Z"
+      />
+      <path
+        fill={fillColor}
+        stroke={fillColor}
+        strokeMiterlimit={10}
+        d="M7.68,10.12c-.08.09-.16.17-.25.26C7.58,10.21,7.68,10.12,7.68,10.12Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default ForceSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/ForceSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ForceSvg/index.ts
new file mode 100644
index 0000000..8f79970
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ForceSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import ForceSvg from "./ForceSvg";
+
+const LightForceSvg = asLightSvg(ForceSvg);
+const DarkForceSvg = asDarkSvg(ForceSvg);
+const GrayForceSvg = asGraySvg(ForceSvg);
+
+export default ForceSvg;
+export { ForceSvg, LightForceSvg, DarkForceSvg, GrayForceSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/LightningSvg/LightningSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/LightningSvg/LightningSvg.tsx
new file mode 100644
index 0000000..b238d31
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/LightningSvg/LightningSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const LightningSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 10.67 16">
+      <path
+        fill={fillColor}
+        d="M3.62,0H9.33L6.07,6.67h4.6L1.33,16l1.9-6.67H0Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default LightningSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/LightningSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/LightningSvg/index.ts
new file mode 100644
index 0000000..883ece2
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/LightningSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import LightningSvg from "./LightningSvg";
+
+const LightLightningSvg = asLightSvg(LightningSvg);
+const DarkLightningSvg = asDarkSvg(LightningSvg);
+const GrayLightningSvg = asGraySvg(LightningSvg);
+
+export default LightningSvg;
+export { LightningSvg, LightLightningSvg, DarkLightningSvg, GrayLightningSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/NecroticSvg/NecroticSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/NecroticSvg/NecroticSvg.tsx
new file mode 100644
index 0000000..7ee2826
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/NecroticSvg/NecroticSvg.tsx
@@ -0,0 +1,45 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const NecroticSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 21.27 19.96">
+      <line
+        fill={"none"}
+        stroke={secondaryFillColor}
+        strokeMiterlimit={10}
+        x1="7.14"
+        y1="9.36"
+        x2="19.1"
+        y2="9.36"
+      />
+      <path
+        fill={fillColor}
+        d="M19.67,4.83S9.64-6.7,1.06,5.88c0,0,13-6.71,16.61,5Z"
+      />
+      <path
+        fill={fillColor}
+        d="M.53,18.95l0-.53a20.88,20.88,0,0,1,.64-3.81c.49-1.8,3.09-2.71,4.18-3C4.83,7.28,6,4.83,7.14,3.53a4.71,4.71,0,0,1,3.19-1.8,4.71,4.71,0,0,1,3.19,1.8c1.12,1.3,2.31,3.75,1.76,8.06,1.09.31,3.69,1.22,4.18,3a20.88,20.88,0,0,1,.64,3.81l0,.53ZM10.29,4.81A3,3,0,0,0,9,5.9a4.89,4.89,0,0,0-.42,3.87c.06.21,1.1,4.08,1.74,6.58C11,13.84,12,10,12.08,9.75a4.86,4.86,0,0,0-.42-3.84A2.64,2.64,0,0,0,10.29,4.81Z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M10.33,2.23c1.33,0,5.54,2.16,4.39,9.73,0,0,3.73.85,4.25,2.78a20.6,20.6,0,0,1,.63,3.71H10.34c.15-.89,2.22-8.57,2.22-8.57,1-4.4-1.89-5.56-2.23-5.56S7.12,5.47,8.11,9.88c0,0,2.07,7.68,2.22,8.57H1.06a20.6,20.6,0,0,1,.63-3.71C2.21,12.81,5.94,12,5.94,12,4.79,4.39,9,2.23,10.33,2.23m0-1a5.22,5.22,0,0,0-3.57,2c-1.15,1.34-2.37,3.8-1.93,8-1.31.43-3.62,1.42-4.12,3.25a21.48,21.48,0,0,0-.66,3.91L0,19.45H20.66l-.06-1.06a21.48,21.48,0,0,0-.66-3.91c-.49-1.83-2.8-2.82-4.12-3.25.45-4.23-.78-6.69-1.93-8a5.22,5.22,0,0,0-3.57-2Zm0,13.13C9.78,12.26,9.19,10,9.07,9.62c-.69-3.06.78-4,1.26-4.26.48.23,1.95,1.2,1.26,4.3-.11.4-.7,2.61-1.25,4.7Z"
+      />
+      <polygon
+        fill={fillColor}
+        points="14.44 19.15 18.39 3.33 20.66 3.63 17.21 19.42 14.44 19.15"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M18.77,3.88,20.06,4,16.82,18.88l-1.76-.17L18.77,3.88M18,2.77l-.22.87L14.09,18.47l-.28,1.13L15,19.7l1.76.17.88.09.19-.87L21,4.26l.23-1.06-1.08-.14L18.9,2.89,18,2.77Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default NecroticSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/NecroticSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/NecroticSvg/index.ts
new file mode 100644
index 0000000..74c8a8a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/NecroticSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import NecroticSvg from "./NecroticSvg";
+
+const LightNecroticSvg = asLightSvg(NecroticSvg);
+const DarkNecroticSvg = asDarkSvg(NecroticSvg);
+const GrayNecroticSvg = asGraySvg(NecroticSvg);
+
+export default NecroticSvg;
+export { NecroticSvg, LightNecroticSvg, DarkNecroticSvg, GrayNecroticSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/PiercingSvg/PiercingSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PiercingSvg/PiercingSvg.tsx
new file mode 100644
index 0000000..7889fb1
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PiercingSvg/PiercingSvg.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const PiercingSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 21.17 18.95">
+      <polygon
+        fill={fillColor}
+        points="10.63 9.48 13.07 3.78 7.76 6.5 9.98 1.47 6.26 5.16 6.26 0 1.73 9.48 6.26 18.95 6.26 13.8 9.98 17.48 7.76 12.45 13.07 15.17 10.63 9.48"
+      />
+      <path
+        fill={fillColor}
+        d="M13.31,12.64c-2.59,0-8.5-.75-11.1-2.55l-.89-.62.89-.62c2.6-1.8,8.51-2.55,11.1-2.55h7.11v6.33Z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M19.67,7.06v4.83H13.31c-2.55,0-8.29-.76-10.67-2.41C5,7.82,10.75,7.06,13.31,7.06h6.36m1.5-1.5H13.31c-2.67,0-8.79.79-11.53,2.68L0,9.48l1.78,1.23c2.73,1.89,8.86,2.68,11.53,2.68h7.86V5.56Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default PiercingSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/PiercingSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PiercingSvg/index.ts
new file mode 100644
index 0000000..dc11c31
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PiercingSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import PiercingSvg from "./PiercingSvg";
+
+const LightPiercingSvg = asLightSvg(PiercingSvg);
+const DarkPiercingSvg = asDarkSvg(PiercingSvg);
+const GrayPiercingSvg = asGraySvg(PiercingSvg);
+
+export default PiercingSvg;
+export { PiercingSvg, LightPiercingSvg, DarkPiercingSvg, GrayPiercingSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/PoisonSvg/PoisonSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PoisonSvg/PoisonSvg.tsx
new file mode 100644
index 0000000..87ee4c8
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PoisonSvg/PoisonSvg.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const PoisonSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 12.93 18.44">
+      <path
+        fill={fillColor}
+        d="M6.52,13.23q.83-.46,2.93-1.35l.54-.23a13.18,13.18,0,0,1,1.23-1.14,1.48,1.48,0,0,1,.71-.38.47.47,0,0,1,.4.17.84.84,0,0,1,.13.51,5.46,5.46,0,0,1-.09.83,2.06,2.06,0,0,1,.55,1,.57.57,0,0,1-.15.43.64.64,0,0,1-.46.15,1.19,1.19,0,0,1-.47-.16q-.31-.16-.8-.47a14.26,14.26,0,0,0-3.39,1.32l.41.24q.77.44,1.9,1.17l.64.39q2.34.27,2.34,1.18,0,.59-1.26.8-.59.72-1,.72t-.9-1.21-.14-.37a19.87,19.87,0,0,0-3.24-2.23A17.6,17.6,0,0,0,3.16,17Q3,18.44,2.29,18.44q-.42,0-1-.82Q0,17.62,0,16.9a.8.8,0,0,1,.49-.76,8.5,8.5,0,0,1,2.05-.47,23.22,23.22,0,0,1,2.78-1.72A14,14,0,0,0,1.8,12.63a3.1,3.1,0,0,1-.59.42,1.09,1.09,0,0,1-.5.14A.79.79,0,0,1,.2,13,.5.5,0,0,1,0,12.64a2.45,2.45,0,0,1,.57-1,3.69,3.69,0,0,1-.13-.8.88.88,0,0,1,.15-.57.55.55,0,0,1,.45-.19,1.39,1.39,0,0,1,.77.39A9.37,9.37,0,0,1,3,11.65,31,31,0,0,1,6.52,13.23Z"
+      />
+      <path
+        fill={fillColor}
+        d="M8.9,9.31l-.32,1.27-.78.68a1.42,1.42,0,0,1-.54.6,1.55,1.55,0,0,1-.8.2,1.42,1.42,0,0,1-1.34-.8l-.79-.68L4,9.31l.47-.12.12.3a1.93,1.93,0,0,0,.65.9,2.34,2.34,0,0,0,1.17.22,2.76,2.76,0,0,0,1.28-.21,1.85,1.85,0,0,0,.65-.91l.12-.3Z"
+      />
+      <path
+        fill={fillColor}
+        d="M9.67,1.07A4.82,4.82,0,0,0,6.42,0,4.82,4.82,0,0,0,3.17,1.07,3.49,3.49,0,0,0,1.93,3.85,4.36,4.36,0,0,0,2.33,6,4.4,4.4,0,0,1,2.88,7.2L3,8.28l1.81.86.26.65a3.45,3.45,0,0,0,.58.12,5.55,5.55,0,0,0,.74,0A4.19,4.19,0,0,0,7.75,9.8L8,9.14l1.8-.86L10,7.2a1.72,1.72,0,0,1,.13-.46,5.68,5.68,0,0,0,.82-2.89A3.49,3.49,0,0,0,9.67,1.07ZM4.55,7.18q-1.07,0-1.07-1.23a1.25,1.25,0,0,1,.28-.89,1.09,1.09,0,0,1,.83-.3q1,0,1,1.09Q5.64,7.18,4.55,7.18ZM6.79,8.91a.6.6,0,0,1-.31-.1.6.6,0,0,1-.31.1.53.53,0,0,1-.35-.1A.38.38,0,0,1,5.7,8.5,1,1,0,0,1,6,8a5.58,5.58,0,0,0,.48-.68A5,5,0,0,0,7,8a1,1,0,0,1,.31.53Q7.27,8.91,6.79,8.91ZM8.36,7.18q-1.08,0-1.08-1.23t1.1-1.18A1.06,1.06,0,0,1,9.18,5a1.14,1.14,0,0,1,.26.82Q9.44,7.18,8.36,7.18Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default PoisonSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/PoisonSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PoisonSvg/index.ts
new file mode 100644
index 0000000..cc6a4de
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PoisonSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import PoisonSvg from "./PoisonSvg";
+
+const LightPoisonSvg = asLightSvg(PoisonSvg);
+const DarkPoisonSvg = asDarkSvg(PoisonSvg);
+const GrayPoisonSvg = asGraySvg(PoisonSvg);
+
+export default PoisonSvg;
+export { PoisonSvg, LightPoisonSvg, DarkPoisonSvg, GrayPoisonSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/PsychicSvg/PsychicSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PsychicSvg/PsychicSvg.tsx
new file mode 100644
index 0000000..77da0c1
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PsychicSvg/PsychicSvg.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const PsychicSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 21 21">
+      <polygon
+        fill={fillColor}
+        points="9.13 17.92 0.7 19 6.43 15.28 0.23 11.21 6.61 11.21 0 0 8.57 5.5 7.15 1.26 10.48 3.35 12.71 0.51 15.41 4.28 18.11 0.81 16.58 16.25 9.13 17.92"
+      />
+      <path
+        fill={fillColor}
+        d="M6.85,20.5l-.15-.17c-.29-.32-.57-.66-.83-1l-.39-.54.83-.31a3.79,3.79,0,0,1,.46-.16,24,24,0,0,0,3.89-1.37l.07-.15c0-.15.08-.29.12-.44A5.89,5.89,0,0,1,10,14.1.83.83,0,0,1,9.8,14a1.82,1.82,0,0,1-.28-.4A6,6,0,0,1,9,11.71a2.08,2.08,0,0,1,0-.26,1.05,1.05,0,0,1,.45-1,5.16,5.16,0,0,1-.1-.73,4.49,4.49,0,0,1,1.16-3.27A5.37,5.37,0,0,1,13.4,4.61a5.3,5.3,0,0,1,1-.11,4.08,4.08,0,0,1,3,1.24,2.8,2.8,0,0,0,.69.56A2.27,2.27,0,0,1,19.2,8a7.11,7.11,0,0,1,0,2.54c0,.14,0,.23-.05.32v0a1,1,0,0,1,.25.65A4.79,4.79,0,0,1,18.72,14a1,1,0,0,1-.54.48l0,0c-.09.31-.19.61-.3.9a4.2,4.2,0,0,1-.28.56l-.16.29a.46.46,0,0,0,0,.11l0,.12a.74.74,0,0,0,.56.65c.71.26,1.42.5,2.14.73l.35.11V20.5Z"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M14.45,5a3.59,3.59,0,0,1,2.62,1.09,3.19,3.19,0,0,0,.81.66,1.76,1.76,0,0,1,.83,1.33,6.56,6.56,0,0,1,0,2.36c0,.09,0,.19,0,.28s-.08.33.11.47a.47.47,0,0,1,.13.33,4.33,4.33,0,0,1-.6,2.27.42.42,0,0,1-.35.26l-.13,0c-.14.43-.25.85-.41,1.26s-.29.53-.42.8a.78.78,0,0,0-.07.3,1.11,1.11,0,0,0,0,.23,1.23,1.23,0,0,0,.89,1c.72.26,1.43.5,2.16.74V20H7.07a12.6,12.6,0,0,1-.8-1c.23-.08.42-.17.62-.22a24.69,24.69,0,0,0,4-1.39.48.48,0,0,0,.3-.31c.07-.24.14-.48.2-.73a.31.31,0,0,0-.06-.22A5.37,5.37,0,0,1,10.46,14a.66.66,0,0,0-.15-.23,2.92,2.92,0,0,1-.34-.44,5.41,5.41,0,0,1-.49-1.69,1.53,1.53,0,0,1,0-.19c0-.42.12-.57.51-.67a9.59,9.59,0,0,1-.16-1.06,4,4,0,0,1,1-2.92A4.82,4.82,0,0,1,13.5,5.1a4.78,4.78,0,0,1,.95-.1m0-1V4a5.8,5.8,0,0,0-1.15.12,5.84,5.84,0,0,0-3.19,2A5,5,0,0,0,8.82,9.77a4.41,4.41,0,0,0,.05.51,1.64,1.64,0,0,0-.41,1.17,2.53,2.53,0,0,0,0,.32,6.43,6.43,0,0,0,.58,2,2.29,2.29,0,0,0,.36.51l.08.09h0a6.37,6.37,0,0,0,.79,2.06l0,.12a23.32,23.32,0,0,1-3.62,1.26,4.27,4.27,0,0,0-.52.18l-.2.07-1.25.45.79,1.08a13.67,13.67,0,0,0,.86,1.06l.3.33H21V17.65l-.7-.22c-.67-.21-1.36-.45-2.12-.72-.21-.08-.22-.12-.24-.27v0l.08-.14a4.58,4.58,0,0,0,.31-.62c.1-.26.19-.52.26-.77a1.55,1.55,0,0,0,.57-.6,5.28,5.28,0,0,0,.72-2.78,1.6,1.6,0,0,0-.22-.76v-.09a7.65,7.65,0,0,0,0-2.77,2.72,2.72,0,0,0-1.36-2,2.21,2.21,0,0,1-.52-.43l0,0A4.57,4.57,0,0,0,14.45,4Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default PsychicSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/PsychicSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PsychicSvg/index.ts
new file mode 100644
index 0000000..5d95de0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/PsychicSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import PsychicSvg from "./PsychicSvg";
+
+const LightPsychicSvg = asLightSvg(PsychicSvg);
+const DarkPsychicSvg = asDarkSvg(PsychicSvg);
+const GrayPsychicSvg = asGraySvg(PsychicSvg);
+
+export default PsychicSvg;
+export { PsychicSvg, LightPsychicSvg, DarkPsychicSvg, GrayPsychicSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/RadiantSvg/RadiantSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/RadiantSvg/RadiantSvg.tsx
new file mode 100644
index 0000000..f972fb0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/RadiantSvg/RadiantSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const RadiantSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 19 19">
+      <path
+        fill={fillColor}
+        d="M9.36,18.69,9.61,17a7.46,7.46,0,0,0,4.61-1.82L19,19l-3.93-4.67a7.47,7.47,0,0,0,1.74-4.69l1.91-.28-1.92-.29A7.46,7.46,0,0,0,15,4.68L19,0,14.15,3.8A7.46,7.46,0,0,0,9.66,2L9.36,0l-.3,2h0L8.4,6.47a3,3,0,0,0-.78.39L4,4,6.84,7.63a3,3,0,0,0-.38.76L0,9.36l1.82.27a7.47,7.47,0,0,0,1.78,4.76L0,19l1-1,3.45-2.78A7.47,7.47,0,0,0,9.11,17l.25,1.67Zm-.71-3a6.82,6.82,0,0,1-6.78-6l4.57.67a3,3,0,0,0,.39.79l-1,1.75,1.74-1a3,3,0,0,0,.83.42l.5,3.4H8.65Zm1.18-.1.5-3.32a3,3,0,0,0,.77-.39l1.72,1-1-1.73a3,3,0,0,0,.4-.8l3.15-.47a6.82,6.82,0,0,1-5.57,5.73Zm5.64-6.71-3.24-.49a3,3,0,0,0-.4-.77l1-1.77-1.77,1a3,3,0,0,0-.73-.36L9.67,2.11a6.82,6.82,0,0,1,5.79,6.75Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default RadiantSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/RadiantSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/RadiantSvg/index.ts
new file mode 100644
index 0000000..2620e0f
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/RadiantSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import RadiantSvg from "./RadiantSvg";
+
+const LightRadiantSvg = asLightSvg(RadiantSvg);
+const DarkRadiantSvg = asDarkSvg(RadiantSvg);
+const GrayRadiantSvg = asGraySvg(RadiantSvg);
+
+export default RadiantSvg;
+export { RadiantSvg, LightRadiantSvg, DarkRadiantSvg, GrayRadiantSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/SlashingSvg/SlashingSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/SlashingSvg/SlashingSvg.tsx
new file mode 100644
index 0000000..75abeb0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/SlashingSvg/SlashingSvg.tsx
@@ -0,0 +1,29 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const SlashingSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 19 17">
+      <path
+        fill={fillColor}
+        d="M0,6s7.62,3.35,14.18,5.85l1-2.33,1.06.41-1.59,2.94L19,15.22l-.49,1.1-4.22-2.16L12.9,17l-1.31-.41,1-1.88S3.47,9.6,0,6Z"
+      />
+      <path fill={fillColor} d="M3,5A14.91,14.91,0,0,1,14,0S7.56.94,5,6Z" />
+      <path
+        fill={fillColor}
+        d="M7,6.45a8.13,8.13,0,0,1,6-2.73S9.49,4.24,8.09,7Z"
+      />
+      <path
+        fill={fillColor}
+        d="M10,7.89A5.65,5.65,0,0,1,14.17,6a4.92,4.92,0,0,0-3.41,2.27Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default SlashingSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/SlashingSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/SlashingSvg/index.ts
new file mode 100644
index 0000000..72d32af
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/SlashingSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import SlashingSvg from "./SlashingSvg";
+
+const LightSlashingSvg = asLightSvg(SlashingSvg);
+const DarkSlashingSvg = asDarkSvg(SlashingSvg);
+const GraySlashingSvg = asGraySvg(SlashingSvg);
+
+export default SlashingSvg;
+export { SlashingSvg, LightSlashingSvg, DarkSlashingSvg, GraySlashingSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/ThunderSvg/ThunderSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ThunderSvg/ThunderSvg.tsx
new file mode 100644
index 0000000..abd3425
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ThunderSvg/ThunderSvg.tsx
@@ -0,0 +1,36 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ThunderSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 18.06 16.86">
+      <path
+        fill={fillColor}
+        d="M17.05,6.61v.63L17,7.56a2.9,2.9,0,0,1-3.27,2.25c-.29,0-.57-.15-.87-.22a2.82,2.82,0,0,1-4.39.6h0l-.07.07a3.54,3.54,0,0,1-1.62.9c-.26.06-.52.09-.78.14h-.3l-.09,0A3.66,3.66,0,0,1,2.9,9.89a.21.21,0,0,0-.16-.06A2.24,2.24,0,0,1,.29,8.27c0-.12-.07-.24-.1-.36s0-.38,0-.57a.34.34,0,0,0,0-.07A2.2,2.2,0,0,1,1.94,5.44l.5-.08A2.83,2.83,0,0,1,6.21,3.1a4.42,4.42,0,0,1,8.62,1l.11,0a2.88,2.88,0,0,1,2,2.08C17,6.35,17,6.48,17.05,6.61Z"
+      />
+      <polygon
+        fill={fillColor}
+        points="1.52 11.25 0 15.98 2.65 12.14 1.52 11.25"
+      />
+      <polygon
+        fill={fillColor}
+        points="5.45 12.62 5.04 16.86 7.16 12.62 5.45 12.62"
+      />
+      <polygon
+        fill={fillColor}
+        points="10.79 12.43 11.67 16.65 12.1 12.14 10.79 12.43"
+      />
+      <polygon
+        fill={fillColor}
+        points="14.58 11.44 18.06 16.86 15.82 10.91 14.58 11.44"
+      />
+    </BaseSvg>
+  );
+};
+
+export default ThunderSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/damageTypes/ThunderSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ThunderSvg/index.ts
new file mode 100644
index 0000000..a529f32
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/damageTypes/ThunderSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import ThunderSvg from "./ThunderSvg";
+
+const LightThunderSvg = asLightSvg(ThunderSvg);
+const DarkThunderSvg = asDarkSvg(ThunderSvg);
+const GrayThunderSvg = asGraySvg(ThunderSvg);
+
+export default ThunderSvg;
+export { ThunderSvg, LightThunderSvg, DarkThunderSvg, GrayThunderSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asBuilderSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asBuilderSvg.tsx
new file mode 100644
index 0000000..a0d9c95
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asBuilderSvg.tsx
@@ -0,0 +1,26 @@
+import * as React from "react";
+
+import { SvgConstantBuilderTheme } from "../SvgConstants";
+import { InjectedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asBuilderSvg<
+  C extends React.ComponentType<React.ComponentProps<C> & InjectedSvgProps>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsBuilderSvg extends React.PureComponent<
+    ResolvedProps & InjectedSvgProps
+  > {
+    static displayName = `asBuilderSvg(${getDisplayName(WrappedComponent)})`;
+
+    static defaultProps = {
+      fillColor: SvgConstantBuilderTheme.fill,
+      secondaryFillColor: SvgConstantBuilderTheme.secondaryFill,
+      className: "ddbc-svg--builder",
+    };
+
+    render() {
+      return <WrappedComponent {...(this.props as any)} />;
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asDarkModeNegativeSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asDarkModeNegativeSvg.tsx
new file mode 100644
index 0000000..ca33e21
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asDarkModeNegativeSvg.tsx
@@ -0,0 +1,28 @@
+import * as React from "react";
+
+import { SvgConstantDarkModeNegativeTheme } from "../SvgConstants";
+import { InjectedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asDarkModeNegativeSvg<
+  C extends React.ComponentType<React.ComponentProps<C> & InjectedSvgProps>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsDarkModeNegativeSvg extends React.PureComponent<
+    ResolvedProps & InjectedSvgProps
+  > {
+    static displayName = `asDarkModeNegativeSvg(${getDisplayName(
+      WrappedComponent
+    )})`;
+
+    static defaultProps = {
+      fillColor: SvgConstantDarkModeNegativeTheme.fill,
+      secondaryFillColor: SvgConstantDarkModeNegativeTheme.secondaryFill,
+      className: "ddbc-svg--positive",
+    };
+
+    render() {
+      return <WrappedComponent {...(this.props as any)} />;
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asDarkModePositiveSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asDarkModePositiveSvg.tsx
new file mode 100644
index 0000000..b13291e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asDarkModePositiveSvg.tsx
@@ -0,0 +1,28 @@
+import * as React from "react";
+
+import { SvgConstantDarkModePositiveTheme } from "../SvgConstants";
+import { InjectedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asDarkModePositiveSvg<
+  C extends React.ComponentType<React.ComponentProps<C> & InjectedSvgProps>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsDarkModePositiveSvg extends React.PureComponent<
+    ResolvedProps & InjectedSvgProps
+  > {
+    static displayName = `asDarkModePositiveSvg(${getDisplayName(
+      WrappedComponent
+    )})`;
+
+    static defaultProps = {
+      fillColor: SvgConstantDarkModePositiveTheme.fill,
+      secondaryFillColor: SvgConstantDarkModePositiveTheme.secondaryFill,
+      className: "ddbc-svg--positive",
+    };
+
+    render() {
+      return <WrappedComponent {...(this.props as any)} />;
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asDarkSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asDarkSvg.tsx
new file mode 100644
index 0000000..d7106fe
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asDarkSvg.tsx
@@ -0,0 +1,26 @@
+import * as React from "react";
+
+import { SvgConstantDarkTheme } from "../SvgConstants";
+import { InjectedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asDarkSvg<
+  C extends React.ComponentType<React.ComponentProps<C> & InjectedSvgProps>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsDarkSvg extends React.PureComponent<
+    ResolvedProps & InjectedSvgProps
+  > {
+    static displayName = `asDarkSvg(${getDisplayName(WrappedComponent)})`;
+
+    static defaultProps = {
+      fillColor: SvgConstantDarkTheme.fill,
+      secondaryFillColor: SvgConstantDarkTheme.secondaryFill,
+      className: "ddbc-svg--dark",
+    };
+
+    render() {
+      return <WrappedComponent {...(this.props as any)} />;
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asDisabledSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asDisabledSvg.tsx
new file mode 100644
index 0000000..91d9c6c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asDisabledSvg.tsx
@@ -0,0 +1,26 @@
+import * as React from "react";
+
+import { SvgConstantDisabledTheme } from "../SvgConstants";
+import { InjectedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asDisabledSvg<
+  C extends React.ComponentType<React.ComponentProps<C> & InjectedSvgProps>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsDisabledSvg extends React.PureComponent<
+    ResolvedProps & InjectedSvgProps
+  > {
+    static displayName = `asDisabledSvg(${getDisplayName(WrappedComponent)})`;
+
+    static defaultProps = {
+      fillColor: SvgConstantDisabledTheme.fill,
+      secondaryFillColor: SvgConstantDisabledTheme.secondaryFill,
+      className: "ddbc-svg--disabled",
+    };
+
+    render() {
+      return <WrappedComponent {...(this.props as any)} />;
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asEmptySvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asEmptySvg.tsx
new file mode 100644
index 0000000..fd8cbb5
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asEmptySvg.tsx
@@ -0,0 +1,26 @@
+import * as React from "react";
+
+import { SvgConstantEmptyTheme } from "../SvgConstants";
+import { InjectedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asEmptySvg<
+  C extends React.ComponentType<React.ComponentProps<C> & InjectedSvgProps>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsEmptySvg extends React.PureComponent<
+    ResolvedProps & InjectedSvgProps
+  > {
+    static displayName = `asEmptySvg(${getDisplayName(WrappedComponent)})`;
+
+    static defaultProps = {
+      fillColor: SvgConstantEmptyTheme.fill,
+      secondaryFillColor: SvgConstantEmptyTheme.secondaryFill,
+      className: "ddbc-svg--empty",
+    };
+
+    render() {
+      return <WrappedComponent {...(this.props as any)} />;
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asGraySvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asGraySvg.tsx
new file mode 100644
index 0000000..58a7261
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asGraySvg.tsx
@@ -0,0 +1,26 @@
+import * as React from "react";
+
+import { SvgConstantGrayTheme } from "../SvgConstants";
+import { InjectedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asGraySvg<
+  C extends React.ComponentType<React.ComponentProps<C> & InjectedSvgProps>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsGraySvg extends React.PureComponent<
+    ResolvedProps & InjectedSvgProps
+  > {
+    static displayName = `asGraySvg(${getDisplayName(WrappedComponent)})`;
+
+    static defaultProps = {
+      fillColor: SvgConstantGrayTheme.fill,
+      secondaryFillColor: SvgConstantGrayTheme.secondaryFill,
+      className: "ddbc-svg--gray",
+    };
+
+    render() {
+      return <WrappedComponent {...(this.props as any)} />;
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asLightSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asLightSvg.tsx
new file mode 100644
index 0000000..fbe66cd
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asLightSvg.tsx
@@ -0,0 +1,26 @@
+import * as React from "react";
+
+import { SvgConstantLightTheme } from "../SvgConstants";
+import { InjectedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asLightSvg<
+  C extends React.ComponentType<React.ComponentProps<C> & InjectedSvgProps>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsLightSvg extends React.PureComponent<
+    ResolvedProps & InjectedSvgProps
+  > {
+    static displayName = `asLightSvg(${getDisplayName(WrappedComponent)})`;
+
+    static defaultProps = {
+      fillColor: SvgConstantLightTheme.fill,
+      secondaryFillColor: SvgConstantLightTheme.secondaryFill,
+      className: "ddbc-svg--light",
+    };
+
+    render() {
+      return <WrappedComponent {...(this.props as any)} />;
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asModifiedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asModifiedSvg.tsx
new file mode 100644
index 0000000..5f86fce
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asModifiedSvg.tsx
@@ -0,0 +1,26 @@
+import * as React from "react";
+
+import { SvgConstantModifiedTheme } from "../SvgConstants";
+import { InjectedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asModifiedSvg<
+  C extends React.ComponentType<React.ComponentProps<C> & InjectedSvgProps>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsModifiedSvg extends React.PureComponent<
+    ResolvedProps & InjectedSvgProps
+  > {
+    static displayName = `asModifiedSvg(${getDisplayName(WrappedComponent)})`;
+
+    static defaultProps = {
+      fillColor: SvgConstantModifiedTheme.fill,
+      secondaryFillColor: SvgConstantModifiedTheme.secondaryFill,
+      className: "ddbc-svg--modified",
+    };
+
+    render() {
+      return <WrappedComponent {...(this.props as any)} />;
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asNegativeSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asNegativeSvg.tsx
new file mode 100644
index 0000000..10c018b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asNegativeSvg.tsx
@@ -0,0 +1,26 @@
+import * as React from "react";
+
+import { SvgConstantNegativeTheme } from "../SvgConstants";
+import { InjectedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asNegativeSvg<
+  C extends React.ComponentType<React.ComponentProps<C> & InjectedSvgProps>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsNegativeSvg extends React.PureComponent<
+    ResolvedProps & InjectedSvgProps
+  > {
+    static displayName = `asNegativeSvg(${getDisplayName(WrappedComponent)})`;
+
+    static defaultProps = {
+      fillColor: SvgConstantNegativeTheme.fill,
+      secondaryFillColor: SvgConstantNegativeTheme.secondaryFill,
+      className: "ddbc-svg--negative",
+    };
+
+    render() {
+      return <WrappedComponent {...(this.props as any)} />;
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asPositiveSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asPositiveSvg.tsx
new file mode 100644
index 0000000..0edc8fd
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asPositiveSvg.tsx
@@ -0,0 +1,26 @@
+import * as React from "react";
+
+import { SvgConstantPositiveTheme } from "../SvgConstants";
+import { InjectedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asPositiveSvg<
+  C extends React.ComponentType<React.ComponentProps<C> & InjectedSvgProps>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsPositiveSvg extends React.PureComponent<
+    ResolvedProps & InjectedSvgProps
+  > {
+    static displayName = `asPositiveSvg(${getDisplayName(WrappedComponent)})`;
+
+    static defaultProps = {
+      fillColor: SvgConstantPositiveTheme.fill,
+      secondaryFillColor: SvgConstantPositiveTheme.secondaryFill,
+      className: "ddbc-svg--positive",
+    };
+
+    render() {
+      return <WrappedComponent {...(this.props as any)} />;
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asThemedSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asThemedSvg.tsx
new file mode 100644
index 0000000..b9ed525
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asThemedSvg.tsx
@@ -0,0 +1,27 @@
+import * as React from "react";
+
+import { ThemedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asThemedSvg<
+  C extends React.ComponentType<React.ComponentProps<C>>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsThemedSvg extends React.PureComponent<ThemedSvgProps> {
+    static displayName = `asThemedSvg(${getDisplayName(WrappedComponent)})`;
+
+    static defaultProps = {
+      className: "ddbc-svg--themed",
+    };
+
+    render() {
+      return (
+        <WrappedComponent
+          {...(this.props as any)}
+          fillColor={this.props.theme.themeColor}
+          backgroundColor={this.props.theme.backgroundColor}
+        />
+      );
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/asThemedWithOpacitySvg.tsx b/ddb_main/tools/js/smartComponents/Svg/hocs/asThemedWithOpacitySvg.tsx
new file mode 100644
index 0000000..11e73a7
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/asThemedWithOpacitySvg.tsx
@@ -0,0 +1,33 @@
+import Color from "color";
+import * as React from "react";
+
+import { ThemedSvgProps } from "./hocTypings";
+import { getDisplayName } from "./utils";
+
+export function asThemedWithOpacitySvg<
+  C extends React.ComponentType<React.ComponentProps<C>>,
+  ResolvedProps = JSX.LibraryManagedAttributes<C, React.ComponentProps<C>>
+>(WrappedComponent: C) {
+  return class AsThemedWithOpacitSvg extends React.PureComponent<ThemedSvgProps> {
+    static displayName = `asThemedWithOpacitySvg(${getDisplayName(
+      WrappedComponent
+    )})`;
+
+    static defaultProps = {
+      className: "ddbc-svg--themed",
+    };
+
+    render() {
+      return (
+        <WrappedComponent
+          {...(this.props as any)}
+          fillColor={Color(this.props.theme.themeColor)
+            .alpha(0.4)
+            .rgb()
+            .string()}
+          backgroundColor={this.props.theme.backgroundColor}
+        />
+      );
+    }
+  };
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/hocs/utils.ts b/ddb_main/tools/js/smartComponents/Svg/hocs/utils.ts
new file mode 100644
index 0000000..a0535b6
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/hocs/utils.ts
@@ -0,0 +1,7 @@
+import * as React from "react";
+
+export function getDisplayName(
+  WrappedComponent: React.ComponentType<React.ComponentProps<any>>
+) {
+  return WrappedComponent.displayName || WrappedComponent.name || "Component";
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/AdvantageDisadvantageSvg/AdvantageDisadvantageSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/AdvantageDisadvantageSvg/AdvantageDisadvantageSvg.tsx
new file mode 100644
index 0000000..b52e504
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/AdvantageDisadvantageSvg/AdvantageDisadvantageSvg.tsx
@@ -0,0 +1,34 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class AdvantageDisadvantageSvg extends React.PureComponent<InjectedSvgProps> {
+  static defaultProps = {
+    fillColor: "#3BAE1D",
+    secondaryFillColor: "#C53131",
+  };
+
+  render() {
+    const { fillColor, secondaryFillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-advantage-disadvantage-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 24 24">
+        <g id="svgPathAdvantage" fill={fillColor}>
+          <path d="M10.241 0.13251L14.5471 2.50087L11.6548 10.1452L9.69909 5H7.3009L3.5 15H5.89819L6.66742 12.8676H10.3326L10.4752 13.2629L6.90213 22.7064L5.91835 19.7551L0.25904 16.6425C0.0992659 16.5546 0 16.3867 0 16.2043V5.79562C0 5.61327 0.0992665 5.44539 0.259041 5.35751L9.75904 0.13251C9.90908 0.0499869 10.0909 0.0499871 10.241 0.13251Z" />
+          <path d="M9.63876 10.8529L8.50754 7.73529L7.37632 10.8529H9.63876Z" />
+        </g>
+        <g id="svgPathDisadvantage" fill={secondaryFillColor}>
+          <path d="M13.7592 23.8675L9.45312 21.4991L12.5002 13.4457V18H15.8054C19.0058 18 21.0002 15.9265 21.0002 13C21.0002 10.0735 19.0058 8 15.8054 8H14.5606L17.0981 1.29358L18.0818 4.24492L23.7411 7.35754C23.9009 7.44542 24.0002 7.61331 24.0002 7.79565V18.2044C24.0002 18.3867 23.9009 18.5546 23.7411 18.6425L14.2411 23.8675C14.0911 23.95 13.9093 23.95 13.7592 23.8675Z" />
+          <path d="M18.7275 13C18.7275 11.3088 17.6916 10.0147 15.7899 10.0147H14.6956V15.9853H15.7899C17.6916 15.9853 18.7275 14.7059 18.7275 13Z" />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/AdvantageSvg/AdvantageSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/AdvantageSvg/AdvantageSvg.tsx
new file mode 100644
index 0000000..5c5bfb5
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/AdvantageSvg/AdvantageSvg.tsx
@@ -0,0 +1,33 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class AdvantageSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, secondaryFillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-advantage-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 24 24">
+        <g>
+          <path
+            d="M13.3665 12.5235L12.009 8.78235L10.6516 12.5235H13.3665Z"
+            fill={fillColor}
+          />
+          <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M12.241 1.13253C12.0909 1.05 11.9091 1.05 11.759 1.13252L2.25904 6.35753C2.09927 6.4454 2 6.61329 2 6.79563V17.2044C2 17.3867 2.09927 17.5546 2.25904 17.6425L11.759 22.8675C11.9091 22.95 12.0909 22.95 12.241 22.8675L21.741 17.6425C21.9007 17.5546 22 17.3867 22 17.2044V6.79563C22 6.61329 21.9007 6.4454 21.741 6.35753L12.241 1.13253ZM18 17.5H15.1222L14.1991 14.9412H9.80091L8.87783 17.5H6L10.5611 5.5H13.4389L18 17.5Z"
+            fill={fillColor}
+          />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/AdvantageSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/AdvantageSvg/index.ts
new file mode 100644
index 0000000..584a6e8
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/AdvantageSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkModePositiveSvg, asPositiveSvg } from "../../hocs";
+import AdvantageSvg from "./AdvantageSvg";
+
+const PositiveAdvantageSvg = asPositiveSvg(AdvantageSvg);
+const DarkModePositiveAdvantageSvg = asDarkModePositiveSvg(AdvantageSvg);
+
+export default AdvantageSvg;
+export { AdvantageSvg, PositiveAdvantageSvg, DarkModePositiveAdvantageSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/AnimatedLoadingRingSvg/AnimatedLoadingRingSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/AnimatedLoadingRingSvg/AnimatedLoadingRingSvg.tsx
new file mode 100644
index 0000000..11358f8
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/AnimatedLoadingRingSvg/AnimatedLoadingRingSvg.tsx
@@ -0,0 +1,41 @@
+import React from "react";
+
+import { BaseSvgProps } from "../../BaseSvg";
+
+export default class AnimatedLoadingRingSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    fillColor: "#EC2127",
+    secondaryFillColor: "#131315",
+    className: "",
+  };
+
+  render() {
+    const { fillColor, secondaryFillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-animated-loading-ring-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    const htmlContent: string = `<html><head><style>* {margin:0}</style></head><body style="background-color: transparent;">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="uil-ring-alt">
+                        <rect x="0" y="0" width="100" height="100" fill="none" class="bk"/>
+                        <circle cx="50" cy="50" r="40" stroke="${secondaryFillColor}" fill="none" stroke-width="10" stroke-linecap="round"/>
+                        <circle cx="50" cy="50" r="40" stroke="${fillColor}" fill="none" stroke-width="6" stroke-linecap="round">
+                            <animate attributeName="stroke-dashoffset" dur="2s" repeatCount="indefinite" from="0" to="502"/>
+                            <animate attributeName="stroke-dasharray" dur="2s" repeatCount="indefinite" values="150.6 100.4;1 250;150.6 100.4"/>
+                        </circle>
+                    </svg></body></html>`;
+
+    return (
+      <iframe
+        className={classNames.join(" ")}
+        frameBorder="0"
+        title="loading"
+        style={{ backgroundColor: "transparent" }}
+        src={`data:text/html;base64,${btoa(htmlContent)}`}
+      ></iframe>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/AttunementSvg/AttunementSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/AttunementSvg/AttunementSvg.tsx
new file mode 100644
index 0000000..eb2d1cc
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/AttunementSvg/AttunementSvg.tsx
@@ -0,0 +1,29 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class AttunementSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-attunement-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 18.54 16.05">
+        <path
+          fill={fillColor}
+          d="M9.27,0,0,16.05H18.54Zm1.25,11.53H8l-.49,1.54H6.08L8.54,5.93H10l2.45,7.14H11Z"
+        />
+        <polygon
+          fill={fillColor}
+          points="9.26 7.6 8.37 10.41 10.17 10.41 9.29 7.6 9.26 7.6"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/AttunementSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/AttunementSvg/index.ts
new file mode 100644
index 0000000..b8d9ffe
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/AttunementSvg/index.ts
@@ -0,0 +1,15 @@
+import { asLightSvg, asDarkSvg } from "../../hocs";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import AttunementSvg from "./AttunementSvg";
+
+const LightAttunementSvg = asLightSvg(AttunementSvg);
+const DarkAttunementSvg = asDarkSvg(AttunementSvg);
+const GrayAttunementSvg = asGraySvg(AttunementSvg);
+
+export default AttunementSvg;
+export {
+  AttunementSvg,
+  LightAttunementSvg,
+  DarkAttunementSvg,
+  GrayAttunementSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/BackdropSvg/BackdropSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/BackdropSvg/BackdropSvg.tsx
new file mode 100644
index 0000000..f70bc40
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/BackdropSvg/BackdropSvg.tsx
@@ -0,0 +1,46 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class BackdropSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-backdrop-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 32 30.43">
+        <path
+          fill="none"
+          d="M15.53,19.47l2.58-2.13-2.61-3.48-4.45,4.05C12.9,18.11,14.69,17.56,15.53,19.47Z"
+          transform="translate(0 -0.78)"
+        />
+        <path
+          fill="none"
+          d="M3,21.76c.51.47,1,1,1.64,1.49a1.15,1.15,0,0,0,1.63-.08c.45-.35,1.25-.24,2.11-.36L5.5,19.19Z"
+          transform="translate(0 -0.78)"
+        />
+        <path
+          fill="none"
+          d="M25.36,21.41a7.21,7.21,0,0,0,1.51.77l.29-.44-3.87-4.46-2.66,2c.44.24.74.55,1,.52C23.22,19.59,24.27,20.49,25.36,21.41Z"
+          transform="translate(0 -0.78)"
+        />
+        <path
+          fill={fillColor}
+          d="M23.68,28.81c-1.45-.23-2.9.54-4.41-.6S16.88,26.86,16.54,27s-1.65-.87-1.82-1l-3.84-4,.88-.44s2.42,1.14,2.53.77.17-1.61.34-1.61.81.33,1.18.17,1.62.37,1.62.37l1-.4.44-.13.34.3.81,0S23,22.88,23.18,23s3.27,2.78,3.47,2.91a8.16,8.16,0,0,0,1.11.67c.17,0,.64.5.77.33s.67-1.24.67-1.24L32,27.8V25c-2.51-2.87-5.06-5.72-7.52-8.63-.79-.93-1.4-1-2.25-.18-.57.53-1.25.94-2,1.49-1.32-1.74-2.58-3.42-3.86-5.09-.81-1.06-1.12-1.08-2-.14l-6.7,6.94c-.28-.3-.52-.53-.72-.78C5.53,17,5.54,17,4,18.52c-1.3,1.27-2.63,2.5-4,3.75v8.95H13.75c-.86-1.13-1.86-2.06-3.42-2a2.66,2.66,0,0,1-2.47-.8c-.81-1-1.74-1.7-3.18-.6L3.8,25.19c2,.46,2,.46,3.19-.84l2.35-.42c1.19,1.47,2.47,3,3.72,4.63.68.86,1.29,1.77,1.94,2.66H26.84C26.22,30.51,24.79,29,23.68,28.81Zm-.4-11.53,3.87,4.46-.29.44a7.21,7.21,0,0,1-1.51-.77c-1.09-.92-2.14-1.82-3.72-1.64-.27,0-.57-.28-1-.52Zm-7.78-3.41c.79,1.06,2,1.84,2.87,3.07L15.8,19.06c-.84-1.92-2.9-1-4.74-1.15ZM6.31,23.18a1.15,1.15,0,0,1-1.63.08c-.6-.47-1.13-1-1.64-1.49L5.5,19.19l2.92,3.62C7.56,22.94,6.76,22.83,6.31,23.18Z"
+          transform="translate(0 -0.78)"
+        />
+        <path
+          fill={fillColor}
+          d="M29,8.24l2.82-2.1-3.53-.45,1-3.3L26.16,4,25,.78l-1.53,3.1L20.5,1.94l.64,3.38-3.55.1,2.57,2.37-2.82,2.1,3.53.45-1,3.3L23,12l1.19,3.24,1.53-3.1,2.93,1.94L28,10.71l3.56-.1Zm-4.41,3.3A4,4,0,0,1,21.06,8a4,4,0,0,1,3.53-3.53A4,4,0,0,1,28.1,8,4,4,0,0,1,24.58,11.54Z"
+          transform="translate(0 -0.78)"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/BackdropSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/BackdropSvg/index.ts
new file mode 100644
index 0000000..33f9b38
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/BackdropSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import BackdropSvg from "./BackdropSvg";
+
+const LightBackdropSvg = asLightSvg(BackdropSvg);
+const ThemedBackdropSvg = asThemedSvg(BackdropSvg);
+
+export default BackdropSvg;
+export { BackdropSvg, LightBackdropSvg, ThemedBackdropSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/BonusNegativeSvg/BonusNegativeSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/BonusNegativeSvg/BonusNegativeSvg.tsx
new file mode 100644
index 0000000..2445913
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/BonusNegativeSvg/BonusNegativeSvg.tsx
@@ -0,0 +1,27 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class BonusNegativeSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-bonus-negative-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 24 24">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M12.241 1.13253C12.0909 1.05 11.9091 1.05 11.759 1.13252L2.25904 6.35753C2.09927 6.4454 2 6.61329 2 6.79563V17.2044C2 17.3867 2.09927 17.5546 2.25904 17.6425L11.759 22.8675C11.9091 22.95 12.0909 22.95 12.241 22.8675L21.741 17.6425C21.9007 17.5546 22 17.3867 22 17.2044V6.79563C22 6.61329 21.9007 6.4454 21.741 6.35753L12.241 1.13253ZM18 10.5H6V13.5H18V10.5Z"
+          fill={fillColor}
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/BonusNegativeSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/BonusNegativeSvg/index.ts
new file mode 100644
index 0000000..c7711bb
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/BonusNegativeSvg/index.ts
@@ -0,0 +1,13 @@
+import { asDarkModeNegativeSvg, asNegativeSvg } from "../../hocs";
+import BonusNegativeSvg from "./BonusNegativeSvg";
+
+const NegativeBonusNegativeSvg = asNegativeSvg(BonusNegativeSvg);
+const DarkModeNegativeBonusNegativeSvg =
+  asDarkModeNegativeSvg(BonusNegativeSvg);
+
+export default BonusNegativeSvg;
+export {
+  BonusNegativeSvg,
+  NegativeBonusNegativeSvg,
+  DarkModeNegativeBonusNegativeSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/BonusPositiveSvg/BonusPositiveSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/BonusPositiveSvg/BonusPositiveSvg.tsx
new file mode 100644
index 0000000..8f8bc2f
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/BonusPositiveSvg/BonusPositiveSvg.tsx
@@ -0,0 +1,27 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class BonusPositiveSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-bonus-positive-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 24 24">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M12.241 1.13253C12.0909 1.05 11.9091 1.05 11.759 1.13252L2.25904 6.35753C2.09927 6.4454 2 6.61329 2 6.79563V17.2044C2 17.3867 2.09927 17.5546 2.25904 17.6425L11.759 22.8675C11.9091 22.95 12.0909 22.95 12.241 22.8675L21.741 17.6425C21.9007 17.5546 22 17.3867 22 17.2044V6.79563C22 6.61329 21.9007 6.4454 21.741 6.35753L12.241 1.13253ZM10.5 6H13.5V10.5H18V13.5H13.5V18H10.5V13.5H6V10.5H10.5V6Z"
+          fill={fillColor}
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/BonusPositiveSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/BonusPositiveSvg/index.ts
new file mode 100644
index 0000000..d692a44
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/BonusPositiveSvg/index.ts
@@ -0,0 +1,13 @@
+import { asDarkModePositiveSvg, asPositiveSvg } from "../../hocs";
+import BonusPositiveSvg from "./BonusPositiveSvg";
+
+const PositiveBonusPositiveSvg = asPositiveSvg(BonusPositiveSvg);
+const DarkModePositiveBonusPositiveSvg =
+  asDarkModePositiveSvg(BonusPositiveSvg);
+
+export default BonusPositiveSvg;
+export {
+  BonusPositiveSvg,
+  PositiveBonusPositiveSvg,
+  DarkModePositiveBonusPositiveSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/BuilderSvg/BuilderSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/BuilderSvg/BuilderSvg.tsx
new file mode 100644
index 0000000..2b682a0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/BuilderSvg/BuilderSvg.tsx
@@ -0,0 +1,41 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class BuilderSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-builder-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 46.82 38.62">
+        <path
+          fill={fillColor}
+          d="M46.17,16.56v4.51s-8.16-.94-12,2.56-3.32,6.47-2.11,7.43,4.17,1.27,4.17,1.27l2.48,3.2v3.08H32.81S31,36.08,26.35,36.08s-6.89,2.48-6.89,2.48H14V35.41l2.36-2.9s2.54.12,3.87-1.27.54-5.32-1.45-5.32H15.35v-.66S5.74,25.44,0,18.31H18V16.56Z"
+        />
+        <path
+          fill={fillColor}
+          d="M27.49,0a52.76,52.76,0,0,0-4.33,11.7,13,13,0,0,0,5.25,2.07,41.51,41.51,0,0,0,4.4-11.55A12.5,12.5,0,0,0,27.49,0Z"
+        />
+        <path
+          fill={fillColor}
+          d="M32.74,6.78a8.53,8.53,0,0,1-1.14,3l13.52,4.79c.57.2,1.32-.69,1.45-1s.62-1.62-.27-1.93Z"
+        />
+        <path
+          fill={fillColor}
+          d="M24.63,3.51A28.29,28.29,0,0,0,23.36,6.7a1.64,1.64,0,0,1-.42-2.14A1.63,1.63,0,0,1,24.63,3.51Z"
+        />
+        <path
+          fill={fillColor}
+          d="M21.76,12,18.94,2.57l-.22,8.23-3.42-4,1.93,5.69L11.15,9.86l7.07,5.36h9.63l-1.73-.44a11.47,11.47,0,0,1-3.83-1.85Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/BuilderSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/BuilderSvg/index.ts
new file mode 100644
index 0000000..523c931
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/BuilderSvg/index.ts
@@ -0,0 +1,9 @@
+import { asDarkSvg, asLightSvg, asThemedSvg } from "../../hocs";
+import BuilderSvg from "./BuilderSvg";
+
+const LightBuilderSvg = asLightSvg(BuilderSvg);
+const DarkBuilderSvg = asDarkSvg(BuilderSvg);
+const ThemedBuilderSvg = asThemedSvg(BuilderSvg);
+
+export default BuilderSvg;
+export { BuilderSvg, DarkBuilderSvg, LightBuilderSvg, ThemedBuilderSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ChatBubbleSvg/ChatBubbleSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/ChatBubbleSvg/ChatBubbleSvg.tsx
new file mode 100644
index 0000000..a202874
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ChatBubbleSvg/ChatBubbleSvg.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class ChatBubbleSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-chat-bubble-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 21 21">
+        <path
+          fill={fillColor}
+          d="M17.5 11.6666C17.5 12.3095 16.9761 12.8333 16.3333 12.8333H10.5C10.1908 12.8333 9.89329 12.9558 9.67513 13.1751L6.99996 15.8503V14C6.99996 13.3548 6.47729 12.8333 5.83329 12.8333H4.66663C4.02379 12.8333 3.49996 12.3095 3.49996 11.6666V4.66663C3.49996 4.02379 4.02379 3.49996 4.66663 3.49996H16.3333C16.9761 3.49996 17.5 4.02379 17.5 4.66663V11.6666ZM16.3333 1.16663H4.66663C2.73696 1.16663 1.16663 2.73696 1.16663 4.66663V11.6666C1.16663 13.5963 2.73696 15.1666 4.66663 15.1666V18.6666C4.66663 19.138 4.95129 19.565 5.38646 19.7446C5.53113 19.8041 5.68279 19.8333 5.83329 19.8333C6.13663 19.8333 6.43529 19.7143 6.65813 19.4915L10.983 15.1666H16.3333C18.263 15.1666 19.8333 13.5963 19.8333 11.6666V4.66663C19.8333 2.73696 18.263 1.16663 16.3333 1.16663ZM14 6.99996H6.99996C6.35596 6.99996 5.83329 7.52146 5.83329 8.16663C5.83329 8.81179 6.35596 9.33329 6.99996 9.33329H14C14.644 9.33329 15.1666 8.81179 15.1666 8.16663C15.1666 7.52146 14.644 6.99996 14 6.99996Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ChatBubbleSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/ChatBubbleSvg/index.ts
new file mode 100644
index 0000000..b0cb1b1
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ChatBubbleSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg, asLightSvg, asPositiveSvg, asThemedSvg } from "../../hocs";
+import ChatBubbleSvg from "./ChatBubbleSvg";
+
+const LightChatBubbleSvg = asLightSvg(ChatBubbleSvg);
+const DarkChatBubbleSvg = asDarkSvg(ChatBubbleSvg);
+const ThemedChatBubbleSvg = asThemedSvg(ChatBubbleSvg);
+const PositiveChatBubbleSvg = asPositiveSvg(ChatBubbleSvg);
+
+export default ChatBubbleSvg;
+export {
+  ChatBubbleSvg,
+  LightChatBubbleSvg,
+  ThemedChatBubbleSvg,
+  DarkChatBubbleSvg,
+  PositiveChatBubbleSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/CheckSvg/CheckSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/CheckSvg/CheckSvg.tsx
new file mode 100644
index 0000000..1c7869a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/CheckSvg/CheckSvg.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class CheckSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-check-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 1792 1792">
+        <path
+          fill={fillColor}
+          d="M1671 566q0 40-28 68l-724 724-136 136q-28 28-68 28t-68-28l-136-136-362-362q-28-28-28-68t28-68l136-136q28-28 68-28t68 28l294 295 656-657q28-28 68-28t68 28l136 136q28 28 28 68z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/CheckSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/CheckSvg/index.ts
new file mode 100644
index 0000000..20e3751
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/CheckSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg, asLightSvg, asPositiveSvg, asThemedSvg } from "../../hocs";
+import CheckSvg from "./CheckSvg";
+
+const LightCheckSvg = asLightSvg(CheckSvg);
+const DarkCheckSvg = asDarkSvg(CheckSvg);
+const ThemedCheckSvg = asThemedSvg(CheckSvg);
+const PositiveCheckSvg = asPositiveSvg(CheckSvg);
+
+export default CheckSvg;
+export {
+  CheckSvg,
+  LightCheckSvg,
+  ThemedCheckSvg,
+  DarkCheckSvg,
+  PositiveCheckSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/CloseSvg/CloseSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/CloseSvg/CloseSvg.tsx
new file mode 100644
index 0000000..899a508
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/CloseSvg/CloseSvg.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class CloseSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-close-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 1092 1092">
+        <path
+          fill={fillColor}
+          d="M849.9,990L990,849.9L639.9,499.9L990,150L849.9,10L499.9,359.9L150,10L10,150l349.9,349.9L10,849.9L150,990l349.9-350.1L849.9,990z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/CloseSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/CloseSvg/index.ts
new file mode 100644
index 0000000..e214b69
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/CloseSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg, asLightSvg, asPositiveSvg, asThemedSvg } from "../../hocs";
+import CloseSvg from "./CloseSvg";
+
+const LightCloseSvg = asLightSvg(CloseSvg);
+const DarkCloseSvg = asDarkSvg(CloseSvg);
+const ThemedCloseSvg = asThemedSvg(CloseSvg);
+const PositiveCloseSvg = asPositiveSvg(CloseSvg);
+
+export default CloseSvg;
+export {
+  CloseSvg,
+  LightCloseSvg,
+  ThemedCloseSvg,
+  DarkCloseSvg,
+  PositiveCloseSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ConcentrationSvg/ConcentrationSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/ConcentrationSvg/ConcentrationSvg.tsx
new file mode 100644
index 0000000..8e7dfd9
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ConcentrationSvg/ConcentrationSvg.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ConcentrationSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 19.73 21.49">
+      <rect
+        fill={fillColor}
+        x="2.95"
+        y="2.95"
+        width="15"
+        height="15"
+        transform="translate(-4.18 10.09) rotate(-45)"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M12.53,10.92v0A2.44,2.44,0,0,1,12,12.71a2.19,2.19,0,0,1-1.67.6,2.35,2.35,0,0,1-1.76-.68,2.63,2.63,0,0,1-.66-1.92V8.59a2.7,2.7,0,0,1,.64-1.92A2.23,2.23,0,0,1,10.24,6,2.26,2.26,0,0,1,12,6.6a2.56,2.56,0,0,1,.6,1.79v0H11.2a1.66,1.66,0,0,0-.19-1,.88.88,0,0,0-.77-.31.82.82,0,0,0-.72.37,2,2,0,0,0-.25,1.11v2.14a1.91,1.91,0,0,0,.27,1.12.9.9,0,0,0,.78.37.79.79,0,0,0,.7-.29,1.73,1.73,0,0,0,.17-1Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default ConcentrationSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ConcentrationSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/ConcentrationSvg/index.ts
new file mode 100644
index 0000000..ab0c721
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ConcentrationSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import ConcentrationSvg from "./ConcentrationSvg";
+
+const LightConcentrationSvg = asLightSvg(ConcentrationSvg);
+const DarkConcentrationSvg = asDarkSvg(ConcentrationSvg);
+const GrayConcentrationSvg = asGraySvg(ConcentrationSvg);
+
+export default ConcentrationSvg;
+export {
+  ConcentrationSvg,
+  LightConcentrationSvg,
+  DarkConcentrationSvg,
+  GrayConcentrationSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/DdbBadgeSvg/DdbBadgeSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/DdbBadgeSvg/DdbBadgeSvg.tsx
new file mode 100644
index 0000000..086ebab
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/DdbBadgeSvg/DdbBadgeSvg.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+
+interface Props {
+  className?: string;
+}
+
+const DdbBadgeSvg: React.FunctionComponent<Props> = ({ className = "" }) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 24 25">
+      <path
+        d="M1 0.832519C1 0.556377 1.22386 0.33252 1.5 0.33252H22.5C22.7761 0.33252 23 0.556377 23 0.83252V23.7334C23 24.0454 22.7175 24.2812 22.4106 24.2253L12.0894 22.3488C12.0303 22.338 11.9697 22.338 11.9106 22.3488L1.58944 24.2253C1.28252 24.2812 1 24.0454 1 23.7334V0.832519Z"
+        fill="#E40712"
+      />
+      <path
+        d="M17.2309 12.4843C16.8013 12.0744 16.2351 11.7622 15.4931 11.5475C15.786 11.4694 16.0593 11.3523 16.3132 11.1961C16.567 11.04 16.7622 10.8839 16.938 10.6887C17.1137 10.4935 17.2504 10.2983 17.3285 10.0836C17.4261 9.88846 17.4652 9.69329 17.4652 9.49811V9.12727C17.4652 8.67837 17.3675 8.24898 17.1527 7.87814C16.938 7.50731 16.6451 7.17551 16.2546 6.92178C15.8641 6.64853 15.3174 6.45335 14.7707 6.29721C14.224 6.16059 13.6187 6.08252 12.9548 6.08252H7.683H7.13629H6.12098L7.13629 7.13647V10.7277H5.75L7.13629 12.5038V16.4269L6.12098 17.4808H7.13629H7.683H13.3063C14.6535 17.4808 15.825 17.2466 16.6451 16.7587C17.4652 16.2707 17.8557 15.5681 17.8557 14.6117V13.9677C17.8557 13.3821 17.6409 12.8942 17.2309 12.4843ZM10.4556 8.19043H12.291C12.8181 8.19043 13.2477 8.2685 13.5796 8.42464C13.9116 8.58078 14.0678 8.87355 14.0678 9.30293V9.67377C14.0678 10.0056 13.9506 10.2593 13.6968 10.4545C13.443 10.6497 13.111 10.7472 12.6815 10.7472H10.4556V8.19043ZM14.4583 14.2799C14.4583 14.5141 14.4192 14.7093 14.3216 14.846C14.224 14.9826 14.1068 15.0997 13.9506 15.1973C13.7944 15.2753 13.6187 15.3339 13.4039 15.3729C13.1891 15.3924 12.9743 15.412 12.7596 15.412H10.4556V12.66H12.7791C13.2086 12.66 13.5796 12.7576 13.9311 12.9527C14.263 13.1479 14.4387 13.4016 14.4387 13.7334V14.2799H14.4583Z"
+        fill="white"
+      />
+    </BaseSvg>
+  );
+};
+
+export default DdbBadgeSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/DiceSvg/DiceSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/DiceSvg/DiceSvg.tsx
new file mode 100644
index 0000000..edcffd6
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/DiceSvg/DiceSvg.tsx
@@ -0,0 +1,29 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class DiceSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-dice-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 16 18">
+        <path
+          d="M8 0L0 4.4702V13.5298L8 18L15.4286 13.8278L16 13.4702V4.4702L8 0ZM6.85714 4.94702L3.48571 10.1921L1.37143 5.42384L6.85714 4.94702ZM4.57143
+                    10.7285L8 5.30464L11.4286 10.7285H4.57143ZM12.4571 10.1921L9.14286 4.94702L14.5714 5.36424L12.4571 10.1921ZM8.57143 1.66887L12.8 4.05298L8.57143
+                    3.69536V1.66887ZM7.42857 1.66887V3.69536L3.2 4.05298L7.42857 1.66887ZM1.14286 7.62914L2.68571 11.2053L1.14286 12.1589V7.62914ZM1.71429 13.1722L3.25714
+                    12.2185L5.77143 15.4967L1.71429 13.1722ZM4.57143 11.9205H10.8571L8 16.3907L4.57143 11.9205ZM10.2286 15.4371L12.7429 12.1589L14.2857 13.1126L10.2286
+                    15.4371ZM13.4286 11.2649L13.3143 11.2053L14.8571 7.62914V12.1589L13.4286 11.2649Z"
+          fill={fillColor}
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/DiceSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/DiceSvg/index.ts
new file mode 100644
index 0000000..8820bcb
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/DiceSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import DiceSvg from "./DiceSvg";
+
+const LightDiceSvg = asLightSvg(DiceSvg);
+const ThemedDiceSvg = asThemedSvg(DiceSvg);
+
+export default DiceSvg;
+export { DiceSvg, LightDiceSvg, ThemedDiceSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/DisadvantageSvg/DisadvantageSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/DisadvantageSvg/DisadvantageSvg.tsx
new file mode 100644
index 0000000..b7e607e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/DisadvantageSvg/DisadvantageSvg.tsx
@@ -0,0 +1,31 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class DisadvantageSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, secondaryFillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-disadvantage-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 24 24">
+        <path
+          d="M15.1364 12C15.1364 9.97059 13.8933 8.41764 11.6113 8.41764H10.1345V15.5823H11.6113C13.8933 15.5823 15.1364 14.0471 15.1364 12Z"
+          fill={fillColor}
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M12.241 1.13253C12.0909 1.05 11.9091 1.05 11.759 1.13252L2.25904 6.35753C2.09927 6.4454 2 6.61329 2 6.79563V17.2044C2 17.3867 2.09927 17.5546 2.25904 17.6425L11.759 22.8675C11.9091 22.95 12.0909 22.95 12.241 22.8675L21.741 17.6425C21.9007 17.5546 22 17.3867 22 17.2044V6.79563C22 6.61329 21.9007 6.4454 21.741 6.35753L12.241 1.13253ZM11.6299 18H7.5V6H11.6299C15.4703 6 17.8636 8.48823 17.8636 12C17.8636 15.5118 15.4703 18 11.6299 18Z"
+          fill={fillColor}
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/DisadvantageSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/DisadvantageSvg/index.ts
new file mode 100644
index 0000000..4a65fec
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/DisadvantageSvg/index.ts
@@ -0,0 +1,12 @@
+import { asDarkModeNegativeSvg, asNegativeSvg } from "../../hocs";
+import DisadvantageSvg from "./DisadvantageSvg";
+
+const NegativeDisadvantageSvg = asNegativeSvg(DisadvantageSvg);
+const DarkModeNegativeDisadvantageSvg = asDarkModeNegativeSvg(DisadvantageSvg);
+
+export default DisadvantageSvg;
+export {
+  DisadvantageSvg,
+  NegativeDisadvantageSvg,
+  DarkModeNegativeDisadvantageSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/DoubleArrowLeftSvg/DoubleArrowLeftSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/DoubleArrowLeftSvg/DoubleArrowLeftSvg.tsx
new file mode 100644
index 0000000..5de7520
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/DoubleArrowLeftSvg/DoubleArrowLeftSvg.tsx
@@ -0,0 +1,23 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+export default class DoubleArrowLeftSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 16 16" className={className}>
+        <path
+          fill={fillColor}
+          d="M11,2.48,5,8l6,5.52a1.3,1.3,0,0,1-.21,2.12h0a2.25,2.25,0,0,1-2.68-.17L0,8,8.11.53A2.25,2.25,0,0,1,10.79.36h0A1.3,1.3,0,0,1,11,2.48Z"
+        />
+        <polygon fill={fillColor} points="6.92 8 16 0 16 16 6.92 8" />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/DoubleArrowLeftSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/DoubleArrowLeftSvg/index.ts
new file mode 100644
index 0000000..ea8170a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/DoubleArrowLeftSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../hocs";
+import DoubleArrowLeftSvg from "./DoubleArrowLeftSvg";
+
+const LightDoubleArrowLeftSvg = asLightSvg(DoubleArrowLeftSvg);
+const DarkDoubleArrowLeftSvg = asDarkSvg(DoubleArrowLeftSvg);
+
+export default DoubleArrowLeftSvg;
+export { DoubleArrowLeftSvg, LightDoubleArrowLeftSvg, DarkDoubleArrowLeftSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ExportSvg/ExportSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/ExportSvg/ExportSvg.tsx
new file mode 100644
index 0000000..0790eae
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ExportSvg/ExportSvg.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class ExportSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-export-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 13 16">
+        <path
+          d="M9 0H0V16H13V4L9 0ZM8.7 1.8L10.7 3.8H8.7V1.8ZM1.5 14.5V12.4H9.1V10.9H1.5V8.7H9.1V7.2H1.5V5H4.3V3.5H1.5V1.5H7.2V5.3H11.5V14.5H1.5Z"
+          fill={fillColor}
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ExportSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/ExportSvg/index.ts
new file mode 100644
index 0000000..f4b89b2
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ExportSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg, asLightSvg, asThemedSvg, asDisabledSvg } from "../../hocs";
+import ExportSvg from "./ExportSvg";
+
+const LightExportSvg = asLightSvg(ExportSvg);
+const DarkExportSvg = asDarkSvg(ExportSvg);
+const ThemedExportSvg = asThemedSvg(ExportSvg);
+const DisabledExportSvg = asDisabledSvg(ExportSvg);
+
+export default ExportSvg;
+export {
+  ExportSvg,
+  DarkExportSvg,
+  LightExportSvg,
+  ThemedExportSvg,
+  DisabledExportSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/FilterSvg/FilterSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/FilterSvg/FilterSvg.tsx
new file mode 100644
index 0000000..9262ce7
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/FilterSvg/FilterSvg.tsx
@@ -0,0 +1,29 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class FilterSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-filter-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 29 31.43435">
+        <g id="5980cc6f-d687-4543-b0ac-5355a2132dc6" data-name="Layer 2">
+          <g id="567f4281-9d41-458b-8080-e577c6ec19c5" data-name="Layer 2">
+            <path
+              fill={fillColor}
+              d="M10,18,.38675,3.58013A2.30282,2.30282,0,0,1,0,2.30278H0A2.30278,2.30278,0,0,1,2.30277,0H26.69723A2.30278,2.30278,0,0,1,29,2.30277h0a2.30282,2.30282,0,0,1-.38675,1.27735L19,18V30.78071a.65255.65255,0,0,1-1.01451.543L10.44556,26.297A1.00058,1.00058,0,0,1,10,25.46451Z"
+            />
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/FilterSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/FilterSvg/index.ts
new file mode 100644
index 0000000..850c4d0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/FilterSvg/index.ts
@@ -0,0 +1,9 @@
+import { asDarkSvg, asThemedSvg, asLightSvg } from "../../hocs";
+import FilterSvg from "./FilterSvg";
+
+const ThemedFilterSvg = asThemedSvg(FilterSvg);
+const DarkFilterSvg = asDarkSvg(FilterSvg);
+const LightFilterSvg = asLightSvg(FilterSvg);
+
+export default FilterSvg;
+export { FilterSvg, ThemedFilterSvg, DarkFilterSvg, LightFilterSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/FrameSvg/FrameSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/FrameSvg/FrameSvg.tsx
new file mode 100644
index 0000000..4b120e2
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/FrameSvg/FrameSvg.tsx
@@ -0,0 +1,33 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class FrameSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-frame-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 26 26">
+        <rect
+          fill="none"
+          stroke={fillColor}
+          strokeMiterlimit={10}
+          strokeWidth="3px"
+          x="1.5"
+          y="1.5"
+          width="23"
+          height="23"
+          rx="3"
+          ry="3"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/FrameSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/FrameSvg/index.ts
new file mode 100644
index 0000000..ca047b8
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/FrameSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import FrameSvg from "./FrameSvg";
+
+const LightFrameSvg = asLightSvg(FrameSvg);
+const ThemedFrameSvg = asThemedSvg(FrameSvg);
+
+export default FrameSvg;
+export { FrameSvg, LightFrameSvg, ThemedFrameSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/HealingSvg/HealingSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/HealingSvg/HealingSvg.tsx
new file mode 100644
index 0000000..93d97fd
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/HealingSvg/HealingSvg.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+const HealingSvg: React.FunctionComponent<InjectedSvgProps> = ({
+  className = "",
+  fillColor,
+}) => {
+  let classNames: Array<string> = ["ddbc-attunement-svg"];
+
+  if (className) {
+    classNames.push(className);
+  }
+
+  return (
+    <BaseSvg className={classNames.join(" ")} viewBox="0 0 18.4 20.1">
+      <path
+        fill={fillColor}
+        d="M9.2,2.9c3.4-6.9,13.8,0,6.9,6.9c-6.9,6.9-6.9,10.4-6.9,10.4s0-3.5-6.9-10.4C-4.6,2.9,5.8-4,9.2,2.9"
+      />
+    </BaseSvg>
+  );
+};
+export default HealingSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/HealingSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/HealingSvg/index.ts
new file mode 100644
index 0000000..ed26da8
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/HealingSvg/index.ts
@@ -0,0 +1,10 @@
+import { asLightSvg, asDarkSvg } from "../../hocs";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import HealingSvg from "./HealingSvg";
+
+const LightHealingSvg = asLightSvg(HealingSvg);
+const DarkHealingSvg = asDarkSvg(HealingSvg);
+const GrayHealingSvg = asGraySvg(HealingSvg);
+
+export default HealingSvg;
+export { HealingSvg, LightHealingSvg, DarkHealingSvg, GrayHealingSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ImmunitySvg/ImmunitySvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/ImmunitySvg/ImmunitySvg.tsx
new file mode 100644
index 0000000..3359079
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ImmunitySvg/ImmunitySvg.tsx
@@ -0,0 +1,19 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ImmunitySvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 40.89941 48">
+      <path
+        fill={fillColor}
+        d="M40.4497,8c-11,0-20-6-20-8,0,2-9,8-20,8-4,35,20,40,20,40S44.4497,43,40.4497,8Zm-16.75,29.42h-6.5V10.4h6.5Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default ImmunitySvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ImmunitySvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/ImmunitySvg/index.ts
new file mode 100644
index 0000000..a44efb1
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ImmunitySvg/index.ts
@@ -0,0 +1,8 @@
+import { asPositiveSvg, asDarkModePositiveSvg } from "../../hocs";
+import ImmunitySvg from "./ImmunitySvg";
+
+const PositiveImmunitySvg = asPositiveSvg(ImmunitySvg);
+const DarkModePositiveImmunitySvg = asDarkModePositiveSvg(ImmunitySvg);
+
+export default ImmunitySvg;
+export { ImmunitySvg, PositiveImmunitySvg, DarkModePositiveImmunitySvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/InspirationTokenSvg/InspirationTokenSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/InspirationTokenSvg/InspirationTokenSvg.tsx
new file mode 100644
index 0000000..86b4c31
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/InspirationTokenSvg/InspirationTokenSvg.tsx
@@ -0,0 +1,52 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import BaseSvg from "../../BaseSvg";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+}
+export default class InspirationTokenSvg extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-inspiration-token-svg", className];
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 50 30">
+        <g>
+          <path
+            fill={theme.themeColor}
+            d="M25,14.2c-6.4,0-11.7,5.1-12.2,11.5H2.2V30h10.9h23.8h10.9v-4.3H37.2C36.7,19.3,31.4,14.2,25,14.2z"
+          />
+          <path
+            fill={theme.themeColor}
+            d="M26.9,10.3V0h-3.7v10.3c0.6-0.1,1.2-0.1,1.9-0.1S26.3,10.2,26.9,10.3z"
+          />
+          <path
+            fill={theme.themeColor}
+            d="M42.4,5.3l-3-2.3l-6.4,9.1c1.1,0.5,2.2,1.2,3.1,2.1L42.4,5.3z"
+          />
+          <path
+            fill={theme.themeColor}
+            d="M41.7,22.1l8.3-3.1l-1.3-3.6L40,18.7C40.7,19.7,41.3,20.9,41.7,22.1z"
+          />
+          <path
+            fill={theme.themeColor}
+            d="M17.1,12.1L10.6,3l-3,2.3l6.3,8.9C14.9,13.3,16,12.6,17.1,12.1z"
+          />
+          <path
+            fill={theme.themeColor}
+            d="M10,18.7l-8.7-3.3L0,18.9l8.3,3.1C8.7,20.9,9.3,19.7,10,18.7z"
+          />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/LinkOutSvg/LinkOutSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/LinkOutSvg/LinkOutSvg.tsx
new file mode 100644
index 0000000..28c0793
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/LinkOutSvg/LinkOutSvg.tsx
@@ -0,0 +1,30 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class LinkOutSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-link-out-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 18 18">
+        <path
+          d="M16.7068 1.293C16.8028 1.389 16.8758 1.5 16.9248 1.619C16.9728 1.735 16.9998 1.863 16.9998 1.997V2V7C16.9998 7.553 16.5518 8 15.9998
+                 8C15.4478 8 14.9998 7.553 14.9998 7V4.414L8.7068 10.707C8.5118 10.902 8.2558 11 7.9998 11C7.7438 11 7.4878 10.902 7.2928 10.707C6.9028 10.316
+                 6.9028 9.683 7.2928 9.293L13.5858 3H10.9998C10.4478 3 9.9998 2.553 9.9998 2C9.9998 1.447 10.4478 1 10.9998 1H15.9998H16.0028C16.1368 1 16.2648
+                 1.027 16.3808 1.075C16.4998 1.124 16.6108 1.197 16.7068 1.293ZM12 10.9999C12 10.4469 12.448 9.9999 13 9.9999C13.552 9.9999 14 10.4469 14
+                 10.9999V15.9999C14 16.5529 13.552 16.9999 13 16.9999H2C1.448 16.9999 1 16.5529 1 15.9999V4.9999C1 4.4469 1.448 3.9999 2 3.9999H7C7.552
+                 3.9999 8 4.4469 8 4.9999C8 5.5529 7.552 5.9999 7 5.9999H3V14.9999H12V10.9999Z"
+          fill={fillColor}
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/LinkOutSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/LinkOutSvg/index.ts
new file mode 100644
index 0000000..6ba4807
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/LinkOutSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import LinkOutSvg from "./LinkOutSvg";
+
+const LightLinkOutSvg = asLightSvg(LinkOutSvg);
+const ThemedLinkOutSvg = asThemedSvg(LinkOutSvg);
+
+export default LinkOutSvg;
+export { LinkOutSvg, LightLinkOutSvg, ThemedLinkOutSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/LockSvg/LockSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/LockSvg/LockSvg.tsx
new file mode 100644
index 0000000..f387c8f
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/LockSvg/LockSvg.tsx
@@ -0,0 +1,23 @@
+import * as React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class LockSvg extends React.PureComponent<InjectedSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 10.2299 15.0756" className={className}>
+        <path
+          fill={fillColor}
+          d="M9.30491,6.41174V4.19A4.19,4.19,0,0,0,.925,4.19V6.41174L0,6.54333v7.61309l5.115.91918,5.115-.91918V6.54333ZM2.30862,4.19a2.80632,2.80632,0,0,1,5.61264,0V6.21491L5.115,5.81568l-2.80633.39923Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/LockSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/LockSvg/index.ts
new file mode 100644
index 0000000..99380e0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/LockSvg/index.ts
@@ -0,0 +1,9 @@
+import { asDarkSvg, asDisabledSvg, asLightSvg } from "../../hocs";
+import LockSvg from "./LockSvg";
+
+const LightLockSvg = asLightSvg(LockSvg);
+const DarkLockSvg = asDarkSvg(LockSvg);
+const DisabledLockSvg = asDisabledSvg(LockSvg);
+
+export default LockSvg;
+export { LockSvg, LightLockSvg, DarkLockSvg, DisabledLockSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/LongRestSvg/LongRestSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/LongRestSvg/LongRestSvg.tsx
new file mode 100644
index 0000000..673cd5b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/LongRestSvg/LongRestSvg.tsx
@@ -0,0 +1,36 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class LongRestSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-long-rest-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 443.5 443.5">
+        <path
+          fill={fillColor}
+          d="M221.75.25c122.33,0,221.5,99.17,221.5,221.5s-99.17,221.5-221.5,221.5S.25,344.08.25,221.75,99.42.25,221.75.25ZM370.58,353.13c69.03-39.84,83.21-144.48,31.66-233.72C350.7,30.17,252.96-9.88,183.92,29.97c-69.03,39.84-83.21,144.48-31.66,233.72C203.8,352.93,301.54,392.98,370.58,353.13Z"
+        />
+        <ellipse
+          fill="none"
+          stroke={fillColor}
+          strokeMiterlimit={10}
+          strokeWidth="10px"
+          cx="277.25"
+          cy="191.55"
+          rx="144.3145"
+          ry="186.5974"
+          transform="matrix(0.86569, -0.50058, 0.50058, 0.86569, -58.64876, 164.51324)"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/LongRestSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/LongRestSvg/index.ts
new file mode 100644
index 0000000..a9eed7e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/LongRestSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import LongRestSvg from "./LongRestSvg";
+
+const LightLongRestSvg = asLightSvg(LongRestSvg);
+const ThemedLongRestSvg = asThemedSvg(LongRestSvg);
+
+export default LongRestSvg;
+export { LongRestSvg, LightLongRestSvg, ThemedLongRestSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ManageLevelSvg/ManageLevelSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/ManageLevelSvg/ManageLevelSvg.tsx
new file mode 100644
index 0000000..f8da127
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ManageLevelSvg/ManageLevelSvg.tsx
@@ -0,0 +1,48 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class ManageLevelSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-manage-level-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 16 16">
+        <g
+          id="Sheet"
+          stroke="none"
+          strokeWidth="1"
+          fill="none"
+          fillRule="evenodd"
+        >
+          <g
+            id="Character-Drop-Down"
+            transform="translate(-30.000000, -140.000000)"
+          >
+            <g id="Group-45-Copy" transform="translate(30.000000, 140.000000)">
+              <circle
+                id="Oval-4"
+                fill={fillColor}
+                cx="8"
+                cy="8"
+                r="7.51098633"
+              ></circle>
+              <path
+                d="M9.83015873,7.3467308 L12,7.3467308 L8,3.3467308 L4,7.3467308 L6.16984127,7.3467308 L6.16984127,11.8389386 L9.83015873,11.8389386 L9.83015873,7.3467308 Z"
+                id="Combined-Shape"
+                fill="#242528"
+              ></path>
+            </g>
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ManageLevelSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/ManageLevelSvg/index.ts
new file mode 100644
index 0000000..e42d1ee
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ManageLevelSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import ManageLevelSvg from "./ManageLevelSvg";
+
+const LightManageLevelSvg = asLightSvg(ManageLevelSvg);
+const ThemedManageLevelSvg = asThemedSvg(ManageLevelSvg);
+
+export default ManageLevelSvg;
+export { ManageLevelSvg, LightManageLevelSvg, ThemedManageLevelSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ManageXpSvg/ManageXpSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/ManageXpSvg/ManageXpSvg.tsx
new file mode 100644
index 0000000..e080c6d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ManageXpSvg/ManageXpSvg.tsx
@@ -0,0 +1,64 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class ManageXpSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-manage-xp-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 16 8">
+        <defs>
+          <polygon
+            id="ManageXpSvg-path-1"
+            points="0.9639 8 7.751 8 7.751 0.0003 0.9639 0.0003"
+          ></polygon>
+        </defs>
+        <g
+          id="ManageXpSvg-Sheet"
+          stroke="none"
+          strokeWidth="1"
+          fill="none"
+          fillRule="evenodd"
+        >
+          <g
+            id="ManageXpSvg-Character-Drop-Down"
+            transform="translate(-30.000000, -235.000000)"
+          >
+            <g
+              id="ManageXpSvg-Page-1"
+              transform="translate(30.000000, 235.000000)"
+            >
+              <polygon
+                id="ManageXpSvg-Fill-1"
+                fill={fillColor}
+                points="5.733 0.00031 4.186 2.50631 2.615 0.00031 0.18 0.00031 2.794 3.89831 0 7.99931 2.447 7.99931 4.186 5.31331 5.925 7.99931 8.359 7.99931 5.576 3.88531 8.179 0.00031"
+              ></polygon>
+              <g
+                id="ManageXpSvg-Group-4"
+                transform="translate(8.000000, -0.000490)"
+              >
+                <mask id="ManageXpSvg-mask-2" fill="white">
+                  <use xlinkHref="#ManageXpSvg-path-1"></use>
+                </mask>
+                <path
+                  d="M4.6929,1.7393 L3.0259,1.7393 L3.0259,3.5383 L4.6929,3.5383 C5.2449,3.5383 5.6529,3.1903 5.6529,2.6513 C5.6529,2.0993 5.2449,1.7393 4.6929,1.7393 L4.6929,1.7393 Z M0.9639,0.0003 L4.9689,0.0003 C6.7679,0.0003 7.7519,1.2123 7.7519,2.6633 C7.7519,4.1023 6.7679,5.2893 4.9689,5.2893 L3.0259,5.2893 L3.0259,8.0003 L0.9639,8.0003 L0.9639,0.0003 Z"
+                  id="ManageXpSvg-Fill-2"
+                  fill={fillColor}
+                  mask="url(#ManageXpSvg-mask-2)"
+                ></path>
+              </g>
+            </g>
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ManageXpSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/ManageXpSvg/index.ts
new file mode 100644
index 0000000..1503609
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ManageXpSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import ManageXpSvg from "./ManageXpSvg";
+
+const LightManageXpSvg = asLightSvg(ManageXpSvg);
+const ThemedManageXpSvg = asThemedSvg(ManageXpSvg);
+
+export default ManageXpSvg;
+export { ManageXpSvg, LightManageXpSvg, ThemedManageXpSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/PaintBrushSvg/PaintBrushSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/PaintBrushSvg/PaintBrushSvg.tsx
new file mode 100644
index 0000000..f95b0fb
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/PaintBrushSvg/PaintBrushSvg.tsx
@@ -0,0 +1,34 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class PaintBrushSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-paint-brush-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 24 24">
+        <g clipPath="url(#clip0)">
+          <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M3.16445 13.127L0.903338 12.1028C0.622071 11.9754 0.481436 11.9117 0.389292 11.8406C-0.0163848 11.5276 -0.119928 10.9587 0.14948 10.5229C0.210673 10.424 0.319843 10.3148 0.538184 10.0964L8.24683 2.3878L8.24684 2.38778C8.71992 1.9147 8.95647 1.67815 9.19101 1.51876C10.2088 0.82708 11.5457 0.827081 12.5635 1.51876C12.7981 1.67815 13.0346 1.91469 13.5077 2.38777L13.5077 2.38779L13.5077 2.3878L17.2408 6.12085L17.241 6.12059L18.6552 7.5348L19.5659 8.4455C20.7375 9.61708 20.7375 11.5166 19.5659 12.6881L18.67 13.5841L20.0842 14.9983L23.0771 17.9912C24.3267 19.2408 24.3267 21.2669 23.0771 22.5166C21.8274 23.7663 19.8013 23.7663 18.5516 22.5166L15.5588 19.5238L14.1445 18.1095L13.264 18.9901C12.0924 20.1617 10.1929 20.1617 9.02132 18.9901L8.11062 18.0794L6.6964 16.6652L6.69952 16.6621L3.16445 13.127ZM9.52841 16.6626L9.5253 16.6657L10.4355 17.5759C10.8261 17.9664 11.4592 17.9664 11.8497 17.5759L12.7303 16.6953L14.1445 15.2811L15.5588 16.6953L19.9658 21.1024C20.4345 21.571 21.1942 21.571 21.6629 21.1024C22.1315 20.6338 22.1315 19.874 21.6629 19.4054L17.2558 14.9983L15.8416 13.5841L17.2558 12.1699L18.1517 11.2739C18.5422 10.8834 18.5423 10.2502 18.1517 9.85972L17.2415 8.94948L17.2412 8.94975L9.52841 16.6626ZM12.0935 3.80201L15.8265 7.53506L8.11373 15.2479L4.57866 11.7128L4.32128 11.4554L3.98971 11.3052L2.72894 10.7341L5.22052 8.24253L7.34194 10.364C7.73246 10.7545 8.36563 10.7545 8.75615 10.364C9.14667 9.97343 9.14667 9.34027 8.75615 8.94974L6.63473 6.82832L8.04887 5.41418L8.756 6.1213C9.14652 6.51183 9.77969 6.51183 10.1702 6.1213C10.5607 5.73078 10.5607 5.09762 10.1702 4.70709L9.46308 3.99997L9.66104 3.80201C9.90679 3.55626 10.0573 3.40607 10.1754 3.29555C10.274 3.20318 10.3109 3.17597 10.3152 3.17289C10.3152 3.1729 10.3152 3.17291 10.3152 3.17292C10.3155 3.17271 10.3157 3.17259 10.3157 3.17258C10.3157 3.17258 10.3155 3.17267 10.3152 3.17289C10.6545 2.94237 11.1001 2.94237 11.4393 3.17289L11.4393 3.1729C11.4437 3.17601 11.4806 3.20326 11.5792 3.29555C11.6972 3.40607 11.8477 3.55626 12.0935 3.80201ZM3.08861 17.7808C2.96366 18.044 2.76883 18.2677 2.52537 18.4277C2.28658 18.5975 2.00549 18.6981 1.71313 18.7183C1.42078 18.7384 1.12854 18.6774 0.868687 18.5419C0.608832 18.4065 0.391472 18.2018 0.240608 17.9506C0.0897448 17.6993 0.0112472 17.4113 0.0137836 17.1183L0 15.5957C0.00382222 15.4984 0.0305142 15.4033 0.0779134 15.3182C0.125312 15.2332 0.192086 15.1605 0.272823 15.106C0.35356 15.0515 0.44599 15.0169 0.542625 15.0048C0.639259 14.9927 0.73738 15.0036 0.829038 15.0365L2.2356 15.6196C2.50659 15.7265 2.74301 15.9057 2.91906 16.1378C3.09512 16.3699 3.20404 16.6458 3.23394 16.9356C3.26384 17.2253 3.21357 17.5177 3.08861 17.7808Z"
+            fill={fillColor}
+          />
+        </g>
+        <defs>
+          <clipPath id="clip0">
+            <rect width="24" height="24" fill={fillColor} />
+          </clipPath>
+        </defs>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/PaintBrushSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/PaintBrushSvg/index.ts
new file mode 100644
index 0000000..9b512b6
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/PaintBrushSvg/index.ts
@@ -0,0 +1,14 @@
+import { asLightSvg, asDarkSvg, asThemedSvg } from "../../hocs";
+import PaintBrushSvg from "./PaintBrushSvg";
+
+const LightPaintBrushSvg = asLightSvg(PaintBrushSvg);
+const DarkPaintBrushSvg = asDarkSvg(PaintBrushSvg);
+const ThemedPaintBrushSvg = asThemedSvg(PaintBrushSvg);
+
+export default PaintBrushSvg;
+export {
+  PaintBrushSvg,
+  LightPaintBrushSvg,
+  DarkPaintBrushSvg,
+  ThemedPaintBrushSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/PencilSvg/PencilSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/PencilSvg/PencilSvg.tsx
new file mode 100644
index 0000000..ff4441b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/PencilSvg/PencilSvg.tsx
@@ -0,0 +1,27 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class PencilSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-pencil-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 15 14">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M0.828181 12.0217C0.625019 13.125 1.12507 13.75 2.33489 13.5284L5.177 12.8479C5.67077 12.7297 6.12217 12.4771 6.48119 12.118L13.4476 5.15165C14.3262 4.27297 14.3262 2.84835 13.4476 1.96967L12.3869 0.90901C11.5082 0.0303294 10.0836 0.0303308 9.20493 0.90901L2.23855 7.87539C1.87953 8.23441 1.62691 8.68581 1.50869 9.17959L0.828181 12.0217ZM12.3869 4.09099L11.3852 5.09272L9.26385 2.9714L10.2656 1.96967C10.5585 1.67678 11.0334 1.67678 11.3262 1.96967L12.3869 3.03033C12.6798 3.32322 12.6798 3.7981 12.3869 4.09099ZM4.56587 11.4518L2.38184 11.9748L2.90477 9.79074C2.94584 9.61921 3.03155 9.4616 3.15319 9.33389L8.20322 4.03206L10.3245 6.15338L5.02271 11.2034C4.895 11.3251 4.73739 11.4108 4.56587 11.4518Z"
+          fill={fillColor}
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/PencilSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/PencilSvg/index.ts
new file mode 100644
index 0000000..0427601
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/PencilSvg/index.ts
@@ -0,0 +1,9 @@
+import { asLightSvg, asDarkSvg, asThemedSvg } from "../../hocs";
+import PencilSvg from "./PencilSvg";
+
+const LightPencilSvg = asLightSvg(PencilSvg);
+const DarkPencilSvg = asDarkSvg(PencilSvg);
+const ThemedPencilSvg = asThemedSvg(PencilSvg);
+
+export default PencilSvg;
+export { PencilSvg, LightPencilSvg, DarkPencilSvg, ThemedPencilSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/PlayButtonSvg/PlayButtonSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/PlayButtonSvg/PlayButtonSvg.tsx
new file mode 100644
index 0000000..9b4f973
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/PlayButtonSvg/PlayButtonSvg.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class PlayButtonSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-play-button-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 11 14">
+        <path
+          fill={fillColor}
+          d="M2 3.64L7.27 7L2 10.36V3.64ZM0 0V14L11 7L0 0Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/PlayButtonSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/PlayButtonSvg/index.ts
new file mode 100644
index 0000000..b8e46cb
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/PlayButtonSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg, asLightSvg, asPositiveSvg, asThemedSvg } from "../../hocs";
+import PlayButtonSvg from "./PlayButtonSvg";
+
+const LightPlayButtonSvg = asLightSvg(PlayButtonSvg);
+const DarkPlayButtonSvg = asDarkSvg(PlayButtonSvg);
+const ThemedPlayButtonSvg = asThemedSvg(PlayButtonSvg);
+const PositivePlayButtonSvg = asPositiveSvg(PlayButtonSvg);
+
+export default PlayButtonSvg;
+export {
+  PlayButtonSvg,
+  LightPlayButtonSvg,
+  ThemedPlayButtonSvg,
+  DarkPlayButtonSvg,
+  PositivePlayButtonSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/PortraitSvg/PortraitSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/PortraitSvg/PortraitSvg.tsx
new file mode 100644
index 0000000..3e86c88
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/PortraitSvg/PortraitSvg.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class PortraitSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-portrait-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 17.9 22">
+        <path
+          fill={fillColor}
+          d="M16.4,19.1C16.4,19.1,16.4,19.1,16.4,19.1c-0.6-0.2-1.1-0.4-1.7-0.6c-0.8-0.3-1.2-0.8-1.3-1.5
+                    c0-0.1-0.1-0.2-0.1-0.3c0-0.1,0-0.3,0.1-0.4c0.2-0.4,0.5-0.8,0.6-1.2c0.2-0.6,0.4-1.2,0.6-1.8c0.3,0.1,0.5-0.1,0.7-0.3
+                    c0.6-1,0.9-2.1,0.9-3.3c0-0.2-0.1-0.4-0.2-0.5c-0.3-0.2-0.2-0.4-0.2-0.7C16,8.3,16,8.1,16,8c0.2-1.2,0.3-2.3,0-3.5
+                    c-0.2-0.8-0.5-1.6-1.2-1.9c-0.5-0.2-0.8-0.6-1.2-1c-1.5-1.5-3.3-1.9-5.2-1.5C6.8,0.5,5.6,1.5,4.5,2.7C3.5,3.9,2.9,5.3,3,6.9
+                    c0,0.5,0.2,1,0.2,1.5c-0.6,0.1-0.8,0.4-0.8,1c0,0.1,0,0.2,0,0.3c0.1,0.9,0.3,1.7,0.7,2.5c0.1,0.2,0.3,0.4,0.5,0.6
+                    c0.1,0.1,0.2,0.2,0.2,0.3c0.2,1.1,0.6,2.2,1.2,3.1c0.1,0.1,0.1,0.2,0.1,0.3C5.2,17,5.1,17.4,5,17.7c-0.1,0.2-0.2,0.4-0.4,0.5
+                    c-1.2,0.5-2.4,1-3.6,1.4c-0.2,0.1-0.3,0.2-0.5,0.3c-0.1,0.3-0.3,0.5-0.4,0.8c1,0.6,2,1.1,3.1,1.3h11.6c1-0.2,2-0.6,3-0.9
+                    c0.1,0,0.2-0.1,0.3-0.1v-1C17.4,19.7,17,19.3,16.4,19.1z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/PortraitSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/PortraitSvg/index.ts
new file mode 100644
index 0000000..9b37133
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/PortraitSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import PortraitSvg from "./PortraitSvg";
+
+const LightPortraitSvg = asLightSvg(PortraitSvg);
+const ThemedPortraitSvg = asThemedSvg(PortraitSvg);
+
+export default PortraitSvg;
+export { PortraitSvg, LightPortraitSvg, ThemedPortraitSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/PreferencesSvg/PreferencesSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/PreferencesSvg/PreferencesSvg.tsx
new file mode 100644
index 0000000..be0f22c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/PreferencesSvg/PreferencesSvg.tsx
@@ -0,0 +1,55 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class PreferencesSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-preferences-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 14 15">
+        <defs>
+          <polygon
+            id="PreferencesSvg-path-1"
+            points="13.7538 14.6039 0 14.6039 0 0.0003 13.7538 0.0003 13.7538 14.6039"
+          ></polygon>
+        </defs>
+        <g
+          id="PreferencesSvg-Sheet"
+          stroke="none"
+          strokeWidth="1"
+          fill="none"
+          fillRule="evenodd"
+        >
+          <g
+            id="PreferencesSvg-Character-Drop-Down"
+            transform="translate(-32.000000, -327.000000)"
+          >
+            <g
+              id="PreferencesSvg-Page-1"
+              transform="translate(32.000000, 327.000000)"
+            >
+              <mask id="PreferencesSvg-mask-2" fill="white">
+                <use xlinkHref="#PreferencesSvg-path-1"></use>
+              </mask>
+              <g id="PreferencesSvg-Clip-2"></g>
+              <path
+                d="M6.8768,9.8273 C5.4818,9.8273 4.3518,8.6963 4.3518,7.3023 C4.3518,5.9073 5.4818,4.7763 6.8768,4.7763 C8.2718,4.7763 9.4018,5.9073 9.4018,7.3023 C9.4018,8.6963 8.2718,9.8273 6.8768,9.8273 M12.3888,7.3023 C12.3888,6.7963 12.3198,6.3073 12.1918,5.8423 L13.7538,4.5083 L12.3228,2.2583 L10.4508,3.1073 C9.8868,2.6263 9.2248,2.2553 8.4978,2.0323 L8.2098,0.0003 L5.5438,0.0003 L5.2558,2.0323 C4.5288,2.2553 3.8668,2.6253 3.3028,3.1073 L1.4308,2.2583 L-0.0002,4.5083 L1.5618,5.8423 C1.4338,6.3073 1.3648,6.7963 1.3648,7.3023 C1.3648,7.8073 1.4338,8.2963 1.5618,8.7623 L-0.0002,10.0953 L1.4308,12.3463 L3.3028,11.4963 C3.8668,11.9783 4.5288,12.3483 5.2558,12.5713 L5.5438,14.6043 L8.2098,14.6043 L8.4978,12.5713 C9.2248,12.3483 9.8868,11.9783 10.4508,11.4963 L12.3228,12.3463 L13.7538,10.0953 L12.1918,8.7623 C12.3198,8.2963 12.3888,7.8073 12.3888,7.3023"
+                id="Fill-1"
+                fill={fillColor}
+                mask="url(#PreferencesSvg-mask-2)"
+              />
+            </g>
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/PreferencesSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/PreferencesSvg/index.ts
new file mode 100644
index 0000000..ec3442e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/PreferencesSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import PreferencesSvg from "./PreferencesSvg";
+
+const LightPreferencesSvg = asLightSvg(PreferencesSvg);
+const ThemedPreferencesSvg = asThemedSvg(PreferencesSvg);
+
+export default PreferencesSvg;
+export { PreferencesSvg, LightPreferencesSvg, ThemedPreferencesSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ResistanceSvg/ResistanceSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/ResistanceSvg/ResistanceSvg.tsx
new file mode 100644
index 0000000..f2403f7
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ResistanceSvg/ResistanceSvg.tsx
@@ -0,0 +1,23 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ResistanceSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 40.89941 48">
+      <path
+        fill={fillColor}
+        d="M21.18969,15.5h-4.12v7.44h4.12a3.68142,3.68142,0,0,0,2.79-.97,3.75732,3.75732,0,0,0,.94-2.73,3.81933,3.81933,0,0,0-.95-2.74A3.638,3.638,0,0,0,21.18969,15.5Z"
+      />
+      <path
+        fill={fillColor}
+        d="M40.4497,8c-11,0-20-6-20-8,0,2-9,8-20,8-4,35,20,40,20,40S44.4497,43,40.4497,8Zm-8.11,29.51h-6.97l-4.77-9.56h-3.53v9.56h-6.51V10.49h10.63c3.2,0,5.71.71,7.51,2.13a7.21618,7.21618,0,0,1,2.71,6.03,8.78153,8.78153,0,0,1-1.14,4.67005,8.14932,8.14932,0,0,1-3.57,3l5.64,10.91Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default ResistanceSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ResistanceSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/ResistanceSvg/index.ts
new file mode 100644
index 0000000..a73069a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ResistanceSvg/index.ts
@@ -0,0 +1,8 @@
+import { asPositiveSvg, asDarkModePositiveSvg } from "../../hocs";
+import ResistanceSvg from "./ResistanceSvg";
+
+const PositiveResistanceSvg = asPositiveSvg(ResistanceSvg);
+const DarkModePositiveResistanceSvg = asDarkModePositiveSvg(ResistanceSvg);
+
+export default ResistanceSvg;
+export { ResistanceSvg, PositiveResistanceSvg, DarkModePositiveResistanceSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/RitualSvg/RitualSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/RitualSvg/RitualSvg.tsx
new file mode 100644
index 0000000..ca07628
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/RitualSvg/RitualSvg.tsx
@@ -0,0 +1,24 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const RitualSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 12.17 14.83">
+      <path
+        fill={fillColor}
+        d="M3,0H1.22A1.23,1.23,0,0,0,0,1.24V13.6a1.23,1.23,0,0,0,1.22,1.24H11.41a.77.77,0,0,0,.76-.77c0-.43-.34-1-.76-1H2.13c-.33,0-.61,0-.61-.34s.27-1,.61-1H11a1.23,1.23,0,0,0,1.22-1.24V1.24A1.23,1.23,0,0,0,11,0H3.08"
+      />
+      <path
+        fill={secondaryFillColor}
+        d="M4.35,2.23A11.66,11.66,0,0,1,6.2,2.09a3.12,3.12,0,0,1,2.08.54A1.7,1.7,0,0,1,8.86,4,1.8,1.8,0,0,1,7.64,5.67v0A1.72,1.72,0,0,1,8.58,7a13.32,13.32,0,0,0,.53,1.88H7.84a9.62,9.62,0,0,1-.45-1.59c-.19-.88-.51-1.16-1.21-1.18H5.57V8.88H4.35Zm1.22,3H6.3c.83,0,1.35-.44,1.35-1.11S7.12,3,6.33,3a3.53,3.53,0,0,0-.76.06Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default RitualSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/RitualSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/RitualSvg/index.ts
new file mode 100644
index 0000000..bc0946c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/RitualSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import RitualSvg from "./RitualSvg";
+
+const LightRitualSvg = asLightSvg(RitualSvg);
+const DarkRitualSvg = asDarkSvg(RitualSvg);
+const GrayRitualSvg = asGraySvg(RitualSvg);
+
+export default RitualSvg;
+export { RitualSvg, LightRitualSvg, DarkRitualSvg, GrayRitualSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ShareSvg/ShareSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/ShareSvg/ShareSvg.tsx
new file mode 100644
index 0000000..24ac1a9
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ShareSvg/ShareSvg.tsx
@@ -0,0 +1,25 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class ShareSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-share-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 50 60">
+        <path
+          fill={fillColor}
+          d="M40.38461,0a9.61466,9.61466,0,0,0-9.61538,9.61538c0,.16527.05258.31551.0601.48077L15.74519,22.66827a9.4614,9.4614,0,0,0-6.12981-2.28366,9.61539,9.61539,0,0,0,0,19.23077,9.4614,9.4614,0,0,0,6.12981-2.28365L30.82933,49.90385c-.00752.16526-.0601.3155-.0601.48076a9.61539,9.61539,0,1,0,9.61538-9.61538,9.46142,9.46142,0,0,0-6.1298,2.28365L19.17067,30.48077c.00751-.16526.0601-.3155.0601-.48077s-.05259-.3155-.0601-.48077L34.25481,16.94711a9.46138,9.46138,0,0,0,6.1298,2.28366A9.61539,9.61539,0,1,0,40.38461,0Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ShareSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/ShareSvg/index.ts
new file mode 100644
index 0000000..b95c310
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ShareSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import ShareSvg from "./ShareSvg";
+
+const LightShareSvg = asLightSvg(ShareSvg);
+const ThemedShareSvg = asThemedSvg(ShareSvg);
+
+export default ShareSvg;
+export { ShareSvg, LightShareSvg, ThemedShareSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ShortRestSvg/ShortRestSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/ShortRestSvg/ShortRestSvg.tsx
new file mode 100644
index 0000000..32df7c4
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ShortRestSvg/ShortRestSvg.tsx
@@ -0,0 +1,37 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class ShortRestSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-short-rest-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 75.00001 91.37608">
+        <path
+          fill={fillColor}
+          d="M58.745,34.053c-8.41376-5.41754,0-15.47864,0-15.47864C44.08877,22.05707,44.77651,32,44.77651,32c-4.07116-2.51532-3.67328-7.23413.94074-16.52136S37.032,0,37.032,0s12.21356,13.15686-8.68518,24.76587-8.68518,24.76587-8.68518,24.76587A16.47186,16.47186,0,0,1,6.63387,43.34027c0,10.289,10.45673,17.73334,21.37586,20.491a17.23033,17.23033,0,0,1-2.96533-7.19837c-.04621-.27893.12744-.6784.48211-.63293a17.25615,17.25615,0,0,1,8.43189,3.63074,21.50626,21.50626,0,0,0,1.09772-5.22364c.37316-4.59375-1.6828-8.0484-4.21137-11.65478-.27563-.39319.18073-.80023.5647-.7345a12.743,12.743,0,0,1,10.2716,10.49347c4.52625-1.53119,6.34034-7.317,6.42878-11.678.01117-.55072.86242-.697.98217-.13293,1.39893,6.59,6.35651,14.61285,2.942,21.23028C66.09347,54.97485,65.35421,38.30859,58.745,34.053Z"
+        />
+        <path
+          fill={fillColor}
+          d="M4.3,73.47608l10,2.7,18.3-5s-27.2-7.4-27.7-7.4a4.908,4.908,0,0,0-4.9,4.9A4.78148,4.78148,0,0,0,4.3,73.47608Z"
+        />
+        <path
+          fill={fillColor}
+          d="M70.1,63.77607c-.7,0-65.8,17.9-65.8,17.9a4.83787,4.83787,0,0,0-4.1,4.8,4.908,4.908,0,0,0,4.9,4.9c.6,0,65.8-17.9,65.8-17.9a4.83788,4.83788,0,0,0,4.1-4.8A4.908,4.908,0,0,0,70.1,63.77607Z"
+        />
+        <path
+          fill={fillColor}
+          d="M70.9,81.67607l-10.3-2.8-18.3,5s27.2,7.5,27.8,7.5a4.8815,4.8815,0,0,0,.8-9.7Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ShortRestSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/ShortRestSvg/index.ts
new file mode 100644
index 0000000..822ae44
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ShortRestSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import ShortRestSvg from "./ShortRestSvg";
+
+const LightShortRestSvg = asLightSvg(ShortRestSvg);
+const ThemedShortRestSvg = asThemedSvg(ShortRestSvg);
+
+export default ShortRestSvg;
+export { ShortRestSvg, LightShortRestSvg, ThemedShortRestSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ThemeIconSvg/ThemeIconSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/ThemeIconSvg/ThemeIconSvg.tsx
new file mode 100644
index 0000000..b4c22b8
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ThemeIconSvg/ThemeIconSvg.tsx
@@ -0,0 +1,26 @@
+import React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class ThemeIconSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-theme-icon-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 16 16">
+        <path
+          fill={fillColor}
+          d="M15,0H0v16h16V0H15z M12.3,3H3.7l-2-2h12.6L12.3,3z M4,12L4,12l0-8h8v8l0,0H4z M3,3.7v8.6l-2,2V1.7L3,3.7z M3.7,13h8.6
+			            l2,2H1.7L3.7,13z M13,12.3V3.7l2-2v12.6L13,12.3z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/ThemeIconSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/ThemeIconSvg/index.ts
new file mode 100644
index 0000000..870712c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/ThemeIconSvg/index.ts
@@ -0,0 +1,8 @@
+import { asLightSvg, asThemedSvg } from "../../hocs";
+import ThemeIconSvg from "./ThemeIconSvg";
+
+const LightThemeIconSvg = asLightSvg(ThemeIconSvg);
+const ThemedThemeIconSvg = asThemedSvg(ThemeIconSvg);
+
+export default ThemeIconSvg;
+export { ThemeIconSvg, LightThemeIconSvg, ThemedThemeIconSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/UnlockSvg/UnlockSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/UnlockSvg/UnlockSvg.tsx
new file mode 100644
index 0000000..6a64817
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/UnlockSvg/UnlockSvg.tsx
@@ -0,0 +1,23 @@
+import * as React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class UnlockSvg extends React.PureComponent<InjectedSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 10.23313 16" className={className}>
+        <path
+          fill={fillColor}
+          d="M5.11656,6.73717l-2.80744.39938V4.19033a2.8071,2.8071,0,0,1,5.6142,0H9.30741a4.19119,4.19119,0,0,0-8.38238,0V7.33344L0,7.465v7.61549L5.11656,16l5.11657-.91947V7.465Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/UnlockSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/UnlockSvg/index.ts
new file mode 100644
index 0000000..c060a9c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/UnlockSvg/index.ts
@@ -0,0 +1,9 @@
+import { asDarkSvg, asDisabledSvg, asLightSvg } from "../../hocs";
+import UnlockSvg from "./UnlockSvg";
+
+const LightUnlockSvg = asLightSvg(UnlockSvg);
+const DarkUnlockSvg = asDarkSvg(UnlockSvg);
+const DisabledUnlockSvg = asDisabledSvg(UnlockSvg);
+
+export default UnlockSvg;
+export { UnlockSvg, LightUnlockSvg, DarkUnlockSvg, DisabledUnlockSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/VulnerabilitySvg/VulnerabilitySvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/VulnerabilitySvg/VulnerabilitySvg.tsx
new file mode 100644
index 0000000..1614104
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/VulnerabilitySvg/VulnerabilitySvg.tsx
@@ -0,0 +1,19 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const VulnerabilitySvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 40.89941 48">
+      <path
+        fill={fillColor}
+        d="M40.4497,8c-11,0-20-6-20-8,0,2-9,8-20,8-4,35,20,40,20,40S44.4497,43,40.4497,8Zm-16.63,30.42h-7.12l-9.02-27.02h7.22L20.2597,31.07l5.38-19.67h7.27Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default VulnerabilitySvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/VulnerabilitySvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/VulnerabilitySvg/index.ts
new file mode 100644
index 0000000..5efb62a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/VulnerabilitySvg/index.ts
@@ -0,0 +1,13 @@
+import { asDarkModeNegativeSvg, asNegativeSvg } from "../../hocs";
+import VulnerabilitySvg from "./VulnerabilitySvg";
+
+const NegativeVulnerabilitySvg = asNegativeSvg(VulnerabilitySvg);
+const DarkModeNegativeVulnerabilitySvg =
+  asDarkModeNegativeSvg(VulnerabilitySvg);
+
+export default VulnerabilitySvg;
+export {
+  VulnerabilitySvg,
+  NegativeVulnerabilitySvg,
+  DarkModeNegativeVulnerabilitySvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronDownSvg/ChevronDownSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronDownSvg/ChevronDownSvg.tsx
new file mode 100644
index 0000000..c7ef256
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronDownSvg/ChevronDownSvg.tsx
@@ -0,0 +1,30 @@
+import React from "react";
+
+import BaseSvg from "../../../BaseSvg";
+import { InjectedSvgProps } from "../../../hocs";
+
+export default class ChevronDownSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = [
+      "ddbc-chevron-svg",
+      "ddbc-chevron-down-svg",
+    ];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 1792 1792">
+        <path
+          fill={fillColor}
+          d="M1683,653.5l-742,741c-12.7,12.7-27.7,19-45,19s-32.3-6.3-45-19l-742-741c-12.7-12.7-19-27.8-19-45.5
+                        s6.3-32.8,19-45.5l166-165c12.7-12.7,27.7-19,45-19s32.3,6.3,45,19l531,531l531-531c12.7-12.7,27.7-19,45-19s32.3,6.3,45,19l166,165
+                        c12.7,12.7,19,27.8,19,45.5S1695.7,640.8,1683,653.5z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronDownSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronDownSvg/index.ts
new file mode 100644
index 0000000..2d9df81
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronDownSvg/index.ts
@@ -0,0 +1,21 @@
+import {
+  asDarkSvg,
+  asDisabledSvg,
+  asLightSvg,
+  asThemedSvg,
+} from "../../../hocs";
+import ChevronDownSvg from "./ChevronDownSvg";
+
+const LightChevronDownSvg = asLightSvg(ChevronDownSvg);
+const DarkChevronDownSvg = asDarkSvg(ChevronDownSvg);
+const DisabledChevronDownSvg = asDisabledSvg(ChevronDownSvg);
+const ThemedChevronDownSvg = asThemedSvg(ChevronDownSvg);
+
+export default ChevronDownSvg;
+export {
+  ChevronDownSvg,
+  LightChevronDownSvg,
+  ThemedChevronDownSvg,
+  DarkChevronDownSvg,
+  DisabledChevronDownSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronLeftSvg/ChevronLeftSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronLeftSvg/ChevronLeftSvg.tsx
new file mode 100644
index 0000000..f89bb16
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronLeftSvg/ChevronLeftSvg.tsx
@@ -0,0 +1,29 @@
+import React from "react";
+
+import BaseSvg from "../../../BaseSvg";
+import { InjectedSvgProps } from "../../../hocs";
+
+export default class ChevronLeftSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = [
+      "ddbc-chevron-svg",
+      "ddbc-chevron-left-svg",
+    ];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 1035 1612">
+        <path
+          fill={fillColor}
+          d="M1184,90q26.5,0,45.5,19l165,166q19,19,19,45t-19,45l-531,531,531,531q19,19,19,45t-19,45l-165,166q-19,19-45.5,19t-45.5-19l-741-742q-19-19-19-45t19-45l741-742Q1157.5,90,1184,90Z"
+          transform="translate(-378.5 -90)"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronLeftSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronLeftSvg/index.ts
new file mode 100644
index 0000000..f67b762
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronLeftSvg/index.ts
@@ -0,0 +1,24 @@
+import {
+  asBuilderSvg,
+  asDarkSvg,
+  asDisabledSvg,
+  asLightSvg,
+  asThemedSvg,
+} from "../../../hocs";
+import ChevronLeftSvg from "./ChevronLeftSvg";
+
+const BuilderChevronLeftSvg = asBuilderSvg(ChevronLeftSvg);
+const LightChevronLeftSvg = asLightSvg(ChevronLeftSvg);
+const DarkChevronLeftSvg = asDarkSvg(ChevronLeftSvg);
+const DisabledChevronLeftSvg = asDisabledSvg(ChevronLeftSvg);
+const ThemedChevronLeftSvg = asThemedSvg(ChevronLeftSvg);
+
+export default ChevronLeftSvg;
+export {
+  ChevronLeftSvg,
+  BuilderChevronLeftSvg,
+  LightChevronLeftSvg,
+  ThemedChevronLeftSvg,
+  DarkChevronLeftSvg,
+  DisabledChevronLeftSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronRightSvg/ChevronRightSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronRightSvg/ChevronRightSvg.tsx
new file mode 100644
index 0000000..f8939ca
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronRightSvg/ChevronRightSvg.tsx
@@ -0,0 +1,29 @@
+import React from "react";
+
+import BaseSvg from "../../../BaseSvg";
+import { InjectedSvgProps } from "../../../hocs";
+
+export default class ChevronRightSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = [
+      "ddbc-chevron-svg",
+      "ddbc-chevron-right-svg",
+    ];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 1035 1612">
+        <path
+          fill={fillColor}
+          d="M653.5,109l741,742q19,19,19,45t-19,45l-741,742q-19,19-45.5,19t-45.5-19l-165-166q-19-19-19-45t19-45l531-531-531-531q-19-19-19-45t19-45l165-166q19-19,45.5-19T653.5,109Z"
+          transform="translate(-378.5 -90)"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronRightSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronRightSvg/index.ts
new file mode 100644
index 0000000..39fea13
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronRightSvg/index.ts
@@ -0,0 +1,24 @@
+import {
+  asBuilderSvg,
+  asDarkSvg,
+  asDisabledSvg,
+  asLightSvg,
+  asThemedSvg,
+} from "../../../hocs";
+import ChevronRightSvg from "./ChevronRightSvg";
+
+const BuilderChevronRightSvg = asBuilderSvg(ChevronRightSvg);
+const LightChevronRightSvg = asLightSvg(ChevronRightSvg);
+const DarkChevronRightSvg = asDarkSvg(ChevronRightSvg);
+const DisabledChevronRightSvg = asDisabledSvg(ChevronRightSvg);
+const ThemedChevronRightSvg = asThemedSvg(ChevronRightSvg);
+
+export default ChevronRightSvg;
+export {
+  ChevronRightSvg,
+  BuilderChevronRightSvg,
+  LightChevronRightSvg,
+  ThemedChevronRightSvg,
+  DarkChevronRightSvg,
+  DisabledChevronRightSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronUpSvg/ChevronUpSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronUpSvg/ChevronUpSvg.tsx
new file mode 100644
index 0000000..0c85416
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronUpSvg/ChevronUpSvg.tsx
@@ -0,0 +1,27 @@
+import React from "react";
+
+import BaseSvg from "../../../BaseSvg";
+import { InjectedSvgProps } from "../../../hocs";
+
+export default class ChevronUpSvg extends React.PureComponent<InjectedSvgProps> {
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-chevron-svg", "ddbc-chevron-up-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 1792 1792">
+        <path
+          fill={fillColor}
+          d="M109,1138.5l742-741c12.7-12.7,27.7-19,45-19s32.3,6.3,45,19l742,741c12.7,12.7,19,27.8,19,45.5
+                        c0,17.7-6.3,32.8-19,45.5l-166,165c-12.7,12.7-27.7,19-45,19s-32.3-6.3-45-19l-531-531l-531,531c-12.7,12.7-27.7,19-45,19
+                        s-32.3-6.3-45-19l-166-165c-12.7-12.7-19-27.8-19-45.5C90,1166.3,96.3,1151.2,109,1138.5z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronUpSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronUpSvg/index.ts
new file mode 100644
index 0000000..29b9b2e
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/chevrons/ChevronUpSvg/index.ts
@@ -0,0 +1,21 @@
+import {
+  asDarkSvg,
+  asDisabledSvg,
+  asLightSvg,
+  asThemedSvg,
+} from "../../../hocs";
+import ChevronUpSvg from "./ChevronUpSvg";
+
+const LightChevronUpSvg = asLightSvg(ChevronUpSvg);
+const DarkChevronUpSvg = asDarkSvg(ChevronUpSvg);
+const DisabledChevronUpSvg = asDisabledSvg(ChevronUpSvg);
+const ThemedChevronUpSvg = asThemedSvg(ChevronUpSvg);
+
+export default ChevronUpSvg;
+export {
+  ChevronUpSvg,
+  LightChevronUpSvg,
+  ThemedChevronUpSvg,
+  DarkChevronUpSvg,
+  DisabledChevronUpSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/AbilitiesSvg/AbilitiesSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/menu/AbilitiesSvg/AbilitiesSvg.tsx
new file mode 100644
index 0000000..8aa7d97
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/AbilitiesSvg/AbilitiesSvg.tsx
@@ -0,0 +1,22 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../../BaseSvg";
+
+export default class AbilitiesSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 134 144" className={className}>
+        <g fill={fillColor}>
+          <path d="M95.2078222,31.6564445 C102.611927,36.9740755 106.365398,41.8804109 106.365398,41.8804109 L110.739645,44.7774205 C108.552521,43.3289157 104.178274,43.3289157 104.178274,43.3289157 C118.759099,49.122935 120.217182,59.2624686 120.217182,59.2624686 C119.48814,57.8139638 115.113893,57.8139638 115.113893,57.8139638 C124.591429,61.4352258 127.507594,73.0232643 127.507594,73.0232643 C126.049512,71.5747595 120.946223,71.5747595 120.946223,71.5747595 C127.507594,75.1960215 128.965677,85.3355552 128.965677,85.3355552 C126.049512,81.7142932 120.217182,81.7142932 120.217182,81.7142932 C131.1528,89.6810696 133.339924,107.78738 133.339924,107.78738 C131.1528,104.89037 129.694718,104.166118 129.694718,104.166118 C134.798007,115.754156 134.798007,125.169437 132.610883,132.411962 C132.610883,132.411962 132.610883,133.136214 132.610883,134.584719 C131.881842,136.757476 130.423759,141.10299 123.862388,144 C123.862388,144 124.591429,130.963457 113.65581,121.548175 C113.65581,121.548175 115.113893,133.136214 119.48814,137.481728 C119.48814,137.481728 111.468686,137.481728 107.82348,131.687709 C107.82348,131.687709 107.094439,137.481728 110.010604,141.827243 C110.010604,141.827243 94.7007375,138.930233 91.0555312,128.790699 C91.0555312,128.790699 88.8684074,136.033224 93.242655,143.275748 C93.242655,143.275748 71.3714172,142.551495 63.3519633,130.239204 C63.3519633,130.239204 65.5390871,135.308971 60.4357983,142.551495 C60.4357983,142.551495 50.2292206,139.654486 46.5840144,130.963457 C46.5840144,130.963457 43.6678493,137.481728 47.3130556,143.275748 C47.3130556,143.275748 34.9193542,143.275748 23.9837353,131.687709 C23.9837353,131.687709 23.9837353,138.205981 26.8999003,141.827243 C26.8999003,141.827243 19.6094877,137.481728 17.422364,132.411962 C17.422364,132.411962 9.40291011,119.375418 7.94482759,110.684389 L9.40291011,98.3720985 C9.40291011,98.3720985 10.1319514,94.0265841 11.5900339,91.1295744 C13.7771577,91.1295744 16.6933227,91.8538268 18.8804465,92.5780792 C25.4418178,96.1993413 42.2097668,104.166118 57.5196332,104.166118 C58.9777158,104.166118 60.4357983,104.166118 61.8938808,104.166118 C77.2037473,102.717613 84.4941599,91.1295744 87.4103249,85.3355552 C90.3264899,88.9568172 94.7007375,92.5780792 94.7007375,92.5780792 L98.3459438,96.1993413 L97.6169025,91.1295744 C96.8878613,87.5083124 94.7007375,82.4385456 93.242655,78.0930312 L94.7007375,78.8172836 L94.7007375,75.1960215 C94.7007375,73.7475167 93.9716962,72.2990119 93.9716962,70.8505071 C94.7007375,71.5747595 95.4297788,71.5747595 95.4297788,71.5747595 L99.8040263,73.7475167 L97.6169025,69.4020023 C96.15882,65.0564879 93.9716962,62.1594782 92.5136137,59.986721 L96.15882,59.986721 L93.9716962,57.0897114 C93.242655,56.365459 93.242655,56.365459 92.5136137,55.6412066 L98.3459438,56.365459 L94.7007375,52.744197 C93.242655,51.2956922 92.5136137,49.8471874 91.0555312,49.122935 L99.0749851,51.2956922 L95.4297788,46.9501777 C89.5974487,40.4319061 61.1648395,29.56812 56.0615507,27.3953628 C58.5157508,24.3477639 60.9699508,22.3260901 63.8587068,20.4669385 C63.5302449,20.2641653 63.3519633,20.1528388 63.3519633,20.1528388 C63.3519633,20.1528388 95.4297788,-5.19599542 134.068966,14.3588195 C134.068966,14.3588195 123.862388,14.3588195 120.217182,16.5315767 C120.217182,16.5315767 123.862388,15.8073243 125.32047,16.5315767 C125.32047,16.5315767 121.675264,18.7043339 116.571975,17.9800815 C116.571975,17.9800815 116.571975,18.7043339 120.946223,19.4285864 C120.946223,19.4285864 118.030058,22.325596 110.010604,22.325596 C110.010604,22.325596 112.197728,23.7741008 115.113893,23.7741008 C115.113893,23.7741008 112.926769,26.6711104 104.907315,26.6711104 C104.907315,26.6711104 105.636356,27.3953628 107.094439,27.3953628 C107.094439,27.3953628 103.449233,28.8438676 100.533068,28.1196152 C100.533068,28.1196152 101.99115,29.56812 102.720191,29.56812 C102.720191,29.56812 98.5159258,30.2642282 95.2078222,31.6564445 Z" />
+          <path d="M27.5139937 20.2690075C34.1884697 12.7639713 49.9667473-1.48054959 72.4965517.125097866 72.4965517.125097866 65.9756795 3.01673626 63.8020554 5.18546506 63.8020554 5.18546506 65.9756795 3.73964586 67.4247622 3.73964586 67.4247622 3.73964586 65.9756795 5.90837466 62.3529727 7.35419386 62.3529727 7.35419386 62.3529727 8.07710346 65.2511381 7.35419386 65.2511381 7.35419386 63.8020554 9.52292266 58.7302659 12.4145611 58.7302659 12.4145611 60.1793486 12.4145611 62.3529727 11.6916515 62.3529727 11.6916515 61.6928611 13.667526 57.2222477 15.733298 59.0313156 15.8896856 60.7620132 16.029109 62.3529727 16.029109 55.1075591 20.3665666 48.5866868 26.872753 45.6885214 38.4393066 39.8921905 60.1265946 28.2995287 60.1265946 18.880491 61.5724138 18.1559496 59.403685 15.2577842 57.9578658 12.3596187 56.5120466L10.1859946 55.789137C8.66754915 41.6488966 13.8672015 27.5086562 27.5139937 20.2690075zM83.1921978 70.2900455L85.3678858 68.8397832C84.6426564 66.6643899 83.9174271 65.2141277 83.9174271 65.2141277L86.0931151 63.7638654C84.6426564 60.8633409 83.1921978 59.4130787 82.4669685 59.4130787L73.7642169 51.4366364 79.5660513 54.3371609 81.0165099 52.1617675C81.0165099 52.1617675 81.0165099 52.1617675 81.7417392 52.1617675 82.4669685 52.1617675 83.1921978 52.8868986 83.9174271 52.8868986 81.0165099 50.7115053 79.5660513 49.2612431 79.5660513 49.2612431L73.7642169 44.1853252 80.2912806 46.3607186C73.0389876 42.0099319 62.160548 37.6591452 57.0839429 36.2088829L57.8091722 34.7586207C55.6334843 37.6591452 54.1830257 41.2848008 52.732567 44.9104563 52.0073377 47.8109808 51.2821084 49.9863742 50.5568791 52.1617675 50.5568791 52.1617675 51.2821084 52.1617675 51.2821084 52.1617675 55.6334843 52.1617675 63.6110066 55.7874231 63.6110066 60.1382098 63.6110066 64.4889965 57.8091722 72.4654388 53.4577964 72.4654388 49.8316498 72.4654388 44.0298154 68.1146521 43.3045861 64.4889965 38.9532103 68.8397832 33.8766051 68.1146521 30.2504586 68.1146521 33.8766051 73.1905699 30.9756879 78.9916189 30.9756879 79.71675L33.1513758 81.8921434 28.8 82.6172745 29.5252293 84.0675367C29.5252293 84.0675367 49.1064205 95.6696346 63.6110066 94.2193724 77.3903634 92.7691101 81.7417392 78.2664878 82.4669685 77.5413567L83.1921978 73.9157011C86.8334533 78.0123091 88.8958241 80.5440338 89.3793103 81.5108753 87.9288517 75.7098264 83.1921978 70.2900455 83.1921978 70.2900455zM7.88605046 92.9161468C7.91608043 92.9212845 7.94640383 92.9269787 7.97703405 92.933244 6.45759237 95.8728302 5.72032862 97.3241379 5.72032862 97.3241379 4.96060778 95.8543448 4.99385226 95.8387558 4.23413142 94.3689627 4.29313889 94.340423 4.35100539 94.3114841 4.4078161 94.2822376 4.34037678 94.3162933 4.27145113 94.3504225 4.20088694 94.3845517-6.43520483 77.481931 6.48004946 60.5793103 6.48004946 60.5793103 10.2786537 62.0491034 13.317537 65.7235862 14.8369787 69.398069 17.8758621 75.2772414 17.8758621 81.8913103 17.8758621 81.8913103 11.7980953 82.6262069 8.75921198 87.7704828 7.99949114 92.9147586 7.96120328 92.9147586 7.92339782 92.9152253 7.88605046 92.9161468z" />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/AbilitiesSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/menu/AbilitiesSvg/index.ts
new file mode 100644
index 0000000..42e9fb3
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/AbilitiesSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../../hocs";
+import AbilitiesSvg from "./AbilitiesSvg";
+
+const LightAbilitiesSvg = asLightSvg(AbilitiesSvg);
+const DarkAbilitiesSvg = asDarkSvg(AbilitiesSvg);
+
+export default AbilitiesSvg;
+export { AbilitiesSvg, LightAbilitiesSvg, DarkAbilitiesSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/ActionsSvg/ActionsSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ActionsSvg/ActionsSvg.tsx
new file mode 100644
index 0000000..f27aefb
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ActionsSvg/ActionsSvg.tsx
@@ -0,0 +1,22 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../../BaseSvg";
+
+export default class ActionsSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 149 144" className={className}>
+        <g fill={fillColor} opacity=".89" transform="translate(.74)">
+          <path d="M132.39628,49.653393 C131.802145,45.5227285 130.482935,41.5048751 128.47568,37.7919268 C126.616052,35.4844132 123.845339,34.099057 120.883551,33.9958627 L120.37741,33.9958627 C116.024895,33.8911513 111.944792,36.1079 109.664073,39.8164943 C106.458508,30.5372265 102.999872,25.3070938 96.6730984,25.3070938 C91.6517967,25.1734503 86.8640495,27.4265078 83.7664805,31.3807963 C80.8077369,35.4487749 79.9911944,40.6934904 81.5731991,45.4684119 C81.5731991,46.5650526 82.5854828,48.5896201 83.4290526,51.2046865 C79.3039463,46.5925507 73.6320228,43.6515533 67.4855835,42.9377025 C64.1399815,42.9905965 61.0145904,44.6157999 59.0498856,47.3242654 C54.4946087,53.5666819 57.6158169,60.6526682 74.3184989,90.8524668 L79.4642746,100.300449 C75.5513209,99.7515725 71.6055386,99.4697309 67.6542975,99.4568787 C63.1649158,99.1352122 58.6572778,99.7381447 54.4102517,101.228375 C49.2943021,103.317841 45.9933934,108.176867 45.7655325,113.515879 L1.77149657,84.6100503 L49.9393318,84.6100503 L0,0 L64.7018032,41.5036339 L53.9884668,9.53233867 L79.1268467,25.3070938 L95.9982426,3.88042105 L116.328275,32.3087231 L136.742664,6.1580595 L132.39628,49.653393 Z M46.0261587,116.928377 C46.9188787,122.365388 51.5679176,126.421047 57.1096751,126.535469 C57.9230483,126.61779 58.7426542,126.61779 59.5560275,126.535469 C65.8189235,126.997519 71.9548286,128.53863 77.692778,131.090746 C78.0978182,131.72624 78.562983,132.346703 79.0838693,132.950268 L68.9196522,135.224238 L5.3144897,143.406865 L46.0261587,116.928377 Z" />
+          <path d="M96.6730984,33.7427918 C102.071945,33.7427918 108.398719,75.9212815 110.929428,75.9212815 C113.37578,75.9212815 114.303707,59.5560275 114.472421,54.4946087 C114.641135,49.4331899 115.400348,42.1784897 120.37741,42.1784897 C125.438828,42.1784897 123.582975,65.2079451 122.992476,68.7509382 C122.401977,72.2939314 122.992476,80.0547735 125.776256,80.0547735 C126.619826,80.0547735 127.716467,79.0424897 129.066178,76.2587094 C133.368384,67.8230114 141.719725,60.4839542 145.937574,60.4839542 C146.725159,60.4392854 147.447387,60.9207704 147.709071,61.6649519 C149.311854,66.0515149 134.380668,89.2496842 132.777886,92.0334645 C131.175103,94.8172449 132.777886,114.725492 131.343817,123.836046 C129.909748,132.9466 110.929428,134.971167 110.929428,134.971167 C97.9384531,134.971167 87.0564027,130.078462 84.6100503,125.270114 C82.1636979,120.461767 65.714087,116.834416 59.3029565,116.834416 L57.1096751,116.834416 C53.4823249,116.834416 52.2169703,110.760714 57.8688879,108.398719 C61.0160448,107.640007 64.2761704,107.468421 67.4855835,107.892577 C72.6240604,107.846637 77.7497143,108.413007 82.7541968,109.579716 C83.8186951,109.914848 84.9281127,110.085528 86.044119,110.085858 C89.1653272,110.085858 92.0334645,108.483076 90.177611,103.252943 C87.7312586,96.2513135 62.9303066,56.1817483 65.714087,52.6387551 C66.0388127,51.9329975 66.7126585,51.4516791 67.4855835,51.3734005 C71.7877895,51.3734005 80.5609153,59.3029565 85.6223341,67.7386545 C90.6837529,76.1743524 96.5887414,82.1636979 99.2881648,82.1636979 C99.7158392,82.1915906 100.128564,82.0011021 100.384805,81.6575561 C102.156302,79.2112037 91.1055378,48.7583341 89.5027551,43.3594874 C88.3952186,41.0895358 88.6479264,38.3911426 90.1576753,36.3663029 C91.6674242,34.3414633 94.1814682,33.3291541 96.6730984,33.7427918 Z" />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/ActionsSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ActionsSvg/index.ts
new file mode 100644
index 0000000..a83fb7a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ActionsSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../../hocs";
+import ActionsSvg from "./ActionsSvg";
+
+const LightActionsSvg = asLightSvg(ActionsSvg);
+const DarkActionsSvg = asDarkSvg(ActionsSvg);
+
+export default ActionsSvg;
+export { ActionsSvg, LightActionsSvg, DarkActionsSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/CreaturesSvg/CreaturesSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/menu/CreaturesSvg/CreaturesSvg.tsx
new file mode 100644
index 0000000..608e3a2
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/CreaturesSvg/CreaturesSvg.tsx
@@ -0,0 +1,44 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../../BaseSvg";
+
+export default class CreaturesSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 25 25" className={className}>
+        <defs>
+          <polygon
+            id="icon---creature@2x-a"
+            points="0 .058 1.06 .058 1.06 5.006 0 5.006"
+          />
+        </defs>
+        <g fill="none" fillRule="evenodd" transform="translate(1)">
+          <path
+            fill={fillColor}
+            d="M11.1381293 23.8628061C10.0682313 23.527602 8.9655102 23.5454592 7.99459184 23.927602 5.33540816 24.9742007.972482993 25.3060034 1.72588435 20.7832143 2.27673469 17.4770918 5.43829932 17.3753912 7.46346939 15.9094048 8.58047619 15.1007313 9.21755102 12.8988605 11.0272449 13.0315136 12.8053061 13.1617857 13.4333673 15.194949 14.7456122 16.0913776 17.5473129 18.0053231 22.1854082 18.4769218 19.417551 22.435085 17.0519048 25.8177381 14.6287755 24.9566837 11.1381293 23.8628061M2.51539116 12.499966C2.02134354 11.9844898 1.16505102 12.0520068.770663265 12.647415.110969388 13.6433333.0492346939 15.065102.644472789 16.0933333 1.10807823 16.8941837 2.1077381 17.3047279 2.83528912 16.5928231 3.32610544 16.1127211 3.49073129 14.9196939 3.41913265 14.2528571 3.37117347 13.805068 3.05348639 13.0613605 2.51539116 12.499966M7.20207483 8.52022109C6.79561224 7.84232993 5.89816327 7.70032313 5.30292517 8.22056122 4.23863946 9.15083333 3.67248299 10.4409694 4.28829932 11.8756633 4.64901361 12.7161395 5.24595238 13.1851871 6.19289116 12.9763435 6.54323129 12.8989626 6.91602041 12.8069558 7.20853741 12.5144388 7.50088435 12.2220918 7.66806122 11.4989626 7.6405102 11.1164796 7.58438776 10.3377381 7.69697279 9.34573129 7.20207483 8.52022109M12.2988776 6.3122449C11.8313605 6.09047619 11.2754082 6.14846939 10.8631633 6.46122449 10.03 7.09336735 9.58017007 7.92227891 9.68544218 9.06105442 9.7597619 9.86479592 9.88170068 10.7270408 10.5619728 11.2272109 11.402449 11.8452381 12.6782993 11.2168367 13.0376531 10.2719388 13.2078912 9.82380952 13.2228571 9.50493197 13.1946259 9.03180272 13.167415 8.57670068 13.1726871 8.17772109 13.192415 7.70612245 13.2196259 7.05238095 13.000068 6.64506803 12.2988776 6.3122449M17.2009524 8.12511905C16.9788435 7.9897449 16.6871769 8.01797619 16.5116667 8.20964286 16.1007823 8.65811224 15.5397279 9.95573129 15.3262925 10.3411054 14.8684694 11.1672959 14.7842857 11.8759694 15.1235714 12.8213776 15.4956803 13.8581122 16.4897279 13.7060714 17.2541837 13.1417857 18.117619 12.5043707 18.472381 11.4079422 18.4810544 10.4264796 18.4897279 9.45284014 18.3232313 8.80930272 17.2009524 8.12511905M22.2045068 12.5752041C21.944983 12.2107483 21.4541667 12.0957823 21.0834184 12.3462925 20.7045068 12.602415 20.4892007 13.0301361 20.2613095 13.4728231 19.8514456 14.2694218 18.9876701 14.9338776 19.1337585 15.9076871 19.2427721 16.6326871 20.0754252 17.1490136 20.8041667 16.9728231 21.6403912 16.7707823 22.2128401 15.9843878 22.3939626 15.2087075 22.5342687 14.6073469 22.7783163 13.3811565 22.2045068 12.5752041"
+          />
+          <g transform="translate(0 6.467)">
+            <mask id="icon---creature@2x-b" fill="#fff">
+              <use xlinkHref="#icon---creature@2x-a" />
+            </mask>
+            <path
+              fill={fillColor}
+              d="M0.118248299,4.57210884 C0.329302721,5.14693878 0.76042517,5.12636054 0.889506803,4.65697279 C0.985595238,4.30765306 0.894778912,3.66547619 0.894438776,3.31632653 C0.893928571,2.58911565 0.856343537,1.08809524 1.05991497,0.0576530612 C0.737295918,1.14336735 -0.358112245,2.91496599 0.118248299,4.57210884"
+              mask="url(#icon---creature@2x-b)"
+            />
+          </g>
+          <path
+            fill={fillColor}
+            d="M5.50229592 6.96736395C5.46641156 7.05767007 5.3087585 7.06073129 5.26164966 7.0112415 4.28664966 6.02858844 4.92848639 3.44916667 5.64294218 2.44406463 5.40705782 3.15835034 5.30331633 4.07569728 5.45501701 4.77586735 5.59685374 5.42926871 5.89821429 5.95392857 5.50229592 6.96736395M11.2848639.0000510204082C10.8857143 1.45736395 10.8472789 2.79086735 11.170068 4.26161565 11.3195578 4.94205782 11.7482993 5.25158163 11.9188776 4.42658163 12.0397959 3.84222789 12.155102 3.03406463 11.9782313 2.44784014 11.7782313 1.78491497 11.2440476 1.15770408 11.2848639.0000510204082M16.7684864 2.17357143C16.9451871 2.95095238 17.1309014 3.69108844 17.3089626 4.45792517 17.4805612 5.19704082 17.2638946 6.03122449 17.3888946 6.78173469 17.5552211 7.77833333 18.3593027 7.35146259 18.3936565 6.57391156 18.417466 6.03547619 18.2269898 5.11438776 18.0484184 4.59006803 17.8337925 4.0822449 17.4363435 3.32697279 16.7684864 2.17357143M21.0196769 7.70957483C21.3783503 8.5219898 21.5242687 8.9187585 21.4206973 9.60481293 21.3337925 10.1810034 21.1404252 10.775051 21.4215476 11.317568 21.4790306 11.4286224 21.6059014 11.4959694 21.7275 11.4668878 22.759983 11.2209694 21.9877041 9.05056122 21.0196769 7.70957483"
+          />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/CreaturesSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/menu/CreaturesSvg/index.ts
new file mode 100644
index 0000000..0bcca57
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/CreaturesSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../../hocs";
+import CreaturesSvg from "./CreaturesSvg";
+
+const LightCreaturesSvg = asLightSvg(CreaturesSvg);
+const DarkCreaturesSvg = asDarkSvg(CreaturesSvg);
+
+export default CreaturesSvg;
+export { CreaturesSvg, LightCreaturesSvg, DarkCreaturesSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/DescriptionSvg/DescriptionSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/menu/DescriptionSvg/DescriptionSvg.tsx
new file mode 100644
index 0000000..9bacab4
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/DescriptionSvg/DescriptionSvg.tsx
@@ -0,0 +1,58 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../../BaseSvg";
+
+export default class DescriptionSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor, secondaryFillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 139 136" className={className}>
+        <defs>
+          <polygon
+            id="icon---description-copy@2x-a"
+            points="0 .828 129.209 .828 129.209 125.717 0 125.717"
+          />
+          <polygon
+            id="icon---description-copy@2x-c"
+            points=".621 .796 81.849 .796 81.849 99.777 .621 99.777"
+          />
+        </defs>
+        <g fill="none" fillRule="evenodd" transform="translate(0 -1)">
+          <g transform="translate(0 10.483)">
+            <mask id="icon---description-copy@2x-b" fill="#fff">
+              <use xlinkHref="#icon---description-copy@2x-a" />
+            </mask>
+            <path
+              fill={fillColor}
+              d="M109.708992,79.00928 L110.400192,78.83648 C114.720192,77.73632 118.412352,78.25472 121.292352,80.32832 C126.821952,84.36608 126.873792,92.48768 126.361152,95.36768 C120.422592,96.68672 117.542592,96.34688 115.641792,95.59808 C117.029952,92.54528 117.893952,88.91648 116.511552,85.74848 C115.180992,82.80512 112.882752,80.50688 109.708992,79.00928 M17.093952,44.04608 C12.710592,44.21888 9.260352,43.06688 6.950592,40.47488 C2.521152,35.57888 2.751552,26.93888 3.033792,23.82848 C8.620992,23.76512 12.422592,25.66592 14.150592,26.76608 C12.249792,29.46752 11.564352,32.98688 12.313152,36.38528 C12.940992,39.37472 14.611392,41.96672 17.093952,44.04608 M122.668992,78.42752 C119.212992,75.89888 114.892992,75.26528 109.829952,76.52672 L100.320192,79.00928 L105.273792,80.04608 C109.651392,80.96768 112.819392,83.32928 114.322752,86.66432 C115.589952,89.54432 114.553152,92.94848 112.992192,95.53472 L112.421952,96.57728 L93.753792,103.77728 L108.211392,94.78592 C105.331392,93.23648 102.629952,90.98432 100.383552,87.64928 C96.121152,82.00448 95.660352,74.56832 96.691392,66.33728 C87.129792,74.33792 76.243392,82.69568 64.153152,91.04768 L44.050752,114.60608 L52.742592,89.02592 C52.972992,87.58592 56.832192,67.42592 65.932992,45.25568 C66.341952,44.21888 67.090752,43.40672 68.069952,42.88832 C67.781952,41.79392 67.891392,40.70528 68.300352,39.72608 C72.902592,29.29472 78.092352,20.31488 83.731392,12.76928 L73.081152,14.83712 L85.753152,10.23488 L95.481792,6.65792 C94.502592,5.73632 93.523392,4.93568 92.549952,4.29632 C83.270592,-1.80352 71.813952,1.99808 71.813952,1.99808 L0.441792,21.00608 L0.268992,22.15808 C0.211392,22.72832 -1.568448,35.34848 4.819392,42.37568 C7.762752,45.65888 11.909952,47.15648 17.203392,46.92608 L25.042752,45.65888 L22.450752,43.92512 C18.470592,42.14528 15.820992,39.26528 15.072192,35.74592 C14.444352,32.75648 15.250752,29.64608 17.260992,27.39392 L18.240192,26.35712 C21.523392,28.89728 23.833152,32.06528 25.382592,35.22752 L42.201792,33.32672 L26.880192,38.68928 C27.461952,40.35392 27.922752,41.91488 28.210752,43.29728 L43.699392,38.91392 L28.780992,46.97792 C29.011392,48.59648 29.011392,49.57568 29.011392,49.57568 C29.011392,65.46752 22.329792,74.74688 20.204352,91.21472 L40.531392,84.82688 L19.743552,95.24672 C19.570752,97.32608 19.513152,99.56672 19.513152,101.92832 C19.513152,111.43808 24.230592,125.71712 43.301952,125.71712 C61.042752,125.71712 120.192192,100.89728 128.083392,97.55648 L128.140992,97.55648 C128.492352,97.32608 128.780352,97.26848 128.889792,97.20512 L129.120192,96.22592 C129.183552,95.70752 130.272192,83.95712 122.668992,78.42752"
+              mask="url(#icon---description-copy@2x-b)"
+            />
+          </g>
+          <g transform="translate(56.84 .963)">
+            <mask id="icon---description-copy@2x-d" fill="#fff">
+              <use xlinkHref="#icon---description-copy@2x-c" />
+            </mask>
+            <path
+              fill={fillColor}
+              d="M73.467904,33.156672 L73.467904,33.208512 C67.949824,35.679552 61.573504,37.488192 55.243264,36.964032 C59.384704,39.394752 63.284224,41.059392 66.947584,42.297792 C63.670144,46.439232 59.666944,50.955072 54.817024,55.810752 C51.153664,55.338432 46.868224,54.048192 42.110464,51.525312 C44.155264,55.240512 47.110144,58.091712 50.203264,60.286272 C47.962624,62.475072 45.491584,64.709952 42.870784,67.042752 C40.111744,66.178752 37.444864,65.228352 35.405824,64.139712 C36.120064,66.564672 37.398784,68.707392 38.827264,70.469952 C29.357824,78.603072 16.127104,90.071232 2.187904,99.776832 C2.187904,99.684672 3.426304,97.829952 3.754624,97.357632 C3.800704,97.305792 3.800704,97.259712 3.852544,97.259712 C3.852544,97.207872 3.852544,97.207872 3.950464,97.207872 C23.695744,67.417152 57.673984,20.357952 74.994304,9.840192 C73.231744,10.462272 46.009984,20.928192 1.093504,99.114432 L0.995584,99.114432 C0.897664,99.298752 0.805504,99.684672 0.621184,99.776832 C0.621184,99.776832 4.324864,78.885312 13.465984,56.571072 C15.464704,58.379712 17.843584,60.142272 20.550784,61.611072 C18.845824,60.712512 17.181184,56.144832 15.793024,51.145152 C20.510464,40.679232 26.356864,30.155712 33.591424,21.452352 C35.590144,24.735552 38.349184,27.874752 42.254464,29.971392 C40.347904,28.116672 40.163584,20.830272 40.399744,14.223552 C43.867264,11.032512 47.582464,8.273472 51.625984,6.084672 C52.340224,8.987712 53.670784,12.172992 55.767424,15.698112 C55.295104,10.842432 56.723584,6.510912 58.952704,2.847552 C65.236864,0.802752 72.183424,0.180672 79.705984,1.465152 C79.705984,1.465152 87.464704,11.130432 73.467904,33.156672"
+              mask="url(#icon---description-copy@2x-d)"
+            />
+          </g>
+          <path
+            fill={fillColor}
+            d="M60.68736,98.2112 C53.32032,109.33376 47.90016,117.98528 46.09152,121.38368 C50.1408,113.78048 54.06912,106.71296 57.85344,100.10048 L57.9168,100.07744 C58.84992,99.44384 59.78304,98.81024 60.68736,98.2112"
+          />
+          <path
+            fill={fillColor}
+            d="M75.68352,73.702976 C70.07904,81.150656 60.21216,96.420416 57.91392,100.078016 L60.68448,98.211776 L75.68352,73.702976 Z"
+          />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/DescriptionSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/menu/DescriptionSvg/index.ts
new file mode 100644
index 0000000..b54ee0b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/DescriptionSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../../hocs";
+import DescriptionSvg from "./DescriptionSvg";
+
+const LightDescriptionSvg = asLightSvg(DescriptionSvg);
+const DarkDescriptionSvg = asDarkSvg(DescriptionSvg);
+
+export default DescriptionSvg;
+export { DescriptionSvg, LightDescriptionSvg, DarkDescriptionSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/EquipmentSvg/EquipmentSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/menu/EquipmentSvg/EquipmentSvg.tsx
new file mode 100644
index 0000000..0cbb1b8
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/EquipmentSvg/EquipmentSvg.tsx
@@ -0,0 +1,68 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../../BaseSvg";
+
+export default class EquipmentSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 172 135" className={className}>
+        <defs>
+          <polygon
+            id="icon---equipment-copy@2x-a"
+            points="0 .614 77.491 .614 77.491 134.399 0 134.399"
+          />
+        </defs>
+        <g fill="none" fillRule="evenodd">
+          <path
+            fill={fillColor}
+            d="M9.023232 60.475968L8.984832 61.704768 8.984832 61.935168 40.434432 63.509568 67.237632 64.815168 67.237632 60.475968C67.237632 60.130368 67.237632 59.784768 67.199232 59.435328L58.063872 54.907968 66.124032 49.493568C62.706432 29.909568 51.378432 15.317568 38.360832 15.163968L38.130432 15.163968C27.032832 15.163968 17.202432 25.570368 12.325632 40.661568L31.141632 42.888768 11.404032 43.810368C9.983232 48.955968 9.176832 54.600768 9.023232 60.475968M171.2256 59.3232C170.6496 38.5872 161.2416 20.7312 147.7248 11.976 156.5952 23.496 162.3552 40.5456 162.7776 59.9376L162.7776 64.008 171.264 63.8928 171.264 59.3232 171.2256 59.3232z"
+          />
+          <polygon
+            fill={fillColor}
+            points="162.777 103.714 162.815 127.752 162.815 129.365 171.263 128.866 171.263 67.733 162.777 67.848"
+          />
+          <g transform="translate(0 .226)">
+            <mask id="icon---equipment-copy@2x-b" fill="#fff">
+              <use xlinkHref="#icon---equipment-copy@2x-a" />
+            </mask>
+            <path
+              fill={fillColor}
+              d="M44.2752,0.959232 L40.704,0.767232 L40.6272,0.767232 L38.1312,0.613632 C17.5488,0.613632 0.768,26.341632 0.0384,58.559232 L0,58.559232 L0,126.412032 L76.2624,134.399232 L77.4912,134.322432 L77.4912,127.064832 L77.4912,68.696832 L76.2624,68.696832 L73.4208,68.735232 L71.1168,68.620032 L71.1168,124.108032 L70.4256,124.031232 L68.4672,123.839232 L5.1456,117.234432 L5.2608,58.290432 C6.4896,31.679232 20.6976,11.096832 38.1312,11.096832 L38.208,11.096832 C54.1056,11.135232 67.3536,28.338432 70.4256,51.608832 C70.7328,53.797632 70.9248,56.024832 71.04,58.290432 L71.1168,58.290432 L71.1168,64.780032 L73.4976,64.895232 L76.2624,64.856832 L77.4912,64.856832 L77.4912,59.749632 C77.2224,47.500032 74.6112,36.133632 70.4256,26.687232 C64.3584,13.016832 54.9504,3.340032 44.2752,0.959232"
+              mask="url(#icon---equipment-copy@2x-b)"
+            />
+          </g>
+          <path
+            fill={fillColor}
+            d="M131.520768,74.9136 C134.554368,74.9136 136.973568,77.3712 136.973568,80.4048 C136.973568,82.2096 136.086528,83.8224 134.707968,84.8208 L134.707968,91.9248 L128.099328,92.5776 L128.099328,84.6288 C126.874368,83.6304 126.067968,82.0944 126.067968,80.4048 C126.067968,77.3712 128.487168,74.9136 131.520768,74.9136 Z M144.269568,98.3376 L144.269568,69 L116.045568,69.4224 L116.045568,100.0656 L144.269568,98.3376 Z"
+          />
+          <polygon
+            fill={fillColor}
+            points="67.276 102.791 67.237 68.654 40.588 67.348 8.984 65.774 8.984 87.124 31.141 90.618 8.984 93.114 8.984 95.457 23.768 96.302 8.984 99.45 8.984 114.004 65.356 119.879 67.276 120.071 67.276 108.782 56.101 107.322 56.101 107.284 38.13 104.942 53.528 103.828"
+          />
+          <polygon
+            fill={fillColor}
+            points="158.937 92.04 158.937 91.464 158.937 67.886 150.758 68.002 148.112 68.002 148.112 101.986 112.204 104.136 112.204 68.462 108.786 68.501 93.81 68.693 93.81 83.323 103.986 84.59 93.81 85.819 93.81 114.235 108.825 116.462 108.825 116.539 93.81 117.998 93.81 118.536 93.81 120.494 100.377 120.878 93.81 122.837 93.81 129.941 93.81 133.55 158.975 129.595 158.975 127.214 158.975 114.926 150.335 113.851 158.975 110.357"
+          />
+          <path
+            fill={fillColor}
+            d="M88.283136,44.077248 C85.322496,29.062848 78.794496,16.429248 70.427136,8.749248 C67.163136,5.715648 63.588096,3.450048 59.828736,2.106048 L55.562496,1.875648 C61.249536,5.562048 66.314496,11.168448 70.427136,18.157248 C76.874496,29.216448 80.948736,43.808448 81.328896,59.936448 L81.328896,65.005248 L86.128896,64.966848 L89.968896,64.928448 L89.968896,59.974848 C89.853696,54.483648 89.243136,49.184448 88.283136,44.115648 L88.283136,44.077248 Z"
+          />
+          <path
+            fill={fillColor}
+            d="M93.810816,64.852416 L108.786816,64.660416 L149.375616,64.161216 L158.937216,64.046016 L158.937216,59.975616 C158.860416,55.905216 158.476416,51.911616 157.900416,48.071616 L143.692416,48.263616 L143.500416,47.687616 L157.405056,44.961216 C157.251456,44.193216 157.094016,43.386816 156.902016,42.618816 L148.492416,41.658816 L156.210816,39.623616 C152.758656,25.799616 146.226816,14.356416 138.051456,7.521216 C135.052416,6.638016 131.942016,6.177216 128.716416,6.177216 L90.051456,3.911616 L90.009216,3.911616 L70.425216,2.759616 L69.238656,2.682816 C69.657216,2.951616 70.045056,3.258816 70.425216,3.566016 C77.682816,9.095616 83.711616,17.774016 87.858816,28.449216 L94.310016,28.871616 L104.758656,29.524416 L116.390016,30.254016 L105.330816,31.329216 L92.390016,32.596416 L89.433216,32.865216 C89.817216,34.170816 90.239616,35.476416 90.585216,36.820416 C92.505216,43.962816 93.618816,51.758016 93.810816,59.937216 L93.810816,64.852416 Z"
+          />
+          <polygon
+            fill={fillColor}
+            points="81.331 68.846 81.331 127.905 81.331 134.318 89.971 133.78 89.971 129.288 89.971 117.998 89.971 68.769 86.131 68.808"
+          />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/EquipmentSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/menu/EquipmentSvg/index.ts
new file mode 100644
index 0000000..d85fcc9
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/EquipmentSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../../hocs";
+import EquipmentSvg from "./EquipmentSvg";
+
+const LightEquipmentSvg = asLightSvg(EquipmentSvg);
+const DarkEquipmentSvg = asDarkSvg(EquipmentSvg);
+
+export default EquipmentSvg;
+export { EquipmentSvg, LightEquipmentSvg, DarkEquipmentSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/ExtrasSvg/ExtrasSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ExtrasSvg/ExtrasSvg.tsx
new file mode 100644
index 0000000..bd5781a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ExtrasSvg/ExtrasSvg.tsx
@@ -0,0 +1,21 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../../BaseSvg";
+
+export default class ExtrasSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 21.41 4.34" className={className}>
+        <circle fill={fillColor} cx="10.7" cy="2.17" r="2.17" />
+        <circle fill={fillColor} cx="2.17" cy="2.17" r="2.17" />
+        <circle fill={fillColor} cx="19.24" cy="2.17" r="2.17" />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/ExtrasSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ExtrasSvg/index.ts
new file mode 100644
index 0000000..b6cd111
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ExtrasSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../../hocs";
+import ExtrasSvg from "./ExtrasSvg";
+
+const LightExtrasSvg = asLightSvg(ExtrasSvg);
+const DarkExtrasSvg = asDarkSvg(ExtrasSvg);
+
+export default ExtrasSvg;
+export { ExtrasSvg, LightExtrasSvg, DarkExtrasSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/FeaturesSvg/FeaturesSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/menu/FeaturesSvg/FeaturesSvg.tsx
new file mode 100644
index 0000000..3ad29ca
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/FeaturesSvg/FeaturesSvg.tsx
@@ -0,0 +1,25 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../../BaseSvg";
+
+export default class FeaturesSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 139 139" className={className}>
+        <g fill={fillColor} fillRule="evenodd" transform="translate(.353)">
+          <path
+            fillRule="nonzero"
+            d="M127.527552,75.108096 C127.354752,77.129856 127.066752,79.082496 126.605952,80.989056 C126.433152,81.910656 126.202752,82.889856 125.972352,83.811456 C125.511552,85.712256 124.935552,87.492096 124.244352,89.341056 C123.898752,90.199296 123.553152,91.120896 123.207552,91.990656 C122.861952,92.848896 122.458752,93.712896 122.055552,94.582656 C120.557952,97.629696 118.829952,100.509696 116.929152,103.222656 C116.122752,104.311296 115.316352,105.411456 114.452352,106.442496 L114.394752,106.500096 C111.975552,109.443456 109.325952,112.093056 106.388352,114.448896 C105.121152,115.491456 103.796352,116.470656 102.471552,117.392256 C99.764352,119.293056 96.884352,120.963456 93.889152,122.340096 C92.391552,123.031296 90.893952,123.670656 89.338752,124.240896 C83.002752,126.550656 76.205952,127.812096 69.121152,127.812096 C62.036352,127.812096 55.239552,126.550656 48.961152,124.240896 C47.405952,123.670656 45.908352,123.031296 44.410752,122.340096 C41.415552,120.900096 38.535552,119.293056 35.828352,117.392256 C35.194752,116.931456 34.561152,116.470656 33.927552,115.952256 C33.236352,115.549056 32.602752,115.030656 31.969152,114.448896 C30.471552,113.302656 29.089152,112.029696 27.764352,110.653056 C27.073152,110.019456 26.381952,109.380096 25.805952,108.631296 C25.114752,107.940096 24.538752,107.248896 23.905152,106.500096 L23.847552,106.442496 C22.983552,105.411456 22.177152,104.311296 21.370752,103.222656 C18.721152,99.530496 16.532352,95.498496 14.804352,91.241856 C14.458752,90.372096 14.113152,89.508096 13.825152,88.649856 C13.364352,87.319296 12.903552,85.942656 12.557952,84.560256 C12.212352,83.229696 11.866752,81.910656 11.636352,80.522496 C11.405952,79.600896 11.233152,78.679296 11.117952,77.763456 C11.002752,76.841856 10.887552,75.862656 10.772352,74.941056 C10.657152,74.192256 10.599552,73.380096 10.599552,72.579456 C10.541952,72.170496 10.541952,71.773056 10.541952,71.369856 C10.426752,70.621056 10.426752,69.872256 10.426752,69.123456 C10.426752,67.971456 10.484352,66.819456 10.599552,65.719296 C10.599552,64.573056 10.657152,63.472896 10.887552,62.378496 C11.060352,60.189696 11.405952,58.000896 11.981952,55.869696 C12.154752,54.948096 12.385152,54.032256 12.673152,53.162496 C13.594752,49.879296 14.804352,46.711296 16.244352,43.721856 C17.050752,41.988096 17.972352,40.323456 18.951552,38.710656 C19.930752,37.092096 20.967552,35.542656 22.119552,34.039296 C32.833152,19.702656 49.882752,10.429056 69.121152,10.429056 C88.359552,10.429056 105.466752,19.702656 116.180352,34.039296 C117.332352,35.542656 118.369152,37.092096 119.348352,38.710656 C120.327552,40.323456 121.249152,41.988096 122.055552,43.721856 C123.495552,46.711296 124.705152,49.879296 125.626752,53.162496 C125.914752,54.032256 126.145152,54.948096 126.317952,55.869696 C126.893952,58.000896 127.239552,60.189696 127.412352,62.378496 C127.642752,63.472896 127.700352,64.573056 127.700352,65.719296 C127.815552,66.819456 127.873152,67.971456 127.873152,69.123456 C127.873152,70.160256 127.873152,71.139456 127.757952,72.170496 C127.757952,73.149696 127.642752,74.128896 127.527552,75.108096 M69.121152,0.003456 C31.047552,0.003456 0.001152,30.992256 0.001152,69.123456 C0.001152,87.209856 7.028352,103.620096 18.433152,115.952256 C18.663552,116.240256 18.893952,116.522496 19.181952,116.752896 C31.796352,129.949056 49.479552,138.243456 69.121152,138.243456 C88.877952,138.243456 106.676352,129.891456 119.290752,116.580096 C119.405952,116.413056 119.521152,116.292096 119.636352,116.119296 C131.156352,103.792896 138.241152,87.261696 138.241152,69.123456 C138.241152,30.992256 107.252352,0.003456 69.121152,0.003456"
+          />
+          <path d="M114.393024,106.500672 C111.973824,109.444032 109.324224,112.093632 106.386624,114.449472 C99.589824,111.799872 92.044224,109.611072 87.378624,108.228672 C84.441024,107.364672 83.404224,107.082432 82.655424,106.731072 C80.581824,105.809472 79.084224,104.202432 78.450624,102.065472 C77.183424,97.745472 79.775424,92.964672 82.713024,88.471872 L83.173824,87.780672 C85.132224,84.785472 85.535424,84.272832 86.111424,81.329472 C86.514624,79.083072 88.185024,75.454272 90.316224,73.150272 C91.180224,71.710272 92.159424,67.563072 91.871424,66.065472 C91.065024,64.395072 89.740224,61.630272 89.970624,58.583232 C90.316224,54.142272 89.855424,49.943232 88.703424,46.308672 C87.436224,42.161472 83.289024,38.192832 78.450624,36.401472 C75.109824,35.191872 71.999424,35.082432 69.177024,35.082432 C66.239424,35.082432 63.186624,35.191872 59.788224,36.401472 C55.007424,38.192832 50.860224,42.161472 49.535424,46.308672 C48.383424,49.943232 47.980224,54.032832 48.268224,58.635072 C48.556224,61.803072 47.058624,64.804032 46.425024,66.065472 C46.137024,67.505472 47.116224,71.710272 47.922624,73.150272 C50.053824,75.454272 51.666624,78.973632 52.185024,81.214272 C52.761024,84.209472 53.106624,84.785472 55.065024,87.780672 L55.468224,88.299072 C58.521024,92.964672 61.113024,97.745472 59.845824,102.065472 C59.212224,104.202432 57.714624,105.809472 55.641024,106.731072 C54.892224,107.082432 53.855424,107.364672 50.917824,108.228672 C48.037824,109.092672 44.005824,110.244672 39.801024,111.684672 C38.937024,111.972672 38.073024,112.260672 37.209024,112.548672 C36.575424,112.721472 35.941824,112.951872 35.365824,113.182272 C34.213824,113.585472 33.119424,113.988672 32.025024,114.391872 C30.585024,113.182272 29.145024,111.972672 27.762624,110.653632 C27.129024,110.014272 26.437824,109.323072 25.804224,108.631872 C25.113024,107.940672 24.537024,107.249472 23.903424,106.500672 C32.140224,102.871872 42.220224,99.934272 47.980224,98.263872 C48.383424,98.148672 48.729024,98.033472 49.074624,97.924032 C48.671424,97.054272 47.980224,95.902272 46.885824,94.231872 L46.425024,93.483072 C44.178624,90.142272 42.969024,88.241472 41.989824,83.345472 C41.874624,82.711872 40.953024,80.868672 40.261824,80.183232 C37.554624,77.355072 34.732224,68.139072 36.575424,62.609472 C36.690624,62.379072 36.805824,61.981632 37.093824,61.463232 C37.727424,60.132672 37.900224,59.562432 37.900224,59.332032 C37.497024,53.451072 38.073024,48.042432 39.628224,43.204032 C41.932224,35.883072 48.268224,29.552832 56.217024,26.672832 C60.997824,24.939072 65.202624,24.708672 69.119424,24.708672 C73.036224,24.708672 77.298624,24.939072 82.021824,26.672832 C90.028224,29.604672 96.364224,35.940672 98.668224,43.204032 C100.223424,48.094272 100.799424,53.508672 100.338624,59.332032 C100.396224,59.614272 100.684224,60.363072 101.202624,61.463232 C101.490624,62.033472 101.663424,62.442432 101.721024,62.672832 C103.564224,68.202432 100.741824,77.355072 97.977024,80.183232 C97.343424,80.868672 96.421824,82.654272 96.306624,83.345472 C95.327424,88.241472 94.117824,90.142272 91.871424,93.483072 L91.525824,94.001472 C90.373824,95.792832 89.682624,97.054272 89.221824,97.924032 C89.567424,98.033472 89.913024,98.148672 90.316224,98.263872 C96.076224,99.934272 106.156224,102.871872 114.393024,106.500672" />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/FeaturesSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/menu/FeaturesSvg/index.ts
new file mode 100644
index 0000000..edf3783
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/FeaturesSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../../hocs";
+import FeaturesSvg from "./FeaturesSvg";
+
+const LightFeaturesSvg = asLightSvg(FeaturesSvg);
+const DarkFeaturesSvg = asDarkSvg(FeaturesSvg);
+
+export default FeaturesSvg;
+export { FeaturesSvg, LightFeaturesSvg, DarkFeaturesSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/NotesSvg/NotesSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/menu/NotesSvg/NotesSvg.tsx
new file mode 100644
index 0000000..cb194df
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/NotesSvg/NotesSvg.tsx
@@ -0,0 +1,22 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../../BaseSvg";
+
+export default class NotesSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 157 143" className={className}>
+        <g fill={fillColor} transform="translate(.76)">
+          <polygon points="142.167 41.629 142.167 100.538 69.905 100.538 50.269 117.033 104.465 117.033 132.742 142.167 132.742 117.033 155.52 117.033 155.52 41.629" />
+          <path d="M22.7781818,120.174545 L22.7781818,87.9709091 L0,87.9709091 L0,0 L128.029091,0 L128.029091,87.9709091 L58.9090909,87.9709091 L22.7781818,120.174545 Z M11.7818182,76.1890909 L34.56,76.1890909 L34.56,94.2545455 L54.9818182,76.1890909 L117.032727,76.1890909 L117.032727,11.7818182 L12.5672727,11.7818182 L12.5672727,76.1890909 L11.7818182,76.1890909 Z" />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/NotesSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/menu/NotesSvg/index.ts
new file mode 100644
index 0000000..222fb8c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/NotesSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../../hocs";
+import NotesSvg from "./NotesSvg";
+
+const LightNotesSvg = asLightSvg(NotesSvg);
+const DarkNotesSvg = asDarkSvg(NotesSvg);
+
+export default NotesSvg;
+export { NotesSvg, LightNotesSvg, DarkNotesSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/ProficienciesSvg/ProficienciesSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ProficienciesSvg/ProficienciesSvg.tsx
new file mode 100644
index 0000000..a92dd2d
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ProficienciesSvg/ProficienciesSvg.tsx
@@ -0,0 +1,52 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../../BaseSvg";
+
+export default class ProficienciesSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 145 144" className={className}>
+        <defs>
+          <polygon
+            id="icon---prof@2x-a"
+            points=".789 .79 42.018 .79 42.018 41.998 .789 41.998"
+          />
+          <polygon
+            id="icon---prof@2x-c"
+            points="0 0 124.418 0 124.418 124.416 0 124.416"
+          />
+        </defs>
+        <g fill="none" fillRule="evenodd">
+          <g transform="translate(102 102)">
+            <mask id="icon---prof@2x-b" fill="#fff">
+              <use xlinkHref="#icon---prof@2x-a" />
+            </mask>
+            <path
+              fill={fillColor}
+              d="M38.571,38.5722 C36.315,40.8342 33.273,41.9982 30.315,41.9982 C27.357,41.9982 24.315,40.8342 22.059,38.5722 L0.789,17.3082 C7.185,12.7902 12.789,7.1802 17.307,0.7902 L38.571,22.0602 C43.173,26.6562 43.173,33.9762 38.571,38.5722"
+              mask="url(#icon---prof@2x-b)"
+            />
+          </g>
+          <path
+            fill={fillColor}
+            d="M66.1038 73.8924L58.3098 73.8924 52.4478 38.6784C51.4398 32.6484 56.0898 27.1524 62.2098 27.1524 68.3238 27.1524 72.9798 32.6484 71.9718 38.6784L66.1038 73.8924zM70.0008 89.4726C70.0008 93.7746 66.5088 97.2606 62.2068 97.2606 57.9048 97.2606 54.4188 93.7746 54.4188 89.4726 54.4188 85.1706 57.9048 81.6786 62.2068 81.6786 66.5088 81.6786 70.0008 85.1706 70.0008 89.4726"
+          />
+          <mask id="icon---prof@2x-d" fill="#fff">
+            <use xlinkHref="#icon---prof@2x-c" />
+          </mask>
+          <path
+            fill={fillColor}
+            d="M108.6198,62.25 C108.6198,87.762 87.7578,108.618 62.1678,108.618 C36.6558,108.618 15.7998,87.762 15.7998,62.25 C15.7998,36.654 36.6558,15.798 62.1678,15.798 C87.7578,15.798 108.6198,36.654 108.6198,62.25 M62.1678,0 C27.8838,0 -0.0042,27.882 -0.0042,62.166 C-0.0042,96.534 27.8838,124.416 62.1678,124.416 C96.5298,124.416 124.4178,96.534 124.4178,62.166 C124.4178,27.882 96.5298,0 62.1678,0"
+            mask="url(#icon---prof@2x-d)"
+          />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/ProficienciesSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ProficienciesSvg/index.ts
new file mode 100644
index 0000000..7c2b376
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/ProficienciesSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../../hocs";
+import ProficienciesSvg from "./ProficienciesSvg";
+
+const LightProficienciesSvg = asLightSvg(ProficienciesSvg);
+const DarkProficienciesSvg = asDarkSvg(ProficienciesSvg);
+
+export default ProficienciesSvg;
+export { ProficienciesSvg, LightProficienciesSvg, DarkProficienciesSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/SkillsSvg/SkillsSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/menu/SkillsSvg/SkillsSvg.tsx
new file mode 100644
index 0000000..f9ef851
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/SkillsSvg/SkillsSvg.tsx
@@ -0,0 +1,23 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../../BaseSvg";
+
+export default class SkillsSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 146 144" className={className}>
+        <g fill={fillColor}>
+          <polygon points="70.124 83.965 64.12 107.979 40.107 113.983 64.12 119.986 70.124 144 76.127 119.986 100.141 113.983 76.127 107.979" />
+          <polygon points="112.148 20.442 120.525 45.571 145.654 53.948 120.525 62.324 112.148 87.454 103.772 62.324 78.642 53.948 103.772 45.571" />
+          <path d="M27.7357796,31.981862 L37.104806,0.751773927 L46.4738324,31.981862 L73.3633378,41.940938 L46.4738324,51.9000141 L37.104806,83.1301022 L27.7357796,51.9000141 L0.846274211,41.940938 L27.7357796,31.981862 Z M37.104806,23.0953598 L32.9660154,36.8913285 L19.3320697,41.940938 L32.9660154,46.9905476 L37.104806,60.7865163 L41.2435966,46.9905476 L54.8775423,41.940938 L41.2435966,36.8913285 L37.104806,23.0953598 Z" />
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/SkillsSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/menu/SkillsSvg/index.ts
new file mode 100644
index 0000000..a9d04eb
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/SkillsSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../../hocs";
+import SkillsSvg from "./SkillsSvg";
+
+const LightSkillsSvg = asLightSvg(SkillsSvg);
+const DarkSkillsSvg = asDarkSvg(SkillsSvg);
+
+export default SkillsSvg;
+export { SkillsSvg, LightSkillsSvg, DarkSkillsSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/SpellsSvg/SpellsSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/menu/SpellsSvg/SpellsSvg.tsx
new file mode 100644
index 0000000..85d96a0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/SpellsSvg/SpellsSvg.tsx
@@ -0,0 +1,50 @@
+import * as React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../../BaseSvg";
+
+export default class SpellsSvg extends React.PureComponent<BaseSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 102 139" className={className}>
+        <defs>
+          <polygon
+            id="icon---spells-copy@2x-a"
+            points="0 .146 101.843 .146 101.843 105.6 0 105.6"
+          />
+          <polygon
+            id="icon---spells-copy@2x-c"
+            points=".774 .803 94.086 .803 94.086 68.055 .774 68.055"
+          />
+        </defs>
+        <g fill="none" fillRule="evenodd" transform="translate(0 -1)">
+          <g transform="translate(0 33.598)">
+            <mask id="icon---spells-copy@2x-b" fill="#fff">
+              <use xlinkHref="#icon---spells-copy@2x-a" />
+            </mask>
+            <path
+              fill={fillColor}
+              d="M100.96928,73.6752 C92.78688,61.0512 100.36768,53.1216 99.41728,45.7808 C99.03648,42.8784 96.75168,38.5104 94.02528,34.1168 C94.02528,34.1168 94.02208,34.1136 94.02208,34.1136 C89.85248,27.4 84.64928,20.6352 83.59968,18.9904 C80.55008,14.2064 81.39488,11.096 78.54688,9.8192 C75.70208,8.5424 72.35488,16.424 72.58208,20.2608 C72.95328,26.5136 77.99968,33.7264 78.82848,35.4736 C79.66048,37.2208 79.57088,39.7008 78.19168,43.5664 C76.81248,47.4352 73.03008,46.8144 68.23328,44.712 C63.43328,42.6064 53.87808,34.5776 48.87648,28.9648 C43.87488,23.3552 36.01888,7.2144 34.93728,4.3216 C33.85568,1.4256 29.56448,-3.6496 27.45888,4.8016 C25.20928,13.8384 33.11648,27.976 38.06688,34.0976 C43.02048,40.2192 41.92608,43.2816 40.68128,44.5552 C39.43648,45.8288 32.57248,42.1072 28.39008,38.6384 C24.21408,35.1696 18.43808,25.0544 16.38368,21.5472 C14.33248,18.0432 10.11488,15.4224 8.66528,15.0384 C8.47328,14.9872 8.23008,14.9616 7.96768,14.9584 C7.94848,14.9552 7.93248,14.952 7.91328,14.952 C7.88448,14.952 7.84608,14.9648 7.81728,14.968 C7.45568,14.9744 7.06528,15.0352 6.66848,15.1504 C6.63008,15.1632 6.59168,15.1664 6.55008,15.1824 C6.13408,15.3168 5.74368,15.5344 5.38848,15.816 C5.35328,15.8448 5.30848,15.8512 5.27968,15.8768 C5.28288,15.8864 5.28288,15.896 5.28608,15.9056 C4.48928,16.6 3.97088,17.7008 4.32608,19.4352 C5.15168,23.4256 14.12128,42.7376 15.23488,44.0592 C16.35168,45.3808 30.31008,55.5024 30.32608,56.568 C30.34528,57.6304 30.92768,56.9776 26.41568,54.4432 C21.90368,51.912 12.47328,44.3952 11.06528,42.0432 C9.65728,39.6944 6.79008,35.5024 5.74368,34.7344 C4.69728,33.9632 2.32928,32.4592 0.54688,34.8624 C-1.23232,37.2688 1.75968,42.9552 3.36928,45.1152 C4.97568,47.272 8.98208,54.44 11.72128,57.1344 C14.46048,59.8256 26.90208,68.0272 28.46368,68.8464 C30.01888,69.6656 32.87648,70.4496 32.53408,71.7808 C32.19168,73.112 25.17728,68.5936 22.95328,67.8 C20.72608,67.0064 13.90688,60.8112 12.62688,59.96 C11.34368,59.1088 9.23808,60.1488 8.07648,61.1888 C6.91168,62.2256 8.51168,64.7792 13.00448,70.3408 C17.49408,75.9024 40.57888,86.3696 44.24288,87.9408 C47.91328,89.512 62.86048,100.0624 71.43968,105.0256 C79.76608,109.8416 107.04608,83.0544 100.96928,73.6752"
+              mask="url(#icon---spells-copy@2x-b)"
+            />
+          </g>
+          <g transform="translate(4.2 .398)">
+            <mask id="icon---spells-copy@2x-d" fill="#fff">
+              <use xlinkHref="#icon---spells-copy@2x-c" />
+            </mask>
+            <path
+              fill={fillColor}
+              d="M5.0128,45.11136 C4.9456,42.25696 5.2848,39.31616 6.2448,36.36256 C7.8384,39.64256 10.1328,43.85056 12.2192,45.77696 L16.8656,50.06816 L15.672,43.85376 C15.6336,43.66176 12.4784,26.45536 22.5584,16.42336 C21.9952,20.38816 21.9952,25.39616 24.7344,28.23136 L25.3392,28.85216 L26.2032,28.86176 C26.6064,28.88416 35.88,28.89376 40.8048,22.23776 C43.6112,18.44256 44.3792,13.37696 43.0992,7.14016 C45.1248,8.25376 47.5696,10.11296 49.1248,13.05696 C51.4864,17.51776 51.3168,23.37376 48.6192,30.45856 C46.8752,35.04096 47.192,39.24576 49.4864,42.00096 C51.1408,43.97856 53.5696,44.88096 55.9696,44.44256 C58.5168,43.96576 60.5296,42.07456 61.4864,39.25216 C61.9184,37.98176 62.024,36.17376 62.1616,33.88256 C62.4208,29.44096 62.7792,23.38016 65.7712,19.07936 C64.664,23.93056 64.3312,30.36896 68.2832,35.15296 L71.0992,38.56096 L71.9312,34.21856 C71.9376,34.17696 72.568,31.01536 74.728,28.54816 C75.0032,33.19456 76.7504,40.79136 83.992,48.74976 C87.208,52.28256 88.9168,56.69856 89.5728,61.07936 C91.2048,63.49536 92.6928,65.83456 93.9856,68.05536 C94.5616,60.68256 92.7248,52.17056 87.0672,45.94976 C77.1056,35.00256 78.936,25.20416 79.016,24.80416 L79.8448,20.90656 L76.1712,22.45536 C72.904,23.83776 70.856,26.40736 69.6112,28.71776 C67.9344,22.21856 71.8352,14.05856 71.88,13.95936 L74.3088,8.96736 L69.2016,11.13376 C59.08,15.42816 58.4112,26.82656 58.0112,33.63936 C57.8992,35.45696 57.8,37.17536 57.5504,37.91136 C57.08,39.29056 56.2512,40.15776 55.2112,40.34976 C54.2992,40.51296 53.3552,40.14176 52.68,39.33536 C51.3776,37.77056 51.3136,35.07616 52.5072,31.94016 C55.6592,23.65536 55.7488,16.63136 52.776,11.06016 C48.8016,3.61056 40.8304,1.70016 40.4944,1.62336 L36.9392,0.80096 L38.0464,4.28256 C40.216,11.07616 40.0208,16.27936 37.4736,19.74496 C34.616,23.62976 29.384,24.47136 27.2208,24.65376 C25.6336,21.81856 26.6736,15.54656 27.8096,11.94336 L29.4384,6.79776 L24.7792,9.51776 C13.3712,16.18016 11.0992,28.38816 10.984,36.51616 C9.7392,34.11936 8.648,31.70016 8.104,30.39776 L6.408,26.34016 L4.3472,30.22816 C1.5888,35.44096 0.6384,40.64096 0.7888,45.55936 C1.6912,45.17536 2.6832,44.95136 3.7136,44.95136 C4.1744,44.95136 4.6,45.02496 5.0128,45.11136"
+              mask="url(#icon---spells-copy@2x-d)"
+            />
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/menu/SpellsSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/menu/SpellsSvg/index.ts
new file mode 100644
index 0000000..65996da
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/menu/SpellsSvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asLightSvg } from "../../../hocs";
+import SpellsSvg from "./SpellsSvg";
+
+const LightSpellsSvg = asLightSvg(SpellsSvg);
+const DarkSpellsSvg = asDarkSvg(SpellsSvg);
+
+export default SpellsSvg;
+export { SpellsSvg, LightSpellsSvg, DarkSpellsSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyDoubleSvg/ProficiencyDoubleSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyDoubleSvg/ProficiencyDoubleSvg.tsx
new file mode 100644
index 0000000..eb8cc67
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyDoubleSvg/ProficiencyDoubleSvg.tsx
@@ -0,0 +1,43 @@
+import React from "react";
+
+import BaseSvg from "../../../BaseSvg";
+import { InjectedSvgProps } from "../../../hocs";
+
+export default class ProficiencyDoubleSvg extends React.PureComponent<InjectedSvgProps> {
+  static defaultProps = {
+    fillColor: "#383838",
+    secondaryFillColor: "#999",
+  };
+
+  render() {
+    const { fillColor, secondaryFillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-proficiency-half-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 17 17">
+        <g
+          id="ProficiencyDoubleSvg-14be38f8-41fa-4aaa-a375-bf5579c9481f"
+          data-name="Layer 2"
+        >
+          <g
+            id="ProficiencyDoubleSvg-a914e018-db39-4f0d-b4c9-818c43e09af7"
+            data-name="v1"
+          >
+            <g>
+              <path
+                fill={secondaryFillColor}
+                d="M8.5,0A8.5,8.5,0,1,0,17,8.5,8.49382,8.49382,0,0,0,8.5,0Zm0,15.00854A6.50854,6.50854,0,1,1,15.00854,8.5,6.509,6.509,0,0,1,8.5,15.00854Z"
+              />
+              <circle fill={fillColor} cx="8.5" cy="8.5" r="4.25" />
+            </g>
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyDoubleSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyDoubleSvg/index.ts
new file mode 100644
index 0000000..f31baca
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyDoubleSvg/index.ts
@@ -0,0 +1,12 @@
+import { asDarkSvg, asModifiedSvg } from "../../../hocs";
+import ProficiencyDoubleSvg from "./ProficiencyDoubleSvg";
+
+const ModifiedProficiencyDoubleSvg = asModifiedSvg(ProficiencyDoubleSvg);
+const DarkProficiencyDoubleSvg = asDarkSvg(ProficiencyDoubleSvg);
+
+export default ProficiencyDoubleSvg;
+export {
+  ProficiencyDoubleSvg,
+  DarkProficiencyDoubleSvg,
+  ModifiedProficiencyDoubleSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyHalfSvg/ProficiencyHalfSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyHalfSvg/ProficiencyHalfSvg.tsx
new file mode 100644
index 0000000..a12d507
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyHalfSvg/ProficiencyHalfSvg.tsx
@@ -0,0 +1,40 @@
+import React from "react";
+
+import BaseSvg from "../../../BaseSvg";
+import { InjectedSvgProps } from "../../../hocs";
+
+export default class ProficiencyHalfSvg extends React.PureComponent<InjectedSvgProps> {
+  static defaultProps = {
+    fillColor: "#383838",
+    secondaryFillColor: "#383838",
+  };
+
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-proficiency-half-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 9.99416 9.99417">
+        <g
+          id="ProficiencyHalfSvg-abf3f72b-e5c8-4f0a-8c7d-3fb19641922a"
+          data-name="Layer 2"
+        >
+          <g
+            id="ProficiencyHalfSvg-264f2b75-af86-457c-ae95-1222392d82ba"
+            data-name="v1"
+          >
+            <path
+              fill={fillColor}
+              d="M6.90936,9.61388a4.92424,4.92424,0,0,0,.51441-.271c.11352-.06342.23217-.11218.34143-.18512A5.01231,5.01231,0,0,0,9.15765,7.76537c.073-.10938.122-.22834.18531-.34186a4.90594,4.90594,0,0,0,.27087-.51422,4.92218,4.92218,0,0,0,.17236-.55609c.03528-.12464.0846-.24286.11023-.37128a5.01118,5.01118,0,0,0,0-1.96973c-.02563-.12793-.0747-.2456-.10986-.36975a4.89619,4.89619,0,0,0-.17285-.55762,4.95632,4.95632,0,0,0-.26953-.51208c-.06385-.11432-.11316-.234-.18665-.34406A5.009,5.009,0,0,0,7.76544.83659C7.65533.76311,7.53571.71379,7.42133.65a4.93653,4.93653,0,0,0-.512-.26965A4.92788,4.92788,0,0,0,6.35175.2075c-.12427-.035-.242-.08422-.36988-.10974A5.01113,5.01113,0,0,0,4.01215.0977c-.12842.02564-.24659.075-.37122.11023a4.91883,4.91883,0,0,0-.556.17236,4.90994,4.90994,0,0,0-.51428.27082c-.11353.06341-.23255.11242-.34192.18542A5.012,5.012,0,0,0,.83636,2.22893c-.073.10919-.1217.228-.18505.34137a4.89294,4.89294,0,0,0-.271.51452,4.90106,4.90106,0,0,0-.17212.555c-.0354.12512-.08484.24371-.11059.37268a5.01485,5.01485,0,0,0,0,1.96911c.02587.1294.07543.24854.11108.37415a4.90112,4.90112,0,0,0,.17151.55353A4.92736,4.92736,0,0,0,.65228,7.426c.06311.11261.11157.23059.18408.33911a5.00987,5.00987,0,0,0,1.39258,1.3927c.10865.07239.22657.12091.33911.184a4.92488,4.92488,0,0,0,.51685.27216,4.91647,4.91647,0,0,0,.55347.17157c.12561.03558.24475.0852.37414.111a5.01264,5.01264,0,0,0,1.96912,0c.1289-.02576.24756-.0752.37268-.1106A4.91928,4.91928,0,0,0,6.90936,9.61388ZM1.16962,4.99712a3.82728,3.82728,0,0,1,6.53369-2.7063L2.29071,7.70341A3.81549,3.81549,0,0,1,1.16962,4.99712Z"
+            />
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyHalfSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyHalfSvg/index.ts
new file mode 100644
index 0000000..24fc199
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencyHalfSvg/index.ts
@@ -0,0 +1,12 @@
+import { asDarkSvg, asModifiedSvg } from "../../../hocs";
+import ProficiencyHalfSvg from "./ProficiencyHalfSvg";
+
+const ModifiedProficiencyHalfSvg = asModifiedSvg(ProficiencyHalfSvg);
+const DarkProficiencyHalfSvg = asDarkSvg(ProficiencyHalfSvg);
+
+export default ProficiencyHalfSvg;
+export {
+  ProficiencyHalfSvg,
+  DarkProficiencyHalfSvg,
+  ModifiedProficiencyHalfSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencySvg/ProficiencySvg.tsx b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencySvg/ProficiencySvg.tsx
new file mode 100644
index 0000000..68b83fe
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencySvg/ProficiencySvg.tsx
@@ -0,0 +1,37 @@
+import React from "react";
+
+import BaseSvg from "../../../BaseSvg";
+import { InjectedSvgProps } from "../../../hocs";
+
+export default class ProficiencySvg extends React.PureComponent<InjectedSvgProps> {
+  static defaultProps = {
+    fillColor: "#383838",
+    secondaryFillColor: "#383838",
+  };
+
+  render() {
+    const { fillColor, className } = this.props;
+
+    let classNames: Array<string> = ["ddbc-proficiency-svg"];
+
+    if (className) {
+      classNames.push(className);
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 10 10">
+        <g
+          id="ProficiencySvg-c0f57d66-982a-4b7b-ab3f-1a660eb9a0fa"
+          data-name="Layer 2"
+        >
+          <g
+            id="ProficiencySvg-20287332-c962-4a67-9f75-8501a8b7818d"
+            data-name="v1"
+          >
+            <circle fill={fillColor} cx="5" cy="5" r="5" />
+          </g>
+        </g>
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencySvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencySvg/index.ts
new file mode 100644
index 0000000..e8e8f36
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/icons/proficiency/ProficiencySvg/index.ts
@@ -0,0 +1,8 @@
+import { asDarkSvg, asModifiedSvg } from "../../../hocs";
+import ProficiencySvg from "./ProficiencySvg";
+
+const ModifiedProficiencySvg = asModifiedSvg(ProficiencySvg);
+const DarkProficiencySvg = asDarkSvg(ProficiencySvg);
+
+export default ProficiencySvg;
+export { ProficiencySvg, DarkProficiencySvg, ModifiedProficiencySvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneLeftSvg/PaneLeftSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneLeftSvg/PaneLeftSvg.tsx
new file mode 100644
index 0000000..4716fe1
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneLeftSvg/PaneLeftSvg.tsx
@@ -0,0 +1,23 @@
+import * as React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class PaneLeftSvg extends React.PureComponent<InjectedSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 9.05327 16" className={className}>
+        <path
+          fill={fillColor}
+          d="M8.691,2.48379,3.96263,8,8.691,13.5167a1.50431,1.50431,0,0,1-.16326,2.12119h0a1.50431,1.50431,0,0,1-2.12107-.16324L0,8,6.40628.52548A1.50456,1.50456,0,0,1,8.528.36242h0A1.50457,1.50457,0,0,1,8.691,2.48379Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneLeftSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneLeftSvg/index.ts
new file mode 100644
index 0000000..6f2f444
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneLeftSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg, asDisabledSvg, asLightSvg, asThemedSvg } from "../../hocs";
+import PaneLeftSvg from "./PaneLeftSvg";
+
+const LightPaneLeftSvg = asLightSvg(PaneLeftSvg);
+const DarkPaneLeftSvg = asDarkSvg(PaneLeftSvg);
+const DisabledPaneLeftSvg = asDisabledSvg(PaneLeftSvg);
+const ThemedPaneLeftSvg = asThemedSvg(PaneLeftSvg);
+
+export default PaneLeftSvg;
+export {
+  PaneLeftSvg,
+  LightPaneLeftSvg,
+  DarkPaneLeftSvg,
+  DisabledPaneLeftSvg,
+  ThemedPaneLeftSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneRightSvg/PaneRightSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneRightSvg/PaneRightSvg.tsx
new file mode 100644
index 0000000..72d74f6
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneRightSvg/PaneRightSvg.tsx
@@ -0,0 +1,23 @@
+import * as React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class PaneRightSvg extends React.PureComponent<InjectedSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 9.05327 16" className={className}>
+        <path
+          fill={fillColor}
+          d="M.36226,2.48379,5.09065,8,.36225,13.5167a1.50431,1.50431,0,0,0,.16326,2.12119h0a1.5043,1.5043,0,0,0,2.12106-.16324L9.05327,8,2.647.52548A1.50458,1.50458,0,0,0,.52524.36242h0A1.50457,1.50457,0,0,0,.36226,2.48379Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneRightSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneRightSvg/index.ts
new file mode 100644
index 0000000..d6a69f3
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/sidebar/PaneRightSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg, asDisabledSvg, asLightSvg, asThemedSvg } from "../../hocs";
+import PaneRightSvg from "./PaneRightSvg";
+
+const LightPaneRightSvg = asLightSvg(PaneRightSvg);
+const DarkPaneRightSvg = asDarkSvg(PaneRightSvg);
+const DisabledPaneRightSvg = asDisabledSvg(PaneRightSvg);
+const ThemedPaneRightSvg = asThemedSvg(PaneRightSvg);
+
+export default PaneRightSvg;
+export {
+  PaneRightSvg,
+  LightPaneRightSvg,
+  DarkPaneRightSvg,
+  DisabledPaneRightSvg,
+  ThemedPaneRightSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarLeftSvg/SidebarLeftSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarLeftSvg/SidebarLeftSvg.tsx
new file mode 100644
index 0000000..7139d1c
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarLeftSvg/SidebarLeftSvg.tsx
@@ -0,0 +1,24 @@
+import * as React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class SidebarLeftSvg extends React.PureComponent<InjectedSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 16 16" className={className}>
+        <path
+          fill={fillColor}
+          d="M11,2.48,5,8l6,5.52a1.3,1.3,0,0,1-.21,2.12h0a2.25,2.25,0,0,1-2.68-.17L0,8,8.11.53A2.25,2.25,0,0,1,10.79.36h0A1.3,1.3,0,0,1,11,2.48Z"
+        />
+        <polygon fill={fillColor} points="6.92 8 16 0 16 16 6.92 8" />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarLeftSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarLeftSvg/index.ts
new file mode 100644
index 0000000..cb71ac9
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarLeftSvg/index.ts
@@ -0,0 +1,14 @@
+import { asDarkSvg, asDisabledSvg, asLightSvg } from "../../hocs";
+import SidebarLeftSvg from "./SidebarLeftSvg";
+
+const LightSidebarLeftSvg = asLightSvg(SidebarLeftSvg);
+const DarkSidebarLeftSvg = asDarkSvg(SidebarLeftSvg);
+const DisabledSidebarLeftSvg = asDisabledSvg(SidebarLeftSvg);
+
+export default SidebarLeftSvg;
+export {
+  SidebarLeftSvg,
+  LightSidebarLeftSvg,
+  DarkSidebarLeftSvg,
+  DisabledSidebarLeftSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarRightSvg/SidebarRightSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarRightSvg/SidebarRightSvg.tsx
new file mode 100644
index 0000000..7403f5b
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarRightSvg/SidebarRightSvg.tsx
@@ -0,0 +1,24 @@
+import * as React from "react";
+
+import BaseSvg from "../../BaseSvg";
+import { InjectedSvgProps } from "../../hocs";
+
+export default class SidebarLeftSvg extends React.PureComponent<InjectedSvgProps> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { className, fillColor } = this.props;
+
+    return (
+      <BaseSvg viewBox="0 0 16 16" className={className}>
+        <path
+          fill={fillColor}
+          d="M5.21.36h0A2.25,2.25,0,0,1,7.89.53L16,8,7.89,15.47a2.25,2.25,0,0,1-2.68.17h0A1.3,1.3,0,0,1,5,13.52L11,8,5,2.48A1.3,1.3,0,0,1,5.21.36Z"
+        />
+        <polygon fill={fillColor} points="9.09 8 0 0 0 16 9.09 8" />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarRightSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarRightSvg/index.ts
new file mode 100644
index 0000000..6dcc9e7
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/sidebar/SidebarRightSvg/index.ts
@@ -0,0 +1,14 @@
+import { asDarkSvg, asDisabledSvg, asLightSvg } from "../../hocs";
+import SidebarRightSvg from "./SidebarRightSvg";
+
+const LightSidebarRightSvg = asLightSvg(SidebarRightSvg);
+const DarkSidebarRightSvg = asDarkSvg(SidebarRightSvg);
+const DisabledSidebarRightSvg = asDisabledSvg(SidebarRightSvg);
+
+export default SidebarRightSvg;
+export {
+  SidebarRightSvg,
+  LightSidebarRightSvg,
+  DarkSidebarRightSvg,
+  DisabledSidebarRightSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/AbjurationSvg/AbjurationSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/spellSchools/AbjurationSvg/AbjurationSvg.tsx
new file mode 100644
index 0000000..21f3b6a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/AbjurationSvg/AbjurationSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const AbjurationSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 32 32">
+      <path
+        fill={fillColor}
+        d="M21.978 2.951l.109-.13a.76.76 0 01.174-.148 1.52 1.52 0 011.146-.113 1.394 1.394 0 011.012.758 1.115 1.115 0 00-.303-.637 2.052 2.052 0 00-.586-.444A1.994 1.994 0 0022 2.095a1.444 1.444 0 00-.403.22c-.046.036-.09.067-.137.11a4.5 4.5 0 00-.164.178 1.99 1.99 0 00-.362.79 5.183 5.183 0 00-.051 1.525c.04.485.119.951.2 1.415.083.464.184.92.286 1.374.053.226.1.455.159.678l.157.631.134.675.034.168.008.142.021.28c.006.094.022.182.021.28l-.01.295-.007.294c-.005.097-.029.192-.04.288a3.442 3.442 0 01-.108.563 3.443 3.443 0 01-.168.54 4.864 4.864 0 01-.52.984c-.118.144-.211.305-.343.437-.134.128-.251.272-.394.392-.149.114-.289.236-.439.347l-.477.304-.515.248c-.175.076-.364.129-.543.197a4.975 4.975 0 01-.564.153c-.095.023-.188.051-.285.07l-.295.04-.055.007a62.121 62.121 0 00-.025-1.232 73.857 73.857 0 00-.097-2.362 69.347 69.347 0 00-.354-4.188 45.27 45.27 0 00-.436-2.962c-.058-.358-.125-.639-.161-.83L16 3.852l-.066.294c-.036.191-.103.472-.161.83a45.244 45.244 0 00-.436 2.962 69.339 69.339 0 00-.354 4.188 74.007 74.007 0 00-.097 2.362c-.013.408-.02.819-.025 1.232l-.055-.008-.295-.04c-.097-.018-.19-.047-.285-.07a4.6 4.6 0 01-.563-.154c-.18-.068-.369-.12-.543-.197l-.516-.248-.476-.303c-.15-.111-.289-.235-.438-.348-.143-.12-.26-.264-.395-.392-.131-.132-.224-.293-.342-.436a4.884 4.884 0 01-.519-.984 3.45 3.45 0 01-.169-.54 3.353 3.353 0 01-.106-.563c-.012-.095-.036-.19-.04-.287l-.008-.294-.01-.295c0-.098.016-.198.023-.298a5.052 5.052 0 01.068-.6l.115-.603c.114-.452.226-.89.328-1.351.103-.457.202-.911.286-1.375.082-.464.159-.93.2-1.416a5.21 5.21 0 00-.051-1.526 1.986 1.986 0 00-.363-.79 1.827 1.827 0 00-.313-.3l-.02-.016c.002.003-.05-.038-.03-.022l-.004-.003-.01-.005-.037-.021-.076-.043a1.669 1.669 0 00-.208-.095 1.986 1.986 0 00-1.54.139 2.06 2.06 0 00-.585.444 1.116 1.116 0 00-.303.638 1.394 1.394 0 011.012-.757 1.518 1.518 0 011.139.11.81.81 0 01.093.068l.065.058.032.028.008.007.004.004-.02-.016.01.014.082.103.064.106a1.189 1.189 0 01.11.487 4.584 4.584 0 01-.175 1.208c-.102.42-.235.846-.376 1.27-.142.424-.288.852-.444 1.274l-.47 1.278-.226.728a5.722 5.722 0 00-.16.754c-.02.127-.05.254-.061.383l-.025.392-.023.393c-.005.132.011.264.017.397a4.766 4.766 0 00.089.794 5.364 5.364 0 00.186.786 6.313 6.313 0 00.667 1.485 7.83 7.83 0 00.472.669c.181.202.352.419.55.605.202.179.4.367.615.532l.67.455.711.371c.24.114.492.198.738.297a6.254 6.254 0 00.758.219c.127.03.254.068.382.093l.385.06c.133.025.266.043.4.058.004.447.01.893.025 1.334.009.43.024.855.042 1.276a30.445 30.445 0 00-3.233.26 20.95 20.95 0 00-1.419.249c-.342.073-.538.13-.538.13s.196.056.538.13c.343.074.832.164 1.42.249a30.593 30.593 0 003.297.261c.061 1.073.142 2.094.236 3.025a31.07 31.07 0 00-3.534.268c-.587.084-1.076.174-1.419.249-.342.073-.538.13-.538.13s.196.057.538.13c.343.075.832.165 1.42.25a31.315 31.315 0 003.678.27c.132 1.08.277 1.985.398 2.635.059.357.126.638.163.83L16 30l.066-.293c.037-.192.104-.473.163-.83.12-.65.266-1.555.398-2.634a30.882 30.882 0 003.679-.27 20.247 20.247 0 001.419-.25c.342-.074.538-.131.538-.131s-.196-.058-.538-.13a20.402 20.402 0 00-1.419-.25 30.634 30.634 0 00-3.534-.268c.094-.93.175-1.95.236-3.023a30.157 30.157 0 003.298-.26 20.247 20.247 0 001.419-.25c.342-.074.538-.131.538-.131s-.196-.058-.538-.131a20.39 20.39 0 00-1.419-.25 30.001 30.001 0 00-3.233-.26c.018-.42.034-.845.043-1.274.014-.441.02-.887.025-1.334.133-.015.266-.034.4-.06l.384-.058c.128-.026.255-.063.382-.094a5.944 5.944 0 00.757-.22c.247-.098.498-.182.739-.296l.71-.372.67-.454c.214-.165.412-.355.615-.533.198-.186.368-.403.55-.605a7.823 7.823 0 00.471-.669 6.327 6.327 0 00.666-1.484 5.356 5.356 0 00.186-.785 4.67 4.67 0 00.09-.794c.005-.133.02-.265.016-.397l-.023-.393-.025-.392c-.011-.13-.042-.267-.064-.4l-.074-.4-.039-.199-.052-.165-.206-.656-.482-1.32c-.156-.425-.3-.852-.444-1.276-.141-.425-.273-.851-.376-1.27a4.603 4.603 0 01-.174-1.21 1.194 1.194 0 01.11-.487.945.945 0 00.05-.09z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default AbjurationSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/AbjurationSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/spellSchools/AbjurationSvg/index.ts
new file mode 100644
index 0000000..a820008
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/AbjurationSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import AbjurationSvg from "./AbjurationSvg";
+
+const LightAbjurationSvg = asLightSvg(AbjurationSvg);
+const DarkAbjurationSvg = asDarkSvg(AbjurationSvg);
+const GrayAbjurationSvg = asGraySvg(AbjurationSvg);
+
+export default AbjurationSvg;
+export {
+  AbjurationSvg,
+  LightAbjurationSvg,
+  DarkAbjurationSvg,
+  GrayAbjurationSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/ConjurationSvg/ConjurationSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/spellSchools/ConjurationSvg/ConjurationSvg.tsx
new file mode 100644
index 0000000..89a6c88
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/ConjurationSvg/ConjurationSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const ConjurationSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 32 32">
+      <path
+        fill={fillColor}
+        d="M26.97063,3.68231a1.96118,1.96118,0,0,0-.31819-.84931,1.37006,1.37006,0,0,0-.69828-.51631,1.36861,1.36861,0,0,1,.53178.61115,1.69925,1.69925,0,0,1,.1137.77365,4.69743,4.69743,0,0,1-.41475,1.55162,14.13428,14.13428,0,0,1-.739,1.47057c-.27446.479-.57516.9455-.88091,1.40868-.30306.46485-.62093.922-.94585,1.37472-.34209.4692-.65254.92768-.97815,1.39824-.30944.48738-.63133.98486-.91758,1.4756q-.29658.49614-.58639.99551a1.15467,1.15467,0,0,0-.116.01511,12.49707,12.49707,0,0,1-8.03373-.3899,4.83329,4.83329,0,0,0-2.5939-.43189c-.03823-.06411-.07605-.12845-.11429-.19252-.28726-.49379-.60411-.97848-.90919-1.46417-.32628-.47124-.66063-.967-.98721-1.41138-.32561-.45308-.64045-.90582-.94485-1.37234-.30474-.46352-.60645-.929-.88058-1.408a13.99287,13.99287,0,0,1-.73932-1.46989,4.69678,4.69678,0,0,1-.41542-1.55029,1.70731,1.70731,0,0,1,.11336-.7733A1.37065,1.37065,0,0,1,6.047,2.31669a1.37107,1.37107,0,0,0-.69863.51563,1.9573,1.9573,0,0,0-.31852.84964,5.19005,5.19005,0,0,0,.13621,1.77733A12.02728,12.02728,0,0,0,5.69819,7.13c.21223.54121.44231,1.074.69559,1.59334.255.51563.52809,1.02858.80559,1.53111.28421.50688.5348.97813.79986,1.47023.24991.49883.521.98015.76151,1.486.24722.50049.49411,1.00066.72856,1.5099.24084.50454.47057,1.01582.70334,1.52609.23882.50622.46652,1.01951.6976,1.53076l.68652,1.53785.1327.30245c-.12057.01712-.23927.03149-.35432.04056a3.41274,3.41274,0,0,1-1.08108-.05785,2.01526,2.01526,0,0,1-.82239-.38781,2.95229,2.95229,0,0,1-.54525-.59368,3.94067,3.94067,0,0,1-.29633-.49142l-.10158-.188s-.01078.07367-.03061.21158a2.81946,2.81946,0,0,0,.24923,1.60377,2.74189,2.74189,0,0,0,.94721,1.06425,4.03528,4.03528,0,0,0,1.555.60039,6.43188,6.43188,0,0,0,1.30793.09017c.35451.81352.70923,1.627,1.05361,2.445.44636,1.03029.88732,2.07031,1.31383,3.09957l1.08915,2.629,1.08508-2.62763c.4255-1.03029.87151-2.0683,1.31586-3.0999l1.33972-3.09621.41441-.93431a2.8307,2.8307,0,0,1,.30846.04322,4.65275,4.65275,0,0,1,.57921.12278c.18735.05213.36091.12848.54188.18465q.25884.1221.49512.23377.23312.13775.441.261c.2812.16986.50892.35722.71879.49579.37941.31518.62665.49884.62665.49884s-.071-.28255-.24857-.78373a6.64516,6.64516,0,0,0-.448-.849q-.15841-.23361-.35418-.4931c-.14431-.15979-.30475-.32392-.47428-.49949-.188-.15137-.3858-.31618-.60646-.46722a5.26285,5.26285,0,0,0-.73461-.39387c-.03137-.01478-.06545-.02523-.09736-.03915l.20462-.4613c.23144-.51093.46016-1.02454.69964-1.53077.23073-.51127.46282-1.02152.704-1.52641.23478-.50924.482-1.00941.7299-1.50958.24219-.50924.50858-.97779.75512-1.47494l.80929-1.48369c.27818-.50354.549-1.0121.80524-1.52976q.37791-.78.69559-1.59334a11.86618,11.86618,0,0,0,.53281-1.67072A5.18782,5.18782,0,0,0,26.97063,3.68231Zm-9.601,12.51935a16.8099,16.8099,0,0,0,2.2951-.16545c-.14677.27853-.29574.55608-.43984.83581-.16321.31159-.31884.62647-.47662.94043-.14791-.00209-.29339.00828-.44227.0124a6.55006,6.55006,0,0,0-.93575.10528,8.30163,8.30163,0,0,0-.91122.2062c-.14933.03768-.30137.09216-.45206.13858l-.226.07265-.19911.07165q-.39.15136-.779.30171c-.2479.09015-.48941.18871-.73293.27077-.06787.02336-.13382.04358-.20128.06633-.357-.733-.716-1.46521-1.09409-2.189q-.461-.89358-.94257-1.77789c.12.04139.24273.08485.365.12842A14.26294,14.26294,0,0,0,17.36965,16.20166Zm-2.51619,4.93839c.24794-.06787.49625-.137.7378-.22336q.40212-.14431.80625-.28962l.19811-.075.17592-.06055c.11774-.03869.23008-.08443.35285-.11773.1204-.035.24083-.0713.3599-.11167l.07149-.01944q-.65713,1.38361-1.2878,2.77867c-.09224.20618-.18181.41288-.273.61912-.09068-.20637-.18025-.413-.27157-.61947C15.43922,22.39151,15.14465,21.7665,14.85346,21.14005Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default ConjurationSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/ConjurationSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/spellSchools/ConjurationSvg/index.ts
new file mode 100644
index 0000000..3ce4484
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/ConjurationSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import ConjurationSvg from "./ConjurationSvg";
+
+const LightConjurationSvg = asLightSvg(ConjurationSvg);
+const DarkConjurationSvg = asDarkSvg(ConjurationSvg);
+const GrayConjurationSvg = asGraySvg(ConjurationSvg);
+
+export default ConjurationSvg;
+export {
+  ConjurationSvg,
+  LightConjurationSvg,
+  DarkConjurationSvg,
+  GrayConjurationSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/DivinationSvg/DivinationSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/spellSchools/DivinationSvg/DivinationSvg.tsx
new file mode 100644
index 0000000..737ffd2
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/DivinationSvg/DivinationSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const DivinationSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 32 32">
+      <path
+        fill={fillColor}
+        d="M25.05459,10.48719a13.80182,13.80182,0,0,0-9.33093,2.08692,5.2614,5.2614,0,0,1,.98451-2.35521c.65113-.806,2.51177-1.12656,4.0067-1.38412,1.75232-.30191,3.2653-.56258,3.86818-1.64106A1.93446,1.93446,0,0,0,24.2883,4.761a3.02924,3.02924,0,0,0-3.21581-.49582,1.11554,1.11554,0,0,0,1.05357,1.96227.82521.82521,0,0,1,.145.00264,17.48014,17.48014,0,0,1-1.935.406C18.3749,6.974,16.152,7.357,14.97265,8.817A9.04153,9.04153,0,0,0,13.349,14.45887a9.83591,9.83591,0,0,0-2.28674,5.34024c-.026.37412-.04606.76971-.06645,1.17465-.1024,2.02529-.24262,4.79882-1.37042,4.79882-.85858,0-1.39082-2.43707-1.3944-4.18317a1.11551,1.11551,0,1,0-2.231,0c0,.65642.10178,6.41419,3.62542,6.41419,3.249,0,3.451-3.998,3.59849-6.91717.01976-.39062.03906-.7719.06411-1.13294a7.754,7.754,0,0,1,1.926-4.24112c.01787-.01471.0375-.026.05466-.042.04077-.038,4.14676-3.79489,9.44544-2.97834a1.11551,1.11551,0,1,0,.3405-2.20488Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default DivinationSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/DivinationSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/spellSchools/DivinationSvg/index.ts
new file mode 100644
index 0000000..c7f685a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/DivinationSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import DivinationSvg from "./DivinationSvg";
+
+const LightDivinationSvg = asLightSvg(DivinationSvg);
+const DarkDivinationSvg = asDarkSvg(DivinationSvg);
+const GrayDivinationSvg = asGraySvg(DivinationSvg);
+
+export default DivinationSvg;
+export {
+  DivinationSvg,
+  LightDivinationSvg,
+  DarkDivinationSvg,
+  GrayDivinationSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/EnchantmentSvg/EnchantmentSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/spellSchools/EnchantmentSvg/EnchantmentSvg.tsx
new file mode 100644
index 0000000..0e532a0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/EnchantmentSvg/EnchantmentSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const EnchantmentSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 32 32">
+      <path
+        fill={fillColor}
+        d="M25.78673,20.34876a2.44921,2.44921,0,0,0-2.63806-1.688A2.061,2.061,0,0,0,21.44221,20.55a1.08453,1.08453,0,0,0,2.13853.31708,1.30412,1.30412,0,0,1,.2242.36278,1.29752,1.29752,0,0,1-.17791.90043,6.50062,6.50062,0,0,1-3.05379,2.92217,1.648,1.648,0,0,1-1.56244-.33978.87453.87453,0,0,1-.28895-.86624,16.273,16.273,0,0,1,1.58-2.4066c2.17332-3.00205,3.67162-5.26039,3.15212-6.98713a2.184,2.184,0,0,0-1.40118-1.43975c-1.21388-.45657-2.63261.42874-3.9061,1.66607a3.08539,3.08539,0,0,0-1.46956-2.79479,2.94606,2.94606,0,0,0-3.24954.49214V10.21181a9.17233,9.17233,0,0,1,4.35511-.20153,1.08439,1.08439,0,1,0,.515-2.10676,10.91773,10.91773,0,0,0-4.87008.0733V5.38846a1.0844,1.0844,0,0,0-2.16879,0V8.01022a15.295,15.295,0,0,0-4.32274-.00231A1.0844,1.0844,0,0,0,7.232,10.15642a12.01152,12.01152,0,0,1,4.02683.07252v16.3826a1.0844,1.0844,0,0,0,2.16879,0V15.46132c.70592-.97155,1.798-1.89447,2.21961-1.66853.28139.15189.64537.84113-.07927,3.75059a6.255,6.255,0,0,0-.14977.69015l-.51133,4.27736L17.3827,18.9854c1.42357-2.02778,3.28555-3.88008,3.94181-3.92819.03268.01392.04962.0242.05386.0242h.0003c.28713.77578-1.97877,3.90611-2.83352,5.08672a11.20509,11.20509,0,0,0-1.93943,3.20325,3.03137,3.03137,0,0,0,.91828,2.92,3.74038,3.74038,0,0,0,2.567.99756,3.92411,3.92411,0,0,0,1.078-.15129,8.46434,8.46434,0,0,0,4.42289-4.08916A3.166,3.166,0,0,0,25.78673,20.34876Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default EnchantmentSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/EnchantmentSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/spellSchools/EnchantmentSvg/index.ts
new file mode 100644
index 0000000..6072115
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/EnchantmentSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import EnchantmentSvg from "./EnchantmentSvg";
+
+const LightEnchantmentSvg = asLightSvg(EnchantmentSvg);
+const DarkEnchantmentSvg = asDarkSvg(EnchantmentSvg);
+const GrayEnchantmentSvg = asGraySvg(EnchantmentSvg);
+
+export default EnchantmentSvg;
+export {
+  EnchantmentSvg,
+  LightEnchantmentSvg,
+  DarkEnchantmentSvg,
+  GrayEnchantmentSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/EvocationSvg/EvocationSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/spellSchools/EvocationSvg/EvocationSvg.tsx
new file mode 100644
index 0000000..06f8eff
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/EvocationSvg/EvocationSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const EvocationSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 32 32">
+      <path
+        fill={fillColor}
+        d="M31.64055,16.99945c-.23438-.03458-.57809-.09759-1.01566-.15285-.87252-.125-2.11848-.27677-3.613-.41055a6.11948,6.11948,0,0,0-2.72181-4.31569l.95288-3.20363-2.421,2.31376a12.77361,12.77361,0,0,0-1.80874-.73547l.75547-5.47679-2.56188,5.018a16.92872,16.92872,0,0,0-2.33651-.27276c-.06968-1.00747-.154-1.95283-.24678-2.79959-.1334-1.23215-.28534-2.25924-.40977-2.97782-.05466-.35945-.11767-.642-.15194-.8344C16.02162,2.95929,16,2.85645,16,2.85645s-.02162.10284-.06176.29522c-.03427.19238-.09728.47495-.15194.8344-.12443.71858-.27637,1.74567-.40977,2.97782-.09275.84676-.1771,1.79212-.24678,2.79959a17.00621,17.00621,0,0,0-2.12943.23558l-2.55443-4.981.75707,5.4074a13.04,13.04,0,0,0-1.85418.71877L6.97192,8.9169,7.855,12.01561a6.18957,6.18957,0,0,0-2.86725,4.42355c-1.49441.13316-2.74022.28457-3.61268.40866-.43757.05466-.78128.11767-1.01566.15193C.12508,17.0399,0,17.06152,0,17.06152s.12508.02162.35945.06176c.23438.03427.57809.09728,1.01566.15194.87485.12443,2.12489.27637,3.62476.40977l.03773.00328a5.67684,5.67684,0,0,0,1.52956,2.933L3.22751,25.24487l4.781-3.41326a11.35094,11.35094,0,0,0,2.24293,1.15791l-.73219,2.873L11.9096,23.5118a16.57294,16.57294,0,0,0,3.35793.47435c.03377.36341.06911.71486.10591,1.05.134,1.23215.28626,2.25924.41164,2.97782.055.35945.11827.642.15285.8344L16,29.14355l.06207-.29522c.03458-.19238.09759-.47495.15285-.8344.12538-.71858.27762-1.74567.41164-2.97782.0368-.3351.07214-.68655.10591-1.05A16.49933,16.49933,0,0,0,20.2614,23.469l2.4336,2.39348-.75211-2.95212a11.13582,11.13582,0,0,0,2.16434-1.15727L28.987,25.24487l-3.44983-4.73916a5.623,5.623,0,0,0,1.42467-2.81429l.03833-.00334c1.49987-.134,2.74991-.28626,3.62476-.41164.43757-.05526.78128-.11827,1.01566-.15285L32,17.06152ZM19.72619,12.38a11.13261,11.13261,0,0,1,2.3378.903s.707.45123.76683.4588a4.4068,4.4068,0,0,1,1.96832,2.521c-.92516-.0625-1.90522-.11718-2.92427-.15981-.93722-.03861-1.90625-.07411-2.89042-.08987-.62949-.01559-1.266-.02143-1.904-.02554-.0061-.81753-.00961-1.63471-.03356-2.439-.01231-.54618-.03276-1.08266-.05611-1.61309a14.36822,14.36822,0,0,1,2.3513.34779m-6.3265,3.73141c-.98417.01823-1.9532.05065-2.89042.09112-1.01935.04314-1.99968.098-2.92508.16045a4.5629,4.5629,0,0,1,2.18566-2.66488l.59335-.32967c.00581-.00621.00948-.0135.01512-.0198a11.20353,11.20353,0,0,1,2.29271-.87528s.713-.15414.74689-.17662a14.51,14.51,0,0,1,1.97547-.26452c-.02335.53043-.0438,1.06691-.05611,1.61309-.024.80457-.02746,1.622-.03356,2.43975C14.28146,15.99293,13.645,15.99926,13.01555,16.01466Zm-.71406,5.35559-.80113-.24076A9.32546,9.32546,0,0,1,8.87006,19.786l-.3413-.27812A4.21874,4.21874,0,0,1,7.315,17.86467c.89142.05926,1.83314.11126,2.81009.15259.93722.04047,1.90625.07289,2.89042.09112.638.0156,1.28323.0219,1.93009.02653.00247.10521.00279.21172.006.31654.01576.80877.05126,1.60457.08987,2.37471q.02566.50238.057.988A14.24012,14.24012,0,0,1,12.30149,21.37025Zm8.18875-.23769a1.11178,1.11178,0,0,0-.413.13092,14.06981,14.06981,0,0,1-3.17574.55068q.0309-.48622.057-.988c.03861-.77014.07411-1.56594.08987-2.37471.00315-.10457.00349-.21086.006-.31584.64682-.00411,1.292-.00987,1.93009-.02569.98417-.01576,1.9532-.05126,2.89042-.08987.97642-.041,1.91767-.09282,2.80865-.152C24.16215,19.23914,22.594,20.42214,20.49024,21.13256Z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default EvocationSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/EvocationSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/spellSchools/EvocationSvg/index.ts
new file mode 100644
index 0000000..7e8fc29
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/EvocationSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import EvocationSvg from "./EvocationSvg";
+
+const LightEvocationSvg = asLightSvg(EvocationSvg);
+const DarkEvocationSvg = asDarkSvg(EvocationSvg);
+const GrayEvocationSvg = asGraySvg(EvocationSvg);
+
+export default EvocationSvg;
+export { EvocationSvg, LightEvocationSvg, DarkEvocationSvg, GrayEvocationSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/IllusionSvg/IllusionSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/spellSchools/IllusionSvg/IllusionSvg.tsx
new file mode 100644
index 0000000..6de5527
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/IllusionSvg/IllusionSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const IllusionSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 32 32">
+      <path
+        fill={fillColor}
+        d="M30.94 10.694c-.354-.35-.855.133-.629.61l.006.012a4.337 4.337 0 01.48 2.328c-.123 1.21-.985 1.803-1.845 1.17-1.141-.84-2.184-1.865-3.321-2.716a18.501 18.501 0 00-7-3.254l-.004-.001A5.117 5.117 0 0017.43 8.7h-2.672a1.623 1.623 0 00-.435.08.318.318 0 01-.045.008 2.845 2.845 0 00-.363.066 17.828 17.828 0 00-3.784 1.495 24.907 24.907 0 00-7.746 7.054C1.577 18.492.849 19.662.089 20.8a.548.548 0 00-.089.303v.18a73.174 73.174 0 013.813-3.706c.506-.455.753-.294 1.217.178a3.076 3.076 0 01.537 3.572 3.024 3.024 0 00-.12.592 1.408 1.408 0 00.056.336c.539-.432 1.056-.81 1.537-1.246.307-.28.528-.19.86-.028a2.572 2.572 0 011.352 2.602c0 .211-.044.545.178.611.272.08.322-.286.45-.479.269-.403.342-1.146.999-.879.678.275 1.576.242 1.605 1.52l.003.086c.024.506.597.649.785.194.05-.121.098-.24.143-.361a.967.967 0 01.911-.715c.724-.067 1.186.162 1.3 1.094a13.36 13.36 0 00.3 1.347h.148c.196-.659.4-1.314.587-1.976a1.089 1.089 0 01.706-.804c1.124-.413 1.184-.388 1.637.9l.035.102a.402.402 0 00.792-.11c.03-.232.059-.458.09-.684a5.5 5.5 0 01.183-1.02c.22-.647.712-.735 1.17-.303.408.383.685 1.309 1.178 1.089.35-.158-.043-1.058-.03-1.634a2.832 2.832 0 011.323-2.209c.227-.098.376.044.53.189.212.199.415.41.63.6.244.216.431.77.735.569.276-.184.028-.697.004-1.057a19.618 19.618 0 00-.225-1.813 1.755 1.755 0 01.501-1.476c.335-.385.62.112.926.218a1.289 1.289 0 01.198.116c2.234 1.317 3.635.734 4.696-1.954l.016-.038a3.415 3.415 0 00.244-1.26 3.891 3.891 0 00-.965-2.653q-.047-.05-.096-.098zm-16.308 1.194c.458-.044.921-.01 1.382-.009l.025-.001a7.282 7.282 0 012.253.176c.36.084.585.25.455.769a3.171 3.171 0 01-2.456 2.31 2.663 2.663 0 01-2.277-2.008c-.303-.903-.186-1.16.618-1.237zm10.439 4.35a16.045 16.045 0 01-5.103 3.057 14.479 14.479 0 01-5.039 1.127c-3.773-.005-6.73-1.45-9.598-3.243-.397-.248-.45-.507-.05-.814a25.101 25.101 0 015.683-3.462c.494-.203.665.045.767.56a7.69 7.69 0 001.385 3.221c1.846 2.456 4.826 2.048 6.59-.562a7.373 7.373 0 001.13-2.433c.166-.704.462-.74.98-.489a22.267 22.267 0 013.408 2.244c.562.417.041.622-.153.793z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default IllusionSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/IllusionSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/spellSchools/IllusionSvg/index.ts
new file mode 100644
index 0000000..62f18e6
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/IllusionSvg/index.ts
@@ -0,0 +1,11 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import IllusionSvg from "./IllusionSvg";
+
+const LightIllusionSvg = asLightSvg(IllusionSvg);
+const DarkIllusionSvg = asDarkSvg(IllusionSvg);
+const GrayIllusionSvg = asGraySvg(IllusionSvg);
+
+export default IllusionSvg;
+export { IllusionSvg, LightIllusionSvg, DarkIllusionSvg, GrayIllusionSvg };
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/NecromancySvg/NecromancySvg.tsx b/ddb_main/tools/js/smartComponents/Svg/spellSchools/NecromancySvg/NecromancySvg.tsx
new file mode 100644
index 0000000..8d3a6f6
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/NecromancySvg/NecromancySvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const NecromancySvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 32 32">
+      <path
+        fill={fillColor}
+        d="M26.306 24.401c-3.076 0-5.143-1.672-5.143-4.162a4.871 4.871 0 011.06-3.03 2.93 2.93 0 00.691-2.024c0-3.876-5.542-4.715-6.914-4.715s-6.914.84-6.914 4.715a2.93 2.93 0 00.691 2.024 4.871 4.871 0 011.06 3.03c0 2.49-2.066 4.162-5.142 4.162A4.838 4.838 0 011 19.503v-.06a1.65 1.65 0 012.973-.933.326.326 0 01.037.342 1.428 1.428 0 00-.138.651c0 .541.432 2.027 1.823 2.027.682 0 2.27-.126 2.27-1.291a2.077 2.077 0 00-.544-1.388 5.737 5.737 0 01-1.207-3.666C6.214 9.453 12.807 7.6 16 7.6s9.786 1.854 9.786 7.586a5.737 5.737 0 01-1.207 3.666 2.077 2.077 0 00-.544 1.388c0 1.165 1.588 1.29 2.27 1.29 1.391 0 1.823-1.485 1.823-2.026a1.428 1.428 0 00-.138-.651.326.326 0 01.037-.342 1.65 1.65 0 012.973.933v.06a4.838 4.838 0 01-4.694 4.898z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default NecromancySvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/NecromancySvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/spellSchools/NecromancySvg/index.ts
new file mode 100644
index 0000000..8d71f74
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/NecromancySvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import NecromancySvg from "./NecromancySvg";
+
+const LightNecromancySvg = asLightSvg(NecromancySvg);
+const DarkNecromancySvg = asDarkSvg(NecromancySvg);
+const GrayNecromancySvg = asGraySvg(NecromancySvg);
+
+export default NecromancySvg;
+export {
+  NecromancySvg,
+  LightNecromancySvg,
+  DarkNecromancySvg,
+  GrayNecromancySvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/TransmutationSvg/TransmutationSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/spellSchools/TransmutationSvg/TransmutationSvg.tsx
new file mode 100644
index 0000000..1336e45
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/TransmutationSvg/TransmutationSvg.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+
+import BaseSvg, { BaseSvgProps } from "../../BaseSvg";
+
+const TransmutationSvg: React.FunctionComponent<BaseSvgProps> = ({
+  className = "",
+  fillColor,
+  secondaryFillColor,
+}) => {
+  return (
+    <BaseSvg className={className} viewBox="0 0 32 32">
+      <path
+        fill={fillColor}
+        d="M19.827 6.569s1.097-.084 2.636-.052c1.993.04 1.902 1.415.999 2.01-.892.659-1.689 1.214-1.096 2.784 1.626 2.555 3.508 1.885 5.092.586 1.03-.902.275-1.555.275-1.555-.74-.79-2.25 2.522-3.405.28-.548-1.25 2.142-1.39 2.084-3.607 0-1.846-1.421-2.451-2.831-2.451H5.892L4 6.584h4.223v12.857l-1.116 2.743a1.8 1.8 0 00.32 1.871l2.989 3.381V6.57h7.218v18.364l-1.391 1.392h4.824l-1.24-1.392z"
+      />
+    </BaseSvg>
+  );
+};
+
+export default TransmutationSvg;
diff --git a/ddb_main/tools/js/smartComponents/Svg/spellSchools/TransmutationSvg/index.ts b/ddb_main/tools/js/smartComponents/Svg/spellSchools/TransmutationSvg/index.ts
new file mode 100644
index 0000000..d2bffda
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/spellSchools/TransmutationSvg/index.ts
@@ -0,0 +1,16 @@
+import { asDarkSvg } from "../../hocs/asDarkSvg";
+import { asGraySvg } from "../../hocs/asGraySvg";
+import { asLightSvg } from "../../hocs/asLightSvg";
+import TransmutationSvg from "./TransmutationSvg";
+
+const LightTransmutationSvg = asLightSvg(TransmutationSvg);
+const DarkTransmutationSvg = asDarkSvg(TransmutationSvg);
+const GrayTransmutationSvg = asGraySvg(TransmutationSvg);
+
+export default TransmutationSvg;
+export {
+  TransmutationSvg,
+  LightTransmutationSvg,
+  DarkTransmutationSvg,
+  GrayTransmutationSvg,
+};
diff --git a/ddb_main/tools/js/smartComponents/Svg/themeBoxEdges/BeveledEdgeSvg/BeveledEdgeCornerSvg/BeveledEdgeCornerSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/themeBoxEdges/BeveledEdgeSvg/BeveledEdgeCornerSvg/BeveledEdgeCornerSvg.tsx
new file mode 100644
index 0000000..7a31532
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/themeBoxEdges/BeveledEdgeSvg/BeveledEdgeCornerSvg/BeveledEdgeCornerSvg.tsx
@@ -0,0 +1,47 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import { BaseSvg } from "../../../BaseSvg";
+import { SvgConstantDarkModeBackgroundColor } from "../../../SvgConstants";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+  isTablet: boolean;
+}
+export default class BeveledEdgeCornerSvg extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className, isTablet } = this.props;
+
+    let classNames: Array<string> = ["ddbc-beveled-edge-corner-svg", className];
+
+    let themeBackground = theme.backgroundColor;
+    if (theme.isDarkMode && !isTablet) {
+      themeBackground = SvgConstantDarkModeBackgroundColor;
+    } else if (theme.isDarkMode) {
+      themeBackground = "none";
+    }
+
+    return (
+      <BaseSvg className={classNames.join(" ")} viewBox="0 0 14.625 10.27083">
+        <path
+          fill={theme.themeColor}
+          d="M236.61517,5.86462v2.707a11.33993,11.33993,0,0,0-4.256-5.07v-.046h-.071a16.08764,16.08764,0,0,0-3.756-1.799h3.876Zm-4.207,362.337h-3.876a16.00871,16.00871,0,0,0,3.756-1.799h.071v-.045a11.34783,11.34783,0,0,0,4.256-5.071v2.707Zm-232.457-4.208v-2.707a11.34832,11.34832,0,0,0,4.256,5.071v.045h.071a16.01053,16.01053,0,0,0,3.756,1.799h-3.875Zm10.354,4.208a17.36725,17.36725,0,0,1-4.873-1.799h225.717c-.297.167-.579.344-.898.496a17.88761,17.88761,0,0,1-3.94,1.303Z"
+        />
+        <path
+          fill={theme.themeColor}
+          d="M237.99,5.29V364.56l-5.01,5.02H3.59l-5.01-5.02V5.29L3.59.28H232.98Zm-1.37,354.09V10.51a10.73922,10.73922,0,0,0-4.31-6.3H4.23A10.50987,10.50987,0,0,0-.05,10.48V359.35a10.67983,10.67983,0,0,0,4.3,6.3H232.34A10.58242,10.58242,0,0,0,236.62,359.38ZM5.42,3.46H231.13a17.19832,17.19832,0,0,0-4.87-1.8h-216a17.50959,17.50959,0,0,0-3.94,1.3C6,3.11,5.71,3.29,5.42,3.46Zm2.61-1.8H4.16L-.05,5.86V8.57A11.37376,11.37376,0,0,1,4.21,3.5V3.46h.07A15.98212,15.98212,0,0,1,8.03,1.66Z"
+        />
+        <path
+          fill={themeBackground}
+          d="M236.62,10.51V359.38a10.58242,10.58242,0,0,1-4.28,6.27H4.25a10.67983,10.67983,0,0,1-4.3-6.3V10.48A10.50987,10.50987,0,0,1,4.23,4.21H232.31A10.73922,10.73922,0,0,1,236.62,10.51Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/Svg/themeBoxEdges/BeveledEdgeSvg/BeveledEdgeRepeatSvg/BeveledEdgeRepeatSvg.tsx b/ddb_main/tools/js/smartComponents/Svg/themeBoxEdges/BeveledEdgeSvg/BeveledEdgeRepeatSvg/BeveledEdgeRepeatSvg.tsx
new file mode 100644
index 0000000..e544eb2
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/Svg/themeBoxEdges/BeveledEdgeSvg/BeveledEdgeRepeatSvg/BeveledEdgeRepeatSvg.tsx
@@ -0,0 +1,47 @@
+import React from "react";
+
+import { CharacterTheme } from "@dndbeyond/character-rules-engine/es";
+
+import { BaseSvg } from "../../../BaseSvg";
+import { SvgConstantDarkModeBackgroundColor } from "../../../SvgConstants";
+
+interface Props {
+  theme: CharacterTheme;
+  className: string;
+  isTablet: boolean;
+}
+export default class BeveledEdgeRepeatSvg extends React.PureComponent<Props> {
+  static defaultProps = {
+    className: "",
+  };
+
+  render() {
+    const { theme, className, isTablet } = this.props;
+
+    let classNames: Array<string> = ["ddbc-beveled-edge-repeat-svg", className];
+
+    let themeBackground = theme.backgroundColor;
+    if (theme.isDarkMode && !isTablet) {
+      themeBackground = SvgConstantDarkModeBackgroundColor;
+    } else if (theme.isDarkMode) {
+      themeBackground = "none";
+    }
+
+    return (
+      <BaseSvg
+        className={classNames.join(" ")}
+        viewBox="0 0 14.625 10.27083"
+        preserveAspectRatio="none"
+      >
+        <path
+          fill={theme.themeColor}
+          d="M127.99,5.29V364.56l-5.01,5.02H-106.41l-5.01-5.02V5.29l5.01-5.01H122.98Zm-1.37,354.09V10.51a10.73922,10.73922,0,0,0-4.31-6.3H-105.77a10.50987,10.50987,0,0,0-4.28,6.27V359.35a10.67983,10.67983,0,0,0,4.3,6.3H122.34A10.58242,10.58242,0,0,0,126.62,359.38ZM-104.58,3.46H121.13a17.19832,17.19832,0,0,0-4.87-1.8h-216a17.50959,17.50959,0,0,0-3.94,1.3C-104,3.11-104.29,3.29-104.58,3.46Z"
+        />
+        <path
+          fill={themeBackground}
+          d="M126.62,10.51V359.38a10.58242,10.58242,0,0,1-4.28,6.27H-105.75a10.67983,10.67983,0,0,1-4.3-6.3V10.48a10.50987,10.50987,0,0,1,4.28-6.27H122.31A10.73922,10.73922,0,0,1,126.62,10.51Z"
+        />
+      </BaseSvg>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/ThemeStyles/ThemeStyles.tsx b/ddb_main/tools/js/smartComponents/ThemeStyles/ThemeStyles.tsx
new file mode 100644
index 0000000..5514022
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/ThemeStyles/ThemeStyles.tsx
@@ -0,0 +1,785 @@
+import Color from "color";
+import jss, { StyleSheet } from "jss";
+import preset from "jss-preset-default";
+import * as React from "react";
+
+import {
+  Constants,
+  DecorationInfo,
+  DecorationUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+import { SvgConstantDarkModeBackgroundColor } from "../componentConstants";
+
+interface Props {
+  baseUrl: string;
+  decorationInfo: DecorationInfo;
+  desktopStartWidth: number;
+  desktopLargeStartWidth: number;
+  insertionPointElId: string;
+}
+export default class ThemeStyles extends React.PureComponent<Props> {
+  static defaultProps = {
+    baseUrl: "",
+    desktopStartWidth: 1024,
+    desktopLargeStartWidth: 1200,
+    insertionPointElId: "site",
+  };
+
+  sheet: StyleSheet | null = null;
+
+  borderClassNames: string = `& .ct-spells-level-casting,
+                                & .ct-features__management-link,
+                                & .ct-spells-spell + .ct-spells-spell,
+                                & .ct-inventory-item + .ct-inventory-item,
+                                & .ct-attunement__item + .ct-attunement__item,
+                                & .ct-feats-manage-pane__feat,
+                                & .ct-equipment__overview,
+                                & .ct-saving-throws-pane__details,
+                                & .ct-saving-throws-pane__description,
+                                & .ct-sense-manage-pane__customize,
+                                & .ct-sense-manage-pane__description,
+                                & .ct-proficiencies-pane__proficiency + .ct-proficiencies-pane__proficiency,
+                                & .ct-proficiency-groups__group + .ct-proficiency-groups__group,
+                                & .ct-proficiencies-pane__groups,
+                                & .ct-skill-pane__customize,
+                                & .ct-skill-pane__description,
+                                & .ct-skills__col--skill,
+                                & .ct-skills__col--modifier,
+                                & .ct-ability-pane__description,
+                                & .ct-speed-manage-pane__customize,
+                                & .ct-speed-manage-pane__description,
+                                & .ct-armor-manage-pane__items,
+                                & .ct-armor-manage-pane__customize,
+                                & .ct-armor-manage-pane__description,
+                                & .ct-health-manager__deathsaves,
+                                & .ct-health-manager__restore-life,
+                                & .ct-health-manager__health,
+                                & .ct-health-manager__overrides,
+                                & .ct-defense-manage-pane__custom,
+                                & .ct-condition-manage-pane__condition--special,
+                                & .ct-currency-pane__currency + .ct-currency-pane__currency,
+                                & .ct-currency-pane__adjuster,
+                                & .ct-currency-pane__lifestyle,
+                                & .ct-currency-pane__total,
+                                & .ct-extra-manage-pane__group-heading,
+                                & .ct-extra-manage-pane__extra,
+                                & .ct-extra-manage-pane__extras,
+                                & .ct-item-detail__customize,
+                                & .ct-item-detail__customize,
+                                & .ct-item-detail__description,
+                                & .ct-item-detail__actions,
+                                & .ct-spell-caster,
+                                & .ct-spell-detail__customize,
+                                & .ct-spell-detail__properties,
+                                & .ct-spell-detail__description,
+                                & .ct-action-detail__customize,
+                                & .ct-action-detail__properties,
+                                & .ct-action-detail__description,
+                                & .ct-action-detail__limited-uses,
+                                & .ct-background-pane__data,
+                                & .line,
+                                & .ct-feat-pane__prerequisite,
+                                & .ct-feat-pane__footer,
+                                & .ct-infusions__infusion + .ct-infusions__infusion,
+                                & .ct-infusions__infusion-item + .ct-infusions__infusion-item,
+                                & .ct-infusion-choice-pane__step,
+                                & .ct-infusion-choice-pane__actions,
+                                & .ct-infusion-choice-pane__description,
+                                & .ct-infusion-choice-pane__ui-group,
+                                & .ct-campaign-pane__header,
+                                & .ct-campaign-pane__characters,
+                                & .ct-campaign-pane__character,
+                                & .ct-campaign-pane__character + .ct-campaign-pane__character,
+                                & .ct-inventory__actions--collapsed,
+                                & .ct-equipment-manage-pane__custom,
+                                & .ct-item-detail-abilities__limited-uses,
+                                & .ct-item-detail-abilities__spells,
+                                & .ct-decorate-pane__preferences,
+                                & .ct-decorate-pane__current-selections,
+                                & .ct-decorate-pane__preferences-content,
+                                & .ct-item-detail__class-customize,
+                                & .ct-main-mobile__campaign,
+                                & .ct-item-detail__infusion,
+                                & .ct-currency-pane__lifestyle-detail,
+                                & .ct-currency-pane__subheader,
+                                & .ct-preferences-pane__field-heading,
+                                & .ct-vehicle-pane__customize,
+                                & .ct-custom-action-pane__customize,
+                                & .ct-custom-action-pane__actions`;
+
+  componentDidMount() {
+    const { insertionPointElId } = this.props;
+
+    let setupConfig = preset();
+    let insertionPointElement = document.getElementById(insertionPointElId);
+    if (insertionPointElement) {
+      setupConfig = {
+        ...setupConfig,
+        insertionPoint: insertionPointElement,
+      };
+    }
+
+    jss.setup(setupConfig);
+
+    this.renderStyleSheet(this.props);
+  }
+
+  componentWillUnmount() {
+    this.removeStyleSheet();
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<{}>,
+    snapshot?: any
+  ): void {
+    this.removeStyleSheet();
+    this.renderStyleSheet(this.props);
+  }
+
+  renderStyleSheet = (props: Props): void => {
+    const { decorationInfo, desktopStartWidth, desktopLargeStartWidth } = props;
+
+    const isDarkMode = DecorationUtils.isDarkMode(decorationInfo);
+    const theme = DecorationUtils.getCharacterTheme(decorationInfo);
+    const { themeColor, isDefault } = theme;
+
+    this.sheet = jss.createStyleSheet({});
+
+    const themeButtonTextColor = Color(themeColor).isDark() ? "white" : "black";
+
+    if ((!isDefault && themeColor) || (isDarkMode && themeColor)) {
+      this.sheet.addRules({
+        "@global": {
+          ".ddbc": {
+            "&-exclusive-checkbox--dark-mode": {
+              borderColor: themeColor,
+              "& .ddbc-exclusive-checkbox__slot + .ddbc-exclusive-checkbox__slot":
+                {
+                  borderColor: themeColor,
+                  "&::before": {
+                    backgroundColor: themeColor,
+                    color: themeButtonTextColor,
+                  },
+                },
+            },
+            "&-character-avatar": {
+              "&__portrait": {
+                borderColor: themeColor,
+              },
+            },
+            "&-toggle-field": {
+              "&--is-enabled": {
+                backgroundColor: Color(themeColor).lightness(80).rgb().string(),
+              },
+              "&--is-enabled &__nub": {
+                backgroundColor: themeColor,
+              },
+            },
+            "&-number-bar": {
+              "&__option": {
+                "&--active": {
+                  backgroundColor: themeColor,
+                  "&:hover": {
+                    backgroundColor: Color(themeColor)
+                      .darken(0.1)
+                      .rgb()
+                      .string(),
+                  },
+                },
+                "&--implied": {
+                  backgroundColor: Color(themeColor)
+                    .lightness(80)
+                    .rgb()
+                    .string(),
+                  "&:hover": {
+                    backgroundColor: Color(themeColor)
+                      .lightness(80)
+                      .darken(0.1)
+                      .rgb()
+                      .string(),
+                  },
+                },
+              },
+            },
+            "&-collapsible": {
+              "&--opened > &__header": {
+                borderColor: themeColor,
+              },
+            },
+            "&-xp-bar": {
+              "&__progress-inner": {
+                backgroundColor: themeColor,
+              },
+              "&__progress-marker": {
+                "&::before": {
+                  backgroundColor: themeColor,
+                },
+              },
+            },
+            "&-popout-menu": {
+              "&::before": {
+                borderBottomColor: themeColor,
+              },
+            },
+            "&-campaign-summary": {
+              borderColor: themeColor,
+            },
+          },
+          ".ct": {
+            "&-character-sheet--dark-mode, &-sidebar--is-dark-mode": {
+              colorScheme: "dark",
+              "& .ct-section-placeholder__icon": {
+                borderColor: themeColor,
+              },
+              "& .ct-campaign-pane__character-preview": {
+                borderColor: themeColor,
+              },
+              "& .ct-content-group__header": {
+                borderColor: Color(themeColor).alpha(0.4).rgb().string(),
+              },
+              "& .ct-skills__col--stat-modified": {
+                color: themeColor,
+              },
+              "& .starting-equipment-rule-slots": {
+                backgroundColor: Constants.CharacterColorEnum.DARKMODE_BLACK,
+                color: "var(--character-muted-color)",
+                borderColor: themeColor,
+                "& .starting-equipment-rule-slot": {
+                  "&-disabled, &-inactive": {
+                    backgroundColor: "rgba(55, 75, 89, 0.86)",
+                  },
+                  "& + .starting-equipment-rule-slot": {
+                    borderColor: themeColor,
+                    "&::before": {
+                      backgroundColor: themeColor,
+                      color: themeButtonTextColor,
+                    },
+                  },
+                },
+              },
+              "& .ct-equipment__builder-link-text, & .ct-extra-manage-pane__group-heading":
+                {
+                  color: themeColor,
+                },
+              "& .integrated-dice__container": {
+                borderColor: themeColor,
+                color: "#fff",
+                "&:hover": {
+                  backgroundColor: Color(themeColor).alpha(0.2).string(),
+                  border: `1px solid ${Color(themeColor)
+                    .lighten(0.1)
+                    .string()}`,
+                },
+              },
+              "& .ddbc-combat-attack__damage, & .ct-spells-spell__damage, & .ddbc-spell-damage-effect":
+                {
+                  "& .integrated-dice__container:hover": {
+                    borderWidth: "2px",
+                  },
+                },
+              "& .ct-slot-manager": {
+                "&__slot": {
+                  boxShadow: "unset",
+                  backgroundColor: SvgConstantDarkModeBackgroundColor,
+                  "&--used": {
+                    borderColor: themeColor,
+                    "&::before": {
+                      backgroundColor: themeColor,
+                    },
+                  },
+                },
+              },
+              "& .ddbc-combat-attack__damage, & .ct-spells-spell__damage, & .ddbc-spell-damage-effect, .ct-reset-pane__hitdie-manager":
+                {
+                  "& .integrated-dice__container:hover": {
+                    borderWidth: "2px",
+                  },
+                  "& .integrated-dice__container": {
+                    borderColor: themeColor,
+                    borderStyle: "solid",
+                    color: "#fff",
+                    backgroundColor: "unset",
+                    "&:hover": {
+                      backgroundColor: Color(themeColor).alpha(0.2).string(),
+                      border: `1px solid ${Color(themeColor)
+                        .lighten(0.1)
+                        .string()}`,
+                    },
+                  },
+                },
+              [this.borderClassNames]: {
+                borderColor: Color(themeColor).alpha(0.4).rgb().string(),
+              },
+              "& .line": {
+                backgroundColor: Color(themeColor).alpha(0.4).rgb().string(),
+              },
+              "& .ct-spells-filter, & .ct-inventory-filter, & .ct-extras-filter":
+                {
+                  "&__clear": {
+                    color: themeColor,
+                  },
+                  "&__advanced-callout": {
+                    backgroundColor: themeColor,
+                    color: themeButtonTextColor,
+                  },
+                  "&__active": {
+                    backgroundColor: themeColor,
+                    color: themeButtonTextColor,
+                    "&:hover": {
+                      backgroundColor: Color(themeColor)
+                        .darken(0.1)
+                        .rgb()
+                        .string(),
+                    },
+                    "&-remove-icon": {
+                      color: themeButtonTextColor,
+                      "&:hover": {
+                        backgroundColor: Color(themeColor)
+                          .darken(0.1)
+                          .rgb()
+                          .string(),
+                      },
+                    },
+                  },
+                  "&__adv": {
+                    "&-filter": {
+                      "&-button": {
+                        backgroundColor:
+                          Constants.CharacterColorEnum.DARKMODE_BLACK,
+                        color: "var(--character-muted-color)",
+                        "&:hover": {
+                          backgroundColor: Color(themeColor)
+                            .darken(0.2)
+                            .alpha(0.2)
+                            .rgb()
+                            .string(),
+                        },
+                        "&--active": {
+                          backgroundColor: themeColor,
+                          color: themeButtonTextColor,
+                          "&:hover": {
+                            backgroundColor: Color(themeColor)
+                              .darken(0.1)
+                              .rgb()
+                              .string(),
+                          },
+                        },
+                      },
+                    },
+                  },
+                },
+            },
+
+            "&-box-background": {
+              "&__content": {
+                borderColor: themeColor,
+              },
+            },
+            "&-slot-manager": {
+              "&__slot": {
+                "&--used": {
+                  "&::before": {
+                    backgroundColor: themeColor,
+                  },
+                },
+              },
+            },
+            "&-spells": {
+              "&__tab": {
+                "&-level": {
+                  "&-callout": {
+                    backgroundColor: themeColor,
+                  },
+                },
+              },
+            },
+            "&-spells-filter, &-inventory-filter": {
+              "&__active": {
+                backgroundColor: themeColor,
+                "&:hover": {
+                  backgroundColor: Color(themeColor).darken(0.1).rgb().string(),
+                },
+                "&-remove": {
+                  "&:hover": {
+                    backgroundColor: Color(themeColor)
+                      .darken(0.2)
+                      .rgb()
+                      .string(),
+                  },
+                },
+              },
+              "&__clear": {
+                color: themeColor,
+              },
+              "&__advanced": {
+                "&-callout": {
+                  backgroundColor: themeColor,
+                },
+              },
+              "&__adv": {
+                "&-filter": {
+                  "&-button": {
+                    "&--active": {
+                      backgroundColor: themeColor,
+                      "&:hover": {
+                        backgroundColor: Color(themeColor)
+                          .darken(0.1)
+                          .rgb()
+                          .string(),
+                      },
+                    },
+                  },
+                },
+              },
+            },
+            "&-spell-caster": {
+              "&__casting": {
+                "&-action": {
+                  "&-count": {
+                    color: themeColor,
+                    borderColor: themeColor,
+                  },
+                },
+              },
+            },
+            "&-spell-manager": {
+              "&__spell": {
+                "&-always": {
+                  color: themeColor,
+                },
+              },
+            },
+            "&-xp-pane": {
+              "&__change-type": {
+                "&--active": {
+                  borderColor: themeColor,
+                },
+              },
+            },
+            "&-campaign-pane": {
+              "&__character-name-text": {
+                color: themeColor,
+              },
+              "&__character-preview": {
+                borderColor: themeColor,
+              },
+            },
+            "&-character-manage-pane": {
+              "&__summary-avatar": {
+                borderColor: themeColor,
+              },
+              "&__class-list": {
+                "&-item": {
+                  "&-level": {
+                    borderColor: themeColor,
+                  },
+                },
+              },
+            },
+            "&-currency-pane": {
+              "&__total": {
+                borderColor: themeColor,
+              },
+              "&__subheader": {
+                borderColor: themeColor,
+              },
+            },
+            "&-quick-nav": {
+              "&__toggle": {
+                backgroundColor: themeColor,
+              },
+              "&__edge-toggle": {
+                backgroundColor: themeColor,
+              },
+              "&__button": {
+                borderColor: themeColor,
+                "&:hover": {
+                  borderColor: Color(themeColor).darken(0.1).rgb().string(),
+                },
+              },
+            },
+            "&-combat-tablet": {
+              "&__cta": {
+                "&-button": {
+                  borderColor: themeColor,
+                },
+              },
+            },
+            "&-combat-mobile": {
+              borderColor: themeColor,
+              "&__cta": {
+                "&-button": {
+                  borderColor: themeColor,
+                },
+              },
+              "&__extras": {
+                borderColor: themeColor,
+              },
+            },
+            "&-spells-mobile": {
+              "&__tab": {
+                "&-level": {
+                  "&-callout": {
+                    backgroundColor: themeColor,
+                  },
+                },
+              },
+            },
+            "&-status-summary-mobile": {
+              "&__health": {
+                borderColor: themeColor,
+              },
+              "&__button": {
+                borderColor: themeColor,
+                "&--active": {
+                  backgroundColor: themeColor,
+                },
+              },
+            },
+            "&-character-header": {
+              "&__group": {
+                "&--game-log": {
+                  borderColor: themeColor,
+                },
+              },
+            },
+            "&-character-header-desktop": {
+              "&__button": {
+                borderColor: themeColor,
+              },
+            },
+            "&-character-header-tablet": {
+              "&__button": {
+                borderColor: themeColor,
+              },
+            },
+            "&-tablet-box": {
+              "&__border": {
+                borderColor: themeColor,
+              },
+            },
+            "&-tablet-group": {
+              "&__header": {
+                "&-content": {
+                  color: themeColor,
+                },
+              },
+            },
+            "&-content-group": {
+              "&__header-content": {
+                color: themeColor,
+              },
+            },
+            "&-class-detail": {
+              "&__name": {
+                color: themeColor,
+              },
+            },
+            "&-creature-manage-pane": {
+              "&__group": {
+                "&-heading": {
+                  color: themeColor,
+                },
+              },
+            },
+          },
+          ".spell-caster": {
+            "&-action": {
+              "&-identifier, &-count": {
+                borderColor: themeColor,
+                color: themeColor,
+              },
+            },
+          },
+          ".body-rpgcharacter-sheet .site-bar": {
+            borderColor: themeColor,
+          },
+          ".site .ddbc": {
+            "&-theme-link": {
+              color: themeColor,
+              "&:focus, &:active, &:hover": {
+                color: themeColor,
+              },
+            },
+          },
+          ".site .ct": {
+            "&-theme-button--filled.ct-button": {
+              backgroundColor: themeColor,
+
+              "&:focus": {
+                color: "#fff",
+                backgroundColor: themeColor,
+                boxShadow: `0 0 3px 1px ${Color(themeColor)
+                  .darken(0.2)
+                  .alpha(0.2)
+                  .rgb()
+                  .string()}`,
+              },
+              "&:hover, &:active": {
+                color: "#fff",
+                backgroundColor: Color(themeColor).darken(0.1).rgb().string(),
+                boxShadow: `0 0 10px 2px ${Color(themeColor)
+                  .darken(0.2)
+                  .rgb()
+                  .string()} inset`,
+              },
+            },
+            "&-theme-button--outline.ct-button": {
+              backgroundColor: "#fff",
+              color: themeColor,
+              borderColor: themeColor,
+
+              "&:focus": {
+                backgroundColor: "#fff",
+                color: themeColor,
+                boxShadow: `0 0 3px 1px ${Color(themeColor)
+                  .darken(0.2)
+                  .alpha(0.2)
+                  .rgb()
+                  .string()}`,
+              },
+              "&:hover, &:active": {
+                backgroundColor: "#fff",
+                color: themeColor,
+                boxShadow: `0 0 2px ${Color(themeColor)
+                  .darken(0.1)
+                  .rgb()
+                  .string()}`,
+              },
+            },
+          },
+          ".site .ct-character-sheet--dark-mode .ct, .site .ct-sidebar--is-dark-mode .ct":
+            {
+              "&-theme-button--filled.ct-button": {
+                backgroundColor: themeColor,
+                color: themeButtonTextColor,
+                "&:focus": {
+                  color: themeButtonTextColor,
+                  backgroundColor: themeColor,
+                  boxShadow: `0 0 3px 1px ${Color(themeColor)
+                    .darken(0.2)
+                    .alpha(0.2)
+                    .rgb()
+                    .string()}`,
+                },
+                "&:disabled, &:disabled:hover": {
+                  backgroundColor: Color(
+                    Constants.CharacterColorEnum.DARKMODE_BLACK
+                  )
+                    .lighten(0.4)
+                    .rgb()
+                    .string(),
+                  boxShadow: "unset",
+                  color: "#627481",
+                },
+                "&:hover, &:active": {
+                  color: themeButtonTextColor,
+                  backgroundColor: Color(themeColor).darken(0.1).rgb().string(),
+                  boxShadow: `0 0 10px 2px ${Color(themeColor)
+                    .darken(0.2)
+                    .rgb()
+                    .string()} inset`,
+                },
+              },
+              "&-theme-button--outline.ct-button": {
+                backgroundColor: "#10161adb",
+                color: "white",
+                borderColor: themeColor,
+
+                "&:focus": {
+                  backgroundColor: Color(themeColor).alpha(0.2).rgb().string(),
+                  color: "white",
+                  boxShadow: `0 0 3px 1px ${Color(themeColor)
+                    .darken(0.2)
+                    .alpha(0.2)
+                    .rgb()
+                    .string()}`,
+                },
+                "&:hover, &:active": {
+                  backgroundColor: Color(themeColor).alpha(0.2).rgb().string(),
+                  color: "white",
+                  boxShadow: `0 0 2px ${Color(themeColor)
+                    .darken(0.1)
+                    .rgb()
+                    .string()}`,
+                },
+                "&:disabled, &:disabled:hover": {
+                  color: "#627481",
+                  boxShadow: "unset",
+                  backgroundColor: "#000",
+                  borderColor: "#627481",
+                },
+              },
+              "&-theme-input": {
+                backgroundColor: "#10161adb",
+                color: "white",
+                borderColor: themeColor,
+
+                "&:focus": {
+                  backgroundColor: "#10161adb",
+                  color: "white",
+                  boxShadow: `0 0 3px 1px ${Color(themeColor)
+                    .darken(0.2)
+                    .alpha(0.2)
+                    .rgb()
+                    .string()}`,
+                },
+                "&:hover, &:active": {
+                  backgroundColor: "#10161adb",
+                  color: "white",
+                  boxShadow: `0 0 2px ${Color(themeColor)
+                    .darken(0.1)
+                    .rgb()
+                    .string()}`,
+                },
+              },
+            },
+          ".site .ct-character-sheet--dark-mode": {
+            "& .ddbc": {
+              "&-saving-throws-summary": {
+                "& .integrated-dice__container": {
+                  "&:hover": {
+                    border: "0",
+                    backgroundColor: "transparent",
+                  },
+                  "&:hover ~ .ddbc-saving-throw-selection-small-box-svg": {
+                    fill: Color(themeColor).alpha(0.2).rgb().string(),
+                  },
+                  "&:hover ~ .ddbc-saving-throw-selection-box-svg": {
+                    fill: Color(themeColor).alpha(0.2).rgb().string(),
+                  },
+                },
+                "& .ddbc-saving-throw-selection-small-box-svg path": {
+                  stroke: Color(themeColor).rgb().string(),
+                },
+                "& .ddbc-saving-throw-selection-box-svg path": {
+                  stroke: Color(themeColor).rgb().string(),
+                },
+              },
+            },
+          },
+          ".ct-inventory__action": {
+            color: Color(themeColor).rgb().string(),
+          },
+        },
+      } as any);
+    }
+
+    if (this.sheet) {
+      this.sheet.attach();
+    }
+  };
+
+  removeStyleSheet = (): void => {
+    if (this.sheet) {
+      jss.removeStyleSheet(this.sheet);
+      this.sheet = null;
+    }
+  };
+
+  render() {
+    return null;
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/ThemeStyles/index.ts b/ddb_main/tools/js/smartComponents/ThemeStyles/index.ts
new file mode 100644
index 0000000..b7facd0
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/ThemeStyles/index.ts
@@ -0,0 +1,4 @@
+import ThemeStyles from "./ThemeStyles";
+
+export default ThemeStyles;
+export { ThemeStyles };
diff --git a/ddb_main/tools/js/smartComponents/UserPreference/UserPreference.tsx b/ddb_main/tools/js/smartComponents/UserPreference/UserPreference.tsx
new file mode 100644
index 0000000..82e9dbe
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/UserPreference/UserPreference.tsx
@@ -0,0 +1,75 @@
+import { createContext, useEffect, useState } from "react";
+
+import { RuleData } from "@dndbeyond/character-rules-engine/es";
+
+import {
+  getUserPreferences,
+  updateUserPreferences,
+  getRulesData,
+} from "~/helpers/characterServiceApi";
+import { UserPreferences } from "~/types";
+
+import PreferenceUpdateLocation from "../../Shared/constants/PreferenceUpdateLocation";
+
+interface UserPreferenceContextProps extends UserPreferences {
+  updatePreferences: (updated: UserPreferences) => void;
+  ruleData: RuleData | null;
+}
+
+const initialValue = {
+  abilityScoreDisplayType: 2,
+  privacyType: 2,
+  isDarkModeEnabled: false,
+  isDiceRollingEnabled: true,
+  updateLocation: PreferenceUpdateLocation.CharacterBuilder,
+  updatePreferences: () => {},
+  ruleData: null,
+  defaultEnabledSourceCategories: {},
+  isHomebrewEnabled: true,
+};
+
+export const UserPreferenceContext =
+  createContext<UserPreferenceContextProps>(initialValue);
+
+export const UserPreferenceProvider = ({ children }) => {
+  const [preferences, setPreferences] = useState(initialValue);
+  const [isLoaded, setIsLoaded] = useState(false);
+  const [ruleData, setRuleData] = useState(null);
+
+  const updatePreferences = (updated: UserPreferences) => {
+    setPreferences((prev) => {
+      return { ...prev, ...updated };
+    });
+  };
+
+  const getPreferences = async () => {
+    const userPreferences = await getUserPreferences();
+    const userPreferencesJSON = await userPreferences.json();
+
+    const rulesData = await getRulesData();
+    const rulesDataJSON = await rulesData.json();
+
+    setRuleData(rulesDataJSON.data);
+    updatePreferences(userPreferencesJSON.data);
+    setIsLoaded(true);
+  };
+
+  useEffect(() => {
+    getPreferences();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  useEffect(() => {
+    if (isLoaded) {
+      updateUserPreferences(preferences);
+    }
+  }, [preferences]);
+
+  return (
+    <UserPreferenceContext.Provider
+      value={{ ...preferences, updatePreferences, ruleData }}
+    >
+      {children}
+    </UserPreferenceContext.Provider>
+  );
+};
diff --git a/ddb_main/tools/js/smartComponents/XpBar/XpBar.tsx b/ddb_main/tools/js/smartComponents/XpBar/XpBar.tsx
new file mode 100644
index 0000000..f993659
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/XpBar/XpBar.tsx
@@ -0,0 +1,72 @@
+import * as React from "react";
+
+import {
+  CharacterUtils,
+  FormatUtils,
+  RuleData,
+  RuleDataUtils,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props {
+  className: string;
+  xp: number;
+  showCurrentMarker: boolean;
+  ruleData: RuleData;
+}
+export default class XpBar extends React.PureComponent<Props> {
+  static defaultProps = {
+    showCurrentMarker: false,
+    className: "",
+  };
+
+  render() {
+    const { xp, showCurrentMarker, ruleData, className } = this.props;
+
+    let level = CharacterUtils.deriveXpLevel(xp, ruleData);
+    const maxCharacterLevel = RuleDataUtils.getMaxCharacterLevel(ruleData);
+    const nextLevel: number = Math.min(level + 1, maxCharacterLevel);
+
+    let xpBarStyles: React.CSSProperties = {};
+    if (level < maxCharacterLevel) {
+      const currentLevelXp = CharacterUtils.deriveCurrentLevelXp(
+        level,
+        ruleData
+      );
+      const nextLevelXp = CharacterUtils.deriveNextLevelXp(level, ruleData);
+      const percentage: string =
+        ((xp - currentLevelXp) / (nextLevelXp - currentLevelXp)) * 100 + "%";
+      xpBarStyles = {
+        width: percentage,
+      };
+    }
+
+    const displayCurrentLevel: number =
+      level === maxCharacterLevel ? maxCharacterLevel - 1 : level;
+
+    let classNames: Array<string> = [className, "ddbc-xp-bar"];
+
+    return (
+      <div className={classNames.join(" ")}>
+        <span className="ddbc-xp-bar__item ddbc-xp-bar__item--cur">
+          <span className="ddbc-xp-bar__label">LVL {displayCurrentLevel}</span>
+        </span>
+        <span className="ddbc-xp-bar__item ddbc-xp-bar__item--progress">
+          <span className="ddbc-xp-bar__progress">
+            <span className="ddbc-xp-bar__progress-inner" style={xpBarStyles}>
+              {showCurrentMarker && (
+                <span className="ddbc-xp-bar__progress-marker">
+                  <span className="ddbc-xp-bar__progress-marker-amount">
+                    {FormatUtils.renderLocaleNumber(xp)}
+                  </span>
+                </span>
+              )}
+            </span>
+          </span>
+        </span>
+        <span className="ddbc-xp-bar__item ddbc-xp-bar__item--next">
+          <span className="ddbc-xp-bar__label">LVL {nextLevel}</span>
+        </span>
+      </div>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/XpBar/index.ts b/ddb_main/tools/js/smartComponents/XpBar/index.ts
new file mode 100644
index 0000000..5656548
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/XpBar/index.ts
@@ -0,0 +1,4 @@
+import XpBar from "./XpBar";
+
+export default XpBar;
+export { XpBar };
diff --git a/ddb_main/tools/js/smartComponents/componentConstants/shared/DataLoadingStatusEnum.ts b/ddb_main/tools/js/smartComponents/componentConstants/shared/DataLoadingStatusEnum.ts
new file mode 100644
index 0000000..75bf94a
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/componentConstants/shared/DataLoadingStatusEnum.ts
@@ -0,0 +1,8 @@
+enum DataLoadingStatusEnum {
+  NOT_INITIALIZED = "NOT_INITIALIZED",
+  NOT_LOADED = "NOT_LOADED",
+  LOADING = "LOADING",
+  LOADED = "LOADED",
+}
+
+export default DataLoadingStatusEnum;
diff --git a/ddb_main/tools/js/smartComponents/legacy/Button/Button.tsx b/ddb_main/tools/js/smartComponents/legacy/Button/Button.tsx
new file mode 100644
index 0000000..a1eb420
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/legacy/Button/Button.tsx
@@ -0,0 +1,242 @@
+import React from "react";
+
+export interface ButtonProps {
+  onClick?: ((evt: React.MouseEvent) => void) | (() => void);
+  clsNames?: Array<string>;
+  className: string;
+  disabled?: boolean;
+  styledDisabled: boolean;
+  block?: boolean;
+  size?: string;
+  style?: string;
+  active?: boolean;
+  stopPropagation: boolean;
+  enableConfirm: boolean;
+  confirmText: string;
+  confirmDuration: number;
+  confirmSuccessDuration: number;
+  isInteractive: boolean;
+  role: string;
+}
+interface ButtonState {
+  isConfirming: boolean;
+  isConfirmed: boolean;
+  currentDuration: number;
+  confirmText: string;
+}
+export class Button extends React.PureComponent<ButtonProps, ButtonState> {
+  static defaultProps = {
+    className: "",
+    styledDisabled: false,
+    stopPropagation: true,
+    enableConfirm: false,
+    confirmText: "Confirm",
+    confirmDuration: 3000,
+    confirmSuccessDuration: 1000,
+    isInteractive: true,
+    role: "button",
+  };
+
+  confirmIntervalId: number;
+  confirmSuccessTimeoutId: number;
+
+  constructor(props: ButtonProps) {
+    super(props);
+
+    this.state = {
+      isConfirming: false,
+      isConfirmed: false,
+      currentDuration: 0,
+      confirmText: "",
+    };
+  }
+
+  componentWillUnmount() {
+    clearTimeout(this.confirmSuccessTimeoutId);
+    clearInterval(this.confirmIntervalId);
+  }
+
+  handleConfirmClick = (evt: React.MouseEvent<HTMLButtonElement>): void => {
+    const { isConfirming, isConfirmed } = this.state;
+    const {
+      confirmText,
+      stopPropagation,
+      confirmDuration,
+      confirmSuccessDuration,
+      onClick,
+    } = this.props;
+
+    if (stopPropagation) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+    }
+
+    if (isConfirmed) {
+      this.setState({
+        isConfirmed: false,
+      });
+      clearTimeout(this.confirmSuccessTimeoutId);
+      return;
+    }
+
+    if (isConfirming) {
+      this.setState({
+        isConfirming: false,
+        currentDuration: 0,
+        isConfirmed: true,
+      });
+      if (onClick) {
+        onClick(evt);
+      }
+      clearInterval(this.confirmIntervalId);
+      this.confirmSuccessTimeoutId = window.setTimeout(() => {
+        this.setState({
+          isConfirmed: false,
+        });
+      }, confirmSuccessDuration);
+    } else {
+      this.setState({
+        isConfirming: true,
+        confirmText: `${confirmText} (${Math.round(confirmDuration / 1000)})`,
+        currentDuration: 1000,
+      });
+
+      this.confirmIntervalId = window.setInterval(() => {
+        if (this.state.currentDuration >= confirmDuration) {
+          clearInterval(this.confirmIntervalId);
+          this.setState({
+            isConfirming: false,
+            currentDuration: 0,
+          });
+        } else {
+          this.setState((prevState) => ({
+            confirmText: `${confirmText} (${Math.round(
+              (confirmDuration - prevState.currentDuration) / 1000
+            )})`,
+            currentDuration: prevState.currentDuration + 1000,
+          }));
+        }
+      }, 1000);
+    }
+  };
+
+  handleClick = (evt: React.MouseEvent<HTMLButtonElement>): void => {
+    const { onClick, stopPropagation, isInteractive } = this.props;
+
+    if (onClick && isInteractive) {
+      if (stopPropagation) {
+        evt.stopPropagation();
+        evt.nativeEvent.stopImmediatePropagation();
+      }
+
+      onClick(evt);
+    }
+  };
+
+  render() {
+    const { isConfirming, isConfirmed, confirmText } = this.state;
+    const {
+      children,
+      className,
+      clsNames,
+      disabled,
+      styledDisabled,
+      size,
+      block,
+      active,
+      style,
+      enableConfirm,
+      role,
+      confirmSuccessDuration, // to be ignored on props spread
+      confirmDuration, // to be ignored on props spread
+      confirmText: _confirmText, // to be ignored on props spread
+      isInteractive, // to be ignored on props spread
+      stopPropagation, // to be ignored on props spread
+      ...restProps
+    } = this.props;
+
+    let buttonBase: string = "character-button";
+    let btnClassNames: Array<string> = [
+      className,
+      "ct-button",
+      buttonBase,
+      "ddbc-button",
+    ];
+
+    let buttonSizeBase: string = buttonBase;
+    if (block) {
+      buttonSizeBase += "-block";
+    }
+
+    switch (size) {
+      case "oversized":
+      case "large":
+      case "medium":
+      case "small":
+        btnClassNames.push(`${buttonSizeBase}-${size}`);
+        break;
+      default:
+        btnClassNames.push(`${buttonSizeBase}`);
+    }
+
+    let buttonStyleBase: string = buttonBase;
+
+    switch (style) {
+      case "dark":
+        btnClassNames.push(
+          active ? `${buttonStyleBase}-dark-active` : `${buttonStyleBase}-dark`
+        );
+        break;
+      case "modal":
+      case "modal-cancel":
+        btnClassNames.push(`${buttonStyleBase}-${style}`);
+        break;
+      case "outline":
+        btnClassNames.push(`${buttonStyleBase}-outline`);
+        break;
+      default:
+        if (active) {
+          btnClassNames.push(`${buttonStyleBase}-active`);
+        }
+    }
+
+    if (styledDisabled && disabled) {
+      btnClassNames.push(`${buttonBase}--disabled`);
+    }
+
+    if (clsNames) {
+      btnClassNames = [...btnClassNames, ...clsNames];
+    }
+
+    if (enableConfirm) {
+      btnClassNames.push("ct-button--confirm");
+
+      if (isConfirming) {
+        btnClassNames.push("ct-button--is-confirming");
+      }
+      if (isConfirmed) {
+        btnClassNames.push("ct-button--is-confirmed");
+      }
+    }
+
+    return (
+      <button
+        {...restProps}
+        disabled={!styledDisabled && disabled}
+        onClick={enableConfirm ? this.handleConfirmClick : this.handleClick}
+        className={btnClassNames.join(" ")}
+        role={role}
+      >
+        <span className="ct-button__content">{children}</span>
+        {enableConfirm && (
+          <React.Fragment>
+            <span className="ct-button__confirming">{confirmText}</span>
+            <span className="ct-button__confirmed" />
+          </React.Fragment>
+        )}
+      </button>
+    );
+  }
+}
+
+export default Button;
diff --git a/ddb_main/tools/js/smartComponents/legacy/Button/RemoveButton/RemoveButton.tsx b/ddb_main/tools/js/smartComponents/legacy/Button/RemoveButton/RemoveButton.tsx
new file mode 100644
index 0000000..46f1747
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/legacy/Button/RemoveButton/RemoveButton.tsx
@@ -0,0 +1,39 @@
+import React from "react";
+
+import Button, { ButtonProps } from "../Button";
+
+//Duplicated from CharacterToolsClient
+// ToolsClient implements as a ThemeButton wrapper
+// eventually RemoveButton usage should be replaced with this one with specialized style overrides
+
+export interface RemoveButtonProps extends Partial<ButtonProps> {}
+const RemoveButton: React.FunctionComponent<RemoveButtonProps> = ({
+  size = "small",
+  style = "outline",
+  stopPropagation = true,
+  children,
+  className,
+  ...restProps
+}) => {
+  let classNames: Array<string> = [
+    "ddbc-remove-button",
+    "character-button-remove",
+  ];
+  if (className) {
+    classNames.push(className);
+  }
+
+  return (
+    <Button
+      {...restProps}
+      size={size}
+      style={style}
+      stopPropagation={stopPropagation}
+      className={classNames.join(" ")}
+    >
+      {children ? children : "Remove"}
+    </Button>
+  );
+};
+
+export default RemoveButton;
diff --git a/ddb_main/tools/js/smartComponents/legacy/Button/RemoveButton/index.ts b/ddb_main/tools/js/smartComponents/legacy/Button/RemoveButton/index.ts
new file mode 100644
index 0000000..baeabe8
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/legacy/Button/RemoveButton/index.ts
@@ -0,0 +1,4 @@
+import RemoveButton from "./RemoveButton";
+
+export default RemoveButton;
+export { RemoveButton };
diff --git a/ddb_main/tools/js/smartComponents/legacy/Select/Select.tsx b/ddb_main/tools/js/smartComponents/legacy/Select/Select.tsx
new file mode 100644
index 0000000..4ace6db
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/legacy/Select/Select.tsx
@@ -0,0 +1,244 @@
+import React from "react";
+
+import {
+  ApiAdapterPromise,
+  ApiAdapterUtils,
+  ApiResponse,
+} from "@dndbeyond/character-rules-engine/es";
+
+interface Props<T extends any = any, TData extends any = any> {
+  loadOptions?: () => ApiAdapterPromise<ApiResponse<Array<TData>>>;
+  clsNames: Array<string>;
+  id?: any; //TODO type?
+  options: Array<any>; //TODO type Options
+  disabled: boolean;
+  value: React.ReactText | null;
+  placeholder: string;
+  onChange?: (value: string) => void;
+  onChangePromise?: (
+    newValue: string,
+    oldValue: string,
+    accept: () => void,
+    reject: () => void
+  ) => void;
+  parseLoadedOptions?: (data: Array<TData>) => Array<T>;
+  resetAfterChoice: boolean;
+  initialOptionRemoved: boolean;
+  preventClickPropagating: boolean;
+  isReadonly?: boolean;
+  className: string;
+}
+interface State {
+  isLazy: boolean;
+  lazyOptions: Array<any>;
+  value: React.ReactText;
+  resetAfterChoiceValues: Array<string>;
+}
+export default class Select extends React.Component<Props, State> {
+  static defaultProps = {
+    clsNames: [],
+    className: "",
+    disabled: false,
+    resetAfterChoice: false,
+    initialOptionRemoved: false,
+    placeholder: "-- Choose an Option --",
+    options: [],
+    preventClickPropagating: false,
+  };
+
+  constructor(props: Props) {
+    super(props);
+
+    this.state = {
+      isLazy: !!props.loadOptions,
+      lazyOptions: [],
+      value: props.value === null ? "" : props.value,
+      resetAfterChoiceValues: this.getResetAfterValueChoices(props),
+    };
+  }
+
+  componentDidUpdate(
+    prevProps: Readonly<Props>,
+    prevState: Readonly<State>,
+    snapshot?: any
+  ): void {
+    const { value } = this.props;
+
+    if (value !== prevProps.value) {
+      this.setState({
+        value: value === null ? "" : value,
+      });
+    }
+  }
+
+  componentDidMount() {
+    const { isLazy } = this.state;
+    const { loadOptions, parseLoadedOptions } = this.props;
+
+    if (isLazy && loadOptions && parseLoadedOptions) {
+      loadOptions().then((response) => {
+        const data = ApiAdapterUtils.getResponseData(response);
+        if (data === null) {
+          return;
+        }
+
+        this.setState({
+          lazyOptions: parseLoadedOptions(data),
+        });
+      });
+    }
+  }
+
+  getResetAfterValueChoices = (props: Props): Array<string> => {
+    const { options, resetAfterChoice } = props;
+
+    if (resetAfterChoice) {
+      return options.reduce((acc, option) => {
+        if (option.options) {
+          acc.push(...option.options.map((opt) => "" + opt.value));
+        } else {
+          acc.push("" + option.value);
+        }
+        return acc;
+      }, []);
+    }
+
+    return options.reduce((acc, option) => {
+      if (option.options && option.resetAfterChoice) {
+        acc.push(...option.options.map((opt) => "" + opt.value));
+      }
+      return acc;
+    }, []);
+  };
+
+  handleChange = (evt: React.ChangeEvent<HTMLSelectElement>): void => {
+    const { value, resetAfterChoiceValues } = this.state;
+    const { onChangePromise, onChange, resetAfterChoice } = this.props;
+
+    const newValue: string = evt.target.value;
+
+    if (onChangePromise) {
+      onChangePromise(
+        newValue,
+        String(value),
+        () => {
+          this.setState({
+            value: newValue,
+          });
+
+          if (onChange) {
+            onChange(newValue);
+          }
+
+          if (resetAfterChoice) {
+            evt.target.selectedIndex = 0;
+          }
+        },
+        () => {}
+      );
+    } else {
+      if (resetAfterChoice || resetAfterChoiceValues.includes(newValue)) {
+        evt.target.selectedIndex = 0;
+      } else {
+        this.setState({
+          value: newValue,
+        });
+      }
+
+      if (onChange) {
+        onChange(newValue);
+      }
+    }
+  };
+
+  handleClick = (evt: React.MouseEvent): void => {
+    const { preventClickPropagating } = this.props;
+
+    if (preventClickPropagating) {
+      evt.stopPropagation();
+      evt.nativeEvent.stopImmediatePropagation();
+    }
+  };
+
+  renderOption = (option: any): React.ReactNode => {
+    return (
+      <option
+        key={option.value}
+        value={String(option.value)}
+        disabled={option.disabled}
+      >
+        {option.label}
+      </option>
+    );
+  };
+
+  renderOptGroup = (
+    label: string,
+    options: Array<any>,
+    resetAfterChoice: boolean
+  ) => {
+    if (!options.length) {
+      return null;
+    }
+    return (
+      <optgroup label={label} key={label}>
+        {options.map((option) => this.renderOption(option))}
+      </optgroup>
+    );
+  };
+
+  render() {
+    const { isLazy, lazyOptions, value } = this.state;
+    const {
+      options,
+      placeholder,
+      initialOptionRemoved,
+      id,
+      disabled,
+      clsNames,
+      isReadonly,
+      className,
+    } = this.props;
+
+    let displayOptions: Array<any> = options;
+    if (isLazy) {
+      displayOptions = lazyOptions;
+    }
+
+    const conClassNames: Array<string> = [
+      "ddbc-select",
+      ...clsNames,
+      className,
+    ];
+
+    return (
+      <select
+        id={id}
+        className={conClassNames.join(" ")}
+        value={value}
+        onChange={this.handleChange}
+        onClick={this.handleClick}
+        disabled={disabled || isReadonly}
+      >
+        <option
+          value=""
+          disabled={initialOptionRemoved}
+          hidden={initialOptionRemoved}
+        >
+          {placeholder}
+        </option>
+        {displayOptions.map((option) => {
+          if (option.options) {
+            return this.renderOptGroup(
+              option.optGroupLabel,
+              option.options,
+              option.resetAfterChoice
+            );
+          } else {
+            return this.renderOption(option);
+          }
+        })}
+      </select>
+    );
+  }
+}
diff --git a/ddb_main/tools/js/smartComponents/legacy/Select/index.ts b/ddb_main/tools/js/smartComponents/legacy/Select/index.ts
new file mode 100644
index 0000000..4e10095
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/legacy/Select/index.ts
@@ -0,0 +1,4 @@
+import Select from "./Select";
+
+export default Select;
+export { Select };
diff --git a/ddb_main/tools/js/smartComponents/utils/Dice/hacks.ts b/ddb_main/tools/js/smartComponents/utils/Dice/hacks.ts
new file mode 100644
index 0000000..7ce26e7
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/utils/Dice/hacks.ts
@@ -0,0 +1,98 @@
+import { orderBy } from "lodash";
+
+import { Constants } from "@dndbeyond/character-rules-engine/es";
+import { DiceOperation, DieTerm, RollRequest } from "@dndbeyond/dice";
+
+interface Hack__OrderableDieValueInfo {
+  idx: number;
+  value: number;
+}
+
+/**
+ * generate lookup of dieTerm.dice idx to DieTerm
+ * for RollValueContract dieType
+ *
+ * @param rollRequestResult
+ */
+export function hack__generateDiceRollResultTermLookup(
+  rollRequestResult: RollRequest
+): Record<number, DieTerm> {
+  const hack__diceRollResultTermLookup: Record<number, DieTerm> = {};
+
+  let dieCurrentIdx: number = 0;
+  rollRequestResult.rolls[0].diceNotation.set.forEach((dieTerm) => {
+    dieTerm.dice.forEach((die) => {
+      hack__diceRollResultTermLookup[dieCurrentIdx] = dieTerm;
+      dieCurrentIdx++;
+    });
+  });
+
+  return hack__diceRollResultTermLookup;
+}
+
+/**
+ * generate lookup of RollResult.values array idx to DiceRollExcludeTypeEnum
+ * for RollValueContract excludeType
+ *
+ * @param rollRequestResult
+ */
+export function hack__generateDiceRollResultValueExcludeTypeLookup(
+  rollRequestResult: RollRequest
+): Record<number, Constants.DiceRollExcludeTypeEnum> {
+  const hack__diceRollResultValueExcludeTypeLookup: Record<
+    number,
+    Constants.DiceRollExcludeTypeEnum
+  > = {};
+
+  //RollResult | undefined - RollResult is not exported from Dice;
+  //  only expect to have one single rollRequest.
+  const rollResult = rollRequestResult.rolls[0].result;
+
+  let dieGroupStartIdx: number = 0;
+
+  rollRequestResult.rolls[0].diceNotation.set.forEach((dieTerm) => {
+    let diceCount = dieTerm.count;
+
+    //determine sortOrder based on dieTerm.operation
+    let sortOrder: "asc" | "desc" | null = null;
+    switch (dieTerm.operation) {
+      case DiceOperation.Min:
+        sortOrder = "asc";
+        break;
+      case DiceOperation.Max:
+      default:
+        sortOrder = "desc";
+    }
+
+    let dieTermResults =
+      rollResult?.values.slice(
+        dieGroupStartIdx,
+        dieGroupStartIdx + diceCount
+      ) ?? [];
+    let hack__orderableDieValueInfos: Array<Hack__OrderableDieValueInfo> =
+      dieTermResults.map((value, idx) => ({
+        idx: dieGroupStartIdx + idx,
+        value,
+      }));
+    let orderedDieTermResults = orderBy(
+      hack__orderableDieValueInfos,
+      (valueInfo) => valueInfo.value,
+      sortOrder
+    );
+
+    //build-up hack__diceRollResultValueExcludeTypeLookup
+    orderedDieTermResults.slice(0, dieTerm.operand).forEach((dieTermResult) => {
+      hack__diceRollResultValueExcludeTypeLookup[dieTermResult.idx] =
+        Constants.DiceRollExcludeTypeEnum.ALL;
+    });
+    orderedDieTermResults.slice(dieTerm.operand).forEach((dieTermResult) => {
+      hack__diceRollResultValueExcludeTypeLookup[dieTermResult.idx] =
+        Constants.DiceRollExcludeTypeEnum.NONE;
+    });
+
+    //move diceGroupStartIdx
+    dieGroupStartIdx += diceCount;
+  });
+
+  return hack__diceRollResultValueExcludeTypeLookup;
+}
diff --git a/ddb_main/tools/js/smartComponents/utils/Dice/utils.ts b/ddb_main/tools/js/smartComponents/utils/Dice/utils.ts
new file mode 100644
index 0000000..f2ac0b9
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/utils/Dice/utils.ts
@@ -0,0 +1,160 @@
+import {
+  DiceUtils,
+  DiceContract,
+  RollValueContract,
+  HelperUtils,
+} from "@dndbeyond/character-rules-engine/es";
+import {
+  DiceEvent,
+  Dice,
+  RollRequest,
+  RollType,
+  RollKind,
+  DiceNotation,
+} from "@dndbeyond/dice";
+
+import { DiceComponentUtils, TypeScriptUtils } from "../index";
+import {
+  hack__generateDiceRollResultTermLookup,
+  hack__generateDiceRollResultValueExcludeTypeLookup,
+} from "./hacks";
+
+/**
+ * Adds an event listener that sets the state variable isCriticalHit to false when a roll is performed
+ * that is not this component's to-hit roll
+ *
+ * Note: Move this to a hook if the components go classless
+ */
+export function setupResetCritStateOnRoll(
+  rollAction: string,
+  rollNode: React.ReactNode
+): (eventData: any) => void {
+  let handler = _handler.bind(undefined, rollAction, rollNode);
+  Dice.addEventListener(DiceEvent.ROLL, handler);
+  return handler;
+}
+
+export function _handler(
+  rollAction: string,
+  rollNode: React.PureComponent<any, any>,
+  result: RollRequest
+): void {
+  let shouldResetCritState =
+    // A multi-roll was performed
+    result.rolls.length !== 1 ||
+    // A roll from another action was performed
+    rollAction != result.action ||
+    // This didn't have a to-hit roll, and we already know it is this same action
+    result.rolls.find((r) => r.rollType != RollType.ToHit);
+
+  if (shouldResetCritState) {
+    rollNode?.setState({ isCriticalHit: false });
+  }
+}
+
+/**
+ * Checks for a critical hit
+ */
+export function isCriticalRoll(result: RollRequest): boolean {
+  // Does this roll have a to-hit roll?
+  const hitRoll = result.rolls.find((r) => r.rollType == RollType.ToHit);
+  if (hitRoll) {
+    const minRollForCrit: number = 20;
+    let numCritRolls: number =
+      hitRoll.result?.values.filter((v) => v >= minRollForCrit).length ?? 0;
+
+    let critRoll: boolean = false;
+    switch (hitRoll.rollKind) {
+      case RollKind.Disadvantage:
+        critRoll = numCritRolls >= 2;
+        break;
+      case RollKind.Advantage:
+      default:
+        critRoll = numCritRolls > 0;
+        break;
+    }
+    return critRoll;
+  }
+  return false;
+}
+
+/**
+ * Returns a dice notation string taking into account the current state
+ * (doubles damage dice when in critical hit state)
+ *
+ * @param isCriticalHit Flags if the dice notation is in a critical hit state
+ * @param damage Normally displayed damage
+ */
+export function getDamageDiceNotation(
+  damage: number | DiceContract | null,
+  isCriticalHit?: boolean
+): string {
+  if (typeof damage === "number") {
+    return damage.toString();
+  }
+
+  if (!isCriticalHit) {
+    return DiceUtils.renderDice(damage);
+  }
+
+  let dn = DiceNotation.parseDiceNotation(DiceUtils.renderDice(damage));
+  for (let i = 0; i < dn.set.length; i++) {
+    // Double the dice on each term
+    dn.set[i].count *= 2;
+  }
+  return dn.toDiceNotationString();
+}
+
+/**
+ *
+ * @param dieType
+ */
+export function getDieTypeValue(dieType: string): number {
+  return Number(dieType.substr(1));
+}
+
+/**
+ * Returns Array<RollValueContract> given the a rollRequestResult with a single RollResult
+ *
+ * @param rollRequestResult
+ */
+export function generateRollValueContracts(
+  rollRequestResult: RollRequest
+): Array<RollValueContract> | null {
+  //these hacks make it easier to grab the data from the dice api until the api is updated
+  const hack__diceRollResultTermLookup =
+    hack__generateDiceRollResultTermLookup(rollRequestResult);
+  const hack__diceRollResultValueExcludeTypeLookup =
+    hack__generateDiceRollResultValueExcludeTypeLookup(rollRequestResult);
+
+  //RollResult | undefined - RollResult is not exported from Dice;
+  //  only expect to have one single rollRequest.
+  const rollResult = rollRequestResult.rolls[0].result ?? null;
+
+  if (!rollResult) {
+    return null;
+  }
+
+  return rollResult.values
+    .map((value, idx) => {
+      const dieTerm = HelperUtils.lookupDataOrFallback(
+        hack__diceRollResultTermLookup,
+        idx
+      );
+      const excludeType = HelperUtils.lookupDataOrFallback(
+        hack__diceRollResultValueExcludeTypeLookup,
+        idx
+      );
+
+      if (!dieTerm || !excludeType) {
+        return null;
+      }
+
+      return {
+        value,
+        dieType: DiceComponentUtils.getDieTypeValue(dieTerm.dieType),
+        excludeType,
+      };
+    })
+    .filter(TypeScriptUtils.isNotNullOrUndefined);
+}
diff --git a/ddb_main/tools/js/smartComponents/utils/TypeScriptUtils.ts b/ddb_main/tools/js/smartComponents/utils/TypeScriptUtils.ts
new file mode 100644
index 0000000..959de77
--- /dev/null
+++ b/ddb_main/tools/js/smartComponents/utils/TypeScriptUtils.ts
@@ -0,0 +1,11 @@
+/**
+ * https://github.com/Microsoft/TypeScript/issues/16069#issuecomment-369374214
+ * Used to get around array filter function that errors because it doesn't recognize the filter
+ * is removing nulls
+ * @param input
+ */
+export function isNotNullOrUndefined<T extends Object>(
+  input: null | undefined | T
+): input is T {
+  return input !== null;
+}
diff --git a/ddb_main/types.ts b/ddb_main/types.ts
new file mode 100644
index 0000000..9397680
--- /dev/null
+++ b/ddb_main/types.ts
@@ -0,0 +1,153 @@
+import PreferenceUpdateLocation from "./tools/js/Shared/constants/PreferenceUpdateLocation";
+
+// Export all types from rules engine to minimize touchpoints
+export * from "@dndbeyond/character-rules-engine/es/aliases/Typings";
+
+export interface QueryResponseData {
+  data: CharacterListContract;
+}
+export interface CharacterListContract {
+  characters: Array<ShortCharacterContract>;
+  characterSlotLimit: number | null;
+  canUnlockCharacters: boolean;
+}
+
+// TODO this is also the same short character as the RE genereted.. that one is outedate.. can we share?
+export interface ShortCharacterContract {
+  avatarUrl: string;
+  backdropUrl: string;
+  campaignId: number | null;
+  campaignName: string | null;
+  characterSecondaryInfo: string;
+  classDescription: string;
+  coverImageUrl: string;
+  createdDate: number;
+  id: number;
+  isAssigned: boolean;
+  isReady: boolean;
+  lastModifiedDate: number;
+  level: number;
+  name: string;
+  raceName: string;
+  status: CharacterStatusEnum;
+  statusSlug: string;
+}
+export enum CharacterStatusEnum {
+  Active = 1,
+  Deleted = 2,
+  Locked = 3,
+}
+
+export interface CharacterData extends ShortCharacterContract {
+  userName: string | null;
+}
+export interface AppData {
+  characters: Array<CharacterData>;
+  maxCharacterSlotsAllowed: number | null;
+  hasLockedCharacters: boolean;
+}
+
+//SORTING TYPES
+export enum SortTypeEnum {
+  Created = "created",
+  Name = "name",
+  Level = "level",
+  Modified = "modified",
+}
+
+export enum SortOrderEnum {
+  Ascending = "asc",
+  Descending = "desc",
+}
+
+export interface LogEventOptions {
+  category: string;
+  action: string;
+  label?: string;
+  value?: string;
+}
+
+export type NumberDisplayType = "weightInLb" | "distanceInFt" | "signed";
+
+/**
+ * These types are cuz typescript 4.4 is not compatible with babylon.js v4
+ * waiting for v5
+ */
+
+export interface WebGLObject {}
+
+// export declare var WebGLObject: {
+//   prototype: WebGLObject;
+//   new (): WebGLObject;
+// };
+
+export interface ImageEncodeOptions {
+  quality?: number;
+  type?: string;
+}
+
+export interface OffscreenCanvas extends EventTarget {
+  height: number;
+  width: number;
+  convertToBlob: any;
+  getContext: any;
+  transferToImageBitmap: any;
+}
+
+export interface MSGesture {
+  target: Element;
+  addPointer(pointerId: number): void;
+  stop(): void;
+}
+
+// declare var MSGesture: {
+//   prototype: MSGesture;
+//   new (): MSGesture;
+// };
+
+export interface NavigatorUserMediaSuccessCallback {
+  (stream: MediaStream): void;
+}
+
+export interface NavigatorUserMediaErrorCallback {
+  (error: any): void;
+}
+
+export interface OffscreenCanvasRenderingContext2D
+  extends CanvasCompositing,
+    CanvasDrawImage,
+    CanvasDrawPath,
+    CanvasFillStrokeStyles,
+    CanvasFilters,
+    CanvasImageData,
+    CanvasImageSmoothing,
+    CanvasPath,
+    CanvasPathDrawingStyles,
+    CanvasRect,
+    CanvasShadowStyles,
+    CanvasState,
+    CanvasText,
+    CanvasTextDrawingStyles,
+    CanvasTransform {
+  readonly canvas: OffscreenCanvas;
+  commit(): void;
+}
+
+// declare var OffscreenCanvasRenderingContext2D: {
+//   prototype: OffscreenCanvasRenderingContext2D;
+//   new (): OffscreenCanvasRenderingContext2D;
+// };
+
+export type MouseWheelEvent = WheelEvent;
+
+export interface UserPreferences {
+  abilityScoreDisplayType: number;
+  privacyType: number;
+  isDarkModeEnabled: boolean;
+  isDiceRollingEnabled?: boolean;
+  updateLocation?: PreferenceUpdateLocation;
+  defaultEnabledSourceCategories: Record<number, boolean>;
+  isHomebrewEnabled: boolean;
+}
+
+export type ThemeMode = "light" | "dark";
diff --git a/ddb_main/webpack/bootstrap b/ddb_main/webpack/bootstrap
new file mode 100644
index 0000000..92490d3
--- /dev/null
+++ b/ddb_main/webpack/bootstrap
@@ -0,0 +1,30 @@
+// The module cache
+var __webpack_module_cache__ = {};
+
+// The require function
+function __webpack_require__(moduleId) {
+	// Check if module is in cache
+	var cachedModule = __webpack_module_cache__[moduleId];
+	if (cachedModule !== undefined) {
+		return cachedModule.exports;
+	}
+	// Create a new module (and put it into the cache)
+	var module = __webpack_module_cache__[moduleId] = {
+		id: moduleId,
+		loaded: false,
+		exports: {}
+	};
+
+	// Execute the module function
+	__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+
+	// Flag the module as loaded
+	module.loaded = true;
+
+	// Return the exports of the module
+	return module.exports;
+}
+
+// expose the modules object (__webpack_modules__)
+__webpack_require__.m = __webpack_modules__;
+
diff --git a/ddb_main/webpack/runtime/compat get default export b/ddb_main/webpack/runtime/compat get default export
new file mode 100644
index 0000000..3a06ef5
--- /dev/null
+++ b/ddb_main/webpack/runtime/compat get default export	
@@ -0,0 +1,8 @@
+// getDefaultExport function for compatibility with non-harmony modules
+__webpack_require__.n = (module) => {
+	var getter = module && module.__esModule ?
+		() => (module['default']) :
+		() => (module);
+	__webpack_require__.d(getter, { a: getter });
+	return getter;
+};
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/create fake namespace object b/ddb_main/webpack/runtime/create fake namespace object
new file mode 100644
index 0000000..0ab7ef6
--- /dev/null
+++ b/ddb_main/webpack/runtime/create fake namespace object	
@@ -0,0 +1,26 @@
+var getProto = Object.getPrototypeOf ? (obj) => (Object.getPrototypeOf(obj)) : (obj) => (obj.__proto__);
+var leafPrototypes;
+// create a fake namespace object
+// mode & 1: value is a module id, require it
+// mode & 2: merge all properties of value into the ns
+// mode & 4: return value when already ns object
+// mode & 16: return value when it's Promise-like
+// mode & 8|1: behave like require
+__webpack_require__.t = function(value, mode) {
+	if(mode & 1) value = this(value);
+	if(mode & 8) return value;
+	if(typeof value === 'object' && value) {
+		if((mode & 4) && value.__esModule) return value;
+		if((mode & 16) && typeof value.then === 'function') return value;
+	}
+	var ns = Object.create(null);
+	__webpack_require__.r(ns);
+	var def = {};
+	leafPrototypes = leafPrototypes || [null, getProto({}), getProto([]), getProto(getProto)];
+	for(var current = mode & 2 && value; typeof current == 'object' && !~leafPrototypes.indexOf(current); current = getProto(current)) {
+		Object.getOwnPropertyNames(current).forEach((key) => (def[key] = () => (value[key])));
+	}
+	def['default'] = () => (value);
+	__webpack_require__.d(ns, def);
+	return ns;
+};
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/define property getters b/ddb_main/webpack/runtime/define property getters
new file mode 100644
index 0000000..6d4b7a5
--- /dev/null
+++ b/ddb_main/webpack/runtime/define property getters	
@@ -0,0 +1,8 @@
+// define getter functions for harmony exports
+__webpack_require__.d = (exports, definition) => {
+	for(var key in definition) {
+		if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+			Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+		}
+	}
+};
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/ensure chunk b/ddb_main/webpack/runtime/ensure chunk
new file mode 100644
index 0000000..b16f801
--- /dev/null
+++ b/ddb_main/webpack/runtime/ensure chunk	
@@ -0,0 +1,9 @@
+__webpack_require__.f = {};
+// This file contains only the entry chunk.
+// The chunk loading function for additional chunks
+__webpack_require__.e = (chunkId) => {
+	return Promise.all(Object.keys(__webpack_require__.f).reduce((promises, key) => {
+		__webpack_require__.f[key](chunkId, promises);
+		return promises;
+	}, []));
+};
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/get javascript chunk filename b/ddb_main/webpack/runtime/get javascript chunk filename
new file mode 100644
index 0000000..a0a5f13
--- /dev/null
+++ b/ddb_main/webpack/runtime/get javascript chunk filename	
@@ -0,0 +1,5 @@
+// This function allow to reference async chunks
+__webpack_require__.u = (chunkId) => {
+	// return url for filenames based on template
+	return "static/js/" + chunkId + "." + "89af9736" + ".chunk.js";
+};
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/get mini-css chunk filename b/ddb_main/webpack/runtime/get mini-css chunk filename
new file mode 100644
index 0000000..cab9e04
--- /dev/null
+++ b/ddb_main/webpack/runtime/get mini-css chunk filename	
@@ -0,0 +1,5 @@
+// This function allow to reference async chunks
+__webpack_require__.miniCssF = (chunkId) => {
+	// return url for filenames based on template
+	return undefined;
+};
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/global b/ddb_main/webpack/runtime/global
new file mode 100644
index 0000000..9dc17f4
--- /dev/null
+++ b/ddb_main/webpack/runtime/global
@@ -0,0 +1,8 @@
+__webpack_require__.g = (function() {
+	if (typeof globalThis === 'object') return globalThis;
+	try {
+		return this || new Function('return this')();
+	} catch (e) {
+		if (typeof window === 'object') return window;
+	}
+})();
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/harmony module decorator b/ddb_main/webpack/runtime/harmony module decorator
new file mode 100644
index 0000000..44a1f62
--- /dev/null
+++ b/ddb_main/webpack/runtime/harmony module decorator	
@@ -0,0 +1,11 @@
+__webpack_require__.hmd = (module) => {
+	module = Object.create(module);
+	if (!module.children) module.children = [];
+	Object.defineProperty(module, 'exports', {
+		enumerable: true,
+		set: () => {
+			throw new Error('ES Modules may not assign module.exports or exports.*, Use ESM export syntax, instead: ' + module.id);
+		}
+	});
+	return module;
+};
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/hasOwnProperty shorthand b/ddb_main/webpack/runtime/hasOwnProperty shorthand
new file mode 100644
index 0000000..d82c3b8
--- /dev/null
+++ b/ddb_main/webpack/runtime/hasOwnProperty shorthand	
@@ -0,0 +1 @@
+__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/jsonp chunk loading b/ddb_main/webpack/runtime/jsonp chunk loading
new file mode 100644
index 0000000..6103429
--- /dev/null
+++ b/ddb_main/webpack/runtime/jsonp chunk loading	
@@ -0,0 +1,88 @@
+// no baseURI
+
+// object to store loaded and loading chunks
+// undefined = chunk not loaded, null = chunk preloaded/prefetched
+// [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
+var installedChunks = {
+	792: 0
+};
+
+__webpack_require__.f.j = (chunkId, promises) => {
+		// JSONP chunk loading for javascript
+		var installedChunkData = __webpack_require__.o(installedChunks, chunkId) ? installedChunks[chunkId] : undefined;
+		if(installedChunkData !== 0) { // 0 means "already installed".
+
+			// a Promise means "currently loading".
+			if(installedChunkData) {
+				promises.push(installedChunkData[2]);
+			} else {
+				if(true) { // all chunks have JS
+					// setup Promise in chunk cache
+					var promise = new Promise((resolve, reject) => (installedChunkData = installedChunks[chunkId] = [resolve, reject]));
+					promises.push(installedChunkData[2] = promise);
+
+					// start chunk loading
+					var url = __webpack_require__.p + __webpack_require__.u(chunkId);
+					// create error before stack unwound to get useful stacktrace later
+					var error = new Error();
+					var loadingEnded = (event) => {
+						if(__webpack_require__.o(installedChunks, chunkId)) {
+							installedChunkData = installedChunks[chunkId];
+							if(installedChunkData !== 0) installedChunks[chunkId] = undefined;
+							if(installedChunkData) {
+								var errorType = event && (event.type === 'load' ? 'missing' : event.type);
+								var realSrc = event && event.target && event.target.src;
+								error.message = 'Loading chunk ' + chunkId + ' failed.\n(' + errorType + ': ' + realSrc + ')';
+								error.name = 'ChunkLoadError';
+								error.type = errorType;
+								error.request = realSrc;
+								installedChunkData[1](error);
+							}
+						}
+					};
+					__webpack_require__.l(url, loadingEnded, "chunk-" + chunkId, chunkId);
+				}
+			}
+		}
+};
+
+// no prefetching
+
+// no preloaded
+
+// no HMR
+
+// no HMR manifest
+
+// no on chunks loaded
+
+// install a JSONP callback for chunk loading
+var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
+	var chunkIds = data[0];
+	var moreModules = data[1];
+	var runtime = data[2];
+	// add "moreModules" to the modules object,
+	// then flag all "chunkIds" as loaded and fire callback
+	var moduleId, chunkId, i = 0;
+	if(chunkIds.some((id) => (installedChunks[id] !== 0))) {
+		for(moduleId in moreModules) {
+			if(__webpack_require__.o(moreModules, moduleId)) {
+				__webpack_require__.m[moduleId] = moreModules[moduleId];
+			}
+		}
+		if(runtime) var result = runtime(__webpack_require__);
+	}
+	if(parentChunkLoadingFunction) parentChunkLoadingFunction(data);
+	for(;i < chunkIds.length; i++) {
+		chunkId = chunkIds[i];
+		if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
+			installedChunks[chunkId][0]();
+		}
+		installedChunks[chunkId] = 0;
+	}
+
+}
+
+var chunkLoadingGlobal = self["webpackChunk_dndbeyond_character_app"] = self["webpackChunk_dndbeyond_character_app"] || [];
+chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
+chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/load script b/ddb_main/webpack/runtime/load script
new file mode 100644
index 0000000..a54dacf
--- /dev/null
+++ b/ddb_main/webpack/runtime/load script	
@@ -0,0 +1,42 @@
+var inProgress = {};
+var dataWebpackPrefix = "@dndbeyond/character-app:";
+// loadScript function to load a script via script tag
+__webpack_require__.l = (url, done, key, chunkId) => {
+	if(inProgress[url]) { inProgress[url].push(done); return; }
+	var script, needAttach;
+	if(key !== undefined) {
+		var scripts = document.getElementsByTagName("script");
+		for(var i = 0; i < scripts.length; i++) {
+			var s = scripts[i];
+			if(s.getAttribute("src") == url || s.getAttribute("data-webpack") == dataWebpackPrefix + key) { script = s; break; }
+		}
+	}
+	if(!script) {
+		needAttach = true;
+		script = document.createElement('script');
+
+		script.charset = 'utf-8';
+		script.timeout = 120;
+		if (__webpack_require__.nc) {
+			script.setAttribute("nonce", __webpack_require__.nc);
+		}
+		script.setAttribute("data-webpack", dataWebpackPrefix + key);
+
+		script.src = url;
+	}
+	inProgress[url] = [done];
+	var onScriptComplete = (prev, event) => {
+		// avoid mem leaks in IE.
+		script.onerror = script.onload = null;
+		clearTimeout(timeout);
+		var doneFns = inProgress[url];
+		delete inProgress[url];
+		script.parentNode && script.parentNode.removeChild(script);
+		doneFns && doneFns.forEach((fn) => (fn(event)));
+		if(prev) return prev(event);
+	}
+	var timeout = setTimeout(onScriptComplete.bind(null, undefined, { type: 'timeout', target: script }), 120000);
+	script.onerror = onScriptComplete.bind(null, script.onerror);
+	script.onload = onScriptComplete.bind(null, script.onload);
+	needAttach && document.head.appendChild(script);
+};
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/make namespace object b/ddb_main/webpack/runtime/make namespace object
new file mode 100644
index 0000000..02445d9
--- /dev/null
+++ b/ddb_main/webpack/runtime/make namespace object	
@@ -0,0 +1,7 @@
+// define __esModule on exports
+__webpack_require__.r = (exports) => {
+	if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+		Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+	}
+	Object.defineProperty(exports, '__esModule', { value: true });
+};
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/node module decorator b/ddb_main/webpack/runtime/node module decorator
new file mode 100644
index 0000000..eb3d19c
--- /dev/null
+++ b/ddb_main/webpack/runtime/node module decorator	
@@ -0,0 +1,5 @@
+__webpack_require__.nmd = (module) => {
+	module.paths = [];
+	if (!module.children) module.children = [];
+	return module;
+};
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/nonce b/ddb_main/webpack/runtime/nonce
new file mode 100644
index 0000000..11610b5
--- /dev/null
+++ b/ddb_main/webpack/runtime/nonce
@@ -0,0 +1 @@
+__webpack_require__.nc = undefined;
\ No newline at end of file
diff --git a/ddb_main/webpack/runtime/publicPath b/ddb_main/webpack/runtime/publicPath
new file mode 100644
index 0000000..bc0fba9
--- /dev/null
+++ b/ddb_main/webpack/runtime/publicPath
@@ -0,0 +1 @@
+__webpack_require__.p = "https://media.dndbeyond.com/character-app/";
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/AbilityScoreManager/styles.module.css?c7e6 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/AbilityScoreManager/styles.module.css?c7e6
new file mode 100644
index 0000000..b191b0a
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/AbilityScoreManager/styles.module.css?c7e6
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"header":"styles_header__wZkdy","name":"styles_name__g-meS","icon":"styles_icon__2PFMo","table":"styles_table__KEe14","row":"styles_row__qpCLB","hasSuppliers":"styles_hasSuppliers__3B0xn","label":"styles_label__WJbyc","value":"styles_value__0L5in","highlight":"styles_highlight__9UzJL","suppliers":"styles_suppliers__ANZA+","supplier":"styles_supplier__sVT7g","builder":"styles_builder__lg0T-","number":"styles_number__yUyk3","overrides":"styles_overrides__kg8cB","override":"styles_override__RMizc"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/Accordion/styles.module.css?957c b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Accordion/styles.module.css?957c
new file mode 100644
index 0000000..b127c66
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Accordion/styles.module.css?957c
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"details":"styles_details__Kwqwr","text":"styles_text__jFGd4","paper":"styles_paper__FhNqH","theme":"styles_theme__D5Oda","alert":"styles_alert__tPDGl","summary":"styles_summary__BI+UG","heading":"styles_heading__RRl69","small":"styles_small__sz8Si","icon":"styles_icon__2Z5Ed","content":"styles_content__pFYp6","metaItems":"styles_metaItems__Pt+Po","metaItem":"styles_metaItem__+kjrf","image":"styles_image__cn+gs","actions":"styles_actions__1-sml"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/Button/styles.module.css?bcfd b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Button/styles.module.css?bcfd
new file mode 100644
index 0000000..5a36b08
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Button/styles.module.css?bcfd
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"themed":"styles_themed__AiJUu","builder":"styles_builder__iFp8R","builder-text":"styles_builder-text__RlIXo","builder-green":"styles_builder-green__00NLA","solid":"styles_solid__2ijrG","outline":"styles_outline__lyFTR","dark":"styles_dark__O1vGK","light":"styles_light__kA91w","xx-small":"styles_xx-small__Q1OkG","x-small":"styles_x-small__8tmZN"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/Checkbox/styles.module.css?9104 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Checkbox/styles.module.css?9104
new file mode 100644
index 0000000..a704498
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Checkbox/styles.module.css?9104
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"themed":"styles_themed__sUMKe","darkMode":"styles_darkMode__Maw1P","default":"styles_default__i2mhG","builder":"styles_builder__awqTY"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/CollapsibleContent/styles.module.css?d928 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/CollapsibleContent/styles.module.css?d928
new file mode 100644
index 0000000..2999bb1
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/CollapsibleContent/styles.module.css?d928
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"collapsible":"styles_collapsible__R+ovD","withHeading":"styles_withHeading__3DbSt","content":"styles_content__cRybC","open":"styles_open__THaid","button":"styles_button__AcpmG"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/ConfirmModal/styles.module.css?01a2 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/ConfirmModal/styles.module.css?01a2
new file mode 100644
index 0000000..3aa1b49
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/ConfirmModal/styles.module.css?01a2
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"confirmModal":"styles_confirmModal__MS4hT","fullScreen":"styles_fullScreen__hG3x4","fit-content":"styles_fit-content__qhlRT","header":"styles_header__2RJaP","closeIcon":"styles_closeIcon__n9aYB","remove":"styles_remove__UqFYv","closeButton":"styles_closeButton__Qq-hF","content":"styles_content__mNhoq","footer":"styles_footer__5tfjP","footerButton":"styles_footerButton__EOQCj","confirmOnly":"styles_confirmOnly__9K02E"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/EditableName/styles.module.css?6147 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/EditableName/styles.module.css?6147
new file mode 100644
index 0000000..7f5019f
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/EditableName/styles.module.css?6147
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"editableName":"styles_editableName__9BMRa","button":"styles_button__lgwBO","icon":"styles_icon__qpt+X"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/FilterGroup/styles.module.css?dd46 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/FilterGroup/styles.module.css?dd46
new file mode 100644
index 0000000..e4364b7
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/FilterGroup/styles.module.css?dd46
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"filterGroup":"styles_filterGroup__V5zRA","filterLabel":"styles_filterLabel__ebzPR","buttonGroup":"styles_buttonGroup__886HB","button":"styles_button__41Y4a","sourceCategoryButton":"styles_sourceCategoryButton__4sNH-","builder":"styles_builder__kuQZr","checkboxGroup":"styles_checkboxGroup__-GeBf","checkbox":"styles_checkbox__7T6iE","accordionLabel":"styles_accordionLabel__BemVp","accordion":"styles_accordion__7XelT"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/HelperTextAccordion/styles.module.css?800e b/ddb_main/webpack:/@dndbeyond/character-app/src/components/HelperTextAccordion/styles.module.css?800e
new file mode 100644
index 0000000..94e0e99
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/HelperTextAccordion/styles.module.css?800e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"summary":"styles_summary__8fwTJ"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/InfoItem/styles.module.css?7496 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/InfoItem/styles.module.css?7496
new file mode 100644
index 0000000..96ef6a5
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/InfoItem/styles.module.css?7496
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"item":"styles_item__8bGe2"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/ItemFilter/styles.module.css?4149 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/ItemFilter/styles.module.css?4149
new file mode 100644
index 0000000..1e45d3a
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/ItemFilter/styles.module.css?4149
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"filterButton":"styles_filterButton__xOB2I","filterButtonSmall":"styles_filterButtonSmall__7XGtc"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/ItemName/styles.module.css?5c1e b/ddb_main/webpack:/@dndbeyond/character-app/src/components/ItemName/styles.module.css?5c1e
new file mode 100644
index 0000000..a59d30d
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/ItemName/styles.module.css?5c1e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"itemName":"styles_itemName__xLCwW","common":"styles_common__4urYa","uncommon":"styles_uncommon__L6lbB","rare":"styles_rare__ort-Y","veryrare":"styles_veryrare__rmBCl","legendary":"styles_legendary__h1DkF","artifact":"styles_artifact__K9nvQ","asterisk":"styles_asterisk__gyJSH","icon":"styles_icon__cSkYX","legacy":"styles_legacy__X4o64"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/LegacyBadge/styles.module.css?f262 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/LegacyBadge/styles.module.css?f262
new file mode 100644
index 0000000..89aca6b
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/LegacyBadge/styles.module.css?f262
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"chip":"styles_chip__PfS4s","margin-left":"styles_margin-left__IuF2i"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/MaxCharactersDialog/styles.module.css?a88f b/ddb_main/webpack:/@dndbeyond/character-app/src/components/MaxCharactersDialog/styles.module.css?a88f
new file mode 100644
index 0000000..1db0568
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/MaxCharactersDialog/styles.module.css?a88f
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"maxCharactersDialog":"styles_maxCharactersDialog__Rqhoz","dialogTitle":"styles_dialogTitle__DC92z","dialogFooter":"styles_dialogFooter__bFO5P"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/MaxCharactersMessageText/styles.module.css?af27 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/MaxCharactersMessageText/styles.module.css?af27
new file mode 100644
index 0000000..6902795
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/MaxCharactersMessageText/styles.module.css?af27
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"messageTitle":"styles_messageTitle__ln-na","messageSubtext":"styles_messageSubtext__ZmH5v","link":"styles_link__ulhrG"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/NotificationSystem/styles.module.css?6d60 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/NotificationSystem/styles.module.css?6d60
new file mode 100644
index 0000000..8238766
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/NotificationSystem/styles.module.css?6d60
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"toast":"styles_toast__FYzTC","closeButton":"styles_closeButton__q+cBt","closeIcon":"styles_closeIcon__ISucE","title":"styles_title__FnSBv","message":"styles_message__Pmj1k","success":"styles_success__NNRi9","warning":"styles_warning__ckv2O","error":"styles_error__TZrWb","info":"styles_info__Ar-hx"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/NumberDisplay/styles.module.css?0238 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/NumberDisplay/styles.module.css?0238
new file mode 100644
index 0000000..6373520
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/NumberDisplay/styles.module.css?0238
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"numberDisplay":"styles_numberDisplay__Rg1za","modified":"styles_modified__4vUcM","signed":"styles_signed__scf97","sign":"styles_sign__NdR6X","label":"styles_label__L8mZK","labelSignColor":"styles_labelSignColor__Klmbs","large":"styles_large__3C8uq","largeDistance":"styles_largeDistance__YVw96","largeLabel":"styles_largeLabel__E3v8Y","largeSign":"styles_largeSign__V9-jS"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/Popover/styles.module.css?3eaf b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Popover/styles.module.css?3eaf
new file mode 100644
index 0000000..017b5b9
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Popover/styles.module.css?3eaf
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"popoverContainer":"styles_popoverContainer__2gQoE","popover":"styles_popover__NwCZk","dark":"styles_dark__LCpy0","menu":"styles_menu__NNNU2","bottomLeft":"styles_bottomLeft__Alnn-","bottomRight":"styles_bottomRight__jaPg5","bottom":"styles_bottom__Sqb8J"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/PopoverContent/styles.module.css?2358 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/PopoverContent/styles.module.css?2358
new file mode 100644
index 0000000..83b95f9
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/PopoverContent/styles.module.css?2358
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"deletePopoverHeader":"styles_deletePopoverHeader__M5W4E","deletePopoverContent":"styles_deletePopoverContent__tHA0R","deletePopoverFooter":"styles_deletePopoverFooter__931o7"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/PremadeCharacterEditStatus/styles.module.css?c9e3 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/PremadeCharacterEditStatus/styles.module.css?c9e3
new file mode 100644
index 0000000..62b919c
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/PremadeCharacterEditStatus/styles.module.css?c9e3
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"editStateIndicator":"styles_editStateIndicator__dQLCR","editStateIndicatorBuilder":"styles_editStateIndicatorBuilder__UpUS3"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/Reference/styles.module.css?6f9d b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Reference/styles.module.css?6f9d
new file mode 100644
index 0000000..d010079
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Reference/styles.module.css?6f9d
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"reference":"styles_reference__4pmEk","name":"styles_name__mZMFY"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/SpellFilter/styles.module.css?0e79 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/SpellFilter/styles.module.css?0e79
new file mode 100644
index 0000000..e803ecd
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/SpellFilter/styles.module.css?0e79
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"filterButton":"styles_filterButton__KPbii","buttonText":"styles_buttonText__uY856","ordinal":"styles_ordinal__tnP9F","ordinalSmall":"styles_ordinalSmall__0rT48"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/SpellName/styles.module.css?9f30 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/SpellName/styles.module.css?9f30
new file mode 100644
index 0000000..cda023a
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/SpellName/styles.module.css?9f30
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"spellName":"styles_spellName__wX3ll","icon":"styles_icon__Heo9G","level":"styles_level__yuVR8","expanded":"styles_expanded__goxgO","customized":"styles_customized__w00dC","legacy":"styles_legacy__hyrw1"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/SummaryList/styles.module.css?884e b/ddb_main/webpack:/@dndbeyond/character-app/src/components/SummaryList/styles.module.css?884e
new file mode 100644
index 0000000..bba7e4f
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/SummaryList/styles.module.css?884e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"title":"styles_title__pjCq7","listItems":"styles_listItems__w+Kpf"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/TabFilter/styles.module.css?61de b/ddb_main/webpack:/@dndbeyond/character-app/src/components/TabFilter/styles.module.css?61de
new file mode 100644
index 0000000..d872b33
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/TabFilter/styles.module.css?61de
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"tabFilter":"styles_tabFilter__50iSv","buttons":"styles_buttons__hGhtB","dark":"styles_dark__uQ8CK","active":"styles_active__oWpHc","badge":"styles_badge__l1F34","content":"styles_content__QjnYw"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/TabList/styles.module.css?79e3 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/TabList/styles.module.css?79e3
new file mode 100644
index 0000000..45997dd
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/TabList/styles.module.css?79e3
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"tabs":"styles_tabs__aTttL","tabButton":"styles_tabButton__wvSLf","closed":"styles_closed__HbSmL","morePopover":"styles_morePopover__ht7nX","moreMenu":"styles_moreMenu__Cjzgj"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/TagGroup/styles.module.css?01a1 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/TagGroup/styles.module.css?01a1
new file mode 100644
index 0000000..579cd2b
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/TagGroup/styles.module.css?01a1
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"tagGroup":"styles_tagGroup__2u3sZ","label":"styles_label__Waqrx","group":"styles_group__-mqfO","tag":"styles_tag__HTcXp"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/Textarea/styles.module.css?a276 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Textarea/styles.module.css?a276
new file mode 100644
index 0000000..1b14d7e
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Textarea/styles.module.css?a276
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"textarea":"styles_textarea__7oQCq"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/Toggle/styles.module.css?302d b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Toggle/styles.module.css?302d
new file mode 100644
index 0000000..2b76d8a
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Toggle/styles.module.css?302d
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"toggle":"styles_toggle__nDukS","secondary":"styles_secondary__WKufd","success":"styles_success__NHqMO","info":"styles_info__P6LyO","warning":"styles_warning__8+yaV","error":"styles_error__oUkaQ","themed":"styles_themed__H38P+","checked":"styles_checked__T0bli"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/Tooltip/styles.module.css?4536 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Tooltip/styles.module.css?4536
new file mode 100644
index 0000000..944cce7
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/Tooltip/styles.module.css?4536
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"tooltip":"styles_tooltip__50S82"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/components/XpManager/styles.module.css?7c61 b/ddb_main/webpack:/@dndbeyond/character-app/src/components/XpManager/styles.module.css?7c61
new file mode 100644
index 0000000..af13b56
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/components/XpManager/styles.module.css?7c61
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"levelTotal":"styles_levelTotal__6wynj","withDivider":"styles_withDivider__GnX6H","xpBar":"styles_xpBar__bXAND","controls":"styles_controls__vb0Ab","control":"styles_control__VjPt7","setXp":"styles_setXp__OLexY","label":"styles_label__DHXJq","adjustGroup":"styles_adjustGroup__s0ruy","adjustTabs":"styles_adjustTabs__NQFlw","tab":"styles_tab__8k1Cz","active":"styles_active__hxB-v","currentLevelAmounts":"styles_currentLevelAmounts__dU3nS"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/styles/accessibility.module.css?1f61 b/ddb_main/webpack:/@dndbeyond/character-app/src/styles/accessibility.module.css?1f61
new file mode 100644
index 0000000..21b617a
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/styles/accessibility.module.css?1f61
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"screenreaderOnly":"accessibility_screenreaderOnly__OEzRB"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/styles/errors.module.css?50c1 b/ddb_main/webpack:/@dndbeyond/character-app/src/styles/errors.module.css?50c1
new file mode 100644
index 0000000..6ef43bd
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/styles/errors.module.css?50c1
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"inputError":"errors_inputError__ZF-AH"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmClassModal/styles.module.css?c952 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmClassModal/styles.module.css?c952
new file mode 100644
index 0000000..b9425ed
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmClassModal/styles.module.css?c952
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"confirmClassHeader":"styles_confirmClassHeader__lNrcJ","name":"styles_name__SV0nl","image":"styles_image__KLl53","detailsLink":"styles_detailsLink__cV3QV","classFeatures":"styles_classFeatures__xlxDc","description":"styles_description__NnKCr"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesContent/styles.module.css?8e95 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesContent/styles.module.css?8e95
new file mode 100644
index 0000000..19236a8
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesContent/styles.module.css?8e95
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"description":"styles_description__Ai4kD"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesHeader/styles.module.css?0f71 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesHeader/styles.module.css?0f71
new file mode 100644
index 0000000..60f4f6d
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmSpeciesModal/ConfirmSpeciesHeader/styles.module.css?0f71
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"confirmSpeciesHeader":"styles_confirmSpeciesHeader__wvq2Q","fullName":"styles_fullName__Uuf0e","image":"styles_image__6LVdk"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmSpeciesModal/styles.module.css?2f06 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmSpeciesModal/styles.module.css?2f06
new file mode 100644
index 0000000..7e65452
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/ConfirmSpeciesModal/styles.module.css?2f06
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"content":"styles_content__eyrZs","detailsLink":"styles_detailsLink__-2mK4"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/EditorWithDialog/styles.module.css?d0bc b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/EditorWithDialog/styles.module.css?d0bc
new file mode 100644
index 0000000..aa7cec2
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/EditorWithDialog/styles.module.css?d0bc
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__bOoAH","header":"styles_header__K3QPR","heading":"styles_heading__e3CeE","preview":"styles_preview__cev1Z","title":"styles_title__ldbWf","textarea":"styles_textarea__QO4Cg","extra":"styles_extra__J+6xL"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/HpManageModal/styles.module.css?c97e b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/HpManageModal/styles.module.css?c97e
new file mode 100644
index 0000000..5c52ef2
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/HpManageModal/styles.module.css?c97e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"hpManageModal":"styles_hpManageModal__jXAcr","total":"styles_total__1a5fd","totalLabel":"styles_totalLabel__K0+aD","totalValue":"styles_totalValue__wZrWG","controls":"styles_controls__EvlpE","baseHp":"styles_baseHp__cA4rA","baseHpLabel":"styles_baseHpLabel__nc41x","baseHpValue":"styles_baseHpValue__tBbMl","hpSources":"styles_hpSources__lqYJK","info":"styles_info__Gkkvg","help":"styles_help__JapXf","infoGroup":"styles_infoGroup__IBi4u","infoLabel":"styles_infoLabel__jjH0g"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/HpSummary/styles.module.css?4167 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/HpSummary/styles.module.css?4167
new file mode 100644
index 0000000..8d81eeb
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/HpSummary/styles.module.css?4167
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"hpSummaryContent":"styles_hpSummaryContent__Im4dO","label":"styles_label__Jrq2J","button":"styles_button__e1Ctk"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Listing/ListingGroup/styles.module.css?8900 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Listing/ListingGroup/styles.module.css?8900
new file mode 100644
index 0000000..9981f34
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Listing/ListingGroup/styles.module.css?8900
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"summary":"styles_summary__9QLx9","image":"styles_image__s73EO","header":"styles_header__xgw9w","heading":"styles_heading__97OmI","count":"styles_count__4QDnM","icon":"styles_icon__1N8ot","details":"styles_details__RKuL4","text":"styles_text__cCu4X","metaItems":"styles_metaItems__ku1xS","error":"styles_error__cxIuY","content":"styles_content__Y+eJU"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Listing/ListingItemButton/styles.module.css?24c6 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Listing/ListingItemButton/styles.module.css?24c6
new file mode 100644
index 0000000..d032321
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Listing/ListingItemButton/styles.module.css?24c6
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"button":"styles_button__qvCuT","image":"styles_image__88P3y","header":"styles_header__Oi1LG","heading":"styles_heading__lnu25","icon":"styles_icon__L+fZi","iconGroup":"styles_iconGroup__9Ae4z","text":"styles_text__jZP5-","metaItems":"styles_metaItems__SVjTW","error":"styles_error__4kSdU"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Listing/styles.module.css?a863 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Listing/styles.module.css?a863
new file mode 100644
index 0000000..5e3fd24
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Listing/styles.module.css?a863
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"listing":"styles_listing__rwCqF","notFound":"styles_notFound__lDGzz"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/PortraitName/styles.module.css?a170 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/PortraitName/styles.module.css?a170
new file mode 100644
index 0000000..a114c84
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/PortraitName/styles.module.css?a170
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"nameContainer":"styles_nameContainer__peMda","avatar":"styles_avatar__l+g1X","empty":"styles_empty__OVu5Y","portraitManagerModal":"styles_portraitManagerModal__nBnrA","inputContainer":"styles_inputContainer__igbPB","namecontainer":"styles_namecontainer__6zbnk","suggestionButton":"styles_suggestionButton__zLhxs","suggestion":"styles_suggestion__TK7bd","suggestionsContainer":"styles_suggestionsContainer__wMFeu","suggestionsLabel":"styles_suggestionsLabel__LKmV1","shuffleButton":"styles_shuffleButton__OitxJ","shuffleIcon":"styles_shuffleIcon__DROXt","suggestions":"styles_suggestions__gxqQd","credit":"styles_credit__OTgoU","creditLink":"styles_creditLink__rDSA8","creditText":"styles_creditText__tEUXN","fullwidth":"styles_fullwidth__CABWo"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Search/styles.module.css?ec37 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Search/styles.module.css?ec37
new file mode 100644
index 0000000..75d21ea
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/Search/styles.module.css?ec37
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"search":"styles_search__A3o1k"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/SpeciesDisplay/styles.module.css?9ce2 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/SpeciesDisplay/styles.module.css?9ce2
new file mode 100644
index 0000000..11d2eb5
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/components/SpeciesDisplay/styles.module.css?9ce2
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"speciesDisplay":"styles_speciesDisplay__S9frG","heading":"styles_heading__U+vIZ","content":"styles_content__-1BXa","portrait":"styles_portrait__4i6vT","species":"styles_species__8c9CS","subspecies":"styles_subspecies__a-ni9","button":"styles_button__3X4JI"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/BuilderTypeChoicePage/styles.module.css?4256 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/BuilderTypeChoicePage/styles.module.css?4256
new file mode 100644
index 0000000..fb32e7c
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/BuilderTypeChoicePage/styles.module.css?4256
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"page":"styles_page__-QMRU","header":"styles_header__jOLEE","grid":"styles_grid__HJg+C","card":"styles_card__amsRL","img":"styles_img__hb7kX","standardBuild":"styles_standardBuild__cRStn","premades":"styles_premades__iNB5f","cardContent":"styles_cardContent__YM+2M","font":"styles_font__gFIu9","cardTitle":"styles_cardTitle__AJh+1","cardDescription":"styles_cardDescription__0Qx0x","helpCheckbox":"styles_helpCheckbox__qqpXB","helpText":"styles_helpText__lre0R","cardFooter":"styles_cardFooter__n2TiV","icon":"styles_icon__N+tV+"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/Class/ClassHeader/styles.module.css?68af b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/Class/ClassHeader/styles.module.css?68af
new file mode 100644
index 0000000..3e80236
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/Class/ClassHeader/styles.module.css?68af
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__g8gPn","startingClass":"styles_startingClass__rQT9Q","classImg":"styles_classImg__2QAJc","nameGroup":"styles_nameGroup__u87N1","name":"styles_name__KLcTZ","subclassName":"styles_subclassName__JQinv","levelManager":"styles_levelManager__-7mXa","todoIcon":"styles_todoIcon__qflyF","levelLabel":"styles_levelLabel__kONXJ","removeClassButton":"styles_removeClassButton__PGgIP","icon":"styles_icon__wm0Re","modalIntro":"styles_modalIntro__Kvtt+","modalLevel":"styles_modalLevel__WKlAg","modalLevels":"styles_modalLevels__rFVff"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/ClassChoose/styles.module.css?d311 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/ClassChoose/styles.module.css?d311
new file mode 100644
index 0000000..ae1e9b7
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/ClassChoose/styles.module.css?d311
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"page":"styles_page__QCT3M","title":"styles_title__ysSiF","buttons":"styles_buttons__4qWDf","navigateButton":"styles_navigateButton__V6swm","search":"styles_search__Tqq+s","accordion":"styles_accordion__9WWSi","accordionText":"styles_accordionText__oNlmN","heading":"styles_heading__FzMQ0","text":"styles_text__IVVSm","error":"styles_error__iRbgy","multiclassMessage":"styles_multiclassMessage__Gz0WW","notFound":"styles_notFound__3vTTA","divider":"styles_divider__GNZXQ","collapseExpand":"styles_collapseExpand__lF0pc","collapseExpandButton":"styles_collapseExpandButton__uKxXp"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/QuickBuild/styles.module.css?8ee6 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/QuickBuild/styles.module.css?8ee6
new file mode 100644
index 0000000..eb46be4
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/QuickBuild/styles.module.css?8ee6
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"page":"styles_page__TNzhv","title":"styles_title__0cLVX","submitButton":"styles_submitButton__D5Ib1","divider":"styles_divider__Exdqk","accordion":"styles_accordion__yn9yH","accordionHeading":"styles_accordionHeading__WhU5P"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/RandomBuild/styles.module.css?e57b b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/RandomBuild/styles.module.css?e57b
new file mode 100644
index 0000000..9736b23
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/RandomBuild/styles.module.css?e57b
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"page":"styles_page__gEr-0","title":"styles_title__6PiPk","submitButton":"styles_submitButton__+MevV","divider":"styles_divider__8dbwE","toggle":"styles_toggle__7jRT2","levelSelect":"styles_levelSelect__1B8e1","select":"styles_select__wWDRh","accordion":"styles_accordion__ZeVFo","accordionHeading":"styles_accordionHeading__FnYfQ","label":"styles_label__8EK4Q"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/SpeciesChoose/styles.module.css?f6f5 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/SpeciesChoose/styles.module.css?f6f5
new file mode 100644
index 0000000..6b3e956
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/builder/routes/SpeciesChoose/styles.module.css?f6f5
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"speciesChoose":"styles_speciesChoose__LHjMY","title":"styles_title__QQZXM","filters":"styles_filters__f1kB1","label":"styles_label__cOtxe","legacy":"styles_legacy__1LV4p","search":"styles_search__Dzr9H","accordion":"styles_accordion__UZzSo","heading":"styles_heading__qer6-","text":"styles_text__g9KOI","marketplace":"styles_marketplace__XvrFx","divider":"styles_divider__z2Aop","infoIcon":"styles_infoIcon__uONrK","notFound":"styles_notFound__9WkZ4","collapseExpand":"styles_collapseExpand__QTtBs","collapseExpandButton":"styles_collapseExpandButton__Yuvvt"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/ApiStatusIndicator/styles.module.css?935e b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/ApiStatusIndicator/styles.module.css?935e
new file mode 100644
index 0000000..6714aa3
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/ApiStatusIndicator/styles.module.css?935e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"indicator":"styles_indicator__T1U19","spinner":"styles_spinner__j0aCX","rotate":"styles_rotate__cJfAs","error":"styles_error__k0+Ff"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterCard/CharacterCardLinks/styles.module.css?0884 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterCard/CharacterCardLinks/styles.module.css?0884
new file mode 100644
index 0000000..7e21e9e
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterCard/CharacterCardLinks/styles.module.css?0884
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"text":"styles_text__q4rSx"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterCard/LeaveCampaignButton/styles.module.css?51ac b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterCard/LeaveCampaignButton/styles.module.css?51ac
new file mode 100644
index 0000000..d1e6748
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterCard/LeaveCampaignButton/styles.module.css?51ac
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"button":"styles_button__98-yx"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterCard/styles.module.css?17f0 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterCard/styles.module.css?17f0
new file mode 100644
index 0000000..fbaa4d4
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterCard/styles.module.css?17f0
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"card":"styles_card__IXd76","name":"styles_name__cxD14","cornerButton":"styles_cornerButton__mH7Jz","checkIcon":"styles_checkIcon__4ecPu","locked":"styles_locked__XAmZQ"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/FinalizeUnlock/styles.module.css?3925 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/FinalizeUnlock/styles.module.css?3925
new file mode 100644
index 0000000..fd0cb16
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/FinalizeUnlock/styles.module.css?3925
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"text":"styles_text__PqB7o"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/SearchSort/styles.module.css?b168 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/SearchSort/styles.module.css?b168
new file mode 100644
index 0000000..22cc213
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/SearchSort/styles.module.css?b168
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"searchSort":"styles_searchSort__-7qBD","search":"styles_search__oRBAL","searchInput":"styles_searchInput__Bf6Zn","searchLabel":"styles_searchLabel__uinw6","clearButton":"styles_clearButton__ZxjjN","clearIcon":"styles_clearIcon__9kW5Q","sort":"styles_sort__qkaFQ","settingsButton":"styles_settingsButton__Ebjey","settingsButtonText":"styles_settingsButtonText__GJ0wj"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/SecondaryHeader/styles.module.css?2ad0 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/SecondaryHeader/styles.module.css?2ad0
new file mode 100644
index 0000000..7fab55a
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/SecondaryHeader/styles.module.css?2ad0
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"dialog":"styles_dialog__OrT1k","maxCharactersDialog":"styles_maxCharactersDialog__Bm9yH","spinner":"styles_spinner__8uYBe","rotate":"styles_rotate__LugwU","alert":"styles_alert__M6syS","alertTitle":"styles_alertTitle__rc0Kz","bottomBar":"styles_bottomBar__g4sD0","bottomContainer":"styles_bottomContainer__U+58v","bottomText":"styles_bottomText__zPkNN"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/UnlockConfirmation/styles.module.css?05d3 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/UnlockConfirmation/styles.module.css?05d3
new file mode 100644
index 0000000..3905035
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/UnlockConfirmation/styles.module.css?05d3
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"unlockText":"styles_unlockText__FxwMA","pills":"styles_pills__IqXht","pill":"styles_pill__3bLed"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/styles.module.css?2e71 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/styles.module.css?2e71
new file mode 100644
index 0000000..06c8753
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/CharacterGrid/styles.module.css?2e71
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"header":"styles_header__HMUmV","h1":"styles_h1__wBuYU","button":"styles_button__GlhSe","subheader":"styles_subheader__gREDo","slots":"styles_slots__KHkvH","count":"styles_count__eO-sA","noResultsTitle":"styles_noResultsTitle__iRamO","noResultsText":"styles_noResultsText__2bWYh","deactivatedHeading":"styles_deactivatedHeading__HZ8GY","deactivatedText":"styles_deactivatedText__BUdPb","deactivatedButton":"styles_deactivatedButton__WkkCY","pdfLinkWrapper":"styles_pdfLinkWrapper__pBs0W","pdfLink":"styles_pdfLink__C-N6Z","pdfLinkSvg":"styles_pdfLinkSvg__udbQK"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/ConfirmationModal/styles.module.css?8059 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/ConfirmationModal/styles.module.css?8059
new file mode 100644
index 0000000..03699c3
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/ConfirmationModal/styles.module.css?8059
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"confirmationDialog":"styles_confirmationDialog__+97Ig","container":"styles_container__cUgnl","header":"styles_header__okMYT","title":"styles_title__nlhW7","text":"styles_text__6E+es","alert":"styles_alert__WNPhT","alertIcon":"styles_alertIcon__0mZbk","input":"styles_input__UpZRJ","footer":"styles_footer__AYhNd"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/PlayerAppBanner/styles.module.css?dfc0 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/PlayerAppBanner/styles.module.css?dfc0
new file mode 100644
index 0000000..73f2274
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/PlayerAppBanner/styles.module.css?dfc0
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"banner":"styles_banner__pBMQK","text":"styles_text__a0lkW","image":"styles_image__Q+uBE","buttons":"styles_buttons__e-68v","storeLink":"styles_storeLink__OlEV-","closeButton":"styles_closeButton__BXHUn","closeIcon":"styles_closeIcon__5M4NH"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/SubscriptionBanner/styles.module.css?40a5 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/SubscriptionBanner/styles.module.css?40a5
new file mode 100644
index 0000000..e3cae4f
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/listing/components/SubscriptionBanner/styles.module.css?40a5
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__lgIH-","detailContainer":"styles_detailContainer__OIQDb","text":"styles_text__VA7QB","button":"styles_button__IUrWH"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/CreatureBlock/styles.module.css?fb69 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/CreatureBlock/styles.module.css?fb69
new file mode 100644
index 0000000..592342e
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/CreatureBlock/styles.module.css?fb69
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"creatureBlock":"styles_creatureBlock__OEQz9","v2024":"styles_v2024__CjKQv","separator":"styles_separator__b4qi-","header":"styles_header__s4APo","meta":"styles_meta__+saK2","attribute":"styles_attribute__gAFt6","attributeLabel":"styles_attributeLabel__jKRBP","attributeValue":"styles_attributeValue__jBfHc","stats":"styles_stats__09JG6","statTable":"styles_statTable__DB9si","physical":"styles_physical__rxR2j","mental":"styles_mental__hVd+c","modifier":"styles_modifier__oTi0D","stat":"styles_stat__NLMSG","statHeading":"styles_statHeading__CdoVq","statScore":"styles_statScore__D2e+d","statModifier":"styles_statModifier__htjdl","descriptions":"styles_descriptions__CQHlb","descriptionHeading":"styles_descriptionHeading__JI-rw","description":"styles_description__AqcZW"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/FeatureSnippet/styles.module.css?4f7e b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/FeatureSnippet/styles.module.css?4f7e
new file mode 100644
index 0000000..d4602e9
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/FeatureSnippet/styles.module.css?4f7e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"origin":"styles_origin__VIuHg","originLabel":"styles_originLabel__B-CWL","originName":"styles_originName__Gm6tE","snippet":"styles_snippet__CzYh+","heading":"styles_heading__yD0Cm","headingDarkMode":"styles_headingDarkMode__YO4Ql","headingActivation":"styles_headingActivation__QFvRk","headingActivationDarkMode":"styles_headingActivationDarkMode__HIv4Q","headingExtra":"styles_headingExtra__H9RV+","headingExtraDarkMode":"styles_headingExtraDarkMode__gVghd","metaItem":"styles_metaItem__wEnyV","metaItemDarkMode":"styles_metaItemDarkMode__oscOW","content":"styles_content__VHVQW","extra":"styles_extra__BgeMp","optionsExtra":"styles_optionsExtra__sGUAz","option":"styles_option__CeFrr","spell":"styles_spell__ALA7t","spellSummary":"styles_spellSummary__jnsgS","spellDarkMode":"styles_spellDarkMode__SgcTk","actionLimited":"styles_actionLimited__orOxq","actionLimitedLabel":"styles_actionLimitedLabel__Nx2-8","actionLimitedLabelDarkMode":"styles_actionLimitedLabelDarkMode__+eNQ+","actionSummaryDarkMode":"styles_actionSummaryDarkMode__uS13M","limitedUse":"styles_limitedUse__luxnK","limitedUseUsages":"styles_limitedUseUsages__ky4cK","limitedUseUsage":"styles_limitedUseUsage__fGgfq","limitedUseSep":"styles_limitedUseSep__wstRI","limitedUseExtra":"styles_limitedUseExtra__fqQQS","limitedUseDarkMode":"styles_limitedUseDarkMode__fxbri","spellsLayoutCompact":"styles_spellsLayoutCompact__o3KDb","spellSep":"styles_spellSep__+eFUm","choiceDarkMode":"styles_choiceDarkMode__HjeED"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/DeathSummary/styles.module.css?f925 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/DeathSummary/styles.module.css?f925
new file mode 100644
index 0000000..63587d3
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/DeathSummary/styles.module.css?f925
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__Fu1MZ","mark":"styles_mark__Bh8GU","marks":"styles_marks__Qc6dL","inactiveMark":"styles_inactiveMark__7GvsC","activeMark-fail":"styles_activeMark-fail__wouoe","activeMarkDarkMode-fail":"styles_activeMarkDarkMode-fail__8sHkm","activeMark-success":"styles_activeMark-success__XENxG","activeMarkDarkMode-success":"styles_activeMarkDarkMode-success__d3gXa","label":"styles_label__re3ZT","group":"styles_group__FzSjU","deathSaves":"styles_deathSaves__QXYM1","exhaustion":"styles_exhaustion__w+W0O","icon":"styles_icon__ncU6F","deathLabel":"styles_deathLabel__q52Ed","exhaustionLabel":"styles_exhaustionLabel__tf6pq","iconDarkMode":"styles_iconDarkMode__DgxJl"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/HitPointsQuickAdjust/styles.module.css?aa20 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/HitPointsQuickAdjust/styles.module.css?aa20
new file mode 100644
index 0000000..03fff5c
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/HitPointsQuickAdjust/styles.module.css?aa20
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__1cATf","heal":"styles_heal__4AW3J","damage":"styles_damage__cxeXD","input":"styles_input__coHiS","label":"styles_label__s3DaL","content":"styles_content__CwSNH","button":"styles_button__ZEn+Q"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/HitPointsSummary/styles.module.css?0023 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/HitPointsSummary/styles.module.css?0023
new file mode 100644
index 0000000..0354292
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/HitPointsSummary/styles.module.css?0023
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__nsTN6","innerContainer":"styles_innerContainer__Xn2+o","item":"styles_item__UVpsr","spacer":"styles_spacer__fglT0","label":"styles_label__ysVMP","input":"styles_input__op0gN","number":"styles_number__j1d93","maxContainer":"styles_maxContainer__mt+Ff","originalMax":"styles_originalMax__8BVRy","positive":"styles_positive__MuyP7","negative":"styles_negative__GONXJ","slash":"styles_slash__UmBPf","valueButton":"styles_valueButton__0rK5Z","temp":"styles_temp__pxAha","tempEmpty":"styles_tempEmpty__fI4gV"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/styles.module.css?035e b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/styles.module.css?035e
new file mode 100644
index 0000000..fd77236
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/HitPointsBox/styles.module.css?035e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"hitPointsBox":"styles_hitPointsBox__iqcr7","content":"styles_content__nPt0e","label":"styles_label__Ivf2i"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/InitiativeBox/styles.module.css?905f b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/InitiativeBox/styles.module.css?905f
new file mode 100644
index 0000000..5e8e0fe
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/InitiativeBox/styles.module.css?905f
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"numberColorOverride":"styles_numberColorOverride__yIkhq","box":"styles_box__PLQui","label":"styles_label__6xv1b","dark":"styles_dark__Vo9m3","value":"styles_value__hqDak","advantage":"styles_advantage__wjAyd","mobile":"styles_mobile__DSVG6","advantageIcon":"styles_advantageIcon__8gaN6","boxMobile":"styles_boxMobile__5e4Sm","valueMobile":"styles_valueMobile__XCC2z","labelMobile":"styles_labelMobile__kN2Is"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Inspiration/styles.module.css?c065 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Inspiration/styles.module.css?c065
new file mode 100644
index 0000000..c868de8
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Inspiration/styles.module.css?c065
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"box":"styles_box__6xvSR","interactive":"styles_interactive__0wY9H","status":"styles_status__wfjbc","label":"styles_label__Bj6YW","dark":"styles_dark__+NBMD","mobileWrapper":"styles_mobileWrapper__HJy9T","mobileButton":"styles_mobileButton__Y5iMu","active":"styles_active__AdRTc"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/MobileNav/SectionButton/styles.module.css?2377 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/MobileNav/SectionButton/styles.module.css?2377
new file mode 100644
index 0000000..10f50f1
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/MobileNav/SectionButton/styles.module.css?2377
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"sectionButton":"styles_sectionButton__DLVhH"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/MobileNav/SectionMenu/styles.module.css?b761 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/MobileNav/SectionMenu/styles.module.css?b761
new file mode 100644
index 0000000..dd14d71
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/MobileNav/SectionMenu/styles.module.css?b761
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"sectionNav":"styles_sectionNav__LQ33s","fullWidth":"styles_fullWidth__dRMhB","backdrop":"styles_backdrop__3GIE2","mobile":"styles_mobile__6xVb4"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/MobileNav/styles.module.css?e560 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/MobileNav/styles.module.css?e560
new file mode 100644
index 0000000..4d03852
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/MobileNav/styles.module.css?e560
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"mobileNav":"styles_mobileNav__0wxie","sidebarToggle":"styles_sidebarToggle__GQqor","navToggle":"styles_navToggle__0Wm5t","icon":"styles_icon__3Mr+J"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Header/styles.module.css?a233 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Header/styles.module.css?a233
new file mode 100644
index 0000000..1245af1
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Header/styles.module.css?a233
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"callout":"styles_callout__Sf-W2","heading":"styles_heading__j5Lvn","interactive":"styles_interactive__wFv0p"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Heading/styles.module.css?81ba b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Heading/styles.module.css?81ba
new file mode 100644
index 0000000..5653c1d
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Heading/styles.module.css?81ba
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"clickable":"styles_clickable__d8j9q"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Pane/styles.module.css?a7f3 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Pane/styles.module.css?a7f3
new file mode 100644
index 0000000..5d951b1
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Pane/styles.module.css?a7f3
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"pane":"styles_pane__AOt0h","border":"styles_border__jHreB","bottom":"styles_bottom__De0fd","gap":"styles_gap__kuwYv","dark":"styles_dark__6-qrS","content":"styles_content__3knKz","fullWidth":"styles_fullWidth__SRmoS"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneContent/styles.module.css?a167 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneContent/styles.module.css?a167
new file mode 100644
index 0000000..6e80981
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneContent/styles.module.css?a167
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"default":"styles_default__s30DK","maxHeight":"styles_maxHeight__-x5CV"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneControls/styles.module.css?79d1 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneControls/styles.module.css?79d1
new file mode 100644
index 0000000..4ac5558
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneControls/styles.module.css?79d1
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"controls":"styles_controls__-K4FO","label":"styles_label__qP9gK","button":"styles_button__pEmHw","dark":"styles_dark__EjgJa"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuGroup/styles.module.css?5617 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuGroup/styles.module.css?5617
new file mode 100644
index 0000000..5c221c4
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuGroup/styles.module.css?5617
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"group":"styles_group__tWuIt","label":"styles_label__uDuw3"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuItem/styles.module.css?80fd b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuItem/styles.module.css?80fd
new file mode 100644
index 0000000..990bde7
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneMenu/PaneMenuItem/styles.module.css?80fd
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"item":"styles_item__-oPdy","label":"styles_label__ZLSbA","prefixIcon":"styles_prefixIcon__ikqN1","suffixIcon":"styles_suffixIcon__8XdVT"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneMenu/styles.module.css?92e6 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneMenu/styles.module.css?92e6
new file mode 100644
index 0000000..0a87fd5
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/PaneMenu/styles.module.css?92e6
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"menu":"styles_menu__phzoW"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/ProgressBar/Bar/styles.module.css?2324 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/ProgressBar/Bar/styles.module.css?2324
new file mode 100644
index 0000000..5499063
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/ProgressBar/Bar/styles.module.css?2324
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"bar":"styles_bar__zBc+W","active":"styles_active__K1oX4","implied":"styles_implied__kx5RO"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/ProgressBar/styles.module.css?d428 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/ProgressBar/styles.module.css?d428
new file mode 100644
index 0000000..30cebb4
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/ProgressBar/styles.module.css?d428
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"progressBar":"styles_progressBar__aW4jZ"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/QuickActions/styles.module.css?531d b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/QuickActions/styles.module.css?531d
new file mode 100644
index 0000000..53b9b04
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/QuickActions/styles.module.css?531d
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__qMov9","title":"styles_title__KJx8e","buttons":"styles_buttons__ccOs6"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Sidebar/styles.module.css?9afa b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Sidebar/styles.module.css?9afa
new file mode 100644
index 0000000..4873c71
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/Sidebar/styles.module.css?9afa
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"sidebar":"styles_sidebar__RrEHr","mask":"styles_mask__nuvIu","visible":"styles_visible__6s+G-","syncBlocker":"styles_syncBlocker__swk16","hidden":"styles_hidden__NRO1j","right":"styles_right__e4y1G","left":"styles_left__N7X7-"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/VisiblilityControls/styles.module.css?9171 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/VisiblilityControls/styles.module.css?9171
new file mode 100644
index 0000000..1002856
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/components/VisiblilityControls/styles.module.css?9171
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"controls":"styles_controls__NSnn3","left":"styles_left__4n2Ak","locked":"styles_locked__acLz2","visibility":"styles_visibility__MJ05x","closed":"styles_closed__eORko","arrows":"styles_arrows__182cG","overlay":"styles_overlay__Uf4kU","placement":"styles_placement__SZZi-","active":"styles_active__tWFiD","hidden":"styles_hidden__TZAl9"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/AbilityPane/styles.module.css?973b b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/AbilityPane/styles.module.css?973b
new file mode 100644
index 0000000..9232e80
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/AbilityPane/styles.module.css?973b
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"modifier":"styles_modifier__ecyZh","signedNumber":"styles_signedNumber__hCdrI","icon":"styles_icon__Teo4H","description":"styles_description__jru+3"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/AbilitySavingThrowsPane/styles.module.css?26d2 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/AbilitySavingThrowsPane/styles.module.css?26d2
new file mode 100644
index 0000000..0bcd740
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/AbilitySavingThrowsPane/styles.module.css?26d2
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"situationalBonus":"styles_situationalBonus__F2eEF","situationalBonusIcon":"styles_situationalBonusIcon__xcuhT","situationalBonusValue":"styles_situationalBonusValue__YW2Ct","situationalBonusRestriction":"styles_situationalBonusRestriction__EzAUx","icon":"styles_icon__xUwGC","modifier":"styles_modifier__upFYh","editorBox":"styles_editorBox__R55hp","description":"styles_description__o4+Jg","customize":"styles_customize__2Ow13","situational":"styles_situational__LRy5Q"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/ArmorManagePane/ArmorClassDetail/styles.module.css?a7df b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/ArmorManagePane/ArmorClassDetail/styles.module.css?a7df
new file mode 100644
index 0000000..1479f56
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/ArmorManagePane/ArmorClassDetail/styles.module.css?a7df
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"items":"styles_items__rtrOH","itemsOverridden":"styles_itemsOverridden__REMBT","item":"styles_item__SQmPn","value":"styles_value__ZbR1s","label":"styles_label__usGSs","source":"styles_source__oZAaC"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/ArmorManagePane/styles.module.css?b166 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/ArmorManagePane/styles.module.css?b166
new file mode 100644
index 0000000..06bff78
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/ArmorManagePane/styles.module.css?b166
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"headingOverride":"styles_headingOverride__Wrml1","customize":"styles_customize__JoJhJ","description":"styles_description__iRcZV","editorBox":"styles_editorBox__mCHv-"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/BackgroundPane/styles.module.css?c568 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/BackgroundPane/styles.module.css?c568
new file mode 100644
index 0000000..6f3a0e9
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/BackgroundPane/styles.module.css?c568
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"data":"styles_data__6Ke5h","choices":"styles_choices__cQ6Uf","customDescription":"styles_customDescription__cliPz"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CampaignPane/CampaignCharacter/styles.module.css?9749 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CampaignPane/CampaignCharacter/styles.module.css?9749
new file mode 100644
index 0000000..df775bb
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CampaignPane/CampaignCharacter/styles.module.css?9749
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"character":"styles_character__EBU8r","preview":"styles_preview__FStNG","content":"styles_content__Nsmm5","name":"styles_name__zdELr","link":"styles_link__60Pm5","darkMode":"styles_darkMode__r9I3g","user":"styles_user__FIMJh","current":"styles_current__-cmPI"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CampaignPane/styles.module.css?5f12 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CampaignPane/styles.module.css?5f12
new file mode 100644
index 0000000..6770e46
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CampaignPane/styles.module.css?5f12
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"header":"styles_header__Zw45J","launchButton":"styles_launchButton__k-GHf","name":"styles_name__rOL8F","link":"styles_link__SvtS+","dm":"styles_dm__kfeHJ","dmLabel":"styles_dmLabel__1w4c+","characters":"styles_characters__yP6mY"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CharacterManagePane/Overview/styles.module.css?5a7e b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CharacterManagePane/Overview/styles.module.css?5a7e
new file mode 100644
index 0000000..45df362
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CharacterManagePane/Overview/styles.module.css?5a7e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"intro":"styles_intro__DxeXR","dark":"styles_dark__ah1o8","summary":"styles_summary__UPXYJ","avatar":"styles_avatar__t7tEz","characterName":"styles_characterName__vGRGp","editName":"styles_editName__j5saI","playerNameLabel":"styles_playerNameLabel__A6cDe","description":"styles_description__jCVoT","summaryText":"styles_summaryText__SkkYY","featureCallout":"styles_featureCallout__hhyL3","decorateButton":"styles_decorateButton__ubbJq","classList":"styles_classList__J5Oib","classItem":"styles_classItem__h4PG2","classImage":"styles_classImage__S3Nvj","classLevel":"styles_classLevel__QZRKd","classSummary":"styles_classSummary__190Xx","classMeta":"styles_classMeta__Pd+W2","buttonGroup":"styles_buttonGroup__22Vci","toggleButton":"styles_toggleButton__AIjDx","popoverToggle":"styles_popoverToggle__fZbTK"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CharacterManagePane/styles.module.css?8c4f b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CharacterManagePane/styles.module.css?8c4f
new file mode 100644
index 0000000..a865c83
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CharacterManagePane/styles.module.css?8c4f
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"characterManagePane":"styles_characterManagePane__cAzM6","readonlyBackground":"styles_readonlyBackground__tarm0","readonlyContent":"styles_readonlyContent__wP0Ou","createCTA":"styles_createCTA__Kf8BK"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/ClassFeaturePane/styles.module.css?a8dd b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/ClassFeaturePane/styles.module.css?a8dd
new file mode 100644
index 0000000..f189285
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/ClassFeaturePane/styles.module.css?a8dd
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"choice":"styles_choice__eGzfJ","heading":"styles_heading__IAIav"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CreaturePane/styles.module.css?a086 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CreaturePane/styles.module.css?a086
new file mode 100644
index 0000000..565478b
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/CreaturePane/styles.module.css?a086
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"hasSeparator":"styles_hasSeparator__bt+oM","editor":"styles_editor__2LRH5","adjuster":"styles_adjuster__nYWFR","adjusterGroups":"styles_adjusterGroups__FGr5e","adjusterGroup":"styles_adjusterGroup__VnOOV","adjusterLabel":"styles_adjusterLabel__0ow0E","adjusterValue":"styles_adjusterValue__MTXUi","hasTempHp":"styles_hasTempHp__u0ODs","valueSep":"styles_valueSep__LDCJN","adjusterInput":"styles_adjusterInput__cnjFW","block":"styles_block__sWA-s","description":"styles_description__0EV8N","img":"styles_img__Wfy4f","removeButton":"styles_removeButton__4BIB2","wildshapeInfo":"styles_wildshapeInfo__ZoMbb","deathSummary":"styles_deathSummary__5GfCk","hitPointsContainer":"styles_hitPointsContainer__6UiRO"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatPane/styles.module.css?d36b b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatPane/styles.module.css?d36b
new file mode 100644
index 0000000..f216d79
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatPane/styles.module.css?d36b
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"prereq":"styles_prereq__o5NEq","choices":"styles_choices__Mjwc3","footer":"styles_footer__sv5q-"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatsManagePane/Feat/styles.module.css?e357 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatsManagePane/Feat/styles.module.css?e357
new file mode 100644
index 0000000..0ee57eb
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatsManagePane/Feat/styles.module.css?e357
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"feat":"styles_feat__Nx82d","failures":"styles_failures__k8p3h","button":"styles_button__sVhQH","origin":"styles_origin__-dXV5","originLabel":"styles_originLabel__Nw8b3","originName":"styles_originName__GF1cV","detail":"styles_detail__uKEIS","dark":"styles_dark__bJz2c","source":"styles_source__mGp+A"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatDetail/styles.module.css?237d b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatDetail/styles.module.css?237d
new file mode 100644
index 0000000..7db6c54
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatsManagePane/FeatDetail/styles.module.css?237d
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"prereq":"styles_prereq__Z1-KB","choices":"styles_choices__rEiI9"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatsManagePane/styles.module.css?f5f9 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatsManagePane/styles.module.css?f5f9
new file mode 100644
index 0000000..fba6076
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/FeatsManagePane/styles.module.css?f5f9
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"featList":"styles_featList__gQH8v","unavailableCallout":"styles_unavailableCallout__w6jxZ"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/GameLogPane/styles.module.css?d67a b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/GameLogPane/styles.module.css?d67a
new file mode 100644
index 0000000..4115027
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/GameLogPane/styles.module.css?d67a
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"gameLogPane":"styles_gameLogPane__fMTTR"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/DeathSavesMarks/styles.module.css?0200 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/DeathSavesMarks/styles.module.css?0200
new file mode 100644
index 0000000..ffe0eb4
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/DeathSavesMarks/styles.module.css?0200
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__Y5BTj","label":"styles_label__ojyMa","marks":"styles_marks__XOJF3","mark":"styles_mark__sxhtQ","activeMark":"styles_activeMark__TUwkZ","willBeActive":"styles_willBeActive__GkEMg","willBeFail":"styles_willBeFail__Wi0zQ"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/styles.module.css?0b7b b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/styles.module.css?0b7b
new file mode 100644
index 0000000..30c19ae
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/DeathSavesManager/styles.module.css?0b7b
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"column":"styles_column__WGmVi","row":"styles_row__TVwfl","heading":"styles_heading__lusGQ","deathSavesGroups":"styles_deathSavesGroups__y9N7Q","diceAdjustments":"styles_diceAdjustments__b-pTs"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsAdjuster/styles.module.css?b60a b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsAdjuster/styles.module.css?b60a
new file mode 100644
index 0000000..d61f624
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsAdjuster/styles.module.css?b60a
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__2ogER","row":"styles_row__Urkup","column":"styles_column__mt+gc","inputsContainer":"styles_inputsContainer__CbmMr","inputContainer":"styles_inputContainer__Lnmld","healingContainer":"styles_healingContainer__V2+4y","damageContainer":"styles_damageContainer__DkOxl","input":"styles_input__lzRfF","newValues":"styles_newValues__tBVYh","modifyButtons":"styles_modifyButtons__Hbyru","inputLabel":"styles_inputLabel__VasOY","positiveColor":"styles_positiveColor__DEfXY","negativeColor":"styles_negativeColor__2rFBs","label":"styles_label__mCSwE","value":"styles_value__3Egg6","increase":"styles_increase__8X2Yq","decrease":"styles_decrease__ALj21","applyButtons":"styles_applyButtons__1jpw-","protectionNotice":"styles_protectionNotice__Xxmgl"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsOverrides/styles.module.css?fa48 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsOverrides/styles.module.css?fa48
new file mode 100644
index 0000000..e1ff3c3
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/HitPointsOverrides/styles.module.css?fa48
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"column":"styles_column__YJjtb","row":"styles_row__egceJ","overrides":"styles_overrides__Dw9eH","override":"styles_override__UI455","label":"styles_label__AMNUN","input":"styles_input__0NBCk"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/RestoreLifeManager/styles.module.css?c396 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/RestoreLifeManager/styles.module.css?c396
new file mode 100644
index 0000000..b3f216b
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/RestoreLifeManager/styles.module.css?c396
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"heading":"styles_heading__oDAmA","actions":"styles_actions__NFU6h"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/styles.module.css?9a2f b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/styles.module.css?9a2f
new file mode 100644
index 0000000..68e920e
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/HitPointsManagePane/styles.module.css?9a2f
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__HqPuh","border":"styles_border__5xwH4"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/InitiativePane/styles.module.css?4c70 b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/InitiativePane/styles.module.css?4c70
new file mode 100644
index 0000000..1bce050
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/InitiativePane/styles.module.css?4c70
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"modifier":"styles_modifier__JOuPe","signedNumber":"styles_signedNumber__WnyDN","advantageIcon":"styles_advantageIcon__gurZL","container":"styles_container__mWGI9","amount":"styles_amount__mf1GT","label":"styles_label__2nFLs","labelSecondary":"styles_labelSecondary__Tkv4p","isAdvantage":"styles_isAdvantage__yao0T","score":"styles_score__MeNyl"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/XpPane/styles.module.css?64ba b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/XpPane/styles.module.css?64ba
new file mode 100644
index 0000000..f5d2d8f
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/subApps/sheet/components/Sidebar/panes/XpPane/styles.module.css?64ba
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"buttonGroup":"styles_buttonGroup__y6Yl5"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/svgs/styles.module.css?6d0f b/ddb_main/webpack:/@dndbeyond/character-app/src/svgs/styles.module.css?6d0f
new file mode 100644
index 0000000..b3a4f8c
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/svgs/styles.module.css?6d0f
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"borderBg":"styles_borderBg__hTiiJ","borderStroke":"styles_borderStroke__YCw40","borderFill":"styles_borderFill__xRxpl"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/CharacterBuilder/styles.module.css?0085 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/CharacterBuilder/styles.module.css?0085
new file mode 100644
index 0000000..2e93c6d
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/CharacterBuilder/styles.module.css?0085
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"characterBuilder":"styles_characterBuilder__-atY5"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/ProgressionManager/styles.module.css?fc7e b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/ProgressionManager/styles.module.css?fc7e
new file mode 100644
index 0000000..44eb015
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/ProgressionManager/styles.module.css?fc7e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"xpManagerModal":"styles_xpManagerModal__gu+jr","xpManager":"styles_xpManager__2okDm"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/pages/DescriptionManage/styles.module.css?cacc b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/pages/DescriptionManage/styles.module.css?cacc
new file mode 100644
index 0000000..198e036
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/pages/DescriptionManage/styles.module.css?cacc
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"accordionGroup":"styles_accordionGroup__ijLDx"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/pages/SpeciesManage/styles.module.css?a202 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/pages/SpeciesManage/styles.module.css?a202
new file mode 100644
index 0000000..fc70826
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterBuilder/containers/pages/SpeciesManage/styles.module.css?a202
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"summaryList":"styles_summaryList__-zLwh"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/components/ActionsList/styles.module.css?6a7e b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/components/ActionsList/styles.module.css?6a7e
new file mode 100644
index 0000000..91c3898
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/components/ActionsList/styles.module.css?6a7e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"actionsList":"styles_actionsList__tw2cW","heading":"styles_heading__jqSRm","darkMode":"styles_darkMode__5poHa","sectionHeading":"styles_sectionHeading__f715p","section":"styles_section__sO+fQ","list":"styles_list__8r0ai","activatable":"styles_activatable__ismyq","attackTable":"styles_attackTable__E+HtW"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/Description/styles.module.css?49fc b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/Description/styles.module.css?49fc
new file mode 100644
index 0000000..e8e9b66
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/Description/styles.module.css?49fc
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"physical":"styles_physical__2aytL"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/PrimaryBox/styles.module.css?2431 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/PrimaryBox/styles.module.css?2431
new file mode 100644
index 0000000..1bb624b
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/PrimaryBox/styles.module.css?2431
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"tabList":"styles_tabList__Q4CqK"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/Spells/styles.module.css?5452 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/Spells/styles.module.css?5452
new file mode 100644
index 0000000..881514a
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/Spells/styles.module.css?5452
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"tabFilter":"styles_tabFilter__kfTU6"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/mobile/CombatMobile/styles.module.css?1ce3 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/mobile/CombatMobile/styles.module.css?1ce3
new file mode 100644
index 0000000..f51b0de
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/CharacterSheet/containers/mobile/CombatMobile/styles.module.css?1ce3
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"numberColorOverride":"styles_numberColorOverride__foKbc"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/ActionDetail/styles.module.css?aeff b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/ActionDetail/styles.module.css?aeff
new file mode 100644
index 0000000..663205d
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/ActionDetail/styles.module.css?aeff
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"removeCustomizations":"styles_removeCustomizations__rs3hD","limitedUses":"styles_limitedUses__SvZpb","limitedUsesLabel":"styles_limitedUsesLabel__bzPAR","customize":"styles_customize__QE2bY","customizeEditorBox":"styles_customizeEditorBox__atuBx","properties":"styles_properties__rAEzm","description":"styles_description__uABlx","marketplaceCta":"styles_marketplaceCta__KpQfY","actions":"styles_actions__2+vsY","rangeShape":"styles_rangeShape__-TgU+","rangeIcon":"styles_rangeIcon__42aSz"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/ItemDetail/styles.module.css?965b b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/ItemDetail/styles.module.css?965b
new file mode 100644
index 0000000..a192ec6
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/ItemDetail/styles.module.css?965b
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"action":"styles_action__Q1OAQ","label":"styles_label__-pkXo"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/common/FormCheckBoxesField/styles.module.css?5670 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/common/FormCheckBoxesField/styles.module.css?5670
new file mode 100644
index 0000000..1728b71
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/common/FormCheckBoxesField/styles.module.css?5670
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"checkboxesContainer":"styles_checkboxesContainer__DByDO","checkboxesContainerSidebar":"styles_checkboxesContainerSidebar__9Bum3","summary":"styles_summary__vZWo7","summaryHeadingGroup":"styles_summaryHeadingGroup__XfsFl","summaryHeadingGroupSingle":"styles_summaryHeadingGroupSingle__5tsPB","summaryHeading":"styles_summaryHeading__SfBpd","summaryHeadingAll":"styles_summaryHeadingAll__n9BMK","summaryHeadingSidebar":"styles_summaryHeadingSidebar__Mysoi","summaryHeadingDefault":"styles_summaryHeadingDefault__D9ybk","summaryHeadingSidebarDark":"styles_summaryHeadingSidebarDark__sVQho","summaryDescription":"styles_summaryDescription__igl5h","summaryDescriptionSidebar":"styles_summaryDescriptionSidebar__2Pe0m","container":"styles_container__ZSjfD","group":"styles_group__SmsdD","description":"styles_description__Njdcu","descriptionDefault":"styles_descriptionDefault__Ho3bm","checkbox":"styles_checkbox__uOLKo","groupLabel":"styles_groupLabel__GjC3U","groupLabelDefault":"styles_groupLabelDefault__XF9nB","accordion":"styles_accordion__iDhGi","accordionHeadingDark":"styles_accordionHeadingDark__tjv6O","accordionSidebarDescription":"styles_accordionSidebarDescription__cgu6b","summaryBuilder":"styles_summaryBuilder__s9yGA","accordionBuilder":"styles_accordionBuilder__lcHQp","checkboxWrapper":"styles_checkboxWrapper__UHUmj","accordionSidebar":"styles_accordionSidebar__ICYlk"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/common/FormSelectField/styles.module.css?28e5 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/common/FormSelectField/styles.module.css?28e5
new file mode 100644
index 0000000..ac60662
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/common/FormSelectField/styles.module.css?28e5
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"summaryDescription":"styles_summaryDescription__kSPq8"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/legacy/SpellList/styles.module.css?529f b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/legacy/SpellList/styles.module.css?529f
new file mode 100644
index 0000000..ed271b5
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/legacy/SpellList/styles.module.css?529f
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"spell":"styles_spell__yDHQ1","callout":"styles_callout__qugv2"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/legacy/SpellManagerGroup/styles.module.css?e039 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/legacy/SpellManagerGroup/styles.module.css?e039
new file mode 100644
index 0000000..9a83914
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/Shared/components/legacy/SpellManagerGroup/styles.module.css?e039
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"spell":"styles_spell__VQ1d8"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/AttackTable/styles.module.css?ae00 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/AttackTable/styles.module.css?ae00
new file mode 100644
index 0000000..a626962
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/AttackTable/styles.module.css?ae00
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"tableHeader":"styles_tableHeader__Ow6Oy","col":"styles_col__3hY1K","icon":"styles_icon__1IA7a","name":"styles_name__MDLaF","range":"styles_range__Wxk2r","tohit":"styles_tohit__zsX78","damage":"styles_damage__2d1fl","notes":"styles_notes__mSXl3","darkMode":"styles_darkMode__jYXhg","default":"styles_default__IGSO3","dark-mode":"styles_dark-mode__usj3L","attack":"styles_attack__6-4vH"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/CampaignSummary/styles.module.css?0f60 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/CampaignSummary/styles.module.css?0f60
new file mode 100644
index 0000000..8c910b6
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/CampaignSummary/styles.module.css?0f60
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__9OvpY","campaignSummary":"styles_campaignSummary__eY5SU","summaryLabel":"styles_summaryLabel__xq6fg","summaryName":"styles_summaryName__wOtsW","campaignButtonGroup":"styles_campaignButtonGroup__f3klc","campaignButton":"styles_campaignButton__UQvTD","campaignButtonIcon":"styles_campaignButtonIcon__0f687","campaignPlayButtonIcon":"styles_campaignPlayButtonIcon__SrRu5"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/CharacterSettingsModal/styles.module.css?e527 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/CharacterSettingsModal/styles.module.css?e527
new file mode 100644
index 0000000..4097dc8
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/CharacterSettingsModal/styles.module.css?e527
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"modal":"styles_modal__Vde2C","modalTitle":"styles_modalTitle__qUAgz","modalDescription":"styles_modalDescription__THdXA","content":"styles_content__qCeIC"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/Icons/ConcentrationIcon/styles.module.css?6f55 b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/Icons/ConcentrationIcon/styles.module.css?6f55
new file mode 100644
index 0000000..2d5a2b1
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/Icons/ConcentrationIcon/styles.module.css?6f55
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"concentrationIcon":"styles_concentrationIcon__BsaNr","svg":"styles_svg__Jr+M-"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/Icons/RitualIcon/styles.module.css?fa0b b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/Icons/RitualIcon/styles.module.css?fa0b
new file mode 100644
index 0000000..38c05d2
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/Icons/RitualIcon/styles.module.css?fa0b
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"ritualIcon":"styles_ritualIcon__FzUfW","svg":"styles_svg__sB7Is"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/PrivacyTypeRadio/styles.module.css?183e b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/PrivacyTypeRadio/styles.module.css?183e
new file mode 100644
index 0000000..cbd02c1
--- /dev/null
+++ b/ddb_main/webpack:/@dndbeyond/character-app/src/tools/js/smartComponents/PrivacyTypeRadio/styles.module.css?183e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"styles_container__qArk1","containerSidebar":"styles_containerSidebar__Aioan","containerBuilder":"styles_containerBuilder__EA3ps","heading":"styles_heading__r8uTf","headingBuilder":"styles_headingBuilder__flMJw","headingSidebar":"styles_headingSidebar__niAL0","headingSidebarDark":"styles_headingSidebarDark__JmsSY","radioGroup":"styles_radioGroup__MV2Tp","radioInfoGroup":"styles_radioInfoGroup__JxOhp","radioHeading":"styles_radioHeading__ht6y-","radioHeadingBuilder":"styles_radioHeadingBuilder__xQHaV","radioHeadingSidebar":"styles_radioHeadingSidebar__NNrDM","radioDescription":"styles_radioDescription__utQIu","radioDescriptionSidebar":"styles_radioDescriptionSidebar__QFbuH","radioDescriptionDark":"styles_radioDescriptionDark__slQ+F","buttonChecked":"styles_buttonChecked__wGG-i","buttonCheckedBuilder":"styles_buttonCheckedBuilder__GXYNy","themed":"styles_themed__wkwHg"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Button/styles/Button.module.css?6bc6 b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Button/styles/Button.module.css?6bc6
new file mode 100644
index 0000000..62e3611
--- /dev/null
+++ b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Button/styles/Button.module.css?6bc6
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"button":"Button_button__B9Kr5"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Button/styles/ButtonSizes.module.css?afd9 b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Button/styles/ButtonSizes.module.css?afd9
new file mode 100644
index 0000000..3f56ebc
--- /dev/null
+++ b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Button/styles/ButtonSizes.module.css?afd9
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"x-small":"ButtonSizes_x-small__AQ7c6","small":"ButtonSizes_small__zsC6U","medium":"ButtonSizes_medium__uHe8x","large":"ButtonSizes_large__KHVgJ","x-large":"ButtonSizes_x-large__b+Vhb"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Button/styles/ButtonVariants.module.css?c266 b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Button/styles/ButtonVariants.module.css?c266
new file mode 100644
index 0000000..dd3f2fa
--- /dev/null
+++ b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Button/styles/ButtonVariants.module.css?c266
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"primary":"ButtonVariants_primary__TMQ5y","secondary":"ButtonVariants_secondary__Z0czz","success":"ButtonVariants_success__OhFyN","info":"ButtonVariants_info__+w8ox","warning":"ButtonVariants_warning__qCfwB","error":"ButtonVariants_error__6SkiQ","outline":"ButtonVariants_outline__v36Mn","svg":"ButtonVariants_svg__Si33n","text":"ButtonVariants_text__vKMzd"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Checkbox/Checkbox.module.css?d901 b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Checkbox/Checkbox.module.css?d901
new file mode 100644
index 0000000..8972c7b
--- /dev/null
+++ b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Checkbox/Checkbox.module.css?d901
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"Checkbox_container__Z2TB6","inputContainer":"Checkbox_inputContainer__82z5+","checkbox":"Checkbox_checkbox__GJtMy","label":"Checkbox_label__E45gj","disabled":"Checkbox_disabled__jTmMo"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Dialog/Dialog.module.css?da7c b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Dialog/Dialog.module.css?da7c
new file mode 100644
index 0000000..f66a480
--- /dev/null
+++ b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Dialog/Dialog.module.css?da7c
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"dialog":"Dialog_dialog__+k9ss"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/InfoItem/InfoItem.module.css?208e b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/InfoItem/InfoItem.module.css?208e
new file mode 100644
index 0000000..a48c0c6
--- /dev/null
+++ b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/InfoItem/InfoItem.module.css?208e
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"label":"InfoItem_label__+wkfa","value":"InfoItem_value__rVPhW","center":"InfoItem_center__HbBET","inline":"InfoItem_inline__dPVzd","italic":"InfoItem_italic__BcHBi","primary":"InfoItem_primary__p59hF","secondary":"InfoItem_secondary__hFoEA","error":"InfoItem_error__Z6qI7","success":"InfoItem_success__THYfY","warning":"InfoItem_warning__kROl9","info":"InfoItem_info__wC5o7"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/LabelChip/LabelChip.module.css?7f23 b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/LabelChip/LabelChip.module.css?7f23
new file mode 100644
index 0000000..937bc38
--- /dev/null
+++ b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/LabelChip/LabelChip.module.css?7f23
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"labelChip":"LabelChip_labelChip__FFNJv"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Select/Select.module.css?fcff b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Select/Select.module.css?fcff
new file mode 100644
index 0000000..3665a51
--- /dev/null
+++ b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Select/Select.module.css?fcff
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"Select_container__V6JDc","button":"Select_button__3TOVC","options":"Select_options__zDWnd","buttonError":"Select_buttonError__Q9aKj","placeholder":"Select_placeholder__yjeQf","tags":"Select_tags__AdBDH","tag":"Select_tag__LAYi3","option":"Select_option__yv43J","error":"Select_error__vbLFC"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Toast/Toast.module.css?d12d b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Toast/Toast.module.css?d12d
new file mode 100644
index 0000000..a6aeb96
--- /dev/null
+++ b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Toast/Toast.module.css?d12d
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"toast":"Toast_toast__-7nEV","right":"Toast_right__hxp0q","container":"Toast_container__nvzLt"};
\ No newline at end of file
diff --git a/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Tooltip/Tooltip.module.css?48a4 b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Tooltip/Tooltip.module.css?48a4
new file mode 100644
index 0000000..c9958a2
--- /dev/null
+++ b/ddb_main/webpack:/node_modules/@dndbeyond/ttui/components/Tooltip/Tooltip.module.css?48a4
@@ -0,0 +1,2 @@
+// extracted by mini-css-extract-plugin
+export default {"container":"Tooltip_container__20y9m","tooltip":"Tooltip_tooltip__deVx1"};
\ No newline at end of file